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

feat: add loading spinner to ComicPage component

Browse source
This commit is contained in:
monoid 2025-08-15 22:01:04 +09:00
parent bd536f2ea5
commit 482892ffc1
1 changed files with 18 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
packages/client/src/page/reader/comicPage.tsx
View file

@ -8,6 +8,7 @@ import { EnterFullScreenIcon, ExitFullScreenIcon, ExitIcon } from "@radix-ui/rea
import { useEventListener } from "usehooks-ts"; import { useEventListener } from "usehooks-ts";
import type { Document } from "dbtype"; import type { Document } from "dbtype";
import { useCallback, useEffect, useRef, useState } from "react"; import { useCallback, useEffect, useRef, useState } from "react";
import { Loader2 } from "lucide-react";
interface ComicPageProps { interface ComicPageProps {
params: { params: {
@ -121,9 +122,11 @@ export default function ComicPage({
const [curPage, setCurPage] = useState(0); const [curPage, setCurPage] = useState(0);
const { isFullScreen, toggleFullScreen } = useFullScreen(); const { isFullScreen, toggleFullScreen } = useFullScreen();
if (isLoading) { if (isLoading) {
// TODO: Add a loading spinner return <div className="p-4 flex items-center justify-center gap-2 h-dvh">
return <div className="p-4"> <Loader2
Loading... className="w-6 h-6 animate-spin text-primary"
/>
<span className="text-muted-foreground">로딩 중...</span>
</div> </div>
} }
if (error) { if (error) {