(PC-34024) feat(tutorial): add FAQ banner and link in ProfileTutorial… (

#7634) * (PC-34024) feat(tutorial): add FAQ banner and link in ProfileTutorialAgeInformationCreditV3 * (PC-34024) feat(tutorial): add mock analytics * (PC-34024) feat(tutorial): update wording in ProfileTutorialAgeInformationCreditV3 * (PC-34024) feat(tutorial): update wording and link * (PC-34024) feat(tutorial): update snapshot
pass-culture · Feb 5, 2025 · ae30df4 · ae30df4
1 parent d98226b
commit ae30df4
Show file tree

Hide file tree

Showing 15 changed files with 309 additions and 47 deletions.
diff --git a/.env.integration b/.env.integration
@@ -81,6 +81,7 @@ DMS_FOREIGN_CITIZEN_URL=https://www.demarches-simplifiees.fr/commencer/demande-p
 DMS_FRENCH_CITIZEN_URL=https://www.demarches-simplifiees.fr/commencer/demande-pass-culture-fr
 DOC_CGU_URL=https://docs.passculture.app/textes-normatifs/mentions-legales-et-conditions-generales-dutilisation-de-lapplication-pass-culture
 DOC_PERSONAL_DATA_URL=https://docs.passculture.app/textes-normatifs/charte-des-donnees-personnelles
+FAQ_LINK_CREDIT_V3=https://aide.passculture.app/hc/fr/articles/18228972352924
 FAQ_LINK_CREDIT=https://aide.passculture.app/hc/fr/articles/4411991904017--Jeune-15-17-ans-C-est-quoi-le-pass-Culture
 FAQ_LINK_DELETE_ACCOUNT=https://aide.passculture.app/hc/fr/articles/4411992014865--Jeunes-Comment-supprimer-mon-compte-
 FAQ_LINK_EDUCONNECT_URL=https://passculture.zendesk.com/hc/fr/articles/4411991896849--Jeune-15-17-ans-O%C3%B9-trouver-mes-identifiants-%C3%89duConnect

diff --git a/.env.perf b/.env.perf
@@ -81,6 +81,7 @@ DMS_FOREIGN_CITIZEN_URL=https://www.demarches-simplifiees.fr/commencer/test/147a
 DMS_FRENCH_CITIZEN_URL=https://www.demarches-simplifiees.fr/commencer/test/e1c52a6e-1d17-474f-98bf-dcef82f1f4fb
 DOC_CGU_URL=https://docs.passculture.app/textes-normatifs/mentions-legales-et-conditions-generales-dutilisation-de-lapplication-pass-culture
 DOC_PERSONAL_DATA_URL=https://docs.passculture.app/textes-normatifs/charte-des-donnees-personnelles
+FAQ_LINK_CREDIT_V3=https://aide.passculture.app/hc/fr/articles/18228972352924
 FAQ_LINK_CREDIT=https://aide.passculture.app/hc/fr/articles/4411991904017--Jeune-15-17-ans-C-est-quoi-le-pass-Culture
 FAQ_LINK_DELETE_ACCOUNT=https://aide.passculture.app/hc/fr/articles/4411992014865--Jeunes-Comment-supprimer-mon-compte-
 FAQ_LINK_EDUCONNECT_URL=https://passculture.zendesk.com/hc/fr/articles/4411991896849--Jeune-15-17-ans-O%C3%B9-trouver-mes-identifiants-%C3%89duConnect

diff --git a/.env.production b/.env.production
@@ -81,6 +81,7 @@ DMS_FOREIGN_CITIZEN_URL=https://www.demarches-simplifiees.fr/commencer/demande-p
 DMS_FRENCH_CITIZEN_URL=https://www.demarches-simplifiees.fr/commencer/demande-pass-culture-fr
 DOC_CGU_URL=https://docs.passculture.app/textes-normatifs/mentions-legales-et-conditions-generales-dutilisation-de-lapplication-pass-culture
 DOC_PERSONAL_DATA_URL=https://docs.passculture.app/textes-normatifs/charte-des-donnees-personnelles
+FAQ_LINK_CREDIT_V3=https://aide.passculture.app/hc/fr/articles/18228972352924
 FAQ_LINK_CREDIT=https://aide.passculture.app/hc/fr/articles/4411991904017--Jeune-15-17-ans-C-est-quoi-le-pass-Culture
 FAQ_LINK_DELETE_ACCOUNT=https://aide.passculture.app/hc/fr/articles/4411992014865--Jeunes-Comment-supprimer-mon-compte-
 FAQ_LINK_EDUCONNECT_URL=https://passculture.zendesk.com/hc/fr/articles/4411991896849--Jeune-15-17-ans-O%C3%B9-trouver-mes-identifiants-%C3%89duConnect

diff --git a/.env.staging b/.env.staging
@@ -81,6 +81,7 @@ DMS_FOREIGN_CITIZEN_URL=https://www.demarches-simplifiees.fr/commencer/test/fd9d
 DMS_FRENCH_CITIZEN_URL=https://www.demarches-simplifiees.fr/commencer/test/19687d61-6b50-4549-b159-3744227969d1
 DOC_CGU_URL=https://docs.passculture.app/textes-normatifs/mentions-legales-et-conditions-generales-dutilisation-de-lapplication-pass-culture
 DOC_PERSONAL_DATA_URL=https://docs.passculture.app/textes-normatifs/charte-des-donnees-personnelles
+FAQ_LINK_CREDIT_V3=https://aide.passculture.app/hc/fr/articles/18228972352924
 FAQ_LINK_CREDIT=https://aide.passculture.app/hc/fr/articles/4411991904017--Jeune-15-17-ans-C-est-quoi-le-pass-Culture
 FAQ_LINK_DELETE_ACCOUNT=https://aide.passculture.app/hc/fr/articles/4411992014865--Jeunes-Comment-supprimer-mon-compte-
 FAQ_LINK_EDUCONNECT_URL=https://passculture.zendesk.com/hc/fr/articles/4411991896849--Jeune-15-17-ans-O%C3%B9-trouver-mes-identifiants-%C3%89duConnect

diff --git a/.env.testing b/.env.testing
@@ -81,6 +81,7 @@ DMS_FOREIGN_CITIZEN_URL=https://www.demarches-simplifiees.fr/commencer/test/147a
 DMS_FRENCH_CITIZEN_URL=https://www.demarches-simplifiees.fr/commencer/test/e1c52a6e-1d17-474f-98bf-dcef82f1f4fb
 DOC_CGU_URL=https://docs.passculture.app/textes-normatifs/mentions-legales-et-conditions-generales-dutilisation-de-lapplication-pass-culture
 DOC_PERSONAL_DATA_URL=https://docs.passculture.app/textes-normatifs/charte-des-donnees-personnelles
+FAQ_LINK_CREDIT_V3=https://aide.passculture.app/hc/fr/articles/18228972352924
 FAQ_LINK_CREDIT=https://aide.passculture.app/hc/fr/articles/4411991904017--Jeune-15-17-ans-C-est-quoi-le-pass-Culture
 FAQ_LINK_DELETE_ACCOUNT=https://aide.passculture.app/hc/fr/articles/4411992014865--Jeunes-Comment-supprimer-mon-compte-
 FAQ_LINK_EDUCONNECT_URL=https://passculture.zendesk.com/hc/fr/articles/4411991896849--Jeune-15-17-ans-O%C3%B9-trouver-mes-identifiants-%C3%89duConnect

diff --git a/...l/pages/profileTutorial/ProfileTutorialAgeInformationCreditV3.native.test.tsx.native-snap b/...l/pages/profileTutorial/ProfileTutorialAgeInformationCreditV3.native.test.tsx.native-snap
@@ -431,6 +431,53 @@ exports[`<ProfileTutorialAgeInformationCreditV3 /> should render correctly 1`] =
                         ]
                       }
                     />
