refactor: externalize AppPage component and streamline all tool pages

components/layout/AppPage.tsx

@@ -0,0 +1,29 @@
+'use client';
+
+import * as React from 'react';
+import { cn } from '@/lib/utils';
+
+interface AppPageProps {
+  title: string;
+  description?: string;
+  children: React.ReactNode;
+  className?: string;
+}
+
+export function AppPage({ title, description, children, className }: AppPageProps) {
+  return (
+    <div className={cn("min-h-screen py-12", className)}>
+      <div className="max-w-7xl mx-auto px-8 space-y-8">
+        <div>
+          <h1 className="text-4xl font-bold mb-2">{title}</h1>
+          {description && (
+            <p className="text-muted-foreground">
+              {description}
+            </p>
+          )}
+        </div>
+        {children}
+      </div>
+    </div>
+  );
+}