feat: added google search console

apps/start/src/modals/page-details.tsx

@@ -0,0 +1,49 @@
+import { GscBreakdownTable } from '@/components/page/gsc-breakdown-table';
+import { GscClicksChart } from '@/components/page/gsc-clicks-chart';
+import { PageViewsChart } from '@/components/page/page-views-chart';
+import { SheetContent, SheetHeader, SheetTitle } from '@/components/ui/sheet';
+
+type Props = {
+  type: 'page' | 'query';
+  projectId: string;
+  value: string;
+};
+
+export default function PageDetails({ type, projectId, value }: Props) {
+  return (
+    <SheetContent className="flex flex-col gap-6 overflow-y-auto sm:max-w-xl">
+      <SheetHeader>
+        <SheetTitle className="truncate pr-8 font-medium font-mono text-sm">
+          {value}
+        </SheetTitle>
+      </SheetHeader>
+
+      <div className="col gap-6">
+        {type === 'page' &&
+          (() => {
+            let origin: string;
+            let path: string;
+            try {
+              const url = new URL(value);
+              origin = url.origin;
+              path = url.pathname + url.search;
+            } catch {
+              // value is path-only (e.g. "/docs/foo")
+              origin =
+                typeof window !== 'undefined' ? window.location.origin : '';
+              path = value;
+            }
+            return (
+              <PageViewsChart
+                origin={origin}
+                path={path}
+                projectId={projectId}
+              />
+            );
+          })()}
+        <GscClicksChart projectId={projectId} type={type} value={value} />
+        <GscBreakdownTable projectId={projectId} type={type} value={value} />
+      </div>
+    </SheetContent>
+  );
+}