fix: like buttons not working with cache rules

This commit is contained in:
trafficlunar 2026-03-28 20:33:28 +00:00
parent 8378b85167
commit 341b8f58a5
4 changed files with 13 additions and 12 deletions

View file

@ -93,14 +93,14 @@ export default function RootLayout({
)} )}
<Providers> <Providers>
<Suspense fallback={<div>Loading header...</div>}>
<SessionProvider> <SessionProvider>
<Suspense fallback={<div>Loading header...</div>}>
<Header /> <Header />
</SessionProvider>
</Suspense> </Suspense>
<AdminBanner /> <AdminBanner />
<main className="px-4 py-8 max-w-7xl w-full grow flex flex-col">{children}</main> <main className="px-4 py-8 max-w-7xl w-full grow flex flex-col">{children}</main>
<Footer /> <Footer />
</SessionProvider>
</Providers> </Providers>
</body> </body>
</html> </html>

View file

@ -316,7 +316,7 @@ export default async function MiiPage({ params }: Props) {
{/* Submission name */} {/* Submission name */}
<h1 className="text-4xl font-extrabold wrap-break-word text-amber-700">{mii.name}</h1> <h1 className="text-4xl font-extrabold wrap-break-word text-amber-700">{mii.name}</h1>
{/* Like button */} {/* Like button */}
<LikeButton likes={mii._count.likedBy ?? 0} miiId={mii.id} isLiked={(mii.likedBy ?? []).length > 0} isLoggedIn={session?.user != null} big /> <LikeButton likes={mii._count.likedBy ?? 0} miiId={mii.id} isLiked={(mii.likedBy ?? []).length > 0} big />
</div> </div>
{/* Tags */} {/* Tags */}
<div id="tags" className="flex flex-wrap gap-1 mt-1 *:px-2 *:py-1 *:bg-orange-300 *:rounded-full *:text-xs"> <div id="tags" className="flex flex-wrap gap-1 mt-1 *:px-2 *:py-1 *:bg-orange-300 *:rounded-full *:text-xs">

View file

@ -1,5 +1,6 @@
"use client"; "use client";
import { useSession } from "next-auth/react";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { Icon, loadIcons } from "@iconify/react"; import { Icon, loadIcons } from "@iconify/react";
@ -9,13 +10,13 @@ interface Props {
likes: number; likes: number;
miiId?: number | undefined; miiId?: number | undefined;
isLiked: boolean; isLiked: boolean;
isLoggedIn?: boolean;
disabled?: boolean; disabled?: boolean;
abbreviate?: boolean; abbreviate?: boolean;
big?: boolean; big?: boolean;
} }
export default function LikeButton({ likes, isLiked, miiId, isLoggedIn, disabled, abbreviate, big }: Props) { export default function LikeButton({ likes, isLiked, miiId, disabled, abbreviate, big }: Props) {
const session = useSession();
const router = useRouter(); const router = useRouter();
const [isLikedState, setIsLikedState] = useState(isLiked); const [isLikedState, setIsLikedState] = useState(isLiked);
@ -24,7 +25,7 @@ export default function LikeButton({ likes, isLiked, miiId, isLoggedIn, disabled
const onClick = async () => { const onClick = async () => {
if (disabled) return; if (disabled) return;
if (!isLoggedIn) { if (!session.data?.user) {
router.push("/login"); router.push("/login");
return; return;
} }

View file

@ -224,7 +224,7 @@ export default async function MiiList({ searchParams, userId, inLikesPage }: Pro
</div> </div>
<div className="mt-auto grid grid-cols-2 items-center"> <div className="mt-auto grid grid-cols-2 items-center">
<LikeButton likes={mii.likes} miiId={mii.id} isLiked={mii.isLiked} isLoggedIn={session?.user != null} abbreviate /> <LikeButton likes={mii.likes} miiId={mii.id} isLiked={mii.isLiked} abbreviate />
{!userId && ( {!userId && (
<Link href={`/profile/${mii.user?.id}`} className="text-sm text-right overflow-hidden text-ellipsis"> <Link href={`/profile/${mii.user?.id}`} className="text-sm text-right overflow-hidden text-ellipsis">