Move MAX_GRAPHEME_LENGTH to constants.ts (#735)

src/view/com/composer/char-progress/CharProgress.tsx

@@ -7,9 +7,9 @@ import ProgressCircle from 'react-native-progress/Circle'
 import ProgressPie from 'react-native-progress/Pie'
 import {s} from 'lib/styles'
 import {usePalette} from 'lib/hooks/usePalette'
+import {MAX_GRAPHEME_LENGTH} from 'lib/constants'
 
-const MAX_LENGTH = 300
-const DANGER_LENGTH = MAX_LENGTH
+const DANGER_LENGTH = MAX_GRAPHEME_LENGTH
 
 export function CharProgress({count}: {count: number}) {
   const pal = usePalette('default')
@@ -17,7 +17,9 @@ export function CharProgress({count}: {count: number}) {
   const circleColor = count > DANGER_LENGTH ? '#e60000' : pal.colors.link
   return (
     <>
-      <Text style={[s.mr10, {color: textColor}]}>{MAX_LENGTH - count}</Text>
+      <Text style={[s.mr10, {color: textColor}]}>
+        {MAX_GRAPHEME_LENGTH - count}
+      </Text>
       <View>
         {count > DANGER_LENGTH ? (
           <ProgressPie
@@ -25,7 +27,10 @@ export function CharProgress({count}: {count: number}) {
             borderWidth={4}
             borderColor={circleColor}
             color={circleColor}
-            progress={Math.min((count - MAX_LENGTH) / MAX_LENGTH, 1)}
+            progress={Math.min(
+              (count - MAX_GRAPHEME_LENGTH) / MAX_GRAPHEME_LENGTH,
+              1,
+            )}
           />
         ) : (
           <ProgressCircle
@@ -33,7 +38,7 @@ export function CharProgress({count}: {count: number}) {
             borderWidth={1}
             borderColor={pal.colors.border}
             color={circleColor}
-            progress={count / MAX_LENGTH}
+            progress={count / MAX_GRAPHEME_LENGTH}
           />
         )}
       </View>