Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore(a11y): DeleteAccountActionSheetContent #6047

Open
wants to merge 35 commits into
base: develop
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 33 commits
Commits
Show all changes
35 commits
Select commit Hold shift + click to select a range
77356f2
chore: updated E2EEnterYourPasswordView layout
OtavioStasiak Nov 18, 2024
678d3b2
fix: added label on show and hide password input
OtavioStasiak Nov 22, 2024
8ed9726
action: organized translations
OtavioStasiak Nov 22, 2024
2483bf9
fix: label on closeButton
OtavioStasiak Nov 22, 2024
ed83e9a
fix: lint
OtavioStasiak Nov 22, 2024
c4ff9a6
fix: i18n translation
OtavioStasiak Dec 4, 2024
d32af7e
chore: updated room info edit layout
OtavioStasiak Nov 22, 2024
46e6ad7
chore: useTheme
OtavioStasiak Nov 25, 2024
3d3f837
fix: lint
OtavioStasiak Nov 25, 2024
69e20ac
chore: updated pt-br translation
OtavioStasiak Nov 25, 2024
2015eb0
fix: lint
OtavioStasiak Nov 25, 2024
1878a1f
chore: updated a11y labels
OtavioStasiak Nov 25, 2024
936ac25
fix: lint
OtavioStasiak Nov 25, 2024
5045e8b
chore: updated translation
OtavioStasiak Nov 26, 2024
a56fdbd
fix: toggle archive
OtavioStasiak Nov 26, 2024
c740b88
fix: e2e roomInfo iOS test
OtavioStasiak Nov 29, 2024
e43f790
fix: e2e room info and create team tests
OtavioStasiak Nov 29, 2024
c6aa07a
fix: roomInfo e2e test
OtavioStasiak Nov 29, 2024
0c1fcd2
fix: create team e2e test
OtavioStasiak Nov 30, 2024
9d8e077
fix: room info e2e test should change room name
OtavioStasiak Nov 30, 2024
0e1e35a
fix: room info e2e test roomInfo should reset form
OtavioStasiak Nov 30, 2024
5e2c99f
fix: room info e2e test create team
OtavioStasiak Nov 30, 2024
421de10
fix: updated swipe on create team
OtavioStasiak Nov 30, 2024
54838a3
fix: updated sleep time on should delete team
OtavioStasiak Dec 2, 2024
971921e
fix: should reset form e2e test
OtavioStasiak Dec 2, 2024
c7d1ebe
fix: createTeam iOS e2etest
OtavioStasiak Dec 2, 2024
a823cb7
fix: roomInfo e2e test
OtavioStasiak Dec 3, 2024
486f705
fix: lint
OtavioStasiak Dec 3, 2024
ce2d7c2
fix: comments on roomInfo e2e test
OtavioStasiak Dec 3, 2024
0e1c10e
chore: updated a11y layout of deleteAccount
OtavioStasiak Dec 5, 2024
c83ce65
fix: a11y focus error on iOS
OtavioStasiak Dec 6, 2024
c011422
chore: updated a11y components and button color
OtavioStasiak Dec 6, 2024
96f2885
chore: updated input accessibility focus
OtavioStasiak Dec 6, 2024
a32c130
chore: improved alertText code
OtavioStasiak Dec 10, 2024
0a4a9ac
chore: updated text color
OtavioStasiak Dec 12, 2024
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -12,24 +12,25 @@ import { useActionSheet } from '../Provider';

