diff --git a/rust/agama-utils/src/api/scope.rs b/rust/agama-utils/src/api/scope.rs
index ce657c9ad0..63e87d7cdc 100644
--- a/rust/agama-utils/src/api/scope.rs
+++ b/rust/agama-utils/src/api/scope.rs
@@ -47,6 +47,8 @@ pub enum Scope {
     Software,
     Storage,
     Files,
+    #[strum(serialize = "iscsi")]
+    #[serde(rename = "iscsi")]
     ISCSI,
     #[strum(serialize = "dasd")]
     #[serde(rename = "dasd")]
diff --git a/rust/share/system.iscsi.schema.json b/rust/share/system.iscsi.schema.json
new file mode 100644
index 0000000000..80b49cde87
--- /dev/null
+++ b/rust/share/system.iscsi.schema.json
@@ -0,0 +1,53 @@
+{
+  "$schema": "https://json-schema.org/draft/2019-09/schema",
+  "$id": "https://github.com/openSUSE/agama/blob/master/rust/share/system.storage.schema.json",
+  "title": "System",
+  "description": "API description of the iSCSI system",
+  "type": "object",
+  "additionalProperties": false,
+  "required": ["initiator", "targets"],
+  "properties": {
+    "initiator": {
+      "title": "Initiator",
+      "type": "object",
+      "additionalProperties": false,
+      "required": ["name", "ibft"],
+      "properties": {
+        "name": { "type": "string" },
+        "ibft": { "type": "boolean" }
+      }
+    },
+    "targets": {
+      "type": "array",
+      "items": { "$ref": "#/$defs/target" }
+    }
+  },
+  "$defs": {
+    "target": {
+      "type": "object",
+      "additionalProperties": false,
+      "required": ["name", "address", "port", "interface", "ibtf", "startup", "connected", "locked"],
+      "properties": {
+        "name": { "type": "string" },
+        "address": { "type": "string" },
+        "port": { "type": "number" },
+        "interface": { "type": "string" },
+        "ibft": {
+          "description": "Whether the target was initiated by iBFT.",
+          "type": "boolean"
+        },
+        "startup": {
+          "enum": ["onboot", "manual", "automatic"]
+        },
+        "connected": {
+          "description": "Whether the node is connected (there is a session).",
+          "type": "boolean"
+        },
+        "locked": {
+          "description": "Whether the node is locked (cannot be deactivated)",
+          "type": "boolean"
+        }
+      }
+    }
+  }
+}
diff --git a/web/package/agama-web-ui.changes b/web/package/agama-web-ui.changes
index fdb1e0d41d..4e8067802b 100644
--- a/web/package/agama-web-ui.changes
+++ b/web/package/agama-web-ui.changes
@@ -1,3 +1,10 @@
+-------------------------------------------------------------------
+Thu Feb 12 11:56:57 UTC 2026 - David Diaz <dgonzalez@suse.com>
+
+- Restore the interface for managing iSCSI in the web client
+  (gh#agama-project/agama#3092).
+- Restore the "Rescan devices" storage option (bsc#1258089).
+
 -------------------------------------------------------------------
 Wed Feb 11 14:24:03 UTC 2026 - Imobach Gonzalez Sosa <igonzalezsosa@suse.com>
 
diff --git a/web/src/api.ts b/web/src/api.ts
index db75afbf75..fa9bcda060 100644
--- a/web/src/api.ts
+++ b/web/src/api.ts
@@ -28,7 +28,7 @@ import type { Proposal } from "~/model/proposal";
 import type { Question } from "~/model/question";
 import type { Status } from "~/model/status";
 import type { System } from "~/model/system";
-import type { Action, L10nSystemConfig } from "~/model/action";
+import type { Action, L10nSystemConfig, DiscoverISCSIConfig } from "~/model/action";
 import type { AxiosResponse } from "axios";
 import type { Job } from "~/types/job";
 
@@ -78,6 +78,8 @@ const activateStorageAction = () => postAction({ activateStorage: null });
 
 const probeStorageAction = () => postAction({ probeStorage: null });
 
+const discoverISCSIAction = (config: DiscoverISCSIConfig) => postAction({ discoverISCSI: config });
+
 const finishInstallation = () => postAction({ finish: "reboot" });
 
 /**
@@ -102,6 +104,7 @@ export {
   configureL10nAction,
   activateStorageAction,
   probeStorageAction,
+  discoverISCSIAction,
   finishInstallation,
   getStorageJobs,
 };
diff --git a/web/src/assets/styles/index.scss b/web/src/assets/styles/index.scss
index 1d84600696..436d4d257e 100644
--- a/web/src/assets/styles/index.scss
+++ b/web/src/assets/styles/index.scss
@@ -559,6 +559,11 @@ span.in-quotes {
   }
 }
 
+nav.agm-breadcrumb h1 {
+  // Allow heading in breadcrumb use fontSize from its parent
+  font-size: inherit;
+}
+
 // FIXME: make ir more generic, if possible, or even without CSS but not
 // rendering such a label if "storage instructions" are more than one
 .storage-structure:has(> li:nth-child(2)) span.action-text {
diff --git a/web/src/components/core/Breadcrumbs.test.tsx b/web/src/components/core/Breadcrumbs.test.tsx
index 5b5e1aeca4..634d919288 100644
--- a/web/src/components/core/Breadcrumbs.test.tsx
+++ b/web/src/components/core/Breadcrumbs.test.tsx
@@ -109,4 +109,16 @@ describe("Breadcrumbs.Item", () => {
     expect(label).not.toHaveClass(textStyles.fontSizeLg);
     expect(label).not.toHaveClass(textStyles.fontWeightBold);
   });
+
+  it("renders menu when provided", () => {
+    installerRender(
+      <Breadcrumbs.Item
+        label="Software"
+        path="/software"
+        menu={<div role="menu" aria-label="Software menu" />}
+      />,
+    );
+
+    screen.getByRole("menu", { name: "Software menu" });
+  });
 });
diff --git a/web/src/components/core/Breadcrumbs.tsx b/web/src/components/core/Breadcrumbs.tsx
index 2d3b5978a8..5833294f06 100644
--- a/web/src/components/core/Breadcrumbs.tsx
+++ b/web/src/components/core/Breadcrumbs.tsx
@@ -28,12 +28,47 @@ import Icon from "~/components/layout/Icon";
 import { TranslatedString, _ } from "~/i18n";
 
 import textStyles from "@patternfly/react-styles/css/utilities/Text/text";
+import displayStyles from "@patternfly/react-styles/css/utilities/Display/display";
 
 export type BreadcrumbProps = {
   /** The label to display for the breadcrumb item */
   label: React.ReactNode | TranslatedString;
   /** The URL path the breadcrumb item links to */
   path?: string;
+  /**
+   * Optional menu providing contextual navigation for the breadcrumb item.
+   *
+   * When provided, it appears adjacent to the breadcrumb label and is intended
+   * to contain navigation options related to the area or section represented by
+   * the breadcrumb.
+   *
+   * @remarks
+   *
+   * **Accessibility requirement**
+   *
+   * The menu trigger must be fully accessible.
+   * Missing or incorrect ARIA attributes may result in an inaccessible breadcrumb.
+   *
+   * At a minimum, the trigger is expected to define:
+   *   - aria-label="[Descriptive label]"
+   *   - aria-haspopup="true"
+   *   - aria-expanded="true | false"
+   *
+   * @example
+   * ```tsx
+   * <Breadcrumbs.Item
+   *   label="Storage"
+   *   path="/storage"
+   *   menu={
+   *     <Dropdown>
+   *       <DropdownItem to="/storage/settings">Advanced settings</DropdownItem>
+   *       <DropdownItem to="/storage/iscsi">iSCSI configuration</DropdownItem>
+   *     </Dropdown>
+   *   }
+   * />
+   * ```
+   */
+  menu?: React.ReactNode;
   /** Option to hide the divider (e.g., chevron icon) between breadcrumb items */
   hideDivider?: boolean;
   /** Flag to indicate if the breadcrumb item should have special editorial
@@ -51,6 +86,7 @@ export type BreadcrumbProps = {
 const Breadcrumb = ({
   label,
   path,
+  menu,
   isCurrent = false,
   hideDivider = false,
   isEditorial = false,
@@ -70,12 +106,13 @@ const Breadcrumb = ({
     >
       {!hideDivider && <Icon name="chevron_right" aria-hidden />}
       {isCurrent ? (
-        <h1>{content}</h1>
+        <h1 className={displayStyles.displayInline}>{content}</h1>
       ) : (
         <Link to={path} variant="link" isInline>
           {content}
         </Link>
       )}
+      {menu}
     </Flex>
   );
 };
@@ -92,10 +129,10 @@ const Breadcrumb = ({
  */
 const Breadcrumbs = ({ a11yName = _("Breadcrumbs"), children }) => {
   return (
-    <nav aria-label={a11yName}>
+    <nav aria-label={a11yName} className="agm-breadcrumb">
       <Flex
         component="ol"
-        gap={{ default: "gapXs" }}
+        gap={{ default: "gapNone" }}
         alignItems={{ default: "alignItemsCenter" }}
         alignContent={{ default: "alignContentCenter" }}
       >
diff --git a/web/src/components/core/ChangeProductOption.test.tsx b/web/src/components/core/ChangeProductOption.test.tsx
index b55344956e..1c06bbd156 100644
--- a/web/src/components/core/ChangeProductOption.test.tsx
+++ b/web/src/components/core/ChangeProductOption.test.tsx
@@ -22,11 +22,11 @@
 
 import React from "react";
 import { screen } from "@testing-library/react";
-import { installerRender } from "~/test-utils";
+import { installerRender, mockStage } from "~/test-utils";
 import { useSystem } from "~/hooks/model/system";
+import { Product } from "~/model/system";
 import { PRODUCT as PATHS } from "~/routes/paths";
 import ChangeProductOption from "./ChangeProductOption";
-import { Product } from "~/model/system";
 
 const tumbleweed: Product = {
   id: "Tumbleweed",
@@ -46,38 +46,74 @@ const microos: Product = {
   modes: [],
 };
 
-// let registrationInfoMock: RegistrationInfo;
+const tumbleweedWithModes: Product = {
+  ...tumbleweed,
+  modes: [
+    { id: "mode1", name: "Mode 1", description: "Mode 1 desc" },
+    { id: "mode2", name: "Mode 2", description: "Mode 2 desc" },
+  ],
+};
+
 const mockSystemProducts: jest.Mock<Product[]> = jest.fn();
+const mockSoftware: jest.Mock = jest.fn();
 
 jest.mock("~/hooks/model/system", () => ({
   ...jest.requireActual("~/hooks/model/system"),
   useSystem: (): ReturnType<typeof useSystem> => ({
     products: mockSystemProducts(),
+    software: mockSoftware(),
   }),
 }));
 
 describe("ChangeProductOption", () => {
+  beforeEach(() => {
+    mockSoftware.mockReturnValue(null);
+    mockStage("configuring");
+  });
+
   describe("when there is more than one product available", () => {
     beforeEach(() => {
       mockSystemProducts.mockReturnValue([tumbleweed, microos]);
     });
 
-    it("renders a menu item for navigating to product selection page", () => {
+    it("renders a link by default for navigating to product selection page", () => {
       installerRender(<ChangeProductOption />);
-      const link = screen.getByRole("menuitem", { name: "Change product" });
+      const link = screen.getByRole("link", { name: "Change product" });
       expect(link).toHaveAttribute("href", PATHS.changeProduct);
     });
 
-    // FIXME: activate it again when registration is ready in api v2
-    describe.skip("but a product is registered", () => {
-      // beforeEach(() => {
-      //   registrationInfoMock = {
-      //     registered: true,
-      //     key: "INTERNAL-USE-ONLY-1234-5678",
-      //     email: "",
-      //     url: "",
-      //   };
-      // });
+    it("renders a menu item when component prop is 'dropdownitem'", () => {
+      installerRender(<ChangeProductOption component="dropdownitem" />);
+      screen.getByRole("menuitem", { name: "Change product" });
+    });
+
+    it("renders with an icon when showIcon is true", () => {
+      const { container } = installerRender(<ChangeProductOption showIcon />);
+      const icon = container.querySelector("svg");
+      expect(icon).toHaveAttribute("data-icon-name", "edit_square");
+    });
+
+    it("does not render an icon by default", () => {
+      installerRender(<ChangeProductOption />);
+      const link = screen.getByRole("link", { name: "Change product" });
+      expect(link.querySelector("svg")).toBeNull();
+    });
+
+    describe("but a product is registered", () => {
+      beforeEach(() => {
+        mockSoftware.mockReturnValue({ registration: true });
+      });
+
+      it("renders nothing", () => {
+        const { container } = installerRender(<ChangeProductOption />);
+        expect(container).toBeEmptyDOMElement();
+      });
+    });
+
+    describe("but the stage is not 'configuring'", () => {
+      beforeEach(() => {
+        mockStage("installing");
+      });
 
       it("renders nothing", () => {
         const { container } = installerRender(<ChangeProductOption />);
@@ -87,13 +123,42 @@ describe("ChangeProductOption", () => {
   });
 
   describe("when there is only one product available", () => {
+    describe("without modes", () => {
+      beforeEach(() => {
+        mockSystemProducts.mockReturnValue([tumbleweed]);
+      });
+
+      it("renders nothing", () => {
+        const { container } = installerRender(<ChangeProductOption />);
+        expect(container).toBeEmptyDOMElement();
+      });
+    });
+
+    describe("with modes", () => {
+      beforeEach(() => {
+        mockSystemProducts.mockReturnValue([tumbleweedWithModes]);
+      });
+
+      it("renders with 'Change mode' label", () => {
+        installerRender(<ChangeProductOption />);
+        screen.getByRole("link", { name: "Change mode" });
+      });
+    });
+  });
+
+  describe("when there are multiple products and at least one has modes", () => {
     beforeEach(() => {
-      mockSystemProducts.mockReturnValue([tumbleweed]);
+      mockSystemProducts.mockReturnValue([tumbleweedWithModes, microos]);
+    });
+
+    it("renders with 'Change product or mode' label", () => {
+      installerRender(<ChangeProductOption />);
+      screen.getByRole("link", { name: "Change product or mode" });
     });
 
-    it("renders nothing", () => {
-      const { container } = installerRender(<ChangeProductOption />);
-      expect(container).toBeEmptyDOMElement();
+    it("renders with icon when showIcon is true", () => {
+      installerRender(<ChangeProductOption showIcon component="dropdownitem" />);
+      screen.getByRole("menuitem", { name: /Change product or mode/ });
     });
   });
 });
diff --git a/web/src/components/core/ChangeProductOption.tsx b/web/src/components/core/ChangeProductOption.tsx
index bcdd3f8adf..2ce1020efd 100644
--- a/web/src/components/core/ChangeProductOption.tsx
+++ b/web/src/components/core/ChangeProductOption.tsx
@@ -21,28 +21,69 @@
  */
 
 import React from "react";
-import { DropdownItem, DropdownItemProps } from "@patternfly/react-core";
-import { useHref, useLocation } from "react-router";
-// import { useRegistration } from "~/queries/software";
-import { PRODUCT as PATHS, SIDE_PATHS } from "~/routes/paths";
+import { DropdownItem, DropdownItemProps, Flex } from "@patternfly/react-core";
+import { href, useHref } from "react-router";
+import { PRODUCT as PATHS } from "~/routes/paths";
 import { _ } from "~/i18n";
 import { useSystem } from "~/hooks/model/system";
 import { useStatus } from "~/hooks/model/status";
 import { isEmpty } from "radashi";
+import Link, { LinkProps } from "~/components/core/Link";
+import Icon from "~/components/layout/Icon";
+
+type ChangeProductOptionProps = Omit<DropdownItemProps, "to" | "component" | "children"> &
+  Omit<LinkProps, "to" | "component" | "children"> & {
+    /**
+     * The component to render.
+     *   - "a": Renders as a Link component (default)
+     *   - "dropdownitem": Renders as a DropdownItem component
+     */
+    component?: "dropdownitem" | "a";
+    /**
+     * Whether to display an edit icon before the label.
+     * When true, displays an "edit_square" icon.
+     */
+    showIcon?: boolean;
+  };
 
 /**
- * DropdownItem Option for navigating to the selection product.
+ * Navigation option for changing the selected product or mode.
+ *
+ * This component conditionally renders based on the system state:
+ *   - Returns null if there's only one product without modes
+ *   - Returns null if software is registered
+ *   - Returns null if installation stage is not "configuring"
+ *
+ * The label adapts to the available options:
+ *   - "Change mode" when there's one product with modes
+ *   - "Change product or mode" when there are multiple products and at least
+ *     one has modes
+ *   - "Change product" when there are multiple products without modes
+ *
+ * Can be rendered as either a link (default) or dropdown menu item. Optionally
+ * displays an edit icon when `showIcon` is true.
+ *
+ * @example
+ * // As a link (default)
+ * <ChangeProductOption />
+ *
+ * @example
+ * // As a dropdown item with icon
+ * <ChangeProductOption component="dropdownitem" showIcon />
  */
-export default function ChangeProductOption({ children, ...props }: Omit<DropdownItemProps, "to">) {
+export default function ChangeProductOption({
+  component = "a",
+  showIcon = false,
+  ...props
+}: ChangeProductOptionProps) {
   const { products, software } = useSystem();
   const { stage } = useStatus();
-  const currentLocation = useLocation();
-  const to = useHref(PATHS.changeProduct);
+  const resolvedPath = useHref(PATHS.changeProduct);
+  const to = component === "a" ? href(PATHS.changeProduct) : resolvedPath;
   const hasModes = products.find((p) => !isEmpty(p.modes));
 
   if (products.length <= 1 && !hasModes) return null;
   if (software?.registration) return null;
-  if (SIDE_PATHS.includes(currentLocation.pathname)) return null;
   if (stage !== "configuring") return null;
 
   const getLabel = () => {
@@ -51,9 +92,18 @@ export default function ChangeProductOption({ children, ...props }: Omit<Dropdow
     return _("Change product");
   };
 
+  const Component = component === "a" ? Link : DropdownItem;
+  const Wrapper = component === "a" ? Flex : React.Fragment;
+  const wrapperProps =
+    component === "a"
+      ? { gap: { default: "gapXs" } as const, alignItems: { default: "alignItemsCenter" } as const }
+      : {};
+
   return (
-    <DropdownItem to={to} {...props}>
-      {children || getLabel()}
-    </DropdownItem>
+    <Component to={to} {...props}>
+      <Wrapper {...wrapperProps}>
+        {showIcon && <Icon name="edit_square" />} {getLabel()}
+      </Wrapper>
+    </Component>
   );
 }
diff --git a/web/src/components/core/InstallationFinished.test.tsx b/web/src/components/core/InstallationFinished.test.tsx
index 2d3ea82f5c..ce865451ba 100644
--- a/web/src/components/core/InstallationFinished.test.tsx
+++ b/web/src/components/core/InstallationFinished.test.tsx
@@ -26,8 +26,6 @@ import { installerRender, mockStage } from "~/test-utils";
 import type { Storage } from "~/model/config";
 import InstallationFinished from "~/components/core/InstallationFinished";
 
-jest.mock("~/components/core/InstallerOptions", () => () => <div>Installer Options</div>);
-
 type storageConfigType = "guided" | "raw";
 type guidedEncryption = {
   password: string;
diff --git a/web/src/components/core/InstallationFinished.tsx b/web/src/components/core/InstallationFinished.tsx
index 8a2c478eea..480c38d3ec 100644
--- a/web/src/components/core/InstallationFinished.tsx
+++ b/web/src/components/core/InstallationFinished.tsx
@@ -113,7 +113,7 @@ function InstallationFinished() {
   const mountTpmAlert = usingTpm(storageConfig);
 
   return (
-    <Page showQuestions={false}>
+    <Page variant="minimal">
       <Page.Content>
         <Grid hasGutter style={{ height: "100%", placeContent: "center" }}>
           <GridItem sm={12} md={6} style={{ alignSelf: "center" }}>
diff --git a/web/src/components/core/InstallationProgress.tsx b/web/src/components/core/InstallationProgress.tsx
index ce04ff44b6..6065dc94a9 100644
--- a/web/src/components/core/InstallationProgress.tsx
+++ b/web/src/components/core/InstallationProgress.tsx
@@ -31,12 +31,13 @@ import { _ } from "~/i18n";
 
 import textStyles from "@patternfly/react-styles/css/utilities/Text/text";
 import alignmentStyles from "@patternfly/react-styles/css/utilities/Alignment/alignment";
+import InstallerOptionsMenu from "./InstallerOptionsMenu";
 
 export default function InstallationProgress() {
   const product = useProductInfo();
 
   return (
-    <Page showInstallerOptions={false} hideProgressMonitor>
+    <Page noDefaultStartSlot endSlot={<InstallerOptionsMenu hideLabel />}>
       <Page.Content>
         <Grid hasGutter style={{ height: "100%", placeContent: "center" }}>
           <GridItem sm={12} md={5} style={{ alignSelf: "center" }}>
diff --git a/web/src/components/core/InstallerOptions.test.tsx b/web/src/components/core/InstallerL10nOptions.test.tsx
similarity index 95%
rename from web/src/components/core/InstallerOptions.test.tsx
rename to web/src/components/core/InstallerL10nOptions.test.tsx
index f0502df03a..f270da1d02 100644
--- a/web/src/components/core/InstallerOptions.test.tsx
+++ b/web/src/components/core/InstallerL10nOptions.test.tsx
@@ -30,7 +30,7 @@ import { Progress, Stage } from "~/model/status";
 import { System } from "~/model/system/network";
 import * as utils from "~/utils";
 import { ROOT } from "~/routes/paths";
-import InstallerOptions, { InstallerOptionsProps } from "./InstallerOptions";
+import InstallerL10nOptions, { InstallerL10nOptionsProps } from "./InstallerL10nOptions";
 import { useStatus } from "~/hooks/model/status";
 
 const locales: Locale[] = [
@@ -102,14 +102,14 @@ jest.mock("~/context/installerL10n", () => ({
   }),
 }));
 
-const renderAndOpen = async (props: InstallerOptionsProps = {}) => {
-  const { user } = installerRender(<InstallerOptions {...props} />, { withL10n: true });
+const renderAndOpen = async (props: InstallerL10nOptionsProps = {}) => {
+  const { user } = installerRender(<InstallerL10nOptions {...props} />, { withL10n: true });
   const toggle = screen.getByRole("button");
   await user.click(toggle);
   return { user };
 };
 
-describe("InstallerOptions", () => {
+describe("InstallerL10nOptions", () => {
   beforeEach(() => {
     jest.spyOn(utils, "localConnection").mockReturnValue(true);
     mockProgressesFn.mockReturnValue([]);
@@ -119,7 +119,7 @@ describe("InstallerOptions", () => {
 
   it("allows custom toggle", async () => {
     const { user } = installerRender(
-      <InstallerOptions
+      <InstallerL10nOptions
         toggle={({ onClick, language, keymap }) => (
           <button onClick={onClick}>{`Change installer settings (${language}-${keymap})`}</button>
         )}
@@ -143,14 +143,14 @@ describe("InstallerOptions", () => {
     });
 
     it("renders nothing", () => {
-      const { container } = installerRender(<InstallerOptions />);
+      const { container } = installerRender(<InstallerL10nOptions />);
       expect(container).toBeEmptyDOMElement();
     });
   });
 
   describe("when using variant=all", () => {
     it("renders a button with current language and keymap values", () => {
-      installerRender(<InstallerOptions />, { withL10n: true });
+      installerRender(<InstallerL10nOptions />, { withL10n: true });
       const toggle = screen.getByRole("button", {
         name: "Change display language and keyboard layout",
       });
@@ -251,7 +251,7 @@ describe("InstallerOptions", () => {
       });
 
       it("does not render keymap value in the toggle button", () => {
-        installerRender(<InstallerOptions />, { withL10n: true });
+        installerRender(<InstallerL10nOptions />, { withL10n: true });
         const toggle = screen.getByRole("button", {
           name: "Change display language",
         });
@@ -276,7 +276,7 @@ describe("InstallerOptions", () => {
 
   describe("when using variant=language", () => {
     it("renders a button only with current language value", () => {
-      installerRender(<InstallerOptions variant="language" />, { withL10n: true });
+      installerRender(<InstallerL10nOptions variant="language" />, { withL10n: true });
       const toggle = screen.getByRole("button", {
         name: "Change display language",
       });
@@ -364,7 +364,7 @@ describe("InstallerOptions", () => {
 
   describe("when using variant=keyboard", () => {
     it("renders a button only with current keymap value", () => {
-      installerRender(<InstallerOptions variant="keyboard" />, { withL10n: true });
+      installerRender(<InstallerL10nOptions variant="keyboard" />, { withL10n: true });
       const toggle = screen.getByRole("button", {
         name: "Change keyboard layout",
       });
@@ -442,7 +442,7 @@ describe("InstallerOptions", () => {
       });
 
       it("renders nothing", () => {
-        const { container } = installerRender(<InstallerOptions variant="keyboard" />, {
+        const { container } = installerRender(<InstallerL10nOptions variant="keyboard" />, {
           withL10n: true,
         });
         expect(container).toBeEmptyDOMElement();
diff --git a/web/src/components/core/InstallerOptions.tsx b/web/src/components/core/InstallerL10nOptions.tsx
similarity index 97%
rename from web/src/components/core/InstallerOptions.tsx
rename to web/src/components/core/InstallerL10nOptions.tsx
index 43f35b7c40..3f690116ae 100644
--- a/web/src/components/core/InstallerOptions.tsx
+++ b/web/src/components/core/InstallerL10nOptions.tsx
@@ -21,7 +21,7 @@
  */
 
 /**
- * This module defines the InstallerOptions component, which allows users to
+ * This module defines the InstallerL10nOptions component, which allows users to
  * configure installer localization settings, with the option to copy them, when
  * applicable, to the product's localization settings.
  *
@@ -223,12 +223,12 @@ type DialogProps = {
 };
 
 /**
- * Defines the available installer options modes:
+ * Defines the available installer l10n options modes:
  *   "all": Allow settings both language and keyboard layout.
  *   "language": Allow setting only language.
  *   "keyboard": Allow settings only keyboard layout.
  */
-type InstallerOptionsVariant = "all" | "language" | "keyboard";
+type InstallerL10nOptionsVariants = "all" | "language" | "keyboard";
 
 /**
  * Props passed to each toggle variant.
@@ -507,7 +507,7 @@ const AllSettingsToggle = ({ onClick, language, keymap }: ToggleProps) => {
 /**
  * Maps each dialog variant to its corresponding React component.
  */
-const dialogs: { [key in InstallerOptionsVariant]: React.FC<DialogProps> } = {
+const dialogs: { [key in InstallerL10nOptionsVariants]: React.FC<DialogProps> } = {
   all: AllSettingsDialog,
   language: LanguageOnlyDialog,
   keyboard: KeyboardOnlyDialog,
@@ -516,18 +516,18 @@ const dialogs: { [key in InstallerOptionsVariant]: React.FC<DialogProps> } = {
 /**
  * Maps each toggle variant to its corresponding React component.
  */
-const toggles: { [key in InstallerOptionsVariant]: React.FC<ToggleProps> } = {
+const toggles: { [key in InstallerL10nOptionsVariants]: React.FC<ToggleProps> } = {
   all: AllSettingsToggle,
   language: LanguageOnlyToggle,
   keyboard: KeyboardOnlyToggle,
 };
 
 /**
- * Props for the main InstallerOptions component.
+ * Props for the main InstallerL10nOptions component.
  */
-export type InstallerOptionsProps = {
+export type InstallerL10nOptionsProps = {
   /** Determines which dialog variant to render. */
-  variant?: InstallerOptionsVariant;
+  variant?: InstallerL10nOptionsVariants;
   /**
    * Optional render function for a custom button or UI element that opens the
    * dialog. If not provided, a default toggle button will be rendered based on
@@ -545,11 +545,11 @@ export type InstallerOptionsProps = {
  * keyboard-only, or both.
  *
  */
-export default function InstallerOptions({
+export default function InstallerL10nOptions({
   variant = "all",
   toggle,
   onClose,
-}: InstallerOptionsProps) {
+}: InstallerL10nOptionsProps) {
   const location = useLocation();
   const {
     l10n: { locales },
diff --git a/web/src/components/core/InstallerOptionsMenu.tsx b/web/src/components/core/InstallerOptionsMenu.tsx
new file mode 100644
index 0000000000..30dcbe4a3a
--- /dev/null
+++ b/web/src/components/core/InstallerOptionsMenu.tsx
@@ -0,0 +1,95 @@
+/*
+ * Copyright (c) [2026] SUSE LLC
+ *
+ * All Rights Reserved.
+ *
+ * This program is free software; you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the Free
+ * Software Foundation; either version 2 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 General Public License for
+ * more details.
+ *
+ * You should have received a copy of the GNU General Public License along
+ * with this program; if not, contact SUSE LLC.
+ *
+ * To contact SUSE LLC about this file by physical or electronic mail, you may
+ * find current contact information at www.suse.com.
+ */
+
+import React, { useState } from "react";
+import {
+  Dropdown,
+  DropdownItem,
+  DropdownList,
+  Flex,
+  MenuToggle,
+  MenuToggleElement,
+} from "@patternfly/react-core";
+import Icon from "~/components/layout/Icon";
+import ChangeProductOption from "~/components/core/ChangeProductOption";
+import { ROOT } from "~/routes/paths";
+import { _ } from "~/i18n";
+
+/**
+ * Props for the InstallerOptionsMenu component.
+ */
+export type InstallerOptionsMenuProps = {
+  /**
+   * Whether to hide the "Options" text label next to the icon. Useful when
+   * space is limited or when placed in a narrow slot.
+   */
+  hideLabel?: boolean;
+  /**
+   * Whether to include the "Change product" entry in the dropdown list. Set
+   * this to `true` only on pages where including the link for switching to
+   * another product or mode make sense (e.g., the Overview page).
+   */
+  showChangeProductOption?: boolean;
+};
+
+/**
+ * A dropdown menu containing some installer options, such as
+ * product switching and log downloading.
+ */
+export default function InstallerOptionsMenu({
+  hideLabel = false,
+  showChangeProductOption = false,
+}: InstallerOptionsMenuProps) {
+  const [isOpen, setIsOpen] = useState(false);
+  const toggle = () => setIsOpen(!isOpen);
+
+  return (
+    <Dropdown
+      popperProps={{ position: "right", appendTo: () => document.body }}
+      isOpen={isOpen}
+      onOpenChange={toggle}
+      onSelect={toggle}
+      onActionClick={toggle}
+      toggle={(toggleRef: React.Ref<MenuToggleElement>) => (
+        <MenuToggle
+          ref={toggleRef}
+          onClick={toggle}
+          aria-label={_("Options toggle")}
+          isExpanded={isOpen}
+          isFullHeight
+          variant="plain"
+        >
+          <Flex gap={{ default: "gapXs" }} alignItems={{ default: "alignItemsCenter" }}>
+            {!hideLabel && _("Options")} <Icon name="expand_circle_down" />
+          </Flex>
+        </MenuToggle>
+      )}
+    >
+      <DropdownList>
+        {showChangeProductOption && <ChangeProductOption component="dropdownitem" />}
+        <DropdownItem key="download-logs" to={ROOT.logs} download="agama-logs.tar.gz">
+          {_("Download logs")}
+        </DropdownItem>
+      </DropdownList>
+    </Dropdown>
+  );
+}
diff --git a/web/src/components/core/Page.tsx b/web/src/components/core/Page.tsx
index 72aa018ab7..ea4aae464d 100644
--- a/web/src/components/core/Page.tsx
+++ b/web/src/components/core/Page.tsx
@@ -45,17 +45,18 @@ import {
   Title,
   TitleProps,
 } from "@patternfly/react-core";
-import flexStyles from "@patternfly/react-styles/css/utilities/Flex/flex";
-import textStyles from "@patternfly/react-styles/css/utilities/Text/text";
 import { isEmpty, isObject } from "radashi";
-import { _, TranslatedString } from "~/i18n";
 import type { ProgressBackdropProps } from "~/components/core/ProgressBackdrop";
 import ProgressBackdrop from "~/components/core/ProgressBackdrop";
-import Header from "~/components/layout/Header";
+import Header, { HeaderProps } from "~/components/layout/Header";
 import Loading from "~/components/layout/Loading";
-import { Questions } from "../questions";
+import ReviewAndInstallButton from "~/components/core/ReviewAndInstallButton";
+import ProgressStatusMonitor from "~/components/core/ProgressStatusMonitor";
+import Questions from "~/components/questions/Questions";
+import { _, TranslatedString } from "~/i18n";
 
-import type { BreadcrumbProps } from "~/components/core/Breadcrumbs";
+import flexStyles from "@patternfly/react-styles/css/utilities/Flex/flex";
+import textStyles from "@patternfly/react-styles/css/utilities/Text/text";
 
 /**
  * Props accepted by Page.Section
@@ -90,7 +91,7 @@ type ActionProps = {
 
 type SubmitActionProps = {
   /** The id of a <form> the submit button is associated with */
-  form: string;
+  form?: string;
 } & ButtonProps;
 
 const defaultCardProps: CardProps = {
@@ -300,92 +301,14 @@ const Content = ({ children, ...pageSectionProps }: PageSectionProps) => {
   );
 };
 
-/**
- * Props for the minimal page layout.
- */
-interface MinimalLayoutProps {
-  /** Page content */
-  children: React.ReactNode;
-}
-
-/**
- * Minimal page layout with empty masthead.
- */
-const MinimalLayout = ({ children }: MinimalLayoutProps) => {
-  return (
-    <PFPage isContentFilled masthead={<Masthead />}>
-      <PageGroup tabIndex={-1} id="main-content">
-        {children}
-      </PageGroup>
-    </PFPage>
-  );
-};
-
-/**
- * Props for the standard page layout.
- */
-interface StandardLayoutProps {
-  /** Page title shown in header */
-  title?: React.ReactNode;
-  /** Breadcrumb navigation items */
-  breadcrumbs?: BreadcrumbProps[];
-  /** Optional progress tracking configuration */
-  progress?: ProgressBackdropProps;
-  /** Whether to show the Questions component */
-  showQuestions?: boolean;
-  /** Whether to show installer options in the header */
-  showInstallerOptions?: boolean;
-  /** Whether the progress monitor must not be mounted */
-  hideProgressMonitor?: boolean;
-  /** Page content */
-  children?: React.ReactNode;
-}
-
-/**
- * Standard page layout with header, breadcrumbs, and optional progress tracking.
- */
-const StandardLayout = ({
-  progress,
-  children,
-  breadcrumbs,
-  title,
-  showQuestions = true,
-  showInstallerOptions = false,
-  hideProgressMonitor = false,
-}: StandardLayoutProps) => {
-  return (
-    <PFPage
-      isContentFilled
-      masthead={
-        <Header
-          title={title}
-          breadcrumbs={breadcrumbs}
-          showInstallerOptions={showInstallerOptions}
-          hideProgressMonitor={hideProgressMonitor}
-        />
-      }
-    >
-      <Suspense fallback={<Loading />}>
-        <PageGroup tabIndex={-1} id="main-content">
-          {children || <Outlet />}
-          {progress && <ProgressBackdrop {...progress} />}
-        </PageGroup>
-      </Suspense>
-      {showQuestions && <Questions />}
-    </PFPage>
-  );
-};
-
 /**
  * Common props shared by all page variants.
  */
-interface BasePageProps {
+interface BasePageProps extends HeaderProps {
   /** Optional progress tracking configuration */
   progress?: ProgressBackdropProps;
   /** Whether to show the Questions component at the bottom of the page */
   showQuestions?: boolean;
-  /** Whether the progress monitor must not be mounted */
-  hideProgressMonitor?: boolean;
   /** Page content */
   children?: React.ReactNode;
 }
@@ -396,12 +319,6 @@ interface BasePageProps {
 interface StandardPageProps extends BasePageProps {
   /** Layout variant to use */
   variant?: "standard";
-  /** Page title shown in header */
-  title?: React.ReactNode;
-  /** Breadcrumb navigation items */
-  breadcrumbs?: BreadcrumbProps[];
-  /** Whether to show installer options in the header */
-  showInstallerOptions?: boolean;
 }
 
 /**
@@ -412,8 +329,6 @@ interface MinimalPageProps extends BasePageProps {
   variant: "minimal";
   /** Title not available in minimal variant */
   title?: never;
-  /** Breadcrumbs not available in minimal variant */
-  breadcrumbs?: never;
   /** Installer options not available in minimal variant */
   showInstallerOptions?: never;
   /** Whether the progress monitor must not be mounted */
@@ -421,9 +336,67 @@ interface MinimalPageProps extends BasePageProps {
 }
 
 /**
- * All possible Page component props.
+ * Props for the `Page` component.
+ *
+ * Combines the standard and minimal variants with additional slot controls.
+ */
+type PageProps = (StandardPageProps | MinimalPageProps) & {
+  /**
+   * If true, the default component in the start slot
+   * (`<ProgressStatusMonitor />`) will not be rendered.
+   *
+   * Pass a custom `startSlot` to render custom content instead.
+   *
+   * Default: `false` (renders default ProgressStatusMonitor if no `startSlot` provided)
+   */
+  noDefaultStartSlot?: boolean;
+
+  /**
+   * If true, the default component in the end slot
+   * (`<ReviewAndInstallButton />`) will not be rendered.
+   *
+   * Pass a custom `endSlot` to render custom content instead.
+   *
+   * Default: `false` (renders default ReviewAndInstallButton if no `endSlot` provided)
+   */
+  noDefaultEndSlot?: boolean;
+};
+
+/**
+ * Minimal page layout with empty masthead.
+ */
+const MinimalLayout = ({ children }: Omit<MinimalPageProps, "variant">) => {
+  return (
+    <PFPage isContentFilled masthead={<Masthead />}>
+      <PageGroup tabIndex={-1} id="main-content">
+        {children}
+      </PageGroup>
+    </PFPage>
+  );
+};
+
+/**
+ * Standard page layout with header, optional progress tracking, and optional
+ * qestions rendering.
  */
-type PageProps = StandardPageProps | MinimalPageProps;
+const StandardLayout = ({
+  progress,
+  children,
+  showQuestions = true,
+  ...headerProps
+}: Omit<StandardPageProps, "variant">) => {
+  return (
+    <PFPage isContentFilled masthead={<Header {...headerProps} />}>
+      <Suspense fallback={<Loading />}>
+        <PageGroup tabIndex={-1} id="main-content">
+          {children || <Outlet />}
+          {progress && <ProgressBackdrop {...progress} />}
+        </PageGroup>
+      </Suspense>
+      {showQuestions && <Questions />}
+    </PFPage>
+  );
+};
 
 /**
  * Root container for Agama pages.
@@ -479,28 +452,23 @@ type PageProps = StandardPageProps | MinimalPageProps;
  * ```
  */
 const Page = ({
-  title,
-  breadcrumbs,
-  progress,
   variant = "standard",
-  showQuestions = true,
-  showInstallerOptions = false,
-  hideProgressMonitor = false,
+  startSlot,
+  endSlot,
+  noDefaultStartSlot,
+  noDefaultEndSlot,
   children,
+  ...props
 }: PageProps): React.ReactNode => {
   if (variant === "minimal") {
     return <MinimalLayout>{children}</MinimalLayout>;
   }
 
+  const startSlotContent = startSlot ?? (noDefaultStartSlot ? null : <ProgressStatusMonitor />);
+  const endSlotContent = endSlot ?? (noDefaultEndSlot ? null : <ReviewAndInstallButton />);
+
   return (
-    <StandardLayout
-      progress={progress}
-      breadcrumbs={breadcrumbs}
-      title={title}
-      showQuestions={showQuestions}
-      showInstallerOptions={showInstallerOptions}
-      hideProgressMonitor={hideProgressMonitor}
-    >
+    <StandardLayout {...props} startSlot={startSlotContent} endSlot={endSlotContent}>
       {children || <Outlet />}
     </StandardLayout>
   );
diff --git a/web/src/components/core/ProgressStatusMonitor.tsx b/web/src/components/core/ProgressStatusMonitor.tsx
index d6e5552260..54f669bedd 100644
--- a/web/src/components/core/ProgressStatusMonitor.tsx
+++ b/web/src/components/core/ProgressStatusMonitor.tsx
@@ -23,11 +23,11 @@
 import React from "react";
 import { Button, Divider, Flex, Popover, Stack } from "@patternfly/react-core";
 import Text from "~/components/core/Text";
-import type { Progress as StatusProgress } from "~/model/status";
 import { useStatus } from "~/hooks/model/status";
-import displayStyles from "@patternfly/react-styles/css/utilities/Display/display";
 import { sprintf } from "sprintf-js";
 import { _, N_, n_ } from "~/i18n";
+import type { Progress as StatusProgress } from "~/model/status";
+import displayStyles from "@patternfly/react-styles/css/utilities/Display/display";
 
 type DetailProps = {
   tasks: StatusProgress[];
diff --git a/web/src/components/core/ResourceNotFound.test.tsx b/web/src/components/core/ResourceNotFound.test.tsx
index a656f9da1e..9ab5b24c3c 100644
--- a/web/src/components/core/ResourceNotFound.test.tsx
+++ b/web/src/components/core/ResourceNotFound.test.tsx
@@ -30,7 +30,7 @@ import { _ } from "~/i18n";
 describe("ResourceNotFound", () => {
   it("renders the default title when none is given", () => {
     installerRender(<ResourceNotFound linkText={_("Go to homepage")} linkPath={ROOT.root} />);
-    screen.getByRole("heading", { name: "Resource not found or lost", level: 3 });
+    screen.getByRole("heading", { name: "Resource not found or lost", level: 2 });
   });
 
   it("renders the given title", () => {
@@ -41,7 +41,7 @@ describe("ResourceNotFound", () => {
         linkPath={ROOT.root}
       />,
     );
-    screen.getByRole("heading", { name: "Not found", level: 3 });
+    screen.getByRole("heading", { name: "Not found", level: 2 });
   });
 
   it("renders the default body when none is given", () => {
diff --git a/web/src/components/core/ResourceNotFound.tsx b/web/src/components/core/ResourceNotFound.tsx
index 7c89557203..3b9a82f102 100644
--- a/web/src/components/core/ResourceNotFound.tsx
+++ b/web/src/components/core/ResourceNotFound.tsx
@@ -45,7 +45,7 @@ export default function ResourceNotFound({
   linkPath,
 }: ResourceNotFoundProps) {
   return (
-    <EmptyState headingLevel="h3" titleText={title} icon={() => <Icon name="error" />}>
+    <EmptyState headingLevel="h2" titleText={title} icon={() => <Icon name="error" />}>
       <EmptyStateBody>{body}</EmptyStateBody>
       {linkText && linkPath && (
         <EmptyStateFooter>
diff --git a/web/src/components/core/ReviewAndInstallButton.test.tsx b/web/src/components/core/ReviewAndInstallButton.test.tsx
index dc181aca26..e16c68df1c 100644
--- a/web/src/components/core/ReviewAndInstallButton.test.tsx
+++ b/web/src/components/core/ReviewAndInstallButton.test.tsx
@@ -22,39 +22,12 @@
 
 import React from "react";
 import { screen } from "@testing-library/react";
-import { installerRender, mockRoutes } from "~/test-utils";
-import { PRODUCT, ROOT, STORAGE } from "~/routes/paths";
+import { installerRender } from "~/test-utils";
 import ReviewAndInstallButton from "./ReviewAndInstallButton";
 
-describe("InstallButton", () => {
-  describe("when not in an extended side paths", () => {
-    beforeEach(() => {
-      mockRoutes(STORAGE.addPartition);
-    });
-
-    it("renders the button with 'Review and install' label ", () => {
-      installerRender(<ReviewAndInstallButton />);
-      screen.getByRole("button", { name: "Review and install" });
-    });
-  });
-
-  describe.each([
-    ["overview", ROOT.root],
-    ["overview (full route)", ROOT.overview],
-    ["login", ROOT.login],
-    ["product selection", PRODUCT.changeProduct],
-    ["installation progress", ROOT.installationProgress],
-    ["installation finished", ROOT.installationFinished],
-    ["installation exit", ROOT.installationExit],
-    ["storage progress", STORAGE.progress],
-  ])(`when rendering %s screen`, (_, path) => {
-    beforeEach(() => {
-      mockRoutes(path);
-    });
-
-    it("renders nothing", () => {
-      const { container } = installerRender(<ReviewAndInstallButton />);
-      expect(container).toBeEmptyDOMElement();
-    });
+describe("ReviewAndInstallButton", () => {
+  it("renders the button with 'Review and install' label ", () => {
+    installerRender(<ReviewAndInstallButton />);
+    screen.getByRole("button", { name: "Review and install" });
   });
 });
diff --git a/web/src/components/core/ReviewAndInstallButton.tsx b/web/src/components/core/ReviewAndInstallButton.tsx
index 712d8b1a6f..48a08c3ef7 100644
--- a/web/src/components/core/ReviewAndInstallButton.tsx
+++ b/web/src/components/core/ReviewAndInstallButton.tsx
@@ -22,8 +22,8 @@
 
 import React from "react";
 import { Button, ButtonProps } from "@patternfly/react-core";
-import { useLocation, useNavigate } from "react-router";
-import { EXTENDED_SIDE_PATHS, ROOT } from "~/routes/paths";
+import { useNavigate } from "react-router";
+import { ROOT } from "~/routes/paths";
 import { _ } from "~/i18n";
 
 /**
@@ -35,18 +35,11 @@ import { _ } from "~/i18n";
  * review installation details before proceeding. The label "Review and Install"
  * is intentional, indicating that users will first be presented with a summary
  * screen before they can proceed with the installation.
- *
- * @todo Refactor component behavior
- * - Replace route-based visibility logic with explicit prop-based control now
- *   that pages manage their own layouts
  */
 export default function ReviewAndInstallButton(
   props: Omit<ButtonProps, "onClick"> & { onClickWithIssues?: () => void },
 ) {
   const navigate = useNavigate();
-  const location = useLocation();
-
-  if (EXTENDED_SIDE_PATHS.includes(location.pathname)) return;
 
   const navigateToConfirmation = () => navigate(ROOT.overview);
 
diff --git a/web/src/components/core/SelectableDataTable.test.tsx b/web/src/components/core/SelectableDataTable.test.tsx
index c8434b0a88..f6e5ecb621 100644
--- a/web/src/components/core/SelectableDataTable.test.tsx
+++ b/web/src/components/core/SelectableDataTable.test.tsx
@@ -287,6 +287,9 @@ describe("SelectableDataTable", () => {
     expect(sdaChild).not.toBeNull();
   });
 
+  it.todo("allows selectionMode#none");
+  it.todo("renders nothing for actions column if actions is an empty collection");
+
   describe("when not providing a custom item equality function", () => {
     const onSelectionChange = jest.fn();
 
diff --git a/web/src/components/core/SelectableDataTable.tsx b/web/src/components/core/SelectableDataTable.tsx
index 52957614ba..2ba0bf1d0a 100644
--- a/web/src/components/core/SelectableDataTable.tsx
+++ b/web/src/components/core/SelectableDataTable.tsx
@@ -136,10 +136,11 @@ export type SelectableDataTableProps<T = any> = {
   /**
    * Determines the selection behavior of the table.
    *
+   * - `"single"`: Does not allow selection.
    * - `"single"`: Allows selecting only one item at a time (radio buttons).
    * - `"multiple"`: Allows selecting multiple items (checkboxes).
    */
-  selectionMode?: "single" | "multiple";
+  selectionMode?: "none" | "single" | "multiple";
 
   /**
    * Data items to be rendered as rows in the table.
@@ -465,6 +466,7 @@ export default function SelectableDataTable({
 }: SelectableDataTableProps) {
   const [expandedItemsKeys, setExpandedItemsKeys] = useState(initialExpandedKeys);
   const selection = sanitizeSelection(itemsSelected, selectionMode);
+  const allowSelection = selectionMode !== "none";
   const allowMultiple = selectionMode === "multiple";
   const isItemSelected = (item: object) => {
     const selected = selection.find((selectionItem) => {
@@ -515,7 +517,7 @@ export default function SelectableDataTable({
     return (
       <Tr key={rowIndex} isExpanded={isExpanded} className={itemClassNames(item)}>
         <Td />
-        <Td select={itemSelectable(item) ? selectProps : undefined} />
+        <Td select={allowSelection && (itemSelectable(item) ? selectProps : undefined)} />
         {columns?.map((c, index) => (
           <Td key={index} dataLabel={c.name} className={c.classNames} {...c.pfTdProps}>
             <ExpandableRowContent>{c.value(item)}</ExpandableRowContent>
@@ -541,6 +543,7 @@ export default function SelectableDataTable({
       isExpanded: isItemExpanded(itemKey),
       onToggle: () => toggleExpanded(itemKey),
     };
+    const actions = itemActions?.(item);
 
     const selectProps = {
       rowIndex,
@@ -560,16 +563,16 @@ export default function SelectableDataTable({
       <Tbody key={rowIndex} isExpanded={isItemExpanded(itemKey)}>
         <Tr className={itemClassNames(item)}>
           <Td expand={expandProps} />
-          <Td select={itemSelectable(item) ? selectProps : undefined} />
+          <Td select={allowSelection && (itemSelectable(item) ? selectProps : undefined)} />
           {columns?.map((c, index) => (
             <Td key={index} dataLabel={c.name} className={c.classNames} {...c.pfTdProps}>
               {c.value(item)}
             </Td>
           ))}
-          {itemActions && (
+          {!isEmpty(actions) && (
             <Td isActionCell>
               <ActionsColumn
-                items={itemActions(item)}
+                items={actions}
                 actionsToggle={({ toggleRef, onToggle }) => (
                   <MenuToggle
                     ref={toggleRef}
diff --git a/web/src/components/core/SwitchEnhanced.test.tsx b/web/src/components/core/SwitchEnhanced.test.tsx
index 8fde020b6c..5cfd9a48b0 100644
--- a/web/src/components/core/SwitchEnhanced.test.tsx
+++ b/web/src/components/core/SwitchEnhanced.test.tsx
@@ -37,9 +37,9 @@ describe("SwitchEnhanced", () => {
       />,
     );
 
-    const switchElement = screen.getByRole("switch");
-    const label = screen.getByText(/Use for installation only/);
-    const description = screen.getByText(/Not persisted to the installed system/);
+    const switchElement = screen.getByRole("switch", { name: "Use for installation only" });
+    const label = screen.getByText("Use for installation only");
+    const description = screen.getByText("Not persisted to the installed system.");
 
     // Ensure aria-labelledby and aria-describedby point to the correct elements
     expect(switchElement).toHaveAttribute("aria-labelledby", label.id);
@@ -62,9 +62,16 @@ describe("SwitchEnhanced", () => {
 
     const { user } = plainRender(<SwitchEnhancedTestWrapper />);
 
-    const switchElement = screen.getByRole("switch");
+    const switchElement = screen.getByRole("switch", { name: "Use for installation only" });
     expect(switchElement).not.toBeChecked();
     await user.click(switchElement);
     expect(switchElement).toBeChecked();
+
+    // Clicking on label should work too
+    const label = screen.getByText("Use for installation only");
+    await user.click(label);
+    expect(switchElement).not.toBeChecked();
+    await user.click(label);
+    expect(switchElement).toBeChecked();
   });
 });
diff --git a/web/src/components/core/SwitchEnhanced.tsx b/web/src/components/core/SwitchEnhanced.tsx
index 0a91054dfe..aab03ed17e 100644
--- a/web/src/components/core/SwitchEnhanced.tsx
+++ b/web/src/components/core/SwitchEnhanced.tsx
@@ -56,17 +56,29 @@ type SwitchEnhancedProps = Omit<
  * ```
  */
 export default function SwitchEnhanced({ description, label, ...props }: SwitchEnhancedProps) {
+  const switchId = useId();
+  // NOTE: `labelId` isn't actually needed because the usage of `label#htmlFor`.
+  // It remains to satisfy PatternFly/Switch component, which requires at least
+  // one of `label`, `aria-labelledby`, or `aria-label` props, None of them
+  // strictly needed with the approach followed here.
   const labelId = useId();
   const descriptionId = useId();
 
   return (
-    <Flex flexWrap={{ default: "nowrap" }}>
+    <Flex flexWrap={{ default: "nowrap" }} alignItems={{ default: "alignItemsFlexStart" }}>
       <FlexItem>
-        <Switch {...props} aria-labelledby={labelId} aria-describedby={descriptionId} />
+        <Switch
+          {...props}
+          id={switchId}
+          aria-labelledby={labelId}
+          aria-describedby={descriptionId}
+        />
       </FlexItem>
       <FlexItem>
-        <Content isEditorial id={labelId}>
-          {label}
+        <Content isEditorial>
+          <label id={labelId} htmlFor={switchId}>
+            {label}
+          </label>
         </Content>
         <Content component="small" id={descriptionId}>
           {description}
diff --git a/web/src/components/core/index.ts b/web/src/components/core/index.ts
index 7ad17162c9..320e9a009c 100644
--- a/web/src/components/core/index.ts
+++ b/web/src/components/core/index.ts
@@ -41,7 +41,7 @@ export { default as PasswordInput } from "./PasswordInput";
 export { default as TreeTable } from "./TreeTable";
 export { default as Link } from "./Link";
 export { default as EmptyState } from "./EmptyState";
-export { default as InstallerOptions } from "./InstallerOptions";
+export { default as InstallerL10nOptions } from "./InstallerL10nOptions";
 export { default as IssuesDrawer } from "./IssuesDrawer";
 export { default as SelectWrapper } from "./SelectWrapper";
 export { default as NestedContent } from "./NestedContent";
diff --git a/web/src/components/l10n/L10nPage.test.tsx b/web/src/components/l10n/L10nPage.test.tsx
index 0e1d2a98c5..93badb29a5 100644
--- a/web/src/components/l10n/L10nPage.test.tsx
+++ b/web/src/components/l10n/L10nPage.test.tsx
@@ -46,7 +46,9 @@ const timezones: Timezone[] = [
   { id: "Europe/Madrid", parts: ["Europe", "Madrid"], country: "Spain", utcOffset: 120 },
 ];
 
-jest.mock("~/components/core/InstallerOptions", () => () => <div>InstallerOptions Mock</div>);
+jest.mock("~/components/core/InstallerL10nOptions", () => () => (
+  <div>InstallerL10nOptions Mock</div>
+));
 
 jest.mock("~/hooks/model/system/l10n", () => ({
   ...jest.requireActual("~/hooks/model/system/l10n"),
@@ -76,7 +78,7 @@ it("renders an clarification about settings", () => {
   installerRender(<L10nPage />);
   screen.getByText(/These are the settings for the product to install/);
   screen.getByText(/The installer language and keyboard layout can be adjusted via/);
-  screen.getByText("InstallerOptions Mock");
+  screen.getByText("InstallerL10nOptions Mock");
 });
 
 it("renders a section for configuring the language", () => {
diff --git a/web/src/components/l10n/L10nPage.tsx b/web/src/components/l10n/L10nPage.tsx
index d22cb72ab2..108b21359b 100644
--- a/web/src/components/l10n/L10nPage.tsx
+++ b/web/src/components/l10n/L10nPage.tsx
@@ -22,7 +22,7 @@
 
 import React from "react";
 import { Button, Content, Grid, GridItem } from "@patternfly/react-core";
-import { InstallerOptions, Link, Page } from "~/components/core";
+import { InstallerL10nOptions, Link, Page } from "~/components/core";
 import { L10N as PATHS } from "~/routes/paths";
 import { localConnection } from "~/utils";
 import { useProposal } from "~/hooks/model/proposal/l10n";
@@ -49,7 +49,7 @@ const InstallerL10nSettingsInfo = () => {
   return (
     <small>
       {infoStart}{" "}
-      <InstallerOptions
+      <InstallerL10nOptions
         toggle={({ onClick }) => (
           <Button variant="link" isInline onClick={onClick}>
             {infoLink}
diff --git a/web/src/components/layout/Header.test.tsx b/web/src/components/layout/Header.test.tsx
index 893b3f06b2..c957f048d9 100644
--- a/web/src/components/layout/Header.test.tsx
+++ b/web/src/components/layout/Header.test.tsx
@@ -21,12 +21,10 @@
  */
 
 import React from "react";
-import { screen, within } from "@testing-library/react";
-import { plainRender, installerRender } from "~/test-utils";
-import { System } from "~/model/system/network";
+import { screen } from "@testing-library/react";
+import { plainRender } from "~/test-utils";
+import type { Product } from "~/model/system";
 import Header from "./Header";
-import { useSystem } from "~/hooks/model/system";
-import { Product } from "~/model/system";
 
 const tumbleweed: Product = {
   id: "Tumbleweed",
@@ -36,36 +34,6 @@ const tumbleweed: Product = {
   modes: [],
 };
 
-const microos: Product = {
-  id: "MicroOS",
-  name: "openSUSE MicroOS",
-  description: "MicroOS description",
-  registration: false,
-  modes: [],
-};
-
-const network: System = {
-  connections: [],
-  devices: [],
-  state: {
-    connectivity: true,
-    copyNetwork: true,
-    networkingEnabled: true,
-    wirelessEnabled: true,
-  },
-  accessPoints: [],
-};
-
-jest.mock("~/components/core/InstallerOptions", () => () => <div>Installer Options Mock</div>);
-jest.mock("~/components/core/ReviewAndInstallButton", () => () => (
-  <div>ReviewAndInstall Button Mock</div>
-));
-
-jest.mock("~/hooks/model/system", () => ({
-  ...jest.requireActual("~/hooks/model/system"),
-  useSystem: (): ReturnType<typeof useSystem> => ({ products: [tumbleweed, microos], network }),
-}));
-
 jest.mock("~/hooks/model/config/product", () => ({
   ...jest.requireActual("~/hooks/model/config/product"),
   useProductInfo: (): Product => tumbleweed,
@@ -82,38 +50,30 @@ describe("Header", () => {
     screen.getByRole("link", { name: "Skip to content" });
   });
 
-  it("does not render skip to content link when showSkipToContent is false", async () => {
-    plainRender(<Header showSkipToContent={false} />);
+  it("does not render skip to content link when hideSkipToContent is truthy", async () => {
+    const { rerender } = plainRender(<Header hideSkipToContent />);
     expect(screen.queryByRole("link", { name: "Skip to content" })).toBeNull();
+    rerender(<Header hideSkipToContent={false} />);
+    screen.queryByRole("link", { name: "Skip to content" });
   });
 
-  it("mounts the Install button", () => {
-    plainRender(<Header />);
-    screen.getByText("ReviewAndInstall Button Mock");
-  });
-
-  it("mounts installer options by default", () => {
-    plainRender(<Header showInstallerOptions />);
-    screen.getByText("Installer Options Mock");
-  });
-
-  it("mounts installer options when showInstallerOptions=true", () => {
-    plainRender(<Header showInstallerOptions />);
-    screen.getByText("Installer Options Mock");
-  });
-
-  it("does not mount installer options when showInstallerOptions=false", () => {
-    plainRender(<Header showInstallerOptions={false} />);
-    expect(screen.queryByText("Installer Options Mock")).toBeNull();
-  });
+  it("renders given content for slots", () => {
+    plainRender(
+      <Header
+        title="Storage"
+        startSlot={<div role="progressbar" aria-label="Installation progress" />}
+        centerSlot={
+          <div role="menu" aria-label="Page actions">
+            <button role="menuitem">Export configuration</button>
+            <button role="menuitem">Advanced settings</button>
+          </div>
+        }
+        endSlot={<button>Install</button>}
+      />,
+    );
 
-  it("renders an options dropdown by default", async () => {
-    const { user } = installerRender(<Header />);
-    expect(screen.queryByRole("menu")).toBeNull();
-    const toggler = screen.getByRole("button", { name: "Options toggle" });
-    await user.click(toggler);
-    const menu = await screen.findByRole("menu");
-    within(menu).getByRole("menuitem", { name: "Change product" });
-    within(menu).getByRole("menuitem", { name: "Download logs" });
+    screen.getByRole("progressbar", { name: "Installation progress" });
+    screen.getByRole("menu", { name: "Page actions" });
+    screen.getByRole("button", { name: "Install" });
   });
 });
diff --git a/web/src/components/layout/Header.tsx b/web/src/components/layout/Header.tsx
index 1e6ed12f34..d7fdef4a00 100644
--- a/web/src/components/layout/Header.tsx
+++ b/web/src/components/layout/Header.tsx
@@ -20,90 +20,102 @@
  * find current contact information at www.suse.com.
  */
 
-import React, { useState } from "react";
+import React from "react";
 import {
-  Dropdown,
-  DropdownItem,
-  DropdownList,
   Masthead,
   MastheadContent,
   MastheadMain,
-  MenuToggle,
-  MenuToggleElement,
   Title,
   Toolbar,
   ToolbarContent,
   ToolbarGroup,
   ToolbarItem,
 } from "@patternfly/react-core";
-import { Icon } from "~/components/layout";
-import {
-  ChangeProductOption,
-  InstallerOptions,
-  ReviewAndInstallButton,
-  SkipTo,
-} from "~/components/core";
-import ProgressStatusMonitor from "~/components/core/ProgressStatusMonitor";
+import Icon from "~/components/layout/Icon";
 import Breadcrumbs from "~/components/core/Breadcrumbs";
+import { SkipTo } from "~/components/core";
 import { useProductInfo } from "~/hooks/model/config/product";
 import { ROOT } from "~/routes/paths";
-import { _ } from "~/i18n";
 
 import type { BreadcrumbProps } from "~/components/core/Breadcrumbs";
 
 import spacingStyles from "@patternfly/react-styles/css/utilities/Spacing/spacing";
+import textStyles from "@patternfly/react-styles/css/utilities/Text/text";
 
+/**
+ * Props for the Header component.
+ *
+ * The layout follows a flexible horizontal structure where the primary content
+ * (Title/Breadcrumbs) is on the left, and up to three slots are grouped at the
+ * end of the toolbar:
+ *
+ * [Title | Breadcrumbs]...........[startSlot] [centerSlot] [endSlot]
+ *
+ * openSUSE Tumbleweed..........................Option v | English/US
+ */
 export type HeaderProps = {
   /**
    * Page title rendered as the main heading (h1).
    *
-   * When provided, the title is shown instead of breadcrumb navigation.
-   * When omitted, breadcrumbs are rendered and the last breadcrumb
-   * represents the current page.
+   * If provided, the title takes precedence over breadcrumbs.
+   * If omitted, breadcrumbs are rendered instead, and the final
+   * item acts as the main heading (h1).
    */
   title?: React.ReactNode;
-  /** Whether the "Skip to content" link should be mounted */
-  showSkipToContent?: boolean;
-  /** Whether the installer options link should be mounted */
-  showInstallerOptions?: boolean;
-  /** Breadcrumb navigation items */
+
+  /** Breadcrumb navigation items shown when 'title' is not provided. */
   breadcrumbs?: BreadcrumbProps[];
-  /** Whether the progress monitor must not be mounted */
-  hideProgressMonitor?: boolean;
-};
 
-const OptionsDropdown = () => {
-  const [isOpen, setIsOpen] = useState(false);
-  const toggle = () => setIsOpen(!isOpen);
+  /**
+   * The first slot in the trailing actions group.
+   *
+   * While intended for status indicators like the progress monitor,
+   * it is a flexible container for any page-specific utility.
+   */
+  startSlot?: React.ReactNode;
 
-  return (
-    <Dropdown
-      popperProps={{ position: "right", appendTo: () => document.body }}
-      isOpen={isOpen}
-      onOpenChange={toggle}
-      onSelect={toggle}
-      onActionClick={toggle}
-      toggle={(toggleRef: React.Ref<MenuToggleElement>) => (
-        <MenuToggle
-          ref={toggleRef}
-          onClick={toggle}
-          aria-label={_("Options toggle")}
-          isExpanded={isOpen}
-          isFullHeight
-          variant="plain"
-        >
-          <Icon name="expand_circle_down" />
-        </MenuToggle>
-      )}
-    >
-      <DropdownList>
-        <ChangeProductOption />
-        <DropdownItem key="download-logs" to={ROOT.logs} download="agama-logs.tar.gz">
-          {_("Download logs")}
-        </DropdownItem>
-      </DropdownList>
-    </Dropdown>
-  );
+  /**
+   * The middle slot in the trailing actions group, positioned between
+   * the start and end slots.
+   *
+   * This area is typically used for contextual actions, such as secondary
+   * navigation or configuration menus. Like its sibling slots, it accepts any
+   * React node to provide enough flexibility to fulfill page requirements.
+   *
+   * @example
+   * ```tsx
+   * <Header
+   *   title="Storage"
+   *   centerSlot={
+   *     <Dropdown>
+   *       <DropdownItem>Advanced settings</DropdownItem>
+   *       <DropdownItem>Export configuration</DropdownItem>
+   *     </Dropdown>
+   *   }
+   * />
+   * ```
+   */
+  centerSlot?: React.ReactNode;
+
+  /**
+   * The final slot at the very edge of the header.
+   *
+   * This is intended for content that requires maximum discoverability.
+   * Like the other slots, it accepts any React node to accommodate various
+   * interaction patterns, though it is often a button or a link.
+   *
+   * **Common Use Cases:**
+   * - Global navigation links (e.g., "Install").
+   * - Button triggers for high-priority settings (e.g., L10n settings).
+   * - Primary call-to-action buttons for the current workflow.
+   *
+   * @example
+   * <Header endSlot={<Link to="/overview">Review and Install</Link>} />
+   */
+  endSlot?: React.ReactNode;
+
+  /** Whether to hide the "Skip to content" accessibility link. */
+  hideSkipToContent?: boolean;
 };
 
 /**
@@ -114,18 +126,21 @@ const OptionsDropdown = () => {
 export default function Header({
   title,
   breadcrumbs,
-  showSkipToContent = true,
-  showInstallerOptions = true,
-  hideProgressMonitor = false,
+  startSlot,
+  centerSlot,
+  endSlot,
+  hideSkipToContent = false,
 }: HeaderProps): React.ReactNode {
   const product = useProductInfo();
 
   return (
     <Masthead>
       <MastheadMain className={spacingStyles.pXs}>
-        {showSkipToContent && <SkipTo />}
+        {!hideSkipToContent && <SkipTo />}
         {title ? (
-          <Title headingLevel="h1">{title}</Title>
+          <Title headingLevel="h1" className={textStyles.fontSizeXl}>
+            {title}
+          </Title>
         ) : (
           <Breadcrumbs>
             {product && breadcrumbs && (
@@ -144,13 +159,12 @@ export default function Header({
               />
             )}
             {breadcrumbs &&
-              breadcrumbs.map(({ label, path }, i) => (
+              breadcrumbs.map((props, i) => (
                 <Breadcrumbs.Item
                   isEditorial={i === 0}
                   key={i}
-                  label={label}
-                  path={path}
                   isCurrent={i === breadcrumbs.length - 1}
+                  {...props}
                 />
               ))}
           </Breadcrumbs>
@@ -160,22 +174,9 @@ export default function Header({
         <Toolbar isFullHeight>
           <ToolbarContent>
             <ToolbarGroup align={{ default: "alignEnd" }} columnGap={{ default: "columnGapXs" }}>
-              {!hideProgressMonitor && (
-                <ToolbarItem>
-                  <ProgressStatusMonitor />
-                </ToolbarItem>
-              )}
-              {showInstallerOptions && (
-                <ToolbarItem>
-                  <InstallerOptions />
-                </ToolbarItem>
-              )}
-              <ToolbarItem>
-                <ReviewAndInstallButton />
-              </ToolbarItem>
-              <ToolbarItem>
-                <OptionsDropdown />
-              </ToolbarItem>
+              {startSlot && <ToolbarItem>{startSlot}</ToolbarItem>}
+              {centerSlot && <ToolbarItem>{centerSlot}</ToolbarItem>}
+              {endSlot && <ToolbarItem>{endSlot}</ToolbarItem>}
             </ToolbarGroup>
           </ToolbarContent>
         </Toolbar>
diff --git a/web/src/components/layout/Icon.tsx b/web/src/components/layout/Icon.tsx
index 418da2f9da..aac0035336 100644
--- a/web/src/components/layout/Icon.tsx
+++ b/web/src/components/layout/Icon.tsx
@@ -37,6 +37,7 @@ import ChevronRight from "@icons/chevron_right.svg?component";
 import Delete from "@icons/delete.svg?component";
 import DoneAll from "@icons/done_all.svg?component";
 import DeployedCodeUpdate from "@icons/deployed_code_update.svg?component";
+import Download from "@icons/download.svg?component";
 import EditSquare from "@icons/edit_square.svg?component";
 import Emergency from "@icons/emergency.svg?component";
 import Error from "@icons/error.svg?component";
@@ -83,6 +84,7 @@ const icons = {
   delete: Delete,
   done_all: DoneAll,
   deployed_code_update: DeployedCodeUpdate,
+  download: Download,
   edit_square: EditSquare,
   emergency: Emergency,
   error: Error,
diff --git a/web/src/components/overview/InstallerOptionsSection.tsx b/web/src/components/overview/InstallerOptionsSection.tsx
new file mode 100644
index 0000000000..310d156672
--- /dev/null
+++ b/web/src/components/overview/InstallerOptionsSection.tsx
@@ -0,0 +1,49 @@
+/*
+ * Copyright (c) [2025-2026] SUSE LLC
+ *
+ * All Rights Reserved.
+ *
+ * This program is free software; you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the Free
+ * Software Foundation; either version 2 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 General Public License for
+ * more details.
+ *
+ * You should have received a copy of the GNU General Public License along
+ * with this program; if not, contact SUSE LLC.
+ *
+ * To contact SUSE LLC about this file by physical or electronic mail, you may
+ * find current contact information at www.suse.com.
+ */
+
+import React from "react";
+import { Button, Card, CardBody, Flex } from "@patternfly/react-core";
+import { ChangeProductOption } from "../core";
+import Icon from "~/components/layout/Icon";
+import { ROOT } from "~/routes/paths";
+import { _ } from "~/i18n";
+
+export default function InstallerOptionsSection() {
+  return (
+    <Card variant="secondary">
+      <CardBody>
+        <Flex
+          gap={{ default: "gapXs" }}
+          direction={{ default: "column" }}
+          alignItems={{ default: "alignItemsFlexStart" }}
+        >
+          <ChangeProductOption variant="link" showIcon />
+          <Button component="a" href={ROOT.logs} variant="link" download="agama-logs.tar.gz">
+            <Flex gap={{ default: "gapXs" }} alignItems={{ default: "alignItemsCenter" }}>
+              <Icon name="download" /> {_("Download logs")}
+            </Flex>
+          </Button>
+        </Flex>
+      </CardBody>
+    </Card>
+  );
+}
diff --git a/web/src/components/overview/OverviewPage.tsx b/web/src/components/overview/OverviewPage.tsx
index e0b6f3f37a..a65063d2af 100644
--- a/web/src/components/overview/OverviewPage.tsx
+++ b/web/src/components/overview/OverviewPage.tsx
@@ -21,21 +21,27 @@
  */
 
 import React, { useDeferredValue, useState } from "react";
+import { isEmpty } from "radashi";
+import { sprintf } from "sprintf-js";
 import { Navigate } from "react-router";
 import {
   Button,
   Content,
   Divider,
   Flex,
+  FlexItem,
   Grid,
   GridItem,
   HelperText,
   HelperTextItem,
+  Stack,
 } from "@patternfly/react-core";
 import Page from "~/components/core/Page";
 import Text from "~/components/core/Text";
 import Popup from "~/components/core/Popup";
 import PotentialDataLossAlert from "~/components/storage/PotentialDataLossAlert";
+import InstallerL10nOptions from "~/components/core/InstallerL10nOptions";
+import InstallerOptionsMenu from "~/components/core/InstallerOptionsMenu";
 import InstallationSettings from "~/components/overview/InstallationSettings";
 import SystemInformationSection from "~/components/overview/SystemInformationSection";
 import ProductLogo from "~/components/product/ProductLogo";
@@ -44,8 +50,6 @@ import { useProductInfo } from "~/hooks/model/config/product";
 import { useIssues } from "~/hooks/model/issue";
 import { PRODUCT } from "~/routes/paths";
 import { useDestructiveActions } from "~/hooks/use-destructive-actions";
-import { isEmpty } from "radashi";
-import { sprintf } from "sprintf-js";
 import { _ } from "~/i18n";
 
 import type { Product } from "~/types/software";
@@ -132,7 +136,12 @@ const OverviewPageContent = ({ product }) => {
           <ProductLogo product={product} width="40px" /> {product.name}
         </>
       }
-      showInstallerOptions
+      endSlot={
+        <>
+          <InstallerL10nOptions />
+          <InstallerOptionsMenu hideLabel showChangeProductOption />
+        </>
+      }
     >
       <Page.Content>
         <Flex gap={{ default: "gapMd" }} direction={{ default: "column" }}>
@@ -152,40 +161,54 @@ const OverviewPageContent = ({ product }) => {
           <Divider />
           <Grid hasGutter>
             <GridItem sm={12} md={8}>
-              <InstallationSettings />
+              <Stack hasGutter>
+                <div style={{ flex: 1 }}>
+                  <InstallationSettings />
+                </div>
+                <Flex
+                  direction={{ default: "column" }}
+                  alignItems={{ default: "alignItemsFlexStart" }}
+                >
+                  <FlexItem grow={{ default: "grow" }} />
+                  <FlexItem>
+                    <Button
+                      size="lg"
+                      variant={hasDestructiveActions ? "danger" : "primary"}
+                      onClick={onInstallClick}
+                      isDisabled={hasIssues || !isReady}
+                    >
+                      <Text isBold>{getInstallButtonText()}</Text>
+                    </Button>
+                  </FlexItem>
+
+                  {!isReady && (
+                    <FlexItem>
+                      <HelperText>
+                        <HelperTextItem variant="indeterminate">
+                          {_("Wait until current operations are completed.")}
+                        </HelperTextItem>
+                      </HelperText>
+                    </FlexItem>
+                  )}
+
+                  {hasIssues && isReady && (
+                    <FlexItem>
+                      <HelperText>
+                        <HelperTextItem variant="warning">
+                          {_(
+                            "You need to fix any invalid settings before proceeding with the installation.",
+                          )}
+                        </HelperTextItem>
+                      </HelperText>
+                    </FlexItem>
+                  )}
+                </Flex>
+              </Stack>
             </GridItem>
             <GridItem sm={12} md={4}>
               <SystemInformationSection />
             </GridItem>
           </Grid>
-          <Flex direction={{ default: "column" }} alignItems={{ default: "alignItemsFlexStart" }}>
-            <Button
-              size="lg"
-              variant={hasDestructiveActions ? "danger" : "primary"}
-              onClick={onInstallClick}
-              isDisabled={hasIssues || !isReady}
-            >
-              <Text isBold>{getInstallButtonText()}</Text>
-            </Button>
-
-            {!isReady && (
-              <HelperText>
-                <HelperTextItem variant="indeterminate">
-                  {_("Wait until current operations are completed.")}
-                </HelperTextItem>
-              </HelperText>
-            )}
-
-            {hasIssues && isReady && (
-              <HelperText>
-                <HelperTextItem variant="warning">
-                  {_(
-                    "You need to fix any invalid settings before proceeding with the installation.",
-                  )}
-                </HelperTextItem>
-              </HelperText>
-            )}
-          </Flex>
         </Flex>
       </Page.Content>
       {showConfirmation && (
diff --git a/web/src/components/product/ProductSelectionPage.test.tsx b/web/src/components/product/ProductSelectionPage.test.tsx
index 7f6e598e4e..c1842e74b8 100644
--- a/web/src/components/product/ProductSelectionPage.test.tsx
+++ b/web/src/components/product/ProductSelectionPage.test.tsx
@@ -65,7 +65,9 @@ const mockUseSystemFn: jest.Mock<ReturnType<typeof useSystem>> = jest.fn();
 const mockUseSystemSoftwareFn: jest.Mock<ReturnType<typeof useSystemSoftware>> = jest.fn();
 
 // FIXME: add ad use a mockSystem from test-utils instead
-jest.mock("~/components/core/InstallerOptions", () => () => <div>InstallerOptions Mock</div>);
+jest.mock("~/components/core/InstallerL10nOptions", () => () => (
+  <div>InstallerL10nOptions Mock</div>
+));
 
 jest.mock("~/components/product/LicenseDialog", () => () => <div>LicenseDialog Mock</div>);
 
diff --git a/web/src/components/product/ProductSelectionPage.tsx b/web/src/components/product/ProductSelectionPage.tsx
index e4e417ccd0..3512e8d040 100644
--- a/web/src/components/product/ProductSelectionPage.tsx
+++ b/web/src/components/product/ProductSelectionPage.tsx
@@ -51,7 +51,7 @@ import {
   Title,
 } from "@patternfly/react-core";
 import { Navigate, useNavigate } from "react-router";
-import { Link, Page, SubtleContent } from "~/components/core";
+import { InstallerL10nOptions, Link, Page, SubtleContent } from "~/components/core";
 import ProductLogo from "~/components/product/ProductLogo";
 import LicenseDialog from "~/components/product/LicenseDialog";
 import Text from "~/components/core/Text";
@@ -710,7 +710,7 @@ const ProductSelectionContent = () => {
       breadcrumbs={[
         { label: <ProductSelectionTitle products={products} currentProduct={currentProduct} /> },
       ]}
-      showInstallerOptions
+      endSlot={<InstallerL10nOptions />}
     >
       <Page.Content>
         <Flex gap={{ default: "gapXs" }} direction={{ default: "column" }}>
diff --git a/web/src/components/questions/LuksActivationQuestion.tsx b/web/src/components/questions/LuksActivationQuestion.tsx
index 5e7ed7693e..a7626bccf3 100644
--- a/web/src/components/questions/LuksActivationQuestion.tsx
+++ b/web/src/components/questions/LuksActivationQuestion.tsx
@@ -22,7 +22,7 @@
 
 import React, { useState } from "react";
 import { Alert as PFAlert, Content, Form, FormGroup, Stack } from "@patternfly/react-core";
-import { InstallerOptions, PasswordInput, Popup } from "~/components/core";
+import { InstallerL10nOptions, PasswordInput, Popup } from "~/components/core";
 import QuestionActions from "~/components/questions/QuestionActions";
 import { _ } from "~/i18n";
 
@@ -68,7 +68,7 @@ export default function LuksActivationQuestion({ question, answerCallback }) {
       title={_("Encrypted Device")}
       aria-label={_("Question")}
       elementToFocus="#luks-password"
-      titleAddon={<InstallerOptions variant="keyboard" />}
+      titleAddon={<InstallerL10nOptions variant="keyboard" />}
     >
       <Stack hasGutter>
         <Alert attempt={question.data.attempt} />
diff --git a/web/src/components/questions/QuestionWithPassword.tsx b/web/src/components/questions/QuestionWithPassword.tsx
index 036a048378..fa83a652c1 100644
--- a/web/src/components/questions/QuestionWithPassword.tsx
+++ b/web/src/components/questions/QuestionWithPassword.tsx
@@ -23,7 +23,7 @@
 import React, { useState } from "react";
 import { Content, Form, FormGroup, Stack } from "@patternfly/react-core";
 import { Icon } from "~/components/layout";
-import { InstallerOptions, PasswordInput, Popup } from "~/components/core";
+import { InstallerL10nOptions, PasswordInput, Popup } from "~/components/core";
 import QuestionActions from "~/components/questions/QuestionActions";
 import { _ } from "~/i18n";
 import type { AnswerCallback, Question } from "~/model/question";
@@ -54,7 +54,7 @@ export default function QuestionWithPassword({
       isOpen
       title={_("Password Required")}
       titleIconVariant={() => <Icon name="lock" />}
-      titleAddon={<InstallerOptions variant="keyboard" />}
+      titleAddon={<InstallerL10nOptions variant="keyboard" />}
     >
       <Stack hasGutter>
         <Content>{question.text}</Content>
diff --git a/web/src/components/storage/ConnectedDevicesMenu.test.tsx b/web/src/components/storage/ConnectedDevicesMenu.test.tsx
index 2fd520a5ac..e5ed166eb0 100644
--- a/web/src/components/storage/ConnectedDevicesMenu.test.tsx
+++ b/web/src/components/storage/ConnectedDevicesMenu.test.tsx
@@ -1,5 +1,5 @@
 /*
- * Copyright (c) [2025] SUSE LLC
+ * Copyright (c) [2025-2026] SUSE LLC
  *
  * All Rights Reserved.
  *
@@ -62,8 +62,9 @@ async function openMenu() {
 
 it("renders the menu", () => {
   const { container } = installerRender(<ConnectedDevicesMenu />);
+  screen.getByText("Options");
   const icon = container.querySelector("svg");
-  expect(icon).toHaveAttribute("data-icon-name", "more_horiz");
+  expect(icon).toHaveAttribute("data-icon-name", "arrow_drop_down");
 });
 
 it("allows users to rescan devices", async () => {
@@ -77,7 +78,7 @@ it("allows users to configure iSCSI", async () => {
   const { user, menu } = await openMenu();
   const iscsiItem = within(menu).getByRole("menuitem", { name: /Configure iSCSI/ });
   await user.click(iscsiItem);
-  expect(mockNavigateFn).toHaveBeenCalledWith(PATHS.iscsi);
+  expect(mockNavigateFn).toHaveBeenCalledWith(PATHS.iscsi.root);
 });
 
 describe("if zFCP is not supported", () => {
diff --git a/web/src/components/storage/ConnectedDevicesMenu.tsx b/web/src/components/storage/ConnectedDevicesMenu.tsx
index 197790c108..3e03bd0ab7 100644
--- a/web/src/components/storage/ConnectedDevicesMenu.tsx
+++ b/web/src/components/storage/ConnectedDevicesMenu.tsx
@@ -1,5 +1,5 @@
 /*
- * Copyright (c) [2024-2025] SUSE LLC
+ * Copyright (c) [2024-2026] SUSE LLC
  *
  * All Rights Reserved.
  *
@@ -22,12 +22,11 @@
 
 import React from "react";
 import { useNavigate } from "react-router";
-import { _ } from "~/i18n";
 import { activateStorageAction } from "~/api";
-import { STORAGE as PATHS } from "~/routes/paths";
-import { Icon } from "~/components/layout";
-import MenuButton from "../core/MenuButton";
-import spacingStyles from "@patternfly/react-styles/css/utilities/Spacing/spacing";
+import { STORAGE } from "~/routes/paths";
+import Icon from "~/components/layout/Icon";
+import MenuButton from "~/components/core/MenuButton";
+import { _ } from "~/i18n";
 
 export default function ConnectedDevicesMenu() {
   const navigate = useNavigate();
@@ -43,14 +42,14 @@ export default function ConnectedDevicesMenu() {
       }}
       toggleProps={{
         variant: "plain",
-        className: spacingStyles.p_0,
+        style: { minWidth: "24px" },
         // TRANSLATORS: this is an ARIA (accesibility) description of an UI element
         "aria-label": _("More storage options"),
       }}
       items={[
         <MenuButton.Item
           key="iscsi-link"
-          onClick={() => navigate(PATHS.iscsi)}
+          onClick={() => navigate(STORAGE.iscsi.root)}
           description={_("Discover and connect to iSCSI targets")}
         >
           {_("Configure iSCSI")}
@@ -58,7 +57,7 @@ export default function ConnectedDevicesMenu() {
         isZFCPSupported && (
           <MenuButton.Item
             key="zfcp-link"
-            onClick={() => navigate(PATHS.zfcp.root)}
+            onClick={() => navigate(STORAGE.zfcp.root)}
             description={_("Activate zFCP disks")}
           >
             {_("Configure zFCP")}
@@ -67,7 +66,7 @@ export default function ConnectedDevicesMenu() {
         isDASDSupported && (
           <MenuButton.Item
             key="dasd-link"
-            onClick={() => navigate(PATHS.dasd)}
+            onClick={() => navigate(STORAGE.dasd)}
             description={_("Activate and format DASD devices")}
           >
             {_("Configure DASD")}
@@ -82,7 +81,7 @@ export default function ConnectedDevicesMenu() {
         </MenuButton.Item>,
       ]}
     >
-      <Icon name="more_horiz" className="agm-three-dots-icon" />
+      {_("Options")} <Icon name="arrow_drop_down" className="agm-three-dots-icon" />
     </MenuButton>
   );
 }
diff --git a/web/src/components/storage/ISCSIPage.tsx b/web/src/components/storage/ISCSIPage.tsx
index ae0488291d..7879e18a30 100644
--- a/web/src/components/storage/ISCSIPage.tsx
+++ b/web/src/components/storage/ISCSIPage.tsx
@@ -22,29 +22,34 @@
 
 import React from "react";
 import { Grid, GridItem } from "@patternfly/react-core";
-import { Page } from "~/components/core";
-import { InitiatorSection, TargetsSection } from "~/components/storage/iscsi";
+import InitiatorSection from "~/components/storage/iscsi/InitiatorSection";
+import Page from "~/components/core/Page";
+import TargetsTable from "~/components/storage/iscsi/TargetsTable";
 import { STORAGE } from "~/routes/paths";
 import { _ } from "~/i18n";
 
 export default function ISCSIPage() {
   return (
-    <Page breadcrumbs={[{ label: _("Storage"), path: STORAGE.root }, { label: _("iSCSI") }]}>
+    <Page
+      breadcrumbs={[
+        {
+          label: _("Storage"),
+          path: STORAGE.root,
+        },
+        { label: _("iSCSI") },
+      ]}
+      progress={{ scope: "iscsi" }}
+    >
       <Page.Content>
         <Grid hasGutter>
           <GridItem sm={12}>
             <InitiatorSection />
           </GridItem>
           <GridItem sm={12}>
-            <TargetsSection />
+            <TargetsTable />
           </GridItem>
         </Grid>
       </Page.Content>
-      <Page.Actions>
-        <Page.Action variant="secondary" navigateTo={STORAGE.root}>
-          {_("Back")}
-        </Page.Action>
-      </Page.Actions>
     </Page>
   );
 }
diff --git a/web/src/components/storage/ProposalPage.tsx b/web/src/components/storage/ProposalPage.tsx
index a5aab39257..9ac4f1f22d 100644
--- a/web/src/components/storage/ProposalPage.tsx
+++ b/web/src/components/storage/ProposalPage.tsx
@@ -41,9 +41,10 @@ import {
 } from "@patternfly/react-core";
 import textStyles from "@patternfly/react-styles/css/utilities/Text/text";
 import { Page, Link, NestedContent } from "~/components/core/";
-import { Icon } from "~/components/layout";
+import Icon from "~/components/layout/Icon";
+import MenuButton from "~/components/core/MenuButton";
 import ConfigEditor from "./ConfigEditor";
-// import ConnectedDevicesMenu from "./ConnectedDevicesMenu";
+import ConnectedDevicesMenu from "./ConnectedDevicesMenu";
 import EncryptionSection from "./EncryptionSection";
 import BootSection from "./BootSection";
 import FixableConfigInfo from "./FixableConfigInfo";
@@ -60,10 +61,11 @@ import { _, n_ } from "~/i18n";
 import { useProgress, useProgressChanges } from "~/queries/progress";
 import { useNavigate, useLocation } from "react-router";
 import { useStorageUiState } from "~/context/storage-ui-state";
-import MenuButton from "../core/MenuButton";
-import spacingStyles from "@patternfly/react-styles/css/utilities/Spacing/spacing";
+
 import type { Issue } from "~/model/issue";
 
+import spacingStyles from "@patternfly/react-styles/css/utilities/Spacing/spacing";
+
 type InvalidConfigEmptyStateProps = {
   issues: Issue[];
 };
@@ -151,7 +153,7 @@ function UnavailableDevicesEmptyState(): React.ReactNode {
       <EmptyStateFooter>
         <Split hasGutter>
           <SplitItem>
-            <Link to={PATHS.iscsi} variant="link">
+            <Link to={PATHS.iscsi.root} variant="link">
               {_("Connect to iSCSI targets")}
             </Link>
           </SplitItem>
@@ -323,11 +325,10 @@ export default function ProposalPage(): React.ReactNode {
 
   if (resetNeeded) return;
 
-  // FIXME: relocate devices menu
-  //   <ConnectedDevicesMenu /> */
   return (
     <Page
       breadcrumbs={[{ label: _("Storage") }]}
+      centerSlot={<ConnectedDevicesMenu />}
       progress={{ scope: "storage", ensureRefetched: STORAGE_MODEL_KEY }}
     >
       <Page.Content>
diff --git a/web/src/components/storage/iscsi/AuthFields.jsx b/web/src/components/storage/iscsi/AuthFields.jsx
deleted file mode 100644
index a09570a5b1..0000000000
--- a/web/src/components/storage/iscsi/AuthFields.jsx
+++ /dev/null
@@ -1,140 +0,0 @@
-/*
- * Copyright (c) [2023-2025] SUSE LLC
- *
- * All Rights Reserved.
- *
- * This program is free software; you can redistribute it and/or modify it
- * under the terms of the GNU General Public License as published by the Free
- * Software Foundation; either version 2 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 General Public License for
- * more details.
- *
- * You should have received a copy of the GNU General Public License along
- * with this program; if not, contact SUSE LLC.
- *
- * To contact SUSE LLC about this file by physical or electronic mail, you may
- * find current contact information at www.suse.com.
- */
-
-import React, { useEffect } from "react";
-import { Alert, FormGroup, Stack, TextInput } from "@patternfly/react-core";
-import { FormValidationError, Page, PasswordInput } from "~/components/core";
-import { _ } from "~/i18n";
-
-export default function AuthFields({ data, onChange, onValidate }) {
-  const onUsernameChange = (_, v) => onChange("username", v);
-  const onPasswordChange = (_, v) => onChange("password", v);
-  const onReverseUsernameChange = (_, v) => onChange("reverseUsername", v);
-  const onReversePasswordChange = (_, v) => onChange("reversePassword", v);
-
-  const isValidText = (v) => v.length > 0;
-  const isValidUsername = () => isValidText(data.username);
-  const isValidPassword = () => isValidText(data.password);
-  const isValidReverseUsername = () => isValidText(data.reverseUsername);
-  const isValidReversePassword = () => isValidText(data.reversePassword);
-  const isValidAuth = () => isValidUsername() && isValidPassword();
-
-  const showUsernameError = () => (isValidPassword() ? !isValidUsername() : false);
-  const showPasswordError = () => (isValidUsername() ? !isValidPassword() : false);
-  const showReverseUsernameError = () => {
-    return isValidAuth() && isValidReversePassword() ? !isValidReverseUsername() : false;
-  };
-  const showReversePasswordError = () => {
-    return isValidAuth() && isValidReverseUsername() ? !isValidReversePassword() : false;
-  };
-
-  useEffect(() => {
-    onValidate(
-      !showUsernameError() &&
-        !showPasswordError() &&
-        !showReverseUsernameError() &&
-        !showReversePasswordError(),
-    );
-  });
-
-  const ByInitiatorAuthTip = () => {
-    if (isValidAuth()) return null;
-
-    return (
-      <Alert
-        isPlain
-        component="small"
-        title={_("Only available if authentication by target is provided")}
-      />
-    );
-  };
-
-  return (
-    <>
-      <Page.Section title={_("Authentication by target")} hasHeaderDivider>
-        <Stack hasGutter>
-          <FormGroup fieldId="username" label={_("User name")}>
-            <TextInput
-              id="username"
-              name="username"
-              aria-label={_("User name")}
-              value={data.username || ""}
-              label={_("User name")}
-              onChange={onUsernameChange}
-              validated={showUsernameError() ? "error" : "default"}
-            />
-            <FormValidationError message={showUsernameError() ? _("Incorrect user name") : ""} />
-          </FormGroup>
-          <FormGroup fieldId="password" label={_("Password")}>
-            <PasswordInput
-              id="password"
-              name="password"
-              aria-label={_("Password")}
-              value={data.password || ""}
-              onChange={onPasswordChange}
-              validated={showPasswordError() ? "error" : "default"}
-            />
-            <FormValidationError message={showPasswordError() ? _("Incorrect password") : ""} />
-          </FormGroup>
-        </Stack>
-      </Page.Section>
-      <Page.Section
-        pfCardProps={{ variant: isValidAuth() ? "default" : "secondary" }}
-        title={_("Authentication by initiator")}
-        hasHeaderDivider
-      >
-        <Stack hasGutter>
-          <ByInitiatorAuthTip />
-          <FormGroup fieldId="reverseUsername" label={_("User name")}>
-            <TextInput
-              id="reverseUsername"
-              name="reverseUsername"
-              aria-label={_("User name")}
-              value={data.reverseUsername || ""}
-              label={_("User name")}
-              isDisabled={!isValidAuth()}
-              onChange={onReverseUsernameChange}
-              validated={showReverseUsernameError() ? "error" : "default"}
-            />
-            <FormValidationError
-              message={showReverseUsernameError() ? _("Incorrect user name") : ""}
-            />
-          </FormGroup>
-          <FormGroup fieldId="reversePassword" label="Password">
-            <PasswordInput
-              id="reversePassword"
-              name="reversePassword"
-              aria-label={_("Target Password")}
-              value={data.reversePassword || ""}
-              isDisabled={!isValidAuth()}
-              onChange={onReversePasswordChange}
-              validated={showReversePasswordError() ? "error" : "default"}
-            />
-            <FormValidationError
-              message={showReverseUsernameError() ? _("Incorrect password") : ""}
-            />
-          </FormGroup>
-        </Stack>
-      </Page.Section>
-    </>
-  );
-}
diff --git a/web/src/components/storage/iscsi/DiscoverForm.tsx b/web/src/components/storage/iscsi/DiscoverForm.tsx
deleted file mode 100644
index 043aa9731f..0000000000
--- a/web/src/components/storage/iscsi/DiscoverForm.tsx
+++ /dev/null
@@ -1,139 +0,0 @@
-/*
- * Copyright (c) [2023-2024] SUSE LLC
- *
- * All Rights Reserved.
- *
- * This program is free software; you can redistribute it and/or modify it
- * under the terms of the GNU General Public License as published by the Free
- * Software Foundation; either version 2 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 General Public License for
- * more details.
- *
- * You should have received a copy of the GNU General Public License along
- * with this program; if not, contact SUSE LLC.
- *
- * To contact SUSE LLC about this file by physical or electronic mail, you may
- * find current contact information at www.suse.com.
- */
-
-import React, { useEffect, useRef, useState } from "react";
-import { Alert, Form, FormGroup, TextInput } from "@patternfly/react-core";
-import { FormValidationError, Popup } from "~/components/core";
-import { AuthFields } from "~/components/storage/iscsi";
-import { useLocalStorage } from "~/hooks/use-local-storage";
-import { isValidIp } from "~/utils/network";
-import { _ } from "~/i18n";
-
-const defaultData = {
-  address: "",
-  port: "3260",
-  username: "",
-  password: "",
-  reverseUsername: "",
-  reversePassword: "",
-};
-
-export default function DiscoverForm({ onSubmit: onSubmitProp, onCancel }) {
-  const [savedData, setSavedData] = useLocalStorage("agama-iscsi-discovery", defaultData);
-  const [data, setData] = useState(defaultData);
-  const [isLoading, setIsLoading] = useState(false);
-  const [isFailed, setIsFailed] = useState(false);
-  const [isValidAuth, setIsValidAuth] = useState(true);
-  const alertRef = useRef(null);
-
-  useEffect(() => {
-    setData(savedData);
-  }, [setData, savedData]);
-
-  useEffect(() => {
-    // Scroll the alert into view
-    if (isFailed) {
-      alertRef.current.scrollIntoView({
-        behavior: "smooth",
-        block: "start",
-      });
-    }
-  });
-
-  const updateData = (key, value) => setData({ ...data, [key]: value });
-  const onAddressChange = (_, v) => updateData("address", v);
-  const onPortChange = (_, v) => updateData("port", v);
-
-  const onSubmit = async (event) => {
-    event.preventDefault();
-
-    setIsLoading(true);
-    setSavedData(data);
-
-    const success = await onSubmitProp(data);
-
-    if (!success) {
-      setIsFailed(true);
-      setIsLoading(false);
-    }
-  };
-
-  const isValidAddress = () => isValidIp(data.address);
-  const isValidPort = () => Number.isInteger(parseInt(data.port));
-  const isValidForm = () => {
-    return isValidAddress() && isValidPort() && isValidAuth;
-  };
-
-  const showAddressError = () => data.address.length > 0 && !isValidAddress();
-  const showPortError = () => data.port.length > 0 && !isValidPort();
-
-  const id = "iscsiDiscover";
-  const isDisabled = isLoading || !isValidForm();
-
-  return (
-    // TRANSLATORS: popup title
-    <Popup isOpen title={_("Discover iSCSI Targets")}>
-      <Form id={id} onSubmit={onSubmit}>
-        {isFailed && (
-          <div ref={alertRef}>
-            <Alert variant="warning" isInline title={_("Something went wrong")}>
-              <p>{_("Make sure you provide the correct values")}</p>
-            </Alert>
-          </div>
-        )}
-        <FormGroup fieldId="address" label={_("IP address")} isRequired>
-          <TextInput
-            id="address"
-            name="address"
-            // TRANSLATORS: network address
-            aria-label={_("Address")}
-            value={data.address || ""}
-            label={_("Address")}
-            isRequired
-            onChange={onAddressChange}
-            validated={showAddressError() ? "error" : "default"}
-          />
-          <FormValidationError message={showAddressError() ? _("Incorrect IP address") : ""} />
-        </FormGroup>
-        <FormGroup fieldId="port" label={_("Port")} isRequired>
-          <TextInput
-            id="port"
-            name="port"
-            // TRANSLATORS: network port number
-            aria-label={_("Port")}
-            value={data.port || ""}
-            label={_("Port")}
-            isRequired
-            onChange={onPortChange}
-            validated={showPortError() ? "error" : "default"}
-          />
-          <FormValidationError message={showPortError() ? _("Incorrect port") : ""} />
-        </FormGroup>
-        <AuthFields data={data} onChange={updateData} onValidate={(v) => setIsValidAuth(v)} />
-      </Form>
-      <Popup.Actions>
-        <Popup.Confirm form={id} type="submit" isDisabled={isDisabled} />
-        <Popup.Cancel onClick={onCancel} isDisabled={isLoading} />
-      </Popup.Actions>
-    </Popup>
-  );
-}
diff --git a/web/src/components/storage/iscsi/DiscoverFormPage.test.tsx b/web/src/components/storage/iscsi/DiscoverFormPage.test.tsx
new file mode 100644
index 0000000000..67593440e6
--- /dev/null
+++ b/web/src/components/storage/iscsi/DiscoverFormPage.test.tsx
@@ -0,0 +1,171 @@
+/*
+ * Copyright (c) [2026] SUSE LLC
+ *
+ * All Rights Reserved.
+ *
+ * This program is free software; you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the Free
+ * Software Foundation; either version 2 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 General Public License for
+ * more details.
+ *
+ * You should have received a copy of the GNU General Public License along
+ * with this program; if not, contact SUSE LLC.
+ *
+ * To contact SUSE LLC about this file by physical or electronic mail, you may
+ * find current contact information at www.suse.com.
+ */
+
+import React from "react";
+import { screen } from "@testing-library/react";
+import { installerRender, mockNavigateFn } from "~/test-utils";
+import { STORAGE } from "~/routes/paths";
+import DiscoverFormPage from "./DiscoverFormPage";
+
+const mockDiscoverISCSIAction = jest.fn();
+const mockScrollIntoViewFn = jest.fn();
+
+jest.mock("~/api", () => ({
+  ...jest.requireActual("~/api"),
+  discoverISCSIAction: (...args) => mockDiscoverISCSIAction(...args),
+}));
+
+// Needed by withL10n
+jest.mock("~/hooks/model/system", () => ({
+  useSystem: () => ({
+    l10n: {
+      keymap: "us",
+      timezone: "Europe/Berlin",
+      locale: "en_US",
+    },
+  }),
+}));
+
+describe("DiscoverFormPage", () => {
+  beforeEach(() => {
+    // .scrollIntoView is not yet implemented at jsdom, https://github.com/jsdom/jsdom/issues/1695
+    window.HTMLElement.prototype.scrollIntoView = mockScrollIntoViewFn;
+  });
+
+  it("allows discovering without authentication", async () => {
+    const { user } = installerRender(<DiscoverFormPage />, { withL10n: true });
+
+    const addressInput = screen.getByRole("textbox", { name: "Address" });
+    const portInput = screen.getByRole("textbox", { name: "Port" });
+    const acceptButton = screen.getByRole("button", { name: "Accept" });
+
+    await user.type(addressInput, "192.168.100.102");
+    await user.clear(portInput);
+    await user.type(portInput, "3260");
+    await user.click(acceptButton);
+
+    expect(mockDiscoverISCSIAction).toHaveBeenCalledWith({
+      address: "192.168.100.102",
+      port: 3260,
+    });
+    expect(mockNavigateFn).toHaveBeenCalledWith({ pathname: STORAGE.iscsi.root });
+  });
+
+  it("allows discovering with authentication", async () => {
+    const { user } = installerRender(<DiscoverFormPage />, { withL10n: true });
+
+    const addressInput = screen.getByRole("textbox", { name: "Address" });
+    const portInput = screen.getByRole("textbox", { name: "Port" });
+    const authSwitch = screen.getByRole("switch", { name: "Provide authentication" });
+    const acceptButton = screen.getByRole("button", { name: "Accept" });
+
+    await user.type(addressInput, "192.168.100.102");
+    await user.clear(portInput);
+    await user.type(portInput, "3260");
+    await user.click(authSwitch);
+
+    const username = screen.getByRole("textbox", { name: "User name" });
+    const password = screen.getByLabelText("Password");
+
+    await user.type(username, "john");
+    await user.type(password, "secret");
+    await user.click(acceptButton);
+
+    expect(mockDiscoverISCSIAction).toHaveBeenCalledWith({
+      address: "192.168.100.102",
+      port: 3260,
+      username: "john",
+      password: "secret",
+    });
+    expect(mockNavigateFn).toHaveBeenCalledWith({ pathname: STORAGE.iscsi.root });
+  });
+
+  it("allows discovering with mutual authentication", async () => {
+    const { user } = installerRender(<DiscoverFormPage />, { withL10n: true });
+
+    const addressInput = screen.getByRole("textbox", { name: "Address" });
+    const portInput = screen.getByRole("textbox", { name: "Port" });
+    const authSwitch = screen.getByRole("switch", { name: "Provide authentication" });
+    const acceptButton = screen.getByRole("button", { name: "Accept" });
+
+    await user.type(addressInput, "192.168.100.102");
+    await user.clear(portInput);
+    await user.type(portInput, "3260");
+    await user.click(authSwitch);
+
+    const username = screen.getByRole("textbox", { name: "User name" });
+    const password = screen.getByLabelText("Password");
+
+    await user.type(username, "john");
+    await user.type(password, "secret");
+
+    const mutualAuthSwitch = screen.getByRole("switch", { name: "Enable mutual verification" });
+    await user.click(mutualAuthSwitch);
+
+    const initiatorUsername = screen.getByRole("textbox", { name: "Initiator user name" });
+    const initiatorPassword = screen.getByLabelText("Initiator password");
+
+    await user.type(initiatorUsername, "jane");
+    await user.type(initiatorPassword, "secret");
+    await user.click(acceptButton);
+
+    expect(mockDiscoverISCSIAction).toHaveBeenCalledWith({
+      address: "192.168.100.102",
+      port: 3260,
+      username: "john",
+      password: "secret",
+      initiatorUsername: "jane",
+      initiatorPassword: "secret",
+    });
+    expect(mockNavigateFn).toHaveBeenCalledWith({ pathname: STORAGE.iscsi.root });
+  });
+
+  it("shows validation errors for invalid IP address", async () => {
+    const { user } = installerRender(<DiscoverFormPage />, { withL10n: true });
+
+    const addressInput = screen.getByRole("textbox", { name: "Address" });
+    const acceptButton = screen.getByRole("button", { name: "Accept" });
+
+    await user.type(addressInput, "invalid-ip");
+    await user.click(acceptButton);
+
+    screen.getByText("No valid address.");
+    expect(mockScrollIntoViewFn).toHaveBeenCalled();
+    expect(mockDiscoverISCSIAction).not.toHaveBeenCalled();
+    expect(mockNavigateFn).not.toHaveBeenCalled();
+  });
+
+  it("shows validation errors for missing required fields", async () => {
+    const { user } = installerRender(<DiscoverFormPage />, { withL10n: true });
+
+    const authSwitch = screen.getByRole("switch", { name: "Provide authentication" });
+    const acceptButton = screen.getByRole("button", { name: "Accept" });
+
+    await user.click(authSwitch);
+    await user.click(acceptButton);
+
+    screen.getByText("All fields are required.");
+    expect(mockScrollIntoViewFn).toHaveBeenCalled();
+    expect(mockDiscoverISCSIAction).not.toHaveBeenCalled();
+    expect(mockNavigateFn).not.toHaveBeenCalled();
+  });
+});
diff --git a/web/src/components/storage/iscsi/DiscoverFormPage.tsx b/web/src/components/storage/iscsi/DiscoverFormPage.tsx
new file mode 100644
index 0000000000..82bc46028f
--- /dev/null
+++ b/web/src/components/storage/iscsi/DiscoverFormPage.tsx
@@ -0,0 +1,278 @@
+/*
+ * Copyright (c) [2023-2026] SUSE LLC
+ *
+ * All Rights Reserved.
+ *
+ * This program is free software; you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the Free
+ * Software Foundation; either version 2 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 General Public License for
+ * more details.
+ *
+ * You should have received a copy of the GNU General Public License along
+ * with this program; if not, contact SUSE LLC.
+ *
+ * To contact SUSE LLC about this file by physical or electronic mail, you may
+ * find current contact information at www.suse.com.
+ */
+
+import React, { useEffect, useReducer, useRef, useState } from "react";
+import { useNavigate } from "react-router";
+import {
+  ActionGroup,
+  Alert,
+  Flex,
+  Form,
+  FormGroup,
+  List,
+  ListItem,
+  Split,
+  TextInput,
+} from "@patternfly/react-core";
+import { NestedContent, Page, PasswordInput, SwitchEnhanced } from "~/components/core";
+import { isValidIp } from "~/utils/network";
+import { isEmpty, pick } from "radashi";
+import { discoverISCSIAction } from "~/api";
+import { STORAGE } from "~/routes/paths";
+import { _ } from "~/i18n";
+
+import type { DiscoverISCSIConfig } from "~/model/action";
+
+/**
+ * Generic action to set any field in the form state.
+ * Uses mapped types to ensure type safety across all config fields.
+ */
+type SetValueFormAction = {
+  [K in keyof DiscoverISCSIConfig]: {
+    type: "SET_VALUE";
+    field: K;
+    payload: DiscoverISCSIConfig[K];
+  };
+}[keyof DiscoverISCSIConfig];
+
+/** Initial state for the iSCSI discovery form.
+ *
+ * Also serves as a type reference for automatic value conversion in
+ * handleInputChange.
+ */
+const initialState: DiscoverISCSIConfig = {
+  address: "",
+  port: 3260,
+  username: "",
+  password: "",
+  initiatorUsername: "",
+  initiatorPassword: "",
+};
+
+/**
+ * Helper to create a change handler that infers the field from the input name.
+ *
+ * Automatically converts input values to match their expected types by checking
+ * against the initialState. E.g., number fields are converted from strings to
+ * numbers.
+ */
+const handleInputChange =
+  (dispatch: React.Dispatch<SetValueFormAction>) => (e: React.ChangeEvent<HTMLInputElement>) => {
+    const field = e.target.name as keyof DiscoverISCSIConfig;
+    const expectedType = typeof initialState[field];
+    const value = expectedType === "number" ? Number(e.target.value) : e.target.value;
+
+    dispatch({
+      type: "SET_VALUE",
+      field,
+      payload: value,
+    } as SetValueFormAction);
+  };
+
+/**
+ * Reducer function for managing iSCSI discovery form state.
+ */
+const formReducer = (
+  state: DiscoverISCSIConfig,
+  action?: SetValueFormAction,
+): DiscoverISCSIConfig => {
+  const { type, field, payload } = action;
+
+  switch (type) {
+    case "SET_VALUE":
+      return { ...state, [field]: payload };
+    default:
+      return state;
+  }
+};
+
+/**
+ * Form component for discovering iSCSI targets.
+ *
+ * Manages a kind of multi-step form where optional authentication fields are
+ * conditionally rendered based on toggle switches upon user decision.
+ */
+function DiscoverForm() {
+  const [state, dispatch] = useReducer(formReducer, initialState);
+  const [isLoading, setIsLoading] = useState(false);
+  const [errors, setErrors] = useState([]);
+  const [showAuth, setShowAuth] = useState(false);
+  const [showMutualAuth, setShowMutualAuth] = useState(false);
+  const alertRef = useRef(null);
+  const navigate = useNavigate();
+
+  useEffect(() => {
+    // Scroll the alert into view
+    if (errors.length > 0) {
+      alertRef.current.scrollIntoView({
+        behavior: "smooth",
+        block: "start",
+      });
+    }
+  }, [errors]);
+
+  const onInputChange = handleInputChange(dispatch);
+
+  const onSubmit = async (event) => {
+    event.preventDefault();
+    setIsLoading(true);
+    setErrors([]);
+    const nextErrors = [];
+
+    const fieldsToCheck: Array<keyof DiscoverISCSIConfig> = ["address", "port"];
+
+    showAuth && fieldsToCheck.push("username", "password");
+    showAuth && showMutualAuth && fieldsToCheck.push("initiatorUsername", "initiatorPassword");
+
+    const config: DiscoverISCSIConfig = pick(state, fieldsToCheck);
+
+    if (!isValidIp(state.address)) {
+      nextErrors.push(_("No valid address."));
+    }
+
+    if (!Number.isInteger(state.port)) {
+      nextErrors.push(_("No valid port."));
+    }
+
+    if (Object.values(config).some((v) => isEmpty(v))) {
+      nextErrors.push(_("All fields are required."));
+    }
+
+    if (nextErrors.length > 0) {
+      setErrors(nextErrors);
+      setIsLoading(false);
+      return;
+    }
+
+    setIsLoading(true);
+    discoverISCSIAction(config);
+    navigate({ pathname: STORAGE.iscsi.root });
+  };
+
+  return (
+    <Form onSubmit={onSubmit}>
+      {errors.length > 0 && (
+        <div ref={alertRef}>
+          <Alert variant="warning" isInline title={_("Something went wrong")}>
+            <List>
+              {errors.map((error, i) => (
+                <ListItem key={`error_${i}`}>{error}</ListItem>
+              ))}
+            </List>
+          </Alert>
+        </div>
+      )}
+      <Flex>
+        <FormGroup fieldId="address" label={_("Address")}>
+          <TextInput id="address" name="address" value={state.address} onChange={onInputChange} />
+        </FormGroup>
+        <FormGroup fieldId="port" label={_("Port")}>
+          <TextInput id="port" name="port" value={state.port} onChange={onInputChange} />
+        </FormGroup>
+      </Flex>
+      <SwitchEnhanced
+        id="useAuth"
+        label={_("Provide authentication")}
+        description={_("CHAP authentication performed by the target")}
+        isChecked={showAuth}
+        onChange={() => setShowAuth(!showAuth)}
+      />
+      {showAuth && (
+        <NestedContent>
+          <Split hasGutter>
+            <FormGroup fieldId="username" label={_("User name")}>
+              <TextInput
+                id="username"
+                name="username"
+                value={state.username}
+                onChange={onInputChange}
+              />
+            </FormGroup>
+            <FormGroup fieldId="password" label={_("Password")}>
+              <PasswordInput
+                id="password"
+                name="password"
+                value={state.password}
+                onChange={onInputChange}
+              />
+            </FormGroup>
+          </Split>
+
+          <SwitchEnhanced
+            id="useMutualAuth"
+            label={_("Enable mutual verification")}
+            description={_("Additional CHAP authentication performed by the initiator")}
+            isChecked={showMutualAuth}
+            onChange={() => setShowMutualAuth(!showMutualAuth)}
+          />
+          {showMutualAuth && (
+            <Split hasGutter>
+              <FormGroup fieldId="initiatorUsername" label={_("Initiator user name")}>
+                <TextInput
+                  id="initiatorUsername"
+                  name="initiatorUsername"
+                  value={state.initiatorUsername}
+                  onChange={onInputChange}
+                />
+              </FormGroup>
+              <FormGroup fieldId="initiatorPassword" label={_("Initiator password")}>
+                <PasswordInput
+                  id="initiatorPassword"
+                  name="initiatorPassword"
+                  value={state.initiatorPassword}
+                  onChange={onInputChange}
+                />
+              </FormGroup>
+            </Split>
+          )}
+        </NestedContent>
+      )}
+
+      <ActionGroup>
+        <Page.Submit isLoading={isLoading} />
+        {!isLoading && <Page.Back>{_("Cancel")}</Page.Back>}
+      </ActionGroup>
+    </Form>
+  );
+}
+
+/**
+ * Page wrapper for the iSCSI discovery form.
+ *
+ * Provides page layout with breadcrumb navigation for the discover targets
+ * workflow.
+ */
+export default function DiscoverFormPage() {
+  return (
+    <Page
+      breadcrumbs={[
+        { label: _("Storage"), path: STORAGE.root },
+        { label: _("iSCSI"), path: STORAGE.iscsi.root },
+        { label: _("Discover targets") },
+      ]}
+    >
+      <Page.Content>
+        <DiscoverForm />
+      </Page.Content>
+    </Page>
+  );
+}
diff --git a/web/src/components/storage/iscsi/EditNodeForm.tsx b/web/src/components/storage/iscsi/EditNodeForm.tsx
deleted file mode 100644
index 814c61e859..0000000000
--- a/web/src/components/storage/iscsi/EditNodeForm.tsx
+++ /dev/null
@@ -1,69 +0,0 @@
-/*
- * Copyright (c) [2023] SUSE LLC
- *
- * All Rights Reserved.
- *
- * This program is free software; you can redistribute it and/or modify it
- * under the terms of the GNU General Public License as published by the Free
- * Software Foundation; either version 2 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 General Public License for
- * more details.
- *
- * You should have received a copy of the GNU General Public License along
- * with this program; if not, contact SUSE LLC.
- *
- * To contact SUSE LLC about this file by physical or electronic mail, you may
- * find current contact information at www.suse.com.
- */
-
-import React, { useState } from "react";
-import { Form, FormGroup, FormSelect, FormSelectOption } from "@patternfly/react-core";
-import { sprintf } from "sprintf-js";
-
-import { _ } from "~/i18n";
-import { Popup } from "~/components/core";
-import { NodeStartupOptions } from "~/components/storage/iscsi";
-
-export default function EditNodeForm({ node, onSubmit: onSubmitProp, onCancel }) {
-  const [data, setData] = useState({ startup: node.startup });
-
-  const onStartupChange = (_, v) => setData({ ...data, startup: v });
-
-  const onSubmit = async (event) => {
-    event.preventDefault();
-    await onSubmitProp(data);
-  };
-
-  const startupFormOptions = Object.values(NodeStartupOptions).map((option, i) => (
-    /* eslint-disable agama-i18n/string-literals */
-    <FormSelectOption key={i} value={option.value} label={_(option.label)} />
-  ));
-
-  const id = "iscsiEditNode";
-
-  return (
-    // TRANSLATORS: %s is replaced by the iSCSI target node name
-    <Popup isOpen title={sprintf(_("Edit %s"), node.target)}>
-      <Form id={id} onSubmit={onSubmit}>
-        <FormGroup fieldId="startup" label="Startup">
-          <FormSelect
-            id="startup"
-            aria-label="startup"
-            value={data.startup}
-            onChange={onStartupChange}
-          >
-            {startupFormOptions}
-          </FormSelect>
-        </FormGroup>
-      </Form>
-      <Popup.Actions>
-        <Popup.Confirm form={id} type="submit" />
-        <Popup.Cancel onClick={onCancel} />
-      </Popup.Actions>
-    </Popup>
-  );
-}
diff --git a/web/src/components/storage/iscsi/InitiatorForm.tsx b/web/src/components/storage/iscsi/InitiatorForm.tsx
deleted file mode 100644
index b8644938dc..0000000000
--- a/web/src/components/storage/iscsi/InitiatorForm.tsx
+++ /dev/null
@@ -1,95 +0,0 @@
-/*
- * Copyright (c) [2023-2025] SUSE LLC
- *
- * All Rights Reserved.
- *
- * This program is free software; you can redistribute it and/or modify it
- * under the terms of the GNU General Public License as published by the Free
- * Software Foundation; either version 2 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 General Public License for
- * more details.
- *
- * You should have received a copy of the GNU General Public License along
- * with this program; if not, contact SUSE LLC.
- *
- * To contact SUSE LLC about this file by physical or electronic mail, you may
- * find current contact information at www.suse.com.
- */
-
-import React, { useState } from "react";
-import { Alert, Button, Form, FormGroup, TextInput, Split, Spinner } from "@patternfly/react-core";
-
-import { _ } from "~/i18n";
-
-export default function InitiatorForm({ initiator, onSubmit: onSubmitProp }) {
-  const [data, setData] = useState({ ...initiator });
-  const [success, setSuccess] = useState<string | null>(null);
-  const [error, setError] = useState<string | null>(null);
-  const [updating, setUpdating] = useState(false);
-
-  const onNameChange = (_, name) => setData({ ...data, name });
-
-  const submit = async () => {
-    setUpdating(true);
-    setSuccess(null);
-    setError(null);
-    onSubmitProp(data)
-      .then(() => {
-        setSuccess(_("Initiator name successfully updated"));
-        setUpdating(false);
-      })
-      .catch(() => {
-        setError(_("Initiator name could not be updated"));
-        setUpdating(false);
-      });
-  };
-
-  const onSubmit = async (event) => {
-    event.preventDefault();
-
-    if (data.name !== "") return submit();
-
-    setSuccess(null);
-    setError(_("The initiator name cannot be blank"));
-  };
-
-  const id = "editIscsiInitiator";
-
-  if (updating)
-    return (
-      <Alert
-        isPlain
-        customIcon={<Spinner size="md" aria-hidden />}
-        title={_("Updating the initiator name")}
-      />
-    );
-
-  return (
-    <Form id={id} onSubmit={onSubmit}>
-      {success && <Alert variant="success" isInline title={success} />}
-      {error && <Alert variant="warning" isInline title={error} />}
-      <FormGroup label={_("Name")}>
-        <Split hasGutter>
-          <TextInput
-            id="initiatorName"
-            name="name"
-            size={50}
-            // TRANSLATORS: iSCSI initiator name
-            aria-label={_("Initiator name")}
-            value={data.name || ""}
-            // TRANSLATORS: input field for the iSCSI initiator name
-            label={_("Name")}
-            onChange={onNameChange}
-          />
-          <Button type="submit" variant="secondary">
-            {_("Change")}
-          </Button>
-        </Split>
-      </FormGroup>
-    </Form>
-  );
-}
diff --git a/web/src/components/storage/iscsi/InitiatorFormPage.tsx b/web/src/components/storage/iscsi/InitiatorFormPage.tsx
new file mode 100644
index 0000000000..0b3779e6db
--- /dev/null
+++ b/web/src/components/storage/iscsi/InitiatorFormPage.tsx
@@ -0,0 +1,87 @@
+/*
+ * Copyright (c) [2026] SUSE LLC
+ *
+ * All Rights Reserved.
+ *
+ * This program is free software; you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the Free
+ * Software Foundation; either version 2 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 General Public License for
+ * more details.
+ *
+ * You should have received a copy of the GNU General Public License along
+ * with this program; if not, contact SUSE LLC.
+ *
+ * To contact SUSE LLC about this file by physical or electronic mail, you may
+ * find current contact information at www.suse.com.
+ */
+
+import React, { useState } from "react";
+import { useNavigate } from "react-router";
+import { Alert, Button, Form, FormGroup, TextInput, ActionGroup } from "@patternfly/react-core";
+import { Page } from "~/components/core";
+import { STORAGE } from "~/routes/paths";
+import { _ } from "~/i18n";
+import { useSystem } from "~/hooks/model/system/iscsi";
+import { useSetInitiator } from "~/hooks/model/config/iscsi";
+
+export default function InitiatorFormPage() {
+  const initiator = useSystem().initiator;
+  const [data, setData] = useState({ ...initiator });
+  const [error, setError] = useState<string | null>(null);
+  const setInitiator = useSetInitiator();
+  const navigate = useNavigate();
+
+  const onNameChange = (_, name) => setData({ ...data, name });
+
+  const submit = async () => {
+    setError(null);
+    setInitiator(data.name);
+    navigate({ pathname: STORAGE.iscsi.root });
+  };
+
+  const onSubmit = async (event) => {
+    event.preventDefault();
+
+    if (data.name !== "") return submit();
+
+    setError(_("The initiator name cannot be blank"));
+  };
+
+  return (
+    <Page
+      breadcrumbs={[
+        { label: _("Storage"), path: STORAGE.root },
+        { label: _("iSCSI"), path: STORAGE.iscsi.root },
+        { label: _("Initiator") },
+      ]}
+    >
+      <Page.Content>
+        <Form onSubmit={onSubmit}>
+          {error && <Alert variant="warning" isInline title={error} />}
+          <FormGroup label={_("Name")}>
+            <TextInput
+              id="initiatorName"
+              name="name"
+              size={50}
+              // TRANSLATORS: iSCSI initiator name
+              aria-label={_("Initiator name")}
+              value={data.name || ""}
+              // TRANSLATORS: input field for the iSCSI initiator name
+              label={_("Name")}
+              onChange={onNameChange}
+            />
+          </FormGroup>
+          <ActionGroup>
+            <Button type="submit">{_("Change")}</Button>
+            <Page.Back>{_("Cancel")}</Page.Back>
+          </ActionGroup>
+        </Form>
+      </Page.Content>
+    </Page>
+  );
+}
diff --git a/web/src/components/storage/iscsi/InitiatorSection.test.tsx b/web/src/components/storage/iscsi/InitiatorSection.test.tsx
index 8bdcdb26a3..2d15378850 100644
--- a/web/src/components/storage/iscsi/InitiatorSection.test.tsx
+++ b/web/src/components/storage/iscsi/InitiatorSection.test.tsx
@@ -1,5 +1,5 @@
 /*
- * Copyright (c) [2024-2025] SUSE LLC
+ * Copyright (c) [2024-2026] SUSE LLC
  *
  * All Rights Reserved.
  *
@@ -22,57 +22,52 @@
 
 import React from "react";
 import { screen } from "@testing-library/react";
-import { plainRender } from "~/test-utils";
-
+import { installerRender } from "~/test-utils";
+import { STORAGE } from "~/routes/paths";
 import InitiatorSection from "./InitiatorSection";
-import type { ISCSIInitiator } from "~/model/storage/iscsi";
 
-let initiator: ISCSIInitiator;
+const ibftInitiator = { name: "iqn.1996-04.de.suse:01:62b45cf7fc", ibft: true };
+const noIbftInitiator = { name: "iqn.1996-04.de.suse:01:62b45cf7fc", ibft: false };
 
-const mockInitiatorMutation = { mutateAsync: jest.fn() };
+const mockUseSystemFn = jest.fn();
 
-jest.mock("~/queries/storage/iscsi", () => ({
-  ...jest.requireActual("~/queries/storage/iscsi"),
-  useInitiator: () => initiator,
-  useInitiatorMutation: () => mockInitiatorMutation,
+jest.mock("~/hooks/model/system/iscsi", () => ({
+  ...jest.requireActual("~/hooks/model/system/iscsi"),
+  useSystem: () => mockUseSystemFn(),
 }));
 
-describe("InitiatorPresenter", () => {
-  describe("iBFT", () => {
-    beforeEach(() => {
-      initiator = { name: "iqn.1996-04.de.suse:01:62b45cf7fc", ibft: true };
+describe("InitiatorSection", () => {
+  beforeEach(() => {
+    mockUseSystemFn.mockReturnValue({
+      initiator: ibftInitiator,
     });
+  });
+
+  it("renders the initiator name", () => {
+    installerRender(<InitiatorSection />);
+    screen.getByText(ibftInitiator.name);
+  });
 
-    it("displays the initiator data", () => {
-      plainRender(<InitiatorSection />);
+  describe("when read from iBFT", () => {
+    it("does not render a link to configure it when read from iBFT", () => {
+      installerRender(<InitiatorSection />);
       screen.getByText(/read from.*iBFT/);
-      screen.getByText(initiator.name);
+      screen.getByText(/Initiator cannot be changed/);
+      expect(screen.queryByRole("link", { name: /configured manually/ })).toBeNull();
     });
   });
 
-  describe("without iBFT", () => {
+  describe("when not read from iBFT", () => {
     beforeEach(() => {
-      initiator = { name: "iqn.1996-04.de.suse:01:62b45cf7fc", ibft: false };
+      mockUseSystemFn.mockReturnValue({
+        initiator: noIbftInitiator,
+      });
     });
 
-    it("displays the initiator form", () => {
-      plainRender(<InitiatorSection />);
-      screen.getByText(/No iSCSI Boot Firmware Table/);
-      const name = screen.getByRole("textbox", { name: "Initiator name" });
-      expect(name).toHaveValue(initiator.name);
-    });
-
-    it("updates the initiator data", async () => {
-      const { user } = plainRender(<InitiatorSection />);
-
-      const nameInput = screen.getByRole("textbox", { name: "Initiator name" });
-      await user.clear(nameInput);
-      await user.type(nameInput, "my-initiator");
-
-      const button = screen.getByRole("button", { name: "Change" });
-      await user.click(button);
-
-      expect(mockInitiatorMutation.mutateAsync).toHaveBeenCalledWith({ name: "my-initiator" });
+    it("renders a link to configure the target", () => {
+      installerRender(<InitiatorSection />);
+      const link = screen.getByRole("link", { name: /configured manually/ });
+      expect(link).toHaveAttribute("href", STORAGE.iscsi.initiator);
     });
   });
 });
diff --git a/web/src/components/storage/iscsi/InitiatorSection.tsx b/web/src/components/storage/iscsi/InitiatorSection.tsx
index 1dc1723229..0a9000c68a 100644
--- a/web/src/components/storage/iscsi/InitiatorSection.tsx
+++ b/web/src/components/storage/iscsi/InitiatorSection.tsx
@@ -1,5 +1,5 @@
 /*
- * Copyright (c) [2023-2025] SUSE LLC
+ * Copyright (c) [2023-2026] SUSE LLC
  *
  * All Rights Reserved.
  *
@@ -21,47 +21,60 @@
  */
 
 import React from "react";
-
+import { Content, Flex, Split } from "@patternfly/react-core";
+import Link from "~/components/core/Link";
+import Page from "~/components/core/Page";
+import SubtleContent from "~/components/core/SubtleContent";
+import Text from "~/components/core/Text";
+import { useSystem } from "~/hooks/model/system/iscsi";
+import { STORAGE } from "~/routes/paths";
 import { _ } from "~/i18n";
-import { Page } from "~/components/core";
-import {
-  DescriptionList,
-  DescriptionListGroup,
-  DescriptionListTerm,
-  DescriptionListDescription,
-} from "@patternfly/react-core";
-import { InitiatorForm } from "~/components/storage/iscsi";
-import { useInitiator, useInitiatorMutation, useInitiatorChanges } from "~/queries/storage/iscsi";
 
-const InitiatorDescription = ({ initiator }) => {
+function Description({ ibft }: { ibft: boolean }) {
+  if (ibft) {
+    return _(
+      "Configuration read from the iSCSI Boot Firmware Table (iBFT). Initiator cannot be changed.",
+    );
+  }
+
+  const [textStart, linkText, textEnd] = _(
+    "No iSCSI Boot Firmware Table (iBFT) found. The initiator can be [configured manually.]",
+  ).split(/[[\]]/);
+
   return (
-    <DescriptionList aria-label={_("Initiator details")} isHorizontal isFluid>
-      <DescriptionListGroup>
-        <DescriptionListTerm>{_("Name")}</DescriptionListTerm>
-        <DescriptionListDescription>{initiator.name}</DescriptionListDescription>
-      </DescriptionListGroup>
-    </DescriptionList>
+    <>
+      {textStart}{" "}
+      <Link to={STORAGE.iscsi.initiator} variant="link" isInline>
+        {linkText}
+      </Link>{" "}
+      {textEnd}
+    </>
   );
-};
+}
 
 export default function InitiatorSection() {
-  const initiator = useInitiator();
-  const { mutateAsync: updateInitiator } = useInitiatorMutation();
-  useInitiatorChanges();
-
-  const submitForm = async ({ name }) => {
-    await updateInitiator({ name });
-  };
-
-  const desc = initiator.ibft
-    ? _("Configuration read from the iSCSI Boot Firmware Table (iBFT).")
-    : _("No iSCSI Boot Firmware Table (iBFT) found. The initiator can be configured manually.");
+  const initiator = useSystem().initiator;
 
   return (
-    // TRANSLATORS: iSCSI initiator section name
-    <Page.Section title={_("Initiator")} description={desc}>
-      {initiator.ibft && <InitiatorDescription initiator={initiator} />}
-      {!initiator.ibft && <InitiatorForm initiator={initiator} onSubmit={submitForm} />}
+    <Page.Section
+      actions={
+        <Split hasGutter>
+          <Link to={STORAGE.iscsi.discover} variant="primary">
+            {_("Discover targets")}
+          </Link>
+        </Split>
+      }
+    >
+      <Flex direction={{ default: "column" }}>
+        <Content isEditorial>
+          <Flex gap={{ default: "gapXs" }}>
+            <Text isBold>{_("Initiator")}</Text> <Text component="small">{initiator.name}</Text>
+          </Flex>
+        </Content>
+        <SubtleContent>
+          <Description ibft={initiator.ibft} />
+        </SubtleContent>
+      </Flex>
     </Page.Section>
   );
 }
diff --git a/web/src/components/storage/iscsi/LoginForm.jsx b/web/src/components/storage/iscsi/LoginForm.jsx
deleted file mode 100644
index fdc86851da..0000000000
--- a/web/src/components/storage/iscsi/LoginForm.jsx
+++ /dev/null
@@ -1,94 +0,0 @@
-/*
- * Copyright (c) [2023] SUSE LLC
- *
- * All Rights Reserved.
- *
- * This program is free software; you can redistribute it and/or modify it
- * under the terms of the GNU General Public License as published by the Free
- * Software Foundation; either version 2 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 General Public License for
- * more details.
- *
- * You should have received a copy of the GNU General Public License along
- * with this program; if not, contact SUSE LLC.
- *
- * To contact SUSE LLC about this file by physical or electronic mail, you may
- * find current contact information at www.suse.com.
- */
-
-import React, { useState } from "react";
-import { Alert, Form, FormGroup, FormSelect, FormSelectOption } from "@patternfly/react-core";
-import { sprintf } from "sprintf-js";
-
-import { _ } from "~/i18n";
-import { Popup } from "~/components/core";
-import { AuthFields, NodeStartupOptions } from "~/components/storage/iscsi";
-
-export default function LoginForm({ node, onSubmit: onSubmitProp, onCancel }) {
-  const [data, setData] = useState({
-    username: "",
-    password: "",
-    reverseUsername: "",
-    reversePassword: "",
-    startup: "onboot",
-  });
-  const [isLoading, setIsLoading] = useState(false);
-  const [isFailed, setIsFailed] = useState(false);
-  const [isValidAuth, setIsValidAuth] = useState(true);
-
-  const updateData = (key, value) => setData({ ...data, [key]: value });
-  const onStartupChange = (_, v) => updateData("startup", v);
-
-  const onSubmit = async (event) => {
-    setIsLoading(true);
-    event.preventDefault();
-
-    const result = await onSubmitProp(data);
-
-    if (result !== 0) {
-      setIsFailed(true);
-      setIsLoading(false);
-    }
-  };
-
-  const startupFormOptions = Object.values(NodeStartupOptions).map((option, i) => (
-    /* eslint-disable agama-i18n/string-literals */
-    <FormSelectOption key={i} value={option.value} label={_(option.label)} />
-  ));
-
-  const id = "iscsiLogin";
-  const isDisabled = isLoading || !isValidAuth;
-
-  return (
-    // TRANSLATORS: %s is replaced by the iSCSI target name
-    <Popup isOpen title={sprintf(_("Login %s"), node.target)}>
-      <Form id={id} onSubmit={onSubmit}>
-        {isFailed && (
-          <Alert variant="warning" isInline title={_("Something went wrong")}>
-            <p>{_("Make sure you provide the correct values")}</p>
-          </Alert>
-        )}
-        {/* TRANSLATORS: iSCSI start up mode (on boot/manual/automatic) */}
-        <FormGroup fieldId="startup" label={_("Startup")}>
-          <FormSelect
-            id="startup"
-            aria-label={_("Startup")}
-            value={data.startup}
-            onChange={onStartupChange}
-          >
-            {startupFormOptions}
-          </FormSelect>
-        </FormGroup>
-        <AuthFields data={data} onChange={updateData} onValidate={(v) => setIsValidAuth(v)} />
-      </Form>
-      <Popup.Actions>
-        <Popup.Confirm form={id} type="submit" isDisabled={isDisabled} />
-        <Popup.Cancel onClick={onCancel} isDisabled={isLoading} />
-      </Popup.Actions>
-    </Popup>
-  );
-}
diff --git a/web/src/components/storage/iscsi/NodesPresenter.jsx b/web/src/components/storage/iscsi/NodesPresenter.jsx
deleted file mode 100644
index 3d778b1199..0000000000
--- a/web/src/components/storage/iscsi/NodesPresenter.jsx
+++ /dev/null
@@ -1,146 +0,0 @@
-/*
- * Copyright (c) [2023] SUSE LLC
- *
- * All Rights Reserved.
- *
- * This program is free software; you can redistribute it and/or modify it
- * under the terms of the GNU General Public License as published by the Free
- * Software Foundation; either version 2 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 General Public License for
- * more details.
- *
- * You should have received a copy of the GNU General Public License along
- * with this program; if not, contact SUSE LLC.
- *
- * To contact SUSE LLC about this file by physical or electronic mail, you may
- * find current contact information at www.suse.com.
- */
-
-import React, { useState } from "react";
-import { Table, Thead, Tr, Th, Tbody, Td } from "@patternfly/react-table";
-import { sprintf } from "sprintf-js";
-
-import { _ } from "~/i18n";
-import { RowActions } from "~/components/core";
-import { EditNodeForm, LoginForm, NodeStartupOptions } from "~/components/storage/iscsi";
-import { login, logout, setStartup, deleteNode } from "~/model/storage/iscsi";
-
-export default function NodesPresenter({ nodes }) {
-  const [currentNode, setCurrentNode] = useState();
-  const [isEditFormOpen, setIsEditFormOpen] = useState(false);
-  const [isLoginFormOpen, setIsLoginFormOpen] = useState(false);
-
-  const openLoginForm = (node) => {
-    setCurrentNode(node);
-    setIsLoginFormOpen(true);
-  };
-
-  const closeLoginForm = () => setIsLoginFormOpen(false);
-
-  const submitLoginForm = async (options) => {
-    const result = await login(currentNode, options);
-    if (result === 0) closeLoginForm();
-
-    return result;
-  };
-
-  const openEditForm = (node) => {
-    setCurrentNode(node);
-    setIsEditFormOpen(true);
-  };
-
-  const closeEditForm = () => setIsEditFormOpen(false);
-
-  const submitEditForm = async (data) => {
-    await setStartup(currentNode, data.startup);
-    closeEditForm();
-  };
-
-  const nodeStatus = (node) => {
-    // TRANSLATORS: iSCSI connection status
-    if (!node.connected) return _("Disconnected");
-
-    const startup = Object.values(NodeStartupOptions).find((o) => o.value === node.startup);
-    return sprintf(
-      // TRANSLATORS: iSCSI connection status, %s is replaced by translated
-      // start mode ("Manual", "Automatic" or "On boot")
-      _("Connected (%s)"),
-      /* eslint-disable agama-i18n/string-literals */
-      _(startup.label),
-    );
-  };
-
-  const nodeActions = (node) => {
-    const actions = {
-      edit: {
-        title: _("Edit"),
-        onClick: () => openEditForm(node),
-      },
-      delete: {
-        title: _("Delete"),
-        onClick: () => deleteNode(node),
-        isDanger: true,
-      },
-      login: {
-        title: _("Login"),
-        onClick: () => openLoginForm(node),
-      },
-      logout: {
-        title: _("Logout"),
-        onClick: () => logout(node),
-      },
-    };
-
-    if (node.connected) return [actions.edit, actions.logout];
-    else return [actions.login, actions.delete];
-  };
-
-  const NodeRow = ({ node }) => {
-    return (
-      <Tr>
-        <Td dataLabel={_("Name")}>{node.target}</Td>
-        <Td dataLabel={_("Portal")}>{node.address + ":" + node.port}</Td>
-        <Td dataLabel={_("Interface")}>{node.interface}</Td>
-        <Td dataLabel={_("iBFT")}>{node.ibft ? _("Yes") : _("No")}</Td>
-        <Td dataLabel={_("Status")}>{nodeStatus(node)}</Td>
-        <Td isActionCell>
-          <RowActions actions={nodeActions(node)} id={`actions-for-node${node.id}`} />
-        </Td>
-      </Tr>
-    );
-  };
-
-  const Content = () => {
-    return nodes.map((n) => <NodeRow node={n} key={`node${n.id}`} />);
-  };
-
-  return (
-    <>
-      <Table variant="compact" gridBreakPoint="grid-lg">
-        <Thead>
-          <Tr>
-            <Th>{_("Name")}</Th>
-            <Th>{_("Portal")}</Th>
-            <Th>{_("Interface")}</Th>
-            <Th>{_("iBFT")}</Th>
-            <Th>{_("Status")}</Th>
-            <Th />
-          </Tr>
-        </Thead>
-        <Tbody>
-          <Content />
-        </Tbody>
-      </Table>
-      {isLoginFormOpen && (
-        <LoginForm node={currentNode} onSubmit={submitLoginForm} onCancel={closeLoginForm} />
-      )}
-      {isEditFormOpen && (
-        <EditNodeForm node={currentNode} onSubmit={submitEditForm} onCancel={closeEditForm} />
-      )}
-    </>
-  );
-}
diff --git a/web/src/components/storage/iscsi/StatusFilter.tsx b/web/src/components/storage/iscsi/StatusFilter.tsx
new file mode 100644
index 0000000000..d2e22cb4e6
--- /dev/null
+++ b/web/src/components/storage/iscsi/StatusFilter.tsx
@@ -0,0 +1,102 @@
+/*
+ * Copyright (c) [2026] SUSE LLC
+ *
+ * All Rights Reserved.
+ *
+ * This program is free software; you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the Free
+ * Software Foundation; either version 2 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 General Public License for
+ * more details.
+ *
+ * You should have received a copy of the GNU General Public License along
+ * with this program; if not, contact SUSE LLC.
+ *
+ * To contact SUSE LLC about this file by physical or electronic mail, you may
+ * find current contact information at www.suse.com.
+ */
+
+import React, { useState } from "react";
+import {
+  Flex,
+  MenuToggle,
+  MenuToggleElement,
+  Select,
+  SelectList,
+  SelectOption,
+  SelectProps,
+} from "@patternfly/react-core";
+import Text from "~/components/core/Text";
+import { _ } from "~/i18n";
+
+type StatusFilterProps = {
+  value: string;
+  options: { [key: string]: string };
+  onChange: SelectProps["onSelect"];
+};
+
+const ID = "iscsi-status-filter";
+
+/** Select component for filtering iSCSI targets by status.
+ *
+ * Renders a PF/Select input allowing users to choose one of the available
+ * statuses. The selected value is passed to the parent via the `onChange`
+ * callback along with the event originating the action.
+ *
+ * Used as part of the iSCSI targets table filtering toolbar.
+ *
+ * @privateRemarks There is an issue with a11y label for the PF/MenuToggle,
+ * check https://github.com/patternfly/patternfly-react/issues/11805
+ */
+export default function StatusFilter({ value = "all", options, onChange }: StatusFilterProps) {
+  const [isOpen, setIsOpen] = useState(false);
+  const onToggle = () => setIsOpen(!isOpen);
+  const opts = { all: _("All"), ...options };
+
+  const toggle = (toggleRef: React.Ref<MenuToggleElement>) => (
+    <MenuToggle
+      id={ID}
+      ref={toggleRef}
+      onClick={onToggle}
+      isExpanded={isOpen}
+      aria-label={_("Status filter toggle")}
+    >
+      {/* eslint-disable agama-i18n/string-literals */}
+      {_(opts[value])}
+    </MenuToggle>
+  );
+
+  return (
+    <Flex direction={{ default: "column" }} columnGap={{ default: "columnGapXs" }}>
+      <label htmlFor={ID}>
+        <Text isBold aria-hidden>
+          {_("Status")}
+        </Text>
+      </label>
+
+      <Select
+        isOpen={isOpen}
+        selected={value}
+        onSelect={(e, v) => {
+          onChange(e, v);
+          onToggle();
+        }}
+        onOpenChange={(isOpen) => setIsOpen(isOpen)}
+        toggle={toggle}
+      >
+        <SelectList>
+          {Object.keys(opts).map((key) => (
+            <SelectOption key={key} value={key}>
+              {/* eslint-disable agama-i18n/string-literals */}
+              {_(opts[key])}
+            </SelectOption>
+          ))}
+        </SelectList>
+      </Select>
+    </Flex>
+  );
+}
diff --git a/web/src/components/storage/iscsi/TargetLoginPage.test.tsx b/web/src/components/storage/iscsi/TargetLoginPage.test.tsx
new file mode 100644
index 0000000000..519fec059b
--- /dev/null
+++ b/web/src/components/storage/iscsi/TargetLoginPage.test.tsx
@@ -0,0 +1,411 @@
+/*
+ * Copyright (c) [2026] SUSE LLC
+ *
+ * All Rights Reserved.
+ *
+ * This program is free software; you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the Free
+ * Software Foundation; either version 2 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 General Public License for
+ * more details.
+ *
+ * You should have received a copy of the GNU General Public License along
+ * with this program; if not, contact SUSE LLC.
+ *
+ * To contact SUSE LLC about this file by physical or electronic mail, you may
+ * find current contact information at www.suse.com.
+ */
+
+import React from "react";
+import { screen } from "@testing-library/react";
+import { installerRender, mockParams } from "~/test-utils";
+import TargetLoginPage from "./TargetLoginPage";
+
+const mockUseSystemFn = jest.fn();
+const mockUseConfigFn = jest.fn();
+const mockAddOrEditTargetFnt = jest.fn();
+const testingTargets = [
+  {
+    name: "iqn.2023-01.com.example:12ac588",
+    address: "192.168.100.102",
+    port: 3262,
+    interface: "default",
+    startup: "onboot",
+  },
+  {
+    name: "iqn.2023-01.com.example:12ac788",
+    address: "192.168.100.106",
+    port: 3264,
+    interface: "default",
+    startup: "onboot",
+  },
+];
+
+jest.mock("~/hooks/model/system/iscsi", () => ({
+  ...jest.requireActual("~/hooks/model/system/iscsi"),
+  useSystem: () => mockUseSystemFn(),
+}));
+
+jest.mock("~/hooks/model/config/iscsi", () => ({
+  ...jest.requireActual("~/hooks/model/config/iscsi"),
+  useConfig: () => mockUseConfigFn(),
+  useAddOrEditTarget: () => mockAddOrEditTargetFnt,
+}));
+
+// Needed by withL10n
+jest.mock("~/hooks/model/system", () => ({
+  useSystem: () => ({
+    l10n: {
+      keymap: "us",
+      timezone: "Europe/Berlin",
+      locale: "en_US",
+    },
+  }),
+}));
+
+describe("TargetLoginPage", () => {
+  it("renders resource not found when target does not exits", () => {
+    // There are no targets at all
+    mockUseSystemFn.mockReturnValue({ targets: [] });
+    const { rerender } = installerRender(<TargetLoginPage />);
+    screen.getByRole("heading", { name: "Target not found" });
+    // There are targets but not the one looking for
+    mockParams({
+      name: "iqn.2023-01.com.example:12ac588",
+      address: "192.168.100.102",
+      port: "3060",
+    });
+    mockUseSystemFn.mockReturnValue({
+      targets: testingTargets,
+    });
+    rerender(<TargetLoginPage />);
+    screen.getByRole("heading", { name: "Target not found" });
+  });
+
+  it("does not render resource not found when target exists in system", () => {
+    mockParams({
+      name: testingTargets[0].name,
+      address: testingTargets[0].address,
+      port: String(testingTargets[0].port),
+    });
+    mockUseSystemFn.mockReturnValue({ targets: testingTargets });
+    mockUseConfigFn.mockReturnValue({ targets: [] });
+
+    installerRender(<TargetLoginPage />, { withL10n: true });
+
+    screen.getByText(testingTargets[0].name);
+    expect(screen.queryByRole("heading", { name: "Target not found" })).toBeNull();
+  });
+
+  it("does not render resource not found when target exists in config", () => {
+    mockParams({
+      name: testingTargets[0].name,
+      address: testingTargets[0].address,
+      port: String(testingTargets[0].port),
+    });
+
+    mockUseSystemFn.mockReturnValue({ targets: [] });
+    mockUseConfigFn.mockReturnValue({ targets: testingTargets });
+
+    installerRender(<TargetLoginPage />, { withL10n: true });
+
+    screen.getByText(testingTargets[0].name);
+    expect(screen.queryByRole("heading", { name: "Target not found" })).toBeNull();
+  });
+
+  it("does not render resource not found when target exists in both system and config", () => {
+    mockParams({
+      name: testingTargets[0].name,
+      address: testingTargets[0].address,
+      port: String(testingTargets[0].port),
+    });
+
+    mockUseSystemFn.mockReturnValue({ targets: testingTargets });
+    mockUseConfigFn.mockReturnValue({ targets: testingTargets });
+
+    installerRender(<TargetLoginPage />, { withL10n: true });
+
+    screen.getByText(testingTargets[0].name);
+    expect(screen.queryByRole("heading", { name: "Target not found" })).toBeNull();
+  });
+
+  it("allows login without auth", async () => {
+    mockParams({
+      name: "iqn.2023-01.com.example:12ac588",
+      address: "192.168.100.102",
+      port: "3262",
+    });
+
+    mockUseSystemFn.mockReturnValue({
+      targets: testingTargets,
+    });
+
+    const target = testingTargets[0];
+
+    const { user } = installerRender(<TargetLoginPage />, { withL10n: true });
+    screen.getByText(target.name);
+    screen.getByText(`${target.address}:${target.port}`);
+
+    const acceptButton = screen.getByRole("button", { name: "Accept" });
+    const startupOptions = screen.getByRole("combobox", { name: "Startup" });
+
+    await user.selectOptions(startupOptions, "Manual");
+    await user.click(acceptButton);
+    expect(mockAddOrEditTargetFnt).toHaveBeenCalledWith({ ...target, startup: "manual" });
+  });
+
+  it("allows login with target auth", async () => {
+    mockParams({
+      name: "iqn.2023-01.com.example:12ac588",
+      address: "192.168.100.102",
+      port: "3262",
+    });
+
+    mockUseSystemFn.mockReturnValue({
+      targets: testingTargets,
+    });
+
+    const target = testingTargets[0];
+
+    const { user } = installerRender(<TargetLoginPage />, { withL10n: true });
+    screen.getByText(target.name);
+    screen.getByText(`${target.address}:${target.port}`);
+
+    const acceptButton = screen.getByRole("button", { name: "Accept" });
+    const startupOptions = screen.getByRole("combobox", { name: "Startup" });
+
+    await user.selectOptions(startupOptions, "Manual");
+
+    await user.click(acceptButton);
+    const provideAuthSwitch = screen.getByRole("switch", { name: "Provide authentication" });
+    await user.click(provideAuthSwitch);
+    const username = screen.getByRole("textbox", { name: "User name" });
+    const password = screen.getByLabelText("Password");
+    await user.type(username, "john");
+    await user.type(password, "secret");
+    await user.click(acceptButton);
+    expect(mockAddOrEditTargetFnt).toHaveBeenCalledWith({
+      ...target,
+      startup: "manual",
+      authByTarget: { username: "john", password: "secret" },
+    });
+  });
+
+  it("allows login with target and initiator auth", async () => {
+    mockParams({
+      name: "iqn.2023-01.com.example:12ac588",
+      address: "192.168.100.102",
+      port: "3262",
+    });
+    mockUseSystemFn.mockReturnValue({
+      targets: testingTargets,
+    });
+
+    const target = testingTargets[0];
+
+    const { user } = installerRender(<TargetLoginPage />, { withL10n: true });
+    screen.getByText(target.name);
+    screen.getByText(`${target.address}:${target.port}`);
+
+    const acceptButton = screen.getByRole("button", { name: "Accept" });
+    const startupOptions = screen.getByRole("combobox", { name: "Startup" });
+
+    await user.selectOptions(startupOptions, "Manual");
+
+    await user.click(acceptButton);
+    const provideAuthSwitch = screen.getByRole("switch", { name: "Provide authentication" });
+    await user.click(provideAuthSwitch);
+    const username = screen.getByRole("textbox", { name: "User name" });
+    const password = screen.getByLabelText("Password");
+    await user.type(username, "john");
+    await user.type(password, "secret");
+    const mutualAuthSwitch = screen.getByRole("switch", { name: "Enable mutual verification" });
+    await user.click(mutualAuthSwitch);
+    const initiatorUsername = screen.getByRole("textbox", { name: "Initiator user name" });
+    const initiatorPassword = screen.getByLabelText("Initiator password");
+    await user.type(initiatorUsername, "jane");
+    await user.type(initiatorPassword, "secret");
+    await user.click(acceptButton);
+    expect(mockAddOrEditTargetFnt).toHaveBeenCalledWith({
+      ...target,
+      startup: "manual",
+      authByTarget: { username: "john", password: "secret" },
+      authByInitiator: { username: "jane", password: "secret" },
+    });
+  });
+
+  it("pre-populates form with existing target authentication", async () => {
+    mockParams({
+      name: "iqn.2023-01.com.example:12ac588",
+      address: "192.168.100.102",
+      port: "3262",
+    });
+
+    const configTarget = {
+      name: "iqn.2023-01.com.example:12ac588",
+      address: "192.168.100.102",
+      port: 3262,
+      interface: "default",
+      startup: "onboot",
+      authByTarget: { username: "john", password: "secret123" },
+      authByInitiator: { username: "jane", password: "secret456" },
+    };
+
+    mockUseSystemFn.mockReturnValue({ targets: [] });
+    mockUseConfigFn.mockReturnValue({ targets: [configTarget] });
+
+    installerRender(<TargetLoginPage />, { withL10n: true });
+
+    const provideAuthSwitch = screen.getByRole("switch", { name: "Provide authentication" });
+    expect(provideAuthSwitch).toBeChecked();
+
+    const mutualAuthSwitch = screen.getByRole("switch", { name: "Enable mutual verification" });
+    expect(mutualAuthSwitch).toBeChecked();
+
+    const username = screen.getByRole("textbox", { name: "User name" });
+    expect(username).toHaveValue("john");
+
+    const password = screen.getByLabelText("Password");
+    expect(password).toHaveValue("secret123");
+
+    const initiatorUsername = screen.getByRole("textbox", { name: "Initiator user name" });
+    expect(initiatorUsername).toHaveValue("jane");
+
+    const initiatorPassword = screen.getByLabelText("Initiator password");
+    expect(initiatorPassword).toHaveValue("secret456");
+  });
+
+  it("pre-populates only target auth when initiator auth is not configured", async () => {
+    mockParams({
+      name: "iqn.2023-01.com.example:12ac588",
+      address: "192.168.100.102",
+      port: "3262",
+    });
+
+    const configTarget = {
+      name: "iqn.2023-01.com.example:12ac588",
+      address: "192.168.100.102",
+      port: 3262,
+      interface: "default",
+      startup: "onboot",
+      authByTarget: { username: "john", password: "secret123" },
+    };
+
+    mockUseSystemFn.mockReturnValue({ targets: [] });
+    mockUseConfigFn.mockReturnValue({ targets: [configTarget] });
+
+    installerRender(<TargetLoginPage />, { withL10n: true });
+
+    const provideAuthSwitch = screen.getByRole("switch", { name: "Provide authentication" });
+    expect(provideAuthSwitch).toBeChecked();
+
+    const mutualAuthSwitch = screen.getByRole("switch", { name: "Enable mutual verification" });
+    expect(mutualAuthSwitch).not.toBeChecked();
+
+    const username = screen.getByRole("textbox", { name: "User name" });
+    expect(username).toHaveValue("john");
+
+    const password = screen.getByLabelText("Password");
+    expect(password).toHaveValue("secret123");
+
+    expect(screen.queryByRole("textbox", { name: "Initiator user name" })).not.toBeInTheDocument();
+  });
+
+  it("allows editing pre-populated authentication data", async () => {
+    mockParams({
+      name: "iqn.2023-01.com.example:12ac588",
+      address: "192.168.100.102",
+      port: "3262",
+    });
+
+    const configTarget = {
+      name: "iqn.2023-01.com.example:12ac588",
+      address: "192.168.100.102",
+      port: 3262,
+      interface: "default",
+      startup: "automatic",
+      authByTarget: { username: "john", password: "secret123" },
+    };
+
+    mockUseSystemFn.mockReturnValue({ targets: [] });
+    mockUseConfigFn.mockReturnValue({ targets: [configTarget] });
+
+    const { user } = installerRender(<TargetLoginPage />, { withL10n: true });
+
+    const acceptButton = screen.getByRole("button", { name: "Accept" });
+    const username = screen.getByRole("textbox", { name: "User name" });
+    const password = screen.getByLabelText("Password");
+
+    await user.clear(username);
+    await user.type(username, "new_user");
+
+    await user.clear(password);
+    await user.type(password, "new_pass");
+
+    await user.click(acceptButton);
+
+    expect(mockAddOrEditTargetFnt).toHaveBeenCalledWith({
+      name: configTarget.name,
+      address: configTarget.address,
+      port: configTarget.port,
+      interface: configTarget.interface,
+      startup: "automatic",
+      authByTarget: { username: "new_user", password: "new_pass" },
+    });
+  });
+
+  it("uses system target when config target is not available", async () => {
+    mockParams({
+      name: "iqn.2023-01.com.example:12ac588",
+      address: "192.168.100.102",
+      port: "3262",
+    });
+
+    mockUseSystemFn.mockReturnValue({ targets: testingTargets });
+    mockUseConfigFn.mockReturnValue({ targets: [] });
+
+    installerRender(<TargetLoginPage />, { withL10n: true });
+
+    const target = testingTargets[0];
+    screen.getByText(target.name);
+    screen.getByText(`${target.address}:${target.port}`);
+
+    const startupOptions = screen.getByRole("combobox", { name: "Startup" });
+    expect(startupOptions).toHaveValue("onboot");
+  });
+
+  it("prioritizes config target properties over system target properties", async () => {
+    mockParams({
+      name: "iqn.2023-01.com.example:12ac588",
+      address: "192.168.100.102",
+      port: "3262",
+    });
+
+    const systemTarget = {
+      name: "iqn.2023-01.com.example:12ac588",
+      address: "192.168.100.102",
+      port: 3262,
+      interface: "default",
+      startup: "onboot",
+    };
+
+    const configTarget = {
+      name: "iqn.2023-01.com.example:12ac588",
+      address: "192.168.100.102",
+      port: 3262,
+      startup: "manual",
+    };
+
+    mockUseSystemFn.mockReturnValue({ targets: [systemTarget] });
+    mockUseConfigFn.mockReturnValue({ targets: [configTarget] });
+
+    installerRender(<TargetLoginPage />, { withL10n: true });
+
+    const startupOptions = screen.getByRole("combobox", { name: "Startup" });
+    expect(startupOptions).toHaveValue("manual");
+  });
+});
diff --git a/web/src/components/storage/iscsi/TargetLoginPage.tsx b/web/src/components/storage/iscsi/TargetLoginPage.tsx
new file mode 100644
index 0000000000..0d33749130
--- /dev/null
+++ b/web/src/components/storage/iscsi/TargetLoginPage.tsx
@@ -0,0 +1,326 @@
+/*
+ * Copyright (c) [2026] SUSE LLC
+ *
+ * All Rights Reserved.
+ *
+ * This program is free software; you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the Free
+ * Software Foundation; either version 2 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 General Public License for
+ * more details.
+ *
+ * You should have received a copy of the GNU General Public License along
+ * with this program; if not, contact SUSE LLC.
+ *
+ * To contact SUSE LLC about this file by physical or electronic mail, you may
+ * find current contact information at www.suse.com.
+ */
+
+import React, { useEffect, useReducer, useState, useRef } from "react";
+import { useParams, useNavigate } from "react-router";
+import { isEmpty, pick } from "radashi";
+import { sprintf } from "sprintf-js";
+import {
+  ActionGroup,
+  Alert,
+  DescriptionList,
+  DescriptionListDescription,
+  DescriptionListGroup,
+  DescriptionListTerm,
+  Form,
+  FormGroup,
+  FormSelect,
+  FormSelectOption,
+  List,
+  ListItem,
+  Split,
+  TextInput,
+} from "@patternfly/react-core";
+import Page from "~/components/core/Page";
+import NestedContent from "~/components/core/NestedContent";
+import PasswordInput from "~/components/core/PasswordInput";
+import ResourceNotFound from "~/components/core/ResourceNotFound";
+import SwitchEnhanced from "~/components/core/SwitchEnhanced";
+import { useSystem } from "~/hooks/model/system/iscsi";
+import { useAddOrEditTarget, useConfig } from "~/hooks/model/config/iscsi";
+import { STORAGE } from "~/routes/paths";
+import { N_, _ } from "~/i18n";
+
+import type { Target as ConfigTarget, Authentication } from "~/openapi/config/iscsi";
+
+export const StartupOptions = Object.freeze({
+  MANUAL: { label: N_("Manual"), value: "manual" },
+  ONBOOT: { label: N_("On boot"), value: "onboot" },
+  AUTOMATIC: { label: N_("Automatic"), value: "automatic" },
+});
+
+/**
+ * Represents the form state.
+ */
+type FormState = {
+  username?: Authentication["username"];
+  password?: Authentication["password"];
+  reverseUsername?: Authentication["username"];
+  reversePassword?: Authentication["password"];
+  startup: ConfigTarget["startup"];
+};
+
+/**
+ * Generic action to set any field in the form state.
+ */
+type SetValueFormAction = {
+  [K in keyof FormState]: {
+    type: "SET_VALUE";
+    field: K;
+    payload: FormState[K];
+  };
+}[keyof FormState];
+
+const formReducer = (state: FormState, action?: SetValueFormAction): FormState => {
+  const { type, field, payload } = action;
+
+  switch (type) {
+    case "SET_VALUE":
+      return { ...state, [field]: payload };
+    default:
+      return state;
+  }
+};
+
+/**
+ * Helper to create a change handler that infers the field from the input name.
+ */
+const handleInputChange =
+  (dispatch: React.Dispatch<SetValueFormAction>) =>
+  (e: React.FormEvent<HTMLInputElement | HTMLSelectElement>) => {
+    const target = e.target as HTMLFormElement;
+    const field = target.name as keyof FormState;
+
+    dispatch({
+      type: "SET_VALUE",
+      field,
+      payload: target.value,
+    });
+  };
+
+function TargetLoginForm({ target }): React.ReactNode {
+  const alertRef = useRef(null);
+  const addOrEditTarget = useAddOrEditTarget();
+  const navigate = useNavigate();
+  const [state, dispatch] = useReducer(formReducer, {
+    username: target.authByTarget?.username || "",
+    password: target.authByTarget?.password || "",
+    reverseUsername: target.authByInitiator?.username || "",
+    reversePassword: target.authByInitiator?.password || "",
+    startup: target.startup || "onboot",
+  });
+  const [showAuth, setShowAuth] = useState(!isEmpty(state.username));
+  const [showMutualAuth, setShowMutualAuth] = useState(!isEmpty(state.reverseUsername));
+  const [errors, setErrors] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+
+  useEffect(() => {
+    // Scroll the alert into view
+    if (errors.length > 0) {
+      alertRef.current.scrollIntoView({
+        behavior: "smooth",
+        block: "start",
+      });
+    }
+  }, [errors]);
+
+  const onSubmit = async (event) => {
+    event.preventDefault();
+    setIsLoading(true);
+    setErrors([]);
+    const nextErrors = [];
+
+    const fieldsToCheck: Array<keyof FormState> = ["startup"];
+
+    showAuth && fieldsToCheck.push("username", "password");
+    showAuth && showMutualAuth && fieldsToCheck.push("reverseUsername", "reversePassword");
+
+    if (Object.values(pick(state, fieldsToCheck)).some((v) => isEmpty(v))) {
+      nextErrors.push(_("All fields are required."));
+    }
+
+    if (nextErrors.length > 0) {
+      setErrors(nextErrors);
+      setIsLoading(false);
+      return;
+    }
+
+    const authByTarget = showAuth
+      ? { username: state.username, password: state.password }
+      : undefined;
+    const authByInitiator =
+      showAuth && showMutualAuth
+        ? { username: state.reverseUsername, password: state.reversePassword }
+        : undefined;
+
+    const targetConfig: ConfigTarget = {
+      name: target.name,
+      address: target.address,
+      port: target.port,
+      interface: target.interface,
+      startup: state.startup,
+      authByTarget,
+      authByInitiator,
+    };
+    addOrEditTarget(targetConfig);
+    navigate({ pathname: STORAGE.iscsi.root });
+  };
+
+  const onChange = handleInputChange(dispatch);
+
+  const startupFormOptions = Object.values(StartupOptions).map((option, i) => (
+    /* eslint-disable agama-i18n/string-literals */
+    <FormSelectOption key={i} value={option.value} label={_(option.label)} />
+  ));
+
+  return (
+    <Form onSubmit={onSubmit}>
+      {errors.length > 0 && (
+        <div ref={alertRef}>
+          <Alert variant="warning" isInline title={_("Something went wrong")}>
+            <List>
+              {errors.map((error, i) => (
+                <ListItem key={`error_${i}`}>{error}</ListItem>
+              ))}
+            </List>
+          </Alert>
+        </div>
+      )}
+
+      <DescriptionList isCompact>
+        <DescriptionListGroup>
+          <DescriptionListTerm>{_("Target")}</DescriptionListTerm>
+          <DescriptionListDescription>{target.name}</DescriptionListDescription>
+        </DescriptionListGroup>
+        <DescriptionListGroup>
+          <DescriptionListTerm>{_("Portal")}</DescriptionListTerm>
+          <DescriptionListDescription>
+            {`${target.address}:${target.port}`}
+          </DescriptionListDescription>
+        </DescriptionListGroup>
+      </DescriptionList>
+
+      {/* TRANSLATORS: iSCSI start up mode (on boot/manual/automatic) */}
+      <FormGroup fieldId="startup" label={_("Startup")}>
+        <FormSelect
+          id="startup"
+          name="startup"
+          aria-label={_("Startup")}
+          value={state.startup}
+          onChange={onChange}
+        >
+          {startupFormOptions}
+        </FormSelect>
+      </FormGroup>
+      <SwitchEnhanced
+        id="useAuth"
+        label={_("Provide authentication")}
+        description={_("CHAP authentication performed by the target")}
+        isChecked={showAuth}
+        onChange={() => setShowAuth(!showAuth)}
+      />
+      {showAuth && (
+        <NestedContent>
+          <Split hasGutter>
+            <FormGroup fieldId="username" label={_("User name")}>
+              <TextInput id="username" name="username" value={state.username} onChange={onChange} />
+            </FormGroup>
+            <FormGroup fieldId="password" label={_("Password")}>
+              <PasswordInput
+                id="password"
+                name="password"
+                value={state.password}
+                onChange={onChange}
+              />
+            </FormGroup>
+          </Split>
+
+          <SwitchEnhanced
+            id="useMutualAuth"
+            label={_("Enable mutual verification")}
+            description={_("Additional CHAP authentication performed by the initiator")}
+            isChecked={showMutualAuth}
+            onChange={() => setShowMutualAuth(!showMutualAuth)}
+          />
+          {showMutualAuth && (
+            <Split hasGutter>
+              <FormGroup fieldId="reverseUsername" label={_("Initiator user name")}>
+                <TextInput
+                  id="reverseUsername"
+                  name="reverseUsername"
+                  value={state.reverseUsername}
+                  onChange={onChange}
+                />
+              </FormGroup>
+              <FormGroup fieldId="reversePassword" label="Initiator password">
+                <PasswordInput
+                  id="reversePassword"
+                  name="reversePassword"
+                  value={state.reversePassword}
+                  onChange={onChange}
+                />
+              </FormGroup>
+            </Split>
+          )}
+        </NestedContent>
+      )}
+
+      <ActionGroup>
+        <Page.Submit />
+        {!isLoading && <Page.Back>{_("Cancel")}</Page.Back>}
+      </ActionGroup>
+    </Form>
+  );
+}
+
+export default function TargetLoginPage() {
+  const { name, address, port } = useParams();
+  const config = useConfig();
+  const system = useSystem();
+
+  const systemTarget = system?.targets?.find(
+    (t) => t.name === name && t.address === address && t.port === Number(port),
+  );
+
+  const configTarget = config?.targets?.find(
+    (t) => t.name === name && t.address === address && t.port === Number(port),
+  );
+
+  const target = { ...systemTarget, ...configTarget };
+
+  return (
+    <Page
+      breadcrumbs={[
+        { label: _("Storage"), path: STORAGE.root },
+        { label: _("iSCSI"), path: STORAGE.iscsi.root },
+        { label: _("Login") },
+      ]}
+    >
+      <Page.Content>
+        {isEmpty(target) ? (
+          <ResourceNotFound
+            title={_("Target not found")}
+            body={sprintf(
+              _("%s at portal %s does not exist or cannot be reached."),
+              name,
+              `${address}:${port}`,
+            )}
+            linkText={_("Go to iSCSI")}
+            linkPath={STORAGE.iscsi.root}
+          />
+        ) : (
+          <TargetLoginForm target={target} />
+        )}
+      </Page.Content>
+    </Page>
+  );
+}
diff --git a/web/src/components/storage/iscsi/TargetsSection.test.tsx b/web/src/components/storage/iscsi/TargetsSection.test.tsx
deleted file mode 100644
index 93f5c0fe98..0000000000
--- a/web/src/components/storage/iscsi/TargetsSection.test.tsx
+++ /dev/null
@@ -1,178 +0,0 @@
-/*
- * Copyright (c) [2024] SUSE LLC
- *
- * All Rights Reserved.
- *
- * This program is free software; you can redistribute it and/or modify it
- * under the terms of the GNU General Public License as published by the Free
- * Software Foundation; either version 2 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 General Public License for
- * more details.
- *
- * You should have received a copy of the GNU General Public License along
- * with this program; if not, contact SUSE LLC.
- *
- * To contact SUSE LLC about this file by physical or electronic mail, you may
- * find current contact information at www.suse.com.
- */
-
-import React from "react";
-import { screen, waitFor, within } from "@testing-library/react";
-import { installerRender } from "~/test-utils";
-import TargetsSection from "./TargetsSection";
-import { deleteNode, discover, login, logout } from "~/model/storage/iscsi";
-
-let mockNodes = [];
-const mockDiscover = jest.fn();
-const node1 = {
-  id: 1,
-  address: "192.168.122.10",
-  target: "iqn.2024-09.com.example",
-  port: "e5ce1696dbf39d938e88",
-  connected: false,
-  ibft: false,
-  interface: "default",
-  startup: "",
-};
-
-const node2 = {
-  id: 2,
-  address: "192.168.122.10",
-  target: "iqn.2024-09.com.example",
-  port: "a9fd1c74adea4cbd80502",
-  connected: true,
-  ibft: false,
-  interface: "default",
-  startup: "onboot",
-};
-
-jest.mock("~/queries/storage/iscsi", () => ({
-  ...jest.requireActual("~/queries/storage/iscsi"),
-  useNodes: () => mockNodes,
-}));
-
-jest.mock("~/model/storage/iscsi", () => ({
-  ...jest.requireActual("~/model/storage/iscsi"),
-  discover: jest.fn().mockResolvedValue(true),
-  login: jest.fn().mockResolvedValue(0),
-  logout: jest.fn(),
-  deleteNode: jest.fn(),
-}));
-
-it.todo("Adapt to new api");
-describe.skip("TargetsSection", () => {
-  beforeEach(() => {
-    mockNodes = [];
-    mockDiscover.mockResolvedValue(true);
-  });
-
-  describe("allows discovering the node", () => {
-    it("asks for discover info and closes the dialog on success", async () => {
-      const { user } = installerRender(<TargetsSection />, { withL10n: true });
-      const button = await screen.findByRole("button", { name: "Discover iSCSI targets" });
-      await user.click(button);
-
-      const dialog = await screen.findByRole("dialog");
-
-      const ipAddressInput = within(dialog).getByLabelText(/IP address/);
-      await user.type(ipAddressInput, "192.168.122.10");
-
-      const portInput = within(dialog).getByLabelText(/Port/);
-      await user.clear(portInput);
-      await user.type(portInput, "3260");
-
-      const [usernameInput] = within(dialog).queryAllByText("User name");
-      await user.type(usernameInput, "admin");
-
-      const [passwordInput] = within(dialog).queryAllByText("Password");
-      await user.type(passwordInput, "admin.pass");
-
-      const confirmButton = await within(dialog).findByRole("button", { name: "Confirm" });
-      await user.click(confirmButton);
-
-      await waitFor(() => {
-        expect(dialog).not.toBeInTheDocument();
-      });
-
-      expect(discover).toHaveBeenCalledWith("192.168.122.10", 3260, {
-        username: "admin",
-        password: "admin.pass",
-        reverseUsername: "",
-        reversePassword: "",
-      });
-    });
-  });
-
-  describe("when there is a target", () => {
-    beforeEach(() => {
-      mockNodes = [node1, node2];
-    });
-
-    it("allows logging into disconnected targets", async () => {
-      const { user } = installerRender(<TargetsSection />, { withL10n: true });
-
-      const row = await screen.findByRole("row", { name: /Disconnected/ });
-      const actionsButton = await within(row).findByRole("button", { name: "Actions" });
-      await user.click(actionsButton);
-      const loginButton = await screen.findByRole("menuitem", { name: "Login" });
-      await user.click(loginButton);
-
-      const dialog = await screen.findByRole("dialog");
-      const startupSelect = await within(dialog).findByRole("combobox", { name: "Startup" });
-      await user.selectOptions(startupSelect, "Automatic");
-
-      const [usernameInput] = within(dialog).queryAllByText("User name");
-      await user.type(usernameInput, "admin");
-
-      const [passwordInput] = within(dialog).queryAllByText("Password");
-      await user.type(passwordInput, "admin.pass");
-
-      const confirmButton = await within(dialog).findByRole("button", { name: "Confirm" });
-      await user.click(confirmButton);
-
-      await waitFor(() => {
-        expect(dialog).not.toBeInTheDocument();
-      });
-
-      expect(login).toHaveBeenCalledWith(node1, {
-        username: "admin",
-        password: "admin.pass",
-        reverseUsername: "",
-        reversePassword: "",
-        startup: "automatic",
-      });
-    });
-
-    it("allows logging out connected targets", async () => {
-      const { user } = installerRender(<TargetsSection />, { withL10n: true });
-
-      const row = await screen.findByRole("row", { name: /Connected/ });
-      const actionsButton = await within(row).findByRole("button", { name: "Actions" });
-      await user.click(actionsButton);
-      const logoutButton = await screen.findByRole("menuitem", { name: "Logout" });
-      await user.click(logoutButton);
-
-      await waitFor(() => {
-        expect(logout).toHaveBeenCalledWith(node2);
-      });
-    });
-
-    it("allows deleting a disconnected target", async () => {
-      const { user } = installerRender(<TargetsSection />, { withL10n: true });
-
-      const row = await screen.findByRole("row", { name: /Disconnected/ });
-      const actionsButton = await within(row).findByRole("button", { name: "Actions" });
-      await user.click(actionsButton);
-      const deleteButton = await screen.findByRole("menuitem", { name: "Delete" });
-      await user.click(deleteButton);
-
-      await waitFor(() => {
-        expect(deleteNode).toHaveBeenCalledWith(node1);
-      });
-    });
-  });
-});
diff --git a/web/src/components/storage/iscsi/TargetsSection.tsx b/web/src/components/storage/iscsi/TargetsSection.tsx
deleted file mode 100644
index 09c83dbcc5..0000000000
--- a/web/src/components/storage/iscsi/TargetsSection.tsx
+++ /dev/null
@@ -1,93 +0,0 @@
-/*
- * Copyright (c) [2023-2025] SUSE LLC
- *
- * All Rights Reserved.
- *
- * This program is free software; you can redistribute it and/or modify it
- * under the terms of the GNU General Public License as published by the Free
- * Software Foundation; either version 2 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 General Public License for
- * more details.
- *
- * You should have received a copy of the GNU General Public License along
- * with this program; if not, contact SUSE LLC.
- *
- * To contact SUSE LLC about this file by physical or electronic mail, you may
- * find current contact information at www.suse.com.
- */
-
-import React, { useState } from "react";
-import { Button, Toolbar, ToolbarItem, ToolbarContent, Stack } from "@patternfly/react-core";
-import { Page } from "~/components/core";
-import { NodesPresenter, DiscoverForm } from "~/components/storage/iscsi";
-import { _ } from "~/i18n";
-import { useNodes, useNodesChanges } from "~/queries/storage/iscsi";
-import { discover } from "~/model/storage/iscsi";
-
-export default function TargetsSection() {
-  const [isDiscoverFormOpen, setIsDiscoverFormOpen] = useState<boolean>(false);
-  const nodes = useNodes();
-  useNodesChanges();
-
-  const openDiscoverForm = () => setIsDiscoverFormOpen(true);
-  const closeDiscoverForm = () => setIsDiscoverFormOpen(false);
-
-  const submitDiscoverForm = async (data) => {
-    const { username, password, reverseUsername, reversePassword } = data;
-    const success = await discover(data.address, parseInt(data.port), {
-      username,
-      password,
-      reverseUsername,
-      reversePassword,
-    });
-
-    if (success) closeDiscoverForm();
-
-    return success;
-  };
-
-  const SectionContent = () => {
-    if (nodes.length === 0) {
-      return (
-        <Stack hasGutter>
-          <div>{_("No iSCSI targets found.")}</div>
-          <div>
-            {_("Please, perform an iSCSI discovery in order to find available iSCSI targets.")}
-          </div>
-          {/* TRANSLATORS: button label, starts iSCSI discovery */}
-          <Button variant="primary" onClick={openDiscoverForm}>
-            {_("Discover iSCSI targets")}
-          </Button>
-        </Stack>
-      );
-    }
-
-    return (
-      <>
-        <Toolbar>
-          <ToolbarContent>
-            <ToolbarItem align={{ default: "alignEnd" }}>
-              {/* TRANSLATORS: button label, starts iSCSI discovery */}
-              <Button onClick={openDiscoverForm}>{_("Discover")}</Button>
-            </ToolbarItem>
-          </ToolbarContent>
-        </Toolbar>
-        <NodesPresenter nodes={nodes} />
-      </>
-    );
-  };
-
-  return (
-    // TRANSLATORS: iSCSI targets section title
-    <Page.Section title={_("Targets")}>
-      <SectionContent />
-      {isDiscoverFormOpen && (
-        <DiscoverForm onSubmit={submitDiscoverForm} onCancel={closeDiscoverForm} />
-      )}
-    </Page.Section>
-  );
-}
diff --git a/web/src/components/storage/iscsi/TargetsTable.test.tsx b/web/src/components/storage/iscsi/TargetsTable.test.tsx
new file mode 100644
index 0000000000..b21ffb5785
--- /dev/null
+++ b/web/src/components/storage/iscsi/TargetsTable.test.tsx
@@ -0,0 +1,587 @@
+/*
+ * Copyright (c) [2026] SUSE LLC
+ *
+ * All Rights Reserved.
+ *
+ * This program is free software; you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the Free
+ * Software Foundation; either version 2 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 General Public License for
+ * more details.
+ *
+ * You should have received a copy of the GNU General Public License along
+ * with this program; if not, contact SUSE LLC.
+ *
+ * To contact SUSE LLC about this file by physical or electronic mail, you may
+ * find current contact information at www.suse.com.
+ */
+
+import React from "react";
+import { screen, within } from "@testing-library/react";
+import { installerRender, mockNavigateFn } from "~/test-utils";
+import TargetsTable from "./TargetsTable";
+import { omit } from "radashi";
+
+const mockUseSystemFn = jest.fn();
+const mockUseConfigFn = jest.fn();
+const mockRemoveTargetFn = jest.fn();
+
+const connectedTarget = {
+  name: "iqn.2023-01.com.example:connected",
+  address: "192.168.100.102",
+  port: 3262,
+  interface: "default",
+  startup: "onboot",
+  connected: true,
+  locked: false,
+};
+
+const disconnectedTarget = {
+  name: "iqn.2023-01.com.example:disconnected",
+  address: "192.168.100.103",
+  port: 3263,
+  interface: "default",
+  startup: "onboot",
+  connected: false,
+  locked: false,
+};
+
+const disconnectedBySystemTarget = {
+  name: "iqn.2023-01.com.example:disconnected_by_system",
+  address: "192.18.10.108",
+  port: 3263,
+  interface: "default",
+  startup: "onboot",
+  connected: false,
+  locked: true,
+};
+
+const disconnectionFailedTarget = {
+  name: "iqn.2023-01.com.example:disconnection_failed",
+  address: "192.16.10.133",
+  port: 3363,
+  interface: "default",
+  startup: "onboot",
+  connected: true,
+  locked: false,
+};
+
+const failedToConnectTarget = {
+  name: "iqn.2023-01.com.example:connection_failed",
+  address: "192.168.100.106",
+  port: 3264,
+  interface: "default",
+  startup: "manual",
+  connected: false,
+  locked: false,
+};
+
+const lockedTarget = {
+  name: "iqn.2023-01.com.example:connected_by_system",
+  address: "192.168.100.108",
+  port: 3260,
+  interface: "default",
+  startup: "onboot",
+  connected: true,
+  locked: true,
+};
+
+const missingTarget = {
+  name: "iqn.2023-01.com.example:missing",
+  address: "192.168.100.118",
+  port: 3260,
+  interface: "default",
+  startup: "onboot",
+};
+
+const testingSystemTargets = [
+  connectedTarget,
+  disconnectedTarget,
+  disconnectionFailedTarget,
+  disconnectedBySystemTarget,
+  failedToConnectTarget,
+  lockedTarget,
+];
+const testingConfigTargets = [
+  omit(connectedTarget, ["connected", "locked"]),
+  omit(failedToConnectTarget, ["connected", "locked"]),
+  missingTarget,
+];
+
+jest.mock("~/hooks/model/system/iscsi", () => ({
+  ...jest.requireActual("~/hooks/model/system/iscsi"),
+  useSystem: () => mockUseSystemFn(),
+}));
+
+jest.mock("~/hooks/model/config/iscsi", () => ({
+  ...jest.requireActual("~/hooks/model/config/iscsi"),
+  useConfig: () => mockUseConfigFn(),
+  useRemoveTarget: () => mockRemoveTargetFn,
+}));
+
+// Needed by withL10n
+jest.mock("~/hooks/model/system", () => ({
+  useSystem: () => ({
+    l10n: {
+      keymap: "us",
+      timezone: "Europe/Berlin",
+      locale: "en_US",
+    },
+  }),
+}));
+
+describe("TargetsTable", () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  describe("when no targets are available", () => {
+    beforeEach(() => {
+      mockUseSystemFn.mockReturnValue({ targets: [] });
+      mockUseConfigFn.mockReturnValue({ targets: [] });
+    });
+
+    it("displays empty state with 'No targets available' message", () => {
+      installerRender(<TargetsTable />);
+
+      screen.getByText("No targets available");
+      screen.getByText("No targets have been discovered or configured.");
+      screen.getByText("Perform a discovery to find available iSCSI targets.");
+    });
+
+    it("does not display the clear filters button", () => {
+      installerRender(<TargetsTable />);
+
+      expect(screen.queryByRole("button", { name: "Clear all filters" })).toBeNull();
+    });
+  });
+
+  describe("when targets are available", () => {
+    beforeEach(() => {
+      mockUseSystemFn.mockReturnValue({
+        initiator: { ibft: false },
+        targets: testingSystemTargets,
+      });
+      mockUseConfigFn.mockReturnValue({ targets: testingConfigTargets });
+    });
+
+    it("renders the targets table with all targets", () => {
+      installerRender(<TargetsTable />);
+
+      screen.getByText("iqn.2023-01.com.example:connected");
+      screen.getByText("iqn.2023-01.com.example:connection_failed");
+      screen.getByText("iqn.2023-01.com.example:connected_by_system");
+      screen.getByText("iqn.2023-01.com.example:disconnected");
+      screen.getByText("iqn.2023-01.com.example:disconnected_by_system");
+      screen.getByText("iqn.2023-01.com.example:disconnection_failed");
+      screen.getByText("iqn.2023-01.com.example:missing");
+    });
+
+    it("displays all column headers", () => {
+      // Without iBFT
+      const { rerender } = installerRender(<TargetsTable />);
+
+      const table = screen.getByRole("grid");
+      const headerRow = within(table).getAllByRole("row")[0];
+      within(headerRow).getByRole("columnheader", { name: "Name" });
+      within(headerRow).getByRole("columnheader", { name: "Portal" });
+      within(headerRow).getByRole("columnheader", { name: "Interface" });
+      within(headerRow).getByRole("columnheader", { name: "Startup" });
+      within(headerRow).getByRole("columnheader", { name: "Status" });
+      expect(within(headerRow).queryByRole("columnheader", { name: "iBFT" })).toBeNull();
+
+      // With iBFT
+      mockUseSystemFn.mockReturnValue({ initiator: { ibft: true }, targets: testingSystemTargets });
+      rerender(<TargetsTable />);
+      within(headerRow).getByRole("columnheader", { name: "iBFT" });
+    });
+
+    it("displays correct status for connected target", () => {
+      installerRender(<TargetsTable />);
+
+      const rows = screen.getAllByRole("row");
+      const connectedRow = rows.find((row) =>
+        within(row).queryByText("iqn.2023-01.com.example:connected"),
+      );
+
+      within(connectedRow).getByText("Connected");
+    });
+
+    it("displays correct status for disconnected target", () => {
+      installerRender(<TargetsTable />);
+
+      const rows = screen.getAllByRole("row");
+      const disconnectedRow = rows.find((row) =>
+        within(row).queryByText("iqn.2023-01.com.example:disconnected"),
+      );
+
+      within(disconnectedRow).getByText("Disconnected");
+    });
+
+    it("displays correct status for target with connection failures", () => {
+      installerRender(<TargetsTable />);
+
+      const rows = screen.getAllByRole("row");
+      const disconnectedRow = rows.find((row) =>
+        within(row).queryByText("iqn.2023-01.com.example:connection_failed"),
+      );
+
+      within(disconnectedRow).getByText("Connection failed");
+    });
+
+    it("displays correct status for missing target", () => {
+      installerRender(<TargetsTable />);
+
+      const rows = screen.getAllByRole("row");
+      const missingRow = rows.find((row) =>
+        within(row).queryByText("iqn.2023-01.com.example:missing"),
+      );
+
+      expect(within(missingRow).getByText("Missing")).toBeInTheDocument();
+    });
+    it("displays correct status for locked target", () => {
+      installerRender(<TargetsTable />);
+
+      const rows = screen.getAllByRole("row");
+      const lockedRow = rows.find((row) =>
+        within(row).queryByText("iqn.2023-01.com.example:connected_by_system"),
+      );
+
+      within(lockedRow).getByText("Connected by the system");
+    });
+
+    it("displays helper text for locked targets", () => {
+      installerRender(<TargetsTable />);
+
+      screen.getByText("Locked targets cannot be managed from here and do not offer any actions.");
+    });
+  });
+
+  describe("filtering", () => {
+    beforeEach(() => {
+      mockUseSystemFn.mockReturnValue({ targets: testingSystemTargets });
+      mockUseConfigFn.mockReturnValue({ targets: testingConfigTargets });
+    });
+
+    it("filters targets by name", async () => {
+      const { user } = installerRender(<TargetsTable />);
+
+      const nameFilter = screen.getByLabelText("Name");
+      await user.type(nameFilter, "connected");
+
+      screen.getByText("iqn.2023-01.com.example:connected");
+      screen.getByText("iqn.2023-01.com.example:connected_by_system");
+      expect(screen.queryByText("iqn.2023-01.com.example:connection_failed")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:locked")).toBeNull();
+    });
+
+    it("filters targets by portal", async () => {
+      const { user } = installerRender(<TargetsTable />);
+
+      const portalFilter = screen.getByLabelText("Portal");
+      await user.type(portalFilter, "192.168.100.106");
+
+      screen.getByText("iqn.2023-01.com.example:connection_failed");
+      expect(screen.queryByText("iqn.2023-01.com.example:connected")).toBeNull();
+    });
+
+    it("displays empty state when filters match no results", async () => {
+      const { user } = installerRender(<TargetsTable />);
+
+      const nameFilter = screen.getByLabelText("Name");
+      await user.type(nameFilter, "nonexistent");
+
+      screen.getByText("No targets matches filters");
+      screen.getByText("Change filters and try again.");
+      screen.getByRole("button", { name: "Clear all filters" });
+    });
+
+    it("clears filters when 'Clear all filters' button is clicked", async () => {
+      const { user } = installerRender(<TargetsTable />);
+
+      const nameFilter = screen.getByLabelText("Name");
+      await user.type(nameFilter, "nonexistent");
+
+      screen.getByText("No targets matches filters");
+
+      const clearButton = screen.getByRole("button", { name: "Clear all filters" });
+      await user.click(clearButton);
+
+      screen.getByText("iqn.2023-01.com.example:connected");
+      screen.getByText("iqn.2023-01.com.example:connection_failed");
+      expect(screen.queryByText("No targets matches filters")).toBeNull();
+    });
+  });
+
+  describe("status filtering", () => {
+    beforeEach(() => {
+      mockUseSystemFn.mockReturnValue({ targets: testingSystemTargets });
+      mockUseConfigFn.mockReturnValue({ targets: testingConfigTargets });
+    });
+
+    it("filters connected targets", async () => {
+      const { user } = installerRender(<TargetsTable />);
+
+      const statusFilterToggle = screen.getByRole("button", { name: "Status filter toggle" });
+      await user.click(statusFilterToggle);
+      const statusOptions = screen.getByRole("listbox");
+      const connectedOption = within(statusOptions).getByRole("option", { name: "Connected" });
+      await user.click(connectedOption);
+
+      screen.getByText("iqn.2023-01.com.example:connected");
+      expect(screen.queryByText("iqn.2023-01.com.example:connection_failed")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:connected_by_system")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:disconnected")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:disconnected_by_system")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:disconnection_failed")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:missing")).toBeNull();
+    });
+
+    it("filters connection failed targets", async () => {
+      const { user } = installerRender(<TargetsTable />);
+
+      const statusFilterToggle = screen.getByRole("button", { name: "Status filter toggle" });
+      await user.click(statusFilterToggle);
+      const statusOptions = screen.getByRole("listbox");
+      const connectionFailedOption = within(statusOptions).getByRole("option", {
+        name: "Connection failed",
+      });
+      await user.click(connectionFailedOption);
+
+      screen.getByText("iqn.2023-01.com.example:connection_failed");
+      expect(screen.queryByText("iqn.2023-01.com.example:connected")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:connected_by_system")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:disconnected")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:disconnected_by_system")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:disconnection_failed")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:missing")).toBeNull();
+    });
+
+    it("filters disconnected targets", async () => {
+      const { user } = installerRender(<TargetsTable />);
+
+      const statusFilterToggle = screen.getByRole("button", { name: "Status filter toggle" });
+      await user.click(statusFilterToggle);
+      const statusOptions = screen.getByRole("listbox");
+      const discconectedOption = within(statusOptions).getByRole("option", {
+        name: "Disconnected",
+      });
+      await user.click(discconectedOption);
+
+      screen.getByText("iqn.2023-01.com.example:disconnected");
+      expect(screen.queryByText("iqn.2023-01.com.example:connected")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:connection_failed")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:connected_by_system")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:disconnected_by_system")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:disconnection_failed")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:missing")).toBeNull();
+    });
+
+    it("filters missing targets", async () => {
+      const { user } = installerRender(<TargetsTable />);
+
+      const statusFilterToggle = screen.getByRole("button", { name: "Status filter toggle" });
+      await user.click(statusFilterToggle);
+      const statusOptions = screen.getByRole("listbox");
+      const missingOption = within(statusOptions).getByRole("option", {
+        name: "Missing",
+      });
+      await user.click(missingOption);
+
+      screen.getByText("iqn.2023-01.com.example:missing");
+      expect(screen.queryByText("iqn.2023-01.com.example:connected")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:connection_failed")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:connected_by_system")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:disconnected_by_system")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:disconnection_failed")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:disconnected")).toBeNull();
+    });
+
+    it("filters targets connected by the system", async () => {
+      const { user } = installerRender(<TargetsTable />);
+
+      const statusFilterToggle = screen.getByRole("button", { name: "Status filter toggle" });
+      await user.click(statusFilterToggle);
+      const statusOptions = screen.getByRole("listbox");
+      const connectedAndLockedOption = within(statusOptions).getByRole("option", {
+        name: "Connected by the system",
+      });
+      await user.click(connectedAndLockedOption);
+
+      screen.getByText("iqn.2023-01.com.example:connected_by_system");
+      expect(screen.queryByText("iqn.2023-01.com.example:connected")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:connection_failed")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:disconnected_by_system")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:disconnection_failed")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:disconnected")).toBeNull();
+      expect(screen.queryByText("iqn.2023-01.com.example:missing")).toBeNull();
+    });
+  });
+
+  describe("sorting", () => {
+    beforeEach(() => {
+      mockUseSystemFn.mockReturnValue({ targets: testingSystemTargets });
+      mockUseConfigFn.mockReturnValue({ targets: testingConfigTargets });
+    });
+
+    it("sorts targets by name when clicking the Name column header", async () => {
+      const { user } = installerRender(<TargetsTable />);
+
+      const table = screen.getByRole("grid");
+      const headerRow = within(table).getAllByRole("row")[0];
+      const nameHeader = within(headerRow).getByText("Name");
+      await user.click(nameHeader);
+
+      const rows = screen.getAllByRole("row");
+      const targetNames = rows
+        .slice(1) // Skip header row
+        .map((row) => within(row).getAllByRole("cell")[0].textContent);
+
+      // Check if sorted (ascending or descending)
+      const sorted = [...targetNames].sort();
+      const reverseSorted = [...targetNames].sort().reverse();
+      const isSorted =
+        JSON.stringify(targetNames) === JSON.stringify(sorted) ||
+        JSON.stringify(targetNames) === JSON.stringify(reverseSorted);
+
+      expect(isSorted).toBe(true);
+    });
+  });
+
+  describe("target actions", () => {
+    describe("for disconnected targets", () => {
+      beforeEach(() => {
+        const disconnectedTarget = {
+          ...testingSystemTargets[1],
+          connected: false,
+        };
+        mockUseSystemFn.mockReturnValue({ targets: [disconnectedTarget] });
+        mockUseConfigFn.mockReturnValue({ targets: [disconnectedTarget] });
+      });
+
+      it("shows Connect action", async () => {
+        const { user } = installerRender(<TargetsTable />);
+
+        const actionsButton = screen.getByRole("button", { name: /Actions for/i });
+        await user.click(actionsButton);
+
+        screen.getByText("Connect");
+      });
+
+      it("navigates to login page when Connect is clicked", async () => {
+        const { user } = installerRender(<TargetsTable />);
+
+        const actionsButton = screen.getByRole("button", { name: /Actions for/i });
+        await user.click(actionsButton);
+
+        const connectAction = screen.getByText("Connect");
+        await user.click(connectAction);
+
+        expect(mockNavigateFn).toHaveBeenCalled();
+      });
+    });
+
+    describe("for connected targets in config", () => {
+      beforeEach(() => {
+        const connectedTarget = {
+          ...testingSystemTargets[0],
+          connected: true,
+          sources: ["system", "config"],
+        };
+        mockUseSystemFn.mockReturnValue({ targets: [connectedTarget] });
+        mockUseConfigFn.mockReturnValue({ targets: [connectedTarget] });
+      });
+
+      it("shows Disconnect action", async () => {
+        const { user } = installerRender(<TargetsTable />);
+
+        const actionsButton = screen.getByRole("button", { name: /Actions for/i });
+        await user.click(actionsButton);
+
+        screen.getByText("Disconnect");
+      });
+    });
+
+    describe("for targets that failed to connect", () => {
+      beforeEach(() => {
+        mockUseSystemFn.mockReturnValue({ targets: [failedToConnectTarget] });
+        mockUseConfigFn.mockReturnValue({ targets: [failedToConnectTarget] });
+      });
+
+      it("shows Cancel connection action that calls removeTarget when clicked", async () => {
+        const { user } = installerRender(<TargetsTable />);
+
+        const actionsButton = screen.getByRole("button", { name: /Actions for/i });
+        await user.click(actionsButton);
+
+        const cancelConnectionAction = screen.getByText("Cancel connection");
+        await user.click(cancelConnectionAction);
+
+        expect(mockRemoveTargetFn).toHaveBeenCalledWith(
+          "iqn.2023-01.com.example:connection_failed",
+          "192.168.100.106",
+          3264,
+        );
+      });
+    });
+
+    describe("for locked targets", () => {
+      beforeEach(() => {
+        const lockedTarget = {
+          ...testingSystemTargets[2],
+          locked: true,
+        };
+        mockUseSystemFn.mockReturnValue({ targets: [lockedTarget] });
+        mockUseConfigFn.mockReturnValue({ targets: [lockedTarget] });
+      });
+
+      it("does not show any actions", () => {
+        installerRender(<TargetsTable />);
+
+        expect(screen.queryByRole("button", { name: /Actions for/i })).toBeNull();
+      });
+    });
+  });
+
+  describe("for missing targets", () => {
+    beforeEach(() => {
+      mockUseSystemFn.mockReturnValue({ targets: [] });
+      mockUseConfigFn.mockReturnValue({ targets: [missingTarget] });
+    });
+
+    it("does not show Connect action", async () => {
+      const { user } = installerRender(<TargetsTable />);
+      const actionsButton = screen.getByRole("button", { name: /Actions for/i });
+      await user.click(actionsButton);
+
+      expect(screen.queryByText("Connect")).toBeNull();
+    });
+
+    it("shows Delete action", async () => {
+      const { user } = installerRender(<TargetsTable />);
+      const actionsButton = screen.getByRole("button", { name: /Actions for/i });
+      await user.click(actionsButton);
+
+      screen.getByText("Delete");
+    });
+  });
+
+  describe("action label", () => {
+    beforeEach(() => {
+      mockUseSystemFn.mockReturnValue({ targets: testingSystemTargets });
+      mockUseConfigFn.mockReturnValue({ targets: testingConfigTargets });
+    });
+
+    it("displays target name and portal in action label", () => {
+      installerRender(<TargetsTable />);
+
+      screen.getByRole("button", {
+        name: "Actions for iqn.2023-01.com.example:connection_failed at portal 192.168.100.106:3264",
+      });
+    });
+  });
+});
diff --git a/web/src/components/storage/iscsi/TargetsTable.tsx b/web/src/components/storage/iscsi/TargetsTable.tsx
new file mode 100644
index 0000000000..dcdf31dd23
--- /dev/null
+++ b/web/src/components/storage/iscsi/TargetsTable.tsx
@@ -0,0 +1,610 @@
+/*
+ * Copyright (c) [2026] SUSE LLC
+ *
+ * All Rights Reserved.
+ *
+ * This program is free software; you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the Free
+ * Software Foundation; either version 2 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 General Public License for
+ * more details.
+ *
+ * You should have received a copy of the GNU General Public License along
+ * with this program; if not, contact SUSE LLC.
+ *
+ * To contact SUSE LLC about this file by physical or electronic mail, you may
+ * find current contact information at www.suse.com.
+ */
+
+import React, { useReducer } from "react";
+import { generatePath, useNavigate } from "react-router";
+import { isEmpty, pick } from "radashi";
+import { sprintf } from "sprintf-js";
+import {
+  Button,
+  Content,
+  Divider,
+  EmptyState,
+  EmptyStateActions,
+  EmptyStateBody,
+  EmptyStateFooter,
+  HelperText,
+  HelperTextItem,
+  Toolbar,
+  ToolbarContent,
+  ToolbarGroup,
+  ToolbarItem,
+} from "@patternfly/react-core";
+import Icon from "~/components/layout/Icon";
+import SelectableDataTable, { SortedBy } from "~/components/core/SelectableDataTable";
+import StatusFilter from "~/components/storage/iscsi/StatusFilter";
+import Text from "~/components/core/Text";
+import TextinputFilter from "~/components/storage/dasd/TextinputFilter";
+import { sortCollection, mergeSources } from "~/utils";
+import { STORAGE } from "~/routes/paths";
+import { useSystem } from "~/hooks/model/system/iscsi";
+import { useConfig, useRemoveTarget } from "~/hooks/model/config/iscsi";
+import { _, N_ } from "~/i18n";
+
+import type { Target as ConfigTarget } from "~/openapi/config/iscsi";
+import type { Target as SystemTarget } from "~/openapi/system/iscsi";
+
+type MergedTarget = Partial<SystemTarget> & Partial<ConfigTarget> & { sources: string[] };
+type TargetToMerge = SystemTarget | ConfigTarget;
+
+/**
+ * Filter options for narrowing down iSCSI targets shown in the table.
+ *
+ * All filters are optional and may be combined.
+ */
+type ISCSITargetsFilters = {
+  name?: string;
+  portal?: string;
+  status?: string;
+};
+
+/**
+ * Predicate function for evaluating whether a iSCSI target meets a given
+ * condition.
+ *
+ * Created for reusing the filtering logic where needed, like in filteres for
+ * narrowing down the list of targets, at the time of building targets actions
+ * and so on.
+ *
+ * TODO: Move to a more appropiated place
+ */
+type ISCSITargetCondition = (target) => boolean;
+
+/**
+ * Predicate functions for determining iSCSI target status.
+ *
+ * Each predicate checks the combination of target sources (config/system),
+ * connection state, and lock status to determine the target's current status.
+ *
+ * TODO: Move to a more appropiated place
+ */
+export const statusMatches = {
+  // In both,  config and System
+  connected: (t: MergedTarget) =>
+    t.sources.includes("config") && t.sources.includes("system") && t.connected,
+
+  connection_failed: (t: MergedTarget) =>
+    t.sources.includes("config") && t.sources.includes("system") && !t.connected,
+
+  // Only in system
+  connected_by_system: (t: MergedTarget) =>
+    t.sources.includes("system") && !t.sources.includes("config") && t.connected && t.locked,
+
+  disconnected_by_system: (t: MergedTarget) =>
+    t.sources.includes("system") && !t.sources.includes("config") && !t.connected && t.locked,
+
+  disconnection_failed: (t: MergedTarget) =>
+    t.sources.includes("system") && !t.sources.includes("config") && t.connected && !t.locked,
+
+  disconnected: (t: MergedTarget) =>
+    t.sources.includes("system") && !t.sources.includes("config") && !t.connected && !t.locked,
+
+  // Only in config
+  missing: (t: MergedTarget) =>
+    t.sources.includes("config") && !t.sources.includes("system") && !t.connected,
+} as const;
+
+/**
+ * Valid status values for iSCSI targets.
+ *
+ * @see statusMatches for the logic determining each status
+ */
+export type TargetStatus = keyof typeof statusMatches;
+
+/**
+ * Returns status for given target
+ *
+ * TODO: Move to a more appropiated place
+ */
+
+/**
+ * Determines the status of an iSCSI target.
+ *
+ * @note
+ * Returns "unknown" if target doesn't match any status predicate.
+ * This should not happen in practice if STATUS_PREDICATES is complete.
+ *
+ * TODO: Move to a more appropiated place
+ */
+export const statusOf = (target: MergedTarget): TargetStatus | "unknown" => {
+  const keys = Object.keys(statusMatches) as TargetStatus[];
+
+  // Returns the first key where the predicate returns true
+  return keys.find((key) => statusMatches[key](target)) ?? "unknown";
+};
+
+/**
+ * Human-readable labels for iSCSI target statuses.
+ *
+ * Values use `N_()` for translation extraction. Translate with `_()` at render time.
+ *
+ * @example
+ * ```ts
+ * const status = getStatus(target);
+ * const label = _(STATUS_LABELS[status]);
+ * ```
+ * TODO: Move to a more appropiated place
+ */
+export const STATUS_LABELS: Record<TargetStatus, string> = {
+  connected: N_("Connected"),
+  connection_failed: N_("Connection failed"),
+  connected_by_system: N_("Connected by the system"),
+  disconnected_by_system: N_("Disconnected by the system"),
+  disconnection_failed: N_("Disconnection failed"),
+  disconnected: N_("Disconnected"),
+  missing: N_("Missing"),
+};
+
+/**
+ * A map of statuses human-readable status labels.
+ * TODO: Move to a more appropiated place
+ */
+type StatusKey = keyof typeof STATUS_LABELS;
+
+/**
+ * Filters an array of targets based on given filters.
+ */
+const filterTargets = (targets: MergedTarget[], filters: ISCSITargetsFilters): MergedTarget[] => {
+  const { name, portal, status } = filters;
+
+  const conditions: ISCSITargetCondition[] = [];
+
+  if (!isEmpty(name)) {
+    conditions.push((t) => t.name.toLowerCase().includes(name.toLowerCase()));
+  }
+
+  if (!isEmpty(portal)) {
+    conditions.push((t) => `${t.address}:${t.port}`.includes(portal));
+  }
+
+  if (status && status !== "all") {
+    const statusFilterFn = statusMatches[status as TargetStatus];
+    if (statusFilterFn) conditions.push(statusFilterFn);
+  }
+
+  return targets.filter((t) => conditions.every((conditionFn) => conditionFn(t)));
+};
+
+/**
+ * Action handlers for target operations.
+ */
+type TargetActionHandlers = {
+  /** Handler to execute when the user clicks the Connect action */
+  onConnect: () => void;
+  /** Handler to execute when the user clicks the Disconnect action */
+  onDisconnect: () => void;
+  /** Handler to execute when the user clicks the Delete action */
+  onDelete: () => void;
+};
+
+/**
+ * Builds the list of available actions for a given target.
+ *
+ * @returns Array of available actions for the target, each with a label and an
+ * `onClick` handler
+ */
+const buildActions = (
+  target: MergedTarget,
+  { onConnect, onDisconnect, onDelete }: TargetActionHandlers,
+) => {
+  if (target.locked) return [];
+
+  return [
+    statusMatches.connected(target) && [
+      {
+        title: _("Edit connection"),
+        onClick: onConnect,
+      },
+      {
+        title: _("Disconnect"),
+        onClick: onDisconnect,
+        isDanger: true,
+      },
+    ],
+
+    statusMatches.connection_failed(target) && [
+      {
+        title: _("Connect"),
+        onClick: onConnect,
+      },
+      {
+        title: _("Cancel connection"),
+        onClick: onDelete,
+        isDanger: true,
+      },
+    ],
+
+    statusMatches.disconnected(target) && {
+      title: _("Connect"),
+      onClick: onConnect,
+    },
+
+    statusMatches.missing(target) && {
+      title: _("Delete"),
+      onClick: onDelete,
+    },
+  ]
+    .flatMap((i) => i)
+    .filter(Boolean);
+};
+
+/**
+ * Props for the FiltersToolbar component rendered along with the table.
+ */
+type FiltersToolbarProps = {
+  /** Current filter state */
+  filters: ISCSITargetsFilters;
+  /** Avaialble status options to build the status filter */
+  statusOptions: Record<StatusKey, string>;
+  /** Callback invoked when a filter value changes. */
+  onFilterChange: (filter: keyof ISCSITargetsFilters, value: string) => void;
+};
+
+/**
+ * Renders the toolbar used to filter targets.
+ */
+const FiltersToolbar = ({ filters, statusOptions, onFilterChange }: FiltersToolbarProps) => (
+  <Toolbar>
+    <ToolbarContent>
+      <ToolbarGroup>
+        <ToolbarItem>
+          <TextinputFilter
+            id="iscsi-target-name"
+            label={_("Name")}
+            value={filters.name}
+            onChange={(_, v) => onFilterChange("name", v)}
+          />
+        </ToolbarItem>
+        <ToolbarItem>
+          <TextinputFilter
+            id="iscsi-target-portal"
+            label={_("Portal")}
+            value={filters.portal}
+            onChange={(_, v) => onFilterChange("portal", v)}
+          />
+        </ToolbarItem>
+        {!isEmpty(statusOptions) && (
+          <ToolbarItem>
+            <StatusFilter
+              value={filters.status}
+              options={statusOptions}
+              onChange={(_, v) => onFilterChange("status", v)}
+            />
+          </ToolbarItem>
+        )}
+      </ToolbarGroup>
+    </ToolbarContent>
+  </Toolbar>
+);
+
+/**
+ * Represents the mode of the empty state shown in the table.
+ *
+ * - "noDevices": No iSCSI targets are present on the system.
+ * - "noFilterResults": No matching results after applying filters.
+ */
+type TargetsEmptyStateMode = "noDevices" | "noFilterResults";
+
+/**
+ * Props for the ISCSITableEmptyState component.
+ */
+type TargetsEmptyStateProps = {
+  /**
+   * Determines the type of empty state to display.
+   */
+  mode: TargetsEmptyStateMode;
+  /**
+   * Callback to reset filters when in "noFilterResults" mode.
+   */
+  resetFilters: () => void;
+};
+
+/**
+ * Displays an appropriate empty state interface for the table.
+ */
+const TargetsEmptyState = ({ mode, resetFilters }: TargetsEmptyStateProps) => {
+  switch (mode) {
+    case "noDevices": {
+      return (
+        <EmptyState
+          headingLevel="h2"
+          titleText={_("No targets available")}
+          icon={() => <Icon name="search_off" />}
+          variant="sm"
+        >
+          <EmptyStateBody>
+            <Content isEditorial>{_("No targets have been discovered or configured.")}</Content>
+            {_("Perform a discovery to find available iSCSI targets.")}
+          </EmptyStateBody>
+        </EmptyState>
+      );
+    }
+    case "noFilterResults": {
+      return (
+        <EmptyState
+          headingLevel="h2"
+          titleText={_("No targets matches filters")}
+          icon={() => <Icon name="search_off" />}
+          variant="sm"
+        >
+          <EmptyStateBody>{_("Change filters and try again.")}</EmptyStateBody>
+          <EmptyStateFooter>
+            <EmptyStateActions>
+              <Button variant="secondary" onClick={resetFilters}>
+                {_("Clear all filters")}
+              </Button>
+            </EmptyStateActions>
+          </EmptyStateFooter>
+        </EmptyState>
+      );
+    }
+  }
+};
+
+/**
+ * Encapsulates all state used by the iSCSI targets table component, including
+ * filters, sorting configuration, and current selection.
+ */
+type TargetsTableState = {
+  /** Current sorting state */
+  sortedBy: SortedBy;
+  /** Current active filters applied to the target list */
+  filters: ISCSITargetsFilters;
+  /** Currently selected targets in the UI */
+  selectedTargets: MergedTarget[];
+};
+
+/**
+ * Defines the initial state used by table reducer.
+ */
+const initialState: TargetsTableState = {
+  sortedBy: { index: 0, direction: "asc" },
+  filters: {
+    name: "",
+    portal: "",
+    status: "all",
+  },
+  selectedTargets: [],
+};
+
+/**
+ * Action types for updating the iSCSI targets table state via the reducer.
+ */
+type TargetsTableAction =
+  | { type: "UPDATE_SORTING"; payload: TargetsTableState["sortedBy"] }
+  | { type: "UPDATE_FILTERS"; payload: TargetsTableState["filters"] }
+  | { type: "RESET_FILTERS" }
+  | { type: "UPDATE_SELECTION"; payload: TargetsTableState["selectedTargets"] }
+  | { type: "RESET_SELECTION" }
+  | { type: "CANCEL_FORMAT_REQUEST" };
+
+/**
+ * Reducer function that handles all iSCSI targets table state transitions.
+ */
+const reducer = (state: TargetsTableState, action: TargetsTableAction): TargetsTableState => {
+  switch (action.type) {
+    case "UPDATE_SORTING": {
+      return { ...state, sortedBy: action.payload };
+    }
+
+    case "UPDATE_FILTERS": {
+      return { ...state, filters: { ...state.filters, ...action.payload } };
+    }
+
+    case "RESET_FILTERS": {
+      return { ...state, filters: initialState.filters };
+    }
+
+    case "UPDATE_SELECTION": {
+      return { ...state, selectedTargets: action.payload };
+    }
+
+    case "RESET_SELECTION": {
+      return { ...state, selectedTargets: initialState.selectedTargets };
+    }
+  }
+};
+/**
+ * Parameters for creating column definitions.
+ */
+type CreateColumnsParams = {
+  /** Whether to show the iBFT (iSCSI Boot Firmware Table) column */
+  showIbft?: boolean;
+};
+
+/**
+ * Column definitions for the iSCSI targets table.
+ *
+ * Each entry defines how a column is labeled, how its value is derived from a
+ * target object, and which field is used for sorting.
+ *
+ * These columns are consumed by the core <SelectableDataTable> component.
+ */
+const createColumns = ({ showIbft = false }: CreateColumnsParams) =>
+  [
+    {
+      // TRANSLATORS: table header for an iSCSI targets table
+      name: _("Name"),
+      value: (t: MergedTarget) => t.name,
+      sortingKey: "name",
+    },
+
+    {
+      // TRANSLATORS: table header for an iSCSI targets table
+      name: _("Portal"),
+      value: (t: MergedTarget) => (
+        <Text>
+          {t.address}:
+          <Text component="small" style={{ display: "inline" }}>
+            {t.port}
+          </Text>
+        </Text>
+      ),
+      sortingKey: "address",
+    },
+    {
+      // TRANSLATORS: table header for an iSCSI targets table
+      name: _("Interface"),
+      value: (t: MergedTarget) => t.interface,
+      sortingKey: "interface",
+    },
+    {
+      // TRANSLATORS: table header for an iSCSI targets table
+      name: _("Startup"),
+      value: (t: MergedTarget) => {
+        return t.startup;
+      },
+      sortingKey: "startup",
+    },
+    showIbft && {
+      name: _("iBFT"),
+      value: (t: MergedTarget) => (t.ibft ? _("Yes") : _("No")),
+      sortingKey: "ibft",
+    },
+    {
+      // TRANSLATORS: table header for an iSCSI targets table
+      name: _("Status"),
+      // eslint-disable-next-line agama-i18n/string-literals
+      value: (t: MergedTarget) => _(STATUS_LABELS[statusOf(t)]),
+    },
+  ].filter(Boolean);
+
+/**
+ * Main component for displaying and managing iSCSI targets.
+ *
+ * Provides a filterable, sortable table of iSCSI targets with actions
+ * to perform over them.
+ */
+export default function TargetsTable() {
+  const [state, dispatch] = useReducer(reducer, initialState);
+  const navigate = useNavigate();
+  const configTargets = useConfig()?.targets || [];
+  // FIXME: stop returning undefined or null from hooks
+  const { initiator, targets: systemTargets = [] } = useSystem() || {};
+  const removeTarget = useRemoveTarget();
+
+  const targets: MergedTarget[] = mergeSources<TargetToMerge, keyof TargetToMerge>({
+    collections: {
+      config: configTargets,
+      system: systemTargets,
+    },
+    precedence: ["system", "config"],
+    primaryKey: ["name", "address", "port"],
+  });
+
+  const hasLockedTargets = targets.find((t: MergedTarget) => "locked" in t && t.locked);
+
+  const columns = createColumns({ showIbft: initiator?.ibft });
+
+  const onSortingChange = (sortedBy: SortedBy) => {
+    dispatch({ type: "UPDATE_SORTING", payload: sortedBy });
+  };
+
+  const onFilterChange = (filter: keyof ISCSITargetsFilters, value: string) => {
+    dispatch({ type: "UPDATE_FILTERS", payload: { [filter]: value } });
+    dispatch({ type: "RESET_SELECTION" });
+  };
+
+  const onSelectionChange = (targets: MergedTarget[]) => {
+    dispatch({ type: "UPDATE_SELECTION", payload: targets });
+  };
+
+  // Filtering
+  const resetFilters = () => dispatch({ type: "RESET_FILTERS" });
+  const filteredTargets = filterTargets(targets, state.filters);
+
+  // Sorting
+  const sortingKey = columns[state.sortedBy.index].sortingKey;
+  const sortedTargets = sortCollection(filteredTargets, state.sortedBy.direction, sortingKey);
+
+  // Determine the appropriate empty state mode, if needed
+  let emptyStateMode: TargetsEmptyStateMode | undefined;
+  if (isEmpty(filteredTargets)) {
+    // Check if filters are at their initial values
+    const filtersAreInitial =
+      state.filters.name === initialState.filters.name &&
+      state.filters.portal === initialState.filters.portal &&
+      state.filters.status === initialState.filters.status;
+
+    emptyStateMode = filtersAreInitial ? "noDevices" : "noFilterResults";
+  }
+
+  return (
+    <Content>
+      {!isEmpty(targets) && (
+        <FiltersToolbar
+          filters={state.filters}
+          statusOptions={pick(STATUS_LABELS, targets.map(statusOf) as TargetStatus[])}
+          onFilterChange={onFilterChange}
+        />
+      )}
+      <Divider />
+      <SelectableDataTable
+        columns={columns}
+        items={sortedTargets}
+        selectionMode="none"
+        itemsSelected={state.selectedTargets}
+        variant="compact"
+        onSelectionChange={onSelectionChange}
+        sortedBy={state.sortedBy}
+        updateSorting={onSortingChange}
+        itemActions={(target: MergedTarget) =>
+          buildActions(target, {
+            onConnect: () =>
+              navigate(
+                generatePath(STORAGE.iscsi.login, {
+                  name: target.name,
+                  address: target.address,
+                  port: target.port,
+                }),
+              ),
+            onDisconnect: () => removeTarget(target.name, target.address, target.port),
+            onDelete: () => removeTarget(target.name, target.address, target.port),
+          })
+        }
+        itemActionsLabel={(t) =>
+          sprintf(_("Actions for %s at portal %s"), t.name, `${t.address}:${t.port}`)
+        }
+        emptyState={
+          emptyStateMode && <TargetsEmptyState mode={emptyStateMode} resetFilters={resetFilters} />
+        }
+      />
+      {hasLockedTargets && (
+        <HelperText>
+          <HelperTextItem variant="indeterminate">
+            {_("Locked targets cannot be managed from here and do not offer any actions.")}
+          </HelperTextItem>
+        </HelperText>
+      )}
+    </Content>
+  );
+}
diff --git a/web/src/hooks/model/config.ts b/web/src/hooks/model/config.ts
index 9197c7a004..5d1fa538f9 100644
--- a/web/src/hooks/model/config.ts
+++ b/web/src/hooks/model/config.ts
@@ -56,3 +56,4 @@ export {
 export * as network from "~/hooks/model/config/network";
 export * as product from "~/hooks/model/config/product";
 export * as storage from "~/hooks/model/config/storage";
+export * as iscsi from "~/hooks/model/config/iscsi";
diff --git a/web/src/hooks/model/config/iscsi.ts b/web/src/hooks/model/config/iscsi.ts
new file mode 100644
index 0000000000..300b3f1ee6
--- /dev/null
+++ b/web/src/hooks/model/config/iscsi.ts
@@ -0,0 +1,91 @@
+/*
+ * Copyright (c) [2026] SUSE LLC
+ *
+ * All Rights Reserved.
+ *
+ * This program is free software; you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the Free
+ * Software Foundation; either version 2 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 General Public License for
+ * more details.
+ *
+ * You should have received a copy of the GNU General Public License along
+ * with this program; if not, contact SUSE LLC.
+ *
+ * To contact SUSE LLC about this file by physical or electronic mail, you may
+ * find current contact information at www.suse.com.
+ */
+
+import { useSuspenseQuery } from "@tanstack/react-query";
+import { configQuery } from "~/hooks/model/config";
+import { patchConfig, Response } from "~/api";
+import iscsi from "~/model/config/iscsi";
+import type { Config, ISCSI } from "~/model/config";
+
+const selectConfig = (data: Config | null): ISCSI.Config => data?.iscsi;
+
+function useConfig(): ISCSI.Config | null {
+  const { data } = useSuspenseQuery({
+    ...configQuery,
+    select: selectConfig,
+  });
+  return data;
+}
+
+const setInitiator = (config: ISCSI.Config | null, name: string): ISCSI.Config =>
+  config ? iscsi.setInitiator(config, name) : { initiator: name };
+
+type setInitiatorFn = (name: string) => Response;
+
+function useSetInitiator(): setInitiatorFn {
+  const config = useConfig();
+  return (name: string) => patchConfig({ iscsi: setInitiator(config, name) });
+}
+
+const addTarget = (config: ISCSI.Config | null, target: ISCSI.Target): ISCSI.Config =>
+  config ? iscsi.addTarget(config, target) : { targets: [target] };
+
+type addTargetFn = (target: ISCSI.Target) => Response;
+
+function useAddTarget(): addTargetFn {
+  const config = useConfig();
+  return (target: ISCSI.Target) => patchConfig({ iscsi: addTarget(config, target) });
+}
+
+const removeTarget = (
+  config: ISCSI.Config | null,
+  name: string,
+  addr: string,
+  port: number,
+): ISCSI.Config => (config ? iscsi.removeTarget(config, name, addr, port) : {});
+
+type removeTargetFn = (name: string, addr: string, port: number) => Response;
+
+function useRemoveTarget(): removeTargetFn {
+  const config = useConfig();
+  return (name: string, addr: string, port: number) =>
+    patchConfig({ iscsi: removeTarget(config, name, addr, port) });
+}
+
+const addOrEditTarget = (config: ISCSI.Config | null, target: ISCSI.Target): ISCSI.Config => {
+  if (config) {
+    const clean = iscsi.removeTarget(config, target.name, target.address, target.port);
+    return iscsi.addTarget(clean, target);
+  } else {
+    return { targets: [target] };
+  }
+};
+
+type addOrEditTargetFn = (target: ISCSI.Target) => Response;
+
+function useAddOrEditTarget(): addOrEditTargetFn {
+  const config = useConfig();
+  return (target: ISCSI.Target) => patchConfig({ iscsi: addOrEditTarget(config, target) });
+}
+
+export { useConfig, useSetInitiator, useAddTarget, useAddOrEditTarget, useRemoveTarget };
+export type { setInitiatorFn as changeInitiatorFn };
diff --git a/web/src/hooks/model/system.ts b/web/src/hooks/model/system.ts
index 4fe6ab2dd2..f086c5252c 100644
--- a/web/src/hooks/model/system.ts
+++ b/web/src/hooks/model/system.ts
@@ -57,3 +57,4 @@ export { systemQuery, useSystem, useSystemChanges };
 export * as l10n from "~/hooks/model/system/l10n";
 export * as storage from "~/hooks/model/system/storage";
 export * as software from "~/hooks/model/system/software";
+export * as iscsi from "~/hooks/model/system/iscsi";
diff --git a/web/src/components/storage/iscsi/index.ts b/web/src/hooks/model/system/iscsi.ts
similarity index 58%
rename from web/src/components/storage/iscsi/index.ts
rename to web/src/hooks/model/system/iscsi.ts
index d815a253b4..85b23f4256 100644
--- a/web/src/components/storage/iscsi/index.ts
+++ b/web/src/hooks/model/system/iscsi.ts
@@ -1,5 +1,5 @@
 /*
- * Copyright (c) [2023] SUSE LLC
+ * Copyright (c) [2026] SUSE LLC
  *
  * All Rights Reserved.
  *
@@ -20,12 +20,18 @@
  * find current contact information at www.suse.com.
  */
 
-export { default as InitiatorSection } from "./InitiatorSection";
-export { default as InitiatorForm } from "./InitiatorForm";
-export { default as TargetsSection } from "./TargetsSection";
-export { default as NodesPresenter } from "./NodesPresenter";
-export { default as DiscoverForm } from "./DiscoverForm";
-export { default as EditNodeForm } from "./EditNodeForm";
-export { default as LoginForm } from "./LoginForm";
-export { default as AuthFields } from "./AuthFields";
-export { default as NodeStartupOptions } from "./NodeStartupOptions";
+import { useSuspenseQuery } from "@tanstack/react-query";
+import { systemQuery } from "~/hooks/model/system";
+import type { System, ISCSI } from "~/model/system";
+
+const selectSystem = (data: System | null): ISCSI.System => data?.iscsi;
+
+function useSystem(): ISCSI.System | null {
+  const { data } = useSuspenseQuery({
+    ...systemQuery,
+    select: selectSystem,
+  });
+  return data;
+}
+
+export { useSystem };
diff --git a/web/src/model/action.ts b/web/src/model/action.ts
index 2aa59effb7..a2bbc0704b 100644
--- a/web/src/model/action.ts
+++ b/web/src/model/action.ts
@@ -20,7 +20,7 @@
  * find current contact information at www.suse.com.
  */
 
-type Action = ConfigureL10n | ActivateStorage | ProbeStorage | Finish;
+type Action = ConfigureL10n | ActivateStorage | ProbeStorage | DiscoverISCSI | Finish;
 
 type ConfigureL10n = {
   configureL10n: L10nSystemConfig;
@@ -39,8 +39,21 @@ type ProbeStorage = {
   probeStorage: null;
 };
 
+type DiscoverISCSI = {
+  discoverISCSI: DiscoverISCSIConfig;
+};
+
+type DiscoverISCSIConfig = {
+  address: string;
+  port: number;
+  username?: string;
+  password?: string;
+  initiatorUsername?: string;
+  initiatorPassword?: string;
+};
+
 type Finish = {
   finish: "halt" | "reboot" | "stop" | "poweroff";
 };
 
-export type { Action, L10nSystemConfig };
+export type { Action, L10nSystemConfig, DiscoverISCSIConfig };
diff --git a/web/src/model/config.ts b/web/src/model/config.ts
index bfbd86aac6..7f1a525f42 100644
--- a/web/src/model/config.ts
+++ b/web/src/model/config.ts
@@ -24,10 +24,11 @@ import type * as Hostname from "~/model/config/hostname";
 import type * as L10n from "~/model/config/l10n";
 import type * as Network from "~/model/config/network";
 import type * as Product from "~/model/config/product";
-import type * as Software from "~/model/config/software";
+import type * as Software from "~/openapi/config/software";
 import type * as User from "~/model/config/user";
 import type * as Root from "~/model/config/root";
 import type * as Storage from "~/openapi/config/storage";
+import type * as ISCSI from "~/model/config/iscsi";
 
 type Config = {
   hostname?: Hostname.Config;
@@ -35,9 +36,10 @@ type Config = {
   network?: Network.Config;
   product?: Product.Config;
   storage?: Storage.Config;
+  iscsi?: ISCSI.Config;
   software?: Software.Config;
   user?: User.Config;
   root?: Root.Config;
 };
 
-export type { Config, Hostname, Product, L10n, Network, Storage, User, Root };
+export type { Config, Hostname, Product, L10n, Network, Storage, User, Root, ISCSI };
diff --git a/web/src/model/config/iscsi.ts b/web/src/model/config/iscsi.ts
new file mode 100644
index 0000000000..efb28eb965
--- /dev/null
+++ b/web/src/model/config/iscsi.ts
@@ -0,0 +1,45 @@
+/*
+ * Copyright (c) [2026] SUSE LLC
+ *
+ * All Rights Reserved.
+ *
+ * This program is free software; you can redistribute it and/or modify it
+ * under the terms of the GNU General Public License as published by the Free
+ * Software Foundation; either version 2 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 General Public License for
+ * more details.
+ *
+ * You should have received a copy of the GNU General Public License along
+ * with this program; if not, contact SUSE LLC.
+ *
+ * To contact SUSE LLC about this file by physical or electronic mail, you may
+ * find current contact information at www.suse.com.
+ */
+
+import { Config, Target } from "~/openapi/config/iscsi";
+import { remove } from "radashi";
+
+function setInitiator(config: Config, name: string): Config {
+  return { ...config, initiator: name };
+}
+
+function addTarget(config: Config, target: Target): Config {
+  return { ...config, targets: [...config.targets, target] };
+}
+
+function removeTarget(config: Config, name: string, addr: string, port: number): Config {
+  return {
+    ...config,
+    targets: remove(
+      config.targets,
+      (t) => t.name === name && t.address === addr && t.port === port,
+    ),
+  };
+}
+
+export default { setInitiator, addTarget, removeTarget };
+export type * from "~/openapi/config/iscsi";
diff --git a/web/src/model/status.ts b/web/src/model/status.ts
index 26e0baa432..e40acddda7 100644
--- a/web/src/model/status.ts
+++ b/web/src/model/status.ts
@@ -44,7 +44,7 @@ type Scope =
   | "software"
   | "storage"
   | "network"
-  | "iscsci"
+  | "iscsi"
   | "users";
 type Progress = {
   index: number;
diff --git a/web/src/model/storage/iscsi.ts b/web/src/model/storage/iscsi.ts
deleted file mode 100644
index 58fb6b4dcf..0000000000
--- a/web/src/model/storage/iscsi.ts
+++ /dev/null
@@ -1,201 +0,0 @@
-/*
- * Copyright (c) [2024] SUSE LLC
- *
- * All Rights Reserved.
- *
- * This program is free software; you can redistribute it and/or modify it
- * under the terms of the GNU General Public License as published by the Free
- * Software Foundation; either version 2 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 General Public License for
- * more details.
- *
- * You should have received a copy of the GNU General Public License along
- * with this program; if not, contact SUSE LLC.
- *
- * To contact SUSE LLC about this file by physical or electronic mail, you may
- * find current contact information at www.suse.com.
- */
-
-// @todo Move to the new API.
-
-import { del, get, patch, post } from "~/http";
-
-export type ISCSIAuth = {
-  /**
-   * Password for authentication by target.
-   */
-  password?: string | null;
-  /**
-   * Password for authentication by initiator.
-   */
-  reverse_password?: string | null;
-  /**
-   * Username for authentication by initiator.
-   */
-  reverse_username?: string | null;
-  /**
-   * Username for authentication by target.
-   */
-  username?: string | null;
-};
-
-export type ISCSIInitiator = {
-  ibft: boolean;
-  name: string;
-};
-
-/**
- * ISCSI node
- */
-export type ISCSINode = {
-  /**
-   * Target IP address (in string-like form).
-   */
-  address: string;
-  /**
-   * Whether the node is connected (there is a session).
-   */
-  connected: boolean;
-  /**
-   * Whether the node was initiated by iBFT
-   */
-  ibft: boolean;
-  /**
-   * Artificial ID to match it against the D-Bus backend.
-   */
-  id: number;
-  /**
-   * Interface name.
-   */
-  interface: string;
-  /**
-   * Target port.
-   */
-  port: number;
-  /**
-   * Startup status (TODO: document better)
-   */
-  startup: string;
-  /**
-   * Target name.
-   */
-  target: string;
-};
-
-export type InitiatorParams = {
-  /**
-   * iSCSI initiator name.
-   */
-  name: string;
-};
-
-export type LoginParams = ISCSIAuth & {
-  /**
-   * Startup value.
-   */
-  startup: string;
-};
-
-export type LoginResult = "Success" | "InvalidStartup" | "Failed";
-
-const ISCSI_NODES_NAMESPACE = "/api/storage/iscsi/nodes";
-
-const nodePath = (node: ISCSINode): string => ISCSI_NODES_NAMESPACE + "/" + node.id;
-
-/**
- * Returns the iSCSI initiator.
- */
-const fetchInitiator = (): Promise<ISCSIInitiator> => get("/api/storage/iscsi/initiator");
-
-/**
- * Updates the name of the iSCSI initiator.
- */
-const updateInitiator = ({ name }) => patch("/api/storage/iscsi/initiator", { name });
-
-/**
- * Returns the iSCSI nodes.
- */
-const fetchNodes = (): Promise<ISCSINode[]> => get("/api/storage/iscsi/nodes");
-
-type LoginOptions = {
-  // Password for authentication by target
-  password?: string;
-  // Username for authentication by target
-  username?: string;
-  // Password for authentication by initiator
-  reversePassword?: string;
-  // Username for authentication by initiator
-  reverseUsername?: string;
-};
-
-/**
- * Performs an iSCSI discovery.
- *
- * @param address - IP address of the ISCSI server
- * @param port - Port of the iSCSI server
- * @param options - Authentication options
- * @return true on success, false on failure
- */
-const discover = async (address: string, port: number, options: LoginOptions): Promise<boolean> => {
-  const data = { address, port, options };
-  try {
-    await post("/api/storage/iscsi/discover", data);
-    return true;
-  } catch (error) {
-    console.error("Error discovering iSCSI targets:", error.message);
-    return false;
-  }
-};
-
-const deleteNode = async (node: ISCSINode): Promise<void> => {
-  await del(nodePath(node));
-};
-
-/*
- * Creates an iSCSI session on the given node.
- *
- * @param node - ISCSI node
- * @param options - Authentication options
- * @return operation result (0: success; 1: invalid startup; 2: failed)
- */
-const login = async (node: ISCSINode, options: LoginOptions) => {
-  try {
-    await post(nodePath(node) + "/login", options);
-    return 0;
-  } catch (error) {
-    const { data: reason } = error.response;
-    console.warn("Could not login into the iSCSI node:", error.message, "reason:", reason);
-    return reason === "InvalidStartup" ? 1 : 2;
-  }
-};
-
-/*
- * Closes an iSCSI session on the given node.
- *
- * @param node - ISCSI node
- */
-const logout = async (node: ISCSINode) => post(nodePath(node) + "/logout");
-
-/**
- * Sets the startup status of the connection
- *
- * @param node - ISCSI node
- * @param startup - startup status
- */
-const setStartup = async (node: ISCSINode, startup: string) => patch(nodePath(node), { startup });
-
-export {
-  fetchInitiator,
-  fetchNodes,
-  updateInitiator,
-  discover,
-  deleteNode,
-  login,
-  logout,
-  setStartup,
-};
-export type { LoginOptions };
diff --git a/web/src/model/system.ts b/web/src/model/system.ts
index 34638860a3..d2535b0f8d 100644
--- a/web/src/model/system.ts
+++ b/web/src/model/system.ts
@@ -26,6 +26,7 @@ import type * as L10n from "~/model/system/l10n";
 import type * as Network from "~/model/system/network";
 import type * as Software from "~/model/system/software";
 import type * as Storage from "~/model/system/storage";
+import type * as ISCSI from "~/model/system/iscsi";
 
 type System = {
   hardware?: Hardware.System;
@@ -35,6 +36,7 @@ type System = {
   products?: Product[];
   software?: Software.System;
   storage?: Storage.System;
+  iscsi?: ISCSI.System;
 };
 
 type Product = {
@@ -70,4 +72,4 @@ type Mode = {
   description: string;
 };
 
-export type { System, Product, L10n, Hardware, Hostname, Mode, Network, Software, Storage };
+export type { System, Product, L10n, Hardware, Hostname, Mode, Network, Software, Storage, ISCSI };
diff --git a/web/src/components/storage/iscsi/NodeStartupOptions.js b/web/src/model/system/iscsi.ts
similarity index 71%
rename from web/src/components/storage/iscsi/NodeStartupOptions.js
rename to web/src/model/system/iscsi.ts
index 4d12cebf37..40760d2476 100644
--- a/web/src/components/storage/iscsi/NodeStartupOptions.js
+++ b/web/src/model/system/iscsi.ts
@@ -1,5 +1,5 @@
 /*
- * Copyright (c) [2023] SUSE LLC
+ * Copyright (c) [2026] SUSE LLC
  *
  * All Rights Reserved.
  *
@@ -20,12 +20,4 @@
  * find current contact information at www.suse.com.
  */
 
-import { N_ } from "~/i18n";
-
-const NodeStartupOptions = Object.freeze({
-  MANUAL: { label: N_("Manual"), value: "manual" },
-  ONBOOT: { label: N_("On boot"), value: "onboot" },
-  AUTOMATIC: { label: N_("Automatic"), value: "automatic" },
-});
-
-export default NodeStartupOptions;
+export type * from "~/openapi/system/iscsi";
diff --git a/web/src/openapi/config/iscsi.ts b/web/src/openapi/config/iscsi.ts
new file mode 100644
index 0000000000..7328ac5be5
--- /dev/null
+++ b/web/src/openapi/config/iscsi.ts
@@ -0,0 +1,35 @@
+/**
+ * This file was automatically generated by json-schema-to-typescript.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run json-schema-to-typescript to regenerate this file.
+ */
+
+/**
+ * iSCSI config.
+ */
+export interface Config {
+  /**
+   * Initiator name.
+   */
+  initiator?: string;
+  /**
+   * List of targets.
+   */
+  targets?: Target[];
+}
+export interface Target {
+  /**
+   * IP address.
+   */
+  address: string;
+  port: number;
+  name: string;
+  interface: string;
+  startup?: "onboot" | "manual" | "automatic";
+  authByTarget?: Authentication;
+  authByInitiator?: Authentication;
+}
+export interface Authentication {
+  username: string;
+  password: string;
+}
diff --git a/web/src/model/config/software.ts b/web/src/openapi/config/software.ts
similarity index 67%
rename from web/src/model/config/software.ts
rename to web/src/openapi/config/software.ts
index bc3b3d86e3..2f6b23064e 100644
--- a/web/src/model/config/software.ts
+++ b/web/src/openapi/config/software.ts
@@ -1,23 +1,7 @@
-/*
- * Copyright (c) [2025] SUSE LLC
- *
- * All Rights Reserved.
- *
- * This program is free software; you can redistribute it and/or modify it
- * under the terms of the GNU General Public License as published by the Free
- * Software Foundation; either version 2 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 General Public License for
- * more details.
- *
- * You should have received a copy of the GNU General Public License along
- * with this program; if not, contact SUSE LLC.
- *
- * To contact SUSE LLC about this file by physical or electronic mail, you may
- * find current contact information at www.suse.com.
+/**
+ * This file was automatically generated by json-schema-to-typescript.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run json-schema-to-typescript to regenerate this file.
  */
 
 /**
diff --git a/web/src/openapi/system/iscsi.ts b/web/src/openapi/system/iscsi.ts
new file mode 100644
index 0000000000..9caac93199
--- /dev/null
+++ b/web/src/openapi/system/iscsi.ts
@@ -0,0 +1,36 @@
+/**
+ * This file was automatically generated by json-schema-to-typescript.
+ * DO NOT MODIFY IT BY HAND. Instead, modify the source JSONSchema file,
+ * and run json-schema-to-typescript to regenerate this file.
+ */
+
+/**
+ * API description of the iSCSI system
+ */
+export interface System {
+  initiator: Initiator;
+  targets: Target[];
+}
+export interface Initiator {
+  name: string;
+  ibft: boolean;
+}
+export interface Target {
+  name: string;
+  address: string;
+  port: number;
+  interface: string;
+  /**
+   * Whether the target was initiated by iBFT.
+   */
+  ibft: boolean;
+  startup: "onboot" | "manual" | "automatic";
+  /**
+   * Whether the node is connected (there is a session).
+   */
+  connected: boolean;
+  /**
+   * Whether the node is locked (cannot be deactivated)
+   */
+  locked: boolean;
+}
diff --git a/web/src/queries/storage/iscsi.ts b/web/src/queries/storage/iscsi.ts
deleted file mode 100644
index 56a23a9eaf..0000000000
--- a/web/src/queries/storage/iscsi.ts
+++ /dev/null
@@ -1,132 +0,0 @@
-/*
- * Copyright (c) [2024] SUSE LLC
- *
- * All Rights Reserved.
- *
- * This program is free software; you can redistribute it and/or modify it
- * under the terms of the GNU General Public License as published by the Free
- * Software Foundation; either version 2 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 General Public License for
- * more details.
- *
- * You should have received a copy of the GNU General Public License along
- * with this program; if not, contact SUSE LLC.
- *
- * To contact SUSE LLC about this file by physical or electronic mail, you may
- * find current contact information at www.suse.com.
- */
-
-import React from "react";
-import { useMutation, useQueryClient, useSuspenseQuery } from "@tanstack/react-query";
-import {
-  fetchInitiator,
-  fetchNodes,
-  updateInitiator,
-  ISCSIInitiator,
-  ISCSINode,
-} from "~/model/storage/iscsi";
-import { useInstallerClient } from "~/context/installer";
-
-const initiatorQuery = {
-  queryKey: ["storage", "iscsi", "initiator"],
-  queryFn: async (): Promise<ISCSIInitiator> => {
-    const initiator = await fetchInitiator();
-    return initiator;
-  },
-};
-
-/**
- * Hook that returns the information about the ISCSI initiator.
- *
- * This hook uses the Suspense API.
- */
-const useInitiator = (): ISCSIInitiator => {
-  const { data } = useSuspenseQuery(initiatorQuery);
-  return data;
-};
-
-/**
- * Hook that builds a mutation to update the initiator information.
- */
-const useInitiatorMutation = () => {
-  const queryClient = useQueryClient();
-  const query = {
-    mutationFn: ({ name }) => updateInitiator({ name }),
-    onSuccess: () => queryClient.invalidateQueries({ queryKey: initiatorQuery.queryKey }),
-  };
-  return useMutation(query);
-};
-
-/**
- * Subscribes to ISCSI initiator changes to keep the data up-to-date.
- */
-const useInitiatorChanges = () => {
-  const client = useInstallerClient();
-  const queryClient = useQueryClient();
-  React.useEffect(() => {
-    if (!client) return;
-
-    return client.onEvent(({ type, name, ibft }) => {
-      if (type !== "ISCSIInitiatorChanged") return;
-
-      queryClient.setQueryData(initiatorQuery.queryKey, (oldData: ISCSIInitiator | undefined) => {
-        if (oldData === undefined) return;
-
-        return {
-          name: name === null ? oldData.name : name,
-          ibft: ibft === null ? oldData.ibft : ibft,
-        };
-      });
-    });
-  }, [client, queryClient]);
-};
-
-const nodesQuery = {
-  queryKey: ["storage", "iscsi", "nodes"],
-  queryFn: fetchNodes,
-};
-
-const useNodes = (): ISCSINode[] => {
-  const { data } = useSuspenseQuery(nodesQuery);
-  return data;
-};
-
-/**
- * Subscribes to ISCSI nodes changes to keep the query up-to-date.
- */
-const useNodesChanges = () => {
-  const client = useInstallerClient();
-  const queryClient = useQueryClient();
-
-  React.useEffect(() => {
-    if (!client) return;
-
-    return client.onEvent(({ type, node }) => {
-      if (!["ISCSINodeAdded", "ISCSINodeChanged", "ISCSINodeRemoved"].includes(type)) {
-        return;
-      }
-
-      queryClient.setQueryData(nodesQuery.queryKey, (oldData: ISCSINode[] | undefined) => {
-        if (oldData === undefined) return;
-
-        switch (type) {
-          case "ISCSINodeAdded": {
-            return [...oldData, node];
-          }
-          case "ISCSINodeChanged": {
-            return oldData.map((n) => (n.id === node.id ? node : n));
-          }
-          case "ISCSINodeRemoved": {
-            return oldData.filter((n) => n.id !== node.id);
-          }
-        }
-      });
-    });
-  }, [client, queryClient]);
-};
-
-export { useInitiator, useInitiatorMutation, useInitiatorChanges, useNodes, useNodesChanges };
diff --git a/web/src/routes/paths.ts b/web/src/routes/paths.ts
index 251bca6d5d..c8a4950cd5 100644
--- a/web/src/routes/paths.ts
+++ b/web/src/routes/paths.ts
@@ -90,7 +90,12 @@ const STORAGE = {
       edit: "/storage/volume-groups/:id/logical-volumes/:logicalVolumeId/edit",
     },
   },
-  iscsi: "/storage/iscsi",
+  iscsi: {
+    root: "/storage/iscsi",
+    initiator: "/storage/iscsi/initiator",
+    discover: "/storage/iscsi/targets/discover",
+    login: "/storage/iscsi/targets/:name/:address/:port/login",
+  },
   dasd: "/storage/dasd",
   zfcp: {
     root: "/storage/zfcp",
@@ -102,37 +107,4 @@ const HOSTNAME = {
   root: "/hostname",
 };
 
-/**
- * A set of routes that do not directly allow fine-tuning the installation
- * settings for the selected product, but rather serve special purposes, such
- * as authentication (e.g., login), product selection change, or transitions
- * between states (e.g., progress, error, success).
- *
- * These routes are defined separately to adjust the UI accordingly, ensuring
- * that certain core elements, like the Install button, are not displayed when
- * visiting them.
- */
-const SIDE_PATHS = [
-  ROOT.login,
-  PRODUCT.changeProduct,
-  ROOT.installationProgress,
-  ROOT.installationFinished,
-  ROOT.installationExit,
-  STORAGE.progress,
-];
-
-const EXTENDED_SIDE_PATHS = [...SIDE_PATHS, ROOT.root, ROOT.overview];
-
-export {
-  HOSTNAME,
-  L10N,
-  NETWORK,
-  PRODUCT,
-  REGISTRATION,
-  ROOT,
-  SIDE_PATHS,
-  EXTENDED_SIDE_PATHS,
-  SOFTWARE,
-  STORAGE,
-  USER,
-};
+export { HOSTNAME, L10N, NETWORK, PRODUCT, REGISTRATION, ROOT, SOFTWARE, STORAGE, USER };
diff --git a/web/src/routes/storage.tsx b/web/src/routes/storage.tsx
index 6ba875c914..2826b8e417 100644
--- a/web/src/routes/storage.tsx
+++ b/web/src/routes/storage.tsx
@@ -36,10 +36,13 @@ import LogicalVolumePage from "~/components/storage/LogicalVolumePage";
 import ZFCPPage from "~/components/storage/zfcp/ZFCPPage";
 import ZFCPDiskActivationPage from "~/components/storage/zfcp/ZFCPDiskActivationPage";
 import DASDPage from "~/components/storage/dasd/DASDPage";
+import TargetLoginPage from "~/components/storage/iscsi/TargetLoginPage";
+import DiscoverFormPage from "~/components/storage/iscsi/DiscoverFormPage";
 import DeviceSelectorPage from "~/components/storage/DeviceSelectorPage";
 import { supportedDASD, probeDASD } from "~/model/storage/dasd";
 import { probeZFCP, supportedZFCP } from "~/model/storage/zfcp";
 import { STORAGE as PATHS } from "~/routes/paths";
+import InitiatorFormPage from "~/components/storage/iscsi/InitiatorFormPage";
 
 const routes = (): Route => ({
   path: PATHS.root,
@@ -94,9 +97,20 @@ const routes = (): Route => ({
       element: <LogicalVolumePage />,
     },
     {
-      path: PATHS.iscsi,
+      path: PATHS.iscsi.root,
       element: <ISCSIPage />,
-      handle: { name: N_("iSCSI") },
+    },
+    {
+      path: PATHS.iscsi.initiator,
+      element: <InitiatorFormPage />,
+    },
+    {
+      path: PATHS.iscsi.discover,
+      element: <DiscoverFormPage />,
+    },
+    {
+      path: PATHS.iscsi.login,
+      element: <TargetLoginPage />,
     },
     {
       path: PATHS.dasd,
diff --git a/web/src/utils.test.ts b/web/src/utils.test.ts
index 5c0f5fca81..f182480d80 100644
--- a/web/src/utils.test.ts
+++ b/web/src/utils.test.ts
@@ -20,7 +20,17 @@
  * find current contact information at www.suse.com.
  */
 
-import { compact, localConnection, hex, mask, timezoneTime, sortCollection } from "./utils";
+import {
+  compact,
+  localConnection,
+  hex,
+  mask,
+  timezoneTime,
+  sortCollection,
+  mergeSources,
+} from "./utils";
+import type { Target as ConfigTarget } from "~/openapi/config/iscsi";
+import type { Target as SystemTarget } from "~/openapi/system/iscsi";
 
 describe("compact", () => {
   it("removes null and undefined values", () => {
@@ -261,3 +271,247 @@ describe("simpleFastSort", () => {
     expect(fakeDevices).toEqual(original);
   });
 });
+
+describe("mergeSources", () => {
+  it("merges collections honoring precedence when primary key is based on single attribute", () => {
+    const result = mergeSources({
+      collections: {
+        system: [
+          {
+            name: "iqn.2023-01.com.example:12ac588",
+            address: "192.168.100.102",
+            port: 3262,
+            interface: "default",
+            ibft: false,
+            startup: "onboot",
+            connected: true,
+            locked: false,
+          },
+        ],
+        config: [
+          {
+            name: "iqn.2023-01.com.example:12ac588",
+            address: "192.168.100.102",
+            port: 3262,
+            interface: "default",
+            startup: "onboot",
+          },
+          {
+            name: "iqn.2023-01.com.example:12ac788",
+            address: "192.168.100.106",
+            port: 3264,
+            interface: "default",
+            startup: "onboot",
+          },
+        ],
+      },
+      precedence: ["system", "config"],
+      primaryKey: "name",
+    });
+
+    expect(result).toHaveLength(2);
+
+    expect(result[0]).toMatchObject({
+      name: "iqn.2023-01.com.example:12ac588",
+      address: "192.168.100.102",
+      port: 3262,
+      interface: "default",
+      ibft: false,
+      startup: "onboot",
+      connected: true,
+      locked: false,
+      sources: ["system", "config"],
+    });
+
+    expect(result[1]).toMatchObject({
+      name: "iqn.2023-01.com.example:12ac788",
+      address: "192.168.100.106",
+      port: 3264,
+      sources: ["config"],
+    });
+  });
+
+  it("merges collections honoring precedence when primary key is based on mulitple attribute", () => {
+    type MergedTarget = Partial<SystemTarget> & Partial<ConfigTarget>;
+    const result = mergeSources<MergedTarget, keyof MergedTarget>({
+      collections: {
+        system: [
+          {
+            name: "iqn.2023-01.com.example:storage",
+            address: "192.168.100.102",
+            port: 3260,
+            interface: "default",
+            ibft: false,
+            startup: "onboot",
+            connected: true,
+            locked: false,
+          },
+          {
+            name: "iqn.2023-01.com.example:storage",
+            address: "192.168.100.102",
+            port: 3261,
+            interface: "default",
+            ibft: false,
+            startup: "manual",
+            connected: false,
+            locked: false,
+          },
+        ],
+        config: [
+          {
+            name: "iqn.2023-01.com.example:storage",
+            address: "192.168.100.102",
+            port: 3260,
+            interface: "default",
+            startup: "onboot",
+          },
+          {
+            name: "iqn.2023-01.com.example:storage",
+            address: "192.168.100.102",
+            port: 3261,
+            interface: "default",
+            startup: "manual",
+          },
+          {
+            name: "iqn.2023-01.com.example:storage",
+            address: "192.168.100.103",
+            port: 3260,
+            interface: "default",
+            startup: "onboot",
+          },
+        ],
+      },
+      precedence: ["system", "config"],
+      primaryKey: ["name", "address", "port"],
+    });
+
+    expect(result).toHaveLength(3);
+    expect(result[0]).toMatchObject({
+      name: "iqn.2023-01.com.example:storage",
+      address: "192.168.100.102",
+      port: 3260,
+      connected: true,
+      sources: ["system", "config"],
+    });
+    expect(result[1]).toMatchObject({
+      name: "iqn.2023-01.com.example:storage",
+      address: "192.168.100.102",
+      port: 3261,
+      connected: false,
+      sources: ["system", "config"],
+    });
+    expect(result[2]).toMatchObject({
+      name: "iqn.2023-01.com.example:storage",
+      address: "192.168.100.103",
+      port: 3260,
+      sources: ["config"],
+    });
+    expect(result[2]).not.toHaveProperty("connected");
+  });
+
+  it('uses "id" as default primary key when not specified', () => {
+    const result = mergeSources({
+      collections: {
+        source1: [
+          { id: 1, value: "first" },
+          { id: 2, value: "second" },
+        ],
+        source2: [
+          { id: 1, value: "duplicate" },
+          { id: 3, value: "third" },
+        ],
+      },
+      precedence: ["source1", "source2"],
+    });
+
+    expect(result).toHaveLength(3);
+    expect(result[0]).toEqual({ id: 1, value: "first", sources: ["source1", "source2"] });
+    expect(result[1]).toEqual({ id: 2, value: "second", sources: ["source1"] });
+    expect(result[2]).toEqual({ id: 3, value: "third", sources: ["source2"] });
+  });
+
+  it("returns empty array when all collections are empty", () => {
+    const result = mergeSources({
+      collections: {
+        system: [],
+        config: [],
+      },
+      precedence: ["system", "config"],
+      primaryKey: "name",
+    });
+
+    expect(result).toEqual([]);
+  });
+
+  it("handles single collection with multiple items", () => {
+    const result = mergeSources({
+      collections: {
+        config: [
+          {
+            name: "iqn.2023-01.com.example:target1",
+            address: "192.168.100.1",
+            port: 3260,
+            interface: "default",
+            startup: "onboot",
+          },
+          {
+            name: "iqn.2023-01.com.example:target2",
+            address: "192.168.100.2",
+            port: 3260,
+            interface: "default",
+            startup: "manual",
+          },
+        ],
+      },
+      precedence: ["config"],
+      primaryKey: "name",
+    });
+
+    expect(result).toHaveLength(2);
+    expect(result[0].sources).toEqual(["config"]);
+    expect(result[1].sources).toEqual(["config"]);
+  });
+
+  it("supports more than two collections", () => {
+    const result = mergeSources({
+      collections: {
+        system: [
+          {
+            name: "iqn.2023-01.com.example:shared",
+            address: "192.168.100.1",
+            port: 3260,
+            interface: "default",
+            ibft: false,
+            startup: "onboot",
+            connected: true,
+            locked: false,
+          },
+        ],
+        config: [
+          {
+            name: "iqn.2023-01.com.example:shared",
+            address: "192.168.100.1",
+            port: 3260,
+            interface: "default",
+            startup: "onboot",
+          },
+        ],
+        extended: [
+          {
+            name: "iqn.2023-01.com.example:shared",
+            address: "192.168.100.1",
+            port: 3260,
+            interface: "default",
+            startup: "onboot",
+          },
+        ],
+      },
+      precedence: ["system", "config", "extended"],
+      primaryKey: "name",
+    });
+
+    expect(result).toHaveLength(1);
+    expect(result[0].sources).toEqual(["system", "config", "extended"]);
+    expect(result[0].connected).toBe(true);
+  });
+});
diff --git a/web/src/utils.ts b/web/src/utils.ts
index 51bcce1950..c487886132 100644
--- a/web/src/utils.ts
+++ b/web/src/utils.ts
@@ -205,6 +205,216 @@ const generateEncodedPath = (...args: Parameters<typeof generatePath>) => {
 const sortCollection = <T>(collection: T[], direction: "asc" | "desc", key: string | ISortBy<T>) =>
   sort(collection)[direction](key as ISortBy<T>);
 
+/** Options for mergeSources */
+export type MergeSourcesOptions<T, K extends keyof T> = {
+  /** Object mapping source names to their arrays */
+  collections: Record<string, T[]>;
+  /** Order of precedence of where to take the object from if it is in more than
+   * one collection */
+  precedence: string[];
+  /** The property name(s) to use as the unique identifier */
+  primaryKey?: K | K[];
+};
+
+/** Item augmented with sources array */
+type ItemWithSources<T> = Omit<T, "sources"> & {
+  /** Array of source names where this item was found */
+  sources: string[];
+};
+
+/**
+ * Merges multiple collections of objects, tracking which sources each item
+ * appears in.
+ *
+ * When the same item (identified by the specified primaryKey(s)) appears in multiple
+ * collections, it will appear only once in the output with a `sources` array
+ * listing all collections where it was found. The object data is taken from
+ * the first source in the precedence order where it appears.
+ *
+ * @template T - The type of objects in the collections
+ * @template K - The key type used for identifying unique items
+ *
+ * @param options - Configuration object
+ * @param options.collections - Object mapping source names to arrays of items
+ * @param options.precedence - Array of source names in priority order (first = highest)
+ * @param options.primaryKey - Property name(s) to use as unique identifier (default: "id").
+ *                              Can be a single key or array of keys for composite primary keys.
+ *
+ * @returns Array of merged items, each with a `sources` property
+ *
+ * @example
+ * ```typescript
+ * // Single primary key example - iSCSI targets identified by name only
+ * const result = mergeSources({
+ *   collections: {
+ *     system: [
+ *       {
+ *         name: "iqn.2023-01.com.example:12ac588",
+ *         address: "192.168.100.102",
+ *         port: 3262,
+ *         interface: "default",
+ *         ibtf: false,
+ *         startup: "onboot",
+ *         connected: true,
+ *         locked: false
+ *       }
+ *     ],
+ *     config: [
+ *       {
+ *         name: "iqn.2023-01.com.example:12ac588",
+ *         address: "192.168.100.102",
+ *         port: 3262,
+ *         interface: "default",
+ *         startup: "onboot"
+ *       },
+ *       {
+ *         name: "iqn.2023-01.com.example:12ac788",
+ *         address: "192.168.100.106",
+ *         port: 3264,
+ *         interface: "default",
+ *         startup: "onboot"
+ *       }
+ *     ]
+ *   },
+ *   precedence: ['system', 'config'],
+ *   primaryKey: 'name'
+ * });
+ * // Returns:
+ * // [
+ * //   {
+ * //     name: "iqn.2023-01.com.example:12ac588",
+ * //     address: "192.168.100.102",
+ * //     port: 3262,
+ * //     interface: "default",
+ * //     ibtf: false,
+ * //     startup: "onboot",
+ * //     connected: true,
+ * //     locked: false,
+ * //     sources: ['system', 'config']
+ * //   },
+ * //   {
+ * //     name: "iqn.2023-01.com.example:12ac788",
+ * //     address: "192.168.100.106",
+ * //     port: 3264,
+ * //     interface: "default",
+ * //     startup: "onboot",
+ * //     sources: ['config']
+ * //   }
+ * // ]
+ *
+ * // Multiple primary key example - iSCSI targets identified by name + address + port
+ * // This is necessary because the same target name can have multiple portals
+ * const result2 = mergeSources({
+ *   collections: {
+ *     system: [
+ *       {
+ *         name: "iqn.2023-01.com.example:storage",
+ *         address: "192.168.100.102",
+ *         port: 3260,
+ *         interface: "default",
+ *         ibtf: false,
+ *         startup: "onboot",
+ *         connected: true,
+ *         locked: false
+ *       },
+ *       {
+ *         name: "iqn.2023-01.com.example:storage",
+ *         address: "192.168.100.102",
+ *         port: 3261,
+ *         interface: "default",
+ *         ibtf: false,
+ *         startup: "manual",
+ *         connected: false,
+ *         locked: false
+ *       }
+ *     ],
+ *     config: [
+ *       {
+ *         name: "iqn.2023-01.com.example:storage",
+ *         address: "192.168.100.102",
+ *         port: 3260,
+ *         interface: "default",
+ *         startup: "onboot"
+ *       },
+ *       {
+ *         name: "iqn.2023-01.com.example:storage",
+ *         address: "192.168.100.102",
+ *         port: 3261,
+ *         interface: "default",
+ *         startup: "manual"
+ *       },
+ *       {
+ *         name: "iqn.2023-01.com.example:storage",
+ *         address: "192.168.100.103",
+ *         port: 3260,
+ *         interface: "default",
+ *         startup: "onboot"
+ *       }
+ *     ]
+ *   },
+ *   precedence: ['system', 'config'],
+ *   primaryKey: ['name', 'address', 'port']
+ * });
+ * // Returns:
+ * // [
+ * //   {
+ * //     name: "iqn.2023-01.com.example:storage",
+ * //     address: "192.168.100.102",
+ * //     port: 3260,
+ * //     interface: "default",
+ * //     ibtf: false,
+ * //     startup: "onboot",
+ * //     connected: true,
+ * //     locked: false,
+ * //     sources: ['system', 'config']
+ * //   },
+ * //   {
+ * //     name: "iqn.2023-01.com.example:storage",
+ * //     address: "192.168.100.102",
+ * //     port: 3261,
+ * //     interface: "default",
+ * //     ibtf: false,
+ * //     startup: "manual",
+ * //     connected: false,
+ * //     locked: false,
+ * //     sources: ['system', 'config']
+ * //   },
+ * //   {
+ * //     name: "iqn.2023-01.com.example:storage",
+ * //     address: "192.168.100.103",
+ * //     port: 3260,
+ * //     interface: "default",
+ * //     startup: "onboot",
+ * //     sources: ['config']
+ * //   }
+ * // ]
+ * ```
+ */
+function mergeSources<T, K extends keyof T>({
+  collections,
+  precedence,
+  primaryKey = "id" as K,
+}: MergeSourcesOptions<T, K>): ItemWithSources<T>[] {
+  const map = new Map<string, ItemWithSources<T>>();
+
+  for (const name of precedence) {
+    const items = collections[name];
+    for (const obj of items) {
+      const key = Array.isArray(primaryKey)
+        ? primaryKey.map((k) => String(obj[k])).join("|")
+        : String(obj[primaryKey]);
+
+      if (map.has(key)) {
+        map.get(key)!.sources.push(name);
+      } else {
+        map.set(key, { ...obj, sources: [name] });
+      }
+    }
+  }
+
+  return Array.from(map.values());
+}
+
 export {
   compact,
   hex,
@@ -215,4 +425,5 @@ export {
   mask,
   generateEncodedPath,
   sortCollection,
+  mergeSources,
 };
diff --git a/web/webpack.config.js b/web/webpack.config.js
index a72a3a6029..7b0b345aee 100644
--- a/web/webpack.config.js
+++ b/web/webpack.config.js
@@ -199,7 +199,7 @@ module.exports = {
               sassOptions: {
                 includePaths: ["node_modules"],
                 outputStyle: production ? "compressed" : undefined,
-                silenceDeprecations: ["import", "global-builtin"],
+                silenceDeprecations: ["global-builtin", "if-function"],
               },
             },
           },