Alert about zFCP issues in the summary

Author: joseivanlopez

web/src/components/overview/StorageSummary.test.tsx

@@ -29,7 +29,7 @@ import {
   useFlattenDevices as useProposalFlattenDevices,
   useActions,
 } from "~/hooks/model/proposal/storage";
-import { useIssues } from "~/hooks/model/issue";
+import * as issueHooks from "~/hooks/model/issue";
 import { STORAGE } from "~/routes/paths";
 import StorageSummary from "./StorageSummary";
 
@@ -40,7 +40,8 @@ const mockUseDevicesFn: jest.Mock<ReturnType<typeof useDevices>> = jest.fn();
 const mockUseProposalFlattenDevicesFn: jest.Mock<ReturnType<typeof useProposalFlattenDevices>> =
   jest.fn();
 const mockUseActionsFn: jest.Mock<ReturnType<typeof useActions>> = jest.fn();
-const mockUseIssuesFn: jest.Mock<ReturnType<typeof useIssues>> = jest.fn();
+const mockStorageIssuesFn: jest.Mock<ReturnType<typeof issueHooks.useIssues>> = jest.fn();
+const mockZFCPIssuesFn: jest.Mock<ReturnType<typeof issueHooks.useIssues>> = jest.fn();
 
 // Mock all the hooks
 jest.mock("~/hooks/model/storage/config-model", () => ({
@@ -61,10 +62,11 @@ jest.mock("~/hooks/model/proposal/storage", () => ({
   useActions: () => mockUseActionsFn(),
 }));
 
-jest.mock("~/hooks/model/issue", () => ({
-  ...jest.requireActual("~/hooks/model/issue"),
-  useIssues: () => mockUseIssuesFn(),
-}));
+jest.spyOn(issueHooks, "useIssues").mockImplementation((scope) => {
+  if (scope === "storage") return mockStorageIssuesFn();
+  if (scope === "zfcp") return mockZFCPIssuesFn();
+  return [];
+});
 
 // Mock device for tests
 const mockDevice = {
@@ -99,7 +101,8 @@ describe("StorageSummary", () => {
     mockUseFlattenDevicesFn.mockReturnValue([]);
     mockUseProposalFlattenDevicesFn.mockReturnValue([]);
     mockUseActionsFn.mockReturnValue([]);
-    mockUseIssuesFn.mockReturnValue([]);
+    mockStorageIssuesFn.mockReturnValue([]);
+    mockZFCPIssuesFn.mockReturnValue([]);
   });
 
   afterEach(() => {
@@ -170,26 +173,39 @@ describe("StorageSummary", () => {
     });
 
     it("shows invalid settings warning when config issues exist", () => {
-      mockUseIssuesFn.mockReturnValue([
+      mockStorageIssuesFn.mockReturnValue([
         {
-          description: "Fake Issue",
+          description: "Fake issue",
           class: "generic",
-          details: "Fake Issue details",
+          details: "Fake issue details",
           scope: "storage",
         },
       ]);
       installerRender(<StorageSummary />);
       screen.getByText("Invalid settings");
     });
 
+    it("shows invalid ZFCP settings warning when ZFCP issues exist", () => {
+      mockZFCPIssuesFn.mockReturnValue([
+        {
+          description: "Fake issue",
+          class: "generic",
+          scope: "zfcp",
+        },
+      ]);
+      installerRender(<StorageSummary />);
+      screen.getByText(/Invalid/);
+      screen.getByText(/zFCP/);
+    });
+
     it("shows advanced configuration message when model is unavailable", () => {
       mockUseConfigModelFn.mockReturnValue(null);
       installerRender(<StorageSummary />);
       screen.getByText("Using an advanced storage configuration");
     });
 
     it("ignores proposal class issues when checking config validity", () => {
-      mockUseIssuesFn.mockReturnValue([
+      mockStorageIssuesFn.mockReturnValue([
         {
           description: "Fake Issue",
           class: "proposal",
@@ -254,7 +270,7 @@ describe("StorageSummary", () => {
     });
 
     it("hides description when config issues exist", () => {
-      mockUseIssuesFn.mockReturnValue([
+      mockStorageIssuesFn.mockReturnValue([
         {
           description: "Fake Issue",
           class: "generic",

web/src/components/overview/StorageSummary.tsx

@@ -43,6 +43,7 @@ import { _, formatList } from "~/i18n";
 
 import type { Storage } from "~/model/system";
 import type { ConfigModel } from "~/model/storage/config-model";
+import { isEmpty } from "radashi";
 
 const findDriveDevice = (drive: ConfigModel.Drive, devices: Storage.Device[]) =>
   devices.find((d) => d.name === drive.name);
@@ -82,16 +83,33 @@ const ModelSummary = ({ model }: { model: ConfigModel.Config }): React.ReactNode
   return <SingleDeviceSummary target={targets[0]} />;
 };
 
+const InvalidZFCP = (): React.ReactNode => {
+  // TRANSLATORS: The text in [] is used as a link.
+  const text = _("Invalid [zFCP] settings");
+  const [textStart, textLink, textEnd] = text.split(/[[\]]/);
+  return (
+    <p>
+      {textStart}
+      <Link to={STORAGE.zfcp.root} variant="link" isInline>
+        {textLink}
+      </Link>
+      {textEnd}
+    </p>
+  );
+};
+
 const Value = () => {
   const availableDevices = useAvailableDevices();
   const model = useConfigModel();
   const issues = useIssues("storage");
+  const zfcpIssues = useIssues("zfcp");
   const configIssues = issues.filter((i) => i.class !== "proposal");
 
-  if (!availableDevices.length) return _("There are no disks available for the installation");
-  if (configIssues.length) {
+  if (isEmpty(availableDevices)) return _("There are no disks available for the installation");
+  if (!isEmpty(configIssues)) {
     return _("Invalid settings");
   }
+  if (!isEmpty(zfcpIssues)) return <InvalidZFCP />;
 
   if (!model) return _("Using an advanced storage configuration");
 
@@ -103,17 +121,18 @@ const Description = () => {
   const staging = useProposalFlattenDevices();
   const actions = useActions();
   const issues = useIssues("storage");
+  const zfcpIssues = useIssues("zfcp");
   const configIssues = issues.filter((i) => i.class !== "proposal");
   const manager = new DevicesManager(system, staging, actions);
 
-  if (configIssues.length) return;
-  if (!actions.length) return _("Failed to calculate a storage layout");
+  if (!isEmpty(configIssues) || !isEmpty(zfcpIssues)) return;
+  if (isEmpty(actions)) return _("Failed to calculate a storage layout");
 
   const deleteActions = manager.actions.filter((a) => a.delete && !a.subvol).length;
   if (!deleteActions) return _("No data loss is expected");
 
   const systems = manager.deletedSystems();
-  if (systems.length) {
+  if (!isEmpty(systems)) {
     return sprintf(
       // TRANSLATORS: %s will be replaced by a formatted list of affected systems
       // like "Windows and openSUSE Tumbleweed".
@@ -155,7 +174,10 @@ const Description = () => {
  */
 export default function StorageSummary() {
   const { loading } = useProgressTracking("storage");
-  const hasIssues = !!useIssues("storage").length;
+  const issues = useIssues("storage");
+  const zfcpIssues = useIssues("zfcp");
+
+  const hasIssues = !isEmpty(issues) || !isEmpty(zfcpIssues);
 
   return (
     <Summary