diff --git a/src/Components/CreateImageWizard/CreateImageWizard.tsx b/src/Components/CreateImageWizard/CreateImageWizard.tsx index c1fb2e48..3ee03bff 100644 --- a/src/Components/CreateImageWizard/CreateImageWizard.tsx +++ b/src/Components/CreateImageWizard/CreateImageWizard.tsx @@ -17,6 +17,7 @@ import FileSystemStep from './steps/FileSystem'; import { FileSystemContext } from './steps/FileSystem/FileSystemTable'; import FirstBootStep from './steps/FirstBoot'; import ImageOutputStep from './steps/ImageOutput'; +import LocaleStep from './steps/Locale'; import OscapStep from './steps/Oscap'; import PackagesStep from './steps/Packages'; import RegistrationStep from './steps/Registration'; @@ -135,6 +136,7 @@ const CreateImageWizard = ({ isEdit }: CreateImageWizardProps) => { const isUsersEnabled = useFlag('image-builder.users.enabled'); const isTimezoneEnabled = useFlag('image-builder.timezone.enabled'); + const isLocaleEnabled = useFlag('image-builder.locale.enabled'); // Remove this and all fallthrough logic when snapshotting is enabled in Prod-stable // =========================TO REMOVE======================= @@ -219,7 +221,7 @@ const CreateImageWizard = ({ isEdit }: CreateImageWizardProps) => { let startIndex = 1; // default index if (isEdit) { - startIndex = 17; + startIndex = 18; } // Duplicating some of the logic from the Wizard component to allow for custom nav items status @@ -465,6 +467,18 @@ const CreateImageWizard = ({ isEdit }: CreateImageWizardProps) => { > , + + } + > + + , { + return ; +}; + +export default KeyboardInput; diff --git a/src/Components/CreateImageWizard/steps/Locale/components/LanguagesDropDown.tsx b/src/Components/CreateImageWizard/steps/Locale/components/LanguagesDropDown.tsx new file mode 100644 index 00000000..139e21ba --- /dev/null +++ b/src/Components/CreateImageWizard/steps/Locale/components/LanguagesDropDown.tsx @@ -0,0 +1,9 @@ +import React from 'react'; + +import { FormGroup } from '@patternfly/react-core'; + +const LanguagesDropDown = () => { + return ; +}; + +export default LanguagesDropDown; diff --git a/src/Components/CreateImageWizard/steps/Locale/index.tsx b/src/Components/CreateImageWizard/steps/Locale/index.tsx new file mode 100644 index 00000000..8eb97e7d --- /dev/null +++ b/src/Components/CreateImageWizard/steps/Locale/index.tsx @@ -0,0 +1,21 @@ +import React from 'react'; + +import { Text, Form, Title } from '@patternfly/react-core'; + +import KeyboardInput from './components/KeyboardInput'; +import LanguagesDropDown from './components/LanguagesDropDown'; + +const LocaleStep = () => { + return ( +
+ + Locale + + Select locale for your image. + + + + ); +}; + +export default LocaleStep; diff --git a/src/test/Components/CreateImageWizard/steps/Details/Details.test.tsx b/src/test/Components/CreateImageWizard/steps/Details/Details.test.tsx index e69c3d14..ff61d123 100644 --- a/src/test/Components/CreateImageWizard/steps/Details/Details.test.tsx +++ b/src/test/Components/CreateImageWizard/steps/Details/Details.test.tsx @@ -27,6 +27,7 @@ const goToDetailsStep = async () => { await clickNext(); await clickNext(); await clickNext(); + await clickNext(); }; const enterBlueprintDescription = async ( diff --git a/src/test/Components/CreateImageWizard/steps/FileSystemConfiguration/FileSystemConfiguration.test.tsx b/src/test/Components/CreateImageWizard/steps/FileSystemConfiguration/FileSystemConfiguration.test.tsx index 25eb8da8..5478b028 100644 --- a/src/test/Components/CreateImageWizard/steps/FileSystemConfiguration/FileSystemConfiguration.test.tsx +++ b/src/test/Components/CreateImageWizard/steps/FileSystemConfiguration/FileSystemConfiguration.test.tsx @@ -115,6 +115,7 @@ const goToReviewStep = async () => { await clickNext(); await clickNext(); await clickNext(); + await clickNext(); await enterBlueprintName(); await clickNext(); }; diff --git a/src/test/Components/CreateImageWizard/steps/FirstBoot/Firstboot.test.tsx b/src/test/Components/CreateImageWizard/steps/FirstBoot/Firstboot.test.tsx index 69abf69c..bb8d0e8a 100644 --- a/src/test/Components/CreateImageWizard/steps/FirstBoot/Firstboot.test.tsx +++ b/src/test/Components/CreateImageWizard/steps/FirstBoot/Firstboot.test.tsx @@ -46,6 +46,7 @@ const goToFirstBootStep = async (): Promise => { await clickNext(); // Additional packages await clickNext(); // Users await clickNext(); // Timezone + await clickNext(); // Locale await clickNext(); // Snapshot await clickNext(); // First Boot }; @@ -69,6 +70,7 @@ const goFromOscapToFirstBoot = async () => { await clickNext(); await clickNext(); await clickNext(); + await clickNext(); }; const openCodeEditor = async (): Promise => { diff --git a/src/test/Components/CreateImageWizard/steps/ImageOutput/ImageOutput.test.tsx b/src/test/Components/CreateImageWizard/steps/ImageOutput/ImageOutput.test.tsx index 68c91c3e..119ee66f 100644 --- a/src/test/Components/CreateImageWizard/steps/ImageOutput/ImageOutput.test.tsx +++ b/src/test/Components/CreateImageWizard/steps/ImageOutput/ImageOutput.test.tsx @@ -137,6 +137,7 @@ const goToReviewStep = async () => { await clickNext(); // Additional packages await clickNext(); // Users await clickNext(); // Timezone + await clickNext(); // Locale await clickNext(); // First boot await clickNext(); // Details await enterBlueprintName(); diff --git a/src/test/Components/CreateImageWizard/steps/Locale/Locale.test.tsx b/src/test/Components/CreateImageWizard/steps/Locale/Locale.test.tsx new file mode 100644 index 00000000..d4e6278b --- /dev/null +++ b/src/test/Components/CreateImageWizard/steps/Locale/Locale.test.tsx @@ -0,0 +1,63 @@ +import type { Router as RemixRouter } from '@remix-run/router'; +import { screen, waitFor } from '@testing-library/react'; +import { userEvent } from '@testing-library/user-event'; + +import { + clickBack, + clickNext, + verifyCancelButton, +} from '../../wizardTestUtils'; +import { clickRegisterLater, renderCreateMode } from '../../wizardTestUtils'; + +let router: RemixRouter | undefined = undefined; + +const goToLocaleStep = async () => { + const user = userEvent.setup(); + const guestImageCheckBox = await screen.findByRole('checkbox', { + name: /virtualization guest image checkbox/i, + }); + await waitFor(() => user.click(guestImageCheckBox)); + await clickNext(); // Registration + await clickRegisterLater(); + await clickNext(); // OpenSCAP + await clickNext(); // File system configuration + await clickNext(); // Snapshots + await clickNext(); // Custom repositories + await clickNext(); // Additional packages + await clickNext(); // Users + await clickNext(); // Timezone + await clickNext(); // Locale +}; + +describe('Step Locale', () => { + beforeEach(() => { + vi.clearAllMocks(); + router = undefined; + }); + + test('clicking Next loads First Boot', async () => { + await renderCreateMode(); + await goToLocaleStep(); + await clickNext(); + await screen.findByRole('heading', { + name: 'First boot configuration', + }); + }); + + test('clicking Back loads Timezone', async () => { + await renderCreateMode(); + await goToLocaleStep(); + await clickBack(); + await screen.findByRole('heading', { name: 'Timezone' }); + }); + + test('clicking Cancel loads landing page', async () => { + await renderCreateMode(); + await goToLocaleStep(); + await verifyCancelButton(router); + }); +}); + +// TO DO 'Step Locale' -> 'revisit step button on Review works' +// TO DO 'Locale request generated correctly' +// TO DO 'Locale edit mode' diff --git a/src/test/Components/CreateImageWizard/steps/Oscap/Oscap.test.tsx b/src/test/Components/CreateImageWizard/steps/Oscap/Oscap.test.tsx index e9752815..d8ba5e05 100644 --- a/src/test/Components/CreateImageWizard/steps/Oscap/Oscap.test.tsx +++ b/src/test/Components/CreateImageWizard/steps/Oscap/Oscap.test.tsx @@ -100,6 +100,7 @@ const goToReviewStep = async () => { await clickNext(); // Additional packages await clickNext(); // Users await clickNext(); // Timezone + await clickNext(); // Locale await clickNext(); // FirstBoot await clickNext(); // Details await enterBlueprintName('Oscap test'); diff --git a/src/test/Components/CreateImageWizard/steps/Packages/Packages.test.tsx b/src/test/Components/CreateImageWizard/steps/Packages/Packages.test.tsx index 74d57f6f..46bc2325 100644 --- a/src/test/Components/CreateImageWizard/steps/Packages/Packages.test.tsx +++ b/src/test/Components/CreateImageWizard/steps/Packages/Packages.test.tsx @@ -54,6 +54,7 @@ const goToPackagesStep = async () => { const goToReviewStep = async () => { await clickNext(); // Users await clickNext(); // Timezone + await clickNext(); // Locale await clickNext(); // First Boot await clickNext(); // Details await enterBlueprintName(); diff --git a/src/test/Components/CreateImageWizard/steps/Registration/Registration.test.tsx b/src/test/Components/CreateImageWizard/steps/Registration/Registration.test.tsx index 8efffb38..8427858f 100644 --- a/src/test/Components/CreateImageWizard/steps/Registration/Registration.test.tsx +++ b/src/test/Components/CreateImageWizard/steps/Registration/Registration.test.tsx @@ -98,6 +98,7 @@ const goToReviewStep = async () => { await clickNext(); await clickNext(); await clickNext(); + await clickNext(); await enterBlueprintName(); await clickNext(); }; diff --git a/src/test/Components/CreateImageWizard/steps/Repositories/Repositories.test.tsx b/src/test/Components/CreateImageWizard/steps/Repositories/Repositories.test.tsx index fa587b1f..0199333c 100644 --- a/src/test/Components/CreateImageWizard/steps/Repositories/Repositories.test.tsx +++ b/src/test/Components/CreateImageWizard/steps/Repositories/Repositories.test.tsx @@ -48,6 +48,7 @@ const goToReviewStep = async () => { await clickNext(); await clickNext(); // Users await clickNext(); // Timezone + await clickNext(); // Locale await clickNext(); // First Boot await enterBlueprintName(); await clickNext(); // Review diff --git a/src/test/Components/CreateImageWizard/steps/Review/Review.test.tsx b/src/test/Components/CreateImageWizard/steps/Review/Review.test.tsx index 343dcbd1..2b6440ad 100644 --- a/src/test/Components/CreateImageWizard/steps/Review/Review.test.tsx +++ b/src/test/Components/CreateImageWizard/steps/Review/Review.test.tsx @@ -58,6 +58,7 @@ const goToReviewStep = async () => { await clickNext(); await clickNext(); await clickNext(); + await clickNext(); }; describe('Step Review', () => { diff --git a/src/test/Components/CreateImageWizard/steps/Snapshot/Snapshot.test.tsx b/src/test/Components/CreateImageWizard/steps/Snapshot/Snapshot.test.tsx index dcccd6ed..25c785d5 100644 --- a/src/test/Components/CreateImageWizard/steps/Snapshot/Snapshot.test.tsx +++ b/src/test/Components/CreateImageWizard/steps/Snapshot/Snapshot.test.tsx @@ -40,6 +40,7 @@ const goToReviewStep = async () => { await clickNext(); await clickNext(); // Users await clickNext(); // Timezone + await clickNext(); // Locale await enterBlueprintName(); await clickNext(); }; diff --git a/src/test/Components/CreateImageWizard/steps/TargetEnvironment/AwsTarget.test.tsx b/src/test/Components/CreateImageWizard/steps/TargetEnvironment/AwsTarget.test.tsx index 568f92c8..0bfa23db 100644 --- a/src/test/Components/CreateImageWizard/steps/TargetEnvironment/AwsTarget.test.tsx +++ b/src/test/Components/CreateImageWizard/steps/TargetEnvironment/AwsTarget.test.tsx @@ -46,6 +46,7 @@ const goToReview = async () => { await clickNext(); // Additional packages await clickNext(); // Users await clickNext(); // Timezone + await clickNext(); // Locale await clickNext(); // Details await clickNext(); // FirstBoot await enterBlueprintName(); diff --git a/src/test/Components/CreateImageWizard/steps/TargetEnvironment/AzureTarget.test.tsx b/src/test/Components/CreateImageWizard/steps/TargetEnvironment/AzureTarget.test.tsx index c099a741..a3765f3d 100644 --- a/src/test/Components/CreateImageWizard/steps/TargetEnvironment/AzureTarget.test.tsx +++ b/src/test/Components/CreateImageWizard/steps/TargetEnvironment/AzureTarget.test.tsx @@ -46,6 +46,7 @@ const goToReview = async () => { await clickNext(); // Additional packages await clickNext(); // Users await clickNext(); // Timezone + await clickNext(); // Locale await clickNext(); // FirstBoot await clickNext(); // Details await enterBlueprintName(); diff --git a/src/test/Components/CreateImageWizard/steps/TargetEnvironment/GCPTarget.test.tsx b/src/test/Components/CreateImageWizard/steps/TargetEnvironment/GCPTarget.test.tsx index f9c6b0bf..90156e30 100644 --- a/src/test/Components/CreateImageWizard/steps/TargetEnvironment/GCPTarget.test.tsx +++ b/src/test/Components/CreateImageWizard/steps/TargetEnvironment/GCPTarget.test.tsx @@ -41,6 +41,7 @@ const goToReview = async () => { await clickNext(); // Additional packages await clickNext(); // Users await clickNext(); // Timezone + await clickNext(); // Locale await clickNext(); // Details await clickNext(); // FirstBoot await enterBlueprintName(); diff --git a/src/test/Components/CreateImageWizard/steps/Timezone/Timezone.test.tsx b/src/test/Components/CreateImageWizard/steps/Timezone/Timezone.test.tsx index 3da332ef..a7f9f406 100644 --- a/src/test/Components/CreateImageWizard/steps/Timezone/Timezone.test.tsx +++ b/src/test/Components/CreateImageWizard/steps/Timezone/Timezone.test.tsx @@ -34,12 +34,12 @@ describe('Step Timezone', () => { router = undefined; }); - test('clicking Next loads First Boot', async () => { + test('clicking Next loads Locale', async () => { await renderCreateMode(); await goToTimezoneStep(); await clickNext(); await screen.findByRole('heading', { - name: 'First boot configuration', + name: 'Locale', }); }); diff --git a/src/test/setup.ts b/src/test/setup.ts index 340207d8..b3da8518 100644 --- a/src/test/setup.ts +++ b/src/test/setup.ts @@ -67,6 +67,8 @@ vi.mock('@unleash/proxy-client-react', () => ({ return true; case 'image-builder.timezone.enabled': return true; + case 'image-builder.locale.enabled': + return true; case 'edgeParity.image-list': return true; case 'image-builder.edge.local-image-table':