feat: 💨

This commit is contained in:
codytseng
2025-08-28 22:58:47 +08:00
parent 3878b84f4c
commit 35df916a19
17 changed files with 183 additions and 208 deletions

View File

@@ -16,10 +16,12 @@ import {
} from 'react'
import BottomNavigationBar from './components/BottomNavigationBar'
import TooManyRelaysAlertDialog from './components/TooManyRelaysAlertDialog'
import { normalizeUrl } from './lib/url'
import ExplorePage from './pages/primary/ExplorePage'
import MePage from './pages/primary/MePage'
import NotificationListPage from './pages/primary/NotificationListPage'
import ProfilePage from './pages/primary/ProfilePage'
import RelayPage from './pages/primary/RelayPage'
import { NotificationProvider } from './providers/NotificationProvider'
import { useScreenSize } from './providers/ScreenSizeProvider'
import { routes } from './routes'
@@ -28,7 +30,7 @@ import modalManager from './services/modal-manager.service'
export type TPrimaryPageName = keyof typeof PRIMARY_PAGE_MAP
type TPrimaryPageContext = {
navigate: (page: TPrimaryPageName) => void
navigate: (page: TPrimaryPageName, props?: object) => void
current: TPrimaryPageName | null
display: boolean
}
@@ -51,7 +53,8 @@ const PRIMARY_PAGE_REF_MAP = {
explore: createRef<TPageRef>(),
notifications: createRef<TPageRef>(),
me: createRef<TPageRef>(),
profile: createRef<TPageRef>()
profile: createRef<TPageRef>(),
relay: createRef<TPageRef>()
}
const PRIMARY_PAGE_MAP = {
@@ -59,7 +62,8 @@ const PRIMARY_PAGE_MAP = {
explore: <ExplorePage ref={PRIMARY_PAGE_REF_MAP.explore} />,
notifications: <NotificationListPage ref={PRIMARY_PAGE_REF_MAP.notifications} />,
me: <MePage ref={PRIMARY_PAGE_REF_MAP.me} />,
profile: <ProfilePage ref={PRIMARY_PAGE_REF_MAP.profile} />
profile: <ProfilePage ref={PRIMARY_PAGE_REF_MAP.profile} />,
relay: <RelayPage ref={PRIMARY_PAGE_REF_MAP.relay} />
}
const PrimaryPageContext = createContext<TPrimaryPageContext | undefined>(undefined)
@@ -85,7 +89,7 @@ export function useSecondaryPage() {
export function PageManager({ maxStackSize = 5 }: { maxStackSize?: number }) {
const [currentPrimaryPage, setCurrentPrimaryPage] = useState<TPrimaryPageName>('home')
const [primaryPages, setPrimaryPages] = useState<
{ name: TPrimaryPageName; element: ReactNode }[]
{ name: TPrimaryPageName; element: ReactNode; props?: any }[]
>([
{
name: 'home',
@@ -131,6 +135,15 @@ export function PageManager({ maxStackSize = 5 }: { maxStackSize?: number }) {
}
return newStack
})
} else {
const searchParams = new URLSearchParams(window.location.search)
const r = searchParams.get('r')
if (r) {
const url = normalizeUrl(r)
if (url) {
navigatePrimaryPage('relay', { url })
}
}
}
const onPopState = (e: PopStateEvent) => {
@@ -206,12 +219,18 @@ export function PageManager({ maxStackSize = 5 }: { maxStackSize?: number }) {
}
}, [])
const navigatePrimaryPage = (page: TPrimaryPageName) => {
const navigatePrimaryPage = (page: TPrimaryPageName, props?: any) => {
const needScrollToTop = page === currentPrimaryPage
const exists = primaryPages.find((p) => p.name === page)
if (!exists) {
setPrimaryPages((prev) => [...prev, { name: page, element: PRIMARY_PAGE_MAP[page] }])
setPrimaryPages((prev) => {
const exists = prev.find((p) => p.name === page)
if (exists && props) {
exists.props = props
return [...prev]
} else if (!exists) {
return [...prev, { name: page, element: PRIMARY_PAGE_MAP[page], props }]
}
return prev
})
setCurrentPrimaryPage(page)
if (needScrollToTop) {
PRIMARY_PAGE_REF_MAP[page].current?.scrollToTop('smooth')
@@ -284,7 +303,7 @@ export function PageManager({ maxStackSize = 5 }: { maxStackSize?: number }) {
{item.component}
</div>
))}
{primaryPages.map(({ name, element }) => (
{primaryPages.map(({ name, element, props }) => (
<div
key={name}
style={{
@@ -292,7 +311,7 @@ export function PageManager({ maxStackSize = 5 }: { maxStackSize?: number }) {
secondaryStack.length === 0 && currentPrimaryPage === name ? 'block' : 'none'
}}
>
{element}
{props ? cloneElement(element as React.ReactElement, props) : element}
</div>
))}
<BottomNavigationBar />
@@ -323,7 +342,7 @@ export function PageManager({ maxStackSize = 5 }: { maxStackSize?: number }) {
<Sidebar />
<div className="grid grid-cols-2 gap-2 w-full pr-2">
<div className="flex rounded-lg my-2 max-h-screen shadow-md bg-background overflow-hidden">
{primaryPages.map(({ name, element }) => (
{primaryPages.map(({ name, element, props }) => (
<div
key={name}
className="w-full"
@@ -331,7 +350,7 @@ export function PageManager({ maxStackSize = 5 }: { maxStackSize?: number }) {
display: currentPrimaryPage === name ? 'block' : 'none'
}}
>
{element}
{props ? cloneElement(element as React.ReactElement, props) : element}
</div>
))}
</div>

View File

@@ -1,28 +0,0 @@
import { useFeed } from '@/providers/FeedProvider'
import RelayIcon from '../RelayIcon'
import SaveRelayDropdownMenu from '../SaveRelayDropdownMenu'
export default function TemporaryRelaySet() {
const { temporaryRelayUrls } = useFeed()
if (!temporaryRelayUrls.length) {
return null
}
return (
<div className="w-full border border-dashed rounded-lg p-4 border-primary bg-primary/5 flex gap-4 justify-between">
<div className="flex-1 w-0">
<div className="flex justify-between items-center">
<div className="h-8 font-semibold">Temporary</div>
</div>
{temporaryRelayUrls.map((url) => (
<div className="flex gap-3 items-center">
<RelayIcon url={url} className="w-4 h-4" iconSize={10} />
<div className="text-muted-foreground text-sm truncate">{url}</div>
</div>
))}
</div>
<SaveRelayDropdownMenu urls={temporaryRelayUrls} />
</div>
)
}

View File

@@ -3,13 +3,11 @@ import AddNewRelaySet from './AddNewRelaySet'
import FavoriteRelayList from './FavoriteRelayList'
import { RelaySetsSettingComponentProvider } from './provider'
import RelaySetList from './RelaySetList'
import TemporaryRelaySet from './TemporaryRelaySet'
export default function FavoriteRelaysSetting() {
return (
<RelaySetsSettingComponentProvider>
<div className="space-y-4">
<TemporaryRelaySet />
<RelaySetList />
<AddNewRelaySet />
<FavoriteRelayList />

View File

@@ -8,13 +8,12 @@ import { BookmarkIcon, UsersRound } from 'lucide-react'
import { useTranslation } from 'react-i18next'
import RelayIcon from '../RelayIcon'
import RelaySetCard from '../RelaySetCard'
import SaveRelayDropdownMenu from '../SaveRelayDropdownMenu'
export default function FeedSwitcher({ close }: { close?: () => void }) {
const { t } = useTranslation()
const { pubkey } = useNostr()
const { relaySets, favoriteRelays } = useFavoriteRelays()
const { feedInfo, switchFeed, temporaryRelayUrls } = useFeed()
const { feedInfo, switchFeed } = useFeed()
return (
<div className="space-y-4">
@@ -54,20 +53,6 @@ export default function FeedSwitcher({ close }: { close?: () => void }) {
</FeedSwitcherItem>
)}
{temporaryRelayUrls.length > 0 && (
<FeedSwitcherItem
key="temporary"
isActive={feedInfo.feedType === 'temporary'}
temporary
onClick={() => {
switchFeed('temporary')
close?.()
}}
controls={<SaveRelayDropdownMenu urls={temporaryRelayUrls} />}
>
{temporaryRelayUrls.length === 1 ? simplifyUrl(temporaryRelayUrls[0]) : t('Temporary')}
</FeedSwitcherItem>
)}
<div className="space-y-2">
<div className="flex justify-end items-center text-sm">
<SecondaryPageLink
@@ -115,19 +100,17 @@ export default function FeedSwitcher({ close }: { close?: () => void }) {
function FeedSwitcherItem({
children,
isActive,
temporary = false,
onClick,
controls
}: {
children: React.ReactNode
isActive: boolean
temporary?: boolean
onClick: () => void
controls?: React.ReactNode
}) {
return (
<div
className={`w-full border rounded-lg p-4 ${isActive ? 'border-primary bg-primary/5' : 'clickable'} ${temporary ? 'border-dashed' : ''}`}
className={`w-full border rounded-lg p-4 ${isActive ? 'border-primary bg-primary/5' : 'clickable'}`}
onClick={onClick}
>
<div className="flex justify-between items-center">

View File

@@ -0,0 +1,12 @@
import { useTranslation } from 'react-i18next'
export default function NotFound() {
const { t } = useTranslation()
return (
<div className="text-muted-foreground w-full h-full flex flex-col items-center justify-center gap-2">
<div>{t('Lost in the void')} 🌌</div>
<div>(404)</div>
</div>
)
}

View File

@@ -20,6 +20,7 @@ import client from '@/services/client.service'
import { Link, Zap } from 'lucide-react'
import { useCallback, useEffect, useMemo, useState } from 'react'
import { useTranslation } from 'react-i18next'
import NotFound from '../NotFound'
import FollowedBy from './FollowedBy'
import Followings from './Followings'
import ProfileFeed from './ProfileFeed'
@@ -98,7 +99,7 @@ export default function Profile({ id }: { id?: string }) {
</>
)
}
if (!profile) return null
if (!profile) return <NotFound />
const { banner, username, about, avatar, pubkey, website, lightningAddress } = profile
return (

View File

@@ -0,0 +1,50 @@
import NormalFeed from '@/components/NormalFeed'
import RelayInfo from '@/components/RelayInfo'
import SearchInput from '@/components/SearchInput'
import { useFetchRelayInfo } from '@/hooks'
import { normalizeUrl } from '@/lib/url'
import { useEffect, useMemo, useState } from 'react'
import { useTranslation } from 'react-i18next'
import NotFound from '../NotFound'
export default function Relay({ url, className }: { url?: string; className?: string }) {
const { t } = useTranslation()
const normalizedUrl = useMemo(() => (url ? normalizeUrl(url) : undefined), [url])
const { relayInfo } = useFetchRelayInfo(normalizedUrl)
const [searchInput, setSearchInput] = useState('')
const [debouncedInput, setDebouncedInput] = useState(searchInput)
useEffect(() => {
const handler = setTimeout(() => {
setDebouncedInput(searchInput)
}, 1000)
return () => {
clearTimeout(handler)
}
}, [searchInput])
if (!normalizedUrl) {
return <NotFound />
}
return (
<div className={className}>
<RelayInfo url={normalizedUrl} />
{relayInfo?.supported_nips?.includes(50) && (
<div className="px-4 py-2">
<SearchInput
value={searchInput}
onChange={(e) => setSearchInput(e.target.value)}
placeholder={t('Search')}
/>
</div>
)}
<NormalFeed
subRequests={[
{ urls: [normalizedUrl], filter: debouncedInput ? { search: debouncedInput } : {} }
]}
/>
</div>
)
}

View File

@@ -1,5 +1,4 @@
import { toRelay } from '@/lib/link'
import { useSecondaryPage } from '@/PageManager'
import { usePrimaryPage } from '@/PageManager'
import relayInfoService from '@/services/relay-info.service'
import { TNip66RelayInfo } from '@/types'
import { useEffect, useRef, useState } from 'react'
@@ -9,7 +8,7 @@ import SearchInput from '../SearchInput'
export default function RelayList() {
const { t } = useTranslation()
const { push } = useSecondaryPage()
const { navigate } = usePrimaryPage()
const [loading, setLoading] = useState(true)
const [relays, setRelays] = useState<TNip66RelayInfo[]>([])
const [showCount, setShowCount] = useState(20)
@@ -78,7 +77,7 @@ export default function RelayList() {
className="clickable p-4 border-b"
onClick={(e) => {
e.stopPropagation()
push(toRelay(relay.url))
navigate('relay', { url: relay.url })
}}
/>
))}

View File

@@ -0,0 +1,35 @@
import { Button } from '@/components/ui/button'
import { Check, Copy, Link } from 'lucide-react'
import { useState } from 'react'
import { toast } from 'sonner'
import SaveRelayDropdownMenu from '../SaveRelayDropdownMenu'
export default function RelayPageControls({ url }: { url: string }) {
const [copiedUrl, setCopiedUrl] = useState(false)
const [copiedShareableUrl, setCopiedShareableUrl] = useState(false)
const handleCopyUrl = () => {
navigator.clipboard.writeText(url)
setCopiedUrl(true)
setTimeout(() => setCopiedUrl(false), 2000)
}
const handleCopyShareableUrl = () => {
navigator.clipboard.writeText(`https://jumble.social/?r=${url}`)
setCopiedShareableUrl(true)
toast.success('Shareable URL copied to clipboard')
setTimeout(() => setCopiedShareableUrl(false), 2000)
}
return (
<>
<Button variant="ghost" size="titlebar-icon" onClick={handleCopyShareableUrl}>
{copiedShareableUrl ? <Check /> : <Link />}
</Button>
<Button variant="ghost" size="titlebar-icon" onClick={handleCopyUrl}>
{copiedUrl ? <Check /> : <Copy />}
</Button>
<SaveRelayDropdownMenu urls={[url]} atTitlebar />
</>
)
}

View File

@@ -71,11 +71,6 @@ const FeedSwitcherTrigger = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivEle
if (feedInfo.feedType === 'relays') {
return activeRelaySet?.name ?? activeRelaySet?.id
}
if (feedInfo.feedType === 'temporary') {
return relayUrls.length === 1
? simplifyUrl(relayUrls[0])
: (activeRelaySet?.name ?? t('Temporary'))
}
}, [feedInfo, activeRelaySet])
return (

View File

@@ -22,11 +22,7 @@ export default function RelaysFeed() {
return null
}
if (
feedInfo.feedType !== 'relay' &&
feedInfo.feedType !== 'relays' &&
feedInfo.feedType !== 'temporary'
) {
if (feedInfo.feedType !== 'relay' && feedInfo.feedType !== 'relays') {
return null
}

View File

@@ -1,6 +1,5 @@
import BookmarkList from '@/components/BookmarkList'
import PostEditor from '@/components/PostEditor'
import SaveRelayDropdownMenu from '@/components/SaveRelayDropdownMenu'
import { Button } from '@/components/ui/button'
import PrimaryPageLayout from '@/layouts/PrimaryPageLayout'
import { useFeed } from '@/providers/FeedProvider'
@@ -61,11 +60,7 @@ const NoteListPage = forwardRef((_, ref) => {
<PrimaryPageLayout
pageName="home"
ref={layoutRef}
titlebar={
<NoteListPageTitlebar
temporaryRelayUrls={feedInfo.feedType === 'temporary' ? relayUrls : []}
/>
}
titlebar={<NoteListPageTitlebar />}
displayScrollToTopButton
>
{content}
@@ -75,16 +70,13 @@ const NoteListPage = forwardRef((_, ref) => {
NoteListPage.displayName = 'NoteListPage'
export default NoteListPage
function NoteListPageTitlebar({ temporaryRelayUrls = [] }: { temporaryRelayUrls?: string[] }) {
function NoteListPageTitlebar() {
const { isSmallScreen } = useScreenSize()
return (
<div className="flex gap-1 items-center h-full justify-between">
<FeedButton className="flex-1 max-w-fit w-0" />
<div className="shrink-0 flex gap-1 items-center">
{temporaryRelayUrls.length > 0 && (
<SaveRelayDropdownMenu urls={temporaryRelayUrls} atTitlebar />
)}
<SearchButton />
{isSmallScreen && <PostButton />}
</div>

View File

@@ -0,0 +1,37 @@
import Relay from '@/components/Relay'
import RelayPageControls from '@/components/RelayPageControls'
import PrimaryPageLayout from '@/layouts/PrimaryPageLayout'
import { normalizeUrl, simplifyUrl } from '@/lib/url'
import { Server } from 'lucide-react'
import { forwardRef, useMemo } from 'react'
const RelayPage = forwardRef(({ url }: { url?: string }, ref) => {
const normalizedUrl = useMemo(() => (url ? normalizeUrl(url) : undefined), [url])
return (
<PrimaryPageLayout
pageName="relay"
titlebar={<RelayPageTitlebar url={normalizedUrl} />}
displayScrollToTopButton
ref={ref}
>
<Relay url={normalizedUrl} className="pt-3" />
</PrimaryPageLayout>
)
})
RelayPage.displayName = 'RelayPage'
export default RelayPage
function RelayPageTitlebar({ url }: { url?: string }) {
return (
<div className="flex gap-2 items-center justify-between h-full">
<div className="flex items-center gap-2 pl-3 flex-1 w-0">
<Server />
<div className="text-lg font-semibold truncate">{simplifyUrl(url ?? '')}</div>
</div>
<div className="flex items-center flex-shrink-0">
<RelayPageControls url={url ?? ''} />
</div>
</div>
)
}

View File

@@ -1,16 +1,11 @@
import NotFound from '@/components/NotFound'
import SecondaryPageLayout from '@/layouts/SecondaryPageLayout'
import { forwardRef } from 'react'
import { useTranslation } from 'react-i18next'
const NotFoundPage = forwardRef(({ index }: { index?: number }, ref) => {
const { t } = useTranslation()
return (
<SecondaryPageLayout ref={ref} index={index} hideBackButton>
<div className="text-muted-foreground w-full h-full flex flex-col items-center justify-center gap-2">
<div>{t('Lost in the void')} 🌌</div>
<div>(404)</div>
</div>
<NotFound />
</SecondaryPageLayout>
)
})

View File

@@ -1,34 +1,13 @@
import NormalFeed from '@/components/NormalFeed'
import RelayInfo from '@/components/RelayInfo'
import SaveRelayDropdownMenu from '@/components/SaveRelayDropdownMenu'
import SearchInput from '@/components/SearchInput'
import { Button } from '@/components/ui/button'
import { useFetchRelayInfo } from '@/hooks'
import Relay from '@/components/Relay'
import RelayPageControls from '@/components/RelayPageControls'
import SecondaryPageLayout from '@/layouts/SecondaryPageLayout'
import { normalizeUrl, simplifyUrl } from '@/lib/url'
import { Check, Copy, Link } from 'lucide-react'
import { forwardRef, useEffect, useMemo, useState } from 'react'
import { useTranslation } from 'react-i18next'
import { toast } from 'sonner'
import { forwardRef, useMemo } from 'react'
import NotFoundPage from '../NotFoundPage'
const RelayPage = forwardRef(({ url, index }: { url?: string; index?: number }, ref) => {
const { t } = useTranslation()
const normalizedUrl = useMemo(() => (url ? normalizeUrl(url) : undefined), [url])
const { relayInfo } = useFetchRelayInfo(normalizedUrl)
const title = useMemo(() => (url ? simplifyUrl(url) : undefined), [url])
const [searchInput, setSearchInput] = useState('')
const [debouncedInput, setDebouncedInput] = useState(searchInput)
useEffect(() => {
const handler = setTimeout(() => {
setDebouncedInput(searchInput)
}, 1000)
return () => {
clearTimeout(handler)
}
}, [searchInput])
if (!normalizedUrl) {
return <NotFoundPage ref={ref} />
@@ -42,54 +21,9 @@ const RelayPage = forwardRef(({ url, index }: { url?: string; index?: number },
controls={<RelayPageControls url={normalizedUrl} />}
displayScrollToTopButton
>
<div className="h-3 w-full" />
<RelayInfo url={normalizedUrl} />
{relayInfo?.supported_nips?.includes(50) && (
<div className="px-4 py-2">
<SearchInput
value={searchInput}
onChange={(e) => setSearchInput(e.target.value)}
placeholder={t('Search')}
/>
</div>
)}
<NormalFeed
subRequests={[
{ urls: [normalizedUrl], filter: debouncedInput ? { search: debouncedInput } : {} }
]}
/>
<Relay url={normalizedUrl} className="pt-3" />
</SecondaryPageLayout>
)
})
RelayPage.displayName = 'RelayPage'
export default RelayPage
function RelayPageControls({ url }: { url: string }) {
const [copiedUrl, setCopiedUrl] = useState(false)
const [copiedShareableUrl, setCopiedShareableUrl] = useState(false)
const handleCopyUrl = () => {
navigator.clipboard.writeText(url)
setCopiedUrl(true)
setTimeout(() => setCopiedUrl(false), 2000)
}
const handleCopyShareableUrl = () => {
navigator.clipboard.writeText(`https://jumble.social/?r=${url}`)
setCopiedShareableUrl(true)
toast.success('Shareable URL copied to clipboard')
setTimeout(() => setCopiedShareableUrl(false), 2000)
}
return (
<>
<Button variant="ghost" size="titlebar-icon" onClick={handleCopyShareableUrl}>
{copiedShareableUrl ? <Check /> : <Link />}
</Button>
<Button variant="ghost" size="titlebar-icon" onClick={handleCopyUrl}>
{copiedUrl ? <Check /> : <Copy />}
</Button>
<SaveRelayDropdownMenu urls={[url]} atTitlebar />
</>
)
}

View File

@@ -15,7 +15,6 @@ import { useNostr } from './NostrProvider'
type TFeedContext = {
feedInfo: TFeedInfo
relayUrls: string[]
temporaryRelayUrls: string[]
isReady: boolean
switchFeed: (
feedType: TFeedType,
@@ -34,11 +33,9 @@ export const useFeed = () => {
}
export function FeedProvider({ children }: { children: React.ReactNode }) {
const isFirstRenderRef = useRef(true)
const { pubkey, isInitialized } = useNostr()
const { relaySets, favoriteRelays } = useFavoriteRelays()
const [relayUrls, setRelayUrls] = useState<string[]>([])
const [temporaryRelayUrls, setTemporaryRelayUrls] = useState<string[]>([])
const [isReady, setIsReady] = useState(false)
const [feedInfo, setFeedInfo] = useState<TFeedInfo>({
feedType: 'relay',
@@ -48,24 +45,6 @@ export function FeedProvider({ children }: { children: React.ReactNode }) {
useEffect(() => {
const init = async () => {
const isFirstRender = isFirstRenderRef.current
isFirstRenderRef.current = false
if (isFirstRender) {
// temporary relay urls from query params
const searchParams = new URLSearchParams(window.location.search)
const temporaryRelayUrls = searchParams
.getAll('r')
.map((url) => normalizeUrl(url))
.filter((url) => url && isWebsocketUrl(url))
if (temporaryRelayUrls.length) {
return await switchFeed('temporary', { temporaryRelayUrls })
}
}
if (feedInfoRef.current.feedType === 'temporary') {
return
}
if (!isInitialized) {
return
}
@@ -106,7 +85,6 @@ export function FeedProvider({ children }: { children: React.ReactNode }) {
feedType: TFeedType,
options: {
activeRelaySetId?: string | null
temporaryRelayUrls?: string[] | null
pubkey?: string | null
relay?: string | null
} = {}
@@ -195,26 +173,6 @@ export function FeedProvider({ children }: { children: React.ReactNode }) {
setIsReady(true)
return
}
if (feedType === 'temporary') {
const urls = options.temporaryRelayUrls ?? temporaryRelayUrls
if (!urls.length) {
setIsReady(true)
return
}
const newFeedInfo = { feedType }
setFeedInfo(newFeedInfo)
feedInfoRef.current = newFeedInfo
setTemporaryRelayUrls(urls)
setRelayUrls(urls)
setIsReady(true)
const relayInfos = await relayInfoService.getRelayInfos(urls)
client.setCurrentRelayUrls(
urls.filter((_, i) => !relayInfos[i] || !checkAlgoRelay(relayInfos[i]))
)
return
}
setIsReady(true)
}
@@ -223,7 +181,6 @@ export function FeedProvider({ children }: { children: React.ReactNode }) {
value={{
feedInfo,
relayUrls,
temporaryRelayUrls,
isReady,
switchFeed
}}

View File

@@ -104,7 +104,7 @@ export type TAccount = {
export type TAccountPointer = Pick<TAccount, 'pubkey' | 'signerType'>
export type TFeedType = 'following' | 'relays' | 'relay' | 'temporary' | 'bookmarks'
export type TFeedType = 'following' | 'relays' | 'relay' | 'bookmarks'
export type TFeedInfo = { feedType: TFeedType; id?: string }
export type TLanguage = 'en' | 'zh' | 'pl'