feat: handle deleted render

This commit is contained in:
monoid 2024-04-08 00:21:03 +09:00
parent 5d54f6666f
commit b2a584847f

View File

@ -1,7 +1,7 @@
import type { Document } from "dbtype/api";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card.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 StyledLink from "./StyledLink.tsx";
@ -22,6 +22,7 @@ export function GalleryCard({
}: { doc: Document; }) {
const ref = useRef<HTMLUListElement>(null);
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 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]">
<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`}
alt={x.title}
className="max-h-full max-w-full object-cover object-center"
/>
</div>
}
<div className="flex-1 flex flex-col">
<CardHeader className="flex-none">
<CardTitle>