diff --git a/web/src/components/overview/OverviewPage.jsx b/web/src/components/overview/OverviewPage.jsx
index 68fcefb86e..29ea0a91bb 100644
--- a/web/src/components/overview/OverviewPage.jsx
+++ b/web/src/components/overview/OverviewPage.jsx
@@ -43,7 +43,7 @@ import SoftwareSection from "./SoftwareSection";
import { _ } from "~/i18n";
const SCOPE_HEADERS = {
- user: _("Users"),
+ users: _("Users"),
storage: _("Storage"),
software: _("Software")
};
diff --git a/web/src/components/overview/SoftwareSection.jsx b/web/src/components/overview/SoftwareSection.jsx
index 0390de8f1b..69b7d9664c 100644
--- a/web/src/components/overview/SoftwareSection.jsx
+++ b/web/src/components/overview/SoftwareSection.jsx
@@ -54,23 +54,37 @@ export default function SoftwareSection() {
return;
}
- // TRANSLATORS: %s will be replaced with the installation size, example:
- // "5GiB".
- const [msg1, msg2] = _("The installation will take %s including:").split("%s");
+ const TextWithoutList = () => {
+ return (
+ <>
+ {_("The installation will take")} {proposal.size}
+
+ );
+ };
+
+ const TextWithList = () => {
+ // TRANSLATORS: %s will be replaced with the installation size, example: "5GiB".
+ const [msg1, msg2] = _("The installation will take %s including:").split("%s");
+ return (
+ <>
+
+ {msg1}
+ {proposal.size}
+ {msg2}
+
+
+ {selectedPatterns.map(p => (
+ {p.summary}
+ ))}
+
+
+ );
+ };
return (
{_("Software")}
-
- {msg1}
- {`${proposal.size}`}
- {msg2}
-
-
- {selectedPatterns.map(p => (
- {p.summary}
- ))}
-
+ {selectedPatterns.length ? : }
);
}
diff --git a/web/src/components/product/ProductSelectionPage.jsx b/web/src/components/product/ProductSelectionPage.jsx
index 13b0c0a595..ecbde0b74a 100644
--- a/web/src/components/product/ProductSelectionPage.jsx
+++ b/web/src/components/product/ProductSelectionPage.jsx
@@ -23,7 +23,7 @@ import React, { useState } from "react";
import { useNavigate } from "react-router-dom";
import {
Card, CardBody,
- Flex, FlexItem,
+ Flex,
Form,
Grid, GridItem,
Radio
@@ -46,7 +46,7 @@ function ProductSelectionPage() {
const navigate = useNavigate();
const { manager, product } = useInstallerClient();
const { products, selectedProduct } = useProduct();
- const [nextProduct, setNextProduct] = useState(selectedProduct || products[0]);
+ const [nextProduct, setNextProduct] = useState(selectedProduct);
const onSubmit = async (e) => {
e.preventDefault();
@@ -72,50 +72,44 @@ function ProductSelectionPage() {
);
};
+ const isSelectionDisabled = !nextProduct || (nextProduct === selectedProduct);
+
return (
- <>
-
-
-
-
-
-
+
+
+
);
}
diff --git a/web/src/components/product/ProductSelectionProgress.jsx b/web/src/components/product/ProductSelectionProgress.jsx
index cd3b3e5cff..f6cf185ecb 100644
--- a/web/src/components/product/ProductSelectionProgress.jsx
+++ b/web/src/components/product/ProductSelectionProgress.jsx
@@ -30,6 +30,7 @@ import {
import { _ } from "~/i18n";
import { Center } from "~/components/layout";
+import SimpleLayout from "~/SimpleLayout";
import { useCancellablePromise } from "~/utils";
import { useInstallerClient } from "~/context/installer";
import { useProduct } from "~/context/product";
@@ -136,26 +137,28 @@ function ProductSelectionProgress() {
}, [cancellablePromise, setSoftwareProgress, software]);
return (
-
-
-
-
-
-
-
- {_("Configuring the product, please wait ...")}
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+ {_("Configuring the product, please wait ...")}
+
+
+
+
+
+
+
+
+
);
}
diff --git a/web/src/components/product/routes.js b/web/src/components/product/routes.js
index f01c84add6..902e25dbcc 100644
--- a/web/src/components/product/routes.js
+++ b/web/src/components/product/routes.js
@@ -20,37 +20,13 @@
*/
import React from "react";
-import { Page } from "~/components/core";
import ProductSelectionPage from "./ProductSelectionPage";
-import ProductRegistrationPage from "./ProductRegistrationPage";
-import { _ } from "~/i18n";
-const registerRoute = {
- path: "/product/register",
- element: ,
- handle: {
- name: _("Product registration"),
- icon: "inventory_2",
- hidden: true
- },
- children: [
- {
- index: true,
- element:
- }
- ]
-};
-
-const selectionRoute = {
- path: "/product/select",
- element: ,
- handle: {
- name: _("Product selection"),
- icon: "inventory_2"
- }
+const productsRoute = {
+ path: "/products",
+ element:
};
export {
- registerRoute,
- selectionRoute,
+ productsRoute
};
diff --git a/web/src/router.js b/web/src/router.js
index f2c91b5fd5..b3c4c2c86e 100644
--- a/web/src/router.js
+++ b/web/src/router.js
@@ -25,20 +25,16 @@ import App from "~/App";
import Protected from "~/Protected";
import MainLayout from "~/MainLayout";
import SimpleLayout from "./SimpleLayout";
-import { Page, LoginPage } from "~/components/core";
+import { LoginPage } from "~/components/core";
import { OverviewPage } from "~/components/overview";
-import { ProductRegistrationPage, ProductSelectionPage } from "~/components/product";
import { _ } from "~/i18n";
import overviewRoutes from "~/components/overview/routes";
import l10nRoutes from "~/components/l10n/routes";
import networkRoutes from "~/components/network/routes";
+import { productsRoute } from "~/components/product/routes";
import storageRoutes from "~/components/storage/routes";
import softwareRoutes from "~/components/software/routes";
import usersRoutes from "~/components/users/routes";
-import {
- registerRoute as productRegistrationRoute,
- selectionRoute as productSelectionRoute
-} from "~/components/product/routes";
const rootRoutes = [
overviewRoutes,
@@ -46,8 +42,7 @@ const rootRoutes = [
networkRoutes,
storageRoutes,
softwareRoutes,
- usersRoutes,
- productRegistrationRoute
+ usersRoutes
];
const protectedRoutes = [
@@ -67,13 +62,7 @@ const protectedRoutes = [
},
{
element: ,
- children: [
- {
- path: "products",
- element:
- },
- productSelectionRoute
- ]
+ children: [productsRoute]
}
]
}