From 91c86ee4834b57dd99dd27f252da002985103e15 Mon Sep 17 00:00:00 2001
From: Katerina Koukiou <kkoukiou@redhat.com>
Date: Wed, 28 Jun 2023 14:32:50 +0200
Subject: [PATCH 1/4] webui: remove forgotten console.info object

This get's reprinted on each re-render of the component polluting the
browser console and therefore the test run outputs.
---
 ui/webui/src/components/app.jsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/ui/webui/src/components/app.jsx b/ui/webui/src/components/app.jsx
index b97ba6d1314..f2b56104784 100644
--- a/ui/webui/src/components/app.jsx
+++ b/ui/webui/src/components/app.jsx
@@ -100,7 +100,6 @@ export const Application = () => {
     if (!address || !conf) {
         return null;
     }
-    console.info("conf: ", conf);
 
     const title = cockpit.format("$0 installation", prettyName);
 

From 792d3e94dba09b5a003ae1dcbe5ca211ffcb0b39 Mon Sep 17 00:00:00 2001
From: Jelle van der Waa <jvanderwaa@redhat.com>
Date: Thu, 11 May 2023 12:55:05 +0200
Subject: [PATCH 2/4] webui: mount point assignment support

Support a new storage configuration method where a user first has to
manually partition and create file systems using the tools on the
installation image.
When selecting the custom mount point option the user can now select
which partition to map to mount point either from a well known list of
Mount points or a manually created one.

Co-authored-by: Katerina Koukiou <kkoukiou@redhat.com>
---
 ui/webui/src/actions/storage-actions.js       |  25 ++
 ui/webui/src/apis/storage.js                  | 106 ++++++-
 ui/webui/src/components/AnacondaWizard.jsx    |  56 +++-
 ui/webui/src/components/Common.jsx            |   4 -
 ui/webui/src/components/app.jsx               |   3 +-
 .../components/review/ReviewConfiguration.jsx |  66 ++++-
 .../components/storage/CustomMountPoint.jsx   | 254 +++++++++++++++++
 .../components/storage/CustomMountPoint.scss  |   3 +
 .../storage/HelpAutopartOptions.jsx           |   8 +
 .../storage/InstallationDestination.jsx       |  44 +--
 .../storage/StorageConfiguration.jsx          |  37 ++-
 ui/webui/src/reducer.js                       |   5 +
 ui/webui/test/check-storage                   | 262 ++++++++++++++++++
 ui/webui/test/helpers/installer.py            |   5 +-
 ui/webui/test/helpers/review.py               |   9 +
 ui/webui/test/helpers/storage.py              |   9 +-
 ui/webui/test/reference                       |   2 +-
 17 files changed, 812 insertions(+), 86 deletions(-)
 create mode 100644 ui/webui/src/components/storage/CustomMountPoint.jsx
 create mode 100644 ui/webui/src/components/storage/CustomMountPoint.scss

diff --git a/ui/webui/src/actions/storage-actions.js b/ui/webui/src/actions/storage-actions.js
index df5b9cd7b21..0fe6e7583a7 100644
--- a/ui/webui/src/actions/storage-actions.js
+++ b/ui/webui/src/actions/storage-actions.js
@@ -18,12 +18,14 @@
 import cockpit from "cockpit";
 
 import {
+    gatherRequests,
     getAllDiskSelection,
     getDeviceData,
     getDevices,
     getDiskFreeSpace,
     getDiskTotalSpace,
     getFormatData,
+    getPartitioningMethod,
     getUsableDisks,
 } from "../apis/storage.js";
 
@@ -82,3 +84,26 @@ export const getDiskSelectionAction = () => {
         });
     };
 };
+
+export const getPartitioningDataAction = ({ requests, partitioning, updateOnly }) => {
+    return async function fetchUserThunk (dispatch) {
+        const props = { path: partitioning };
+        const convertRequests = reqs => reqs.map(request => Object.entries(request).reduce((acc, [key, value]) => ({ ...acc, [key]: value.v }), {}));
+
+        if (!updateOnly) {
+            props.method = await getPartitioningMethod({ partitioning });
+            if (props.method === "MANUAL") {
+                const reqs = await gatherRequests({ partitioning });
+
+                props.requests = convertRequests(reqs[0]);
+            }
+        } else {
+            props.requests = convertRequests(requests);
+        }
+
+        return dispatch({
+            type: "GET_PARTITIONING_DATA",
+            payload: { path: partitioning, partitioningData: props }
+        });
+    };
+};
diff --git a/ui/webui/src/apis/storage.js b/ui/webui/src/apis/storage.js
index 29adafd04c9..f8b881d12cf 100644
--- a/ui/webui/src/apis/storage.js
+++ b/ui/webui/src/apis/storage.js
@@ -16,7 +16,10 @@
  */
 import cockpit from "cockpit";
 
-import { getDiskSelectionAction } from "../actions/storage-actions.js";
+import {
+    getDiskSelectionAction,
+    getPartitioningDataAction
+} from "../actions/storage-actions.js";
 
 export class StorageClient {
     constructor (address) {
@@ -222,6 +225,26 @@ export const getPartitioningRequest = ({ partitioning }) => {
     );
 };
 
+/**
+ * @param {string} partitioning     DBus path to a partitioning
+ *
+ * @returns {Promise}               The partitioning method
+ */
+export const getPartitioningMethod = ({ partitioning }) => {
+    return (
+        new StorageClient().client.call(
+            partitioning,
+            "org.freedesktop.DBus.Properties",
+            "Get",
+            [
+                "org.fedoraproject.Anaconda.Modules.Storage.Partitioning",
+                "PartitioningMethod",
+            ]
+        )
+                .then(res => res[0].v)
+    );
+};
+
 /**
  * @returns {Promise}           The applied partitioning
  */
@@ -401,6 +424,37 @@ export const setSelectedDisks = ({ drives }) => {
     );
 };
 
+/*
+ * @param {string} partitioning DBus path to a partitioning
+ * @param {Array.<Object>} requests An array of request objects
+ */
+export const setManualPartitioningRequests = ({ partitioning, requests }) => {
+    return new StorageClient().client.call(
+        partitioning,
+        "org.freedesktop.DBus.Properties",
+        "Set",
+        [
+            "org.fedoraproject.Anaconda.Modules.Storage.Partitioning.Manual",
+            "Requests",
+            cockpit.variant("aa{sv}", requests)
+        ]
+    );
+};
+
+/**
+ * @param {string} partitioning DBus path to a partitioning
+ *
+ * @returns {Promise}           The gathered requests for manual partitioning
+ */
+export const gatherRequests = ({ partitioning }) => {
+    return new StorageClient().client.call(
+        partitioning,
+        "org.fedoraproject.Anaconda.Modules.Storage.Partitioning.Manual",
+        "GatherRequests",
+        []
+    );
+};
+
 export const startEventMonitorStorage = ({ dispatch }) => {
     return new StorageClient().client.subscribe(
         { },
@@ -409,10 +463,58 @@ export const startEventMonitorStorage = ({ dispatch }) => {
             case "PropertiesChanged":
                 if (args[0] === "org.fedoraproject.Anaconda.Modules.Storage.DiskSelection") {
                     dispatch(getDiskSelectionAction());
+                } else if (args[0] === "org.fedoraproject.Anaconda.Modules.Storage.Partitioning.Manual" && Object.hasOwn(args[1], "Requests")) {
+                    dispatch(getPartitioningDataAction({ requests: args[1].Requests.v, partitioning: path, updateOnly: true }));
+                } else if (args[0] === "org.fedoraproject.Anaconda.Modules.Storage" && Object.hasOwn(args[1], "CreatedPartitioning")) {
+                    const last = args[1].CreatedPartitioning.v.length - 1;
+                    dispatch(getPartitioningDataAction({ partitioning: args[1].CreatedPartitioning.v[last] }));
+                } else {
+                    console.debug(`Unhandled signal on ${path}: ${iface}.${signal} ${JSON.stringify(args)}`);
                 }
                 break;
             default:
-                console.debug(`Unhandled signal on ${path}: ${iface}.${signal}`);
+                console.debug(`Unhandled signal on ${path}: ${iface}.${signal} ${JSON.stringify(args)}`);
             }
         });
 };
