diff --git a/src/components/UserAggregationList/index.tsx b/src/components/UserAggregationList/index.tsx index cc7827b..6fd53d5 100644 --- a/src/components/UserAggregationList/index.tsx +++ b/src/components/UserAggregationList/index.tsx @@ -77,6 +77,7 @@ const UserAggregationList = forwardRef< const [since, setSince] = useState(() => dayjs().subtract(1, 'day').unix()) const [events, setEvents] = useState([]) const [newEvents, setNewEvents] = useState([]) + const [newEventPubkeys, setNewEventPubkeys] = useState>(new Set()) const [timelineKey, setTimelineKey] = useState(undefined) const [loading, setLoading] = useState(true) const [showLoadingBar, setShowLoadingBar] = useState(true) @@ -89,6 +90,7 @@ const UserAggregationList = forwardRef< }, [JSON.stringify(subRequests), JSON.stringify(showKinds)]) const bottomRef = useRef(null) const topRef = useRef(null) + const nonPinnedTopRef = useRef(null) const scrollToTop = (behavior: ScrollBehavior = 'instant') => { setTimeout(() => { @@ -322,6 +324,11 @@ const UserAggregationList = forwardRef< const handleViewUser = (agg: TUserAggregation) => { // Mark as viewed when user clicks userAggregationService.markAsViewed(feedId, agg.pubkey) + setNewEventPubkeys((prev) => { + const newSet = new Set(prev) + newSet.delete(agg.pubkey) + return newSet + }) if (agg.count === 1) { const evt = agg.events[0] @@ -340,10 +347,23 @@ const UserAggregationList = forwardRef< } const showNewEvents = () => { + const pubkeySet = new Set() + let hasPinnedUser = false + newEvents.forEach((evt) => { + pubkeySet.add(evt.pubkey) + if (pinnedPubkeySet.has(evt.pubkey)) { + hasPinnedUser = true + } + }) + setNewEventPubkeys(pubkeySet) setEvents((oldEvents) => [...newEvents, ...oldEvents]) setNewEvents([]) setTimeout(() => { - scrollToTop('smooth') + if (hasPinnedUser) { + scrollToTop('smooth') + return + } + nonPinnedTopRef.current?.scrollIntoView({ behavior: 'smooth', block: 'start' }) }, 0) } @@ -355,15 +375,18 @@ const UserAggregationList = forwardRef< feedId={feedId} aggregation={agg} onClick={() => handleViewUser(agg)} + isNew={newEventPubkeys.has(agg.pubkey)} /> ))} +
{normalAggregations.map((agg) => ( handleViewUser(agg)} + isNew={newEventPubkeys.has(agg.pubkey)} /> ))} @@ -436,11 +459,13 @@ export default UserAggregationList function UserAggregationItem({ feedId, aggregation, - onClick + onClick, + isNew }: { feedId: string aggregation: TUserAggregation onClick: () => void + isNew?: boolean }) { const { t } = useTranslation() const supportTouch = useMemo(() => isTouchDevice(), []) @@ -487,7 +512,10 @@ function UserAggregationItem({ return (
{supportTouch ? (