Skip to content

Commit 3db65e7

Browse files
agmmtooagmmtoo
committed
feat: caching init
1 parent d68bcc4 commit 3db65e7

File tree

15 files changed

+287
-166
lines changed

15 files changed

+287
-166
lines changed

‎app/(protected)/admin/books/[id]/page.tsx‎

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -161,8 +161,15 @@ export default async function BookDetailsPage({
161161
))}
162162
</div>
163163
<div className="mt-6 pt-6 border-t">
164-
<Link href="/admin/reviews">
165-
<Button variant="outline" className="w-full bg-transparent">
164+
<Link
165+
href={`/admin/reviews?book_id=${id}`}
166+
aria-disabled={reviewsRes.meta.total === 0}
167+
>
168+
<Button
169+
variant="outline"
170+
className="w-full bg-transparent"
171+
disabled={reviewsRes.meta.total === 0}
172+
>
166173
View All Reviews ({reviewsRes.meta.total})
167174
</Button>
168175
</Link>

‎app/(protected)/admin/borrows/[id]/loading.tsx‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import { Skeleton } from '@/components/ui/skeleton'
2+
3+
export default function Loading() {
4+
return (
5+
<div className="mt-4 space-y-4">
6+
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
7+
<div className="place-self-center md:col-span-2 md:place-self-end">
8+
<div className="space-x-2">
9+
<Skeleton className="inline-block w-20 h-8" />
10+
<Skeleton className="inline-block w-20 h-8" />
11+
</div>
12+
</div>
13+
<Skeleton className="w-full h-96 md:row-span-2" />
14+
<Skeleton className="w-full h-38 md:h-full" />
15+
<Skeleton className="w-full h-36 md:h-full" />
16+
<Skeleton className="w-full h-48 md:col-span-2" />
17+
</div>
18+
</div>
19+
)
20+
}

‎app/(protected)/admin/borrows/loading.tsx‎

Lines changed: 27 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,30 @@
1-
import BorrowListSkeleton from '@/components/borrows/BorrowListSkeleton'
1+
import { Skeleton } from '@/components/ui/skeleton'
22

33
export default function Loading() {
4-
return <BorrowListSkeleton />
4+
return (
5+
<>
6+
<h1 className="text-2xl font-semibold">Borrows</h1>
7+
<div className="space-y-4">
8+
<div className="flex justify-between">
9+
<Skeleton className="w-44" />
10+
<div className="md:flex gap-2">
11+
<Skeleton className="w-32 h-9" />
12+
<Skeleton className="hidden md:block w-32 h-9" />
13+
</div>
14+
</div>
15+
<div className="flex flex-col gap-2 md:flex-row justify-between">
16+
<Skeleton className="w-full h-16 md:w-110 md:h-9" />
17+
<div className="self-end flex gap-2">
18+
<Skeleton className="w-24 h-9" />
19+
<Skeleton className="w-24 h-9" />
20+
</div>
21+
</div>
22+
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-3">
23+
{new Array(3).fill(0).map((_, idx) => (
24+
<Skeleton key={idx} className="w-full h-84" />
25+
))}
26+
</div>
27+
</div>
28+
</>
29+
)
530
}

‎app/(protected)/admin/page.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import {
1111
Ticket,
1212
BookCopy,
1313
Workflow,
14+
MessageSquare,
1415
} from 'lucide-react'
1516
import { Button } from '@/components/ui/button'
1617
import { IsLoggedIn } from '@/lib/firebase/firebase'
@@ -37,6 +38,7 @@ const menuItems = [
3738
},
3839
{ title: 'Borrows', icon: BookUser, href: '/admin/borrows' },
3940
{ title: 'Collections', icon: BookCopy, href: '/admin/collections' },
41+
{ title: 'Reviews', icon: MessageSquare, href: '/admin/reviews' },
4042
{ title: 'Jobs', icon: Workflow, href: '/admin/jobs' },
4143
] as const
4244

‎app/(protected)/admin/reviews/layout.tsx‎