+
+export const initDataStorage = ({ dispatch }) => {
+    return new StorageClient().client.call(
+        "/org/fedoraproject/Anaconda/Modules/Storage",
+        "org.freedesktop.DBus.Properties",
+        "Get",
+        [
+            "org.fedoraproject.Anaconda.Modules.Storage",
+            "CreatedPartitioning",
+        ]
+    )
+            .then(([res]) => {
+                if (res.v.length !== 0) {
+                    return res.v.forEach(path => dispatch(getPartitioningDataAction({ partitioning: path })));
+                }
+            });
+};
+
+export const applyStorage = async ({ partitioning, encrypt, encryptPassword, onFail, onSuccess }) => {
+    await setInitializeLabelsEnabled({ enabled: true });
+    await setBootloaderDrive({ drive: "" });
+
+    const [part] = partitioning ? [partitioning] : await createPartitioning({ method: "AUTOMATIC" });
+
+    if (encrypt) {
+        await partitioningSetEncrypt({ partitioning: part, encrypt });
+    }
+    if (encryptPassword) {
+        await partitioningSetPassphrase({ partitioning: part, passphrase: encryptPassword });
+    }
+
+    const tasks = await partitioningConfigureWithTask({ partitioning: part });
+
+    runStorageTask({
+        task: tasks[0],
+        onFail,
+        onSuccess: () => applyPartitioning({ partitioning: part })
+                .then(onSuccess)
+                .catch(onFail)
+    });
+};
diff --git a/ui/webui/src/components/AnacondaWizard.jsx b/ui/webui/src/components/AnacondaWizard.jsx
index 71f747e5e8b..858ebd3d761 100644
--- a/ui/webui/src/components/AnacondaWizard.jsx
+++ b/ui/webui/src/components/AnacondaWizard.jsx
@@ -15,7 +15,7 @@
  * along with This program; If not, see <http://www.gnu.org/licenses/>.
  */
 import cockpit from "cockpit";
