diff --git a/src/components/Content/index.tsx b/src/components/Content/index.tsx index e1454d4..d80c2b5 100644 --- a/src/components/Content/index.tsx +++ b/src/components/Content/index.tsx @@ -9,11 +9,11 @@ import { EmbeddedWebsocketUrlParser, parseContent } from '@/lib/content-parser' -import { getImageInfosFromEvent } from '@/lib/event' -import { getEmojiInfosFromEmojiTags, getImageInfoFromImetaTag } from '@/lib/tag' +import { getImetaInfosFromEvent } from '@/lib/event' +import { getEmojiInfosFromEmojiTags, getImetaInfoFromImetaTag } from '@/lib/tag' import { cn } from '@/lib/utils' import mediaUpload from '@/services/media-upload.service' -import { TImageInfo } from '@/types' +import { TImetaInfo } from '@/types' import { Event } from 'nostr-tools' import { memo } from 'react' import { @@ -46,30 +46,30 @@ const Content = memo( EmbeddedEmojiParser ]) - const imageInfos = event ? getImageInfosFromEvent(event) : [] + const imetaInfos = event ? getImetaInfosFromEvent(event) : [] const allImages = nodes .map((node) => { if (node.type === 'image') { - const imageInfo = imageInfos.find((image) => image.url === node.data) + const imageInfo = imetaInfos.find((image) => image.url === node.data) if (imageInfo) { return imageInfo } const tag = mediaUpload.getImetaTagByUrl(node.data) return tag - ? getImageInfoFromImetaTag(tag, event?.pubkey) + ? getImetaInfoFromImetaTag(tag, event?.pubkey) : { url: node.data, pubkey: event?.pubkey } } if (node.type === 'images') { const urls = Array.isArray(node.data) ? node.data : [node.data] return urls.map((url) => { - const imageInfo = imageInfos.find((image) => image.url === url) + const imageInfo = imetaInfos.find((image) => image.url === url) return imageInfo ?? { url, pubkey: event?.pubkey } }) } return null }) .filter(Boolean) - .flat() as TImageInfo[] + .flat() as TImetaInfo[] let imageIndex = 0 const emojiInfos = getEmojiInfosFromEmojiTags(event?.tags) diff --git a/src/components/Image/index.tsx b/src/components/Image/index.tsx index 19b4bab..c8812a5 100644 --- a/src/components/Image/index.tsx +++ b/src/components/Image/index.tsx @@ -1,7 +1,7 @@ import { Skeleton } from '@/components/ui/skeleton' import { cn } from '@/lib/utils' import client from '@/services/client.service' -import { TImageInfo } from '@/types' +import { TImetaInfo } from '@/types' import { getHashFromURL } from 'blossom-client-sdk' import { decode } from 'blurhash' import { ImageOff } from 'lucide-react' @@ -20,7 +20,7 @@ export default function Image({ wrapper?: string errorPlaceholder?: string } - image: TImageInfo + image: TImetaInfo alt?: string hideIfError?: boolean errorPlaceholder?: React.ReactNode diff --git a/src/components/ImageGallery/index.tsx b/src/components/ImageGallery/index.tsx index b5f273e..60c042e 100644 --- a/src/components/ImageGallery/index.tsx +++ b/src/components/ImageGallery/index.tsx @@ -1,7 +1,7 @@ import { randomString } from '@/lib/random' import { cn } from '@/lib/utils' import modalManager from '@/services/modal-manager.service' -import { TImageInfo } from '@/types' +import { TImetaInfo } from '@/types' import { ReactNode, useEffect, useMemo, useState } from 'react' import { createPortal } from 'react-dom' import Lightbox from 'yet-another-react-lightbox' @@ -15,7 +15,7 @@ export default function ImageGallery({ end = images.length }: { className?: string - images: TImageInfo[] + images: TImetaInfo[] start?: number end?: number }) { diff --git a/src/components/ImageWithLightbox/index.tsx b/src/components/ImageWithLightbox/index.tsx index 491693d..f6c0f2d 100644 --- a/src/components/ImageWithLightbox/index.tsx +++ b/src/components/ImageWithLightbox/index.tsx @@ -1,7 +1,7 @@ import { randomString } from '@/lib/random' import { cn } from '@/lib/utils' import modalManager from '@/services/modal-manager.service' -import { TImageInfo } from '@/types' +import { TImetaInfo } from '@/types' import { useEffect, useMemo, useState } from 'react' import { createPortal } from 'react-dom' import Lightbox from 'yet-another-react-lightbox' @@ -12,7 +12,7 @@ export default function ImageWithLightbox({ image, className }: { - image: TImageInfo + image: TImetaInfo className?: string }) { const id = useMemo(() => `image-with-lightbox-${randomString()}`, []) diff --git a/src/components/KindFilter/index.tsx b/src/components/KindFilter/index.tsx index 7791696..eeecab6 100644 --- a/src/components/KindFilter/index.tsx +++ b/src/components/KindFilter/index.tsx @@ -3,23 +3,24 @@ import { Checkbox } from '@/components/ui/checkbox' import { Drawer, DrawerContent, DrawerHeader, DrawerTrigger } from '@/components/ui/drawer' import { Label } from '@/components/ui/label' import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover' -import { DEFAULT_SHOW_KINDS, ExtendedKind } from '@/constants' +import { ExtendedKind, SUPPORTED_KINDS } from '@/constants' import { cn } from '@/lib/utils' import { useKindFilter } from '@/providers/KindFilterProvider' import { useScreenSize } from '@/providers/ScreenSizeProvider' import { ListFilter } from 'lucide-react' import { kinds } from 'nostr-tools' -import { useEffect, useMemo, useState } from 'react' +import { useEffect, useState } from 'react' import { useTranslation } from 'react-i18next' -const SUPPORTED_KINDS = [ +const KIND_FILTER_OPTIONS = [ { kindGroup: [kinds.ShortTextNote, ExtendedKind.COMMENT], label: 'Posts' }, { kindGroup: [kinds.Repost], label: 'Reposts' }, { kindGroup: [kinds.LongFormArticle], label: 'Articles' }, { kindGroup: [kinds.Highlights], label: 'Highlights' }, { kindGroup: [ExtendedKind.POLL], label: 'Polls' }, { kindGroup: [ExtendedKind.VOICE, ExtendedKind.VOICE_COMMENT], label: 'Voice Posts' }, - { kindGroup: [ExtendedKind.PICTURE], label: 'Photo Posts' } + { kindGroup: [ExtendedKind.PICTURE], label: 'Photo Posts' }, + { kindGroup: [ExtendedKind.VIDEO, ExtendedKind.SHORT_VIDEO], label: 'Video Posts' } ] export default function KindFilter({ @@ -35,9 +36,6 @@ export default function KindFilter({ const { updateShowKinds } = useKindFilter() const [temporaryShowKinds, setTemporaryShowKinds] = useState(showKinds) const [isPersistent, setIsPersistent] = useState(false) - const isFilterApplied = useMemo(() => { - return showKinds.length !== DEFAULT_SHOW_KINDS.length - }, [showKinds]) useEffect(() => { setTemporaryShowKinds(showKinds) @@ -74,7 +72,7 @@ export default function KindFilter({