From 4b6a91fa74a7d3b412d37d26d32f8ae38e4789d7 Mon Sep 17 00:00:00 2001 From: jcdrouin21 Date: Wed, 15 Jan 2025 15:30:30 -0500 Subject: [PATCH] feat: changement de la navigation pour la sections plus (#205) Signed-off-by: Jean-Christophe Drouin --- app/ios/Podfile.lock | 2 +- app/src/components/ContactUs.tsx | 31 ++-- app/src/components/Help/HelpListSlider.tsx | 4 +- app/src/localization/en/index.ts | 2 +- app/src/localization/fr/index.ts | 2 +- app/src/navigators/PlusStack.tsx | 34 +---- app/src/navigators/RootStack.tsx | 13 +- app/src/navigators/SettingStack.tsx | 15 -- app/src/navigators/navigators.ts | 10 +- app/src/screens/HistoryPage.tsx | 94 ------------ app/src/screens/Plus.tsx | 163 ++++++++------------- app/src/screens/Settings.tsx | 14 -- 12 files changed, 87 insertions(+), 297 deletions(-) delete mode 100644 app/src/screens/HistoryPage.tsx diff --git a/app/ios/Podfile.lock b/app/ios/Podfile.lock index a7a04344e..00e2d2092 100644 --- a/app/ios/Podfile.lock +++ b/app/ios/Podfile.lock @@ -757,7 +757,7 @@ SPEC CHECKSUMS: anoncreds: 045f191123bb20d7dcdc2f7c19df57ae30c427f6 aries-askar: 3a78d5cfc8faedbfc55a9ff35e2309fc4574a147 BEMCheckBox: 5ba6e37ade3d3657b36caecc35c8b75c6c2b1a4e - boost: 7dcd2de282d72e344012f7d6564d024930a6a440 + boost: 57d2868c099736d80fcd648bf211b4431e51a558 CatCrypto: a477899b6be4954e75be4897e732da098cc0a5a8 CocoaAsyncSocket: 065fd1e645c7abab64f7a6a2007a48038fdc6a99 DoubleConversion: 5189b271737e1565bdce30deb4a08d647e3f5f54 diff --git a/app/src/components/ContactUs.tsx b/app/src/components/ContactUs.tsx index 5072e626a..fb1ae502c 100644 --- a/app/src/components/ContactUs.tsx +++ b/app/src/components/ContactUs.tsx @@ -1,45 +1,36 @@ import { useTheme } from '@hyperledger/aries-bifold-core' import { useTranslation } from 'react-i18next' import { StyleSheet, Text, View } from 'react-native' -import { SafeAreaView } from 'react-native-safe-area-context' import CalendarImg from '../assets/img/calendar-empty.svg' import ClockImg from '../assets/img/clock.svg' import PhoneImg from '../assets/img/telephone.svg' const ContactUs: React.FC = () => { - const { ColorPallet, TextTheme } = useTheme() + const { TextTheme } = useTheme() const { t } = useTranslation() const styles = StyleSheet.create({ - container: { - flex: 1, - backgroundColor: ColorPallet.brand.primaryBackground, - }, - textHeaderTitle: { ...TextTheme.headingThree, - flexShrink: 1, color: TextTheme.headingThree.color, - paddingTop: 8, - paddingBottom: 8, + paddingVertical: 8, }, textSectionTitle: { ...TextTheme.title, flexShrink: 1, color: TextTheme.bold.color, - paddingTop: 8, - paddingBottom: 8, }, section: { paddingVertical: 12, }, sectionRow: { + paddingVertical: 8, flexDirection: 'row', + alignContent: 'center', alignItems: 'center', }, sectionDoubleRow: { - paddingTop: 10, flexDirection: 'row', alignItems: 'flex-start', height: 100, @@ -53,24 +44,24 @@ const ContactUs: React.FC = () => { color: TextTheme.normal.color, textAlign: 'left', textDecorationLine: 'none', - marginLeft: 10, + paddingLeft: 10, }, }) return ( - + - {t('OptionsPlus.JoinUsTitle')} + {t('OptionsPlus.JoinUsTitle')} - {t('OptionsPlus.DaysOpen')} + {t('OptionsPlus.DaysOpen')} - {t('OptionsPlus.OpeningHours')} + {t('OptionsPlus.OpeningHours')} - + {t('OptionsPlus.PhoneNumber')} @@ -78,7 +69,7 @@ const ContactUs: React.FC = () => { {t('OptionsPlus.TollFreeNumber')} - + ) } diff --git a/app/src/components/Help/HelpListSlider.tsx b/app/src/components/Help/HelpListSlider.tsx index 5cb78a63a..75f074a70 100644 --- a/app/src/components/Help/HelpListSlider.tsx +++ b/app/src/components/Help/HelpListSlider.tsx @@ -77,7 +77,7 @@ const HelpListSlider: React.FC = () => { flexDirection: 'row', justifyContent: 'flex-start', alignItems: 'flex-start', - marginVertical: 12, + paddingVertical: 12, flexWrap: 'wrap', }, drawerRowItem: { @@ -160,7 +160,7 @@ const HelpListSlider: React.FC = () => { accessibilityRole="button" onPress={() => { deactivateSlider() - navigation.navigate(Stacks.HelpCenterStack as never, { screen: Screens.HelpCenter } as never) + navigation.navigate(Stacks.HelpCenterStack, { screen: Screens.HelpCenter }) }} > diff --git a/app/src/localization/en/index.ts b/app/src/localization/en/index.ts index fc08f7a5f..1282d6caa 100644 --- a/app/src/localization/en/index.ts +++ b/app/src/localization/en/index.ts @@ -196,7 +196,7 @@ const translation = { OpeningHours: 'From 8 a.m. to 6 p.m.', PhoneNumber: '1 877 644-4545', TollFreeNumber: '1 800 361-9596 (ATS number for the hearing impaired)', - Copyright: '@ Government of Quebec', + Copyright: '© Government of Quebec', }, Screens: { Splash: 'Splash', diff --git a/app/src/localization/fr/index.ts b/app/src/localization/fr/index.ts index 1aecc6df9..cf225e799 100644 --- a/app/src/localization/fr/index.ts +++ b/app/src/localization/fr/index.ts @@ -266,7 +266,7 @@ const translation = { OpeningHours: 'De 8h à 18h', PhoneNumber: '1 877 644-4545', TollFreeNumber: '1 800 361-9596 (numéro ATS pour malentendants)', - Copyright: '@ Gouvernement du Québec', + Copyright: '© Gouvernement du Québec', }, StatusMessages: { InitAgent: "Initialisation de l'agent ...", diff --git a/app/src/navigators/PlusStack.tsx b/app/src/navigators/PlusStack.tsx index 26d4ca850..ee1132b09 100644 --- a/app/src/navigators/PlusStack.tsx +++ b/app/src/navigators/PlusStack.tsx @@ -1,16 +1,12 @@ import { useTheme } from '@hyperledger/aries-bifold-core' import { useDefaultStackOptions } from '@hyperledger/aries-bifold-core/App/navigators/defaultStackOptions' -import ListContacts from '@hyperledger/aries-bifold-core/App/screens/ListContacts' import { createStackNavigator } from '@react-navigation/stack' import React from 'react' import { useTranslation } from 'react-i18next' import Plus from '../screens/Plus' -import AboutStack from './AboutStack' -import HelpCenterStack from './HelpCenterStack' -import SettingStack from './SettingStack' -import { Screens, OptionsPlusStackParams, Stacks } from './navigators' +import { Screens, OptionsPlusStackParams } from './navigators' const PlusStack: React.FC = () => { const StackPlus = createStackNavigator() @@ -27,34 +23,6 @@ const PlusStack: React.FC = () => { title: t('Screens.OptionsPlus'), }} /> - - - - ) } diff --git a/app/src/navigators/RootStack.tsx b/app/src/navigators/RootStack.tsx index c128742e4..3051a9782 100644 --- a/app/src/navigators/RootStack.tsx +++ b/app/src/navigators/RootStack.tsx @@ -29,9 +29,9 @@ import React, { useEffect } from 'react' import { useTranslation } from 'react-i18next' import { DeviceEventEmitter } from 'react-native' -import SettingStack from '../navigators/SettingStack' - +import AboutStack from './AboutStack' import HelpCenterStack from './HelpCenterStack' +import SettingStack from './SettingStack' import TabStack from './TabStack' import { RootStackParams, Stacks } from './navigators' @@ -106,13 +106,6 @@ const RootStack: React.FC = () => { })} /> - { cardStyleInterpolator: forFade, }} /> + + ) } diff --git a/app/src/navigators/SettingStack.tsx b/app/src/navigators/SettingStack.tsx index 96cbb5128..d3c257c87 100644 --- a/app/src/navigators/SettingStack.tsx +++ b/app/src/navigators/SettingStack.tsx @@ -7,7 +7,6 @@ import React from 'react' import { useTranslation } from 'react-i18next' import HelpCenterButton from '../components/Help/HelpCenterButton' -import HistoryPage from '../screens/HistoryPage' import Settings from '../screens/Settings' import { Screens, SettingStackParams } from './navigators' @@ -36,20 +35,6 @@ const SettingsStack: React.FC = () => { ...ScreenOptionsDictionary[Screens.Language], }} /> - - [BifoldScreens.Chat]: { connectionId: string } [BifoldStacks.ConnectionStack]: NavigatorScreenParams - [BifoldStacks.SettingStack]: NavigatorScreenParams [BifoldStacks.ConnectStack]: NavigatorScreenParams [BifoldStacks.ContactStack]: NavigatorScreenParams [BifoldStacks.ProofRequestsStack]: NavigatorScreenParams [BifoldStacks.NotificationStack]: NavigatorScreenParams [BifoldStacks.HistoryStack]: NavigatorScreenParams + [Stacks.SettingsStack]: NavigatorScreenParams [Stacks.HelpCenterStack]: NavigatorScreenParams + [Stacks.AboutStack]: NavigatorScreenParams } export type TabStackParams = { @@ -75,8 +76,6 @@ export type TermsStackParams = { export type SettingStackParams = { [Screens.Settings]: undefined [Screens.Language]: undefined - [Screens.HistoryPage]: undefined - [Screens.Notification]: undefined [Screens.CreatePIN]: { updatePIN?: boolean } [Screens.UseBiometry]: undefined } @@ -104,11 +103,6 @@ export type AboutStackParams = { export type ActivitiesStackParams = { [Screens.Activities]: undefined } - export type OptionsPlusStackParams = { [Screens.OptionsPlus]: undefined - [Screens.Contacts]: undefined - [Stacks.SettingsStack]: NavigatorScreenParams - [Stacks.HelpCenterStack]: NavigatorScreenParams - [Stacks.AboutStack]: NavigatorScreenParams } diff --git a/app/src/screens/HistoryPage.tsx b/app/src/screens/HistoryPage.tsx deleted file mode 100644 index 7825cf532..000000000 --- a/app/src/screens/HistoryPage.tsx +++ /dev/null @@ -1,94 +0,0 @@ -import { useTheme } from '@hyperledger/aries-bifold-core' -import { useTranslation } from 'react-i18next' -import { ScrollView, StyleSheet, Text, View } from 'react-native' -import { SafeAreaView } from 'react-native-safe-area-context' - -const HistoryPage: React.FC = () => { - const { ColorPallet, TextTheme } = useTheme() - const { t } = useTranslation() - - const styles = StyleSheet.create({ - container: { - flex: 1, - padding: 20, - marginBottom: 20, - backgroundColor: ColorPallet.brand.primaryBackground, - }, - innerContainer: { - flex: 1, - }, - mainSection: { - flex: 5, - }, - textHeaderTitle: { - ...TextTheme.headingThree, - flexShrink: 1, - color: TextTheme.headingThree.color, - paddingTop: 8, - paddingBottom: 8, - }, - textSectionTitle: { - ...TextTheme.title, - flexShrink: 1, - color: TextTheme.bold.color, - paddingTop: 8, - paddingBottom: 8, - }, - button: { - marginTop: 10, - marginBottom: 10, - }, - section: { - paddingVertical: 12, - }, - scroll: { - flexGrow: 1, - }, - sectionRow: { - flexDirection: 'row', - alignItems: 'center', - }, - sectionDoubleRow: { - paddingTop: 10, - flexDirection: 'row', - alignItems: 'flex-start', - height: 100, - }, - sectionCopyright: { - flex: 1, - justifyContent: 'flex-end', - ...TextTheme.headingOne, - margin: 10, - }, - phoneImage: { - width: 24, - height: 24, - }, - sectionDescription: { - ...TextTheme.normal, - color: TextTheme.normal.color, - textAlign: 'left', - textDecorationLine: 'none', - marginLeft: 10, - }, - sectionCopyrightText: { - ...TextTheme.caption, - color: TextTheme.normal.color, - textAlign: 'left', - textDecorationLine: 'none', - marginLeft: 10, - }, - }) - - return ( - - - - {t('Settings.History')} - - - - ) -} - -export default HistoryPage diff --git a/app/src/screens/Plus.tsx b/app/src/screens/Plus.tsx index 727e66351..93f61100b 100644 --- a/app/src/screens/Plus.tsx +++ b/app/src/screens/Plus.tsx @@ -1,144 +1,109 @@ -import { useTheme, Button, ButtonType, testIdWithKey } from '@hyperledger/aries-bifold-core' +import { + useTheme, + Button, + ButtonType, + testIdWithKey, + Stacks as BifoldStacks, + Screens as BifoldScreens, +} from '@hyperledger/aries-bifold-core' import { useNavigation } from '@react-navigation/native' -import { StackNavigationProp, StackScreenProps } from '@react-navigation/stack' +import { StackNavigationProp } from '@react-navigation/stack' import { useTranslation } from 'react-i18next' import { ScrollView, StyleSheet, Text, View } from 'react-native' import { SafeAreaView } from 'react-native-safe-area-context' import ContactUs from '../components/ContactUs' -import { SettingStackParams, OptionsPlusStackParams, Stacks, Screens } from '../navigators/navigators' -type OptionsPlusProps = StackScreenProps +import { RootStackParams, Screens, Stacks } from '../navigators/navigators' -const Plus: React.FC = ({ navigation }) => { - const { ColorPallet, TextTheme } = useTheme() +const Plus = () => { + const { TextTheme } = useTheme() const { t } = useTranslation() - const { navigate } = useNavigation>() + const navigation = useNavigation>() const styles = StyleSheet.create({ container: { - flex: 1, - backgroundColor: ColorPallet.brand.primaryBackground, + paddingHorizontal: 16, }, innerContainer: { - flex: 1, - }, - mainSection: { - flex: 5, + marginVertical: 24, }, textHeaderTitle: { ...TextTheme.headingThree, - flexShrink: 1, color: TextTheme.headingThree.color, - paddingTop: 8, - paddingBottom: 8, - }, - textSectionTitle: { - ...TextTheme.title, - flexShrink: 1, - color: TextTheme.bold.color, - paddingTop: 8, - paddingBottom: 8, + marginVertical: 8, }, button: { - marginTop: 10, - marginBottom: 10, + paddingBottom: 24, }, section: { - paddingVertical: 12, - }, - scroll: { - flexGrow: 1, - paddingHorizontal: 16, - paddingVertical: 24, - }, - sectionRow: { - flexDirection: 'row', - alignItems: 'center', - }, - sectionDoubleRow: { - paddingTop: 10, - flexDirection: 'row', - alignItems: 'flex-start', - height: 100, + paddingBottom: 16, }, sectionCopyright: { flex: 1, - justifyContent: 'flex-end', ...TextTheme.headingOne, - margin: 10, - }, - phoneImage: { - width: 24, - height: 24, + marginVertical: 10, }, sectionDescription: { ...TextTheme.normal, color: TextTheme.normal.color, textAlign: 'left', - textDecorationLine: 'none', - marginLeft: 10, }, sectionCopyrightText: { ...TextTheme.caption, color: TextTheme.normal.color, textAlign: 'left', - textDecorationLine: 'none', - marginLeft: 10, }, }) return ( - - + + - - -