diff --git a/src/admin/ExifSyncButton.tsx b/src/admin/ExifSyncButton.tsx index b91367a9..517bcbe5 100644 --- a/src/admin/ExifSyncButton.tsx +++ b/src/admin/ExifSyncButton.tsx @@ -1,37 +1,39 @@ -import FormWithConfirm from '@/components/FormWithConfirm'; +'use client'; + +import LoaderButton from '@/components/primitives/LoaderButton'; import SubmitButtonWithStatus from '@/components/SubmitButtonWithStatus'; +import { getExifDataAction } from '@/photo/actions'; +import { PhotoFormData } from '@/photo/form'; import IconGrSync from '@/site/IconGrSync'; import { clsx } from 'clsx/lite'; -import { ComponentProps } from 'react'; +import { ComponentProps, useState } from 'react'; export default function ExifSyncButton({ - action, - label, - onFormSubmit, photoUrl, - className, + onSync, }: { - action: (formData: FormData) => void - label?: string - photoUrl?: string + photoUrl: string + onSync?: (data: Partial) => void } & ComponentProps) { + const [isLoading, setIsLoading] = useState(false); + return ( - { + setIsLoading(true); + getExifDataAction(photoUrl) + .then(onSync) + .finally(() => setIsLoading(false)); + }} + icon={} > - - } - onFormSubmit={onFormSubmit} - > - {label} - - + EXIF + ); } diff --git a/src/photo/PhotoEditPageClient.tsx b/src/photo/PhotoEditPageClient.tsx index 8924bd8c..33b7bcec 100644 --- a/src/photo/PhotoEditPageClient.tsx +++ b/src/photo/PhotoEditPageClient.tsx @@ -3,18 +3,13 @@ import AdminChildPage from '@/components/AdminChildPage'; import { Photo } from '.'; import { PATH_ADMIN_PHOTOS } from '@/site/paths'; -import { - PhotoFormData, - convertPhotoToFormData, -} from './form'; +import { PhotoFormData, convertPhotoToFormData } from './form'; import PhotoForm from './form/PhotoForm'; -import { useFormState } from 'react-dom'; -import { areSimpleObjectsEqual } from '@/utility/object'; -import { getExifDataAction } from './actions'; import { Tags } from '@/tag'; import AiButton from './ai/AiButton'; import usePhotoFormParent from './form/usePhotoFormParent'; import ExifSyncButton from '@/admin/ExifSyncButton'; +import { useState } from 'react'; export default function PhotoEditPageClient({ photo, @@ -29,18 +24,6 @@ export default function PhotoEditPageClient({ imageThumbnailBase64: string blurData: string }) { - const seedExifData = { url: photo.url }; - - const [updatedExifData, action] = useFormState>( - getExifDataAction, - seedExifData, - ); - - const hasExifDataBeenFound = !areSimpleObjectsEqual( - updatedExifData, - seedExifData, - ); - const photoForm = convertPhotoToFormData(photo); const { @@ -56,6 +39,9 @@ export default function PhotoEditPageClient({ imageThumbnailBase64, }); + const [updatedExifData, setUpdatedExifData] = + useState>(); + return ( } } isLoading={pending} @@ -79,9 +64,7 @@ export default function PhotoEditPageClient({ // Accessed from admin photo edit page // will not update blur data export const getExifDataAction = async ( - photoFormPrevious: Partial, + url: string, ): Promise> => runAuthenticatedAdminServerAction(async () => { - const { url } = photoFormPrevious; - if (url) { - const { photoFormExif } = await extractImageDataFromBlobPath(url); - if (photoFormExif) { - return photoFormExif; - } + const { photoFormExif } = await extractImageDataFromBlobPath(url); + if (photoFormExif) { + return photoFormExif; + } else { + return {}; } - return {}; }); // Accessed from admin photo table, will: