diff --git a/ui/webui/src/components/AnacondaWizard.jsx b/ui/webui/src/components/AnacondaWizard.jsx index 3bd3dc5a515..e4f5e3d92df 100644 --- a/ui/webui/src/components/AnacondaWizard.jsx +++ b/ui/webui/src/components/AnacondaWizard.jsx @@ -46,7 +46,7 @@ import { const _ = cockpit.gettext; -export const AnacondaWizard = ({ dispatch, deviceData, diskSelection, languages, commonLocales, onAddErrorNotification, toggleContextHelp, hideContextHelp, title, conf }) => { +export const AnacondaWizard = ({ dispatch, storageData, localizationData, onAddErrorNotification, toggleContextHelp, hideContextHelp, title, conf }) => { const [isFormValid, setIsFormValid] = useState(true); const [stepNotification, setStepNotification] = useState(); const [isInProgress, setIsInProgress] = useState(false); @@ -57,7 +57,7 @@ export const AnacondaWizard = ({ dispatch, deviceData, diskSelection, languages, const stepsOrder = [ { component: InstallationLanguage, - data: { dispatch, languages, commonLocales }, + data: { dispatch, languages: localizationData.languages, commonLocales: localizationData.commonLocales }, id: "installation-language", label: _("Welcome"), }, @@ -67,7 +67,7 @@ export const AnacondaWizard = ({ dispatch, deviceData, diskSelection, languages, label: _("Installation destination"), steps: [{ component: InstallationDestination, - data: { deviceData, diskSelection, dispatch }, + data: { deviceData: storageData.devices, diskSelection: storageData.diskSelection, dispatch }, id: "storage-devices", label: _("Storage devices") }, { @@ -82,7 +82,7 @@ export const AnacondaWizard = ({ dispatch, deviceData, diskSelection, languages, }, { component: ReviewConfiguration, - data: { deviceData }, + data: { deviceData: storageData.devices }, id: "installation-review", label: _("Review and install"), }, diff --git a/ui/webui/src/components/app.jsx b/ui/webui/src/components/app.jsx index 217da71b777..d7cd39c591c 100644 --- a/ui/webui/src/components/app.jsx +++ b/ui/webui/src/components/app.jsx @@ -142,10 +142,8 @@ export const Application = () => { toggleContextHelp={toggleContextHelp} hideContextHelp={() => setIsHelpExpanded(false)} title={title} - deviceData={state.devices} - languages={state.languages} - commonLocales={state.commonLocales} - diskSelection={state.diskSelection} + storageData={state.storage} + localizationData={state.localization} dispatch={dispatch} conf={conf} /> diff --git a/ui/webui/src/reducer.js b/ui/webui/src/reducer.js index 23007a49da6..f7cb9672030 100644 --- a/ui/webui/src/reducer.js +++ b/ui/webui/src/reducer.js @@ -17,6 +17,29 @@ import { useReducer, useCallback } from "react"; +/* Initial state for the storeage store substate */ +export const storageInitialState = { + devices: {}, + diskSelection: { + usableDisks: [], + selectedDisks: [], + ignoredDisks: [] + }, +}; + +/* Initial state for the localization store substate */ +export const localizationInitialState = { + languages: {}, + commonLocales: [] +}; + +/* Initial state for the global store */ +export const initialState = { + localization: localizationInitialState, + storage: storageInitialState, +}; + +/* Custom hook to use the reducer with async actions */ export const useReducerWithThunk = (reducer, initialState) => { const [state, dispatch] = useReducer(reducer, initialState); @@ -36,29 +59,28 @@ export const useReducerWithThunk = (reducer, initialState) => { }; export const reducer = (state, action) => { + return ({ + localization: localizationReducer(state.localization, action), + storage: storageReducer(state.storage, action), + }); +}; + +export const storageReducer = (state = storageInitialState, action) => { if (action.type === "GET_DEVICE_DATA") { return { ...state, devices: { ...action.payload.deviceData, ...state.devices } }; } else if (action.type === "GET_DISK_SELECTION") { return { ...state, diskSelection: action.payload.diskSelection }; + } else { + return state; } +}; +export const localizationReducer = (state = localizationInitialState, action) => { if (action.type === "GET_LANGUAGE_DATA") { return { ...state, languages: { ...action.payload.languageData, ...state.languages } }; - } - - if (action.type === "GET_COMMON_LOCALES") { + } else if (action.type === "GET_COMMON_LOCALES") { return { ...state, commonLocales: action.payload.commonLocales }; + } else { + return state; } }; - -export const initialState = { - devices: {}, - diskSelection: { - usableDisks: [], - selectedDisks: [], - ignoredDisks: [] - }, - - languages: {}, - commonLocales: [] -};