open.source/manifold
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Use avatar of user that submitted answer and name instead of pencil icon. Spacing. Show up to 3 comments in asnwer group.

Browse Source
This commit is contained in:
James Grugett 2022-03-14 14:30:13 -05:00
parent 980f32e741
commit 6fd16e448e
2 changed files with 19 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
web/components/feed/activity-items.ts
View File

@ -277,10 +277,8 @@ export function getRecentContractActivityItems(
let items: ActivityItem[] = [] let items: ActivityItem[] = []
if (contract.outcomeType === 'FREE_RESPONSE') { if (contract.outcomeType === 'FREE_RESPONSE') {
// Keep last two comments. // Keep last three comments.
comments = comments.slice(-2) comments = comments.slice(-3)
const lastBet = bets[bets.length - 1]
const outcomeToComments = _.groupBy(comments, (c) => { const outcomeToComments = _.groupBy(comments, (c) => {
const bet = bets.find((bet) => bet.id === c.betId) const bet = bets.find((bet) => bet.id === c.betId)
return bet?.outcome return bet?.outcome
@ -288,6 +286,7 @@ export function getRecentContractActivityItems(
delete outcomeToComments['undefined'] delete outcomeToComments['undefined']
// Include up to 2 outcomes from comments and last bet. // Include up to 2 outcomes from comments and last bet.
const lastBet = bets[bets.length - 1]
const outcomes = filterDefined( const outcomes = filterDefined(
_.uniq([...Object.keys(outcomeToComments), lastBet?.outcome]) _.uniq([...Object.keys(outcomeToComments), lastBet?.outcome])
).slice(-2) ).slice(-2)

33
web/components/feed/feed-items.tsx
View File

@ -8,7 +8,6 @@ import {
LockClosedIcon, LockClosedIcon,
UserIcon, UserIcon,
UsersIcon, UsersIcon,
PencilAltIcon,
XIcon, XIcon,
} from '@heroicons/react/solid' } from '@heroicons/react/solid'
import dayjs from 'dayjs' import dayjs from 'dayjs'
@ -195,9 +194,12 @@ function FeedBet(props: {
<> <>
<div> <div>
{isSelf ? ( {isSelf ? (
<Avatar avatarUrl={user?.avatarUrl} /> <Avatar avatarUrl={user.avatarUrl} username={user.username} />
) : isCreator ? ( ) : isCreator ? (
<Avatar avatarUrl={contract.creatorAvatarUrl} /> <Avatar
avatarUrl={contract.creatorAvatarUrl}
username={contract.creatorUsername}
/>
) : ( ) : (
<div className="relative px-1"> <div className="relative px-1">
<div className="flex h-8 w-8 items-center justify-center rounded-full bg-gray-200"> <div className="flex h-8 w-8 items-center justify-center rounded-full bg-gray-200">
@ -661,25 +663,22 @@ function FeedAnswerGroup(props: {
items: ActivityItem[] items: ActivityItem[]
}) { }) {
const { answer, items } = props const { answer, items } = props
const { username, avatarUrl, userId, name, text } = answer
return ( return (
<Col className="gap-2"> <Col className="gap-2 flex-1">
<Row className="gap-2 mb-2"> <Row className="gap-3 mb-4">
<div> <div className="px-1">
<div className="relative px-1"> <div className="flex h-8 w-8 items-center justify-center rounded-full bg-gray-200">
<div className="flex h-8 w-8 items-center justify-center rounded-full bg-gray-200"> <Avatar username={username} avatarUrl={avatarUrl} />
<PencilAltIcon
className="h-5 w-5 text-gray-500"
aria-hidden="true"
/>
</div>
</div> </div>
</div> </div>
<div className="min-w-0 flex-1 mt-1"> <Col className="min-w-0 flex-1 gap-2">
<div className="text-neutral" style={{ fontSize: 15 }}> <div className="text-sm text-gray-500">
<Linkify text={answer.text} /> <UserLink username={userId} name={name} /> answered
</div> </div>
</div> <Linkify text={text} />
</Col>
</Row> </Row>
{items.map((item, index) => ( {items.map((item, index) => (