From 0029b60bc4d647975e4013b127a89e26d880b1d5 Mon Sep 17 00:00:00 2001 From: Tasso Date: Thu, 24 Oct 2024 19:34:16 -0300 Subject: [PATCH] regression(i18n): Broken translations in Setup Wizard --- .../views/setupWizard/SetupWizardRoute.tsx | 18 ++++-------- .../views/setupWizard/steps/AdminInfoStep.tsx | 24 ++++++++-------- .../steps/CloudAccountConfirmation.tsx | 22 ++++++++------- .../steps/OrganizationInfoStep.tsx | 28 ++++++++++--------- .../setupWizard/steps/RegisterServerStep.tsx | 20 +++++++------ yarn.lock | 28 +++++++++---------- 6 files changed, 71 insertions(+), 69 deletions(-) diff --git a/apps/meteor/client/views/setupWizard/SetupWizardRoute.tsx b/apps/meteor/client/views/setupWizard/SetupWizardRoute.tsx index 91e47b4a590f..c28aea38b4fa 100644 --- a/apps/meteor/client/views/setupWizard/SetupWizardRoute.tsx +++ b/apps/meteor/client/views/setupWizard/SetupWizardRoute.tsx @@ -2,7 +2,6 @@ import { useBreakpoints } from '@rocket.chat/fuselage-hooks'; import { DarkModeProvider } from '@rocket.chat/layout'; import type { ReactElement } from 'react'; import React from 'react'; -import { useTranslation, I18nextProvider } from 'react-i18next'; import ModalRegion from '../modal/ModalRegion'; import SetupWizardPage from './SetupWizardPage'; @@ -16,22 +15,17 @@ export const SetupWizardRoute = (): ReactElement | null => { const isMobile = !breakpoints.includes('md'); useBodyPosition('relative', isMobile); - const { i18n } = useTranslation(); - if (locked) { return null; } return ( - // FIXME: setting the defaultNS here is problematic for components/hooks expecting it to be 'core' - - - - - - - - + + + + + + ); }; diff --git a/apps/meteor/client/views/setupWizard/steps/AdminInfoStep.tsx b/apps/meteor/client/views/setupWizard/steps/AdminInfoStep.tsx index 7b8b9b6e8a2b..fc457135cfa8 100644 --- a/apps/meteor/client/views/setupWizard/steps/AdminInfoStep.tsx +++ b/apps/meteor/client/views/setupWizard/steps/AdminInfoStep.tsx @@ -3,7 +3,7 @@ import { escapeRegExp } from '@rocket.chat/string-helpers'; import { useSetting } from '@rocket.chat/ui-contexts'; import type { ReactElement, ComponentProps } from 'react'; import React from 'react'; -import { useTranslation } from 'react-i18next'; +import { I18nextProvider, useTranslation } from 'react-i18next'; import { useSetupWizardContext } from '../contexts/SetupWizardContext'; @@ -13,7 +13,7 @@ const hasBlockedName = (username: string): boolean => !!usernameBlackList.length && usernameBlackList.some((restrictedUsername) => restrictedUsername.test(escapeRegExp(username).trim())); const AdminInfoStep = (): ReactElement => { - const { t } = useTranslation(); + const { t, i18n } = useTranslation(); const regexpForUsernameValidation = useSetting('UTF8_User_Names_Validation'); const usernameRegExp = new RegExp(`^${regexpForUsernameValidation}$`); @@ -33,15 +33,17 @@ const AdminInfoStep = (): ReactElement => { }; return ( - password.length > 0} - passwordRulesHint='' - validateUsername={validateUsername} - validateEmail={validateEmail} - currentStep={currentStep} - stepCount={maxSteps} - onSubmit={handleSubmit} - /> + + password.length > 0} + passwordRulesHint='' + validateUsername={validateUsername} + validateEmail={validateEmail} + currentStep={currentStep} + stepCount={maxSteps} + onSubmit={handleSubmit} + /> + ); }; diff --git a/apps/meteor/client/views/setupWizard/steps/CloudAccountConfirmation.tsx b/apps/meteor/client/views/setupWizard/steps/CloudAccountConfirmation.tsx index 7dfbba246a46..202868b0a478 100644 --- a/apps/meteor/client/views/setupWizard/steps/CloudAccountConfirmation.tsx +++ b/apps/meteor/client/views/setupWizard/steps/CloudAccountConfirmation.tsx @@ -2,7 +2,7 @@ import { AwaitingConfirmationPage } from '@rocket.chat/onboarding-ui'; import { useToastMessageDispatch, useSettingSetValue, useEndpoint } from '@rocket.chat/ui-contexts'; import type { ReactElement } from 'react'; import React, { useEffect, useCallback } from 'react'; -import { useTranslation } from 'react-i18next'; +import { I18nextProvider, useTranslation } from 'react-i18next'; import { useSetupWizardContext } from '../contexts/SetupWizardContext'; @@ -20,7 +20,7 @@ const CloudAccountConfirmation = (): ReactElement => { const setShowSetupWizard = useSettingSetValue('Show_Setup_Wizard'); const cloudConfirmationPoll = useEndpoint('GET', '/v1/cloud.confirmationPoll'); const dispatchToastMessage = useToastMessageDispatch(); - const { t } = useTranslation(); + const { t, i18n } = useTranslation(); const getConfirmation = useCallback(async () => { try { @@ -47,14 +47,16 @@ const CloudAccountConfirmation = (): ReactElement => { }, [getConfirmation, registrationData.interval]); return ( - => registerServer({ email: registrationData.cloudEmail, resend: true })} - onChangeEmailRequest={(): void => goToStep(3)} - /> + + => registerServer({ email: registrationData.cloudEmail, resend: true })} + onChangeEmailRequest={(): void => goToStep(3)} + /> + ); }; diff --git a/apps/meteor/client/views/setupWizard/steps/OrganizationInfoStep.tsx b/apps/meteor/client/views/setupWizard/steps/OrganizationInfoStep.tsx index eb740a0afcaa..2f0c251a4c39 100644 --- a/apps/meteor/client/views/setupWizard/steps/OrganizationInfoStep.tsx +++ b/apps/meteor/client/views/setupWizard/steps/OrganizationInfoStep.tsx @@ -5,7 +5,7 @@ import { useRole } from '@rocket.chat/ui-contexts'; import type { TFunction } from 'i18next'; import type { ComponentProps, ReactElement } from 'react'; import React from 'react'; -import { useTranslation } from 'react-i18next'; +import { I18nextProvider, useTranslation } from 'react-i18next'; import { useSetupWizardContext } from '../contexts/SetupWizardContext'; @@ -28,7 +28,7 @@ const getSettingOptions = ( }; const OrganizationInfoStep = (): ReactElement => { - const { t } = useTranslation(); + const { t, i18n } = useTranslation(); const hasAdminRole = useRole('admin'); const { @@ -61,17 +61,19 @@ const OrganizationInfoStep = (): ReactElement => { }; return ( - + + + ); }; diff --git a/apps/meteor/client/views/setupWizard/steps/RegisterServerStep.tsx b/apps/meteor/client/views/setupWizard/steps/RegisterServerStep.tsx index 85cd5b944486..d4a4eb270740 100644 --- a/apps/meteor/client/views/setupWizard/steps/RegisterServerStep.tsx +++ b/apps/meteor/client/views/setupWizard/steps/RegisterServerStep.tsx @@ -3,7 +3,7 @@ import { useEndpoint, useMethod } from '@rocket.chat/ui-contexts'; import { useMutation, useQuery } from '@tanstack/react-query'; import type { ReactElement, ComponentProps } from 'react'; import React, { useState } from 'react'; -import { useTranslation } from 'react-i18next'; +import { I18nextProvider, useTranslation } from 'react-i18next'; import { useInvalidateLicense } from '../../../hooks/useLicense'; import { dispatchToastMessage } from '../../../lib/toast'; @@ -15,7 +15,7 @@ const SERVER_OPTIONS = { }; const RegisterServerStep = (): ReactElement => { - const { t } = useTranslation(); + const { t, i18n } = useTranslation(); const { currentStep, goToNextStep, setSetupWizardData, registerServer, maxSteps, completeSetupWizard, saveAgreementData } = useSetupWizardContext(); const [serverOption, setServerOption] = useState(SERVER_OPTIONS.REGISTERED); @@ -82,13 +82,15 @@ const RegisterServerStep = (): ReactElement => { } return ( - setServerOption(SERVER_OPTIONS.OFFLINE)} - stepCount={maxSteps} - onSubmit={handleRegister} - currentStep={currentStep} - offline={isError || (!isLoading && offline)} - /> + + setServerOption(SERVER_OPTIONS.OFFLINE)} + stepCount={maxSteps} + onSubmit={handleRegister} + currentStep={currentStep} + offline={isError || (!isLoading && offline)} + /> + ); }; diff --git a/yarn.lock b/yarn.lock index d4c42cf92a83..0acf4401d562 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8547,10 +8547,10 @@ __metadata: "@rocket.chat/icons": "*" "@rocket.chat/prettier-config": "*" "@rocket.chat/styled": "*" - "@rocket.chat/ui-avatar": 8.0.0-rc.2 - "@rocket.chat/ui-contexts": 12.0.0-rc.2 + "@rocket.chat/ui-avatar": 8.0.0-rc.3 + "@rocket.chat/ui-contexts": 12.0.0-rc.3 "@rocket.chat/ui-kit": 0.37.0-rc.0 - "@rocket.chat/ui-video-conf": 12.0.0-rc.2 + "@rocket.chat/ui-video-conf": 12.0.0-rc.3 "@tanstack/react-query": "*" react: ~17.0.2 react-dom: "*" @@ -8636,8 +8636,8 @@ __metadata: "@rocket.chat/fuselage-tokens": "*" "@rocket.chat/message-parser": 0.31.31 "@rocket.chat/styled": "*" - "@rocket.chat/ui-client": 12.0.0-rc.2 - "@rocket.chat/ui-contexts": 12.0.0-rc.2 + "@rocket.chat/ui-client": 12.0.0-rc.3 + "@rocket.chat/ui-contexts": 12.0.0-rc.3 katex: "*" react: "*" languageName: unknown @@ -9888,7 +9888,7 @@ __metadata: typescript: "npm:~5.6.3" peerDependencies: "@rocket.chat/fuselage": "*" - "@rocket.chat/ui-contexts": 12.0.0-rc.2 + "@rocket.chat/ui-contexts": 12.0.0-rc.3 react: ~17.0.2 languageName: unknown linkType: soft @@ -9938,8 +9938,8 @@ __metadata: "@rocket.chat/fuselage": "*" "@rocket.chat/fuselage-hooks": "*" "@rocket.chat/icons": "*" - "@rocket.chat/ui-avatar": 8.0.0-rc.2 - "@rocket.chat/ui-contexts": 12.0.0-rc.2 + "@rocket.chat/ui-avatar": 8.0.0-rc.3 + "@rocket.chat/ui-contexts": 12.0.0-rc.3 react: "*" react-i18next: "*" languageName: unknown @@ -10109,8 +10109,8 @@ __metadata: "@rocket.chat/fuselage-hooks": "*" "@rocket.chat/icons": "*" "@rocket.chat/styled": "*" - "@rocket.chat/ui-avatar": 8.0.0-rc.2 - "@rocket.chat/ui-contexts": 12.0.0-rc.2 + "@rocket.chat/ui-avatar": 8.0.0-rc.3 + "@rocket.chat/ui-contexts": 12.0.0-rc.3 react: ~17.0.2 react-dom: ^17.0.2 languageName: unknown @@ -10166,9 +10166,9 @@ __metadata: "@rocket.chat/fuselage-hooks": "*" "@rocket.chat/icons": "*" "@rocket.chat/styled": "*" - "@rocket.chat/ui-avatar": 8.0.0-rc.2 - "@rocket.chat/ui-client": 12.0.0-rc.2 - "@rocket.chat/ui-contexts": 12.0.0-rc.2 + "@rocket.chat/ui-avatar": 8.0.0-rc.3 + "@rocket.chat/ui-client": 12.0.0-rc.3 + "@rocket.chat/ui-contexts": 12.0.0-rc.3 react: ~17.0.2 react-aria: ~3.23.1 react-dom: ^17.0.2 @@ -10255,7 +10255,7 @@ __metadata: peerDependencies: "@rocket.chat/layout": "*" "@rocket.chat/tools": 0.2.2 - "@rocket.chat/ui-contexts": 12.0.0-rc.2 + "@rocket.chat/ui-contexts": 12.0.0-rc.3 "@tanstack/react-query": "*" react: "*" react-hook-form: "*"