particle-os/debian-image-builder-frontend
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Wizard: Add Locale to Review step

Browse source 
This adds Locale expandable to the Review step.
This commit is contained in:
regexowl 2024-12-09 14:40:02 +01:00 • committed by Lucas Garfield
parent 3dcafd5672
commit 8d84b5eef2
3 changed files with 74 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

22
src/Components/CreateImageWizard/steps/Review/ReviewStep.tsx
View file

@ -29,6 +29,7 @@ import {
TargetEnvOciList,
TargetEnvOtherList,
TimezoneList,
LocaleList,
} from './ReviewStepTextLists';
import isRhel from '../../../../../src/Utilities/isRhel';
@ -68,9 +69,11 @@ const Review = ({ snapshottingEnabled }: { snapshottingEnabled: boolean }) => {
const [isExpandedComplianceDetail, setIsExpandedComplianceDetail] =
useState(true);
const [isExpandedTimezone, setIsExpandedTimezone] = useState(true);
const [isExpandedLocale, setIsExpandedLocale] = useState(true);
const [isExpandableFirstBoot, setIsExpandedFirstBoot] = useState(true);
const isTimezoneEnabled = useFlag('image-builder.timezone.enabled');
const isLocaleEnabled = useFlag('image-builder.locale.enabled');
const onToggleImageOutput = (isExpandedImageOutput: boolean) =>
setIsExpandedImageOutput(isExpandedImageOutput);
@ -90,6 +93,8 @@ const Review = ({ snapshottingEnabled }: { snapshottingEnabled: boolean }) => {
setIsExpandedComplianceDetail(isExpandedComplianceDetail);
const onToggleTimezone = (isExpandedTimezone: boolean) =>
setIsExpandedTimezone(isExpandedTimezone);
const onToggleLocale = (isExpandedLocale: boolean) =>
setIsExpandedLocale(isExpandedLocale);
const onToggleFirstBoot = (isExpandableFirstBoot: boolean) =>
setIsExpandedFirstBoot(isExpandableFirstBoot);
@ -321,6 +326,23 @@ const Review = ({ snapshottingEnabled }: { snapshottingEnabled: boolean }) => {
<TimezoneList />
</ExpandableSection>
)}
{isLocaleEnabled && (
<ExpandableSection
toggleContent={composeExpandable(
'Locale',
'revisit-locale',
'wizard-locale'
)}
onToggle={(_event, isExpandedLocale) =>
onToggleLocale(isExpandedLocale)
}
isExpanded={isExpandedLocale}
isIndented
data-testid="locale-expandable"
>
<LocaleList />
</ExpandableSection>
)}
{isFirstBootEnabled && (
<ExpandableSection
toggleContent={composeExpandable(

32
src/Components/CreateImageWizard/steps/Review/ReviewStepTextLists.tsx
View file

@ -65,6 +65,8 @@ import {
selectFirstBootScript,
selectTimezone,
selectNtpServers,
selectLanguages,
selectKeyboard,
} from '../../../../store/wizardSlice';
import { toMonthAndYear, yyyyMMddFormat } from '../../../../Utilities/time';
import {
@ -771,6 +773,36 @@ export const TimezoneList = () => {
);
};
export const LocaleList = () => {
const languages = useAppSelector(selectLanguages);
const keyboard = useAppSelector(selectKeyboard);
return (
<TextContent>
<TextList component={TextListVariants.dl}>
<TextListItem
component={TextListItemVariants.dt}
className="pf-v5-u-min-width"
>
Languages
</TextListItem>
<TextListItem component={TextListItemVariants.dd}>
{languages && languages.length > 0 ? languages.join(', ') : 'None'}
</TextListItem>
<TextListItem
component={TextListItemVariants.dt}
className="pf-v5-u-min-width"
>
Keyboard
</TextListItem>
<TextListItem component={TextListItemVariants.dd}>
{keyboard ? keyboard : 'None'}
</TextListItem>
</TextList>
</TextContent>
);
};
export const FirstBootList = () => {
const isFirstbootEnabled = !!useAppSelector(selectFirstBootScript);