Add AI generation to new uploads

src/app/admin/uploads/[uploadPath]/page.tsx

@@ -3,6 +3,7 @@ import { extractExifDataFromBlobPath } from '@/photo/server';
 import { redirect } from 'next/navigation';
 import { getUniqueTagsCached } from '@/photo/cache';
 import UploadPageClient from '@/photo/UploadPageClient';
+import { AI_TEXT_GENERATION_ENABLED } from '@/site/config';
 
 interface Params {
   params: { uploadPath: string }
@@ -18,11 +19,14 @@ export default async function UploadPage({ params: { uploadPath } }: Params) {
 
   const uniqueTags = await getUniqueTagsCached();
 
+  const hasAiTextGeneration = AI_TEXT_GENERATION_ENABLED;
+
   return (
     <UploadPageClient {...{
       blobId,
       photoFormExif,
       uniqueTags,
+      hasAiTextGeneration,
     }} />
   );
 };

src/photo/PhotoEditPageClient.tsx

@@ -7,7 +7,6 @@ import SubmitButtonWithStatus from '@/components/SubmitButtonWithStatus';
 import {
   PhotoFormData,
   convertPhotoToFormData,
-  formHasTextContent,
 } from './form';
 import PhotoForm from './form/PhotoForm';
 import { useFormState } from 'react-dom';
@@ -15,9 +14,8 @@ import { areSimpleObjectsEqual } from '@/utility/object';
 import IconGrSync from '@/site/IconGrSync';
 import { getExifDataAction } from './actions';
 import { Tags } from '@/tag';
-import { useState } from 'react';
-import useAiImageQueries from './ai/useAiImageQueries';
 import AiButton from './ai/AiButton';
+import usePhotoFormParent from './form/usePhotoFormParent';
 
 export default function PhotoEditPageClient({
   photo,
@@ -35,19 +33,22 @@ export default function PhotoEditPageClient({
     seedExifData,
   );
 
-  const photoForm = convertPhotoToFormData(photo);
-
-  const [pending, setIsPending] = useState(false);
-  const [updatedTitle, setUpdatedTitle] = useState('');
-  const [hasTextContent, setHasTextContent] =
-    useState(formHasTextContent(photoForm));
-
   const hasExifDataBeenFound = !areSimpleObjectsEqual(
     updatedExifData,
     seedExifData,
   );
 
-  const aiContent = useAiImageQueries();
+  const photoForm = convertPhotoToFormData(photo);
+
+  const {
+    pending,
+    setIsPending,
+    updatedTitle,
+    setUpdatedTitle,
+    hasTextContent,
+    setHasTextContent,
+    aiContent,
+  } = usePhotoFormParent(photoForm);
 
   return (
     <AdminChildPage

src/photo/UploadPageClient.tsx

@@ -5,19 +5,29 @@ import { PATH_ADMIN_UPLOADS } from '@/site/paths';
 import { PhotoFormData } from './form';
 import { Tags } from '@/tag';
 import PhotoForm from './form/PhotoForm';
-import { useState } from 'react';
+import usePhotoFormParent from './form/usePhotoFormParent';
+import AiButton from './ai/AiButton';
 
 export default function UploadPageClient({
   blobId,
   photoFormExif,
   uniqueTags,
+  hasAiTextGeneration,
 }: {
   blobId?: string
   photoFormExif: Partial<PhotoFormData>
   uniqueTags: Tags
+  hasAiTextGeneration: boolean
 }) {
-  const [pending, setIsPending] = useState(false);
-  const [updatedTitle, setUpdatedTitle] = useState('');
+  const {
+    pending,
+    setIsPending,
+    updatedTitle,
+    setUpdatedTitle,
+    hasTextContent,
+    setHasTextContent,
+    aiContent,
+  } = usePhotoFormParent();
 
   return (
     <AdminChildPage
@@ -26,12 +36,15 @@ export default function UploadPageClient({
       breadcrumb={pending && updatedTitle
         ? updatedTitle
         : blobId}
+      accessory={<AiButton {...{ aiContent, shouldConfirm: hasTextContent }} />}
       isLoading={pending}
     >
       <PhotoForm
         initialPhotoForm={photoFormExif}
         uniqueTags={uniqueTags}
+        aiContent={hasAiTextGeneration ? aiContent : undefined}
         onTitleChange={setUpdatedTitle}
+        onTextContentChange={setHasTextContent}
         onFormStatusChange={setIsPending}
       />
     </AdminChildPage>

src/photo/form/usePhotoFormParent.ts

@@ -0,0 +1,24 @@
+import { useState } from 'react';
+import { PhotoFormData, formHasTextContent } from '.';
+import useAiImageQueries from '../ai/useAiImageQueries';
+
+export default function usePhotoFormParent(
+  photoForm?: Partial<PhotoFormData>
+) {
+  const [pending, setIsPending] = useState(false);
+  const [updatedTitle, setUpdatedTitle] = useState('');
+  const [hasTextContent, setHasTextContent] =
+    useState(photoForm ? formHasTextContent(photoForm) : false);
+
+  const aiContent = useAiImageQueries();
+
+  return {
+    pending,
+    setIsPending,
+    updatedTitle,
+    setUpdatedTitle,
+    hasTextContent,
+    setHasTextContent,
+    aiContent,
+  };
+}