feat: add tags page

backup/gists/[page]/page.tsx

@@ -0,0 +1,39 @@
+import FileContent from 'components/pages/gists/file-content';
+import Pagination from 'components/rua/rua-pagination';
+import { getGists } from 'lib/fetcher';
+import { notFound } from 'next/navigation';
+
+export const revalidate = 600;
+
+export default async function Page({
+  params,
+}: {
+  params: Promise<{
+    page: string;
+  }>;
+}) {
+  const { page: pageNumber } = await params;
+  const page = Number(pageNumber);
+  if (!page) notFound();
+  const gists = await getGists(page);
+  if (!gists) notFound();
+
+  const prev = Number(gists.pageSize.prev);
+  const next = Number(gists.pageSize.next);
+  const total = Number(gists.pageSize.last);
+
+  return (
+    <>
+      <FileContent gists={gists.gists} />
+      <Pagination
+        className="mt-4"
+        hasPrev={!!prev}
+        hasNext={!!next}
+        prevLink={prev === 1 ? `/gists/` : `/gists/${prev}`}
+        nextLink={`/gists/${next}`}
+        current={prev == null ? next - 1 : prev + 1}
+        total={total}
+      />
+    </>
+  );
+}

backup/gists/layout.tsx

@@ -0,0 +1,31 @@
+import UserInfo from 'components/pages/gists/user-info';
+import UserInfoLoading from 'components/pages/gists/user-info-skeleton';
+import { Metadata } from 'next';
+import { ReactNode, Suspense } from 'react';
+
+export const revalidate = 600;
+export const metadata: Metadata = {
+  title: 'RUA - Gists',
+};
+
+export default async function PageLayout({
+  children,
+}: {
+  children: ReactNode;
+}) {
+  return (
+    <>
+      <main className="w-full max-w-5xl px-4 mx-auto lg:px-0">
+        <div className="md:flex">
+          <Suspense fallback={<UserInfoLoading />}>
+            <UserInfo />
+          </Suspense>
+
+          <div className="flex-1 px-1 py-4 overflow-hidden md:pl-8">
+            {children}
+          </div>
+        </div>
+      </main>
+    </>
+  );
+}

backup/gists/loading.tsx

@@ -0,0 +1,13 @@
+import FileContentLoading from 'components/pages/gists/file-content-skeleton';
+
+export default function Loading() {
+  const num = Array(3).fill(null);
+
+  return (
+    <>
+      {num.map((_, i) => (
+        <FileContentLoading key={i} />
+      ))}
+    </>
+  );
+}

backup/gists/page.tsx

@@ -0,0 +1,30 @@
+import FileContent from 'components/pages/gists/file-content';
+import Pagination from 'components/rua/rua-pagination';
+import { getGists } from 'lib/fetcher';
+import { notFound } from 'next/navigation';
+
+export const revalidate = 600;
+
+export default async function Page() {
+  const gists = await getGists();
+  if (!gists) notFound();
+
+  const prev = Number(gists.pageSize.prev);
+  const next = Number(gists.pageSize.next);
+  const total = Number(gists.pageSize.last);
+
+  return (
+    <>
+      <FileContent gists={gists.gists} />
+      <Pagination
+        className="mt-4"
+        hasPrev={!!prev}
+        hasNext={!!next}
+        prevLink={prev === 1 ? `/gists/` : `/gists/${prev}`}
+        nextLink={`/gists/${next}`}
+        current={prev == null ? next - 1 : prev + 1}
+        total={total}
+      />
+    </>
+  );
+}