+                    <View
+                      style={
+                        [
+                          {
+                            "alignItems": "center",
+                            "flexDirection": "row",
+                            "flexShrink": 1,
+                          },
+                        ]
+                      }
+                    >
+                      <View
+                        style={
+                          [
+                            {
+                              "height": 16,
+                              "marginRight": 8,
+                              "width": 16,
+                            },
+                          ]
+                        }
+                      >
+                        <View
+                          height={16}
+                          width={16}
+                        >
+                          <Text>
+                            undefined-SVG-Mock
+                          </Text>
+                        </View>
+                      </View>
+                      <Text
+                        style={
+                          [
+                            {
+                              "color": "#161617",
+                              "flexShrink": 1,
+                              "fontFamily": "Montserrat-SemiBold",
+                              "fontSize": 12,
+                              "lineHeight": 19.2,
+                            },
+                          ]
+                        }
+                      >
+                        Tu as jusqu’à la veille de tes 18 ans pour confirmer ton identité et activer ton crédit.
+                      </Text>
+                    </View>
                   </View>
                 </View>
               </View>
@@ -843,7 +890,7 @@ exports[`<ProfileTutorialAgeInformationCreditV3 /> should render correctly 1`] =
                               ]
                             }
                           >
-                            Tu as 1 an pour confirmer ton identité et activer ce crédit.
+                            Tu as jusqu’à la veille de tes 19 ans pour confirmer ton identité et activer ton crédit.
                           </Text>
                         </View>
                         <View
