feat: add table components and admin article list with skeleton loading

src/app/(pages)/admin/article/[externalId]/page.tsx

@@ -0,0 +1,40 @@
+import { getArticleByExternalId } from '@/lib/feature/article/article.external';
+import { UpdateArticleForm } from '@/ui/components/internal/update-article-form';
+import { UUIDv4 } from '@/utils/types/uuid';
+import { ArrowLeftIcon } from 'lucide-react';
+import Link from 'next/link';
+import { notFound } from 'next/navigation';
+
+interface UpdateArticlePageProps {
+    params: Promise<{ externalId: string }>;
+}
+
+const UpdateArticlePage = async ({ params }: UpdateArticlePageProps) => {
+    const { externalId } = await params;
+
+    const result = await getArticleByExternalId(externalId as UUIDv4);
+    if (!result.ok) throw result.error;
+
+    const article = result.value;
+    if (!article) notFound();
+
+    return (
+        <div className='container mx-auto px-4 py-10 min-h-3/4'>
+            <div className='mb-6'>
+                <Link
+                    href='/admin'
+                    className='inline-flex items-center gap-1.5 text-sm text-muted-foreground hover:text-foreground transition-colors'
+                >
+                    <ArrowLeftIcon className='size-4' />
+                    Back to articles
+                </Link>
+            </div>
+            <div className='rounded-lg border border-border p-6'>
+                <h2 className='mb-6 text-2xl font-bold'>Edit Article</h2>
+                <UpdateArticleForm article={article} />
+            </div>
+        </div>
+    );
+};
+
+export default UpdateArticlePage;