Skip to content

Commit

Permalink
Création de la Stack Plus
Browse files Browse the repository at this point in the history
Signed-off-by: Claude Arseneault <[email protected]>
  • Loading branch information
ClaudeArs committed Oct 2, 2024
1 parent 8b12728 commit 59b5745
Show file tree
Hide file tree
Showing 9 changed files with 215 additions and 4 deletions.
10 changes: 10 additions & 0 deletions app/src/assets/img/calendar-empty.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
4 changes: 4 additions & 0 deletions app/src/assets/img/clock.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions app/src/assets/img/telephone.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
10 changes: 6 additions & 4 deletions app/src/components/HomeFooter.tsx
Original file line number Diff line number Diff line change
@@ -1,14 +1,16 @@
import { Screens, Stacks, TOKENS, useServices, useTheme } from '@hyperledger/aries-bifold-core'
import { HistoryStackParams } from '@hyperledger/aries-bifold-core/App/types/navigators'
import { TOKENS, useServices, useTheme } from '@hyperledger/aries-bifold-core'
import { Stacks } from '@hyperledger/aries-bifold-core/App/types/navigators'
import { useNavigation } from '@react-navigation/native'
import { StackNavigationProp } from '@react-navigation/stack'
import { useTranslation } from 'react-i18next'
import { StyleSheet, Text, TouchableOpacity, View } from 'react-native'

import { PlusStackParams, Screens } from '../navigators/navigators'

