state

bluesky-social · Oct 5, 2024 · 8285f08 · 8285f08
1 parent 13d195a
commit 8285f08
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 9 deletions.
diff --git a/src/view/com/composer/GifAltText.tsx b/src/view/com/composer/GifAltText.tsx
@@ -146,7 +146,7 @@ function AltTextInner({
                   onChangeText={text => {
                     setAltText(text)
                   }}
-                  value={altText}
+                  defaultValue={altText}
                   multiline
                   numberOfLines={3}
                   autoFocus

diff --git a/src/view/com/composer/photos/ImageAltTextDialog.tsx b/src/view/com/composer/photos/ImageAltTextDialog.tsx
@@ -31,41 +31,43 @@ export const ImageAltTextDialog = ({
   onChange,
   Portal,
 }: Props): React.ReactNode => {
-  const altTextRef = React.useRef<string>(image.alt)
+  const [altText, setAltText] = React.useState(image.alt)
 
   return (
     <Dialog.Outer
       control={control}
       onClose={() => {
         onChange({
           ...image,
-          alt: enforceLen(altTextRef.current, MAX_ALT_TEXT, true),
+          alt: enforceLen(altText, MAX_ALT_TEXT, true),
         })
       }}
       Portal={Portal}>
       <Dialog.Handle />
       <ImageAltTextInner
         control={control}
         image={image}
-        altTextRef={altTextRef}
+        altText={altText}
+        setAltText={setAltText}
       />
     </Dialog.Outer>
   )
 }
 
 const ImageAltTextInner = ({
-  altTextRef,
+  altText,
+  setAltText,
   control,
   image,
 }: {
-  altTextRef: React.MutableRefObject<string>
+  altText: string
+  setAltText: (text: string) => void
   control: DialogControlProps
   image: Props['image']
 }): React.ReactNode => {
   const {_, i18n} = useLingui()
   const t = useTheme()
   const windim = useWindowDimensions()
-  const [altText, setAltText] = React.useState(image.alt)
 
   const imageStyle = React.useMemo<ImageStyle>(() => {
     const maxWidth = isWeb ? 450 : windim.width
@@ -119,10 +121,9 @@ const ImageAltTextInner = ({
               <Dialog.Input
                 label={_(msg`Alt text`)}
                 onChangeText={text => {
-                  altTextRef.current = text
                   setAltText(text)
                 }}
-                value={altText}
+                defaultValue={altText}
                 multiline
                 numberOfLines={3}
                 autoFocus