const styles = StyleSheet.create({
subtitleText: {
fontSize: 14,
...sharedStyles.textRegular,
marginBottom: 10
fontSize: 16,
lineHeight: 24
},
buttonSeparator: {
marginRight: 8
marginRight: 12
},
footerButtonsContainer: {
flexDirection: 'row',
paddingTop: 16
},
titleContainerText: {
...sharedStyles.textBold,
fontSize: 16,
...sharedStyles.textSemibold
lineHeight: 24
},
titleContainer: {
paddingRight: 80,
marginBottom: 16,
marginBottom: 12,
flexDirection: 'row',
alignItems: 'center'
}
Expand All @@ -53,7 +54,6 @@ const FooterButtons = ({
styles.buttonSeparator,
{ flex: 1, backgroundColor: cancelBackgroundColor || colors.buttonBackgroundSecondaryDefault }
]}
color={colors.backdropColor}
title={cancelTitle}
onPress={cancelAction}
testID={`${testID}-cancel`}
Expand Down Expand Up @@ -120,7 +120,6 @@ const ActionSheetContentWithInputAndSubmit = ({
<FormTextInput
key={inputConfig.key}
value={inputValues[index]}
placeholder={inputConfig.placeholder}
onChangeText={value => handleInputChange(value, index)}
onSubmitEditing={() => {
if (index < inputs.length - 1) {
Expand All @@ -143,17 +142,18 @@ const ActionSheetContentWithInputAndSubmit = ({
return (
<FormTextInput
value={inputValues[0]}
placeholder={placeholder}
onChangeText={value => handleInputChange(value, 0)}
onSubmitEditing={() => {
setTimeout(() => {
hideActionSheet();
}, 100);
if (inputValues[0]) onSubmit(inputValues[0]);
}}
accessibilityLabel={placeholder}
testID={`${testID}-input`}
secureTextEntry={secureTextEntry}
bottomSheet={isIOS}
containerStyle={{ marginTop: 12, marginBottom: 36 }}
/>
);
};
Expand All @@ -164,9 +164,9 @@ const ActionSheetContentWithInputAndSubmit = ({
return (
<View style={sharedStyles.containerScrollView} testID='action-sheet-content-with-input-and-submit'>
<>
<View style={styles.titleContainer}>
<View accessible accessibilityLabel={title} style={styles.titleContainer}>
{iconName ? <CustomIcon name={iconName} size={32} color={iconColor || colors.buttonBackgroundDangerDefault} /> : null}
<Text style={[styles.titleContainerText, { color: colors.fontDefault, paddingLeft: iconName ? 16 : 0 }]}>{title}</Text>
<Text style={[styles.titleContainerText, { color: colors.fontDefault, paddingLeft: iconName ? 12 : 0 }]}>{title}</Text>
</View>
{description ? <Text style={[styles.subtitleText, { color: colors.fontTitlesLabels }]}>{description}</Text> : null}
{customText}
Expand Down
181 changes: 97 additions & 84 deletions app/containers/TextInput/FormTextInput.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ 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';
Expand Down Expand Up @@ -97,96 +98,108 @@ export const FormTextInput = ({
const [showPassword, setShowPassword] = useState(false);
const showClearInput = onClearInput && value && value.length > 0;
const Input = bottomSheet ? BottomSheetTextInput : TextInput;

return (
<View
accessible
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}
<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 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 ? (
<Touchable onPress={() => setShowPassword(!showPassword)} style={[styles.iconContainer, styles.iconRight]}>
<CustomIcon
name={showPassword ? 'unread-on-top' : 'unread-on-top-disabled'}
testID={testID ? `${testID}-icon-password` : undefined}
size={20}
color={colors.fontDefault}
/>
</Touchable>
) : 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}

{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>
{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>
);
};
2 changes: 2 additions & 0 deletions app/i18n/locales/ar.json
Original file line number Diff line number Diff line change
Expand Up @@ -172,6 +172,7 @@
"Get_help": "احصل على المساعدة",
"Glossary_of_simplified_terms": "مسرد المصطلحات المبسطة",
"Help": "مساعدة",
"Hide_Password": "إخفاء كلمة المرور",
"Hide_room": "إخفاء",
"Hide_System_Messages": "إخفاء رسائل النظام",
"Hide_type_messages": "إخفاء رسائل \"{{type}}\"",
Expand Down Expand Up @@ -406,6 +407,7 @@
"Share_Link": "مشاركة رابط",
"Share_this_app": "مشاركة هذا البرنامج",
"Show_more": "إظهار أكثر",
"Show_Password": "عرض كلمة المرور",
"Show_the_keyboard_shortcut_list": "عرض قائمة اختصارات لوحة المفاتيح",
"Sign_Up": "تسجيل جديد",
"Slash_Gimme_Description": "يعرض ༼ つ ◕_◕ ༽つ قبل رسالتك",
Expand Down
2 changes: 2 additions & 0 deletions app/i18n/locales/bn-IN.json
Original file line number Diff line number Diff line change
Expand Up @@ -286,6 +286,7 @@
"Group_by": "দ্বারা গ্রুপ করুন",
"Has_left_the_team": "দল ছেড়ে দিয়েছে",
"Help": "সাহায্য",
"Hide_Password": "পাসওয়ার্ড লুকান",
"Hide_System_Messages": "সিস্টেম বার্তা লুকান",
"Hide_type_messages": "\"{{type}}\" বার্তা লুকান",
"How_It_Works": "এটি কীভাবে কাজ করে",
Expand Down Expand Up @@ -622,6 +623,7 @@
"Show_badge_for_mentions": "উল্লেখের জন্য ব্যাজ দেখান",
"Show_badge_for_mentions_Info": "মুখ্য উল্লেখের জন্য শুধুমাত্র ব্যাজ প্রদর্শন করুন",
"Show_more": "আরও দেখুন..",
"Show_Password": "পাসওয়ার্ড দেখান",
"Sign_Up": "নিবন্ধন করুন",
"Skip": "অবগাহন",
"Sort_by": "দ্বারা সাজানো",
Expand Down
2 changes: 2 additions & 0 deletions app/i18n/locales/cs.json
Original file line number Diff line number Diff line change
Expand Up @@ -306,6 +306,7 @@
"Group_by": "Skupina vytvořená",
"Has_left_the_team": "opustil tým",
"Help": "Pomoc",
"Hide_Password": "Skrýt heslo",
"Hide_room": "Skrýt",
"Hide_System_Messages": "Skrýt systémové zprávy",
"Hide_type_messages": "Skrýt \"{{type}}\" zprávy",
Expand Down Expand Up @@ -673,6 +674,7 @@
"Show_badge_for_mentions_Info": "Zobrazit odznak pouze pro přímé zmínky",
"Show_less": "Ukaž méně",
"Show_more": "Zobrazit více",
"Show_Password": "Zobrazit heslo",
"Show_the_keyboard_shortcut_list": "Zobrazit seznam klávesových zkratek",
"Sign_Up": "Přihlásit se",
"Skip": "Přeskočit",
Expand Down
2 changes: 2 additions & 0 deletions app/i18n/locales/de.json
Original file line number Diff line number Diff line change
Expand Up @@ -279,6 +279,7 @@
"Group_by": "Gruppieren nach",
"Has_left_the_team": "Hat das Team verlassen",
"Help": "Hilfe",
"Hide_Password": "Passwort verbergen",
"Hide_room": "Raum verstecken",
"Hide_System_Messages": "Systemnachrichten ausblenden",
"Hide_type_messages": "\"{{type}}\"-Nachrichten ausblenden",
Expand Down Expand Up @@ -608,6 +609,7 @@
"Show_badge_for_mentions": "Zeige Abzeichen für Erwähnungen",
"Show_badge_for_mentions_Info": "Zeige Abzeichen nur für direkte Erwähnungen",
"Show_more": "Mehr anzeigen",
"Show_Password": "Passwort anzeigen",
"Show_the_keyboard_shortcut_list": "Liste der Tastenkombinationen anzeigen",
"Sign_Up": "Anmelden",
"Skip": "Überspringen",
Expand Down
2 changes: 2 additions & 0 deletions app/i18n/locales/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -323,6 +323,7 @@
"Group_by": "Group by",
"Has_left_the_team": "has left the team",
"Help": "Help",
"Hide_Password": "Hide Password",
"Hide_room": "Hide",
"Hide_System_Messages": "Hide system messages",
"Hide_type_messages": "Hide \"{{type}}\" messages",
Expand Down Expand Up @@ -694,6 +695,7 @@
"Show_badge_for_mentions_Info": "Display badge for direct mentions only",
"Show_less": "Show less",
"Show_more": "Show more",
"Show_Password": "Show Password",
"Show_the_keyboard_shortcut_list": "Show the keyboard shortcut list",
"Sign_Up": "Sign up",
"Skip": "Skip",
Expand Down
2 changes: 2 additions & 0 deletions app/i18n/locales/es.json
Original file line number Diff line number Diff line change
Expand Up @@ -118,6 +118,7 @@
"Get_link": "Obtener enlace",
"Glossary_of_simplified_terms": "Glosario de términos simplificados",
"Help": "Ayuda",
"Hide_Password": "Ocultar contraseña",
"Hide_room": "Ocultar",
"In_App_And_Desktop": "En la aplicación y en el escritorio",
"In_App_and_Desktop_Alert_info": "Muestra un banner en la parte superior de la pantalla cuando la aplicación esté abierta y muestra una notificación en el escritorio",
Expand Down Expand Up @@ -244,6 +245,7 @@
"Settings_succesfully_changed": "¡Configuración cambiada correctamente!",
"Share": "Compartir",
"Share_this_app": "Compartir esta aplicación",
"Show_Password": "Mostrar contraseña",
"Show_the_keyboard_shortcut_list": "Mostrar la lista de atajos de teclado",
"Sign_Up": "Registrarse",
"Slash_Gimme_Description": "Muestra (つ ◕_◕) つ antes de tu mensaje",
Expand Down
2 changes: 2 additions & 0 deletions app/i18n/locales/fi.json
Original file line number Diff line number Diff line change
Expand Up @@ -264,6 +264,7 @@
"Group_by": "Ryhmittelyperuste",
"Has_left_the_team": "on poistunut tiimistä",
"Help": "Apua",
"Hide_Password": "Piilota salasana",
"Hide_room": "Piilota",
"Hide_System_Messages": "Piilota järjestelmäilmoitukset",
"Hide_type_messages": "Piilota \"{{type}}\"-viestit",
Expand Down Expand Up @@ -583,6 +584,7 @@
"Show_badge_for_mentions": "Näytä mainintojen merkki",
"Show_badge_for_mentions_Info": "Näytä vain suorien mainintojen merkki",
"Show_more": "Näytä lisää",
"Show_Password": "Näytä salasana",
"Show_the_keyboard_shortcut_list": "Näytä pikanäppäinten luettelo",
"Sign_Up": "Rekisteröidy",
"Skip": "Ohita",
Expand Down
Loading
Loading