@@ -911,7 +958,7 @@ exports[`<ProfileTutorialAgeInformationCreditV3 /> should render correctly 1`] =
                               ]
                             }
                           >
-                            Après activation, tu as jusqu’à la veille de tes 21 ans pour utiliser tout ton crédit.
+                            Une fois activé, ton crédit expirera la veille de ton 21ème anniversaire.
                           </Text>
                         </View>
                       </View>
@@ -1034,16 +1081,6 @@ exports[`<ProfileTutorialAgeInformationCreditV3 /> should render correctly 1`] =
                 ]
               }
             />
-            <View
-              numberOfSpaces={6}
-              style={
-                [
-                  {
-                    "height": 24,
-                  },
-                ]
-              }
-            />
             <Text
               numberOfLines={3}
               style={
@@ -1059,7 +1096,7 @@ exports[`<ProfileTutorialAgeInformationCreditV3 /> should render correctly 1`] =
                 ]
               }
             >
-              Découvre tout ce que la culture a à offrir, avec ou sans crédit !
+              Explore tout ce que la culture peut offrir, avec ou sans crédit !
             </Text>
             <View
               numberOfSpaces={1}
@@ -1100,6 +1137,184 @@ exports[`<ProfileTutorialAgeInformationCreditV3 /> should render correctly 1`] =
           </View>
         </View>
       </View>
