diff --git a/src/photo/PhotoForm.tsx b/src/photo/PhotoForm.tsx index bce6fd07..cd9a50a5 100644 --- a/src/photo/PhotoForm.tsx +++ b/src/photo/PhotoForm.tsx @@ -4,6 +4,7 @@ import { useCallback, useEffect, useState } from 'react'; import { FORM_METADATA_ENTRIES, PhotoFormData, + convertFormKeysToLabels, getInitialErrors, isFormValid, } from './form'; @@ -44,13 +45,13 @@ export default function PhotoForm({ // is refreshed by parent useEffect(() => { if (Object.keys(updatedExifData ?? {}).length > 0) { - const changedKeys: string[] = []; + const changedKeys: (keyof PhotoFormData)[] = []; setFormData(currentForm => { Object.entries(updatedExifData ?? {}) .forEach(([key, value]) => { if (currentForm[key as keyof PhotoFormData] !== value) { - changedKeys.push(key); + changedKeys.push(key as keyof PhotoFormData); } }); @@ -61,8 +62,9 @@ export default function PhotoForm({ }); if (changedKeys.length > 0) { + const fields = convertFormKeysToLabels(changedKeys); toastSuccess( - `Updated EXIF fields: ${changedKeys.join(', ')}`, + `Updated EXIF fields: ${fields.join(', ')}`, 8000, ); } else { diff --git a/src/photo/form.ts b/src/photo/form.ts index cf4a322a..6e243165 100644 --- a/src/photo/form.ts +++ b/src/photo/form.ts @@ -84,6 +84,9 @@ export const FORM_METADATA_ENTRIES = (Object.entries(FORM_METADATA) as [keyof PhotoFormData, FormMeta][]) .filter(([_, meta]) => !meta.hideTemporarily); +export const convertFormKeysToLabels = (keys: (keyof PhotoFormData)[]) => + keys.map(key => FORM_METADATA[key].label.toUpperCase()); + export const getInitialErrors = ( formData: Partial ): Partial> => diff --git a/src/toast/ToasterWithThemes.tsx b/src/toast/ToasterWithThemes.tsx index c6d1547b..6502754e 100644 --- a/src/toast/ToasterWithThemes.tsx +++ b/src/toast/ToasterWithThemes.tsx @@ -13,6 +13,8 @@ export default function ToasterWithThemes() { classNames: { toast: clsx( 'font-mono font-normal', + '!text-gray-900 dark:!text-gray-100', + '!bg-white dark:!bg-black', '!border-gray-200 dark:!border-gray-800', ), },