Lines changed: 27 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,6 @@
1+
import { BookFilter, UserFilter } from '@/components/common/filters'
2+
import { ModelFilter } from '@/components/common/ModelFilter'
3+
import { SearchInput } from '@/components/common/SearchInput'
14
import {
25
Breadcrumb,
36
BreadcrumbItem,
@@ -12,7 +15,7 @@ export default async function ReviewsLayout({
1215
children: React.ReactNode
1316
}>) {
1417
return (
15-
<>
18+
<div className="space-y-4">
1619
<nav className="backdrop-blur-sm sticky top-0 z-10 mb-4">
1720
<h1 className="text-2xl font-semibold">Reviews</h1>
1821
<div className="flex justify-between items-center">
@@ -27,7 +30,29 @@ export default async function ReviewsLayout({
2730
</Breadcrumb>
2831
</div>
2932
</nav>
33+
<div className="flex justify-between">
34+
<SearchInput
35+
className="max-w-md"
36+
placeholder="Search by review comment..."
37+
name="comment"
38+
/>
39+
<div className="self-end inline-flex gap-2">
40+
<ModelFilter
41+
filterKeys={[
42+
'user_id',
43+
'book_id',
44+
'borrowed_at',
45+
'due_at',
46+
'returned_at',
47+
'lost_at',
48+
]}
49+
>
50+
<UserFilter />
51+
<BookFilter />
52+
</ModelFilter>
53+
</div>
54+
</div>
3055
{children}
31-
</>
56+
</div>
3257
)
3358
}

‎app/(protected)/admin/reviews/page.tsx‎

Lines changed: 31 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -26,9 +26,11 @@ export default async function ReviewsPage({
2626
limit?: number
2727
rating?: number
2828
comment?: string
29+
book_id?: string
30+
user_id?: string
2931
}>
3032
}) {
31-
const { rating, comment, ...sp } = await searchParams
33+
const { rating, comment, book_id, user_id, ...sp } = await searchParams
3234
const skip = Number(sp?.skip ?? 0)
3335
const limit = Number(sp?.limit ?? 20)
3436

@@ -43,6 +45,8 @@ export default async function ReviewsPage({
4345
const res = await getListReviews(
4446
{
4547
library_id: activeLibraryID,
48+
book_id,
49+
user_id,
4650
skip,
4751
rating,
4852
comment,
@@ -65,27 +69,31 @@ export default async function ReviewsPage({
6569
{res.data.map((review) => (
6670
<Card key={review.id} className="hover:shadow-md transition-shadow">
6771
<CardContent>
68-
<Link href={`/admin/books/${review.book.id}`} className="shrink-0">
69-
<div className="flex gap-4">
70-
{/* 3D Book Effect */}
71-
<div className="shrink-0">
72-
<div className="flex">
73-
<div className="bg-accent transform-[perspective(400px)_rotateY(314deg)] -mr-1 w-4">
74-
<span className="inline-block text-nowrap text-[0.5rem] font-bold text-accent-foreground/50 transform-[rotate(90deg)_translateY(-16px)] origin-top-left"></span>
75-
</div>
76-
<Image
77-
src={review.book.cover ?? '/book-placeholder.svg'}
78-
alt={review.book.title + "'s cover"}
79-
width={96}
80-
height={144}
81-
className={clsx(
82-
'shadow-xl rounded-r-md md:w-24 md:h-36 object-cover',
83-
'transform-[perspective(800px)_rotateY(14deg)]'
84-
)}
85-
priority
86-
/>
72+
<div className="flex gap-4">
73+
{/* 3D Book Effect */}
74+
75+
<Link
76+
href={`/admin/books/${review.book.id}`}
77+
className="shrink-0"
78+
>
79+
<div className="flex">
80+
<div className="bg-accent transform-[perspective(400px)_rotateY(314deg)] -mr-1 w-4">
81+
<span className="inline-block text-nowrap text-[0.5rem] font-bold text-accent-foreground/50 transform-[rotate(90deg)_translateY(-16px)] origin-top-left"></span>
8782
</div>
83+
<Image
84+
src={review.book.cover ?? '/book-placeholder.svg'}
85+
alt={review.book.title + "'s cover"}
86+
width={96}
87+
height={144}
88+
className={clsx(
89+
'shadow-xl rounded-r-md md:w-24 md:h-36 object-cover',
90+
'transform-[perspective(800px)_rotateY(14deg)]'
91+
)}
92+
priority
93+
/>
8894
</div>
95+
</Link>
96+
<Link href={`/admin/borrows/${review.borrowing_id}`}>
8997
<div className="space-y-4">
9098
<div className="flex flex-col md:flex-row md:justify-between">
9199
<div>
@@ -109,7 +117,7 @@ export default async function ReviewsPage({
109117

110118
{/* Review text */}
111119
<div>
112-
<p className="text-sm leading-relaxed mb-4 text-foreground">
120+
<p className="text-sm leading-relaxed mb-4 text-foreground line-clamp-4">
113121
{review.comment}
114122
</p>
115123

@@ -132,8 +140,8 @@ export default async function ReviewsPage({
132140
</div>
133141
</div>
134142
</div>
135-
</div>
136-
</Link>
143+
</Link>
144+
</div>
137145
</CardContent>
138146
</Card>
139147
))}

‎app/(protected)/borrows/[id]/loading.tsx‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import { Skeleton } from '@/components/ui/skeleton'
2+
3+
export default function Loading() {
4+
return (
5+
<div className="mt-4 space-y-4">
6+
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
7+
<div className="place-self-center md:col-span-2 md:place-self-end">
8+
<div className="space-x-2">
9+
<Skeleton className="inline-block w-20 h-8" />
10+
<Skeleton className="inline-block w-20 h-8" />
11+
</div>
12+
</div>
13+
<Skeleton className="w-full h-96 md:row-span-2" />
14+
<Skeleton className="w-full h-38 md:h-full" />
15+
<Skeleton className="w-full h-36 md:h-full" />
16+
<Skeleton className="w-full h-48 md:col-span-2" />
17+
</div>
18+
</div>
19+
)
20+
}

‎app/(protected)/borrows/[id]/page.tsx‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -24,16 +24,18 @@ export default async function BorrowDetailsPage({
2424

2525
const headers = await Verify({ from })
2626

27-
const [borrowRes] = await Promise.all([getBorrow({ id, ...sp }, { headers })])
28-
29-
if ('error' in borrowRes) {
30-
return <div>{JSON.stringify(borrowRes.message)}</div>
31-
}
32-
3327
const claim = await IsLoggedIn()
3428
if (!claim || !claim.librarease) {
3529
redirect(`/login?from=${encodeURIComponent(from)}`, RedirectType.replace)
3630
}
3731

32+
const [borrowRes] = await Promise.all([
33+
getBorrow({ id, user_id: claim.librarease.id, ...sp }, { headers }),
34+
])
35+
36+
if ('error' in borrowRes) {
37+
return <div>{JSON.stringify(borrowRes.message)}</div>
38+
}
39+
3840
return <DetailBorrow borrow={borrowRes.data} />
3941
}

‎app/(protected)/borrows/loading.tsx‎

Lines changed: 20 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,23 @@
1-
import BorrowListSkeleton from '@/components/borrows/BorrowListSkeleton'
1+
import { Skeleton } from '@/components/ui/skeleton'
22

33
export default function Loading() {
4-
return <BorrowListSkeleton />
4+
return (
5+
<>
6+
<h1 className="text-2xl font-semibold">Borrows</h1>
7+
<div className="space-y-4">
8+
<div className="flex justify-between">
9+
<Skeleton className="w-40 h-6" />
10+
</div>
11+
<div className="flex flex-col gap-2 md:flex-row justify-between">
12+
<Skeleton className="w-full h-16 md:w-110 md:h-9" />
13+
<Skeleton className="w-16 h-9" />
14+
</div>
15+
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-3">
16+
{new Array(3).fill(0).map((_, idx) => (
17+
<Skeleton key={idx} className="w-full h-84" />
18+
))}
19+
</div>
20+
</div>
21+
</>
22+
)
523
}

‎components/borrows/BorrowListSkeleton.tsx‎

Lines changed: 0 additions & 48 deletions
This file was deleted.

0 commit comments

Comments
 (0)