fix: removed a11y order

RocketChat · Jan 7, 2025 · 0806983 · 0806983
1 parent 0a4a9ac
commit 0806983
Show file tree

Hide file tree

Showing 4 changed files with 87 additions and 110 deletions.
diff --git a/app/containers/TextInput/FormTextInput.tsx b/app/containers/TextInput/FormTextInput.tsx
@@ -2,7 +2,6 @@ import { BottomSheetTextInput } from '@discord/bottom-sheet';
 import React, { useState } from 'react';
 import { StyleProp, StyleSheet, Text, TextInput as RNTextInput, TextInputProps, TextStyle, View, ViewStyle } from 'react-native';
 import Touchable from 'react-native-platform-touchable';
-import { A11y } from 'react-native-a11y-order';
 
 import i18n from '../../i18n';
 import { useTheme } from '../../theme';
@@ -100,106 +99,98 @@ export const FormTextInput = ({
 	const Input = bottomSheet ? BottomSheetTextInput : TextInput;
 
 	return (
-		<A11y.Order>
-			<A11y.Index index={1}>
-				<View
-					accessible
-					accessibilityLabel={accessibilityLabel ?? `${label} - ${required ? i18n.t('Required') : ''}`}
-					style={[styles.inputContainer, containerStyle]}>
-					{label ? (
-						<Text style={[styles.label, { color: colors.fontTitlesLabels }, error?.error && { color: colors.fontDanger }]}>
-							{label}{' '}
-							{required && (
-								<Text style={[styles.required, { color: colors.fontSecondaryInfo }]}>{`(${i18n.t('Required')})`}</Text>
-							)}
-						</Text>
-					) : null}
+		<View
+			accessible
+			accessibilityLabel={accessibilityLabel ?? `${label} - ${required ? i18n.t('Required') : ''}`}
+			style={[styles.inputContainer, containerStyle]}>
+			{label ? (
+				<Text style={[styles.label, { color: colors.fontTitlesLabels }, error?.error && { color: colors.fontDanger }]}>
+					{label}{' '}
+					{required && <Text style={[styles.required, { color: colors.fontSecondaryInfo }]}>{`(${i18n.t('Required')})`}</Text>}
+				</Text>
+			) : null}
 
-					<View accessible style={styles.wrap}>
-						<Input
-							style={[
-								styles.input,
-								iconLeft && styles.inputIconLeft,
-								(secureTextEntry || iconRight || showClearInput) && styles.inputIconRight,
-								{
-									backgroundColor: colors.surfaceRoom,
-									borderColor: colors.strokeLight,
-									color: colors.fontTitlesLabels
-								},
-								error?.error && {
-									color: colors.buttonBackgroundDangerDefault,
-									borderColor: colors.buttonBackgroundDangerDefault
-								},
-								inputStyle
-							]}
-							// @ts-ignore ref error
-							ref={inputRef}
-							autoCorrect={false}
-							autoCapitalize='none'
-							underlineColorAndroid='transparent'
-							secureTextEntry={secureTextEntry && !showPassword}
-							testID={testID}
-							placeholder={placeholder}
-							value={value}
-							placeholderTextColor={colors.fontAnnotation}
-							{...inputProps}
-						/>
+			<View accessible style={styles.wrap}>
+				<Input
+					style={[
+						styles.input,
+						iconLeft && styles.inputIconLeft,
+						(secureTextEntry || iconRight || showClearInput) && styles.inputIconRight,
+						{
+							backgroundColor: colors.surfaceRoom,
+							borderColor: colors.strokeLight,
+							color: colors.fontTitlesLabels
+						},
+						error?.error && {
+							color: colors.buttonBackgroundDangerDefault,
+							borderColor: colors.buttonBackgroundDangerDefault
+						},
+						inputStyle
+					]}
+					// @ts-ignore ref error
+					ref={inputRef}
+					autoCorrect={false}
+					autoCapitalize='none'
+					underlineColorAndroid='transparent'
+					secureTextEntry={secureTextEntry && !showPassword}
+					testID={testID}
+					placeholder={placeholder}
+					value={value}
+					placeholderTextColor={colors.fontAnnotation}
+					{...inputProps}
+				/>
 
-						{iconLeft ? (
-							<CustomIcon
-								name={iconLeft}
-								testID={testID ? `${testID}-icon-left` : undefined}
-								size={20}
-								color={colors.fontSecondaryInfo}
-								style={[styles.iconContainer, styles.iconLeft]}
-							/>
-						) : null}
+				{iconLeft ? (
+					<CustomIcon
+						name={iconLeft}
+						testID={testID ? `${testID}-icon-left` : undefined}
+						size={20}
+						color={colors.fontSecondaryInfo}
+						style={[styles.iconContainer, styles.iconLeft]}
+					/>
+				) : null}
 
-						{showClearInput ? (
-							<Touchable onPress={onClearInput} style={[styles.iconContainer, styles.iconRight]} testID='clear-text-input'>
-								<CustomIcon name='input-clear' size={20} color={colors.fontDefault} />
-							</Touchable>
-						) : null}
+				{showClearInput ? (
+					<Touchable onPress={onClearInput} style={[styles.iconContainer, styles.iconRight]} testID='clear-text-input'>
+						<CustomIcon name='input-clear' size={20} color={colors.fontDefault} />
+					</Touchable>
+				) : null}
 
-						{iconRight && !showClearInput ? (
-							<CustomIcon
-								name={iconRight}
-								testID={testID ? `${testID}-icon-right` : undefined}
-								size={20}
-								color={colors.fontDefault}
-								style={[styles.iconContainer, styles.iconRight]}
-								accessible={false}
-							/>
-						) : null}
+				{iconRight && !showClearInput ? (
+					<CustomIcon
+						name={iconRight}
+						testID={testID ? `${testID}-icon-right` : undefined}
+						size={20}
+						color={colors.fontDefault}
+						style={[styles.iconContainer, styles.iconRight]}
+						accessible={false}
+					/>
+				) : null}
 
-						{secureTextEntry ? (
-							<A11y.Index style={[styles.iconContainer, styles.iconRight]} index={2}>
-								<Touchable
-									accessible
-									accessibilityLabel={showPassword ? i18n.t('Hide_Password') : i18n.t('Show_Password')}
-									onPress={() => setShowPassword(!showPassword)}>
-									<CustomIcon
-										name={showPassword ? 'unread-on-top' : 'unread-on-top-disabled'}
-										testID={testID ? `${testID}-icon-password` : undefined}
-										size={20}
-										color={colors.fontDefault}
-									/>
-								</Touchable>
-							</A11y.Index>
-						) : null}
+				{secureTextEntry ? (
+					<Touchable
+						accessible
+						accessibilityLabel={showPassword ? i18n.t('Hide_Password') : i18n.t('Show_Password')}
+						onPress={() => setShowPassword(!showPassword)}>
+						<CustomIcon
+							name={showPassword ? 'unread-on-top' : 'unread-on-top-disabled'}
+							testID={testID ? `${testID}-icon-password` : undefined}
+							size={20}
+							color={colors.fontDefault}
+						/>
+					</Touchable>
+				) : null}
 
-						{loading ? (
-							<ActivityIndicator
-								style={[styles.iconContainer, styles.iconRight]}
-								color={colors.fontDefault}
-								testID={testID ? `${testID}-loading` : undefined}
-							/>
-						) : null}
-						{left}
-					</View>
-					{error && error.reason ? <Text style={[styles.error, { color: colors.fontDanger }]}>{error.reason}</Text> : null}
-				</View>
-			</A11y.Index>
-		</A11y.Order>
+				{loading ? (
+					<ActivityIndicator
+						style={[styles.iconContainer, styles.iconRight]}
+						color={colors.fontDefault}
+						testID={testID ? `${testID}-loading` : undefined}
+					/>
+				) : null}
+				{left}
+			</View>
+			{error && error.reason ? <Text style={[styles.error, { color: colors.fontDanger }]}>{error.reason}</Text> : null}
+		</View>
 	);
 };
diff --git a/ios/Podfile.lock b/ios/Podfile.lock
@@ -1032,10 +1032,6 @@ PODS:
   - React-Mapbuffer (0.73.6):
     - glog
     - React-debug
-  - react-native-a11y-order (0.2.2):
-    - glog
-    - RCT-Folly (= 2022.05.16.00)
-    - React-Core
   - react-native-background-timer (2.4.1):
     - React-Core
   - react-native-cameraroll (7.5.0):
@@ -1368,7 +1364,6 @@ DEPENDENCIES:
   - React-jsinspector (from `../node_modules/react-native/ReactCommon/jsinspector-modern`)
   - React-logger (from `../node_modules/react-native/ReactCommon/logger`)
   - React-Mapbuffer (from `../node_modules/react-native/ReactCommon`)
-  - react-native-a11y-order (from `../node_modules/react-native-a11y-order`)
   - react-native-background-timer (from `../node_modules/react-native-background-timer`)
   - "react-native-cameraroll (from `../node_modules/@react-native-camera-roll/camera-roll`)"
   - "react-native-cookies (from `../node_modules/@react-native-cookies/cookies`)"
@@ -1541,8 +1536,6 @@ EXTERNAL SOURCES:
     :path: "../node_modules/react-native/ReactCommon/logger"
   React-Mapbuffer:
     :path: "../node_modules/react-native/ReactCommon"
-  react-native-a11y-order:
-    :path: "../node_modules/react-native-a11y-order"
   react-native-background-timer:
     :path: "../node_modules/react-native-background-timer"
   react-native-cameraroll:
@@ -1723,7 +1716,6 @@ SPEC CHECKSUMS:
   React-jsinspector: 85583ef014ce53d731a98c66a0e24496f7a83066
   React-logger: 3eb80a977f0d9669468ef641a5e1fabbc50a09ec
   React-Mapbuffer: 84ea43c6c6232049135b1550b8c60b2faac19fab
-  react-native-a11y-order: 0ba9ed33996f29c07c75169b54a68c28fd2dc1dd
   react-native-background-timer: 17ea5e06803401a379ebf1f20505b793ac44d0fe
   react-native-cameraroll: 4593ffad9e619781aed27dda64739387d55ed402
   react-native-cookies: f54fcded06bb0cda05c11d86788020b43528a26c

diff --git a/package.json b/package.json
@@ -86,7 +86,6 @@
 		"react": "18.2.0",
 		"react-hook-form": "7.34.2",
 		"react-native": "0.73.6",
-		"react-native-a11y-order": "^0.2.2",
 		"react-native-animatable": "1.3.3",
 		"react-native-background-timer": "2.4.1",
 		"react-native-bootsplash": "4.6.0",

diff --git a/yarn.lock b/yarn.lock
@@ -11892,11 +11892,6 @@ react-is@^17.0.1:
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-17.0.2.tgz#e691d4a8e9c789365655539ab372762b0efb54f0"
   integrity sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==
 
-react-native-a11y-order@^0.2.2:
-  version "0.2.2"
-  resolved "https://registry.yarnpkg.com/react-native-a11y-order/-/react-native-a11y-order-0.2.2.tgz#cefefa851acb06c35708dfa44159a9ca6541b3ae"
-  integrity sha512-njUSURENgSqIcH6T6bZ1NWngb3lsqHCgkS8cUQqid7cGw6JwurMiHuuSRyRAiZZKubKUF5nML099F4mUHGeX+Q==
-
 [email protected]:
   version "1.3.3"
   resolved "https://registry.yarnpkg.com/react-native-animatable/-/react-native-animatable-1.3.3.tgz#a13a4af8258e3bb14d0a9d839917e9bb9274ec8a"