-import React, { useState } from "react";
+import React, { useState, useMemo } from "react";
 
 import {
     ActionList,
@@ -32,8 +32,9 @@ import {
     WizardContextConsumer,
 } from "@patternfly/react-core";
 
-import { InstallationDestination, applyDefaultStorage } from "./storage/InstallationDestination.jsx";
+import { InstallationDestination } from "./storage/InstallationDestination.jsx";
 import { StorageConfiguration, getScenario, getDefaultScenario } from "./storage/StorageConfiguration.jsx";
+import { CustomMountPoint } from "./storage/CustomMountPoint.jsx";
 import { DiskEncryption, StorageEncryptionState } from "./storage/DiskEncryption.jsx";
 import { InstallationLanguage } from "./localization/InstallationLanguage.jsx";
 import { InstallationProgress } from "./installation/InstallationProgress.jsx";
@@ -41,7 +42,8 @@ import { ReviewConfiguration, ReviewConfigurationConfirmModal } from "./review/R
 import { exitGui } from "../helpers/exit.js";
 import { usePageLocation } from "hooks";
 import {
-    resetPartitioning
+    applyStorage,
+    resetPartitioning,
 } from "../apis/storage.js";
 
 const _ = cockpit.gettext;
@@ -53,6 +55,11 @@ export const AnacondaWizard = ({ dispatch, storageData, localizationData, onAddE
     const [storageEncryption, setStorageEncryption] = useState(new StorageEncryptionState());
     const [showPassphraseScreen, setShowPassphraseScreen] = useState(false);
     const [storageScenarioId, setStorageScenarioId] = useState(window.sessionStorage.getItem("storage-scenario-id") || getDefaultScenario().id);
+    const lastPartitioning = useMemo(() => {
+        const lastPartitioningKey = Object.keys(storageData.partitioning || {}).find(path => parseInt(path[path.length - 1]) === Object.keys(storageData.partitioning).length);
+
+        return storageData.partitioning?.[lastPartitioningKey];
+    }, [storageData.partitioning]);
 
     // On live media rebooting the system will actually shut it off
     const isBootIso = conf["Installation System"].type === "BOOT_ISO";
@@ -75,18 +82,26 @@ export const AnacondaWizard = ({ dispatch, storageData, localizationData, onAddE
                 label: _("Storage devices")
             }, {
                 component: StorageConfiguration,
-                data: { selectedDisks: storageData.diskSelection.selectedDisks },
+                data: { deviceData: storageData.devices, diskSelection: storageData.diskSelection },
                 id: "storage-configuration",
                 label: _("Storage configuration")
+            }, {
+                component: CustomMountPoint,
+                data: { deviceData: storageData.devices, partitioningData: lastPartitioning, dispatch },
+                id: "custom-mountpoint",
+                label: _("Custom mount point"),
+                isHidden: storageScenarioId !== "custom-mount-point"
+
             }, {
                 component: DiskEncryption,
                 id: "disk-encryption",
-                label: _("Disk encryption")
+                label: _("Disk encryption"),
+                isHidden: storageScenarioId === "custom-mount-point"
             }]
         },
         {
             component: ReviewConfiguration,
-            data: { deviceData: storageData.devices, diskSelection: storageData.diskSelection },
+            data: { deviceData: storageData.devices, diskSelection: storageData.diskSelection, requests: lastPartitioning ? lastPartitioning.requests : null },
             id: "installation-review",
             label: _("Review and install"),
         },
@@ -101,7 +116,9 @@ export const AnacondaWizard = ({ dispatch, storageData, localizationData, onAddE
         for (const step of steps) {
             if (step.steps) {
                 for (const childStep of step.steps) {
-                    stepIds.push(childStep.id);
+                    if (childStep?.isHidden !== true) {
+                        stepIds.push(childStep.id);
+                    }
                 }
             } else {
                 stepIds.push(step.id);
@@ -126,7 +143,7 @@ export const AnacondaWizard = ({ dispatch, storageData, localizationData, onAddE
     };
 
     const createSteps = (stepsOrder) => {
-        const steps = stepsOrder.map((s, idx) => {
+        const steps = stepsOrder.filter(s => !s.isHidden).map(s => {
             let step = ({
                 id: s.id,
                 name: s.label,
@@ -181,6 +198,7 @@ export const AnacondaWizard = ({ dispatch, storageData, localizationData, onAddE
               id="installation-wizard"
               footer={<Footer
                 isFormValid={isFormValid}
+                partitioning={lastPartitioning?.path}
                 setIsFormValid={setIsFormValid}
                 setStepNotification={setStepNotification}
                 isInProgress={isInProgress}
@@ -209,6 +227,7 @@ const Footer = ({
     setIsFormValid,
     setStepNotification,
     isInProgress,
+    partitioning,
     setIsInProgress,
     storageEncryption,
     showPassphraseScreen,
@@ -230,7 +249,7 @@ const Footer = ({
             }
             setIsInProgress(true);
 
-            applyDefaultStorage({
+            applyStorage({
                 onFail: ex => {
                     console.error(ex);
                     setIsInProgress(false);
@@ -249,6 +268,25 @@ const Footer = ({
             });
         } else if (activeStep.id === "installation-review") {
             setNextWaitsConfirmation(true);
+        } else if (activeStep.id === "custom-mountpoint") {
+            setIsInProgress(true);
+
+            applyStorage({
+                partitioning,
+                onFail: ex => {
+                    console.error(ex);
+                    setIsInProgress(false);
+                    setStepNotification({ step: activeStep.id, ...ex });
+                },
+                onSuccess: () => {
+                    onNext();
+
+                    // Reset the state after the onNext call. Otherwise,
+                    // React will try to render the current step again.
+                    setIsInProgress(false);
+                    setStepNotification();
+                },
+            });
         } else {
             onNext();
         }
diff --git a/ui/webui/src/components/Common.jsx b/ui/webui/src/components/Common.jsx
index 1a23f12d2da..ad4b88d66be 100644
--- a/ui/webui/src/components/Common.jsx
+++ b/ui/webui/src/components/Common.jsx
@@ -22,10 +22,6 @@ export const AddressContext = createContext("");
 export const ConfContext = createContext();
 export const LanguageContext = createContext("");
 
-export const sleep = ({ seconds }) => {
-    return new Promise(resolve => setTimeout(resolve, seconds * 1000));
-};
-
 export const FormGroupHelpPopover = ({ helpContent }) => {
     return (
         <Popover
diff --git a/ui/webui/src/components/app.jsx b/ui/webui/src/components/app.jsx
index f2b56104784..c3cd583d2f8 100644
--- a/ui/webui/src/components/app.jsx
+++ b/ui/webui/src/components/app.jsx
@@ -32,7 +32,7 @@ import { HelpDrawer } from "./HelpDrawer.jsx";
 
 import { BossClient } from "../apis/boss.js";
 import { LocalizationClient } from "../apis/localization.js";
-import { StorageClient, startEventMonitorStorage } from "../apis/storage.js";
+import { StorageClient, initDataStorage, startEventMonitorStorage } from "../apis/storage.js";
 import { PayloadsClient } from "../apis/payloads";
 
 import { readBuildstamp, getIsFinal } from "../helpers/betanag.js";
@@ -62,6 +62,7 @@ export const Application = () => {
 
             setAddress(address);
 
+            initDataStorage({ dispatch });
             startEventMonitorStorage({ dispatch });
         });
 
diff --git a/ui/webui/src/components/review/ReviewConfiguration.jsx b/ui/webui/src/components/review/ReviewConfiguration.jsx
index 02b1a4e5883..872c02f36a5 100644
--- a/ui/webui/src/components/review/ReviewConfiguration.jsx
+++ b/ui/webui/src/components/review/ReviewConfiguration.jsx
@@ -26,6 +26,7 @@ import {
     DataListToggle,
     DataListItemRow, DataListItemCells,
     DataListCell,
+    DataListContent,
     DescriptionList, DescriptionListGroup,
     DescriptionListTerm, DescriptionListDescription,
     ExpandableSection,
@@ -37,6 +38,7 @@ import {
 import {
     getAppliedPartitioning,
     getPartitioningRequest,
+    getPartitioningMethod,
 } from "../../apis/storage.js";
 
 import {
@@ -45,6 +47,9 @@ import {
 import { AnacondaPage } from "../AnacondaPage.jsx";
 
 import { getScenario } from "../storage/StorageConfiguration.jsx";
+import { CheckCircleIcon } from "@patternfly/react-icons";
+
+import { ListingTable } from "cockpit-components-table.jsx";
 
 import "./ReviewConfiguration.scss";
 
@@ -68,15 +73,31 @@ export const ReviewDescriptionList = ({ children }) => {
     );
 };
 
-const DeviceRow = ({ name, data }) => {
+const DeviceRow = ({ data, requests }) => {
+    const name = data.name.v;
     const [isExpanded, setIsExpanded] = useState(false);
 
+    const renderRow = row => {
+        const iconColumn = row.reformat.v ? <CheckCircleIcon /> : null;
+        return {
+            props: { key: row["device-spec"] },
+            columns: [
+                { title: row["device-spec"] },
+                { title: row["format-type"] },
+                { title: row["mount-point"] },
+                { title: iconColumn },
+            ]
+        };
+    };
+
+    const partitionRows = requests?.filter(req => req["device-spec"].includes(name)).map(renderRow) || [];
+
     return (
         <DataListItem id={`data-list-${name}`} isExpanded={isExpanded} key={name}>
             <DataListItemRow>
                 <DataListToggle
-                  buttonProps={{ isDisabled: true }}
-                  onClick={() => setIsExpanded(!isExpanded)}
+                  buttonProps={{ isDisabled: requests === null }}
+                  onClick={() => requests !== null ? setIsExpanded(!isExpanded) : {}}
                   isExpanded={isExpanded}
                   id={name + "-expander"}
                 />
@@ -94,11 +115,20 @@ const DeviceRow = ({ name, data }) => {
                   ]}
                 />
             </DataListItemRow>
+            <DataListContent isHidden={!isExpanded}>
+                <ListingTable
+                  id="partitions-table"
+                  aria-label={_("Disk partitions")}
+                  emptyCaption={_("No partitions found")}
+                  variant="compact"
+                  columns={[_("Partition"), _("Format type"), _("Mount point"), _("Reformat")]}
+                  rows={partitionRows} />
+            </DataListContent>
         </DataListItem>
     );
 };
 
-export const ReviewConfiguration = ({ deviceData, diskSelection, idPrefix, storageScenarioId }) => {
+export const ReviewConfiguration = ({ deviceData, diskSelection, requests, idPrefix, storageScenarioId }) => {
     const [systemLanguage, setSystemLanguage] = useState();
     const [encrypt, setEncrypt] = useState();
     const [showLanguageSection, setShowLanguageSection] = useState(true);
@@ -112,8 +142,11 @@ export const ReviewConfiguration = ({ deviceData, diskSelection, idPrefix, stora
         };
         const initializeEncrypt = async () => {
             const partitioning = await getAppliedPartitioning().catch(console.error);
-            const request = await getPartitioningRequest({ partitioning }).catch(console.error);
-            setEncrypt(request.encrypted.v);
+            const method = await getPartitioningMethod({ partitioning }).catch(console.error);
+            if (method === "AUTOMATIC") {
+                const request = await getPartitioningRequest({ partitioning }).catch(console.error);
+                setEncrypt(request.encrypted.v);
+            }
         };
         initializeLanguage();
         initializeEncrypt();
@@ -168,19 +201,22 @@ export const ReviewConfiguration = ({ deviceData, diskSelection, idPrefix, stora
                         <DescriptionListDescription className="description-list-description" id={idPrefix + "-target-system-mode"}>
                             {getScenario(storageScenarioId).label}
                         </DescriptionListDescription>
-                        <DescriptionListTerm className="description-list-term">
-                            {_("Disk Encryption")}
-                        </DescriptionListTerm>
-                        <DescriptionListDescription className="description-list-description" id={idPrefix + "-target-system-encrypt"}>
-                            {encrypt ? _("Enabled") : _("Disabled")}
-                        </DescriptionListDescription>
+                        {storageScenarioId !== "custom-mount-point" &&
+                        <>
+                            <DescriptionListTerm className="description-list-term">
+                                {_("Disk Encryption")}
+                            </DescriptionListTerm>
+                            <DescriptionListDescription className="description-list-description" id={idPrefix + "-target-system-encrypt"}>
+                                {encrypt ? _("Enabled") : _("Disabled")}
+                            </DescriptionListDescription>
+                        </>}
                     </DescriptionListGroup>
                 </ReviewDescriptionList>
                 <Title className="storage-devices-configuration-title" headingLevel="h4">{_("Storage devices and configurations")}</Title>
                 <DataList isCompact>
-                    {diskSelection.selectedDisks.map(deviceName =>
-                        <DeviceRow key={deviceName} name={deviceName} data={deviceData[deviceName]} />
-                    )}
+                    {diskSelection.selectedDisks.map(disk => {
+                        return <DeviceRow key={disk} data={deviceData[disk]} requests={storageScenarioId === "custom-mount-point" ? requests : null} />;
+                    })}
                 </DataList>
             </ExpandableSection>
         </AnacondaPage>
diff --git a/ui/webui/src/components/storage/CustomMountPoint.jsx b/ui/webui/src/components/storage/CustomMountPoint.jsx
new file mode 100644
index 00000000000..bc895428fa8
--- /dev/null
+++ b/ui/webui/src/components/storage/CustomMountPoint.jsx
@@ -0,0 +1,254 @@
+/*
+ * Copyright (C) 2023 Red Hat, Inc.
+ *
+ * This program is free software; you can redistribute it and/or modify it
+ * under the terms of the GNU Lesser General Public License as published by
+ * the Free Software Foundation; either version 2.1 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful, but
+ * WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+ * Lesser General Public License for more details.
+ *
+ * You should have received a copy of the GNU Lesser General Public License
+ * along with This program; If not, see <http://www.gnu.org/licenses/>.
+ */
+
+import cockpit from "cockpit";
+import React, { useState, useEffect } from "react";
+
+import {
+    Alert,
+    Checkbox,
+    Flex,
+    HelperText,
+    HelperTextItem,
+    Popover,
+    Select,
+    SelectOption,
+    SelectVariant,
+    TextContent,
+} from "@patternfly/react-core";
+import { HelpIcon } from "@patternfly/react-icons";
+
+import { ListingTable } from "cockpit-components-table.jsx";
+import { EmptyStatePanel } from "cockpit-components-empty-state.jsx";
+import { AnacondaPage } from "../AnacondaPage.jsx";
+
+import {
+    createPartitioning,
+    setBootloaderDrive,
+    setManualPartitioningRequests,
+} from "../../apis/storage.js";
+
+import "./CustomMountPoint.scss";
+
+const _ = cockpit.gettext;
+
+const MountPointSelect = ({ partition, requests, mountpoint, handleOnSelect, isDisabled }) => {
+    // TODO: extend?
+    const defaultOptions = [
+        { value: "/", name: "root" },
+        { value: "/boot", name: "boot" },
+        { value: "/home", name: "home" },
+    ];
+
+    const duplicatedMountPoint = mountpoint => {
+        return requests.filter(r => r["mount-point"] === mountpoint).length > 1;
+    };
+
+    const [isOpen, setIsOpen] = useState(false);
+    // Filter selected
+    const options = defaultOptions.filter(val => val.value !== mountpoint);
+    if (mountpoint !== "") {
+        options.push({ value: mountpoint });
+    }
+
+    return (
+        <Flex direction={{ default: "column" }} spaceItems={{ default: "spaceItemsNone" }}>
+            <Select
+              variant={SelectVariant.typeahead}
+              className="mountpoint-select"
+              typeAheadAriaLabel={_("Select a mount point")}
+              selections={mountpoint || null}
+              isOpen={isOpen}
+              onToggle={isOpen => setIsOpen(isOpen)}
+              onSelect={(_evt, selection, _) => { setIsOpen(false); handleOnSelect(selection, partition) }}
+              isDisabled={isDisabled}
+              isCreatable
+              shouldResetOnSelect
+            >
+                {options.map((option, index) => (
+                    <SelectOption
+                      key={index}
+                      className={`select-option-${option.name}`}
+                      value={option.value}
+                    />
+                ))}
+            </Select>
+            {mountpoint !== "" && duplicatedMountPoint(mountpoint) &&
+                <HelperText>
+                    <HelperTextItem variant="error" hasIcon>
+                        {_("Duplicate mount point.")}
+                    </HelperTextItem>
+                </HelperText>}
+        </Flex>
+    );
+};
+
+const MountpointCheckbox = ({ reformat, isRootMountPoint, handleCheckReFormat, partition, isDisabled }) => {
+    return (
+        <Flex>
+            <Checkbox
+              label={_("Format")}
+              isChecked={reformat}
+              isDisabled={isRootMountPoint || isDisabled}
+              onChange={(checked, _) => handleCheckReFormat(checked, partition)}
+              id={partition}
+            />
+            {isRootMountPoint &&
+                <Popover
+                  bodyContent={_("The root partition is always re-formatted by the installer.")}
+                  showClose={false}>
+                    <HelpIcon />
+                </Popover>}
+        </Flex>
+    );
+};
+
+export const CustomMountPoint = ({ deviceData, partitioningData, dispatch, idPrefix, setIsFormValid, onAddErrorNotification, toggleContextHelp, stepNotification }) => {
+    const [creatingPartitioning, setCreatingPartitioning] = useState(true);
+    useEffect(() => {
+        const validateMountPoints = requests => {
+            if (requests) {
+                const mountPoints = requests.map(r => r["mount-point"]);
+
+                setIsFormValid(new Set(mountPoints).size === mountPoints.length);
+            }
+        };
+
+        validateMountPoints(partitioningData?.requests);
+    }, [partitioningData?.requests, setIsFormValid]);
+
+    useEffect(() => {
+        if (partitioningData?.method === "MANUAL") {
+            setCreatingPartitioning(false);
+        } else {
+            /* Reset the bootloader drive before we schedule partitions
+             * The bootloader drive is automatically set during the partitioning, so
+             * make sure we always reset the previous value before we run another one,
+             * so it can be automatically set again based on the current disk selection.
+             * Otherwise, the partitioning can fail with an error.
+             */
+            setBootloaderDrive({ drive: "" })
+                    .then(() => createPartitioning({ method: "MANUAL" }))
+                    .then(() => setCreatingPartitioning(false));
+        }
+    }, [partitioningData?.method]);
+
+    if (creatingPartitioning) {
+        return <EmptyStatePanel loading />;
+    }
+
+    const requestsToDbus = requests => {
+        return requests.map(row => {
+            return {
+                "device-spec": cockpit.variant("s", row["device-spec"]),
+                "format-type": cockpit.variant("s", row["format-type"]),
+                "mount-point": cockpit.variant("s", row["mount-point"]),
+                reformat: cockpit.variant("b", row.reformat),
+            };
+        });
+    };
+
+    const handleOnSelect = (selection, device) => {
+        const newRequests = partitioningData.requests.map(row => {
+            const newRow = { ...row };
+            if (row["device-spec"] === device) {
+                // Reset reformat option when changing from /
+                if (row["mount-point"] === "/" && selection !== row["mount-point"] && row.reformat) {
+                    newRow.reformat = false;
+                }
+
+                // Always reformat the root partition
+                if (selection === "/") {
+                    newRow.reformat = true;
+                }
+
+                newRow["mount-point"] = selection;
+            }
+            return newRow;
+        });
+        setManualPartitioningRequests({ partitioning: partitioningData.path, requests: requestsToDbus(newRequests) }).catch(onAddErrorNotification);
+    };
+
+    const handleCheckReFormat = (checked, mountpoint) => {
+        const newRequests = partitioningData.requests.map(row => {
+            const newRow = { ...row };
+            if (row["device-spec"] === mountpoint) {
+                newRow.reformat = checked;
+            }
+            return newRow;
+        });
+        setManualPartitioningRequests({ partitioning: partitioningData.path, requests: requestsToDbus(newRequests) }).catch(onAddErrorNotification);
+    };
+
+    const renderRow = row => {
+        const isRootMountPoint = row["mount-point"] === "/";
+        const isNotMountPoint = ["biosboot"].includes(row["format-type"]);
+        // TODO: Anaconda does not support formatting btrfs yet
+        const isBtrfs = row["format-type"] === "btrfs";
+        return {
+            props: { key: row["device-spec"] },
+            columns: [
+                { title: row["device-spec"] },
+                { title: row["format-type"] },
+                {
+                    title: (
+                        <MountPointSelect
+                          handleOnSelect={handleOnSelect}
+                          isDisabled={isNotMountPoint}
+                          mountpoint={row["mount-point"]}
+                          partition={row["device-spec"]}
+                          requests={partitioningData.requests}
+                        />
+                    )
+                },
+                {
+                    title: (
+                        <MountpointCheckbox
+                          reformat={row.reformat}
+                          isRootMountPoint={isRootMountPoint}
+                          partition={row["device-spec"]}
+                          handleCheckReFormat={handleCheckReFormat}
+                          isDisabled={isNotMountPoint || isBtrfs}
+                        />
+                    )
+                },
+            ],
+        };
+    };
+
+    const partitionRows = partitioningData?.requests?.map(renderRow) || [];
+
+    return (
+        <AnacondaPage title={_("Select a custom mount point")}>
+            {stepNotification && stepNotification.step === "custom-mountpoint" &&
+                <Alert
+                  isInline
+                  title={stepNotification.message}
+                  variant="danger"
+                />}
+            <TextContent>
+                {_("We discovered your partitioned and formatted filesystems, so now you can select your own custom mount point for each filesystem.")}
+            </TextContent>
+            <ListingTable
+              aria-label={_("Partitions")}
+              columns={[_("Partition"), _("Format type"), _("Mount point"), _("Reformat")]}
+              emptyCaption={_("No partitions")}
+              id="custom-mountpoint-table"
+              rows={partitionRows} />
+        </AnacondaPage>
+    );
+};
diff --git a/ui/webui/src/components/storage/CustomMountPoint.scss b/ui/webui/src/components/storage/CustomMountPoint.scss
new file mode 100644
index 00000000000..4df75f50ed8
--- /dev/null
+++ b/ui/webui/src/components/storage/CustomMountPoint.scss
@@ -0,0 +1,3 @@
+.mountpoint-select.pf-c-select {
+    width: 160px;
+}
diff --git a/ui/webui/src/components/storage/HelpAutopartOptions.jsx b/ui/webui/src/components/storage/HelpAutopartOptions.jsx
index 565bad78e92..bce2278be5a 100644
--- a/ui/webui/src/components/storage/HelpAutopartOptions.jsx
+++ b/ui/webui/src/components/storage/HelpAutopartOptions.jsx
@@ -32,3 +32,11 @@ export const helpUseFreeSpace = (
         </Text>
     </TextContent>
 );
+
+export const helpCustomMountPoint = (
+    <TextContent>
+        <Text component={TextVariants.p}>
+            {_("This option requires that the selected device has formated partitions.")}
+        </Text>
+    </TextContent>
+);
diff --git a/ui/webui/src/components/storage/InstallationDestination.jsx b/ui/webui/src/components/storage/InstallationDestination.jsx
index 096381a9ec5..0162717ed50 100644
--- a/ui/webui/src/components/storage/InstallationDestination.jsx
+++ b/ui/webui/src/components/storage/InstallationDestination.jsx
@@ -51,18 +51,11 @@ import { ListingTable } from "cockpit-components-table.jsx";
 import { helpStorageOptions } from "./HelpStorageOptions.jsx";
 
 import {
-    applyPartitioning,
-    createPartitioning,
     getRequiredDeviceSize,
-    partitioningConfigureWithTask,
     resetPartitioning,
     runStorageTask,
     scanDevicesWithTask,
-    setInitializeLabelsEnabled,
     setSelectedDisks,
-    setBootloaderDrive,
-    partitioningSetPassphrase,
-    partitioningSetEncrypt,
 } from "../../apis/storage.js";
 
 import {
@@ -70,9 +63,6 @@ import {
 } from "../../apis/payloads";
 import { getDevicesAction, getDiskSelectionAction } from "../../actions/storage-actions.js";
 
-import {
-    sleep,
-} from "../Common.jsx";
 import { AnacondaPage } from "../AnacondaPage.jsx";
 
 const _ = cockpit.gettext;
@@ -263,7 +253,7 @@ const LocalStandardDisks = ({ deviceData, diskSelection, dispatch, idPrefix, set
               setSelectedDisks({ drives: [] });
               scanDevicesWithTask()
                       .then(res => {
-                          runStorageTask({
+                          return runStorageTask({
                               task: res[0],
                               onSuccess: () => resetPartitioning().then(() => {
                                   dispatch(getDevicesAction());
@@ -507,35 +497,3 @@ export const InstallationDestination = ({ deviceData, diskSelection, dispatch, i
         </AnacondaPage>
     );
 };
-
-// TODO move to the right place (new or StorageConfiguration) when renaming this file
-// TODO migrate to async
-export const applyDefaultStorage = ({ onFail, onSuccess, encrypt, encryptPassword }) => {
-    console.log(`applyDefaultStorage, encrypt: ${encrypt}`);
-    let partitioning;
-    // CLEAR_PARTITIONS_ALL = 1
-    return sleep({ seconds: 2 })
-            .then(() => setInitializeLabelsEnabled({ enabled: true }))
-            .then(() => setBootloaderDrive({ drive: "" }))
-            .then(() => createPartitioning({ method: "AUTOMATIC" }))
-            .then(res => {
-                partitioning = res[0];
-                return partitioningSetEncrypt({ partitioning, encrypt });
-            })
-            .then(() => {
-                return partitioningSetPassphrase({ partitioning, passphrase: encryptPassword });
-            })
-            .then(() => partitioningConfigureWithTask({ partitioning }))
-            .then(tasks => {
-                runStorageTask({
-                    task: tasks[0],
-                    onSuccess: () => (
-                        applyPartitioning({ partitioning })
-                                .then(onSuccess)
-                                .catch(onFail)
-                    ),
-                    onFail
-                });
-            })
-            .catch(onFail);
-};
diff --git a/ui/webui/src/components/storage/StorageConfiguration.jsx b/ui/webui/src/components/storage/StorageConfiguration.jsx
index 2eb2369b53a..55000061fb0 100644
--- a/ui/webui/src/components/storage/StorageConfiguration.jsx
+++ b/ui/webui/src/components/storage/StorageConfiguration.jsx
@@ -49,7 +49,7 @@ import { HelpIcon } from "@patternfly/react-icons";
 
 import ExclamationTriangleIcon from "@patternfly/react-icons/dist/esm/icons/exclamation-triangle-icon";
 
-import { helpEraseAll, helpUseFreeSpace } from "./HelpAutopartOptions.jsx";
+import { helpEraseAll, helpUseFreeSpace, helpCustomMountPoint } from "./HelpAutopartOptions.jsx";
 import { AnacondaPage } from "../AnacondaPage.jsx";
 import { EmptyStatePanel } from "cockpit-components-empty-state.jsx";
 
@@ -141,6 +141,16 @@ const checkUseFreeSpace = async (selectedDisks, requiredSize) => {
     return availability;
 };
 
+const checkCustomMountPoint = async (selectedDisks, requiredSize, deviceData) => {
+    const availability = new AvailabilityState();
+
+    if (!selectedDisks.some(device => deviceData[device].children.v.some(child => deviceData[child].type.v === "partition"))) {
+        availability.available = false;
+        availability.reason = _("No existing partitions on the selected disks.");
+    }
+    return availability;
+};
+
 const scenarios = [{
     id: "erase-all",
     label: _("Erase data and install"),
@@ -169,6 +179,20 @@ const scenarios = [{
     dialogTitleIconVariant: "",
     dialogWarningTitle: _("Install on the free space?"),
     dialogWarning: _("The installation will use the available space on your devices and will not erase any device data."),
+}, {
+    id: "custom-mount-point",
+    label: _("Mount point assignment"),
+    default: false,
+    detail: helpCustomMountPoint,
+    check: checkCustomMountPoint,
+    // CLEAR_PARTITIONS_NONE = 0
+    initializationMode: 0,
+    buttonLabel: _("Apply mount point assignment and install"),
+    buttonVariant: "danger",
+    screenWarnings: "",
+    dialogTitleIconVariant: "",
+    dialogWarningTitle: _("Install on the custom mount points?"),
+    dialogWarning: _("The installation will use your configured partitioning layout."),
 }];
 
 export const getScenario = (scenarioId) => {
@@ -222,7 +246,7 @@ const predefinedStorageInfo = (
 );
 
 // TODO add aria items
-const GuidedPartitioning = ({ idPrefix, scenarios, selectedDisks, storageScenarioId, setStorageScenarioId, setIsFormValid }) => {
+const GuidedPartitioning = ({ deviceData, selectedDisks, idPrefix, scenarios, storageScenarioId, setStorageScenarioId, setIsFormValid }) => {
     const [selectedScenario, setSelectedScenario] = useState();
     const [scenarioAvailability, setScenarioAvailability] = useState(Object.fromEntries(
         scenarios.map((s) => [s.id, new AvailabilityState()])
@@ -237,7 +261,7 @@ const GuidedPartitioning = ({ idPrefix, scenarios, selectedDisks, storageScenari
             let selectedScenarioId = "";
             let availableScenarioExists = false;
             for await (const scenario of scenarios) {
-                const availability = await scenario.check(selectedDisks, requiredSize).catch(console.error);
+                const availability = await scenario.check(selectedDisks, requiredSize, deviceData).catch(console.error);
                 setScenarioAvailability(ss => ({ ...ss, [scenario.id]: availability }));
                 if (availability.available) {
                     availableScenarioExists = true;
@@ -256,7 +280,7 @@ const GuidedPartitioning = ({ idPrefix, scenarios, selectedDisks, storageScenari
         };
 
         updateScenarioState(scenarios);
-    }, [scenarios, setIsFormValid, storageScenarioId, selectedDisks]);
+    }, [scenarios, deviceData, selectedDisks, setIsFormValid, storageScenarioId]);
 
     useEffect(() => {
         const applyScenario = async (scenarioId) => {
@@ -366,16 +390,17 @@ const GuidedPartitioning = ({ idPrefix, scenarios, selectedDisks, storageScenari
     );
 };
 
-export const StorageConfiguration = ({ idPrefix, selectedDisks, setIsFormValid, storageScenarioId, setStorageScenarioId }) => {
+export const StorageConfiguration = ({ deviceData, diskSelection, idPrefix, setIsFormValid, storageScenarioId, setStorageScenarioId }) => {
     return (
         <AnacondaPage title={_("Select a storage configuration")}>
             <TextContent>
                 {_("Configure the partitioning scheme to be used on the selected disks.")}
             </TextContent>
             <GuidedPartitioning
+              deviceData={deviceData}
+              selectedDisks={diskSelection.selectedDisks}
               idPrefix={idPrefix}
               scenarios={scenarios}
-              selectedDisks={selectedDisks}
               setIsFormValid={setIsFormValid}
               storageScenarioId={storageScenarioId}
               setStorageScenarioId={setStorageScenarioId}
diff --git a/ui/webui/src/reducer.js b/ui/webui/src/reducer.js
index d02214d76c1..e24d39168af 100644
--- a/ui/webui/src/reducer.js
+++ b/ui/webui/src/reducer.js
@@ -25,6 +25,7 @@ export const storageInitialState = {
         selectedDisks: [],
         ignoredDisks: []
     },
+    partitioning: {}
 };
 
 /* Initial state for the localization store substate */
@@ -70,6 +71,10 @@ export const storageReducer = (state = storageInitialState, action) => {
         return { ...state, devices: { ...state.devices, ...action.payload.deviceData } };
     } else if (action.type === "GET_DISK_SELECTION") {
         return { ...state, diskSelection: action.payload.diskSelection };
+    } else if (action.type === "GET_PARTITIONING_DATA") {
+        const partitioning = { ...state.partitioning[action.payload.path], ...action.payload.partitioningData };
+
+        return { ...state, partitioning: { ...state.partitioning, [action.payload.path]: partitioning } };
     } else {
         return state;
     }
diff --git a/ui/webui/test/check-storage b/ui/webui/test/check-storage
index b6ead85e88a..51db386c6cd 100755
--- a/ui/webui/test/check-storage
+++ b/ui/webui/test/check-storage
@@ -19,6 +19,7 @@ import anacondalib
 
 from installer import Installer
 from storage import Storage
+from review import Review
 from testlib import nondestructive, test_main  # pylint: disable=import-error
 
 
@@ -320,5 +321,266 @@ class TestStorageExtraDisks(anacondalib.VirtInstallMachineCase):
             wait_animations=False,
         )
 
+class TestStorageMountPoints(anacondalib.VirtInstallMachineCase):
+
+    def select_mountpoint(self, i ,s, disks, expected_partitions):
+        i.open()
+        i.next()
+        s.rescan_disks()
+        for disk in disks:
+            dev = disk.split('/')[-1]
+            s.select_disk(dev)
+            s.set_expand_disk_row(dev, True)
+
+        for disk, partitions in expected_partitions.items():
+            dev = disk.split('/')[-1]
+            for partition in partitions:
+                s.check_disk_partition(dev, partition)
+
+        i.next()
+        s.set_partitioning("custom-mount-point")
+
+        i.next(next_page=i.steps.CUSTOM_MOUNT_POINT)
+
+    def select_from_dropdown(self, row, name, mountpoint, create=False):
+        b = self.browser
+        if create:
+            b.set_input_text(f"#custom-mountpoint-table tbody tr:nth-child({row}) td[data-label='Mount point'] .pf-c-form-control.pf-c-select__toggle-typeahead", mountpoint)
+            b.click(f"#custom-mountpoint-table tbody tr:nth-child({row}) td[data-label='Mount point'] button.pf-c-select__menu-item")
+        else:
+            b.click(f"#custom-mountpoint-table tbody tr:nth-child({row}) td[data-label='Mount point'] .pf-c-select__toggle button")
+            b.click(f"#custom-mountpoint-table tbody tr:nth-child({row}) td[data-label='Mount point'] .pf-c-select__menu-item.select-option-{name}")
+        b.wait_val(f"#custom-mountpoint-table tbody tr:nth-child({row}) td[data-label='Mount point'] .pf-c-select__toggle-typeahead", mountpoint)
+
+    def check_format_type(self, row, format_type):
+        self.browser.wait_in_text(f"#custom-mountpoint-table tbody tr:nth-child({row}) td[data-label='Format type']", format_type)
+
+    def select_reformat(self, row):
+        self.browser.set_checked(f"#custom-mountpoint-table tbody tr:nth-child({row}) td[data-label='Reformat'] input", True)
+
+    def check_reformat(self, row, checked):
+        checked_selector = "input:checked" if checked else "input:not(:checked)"
+        self.browser.wait_visible(f"#custom-mountpoint-table tbody tr:nth-child({row}) td[data-label='Reformat'] {checked_selector}")
+
+    def check_select_disabled(self, row):
+        self.browser.wait_visible(f"#custom-mountpoint-table tbody tr:nth-child({row}) td[data-label='Mount point'] .pf-c-select__toggle.pf-m-disabled")
+
+    def check_reformat_disabled(self, row):
+        self.browser.wait_visible(f"#custom-mountpoint-table tbody tr:nth-child({row}) td[data-label='Reformat'] .pf-c-check__input:disabled")
+
+    def assert_inline_error(self, text):
+        self.browser.wait_in_text(".pf-c-alert.pf-m-inline.pf-m-danger", text)
+
+    def udevadm_settle(self):
+        # Workaround to not have any empty mountpoint labels
+        self.machine.execute("""
+        udevadm trigger
+        udevadm settle --timeout=120
+        """)
+
+    def testBasic(self):
+        b = self.browser
+        m = self.machine
+        i = Installer(b, m)
+        s = Storage(b, m)
+        r = Review(b)
+
+        disk = "/dev/vda"
+        m.execute(f"""
+        sgdisk --zap-all {disk}
+        sgdisk --new=0:0:+1MiB -t 0:ef02 {disk}
+        sgdisk --new=0:0:+1GiB {disk}
+        sgdisk --new=0:0:+10GiB {disk}
+        sgdisk --new=0:0:0 {disk}
+        mkfs.ext4 {disk}2
+        mkfs.xfs {disk}3
+        mkfs.btrfs {disk}4
+        """)
+
+        self.udevadm_settle()
+        partitions = {}
+        partitions[disk] = [f"{disk}2", f"{disk}3", f"{disk}4"]
+        self.select_mountpoint(i, s, [disk], partitions)
+
+        # verify gathered requests
+        self.check_format_type(1, "biosboot")
+        self.check_select_disabled(1)
+        self.check_reformat_disabled(1)
+
+        self.check_format_type(2, "ext4")
+        self.select_from_dropdown(2, "boot", "/boot")
+        self.check_reformat(2, False)
+
+        self.check_format_type(3, "xfs")
+        self.select_from_dropdown(3, "root", "/")
+        self.check_reformat(3, True)
+
+        self.check_format_type(4, "btrfs")
+        self.select_from_dropdown(4, "home", "/home")
+        self.check_reformat(4, False)
+        self.check_reformat_disabled(4)
+
+        # Toggle reformat option
+        self.select_reformat(2)
+        self.check_reformat(2, True)
+
+        b.assert_pixels(
+            "#app",
+            "custom-mountpoint-table",
+            wait_animations=False,
+        )
+
+        b.click("#installation-next-btn")
+        page = i.steps.REVIEW
+        self.browser.wait_not_present("#installation-destination-next-spinner")
+        self.browser.wait_js_cond(f'window.location.hash === "#/{page}"')
+
+        # verify review screen
+        disk = "vda"
+        r.check_disk_label(disk, disk)
+        r.expand_disk_table(disk)
+
+        row = 1
+        r.check_disk_row(disk, row, "Partition", f"/dev/vda{row}")
+        r.check_disk_row(disk, row, "Format type", "biosboot")
+        row = 2
+        r.check_disk_row(disk, row, "Partition", f"/dev/vda{row}")
+        r.check_disk_row(disk, row, "Format type", "ext4")
+        r.check_disk_row(disk, row, "Mount point", "/boot")
+        r.check_disk_row_reformatted(disk, row, "Reformat")
+        row = 3
+        r.check_disk_row(disk, row, "Partition", f"/dev/vda{row}")
+        r.check_disk_row(disk, row, "Format type", "xfs")
+        r.check_disk_row(disk, row, "Mount point", "/")
+        r.check_disk_row_reformatted(disk, row, "Reformat")
+        row = 4
+        r.check_disk_row(disk, row, "Partition", f"/dev/vda{row}")
+        r.check_disk_row(disk, row, "Format type", "btrfs")
+        r.check_disk_row(disk, row, "Mount point", "/")
+
+    def testNoRootMountPoint(self):
+        b = self.browser
+        m = self.machine
+        i = Installer(b, m)
+        s = Storage(b, m)
+
+        # BIOS boot /boot on ext4 / on xfs /home on btrfs
+        disk = "/dev/vda"
+        m.execute(f"""
+        sgdisk --zap-all {disk}
+        sgdisk --new=0:0:+1MiB -t 0:ef02 {disk}
+        sgdisk --new=0:0:+1GiB {disk}
+        sgdisk --new=0:0:+10GiB {disk}
+        sgdisk --new=0:0:0 {disk}
+        mkfs.ext4 {disk}2
+        mkfs.xfs {disk}3
+        mkfs.ext4 {disk}4
+        """)
+
+        self.udevadm_settle()
+
+        partitions = {}
+        partitions[disk] = [f"{disk}2", f"{disk}3", f"{disk}4"]
+        self.select_mountpoint(i, s, [disk], partitions)
+
+        # verify gathered requests
+        self.check_format_type(1, "biosboot")
+        self.check_select_disabled(1)
+        self.check_reformat_disabled(1)
+
+        self.check_format_type(2, "ext4")
+        self.select_from_dropdown(2, "boot", "/boot")
+        self.check_reformat(2, False)
+
+        self.check_format_type(3, "xfs")
+        self.select_from_dropdown(3, "/foo", "/foo", create=True)
+        self.check_reformat(3, False)
+
+        self.check_format_type(4, "ext4")
+        self.select_from_dropdown(4, "home", "/home")
+        self.check_reformat(4, False)
+
+        b.click("#installation-next-btn")
+        self.assert_inline_error("You have not defined a root partition")
+
+    def testMultipleDisks(self):
+        b = self.browser
+        m = self.machine
+        i = Installer(b, m)
+        s = Storage(b, m)
+        r = Review(b)
+
+        m.add_disk(10)
+
+        # BIOS boot partition, /boot partition, /
+        disk1 = "/dev/vda"
+        m.execute(f"""
+        sgdisk --zap-all {disk1}
+        sgdisk --new=0:0:+1MiB -t 0:ef02 {disk1}
+        sgdisk --new=0:0:+1GiB {disk1}
+        sgdisk --new=0:0:0 {disk1}
+        mkfs.xfs {disk1}2
+        mkfs.xfs {disk1}3
+        """)
+
+        # /dev/vdb1 /home partition
+        disk2 = "/dev/vdb"
+        m.execute(f"""
+        sgdisk --zap-all {disk2}
+        sgdisk --new=0:0 {disk2}
+        mkfs.xfs {disk2}1
+        """)
+
+        self.udevadm_settle()
+
+        partitions = {}
+        partitions[disk1] = [f"{disk1}2", f"{disk1}3"]
+        partitions[disk2] = [f"{disk2}1"]
+        self.select_mountpoint(i, s, [disk1, disk2], partitions)
+
+        self.check_format_type(2, "xfs")
+        self.select_from_dropdown(2, "boot", "/boot")
+        self.check_reformat(2, False)
+
+        self.check_format_type(3, "xfs")
+        self.select_from_dropdown(3, "root", "/")
+        self.check_reformat(3, True)
+
+        self.check_format_type(4, "xfs")
+        self.select_from_dropdown(4, "home", "/home")
+        self.check_reformat(4, False)
+
+        b.click("#installation-next-btn")
+        page = i.steps.REVIEW
+        self.browser.wait_not_present("#installation-destination-next-spinner")
+        self.browser.wait_js_cond(f'window.location.hash === "#/{page}"')
+
+        # verify review screen
+        disk = "vda"
+        r.check_disk_label(disk, disk)
+        r.expand_disk_table(disk)
+
+        row = 1
+        r.check_disk_row(disk, row, "Partition", f"/dev/vda{row}")
+        r.check_disk_row(disk, row, "Format type", "biosboot")
+        row = 2
+        r.check_disk_row(disk, row, "Partition", f"/dev/vda{row}")
+        r.check_disk_row(disk, row, "Format type", "xfs")
+        r.check_disk_row(disk, row, "Mount point", "/boot")
+        row = 3
+        r.check_disk_row(disk, row, "Partition", f"/dev/vda{row}")
+        r.check_disk_row(disk, row, "Format type", "xfs")
+        r.check_disk_row(disk, row, "Mount point", "/")
+        r.check_disk_row_reformatted(disk, row, "Reformat")
+
+        disk = "vdb"
+        r.check_disk_label(disk, disk)
+        r.expand_disk_table(disk)
+
+        row = 1
+        r.check_disk_row(disk, row, "Partition", f"/dev/vdb{row}")
+        r.check_disk_row(disk, row, "Format type", "xfs")
+        r.check_disk_row(disk, row, "Mount point", "/home")
+
 if __name__ == '__main__':
     test_main()
diff --git a/ui/webui/test/helpers/installer.py b/ui/webui/test/helpers/installer.py
index a9c91ee2f8f..20b6bb6e801 100644
--- a/ui/webui/test/helpers/installer.py
+++ b/ui/webui/test/helpers/installer.py
@@ -23,6 +23,7 @@ class InstallerSteps(UserList):
     WELCOME = "installation-language"
     STORAGE_DEVICES = "storage-devices"
     STORAGE_CONFIGURATION = "storage-configuration"
+    CUSTOM_MOUNT_POINT = "custom-mountpoint"
     DISK_ENCRYPTION = "disk-encryption"
     REVIEW = "installation-review"
     PROGRESS = "installation-progress"
@@ -54,10 +55,10 @@ def begin_installation(self, should_fail=False, confirm_erase=True):
             self.wait_current_page(self.steps[current_step_id+1])
 
     @log_step()
-    def next(self, should_fail=False, subpage=False):
+    def next(self, should_fail=False, subpage=False, next_page=""):
         current_step_id = self.get_current_page_id()
         current_page = self.steps[current_step_id]
-        next_page = self.steps[current_step_id+1]
+        next_page = next_page or self.steps[current_step_id+1]
 
         # Wait for a disk to be pre-selected before clicking 'Next'.
         # FIXME: Find a better way.
diff --git a/ui/webui/test/helpers/review.py b/ui/webui/test/helpers/review.py
index f03bb3c4ef9..d7471a587b9 100644
--- a/ui/webui/test/helpers/review.py
+++ b/ui/webui/test/helpers/review.py
@@ -49,3 +49,12 @@ def check_storage_config(self, scenario):
     @log_step()
     def check_disk_description(self, disk, description):
         self.browser.wait_in_text(f"#{self._step}-disk-description-{disk}", description)
+
+    def expand_disk_table(self, disk):
+        self.browser.click(f"#{disk}-expander")
+
+    def check_disk_row_reformatted(self, disk, row, label):
+        self.browser.is_present(f"#data-list-{disk} tbody tr:nth-child({row}) td[data-label='{label}'] > svg")
+
+    def check_disk_row(self, disk, row, label, text):
+        self.browser.wait_in_text(f"#data-list-{disk} tbody tr:nth-child({row}) td[data-label='{label}']", text)
diff --git a/ui/webui/test/helpers/storage.py b/ui/webui/test/helpers/storage.py
index 0211115404a..2e6c27bfa38 100644
--- a/ui/webui/test/helpers/storage.py
+++ b/ui/webui/test/helpers/storage.py
@@ -232,6 +232,9 @@ def set_expand_disk_row(self, disk, expanded=True):
         else:
             self.browser.wait_visible(f"#{disk} + .pf-c-table__expandable-row.pf-m-expanded")
 
-    def check_disk_partition(self, disk, partition, fs_type, size):
-        self.browser.wait_in_text(f"#{disk} + .pf-c-table__expandable-row.pf-m-expanded tr:contains('{partition}') td[data-label=Type]", fs_type)
-        self.browser.wait_in_text(f"#{disk} + .pf-c-table__expandable-row.pf-m-expanded tr:contains('{partition}') td[data-label=Size]", size)
+    def check_disk_partition(self, disk, partition, fs_type=None, size=None):
+        self.browser.wait_visible(f"#{disk} + .pf-c-table__expandable-row.pf-m-expanded tr:contains('{partition}')")
+        if fs_type:
+            self.browser.wait_in_text(f"#{disk} + .pf-c-table__expandable-row.pf-m-expanded tr:contains('{partition}') td[data-label=Type]", fs_type)
+        if size:
+            self.browser.wait_in_text(f"#{disk} + .pf-c-table__expandable-row.pf-m-expanded tr:contains('{partition}') td[data-label=Size]", size)
diff --git a/ui/webui/test/reference b/ui/webui/test/reference
index f8a5a93c5e5..0179f3301ef 160000
--- a/ui/webui/test/reference
+++ b/ui/webui/test/reference
@@ -1 +1 @@
-Subproject commit f8a5a93c5e560e79f49b02f88246d3f80c848508
+Subproject commit 0179f3301eff0b116d24f16f897ec282aabf034e

From b3ec6db906e114a735226cc01d8e17440de19b4d Mon Sep 17 00:00:00 2001
From: Katerina Koukiou <kkoukiou@redhat.com>
Date: Thu, 29 Jun 2023 12:25:25 +0200
Subject: [PATCH 3/4] webui: when re-scanning disks or loading initial date
 disable the re-scan button

Previously we were replacing the wizard content with a loading empty
state but that causes a flicker when rescanning disks.
---
 .../src/components/storage/InstallationDestination.jsx     | 7 +++----
 ui/webui/test/check-storage                                | 2 ++
 2 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/ui/webui/src/components/storage/InstallationDestination.jsx b/ui/webui/src/components/storage/InstallationDestination.jsx
index 0162717ed50..09a3287bc70 100644
--- a/ui/webui/src/components/storage/InstallationDestination.jsx
+++ b/ui/webui/src/components/storage/InstallationDestination.jsx
@@ -223,9 +223,6 @@ const LocalStandardDisks = ({ deviceData, diskSelection, dispatch, idPrefix, set
     }, [selectedDisksCnt, setIsFormValid]);
 
     const loading = !deviceData || diskSelection.usableDisks.some(disk => !deviceData[disk]);
-    if (loading) {
-        return <EmptyStatePanel loading />;
-    }
 
     const localDisksInfo = (
         <Popover
@@ -246,6 +243,7 @@ const LocalStandardDisks = ({ deviceData, diskSelection, dispatch, idPrefix, set
     const rescanDisksButton = (
         <Button
           aria-label={_("Detect disks")}
+          isDisabled={isRescanningDisks || loading}
           id={idPrefix + "-rescan-disks"}
           variant="secondary"
           onClick={() => {
@@ -442,7 +440,8 @@ const LocalStandardDisks = ({ deviceData, diskSelection, dispatch, idPrefix, set
                           actionClose={<AlertActionCloseButton onClose={() => { setEqualDisksNotify(false) }} />}
                         />}
                     {localDisksToolbar}
-                    {localDisksTable}
+                    {!loading && localDisksTable}
+                    {loading && <EmptyStatePanel loading />}
                 </FormGroup>
             </FormSection>
         </Form>
diff --git a/ui/webui/test/check-storage b/ui/webui/test/check-storage
index 51db386c6cd..e69c7402a33 100755
--- a/ui/webui/test/check-storage
+++ b/ui/webui/test/check-storage
@@ -301,6 +301,8 @@ class TestStorageExtraDisks(anacondalib.VirtInstallMachineCase):
         i.open()
         i.next()
 
+        s.check_disk_selected("vda", True)
+
         s.rescan_disks()
 
         s.check_disk_visible("vda")

From bf0226b52066b7343fa0dd6006152ba545105ff2 Mon Sep 17 00:00:00 2001
From: Katerina Koukiou <kkoukiou@redhat.com>
Date: Thu, 29 Jun 2023 12:34:09 +0200
Subject: [PATCH 4/4] webui: always disable next button if the form is invalid

---
 ui/webui/src/components/storage/InstallationDestination.jsx | 5 -----
 1 file changed, 5 deletions(-)

diff --git a/ui/webui/src/components/storage/InstallationDestination.jsx b/ui/webui/src/components/storage/InstallationDestination.jsx
index 09a3287bc70..33d8e22949a 100644
--- a/ui/webui/src/components/storage/InstallationDestination.jsx
+++ b/ui/webui/src/components/storage/InstallationDestination.jsx
@@ -213,12 +213,7 @@ const LocalStandardDisks = ({ deviceData, diskSelection, dispatch, idPrefix, set
     const totalDisksCnt = diskSelection.usableDisks.length;
     const selectedDisksCnt = diskSelection.selectedDisks.length;
 
-    // When the selected disks change in the UI, update in the backend as well
     useEffect(() => {
-        // Do not update on the inital value, wait for initialization by the other effect
-        if (refUsableDisks.current === undefined) {
-            return;
-        }
         setIsFormValid(selectedDisksCnt > 0);
     }, [selectedDisksCnt, setIsFormValid]);