diff --git a/web/__test__/components/Activation/ActivationModal.test.ts b/web/__test__/components/Activation/ActivationModal.test.ts index c395dd97d..cba60701f 100644 --- a/web/__test__/components/Activation/ActivationModal.test.ts +++ b/web/__test__/components/Activation/ActivationModal.test.ts @@ -150,11 +150,15 @@ const mockUpgradeOnboardingStore = { }; // Mock all imports -vi.mock('vue-i18n', () => ({ - useI18n: () => ({ - t: mockT, - }), -})); +vi.mock('vue-i18n', async (importOriginal) => { + const actual = (await importOriginal()) as typeof import('vue-i18n'); + return { + ...(actual as Record), + useI18n: () => ({ + t: mockT, + }), + } as typeof import('vue-i18n'); +}); vi.mock('~/components/Activation/store/activationCodeModal', () => { const store = { @@ -241,15 +245,15 @@ describe('Activation/ActivationModal.vue', () => { it('uses the correct title text', () => { mountComponent(); - expect(mockT("Let's activate your Unraid OS License")).toBe("Let's activate your Unraid OS License"); + expect(mockT('activation.activationModal.letSActivateYourUnraidOs')).toBe( + "Let's activate your Unraid OS License" + ); }); it('uses the correct description text', () => { mountComponent(); - const descriptionText = mockT( - `On the following screen, your license will be activated. You'll then create an Unraid.net Account to manage your license going forward.` - ); + const descriptionText = mockT('activation.activationModal.onTheFollowingScreenYourLicense'); expect(descriptionText).toBe( "On the following screen, your license will be activated. You'll then create an Unraid.net Account to manage your license going forward." @@ -258,8 +262,8 @@ describe('Activation/ActivationModal.vue', () => { it('provides documentation links with correct URLs', () => { mountComponent(); - const licensingText = mockT('More about Licensing'); - const accountsText = mockT('More about Unraid.net Accounts'); + const licensingText = mockT('activation.activationModal.moreAboutLicensing'); + const accountsText = mockT('activation.activationModal.moreAboutUnraidNetAccounts'); expect(licensingText).toBe('More about Licensing'); expect(accountsText).toBe('More about Unraid.net Accounts'); diff --git a/web/__test__/components/Activation/WelcomeModal.test.ts b/web/__test__/components/Activation/WelcomeModal.test.ts index 70c50a0c6..4c9127947 100644 --- a/web/__test__/components/Activation/WelcomeModal.test.ts +++ b/web/__test__/components/Activation/WelcomeModal.test.ts @@ -12,6 +12,19 @@ import type { ComposerTranslation } from 'vue-i18n'; import WelcomeModal from '~/components/Activation/WelcomeModal.standalone.vue'; import { testTranslate } from '../../utils/i18n'; +type ActivationWelcomeStepStubProps = { + t?: ComposerTranslation; + partnerName?: string | null; + currentVersion?: string; + previousVersion?: string; + onComplete?: () => void; + redirectToLogin?: boolean; + onSkip?: () => void; + onBack?: () => void; + showSkip?: boolean; + showBack?: boolean; +}; + vi.mock('@unraid/ui', async (importOriginal) => { const actual = (await importOriginal()) as Record; return { @@ -49,18 +62,66 @@ const mockComponents = { props: ['steps', 'activeStepIndex'], }, ActivationWelcomeStep: { - template: - '

Welcome to Unraid!

', - props: ['t', 'partnerName', 'isInitialSetup', 'onComplete', 'redirectToLogin'], - methods: { - handleClick() { - if (this.redirectToLogin) { - window.location.href = '/login'; - } else { - this.onComplete(); + props: [ + 't', + 'partnerName', + 'currentVersion', + 'previousVersion', + 'onComplete', + 'redirectToLogin', + 'onSkip', + 'onBack', + 'showSkip', + 'showBack', + ], + setup(props: ActivationWelcomeStepStubProps) { + const translate = props.t ?? mockT; + + const buildTitle = () => { + if (props.partnerName) { + return translate('activation.welcomeModal.welcomeToYourNewSystemPowered', [props.partnerName]); } - }, + if (props.currentVersion) { + return translate('activation.welcomeModal.welcomeToUnraidVersion', [props.currentVersion]); + } + return translate('activation.welcomeModal.welcomeToUnraid'); + }; + + const buildDescription = () => { + if (props.previousVersion && props.currentVersion) { + return translate('activation.welcomeModal.youVeUpgradedFromPrevToCurr', [ + props.previousVersion, + props.currentVersion, + ]); + } + if (props.currentVersion) { + return translate('activation.welcomeModal.welcomeToYourUnraidSystem', [props.currentVersion]); + } + return translate('activation.welcomeModal.getStartedWithYourNewSystem'); + }; + + const handleClick = () => { + if (props.redirectToLogin) { + window.location.href = '/login'; + return; + } + props.onComplete?.(); + }; + + return { + title: buildTitle(), + description: buildDescription(), + buttonText: translate('activation.welcomeModal.getStarted'), + handleClick, + }; }, + template: ` +
+

