monoid/ionian
1
0
Fork 0
Code Issues 9 Pull Requests Projects Releases Wiki Activity

feat: handle deleted render

Browse Source
This commit is contained in:
monoid 2024-04-08 00:21:03 +09:00
parent 5d54f6666f
commit b2a584847f
1 changed files with 7 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/client/src/components/gallery/GalleryCard.tsx
View File

@ -1,7 +1,7 @@
import type { Document } from "dbtype/api"; import type { Document } from "dbtype/api";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card.tsx"; import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card.tsx";
import TagBadge from "@/components/gallery/TagBadge.tsx"; import TagBadge from "@/components/gallery/TagBadge.tsx";
import { Fragment, useEffect, useLayoutEffect, useRef, useState } from "react"; import { Fragment, useLayoutEffect, useRef, useState } from "react";
import { LazyImage } from "./LazyImage.tsx"; import { LazyImage } from "./LazyImage.tsx";
import StyledLink from "./StyledLink.tsx"; import StyledLink from "./StyledLink.tsx";
@ -22,6 +22,7 @@ export function GalleryCard({
}: { doc: Document; }) { }: { doc: Document; }) {
const ref = useRef<HTMLUListElement>(null); const ref = useRef<HTMLUListElement>(null);
const [clipCharCount, setClipCharCount] = useState(200); const [clipCharCount, setClipCharCount] = useState(200);
const isDeleted = x.deleted_at !== null;
const artists = x.tags.filter(x => x.startsWith("artist:")).map(x => x.replace("artist:", "")); const artists = x.tags.filter(x => x.startsWith("artist:")).map(x => x.replace("artist:", ""));
const groups = x.tags.filter(x => x.startsWith("group:")).map(x => x.replace("group:", "")); const groups = x.tags.filter(x => x.startsWith("group:")).map(x => x.replace("group:", ""));
@ -46,12 +47,15 @@ export function GalleryCard({
}, []); }, []);
return <Card className="flex h-[200px]"> return <Card className="flex h-[200px]">
<div className="rounded-xl overflow-hidden h-[200px] w-[142px] flex-none bg-[#272733] flex items-center justify-center"> {isDeleted ? <div className="bg-primary border flex items-center justify-center h-[200px] w-[142px] rounded-xl">
<span className="text-primary-foreground text-lg font-bold">Deleted</span>
</div> : <div className="rounded-xl overflow-hidden h-[200px] w-[142px] flex-none bg-[#272733] flex items-center justify-center">
<LazyImage src={`/api/doc/${x.id}/comic/thumbnail`} <LazyImage src={`/api/doc/${x.id}/comic/thumbnail`}
alt={x.title} alt={x.title}
className="max-h-full max-w-full object-cover object-center" className="max-h-full max-w-full object-cover object-center"
/> />
</div> </div>
}
<div className="flex-1 flex flex-col"> <div className="flex-1 flex flex-col">
<CardHeader className="flex-none"> <CardHeader className="flex-none">
<CardTitle> <CardTitle>