const HomeFooter = () => {
const { t } = useTranslation()
const { ColorPallet } = useTheme()
const { navigate } = useNavigation<StackNavigationProp<HistoryStackParams>>()
const { navigate } = useNavigation<StackNavigationProp<PlusStackParams>>()
const [{ useNotifications }] = useServices([TOKENS.NOTIFICATIONS])
const notifications = useNotifications()

Expand All @@ -35,7 +37,7 @@ const HomeFooter = () => {
{notifications?.length > 0 && (
<TouchableOpacity
style={styles.footerLinkContainer}
onPress={() => navigate(Stacks.HistoryStack as never, { screen: Screens.HistoryPage } as never)}
onPress={() => navigate(Stacks.OptionsPlus as never, { screen: Screens.OptionsPlus } as never)}
>
<Text style={styles.footerLink}>{t('Home.SeeAll')}</Text>
</TouchableOpacity>
Expand Down
14 changes: 14 additions & 0 deletions app/src/localization/en/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -167,6 +167,20 @@ const translation = {
ButtonTitle: 'Receive my attestation',
ButtonHome: 'Return to home page',
},
OptionsPlus: {
PageTitle: 'More options',
ButtonParamsApp: 'Application Settings',
ButtonHelpCenter: 'Help Center',
ButtonAbout: 'About',
TitleSupport: 'Soutien à la clientèle',
DetailSupport: "Vous avez un problème avec l'application ou des questions, vous pouvez joundre l'équipe.",
JoinUsTitle: 'Nous Joindre',
DaysOpen: 'Du lundi au vendredi',
OpeningHours: 'De 8h à 18h',
PhoneNumber: '1 877 644-4545',
TollFreeNumber: '1 800 361-9596 (numéro ATS pour malentendants)',
Copyright: '@ Gouvernement du Québec',
},
Screens: {
Splash: 'Splash',
Onboarding: 'Introduction',
Expand Down
14 changes: 14 additions & 0 deletions app/src/localization/fr/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -238,6 +238,20 @@ const translation = {
ButtonTitle: 'Recevoir mon attestation',
ButtonHome: 'Revenir à l’accueil',
},
OptionsPlus: {
PageTitle: "Plus d'option",
ButtonParamsApp: "Paramètres de l'application",
ButtonHelpCenter: "Centre d'aide",
ButtonAbout: 'À propos',
TitleSupport: 'Soutien à la clientèle',
DetailSupport: "Vous avez un problème avec l'application ou des questions, vous pouvez joundre l'équipe.",
JoinUsTitle: 'Nous Joindre',
DaysOpen: 'Du lundi au vendredi',
OpeningHours: 'De 8h à 18h',
PhoneNumber: '1 877 644-4545',
TollFreeNumber: ' 1 800 361-9596 (numéro ATS pour malentendants)',
Copyright: '@ Gouvernement du Québec',
},
StatusMessages: {
InitAgent: "Initialisation de l'agent ...",
},
Expand Down
25 changes: 25 additions & 0 deletions app/src/navigators/PlusStack.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
import { useTheme } from '@hyperledger/aries-bifold-core'
import { useDefaultStackOptions } from '@hyperledger/aries-bifold-core/App/navigators/defaultStackOptions'
import { createStackNavigator } from '@react-navigation/stack'
import React from 'react'

import Plus from '../screens/Plus'

import { Screens, PlusStackParams } from './navigators'

const PlusStack: React.FC = () => {
const StackPlus = createStackNavigator<PlusStackParams>()
const theme = useTheme()
const defaultStackOptions = useDefaultStackOptions(theme)

return (
<StackPlus.Navigator
initialRouteName={Screens.OptionsPlus}
screenOptions={{ ...defaultStackOptions, headerShown: false }}
>
<StackPlus.Screen name={Screens.OptionsPlus} component={Plus} />
</StackPlus.Navigator>
)
}

export default PlusStack
5 changes: 5 additions & 0 deletions app/src/navigators/navigators.ts
Original file line number Diff line number Diff line change
@@ -1,9 +1,14 @@
export enum Screens {
TermsAndConditions = 'TermsAndConditions',
Legal = 'Legal',
OptionsPlus = 'OptionsPlus',
}

export type TermsStackParams = {
[Screens.TermsAndConditions]: undefined
[Screens.Legal]: undefined
}

export type PlusStackParams = {
[Screens.OptionsPlus]: undefined
}
134 changes: 134 additions & 0 deletions app/src/screens/Plus.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,134 @@
import { useTheme, Button, ButtonType, testIdWithKey, Screens, TabStacks } from '@hyperledger/aries-bifold-core'
import { HomeStackParams } from '@hyperledger/aries-bifold-core/App/types/navigators'
import { useNavigation } from '@react-navigation/native'
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 CalendarImg from '../assets/img/calendar-empty.svg'
import ClockImg from '../assets/img/clock.svg'
import PhoneImg from '../assets/img/telephone.svg'

const Plus: React.FC = () => {
const { ColorPallet, TextTheme } = useTheme()
const { t } = useTranslation()
const { navigate } = useNavigation<StackNavigationProp<HomeStackParams>>()

const styles = StyleSheet.create({
container: {
height: '77%',
padding: 20,
marginBottom: 20,
backgroundColor: ColorPallet.brand.primaryBackground,
},
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,
},
sectionJoin: {
paddingVertical: 12,
},
sectionRow: {
flexDirection: 'row',
alignItems: 'center', // Aligne les éléments verticalement
height: 40, // Hauteur du conteneur (si nécessaire)
},
sectionDoubleRow: {
paddingTop: 10,
flexDirection: 'row',
alignItems: 'flex-start', // Aligne l'image et le texte en haut

height: 100, // Hauteur du conteneur (si nécessaire)
},
phoneImage: {
width: 24, // Ajustez la largeur de l'image
height: 24, // Ajustez la hauteur de l'image
// marginRight: 10, // Espace entre l'image et le texte
},
sectionDescription: {
...TextTheme.normal,
color: TextTheme.normal.color,
textAlign: 'left',
textDecorationLine: 'none',
marginLeft: 10,
},
})

return (
<SafeAreaView edges={['left', 'right', 'bottom']}>
<ScrollView style={styles.container}>
<View style={styles.button}>
<Button
buttonType={ButtonType.Secondary}
testID={testIdWithKey('AppParams')}
accessibilityLabel={t('OptionsPlus.ButtonParamsApp')}
title={t('OptionsPlus.ButtonParamsApp')}
onPress={() => navigate(TabStacks.HomeStack as never, { screen: Screens.Home } as never)}
></Button>
</View>
<View style={styles.button}>
<Button
buttonType={ButtonType.Secondary}
testID={testIdWithKey('HelpCenter')}
accessibilityLabel={t('OptionsPlus.ButtonHelpCenter')}
title={t('ptionsPlus.ButtonHelpCenter')}
onPress={() => navigate(TabStacks.HomeStack as never, { screen: Screens.Home } as never)}
></Button>
</View>
<View style={styles.button}>
<Button
buttonType={ButtonType.Secondary}
testID={testIdWithKey('StartProcess')}
accessibilityLabel={t('OptionsPlus.ButtonAbout')}
title={t('ptionsPlus.ButtonAbout')}
onPress={() => navigate(TabStacks.HomeStack as never, { screen: Screens.Home } as never)}
></Button>
</View>
<View style={styles.sectionJoin}>
<Text style={styles.textHeaderTitle}> {t('OptionsPlus.TitleSupport')}</Text>
<Text style={styles.sectionDescription}> {t('OptionsPlus.DetailSupport')}</Text>
</View>
<View style={styles.sectionJoin}>
<Text style={styles.textSectionTitle}> {t('OptionsPlus.JoinUsTitle')}</Text>
</View>
<View style={styles.sectionRow}>
<CalendarImg />
<Text style={styles.sectionDescription}> {t('OptionsPlus.DaysOpen')}</Text>
</View>
<View style={styles.sectionRow}>
<ClockImg />
<Text style={styles.sectionDescription}> {t('OptionsPlus.OpeningHours')}</Text>
</View>
<View style={styles.sectionDoubleRow}>
<PhoneImg style={styles.phoneImage} />
<Text style={styles.sectionDescription}>
{' '}
{t('OptionsPlus.PhoneNumber')}
{'\n'}
{t('OptionsPlus.TollFreeNumber')}
</Text>
</View>
</ScrollView>
</SafeAreaView>
)
}

export default Plus

0 comments on commit 59b5745

Please sign in to comment.