diff --git a/frontend/docs/changelog/changelog-en.md b/frontend/docs/changelog/changelog-en.md index df187597..02001370 100644 --- a/frontend/docs/changelog/changelog-en.md +++ b/frontend/docs/changelog/changelog-en.md @@ -13,8 +13,8 @@ SPDX-License-Identifier: CC-BY-4.0 - The data for cologne is now displayed on a city district level - Onboarding System for ESID. It consists of: - - Welcome modal, which displays an overview of ESID through slides and illustrations on the user's first visit - - Onboarding tours, built using the React Joyride library, which can be accessed via clicking on the different tour chips in the information button in the top bar or from the last slide of the welcome modal + - Welcome dialog, which displays an overview of ESID through slides and illustrations on the user's first visit + - Onboarding tours, built using the React Joyride library, which can be accessed via clicking on the different tour chips in the information button in the top bar or from the last slide of the welcome dialog ### Improvements diff --git a/frontend/docs/onboarding-tours-documentation.md b/frontend/docs/onboarding-tours-documentation.md index c2be9cda..ee863a97 100644 --- a/frontend/docs/onboarding-tours-documentation.md +++ b/frontend/docs/onboarding-tours-documentation.md @@ -21,8 +21,8 @@ This documentation explains the structure of the Onboarding system and provides The onboarding system consists of the following components: -- **Welcome Modal**: displays an overview of ESID through slides and illustrations on the user's first visit. -- **Onboarding Tours**: built using the React Joyride library. These tours can be accessed by clicking on the different tour chips in the information button in the top bar or from the last slide of the welcome modal. Currently, the onboarding system includes the following tours: +- **Welcome Dialog**: displays an overview of ESID through slides and illustrations on the user's first visit. +- **Onboarding Tours**: built using the React Joyride library. These tours can be accessed by clicking on the different tour chips in the information button in the top bar or from the last slide of the welcome dialog. Currently, the onboarding system includes the following tours: - District map - Scenario - Line chart diff --git a/frontend/src/components/OnboardingComponents/WelcomeDialog/Slide.tsx b/frontend/src/components/OnboardingComponents/WelcomeDialog/Slide.tsx index 0bc4ec8d..b16e764e 100644 --- a/frontend/src/components/OnboardingComponents/WelcomeDialog/Slide.tsx +++ b/frontend/src/components/OnboardingComponents/WelcomeDialog/Slide.tsx @@ -24,7 +24,7 @@ interface SlideProps { } /** - * This component represents a slide in the welcome modal. + * This component represents a slide in the welcome dialog. */ export default function Slide({step, title, content, imageSrc}: SlideProps): JSX.Element { const theme = useTheme(); diff --git a/frontend/src/components/OnboardingComponents/WelcomeDialog/WelcomeDialog.tsx b/frontend/src/components/OnboardingComponents/WelcomeDialog/WelcomeDialog.tsx index 1b32b8bb..c112122a 100644 --- a/frontend/src/components/OnboardingComponents/WelcomeDialog/WelcomeDialog.tsx +++ b/frontend/src/components/OnboardingComponents/WelcomeDialog/WelcomeDialog.tsx @@ -52,7 +52,7 @@ interface WelcomeDialogProps { } /** - * This component is a welcome modal that is shown to the user when they first open the application. + * This component is a welcome dialog that is shown to the user when they first open the application. * It contains a series of slides that explain the basic functionality of the application. * At the last slide, the user can choose a tour to start or skip it altogether. */ diff --git a/frontend/src/components/OnboardingComponents/WelcomeDialog/WelcomeDialogWrapper.tsx b/frontend/src/components/OnboardingComponents/WelcomeDialog/WelcomeDialogWrapper.tsx index 4c2a3bce..06de6f37 100644 --- a/frontend/src/components/OnboardingComponents/WelcomeDialog/WelcomeDialogWrapper.tsx +++ b/frontend/src/components/OnboardingComponents/WelcomeDialog/WelcomeDialogWrapper.tsx @@ -35,7 +35,7 @@ export default function WelcomeDialogWrapper(): JSX.Element { }, [tOnboarding]); /** - * This effect checks if the user has already taken at least one tour, if not, the welcome modal is shown. + * This effect checks if the user has already taken at least one tour, if not, the welcome dialog is shown. */ useEffect(() => { const isUserFirstTime = Object.values(tours).every((tour) => tour === null); @@ -45,13 +45,13 @@ export default function WelcomeDialogWrapper(): JSX.Element { }, [dispatch, tours]); /** - * Those functions handle the next and previous button of the modal. + * Those functions handle the next and previous button of the dialog. */ const handleNext = () => setStep((prev) => prev + 1); const handlePrev = () => setStep((prev) => prev - 1); /** - * This function handles the closing of the modal and after shows the tooltip over the information button. + * This function handles the closing of the dialog and after shows the tooltip over the information button. */ const handleClose = useCallback(() => { dispatch(setShowWelcomeDialog(false)); @@ -64,7 +64,7 @@ export default function WelcomeDialogWrapper(): JSX.Element { }, [dispatch, tours]); /** - * This useMemo hook memoizes the images to be shown in the welcome modal. + * This useMemo hook memoizes the images to be shown in the welcome dialog. */ const memoizedImages: {[key: number]: string} = useMemo( () => ({