feat: auto-show new notes at top
This commit is contained in:
parent
53a67d8233
commit
d1b3a8c4c7
10 changed files with 32 additions and 82 deletions
|
|
@ -84,7 +84,7 @@ export default function KindFilter({
|
|||
variant="ghost"
|
||||
size="titlebar-icon"
|
||||
className={cn(
|
||||
'relative w-fit px-3 hover:text-foreground',
|
||||
'relative hover:text-foreground',
|
||||
!isDifferentFromSaved && 'text-muted-foreground'
|
||||
)}
|
||||
onClick={() => {
|
||||
|
|
|
|||
|
|
@ -1,28 +0,0 @@
|
|||
import { Button } from '@/components/ui/button'
|
||||
import { cn } from '@/lib/utils'
|
||||
import { useUserPreferences } from '@/providers/UserPreferencesProvider'
|
||||
import { Radio } from 'lucide-react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
|
||||
export function LiveFeedToggle() {
|
||||
const { t } = useTranslation()
|
||||
const { enableLiveFeed, updateEnableLiveFeed } = useUserPreferences()
|
||||
|
||||
return (
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="titlebar-icon"
|
||||
title={t(enableLiveFeed ? 'Disable live feed' : 'Enable live feed')}
|
||||
onClick={() => updateEnableLiveFeed(!enableLiveFeed)}
|
||||
>
|
||||
<Radio
|
||||
className={cn(
|
||||
'size-4',
|
||||
enableLiveFeed
|
||||
? 'text-green-400 focus:text-green-300 animate-pulse'
|
||||
: 'text-muted-foreground focus:text-foreground'
|
||||
)}
|
||||
/>
|
||||
</Button>
|
||||
)
|
||||
}
|
||||
|
|
@ -9,8 +9,6 @@ import { TFeedSubRequest, TNoteListMode } from '@/types'
|
|||
import { useMemo, useRef, useState } from 'react'
|
||||
import KindFilter from '../KindFilter'
|
||||
import { RefreshButton } from '../RefreshButton'
|
||||
import { LiveFeedToggle } from '../LiveFeedToggle'
|
||||
import { useUserPreferences } from '@/providers/UserPreferencesProvider'
|
||||
|
||||
export default function NormalFeed({
|
||||
subRequests,
|
||||
|
|
@ -30,7 +28,6 @@ export default function NormalFeed({
|
|||
isPubkeyFeed?: boolean
|
||||
}) {
|
||||
const { showKinds } = useKindFilter()
|
||||
const { enableLiveFeed } = useUserPreferences()
|
||||
const [temporaryShowKinds, setTemporaryShowKinds] = useState(showKinds)
|
||||
const [listMode, setListMode] = useState<TNoteListMode>(() => storage.getNoteListMode())
|
||||
const supportTouch = useMemo(() => isTouchDevice(), [])
|
||||
|
|
@ -88,7 +85,6 @@ export default function NormalFeed({
|
|||
}}
|
||||
/>
|
||||
)}
|
||||
<LiveFeedToggle />
|
||||
{!isPubkeyFeed && <TrustScoreFilter onOpenChange={handleTrustFilterOpenChange} />}
|
||||
{showKindsFilter && (
|
||||
<KindFilter
|
||||
|
|
@ -109,7 +105,6 @@ export default function NormalFeed({
|
|||
areAlgoRelays={areAlgoRelays}
|
||||
showRelayCloseReason={showRelayCloseReason}
|
||||
isPubkeyFeed={isPubkeyFeed}
|
||||
showNewNotesDirectly={enableLiveFeed}
|
||||
/>
|
||||
) : (
|
||||
<NoteList
|
||||
|
|
@ -120,7 +115,6 @@ export default function NormalFeed({
|
|||
areAlgoRelays={areAlgoRelays}
|
||||
showRelayCloseReason={showRelayCloseReason}
|
||||
isPubkeyFeed={isPubkeyFeed}
|
||||
showNewNotesDirectly={enableLiveFeed}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
|
|
|
|||
|
|
@ -338,9 +338,21 @@ const NoteList = forwardRef<
|
|||
oldEvents.some((e) => e.id === event.id) ? oldEvents : [event, ...oldEvents]
|
||||
)
|
||||
} else {
|
||||
setNewEvents((oldEvents) =>
|
||||
[event, ...oldEvents].sort((a, b) => b.created_at - a.created_at)
|
||||
)
|
||||
const isAtTop = (() => {
|
||||
if (!topRef.current) return true
|
||||
const rect = topRef.current.getBoundingClientRect()
|
||||
return rect.top >= 50
|
||||
})()
|
||||
|
||||
if (isAtTop) {
|
||||
setEvents((oldEvents) =>
|
||||
oldEvents.some((e) => e.id === event.id) ? oldEvents : [event, ...oldEvents]
|
||||
)
|
||||
} else {
|
||||
setNewEvents((oldEvents) =>
|
||||
[event, ...oldEvents].sort((a, b) => b.created_at - a.created_at)
|
||||
)
|
||||
}
|
||||
}
|
||||
threadService.addRepliesToThread([event])
|
||||
},
|
||||
|
|
|
|||
|
|
@ -7,14 +7,12 @@ import { generateBech32IdFromETag } from '@/lib/tag'
|
|||
import { isTouchDevice } from '@/lib/utils'
|
||||
import { useKindFilter } from '@/providers/KindFilterProvider'
|
||||
import { useNostr } from '@/providers/NostrProvider'
|
||||
import { useUserPreferences } from '@/providers/UserPreferencesProvider'
|
||||
import client from '@/services/client.service'
|
||||
import storage from '@/services/local-storage.service'
|
||||
import relayInfoService from '@/services/relay-info.service'
|
||||
import { TFeedSubRequest, TNoteListMode } from '@/types'
|
||||
import { NostrEvent } from 'nostr-tools'
|
||||
import { useEffect, useMemo, useRef, useState } from 'react'
|
||||
import { LiveFeedToggle } from '../LiveFeedToggle'
|
||||
import { RefreshButton } from '../RefreshButton'
|
||||
|
||||
export default function ProfileFeed({
|
||||
|
|
@ -27,7 +25,6 @@ export default function ProfileFeed({
|
|||
search?: string
|
||||
}) {
|
||||
const { pubkey: myPubkey, pinListEvent: myPinListEvent } = useNostr()
|
||||
const { enableLiveFeed } = useUserPreferences()
|
||||
const { showKinds } = useKindFilter()
|
||||
const [temporaryShowKinds, setTemporaryShowKinds] = useState(showKinds)
|
||||
const [listMode, setListMode] = useState<TNoteListMode>(() => {
|
||||
|
|
@ -168,7 +165,6 @@ export default function ProfileFeed({
|
|||
options={
|
||||
<>
|
||||
{!supportTouch && <RefreshButton onClick={() => noteListRef.current?.refresh()} />}
|
||||
<LiveFeedToggle />
|
||||
<KindFilter showKinds={temporaryShowKinds} onShowKindsChange={handleShowKindsChange} />
|
||||
</>
|
||||
}
|
||||
|
|
@ -180,7 +176,7 @@ export default function ProfileFeed({
|
|||
hideReplies={listMode === 'posts'}
|
||||
filterMutedNotes={false}
|
||||
pinnedEventIds={listMode === 'you' || !!search ? [] : pinnedEventIds}
|
||||
showNewNotesDirectly={myPubkey === pubkey || enableLiveFeed}
|
||||
showNewNotesDirectly={myPubkey === pubkey}
|
||||
/>
|
||||
</>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -1,8 +1,9 @@
|
|||
import { ScrollArea, ScrollBar } from '@/components/ui/scroll-area'
|
||||
import { Separator } from '@/components/ui/separator'
|
||||
import { cn } from '@/lib/utils'
|
||||
import { useDeepBrowsing } from '@/providers/DeepBrowsingProvider'
|
||||
import { ReactNode, useEffect, useRef, useState } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import { ScrollArea, ScrollBar } from '../ui/scroll-area'
|
||||
|
||||
type TabDefinition = {
|
||||
value: string
|
||||
|
|
@ -124,7 +125,12 @@ export default function Tabs({
|
|||
</div>
|
||||
<ScrollBar orientation="horizontal" className="opacity-0 pointer-events-none" />
|
||||
</ScrollArea>
|
||||
{options && <div className="py-1 flex items-center">{options}</div>}
|
||||
{options && (
|
||||
<div className="py-1 flex items-center gap-1">
|
||||
<Separator orientation="vertical" className="h-8" />
|
||||
{options}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -54,7 +54,6 @@ const UserAggregationList = forwardRef<
|
|||
areAlgoRelays?: boolean
|
||||
showRelayCloseReason?: boolean
|
||||
isPubkeyFeed?: boolean
|
||||
showNewNotesDirectly?: boolean
|
||||
}
|
||||
>(
|
||||
(
|
||||
|
|
@ -64,8 +63,7 @@ const UserAggregationList = forwardRef<
|
|||
filterMutedNotes = true,
|
||||
areAlgoRelays = false,
|
||||
showRelayCloseReason = false,
|
||||
isPubkeyFeed = false,
|
||||
showNewNotesDirectly = false
|
||||
isPubkeyFeed = false
|
||||
},
|
||||
ref
|
||||
) => {
|
||||
|
|
@ -97,8 +95,6 @@ const UserAggregationList = forwardRef<
|
|||
const bottomRef = useRef<HTMLDivElement | null>(null)
|
||||
const topRef = useRef<HTMLDivElement | null>(null)
|
||||
const nonPinnedTopRef = useRef<HTMLDivElement | null>(null)
|
||||
const showNewNotesDirectlyRef = useRef(showNewNotesDirectly)
|
||||
showNewNotesDirectlyRef.current = showNewNotesDirectly
|
||||
|
||||
const scrollToTop = (behavior: ScrollBehavior = 'instant') => {
|
||||
setTimeout(() => {
|
||||
|
|
@ -180,13 +176,9 @@ const UserAggregationList = forwardRef<
|
|||
}
|
||||
},
|
||||
onNew: (event) => {
|
||||
if (showNewNotesDirectlyRef.current) {
|
||||
setEvents((oldEvents) => [event, ...oldEvents])
|
||||
} else {
|
||||
setNewEvents((oldEvents) =>
|
||||
[event, ...oldEvents].sort((a, b) => b.created_at - a.created_at)
|
||||
)
|
||||
}
|
||||
setNewEvents((oldEvents) =>
|
||||
[event, ...oldEvents].sort((a, b) => b.created_at - a.created_at)
|
||||
)
|
||||
threadService.addRepliesToThread([event])
|
||||
},
|
||||
onClose: (url, reason) => {
|
||||
|
|
|
|||
|
|
@ -42,8 +42,8 @@ export const StorageKey = {
|
|||
QUICK_REACTION_EMOJI: 'quickReactionEmoji',
|
||||
NSFW_DISPLAY_POLICY: 'nsfwDisplayPolicy',
|
||||
MIN_TRUST_SCORE: 'minTrustScore',
|
||||
ENABLE_LIVE_FEED: 'enableLiveFeed',
|
||||
DEFAULT_RELAY_URLS: 'defaultRelayUrls',
|
||||
ENABLE_LIVE_FEED: 'enableLiveFeed', // deprecated
|
||||
HIDE_UNTRUSTED_NOTES: 'hideUntrustedNotes', // deprecated
|
||||
HIDE_UNTRUSTED_INTERACTIONS: 'hideUntrustedInteractions', // deprecated
|
||||
HIDE_UNTRUSTED_NOTIFICATIONS: 'hideUntrustedNotifications', // deprecated
|
||||
|
|
|
|||
|
|
@ -21,9 +21,6 @@ type TUserPreferencesContext = {
|
|||
|
||||
quickReactionEmoji: string | TEmoji
|
||||
updateQuickReactionEmoji: (emoji: string | TEmoji) => void
|
||||
|
||||
enableLiveFeed: boolean
|
||||
updateEnableLiveFeed: (enable: boolean) => void
|
||||
}
|
||||
|
||||
const UserPreferencesContext = createContext<TUserPreferencesContext | undefined>(undefined)
|
||||
|
|
@ -48,7 +45,6 @@ export function UserPreferencesProvider({ children }: { children: React.ReactNod
|
|||
)
|
||||
const [quickReaction, setQuickReaction] = useState(storage.getQuickReaction())
|
||||
const [quickReactionEmoji, setQuickReactionEmoji] = useState(storage.getQuickReactionEmoji())
|
||||
const [enableLiveFeed, setEnableLiveFeed] = useState(storage.getEnableLiveFeed())
|
||||
|
||||
useEffect(() => {
|
||||
if (!isSmallScreen && enableSingleColumnLayout) {
|
||||
|
|
@ -83,11 +79,6 @@ export function UserPreferencesProvider({ children }: { children: React.ReactNod
|
|||
storage.setQuickReactionEmoji(emoji)
|
||||
}
|
||||
|
||||
const updateEnableLiveFeed = (enable: boolean) => {
|
||||
setEnableLiveFeed(enable)
|
||||
storage.setEnableLiveFeed(enable)
|
||||
}
|
||||
|
||||
return (
|
||||
<UserPreferencesContext.Provider
|
||||
value={{
|
||||
|
|
@ -102,9 +93,7 @@ export function UserPreferencesProvider({ children }: { children: React.ReactNod
|
|||
quickReaction,
|
||||
updateQuickReaction,
|
||||
quickReactionEmoji,
|
||||
updateQuickReactionEmoji,
|
||||
enableLiveFeed,
|
||||
updateEnableLiveFeed
|
||||
updateQuickReactionEmoji
|
||||
}}
|
||||
>
|
||||
{children}
|
||||
|
|
|
|||
|
|
@ -65,7 +65,6 @@ class LocalStorageService {
|
|||
private quickReactionEmoji: string | TEmoji = '+'
|
||||
private nsfwDisplayPolicy: TNsfwDisplayPolicy = NSFW_DISPLAY_POLICY.HIDE_CONTENT
|
||||
private minTrustScore: number = 40
|
||||
private enableLiveFeed: boolean = false
|
||||
private defaultRelayUrls: string[] = BIG_RELAY_URLS
|
||||
|
||||
constructor() {
|
||||
|
|
@ -278,8 +277,6 @@ class LocalStorageService {
|
|||
}
|
||||
}
|
||||
|
||||
this.enableLiveFeed = window.localStorage.getItem(StorageKey.ENABLE_LIVE_FEED) === 'true'
|
||||
|
||||
const defaultRelayUrlsStr = window.localStorage.getItem(StorageKey.DEFAULT_RELAY_URLS)
|
||||
if (defaultRelayUrlsStr) {
|
||||
try {
|
||||
|
|
@ -305,6 +302,7 @@ class LocalStorageService {
|
|||
window.localStorage.removeItem(StorageKey.ACCOUNT_MUTE_DECRYPTED_TAGS_MAP)
|
||||
window.localStorage.removeItem(StorageKey.ACTIVE_RELAY_SET_ID)
|
||||
window.localStorage.removeItem(StorageKey.FEED_TYPE)
|
||||
window.localStorage.removeItem(StorageKey.ENABLE_LIVE_FEED)
|
||||
}
|
||||
|
||||
getRelaySets() {
|
||||
|
|
@ -634,15 +632,6 @@ class LocalStorageService {
|
|||
}
|
||||
}
|
||||
|
||||
getEnableLiveFeed() {
|
||||
return this.enableLiveFeed
|
||||
}
|
||||
|
||||
setEnableLiveFeed(enable: boolean) {
|
||||
this.enableLiveFeed = enable
|
||||
window.localStorage.setItem(StorageKey.ENABLE_LIVE_FEED, enable.toString())
|
||||
}
|
||||
|
||||
getDefaultRelayUrls() {
|
||||
return this.defaultRelayUrls
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue