Add initial app insights content

src/admin/AdminInfoPage.tsx

@@ -0,0 +1,30 @@
+import Container from '@/components/Container';
+import SiteGrid from '@/components/SiteGrid';
+import { ReactNode } from 'react';
+
+export default function AdminInfoPage({
+  title,
+  accessory,
+  children,
+}: {
+  title: string
+  accessory?: ReactNode
+  children: ReactNode
+}) {
+  return (
+    <SiteGrid
+      contentMain={
+        <div className="space-y-4">
+          <div className="flex items-center gap-4 min-h-9">
+            <div className="grow">
+              {title}
+            </div>
+            {accessory}
+          </div>
+          <Container spaceChildren={false}>
+            {children}
+          </Container>
+        </div>}
+    />
+  );
+}

src/admin/AdminNavClient.tsx

@@ -7,10 +7,10 @@ import SiteGrid from '@/components/SiteGrid';
 import Spinner from '@/components/Spinner';
 import {
   PATH_ADMIN_CONFIGURATION,
-  PATH_ADMIN_INFO,
+  PATH_ADMIN_INSIGHTS,
   checkPathPrefix,
   isPathAdminConfiguration,
-  isPathAdminInfo,
+  isPathAdminInsights,
   isPathTopLevelAdmin,
 } from '@/site/paths';
 import { useAppState } from '@/state/AppState';
@@ -91,8 +91,8 @@ export default function AdminNavClient({
             </div>
             <span className="inline-flex relative">
               <LinkWithLoader
-                href={PATH_ADMIN_INFO}
-                className={isPathAdminInfo(pathname)
+                href={PATH_ADMIN_INSIGHTS}
+                className={isPathAdminInsights(pathname)
                   ? 'font-bold'
                   : 'text-dim'}
                 loader={<Spinner />}

src/app/admin/configuration/page.tsx

@@ -1,27 +1,14 @@
 import ClearCacheButton from '@/admin/ClearCacheButton';
-import GitHubForkStatusBadge from '@/admin/github/GitHubForkStatusBadge';
-import Container from '@/components/Container';
-import SiteGrid from '@/components/SiteGrid';
-import { IS_DEVELOPMENT, IS_VERCEL_GIT_PROVIDER_GITHUB } from '@/site/config';
 import SiteChecklist from '@/site/SiteChecklist';
+import AdminInfoPage from '@/admin/AdminInfoPage';
 
-export default async function AdminConfigurationPage() {
+export default function AdminConfigurationPage() {
   return (
-    <SiteGrid
-      contentMain={
-        <div className="space-y-4">
-          <div className="flex items-center gap-4">
-            <div className="grow">
-              App Configuration
-            </div>
-            {(IS_VERCEL_GIT_PROVIDER_GITHUB || IS_DEVELOPMENT) &&
-              <GitHubForkStatusBadge />}
-            <ClearCacheButton />
-          </div>
-          <Container spaceChildren={false}>
-            <SiteChecklist />
-          </Container>
-        </div>}
-    />
+    <AdminInfoPage
+      title="App Configuration"
+      accessory={<ClearCacheButton />}
+    >
+      <SiteChecklist />
+    </AdminInfoPage>
   );
 }

src/app/admin/info/page.tsx

@@ -1,3 +0,0 @@
-export default function AdminInfoPage() {
-  return <div>Admin Info</div>;
-}

src/app/admin/insights/page.tsx

@@ -0,0 +1,28 @@
+import AdminInfoPage from '@/admin/AdminInfoPage';
+import GitHubForkStatusBadge from '@/admin/github/GitHubForkStatusBadge';
+import { dateRangeForPhotos } from '@/photo';
+import { getPhotosMetaCached } from '@/photo/cache';
+import { IS_DEVELOPMENT, IS_VERCEL_GIT_PROVIDER_GITHUB } from '@/site/config';
+
+export default async function AdminInsightsPage() {
+  const { count, dateRange } = await getPhotosMetaCached();
+
+  const { start, end } = dateRangeForPhotos(undefined, dateRange);
+
+  return <AdminInfoPage
+    title="App Insights"
+    accessory={(IS_VERCEL_GIT_PROVIDER_GITHUB || IS_DEVELOPMENT) &&
+      <GitHubForkStatusBadge />}
+  >
+    <div className="flex flex-col justify-center gap-4 *:text-center">
+      <div>
+        {count} photos
+      </div>
+      <span className="text-dim uppercase">
+        {start === end
+          ? start
+          : <>{end} – {start}</>}
+      </span>
+    </div>
+  </AdminInfoPage>;
+}

src/components/cmdk/CommandKClient.tsx

@@ -12,6 +12,7 @@ import {
 import {
   PATH_ADMIN_BASELINE,
   PATH_ADMIN_CONFIGURATION,
+  PATH_ADMIN_INSIGHTS,
   PATH_ADMIN_PHOTOS,
   PATH_ADMIN_TAGS,
   PATH_ADMIN_UPLOADS,
@@ -320,6 +321,10 @@ export default function CommandKClient({
         label: 'App Config',
         annotation: <BiLockAlt />,
         path: PATH_ADMIN_CONFIGURATION,
+      }, {
+        label: 'App Insights',
+        annotation: <BiLockAlt />,
+        path: PATH_ADMIN_INSIGHTS,
       }, {
         label: selectedPhotoIds === undefined
           ? 'Select Multiple Photos'

src/site/paths.ts

@@ -39,7 +39,7 @@ export const PATH_ADMIN_OUTDATED      = `${PATH_ADMIN}/outdated`;
 export const PATH_ADMIN_UPLOADS       = `${PATH_ADMIN}/uploads`;
 export const PATH_ADMIN_TAGS          = `${PATH_ADMIN}/tags`;
 export const PATH_ADMIN_CONFIGURATION = `${PATH_ADMIN}/configuration`;
-export const PATH_ADMIN_INFO          = `${PATH_ADMIN}/info`;
+export const PATH_ADMIN_INSIGHTS      = `${PATH_ADMIN}/insights`;
 export const PATH_ADMIN_BASELINE      = `${PATH_ADMIN}/baseline`;
 
 // Debug paths
@@ -214,8 +214,8 @@ export const isPathTopLevelAdmin = (pathname?: string) =>
 export const isPathAdminConfiguration = (pathname?: string) =>
   checkPathPrefix(pathname, PATH_ADMIN_CONFIGURATION);
 
-export const isPathAdminInfo = (pathname?: string) =>
-  checkPathPrefix(pathname, PATH_ADMIN_INFO);
+export const isPathAdminInsights = (pathname?: string) =>
+  checkPathPrefix(pathname, PATH_ADMIN_INSIGHTS);
 
 export const isPathProtected = (pathname?: string) =>
   checkPathPrefix(pathname, PATH_ADMIN) ||