add a refresh button to /admin/manage/irasuto

Signed-off-by: Vu Van Dung <me@joulev.dev>

src/app/admin/manage/irasuto/page.tsx

@@ -2,13 +2,18 @@ import { Collage } from "~/components/irasuto/collage";
 import { Card } from "~/components/ui/card";
 import { getPhotos } from "~/lib/irasuto/get-photos";
 
+import { RefreshButton } from "./refresh";
+
 export default async function Page() {
   const photos = await getPhotos();
   return (
     <main className="container">
       <Card className="p-0">
         <Collage photos={photos} allowDelete />
       </Card>
+      <div className="fixed bottom-12 left-1/2 -translate-x-1/2">
+        <RefreshButton />
+      </div>
     </main>
   );
 }

src/app/admin/manage/irasuto/refresh-action.ts

@@ -0,0 +1,8 @@
+"use server";
+
+import { revalidateTag } from "next/cache";
+
+// eslint-disable-next-line @typescript-eslint/require-await -- Server actions must be async
+export async function refreshIrasuto() {
+  revalidateTag("photos");
+}

src/app/admin/manage/irasuto/refresh.tsx

@@ -0,0 +1,17 @@
+"use client";
+
+import { RotateCcw } from "~/components/icons";
+import { Button } from "~/components/ui/button";
+import { useTransitionWithNProgress } from "~/lib/hooks/use-transition-with-nprogress";
+
+import { refreshIrasuto } from "./refresh-action";
+
+export function RefreshButton() {
+  const startTransition = useTransitionWithNProgress();
+  const refresh = () => startTransition(refreshIrasuto);
+  return (
+    <Button onClick={refresh}>
+      <RotateCcw /> Force-refresh
+    </Button>
+  );
+}