{{ title }}

+

{{ description }}

+ +
+ `, }, }; @@ -162,7 +223,7 @@ describe('Activation/WelcomeModal.standalone.vue', () => { it('uses the correct description text', async () => { const wrapper = await mountComponent(); - const description = testTranslate('activation.welcomeModal.firstYouLlCreateYourDevice'); + const description = testTranslate('activation.welcomeModal.getStartedWithYourNewSystem'); expect(wrapper.text()).toContain(description); }); diff --git a/web/src/components/Activation/ActivationLicenseStep.vue b/web/src/components/Activation/ActivationLicenseStep.vue index a2f5d4e73..0cd02eeb1 100644 --- a/web/src/components/Activation/ActivationLicenseStep.vue +++ b/web/src/components/Activation/ActivationLicenseStep.vue @@ -28,9 +28,9 @@ const { t } = useI18n();
- + diff --git a/web/src/components/Activation/ActivationModal.vue b/web/src/components/Activation/ActivationModal.vue index 779614019..441196556 100644 --- a/web/src/components/Activation/ActivationModal.vue +++ b/web/src/components/Activation/ActivationModal.vue @@ -79,9 +79,9 @@ const currentDynamicStepIndex = computed(() => { const modalTitle = computed(() => { if (shouldShowUpgradeOnboarding.value && upgradeSteps.value.length > 0 && currentVersion.value) { - return t('Welcome to Unraid {version}!', { version: currentVersion.value }); + return t('activation.activationModal.welcomeToUnraidVersion', { version: currentVersion.value }); } - return t("Let's activate your Unraid OS License"); + return t('activation.activationModal.letSActivateYourUnraidOs'); }); const modalDescription = computed(() => { @@ -91,14 +91,12 @@ const modalDescription = computed(() => { previousVersion.value && currentVersion.value ) { - return t("You've upgraded from {prev} to {curr}", { + return t('activation.activationModal.youVeUpgradedFromPrevToCurr', { prev: previousVersion.value, curr: currentVersion.value, }); } - return t( - `On the following screen, your license will be activated. You'll then create an Unraid.net Account to manage your license going forward.` - ); + return t('activation.activationModal.onTheFollowingScreenYourLicense'); }); const docsButtons = computed(() => { @@ -109,7 +107,7 @@ const docsButtons = computed(() => { href: DOCS_URL_LICENSING_FAQ, iconRight: ArrowTopRightOnSquareIcon, size: '14px', - text: t('More about Licensing'), + text: t('activation.activationModal.moreAboutLicensing'), }, { variant: 'underline', @@ -117,7 +115,7 @@ const docsButtons = computed(() => { href: DOCS_URL_ACCOUNT, iconRight: ArrowTopRightOnSquareIcon, size: '14px', - text: t('More about Unraid.net Accounts'), + text: t('activation.activationModal.moreAboutUnraidNetAccounts'), }, ]; }); diff --git a/web/src/components/Activation/ActivationPluginsStep.vue b/web/src/components/Activation/ActivationPluginsStep.vue index e964b861a..9935f70b1 100644 --- a/web/src/components/Activation/ActivationPluginsStep.vue +++ b/web/src/components/Activation/ActivationPluginsStep.vue @@ -82,7 +82,7 @@ const handleInstall = async () => { props.onComplete(); } catch (err) { - error.value = props.t('Failed to install plugins. Please try again.'); + error.value = t('activation.pluginsStep.installFailed'); console.error('Failed to install plugins:', err); } finally { isInstalling.value = false; @@ -100,9 +100,11 @@ const handleBack = () => {