From 29a2697a541b07c6d69885c04232c604b0e89538 Mon Sep 17 00:00:00 2001 From: Koen van Meijeren Date: Fri, 8 Dec 2023 16:21:02 +0100 Subject: [PATCH] Feat/us 180 overall fixes (#157) * feat: :sparkles: Added a way to go back in the tutorial to a previous step, still needs styling * fix: :bug: fixed styling * chore: :construction: Fix translations * chore: :construction: Run eslint * chore: :construction: Update translations * chore: :construction: Fix E2E tests * chore: :construction: Run prettier --------- Co-authored-by: Rick Koekkoek --- cypress/e2e/firstTimeUser.cy.ts | 4 +- src/components/tutorial/Tutorial.tsx | 66 +++++++++++++++++++------- src/lib/constants/TutorialSteps.tsx | 11 ++++- src/lib/redux/slices/TutorialSlice.ts | 5 +- src/lib/translations/languages/de.json | 5 +- src/lib/translations/languages/nl.json | 13 +++-- 6 files changed, 77 insertions(+), 27 deletions(-) diff --git a/cypress/e2e/firstTimeUser.cy.ts b/cypress/e2e/firstTimeUser.cy.ts index 6fe716cc..c4aa476f 100644 --- a/cypress/e2e/firstTimeUser.cy.ts +++ b/cypress/e2e/firstTimeUser.cy.ts @@ -6,7 +6,7 @@ describe('First time user tests', () => { it('can display the welcome message and background input buttons', () => { cy.contains('Welkom bij Windesheim.AI!'); cy.get('[data-testid="userLogo"]').should('exist'); - cy.contains('Vertel me je achtergrond!'); + cy.contains('Vertel me uw achtergrond!'); cy.contains('We bieden u op maat gemaakte training.'); cy.contains('Oke').click(); }); @@ -24,7 +24,7 @@ describe('First time user tests', () => { it('can answer the background questions and progresses through it', () => { cy.contains('Oke').click(); cy.contains('Achtergrondinformatie verzamelen'); - cy.contains('Wat is je positie?'); + cy.contains('Wat is uw positie?'); cy.get('[data-testid="listButton"]').first().click(); cy.contains('In welk gebied van AI bent u geïnteresseerd?'); cy.get('[data-testid="listButton"]').first().click(); diff --git a/src/components/tutorial/Tutorial.tsx b/src/components/tutorial/Tutorial.tsx index c624860a..7b7b5080 100644 --- a/src/components/tutorial/Tutorial.tsx +++ b/src/components/tutorial/Tutorial.tsx @@ -8,8 +8,12 @@ import { import { useFonts } from '../../lib/constants/Fonts'; import { tutorialSteps } from '../../lib/constants/TutorialSteps'; import { HapticFeedback, HapticForces } from '../../lib/haptic/Hooks'; -import { useAppDispatch, useAppSelector } from '../../lib/redux/Hooks'; -import { nextStep, setCompleted } from '../../lib/redux/slices/TutorialSlice'; +import { useAppSelector, useAppDispatch } from '../../lib/redux/Hooks'; +import { + nextStep, + setCompleted, + previousStep, +} from '../../lib/redux/slices/TutorialSlice'; import { useNavigation } from '../../lib/utility/navigation/useNavigation'; import { TextTranslated } from '../general/text/TextTranslated'; @@ -51,6 +55,15 @@ export const Tutorial = () => { } }; + const handlePrevious = () => { + storeDispatcher(previousStep()); + const previousStepRoute = tutorialSteps[tutorialStep]?.PreviousPage; + HapticFeedback(HapticForces.Light); + if (previousStepRoute) { + navigation.navigate(previousStepRoute as never); + } + }; + const styles = StyleSheet.create({ container: { flex: 1, @@ -104,6 +117,9 @@ export const Tutorial = () => { nextButton: { backgroundColor: colors.primary, }, + previousButton: { + backgroundColor: colors.warning, + }, finishButton: { backgroundColor: colors.danger, }, @@ -136,20 +152,38 @@ export const Tutorial = () => { text={tutorialSteps[tutorialStep].Subtext} /> - { - HapticFeedback(HapticForces.Light); - setModalVisible(false); - storeDispatcher(setCompleted(true)); - }} - > - - + {tutorialStep === 0 ? ( + { + HapticFeedback(HapticForces.Light); + setModalVisible(false); + storeDispatcher(setCompleted(true)); + }} + > + + + ) : ( + { + handlePrevious(); + }} + > + + + )} {tutorialStep === tutorialSteps.length - 1 ? ( { + state.currentStep -= 1; + }, }, }); -export const { nextStep, setCompleted } = tutorialSlice.actions; +export const { nextStep, setCompleted, previousStep } = tutorialSlice.actions; export default tutorialSlice.reducer; diff --git a/src/lib/translations/languages/de.json b/src/lib/translations/languages/de.json index 1fd0e7ce..34cd446a 100644 --- a/src/lib/translations/languages/de.json +++ b/src/lib/translations/languages/de.json @@ -92,5 +92,8 @@ "Cloud Everywhere explores the pervasive use and impact of cloud computing in various domains.": "Cloud Everywhere erforscht den allgegenwärtigen Einsatz und die Auswirkungen von Cloud-Computing in verschiedenen Bereichen.", "Building Trust focuses on strategies and technologies for building trust in digital interactions.": "Building Trust konzentriert sich auf Strategien und Technologien zum Aufbau von Vertrauen in digitalen Interaktionen.", "Quantum Computing explores the revolutionary field of quantum information processing and computation.": "Quantum Computing erforscht das revolutionäre Gebiet der quantenbasierten Informationsverarbeitung und Berechnung.", - "Future of Programming delves into the evolving landscape of programming languages and paradigms.": "Future of Programming taucht in die sich entwickelnde Landschaft von Programmiersprachen und Paradigmen ein." + "Future of Programming delves into the evolving landscape of programming languages and paradigms.": "Future of Programming taucht in die sich entwickelnde Landschaft von Programmiersprachen und Paradigmen ein.", + "Previous": "Zurück", + "That was the tutorial! \n You can always follow this tutorial again in the settings. \n Hope you enjoy using the app!": "That was the tutorial! \n You can always follow this tutorial again in the settings. \n Hope you enjoy using the app!", + "On the home screen you can find the latest news relating to AI technology, as well as a quick link to the Windesheim Tech Radar.": "Auf dem Startbildschirm finden Sie die neuesten Nachrichten zur KI-Technologie sowie einen schnellen Link zum Windesheim TechRadar." } diff --git a/src/lib/translations/languages/nl.json b/src/lib/translations/languages/nl.json index f8bcc5b3..f23eb704 100644 --- a/src/lib/translations/languages/nl.json +++ b/src/lib/translations/languages/nl.json @@ -3,7 +3,7 @@ "Home": "Home", "Tech Providers": "Tech Providers", "Themes": "Thema's", - "Artificial intelligence is the key to innovating the future and transforming our lives": "Kunstmatige intelligentie is de sleutel tot innovatie toekomst en het transformeren van ons leven", + "Artificial intelligence is the key to innovating the future and transforming our lives": "Kunstmatige intelligentie is de sleutel tot innovatie van de toekomst en de transformatie van ons leven", "Settings": "Instellingen", "Language": "Taal", "Font": "Lettertype", @@ -24,7 +24,7 @@ "On this screen you can browse the Windesheim Tech Radar, which is a collection of the newest trends & innovations in the tech industry. You can also find the latest trends with the biggest tech providers.": "Op dit scherm kunt u de Windesheim Tech Radar doorbladeren, een verzameling van de nieuwste trends en innovaties in de technologiesector. U kunt ook de nieuwste trends vinden bij de grootste technologieproviders.", "Here is where you can practice, learn, and share your knowledge about Generative AI.": "Hier kunt u oefenen, leren en uw kennis delen over Generative AI.", "Here is where you can change the settings of the app. Like: Dark mode, Language, and more.": "Hier kunt u de instellingen van de app wijzigen. Zoals: donkere modus, taal en meer.", - "That was the tutorial! \n You can always find this tutorial again in the settings. \n Hope you enjoy using the app!": "Dat was de tutorial! \n U kunt deze tutorial altijd opnieuw vinden in de instellingen. \n Ik hoop dat je geniet van het gebruik van de app!", + "That was the tutorial! \n You can always find this tutorial again in the settings. \n Hope you enjoy using the app!": "Dat was de tutorial! \n U kunt deze tutorial altijd opnieuw vinden in de instellingen. \n Ik hoop dat u geniet van het gebruik van de app!", "Courses": "Cursussen", "Course not found!": "Cursus niet gevonden!", "Course step not found!": "Cursusstap niet gevonden!", @@ -45,13 +45,13 @@ "See all Tech Providers": "Bekijk alle Tech Providers", "Enable high contrast": "Activeer hoog contrast", "Welcome to Windesheim.AI!": "Welkom bij Windesheim.AI!", - "Tell me your background!": "Vertel me je achtergrond!", + "Tell me your background!": "Vertel me uw achtergrond!", "We provide you with customized training.": "We bieden u op maat gemaakte training.", "Okay": "Oke", "Background information Collect!": "Achtergrondinformatie verzamelen!", "Background information": "Achtergrondinformatie", "Background": "Achtergrond", - "What is your position?": "Wat is je positie?", + "What is your position?": "Wat is uw positie?", "What is your interested keyword?": "Wat is uw geïnteresseerde trefwoord?", "How familiar are you with AI?": "Hoe bekend bent u met AI?", "Student": "Student", @@ -93,5 +93,8 @@ "Cloud Everywhere explores the pervasive use and impact of cloud computing in various domains.": "Cloud Everywhere onderzoekt het alomtegenwoordige gebruik en de impact van cloud computing in verschillende domeinen.", "Building Trust focuses on strategies and technologies for building trust in digital interactions.": "Building Trust richt zich op strategieën en technologieën voor het opbouwen van vertrouwen in digitale interacties.", "Quantum Computing explores the revolutionary field of quantum information processing and computation.": "Quantum Computing onderzoekt het revolutionaire veld van quantum-informatieverwerking en -berekening.", - "Future of Programming delves into the evolving landscape of programming languages and paradigms.": "Future of Programming duikt in het veranderende landschap van programmeertalen en paradigma's." + "Future of Programming delves into the evolving landscape of programming languages and paradigms.": "Future of Programming duikt in het veranderende landschap van programmeertalen en paradigma's.", + "Previous": "Vorige", + "That was the tutorial! \n You can always follow this tutorial again in the settings. \n Hope you enjoy using the app!": "Dat was de tutorial! \n U kunt deze tutorial altijd opnieuw volgen in de instellingen. \n Ik hoop dat u geniet van het gebruik van de app!", + "On the home screen you can find the latest news relating to AI technology, as well as a quick link to the Windesheim Tech Radar.": "Op het startscherm vindt u het laatste nieuws met betrekking tot AI-technologie, evenals een snelle link naar de Windesheim Tech Radar." }