From 76d63f9967a9a59193652487d2a10f41eac22268 Mon Sep 17 00:00:00 2001
From: Eric Bailey <git@esb.lol>
Date: Sat, 5 Oct 2024 05:58:04 -0500
Subject: Add alt text limit to image dialog (#5611)

* Add alt text limit to image dialog

* GIF alt text too

* Fix

* tweaks, save alt on dialog dismiss

* simplify close behavior

* use state in gif alt

* state

---------

Co-authored-by: Hailey <me@haileyok.com>
---
 src/view/com/composer/AltTextCounterWrapper.tsx | 33 +++++++++++++++++++++++++
 1 file changed, 33 insertions(+)
 create mode 100644 src/view/com/composer/AltTextCounterWrapper.tsx

(limited to 'src/view/com/composer/AltTextCounterWrapper.tsx')

diff --git a/src/view/com/composer/AltTextCounterWrapper.tsx b/src/view/com/composer/AltTextCounterWrapper.tsx
new file mode 100644
index 000000000..d69252f4b
--- /dev/null
+++ b/src/view/com/composer/AltTextCounterWrapper.tsx
@@ -0,0 +1,33 @@
+import React from 'react'
+import {View} from 'react-native'
+
+import {MAX_ALT_TEXT} from '#/lib/constants'
+import {CharProgress} from '#/view/com/composer/char-progress/CharProgress'
+import {atoms as a, useTheme} from '#/alf'
+
+export function AltTextCounterWrapper({
+  altText,
+  children,
+}: {
+  altText?: string
+  children: React.ReactNode
+}) {
+  const t = useTheme()
+  return (
+    <View style={[a.flex_row]}>
+      <CharProgress
+        style={[
+          a.flex_col_reverse,
+          a.align_center,
+          a.mr_xs,
+          {minWidth: 50, gap: 1},
+        ]}
+        textStyle={[{marginRight: 0}, a.text_sm, t.atoms.text_contrast_medium]}
+        size={26}
+        count={altText?.length || 0}
+        max={MAX_ALT_TEXT}
+      />
+      {children}
+    </View>
+  )
+}
-- 
cgit 1.4.1