firmware: consolidate back/next button props

This reduces duplicate code and fixes "Back" not being translated on
the last step.
This commit is contained in:
David Lechner
2022-12-20 12:28:06 -06:00
parent 56dbf57e25
commit 25231012f6
4 changed files with 23 additions and 65 deletions
@@ -358,66 +358,23 @@ const DfuWindowsDriverInstallDialog: React.VoidFunctionComponent = () => {
className="pb-dfu-windows-driver-install-dialog"
isOpen={isOpen}
onClose={() => dispatch(firmwareDfuWindowsDriverInstallDialogDialogHide())}
backButtonProps={{ text: i18n.translate('backButton.label') }}
nextButtonProps={{ text: i18n.translate('nextButton.label') }}
finalButtonProps={{
text: i18n.translate('doneButton.label'),
onClick: () =>
dispatch(firmwareDfuWindowsDriverInstallDialogDialogHide()),
}}
>
<DialogStep
id="1"
panel={<Step1 />}
backButtonProps={{ text: i18n.translate('backButton.label') }}
nextButtonProps={{ text: i18n.translate('nextButton.label') }}
/>
<DialogStep
id="2"
panel={<Step2 hub={hub} />}
backButtonProps={{ text: i18n.translate('backButton.label') }}
nextButtonProps={{ text: i18n.translate('nextButton.label') }}
/>
<DialogStep
id="3"
panel={<Step3 hub={hub} />}
backButtonProps={{ text: i18n.translate('backButton.label') }}
nextButtonProps={{ text: i18n.translate('nextButton.label') }}
/>
<DialogStep
id="4"
panel={<Step4 hub={hub} />}
backButtonProps={{ text: i18n.translate('backButton.label') }}
nextButtonProps={{ text: i18n.translate('nextButton.label') }}
/>
<DialogStep
id="5"
panel={<Step5 hub={hub} />}
backButtonProps={{ text: i18n.translate('backButton.label') }}
nextButtonProps={{ text: i18n.translate('nextButton.label') }}
/>
<DialogStep
id="6"
panel={<Step6 hub={hub} />}
backButtonProps={{ text: i18n.translate('backButton.label') }}
nextButtonProps={{ text: i18n.translate('nextButton.label') }}
/>
<DialogStep
id="7"
panel={<Step7 hub={hub} />}
backButtonProps={{ text: i18n.translate('backButton.label') }}
nextButtonProps={{ text: i18n.translate('nextButton.label') }}
/>
<DialogStep
id="8"
panel={<Step8 />}
backButtonProps={{ text: i18n.translate('backButton.label') }}
nextButtonProps={{ text: i18n.translate('nextButton.label') }}
/>
<DialogStep
id="9"
panel={<Step9 hub={hub} />}
backButtonProps={{ text: i18n.translate('backButton.label') }}
nextButtonProps={{ text: i18n.translate('nextButton.label') }}
/>
<DialogStep id="1" panel={<Step1 />} />
<DialogStep id="2" panel={<Step2 hub={hub} />} />
<DialogStep id="3" panel={<Step3 hub={hub} />} />
<DialogStep id="4" panel={<Step4 hub={hub} />} />
<DialogStep id="5" panel={<Step5 hub={hub} />} />
<DialogStep id="6" panel={<Step6 hub={hub} />} />
<DialogStep id="7" panel={<Step7 hub={hub} />} />
<DialogStep id="8" panel={<Step8 />} />
<DialogStep id="9" panel={<Step9 hub={hub} />} />
</MultistepDialog>
);
};
@@ -461,6 +461,8 @@ export const InstallPybricksDialog: React.VoidFunctionComponent = () => {
title={i18n.translate('title')}
isOpen={isOpen}
onClose={() => dispatch(firmwareInstallPybricksDialogCancel())}
backButtonProps={{ text: i18n.translate('backButton.label') }}
nextButtonProps={{ text: i18n.translate('nextButton.label') }}
finalButtonProps={{
text: i18n.translate('flashFirmwareButton.label'),
onClick: () =>
@@ -482,7 +484,6 @@ export const InstallPybricksDialog: React.VoidFunctionComponent = () => {
onCustomFirmwareZip={setCustomFirmwareZip}
/>
}
nextButtonProps={{ text: i18n.translate('nextButton.label') }}
/>
<DialogStep
id="license"
@@ -495,7 +496,6 @@ export const InstallPybricksDialog: React.VoidFunctionComponent = () => {
onLicenseAcceptedChanged={setLicenseAccepted}
/>
}
backButtonProps={{ text: i18n.translate('backButton.label') }}
nextButtonProps={{
disabled: !licenseAccepted,
text: i18n.translate('nextButton.label'),
@@ -510,14 +510,11 @@ export const InstallPybricksDialog: React.VoidFunctionComponent = () => {
onChangeHubName={setHubName}
/>
}
backButtonProps={{ text: i18n.translate('backButton.label') }}
nextButtonProps={{ text: i18n.translate('nextButton.label') }}
/>
<DialogStep
id="bootloader"
title={i18n.translate('bootloaderPanel.title')}
panel={<BootloaderModePanel hubType={selectedHubType} />}
backButtonProps={{ text: i18n.translate('backButton.label') }}
/>
</MultistepDialog>
);
@@ -33,9 +33,7 @@ const SelectHubPanel: React.VoidFunctionComponent = () => {
<p>
{i18n.translate('selectHubPanel.message', {
lego: legoRegisteredTrademark,
next: (
<strong>{i18n.translate('selectHubPanel.nextButton')}</strong>
),
next: <strong>{i18n.translate('nextButton.label')}</strong>,
})}
</p>
<div className="pb-spacer" />
@@ -96,6 +94,8 @@ const RestoreOfficialDialog: React.VoidFunctionComponent = () => {
isOpen={isOpen}
title={i18n.translate('title', { lego: legoRegisteredTrademark })}
onClose={() => dispatch(firmwareRestoreOfficialDialogHide())}
backButtonProps={{ text: i18n.translate('backButton.label') }}
nextButtonProps={{ text: i18n.translate('nextButton.label') }}
finalButtonProps={{
text: i18n.translate('doneButton.label'),
onClick: () => dispatch(firmwareRestoreOfficialDialogHide()),
@@ -105,7 +105,6 @@ const RestoreOfficialDialog: React.VoidFunctionComponent = () => {
id="hub"
title={i18n.translate('selectHubPanel.title')}
panel={<SelectHubPanel />}
nextButtonProps={{ text: i18n.translate('selectHubPanel.nextButton') }}
/>
<DialogStep
id="restore"
@@ -1,12 +1,17 @@
{
"title": "Restore official {lego} Firmware",
"backButton": {
"label": "Back"
},
"nextButton": {
"label": "Next"
},
"doneButton": {
"label": "Done"
},
"selectHubPanel": {
"title": "Select hub",
"message": "Select the hub to restore the official {lego} firmware on, then click {next}.",
"nextButton": "Next"
"message": "Select the hub to restore the official {lego} firmware on, then click {next}."
},
"restoreFirmwarePanel": {
"title": "Restore firmware",