+      <View
+        numberOfSpaces={4}
+        style={
+          [
+            {
+              "height": 16,
+            },
+          ]
+        }
+      />
+      <View
+        backgroundColor="#f3ecff"
+        style={
+          [
+            {
+              "alignItems": "center",
+              "backgroundColor": "#f3ecff",
+              "borderRadius": 8,
+              "flexDirection": "row",
+              "justifyContent": "space-between",
+              "paddingBottom": 16,
+              "paddingLeft": 16,
+              "paddingRight": 16,
+              "paddingTop": 16,
+            },
+          ]
+        }
+      >
+        <View
+          style={
+            [
+              {
+                "flexBasis": 0,
+                "flexGrow": 1,
+                "flexShrink": 1,
+              },
+            ]
+          }
+        >
+          <Text
+            style={
+              [
+                {
+                  "color": "#161617",
+                  "fontFamily": "Montserrat-SemiBold",
+                  "fontSize": 12,
+                  "lineHeight": 19.2,
+                },
+              ]
+            }
+            textColor="#161617"
+          >
+            Des questions sur ton crédit ?
+Les récents ajustements du dispositif peuvent en être la raison.
+          </Text>
+          <View
+            numberOfSpaces={2}
+            style={
+              [
+                {
+                  "height": 8,
+                },
+              ]
+            }
+          />
+          <View
+            accessibilityLabel="Plus d’infos dans notre FAQ"
+            accessibilityState={
+              {
+                "busy": undefined,
+                "checked": undefined,
+                "disabled": undefined,
+                "expanded": undefined,
+                "selected": undefined,
+              }
+            }
+            accessibilityValue={
+              {
+                "max": undefined,
+                "min": undefined,
+                "now": undefined,
+                "text": undefined,
+              }
+            }
+            accessible={true}
+            collapsable={false}
+            focusable={true}
+            onClick={[Function]}
+            onResponderGrant={[Function]}
+            onResponderMove={[Function]}
+            onResponderRelease={[Function]}
+            onResponderTerminate={[Function]}
+            onResponderTerminationRequest={[Function]}
+            onStartShouldSetResponder={[Function]}
+            style={
+              {
+                "alignItems": "center",
+                "backgroundColor": "transparent",
+                "borderRadius": 0,
+                "borderWidth": 0,
+                "flexDirection": "row",
+                "justifyContent": "flex-start",
+                "marginTop": 0,
+                "maxWidth": 500,
+                "minHeight": 20,
+                "opacity": 1,
+                "paddingBottom": 0,
+                "paddingLeft": 0,
+                "paddingRight": 0,
+                "paddingTop": 0,
+                "userSelect": "auto",
+                "width": "auto",
+              }
+            }
+            testID="Plus d’infos dans notre FAQ"
+          >
+            <View
+              style={
+                [
+                  {
+                    "alignItems": "center",
+                    "flexDirection": "row",
+                  },
+                ]
+              }
+            >
+              <View
+                style={
+                  [
+                    {
+                      "flexDirection": "row",
+                      "flexShrink": 0,
+                    },
+                  ]
+                }
+              >
+                <View
+                  accessibilityLabel="Nouvelle fenêtre"
+                  height={16}
+                  testID="button-icon-left"
+                  width={16}
+                >
+                  <Text>
+                    button-icon-left-SVG-Mock
+                  </Text>
+                </View>
+                <View
+                  numberOfSpaces={2}
+                  style={
+                    [
+                      {
+                        "width": 8,
+                      },
+                    ]
+                  }
+                />
+              </View>
+              <Text
+                adjustsFontSizeToFit={false}
+                numberOfLines={1}
+                style={
+                  [
+                    {
+                      "color": "#320096",
+                      "fontFamily": "Montserrat-SemiBold",
+                      "fontSize": 12,
+                      "lineHeight": 19.2,
+                      "maxWidth": "100%",
+                    },
+                  ]
+                }
+              >
+                Plus d’infos dans notre FAQ
+              </Text>
+            </View>
+          </View>
+        </View>
+      </View>
       <View
         numberOfSpaces={12}
         style={

diff --git a/...ures/tutorial/pages/profileTutorial/ProfileTutorialAgeInformationCreditV3.native.test.tsx b/...ures/tutorial/pages/profileTutorial/ProfileTutorialAgeInformationCreditV3.native.test.tsx
@@ -1,13 +1,16 @@
 import React from 'react'
 
 import { ProfileTutorialAgeInformationCreditV3 } from 'features/tutorial/pages/profileTutorial/ProfileTutorialAgeInformationCreditV3'
+import { analytics } from 'libs/analytics/provider'
 import { setFeatureFlags } from 'libs/firebase/firestore/featureFlags/__tests__/setFeatureFlags'
 import { RemoteStoreFeatureFlags } from 'libs/firebase/firestore/types'
-import { render, screen } from 'tests/utils'
+import { render, screen, userEvent } from 'tests/utils'
 
 jest.unmock('react-native/Libraries/Animated/createAnimatedComponent')
 jest.mock('libs/firebase/analytics/analytics')
 
+jest.useFakeTimers()
+
 describe('<ProfileTutorialAgeInformationCreditV3 />', () => {
   beforeEach(() => {
     setFeatureFlags([RemoteStoreFeatureFlags.ENABLE_PACIFIC_FRANC_CURRENCY])
@@ -18,4 +21,13 @@ describe('<ProfileTutorialAgeInformationCreditV3 />', () => {
 
     expect(screen).toMatchSnapshot()
   })
+
+  it("should log to analytics when pressing 'Plus d’infos dans notre FAQ'", async () => {
+    render(<ProfileTutorialAgeInformationCreditV3 />)
+
+    const link = screen.getByText('Plus d’infos dans notre FAQ')
+    await userEvent.press(link)
+
+    expect(analytics.logHasClickedFAQCreditV3).toHaveBeenCalledWith({ from: 'Tutorial' })
+  })
 })