= {
'description-small': 'Describe this image succinctly',
'description': 'Describe this image',
'description-large': 'Describe this image in detail',
- 'semantic': 'List up to 5 things in this image without description as a comma-separated list',
+ 'description-semantic': 'List up to 5 things in this image without description as a comma-separated list',
};
export const streamAiImageQuery = (imageBase64: string, query: AiImageQuery) =>
diff --git a/src/photo/ai/useImageQueries.ts b/src/photo/ai/useImageQueries.ts
index 1fffe33a..f0fd504d 100644
--- a/src/photo/ai/useImageQueries.ts
+++ b/src/photo/ai/useImageQueries.ts
@@ -24,11 +24,21 @@ export default function useImageQueries() {
const [
requestSemantic,
- semantic,
+ semanticDescription,
isLoadingSemantic,
- ] = useImageQuery(imageData, 'semantic');
+ ] = useImageQuery(imageData, 'description-semantic');
- const isLoading = isLoadingTitleCaption || isLoadingTags || isLoadingSemantic;
+ const hasContent = Boolean(
+ title ||
+ caption ||
+ tags ||
+ semanticDescription
+ );
+
+ const isLoading =
+ isLoadingTitleCaption ||
+ isLoadingTags ||
+ isLoadingSemantic;
const request = useCallback(async () => {
if (!isLoading) {
@@ -44,8 +54,9 @@ export default function useImageQueries() {
title,
caption,
tags,
- semantic,
+ semanticDescription,
isReady,
+ hasContent,
isLoading,
isLoadingTitleCaption,
isLoadingTags,
diff --git a/src/photo/form/PhotoForm.tsx b/src/photo/form/PhotoForm.tsx
index c2708e51..b730f086 100644
--- a/src/photo/form/PhotoForm.tsx
+++ b/src/photo/form/PhotoForm.tsx
@@ -120,6 +120,33 @@ export default function PhotoForm({
}
}, []);
+ useEffect(() => {
+ if (aiContent?.hasContent) {
+ setFormData(data => ({
+ ...data,
+ title: aiContent.title,
+ caption: aiContent.caption,
+ tags: aiContent.tags,
+ semanticDescription: aiContent.semanticDescription,
+ }));
+ }
+ }, [aiContent]);
+
+ const isFieldGeneratingAi = (key: keyof PhotoFormData) => {
+ switch (key) {
+ case 'title':
+ return aiContent?.isLoadingTitleCaption;
+ case 'caption':
+ return aiContent?.isLoadingTitleCaption;
+ case 'tags':
+ return aiContent?.isLoadingTags;
+ case 'semanticDescription':
+ return aiContent?.isLoadingSemantic;
+ default:
+ return false;
+ }
+ };
+
return (
{debugBlur && blurError &&
@@ -158,10 +185,6 @@ export default function PhotoForm({
height={height}
/>}
- Title: {aiContent?.title}
- Caption: {aiContent?.caption}
- Tags: {aiContent?.tags}
- Semantic: {aiContent?.semantic}