From 16a8d2d529995a482feb5235c3c5e607776aecf5 Mon Sep 17 00:00:00 2001
From: Ethan Shaw <ethan.shaw@canonical.com>
Date: Fri, 27 Mar 2026 18:50:35 +0000
Subject: [PATCH 01/42] add navigation

---
 src/components/layout/PageMain.module.scss    |   7 ++
 src/components/layout/PageMain.tsx            |   4 +-
 src/libs/routes/profiles.ts                   |   2 -
 src/libs/routes/repositories.ts               |  20 +++-
 .../[single]/tabs/info/ProfileLink/helpers.ts |   2 +-
 .../profiles/repository-profiles/index.ts     |   1 -
 .../dashboard/repositories/RepositoryPage.tsx |  11 +-
 .../repositories/apt-sources/index.ts         |   1 -
 .../dashboard/repositories/gpg-keys/index.ts  |   1 -
 .../LocalRepositoriesPage.tsx}                |   0
 .../repositories/local-repositories/index.ts  |   1 +
 ...{DistributionsPage.tsx => MirrorsPage.tsx} |   0
 .../dashboard/repositories/mirrors/index.ts   |   2 +-
 .../PublicationTargetsPage.tsx}               |  39 +++----
 .../repositories/publication-targets/index.ts |   1 +
 .../publications/PublicationsPage.tsx         |  85 ++++++++++++++
 .../repositories/publications/index.ts        |   1 +
 .../RepositoryProfilesPage.tsx                |   0
 .../repository-profiles}/index.ts             |   0
 src/routes/DashboardRoutes.tsx                |  62 +++++++---
 src/routes/elements.tsx                       |  27 +++--
 .../dashboard/DashboardTemplate.module.scss   |  11 --
 src/templates/dashboard/DashboardTemplate.tsx |  18 +--
 .../NavigationExpandable.tsx                  |  16 +++
 .../NavigationRoute/NavigationRoute.tsx       |   9 +-
 .../dashboard/Navigation/constants.ts         |  23 +++-
 src/templates/dashboard/Navigation/types.d.ts |   1 +
 .../SecondaryNavigation.module.scss           |   4 +
 .../SecondaryNavigation.tsx                   | 106 +++++++++++-------
 29 files changed, 304 insertions(+), 151 deletions(-)
 delete mode 100644 src/pages/dashboard/profiles/repository-profiles/index.ts
 delete mode 100644 src/pages/dashboard/repositories/apt-sources/index.ts
 delete mode 100644 src/pages/dashboard/repositories/gpg-keys/index.ts
 rename src/pages/dashboard/repositories/{apt-sources/APTSourcesPage.tsx => local-repositories/LocalRepositoriesPage.tsx} (100%)
 create mode 100644 src/pages/dashboard/repositories/local-repositories/index.ts
 rename src/pages/dashboard/repositories/mirrors/{DistributionsPage.tsx => MirrorsPage.tsx} (100%)
 rename src/pages/dashboard/repositories/{gpg-keys/GPGKeysPage.tsx => publication-targets/PublicationTargetsPage.tsx} (68%)
 create mode 100644 src/pages/dashboard/repositories/publication-targets/index.ts
 create mode 100644 src/pages/dashboard/repositories/publications/PublicationsPage.tsx
 create mode 100644 src/pages/dashboard/repositories/publications/index.ts
 rename src/pages/dashboard/{profiles/repository-profiles/RepositoryProfilesPage => repositories/repository-profiles}/RepositoryProfilesPage.tsx (100%)
 rename src/pages/dashboard/{profiles/repository-profiles/RepositoryProfilesPage => repositories/repository-profiles}/index.ts (100%)

diff --git a/src/components/layout/PageMain.module.scss b/src/components/layout/PageMain.module.scss
index d6da64625..eb0da96ee 100644
--- a/src/components/layout/PageMain.module.scss
+++ b/src/components/layout/PageMain.module.scss
@@ -2,3 +2,10 @@
   display: flex;
   flex-direction: column;
 }
+
+.pageContent {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  width: 100%;
+}
diff --git a/src/components/layout/PageMain.tsx b/src/components/layout/PageMain.tsx
index 50f79dfcf..aff7220ba 100644
--- a/src/components/layout/PageMain.tsx
+++ b/src/components/layout/PageMain.tsx
@@ -8,7 +8,9 @@ interface PageMainProps {
 
 const PageMain: FC<PageMainProps> = ({ children }) => {
   return (
-    <div className={classNames("p-panel", classes.wrapper)}>{children}</div>
+    <div className={classes.pageContent}>
+      <div className={classNames("p-panel", classes.wrapper)}>{children}</div>
+    </div>
   );
 };
 
diff --git a/src/libs/routes/profiles.ts b/src/libs/routes/profiles.ts
index 97d821ffa..71cdd014b 100644
--- a/src/libs/routes/profiles.ts
+++ b/src/libs/routes/profiles.ts
@@ -5,7 +5,6 @@ export const PROFILES_PATHS = {
   package: "package",
   reboot: "reboot",
   removal: "removal",
-  repository: "repository",
   security: "security",
   upgrade: "upgrade",
   wsl: "wsl",
@@ -20,7 +19,6 @@ export const PROFILES_ROUTES = {
   package: createRoute(buildProfilePath(PROFILES_PATHS.package)),
   reboot: createRoute(buildProfilePath(PROFILES_PATHS.reboot)),
   removal: createRoute(buildProfilePath(PROFILES_PATHS.removal)),
-  repository: createRoute(buildProfilePath(PROFILES_PATHS.repository)),
   security: createRoute(buildProfilePath(PROFILES_PATHS.security)),
   upgrade: createRoute(buildProfilePath(PROFILES_PATHS.upgrade)),
   wsl: createRoute(buildProfilePath(PROFILES_PATHS.wsl)),
diff --git a/src/libs/routes/repositories.ts b/src/libs/routes/repositories.ts
index becad66c0..609ece6ca 100644
--- a/src/libs/routes/repositories.ts
+++ b/src/libs/routes/repositories.ts
@@ -3,8 +3,10 @@ import { createRoute, createPathBuilder } from "./_helpers";
 export const REPOSITORIES_PATHS = {
   root: "repositories",
   mirrors: "mirrors",
-  gpgKeys: "gpg-keys",
-  aptSources: "apt-sources",
+  localRepositories: "local-repositories",
+  publications: "publications",
+  publicationTargets: "publication-targets",
+  repositoryProfiles: "repository-profiles",
 } as const;
 
 const base = `/${REPOSITORIES_PATHS.root}`;
@@ -14,6 +16,16 @@ const buildRepositoryPath = createPathBuilder(base);
 export const REPOSITORIES_ROUTES = {
   root: createRoute(base),
   mirrors: createRoute(buildRepositoryPath(REPOSITORIES_PATHS.mirrors)),
-  gpgKeys: createRoute(buildRepositoryPath(REPOSITORIES_PATHS.gpgKeys)),
-  aptSources: createRoute(buildRepositoryPath(REPOSITORIES_PATHS.aptSources)),
+  localRepositories: createRoute(
+    buildRepositoryPath(REPOSITORIES_PATHS.localRepositories),
+  ),
+  publications: createRoute(
+    buildRepositoryPath(REPOSITORIES_PATHS.publications),
+  ),
+  publicationTargets: createRoute(
+    buildRepositoryPath(REPOSITORIES_PATHS.publicationTargets),
+  ),
+  repositoryProfiles: createRoute(
+    buildRepositoryPath(REPOSITORIES_PATHS.repositoryProfiles),
+  ),
 } as const;
diff --git a/src/pages/dashboard/instances/[single]/tabs/info/ProfileLink/helpers.ts b/src/pages/dashboard/instances/[single]/tabs/info/ProfileLink/helpers.ts
index f69aaee84..6494f0d78 100644
--- a/src/pages/dashboard/instances/[single]/tabs/info/ProfileLink/helpers.ts
+++ b/src/pages/dashboard/instances/[single]/tabs/info/ProfileLink/helpers.ts
@@ -19,7 +19,7 @@ export const getTo = (profile: Profile) => {
         profile: profile.id.toString() || "",
       });
     case "repository":
-      return ROUTES.profiles.repository({
+      return ROUTES.repositories.repositoryProfiles({
         search: profile.title || "",
       });
     case "script":
diff --git a/src/pages/dashboard/profiles/repository-profiles/index.ts b/src/pages/dashboard/profiles/repository-profiles/index.ts
deleted file mode 100644
index f4449b9c8..000000000
--- a/src/pages/dashboard/profiles/repository-profiles/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./RepositoryProfilesPage";
diff --git a/src/pages/dashboard/repositories/RepositoryPage.tsx b/src/pages/dashboard/repositories/RepositoryPage.tsx
index 9adf21a8e..b9be62c03 100644
--- a/src/pages/dashboard/repositories/RepositoryPage.tsx
+++ b/src/pages/dashboard/repositories/RepositoryPage.tsx
@@ -1,16 +1,9 @@
 import { ROUTES } from "@/libs/routes";
 import type { FC } from "react";
-import { useEffect } from "react";
-import { useNavigate } from "react-router";
+import { Navigate } from "react-router";
 
 const RepositoryPage: FC = () => {
-  const navigate = useNavigate();
-
-  useEffect(() => {
-    navigate(ROUTES.repositories.mirrors(), { replace: true });
-  }, []);
-
-  return null;
+  return <Navigate to={ROUTES.repositories.mirrors()} replace />;
 };
 
 export default RepositoryPage;
diff --git a/src/pages/dashboard/repositories/apt-sources/index.ts b/src/pages/dashboard/repositories/apt-sources/index.ts
deleted file mode 100644
index bb8bfa5c9..000000000
--- a/src/pages/dashboard/repositories/apt-sources/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./APTSourcesPage";
diff --git a/src/pages/dashboard/repositories/gpg-keys/index.ts b/src/pages/dashboard/repositories/gpg-keys/index.ts
deleted file mode 100644
index d74d95669..000000000
--- a/src/pages/dashboard/repositories/gpg-keys/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./GPGKeysPage";
diff --git a/src/pages/dashboard/repositories/apt-sources/APTSourcesPage.tsx b/src/pages/dashboard/repositories/local-repositories/LocalRepositoriesPage.tsx
similarity index 100%
rename from src/pages/dashboard/repositories/apt-sources/APTSourcesPage.tsx
rename to src/pages/dashboard/repositories/local-repositories/LocalRepositoriesPage.tsx
diff --git a/src/pages/dashboard/repositories/local-repositories/index.ts b/src/pages/dashboard/repositories/local-repositories/index.ts
new file mode 100644
index 000000000..a783fbe49
--- /dev/null
+++ b/src/pages/dashboard/repositories/local-repositories/index.ts
@@ -0,0 +1 @@
+export { default } from "./LocalRepositoriesPage";
diff --git a/src/pages/dashboard/repositories/mirrors/DistributionsPage.tsx b/src/pages/dashboard/repositories/mirrors/MirrorsPage.tsx
similarity index 100%
rename from src/pages/dashboard/repositories/mirrors/DistributionsPage.tsx
rename to src/pages/dashboard/repositories/mirrors/MirrorsPage.tsx
diff --git a/src/pages/dashboard/repositories/mirrors/index.ts b/src/pages/dashboard/repositories/mirrors/index.ts
index fda48713c..ee21e658d 100644
--- a/src/pages/dashboard/repositories/mirrors/index.ts
+++ b/src/pages/dashboard/repositories/mirrors/index.ts
@@ -1 +1 @@
-export { default } from "./DistributionsPage";
+export { default } from "./MirrorsPage";
diff --git a/src/pages/dashboard/repositories/gpg-keys/GPGKeysPage.tsx b/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx
similarity index 68%
rename from src/pages/dashboard/repositories/gpg-keys/GPGKeysPage.tsx
rename to src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx
index ddcad7f5b..d861a67a3 100644
--- a/src/pages/dashboard/repositories/gpg-keys/GPGKeysPage.tsx
+++ b/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx
@@ -3,31 +3,28 @@ import LoadingState from "@/components/layout/LoadingState";
 import PageContent from "@/components/layout/PageContent";
 import PageHeader from "@/components/layout/PageHeader";
 import PageMain from "@/components/layout/PageMain";
-import { GPGKeysList, useGPGKeys } from "@/features/gpg-keys";
+import { APTSourcesList, useGetAPTSources } from "@/features/apt-sources";
 import useSidePanel from "@/hooks/useSidePanel";
 import { Button } from "@canonical/react-components";
 import type { FC } from "react";
 import { lazy, Suspense } from "react";
 
-const NewGPGKeyForm = lazy(async () =>
-  import("@/features/gpg-keys").then((module) => ({
-    default: module.NewGPGKeyForm,
+const NewAPTSourceForm = lazy(async () =>
+  import("@/features/apt-sources").then((module) => ({
+    default: module.NewAPTSourceForm,
   })),
 );
 
-const GPGKeysPage: FC = () => {
+const APTSourcesPage: FC = () => {
   const { setSidePanelContent } = useSidePanel();
-  const { getGPGKeysQuery } = useGPGKeys();
-
-  const { data, isLoading } = getGPGKeysQuery();
-
-  const items = data?.data ?? [];
+  const { aptSources: items, isGettingAPTSources: isLoading } =
+    useGetAPTSources();
 
   const handleOpen = () => {
     setSidePanelContent(
-      "Import GPG key",
+      "Add APT source",
       <Suspense fallback={<LoadingState />}>
-        <NewGPGKeyForm />
+        <NewAPTSourceForm />
       </Suspense>,
     );
   };
@@ -35,16 +32,15 @@ const GPGKeysPage: FC = () => {
   return (
     <PageMain>
       <PageHeader
-        title="GPG keys"
+        title="APT sources"
         actions={[
           <Button
             key="new-key-button"
             appearance="positive"
             onClick={handleOpen}
             type="button"
-            aria-label="Import GPG key"
           >
-            Import key
+            Add APT source
           </Button>,
         ]}
       />
@@ -52,19 +48,19 @@ const GPGKeysPage: FC = () => {
         {isLoading && <LoadingState />}
         {!isLoading && items.length === 0 && (
           <EmptyState
-            title="No GPG keys found"
+            title="No APT sources found"
             icon="connected"
             body={
               <>
                 <p className="u-no-margin--bottom">
-                  You haven&apos;t added any GPG keys yet.
+                  You haven’t added any APT sources yet.
                 </p>
                 <a
                   href="https://ubuntu.com/landscape/docs/repositories"
                   target="_blank"
                   rel="nofollow noopener noreferrer"
                 >
-                  How to manage GPG keys in Landscape
+                  How to manage APT sources in Landscape
                 </a>
               </>
             }
@@ -74,17 +70,16 @@ const GPGKeysPage: FC = () => {
                 key="table-add-new-mirror"
                 onClick={handleOpen}
                 type="button"
-                aria-label="Import GPG key"
               >
-                Import key
+                Add APT source
               </Button>,
             ]}
           />
         )}
-        {!isLoading && items.length > 0 && <GPGKeysList items={items} />}
+        {!isLoading && items.length > 0 && <APTSourcesList items={items} />}
       </PageContent>
     </PageMain>
   );
 };
 
-export default GPGKeysPage;
+export default APTSourcesPage;
diff --git a/src/pages/dashboard/repositories/publication-targets/index.ts b/src/pages/dashboard/repositories/publication-targets/index.ts
new file mode 100644
index 000000000..50b96c735
--- /dev/null
+++ b/src/pages/dashboard/repositories/publication-targets/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublicationTargetsPage";
diff --git a/src/pages/dashboard/repositories/publications/PublicationsPage.tsx b/src/pages/dashboard/repositories/publications/PublicationsPage.tsx
new file mode 100644
index 000000000..d861a67a3
--- /dev/null
+++ b/src/pages/dashboard/repositories/publications/PublicationsPage.tsx
@@ -0,0 +1,85 @@
+import EmptyState from "@/components/layout/EmptyState";
+import LoadingState from "@/components/layout/LoadingState";
+import PageContent from "@/components/layout/PageContent";
+import PageHeader from "@/components/layout/PageHeader";
+import PageMain from "@/components/layout/PageMain";
+import { APTSourcesList, useGetAPTSources } from "@/features/apt-sources";
+import useSidePanel from "@/hooks/useSidePanel";
+import { Button } from "@canonical/react-components";
+import type { FC } from "react";
+import { lazy, Suspense } from "react";
+
+const NewAPTSourceForm = lazy(async () =>
+  import("@/features/apt-sources").then((module) => ({
+    default: module.NewAPTSourceForm,
+  })),
+);
+
+const APTSourcesPage: FC = () => {
+  const { setSidePanelContent } = useSidePanel();
+  const { aptSources: items, isGettingAPTSources: isLoading } =
+    useGetAPTSources();
+
+  const handleOpen = () => {
+    setSidePanelContent(
+      "Add APT source",
+      <Suspense fallback={<LoadingState />}>
+        <NewAPTSourceForm />
+      </Suspense>,
+    );
+  };
+
+  return (
+    <PageMain>
+      <PageHeader
+        title="APT sources"
+        actions={[
+          <Button
+            key="new-key-button"
+            appearance="positive"
+            onClick={handleOpen}
+            type="button"
+          >
+            Add APT source
+          </Button>,
+        ]}
+      />
+      <PageContent hasTable>
+        {isLoading && <LoadingState />}
+        {!isLoading && items.length === 0 && (
+          <EmptyState
+            title="No APT sources found"
+            icon="connected"
+            body={
+              <>
+                <p className="u-no-margin--bottom">
+                  You haven’t added any APT sources yet.
+                </p>
+                <a
+                  href="https://ubuntu.com/landscape/docs/repositories"
+                  target="_blank"
+                  rel="nofollow noopener noreferrer"
+                >
+                  How to manage APT sources in Landscape
+                </a>
+              </>
+            }
+            cta={[
+              <Button
+                appearance="positive"
+                key="table-add-new-mirror"
+                onClick={handleOpen}
+                type="button"
+              >
+                Add APT source
+              </Button>,
+            ]}
+          />
+        )}
+        {!isLoading && items.length > 0 && <APTSourcesList items={items} />}
+      </PageContent>
+    </PageMain>
+  );
+};
+
+export default APTSourcesPage;
diff --git a/src/pages/dashboard/repositories/publications/index.ts b/src/pages/dashboard/repositories/publications/index.ts
new file mode 100644
index 000000000..9807d653f
--- /dev/null
+++ b/src/pages/dashboard/repositories/publications/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublicationsPage";
diff --git a/src/pages/dashboard/profiles/repository-profiles/RepositoryProfilesPage/RepositoryProfilesPage.tsx b/src/pages/dashboard/repositories/repository-profiles/RepositoryProfilesPage.tsx
similarity index 100%
rename from src/pages/dashboard/profiles/repository-profiles/RepositoryProfilesPage/RepositoryProfilesPage.tsx
rename to src/pages/dashboard/repositories/repository-profiles/RepositoryProfilesPage.tsx
diff --git a/src/pages/dashboard/profiles/repository-profiles/RepositoryProfilesPage/index.ts b/src/pages/dashboard/repositories/repository-profiles/index.ts
similarity index 100%
rename from src/pages/dashboard/profiles/repository-profiles/RepositoryProfilesPage/index.ts
rename to src/pages/dashboard/repositories/repository-profiles/index.ts
diff --git a/src/routes/DashboardRoutes.tsx b/src/routes/DashboardRoutes.tsx
index c6878fed1..59e898a78 100644
--- a/src/routes/DashboardRoutes.tsx
+++ b/src/routes/DashboardRoutes.tsx
@@ -1,9 +1,12 @@
 import { Outlet, Route } from "react-router";
 import { PATHS } from "@/libs/routes";
 import { AuthGuard } from "@/components/guards/AuthGuard";
-import { SelfHostedGuard } from "@/components/guards/SelfHostedGuard";
 import { FeatureGuard } from "@/components/guards/FeatureGuard";
 import * as Pages from "@/routes/elements";
+import SecondaryNavigation from "@/templates/dashboard/SecondaryNavigation";
+import { ACCOUNT_SETTINGS } from "@/templates/dashboard/SecondaryNavigation/constants";
+import DarkModeSwitch from "@/templates/dashboard/SecondaryNavigation/components/DarkModeSwitch";
+import { REPOSITORY_SUBMENU } from "@/templates/dashboard/Navigation/constants";
 
 export const DashboardRoutes = (
   <Route
@@ -34,10 +37,6 @@ export const DashboardRoutes = (
 
       {/* --- Profiles --- */}
       <Route path={PATHS.profiles.root}>
-        <Route
-          path={PATHS.profiles.repository}
-          element={<Pages.RepositoryProfilesPage />}
-        />
         <Route
           path={PATHS.profiles.package}
           element={<Pages.PackageProfilesPage />}
@@ -75,23 +74,37 @@ export const DashboardRoutes = (
       </Route>
 
       {/* --- Repositories --- */}
-      <Route path={PATHS.repositories.root}>
+      <Route
+        path={PATHS.repositories.root}
+        element={
+          <>
+            <SecondaryNavigation
+              title="Repositories"
+              items={REPOSITORY_SUBMENU}
+            />
+            <Outlet />
+          </>
+        }
+      >
         <Route
-          path={PATHS.repositories.gpgKeys}
-          element={<Pages.GPGKeysPage />}
+          path={PATHS.repositories.mirrors}
+          element={<Pages.MirrorsPage />}
         />
         <Route
-          path={PATHS.repositories.aptSources}
-          element={<Pages.APTSourcesPage />}
+          path={PATHS.repositories.localRepositories}
+          element={<Pages.LocalRepositoriesPage />}
         />
-
         <Route
-          path={PATHS.repositories.mirrors}
-          element={
-            <SelfHostedGuard>
-              <Pages.DistributionsPage />
-            </SelfHostedGuard>
-          }
+          path={PATHS.repositories.publications}
+          element={<Pages.PublicationsPage />}
+        />
+        <Route
+          path={PATHS.repositories.publicationTargets}
+          element={<Pages.PublicationTargetsPage />}
+        />
+        <Route
+          path={PATHS.repositories.repositoryProfiles}
+          element={<Pages.RepositoryProfilesPage />}
         />
       </Route>
 
@@ -131,7 +144,20 @@ export const DashboardRoutes = (
       </Route>
 
       {/* --- Account --- */}
-      <Route path={PATHS.account.root}>
+      <Route
+        path={PATHS.account.root}
+        element={
+          <>
+            <SecondaryNavigation
+              title={ACCOUNT_SETTINGS.label}
+              items={ACCOUNT_SETTINGS.items}
+            >
+              <DarkModeSwitch />
+            </SecondaryNavigation>
+            <Outlet />
+          </>
+        }
+      >
         <Route
           path={PATHS.account.general}
           element={<Pages.GeneralSettings />}
diff --git a/src/routes/elements.tsx b/src/routes/elements.tsx
index 71fa3c1b9..48e152b26 100644
--- a/src/routes/elements.tsx
+++ b/src/routes/elements.tsx
@@ -65,18 +65,6 @@ export const InstancesPage = Loadable(
 export const SingleInstance = Loadable(
   lazy(() => import("@/pages/dashboard/instances/[single]")),
 );
-export const DistributionsPage = Loadable(
-  lazy(() => import("@/pages/dashboard/repositories/mirrors")),
-);
-export const RepositoryProfilesPage = Loadable(
-  lazy(() => import("@/pages/dashboard/profiles/repository-profiles")),
-);
-export const GPGKeysPage = Loadable(
-  lazy(() => import("@/pages/dashboard/repositories/gpg-keys")),
-);
-export const APTSourcesPage = Loadable(
-  lazy(() => import("@/pages/dashboard/repositories/apt-sources")),
-);
 export const PackageProfilesPage = Loadable(
   lazy(() => import("@/pages/dashboard/profiles/package-profiles")),
 );
@@ -95,6 +83,21 @@ export const SecurityProfilesPage = Loadable(
 export const RebootProfilesPage = Loadable(
   lazy(() => import("@/pages/dashboard/profiles/reboot-profiles")),
 );
+export const MirrorsPage = Loadable(
+  lazy(() => import("@/pages/dashboard/repositories/mirrors")),
+);
+export const LocalRepositoriesPage = Loadable(
+  lazy(() => import("@/pages/dashboard/repositories/local-repositories")),
+);
+export const PublicationsPage = Loadable(
+  lazy(() => import("@/pages/dashboard/repositories/publications")),
+);
+export const PublicationTargetsPage = Loadable(
+  lazy(() => import("@/pages/dashboard/repositories/publication-targets")),
+);
+export const RepositoryProfilesPage = Loadable(
+  lazy(() => import("@/pages/dashboard/repositories/repository-profiles")),
+);
 export const AccessGroupsPage = Loadable(
   lazy(() => import("@/pages/dashboard/settings/access-group")),
 );
diff --git a/src/templates/dashboard/DashboardTemplate.module.scss b/src/templates/dashboard/DashboardTemplate.module.scss
index f75e1eb60..7c3da587b 100644
--- a/src/templates/dashboard/DashboardTemplate.module.scss
+++ b/src/templates/dashboard/DashboardTemplate.module.scss
@@ -3,14 +3,3 @@
 .wrapper {
   display: flex;
 }
-
-.secondaryNavigation {
-  flex-shrink: 0;
-}
-
-.pageContent {
-  display: flex;
-  flex-direction: column;
-  min-width: 0;
-  width: 100%;
-}
diff --git a/src/templates/dashboard/DashboardTemplate.tsx b/src/templates/dashboard/DashboardTemplate.tsx
index 2305a7f4e..d6d6c8c2e 100644
--- a/src/templates/dashboard/DashboardTemplate.tsx
+++ b/src/templates/dashboard/DashboardTemplate.tsx
@@ -2,11 +2,8 @@ import ApplicationIdContext from "@/context/applicationId";
 import WelcomePopup from "@/features/welcome-banner";
 import classNames from "classnames";
 import { useId, type FC, type ReactNode } from "react";
-import { matchPath, useLocation } from "react-router";
-import { useMediaQuery } from "usehooks-ts";
 import SidePanelProvider from "../../context/sidePanel";
 import classes from "./DashboardTemplate.module.scss";
-import SecondaryNavigation from "./SecondaryNavigation";
 import Sidebar from "./Sidebar";
 
 interface DashboardTemplateProps {
@@ -14,9 +11,6 @@ interface DashboardTemplateProps {
 }
 
 const DashboardTemplate: FC<DashboardTemplateProps> = ({ children }) => {
-  const { pathname } = useLocation();
-  const hasSecondaryNav = matchPath("/account/*", pathname);
-  const isLargeScreen = useMediaQuery("(min-width: 620px)");
   const applicationId = useId();
 
   return (
@@ -25,17 +19,7 @@ const DashboardTemplate: FC<DashboardTemplateProps> = ({ children }) => {
         <Sidebar />
         <ApplicationIdContext value={applicationId}>
           <main className={classNames("l-main", classes.wrapper)}>
-            {hasSecondaryNav && isLargeScreen && (
-              <div
-                className={classNames(
-                  "l-navigation__drawer",
-                  classes.secondaryNavigation,
-                )}
-              >
-                <SecondaryNavigation />
-              </div>
-            )}
-            <div className={classes.pageContent}>{children}</div>
+            {children}
           </main>
         </ApplicationIdContext>
       </SidePanelProvider>
diff --git a/src/templates/dashboard/Navigation/components/NavigationExpandable/NavigationExpandable.tsx b/src/templates/dashboard/Navigation/components/NavigationExpandable/NavigationExpandable.tsx
index bc6e39683..14429a674 100644
--- a/src/templates/dashboard/Navigation/components/NavigationExpandable/NavigationExpandable.tsx
+++ b/src/templates/dashboard/Navigation/components/NavigationExpandable/NavigationExpandable.tsx
@@ -6,6 +6,9 @@ import { useLocation } from "react-router";
 import { getPathToExpand } from "@/templates/dashboard/Navigation/helpers";
 import NavigationRoute from "@/templates/dashboard/Navigation/components/NavigationRoute";
 import NavigationExpandableParent from "@/templates/dashboard/Navigation/components/NavigationExpandableParent";
+import { useMediaQuery } from "usehooks-ts";
+import classes from "../../Navigation.module.scss";
+import classNames from "classnames";
 
 interface NavigationExpandableProps {
   readonly item: MenuItem;
@@ -14,6 +17,7 @@ interface NavigationExpandableProps {
 const NavigationExpandable: FC<NavigationExpandableProps> = ({ item }) => {
   const [expanded, setExpanded] = useState("");
   const { pathname } = useLocation();
+  const isLargerScreen = useMediaQuery("(min-width: 620px)");
 
   useEffect(() => {
     const shouldBeExpandedPath = getPathToExpand(pathname);
@@ -23,6 +27,18 @@ const NavigationExpandable: FC<NavigationExpandableProps> = ({ item }) => {
     }
   }, [pathname]);
 
+  if (isLargerScreen && item.secondary) {
+    return (
+      <NavigationRoute
+        item={item}
+        className={classNames(
+          classes.accordionButton,
+          "p-side-navigation__link",
+        )}
+      />
+    );
+  }
+
   return (
     <>
       <NavigationExpandableParent
diff --git a/src/templates/dashboard/Navigation/components/NavigationRoute/NavigationRoute.tsx b/src/templates/dashboard/Navigation/components/NavigationRoute/NavigationRoute.tsx
index 89fa89883..febdb1935 100644
--- a/src/templates/dashboard/Navigation/components/NavigationRoute/NavigationRoute.tsx
+++ b/src/templates/dashboard/Navigation/components/NavigationRoute/NavigationRoute.tsx
@@ -8,12 +8,17 @@ import { Badge } from "@canonical/react-components";
 interface NavigationRouteProps {
   readonly item: MenuItem;
   readonly current?: boolean;
+  readonly className?: string;
 }
 
-const NavigationRoute: FC<NavigationRouteProps> = ({ item, current }) => {
+const NavigationRoute: FC<NavigationRouteProps> = ({
+  item,
+  current,
+  className,
+}) => {
   return (
     <Link
-      className={classNames("p-side-navigation__link", classes.link)}
+      className={classNames("p-side-navigation__link", classes.link, className)}
       to={item.path}
       aria-current={current ? "page" : undefined}
     >
diff --git a/src/templates/dashboard/Navigation/constants.ts b/src/templates/dashboard/Navigation/constants.ts
index 7a827e3c7..189804f96 100644
--- a/src/templates/dashboard/Navigation/constants.ts
+++ b/src/templates/dashboard/Navigation/constants.ts
@@ -2,7 +2,6 @@ import { ROUTES } from "@/libs/routes";
 import type { MenuItem } from "./types";
 
 const PROFILES_SUBMENU: MenuItem[] = [
-  { label: "Repository profiles", path: ROUTES.profiles.repository() },
   { label: "Package profiles", path: ROUTES.profiles.package() },
   { label: "Upgrade profiles", path: ROUTES.profiles.upgrade() },
   { label: "Reboot profiles", path: ROUTES.profiles.reboot() },
@@ -19,10 +18,21 @@ const PROFILES_SUBMENU: MenuItem[] = [
   },
 ];
 
-const REPOSITORY_SUBMENU: MenuItem[] = [
-  { label: "Mirrors", path: ROUTES.repositories.mirrors(), env: "selfHosted" },
-  { label: "GPG Keys", path: ROUTES.repositories.gpgKeys() },
-  { label: "APT Sources", path: ROUTES.repositories.aptSources() },
+export const REPOSITORY_SUBMENU: MenuItem[] = [
+  { label: "Mirrors", path: ROUTES.repositories.mirrors() },
+  {
+    label: "Local repositories",
+    path: ROUTES.repositories.localRepositories(),
+  },
+  { label: "Publications", path: ROUTES.repositories.publications() },
+  {
+    label: "Publication targets",
+    path: ROUTES.repositories.publicationTargets(),
+  },
+  {
+    label: "Repository profiles",
+    path: ROUTES.repositories.repositoryProfiles(),
+  },
 ];
 
 const SETTINGS_SUBMENU: MenuItem[] = [
@@ -64,9 +74,10 @@ export const MENU_ITEMS: MenuItem[] = [
   },
   {
     label: "Repositories",
-    path: ROUTES.repositories.root(),
+    path: ROUTES.repositories.mirrors(),
     icon: "fork",
     items: REPOSITORY_SUBMENU,
+    secondary: true,
   },
   {
     label: "Org. settings",
diff --git a/src/templates/dashboard/Navigation/types.d.ts b/src/templates/dashboard/Navigation/types.d.ts
index 66d18c745..501fe5a5e 100644
--- a/src/templates/dashboard/Navigation/types.d.ts
+++ b/src/templates/dashboard/Navigation/types.d.ts
@@ -14,4 +14,5 @@ export interface MenuItem {
     count: number;
     isNegative: boolean;
   };
+  secondary?: boolean;
 }
diff --git a/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.module.scss b/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.module.scss
index 9f13a3140..cb5eda2ca 100644
--- a/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.module.scss
+++ b/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.module.scss
@@ -3,6 +3,10 @@
 @import "vanilla-framework/scss/settings_breakpoints";
 @import "vanilla-framework/scss/layouts_application";
 
+.secondaryNavigationDrawer {
+  flex-shrink: 0;
+}
+
 .secondaryNavigation {
   background-color: $colors--theme--background-alt !important;
   display: flex;
diff --git a/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.tsx b/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.tsx
index d8ae3ca23..32c997b15 100644
--- a/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.tsx
+++ b/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.tsx
@@ -1,62 +1,84 @@
-import DarkModeSwitch from "@/templates/dashboard/SecondaryNavigation/components/DarkModeSwitch";
 import classNames from "classnames";
 import { Link, matchPath, useLocation } from "react-router";
 import classes from "./SecondaryNavigation.module.scss";
-import { ACCOUNT_SETTINGS } from "./constants";
+import { useMediaQuery } from "usehooks-ts";
+import type { FC, ReactNode } from "react";
+import type { MenuItem } from "../Navigation/types";
 
-export const SecondaryNavigation = () => {
+interface SecondaryNavigationProps {
+  readonly title: ReactNode;
+  readonly items: MenuItem[];
+  readonly children?: ReactNode;
+}
+
+export const SecondaryNavigation: FC<SecondaryNavigationProps> = ({
+  title,
+  items,
+  children,
+}) => {
   const location = useLocation();
 
+  const isLargeScreen = useMediaQuery("(min-width: 620px)");
+
+  if (!isLargeScreen) {
+    return null;
+  }
+
   return (
     <div
       className={classNames(
-        "p-side-navigation p-panel is-dark",
-        classes.secondaryNavigation,
+        "l-navigation__drawer",
+        classes.secondaryNavigationDrawer,
       )}
     >
-      <nav
+      <div
         className={classNames(
-          "u-padding-top--medium is-dark",
-          classes.secondaryNavigation__drawer,
+          "p-side-navigation p-panel is-dark",
+          classes.secondaryNavigation,
         )}
-        aria-labelledby="secondary-navigation-title"
       >
-        <h2
+        <nav
           className={classNames(
-            "p-heading--4 p-panel__logo-name is-dark u-no-padding--top",
-            classes.secondaryNavigation__title,
+            "u-padding-top--medium is-dark",
+            classes.secondaryNavigation__drawer,
           )}
-          id="secondary-navigation-title"
+          aria-labelledby="secondary-navigation-title"
         >
-          {ACCOUNT_SETTINGS.label}
-        </h2>
-        <ul className="p-side-navigation__list">
-          {ACCOUNT_SETTINGS.items?.map((item) => {
-            const isActive = matchPath(item.path, location.pathname);
-            return (
-              <li key={item.path}>
-                <Link
-                  aria-current={isActive ? "page" : undefined}
-                  className={classNames(
-                    "p-side-navigation__link",
-                    classes.secondaryNavigation__link,
-                    {
-                      [classes.isActive]: isActive,
-                    },
-                  )}
-                  to={item.path}
-                >
-                  <span className={classes.secondaryNavigation__label}>
-                    {item.label}
-                  </span>
-                </Link>
-              </li>
-            );
-          })}
-        </ul>
-      </nav>
-      <div className={classes.footer}>
-        <DarkModeSwitch />
+          <h2
+            className={classNames(
+              "p-heading--4 p-panel__logo-name is-dark u-no-padding--top",
+              classes.secondaryNavigation__title,
+            )}
+            id="secondary-navigation-title"
+          >
+            {title}
+          </h2>
+          <ul className="p-side-navigation__list">
+            {items.map((item) => {
+              const isActive = matchPath(item.path, location.pathname);
+              return (
+                <li key={item.path}>
+                  <Link
+                    aria-current={isActive ? "page" : undefined}
+                    className={classNames(
+                      "p-side-navigation__link",
+                      classes.secondaryNavigation__link,
+                      {
+                        [classes.isActive]: isActive,
+                      },
+                    )}
+                    to={item.path}
+                  >
+                    <span className={classes.secondaryNavigation__label}>
+                      {item.label}
+                    </span>
+                  </Link>
+                </li>
+              );
+            })}
+          </ul>
+        </nav>
+        {children && <div className={classes.footer}>{children}</div>}
       </div>
     </div>
   );

From 0e59c97fbe99a9b55a4c8e2eb704235569003cd8 Mon Sep 17 00:00:00 2001
From: Marc Bucchieri <marc.bucchieri@canonical.com>
Date: Tue, 21 Apr 2026 10:45:06 -0700
Subject: [PATCH 02/42] Finish rebase from main; Add self-hosted check to
 debarchive pages

---
 src/routes/DashboardRoutes.test.tsx           | 93 +++++++++++++++++++
 src/routes/DashboardRoutes.tsx                | 35 +++++--
 .../dashboard/Navigation/constants.ts         |  7 +-
 .../SecondaryNavigation.test.tsx              | 26 +++++-
 4 files changed, 148 insertions(+), 13 deletions(-)
 create mode 100644 src/routes/DashboardRoutes.test.tsx

diff --git a/src/routes/DashboardRoutes.test.tsx b/src/routes/DashboardRoutes.test.tsx
new file mode 100644
index 000000000..80fc52efe
--- /dev/null
+++ b/src/routes/DashboardRoutes.test.tsx
@@ -0,0 +1,93 @@
+import {
+  Children,
+  isValidElement,
+  type ReactElement,
+  type ReactNode,
+} from "react";
+import { Outlet } from "react-router";
+import { describe, expect, it } from "vitest";
+import { AuthGuard } from "@/components/guards/AuthGuard";
+import { FeatureGuard } from "@/components/guards/FeatureGuard";
+import { SelfHostedGuard } from "@/components/guards/SelfHostedGuard";
+import { PATHS } from "@/libs/routes";
+import { DashboardRoutes } from "./DashboardRoutes";
+
+interface RouteLikeProps {
+  children?: ReactNode;
+  element?: ReactElement;
+  path?: string;
+}
+
+const isRouteElement = (
+  value: unknown,
+): value is ReactElement<RouteLikeProps> =>
+  isValidElement<RouteLikeProps>(value);
+
+const getRouteChildren = (element: ReactElement<RouteLikeProps>) => {
+  return Children.toArray(element.props.children).filter(isRouteElement);
+};
+
+const flattenRoutes = (
+  routeElement: ReactElement<RouteLikeProps>,
+): ReactElement<RouteLikeProps>[] => {
+  const directChildren = getRouteChildren(routeElement);
+  return directChildren.flatMap((child) => [child, ...flattenRoutes(child)]);
+};
+
+describe("DashboardRoutes", () => {
+  it("wraps dashboard routes with auth guard and outlet", () => {
+    const wrapper = (DashboardRoutes as ReactElement<RouteLikeProps>).props
+      .element;
+    assert(wrapper);
+    const guardWrapper = wrapper as ReactElement<{ children: ReactElement }>;
+    expect(guardWrapper.type).toBe(AuthGuard);
+
+    const wrappedChild = guardWrapper.props.children;
+    expect(wrappedChild.type).toBe(Outlet);
+  });
+
+  it("includes key dashboard route paths", () => {
+    const allRoutes = flattenRoutes(
+      DashboardRoutes as ReactElement<RouteLikeProps>,
+    );
+    const paths = allRoutes.map((route) => route.props.path).filter(Boolean);
+
+    expect(paths).toContain(PATHS.root.root);
+    expect(paths).toContain(PATHS.overview.root);
+    expect(paths).toContain(PATHS.instances.root);
+    expect(paths).toContain(PATHS.instances.single);
+    expect(paths).toContain(PATHS.account.apiCredentials);
+    expect(paths).toContain(PATHS.repositories.mirrors);
+    expect(paths).toContain(PATHS.settings.employees);
+  });
+
+  it("uses self-hosted and feature guards for guarded paths", () => {
+    const allRoutes = flattenRoutes(
+      DashboardRoutes as ReactElement<RouteLikeProps>,
+    );
+
+    const mirrorsRoute = allRoutes.find(
+      (route) => route.props.path === PATHS.repositories.mirrors,
+    );
+    const employeesRoute = allRoutes.find(
+      (route) => route.props.path === PATHS.settings.employees,
+    );
+    const identityProvidersRoute = allRoutes.find(
+      (route) => route.props.path === PATHS.settings.identityProviders,
+    );
+
+    const wslProfilesRoute = allRoutes.find(
+      (route) => route.props.path === PATHS.profiles.wsl,
+    );
+
+    assert(mirrorsRoute?.props.element);
+    assert(employeesRoute?.props.element);
+    assert(identityProvidersRoute?.props.element);
+    assert(wslProfilesRoute?.props.element);
+
+    expect(mirrorsRoute.props.element.type).toBe(SelfHostedGuard);
+    expect(employeesRoute.props.element.type).toBe(FeatureGuard);
+    expect(identityProvidersRoute.props.element.type).toBe(FeatureGuard);
+    expect(wslProfilesRoute.props.element.type).toBe(FeatureGuard);
+  });
+});
diff --git a/src/routes/DashboardRoutes.tsx b/src/routes/DashboardRoutes.tsx
index 59e898a78..0c61a7648 100644
--- a/src/routes/DashboardRoutes.tsx
+++ b/src/routes/DashboardRoutes.tsx
@@ -7,6 +7,7 @@ import SecondaryNavigation from "@/templates/dashboard/SecondaryNavigation";
 import { ACCOUNT_SETTINGS } from "@/templates/dashboard/SecondaryNavigation/constants";
 import DarkModeSwitch from "@/templates/dashboard/SecondaryNavigation/components/DarkModeSwitch";
 import { REPOSITORY_SUBMENU } from "@/templates/dashboard/Navigation/constants";
+import { SelfHostedGuard } from "@/components/guards/SelfHostedGuard";
 
 export const DashboardRoutes = (
   <Route
@@ -77,34 +78,54 @@ export const DashboardRoutes = (
       <Route
         path={PATHS.repositories.root}
         element={
-          <>
+          <SelfHostedGuard>
             <SecondaryNavigation
               title="Repositories"
               items={REPOSITORY_SUBMENU}
             />
             <Outlet />
-          </>
+          </SelfHostedGuard>
         }
       >
         <Route
           path={PATHS.repositories.mirrors}
-          element={<Pages.MirrorsPage />}
+          element={
+          <SelfHostedGuard>
+            <Pages.MirrorsPage />
+          </SelfHostedGuard>
+        }
         />
         <Route
           path={PATHS.repositories.localRepositories}
-          element={<Pages.LocalRepositoriesPage />}
+          element={
+            <SelfHostedGuard>
+              <Pages.LocalRepositoriesPage />
+            </SelfHostedGuard>
+          }
         />
         <Route
           path={PATHS.repositories.publications}
-          element={<Pages.PublicationsPage />}
+          element={
+            <SelfHostedGuard>
+              <Pages.PublicationsPage />
+            </SelfHostedGuard>
+          }
         />
         <Route
           path={PATHS.repositories.publicationTargets}
-          element={<Pages.PublicationTargetsPage />}
+          element={
+            <SelfHostedGuard>
+              <Pages.PublicationTargetsPage />
+            </SelfHostedGuard>
+          }
         />
         <Route
           path={PATHS.repositories.repositoryProfiles}
-          element={<Pages.RepositoryProfilesPage />}
+          element={
+            <SelfHostedGuard>
+              <Pages.RepositoryProfilesPage />
+            </SelfHostedGuard>
+          }     
         />
       </Route>
 
diff --git a/src/templates/dashboard/Navigation/constants.ts b/src/templates/dashboard/Navigation/constants.ts
index 189804f96..3ae116d87 100644
--- a/src/templates/dashboard/Navigation/constants.ts
+++ b/src/templates/dashboard/Navigation/constants.ts
@@ -19,19 +19,21 @@ const PROFILES_SUBMENU: MenuItem[] = [
 ];
 
 export const REPOSITORY_SUBMENU: MenuItem[] = [
-  { label: "Mirrors", path: ROUTES.repositories.mirrors() },
+  { label: "Mirrors", path: ROUTES.repositories.mirrors(), env: "selfHosted" },
   {
     label: "Local repositories",
     path: ROUTES.repositories.localRepositories(),
   },
-  { label: "Publications", path: ROUTES.repositories.publications() },
+  { label: "Publications", path: ROUTES.repositories.publications(), env: "selfHosted" },
   {
     label: "Publication targets",
     path: ROUTES.repositories.publicationTargets(),
+    env: "selfHosted"
   },
   {
     label: "Repository profiles",
     path: ROUTES.repositories.repositoryProfiles(),
+    env: "selfHosted"
   },
 ];
 
@@ -78,6 +80,7 @@ export const MENU_ITEMS: MenuItem[] = [
     icon: "fork",
     items: REPOSITORY_SUBMENU,
     secondary: true,
+    env: "selfHosted"
   },
   {
     label: "Org. settings",
diff --git a/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.test.tsx b/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.test.tsx
index e08d6667d..e126e3b2f 100644
--- a/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.test.tsx
+++ b/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.test.tsx
@@ -1,12 +1,25 @@
 import { renderWithProviders } from "@/tests/render";
 import { screen } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
 import SecondaryNavigation from "./SecondaryNavigation";
 import { ACCOUNT_SETTINGS } from "./constants";
 import { PATHS, ROUTES } from "@/libs/routes";
 
+// Mock useMediaQuery to simulate large screen
+vi.mock("usehooks-ts", async () => {
+  const actual = await vi.importActual("usehooks-ts");
+  return {
+    ...actual,
+    useMediaQuery: vi.fn(() => true), // Always return true for large screen
+  };
+});
+
 describe("SecondaryNavigation", () => {
   it("renders correctly", () => {
-    renderWithProviders(<SecondaryNavigation />);
+    renderWithProviders(<SecondaryNavigation
+                          title={ACCOUNT_SETTINGS.label}
+                          items={ACCOUNT_SETTINGS.items}
+                        />);
 
     expect(
       screen.getByRole("heading", { name: ACCOUNT_SETTINGS.label }),
@@ -22,7 +35,10 @@ describe("SecondaryNavigation", () => {
     assert(ACCOUNT_SETTINGS.items);
 
     renderWithProviders(
-      <SecondaryNavigation />,
+      <SecondaryNavigation
+        title={ACCOUNT_SETTINGS.label}
+        items={ACCOUNT_SETTINGS.items}
+      />,
       {},
       ROUTES.account.general(),
       `/${PATHS.account.root}/${PATHS.account.general}`,
@@ -31,10 +47,12 @@ describe("SecondaryNavigation", () => {
     const activeLink = screen.getByRole("link", {
       name: ACCOUNT_SETTINGS.items[0].label,
     });
-    expect(activeLink.className).toContain("isActive");
+    // CSS Module class names are hashed (e.g., "SecondaryNavigation_isActive__abc123")
+    // Use regex to match the generated class containing "isActive"
+    expect(activeLink.className).toMatch(/isActive/);
 
     expect(
       screen.getByRole("link", { name: ACCOUNT_SETTINGS.items[1].label }),
-    ).not.toHaveClass("isActive");
+    ).not.toHaveClass(/isActive/);
   });
 });

From f30ab4d3efab6f44e90f8f67c2ceee7df18bff43 Mon Sep 17 00:00:00 2001
From: Ethan Shaw <ethan.shaw@canonical.com>
Date: Fri, 27 Mar 2026 12:09:50 -0700
Subject: [PATCH 03/42] Update dependencies (#529)

---
 package.json   |  18 +-
 pnpm-lock.yaml | 873 ++++++++++++++++++++++++-------------------------
 2 files changed, 445 insertions(+), 446 deletions(-)

diff --git a/package.json b/package.json
index bc091d5c2..91c36ded0 100644
--- a/package.json
+++ b/package.json
@@ -24,10 +24,10 @@
     "tcm:watch": "pnpm tcm:run --watch"
   },
   "dependencies": {
-    "@canonical/react-components": "4.0.0",
+    "@canonical/react-components": "4.0.1",
     "@monaco-editor/react": "4.7.0",
-    "@sentry/react": "10.45.0",
-    "@tanstack/react-query": "5.91.2",
+    "@sentry/react": "10.46.0",
+    "@tanstack/react-query": "5.95.2",
     "axios": "1.13.6",
     "buffer": "6.0.3",
     "chart.js": "4.5.1",
@@ -36,11 +36,11 @@
     "formik": "2.4.9",
     "moment": "2.30.1",
     "monaco-editor": "0.55.1",
-    "path-to-regexp": "8.3.0",
+    "path-to-regexp": "8.4.0",
     "react": "19.2.4",
     "react-chartjs-2": "5.3.1",
     "react-dom": "19.2.4",
-    "react-router": "7.13.1",
+    "react-router": "7.13.2",
     "usehooks-ts": "3.1.1",
     "vanilla-framework": "4.46.0",
     "yup": "1.7.1"
@@ -63,18 +63,18 @@
     "eslint-plugin-react": "7.37.5",
     "eslint-plugin-react-hooks": "7.0.1",
     "globals": "17.4.0",
-    "jsdom": "29.0.0",
+    "jsdom": "29.0.1",
     "msw": "2.4.11",
     "prettier": "3.8.1",
     "sass": "1.98.0",
     "sass-embedded": "1.98.0",
-    "stylelint": "17.5.0",
+    "stylelint": "17.6.0",
     "stylelint-config-standard-scss": "17.0.0",
     "stylelint-order": "8.1.1",
     "typed-css-modules": "0.9.1",
     "typescript": "5.9.3",
-    "typescript-eslint": "8.57.1",
-    "vite": "8.0.1",
+    "typescript-eslint": "8.57.2",
+    "vite": "8.0.3",
     "vitest": "4.0.18"
   }
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index ddd7d218e..086fb98bd 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -9,17 +9,17 @@ importers:
   .:
     dependencies:
       '@canonical/react-components':
-        specifier: 4.0.0
-        version: 4.0.0(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(formik@2.4.9(@types/react@19.2.14)(react@19.2.4))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(vanilla-framework@4.46.0(sass@1.98.0))
+        specifier: 4.0.1
+        version: 4.0.1(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(formik@2.4.9(@types/react@19.2.14)(react@19.2.4))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(vanilla-framework@4.46.0(sass@1.98.0))
       '@monaco-editor/react':
         specifier: 4.7.0
         version: 4.7.0(monaco-editor@0.55.1)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
       '@sentry/react':
-        specifier: 10.45.0
-        version: 10.45.0(react@19.2.4)
+        specifier: 10.46.0
+        version: 10.46.0(react@19.2.4)
       '@tanstack/react-query':
-        specifier: 5.91.2
-        version: 5.91.2(react@19.2.4)
+        specifier: 5.95.2
+        version: 5.95.2(react@19.2.4)
       axios:
         specifier: 1.13.6
         version: 1.13.6
@@ -45,8 +45,8 @@ importers:
         specifier: 0.55.1
         version: 0.55.1
       path-to-regexp:
-        specifier: 8.3.0
-        version: 8.3.0
+        specifier: 8.4.0
+        version: 8.4.0
       react:
         specifier: 19.2.4
         version: 19.2.4
@@ -57,8 +57,8 @@ importers:
         specifier: 19.2.4
         version: 19.2.4(react@19.2.4)
       react-router:
-        specifier: 7.13.1
-        version: 7.13.1(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
+        specifier: 7.13.2
+        version: 7.13.2(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
       usehooks-ts:
         specifier: 3.1.1
         version: 3.1.1(react@19.2.4)
@@ -101,10 +101,10 @@ importers:
         version: 7.7.20
       '@vitejs/plugin-react':
         specifier: 6.0.1
-        version: 6.0.1(vite@8.0.1(@types/node@24.12.0)(esbuild@0.27.4)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1))
+        version: 6.0.1(vite@8.0.3(@types/node@24.12.0)(esbuild@0.27.4)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1))
       '@vitest/coverage-v8':
         specifier: 4.0.18
-        version: 4.0.18(vitest@4.0.18(@types/node@24.12.0)(jsdom@29.0.0)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1))
+        version: 4.0.18(vitest@4.0.18(@types/node@24.12.0)(jsdom@29.0.1)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1))
       eslint:
         specifier: 9.39.4
         version: 9.39.4
@@ -121,8 +121,8 @@ importers:
         specifier: 17.4.0
         version: 17.4.0
       jsdom:
-        specifier: 29.0.0
-        version: 29.0.0
+        specifier: 29.0.1
+        version: 29.0.1
       msw:
         specifier: 2.4.11
         version: 2.4.11(typescript@5.9.3)
@@ -136,14 +136,14 @@ importers:
         specifier: 1.98.0
         version: 1.98.0
       stylelint:
-        specifier: 17.5.0
-        version: 17.5.0(typescript@5.9.3)
+        specifier: 17.6.0
+        version: 17.6.0(typescript@5.9.3)
       stylelint-config-standard-scss:
         specifier: 17.0.0
-        version: 17.0.0(postcss@8.5.8)(stylelint@17.5.0(typescript@5.9.3))
+        version: 17.0.0(postcss@8.5.8)(stylelint@17.6.0(typescript@5.9.3))
       stylelint-order:
         specifier: 8.1.1
-        version: 8.1.1(stylelint@17.5.0(typescript@5.9.3))
+        version: 8.1.1(stylelint@17.6.0(typescript@5.9.3))
       typed-css-modules:
         specifier: 0.9.1
         version: 0.9.1
@@ -151,14 +151,14 @@ importers:
         specifier: 5.9.3
         version: 5.9.3
       typescript-eslint:
-        specifier: 8.57.1
-        version: 8.57.1(eslint@9.39.4)(typescript@5.9.3)
+        specifier: 8.57.2
+        version: 8.57.2(eslint@9.39.4)(typescript@5.9.3)
       vite:
-        specifier: 8.0.1
-        version: 8.0.1(@types/node@24.12.0)(esbuild@0.27.4)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1)
+        specifier: 8.0.3
+        version: 8.0.3(@types/node@24.12.0)(esbuild@0.27.4)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1)
       vitest:
         specifier: 4.0.18
-        version: 4.0.18(@types/node@24.12.0)(jsdom@29.0.0)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1)
+        version: 4.0.18(@types/node@24.12.0)(jsdom@29.0.1)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1)
 
 packages:
 
@@ -172,8 +172,8 @@ packages:
     resolution: {integrity: sha512-2SZFvqMyvboVV1d15lMf7XiI3m7SDqXUuKaTymJYLN6dSGadqp+fVojqJlVoMlbZnlTmu3S0TLwLTJpvBMO1Aw==}
     engines: {node: ^20.19.0 || ^22.12.0 || >=24.0.0}
 
-  '@asamuzakjp/dom-selector@7.0.3':
-    resolution: {integrity: sha512-Q6mU0Z6bfj6YvnX2k9n0JxiIwrCFN59x/nWmYQnAqP000ruX/yV+5bp/GRcF5T8ncvfwJQ7fgfP74DlpKExILA==}
+  '@asamuzakjp/dom-selector@7.0.4':
+    resolution: {integrity: sha512-jXR6x4AcT3eIrS2fSNAwJpwirOkGcd+E7F7CP3zjdTqz9B/2huHOL8YJZBgekKwLML+u7qB/6P1LXQuMScsx0w==}
     engines: {node: ^20.19.0 || ^22.12.0 || >=24.0.0}
 
   '@asamuzakjp/nwsapi@2.3.9':
@@ -273,11 +273,11 @@ packages:
   '@cacheable/memory@2.0.8':
     resolution: {integrity: sha512-FvEb29x5wVwu/Kf93IWwsOOEuhHh6dYCJF3vcKLzXc0KXIW181AOzv6ceT4ZpBHDvAfG60eqb+ekmrnLHIy+jw==}
 
-  '@cacheable/utils@2.4.0':
-    resolution: {integrity: sha512-PeMMsqjVq+bF0WBsxFBxr/WozBJiZKY0rUojuaCoIaKnEl3Ju1wfEwS+SV1DU/cSe8fqHIPiYJFif8T3MVt4cQ==}
+  '@cacheable/utils@2.4.1':
+    resolution: {integrity: sha512-eiFgzCbIneyMlLOmNG4g9xzF7Hv3Mga4LjxjcSC/ues6VYq2+gUbQI8JqNuw/ZM8tJIeIaBGpswAsqV2V7ApgA==}
 
-  '@canonical/react-components@4.0.0':
-    resolution: {integrity: sha512-gcBSNW6M7dcKJhfGBn2Bw0jZj0BNYcKWNK12utmmWtzXmzkulgMHywTAd5ZXdI3TCYKxY1zyw5BZNQeYO+TsFA==}
+  '@canonical/react-components@4.0.1':
+    resolution: {integrity: sha512-lfD/SoSZQVgttKi4isgkSraowyQNxAodnSWk/Ksmv8A1gO9Oz3dRcPdKnMDfGx3ih8Lb1n+gBZFcDgq+dbmY2g==}
     peerDependencies:
       '@types/react': ^18.0.0 || ^19.0.0
       '@types/react-dom': ^18.0.0 || ^19.0.0
@@ -389,8 +389,8 @@ packages:
     peerDependencies:
       '@csstools/css-tokenizer': ^4.0.0
 
-  '@csstools/css-syntax-patches-for-csstree@1.1.1':
-    resolution: {integrity: sha512-BvqN0AMWNAnLk9G8jnUT77D+mUbY/H2b3uDTvg2isJkHaOufUE2R3AOwxWo7VBQKT1lOdwdvorddo2B/lk64+w==}
+  '@csstools/css-syntax-patches-for-csstree@1.1.2':
+    resolution: {integrity: sha512-5GkLzz4prTIpoyeUiIu3iV6CSG3Plo7xRVOFPKI7FVEJ3mZ0A8SwK0XU3Gl7xAkiQ+mDyam+NNp875/C5y+jSA==}
     peerDependencies:
       css-tree: ^3.2.1
     peerDependenciesMeta:
@@ -803,8 +803,8 @@ packages:
   '@open-draft/until@2.1.0':
     resolution: {integrity: sha512-U69T3ItWHvLwGg5eJ0n3I62nWuE6ilHlmz7zM0npLBRvPRd7e6NYmg54vvRtP5mZG7kZqZCFVdsTWo7BPtBujg==}
 
-  '@oxc-project/types@0.120.0':
-    resolution: {integrity: sha512-k1YNu55DuvAip/MGE1FTsIuU3FUCn6v/ujG9V7Nq5Df/kX2CWb13hhwD0lmJGMGqE+bE1MXvv9SZVnMzEXlWcg==}
+  '@oxc-project/types@0.122.0':
+    resolution: {integrity: sha512-oLAl5kBpV4w69UtFZ9xqcmTi+GENWOcPF7FCrczTiBbmC0ibXxCwyvZGbO39rCVEuLGAZM84DH0pUIyyv/YJzA==}
 
   '@parcel/watcher-android-arm64@2.5.6':
     resolution: {integrity: sha512-YQxSS34tPF/6ZG7r/Ih9xy+kP/WwediEUsqmtf0cuCV5TPPKw/PQHRhueUo6JdeFJaqV3pyjm0GdYjZotbRt/A==}
@@ -903,271 +903,271 @@ packages:
     engines: {node: '>=18'}
     hasBin: true
 
-  '@rolldown/binding-android-arm64@1.0.0-rc.10':
-    resolution: {integrity: sha512-jOHxwXhxmFKuXztiu1ORieJeTbx5vrTkcOkkkn2d35726+iwhrY1w/+nYY/AGgF12thg33qC3R1LMBF5tHTZHg==}
+  '@rolldown/binding-android-arm64@1.0.0-rc.12':
+    resolution: {integrity: sha512-pv1y2Fv0JybcykuiiD3qBOBdz6RteYojRFY1d+b95WVuzx211CRh+ytI/+9iVyWQ6koTh5dawe4S/yRfOFjgaA==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [arm64]
     os: [android]
 
-  '@rolldown/binding-darwin-arm64@1.0.0-rc.10':
-    resolution: {integrity: sha512-gED05Teg/vtTZbIJBc4VNMAxAFDUPkuO/rAIyyxZjTj1a1/s6z5TII/5yMGZ0uLRCifEtwUQn8OlYzuYc0m70w==}
+  '@rolldown/binding-darwin-arm64@1.0.0-rc.12':
+    resolution: {integrity: sha512-cFYr6zTG/3PXXF3pUO+umXxt1wkRK/0AYT8lDwuqvRC+LuKYWSAQAQZjCWDQpAH172ZV6ieYrNnFzVVcnSflAg==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [arm64]
     os: [darwin]
 
-  '@rolldown/binding-darwin-x64@1.0.0-rc.10':
-    resolution: {integrity: sha512-rI15NcM1mA48lqrIxVkHfAqcyFLcQwyXWThy+BQ5+mkKKPvSO26ir+ZDp36AgYoYVkqvMcdS8zOE6SeBsR9e8A==}
+  '@rolldown/binding-darwin-x64@1.0.0-rc.12':
+    resolution: {integrity: sha512-ZCsYknnHzeXYps0lGBz8JrF37GpE9bFVefrlmDrAQhOEi4IOIlcoU1+FwHEtyXGx2VkYAvhu7dyBf75EJQffBw==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [x64]
     os: [darwin]
 
-  '@rolldown/binding-freebsd-x64@1.0.0-rc.10':
-    resolution: {integrity: sha512-XZRXHdTa+4ME1MuDVp021+doQ+z6Ei4CCFmNc5/sKbqb8YmkiJdj8QKlV3rCI0AJtAeSB5n0WGPuJWNL9p/L2w==}
+  '@rolldown/binding-freebsd-x64@1.0.0-rc.12':
+    resolution: {integrity: sha512-dMLeprcVsyJsKolRXyoTH3NL6qtsT0Y2xeuEA8WQJquWFXkEC4bcu1rLZZSnZRMtAqwtrF/Ib9Ddtpa/Gkge9Q==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [x64]
     os: [freebsd]
 
-  '@rolldown/binding-linux-arm-gnueabihf@1.0.0-rc.10':
-    resolution: {integrity: sha512-R0SQMRluISSLzFE20sPWYHVmJdDQnRyc/FzSCN72BqQmh2SOZUFG+N3/vBZpR4C6WpEUVYJLrYUXaj43sJsNLA==}
+  '@rolldown/binding-linux-arm-gnueabihf@1.0.0-rc.12':
+    resolution: {integrity: sha512-YqWjAgGC/9M1lz3GR1r1rP79nMgo3mQiiA+Hfo+pvKFK1fAJ1bCi0ZQVh8noOqNacuY1qIcfyVfP6HoyBRZ85Q==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [arm]
     os: [linux]
 
-  '@rolldown/binding-linux-arm64-gnu@1.0.0-rc.10':
-    resolution: {integrity: sha512-Y1reMrV/o+cwpduYhJuOE3OMKx32RMYCidf14y+HssARRmhDuWXJ4yVguDg2R/8SyyGNo+auzz64LnPK9Hq6jg==}
+  '@rolldown/binding-linux-arm64-gnu@1.0.0-rc.12':
+    resolution: {integrity: sha512-/I5AS4cIroLpslsmzXfwbe5OmWvSsrFuEw3mwvbQ1kDxJ822hFHIx+vsN/TAzNVyepI/j/GSzrtCIwQPeKCLIg==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [arm64]
     os: [linux]
     libc: [glibc]
 
-  '@rolldown/binding-linux-arm64-musl@1.0.0-rc.10':
-    resolution: {integrity: sha512-vELN+HNb2IzuzSBUOD4NHmP9yrGwl1DVM29wlQvx1OLSclL0NgVWnVDKl/8tEks79EFek/kebQKnNJkIAA4W2g==}
+  '@rolldown/binding-linux-arm64-musl@1.0.0-rc.12':
+    resolution: {integrity: sha512-V6/wZztnBqlx5hJQqNWwFdxIKN0m38p8Jas+VoSfgH54HSj9tKTt1dZvG6JRHcjh6D7TvrJPWFGaY9UBVOaWPw==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [arm64]
     os: [linux]
     libc: [musl]
 
-  '@rolldown/binding-linux-ppc64-gnu@1.0.0-rc.10':
-    resolution: {integrity: sha512-ZqrufYTgzxbHwpqOjzSsb0UV/aV2TFIY5rP8HdsiPTv/CuAgCRjM6s9cYFwQ4CNH+hf9Y4erHW1GjZuZ7WoI7w==}
+  '@rolldown/binding-linux-ppc64-gnu@1.0.0-rc.12':
+    resolution: {integrity: sha512-AP3E9BpcUYliZCxa3w5Kwj9OtEVDYK6sVoUzy4vTOJsjPOgdaJZKFmN4oOlX0Wp0RPV2ETfmIra9x1xuayFB7g==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [ppc64]
     os: [linux]
     libc: [glibc]
 
-  '@rolldown/binding-linux-s390x-gnu@1.0.0-rc.10':
-    resolution: {integrity: sha512-gSlmVS1FZJSRicA6IyjoRoKAFK7IIHBs7xJuHRSmjImqk3mPPWbR7RhbnfH2G6bcmMEllCt2vQ/7u9e6bBnByg==}
+  '@rolldown/binding-linux-s390x-gnu@1.0.0-rc.12':
+    resolution: {integrity: sha512-nWwpvUSPkoFmZo0kQazZYOrT7J5DGOJ/+QHHzjvNlooDZED8oH82Yg67HvehPPLAg5fUff7TfWFHQS8IV1n3og==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [s390x]
     os: [linux]
     libc: [glibc]
 
-  '@rolldown/binding-linux-x64-gnu@1.0.0-rc.10':
-    resolution: {integrity: sha512-eOCKUpluKgfObT2pHjztnaWEIbUabWzk3qPZ5PuacuPmr4+JtQG4k2vGTY0H15edaTnicgU428XW/IH6AimcQw==}
+  '@rolldown/binding-linux-x64-gnu@1.0.0-rc.12':
+    resolution: {integrity: sha512-RNrafz5bcwRy+O9e6P8Z/OCAJW/A+qtBczIqVYwTs14pf4iV1/+eKEjdOUta93q2TsT/FI0XYDP3TCky38LMAg==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [x64]
     os: [linux]
     libc: [glibc]
 
-  '@rolldown/binding-linux-x64-musl@1.0.0-rc.10':
-    resolution: {integrity: sha512-Xdf2jQbfQowJnLcgYfD/m0Uu0Qj5OdxKallD78/IPPfzaiaI4KRAwZzHcKQ4ig1gtg1SuzC7jovNiM2TzQsBXA==}
+  '@rolldown/binding-linux-x64-musl@1.0.0-rc.12':
+    resolution: {integrity: sha512-Jpw/0iwoKWx3LJ2rc1yjFrj+T7iHZn2JDg1Yny1ma0luviFS4mhAIcd1LFNxK3EYu3DHWCps0ydXQ5i/rrJ2ig==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [x64]
     os: [linux]
     libc: [musl]
 
-  '@rolldown/binding-openharmony-arm64@1.0.0-rc.10':
-    resolution: {integrity: sha512-o1hYe8hLi1EY6jgPFyxQgQ1wcycX+qz8eEbVmot2hFkgUzPxy9+kF0u0NIQBeDq+Mko47AkaFFaChcvZa9UX9Q==}
+  '@rolldown/binding-openharmony-arm64@1.0.0-rc.12':
+    resolution: {integrity: sha512-vRugONE4yMfVn0+7lUKdKvN4D5YusEiPilaoO2sgUWpCvrncvWgPMzK00ZFFJuiPgLwgFNP5eSiUlv2tfc+lpA==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [arm64]
     os: [openharmony]
 
-  '@rolldown/binding-wasm32-wasi@1.0.0-rc.10':
-    resolution: {integrity: sha512-Ugv9o7qYJudqQO5Y5y2N2SOo6S4WiqiNOpuQyoPInnhVzCY+wi/GHltcLHypG9DEUYMB0iTB/huJrpadiAcNcA==}
+  '@rolldown/binding-wasm32-wasi@1.0.0-rc.12':
+    resolution: {integrity: sha512-ykGiLr/6kkiHc0XnBfmFJuCjr5ZYKKofkx+chJWDjitX+KsJuAmrzWhwyOMSHzPhzOHOy7u9HlFoa5MoAOJ/Zg==}
     engines: {node: '>=14.0.0'}
     cpu: [wasm32]
 
-  '@rolldown/binding-win32-arm64-msvc@1.0.0-rc.10':
-    resolution: {integrity: sha512-7UODQb4fQUNT/vmgDZBl3XOBAIOutP5R3O/rkxg0aLfEGQ4opbCgU5vOw/scPe4xOqBwL9fw7/RP1vAMZ6QlAQ==}
+  '@rolldown/binding-win32-arm64-msvc@1.0.0-rc.12':
+    resolution: {integrity: sha512-5eOND4duWkwx1AzCxadcOrNeighiLwMInEADT0YM7xeEOOFcovWZCq8dadXgcRHSf3Ulh1kFo/qvzoFiCLOL1Q==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [arm64]
     os: [win32]
 
-  '@rolldown/binding-win32-x64-msvc@1.0.0-rc.10':
-    resolution: {integrity: sha512-PYxKHMVHOb5NJuDL53vBUl1VwUjymDcYI6rzpIni0C9+9mTiJedvUxSk7/RPp7OOAm3v+EjgMu9bIy3N6b408w==}
+  '@rolldown/binding-win32-x64-msvc@1.0.0-rc.12':
+    resolution: {integrity: sha512-PyqoipaswDLAZtot351MLhrlrh6lcZPo2LSYE+VDxbVk24LVKAGOuE4hb8xZQmrPAuEtTZW8E6D2zc5EUZX4Lw==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [x64]
     os: [win32]
 
-  '@rolldown/pluginutils@1.0.0-rc.10':
-    resolution: {integrity: sha512-UkVDEFk1w3mveXeKgaTuYfKWtPbvgck1dT8TUG3bnccrH0XtLTuAyfCoks4Q/M5ZGToSVJTIQYCzy2g/atAOeg==}
+  '@rolldown/pluginutils@1.0.0-rc.12':
+    resolution: {integrity: sha512-HHMwmarRKvoFsJorqYlFeFRzXZqCt2ETQlEDOb9aqssrnVBB1/+xgTGtuTrIk5vzLNX1MjMtTf7W9z3tsSbrxw==}
 
   '@rolldown/pluginutils@1.0.0-rc.7':
     resolution: {integrity: sha512-qujRfC8sFVInYSPPMLQByRh7zhwkGFS4+tyMQ83srV1qrxL4g8E2tyxVVyxd0+8QeBM1mIk9KbWxkegRr76XzA==}
 
-  '@rollup/rollup-android-arm-eabi@4.59.0':
-    resolution: {integrity: sha512-upnNBkA6ZH2VKGcBj9Fyl9IGNPULcjXRlg0LLeaioQWueH30p6IXtJEbKAgvyv+mJaMxSm1l6xwDXYjpEMiLMg==}
+  '@rollup/rollup-android-arm-eabi@4.60.0':
+    resolution: {integrity: sha512-WOhNW9K8bR3kf4zLxbfg6Pxu2ybOUbB2AjMDHSQx86LIF4rH4Ft7vmMwNt0loO0eonglSNy4cpD3MKXXKQu0/A==}
     cpu: [arm]
     os: [android]
 
-  '@rollup/rollup-android-arm64@4.59.0':
-    resolution: {integrity: sha512-hZ+Zxj3SySm4A/DylsDKZAeVg0mvi++0PYVceVyX7hemkw7OreKdCvW2oQ3T1FMZvCaQXqOTHb8qmBShoqk69Q==}
+  '@rollup/rollup-android-arm64@4.60.0':
+    resolution: {integrity: sha512-u6JHLll5QKRvjciE78bQXDmqRqNs5M/3GVqZeMwvmjaNODJih/WIrJlFVEihvV0MiYFmd+ZyPr9wxOVbPAG2Iw==}
     cpu: [arm64]
     os: [android]
 
-  '@rollup/rollup-darwin-arm64@4.59.0':
-    resolution: {integrity: sha512-W2Psnbh1J8ZJw0xKAd8zdNgF9HRLkdWwwdWqubSVk0pUuQkoHnv7rx4GiF9rT4t5DIZGAsConRE3AxCdJ4m8rg==}
+  '@rollup/rollup-darwin-arm64@4.60.0':
+    resolution: {integrity: sha512-qEF7CsKKzSRc20Ciu2Zw1wRrBz4g56F7r/vRwY430UPp/nt1x21Q/fpJ9N5l47WWvJlkNCPJz3QRVw008fi7yA==}
     cpu: [arm64]
     os: [darwin]
 
-  '@rollup/rollup-darwin-x64@4.59.0':
-    resolution: {integrity: sha512-ZW2KkwlS4lwTv7ZVsYDiARfFCnSGhzYPdiOU4IM2fDbL+QGlyAbjgSFuqNRbSthybLbIJ915UtZBtmuLrQAT/w==}
+  '@rollup/rollup-darwin-x64@4.60.0':
+    resolution: {integrity: sha512-WADYozJ4QCnXCH4wPB+3FuGmDPoFseVCUrANmA5LWwGmC6FL14BWC7pcq+FstOZv3baGX65tZ378uT6WG8ynTw==}
     cpu: [x64]
     os: [darwin]
 
-  '@rollup/rollup-freebsd-arm64@4.59.0':
-    resolution: {integrity: sha512-EsKaJ5ytAu9jI3lonzn3BgG8iRBjV4LxZexygcQbpiU0wU0ATxhNVEpXKfUa0pS05gTcSDMKpn3Sx+QB9RlTTA==}
+  '@rollup/rollup-freebsd-arm64@4.60.0':
+    resolution: {integrity: sha512-6b8wGHJlDrGeSE3aH5mGNHBjA0TTkxdoNHik5EkvPHCt351XnigA4pS7Wsj/Eo9Y8RBU6f35cjN9SYmCFBtzxw==}
     cpu: [arm64]
     os: [freebsd]
 
-  '@rollup/rollup-freebsd-x64@4.59.0':
-    resolution: {integrity: sha512-d3DuZi2KzTMjImrxoHIAODUZYoUUMsuUiY4SRRcJy6NJoZ6iIqWnJu9IScV9jXysyGMVuW+KNzZvBLOcpdl3Vg==}
+  '@rollup/rollup-freebsd-x64@4.60.0':
+    resolution: {integrity: sha512-h25Ga0t4jaylMB8M/JKAyrvvfxGRjnPQIR8lnCayyzEjEOx2EJIlIiMbhpWxDRKGKF8jbNH01NnN663dH638mA==}
     cpu: [x64]
     os: [freebsd]
 
-  '@rollup/rollup-linux-arm-gnueabihf@4.59.0':
-    resolution: {integrity: sha512-t4ONHboXi/3E0rT6OZl1pKbl2Vgxf9vJfWgmUoCEVQVxhW6Cw/c8I6hbbu7DAvgp82RKiH7TpLwxnJeKv2pbsw==}
+  '@rollup/rollup-linux-arm-gnueabihf@4.60.0':
+    resolution: {integrity: sha512-RzeBwv0B3qtVBWtcuABtSuCzToo2IEAIQrcyB/b2zMvBWVbjo8bZDjACUpnaafaxhTw2W+imQbP2BD1usasK4g==}
     cpu: [arm]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-arm-musleabihf@4.59.0':
-    resolution: {integrity: sha512-CikFT7aYPA2ufMD086cVORBYGHffBo4K8MQ4uPS/ZnY54GKj36i196u8U+aDVT2LX4eSMbyHtyOh7D7Zvk2VvA==}
+  '@rollup/rollup-linux-arm-musleabihf@4.60.0':
+    resolution: {integrity: sha512-Sf7zusNI2CIU1HLzuu9Tc5YGAHEZs5Lu7N1ssJG4Tkw6e0MEsN7NdjUDDfGNHy2IU+ENyWT+L2obgWiguWibWQ==}
     cpu: [arm]
     os: [linux]
     libc: [musl]
 
-  '@rollup/rollup-linux-arm64-gnu@4.59.0':
-    resolution: {integrity: sha512-jYgUGk5aLd1nUb1CtQ8E+t5JhLc9x5WdBKew9ZgAXg7DBk0ZHErLHdXM24rfX+bKrFe+Xp5YuJo54I5HFjGDAA==}
+  '@rollup/rollup-linux-arm64-gnu@4.60.0':
+    resolution: {integrity: sha512-DX2x7CMcrJzsE91q7/O02IJQ5/aLkVtYFryqCjduJhUfGKG6yJV8hxaw8pZa93lLEpPTP/ohdN4wFz7yp/ry9A==}
     cpu: [arm64]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-arm64-musl@4.59.0':
-    resolution: {integrity: sha512-peZRVEdnFWZ5Bh2KeumKG9ty7aCXzzEsHShOZEFiCQlDEepP1dpUl/SrUNXNg13UmZl+gzVDPsiCwnV1uI0RUA==}
+  '@rollup/rollup-linux-arm64-musl@4.60.0':
+    resolution: {integrity: sha512-09EL+yFVbJZlhcQfShpswwRZ0Rg+z/CsSELFCnPt3iK+iqwGsI4zht3secj5vLEs957QvFFXnzAT0FFPIxSrkQ==}
     cpu: [arm64]
     os: [linux]
     libc: [musl]
 
-  '@rollup/rollup-linux-loong64-gnu@4.59.0':
-    resolution: {integrity: sha512-gbUSW/97f7+r4gHy3Jlup8zDG190AuodsWnNiXErp9mT90iCy9NKKU0Xwx5k8VlRAIV2uU9CsMnEFg/xXaOfXg==}
+  '@rollup/rollup-linux-loong64-gnu@4.60.0':
+    resolution: {integrity: sha512-i9IcCMPr3EXm8EQg5jnja0Zyc1iFxJjZWlb4wr7U2Wx/GrddOuEafxRdMPRYVaXjgbhvqalp6np07hN1w9kAKw==}
     cpu: [loong64]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-loong64-musl@4.59.0':
-    resolution: {integrity: sha512-yTRONe79E+o0FWFijasoTjtzG9EBedFXJMl888NBEDCDV9I2wGbFFfJQQe63OijbFCUZqxpHz1GzpbtSFikJ4Q==}
+  '@rollup/rollup-linux-loong64-musl@4.60.0':
+    resolution: {integrity: sha512-DGzdJK9kyJ+B78MCkWeGnpXJ91tK/iKA6HwHxF4TAlPIY7GXEvMe8hBFRgdrR9Ly4qebR/7gfUs9y2IoaVEyog==}
     cpu: [loong64]
     os: [linux]
     libc: [musl]
 
-  '@rollup/rollup-linux-ppc64-gnu@4.59.0':
-    resolution: {integrity: sha512-sw1o3tfyk12k3OEpRddF68a1unZ5VCN7zoTNtSn2KndUE+ea3m3ROOKRCZxEpmT9nsGnogpFP9x6mnLTCaoLkA==}
+  '@rollup/rollup-linux-ppc64-gnu@4.60.0':
+    resolution: {integrity: sha512-RwpnLsqC8qbS8z1H1AxBA1H6qknR4YpPR9w2XX0vo2Sz10miu57PkNcnHVaZkbqyw/kUWfKMI73jhmfi9BRMUQ==}
     cpu: [ppc64]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-ppc64-musl@4.59.0':
-    resolution: {integrity: sha512-+2kLtQ4xT3AiIxkzFVFXfsmlZiG5FXYW7ZyIIvGA7Bdeuh9Z0aN4hVyXS/G1E9bTP/vqszNIN/pUKCk/BTHsKA==}
+  '@rollup/rollup-linux-ppc64-musl@4.60.0':
+    resolution: {integrity: sha512-Z8pPf54Ly3aqtdWC3G4rFigZgNvd+qJlOE52fmko3KST9SoGfAdSRCwyoyG05q1HrrAblLbk1/PSIV+80/pxLg==}
     cpu: [ppc64]
     os: [linux]
     libc: [musl]
 
-  '@rollup/rollup-linux-riscv64-gnu@4.59.0':
-    resolution: {integrity: sha512-NDYMpsXYJJaj+I7UdwIuHHNxXZ/b/N2hR15NyH3m2qAtb/hHPA4g4SuuvrdxetTdndfj9b1WOmy73kcPRoERUg==}
+  '@rollup/rollup-linux-riscv64-gnu@4.60.0':
+    resolution: {integrity: sha512-3a3qQustp3COCGvnP4SvrMHnPQ9d1vzCakQVRTliaz8cIp/wULGjiGpbcqrkv0WrHTEp8bQD/B3HBjzujVWLOA==}
     cpu: [riscv64]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-riscv64-musl@4.59.0':
-    resolution: {integrity: sha512-nLckB8WOqHIf1bhymk+oHxvM9D3tyPndZH8i8+35p/1YiVoVswPid2yLzgX7ZJP0KQvnkhM4H6QZ5m0LzbyIAg==}
+  '@rollup/rollup-linux-riscv64-musl@4.60.0':
+    resolution: {integrity: sha512-pjZDsVH/1VsghMJ2/kAaxt6dL0psT6ZexQVrijczOf+PeP2BUqTHYejk3l6TlPRydggINOeNRhvpLa0AYpCWSQ==}
     cpu: [riscv64]
     os: [linux]
     libc: [musl]
 
-  '@rollup/rollup-linux-s390x-gnu@4.59.0':
-    resolution: {integrity: sha512-oF87Ie3uAIvORFBpwnCvUzdeYUqi2wY6jRFWJAy1qus/udHFYIkplYRW+wo+GRUP4sKzYdmE1Y3+rY5Gc4ZO+w==}
+  '@rollup/rollup-linux-s390x-gnu@4.60.0':
+    resolution: {integrity: sha512-3ObQs0BhvPgiUVZrN7gqCSvmFuMWvWvsjG5ayJ3Lraqv+2KhOsp+pUbigqbeWqueGIsnn+09HBw27rJ+gYK4VQ==}
     cpu: [s390x]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-x64-gnu@4.59.0':
-    resolution: {integrity: sha512-3AHmtQq/ppNuUspKAlvA8HtLybkDflkMuLK4DPo77DfthRb71V84/c4MlWJXixZz4uruIH4uaa07IqoAkG64fg==}
+  '@rollup/rollup-linux-x64-gnu@4.60.0':
+    resolution: {integrity: sha512-EtylprDtQPdS5rXvAayrNDYoJhIz1/vzN2fEubo3yLE7tfAw+948dO0g4M0vkTVFhKojnF+n6C8bDNe+gDRdTg==}
     cpu: [x64]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-x64-musl@4.59.0':
-    resolution: {integrity: sha512-2UdiwS/9cTAx7qIUZB/fWtToJwvt0Vbo0zmnYt7ED35KPg13Q0ym1g442THLC7VyI6JfYTP4PiSOWyoMdV2/xg==}
+  '@rollup/rollup-linux-x64-musl@4.60.0':
+    resolution: {integrity: sha512-k09oiRCi/bHU9UVFqD17r3eJR9bn03TyKraCrlz5ULFJGdJGi7VOmm9jl44vOJvRJ6P7WuBi/s2A97LxxHGIdw==}
     cpu: [x64]
     os: [linux]
     libc: [musl]
 
-  '@rollup/rollup-openbsd-x64@4.59.0':
-    resolution: {integrity: sha512-M3bLRAVk6GOwFlPTIxVBSYKUaqfLrn8l0psKinkCFxl4lQvOSz8ZrKDz2gxcBwHFpci0B6rttydI4IpS4IS/jQ==}
+  '@rollup/rollup-openbsd-x64@4.60.0':
+    resolution: {integrity: sha512-1o/0/pIhozoSaDJoDcec+IVLbnRtQmHwPV730+AOD29lHEEo4F5BEUB24H0OBdhbBBDwIOSuf7vgg0Ywxdfiiw==}
     cpu: [x64]
     os: [openbsd]
 
-  '@rollup/rollup-openharmony-arm64@4.59.0':
-    resolution: {integrity: sha512-tt9KBJqaqp5i5HUZzoafHZX8b5Q2Fe7UjYERADll83O4fGqJ49O1FsL6LpdzVFQcpwvnyd0i+K/VSwu/o/nWlA==}
+  '@rollup/rollup-openharmony-arm64@4.60.0':
+    resolution: {integrity: sha512-pESDkos/PDzYwtyzB5p/UoNU/8fJo68vcXM9ZW2V0kjYayj1KaaUfi1NmTUTUpMn4UhU4gTuK8gIaFO4UGuMbA==}
     cpu: [arm64]
     os: [openharmony]
 
-  '@rollup/rollup-win32-arm64-msvc@4.59.0':
-    resolution: {integrity: sha512-V5B6mG7OrGTwnxaNUzZTDTjDS7F75PO1ae6MJYdiMu60sq0CqN5CVeVsbhPxalupvTX8gXVSU9gq+Rx1/hvu6A==}
+  '@rollup/rollup-win32-arm64-msvc@4.60.0':
+    resolution: {integrity: sha512-hj1wFStD7B1YBeYmvY+lWXZ7ey73YGPcViMShYikqKT1GtstIKQAtfUI6yrzPjAy/O7pO0VLXGmUVWXQMaYgTQ==}
     cpu: [arm64]
     os: [win32]
 
-  '@rollup/rollup-win32-ia32-msvc@4.59.0':
-    resolution: {integrity: sha512-UKFMHPuM9R0iBegwzKF4y0C4J9u8C6MEJgFuXTBerMk7EJ92GFVFYBfOZaSGLu6COf7FxpQNqhNS4c4icUPqxA==}
+  '@rollup/rollup-win32-ia32-msvc@4.60.0':
+    resolution: {integrity: sha512-SyaIPFoxmUPlNDq5EHkTbiKzmSEmq/gOYFI/3HHJ8iS/v1mbugVa7dXUzcJGQfoytp9DJFLhHH4U3/eTy2Bq4w==}
     cpu: [ia32]
     os: [win32]
 
-  '@rollup/rollup-win32-x64-gnu@4.59.0':
-    resolution: {integrity: sha512-laBkYlSS1n2L8fSo1thDNGrCTQMmxjYY5G0WFWjFFYZkKPjsMBsgJfGf4TLxXrF6RyhI60L8TMOjBMvXiTcxeA==}
+  '@rollup/rollup-win32-x64-gnu@4.60.0':
+    resolution: {integrity: sha512-RdcryEfzZr+lAr5kRm2ucN9aVlCCa2QNq4hXelZxb8GG0NJSazq44Z3PCCc8wISRuCVnGs0lQJVX5Vp6fKA+IA==}
     cpu: [x64]
     os: [win32]
 
-  '@rollup/rollup-win32-x64-msvc@4.59.0':
-    resolution: {integrity: sha512-2HRCml6OztYXyJXAvdDXPKcawukWY2GpR5/nxKp4iBgiO3wcoEGkAaqctIbZcNB6KlUQBIqt8VYkNSj2397EfA==}
+  '@rollup/rollup-win32-x64-msvc@4.60.0':
+    resolution: {integrity: sha512-PrsWNQ8BuE00O3Xsx3ALh2Df8fAj9+cvvX9AIA6o4KpATR98c9mud4XtDWVvsEuyia5U4tVSTKygawyJkjm60w==}
     cpu: [x64]
     os: [win32]
 
-  '@sentry-internal/browser-utils@10.45.0':
-    resolution: {integrity: sha512-ZPZpeIarXKScvquGx2AfNKcYiVNDA4wegMmjyGVsTA2JPmP0TrJoO3UybJS6KGDeee8V3I3EfD/ruauMm7jOFQ==}
+  '@sentry-internal/browser-utils@10.46.0':
+    resolution: {integrity: sha512-WB1gBT9G13V02ekZ6NpUhoI1aGHV2eNfjEPthkU2bGBvFpQKnstwzjg7waIRGR7cu+YSW2Q6UI6aQLgBeOPD1g==}
     engines: {node: '>=18'}
 
-  '@sentry-internal/feedback@10.45.0':
-    resolution: {integrity: sha512-vCSurazFVq7RUeYiM5X326jA5gOVrWYD6lYX2fbjBOMcyCEhDnveNxMT62zKkZDyNT/jyD194nz/cjntBUkyWA==}
+  '@sentry-internal/feedback@10.46.0':
+    resolution: {integrity: sha512-c4pI/z9nZCQXe9GYEw/hE/YTY9AxGBp8/wgKI+T8zylrN35SGHaXv63szzE1WbI8lacBY8lBF7rstq9bQVCaHw==}
     engines: {node: '>=18'}
 
-  '@sentry-internal/replay-canvas@10.45.0':
-    resolution: {integrity: sha512-nvq/AocdZTuD7y0KSiWi3gVaY0s5HOFy86mC/v1kDZmT/jsBAzN5LDkk/f1FvsWma1peqQmpUqxvhC+YIW294Q==}
+  '@sentry-internal/replay-canvas@10.46.0':
+    resolution: {integrity: sha512-ub314MWUsekVCuoH0/HJbbimlI24SkV745UW2pj9xRbxOAEf1wjkmIzxKrMDbTgJGuEunug02XZVdJFJUzOcDw==}
     engines: {node: '>=18'}
 
-  '@sentry-internal/replay@10.45.0':
-    resolution: {integrity: sha512-vjosRoGA1bzhVAEO1oce+CsRdd70quzBeo7WvYqpcUnoLe/Rv8qpOMqWX3j26z7XfFHMExWQNQeLxmtYOArvlw==}
+  '@sentry-internal/replay@10.46.0':
+    resolution: {integrity: sha512-JBsWeXG6bRbxBFK8GzWymWGOB9QE7Kl57BeF3jzgdHTuHSWZ2mRnAmb1K05T4LU+gVygk6yW0KmdC8Py9Qzg9A==}
     engines: {node: '>=18'}
 
-  '@sentry/browser@10.45.0':
-    resolution: {integrity: sha512-e/a8UMiQhqqv706McSIcG6XK+AoQf9INthi2pD+giZfNRTzXTdqHzUT5OIO5hg8Am6eF63nDJc+vrYNPhzs51Q==}
+  '@sentry/browser@10.46.0':
+    resolution: {integrity: sha512-80DmGlTk5Z2/OxVOzLNxwolMyouuAYKqG8KUcoyintZqHbF6kO1RulI610HmyUt3OagKeBCqt9S7w0VIfCRL+Q==}
     engines: {node: '>=18'}
 
-  '@sentry/core@10.45.0':
-    resolution: {integrity: sha512-s69UXxvefeQxuZ5nY7/THtTrIEvJxNVCp3ns4kwoCw1qMpgpvn/296WCKVmM7MiwnaAdzEKnAvLAwaxZc2nM7Q==}
+  '@sentry/core@10.46.0':
+    resolution: {integrity: sha512-N3fj4zqBQOhXliS1Ne9euqIKuciHCGOJfPGQLwBoW9DNz03jF+NB8+dUKtrJ79YLoftjVgf8nbgwtADK7NR+2Q==}
     engines: {node: '>=18'}
 
-  '@sentry/react@10.45.0':
-    resolution: {integrity: sha512-jLezuxi4BUIU3raKyAPR5xMbQG/nhwnWmKo5p11NCbLmWzkS+lxoyDTUB4B8TAKZLfdtdkKLOn1S0tFc8vbUHw==}
+  '@sentry/react@10.46.0':
+    resolution: {integrity: sha512-Rb1S+9OuUPVwsz7GWnQ6Kgf3azbsseUymIegg3JZHNcW/fM1nPpaljzTBnuineia113DH0pgMBcdrrZDLaosFQ==}
     engines: {node: '>=18'}
     peerDependencies:
       react: ^16.14.0 || 17.x || 18.x || 19.x
@@ -1188,11 +1188,11 @@ packages:
   '@standard-schema/spec@1.1.0':
     resolution: {integrity: sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==}
 
-  '@tanstack/query-core@5.91.2':
-    resolution: {integrity: sha512-Uz2pTgPC1mhqrrSGg18RKCWT/pkduAYtxbcyIyKBhw7dTWjXZIzqmpzO2lBkyWr4hlImQgpu1m1pei3UnkFRWw==}
+  '@tanstack/query-core@5.95.2':
+    resolution: {integrity: sha512-o4T8vZHZET4Bib3jZ/tCW9/7080urD4c+0/AUaYVpIqOsr7y0reBc1oX3ttNaSW5mYyvZHctiQ/UOP2PfdmFEQ==}
 
-  '@tanstack/react-query@5.91.2':
-    resolution: {integrity: sha512-GClLPzbM57iFXv+FlvOUL56XVe00PxuTaVEyj1zAObhRiKF008J5vedmaq7O6ehs+VmPHe8+PUQhMuEyv8d9wQ==}
+  '@tanstack/react-query@5.95.2':
+    resolution: {integrity: sha512-/wGkvLj/st5Ud1Q76KF1uFxScV7WeqN1slQx5280ycwAyYkIPGaRZAEgHxe3bjirSd5Zpwkj6zNcR4cqYni/ZA==}
     peerDependencies:
       react: ^18 || ^19
 
@@ -1313,63 +1313,63 @@ packages:
   '@types/yargs@17.0.35':
     resolution: {integrity: sha512-qUHkeCyQFxMXg79wQfTtfndEC+N9ZZg76HJftDJp+qH2tV7Gj4OJi7l+PiWwJ+pWtW8GwSmqsDj/oymhrTWXjg==}
 
-  '@typescript-eslint/eslint-plugin@8.57.1':
-    resolution: {integrity: sha512-Gn3aqnvNl4NGc6x3/Bqk1AOn0thyTU9bqDRhiRnUWezgvr2OnhYCWCgC8zXXRVqBsIL1pSDt7T9nJUe0oM0kDQ==}
+  '@typescript-eslint/eslint-plugin@8.57.2':
+    resolution: {integrity: sha512-NZZgp0Fm2IkD+La5PR81sd+g+8oS6JwJje+aRWsDocxHkjyRw0J5L5ZTlN3LI1LlOcGL7ph3eaIUmTXMIjLk0w==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
-      '@typescript-eslint/parser': ^8.57.1
+      '@typescript-eslint/parser': ^8.57.2
       eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
       typescript: '>=4.8.4 <6.0.0'
 
-  '@typescript-eslint/parser@8.57.1':
-    resolution: {integrity: sha512-k4eNDan0EIMTT/dUKc/g+rsJ6wcHYhNPdY19VoX/EOtaAG8DLtKCykhrUnuHPYvinn5jhAPgD2Qw9hXBwrahsw==}
+  '@typescript-eslint/parser@8.57.2':
+    resolution: {integrity: sha512-30ScMRHIAD33JJQkgfGW1t8CURZtjc2JpTrq5n2HFhOefbAhb7ucc7xJwdWcrEtqUIYJ73Nybpsggii6GtAHjA==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
       typescript: '>=4.8.4 <6.0.0'
 
-  '@typescript-eslint/project-service@8.57.1':
-    resolution: {integrity: sha512-vx1F37BRO1OftsYlmG9xay1TqnjNVlqALymwWVuYTdo18XuKxtBpCj1QlzNIEHlvlB27osvXFWptYiEWsVdYsg==}
+  '@typescript-eslint/project-service@8.57.2':
+    resolution: {integrity: sha512-FuH0wipFywXRTHf+bTTjNyuNQQsQC3qh/dYzaM4I4W0jrCqjCVuUh99+xd9KamUfmCGPvbO8NDngo/vsnNVqgw==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       typescript: '>=4.8.4 <6.0.0'
 
-  '@typescript-eslint/scope-manager@8.57.1':
-    resolution: {integrity: sha512-hs/QcpCwlwT2L5S+3fT6gp0PabyGk4Q0Rv2doJXA0435/OpnSR3VRgvrp8Xdoc3UAYSg9cyUjTeFXZEPg/3OKg==}
+  '@typescript-eslint/scope-manager@8.57.2':
+    resolution: {integrity: sha512-snZKH+W4WbWkrBqj4gUNRIGb/jipDW3qMqVJ4C9rzdFc+wLwruxk+2a5D+uoFcKPAqyqEnSb4l2ULuZf95eSkw==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
-  '@typescript-eslint/tsconfig-utils@8.57.1':
-    resolution: {integrity: sha512-0lgOZB8cl19fHO4eI46YUx2EceQqhgkPSuCGLlGi79L2jwYY1cxeYc1Nae8Aw1xjgW3PKVDLlr3YJ6Bxx8HkWg==}
+  '@typescript-eslint/tsconfig-utils@8.57.2':
+    resolution: {integrity: sha512-3Lm5DSM+DCowsUOJC+YqHHnKEfFh5CoGkj5Z31NQSNF4l5wdOwqGn99wmwN/LImhfY3KJnmordBq/4+VDe2eKw==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       typescript: '>=4.8.4 <6.0.0'
 
-  '@typescript-eslint/type-utils@8.57.1':
-    resolution: {integrity: sha512-+Bwwm0ScukFdyoJsh2u6pp4S9ktegF98pYUU0hkphOOqdMB+1sNQhIz8y5E9+4pOioZijrkfNO/HUJVAFFfPKA==}
+  '@typescript-eslint/type-utils@8.57.2':
+    resolution: {integrity: sha512-Co6ZCShm6kIbAM/s+oYVpKFfW7LBc6FXoPXjTRQ449PPNBY8U0KZXuevz5IFuuUj2H9ss40atTaf9dlGLzbWZg==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
       typescript: '>=4.8.4 <6.0.0'
 
-  '@typescript-eslint/types@8.57.1':
-    resolution: {integrity: sha512-S29BOBPJSFUiblEl6RzPPjJt6w25A6XsBqRVDt53tA/tlL8q7ceQNZHTjPeONt/3S7KRI4quk+yP9jK2WjBiPQ==}
+  '@typescript-eslint/types@8.57.2':
+    resolution: {integrity: sha512-/iZM6FnM4tnx9csuTxspMW4BOSegshwX5oBDznJ7S4WggL7Vczz5d2W11ecc4vRrQMQHXRSxzrCsyG5EsPPTbA==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
-  '@typescript-eslint/typescript-estree@8.57.1':
-    resolution: {integrity: sha512-ybe2hS9G6pXpqGtPli9Gx9quNV0TWLOmh58ADlmZe9DguLq0tiAKVjirSbtM1szG6+QH6rVXyU6GTLQbWnMY+g==}
+  '@typescript-eslint/typescript-estree@8.57.2':
+    resolution: {integrity: sha512-2MKM+I6g8tJxfSmFKOnHv2t8Sk3T6rF20A1Puk0svLK+uVapDZB/4pfAeB7nE83uAZrU6OxW+HmOd5wHVdXwXA==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       typescript: '>=4.8.4 <6.0.0'
 
-  '@typescript-eslint/utils@8.57.1':
-    resolution: {integrity: sha512-XUNSJ/lEVFttPMMoDVA2r2bwrl8/oPx8cURtczkSEswY5T3AeLmCy+EKWQNdL4u0MmAHOjcWrqJp2cdvgjn8dQ==}
+  '@typescript-eslint/utils@8.57.2':
+    resolution: {integrity: sha512-krRIbvPK1ju1WBKIefiX+bngPs+odIQUtR7kymzPfo1POVw3jlF+nLkmexdSSd4UCbDcQn+wMBATOOmpBbqgKg==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
       typescript: '>=4.8.4 <6.0.0'
 
-  '@typescript-eslint/visitor-keys@8.57.1':
-    resolution: {integrity: sha512-YWnmJkXbofiz9KbnbbwuA2rpGkFPLbAIetcCNO6mJ8gdhdZ/v7WDXsoGFAJuM6ikUFKTlSQnjWnVO4ux+UzS6A==}
+  '@typescript-eslint/visitor-keys@8.57.2':
+    resolution: {integrity: sha512-zhahknjobV2FiD6Ee9iLbS7OV9zi10rG26odsQdfBO/hjSzUQbkIYgda+iNKK1zNiW2ey+Lf8MU5btN17V3dUw==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
   '@vitejs/plugin-react@6.0.1':
@@ -1555,8 +1555,8 @@ packages:
   base64-js@1.5.1:
     resolution: {integrity: sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==}
 
-  baseline-browser-mapping@2.10.9:
-    resolution: {integrity: sha512-OZd0e2mU11ClX8+IdXe3r0dbqMEznRiT4TfbhYIbcRPZkqJ7Qwer8ij3GZAmLsRKa+II9V1v5czCkvmHH3XZBg==}
+  baseline-browser-mapping@2.10.11:
+    resolution: {integrity: sha512-DAKrHphkJyiGuau/cFieRYhcTFeK/lBuD++C7cZ6KZHbMhBrisoi+EvhQ5RZrIfV5qwsW8kgQ07JIC+MDJRAhg==}
     engines: {node: '>=6.0.0'}
     hasBin: true
 
@@ -1571,14 +1571,14 @@ packages:
     resolution: {integrity: sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==}
     engines: {node: '>=8'}
 
-  brace-expansion@1.1.12:
-    resolution: {integrity: sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==}
+  brace-expansion@1.1.13:
+    resolution: {integrity: sha512-9ZLprWS6EENmhEOpjCYW2c8VkmOvckIJZfkr7rBW6dObmfgJ/L1GpSYW5Hpo9lDz4D1+n0Ckz8rU7FwHDQiG/w==}
 
-  brace-expansion@2.0.2:
-    resolution: {integrity: sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==}
+  brace-expansion@2.0.3:
+    resolution: {integrity: sha512-MCV/fYJEbqx68aE58kv2cA/kiky1G8vux3OR6/jbS+jIMe/6fJWa0DTzJU7dqijOWYwHi1t29FlfYI9uytqlpA==}
 
-  brace-expansion@5.0.4:
-    resolution: {integrity: sha512-h+DEnpVvxmfVefa4jFbCf5HdH5YMDXRsmKflpf1pILZWRFlTbJpxeU55nJl4Smt5HQaGzg1o6RHFPJaOqnmBDg==}
+  brace-expansion@5.0.5:
+    resolution: {integrity: sha512-VZznLgtwhn+Mact9tfiwx64fA9erHH/MCXEUfB/0bX/6Fz6ny5EGTXYltMocqg4xFAQZtnO3DHWWXi8RiuN7cQ==}
     engines: {node: 18 || 20 || >=22}
 
   braces@3.0.3:
@@ -1616,8 +1616,8 @@ packages:
     resolution: {integrity: sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==}
     engines: {node: '>=10'}
 
-  caniuse-lite@1.0.30001780:
-    resolution: {integrity: sha512-llngX0E7nQci5BPJDqoZSbuZ5Bcs9F5db7EtgfwBerX9XGtkkiO4NwfDDIRzHTTwcYC8vC7bmeUEPGrKlR/TkQ==}
+  caniuse-lite@1.0.30001781:
+    resolution: {integrity: sha512-RdwNCyMsNBftLjW6w01z8bKEvT6e/5tpPVEgtn22TiLGlstHOVecsX2KHFkD5e/vRnIE4EGzpuIODb3mtswtkw==}
 
   chai@6.2.2:
     resolution: {integrity: sha512-NUPRluOfOiTKBKvWPtSD4PhFvWCqOi0BGStNWs57X9js7XGTprSmFoz5F0tWhR4WPjNeR9jXqdC7/UpSJTnlRg==}
@@ -1819,8 +1819,8 @@ packages:
   eastasianwidth@0.2.0:
     resolution: {integrity: sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==}
 
-  electron-to-chromium@1.5.321:
-    resolution: {integrity: sha512-L2C7Q279W2D/J4PLZLk7sebOILDSWos7bMsMNN06rK482umHUrh/3lM8G7IlHFOYip2oAg5nha1rCMxr/rs6ZQ==}
+  electron-to-chromium@1.5.328:
+    resolution: {integrity: sha512-QNQ5l45DzYytThO21403XN3FvK0hOkWDG8viNf6jqS42msJ8I4tGDSpBCgvDRRPnkffafiwAym2X2eHeGD2V0w==}
 
   emoji-regex@8.0.0:
     resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
@@ -2033,8 +2033,8 @@ packages:
     resolution: {integrity: sha512-f7ccFPK3SXFHpx15UIGyRJ/FJQctuKZ0zVuN3frBo4HnK3cay9VEW0R6yPYFHC0AgqhukPzKjq22t5DmAyqGyw==}
     engines: {node: '>=16'}
 
-  flat-cache@6.1.21:
-    resolution: {integrity: sha512-2u7cJfSf7Th7NxEk/VzQjnPoglok2YCsevS7TSbJjcDQWJPbqUUnSYtriHSvtnq+fRZHy1s0ugk4ApnQyhPGoQ==}
+  flat-cache@6.1.22:
+    resolution: {integrity: sha512-N2dnzVJIphnNsjHcrxGW7DePckJ6haPrSFqpsBUhHYgwtKGVq4JrBGielEGD2fCVnsGm1zlBVZ8wGhkyuetgug==}
 
   flatted@3.4.2:
     resolution: {integrity: sha512-PjDse7RzhcPkIJwy5t7KPWQSZ9cAbzQXcafsetQoD7sOJRQlGikNbx7yZp2OotDnJyrDcbyRq3Ttb18iYOqkxA==}
@@ -2158,8 +2158,8 @@ packages:
     resolution: {integrity: sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==}
     engines: {node: '>=10'}
 
-  globby@16.1.1:
-    resolution: {integrity: sha512-dW7vl+yiAJSp6aCekaVnVJxurRv7DCOLyXqEG3RYMYUg7AuJ2jCqPkZTA8ooqC2vtnkaMcV5WfFBMuEnTu1OQg==}
+  globby@16.2.0:
+    resolution: {integrity: sha512-QrJia2qDf5BB/V6HYlDTs0I0lBahyjLzpGQg3KT7FnCdTonAyPy2RtY802m2k4ALx6Dp752f82WsOczEVr3l6Q==}
     engines: {node: '>=20'}
 
   globjoin@0.1.4:
@@ -2172,8 +2172,8 @@ packages:
   graceful-fs@4.2.11:
     resolution: {integrity: sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==}
 
-  graphql@16.13.1:
-    resolution: {integrity: sha512-gGgrVCoDKlIZ8fIqXBBb0pPKqDgki0Z/FSKNiQzSGj2uEYHr1tq5wmBegGwJx6QB5S5cM0khSBpi/JFHMCvsmQ==}
+  graphql@16.13.2:
+    resolution: {integrity: sha512-5bJ+nf/UCpAjHM8i06fl7eLyVC9iuNAjm9qzkiu2ZGhM0VscSvS6WDPfAwkdkBuoXGM9FJSbKl6wylMwP9Ktig==}
     engines: {node: ^12.22.0 || ^14.16.0 || ^16.0.0 || >=17.0.0}
 
   has-bigints@1.1.0:
@@ -2203,8 +2203,8 @@ packages:
     resolution: {integrity: sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==}
     engines: {node: '>= 0.4'}
 
-  hashery@1.5.0:
-    resolution: {integrity: sha512-nhQ6ExaOIqti2FDWoEMWARUqIKyjr2VcZzXShrI+A3zpeiuPWzx6iPftt44LhP74E5sW36B75N6VHbvRtpvO6Q==}
+  hashery@1.5.1:
+    resolution: {integrity: sha512-iZyKG96/JwPz1N55vj2Ie2vXbhu440zfUfJvSwEqEbeLluk7NnapfGqa7LH0mOsnDxTF85Mx8/dyR6HfqcbmbQ==}
     engines: {node: '>=20'}
 
   hasown@2.0.2:
@@ -2538,8 +2538,8 @@ packages:
       canvas:
         optional: true
 
-  jsdom@29.0.0:
-    resolution: {integrity: sha512-9FshNB6OepopZ08unmmGpsF7/qCjxGPbo3NbgfJAnPeHXnsODE9WWffXZtRFRFe0ntzaAOcSKNJFz8wiyvF1jQ==}
+  jsdom@29.0.1:
+    resolution: {integrity: sha512-z6JOK5gRO7aMybVq/y/MlIpKh8JIi68FBKMUtKkK2KH/wMSRlCxQ682d08LB9fYXplyY/UXG8P4XXTScmdjApg==}
     engines: {node: ^20.19.0 || ^22.13.0 || >=24.0.0}
     peerDependencies:
       canvas: ^3.0.0
@@ -2949,8 +2949,8 @@ packages:
   path-to-regexp@6.3.0:
     resolution: {integrity: sha512-Yhpw4T9C6hPpgPeA28us07OJeqZ5EzQTkbfwuhsUg0c237RomFoETJgmp2sa3F/41gfLE6G5cqcYwznmeEeOlQ==}
 
-  path-to-regexp@8.3.0:
-    resolution: {integrity: sha512-7jdwVIRtsP8MYpdXSwOS0YdD0Du+qOoF/AEPIt88PcCFrZCzx41oxku1jD88hZBwbNUIEfpqvuhjFaMAqMTWnA==}
+  path-to-regexp@8.4.0:
+    resolution: {integrity: sha512-PuseHIvAnz3bjrM2rGJtSgo1zjgxapTLZ7x2pjhzWwlp4SJQgK3f3iZIQwkpEnBaKz6seKBADpM4B4ySkuYypg==}
 
   path-type@4.0.0:
     resolution: {integrity: sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==}
@@ -2962,12 +2962,12 @@ packages:
   picocolors@1.1.1:
     resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==}
 
-  picomatch@2.3.1:
-    resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
+  picomatch@2.3.2:
+    resolution: {integrity: sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==}
     engines: {node: '>=8.6'}
 
-  picomatch@4.0.3:
-    resolution: {integrity: sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==}
+  picomatch@4.0.4:
+    resolution: {integrity: sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==}
     engines: {node: '>=12'}
 
   pify@4.0.1:
@@ -3124,8 +3124,8 @@ packages:
   react-is@18.3.1:
     resolution: {integrity: sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==}
 
-  react-router@7.13.1:
-    resolution: {integrity: sha512-td+xP4X2/6BJvZoX6xw++A2DdEi++YypA69bJUV5oVvqf6/9/9nNlD70YO1e9d3MyamJEBQFEzk6mbfDYbqrSA==}
+  react-router@7.13.2:
+    resolution: {integrity: sha512-tX1Aee+ArlKQP+NIUd7SE6Li+CiGKwQtbS+FfRxPX6Pe4vHOo6nr9d++u5cwg+Z8K/x8tP+7qLmujDtfrAoUJA==}
     engines: {node: '>=20.0.0'}
     peerDependencies:
       react: '>=18'
@@ -3195,13 +3195,13 @@ packages:
     resolution: {integrity: sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==}
     engines: {iojs: '>=1.0.0', node: '>=0.10.0'}
 
-  rolldown@1.0.0-rc.10:
-    resolution: {integrity: sha512-q7j6vvarRFmKpgJUT8HCAUljkgzEp4LAhPlJUvQhA5LA1SUL36s5QCysMutErzL3EbNOZOkoziSx9iZC4FddKA==}
+  rolldown@1.0.0-rc.12:
+    resolution: {integrity: sha512-yP4USLIMYrwpPHEFB5JGH1uxhcslv6/hL0OyvTuY+3qlOSJvZ7ntYnoWpehBxufkgN0cvXxppuTu5hHa/zPh+A==}
     engines: {node: ^20.19.0 || >=22.12.0}
     hasBin: true
 
-  rollup@4.59.0:
-    resolution: {integrity: sha512-2oMpl67a3zCH9H79LeMcbDhXW/UmWG/y2zuqnF2jQq5uq9TbM9TVyXvA4+t+ne2IIkBdrLpAaRQAvo7YI/Yyeg==}
+  rollup@4.60.0:
+    resolution: {integrity: sha512-yqjxruMGBQJ2gG4HtjZtAfXArHomazDHoFwFFmZZl0r7Pdo7qCIXKqKHZc8yeoMgzJJ+pO6pEEHa+V7uzWlrAQ==}
     engines: {node: '>=18.0.0', npm: '>=8.0.0'}
     hasBin: true
 
@@ -3554,8 +3554,8 @@ packages:
     peerDependencies:
       stylelint: ^16.8.2 || ^17.0.0
 
-  stylelint@17.5.0:
-    resolution: {integrity: sha512-o/NS6zhsPZFmgUm5tXX4pVNg1XDOZSlucLdf2qow/lVn4JIyzZIQ5b3kad1ugqUj3GSIgr2u5lQw7X8rjqw33g==}
+  stylelint@17.6.0:
+    resolution: {integrity: sha512-tokrsMIVAR9vAQ/q3UVEr7S0dGXCi7zkCezPRnS2kqPUulvUh5Vgfwngrk4EoAoW7wnrThqTdnTFN5Ra7CaxIg==}
     engines: {node: '>=20.19.0'}
     hasBin: true
 
@@ -3625,15 +3625,15 @@ packages:
   tldts-core@6.1.86:
     resolution: {integrity: sha512-Je6p7pkk+KMzMv2XXKmAE3McmolOQFdxkKw0R8EYNr7sELW46JqnNeTX8ybPiQgvg1ymCoF8LXs5fzFaZvJPTA==}
 
-  tldts-core@7.0.26:
-    resolution: {integrity: sha512-5WJ2SqFsv4G2Dwi7ZFVRnz6b2H1od39QME1lc2y5Ew3eWiZMAeqOAfWpRP9jHvhUl881406QtZTODvjttJs+ew==}
+  tldts-core@7.0.27:
+    resolution: {integrity: sha512-YQ7uPjgWUibIK6DW5lrKujGwUKhLevU4hcGbP5O6TcIUb+oTjJYJVWPS4nZsIHrEEEG6myk/oqAJUEQmpZrHsg==}
 
   tldts@6.1.86:
     resolution: {integrity: sha512-WMi/OQ2axVTf/ykqCQgXiIct+mSQDFdH2fkwhPwgEwvJ1kSzZRiinb0zF2Xb8u4+OqPChmyI6MEu4EezNJz+FQ==}
     hasBin: true
 
-  tldts@7.0.26:
-    resolution: {integrity: sha512-WiGwQjr0qYdNNG8KpMKlSvpxz652lqa3Rd+/hSaDcY4Uo6SKWZq2LAF+hsAhUewTtYhXlorBKgNF3Kk8hnjGoQ==}
+  tldts@7.0.27:
+    resolution: {integrity: sha512-I4FZcVFcqCRuT0ph6dCDpPuO4Xgzvh+spkcTr1gK7peIvxWauoloVO0vuy1FQnijT63ss6AsHB6+OIM4aXHbPg==}
     hasBin: true
 
   to-regex-range@5.0.1:
@@ -3713,8 +3713,8 @@ packages:
     engines: {node: '>=18.0.0'}
     hasBin: true
 
-  typescript-eslint@8.57.1:
-    resolution: {integrity: sha512-fLvZWf+cAGw3tqMCYzGIU6yR8K+Y9NT2z23RwOjlNFF2HwSB3KhdEFI5lSBv8tNmFkkBShSjsCjzx1vahZfISA==}
+  typescript-eslint@8.57.2:
+    resolution: {integrity: sha512-VEPQ0iPgWO/sBaZOU1xo4nuNdODVOajPnTIbog2GKYr31nIlZ0fWPoCQgGfF3ETyBl1vn63F/p50Um9Z4J8O8A==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
@@ -3735,8 +3735,8 @@ packages:
   undici-types@7.16.0:
     resolution: {integrity: sha512-Zz+aZWSj8LE6zoxD+xrjh4VfkIG8Ya6LvYkZqtUQGJPZjYl53ypCaUwWqo7eI0x66KBGeRo+mlBEkMSeSZ38Nw==}
 
-  undici@7.24.5:
-    resolution: {integrity: sha512-3IWdCpjgxp15CbJnsi/Y9TCDE7HWVN19j1hmzVhoAkY/+CJx449tVxT5wZc1Gwg8J+P0LWvzlBzxYRnHJ+1i7Q==}
+  undici@7.24.6:
+    resolution: {integrity: sha512-Xi4agocCbRzt0yYMZGMA6ApD7gvtUFaxm4ZmeacWI4cZxaF6C+8I8QfofC20NAePiB/IcvZmzkJ7XPa471AEtA==}
     engines: {node: '>=20.18.1'}
 
   unicorn-magic@0.4.0:
@@ -3820,8 +3820,8 @@ packages:
       yaml:
         optional: true
 
-  vite@8.0.1:
-    resolution: {integrity: sha512-wt+Z2qIhfFt85uiyRt5LPU4oVEJBXj8hZNWKeqFG4gRG/0RaRGJ7njQCwzFVjO+v4+Ipmf5CY7VdmZRAYYBPHw==}
+  vite@8.0.3:
+    resolution: {integrity: sha512-B9ifbFudT1TFhfltfaIPgjo9Z3mDynBTJSUYxTjOQruf/zHH+ezCQKcoqO+h7a9Pw9Nm/OtlXAiGT1axBgwqrQ==}
     engines: {node: ^20.19.0 || >=22.12.0}
     hasBin: true
     peerDependencies:
@@ -3980,8 +3980,8 @@ packages:
     resolution: {integrity: sha512-OTIk8iR8/aCRWBqvxrzxR0hgxWpnYBblY1S5hDWBQfk/VFmJwzmJgQFN3WsoUKHISv2eAwe+PpbUzyL1CKTLXg==}
     engines: {node: ^20.17.0 || >=22.9.0}
 
-  ws@8.19.0:
-    resolution: {integrity: sha512-blAT2mjOEIi0ZzruJfIhb3nps74PRWTCz1IjglWEEpQl5XS/UNama6u2/rjFkDDouqr4L67ry+1aGIALViWjDg==}
+  ws@8.20.0:
+    resolution: {integrity: sha512-sAt8BhgNbzCtgGbt2OxmpuryO63ZoDk/sqaB/znQm94T4fCEsy/yV+7CdC1kJhOU9lboAEU7R3kquuycDoibVA==}
     engines: {node: '>=10.0.0'}
     peerDependencies:
       bufferutil: ^4.0.1
@@ -4059,7 +4059,7 @@ snapshots:
       '@csstools/css-tokenizer': 4.0.0
       lru-cache: 11.2.7
 
-  '@asamuzakjp/dom-selector@7.0.3':
+  '@asamuzakjp/dom-selector@7.0.4':
     dependencies:
       '@asamuzakjp/nwsapi': 2.3.9
       bidi-js: 1.0.3
@@ -4194,17 +4194,17 @@ snapshots:
 
   '@cacheable/memory@2.0.8':
     dependencies:
-      '@cacheable/utils': 2.4.0
+      '@cacheable/utils': 2.4.1
       '@keyv/bigmap': 1.3.1(keyv@5.6.0)
       hookified: 1.15.1
       keyv: 5.6.0
 
-  '@cacheable/utils@2.4.0':
+  '@cacheable/utils@2.4.1':
     dependencies:
-      hashery: 1.5.0
+      hashery: 1.5.1
       keyv: 5.6.0
 
-  '@canonical/react-components@4.0.0(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(formik@2.4.9(@types/react@19.2.14)(react@19.2.4))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(vanilla-framework@4.46.0(sass@1.98.0))':
+  '@canonical/react-components@4.0.1(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(formik@2.4.9(@types/react@19.2.14)(react@19.2.4))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(vanilla-framework@4.46.0(sass@1.98.0))':
     dependencies:
       '@types/jest': 30.0.0
       '@types/node': 20.19.30
@@ -4405,7 +4405,7 @@ snapshots:
     dependencies:
       '@csstools/css-tokenizer': 4.0.0
 
-  '@csstools/css-syntax-patches-for-csstree@1.1.1(css-tree@3.2.1)':
+  '@csstools/css-syntax-patches-for-csstree@1.1.2(css-tree@3.2.1)':
     optionalDependencies:
       css-tree: 3.2.1
 
@@ -4710,7 +4710,7 @@ snapshots:
 
   '@keyv/bigmap@1.3.1(keyv@5.6.0)':
     dependencies:
-      hashery: 1.5.0
+      hashery: 1.5.1
       hookified: 1.15.1
       keyv: 5.6.0
 
@@ -4782,7 +4782,7 @@ snapshots:
 
   '@open-draft/until@2.1.0': {}
 
-  '@oxc-project/types@0.120.0': {}
+  '@oxc-project/types@0.122.0': {}
 
   '@parcel/watcher-android-arm64@2.5.6':
     optional: true
@@ -4828,7 +4828,7 @@ snapshots:
       detect-libc: 2.1.2
       is-glob: 4.0.3
       node-addon-api: 7.1.1
-      picomatch: 4.0.3
+      picomatch: 4.0.4
     optionalDependencies:
       '@parcel/watcher-android-arm64': 2.5.6
       '@parcel/watcher-darwin-arm64': 2.5.6
@@ -4852,164 +4852,164 @@ snapshots:
     dependencies:
       playwright: 1.58.2
 
-  '@rolldown/binding-android-arm64@1.0.0-rc.10':
+  '@rolldown/binding-android-arm64@1.0.0-rc.12':
     optional: true
 
-  '@rolldown/binding-darwin-arm64@1.0.0-rc.10':
+  '@rolldown/binding-darwin-arm64@1.0.0-rc.12':
     optional: true
 
-  '@rolldown/binding-darwin-x64@1.0.0-rc.10':
+  '@rolldown/binding-darwin-x64@1.0.0-rc.12':
     optional: true
 
-  '@rolldown/binding-freebsd-x64@1.0.0-rc.10':
+  '@rolldown/binding-freebsd-x64@1.0.0-rc.12':
     optional: true
 
-  '@rolldown/binding-linux-arm-gnueabihf@1.0.0-rc.10':
+  '@rolldown/binding-linux-arm-gnueabihf@1.0.0-rc.12':
     optional: true
 
-  '@rolldown/binding-linux-arm64-gnu@1.0.0-rc.10':
+  '@rolldown/binding-linux-arm64-gnu@1.0.0-rc.12':
     optional: true
 
-  '@rolldown/binding-linux-arm64-musl@1.0.0-rc.10':
+  '@rolldown/binding-linux-arm64-musl@1.0.0-rc.12':
     optional: true
 
-  '@rolldown/binding-linux-ppc64-gnu@1.0.0-rc.10':
+  '@rolldown/binding-linux-ppc64-gnu@1.0.0-rc.12':
     optional: true
 
-  '@rolldown/binding-linux-s390x-gnu@1.0.0-rc.10':
+  '@rolldown/binding-linux-s390x-gnu@1.0.0-rc.12':
     optional: true
 
-  '@rolldown/binding-linux-x64-gnu@1.0.0-rc.10':
+  '@rolldown/binding-linux-x64-gnu@1.0.0-rc.12':
     optional: true
 
-  '@rolldown/binding-linux-x64-musl@1.0.0-rc.10':
+  '@rolldown/binding-linux-x64-musl@1.0.0-rc.12':
     optional: true
 
-  '@rolldown/binding-openharmony-arm64@1.0.0-rc.10':
+  '@rolldown/binding-openharmony-arm64@1.0.0-rc.12':
     optional: true
 
-  '@rolldown/binding-wasm32-wasi@1.0.0-rc.10':
+  '@rolldown/binding-wasm32-wasi@1.0.0-rc.12':
     dependencies:
       '@napi-rs/wasm-runtime': 1.1.1
     optional: true
 
-  '@rolldown/binding-win32-arm64-msvc@1.0.0-rc.10':
+  '@rolldown/binding-win32-arm64-msvc@1.0.0-rc.12':
     optional: true
 
-  '@rolldown/binding-win32-x64-msvc@1.0.0-rc.10':
+  '@rolldown/binding-win32-x64-msvc@1.0.0-rc.12':
     optional: true
 
-  '@rolldown/pluginutils@1.0.0-rc.10': {}
+  '@rolldown/pluginutils@1.0.0-rc.12': {}
 
   '@rolldown/pluginutils@1.0.0-rc.7': {}
 
-  '@rollup/rollup-android-arm-eabi@4.59.0':
+  '@rollup/rollup-android-arm-eabi@4.60.0':
     optional: true
 
-  '@rollup/rollup-android-arm64@4.59.0':
+  '@rollup/rollup-android-arm64@4.60.0':
     optional: true
 
-  '@rollup/rollup-darwin-arm64@4.59.0':
+  '@rollup/rollup-darwin-arm64@4.60.0':
     optional: true
 
-  '@rollup/rollup-darwin-x64@4.59.0':
+  '@rollup/rollup-darwin-x64@4.60.0':
     optional: true
 
-  '@rollup/rollup-freebsd-arm64@4.59.0':
+  '@rollup/rollup-freebsd-arm64@4.60.0':
     optional: true
 
-  '@rollup/rollup-freebsd-x64@4.59.0':
+  '@rollup/rollup-freebsd-x64@4.60.0':
     optional: true
 
-  '@rollup/rollup-linux-arm-gnueabihf@4.59.0':
+  '@rollup/rollup-linux-arm-gnueabihf@4.60.0':
     optional: true
 
-  '@rollup/rollup-linux-arm-musleabihf@4.59.0':
+  '@rollup/rollup-linux-arm-musleabihf@4.60.0':
     optional: true
 
-  '@rollup/rollup-linux-arm64-gnu@4.59.0':
+  '@rollup/rollup-linux-arm64-gnu@4.60.0':
     optional: true
 
-  '@rollup/rollup-linux-arm64-musl@4.59.0':
+  '@rollup/rollup-linux-arm64-musl@4.60.0':
     optional: true
 
-  '@rollup/rollup-linux-loong64-gnu@4.59.0':
+  '@rollup/rollup-linux-loong64-gnu@4.60.0':
     optional: true
 
-  '@rollup/rollup-linux-loong64-musl@4.59.0':
+  '@rollup/rollup-linux-loong64-musl@4.60.0':
     optional: true
 
-  '@rollup/rollup-linux-ppc64-gnu@4.59.0':
+  '@rollup/rollup-linux-ppc64-gnu@4.60.0':
     optional: true
 
-  '@rollup/rollup-linux-ppc64-musl@4.59.0':
+  '@rollup/rollup-linux-ppc64-musl@4.60.0':
     optional: true
 
-  '@rollup/rollup-linux-riscv64-gnu@4.59.0':
+  '@rollup/rollup-linux-riscv64-gnu@4.60.0':
     optional: true
 
-  '@rollup/rollup-linux-riscv64-musl@4.59.0':
+  '@rollup/rollup-linux-riscv64-musl@4.60.0':
     optional: true
 
-  '@rollup/rollup-linux-s390x-gnu@4.59.0':
+  '@rollup/rollup-linux-s390x-gnu@4.60.0':
     optional: true
 
-  '@rollup/rollup-linux-x64-gnu@4.59.0':
+  '@rollup/rollup-linux-x64-gnu@4.60.0':
     optional: true
 
-  '@rollup/rollup-linux-x64-musl@4.59.0':
+  '@rollup/rollup-linux-x64-musl@4.60.0':
     optional: true
 
-  '@rollup/rollup-openbsd-x64@4.59.0':
+  '@rollup/rollup-openbsd-x64@4.60.0':
     optional: true
 
-  '@rollup/rollup-openharmony-arm64@4.59.0':
+  '@rollup/rollup-openharmony-arm64@4.60.0':
     optional: true
 
-  '@rollup/rollup-win32-arm64-msvc@4.59.0':
+  '@rollup/rollup-win32-arm64-msvc@4.60.0':
     optional: true
 
-  '@rollup/rollup-win32-ia32-msvc@4.59.0':
+  '@rollup/rollup-win32-ia32-msvc@4.60.0':
     optional: true
 
-  '@rollup/rollup-win32-x64-gnu@4.59.0':
+  '@rollup/rollup-win32-x64-gnu@4.60.0':
     optional: true
 
-  '@rollup/rollup-win32-x64-msvc@4.59.0':
+  '@rollup/rollup-win32-x64-msvc@4.60.0':
     optional: true
 
-  '@sentry-internal/browser-utils@10.45.0':
+  '@sentry-internal/browser-utils@10.46.0':
     dependencies:
-      '@sentry/core': 10.45.0
+      '@sentry/core': 10.46.0
 
-  '@sentry-internal/feedback@10.45.0':
+  '@sentry-internal/feedback@10.46.0':
     dependencies:
-      '@sentry/core': 10.45.0
+      '@sentry/core': 10.46.0
 
-  '@sentry-internal/replay-canvas@10.45.0':
+  '@sentry-internal/replay-canvas@10.46.0':
     dependencies:
-      '@sentry-internal/replay': 10.45.0
-      '@sentry/core': 10.45.0
+      '@sentry-internal/replay': 10.46.0
+      '@sentry/core': 10.46.0
 
-  '@sentry-internal/replay@10.45.0':
+  '@sentry-internal/replay@10.46.0':
     dependencies:
-      '@sentry-internal/browser-utils': 10.45.0
-      '@sentry/core': 10.45.0
+      '@sentry-internal/browser-utils': 10.46.0
+      '@sentry/core': 10.46.0
 
-  '@sentry/browser@10.45.0':
+  '@sentry/browser@10.46.0':
     dependencies:
-      '@sentry-internal/browser-utils': 10.45.0
-      '@sentry-internal/feedback': 10.45.0
-      '@sentry-internal/replay': 10.45.0
-      '@sentry-internal/replay-canvas': 10.45.0
-      '@sentry/core': 10.45.0
+      '@sentry-internal/browser-utils': 10.46.0
+      '@sentry-internal/feedback': 10.46.0
+      '@sentry-internal/replay': 10.46.0
+      '@sentry-internal/replay-canvas': 10.46.0
+      '@sentry/core': 10.46.0
 
-  '@sentry/core@10.45.0': {}
+  '@sentry/core@10.46.0': {}
 
-  '@sentry/react@10.45.0(react@19.2.4)':
+  '@sentry/react@10.46.0(react@19.2.4)':
     dependencies:
-      '@sentry/browser': 10.45.0
-      '@sentry/core': 10.45.0
+      '@sentry/browser': 10.46.0
+      '@sentry/core': 10.46.0
       react: 19.2.4
 
   '@sinclair/typebox@0.34.48': {}
@@ -5026,11 +5026,11 @@ snapshots:
 
   '@standard-schema/spec@1.1.0': {}
 
-  '@tanstack/query-core@5.91.2': {}
+  '@tanstack/query-core@5.95.2': {}
 
-  '@tanstack/react-query@5.91.2(react@19.2.4)':
+  '@tanstack/react-query@5.95.2(react@19.2.4)':
     dependencies:
-      '@tanstack/query-core': 5.91.2
+      '@tanstack/query-core': 5.95.2
       react: 19.2.4
 
   '@testing-library/dom@10.4.1':
@@ -5160,14 +5160,14 @@ snapshots:
     dependencies:
       '@types/yargs-parser': 21.0.3
 
-  '@typescript-eslint/eslint-plugin@8.57.1(@typescript-eslint/parser@8.57.1(eslint@9.39.4)(typescript@5.9.3))(eslint@9.39.4)(typescript@5.9.3)':
+  '@typescript-eslint/eslint-plugin@8.57.2(@typescript-eslint/parser@8.57.2(eslint@9.39.4)(typescript@5.9.3))(eslint@9.39.4)(typescript@5.9.3)':
     dependencies:
       '@eslint-community/regexpp': 4.12.2
-      '@typescript-eslint/parser': 8.57.1(eslint@9.39.4)(typescript@5.9.3)
-      '@typescript-eslint/scope-manager': 8.57.1
-      '@typescript-eslint/type-utils': 8.57.1(eslint@9.39.4)(typescript@5.9.3)
-      '@typescript-eslint/utils': 8.57.1(eslint@9.39.4)(typescript@5.9.3)
-      '@typescript-eslint/visitor-keys': 8.57.1
+      '@typescript-eslint/parser': 8.57.2(eslint@9.39.4)(typescript@5.9.3)
+      '@typescript-eslint/scope-manager': 8.57.2
+      '@typescript-eslint/type-utils': 8.57.2(eslint@9.39.4)(typescript@5.9.3)
+      '@typescript-eslint/utils': 8.57.2(eslint@9.39.4)(typescript@5.9.3)
+      '@typescript-eslint/visitor-keys': 8.57.2
       eslint: 9.39.4
       ignore: 7.0.5
       natural-compare: 1.4.0
@@ -5176,41 +5176,41 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/parser@8.57.1(eslint@9.39.4)(typescript@5.9.3)':
+  '@typescript-eslint/parser@8.57.2(eslint@9.39.4)(typescript@5.9.3)':
     dependencies:
-      '@typescript-eslint/scope-manager': 8.57.1
-      '@typescript-eslint/types': 8.57.1
-      '@typescript-eslint/typescript-estree': 8.57.1(typescript@5.9.3)
-      '@typescript-eslint/visitor-keys': 8.57.1
+      '@typescript-eslint/scope-manager': 8.57.2
+      '@typescript-eslint/types': 8.57.2
+      '@typescript-eslint/typescript-estree': 8.57.2(typescript@5.9.3)
+      '@typescript-eslint/visitor-keys': 8.57.2
       debug: 4.4.3
       eslint: 9.39.4
       typescript: 5.9.3
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/project-service@8.57.1(typescript@5.9.3)':
+  '@typescript-eslint/project-service@8.57.2(typescript@5.9.3)':
     dependencies:
-      '@typescript-eslint/tsconfig-utils': 8.57.1(typescript@5.9.3)
-      '@typescript-eslint/types': 8.57.1
+      '@typescript-eslint/tsconfig-utils': 8.57.2(typescript@5.9.3)
+      '@typescript-eslint/types': 8.57.2
       debug: 4.4.3
       typescript: 5.9.3
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/scope-manager@8.57.1':
+  '@typescript-eslint/scope-manager@8.57.2':
     dependencies:
-      '@typescript-eslint/types': 8.57.1
-      '@typescript-eslint/visitor-keys': 8.57.1
+      '@typescript-eslint/types': 8.57.2
+      '@typescript-eslint/visitor-keys': 8.57.2
 
-  '@typescript-eslint/tsconfig-utils@8.57.1(typescript@5.9.3)':
+  '@typescript-eslint/tsconfig-utils@8.57.2(typescript@5.9.3)':
     dependencies:
       typescript: 5.9.3
 
-  '@typescript-eslint/type-utils@8.57.1(eslint@9.39.4)(typescript@5.9.3)':
+  '@typescript-eslint/type-utils@8.57.2(eslint@9.39.4)(typescript@5.9.3)':
     dependencies:
-      '@typescript-eslint/types': 8.57.1
-      '@typescript-eslint/typescript-estree': 8.57.1(typescript@5.9.3)
-      '@typescript-eslint/utils': 8.57.1(eslint@9.39.4)(typescript@5.9.3)
+      '@typescript-eslint/types': 8.57.2
+      '@typescript-eslint/typescript-estree': 8.57.2(typescript@5.9.3)
+      '@typescript-eslint/utils': 8.57.2(eslint@9.39.4)(typescript@5.9.3)
       debug: 4.4.3
       eslint: 9.39.4
       ts-api-utils: 2.5.0(typescript@5.9.3)
@@ -5218,14 +5218,14 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/types@8.57.1': {}
+  '@typescript-eslint/types@8.57.2': {}
 
-  '@typescript-eslint/typescript-estree@8.57.1(typescript@5.9.3)':
+  '@typescript-eslint/typescript-estree@8.57.2(typescript@5.9.3)':
     dependencies:
-      '@typescript-eslint/project-service': 8.57.1(typescript@5.9.3)
-      '@typescript-eslint/tsconfig-utils': 8.57.1(typescript@5.9.3)
-      '@typescript-eslint/types': 8.57.1
-      '@typescript-eslint/visitor-keys': 8.57.1
+      '@typescript-eslint/project-service': 8.57.2(typescript@5.9.3)
+      '@typescript-eslint/tsconfig-utils': 8.57.2(typescript@5.9.3)
+      '@typescript-eslint/types': 8.57.2
+      '@typescript-eslint/visitor-keys': 8.57.2
       debug: 4.4.3
       minimatch: 10.2.4
       semver: 7.7.4
@@ -5235,28 +5235,28 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/utils@8.57.1(eslint@9.39.4)(typescript@5.9.3)':
+  '@typescript-eslint/utils@8.57.2(eslint@9.39.4)(typescript@5.9.3)':
     dependencies:
       '@eslint-community/eslint-utils': 4.9.1(eslint@9.39.4)
-      '@typescript-eslint/scope-manager': 8.57.1
-      '@typescript-eslint/types': 8.57.1
-      '@typescript-eslint/typescript-estree': 8.57.1(typescript@5.9.3)
+      '@typescript-eslint/scope-manager': 8.57.2
+      '@typescript-eslint/types': 8.57.2
+      '@typescript-eslint/typescript-estree': 8.57.2(typescript@5.9.3)
       eslint: 9.39.4
       typescript: 5.9.3
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/visitor-keys@8.57.1':
+  '@typescript-eslint/visitor-keys@8.57.2':
     dependencies:
-      '@typescript-eslint/types': 8.57.1
+      '@typescript-eslint/types': 8.57.2
       eslint-visitor-keys: 5.0.1
 
-  '@vitejs/plugin-react@6.0.1(vite@8.0.1(@types/node@24.12.0)(esbuild@0.27.4)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1))':
+  '@vitejs/plugin-react@6.0.1(vite@8.0.3(@types/node@24.12.0)(esbuild@0.27.4)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1))':
     dependencies:
       '@rolldown/pluginutils': 1.0.0-rc.7
-      vite: 8.0.1(@types/node@24.12.0)(esbuild@0.27.4)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1)
+      vite: 8.0.3(@types/node@24.12.0)(esbuild@0.27.4)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1)
 
-  '@vitest/coverage-v8@4.0.18(vitest@4.0.18(@types/node@24.12.0)(jsdom@29.0.0)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1))':
+  '@vitest/coverage-v8@4.0.18(vitest@4.0.18(@types/node@24.12.0)(jsdom@29.0.1)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1))':
     dependencies:
       '@bcoe/v8-coverage': 1.0.2
       '@vitest/utils': 4.0.18
@@ -5268,7 +5268,7 @@ snapshots:
       obug: 2.1.1
       std-env: 3.10.0
       tinyrainbow: 3.1.0
-      vitest: 4.0.18(@types/node@24.12.0)(jsdom@29.0.0)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1)
+      vitest: 4.0.18(@types/node@24.12.0)(jsdom@29.0.1)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1)
 
   '@vitest/expect@4.0.18':
     dependencies:
@@ -5353,7 +5353,7 @@ snapshots:
   anymatch@3.1.3:
     dependencies:
       normalize-path: 3.0.0
-      picomatch: 2.3.1
+      picomatch: 2.3.2
 
   argparse@1.0.10:
     dependencies:
@@ -5458,7 +5458,7 @@ snapshots:
 
   base64-js@1.5.1: {}
 
-  baseline-browser-mapping@2.10.9: {}
+  baseline-browser-mapping@2.10.11: {}
 
   better-path-resolve@1.0.0:
     dependencies:
@@ -5470,16 +5470,16 @@ snapshots:
 
   binary-extensions@2.3.0: {}
 
-  brace-expansion@1.1.12:
+  brace-expansion@1.1.13:
     dependencies:
       balanced-match: 1.0.2
       concat-map: 0.0.1
 
-  brace-expansion@2.0.2:
+  brace-expansion@2.0.3:
     dependencies:
       balanced-match: 1.0.2
 
-  brace-expansion@5.0.4:
+  brace-expansion@5.0.5:
     dependencies:
       balanced-match: 4.0.4
 
@@ -5489,9 +5489,9 @@ snapshots:
 
   browserslist@4.28.1:
     dependencies:
-      baseline-browser-mapping: 2.10.9
-      caniuse-lite: 1.0.30001780
-      electron-to-chromium: 1.5.321
+      baseline-browser-mapping: 2.10.11
+      caniuse-lite: 1.0.30001781
+      electron-to-chromium: 1.5.328
       node-releases: 2.0.36
       update-browserslist-db: 1.2.3(browserslist@4.28.1)
 
@@ -5503,7 +5503,7 @@ snapshots:
   cacheable@2.3.4:
     dependencies:
       '@cacheable/memory': 2.0.8
-      '@cacheable/utils': 2.4.0
+      '@cacheable/utils': 2.4.1
       hookified: 1.15.1
       keyv: 5.6.0
       qified: 0.9.0
@@ -5529,7 +5529,7 @@ snapshots:
 
   camelcase@6.3.0: {}
 
-  caniuse-lite@1.0.30001780: {}
+  caniuse-lite@1.0.30001781: {}
 
   chai@6.2.2: {}
 
@@ -5722,7 +5722,7 @@ snapshots:
 
   eastasianwidth@0.2.0: {}
 
-  electron-to-chromium@1.5.321: {}
+  electron-to-chromium@1.5.328: {}
 
   emoji-regex@8.0.0: {}
 
@@ -6026,13 +6026,13 @@ snapshots:
     dependencies:
       reusify: 1.1.0
 
-  fdir@6.5.0(picomatch@4.0.3):
+  fdir@6.5.0(picomatch@4.0.4):
     optionalDependencies:
-      picomatch: 4.0.3
+      picomatch: 4.0.4
 
   file-entry-cache@11.1.2:
     dependencies:
-      flat-cache: 6.1.21
+      flat-cache: 6.1.22
 
   file-entry-cache@8.0.0:
     dependencies:
@@ -6057,7 +6057,7 @@ snapshots:
       flatted: 3.4.2
       keyv: 4.5.4
 
-  flat-cache@6.1.21:
+  flat-cache@6.1.22:
     dependencies:
       cacheable: 2.3.4
       flatted: 3.4.2
@@ -6206,7 +6206,7 @@ snapshots:
       merge2: 1.4.1
       slash: 3.0.0
 
-  globby@16.1.1:
+  globby@16.2.0:
     dependencies:
       '@sindresorhus/merge-streams': 4.0.0
       fast-glob: 3.3.3
@@ -6221,7 +6221,7 @@ snapshots:
 
   graceful-fs@4.2.11: {}
 
-  graphql@16.13.1: {}
+  graphql@16.13.2: {}
 
   has-bigints@1.1.0: {}
 
@@ -6243,7 +6243,7 @@ snapshots:
     dependencies:
       has-symbols: 1.1.0
 
-  hashery@1.5.0:
+  hashery@1.5.1:
     dependencies:
       hookified: 1.15.1
 
@@ -6547,7 +6547,7 @@ snapshots:
       '@types/stack-utils': 2.0.3
       chalk: 4.1.2
       graceful-fs: 4.2.11
-      picomatch: 4.0.3
+      picomatch: 4.0.4
       pretty-format: 30.3.0
       slash: 3.0.0
       stack-utils: 2.0.6
@@ -6573,7 +6573,7 @@ snapshots:
       chalk: 4.1.2
       ci-info: 4.4.0
       graceful-fs: 4.2.11
-      picomatch: 4.0.3
+      picomatch: 4.0.4
 
   jest-util@30.3.0:
     dependencies:
@@ -6582,7 +6582,7 @@ snapshots:
       chalk: 4.1.2
       ci-info: 4.4.0
       graceful-fs: 4.2.11
-      picomatch: 4.0.3
+      picomatch: 4.0.4
 
   js-tokens@10.0.0: {}
 
@@ -6617,19 +6617,19 @@ snapshots:
       whatwg-encoding: 3.1.1
       whatwg-mimetype: 4.0.0
       whatwg-url: 14.2.0
-      ws: 8.19.0
+      ws: 8.20.0
       xml-name-validator: 5.0.0
     transitivePeerDependencies:
       - bufferutil
       - supports-color
       - utf-8-validate
 
-  jsdom@29.0.0:
+  jsdom@29.0.1:
     dependencies:
       '@asamuzakjp/css-color': 5.0.1
-      '@asamuzakjp/dom-selector': 7.0.3
+      '@asamuzakjp/dom-selector': 7.0.4
       '@bramus/specificity': 2.4.2
-      '@csstools/css-syntax-patches-for-csstree': 1.1.1(css-tree@3.2.1)
+      '@csstools/css-syntax-patches-for-csstree': 1.1.2(css-tree@3.2.1)
       '@exodus/bytes': 1.15.0
       css-tree: 3.2.1
       data-urls: 7.0.0
@@ -6641,7 +6641,7 @@ snapshots:
       saxes: 6.0.0
       symbol-tree: 3.2.4
       tough-cookie: 6.0.1
-      undici: 7.24.5
+      undici: 7.24.6
       w3c-xmlserializer: 5.0.0
       webidl-conversions: 8.0.1
       whatwg-mimetype: 5.0.0
@@ -6806,7 +6806,7 @@ snapshots:
   micromatch@4.0.8:
     dependencies:
       braces: 3.0.3
-      picomatch: 2.3.1
+      picomatch: 2.3.2
 
   mime-db@1.52.0: {}
 
@@ -6818,15 +6818,15 @@ snapshots:
 
   minimatch@10.2.4:
     dependencies:
-      brace-expansion: 5.0.4
+      brace-expansion: 5.0.5
 
   minimatch@3.1.5:
     dependencies:
-      brace-expansion: 1.1.12
+      brace-expansion: 1.1.13
 
   minimatch@9.0.9:
     dependencies:
-      brace-expansion: 2.0.2
+      brace-expansion: 2.0.3
 
   minipass@7.1.3: {}
 
@@ -6854,7 +6854,7 @@ snapshots:
       '@types/cookie': 0.6.0
       '@types/statuses': 2.0.6
       chalk: 4.1.2
-      graphql: 16.13.1
+      graphql: 16.13.2
       headers-polyfill: 4.0.3
       is-node-process: 1.2.0
       outvariant: 1.4.3
@@ -7006,7 +7006,7 @@ snapshots:
 
   path-to-regexp@6.3.0: {}
 
-  path-to-regexp@8.3.0: {}
+  path-to-regexp@8.4.0: {}
 
   path-type@4.0.0: {}
 
@@ -7014,9 +7014,9 @@ snapshots:
 
   picocolors@1.1.1: {}
 
-  picomatch@2.3.1: {}
+  picomatch@2.3.2: {}
 
-  picomatch@4.0.3: {}
+  picomatch@4.0.4: {}
 
   pify@4.0.1: {}
 
@@ -7148,7 +7148,7 @@ snapshots:
 
   react-is@18.3.1: {}
 
-  react-router@7.13.1(react-dom@19.2.4(react@19.2.4))(react@19.2.4):
+  react-router@7.13.2(react-dom@19.2.4(react@19.2.4))(react@19.2.4):
     dependencies:
       cookie: 1.1.1
       react: 19.2.4
@@ -7171,7 +7171,7 @@ snapshots:
 
   readdirp@3.6.0:
     dependencies:
-      picomatch: 2.3.1
+      picomatch: 2.3.2
 
   readdirp@4.1.2: {}
 
@@ -7221,56 +7221,56 @@ snapshots:
 
   reusify@1.1.0: {}
 
-  rolldown@1.0.0-rc.10:
+  rolldown@1.0.0-rc.12:
     dependencies:
-      '@oxc-project/types': 0.120.0
-      '@rolldown/pluginutils': 1.0.0-rc.10
+      '@oxc-project/types': 0.122.0
+      '@rolldown/pluginutils': 1.0.0-rc.12
     optionalDependencies:
-      '@rolldown/binding-android-arm64': 1.0.0-rc.10
-      '@rolldown/binding-darwin-arm64': 1.0.0-rc.10
-      '@rolldown/binding-darwin-x64': 1.0.0-rc.10
-      '@rolldown/binding-freebsd-x64': 1.0.0-rc.10
-      '@rolldown/binding-linux-arm-gnueabihf': 1.0.0-rc.10
-      '@rolldown/binding-linux-arm64-gnu': 1.0.0-rc.10
-      '@rolldown/binding-linux-arm64-musl': 1.0.0-rc.10
-      '@rolldown/binding-linux-ppc64-gnu': 1.0.0-rc.10
-      '@rolldown/binding-linux-s390x-gnu': 1.0.0-rc.10
-      '@rolldown/binding-linux-x64-gnu': 1.0.0-rc.10
-      '@rolldown/binding-linux-x64-musl': 1.0.0-rc.10
-      '@rolldown/binding-openharmony-arm64': 1.0.0-rc.10
-      '@rolldown/binding-wasm32-wasi': 1.0.0-rc.10
-      '@rolldown/binding-win32-arm64-msvc': 1.0.0-rc.10
-      '@rolldown/binding-win32-x64-msvc': 1.0.0-rc.10
-
-  rollup@4.59.0:
+      '@rolldown/binding-android-arm64': 1.0.0-rc.12
+      '@rolldown/binding-darwin-arm64': 1.0.0-rc.12
+      '@rolldown/binding-darwin-x64': 1.0.0-rc.12
+      '@rolldown/binding-freebsd-x64': 1.0.0-rc.12
+      '@rolldown/binding-linux-arm-gnueabihf': 1.0.0-rc.12
+      '@rolldown/binding-linux-arm64-gnu': 1.0.0-rc.12
+      '@rolldown/binding-linux-arm64-musl': 1.0.0-rc.12
+      '@rolldown/binding-linux-ppc64-gnu': 1.0.0-rc.12
+      '@rolldown/binding-linux-s390x-gnu': 1.0.0-rc.12
+      '@rolldown/binding-linux-x64-gnu': 1.0.0-rc.12
+      '@rolldown/binding-linux-x64-musl': 1.0.0-rc.12
+      '@rolldown/binding-openharmony-arm64': 1.0.0-rc.12
+      '@rolldown/binding-wasm32-wasi': 1.0.0-rc.12
+      '@rolldown/binding-win32-arm64-msvc': 1.0.0-rc.12
+      '@rolldown/binding-win32-x64-msvc': 1.0.0-rc.12
+
+  rollup@4.60.0:
     dependencies:
       '@types/estree': 1.0.8
     optionalDependencies:
-      '@rollup/rollup-android-arm-eabi': 4.59.0
-      '@rollup/rollup-android-arm64': 4.59.0
-      '@rollup/rollup-darwin-arm64': 4.59.0
-      '@rollup/rollup-darwin-x64': 4.59.0
-      '@rollup/rollup-freebsd-arm64': 4.59.0
-      '@rollup/rollup-freebsd-x64': 4.59.0
-      '@rollup/rollup-linux-arm-gnueabihf': 4.59.0
-      '@rollup/rollup-linux-arm-musleabihf': 4.59.0
-      '@rollup/rollup-linux-arm64-gnu': 4.59.0
-      '@rollup/rollup-linux-arm64-musl': 4.59.0
-      '@rollup/rollup-linux-loong64-gnu': 4.59.0
-      '@rollup/rollup-linux-loong64-musl': 4.59.0
-      '@rollup/rollup-linux-ppc64-gnu': 4.59.0
-      '@rollup/rollup-linux-ppc64-musl': 4.59.0
-      '@rollup/rollup-linux-riscv64-gnu': 4.59.0
-      '@rollup/rollup-linux-riscv64-musl': 4.59.0
-      '@rollup/rollup-linux-s390x-gnu': 4.59.0
-      '@rollup/rollup-linux-x64-gnu': 4.59.0
-      '@rollup/rollup-linux-x64-musl': 4.59.0
-      '@rollup/rollup-openbsd-x64': 4.59.0
-      '@rollup/rollup-openharmony-arm64': 4.59.0
-      '@rollup/rollup-win32-arm64-msvc': 4.59.0
-      '@rollup/rollup-win32-ia32-msvc': 4.59.0
-      '@rollup/rollup-win32-x64-gnu': 4.59.0
-      '@rollup/rollup-win32-x64-msvc': 4.59.0
+      '@rollup/rollup-android-arm-eabi': 4.60.0
+      '@rollup/rollup-android-arm64': 4.60.0
+      '@rollup/rollup-darwin-arm64': 4.60.0
+      '@rollup/rollup-darwin-x64': 4.60.0
+      '@rollup/rollup-freebsd-arm64': 4.60.0
+      '@rollup/rollup-freebsd-x64': 4.60.0
+      '@rollup/rollup-linux-arm-gnueabihf': 4.60.0
+      '@rollup/rollup-linux-arm-musleabihf': 4.60.0
+      '@rollup/rollup-linux-arm64-gnu': 4.60.0
+      '@rollup/rollup-linux-arm64-musl': 4.60.0
+      '@rollup/rollup-linux-loong64-gnu': 4.60.0
+      '@rollup/rollup-linux-loong64-musl': 4.60.0
+      '@rollup/rollup-linux-ppc64-gnu': 4.60.0
+      '@rollup/rollup-linux-ppc64-musl': 4.60.0
+      '@rollup/rollup-linux-riscv64-gnu': 4.60.0
+      '@rollup/rollup-linux-riscv64-musl': 4.60.0
+      '@rollup/rollup-linux-s390x-gnu': 4.60.0
+      '@rollup/rollup-linux-x64-gnu': 4.60.0
+      '@rollup/rollup-linux-x64-musl': 4.60.0
+      '@rollup/rollup-openbsd-x64': 4.60.0
+      '@rollup/rollup-openharmony-arm64': 4.60.0
+      '@rollup/rollup-win32-arm64-msvc': 4.60.0
+      '@rollup/rollup-win32-ia32-msvc': 4.60.0
+      '@rollup/rollup-win32-x64-gnu': 4.60.0
+      '@rollup/rollup-win32-x64-msvc': 4.60.0
       fsevents: 2.3.3
 
   rrweb-cssom@0.8.0: {}
@@ -7586,39 +7586,39 @@ snapshots:
 
   strip-json-comments@3.1.1: {}
 
-  stylelint-config-recommended-scss@17.0.0(postcss@8.5.8)(stylelint@17.5.0(typescript@5.9.3)):
+  stylelint-config-recommended-scss@17.0.0(postcss@8.5.8)(stylelint@17.6.0(typescript@5.9.3)):
     dependencies:
       postcss-scss: 4.0.9(postcss@8.5.8)
-      stylelint: 17.5.0(typescript@5.9.3)
-      stylelint-config-recommended: 18.0.0(stylelint@17.5.0(typescript@5.9.3))
-      stylelint-scss: 7.0.0(stylelint@17.5.0(typescript@5.9.3))
+      stylelint: 17.6.0(typescript@5.9.3)
+      stylelint-config-recommended: 18.0.0(stylelint@17.6.0(typescript@5.9.3))
+      stylelint-scss: 7.0.0(stylelint@17.6.0(typescript@5.9.3))
     optionalDependencies:
       postcss: 8.5.8
 
-  stylelint-config-recommended@18.0.0(stylelint@17.5.0(typescript@5.9.3)):
+  stylelint-config-recommended@18.0.0(stylelint@17.6.0(typescript@5.9.3)):
     dependencies:
-      stylelint: 17.5.0(typescript@5.9.3)
+      stylelint: 17.6.0(typescript@5.9.3)
 
-  stylelint-config-standard-scss@17.0.0(postcss@8.5.8)(stylelint@17.5.0(typescript@5.9.3)):
+  stylelint-config-standard-scss@17.0.0(postcss@8.5.8)(stylelint@17.6.0(typescript@5.9.3)):
     dependencies:
-      stylelint: 17.5.0(typescript@5.9.3)
-      stylelint-config-recommended-scss: 17.0.0(postcss@8.5.8)(stylelint@17.5.0(typescript@5.9.3))
-      stylelint-config-standard: 40.0.0(stylelint@17.5.0(typescript@5.9.3))
+      stylelint: 17.6.0(typescript@5.9.3)
+      stylelint-config-recommended-scss: 17.0.0(postcss@8.5.8)(stylelint@17.6.0(typescript@5.9.3))
+      stylelint-config-standard: 40.0.0(stylelint@17.6.0(typescript@5.9.3))
     optionalDependencies:
       postcss: 8.5.8
 
-  stylelint-config-standard@40.0.0(stylelint@17.5.0(typescript@5.9.3)):
+  stylelint-config-standard@40.0.0(stylelint@17.6.0(typescript@5.9.3)):
     dependencies:
-      stylelint: 17.5.0(typescript@5.9.3)
-      stylelint-config-recommended: 18.0.0(stylelint@17.5.0(typescript@5.9.3))
+      stylelint: 17.6.0(typescript@5.9.3)
+      stylelint-config-recommended: 18.0.0(stylelint@17.6.0(typescript@5.9.3))
 
-  stylelint-order@8.1.1(stylelint@17.5.0(typescript@5.9.3)):
+  stylelint-order@8.1.1(stylelint@17.6.0(typescript@5.9.3)):
     dependencies:
       postcss: 8.5.8
       postcss-sorting: 10.0.0(postcss@8.5.8)
-      stylelint: 17.5.0(typescript@5.9.3)
+      stylelint: 17.6.0(typescript@5.9.3)
 
-  stylelint-scss@7.0.0(stylelint@17.5.0(typescript@5.9.3)):
+  stylelint-scss@7.0.0(stylelint@17.6.0(typescript@5.9.3)):
     dependencies:
       css-tree: 3.2.1
       is-plain-object: 5.0.0
@@ -7628,13 +7628,13 @@ snapshots:
       postcss-resolve-nested-selector: 0.1.6
       postcss-selector-parser: 7.1.1
       postcss-value-parser: 4.2.0
-      stylelint: 17.5.0(typescript@5.9.3)
+      stylelint: 17.6.0(typescript@5.9.3)
 
-  stylelint@17.5.0(typescript@5.9.3):
+  stylelint@17.6.0(typescript@5.9.3):
     dependencies:
       '@csstools/css-calc': 3.1.1(@csstools/css-parser-algorithms@4.0.0(@csstools/css-tokenizer@4.0.0))(@csstools/css-tokenizer@4.0.0)
       '@csstools/css-parser-algorithms': 4.0.0(@csstools/css-tokenizer@4.0.0)
-      '@csstools/css-syntax-patches-for-csstree': 1.1.1(css-tree@3.2.1)
+      '@csstools/css-syntax-patches-for-csstree': 1.1.2(css-tree@3.2.1)
       '@csstools/css-tokenizer': 4.0.0
       '@csstools/media-query-list-parser': 5.0.0(@csstools/css-parser-algorithms@4.0.0(@csstools/css-tokenizer@4.0.0))(@csstools/css-tokenizer@4.0.0)
       '@csstools/selector-resolve-nested': 4.0.0(postcss-selector-parser@7.1.1)
@@ -7648,12 +7648,11 @@ snapshots:
       fastest-levenshtein: 1.0.16
       file-entry-cache: 11.1.2
       global-modules: 2.0.0
-      globby: 16.1.1
+      globby: 16.2.0
       globjoin: 0.1.4
       html-tags: 5.1.0
       ignore: 7.0.5
       import-meta-resolve: 4.2.0
-      imurmurhash: 0.1.4
       is-plain-object: 5.0.0
       mathml-tag-names: 4.0.0
       meow: 14.1.0
@@ -7720,22 +7719,22 @@ snapshots:
 
   tinyglobby@0.2.15:
     dependencies:
-      fdir: 6.5.0(picomatch@4.0.3)
-      picomatch: 4.0.3
+      fdir: 6.5.0(picomatch@4.0.4)
+      picomatch: 4.0.4
 
   tinyrainbow@3.1.0: {}
 
   tldts-core@6.1.86: {}
 
-  tldts-core@7.0.26: {}
+  tldts-core@7.0.27: {}
 
   tldts@6.1.86:
     dependencies:
       tldts-core: 6.1.86
 
-  tldts@7.0.26:
+  tldts@7.0.27:
     dependencies:
-      tldts-core: 7.0.26
+      tldts-core: 7.0.27
 
   to-regex-range@5.0.1:
     dependencies:
@@ -7756,7 +7755,7 @@ snapshots:
 
   tough-cookie@6.0.1:
     dependencies:
-      tldts: 7.0.26
+      tldts: 7.0.27
 
   tr46@5.1.1:
     dependencies:
@@ -7833,12 +7832,12 @@ snapshots:
       postcss-modules-values: 4.0.0(postcss@8.5.8)
       yargs: 17.7.2
 
-  typescript-eslint@8.57.1(eslint@9.39.4)(typescript@5.9.3):
+  typescript-eslint@8.57.2(eslint@9.39.4)(typescript@5.9.3):
     dependencies:
-      '@typescript-eslint/eslint-plugin': 8.57.1(@typescript-eslint/parser@8.57.1(eslint@9.39.4)(typescript@5.9.3))(eslint@9.39.4)(typescript@5.9.3)
-      '@typescript-eslint/parser': 8.57.1(eslint@9.39.4)(typescript@5.9.3)
-      '@typescript-eslint/typescript-estree': 8.57.1(typescript@5.9.3)
-      '@typescript-eslint/utils': 8.57.1(eslint@9.39.4)(typescript@5.9.3)
+      '@typescript-eslint/eslint-plugin': 8.57.2(@typescript-eslint/parser@8.57.2(eslint@9.39.4)(typescript@5.9.3))(eslint@9.39.4)(typescript@5.9.3)
+      '@typescript-eslint/parser': 8.57.2(eslint@9.39.4)(typescript@5.9.3)
+      '@typescript-eslint/typescript-estree': 8.57.2(typescript@5.9.3)
+      '@typescript-eslint/utils': 8.57.2(eslint@9.39.4)(typescript@5.9.3)
       eslint: 9.39.4
       typescript: 5.9.3
     transitivePeerDependencies:
@@ -7857,7 +7856,7 @@ snapshots:
 
   undici-types@7.16.0: {}
 
-  undici@7.24.5: {}
+  undici@7.24.6: {}
 
   unicorn-magic@0.4.0: {}
 
@@ -7896,10 +7895,10 @@ snapshots:
   vite@7.3.1(@types/node@24.12.0)(lightningcss@1.32.0)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1):
     dependencies:
       esbuild: 0.27.4
-      fdir: 6.5.0(picomatch@4.0.3)
-      picomatch: 4.0.3
+      fdir: 6.5.0(picomatch@4.0.4)
+      picomatch: 4.0.4
       postcss: 8.5.8
-      rollup: 4.59.0
+      rollup: 4.60.0
       tinyglobby: 0.2.15
     optionalDependencies:
       '@types/node': 24.12.0
@@ -7909,12 +7908,12 @@ snapshots:
       sass-embedded: 1.98.0
       yaml: 2.8.1
 
-  vite@8.0.1(@types/node@24.12.0)(esbuild@0.27.4)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1):
+  vite@8.0.3(@types/node@24.12.0)(esbuild@0.27.4)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1):
     dependencies:
       lightningcss: 1.32.0
-      picomatch: 4.0.3
+      picomatch: 4.0.4
       postcss: 8.5.8
-      rolldown: 1.0.0-rc.10
+      rolldown: 1.0.0-rc.12
       tinyglobby: 0.2.15
     optionalDependencies:
       '@types/node': 24.12.0
@@ -7924,7 +7923,7 @@ snapshots:
       sass-embedded: 1.98.0
       yaml: 2.8.1
 
-  vitest@4.0.18(@types/node@24.12.0)(jsdom@29.0.0)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1):
+  vitest@4.0.18(@types/node@24.12.0)(jsdom@29.0.1)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1):
     dependencies:
       '@vitest/expect': 4.0.18
       '@vitest/mocker': 4.0.18(msw@2.4.11(typescript@5.9.3))(vite@7.3.1(@types/node@24.12.0)(lightningcss@1.32.0)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1))
@@ -7938,7 +7937,7 @@ snapshots:
       magic-string: 0.30.21
       obug: 2.1.1
       pathe: 2.0.3
-      picomatch: 4.0.3
+      picomatch: 4.0.4
       std-env: 3.10.0
       tinybench: 2.9.0
       tinyexec: 1.0.4
@@ -7948,7 +7947,7 @@ snapshots:
       why-is-node-running: 2.3.0
     optionalDependencies:
       '@types/node': 24.12.0
-      jsdom: 29.0.0
+      jsdom: 29.0.1
     transitivePeerDependencies:
       - jiti
       - less
@@ -8069,7 +8068,7 @@ snapshots:
     dependencies:
       signal-exit: 4.1.0
 
-  ws@8.19.0: {}
+  ws@8.20.0: {}
 
   xml-name-validator@5.0.0: {}
 

From 1f8061f1ca941f3fac3290ae9aeae4b71e330938 Mon Sep 17 00:00:00 2001
From: Rubin Aga <66167934+rubinaga@users.noreply.github.com>
Date: Thu, 2 Apr 2026 10:11:18 +0200
Subject: [PATCH 04/42] fix: computer alert always showing Online in single
 instance view (#532)

## Summary

This PR covers [this Jira
ticket](https://warthogs.atlassian.net/browse/LNDENG-4039)
The backend was never providing an alerts array on the individual `GET
/computers/:id` request. So the UI was always showing `Online` status
for machines. The change was mainly backend related. Now I added a
`with_alerts` flag to the endpoint to fetch that information.

## Release Impact

According to the [Landscape Server Release
Cycle](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `dev` / `main` (Beta)
- **Version Impact**:
  - [x] Patch (Fix)
  - [ ] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [x] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [x] **UI Verified**: I have verified the changes locally.
- [x] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.
---
 .changeset/itchy-bikes-give.md                               | 5 +++++
 src/features/instances/api/useGetInstance.ts                 | 1 +
 .../SingleInstanceContainer/SingleInstanceContainer.tsx      | 1 +
 src/tests/mocks/instance.ts                                  | 5 +++++
 4 files changed, 12 insertions(+)
 create mode 100644 .changeset/itchy-bikes-give.md

diff --git a/.changeset/itchy-bikes-give.md b/.changeset/itchy-bikes-give.md
new file mode 100644
index 000000000..a073a4f92
--- /dev/null
+++ b/.changeset/itchy-bikes-give.md
@@ -0,0 +1,5 @@
+---
+"landscape-ui": patch
+---
+
+Fix computer alert always showing as Online in detailed instance view
diff --git a/src/features/instances/api/useGetInstance.ts b/src/features/instances/api/useGetInstance.ts
index 5fe1701a4..b4a671092 100644
--- a/src/features/instances/api/useGetInstance.ts
+++ b/src/features/instances/api/useGetInstance.ts
@@ -12,6 +12,7 @@ export interface GetInstanceParams {
   with_hardware?: boolean;
   with_network?: boolean;
   with_profiles?: boolean;
+  with_alerts?: boolean;
 }
 
 export const useGetInstance = (
diff --git a/src/pages/dashboard/instances/[single]/SingleInstanceContainer/SingleInstanceContainer.tsx b/src/pages/dashboard/instances/[single]/SingleInstanceContainer/SingleInstanceContainer.tsx
index 50330b154..da50f98be 100644
--- a/src/pages/dashboard/instances/[single]/SingleInstanceContainer/SingleInstanceContainer.tsx
+++ b/src/pages/dashboard/instances/[single]/SingleInstanceContainer/SingleInstanceContainer.tsx
@@ -64,6 +64,7 @@ const SingleInstanceContainer: FC = () => {
       with_annotations: true,
       with_grouped_hardware: true,
       with_profiles: true,
+      with_alerts: true,
     },
     {
       enabled: isInstanceQueryEnabled(
diff --git a/src/tests/mocks/instance.ts b/src/tests/mocks/instance.ts
index b246a135c..71e12922a 100644
--- a/src/tests/mocks/instance.ts
+++ b/src/tests/mocks/instance.ts
@@ -39,6 +39,11 @@ export const ubuntuInstance: Instance = {
       summary: "",
       severity: "info",
     },
+    {
+      type: "EsmDisabledAlert",
+      summary: "ESM disabled",
+      severity: "warning",
+    },
   ],
   distribution_info: {
     code_name: "lucid",

From c407afa81039a4fec281a2780c38cfe9ced125db Mon Sep 17 00:00:00 2001
From: Rubin Aga <66167934+rubinaga@users.noreply.github.com>
Date: Thu, 2 Apr 2026 11:40:33 +0200
Subject: [PATCH 05/42] feat: improve agent instructions (#522)

## Summary

Added `AGENTS.md` file to replace `copilot-instructions`. This file
should be compatible with different agents, and explain our project in
more detail so we can use agents to contribute faster in our codebase.

## Release Impact

According to the [Landscape Server Release
Cycle](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `dev` / `main` (Beta)
- **Version Impact**:
  - [ ] Patch (Fix)
  - [ ] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [ ] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [ ] **UI Verified**: I have verified the changes locally.
- [ ] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.
---
 .github/copilot-instructions.md | 465 --------------------------------
 AGENTS.md                       |  53 ++++
 README.md                       |  17 +-
 docs/API.md                     | 283 +++++++++++++++++++
 docs/ARCHITECTURE.md            |  88 ++++++
 docs/FRONTEND.md                | 164 +++++++++++
 docs/index.md                   |  25 ++
 docs/testing/coverage.md        | 153 +++++++++++
 docs/testing/e2e.md             | 241 +++++++++++++++++
 docs/testing/index.md           |  22 ++
 docs/testing/unit.md            | 354 ++++++++++++++++++++++++
 docs/verification/index.md      |  66 +++++
 vitest.config.ts                |   6 +
 13 files changed, 1470 insertions(+), 467 deletions(-)
 delete mode 100644 .github/copilot-instructions.md
 create mode 100644 AGENTS.md
 create mode 100644 docs/API.md
 create mode 100644 docs/ARCHITECTURE.md
 create mode 100644 docs/FRONTEND.md
 create mode 100644 docs/index.md
 create mode 100644 docs/testing/coverage.md
 create mode 100644 docs/testing/e2e.md
 create mode 100644 docs/testing/index.md
 create mode 100644 docs/testing/unit.md
 create mode 100644 docs/verification/index.md

diff --git a/.github/copilot-instructions.md b/.github/copilot-instructions.md
deleted file mode 100644
index d837bdaee..000000000
--- a/.github/copilot-instructions.md
+++ /dev/null
@@ -1,465 +0,0 @@
-# Landscape UI – Copilot Instructions
-
-## Purpose
-
-This file defines project context, build conventions, and review constraints for **GitHub Copilot** and related AI coding assistants.  
-Copilot must align with these patterns when proposing or reviewing code.
-
----
-
-## Repository Overview
-
-**Landscape UI** is Canonical’s next-generation web interface for managing Ubuntu systems.  
-Frontend only — communicates with Landscape API through authenticated REST endpoints.
-
-**Stack**
-
-- React 19 + TypeScript (strict mode)
-- Vite 7 (build/dev server)
-- PNPM for dependency management
-- React Query (@tanstack/react-query) for server state
-- React Router v7 for routing
-- Formik + Yup for forms
-- Axios (via FetchProvider)
-- Vanilla Framework + @canonical/react-components for styling
-- Vitest / Playwright / MSW / ESLint for quality control
-
----
-
-## Repository Structure
-
-```
-src/
- ├─ app/                 # Entry point, global layout, routing
- ├─ features/<name>/     # Feature folders (API + components + tests)
- │   ├─ api/             # React Query hooks
- │   ├─ components/      # Feature components
- │   ├─ types/           # Local types/interfaces
- │   ├─ constants.ts
- │   ├─ helpers.ts
- │   └─ index.ts
- ├─ context/             # Global React contexts
- ├─ libs/                # Shared logic (routes, tables, utils)
- ├─ components/          # Shared UI elements
- ├─ hooks/               # Cross-feature custom hooks
- ├─ tests/               # Test utilities and mocks
- └─ styles/              # SCSS modules and Vanilla overrides
-```
-
-**Alias root:** `@/` → `src/`
-
----
-
-## Build and Run
-
-```bash
-pnpm install --frozen-lockfile
-cp .env.local.example .env.local
-pnpm dev       # Vite dev server (5173)
-pnpm build     # Lint + typecheck + Vite build
-pnpm vitest    # Unit/integration tests
-pnpm test      # Playwright E2E
-```
-
----
-
-## Architectural Invariants
-
-Copilot must **not** propose changes that violate these rules.
-
-| Area              | Rule                                                                     |
-| ----------------- | ------------------------------------------------------------------------ |
-| **Imports**       | Use `@/` alias only. No deep imports into `features/*/*`.                |
-| **API calls**     | Must go through React Query hooks in each feature’s `api/`.              |
-| **State**         | Local state: React hooks. Server state: React Query. No Redux/MobX.      |
-| **Forms**         | Always use Formik + Yup.                                                 |
-| **Styling**       | Vanilla Framework classes for layout; component styles use SCSS modules. |
-| **Testing**       | Use Vitest + React Testing Library. Mock network via MSW.                |
-| **Auth**          | Only `useAuth()` / `FetchProvider` manage authentication.                |
-| **Routing**       | Routes defined in `src/libs/routes`. Type-safe generation only.          |
-| **Feature Flags** | Access via `useAuth().isFeatureEnabled(key)`.                            |
-| **Build Output**  | Generated `dist/` is gitignored. Never edit manually.                    |
-
----
-
-## Copilot Behavior Rules
-
-### 1. Code Generation
-
-Copilot should:
-
-- Use **existing hooks/components** before suggesting new ones.
-- Prefer **composition** over duplication.
-- Propose typed React Query hooks that adapt the raw API response into a simple, usable object (e.g., return `{ scripts, count, isLoading }` instead of the raw data object), matching the example pattern.
-- Generate **async/await** API calls wrapped in `try/catch`.
-- Always infer `type` imports (`import type`) for TS interfaces.
-- Respect ESLint and Prettier configs from root.
-
-### 2. Review Feedback Expectations
-
-When analyzing PRs, Copilot should:
-
-- Check for architectural invariant violations above.
-- Warn if new code bypasses providers (`useAuth`, `FetchProvider`, `NotifyProvider`).
-- Verify consistent naming (`PascalCase` for components, `camelCase` for helpers).
-- Flag untested UI or logic.
-- Ensure proper semantic HTML (`<button>`, `<label>`, `<main>`, etc.).
-- Point out missing `aria-` or keyboard accessibility attributes.
-- Validate keyboard navigation support.
-- Check that color contrast follows Vanilla Framework tokens.
-- Reject inline styling or direct DOM manipulation.
-- Require cleanup of temporary debugging (console, TODOs, etc.).
-- Ensure imports are grouped logically.
-
-### 3. Commit and PR Guidance
-
-Copilot should encourage:
-
-- Focused commits with clear, imperative messages.
-- Matching unit tests per feature change.
-- Updates to this file when workflow conventions change.
-- Descriptive PR titles and summaries.
-
----
-
-## Common Patterns
-
-### Example: Data Fetching Pattern
-
-```tsx
-// src/features/scripts/api/useGetScripts.ts
-import type { Script } from "@/features/scripts";
-import useFetch from "@/hooks/useFetch";
-import usePageParams from "@/hooks/usePageParams";
-import type { ApiError } from "@/types/api/ApiError";
-import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
-import type { PaginatedGetHookParams } from "@/types/api/PaginatedGetHookParams";
-import type { UseQueryOptions } from "@tanstack/react-query";
-import { useQuery } from "@tanstack/react-query";
-import type { AxiosError, AxiosResponse } from "axios";
-
-const DEFAULT_CONFIG: PaginatedGetHookParams = {
-  listenToUrlParams: true,
-};
-
-interface GetScriptsParams {
-  limit?: number;
-  offset?: number;
-  parent_access_group?: string;
-  search?: string;
-  script_type: string;
-}
-
-const getStatus = (status: string) => {
-  if (status === "all") {
-    return "v2";
-  }
-
-  if (status) {
-    return status;
-  }
-
-  return "active";
-};
-
-export const useGetScripts = (
-  config?: PaginatedGetHookParams,
-  params?: GetScriptsParams,
-  options: Omit<
-    UseQueryOptions<
-      AxiosResponse<ApiPaginatedResponse<Script>>,
-      AxiosError<ApiError>
-    >,
-    "queryKey" | "queryFn"
-  > = {},
-) => {
-  const authFetch = useFetch();
-  const { currentPage, pageSize, status, search } = usePageParams();
-
-  config = {
-    ...DEFAULT_CONFIG,
-    ...config,
-  };
-
-  const paramsWithPagination = {
-    ...(config.listenToUrlParams
-      ? {
-          limit: pageSize,
-          offset: (currentPage - 1) * pageSize,
-          search: search ?? undefined,
-          script_type: getStatus(status),
-        }
-      : params),
-  };
-
-  const { data, isLoading } = useQuery<
-    AxiosResponse<ApiPaginatedResponse<Script>>,
-    AxiosError<ApiError>
-  >({
-    queryKey: ["scripts", paramsWithPagination, config],
-    queryFn: async () =>
-      authFetch.get("scripts", { params: paramsWithPagination }),
-    ...options,
-  });
-
-  return {
-    scripts: data?.data.results ?? [],
-    scriptsCount: data?.data.count ?? 0,
-    isScriptsLoading: isLoading,
-  };
-};
-```
-
-### Example: Form Handling Pattern (Formik + Canonical Components)
-
-```tsx
-import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
-import useDebug from "@/hooks/useDebug";
-import useRoles from "@/hooks/useRoles";
-import useSidePanel from "@/hooks/useSidePanel";
-import { Form, Input, Select } from "@canonical/react-components";
-import { useFormik } from "formik";
-import type { FC } from "react";
-import { INITIAL_VALUES, VALIDATION_SCHEMA } from "./constants";
-import type { FormProps } from "./types";
-import { getFormikError } from "@/utils/formikErrors";
-
-const NewAccessGroupForm: FC = () => {
-  const { createAccessGroupQuery, getAccessGroupQuery } = useRoles();
-  const { mutateAsync } = createAccessGroupQuery;
-  const { closeSidePanel } = useSidePanel();
-  const { data: accessGroupsResponse, isLoading: isGettingAccessGroups } =
-    getAccessGroupQuery();
-
-  const accessGroupsOptionsResults = (accessGroupsResponse?.data ?? []).map(
-    (accessGroup) => ({
-      label: accessGroup.title,
-      value: accessGroup.name,
-    }),
-  );
-
-  const debug = useDebug();
-  const formik = useFormik<FormProps>({
-    initialValues: INITIAL_VALUES,
-    validationSchema: VALIDATION_SCHEMA,
-    onSubmit: async (values) => {
-      try {
-        await mutateAsync(values);
-        closeSidePanel();
-      } catch (error) {
-        debug(error);
-      }
-    },
-  });
-
-  return (
-    <Form noValidate onSubmit={formik.handleSubmit}>
-      <Input
-        type="text"
-        label="Title"
-        required
-        error={getFormikError(formik, "title")}
-        {...formik.getFieldProps("title")}
-      />
-      <Select
-        required
-        label="Parent"
-        disabled={isGettingAccessGroups}
-        options={accessGroupsOptionsResults}
-        error={getFormikError(formik, "parent")}
-        {...formik.getFieldProps("parent")}
-      />
-      <SidePanelFormButtons
-        submitButtonDisabled={formik.isSubmitting}
-        submitButtonText="Add access group"
-      />
-    </Form>
-  );
-};
-
-export default NewAccessGroupForm;
-```
-
-### Example: Error Handling Pattern (useDebug)
-
-- All try/catch blocks should use the useDebug hook to handle errors. This hook centralizes error parsing, developer-only console logging, and user-facing notifications.
-
-```ts
-// src/hooks/useDebug.ts (Simplified for instruction)
-import { IS_DEV_ENV } from "@/constants";
-import type { ApiError } from "@/types/api/ApiError";
-import { isAxiosError } from "axios";
-import useNotify from "./useNotify";
-
-export default function useDebug() {
-  const { notify } = useNotify();
-
-  return (error: unknown) => {
-    let errorMessage = "Unknown error";
-
-    if (isAxiosError<ApiError>(error) && error.response) {
-      errorMessage = error.response.data.message;
-    } else if (error instanceof Error) {
-      errorMessage = error.message;
-    } else if (typeof error === "string") {
-      errorMessage = error;
-    }
-
-    // Always show a notification to the user
-    notify.error({ message: errorMessage, error });
-
-    // Only log the full error in development
-    if (IS_DEV_ENV) {
-      console.error("An error occurred:", error);
-    }
-  };
-}
-```
-
-Usage in Forms:
-
-```tsx
-// In a Formik onSubmit:
-  onSubmit: async (values) => {
-    try {
-      await mutateAsync(values);
-      closeSidePanel();
-    } catch (error) {
-      // Correct: debug() handles everything.
-      debug(error);
-    }
-  },
-```
-
-### Conditional Routing
-
-```tsx
-<Route
-  path={ROUTES.instances()}
-  element={
-    <AuthRoute>
-      <InstancesPage />
-    </AuthRoute>
-  }
-/>
-```
-
----
-
-## Testing Standards
-
-- **Unit/integration:** Vitest (`*.test.tsx`) alongside source files
-- **Mocks:** MSW handlers in `src/tests/mocks/`
-- **E2E:** Playwright (`pnpm test`, `pnpm test:ui`)
-- **Coverage threshold:** 85% line coverage minimum
-- **Snapshot tests:** Avoid unless required for layout regressions
-
----
-
-## CI/CD Workflows (Authoritative)
-
-The repo uses multiple workflows. Copilot must follow these triggers, job orders, and tool versions.
-
-### Lint & Format (`.github/workflows/lint.yml`)
-
-**Trigger:** PR → `dev`  
-**Jobs:**
-
-- **ESLint:** Diff-only TS/TSX (added/modified).
-- **Prettier:** Diff-only JS/TS/TSX/JSON/MD/HTML.
-- **Stylelint:** Diff-only SCSS.  
-  **Common:**
-- Node `24`, pnpm `10`, `pnpm install --frozen-lockfile`.
-- Skip job if no matching changed files.
-
-### Tests + TICS on PRs (`.github/workflows/run-tests-and-tics.yml`)
-
-**Trigger:** PR → `dev`  
-**Jobs:**
-
-- **e2e-tests** (self-hosted runner, Playwright container): matrix for `saas` + `self-hosted`; each builds → installs browsers → runs matching Playwright project (untagged "common" tests run in both) → uploads report.
-- **unit-tests** (self-hosted): `vitest run --coverage` → upload coverage artifact to `reports/`.
-- **tics-report** (Ubuntu hosted): downloads `vitest-report` → runs TICS action with `installTics: true`.  
-  **Env (examples):** `VITE_API_URL`, `VITE_API_URL_OLD`, `VITE_ROOT_PATH=/`, `VITE_SELF_HOSTED_ENV=true/false`, `VITE_MSW_ENABLED=true/false`.  
-  **Constraints:** keep memory flag `NODE_OPTIONS='--max_old_space_size=4096'`.
-
-### Tests on Push (`.github/workflows/run-tests.yml`)
-
-**Trigger:** push → `dev`  
-**Jobs:**
-
-- **eslint-check:** `pnpm run lint`.
-- **e2e-tests:** needs eslint; same matrix pattern as PR e2e.
-- **unit-tests:** needs eslint; same pattern as PR unit tests; uploads `coverage-report`.
-
-### PPA Build Commit (`.github/workflows/ppa-build.yml`)
-
-**Trigger:** push → `dev` **or** successful `Release` workflow (`workflow_run`)  
-**Jobs:**
-
-- **build:** checks out `dev` (or `main` when from `workflow_run`), builds with env:
-  - `VITE_API_URL=/api/v2/`, `VITE_API_URL_OLD=/api/`, `VITE_ROOT_PATH=/new_dashboard/`
-  - archives `dist` as artifact.
-- **commit:** checks out destination branch (`ppa-build-dev` or `ppa-build`) → replaces tree with built `dist/` → auto-commits.  
-  **Rule:** Do not change branch selection logic or artifact dance.
-
-### Release (`.github/workflows/release.yml`)
-
-**Trigger:** push → `main`  
-**Job:** **semantic-release** with `GITHUB_TOKEN` and full history (`fetch-depth: 0`).  
-**Rule:** Only `main` publishes tags and releases. Do not introduce prerelease steps elsewhere.
-
-### Security Scan & SBOM (`.github/workflows/security.yml`)
-
-**Triggers:** manual, weekly cron, PRs touching `Dockerfile` or this workflow  
-**Jobs:**
-
-- **build-image:** builds and pushes OCI image to GHCR, saves as `image.tar` artifact.
-- **scan-and-report** (self-hosted): runs Canonical secscan client on `image.tar`.
-  - Exit code handling: `0` = clean; `100–199` = CVEs found → fail; other non-zero = scan failure → fail.
-  - On failure: open GitHub issue with scan output.
-- **generate-and-submit-sbom:** Trivy SBOM (`spdx-json`) and submit to GitHub Dependency Graph; upload artifact.  
-  **Rule:** Preserve exit-code semantics and issue creation logic.
-
-### Full TICS (Manual) (`.github/workflows/tics-full.yml`)
-
-**Trigger:** workflow_dispatch  
-**Jobs:**
-
-- **unit-tests:** same as PR unit tests; uploads `vitest-report`.
-- **tics-report:** self-hosted TIOBE runner with `mode: qserver`.
-
----
-
-### CI Tooling Contracts
-
-- **Node:** `24`
-- **pnpm:** `10`
-- **Install:** `pnpm install --frozen-lockfile` only
-- **Build:** `pnpm run build` before Playwright runs
-- **Playwright:** install browsers with `pnpm exec playwright install --with-deps` inside the container job
-- **Caching:** use `actions/setup-node@v4` cache `"pnpm"`
-- **Artifacts:** preserve report paths as defined (`playwright-report`, `reports/`, `dist`)
-
-### Copilot MUST NOT
-
-- Suggest `npm`/`yarn` commands or change Node/pnpm versions.
-- Bypass diff-filter logic in `lint.yml`.
-- Move Playwright browser install outside the e2e job.
-- Change branch logic in PPA build or release triggers.
-- Alter TICS exit-code handling or security scan failure behavior.
-
-## Update Policy
-
-Whenever code or CI steps change:
-
-1. Update this file.
-2. Validate build and test steps.
-3. Ensure Copilot-suggested patterns remain valid.
-
----
-
-## Summary Rule for Copilot
-
-> Follow the architecture, type safety, and feature isolation principles defined here.  
-> Suggest improvements only if they comply with this document’s invariants.
diff --git a/AGENTS.md b/AGENTS.md
new file mode 100644
index 000000000..42fc698c0
--- /dev/null
+++ b/AGENTS.md
@@ -0,0 +1,53 @@
+# AGENTS.md
+
+This file is the agent-facing entrypoint for repository knowledge. It is not the source of truth.
+
+Start here, then follow the smallest relevant link:
+
+- Project overview and local setup: [README.md](README.md)
+- Knowledge base index: [docs/index.md](docs/index.md)
+- Architecture and codebase map: [docs/ARCHITECTURE.md](docs/ARCHITECTURE.md)
+- API conventions and data-access patterns: [docs/API.md](docs/API.md)
+- Frontend conventions and constraints: [docs/FRONTEND.md](docs/FRONTEND.md)
+- Testing workflow: [docs/testing/index.md](docs/testing/index.md)
+- Verification workflow: [docs/verification/index.md](docs/verification/index.md)
+- Security policy: [SECURITY.md](SECURITY.md)
+- Release process and versioning: [RELEASES.md](RELEASES.md)
+- Contribution basics: [CONTRIBUTING.md](CONTRIBUTING.md)
+
+## Project Purpose
+
+`landscape-ui` is the modern React and TypeScript web interface for Canonical Landscape. Its purpose is to replace the legacy UI, migrating Landscape workflows into the new dashboard until the classic interface can be removed. The codebase is organized around dashboard domains such as instances, repositories, profiles, settings, authentication, and account management.
+
+## Progressive Disclosure
+
+- Do not treat this file as the system of record.
+- Prefer the smallest relevant document for the task.
+- Use code as the final arbiter when docs and implementation differ.
+- Start with [docs/index.md](docs/index.md) if you are not sure which doc applies.
+
+## Where To Look
+
+- For current system structure, read [docs/ARCHITECTURE.md](docs/ARCHITECTURE.md).
+- For fetch, query, mutation, and endpoint conventions, read [docs/API.md](docs/API.md).
+- For frontend implementation and placement conventions, read [docs/FRONTEND.md](docs/FRONTEND.md).
+- For automated test strategy, read [docs/testing/index.md](docs/testing/index.md).
+- For completion criteria and closed-loop validation, read [docs/verification/index.md](docs/verification/index.md).
+
+## Source-of-Truth Rule
+
+The knowledge base lives under `docs/` plus established root documents such as `README.md`, `SECURITY.md`, and `RELEASES.md`. Keep `AGENTS.md` short and stable; add detail to the relevant source document instead of expanding this file into a manual.
+
+## Common Commands
+
+Package manager is `pnpm`. Do not use `npm` or `yarn`.
+
+```
+pnpm dev          # start the Vite dev server
+pnpm vitest       # run unit and component tests (Vitest)
+pnpm run lint     # run ESLint with auto-fix
+pnpm build        # production build (lint + tsc + vite build)
+pnpm test         # run Playwright E2E tests (not unit tests)
+```
+
+Note: `pnpm test` runs Playwright, not Vitest. Use `pnpm vitest` for unit and component test work.
diff --git a/README.md b/README.md
index 0458785ae..5c61b1d5a 100644
--- a/README.md
+++ b/README.md
@@ -8,6 +8,7 @@ The modern web interface for Canonical's Landscape, built with React and TypeScr
 
 - [About Landscape](#about-landscape)
 - [About this Repository](#about-this-repository)
+- [Documentation Map](#documentation-map)
 - [Getting Started with Local Development](#getting-started-with-local-development)
 - [Technology Stack](#technology-stack)
 - [Feedback & Support](#feedback--support)
@@ -26,7 +27,19 @@ Landscape is available as a SaaS solution at [landscape.canonical.com](https://l
 
 This repository contains the source code for the **new, modern web interface for Landscape**.
 
-This new UI is currently under active development and is intended to eventually replace the legacy UI. For now, both user interfaces are available within the Landscape product, with the classic UI being the default. Our goal is to incrementally migrate all features to this new, improved dashboard.
+This new UI is currently under active development and is intended to replace the legacy UI. Today, both user interfaces still exist within the Landscape product, but the goal of this repository is to incrementally migrate Landscape workflows into this dashboard until the classic interface can be removed.
+
+---
+
+## Documentation Map
+
+The repository now includes a small agent- and contributor-facing knowledge base:
+
+- [AGENTS.md](AGENTS.md) is the top-level map for agent tooling and quick repo orientation.
+- [docs/index.md](docs/index.md) is the index for architecture, frontend conventions, and planning docs.
+- [docs/testing/index.md](docs/testing/index.md) defines the repository test layers and test strategy.
+- [docs/verification/index.md](docs/verification/index.md) defines the broader verification workflow, including TDD expectations and closed-loop validation.
+- Existing root docs such as [SECURITY.md](SECURITY.md), [RELEASES.md](RELEASES.md), and [CONTRIBUTING.md](CONTRIBUTING.md) remain authoritative for their current subjects.
 
 ---
 
@@ -36,7 +49,7 @@ Follow these instructions to set up the project on your local machine for develo
 
 ### Prerequisites
 
-- **Node.js** (v22 or later recommended)
+- **Node.js** (v24 or later recommended)
 - **pnpm** package manager. If you don't have it, you can install it with `npm install -g pnpm`.
 
 ### Setup Instructions
diff --git a/docs/API.md b/docs/API.md
new file mode 100644
index 000000000..75a256208
--- /dev/null
+++ b/docs/API.md
@@ -0,0 +1,283 @@
+# API
+
+This document describes how HTTP access and server-state hooks are organized in this repository. `ARCHITECTURE.md` covers where the API layer sits in the app; this file covers how fetch, query, mutation, endpoint, and data-access code should be written.
+
+## Overview
+
+The repository currently uses:
+
+- axios for HTTP clients
+- React Query for server-state queries and mutations
+- provider-backed authenticated fetch clients
+- a mixed new and legacy API surface
+
+The important split is:
+
+- `API_URL`: newer API surface
+- `API_URL_OLD`: legacy API surface still used by many existing features
+
+Both are first-class implementation realities today. New code should minimize the old surface, but the doc must reflect both.
+
+## Shared Fetch Infrastructure
+
+The shared fetch layer lives in `src/api/`:
+
+- `src/api/fetch.tsx`: authenticated axios client for `API_URL`
+- `src/api/fetchOld.tsx`: authenticated axios client for `API_URL_OLD`
+- `src/api/interceptors.ts`: request and response interceptor setup
+
+Those providers are installed globally through `src/providers/AppProviders.tsx`. The provider stack and ordering are documented in `ARCHITECTURE.md`; this document focuses on how API-facing code should use that infrastructure.
+
+Use the shared hooks to consume those clients:
+
+- `useFetch()` for `API_URL`
+- `useFetchOld()` for `API_URL_OLD`
+
+Do not create a new authenticated axios instance in components.
+
+## What The Interceptors Do
+
+The shared interceptors in `src/api/interceptors.ts` and `src/utils/api.ts` are not optional details. They are part of the API contract.
+
+Current behavior:
+
+- the request interceptor reads the latest auth token and sets `Authorization: Bearer ...`
+- requests are normalized through `generateRequestParams(...)`
+- `generateRequestParams(...)` moves payload into `params` for `GET` and `DELETE`, and into `data` for other methods
+- legacy requests set `config.url = ""` so the old API command name is encoded through params rather than a REST-style path
+- all requests set `Content-Type: application/json`
+- `401` responses trigger logout for non-auth requests
+- auth-related failures such as `login` and `auth` requests are excluded from forced logout
+
+If a feature bypasses the shared fetch providers, it is also bypassing this behavior.
+
+## React Query Is The Default Server-State Layer
+
+`src/context/reactQuery.tsx` defines the app-wide React Query client.
+
+Current defaults:
+
+- `retry: false`
+- `refetchOnWindowFocus: false`
+- `refetchOnReconnect: false`
+- query-cache errors are reported through `useDebug()`
+- the default query error type is registered as `AxiosError<ApiError>`
+
+Use React Query hooks as the default server-state layer:
+
+- `useQuery(...)` for reads
+- `useMutation(...)` for writes
+- `useQueryClient()` for invalidation, cache reset, and refetch workflows
+
+Do not move request logic into components unless there is a concrete reason the code cannot live in a hook.
+
+## Where API Code Lives
+
+Preferred direction for new code:
+
+- put feature-owned API hooks under `src/features/<feature>/api/`
+- prefer one hook per endpoint or single API operation
+- keep shared fetch infrastructure under `src/api/`
+- keep app-wide fetch access hooks such as `useFetch` and `useFetchOld` under `src/hooks/`
+
+Current repo reality is mixed:
+
+- many newer features already use `src/features/*/api/`
+- some older data-access code still lives in `src/hooks/`
+- some legacy feature-owned data-access code still lives in `src/features/*/hooks/`
+
+Examples of older central or mixed placement:
+
+- `src/hooks/useRoles.ts`
+- `src/hooks/useUsers.ts`
+- `src/hooks/useAdministrators.ts`
+- `src/hooks/useReports.ts`
+- `src/features/removal-profiles/hooks/useRemovalProfiles.ts`
+- `src/features/gpg-keys/hooks/useGPGKeys.ts`
+
+For new work, prefer feature-owned API hooks over adding more domain data access to `src/hooks/`.
+
+## One Hook Per Operation
+
+New API work should use small, operation-specific hooks.
+
+Preferred direction:
+
+- one query hook per read endpoint or read operation
+- one mutation hook per write endpoint or write operation
+- one file per hook
+- feature-owned naming such as `useGetInstances`, `useEditScript`, or `useCreateStandaloneAccount`
+
+Avoid grouped domain manager hooks that bundle many unrelated reads and writes into one return object.
+
+Examples of older patterns that should not be copied for new code:
+
+- `src/hooks/useRoles.ts`
+- `src/hooks/useUsers.ts`
+- `src/hooks/useAdministrators.ts`
+
+Those files reflect current repo history, not the target shape.
+
+## Query Patterns
+
+Current query hooks commonly:
+
+- accept typed params
+- call `useFetch()` or `useFetchOld()`
+- define array-based query keys
+- accept optional React Query config through `UseQueryOptions`
+- return UI-friendly values instead of exposing the full axios response everywhere
+
+Common patterns already in the repo:
+
+- paginated list hooks deriving `limit` and `offset` from `usePageParams()`
+- optional `listenToUrlParams` behavior through `PaginatedGetHookParams`
+- query keys such as `["instances", params]`, `["scripts", paramsWithPagination, config]`, and `["loginMethods", { isEmployeeLogin }]`
+- query helpers typed with `QueryFnType` or `QueryFnTypeWithRequiredParam` when returning reusable query functions instead of a flattened hook contract
+
+Representative examples:
+
+- `src/features/instances/api/useGetInstances.ts`
+- `src/features/scripts/api/useGetScripts.ts`
+- `src/features/auth/hooks/useAuthHandle.ts`
+- `src/hooks/useRoles.ts`
+
+Prefer stable, domain-based query keys that make invalidation obvious.
+
+## Mutation Patterns
+
+Current mutation hooks commonly:
+
+- use `mutateAsync`
+- expose domain-specific method names such as `createScript`, `editWslProfile`, or `login`
+- expose domain-specific pending flags such as `isCreatingScript` or `isLoggingIn`
+- invalidate one or more domain query keys in `onSuccess`
+
+Common invalidation pattern:
+
+- invalidate the smallest stable domain key, for example `["scripts"]`, `["instances"]`, or `["standaloneAccount"]`
+- invalidate multiple related keys when a mutation affects more than one view of the same data
+
+Representative examples:
+
+- `src/features/scripts/api/useCreateScript.ts`
+- `src/features/scripts/api/useEditScript.ts`
+- `src/features/account-creation/api/useCreateStandaloneAccount.ts`
+- `src/features/auth/hooks/useAuthHandle.ts`
+
+## New API vs Old API
+
+The repo uses both REST-style newer endpoints and legacy command-style endpoints.
+
+Typical newer API patterns:
+
+- `authFetch.get("computers", { params })`
+- `authFetch.post("/auth/oidc-providers", params)`
+- `authFetch.patch("/auth/oidc-providers/:id", params)`
+- `authFetch.delete("/auth/oidc-providers/:id")`
+
+Typical legacy API patterns:
+
+- `authFetchOld.get("CreateScript", { params })`
+- `authFetchOld.get("EditScript", { params })`
+- `authFetchOld.get("GetRoles", { params })`
+
+Practical guidance:
+
+- use `useFetch()` for newer endpoints on `API_URL`
+- use `useFetchOld()` only when the backend contract still lives on `API_URL_OLD`
+- do not add new domain code to the legacy surface unless the backend leaves no alternative
+- when a feature still depends on the old API, keep that boundary localized to the owning feature
+
+The current repo is migrating, not finished. `API.md` should document that mixed state rather than pretending the old API is gone.
+
+## Public And Pre-Auth Requests
+
+Some requests happen before authenticated providers are available.
+
+Current examples include:
+
+- `src/features/auth/api/useLogin.ts`
+- `src/features/auth/api/useGetLoginMethods.ts`
+- `src/features/auth/api/useGetAuthState.ts`
+- `src/features/account-creation/api/useGetStandaloneAccount.ts`
+
+These hooks currently create a local axios instance with:
+
+```ts
+const publicFetch = axios.create({ baseURL: API_URL });
+```
+
+Use that pattern only when the request is genuinely pre-auth or otherwise cannot depend on the shared authenticated providers.
+
+## Return Shapes
+
+This repo does not enforce one single return style, but the dominant patterns are:
+
+- flatten the axios response into domain data plus loading and error flags
+- return a renamed domain action around `mutateAsync`
+- expose `refetch` only when the caller has a real need for it
+
+Examples:
+
+- `useGetInstances()` returns `instances`, `instancesCount`, `isGettingInstances`, `isFetchingInstances`, and `refetchInstances`
+- `useGetScripts()` returns `scripts`, `scriptsCount`, and `isScriptsLoading`
+- `useLogin()` returns `login`, `isLoggingIn`, and `error`
+
+Prefer a hook contract that is easy for pages and components to consume. Avoid leaking raw axios response plumbing into UI code unless that detail is necessary.
+
+## Types And Shared API Helpers
+
+Shared API-related types live under `src/types/api/`.
+
+Current important shared types:
+
+- `ApiError`
+- `ApiPaginatedResponse`
+- `PaginatedGetHookParams`
+- `QueryFnType`
+- `QueryFnTypeWithRequiredParam`
+
+Current typing conventions:
+
+- query and mutation errors are usually typed as `AxiosError<ApiError>`
+- response payloads are often typed as `AxiosResponse<T>` when the hook works directly with axios responses
+- some hooks unwrap `response.data` and expose a domain object instead
+
+Use the existing shared API types when they match the pattern already in use. Do not introduce parallel helper types for the same shape.
+
+## Current Exceptions
+
+The repo still contains exceptions to the preferred provider-backed pattern.
+
+Current examples:
+
+- `src/features/wsl-profiles/api/useEditWslProfile.ts` creates a local axios client for authenticated work and includes a TODO about `useFetch`
+- `src/features/account-creation/api/useCreateStandaloneAccount.ts` creates a local axios instance
+- `src/features/account-creation/api/useGetStandaloneAccount.ts` creates a local axios instance with `useState`
+
+Treat these as current seams, not as the preferred shape for new feature work.
+
+## Avoid These Patterns
+
+Avoid introducing new code that:
+
+- performs axios calls directly inside components
+- creates one-off authenticated axios clients when `useFetch()` or `useFetchOld()` would work
+- adds more domain data hooks to `src/hooks/` when the hook belongs to one feature
+- invents unstable or overly broad query keys
+- skips invalidation for mutations that change visible server state
+- returns raw axios objects to UI code when a smaller hook contract would be clearer
+
+## Testing API Hooks
+
+Detailed testing guidance lives elsewhere, but API-layer work in this repo usually means:
+
+- Vitest and React Testing Library for hook and component behavior
+- MSW in `src/tests/` for mocked HTTP behavior in unit and component tests
+
+See:
+
+- [testing/index.md](testing/index.md)
+- [testing/unit.md](testing/unit.md)
+- [verification/index.md](verification/index.md)
diff --git a/docs/ARCHITECTURE.md b/docs/ARCHITECTURE.md
new file mode 100644
index 000000000..0d8f907b2
--- /dev/null
+++ b/docs/ARCHITECTURE.md
@@ -0,0 +1,88 @@
+# Architecture
+
+This document describes the current application shape in the repository. It should track implementation as it exists today, not an aspirational target.
+
+## Boot Flow
+
+The application boot path is:
+
+`src/main.tsx` -> `src/App.tsx`
+
+Current responsibilities in that path:
+
+- `src/main.tsx` initializes global styles, configures Sentry, conditionally starts MSW in local development, mounts React, and wraps the app with `AppErrorBoundary`, `BrowserRouter`, and `AppProviders`.
+- `src/App.tsx` renders the global shell and installs the top-level React Router route tree.
+
+## Provider Stack
+
+The provider composition is defined centrally in `src/providers/AppProviders.tsx`.
+
+Current order:
+
+1. `ThemeProvider`
+2. `EnvProvider`
+3. `NotifyProvider`
+4. `ReactQueryProvider`
+5. `AuthProvider`
+6. `AccountsProvider`
+7. `FetchOldProvider`
+8. `FetchProvider`
+
+This ordering matters because data fetching, auth state, notifications, and environment configuration are wired globally rather than per feature.
+
+## Routing Model
+
+Routing is composed in `src/routes/`:
+
+- `DashboardRoutes.tsx` contains authenticated dashboard routes under `AuthGuard`
+- `AuthRoutes.tsx` contains guest/authentication routes under `GuestGuard`
+- `elements.tsx` centralizes lazy route imports behind a shared `Loadable` wrapper with `Suspense`
+
+Route paths are assembled from `src/libs/routes/`, with one file per domain. Feature flags and deployment-specific behavior are enforced in the route tree through guards such as `FeatureGuard` and `SelfHostedGuard`.
+
+## Codebase Layering
+
+The main top-level code organization is:
+
+- `src/pages/`: route-level page entrypoints and route containers
+- `src/features/`: domain-specific feature code, often with co-located API hooks, components, types, and tests
+- `src/components/`: shared UI, layout, guard, form, and filter building blocks
+- `src/context/`: application-wide providers and context state
+- `src/api/`: shared fetch providers and API concerns that are not owned by a single feature
+- `src/libs/`: shared route builders (`src/libs/routes/`), page parameter utilities (`src/libs/pageParamsManager/`), and other cross-cutting non-UI helpers
+- `src/hooks/`: reusable hooks, currently a mix of app-wide hooks and some domain-owned hooks
+- `src/tests/`: shared test setup, mocks, and browser/test utilities
+- `e2e/`: Playwright end-to-end coverage
+
+In practice:
+
+- `pages` own route composition and page-level containers
+- `features` own domain behavior
+- `components` hold reusable parts that should not belong to one domain
+
+### Current Hook Placement
+
+`src/hooks/` is not purely cross-cutting today.
+
+It currently contains:
+
+- app-wide hooks such as auth, env, side-panel, fetch, notifications, selection, and page-parameter helpers
+- domain-oriented hooks such as `useRoles`, `useUsers`, `useAdministrators`, and `useReports`
+
+That mixed state is the current implementation reality. Directional placement rules for new code belong in `FRONTEND.md`, not here.
+
+## Domain Shape
+
+The repository is feature-heavy and route-driven. `src/features/` and `src/pages/dashboard/` are both organized around product domains. The feature surface is broad — read `src/features/` directly to see the current domain list.
+
+When making a change:
+
+- start from the route entrypoint if the task is page or navigation oriented
+- start from the feature directory if the task is domain behavior oriented
+- use shared components only when the abstraction is truly cross-domain
+
+## Operational Notes
+
+- Environment-driven behavior is configured through Vite environment variables exposed in `src/constants.ts`.
+- The app supports both SaaS and self-hosted behavior, and some routes or features are guarded accordingly.
+- Testing is split between Vitest for component/unit coverage and Playwright for end-to-end route flows.
diff --git a/docs/FRONTEND.md b/docs/FRONTEND.md
new file mode 100644
index 000000000..91719839e
--- /dev/null
+++ b/docs/FRONTEND.md
@@ -0,0 +1,164 @@
+# Frontend
+
+This document captures the frontend implementation conventions that new code should follow in this repository. `ARCHITECTURE.md` describes the current system shape; this file is the prescriptive guide for where new frontend code should go and how it should be organized.
+
+## Structure
+
+The codebase separates concerns by responsibility:
+
+- `src/pages/` contains route-level pages and page containers
+- `src/features/` contains domain-owned behavior and feature-specific UI
+- `src/components/` contains shared components used across multiple domains
+- `src/context/`, `src/hooks/`, `src/libs/`, and `src/api/` provide cross-cutting infrastructure
+
+Prefer these boundaries when adding code:
+
+- put route entrypoints and page assembly in `pages`
+- put domain logic and domain-specific UI in `features`
+- put broadly reusable UI in `components`
+
+## Component Folder Structure
+
+Prefer directory-based component structure over flat single-file exports once a component has meaningful internal complexity.
+
+### Default shape
+
+For most non-trivial components, prefer:
+
+- `ComponentName/ComponentName.tsx`
+- `ComponentName/ComponentName.test.tsx`
+- `ComponentName/ComponentName.module.scss` when needed
+- `ComponentName/index.ts`
+
+Add colocated supporting files when the component needs them:
+
+- `constants.ts`
+- `helpers.ts`
+- `types.ts`
+
+### Nested `components/` folders
+
+Use an internal `components/` subfolder when a parent component owns tightly related child components that are not intended to become broad shared primitives.
+
+Current examples of this pattern already exist in:
+
+- `src/components/form/CronSchedule/`
+- `src/components/form/ScheduleBlock/`
+- `src/components/layout/TablePagination/`
+
+Use this structure when:
+
+- the parent component has multiple child views or controls
+- the child pieces are tightly coupled to the parent workflow
+- extracting those pieces into top-level shared components would make ownership less clear
+
+Do not create nested `components/` folders just to add ceremony around a simple component.
+
+### Types files
+
+For new implementation-local component types, prefer colocated `types.ts`.
+
+Use a local types file when:
+
+- the props or supporting types are large enough to distract from the component
+- the same local types are shared across the component, helpers, and tests
+- the types belong to the component implementation rather than to the whole feature domain
+
+The repo currently contains a mix of `types.ts` and older `types.d.ts` files. Treat `types.ts` as the preferred direction for new work unless there is a specific reason to use declaration-file behavior.
+
+### Flat legacy structures
+
+Some shared components still use flatter or older folder layouts.
+
+That is current repo reality, but not the preferred direction for new work. When touching those components meaningfully:
+
+- prefer moving them toward the standard folder structure
+- colocate tests, styles, helpers, constants, and local types
+- only do the migration opportunistically when it keeps the change readable and low-risk
+
+Do not create a large mechanical reorganization unless the work is being done under a dedicated plan.
+
+## Code Placement Direction
+
+For new code, prefer feature ownership over central dumping grounds.
+
+### Hooks
+
+- Put domain-specific hooks inside the owning feature.
+- Reserve `src/hooks/` for hooks that are genuinely cross-cutting across multiple domains.
+- If a hook mostly exists to serve one feature, it should live with that feature even if it is reused by multiple components inside that feature.
+
+Examples of hooks that should generally stay feature-owned:
+
+- data-fetching hooks for one domain
+- mutation hooks for one domain
+- feature-specific derived-state hooks
+- hooks that encode role, package, repository, or administrator workflows
+
+Examples of hooks that belong in `src/hooks/`:
+
+- auth and account access hooks
+- env hooks
+- page-parameter and URL-state hooks
+- side-panel or notification hooks
+- generic selection, sort, or shared interaction hooks
+
+Because the current repo still contains some domain hooks under `src/hooks/`, treat this as the direction for new code and for opportunistic migrations rather than as a statement that the migration is already complete.
+
+### API And Data Access
+
+- Put feature-specific data access close to the owning feature when the API shape is domain-specific.
+- Reserve `src/api/` for shared fetch providers and app-wide API infrastructure.
+- Avoid growing large central hooks or API modules that mix unrelated domains.
+
+### Types
+
+- Keep feature-owned types close to the feature when they are not broadly shared.
+- Keep app-wide or reused domain contracts in shared type locations only when they are truly consumed across domains.
+
+## Routing and Loading
+
+- Route elements are lazy-loaded through `src/routes/elements.tsx`.
+- New route-level pages should follow the same pattern so loading behavior stays consistent.
+- Dashboard and auth routes are declared separately and wrapped in the appropriate guards.
+
+## TypeScript and Imports
+
+- TypeScript runs in strict mode with `noImplicitAny` and `noUncheckedIndexedAccess`.
+- Use the `@/` alias for imports rooted at `src/`.
+- ESLint enforces `@typescript-eslint/consistent-type-imports`; prefer `import type` where applicable.
+- ESLint restricts deep imports matching `@/features/*/*`; prefer feature entrypoints and public surfaces over reaching into internals.
+- Test mocks under `src/tests/mocks/` are restricted to test code and the `src/tests/` area.
+
+## Providers and Shared Context
+
+- Global provider composition is documented in `ARCHITECTURE.md`.
+- Add a new provider only when the state or service is truly app-wide or needs to be installed high in the tree.
+- Prefer feature-local state, hooks, and query composition over adding new global context by default.
+- Route guards and environment-aware behavior should stay close to routing and provider boundaries.
+
+## Styling
+
+- Styling is primarily co-located with components using `*.module.scss`.
+- The build runs `tcm` against `src/**` for SCSS modules, so CSS module type generation must continue to work.
+- Stylelint covers SCSS files in CI, and Prettier checks Markdown and other formatted assets.
+
+## Testing
+
+- Follow [testing/index.md](testing/index.md) for the repository testing contract and [verification/index.md](verification/index.md) for completion criteria.
+
+## Tooling Constraints
+
+Current enforced constraints from repo tooling include:
+
+- ESLint for TypeScript and React correctness
+- Prettier checks for Markdown and other formatted files in CI
+- Stylelint for SCSS
+- typed CSS module generation as part of the build
+
+Before landing frontend changes, verify the change is compatible with:
+
+- `pnpm run lint`
+- `pnpm prettier --check`
+- relevant Vitest or Playwright coverage for the area being changed
+- visual or interaction verification when the change affects UI behavior
diff --git a/docs/index.md b/docs/index.md
new file mode 100644
index 000000000..88a61f03e
--- /dev/null
+++ b/docs/index.md
@@ -0,0 +1,25 @@
+# Docs Index
+
+This directory is the repository knowledge base and the system of record for internal project documentation. `AGENTS.md` is only the entry map.
+
+## Core Docs
+
+- [ARCHITECTURE.md](ARCHITECTURE.md): current system structure, boot flow, provider composition, routing, and codebase layering
+- [API.md](API.md): fetch, query, mutation, endpoint, and old/new API conventions
+- [FRONTEND.md](FRONTEND.md): prescriptive frontend implementation rules for code placement, component structure, and repo conventions
+- [testing/index.md](testing/index.md): automated test map covering unit/component tests, E2E tests, and coverage guidance
+- [verification/index.md](verification/index.md): implementation completion rules, TDD expectations, and closed-loop validation
+
+## Existing Root Docs
+
+- [../README.md](../README.md): project overview, local setup, and developer entrypoint
+- [../SECURITY.md](../SECURITY.md): security reporting and remediation policy
+- [../RELEASES.md](../RELEASES.md): release process, versioning, and changeset workflow
+- [../CONTRIBUTING.md](../CONTRIBUTING.md): contribution basics and code of conduct
+
+## Maintenance Rules
+
+- Keep this directory focused on source-of-truth documents, not task chatter.
+- Prefer adding or updating a focused doc over expanding `AGENTS.md`.
+- When documentation drifts from code, update the authoritative document to match implementation.
+- Cross-link related docs instead of duplicating guidance.
diff --git a/docs/testing/coverage.md b/docs/testing/coverage.md
new file mode 100644
index 000000000..bb593cec2
--- /dev/null
+++ b/docs/testing/coverage.md
@@ -0,0 +1,153 @@
+# Coverage
+
+This document tells agents how to reason about automated test coverage in this repository.
+
+Coverage is a quality signal, not the goal by itself. High percentages are not useful if they come from weak assertions, trivial code paths, or tests that do not protect important behavior.
+
+## How Agents Should Use This Document
+
+Use this document for coverage policy, expectations, and interpretation.
+
+Use [`vitest.config.ts`](../../vitest.config.ts) as the source of truth for the live coverage configuration.
+
+If this document and the config ever differ:
+
+- trust the config for mechanics
+- trust this document for intent and review expectations
+- update the document if the policy changed, not only the tooling
+
+## What Coverage Is For
+
+In this repo, coverage should help answer questions like:
+
+- did we exercise the important behavior we changed
+- do the tests cover the main success, failure, and edge paths
+- are we relying on untested branches in logic-heavy code
+- are we adding tests that protect regressions, not just inflate a number
+
+Coverage should support review and verification, not replace them.
+
+## Current Coverage Setup
+
+Coverage is currently produced by Vitest, not by Playwright.
+
+The repo already defines:
+
+- `pnpm coverage` -> `vitest run --coverage`
+- global thresholds: `80` for statements, lines, and functions, and `70` for branches
+
+Additional provider, reporter, output, include, and exclude details are configured in [`vitest.config.ts`](../../vitest.config.ts). Agents should inspect the config directly when they need those exact mechanics.
+
+## Scope Of Coverage Numbers
+
+Coverage reporting is focused on application code under `src`, not the whole repository.
+
+It excludes low-signal paths such as:
+
+- tests themselves
+- config files
+- `types`
+- barrel `index.ts` files
+- declaration files
+- other support-only files defined in the Vitest coverage config
+
+That means the reported coverage numbers are primarily about application code exercised through the Vitest suite.
+
+## Coverage Is Cross-Cutting
+
+Coverage is not only a unit-testing concern and not only an E2E concern.
+
+Use the test layer that best proves the behavior:
+
+- unit/component tests should usually provide the measurable code coverage
+- E2E tests should prove critical flows and integrated behavior
+
+Do not force behavior into Playwright just to “count” it, and do not write shallow unit tests only to raise percentages.
+
+## How To Interpret Coverage
+
+Line coverage can show whether code ran.
+
+Branch coverage is often more useful for logic-heavy code because it shows whether conditionals and alternate paths were exercised.
+
+Function coverage can help reveal whether important entrypoints were never called.
+
+Practical guidance:
+
+- for simple presentational code, line coverage may be enough
+- for logic-heavy helpers, hooks, guards, parsing, filtering, and state transitions, branch coverage matters more
+- for bug fixes, make sure the exact failing path is covered, not only the surrounding file
+
+## What Good Coverage Looks Like
+
+Good coverage in this repo usually means:
+
+- the changed behavior is covered by a meaningful assertion
+- success and failure paths are both exercised when they matter
+- important conditions or feature-flag paths are covered
+- tests are written at the narrowest useful layer
+- coverage increases because protection increased, not because low-value code was touched
+
+Bad coverage usually looks like:
+
+- rendering a component without asserting the important behavior
+- touching code through setup without proving the contract
+- adding broad happy-path tests while leaving the bug path uncovered
+- chasing percentages without improving regression protection
+
+## Thresholds
+
+This repository currently enforces the following global Vitest coverage thresholds:
+
+- statements: `80%`
+- lines: `80%`
+- functions: `80%`
+- branches: `70%`
+
+These are baseline repository thresholds, not a substitute for judgment.
+
+## How To Use The Thresholds
+
+Treat the enforced thresholds as the floor, not the target.
+
+Expected practice:
+
+- add coverage where behavior changed
+- improve branch coverage when logic becomes more complex
+- avoid lowering meaningful coverage in the area you touched without a clear reason
+- do not stop at the threshold if important behavior is still unprotected
+
+## Higher Expectations For Critical Logic
+
+Some frontend code deserves stricter scrutiny than the global baseline, even if that stricter level is not yet encoded in the config.
+
+Examples:
+
+- hooks with branching behavior
+- guards and redirect logic
+- auth and permission flows
+- parsing, filtering, or transformation helpers
+- feature-flagged behavior
+- complex state or query orchestration
+
+For those areas, reviewers should expect stronger coverage, especially for branches and error paths.
+
+Practical target:
+
+- `90%+` lines, statements, and functions
+- `80-90%` branches
+
+This is currently a review standard, not an enforced global threshold.
+
+## Relationship To Verification
+
+Coverage is part of the overall confidence picture, but it does not prove a task is done on its own.
+
+Use coverage together with:
+
+- targeted unit/component tests
+- targeted E2E coverage where appropriate
+- manual or browser-based verification for UI changes
+- linting and other repo-level checks
+
+For completion criteria, see [../verification/index.md](../verification/index.md).
diff --git a/docs/testing/e2e.md b/docs/testing/e2e.md
new file mode 100644
index 000000000..08583b949
--- /dev/null
+++ b/docs/testing/e2e.md
@@ -0,0 +1,241 @@
+# End-To-End Tests
+
+End-to-end tests in this repository are written with Playwright.
+
+## Use This Layer For
+
+- route flows
+- browser interactions
+- navigation
+- integrated state changes across screens
+- user-visible workflows that depend on the real app shell or router
+- behavior that is only meaningful when exercised in a browser environment
+
+Avoid pushing everything into end-to-end coverage when a smaller unit or component test would prove the same contract faster and more reliably.
+
+Current direction:
+
+- feature-first specs under `e2e/features/`
+- shared helpers and fixtures under `e2e/support/`
+- reusable page or component objects when a flow benefits from them
+- project tagging for SaaS vs self-hosted behavior
+- helper-driven navigation and login instead of repeating raw URL and form logic everywhere
+
+## File Placement
+
+Current repo structure:
+
+- `e2e/features/<domain>/*.spec.ts`: feature-level Playwright specs
+- `e2e/features/<domain>/*.page.ts`: feature-specific page objects when they provide value
+- `e2e/shared/components/`: reusable E2E component objects, such as table pagination helpers
+- `e2e/support/fixtures/`: custom Playwright fixtures
+- `e2e/support/helpers/`: navigation, auth, intercept, and environment helpers
+- `e2e/support/pages/`: shared page-object base classes
+
+When adding a new E2E test, prefer placing it under the relevant feature directory and only extracting page objects or helpers when the behavior is reused or meaningfully clarified by the abstraction.
+
+## Playwright Configuration
+
+The suite is configured in `playwright.config.ts`.
+
+Current behavior:
+
+- tests live under `e2e/features`
+- only `**/*.spec.ts` files are executed
+- projects are split into `saas` and `self-hosted`
+- project selection is driven by `@saas` and `@self-hosted` tags
+- local runs use `pnpm dev`
+- CI runs use `pnpm preview`
+- failed retries keep traces, and failed tests retain videos
+
+The config also starts the app automatically and sets:
+
+- `VITE_ROOT_PATH=/`
+- `VITE_MSW_ENABLED=false`
+
+That means E2E coverage is pointed at the running app, not the unit-test MSW environment.
+
+## Prefer The Shared Fixture Layer
+
+Most E2E specs should import `test` and `expect` from `e2e/support/fixtures/auth.ts`, not directly from `@playwright/test`.
+
+That fixture layer currently provides:
+
+- `authenticatedPage`: a page that has already logged in and closed the welcome modal
+- `standaloneAccountMock`: an option for self-hosted account-existence scenarios
+- console, page-error, and request-failure logging written to the test output directory
+
+This is the default starting point for new specs because it keeps authentication setup and basic diagnostics consistent.
+
+## Choosing `page` vs `authenticatedPage`
+
+Use `authenticatedPage` when:
+
+- the flow starts from an already logged-in state
+- login is not part of the behavior under test
+- the page would otherwise be blocked by the welcome modal
+
+Use raw `page` when:
+
+- login itself is the subject of the test
+- redirect handling during auth is the subject of the test
+- the spec needs to install routes or environment mocks before navigation
+
+This split is already visible in the auth, activities, and repositories specs.
+
+## Navigation And Auth Helpers
+
+Prefer the shared helper layer over re-implementing URL and login behavior in each spec.
+
+Current helpers:
+
+- `navigateTo(page, path, params?)`
+- `navigateToSidebarLink(page, name)`
+- `clickSidebarButton(page, name)`
+- `login(page, email, password, params?)`
+- `closeWelcomeModal(page)`
+- `waitForEnvironmentError(page)`
+
+These helpers already encode root-path handling and common flows, so use them instead of open-coding URL building or sidebar interaction.
+
+## Environment-Specific Coverage
+
+The suite supports both SaaS and self-hosted environments.
+
+Current pattern:
+
+- wrap SaaS-only expectations in `test.describe("@saas", ...)`
+- wrap self-hosted-only expectations in `test.describe("@self-hosted", ...)`
+- let Playwright project filtering include or exclude tests based on those tags
+
+Use this when the UI or behavior differs between deployment modes, such as repository mirrors or standalone-account flows.
+
+## Page Objects And Shared Components
+
+The E2E suite is starting to adopt page-object-style abstractions, but selectively rather than everywhere.
+
+Current examples:
+
+- `LoginPage` for login interactions and heading checks
+- `MirrorsPage` for repository mirrors
+- `TablePagination` as a reusable E2E component object
+- `basePage` for shared page assertions such as heading checks
+
+Guidance for new coverage:
+
+- use a page object when the same screen behavior appears in multiple tests
+- use a shared component object for reusable widgets that appear across pages
+- do not create a page object just to wrap one or two trivial selectors once
+
+The current pattern is pragmatic rather than dogmatic.
+
+## Network And Request Control
+
+E2E tests do not use the unit-test MSW server. Network control is done with Playwright routing and request observation.
+
+Current patterns:
+
+- inline `page.route(...)` in a spec for targeted auth or callback overrides
+- dedicated helpers such as `mockStandaloneAccount(page, exists)`
+- optional helper utilities in `e2e/support/helpers/intercept.ts` for request interception and request waiting
+
+At the moment, inline `page.route(...)` is still common for targeted response overrides, especially in auth callback scenarios. The suite is not yet standardized around a single interception abstraction.
+
+Guidance:
+
+- use `page.route(...)` directly when the override is local to one spec and easy to read inline
+- extract a helper when the same route behavior is reused or is domain-specific enough to deserve a named abstraction
+
+## Assertion Style
+
+Current suite patterns favor:
+
+- `expect(page).toHaveURL(...)` for navigation and redirect assertions
+- `getByRole(...)` and other accessible locators for UI assertions
+- page-object methods for stable, repeated assertions such as heading checks
+
+Examples already common in the repo:
+
+- `await expect(page).toHaveURL(/overview/)`
+- `await expect(page.getByRole("button", { name: "Create account" })).toBeVisible()`
+- `await expect(authenticatedPage.getByText("Mirrors")).toBeVisible()`
+
+Prefer asserting user-visible behavior over internal implementation details.
+
+## Stable Workflow For New Specs
+
+When adding a new E2E test, follow this order:
+
+1. Decide whether the flow needs `page` or `authenticatedPage`.
+2. Place the spec under the owning feature directory in `e2e/features/`.
+3. Use shared navigation and auth helpers first.
+4. Add environment tags if the behavior differs between SaaS and self-hosted.
+5. Extract a page object or shared component helper only if the selectors or actions are reused.
+6. Add route interception only where the scenario cannot be expressed cleanly against the default app behavior.
+
+## Recommended Working Templates
+
+### Authenticated navigation flow
+
+```ts
+import { test, expect } from "../../support/fixtures/auth";
+import { navigateToSidebarLink } from "../../support/helpers/navigation";
+
+test("shows the target screen", async ({ authenticatedPage }) => {
+  await navigateToSidebarLink(authenticatedPage, "Activities");
+
+  await expect(authenticatedPage).toHaveURL(/activities/);
+});
+```
+
+### Environment-specific behavior
+
+```ts
+import { test, expect } from "../../support/fixtures/auth";
+
+test.describe("@self-hosted", () => {
+  test("shows self-hosted only behavior", async ({ authenticatedPage }) => {
+    await expect(authenticatedPage.getByText("Mirrors")).toBeVisible();
+  });
+});
+```
+
+### Route override inside a spec
+
+```ts
+import { test, expect } from "../../support/fixtures/auth";
+import { navigateTo } from "../../support/helpers/navigation";
+
+test("redirects to an internal return_to", async ({ page }) => {
+  await page.route("**/auth/handle-code**", async (route) => {
+    await route.fulfill({
+      status: 200,
+      contentType: "application/json",
+      body: JSON.stringify({
+        return_to: {
+          external: false,
+          url: "/scripts",
+        },
+      }),
+    });
+  });
+
+  await navigateTo(page, "/handle-auth/oidc", {
+    code: "mock-code",
+    state: "mock-state",
+  });
+
+  await expect(page).toHaveURL(/\/scripts/);
+});
+```
+
+## Repo Notes
+
+- Playwright coverage lives under `e2e/features/`.
+- Use this layer when the requirement depends on routing, browser state, or a multi-screen user flow.
+- For UI-facing changes, Playwright coverage often proves correctness, but it does not replace visual verification of the resulting screen.
+- Prefer building on the existing helper and fixture layer instead of introducing raw one-off setup in every spec.
+
+## Command Shape
+
+Use targeted Playwright coverage for the changed path first, then broaden when the affected workflow is cross-cutting.
diff --git a/docs/testing/index.md b/docs/testing/index.md
new file mode 100644
index 000000000..696d9f00c
--- /dev/null
+++ b/docs/testing/index.md
@@ -0,0 +1,22 @@
+# Testing
+
+This directory defines the repository testing contract. The goal is to choose the right automated test layer and prove behavior with the narrowest useful test.
+
+## Start Here
+
+Use the narrowest test that proves the requirement.
+
+Read next based on the task:
+
+- [unit.md](unit.md): unit and component tests with Vitest and React Testing Library
+- [e2e.md](e2e.md): end-to-end tests with Playwright
+- [coverage.md](coverage.md): how to reason about coverage in this repository
+
+## Test Layers
+
+This repository uses two primary automated test layers:
+
+- unit and component tests with Vitest and React Testing Library
+- end-to-end tests with Playwright
+
+Choose the smallest layer that can prove the behavior confidently.
diff --git a/docs/testing/unit.md b/docs/testing/unit.md
new file mode 100644
index 000000000..998675c96
--- /dev/null
+++ b/docs/testing/unit.md
@@ -0,0 +1,354 @@
+# Unit Tests
+
+Unit and component tests in this repository are written with Vitest and React Testing Library.
+
+## Use This Layer For
+
+- pure logic
+- helpers and formatting
+- hooks
+- reducers or local state behavior
+- component behavior that can be exercised in `jsdom`
+- focused rendering, interaction, and state assertions that do not require a real browser flow
+
+These tests should stay fast, targeted, and close to the behavior being changed.
+
+## File Placement
+
+Current repo patterns:
+
+- component and page tests are usually co-located with the unit under test as `*.test.tsx`
+- pure helper tests are usually co-located as `*.test.ts`
+- hook tests live under `src/hooks/__tests__/` or beside the hook when that is clearer
+- shared test infrastructure lives under `src/tests/`
+
+When adding a new unit test, prefer co-location with the thing being tested unless it is shared test infrastructure.
+
+## Core Test Harness
+
+Vitest runs against `src/` with a shared `jsdom` setup in `src/tests/setup.ts`.
+
+That setup already provides:
+
+- `@testing-library/jest-dom` matchers
+- automatic RTL cleanup after each test
+- a shared MSW server with `onUnhandledRequest: "error"`
+- global `ResizeObserver` mocking
+- `HTMLCanvasElement.getContext` stubbing
+- `document.queryCommandSupported` stubbing
+- a `ProgressEvent` polyfill when needed
+- `Range.prototype.getBoundingClientRect` mocking and reset hooks
+- responsive `matchMedia` reset between tests
+
+Because the setup is global, unit tests should assume network requests must be handled and responsive state will be reset after each test.
+
+## Which Render Helper To Use
+
+This repository uses three main entrypoints:
+
+- `render(...)` from React Testing Library for pure components with no router, provider, or query dependencies
+- `renderWithProviders(...)` from `src/tests/render.tsx` for most app-facing components, pages, and containers
+- `renderHook(..., { wrapper: renderHookWithProviders() })` for hooks that depend on router, auth, or React Query context
+
+### `render(...)`
+
+Use plain RTL `render(...)` when the unit does not depend on app providers. This is common for pure presentational components such as `src/components/layout/Redirecting/Redirecting.test.tsx` or `src/components/layout/ExpandableTable/ExpandableTable.test.tsx`.
+
+### `renderWithProviders(...)`
+
+Use `renderWithProviders(...)` when the component needs any of:
+
+- routing
+- app context
+- React Query
+- auth state
+- notifications
+- side-panel behavior
+
+`renderWithProviders(...)` wraps the test in:
+
+- `MemoryRouter`
+- `AppProviders`
+- `SidePanelProvider`
+- `AppNotification` via `NotifyContext`
+
+It also supports route-aware tests:
+
+- `routePath` seeds the current URL
+- `routePattern` mounts the component under a matching route definition
+
+This is the default helper for most `src/pages/`, `src/features/`, and app-shell components.
+
+### `renderHookWithProviders()`
+
+Use `renderHookWithProviders()` for hooks that need router or React Query context. The helper provides:
+
+- `MemoryRouter`
+- `QueryClientProvider` with test config
+- `AuthProvider`
+
+The test query client disables retries and uses `gcTime: 0`, which keeps hook tests deterministic and avoids retry-related timing noise.
+
+## Imports And Declarations
+
+### Preferred import sources
+
+Current suite patterns consistently use:
+
+- `screen`, `within`, `waitFor`, and `renderHook` from `@testing-library/react`
+- `userEvent` from `@testing-library/user-event`
+- `describe`, `it`, `expect`, `beforeEach`, `afterEach`, and `vi` from `vitest`
+- test helpers and fixtures from `@/tests/*`
+
+### Typed props and fixtures
+
+The suite strongly prefers typed local fixtures over untyped inline objects.
+
+Common patterns:
+
+- `const props: ComponentProps<typeof MyComponent> = { ... }`
+- `const mockAuth: AuthContextProps = { ... }`
+- `const value = { ... } satisfies AccountsContextProps`
+- `const rows = [...] as const satisfies Activity[]`
+
+Prefer `ComponentProps<typeof ...>` or the concrete domain/context type for local test data so interface drift is caught by TypeScript.
+
+## Assertion Style
+
+Default assertion style in this repo:
+
+- query by accessible role/name first
+- use `screen.findBy...` for async appearance
+- use `waitFor(...)` for async state transitions
+- use `within(...)` to scope row, cell, menu, or panel assertions
+- keep assertions user-facing rather than implementation-detail oriented
+
+Examples already common in the suite:
+
+- `screen.getByRole("button", { name: /save changes/i })`
+- `await screen.findByRole("heading", { name: /create account/i })`
+- `within(row).getByRole("button", { name: /actions/i })`
+
+The suite does occasionally use `container`, but usually for the custom matchers described below rather than raw DOM traversal.
+
+## Custom Matchers And Helpers
+
+The global setup adds repo-specific matchers from `src/tests/matcher.ts`:
+
+- `toBeOffScreen`
+- `toHaveTexts`
+- `toHaveInputValues`
+- `toHaveInfoItem`
+- `toHaveIcon`
+
+Use these when they match the UI pattern directly, especially for:
+
+- table/header text coverage
+- info-grid style label/value assertions
+- icon-state assertions
+- hidden accessible text assertions
+
+Shared helpers from `src/tests/helpers.ts` are also part of the normal unit-test toolkit:
+
+- `expectLoadingState()` for waiting through the shared loading spinner
+- `expectErrorNotification()` for generic error-notification assertions
+- `setScreenSize(...)` and `resetScreenSize()` for responsive behavior
+- range bounding-rect helpers, already managed globally by setup
+
+## Mock Data Strategy
+
+Shared typed fixtures live under `src/tests/mocks/`. These are the default source of truth for unit-test data.
+
+Current patterns:
+
+- import a domain fixture such as `authUser`, `features`, `roles`, `instances`, or `removalProfiles`
+- use the shared fixture directly when the default shape is good enough
+- create a test-specific variant with object spread when only a few fields differ
+- keep the fixture typed to the real domain type
+
+This is the preferred approach over rebuilding large inline payloads inside each test.
+
+## Hook And Module Mocking
+
+Two mocking styles are common, depending on the seam.
+
+### Mock a hook directly
+
+Use direct hook mocking when the behavior is easiest to isolate at the hook boundary:
+
+```ts
+vi.mock("@/hooks/useAuth");
+
+beforeEach(() => {
+  vi.mocked(useAuth).mockReturnValue(authProps);
+});
+```
+
+This is common for auth, env, side-panel, and account-selection behavior.
+
+### Partially mock a module
+
+Use `vi.importActual(...)` when only part of a module should be replaced:
+
+```ts
+vi.mock("@/features/auth", async () => {
+  const actual = await vi.importActual("@/features/auth");
+  return {
+    ...actual,
+    useGetLoginMethods: vi.fn(),
+    ProviderList: () => <div data-testid="provider-list">Provider List</div>,
+  };
+});
+```
+
+Use this when you want to keep most of a feature module real but replace one hook or child component.
+
+### Mock lifecycle
+
+Current suite patterns use:
+
+- `vi.clearAllMocks()` to reset call history
+- `vi.resetAllMocks()` when return values and implementations should be reset
+- `vi.restoreAllMocks()` after spies such as `console.warn`
+
+Pick the narrowest reset that matches the test.
+
+## Network And MSW Patterns
+
+Unit tests in this repo do use MSW, especially for containers, pages, and hooks that fetch data.
+
+The default model is:
+
+- shared handlers are registered once in `src/tests/server/handlers/index.ts`
+- handlers build responses from typed fixtures under `src/tests/mocks/`
+- `src/tests/setup.ts` starts the server before all tests and resets handlers after each test
+
+The most common per-test override is not `server.use(...)`. Instead, the suite usually drives shared handlers through `setEndpointStatus(...)` from `src/tests/controllers/controller.ts`.
+
+Supported common states:
+
+- `setEndpointStatus("default")`
+- `setEndpointStatus("empty")`
+- `setEndpointStatus("error")`
+- `setEndpointStatus({ status: "error", path: "/features" })`
+
+Documented implication:
+
+- if a unit test triggers network traffic and no handler exists, the test should fail
+- if you only need default, empty, or error behavior, prefer `setEndpointStatus(...)`
+- if the current shared handlers cannot express the needed case, add the capability to the handler or fixture layer instead of scattering ad hoc network stubs through tests
+
+## Forms And Formik-Based Components
+
+Formik-backed units often use `createFormik(...)` from `src/tests/formik.ts` instead of mounting a full form.
+
+Use it for components that only need a `FormikContextType<T>`-shaped object:
+
+```ts
+const formik = createFormik({ all_computers: false, tags: [] });
+renderWithProviders(<AssociationBlock formik={formik} />);
+```
+
+This keeps form component tests small and focused on rendering and local interactions.
+
+## Responsive Behavior
+
+Responsive UI logic is tested with `setScreenSize(...)` and `resetScreenSize()` from `src/tests/helpers.ts`.
+
+Use this for units whose behavior changes across breakpoints, such as:
+
+- responsive action menus
+- table/list layout changes
+- conditional mobile vs desktop controls
+
+The helpers work by mocking `window.matchMedia` against the breakpoints defined in `src/constants.ts`.
+
+## Interaction Style
+
+Current suite patterns favor `userEvent` for user-like interactions:
+
+- clicks
+- typing
+- selecting options
+
+Use `await` with `userEvent` interactions. Use `fireEvent` only when a lower-level event is genuinely needed.
+
+## Recommended Working Template
+
+### Pure component
+
+```tsx
+import { render, screen } from "@testing-library/react";
+import type { ComponentProps } from "react";
+import MyComponent from "./MyComponent";
+
+const props: ComponentProps<typeof MyComponent> = {
+  title: "Example",
+};
+
+describe("MyComponent", () => {
+  it("renders the title", () => {
+    render(<MyComponent {...props} />);
+
+    expect(
+      screen.getByRole("heading", { name: props.title }),
+    ).toBeInTheDocument();
+  });
+});
+```
+
+### Provider-aware component
+
+```tsx
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import type { ComponentProps } from "react";
+import { renderWithProviders } from "@/tests/render";
+import MyContainer from "./MyContainer";
+
+const props: ComponentProps<typeof MyContainer> = {
+  onClose: vi.fn(),
+};
+
+describe("MyContainer", () => {
+  it("submits successfully", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<MyContainer {...props} />);
+
+    await user.click(screen.getByRole("button", { name: /submit/i }));
+
+    expect(props.onClose).toHaveBeenCalled();
+  });
+});
+```
+
+### Hook with providers
+
+```tsx
+import { renderHook, waitFor } from "@testing-library/react";
+import { renderHookWithProviders } from "@/tests/render";
+import useMyHook from "@/hooks/useMyHook";
+
+describe("useMyHook", () => {
+  it("loads data", async () => {
+    const { result } = renderHook(() => useMyHook(), {
+      wrapper: renderHookWithProviders(),
+    });
+
+    await waitFor(() => {
+      expect(result.current.isLoading).toBe(false);
+    });
+  });
+});
+```
+
+## Repo Notes
+
+- Shared test utilities and mocks belong under `src/tests/`.
+- Prefer the smallest failing test that proves the requirement before changing implementation when the area is practically testable.
+- Prefer typed fixtures and helpers from `src/tests/` before inventing one-off local infrastructure.
+
+## Command Shape
+
+Use targeted Vitest coverage when possible, and broaden only when the change crosses multiple areas.
diff --git a/docs/verification/index.md b/docs/verification/index.md
new file mode 100644
index 000000000..e8481a632
--- /dev/null
+++ b/docs/verification/index.md
@@ -0,0 +1,66 @@
+# Verification
+
+This document defines the repository verification loop. A task is not complete when code compiles. It is complete when the relevant loop has been closed.
+
+## Default Development Mode
+
+Prefer test-driven development when the change affects behavior and the area has a practical test seam.
+
+Default loop:
+
+1. Define the expected behavior.
+2. Add or update the smallest relevant automated test so it fails for the right reason.
+3. Implement the change.
+4. Re-run the relevant checks.
+5. For UI changes, inspect the behavior in a browser-oriented workflow as well.
+6. Repeat until the change is correct, or stop and surface the blocker if local verification is not possible.
+
+Skipping the failing-test step is acceptable only when:
+
+- the change is purely documentation
+- the change is mechanical with no behavior impact
+- the area has no practical automated test seam yet
+- the existing test setup cannot express the behavior without disproportionate scaffolding
+
+When the failing-test step is skipped, document why in the work summary.
+
+## Required Checks
+
+For most application changes, verify the smallest applicable set from:
+
+- `pnpm run lint`
+- `pnpm prettier --check` for changed Markdown or formatted assets
+- targeted Vitest and React Testing Library coverage for unit or component behavior
+- targeted Playwright coverage for end-to-end behavior
+
+Run broader checks when the change is cross-cutting or when targeted verification is not sufficient.
+
+Coverage guidance for this repo lives in [../testing/coverage.md](../testing/coverage.md).
+
+## Browser And UI Verification
+
+When a change affects layout, styling, navigation, or interactive behavior:
+
+- inspect the affected screen in a browser-oriented workflow
+- exercise the changed interaction path, not just the happy-path test assertion
+- compare the result against the intent of the task, not only against absence of errors
+
+For UI-facing changes, also verify:
+
+- the affected view renders correctly
+- the interaction flow works in the browser
+- the result looks acceptable, not only technically functional
+- responsive or state variants are checked when the change could affect them
+
+If verification fails, continue iterating rather than stopping at the first partial fix.
+
+## Blockers And Escalation
+
+If the loop cannot be fully closed, report the exact reason. Typical examples:
+
+- required environment or credentials are unavailable
+- the feature needs a product decision before visual acceptance can be judged
+- the current test seam is missing and cannot be added safely within the change
+- the failure reproduces, but the root cause is outside the requested scope
+
+Do not claim completion when an important check was not run. State what was verified, what was not, and why.
diff --git a/vitest.config.ts b/vitest.config.ts
index d933d8594..2e5725eef 100644
--- a/vitest.config.ts
+++ b/vitest.config.ts
@@ -49,6 +49,12 @@ export default defineConfig({
       reporter: ["cobertura", "json-summary", "html"],
       reportOnFailure: true,
       reportsDirectory: resolve(__dirname, "reports"),
+      thresholds: {
+        statements: 80,
+        lines: 80,
+        functions: 80,
+        branches: 70,
+      },
       include: ["src/**/*.{ts,tsx}"],
       exclude: [
         "**/tests/**",

From 0559e2230499ed7a538e991c2a0710549cd39385 Mon Sep 17 00:00:00 2001
From: Copilot <198982749+Copilot@users.noreply.github.com>
Date: Wed, 8 Apr 2026 11:01:59 -0700
Subject: [PATCH 06/42] Convert all .d.ts files to .ts and fix resulting
 TypeScript errors (#525)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Summary

Converts all ambient `.d.ts` declaration files in `src/` to regular
`.ts` modules (163 files), and fixes the TypeScript errors that surfaced
as a result. Ephemeral `.module.scss.d.ts` files generated by `tcm` are
intentionally left as-is.

### TS1205 — `export type` in index files (137 errors)
`isolatedModules: true` requires `export type` syntax for type-only
re-exports. All 23 `types/index.ts` barrel files updated.

### TS2459 — missing `export` on locally-declared types (18 errors)
Types that were declared without `export` (invisible outside the module
in `.ts` but silently ambient in `.d.ts`): `PackageChanges`,
`PocketInfo`, `ScheduleWindow`, `DeliveryWindow`, `DelayWindow`,
`EmployeeActionParams`, `MirrorPocket`, `PullPocket`, two `FormProps`,
`Constraint`, `Attachment`.

### TS2307 — broken import paths (3 errors)
Paths that resolved to `any` under `skipLibCheck`:
- `./Creator` → `@/types/Creator` in `Activity.ts`
- `./api/ApiError` → `./ApiError` in `QueryFnType.ts`
- Removed non-existent `CommonPackagesActionParams` import;
`InstalledPackagesActionForm/types.ts` now declares its fields directly

### TS2724 — unexported named members (3 errors)
Added `export` to `ProviderConfiguration`, `PocketPackageName`,
`PocketPackageVersion`.

### TS2430 / TS2312 — invalid interface extension (6 errors)
Interfaces extending union types or widening inherited properties can't
use `interface extends`. Converted to `type` aliases/intersections:
- `WithMetadata<T>` → `T & { metadata: … }`
- `InstanceColumn` → `Column<Instance> & { … }`
- `CommonPocket` — `Partial<PocketLastSyncProps>` is a
union-of-partials, which distributes into a union under intersection and
breaks react-table's `Column<D>` constraint. Replaced with a mapped
`PartialLastSyncProps` that flattens the discriminated union into a
single optional-property object type
- `FormProps` in removal-profiles and upgrade-profiles — overrode
conflicting field types via `Omit` + type intersection

### TS2304 / TS2503 / TS2552 — missing imports (5 errors)
- `SelectOption.label` was `ReactNode` (previously `any` due to missing
import); changed to `string` to match `@canonical/react-components`
`Option` and `MultiSelectItem` contracts
- Added `import * as Yup from "yup"` in `EditSnap/types.ts`
- Added `SelectOption` import in `UseGPGKeysOptionsResult.ts`
- Added `CreateScriptParams` to `RunInstanceScriptForm/types.ts` imports
(was referenced but never imported; effectively `any` before)

### TS2731 / TS2538 — symbol/number in `keyof` (5 errors)
`keyof Record<string, unknown>` = `string | number` (numeric coercion on
string-indexed objects). `String(prop)` wrappers and `key as string`
casts are required when passing `keyof Constraint` to Formik's
`setFieldValue(field: string, …)` and index expressions.

### Test handler fixes
`creator: undefined` in MSW mock handlers replaced with `{ email: "",
id: 0, name: "" }` — `Creator` is now properly typed as non-optional.

## Release Impact

- **Target Branch**: `dev`
- **Version Impact**:
  - [ ] Patch (Fix)
  - [ ] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [ ] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [ ] **UI Verified**: I have verified the changes locally.
- [ ] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.

---------

Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
Co-authored-by: ethanashaw <189650945+ethanashaw@users.noreply.github.com>
Co-authored-by: Ethan Shaw <ethan.shaw@canonical.com>
---
 .../TableFilter/{types.d.ts => types.ts}      |  0
 .../TableFilterChips/{types.d.ts => types.ts} |  0
 .../filter/{types.d.ts => types.ts}           |  0
 .../AssociationBlock/{types.d.ts => types.ts} |  0
 .../ColumnFilter/{types.d.ts => types.ts}     |  0
 .../ScheduleBlock/{types.d.ts => types.ts}    |  0
 .../PageContent/{types.d.ts => types.ts}      |  0
 .../{types.d.ts => types.ts}                  |  0
 .../{types.d.ts => types.ts}                  |  0
 .../{AccessGroup.d.ts => AccessGroup.ts}      |  0
 src/features/access-groups/types/index.d.ts   |  1 -
 src/features/access-groups/types/index.ts     |  1 +
 .../types/{Activity.d.ts => Activity.ts}      |  2 +-
 ...{ActivityParams.d.ts => ActivityParams.ts} |  0
 .../activities/types/{index.d.ts => index.ts} |  9 ++-----
 .../{AlertSummary.d.ts => AlertSummary.ts}    |  0
 .../alert-notifications/types/index.d.ts      |  1 -
 .../alert-notifications/types/index.ts        |  1 +
 .../{AlertParams.d.ts => AlertParams.ts}      |  0
 .../alerts/types/{index.d.ts => index.ts}     |  4 +--
 ...{ApiCredentials.d.ts => ApiCredentials.ts} | 12 ++++-----
 ...alsParams.d.ts => ApiCredentialsParams.ts} |  0
 src/features/api-credentials/types/index.d.ts |  6 -----
 src/features/api-credentials/types/index.ts   |  6 +++++
 .../NewAPTSourceForm/{types.d.ts => types.ts} |  0
 .../types/{APTSource.d.ts => APTSource.ts}    |  0
 ...PTSourceParams.d.ts => APTSourceParams.ts} |  0
 .../types/{index.d.ts => index.ts}            |  4 +--
 .../{types.d.ts => types.ts}                  |  0
 .../ProviderForm/{types.d.ts => types.ts}     |  0
 .../auth/types/{AuthUser.d.ts => AuthUser.ts} |  0
 ...ntityProvider.d.ts => IdentityProvider.ts} |  2 +-
 .../auth/types/{index.d.ts => index.ts}       |  4 +--
 .../{types.d.ts => types.ts}                  |  0
 ...utoinstallFile.d.ts => AutoinstallFile.ts} |  4 +--
 .../autoinstall-files/types/index.d.ts        |  2 --
 src/features/autoinstall-files/types/index.ts |  2 ++
 .../{types.d.ts => types.ts}                  |  0
 .../types/{Employee.d.ts => Employee.ts}      |  0
 ...{EmployeeParams.d.ts => EmployeeParams.ts} |  2 +-
 .../employees/types/{index.d.ts => index.ts}  |  0
 .../types/{EventLog.d.ts => EventLog.ts}      |  0
 ...ventsLogParams.d.ts => EventsLogParams.ts} |  0
 src/features/events-log/types/index.d.ts      |  2 --
 src/features/events-log/types/index.ts        |  2 ++
 .../EditUserForm/{types.d.ts => types.ts}     |  0
 .../{UserDetails.d.ts => UserDetails.ts}      |  0
 ...rams.d.ts => UserGeneralSettingsParams.ts} |  0
 .../types/{index.d.ts => index.ts}            |  4 +--
 .../NewGPGKeyForm/{types.d.ts => types.ts}    |  0
 .../gpg-keys/types/{GPGKey.d.ts => GPGKey.ts} |  0
 .../{GPGKeyParams.d.ts => GPGKeyParams.ts}    |  0
 .../gpg-keys/types/{index.d.ts => index.ts}   |  4 +--
 .../{types.d.ts => types.ts}                  |  0
 .../InstanceList/{types.d.ts => types.ts}     |  4 +--
 .../TagsAddForm/{types.d.ts => types.ts}      |  0
 .../{types.d.ts => types.ts}                  |  0
 .../{types.d.ts => types.ts}                  |  0
 .../{types.d.ts => types.ts}                  |  0
 .../kernel/types/{Kernel.d.ts => Kernel.ts}   |  0
 ...formation.d.ts => LivepatchInformation.ts} |  0
 src/features/kernel/types/index.d.ts          |  7 -----
 src/features/kernel/types/index.ts            | 11 ++++++++
 .../DeriveSeriesForm/{types.d.ts => types.ts} |  0
 .../EditPocketForm/{types.d.ts => types.ts}   |  0
 .../{types.d.ts => types.ts}                  |  0
 .../NewPocketForm/{types.d.ts => types.ts}    |  2 +-
 .../NewSeriesForm/{types.d.ts => types.ts}    |  2 +-
 .../components/SeriesPocketList/types.d.ts    | 21 ---------------
 .../components/SeriesPocketList/types.ts      | 26 +++++++++++++++++++
 .../{Distribution.d.ts => Distribution.ts}    |  0
 ...utionParams.d.ts => DistributionParams.ts} |  0
 .../types/{FormTypes.d.ts => FormTypes.ts}    |  0
 ...mattedPackage.d.ts => FormattedPackage.ts} |  0
 .../mirrors/types/{Pocket.d.ts => Pocket.ts}  |  8 ++++--
 .../{PocketParams.d.ts => PocketParams.ts}    |  0
 .../mirrors/types/{Series.d.ts => Series.ts}  |  0
 .../{SeriesParams.d.ts => SeriesParams.ts}    |  0
 .../{SyncPocketRef.d.ts => SyncPocketRef.ts}  |  0
 ...sResult.d.ts => UseDistributionsResult.ts} |  0
 ...Result.d.ts => UseGPGKeysOptionsResult.ts} |  2 ++
 ...PocketsResult.d.ts => UsePocketsResult.ts} |  0
 ...seSeriesResult.d.ts => UseSeriesResult.ts} |  0
 .../mirrors/types/{index.d.ts => index.ts}    | 14 +++++-----
 src/features/oidc/{types.d.ts => types.ts}    |  0
 .../overview/{types.d.ts => types.ts}         |  0
 .../types/{FormProps.d.ts => FormProps.ts}    |  2 +-
 ...{PackageProfile.d.ts => PackageProfile.ts} |  2 +-
 .../types/{index.d.ts => index.ts}            |  4 +--
 .../InstalledPackagesActionForm/types.d.ts    | 10 -------
 .../InstalledPackagesActionForm/types.ts      |  7 +++++
 ...eAction.d.ts => InstalledPackageAction.ts} |  0
 .../types/{Package.d.ts => Package.ts}        |  0
 .../packages/types/{index.d.ts => index.ts}   |  6 ++---
 .../types/{Process.d.ts => Process.ts}        |  0
 ...rocessesParams.d.ts => ProcessesParams.ts} |  0
 src/features/processes/types/index.d.ts       |  2 --
 src/features/processes/types/index.ts         |  5 ++++
 .../{types.d.ts => types.ts}                  |  0
 .../{RebootProfile.d.ts => RebootProfile.ts}  |  0
 .../types/{index.d.ts => index.ts}            |  0
 .../{types.d.ts => types.ts}                  |  2 +-
 ...{RemovalProfile.d.ts => RemovalProfile.ts} |  0
 .../removal-profiles/types/index.d.ts         |  1 -
 src/features/removal-profiles/types/index.ts  |  1 +
 ...itoryProfile.d.ts => RepositoryProfile.ts} |  0
 ...es.d.ts => RepositoryProfileFormValues.ts} |  0
 .../repository-profiles/types/index.d.ts      |  2 --
 .../repository-profiles/types/index.ts        |  2 ++
 .../{SavedSearch.d.ts => SavedSearch.ts}      |  0
 src/features/saved-searches/types/index.d.ts  |  1 -
 src/features/saved-searches/types/index.ts    |  1 +
 .../{types.d.ts => types.ts}                  |  0
 .../{ScriptProfile.d.ts => ScriptProfile.ts}  |  0
 .../types/{index.d.ts => index.ts}            |  0
 .../{types.d.ts => types.ts}                  |  3 +--
 .../RunScriptForm/{types.d.ts => types.ts}    |  0
 ...es.d.ts => RunInstanceScriptFormValues.ts} |  0
 .../scripts/types/{Script.d.ts => Script.ts}  |  2 +-
 ...iptFormValues.d.ts => ScriptFormValues.ts} |  0
 .../{ScriptStatus.d.ts => ScriptStatus.ts}    |  0
 .../types/{ScriptTab.d.ts => ScriptTab.ts}    |  0
 src/features/scripts/types/index.d.ts         | 12 ---------
 src/features/scripts/types/index.ts           | 12 +++++++++
 ...ecurityProfile.d.ts => SecurityProfile.ts} |  0
 ...Actions.d.ts => SecurityProfileActions.ts} |  0
 ...s.d.ts => SecurityProfileAddFormValues.ts} |  0
 .../types/{index.d.ts => index.ts}            |  0
 .../EditSnap/{types.d.ts => types.ts}         |  2 ++
 .../snaps/types/{Snap.d.ts => Snap.ts}        |  0
 .../{SnapsParams.d.ts => SnapsParams.ts}      |  0
 .../snaps/types/{index.d.ts => index.ts}      |  4 +--
 .../{ProfileChange.d.ts => ProfileChange.ts}  |  0
 .../tags/types/{index.d.ts => index.ts}       |  0
 .../types/{FormProps.d.ts => FormProps.ts}    |  2 +-
 ...{UpgradeProfile.d.ts => UpgradeProfile.ts} |  0
 .../types/{index.d.ts => index.ts}            |  4 +--
 .../Upgrades/{types.d.ts => types.ts}         |  0
 .../upgrades/types/{index.d.ts => index.ts}   |  0
 .../{types.d.ts => types.ts}                  |  0
 .../types/{WslProfile.d.ts => WslProfile.ts}  |  0
 src/features/wsl-profiles/types/index.d.ts    |  1 -
 src/features/wsl-profiles/types/index.ts      |  1 +
 ...slInstanceType.d.ts => WslInstanceType.ts} |  0
 .../wsl/types/{index.d.ts => index.ts}        |  0
 .../{types.d.ts => types.ts}                  |  0
 .../{types.d.ts => types.ts}                  |  0
 .../EditInstance/{types.d.ts => types.ts}     |  0
 .../info/InfoPanel/{types.d.ts => types.ts}   |  0
 .../AddRoleForm/{types.d.ts => types.ts}      |  0
 .../EditRoleForm/{types.d.ts => types.ts}     |  0
 .../roles/RoleList/{types.d.ts => types.ts}   |  0
 .../settings/roles/{types.d.ts => types.ts}   |  0
 .../Navigation/{types.d.ts => types.ts}       |  0
 src/tests/server/handlers/activity.ts         |  2 +-
 src/tests/server/handlers/securityProfiles.ts |  2 +-
 src/types/{Action.d.ts => Action.ts}          |  0
 .../{Administrator.d.ts => Administrator.ts}  |  0
 src/types/{Breadcrumb.d.ts => Breadcrumb.ts}  |  0
 src/types/{Creator.d.ts => Creator.ts}        |  0
 .../{ExpandedCell.d.ts => ExpandedCell.ts}    |  0
 src/types/{Feature.d.ts => Feature.ts}        |  0
 src/types/{FeatureKey.d.ts => FeatureKey.ts}  |  0
 src/types/{Filters.d.ts => Filters.ts}        |  0
 src/types/{Permission.d.ts => Permission.ts}  |  0
 .../{Preferences.d.ts => Preferences.ts}      |  0
 src/types/{Profile.d.ts => Profile.ts}        |  0
 .../{RequestSchema.d.ts => RequestSchema.ts}  |  0
 src/types/{Role.d.ts => Role.ts}              |  0
 .../{SelectOption.d.ts => SelectOption.ts}    |  2 +-
 src/types/{UrlParams.d.ts => UrlParams.ts}    |  0
 src/types/{User.d.ts => User.ts}              |  0
 src/types/{Usn.d.ts => Usn.ts}                |  0
 src/types/api/{ApiError.d.ts => ApiError.ts}  |  0
 .../api/{QueryFnType.d.ts => QueryFnType.ts}  |  2 +-
 175 files changed, 140 insertions(+), 131 deletions(-)
 rename src/components/filter/TableFilter/{types.d.ts => types.ts} (100%)
 rename src/components/filter/TableFilterChips/{types.d.ts => types.ts} (100%)
 rename src/components/filter/{types.d.ts => types.ts} (100%)
 rename src/components/form/AssociationBlock/{types.d.ts => types.ts} (100%)
 rename src/components/form/ColumnFilter/{types.d.ts => types.ts} (100%)
 rename src/components/form/ScheduleBlock/{types.d.ts => types.ts} (100%)
 rename src/components/layout/PageContent/{types.d.ts => types.ts} (100%)
 rename src/components/ui/ResponsiveButtons/{types.d.ts => types.ts} (100%)
 rename src/features/access-groups/components/NewAccessGroupForm/{types.d.ts => types.ts} (100%)
 rename src/features/access-groups/types/{AccessGroup.d.ts => AccessGroup.ts} (100%)
 delete mode 100644 src/features/access-groups/types/index.d.ts
 create mode 100644 src/features/access-groups/types/index.ts
 rename src/features/activities/types/{Activity.d.ts => Activity.ts} (98%)
 rename src/features/activities/types/{ActivityParams.d.ts => ActivityParams.ts} (100%)
 rename src/features/activities/types/{index.d.ts => index.ts} (75%)
 rename src/features/alert-notifications/types/{AlertSummary.d.ts => AlertSummary.ts} (100%)
 delete mode 100644 src/features/alert-notifications/types/index.d.ts
 create mode 100644 src/features/alert-notifications/types/index.ts
 rename src/features/alerts/types/{AlertParams.d.ts => AlertParams.ts} (100%)
 rename src/features/alerts/types/{index.d.ts => index.ts} (65%)
 rename src/features/api-credentials/types/{ApiCredentials.d.ts => ApiCredentials.ts} (100%)
 rename src/features/api-credentials/types/{ApiCredentialsParams.d.ts => ApiCredentialsParams.ts} (100%)
 delete mode 100644 src/features/api-credentials/types/index.d.ts
 create mode 100644 src/features/api-credentials/types/index.ts
 rename src/features/apt-sources/components/NewAPTSourceForm/{types.d.ts => types.ts} (100%)
 rename src/features/apt-sources/types/{APTSource.d.ts => APTSource.ts} (100%)
 rename src/features/apt-sources/types/{APTSourceParams.d.ts => APTSourceParams.ts} (100%)
 rename src/features/apt-sources/types/{index.d.ts => index.ts} (62%)
 rename src/features/attach/components/OTPInputContainer/{types.d.ts => types.ts} (100%)
 rename src/features/auth/components/ProviderForm/{types.d.ts => types.ts} (100%)
 rename src/features/auth/types/{AuthUser.d.ts => AuthUser.ts} (100%)
 rename src/features/auth/types/{IdentityProvider.d.ts => IdentityProvider.ts} (93%)
 rename src/features/auth/types/{index.d.ts => index.ts} (76%)
 rename src/features/autoinstall-files/components/AutoinstallFileForm/{types.d.ts => types.ts} (100%)
 rename src/features/autoinstall-files/types/{AutoinstallFile.d.ts => AutoinstallFile.ts} (86%)
 delete mode 100644 src/features/autoinstall-files/types/index.d.ts
 create mode 100644 src/features/autoinstall-files/types/index.ts
 rename src/features/employees/components/DeactivateEmployeeModal/{types.d.ts => types.ts} (100%)
 rename src/features/employees/types/{Employee.d.ts => Employee.ts} (100%)
 rename src/features/employees/types/{EmployeeParams.d.ts => EmployeeParams.ts} (94%)
 rename src/features/employees/types/{index.d.ts => index.ts} (100%)
 rename src/features/events-log/types/{EventLog.d.ts => EventLog.ts} (100%)
 rename src/features/events-log/types/{EventsLogParams.d.ts => EventsLogParams.ts} (100%)
 delete mode 100644 src/features/events-log/types/index.d.ts
 create mode 100644 src/features/events-log/types/index.ts
 rename src/features/general-settings/components/EditUserForm/{types.d.ts => types.ts} (100%)
 rename src/features/general-settings/types/{UserDetails.d.ts => UserDetails.ts} (100%)
 rename src/features/general-settings/types/{UserGeneralSettingsParams.d.ts => UserGeneralSettingsParams.ts} (100%)
 rename src/features/general-settings/types/{index.d.ts => index.ts} (57%)
 rename src/features/gpg-keys/components/NewGPGKeyForm/{types.d.ts => types.ts} (100%)
 rename src/features/gpg-keys/types/{GPGKey.d.ts => GPGKey.ts} (100%)
 rename src/features/gpg-keys/types/{GPGKeyParams.d.ts => GPGKeyParams.ts} (100%)
 rename src/features/gpg-keys/types/{index.d.ts => index.ts} (55%)
 rename src/features/instances/components/AccessGroupChange/{types.d.ts => types.ts} (100%)
 rename src/features/instances/components/InstanceList/{types.d.ts => types.ts} (86%)
 rename src/features/instances/components/TagsAddForm/{types.d.ts => types.ts} (100%)
 rename src/features/kernel/components/DowngradeKernelForm/{types.d.ts => types.ts} (100%)
 rename src/features/kernel/components/RestartInstanceForm/{types.d.ts => types.ts} (100%)
 rename src/features/kernel/components/UpgradeKernelForm/{types.d.ts => types.ts} (100%)
 rename src/features/kernel/types/{Kernel.d.ts => Kernel.ts} (100%)
 rename src/features/kernel/types/{LivepatchInformation.d.ts => LivepatchInformation.ts} (100%)
 delete mode 100644 src/features/kernel/types/index.d.ts
 create mode 100644 src/features/kernel/types/index.ts
 rename src/features/mirrors/components/DeriveSeriesForm/{types.d.ts => types.ts} (100%)
 rename src/features/mirrors/components/EditPocketForm/{types.d.ts => types.ts} (100%)
 rename src/features/mirrors/components/NewDistributionForm/{types.d.ts => types.ts} (100%)
 rename src/features/mirrors/components/NewPocketForm/{types.d.ts => types.ts} (95%)
 rename src/features/mirrors/components/NewSeriesForm/{types.d.ts => types.ts} (80%)
 delete mode 100644 src/features/mirrors/components/SeriesPocketList/types.d.ts
 create mode 100644 src/features/mirrors/components/SeriesPocketList/types.ts
 rename src/features/mirrors/types/{Distribution.d.ts => Distribution.ts} (100%)
 rename src/features/mirrors/types/{DistributionParams.d.ts => DistributionParams.ts} (100%)
 rename src/features/mirrors/types/{FormTypes.d.ts => FormTypes.ts} (100%)
 rename src/features/mirrors/types/{FormattedPackage.d.ts => FormattedPackage.ts} (100%)
 rename src/features/mirrors/types/{Pocket.d.ts => Pocket.ts} (89%)
 rename src/features/mirrors/types/{PocketParams.d.ts => PocketParams.ts} (100%)
 rename src/features/mirrors/types/{Series.d.ts => Series.ts} (100%)
 rename src/features/mirrors/types/{SeriesParams.d.ts => SeriesParams.ts} (100%)
 rename src/features/mirrors/types/{SyncPocketRef.d.ts => SyncPocketRef.ts} (100%)
 rename src/features/mirrors/types/{UseDistributionsResult.d.ts => UseDistributionsResult.ts} (100%)
 rename src/features/mirrors/types/{UseGPGKeysOptionsResult.d.ts => UseGPGKeysOptionsResult.ts} (68%)
 rename src/features/mirrors/types/{UsePocketsResult.d.ts => UsePocketsResult.ts} (100%)
 rename src/features/mirrors/types/{UseSeriesResult.d.ts => UseSeriesResult.ts} (100%)
 rename src/features/mirrors/types/{index.d.ts => index.ts} (80%)
 rename src/features/oidc/{types.d.ts => types.ts} (100%)
 rename src/features/overview/{types.d.ts => types.ts} (100%)
 rename src/features/package-profiles/types/{FormProps.d.ts => FormProps.ts} (92%)
 rename src/features/package-profiles/types/{PackageProfile.d.ts => PackageProfile.ts} (98%)
 rename src/features/package-profiles/types/{index.d.ts => index.ts} (88%)
 delete mode 100644 src/features/packages/components/InstalledPackagesActionForm/types.d.ts
 create mode 100644 src/features/packages/components/InstalledPackagesActionForm/types.ts
 rename src/features/packages/types/{InstalledPackageAction.d.ts => InstalledPackageAction.ts} (100%)
 rename src/features/packages/types/{Package.d.ts => Package.ts} (100%)
 rename src/features/packages/types/{index.d.ts => index.ts} (79%)
 rename src/features/processes/types/{Process.d.ts => Process.ts} (100%)
 rename src/features/processes/types/{ProcessesParams.d.ts => ProcessesParams.ts} (100%)
 delete mode 100644 src/features/processes/types/index.d.ts
 create mode 100644 src/features/processes/types/index.ts
 rename src/features/reboot-profiles/components/RebootProfilesForm/{types.d.ts => types.ts} (100%)
 rename src/features/reboot-profiles/types/{RebootProfile.d.ts => RebootProfile.ts} (100%)
 rename src/features/reboot-profiles/types/{index.d.ts => index.ts} (100%)
 rename src/features/removal-profiles/components/SingleRemovalProfileForm/{types.d.ts => types.ts} (83%)
 rename src/features/removal-profiles/types/{RemovalProfile.d.ts => RemovalProfile.ts} (100%)
 delete mode 100644 src/features/removal-profiles/types/index.d.ts
 create mode 100644 src/features/removal-profiles/types/index.ts
 rename src/features/repository-profiles/types/{RepositoryProfile.d.ts => RepositoryProfile.ts} (100%)
 rename src/features/repository-profiles/types/{RepositoryProfileFormValues.d.ts => RepositoryProfileFormValues.ts} (100%)
 delete mode 100644 src/features/repository-profiles/types/index.d.ts
 create mode 100644 src/features/repository-profiles/types/index.ts
 rename src/features/saved-searches/types/{SavedSearch.d.ts => SavedSearch.ts} (100%)
 delete mode 100644 src/features/saved-searches/types/index.d.ts
 create mode 100644 src/features/saved-searches/types/index.ts
 rename src/features/script-profiles/components/ScriptProfileForm/{types.d.ts => types.ts} (100%)
 rename src/features/script-profiles/types/{ScriptProfile.d.ts => ScriptProfile.ts} (100%)
 rename src/features/script-profiles/types/{index.d.ts => index.ts} (100%)
 rename src/features/scripts/components/RunInstanceScriptForm/{types.d.ts => types.ts} (66%)
 rename src/features/scripts/components/RunScriptForm/{types.d.ts => types.ts} (100%)
 rename src/features/scripts/types/{RunInstanceScriptFormValues.d.ts => RunInstanceScriptFormValues.ts} (100%)
 rename src/features/scripts/types/{Script.d.ts => Script.ts} (97%)
 rename src/features/scripts/types/{ScriptFormValues.d.ts => ScriptFormValues.ts} (100%)
 rename src/features/scripts/types/{ScriptStatus.d.ts => ScriptStatus.ts} (100%)
 rename src/features/scripts/types/{ScriptTab.d.ts => ScriptTab.ts} (100%)
 delete mode 100644 src/features/scripts/types/index.d.ts
 create mode 100644 src/features/scripts/types/index.ts
 rename src/features/security-profiles/types/{SecurityProfile.d.ts => SecurityProfile.ts} (100%)
 rename src/features/security-profiles/types/{SecurityProfileActions.d.ts => SecurityProfileActions.ts} (100%)
 rename src/features/security-profiles/types/{SecurityProfileAddFormValues.d.ts => SecurityProfileAddFormValues.ts} (100%)
 rename src/features/security-profiles/types/{index.d.ts => index.ts} (100%)
 rename src/features/snaps/components/EditSnap/{types.d.ts => types.ts} (90%)
 rename src/features/snaps/types/{Snap.d.ts => Snap.ts} (100%)
 rename src/features/snaps/types/{SnapsParams.d.ts => SnapsParams.ts} (100%)
 rename src/features/snaps/types/{index.d.ts => index.ts} (88%)
 rename src/features/tags/types/{ProfileChange.d.ts => ProfileChange.ts} (100%)
 rename src/features/tags/types/{index.d.ts => index.ts} (100%)
 rename src/features/upgrade-profiles/types/{FormProps.d.ts => FormProps.ts} (81%)
 rename src/features/upgrade-profiles/types/{UpgradeProfile.d.ts => UpgradeProfile.ts} (100%)
 rename src/features/upgrade-profiles/types/{index.d.ts => index.ts} (65%)
 rename src/features/upgrades/components/Upgrades/{types.d.ts => types.ts} (100%)
 rename src/features/upgrades/types/{index.d.ts => index.ts} (100%)
 rename src/features/wsl-profiles/components/WslProfileAddSidePanel/{types.d.ts => types.ts} (100%)
 rename src/features/wsl-profiles/types/{WslProfile.d.ts => WslProfile.ts} (100%)
 delete mode 100644 src/features/wsl-profiles/types/index.d.ts
 create mode 100644 src/features/wsl-profiles/types/index.ts
 rename src/features/wsl/types/{WslInstanceType.d.ts => WslInstanceType.ts} (100%)
 rename src/features/wsl/types/{index.d.ts => index.ts} (100%)
 rename src/libs/pageParamsManager/{types.d.ts => types.ts} (100%)
 rename src/pages/dashboard/instances/[single]/tabs/info/AssignEmployeeToInstanceForm/{types.d.ts => types.ts} (100%)
 rename src/pages/dashboard/instances/[single]/tabs/info/EditInstance/{types.d.ts => types.ts} (100%)
 rename src/pages/dashboard/instances/[single]/tabs/info/InfoPanel/{types.d.ts => types.ts} (100%)
 rename src/pages/dashboard/settings/roles/AddRoleForm/{types.d.ts => types.ts} (100%)
 rename src/pages/dashboard/settings/roles/EditRoleForm/{types.d.ts => types.ts} (100%)
 rename src/pages/dashboard/settings/roles/RoleList/{types.d.ts => types.ts} (100%)
 rename src/pages/dashboard/settings/roles/{types.d.ts => types.ts} (100%)
 rename src/templates/dashboard/Navigation/{types.d.ts => types.ts} (100%)
 rename src/types/{Action.d.ts => Action.ts} (100%)
 rename src/types/{Administrator.d.ts => Administrator.ts} (100%)
 rename src/types/{Breadcrumb.d.ts => Breadcrumb.ts} (100%)
 rename src/types/{Creator.d.ts => Creator.ts} (100%)
 rename src/types/{ExpandedCell.d.ts => ExpandedCell.ts} (100%)
 rename src/types/{Feature.d.ts => Feature.ts} (100%)
 rename src/types/{FeatureKey.d.ts => FeatureKey.ts} (100%)
 rename src/types/{Filters.d.ts => Filters.ts} (100%)
 rename src/types/{Permission.d.ts => Permission.ts} (100%)
 rename src/types/{Preferences.d.ts => Preferences.ts} (100%)
 rename src/types/{Profile.d.ts => Profile.ts} (100%)
 rename src/types/{RequestSchema.d.ts => RequestSchema.ts} (100%)
 rename src/types/{Role.d.ts => Role.ts} (100%)
 rename src/types/{SelectOption.d.ts => SelectOption.ts} (71%)
 rename src/types/{UrlParams.d.ts => UrlParams.ts} (100%)
 rename src/types/{User.d.ts => User.ts} (100%)
 rename src/types/{Usn.d.ts => Usn.ts} (100%)
 rename src/types/api/{ApiError.d.ts => ApiError.ts} (100%)
 rename src/types/api/{QueryFnType.d.ts => QueryFnType.ts} (92%)

diff --git a/src/components/filter/TableFilter/types.d.ts b/src/components/filter/TableFilter/types.ts
similarity index 100%
rename from src/components/filter/TableFilter/types.d.ts
rename to src/components/filter/TableFilter/types.ts
diff --git a/src/components/filter/TableFilterChips/types.d.ts b/src/components/filter/TableFilterChips/types.ts
similarity index 100%
rename from src/components/filter/TableFilterChips/types.d.ts
rename to src/components/filter/TableFilterChips/types.ts
diff --git a/src/components/filter/types.d.ts b/src/components/filter/types.ts
similarity index 100%
rename from src/components/filter/types.d.ts
rename to src/components/filter/types.ts
diff --git a/src/components/form/AssociationBlock/types.d.ts b/src/components/form/AssociationBlock/types.ts
similarity index 100%
rename from src/components/form/AssociationBlock/types.d.ts
rename to src/components/form/AssociationBlock/types.ts
diff --git a/src/components/form/ColumnFilter/types.d.ts b/src/components/form/ColumnFilter/types.ts
similarity index 100%
rename from src/components/form/ColumnFilter/types.d.ts
rename to src/components/form/ColumnFilter/types.ts
diff --git a/src/components/form/ScheduleBlock/types.d.ts b/src/components/form/ScheduleBlock/types.ts
similarity index 100%
rename from src/components/form/ScheduleBlock/types.d.ts
rename to src/components/form/ScheduleBlock/types.ts
diff --git a/src/components/layout/PageContent/types.d.ts b/src/components/layout/PageContent/types.ts
similarity index 100%
rename from src/components/layout/PageContent/types.d.ts
rename to src/components/layout/PageContent/types.ts
diff --git a/src/components/ui/ResponsiveButtons/types.d.ts b/src/components/ui/ResponsiveButtons/types.ts
similarity index 100%
rename from src/components/ui/ResponsiveButtons/types.d.ts
rename to src/components/ui/ResponsiveButtons/types.ts
diff --git a/src/features/access-groups/components/NewAccessGroupForm/types.d.ts b/src/features/access-groups/components/NewAccessGroupForm/types.ts
similarity index 100%
rename from src/features/access-groups/components/NewAccessGroupForm/types.d.ts
rename to src/features/access-groups/components/NewAccessGroupForm/types.ts
diff --git a/src/features/access-groups/types/AccessGroup.d.ts b/src/features/access-groups/types/AccessGroup.ts
similarity index 100%
rename from src/features/access-groups/types/AccessGroup.d.ts
rename to src/features/access-groups/types/AccessGroup.ts
diff --git a/src/features/access-groups/types/index.d.ts b/src/features/access-groups/types/index.d.ts
deleted file mode 100644
index 75ffda5d6..000000000
--- a/src/features/access-groups/types/index.d.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { AccessGroup, AccessGroupWithInstancesCount } from "./AccessGroup";
diff --git a/src/features/access-groups/types/index.ts b/src/features/access-groups/types/index.ts
new file mode 100644
index 000000000..ac9f33b14
--- /dev/null
+++ b/src/features/access-groups/types/index.ts
@@ -0,0 +1 @@
+export type { AccessGroup, AccessGroupWithInstancesCount } from "./AccessGroup";
diff --git a/src/features/activities/types/Activity.d.ts b/src/features/activities/types/Activity.ts
similarity index 98%
rename from src/features/activities/types/Activity.d.ts
rename to src/features/activities/types/Activity.ts
index 8c5117876..088bfba18 100644
--- a/src/features/activities/types/Activity.d.ts
+++ b/src/features/activities/types/Activity.ts
@@ -1,4 +1,4 @@
-import type { Creator } from "./Creator";
+import type { Creator } from "@/types/Creator";
 
 export type ActivityStatus =
   | "succeeded"
diff --git a/src/features/activities/types/ActivityParams.d.ts b/src/features/activities/types/ActivityParams.ts
similarity index 100%
rename from src/features/activities/types/ActivityParams.d.ts
rename to src/features/activities/types/ActivityParams.ts
diff --git a/src/features/activities/types/index.d.ts b/src/features/activities/types/index.ts
similarity index 75%
rename from src/features/activities/types/index.d.ts
rename to src/features/activities/types/index.ts
index a741b13f0..c85f39573 100644
--- a/src/features/activities/types/index.d.ts
+++ b/src/features/activities/types/index.ts
@@ -1,19 +1,14 @@
-export {
+export type {
   Activity,
   ActivityCommon,
   ActivityGroup,
   ActivityMostlyCommon,
   ActivityStatus,
   ActivityPackagesRequest,
-  PackageChanges,
-  PocketInfo,
-  ScheduleWindow,
-  DeliveryWindow,
-  DelayWindow,
   SyncPocketRequest,
 } from "./Activity";
 
-export {
+export type {
   ApproveActivitiesParams,
   CancelActivitiesParams,
   GetActivitiesParams,
diff --git a/src/features/alert-notifications/types/AlertSummary.d.ts b/src/features/alert-notifications/types/AlertSummary.ts
similarity index 100%
rename from src/features/alert-notifications/types/AlertSummary.d.ts
rename to src/features/alert-notifications/types/AlertSummary.ts
diff --git a/src/features/alert-notifications/types/index.d.ts b/src/features/alert-notifications/types/index.d.ts
deleted file mode 100644
index 0f20583eb..000000000
--- a/src/features/alert-notifications/types/index.d.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { AlertSummary, AlertSummaryResponse } from "./AlertSummary";
diff --git a/src/features/alert-notifications/types/index.ts b/src/features/alert-notifications/types/index.ts
new file mode 100644
index 000000000..6d15587cf
--- /dev/null
+++ b/src/features/alert-notifications/types/index.ts
@@ -0,0 +1 @@
+export type { AlertSummary, AlertSummaryResponse } from "./AlertSummary";
diff --git a/src/features/alerts/types/AlertParams.d.ts b/src/features/alerts/types/AlertParams.ts
similarity index 100%
rename from src/features/alerts/types/AlertParams.d.ts
rename to src/features/alerts/types/AlertParams.ts
diff --git a/src/features/alerts/types/index.d.ts b/src/features/alerts/types/index.ts
similarity index 65%
rename from src/features/alerts/types/index.d.ts
rename to src/features/alerts/types/index.ts
index 49de9fb77..6219d694a 100644
--- a/src/features/alerts/types/index.d.ts
+++ b/src/features/alerts/types/index.ts
@@ -1,7 +1,7 @@
-export {
+export type {
   AssociateAlertParams,
   DisassociateAlertParams,
   SubscriptionParams,
 } from "./AlertParams";
 
-export { Alert } from "./Alert";
+export type { Alert } from "./Alert";
diff --git a/src/features/api-credentials/types/ApiCredentials.d.ts b/src/features/api-credentials/types/ApiCredentials.ts
similarity index 100%
rename from src/features/api-credentials/types/ApiCredentials.d.ts
rename to src/features/api-credentials/types/ApiCredentials.ts
index c4c4b3b0f..d199209c0 100644
--- a/src/features/api-credentials/types/ApiCredentials.d.ts
+++ b/src/features/api-credentials/types/ApiCredentials.ts
@@ -2,14 +2,14 @@ export interface UserCredentials {
   credentials: Credential[];
 }
 
-export interface Credential extends ApiKeyCredentials, Record<string, unknown> {
-  account_title: string;
-  endpoint: string;
-  exports: string;
-}
-
 export interface ApiKeyCredentials {
   access_key: string;
   account_name: string;
   secret_key: string;
 }
+
+export interface Credential extends ApiKeyCredentials, Record<string, unknown> {
+  account_title: string;
+  endpoint: string;
+  exports: string;
+}
diff --git a/src/features/api-credentials/types/ApiCredentialsParams.d.ts b/src/features/api-credentials/types/ApiCredentialsParams.ts
similarity index 100%
rename from src/features/api-credentials/types/ApiCredentialsParams.d.ts
rename to src/features/api-credentials/types/ApiCredentialsParams.ts
diff --git a/src/features/api-credentials/types/index.d.ts b/src/features/api-credentials/types/index.d.ts
deleted file mode 100644
index 984c284aa..000000000
--- a/src/features/api-credentials/types/index.d.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-export { GenerateApiCredentialsParams } from "./ApiCredentialsParams";
-export {
-  ApiKeyCredentials,
-  Credential,
-  UserCredentials,
-} from "./ApiCredentials";
diff --git a/src/features/api-credentials/types/index.ts b/src/features/api-credentials/types/index.ts
new file mode 100644
index 000000000..b1dadbc4a
--- /dev/null
+++ b/src/features/api-credentials/types/index.ts
@@ -0,0 +1,6 @@
+export type { GenerateApiCredentialsParams } from "./ApiCredentialsParams";
+export type {
+  ApiKeyCredentials,
+  Credential,
+  UserCredentials,
+} from "./ApiCredentials";
diff --git a/src/features/apt-sources/components/NewAPTSourceForm/types.d.ts b/src/features/apt-sources/components/NewAPTSourceForm/types.ts
similarity index 100%
rename from src/features/apt-sources/components/NewAPTSourceForm/types.d.ts
rename to src/features/apt-sources/components/NewAPTSourceForm/types.ts
diff --git a/src/features/apt-sources/types/APTSource.d.ts b/src/features/apt-sources/types/APTSource.ts
similarity index 100%
rename from src/features/apt-sources/types/APTSource.d.ts
rename to src/features/apt-sources/types/APTSource.ts
diff --git a/src/features/apt-sources/types/APTSourceParams.d.ts b/src/features/apt-sources/types/APTSourceParams.ts
similarity index 100%
rename from src/features/apt-sources/types/APTSourceParams.d.ts
rename to src/features/apt-sources/types/APTSourceParams.ts
diff --git a/src/features/apt-sources/types/index.d.ts b/src/features/apt-sources/types/index.ts
similarity index 62%
rename from src/features/apt-sources/types/index.d.ts
rename to src/features/apt-sources/types/index.ts
index 789feee4c..47cb59b32 100644
--- a/src/features/apt-sources/types/index.d.ts
+++ b/src/features/apt-sources/types/index.ts
@@ -1,5 +1,5 @@
-export { APTSource } from "./APTSource";
-export {
+export type { APTSource } from "./APTSource";
+export type {
   CreateAPTSourceParams,
   GetAPTSourcesParams,
   RemoveAPTSourceParams,
diff --git a/src/features/attach/components/OTPInputContainer/types.d.ts b/src/features/attach/components/OTPInputContainer/types.ts
similarity index 100%
rename from src/features/attach/components/OTPInputContainer/types.d.ts
rename to src/features/attach/components/OTPInputContainer/types.ts
diff --git a/src/features/auth/components/ProviderForm/types.d.ts b/src/features/auth/components/ProviderForm/types.ts
similarity index 100%
rename from src/features/auth/components/ProviderForm/types.d.ts
rename to src/features/auth/components/ProviderForm/types.ts
diff --git a/src/features/auth/types/AuthUser.d.ts b/src/features/auth/types/AuthUser.ts
similarity index 100%
rename from src/features/auth/types/AuthUser.d.ts
rename to src/features/auth/types/AuthUser.ts
diff --git a/src/features/auth/types/IdentityProvider.d.ts b/src/features/auth/types/IdentityProvider.ts
similarity index 93%
rename from src/features/auth/types/IdentityProvider.d.ts
rename to src/features/auth/types/IdentityProvider.ts
index b1589551d..aef739571 100644
--- a/src/features/auth/types/IdentityProvider.d.ts
+++ b/src/features/auth/types/IdentityProvider.ts
@@ -29,7 +29,7 @@ export interface OktaProviderConfiguration {
   discovery_uri: string;
 }
 
-type ProviderConfiguration = OktaProviderConfiguration;
+export type ProviderConfiguration = OktaProviderConfiguration;
 
 export interface SingleIdentityProvider {
   configuration: ProviderConfiguration;
diff --git a/src/features/auth/types/index.d.ts b/src/features/auth/types/index.ts
similarity index 76%
rename from src/features/auth/types/index.d.ts
rename to src/features/auth/types/index.ts
index b7b2ad24d..04cc0f3c6 100644
--- a/src/features/auth/types/index.d.ts
+++ b/src/features/auth/types/index.ts
@@ -1,4 +1,4 @@
-export {
+export type {
   IdentityProvider,
   OktaProviderConfiguration,
   ProviderConfiguration,
@@ -8,4 +8,4 @@ export {
   SupportedIdentityProvider,
 } from "./IdentityProvider";
 
-export { Account, AuthUser } from "./AuthUser";
+export type { Account, AuthUser } from "./AuthUser";
diff --git a/src/features/autoinstall-files/components/AutoinstallFileForm/types.d.ts b/src/features/autoinstall-files/components/AutoinstallFileForm/types.ts
similarity index 100%
rename from src/features/autoinstall-files/components/AutoinstallFileForm/types.d.ts
rename to src/features/autoinstall-files/components/AutoinstallFileForm/types.ts
diff --git a/src/features/autoinstall-files/types/AutoinstallFile.d.ts b/src/features/autoinstall-files/types/AutoinstallFile.ts
similarity index 86%
rename from src/features/autoinstall-files/types/AutoinstallFile.d.ts
rename to src/features/autoinstall-files/types/AutoinstallFile.ts
index 4dac33ed3..bed7247f7 100644
--- a/src/features/autoinstall-files/types/AutoinstallFile.d.ts
+++ b/src/features/autoinstall-files/types/AutoinstallFile.ts
@@ -13,10 +13,10 @@ export interface AutoinstallFileVersionInfo extends Record<string, unknown> {
   created_at: string;
 }
 
-export interface WithMetadata<T extends AutoinstallFile> extends T {
+export type WithMetadata<T extends AutoinstallFile> = T & {
   metadata: {
     current_version: number;
     max_versions: number;
     versions: AutoinstallFileVersionInfo[];
   };
-}
+};
diff --git a/src/features/autoinstall-files/types/index.d.ts b/src/features/autoinstall-files/types/index.d.ts
deleted file mode 100644
index 643225948..000000000
--- a/src/features/autoinstall-files/types/index.d.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export { AutoinstallFile, WithMetadata } from "./AutoinstallFile";
-export { AutoinstallFileTabId } from "./AutoinstallFileTab";
diff --git a/src/features/autoinstall-files/types/index.ts b/src/features/autoinstall-files/types/index.ts
new file mode 100644
index 000000000..4e4f4244f
--- /dev/null
+++ b/src/features/autoinstall-files/types/index.ts
@@ -0,0 +1,2 @@
+export type { AutoinstallFile, WithMetadata } from "./AutoinstallFile";
+export type { AutoinstallFileTabId } from "./AutoinstallFileTab";
diff --git a/src/features/employees/components/DeactivateEmployeeModal/types.d.ts b/src/features/employees/components/DeactivateEmployeeModal/types.ts
similarity index 100%
rename from src/features/employees/components/DeactivateEmployeeModal/types.d.ts
rename to src/features/employees/components/DeactivateEmployeeModal/types.ts
diff --git a/src/features/employees/types/Employee.d.ts b/src/features/employees/types/Employee.ts
similarity index 100%
rename from src/features/employees/types/Employee.d.ts
rename to src/features/employees/types/Employee.ts
diff --git a/src/features/employees/types/EmployeeParams.d.ts b/src/features/employees/types/EmployeeParams.ts
similarity index 94%
rename from src/features/employees/types/EmployeeParams.d.ts
rename to src/features/employees/types/EmployeeParams.ts
index afbd05bc4..4f7d01a3d 100644
--- a/src/features/employees/types/EmployeeParams.d.ts
+++ b/src/features/employees/types/EmployeeParams.ts
@@ -1,4 +1,4 @@
-interface EmployeeActionParams {
+export interface EmployeeActionParams {
   id: number;
 }
 
diff --git a/src/features/employees/types/index.d.ts b/src/features/employees/types/index.ts
similarity index 100%
rename from src/features/employees/types/index.d.ts
rename to src/features/employees/types/index.ts
diff --git a/src/features/events-log/types/EventLog.d.ts b/src/features/events-log/types/EventLog.ts
similarity index 100%
rename from src/features/events-log/types/EventLog.d.ts
rename to src/features/events-log/types/EventLog.ts
diff --git a/src/features/events-log/types/EventsLogParams.d.ts b/src/features/events-log/types/EventsLogParams.ts
similarity index 100%
rename from src/features/events-log/types/EventsLogParams.d.ts
rename to src/features/events-log/types/EventsLogParams.ts
diff --git a/src/features/events-log/types/index.d.ts b/src/features/events-log/types/index.d.ts
deleted file mode 100644
index 6dfb650e9..000000000
--- a/src/features/events-log/types/index.d.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export { GetEventsLogParams } from "./EventsLogParams";
-export { EventLog } from "./EventLog";
diff --git a/src/features/events-log/types/index.ts b/src/features/events-log/types/index.ts
new file mode 100644
index 000000000..e01102141
--- /dev/null
+++ b/src/features/events-log/types/index.ts
@@ -0,0 +1,2 @@
+export type { GetEventsLogParams } from "./EventsLogParams";
+export type { EventLog } from "./EventLog";
diff --git a/src/features/general-settings/components/EditUserForm/types.d.ts b/src/features/general-settings/components/EditUserForm/types.ts
similarity index 100%
rename from src/features/general-settings/components/EditUserForm/types.d.ts
rename to src/features/general-settings/components/EditUserForm/types.ts
diff --git a/src/features/general-settings/types/UserDetails.d.ts b/src/features/general-settings/types/UserDetails.ts
similarity index 100%
rename from src/features/general-settings/types/UserDetails.d.ts
rename to src/features/general-settings/types/UserDetails.ts
diff --git a/src/features/general-settings/types/UserGeneralSettingsParams.d.ts b/src/features/general-settings/types/UserGeneralSettingsParams.ts
similarity index 100%
rename from src/features/general-settings/types/UserGeneralSettingsParams.d.ts
rename to src/features/general-settings/types/UserGeneralSettingsParams.ts
diff --git a/src/features/general-settings/types/index.d.ts b/src/features/general-settings/types/index.ts
similarity index 57%
rename from src/features/general-settings/types/index.d.ts
rename to src/features/general-settings/types/index.ts
index 3e1e0fc10..ffcd37490 100644
--- a/src/features/general-settings/types/index.d.ts
+++ b/src/features/general-settings/types/index.ts
@@ -1,6 +1,6 @@
-export {
+export type {
   ChangePasswordParams,
   EditUserDetailsParams,
 } from "./UserGeneralSettingsParams";
 
-export { UserDetails } from "./UserDetails";
+export type { UserDetails } from "./UserDetails";
diff --git a/src/features/gpg-keys/components/NewGPGKeyForm/types.d.ts b/src/features/gpg-keys/components/NewGPGKeyForm/types.ts
similarity index 100%
rename from src/features/gpg-keys/components/NewGPGKeyForm/types.d.ts
rename to src/features/gpg-keys/components/NewGPGKeyForm/types.ts
diff --git a/src/features/gpg-keys/types/GPGKey.d.ts b/src/features/gpg-keys/types/GPGKey.ts
similarity index 100%
rename from src/features/gpg-keys/types/GPGKey.d.ts
rename to src/features/gpg-keys/types/GPGKey.ts
diff --git a/src/features/gpg-keys/types/GPGKeyParams.d.ts b/src/features/gpg-keys/types/GPGKeyParams.ts
similarity index 100%
rename from src/features/gpg-keys/types/GPGKeyParams.d.ts
rename to src/features/gpg-keys/types/GPGKeyParams.ts
diff --git a/src/features/gpg-keys/types/index.d.ts b/src/features/gpg-keys/types/index.ts
similarity index 55%
rename from src/features/gpg-keys/types/index.d.ts
rename to src/features/gpg-keys/types/index.ts
index 0848daa58..fe195f2d5 100644
--- a/src/features/gpg-keys/types/index.d.ts
+++ b/src/features/gpg-keys/types/index.ts
@@ -1,5 +1,5 @@
-export { GPGKey, UploadedGPGKey } from "./GPGKey";
-export {
+export type { GPGKey, UploadedGPGKey } from "./GPGKey";
+export type {
   GetGPGKeysParams,
   ImportGPGKeyParams,
   RemoveGPGKeyParams,
diff --git a/src/features/instances/components/AccessGroupChange/types.d.ts b/src/features/instances/components/AccessGroupChange/types.ts
similarity index 100%
rename from src/features/instances/components/AccessGroupChange/types.d.ts
rename to src/features/instances/components/AccessGroupChange/types.ts
diff --git a/src/features/instances/components/InstanceList/types.d.ts b/src/features/instances/components/InstanceList/types.ts
similarity index 86%
rename from src/features/instances/components/InstanceList/types.d.ts
rename to src/features/instances/components/InstanceList/types.ts
index 57c5b6f0f..ffa4257ee 100644
--- a/src/features/instances/components/InstanceList/types.d.ts
+++ b/src/features/instances/components/InstanceList/types.ts
@@ -1,12 +1,12 @@
 import type { Instance } from "@/types/Instance";
 import type { CellProps, Column } from "react-table";
 
-export interface InstanceColumn extends Column<Instance> {
+export type InstanceColumn = Column<Instance> & {
   accessor: string;
   canBeHidden: boolean;
   optionLabel: string;
   getCellIcon?: (cell: CellProps<Instance>) => string | undefined;
-}
+};
 
 export interface GetUpgradesResult {
   regular: { icon: string; label: string } | false;
diff --git a/src/features/instances/components/TagsAddForm/types.d.ts b/src/features/instances/components/TagsAddForm/types.ts
similarity index 100%
rename from src/features/instances/components/TagsAddForm/types.d.ts
rename to src/features/instances/components/TagsAddForm/types.ts
diff --git a/src/features/kernel/components/DowngradeKernelForm/types.d.ts b/src/features/kernel/components/DowngradeKernelForm/types.ts
similarity index 100%
rename from src/features/kernel/components/DowngradeKernelForm/types.d.ts
rename to src/features/kernel/components/DowngradeKernelForm/types.ts
diff --git a/src/features/kernel/components/RestartInstanceForm/types.d.ts b/src/features/kernel/components/RestartInstanceForm/types.ts
similarity index 100%
rename from src/features/kernel/components/RestartInstanceForm/types.d.ts
rename to src/features/kernel/components/RestartInstanceForm/types.ts
diff --git a/src/features/kernel/components/UpgradeKernelForm/types.d.ts b/src/features/kernel/components/UpgradeKernelForm/types.ts
similarity index 100%
rename from src/features/kernel/components/UpgradeKernelForm/types.d.ts
rename to src/features/kernel/components/UpgradeKernelForm/types.ts
diff --git a/src/features/kernel/types/Kernel.d.ts b/src/features/kernel/types/Kernel.ts
similarity index 100%
rename from src/features/kernel/types/Kernel.d.ts
rename to src/features/kernel/types/Kernel.ts
diff --git a/src/features/kernel/types/LivepatchInformation.d.ts b/src/features/kernel/types/LivepatchInformation.ts
similarity index 100%
rename from src/features/kernel/types/LivepatchInformation.d.ts
rename to src/features/kernel/types/LivepatchInformation.ts
diff --git a/src/features/kernel/types/index.d.ts b/src/features/kernel/types/index.d.ts
deleted file mode 100644
index e9f213b59..000000000
--- a/src/features/kernel/types/index.d.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-export { Kernel, KernelManagementInfo, KernelOverviewInfo } from "./Kernel";
-
-export {
-  Fix,
-  KernelStatus,
-  LivepatchInformation,
-} from "./LivepatchInformation";
diff --git a/src/features/kernel/types/index.ts b/src/features/kernel/types/index.ts
new file mode 100644
index 000000000..84e5ceee3
--- /dev/null
+++ b/src/features/kernel/types/index.ts
@@ -0,0 +1,11 @@
+export type {
+  Kernel,
+  KernelManagementInfo,
+  KernelOverviewInfo,
+} from "./Kernel";
+
+export type {
+  Fix,
+  KernelStatus,
+  LivepatchInformation,
+} from "./LivepatchInformation";
diff --git a/src/features/mirrors/components/DeriveSeriesForm/types.d.ts b/src/features/mirrors/components/DeriveSeriesForm/types.ts
similarity index 100%
rename from src/features/mirrors/components/DeriveSeriesForm/types.d.ts
rename to src/features/mirrors/components/DeriveSeriesForm/types.ts
diff --git a/src/features/mirrors/components/EditPocketForm/types.d.ts b/src/features/mirrors/components/EditPocketForm/types.ts
similarity index 100%
rename from src/features/mirrors/components/EditPocketForm/types.d.ts
rename to src/features/mirrors/components/EditPocketForm/types.ts
diff --git a/src/features/mirrors/components/NewDistributionForm/types.d.ts b/src/features/mirrors/components/NewDistributionForm/types.ts
similarity index 100%
rename from src/features/mirrors/components/NewDistributionForm/types.d.ts
rename to src/features/mirrors/components/NewDistributionForm/types.ts
diff --git a/src/features/mirrors/components/NewPocketForm/types.d.ts b/src/features/mirrors/components/NewPocketForm/types.ts
similarity index 95%
rename from src/features/mirrors/components/NewPocketForm/types.d.ts
rename to src/features/mirrors/components/NewPocketForm/types.ts
index bf3b502b1..b2f16dedb 100644
--- a/src/features/mirrors/components/NewPocketForm/types.d.ts
+++ b/src/features/mirrors/components/NewPocketForm/types.ts
@@ -4,7 +4,7 @@ import type {
   CreateUploadPocketParams,
 } from "../../types";
 
-interface FormProps
+export interface FormProps
   extends
     Omit<CreateMirrorPocketParams, "mode">,
     Omit<CreatePullPocketParams, "mode" | "filter_type">,
diff --git a/src/features/mirrors/components/NewSeriesForm/types.d.ts b/src/features/mirrors/components/NewSeriesForm/types.ts
similarity index 80%
rename from src/features/mirrors/components/NewSeriesForm/types.d.ts
rename to src/features/mirrors/components/NewSeriesForm/types.ts
index bbd1d4c57..192370d2f 100644
--- a/src/features/mirrors/components/NewSeriesForm/types.d.ts
+++ b/src/features/mirrors/components/NewSeriesForm/types.ts
@@ -1,6 +1,6 @@
 import type { CreateSeriesParams } from "../../types";
 
-interface FormProps extends CreateSeriesParams {
+export interface FormProps extends CreateSeriesParams {
   type: "ubuntu" | "ubuntu-snapshot" | "third-party";
   pockets: string[];
   components: string[];
diff --git a/src/features/mirrors/components/SeriesPocketList/types.d.ts b/src/features/mirrors/components/SeriesPocketList/types.d.ts
deleted file mode 100644
index 4830f6d6b..000000000
--- a/src/features/mirrors/components/SeriesPocketList/types.d.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import type {
-  PocketCommonProps,
-  PocketLastSyncProps,
-  PocketMirrorProps,
-  PocketPullProps,
-  PocketUploadProps,
-} from "../../types";
-
-export interface CommonPocket
-  extends
-    Record<string, unknown>,
-    PocketCommonProps,
-    Partial<PocketLastSyncProps>,
-    Partial<Omit<PocketMirrorProps, "mode">>,
-    Partial<Omit<PocketPullProps, "mode">>,
-    Partial<Omit<PocketUploadProps, "mode">> {
-  mode:
-    | PocketMirrorProps["mode"]
-    | PocketPullProps["mode"]
-    | PocketUploadProps["mode"];
-}
diff --git a/src/features/mirrors/components/SeriesPocketList/types.ts b/src/features/mirrors/components/SeriesPocketList/types.ts
new file mode 100644
index 000000000..3a1ad73b8
--- /dev/null
+++ b/src/features/mirrors/components/SeriesPocketList/types.ts
@@ -0,0 +1,26 @@
+import type {
+  PocketCommonProps,
+  PocketLastSyncProps,
+  PocketMirrorProps,
+  PocketPullProps,
+  PocketUploadProps,
+} from "../../types";
+
+// Flatten the discriminated union into a single optional-property object so
+// that CommonPocket remains a plain object type (not a union), which is
+// required for react-table's Column<D> generic constraint.
+type PartialLastSyncProps = {
+  [K in keyof PocketLastSyncProps]?: PocketLastSyncProps[K];
+};
+
+export type CommonPocket = Record<string, unknown> &
+  PocketCommonProps &
+  PartialLastSyncProps &
+  Partial<Omit<PocketMirrorProps, "mode">> &
+  Partial<Omit<PocketPullProps, "mode">> &
+  Partial<Omit<PocketUploadProps, "mode">> & {
+    mode:
+      | PocketMirrorProps["mode"]
+      | PocketPullProps["mode"]
+      | PocketUploadProps["mode"];
+  };
diff --git a/src/features/mirrors/types/Distribution.d.ts b/src/features/mirrors/types/Distribution.ts
similarity index 100%
rename from src/features/mirrors/types/Distribution.d.ts
rename to src/features/mirrors/types/Distribution.ts
diff --git a/src/features/mirrors/types/DistributionParams.d.ts b/src/features/mirrors/types/DistributionParams.ts
similarity index 100%
rename from src/features/mirrors/types/DistributionParams.d.ts
rename to src/features/mirrors/types/DistributionParams.ts
diff --git a/src/features/mirrors/types/FormTypes.d.ts b/src/features/mirrors/types/FormTypes.ts
similarity index 100%
rename from src/features/mirrors/types/FormTypes.d.ts
rename to src/features/mirrors/types/FormTypes.ts
diff --git a/src/features/mirrors/types/FormattedPackage.d.ts b/src/features/mirrors/types/FormattedPackage.ts
similarity index 100%
rename from src/features/mirrors/types/FormattedPackage.d.ts
rename to src/features/mirrors/types/FormattedPackage.ts
diff --git a/src/features/mirrors/types/Pocket.d.ts b/src/features/mirrors/types/Pocket.ts
similarity index 89%
rename from src/features/mirrors/types/Pocket.d.ts
rename to src/features/mirrors/types/Pocket.ts
index 2b40e69f6..c4cc91927 100644
--- a/src/features/mirrors/types/Pocket.d.ts
+++ b/src/features/mirrors/types/Pocket.ts
@@ -68,9 +68,13 @@ export interface PocketUploadProps {
   upload_gpg_keys: UploadedGPGKey[];
 }
 
-type MirrorPocket = PocketMirrorProps & PocketLastSyncProps & PocketCommonProps;
+export type MirrorPocket = PocketMirrorProps &
+  PocketLastSyncProps &
+  PocketCommonProps;
 
-type PullPocket = PocketPullProps & PocketLastSyncProps & PocketCommonProps;
+export type PullPocket = PocketPullProps &
+  PocketLastSyncProps &
+  PocketCommonProps;
 
 export type UploadPocket = PocketUploadProps & PocketCommonProps;
 
diff --git a/src/features/mirrors/types/PocketParams.d.ts b/src/features/mirrors/types/PocketParams.ts
similarity index 100%
rename from src/features/mirrors/types/PocketParams.d.ts
rename to src/features/mirrors/types/PocketParams.ts
diff --git a/src/features/mirrors/types/Series.d.ts b/src/features/mirrors/types/Series.ts
similarity index 100%
rename from src/features/mirrors/types/Series.d.ts
rename to src/features/mirrors/types/Series.ts
diff --git a/src/features/mirrors/types/SeriesParams.d.ts b/src/features/mirrors/types/SeriesParams.ts
similarity index 100%
rename from src/features/mirrors/types/SeriesParams.d.ts
rename to src/features/mirrors/types/SeriesParams.ts
diff --git a/src/features/mirrors/types/SyncPocketRef.d.ts b/src/features/mirrors/types/SyncPocketRef.ts
similarity index 100%
rename from src/features/mirrors/types/SyncPocketRef.d.ts
rename to src/features/mirrors/types/SyncPocketRef.ts
diff --git a/src/features/mirrors/types/UseDistributionsResult.d.ts b/src/features/mirrors/types/UseDistributionsResult.ts
similarity index 100%
rename from src/features/mirrors/types/UseDistributionsResult.d.ts
rename to src/features/mirrors/types/UseDistributionsResult.ts
diff --git a/src/features/mirrors/types/UseGPGKeysOptionsResult.d.ts b/src/features/mirrors/types/UseGPGKeysOptionsResult.ts
similarity index 68%
rename from src/features/mirrors/types/UseGPGKeysOptionsResult.d.ts
rename to src/features/mirrors/types/UseGPGKeysOptionsResult.ts
index 7cdb0b6c4..4c0739368 100644
--- a/src/features/mirrors/types/UseGPGKeysOptionsResult.d.ts
+++ b/src/features/mirrors/types/UseGPGKeysOptionsResult.ts
@@ -1,3 +1,5 @@
+import type { SelectOption } from "@/types/SelectOption";
+
 export interface UseGPGKeysOptionsResult {
   privateGPGKeysOptions: SelectOption[];
   publicGPGKeysOptions: SelectOption[];
diff --git a/src/features/mirrors/types/UsePocketsResult.d.ts b/src/features/mirrors/types/UsePocketsResult.ts
similarity index 100%
rename from src/features/mirrors/types/UsePocketsResult.d.ts
rename to src/features/mirrors/types/UsePocketsResult.ts
diff --git a/src/features/mirrors/types/UseSeriesResult.d.ts b/src/features/mirrors/types/UseSeriesResult.ts
similarity index 100%
rename from src/features/mirrors/types/UseSeriesResult.d.ts
rename to src/features/mirrors/types/UseSeriesResult.ts
diff --git a/src/features/mirrors/types/index.d.ts b/src/features/mirrors/types/index.ts
similarity index 80%
rename from src/features/mirrors/types/index.d.ts
rename to src/features/mirrors/types/index.ts
index 9932b4398..56c3f4016 100644
--- a/src/features/mirrors/types/index.d.ts
+++ b/src/features/mirrors/types/index.ts
@@ -1,18 +1,18 @@
-export { SyncPocketRef } from "./SyncPocketRef";
-export { Distribution } from "./Distribution";
-export {
+export type { SyncPocketRef } from "./SyncPocketRef";
+export type { Distribution } from "./Distribution";
+export type {
   CreateDistributionParams,
   GetDistributionsParams,
   RemoveDistributionParams,
 } from "./DistributionParams";
-export { Series, Repo, RepoInfo } from "./Series";
-export {
+export type { Series, Repo, RepoInfo } from "./Series";
+export type {
   CreateSeriesParams,
   DeriveSeriesParams,
   GetRepoInfoParams,
   RemoveSeriesParams,
 } from "./SeriesParams";
-export {
+export type {
   Pocket,
   PocketLastSyncProps,
   PocketCommonProps,
@@ -20,7 +20,7 @@ export {
   PocketPullProps,
   PocketUploadProps,
 } from "./Pocket";
-export {
+export type {
   AddPackageFiltersToPocketParams,
   AddUploaderGPGKeysToPocketParams,
   CreateCommonPocketParams,
diff --git a/src/features/oidc/types.d.ts b/src/features/oidc/types.ts
similarity index 100%
rename from src/features/oidc/types.d.ts
rename to src/features/oidc/types.ts
diff --git a/src/features/overview/types.d.ts b/src/features/overview/types.ts
similarity index 100%
rename from src/features/overview/types.d.ts
rename to src/features/overview/types.ts
diff --git a/src/features/package-profiles/types/FormProps.d.ts b/src/features/package-profiles/types/FormProps.ts
similarity index 92%
rename from src/features/package-profiles/types/FormProps.d.ts
rename to src/features/package-profiles/types/FormProps.ts
index ace6781f0..1bfc8edaf 100644
--- a/src/features/package-profiles/types/FormProps.d.ts
+++ b/src/features/package-profiles/types/FormProps.ts
@@ -9,7 +9,7 @@ import type {
   PackageProfileConstraintType,
 } from "./PackageProfile";
 
-interface Constraint extends PackageProfileConstraint {
+export interface Constraint extends PackageProfileConstraint {
   constraint: PackageProfileConstraintType | "";
   notAnyVersion: boolean;
 }
diff --git a/src/features/package-profiles/types/PackageProfile.d.ts b/src/features/package-profiles/types/PackageProfile.ts
similarity index 98%
rename from src/features/package-profiles/types/PackageProfile.d.ts
rename to src/features/package-profiles/types/PackageProfile.ts
index f0bd7a795..723ad1f74 100644
--- a/src/features/package-profiles/types/PackageProfile.d.ts
+++ b/src/features/package-profiles/types/PackageProfile.ts
@@ -1,4 +1,4 @@
-export type PackageProfileConstraintType = "depends" | "conflicts";
+export type PackageProfileConstraintType = "depends" | "conflicts" | "";
 
 export interface PackageProfileConstraint extends Record<string, unknown> {
   constraint: PackageProfileConstraintType;
diff --git a/src/features/package-profiles/types/index.d.ts b/src/features/package-profiles/types/index.ts
similarity index 88%
rename from src/features/package-profiles/types/index.d.ts
rename to src/features/package-profiles/types/index.ts
index 6fa273e7c..77763cc2e 100644
--- a/src/features/package-profiles/types/index.d.ts
+++ b/src/features/package-profiles/types/index.ts
@@ -1,10 +1,10 @@
-export {
+export type {
   PackageProfile,
   PackageProfileConstraint,
   PackageProfileConstraintType,
 } from "./PackageProfile";
 
-export {
+export type {
   AddFormProps,
   Constraint,
   ConstraintsFormProps,
diff --git a/src/features/packages/components/InstalledPackagesActionForm/types.d.ts b/src/features/packages/components/InstalledPackagesActionForm/types.d.ts
deleted file mode 100644
index bb481fa6f..000000000
--- a/src/features/packages/components/InstalledPackagesActionForm/types.d.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import type { CommonPackagesActionParams } from "../api";
-
-export interface FormProps extends Pick<
-  CommonPackagesActionParams,
-  "deliver_after" | "deliver_delay_window"
-> {
-  deliver_immediately: boolean;
-  randomize_delivery: boolean;
-  version: string;
-}
diff --git a/src/features/packages/components/InstalledPackagesActionForm/types.ts b/src/features/packages/components/InstalledPackagesActionForm/types.ts
new file mode 100644
index 000000000..66f500e94
--- /dev/null
+++ b/src/features/packages/components/InstalledPackagesActionForm/types.ts
@@ -0,0 +1,7 @@
+export interface FormProps {
+  deliver_after: string;
+  deliver_delay_window: number;
+  deliver_immediately: boolean;
+  randomize_delivery: boolean;
+  version: string;
+}
diff --git a/src/features/packages/types/InstalledPackageAction.d.ts b/src/features/packages/types/InstalledPackageAction.ts
similarity index 100%
rename from src/features/packages/types/InstalledPackageAction.d.ts
rename to src/features/packages/types/InstalledPackageAction.ts
diff --git a/src/features/packages/types/Package.d.ts b/src/features/packages/types/Package.ts
similarity index 100%
rename from src/features/packages/types/Package.d.ts
rename to src/features/packages/types/Package.ts
diff --git a/src/features/packages/types/index.d.ts b/src/features/packages/types/index.ts
similarity index 79%
rename from src/features/packages/types/index.d.ts
rename to src/features/packages/types/index.ts
index 77b2eb53b..6e53da2f6 100644
--- a/src/features/packages/types/index.d.ts
+++ b/src/features/packages/types/index.ts
@@ -1,16 +1,14 @@
-export {
+export type {
   DowngradePackageVersion,
   InstancePackage,
   Package,
   PackageObject,
   PackageDiff,
   PocketPackage,
-  PocketPackageName,
-  PocketPackageVersion,
   PocketPackagesList,
 } from "./Package";
 
-export {
+export type {
   InstalledPackageAction,
   InstalledPackageActionAppearance,
 } from "./InstalledPackageAction";
diff --git a/src/features/processes/types/Process.d.ts b/src/features/processes/types/Process.ts
similarity index 100%
rename from src/features/processes/types/Process.d.ts
rename to src/features/processes/types/Process.ts
diff --git a/src/features/processes/types/ProcessesParams.d.ts b/src/features/processes/types/ProcessesParams.ts
similarity index 100%
rename from src/features/processes/types/ProcessesParams.d.ts
rename to src/features/processes/types/ProcessesParams.ts
diff --git a/src/features/processes/types/index.d.ts b/src/features/processes/types/index.d.ts
deleted file mode 100644
index b80e1e670..000000000
--- a/src/features/processes/types/index.d.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export { GetProcessesParams, ProcessesSignalParams } from "./ProcessesParams";
-export { Process } from "./Process";
diff --git a/src/features/processes/types/index.ts b/src/features/processes/types/index.ts
new file mode 100644
index 000000000..33b8928b8
--- /dev/null
+++ b/src/features/processes/types/index.ts
@@ -0,0 +1,5 @@
+export type {
+  GetProcessesParams,
+  ProcessesSignalParams,
+} from "./ProcessesParams";
+export type { Process } from "./Process";
diff --git a/src/features/reboot-profiles/components/RebootProfilesForm/types.d.ts b/src/features/reboot-profiles/components/RebootProfilesForm/types.ts
similarity index 100%
rename from src/features/reboot-profiles/components/RebootProfilesForm/types.d.ts
rename to src/features/reboot-profiles/components/RebootProfilesForm/types.ts
diff --git a/src/features/reboot-profiles/types/RebootProfile.d.ts b/src/features/reboot-profiles/types/RebootProfile.ts
similarity index 100%
rename from src/features/reboot-profiles/types/RebootProfile.d.ts
rename to src/features/reboot-profiles/types/RebootProfile.ts
diff --git a/src/features/reboot-profiles/types/index.d.ts b/src/features/reboot-profiles/types/index.ts
similarity index 100%
rename from src/features/reboot-profiles/types/index.d.ts
rename to src/features/reboot-profiles/types/index.ts
diff --git a/src/features/removal-profiles/components/SingleRemovalProfileForm/types.d.ts b/src/features/removal-profiles/components/SingleRemovalProfileForm/types.ts
similarity index 83%
rename from src/features/removal-profiles/components/SingleRemovalProfileForm/types.d.ts
rename to src/features/removal-profiles/components/SingleRemovalProfileForm/types.ts
index e8cd2b443..9a46200cd 100644
--- a/src/features/removal-profiles/components/SingleRemovalProfileForm/types.d.ts
+++ b/src/features/removal-profiles/components/SingleRemovalProfileForm/types.ts
@@ -2,7 +2,7 @@ import type { CreateRemovalProfileParams } from "../../hooks";
 
 export interface FormProps extends Omit<
   Required<CreateRemovalProfileParams>,
-  "access_group"
+  "access_group" | "days_without_exchange"
 > {
   access_group?: string;
   days_without_exchange: number | "";
diff --git a/src/features/removal-profiles/types/RemovalProfile.d.ts b/src/features/removal-profiles/types/RemovalProfile.ts
similarity index 100%
rename from src/features/removal-profiles/types/RemovalProfile.d.ts
rename to src/features/removal-profiles/types/RemovalProfile.ts
diff --git a/src/features/removal-profiles/types/index.d.ts b/src/features/removal-profiles/types/index.d.ts
deleted file mode 100644
index 80a34227a..000000000
--- a/src/features/removal-profiles/types/index.d.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { RemovalProfile } from "./RemovalProfile";
diff --git a/src/features/removal-profiles/types/index.ts b/src/features/removal-profiles/types/index.ts
new file mode 100644
index 000000000..ffc442398
--- /dev/null
+++ b/src/features/removal-profiles/types/index.ts
@@ -0,0 +1 @@
+export type { RemovalProfile } from "./RemovalProfile";
diff --git a/src/features/repository-profiles/types/RepositoryProfile.d.ts b/src/features/repository-profiles/types/RepositoryProfile.ts
similarity index 100%
rename from src/features/repository-profiles/types/RepositoryProfile.d.ts
rename to src/features/repository-profiles/types/RepositoryProfile.ts
diff --git a/src/features/repository-profiles/types/RepositoryProfileFormValues.d.ts b/src/features/repository-profiles/types/RepositoryProfileFormValues.ts
similarity index 100%
rename from src/features/repository-profiles/types/RepositoryProfileFormValues.d.ts
rename to src/features/repository-profiles/types/RepositoryProfileFormValues.ts
diff --git a/src/features/repository-profiles/types/index.d.ts b/src/features/repository-profiles/types/index.d.ts
deleted file mode 100644
index 4a7872614..000000000
--- a/src/features/repository-profiles/types/index.d.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export { RepositoryProfileFormValues } from "./RepositoryProfileFormValues";
-export { RepositoryProfile } from "./RepositoryProfile";
diff --git a/src/features/repository-profiles/types/index.ts b/src/features/repository-profiles/types/index.ts
new file mode 100644
index 000000000..073a667c3
--- /dev/null
+++ b/src/features/repository-profiles/types/index.ts
@@ -0,0 +1,2 @@
+export type { RepositoryProfileFormValues } from "./RepositoryProfileFormValues";
+export type { RepositoryProfile } from "./RepositoryProfile";
diff --git a/src/features/saved-searches/types/SavedSearch.d.ts b/src/features/saved-searches/types/SavedSearch.ts
similarity index 100%
rename from src/features/saved-searches/types/SavedSearch.d.ts
rename to src/features/saved-searches/types/SavedSearch.ts
diff --git a/src/features/saved-searches/types/index.d.ts b/src/features/saved-searches/types/index.d.ts
deleted file mode 100644
index 7588524d9..000000000
--- a/src/features/saved-searches/types/index.d.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { SavedSearch } from "./SavedSearch";
diff --git a/src/features/saved-searches/types/index.ts b/src/features/saved-searches/types/index.ts
new file mode 100644
index 000000000..a51da3714
--- /dev/null
+++ b/src/features/saved-searches/types/index.ts
@@ -0,0 +1 @@
+export type { SavedSearch } from "./SavedSearch";
diff --git a/src/features/script-profiles/components/ScriptProfileForm/types.d.ts b/src/features/script-profiles/components/ScriptProfileForm/types.ts
similarity index 100%
rename from src/features/script-profiles/components/ScriptProfileForm/types.d.ts
rename to src/features/script-profiles/components/ScriptProfileForm/types.ts
diff --git a/src/features/script-profiles/types/ScriptProfile.d.ts b/src/features/script-profiles/types/ScriptProfile.ts
similarity index 100%
rename from src/features/script-profiles/types/ScriptProfile.d.ts
rename to src/features/script-profiles/types/ScriptProfile.ts
diff --git a/src/features/script-profiles/types/index.d.ts b/src/features/script-profiles/types/index.ts
similarity index 100%
rename from src/features/script-profiles/types/index.d.ts
rename to src/features/script-profiles/types/index.ts
diff --git a/src/features/scripts/components/RunInstanceScriptForm/types.d.ts b/src/features/scripts/components/RunInstanceScriptForm/types.ts
similarity index 66%
rename from src/features/scripts/components/RunInstanceScriptForm/types.d.ts
rename to src/features/scripts/components/RunInstanceScriptForm/types.ts
index 51d01f3c1..5867fa589 100644
--- a/src/features/scripts/components/RunInstanceScriptForm/types.d.ts
+++ b/src/features/scripts/components/RunInstanceScriptForm/types.ts
@@ -1,8 +1,7 @@
 import type { RunScriptParams } from "../../api";
 import type { Script } from "../../types";
 
-export interface FormProps
-  extends CreateScriptParams, Omit<RunScriptParams, "query"> {
+export interface FormProps extends Omit<RunScriptParams, "query"> {
   deliver_immediately: boolean;
   deliver_after: string;
   script: Script | null;
diff --git a/src/features/scripts/components/RunScriptForm/types.d.ts b/src/features/scripts/components/RunScriptForm/types.ts
similarity index 100%
rename from src/features/scripts/components/RunScriptForm/types.d.ts
rename to src/features/scripts/components/RunScriptForm/types.ts
diff --git a/src/features/scripts/types/RunInstanceScriptFormValues.d.ts b/src/features/scripts/types/RunInstanceScriptFormValues.ts
similarity index 100%
rename from src/features/scripts/types/RunInstanceScriptFormValues.d.ts
rename to src/features/scripts/types/RunInstanceScriptFormValues.ts
diff --git a/src/features/scripts/types/Script.d.ts b/src/features/scripts/types/Script.ts
similarity index 97%
rename from src/features/scripts/types/Script.d.ts
rename to src/features/scripts/types/Script.ts
index 4fdbed2c5..58da620d3 100644
--- a/src/features/scripts/types/Script.d.ts
+++ b/src/features/scripts/types/Script.ts
@@ -7,7 +7,7 @@ interface ChangedBy {
   name: string;
 }
 
-interface Attachment {
+export interface Attachment {
   id: number;
   filename: string;
 }
diff --git a/src/features/scripts/types/ScriptFormValues.d.ts b/src/features/scripts/types/ScriptFormValues.ts
similarity index 100%
rename from src/features/scripts/types/ScriptFormValues.d.ts
rename to src/features/scripts/types/ScriptFormValues.ts
diff --git a/src/features/scripts/types/ScriptStatus.d.ts b/src/features/scripts/types/ScriptStatus.ts
similarity index 100%
rename from src/features/scripts/types/ScriptStatus.d.ts
rename to src/features/scripts/types/ScriptStatus.ts
diff --git a/src/features/scripts/types/ScriptTab.d.ts b/src/features/scripts/types/ScriptTab.ts
similarity index 100%
rename from src/features/scripts/types/ScriptTab.d.ts
rename to src/features/scripts/types/ScriptTab.ts
diff --git a/src/features/scripts/types/index.d.ts b/src/features/scripts/types/index.d.ts
deleted file mode 100644
index 83f1d1970..000000000
--- a/src/features/scripts/types/index.d.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-export { RunInstanceScriptFormValues } from "./RunInstanceScriptFormValues";
-export {
-  Script,
-  SingleScript,
-  ScriptVersion,
-  TruncatedScriptVersion,
-  TruncatedScriptProfile,
-  Attachment,
-} from "./Script";
-export { ScriptStatus } from "./ScriptStatus";
-export { ScriptFormValues } from "./ScriptFormValues";
-export { ScriptTabId } from "./ScriptTab";
diff --git a/src/features/scripts/types/index.ts b/src/features/scripts/types/index.ts
new file mode 100644
index 000000000..bd59049bb
--- /dev/null
+++ b/src/features/scripts/types/index.ts
@@ -0,0 +1,12 @@
+export type { RunInstanceScriptFormValues } from "./RunInstanceScriptFormValues";
+export type {
+  Script,
+  SingleScript,
+  ScriptVersion,
+  TruncatedScriptVersion,
+  TruncatedScriptProfile,
+  Attachment,
+} from "./Script";
+export type { ScriptStatus } from "./ScriptStatus";
+export type { ScriptFormValues } from "./ScriptFormValues";
+export type { ScriptTabId } from "./ScriptTab";
diff --git a/src/features/security-profiles/types/SecurityProfile.d.ts b/src/features/security-profiles/types/SecurityProfile.ts
similarity index 100%
rename from src/features/security-profiles/types/SecurityProfile.d.ts
rename to src/features/security-profiles/types/SecurityProfile.ts
diff --git a/src/features/security-profiles/types/SecurityProfileActions.d.ts b/src/features/security-profiles/types/SecurityProfileActions.ts
similarity index 100%
rename from src/features/security-profiles/types/SecurityProfileActions.d.ts
rename to src/features/security-profiles/types/SecurityProfileActions.ts
diff --git a/src/features/security-profiles/types/SecurityProfileAddFormValues.d.ts b/src/features/security-profiles/types/SecurityProfileAddFormValues.ts
similarity index 100%
rename from src/features/security-profiles/types/SecurityProfileAddFormValues.d.ts
rename to src/features/security-profiles/types/SecurityProfileAddFormValues.ts
diff --git a/src/features/security-profiles/types/index.d.ts b/src/features/security-profiles/types/index.ts
similarity index 100%
rename from src/features/security-profiles/types/index.d.ts
rename to src/features/security-profiles/types/index.ts
diff --git a/src/features/snaps/components/EditSnap/types.d.ts b/src/features/snaps/components/EditSnap/types.ts
similarity index 90%
rename from src/features/snaps/components/EditSnap/types.d.ts
rename to src/features/snaps/components/EditSnap/types.ts
index fbd0e0b48..233751b01 100644
--- a/src/features/snaps/components/EditSnap/types.d.ts
+++ b/src/features/snaps/components/EditSnap/types.ts
@@ -1,3 +1,5 @@
+import type * as Yup from "yup";
+
 export interface SnapFormProps {
   deliver_immediately: boolean;
   randomize_delivery: boolean;
diff --git a/src/features/snaps/types/Snap.d.ts b/src/features/snaps/types/Snap.ts
similarity index 100%
rename from src/features/snaps/types/Snap.d.ts
rename to src/features/snaps/types/Snap.ts
diff --git a/src/features/snaps/types/SnapsParams.d.ts b/src/features/snaps/types/SnapsParams.ts
similarity index 100%
rename from src/features/snaps/types/SnapsParams.d.ts
rename to src/features/snaps/types/SnapsParams.ts
diff --git a/src/features/snaps/types/index.d.ts b/src/features/snaps/types/index.ts
similarity index 88%
rename from src/features/snaps/types/index.d.ts
rename to src/features/snaps/types/index.ts
index 71d3828aa..cb358b8cd 100644
--- a/src/features/snaps/types/index.d.ts
+++ b/src/features/snaps/types/index.ts
@@ -1,11 +1,11 @@
-export {
+export type {
   GetAvailableSnapInfoParams,
   GetAvailableSnapsParams,
   GetSnapsParams,
   SnapActionParams,
 } from "./SnapsParams";
 
-export {
+export type {
   AvailableSnap,
   AvailableSnapInfo,
   InstalledSnap,
diff --git a/src/features/tags/types/ProfileChange.d.ts b/src/features/tags/types/ProfileChange.ts
similarity index 100%
rename from src/features/tags/types/ProfileChange.d.ts
rename to src/features/tags/types/ProfileChange.ts
diff --git a/src/features/tags/types/index.d.ts b/src/features/tags/types/index.ts
similarity index 100%
rename from src/features/tags/types/index.d.ts
rename to src/features/tags/types/index.ts
diff --git a/src/features/upgrade-profiles/types/FormProps.d.ts b/src/features/upgrade-profiles/types/FormProps.ts
similarity index 81%
rename from src/features/upgrade-profiles/types/FormProps.d.ts
rename to src/features/upgrade-profiles/types/FormProps.ts
index bca3c8d5e..fc6448e9c 100644
--- a/src/features/upgrade-profiles/types/FormProps.d.ts
+++ b/src/features/upgrade-profiles/types/FormProps.ts
@@ -2,7 +2,7 @@ import type { CreateUpgradeProfileParams } from "../hooks/useUpgradeProfiles";
 
 export interface FormProps extends Omit<
   Required<CreateUpgradeProfileParams>,
-  "access_group"
+  "access_group" | "at_hour" | "at_minute" | "deliver_delay_window"
 > {
   access_group?: string;
   at_hour: number | "";
diff --git a/src/features/upgrade-profiles/types/UpgradeProfile.d.ts b/src/features/upgrade-profiles/types/UpgradeProfile.ts
similarity index 100%
rename from src/features/upgrade-profiles/types/UpgradeProfile.d.ts
rename to src/features/upgrade-profiles/types/UpgradeProfile.ts
diff --git a/src/features/upgrade-profiles/types/index.d.ts b/src/features/upgrade-profiles/types/index.ts
similarity index 65%
rename from src/features/upgrade-profiles/types/index.d.ts
rename to src/features/upgrade-profiles/types/index.ts
index 31007e432..114f186b2 100644
--- a/src/features/upgrade-profiles/types/index.d.ts
+++ b/src/features/upgrade-profiles/types/index.ts
@@ -1,7 +1,7 @@
-export {
+export type {
   UpgradeProfile,
   UpgradeProfileFrequency,
   UpgradeProfileDay,
   UpgradeProfileType,
 } from "./UpgradeProfile";
-export { FormProps } from "./FormProps";
+export type { FormProps } from "./FormProps";
diff --git a/src/features/upgrades/components/Upgrades/types.d.ts b/src/features/upgrades/components/Upgrades/types.ts
similarity index 100%
rename from src/features/upgrades/components/Upgrades/types.d.ts
rename to src/features/upgrades/components/Upgrades/types.ts
diff --git a/src/features/upgrades/types/index.d.ts b/src/features/upgrades/types/index.ts
similarity index 100%
rename from src/features/upgrades/types/index.d.ts
rename to src/features/upgrades/types/index.ts
diff --git a/src/features/wsl-profiles/components/WslProfileAddSidePanel/types.d.ts b/src/features/wsl-profiles/components/WslProfileAddSidePanel/types.ts
similarity index 100%
rename from src/features/wsl-profiles/components/WslProfileAddSidePanel/types.d.ts
rename to src/features/wsl-profiles/components/WslProfileAddSidePanel/types.ts
diff --git a/src/features/wsl-profiles/types/WslProfile.d.ts b/src/features/wsl-profiles/types/WslProfile.ts
similarity index 100%
rename from src/features/wsl-profiles/types/WslProfile.d.ts
rename to src/features/wsl-profiles/types/WslProfile.ts
diff --git a/src/features/wsl-profiles/types/index.d.ts b/src/features/wsl-profiles/types/index.d.ts
deleted file mode 100644
index 3a7591e70..000000000
--- a/src/features/wsl-profiles/types/index.d.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { WslProfile } from "./WslProfile";
diff --git a/src/features/wsl-profiles/types/index.ts b/src/features/wsl-profiles/types/index.ts
new file mode 100644
index 000000000..11bf6af30
--- /dev/null
+++ b/src/features/wsl-profiles/types/index.ts
@@ -0,0 +1 @@
+export type { WslProfile } from "./WslProfile";
diff --git a/src/features/wsl/types/WslInstanceType.d.ts b/src/features/wsl/types/WslInstanceType.ts
similarity index 100%
rename from src/features/wsl/types/WslInstanceType.d.ts
rename to src/features/wsl/types/WslInstanceType.ts
diff --git a/src/features/wsl/types/index.d.ts b/src/features/wsl/types/index.ts
similarity index 100%
rename from src/features/wsl/types/index.d.ts
rename to src/features/wsl/types/index.ts
diff --git a/src/libs/pageParamsManager/types.d.ts b/src/libs/pageParamsManager/types.ts
similarity index 100%
rename from src/libs/pageParamsManager/types.d.ts
rename to src/libs/pageParamsManager/types.ts
diff --git a/src/pages/dashboard/instances/[single]/tabs/info/AssignEmployeeToInstanceForm/types.d.ts b/src/pages/dashboard/instances/[single]/tabs/info/AssignEmployeeToInstanceForm/types.ts
similarity index 100%
rename from src/pages/dashboard/instances/[single]/tabs/info/AssignEmployeeToInstanceForm/types.d.ts
rename to src/pages/dashboard/instances/[single]/tabs/info/AssignEmployeeToInstanceForm/types.ts
diff --git a/src/pages/dashboard/instances/[single]/tabs/info/EditInstance/types.d.ts b/src/pages/dashboard/instances/[single]/tabs/info/EditInstance/types.ts
similarity index 100%
rename from src/pages/dashboard/instances/[single]/tabs/info/EditInstance/types.d.ts
rename to src/pages/dashboard/instances/[single]/tabs/info/EditInstance/types.ts
diff --git a/src/pages/dashboard/instances/[single]/tabs/info/InfoPanel/types.d.ts b/src/pages/dashboard/instances/[single]/tabs/info/InfoPanel/types.ts
similarity index 100%
rename from src/pages/dashboard/instances/[single]/tabs/info/InfoPanel/types.d.ts
rename to src/pages/dashboard/instances/[single]/tabs/info/InfoPanel/types.ts
diff --git a/src/pages/dashboard/settings/roles/AddRoleForm/types.d.ts b/src/pages/dashboard/settings/roles/AddRoleForm/types.ts
similarity index 100%
rename from src/pages/dashboard/settings/roles/AddRoleForm/types.d.ts
rename to src/pages/dashboard/settings/roles/AddRoleForm/types.ts
diff --git a/src/pages/dashboard/settings/roles/EditRoleForm/types.d.ts b/src/pages/dashboard/settings/roles/EditRoleForm/types.ts
similarity index 100%
rename from src/pages/dashboard/settings/roles/EditRoleForm/types.d.ts
rename to src/pages/dashboard/settings/roles/EditRoleForm/types.ts
diff --git a/src/pages/dashboard/settings/roles/RoleList/types.d.ts b/src/pages/dashboard/settings/roles/RoleList/types.ts
similarity index 100%
rename from src/pages/dashboard/settings/roles/RoleList/types.d.ts
rename to src/pages/dashboard/settings/roles/RoleList/types.ts
diff --git a/src/pages/dashboard/settings/roles/types.d.ts b/src/pages/dashboard/settings/roles/types.ts
similarity index 100%
rename from src/pages/dashboard/settings/roles/types.d.ts
rename to src/pages/dashboard/settings/roles/types.ts
diff --git a/src/templates/dashboard/Navigation/types.d.ts b/src/templates/dashboard/Navigation/types.ts
similarity index 100%
rename from src/templates/dashboard/Navigation/types.d.ts
rename to src/templates/dashboard/Navigation/types.ts
diff --git a/src/tests/server/handlers/activity.ts b/src/tests/server/handlers/activity.ts
index 8d8a322e5..3d1515294 100644
--- a/src/tests/server/handlers/activity.ts
+++ b/src/tests/server/handlers/activity.ts
@@ -114,7 +114,7 @@ export default [
           completion_time: null,
           computer_id: 0,
           creation_time: "",
-          creator: undefined,
+          creator: { email: "", id: 0, name: "" },
           deliver_after_time: null,
           deliver_before_time: null,
           delivery_time: null,
diff --git a/src/tests/server/handlers/securityProfiles.ts b/src/tests/server/handlers/securityProfiles.ts
index e074ca1ab..6206d6e22 100644
--- a/src/tests/server/handlers/securityProfiles.ts
+++ b/src/tests/server/handlers/securityProfiles.ts
@@ -134,7 +134,7 @@ export default [
       completion_time: null,
       computer_id: 0,
       creation_time: "",
-      creator: undefined,
+      creator: { email: "", id: 0, name: "" },
       deliver_after_time: null,
       deliver_before_time: null,
       delivery_time: null,
diff --git a/src/types/Action.d.ts b/src/types/Action.ts
similarity index 100%
rename from src/types/Action.d.ts
rename to src/types/Action.ts
diff --git a/src/types/Administrator.d.ts b/src/types/Administrator.ts
similarity index 100%
rename from src/types/Administrator.d.ts
rename to src/types/Administrator.ts
diff --git a/src/types/Breadcrumb.d.ts b/src/types/Breadcrumb.ts
similarity index 100%
rename from src/types/Breadcrumb.d.ts
rename to src/types/Breadcrumb.ts
diff --git a/src/types/Creator.d.ts b/src/types/Creator.ts
similarity index 100%
rename from src/types/Creator.d.ts
rename to src/types/Creator.ts
diff --git a/src/types/ExpandedCell.d.ts b/src/types/ExpandedCell.ts
similarity index 100%
rename from src/types/ExpandedCell.d.ts
rename to src/types/ExpandedCell.ts
diff --git a/src/types/Feature.d.ts b/src/types/Feature.ts
similarity index 100%
rename from src/types/Feature.d.ts
rename to src/types/Feature.ts
diff --git a/src/types/FeatureKey.d.ts b/src/types/FeatureKey.ts
similarity index 100%
rename from src/types/FeatureKey.d.ts
rename to src/types/FeatureKey.ts
diff --git a/src/types/Filters.d.ts b/src/types/Filters.ts
similarity index 100%
rename from src/types/Filters.d.ts
rename to src/types/Filters.ts
diff --git a/src/types/Permission.d.ts b/src/types/Permission.ts
similarity index 100%
rename from src/types/Permission.d.ts
rename to src/types/Permission.ts
diff --git a/src/types/Preferences.d.ts b/src/types/Preferences.ts
similarity index 100%
rename from src/types/Preferences.d.ts
rename to src/types/Preferences.ts
diff --git a/src/types/Profile.d.ts b/src/types/Profile.ts
similarity index 100%
rename from src/types/Profile.d.ts
rename to src/types/Profile.ts
diff --git a/src/types/RequestSchema.d.ts b/src/types/RequestSchema.ts
similarity index 100%
rename from src/types/RequestSchema.d.ts
rename to src/types/RequestSchema.ts
diff --git a/src/types/Role.d.ts b/src/types/Role.ts
similarity index 100%
rename from src/types/Role.d.ts
rename to src/types/Role.ts
diff --git a/src/types/SelectOption.d.ts b/src/types/SelectOption.ts
similarity index 71%
rename from src/types/SelectOption.d.ts
rename to src/types/SelectOption.ts
index aaebb7a1f..c97ed8a25 100644
--- a/src/types/SelectOption.d.ts
+++ b/src/types/SelectOption.ts
@@ -1,4 +1,4 @@
 export interface SelectOption {
-  label: ReactNode;
+  label: string;
   value: string;
 }
diff --git a/src/types/UrlParams.d.ts b/src/types/UrlParams.ts
similarity index 100%
rename from src/types/UrlParams.d.ts
rename to src/types/UrlParams.ts
diff --git a/src/types/User.d.ts b/src/types/User.ts
similarity index 100%
rename from src/types/User.d.ts
rename to src/types/User.ts
diff --git a/src/types/Usn.d.ts b/src/types/Usn.ts
similarity index 100%
rename from src/types/Usn.d.ts
rename to src/types/Usn.ts
diff --git a/src/types/api/ApiError.d.ts b/src/types/api/ApiError.ts
similarity index 100%
rename from src/types/api/ApiError.d.ts
rename to src/types/api/ApiError.ts
diff --git a/src/types/api/QueryFnType.d.ts b/src/types/api/QueryFnType.ts
similarity index 92%
rename from src/types/api/QueryFnType.d.ts
rename to src/types/api/QueryFnType.ts
index ca5fa7221..53f667afc 100644
--- a/src/types/api/QueryFnType.d.ts
+++ b/src/types/api/QueryFnType.ts
@@ -1,6 +1,6 @@
 import type { UseQueryOptions, UseQueryResult } from "@tanstack/react-query";
 import type { AxiosError } from "axios";
-import type { ApiError } from "./api/ApiError";
+import type { ApiError } from "./ApiError";
 
 export type QueryFnType<Result, Params> = (
   queryParams?: Params,

From 14d6da4725d68de691e768bb942e2c3f3237601e Mon Sep 17 00:00:00 2001
From: Ethan Shaw <ethan.shaw@canonical.com>
Date: Wed, 8 Apr 2026 18:12:47 +0000
Subject: [PATCH 07/42] Update dependencies

---
 package.json   |   24 +-
 pnpm-lock.yaml | 1428 ++++++++++++++++++++++++------------------------
 2 files changed, 728 insertions(+), 724 deletions(-)

diff --git a/package.json b/package.json
index 91c36ded0..3b78c0954 100644
--- a/package.json
+++ b/package.json
@@ -24,11 +24,11 @@
     "tcm:watch": "pnpm tcm:run --watch"
   },
   "dependencies": {
-    "@canonical/react-components": "4.0.1",
+    "@canonical/react-components": "4.2.0",
     "@monaco-editor/react": "4.7.0",
-    "@sentry/react": "10.46.0",
-    "@tanstack/react-query": "5.95.2",
-    "axios": "1.13.6",
+    "@sentry/react": "10.47.0",
+    "@tanstack/react-query": "5.96.2",
+    "axios": "1.15.0",
     "buffer": "6.0.3",
     "chart.js": "4.5.1",
     "classnames": "2.5.1",
@@ -36,11 +36,11 @@
     "formik": "2.4.9",
     "moment": "2.30.1",
     "monaco-editor": "0.55.1",
-    "path-to-regexp": "8.4.0",
+    "path-to-regexp": "8.4.2",
     "react": "19.2.4",
     "react-chartjs-2": "5.3.1",
     "react-dom": "19.2.4",
-    "react-router": "7.13.2",
+    "react-router": "7.14.0",
     "usehooks-ts": "3.1.1",
     "vanilla-framework": "4.46.0",
     "yup": "1.7.1"
@@ -48,7 +48,7 @@
   "devDependencies": {
     "@changesets/cli": "2.30.0",
     "@eslint/js": "9.39.4",
-    "@playwright/test": "1.58.2",
+    "@playwright/test": "1.59.1",
     "@testing-library/jest-dom": "6.9.1",
     "@testing-library/react": "16.3.2",
     "@testing-library/user-event": "14.6.1",
@@ -63,18 +63,18 @@
     "eslint-plugin-react": "7.37.5",
     "eslint-plugin-react-hooks": "7.0.1",
     "globals": "17.4.0",
-    "jsdom": "29.0.1",
+    "jsdom": "29.0.2",
     "msw": "2.4.11",
     "prettier": "3.8.1",
-    "sass": "1.98.0",
-    "sass-embedded": "1.98.0",
+    "sass": "1.99.0",
+    "sass-embedded": "1.99.0",
     "stylelint": "17.6.0",
     "stylelint-config-standard-scss": "17.0.0",
     "stylelint-order": "8.1.1",
     "typed-css-modules": "0.9.1",
     "typescript": "5.9.3",
-    "typescript-eslint": "8.57.2",
-    "vite": "8.0.3",
+    "typescript-eslint": "8.58.1",
+    "vite": "8.0.7",
     "vitest": "4.0.18"
   }
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 086fb98bd..cfce44cdf 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -9,20 +9,20 @@ importers:
   .:
     dependencies:
       '@canonical/react-components':
-        specifier: 4.0.1
-        version: 4.0.1(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(formik@2.4.9(@types/react@19.2.14)(react@19.2.4))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(vanilla-framework@4.46.0(sass@1.98.0))
+        specifier: 4.2.0
+        version: 4.2.0(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(formik@2.4.9(@types/react@19.2.14)(react@19.2.4))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(vanilla-framework@4.46.0(sass@1.99.0))
       '@monaco-editor/react':
         specifier: 4.7.0
         version: 4.7.0(monaco-editor@0.55.1)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
       '@sentry/react':
-        specifier: 10.46.0
-        version: 10.46.0(react@19.2.4)
+        specifier: 10.47.0
+        version: 10.47.0(react@19.2.4)
       '@tanstack/react-query':
-        specifier: 5.95.2
-        version: 5.95.2(react@19.2.4)
+        specifier: 5.96.2
+        version: 5.96.2(react@19.2.4)
       axios:
-        specifier: 1.13.6
-        version: 1.13.6
+        specifier: 1.15.0
+        version: 1.15.0
       buffer:
         specifier: 6.0.3
         version: 6.0.3
@@ -45,8 +45,8 @@ importers:
         specifier: 0.55.1
         version: 0.55.1
       path-to-regexp:
-        specifier: 8.4.0
-        version: 8.4.0
+        specifier: 8.4.2
+        version: 8.4.2
       react:
         specifier: 19.2.4
         version: 19.2.4
@@ -57,14 +57,14 @@ importers:
         specifier: 19.2.4
         version: 19.2.4(react@19.2.4)
       react-router:
-        specifier: 7.13.2
-        version: 7.13.2(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
+        specifier: 7.14.0
+        version: 7.14.0(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
       usehooks-ts:
         specifier: 3.1.1
         version: 3.1.1(react@19.2.4)
       vanilla-framework:
         specifier: 4.46.0
-        version: 4.46.0(sass@1.98.0)
+        version: 4.46.0(sass@1.99.0)
       yup:
         specifier: 1.7.1
         version: 1.7.1
@@ -76,8 +76,8 @@ importers:
         specifier: 9.39.4
         version: 9.39.4
       '@playwright/test':
-        specifier: 1.58.2
-        version: 1.58.2
+        specifier: 1.59.1
+        version: 1.59.1
       '@testing-library/jest-dom':
         specifier: 6.9.1
         version: 6.9.1
@@ -101,10 +101,10 @@ importers:
         version: 7.7.20
       '@vitejs/plugin-react':
         specifier: 6.0.1
-        version: 6.0.1(vite@8.0.3(@types/node@24.12.0)(esbuild@0.27.4)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1))
+        version: 6.0.1(vite@8.0.7(@types/node@24.12.0)(esbuild@0.27.7)(sass-embedded@1.99.0)(sass@1.99.0)(yaml@2.8.1))
       '@vitest/coverage-v8':
         specifier: 4.0.18
-        version: 4.0.18(vitest@4.0.18(@types/node@24.12.0)(jsdom@29.0.1)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1))
+        version: 4.0.18(vitest@4.0.18(@types/node@24.12.0)(jsdom@29.0.2)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.99.0)(sass@1.99.0)(yaml@2.8.1))
       eslint:
         specifier: 9.39.4
         version: 9.39.4
@@ -121,8 +121,8 @@ importers:
         specifier: 17.4.0
         version: 17.4.0
       jsdom:
-        specifier: 29.0.1
-        version: 29.0.1
+        specifier: 29.0.2
+        version: 29.0.2
       msw:
         specifier: 2.4.11
         version: 2.4.11(typescript@5.9.3)
@@ -130,17 +130,17 @@ importers:
         specifier: 3.8.1
         version: 3.8.1
       sass:
-        specifier: 1.98.0
-        version: 1.98.0
+        specifier: 1.99.0
+        version: 1.99.0
       sass-embedded:
-        specifier: 1.98.0
-        version: 1.98.0
+        specifier: 1.99.0
+        version: 1.99.0
       stylelint:
         specifier: 17.6.0
         version: 17.6.0(typescript@5.9.3)
       stylelint-config-standard-scss:
         specifier: 17.0.0
-        version: 17.0.0(postcss@8.5.8)(stylelint@17.6.0(typescript@5.9.3))
+        version: 17.0.0(postcss@8.5.9)(stylelint@17.6.0(typescript@5.9.3))
       stylelint-order:
         specifier: 8.1.1
         version: 8.1.1(stylelint@17.6.0(typescript@5.9.3))
@@ -151,14 +151,14 @@ importers:
         specifier: 5.9.3
         version: 5.9.3
       typescript-eslint:
-        specifier: 8.57.2
-        version: 8.57.2(eslint@9.39.4)(typescript@5.9.3)
+        specifier: 8.58.1
+        version: 8.58.1(eslint@9.39.4)(typescript@5.9.3)
       vite:
-        specifier: 8.0.3
-        version: 8.0.3(@types/node@24.12.0)(esbuild@0.27.4)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1)
+        specifier: 8.0.7
+        version: 8.0.7(@types/node@24.12.0)(esbuild@0.27.7)(sass-embedded@1.99.0)(sass@1.99.0)(yaml@2.8.1)
       vitest:
         specifier: 4.0.18
-        version: 4.0.18(@types/node@24.12.0)(jsdom@29.0.1)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1)
+        version: 4.0.18(@types/node@24.12.0)(jsdom@29.0.2)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.99.0)(sass@1.99.0)(yaml@2.8.1)
 
 packages:
 
@@ -168,12 +168,12 @@ packages:
   '@asamuzakjp/css-color@3.2.0':
     resolution: {integrity: sha512-K1A6z8tS3XsmCMM86xoWdn7Fkdn9m6RSVtocUrJYIwZnFVkng/PvkEoWtOWmP+Scc6saYWHWZYbndEEXxl24jw==}
 
-  '@asamuzakjp/css-color@5.0.1':
-    resolution: {integrity: sha512-2SZFvqMyvboVV1d15lMf7XiI3m7SDqXUuKaTymJYLN6dSGadqp+fVojqJlVoMlbZnlTmu3S0TLwLTJpvBMO1Aw==}
+  '@asamuzakjp/css-color@5.1.8':
+    resolution: {integrity: sha512-OISPR9c2uPo23rUdvfEQiLPjoMLOpEeLNnP5iGkxr6tDDxJd3NjD+6fxY0mdaMbIPUjFGL4HFOJqLvow5q4aqQ==}
     engines: {node: ^20.19.0 || ^22.12.0 || >=24.0.0}
 
-  '@asamuzakjp/dom-selector@7.0.4':
-    resolution: {integrity: sha512-jXR6x4AcT3eIrS2fSNAwJpwirOkGcd+E7F7CP3zjdTqz9B/2huHOL8YJZBgekKwLML+u7qB/6P1LXQuMScsx0w==}
+  '@asamuzakjp/dom-selector@7.0.8':
+    resolution: {integrity: sha512-erMO6FgtM02dC24NGm0xufMzWz5OF0wXKR7BpvGD973bq/GbmR8/DbxNZbj0YevQ5hlToJaWSVK/G9/NDgGEVw==}
     engines: {node: ^20.19.0 || ^22.12.0 || >=24.0.0}
 
   '@asamuzakjp/nwsapi@2.3.9':
@@ -276,8 +276,8 @@ packages:
   '@cacheable/utils@2.4.1':
     resolution: {integrity: sha512-eiFgzCbIneyMlLOmNG4g9xzF7Hv3Mga4LjxjcSC/ues6VYq2+gUbQI8JqNuw/ZM8tJIeIaBGpswAsqV2V7ApgA==}
 
-  '@canonical/react-components@4.0.1':
-    resolution: {integrity: sha512-lfD/SoSZQVgttKi4isgkSraowyQNxAodnSWk/Ksmv8A1gO9Oz3dRcPdKnMDfGx3ih8Lb1n+gBZFcDgq+dbmY2g==}
+  '@canonical/react-components@4.2.0':
+    resolution: {integrity: sha512-e4rYL0fvJTHynQtd7bfDtzYf25NxYGQq+BXtSMbpTU6cYxsw47EgITxYouB8yNa18iuAxYxINP3tRZugQK6qOw==}
     peerDependencies:
       '@types/react': ^18.0.0 || ^19.0.0
       '@types/react-dom': ^18.0.0 || ^19.0.0
@@ -433,158 +433,158 @@ packages:
   '@emnapi/wasi-threads@1.2.0':
     resolution: {integrity: sha512-N10dEJNSsUx41Z6pZsXU8FjPjpBEplgH24sfkmITrBED1/U2Esum9F3lfLrMjKHHjmi557zQn7kR9R+XWXu5Rg==}
 
-  '@esbuild/aix-ppc64@0.27.4':
-    resolution: {integrity: sha512-cQPwL2mp2nSmHHJlCyoXgHGhbEPMrEEU5xhkcy3Hs/O7nGZqEpZ2sUtLaL9MORLtDfRvVl2/3PAuEkYZH0Ty8Q==}
+  '@esbuild/aix-ppc64@0.27.7':
+    resolution: {integrity: sha512-EKX3Qwmhz1eMdEJokhALr0YiD0lhQNwDqkPYyPhiSwKrh7/4KRjQc04sZ8db+5DVVnZ1LmbNDI1uAMPEUBnQPg==}
     engines: {node: '>=18'}
     cpu: [ppc64]
     os: [aix]
 
-  '@esbuild/android-arm64@0.27.4':
-    resolution: {integrity: sha512-gdLscB7v75wRfu7QSm/zg6Rx29VLdy9eTr2t44sfTW7CxwAtQghZ4ZnqHk3/ogz7xao0QAgrkradbBzcqFPasw==}
+  '@esbuild/android-arm64@0.27.7':
+    resolution: {integrity: sha512-62dPZHpIXzvChfvfLJow3q5dDtiNMkwiRzPylSCfriLvZeq0a1bWChrGx/BbUbPwOrsWKMn8idSllklzBy+dgQ==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [android]
 
-  '@esbuild/android-arm@0.27.4':
-    resolution: {integrity: sha512-X9bUgvxiC8CHAGKYufLIHGXPJWnr0OCdR0anD2e21vdvgCI8lIfqFbnoeOz7lBjdrAGUhqLZLcQo6MLhTO2DKQ==}
+  '@esbuild/android-arm@0.27.7':
+    resolution: {integrity: sha512-jbPXvB4Yj2yBV7HUfE2KHe4GJX51QplCN1pGbYjvsyCZbQmies29EoJbkEc+vYuU5o45AfQn37vZlyXy4YJ8RQ==}
     engines: {node: '>=18'}
     cpu: [arm]
     os: [android]
 
-  '@esbuild/android-x64@0.27.4':
-    resolution: {integrity: sha512-PzPFnBNVF292sfpfhiyiXCGSn9HZg5BcAz+ivBuSsl6Rk4ga1oEXAamhOXRFyMcjwr2DVtm40G65N3GLeH1Lvw==}
+  '@esbuild/android-x64@0.27.7':
+    resolution: {integrity: sha512-x5VpMODneVDb70PYV2VQOmIUUiBtY3D3mPBG8NxVk5CogneYhkR7MmM3yR/uMdITLrC1ml/NV1rj4bMJuy9MCg==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [android]
 
-  '@esbuild/darwin-arm64@0.27.4':
-    resolution: {integrity: sha512-b7xaGIwdJlht8ZFCvMkpDN6uiSmnxxK56N2GDTMYPr2/gzvfdQN8rTfBsvVKmIVY/X7EM+/hJKEIbbHs9oA4tQ==}
+  '@esbuild/darwin-arm64@0.27.7':
+    resolution: {integrity: sha512-5lckdqeuBPlKUwvoCXIgI2D9/ABmPq3Rdp7IfL70393YgaASt7tbju3Ac+ePVi3KDH6N2RqePfHnXkaDtY9fkw==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [darwin]
 
-  '@esbuild/darwin-x64@0.27.4':
-    resolution: {integrity: sha512-sR+OiKLwd15nmCdqpXMnuJ9W2kpy0KigzqScqHI3Hqwr7IXxBp3Yva+yJwoqh7rE8V77tdoheRYataNKL4QrPw==}
+  '@esbuild/darwin-x64@0.27.7':
+    resolution: {integrity: sha512-rYnXrKcXuT7Z+WL5K980jVFdvVKhCHhUwid+dDYQpH+qu+TefcomiMAJpIiC2EM3Rjtq0sO3StMV/+3w3MyyqQ==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [darwin]
 
-  '@esbuild/freebsd-arm64@0.27.4':
-    resolution: {integrity: sha512-jnfpKe+p79tCnm4GVav68A7tUFeKQwQyLgESwEAUzyxk/TJr4QdGog9sqWNcUbr/bZt/O/HXouspuQDd9JxFSw==}
+  '@esbuild/freebsd-arm64@0.27.7':
+    resolution: {integrity: sha512-B48PqeCsEgOtzME2GbNM2roU29AMTuOIN91dsMO30t+Ydis3z/3Ngoj5hhnsOSSwNzS+6JppqWsuhTp6E82l2w==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [freebsd]
 
-  '@esbuild/freebsd-x64@0.27.4':
-    resolution: {integrity: sha512-2kb4ceA/CpfUrIcTUl1wrP/9ad9Atrp5J94Lq69w7UwOMolPIGrfLSvAKJp0RTvkPPyn6CIWrNy13kyLikZRZQ==}
+  '@esbuild/freebsd-x64@0.27.7':
+    resolution: {integrity: sha512-jOBDK5XEjA4m5IJK3bpAQF9/Lelu/Z9ZcdhTRLf4cajlB+8VEhFFRjWgfy3M1O4rO2GQ/b2dLwCUGpiF/eATNQ==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [freebsd]
 
-  '@esbuild/linux-arm64@0.27.4':
-    resolution: {integrity: sha512-7nQOttdzVGth1iz57kxg9uCz57dxQLHWxopL6mYuYthohPKEK0vU0C3O21CcBK6KDlkYVcnDXY099HcCDXd9dA==}
+  '@esbuild/linux-arm64@0.27.7':
+    resolution: {integrity: sha512-RZPHBoxXuNnPQO9rvjh5jdkRmVizktkT7TCDkDmQ0W2SwHInKCAV95GRuvdSvA7w4VMwfCjUiPwDi0ZO6Nfe9A==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [linux]
 
-  '@esbuild/linux-arm@0.27.4':
-    resolution: {integrity: sha512-aBYgcIxX/wd5n2ys0yESGeYMGF+pv6g0DhZr3G1ZG4jMfruU9Tl1i2Z+Wnj9/KjGz1lTLCcorqE2viePZqj4Eg==}
+  '@esbuild/linux-arm@0.27.7':
+    resolution: {integrity: sha512-RkT/YXYBTSULo3+af8Ib0ykH8u2MBh57o7q/DAs3lTJlyVQkgQvlrPTnjIzzRPQyavxtPtfg0EopvDyIt0j1rA==}
     engines: {node: '>=18'}
     cpu: [arm]
     os: [linux]
 
-  '@esbuild/linux-ia32@0.27.4':
-    resolution: {integrity: sha512-oPtixtAIzgvzYcKBQM/qZ3R+9TEUd1aNJQu0HhGyqtx6oS7qTpvjheIWBbes4+qu1bNlo2V4cbkISr8q6gRBFA==}
+  '@esbuild/linux-ia32@0.27.7':
+    resolution: {integrity: sha512-GA48aKNkyQDbd3KtkplYWT102C5sn/EZTY4XROkxONgruHPU72l+gW+FfF8tf2cFjeHaRbWpOYa/uRBz/Xq1Pg==}
     engines: {node: '>=18'}
     cpu: [ia32]
     os: [linux]
 
-  '@esbuild/linux-loong64@0.27.4':
-    resolution: {integrity: sha512-8mL/vh8qeCoRcFH2nM8wm5uJP+ZcVYGGayMavi8GmRJjuI3g1v6Z7Ni0JJKAJW+m0EtUuARb6Lmp4hMjzCBWzA==}
+  '@esbuild/linux-loong64@0.27.7':
+    resolution: {integrity: sha512-a4POruNM2oWsD4WKvBSEKGIiWQF8fZOAsycHOt6JBpZ+JN2n2JH9WAv56SOyu9X5IqAjqSIPTaJkqN8F7XOQ5Q==}
     engines: {node: '>=18'}
     cpu: [loong64]
     os: [linux]
 
-  '@esbuild/linux-mips64el@0.27.4':
-    resolution: {integrity: sha512-1RdrWFFiiLIW7LQq9Q2NES+HiD4NyT8Itj9AUeCl0IVCA459WnPhREKgwrpaIfTOe+/2rdntisegiPWn/r/aAw==}
+  '@esbuild/linux-mips64el@0.27.7':
+    resolution: {integrity: sha512-KabT5I6StirGfIz0FMgl1I+R1H73Gp0ofL9A3nG3i/cYFJzKHhouBV5VWK1CSgKvVaG4q1RNpCTR2LuTVB3fIw==}
     engines: {node: '>=18'}
     cpu: [mips64el]
     os: [linux]
 
-  '@esbuild/linux-ppc64@0.27.4':
-    resolution: {integrity: sha512-tLCwNG47l3sd9lpfyx9LAGEGItCUeRCWeAx6x2Jmbav65nAwoPXfewtAdtbtit/pJFLUWOhpv0FpS6GQAmPrHA==}
+  '@esbuild/linux-ppc64@0.27.7':
+    resolution: {integrity: sha512-gRsL4x6wsGHGRqhtI+ifpN/vpOFTQtnbsupUF5R5YTAg+y/lKelYR1hXbnBdzDjGbMYjVJLJTd2OFmMewAgwlQ==}
     engines: {node: '>=18'}
     cpu: [ppc64]
     os: [linux]
 
-  '@esbuild/linux-riscv64@0.27.4':
-    resolution: {integrity: sha512-BnASypppbUWyqjd1KIpU4AUBiIhVr6YlHx/cnPgqEkNoVOhHg+YiSVxM1RLfiy4t9cAulbRGTNCKOcqHrEQLIw==}
+  '@esbuild/linux-riscv64@0.27.7':
+    resolution: {integrity: sha512-hL25LbxO1QOngGzu2U5xeXtxXcW+/GvMN3ejANqXkxZ/opySAZMrc+9LY/WyjAan41unrR3YrmtTsUpwT66InQ==}
     engines: {node: '>=18'}
     cpu: [riscv64]
     os: [linux]
 
-  '@esbuild/linux-s390x@0.27.4':
-    resolution: {integrity: sha512-+eUqgb/Z7vxVLezG8bVB9SfBie89gMueS+I0xYh2tJdw3vqA/0ImZJ2ROeWwVJN59ihBeZ7Tu92dF/5dy5FttA==}
+  '@esbuild/linux-s390x@0.27.7':
+    resolution: {integrity: sha512-2k8go8Ycu1Kb46vEelhu1vqEP+UeRVj2zY1pSuPdgvbd5ykAw82Lrro28vXUrRmzEsUV0NzCf54yARIK8r0fdw==}
     engines: {node: '>=18'}
     cpu: [s390x]
     os: [linux]
 
-  '@esbuild/linux-x64@0.27.4':
-    resolution: {integrity: sha512-S5qOXrKV8BQEzJPVxAwnryi2+Iq5pB40gTEIT69BQONqR7JH1EPIcQ/Uiv9mCnn05jff9umq/5nqzxlqTOg9NA==}
+  '@esbuild/linux-x64@0.27.7':
+    resolution: {integrity: sha512-hzznmADPt+OmsYzw1EE33ccA+HPdIqiCRq7cQeL1Jlq2gb1+OyWBkMCrYGBJ+sxVzve2ZJEVeePbLM2iEIZSxA==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [linux]
 
-  '@esbuild/netbsd-arm64@0.27.4':
-    resolution: {integrity: sha512-xHT8X4sb0GS8qTqiwzHqpY00C95DPAq7nAwX35Ie/s+LO9830hrMd3oX0ZMKLvy7vsonee73x0lmcdOVXFzd6Q==}
+  '@esbuild/netbsd-arm64@0.27.7':
+    resolution: {integrity: sha512-b6pqtrQdigZBwZxAn1UpazEisvwaIDvdbMbmrly7cDTMFnw/+3lVxxCTGOrkPVnsYIosJJXAsILG9XcQS+Yu6w==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [netbsd]
 
-  '@esbuild/netbsd-x64@0.27.4':
-    resolution: {integrity: sha512-RugOvOdXfdyi5Tyv40kgQnI0byv66BFgAqjdgtAKqHoZTbTF2QqfQrFwa7cHEORJf6X2ht+l9ABLMP0dnKYsgg==}
+  '@esbuild/netbsd-x64@0.27.7':
+    resolution: {integrity: sha512-OfatkLojr6U+WN5EDYuoQhtM+1xco+/6FSzJJnuWiUw5eVcicbyK3dq5EeV/QHT1uy6GoDhGbFpprUiHUYggrw==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [netbsd]
 
-  '@esbuild/openbsd-arm64@0.27.4':
-    resolution: {integrity: sha512-2MyL3IAaTX+1/qP0O1SwskwcwCoOI4kV2IBX1xYnDDqthmq5ArrW94qSIKCAuRraMgPOmG0RDTA74mzYNQA9ow==}
+  '@esbuild/openbsd-arm64@0.27.7':
+    resolution: {integrity: sha512-AFuojMQTxAz75Fo8idVcqoQWEHIXFRbOc1TrVcFSgCZtQfSdc1RXgB3tjOn/krRHENUB4j00bfGjyl2mJrU37A==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [openbsd]
 
-  '@esbuild/openbsd-x64@0.27.4':
-    resolution: {integrity: sha512-u8fg/jQ5aQDfsnIV6+KwLOf1CmJnfu1ShpwqdwC0uA7ZPwFws55Ngc12vBdeUdnuWoQYx/SOQLGDcdlfXhYmXQ==}
+  '@esbuild/openbsd-x64@0.27.7':
+    resolution: {integrity: sha512-+A1NJmfM8WNDv5CLVQYJ5PshuRm/4cI6WMZRg1by1GwPIQPCTs1GLEUHwiiQGT5zDdyLiRM/l1G0Pv54gvtKIg==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [openbsd]
 
-  '@esbuild/openharmony-arm64@0.27.4':
-    resolution: {integrity: sha512-JkTZrl6VbyO8lDQO3yv26nNr2RM2yZzNrNHEsj9bm6dOwwu9OYN28CjzZkH57bh4w0I2F7IodpQvUAEd1mbWXg==}
+  '@esbuild/openharmony-arm64@0.27.7':
+    resolution: {integrity: sha512-+KrvYb/C8zA9CU/g0sR6w2RBw7IGc5J2BPnc3dYc5VJxHCSF1yNMxTV5LQ7GuKteQXZtspjFbiuW5/dOj7H4Yw==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [openharmony]
 
-  '@esbuild/sunos-x64@0.27.4':
-    resolution: {integrity: sha512-/gOzgaewZJfeJTlsWhvUEmUG4tWEY2Spp5M20INYRg2ZKl9QPO3QEEgPeRtLjEWSW8FilRNacPOg8R1uaYkA6g==}
+  '@esbuild/sunos-x64@0.27.7':
+    resolution: {integrity: sha512-ikktIhFBzQNt/QDyOL580ti9+5mL/YZeUPKU2ivGtGjdTYoqz6jObj6nOMfhASpS4GU4Q/Clh1QtxWAvcYKamA==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [sunos]
 
-  '@esbuild/win32-arm64@0.27.4':
-    resolution: {integrity: sha512-Z9SExBg2y32smoDQdf1HRwHRt6vAHLXcxD2uGgO/v2jK7Y718Ix4ndsbNMU/+1Qiem9OiOdaqitioZwxivhXYg==}
+  '@esbuild/win32-arm64@0.27.7':
+    resolution: {integrity: sha512-7yRhbHvPqSpRUV7Q20VuDwbjW5kIMwTHpptuUzV+AA46kiPze5Z7qgt6CLCK3pWFrHeNfDd1VKgyP4O+ng17CA==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [win32]
 
-  '@esbuild/win32-ia32@0.27.4':
-    resolution: {integrity: sha512-DAyGLS0Jz5G5iixEbMHi5KdiApqHBWMGzTtMiJ72ZOLhbu/bzxgAe8Ue8CTS3n3HbIUHQz/L51yMdGMeoxXNJw==}
+  '@esbuild/win32-ia32@0.27.7':
+    resolution: {integrity: sha512-SmwKXe6VHIyZYbBLJrhOoCJRB/Z1tckzmgTLfFYOfpMAx63BJEaL9ExI8x7v0oAO3Zh6D/Oi1gVxEYr5oUCFhw==}
     engines: {node: '>=18'}
     cpu: [ia32]
     os: [win32]
 
-  '@esbuild/win32-x64@0.27.4':
-    resolution: {integrity: sha512-+knoa0BDoeXgkNvvV1vvbZX4+hizelrkwmGJBdT17t8FNPwG2lKemmuMZlmaNQ3ws3DKKCxpb4zRZEIp3UxFCg==}
+  '@esbuild/win32-x64@0.27.7':
+    resolution: {integrity: sha512-56hiAJPhwQ1R4i+21FVF7V8kSD5zZTdHcVuRFMW0hn753vVfQN8xlx4uOPT4xoGH0Z/oVATuR82AiqSTDIpaHg==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [win32]
@@ -779,8 +779,11 @@ packages:
     resolution: {integrity: sha512-SSnyl/4ni/2ViHKkiZb8eajA/eN1DNFaHjhGiLUdZvDz6PKF4COSf/17xqSz64nOo2Ia29SA6B2KNCsyCbVmaQ==}
     engines: {node: '>=18'}
 
-  '@napi-rs/wasm-runtime@1.1.1':
-    resolution: {integrity: sha512-p64ah1M1ld8xjWv3qbvFwHiFVWrq1yFvV4f7w+mzaqiR4IlSgkqhcRdHwsGgomwzBH51sRY4NEowLxnaBjcW/A==}
+  '@napi-rs/wasm-runtime@1.1.3':
+    resolution: {integrity: sha512-xK9sGVbJWYb08+mTJt3/YV24WxvxpXcXtP6B172paPZ+Ts69Re9dAr7lKwJoeIx8OoeuimEiRZ7umkiUVClmmQ==}
+    peerDependencies:
+      '@emnapi/core': ^1.7.1
+      '@emnapi/runtime': ^1.7.1
 
   '@nodelib/fs.scandir@2.1.5':
     resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==}
@@ -803,8 +806,8 @@ packages:
   '@open-draft/until@2.1.0':
     resolution: {integrity: sha512-U69T3ItWHvLwGg5eJ0n3I62nWuE6ilHlmz7zM0npLBRvPRd7e6NYmg54vvRtP5mZG7kZqZCFVdsTWo7BPtBujg==}
 
-  '@oxc-project/types@0.122.0':
-    resolution: {integrity: sha512-oLAl5kBpV4w69UtFZ9xqcmTi+GENWOcPF7FCrczTiBbmC0ibXxCwyvZGbO39rCVEuLGAZM84DH0pUIyyv/YJzA==}
+  '@oxc-project/types@0.123.0':
+    resolution: {integrity: sha512-YtECP/y8Mj1lSHiUWGSRzy/C6teUKlS87dEfuVKT09LgQbUsBW1rNg+MiJ4buGu3yuADV60gbIvo9/HplA56Ew==}
 
   '@parcel/watcher-android-arm64@2.5.6':
     resolution: {integrity: sha512-YQxSS34tPF/6ZG7r/Ih9xy+kP/WwediEUsqmtf0cuCV5TPPKw/PQHRhueUo6JdeFJaqV3pyjm0GdYjZotbRt/A==}
@@ -898,282 +901,282 @@ packages:
     resolution: {integrity: sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==}
     engines: {node: '>=14'}
 
-  '@playwright/test@1.58.2':
-    resolution: {integrity: sha512-akea+6bHYBBfA9uQqSYmlJXn61cTa+jbO87xVLCWbTqbWadRVmhxlXATaOjOgcBaWU4ePo0wB41KMFv3o35IXA==}
+  '@playwright/test@1.59.1':
+    resolution: {integrity: sha512-PG6q63nQg5c9rIi4/Z5lR5IVF7yU5MqmKaPOe0HSc0O2cX1fPi96sUQu5j7eo4gKCkB2AnNGoWt7y4/Xx3Kcqg==}
     engines: {node: '>=18'}
     hasBin: true
 
-  '@rolldown/binding-android-arm64@1.0.0-rc.12':
-    resolution: {integrity: sha512-pv1y2Fv0JybcykuiiD3qBOBdz6RteYojRFY1d+b95WVuzx211CRh+ytI/+9iVyWQ6koTh5dawe4S/yRfOFjgaA==}
+  '@rolldown/binding-android-arm64@1.0.0-rc.13':
+    resolution: {integrity: sha512-5ZiiecKH2DXAVJTNN13gNMUcCDg4Jy8ZjbXEsPnqa248wgOVeYRX0iqXXD5Jz4bI9BFHgKsI2qmyJynstbmr+g==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [arm64]
     os: [android]
 
-  '@rolldown/binding-darwin-arm64@1.0.0-rc.12':
-    resolution: {integrity: sha512-cFYr6zTG/3PXXF3pUO+umXxt1wkRK/0AYT8lDwuqvRC+LuKYWSAQAQZjCWDQpAH172ZV6ieYrNnFzVVcnSflAg==}
+  '@rolldown/binding-darwin-arm64@1.0.0-rc.13':
+    resolution: {integrity: sha512-tz/v/8G77seu8zAB3A5sK3UFoOl06zcshEzhUO62sAEtrEuW/H1CcyoupOrD+NbQJytYgA4CppXPzlrmp4JZKA==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [arm64]
     os: [darwin]
 
-  '@rolldown/binding-darwin-x64@1.0.0-rc.12':
-    resolution: {integrity: sha512-ZCsYknnHzeXYps0lGBz8JrF37GpE9bFVefrlmDrAQhOEi4IOIlcoU1+FwHEtyXGx2VkYAvhu7dyBf75EJQffBw==}
+  '@rolldown/binding-darwin-x64@1.0.0-rc.13':
+    resolution: {integrity: sha512-8DakphqOz8JrMYWTJmWA+vDJxut6LijZ8Xcdc4flOlAhU7PNVwo2MaWBF9iXjJAPo5rC/IxEFZDhJ3GC7NHvug==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [x64]
     os: [darwin]
 
-  '@rolldown/binding-freebsd-x64@1.0.0-rc.12':
-    resolution: {integrity: sha512-dMLeprcVsyJsKolRXyoTH3NL6qtsT0Y2xeuEA8WQJquWFXkEC4bcu1rLZZSnZRMtAqwtrF/Ib9Ddtpa/Gkge9Q==}
+  '@rolldown/binding-freebsd-x64@1.0.0-rc.13':
+    resolution: {integrity: sha512-4wBQFfjDuXYN/SVI8inBF3Aa+isq40rc6VMFbk5jcpolUBTe5cYnMsHZ51nFWsx3PVyyNN3vgoESki0Hmr/4BA==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [x64]
     os: [freebsd]
 
-  '@rolldown/binding-linux-arm-gnueabihf@1.0.0-rc.12':
-    resolution: {integrity: sha512-YqWjAgGC/9M1lz3GR1r1rP79nMgo3mQiiA+Hfo+pvKFK1fAJ1bCi0ZQVh8noOqNacuY1qIcfyVfP6HoyBRZ85Q==}
+  '@rolldown/binding-linux-arm-gnueabihf@1.0.0-rc.13':
+    resolution: {integrity: sha512-JW/e4yPIXLms+jmnbwwy5LA/LxVwZUWLN8xug+V200wzaVi5TEGIWQlh8o91gWYFxW609euI98OCCemmWGuPrw==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [arm]
     os: [linux]
 
-  '@rolldown/binding-linux-arm64-gnu@1.0.0-rc.12':
-    resolution: {integrity: sha512-/I5AS4cIroLpslsmzXfwbe5OmWvSsrFuEw3mwvbQ1kDxJ822hFHIx+vsN/TAzNVyepI/j/GSzrtCIwQPeKCLIg==}
+  '@rolldown/binding-linux-arm64-gnu@1.0.0-rc.13':
+    resolution: {integrity: sha512-ZfKWpXiUymDnavepCaM6KG/uGydJ4l2nBmMxg60Ci4CbeefpqjPWpfaZM7PThOhk2dssqBAcwLc6rAyr0uTdXg==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [arm64]
     os: [linux]
     libc: [glibc]
 
-  '@rolldown/binding-linux-arm64-musl@1.0.0-rc.12':
-    resolution: {integrity: sha512-V6/wZztnBqlx5hJQqNWwFdxIKN0m38p8Jas+VoSfgH54HSj9tKTt1dZvG6JRHcjh6D7TvrJPWFGaY9UBVOaWPw==}
+  '@rolldown/binding-linux-arm64-musl@1.0.0-rc.13':
+    resolution: {integrity: sha512-bmRg3O6Z0gq9yodKKWCIpnlH051sEfdVwt+6m5UDffAQMUUqU0xjnQqqAUm+Gu7ofAAly9DqiQDtKu2nPDEABA==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [arm64]
     os: [linux]
     libc: [musl]
 
-  '@rolldown/binding-linux-ppc64-gnu@1.0.0-rc.12':
-    resolution: {integrity: sha512-AP3E9BpcUYliZCxa3w5Kwj9OtEVDYK6sVoUzy4vTOJsjPOgdaJZKFmN4oOlX0Wp0RPV2ETfmIra9x1xuayFB7g==}
+  '@rolldown/binding-linux-ppc64-gnu@1.0.0-rc.13':
+    resolution: {integrity: sha512-8Wtnbw4k7pMYN9B/mOEAsQ8HOiq7AZ31Ig4M9BKn2So4xRaFEhtCSa4ZJaOutOWq50zpgR4N5+L/opnlaCx8wQ==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [ppc64]
     os: [linux]
     libc: [glibc]
 
-  '@rolldown/binding-linux-s390x-gnu@1.0.0-rc.12':
-    resolution: {integrity: sha512-nWwpvUSPkoFmZo0kQazZYOrT7J5DGOJ/+QHHzjvNlooDZED8oH82Yg67HvehPPLAg5fUff7TfWFHQS8IV1n3og==}
+  '@rolldown/binding-linux-s390x-gnu@1.0.0-rc.13':
+    resolution: {integrity: sha512-D/0Nlo8mQuxSMohNJUF2lDXWRsFDsHldfRRgD9bRgktj+EndGPj4DOV37LqDKPYS+osdyhZEH7fTakTAEcW7qg==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [s390x]
     os: [linux]
     libc: [glibc]
 
-  '@rolldown/binding-linux-x64-gnu@1.0.0-rc.12':
-    resolution: {integrity: sha512-RNrafz5bcwRy+O9e6P8Z/OCAJW/A+qtBczIqVYwTs14pf4iV1/+eKEjdOUta93q2TsT/FI0XYDP3TCky38LMAg==}
+  '@rolldown/binding-linux-x64-gnu@1.0.0-rc.13':
+    resolution: {integrity: sha512-eRrPvat2YaVQcwwKi/JzOP6MKf1WRnOCr+VaI3cTWz3ZoLcP/654z90lVCJ4dAuMEpPdke0n+qyAqXDZdIC4rA==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [x64]
     os: [linux]
     libc: [glibc]
 
-  '@rolldown/binding-linux-x64-musl@1.0.0-rc.12':
-    resolution: {integrity: sha512-Jpw/0iwoKWx3LJ2rc1yjFrj+T7iHZn2JDg1Yny1ma0luviFS4mhAIcd1LFNxK3EYu3DHWCps0ydXQ5i/rrJ2ig==}
+  '@rolldown/binding-linux-x64-musl@1.0.0-rc.13':
+    resolution: {integrity: sha512-PsdONiFRp8hR8KgVjTWjZ9s7uA3uueWL0t74/cKHfM4dR5zXYv4AjB8BvA+QDToqxAFg4ZkcVEqeu5F7inoz5w==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [x64]
     os: [linux]
     libc: [musl]
 
-  '@rolldown/binding-openharmony-arm64@1.0.0-rc.12':
-    resolution: {integrity: sha512-vRugONE4yMfVn0+7lUKdKvN4D5YusEiPilaoO2sgUWpCvrncvWgPMzK00ZFFJuiPgLwgFNP5eSiUlv2tfc+lpA==}
+  '@rolldown/binding-openharmony-arm64@1.0.0-rc.13':
+    resolution: {integrity: sha512-hCNXgC5dI3TVOLrPT++PKFNZ+1EtS0mLQwfXXXSUD/+rGlB65gZDwN/IDuxLpQP4x8RYYHqGomlUXzpO8aVI2w==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [arm64]
     os: [openharmony]
 
-  '@rolldown/binding-wasm32-wasi@1.0.0-rc.12':
-    resolution: {integrity: sha512-ykGiLr/6kkiHc0XnBfmFJuCjr5ZYKKofkx+chJWDjitX+KsJuAmrzWhwyOMSHzPhzOHOy7u9HlFoa5MoAOJ/Zg==}
+  '@rolldown/binding-wasm32-wasi@1.0.0-rc.13':
+    resolution: {integrity: sha512-viLS5C5et8NFtLWw9Sw3M/w4vvnVkbWkO7wSNh3C+7G1+uCkGpr6PcjNDSFcNtmXY/4trjPBqUfcOL+P3sWy/g==}
     engines: {node: '>=14.0.0'}
     cpu: [wasm32]
 
-  '@rolldown/binding-win32-arm64-msvc@1.0.0-rc.12':
-    resolution: {integrity: sha512-5eOND4duWkwx1AzCxadcOrNeighiLwMInEADT0YM7xeEOOFcovWZCq8dadXgcRHSf3Ulh1kFo/qvzoFiCLOL1Q==}
+  '@rolldown/binding-win32-arm64-msvc@1.0.0-rc.13':
+    resolution: {integrity: sha512-Fqa3Tlt1xL4wzmAYxGNFV36Hb+VfPc9PYU+E25DAnswXv3ODDu/yyWjQDbXMo5AGWkQVjLgQExuVu8I/UaZhPQ==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [arm64]
     os: [win32]
 
-  '@rolldown/binding-win32-x64-msvc@1.0.0-rc.12':
-    resolution: {integrity: sha512-PyqoipaswDLAZtot351MLhrlrh6lcZPo2LSYE+VDxbVk24LVKAGOuE4hb8xZQmrPAuEtTZW8E6D2zc5EUZX4Lw==}
+  '@rolldown/binding-win32-x64-msvc@1.0.0-rc.13':
+    resolution: {integrity: sha512-/pLI5kPkGEi44TDlnbio3St/5gUFeN51YWNAk/Gnv6mEQBOahRBh52qVFVBpmrnU01n2yysvBML9Ynu7K4kGAQ==}
     engines: {node: ^20.19.0 || >=22.12.0}
     cpu: [x64]
     os: [win32]
 
-  '@rolldown/pluginutils@1.0.0-rc.12':
-    resolution: {integrity: sha512-HHMwmarRKvoFsJorqYlFeFRzXZqCt2ETQlEDOb9aqssrnVBB1/+xgTGtuTrIk5vzLNX1MjMtTf7W9z3tsSbrxw==}
+  '@rolldown/pluginutils@1.0.0-rc.13':
+    resolution: {integrity: sha512-3ngTAv6F/Py35BsYbeeLeecvhMKdsKm4AoOETVhAA+Qc8nrA2I0kF7oa93mE9qnIurngOSpMnQ0x2nQY2FPviA==}
 
   '@rolldown/pluginutils@1.0.0-rc.7':
     resolution: {integrity: sha512-qujRfC8sFVInYSPPMLQByRh7zhwkGFS4+tyMQ83srV1qrxL4g8E2tyxVVyxd0+8QeBM1mIk9KbWxkegRr76XzA==}
 
-  '@rollup/rollup-android-arm-eabi@4.60.0':
-    resolution: {integrity: sha512-WOhNW9K8bR3kf4zLxbfg6Pxu2ybOUbB2AjMDHSQx86LIF4rH4Ft7vmMwNt0loO0eonglSNy4cpD3MKXXKQu0/A==}
+  '@rollup/rollup-android-arm-eabi@4.60.1':
+    resolution: {integrity: sha512-d6FinEBLdIiK+1uACUttJKfgZREXrF0Qc2SmLII7W2AD8FfiZ9Wjd+rD/iRuf5s5dWrr1GgwXCvPqOuDquOowA==}
     cpu: [arm]
     os: [android]
 
-  '@rollup/rollup-android-arm64@4.60.0':
-    resolution: {integrity: sha512-u6JHLll5QKRvjciE78bQXDmqRqNs5M/3GVqZeMwvmjaNODJih/WIrJlFVEihvV0MiYFmd+ZyPr9wxOVbPAG2Iw==}
+  '@rollup/rollup-android-arm64@4.60.1':
+    resolution: {integrity: sha512-YjG/EwIDvvYI1YvYbHvDz/BYHtkY4ygUIXHnTdLhG+hKIQFBiosfWiACWortsKPKU/+dUwQQCKQM3qrDe8c9BA==}
     cpu: [arm64]
     os: [android]
 
-  '@rollup/rollup-darwin-arm64@4.60.0':
-    resolution: {integrity: sha512-qEF7CsKKzSRc20Ciu2Zw1wRrBz4g56F7r/vRwY430UPp/nt1x21Q/fpJ9N5l47WWvJlkNCPJz3QRVw008fi7yA==}
+  '@rollup/rollup-darwin-arm64@4.60.1':
+    resolution: {integrity: sha512-mjCpF7GmkRtSJwon+Rq1N8+pI+8l7w5g9Z3vWj4T7abguC4Czwi3Yu/pFaLvA3TTeMVjnu3ctigusqWUfjZzvw==}
     cpu: [arm64]
     os: [darwin]
 
-  '@rollup/rollup-darwin-x64@4.60.0':
-    resolution: {integrity: sha512-WADYozJ4QCnXCH4wPB+3FuGmDPoFseVCUrANmA5LWwGmC6FL14BWC7pcq+FstOZv3baGX65tZ378uT6WG8ynTw==}
+  '@rollup/rollup-darwin-x64@4.60.1':
+    resolution: {integrity: sha512-haZ7hJ1JT4e9hqkoT9R/19XW2QKqjfJVv+i5AGg57S+nLk9lQnJ1F/eZloRO3o9Scy9CM3wQ9l+dkXtcBgN5Ew==}
     cpu: [x64]
     os: [darwin]
 
-  '@rollup/rollup-freebsd-arm64@4.60.0':
-    resolution: {integrity: sha512-6b8wGHJlDrGeSE3aH5mGNHBjA0TTkxdoNHik5EkvPHCt351XnigA4pS7Wsj/Eo9Y8RBU6f35cjN9SYmCFBtzxw==}
+  '@rollup/rollup-freebsd-arm64@4.60.1':
+    resolution: {integrity: sha512-czw90wpQq3ZsAVBlinZjAYTKduOjTywlG7fEeWKUA7oCmpA8xdTkxZZlwNJKWqILlq0wehoZcJYfBvOyhPTQ6w==}
     cpu: [arm64]
     os: [freebsd]
 
-  '@rollup/rollup-freebsd-x64@4.60.0':
-    resolution: {integrity: sha512-h25Ga0t4jaylMB8M/JKAyrvvfxGRjnPQIR8lnCayyzEjEOx2EJIlIiMbhpWxDRKGKF8jbNH01NnN663dH638mA==}
+  '@rollup/rollup-freebsd-x64@4.60.1':
+    resolution: {integrity: sha512-KVB2rqsxTHuBtfOeySEyzEOB7ltlB/ux38iu2rBQzkjbwRVlkhAGIEDiiYnO2kFOkJp+Z7pUXKyrRRFuFUKt+g==}
     cpu: [x64]
     os: [freebsd]
 
-  '@rollup/rollup-linux-arm-gnueabihf@4.60.0':
-    resolution: {integrity: sha512-RzeBwv0B3qtVBWtcuABtSuCzToo2IEAIQrcyB/b2zMvBWVbjo8bZDjACUpnaafaxhTw2W+imQbP2BD1usasK4g==}
+  '@rollup/rollup-linux-arm-gnueabihf@4.60.1':
+    resolution: {integrity: sha512-L+34Qqil+v5uC0zEubW7uByo78WOCIrBvci69E7sFASRl0X7b/MB6Cqd1lky/CtcSVTydWa2WZwFuWexjS5o6g==}
     cpu: [arm]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-arm-musleabihf@4.60.0':
-    resolution: {integrity: sha512-Sf7zusNI2CIU1HLzuu9Tc5YGAHEZs5Lu7N1ssJG4Tkw6e0MEsN7NdjUDDfGNHy2IU+ENyWT+L2obgWiguWibWQ==}
+  '@rollup/rollup-linux-arm-musleabihf@4.60.1':
+    resolution: {integrity: sha512-n83O8rt4v34hgFzlkb1ycniJh7IR5RCIqt6mz1VRJD6pmhRi0CXdmfnLu9dIUS6buzh60IvACM842Ffb3xd6Gg==}
     cpu: [arm]
     os: [linux]
     libc: [musl]
 
-  '@rollup/rollup-linux-arm64-gnu@4.60.0':
-    resolution: {integrity: sha512-DX2x7CMcrJzsE91q7/O02IJQ5/aLkVtYFryqCjduJhUfGKG6yJV8hxaw8pZa93lLEpPTP/ohdN4wFz7yp/ry9A==}
+  '@rollup/rollup-linux-arm64-gnu@4.60.1':
+    resolution: {integrity: sha512-Nql7sTeAzhTAja3QXeAI48+/+GjBJ+QmAH13snn0AJSNL50JsDqotyudHyMbO2RbJkskbMbFJfIJKWA6R1LCJQ==}
     cpu: [arm64]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-arm64-musl@4.60.0':
-    resolution: {integrity: sha512-09EL+yFVbJZlhcQfShpswwRZ0Rg+z/CsSELFCnPt3iK+iqwGsI4zht3secj5vLEs957QvFFXnzAT0FFPIxSrkQ==}
+  '@rollup/rollup-linux-arm64-musl@4.60.1':
+    resolution: {integrity: sha512-+pUymDhd0ys9GcKZPPWlFiZ67sTWV5UU6zOJat02M1+PiuSGDziyRuI/pPue3hoUwm2uGfxdL+trT6Z9rxnlMA==}
     cpu: [arm64]
     os: [linux]
     libc: [musl]
 
-  '@rollup/rollup-linux-loong64-gnu@4.60.0':
-    resolution: {integrity: sha512-i9IcCMPr3EXm8EQg5jnja0Zyc1iFxJjZWlb4wr7U2Wx/GrddOuEafxRdMPRYVaXjgbhvqalp6np07hN1w9kAKw==}
+  '@rollup/rollup-linux-loong64-gnu@4.60.1':
+    resolution: {integrity: sha512-VSvgvQeIcsEvY4bKDHEDWcpW4Yw7BtlKG1GUT4FzBUlEKQK0rWHYBqQt6Fm2taXS+1bXvJT6kICu5ZwqKCnvlQ==}
     cpu: [loong64]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-loong64-musl@4.60.0':
-    resolution: {integrity: sha512-DGzdJK9kyJ+B78MCkWeGnpXJ91tK/iKA6HwHxF4TAlPIY7GXEvMe8hBFRgdrR9Ly4qebR/7gfUs9y2IoaVEyog==}
+  '@rollup/rollup-linux-loong64-musl@4.60.1':
+    resolution: {integrity: sha512-4LqhUomJqwe641gsPp6xLfhqWMbQV04KtPp7/dIp0nzPxAkNY1AbwL5W0MQpcalLYk07vaW9Kp1PBhdpZYYcEw==}
     cpu: [loong64]
     os: [linux]
     libc: [musl]
 
-  '@rollup/rollup-linux-ppc64-gnu@4.60.0':
-    resolution: {integrity: sha512-RwpnLsqC8qbS8z1H1AxBA1H6qknR4YpPR9w2XX0vo2Sz10miu57PkNcnHVaZkbqyw/kUWfKMI73jhmfi9BRMUQ==}
+  '@rollup/rollup-linux-ppc64-gnu@4.60.1':
+    resolution: {integrity: sha512-tLQQ9aPvkBxOc/EUT6j3pyeMD6Hb8QF2BTBnCQWP/uu1lhc9AIrIjKnLYMEroIz/JvtGYgI9dF3AxHZNaEH0rw==}
     cpu: [ppc64]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-ppc64-musl@4.60.0':
-    resolution: {integrity: sha512-Z8pPf54Ly3aqtdWC3G4rFigZgNvd+qJlOE52fmko3KST9SoGfAdSRCwyoyG05q1HrrAblLbk1/PSIV+80/pxLg==}
+  '@rollup/rollup-linux-ppc64-musl@4.60.1':
+    resolution: {integrity: sha512-RMxFhJwc9fSXP6PqmAz4cbv3kAyvD1etJFjTx4ONqFP9DkTkXsAMU4v3Vyc5BgzC+anz7nS/9tp4obsKfqkDHg==}
     cpu: [ppc64]
     os: [linux]
     libc: [musl]
 
-  '@rollup/rollup-linux-riscv64-gnu@4.60.0':
-    resolution: {integrity: sha512-3a3qQustp3COCGvnP4SvrMHnPQ9d1vzCakQVRTliaz8cIp/wULGjiGpbcqrkv0WrHTEp8bQD/B3HBjzujVWLOA==}
+  '@rollup/rollup-linux-riscv64-gnu@4.60.1':
+    resolution: {integrity: sha512-QKgFl+Yc1eEk6MmOBfRHYF6lTxiiiV3/z/BRrbSiW2I7AFTXoBFvdMEyglohPj//2mZS4hDOqeB0H1ACh3sBbg==}
     cpu: [riscv64]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-riscv64-musl@4.60.0':
-    resolution: {integrity: sha512-pjZDsVH/1VsghMJ2/kAaxt6dL0psT6ZexQVrijczOf+PeP2BUqTHYejk3l6TlPRydggINOeNRhvpLa0AYpCWSQ==}
+  '@rollup/rollup-linux-riscv64-musl@4.60.1':
+    resolution: {integrity: sha512-RAjXjP/8c6ZtzatZcA1RaQr6O1TRhzC+adn8YZDnChliZHviqIjmvFwHcxi4JKPSDAt6Uhf/7vqcBzQJy0PDJg==}
     cpu: [riscv64]
     os: [linux]
     libc: [musl]
 
-  '@rollup/rollup-linux-s390x-gnu@4.60.0':
-    resolution: {integrity: sha512-3ObQs0BhvPgiUVZrN7gqCSvmFuMWvWvsjG5ayJ3Lraqv+2KhOsp+pUbigqbeWqueGIsnn+09HBw27rJ+gYK4VQ==}
+  '@rollup/rollup-linux-s390x-gnu@4.60.1':
+    resolution: {integrity: sha512-wcuocpaOlaL1COBYiA89O6yfjlp3RwKDeTIA0hM7OpmhR1Bjo9j31G1uQVpDlTvwxGn2nQs65fBFL5UFd76FcQ==}
     cpu: [s390x]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-x64-gnu@4.60.0':
-    resolution: {integrity: sha512-EtylprDtQPdS5rXvAayrNDYoJhIz1/vzN2fEubo3yLE7tfAw+948dO0g4M0vkTVFhKojnF+n6C8bDNe+gDRdTg==}
+  '@rollup/rollup-linux-x64-gnu@4.60.1':
+    resolution: {integrity: sha512-77PpsFQUCOiZR9+LQEFg9GClyfkNXj1MP6wRnzYs0EeWbPcHs02AXu4xuUbM1zhwn3wqaizle3AEYg5aeoohhg==}
     cpu: [x64]
     os: [linux]
     libc: [glibc]
 
-  '@rollup/rollup-linux-x64-musl@4.60.0':
-    resolution: {integrity: sha512-k09oiRCi/bHU9UVFqD17r3eJR9bn03TyKraCrlz5ULFJGdJGi7VOmm9jl44vOJvRJ6P7WuBi/s2A97LxxHGIdw==}
+  '@rollup/rollup-linux-x64-musl@4.60.1':
+    resolution: {integrity: sha512-5cIATbk5vynAjqqmyBjlciMJl1+R/CwX9oLk/EyiFXDWd95KpHdrOJT//rnUl4cUcskrd0jCCw3wpZnhIHdD9w==}
     cpu: [x64]
     os: [linux]
     libc: [musl]
 
-  '@rollup/rollup-openbsd-x64@4.60.0':
-    resolution: {integrity: sha512-1o/0/pIhozoSaDJoDcec+IVLbnRtQmHwPV730+AOD29lHEEo4F5BEUB24H0OBdhbBBDwIOSuf7vgg0Ywxdfiiw==}
+  '@rollup/rollup-openbsd-x64@4.60.1':
+    resolution: {integrity: sha512-cl0w09WsCi17mcmWqqglez9Gk8isgeWvoUZ3WiJFYSR3zjBQc2J5/ihSjpl+VLjPqjQ/1hJRcqBfLjssREQILw==}
     cpu: [x64]
     os: [openbsd]
 
-  '@rollup/rollup-openharmony-arm64@4.60.0':
-    resolution: {integrity: sha512-pESDkos/PDzYwtyzB5p/UoNU/8fJo68vcXM9ZW2V0kjYayj1KaaUfi1NmTUTUpMn4UhU4gTuK8gIaFO4UGuMbA==}
+  '@rollup/rollup-openharmony-arm64@4.60.1':
+    resolution: {integrity: sha512-4Cv23ZrONRbNtbZa37mLSueXUCtN7MXccChtKpUnQNgF010rjrjfHx3QxkS2PI7LqGT5xXyYs1a7LbzAwT0iCA==}
     cpu: [arm64]
     os: [openharmony]
 
-  '@rollup/rollup-win32-arm64-msvc@4.60.0':
-    resolution: {integrity: sha512-hj1wFStD7B1YBeYmvY+lWXZ7ey73YGPcViMShYikqKT1GtstIKQAtfUI6yrzPjAy/O7pO0VLXGmUVWXQMaYgTQ==}
+  '@rollup/rollup-win32-arm64-msvc@4.60.1':
+    resolution: {integrity: sha512-i1okWYkA4FJICtr7KpYzFpRTHgy5jdDbZiWfvny21iIKky5YExiDXP+zbXzm3dUcFpkEeYNHgQ5fuG236JPq0g==}
     cpu: [arm64]
     os: [win32]
 
-  '@rollup/rollup-win32-ia32-msvc@4.60.0':
-    resolution: {integrity: sha512-SyaIPFoxmUPlNDq5EHkTbiKzmSEmq/gOYFI/3HHJ8iS/v1mbugVa7dXUzcJGQfoytp9DJFLhHH4U3/eTy2Bq4w==}
+  '@rollup/rollup-win32-ia32-msvc@4.60.1':
+    resolution: {integrity: sha512-u09m3CuwLzShA0EYKMNiFgcjjzwqtUMLmuCJLeZWjjOYA3IT2Di09KaxGBTP9xVztWyIWjVdsB2E9goMjZvTQg==}
     cpu: [ia32]
     os: [win32]
 
-  '@rollup/rollup-win32-x64-gnu@4.60.0':
-    resolution: {integrity: sha512-RdcryEfzZr+lAr5kRm2ucN9aVlCCa2QNq4hXelZxb8GG0NJSazq44Z3PCCc8wISRuCVnGs0lQJVX5Vp6fKA+IA==}
+  '@rollup/rollup-win32-x64-gnu@4.60.1':
+    resolution: {integrity: sha512-k+600V9Zl1CM7eZxJgMyTUzmrmhB/0XZnF4pRypKAlAgxmedUA+1v9R+XOFv56W4SlHEzfeMtzujLJD22Uz5zg==}
     cpu: [x64]
     os: [win32]
 
-  '@rollup/rollup-win32-x64-msvc@4.60.0':
-    resolution: {integrity: sha512-PrsWNQ8BuE00O3Xsx3ALh2Df8fAj9+cvvX9AIA6o4KpATR98c9mud4XtDWVvsEuyia5U4tVSTKygawyJkjm60w==}
+  '@rollup/rollup-win32-x64-msvc@4.60.1':
+    resolution: {integrity: sha512-lWMnixq/QzxyhTV6NjQJ4SFo1J6PvOX8vUx5Wb4bBPsEb+8xZ89Bz6kOXpfXj9ak9AHTQVQzlgzBEc1SyM27xQ==}
     cpu: [x64]
     os: [win32]
 
-  '@sentry-internal/browser-utils@10.46.0':
-    resolution: {integrity: sha512-WB1gBT9G13V02ekZ6NpUhoI1aGHV2eNfjEPthkU2bGBvFpQKnstwzjg7waIRGR7cu+YSW2Q6UI6aQLgBeOPD1g==}
+  '@sentry-internal/browser-utils@10.47.0':
+    resolution: {integrity: sha512-bVFRAeJWMBcBCvJKIFCMJ1/yQToL4vPGqfmlnDZeypcxkqUDKQ/Y3ziLHXoDL2sx0lagcgU2vH1QhCQ67Aujjw==}
     engines: {node: '>=18'}
 
-  '@sentry-internal/feedback@10.46.0':
-    resolution: {integrity: sha512-c4pI/z9nZCQXe9GYEw/hE/YTY9AxGBp8/wgKI+T8zylrN35SGHaXv63szzE1WbI8lacBY8lBF7rstq9bQVCaHw==}
+  '@sentry-internal/feedback@10.47.0':
+    resolution: {integrity: sha512-pdvMmi4dQpX5S/vAAzrhHPIw3T3HjUgDNgUiCBrlp7N9/6zGO2gNPhUnNekP+CjgI/z0rvf49RLqlDenpNrMOg==}
     engines: {node: '>=18'}
 
-  '@sentry-internal/replay-canvas@10.46.0':
-    resolution: {integrity: sha512-ub314MWUsekVCuoH0/HJbbimlI24SkV745UW2pj9xRbxOAEf1wjkmIzxKrMDbTgJGuEunug02XZVdJFJUzOcDw==}
+  '@sentry-internal/replay-canvas@10.47.0':
+    resolution: {integrity: sha512-A5OY8friSe6g8WAK4L8IeOPiEd9D3Ps40DzRH5j2f6SUja0t90mKMvHRcRf8zq0d4BkdB+JM7tjOkwxpuv8heA==}
     engines: {node: '>=18'}
 
-  '@sentry-internal/replay@10.46.0':
-    resolution: {integrity: sha512-JBsWeXG6bRbxBFK8GzWymWGOB9QE7Kl57BeF3jzgdHTuHSWZ2mRnAmb1K05T4LU+gVygk6yW0KmdC8Py9Qzg9A==}
+  '@sentry-internal/replay@10.47.0':
+    resolution: {integrity: sha512-ScdovxP7hJxgMt70+7hFvwT02GIaIUAxdEM/YPsayZBeCoAukPW8WiwztJfoKtsfPyKJ5A6f0H3PIxTPcA9Row==}
     engines: {node: '>=18'}
 
-  '@sentry/browser@10.46.0':
-    resolution: {integrity: sha512-80DmGlTk5Z2/OxVOzLNxwolMyouuAYKqG8KUcoyintZqHbF6kO1RulI610HmyUt3OagKeBCqt9S7w0VIfCRL+Q==}
+  '@sentry/browser@10.47.0':
+    resolution: {integrity: sha512-rC0agZdxKA5XWfL4VwPOr/rJMogXDqZgnVzr93YWpFn9DMZT/7LzxSJVPIJwRUjx3bFEby3PcTa3YaX7pxm1AA==}
     engines: {node: '>=18'}
 
-  '@sentry/core@10.46.0':
-    resolution: {integrity: sha512-N3fj4zqBQOhXliS1Ne9euqIKuciHCGOJfPGQLwBoW9DNz03jF+NB8+dUKtrJ79YLoftjVgf8nbgwtADK7NR+2Q==}
+  '@sentry/core@10.47.0':
+    resolution: {integrity: sha512-nsYRAx3EWezDut+Zl+UwwP07thh9uY7CfSAi2whTdcJl5hu1nSp2z8bba7Vq/MGbNLnazkd3A+GITBEML924JA==}
     engines: {node: '>=18'}
 
-  '@sentry/react@10.46.0':
-    resolution: {integrity: sha512-Rb1S+9OuUPVwsz7GWnQ6Kgf3azbsseUymIegg3JZHNcW/fM1nPpaljzTBnuineia113DH0pgMBcdrrZDLaosFQ==}
+  '@sentry/react@10.47.0':
+    resolution: {integrity: sha512-ZtJV6xxF8jUVE9e3YQUG3Do0XapG1GjniyLyqMPgN6cNvs/HaRJODf7m60By+VGqcl5XArEjEPTvx8CdPUXDfA==}
     engines: {node: '>=18'}
     peerDependencies:
       react: ^16.14.0 || 17.x || 18.x || 19.x
 
-  '@sinclair/typebox@0.34.48':
-    resolution: {integrity: sha512-kKJTNuK3AQOrgjjotVxMrCn1sUJwM76wMszfq1kdU4uYVJjvEWuFQ6HgvLt4Xz3fSmZlTOxJ/Ie13KnIcWQXFA==}
+  '@sinclair/typebox@0.34.49':
+    resolution: {integrity: sha512-brySQQs7Jtn0joV8Xh9ZV/hZb9Ozb0pmazDIASBkYKCjXrXU3mpcFahmK/z4YDhGkQvP9mWJbVyahdtU5wQA+A==}
 
   '@sindresorhus/merge-streams@4.0.0':
     resolution: {integrity: sha512-tlqY9xq5ukxTUZBmoOp+m61cqwQD5pHJtFY3Mn8CA8ps6yghLH/Hw8UPdqg4OLmFW3IFlcXnQNmo/dh8HzXYIQ==}
@@ -1188,11 +1191,11 @@ packages:
   '@standard-schema/spec@1.1.0':
     resolution: {integrity: sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==}
 
-  '@tanstack/query-core@5.95.2':
-    resolution: {integrity: sha512-o4T8vZHZET4Bib3jZ/tCW9/7080urD4c+0/AUaYVpIqOsr7y0reBc1oX3ttNaSW5mYyvZHctiQ/UOP2PfdmFEQ==}
+  '@tanstack/query-core@5.96.2':
+    resolution: {integrity: sha512-hzI6cTVh4KNRk8UtoIBS7Lv9g6BnJPXvBKsvYH1aGWvv0347jT3BnSvztOE+kD76XGvZnRC/t6qdW1CaIfwCeA==}
 
-  '@tanstack/react-query@5.95.2':
-    resolution: {integrity: sha512-/wGkvLj/st5Ud1Q76KF1uFxScV7WeqN1slQx5280ycwAyYkIPGaRZAEgHxe3bjirSd5Zpwkj6zNcR4cqYni/ZA==}
+  '@tanstack/react-query@5.96.2':
+    resolution: {integrity: sha512-sYyzzJT4G0g02azzJ8o55VFFV31XvFpdUpG+unxS0vSaYsJnSPKGoI6WdPwUucJL1wpgGfwfmntNX/Ub1uOViA==}
     peerDependencies:
       react: ^18 || ^19
 
@@ -1275,8 +1278,8 @@ packages:
   '@types/node@20.19.30':
     resolution: {integrity: sha512-WJtwWJu7UdlvzEAUm484QNg5eAoq5QR08KDNx7g45Usrs2NtOPiX8ugDqmKdXkyL03rBqU5dYNYVQetEpBHq2g==}
 
-  '@types/node@22.19.15':
-    resolution: {integrity: sha512-F0R/h2+dsy5wJAUe3tAU6oqa2qbWY5TpNfL/RGmo1y38hiyO1w3x2jPtt76wmuaJI4DQnOBu21cNXQ2STIUUWg==}
+  '@types/node@22.19.17':
+    resolution: {integrity: sha512-wGdMcf+vPYM6jikpS/qhg6WiqSV/OhG+jeeHT/KlVqxYfD40iYJf9/AE1uQxVWFvU7MipKRkRv8NSHiCGgPr8Q==}
 
   '@types/node@24.12.0':
     resolution: {integrity: sha512-GYDxsZi3ChgmckRT9HPU0WEhKLP08ev/Yfcq2AstjrDASOYCSXeyjDsHg4v5t4jOj7cyDX3vmprafKlWIG9MXQ==}
@@ -1313,63 +1316,63 @@ packages:
   '@types/yargs@17.0.35':
     resolution: {integrity: sha512-qUHkeCyQFxMXg79wQfTtfndEC+N9ZZg76HJftDJp+qH2tV7Gj4OJi7l+PiWwJ+pWtW8GwSmqsDj/oymhrTWXjg==}
 
-  '@typescript-eslint/eslint-plugin@8.57.2':
-    resolution: {integrity: sha512-NZZgp0Fm2IkD+La5PR81sd+g+8oS6JwJje+aRWsDocxHkjyRw0J5L5ZTlN3LI1LlOcGL7ph3eaIUmTXMIjLk0w==}
+  '@typescript-eslint/eslint-plugin@8.58.1':
+    resolution: {integrity: sha512-eSkwoemjo76bdXl2MYqtxg51HNwUSkWfODUOQ3PaTLZGh9uIWWFZIjyjaJnex7wXDu+TRx+ATsnSxdN9YWfRTQ==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
-      '@typescript-eslint/parser': ^8.57.2
+      '@typescript-eslint/parser': ^8.58.1
       eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
-      typescript: '>=4.8.4 <6.0.0'
+      typescript: '>=4.8.4 <6.1.0'
 
-  '@typescript-eslint/parser@8.57.2':
-    resolution: {integrity: sha512-30ScMRHIAD33JJQkgfGW1t8CURZtjc2JpTrq5n2HFhOefbAhb7ucc7xJwdWcrEtqUIYJ73Nybpsggii6GtAHjA==}
+  '@typescript-eslint/parser@8.58.1':
+    resolution: {integrity: sha512-gGkiNMPqerb2cJSVcruigx9eHBlLG14fSdPdqMoOcBfh+vvn4iCq2C8MzUB89PrxOXk0y3GZ1yIWb9aOzL93bw==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
-      typescript: '>=4.8.4 <6.0.0'
+      typescript: '>=4.8.4 <6.1.0'
 
-  '@typescript-eslint/project-service@8.57.2':
-    resolution: {integrity: sha512-FuH0wipFywXRTHf+bTTjNyuNQQsQC3qh/dYzaM4I4W0jrCqjCVuUh99+xd9KamUfmCGPvbO8NDngo/vsnNVqgw==}
+  '@typescript-eslint/project-service@8.58.1':
+    resolution: {integrity: sha512-gfQ8fk6cxhtptek+/8ZIqw8YrRW5048Gug8Ts5IYcMLCw18iUgrZAEY/D7s4hkI0FxEfGakKuPK/XUMPzPxi5g==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
-      typescript: '>=4.8.4 <6.0.0'
+      typescript: '>=4.8.4 <6.1.0'
 
-  '@typescript-eslint/scope-manager@8.57.2':
-    resolution: {integrity: sha512-snZKH+W4WbWkrBqj4gUNRIGb/jipDW3qMqVJ4C9rzdFc+wLwruxk+2a5D+uoFcKPAqyqEnSb4l2ULuZf95eSkw==}
+  '@typescript-eslint/scope-manager@8.58.1':
+    resolution: {integrity: sha512-TPYUEqJK6avLcEjumWsIuTpuYODTTDAtoMdt8ZZa93uWMTX13Nb8L5leSje1NluammvU+oI3QRr5lLXPgihX3w==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
-  '@typescript-eslint/tsconfig-utils@8.57.2':
-    resolution: {integrity: sha512-3Lm5DSM+DCowsUOJC+YqHHnKEfFh5CoGkj5Z31NQSNF4l5wdOwqGn99wmwN/LImhfY3KJnmordBq/4+VDe2eKw==}
+  '@typescript-eslint/tsconfig-utils@8.58.1':
+    resolution: {integrity: sha512-JAr2hOIct2Q+qk3G+8YFfqkqi7sC86uNryT+2i5HzMa2MPjw4qNFvtjnw1IiA1rP7QhNKVe21mSSLaSjwA1Olw==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
-      typescript: '>=4.8.4 <6.0.0'
+      typescript: '>=4.8.4 <6.1.0'
 
-  '@typescript-eslint/type-utils@8.57.2':
-    resolution: {integrity: sha512-Co6ZCShm6kIbAM/s+oYVpKFfW7LBc6FXoPXjTRQ449PPNBY8U0KZXuevz5IFuuUj2H9ss40atTaf9dlGLzbWZg==}
+  '@typescript-eslint/type-utils@8.58.1':
+    resolution: {integrity: sha512-HUFxvTJVroT+0rXVJC7eD5zol6ID+Sn5npVPWoFuHGg9Ncq5Q4EYstqR+UOqaNRFXi5TYkpXXkLhoCHe3G0+7w==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
-      typescript: '>=4.8.4 <6.0.0'
+      typescript: '>=4.8.4 <6.1.0'
 
-  '@typescript-eslint/types@8.57.2':
-    resolution: {integrity: sha512-/iZM6FnM4tnx9csuTxspMW4BOSegshwX5oBDznJ7S4WggL7Vczz5d2W11ecc4vRrQMQHXRSxzrCsyG5EsPPTbA==}
+  '@typescript-eslint/types@8.58.1':
+    resolution: {integrity: sha512-io/dV5Aw5ezwzfPBBWLoT+5QfVtP8O7q4Kftjn5azJ88bYyp/ZMCsyW1lpKK46EXJcaYMZ1JtYj+s/7TdzmQMw==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
-  '@typescript-eslint/typescript-estree@8.57.2':
-    resolution: {integrity: sha512-2MKM+I6g8tJxfSmFKOnHv2t8Sk3T6rF20A1Puk0svLK+uVapDZB/4pfAeB7nE83uAZrU6OxW+HmOd5wHVdXwXA==}
+  '@typescript-eslint/typescript-estree@8.58.1':
+    resolution: {integrity: sha512-w4w7WR7GHOjqqPnvAYbazq+Y5oS68b9CzasGtnd6jIeOIeKUzYzupGTB2T4LTPSv4d+WPeccbxuneTFHYgAAWg==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
-      typescript: '>=4.8.4 <6.0.0'
+      typescript: '>=4.8.4 <6.1.0'
 
-  '@typescript-eslint/utils@8.57.2':
-    resolution: {integrity: sha512-krRIbvPK1ju1WBKIefiX+bngPs+odIQUtR7kymzPfo1POVw3jlF+nLkmexdSSd4UCbDcQn+wMBATOOmpBbqgKg==}
+  '@typescript-eslint/utils@8.58.1':
+    resolution: {integrity: sha512-Ln8R0tmWC7pTtLOzgJzYTXSCjJ9rDNHAqTaVONF4FEi2qwce8mD9iSOxOpLFFvWp/wBFlew0mjM1L1ihYWfBdQ==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
-      typescript: '>=4.8.4 <6.0.0'
+      typescript: '>=4.8.4 <6.1.0'
 
-  '@typescript-eslint/visitor-keys@8.57.2':
-    resolution: {integrity: sha512-zhahknjobV2FiD6Ee9iLbS7OV9zi10rG26odsQdfBO/hjSzUQbkIYgda+iNKK1zNiW2ey+Lf8MU5btN17V3dUw==}
+  '@typescript-eslint/visitor-keys@8.58.1':
+    resolution: {integrity: sha512-y+vH7QE8ycjoa0bWciFg7OpFcipUuem1ujhrdLtq1gByKwfbC7bPeKsiny9e0urg93DqwGcHey+bGRKCnF1nZQ==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
   '@vitejs/plugin-react@6.0.1':
@@ -1542,8 +1545,8 @@ packages:
     resolution: {integrity: sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==}
     engines: {node: '>= 0.4'}
 
-  axios@1.13.6:
-    resolution: {integrity: sha512-ChTCHMouEe2kn713WHbQGcuYrr6fXTBiu460OTwWrWob16g1bXn4vtz07Ope7ewMozJAnEquLk5lWQWtBig9DQ==}
+  axios@1.15.0:
+    resolution: {integrity: sha512-wWyJDlAatxk30ZJer+GeCWS209sA42X+N5jU2jy6oHTp7ufw8uzUTVFBX9+wTfAlhiJXGS0Bq7X6efruWjuK9Q==}
 
   balanced-match@1.0.2:
     resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
@@ -1555,8 +1558,8 @@ packages:
   base64-js@1.5.1:
     resolution: {integrity: sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==}
 
-  baseline-browser-mapping@2.10.11:
-    resolution: {integrity: sha512-DAKrHphkJyiGuau/cFieRYhcTFeK/lBuD++C7cZ6KZHbMhBrisoi+EvhQ5RZrIfV5qwsW8kgQ07JIC+MDJRAhg==}
+  baseline-browser-mapping@2.10.16:
+    resolution: {integrity: sha512-Lyf3aK28zpsD1yQMiiHD4RvVb6UdMoo8xzG2XzFIfR9luPzOpcBlAsT/qfB1XWS1bxWT+UtE4WmQgsp297FYOA==}
     engines: {node: '>=6.0.0'}
     hasBin: true
 
@@ -1585,8 +1588,8 @@ packages:
     resolution: {integrity: sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==}
     engines: {node: '>=8'}
 
-  browserslist@4.28.1:
-    resolution: {integrity: sha512-ZC5Bd0LgJXgwGqUknZY/vkUQ04r8NXnJZ3yYi4vDmSiZmC/pdSN0NbNRPxZpbtO4uAfDUAFffO8IZoM3Gj8IkA==}
+  browserslist@4.28.2:
+    resolution: {integrity: sha512-48xSriZYYg+8qXna9kwqjIVzuQxi+KYWp2+5nCYnYKPTr0LvD89Jqk2Or5ogxz0NUMfIjhh2lIUX/LyX9B4oIg==}
     engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
     hasBin: true
 
@@ -1616,8 +1619,8 @@ packages:
     resolution: {integrity: sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==}
     engines: {node: '>=10'}
 
-  caniuse-lite@1.0.30001781:
-    resolution: {integrity: sha512-RdwNCyMsNBftLjW6w01z8bKEvT6e/5tpPVEgtn22TiLGlstHOVecsX2KHFkD5e/vRnIE4EGzpuIODb3mtswtkw==}
+  caniuse-lite@1.0.30001787:
+    resolution: {integrity: sha512-mNcrMN9KeI68u7muanUpEejSLghOKlVhRqS/Za2IeyGllJ9I9otGpR9g3nsw7n4W378TE/LyIteA0+/FOZm4Kg==}
 
   chai@6.2.2:
     resolution: {integrity: sha512-NUPRluOfOiTKBKvWPtSD4PhFvWCqOi0BGStNWs57X9js7XGTprSmFoz5F0tWhR4WPjNeR9jXqdC7/UpSJTnlRg==}
@@ -1819,8 +1822,8 @@ packages:
   eastasianwidth@0.2.0:
     resolution: {integrity: sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==}
 
-  electron-to-chromium@1.5.328:
-    resolution: {integrity: sha512-QNQ5l45DzYytThO21403XN3FvK0hOkWDG8viNf6jqS42msJ8I4tGDSpBCgvDRRPnkffafiwAym2X2eHeGD2V0w==}
+  electron-to-chromium@1.5.334:
+    resolution: {integrity: sha512-mgjZAz7Jyx1SRCwEpy9wefDS7GvNPazLthHg8eQMJ76wBdGQQDW33TCrUTvQ4wzpmOrv2zrFoD3oNufMdyMpog==}
 
   emoji-regex@8.0.0:
     resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
@@ -1843,8 +1846,8 @@ packages:
   error-ex@1.3.4:
     resolution: {integrity: sha512-sqQamAnR14VgCr1A618A3sGrygcpK+HEbenA/HiEAkkUwcZIIB/tgWqHFxWgOyDh4nB4JCRimh79dR5Ywc9MDQ==}
 
-  es-abstract@1.24.1:
-    resolution: {integrity: sha512-zHXBLhP+QehSSbsS9Pt23Gg964240DPd6QCf8WpkqEXxQ7fhdZzYsocOr5u7apWonsS5EjZDmTF+/slGMyasvw==}
+  es-abstract@1.24.2:
+    resolution: {integrity: sha512-2FpH9Q5i2RRwyEP1AylXe6nYLR5OhaJTZwmlcP0dL/+JCbgg7yyEo/sEK6HeGZRf3dFpWwThaRHVApXSkW3xeg==}
     engines: {node: '>= 0.4'}
 
   es-define-property@1.0.1:
@@ -1878,8 +1881,8 @@ packages:
     resolution: {integrity: sha512-w+5mJ3GuFL+NjVtJlvydShqE1eN3h3PbI7/5LAsYJP/2qtuMXjfL2LpHSRqo4b4eSF5K/DH1JXKUAHSB2UW50g==}
     engines: {node: '>= 0.4'}
 
-  esbuild@0.27.4:
-    resolution: {integrity: sha512-Rq4vbHnYkK5fws5NF7MYTU68FPRE1ajX7heQ/8QXXWqNgqqJ/GkmmyxIzUnf2Sr/bakf8l54716CcMGHYhMrrQ==}
+  esbuild@0.27.7:
+    resolution: {integrity: sha512-IxpibTjyVnmrIQo5aqNpCgoACA/dTKLTlhMHihVHhdkxKyPO1uBBthumT0rdHmcsk9uMonIWS0m4FljWzILh3w==}
     engines: {node: '>=18'}
     hasBin: true
 
@@ -2226,8 +2229,8 @@ packages:
   hookified@1.15.1:
     resolution: {integrity: sha512-MvG/clsADq1GPM2KGo2nyfaWVyn9naPiXrqIe4jYjXNZQt238kWyOGrsyc/DmRAQ+Re6yeo6yX/yoNCG5KAEVg==}
 
-  hookified@2.1.0:
-    resolution: {integrity: sha512-ootKng4eaxNxa7rx6FJv2YKef3DuhqbEj3l70oGXwddPQEEnISm50TEZQclqiLTAtilT2nu7TErtCO523hHkyg==}
+  hookified@2.1.1:
+    resolution: {integrity: sha512-AHb76R16GB5EsPBE2J7Ko5kiEyXwviB9P5SMrAKcuAu4vJPZttViAbj9+tZeaQE5zjDme+1vcHP78Yj/WoAveA==}
 
   html-encoding-sniffer@4.0.0:
     resolution: {integrity: sha512-Y22oTqIU4uuPgEemfz7NDJz6OeKf12Lsu+QC+s3BVpda64lTiMYCyGwg5ki4vFxkMwQdeZDl2adZoqUgdFuTgQ==}
@@ -2538,8 +2541,8 @@ packages:
       canvas:
         optional: true
 
-  jsdom@29.0.1:
-    resolution: {integrity: sha512-z6JOK5gRO7aMybVq/y/MlIpKh8JIi68FBKMUtKkK2KH/wMSRlCxQ682d08LB9fYXplyY/UXG8P4XXTScmdjApg==}
+  jsdom@29.0.2:
+    resolution: {integrity: sha512-9VnGEBosc/ZpwyOsJBCQ/3I5p7Q5ngOY14a9bf5btenAORmZfDse1ZEheMiWcJ3h81+Fv7HmJFdS0szo/waF2w==}
     engines: {node: ^20.19.0 || ^22.13.0 || >=24.0.0}
     peerDependencies:
       canvas: ^3.0.0
@@ -2681,8 +2684,8 @@ packages:
     resolution: {integrity: sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==}
     engines: {node: '>=10'}
 
-  lodash-es@4.17.23:
-    resolution: {integrity: sha512-kVI48u3PZr38HdYz98UmfPnXl2DXrpdctLrFLCd3kOx1xUkOmpFPx7gCWWM5MPkL/fD8zb+Ph0QzjGFs4+hHWg==}
+  lodash-es@4.18.1:
+    resolution: {integrity: sha512-J8xewKD/Gk22OZbhpOVSwcs60zhd95ESDwezOFuA3/099925PdHJ7OFHNTGtajL3AlZkykD32HykiMo+BIBI8A==}
 
   lodash.debounce@4.0.8:
     resolution: {integrity: sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==}
@@ -2696,8 +2699,8 @@ packages:
   lodash.truncate@4.4.2:
     resolution: {integrity: sha512-jttmRe7bRse52OsWIMDLaXxWqRAmtIUccAQ3garviCqJjafXOfNMO0yMfNpdD6zbGaTU0P5Nz7e7gAT6cKmJRw==}
 
-  lodash@4.17.23:
-    resolution: {integrity: sha512-LgVTMpQtIopCi79SJeDiP0TfWi5CNEc/L/aRdTh3yIvmZXTnheWpKjSZhnvMl8iXbC1tFg9gdHHDMLoV7CnG+w==}
+  lodash@4.18.1:
+    resolution: {integrity: sha512-dMInicTPVE8d1e5otfwmmjlxkZoUpiVLwyeTdUsi/Caj/gfzzblBcCE5sRHV/AsjuCmxWrte2TNGSYuCeCq+0Q==}
 
   loose-envify@1.4.0:
     resolution: {integrity: sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==}
@@ -2706,8 +2709,8 @@ packages:
   lru-cache@10.4.3:
     resolution: {integrity: sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==}
 
-  lru-cache@11.2.7:
-    resolution: {integrity: sha512-aY/R+aEsRelme17KGQa/1ZSIpLpNYYrhcrepKTZgE+W3WM16YMCaPwOHLHsmopZHELU0Ojin1lPVxKR0MihncA==}
+  lru-cache@11.3.3:
+    resolution: {integrity: sha512-JvNw9Y81y33E+BEYPr0U7omo+U9AySnsMsEiXgwT6yqd31VQWTLNQqmT4ou5eqPFUrTfIDFta2wKhB1hyohtAQ==}
     engines: {node: 20 || >=22}
 
   lru-cache@5.1.1:
@@ -2766,8 +2769,8 @@ packages:
     resolution: {integrity: sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==}
     engines: {node: '>=4'}
 
-  minimatch@10.2.4:
-    resolution: {integrity: sha512-oRjTw/97aTBN0RHbYCdtF1MQfvusSIBQM0IZEgzl6426+8jSC0nF1a/GmnVLpfB9yyr6g6FTqWqiZVbxrtaCIg==}
+  minimatch@10.2.5:
+    resolution: {integrity: sha512-MULkVLfKGYDFYejP07QOurDLLQpcjk7Fw+7jXS2R2czRQzR56yHRveU5NDJEOviH+hETZKSkIk5c+T23GjFUMg==}
     engines: {node: 18 || 20 || >=22}
 
   minimatch@3.1.5:
@@ -2828,8 +2831,8 @@ packages:
     resolution: {integrity: sha512-pyFS63ptit/P5WqUkt+UUfe+4oevH+bFeIiPPdfb0pFeYEu/1ELnJu5l+5EcTKYL5M7zaAa7S8ddywgXypqKCw==}
     engines: {node: '>= 0.4'}
 
-  node-releases@2.0.36:
-    resolution: {integrity: sha512-TdC8FSgHz8Mwtw9g5L4gR/Sh9XhSP/0DEkQxfEFXOpiul5IiHgHan2VhYYb6agDSfp4KuvltmGApc8HMgUrIkA==}
+  node-releases@2.0.37:
+    resolution: {integrity: sha512-1h5gKZCF+pO/o3Iqt5Jp7wc9rH3eJJ0+nh/CIoiRwjRxde/hAHyLPXYN4V3CqKAbiZPSeJFSWHmJsbkicta0Eg==}
 
   normalize-path@3.0.0:
     resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
@@ -2949,8 +2952,8 @@ packages:
   path-to-regexp@6.3.0:
     resolution: {integrity: sha512-Yhpw4T9C6hPpgPeA28us07OJeqZ5EzQTkbfwuhsUg0c237RomFoETJgmp2sa3F/41gfLE6G5cqcYwznmeEeOlQ==}
 
-  path-to-regexp@8.4.0:
-    resolution: {integrity: sha512-PuseHIvAnz3bjrM2rGJtSgo1zjgxapTLZ7x2pjhzWwlp4SJQgK3f3iZIQwkpEnBaKz6seKBADpM4B4ySkuYypg==}
+  path-to-regexp@8.4.2:
+    resolution: {integrity: sha512-qRcuIdP69NPm4qbACK+aDogI5CBDMi1jKe0ry5rSQJz8JVLsC7jV8XpiJjGRLLol3N+R5ihGYcrPLTno6pAdBA==}
 
   path-type@4.0.0:
     resolution: {integrity: sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==}
@@ -2974,13 +2977,13 @@ packages:
     resolution: {integrity: sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==}
     engines: {node: '>=6'}
 
-  playwright-core@1.58.2:
-    resolution: {integrity: sha512-yZkEtftgwS8CsfYo7nm0KE8jsvm6i/PTgVtB8DL726wNf6H2IMsDuxCpJj59KDaxCtSnrWan2AeDqM7JBaultg==}
+  playwright-core@1.59.1:
+    resolution: {integrity: sha512-HBV/RJg81z5BiiZ9yPzIiClYV/QMsDCKUyogwH9p3MCP6IYjUFu/MActgYAvK0oWyV9NlwM3GLBjADyWgydVyg==}
     engines: {node: '>=18'}
     hasBin: true
 
-  playwright@1.58.2:
-    resolution: {integrity: sha512-vA30H8Nvkq/cPBnNw4Q8TWz1EJyqgpuinBcHET0YVJVFldr8JDNiU9LaWAE1KqSkRYazuaBhTpB5ZzShOezQ6A==}
+  playwright@1.59.1:
+    resolution: {integrity: sha512-C8oWjPR3F81yljW9o5OxcWzfh6avkVwDD2VYdwIGqTkl+OGFISgypqzfu7dOe4QNLL2aqcWBmI3PMtLIK233lw==}
     engines: {node: '>=18'}
     hasBin: true
 
@@ -3042,8 +3045,8 @@ packages:
   postcss-value-parser@4.2.0:
     resolution: {integrity: sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==}
 
-  postcss@8.5.8:
-    resolution: {integrity: sha512-OW/rX8O/jXnm82Ey1k44pObPtdblfiuWnrd8X7GJ7emImCOstunGbXUpp7HdBrFQX6rJzn3sPT397Wp5aCwCHg==}
+  postcss@8.5.9:
+    resolution: {integrity: sha512-7a70Nsot+EMX9fFU3064K/kdHWZqGVY+BADLyXc8Dfv+mTLLVl6JzJpPaCZ2kQL9gIJvKXSLMHhqdRRjwQeFtw==}
     engines: {node: ^10 || ^12 || >=14}
 
   prelude-ls@1.2.1:
@@ -3078,8 +3081,9 @@ packages:
   property-expr@2.0.6:
     resolution: {integrity: sha512-SVtmxhRE/CGkn3eZY1T6pC8Nln6Fr/lu1mKSgRud0eC73whjGfoAogbn78LkD8aFL0zz3bAFerKSnOl7NlErBA==}
 
-  proxy-from-env@1.1.0:
-    resolution: {integrity: sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==}
+  proxy-from-env@2.1.0:
+    resolution: {integrity: sha512-cJ+oHTW1VAEa8cJslgmUZrc+sjRKgAKl3Zyse6+PV38hZe/V6Z14TbCuXcan9F9ghlz4QrFr2c92TNF82UkYHA==}
+    engines: {node: '>=10'}
 
   psl@1.15.0:
     resolution: {integrity: sha512-JZd3gMVBAVQkSs6HdNZo9Sdo0LNcQeMNP3CozBJb3JYC/QUYZTnKxP+f8oWRX4rHP5EurWxqAHTSwUCjlNKa1w==}
@@ -3088,8 +3092,8 @@ packages:
     resolution: {integrity: sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==}
     engines: {node: '>=6'}
 
-  qified@0.9.0:
-    resolution: {integrity: sha512-4q61YgkHbY6gmwkqm0BsxyLDO3UYdrdiJTJ7JiaZb3xpW1duxn135SB7KqUEkCiuu5O4W+TtwEWP2VjmSRanvA==}
+  qified@0.9.1:
+    resolution: {integrity: sha512-n7mar4T0xQ+39dE2vGTAlbxUEpndwPANH0kDef1/MYsB8Bba9wshkybIRx74qgcvKQPEWErf9AqAdYjhzY2Ilg==}
     engines: {node: '>=20'}
 
   quansync@0.2.11:
@@ -3124,8 +3128,8 @@ packages:
   react-is@18.3.1:
     resolution: {integrity: sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==}
 
-  react-router@7.13.2:
-    resolution: {integrity: sha512-tX1Aee+ArlKQP+NIUd7SE6Li+CiGKwQtbS+FfRxPX6Pe4vHOo6nr9d++u5cwg+Z8K/x8tP+7qLmujDtfrAoUJA==}
+  react-router@7.14.0:
+    resolution: {integrity: sha512-m/xR9N4LQLmAS0ZhkY2nkPA1N7gQ5TUVa5n8TgANuDTARbn1gt+zLPXEm7W0XDTbrQ2AJSJKhoa6yx1D8BcpxQ==}
     engines: {node: '>=20.0.0'}
     peerDependencies:
       react: '>=18'
@@ -3195,13 +3199,13 @@ packages:
     resolution: {integrity: sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==}
     engines: {iojs: '>=1.0.0', node: '>=0.10.0'}
 
-  rolldown@1.0.0-rc.12:
-    resolution: {integrity: sha512-yP4USLIMYrwpPHEFB5JGH1uxhcslv6/hL0OyvTuY+3qlOSJvZ7ntYnoWpehBxufkgN0cvXxppuTu5hHa/zPh+A==}
+  rolldown@1.0.0-rc.13:
+    resolution: {integrity: sha512-bvVj8YJmf0rq4pSFmH7laLa6pYrhghv3PRzrCdRAr23g66zOKVJ4wkvFtgohtPLWmthgg8/rkaqRHrpUEh0Zbw==}
     engines: {node: ^20.19.0 || >=22.12.0}
     hasBin: true
 
-  rollup@4.60.0:
-    resolution: {integrity: sha512-yqjxruMGBQJ2gG4HtjZtAfXArHomazDHoFwFFmZZl0r7Pdo7qCIXKqKHZc8yeoMgzJJ+pO6pEEHa+V7uzWlrAQ==}
+  rollup@4.60.1:
+    resolution: {integrity: sha512-VmtB2rFU/GroZ4oL8+ZqXgSA38O6GR8KSIvWmEFv63pQ0G6KaBH9s07PO8XTXP4vI+3UJUEypOfjkGfmSBBR0w==}
     engines: {node: '>=18.0.0', npm: '>=8.0.0'}
     hasBin: true
 
@@ -3229,125 +3233,125 @@ packages:
   safer-buffer@2.1.2:
     resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==}
 
-  sass-embedded-all-unknown@1.98.0:
-    resolution: {integrity: sha512-6n4RyK7/1mhdfYvpP3CClS3fGoYqDvRmLClCESS6I7+SAzqjxvGG6u5Fo+cb1nrPNbbilgbM4QKdgcgWHO9NCA==}
+  sass-embedded-all-unknown@1.99.0:
+    resolution: {integrity: sha512-qPIRG8Uhjo6/OKyAKixTnwMliTz+t9K6Duk0mx5z+K7n0Ts38NSJz2sjDnc7cA/8V9Lb3q09H38dZ1CLwD+ssw==}
     cpu: ['!arm', '!arm64', '!riscv64', '!x64']
 
-  sass-embedded-android-arm64@1.98.0:
-    resolution: {integrity: sha512-M9Ra98A6vYJHpwhoC/5EuH1eOshQ9ZyNwC8XifUDSbRl/cGeQceT1NReR9wFj3L7s1pIbmes1vMmaY2np0uAKQ==}
+  sass-embedded-android-arm64@1.99.0:
+    resolution: {integrity: sha512-fNHhdnP23yqqieCbAdym4N47AleSwjbNt6OYIYx4DdACGdtERjQB4iOX/TaKsW034MupfF7SjnAAK8w7Ptldtg==}
     engines: {node: '>=14.0.0'}
     cpu: [arm64]
     os: [android]
 
-  sass-embedded-android-arm@1.98.0:
-    resolution: {integrity: sha512-LjGiMhHgu7VL1n7EJxTCre1x14bUsWd9d3dnkS2rku003IWOI/fxc7OXgaKagoVzok1kv09rzO3vFXJR5ZeONQ==}
+  sass-embedded-android-arm@1.99.0:
+    resolution: {integrity: sha512-EHvJ0C7/VuP78Qr6f8gIUVUmCqIorEQpw2yp3cs3SMg02ZuumlhjXvkTcFBxHmFdFR23vTNk1WnhY6QSeV1nFQ==}
     engines: {node: '>=14.0.0'}
     cpu: [arm]
     os: [android]
 
-  sass-embedded-android-riscv64@1.98.0:
-    resolution: {integrity: sha512-WPe+0NbaJIZE1fq/RfCZANMeIgmy83x4f+SvFOG7LhUthHpZWcOcrPTsCKKmN3xMT3iw+4DXvqTYOCYGRL3hcQ==}
+  sass-embedded-android-riscv64@1.99.0:
+    resolution: {integrity: sha512-4zqDFRvgGDTL5vTHuIhRxUpXFoh0Cy7Gm5Ywk19ASd8Settmd14YdPRZPmMxfgS1GH292PofV1fq1ifiSEJWBw==}
     engines: {node: '>=14.0.0'}
     cpu: [riscv64]
     os: [android]
 
-  sass-embedded-android-x64@1.98.0:
-    resolution: {integrity: sha512-zrD25dT7OHPEgLWuPEByybnIfx4rnCtfge4clBgjZdZ3lF6E7qNLRBtSBmoFflh6Vg0RlEjJo5VlpnTMBM5MQQ==}
+  sass-embedded-android-x64@1.99.0:
+    resolution: {integrity: sha512-Uk53k/dGYt04RjOL4gFjZ0Z9DH9DKh8IA8WsXUkNqsxerAygoy3zqRBS2zngfE9K2jiOM87q+1R1p87ory9oQQ==}
     engines: {node: '>=14.0.0'}
     cpu: [x64]
     os: [android]
 
-  sass-embedded-darwin-arm64@1.98.0:
-    resolution: {integrity: sha512-cgr1z9rBnCdMf8K+JabIaYd9Rag2OJi5mjq08XJfbJGMZV/TA6hFJCLGkr5/+ZOn4/geTM5/3aSfQ8z5EIJAOg==}
+  sass-embedded-darwin-arm64@1.99.0:
+    resolution: {integrity: sha512-u61/7U3IGLqoO6gL+AHeiAtlTPFwJK1+964U8gp45ZN0hzh1yrARf5O1mivXv8NnNgJvbG2wWJbiNZP0lG/lTg==}
     engines: {node: '>=14.0.0'}
     cpu: [arm64]
     os: [darwin]
 
-  sass-embedded-darwin-x64@1.98.0:
-    resolution: {integrity: sha512-OLBOCs/NPeiMqTdOrMFbVHBQFj19GS3bSVSxIhcCq16ZyhouUkYJEZjxQgzv9SWA2q6Ki8GCqp4k6jMeUY9dcA==}
+  sass-embedded-darwin-x64@1.99.0:
+    resolution: {integrity: sha512-j/kkk/NcXdIameLezSfXjgCiBkVcA+G60AXrX768/3g0miK1g7M9dj7xOhCb1i7/wQeiEI3rw2LLuO63xRIn4A==}
     engines: {node: '>=14.0.0'}
     cpu: [x64]
     os: [darwin]
 
-  sass-embedded-linux-arm64@1.98.0:
-    resolution: {integrity: sha512-axOE3t2MTBwCtkUCbrdM++Gj0gC0fdHJPrgzQ+q1WUmY9NoNMGqflBtk5mBZaWUeha2qYO3FawxCB8lctFwCtw==}
+  sass-embedded-linux-arm64@1.99.0:
+    resolution: {integrity: sha512-btNcFpItcB56L40n8hDeL7sRSMLDXQ56nB5h2deddJx1n60rpKSElJmkaDGHtpkrY+CTtDRV0FZDjHeTJddYew==}
     engines: {node: '>=14.0.0'}
     cpu: [arm64]
     os: [linux]
     libc: glibc
 
-  sass-embedded-linux-arm@1.98.0:
-    resolution: {integrity: sha512-03baQZCxVyEp8v1NWBRlzGYrmVT/LK7ZrHlF1piscGiGxwfdxoLXVuxsylx3qn/dD/4i/rh7Bzk7reK1br9jvQ==}
+  sass-embedded-linux-arm@1.99.0:
+    resolution: {integrity: sha512-d4IjJZrX2+AwB2YCy1JySwdptJECNP/WfAQLUl8txI3ka8/d3TUI155GtelnoZUkio211PwIeFvvAeZ9RXPQnw==}
     engines: {node: '>=14.0.0'}
     cpu: [arm]
     os: [linux]
     libc: glibc
 
-  sass-embedded-linux-musl-arm64@1.98.0:
-    resolution: {integrity: sha512-LeqNxQA8y4opjhe68CcFvMzCSrBuJqYVFbwElEj9bagHXQHTp9xVPJRn6VcrC+0VLEDq13HVXMv7RslIuU0zmA==}
+  sass-embedded-linux-musl-arm64@1.99.0:
+    resolution: {integrity: sha512-Hi2bt/IrM5P4FBKz6EcHAlniwfpoz9mnTdvSd58y+avA3SANM76upIkAdSayA8ZGwyL3gZokru1AKDPF9lJDNw==}
     engines: {node: '>=14.0.0'}
     cpu: [arm64]
     os: [linux]
     libc: musl
 
-  sass-embedded-linux-musl-arm@1.98.0:
-    resolution: {integrity: sha512-OBkjTDPYR4hSaueOGIM6FDpl9nt/VZwbSRpbNu9/eEJcxE8G/vynRugW8KRZmCFjPy8j/jkGBvvS+k9iOqKV3g==}
+  sass-embedded-linux-musl-arm@1.99.0:
+    resolution: {integrity: sha512-2gvHOupgIw3ytatXT4nFUow71LFbuOZPEwG+HUzcNQDH8ue4Ez8cr03vsv5MDv3lIjOKcXwDvWD980t18MwkoQ==}
     engines: {node: '>=14.0.0'}
     cpu: [arm]
     os: [linux]
     libc: musl
 
-  sass-embedded-linux-musl-riscv64@1.98.0:
-    resolution: {integrity: sha512-7w6hSuOHKt8FZsmjRb3iGSxEzM87fO9+M8nt5JIQYMhHTj5C+JY/vcske0v715HCVj5e1xyTnbGXf8FcASeAIw==}
+  sass-embedded-linux-musl-riscv64@1.99.0:
+    resolution: {integrity: sha512-mKqGvVaJ9rHMqyZsF0kikQe4NO0f4osb67+X6nLhBiVDKvyazQHJ3zJQreNefIE36yL2sjHIclSB//MprzaQDg==}
     engines: {node: '>=14.0.0'}
     cpu: [riscv64]
     os: [linux]
     libc: musl
 
-  sass-embedded-linux-musl-x64@1.98.0:
-    resolution: {integrity: sha512-QikNyDEJOVqPmxyCFkci8ZdCwEssdItfjQFJB+D+Uy5HFqcS5Lv3d3GxWNX/h1dSb23RPyQdQc267ok5SbEyJw==}
+  sass-embedded-linux-musl-x64@1.99.0:
+    resolution: {integrity: sha512-huhgOMmOc30r7CH7qbRbT9LerSEGSnWuS4CYNOskr9BvNeQp4dIneFufNRGZ7hkOAxUM8DglxIZJN/cyAT95Ew==}
     engines: {node: '>=14.0.0'}
     cpu: [x64]
     os: [linux]
     libc: musl
 
-  sass-embedded-linux-riscv64@1.98.0:
-    resolution: {integrity: sha512-E7fNytc/v4xFBQKzgzBddV/jretA4ULAPO6XmtBiQu4zZBdBozuSxsQLe2+XXeb0X4S2GIl72V7IPABdqke/vA==}
+  sass-embedded-linux-riscv64@1.99.0:
+    resolution: {integrity: sha512-mevFPIFAVhrH90THifxLfOntFmHtcEKOcdWnep2gJ0X4DVva4AiVIRlQe/7w9JFx5+gnDRE1oaJJkzuFUuYZsA==}
     engines: {node: '>=14.0.0'}
     cpu: [riscv64]
     os: [linux]
     libc: glibc
 
-  sass-embedded-linux-x64@1.98.0:
-    resolution: {integrity: sha512-VsvP0t/uw00mMNPv3vwyYKUrFbqzxQHnRMO+bHdAMjvLw4NFf6mscpym9Bzf+NXwi1ZNKnB6DtXjmcpcvqFqYg==}
+  sass-embedded-linux-x64@1.99.0:
+    resolution: {integrity: sha512-9k7IkULqIZdCIVt4Mboryt6vN8Mjmm3EhI1P3mClU5y5i3wLK5ExC3cbVWk047KsID/fvB1RLslqghXJx5BoxA==}
     engines: {node: '>=14.0.0'}
     cpu: [x64]
     os: [linux]
     libc: glibc
 
-  sass-embedded-unknown-all@1.98.0:
-    resolution: {integrity: sha512-C4MMzcAo3oEDQnW7L8SBgB9F2Fq5qHPnaYTZRMOH3Mp/7kM4OooBInXpCiiFjLnjY95hzP4KyctVx0uYR6MYlQ==}
+  sass-embedded-unknown-all@1.99.0:
+    resolution: {integrity: sha512-P7MxiUtL/XzGo3PX0CaB8lNNEFLQWKikPA8pbKytx9ZCLZSDkt2NJcdAbblB/sqMs4AV3EK2NadV8rI/diq3xg==}
     os: ['!android', '!darwin', '!linux', '!win32']
 
-  sass-embedded-win32-arm64@1.98.0:
-    resolution: {integrity: sha512-nP/10xbAiPbhQkMr3zQfXE4TuOxPzWRQe1Hgbi90jv2R4TbzbqQTuZVOaJf7KOAN4L2Bo6XCTRjK5XkVnwZuwQ==}
+  sass-embedded-win32-arm64@1.99.0:
+    resolution: {integrity: sha512-8whpsW7S+uO8QApKfQuc36m3P9EISzbVZOgC79goob4qGy09u8Gz/rYvw8h1prJDSjltpHGhOzBE6LDz7WvzVw==}
     engines: {node: '>=14.0.0'}
     cpu: [arm64]
     os: [win32]
 
-  sass-embedded-win32-x64@1.98.0:
-    resolution: {integrity: sha512-/lbrVsfbcbdZQ5SJCWcV0NVPd6YRs+FtAnfedp4WbCkO/ZO7Zt/58MvI4X2BVpRY/Nt5ZBo1/7v2gYcQ+J4svQ==}
+  sass-embedded-win32-x64@1.99.0:
+    resolution: {integrity: sha512-ipuOv1R2K4MHeuCEAZGpuUbAgma4gb0sdacyrTjJtMOy/OY9UvWfVlwErdB09KIkp4fPDpQJDJfvYN6bC8jeNg==}
     engines: {node: '>=14.0.0'}
     cpu: [x64]
     os: [win32]
 
-  sass-embedded@1.98.0:
-    resolution: {integrity: sha512-Do7u6iRb6K+lrllcTkB1BXcHwOxcKe3rEfOF/GcCLE2w3WpddakRAosJOHFUR37DpsvimQXEt5abs3NzUjEIqg==}
+  sass-embedded@1.99.0:
+    resolution: {integrity: sha512-gF/juR1aX02lZHkvwxdF80SapkQeg2fetoDF6gIQkNbSw5YEUFspMkyGTjPjgZSgIHuZpy+Wz4PlebKnLXMjdg==}
     engines: {node: '>=16.0.0'}
     hasBin: true
 
-  sass@1.98.0:
-    resolution: {integrity: sha512-+4N/u9dZ4PrgzGgPlKnaaRQx64RO0JBKs9sDhQ2pLgN6JQZ25uPQZKQYaBJU48Kd5BxgXoJ4e09Dq7nMcOUW3A==}
+  sass@1.99.0:
+    resolution: {integrity: sha512-kgW13M54DUB7IsIRM5LvJkNlpH+WhMpooUcaWGFARkF1Tc82v9mIWkCbCYf+MBvpIUBSeSOTilpZjEPr2VYE6Q==}
     engines: {node: '>=14.0.0'}
     hasBin: true
 
@@ -3390,8 +3394,8 @@ packages:
     resolution: {integrity: sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==}
     engines: {node: '>=8'}
 
-  side-channel-list@1.0.0:
-    resolution: {integrity: sha512-FCLHtRD/gnpCiCHEiJLOwdmFP+wzCmDEkc9y7NsYxeF4u7Btsn1ZuwgwJGxImImHicJArLP4R0yX4c2KCrMrTA==}
+  side-channel-list@1.0.1:
+    resolution: {integrity: sha512-mjn/0bi/oUURjc5Xl7IaWi/OJJJumuoJFQJfDDyO46+hBWsfaVM65TBHq2eoZBhzl9EchxOijpkbRC8SVBQU0w==}
     engines: {node: '>= 0.4'}
 
   side-channel-map@1.0.1:
@@ -3510,8 +3514,8 @@ packages:
     resolution: {integrity: sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==}
     engines: {node: '>=8'}
 
-  stylelint-config-recommended-scss@17.0.0:
-    resolution: {integrity: sha512-VkVD9r7jfUT/dq3mA3/I1WXXk2U71rO5wvU2yIil9PW5o1g3UM7Xc82vHmuVJHV7Y8ok5K137fmW5u3HbhtTOA==}
+  stylelint-config-recommended-scss@17.0.1:
+    resolution: {integrity: sha512-x5DVehzJudcwF0od3sGpgkln2PLLranFE7twwbp7dqDINCyZvwzFkMc6TLhNOvazRiVBJYATQLouJY0xPGB8WA==}
     engines: {node: '>=20'}
     peerDependencies:
       postcss: ^8.3.3
@@ -3610,12 +3614,12 @@ packages:
   tinybench@2.9.0:
     resolution: {integrity: sha512-0+DUvqWMValLmha6lr4kD8iAMK1HzV0/aKnCtWb9v9641TnP/MFb7Pc2bxoxQjTXAErryXVgUOfv2YqNllqGeg==}
 
-  tinyexec@1.0.4:
-    resolution: {integrity: sha512-u9r3uZC0bdpGOXtlxUIdwf9pkmvhqJdrVCH9fapQtgy/OeTTMZ1nqH7agtvEfmGui6e1XxjcdrlxvxJvc3sMqw==}
+  tinyexec@1.1.1:
+    resolution: {integrity: sha512-VKS/ZaQhhkKFMANmAOhhXVoIfBXblQxGX1myCQ2faQrfmobMftXeJPcZGp0gS07ocvGJWDLZGyOZDadDBqYIJg==}
     engines: {node: '>=18'}
 
-  tinyglobby@0.2.15:
-    resolution: {integrity: sha512-j2Zq4NyQYG5XMST4cbs02Ak8iJUdxRM0XI5QyxXuZOzKOINmWurp3smXu3y5wDcJrptwpSjgXHzIQxR0omXljQ==}
+  tinyglobby@0.2.16:
+    resolution: {integrity: sha512-pn99VhoACYR8nFHhxqix+uvsbXineAasWm5ojXoN8xEwK5Kd3/TrhNn1wByuD52UxWRLy8pu+kRMniEi6Eq9Zg==}
     engines: {node: '>=12.0.0'}
 
   tinyrainbow@3.1.0:
@@ -3625,15 +3629,15 @@ packages:
   tldts-core@6.1.86:
     resolution: {integrity: sha512-Je6p7pkk+KMzMv2XXKmAE3McmolOQFdxkKw0R8EYNr7sELW46JqnNeTX8ybPiQgvg1ymCoF8LXs5fzFaZvJPTA==}
 
-  tldts-core@7.0.27:
-    resolution: {integrity: sha512-YQ7uPjgWUibIK6DW5lrKujGwUKhLevU4hcGbP5O6TcIUb+oTjJYJVWPS4nZsIHrEEEG6myk/oqAJUEQmpZrHsg==}
+  tldts-core@7.0.28:
+    resolution: {integrity: sha512-7W5Efjhsc3chVdFhqtaU0KtK32J37Zcr9RKtID54nG+tIpcY79CQK/veYPODxtD/LJ4Lue66jvrQzIX2Z2/pUQ==}
 
   tldts@6.1.86:
     resolution: {integrity: sha512-WMi/OQ2axVTf/ykqCQgXiIct+mSQDFdH2fkwhPwgEwvJ1kSzZRiinb0zF2Xb8u4+OqPChmyI6MEu4EezNJz+FQ==}
     hasBin: true
 
-  tldts@7.0.27:
-    resolution: {integrity: sha512-I4FZcVFcqCRuT0ph6dCDpPuO4Xgzvh+spkcTr1gK7peIvxWauoloVO0vuy1FQnijT63ss6AsHB6+OIM4aXHbPg==}
+  tldts@7.0.28:
+    resolution: {integrity: sha512-+Zg3vWhRUv8B1maGSTFdev9mjoo8Etn2Ayfs4cnjlD3CsGkxXX4QyW3j2WJ0wdjYcYmy7Lx2RDsZMhgCWafKIw==}
     hasBin: true
 
   to-regex-range@5.0.1:
@@ -3713,12 +3717,12 @@ packages:
     engines: {node: '>=18.0.0'}
     hasBin: true
 
-  typescript-eslint@8.57.2:
-    resolution: {integrity: sha512-VEPQ0iPgWO/sBaZOU1xo4nuNdODVOajPnTIbog2GKYr31nIlZ0fWPoCQgGfF3ETyBl1vn63F/p50Um9Z4J8O8A==}
+  typescript-eslint@8.58.1:
+    resolution: {integrity: sha512-gf6/oHChByg9HJvhMO1iBexJh12AqqTfnuxscMDOVqfJW3htsdRJI/GfPpHTTcyeB8cSTUY2JcZmVgoyPqcrDg==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
       eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
-      typescript: '>=4.8.4 <6.0.0'
+      typescript: '>=4.8.4 <6.1.0'
 
   typescript@5.9.3:
     resolution: {integrity: sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==}
@@ -3735,8 +3739,8 @@ packages:
   undici-types@7.16.0:
     resolution: {integrity: sha512-Zz+aZWSj8LE6zoxD+xrjh4VfkIG8Ya6LvYkZqtUQGJPZjYl53ypCaUwWqo7eI0x66KBGeRo+mlBEkMSeSZ38Nw==}
 
-  undici@7.24.6:
-    resolution: {integrity: sha512-Xi4agocCbRzt0yYMZGMA6ApD7gvtUFaxm4ZmeacWI4cZxaF6C+8I8QfofC20NAePiB/IcvZmzkJ7XPa471AEtA==}
+  undici@7.24.7:
+    resolution: {integrity: sha512-H/nlJ/h0ggGC+uRL3ovD+G0i4bqhvsDOpbDv7At5eFLlj2b41L8QliGbnl2H7SnDiYhENphh1tQFJZf+MyfLsQ==}
     engines: {node: '>=20.18.1'}
 
   unicorn-magic@0.4.0:
@@ -3780,8 +3784,8 @@ packages:
   varint@6.0.0:
     resolution: {integrity: sha512-cXEIW6cfr15lFv563k4GuVuW/fiwjknytD37jIOLSdSWuOI6WnO/oKwmP2FQTU2l01LP8/M5TSAJpzUaGe3uWg==}
 
-  vite@7.3.1:
-    resolution: {integrity: sha512-w+N7Hifpc3gRjZ63vYBXA56dvvRlNWRczTdmCBBa+CotUzAPf5b7YMdMR/8CQoeYE5LX3W4wj6RYTgonm1b9DA==}
+  vite@7.3.2:
+    resolution: {integrity: sha512-Bby3NOsna2jsjfLVOHKes8sGwgl4TT0E6vvpYgnAYDIF/tie7MRaFthmKuHx1NSXjiTueXH3do80FMQgvEktRg==}
     engines: {node: ^20.19.0 || >=22.12.0}
     hasBin: true
     peerDependencies:
@@ -3820,14 +3824,14 @@ packages:
       yaml:
         optional: true
 
-  vite@8.0.3:
-    resolution: {integrity: sha512-B9ifbFudT1TFhfltfaIPgjo9Z3mDynBTJSUYxTjOQruf/zHH+ezCQKcoqO+h7a9Pw9Nm/OtlXAiGT1axBgwqrQ==}
+  vite@8.0.7:
+    resolution: {integrity: sha512-P1PbweD+2/udplnThz3btF4cf6AgPky7kk23RtHUkJIU5BIxwPprhRGmOAHs6FTI7UiGbTNrgNP6jSYD6JaRnw==}
     engines: {node: ^20.19.0 || >=22.12.0}
     hasBin: true
     peerDependencies:
       '@types/node': ^20.19.0 || >=22.12.0
       '@vitejs/devtools': ^0.1.0
-      esbuild: ^0.27.0
+      esbuild: ^0.27.0 || ^0.28.0
       jiti: '>=1.21.0'
       less: ^4.0.0
       sass: ^1.70.0
@@ -4051,21 +4055,19 @@ snapshots:
       '@csstools/css-tokenizer': 3.0.4
       lru-cache: 10.4.3
 
-  '@asamuzakjp/css-color@5.0.1':
+  '@asamuzakjp/css-color@5.1.8':
     dependencies:
       '@csstools/css-calc': 3.1.1(@csstools/css-parser-algorithms@4.0.0(@csstools/css-tokenizer@4.0.0))(@csstools/css-tokenizer@4.0.0)
       '@csstools/css-color-parser': 4.0.2(@csstools/css-parser-algorithms@4.0.0(@csstools/css-tokenizer@4.0.0))(@csstools/css-tokenizer@4.0.0)
       '@csstools/css-parser-algorithms': 4.0.0(@csstools/css-tokenizer@4.0.0)
       '@csstools/css-tokenizer': 4.0.0
-      lru-cache: 11.2.7
 
-  '@asamuzakjp/dom-selector@7.0.4':
+  '@asamuzakjp/dom-selector@7.0.8':
     dependencies:
       '@asamuzakjp/nwsapi': 2.3.9
       bidi-js: 1.0.3
       css-tree: 3.2.1
       is-potential-custom-element-name: 1.0.1
-      lru-cache: 11.2.7
 
   '@asamuzakjp/nwsapi@2.3.9': {}
 
@@ -4109,7 +4111,7 @@ snapshots:
     dependencies:
       '@babel/compat-data': 7.29.0
       '@babel/helper-validator-option': 7.27.1
-      browserslist: 4.28.1
+      browserslist: 4.28.2
       lru-cache: 5.1.1
       semver: 6.3.1
 
@@ -4204,7 +4206,7 @@ snapshots:
       hashery: 1.5.1
       keyv: 5.6.0
 
-  '@canonical/react-components@4.0.1(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(formik@2.4.9(@types/react@19.2.14)(react@19.2.4))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(vanilla-framework@4.46.0(sass@1.98.0))':
+  '@canonical/react-components@4.2.0(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(formik@2.4.9(@types/react@19.2.14)(react@19.2.4))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(vanilla-framework@4.46.0(sass@1.99.0))':
     dependencies:
       '@types/jest': 30.0.0
       '@types/node': 20.19.30
@@ -4219,7 +4221,7 @@ snapshots:
       react: 19.2.4
       react-dom: 19.2.4(react@19.2.4)
       react-table: 7.8.0(react@19.2.4)
-      vanilla-framework: 4.46.0(sass@1.98.0)
+      vanilla-framework: 4.46.0(sass@1.99.0)
     transitivePeerDependencies:
       - bufferutil
       - canvas
@@ -4442,82 +4444,82 @@ snapshots:
       tslib: 2.8.1
     optional: true
 
-  '@esbuild/aix-ppc64@0.27.4':
+  '@esbuild/aix-ppc64@0.27.7':
     optional: true
 
-  '@esbuild/android-arm64@0.27.4':
+  '@esbuild/android-arm64@0.27.7':
     optional: true
 
-  '@esbuild/android-arm@0.27.4':
+  '@esbuild/android-arm@0.27.7':
     optional: true
 
-  '@esbuild/android-x64@0.27.4':
+  '@esbuild/android-x64@0.27.7':
     optional: true
 
-  '@esbuild/darwin-arm64@0.27.4':
+  '@esbuild/darwin-arm64@0.27.7':
     optional: true
 
-  '@esbuild/darwin-x64@0.27.4':
+  '@esbuild/darwin-x64@0.27.7':
     optional: true
 
-  '@esbuild/freebsd-arm64@0.27.4':
+  '@esbuild/freebsd-arm64@0.27.7':
     optional: true
 
-  '@esbuild/freebsd-x64@0.27.4':
+  '@esbuild/freebsd-x64@0.27.7':
     optional: true
 
-  '@esbuild/linux-arm64@0.27.4':
+  '@esbuild/linux-arm64@0.27.7':
     optional: true
 
-  '@esbuild/linux-arm@0.27.4':
+  '@esbuild/linux-arm@0.27.7':
     optional: true
 
-  '@esbuild/linux-ia32@0.27.4':
+  '@esbuild/linux-ia32@0.27.7':
     optional: true
 
-  '@esbuild/linux-loong64@0.27.4':
+  '@esbuild/linux-loong64@0.27.7':
     optional: true
 
-  '@esbuild/linux-mips64el@0.27.4':
+  '@esbuild/linux-mips64el@0.27.7':
     optional: true
 
-  '@esbuild/linux-ppc64@0.27.4':
+  '@esbuild/linux-ppc64@0.27.7':
     optional: true
 
-  '@esbuild/linux-riscv64@0.27.4':
+  '@esbuild/linux-riscv64@0.27.7':
     optional: true
 
-  '@esbuild/linux-s390x@0.27.4':
+  '@esbuild/linux-s390x@0.27.7':
     optional: true
 
-  '@esbuild/linux-x64@0.27.4':
+  '@esbuild/linux-x64@0.27.7':
     optional: true
 
-  '@esbuild/netbsd-arm64@0.27.4':
+  '@esbuild/netbsd-arm64@0.27.7':
     optional: true
 
-  '@esbuild/netbsd-x64@0.27.4':
+  '@esbuild/netbsd-x64@0.27.7':
     optional: true
 
-  '@esbuild/openbsd-arm64@0.27.4':
+  '@esbuild/openbsd-arm64@0.27.7':
     optional: true
 
-  '@esbuild/openbsd-x64@0.27.4':
+  '@esbuild/openbsd-x64@0.27.7':
     optional: true
 
-  '@esbuild/openharmony-arm64@0.27.4':
+  '@esbuild/openharmony-arm64@0.27.7':
     optional: true
 
-  '@esbuild/sunos-x64@0.27.4':
+  '@esbuild/sunos-x64@0.27.7':
     optional: true
 
-  '@esbuild/win32-arm64@0.27.4':
+  '@esbuild/win32-arm64@0.27.7':
     optional: true
 
-  '@esbuild/win32-ia32@0.27.4':
+  '@esbuild/win32-ia32@0.27.7':
     optional: true
 
-  '@esbuild/win32-x64@0.27.4':
+  '@esbuild/win32-x64@0.27.7':
     optional: true
 
   '@eslint-community/eslint-utils@4.9.1(eslint@9.39.4)':
@@ -4589,7 +4591,7 @@ snapshots:
       '@inquirer/figures': 1.0.15
       '@inquirer/type': 2.0.0
       '@types/mute-stream': 0.0.4
-      '@types/node': 22.19.15
+      '@types/node': 22.19.17
       '@types/wrap-ansi': 3.0.0
       ansi-escapes: 4.3.2
       cli-width: 4.1.0
@@ -4667,7 +4669,7 @@ snapshots:
 
   '@jest/schemas@30.0.5':
     dependencies:
-      '@sinclair/typebox': 0.34.48
+      '@sinclair/typebox': 0.34.49
 
   '@jest/types@30.2.0':
     dependencies:
@@ -4754,7 +4756,7 @@ snapshots:
       outvariant: 1.4.3
       strict-event-emitter: 0.5.1
 
-  '@napi-rs/wasm-runtime@1.1.1':
+  '@napi-rs/wasm-runtime@1.1.3(@emnapi/core@1.9.1)(@emnapi/runtime@1.9.1)':
     dependencies:
       '@emnapi/core': 1.9.1
       '@emnapi/runtime': 1.9.1
@@ -4782,7 +4784,7 @@ snapshots:
 
   '@open-draft/until@2.1.0': {}
 
-  '@oxc-project/types@0.122.0': {}
+  '@oxc-project/types@0.123.0': {}
 
   '@parcel/watcher-android-arm64@2.5.6':
     optional: true
@@ -4848,171 +4850,173 @@ snapshots:
   '@pkgjs/parseargs@0.11.0':
     optional: true
 
-  '@playwright/test@1.58.2':
+  '@playwright/test@1.59.1':
     dependencies:
-      playwright: 1.58.2
+      playwright: 1.59.1
 
-  '@rolldown/binding-android-arm64@1.0.0-rc.12':
+  '@rolldown/binding-android-arm64@1.0.0-rc.13':
     optional: true
 
-  '@rolldown/binding-darwin-arm64@1.0.0-rc.12':
+  '@rolldown/binding-darwin-arm64@1.0.0-rc.13':
     optional: true
 
-  '@rolldown/binding-darwin-x64@1.0.0-rc.12':
+  '@rolldown/binding-darwin-x64@1.0.0-rc.13':
     optional: true
 
-  '@rolldown/binding-freebsd-x64@1.0.0-rc.12':
+  '@rolldown/binding-freebsd-x64@1.0.0-rc.13':
     optional: true
 
-  '@rolldown/binding-linux-arm-gnueabihf@1.0.0-rc.12':
+  '@rolldown/binding-linux-arm-gnueabihf@1.0.0-rc.13':
     optional: true
 
-  '@rolldown/binding-linux-arm64-gnu@1.0.0-rc.12':
+  '@rolldown/binding-linux-arm64-gnu@1.0.0-rc.13':
     optional: true
 
-  '@rolldown/binding-linux-arm64-musl@1.0.0-rc.12':
+  '@rolldown/binding-linux-arm64-musl@1.0.0-rc.13':
     optional: true
 
-  '@rolldown/binding-linux-ppc64-gnu@1.0.0-rc.12':
+  '@rolldown/binding-linux-ppc64-gnu@1.0.0-rc.13':
     optional: true
 
-  '@rolldown/binding-linux-s390x-gnu@1.0.0-rc.12':
+  '@rolldown/binding-linux-s390x-gnu@1.0.0-rc.13':
     optional: true
 
-  '@rolldown/binding-linux-x64-gnu@1.0.0-rc.12':
+  '@rolldown/binding-linux-x64-gnu@1.0.0-rc.13':
     optional: true
 
-  '@rolldown/binding-linux-x64-musl@1.0.0-rc.12':
+  '@rolldown/binding-linux-x64-musl@1.0.0-rc.13':
     optional: true
 
-  '@rolldown/binding-openharmony-arm64@1.0.0-rc.12':
+  '@rolldown/binding-openharmony-arm64@1.0.0-rc.13':
     optional: true
 
-  '@rolldown/binding-wasm32-wasi@1.0.0-rc.12':
+  '@rolldown/binding-wasm32-wasi@1.0.0-rc.13':
     dependencies:
-      '@napi-rs/wasm-runtime': 1.1.1
+      '@emnapi/core': 1.9.1
+      '@emnapi/runtime': 1.9.1
+      '@napi-rs/wasm-runtime': 1.1.3(@emnapi/core@1.9.1)(@emnapi/runtime@1.9.1)
     optional: true
 
-  '@rolldown/binding-win32-arm64-msvc@1.0.0-rc.12':
+  '@rolldown/binding-win32-arm64-msvc@1.0.0-rc.13':
     optional: true
 
-  '@rolldown/binding-win32-x64-msvc@1.0.0-rc.12':
+  '@rolldown/binding-win32-x64-msvc@1.0.0-rc.13':
     optional: true
 
-  '@rolldown/pluginutils@1.0.0-rc.12': {}
+  '@rolldown/pluginutils@1.0.0-rc.13': {}
 
   '@rolldown/pluginutils@1.0.0-rc.7': {}
 
-  '@rollup/rollup-android-arm-eabi@4.60.0':
+  '@rollup/rollup-android-arm-eabi@4.60.1':
     optional: true
 
-  '@rollup/rollup-android-arm64@4.60.0':
+  '@rollup/rollup-android-arm64@4.60.1':
     optional: true
 
-  '@rollup/rollup-darwin-arm64@4.60.0':
+  '@rollup/rollup-darwin-arm64@4.60.1':
     optional: true
 
-  '@rollup/rollup-darwin-x64@4.60.0':
+  '@rollup/rollup-darwin-x64@4.60.1':
     optional: true
 
-  '@rollup/rollup-freebsd-arm64@4.60.0':
+  '@rollup/rollup-freebsd-arm64@4.60.1':
     optional: true
 
-  '@rollup/rollup-freebsd-x64@4.60.0':
+  '@rollup/rollup-freebsd-x64@4.60.1':
     optional: true
 
-  '@rollup/rollup-linux-arm-gnueabihf@4.60.0':
+  '@rollup/rollup-linux-arm-gnueabihf@4.60.1':
     optional: true
 
-  '@rollup/rollup-linux-arm-musleabihf@4.60.0':
+  '@rollup/rollup-linux-arm-musleabihf@4.60.1':
     optional: true
 
-  '@rollup/rollup-linux-arm64-gnu@4.60.0':
+  '@rollup/rollup-linux-arm64-gnu@4.60.1':
     optional: true
 
-  '@rollup/rollup-linux-arm64-musl@4.60.0':
+  '@rollup/rollup-linux-arm64-musl@4.60.1':
     optional: true
 
-  '@rollup/rollup-linux-loong64-gnu@4.60.0':
+  '@rollup/rollup-linux-loong64-gnu@4.60.1':
     optional: true
 
-  '@rollup/rollup-linux-loong64-musl@4.60.0':
+  '@rollup/rollup-linux-loong64-musl@4.60.1':
     optional: true
 
-  '@rollup/rollup-linux-ppc64-gnu@4.60.0':
+  '@rollup/rollup-linux-ppc64-gnu@4.60.1':
     optional: true
 
-  '@rollup/rollup-linux-ppc64-musl@4.60.0':
+  '@rollup/rollup-linux-ppc64-musl@4.60.1':
     optional: true
 
-  '@rollup/rollup-linux-riscv64-gnu@4.60.0':
+  '@rollup/rollup-linux-riscv64-gnu@4.60.1':
     optional: true
 
-  '@rollup/rollup-linux-riscv64-musl@4.60.0':
+  '@rollup/rollup-linux-riscv64-musl@4.60.1':
     optional: true
 
-  '@rollup/rollup-linux-s390x-gnu@4.60.0':
+  '@rollup/rollup-linux-s390x-gnu@4.60.1':
     optional: true
 
-  '@rollup/rollup-linux-x64-gnu@4.60.0':
+  '@rollup/rollup-linux-x64-gnu@4.60.1':
     optional: true
 
-  '@rollup/rollup-linux-x64-musl@4.60.0':
+  '@rollup/rollup-linux-x64-musl@4.60.1':
     optional: true
 
-  '@rollup/rollup-openbsd-x64@4.60.0':
+  '@rollup/rollup-openbsd-x64@4.60.1':
     optional: true
 
-  '@rollup/rollup-openharmony-arm64@4.60.0':
+  '@rollup/rollup-openharmony-arm64@4.60.1':
     optional: true
 
-  '@rollup/rollup-win32-arm64-msvc@4.60.0':
+  '@rollup/rollup-win32-arm64-msvc@4.60.1':
     optional: true
 
-  '@rollup/rollup-win32-ia32-msvc@4.60.0':
+  '@rollup/rollup-win32-ia32-msvc@4.60.1':
     optional: true
 
-  '@rollup/rollup-win32-x64-gnu@4.60.0':
+  '@rollup/rollup-win32-x64-gnu@4.60.1':
     optional: true
 
-  '@rollup/rollup-win32-x64-msvc@4.60.0':
+  '@rollup/rollup-win32-x64-msvc@4.60.1':
     optional: true
 
-  '@sentry-internal/browser-utils@10.46.0':
+  '@sentry-internal/browser-utils@10.47.0':
     dependencies:
-      '@sentry/core': 10.46.0
+      '@sentry/core': 10.47.0
 
-  '@sentry-internal/feedback@10.46.0':
+  '@sentry-internal/feedback@10.47.0':
     dependencies:
-      '@sentry/core': 10.46.0
+      '@sentry/core': 10.47.0
 
-  '@sentry-internal/replay-canvas@10.46.0':
+  '@sentry-internal/replay-canvas@10.47.0':
     dependencies:
-      '@sentry-internal/replay': 10.46.0
-      '@sentry/core': 10.46.0
+      '@sentry-internal/replay': 10.47.0
+      '@sentry/core': 10.47.0
 
-  '@sentry-internal/replay@10.46.0':
+  '@sentry-internal/replay@10.47.0':
     dependencies:
-      '@sentry-internal/browser-utils': 10.46.0
-      '@sentry/core': 10.46.0
+      '@sentry-internal/browser-utils': 10.47.0
+      '@sentry/core': 10.47.0
 
-  '@sentry/browser@10.46.0':
+  '@sentry/browser@10.47.0':
     dependencies:
-      '@sentry-internal/browser-utils': 10.46.0
-      '@sentry-internal/feedback': 10.46.0
-      '@sentry-internal/replay': 10.46.0
-      '@sentry-internal/replay-canvas': 10.46.0
-      '@sentry/core': 10.46.0
+      '@sentry-internal/browser-utils': 10.47.0
+      '@sentry-internal/feedback': 10.47.0
+      '@sentry-internal/replay': 10.47.0
+      '@sentry-internal/replay-canvas': 10.47.0
+      '@sentry/core': 10.47.0
 
-  '@sentry/core@10.46.0': {}
+  '@sentry/core@10.47.0': {}
 
-  '@sentry/react@10.46.0(react@19.2.4)':
+  '@sentry/react@10.47.0(react@19.2.4)':
     dependencies:
-      '@sentry/browser': 10.46.0
-      '@sentry/core': 10.46.0
+      '@sentry/browser': 10.47.0
+      '@sentry/core': 10.47.0
       react: 19.2.4
 
-  '@sinclair/typebox@0.34.48': {}
+  '@sinclair/typebox@0.34.49': {}
 
   '@sindresorhus/merge-streams@4.0.0': {}
 
@@ -5026,11 +5030,11 @@ snapshots:
 
   '@standard-schema/spec@1.1.0': {}
 
-  '@tanstack/query-core@5.95.2': {}
+  '@tanstack/query-core@5.96.2': {}
 
-  '@tanstack/react-query@5.95.2(react@19.2.4)':
+  '@tanstack/react-query@5.96.2(react@19.2.4)':
     dependencies:
-      '@tanstack/query-core': 5.95.2
+      '@tanstack/query-core': 5.96.2
       react: 19.2.4
 
   '@testing-library/dom@10.4.1':
@@ -5123,7 +5127,7 @@ snapshots:
     dependencies:
       undici-types: 6.21.0
 
-  '@types/node@22.19.15':
+  '@types/node@22.19.17':
     dependencies:
       undici-types: 6.21.0
 
@@ -5160,14 +5164,14 @@ snapshots:
     dependencies:
       '@types/yargs-parser': 21.0.3
 
-  '@typescript-eslint/eslint-plugin@8.57.2(@typescript-eslint/parser@8.57.2(eslint@9.39.4)(typescript@5.9.3))(eslint@9.39.4)(typescript@5.9.3)':
+  '@typescript-eslint/eslint-plugin@8.58.1(@typescript-eslint/parser@8.58.1(eslint@9.39.4)(typescript@5.9.3))(eslint@9.39.4)(typescript@5.9.3)':
     dependencies:
       '@eslint-community/regexpp': 4.12.2
-      '@typescript-eslint/parser': 8.57.2(eslint@9.39.4)(typescript@5.9.3)
-      '@typescript-eslint/scope-manager': 8.57.2
-      '@typescript-eslint/type-utils': 8.57.2(eslint@9.39.4)(typescript@5.9.3)
-      '@typescript-eslint/utils': 8.57.2(eslint@9.39.4)(typescript@5.9.3)
-      '@typescript-eslint/visitor-keys': 8.57.2
+      '@typescript-eslint/parser': 8.58.1(eslint@9.39.4)(typescript@5.9.3)
+      '@typescript-eslint/scope-manager': 8.58.1
+      '@typescript-eslint/type-utils': 8.58.1(eslint@9.39.4)(typescript@5.9.3)
+      '@typescript-eslint/utils': 8.58.1(eslint@9.39.4)(typescript@5.9.3)
+      '@typescript-eslint/visitor-keys': 8.58.1
       eslint: 9.39.4
       ignore: 7.0.5
       natural-compare: 1.4.0
@@ -5176,41 +5180,41 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/parser@8.57.2(eslint@9.39.4)(typescript@5.9.3)':
+  '@typescript-eslint/parser@8.58.1(eslint@9.39.4)(typescript@5.9.3)':
     dependencies:
-      '@typescript-eslint/scope-manager': 8.57.2
-      '@typescript-eslint/types': 8.57.2
-      '@typescript-eslint/typescript-estree': 8.57.2(typescript@5.9.3)
-      '@typescript-eslint/visitor-keys': 8.57.2
+      '@typescript-eslint/scope-manager': 8.58.1
+      '@typescript-eslint/types': 8.58.1
+      '@typescript-eslint/typescript-estree': 8.58.1(typescript@5.9.3)
+      '@typescript-eslint/visitor-keys': 8.58.1
       debug: 4.4.3
       eslint: 9.39.4
       typescript: 5.9.3
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/project-service@8.57.2(typescript@5.9.3)':
+  '@typescript-eslint/project-service@8.58.1(typescript@5.9.3)':
     dependencies:
-      '@typescript-eslint/tsconfig-utils': 8.57.2(typescript@5.9.3)
-      '@typescript-eslint/types': 8.57.2
+      '@typescript-eslint/tsconfig-utils': 8.58.1(typescript@5.9.3)
+      '@typescript-eslint/types': 8.58.1
       debug: 4.4.3
       typescript: 5.9.3
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/scope-manager@8.57.2':
+  '@typescript-eslint/scope-manager@8.58.1':
     dependencies:
-      '@typescript-eslint/types': 8.57.2
-      '@typescript-eslint/visitor-keys': 8.57.2
+      '@typescript-eslint/types': 8.58.1
+      '@typescript-eslint/visitor-keys': 8.58.1
 
-  '@typescript-eslint/tsconfig-utils@8.57.2(typescript@5.9.3)':
+  '@typescript-eslint/tsconfig-utils@8.58.1(typescript@5.9.3)':
     dependencies:
       typescript: 5.9.3
 
-  '@typescript-eslint/type-utils@8.57.2(eslint@9.39.4)(typescript@5.9.3)':
+  '@typescript-eslint/type-utils@8.58.1(eslint@9.39.4)(typescript@5.9.3)':
     dependencies:
-      '@typescript-eslint/types': 8.57.2
-      '@typescript-eslint/typescript-estree': 8.57.2(typescript@5.9.3)
-      '@typescript-eslint/utils': 8.57.2(eslint@9.39.4)(typescript@5.9.3)
+      '@typescript-eslint/types': 8.58.1
+      '@typescript-eslint/typescript-estree': 8.58.1(typescript@5.9.3)
+      '@typescript-eslint/utils': 8.58.1(eslint@9.39.4)(typescript@5.9.3)
       debug: 4.4.3
       eslint: 9.39.4
       ts-api-utils: 2.5.0(typescript@5.9.3)
@@ -5218,45 +5222,45 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/types@8.57.2': {}
+  '@typescript-eslint/types@8.58.1': {}
 
-  '@typescript-eslint/typescript-estree@8.57.2(typescript@5.9.3)':
+  '@typescript-eslint/typescript-estree@8.58.1(typescript@5.9.3)':
     dependencies:
-      '@typescript-eslint/project-service': 8.57.2(typescript@5.9.3)
-      '@typescript-eslint/tsconfig-utils': 8.57.2(typescript@5.9.3)
-      '@typescript-eslint/types': 8.57.2
-      '@typescript-eslint/visitor-keys': 8.57.2
+      '@typescript-eslint/project-service': 8.58.1(typescript@5.9.3)
+      '@typescript-eslint/tsconfig-utils': 8.58.1(typescript@5.9.3)
+      '@typescript-eslint/types': 8.58.1
+      '@typescript-eslint/visitor-keys': 8.58.1
       debug: 4.4.3
-      minimatch: 10.2.4
+      minimatch: 10.2.5
       semver: 7.7.4
-      tinyglobby: 0.2.15
+      tinyglobby: 0.2.16
       ts-api-utils: 2.5.0(typescript@5.9.3)
       typescript: 5.9.3
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/utils@8.57.2(eslint@9.39.4)(typescript@5.9.3)':
+  '@typescript-eslint/utils@8.58.1(eslint@9.39.4)(typescript@5.9.3)':
     dependencies:
       '@eslint-community/eslint-utils': 4.9.1(eslint@9.39.4)
-      '@typescript-eslint/scope-manager': 8.57.2
-      '@typescript-eslint/types': 8.57.2
-      '@typescript-eslint/typescript-estree': 8.57.2(typescript@5.9.3)
+      '@typescript-eslint/scope-manager': 8.58.1
+      '@typescript-eslint/types': 8.58.1
+      '@typescript-eslint/typescript-estree': 8.58.1(typescript@5.9.3)
       eslint: 9.39.4
       typescript: 5.9.3
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/visitor-keys@8.57.2':
+  '@typescript-eslint/visitor-keys@8.58.1':
     dependencies:
-      '@typescript-eslint/types': 8.57.2
+      '@typescript-eslint/types': 8.58.1
       eslint-visitor-keys: 5.0.1
 
-  '@vitejs/plugin-react@6.0.1(vite@8.0.3(@types/node@24.12.0)(esbuild@0.27.4)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1))':
+  '@vitejs/plugin-react@6.0.1(vite@8.0.7(@types/node@24.12.0)(esbuild@0.27.7)(sass-embedded@1.99.0)(sass@1.99.0)(yaml@2.8.1))':
     dependencies:
       '@rolldown/pluginutils': 1.0.0-rc.7
-      vite: 8.0.3(@types/node@24.12.0)(esbuild@0.27.4)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1)
+      vite: 8.0.7(@types/node@24.12.0)(esbuild@0.27.7)(sass-embedded@1.99.0)(sass@1.99.0)(yaml@2.8.1)
 
-  '@vitest/coverage-v8@4.0.18(vitest@4.0.18(@types/node@24.12.0)(jsdom@29.0.1)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1))':
+  '@vitest/coverage-v8@4.0.18(vitest@4.0.18(@types/node@24.12.0)(jsdom@29.0.2)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.99.0)(sass@1.99.0)(yaml@2.8.1))':
     dependencies:
       '@bcoe/v8-coverage': 1.0.2
       '@vitest/utils': 4.0.18
@@ -5268,7 +5272,7 @@ snapshots:
       obug: 2.1.1
       std-env: 3.10.0
       tinyrainbow: 3.1.0
-      vitest: 4.0.18(@types/node@24.12.0)(jsdom@29.0.1)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1)
+      vitest: 4.0.18(@types/node@24.12.0)(jsdom@29.0.2)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.99.0)(sass@1.99.0)(yaml@2.8.1)
 
   '@vitest/expect@4.0.18':
     dependencies:
@@ -5279,14 +5283,14 @@ snapshots:
       chai: 6.2.2
       tinyrainbow: 3.1.0
 
-  '@vitest/mocker@4.0.18(msw@2.4.11(typescript@5.9.3))(vite@7.3.1(@types/node@24.12.0)(lightningcss@1.32.0)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1))':
+  '@vitest/mocker@4.0.18(msw@2.4.11(typescript@5.9.3))(vite@7.3.2(@types/node@24.12.0)(lightningcss@1.32.0)(sass-embedded@1.99.0)(sass@1.99.0)(yaml@2.8.1))':
     dependencies:
       '@vitest/spy': 4.0.18
       estree-walker: 3.0.3
       magic-string: 0.30.21
     optionalDependencies:
       msw: 2.4.11(typescript@5.9.3)
-      vite: 7.3.1(@types/node@24.12.0)(lightningcss@1.32.0)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1)
+      vite: 7.3.2(@types/node@24.12.0)(lightningcss@1.32.0)(sass-embedded@1.99.0)(sass@1.99.0)(yaml@2.8.1)
 
   '@vitest/pretty-format@4.0.18':
     dependencies:
@@ -5377,7 +5381,7 @@ snapshots:
       call-bind: 1.0.8
       call-bound: 1.0.4
       define-properties: 1.2.1
-      es-abstract: 1.24.1
+      es-abstract: 1.24.2
       es-object-atoms: 1.1.1
       get-intrinsic: 1.3.0
       is-string: 1.1.1
@@ -5389,7 +5393,7 @@ snapshots:
     dependencies:
       call-bind: 1.0.8
       define-properties: 1.2.1
-      es-abstract: 1.24.1
+      es-abstract: 1.24.2
       es-errors: 1.3.0
       es-object-atoms: 1.1.1
       es-shim-unscopables: 1.1.0
@@ -5398,21 +5402,21 @@ snapshots:
     dependencies:
       call-bind: 1.0.8
       define-properties: 1.2.1
-      es-abstract: 1.24.1
+      es-abstract: 1.24.2
       es-shim-unscopables: 1.1.0
 
   array.prototype.flatmap@1.3.3:
     dependencies:
       call-bind: 1.0.8
       define-properties: 1.2.1
-      es-abstract: 1.24.1
+      es-abstract: 1.24.2
       es-shim-unscopables: 1.1.0
 
   array.prototype.tosorted@1.1.4:
     dependencies:
       call-bind: 1.0.8
       define-properties: 1.2.1
-      es-abstract: 1.24.1
+      es-abstract: 1.24.2
       es-errors: 1.3.0
       es-shim-unscopables: 1.1.0
 
@@ -5421,7 +5425,7 @@ snapshots:
       array-buffer-byte-length: 1.0.2
       call-bind: 1.0.8
       define-properties: 1.2.1
-      es-abstract: 1.24.1
+      es-abstract: 1.24.2
       es-errors: 1.3.0
       get-intrinsic: 1.3.0
       is-array-buffer: 3.0.5
@@ -5444,11 +5448,11 @@ snapshots:
     dependencies:
       possible-typed-array-names: 1.1.0
 
-  axios@1.13.6:
+  axios@1.15.0:
     dependencies:
       follow-redirects: 1.15.11
       form-data: 4.0.5
-      proxy-from-env: 1.1.0
+      proxy-from-env: 2.1.0
     transitivePeerDependencies:
       - debug
 
@@ -5458,7 +5462,7 @@ snapshots:
 
   base64-js@1.5.1: {}
 
-  baseline-browser-mapping@2.10.11: {}
+  baseline-browser-mapping@2.10.16: {}
 
   better-path-resolve@1.0.0:
     dependencies:
@@ -5487,13 +5491,13 @@ snapshots:
     dependencies:
       fill-range: 7.1.1
 
-  browserslist@4.28.1:
+  browserslist@4.28.2:
     dependencies:
-      baseline-browser-mapping: 2.10.11
-      caniuse-lite: 1.0.30001781
-      electron-to-chromium: 1.5.328
-      node-releases: 2.0.36
-      update-browserslist-db: 1.2.3(browserslist@4.28.1)
+      baseline-browser-mapping: 2.10.16
+      caniuse-lite: 1.0.30001787
+      electron-to-chromium: 1.5.334
+      node-releases: 2.0.37
+      update-browserslist-db: 1.2.3(browserslist@4.28.2)
 
   buffer@6.0.3:
     dependencies:
@@ -5506,7 +5510,7 @@ snapshots:
       '@cacheable/utils': 2.4.1
       hookified: 1.15.1
       keyv: 5.6.0
-      qified: 0.9.0
+      qified: 0.9.1
 
   call-bind-apply-helpers@1.0.2:
     dependencies:
@@ -5529,7 +5533,7 @@ snapshots:
 
   camelcase@6.3.0: {}
 
-  caniuse-lite@1.0.30001781: {}
+  caniuse-lite@1.0.30001787: {}
 
   chai@6.2.2: {}
 
@@ -5722,7 +5726,7 @@ snapshots:
 
   eastasianwidth@0.2.0: {}
 
-  electron-to-chromium@1.5.328: {}
+  electron-to-chromium@1.5.334: {}
 
   emoji-regex@8.0.0: {}
 
@@ -5741,7 +5745,7 @@ snapshots:
     dependencies:
       is-arrayish: 0.2.1
 
-  es-abstract@1.24.1:
+  es-abstract@1.24.2:
     dependencies:
       array-buffer-byte-length: 1.0.2
       arraybuffer.prototype.slice: 1.0.4
@@ -5807,7 +5811,7 @@ snapshots:
       call-bind: 1.0.8
       call-bound: 1.0.4
       define-properties: 1.2.1
-      es-abstract: 1.24.1
+      es-abstract: 1.24.2
       es-errors: 1.3.0
       es-set-tostringtag: 2.1.0
       function-bind: 1.1.2
@@ -5845,34 +5849,34 @@ snapshots:
       is-date-object: 1.1.0
       is-symbol: 1.1.1
 
-  esbuild@0.27.4:
+  esbuild@0.27.7:
     optionalDependencies:
-      '@esbuild/aix-ppc64': 0.27.4
-      '@esbuild/android-arm': 0.27.4
-      '@esbuild/android-arm64': 0.27.4
-      '@esbuild/android-x64': 0.27.4
-      '@esbuild/darwin-arm64': 0.27.4
-      '@esbuild/darwin-x64': 0.27.4
-      '@esbuild/freebsd-arm64': 0.27.4
-      '@esbuild/freebsd-x64': 0.27.4
-      '@esbuild/linux-arm': 0.27.4
-      '@esbuild/linux-arm64': 0.27.4
-      '@esbuild/linux-ia32': 0.27.4
-      '@esbuild/linux-loong64': 0.27.4
-      '@esbuild/linux-mips64el': 0.27.4
-      '@esbuild/linux-ppc64': 0.27.4
-      '@esbuild/linux-riscv64': 0.27.4
-      '@esbuild/linux-s390x': 0.27.4
-      '@esbuild/linux-x64': 0.27.4
-      '@esbuild/netbsd-arm64': 0.27.4
-      '@esbuild/netbsd-x64': 0.27.4
-      '@esbuild/openbsd-arm64': 0.27.4
-      '@esbuild/openbsd-x64': 0.27.4
-      '@esbuild/openharmony-arm64': 0.27.4
-      '@esbuild/sunos-x64': 0.27.4
-      '@esbuild/win32-arm64': 0.27.4
-      '@esbuild/win32-ia32': 0.27.4
-      '@esbuild/win32-x64': 0.27.4
+      '@esbuild/aix-ppc64': 0.27.7
+      '@esbuild/android-arm': 0.27.7
+      '@esbuild/android-arm64': 0.27.7
+      '@esbuild/android-x64': 0.27.7
+      '@esbuild/darwin-arm64': 0.27.7
+      '@esbuild/darwin-x64': 0.27.7
+      '@esbuild/freebsd-arm64': 0.27.7
+      '@esbuild/freebsd-x64': 0.27.7
+      '@esbuild/linux-arm': 0.27.7
+      '@esbuild/linux-arm64': 0.27.7
+      '@esbuild/linux-ia32': 0.27.7
+      '@esbuild/linux-loong64': 0.27.7
+      '@esbuild/linux-mips64el': 0.27.7
+      '@esbuild/linux-ppc64': 0.27.7
+      '@esbuild/linux-riscv64': 0.27.7
+      '@esbuild/linux-s390x': 0.27.7
+      '@esbuild/linux-x64': 0.27.7
+      '@esbuild/netbsd-arm64': 0.27.7
+      '@esbuild/netbsd-x64': 0.27.7
+      '@esbuild/openbsd-arm64': 0.27.7
+      '@esbuild/openbsd-x64': 0.27.7
+      '@esbuild/openharmony-arm64': 0.27.7
+      '@esbuild/sunos-x64': 0.27.7
+      '@esbuild/win32-arm64': 0.27.7
+      '@esbuild/win32-ia32': 0.27.7
+      '@esbuild/win32-x64': 0.27.7
 
   escalade@3.2.0: {}
 
@@ -6089,8 +6093,8 @@ snapshots:
       '@types/hoist-non-react-statics': 3.3.7(@types/react@19.2.14)
       deepmerge: 2.2.1
       hoist-non-react-statics: 3.3.2
-      lodash: 4.17.23
-      lodash-es: 4.17.23
+      lodash: 4.18.1
+      lodash-es: 4.18.1
       react: 19.2.4
       react-fast-compare: 2.0.4
       tiny-warning: 1.0.3
@@ -6265,7 +6269,7 @@ snapshots:
 
   hookified@1.15.1: {}
 
-  hookified@2.1.0: {}
+  hookified@2.1.1: {}
 
   html-encoding-sniffer@4.0.0:
     dependencies:
@@ -6307,9 +6311,9 @@ snapshots:
 
   icss-replace-symbols@1.1.0: {}
 
-  icss-utils@5.1.0(postcss@8.5.8):
+  icss-utils@5.1.0(postcss@8.5.9):
     dependencies:
-      postcss: 8.5.8
+      postcss: 8.5.9
 
   ieee754@1.2.1: {}
 
@@ -6624,10 +6628,10 @@ snapshots:
       - supports-color
       - utf-8-validate
 
-  jsdom@29.0.1:
+  jsdom@29.0.2:
     dependencies:
-      '@asamuzakjp/css-color': 5.0.1
-      '@asamuzakjp/dom-selector': 7.0.4
+      '@asamuzakjp/css-color': 5.1.8
+      '@asamuzakjp/dom-selector': 7.0.8
       '@bramus/specificity': 2.4.2
       '@csstools/css-syntax-patches-for-csstree': 1.1.2(css-tree@3.2.1)
       '@exodus/bytes': 1.15.0
@@ -6636,12 +6640,12 @@ snapshots:
       decimal.js: 10.6.0
       html-encoding-sniffer: 6.0.0
       is-potential-custom-element-name: 1.0.1
-      lru-cache: 11.2.7
+      lru-cache: 11.3.3
       parse5: 8.0.0
       saxes: 6.0.0
       symbol-tree: 3.2.4
       tough-cookie: 6.0.1
-      undici: 7.24.6
+      undici: 7.24.7
       w3c-xmlserializer: 5.0.0
       webidl-conversions: 8.0.1
       whatwg-mimetype: 5.0.0
@@ -6751,7 +6755,7 @@ snapshots:
     dependencies:
       p-locate: 5.0.0
 
-  lodash-es@4.17.23: {}
+  lodash-es@4.18.1: {}
 
   lodash.debounce@4.0.8: {}
 
@@ -6761,7 +6765,7 @@ snapshots:
 
   lodash.truncate@4.4.2: {}
 
-  lodash@4.17.23: {}
+  lodash@4.18.1: {}
 
   loose-envify@1.4.0:
     dependencies:
@@ -6769,7 +6773,7 @@ snapshots:
 
   lru-cache@10.4.3: {}
 
-  lru-cache@11.2.7: {}
+  lru-cache@11.3.3: {}
 
   lru-cache@5.1.1:
     dependencies:
@@ -6816,7 +6820,7 @@ snapshots:
 
   min-indent@1.0.1: {}
 
-  minimatch@10.2.4:
+  minimatch@10.2.5:
     dependencies:
       brace-expansion: 5.0.5
 
@@ -6881,7 +6885,7 @@ snapshots:
       object.entries: 1.1.9
       semver: 6.3.1
 
-  node-releases@2.0.36: {}
+  node-releases@2.0.37: {}
 
   normalize-path@3.0.0: {}
 
@@ -6913,7 +6917,7 @@ snapshots:
     dependencies:
       call-bind: 1.0.8
       define-properties: 1.2.1
-      es-abstract: 1.24.1
+      es-abstract: 1.24.2
       es-object-atoms: 1.1.1
 
   object.values@1.2.1:
@@ -7006,7 +7010,7 @@ snapshots:
 
   path-to-regexp@6.3.0: {}
 
-  path-to-regexp@8.4.0: {}
+  path-to-regexp@8.4.2: {}
 
   path-type@4.0.0: {}
 
@@ -7020,11 +7024,11 @@ snapshots:
 
   pify@4.0.1: {}
 
-  playwright-core@1.58.2: {}
+  playwright-core@1.59.1: {}
 
-  playwright@1.58.2:
+  playwright@1.59.1:
     dependencies:
-      playwright-core: 1.58.2
+      playwright-core: 1.59.1
     optionalDependencies:
       fsevents: 2.3.2
 
@@ -7032,49 +7036,49 @@ snapshots:
 
   postcss-media-query-parser@0.2.3: {}
 
-  postcss-modules-extract-imports@3.1.0(postcss@8.5.8):
+  postcss-modules-extract-imports@3.1.0(postcss@8.5.9):
     dependencies:
-      postcss: 8.5.8
+      postcss: 8.5.9
 
-  postcss-modules-local-by-default@4.2.0(postcss@8.5.8):
+  postcss-modules-local-by-default@4.2.0(postcss@8.5.9):
     dependencies:
-      icss-utils: 5.1.0(postcss@8.5.8)
-      postcss: 8.5.8
+      icss-utils: 5.1.0(postcss@8.5.9)
+      postcss: 8.5.9
       postcss-selector-parser: 7.1.1
       postcss-value-parser: 4.2.0
 
-  postcss-modules-scope@3.2.1(postcss@8.5.8):
+  postcss-modules-scope@3.2.1(postcss@8.5.9):
     dependencies:
-      postcss: 8.5.8
+      postcss: 8.5.9
       postcss-selector-parser: 7.1.1
 
-  postcss-modules-values@4.0.0(postcss@8.5.8):
+  postcss-modules-values@4.0.0(postcss@8.5.9):
     dependencies:
-      icss-utils: 5.1.0(postcss@8.5.8)
-      postcss: 8.5.8
+      icss-utils: 5.1.0(postcss@8.5.9)
+      postcss: 8.5.9
 
   postcss-resolve-nested-selector@0.1.6: {}
 
-  postcss-safe-parser@7.0.1(postcss@8.5.8):
+  postcss-safe-parser@7.0.1(postcss@8.5.9):
     dependencies:
-      postcss: 8.5.8
+      postcss: 8.5.9
 
-  postcss-scss@4.0.9(postcss@8.5.8):
+  postcss-scss@4.0.9(postcss@8.5.9):
     dependencies:
-      postcss: 8.5.8
+      postcss: 8.5.9
 
   postcss-selector-parser@7.1.1:
     dependencies:
       cssesc: 3.0.0
       util-deprecate: 1.0.2
 
-  postcss-sorting@10.0.0(postcss@8.5.8):
+  postcss-sorting@10.0.0(postcss@8.5.9):
     dependencies:
-      postcss: 8.5.8
+      postcss: 8.5.9
 
   postcss-value-parser@4.2.0: {}
 
-  postcss@8.5.8:
+  postcss@8.5.9:
     dependencies:
       nanoid: 3.3.11
       picocolors: 1.1.1
@@ -7112,7 +7116,7 @@ snapshots:
 
   property-expr@2.0.6: {}
 
-  proxy-from-env@1.1.0: {}
+  proxy-from-env@2.1.0: {}
 
   psl@1.15.0:
     dependencies:
@@ -7120,9 +7124,9 @@ snapshots:
 
   punycode@2.3.1: {}
 
-  qified@0.9.0:
+  qified@0.9.1:
     dependencies:
-      hookified: 2.1.0
+      hookified: 2.1.1
 
   quansync@0.2.11: {}
 
@@ -7148,7 +7152,7 @@ snapshots:
 
   react-is@18.3.1: {}
 
-  react-router@7.13.2(react-dom@19.2.4(react@19.2.4))(react@19.2.4):
+  react-router@7.14.0(react-dom@19.2.4(react@19.2.4))(react@19.2.4):
     dependencies:
       cookie: 1.1.1
       react: 19.2.4
@@ -7184,7 +7188,7 @@ snapshots:
     dependencies:
       call-bind: 1.0.8
       define-properties: 1.2.1
-      es-abstract: 1.24.1
+      es-abstract: 1.24.2
       es-errors: 1.3.0
       es-object-atoms: 1.1.1
       get-intrinsic: 1.3.0
@@ -7221,56 +7225,56 @@ snapshots:
 
   reusify@1.1.0: {}
 
-  rolldown@1.0.0-rc.12:
+  rolldown@1.0.0-rc.13:
     dependencies:
-      '@oxc-project/types': 0.122.0
-      '@rolldown/pluginutils': 1.0.0-rc.12
+      '@oxc-project/types': 0.123.0
+      '@rolldown/pluginutils': 1.0.0-rc.13
     optionalDependencies:
-      '@rolldown/binding-android-arm64': 1.0.0-rc.12
-      '@rolldown/binding-darwin-arm64': 1.0.0-rc.12
-      '@rolldown/binding-darwin-x64': 1.0.0-rc.12
-      '@rolldown/binding-freebsd-x64': 1.0.0-rc.12
-      '@rolldown/binding-linux-arm-gnueabihf': 1.0.0-rc.12
-      '@rolldown/binding-linux-arm64-gnu': 1.0.0-rc.12
-      '@rolldown/binding-linux-arm64-musl': 1.0.0-rc.12
-      '@rolldown/binding-linux-ppc64-gnu': 1.0.0-rc.12
-      '@rolldown/binding-linux-s390x-gnu': 1.0.0-rc.12
-      '@rolldown/binding-linux-x64-gnu': 1.0.0-rc.12
-      '@rolldown/binding-linux-x64-musl': 1.0.0-rc.12
-      '@rolldown/binding-openharmony-arm64': 1.0.0-rc.12
-      '@rolldown/binding-wasm32-wasi': 1.0.0-rc.12
-      '@rolldown/binding-win32-arm64-msvc': 1.0.0-rc.12
-      '@rolldown/binding-win32-x64-msvc': 1.0.0-rc.12
-
-  rollup@4.60.0:
+      '@rolldown/binding-android-arm64': 1.0.0-rc.13
+      '@rolldown/binding-darwin-arm64': 1.0.0-rc.13
+      '@rolldown/binding-darwin-x64': 1.0.0-rc.13
+      '@rolldown/binding-freebsd-x64': 1.0.0-rc.13
+      '@rolldown/binding-linux-arm-gnueabihf': 1.0.0-rc.13
+      '@rolldown/binding-linux-arm64-gnu': 1.0.0-rc.13
+      '@rolldown/binding-linux-arm64-musl': 1.0.0-rc.13
+      '@rolldown/binding-linux-ppc64-gnu': 1.0.0-rc.13
+      '@rolldown/binding-linux-s390x-gnu': 1.0.0-rc.13
+      '@rolldown/binding-linux-x64-gnu': 1.0.0-rc.13
+      '@rolldown/binding-linux-x64-musl': 1.0.0-rc.13
+      '@rolldown/binding-openharmony-arm64': 1.0.0-rc.13
+      '@rolldown/binding-wasm32-wasi': 1.0.0-rc.13
+      '@rolldown/binding-win32-arm64-msvc': 1.0.0-rc.13
+      '@rolldown/binding-win32-x64-msvc': 1.0.0-rc.13
+
+  rollup@4.60.1:
     dependencies:
       '@types/estree': 1.0.8
     optionalDependencies:
-      '@rollup/rollup-android-arm-eabi': 4.60.0
-      '@rollup/rollup-android-arm64': 4.60.0
-      '@rollup/rollup-darwin-arm64': 4.60.0
-      '@rollup/rollup-darwin-x64': 4.60.0
-      '@rollup/rollup-freebsd-arm64': 4.60.0
-      '@rollup/rollup-freebsd-x64': 4.60.0
-      '@rollup/rollup-linux-arm-gnueabihf': 4.60.0
-      '@rollup/rollup-linux-arm-musleabihf': 4.60.0
-      '@rollup/rollup-linux-arm64-gnu': 4.60.0
-      '@rollup/rollup-linux-arm64-musl': 4.60.0
-      '@rollup/rollup-linux-loong64-gnu': 4.60.0
-      '@rollup/rollup-linux-loong64-musl': 4.60.0
-      '@rollup/rollup-linux-ppc64-gnu': 4.60.0
-      '@rollup/rollup-linux-ppc64-musl': 4.60.0
-      '@rollup/rollup-linux-riscv64-gnu': 4.60.0
-      '@rollup/rollup-linux-riscv64-musl': 4.60.0
-      '@rollup/rollup-linux-s390x-gnu': 4.60.0
-      '@rollup/rollup-linux-x64-gnu': 4.60.0
-      '@rollup/rollup-linux-x64-musl': 4.60.0
-      '@rollup/rollup-openbsd-x64': 4.60.0
-      '@rollup/rollup-openharmony-arm64': 4.60.0
-      '@rollup/rollup-win32-arm64-msvc': 4.60.0
-      '@rollup/rollup-win32-ia32-msvc': 4.60.0
-      '@rollup/rollup-win32-x64-gnu': 4.60.0
-      '@rollup/rollup-win32-x64-msvc': 4.60.0
+      '@rollup/rollup-android-arm-eabi': 4.60.1
+      '@rollup/rollup-android-arm64': 4.60.1
+      '@rollup/rollup-darwin-arm64': 4.60.1
+      '@rollup/rollup-darwin-x64': 4.60.1
+      '@rollup/rollup-freebsd-arm64': 4.60.1
+      '@rollup/rollup-freebsd-x64': 4.60.1
+      '@rollup/rollup-linux-arm-gnueabihf': 4.60.1
+      '@rollup/rollup-linux-arm-musleabihf': 4.60.1
+      '@rollup/rollup-linux-arm64-gnu': 4.60.1
+      '@rollup/rollup-linux-arm64-musl': 4.60.1
+      '@rollup/rollup-linux-loong64-gnu': 4.60.1
+      '@rollup/rollup-linux-loong64-musl': 4.60.1
+      '@rollup/rollup-linux-ppc64-gnu': 4.60.1
+      '@rollup/rollup-linux-ppc64-musl': 4.60.1
+      '@rollup/rollup-linux-riscv64-gnu': 4.60.1
+      '@rollup/rollup-linux-riscv64-musl': 4.60.1
+      '@rollup/rollup-linux-s390x-gnu': 4.60.1
+      '@rollup/rollup-linux-x64-gnu': 4.60.1
+      '@rollup/rollup-linux-x64-musl': 4.60.1
+      '@rollup/rollup-openbsd-x64': 4.60.1
+      '@rollup/rollup-openharmony-arm64': 4.60.1
+      '@rollup/rollup-win32-arm64-msvc': 4.60.1
+      '@rollup/rollup-win32-ia32-msvc': 4.60.1
+      '@rollup/rollup-win32-x64-gnu': 4.60.1
+      '@rollup/rollup-win32-x64-msvc': 4.60.1
       fsevents: 2.3.3
 
   rrweb-cssom@0.8.0: {}
@@ -7304,65 +7308,65 @@ snapshots:
 
   safer-buffer@2.1.2: {}
 
-  sass-embedded-all-unknown@1.98.0:
+  sass-embedded-all-unknown@1.99.0:
     dependencies:
-      sass: 1.98.0
+      sass: 1.99.0
     optional: true
 
-  sass-embedded-android-arm64@1.98.0:
+  sass-embedded-android-arm64@1.99.0:
     optional: true
 
-  sass-embedded-android-arm@1.98.0:
+  sass-embedded-android-arm@1.99.0:
     optional: true
 
-  sass-embedded-android-riscv64@1.98.0:
+  sass-embedded-android-riscv64@1.99.0:
     optional: true
 
-  sass-embedded-android-x64@1.98.0:
+  sass-embedded-android-x64@1.99.0:
     optional: true
 
-  sass-embedded-darwin-arm64@1.98.0:
+  sass-embedded-darwin-arm64@1.99.0:
     optional: true
 
-  sass-embedded-darwin-x64@1.98.0:
+  sass-embedded-darwin-x64@1.99.0:
     optional: true
 
-  sass-embedded-linux-arm64@1.98.0:
+  sass-embedded-linux-arm64@1.99.0:
     optional: true
 
-  sass-embedded-linux-arm@1.98.0:
+  sass-embedded-linux-arm@1.99.0:
     optional: true
 
-  sass-embedded-linux-musl-arm64@1.98.0:
+  sass-embedded-linux-musl-arm64@1.99.0:
     optional: true
 
-  sass-embedded-linux-musl-arm@1.98.0:
+  sass-embedded-linux-musl-arm@1.99.0:
     optional: true
 
-  sass-embedded-linux-musl-riscv64@1.98.0:
+  sass-embedded-linux-musl-riscv64@1.99.0:
     optional: true
 
-  sass-embedded-linux-musl-x64@1.98.0:
+  sass-embedded-linux-musl-x64@1.99.0:
     optional: true
 
-  sass-embedded-linux-riscv64@1.98.0:
+  sass-embedded-linux-riscv64@1.99.0:
     optional: true
 
-  sass-embedded-linux-x64@1.98.0:
+  sass-embedded-linux-x64@1.99.0:
     optional: true
 
-  sass-embedded-unknown-all@1.98.0:
+  sass-embedded-unknown-all@1.99.0:
     dependencies:
-      sass: 1.98.0
+      sass: 1.99.0
     optional: true
 
-  sass-embedded-win32-arm64@1.98.0:
+  sass-embedded-win32-arm64@1.99.0:
     optional: true
 
-  sass-embedded-win32-x64@1.98.0:
+  sass-embedded-win32-x64@1.99.0:
     optional: true
 
-  sass-embedded@1.98.0:
+  sass-embedded@1.99.0:
     dependencies:
       '@bufbuild/protobuf': 2.11.0
       colorjs.io: 0.5.2
@@ -7372,26 +7376,26 @@ snapshots:
       sync-child-process: 1.0.2
       varint: 6.0.0
     optionalDependencies:
-      sass-embedded-all-unknown: 1.98.0
-      sass-embedded-android-arm: 1.98.0
-      sass-embedded-android-arm64: 1.98.0
-      sass-embedded-android-riscv64: 1.98.0
-      sass-embedded-android-x64: 1.98.0
-      sass-embedded-darwin-arm64: 1.98.0
-      sass-embedded-darwin-x64: 1.98.0
-      sass-embedded-linux-arm: 1.98.0
-      sass-embedded-linux-arm64: 1.98.0
-      sass-embedded-linux-musl-arm: 1.98.0
-      sass-embedded-linux-musl-arm64: 1.98.0
-      sass-embedded-linux-musl-riscv64: 1.98.0
-      sass-embedded-linux-musl-x64: 1.98.0
-      sass-embedded-linux-riscv64: 1.98.0
-      sass-embedded-linux-x64: 1.98.0
-      sass-embedded-unknown-all: 1.98.0
-      sass-embedded-win32-arm64: 1.98.0
-      sass-embedded-win32-x64: 1.98.0
-
-  sass@1.98.0:
+      sass-embedded-all-unknown: 1.99.0
+      sass-embedded-android-arm: 1.99.0
+      sass-embedded-android-arm64: 1.99.0
+      sass-embedded-android-riscv64: 1.99.0
+      sass-embedded-android-x64: 1.99.0
+      sass-embedded-darwin-arm64: 1.99.0
+      sass-embedded-darwin-x64: 1.99.0
+      sass-embedded-linux-arm: 1.99.0
+      sass-embedded-linux-arm64: 1.99.0
+      sass-embedded-linux-musl-arm: 1.99.0
+      sass-embedded-linux-musl-arm64: 1.99.0
+      sass-embedded-linux-musl-riscv64: 1.99.0
+      sass-embedded-linux-musl-x64: 1.99.0
+      sass-embedded-linux-riscv64: 1.99.0
+      sass-embedded-linux-x64: 1.99.0
+      sass-embedded-unknown-all: 1.99.0
+      sass-embedded-win32-arm64: 1.99.0
+      sass-embedded-win32-x64: 1.99.0
+
+  sass@1.99.0:
     dependencies:
       chokidar: 4.0.3
       immutable: 5.1.5
@@ -7439,7 +7443,7 @@ snapshots:
 
   shebang-regex@3.0.0: {}
 
-  side-channel-list@1.0.0:
+  side-channel-list@1.0.1:
     dependencies:
       es-errors: 1.3.0
       object-inspect: 1.13.4
@@ -7463,7 +7467,7 @@ snapshots:
     dependencies:
       es-errors: 1.3.0
       object-inspect: 1.13.4
-      side-channel-list: 1.0.0
+      side-channel-list: 1.0.1
       side-channel-map: 1.0.1
       side-channel-weakmap: 1.0.2
 
@@ -7531,7 +7535,7 @@ snapshots:
       call-bind: 1.0.8
       call-bound: 1.0.4
       define-properties: 1.2.1
-      es-abstract: 1.24.1
+      es-abstract: 1.24.2
       es-errors: 1.3.0
       es-object-atoms: 1.1.1
       get-intrinsic: 1.3.0
@@ -7545,7 +7549,7 @@ snapshots:
   string.prototype.repeat@1.0.0:
     dependencies:
       define-properties: 1.2.1
-      es-abstract: 1.24.1
+      es-abstract: 1.24.2
 
   string.prototype.trim@1.2.10:
     dependencies:
@@ -7553,7 +7557,7 @@ snapshots:
       call-bound: 1.0.4
       define-data-property: 1.1.4
       define-properties: 1.2.1
-      es-abstract: 1.24.1
+      es-abstract: 1.24.2
       es-object-atoms: 1.1.1
       has-property-descriptors: 1.0.2
 
@@ -7586,26 +7590,26 @@ snapshots:
 
   strip-json-comments@3.1.1: {}
 
-  stylelint-config-recommended-scss@17.0.0(postcss@8.5.8)(stylelint@17.6.0(typescript@5.9.3)):
+  stylelint-config-recommended-scss@17.0.1(postcss@8.5.9)(stylelint@17.6.0(typescript@5.9.3)):
     dependencies:
-      postcss-scss: 4.0.9(postcss@8.5.8)
+      postcss-scss: 4.0.9(postcss@8.5.9)
       stylelint: 17.6.0(typescript@5.9.3)
       stylelint-config-recommended: 18.0.0(stylelint@17.6.0(typescript@5.9.3))
       stylelint-scss: 7.0.0(stylelint@17.6.0(typescript@5.9.3))
     optionalDependencies:
-      postcss: 8.5.8
+      postcss: 8.5.9
 
   stylelint-config-recommended@18.0.0(stylelint@17.6.0(typescript@5.9.3)):
     dependencies:
       stylelint: 17.6.0(typescript@5.9.3)
 
-  stylelint-config-standard-scss@17.0.0(postcss@8.5.8)(stylelint@17.6.0(typescript@5.9.3)):
+  stylelint-config-standard-scss@17.0.0(postcss@8.5.9)(stylelint@17.6.0(typescript@5.9.3)):
     dependencies:
       stylelint: 17.6.0(typescript@5.9.3)
-      stylelint-config-recommended-scss: 17.0.0(postcss@8.5.8)(stylelint@17.6.0(typescript@5.9.3))
+      stylelint-config-recommended-scss: 17.0.1(postcss@8.5.9)(stylelint@17.6.0(typescript@5.9.3))
       stylelint-config-standard: 40.0.0(stylelint@17.6.0(typescript@5.9.3))
     optionalDependencies:
-      postcss: 8.5.8
+      postcss: 8.5.9
 
   stylelint-config-standard@40.0.0(stylelint@17.6.0(typescript@5.9.3)):
     dependencies:
@@ -7614,8 +7618,8 @@ snapshots:
 
   stylelint-order@8.1.1(stylelint@17.6.0(typescript@5.9.3)):
     dependencies:
-      postcss: 8.5.8
-      postcss-sorting: 10.0.0(postcss@8.5.8)
+      postcss: 8.5.9
+      postcss-sorting: 10.0.0(postcss@8.5.9)
       stylelint: 17.6.0(typescript@5.9.3)
 
   stylelint-scss@7.0.0(stylelint@17.6.0(typescript@5.9.3)):
@@ -7659,8 +7663,8 @@ snapshots:
       micromatch: 4.0.8
       normalize-path: 3.0.0
       picocolors: 1.1.1
-      postcss: 8.5.8
-      postcss-safe-parser: 7.0.1(postcss@8.5.8)
+      postcss: 8.5.9
+      postcss-safe-parser: 7.0.1(postcss@8.5.9)
       postcss-selector-parser: 7.1.1
       postcss-value-parser: 4.2.0
       string-width: 8.2.0
@@ -7715,9 +7719,9 @@ snapshots:
 
   tinybench@2.9.0: {}
 
-  tinyexec@1.0.4: {}
+  tinyexec@1.1.1: {}
 
-  tinyglobby@0.2.15:
+  tinyglobby@0.2.16:
     dependencies:
       fdir: 6.5.0(picomatch@4.0.4)
       picomatch: 4.0.4
@@ -7726,15 +7730,15 @@ snapshots:
 
   tldts-core@6.1.86: {}
 
-  tldts-core@7.0.27: {}
+  tldts-core@7.0.28: {}
 
   tldts@6.1.86:
     dependencies:
       tldts-core: 6.1.86
 
-  tldts@7.0.27:
+  tldts@7.0.28:
     dependencies:
-      tldts-core: 7.0.27
+      tldts-core: 7.0.28
 
   to-regex-range@5.0.1:
     dependencies:
@@ -7755,7 +7759,7 @@ snapshots:
 
   tough-cookie@6.0.1:
     dependencies:
-      tldts: 7.0.27
+      tldts: 7.0.28
 
   tr46@5.1.1:
     dependencies:
@@ -7825,19 +7829,19 @@ snapshots:
       icss-replace-symbols: 1.1.0
       is-there: 4.5.2
       mkdirp: 3.0.1
-      postcss: 8.5.8
-      postcss-modules-extract-imports: 3.1.0(postcss@8.5.8)
-      postcss-modules-local-by-default: 4.2.0(postcss@8.5.8)
-      postcss-modules-scope: 3.2.1(postcss@8.5.8)
-      postcss-modules-values: 4.0.0(postcss@8.5.8)
+      postcss: 8.5.9
+      postcss-modules-extract-imports: 3.1.0(postcss@8.5.9)
+      postcss-modules-local-by-default: 4.2.0(postcss@8.5.9)
+      postcss-modules-scope: 3.2.1(postcss@8.5.9)
+      postcss-modules-values: 4.0.0(postcss@8.5.9)
       yargs: 17.7.2
 
-  typescript-eslint@8.57.2(eslint@9.39.4)(typescript@5.9.3):
+  typescript-eslint@8.58.1(eslint@9.39.4)(typescript@5.9.3):
     dependencies:
-      '@typescript-eslint/eslint-plugin': 8.57.2(@typescript-eslint/parser@8.57.2(eslint@9.39.4)(typescript@5.9.3))(eslint@9.39.4)(typescript@5.9.3)
-      '@typescript-eslint/parser': 8.57.2(eslint@9.39.4)(typescript@5.9.3)
-      '@typescript-eslint/typescript-estree': 8.57.2(typescript@5.9.3)
-      '@typescript-eslint/utils': 8.57.2(eslint@9.39.4)(typescript@5.9.3)
+      '@typescript-eslint/eslint-plugin': 8.58.1(@typescript-eslint/parser@8.58.1(eslint@9.39.4)(typescript@5.9.3))(eslint@9.39.4)(typescript@5.9.3)
+      '@typescript-eslint/parser': 8.58.1(eslint@9.39.4)(typescript@5.9.3)
+      '@typescript-eslint/typescript-estree': 8.58.1(typescript@5.9.3)
+      '@typescript-eslint/utils': 8.58.1(eslint@9.39.4)(typescript@5.9.3)
       eslint: 9.39.4
       typescript: 5.9.3
     transitivePeerDependencies:
@@ -7856,7 +7860,7 @@ snapshots:
 
   undici-types@7.16.0: {}
 
-  undici@7.24.6: {}
+  undici@7.24.7: {}
 
   unicorn-magic@0.4.0: {}
 
@@ -7864,9 +7868,9 @@ snapshots:
 
   universalify@0.2.0: {}
 
-  update-browserslist-db@1.2.3(browserslist@4.28.1):
+  update-browserslist-db@1.2.3(browserslist@4.28.2):
     dependencies:
-      browserslist: 4.28.1
+      browserslist: 4.28.2
       escalade: 3.2.0
       picocolors: 1.1.1
 
@@ -7886,47 +7890,47 @@ snapshots:
 
   util-deprecate@1.0.2: {}
 
-  vanilla-framework@4.46.0(sass@1.98.0):
+  vanilla-framework@4.46.0(sass@1.99.0):
     dependencies:
-      sass: 1.98.0
+      sass: 1.99.0
 
   varint@6.0.0: {}
 
-  vite@7.3.1(@types/node@24.12.0)(lightningcss@1.32.0)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1):
+  vite@7.3.2(@types/node@24.12.0)(lightningcss@1.32.0)(sass-embedded@1.99.0)(sass@1.99.0)(yaml@2.8.1):
     dependencies:
-      esbuild: 0.27.4
+      esbuild: 0.27.7
       fdir: 6.5.0(picomatch@4.0.4)
       picomatch: 4.0.4
-      postcss: 8.5.8
-      rollup: 4.60.0
-      tinyglobby: 0.2.15
+      postcss: 8.5.9
+      rollup: 4.60.1
+      tinyglobby: 0.2.16
     optionalDependencies:
       '@types/node': 24.12.0
       fsevents: 2.3.3
       lightningcss: 1.32.0
-      sass: 1.98.0
-      sass-embedded: 1.98.0
+      sass: 1.99.0
+      sass-embedded: 1.99.0
       yaml: 2.8.1
 
-  vite@8.0.3(@types/node@24.12.0)(esbuild@0.27.4)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1):
+  vite@8.0.7(@types/node@24.12.0)(esbuild@0.27.7)(sass-embedded@1.99.0)(sass@1.99.0)(yaml@2.8.1):
     dependencies:
       lightningcss: 1.32.0
       picomatch: 4.0.4
-      postcss: 8.5.8
-      rolldown: 1.0.0-rc.12
-      tinyglobby: 0.2.15
+      postcss: 8.5.9
+      rolldown: 1.0.0-rc.13
+      tinyglobby: 0.2.16
     optionalDependencies:
       '@types/node': 24.12.0
-      esbuild: 0.27.4
+      esbuild: 0.27.7
       fsevents: 2.3.3
-      sass: 1.98.0
-      sass-embedded: 1.98.0
+      sass: 1.99.0
+      sass-embedded: 1.99.0
       yaml: 2.8.1
 
-  vitest@4.0.18(@types/node@24.12.0)(jsdom@29.0.1)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1):
+  vitest@4.0.18(@types/node@24.12.0)(jsdom@29.0.2)(lightningcss@1.32.0)(msw@2.4.11(typescript@5.9.3))(sass-embedded@1.99.0)(sass@1.99.0)(yaml@2.8.1):
     dependencies:
       '@vitest/expect': 4.0.18
-      '@vitest/mocker': 4.0.18(msw@2.4.11(typescript@5.9.3))(vite@7.3.1(@types/node@24.12.0)(lightningcss@1.32.0)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1))
+      '@vitest/mocker': 4.0.18(msw@2.4.11(typescript@5.9.3))(vite@7.3.2(@types/node@24.12.0)(lightningcss@1.32.0)(sass-embedded@1.99.0)(sass@1.99.0)(yaml@2.8.1))
       '@vitest/pretty-format': 4.0.18
       '@vitest/runner': 4.0.18
       '@vitest/snapshot': 4.0.18
@@ -7940,14 +7944,14 @@ snapshots:
       picomatch: 4.0.4
       std-env: 3.10.0
       tinybench: 2.9.0
-      tinyexec: 1.0.4
-      tinyglobby: 0.2.15
+      tinyexec: 1.1.1
+      tinyglobby: 0.2.16
       tinyrainbow: 3.1.0
-      vite: 7.3.1(@types/node@24.12.0)(lightningcss@1.32.0)(sass-embedded@1.98.0)(sass@1.98.0)(yaml@2.8.1)
+      vite: 7.3.2(@types/node@24.12.0)(lightningcss@1.32.0)(sass-embedded@1.99.0)(sass@1.99.0)(yaml@2.8.1)
       why-is-node-running: 2.3.0
     optionalDependencies:
       '@types/node': 24.12.0
-      jsdom: 29.0.1
+      jsdom: 29.0.2
     transitivePeerDependencies:
       - jiti
       - less

From cb8438c0ec771407f8c571328f9fd07ab1614e50 Mon Sep 17 00:00:00 2001
From: Ethan Shaw <ethan.shaw@canonical.com>
Date: Thu, 9 Apr 2026 07:40:44 -0700
Subject: [PATCH 08/42] Refactor instance modals (#531)

## Summary

The shut down and restart modals would not close after submitting.

Now, you can also specify the delivery time for the instances page
actions.

## Release Impact

According to the [Landscape Server Release
Cycle](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `dev` / `main` (Beta)
- **Version Impact**:
  - [ ] Patch (Fix)
  - [x] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [x] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [x] **UI Verified**: I have verified the changes locally.
- [x] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.
---
 .changeset/nine-kings-divide.md               |   5 +
 .../InstancesPageActions.test.tsx             |  17 +-
 .../InstancesPageActions.tsx                  | 118 ++-----------
 .../components/RestartModal/RestartModal.tsx  | 105 ++++++++++++
 .../components/RestartModal/index.ts          |   1 +
 .../ShutDownModal/ShutDownModal.tsx           | 106 ++++++++++++
 .../components/ShutDownModal/index.ts         |   1 +
 src/features/instances/constants.ts           |  25 +++
 src/features/instances/index.ts               |   2 +
 .../tabs/info/InfoPanel/InfoPanel.tsx         | 156 +++---------------
 .../[single]/tabs/info/InfoPanel/constants.ts |  28 ----
 11 files changed, 298 insertions(+), 266 deletions(-)
 create mode 100644 .changeset/nine-kings-divide.md
 create mode 100644 src/features/instances/components/RestartModal/RestartModal.tsx
 create mode 100644 src/features/instances/components/RestartModal/index.ts
 create mode 100644 src/features/instances/components/ShutDownModal/ShutDownModal.tsx
 create mode 100644 src/features/instances/components/ShutDownModal/index.ts
 delete mode 100644 src/pages/dashboard/instances/[single]/tabs/info/InfoPanel/constants.ts

diff --git a/.changeset/nine-kings-divide.md b/.changeset/nine-kings-divide.md
new file mode 100644
index 000000000..c0429699f
--- /dev/null
+++ b/.changeset/nine-kings-divide.md
@@ -0,0 +1,5 @@
+---
+"landscape-ui": minor
+---
+
+Update instance modals
diff --git a/src/features/instances/components/InstancesPageActions/InstancesPageActions.test.tsx b/src/features/instances/components/InstancesPageActions/InstancesPageActions.test.tsx
index 3d1aa7dd8..7c4633f35 100644
--- a/src/features/instances/components/InstancesPageActions/InstancesPageActions.test.tsx
+++ b/src/features/instances/components/InstancesPageActions/InstancesPageActions.test.tsx
@@ -6,6 +6,7 @@ import { screen, within } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { beforeEach } from "vitest";
 import InstancesPageActions from "./InstancesPageActions";
+import { pluralizeWithCount } from "@/utils/_helpers";
 
 const selected = instances.slice(0, 2);
 
@@ -150,7 +151,7 @@ describe("InstancesPageActions", () => {
       await userEvent.click(screen.getByRole("button", { name: /shut down/i }));
 
       const dialog = screen.getByRole("dialog", {
-        name: /shutting down selected instances/i,
+        name: `Shut down ${pluralizeWithCount(selected.length, "instance")}`,
       });
 
       expect(dialog).toBeInTheDocument();
@@ -159,14 +160,18 @@ describe("InstancesPageActions", () => {
         within(dialog).getByRole("button", { name: /shut down/i }),
       );
 
-      screen.getByText("Selected instances have been queued for shutdown.");
+      screen.getByText(
+        `You queued ${pluralizeWithCount(selected.length, "instance")} to be shut down.`,
+      );
+
+      expect(dialog).not.toBeInTheDocument();
     });
 
     it("'Restart' button", async () => {
       await userEvent.click(screen.getByRole("button", { name: /restart/i }));
 
       const dialog = screen.getByRole("dialog", {
-        name: /restarting selected instances/i,
+        name: `Restart ${pluralizeWithCount(selected.length, "instance")}`,
       });
 
       expect(dialog).toBeInTheDocument();
@@ -175,7 +180,11 @@ describe("InstancesPageActions", () => {
         within(dialog).getByRole("button", { name: /restart/i }),
       );
 
-      screen.getByText("Selected instances have been queued for reboot.");
+      screen.getByText(
+        `You queued ${pluralizeWithCount(selected.length, "instance")} to be restarted.`,
+      );
+
+      expect(dialog).not.toBeInTheDocument();
     });
 
     it("'Run script' button", async () => {
diff --git a/src/features/instances/components/InstancesPageActions/InstancesPageActions.tsx b/src/features/instances/components/InstancesPageActions/InstancesPageActions.tsx
index 39720c6bb..c11cad22c 100644
--- a/src/features/instances/components/InstancesPageActions/InstancesPageActions.tsx
+++ b/src/features/instances/components/InstancesPageActions/InstancesPageActions.tsx
@@ -2,11 +2,8 @@ import LoadingState from "@/components/layout/LoadingState";
 import { ResponsiveButtons } from "@/components/ui";
 import PluralizeWithBoldCount from "@/components/ui/PluralizeWithBoldCount";
 import { REPORT_VIEW_ENABLED } from "@/constants";
-import { useActivities } from "@/features/activities";
 import { DetachTokenModal } from "@/features/ubuntupro";
 import useAuth from "@/hooks/useAuth";
-import useDebug from "@/hooks/useDebug";
-import useNotify from "@/hooks/useNotify";
 import useSidePanel from "@/hooks/useSidePanel";
 import type { Instance } from "@/types/Instance";
 import {
@@ -14,20 +11,14 @@ import {
   pluralizeArray,
   pluralizeWithCount,
 } from "@/utils/_helpers";
-import {
-  Button,
-  ConfirmationModal,
-  ContextualMenu,
-  Icon,
-} from "@canonical/react-components";
+import { Button, ContextualMenu, Icon } from "@canonical/react-components";
 import { lazy, memo, Suspense } from "react";
-import { createPortal } from "react-dom";
 import { useBoolean } from "usehooks-ts";
-import { useRestartInstances, useShutDownInstances } from "../../api";
 import { getFeatures, hasUpgrades } from "../../helpers";
 import InstanceRemoveFromLandscapeModal from "../InstanceRemoveFromLandscapeModal";
-import { getNotificationArgs } from "./helpers";
 import classes from "./InstancesPageActions.module.scss";
+import ShutDownModal from "../ShutDownModal";
+import RestartModal from "../RestartModal";
 
 const RunInstanceScriptForm = lazy(async () =>
   import("@/features/scripts").then((module) => ({
@@ -67,10 +58,7 @@ const InstancesPageActions = memo(function InstancesPageActions({
   isGettingInstances,
   selectedInstances,
 }: InstancesPageActionsProps) {
-  const debug = useDebug();
   const { isFeatureEnabled } = useAuth();
-  const { notify } = useNotify();
-  const { openActivityDetails } = useActivities();
   const { setSidePanelContent } = useSidePanel();
 
   const {
@@ -97,9 +85,6 @@ const InstancesPageActions = memo(function InstancesPageActions({
     setFalse: closeRemoveModal,
   } = useBoolean();
 
-  const { restartInstances, isRestartingInstances } = useRestartInstances();
-  const { shutDownInstances, isShuttingDownInstances } = useShutDownInstances();
-
   const createInstanceCountString = (instances: Instance[]) => {
     return (
       <PluralizeWithBoldCount count={instances.length} singular="instance" />
@@ -146,46 +131,6 @@ const InstancesPageActions = memo(function InstancesPageActions({
     );
   };
 
-  const handleShutdownInstance = async () => {
-    try {
-      const { data: shutdownActivity } = await shutDownInstances({
-        computer_ids: selectedInstances.map(({ id }) => id),
-      });
-
-      notify.success(
-        getNotificationArgs({
-          action: "shutdown",
-          onDetailsClick: () => {
-            openActivityDetails(shutdownActivity);
-          },
-          selected: selectedInstances,
-        }),
-      );
-    } catch (error) {
-      debug(error);
-    }
-  };
-
-  const handleRebootInstance = async () => {
-    try {
-      const { data: rebootActivity } = await restartInstances({
-        computer_ids: selectedInstances.map(({ id }) => id),
-      });
-
-      notify.success(
-        getNotificationArgs({
-          action: "reboot",
-          onDetailsClick: () => {
-            openActivityDetails(rebootActivity);
-          },
-          selected: selectedInstances,
-        }),
-      );
-    } catch (error) {
-      debug(error);
-    }
-  };
-
   const handleUpgradesRequest = () => {
     setSidePanelContent(
       "Upgrades",
@@ -287,11 +232,7 @@ const InstancesPageActions = memo(function InstancesPageActions({
             key="shutdown-instances"
             className="has-icon"
             type="button"
-            disabled={
-              isShuttingDownInstances ||
-              0 === selectedInstances.length ||
-              isGettingInstances
-            }
+            disabled={0 === selectedInstances.length || isGettingInstances}
             onClick={openShutdownModal}
           >
             <Icon name="power-off" />
@@ -301,11 +242,7 @@ const InstancesPageActions = memo(function InstancesPageActions({
             key="reboot-instances"
             hasIcon
             type="button"
-            disabled={
-              isRestartingInstances ||
-              0 === selectedInstances.length ||
-              isGettingInstances
-            }
+            disabled={0 === selectedInstances.length || isGettingInstances}
             onClick={openRebootModal}
           >
             <Icon name="restart" />
@@ -423,42 +360,15 @@ const InstancesPageActions = memo(function InstancesPageActions({
         toggleDisabled={0 === selectedInstances.length}
         dropdownProps={{ style: { zIndex: 10 } }}
       />
-      {rebootModalOpen &&
-        createPortal(
-          <ConfirmationModal
-            close={closeRebootModal}
-            title="Restarting selected instances"
-            confirmButtonLabel="Restart"
-            confirmButtonAppearance="negative"
-            confirmButtonLoading={isRestartingInstances}
-            confirmButtonDisabled={isRestartingInstances}
-            onConfirm={handleRebootInstance}
-          >
-            <p>
-              Are you sure you want to restart{" "}
-              {pluralizeWithCount(selectedInstances.length, "instance")}?
-            </p>
-          </ConfirmationModal>,
-          document.body,
-        )}
-      {shutdownModalOpen &&
-        createPortal(
-          <ConfirmationModal
-            close={closeShutdownModal}
-            title="Shutting down selected instances"
-            confirmButtonLabel="Shut down"
-            confirmButtonAppearance="negative"
-            confirmButtonLoading={isShuttingDownInstances}
-            confirmButtonDisabled={isShuttingDownInstances}
-            onConfirm={handleShutdownInstance}
-          >
-            <p>
-              Are you sure you want to shut down{" "}
-              {pluralizeWithCount(selectedInstances.length, "instance")}?
-            </p>
-          </ConfirmationModal>,
-          document.body,
-        )}
+      {rebootModalOpen && (
+        <RestartModal close={closeRebootModal} instances={selectedInstances} />
+      )}
+      {shutdownModalOpen && (
+        <ShutDownModal
+          close={closeShutdownModal}
+          instances={selectedInstances}
+        />
+      )}
       {detachModalOpen && (
         <DetachTokenModal
           isOpen={detachModalOpen}
diff --git a/src/features/instances/components/RestartModal/RestartModal.tsx b/src/features/instances/components/RestartModal/RestartModal.tsx
new file mode 100644
index 000000000..2f93db896
--- /dev/null
+++ b/src/features/instances/components/RestartModal/RestartModal.tsx
@@ -0,0 +1,105 @@
+import {
+  CheckboxInput,
+  ConfirmationModal,
+  Input,
+} from "@canonical/react-components";
+import type { FC } from "react";
+import { useRestartInstances } from "../../api";
+import { getFormikError } from "@/utils/formikErrors";
+import { useFormik } from "formik";
+import useDebug from "@/hooks/useDebug";
+import useNotify from "@/hooks/useNotify";
+import type { Instance } from "@/types/Instance";
+import {
+  REBOOT_OR_SHUT_DOWN_INITIAL_VALUES,
+  REBOOT_OR_SHUT_DOWN_VALIDATION_SCHEMA,
+} from "../../constants";
+import { useActivities } from "@/features/activities";
+import { pluralizeArray } from "@/utils/_helpers";
+
+interface RestartModalProps {
+  readonly close: () => void;
+  readonly instances: Instance[];
+}
+
+const RestartModal: FC<RestartModalProps> = ({ instances, close }) => {
+  const debug = useDebug();
+  const { notify } = useNotify();
+
+  const { openActivityDetails } = useActivities();
+
+  const { restartInstances, isRestartingInstances } = useRestartInstances();
+
+  const title = pluralizeArray(
+    instances,
+    (instance) => instance.title,
+    "instances",
+  );
+
+  const formik = useFormik({
+    initialValues: REBOOT_OR_SHUT_DOWN_INITIAL_VALUES,
+    validationSchema: REBOOT_OR_SHUT_DOWN_VALIDATION_SCHEMA,
+    onSubmit: async (values) => {
+      const valuesToSubmit = {
+        computer_ids: instances.map(({ id }) => id),
+        deliver_after: values.deliverImmediately
+          ? undefined
+          : `${values.deliver_after}:00Z`,
+      };
+
+      try {
+        const { data: activity } = await restartInstances(valuesToSubmit);
+
+        notify.success({
+          title: `You queued ${title} to be restarted.`,
+          message: `An activity is queued to restart ${title}.`,
+          actions: [
+            {
+              label: "View details",
+              onClick: () => {
+                openActivityDetails(activity);
+              },
+            },
+          ],
+        });
+
+        close();
+      } catch (error) {
+        debug(error);
+      }
+    },
+  });
+
+  return (
+    <>
+      <ConfirmationModal
+        close={close}
+        title={`Restart ${title}`}
+        confirmButtonLabel="Restart"
+        confirmButtonLoading={isRestartingInstances}
+        onConfirm={() => {
+          formik.handleSubmit();
+        }}
+        renderInPortal
+      >
+        <CheckboxInput
+          label="Deliver as soon as possible"
+          {...formik.getFieldProps("deliverImmediately")}
+          checked={formik.values.deliverImmediately}
+        />
+        <Input
+          type="datetime-local"
+          label="Schedule time"
+          labelClassName="u-off-screen"
+          placeholder="Scheduled time"
+          {...formik.getFieldProps("deliver_after")}
+          disabled={formik.values.deliverImmediately}
+          error={getFormikError(formik, "deliver_after")}
+        />
+        <p>This will restart {title}.</p>
+      </ConfirmationModal>
+    </>
+  );
+};
+
+export default RestartModal;
diff --git a/src/features/instances/components/RestartModal/index.ts b/src/features/instances/components/RestartModal/index.ts
new file mode 100644
index 000000000..2e1ad0073
--- /dev/null
+++ b/src/features/instances/components/RestartModal/index.ts
@@ -0,0 +1 @@
+export { default } from "./RestartModal";
diff --git a/src/features/instances/components/ShutDownModal/ShutDownModal.tsx b/src/features/instances/components/ShutDownModal/ShutDownModal.tsx
new file mode 100644
index 000000000..190a3d980
--- /dev/null
+++ b/src/features/instances/components/ShutDownModal/ShutDownModal.tsx
@@ -0,0 +1,106 @@
+import {
+  CheckboxInput,
+  ConfirmationModal,
+  Input,
+} from "@canonical/react-components";
+
+import type { FC } from "react";
+import { useShutDownInstances } from "../../api";
+import { getFormikError } from "@/utils/formikErrors";
+import { useFormik } from "formik";
+import useDebug from "@/hooks/useDebug";
+import useNotify from "@/hooks/useNotify";
+import type { Instance } from "@/types/Instance";
+import {
+  REBOOT_OR_SHUT_DOWN_INITIAL_VALUES,
+  REBOOT_OR_SHUT_DOWN_VALIDATION_SCHEMA,
+} from "../../constants";
+import { useActivities } from "@/features/activities";
+import { pluralizeArray } from "@/utils/_helpers";
+
+interface ShutDownModalProps {
+  readonly close: () => void;
+  readonly instances: Instance[];
+}
+
+const ShutDownModal: FC<ShutDownModalProps> = ({ instances, close }) => {
+  const debug = useDebug();
+  const { notify } = useNotify();
+
+  const { openActivityDetails } = useActivities();
+
+  const { shutDownInstances, isShuttingDownInstances } = useShutDownInstances();
+
+  const title = pluralizeArray(
+    instances,
+    (instance) => instance.title,
+    "instances",
+  );
+
+  const formik = useFormik({
+    initialValues: REBOOT_OR_SHUT_DOWN_INITIAL_VALUES,
+    validationSchema: REBOOT_OR_SHUT_DOWN_VALIDATION_SCHEMA,
+    onSubmit: async (values) => {
+      const valuesToSubmit = {
+        computer_ids: instances.map(({ id }) => id),
+        deliver_after: values.deliverImmediately
+          ? undefined
+          : `${values.deliver_after}:00Z`,
+      };
+
+      try {
+        const { data: activity } = await shutDownInstances(valuesToSubmit);
+
+        notify.success({
+          title: `You queued ${title} to be shut down.`,
+          message: `An activity is queued to shut down ${title}.`,
+          actions: [
+            {
+              label: "View details",
+              onClick: () => {
+                openActivityDetails(activity);
+              },
+            },
+          ],
+        });
+
+        close();
+      } catch (error) {
+        debug(error);
+      }
+    },
+  });
+
+  return (
+    <>
+      <ConfirmationModal
+        close={close}
+        title={`Shut down ${title}`}
+        confirmButtonLabel="Shut down"
+        confirmButtonLoading={isShuttingDownInstances}
+        onConfirm={() => {
+          formik.handleSubmit();
+        }}
+        renderInPortal
+      >
+        <CheckboxInput
+          label="Deliver as soon as possible"
+          {...formik.getFieldProps("deliverImmediately")}
+          checked={formik.values.deliverImmediately}
+        />
+        <Input
+          type="datetime-local"
+          label="Schedule time"
+          labelClassName="u-off-screen"
+          placeholder="Scheduled time"
+          {...formik.getFieldProps("deliver_after")}
+          disabled={formik.values.deliverImmediately}
+          error={getFormikError(formik, "deliver_after")}
+        />
+        <p>This will shut down {title}.</p>
+      </ConfirmationModal>
+    </>
+  );
+};
+
+export default ShutDownModal;
diff --git a/src/features/instances/components/ShutDownModal/index.ts b/src/features/instances/components/ShutDownModal/index.ts
new file mode 100644
index 000000000..fd5f1b7ac
--- /dev/null
+++ b/src/features/instances/components/ShutDownModal/index.ts
@@ -0,0 +1 @@
+export { default } from "./ShutDownModal";
diff --git a/src/features/instances/constants.ts b/src/features/instances/constants.ts
index 964725835..caaa8ccb4 100644
--- a/src/features/instances/constants.ts
+++ b/src/features/instances/constants.ts
@@ -1,6 +1,8 @@
 import type { ListFilter } from "@/types/Filters";
 import type { SelectOption } from "@/types/SelectOption";
 import type { Status } from "./types";
+import * as Yup from "yup";
+import moment from "moment";
 
 export const STATUS_FILTERS = {
   Online: {
@@ -227,3 +229,26 @@ export const FILTERS = {
     ],
   },
 } as const satisfies Record<FilterKey, ListFilter>;
+
+export const REBOOT_OR_SHUT_DOWN_INITIAL_VALUES = {
+  deliver_after: "",
+  deliverImmediately: true,
+};
+
+export const REBOOT_OR_SHUT_DOWN_VALIDATION_SCHEMA = Yup.object().shape({
+  deliver_after: Yup.string().when("deliverImmediately", {
+    is: false,
+    then: (schema) =>
+      schema
+        .required("This field is required")
+        .test({
+          message: "Invalid date",
+          test: (value) => moment(value).isValid(),
+        })
+        .test({
+          message: "Date must be in the future",
+          test: (value) => moment(value).isAfter(),
+        }),
+  }),
+  deliverImmediately: Yup.boolean(),
+});
diff --git a/src/features/instances/index.ts b/src/features/instances/index.ts
index 47bd0b021..f128c88a0 100644
--- a/src/features/instances/index.ts
+++ b/src/features/instances/index.ts
@@ -23,3 +23,5 @@ export { default as RegenerateRecoveryKeyModal } from "./components/RegenerateRe
 export { default as ViewRecoveryKeyModal } from "./components/ViewRecoveryKeyModal";
 export type { Status, RecoveryKey, DistributionUpgradeTarget } from "./types";
 export { default as useInstanceSearchHelpTerms } from "./components/InstancesHeader/hooks/useInstanceSearchHelpTerms";
+export { default as RestartModal } from "./components/RestartModal";
+export { default as ShutDownModal } from "./components/ShutDownModal";
diff --git a/src/pages/dashboard/instances/[single]/tabs/info/InfoPanel/InfoPanel.tsx b/src/pages/dashboard/instances/[single]/tabs/info/InfoPanel/InfoPanel.tsx
index b778c5954..e211af953 100644
--- a/src/pages/dashboard/instances/[single]/tabs/info/InfoPanel/InfoPanel.tsx
+++ b/src/pages/dashboard/instances/[single]/tabs/info/InfoPanel/InfoPanel.tsx
@@ -20,10 +20,9 @@ import {
   RecoveryKeyStatus,
   RegenerateRecoveryKeyModal,
   useGetRecoveryKey,
-  useRestartInstances,
   useSanitizeInstance,
-  useShutDownInstances,
   ViewRecoveryKeyModal,
+  ShutDownModal,
 } from "@/features/instances";
 import {
   WslInstanceReinstallModal,
@@ -42,29 +41,23 @@ import type {
   WslInstance,
 } from "@/types/Instance";
 import { hasOneItem } from "@/utils/_helpers";
-import { getFormikError } from "@/utils/formikErrors";
 import {
   Button,
-  CheckboxInput,
   ConfirmationModal,
-  Form,
   Icon,
   ICONS,
-  Input,
   Tooltip,
 } from "@canonical/react-components";
 import classNames from "classnames";
-import { useFormik } from "formik";
 import moment from "moment";
 import type { FC } from "react";
 import { Fragment, lazy, Suspense } from "react";
 import { useNavigate } from "react-router";
 import { useBoolean } from "usehooks-ts";
 import ProfileLink from "../ProfileLink";
-import { INITIAL_VALUES, VALIDATION_SCHEMA } from "./constants";
 import { getInstanceKeyForRemount } from "./helpers";
 import classes from "./InfoPanel.module.scss";
-import type { ModalConfirmationFormProps } from "./types";
+import { RestartModal } from "@/features/instances";
 
 const EditInstance = lazy(
   async () =>
@@ -98,7 +91,6 @@ const InfoPanel: FC<InfoPanelProps> = ({ instance }) => {
     { id: instance.employee_id ?? 0 },
     { enabled: !!instance.employee_id },
   );
-  const { restartInstances, isRestartingInstances } = useRestartInstances();
   const { recoveryKey, recoveryKeyActivityStatus, isRecoveryKeyFetched } =
     useGetRecoveryKey(instance.id);
   const isRecoveryKeyGenerationActivityInProgress =
@@ -110,7 +102,6 @@ const InfoPanel: FC<InfoPanelProps> = ({ instance }) => {
     );
   const { getAccessGroupQuery } = useRoles();
   const { sanitizeInstance, isSanitizingInstance } = useSanitizeInstance();
-  const { shutDownInstances, isShuttingDownInstances } = useShutDownInstances();
   const { disassociateEmployeeFromInstance, isDisassociating } =
     useDisassociateEmployeeFromInstance();
 
@@ -177,50 +168,6 @@ const InfoPanel: FC<InfoPanelProps> = ({ instance }) => {
   const { data: getAccessGroupQueryResult, isPending: isGettingAccessGroups } =
     getAccessGroupQuery();
 
-  const handleSubmit = async (values: ModalConfirmationFormProps) => {
-    if (!values.action) {
-      return;
-    }
-
-    const valuesToSubmit = {
-      computer_ids: [instance.id],
-      deliver_after: values.deliverImmediately
-        ? undefined
-        : `${values.deliver_after}:00Z`,
-    };
-
-    try {
-      const { data: activity } =
-        values.action === "reboot"
-          ? await restartInstances(valuesToSubmit)
-          : await shutDownInstances(valuesToSubmit);
-
-      const notificationVerb =
-        values.action === "reboot" ? "restarted" : "shut down";
-
-      notify.success({
-        title: `You queued "${instance.title}" to be ${notificationVerb}`,
-        message: `Instance "${instance.title}" will be ${notificationVerb} and is queued in Activities`,
-        actions: [
-          {
-            label: "View details",
-            onClick: () => {
-              openActivityDetails(activity);
-            },
-          },
-        ],
-      });
-    } catch (error) {
-      debug(error);
-    }
-  };
-
-  const formik = useFormik({
-    initialValues: INITIAL_VALUES,
-    validationSchema: VALIDATION_SCHEMA,
-    onSubmit: handleSubmit,
-  });
-
   if (isGettingAccessGroups || isGettingEmployee) {
     return <LoadingState />;
   }
@@ -309,11 +256,6 @@ const InfoPanel: FC<InfoPanelProps> = ({ instance }) => {
     }
   };
 
-  const handleFormSubmit = async (action: "reboot" | "shutdown") => {
-    await formik.setFieldValue("action", action);
-    formik.handleSubmit();
-  };
-
   const goBack = () => {
     navigate(ROUTES.instances.root(), { replace: true });
   };
@@ -337,6 +279,27 @@ const InfoPanel: FC<InfoPanelProps> = ({ instance }) => {
     shouldShowRecoveryKeyActions &&
     (hasRecoveryKey || isRecoveryKeyGenerationActivityInProgress);
 
+  const getProfilesValue = () => {
+    if (!instance.profiles?.length) {
+      return null;
+    }
+
+    if (hasOneItem(instance.profiles)) {
+      return <ProfileLink profile={instance.profiles[0]} />;
+    }
+
+    return (
+      <Button
+        type="button"
+        className="u-no-margin"
+        appearance="link"
+        onClick={openProfilesList}
+      >
+        {instance.profiles.length} profiles
+      </Button>
+    );
+  };
+
   return (
     <>
       <HeaderActions
@@ -487,22 +450,7 @@ const InfoPanel: FC<InfoPanelProps> = ({ instance }) => {
             />
             <InfoGrid.Item
               label="Profiles"
-              value={
-                !instance.profiles?.length ? null : hasOneItem(
-                    instance.profiles,
-                  ) ? (
-                  <ProfileLink profile={instance.profiles[0]} />
-                ) : (
-                  <Button
-                    type="button"
-                    className="u-no-margin"
-                    appearance="link"
-                    onClick={openProfilesList}
-                  >
-                    {instance.profiles.length} profiles
-                  </Button>
-                )
-              }
+              value={getProfilesValue()}
               type="truncated"
             />
             {getFeatures(instance).employees && (
@@ -599,63 +547,11 @@ const InfoPanel: FC<InfoPanelProps> = ({ instance }) => {
       </Blocks>
 
       {isRestartModalOpen && (
-        <ConfirmationModal
-          close={closeRestartModal}
-          title="Restart instance"
-          confirmButtonLabel="Restart"
-          confirmButtonAppearance="positive"
-          confirmButtonDisabled={isRestartingInstances}
-          confirmButtonLoading={isRestartingInstances}
-          onConfirm={async () => handleFormSubmit("reboot")}
-        >
-          <Form onSubmit={async () => handleFormSubmit("reboot")} noValidate>
-            <CheckboxInput
-              label="Deliver as soon as possible"
-              {...formik.getFieldProps("deliverImmediately")}
-              checked={formik.values.deliverImmediately}
-            />
-            <Input
-              type="datetime-local"
-              label="Schedule time"
-              labelClassName="u-off-screen"
-              placeholder="Scheduled time"
-              {...formik.getFieldProps("deliver_after")}
-              disabled={formik.values.deliverImmediately}
-              error={getFormikError(formik, "deliver_after")}
-            />
-            <p>This will restart &quot;{instance.title}&quot; instance.</p>
-          </Form>
-        </ConfirmationModal>
+        <RestartModal instances={[instance]} close={closeRestartModal} />
       )}
 
       {isShutDownModalOpen && (
-        <ConfirmationModal
-          close={closeShutDownModal}
-          title="Shut down instance"
-          confirmButtonLabel="Shut down"
-          confirmButtonAppearance="positive"
-          confirmButtonDisabled={isShuttingDownInstances}
-          confirmButtonLoading={isShuttingDownInstances}
-          onConfirm={async () => handleFormSubmit("shutdown")}
-        >
-          <Form onSubmit={async () => handleFormSubmit("shutdown")} noValidate>
-            <CheckboxInput
-              label="Deliver as soon as possible"
-              {...formik.getFieldProps("deliverImmediately")}
-              checked={formik.values.deliverImmediately}
-            />
-            <Input
-              type="datetime-local"
-              label="Schedule time"
-              labelClassName="u-off-screen"
-              placeholder="Scheduled time"
-              {...formik.getFieldProps("deliver_after")}
-              disabled={formik.values.deliverImmediately}
-              error={getFormikError(formik, "deliver_after")}
-            />
-            <p>This will shut down &quot;{instance.title}&quot; instance.</p>
-          </Form>
-        </ConfirmationModal>
+        <ShutDownModal instances={[instance]} close={closeShutDownModal} />
       )}
 
       {disassociateModalOpen && (
diff --git a/src/pages/dashboard/instances/[single]/tabs/info/InfoPanel/constants.ts b/src/pages/dashboard/instances/[single]/tabs/info/InfoPanel/constants.ts
deleted file mode 100644
index 79c1f6bd9..000000000
--- a/src/pages/dashboard/instances/[single]/tabs/info/InfoPanel/constants.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-import type { ModalConfirmationFormProps } from "./types";
-import * as Yup from "yup";
-import moment from "moment";
-
-export const INITIAL_VALUES: ModalConfirmationFormProps = {
-  deliver_after: "",
-  deliverImmediately: true,
-  action: null,
-};
-
-export const VALIDATION_SCHEMA = Yup.object().shape({
-  deliver_after: Yup.string().when("deliverImmediately", {
-    is: false,
-    then: (schema) =>
-      schema
-        .required("This field is required")
-        .test({
-          message: "Invalid date",
-          test: (value) => moment(value).isValid(),
-        })
-        .test({
-          message: "Date must be in the future",
-          test: (value) => moment(value).isAfter(),
-        }),
-  }),
-  deliverImmediately: Yup.boolean(),
-  action: Yup.mixed().oneOf(["shutdown", "reboot"]).required(),
-});

From f5bcbba6ab63c411c72e83397c307079aef8c57e Mon Sep 17 00:00:00 2001
From: Rubin Aga <66167934+rubinaga@users.noreply.github.com>
Date: Mon, 13 Apr 2026 17:54:14 +0200
Subject: [PATCH 09/42] fix: adjust z-index values for side panel and dropdown
 elements (#538)

## Summary

This PR is related to [this Jira
ticket](https://warthogs.atlassian.net/browse/LNDENG-4050)

Additionally it fixes this UI bug that is not shown in that ticket:

<img width="2078" height="935" alt="image"
src="https://github.com/user-attachments/assets/c0582c8b-1ea6-419f-9620-17562cfbea81"
/>

## Release Impact

According to the [Landscape Server Release
Cycle](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `dev` / `main` (Beta)
- **Version Impact**:
  - [x] Patch (Fix)
  - [ ] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [x] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [x] **UI Verified**: I have verified the changes locally.
- [x] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.
---
 .changeset/soft-lemons-train.md                              | 5 +++++
 src/components/layout/SidePanel/SidePanel.module.scss        | 1 +
 .../SearchBoxWithSavedSearches.module.scss                   | 1 +
 src/styles/partials/elevation.scss                           | 1 +
 src/styles/partials/layout.scss                              | 2 +-
 5 files changed, 9 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/soft-lemons-train.md

diff --git a/.changeset/soft-lemons-train.md b/.changeset/soft-lemons-train.md
new file mode 100644
index 000000000..8a311d728
--- /dev/null
+++ b/.changeset/soft-lemons-train.md
@@ -0,0 +1,5 @@
+---
+"landscape-ui": patch
+---
+
+Fix bug causing saved searches dropdown to appear above wide sidepanels and modals
diff --git a/src/components/layout/SidePanel/SidePanel.module.scss b/src/components/layout/SidePanel/SidePanel.module.scss
index 1ccd6e99a..8979a5283 100644
--- a/src/components/layout/SidePanel/SidePanel.module.scss
+++ b/src/components/layout/SidePanel/SidePanel.module.scss
@@ -10,6 +10,7 @@
   flex-direction: column;
   overflow: visible;
   padding-bottom: 0;
+  z-index: var(--z-sidepanel);
 }
 
 .medium {
diff --git a/src/features/saved-searches/components/SearchBoxWithSavedSearches/SearchBoxWithSavedSearches.module.scss b/src/features/saved-searches/components/SearchBoxWithSavedSearches/SearchBoxWithSavedSearches.module.scss
index 44ac4b9d9..19c0439b8 100644
--- a/src/features/saved-searches/components/SearchBoxWithSavedSearches/SearchBoxWithSavedSearches.module.scss
+++ b/src/features/saved-searches/components/SearchBoxWithSavedSearches/SearchBoxWithSavedSearches.module.scss
@@ -8,6 +8,7 @@
 
   & + :global(.p-search-and-filter__panel) {
     background-color: $colors--theme--background-default;
+    z-index: var(--z-page-dropdown);
   }
 }
 
diff --git a/src/styles/partials/elevation.scss b/src/styles/partials/elevation.scss
index 809adef05..2db17991a 100644
--- a/src/styles/partials/elevation.scss
+++ b/src/styles/partials/elevation.scss
@@ -6,6 +6,7 @@
   --z-table-corner: 250;
   --z-sticky: 300;
   --z-application: 350;
+  --z-page-dropdown: 375;
   --z-sidepanel: 400;
   --z-navigation: 450;
   --z-dropdown: 500;
diff --git a/src/styles/partials/layout.scss b/src/styles/partials/layout.scss
index 0e52ad776..df135b6aa 100644
--- a/src/styles/partials/layout.scss
+++ b/src/styles/partials/layout.scss
@@ -19,7 +19,7 @@
   }
 
   .l-application & {
-    z-index: var(--z-application);
+    z-index: var(--z-sidepanel);
   }
 }
 

From 0dbe79d5faaabac08d212251e218813c5357892b Mon Sep 17 00:00:00 2001
From: Rubin Aga <66167934+rubinaga@users.noreply.github.com>
Date: Mon, 13 Apr 2026 17:55:13 +0200
Subject: [PATCH 10/42] refactor: replace spinners with inline loading states
 across components (#539)

## Summary

This item is related to [this Jira
ticket](https://warthogs.atlassian.net/browse/LNDENG-4081). Moving all
loading elements to use `LoadingState` (with inline or without it) makes
it easier to maintain in the codebase.

This is just a refactor and doesnt introduce new behavior

## Release Impact

According to the [Landscape Server Release
Cycle](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `dev` / `main` (Beta)
- **Version Impact**:
  - [ ] Patch (Fix)
  - [ ] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [ ] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [x] **UI Verified**: I have verified the changes locally.
- [x] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.
---
 src/components/layout/LoadingState/LoadingState.tsx      | 2 +-
 src/components/layout/Redirecting/Redirecting.test.tsx   | 9 ++-------
 src/components/layout/Redirecting/Redirecting.tsx        | 6 +++---
 .../AccessGroupInstanceCountCell.tsx                     | 9 ++-------
 .../handle/oidc/OidcAuthPage/OidcAuthPage.module.scss    | 6 ++++++
 src/pages/auth/handle/oidc/OidcAuthPage/OidcAuthPage.tsx | 6 +++---
 .../UbuntuOneAuthPage/UbuntuOneAuthPage.module.scss      | 6 ++++++
 .../ubuntu-one/UbuntuOneAuthPage/UbuntuOneAuthPage.tsx   | 6 +++---
 .../instances/[single]/SingleInstanceTabs/helpers.tsx    | 5 +++--
 9 files changed, 29 insertions(+), 26 deletions(-)

diff --git a/src/components/layout/LoadingState/LoadingState.tsx b/src/components/layout/LoadingState/LoadingState.tsx
index f4780e634..cf1b5b2ff 100644
--- a/src/components/layout/LoadingState/LoadingState.tsx
+++ b/src/components/layout/LoadingState/LoadingState.tsx
@@ -17,7 +17,7 @@ const LoadingState: FC<LoadingStateProps> = ({ centerOnScreen, inline }) => {
   );
 
   if (inline) {
-    return <div role="status">{spinningElement}</div>;
+    return <span role="status">{spinningElement}</span>;
   }
 
   return (
diff --git a/src/components/layout/Redirecting/Redirecting.test.tsx b/src/components/layout/Redirecting/Redirecting.test.tsx
index 7e0b1fe54..da0db8a01 100644
--- a/src/components/layout/Redirecting/Redirecting.test.tsx
+++ b/src/components/layout/Redirecting/Redirecting.test.tsx
@@ -6,12 +6,7 @@ describe("Redirecting", () => {
     render(<Redirecting />);
 
     expect(screen.getByRole("status")).toBeInTheDocument();
-
-    const labelSpans = screen.getAllByText("Redirecting...");
-
-    expect(labelSpans).toHaveLength(2);
-
-    expect(labelSpans[0]).toBeOffScreen();
-    expect(labelSpans[1]).not.toBeOffScreen();
+    expect(screen.getByText("Loading...")).toBeOffScreen();
+    expect(screen.getByText("Redirecting...")).not.toBeOffScreen();
   });
 });
diff --git a/src/components/layout/Redirecting/Redirecting.tsx b/src/components/layout/Redirecting/Redirecting.tsx
index 2259ec19a..dfb7d962c 100644
--- a/src/components/layout/Redirecting/Redirecting.tsx
+++ b/src/components/layout/Redirecting/Redirecting.tsx
@@ -1,12 +1,12 @@
+import LoadingState from "../LoadingState";
 import type { FC } from "react";
 import classes from "./Redirecting.module.scss";
 
 const Redirecting: FC = () => {
   return (
     <div className={classes.root}>
-      <span role="status" className={classes.icon}>
-        <span className="u-off-screen">Redirecting...</span>
-        <i className="p-icon--spinner u-animation--spin" aria-hidden />
+      <span className={classes.icon}>
+        <LoadingState inline />
       </span>
       <span>Redirecting...</span>
     </div>
diff --git a/src/features/access-groups/components/AccessGroupInstanceCountCell/AccessGroupInstanceCountCell.tsx b/src/features/access-groups/components/AccessGroupInstanceCountCell/AccessGroupInstanceCountCell.tsx
index c401c7bec..0e29925ea 100644
--- a/src/features/access-groups/components/AccessGroupInstanceCountCell/AccessGroupInstanceCountCell.tsx
+++ b/src/features/access-groups/components/AccessGroupInstanceCountCell/AccessGroupInstanceCountCell.tsx
@@ -1,6 +1,6 @@
+import LoadingState from "@/components/layout/LoadingState";
 import { useGetInstances } from "@/features/instances";
 import { pluralizeWithCount } from "@/utils/_helpers";
-import { Spinner } from "@canonical/react-components";
 import { type FC } from "react";
 import { Link } from "react-router";
 import type { AccessGroupWithInstancesCount } from "../../types/AccessGroup";
@@ -21,12 +21,7 @@ const AccessGroupInstanceCountCell: FC<AccessGroupInstanceCountCellProps> = ({
   });
 
   if (isGettingInstances) {
-    return (
-      <>
-        <span className="u-off-screen">Loading...</span>
-        <Spinner aria-hidden />
-      </>
-    );
+    return <LoadingState inline />;
   }
 
   if (instancesCount) {
diff --git a/src/pages/auth/handle/oidc/OidcAuthPage/OidcAuthPage.module.scss b/src/pages/auth/handle/oidc/OidcAuthPage/OidcAuthPage.module.scss
index 0638bbe7a..01ca6971c 100644
--- a/src/pages/auth/handle/oidc/OidcAuthPage/OidcAuthPage.module.scss
+++ b/src/pages/auth/handle/oidc/OidcAuthPage/OidcAuthPage.module.scss
@@ -1,6 +1,12 @@
+@import "vanilla-framework/scss/settings_spacing";
+
 .container {
   align-items: center;
   display: flex;
   height: 100vh;
   justify-content: center;
 }
+
+.loading {
+  margin-right: $sph--large;
+}
diff --git a/src/pages/auth/handle/oidc/OidcAuthPage/OidcAuthPage.tsx b/src/pages/auth/handle/oidc/OidcAuthPage/OidcAuthPage.tsx
index 2e3827d95..ece3e4ff8 100644
--- a/src/pages/auth/handle/oidc/OidcAuthPage/OidcAuthPage.tsx
+++ b/src/pages/auth/handle/oidc/OidcAuthPage/OidcAuthPage.tsx
@@ -6,6 +6,7 @@ import {
   GENERIC_DOMAIN,
   HOMEPAGE_PATH,
 } from "@/constants";
+import LoadingState from "@/components/layout/LoadingState";
 import { useGetOidcAuth } from "@/features/auth";
 import useAuth from "@/hooks/useAuth";
 import useEnv from "@/hooks/useEnv";
@@ -85,9 +86,8 @@ const OidcAuthPage: FC = () => {
     <div className={classes.container}>
       {isLoading ? (
         <div className="u-align-text--center">
-          <span role="status" style={{ marginRight: "1rem" }}>
-            <span className="u-off-screen">Loading...</span>
-            <i className="p-icon--spinner u-animation--spin" aria-hidden />
+          <span className={classes.loading}>
+            <LoadingState inline />
           </span>
           <span>Please wait while your request is being processed...</span>
         </div>
diff --git a/src/pages/auth/handle/ubuntu-one/UbuntuOneAuthPage/UbuntuOneAuthPage.module.scss b/src/pages/auth/handle/ubuntu-one/UbuntuOneAuthPage/UbuntuOneAuthPage.module.scss
index 0638bbe7a..01ca6971c 100644
--- a/src/pages/auth/handle/ubuntu-one/UbuntuOneAuthPage/UbuntuOneAuthPage.module.scss
+++ b/src/pages/auth/handle/ubuntu-one/UbuntuOneAuthPage/UbuntuOneAuthPage.module.scss
@@ -1,6 +1,12 @@
+@import "vanilla-framework/scss/settings_spacing";
+
 .container {
   align-items: center;
   display: flex;
   height: 100vh;
   justify-content: center;
 }
+
+.loading {
+  margin-right: $sph--large;
+}
diff --git a/src/pages/auth/handle/ubuntu-one/UbuntuOneAuthPage/UbuntuOneAuthPage.tsx b/src/pages/auth/handle/ubuntu-one/UbuntuOneAuthPage/UbuntuOneAuthPage.tsx
index 43c94cd65..fc9eab922 100644
--- a/src/pages/auth/handle/ubuntu-one/UbuntuOneAuthPage/UbuntuOneAuthPage.tsx
+++ b/src/pages/auth/handle/ubuntu-one/UbuntuOneAuthPage/UbuntuOneAuthPage.tsx
@@ -6,6 +6,7 @@ import {
   GENERIC_DOMAIN,
   HOMEPAGE_PATH,
 } from "@/constants";
+import LoadingState from "@/components/layout/LoadingState";
 import useAuth from "@/hooks/useAuth";
 import useEnv from "@/hooks/useEnv";
 import { useGetStandaloneAccount } from "@/features/account-creation";
@@ -74,9 +75,8 @@ const UbuntuOneAuthPage: FC = () => {
     <div className={classes.container}>
       {isLoading ? (
         <div className="u-align-text--center">
-          <span role="status" style={{ marginRight: "1rem" }}>
-            <span className="u-off-screen">Loading...</span>
-            <i className="p-icon--spinner u-animation--spin" aria-hidden />
+          <span className={classes.loading}>
+            <LoadingState inline />
           </span>
           <span>Please wait while your request is being processed...</span>
         </div>
diff --git a/src/pages/dashboard/instances/[single]/SingleInstanceTabs/helpers.tsx b/src/pages/dashboard/instances/[single]/SingleInstanceTabs/helpers.tsx
index c64248b54..624808d1c 100644
--- a/src/pages/dashboard/instances/[single]/SingleInstanceTabs/helpers.tsx
+++ b/src/pages/dashboard/instances/[single]/SingleInstanceTabs/helpers.tsx
@@ -1,7 +1,8 @@
+import LoadingState from "@/components/layout/LoadingState";
 import { getFeatures } from "@/features/instances";
 import useAuth from "@/hooks/useAuth";
 import type { Instance } from "@/types/Instance";
-import { Badge, Spinner } from "@canonical/react-components";
+import { Badge } from "@canonical/react-components";
 
 interface GetTabLabelProps {
   id: string;
@@ -32,7 +33,7 @@ const getTabLabel = ({
     return (
       <>
         <span>{label}</span>
-        <Spinner className="u-no-margin--bottom u-no-padding--top" />
+        <LoadingState inline />
       </>
     );
   }

From 59d9619eec2353acf5e197ae702a364d264a625a Mon Sep 17 00:00:00 2001
From: Yurii Vasyliev <yurii.vasyliev@canonical.com>
Date: Tue, 14 Apr 2026 16:43:14 +0200
Subject: [PATCH 11/42] docs: update agents.md

---
 AGENTS.md | 22 +++++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

diff --git a/AGENTS.md b/AGENTS.md
index 42fc698c0..3f5d5f6a1 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -43,11 +43,23 @@ The knowledge base lives under `docs/` plus established root documents such as `
 Package manager is `pnpm`. Do not use `npm` or `yarn`.
 
 ```
-pnpm dev          # start the Vite dev server
-pnpm vitest       # run unit and component tests (Vitest)
-pnpm run lint     # run ESLint with auto-fix
-pnpm build        # production build (lint + tsc + vite build)
-pnpm test         # run Playwright E2E tests (not unit tests)
+pnpm dev                        # start the Vite dev server
+pnpm vitest                     # run unit and component tests (Vitest)
+pnpm vitest MyComponent         # run tests matching a name pattern
+pnpm vitest --reporter=verbose  # run with detailed per-test output
+pnpm coverage                   # run Vitest with coverage report
+pnpm run lint                   # run ESLint with auto-fix
+pnpm build                      # production build (lint + tsc + vite build)
+pnpm test                       # run Playwright E2E tests (not unit tests)
+pnpm test:saas                  # run only SaaS-tagged E2E tests
+pnpm test:self-hosted           # run only self-hosted-tagged E2E tests
+pnpm changeset                  # create a changeset for changelog (required before merge)
 ```
 
 Note: `pnpm test` runs Playwright, not Vitest. Use `pnpm vitest` for unit and component test work.
+
+## Environment Setup
+
+Copy `.env.local.example` to `.env.local` and fill in values for your local Landscape instance. Required variables include `VITE_API_URL`, `VITE_API_URL_OLD`, and `VITE_ROOT_PATH`. Set `VITE_MSW_ENABLED=true` to use Mock Service Worker for offline development. See `.env.local.example` for the full list.
+
+Node.js ≥24 is required (`engines` in `package.json`).

From e2253b7ee3fcfb694c23505d3539a08395914ba6 Mon Sep 17 00:00:00 2001
From: Marc Bucchieri <marc.bucchieri@canonical.com>
Date: Tue, 14 Apr 2026 09:39:14 -0700
Subject: [PATCH 12/42] fix: organisation switch updates correctly in the UI
 (#550)

## Summary

Previously, switching the user's organization via the OrganisationSwitch
component wouldn't update in the UI until the user navigated to a new
page, or refreshed the page. Fixed by keeping authUser in the cache
before refetching queries.

## Release Impact

According to the [Landscape Server Release
Cycle](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `dev` / `main` (Beta)
- **Version Impact**:
  - [X] Patch (Fix)
  - [ ] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [X] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [X] **UI Verified**: I have verified the changes locally.
- [X] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.
---
 .changeset/green-icons-beam.md                |  5 ++
 src/features/auth/hooks/useAuthHandle.ts      |  4 +-
 .../OrganisationSwitch.integration.test.tsx   | 46 +++++++++++++++++++
 .../OrganisationSwitch.test.tsx               |  1 +
 src/tests/mocks/auth.ts                       |  8 ++++
 src/tests/mocks/user.ts                       |  6 ++-
 6 files changed, 68 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/green-icons-beam.md
 create mode 100644 src/templates/dashboard/OrganisationSwitch/OrganisationSwitch.integration.test.tsx

diff --git a/.changeset/green-icons-beam.md b/.changeset/green-icons-beam.md
new file mode 100644
index 000000000..e5d4869fa
--- /dev/null
+++ b/.changeset/green-icons-beam.md
@@ -0,0 +1,5 @@
+---
+"landscape-ui": patch
+---
+
+Fix organization switching by more precise cache invalidation
diff --git a/src/features/auth/hooks/useAuthHandle.ts b/src/features/auth/hooks/useAuthHandle.ts
index a048a8e3c..094efaf0c 100644
--- a/src/features/auth/hooks/useAuthHandle.ts
+++ b/src/features/auth/hooks/useAuthHandle.ts
@@ -128,7 +128,9 @@ export default function useAuthHandle() {
   >({
     mutationFn: async (params) => authFetch.post("switch-account", params),
     onSuccess: async () => {
-      queryClient.removeQueries();
+      queryClient.removeQueries({
+        predicate: (query) => query.queryKey[0] !== "authUser",
+      });
       return queryClient.refetchQueries();
     },
   });
diff --git a/src/templates/dashboard/OrganisationSwitch/OrganisationSwitch.integration.test.tsx b/src/templates/dashboard/OrganisationSwitch/OrganisationSwitch.integration.test.tsx
new file mode 100644
index 000000000..bef77843b
--- /dev/null
+++ b/src/templates/dashboard/OrganisationSwitch/OrganisationSwitch.integration.test.tsx
@@ -0,0 +1,46 @@
+import { API_URL } from "@/constants";
+import useSidePanel from "@/hooks/useSidePanel";
+import { authResponse } from "@/tests/mocks/auth";
+import { renderWithProviders } from "@/tests/render";
+import server from "@/tests/server";
+import { screen, waitFor } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { http, HttpResponse } from "msw";
+import { beforeEach } from "vitest";
+import OrganisationSwitch from "./OrganisationSwitch";
+
+vi.mock("@/hooks/useSidePanel");
+const closeSidePanel = vi.fn();
+
+describe("OrganisationSwitch (integration)", () => {
+  beforeEach(() => {
+    vi.mocked(useSidePanel, { partial: true }).mockReturnValue({
+      closeSidePanel,
+    });
+
+    server.use(http.get(`${API_URL}me`, () => HttpResponse.json(authResponse)));
+  });
+
+  it("should update the displayed organisation after account switch", async () => {
+    renderWithProviders(<OrganisationSwitch />);
+
+    // Wait for the real auth context to fully load from MSW GET /me.
+    // authResponse has current_account = "test-account".
+    await waitFor(() => {
+      expect(
+        screen.getByRole("combobox", { name: /organization/i }),
+      ).toHaveValue("test-account");
+    });
+
+    await userEvent.selectOptions(
+      screen.getByRole("combobox", { name: /organization/i }),
+      "second-account",
+    );
+
+    await waitFor(() => {
+      expect(
+        screen.getByRole("combobox", { name: /organization/i }),
+      ).toHaveValue("second-account");
+    });
+  });
+});
diff --git a/src/templates/dashboard/OrganisationSwitch/OrganisationSwitch.test.tsx b/src/templates/dashboard/OrganisationSwitch/OrganisationSwitch.test.tsx
index be0aeb40c..254634928 100644
--- a/src/templates/dashboard/OrganisationSwitch/OrganisationSwitch.test.tsx
+++ b/src/templates/dashboard/OrganisationSwitch/OrganisationSwitch.test.tsx
@@ -88,6 +88,7 @@ describe("OrganisationSwitch", () => {
       expect(select).toHaveValue(defaultAccounts.currentAccount.name);
     });
 
+    // only tests function call, TODO check UI change after account switch as well
     it("should change the organisation and close side panel", async () => {
       await userEvent.selectOptions(
         screen.getByRole("combobox"),
diff --git a/src/tests/mocks/auth.ts b/src/tests/mocks/auth.ts
index e620f5371..b2fd26f8c 100644
--- a/src/tests/mocks/auth.ts
+++ b/src/tests/mocks/auth.ts
@@ -1,6 +1,7 @@
 import type { AuthStateResponse, AuthUser } from "@/features/auth";
 
 const testAccount = "test-account";
+const secondAccount = "second-account";
 
 export const authUser: AuthUser = {
   accounts: [
@@ -11,6 +12,13 @@ export const authUser: AuthUser = {
       subdomain: null,
       title: "Test Account",
     },
+    {
+      classic_dashboard_url: "",
+      default: false,
+      name: secondAccount,
+      subdomain: null,
+      title: "Second Account",
+    },
   ],
   current_account: testAccount,
   email: "example@mail.com",
diff --git a/src/tests/mocks/user.ts b/src/tests/mocks/user.ts
index ffbcc6a0b..57a502efd 100644
--- a/src/tests/mocks/user.ts
+++ b/src/tests/mocks/user.ts
@@ -89,13 +89,17 @@ export const users = [
 ] as const satisfies User[];
 
 const accountName = "test-account";
+const secondAccountName = "second-account";
 const email = "example@mail.com";
 
 export const userDetails: UserDetails = {
   email: email,
   name: "Test User",
   preferred_account: accountName,
-  accounts: [{ name: accountName, title: "Test Account", roles: ["Test"] }],
+  accounts: [
+    { name: accountName, title: "Test Account", roles: ["Test"] },
+    { name: secondAccountName, title: "Second Account", roles: ["Test"] },
+  ],
   allowable_emails: [email],
   oidc_identities: [],
   timezone: "America/New_York",

From 3378fa666b5911d542a62fc0a4dee8cea2a25322 Mon Sep 17 00:00:00 2001
From: Yurii Vasyliev <113896226+yurii-vasyliev@users.noreply.github.com>
Date: Tue, 14 Apr 2026 19:34:30 +0200
Subject: [PATCH 13/42] build: extend release process with point releases
 (#553)

This pull request introduces support for "point" branches, enabling the
creation and deployment of pinned beta releases based on specific
commits and cherry-picked fixes. The changes update the release
workflow, versioning logic, and documentation to clarify how and when to
use these point releases.

**Release workflow and branching strategy updates:**

* The `.github/workflows/release-and-build.yml` workflow now triggers on
pushes to `point/**` branches and treats them as beta releases,
deploying to the `ppa-build` target.
[[1]](diffhunk://#diff-f2835b43bdce313fb566e57a07425b551df5a05cf100af870ab5779713ed3659L5-R5)
[[2]](diffhunk://#diff-f2835b43bdce313fb566e57a07425b551df5a05cf100af870ab5779713ed3659L32-R32)
* The `scripts/calculate-version.cjs` script is updated to generate beta
version numbers for `point/` branches, matching the format used for
`main`.

**Documentation improvements:**

* `RELEASES.md` now documents the new `point/YYYY-MM-DD` branch type,
its purpose, and how it fits into the overall branching strategy.
* A detailed example workflow ("Example C: Shipping a Pinned Beta") is
added to `RELEASES.md`, explaining how to create, use, and retire point
branches for targeted beta releases.## Summary

Summarize the changes made in this pull request. Include any relevant
context or background information that would help reviewers understand
the purpose and scope of the changes.

## Release Impact

According to the [Landscape Server Release Cycle
This pull request introduces support for "point" branches, which enable
the creation of pinned beta releases based on specific commits and
cherry-picked fixes. The changes update the branching strategy
documentation, CI workflow, and version calculation logic to recognize
and handle `point/YYYY-MM-DD` branches as beta releases. This allows for
more flexible and controlled beta releases without disrupting ongoing
development on `main`.

**Branching and Release Process Updates:**

* Updated the documented branching strategy in `RELEASES.md` to include
`point/YYYY-MM-DD` as a new branch type for pinned beta releases,
clarifying its purpose and deployment target.
* Added a detailed example workflow in `RELEASES.md` for creating and
managing point releases, including branch creation, cherry-picking, and
cleanup instructions.

**CI/CD and Versioning Enhancements:**

* Modified the GitHub Actions workflow in
`.github/workflows/release-and-build.yml` to trigger on pushes to
`point/**` branches, ensuring CI builds are run for point releases.
* Updated the build destination logic in the workflow so that builds
from `main` or any `point/**` branch are deployed to the `ppa-build`
beta channel.
* Adjusted the version calculation script
(`scripts/calculate-version.cjs`) to treat `point/` branches like
`main`, assigning them a beta version
suffix.](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `dev` / `main` (Beta)
- **Version Impact**:
  - [ ] Patch (Fix)
  - [ ] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [ ] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [ ] **UI Verified**: I have verified the changes locally.
- [ ] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.
---
 .github/workflows/release-and-build.yml |  4 +--
 RELEASES.md                             | 45 +++++++++++++++++++++----
 scripts/calculate-version.cjs           |  2 +-
 3 files changed, 42 insertions(+), 9 deletions(-)

diff --git a/.github/workflows/release-and-build.yml b/.github/workflows/release-and-build.yml
index 50223ff1b..fa284fe7c 100644
--- a/.github/workflows/release-and-build.yml
+++ b/.github/workflows/release-and-build.yml
@@ -2,7 +2,7 @@ name: Release and PPA Build
 
 on:
   push:
-    branches: [main, dev, stable, "release/**"]
+    branches: [main, dev, stable, "release/**", "point/**"]
 
 permissions:
   contents: write
@@ -29,7 +29,7 @@ jobs:
           VERSION=$(node scripts/calculate-version.cjs)
           echo "version=$VERSION" >> $GITHUB_OUTPUT
 
-          if [[ $GITHUB_REF == 'refs/heads/main' ]]; then DEST="ppa-build";
+          if [[ $GITHUB_REF == 'refs/heads/main' || $GITHUB_REF == refs/heads/point/* ]]; then DEST="ppa-build";
           elif [[ $GITHUB_REF == 'refs/heads/dev' ]]; then DEST="ppa-build-dev";
           elif [[ $GITHUB_REF == 'refs/heads/stable' ]]; then DEST="ppa-build-stable";
           else DEST="ppa-build-${GITHUB_REF##*/}"; fi
diff --git a/RELEASES.md b/RELEASES.md
index 27c4fb578..a2f7aa8ca 100644
--- a/RELEASES.md
+++ b/RELEASES.md
@@ -6,12 +6,13 @@ Landscape UI follows the [Landscape Server Release Cycle](https://docs.google.co
 
 ## 1. Branching Strategy
 
-| Branch          | Release Tier      | Logic                                                                    |
-|-----------------|-------------------|--------------------------------------------------------------------------|
-| `dev`           | **Development**   | Internal testing. Deploys to  `ppa-build-dev`.                           |
-| `main`          | **Beta**          | Feature-complete but may have breaking changes. Deploys to  `ppa-build`. |
-| `stable`        | **Latest Stable** | Production-ready with latest features. Updated every 6 months.           |
-| `release/YY.04` | **LTS**           | Mission-critical stability.                                              |
+| Branch              | Release Tier      | Logic                                                                    |
+|---------------------|-------------------|--------------------------------------------------------------------------|
+| `dev`               | **Development**   | Internal testing. Deploys to  `ppa-build-dev`.                           |
+| `main`              | **Beta**          | Feature-complete but may have breaking changes. Deploys to  `ppa-build`. |
+| `point/YYYY-MM-DD`  | **Beta (pinned)** | Cherry-picked beta from a pinned commit. Deploys to `ppa-build`.         |
+| `stable`            | **Latest Stable** | Production-ready with latest features. Updated every 6 months.           |
+| `release/YY.04`     | **LTS**           | Mission-critical stability.                                              |
 
 ---
 
@@ -85,6 +86,38 @@ Use this workflow if a customer reports a critical bug in an LTS version (e.g.,
 6. **Push:** Push directly to `release/24.04`.
 7. **Result:** The CI detects the LTS branch and generates a **Point Release** (e.g., $24.04.1.15$) for the specific LTS PPA.
 
+---
+
+### Example C: Shipping a Pinned Beta (Target: Point Release)
+
+Use this workflow when `main` has moved ahead with new features or breaking changes, but you need to ship a beta with only specific fixes on top of an older, known-good commit.
+
+1. **Identify the base commit:** Find the last commit you want to build from (e.g., `07bb3c298`).
+2. **Create the point branch:**
+   ```bash
+   git checkout -b point/2026-04-14 07bb3c298
+   ```
+3. **Cherry-pick the changes you need:**
+   ```bash
+   git cherry-pick <commit-hash-1>
+   git cherry-pick <commit-hash-2>
+   ```
+4. **Generate Changeset:** Run `pnpm changeset`.
+5. **Select Type:** Choose `patch`.
+6. **Write Summary:** `Point release with alert fix and MSW refactor.`
+7. **Push:** Push to `point/2026-04-14`.
+8. **Result:** The CI treats this as a beta and deploys to `ppa-build` (e.g., `26.04.0.63-beta`).
+
+**Adding more changes later:** Push additional cherry-picks to the same `point/` branch. Each push triggers a new CI run with the next `GITHUB_RUN_NUMBER`.
+
+**When main catches up:** Delete the point branch once `main` is ready to resume normal beta releases:
+
+```bash
+git push origin --delete point/2026-04-14
+```
+
+**Multiple point releases per month:** Use the date suffix to keep them unique (e.g., `point/2026-04-14`, `point/2026-04-28`).
+
 ## 6. Troubleshooting
    
 ### Problem: A PR was merged without a Changeset
diff --git a/scripts/calculate-version.cjs b/scripts/calculate-version.cjs
index 644cd4350..a2fa3e186 100644
--- a/scripts/calculate-version.cjs
+++ b/scripts/calculate-version.cjs
@@ -11,7 +11,7 @@ function getVersion() {
   const branch = execSync("git rev-parse --abbrev-ref HEAD").toString().trim();
   const buildNum = process.env.GITHUB_RUN_NUMBER || "0";
 
-  if (branch === "main") {
+  if (branch === "main" || branch.startsWith("point/")) {
     return `${calVerBase}.0.${buildNum}-beta`;
   }
   if (branch === "dev") {

From 808e3f509b4385d7a932cf59d77bf0f17c7bf7a9 Mon Sep 17 00:00:00 2001
From: Yurii Vasyliev <yurii.vasyliev@canonical.com>
Date: Tue, 14 Apr 2026 19:46:06 +0200
Subject: [PATCH 14/42] workflows: adjust ppa build commit message

---
 .github/workflows/release-and-build.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/release-and-build.yml b/.github/workflows/release-and-build.yml
index fa284fe7c..ec499fbff 100644
--- a/.github/workflows/release-and-build.yml
+++ b/.github/workflows/release-and-build.yml
@@ -78,4 +78,4 @@ jobs:
           branch: ${{ steps.calver.outputs.dest_branch }}
           create_branch: true
           push_options: "--force"
-          commit_message: "Build v${{ steps.calver.outputs.version }} [${{ github.sha }}]"
+          commit_message: "Build v${{ steps.calver.outputs.version }} from ${{ github.ref_name }} [${{ github.sha }}]"

From d8c568f27772cdead25e68b8e6cdeaf1d6c8b758 Mon Sep 17 00:00:00 2001
From: Yurii Vasyliev <yurii.vasyliev@canonical.com>
Date: Tue, 14 Apr 2026 20:17:45 +0200
Subject: [PATCH 15/42] workflows: extend CI with building deb package artifact

---
 .github/workflows/release-and-build.yml | 55 +++++++++++++++++++++++++
 1 file changed, 55 insertions(+)

diff --git a/.github/workflows/release-and-build.yml b/.github/workflows/release-and-build.yml
index ec499fbff..98043b355 100644
--- a/.github/workflows/release-and-build.yml
+++ b/.github/workflows/release-and-build.yml
@@ -11,6 +11,9 @@ permissions:
 jobs:
   process-release:
     runs-on: ubuntu-latest
+    outputs:
+      version: ${{ steps.calver.outputs.version }}
+      dest_branch: ${{ steps.calver.outputs.dest_branch }}
     steps:
       - uses: actions/checkout@v5
         with: { fetch-depth: 0 }
@@ -57,6 +60,13 @@ jobs:
           VITE_API_URL_OLD: /api/
           VITE_ROOT_PATH: /new_dashboard/
 
+      - name: Upload dist artifact
+        uses: actions/upload-artifact@v4
+        with:
+          name: dist
+          path: dist/
+          retention-days: 5
+
       - name: Prepare PPA Branch
         run: |
           # Create a temporary directory to hold build artifacts
@@ -79,3 +89,48 @@ jobs:
           create_branch: true
           push_options: "--force"
           commit_message: "Build v${{ steps.calver.outputs.version }} from ${{ github.ref_name }} [${{ github.sha }}]"
+
+  build-deb:
+    needs: process-release
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v5
+        with:
+          sparse-checkout: debian
+
+      - name: Download dist artifact
+        uses: actions/download-artifact@v4
+        with:
+          name: dist
+          path: dist/
+
+      - name: Install packaging tools
+        run: sudo apt-get update && sudo apt-get install -y debhelper devscripts
+
+      - name: Build .deb package
+        env:
+          DEBFULLNAME: Landscape Team
+          DEBEMAIL: landscape-team@canonical.com
+          VERSION: ${{ needs.process-release.outputs.version }}
+        run: |
+          # Update debian/changelog with the build version
+          dch --newversion "${VERSION}-0landscape0" \
+              --distribution jammy \
+              "Release ${VERSION} for jammy"
+
+          # Create the orig tarball from the pre-built dist
+          cd dist
+          tar czf "../../landscape-dashboard_${VERSION}.orig.tar.gz" \
+            assets favicon.svg index.html
+          cd ..
+
+          # Build the binary .deb (unsigned)
+          dpkg-buildpackage -us -uc -b
+
+      - name: Upload .deb artifact
+        uses: actions/upload-artifact@v4
+        with:
+          name: landscape-dashboard-deb
+          path: ../landscape-dashboard_*.deb
+          retention-days: 30
+

From 6a64f73836e7d489ff8767d4fbf0310101fc3747 Mon Sep 17 00:00:00 2001
From: Yurii Vasyliev <yurii.vasyliev@canonical.com>
Date: Tue, 14 Apr 2026 20:22:57 +0200
Subject: [PATCH 16/42] workflows: fix build-dev job

---
 .github/workflows/release-and-build.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/release-and-build.yml b/.github/workflows/release-and-build.yml
index 98043b355..91f2fadd5 100644
--- a/.github/workflows/release-and-build.yml
+++ b/.github/workflows/release-and-build.yml
@@ -105,7 +105,7 @@ jobs:
           path: dist/
 
       - name: Install packaging tools
-        run: sudo apt-get update && sudo apt-get install -y debhelper devscripts
+        run: sudo apt-get update && sudo apt-get install -y build-essential debhelper devscripts
 
       - name: Build .deb package
         env:

From 090993533c9e6be2f6400c9d1c52b05ee7098608 Mon Sep 17 00:00:00 2001
From: Yurii Vasyliev <yurii.vasyliev@canonical.com>
Date: Wed, 15 Apr 2026 11:07:24 +0200
Subject: [PATCH 17/42] workflows: fix build-dev job, attempt 2

---
 .github/workflows/release-and-build.yml | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/.github/workflows/release-and-build.yml b/.github/workflows/release-and-build.yml
index 91f2fadd5..01d89f57f 100644
--- a/.github/workflows/release-and-build.yml
+++ b/.github/workflows/release-and-build.yml
@@ -113,16 +113,20 @@ jobs:
           DEBEMAIL: landscape-team@canonical.com
           VERSION: ${{ needs.process-release.outputs.version }}
         run: |
+          # Move pre-built files to root level (matching ppa-build layout
+          # that debian/rules expects: assets/, index.html, favicon.svg at root)
+          cp -r dist/assets .
+          cp dist/index.html dist/favicon.svg .
+          rm -rf dist
+
           # Update debian/changelog with the build version
           dch --newversion "${VERSION}-0landscape0" \
               --distribution jammy \
               "Release ${VERSION} for jammy"
 
-          # Create the orig tarball from the pre-built dist
-          cd dist
-          tar czf "../../landscape-dashboard_${VERSION}.orig.tar.gz" \
+          # Create the orig tarball
+          tar czf "../landscape-dashboard_${VERSION}.orig.tar.gz" \
             assets favicon.svg index.html
-          cd ..
 
           # Build the binary .deb (unsigned)
           dpkg-buildpackage -us -uc -b

From 35549b44906fa8dd6d68bb4b0315ddcccb6815b7 Mon Sep 17 00:00:00 2001
From: Yurii Vasyliev <yurii.vasyliev@canonical.com>
Date: Wed, 15 Apr 2026 11:19:14 +0200
Subject: [PATCH 18/42] workflows: fix build-dev job, attempt 3

---
 .github/workflows/release-and-build.yml | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/.github/workflows/release-and-build.yml b/.github/workflows/release-and-build.yml
index 01d89f57f..4c41ef5d8 100644
--- a/.github/workflows/release-and-build.yml
+++ b/.github/workflows/release-and-build.yml
@@ -131,10 +131,13 @@ jobs:
           # Build the binary .deb (unsigned)
           dpkg-buildpackage -us -uc -b
 
+          # Copy .deb into workspace (upload-artifact doesn't allow ../ paths)
+          cp ../landscape-dashboard_*.deb .
+
       - name: Upload .deb artifact
         uses: actions/upload-artifact@v4
         with:
           name: landscape-dashboard-deb
-          path: ../landscape-dashboard_*.deb
+          path: landscape-dashboard_*.deb
           retention-days: 30
 

From ddbc50777d6dca39f9837db44586cd5b635fd99d Mon Sep 17 00:00:00 2001
From: "github-actions[bot]"
 <41898282+github-actions[bot]@users.noreply.github.com>
Date: Wed, 15 Apr 2026 15:17:06 +0200
Subject: [PATCH 19/42] Version Packages (26.04.0.70-beta) (#544)

This PR was opened by the [Changesets
release](https://github.com/changesets/action) GitHub action. When
you're ready to do a release, you can merge this and publish to npm
yourself or [setup this action to publish
automatically](https://github.com/changesets/action#with-publishing). If
you're not ready to do a release yet, that's fine, whenever you add more
changesets to main, this PR will be updated.


# Releases
## landscape-ui@26.04.0.70

# Landscape Lifecycle Transition (February 2026)

_Note: starting from this point, Landscape UI follows the Landscape
Server Release Specification (CalVer YY.MM.Point.Patch)._

* * *

#
[1.23.0](https://github.com/canonical/landscape-ui/compare/v1.22.0...v1.23.0)
(2026-01-08)

### Bug Fixes

- add missing ubuntu pro info
([#426](https://github.com/canonical/landscape-ui/issues/426))
([425b1c7](https://github.com/canonical/landscape-ui/commit/425b1c7496ac5a32a7c8f2c149c63d8a401a8bc1))
- change cve links to ubuntu.com
([#384](https://github.com/canonical/landscape-ui/issues/384))
([fabf4d0](https://github.com/canonical/landscape-ui/commit/fabf4d029516aaade9096cef992464afec02e290))
- Instance page filters changes
([#432](https://github.com/canonical/landscape-ui/issues/432))
([57914ed](https://github.com/canonical/landscape-ui/commit/57914ede35259904104f4fc6fd9add1deee67c01))
- prevent submitting login form twice if error occurs
([#438](https://github.com/canonical/landscape-ui/issues/438))
([5b1fbd9](https://github.com/canonical/landscape-ui/commit/5b1fbd912a8c0190c5cac2aa19c105f07fd09b23))
- remove access group field from edit mode in profiles
([#434](https://github.com/canonical/landscape-ui/issues/434))
([00ec586](https://github.com/canonical/landscape-ui/commit/00ec5861a3f5a29955b14362e04c8207fea091ff))
- revert TagMultiSelect component
([#424](https://github.com/canonical/landscape-ui/issues/424))
([c132b71](https://github.com/canonical/landscape-ui/commit/c132b711b4b17f0282dc7abe53ae9e3249f2a602))
- wsl profile remove tags
([#407](https://github.com/canonical/landscape-ui/issues/407))
([776ab31](https://github.com/canonical/landscape-ui/commit/776ab31b3bdac8a2b23d32c560d99d472d1b5a16))

### Features

- add associated instance links for upgrade and removal profiles
([#404](https://github.com/canonical/landscape-ui/issues/404))
([e8a92d7](https://github.com/canonical/landscape-ui/commit/e8a92d72170ea67116f739ecb708436a07f1825d))
- add warnings for wsl profiles
([#416](https://github.com/canonical/landscape-ui/issues/416))
([b2e3efe](https://github.com/canonical/landscape-ui/commit/b2e3efec0ffb4d2ced83d090a4c100a59692cd4a))
- allow wsl profiles to use only_landscape_created
([#401](https://github.com/canonical/landscape-ui/issues/401))
([99b5ea0](https://github.com/canonical/landscape-ui/commit/99b5ea0b10eebe031c77f2d9cacb5ee8fb57b2dd))
- improve saved searches user experience
([#430](https://github.com/canonical/landscape-ui/issues/430))
([c63c1a5](https://github.com/canonical/landscape-ui/commit/c63c1a583edd4df42142302ce460bce5a3926dcf))
- rename instance statuses
([#417](https://github.com/canonical/landscape-ui/issues/417))
([0324c54](https://github.com/canonical/landscape-ui/commit/0324c542eca091c70f3fb01bde00d9161301e2f9))
- update confirmation modal for deleting access group
([#431](https://github.com/canonical/landscape-ui/issues/431))
([3ac0310](https://github.com/canonical/landscape-ui/commit/3ac03106be0ee94ac93682a20d1929d4d2596e10))

#
[1.22.0](https://github.com/canonical/landscape-ui/compare/v1.21.0...v1.22.0)
(2025-10-24)

### Bug Fixes

- pnpm-lock
([b43af61](https://github.com/canonical/landscape-ui/commit/b43af61d11662bc4c9055f2aee6b6dbb4893d151))
- prevent infinite request loop in security profiles page
([#394](https://github.com/canonical/landscape-ui/issues/394))
([2be0483](https://github.com/canonical/landscape-ui/commit/2be04834f84b1fdbf61d1b179a5cd997863d4a95))

### Features

- implement pro token attach and detach
([#395](https://github.com/canonical/landscape-ui/issues/395))
([d3995f9](https://github.com/canonical/landscape-ui/commit/d3995f937eb6431b1464eee70368d2bdb19dc332))

#
[1.21.0](https://github.com/canonical/landscape-ui/compare/v1.20.0...v1.21.0)
(2025-10-14)

### Bug Fixes

- revert ppa build action
([#391](https://github.com/canonical/landscape-ui/issues/391))
([5e25323](https://github.com/canonical/landscape-ui/commit/5e25323883366f1b9d19643e43ab16333e38baea))

### Features

- implement account creation and invitation page
([#390](https://github.com/canonical/landscape-ui/issues/390))
([4654a00](https://github.com/canonical/landscape-ui/commit/4654a0068b8376a897c5c4630ed3d6d71b44d58b))

#
[1.20.0](https://github.com/canonical/landscape-ui/compare/v1.19.0...v1.20.0)
(2025-10-09)

### Bug Fixes

- delete wsl children
([#388](https://github.com/canonical/landscape-ui/issues/388))
([454c770](https://github.com/canonical/landscape-ui/commit/454c770462c684fa2fd572c1525ed635a475c29c))

### Features

- packages tab empty state
([#380](https://github.com/canonical/landscape-ui/issues/380))
([da17f13](https://github.com/canonical/landscape-ui/commit/da17f13aed705706be3a981f27fba31f9e886af2))
- update feedback link
([a471849](https://github.com/canonical/landscape-ui/commit/a471849d2005a4ba1b4bf90df743731653437cac))

#
[1.19.0](https://github.com/canonical/landscape-ui/compare/v1.18.2...v1.19.0)
(2025-09-16)

### Features

- associated apt sources can be deleted
([#346](https://github.com/canonical/landscape-ui/issues/346))
([b37dd2b](https://github.com/canonical/landscape-ui/commit/b37dd2b5618d50a11672a610420435e184ce1937))

##
[1.18.2](https://github.com/canonical/landscape-ui/compare/v1.18.1...v1.18.2)
(2025-09-12)

### Bug Fixes

- instances can run scripts with a timeout
([#352](https://github.com/canonical/landscape-ui/issues/352))
([895032f](https://github.com/canonical/landscape-ui/commit/895032f6473796264d1107781ed0ea18f8f8e29b))
- wsl profile expandable cells can open individually
[LNDENG-3116]([#351](https://github.com/canonical/landscape-ui/issues/351))
([a86705b](https://github.com/canonical/landscape-ui/commit/a86705b112781b6283bd8910949ee1d37ae6efd5))

##
[1.18.1](https://github.com/canonical/landscape-ui/compare/v1.18.0...v1.18.1)
(2025-09-03)

### Bug Fixes

- remove autoinstall file field from employees
([#344](https://github.com/canonical/landscape-ui/issues/344))
([27d6ef5](https://github.com/canonical/landscape-ui/commit/27d6ef56018a32c54230036b016d43a2b55cb507))

#
[1.18.0](https://github.com/canonical/landscape-ui/compare/v1.17.0...v1.18.0)
(2025-08-29)

### Bug Fixes

- disable root_only for instances
([#319](https://github.com/canonical/landscape-ui/issues/319))
([1d4109e](https://github.com/canonical/landscape-ui/commit/1d4109e12c8c40388ebc5ef8b77ddb2f544619ab))
- submit button in multi select dropdown footer not working
([#327](https://github.com/canonical/landscape-ui/issues/327))
([364f914](https://github.com/canonical/landscape-ui/commit/364f914f3832f0074b07c50bc207f5b75fe52012))

### Features

- add hostname and tags to instances list
([#333](https://github.com/canonical/landscape-ui/issues/333))
([3d99f1b](https://github.com/canonical/landscape-ui/commit/3d99f1bafbd5c618481fd17fee27af546e861e3d))
- add profile links
[LNDENG-2865]([#309](https://github.com/canonical/landscape-ui/issues/309))
([8238e8f](https://github.com/canonical/landscape-ui/commit/8238e8ff293963c36b9198be23bed050933ba8ce))

#
[1.17.0](https://github.com/canonical/landscape-ui/compare/v1.16.0...v1.17.0)
(2025-08-05)

### Bug Fixes

- show correct duplicates count along with pending instances
([#308](https://github.com/canonical/landscape-ui/issues/308))
([239205b](https://github.com/canonical/landscape-ui/commit/239205ba2f0e7bf8e6971029ceca40e4230afaaf))
- show loading state while loading a page for the first time
([#312](https://github.com/canonical/landscape-ui/issues/312))
([30cd296](https://github.com/canonical/landscape-ui/commit/30cd2969fb72140940a14b66004f5449ed182fc5))

### Features

- compliance checks for WSL profiles
([#285](https://github.com/canonical/landscape-ui/issues/285))
([bdcaa0f](https://github.com/canonical/landscape-ui/commit/bdcaa0fc4d6214d0c00daf715a5ab8c337b7d086))
- implement attach page
([#300](https://github.com/canonical/landscape-ui/issues/300))
([170576f](https://github.com/canonical/landscape-ui/commit/170576f45ba3d47ef94f27a9d4fed19b5111300a))
- make authentication experience changes
([#299](https://github.com/canonical/landscape-ui/issues/299))
([9220dec](https://github.com/canonical/landscape-ui/commit/9220dec72e88f86ade707a65e7ff1863fb0bfd76))
- minor wsl changes
([#318](https://github.com/canonical/landscape-ui/issues/318))
([ec6040f](https://github.com/canonical/landscape-ui/commit/ec6040feb2a90bc1b6da20f4030d15be3d6f581d))

#
[1.16.0](https://github.com/canonical/landscape-ui/compare/v1.15.0...v1.16.0)
(2025-07-22)

### Bug Fixes

- prevent api credentials page from going beyond the bottom
([dfce7ab](https://github.com/canonical/landscape-ui/commit/dfce7ab0f4926b392f821c0dc4843c00f56d9d48))
- provide correct 'copy_from' param when duplicating a package profile
([99420c8](https://github.com/canonical/landscape-ui/commit/99420c881e9610ef23d2574f8bfff64bb76df850))
- removal profiles and upgrade profiles can be edited
[LNDENG-2858]([#303](https://github.com/canonical/landscape-ui/issues/303))
([771248b](https://github.com/canonical/landscape-ui/commit/771248b198f61945af1ff72592541f77f2b37c3c))

### Features

- use new endpoint for tags modal
([#298](https://github.com/canonical/landscape-ui/issues/298))
([5e503c1](https://github.com/canonical/landscape-ui/commit/5e503c1055caa97d4698e5db11b76605d8e226ba))

#
[1.15.0](https://github.com/canonical/landscape-ui/compare/v1.14.1...v1.15.0)
(2025-07-21)

### Bug Fixes

- allow copy-and-paste in text confirmation modals
([#302](https://github.com/canonical/landscape-ui/issues/302))
([5fc76ff](https://github.com/canonical/landscape-ui/commit/5fc76ff6bd75c673adc90280da84f98ce767ea1b))
- remove extra security profile api call
([#296](https://github.com/canonical/landscape-ui/issues/296))
([5c57469](https://github.com/canonical/landscape-ui/commit/5c574697e75b37b8e02728e90593c71f57045f30))
- show scripts warning
([#293](https://github.com/canonical/landscape-ui/issues/293))
([3ae8b19](https://github.com/canonical/landscape-ui/commit/3ae8b1964b0ab705ffcade72280912ae72e3e261))

### Features

- add dark mode
([#297](https://github.com/canonical/landscape-ui/issues/297))
([7b584ef](https://github.com/canonical/landscape-ui/commit/7b584ef12dccb258b224a6dce10ca5058de245c3))
- add disa stig consent banner when enabled
([#295](https://github.com/canonical/landscape-ui/issues/295))
([455e3eb](https://github.com/canonical/landscape-ui/commit/455e3ebdff6ffefc3ede58c35e538ff9c5400c58))
- add support provider login page
([#294](https://github.com/canonical/landscape-ui/issues/294))
([527292e](https://github.com/canonical/landscape-ui/commit/527292e671deb911b440acaf00b2d06cf7c730a9))

##
[1.14.1](https://github.com/canonical/landscape-ui/compare/v1.14.0...v1.14.1)
(2025-07-01)

### Bug Fixes

- show scripts warning
([#293](https://github.com/canonical/landscape-ui/issues/293))
([6a96a14](https://github.com/canonical/landscape-ui/commit/6a96a141320b2dd95a32a7fe0291ddf11a7336b3))

#
[1.14.0](https://github.com/canonical/landscape-dashboard/compare/v1.13.2...v1.14.0)
(2025-06-19)

### Bug Fixes

- make instance table filters responsive
([#283](https://github.com/canonical/landscape-dashboard/issues/283))
([9996c1e](https://github.com/canonical/landscape-dashboard/commit/9996c1e5decd8b9f6280095039d2bf834399377c))
- script profile forms can show errors
([#282](https://github.com/canonical/landscape-dashboard/issues/282))
([f01b673](https://github.com/canonical/landscape-dashboard/commit/f01b67312523a6adfaf0e96c7bd1e985b222a314))

### Features

- add associated instances links for profiles
([#281](https://github.com/canonical/landscape-dashboard/issues/281))
([2d1be1b](https://github.com/canonical/landscape-dashboard/commit/2d1be1bade6e6c9c0c34167abd3fa174944e9a7a))

##
[1.13.2](https://github.com/canonical/landscape-dashboard/compare/v1.13.1...v1.13.2)
(2025-06-16)

### Bug Fixes

- add missing toast notifications, add actions to activities panel
([#265](https://github.com/canonical/landscape-dashboard/issues/265))
([77d2ffa](https://github.com/canonical/landscape-dashboard/commit/77d2ffa8c8ae38dc56d379c7271309d3473181df))
- align custom table filters action functionalities
([#257](https://github.com/canonical/landscape-dashboard/issues/257))
([91fe46a](https://github.com/canonical/landscape-dashboard/commit/91fe46a20df71741ab2fa873e567d8d5e1952371))
- allow empty array params in legacy API
([4d28411](https://github.com/canonical/landscape-dashboard/commit/4d28411b33985fbcd521bcec0efb58a3b5f928db))
- applying monospacing to table column dates
([#269](https://github.com/canonical/landscape-dashboard/issues/269))
([1c7b748](https://github.com/canonical/landscape-dashboard/commit/1c7b7480973d03013ffc979aea3ce44f003c92af))
- change instance tabs depending on distributor
[LNDENG-2513]([#272](https://github.com/canonical/landscape-dashboard/issues/272))
([4ec5881](https://github.com/canonical/landscape-dashboard/commit/4ec5881440eabcbafce78ac7c3c681197ceccf34))
- clear selection on filter change
([#271](https://github.com/canonical/landscape-dashboard/issues/271))
([ab8602b](https://github.com/canonical/landscape-dashboard/commit/ab8602b15337cbf9549c9b90aa45fec797ebb5f4))
- close single filter when clicking any option
([e50c565](https://github.com/canonical/landscape-dashboard/commit/e50c565715bdb3d3c1427361d5939257eb783933))
- disable invalid activity actions
([#248](https://github.com/canonical/landscape-dashboard/issues/248))
([6ee0fa9](https://github.com/canonical/landscape-dashboard/commit/6ee0fa9b4a31e6cdecef0b681f15e0fdd7216eac))
- invalid livepatch expiry date
([#267](https://github.com/canonical/landscape-dashboard/issues/267))
([e60eecc](https://github.com/canonical/landscape-dashboard/commit/e60eecc4886ecfc2399ef32d63475cf678e4ad2c))
- last audit's passrate bar
([#266](https://github.com/canonical/landscape-dashboard/issues/266))
([11a5c72](https://github.com/canonical/landscape-dashboard/commit/11a5c724e94b04e061c4dd5735747b3a97af9f67))
- make tables responsive
([#280](https://github.com/canonical/landscape-dashboard/issues/280))
([89ea1d9](https://github.com/canonical/landscape-dashboard/commit/89ea1d9db8541220b1435448891b44f2ccbb7a11))
- make tags cell expandable for each profile
([#261](https://github.com/canonical/landscape-dashboard/issues/261))
([89c8ae1](https://github.com/canonical/landscape-dashboard/commit/89c8ae1eb031b2a8d6237dfe40229aed8d80612d))
- overview buttons
([#255](https://github.com/canonical/landscape-dashboard/issues/255))
([7925995](https://github.com/canonical/landscape-dashboard/commit/7925995f5e722254984015e68b9d58b2f654c374))
- remove errors when logging in
([#246](https://github.com/canonical/landscape-dashboard/issues/246))
([0b34ab8](https://github.com/canonical/landscape-dashboard/commit/0b34ab8a1cb2a925c7465aac8342a78dde319d8b))
- responsive issues with button groups, sidebar and overview page
([#277](https://github.com/canonical/landscape-dashboard/issues/277))
([6eee676](https://github.com/canonical/landscape-dashboard/commit/6eee676be8cd41f67683a822e7ce9d3d210607b9))
- set minimum interval for security profile
([#274](https://github.com/canonical/landscape-dashboard/issues/274))
([ba8107b](https://github.com/canonical/landscape-dashboard/commit/ba8107b06b72f631d68cc8a565de6d3ffd1d675c))
- show correct status for archived instances
([#247](https://github.com/canonical/landscape-dashboard/issues/247))
([d9b7251](https://github.com/canonical/landscape-dashboard/commit/d9b7251c257fa015367c6748a9b50648b7ccd6cb))
- show Identity Providers in sidebar when OIDC is available
([4bfa6de](https://github.com/canonical/landscape-dashboard/commit/4bfa6dee96ca1220f7367a031a7bc7d264c95134))
- truncated cell shows count when it shouldn't, adjust truncated info
item
([#270](https://github.com/canonical/landscape-dashboard/issues/270))
([81ce636](https://github.com/canonical/landscape-dashboard/commit/81ce6365de52f8578ba560adaca768394bdb989d))
- wrong ubuntu pro info date showing on non-ubuntu linux instances
([#275](https://github.com/canonical/landscape-dashboard/issues/275))
([13e091b](https://github.com/canonical/landscape-dashboard/commit/13e091bab316adcb0fc872ad00e090397faf9ba7))

##
[1.13.1](https://github.com/canonical/landscape-dashboard/compare/v1.13.0...v1.13.1)
(2025-05-15)

### Bug Fixes

- add empty state to instance hardware panel
([55fbf2d](https://github.com/canonical/landscape-dashboard/commit/55fbf2d5cb9d16bf640dc5a964f4b892bb482eb9))
- make forms in modals submittable by pressing enter
([c6e6c96](https://github.com/canonical/landscape-dashboard/commit/c6e6c96e042f4747c91b308045c969ea90ea5c44))
- remove access group select, filter by access group
([#241](https://github.com/canonical/landscape-dashboard/issues/241))
([cdf185e](https://github.com/canonical/landscape-dashboard/commit/cdf185e8fc9118d6377fd1a21f5356ba7f587ae0))
- restore APT sources for SaaS environment
([da81756](https://github.com/canonical/landscape-dashboard/commit/da81756b1188cdd82662b1c75e83e9a1c27590bd))
- security profile audits
([43eaf7b](https://github.com/canonical/landscape-dashboard/commit/43eaf7b22cda63bb09833188aaff959204446f44))
- security profile time zones and schedule, extra info in requests, add
tests
([4679e89](https://github.com/canonical/landscape-dashboard/commit/4679e89786b9a9473876ce341bf428c606a90017))

#
[1.13.0](https://github.com/canonical/landscape-dashboard/compare/v1.12.5...v1.13.0)
(2025-04-29)

### Bug Fixes

- adding contextual menu to Scripts
([#215](https://github.com/canonical/landscape-dashboard/issues/215))
([967ef4a](https://github.com/canonical/landscape-dashboard/commit/967ef4aa3f59403132d96fd1d7808e23810000f6))
- google auth provider icon
([1ba2a4b](https://github.com/canonical/landscape-dashboard/commit/1ba2a4bb910e17a228d176efba16e5864a2ea70c))
- move security issues table pagination to bottom
([#231](https://github.com/canonical/landscape-dashboard/issues/231))
([6c608b6](https://github.com/canonical/landscape-dashboard/commit/6c608b6e467788115ef34d13667e5613ebc0623c))
- production bug during login
([51e64ab](https://github.com/canonical/landscape-dashboard/commit/51e64abce6aa8ef8a9d261f219b15cf30665c592))
- redirect on refresh
([#210](https://github.com/canonical/landscape-dashboard/issues/210))
([ea42ad8](https://github.com/canonical/landscape-dashboard/commit/ea42ad86ceea64828f4a79215dca0ba18f21b4ae))
- upgrade and downgrade kernel forms not scheduling correctly
([79b1f85](https://github.com/canonical/landscape-dashboard/commit/79b1f85b9fdc951e1f97079643f32b5abd9d3bbb))

### Features

- add archived status in instances page
([bca548a](https://github.com/canonical/landscape-dashboard/commit/bca548adb11d3fe690aefad7d5f52270e1757169))
- add employees page; add sanitize action to single instance; add
identity issuers
([96a9275](https://github.com/canonical/landscape-dashboard/commit/96a9275859b008743ec318e6f57a0c74660dbc26))
- add reboot profiles
([#102](https://github.com/canonical/landscape-dashboard/issues/102))
([c437490](https://github.com/canonical/landscape-dashboard/commit/c4374903c7356b8120559d3c26713aecb8ac10f7))
- add security profiles
([a5e77a2](https://github.com/canonical/landscape-dashboard/commit/a5e77a2de26c0bce4106c9c3e5d204cb3a1e34c6))
- implement event based script execution
([9067514](https://github.com/canonical/landscape-dashboard/commit/90675142c11409616ee25c5fd82d9a886f28b542))
- implement feature availability checks to trigger some UI elements
visibility
([614e98b](https://github.com/canonical/landscape-dashboard/commit/614e98bdb777e38a6bafbe5d68a0c748feaac998))
- remove sentry plugin
([5d7f700](https://github.com/canonical/landscape-dashboard/commit/5d7f70068665d097b2d74bc54ae395deb8ce4198))

##
[1.12.5](https://github.com/canonical/landscape-dashboard/compare/v1.12.4...v1.12.5)
(2025-03-05)

### Bug Fixes

- diff pull pocket crash
([#199](https://github.com/canonical/landscape-dashboard/issues/199))
([6bb4076](https://github.com/canonical/landscape-dashboard/commit/6bb4076ef46875e82b7fc374d43124111e9129e9))
- make apt sources pages available for self-hosted env only
([27ac98f](https://github.com/canonical/landscape-dashboard/commit/27ac98f6ee783f4915cb10f3be10ee8f56fc2572))
- make apt sources pages available for self-hosted env only
([#201](https://github.com/canonical/landscape-dashboard/issues/201))
([bfb8b30](https://github.com/canonical/landscape-dashboard/commit/bfb8b3008e20bd3184d0af2ad9c4ee60712cd469))

##
[1.12.4](https://github.com/canonical/landscape-dashboard/compare/v1.12.3...v1.12.4)
(2025-02-12)

### Bug Fixes

- enable instance upgrades button without upgrade count
([#188](https://github.com/canonical/landscape-dashboard/issues/188))
([0f7a8b9](https://github.com/canonical/landscape-dashboard/commit/0f7a8b9ec13def86a261fc23f300812b9e7fbb21))
- prevent page from crashing when subdomain account is default one
([b74b8a9](https://github.com/canonical/landscape-dashboard/commit/b74b8a90cd75ddde215bffe12b7d2afc515fd381))

##
[1.12.3](https://github.com/canonical/landscape-dashboard/compare/v1.12.2...v1.12.3)
(2025-02-06)

### Bug Fixes

- display all instance packages
([#185](https://github.com/canonical/landscape-dashboard/issues/185))
([58789e2](https://github.com/canonical/landscape-dashboard/commit/58789e203458a5cbaeb26ee2cecaafd16d89f07c))

##
[1.12.2](https://github.com/canonical/landscape-dashboard/compare/v1.12.1...v1.12.2)
(2025-02-05)

### Bug Fixes

- table pagination disappearing briefly when going to next page on
instances page
([c92e7db](https://github.com/canonical/landscape-dashboard/commit/c92e7dba6eb488f858965c7e293acedbcd801788))

##
[1.12.1](https://github.com/canonical/landscape-dashboard/compare/v1.12.0...v1.12.1)
(2025-02-05)

### Bug Fixes

- activities page header help icon misalignment
([#181](https://github.com/canonical/landscape-dashboard/issues/181))
([ee9c985](https://github.com/canonical/landscape-dashboard/commit/ee9c98544b4de37f198e80503687dd946005d3fc))
- remove instance upgrades column
([#183](https://github.com/canonical/landscape-dashboard/issues/183))
([807ff6c](https://github.com/canonical/landscape-dashboard/commit/807ff6cd3b844838d300a171bdb9fd0b6970fcbf))
- show features for ubuntu core instances
([#182](https://github.com/canonical/landscape-dashboard/issues/182))
([c2c156f](https://github.com/canonical/landscape-dashboard/commit/c2c156fd9035dbbf83075343e96612eb37a57dbf))

#
[1.12.0](https://github.com/canonical/landscape-dashboard/compare/v1.11.1...v1.12.0)
(2025-02-03)

### Bug Fixes

- change events days filter to display label, remove events table
sorting, change "events log message" to "message"
([7d02a6b](https://github.com/canonical/landscape-dashboard/commit/7d02a6bc7b32067c33ff1c50b31569eacc29af8a))
- disable option to run scripts on windows instances
([#152](https://github.com/canonical/landscape-dashboard/issues/152))
([e3dae02](https://github.com/canonical/landscape-dashboard/commit/e3dae02be0936d78b2d1f5353ad1bda9b71d4856))
- improve page number input validation
([#175](https://github.com/canonical/landscape-dashboard/issues/175))
([1272a8a](https://github.com/canonical/landscape-dashboard/commit/1272a8a6ff4b356cc453c975d07e6011221fcaf2))
- modal closing when trying to remove saved search
([cd98b10](https://github.com/canonical/landscape-dashboard/commit/cd98b105a3a7a481cba37b46be9db426e01ec393))
- prevent double redirection while signing in
([e90e0f1](https://github.com/canonical/landscape-dashboard/commit/e90e0f18011100aa0e8de087799a035c2aa86bb6))
- remove '\\r' characters from script code if present
([#167](https://github.com/canonical/landscape-dashboard/issues/167))
([b4314c4](https://github.com/canonical/landscape-dashboard/commit/b4314c4425689476d2e29e7b6388c2676f8c6922))

### Features

- add ability to assign tags to the selected instances
([#166](https://github.com/canonical/landscape-dashboard/issues/166))
([c95e517](https://github.com/canonical/landscape-dashboard/commit/c95e517dd26909ba19a9edb20c18d32d6c3d0ae3))
- add error boundaries, connect Sentry service
([a6fd328](https://github.com/canonical/landscape-dashboard/commit/a6fd3287e21a2fba8cdc1f87f3964194e9c77bb8))
- add search chip to all pages with search, add query param validation
([9d77f75](https://github.com/canonical/landscape-dashboard/commit/9d77f75fa8744eeeb5b4fc647b9736039f9f8747))
- add table sorting to url
([15d094f](https://github.com/canonical/landscape-dashboard/commit/15d094fb69b6309980d59d8fb367bd9a821a8264))

##
[1.11.1](https://github.com/canonical/landscape-dashboard/compare/v1.11.0...v1.11.1)
(2025-01-07)

### Bug Fixes

- update react-components to 1.7.3
([#153](https://github.com/canonical/landscape-dashboard/issues/153))
([88b14fd](https://github.com/canonical/landscape-dashboard/commit/88b14fdf969651756c34c7fba6503a77a49afffd))

#
[1.11.0](https://github.com/canonical/landscape-dashboard/compare/v1.10.0...v1.11.0)
(2024-12-16)

### Bug Fixes

- add overview page lazy queries
([4375ebd](https://github.com/canonical/landscape-dashboard/commit/4375ebd33692ee736d5069ee76023c58c3a799ab))
- broken link in alerts notification page
([2b9504f](https://github.com/canonical/landscape-dashboard/commit/2b9504f02ed4f4ab21ad038af087d0011be2e5ea))
- change HTTP method to change organisation preferences
([868a812](https://github.com/canonical/landscape-dashboard/commit/868a812f9f35ceedfc7052b242cb5bd3dedd808f))
- remove access group dropdown from edit package profile form
([#155](https://github.com/canonical/landscape-dashboard/issues/155))
([053e5b4](https://github.com/canonical/landscape-dashboard/commit/053e5b444cca5e6fb583e35bdc1045656e832067))
- show empty cell in activity table when activity has no related
instance
([23ae288](https://github.com/canonical/landscape-dashboard/commit/23ae2888d8d17b3c3e6a174796fb4b3aaef5ecf6))
- unify empty state in profiles empty state
([5845267](https://github.com/canonical/landscape-dashboard/commit/584526757f52a7051a4a398290127e2bcdcb8796))

### Features

- add instances column to access groups
([#137](https://github.com/canonical/landscape-dashboard/issues/137))
([9632989](https://github.com/canonical/landscape-dashboard/commit/96329896fb79bda873e5773b94afa3c77b7e8021))
- change event log page filter
([#139](https://github.com/canonical/landscape-dashboard/issues/139))
([ace8ab6](https://github.com/canonical/landscape-dashboard/commit/ace8ab602c4cde7952a9f5108fedd11f75c2df37))
- hide 'View report' button on instances page
([2d762ad](https://github.com/canonical/landscape-dashboard/commit/2d762adeca680e30cb8974db5700af70da83a690))
- show organisation label instead of switch if user has only one
([#147](https://github.com/canonical/landscape-dashboard/issues/147))
([0539efa](https://github.com/canonical/landscape-dashboard/commit/0539efac3190a831a2646d95211bbf7ff0d3f6cb))

#
[1.10.0](https://github.com/canonical/landscape-dashboard/compare/v1.9.1...v1.10.0)
(2024-12-05)

### Bug Fixes

- add loading state during first render
([5928f61](https://github.com/canonical/landscape-dashboard/commit/5928f61bb7357617d28a1fee40e8861142464351))
- instance distribution info can be null
([#142](https://github.com/canonical/landscape-dashboard/issues/142))
([8536044](https://github.com/canonical/landscape-dashboard/commit/853604488bbce947b7ef80f25a56797066f19a9b))

### Features

- add search as a filter chip
([e6c118c](https://github.com/canonical/landscape-dashboard/commit/e6c118c501630f7149adadf27fcdd496e77d3f67))
- add welcome popup and info badge into sidebar
([#144](https://github.com/canonical/landscape-dashboard/issues/144))
([0115e73](https://github.com/canonical/landscape-dashboard/commit/0115e7377459d6d7a5549ce29645dcd9a4bd281c))

##
[1.9.1](https://github.com/canonical/landscape-dashboard/compare/v1.9.0...v1.9.1)
(2024-12-02)

### Bug Fixes

- add component to render while redirecting
([89c8640](https://github.com/canonical/landscape-dashboard/commit/89c86409d42070dfdd61f44c519eee88e3d12f1a))

#
[1.9.0](https://github.com/canonical/landscape-dashboard/compare/v1.8.1...v1.9.0)
(2024-11-25)

### Bug Fixes

- change instance column filter
([f81e6b8](https://github.com/canonical/landscape-dashboard/commit/f81e6b822e6b40f11938b35fd57753eb241b5a0e))
- encode redirection path URL param
([2f31515](https://github.com/canonical/landscape-dashboard/commit/2f31515cd4b22bc0fb17cf567fe63e7c3683072f))

### Features

- add ability to assign access group for multiple instances
([#138](https://github.com/canonical/landscape-dashboard/issues/138))
([a899f6d](https://github.com/canonical/landscape-dashboard/commit/a899f6d0a43007cff190d5e1fe63d46f3660f03e))
- add activities page filters
([#132](https://github.com/canonical/landscape-dashboard/issues/132))
([e38c721](https://github.com/canonical/landscape-dashboard/commit/e38c721efadd136f300cc77e6bf4bf2a4161f6d3))
- add version number to sidebar
([7de1392](https://github.com/canonical/landscape-dashboard/commit/7de1392de85b148a16af0fa68a2c4b071395e6d0))

##
[1.8.1](https://github.com/canonical/landscape-dashboard/compare/v1.8.0...v1.8.1)
(2024-11-20)

### Bug Fixes

- add default supported provider
([aaece65](https://github.com/canonical/landscape-dashboard/commit/aaece65773c0337076ff610dd59460513b31fa2a))
- add environment context loading state
([62263fd](https://github.com/canonical/landscape-dashboard/commit/62263fd4a3b2d5ba53b6573bfa954bf1b7704550))
- kernel tab page crash for machines with no cve fixes, improve
livepatch coverage info text
([c87d1d8](https://github.com/canonical/landscape-dashboard/commit/c87d1d8c85d4cea5dba573554e17cdfeb3cf83f9))

#
[1.8.0](https://github.com/canonical/landscape-dashboard/compare/v1.7.6...v1.8.0)
(2024-11-12)

### Features

- enable repository profiles, GPG keys and APT sources for SaaS
([b8ff2b1](https://github.com/canonical/landscape-dashboard/commit/b8ff2b1f6bbdc79d091ac73cdd4e91dc540ebef3))

##
[1.7.6](https://github.com/canonical/landscape-dashboard/compare/v1.7.5...v1.7.6)
(2024-11-08)

### Bug Fixes

- get instance OS from distribution info property
([cb4eedb](https://github.com/canonical/landscape-dashboard/commit/cb4eedb302a403d6d670bd174d2ffb0398d443da))
- show wsl profiles for self hosted only
([#130](https://github.com/canonical/landscape-dashboard/issues/130))
([8bbf5f6](https://github.com/canonical/landscape-dashboard/commit/8bbf5f69f838bdfe2429ca5b687a1749adbf7ee5))

##
[1.7.5](https://github.com/canonical/landscape-dashboard/compare/v1.7.4...v1.7.5)
(2024-11-05)

### Bug Fixes

- update support link
([2d36c12](https://github.com/canonical/landscape-dashboard/commit/2d36c12c9fc4268497fc84d420a92b63b0671e96))

##
[1.7.4](https://github.com/canonical/landscape-dashboard/compare/v1.7.3...v1.7.4)
(2024-11-01)

### Bug Fixes

- handle request params for the old fetch if user is not presented
([c021434](https://github.com/canonical/landscape-dashboard/commit/c02143427304f77febad9cbacf65329aefac68ee))

##
[1.7.3](https://github.com/canonical/landscape-dashboard/compare/v1.7.2...v1.7.3)
(2024-10-31)

### Bug Fixes

- change link component import in alert notifications
([#125](https://github.com/canonical/landscape-dashboard/issues/125))
([13726aa](https://github.com/canonical/landscape-dashboard/commit/13726aa8d2903e09a96cdaafffb156a81642769c))

##
[1.7.2](https://github.com/canonical/landscape-dashboard/compare/v1.7.1...v1.7.2)
(2024-10-30)

### Bug Fixes

- available package version not showing in package install form
([#124](https://github.com/canonical/landscape-dashboard/issues/124))
([092fee0](https://github.com/canonical/landscape-dashboard/commit/092fee0abbc1cb9feb8d5383ab17417a84522b69))
- show 'no login methods' only when appropriate
([a1d4417](https://github.com/canonical/landscape-dashboard/commit/a1d4417bbfdf1638b0f914cd679d992640346341))

##
[1.7.1](https://github.com/canonical/landscape-dashboard/compare/v1.7.0...v1.7.1)
(2024-10-29)

### Bug Fixes

- allow selecting public GPG keys when adding a new APT source
([2b6a979](https://github.com/canonical/landscape-dashboard/commit/2b6a979c5c083263b240de023cf446d7be366494))
- kernel panel error when kernel status is undefined
([#123](https://github.com/canonical/landscape-dashboard/issues/123))
([5ee63b4](https://github.com/canonical/landscape-dashboard/commit/5ee63b47410cb7e3d9fc1c5da9e6e8320f320c7b))

#
[1.7.0](https://github.com/canonical/landscape-dashboard/compare/v1.6.0...v1.7.0)
(2024-10-24)

### Bug Fixes

- add Kernel tab title and border above table section
([#122](https://github.com/canonical/landscape-dashboard/issues/122))
([9bffb93](https://github.com/canonical/landscape-dashboard/commit/9bffb93b60f64659df9379f9049db38000fe444d))

### Features

- add endpoint to get auth state using http cookie, drop local storage
using to store auth user
([eebf9db](https://github.com/canonical/landscape-dashboard/commit/eebf9dbb4895523ccbb2899077f39b4f0479fd11))

#
[1.6.0](https://github.com/canonical/landscape-dashboard/compare/v1.5.0...v1.6.0)
(2024-10-23)

### Bug Fixes

- change sign in form identity validation
([24f60ab](https://github.com/canonical/landscape-dashboard/commit/24f60aba52067c128ed631611afd91e543440fd0))
- handle trailing slash in root path, change default page redirect after
signing in
([e8ac8e3](https://github.com/canonical/landscape-dashboard/commit/e8ac8e309cab6334f3f1d238cc1e0ab10079f484))

### Features

- add badge to Kernel tab
([#120](https://github.com/canonical/landscape-dashboard/issues/120))
([103b45d](https://github.com/canonical/landscape-dashboard/commit/103b45dc54f88571262c0796981cedec1b8dd5c1))
- add standalone OIDC
([00ddfd6](https://github.com/canonical/landscape-dashboard/commit/00ddfd6ed3387332488e229350f3d90648593006))

#
[1.5.0](https://github.com/canonical/landscape-dashboard/compare/v1.4.3...v1.5.0)
(2024-10-15)

### Bug Fixes

- remove sign in form email validation, rename 'email' field into
'identity'
([9e529f9](https://github.com/canonical/landscape-dashboard/commit/9e529f975fb2da2f28caab6a13a48fdf74d43ddc))

### Features

- add availability zones to instances; change instance filters layout
([#104](https://github.com/canonical/landscape-dashboard/issues/104))
([b2a8e1d](https://github.com/canonical/landscape-dashboard/commit/b2a8e1d3c36dac9bdb3ba9ea459d6b8b2c01625e))
- add dev PPA build to build workflow
([#109](https://github.com/canonical/landscape-dashboard/issues/109))
([75af5f9](https://github.com/canonical/landscape-dashboard/commit/75af5f95c7b00670827a4f7f443bccad757b01fb))
- add Kernel tab in single instance view
([5244f93](https://github.com/canonical/landscape-dashboard/commit/5244f93b72dc91a48d9e98af6ee7e1261c70b3ed))

##
[1.4.3](https://github.com/canonical/landscape-dashboard/compare/v1.4.2...v1.4.3)
(2024-10-10)

### Bug Fixes

- close modal window after accepting or rejecting pending instances,
style: change auth template styles
([e96df23](https://github.com/canonical/landscape-dashboard/commit/e96df232e078a08d2ed94b81b6f8063d31a8b2ab))

##
[1.4.2](https://github.com/canonical/landscape-dashboard/compare/v1.4.1...v1.4.2)
(2024-10-08)

### Bug Fixes

- repository profile showing for saas version
([9f8e205](https://github.com/canonical/landscape-dashboard/commit/9f8e205d7f2f2977dedcf556a165b395165183f4))

##
[1.4.1](https://github.com/canonical/landscape-dashboard/compare/v1.4.0...v1.4.1)
(2024-10-08)

### Bug Fixes

- secondary navigation not appearing for account settings
([846215a](https://github.com/canonical/landscape-dashboard/commit/846215ae426fd49baff64a76d574fbe61860491d))

#
[1.4.0](https://github.com/canonical/landscape-dashboard/compare/v1.3.0...v1.4.0)
(2024-10-07)

### Features

- add custom SSO providers: Okta and Ubuntu One
([03437ce](https://github.com/canonical/landscape-dashboard/commit/03437ce7bac8e055f848062251b19884f39a2930))

#
[1.3.0](https://github.com/canonical/landscape-dashboard/compare/v1.2.1...v1.3.0)
(2024-10-03)

### Bug Fixes

- use default icon for unknown alert type
([901e6b7](https://github.com/canonical/landscape-dashboard/commit/901e6b775b3c06cb77ad70455b575354b6921d5b))

### Features

- add new child instance alert
([5b2342b](https://github.com/canonical/landscape-dashboard/commit/5b2342b4b2004da55fdf1036a0dbbeef5e06c03a))

##
[1.2.1](https://github.com/canonical/landscape-dashboard/compare/v1.2.0...v1.2.1)
(2024-09-27)

### Bug Fixes

- bug causing switching organisations not to work
([89728bd](https://github.com/canonical/landscape-dashboard/commit/89728bdf2df276f4a7b6604f751b856e74fa0820))

#
[1.2.0](https://github.com/canonical/landscape-dashboard/compare/v1.1.0...v1.2.0)
(2024-09-23)

### Bug Fixes

- show "Reboot recommended" instance status correctly
([4c12910](https://github.com/canonical/landscape-dashboard/commit/4c12910eecf1e424e4b8565055b7699f9f138c84))

### Features

- implement WSL profiles page
([#108](https://github.com/canonical/landscape-dashboard/issues/108))
([9336864](https://github.com/canonical/landscape-dashboard/commit/93368642f6b2e7226dff23a2a68e353a7378a2c5))

#
[1.1.0](https://github.com/canonical/landscape-dashboard/compare/v1.0.0...v1.1.0)
(2024-09-10)

### Features

- add changelog
([54cfcb2](https://github.com/canonical/landscape-dashboard/commit/54cfcb2b07b2dfae22ab07724c16ba7878a6924d))


[LNDENG-3116]:
https://warthogs.atlassian.net/browse/LNDENG-3116?atlOrigin=eyJpIjoiNWRkNTljNzYxNjVmNDY3MDlhMDU5Y2ZhYzA5YTRkZjUiLCJwIjoiZ2l0aHViLWNvbS1KU1cifQ

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 3b78c0954..d0fc4fa15 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "landscape-ui",
   "private": true,
-  "version": "26.04.0.47",
+  "version": "26.04.0.70",
   "type": "module",
   "engines": {
     "node": ">=24"

From 132adf0ead470cc2b9780b0ab2dfad1c2ee25958 Mon Sep 17 00:00:00 2001
From: Rubin Aga <66167934+rubinaga@users.noreply.github.com>
Date: Fri, 17 Apr 2026 15:57:23 +0200
Subject: [PATCH 20/42] feat: add missing buttons to script details panel
 (#511)

## Summary

More information on this PR can be found in [this Jira
ticket](https://warthogs.atlassian.net/browse/LNDENG-4066)

Additional [Jira ticket 3880 covered
here](https://warthogs.atlassian.net/browse/LNDENG-3880)

Other than the changes requested there the following were also added:
- Fixed long sidepanel title causing sidepanel to be horizontally
scrollable
- Fixed bug causing side navigation bar to be visible (not hidden behind
the modal) when script modals were opened
- Added `tags` column to "Run script" preview modal, before it showed
just "Instance" column:
<img width="2070" height="1152" alt="image"
src="https://github.com/user-attachments/assets/97b6cdb2-5115-444d-b707-699db5299a38"
/>
- Changed modal pagination to new `ModalTablePagination` component

## Release Impact

According to the [Landscape Server Release
Cycle](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `dev` / `main` (Beta)
- **Version Impact**:
  - [x] Patch (Fix)
  - [ ] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [x] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [x] **UI Verified**: I have verified the changes locally.
- [x] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.
---
 .changeset/thick-zoos-watch.md                |   8 +
 .../MultiSelectField.module.scss              |  20 +-
 .../MultiSelectField/MultiSelectField.tsx     |  85 +++++---
 .../SidePanelFormButtons.tsx                  |   3 +
 .../layout/SearchHelpPopup.module.scss        |   2 +-
 src/components/layout/SearchHelpPopup.tsx     |   2 +-
 src/context/SidePanelProvider.module.scss     |   4 +
 src/context/sidePanel.tsx                     |   4 +-
 .../scripts/api/useCreateScriptAttachment.ts  |   2 +-
 .../api/useGetSingleScriptAttachment.ts       |   6 +-
 .../AttachmentFile/AttachmentFile.test.tsx    |  52 ++++-
 .../AttachmentFile/AttachmentFile.tsx         |  32 +--
 .../EditScriptConfirmationModal.test.tsx      | 111 ++++++++++
 .../EditScriptConfirmationModal.tsx           | 113 ++++++++++
 .../EditScriptConfirmationModal/index.ts      |   1 +
 .../EditScriptForm/EditScriptForm.module.scss |   7 -
 .../EditScriptForm/EditScriptForm.test.tsx    |  47 +++-
 .../EditScriptForm/EditScriptForm.tsx         | 142 +++---------
 .../RunScriptForm/RunScriptForm.test.tsx      | 186 +++++++++++++++-
 .../RunScriptForm/RunScriptForm.tsx           | 202 ++++++++++++++----
 .../components/RunScriptForm/constants.ts     |   6 +-
 .../scripts/components/RunScriptForm/types.ts |   1 +
 .../RunScriptFormInstanceList.test.tsx        | 131 ++++++++++++
 .../RunScriptFormInstanceList.tsx             | 104 +++++++--
 .../RunScriptFormInstanceList/helpers.ts      |   7 +
 .../ScriptDetails/ScriptDetails.test.tsx      |  48 ++++-
 .../ScriptDetails/ScriptDetails.tsx           | 117 ++++++++--
 src/features/scripts/helpers.ts               |   2 +-
 .../api/useGetSecurityProfileAuditDownload.ts |   7 +-
 .../SecurityProfileDetailsSidePanel.tsx       |   4 +-
 .../SecurityProfileDownloadAuditForm.tsx      |   4 +-
 .../SecurityProfilesContainer.tsx             |   4 +-
 src/features/security-profiles/helpers.tsx    |  25 ++-
 .../hooks/useSecurityProfileDownload.tsx      | 133 ++++++++++++
 .../hooks/useSecurityProfileDownloadAudit.tsx |  34 ---
 src/tests/mocks/script.ts                     |  15 ++
 src/tests/server/handlers/script.ts           |  80 ++++++-
 37 files changed, 1429 insertions(+), 322 deletions(-)
 create mode 100644 .changeset/thick-zoos-watch.md
 create mode 100644 src/features/scripts/components/EditScriptConfirmationModal/EditScriptConfirmationModal.test.tsx
 create mode 100644 src/features/scripts/components/EditScriptConfirmationModal/EditScriptConfirmationModal.tsx
 create mode 100644 src/features/scripts/components/EditScriptConfirmationModal/index.ts
 delete mode 100644 src/features/scripts/components/EditScriptForm/EditScriptForm.module.scss
 create mode 100644 src/features/scripts/components/RunScriptFormInstanceList/RunScriptFormInstanceList.test.tsx
 create mode 100644 src/features/scripts/components/RunScriptFormInstanceList/helpers.ts
 create mode 100644 src/features/security-profiles/hooks/useSecurityProfileDownload.tsx
 delete mode 100644 src/features/security-profiles/hooks/useSecurityProfileDownloadAudit.tsx

diff --git a/.changeset/thick-zoos-watch.md b/.changeset/thick-zoos-watch.md
new file mode 100644
index 000000000..ca8b2e0da
--- /dev/null
+++ b/.changeset/thick-zoos-watch.md
@@ -0,0 +1,8 @@
+---
+"landscape-ui": patch
+---
+
+- Add missing buttons to script details panel
+- Add ability to edit a script before running
+- Fix large script attachments not being uploaded properly
+- Fix audit and tailor security profile files not being downloaded properly
diff --git a/src/components/form/MultiSelectField/MultiSelectField.module.scss b/src/components/form/MultiSelectField/MultiSelectField.module.scss
index dab9740b8..25347122b 100644
--- a/src/components/form/MultiSelectField/MultiSelectField.module.scss
+++ b/src/components/form/MultiSelectField/MultiSelectField.module.scss
@@ -19,8 +19,22 @@
       }
     }
   }
-}
 
-.errorMessage {
-  margin-top: $spv--medium;
+  &:global(.is-caution) {
+    :global(.multi-select__select-button) {
+      border-bottom-color: $color-caution;
+
+      &:not(:hover, [aria-expanded="true"]) {
+        background-color: $color-caution-background;
+      }
+
+      &:hover:not([aria-expanded="true"]) {
+        background-color: $color-caution-background--hover;
+      }
+
+      &[aria-expanded="true"] {
+        background-color: $color-caution-background--focus;
+      }
+    }
+  }
 }
diff --git a/src/components/form/MultiSelectField/MultiSelectField.tsx b/src/components/form/MultiSelectField/MultiSelectField.tsx
index 6a151a247..31b4f1f9c 100644
--- a/src/components/form/MultiSelectField/MultiSelectField.tsx
+++ b/src/components/form/MultiSelectField/MultiSelectField.tsx
@@ -1,5 +1,5 @@
 import type { FC, RefObject, ReactNode, Ref } from "react";
-import { useRef } from "react";
+import { useRef, useEffect } from "react";
 import type { MultiSelectProps } from "@canonical/react-components";
 import { MultiSelect } from "@canonical/react-components";
 import classNames from "classnames";
@@ -11,6 +11,9 @@ interface MultiSelectFieldProps extends Omit<MultiSelectProps, "help"> {
   readonly innerRef?: Ref<HTMLDivElement>;
   readonly label?: string;
   readonly labelClassName?: string;
+  readonly onOpen?: () => void;
+  readonly onClose?: () => void;
+  readonly warning?: ReactNode;
 }
 
 const MultiSelectField: FC<MultiSelectFieldProps> = ({
@@ -24,16 +27,57 @@ const MultiSelectField: FC<MultiSelectFieldProps> = ({
   items,
   label,
   labelClassName,
+  onOpen,
+  onClose,
   required,
+  warning,
   ...otherProps
 }) => {
-  const controlRef = useRef<HTMLButtonElement | HTMLInputElement>(null);
-  const dropdownIdRef = useRef("");
+  const containerRef = useRef<HTMLDivElement>(null);
+
+  // Keep the latest callbacks in refs so the MutationObserver always
+  // calls the most recent version without needing to re-observe.
+  const onOpenRef = useRef(onOpen);
+  const onCloseRef = useRef(onClose);
+  useEffect(() => {
+    onOpenRef.current = onOpen;
+    onCloseRef.current = onClose;
+  });
+
+  // Watch aria-expanded on the Canonical control element. This is the only
+  // reliable signal for open/close — the dropdown is portalled so focus/blur
+  // events on the wrapper are unreliable.
+  useEffect(() => {
+    const container = containerRef.current;
+    if (!container) return;
+
+    // MultiSelect renders its button synchronously, so it is in the DOM
+    // by the time this effect runs (after first paint).
+    const control = container.querySelector<HTMLElement>("[aria-expanded]");
+    if (!control) return;
+
+    const observer = new MutationObserver(() => {
+      if (control.getAttribute("aria-expanded") === "true") {
+        onOpenRef.current?.();
+      } else {
+        onCloseRef.current?.();
+      }
+    });
+
+    observer.observe(control, {
+      attributes: true,
+      attributeFilter: ["aria-expanded"],
+    });
+
+    return () => {
+      observer.disconnect();
+    };
+  }, []);
 
   const containerRefCallback = (node: HTMLDivElement | null) => {
-    if (!node) {
-      return;
-    }
+    (containerRef as RefObject<HTMLDivElement | null>).current = node;
+
+    if (!node) return;
 
     if (innerRef) {
       if (typeof innerRef === "function") {
@@ -42,22 +86,6 @@ const MultiSelectField: FC<MultiSelectFieldProps> = ({
         (innerRef as RefObject<HTMLDivElement>).current = node;
       }
     }
-
-    if (!node.closest(".l-aside")) {
-      return;
-    }
-
-    const button = node.querySelector<HTMLButtonElement>(
-      ".multi-select__select-button",
-    );
-    const input = node.querySelector<HTMLInputElement>(".p-search-box__input");
-
-    (
-      controlRef as RefObject<HTMLButtonElement | HTMLInputElement | null>
-    ).current = button || input;
-
-    dropdownIdRef.current =
-      controlRef.current?.getAttribute("aria-controls") || "";
   };
 
   const footer = error ? (
@@ -80,6 +108,7 @@ const MultiSelectField: FC<MultiSelectFieldProps> = ({
       className={classNames(
         "p-form-validation p-form__group",
         { "is-error": !!error },
+        { "is-caution": !!warning },
         classes.container,
         className,
       )}
@@ -108,15 +137,15 @@ const MultiSelectField: FC<MultiSelectFieldProps> = ({
         {...otherProps}
       />
       {error && (
-        <p
-          className={classNames(
-            classes.errorMessage,
-            "p-form-validation__message",
-          )}
-        >
+        <p className="p-form-validation__message">
           <span>{error}</span>
         </p>
       )}
+      {warning && (
+        <p className="p-form-validation__message">
+          <span>{warning}</span>
+        </p>
+      )}
     </div>
   );
 };
diff --git a/src/components/form/SidePanelFormButtons/SidePanelFormButtons.tsx b/src/components/form/SidePanelFormButtons/SidePanelFormButtons.tsx
index fc57173c3..bb6ff3fd9 100644
--- a/src/components/form/SidePanelFormButtons/SidePanelFormButtons.tsx
+++ b/src/components/form/SidePanelFormButtons/SidePanelFormButtons.tsx
@@ -10,6 +10,7 @@ interface SidePanelFormButtonsProps {
   readonly submitButtonAriaLabel?: string;
   readonly submitButtonLoading?: boolean;
   readonly secondaryActionButtonTitle?: ReactNode;
+  readonly secondaryActionButtonDisabled?: boolean;
   readonly secondaryActionButtonSubmit?: (
     event: SyntheticEvent,
   ) => Promise<void> | void;
@@ -29,6 +30,7 @@ const SidePanelFormButtons: FC<SidePanelFormButtonsProps> = ({
   submitButtonText,
   submitButtonAriaLabel,
   secondaryActionButtonTitle,
+  secondaryActionButtonDisabled,
   secondaryActionButtonSubmit,
   onBackButtonPress,
   onCancel,
@@ -67,6 +69,7 @@ const SidePanelFormButtons: FC<SidePanelFormButtonsProps> = ({
               type="button"
               className="u-no-margin--bottom"
               onClick={secondaryActionButtonSubmit}
+              disabled={secondaryActionButtonDisabled}
             >
               <>{secondaryActionButtonTitle}</>
             </Button>
diff --git a/src/components/layout/SearchHelpPopup.module.scss b/src/components/layout/SearchHelpPopup.module.scss
index a48f95325..7e9181a43 100644
--- a/src/components/layout/SearchHelpPopup.module.scss
+++ b/src/components/layout/SearchHelpPopup.module.scss
@@ -2,7 +2,7 @@
   width: 30%;
 }
 
-:global(.p-modal) {
+.modal {
   table {
     width: 60rem;
   }
diff --git a/src/components/layout/SearchHelpPopup.tsx b/src/components/layout/SearchHelpPopup.tsx
index b35922e41..785d4d45f 100644
--- a/src/components/layout/SearchHelpPopup.tsx
+++ b/src/components/layout/SearchHelpPopup.tsx
@@ -32,7 +32,7 @@ const SearchHelpPopup: FC<SearchHelpPopupProps> = ({ open, onClose, data }) => {
 
   return (
     open && (
-      <Modal title="Search help" close={onClose}>
+      <Modal title="Search help" close={onClose} className={classes.modal}>
         <p>
           Available search terms for use in the search box. If multiple search
           terms are separated by OR, any of the conditions will match.
diff --git a/src/context/SidePanelProvider.module.scss b/src/context/SidePanelProvider.module.scss
index bd6960472..193b8583d 100644
--- a/src/context/SidePanelProvider.module.scss
+++ b/src/context/SidePanelProvider.module.scss
@@ -14,6 +14,10 @@
   column-gap: $sph--large;
 }
 
+.title {
+  overflow-wrap: anywhere;
+}
+
 .outerDiv {
   display: flex;
   flex-grow: 1;
diff --git a/src/context/sidePanel.tsx b/src/context/sidePanel.tsx
index 3d56fe38d..e715c2b34 100644
--- a/src/context/sidePanel.tsx
+++ b/src/context/sidePanel.tsx
@@ -111,7 +111,9 @@ const SidePanelProvider: FC<SidePanelProviderProps> = ({ children }) => {
         {open && (
           <>
             <div className={classNames("p-panel__header", classes.header)}>
-              <h3 className="p-panel__title">{title}</h3>
+              <h3 className={classNames("p-panel__title", classes.title)}>
+                {title}
+              </h3>
               <p className="u-text--muted">
                 <i>{titleLabel}</i>
               </p>
diff --git a/src/features/scripts/api/useCreateScriptAttachment.ts b/src/features/scripts/api/useCreateScriptAttachment.ts
index b0e6ee111..3448f92ce 100644
--- a/src/features/scripts/api/useCreateScriptAttachment.ts
+++ b/src/features/scripts/api/useCreateScriptAttachment.ts
@@ -20,7 +20,7 @@ export const useCreateScriptAttachment = () => {
   >({
     mutationKey: ["scripts", "createAttachment"],
     mutationFn: async (params) =>
-      authFetch.get("CreateScriptAttachment", { params }),
+      authFetch.post("CreateScriptAttachment", params),
     onSuccess: async () =>
       queryClient.invalidateQueries({ queryKey: ["scripts"] }),
   });
diff --git a/src/features/scripts/api/useGetSingleScriptAttachment.ts b/src/features/scripts/api/useGetSingleScriptAttachment.ts
index 68fca52fc..9b62642de 100644
--- a/src/features/scripts/api/useGetSingleScriptAttachment.ts
+++ b/src/features/scripts/api/useGetSingleScriptAttachment.ts
@@ -20,10 +20,12 @@ export const useGetSingleScriptAttachment = (
     data: response,
     isLoading,
     refetch,
-  } = useQuery<AxiosResponse<string>, AxiosError<ApiError>>({
+  } = useQuery<AxiosResponse<Blob>, AxiosError<ApiError>>({
     queryKey: ["scripts", "attachment", attachmentId],
     queryFn: async () =>
-      authFetch.get(`scripts/${scriptId}/attachments/${attachmentId}`),
+      authFetch.get(`scripts/${scriptId}/attachments/${attachmentId}`, {
+        responseType: "blob",
+      }),
     ...config,
   });
 
diff --git a/src/features/scripts/components/AttachmentFile/AttachmentFile.test.tsx b/src/features/scripts/components/AttachmentFile/AttachmentFile.test.tsx
index e1f9e9b3b..d8872e6ec 100644
--- a/src/features/scripts/components/AttachmentFile/AttachmentFile.test.tsx
+++ b/src/features/scripts/components/AttachmentFile/AttachmentFile.test.tsx
@@ -1,9 +1,23 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
 import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
+import { screen, waitFor } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
 import type { ComponentProps } from "react";
-import { describe, it } from "vitest";
+import { beforeEach, describe, it, vi } from "vitest";
 import AttachmentFile from "./AttachmentFile";
 
+const createObjectURLMock = vi.fn((_object: Blob | MediaSource) => "blob:test");
+const revokeObjectURLMock = vi.fn();
+
+Object.defineProperty(URL, "createObjectURL", {
+  writable: true,
+  value: createObjectURLMock,
+});
+Object.defineProperty(URL, "revokeObjectURL", {
+  writable: true,
+  value: revokeObjectURLMock,
+});
+
 const baseProps: ComponentProps<typeof AttachmentFile> = {
   attachmentId: 1,
   filename: "test.txt",
@@ -21,6 +35,11 @@ const propsWithInitialAttachmentDelete: ComponentProps<typeof AttachmentFile> =
   };
 
 describe("AttachmentFile", () => {
+  beforeEach(() => {
+    setEndpointStatus("default");
+    vi.clearAllMocks();
+  });
+
   it("should display attachment file with script id prop", async () => {
     renderWithProviders(<AttachmentFile {...propsWithScriptId} />);
 
@@ -54,4 +73,33 @@ describe("AttachmentFile", () => {
     });
     expect(deleteButton).toBeInTheDocument();
   });
+
+  it("downloads blob attachments and revokes object URL", async () => {
+    const clickSpy = vi
+      .spyOn(HTMLAnchorElement.prototype, "click")
+      .mockImplementation(() => undefined);
+    const user = userEvent.setup();
+
+    renderWithProviders(<AttachmentFile {...propsWithScriptId} />);
+    await user.click(
+      screen.getByRole("button", {
+        name: `Download ${propsWithScriptId.filename}`,
+      }),
+    );
+
+    await waitFor(() => {
+      expect(createObjectURLMock).toHaveBeenCalledTimes(1);
+      expect(clickSpy).toHaveBeenCalledTimes(1);
+      expect(revokeObjectURLMock).toHaveBeenCalledWith("blob:test");
+    });
+
+    const blobToDownload = createObjectURLMock.mock.calls[0]?.[0];
+    expect(blobToDownload).toBeInstanceOf(Blob);
+    if (!(blobToDownload instanceof Blob)) {
+      throw new Error("Expected downloaded data to be a Blob.");
+    }
+    expect(blobToDownload.type).toContain("text/plain");
+
+    clickSpy.mockRestore();
+  });
 });
diff --git a/src/features/scripts/components/AttachmentFile/AttachmentFile.tsx b/src/features/scripts/components/AttachmentFile/AttachmentFile.tsx
index 9e429268e..42a55d5f0 100644
--- a/src/features/scripts/components/AttachmentFile/AttachmentFile.tsx
+++ b/src/features/scripts/components/AttachmentFile/AttachmentFile.tsx
@@ -1,6 +1,7 @@
 import { Button, Icon, ICONS, Tooltip } from "@canonical/react-components";
 import classNames from "classnames";
 import type { FC } from "react";
+import useDebug from "@/hooks/useDebug";
 import { useGetSingleScriptAttachment } from "../../api";
 import classes from "./AttachmentFile.module.scss";
 
@@ -19,26 +20,31 @@ const AttachmentFile: FC<AttachmentFileProps> = ({
   scriptId,
   className,
 }) => {
+  const debug = useDebug();
+
   const { isScriptAttachmentsLoading, refetch } = useGetSingleScriptAttachment(
     { attachmentId, scriptId: scriptId || 0 },
     { enabled: false },
   );
 
   const handleDownload = async () => {
-    const { data } = await refetch();
-    if (!data) {
-      return;
-    }
+    try {
+      const { data } = await refetch();
+      if (!data) {
+        throw new Error("Could not download attachment.");
+      }
 
-    const blob = new Blob([data.data], { type: "application/octet-stream" });
-    const url = URL.createObjectURL(blob);
-    const a = document.createElement("a");
-    a.href = url;
-    a.download = filename;
-    document.body.appendChild(a);
-    a.click();
-    a.remove();
-    URL.revokeObjectURL(url);
+      const url = URL.createObjectURL(data.data);
+      const a = document.createElement("a");
+      a.href = url;
+      a.download = filename;
+      document.body.appendChild(a);
+      a.click();
+      a.remove();
+      URL.revokeObjectURL(url);
+    } catch (error) {
+      debug(error);
+    }
   };
 
   return (
diff --git a/src/features/scripts/components/EditScriptConfirmationModal/EditScriptConfirmationModal.test.tsx b/src/features/scripts/components/EditScriptConfirmationModal/EditScriptConfirmationModal.test.tsx
new file mode 100644
index 000000000..7c051179a
--- /dev/null
+++ b/src/features/scripts/components/EditScriptConfirmationModal/EditScriptConfirmationModal.test.tsx
@@ -0,0 +1,111 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
+import { scripts } from "@/tests/mocks/script";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import type { ComponentProps } from "react";
+import { describe, expect, it, vi } from "vitest";
+import EditScriptConfirmationModal from "./EditScriptConfirmationModal";
+
+const [scriptWithProfiles] = scripts;
+
+type Props = ComponentProps<typeof EditScriptConfirmationModal>;
+
+const defaultProps: Props = {
+  script: scriptWithProfiles,
+  confirmButtonLabel: "Submit new version",
+  isConfirming: false,
+  onConfirm: vi.fn(),
+  onClose: vi.fn(),
+};
+
+describe("EditScriptConfirmationModal", () => {
+  const user = userEvent.setup();
+
+  it("should display the modal title with the script name", async () => {
+    renderWithProviders(<EditScriptConfirmationModal {...defaultProps} />);
+
+    expect(
+      await screen.findByText(
+        `Submit new version of "${scriptWithProfiles.title}"`,
+      ),
+    ).toBeInTheDocument();
+  });
+
+  it("should show the confirm button with the provided label", async () => {
+    renderWithProviders(
+      <EditScriptConfirmationModal
+        {...defaultProps}
+        confirmButtonLabel="Submit and run"
+      />,
+    );
+
+    expect(
+      await screen.findByRole("button", { name: "Submit and run" }),
+    ).toBeInTheDocument();
+  });
+
+  it("should show a generic message when there are no associated profiles", async () => {
+    setEndpointStatus({ status: "empty", path: "script-profiles" });
+
+    renderWithProviders(<EditScriptConfirmationModal {...defaultProps} />);
+
+    expect(
+      await screen.findByText(
+        /All future script runs will be done using the latest version of the code\./i,
+      ),
+    ).toBeInTheDocument();
+    expect(screen.queryByRole("table")).not.toBeInTheDocument();
+  });
+
+  it("should show the affected profiles table when there are associated profiles", async () => {
+    renderWithProviders(<EditScriptConfirmationModal {...defaultProps} />);
+
+    expect(
+      await screen.findByText(
+        /Submitting these changes will affect the following profiles/i,
+      ),
+    ).toBeInTheDocument();
+    expect(screen.getByRole("table")).toBeInTheDocument();
+    expect(
+      screen.getByText(scriptWithProfiles.script_profiles[0].title),
+    ).toBeInTheDocument();
+  });
+
+  it("should call onConfirm when the confirm button is clicked", async () => {
+    const onConfirm = vi.fn();
+
+    renderWithProviders(
+      <EditScriptConfirmationModal {...defaultProps} onConfirm={onConfirm} />,
+    );
+
+    await user.click(
+      await screen.findByRole("button", { name: /submit new version/i }),
+    );
+
+    expect(onConfirm).toHaveBeenCalledOnce();
+  });
+
+  it("should call onClose when the cancel button is clicked", async () => {
+    const onClose = vi.fn();
+
+    renderWithProviders(
+      <EditScriptConfirmationModal {...defaultProps} onClose={onClose} />,
+    );
+
+    await user.click(await screen.findByRole("button", { name: /cancel/i }));
+
+    expect(onClose).toHaveBeenCalledOnce();
+  });
+
+  it("should disable the confirm button when isConfirming is true", async () => {
+    renderWithProviders(
+      <EditScriptConfirmationModal {...defaultProps} isConfirming={true} />,
+    );
+
+    const confirmButton = await screen.findByRole("button", {
+      name: /waiting for action to complete/i,
+    });
+    expect(confirmButton).toHaveAttribute("aria-disabled", "true");
+  });
+});
diff --git a/src/features/scripts/components/EditScriptConfirmationModal/EditScriptConfirmationModal.tsx b/src/features/scripts/components/EditScriptConfirmationModal/EditScriptConfirmationModal.tsx
new file mode 100644
index 000000000..cd8ea5593
--- /dev/null
+++ b/src/features/scripts/components/EditScriptConfirmationModal/EditScriptConfirmationModal.tsx
@@ -0,0 +1,113 @@
+import LoadingState from "@/components/layout/LoadingState";
+import NoData from "@/components/layout/NoData";
+import { ROUTES } from "@/libs/routes";
+import { ConfirmationModal, ModularTable } from "@canonical/react-components";
+import type { FC } from "react";
+import { Link } from "react-router";
+import type { CellProps } from "react-table";
+import { useGetAssociatedScriptProfiles } from "../../api";
+import type { Script, TruncatedScriptProfile } from "../../types";
+import { pluralizeWithCount } from "@/utils/_helpers";
+
+interface EditScriptConfirmationModalProps {
+  readonly script: Script;
+  readonly confirmButtonLabel: string;
+  readonly isConfirming: boolean;
+  readonly onConfirm: () => void;
+  readonly onClose: () => void;
+}
+
+const EditScriptConfirmationModal: FC<EditScriptConfirmationModalProps> = ({
+  script,
+  confirmButtonLabel,
+  isConfirming,
+  onConfirm,
+  onClose,
+}) => {
+  const { associatedScriptProfiles, isAssociatedScriptProfilesLoading } =
+    useGetAssociatedScriptProfiles(script.id);
+
+  const modalContent = () => {
+    if (isAssociatedScriptProfilesLoading) {
+      return <LoadingState />;
+    }
+
+    if (associatedScriptProfiles.length === 0) {
+      return (
+        <p>
+          All future script runs will be done using the latest version of the
+          code.
+        </p>
+      );
+    }
+
+    return (
+      <>
+        <p>
+          All future script runs will be done using the latest version of the
+          code. Submitting these changes will affect the following profiles:
+        </p>
+        <ModularTable
+          columns={[
+            {
+              Header: "active profiles",
+              accessor: "title",
+              Cell: ({ row }: CellProps<TruncatedScriptProfile>) => (
+                <Link
+                  to={ROUTES.scripts.root({ tab: "profiles" })}
+                  state={{ scriptProfileId: row.original.id }}
+                  target="_blank"
+                >
+                  {row.original.title}
+                </Link>
+              ),
+            },
+            {
+              Header: "associated instances",
+              Cell: ({ row }: CellProps<TruncatedScriptProfile>) => {
+                const associatedProfile = associatedScriptProfiles.find(
+                  (profile) => profile.id === row.original.id,
+                );
+
+                const associatedComputers =
+                  associatedProfile?.computers.num_associated_computers;
+
+                return associatedComputers ? (
+                  <Link
+                    to={ROUTES.instances.root({
+                      tags: associatedProfile?.tags,
+                    })}
+                    target="_blank"
+                  >
+                    {pluralizeWithCount(associatedComputers, "instance")}
+                  </Link>
+                ) : (
+                  <NoData />
+                );
+              },
+            },
+          ]}
+          data={script.script_profiles}
+        />
+      </>
+    );
+  };
+
+  return (
+    <ConfirmationModal
+      renderInPortal
+      title={`Submit new version of "${script.title}"`}
+      confirmButtonLabel={confirmButtonLabel}
+      onConfirm={onConfirm}
+      confirmButtonAppearance="positive"
+      confirmButtonDisabled={isConfirming}
+      confirmButtonLoading={isConfirming}
+      close={onClose}
+      confirmButtonProps={{ type: "button" }}
+    >
+      {modalContent()}
+    </ConfirmationModal>
+  );
+};
+
+export default EditScriptConfirmationModal;
diff --git a/src/features/scripts/components/EditScriptConfirmationModal/index.ts b/src/features/scripts/components/EditScriptConfirmationModal/index.ts
new file mode 100644
index 000000000..17f0002a5
--- /dev/null
+++ b/src/features/scripts/components/EditScriptConfirmationModal/index.ts
@@ -0,0 +1 @@
+export { default } from "./EditScriptConfirmationModal";
diff --git a/src/features/scripts/components/EditScriptForm/EditScriptForm.module.scss b/src/features/scripts/components/EditScriptForm/EditScriptForm.module.scss
deleted file mode 100644
index 19b0d8a37..000000000
--- a/src/features/scripts/components/EditScriptForm/EditScriptForm.module.scss
+++ /dev/null
@@ -1,7 +0,0 @@
-@import "vanilla-framework/scss/settings_colors";
-
-.modal {
-  table {
-    max-width: 40em;
-  }
-}
diff --git a/src/features/scripts/components/EditScriptForm/EditScriptForm.test.tsx b/src/features/scripts/components/EditScriptForm/EditScriptForm.test.tsx
index d5ee5e965..c70b11459 100644
--- a/src/features/scripts/components/EditScriptForm/EditScriptForm.test.tsx
+++ b/src/features/scripts/components/EditScriptForm/EditScriptForm.test.tsx
@@ -1,17 +1,23 @@
 import { scripts } from "@/tests/mocks/script";
 import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
+import { screen, within } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
+import type { ComponentProps } from "react";
 import { describe, it } from "vitest";
 import EditScriptForm from "./EditScriptForm";
 
 const [script] = scripts;
 
+const props: ComponentProps<typeof EditScriptForm> = {
+  script,
+  onBack: vi.fn(),
+};
+
 describe("EditScriptForm", () => {
   const user = userEvent.setup();
 
   it("should display edit script form", async () => {
-    renderWithProviders(<EditScriptForm script={script} />);
+    renderWithProviders(<EditScriptForm {...props} />);
 
     expect(screen.getByText(/title/i)).toBeInTheDocument();
     expect(screen.getByText(/code/i)).toBeInTheDocument();
@@ -19,19 +25,38 @@ describe("EditScriptForm", () => {
     expect(screen.getByText(/submit new version/i)).toBeInTheDocument();
   });
 
-  it("should display confirmation modal when submitting changes", async () => {
-    renderWithProviders(<EditScriptForm script={script} />);
+  it("should show the edit confirmation modal when 'Submit new version' is clicked", async () => {
+    renderWithProviders(<EditScriptForm {...props} />);
+
+    await user.type(screen.getByRole("textbox", { name: /title/i }), " edited");
+    await user.click(
+      screen.getByRole("button", { name: /submit new version/i }),
+    );
+
+    expect(await screen.findByRole("dialog")).toBeInTheDocument();
+    expect(
+      within(await screen.findByRole("dialog")).getByRole("button", {
+        name: /submit new version/i,
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it("should submit the new version and show a success notification", async () => {
+    renderWithProviders(<EditScriptForm {...props} />);
 
-    const submitButton = screen.getByRole("button", {
-      name: /submit new version/i,
-    });
+    await user.type(screen.getByRole("textbox", { name: /title/i }), " edited");
+    await user.click(
+      screen.getByRole("button", { name: /submit new version/i }),
+    );
 
-    await user.click(submitButton);
+    await user.click(
+      within(await screen.findByRole("dialog")).getByRole("button", {
+        name: /submit new version/i,
+      }),
+    );
 
     expect(
-      screen.getByText(
-        /all future script runs will be done using the latest version of the code/i,
-      ),
+      await screen.findByText(/successfully submitted a new version/i),
     ).toBeInTheDocument();
   });
 });
diff --git a/src/features/scripts/components/EditScriptForm/EditScriptForm.tsx b/src/features/scripts/components/EditScriptForm/EditScriptForm.tsx
index d3a13fc34..35d889262 100644
--- a/src/features/scripts/components/EditScriptForm/EditScriptForm.tsx
+++ b/src/features/scripts/components/EditScriptForm/EditScriptForm.tsx
@@ -1,29 +1,17 @@
 import CodeEditor from "@/components/form/CodeEditor";
 import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
-import LoadingState from "@/components/layout/LoadingState";
-import NoData from "@/components/layout/NoData";
 import useDebug from "@/hooks/useDebug";
 import useNotify from "@/hooks/useNotify";
 import useSidePanel from "@/hooks/useSidePanel";
-import { ROUTES } from "@/libs/routes";
 import { getFormikError } from "@/utils/formikErrors";
-import {
-  Button,
-  ConfirmationModal,
-  Form,
-  Icon,
-  Input,
-  ModularTable,
-} from "@canonical/react-components";
+import { Button, Form, Icon, Input } from "@canonical/react-components";
 import { useFormik } from "formik";
 import type { FC } from "react";
-import { useRef, useState } from "react";
-import { Link } from "react-router";
-import type { CellProps } from "react-table";
+import { useRef } from "react";
+import { useBoolean } from "usehooks-ts";
 import {
   useCreateScriptAttachment,
   useEditScript,
-  useGetAssociatedScriptProfiles,
   useRemoveScriptAttachment,
 } from "../../api";
 import { DEFAULT_SCRIPT } from "../../constants";
@@ -31,13 +19,9 @@ import {
   getCreateAttachmentsPromises,
   getEditScriptParams,
 } from "../../helpers";
-import type {
-  Script,
-  ScriptFormValues,
-  TruncatedScriptProfile,
-} from "../../types";
+import type { Script, ScriptFormValues } from "../../types";
+import EditScriptConfirmationModal from "../EditScriptConfirmationModal";
 import ScriptFormAttachments from "../ScriptFormAttachments";
-import classes from "./EditScriptForm.module.scss";
 import {
   getInitialValues,
   getValidationSchema,
@@ -46,11 +30,16 @@ import {
 
 interface EditScriptFormProps {
   readonly script: Script;
+  readonly onBack?: () => void;
 }
 
-const EditScriptForm: FC<EditScriptFormProps> = ({ script }) => {
+const EditScriptForm: FC<EditScriptFormProps> = ({ script, onBack }) => {
   const inputRef = useRef<HTMLInputElement>(null);
-  const [modalOpen, setModalOpen] = useState(false);
+  const {
+    value: showConfirmationModal,
+    setTrue: showModal,
+    setFalse: closeModal,
+  } = useBoolean();
 
   const { closeSidePanel } = useSidePanel();
   const debug = useDebug();
@@ -60,14 +49,11 @@ const EditScriptForm: FC<EditScriptFormProps> = ({ script }) => {
   const { removeScriptAttachment } = useRemoveScriptAttachment();
   const { editScript, isEditing } = useEditScript();
 
-  const { associatedScriptProfiles, isAssociatedScriptProfilesLoading } =
-    useGetAssociatedScriptProfiles(script.id, { enabled: modalOpen });
-
   const handleSubmit = async (values: ScriptFormValues) => {
-    const newAttachments = Object.values(values.attachments).filter(
-      (a) => a !== null,
-    );
     try {
+      const newAttachments = Object.values(values.attachments).filter(
+        (a) => a !== null,
+      );
       const promises: Promise<unknown>[] = [
         editScript(getEditScriptParams({ scriptId: script.id, values })),
       ];
@@ -88,15 +74,17 @@ const EditScriptForm: FC<EditScriptFormProps> = ({ script }) => {
         );
       }
       await Promise.all(promises);
+
+      closeModal();
       closeSidePanel();
-      setModalOpen(false);
+
       notify.success({
         title: `You have successfully submitted a new version of ${script.title}`,
         message:
           "All its associated profiles will now be run using this new version.",
       });
     } catch (error) {
-      setModalOpen(false);
+      closeModal();
       debug(error);
     }
   };
@@ -205,92 +193,20 @@ const EditScriptForm: FC<EditScriptFormProps> = ({ script }) => {
       />
 
       <SidePanelFormButtons
-        onSubmit={() => {
-          setModalOpen(true);
-        }}
+        onSubmit={showModal}
+        hasBackButton={!!onBack}
+        onBackButtonPress={onBack}
         submitButtonText="Submit new version"
       />
 
-      {modalOpen && (
-        <ConfirmationModal
-          title={`Submit new version of "${script.title}"`}
+      {showConfirmationModal && (
+        <EditScriptConfirmationModal
+          script={script}
+          onConfirm={formik.handleSubmit}
           confirmButtonLabel="Submit new version"
-          onConfirm={() => {
-            formik.handleSubmit();
-          }}
-          confirmButtonAppearance="positive"
-          confirmButtonDisabled={isEditing}
-          confirmButtonLoading={isEditing}
-          close={() => {
-            setModalOpen(false);
-          }}
-          className={classes.modal}
-          confirmButtonProps={{
-            type: "button",
-          }}
-        >
-          {associatedScriptProfiles.length > 0 ? (
-            <>
-              <p>
-                All future script runs will be done using the latest version of
-                the code. Submitting these changes will affect the following
-                profiles:
-              </p>
-              <ModularTable
-                columns={[
-                  {
-                    Header: "active profiles",
-                    accessor: "title",
-                    Cell: ({ row }: CellProps<TruncatedScriptProfile>) => (
-                      <Link
-                        to={ROUTES.scripts.root({ tab: "profiles" })}
-                        state={{ scriptProfileId: row.original.id }}
-                        target="_blank"
-                      >
-                        {row.original.title}
-                      </Link>
-                    ),
-                  },
-                  {
-                    Header: "associated instances",
-                    Cell: ({ row }: CellProps<TruncatedScriptProfile>) => {
-                      const associatedProfile = associatedScriptProfiles.find(
-                        (profile) => profile.id === row.original.id,
-                      );
-
-                      const associatedComputers =
-                        associatedProfile?.computers.num_associated_computers;
-
-                      if (isAssociatedScriptProfilesLoading) {
-                        return <LoadingState />;
-                      }
-
-                      return associatedComputers ? (
-                        <Link
-                          to={ROUTES.instances.root({
-                            tags: associatedProfile?.tags,
-                          })}
-                          target="_blank"
-                        >
-                          {associatedComputers} instance
-                          {associatedComputers > 1 ? "s" : ""}
-                        </Link>
-                      ) : (
-                        <NoData />
-                      );
-                    },
-                  },
-                ]}
-                data={script.script_profiles}
-              />
-            </>
-          ) : (
-            <p>
-              All future script runs will be done using the latest version of
-              the code.
-            </p>
-          )}
-        </ConfirmationModal>
+          isConfirming={isEditing}
+          onClose={closeModal}
+        />
       )}
     </Form>
   );
diff --git a/src/features/scripts/components/RunScriptForm/RunScriptForm.test.tsx b/src/features/scripts/components/RunScriptForm/RunScriptForm.test.tsx
index 11690ee78..b84e77597 100644
--- a/src/features/scripts/components/RunScriptForm/RunScriptForm.test.tsx
+++ b/src/features/scripts/components/RunScriptForm/RunScriptForm.test.tsx
@@ -1,12 +1,20 @@
 import { scripts } from "@/tests/mocks/script";
 import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
+import { screen, within } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { describe, it } from "vitest";
 import RunScriptForm from "./RunScriptForm";
 
 const [script] = scripts;
 
+const selectTag = async (
+  user: ReturnType<typeof userEvent.setup>,
+  tagName: string,
+) => {
+  await user.click(await screen.findByRole("combobox", { name: "Tags" }));
+  await user.click(await screen.findByRole("checkbox", { name: tagName }));
+};
+
 describe("RunScriptForm", () => {
   const user = userEvent.setup();
 
@@ -46,4 +54,180 @@ describe("RunScriptForm", () => {
 
     expect(screen.getByText("Select instances")).toBeInTheDocument();
   });
+
+  it("should display the code editor with its label", async () => {
+    renderWithProviders(<RunScriptForm script={script} />);
+
+    expect(await screen.findByText(/script code/i)).toBeInTheDocument();
+    expect(screen.getByTestId("mock-monaco")).toBeInTheDocument();
+  });
+
+  it("should change submit button label to 'Save and run' when code is modified", async () => {
+    renderWithProviders(<RunScriptForm script={script} />);
+
+    await screen.findByRole("button", { name: /run script/i });
+
+    const codeEditor = screen.getByTestId("mock-monaco");
+    await user.clear(codeEditor);
+    await user.type(codeEditor, "#!/bin/bash\necho hello");
+
+    expect(
+      screen.getByRole("button", { name: /save and run/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("should show the edit confirmation modal when code is modified and submit is clicked", async () => {
+    renderWithProviders(<RunScriptForm script={script} />);
+
+    await selectTag(user, "appservers");
+
+    const codeEditor = screen.getByTestId("mock-monaco");
+    await user.clear(codeEditor);
+    await user.type(codeEditor, "#!/bin/bash\necho hello");
+
+    expect(
+      await screen.findByRole("button", { name: /save and run/i }),
+    ).not.toHaveAttribute("aria-disabled", "true");
+
+    await user.click(screen.getByRole("button", { name: /save and run/i }));
+
+    expect(
+      await screen.findByText(/submit new version of/i),
+    ).toBeInTheDocument();
+  });
+
+  it("should run the script without showing the edit confirmation modal when code is not modified", async () => {
+    renderWithProviders(<RunScriptForm script={script} />);
+
+    await selectTag(user, "appservers");
+
+    expect(
+      await screen.findByRole("button", { name: /run script/i }),
+    ).not.toHaveAttribute("aria-disabled", "true");
+
+    await user.click(screen.getByRole("button", { name: /run script/i }));
+
+    expect(
+      screen.queryByText(/submit new version of/i),
+    ).not.toBeInTheDocument();
+
+    const dialog = await screen.findByRole("dialog");
+    await user.click(
+      within(dialog).getByRole("button", { name: "Run script" }),
+    );
+
+    expect(
+      await screen.findByText(/script execution queued/i),
+    ).toBeInTheDocument();
+  });
+
+  it("should call editScript before runScript when submitting with modified code", async () => {
+    renderWithProviders(<RunScriptForm script={script} />);
+
+    await selectTag(user, "appservers");
+
+    const codeEditor = screen.getByTestId("mock-monaco");
+    await user.clear(codeEditor);
+    await user.type(codeEditor, "#!/bin/bash\necho hello");
+
+    expect(
+      await screen.findByRole("button", { name: /save and run/i }),
+    ).not.toHaveAttribute("aria-disabled", "true");
+
+    await user.click(screen.getByRole("button", { name: /save and run/i }));
+
+    const editConfirmButton = await screen.findByRole("button", {
+      name: "Submit and run",
+    });
+    await user.click(editConfirmButton);
+
+    const runConfirmButton = await screen.findByRole("button", {
+      name: "Run script",
+    });
+
+    expect(runConfirmButton).not.toHaveAttribute("aria-disabled", "true");
+
+    await user.click(runConfirmButton);
+
+    expect(
+      await screen.findByText(/script execution queued/i),
+    ).toBeInTheDocument();
+  });
+
+  it("should show 'no instances to run script on' modal when submitting with tags that have no script-capable instances", async () => {
+    const scriptWithoutTaggedInstances = {
+      ...script,
+      access_group: "empty-access-group access-group:empty-access-group",
+    };
+
+    renderWithProviders(
+      <RunScriptForm script={scriptWithoutTaggedInstances} />,
+    );
+
+    await selectTag(user, "appservers");
+
+    const runButton = await screen.findByRole("button", {
+      name: /run script/i,
+    });
+
+    await user.click(runButton);
+
+    expect(
+      await screen.findByText(/no instances to run script on/i),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByText(/please select different tags and try again/i),
+    ).toBeInTheDocument();
+  });
+
+  it("should show instance list and confirmation message in run modal when tags have script-capable instances", async () => {
+    renderWithProviders(<RunScriptForm script={script} />);
+
+    await selectTag(user, "appservers");
+
+    const runButton = await screen.findByRole("button", {
+      name: /run script/i,
+    });
+    expect(runButton).not.toHaveAttribute("aria-disabled", "true");
+
+    await user.click(runButton);
+
+    expect(
+      await screen.findByText(
+        /this script will run on the following instances/i,
+      ),
+    ).toBeInTheDocument();
+
+    const dialog = screen.getByRole("dialog");
+    expect(
+      within(dialog).getByRole("columnheader", { name: /instance/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("should show warning notification on tag blur when selected tags have no associated instances", async () => {
+    const scriptWithoutTaggedInstances = {
+      ...script,
+      access_group: "empty-access-group access-group:empty-access-group",
+    };
+
+    renderWithProviders(
+      <RunScriptForm script={scriptWithoutTaggedInstances} />,
+    );
+
+    await selectTag(user, "appservers");
+
+    // Click another input to close the dropdown and trigger the onClose callback,
+    // which sets hasClosedTagDropdown=true (required to display the warning).
+    await user.click(screen.getByRole("textbox", { name: /run as user/i }));
+
+    expect(
+      await screen.findByText(
+        "There are no instances with the selected tags that can run scripts.",
+      ),
+    ).toBeInTheDocument();
+
+    expect(
+      screen.queryByText(/this script will run on the following instances/i),
+    ).not.toBeInTheDocument();
+  });
 });
diff --git a/src/features/scripts/components/RunScriptForm/RunScriptForm.tsx b/src/features/scripts/components/RunScriptForm/RunScriptForm.tsx
index a35eb7f8e..095d812a0 100644
--- a/src/features/scripts/components/RunScriptForm/RunScriptForm.tsx
+++ b/src/features/scripts/components/RunScriptForm/RunScriptForm.tsx
@@ -1,3 +1,5 @@
+import CodeEditor from "@/components/form/CodeEditor";
+import { DeliveryBlock } from "@/components/form/DeliveryScheduling";
 import MultiSelectField from "@/components/form/MultiSelectField";
 import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
 import LoadingState from "@/components/layout/LoadingState";
@@ -17,27 +19,62 @@ import {
 } from "@canonical/react-components";
 import { useFormik } from "formik";
 import moment from "moment/moment";
-import { useState, type FC } from "react";
-import { useRunScript } from "../../api";
+import { type FC, useState } from "react";
+import { useBoolean } from "usehooks-ts";
+import { useEditScript, useRunScript } from "../../api";
+import { getCode, getEncodedCode } from "../../helpers";
 import type { Script } from "../../types";
+import EditScriptConfirmationModal from "../EditScriptConfirmationModal";
 import RunScriptFormInstanceList from "../RunScriptFormInstanceList";
-import { INITIAL_VALUES, VALIDATION_SCHEMA } from "./constants";
+import {
+  INITIAL_VALUES,
+  NO_TAGGED_FEATURED_INSTANCES_WARNING_MESSAGE,
+  VALIDATION_SCHEMA,
+} from "./constants";
 import classes from "./RunScriptForm.module.scss";
 import type { FormProps } from "./types";
-import { DeliveryBlock } from "@/components/form/DeliveryScheduling";
+import { pluralize } from "@/utils/_helpers";
 
 interface RunScriptFormProps {
   readonly script: Script;
+  readonly submittedCode?: string;
+  readonly onBack?: () => void;
 }
 
-const RunScriptForm: FC<RunScriptFormProps> = ({ script }) => {
+const RunScriptForm: FC<RunScriptFormProps> = ({
+  script,
+  submittedCode,
+  onBack,
+}) => {
+  const {
+    value: isRunConfirmVisible,
+    setTrue: showRunConfirm,
+    setFalse: hideRunConfirm,
+  } = useBoolean();
+
+  const {
+    value: isEditConfirmVisible,
+    setTrue: showEditConfirm,
+    setFalse: hideEditConfirm,
+  } = useBoolean();
+
   const debug = useDebug();
   const { notify } = useNotify();
   const { closeSidePanel } = useSidePanel();
 
   const { runScript } = useRunScript();
-
-  const handleSubmit = async (values: FormProps) => {
+  const { editScript } = useEditScript();
+  const [isTagDropdownOpen, setIsTagDropdownOpen] = useState(false);
+  const [hasClosedTagDropdown, setHasClosedTagDropdown] = useState(false);
+
+  const originalCode =
+    submittedCode ??
+    getCode({
+      code: script.code,
+      interpreter: script.interpreter,
+    });
+
+  const submitRun = async (values: FormProps) => {
     const valuesToSubmit = {
       query:
         values.queryType === "ids"
@@ -60,6 +97,13 @@ const RunScriptForm: FC<RunScriptFormProps> = ({ script }) => {
     }
 
     try {
+      if (values.code !== originalCode) {
+        await editScript({
+          script_id: script.id,
+          code: getEncodedCode(values.code),
+        });
+      }
+
       await runScript(valuesToSubmit);
 
       closeSidePanel();
@@ -73,14 +117,28 @@ const RunScriptForm: FC<RunScriptFormProps> = ({ script }) => {
     }
   };
 
+  const handleSubmit = async (values: FormProps) => {
+    if (values.code !== originalCode) {
+      showEditConfirm();
+      return;
+    }
+
+    if (values.queryType === "tags") {
+      showRunConfirm();
+      return;
+    }
+
+    await submitRun(values);
+  };
+
   const formik = useFormik({
-    initialValues: INITIAL_VALUES,
+    initialValues: { ...INITIAL_VALUES, code: originalCode },
     onSubmit: handleSubmit,
     validateOnMount: true,
     validationSchema: VALIDATION_SCHEMA,
   });
 
-  const [isModalVisible, setIsModalVisible] = useState(false);
+  const codeChanged = formik.values.code !== originalCode;
 
   const { tags, isGettingTags } = useGetTags();
 
@@ -102,22 +160,6 @@ const RunScriptForm: FC<RunScriptFormProps> = ({ script }) => {
     },
   );
 
-  if (isGettingTags || isGettingInstances) {
-    return <LoadingState />;
-  }
-
-  if (taggedInstancesError) {
-    debug(taggedInstancesError);
-  }
-
-  const hideModal = () => {
-    setIsModalVisible(false);
-  };
-
-  const showModal = () => {
-    setIsModalVisible(true);
-  };
-
   const tagOptions: MultiSelectItem[] =
     tags.map((tag) => ({
       label: tag,
@@ -141,18 +183,35 @@ const RunScriptForm: FC<RunScriptFormProps> = ({ script }) => {
       return getFeatures(instance).scripts;
     }) ?? [];
 
-  const trySubmit = () => {
-    if (formik.values.queryType == "tags") {
-      showModal();
+  const shouldShowNoTaggedInstancesWarning =
+    hasClosedTagDropdown &&
+    !isTagDropdownOpen &&
+    formik.values.queryType === "tags" &&
+    formik.values.tags.length > 0 &&
+    !isGettingTaggedInstances &&
+    !taggedInstancesError &&
+    !taggedInstancesWithScriptsFeature.length;
+
+  const proceedWithRun = () => {
+    if (formik.values.queryType === "tags") {
+      showRunConfirm();
     } else {
-      formik.handleSubmit();
+      submitRun(formik.values);
     }
   };
 
+  if (isGettingTags || isGettingInstances) {
+    return <LoadingState />;
+  }
+
+  if (taggedInstancesError) {
+    debug(taggedInstancesError);
+  }
+
   return (
     <>
-      <Form onSubmit={trySubmit} noValidate>
-        <p className="u-no-margin--bottom">Select instances by:</p>
+      <Form onSubmit={formik.handleSubmit} noValidate>
+        <p className="u-no-margin--bottom">* Select instances by:</p>
         <div className="is-required">
           <div>
             <div className={classes.radioGroup}>
@@ -170,6 +229,9 @@ const RunScriptForm: FC<RunScriptFormProps> = ({ script }) => {
                     formik.setFieldValue("instanceIds", []),
                     formik.setFieldTouched("instanceIds", false),
                   ]);
+
+                  setIsTagDropdownOpen(false);
+                  setHasClosedTagDropdown(false);
                 }}
                 value="tags"
                 checked={formik.values.queryType === "tags"}
@@ -206,10 +268,20 @@ const RunScriptForm: FC<RunScriptFormProps> = ({ script }) => {
                       "tags",
                       items.map(({ value }) => value),
                     );
-
+                  }}
+                  onOpen={() => {
+                    setIsTagDropdownOpen(true);
+                  }}
+                  onClose={() => {
+                    setIsTagDropdownOpen(false);
+                    setHasClosedTagDropdown(true);
                     formik.setFieldTouched("tags", true, false);
                   }}
                   error={getFormikError(formik, "tags")}
+                  warning={
+                    shouldShowNoTaggedInstancesWarning &&
+                    NO_TAGGED_FEATURED_INSTANCES_WARNING_MESSAGE
+                  }
                 />
               )}
 
@@ -263,39 +335,85 @@ const RunScriptForm: FC<RunScriptFormProps> = ({ script }) => {
           </Col>
         </Row>
 
+        <CodeEditor
+          label="Script code"
+          value={formik.values.code}
+          onChange={async (value) => {
+            await formik.setFieldValue("code", value ?? "");
+          }}
+          error={getFormikError(formik, "code")}
+          required
+        />
+
         <DeliveryBlock formik={formik} />
 
         <SidePanelFormButtons
-          submitButtonDisabled={formik.isSubmitting || !formik.isValid}
-          submitButtonText="Run script"
-          onSubmit={trySubmit}
+          submitButtonDisabled={formik.isSubmitting}
+          onBackButtonPress={onBack}
+          hasBackButton={!!onBack}
+          submitButtonText={codeChanged ? "Save and run" : "Run script"}
+          onSubmit={formik.submitForm}
         />
       </Form>
 
-      {isModalVisible && (
+      {isEditConfirmVisible && (
+        <EditScriptConfirmationModal
+          script={script}
+          confirmButtonLabel="Submit and run"
+          isConfirming={formik.isSubmitting}
+          onConfirm={() => {
+            hideEditConfirm();
+            proceedWithRun();
+          }}
+          onClose={hideEditConfirm}
+        />
+      )}
+
+      {isRunConfirmVisible &&
+        taggedInstancesWithScriptsFeature.length === 0 && (
+          <ConfirmationModal
+            renderInPortal
+            confirmButtonLabel="OK"
+            confirmButtonAppearance="positive"
+            onConfirm={hideRunConfirm}
+            cancelButtonProps={{ style: { display: "none" } }}
+            title="No instances to run script on"
+            close={hideRunConfirm}
+          >
+            <p>
+              {NO_TAGGED_FEATURED_INSTANCES_WARNING_MESSAGE} Select different
+              tags and try again.
+            </p>
+          </ConfirmationModal>
+        )}
+
+      {isRunConfirmVisible && taggedInstancesWithScriptsFeature.length > 0 && (
         <ConfirmationModal
-          title={`Run ${script.title} script on ${formik.values.tags.length > 1 ? `${formik.values.tags.length} tags` : `${formik.values.tags[0]} tag`}`}
+          renderInPortal
+          title={`Run "${script.title}" script on ${formik.values.tags.length > 1 ? `${formik.values.tags.length} tags` : `${formik.values.tags[0]} tag`}`}
           confirmButtonLabel="Run script"
           onConfirm={() => {
-            formik.handleSubmit();
+            hideRunConfirm();
+            submitRun(formik.values);
           }}
           confirmButtonDisabled={
             formik.isSubmitting ||
             !!taggedInstancesError ||
-            isGettingTaggedInstances
+            isGettingTaggedInstances ||
+            !taggedInstancesWithScriptsFeature.length
           }
           confirmButtonLoading={isGettingTaggedInstances}
-          close={hideModal}
+          close={hideRunConfirm}
           confirmButtonAppearance="positive"
         >
           <p>
             This script will run on the following instances, which are
             associated with the selected{" "}
-            {formik.values.tags.length == 1 ? "tag" : "tags"}.
+            {pluralize(formik.values.tags.length, "tag")}.
           </p>
-
           <RunScriptFormInstanceList
             instances={taggedInstancesWithScriptsFeature}
+            tags={formik.values.tags}
           />
         </ConfirmationModal>
       )}
diff --git a/src/features/scripts/components/RunScriptForm/constants.ts b/src/features/scripts/components/RunScriptForm/constants.ts
index 8c43909b7..f3c3d90bc 100644
--- a/src/features/scripts/components/RunScriptForm/constants.ts
+++ b/src/features/scripts/components/RunScriptForm/constants.ts
@@ -2,7 +2,10 @@ import * as Yup from "yup";
 import type { FormProps } from "./types";
 import { deliveryValidationSchema } from "@/components/form/DeliveryScheduling";
 
-export const INITIAL_VALUES: FormProps = {
+export const NO_TAGGED_FEATURED_INSTANCES_WARNING_MESSAGE =
+  "There are no instances with the selected tags that can run scripts.";
+
+export const INITIAL_VALUES: Omit<FormProps, "code"> = {
   deliver_after: "",
   deliver_immediately: true,
   instanceIds: [],
@@ -29,4 +32,5 @@ export const VALIDATION_SCHEMA = Yup.object().shape({
       then: (schema) => schema.min(1, "At least one tag is required."),
     }),
   username: Yup.string().required("This field is required."),
+  code: Yup.string().required("This field is required."),
 });
diff --git a/src/features/scripts/components/RunScriptForm/types.ts b/src/features/scripts/components/RunScriptForm/types.ts
index 151895d79..b009161c7 100644
--- a/src/features/scripts/components/RunScriptForm/types.ts
+++ b/src/features/scripts/components/RunScriptForm/types.ts
@@ -1,4 +1,5 @@
 export interface FormProps {
+  code: string;
   deliver_after: string;
   deliver_immediately: boolean;
   instanceIds: number[];
diff --git a/src/features/scripts/components/RunScriptFormInstanceList/RunScriptFormInstanceList.test.tsx b/src/features/scripts/components/RunScriptFormInstanceList/RunScriptFormInstanceList.test.tsx
new file mode 100644
index 000000000..2a8edc524
--- /dev/null
+++ b/src/features/scripts/components/RunScriptFormInstanceList/RunScriptFormInstanceList.test.tsx
@@ -0,0 +1,131 @@
+import { instances } from "@/tests/mocks/instance";
+import { renderWithProviders } from "@/tests/render";
+import type { Instance } from "@/types/Instance";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it } from "vitest";
+import RunScriptFormInstanceList from "./RunScriptFormInstanceList";
+
+const [firstInstance, secondInstance] = instances;
+
+describe("RunScriptFormInstanceList", () => {
+  it("should render the instance and associated tag columns", () => {
+    renderWithProviders(
+      <RunScriptFormInstanceList instances={[firstInstance]} tags={[]} />,
+    );
+
+    expect(
+      screen.getByRole("columnheader", { name: /instance/i }),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("columnheader", { name: /associated tag/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("should display instance titles", () => {
+    renderWithProviders(
+      <RunScriptFormInstanceList
+        instances={[firstInstance, secondInstance]}
+        tags={[]}
+      />,
+    );
+
+    expect(screen.getByText(firstInstance.title)).toBeInTheDocument();
+    expect(screen.getByText(secondInstance.title)).toBeInTheDocument();
+  });
+
+  it("should only show tags that match the provided tags prop", () => {
+    const instanceWithTags: Instance = {
+      ...firstInstance,
+      tags: ["appservers", "webfarm"],
+    };
+    const nonMatchingTag = "non-existent-tag";
+
+    renderWithProviders(
+      <RunScriptFormInstanceList
+        instances={[instanceWithTags]}
+        tags={["appservers", nonMatchingTag]}
+      />,
+    );
+
+    expect(screen.getByText("appservers")).toBeInTheDocument();
+    expect(screen.queryByText("webfarm")).not.toBeInTheDocument();
+    expect(screen.queryByText(nonMatchingTag)).not.toBeInTheDocument();
+  });
+
+  it("should not show tags that are not in the provided tags prop", () => {
+    renderWithProviders(
+      <RunScriptFormInstanceList instances={[firstInstance]} tags={[]} />,
+    );
+
+    firstInstance.tags.forEach((tag) => {
+      expect(screen.queryByText(tag)).not.toBeInTheDocument();
+    });
+  });
+
+  it("should not render pagination when instances fit on one page", () => {
+    renderWithProviders(
+      <RunScriptFormInstanceList
+        instances={[firstInstance, secondInstance]}
+        tags={[]}
+      />,
+    );
+
+    expect(screen.queryByRole("navigation")).not.toBeInTheDocument();
+  });
+
+  it("should render pagination when instances exceed page size", () => {
+    const manyInstances = Array.from({ length: 11 }, (_, i) => ({
+      ...firstInstance,
+      id: i + 100,
+      title: `Instance ${i + 1}`,
+    }));
+
+    renderWithProviders(
+      <RunScriptFormInstanceList instances={manyInstances} tags={[]} />,
+    );
+
+    expect(screen.getByText(/page 1 of/i)).toBeInTheDocument();
+  });
+
+  it("should navigate to the next page when next is clicked", async () => {
+    const user = userEvent.setup();
+    const manyInstances = Array.from({ length: 11 }, (_, i) => ({
+      ...firstInstance,
+      id: i + 100,
+      title: `Instance ${i + 1}`,
+    }));
+
+    renderWithProviders(
+      <RunScriptFormInstanceList instances={manyInstances} tags={[]} />,
+    );
+
+    expect(screen.getByText("Instance 1")).toBeInTheDocument();
+    expect(screen.queryByText("Instance 11")).not.toBeInTheDocument();
+
+    await user.click(screen.getByRole("button", { name: /next page/i }));
+
+    expect(screen.queryByText("Instance 1")).not.toBeInTheDocument();
+    expect(screen.getByText("Instance 11")).toBeInTheDocument();
+  });
+
+  it("should navigate back to the previous page when previous is clicked", async () => {
+    const user = userEvent.setup();
+    const manyInstances = Array.from({ length: 11 }, (_, i) => ({
+      ...firstInstance,
+      id: i + 100,
+      title: `Instance ${i + 1}`,
+    }));
+
+    renderWithProviders(
+      <RunScriptFormInstanceList instances={manyInstances} tags={[]} />,
+    );
+
+    await user.click(screen.getByRole("button", { name: /next page/i }));
+    expect(screen.getByText("Instance 11")).toBeInTheDocument();
+
+    await user.click(screen.getByRole("button", { name: /previous page/i }));
+    expect(screen.getByText("Instance 1")).toBeInTheDocument();
+    expect(screen.queryByText("Instance 11")).not.toBeInTheDocument();
+  });
+});
diff --git a/src/features/scripts/components/RunScriptFormInstanceList/RunScriptFormInstanceList.tsx b/src/features/scripts/components/RunScriptFormInstanceList/RunScriptFormInstanceList.tsx
index 5164e7241..9b6684e46 100644
--- a/src/features/scripts/components/RunScriptFormInstanceList/RunScriptFormInstanceList.tsx
+++ b/src/features/scripts/components/RunScriptFormInstanceList/RunScriptFormInstanceList.tsx
@@ -1,53 +1,113 @@
-import TablePaginationBase from "@/components/layout/TablePagination/components/TablePaginationBase";
-import {
-  DEFAULT_CURRENT_PAGE,
-  DEFAULT_PAGE_SIZE,
-} from "@/libs/pageParamsManager/constants";
 import type { Instance } from "@/types/Instance";
 import { ModularTable } from "@canonical/react-components";
 import { useMemo, useState, type FC } from "react";
 import type { CellProps, Column } from "react-table";
-import classes from "./RunScriptFormInstanceList.module.scss";
+import TruncatedCell from "@/components/layout/TruncatedCell";
+import { useExpandableRow } from "@/hooks/useExpandableRow";
+import { getCellProps, getRowProps } from "./helpers";
+import { ModalTablePagination } from "@/components/layout/TablePagination";
+import { DEFAULT_MODAL_PAGE_SIZE } from "@/constants";
+import { DEFAULT_CURRENT_PAGE } from "@/libs/pageParamsManager/constants";
 
 interface RunScriptFormInstanceListProps {
   readonly instances: Instance[];
+  readonly tags: string[];
 }
 
 const RunScriptFormInstanceList: FC<RunScriptFormInstanceListProps> = ({
   instances,
+  tags,
 }) => {
   const [currentPage, setCurrentPage] = useState(DEFAULT_CURRENT_PAGE);
-  const [pageSize, setPageSize] = useState<number>(DEFAULT_PAGE_SIZE);
+
+  const { expandedRowIndex, expandedColumnId, getTableRowsRef, handleExpand } =
+    useExpandableRow();
+
+  const maxPage = Math.max(
+    1,
+    Math.ceil(instances.length / DEFAULT_MODAL_PAGE_SIZE),
+  );
+  const page = Math.min(currentPage, maxPage);
+  const offset = (page - 1) * DEFAULT_MODAL_PAGE_SIZE;
+  const currentInstances = instances.slice(
+    offset,
+    offset + DEFAULT_MODAL_PAGE_SIZE,
+  );
 
   const columns = useMemo<Column<Instance>[]>(
     () => [
       {
         Header: "Instance",
+        accessor: "title",
         Cell: ({ row: { original: instance } }: CellProps<Instance>) =>
           instance.title,
       },
+      {
+        accessor: "tags",
+        Header: "Associated tag",
+        meta: {
+          isExpandable: true,
+        },
+        Cell: ({ row: { original: instance, index } }: CellProps<Instance>) => {
+          const instanceTags = instance.tags.filter((instanceTag) =>
+            tags.some((tag) => tag === instanceTag),
+          );
+          return (
+            <TruncatedCell
+              isExpanded={
+                expandedRowIndex === index && expandedColumnId === "tags"
+              }
+              onExpand={() => {
+                handleExpand(index, "tags");
+              }}
+              content={instanceTags.map((tag) => (
+                <span className="truncatedItem" key={tag}>
+                  {tag}
+                </span>
+              ))}
+              showCount
+            />
+          );
+        },
+      },
     ],
-    [],
+    [tags, expandedColumnId, expandedRowIndex, handleExpand],
   );
 
-  const offset = (currentPage - 1) * pageSize;
+  const closeExpandedRow = () => {
+    if (expandedRowIndex == null) {
+      return;
+    }
 
-  const currentInstances = instances.slice(offset, offset + pageSize);
+    handleExpand(expandedRowIndex, expandedColumnId ?? undefined);
+  };
 
   return (
-    <>
-      <ModularTable columns={columns} data={currentInstances} />
-
-      <TablePaginationBase
-        className={classes.pagination}
-        currentItemCount={currentInstances.length}
-        currentPage={currentPage}
-        pageSize={pageSize}
-        paginate={setCurrentPage}
-        setPageSize={setPageSize}
-        totalItems={instances.length}
+    <div ref={getTableRowsRef}>
+      <ModularTable
+        columns={columns}
+        data={currentInstances}
+        getCellProps={getCellProps(expandedRowIndex, expandedColumnId)}
+        getRowProps={getRowProps(expandedRowIndex)}
       />
-    </>
+
+      {maxPage > 1 && (
+        <ModalTablePagination
+          current={page}
+          max={maxPage}
+          onNext={() => {
+            closeExpandedRow();
+            setCurrentPage((prevState) => Math.min(prevState + 1, maxPage));
+          }}
+          onPrev={() => {
+            closeExpandedRow();
+            setCurrentPage((prevState) =>
+              Math.max(prevState - 1, DEFAULT_CURRENT_PAGE),
+            );
+          }}
+        />
+      )}
+    </div>
   );
 };
 
diff --git a/src/features/scripts/components/RunScriptFormInstanceList/helpers.ts b/src/features/scripts/components/RunScriptFormInstanceList/helpers.ts
new file mode 100644
index 000000000..08fcc5d57
--- /dev/null
+++ b/src/features/scripts/components/RunScriptFormInstanceList/helpers.ts
@@ -0,0 +1,7 @@
+import type { Instance } from "@/types/Instance";
+import { createTablePropGetters } from "@/utils/table";
+
+export const { getCellProps, getRowProps } = createTablePropGetters<Instance>({
+  itemTypeName: "script instance",
+  headerColumnId: "title",
+});
diff --git a/src/features/scripts/components/ScriptDetails/ScriptDetails.test.tsx b/src/features/scripts/components/ScriptDetails/ScriptDetails.test.tsx
index 2fc191dc5..6cec50a0c 100644
--- a/src/features/scripts/components/ScriptDetails/ScriptDetails.test.tsx
+++ b/src/features/scripts/components/ScriptDetails/ScriptDetails.test.tsx
@@ -18,12 +18,22 @@ const redactedScriptId = detailedScriptsData.find(
   (script) => script.status === "REDACTED",
 )?.id;
 
+const notExecutableScriptId = detailedScriptsData.find(
+  (script) => script.status === "ACTIVE" && !script.is_executable,
+)?.id;
+
+const notRedactableScriptId = detailedScriptsData.find(
+  (script) => script.status === "ACTIVE" && !script.is_redactable,
+)?.id;
+
 describe("ScriptDetails", () => {
   const user = userEvent.setup();
 
   assert(archivedScriptId);
   assert(activeScriptId);
   assert(redactedScriptId);
+  assert(notExecutableScriptId);
+  assert(notRedactableScriptId);
 
   it("should display details for an active script", async () => {
     const { container } = renderWithProviders(
@@ -32,10 +42,46 @@ describe("ScriptDetails", () => {
 
     await expectLoadingState();
 
-    const buttons = ["Edit", "Archive"];
+    const buttons = ["Edit", "Run", "Archive", "Delete"];
     expect(container).toHaveTexts(buttons);
   });
 
+  it("should disable the Run button when the script is not executable", async () => {
+    renderWithProviders(<ScriptDetails scriptId={notExecutableScriptId} />);
+
+    await expectLoadingState();
+
+    const runButton = screen.getByRole("button", { name: /run/i });
+    expect(runButton).toHaveAttribute("aria-disabled", "true");
+  });
+
+  it("should disable the Delete button when the script is not redactable", async () => {
+    renderWithProviders(<ScriptDetails scriptId={notRedactableScriptId} />);
+
+    await expectLoadingState();
+
+    const deleteButton = screen.getByRole("button", {
+      name: /delete new v2 script/i,
+    });
+    expect(deleteButton).toHaveAttribute("aria-disabled", "true");
+  });
+
+  it("opens delete confirmation modal when clicking Delete button", async () => {
+    renderWithProviders(<ScriptDetails scriptId={activeScriptId} />);
+
+    await expectLoadingState();
+
+    const deleteButton = screen.getByRole("button", {
+      name: /delete new v2 script/i,
+    });
+    await user.click(deleteButton);
+
+    const modalBody = screen.getByText(
+      /deleting the script will remove the contents from Landscape/i,
+    );
+    expect(modalBody).toBeInTheDocument();
+  });
+
   it("should display details for an archived script", async () => {
     renderWithProviders(<ScriptDetails scriptId={archivedScriptId} />);
 
diff --git a/src/features/scripts/components/ScriptDetails/ScriptDetails.tsx b/src/features/scripts/components/ScriptDetails/ScriptDetails.tsx
index 975aa80bd..c7ccab520 100644
--- a/src/features/scripts/components/ScriptDetails/ScriptDetails.tsx
+++ b/src/features/scripts/components/ScriptDetails/ScriptDetails.tsx
@@ -4,16 +4,18 @@ import { DISPLAY_DATE_TIME_FORMAT } from "@/constants";
 import { useGetSingleScript } from "@/features/scripts";
 import useDebug from "@/hooks/useDebug";
 import useSidePanel from "@/hooks/useSidePanel";
-import { Button, Icon, Notification } from "@canonical/react-components";
+import { Button, Icon, ICONS, Notification } from "@canonical/react-components";
 import moment from "moment";
 import type { FC } from "react";
-import { lazy, Suspense, useState } from "react";
-import { useArchiveScriptModal } from "../../hooks";
+import { lazy, Suspense } from "react";
+import { useArchiveScriptModal, useDeleteScriptModal } from "../../hooks";
 import type { ScriptTabId } from "../../types";
+import { useBoolean } from "usehooks-ts";
 
 const ScriptDetailsTabs = lazy(async () => import("../ScriptDetailsTabs"));
 
 const EditScriptForm = lazy(async () => import("../EditScriptForm"));
+const RunScriptForm = lazy(async () => import("../RunScriptForm"));
 
 interface ScriptDetailsProps {
   readonly scriptId: number;
@@ -24,21 +26,23 @@ const ScriptDetails: FC<ScriptDetailsProps> = ({
   scriptId,
   initialTabId = "info",
 }) => {
-  const [modalOpen, setModalOpen] = useState(false);
+  const {
+    setTrue: openModal,
+    setFalse: closeModal,
+    value: modalOpen,
+  } = useBoolean();
+
+  const {
+    value: deleteModalOpen,
+    setTrue: openDeleteModal,
+    setFalse: closeDeleteModal,
+  } = useBoolean();
 
   const { setSidePanelContent } = useSidePanel();
   const debug = useDebug();
 
   const { script } = useGetSingleScript(scriptId);
 
-  const handleOpenModal = (): void => {
-    setModalOpen(true);
-  };
-
-  const handleCloseModal = (): void => {
-    setModalOpen(false);
-  };
-
   const {
     archiveModalBody,
     archiveModalButtonLabel,
@@ -47,7 +51,18 @@ const ScriptDetails: FC<ScriptDetailsProps> = ({
     onConfirmArchive,
   } = useArchiveScriptModal({
     script,
-    afterSuccess: handleCloseModal,
+    afterSuccess: closeModal,
+  });
+
+  const {
+    deleteModalBody,
+    deleteModalButtonLabel,
+    deleteModalTitle,
+    isRemoving,
+    onConfirmDelete,
+  } = useDeleteScriptModal({
+    script,
+    afterSuccess: closeDeleteModal,
   });
 
   const viewVersionHistory = (): void => {
@@ -64,15 +79,44 @@ const ScriptDetails: FC<ScriptDetailsProps> = ({
     );
   };
 
+  const handleBackToDetails = (): void => {
+    if (script === null) {
+      debug("Script not loaded");
+      return;
+    }
+
+    setSidePanelContent(
+      script.title,
+      <Suspense fallback={<LoadingState />}>
+        <ScriptDetails scriptId={script.id} />
+      </Suspense>,
+    );
+  };
+
   const handleEditScript = (): void => {
     if (script === null) {
       debug("Script not loaded");
       return;
     }
+
     setSidePanelContent(
       `Edit "${script.title}" script`,
       <Suspense fallback={<LoadingState />}>
-        <EditScriptForm script={script} />
+        <EditScriptForm script={script} onBack={handleBackToDetails} />
+      </Suspense>,
+    );
+  };
+
+  const handleRunScript = (): void => {
+    if (script === null) {
+      debug("Script not loaded");
+      return;
+    }
+
+    setSidePanelContent(
+      `Run "${script.title}" script`,
+      <Suspense fallback={<LoadingState />}>
+        <RunScriptForm script={script} onBack={handleBackToDetails} />
       </Suspense>,
     );
   };
@@ -111,16 +155,39 @@ const ScriptDetails: FC<ScriptDetailsProps> = ({
               <span>Edit</span>
             </Button>
 
+            <Button
+              type="button"
+              className="p-segmented-control__button"
+              onClick={handleRunScript}
+              hasIcon
+              disabled={!script?.is_executable}
+            >
+              <Icon name="play" />
+              <span>Run</span>
+            </Button>
+
             <Button
               className="p-segmented-control__button"
               type="button"
-              onClick={handleOpenModal}
+              onClick={openModal}
               hasIcon
               aria-label={`Archive ${script?.title}`}
               disabled={!script?.is_editable}
             >
-              <Icon name="archive" />
-              <span>Archive</span>
+              <Icon name="archive--negative" />
+              <span className="u-text--negative">Archive</span>
+            </Button>
+
+            <Button
+              className="p-segmented-control__button"
+              type="button"
+              onClick={openDeleteModal}
+              hasIcon
+              aria-label={`Delete ${script?.title}`}
+              disabled={!script?.is_redactable}
+            >
+              <Icon name={`${ICONS.delete}--negative`} />
+              <span className="u-text--negative">Delete</span>
             </Button>
           </div>
         </div>
@@ -146,10 +213,24 @@ const ScriptDetails: FC<ScriptDetailsProps> = ({
         confirmButtonDisabled={isArchivingScript}
         confirmButtonLoading={isArchivingScript}
         onConfirm={onConfirmArchive}
-        close={handleCloseModal}
+        close={closeModal}
       >
         <>{archiveModalBody}</>
       </TextConfirmationModal>
+
+      <TextConfirmationModal
+        isOpen={deleteModalOpen}
+        confirmationText={`delete ${script?.title}`}
+        title={deleteModalTitle}
+        confirmButtonLabel={deleteModalButtonLabel}
+        confirmButtonAppearance="negative"
+        confirmButtonDisabled={isRemoving}
+        confirmButtonLoading={isRemoving}
+        onConfirm={onConfirmDelete}
+        close={closeDeleteModal}
+      >
+        {deleteModalBody}
+      </TextConfirmationModal>
     </>
   );
 };
diff --git a/src/features/scripts/helpers.ts b/src/features/scripts/helpers.ts
index 8a3490ee9..a07cdb246 100644
--- a/src/features/scripts/helpers.ts
+++ b/src/features/scripts/helpers.ts
@@ -4,7 +4,7 @@ import type { CreateScriptAttachmentParams } from "./api";
 import { DISPLAY_DATE_TIME_FORMAT } from "@/constants";
 import moment from "moment";
 
-const getEncodedCode = (code: string) => {
+export const getEncodedCode = (code: string) => {
   const escapedCode = JSON.parse(JSON.stringify(code).replace(/\\r/g, ""));
 
   return Buffer.from(escapedCode).toString("base64");
diff --git a/src/features/security-profiles/api/useGetSecurityProfileAuditDownload.ts b/src/features/security-profiles/api/useGetSecurityProfileAuditDownload.ts
index f6e23abbd..97d952acd 100644
--- a/src/features/security-profiles/api/useGetSecurityProfileAuditDownload.ts
+++ b/src/features/security-profiles/api/useGetSecurityProfileAuditDownload.ts
@@ -11,12 +11,15 @@ export const useGetSecurityProfileAuditDownload = () => {
   const authFetch = useFetch();
 
   const { isPending, mutateAsync } = useMutation<
-    AxiosResponse<string>,
+    AxiosResponse<Blob>,
     AxiosError<ApiError>,
     GetSecurityProfileAuditDownloadParams
   >({
     mutationFn: async ({ path }) =>
-      authFetch.get(`security-profiles/blob?path=${path}`),
+      authFetch.get("security-profiles/blob", {
+        params: { path },
+        responseType: "blob",
+      }),
   });
 
   return {
diff --git a/src/features/security-profiles/components/SecurityProfileDetailsSidePanel/SecurityProfileDetailsSidePanel.tsx b/src/features/security-profiles/components/SecurityProfileDetailsSidePanel/SecurityProfileDetailsSidePanel.tsx
index 4bac35a2d..ae38d7fdf 100644
--- a/src/features/security-profiles/components/SecurityProfileDetailsSidePanel/SecurityProfileDetailsSidePanel.tsx
+++ b/src/features/security-profiles/components/SecurityProfileDetailsSidePanel/SecurityProfileDetailsSidePanel.tsx
@@ -18,6 +18,7 @@ import {
   SECURITY_PROFILE_MODE_LABELS,
 } from "../../constants";
 import { getSchedule, getStatus, getTailoringFile } from "../../helpers";
+import { useSecurityProfileDownload } from "../../hooks/useSecurityProfileDownload";
 import SecurityProfileArchiveModal from "../SecurityProfileArchiveModal";
 
 const SecurityProfileDetailsSidePanel: FC = () => {
@@ -27,6 +28,7 @@ const SecurityProfileDetailsSidePanel: FC = () => {
   const { securityProfile: profile, isGettingSecurityProfile } =
     useGetPageSecurityProfile();
   const profileLimitReached = useIsSecurityProfilesLimitReached();
+  const downloadSecurityProfileFile = useSecurityProfileDownload("tailoring");
   const { data: accessGroupsData, isPending: isGettingAccessGroups } =
     getAccessGroupQuery();
 
@@ -129,7 +131,7 @@ const SecurityProfileDetailsSidePanel: FC = () => {
 
               <InfoGrid.Item
                 label="Tailoring file"
-                value={getTailoringFile(profile)}
+                value={getTailoringFile(profile, downloadSecurityProfileFile)}
               />
 
               <InfoGrid.Item
diff --git a/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/components/SecurityProfileDownloadAuditForm/SecurityProfileDownloadAuditForm.tsx b/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/components/SecurityProfileDownloadAuditForm/SecurityProfileDownloadAuditForm.tsx
index 989a342d7..71a82cb8f 100644
--- a/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/components/SecurityProfileDownloadAuditForm/SecurityProfileDownloadAuditForm.tsx
+++ b/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/components/SecurityProfileDownloadAuditForm/SecurityProfileDownloadAuditForm.tsx
@@ -12,7 +12,7 @@ import moment from "moment";
 import { useEffect, useState, type FC } from "react";
 import * as Yup from "yup";
 import { useGetSecurityProfileReport } from "../../../../api";
-import { useSecurityProfileDownloadAudit } from "../../../../hooks/useSecurityProfileDownloadAudit";
+import { useSecurityProfileDownload } from "../../../../hooks/useSecurityProfileDownload";
 import type { SecurityProfile } from "../../../../types";
 import classes from "./SecurityProfileDownloadAuditForm.module.scss";
 
@@ -43,7 +43,7 @@ const SecurityProfileDownloadAuditForm: FC<
   const { getSecurityProfileReport, isSecurityProfileReportLoading } =
     useGetSecurityProfileReport();
 
-  const downloadAudit = useSecurityProfileDownloadAudit();
+  const downloadAudit = useSecurityProfileDownload("audit");
 
   const [status, setStatus] = useState<Status>({ type: "okay" });
 
diff --git a/src/features/security-profiles/components/SecurityProfilesContainer/SecurityProfilesContainer.tsx b/src/features/security-profiles/components/SecurityProfilesContainer/SecurityProfilesContainer.tsx
index fbf8a3dde..6b4fd6b05 100644
--- a/src/features/security-profiles/components/SecurityProfilesContainer/SecurityProfilesContainer.tsx
+++ b/src/features/security-profiles/components/SecurityProfilesContainer/SecurityProfilesContainer.tsx
@@ -14,7 +14,7 @@ import {
   useGetSecurityProfiles,
   useIsSecurityProfilesLimitReached,
 } from "../../api";
-import { useSecurityProfileDownloadAudit } from "../../hooks/useSecurityProfileDownloadAudit";
+import { useSecurityProfileDownload } from "../../hooks/useSecurityProfileDownload";
 import SecurityProfilesHeader from "../SecurityProfilesHeader";
 import SecurityProfilesList from "../SecurityProfilesList";
 
@@ -79,7 +79,7 @@ const SecurityProfilesContainer: FC<SecurityProfilesContainerProps> = ({
     { enabled: !!pendingReports.length },
   );
 
-  const downloadAudit = useSecurityProfileDownloadAudit();
+  const downloadAudit = useSecurityProfileDownload("audit");
 
   const [
     isProfileLimitNotificationIgnored,
diff --git a/src/features/security-profiles/helpers.tsx b/src/features/security-profiles/helpers.tsx
index c6cac7906..45b8667cd 100644
--- a/src/features/security-profiles/helpers.tsx
+++ b/src/features/security-profiles/helpers.tsx
@@ -42,20 +42,31 @@ export const getTags = (profile: SecurityProfile) =>
     ? "All instances"
     : profile.tags.join(", ") || <NoData />;
 
-export const getTailoringFile = (profile: SecurityProfile) => {
+export const getTailoringFile = (
+  profile: SecurityProfile,
+  downloadFile: (path: string | null, filename?: string) => Promise<void>,
+) => {
   if (!profile.tailoring_file_uri) {
     return <NoData />;
   }
 
-  const match = profile.tailoring_file_uri.match(/[^/]+$/);
+  const pathWithoutQuery = profile.tailoring_file_uri.split(/[?#]/)[0] ?? "";
+  const match = pathWithoutQuery.match(/[^/]+$/);
+  const filename = match ? match[0] : "tailoring-file.xml";
 
   return (
     <div className={classes.container}>
-      <div className={classes.truncated}>
-        {match ? match[0] : "tailoring-file.xml"}
-      </div>
-
-      <a href={profile.tailoring_file_uri} download>
+      <div className={classes.truncated}>{filename}</div>
+
+      <a
+        href={profile.tailoring_file_uri}
+        download={filename}
+        onClick={(event) => {
+          event.preventDefault();
+          void downloadFile(profile.tailoring_file_uri, filename);
+        }}
+        aria-label={`Download ${filename}`}
+      >
         <Icon name="begin-downloading" />
       </a>
     </div>
diff --git a/src/features/security-profiles/hooks/useSecurityProfileDownload.tsx b/src/features/security-profiles/hooks/useSecurityProfileDownload.tsx
new file mode 100644
index 000000000..9ad872ff6
--- /dev/null
+++ b/src/features/security-profiles/hooks/useSecurityProfileDownload.tsx
@@ -0,0 +1,133 @@
+import useDebug from "@/hooks/useDebug";
+import { useGetSecurityProfileAuditDownload } from "../api";
+
+type SecurityProfileDownloadMode = "audit" | "tailoring";
+
+const getFilenameFromPath = (path: string) => {
+  const cleanPath = path.split(/[?#]/)[0] ?? "";
+  const filename = cleanPath.slice(cleanPath.lastIndexOf("/") + 1);
+  return filename || null;
+};
+
+const getFilenameFromContentDisposition = (contentDisposition?: string) => {
+  if (!contentDisposition) {
+    return null;
+  }
+
+  const filenameStarMatch = contentDisposition.match(/filename\*=([^;]+)/i);
+  if (filenameStarMatch?.[1]) {
+    const value = filenameStarMatch[1].trim();
+    const encodedValue = value.includes("''")
+      ? (value.split("''")[1] ?? value)
+      : value;
+    return decodeURIComponent(encodedValue).replace(/^"|"$/g, "");
+  }
+
+  const filenameMatch = contentDisposition.match(/filename="?([^";]+)"?/i);
+  if (filenameMatch?.[1]) {
+    return filenameMatch[1];
+  }
+
+  return null;
+};
+
+const decodeBase64ToBlob = (value: string, mimeType: string) => {
+  try {
+    const cleaned = value.replace(/\s+/g, "");
+    if (!cleaned) {
+      return null;
+    }
+
+    const binary = atob(cleaned);
+    const bytes = new Uint8Array(binary.length);
+    for (let index = 0; index < binary.length; index += 1) {
+      bytes[index] = binary.charCodeAt(index);
+    }
+
+    return new Blob([bytes], { type: mimeType });
+  } catch {
+    return null;
+  }
+};
+
+const withExtension = (
+  filename: string,
+  mimeType: string,
+  mode: SecurityProfileDownloadMode,
+) => {
+  if (/\.[^./]+$/.test(filename)) {
+    return filename;
+  }
+
+  if (mode === "tailoring") {
+    return `${filename}.xml`;
+  }
+
+  if (mimeType.includes("csv")) {
+    return `${filename}.csv`;
+  }
+
+  return filename;
+};
+
+export const useSecurityProfileDownload = (
+  mode: SecurityProfileDownloadMode,
+) => {
+  const debug = useDebug();
+  const { getSecurityProfileAuditDownload } =
+    useGetSecurityProfileAuditDownload();
+
+  return async (path: string | null, filename?: string) => {
+    if (!path) {
+      debug(new Error("Could not download file because no path was provided."));
+      return;
+    }
+
+    try {
+      const { data, headers } = await getSecurityProfileAuditDownload({
+        path,
+      });
+
+      if (data.type.includes("text/html")) {
+        throw new Error(
+          "Received HTML instead of the expected downloadable file.",
+        );
+      }
+
+      const decodedBlob = decodeBase64ToBlob(
+        await data.text(),
+        mode === "tailoring" ? "application/xml" : "text/csv;charset=utf-8",
+      );
+
+      const fileToDownload = decodedBlob ?? data;
+
+      const url = URL.createObjectURL(fileToDownload);
+      const link = document.createElement("a");
+
+      link.href = url;
+
+      const headerFilename = getFilenameFromContentDisposition(
+        headers["content-disposition"],
+      );
+      const pathFilename = getFilenameFromPath(path);
+      const resolvedFilename =
+        filename ??
+        headerFilename ??
+        pathFilename ??
+        (mode === "tailoring" ? "tailoring-file" : "download");
+
+      link.download = withExtension(
+        resolvedFilename,
+        fileToDownload.type,
+        mode,
+      );
+
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
+      URL.revokeObjectURL(url);
+    } catch (error) {
+      debug(error);
+    }
+  };
+};
diff --git a/src/features/security-profiles/hooks/useSecurityProfileDownloadAudit.tsx b/src/features/security-profiles/hooks/useSecurityProfileDownloadAudit.tsx
deleted file mode 100644
index 48388a673..000000000
--- a/src/features/security-profiles/hooks/useSecurityProfileDownloadAudit.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import { useGetSecurityProfileAuditDownload } from "../api";
-
-export const useSecurityProfileDownloadAudit = () => {
-  const { getSecurityProfileAuditDownload } =
-    useGetSecurityProfileAuditDownload();
-
-  return async (path: string | null) => {
-    if (!path) {
-      throw new Error();
-    }
-
-    const { data } = await getSecurityProfileAuditDownload({
-      path,
-    });
-
-    const blob = new Blob([data], {
-      type: "text/csv;charset=utf-8;",
-    });
-
-    const url = URL.createObjectURL(blob);
-
-    const link = document.createElement("a");
-
-    link.href = url;
-
-    link.download = path.slice(path.lastIndexOf("/") + 1);
-
-    document.body.appendChild(link);
-
-    link.click();
-
-    document.body.removeChild(link);
-  };
-};
diff --git a/src/tests/mocks/script.ts b/src/tests/mocks/script.ts
index 0d0285953..65f7b8879 100644
--- a/src/tests/mocks/script.ts
+++ b/src/tests/mocks/script.ts
@@ -326,6 +326,18 @@ export const detailedScriptsData = [
     code: "#!/bin/shell\nls /tmp",
     version_number: 1,
   },
+  {
+    ...scripts[0],
+    id: 100,
+    is_executable: false,
+    version_number: 1,
+  },
+  {
+    ...scripts[0],
+    id: 101,
+    is_redactable: false,
+    version_number: 1,
+  },
 ] as const;
 
 export const scriptVersions: TruncatedScriptVersion[] = [
@@ -416,3 +428,6 @@ export const scriptVersion = {
   interpreter: "shell",
   title: "List temporary files",
 };
+
+export const scriptAttachment = "attachment file";
+export const scriptAttachmentHtml = "<!doctype html><html></html>";
diff --git a/src/tests/server/handlers/script.ts b/src/tests/server/handlers/script.ts
index c028a3eed..c3351221a 100644
--- a/src/tests/server/handlers/script.ts
+++ b/src/tests/server/handlers/script.ts
@@ -1,13 +1,19 @@
-import { API_URL } from "@/constants";
+import { API_URL, API_URL_OLD } from "@/constants";
 import { getEndpointStatus } from "@/tests/controllers/controller";
 import {
   detailedScriptsData,
+  scriptAttachment,
+  scriptAttachmentHtml,
   scripts,
   scriptVersion,
   scriptVersionsWithPagination,
 } from "@/tests/mocks/script";
 import { scriptProfiles } from "@/tests/mocks/scriptProfiles";
-import { generatePaginatedResponse } from "@/tests/server/handlers/_helpers";
+import { activities } from "@/tests/mocks/activity";
+import {
+  generatePaginatedResponse,
+  isAction,
+} from "@/tests/server/handlers/_helpers";
 import { http, HttpResponse } from "msw";
 
 export default [
@@ -49,7 +55,26 @@ export default [
   }),
 
   http.get(`${API_URL}scripts/:id/script-profiles`, async () => {
-    return HttpResponse.json({ script_profiles: scriptProfiles });
+    const endpointStatus = getEndpointStatus();
+    if (
+      (!endpointStatus.path ||
+        endpointStatus.path.includes("script-profiles")) &&
+      endpointStatus.status === "empty"
+    ) {
+      return HttpResponse.json({
+        results: [],
+        count: 0,
+        next: null,
+        previous: null,
+      });
+    }
+    return HttpResponse.json(
+      generatePaginatedResponse({
+        data: scriptProfiles,
+        limit: 20,
+        offset: 0,
+      }),
+    );
   }),
 
   http.get(`${API_URL}scripts/:id`, async ({ params }) => {
@@ -65,8 +90,25 @@ export default [
     return HttpResponse.json(scriptVersion);
   }),
 
-  http.get(`${API_URL}scripts-attachment/:id`, async () => {
-    return HttpResponse.json("attachment");
+  http.get(`${API_URL}scripts/:id/attachments/:attachmentId`, async () => {
+    const endpointStatus = getEndpointStatus();
+
+    if (
+      endpointStatus.path &&
+      endpointStatus.path.includes("scripts/attachments/html")
+    ) {
+      return new HttpResponse(scriptAttachmentHtml, {
+        headers: {
+          "Content-Type": "text/html",
+        },
+      });
+    }
+
+    return new HttpResponse(scriptAttachment, {
+      headers: {
+        "Content-Type": "text/plain",
+      },
+    });
   }),
 
   http.get(`${API_URL}scripts/:id/versions`, async ({ request }) => {
@@ -85,4 +127,32 @@ export default [
       }),
     );
   }),
+
+  http.get(API_URL_OLD, ({ request }) => {
+    if (!isAction(request, "EditScript")) {
+      return;
+    }
+    return HttpResponse.json({});
+  }),
+
+  http.post(API_URL_OLD, ({ request }) => {
+    if (!isAction(request, "EditScript")) {
+      return;
+    }
+    return HttpResponse.json({});
+  }),
+
+  http.post(API_URL_OLD, ({ request }) => {
+    if (!isAction(request, "CreateScriptAttachment")) {
+      return;
+    }
+    return HttpResponse.json({});
+  }),
+
+  http.get(API_URL_OLD, ({ request }) => {
+    if (!isAction(request, "ExecuteScript")) {
+      return;
+    }
+    return HttpResponse.json(activities[0]);
+  }),
 ];

From 629dc56df6f94bcf2cebbc7c6ae621f52cb59a02 Mon Sep 17 00:00:00 2001
From: Joey Mucci <joseph.mucci@canonical.com>
Date: Fri, 17 Apr 2026 13:22:12 -0400
Subject: [PATCH 21/42] Soft deletion [LNDENG-3984] (#547)

## Summary

Adds support for the v2 deletion endpoint. I forked off Ethan's
[branch](https://github.com/canonical/landscape-ui/pull/540) and changed
a couple lines as a result of the manual testing.

## Release Impact

According to the [Landscape Server Release
Cycle](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `dev` / `main` (Beta)
- **Version Impact**:
  - [ ] Patch (Fix)
  - [x] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [x] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [x] **UI Verified**: I have verified the changes locally.
- [x] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.

---------

Co-authored-by: Ethan Shaw <ethan.shaw@canonical.com>
---
 .changeset/thirty-adults-rule.md              |  5 +++++
 .../api/useRemoveInstancesFromLandscape.ts    | 19 ++++++++++++++++---
 .../InstanceRemoveFromLandscapeModal.tsx      |  4 +++-
 .../InstancesPageActions.tsx                  |  2 +-
 .../UbuntuProHeader/UbuntuProHeader.tsx       |  2 +-
 src/tests/mocks/features.ts                   | 15 ++++++++++++++-
 src/tests/server/handlers/instance.ts         |  5 +++++
 src/types/FeatureKey.ts                       | 11 ++++++-----
 8 files changed, 51 insertions(+), 12 deletions(-)
 create mode 100644 .changeset/thirty-adults-rule.md

diff --git a/.changeset/thirty-adults-rule.md b/.changeset/thirty-adults-rule.md
new file mode 100644
index 000000000..77e691035
--- /dev/null
+++ b/.changeset/thirty-adults-rule.md
@@ -0,0 +1,5 @@
+---
+"landscape-ui": minor
+---
+
+Support for v2 deletion endpoint
diff --git a/src/features/instances/api/useRemoveInstancesFromLandscape.ts b/src/features/instances/api/useRemoveInstancesFromLandscape.ts
index d34aa4e13..42e136654 100644
--- a/src/features/instances/api/useRemoveInstancesFromLandscape.ts
+++ b/src/features/instances/api/useRemoveInstancesFromLandscape.ts
@@ -1,3 +1,5 @@
+import useAuth from "@/hooks/useAuth";
+import useFetch from "@/hooks/useFetch";
 import useFetchOld from "@/hooks/useFetchOld";
 import type { ApiError } from "@/types/api/ApiError";
 import type { Instance } from "@/types/Instance";
@@ -8,17 +10,28 @@ export interface RemoveInstancesParams {
   computer_ids: number[];
 }
 
+// Currently determining which endpoint to use with a feature flag
 export const useRemoveInstancesFromLandscape = () => {
-  const authFetchOld = useFetchOld();
+  const { isFeatureEnabled } = useAuth();
   const queryClient = useQueryClient();
+  const authFetch = useFetch();
+  const authFetchOld = useFetchOld();
+  const isComputerSoftDeletionEnabled = isFeatureEnabled(
+    "computer-soft-deletion",
+  );
 
   const { isPending, mutateAsync } = useMutation<
     AxiosResponse<Instance[]>,
     AxiosError<ApiError>,
     RemoveInstancesParams
   >({
-    mutationFn: async (params) =>
-      authFetchOld.get("RemoveComputers", { params }),
+    mutationFn: async (params: RemoveInstancesParams) => {
+      if (isComputerSoftDeletionEnabled) {
+        return authFetch.post("/computers:delete", params);
+      }
+
+      return authFetchOld.get("RemoveComputers", { params });
+    },
     onSuccess: async () =>
       queryClient.invalidateQueries({ queryKey: ["instances"] }),
   });
diff --git a/src/features/instances/components/InstanceRemoveFromLandscapeModal/InstanceRemoveFromLandscapeModal.tsx b/src/features/instances/components/InstanceRemoveFromLandscapeModal/InstanceRemoveFromLandscapeModal.tsx
index 26a6b8a86..5269bc874 100644
--- a/src/features/instances/components/InstanceRemoveFromLandscapeModal/InstanceRemoveFromLandscapeModal.tsx
+++ b/src/features/instances/components/InstanceRemoveFromLandscapeModal/InstanceRemoveFromLandscapeModal.tsx
@@ -28,6 +28,8 @@ const InstanceRemoveFromLandscapeModal: FC<
     `instances`,
   );
 
+  const title = `Remove ${label} from Landscape`;
+
   const removeFromLandscape = async () => {
     try {
       await removeInstancesFromLandscape({
@@ -56,7 +58,7 @@ const InstanceRemoveFromLandscapeModal: FC<
     <TextConfirmationModal
       isOpen={isOpen}
       close={close}
-      title={`Remove ${label} from Landscape`}
+      title={title}
       confirmButtonLabel="Remove"
       confirmButtonAppearance="negative"
       confirmButtonDisabled={isRemovingInstancesFromLandscape}
diff --git a/src/features/instances/components/InstancesPageActions/InstancesPageActions.tsx b/src/features/instances/components/InstancesPageActions/InstancesPageActions.tsx
index c11cad22c..1ed7eac02 100644
--- a/src/features/instances/components/InstancesPageActions/InstancesPageActions.tsx
+++ b/src/features/instances/components/InstancesPageActions/InstancesPageActions.tsx
@@ -215,7 +215,7 @@ const InstancesPageActions = memo(function InstancesPageActions({
           children: <span>Attach token</span>,
           onClick: handleAttachToken,
         },
-    isFeatureEnabled("ubuntu_pro_licensing")
+    isFeatureEnabled("ubuntu-pro-licensing")
       ? {
           children: <span>Detach token</span>,
           onClick: openDetachModal,
diff --git a/src/features/ubuntupro/components/UbuntuProHeader/UbuntuProHeader.tsx b/src/features/ubuntupro/components/UbuntuProHeader/UbuntuProHeader.tsx
index 98c971fbc..3dbbbe972 100644
--- a/src/features/ubuntupro/components/UbuntuProHeader/UbuntuProHeader.tsx
+++ b/src/features/ubuntupro/components/UbuntuProHeader/UbuntuProHeader.tsx
@@ -66,7 +66,7 @@ const UbuntuProHeader: FC<UbuntuProHeaderProps> = ({ instance }) => {
               icon: "delete",
               label: "Detach token",
               onClick: openDetachModal,
-              excluded: !isFeatureEnabled("ubuntu_pro_licensing"),
+              excluded: !isFeatureEnabled("ubuntu-pro-licensing"),
             },
           ],
         }}
diff --git a/src/tests/mocks/features.ts b/src/tests/mocks/features.ts
index 2411ba4cd..936af1908 100644
--- a/src/tests/mocks/features.ts
+++ b/src/tests/mocks/features.ts
@@ -70,7 +70,7 @@ export const features: Feature[] = [
     name: "Ubuntu Pro Licensing",
     description:
       "Allows attaching, replacing, and detaching Ubuntu Pro tokens to/from instances.",
-    key: "ubuntu_pro_licensing",
+    key: "ubuntu-pro-licensing",
     database_key: 8,
     enabled: true,
     details: {
@@ -89,4 +89,17 @@ export const features: Feature[] = [
       account: false,
     },
   },
+  {
+    name: "Computer Soft Deletion",
+    description:
+      "Soft delete computers instead of hard deleting them. Soft-deleted computers still exist in the database, but will be filtered out and eventually removed.",
+    key: "computer-soft-deletion",
+    database_key: 12,
+    enabled: true,
+    details: {
+      configuration: true,
+      // self_hosted_default: false,
+      account: true,
+    },
+  },
 ];
diff --git a/src/tests/server/handlers/instance.ts b/src/tests/server/handlers/instance.ts
index 1cb32e5e4..f5c385963 100644
--- a/src/tests/server/handlers/instance.ts
+++ b/src/tests/server/handlers/instance.ts
@@ -451,6 +451,11 @@ export default [
     },
   ),
 
+  http.post(`${API_URL}computers\\:delete`, async () => {
+    await delay();
+    return HttpResponse.json();
+  }),
+
   http.get(API_URL_OLD, async ({ request }) => {
     if (!isAction(request, ["AddTagsToComputers"])) {
       return;
diff --git a/src/types/FeatureKey.ts b/src/types/FeatureKey.ts
index 5f824df71..0e3cad041 100644
--- a/src/types/FeatureKey.ts
+++ b/src/types/FeatureKey.ts
@@ -1,9 +1,10 @@
 export type FeatureKey =
-  | "oidc-configuration"
-  | "spa-dashboard"
+  | "computer-soft-deletion"
   | "employee-management"
+  | "oidc-configuration"
   | "script-profiles"
-  | "usg-profiles"
+  | "spa-dashboard"
   | "support-provider-login"
-  | "wsl-child-instance-profiles"
-  | "ubuntu_pro_licensing";
+  | "ubuntu-pro-licensing"
+  | "usg-profiles"
+  | "wsl-child-instance-profiles";

From d9b1d1bf1ca048bb0f87ffe07ca4b797e34892c2 Mon Sep 17 00:00:00 2001
From: Rubin Aga <66167934+rubinaga@users.noreply.github.com>
Date: Mon, 20 Apr 2026 18:02:59 +0200
Subject: [PATCH 22/42] Rebase changes from main into deb-archive

test: add tests for all non profile related files with under 60% coverage (#537)

This PR adds code coverage for all non profile related files with under
60% coverage.

According to the [Landscape Server Release
Cycle](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `dev` / `main` (Beta)
- **Version Impact**:
  - [ ] Patch (Fix)
  - [ ] Minor (Feature)
  - [ ] Major (Breaking)

- [ ] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [ ] **UI Verified**: I have verified the changes locally.
- [ ] **Linting**: No linting errors are present (especially in
`scripts/`).

> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.
---
 src/App.test.tsx                              |  15 +
 .../SearchQueryEditor.test.tsx                |  86 +++++
 src/components/form/CheckboxGroup.test.tsx    |  53 +++
 src/components/form/CodeEditor.test.tsx       |  19 ++
 src/components/form/CodeEditorInner.test.tsx  | 101 ++++++
 .../form/FileInput/FileInput.test.tsx         |  83 ++++-
 src/components/form/monacoMock.test.tsx       |  65 ++++
 .../guards/__tests__/SelfHostedGuard.test.tsx |  70 ++++
 .../layout/GlobalShell/GlobalShell.test.tsx   |  55 +--
 src/context/auth.test.tsx                     | 256 ++++++++++++++
 .../AlertTagsCell/AlertTagsCell.test.tsx      | 121 ++++++-
 src/features/alerts/index.ts                  |   7 +-
 src/features/api-credentials/index.ts         |   1 +
 .../OTPInputContainer.test.tsx                |  80 ++++-
 .../OTPInputContainer/OTPInputContainer.tsx   |   2 +-
 src/features/auth/helpers.test.ts             |  76 +++++
 .../AutoinstallFileForm.test.tsx              | 256 ++++++++++++--
 .../AutoinstallFileForm.tsx                   |   1 +
 .../EmployeeDropdown.test.tsx                 | 188 ++++++++--
 .../NewGPGKeyForm/NewGPGKeyForm.test.tsx      |  94 +++++
 .../components/KernelOverview/helpers.test.ts | 104 ++++++
 .../RestartInstanceForm.test.tsx              | 135 +++++++-
 .../EditPocketForm/EditPocketForm.test.tsx    | 194 +++++++++++
 .../components/EditPocketForm/helpers.test.ts | 132 +++++++
 .../components/EditPocketForm/helpers.ts      |   2 +-
 .../PackageList/PackageList.test.tsx          | 235 ++++++++++++-
 .../components/PackageList/PackageList.tsx    |  21 +-
 .../components/AlertCard/AlertCard.test.tsx   |  63 +++-
 .../PackageProfileAddSidePanel.test.tsx       |   3 +-
 .../ProcessesHeader/ProcessesHeader.test.tsx  | 130 ++++++-
 .../AttachmentFile/AttachmentFile.test.tsx    |  82 +++--
 .../AttachmentFile/AttachmentFile.tsx         |   4 +-
 .../CreateScriptForm.test.tsx                 | 173 +++++++++-
 .../CreateScriptForm/CreateScriptForm.tsx     |   7 +-
 .../EditScriptForm/EditScriptForm.test.tsx    | 301 +++++++++++++++-
 .../EditScriptForm/EditScriptForm.tsx         |   1 +
 .../RunScriptForm/RunScriptForm.test.tsx      |   9 +-
 .../RunScriptForm/RunScriptForm.tsx           |  14 +-
 .../ScriptFormAttachments.tsx                 |   4 +-
 src/features/scripts/helpers.test.ts          | 104 ++++++
 .../SecurityProfileDetailsSidePanel.test.tsx  |   3 +-
 .../SecurityProfileDownloadAuditForm.tsx      |   4 +-
 .../components/EditSnap/helpers.test.tsx      | 123 +++++++
 .../snaps/components/EditSnap/helpers.tsx     |   1 +
 .../SnapsActions/SnapsActions.test.tsx        | 180 ++++++++++
 .../DetachTokenModal.test.tsx                 | 114 +++++++
 .../components/Upgrades/Upgrades.test.tsx     | 120 ++++++-
 .../upgrades/components/Upgrades/Upgrades.tsx |  12 +-
 .../WelcomePopup/WelcomePopup.test.tsx        |  22 +-
 .../WslInstancesHeader.test.tsx               | 132 ++++++-
 src/main.test.tsx                             | 100 ++++++
 src/main.tsx                                  |  63 +++-
 src/pages/PageNotFound.test.tsx               |  21 ++
 .../dashboard/account/AccountPage.test.tsx    |  29 ++
 .../account/alerts/AlertsPage.test.tsx        |  26 ++
 .../dashboard/account/alerts/AlertsPage.tsx   |  13 +-
 .../api-credentials/ApiCredentials.test.tsx   |  23 ++
 .../activities/ActivitiesPage.test.tsx        |  38 +++
 .../instances/InstancesPage/helpers.test.ts   |  86 +++++
 .../instances/ReportForm/ReportForm.test.tsx  |  61 ++++
 .../SingleInstanceContainer.test.tsx          | 152 +++++++--
 .../SingleInstanceContainer/helpers.test.ts   | 203 +++++++++++
 .../AssignEmployeeToInstanceForm.test.tsx     |  63 +++-
 .../info/EditInstance/EditInstance.test.tsx   | 200 +++++++++++
 .../packages/PackagesPanel/helpers.test.ts    |  22 ++
 .../users/EditUserForm/EditUserForm.test.tsx  | 159 ++++++++-
 .../tabs/users/UserList/UserList.test.tsx     |  93 ++++-
 .../tabs/users/UserList/helpers.test.ts       |  32 ++
 .../UserPanelActionButtons.test.tsx           | 321 +++++++++++++++++-
 .../UserPanelActionButtons/helpers.test.tsx   | 138 ++++++++
 .../users/UserPanelActionButtons/helpers.tsx  |  17 +-
 .../dashboard/overview/OverviewPage.test.tsx  |  26 ++
 .../dashboard/repositories/RepositoryPage.tsx |   9 -
 .../LocalRepositoriesPage.tsx                 |   3 +-
 .../local-repositories/constants.ts           |   2 +
 .../mirrors/DistributionsPage.test.tsx        |  97 ++++++
 .../publications/PublicationsPage.tsx         |   3 +-
 .../dashboard/settings/SettingsPage.test.tsx  |  27 ++
 .../access-group/AccessGroupsPage.test.tsx    |  59 ++++
 .../roles/EditRoleForm/EditRoleForm.test.tsx  | 144 +++++++-
 .../roles/EditRoleForm/helpers.test.ts        | 153 ++++++++-
 src/routes/AuthRoutes.test.tsx                |  74 ++++
 src/routes/elements.test.tsx                  | 131 +++++++
 src/tests/browser.ts                          |   6 +-
 src/tests/mocks/alerts.ts                     |  12 +
 src/tests/mocks/instance.ts                   |   5 +-
 src/tests/mocks/wsl.ts                        |   4 +-
 src/tests/monacoMock.tsx                      |  65 +++-
 src/tests/server/handlers/_constants.ts       |  17 +-
 src/tests/server/handlers/accessGroup.ts      |   8 +
 src/tests/server/handlers/activity.ts         |  20 +-
 src/tests/server/handlers/alerts.ts           |  51 ++-
 src/tests/server/handlers/aptSource.ts        |  19 +-
 src/tests/server/handlers/auth.ts             |  23 +-
 src/tests/server/handlers/autoinstallFiles.ts |  27 ++
 src/tests/server/handlers/employees.ts        |  41 +++
 src/tests/server/handlers/gpgKey.ts           |  31 ++
 src/tests/server/handlers/index.ts            |   2 +
 src/tests/server/handlers/instance.ts         |  94 ++++-
 src/tests/server/handlers/kernel.ts           |  15 +
 src/tests/server/handlers/pockets.ts          | 134 +++++++-
 src/tests/server/handlers/process.ts          |  26 +-
 src/tests/server/handlers/reports.ts          |  23 ++
 src/tests/server/handlers/roles.ts            |  63 +++-
 src/tests/server/handlers/script.ts           | 117 +++++--
 src/tests/server/handlers/tag.ts              |  30 +-
 src/tests/server/handlers/user.ts             |  87 +++++
 src/tests/server/handlers/usn.ts              |  13 +
 src/tests/server/handlers/wsl.ts              |  11 +
 src/types/Instance.ts                         |   1 +
 110 files changed, 7230 insertions(+), 361 deletions(-)
 create mode 100644 src/App.test.tsx
 create mode 100644 src/components/filter/SearchQueryEditor/SearchQueryEditor.test.tsx
 create mode 100644 src/components/form/CheckboxGroup.test.tsx
 create mode 100644 src/components/form/CodeEditor.test.tsx
 create mode 100644 src/components/form/CodeEditorInner.test.tsx
 create mode 100644 src/components/form/monacoMock.test.tsx
 create mode 100644 src/components/guards/__tests__/SelfHostedGuard.test.tsx
 create mode 100644 src/context/auth.test.tsx
 create mode 100644 src/features/auth/helpers.test.ts
 create mode 100644 src/features/kernel/components/KernelOverview/helpers.test.ts
 create mode 100644 src/features/mirrors/components/EditPocketForm/helpers.test.ts
 create mode 100644 src/features/scripts/helpers.test.ts
 create mode 100644 src/features/snaps/components/EditSnap/helpers.test.tsx
 create mode 100644 src/main.test.tsx
 create mode 100644 src/pages/PageNotFound.test.tsx
 create mode 100644 src/pages/dashboard/account/AccountPage.test.tsx
 create mode 100644 src/pages/dashboard/account/alerts/AlertsPage.test.tsx
 create mode 100644 src/pages/dashboard/account/api-credentials/ApiCredentials.test.tsx
 create mode 100644 src/pages/dashboard/activities/ActivitiesPage.test.tsx
 create mode 100644 src/pages/dashboard/instances/InstancesPage/helpers.test.ts
 create mode 100644 src/pages/dashboard/instances/ReportForm/ReportForm.test.tsx
 create mode 100644 src/pages/dashboard/instances/[single]/SingleInstanceContainer/helpers.test.ts
 create mode 100644 src/pages/dashboard/instances/[single]/tabs/info/EditInstance/EditInstance.test.tsx
 create mode 100644 src/pages/dashboard/instances/[single]/tabs/packages/PackagesPanel/helpers.test.ts
 create mode 100644 src/pages/dashboard/instances/[single]/tabs/users/UserList/helpers.test.ts
 create mode 100644 src/pages/dashboard/instances/[single]/tabs/users/UserPanelActionButtons/helpers.test.tsx
 create mode 100644 src/pages/dashboard/overview/OverviewPage.test.tsx
 delete mode 100644 src/pages/dashboard/repositories/RepositoryPage.tsx
 create mode 100644 src/pages/dashboard/repositories/local-repositories/constants.ts
 create mode 100644 src/pages/dashboard/repositories/mirrors/DistributionsPage.test.tsx
 create mode 100644 src/pages/dashboard/settings/SettingsPage.test.tsx
 create mode 100644 src/pages/dashboard/settings/access-group/AccessGroupsPage.test.tsx
 create mode 100644 src/routes/AuthRoutes.test.tsx
 create mode 100644 src/routes/elements.test.tsx
 create mode 100644 src/tests/server/handlers/reports.ts

diff --git a/src/App.test.tsx b/src/App.test.tsx
new file mode 100644
index 000000000..242bc3bd5
--- /dev/null
+++ b/src/App.test.tsx
@@ -0,0 +1,15 @@
+import { screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import { renderWithProviders } from "@/tests/render";
+import App from "./App";
+
+describe("App", () => {
+  it("renders not found route for unknown path", async () => {
+    renderWithProviders(<App />, undefined, "/does-not-exist");
+
+    expect(await screen.findByText("Page not found")).toBeInTheDocument();
+    expect(
+      screen.getByRole("link", { name: "Go back to the home page" }),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/components/filter/SearchQueryEditor/SearchQueryEditor.test.tsx b/src/components/filter/SearchQueryEditor/SearchQueryEditor.test.tsx
new file mode 100644
index 000000000..5b65096b2
--- /dev/null
+++ b/src/components/filter/SearchQueryEditor/SearchQueryEditor.test.tsx
@@ -0,0 +1,86 @@
+import { render } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+import SearchQueryEditor from "./SearchQueryEditor";
+
+const codeEditorSpy = vi.fn();
+
+vi.mock("@/components/form/CodeEditor", () => ({
+  default: (props: Record<string, unknown>) => {
+    codeEditorSpy(props);
+    return <div data-testid="search-query-editor-mock" />;
+  },
+}));
+
+describe("SearchQueryEditor", () => {
+  it("configures monaco language when terms exist", () => {
+    const configureSearchLanguage = vi.fn();
+
+    render(
+      <SearchQueryEditor
+        label="Search"
+        value="status:installed"
+        languageId="landscape-query"
+        terms={["status"]}
+        languageConfig={{
+          profileTypes: ["security"],
+          usgStatuses: ["compliant"],
+          wslStatuses: ["enabled"],
+        }}
+        configureSearchLanguage={configureSearchLanguage}
+      />,
+    );
+
+    const call = codeEditorSpy.mock.calls.at(-1)?.[0] as {
+      monacoBeforeMount: (monaco: unknown) => void;
+      options: Record<string, unknown>;
+      language: string;
+    };
+
+    expect(call.language).toBe("landscape-query");
+    expect(call.options).toMatchObject({
+      fixedOverflowWidgets: true,
+      suggestOnTriggerCharacters: true,
+      quickSuggestions: true,
+    });
+
+    const monaco = { editor: {} };
+    call.monacoBeforeMount(monaco);
+
+    expect(configureSearchLanguage).toHaveBeenCalledWith(
+      monaco,
+      "landscape-query",
+      ["status"],
+      {
+        profileTypes: ["security"],
+        usgStatuses: ["compliant"],
+        wslStatuses: ["enabled"],
+      },
+    );
+  });
+
+  it("does not configure monaco language when terms are empty", () => {
+    const configureSearchLanguage = vi.fn();
+
+    render(
+      <SearchQueryEditor
+        label="Search"
+        value=""
+        languageId="landscape-query"
+        terms={[]}
+        languageConfig={{
+          profileTypes: [],
+          usgStatuses: [],
+          wslStatuses: [],
+        }}
+        configureSearchLanguage={configureSearchLanguage}
+      />,
+    );
+
+    const call = codeEditorSpy.mock.calls.at(-1)?.[0] as {
+      monacoBeforeMount: (monaco: unknown) => void;
+    };
+
+    call.monacoBeforeMount({});
+    expect(configureSearchLanguage).not.toHaveBeenCalled();
+  });
+});
diff --git a/src/components/form/CheckboxGroup.test.tsx b/src/components/form/CheckboxGroup.test.tsx
new file mode 100644
index 000000000..9545118e0
--- /dev/null
+++ b/src/components/form/CheckboxGroup.test.tsx
@@ -0,0 +1,53 @@
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it, vi } from "vitest";
+import { renderWithProviders } from "@/tests/render";
+import type { SelectOption } from "@/types/SelectOption";
+import CheckboxGroup from "./CheckboxGroup";
+
+const options: SelectOption[] = [
+  { label: "Alpha", value: "alpha" },
+  { label: "Beta", value: "beta" },
+];
+
+describe("CheckboxGroup", () => {
+  it("renders label, help, and error message", () => {
+    renderWithProviders(
+      <CheckboxGroup
+        name="groups"
+        label="Access groups"
+        options={options}
+        value={[]}
+        onChange={vi.fn()}
+        help="Select one or more groups"
+        error="Selection is required"
+        required
+      />,
+    );
+
+    expect(screen.getByText("Access groups")).toBeInTheDocument();
+    expect(screen.getByText("Select one or more groups")).toBeInTheDocument();
+    expect(screen.getByText("Selection is required")).toBeInTheDocument();
+  });
+
+  it("adds and removes values when options are toggled", async () => {
+    const user = userEvent.setup();
+    const onChange = vi.fn();
+
+    renderWithProviders(
+      <CheckboxGroup
+        name="groups"
+        label="Access groups"
+        options={options}
+        value={["alpha"]}
+        onChange={onChange}
+      />,
+    );
+
+    await user.click(screen.getByLabelText("Alpha"));
+    expect(onChange).toHaveBeenCalledWith([]);
+
+    await user.click(screen.getByLabelText("Beta"));
+    expect(onChange).toHaveBeenCalledWith(["alpha", "beta"]);
+  });
+});
diff --git a/src/components/form/CodeEditor.test.tsx b/src/components/form/CodeEditor.test.tsx
new file mode 100644
index 000000000..cae30051c
--- /dev/null
+++ b/src/components/form/CodeEditor.test.tsx
@@ -0,0 +1,19 @@
+import { render, screen } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+import CodeEditor from "./CodeEditor";
+
+vi.mock("./CodeEditorInner", () => ({
+  default: ({ label }: { label: string }) => (
+    <div data-testid="code-editor-inner">{label}</div>
+  ),
+}));
+
+describe("CodeEditor", () => {
+  it("renders lazy inner editor", async () => {
+    render(<CodeEditor label="Script" value="echo hello" />);
+
+    expect(await screen.findByTestId("code-editor-inner")).toHaveTextContent(
+      "Script",
+    );
+  });
+});
diff --git a/src/components/form/CodeEditorInner.test.tsx b/src/components/form/CodeEditorInner.test.tsx
new file mode 100644
index 000000000..a416b6ffa
--- /dev/null
+++ b/src/components/form/CodeEditorInner.test.tsx
@@ -0,0 +1,101 @@
+import { render, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it, vi } from "vitest";
+import CodeEditorInner from "./CodeEditorInner";
+
+const useThemeSpy = vi.fn();
+
+vi.mock("@/context/theme", () => ({
+  useTheme: () => useThemeSpy(),
+}));
+
+vi.mock("@/libs/monaco", () => ({}));
+
+describe("CodeEditorInner", () => {
+  it("renders label and validation state, then triggers change and blur", async () => {
+    const user = userEvent.setup();
+
+    useThemeSpy.mockReturnValue({ isDarkMode: true });
+
+    const onChange = vi.fn();
+    const onBlur = vi.fn();
+    const monacoBeforeMount = vi.fn();
+
+    render(
+      <>
+        <CodeEditorInner
+          label="Command"
+          value="echo hi"
+          required
+          error="invalid"
+          onChange={onChange}
+          onBlur={onBlur}
+          monacoBeforeMount={monacoBeforeMount}
+        />
+        <button>outside</button>
+      </>,
+    );
+
+    expect(screen.getByText("Command")).toBeInTheDocument();
+    expect(screen.getByText("invalid")).toBeInTheDocument();
+
+    const label = screen.getByText("Command");
+    expect(label).toHaveClass("is-required");
+
+    const editor = screen.getByTestId("mock-monaco");
+    expect(editor).toHaveAttribute("data-theme", "vs-dark");
+    expect(editor).toHaveAttribute("data-language", "shell");
+
+    await user.click(editor);
+    await user.type(editor, "abc");
+    await user.tab();
+
+    expect(onChange).toHaveBeenCalled();
+    expect(onBlur).toHaveBeenCalled();
+    expect(monacoBeforeMount).toHaveBeenCalled();
+  });
+
+  it("uses light theme when dark mode is disabled", () => {
+    useThemeSpy.mockReturnValue({ isDarkMode: false });
+
+    render(<CodeEditorInner label="Command" value="echo hi" />);
+
+    expect(screen.getByTestId("mock-monaco")).toHaveAttribute(
+      "data-theme",
+      "vs-light",
+    );
+  });
+
+  it("does not call blur callback when focus stays inside editor container", async () => {
+    const user = userEvent.setup();
+    useThemeSpy.mockReturnValue({ isDarkMode: false });
+    const onBlur = vi.fn();
+
+    render(
+      <CodeEditorInner
+        label="Command"
+        value="echo hi"
+        onBlur={onBlur}
+        headerContent={<button type="button">Inside header action</button>}
+      />,
+    );
+
+    const editor = screen.getByTestId("mock-monaco");
+    const control = editor.closest(".p-form__control");
+    assert(control);
+
+    const insideControlButton = document.createElement("button");
+    insideControlButton.type = "button";
+    insideControlButton.textContent = "Inside control";
+    control.appendChild(insideControlButton);
+
+    await user.click(editor);
+    await user.click(screen.getByRole("button", { name: "Inside control" }));
+    expect(onBlur).not.toHaveBeenCalled();
+
+    await user.click(
+      screen.getByRole("button", { name: "Inside header action" }),
+    );
+    expect(onBlur).toHaveBeenCalledTimes(1);
+  });
+});
diff --git a/src/components/form/FileInput/FileInput.test.tsx b/src/components/form/FileInput/FileInput.test.tsx
index bd5e4041c..242462882 100644
--- a/src/components/form/FileInput/FileInput.test.tsx
+++ b/src/components/form/FileInput/FileInput.test.tsx
@@ -1,4 +1,4 @@
-import { screen } from "@testing-library/react";
+import { fireEvent, screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { describe, expect, it, vi } from "vitest";
 import { renderWithProviders } from "@/tests/render";
@@ -80,4 +80,85 @@ describe("FileInput", () => {
 
     expect(screen.getByText("Script file")).toBeInTheDocument();
   });
+
+  it("shows help text when a file is present", () => {
+    const file = new File(["content"], "helped.txt", { type: "text/plain" });
+
+    renderWithProviders(
+      <FileInput
+        help="Only text files are allowed"
+        value={file}
+        onFileUpload={vi.fn()}
+        onFileRemove={vi.fn()}
+      />,
+    );
+
+    expect(screen.getByText("Only text files are allowed")).toBeInTheDocument();
+  });
+
+  it("does not call onFileUpload when no files are selected", () => {
+    const onFileUpload = vi.fn();
+
+    renderWithProviders(
+      <FileInput
+        label="Upload script"
+        value={null}
+        onFileUpload={onFileUpload}
+        onFileRemove={vi.fn()}
+      />,
+    );
+
+    fireEvent.change(screen.getByLabelText("Upload script"), {
+      target: { files: null },
+    });
+
+    expect(onFileUpload).not.toHaveBeenCalled();
+  });
+
+  it("uploads selected file and triggers onBlur callback", async () => {
+    const user = userEvent.setup();
+    const onFileUpload = vi.fn().mockResolvedValue(undefined);
+    const onBlur = vi.fn();
+    const file = new File(["script"], "script.sh", {
+      type: "text/x-shellscript",
+    });
+
+    renderWithProviders(
+      <FileInput
+        label="Upload script"
+        value={null}
+        onFileUpload={onFileUpload}
+        onFileRemove={vi.fn()}
+        onBlur={onBlur}
+      />,
+    );
+
+    const input = screen.getByLabelText("Upload script");
+    await user.click(input);
+    await user.upload(input, file);
+
+    expect(onFileUpload).toHaveBeenCalledWith([file]);
+    expect(onBlur).toHaveBeenCalledTimes(1);
+  });
+
+  it("uploads selected file when onBlur is not provided", async () => {
+    const user = userEvent.setup();
+    const onFileUpload = vi.fn().mockResolvedValue(undefined);
+    const file = new File(["script"], "script.sh", {
+      type: "text/x-shellscript",
+    });
+
+    renderWithProviders(
+      <FileInput
+        label="Upload script"
+        value={null}
+        onFileUpload={onFileUpload}
+        onFileRemove={vi.fn()}
+      />,
+    );
+
+    await user.upload(screen.getByLabelText("Upload script"), file);
+
+    expect(onFileUpload).toHaveBeenCalledWith([file]);
+  });
 });
diff --git a/src/components/form/monacoMock.test.tsx b/src/components/form/monacoMock.test.tsx
new file mode 100644
index 000000000..ae278cd31
--- /dev/null
+++ b/src/components/form/monacoMock.test.tsx
@@ -0,0 +1,65 @@
+import { render, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it, vi } from "vitest";
+import CodeEditorMock, { Editor } from "@/tests/monacoMock";
+
+describe("monacoMock", () => {
+  it("renders editor value and invokes optional callbacks", async () => {
+    const user = userEvent.setup();
+    const beforeMount = vi.fn();
+    const onChange = vi.fn();
+
+    render(
+      <Editor
+        value="echo hi"
+        language="shell"
+        theme="vs-dark"
+        className="editor"
+        beforeMount={beforeMount}
+        onChange={onChange}
+      />,
+    );
+
+    const editor = screen.getByTestId("mock-monaco");
+    expect(editor).toHaveValue("echo hi");
+    expect(editor).toHaveAttribute("data-language", "shell");
+    expect(editor).toHaveAttribute("data-theme", "vs-dark");
+    expect(editor).toHaveClass("editor");
+    expect(beforeMount).toHaveBeenCalledWith({ mocked: true });
+
+    await user.clear(editor);
+    await user.type(editor, "updated value");
+
+    expect(onChange).toHaveBeenCalled();
+  });
+
+  it("uses defaultValue when value is undefined", async () => {
+    const user = userEvent.setup();
+
+    render(<Editor defaultValue="fallback" />);
+
+    const editor = screen.getByTestId("mock-monaco");
+    expect(editor).toHaveValue("fallback");
+
+    await user.type(editor, " text");
+    expect(editor).toHaveValue("fallback");
+  });
+
+  it("renders CodeEditorMock content and conditionally renders errors", () => {
+    const { rerender } = render(
+      <CodeEditorMock
+        label="Script"
+        value="echo test"
+        error="Invalid script"
+        headerContent={<span>Header action</span>}
+      />,
+    );
+
+    expect(screen.getByText("Script")).toBeInTheDocument();
+    expect(screen.getByText("Header action")).toBeInTheDocument();
+    expect(screen.getByText("Invalid script")).toBeInTheDocument();
+
+    rerender(<CodeEditorMock label="Script" error={false} />);
+    expect(screen.queryByText("Invalid script")).not.toBeInTheDocument();
+  });
+});
diff --git a/src/components/guards/__tests__/SelfHostedGuard.test.tsx b/src/components/guards/__tests__/SelfHostedGuard.test.tsx
new file mode 100644
index 000000000..7aea553df
--- /dev/null
+++ b/src/components/guards/__tests__/SelfHostedGuard.test.tsx
@@ -0,0 +1,70 @@
+import EnvError from "@/pages/EnvError";
+import { EnvContext, type EnvContextState } from "@/context/env";
+import { render, screen } from "@testing-library/react";
+import { MemoryRouter, Route, Routes } from "react-router";
+import { describe, expect, it } from "vitest";
+import { SelfHostedGuard } from "../SelfHostedGuard";
+
+describe("SelfHostedGuard", () => {
+  const envState: EnvContextState = {
+    envLoading: false,
+    isSaas: true,
+    isSelfHosted: false,
+    packageVersion: "",
+    revision: "",
+    displayDisaStigBanner: false,
+  };
+
+  const renderWithRoutes = (value: EnvContextState) => {
+    return render(
+      <MemoryRouter initialEntries={["/"]}>
+        <EnvContext.Provider value={value}>
+          <Routes>
+            <Route
+              path="/"
+              element={
+                <SelfHostedGuard>
+                  <div>secret</div>
+                </SelfHostedGuard>
+              }
+            />
+            <Route path="/env-error" element={<EnvError />} />
+          </Routes>
+        </EnvContext.Provider>
+      </MemoryRouter>,
+    );
+  };
+
+  it("renders loading state while env is loading", () => {
+    renderWithRoutes({
+      ...envState,
+      envLoading: true,
+    });
+
+    expect(screen.queryByText("secret")).not.toBeInTheDocument();
+    expect(screen.queryByText("Environment Error")).not.toBeInTheDocument();
+  });
+
+  it("renders children when self hosted", () => {
+    renderWithRoutes({
+      ...envState,
+      isSelfHosted: true,
+      isSaas: false,
+    });
+
+    expect(screen.getByText("secret")).toBeInTheDocument();
+    expect(screen.queryByText("Environment Error")).not.toBeInTheDocument();
+  });
+
+  it("navigates away when not self hosted", () => {
+    renderWithRoutes({
+      ...envState,
+    });
+
+    expect(screen.queryByText("secret")).not.toBeInTheDocument();
+    expect(screen.getByText("Environment Error")).toBeInTheDocument();
+    expect(
+      screen.getByText("This feature is not available in SaaS mode."),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/components/layout/GlobalShell/GlobalShell.test.tsx b/src/components/layout/GlobalShell/GlobalShell.test.tsx
index afd217a53..59e38dc8e 100644
--- a/src/components/layout/GlobalShell/GlobalShell.test.tsx
+++ b/src/components/layout/GlobalShell/GlobalShell.test.tsx
@@ -1,40 +1,49 @@
-import { NotifyContext } from "@/context/notify";
+import useNotify from "@/hooks/useNotify";
 import { renderWithProviders } from "@/tests/render";
 import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
 import { describe, it, expect } from "vitest";
 import { GlobalShell } from "./GlobalShell";
 
+const NotificationTrigger = () => {
+  const { notify } = useNotify();
+
+  return (
+    <button
+      type="button"
+      onClick={() => {
+        notify.success({
+          title: "Success",
+          message: "Success notification",
+        });
+      }}
+    >
+      Trigger notification
+    </button>
+  );
+};
+
 describe("GlobalShell", () => {
   it("renders children", () => {
     renderWithProviders(<GlobalShell>Shell content</GlobalShell>);
     expect(screen.getByText("Shell content")).toBeInTheDocument();
   });
 
-  it("shows a notification when notify has a message", () => {
-    const notifyValue = {
-      notify: {
-        notification: {
-          type: "positive" as const,
-          message: "Success notification",
-          title: "Success",
-        },
-        success: () => undefined,
-        error: () => undefined,
-        info: () => undefined,
-        clear: () => undefined,
-      },
-      sidePanel: {
-        open: false,
-        setOpen: () => undefined,
-      },
-    };
+  it("shows a notification when notify has a message", async () => {
+    const user = userEvent.setup();
 
     renderWithProviders(
-      <NotifyContext.Provider value={notifyValue}>
-        <GlobalShell>content</GlobalShell>
-      </NotifyContext.Provider>,
+      <GlobalShell>
+        <NotificationTrigger />
+      </GlobalShell>,
+    );
+
+    await user.click(
+      screen.getByRole("button", { name: "Trigger notification" }),
     );
 
-    expect(screen.getByText("Success notification")).toBeInTheDocument();
+    expect(
+      (await screen.findAllByText("Success notification")).length,
+    ).toBeGreaterThan(0);
   });
 });
diff --git a/src/context/auth.test.tsx b/src/context/auth.test.tsx
new file mode 100644
index 000000000..0a80c524f
--- /dev/null
+++ b/src/context/auth.test.tsx
@@ -0,0 +1,256 @@
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { act, renderHook } from "@testing-library/react";
+import { render, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { useContext, type ReactNode } from "react";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import useFeatures from "@/hooks/useFeatures";
+import {
+  getSameOriginPath,
+  getSameOriginUrl,
+  redirectToExternalUrl,
+  useGetAuthState,
+} from "@/features/auth";
+import { authUser } from "@/tests/mocks/auth";
+import { HOMEPAGE_PATH } from "@/constants";
+import { ROUTES } from "@/libs/routes";
+import AuthProvider, { AuthContext } from "./auth";
+
+const navigate = vi.hoisted(() => vi.fn());
+const mockUseLocation = vi.hoisted(() => vi.fn());
+
+vi.mock("react-router", async () => {
+  const actual = await vi.importActual("react-router");
+
+  return {
+    ...actual,
+    useNavigate: () => navigate,
+    useLocation: () => mockUseLocation(),
+  };
+});
+
+vi.mock("@/hooks/useFeatures");
+vi.mock("@/features/auth");
+
+describe("AuthProvider", () => {
+  const wrapperWithProvider = (queryClient: QueryClient) => {
+    return function Wrapper({ children }: { readonly children: ReactNode }) {
+      return (
+        <QueryClientProvider client={queryClient}>
+          <AuthProvider>{children}</AuthProvider>
+        </QueryClientProvider>
+      );
+    };
+  };
+
+  const renderAuthContext = (queryClient: QueryClient) => {
+    return renderHook(() => useContext(AuthContext), {
+      wrapper: wrapperWithProvider(queryClient),
+    });
+  };
+
+  beforeEach(() => {
+    navigate.mockReset();
+
+    mockUseLocation.mockReturnValue({ pathname: "/dashboard" });
+
+    vi.mocked(useGetAuthState).mockReturnValue({
+      user: authUser,
+      isLoading: false,
+      isFetched: true,
+    });
+
+    vi.mocked(useFeatures).mockReturnValue({
+      isFeatureEnabled: vi.fn(() => true),
+      isFeaturesLoading: false,
+    });
+
+    vi.mocked(getSameOriginUrl).mockReturnValue(
+      new URL("/dashboard", window.location.origin),
+    );
+    vi.mocked(getSameOriginPath).mockReturnValue("/dashboard");
+    vi.mocked(redirectToExternalUrl).mockImplementation(() => undefined);
+  });
+
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  it("disables auth-state query when handling auth callbacks", () => {
+    mockUseLocation.mockReturnValue({ pathname: "/auth/handle-auth" });
+
+    const queryClient = new QueryClient();
+    renderAuthContext(queryClient);
+
+    expect(useGetAuthState).toHaveBeenCalledWith({ enabled: false });
+  });
+
+  it("exposes computed auth flags and feature checks", () => {
+    const isFeatureEnabled = vi.fn(() => true);
+    vi.mocked(useFeatures).mockReturnValue({
+      isFeatureEnabled,
+      isFeaturesLoading: false,
+    });
+
+    const queryClient = new QueryClient();
+    const { result } = renderAuthContext(queryClient);
+
+    expect(result.current.authorized).toBe(true);
+    expect(result.current.hasAccounts).toBe(true);
+    expect(result.current.authLoading).toBe(false);
+    expect(result.current.isFeatureEnabled("spa-dashboard")).toBe(true);
+  });
+
+  it("sets auth user and clears non-auth queries on logout", () => {
+    const queryClient = new QueryClient();
+    queryClient.setQueryData(["authUser"], authUser);
+    queryClient.setQueryData(["features", authUser.email], [{ key: "x" }]);
+
+    const { result } = renderAuthContext(queryClient);
+
+    act(() => {
+      result.current.setUser(authUser);
+    });
+
+    expect(queryClient.getQueryData(["authUser"])).toEqual(authUser);
+
+    act(() => {
+      result.current.logout();
+    });
+
+    expect(queryClient.getQueryData(["authUser"])).toBeNull();
+    expect(
+      queryClient.getQueryData(["features", authUser.email]),
+    ).toBeUndefined();
+    expect(navigate).toHaveBeenCalledWith(ROUTES.auth.login(), {
+      replace: true,
+    });
+  });
+
+  it("navigates to homepage for unsafe redirect targets", () => {
+    vi.mocked(getSameOriginUrl).mockReturnValue(null);
+
+    const queryClient = new QueryClient();
+    const { result } = renderAuthContext(queryClient);
+
+    act(() => {
+      result.current.safeRedirect("https://google.com");
+    });
+
+    expect(navigate).toHaveBeenCalledWith(HOMEPAGE_PATH, { replace: true });
+  });
+
+  it("navigates internally with same-origin safe path", () => {
+    vi.mocked(getSameOriginUrl).mockReturnValue(
+      new URL("/dashboard/settings", window.location.origin),
+    );
+    vi.mocked(getSameOriginPath).mockReturnValue("/dashboard/settings");
+
+    const queryClient = new QueryClient();
+    const { result } = renderAuthContext(queryClient);
+
+    act(() => {
+      result.current.safeRedirect("/dashboard/settings", { replace: false });
+    });
+
+    expect(navigate).toHaveBeenCalledWith("/dashboard/settings", {
+      replace: false,
+    });
+  });
+
+  it("uses external redirect helper when external option is requested", () => {
+    const safeUrl = new URL("/dashboard/settings", window.location.origin);
+    vi.mocked(getSameOriginUrl).mockReturnValue(safeUrl);
+
+    const queryClient = new QueryClient();
+    const { result } = renderAuthContext(queryClient);
+
+    act(() => {
+      result.current.safeRedirect("/dashboard/settings", {
+        external: true,
+        replace: false,
+      });
+    });
+
+    expect(redirectToExternalUrl).toHaveBeenCalledWith(safeUrl.toString(), {
+      replace: false,
+    });
+  });
+
+  it("redirects to safe path fallback when same-origin URL has no path", () => {
+    vi.mocked(getSameOriginUrl).mockReturnValue(
+      new URL(window.location.origin),
+    );
+    vi.mocked(getSameOriginPath).mockReturnValue(null);
+
+    const queryClient = new QueryClient();
+    const { result } = renderAuthContext(queryClient);
+
+    act(() => {
+      result.current.safeRedirect(window.location.origin, { replace: false });
+    });
+
+    expect(navigate).toHaveBeenCalledWith(HOMEPAGE_PATH, { replace: false });
+  });
+
+  it("exposes hasAccounts false when user has no accounts", () => {
+    vi.mocked(useGetAuthState).mockReturnValue({
+      user: { ...authUser, accounts: [], current_account: "" },
+      isLoading: false,
+      isFetched: true,
+    });
+
+    const queryClient = new QueryClient();
+    const { result } = renderAuthContext(queryClient);
+
+    expect(result.current.authorized).toBe(true);
+    expect(result.current.hasAccounts).toBe(false);
+  });
+
+  it("renders redirecting state while external redirect is in progress", async () => {
+    const user = userEvent.setup();
+
+    const TriggerExternalRedirect = () => {
+      const { safeRedirect } = useContext(AuthContext);
+
+      return (
+        <button
+          type="button"
+          onClick={() => {
+            safeRedirect("/dashboard", { external: true });
+          }}
+        >
+          Trigger redirect
+        </button>
+      );
+    };
+
+    const queryClient = new QueryClient();
+
+    render(
+      <QueryClientProvider client={queryClient}>
+        <AuthProvider>
+          <TriggerExternalRedirect />
+        </AuthProvider>
+      </QueryClientProvider>,
+    );
+
+    await user.click(screen.getByRole("button", { name: "Trigger redirect" }));
+
+    expect(screen.getAllByText("Redirecting...").length).toBeGreaterThan(0);
+  });
+
+  it("provides initial auth context defaults", () => {
+    const { result } = renderHook(() => useContext(AuthContext));
+
+    expect(result.current.authLoading).toBe(false);
+    expect(result.current.authorized).toBe(false);
+    expect(result.current.hasAccounts).toBe(false);
+    expect(result.current.user).toBeNull();
+    expect(result.current.isFeatureEnabled("spa-dashboard")).toBe(false);
+    expect(result.current.logout()).toBeUndefined();
+    expect(result.current.setUser(authUser)).toBeUndefined();
+    expect(result.current.safeRedirect()).toBeUndefined();
+    expect(result.current.redirectToExternalUrl("/dashboard")).toBeUndefined();
+  });
+});
diff --git a/src/features/alerts/components/AlertTagsCell/AlertTagsCell.test.tsx b/src/features/alerts/components/AlertTagsCell/AlertTagsCell.test.tsx
index 1bb88b3b8..0846fa709 100644
--- a/src/features/alerts/components/AlertTagsCell/AlertTagsCell.test.tsx
+++ b/src/features/alerts/components/AlertTagsCell/AlertTagsCell.test.tsx
@@ -1,12 +1,20 @@
 import { alerts } from "@/tests/mocks/alerts";
 import { renderWithProviders } from "@/tests/render";
+import { setEndpointStatus } from "@/tests/controllers/controller";
 import type { MultiSelectItem } from "@canonical/react-components";
 import { screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-import { describe, expect, it } from "vitest";
+import { beforeEach, describe, expect, it } from "vitest";
 import AlertTagsCell from "./AlertTagsCell";
 
-const mockAlert = alerts[0];
+const [mockAlert] = alerts;
+assert(mockAlert);
+const nonAllAlert = alerts.find((alert) => !alert.all_computers);
+assert(nonAllAlert);
+const taggedNonAllAlert = {
+  ...nonAllAlert,
+  tags: ["tag1", "tag2"],
+};
 
 const mockAvailableTagOptions: MultiSelectItem[] = [
   { value: "All", label: "All instances" },
@@ -16,6 +24,10 @@ const mockAvailableTagOptions: MultiSelectItem[] = [
 ];
 
 describe("AlertTagsCell", () => {
+  beforeEach(() => {
+    setEndpointStatus("default");
+  });
+
   it("allows selecting and deselecting tags", async () => {
     renderWithProviders(
       <AlertTagsCell
@@ -78,4 +90,109 @@ describe("AlertTagsCell", () => {
     expect(screen.getByText("Save changes")).toHaveAttribute("aria-disabled");
     expect(screen.getByText("Revert")).toHaveAttribute("aria-disabled");
   });
+
+  it("saves all-instances selection and shows success message", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <AlertTagsCell
+        alert={mockAlert}
+        availableTagOptions={mockAvailableTagOptions}
+      />,
+    );
+
+    await user.click(screen.getByRole("combobox"));
+    await user.click(screen.getByRole("checkbox", { name: "All instances" }));
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    expect(await screen.findByText("Alert tags updated")).toBeInTheDocument();
+  });
+
+  it("saves deselected all-instances tags and shows success message", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <AlertTagsCell
+        alert={mockAlert}
+        availableTagOptions={mockAvailableTagOptions}
+      />,
+    );
+
+    await user.click(screen.getByRole("combobox"));
+    await user.click(screen.getByRole("checkbox", { name: "All instances" }));
+    await user.click(screen.getByRole("checkbox", { name: "Tag 2" }));
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    expect(await screen.findByText("Alert tags updated")).toBeInTheDocument();
+  });
+
+  it("saves tag additions/removals for non-all alert and shows success message", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <AlertTagsCell
+        alert={nonAllAlert}
+        availableTagOptions={mockAvailableTagOptions}
+      />,
+    );
+
+    await user.click(screen.getByRole("combobox"));
+    await user.click(screen.getByRole("checkbox", { name: "Tag 1" }));
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    expect(await screen.findByText("Alert tags updated")).toBeInTheDocument();
+  });
+
+  it("saves all-instances selection for non-all alerts", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <AlertTagsCell
+        alert={nonAllAlert}
+        availableTagOptions={mockAvailableTagOptions}
+      />,
+    );
+
+    await user.click(screen.getByRole("combobox"));
+    await user.click(screen.getByRole("checkbox", { name: "All instances" }));
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    expect(await screen.findByText("Alert tags updated")).toBeInTheDocument();
+  });
+
+  it("saves deselected tags for non-all alerts with preselected tags", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <AlertTagsCell
+        alert={taggedNonAllAlert}
+        availableTagOptions={mockAvailableTagOptions}
+      />,
+    );
+
+    await user.click(screen.getByRole("combobox"));
+    await user.click(screen.getByRole("checkbox", { name: "Tag 2" }));
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    expect(await screen.findByText("Alert tags updated")).toBeInTheDocument();
+  });
+
+  it("shows an error notification when saving tags fails", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "error", path: "AssociateAlert" });
+
+    renderWithProviders(
+      <AlertTagsCell
+        alert={nonAllAlert}
+        availableTagOptions={mockAvailableTagOptions}
+      />,
+    );
+
+    await user.click(screen.getByRole("combobox"));
+    await user.click(screen.getByRole("checkbox", { name: "Tag 1" }));
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+  });
 });
diff --git a/src/features/alerts/index.ts b/src/features/alerts/index.ts
index e4d049de4..daece53d1 100644
--- a/src/features/alerts/index.ts
+++ b/src/features/alerts/index.ts
@@ -1,3 +1,8 @@
 export { default as AlertsList } from "./components/AlertsList";
 export { useAlerts } from "./hooks";
-export type { Alert, SubscriptionParams } from "./types";
+export type {
+  Alert,
+  SubscriptionParams,
+  AssociateAlertParams,
+  DisassociateAlertParams,
+} from "./types";
diff --git a/src/features/api-credentials/index.ts b/src/features/api-credentials/index.ts
index 1594806ac..ddbcc11bd 100644
--- a/src/features/api-credentials/index.ts
+++ b/src/features/api-credentials/index.ts
@@ -1,2 +1,3 @@
 export { default as ApiCredentialsTables } from "./components/ApiCredentialsTables";
 export { useApiCredentials } from "./hooks";
+export type { UserCredentials } from "./types";
diff --git a/src/features/attach/components/OTPInputContainer/OTPInputContainer.test.tsx b/src/features/attach/components/OTPInputContainer/OTPInputContainer.test.tsx
index 88a80719e..863188f45 100644
--- a/src/features/attach/components/OTPInputContainer/OTPInputContainer.test.tsx
+++ b/src/features/attach/components/OTPInputContainer/OTPInputContainer.test.tsx
@@ -1,12 +1,18 @@
 import { renderWithProviders } from "@/tests/render";
+import { PATHS, ROUTES } from "@/libs/routes";
+import { setEndpointStatus } from "@/tests/controllers/controller";
 import { screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-import { describe, expect, it } from "vitest";
+import { beforeEach, describe, expect, it } from "vitest";
 import OTPInputContainer from "./OTPInputContainer";
 
 describe("OTPInputContainer", () => {
   const user = userEvent.setup();
 
+  beforeEach(() => {
+    setEndpointStatus("default");
+  });
+
   it("should render the component with the correct title", () => {
     renderWithProviders(<OTPInputContainer />);
     expect(
@@ -30,4 +36,76 @@ describe("OTPInputContainer", () => {
     const errorMessage = screen.getByText("Code must be 6 characters long");
     expect(errorMessage).toBeInTheDocument();
   });
+
+  it("does not show length validation error when code is complete", async () => {
+    renderWithProviders(<OTPInputContainer />);
+
+    const inputs = screen.getAllByRole("textbox");
+    for (let i = 0; i < 6; i++) {
+      const input = inputs[i];
+      assert(input);
+      await user.type(input, String(i + 1));
+    }
+
+    await user.click(screen.getByRole("button", { name: /next/i }));
+
+    expect(
+      screen.queryByText("Code must be 6 characters long"),
+    ).not.toBeInTheDocument();
+  });
+
+  it("prefills code from query string when code is incomplete", () => {
+    renderWithProviders(
+      <OTPInputContainer />,
+      undefined,
+      `${ROUTES.auth.attach({ code: "QWER1" })}`,
+      PATHS.auth.attach,
+    );
+
+    const inputs = screen.getAllByRole("textbox");
+    expect(inputs[0]).toHaveValue("Q");
+    expect(inputs[1]).toHaveValue("W");
+    expect(inputs[2]).toHaveValue("E");
+    expect(inputs[3]).toHaveValue("R");
+    expect(inputs[4]).toHaveValue("1");
+    expect(inputs[5]).toHaveValue("");
+  });
+
+  it("shows expired-code error and stays on attach page", async () => {
+    renderWithProviders(
+      <OTPInputContainer />,
+      undefined,
+      `${ROUTES.auth.attach({ code: "EXPIRE" })}`,
+      PATHS.auth.attach,
+    );
+
+    expect(
+      await screen.findByText(
+        "The code you entered has expired and is no longer valid.",
+      ),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("heading", {
+        name: /enter code to connect to the ubuntu installer/i,
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it("shows endpoint error when verify request fails", async () => {
+    setEndpointStatus({
+      status: "error",
+      path: "ubuntu-installer-attach-sessions/code",
+    });
+
+    renderWithProviders(
+      <OTPInputContainer />,
+      undefined,
+      `${ROUTES.auth.attach({ code: "QWERTY" })}`,
+      PATHS.auth.attach,
+    );
+
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+  });
 });
diff --git a/src/features/attach/components/OTPInputContainer/OTPInputContainer.tsx b/src/features/attach/components/OTPInputContainer/OTPInputContainer.tsx
index c557aab2e..7d0b48370 100644
--- a/src/features/attach/components/OTPInputContainer/OTPInputContainer.tsx
+++ b/src/features/attach/components/OTPInputContainer/OTPInputContainer.tsx
@@ -24,7 +24,7 @@ const OTPInputContainer: FC = () => {
 
   const formik = useFormik<FormikProps>({
     initialValues: {
-      code: Object.assign(Array(OTP_LENGTH).fill(""), code?.split("") || []),
+      code: Object.assign(Array(OTP_LENGTH).fill(""), code.split("")),
     },
     validationSchema: Yup.object().shape({
       code: Yup.array().test(
diff --git a/src/features/auth/helpers.test.ts b/src/features/auth/helpers.test.ts
new file mode 100644
index 000000000..d4f2b664d
--- /dev/null
+++ b/src/features/auth/helpers.test.ts
@@ -0,0 +1,76 @@
+import { afterEach, describe, expect, it, vi } from "vitest";
+import { ROUTES } from "@/libs/routes";
+import {
+  getProviderIcon,
+  getSameOriginPath,
+  getSameOriginUrl,
+  redirectToExternalUrl,
+} from "./helpers";
+
+describe("auth helpers", () => {
+  afterEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  it("uses location.assign by default for external redirects", () => {
+    const assignSpy = vi.fn();
+    const replaceSpy = vi.fn();
+
+    vi.spyOn(window, "location", "get").mockReturnValue({
+      ...window.location,
+      assign: assignSpy,
+      replace: replaceSpy,
+    });
+
+    const targetUrl = "https://example.com/login";
+    redirectToExternalUrl(targetUrl);
+
+    expect(assignSpy).toHaveBeenCalledWith(targetUrl);
+  });
+
+  it("uses location.replace when replace option is set", () => {
+    const assignSpy = vi.fn();
+    const replaceSpy = vi.fn();
+
+    vi.spyOn(window, "location", "get").mockReturnValue({
+      ...window.location,
+      assign: assignSpy,
+      replace: replaceSpy,
+    });
+
+    const targetUrl = "https://example.com/login";
+    redirectToExternalUrl(targetUrl, { replace: true });
+
+    expect(replaceSpy).toHaveBeenCalledWith(targetUrl);
+  });
+
+  it("returns null for missing and cross-origin inputs", () => {
+    expect(getSameOriginUrl()).toBeNull();
+    expect(getSameOriginUrl("https://google.com")).toBeNull();
+    expect(getSameOriginUrl("http://%")).toBeNull();
+  });
+
+  it("resolves same-origin relative URLs", () => {
+    const input = `${ROUTES.settings.root({ tab: "users" })}#top`;
+    const parsed = getSameOriginUrl(input);
+
+    expect(parsed).toBeInstanceOf(URL);
+    expect(parsed?.pathname).toBe(ROUTES.settings.root());
+    expect(parsed?.search).toBe("?tab=users");
+    expect(parsed?.hash).toBe("#top");
+  });
+
+  it("returns same-origin path with query and hash", () => {
+    const input = `${ROUTES.settings.root({ tab: "users" })}#top`;
+
+    expect(getSameOriginPath(input)).toBe(
+      `${ROUTES.settings.root({ tab: "users" })}#top`,
+    );
+    expect(getSameOriginPath("https://example.com/outside")).toBeNull();
+  });
+
+  it("falls back to the default provider icon for unknown providers", () => {
+    expect(getProviderIcon("okta")).toBe("okta");
+    expect(getProviderIcon("unknown-provider")).toBe("connected");
+  });
+});
diff --git a/src/features/autoinstall-files/components/AutoinstallFileForm/AutoinstallFileForm.test.tsx b/src/features/autoinstall-files/components/AutoinstallFileForm/AutoinstallFileForm.test.tsx
index 10b0eca09..49a119032 100644
--- a/src/features/autoinstall-files/components/AutoinstallFileForm/AutoinstallFileForm.test.tsx
+++ b/src/features/autoinstall-files/components/AutoinstallFileForm/AutoinstallFileForm.test.tsx
@@ -1,22 +1,27 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
 import { ADD_AUTOINSTALL_FILE_NOTIFICATION } from "@/pages/dashboard/settings/employees/tabs/autoinstall-files";
 import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
+import { screen, within } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
 import type { ComponentProps } from "react";
-import { describe } from "vitest";
+import { beforeEach, describe, expect, vi } from "vitest";
 import AutoinstallFileForm from "./AutoinstallFileForm";
 import { DEFAULT_FILE } from "./constants";
 
 describe("AutoinstallFileForm", () => {
-  const createAutoinstallFileProps: ComponentProps<typeof AutoinstallFileForm> =
-    {
-      buttonText: "Add",
-      description: "Add an autoinstall file.",
-      initialFile: DEFAULT_FILE,
-      notification: ADD_AUTOINSTALL_FILE_NOTIFICATION,
-      onSubmit: vi.fn(),
-    };
-
-  const editAutoinstallFileProps: ComponentProps<typeof AutoinstallFileForm> = {
+  const createAutoinstallFileProps = (): ComponentProps<
+    typeof AutoinstallFileForm
+  > => ({
+    buttonText: "Add",
+    description: "Add an autoinstall file.",
+    initialFile: DEFAULT_FILE,
+    notification: ADD_AUTOINSTALL_FILE_NOTIFICATION,
+    onSubmit: vi.fn(async () => undefined),
+  });
+
+  const editAutoinstallFileProps = (): ComponentProps<
+    typeof AutoinstallFileForm
+  > => ({
     buttonText: "Save changes",
     description: `The duplicated file will be assigned to the same user groups in the identity provider as the original file.`,
     initialFile: {
@@ -25,11 +30,27 @@ describe("AutoinstallFileForm", () => {
       is_default: false,
     },
     notification: ADD_AUTOINSTALL_FILE_NOTIFICATION,
-    onSubmit: vi.fn(),
-  };
+    onSubmit: vi.fn(async () => undefined),
+  });
+
+  const createAutoinstallFileWithContentsProps = (): ComponentProps<
+    typeof AutoinstallFileForm
+  > => ({
+    ...createAutoinstallFileProps(),
+    initialFile: {
+      ...DEFAULT_FILE,
+      contents: "#cloud-config\nusers:\n  - name: ubuntu",
+    },
+  });
+
+  beforeEach(() => {
+    setEndpointStatus("default");
+  });
 
   it("should not render default checkbox when editing", () => {
-    renderWithProviders(<AutoinstallFileForm {...editAutoinstallFileProps} />);
+    renderWithProviders(
+      <AutoinstallFileForm {...editAutoinstallFileProps()} />,
+    );
     expect(
       screen.queryByRole("checkbox", { name: "Default" }),
     ).not.toBeInTheDocument();
@@ -42,18 +63,215 @@ describe("AutoinstallFileForm", () => {
   });
 
   it("should show a disabled button when first creating a form", async () => {
-    renderWithProviders(
-      <AutoinstallFileForm {...createAutoinstallFileProps} />,
-    );
+    const props = createAutoinstallFileProps();
+    renderWithProviders(<AutoinstallFileForm {...props} />);
 
     expect(
       screen.getByRole("checkbox", { name: "Default" }),
     ).toBeInTheDocument();
 
     const submitButton = screen.getByRole("button", {
-      name: createAutoinstallFileProps.buttonText,
+      name: props.buttonText,
     });
 
     expect(submitButton).toHaveAttribute("aria-disabled", "true");
   });
+
+  it("populates filename from uploaded file when creating", async () => {
+    const props = createAutoinstallFileProps();
+    const user = userEvent.setup();
+    const file = new File(["#cloud-config\nusers: []"], "custom-config.yaml", {
+      type: "text/yaml",
+    });
+
+    renderWithProviders(<AutoinstallFileForm {...props} />);
+
+    const fileInput = screen.getByTestId("autoinstall-upload-input");
+
+    await user.upload(fileInput, file);
+
+    expect(screen.getByRole("textbox", { name: "File name" })).toHaveValue(
+      "custom-config",
+    );
+    expect(screen.getByRole("button", { name: "Add" })).not.toHaveAttribute(
+      "aria-disabled",
+      "true",
+    );
+  });
+
+  it("keeps existing filename when uploading a file", async () => {
+    const props = createAutoinstallFileProps();
+    const user = userEvent.setup();
+    const file = new File(["#cloud-config\npackage_update: true"], "new.yaml", {
+      type: "text/yaml",
+    });
+
+    renderWithProviders(<AutoinstallFileForm {...props} />);
+
+    const fileNameInput = screen.getByRole("textbox", { name: "File name" });
+    await user.type(fileNameInput, "custom-file-name");
+
+    await user.upload(screen.getByTestId("autoinstall-upload-input"), file);
+
+    expect(fileNameInput).toHaveValue("custom-file-name");
+  });
+
+  it("enables submit when content differs from initial file content", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <AutoinstallFileForm {...createAutoinstallFileWithContentsProps()} />,
+    );
+
+    expect(screen.getByRole("button", { name: "Add" })).toHaveAttribute(
+      "aria-disabled",
+      "true",
+    );
+
+    await user.type(screen.getByTestId("mock-monaco"), "\n# changed");
+
+    expect(screen.getByRole("button", { name: "Add" })).not.toHaveAttribute(
+      "aria-disabled",
+      "true",
+    );
+  });
+
+  it("submits successfully after validation", async () => {
+    const user = userEvent.setup();
+    const props = createAutoinstallFileProps();
+    renderWithProviders(<AutoinstallFileForm {...props} />);
+
+    await user.type(screen.getByRole("textbox", { name: "File name" }), "base");
+    await user.type(screen.getByTestId("mock-monaco"), "#cloud-config");
+    await user.click(screen.getByRole("button", { name: "Add" }));
+
+    expect(props.onSubmit).toHaveBeenCalledWith({
+      accept_warning: false,
+      contents: "#cloud-config",
+      filename: "base.yaml",
+      is_default: false,
+    });
+  });
+
+  it("handles submit errors from creating file", async () => {
+    const user = userEvent.setup();
+    const onSubmit = vi.fn(async () => {
+      throw new Error("submit failed");
+    });
+    const props = { ...createAutoinstallFileProps(), onSubmit };
+    renderWithProviders(<AutoinstallFileForm {...props} />);
+
+    await user.type(screen.getByRole("textbox", { name: "File name" }), "base");
+    await user.type(screen.getByTestId("mock-monaco"), "#cloud-config");
+    await user.click(screen.getByRole("button", { name: "Add" }));
+
+    expect(onSubmit).toHaveBeenCalledWith({
+      accept_warning: false,
+      contents: "#cloud-config",
+      filename: "base.yaml",
+      is_default: false,
+    });
+    expect(await screen.findByText("submit failed")).toBeInTheDocument();
+  });
+
+  it("handles validation errors that are not override warnings", async () => {
+    const user = userEvent.setup();
+    const props = createAutoinstallFileProps();
+    setEndpointStatus({ status: "error", path: "autoinstall:validate" });
+    renderWithProviders(<AutoinstallFileForm {...props} />);
+
+    await user.type(screen.getByRole("textbox", { name: "File name" }), "base");
+    await user.type(screen.getByTestId("mock-monaco"), "#cloud-config");
+    await user.click(screen.getByRole("button", { name: "Add" }));
+
+    expect(props.onSubmit).not.toHaveBeenCalled();
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+  });
+
+  it("shows override modal and submits when confirmed", async () => {
+    const user = userEvent.setup();
+    const props = createAutoinstallFileProps();
+    setEndpointStatus({
+      status: "error",
+      path: "autoinstall:validate-override",
+    });
+    renderWithProviders(<AutoinstallFileForm {...props} />);
+
+    await user.type(screen.getByRole("textbox", { name: "File name" }), "base");
+    await user.type(screen.getByTestId("mock-monaco"), "#cloud-config");
+    await user.click(screen.getByRole("button", { name: "Add" }));
+
+    expect(
+      await screen.findByRole("heading", { name: "Override autoinstall file" }),
+    ).toBeInTheDocument();
+    expect(screen.getByText("users")).toBeInTheDocument();
+    expect(screen.getByText("identity")).toBeInTheDocument();
+
+    await user.click(
+      screen.getByRole("button", { name: "Override and add file" }),
+    );
+
+    expect(props.onSubmit).toHaveBeenCalledWith({
+      accept_warning: true,
+      contents: "#cloud-config",
+      filename: "base.yaml",
+      is_default: false,
+    });
+  });
+
+  it("hides override modal when canceled", async () => {
+    const user = userEvent.setup();
+    const props = createAutoinstallFileProps();
+    setEndpointStatus({
+      status: "error",
+      path: "autoinstall:validate-override",
+    });
+    renderWithProviders(<AutoinstallFileForm {...props} />);
+
+    await user.type(screen.getByRole("textbox", { name: "File name" }), "base");
+    await user.type(screen.getByTestId("mock-monaco"), "#cloud-config");
+    await user.click(screen.getByRole("button", { name: "Add" }));
+
+    const dialog = await screen.findByRole("dialog", {
+      name: "Override autoinstall file",
+    });
+    await user.click(within(dialog).getByRole("button", { name: "Cancel" }));
+
+    expect(
+      screen.queryByRole("heading", { name: "Override autoinstall file" }),
+    ).not.toBeInTheDocument();
+  });
+
+  it("opens hidden file input when clicking populate from file", async () => {
+    const user = userEvent.setup();
+    const clickSpy = vi.spyOn(HTMLInputElement.prototype, "click");
+    const props = createAutoinstallFileProps();
+    renderWithProviders(<AutoinstallFileForm {...props} />);
+
+    await user.click(
+      screen.getByRole("button", { name: "Populate from file" }),
+    );
+
+    expect(clickSpy).toHaveBeenCalled();
+    clickSpy.mockRestore();
+  });
+
+  it("ignores empty file input change", async () => {
+    const user = userEvent.setup();
+    const props = createAutoinstallFileProps();
+    const file = new File(["#cloud-config\nusers: []"], "custom-config.yaml", {
+      type: "text/yaml",
+    });
+    renderWithProviders(<AutoinstallFileForm {...props} />);
+
+    const fileInput = screen.getByTestId("autoinstall-upload-input");
+    await user.upload(fileInput, file);
+    await user.upload(fileInput, []);
+
+    expect(screen.getByRole("textbox", { name: "File name" })).toHaveValue(
+      "custom-config",
+    );
+  });
 });
diff --git a/src/features/autoinstall-files/components/AutoinstallFileForm/AutoinstallFileForm.tsx b/src/features/autoinstall-files/components/AutoinstallFileForm/AutoinstallFileForm.tsx
index 9ce95ae62..f68933949 100644
--- a/src/features/autoinstall-files/components/AutoinstallFileForm/AutoinstallFileForm.tsx
+++ b/src/features/autoinstall-files/components/AutoinstallFileForm/AutoinstallFileForm.tsx
@@ -185,6 +185,7 @@ const AutoinstallFileForm: FC<AutoinstallFileFormProps> = ({
         ref={inputRef}
         className="u-hide"
         type="file"
+        data-testid="autoinstall-upload-input"
         accept={AUTOINSTALL_FILE_LANGUAGES.map(
           (language) => `.${language}`,
         ).join(",")}
diff --git a/src/features/employees/components/EmployeeDropdown/EmployeeDropdown.test.tsx b/src/features/employees/components/EmployeeDropdown/EmployeeDropdown.test.tsx
index eab9a654b..77db64613 100644
--- a/src/features/employees/components/EmployeeDropdown/EmployeeDropdown.test.tsx
+++ b/src/features/employees/components/EmployeeDropdown/EmployeeDropdown.test.tsx
@@ -1,53 +1,199 @@
 import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
+import { setEndpointStatus } from "@/tests/controllers/controller";
+import { screen, waitFor } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import type { ComponentProps } from "react";
-import { describe, expect, vi } from "vitest";
+import { beforeEach, describe, expect, vi } from "vitest";
+import { PATHS, ROUTES } from "@/libs/routes";
 import EmployeeDropdown from "./EmployeeDropdown";
 import { employees as mockEmployees } from "@/tests/mocks/employees";
 
-const props: ComponentProps<typeof EmployeeDropdown> = {
+const baseProps: ComponentProps<typeof EmployeeDropdown> = {
   employee: null,
   setEmployee: vi.fn(),
   error: undefined,
 };
 
 describe("EmployeeDropdown", () => {
-  beforeEach(async () => {
-    renderWithProviders(
-      <EmployeeDropdown {...props} />,
-      undefined,
-      "/instances/1",
-      "instances/:instanceId",
-    );
-  });
+  describe("component", () => {
+    beforeEach(() => {
+      setEndpointStatus("default");
+    });
 
-  it("renders employee dropdown search component", () => {
-    const searchBox = screen.getByRole("searchbox");
-    expect(searchBox).toBeInTheDocument();
-  });
+    const renderDropdown = (
+      overrideProps?: Partial<ComponentProps<typeof EmployeeDropdown>>,
+    ) => {
+      return renderWithProviders(
+        <EmployeeDropdown {...baseProps} {...overrideProps} />,
+        undefined,
+        ROUTES.instances.details.single(1),
+        `/${PATHS.instances.root}/${PATHS.instances.single}`,
+      );
+    };
+
+    it("renders employee dropdown search component", () => {
+      renderDropdown();
+      expect(screen.getByRole("searchbox")).toBeInTheDocument();
+    });
 
-  describe("employee selection flow", () => {
     it("shows matching employees after searching", async () => {
+      renderDropdown();
+
       const searchBox = screen.getByRole("searchbox");
       await userEvent.type(searchBox, "John");
       expect(searchBox).toHaveValue("John");
 
       const employees = await screen.findAllByText("John");
-      const matchinEmployees = mockEmployees.filter((employee) =>
+      const matchingEmployees = mockEmployees.filter((employee) =>
         employee.name.includes("John"),
       );
-      //expected length 2, since John Smith and John Doe should be returned
-      expect(employees).toHaveLength(matchinEmployees.length);
+      expect(employees).toHaveLength(matchingEmployees.length);
     });
 
     it("shows error if no matching employees found", async () => {
+      renderDropdown();
+
       const searchBox = screen.getByRole("searchbox");
       await userEvent.type(searchBox, "checking for error");
       expect(searchBox).toHaveValue("checking for error");
 
-      const errorText = await screen.findByText(/No employees found by/i);
-      expect(errorText).toBeVisible();
+      expect(await screen.findByText(/No employees found by/i)).toBeVisible();
+    });
+
+    it("allows removing selected employee", async () => {
+      const setEmployee = vi.fn();
+      renderDropdown({ employee: mockEmployees[0], setEmployee });
+
+      await userEvent.click(screen.getByRole("button", { name: /remove/i }));
+
+      expect(setEmployee).toHaveBeenCalledWith(null);
+    });
+
+    it("keeps dropdown open and resets search when clear button is used", async () => {
+      const user = userEvent.setup();
+      renderDropdown();
+
+      const searchBox = screen.getByRole("searchbox");
+      await user.type(searchBox, "John");
+      await user.click(
+        screen.getByRole("button", { name: /clear search field/i }),
+      );
+
+      expect(searchBox).toHaveValue("");
+      expect(
+        await screen.findByText(mockEmployees[0]?.name ?? "John Doe"),
+      ).toBeInTheDocument();
+    });
+
+    it("handles selecting an employee from the list", async () => {
+      const user = userEvent.setup();
+      const setEmployee = vi.fn();
+      renderDropdown({ setEmployee });
+
+      await user.type(screen.getByRole("searchbox"), "John");
+      const [firstEmployeeOption] =
+        await screen.findAllByTestId("dropdownElement");
+      assert(firstEmployeeOption);
+      await user.click(firstEmployeeOption);
+
+      expect(setEmployee).toHaveBeenCalledWith(mockEmployees[0]);
+      expect(screen.getByRole("searchbox")).toHaveValue("");
+    });
+
+    it("loads more results when suggestion list is scrolled near bottom", async () => {
+      const user = userEvent.setup();
+      renderDropdown();
+
+      const searchBox = screen.getByRole("searchbox");
+      await user.type(searchBox, "a");
+
+      const list = await screen.findByRole("listbox");
+      Object.defineProperty(list, "scrollHeight", {
+        configurable: true,
+        value: 120,
+      });
+      Object.defineProperty(list, "clientHeight", {
+        configurable: true,
+        value: 80,
+      });
+      Object.defineProperty(list, "scrollTop", {
+        configurable: true,
+        value: 30,
+      });
+
+      list.dispatchEvent(new Event("scroll"));
+
+      await waitFor(async () => {
+        expect((await screen.findAllByTestId("dropdownElement")).length).toBe(
+          2,
+        );
+      });
+    });
+
+    it("shows next-page loading indicator while fetching additional results", async () => {
+      const user = userEvent.setup();
+      setEndpointStatus({
+        status: "default",
+        path: "employees:next-page-loading",
+      });
+      renderDropdown();
+
+      await user.type(screen.getByRole("searchbox"), "a");
+      const list = await screen.findByRole("listbox");
+
+      Object.defineProperty(list, "scrollHeight", {
+        configurable: true,
+        value: 100,
+      });
+      Object.defineProperty(list, "clientHeight", {
+        configurable: true,
+        value: 80,
+      });
+      Object.defineProperty(list, "scrollTop", {
+        configurable: true,
+        value: 30,
+      });
+
+      list.dispatchEvent(new Event("scroll"));
+
+      expect(await screen.findByText("Loading...")).toBeInTheDocument();
+    });
+
+    it("does not fetch next page when there is no next page", async () => {
+      const user = userEvent.setup();
+      renderDropdown();
+
+      await user.type(screen.getByRole("searchbox"), "a");
+      const list = await screen.findByRole("listbox");
+      const initialSuggestionCount = (
+        await screen.findAllByTestId("dropdownElement")
+      ).length;
+
+      Object.defineProperty(list, "scrollHeight", {
+        configurable: true,
+        value: 100,
+      });
+      Object.defineProperty(list, "clientHeight", {
+        configurable: true,
+        value: 80,
+      });
+      Object.defineProperty(list, "scrollTop", {
+        configurable: true,
+        value: 0,
+      });
+
+      list.dispatchEvent(new Event("scroll"));
+
+      await waitFor(async () => {
+        expect((await screen.findAllByTestId("dropdownElement")).length).toBe(
+          initialSuggestionCount,
+        );
+      });
+    });
+
+    it("renders field-level error text", () => {
+      renderDropdown({ error: "Employee is required" });
+      expect(screen.getByText("Employee is required")).toBeInTheDocument();
     });
   });
 });
diff --git a/src/features/gpg-keys/components/NewGPGKeyForm/NewGPGKeyForm.test.tsx b/src/features/gpg-keys/components/NewGPGKeyForm/NewGPGKeyForm.test.tsx
index 9abfbb231..2d435e279 100644
--- a/src/features/gpg-keys/components/NewGPGKeyForm/NewGPGKeyForm.test.tsx
+++ b/src/features/gpg-keys/components/NewGPGKeyForm/NewGPGKeyForm.test.tsx
@@ -1,5 +1,7 @@
 import { renderWithProviders } from "@/tests/render";
 import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { setEndpointStatus } from "@/tests/controllers/controller";
 import NewGPGKeyForm from "./NewGPGKeyForm";
 
 describe("NewGPGKeyForm", () => {
@@ -13,4 +15,96 @@ describe("NewGPGKeyForm", () => {
     });
     expect(addGPGKeyButton).toBeInTheDocument();
   });
+
+  it("shows required validation errors when submitting empty form", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<NewGPGKeyForm />);
+
+    await user.click(screen.getByRole("button", { name: /import key/i }));
+
+    expect(await screen.findAllByText("This field is required")).toHaveLength(
+      2,
+    );
+  });
+
+  it("validates name format", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<NewGPGKeyForm />);
+
+    await user.type(
+      screen.getByRole("textbox", { name: "Name" }),
+      "Invalid_Name",
+    );
+    await user.type(screen.getByRole("textbox", { name: "Material" }), "ABC");
+    await user.click(screen.getByRole("button", { name: /import key/i }));
+
+    expect(
+      await screen.findByText(
+        "It has to start with an alphanumeric character and only contain lowercase letters, numbers and - or + signs.",
+      ),
+    ).toBeInTheDocument();
+  });
+
+  it("validates duplicate key name", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<NewGPGKeyForm />);
+
+    await user.type(screen.getByRole("textbox", { name: "Name" }), "sign-key");
+    await user.type(screen.getByRole("textbox", { name: "Material" }), "ABC");
+    await user.click(screen.getByRole("button", { name: /import key/i }));
+
+    expect(
+      await screen.findByText("It must be unique within the account."),
+    ).toBeInTheDocument();
+  });
+
+  it("allows unique names when existing keys cannot be loaded", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "empty", path: "gpgKey" });
+
+    renderWithProviders(<NewGPGKeyForm />);
+
+    await user.type(screen.getByRole("textbox", { name: "Name" }), "sign-key");
+    await user.type(screen.getByRole("textbox", { name: "Material" }), "ABC");
+    await user.click(screen.getByRole("button", { name: /import key/i }));
+
+    expect(
+      screen.queryByText("It must be unique within the account."),
+    ).not.toBeInTheDocument();
+  });
+
+  it("submits successfully", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<NewGPGKeyForm />);
+
+    await user.type(screen.getByRole("textbox", { name: "Name" }), "newkey");
+    await user.type(screen.getByRole("textbox", { name: "Material" }), "ABC");
+    await user.click(screen.getByRole("button", { name: /import key/i }));
+
+    expect(
+      screen.queryByText("This field is required"),
+    ).not.toBeInTheDocument();
+    expect(
+      screen.queryByText("It has to start with an alphanumeric character"),
+    ).not.toBeInTheDocument();
+  });
+
+  it("shows endpoint error", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "error", path: "importGpgKey" });
+
+    renderWithProviders(<NewGPGKeyForm />);
+
+    await user.type(screen.getByRole("textbox", { name: "Name" }), "newkey2");
+    await user.type(screen.getByRole("textbox", { name: "Material" }), "ABC");
+    await user.click(screen.getByRole("button", { name: /import key/i }));
+
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+  });
 });
diff --git a/src/features/kernel/components/KernelOverview/helpers.test.ts b/src/features/kernel/components/KernelOverview/helpers.test.ts
new file mode 100644
index 000000000..f54a16b27
--- /dev/null
+++ b/src/features/kernel/components/KernelOverview/helpers.test.ts
@@ -0,0 +1,104 @@
+import { DISPLAY_DATE_FORMAT } from "@/constants";
+import moment from "moment";
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import {
+  getLivepatchCoverageDisplayValue,
+  getLivepatchCoverageIcon,
+  getStatusIcon,
+  getStatusTooltipMessage,
+} from "./helpers";
+
+const NOW = new Date("2026-04-02T12:00:00Z");
+const TWO_DAYS = 2;
+const TEN_DAYS = 10;
+
+describe("KernelOverview helpers", () => {
+  beforeEach(() => {
+    vi.useFakeTimers();
+    vi.setSystemTime(NOW);
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+  });
+
+  it("builds upgrade tooltip with formatted expiry date when valid", () => {
+    const expiry = "2026-04-12T00:00:00Z";
+
+    expect(
+      getStatusTooltipMessage("Kernel upgrade available", expiry),
+    ).toContain(
+      `covered by Livepatch until ${moment(expiry).format(DISPLAY_DATE_FORMAT)}`,
+    );
+  });
+
+  it("omits expiry details for invalid kernel-upgrade dates", () => {
+    expect(
+      getStatusTooltipMessage("Kernel upgrade available", "bad-date"),
+    ).toBe("A new kernel version is available.");
+  });
+
+  it("returns status icons for known and unknown statuses", () => {
+    expect(getStatusIcon("Patched by Livepatch")).toBe(
+      "status-succeeded-small",
+    );
+    expect(getStatusIcon("Fully patched")).toBe("status-succeeded-small");
+    expect(getStatusIcon("Kernel upgrade available")).toBe(
+      "status-succeeded-small",
+    );
+    expect(getStatusIcon("Restart required")).toBe("status-waiting-small");
+    expect(getStatusIcon("End of life")).toBe("status-failed-small");
+    expect(getStatusIcon("Unknown")).toBe("status-failed-small");
+  });
+
+  it("returns tooltip messages for all non-upgrade statuses and unknown states", () => {
+    expect(getStatusTooltipMessage("Fully patched", "")).toBe(
+      "All available kernel security patches have been applied. You have no pending patches.",
+    );
+    expect(getStatusTooltipMessage("Restart required", "")).toBe(
+      "Low and/or medium patches have been installed. You must restart to complete patching.",
+    );
+    expect(getStatusTooltipMessage("End of life", "")).toBe(
+      "The kernel is no longer covered by Livepatch. It is not getting high and critical security patches.",
+    );
+    expect(getStatusTooltipMessage("Livepatch disabled", "")).toBe(
+      "Livepatch is disabled. Kernel patches will not be applied automatically until you enabled Livepatch.",
+    );
+    expect(getStatusTooltipMessage("Unexpected", "")).toBe(
+      "There was an error getting the status.",
+    );
+  });
+
+  it("computes livepatch coverage icons by enablement and expiry window", () => {
+    const soonExpiry = moment(NOW).add(TWO_DAYS, "days").toISOString();
+    const laterExpiry = moment(NOW).add(TEN_DAYS, "days").toISOString();
+    const expired = moment(NOW).subtract(1, "day").toISOString();
+
+    expect(getLivepatchCoverageIcon(true, soonExpiry)).toBe(
+      "status-waiting-small",
+    );
+    expect(getLivepatchCoverageIcon(true, laterExpiry)).toBe(
+      "status-succeeded-small",
+    );
+    expect(getLivepatchCoverageIcon(true, expired)).toBe("status-failed-small");
+    expect(getLivepatchCoverageIcon(false, laterExpiry)).toBe(
+      "status-failed-small",
+    );
+    expect(getLivepatchCoverageIcon(true, "not-a-date")).toBe(
+      "status-failed-small",
+    );
+  });
+
+  it("computes display value for disabled, expired, and active coverage", () => {
+    const laterExpiry = moment(NOW).add(TEN_DAYS, "days").toISOString();
+    const expired = moment(NOW).subtract(1, "day").toISOString();
+
+    expect(getLivepatchCoverageDisplayValue(false, laterExpiry)).toBe(
+      "Livepatch is disabled",
+    );
+    expect(getLivepatchCoverageDisplayValue(true, expired)).toBe("Expired");
+    expect(getLivepatchCoverageDisplayValue(true, laterExpiry)).toBe(
+      `Expires on ${moment(laterExpiry).format(DISPLAY_DATE_FORMAT)}`,
+    );
+  });
+});
diff --git a/src/features/kernel/components/RestartInstanceForm/RestartInstanceForm.test.tsx b/src/features/kernel/components/RestartInstanceForm/RestartInstanceForm.test.tsx
index 29688d580..f6cc1eb6f 100644
--- a/src/features/kernel/components/RestartInstanceForm/RestartInstanceForm.test.tsx
+++ b/src/features/kernel/components/RestartInstanceForm/RestartInstanceForm.test.tsx
@@ -1,32 +1,39 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
+import { ENDPOINT_STATUS_API_ERROR_MESSAGE } from "@/tests/server/handlers/_constants";
 import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
+import { screen, within } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
+import type { ComponentProps } from "react";
+import { PATHS, ROUTES } from "@/libs/routes";
 import RestartInstanceForm from "./RestartInstanceForm";
 
-describe("UpgradeKernelForm", () => {
-  it("renders notification message", () => {
-    renderWithProviders(
-      <RestartInstanceForm showNotification instanceName="test-instance" />,
-    );
+const props: ComponentProps<typeof RestartInstanceForm> = {
+  showNotification: true,
+  instanceName: "test-instance",
+};
+const INSTANCE_ID = 11;
+
+describe("RestartInstanceForm", () => {
+  beforeEach(() => {
+    setEndpointStatus("default");
+  });
+
+  it("renders notification when restart is recommended", () => {
+    renderWithProviders(<RestartInstanceForm {...props} />);
     expect(screen.getByText(/restart recommended/i)).toBeVisible();
   });
 
-  it("renders notification message", () => {
+  it("does not render notification when restart is not recommended", () => {
     renderWithProviders(
-      <RestartInstanceForm
-        showNotification={false}
-        instanceName="test-instance"
-      />,
+      <RestartInstanceForm {...props} showNotification={false} />,
     );
     expect(screen.queryByText(/restart recommended/i)).toBeNull();
   });
 
-  it("radio button functionalities", async () => {
+  it("shows randomization input when enabling random delivery", async () => {
+    const user = userEvent.setup();
     renderWithProviders(
-      <RestartInstanceForm
-        showNotification={false}
-        instanceName="test-instance"
-      />,
+      <RestartInstanceForm {...props} showNotification={false} />,
     );
 
     const instantDeliveryTimeRadioOption = screen.getByLabelText(
@@ -42,7 +49,101 @@ describe("UpgradeKernelForm", () => {
     expect(randomizeDeliveryTrueOption).not.toBeChecked();
     expect(randomizeDeliveryFalseOption).toBeChecked();
 
-    await userEvent.click(randomizeDeliveryTrueOption);
+    await user.click(randomizeDeliveryTrueOption);
     expect(screen.getByText(/time in minutes/i)).toBeVisible();
   });
+
+  it("shows upgrade and restart action only when kernel id is provided", () => {
+    const { rerender } = renderWithProviders(
+      <RestartInstanceForm {...props} newKernelVersionId={123} />,
+    );
+
+    expect(
+      screen.getByRole("button", { name: "Upgrade and Restart" }),
+    ).toBeInTheDocument();
+
+    rerender(<RestartInstanceForm {...props} />);
+
+    expect(
+      screen.queryByRole("button", { name: "Upgrade and Restart" }),
+    ).not.toBeInTheDocument();
+  });
+
+  it("submits restart and shows a success notification", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <RestartInstanceForm {...props} showNotification={false} />,
+      undefined,
+      ROUTES.instances.details.single(INSTANCE_ID),
+      `/${PATHS.instances.root}/${PATHS.instances.single}`,
+    );
+
+    await user.click(screen.getByRole("button", { name: "Restart" }));
+
+    const dialog = screen.getByRole("dialog", { name: "Restarting instance" });
+    await user.click(within(dialog).getByRole("button", { name: "Restart" }));
+
+    expect(
+      await screen.findByText('You queued "test-instance" to be restarted.'),
+    ).toBeInTheDocument();
+
+    await user.click(screen.getByRole("button", { name: "View details" }));
+
+    expect(
+      await screen.findByRole("heading", { name: "Start instance Bionic WSL" }),
+    ).toBeInTheDocument();
+  });
+
+  it("submits upgrade and restart and shows a success notification", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <RestartInstanceForm {...props} newKernelVersionId={123} />,
+      undefined,
+      ROUTES.instances.details.single(INSTANCE_ID),
+      `/${PATHS.instances.root}/${PATHS.instances.single}`,
+    );
+
+    await user.click(
+      screen.getByRole("button", { name: "Upgrade and Restart" }),
+    );
+
+    const dialog = screen.getByRole("dialog", {
+      name: "Upgrading kernel and restarting instance",
+    });
+    await user.click(
+      within(dialog).getByRole("button", { name: "Upgrade and Restart" }),
+    );
+
+    expect(
+      await screen.findByText('You queued kernel upgrade for "test-instance"'),
+    ).toBeInTheDocument();
+
+    await user.click(screen.getByRole("button", { name: "View details" }));
+
+    expect(
+      await screen.findByRole("heading", { name: "Start instance Bionic WSL" }),
+    ).toBeInTheDocument();
+  });
+
+  it("shows an error notification when restart fails", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus("error");
+
+    renderWithProviders(
+      <RestartInstanceForm {...props} showNotification={false} />,
+      undefined,
+      ROUTES.instances.details.single(INSTANCE_ID),
+      `/${PATHS.instances.root}/${PATHS.instances.single}`,
+    );
+
+    await user.click(screen.getByRole("button", { name: "Restart" }));
+    const dialog = screen.getByRole("dialog", { name: "Restarting instance" });
+    await user.click(within(dialog).getByRole("button", { name: "Restart" }));
+
+    expect(
+      await screen.findByText(ENDPOINT_STATUS_API_ERROR_MESSAGE),
+    ).toBeInTheDocument();
+  });
 });
diff --git a/src/features/mirrors/components/EditPocketForm/EditPocketForm.test.tsx b/src/features/mirrors/components/EditPocketForm/EditPocketForm.test.tsx
index 8c094ab30..6910bf14a 100644
--- a/src/features/mirrors/components/EditPocketForm/EditPocketForm.test.tsx
+++ b/src/features/mirrors/components/EditPocketForm/EditPocketForm.test.tsx
@@ -1,6 +1,8 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
 import { pockets } from "@/tests/mocks/pockets";
 import { renderWithProviders } from "@/tests/render";
 import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
 import type { ComponentProps } from "react";
 import { DEFAULT_SNAPSHOT_URI } from "../../constants";
 import EditPocketForm from "./EditPocketForm";
@@ -22,6 +24,31 @@ const uploadPocketProps: ComponentProps<typeof EditPocketForm> = {
   seriesName: "Focal Fossa",
   pocket: uploadPocket,
 };
+const uploadPocketAllowUnsignedProps: ComponentProps<typeof EditPocketForm> = {
+  distributionName: "Ubuntu",
+  seriesName: "Focal Fossa",
+  pocket: {
+    ...uploadPocket,
+    upload_allow_unsigned: true,
+  },
+};
+
+const uploadPocketWithKnownGpgKeysProps: ComponentProps<typeof EditPocketForm> =
+  {
+    distributionName: "Ubuntu",
+    seriesName: "Focal Fossa",
+    pocket: {
+      ...uploadPocket,
+      upload_gpg_keys: [
+        {
+          fingerprint: "",
+          id: 26,
+          has_secret: false,
+          name: "test-public",
+        },
+      ],
+    },
+  };
 
 const pullPocketWithFilterType = pockets.find(
   (p) => p.mode === "pull" && p.filter_type,
@@ -44,7 +71,16 @@ const pullPocketWithoutFilterTypeProps: ComponentProps<typeof EditPocketForm> =
     pocket: pullPocketWithoutFilterType,
   };
 
+const fillRequiredFields = async (user: ReturnType<typeof userEvent.setup>) => {
+  await user.click(screen.getByRole("checkbox", { name: "Main" }));
+  await user.click(screen.getByRole("checkbox", { name: "amd64" }));
+};
+
 describe("EditPocketForm", () => {
+  beforeEach(() => {
+    setEndpointStatus("default");
+  });
+
   it("renders form fields for mirror pocket", () => {
     const { container } = renderWithProviders(
       <EditPocketForm {...mirrorPocketProps} />,
@@ -118,4 +154,162 @@ describe("EditPocketForm", () => {
       }),
     ).toBeVisible();
   });
+
+  it("disables uploader gpg keys when unsigned uploads are allowed", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<EditPocketForm {...uploadPocketProps} />);
+
+    await user.click(
+      screen.getByRole("checkbox", {
+        name: "Allow uploaded packages to be unsigned",
+      }),
+    );
+
+    expect(
+      screen.getByRole("combobox", { name: "Uploader GPG keys" }),
+    ).toHaveAttribute("disabled");
+  });
+
+  it("normalizes filter package input by removing spaces", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<EditPocketForm {...pullPocketWithFilterTypeProps} />);
+
+    const filterInput = screen.getByRole("textbox", {
+      name: "Filter packages",
+    });
+
+    await user.clear(filterInput);
+    await user.type(filterInput, "  foo, bar ,baz ");
+
+    expect(filterInput).toHaveValue("foo,bar,baz");
+  });
+
+  it("updates checkbox groups", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<EditPocketForm {...mirrorPocketProps} />);
+
+    await fillRequiredFields(user);
+
+    expect(screen.getByRole("checkbox", { name: "Main" })).toBeChecked();
+    expect(screen.getByRole("checkbox", { name: "amd64" })).toBeChecked();
+  });
+
+  it("submits upload pocket changes and supports uploader gpg key selection", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<EditPocketForm {...uploadPocketProps} />);
+    await fillRequiredFields(user);
+
+    await user.click(
+      screen.getByRole("combobox", { name: "Uploader GPG keys" }),
+    );
+    await user.click(screen.getByRole("checkbox", { name: "test-public" }));
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
+  });
+
+  it("submits upload pocket changes when unsigned uploads are enabled", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<EditPocketForm {...uploadPocketProps} />);
+    await fillRequiredFields(user);
+
+    await user.click(
+      screen.getByRole("checkbox", {
+        name: "Allow uploaded packages to be unsigned",
+      }),
+    );
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
+  });
+
+  it("submits upload pocket with original allow-unsigned pocket data", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<EditPocketForm {...uploadPocketAllowUnsignedProps} />);
+    await fillRequiredFields(user);
+
+    await user.click(
+      screen.getByRole("checkbox", {
+        name: "Allow uploaded packages to be unsigned",
+      }),
+    );
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
+  });
+
+  it("submits upload pocket without uploader gpg key changes", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(
+      <EditPocketForm {...uploadPocketWithKnownGpgKeysProps} />,
+    );
+    await fillRequiredFields(user);
+
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
+  });
+
+  it("submits pull pocket changes with updated filter package list", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<EditPocketForm {...pullPocketWithFilterTypeProps} />);
+    await fillRequiredFields(user);
+
+    const filterInput = screen.getByRole("textbox", {
+      name: "Filter packages",
+    });
+    await user.clear(filterInput);
+    await user.type(filterInput, "alpha,beta");
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
+  });
+
+  it("submits pull pocket changes without modifying filters", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<EditPocketForm {...pullPocketWithFilterTypeProps} />);
+    await fillRequiredFields(user);
+
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
+  });
+
+  it("submits pull pocket without filter type", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(
+      <EditPocketForm {...pullPocketWithoutFilterTypeProps} />,
+    );
+    await fillRequiredFields(user);
+
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
+  });
+
+  it("submits mirror pocket changes", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<EditPocketForm {...mirrorPocketProps} />);
+    await fillRequiredFields(user);
+
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
+  });
+
+  it("shows notification when edit pocket submit fails", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "error", path: "EditPocket" });
+
+    renderWithProviders(<EditPocketForm {...mirrorPocketProps} />);
+    await fillRequiredFields(user);
+
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+  });
 });
diff --git a/src/features/mirrors/components/EditPocketForm/helpers.test.ts b/src/features/mirrors/components/EditPocketForm/helpers.test.ts
new file mode 100644
index 000000000..6bbbc04f5
--- /dev/null
+++ b/src/features/mirrors/components/EditPocketForm/helpers.test.ts
@@ -0,0 +1,132 @@
+import { describe, expect, it } from "vitest";
+import { pockets } from "@/tests/mocks/pockets";
+import type { Pocket } from "../../types";
+import {
+  getEditPocketParams,
+  getInitialValues,
+  getValidationSchema,
+} from "./helpers";
+import { INITIAL_VALUES } from "./constants";
+
+const mirrorPocket = pockets.find((pocket) => pocket.mode === "mirror");
+const uploadPocket = pockets.find((pocket) => pocket.mode === "upload");
+const pullPocket = pockets.find((pocket) => pocket.mode === "pull");
+
+assert(mirrorPocket);
+assert(uploadPocket);
+assert(pullPocket);
+
+describe("EditPocketForm helpers", () => {
+  it("enforces single component for mirror suite directories", async () => {
+    const schema = getValidationSchema("mirror");
+
+    await expect(
+      schema.validate({
+        ...INITIAL_VALUES,
+        name: "Pocket",
+        distribution: "Distribution",
+        series: "Series",
+        mirror_suite: "focal/",
+        components: ["main", "restricted"],
+        architectures: ["amd64"],
+      }),
+    ).rejects.toThrowError(/single component must be passed/i);
+
+    await expect(
+      schema.validate({
+        ...INITIAL_VALUES,
+        name: "Pocket",
+        distribution: "Distribution",
+        series: "Series",
+        mirror_suite: "focal/",
+        components: ["main"],
+        architectures: ["amd64"],
+      }),
+    ).resolves.toBeTruthy();
+  });
+
+  it("allows multiple components for non-mirror modes", async () => {
+    const schema = getValidationSchema("pull");
+
+    await expect(
+      schema.validate({
+        ...INITIAL_VALUES,
+        name: "Pocket",
+        distribution: "Distribution",
+        series: "Series",
+        components: ["main", "restricted"],
+        architectures: ["amd64"],
+      }),
+    ).resolves.toBeTruthy();
+  });
+
+  it("allows multiple components in mirror mode when suite is not a directory", async () => {
+    const schema = getValidationSchema("mirror");
+
+    await expect(
+      schema.validate({
+        ...INITIAL_VALUES,
+        name: "Pocket",
+        distribution: "Distribution",
+        series: "Series",
+        mirror_suite: "focal-updates",
+        components: ["main", "restricted"],
+        architectures: ["amd64"],
+      }),
+    ).resolves.toBeTruthy();
+  });
+
+  it("builds mode-specific initial values", () => {
+    const mirrorValues = getInitialValues("Dist", "Series", mirrorPocket);
+    const uploadValues = getInitialValues("Dist", "Series", uploadPocket);
+    const pullValues = getInitialValues("Dist", "Series", pullPocket);
+
+    expect(mirrorValues.mirror_uri).toBe(mirrorPocket.mirror_uri);
+    expect(mirrorValues.mirror_suite).toBe(mirrorPocket.mirror_suite);
+    expect(uploadValues.upload_allow_unsigned).toBe(
+      uploadPocket.upload_allow_unsigned,
+    );
+    expect(uploadValues.upload_gpg_keys).toEqual(
+      uploadPocket.upload_gpg_keys.map((key) => key.name),
+    );
+    expect(pullValues.filters).toEqual(pullPocket.filters);
+  });
+
+  it("falls back to empty key names when optional key objects are missing", () => {
+    const pocketWithoutKeys = {
+      ...mirrorPocket,
+      gpg_key: undefined,
+      mirror_gpg_key: undefined,
+    } as unknown as Pocket;
+
+    const values = getInitialValues("Dist", "Series", pocketWithoutKeys);
+
+    expect(values.gpg_key).toBe("");
+    expect(values.mirror_gpg_key).toBe("");
+  });
+
+  it("returns mode-specific edit params", () => {
+    const mirrorValues = getInitialValues("Dist", "Series", mirrorPocket);
+    const uploadValues = getInitialValues("Dist", "Series", uploadPocket);
+    const pullValues = getInitialValues("Dist", "Series", pullPocket);
+
+    const mirrorParams = getEditPocketParams(mirrorValues, "mirror");
+    const uploadParams = getEditPocketParams(uploadValues, "upload");
+    const pullParams = getEditPocketParams(pullValues, "pull");
+
+    expect(mirrorParams).toHaveProperty("mirror_uri");
+    expect(mirrorParams).toHaveProperty("mirror_suite");
+    expect(uploadParams).toHaveProperty("upload_allow_unsigned");
+    expect(pullParams).not.toHaveProperty("mirror_uri");
+    expect(pullParams).not.toHaveProperty("upload_allow_unsigned");
+  });
+
+  it("throws for invalid pocket mode when building edit params", () => {
+    expect(() =>
+      getEditPocketParams(
+        getInitialValues("Dist", "Series", pullPocket),
+        "invalid" as Pocket["mode"],
+      ),
+    ).toThrowError(/provided: invalid for pocket mode/i);
+  });
+});
diff --git a/src/features/mirrors/components/EditPocketForm/helpers.ts b/src/features/mirrors/components/EditPocketForm/helpers.ts
index fa25d2868..c96359725 100644
--- a/src/features/mirrors/components/EditPocketForm/helpers.ts
+++ b/src/features/mirrors/components/EditPocketForm/helpers.ts
@@ -28,7 +28,7 @@ export const getValidationSchema = (
         test: (value, context) => {
           const { mirror_suite } = context.parent;
 
-          if ("mirror" === mode && mirror_suite.endsWith("/")) {
+          if ("mirror" === mode && mirror_suite?.endsWith("/")) {
             return MIN_SELECTION_COUNT === value.length;
           }
 
diff --git a/src/features/mirrors/components/PackageList/PackageList.test.tsx b/src/features/mirrors/components/PackageList/PackageList.test.tsx
index 362bb2e68..172874086 100644
--- a/src/features/mirrors/components/PackageList/PackageList.test.tsx
+++ b/src/features/mirrors/components/PackageList/PackageList.test.tsx
@@ -1,8 +1,11 @@
 import { expectLoadingState } from "@/tests/helpers";
+import { setEndpointStatus } from "@/tests/controllers/controller";
 import { listPockets, pockets } from "@/tests/mocks/pockets";
 import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
+import { screen, within } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
 import type { ComponentProps } from "react";
+import { waitFor } from "@testing-library/react";
 import { describe, expect } from "vitest";
 import PackageList from "./PackageList";
 
@@ -29,8 +32,11 @@ const pullPocketProps: ComponentProps<typeof PackageList> = {
   seriesName: "Focal Fossa",
   pocket: pullPocket,
 };
-
 describe("PackageList", () => {
+  beforeEach(() => {
+    setEndpointStatus("default");
+  });
+
   it("renders common buttons", () => {
     renderWithProviders(<PackageList {...mirrorPocketProps} />);
     expect(screen.getByRole("button", { name: /edit/i })).toBeVisible();
@@ -75,4 +81,229 @@ describe("PackageList", () => {
     const rowCheckboxes = screen.getAllByRole("checkbox").length - 1;
     expect(rowCheckboxes).toEqual(listPockets.length);
   });
+
+  it("does not show sync or search controls for upload pocket", async () => {
+    renderWithProviders(<PackageList {...uploadPocketProps} />);
+
+    await expectLoadingState();
+
+    expect(
+      screen.queryByRole("button", { name: /^sync$/i }),
+    ).not.toBeInTheDocument();
+    expect(
+      screen.queryByRole("button", { name: /^pull$/i }),
+    ).not.toBeInTheDocument();
+    expect(
+      screen.queryByRole("searchbox", { name: /package search/i }),
+    ).not.toBeInTheDocument();
+  });
+
+  it("renders empty state when no packages are returned", async () => {
+    setEndpointStatus("empty");
+
+    renderWithProviders(<PackageList {...mirrorPocketProps} />);
+
+    await expectLoadingState();
+
+    expect(screen.getByText("No packages found")).toBeInTheDocument();
+    expect(
+      screen.queryByRole("searchbox", { name: /package search/i }),
+    ).not.toBeInTheDocument();
+  });
+
+  it("opens the edit side panel from actions", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<PackageList {...mirrorPocketProps} />);
+
+    await user.click(screen.getByRole("button", { name: /edit/i }));
+
+    expect(
+      await screen.findByRole("heading", { name: /edit .* pocket/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("removes pocket successfully", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<PackageList {...mirrorPocketProps} />);
+
+    await user.click(
+      screen.getByRole("button", {
+        name: `Remove ${mirrorPocketProps.pocket.name} pocket of ${mirrorPocketProps.distributionName}/${mirrorPocketProps.seriesName}`,
+      }),
+    );
+    const dialog = screen.getByRole("dialog", { name: "Deleting pocket" });
+    await user.click(within(dialog).getByRole("button", { name: "Delete" }));
+
+    await waitFor(() => {
+      expect(
+        screen.queryByRole("dialog", { name: "Deleting pocket" }),
+      ).not.toBeInTheDocument();
+    });
+  });
+
+  it("submits mirror sync confirmation flow", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<PackageList {...mirrorPocketProps} />);
+
+    await user.click(
+      screen.getByRole("button", {
+        name: new RegExp(
+          `Synchronize ${mirrorPocketProps.pocket.name} pocket of ${mirrorPocketProps.distributionName}/${mirrorPocketProps.seriesName}`,
+          "i",
+        ),
+      }),
+    );
+
+    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
+  });
+
+  it("submits pull sync flow", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<PackageList {...pullPocketProps} />);
+
+    await user.click(
+      screen.getByRole("button", {
+        name: new RegExp(
+          `Pull packages to ${pullPocketProps.pocket.name} pocket of ${pullPocketProps.distributionName}/${pullPocketProps.seriesName}`,
+          "i",
+        ),
+      }),
+    );
+
+    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
+  });
+
+  it("renders pull package diffs with updates and deletions", async () => {
+    setEndpointStatus({ status: "default", path: "DiffPullPocketUpdate" });
+    renderWithProviders(<PackageList {...pullPocketProps} />);
+
+    await expectLoadingState();
+    await waitFor(() => {
+      expect(
+        document.querySelectorAll(".p-icon--warning").length,
+      ).toBeGreaterThan(0);
+    });
+  });
+
+  it("renders pull package list when diffs contain only additions", async () => {
+    setEndpointStatus({ status: "default", path: "DiffPullPocketAddOnly" });
+
+    renderWithProviders(<PackageList {...pullPocketProps} />);
+    await expectLoadingState();
+
+    expect(await screen.findByText("pocket1")).toBeInTheDocument();
+    expect(document.querySelector(".p-icon--warning")).not.toBeInTheDocument();
+  });
+
+  it("submits upload remove-packages flow", async () => {
+    const user = userEvent.setup();
+    const [firstPackage] = listPockets;
+    assert(firstPackage);
+    renderWithProviders(<PackageList {...uploadPocketProps} />);
+
+    await expectLoadingState();
+    await user.click(screen.getByLabelText(firstPackage.name));
+    await user.click(
+      screen.getByRole("button", { name: /remove selected packages from/i }),
+    );
+    const dialog = screen.getByRole("dialog", {
+      name: /deleting packages from pocket/i,
+    });
+    await user.click(within(dialog).getByRole("button", { name: /^delete$/i }));
+
+    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
+  });
+
+  it("searches and clears package search", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<PackageList {...mirrorPocketProps} />);
+
+    await expectLoadingState();
+
+    const searchInput = screen.getByRole("searchbox", {
+      name: /package search/i,
+    });
+    await user.type(searchInput, "pocket1{enter}");
+    expect(searchInput).toHaveValue("pocket1");
+
+    await user.click(
+      screen.getByRole("button", { name: /clear search field/i }),
+    );
+    expect(searchInput).toHaveValue("");
+  });
+
+  it("resets selected packages when paginating upload list", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "default", path: "ListPocketMany" });
+    renderWithProviders(<PackageList {...uploadPocketProps} />);
+
+    await screen.findByRole("checkbox", { name: "Toggle all" });
+    const [, firstRowCheckbox] = screen.getAllByRole("checkbox");
+    assert(firstRowCheckbox);
+    await user.click(firstRowCheckbox);
+    await user.click(screen.getByRole("button", { name: /next page/i }));
+    await user.click(screen.getByRole("button", { name: /previous page/i }));
+
+    await waitFor(() => {
+      expect(
+        screen.getByRole("button", { name: /remove selected packages from/i }),
+      ).toHaveAttribute("aria-disabled", "true");
+    });
+  });
+
+  it("changes page size via pagination select", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "default", path: "ListPocketMany" });
+    renderWithProviders(<PackageList {...uploadPocketProps} />);
+
+    await screen.findByRole("combobox", { name: "Instances per page" });
+    await user.selectOptions(
+      screen.getByRole("combobox", { name: "Instances per page" }),
+      "50",
+    );
+
+    expect(
+      screen.queryByRole("button", { name: /next page/i }),
+    ).not.toBeInTheDocument();
+  });
+
+  it("shows error notification when removing pocket fails", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "error", path: "RemovePocket" });
+    renderWithProviders(<PackageList {...mirrorPocketProps} />);
+
+    await user.click(
+      screen.getByRole("button", {
+        name: `Remove ${mirrorPocketProps.pocket.name} pocket of ${mirrorPocketProps.distributionName}/${mirrorPocketProps.seriesName}`,
+      }),
+    );
+    const dialog = screen.getByRole("dialog", { name: "Deleting pocket" });
+    await user.click(within(dialog).getByRole("button", { name: "Delete" }));
+
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+  });
+
+  it("shows error notification when removing packages fails", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "error", path: "RemovePackagesFromPocket" });
+    renderWithProviders(<PackageList {...uploadPocketProps} />);
+
+    const [firstPocket] = listPockets;
+    assert(firstPocket);
+    await screen.findByRole("checkbox", { name: firstPocket.name });
+    await user.click(screen.getByLabelText(firstPocket.name));
+    await user.click(
+      screen.getByRole("button", { name: /remove selected packages from/i }),
+    );
+    const dialog = screen.getByRole("dialog", {
+      name: /deleting packages from pocket/i,
+    });
+    await user.click(within(dialog).getByRole("button", { name: /^delete$/i }));
+
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+  });
 });
diff --git a/src/features/mirrors/components/PackageList/PackageList.tsx b/src/features/mirrors/components/PackageList/PackageList.tsx
index 3a0683678..4833f6ed7 100644
--- a/src/features/mirrors/components/PackageList/PackageList.tsx
+++ b/src/features/mirrors/components/PackageList/PackageList.tsx
@@ -74,19 +74,20 @@ const PackageList: FC<PackageListProps> = ({
     pullPackagesToPocketQuery;
 
   const handleSync = (): void => {
-    if ("mirror" === pocket.mode) {
-      syncMirrorPocket({
-        name: pocket.name,
-        series: seriesName,
-        distribution: distributionName,
-      });
-    } else if ("pull" === pocket.mode) {
+    if ("pull" === pocket.mode) {
       pullPackagesToPocket({
         name: pocket.name,
         series: seriesName,
         distribution: distributionName,
       });
+      return;
     }
+
+    syncMirrorPocket({
+      name: pocket.name,
+      series: seriesName,
+      distribution: distributionName,
+    });
   };
 
   const handleEditPocket = (): void => {
@@ -289,6 +290,8 @@ const PackageList: FC<PackageListProps> = ({
           size: 6,
           medium: 3,
         };
+  const isSyncButtonDisabled =
+    isSynchronizingMirrorPocket || isPullingPackagesToPocket;
 
   return (
     <>
@@ -306,9 +309,7 @@ const PackageList: FC<PackageListProps> = ({
                   className="p-segmented-control__button"
                   type="button"
                   onClick={handleSync}
-                  disabled={
-                    isSynchronizingMirrorPocket && isPullingPackagesToPocket
-                  }
+                  disabled={isSyncButtonDisabled}
                   aria-label={
                     "mirror" === pocket.mode
                       ? `Synchronize ${pocket.name} pocket of ${distributionName}/${seriesName}`
diff --git a/src/features/overview/components/AlertCard/AlertCard.test.tsx b/src/features/overview/components/AlertCard/AlertCard.test.tsx
index 7eae6d77f..003259644 100644
--- a/src/features/overview/components/AlertCard/AlertCard.test.tsx
+++ b/src/features/overview/components/AlertCard/AlertCard.test.tsx
@@ -1,10 +1,12 @@
 import type { Status } from "@/features/instances";
 import { ALERT_STATUSES } from "@/features/instances";
 import { setEndpointStatus } from "@/tests/controllers/controller";
-import { expectErrorNotification, expectLoadingState } from "@/tests/helpers";
+import { expectErrorNotification } from "@/tests/helpers";
 import { renderWithProviders } from "@/tests/render";
 import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
 import { describe, expect } from "vitest";
+import { ROUTES } from "@/libs/routes";
 import AlertCard from "./AlertCard";
 
 const alert =
@@ -34,7 +36,64 @@ describe("AlertCard", () => {
     const alertLabel = screen.getByText(props.alternateLabel);
     expect(alertLabel).toBeInTheDocument();
 
-    await expectLoadingState();
+    const errorText = await screen.findByText("Error loading data.");
+    expect(errorText).toBeInTheDocument();
     await expectErrorNotification();
   });
+
+  it("uses label fallback and icon fallback when alternateLabel and gray icon are missing", () => {
+    const fallbackAlert = ALERT_STATUSES.PackageUpgradesAlert;
+
+    renderWithProviders(
+      <AlertCard
+        alertType={fallbackAlert.alertType}
+        alternateLabel={undefined}
+        filterValue={fallbackAlert.filterValue}
+        icon={fallbackAlert.icon}
+        label={fallbackAlert.label}
+        query={fallbackAlert.query}
+      />,
+    );
+
+    expect(screen.getByText(fallbackAlert.label)).toBeInTheDocument();
+  });
+
+  it("renders a link to instances route for non-pending alerts", async () => {
+    renderWithProviders(<AlertCard {...props} />);
+
+    const link = await screen.findByRole("link", { name: /instance/i });
+    expect(link).toHaveAttribute(
+      "href",
+      ROUTES.instances.root({ status: props.filterValue }),
+    );
+  });
+
+  it("opens pending instances review in side panel", async () => {
+    const user = userEvent.setup();
+    const pendingAlert = ALERT_STATUSES.PendingComputersAlert;
+
+    renderWithProviders(<AlertCard {...pendingAlert} />);
+
+    const reviewButton = await screen.findByRole("button", {
+      name: /instance/i,
+    });
+    await user.click(reviewButton);
+
+    expect(
+      await screen.findByRole("heading", { name: "Review Pending Instances" }),
+    ).toBeInTheDocument();
+  });
+
+  it("renders zero-count state for pending alerts with no pending instances", async () => {
+    setEndpointStatus({ status: "empty", path: "GetPendingComputers" });
+    const pendingAlert = ALERT_STATUSES.PendingComputersAlert;
+
+    renderWithProviders(<AlertCard {...pendingAlert} />);
+
+    expect(await screen.findByText("0")).toBeInTheDocument();
+    expect(screen.getByText("instances")).toBeInTheDocument();
+    expect(
+      screen.queryByRole("button", { name: /instance/i }),
+    ).not.toBeInTheDocument();
+  });
 });
diff --git a/src/features/package-profiles/components/PackageProfileAddSidePanel/PackageProfileAddSidePanel.test.tsx b/src/features/package-profiles/components/PackageProfileAddSidePanel/PackageProfileAddSidePanel.test.tsx
index 1a357eb12..fa26ad736 100644
--- a/src/features/package-profiles/components/PackageProfileAddSidePanel/PackageProfileAddSidePanel.test.tsx
+++ b/src/features/package-profiles/components/PackageProfileAddSidePanel/PackageProfileAddSidePanel.test.tsx
@@ -7,6 +7,7 @@ import { screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { afterEach, describe, expect } from "vitest";
 import PackageProfileAddSidePanel from "./PackageProfileAddSidePanel";
+import { NO_DATA_TEXT } from "@/components/layout/NoData";
 
 describe("PackageProfileAddSidePanel", () => {
   const user = userEvent.setup();
@@ -26,7 +27,7 @@ describe("PackageProfileAddSidePanel", () => {
     );
     await user.type(
       screen.getByRole("textbox", { name: "Description" }),
-      "---",
+      NO_DATA_TEXT,
     );
     await user.selectOptions(
       screen.getByRole("combobox", { name: "Package constraints" }),
diff --git a/src/features/processes/components/ProcessesHeader/ProcessesHeader.test.tsx b/src/features/processes/components/ProcessesHeader/ProcessesHeader.test.tsx
index bd901e16b..7416f277e 100644
--- a/src/features/processes/components/ProcessesHeader/ProcessesHeader.test.tsx
+++ b/src/features/processes/components/ProcessesHeader/ProcessesHeader.test.tsx
@@ -1,20 +1,28 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
+import { expectErrorNotification } from "@/tests/helpers";
 import { renderWithProviders } from "@/tests/render";
-import ProcessesHeader from "./ProcessesHeader";
-import { vi } from "vitest";
 import { screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
+import { vi } from "vitest";
+import { PATHS, ROUTES } from "@/libs/routes";
+import ProcessesHeader from "./ProcessesHeader";
 
 const props = {
   selectedPids: [],
   handleClearSelection: vi.fn(),
 };
 
+const SELECTED_PID = 123;
+const INSTANCE_ID = 11;
+
 describe("ProcessesHeader", () => {
   beforeEach(() => {
-    renderWithProviders(<ProcessesHeader {...props} />);
+    setEndpointStatus("default");
   });
 
   it("should render ProcessesHeader correctly", () => {
+    renderWithProviders(<ProcessesHeader {...props} />);
+
     const buttons = ["End process", "Kill process"];
     expect(screen.getByRole("searchbox")).toBeInTheDocument();
     buttons.forEach((button) => {
@@ -23,12 +31,16 @@ describe("ProcessesHeader", () => {
   });
 
   it("should write in search", async () => {
+    renderWithProviders(<ProcessesHeader {...props} />);
+
     const searchBox = screen.getByRole("searchbox");
     await userEvent.type(searchBox, "test{enter}");
     expect(searchBox).toHaveValue("test");
   });
 
   it("should clear search box", async () => {
+    renderWithProviders(<ProcessesHeader {...props} />);
+
     const searchBox = screen.getByRole("searchbox");
     await userEvent.type(searchBox, "test");
     await userEvent.click(
@@ -36,4 +48,116 @@ describe("ProcessesHeader", () => {
     );
     expect(searchBox).toHaveValue("");
   });
+
+  it("disables process action buttons when no pids are selected", () => {
+    renderWithProviders(
+      <ProcessesHeader selectedPids={[]} handleClearSelection={vi.fn()} />,
+    );
+
+    expect(screen.getByRole("button", { name: "End process" })).toHaveAttribute(
+      "aria-disabled",
+      "true",
+    );
+    expect(
+      screen.getByRole("button", { name: "Kill process" }),
+    ).toHaveAttribute("aria-disabled", "true");
+  });
+
+  it("enables process action buttons when pids are selected", () => {
+    renderWithProviders(
+      <ProcessesHeader
+        selectedPids={[SELECTED_PID]}
+        handleClearSelection={vi.fn()}
+      />,
+    );
+
+    expect(screen.getByRole("button", { name: "End process" })).toBeEnabled();
+    expect(screen.getByRole("button", { name: "Kill process" })).toBeEnabled();
+  });
+
+  it("ends selected processes and clears selection", async () => {
+    const user = userEvent.setup();
+    const handleClearSelection = vi.fn();
+
+    renderWithProviders(
+      <ProcessesHeader
+        selectedPids={[SELECTED_PID]}
+        handleClearSelection={handleClearSelection}
+      />,
+      undefined,
+      ROUTES.instances.details.single(INSTANCE_ID),
+      `/${PATHS.instances.root}/${PATHS.instances.single}`,
+    );
+
+    await user.click(screen.getByRole("button", { name: "End process" }));
+
+    expect(
+      await screen.findByText(/Process successfully ended\./i),
+    ).toBeInTheDocument();
+    expect(handleClearSelection).toHaveBeenCalledTimes(1);
+  });
+
+  it("kills selected processes and clears selection", async () => {
+    const user = userEvent.setup();
+    const handleClearSelection = vi.fn();
+
+    renderWithProviders(
+      <ProcessesHeader
+        selectedPids={[1, 2]}
+        handleClearSelection={handleClearSelection}
+      />,
+      undefined,
+      ROUTES.instances.details.single(INSTANCE_ID),
+      `/${PATHS.instances.root}/${PATHS.instances.single}`,
+    );
+
+    await user.click(screen.getByRole("button", { name: "Kill process" }));
+
+    expect(
+      await screen.findByText(/Processes successfully killed\./i),
+    ).toBeInTheDocument();
+    expect(handleClearSelection).toHaveBeenCalledTimes(1);
+  });
+
+  it("shows error notification when ending process fails", async () => {
+    const user = userEvent.setup();
+    const handleClearSelection = vi.fn();
+
+    renderWithProviders(
+      <ProcessesHeader
+        selectedPids={[SELECTED_PID]}
+        handleClearSelection={handleClearSelection}
+      />,
+      undefined,
+      ROUTES.instances.details.single(INSTANCE_ID),
+      `/${PATHS.instances.root}/${PATHS.instances.single}`,
+    );
+
+    setEndpointStatus("error");
+    await user.click(screen.getByRole("button", { name: "End process" }));
+
+    await expectErrorNotification();
+    expect(handleClearSelection).not.toHaveBeenCalled();
+  });
+
+  it("shows error notification when killing process fails", async () => {
+    const user = userEvent.setup();
+    const handleClearSelection = vi.fn();
+
+    renderWithProviders(
+      <ProcessesHeader
+        selectedPids={[SELECTED_PID]}
+        handleClearSelection={handleClearSelection}
+      />,
+      undefined,
+      ROUTES.instances.details.single(INSTANCE_ID),
+      `/${PATHS.instances.root}/${PATHS.instances.single}`,
+    );
+
+    setEndpointStatus("error");
+    await user.click(screen.getByRole("button", { name: "Kill process" }));
+
+    await expectErrorNotification();
+    expect(handleClearSelection).not.toHaveBeenCalled();
+  });
 });
diff --git a/src/features/scripts/components/AttachmentFile/AttachmentFile.test.tsx b/src/features/scripts/components/AttachmentFile/AttachmentFile.test.tsx
index d8872e6ec..453b3a5aa 100644
--- a/src/features/scripts/components/AttachmentFile/AttachmentFile.test.tsx
+++ b/src/features/scripts/components/AttachmentFile/AttachmentFile.test.tsx
@@ -1,9 +1,8 @@
-import { setEndpointStatus } from "@/tests/controllers/controller";
 import { renderWithProviders } from "@/tests/render";
-import { screen, waitFor } from "@testing-library/react";
+import { screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import type { ComponentProps } from "react";
-import { beforeEach, describe, it, vi } from "vitest";
+import { afterEach, describe, expect, it, vi } from "vitest";
 import AttachmentFile from "./AttachmentFile";
 
 const createObjectURLMock = vi.fn((_object: Blob | MediaSource) => "blob:test");
@@ -35,9 +34,9 @@ const propsWithInitialAttachmentDelete: ComponentProps<typeof AttachmentFile> =
   };
 
 describe("AttachmentFile", () => {
-  beforeEach(() => {
-    setEndpointStatus("default");
+  afterEach(() => {
     vi.clearAllMocks();
+    vi.restoreAllMocks();
   });
 
   it("should display attachment file with script id prop", async () => {
@@ -74,32 +73,75 @@ describe("AttachmentFile", () => {
     expect(deleteButton).toBeInTheDocument();
   });
 
-  it("downloads blob attachments and revokes object URL", async () => {
-    const clickSpy = vi
+  it("calls delete callback when remove button is clicked", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <AttachmentFile {...propsWithInitialAttachmentDelete} />,
+    );
+
+    await user.click(
+      screen.getByRole("button", {
+        name: `Remove ${propsWithInitialAttachmentDelete.filename} attachment`,
+      }),
+    );
+
+    expect(
+      propsWithInitialAttachmentDelete.onInitialAttachmentDelete,
+    ).toHaveBeenCalledTimes(1);
+  });
+
+  it("downloads attachment file when download button is clicked", async () => {
+    const user = userEvent.setup();
+    const anchorClickSpy = vi
       .spyOn(HTMLAnchorElement.prototype, "click")
       .mockImplementation(() => undefined);
-    const user = userEvent.setup();
+    const createObjectUrlSpy = vi
+      .spyOn(URL, "createObjectURL")
+      .mockReturnValue("blob:attachment");
+    const revokeObjectUrlSpy = vi.spyOn(URL, "revokeObjectURL");
 
     renderWithProviders(<AttachmentFile {...propsWithScriptId} />);
+
     await user.click(
       screen.getByRole("button", {
         name: `Download ${propsWithScriptId.filename}`,
       }),
     );
 
-    await waitFor(() => {
-      expect(createObjectURLMock).toHaveBeenCalledTimes(1);
-      expect(clickSpy).toHaveBeenCalledTimes(1);
-      expect(revokeObjectURLMock).toHaveBeenCalledWith("blob:test");
-    });
+    expect(createObjectUrlSpy).toHaveBeenCalledTimes(1);
+
+    const [downloadedAttachmentBlob] = createObjectUrlSpy.mock.calls[0] ?? [];
+    expect(downloadedAttachmentBlob).toBeInstanceOf(Blob);
+    expect(await (downloadedAttachmentBlob as Blob).text()).toContain(
+      "attachment",
+    );
 
-    const blobToDownload = createObjectURLMock.mock.calls[0]?.[0];
-    expect(blobToDownload).toBeInstanceOf(Blob);
-    if (!(blobToDownload instanceof Blob)) {
-      throw new Error("Expected downloaded data to be a Blob.");
-    }
-    expect(blobToDownload.type).toContain("text/plain");
+    expect(anchorClickSpy).toHaveBeenCalledTimes(1);
+    expect(revokeObjectUrlSpy).toHaveBeenCalledWith("blob:attachment");
+  });
+
+  it("does not try to download when attachment data is missing", async () => {
+    const user = userEvent.setup();
+    const createObjectUrlSpy = vi.spyOn(URL, "createObjectURL");
+    const anchorClickSpy = vi
+      .spyOn(HTMLAnchorElement.prototype, "click")
+      .mockImplementation(() => undefined);
+    const missingDataProps: ComponentProps<typeof AttachmentFile> = {
+      attachmentId: 999,
+      filename: "missing.txt",
+      scriptId: 999,
+    };
+
+    renderWithProviders(<AttachmentFile {...missingDataProps} />);
+
+    await user.click(
+      screen.getByRole("button", {
+        name: `Download ${missingDataProps.filename}`,
+      }),
+    );
 
-    clickSpy.mockRestore();
+    expect(createObjectUrlSpy).not.toHaveBeenCalled();
+    expect(anchorClickSpy).not.toHaveBeenCalled();
   });
 });
diff --git a/src/features/scripts/components/AttachmentFile/AttachmentFile.tsx b/src/features/scripts/components/AttachmentFile/AttachmentFile.tsx
index 42a55d5f0..fde4fc2ab 100644
--- a/src/features/scripts/components/AttachmentFile/AttachmentFile.tsx
+++ b/src/features/scripts/components/AttachmentFile/AttachmentFile.tsx
@@ -30,8 +30,8 @@ const AttachmentFile: FC<AttachmentFileProps> = ({
   const handleDownload = async () => {
     try {
       const { data } = await refetch();
-      if (!data) {
-        throw new Error("Could not download attachment.");
+      if (!data || data.data === null || data.data === undefined) {
+        return;
       }
 
       const url = URL.createObjectURL(data.data);
diff --git a/src/features/scripts/components/CreateScriptForm/CreateScriptForm.test.tsx b/src/features/scripts/components/CreateScriptForm/CreateScriptForm.test.tsx
index 6288ba334..818d73582 100644
--- a/src/features/scripts/components/CreateScriptForm/CreateScriptForm.test.tsx
+++ b/src/features/scripts/components/CreateScriptForm/CreateScriptForm.test.tsx
@@ -1,9 +1,15 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
 import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
-import { describe, it } from "vitest";
+import { fireEvent, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { beforeEach, describe, it, vi } from "vitest";
 import CreateScriptForm from "./CreateScriptForm";
 
 describe("CreateScriptForm", () => {
+  beforeEach(() => {
+    setEndpointStatus("default");
+  });
+
   it("should display add script form", async () => {
     renderWithProviders(<CreateScriptForm />);
 
@@ -17,4 +23,167 @@ describe("CreateScriptForm", () => {
     expect(screen.getByText(/list of attachments/i)).toBeInTheDocument();
     expect(screen.getByText(/add script/i)).toBeInTheDocument();
   });
+
+  it("populates title and code from an uploaded file", async () => {
+    const user = userEvent.setup();
+    const file = new File(["echo hello"], "bootstrap.sh", {
+      type: "text/x-shellscript",
+    });
+
+    renderWithProviders(<CreateScriptForm />);
+
+    await user.upload(screen.getByTestId("create-script-upload-input"), file);
+
+    expect(screen.getByRole("textbox", { name: "Title" })).toHaveValue(
+      "bootstrap",
+    );
+    expect(screen.getByTestId("mock-monaco")).toHaveValue("echo hello");
+  });
+
+  it("keeps entered title when uploading a file", async () => {
+    const user = userEvent.setup();
+    const file = new File(["echo from file"], "new-title.sh", {
+      type: "text/x-shellscript",
+    });
+
+    renderWithProviders(<CreateScriptForm />);
+
+    const titleInput = screen.getByRole("textbox", { name: "Title" });
+    await user.type(titleInput, "custom title");
+
+    await user.upload(screen.getByTestId("create-script-upload-input"), file);
+
+    expect(titleInput).toHaveValue("custom title");
+    expect(screen.getByTestId("mock-monaco")).toHaveValue("echo from file");
+  });
+
+  it("shows required field validation on empty submit", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<CreateScriptForm />);
+
+    await user.click(screen.getByRole("button", { name: "Add script" }));
+
+    expect(await screen.findAllByText("This field is required")).toHaveLength(
+      2,
+    );
+  });
+
+  it("uploads attachments in form inputs", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<CreateScriptForm />);
+
+    await user.upload(
+      screen.getByLabelText("first attachment"),
+      new File(["print('hello')"], "first.py", { type: "text/plain" }),
+    );
+
+    expect(screen.getByLabelText("first attachment")).toHaveValue(
+      "C:\\fakepath\\first.py",
+    );
+  });
+
+  it("submits script with attachments", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<CreateScriptForm />);
+
+    await user.type(
+      screen.getByRole("textbox", { name: "Title" }),
+      "My script",
+    );
+    await user.type(screen.getByTestId("mock-monaco"), "echo run");
+    await user.upload(
+      screen.getByLabelText("first attachment"),
+      new File(["attachment"], "notes.txt", { type: "text/plain" }),
+    );
+
+    await user.click(screen.getByRole("button", { name: "Add script" }));
+
+    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
+  });
+
+  it("submits script without attachments", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<CreateScriptForm />);
+
+    await user.type(
+      screen.getByRole("textbox", { name: "Title" }),
+      "My script",
+    );
+    await user.type(screen.getByTestId("mock-monaco"), "echo run");
+    await user.click(screen.getByRole("button", { name: "Add script" }));
+
+    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
+  });
+
+  it("shows error notification when create script fails", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "error", path: "CreateScript" });
+    renderWithProviders(<CreateScriptForm />);
+
+    await user.type(
+      screen.getByRole("textbox", { name: "Title" }),
+      "My script",
+    );
+    await user.type(screen.getByTestId("mock-monaco"), "echo run");
+    await user.click(screen.getByRole("button", { name: "Add script" }));
+
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+  });
+
+  it("shows error notification when create script attachment fails", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "error", path: "CreateScriptAttachment" });
+    renderWithProviders(<CreateScriptForm />);
+
+    await user.type(
+      screen.getByRole("textbox", { name: "Title" }),
+      "My script",
+    );
+    await user.type(screen.getByTestId("mock-monaco"), "echo run");
+    await user.upload(
+      screen.getByLabelText("first attachment"),
+      new File(["attachment"], "notes.txt", { type: "text/plain" }),
+    );
+    await user.click(screen.getByRole("button", { name: "Add script" }));
+
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+  });
+
+  it("ignores empty file upload input", async () => {
+    renderWithProviders(<CreateScriptForm />);
+
+    fireEvent.change(screen.getByTestId("create-script-upload-input"), {
+      target: { files: null },
+    });
+
+    expect(screen.getByRole("textbox", { name: "Title" })).toHaveValue("");
+  });
+
+  it("handles attachment input with no file selected", () => {
+    renderWithProviders(<CreateScriptForm />);
+
+    fireEvent.change(screen.getByLabelText("first attachment"), {
+      target: { files: [] },
+    });
+
+    expect(screen.getByLabelText("first attachment")).toHaveValue("");
+  });
+
+  it("opens hidden file input from populate button", async () => {
+    const user = userEvent.setup();
+    const clickSpy = vi.spyOn(HTMLInputElement.prototype, "click");
+    renderWithProviders(<CreateScriptForm />);
+
+    await user.click(
+      screen.getByRole("button", { name: "Populate from file" }),
+    );
+
+    expect(clickSpy).toHaveBeenCalled();
+    clickSpy.mockRestore();
+  });
 });
diff --git a/src/features/scripts/components/CreateScriptForm/CreateScriptForm.tsx b/src/features/scripts/components/CreateScriptForm/CreateScriptForm.tsx
index 03a9ac399..ed8886d33 100644
--- a/src/features/scripts/components/CreateScriptForm/CreateScriptForm.tsx
+++ b/src/features/scripts/components/CreateScriptForm/CreateScriptForm.tsx
@@ -108,6 +108,7 @@ const CreateScript: FC = () => {
         ref={inputRef}
         className="u-hide"
         type="file"
+        data-testid="create-script-upload-input"
         onChange={handleInputChange}
       />
 
@@ -163,12 +164,6 @@ const CreateScript: FC = () => {
             e.target.files?.[0] ?? null,
           )
         }
-        onInitialAttachmentDelete={(attachment: string) => {
-          formik.setFieldValue("attachmentsToRemove", [
-            ...formik.values.attachmentsToRemove,
-            attachment,
-          ]);
-        }}
       />
 
       <SidePanelFormButtons
diff --git a/src/features/scripts/components/EditScriptForm/EditScriptForm.test.tsx b/src/features/scripts/components/EditScriptForm/EditScriptForm.test.tsx
index c70b11459..0acafd08c 100644
--- a/src/features/scripts/components/EditScriptForm/EditScriptForm.test.tsx
+++ b/src/features/scripts/components/EditScriptForm/EditScriptForm.test.tsx
@@ -1,12 +1,17 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
 import { scripts } from "@/tests/mocks/script";
+import { scriptProfiles } from "@/tests/mocks/scriptProfiles";
 import { renderWithProviders } from "@/tests/render";
-import { screen, within } from "@testing-library/react";
+import { fireEvent, screen, within } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import type { ComponentProps } from "react";
 import { describe, it } from "vitest";
 import EditScriptForm from "./EditScriptForm";
+import { NO_DATA_TEXT } from "@/components/layout/NoData";
+import { ROUTES } from "@/libs/routes";
 
 const [script] = scripts;
+const ASSOCIATED_PROFILE_ID = 12;
 
 const props: ComponentProps<typeof EditScriptForm> = {
   script,
@@ -14,7 +19,9 @@ const props: ComponentProps<typeof EditScriptForm> = {
 };
 
 describe("EditScriptForm", () => {
-  const user = userEvent.setup();
+  beforeEach(() => {
+    setEndpointStatus("default");
+  });
 
   it("should display edit script form", async () => {
     renderWithProviders(<EditScriptForm {...props} />);
@@ -26,6 +33,8 @@ describe("EditScriptForm", () => {
   });
 
   it("should show the edit confirmation modal when 'Submit new version' is clicked", async () => {
+    const user = userEvent.setup();
+
     renderWithProviders(<EditScriptForm {...props} />);
 
     await user.type(screen.getByRole("textbox", { name: /title/i }), " edited");
@@ -42,6 +51,7 @@ describe("EditScriptForm", () => {
   });
 
   it("should submit the new version and show a success notification", async () => {
+    const user = userEvent.setup();
     renderWithProviders(<EditScriptForm {...props} />);
 
     await user.type(screen.getByRole("textbox", { name: /title/i }), " edited");
@@ -59,4 +69,291 @@ describe("EditScriptForm", () => {
       await screen.findByText(/successfully submitted a new version/i),
     ).toBeInTheDocument();
   });
+
+  it("populates title and code from an uploaded file when title is empty", async () => {
+    const user = userEvent.setup();
+    const editableScript = { ...script, title: "" };
+    const file = new File(["echo from upload"], "deploy.sh", {
+      type: "text/x-shellscript",
+    });
+
+    renderWithProviders(<EditScriptForm script={editableScript} />);
+
+    const fileInput = screen.getByTestId("edit-script-upload-input");
+
+    await user.upload(fileInput, file);
+
+    expect(screen.getByRole("textbox", { name: "Title" })).toHaveValue(
+      "deploy",
+    );
+    expect(screen.getByTestId("mock-monaco")).toHaveValue("echo from upload");
+  });
+
+  it("keeps existing title when uploading a file", async () => {
+    const user = userEvent.setup();
+    const file = new File(["echo from upload"], "should-not-replace.sh", {
+      type: "text/x-shellscript",
+    });
+
+    renderWithProviders(<EditScriptForm script={script} />);
+
+    const titleInput = screen.getByRole("textbox", { name: "Title" });
+    const existingTitle = titleInput.getAttribute("value");
+
+    const fileInput = screen.getByTestId("edit-script-upload-input");
+    await user.upload(fileInput, file);
+
+    expect(titleInput).toHaveValue(existingTitle);
+    expect(screen.getByTestId("mock-monaco")).toHaveValue("echo from upload");
+  });
+
+  it("updates code editor value", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<EditScriptForm script={script} />);
+
+    const editor = screen.getByTestId("mock-monaco");
+    await user.clear(editor);
+    await user.type(editor, "echo changed");
+
+    expect(editor).toHaveValue("echo changed");
+  });
+
+  it("submits new version with attachment changes", async () => {
+    const user = userEvent.setup();
+    const scriptWithAttachment = scripts.find(
+      (entry) => entry.attachments.length,
+    );
+    assert(scriptWithAttachment);
+    const [initialAttachment] = scriptWithAttachment.attachments;
+    assert(initialAttachment);
+
+    renderWithProviders(<EditScriptForm script={scriptWithAttachment} />);
+
+    await user.click(
+      screen.getByRole("button", {
+        name: `Remove ${initialAttachment.filename} attachment`,
+      }),
+    );
+
+    await user.upload(
+      screen.getByLabelText("second attachment"),
+      new File(["new attachment"], "new.txt", { type: "text/plain" }),
+    );
+
+    await user.click(
+      screen.getByRole("button", { name: "Submit new version" }),
+    );
+
+    const dialog = screen.getByRole("dialog", {
+      name: `Submit new version of "${scriptWithAttachment.title}"`,
+    });
+    await user.click(
+      within(dialog).getByRole("button", { name: "Submit new version" }),
+    );
+
+    expect(screen.queryByText("Network Error")).not.toBeInTheDocument();
+  });
+
+  it("opens hidden file input from populate button", async () => {
+    const user = userEvent.setup();
+    const clickSpy = vi.spyOn(HTMLInputElement.prototype, "click");
+    renderWithProviders(<EditScriptForm script={script} />);
+
+    await user.click(
+      screen.getByRole("button", { name: "Populate from file" }),
+    );
+
+    expect(clickSpy).toHaveBeenCalled();
+    clickSpy.mockRestore();
+  });
+
+  it("ignores empty file upload input", async () => {
+    renderWithProviders(<EditScriptForm script={script} />);
+
+    fireEvent.change(screen.getByTestId("edit-script-upload-input"), {
+      target: { files: null },
+    });
+
+    expect(screen.getByRole("textbox", { name: "Title" })).toHaveValue(
+      script.title,
+    );
+  });
+
+  it("handles attachment input with no file selected", () => {
+    renderWithProviders(<EditScriptForm script={script} />);
+
+    fireEvent.change(screen.getByLabelText("first attachment"), {
+      target: { files: [] },
+    });
+
+    expect(screen.getByLabelText("first attachment")).toHaveValue("");
+  });
+
+  it("submits new version with associated profiles links", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<EditScriptForm script={script} />);
+
+    await user.click(
+      screen.getByRole("button", { name: "Submit new version" }),
+    );
+
+    expect(
+      await screen.findByText(
+        /submitting these changes will affect the following profiles/i,
+      ),
+    ).toBeInTheDocument();
+    expect(screen.getByRole("link", { name: "abc" })).toHaveAttribute(
+      "href",
+      ROUTES.scripts.root({ tab: "profiles" }),
+    );
+    expect(screen.getByRole("link", { name: "12 instances" })).toHaveAttribute(
+      "href",
+      ROUTES.instances.root(),
+    );
+  });
+
+  it("renders singular associated instance link text", async () => {
+    const user = userEvent.setup();
+    const associatedProfile = scriptProfiles.find(
+      (profile) => profile.id === ASSOCIATED_PROFILE_ID,
+    );
+    assert(associatedProfile);
+    const originalAssociatedCount =
+      associatedProfile.computers.num_associated_computers;
+    associatedProfile.computers.num_associated_computers = 1;
+
+    try {
+      renderWithProviders(<EditScriptForm script={script} />);
+
+      await user.click(
+        screen.getByRole("button", { name: "Submit new version" }),
+      );
+
+      expect(
+        await screen.findByRole("link", { name: "1 instance" }),
+      ).toHaveAttribute("href", ROUTES.instances.root());
+    } finally {
+      associatedProfile.computers.num_associated_computers =
+        originalAssociatedCount;
+    }
+  });
+
+  it("shows no data for associated profiles without instances", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(
+      <EditScriptForm
+        script={{
+          ...script,
+          script_profiles: [{ id: 999, title: "Unknown profile" }],
+        }}
+      />,
+    );
+
+    await user.click(
+      screen.getByRole("button", { name: "Submit new version" }),
+    );
+
+    expect(await screen.findByText(NO_DATA_TEXT)).toBeInTheDocument();
+  });
+
+  it("submits when there are no associated profiles", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "empty", path: "script-profiles" });
+    renderWithProviders(<EditScriptForm script={script} />);
+
+    await user.click(
+      screen.getByRole("button", { name: "Submit new version" }),
+    );
+
+    expect(
+      await screen.findByText(
+        /all future script runs will be done using the latest version of the code\./i,
+      ),
+    ).toBeInTheDocument();
+    expect(
+      screen.queryByText(/affect the following profiles/i),
+    ).not.toBeInTheDocument();
+  });
+
+  it("closes confirmation modal with cancel button", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<EditScriptForm script={script} />);
+
+    await user.click(
+      screen.getByRole("button", { name: "Submit new version" }),
+    );
+    const dialog = await screen.findByRole("dialog");
+    await user.click(within(dialog).getByRole("button", { name: "Cancel" }));
+
+    expect(screen.queryByRole("dialog")).not.toBeInTheDocument();
+  });
+
+  it("shows error notification when edit script fails", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "error", path: "EditScript" });
+    renderWithProviders(<EditScriptForm script={script} />);
+
+    await user.click(
+      screen.getByRole("button", { name: "Submit new version" }),
+    );
+    const dialog = await screen.findByRole("dialog");
+    await user.click(
+      within(dialog).getByRole("button", { name: "Submit new version" }),
+    );
+
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+  });
+
+  it("shows error notification when removing attachment fails", async () => {
+    const user = userEvent.setup();
+    const scriptWithAttachment = scripts.find(
+      (entry) => entry.attachments.length,
+    );
+    assert(scriptWithAttachment);
+    const [initialAttachment] = scriptWithAttachment.attachments;
+    assert(initialAttachment);
+    setEndpointStatus({ status: "error", path: "RemoveScriptAttachment" });
+    renderWithProviders(<EditScriptForm script={scriptWithAttachment} />);
+
+    await user.click(
+      screen.getByRole("button", {
+        name: `Remove ${initialAttachment.filename} attachment`,
+      }),
+    );
+    await user.click(
+      screen.getByRole("button", { name: "Submit new version" }),
+    );
+    const dialog = await screen.findByRole("dialog");
+    await user.click(
+      within(dialog).getByRole("button", { name: "Submit new version" }),
+    );
+
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+  });
+
+  it("shows error notification when adding attachment fails", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "error", path: "CreateScriptAttachment" });
+    renderWithProviders(<EditScriptForm script={script} />);
+
+    await user.upload(
+      screen.getByLabelText("first attachment"),
+      new File(["new attachment"], "new.txt", { type: "text/plain" }),
+    );
+    await user.click(
+      screen.getByRole("button", { name: "Submit new version" }),
+    );
+    const dialog = await screen.findByRole("dialog");
+    await user.click(
+      within(dialog).getByRole("button", { name: "Submit new version" }),
+    );
+
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+  });
 });
diff --git a/src/features/scripts/components/EditScriptForm/EditScriptForm.tsx b/src/features/scripts/components/EditScriptForm/EditScriptForm.tsx
index 35d889262..dec4c7f67 100644
--- a/src/features/scripts/components/EditScriptForm/EditScriptForm.tsx
+++ b/src/features/scripts/components/EditScriptForm/EditScriptForm.tsx
@@ -135,6 +135,7 @@ const EditScriptForm: FC<EditScriptFormProps> = ({ script, onBack }) => {
         ref={inputRef}
         className="u-hide"
         type="file"
+        data-testid="edit-script-upload-input"
         onChange={handleInputChange}
       />
 
diff --git a/src/features/scripts/components/RunScriptForm/RunScriptForm.test.tsx b/src/features/scripts/components/RunScriptForm/RunScriptForm.test.tsx
index b84e77597..b7d94145b 100644
--- a/src/features/scripts/components/RunScriptForm/RunScriptForm.test.tsx
+++ b/src/features/scripts/components/RunScriptForm/RunScriptForm.test.tsx
@@ -1,8 +1,9 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
 import { scripts } from "@/tests/mocks/script";
 import { renderWithProviders } from "@/tests/render";
 import { screen, within } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-import { describe, it } from "vitest";
+import { beforeEach, describe, it } from "vitest";
 import RunScriptForm from "./RunScriptForm";
 
 const [script] = scripts;
@@ -18,6 +19,10 @@ const selectTag = async (
 describe("RunScriptForm", () => {
   const user = userEvent.setup();
 
+  beforeEach(() => {
+    setEndpointStatus("default");
+  });
+
   it("should display run script form", async () => {
     renderWithProviders(<RunScriptForm script={script} />);
 
@@ -176,7 +181,7 @@ describe("RunScriptForm", () => {
       await screen.findByText(/no instances to run script on/i),
     ).toBeInTheDocument();
     expect(
-      screen.getByText(/please select different tags and try again/i),
+      screen.getByText(/select different tags and try again/i),
     ).toBeInTheDocument();
   });
 
diff --git a/src/features/scripts/components/RunScriptForm/RunScriptForm.tsx b/src/features/scripts/components/RunScriptForm/RunScriptForm.tsx
index 095d812a0..68f1b404b 100644
--- a/src/features/scripts/components/RunScriptForm/RunScriptForm.tsx
+++ b/src/features/scripts/components/RunScriptForm/RunScriptForm.tsx
@@ -166,10 +166,9 @@ const RunScriptForm: FC<RunScriptFormProps> = ({
       value: tag,
     })) ?? [];
 
-  const instancesWithScriptsFeature =
-    instances.filter((instance) => {
-      return getFeatures(instance).scripts;
-    }) ?? [];
+  const instancesWithScriptsFeature = instances.filter((instance) => {
+    return getFeatures(instance).scripts;
+  });
 
   const instanceOptions: MultiSelectItem[] = instancesWithScriptsFeature.map(
     ({ title, id }) => ({
@@ -178,10 +177,11 @@ const RunScriptForm: FC<RunScriptFormProps> = ({
     }),
   );
 
-  const taggedInstancesWithScriptsFeature =
-    taggedInstances.filter((instance) => {
+  const taggedInstancesWithScriptsFeature = taggedInstances.filter(
+    (instance) => {
       return getFeatures(instance).scripts;
-    }) ?? [];
+    },
+  );
 
   const shouldShowNoTaggedInstancesWarning =
     hasClosedTagDropdown &&
diff --git a/src/features/scripts/components/ScriptFormAttachments/ScriptFormAttachments.tsx b/src/features/scripts/components/ScriptFormAttachments/ScriptFormAttachments.tsx
index be259a6fc..d07d40dae 100644
--- a/src/features/scripts/components/ScriptFormAttachments/ScriptFormAttachments.tsx
+++ b/src/features/scripts/components/ScriptFormAttachments/ScriptFormAttachments.tsx
@@ -14,7 +14,7 @@ interface ScriptFormAttachmentsProps {
   readonly onFileInputChange: (
     key: keyof ScriptFormValues["attachments"],
   ) => ChangeEventHandler<HTMLInputElement>;
-  readonly onInitialAttachmentDelete: (attachment: string) => void;
+  readonly onInitialAttachmentDelete?: (attachment: string) => void;
   readonly scriptId?: number;
 }
 
@@ -51,7 +51,7 @@ const ScriptFormAttachments: FC<ScriptFormAttachmentsProps> = ({
             filename={initialAttachment.filename}
             scriptId={scriptId}
             onInitialAttachmentDelete={() => {
-              onInitialAttachmentDelete(initialAttachment.filename);
+              onInitialAttachmentDelete?.(initialAttachment.filename);
             }}
           />
         );
diff --git a/src/features/scripts/helpers.test.ts b/src/features/scripts/helpers.test.ts
new file mode 100644
index 000000000..96662c65d
--- /dev/null
+++ b/src/features/scripts/helpers.test.ts
@@ -0,0 +1,104 @@
+import { describe, expect, it, vi } from "vitest";
+import moment from "moment";
+import { DISPLAY_DATE_TIME_FORMAT } from "@/constants";
+import {
+  formatTitleCase,
+  getAuthorInfo,
+  getCode,
+  getCreateAttachmentsPromises,
+  getCreateScriptParams,
+  getEditScriptParams,
+  removeFileExtension,
+} from "./helpers";
+
+const SCRIPT_ID = 42;
+const FILE_CONTENT = "hello world";
+const emptyAttachments = {
+  first: null,
+  second: null,
+  third: null,
+  fourth: null,
+  fifth: null,
+};
+
+describe("scripts helpers", () => {
+  it("builds create params with encoded code and trimmed title", () => {
+    const params = getCreateScriptParams({
+      title: "  My Script  ",
+      code: "#!/bin/bash\necho hi\r\n",
+      access_group: "global",
+      attachments: emptyAttachments,
+      attachmentsToRemove: [],
+    });
+
+    expect(params.title).toBe("My Script");
+    expect(params.script_type).toBe("V2");
+    expect(params.access_group).toBe("global");
+    expect(params.code).toBe("IyEvYmluL2Jhc2gKZWNobyBoaQo=");
+  });
+
+  it("builds edit params with script id", () => {
+    const params = getEditScriptParams({
+      scriptId: SCRIPT_ID,
+      values: {
+        title: "  Updated Script  ",
+        code: "echo edited",
+        access_group: "global",
+        attachments: emptyAttachments,
+        attachmentsToRemove: [],
+      },
+    });
+
+    expect(params.script_id).toBe(SCRIPT_ID);
+    expect(params.title).toBe("Updated Script");
+    expect(params.code).toBe("ZWNobyBlZGl0ZWQ=");
+  });
+
+  it("creates attachment upload promises with encoded payloads", async () => {
+    const createScriptAttachment = vi.fn().mockResolvedValue({ ok: true });
+
+    const textFile = new File([FILE_CONTENT], "notes.txt", {
+      type: "text/plain",
+    });
+    const binaryFile = new File([new Uint8Array([1, 2, 3])], "blob.bin", {
+      type: "application/octet-stream",
+    });
+
+    const uploadPromises = await getCreateAttachmentsPromises({
+      attachments: [textFile, binaryFile],
+      createScriptAttachment,
+      script_id: SCRIPT_ID,
+    });
+
+    await Promise.all(uploadPromises);
+
+    expect(createScriptAttachment).toHaveBeenCalledTimes(2);
+    expect(createScriptAttachment).toHaveBeenNthCalledWith(1, {
+      file: "notes.txt$$aGVsbG8gd29ybGQ=",
+      script_id: SCRIPT_ID,
+    });
+    expect(createScriptAttachment).toHaveBeenNthCalledWith(2, {
+      file: "blob.bin$$AQID",
+      script_id: SCRIPT_ID,
+    });
+  });
+
+  it("handles common filename transformations", () => {
+    expect(removeFileExtension("archive.tar.gz")).toBe("archive.tar");
+    expect(removeFileExtension("README")).toBe("README");
+    expect(formatTitleCase("hELLO")).toBe("Hello");
+  });
+
+  it("formats shebang code and author metadata", () => {
+    const interpreter = "/usr/bin/python3";
+    const code = "print('ok')";
+    const date = "2024-01-01T12:34:56Z";
+
+    expect(getCode({ interpreter, code })).toBe(
+      "#!/usr/bin/python3\nprint('ok')",
+    );
+    expect(getAuthorInfo({ author: "alice", date })).toBe(
+      `${moment(date).format(DISPLAY_DATE_TIME_FORMAT)}, by alice`,
+    );
+  });
+});
diff --git a/src/features/security-profiles/components/SecurityProfileDetailsSidePanel/SecurityProfileDetailsSidePanel.test.tsx b/src/features/security-profiles/components/SecurityProfileDetailsSidePanel/SecurityProfileDetailsSidePanel.test.tsx
index 551b385c2..8741ad396 100644
--- a/src/features/security-profiles/components/SecurityProfileDetailsSidePanel/SecurityProfileDetailsSidePanel.test.tsx
+++ b/src/features/security-profiles/components/SecurityProfileDetailsSidePanel/SecurityProfileDetailsSidePanel.test.tsx
@@ -2,6 +2,7 @@ import { renderWithProviders } from "@/tests/render";
 import { screen } from "@testing-library/react";
 import { describe, expect, it } from "vitest";
 import SecurityProfileDetailsSidePanel from "./SecurityProfileDetailsSidePanel";
+import { NO_DATA_TEXT } from "@/components/layout/NoData";
 
 describe("SecurityProfileDetailsSidePanel", () => {
   it("should render without data", async () => {
@@ -11,7 +12,7 @@ describe("SecurityProfileDetailsSidePanel", () => {
       "/?profile=7",
     );
 
-    expect((await screen.findAllByText("---"))[0]).toBeInTheDocument();
+    expect((await screen.findAllByText(NO_DATA_TEXT))[0]).toBeInTheDocument();
     expect(screen.getByText("As soon as possible")).toBeInTheDocument();
   });
 
diff --git a/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/components/SecurityProfileDownloadAuditForm/SecurityProfileDownloadAuditForm.tsx b/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/components/SecurityProfileDownloadAuditForm/SecurityProfileDownloadAuditForm.tsx
index 71a82cb8f..0dd62453b 100644
--- a/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/components/SecurityProfileDownloadAuditForm/SecurityProfileDownloadAuditForm.tsx
+++ b/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/components/SecurityProfileDownloadAuditForm/SecurityProfileDownloadAuditForm.tsx
@@ -93,8 +93,8 @@ const SecurityProfileDownloadAuditForm: FC<
   const formik = useFormik<SecurityProfileDownloadAuditFormValues>({
     initialValues: {
       audit_timeframe: "specific-date",
-      end_date: moment().format(INPUT_DATE_FORMAT),
-      start_date: moment().format(INPUT_DATE_FORMAT),
+      end_date: moment().utc().format(INPUT_DATE_FORMAT),
+      start_date: moment().utc().format(INPUT_DATE_FORMAT),
       level_of_detail: "summary-only",
     },
 
diff --git a/src/features/snaps/components/EditSnap/helpers.test.tsx b/src/features/snaps/components/EditSnap/helpers.test.tsx
new file mode 100644
index 000000000..1c8f804cd
--- /dev/null
+++ b/src/features/snaps/components/EditSnap/helpers.test.tsx
@@ -0,0 +1,123 @@
+import { render, screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import type * as Yup from "yup";
+import { installedSnaps } from "@/tests/mocks/snap";
+import { EditSnapType } from "../../helpers";
+import {
+  getEditSnapValidationSchema,
+  getSnapMessage,
+  getSuccessMessage,
+} from "./helpers";
+
+const SNAP_COUNT = 3;
+
+describe("EditSnap helpers", () => {
+  it("requires release for switch actions", async () => {
+    const schema = getEditSnapValidationSchema(EditSnapType.Switch);
+    const releaseSchema = schema.release as Yup.StringSchema;
+
+    await expect(releaseSchema.validate("")).rejects.toThrowError(
+      /release is required/i,
+    );
+    await expect(releaseSchema.validate("stable")).resolves.toBe("stable");
+  });
+
+  it("does not require release for non-switch actions", () => {
+    const holdSchema = getEditSnapValidationSchema(EditSnapType.Hold);
+    expect(holdSchema.release).toBeUndefined();
+  });
+
+  it("falls back to common schema for unsupported edit types", () => {
+    const schema = getEditSnapValidationSchema("unsupported" as EditSnapType);
+
+    expect(schema.release).toBeUndefined();
+    expect(schema.hold).toBeUndefined();
+  });
+
+  it("validates hold_until date values for hold actions", async () => {
+    const schema = getEditSnapValidationSchema(EditSnapType.Hold);
+    const holdUntilSchema = schema.hold_until as Yup.StringSchema;
+
+    await expect(holdUntilSchema.validate("")).resolves.toBe("");
+    await expect(holdUntilSchema.validate("not-a-date")).rejects.toThrowError(
+      /valid date and time/i,
+    );
+    await expect(
+      holdUntilSchema.validate("2030-01-01T00:00:00Z"),
+    ).resolves.toBe("2030-01-01T00:00:00Z");
+  });
+
+  it("returns null message for switch actions", () => {
+    expect(getSnapMessage(EditSnapType.Switch, [...installedSnaps])).toBeNull();
+  });
+
+  it("renders single-snap message with snap name interpolation", () => {
+    const node = getSnapMessage(EditSnapType.Refresh, [installedSnaps[0]]);
+
+    render(<>{node}</>);
+
+    expect(
+      screen.getByText(/update Snap 1 to the latest version available/i),
+    ).toBeInTheDocument();
+  });
+
+  it("renders multi-snap hold summary when held and unheld snaps are mixed", () => {
+    const node = getSnapMessage(EditSnapType.Hold, [...installedSnaps]);
+
+    const { container } = render(<>{node}</>);
+
+    expect(
+      screen.getByText(/holding a snap will pause automatic updates/i),
+    ).toBeInTheDocument();
+    expect(container).toHaveTextContent("You selected 4 snaps. This will:");
+    expect(container).toHaveTextContent("hold 2 snaps");
+    expect(container).toHaveTextContent("leave 2 snaps held");
+  });
+
+  it("renders compact multi-snap message when all selected snaps are already held", () => {
+    const allHeldSnaps = installedSnaps.map((snap) => ({
+      ...snap,
+      held_until: "2030-01-01T00:00:00Z",
+    }));
+
+    const node = getSnapMessage(EditSnapType.Hold, allHeldSnaps);
+
+    const { container } = render(<>{node}</>);
+
+    expect(container).toHaveTextContent(
+      "Holding a snap will pause automatic updates for that particular snap.",
+    );
+    expect(screen.queryByText(/you selected/i)).not.toBeInTheDocument();
+  });
+
+  it("renders multi-snap unhold summary when held and unheld snaps are mixed", () => {
+    const node = getSnapMessage(EditSnapType.Unhold, [...installedSnaps]);
+
+    const { container } = render(<>{node}</>);
+
+    expect(container).toHaveTextContent("You selected 4 snaps. This will:");
+    expect(container).toHaveTextContent("unhold 2 snaps");
+    expect(container).toHaveTextContent("leave 2 snaps unheld");
+  });
+
+  it("builds success copy for each action", () => {
+    expect(getSuccessMessage(SNAP_COUNT, EditSnapType.Refresh)).toContain(
+      "to be refreshed",
+    );
+    expect(getSuccessMessage(SNAP_COUNT, EditSnapType.Uninstall)).toContain(
+      "to be uninstalled",
+    );
+    expect(getSuccessMessage(SNAP_COUNT, EditSnapType.Hold)).toContain(
+      "to be held",
+    );
+    expect(getSuccessMessage(SNAP_COUNT, EditSnapType.Unhold)).toContain(
+      "to be unheld",
+    );
+  });
+
+  it("falls back to an empty verb for unsupported actions", () => {
+    expect(getSuccessMessage(1, "Unsupported" as EditSnapType)).toBe(
+      "You queued 1 snap to be updated.",
+    );
+  });
+});
diff --git a/src/features/snaps/components/EditSnap/helpers.tsx b/src/features/snaps/components/EditSnap/helpers.tsx
index a0ca800c6..e3913e26d 100644
--- a/src/features/snaps/components/EditSnap/helpers.tsx
+++ b/src/features/snaps/components/EditSnap/helpers.tsx
@@ -133,6 +133,7 @@ export const getSuccessMessage = (snapCount: number, action: EditSnapType) => {
       verb = "unheld";
       break;
     default:
+      verb = "updated";
       break;
   }
 
diff --git a/src/features/snaps/components/SnapsActions/SnapsActions.test.tsx b/src/features/snaps/components/SnapsActions/SnapsActions.test.tsx
index 96d71c9e9..03147f6ac 100644
--- a/src/features/snaps/components/SnapsActions/SnapsActions.test.tsx
+++ b/src/features/snaps/components/SnapsActions/SnapsActions.test.tsx
@@ -4,6 +4,8 @@ import { installedSnaps } from "@/tests/mocks/snap";
 import { renderWithProviders } from "@/tests/render";
 import { screen } from "@testing-library/react";
 import { describe } from "vitest";
+import userEvent from "@testing-library/user-event";
+import { PATHS, ROUTES } from "@/libs/routes";
 import { getSelectedSnaps } from "../../helpers";
 import SnapsActions from "./SnapsActions";
 
@@ -29,6 +31,7 @@ const mixedSelectedSnapIds = [
   ...snapData.multiple.heldSnaps,
   ...snapData.multiple.unheldSnaps,
 ];
+const INSTANCE_ID = 11;
 
 const tableSnapButtons = ["Install", "Hold", "Unhold", "Uninstall", "Refresh"];
 const formHeldSnapButtons = [
@@ -161,5 +164,182 @@ describe("SnapsActions", () => {
 
       expect(container).toHaveTexts(formUnheldSnapButtons);
     });
+
+    it("does not render switch channel button for multiple snaps in sidepanel", () => {
+      renderWithProviders(
+        <SnapsActions
+          installedSnaps={getSelectedSnaps(
+            installedSnaps,
+            mixedSelectedSnapIds,
+          )}
+          selectedSnapIds={mixedSelectedSnapIds}
+          sidePanel={true}
+        />,
+      );
+
+      expect(
+        screen.queryByRole("button", { name: "Switch channel" }),
+      ).not.toBeInTheDocument();
+    });
+
+    it("opens install snaps side panel from table actions", async () => {
+      const user = userEvent.setup();
+      renderWithProviders(
+        <SnapsActions
+          installedSnaps={getSelectedSnaps(installedSnaps, snapData.empty)}
+          selectedSnapIds={snapData.empty}
+        />,
+      );
+
+      await user.click(screen.getByRole("button", { name: "Install" }));
+
+      expect(
+        await screen.findByRole("heading", { name: "Install snaps" }),
+      ).toBeInTheDocument();
+    });
+
+    it("opens hold side panel for selected snaps", async () => {
+      const user = userEvent.setup();
+      renderWithProviders(
+        <SnapsActions
+          installedSnaps={getSelectedSnaps(
+            installedSnaps,
+            snapData.multiple.unheldSnaps,
+          )}
+          selectedSnapIds={snapData.multiple.unheldSnaps}
+        />,
+        undefined,
+        ROUTES.instances.details.single(INSTANCE_ID),
+        `/${PATHS.instances.root}/${PATHS.instances.single}`,
+      );
+
+      await user.click(screen.getByRole("button", { name: "Hold" }));
+
+      expect(
+        await screen.findByRole("heading", { name: /Hold \d+ snaps/i }),
+      ).toBeInTheDocument();
+    });
+
+    it("opens uninstall side panel for selected snaps", async () => {
+      const user = userEvent.setup();
+
+      renderWithProviders(
+        <SnapsActions
+          installedSnaps={getSelectedSnaps(
+            installedSnaps,
+            snapData.multiple.unheldSnaps,
+          )}
+          selectedSnapIds={snapData.multiple.unheldSnaps}
+        />,
+        undefined,
+        ROUTES.instances.details.single(INSTANCE_ID),
+        `/${PATHS.instances.root}/${PATHS.instances.single}`,
+      );
+
+      await user.click(screen.getByRole("button", { name: "Uninstall" }));
+
+      expect(
+        await screen.findByRole("heading", { name: /Uninstall \d+ snaps/i }),
+      ).toBeInTheDocument();
+    });
+
+    it("opens unhold side panel using held snap count", async () => {
+      const user = userEvent.setup();
+
+      renderWithProviders(
+        <SnapsActions
+          installedSnaps={getSelectedSnaps(
+            installedSnaps,
+            mixedSelectedSnapIds,
+          )}
+          selectedSnapIds={mixedSelectedSnapIds}
+        />,
+        undefined,
+        ROUTES.instances.details.single(INSTANCE_ID),
+        `/${PATHS.instances.root}/${PATHS.instances.single}`,
+      );
+
+      await user.click(screen.getByRole("button", { name: "Unhold" }));
+
+      expect(
+        await screen.findByRole("heading", {
+          name: new RegExp(
+            `Unhold ${snapData.multiple.heldSnaps.length} snaps`,
+            "i",
+          ),
+        }),
+      ).toBeInTheDocument();
+    });
+
+    it("opens refresh side panel for selected snaps", async () => {
+      const user = userEvent.setup();
+
+      renderWithProviders(
+        <SnapsActions
+          installedSnaps={getSelectedSnaps(
+            installedSnaps,
+            snapData.multiple.unheldSnaps,
+          )}
+          selectedSnapIds={snapData.multiple.unheldSnaps}
+        />,
+        undefined,
+        ROUTES.instances.details.single(INSTANCE_ID),
+        `/${PATHS.instances.root}/${PATHS.instances.single}`,
+      );
+
+      await user.click(screen.getByRole("button", { name: "Refresh" }));
+
+      expect(
+        await screen.findByRole("heading", { name: /Refresh \d+ snaps/i }),
+      ).toBeInTheDocument();
+    });
+
+    it("opens switch channel side panel for held snap in sidepanel mode", async () => {
+      const user = userEvent.setup();
+      const heldSnap = installedSnaps.find((snap) => snap.held_until !== null);
+      assert(heldSnap);
+
+      renderWithProviders(
+        <SnapsActions
+          installedSnaps={[heldSnap]}
+          selectedSnapIds={[heldSnap.snap.id]}
+          sidePanel={true}
+        />,
+        undefined,
+        ROUTES.instances.details.single(INSTANCE_ID),
+        `/${PATHS.instances.root}/${PATHS.instances.single}`,
+      );
+
+      await user.click(screen.getByRole("button", { name: "Switch channel" }));
+
+      expect(
+        await screen.findByRole("heading", { name: /Switch .*'s channel/i }),
+      ).toBeInTheDocument();
+    });
+
+    it("opens uninstall side panel with single snap title in sidepanel mode", async () => {
+      const user = userEvent.setup();
+      const heldSnap = installedSnaps.find((snap) => snap.held_until !== null);
+      assert(heldSnap);
+
+      renderWithProviders(
+        <SnapsActions
+          installedSnaps={[heldSnap]}
+          selectedSnapIds={[heldSnap.snap.id]}
+          sidePanel={true}
+        />,
+        undefined,
+        ROUTES.instances.details.single(INSTANCE_ID),
+        `/${PATHS.instances.root}/${PATHS.instances.single}`,
+      );
+
+      await user.click(screen.getByRole("button", { name: "Uninstall" }));
+
+      expect(
+        await screen.findByRole("heading", {
+          name: `Uninstall ${heldSnap.snap.name}`,
+        }),
+      ).toBeInTheDocument();
+    });
   });
 });
diff --git a/src/features/ubuntupro/components/DetachTokenModal/DetachTokenModal.test.tsx b/src/features/ubuntupro/components/DetachTokenModal/DetachTokenModal.test.tsx
index fc747906b..4a67e0810 100644
--- a/src/features/ubuntupro/components/DetachTokenModal/DetachTokenModal.test.tsx
+++ b/src/features/ubuntupro/components/DetachTokenModal/DetachTokenModal.test.tsx
@@ -3,6 +3,7 @@ import userEvent from "@testing-library/user-event";
 import type { ComponentProps } from "react";
 import { describe, expect, it, vi } from "vitest";
 import { renderWithProviders } from "@/tests/render";
+import { setEndpointStatus } from "@/tests/controllers/controller";
 import DetachTokenModal from "./DetachTokenModal";
 
 describe("DetachTokenModal", () => {
@@ -64,6 +65,26 @@ describe("DetachTokenModal", () => {
     expect(screen.getByText("Detach Ubuntu Pro token")).toBeInTheDocument();
   });
 
+  it("shows notification title using custom instance title", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <DetachTokenModal {...props} instanceTitle="Test Server" />,
+    );
+
+    await user.type(
+      screen.getByPlaceholderText("detach ubuntu pro token"),
+      "detach ubuntu pro token",
+    );
+    await user.click(screen.getByRole("button", { name: /^detach$/i }));
+
+    expect(
+      await screen.findByText(
+        "You queued detachment of Ubuntu Pro token for instance Test Server.",
+      ),
+    ).toBeInTheDocument();
+  });
+
   it("uses instanceCount when provided instead of computerIds length", () => {
     renderWithProviders(
       <DetachTokenModal {...props} computerIds={[1, 2]} instanceCount={5} />,
@@ -92,4 +113,97 @@ describe("DetachTokenModal", () => {
     expect(detachButton).toBeInTheDocument();
     expect(detachButton).toHaveClass("p-button--negative");
   });
+
+  it("keeps detach action disabled until confirmation text is entered", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<DetachTokenModal {...props} />);
+
+    const detachButton = screen.getByRole("button", { name: /^detach$/i });
+    expect(detachButton).toHaveAttribute("aria-disabled", "true");
+
+    await user.type(
+      screen.getByPlaceholderText("detach ubuntu pro token"),
+      "detach ubuntu pro token",
+    );
+
+    expect(detachButton).toBeEnabled();
+  });
+
+  it("submits detachment and closes modal after confirmation", async () => {
+    const user = userEvent.setup();
+    const onClose = vi.fn();
+
+    renderWithProviders(<DetachTokenModal {...props} onClose={onClose} />);
+
+    await user.type(
+      screen.getByPlaceholderText("detach ubuntu pro token"),
+      "detach ubuntu pro token",
+    );
+    await user.click(screen.getByRole("button", { name: /^detach$/i }));
+
+    expect(
+      await screen.findByText(/queued detachment of Ubuntu Pro token/i),
+    ).toBeInTheDocument();
+    expect(onClose).toHaveBeenCalled();
+  });
+
+  it("opens activity details from success notification action", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<DetachTokenModal {...props} />);
+
+    await user.type(
+      screen.getByPlaceholderText("detach ubuntu pro token"),
+      "detach ubuntu pro token",
+    );
+    await user.click(screen.getByRole("button", { name: /^detach$/i }));
+
+    await user.click(
+      await screen.findByRole("button", { name: "View details" }),
+    );
+
+    expect(
+      await screen.findByRole("heading", {
+        name: "Start instance Bionic WSL 1",
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it("shows plural success text when no instance title is provided", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<DetachTokenModal {...props} computerIds={[1, 2]} />);
+
+    await user.type(
+      screen.getByPlaceholderText("detach ubuntu pro token"),
+      "detach ubuntu pro token",
+    );
+    await user.click(screen.getByRole("button", { name: /^detach$/i }));
+
+    expect(
+      await screen.findByText(
+        "This will disconnect the instances from their subscription and pause any enabled Pro services.",
+      ),
+    ).toBeInTheDocument();
+  });
+
+  it("handles detach-token failure via debug notification", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "error", path: "detach-token" });
+
+    const onClose = vi.fn();
+    renderWithProviders(<DetachTokenModal {...props} onClose={onClose} />);
+
+    await user.type(
+      screen.getByPlaceholderText("detach ubuntu pro token"),
+      "detach ubuntu pro token",
+    );
+    await user.click(screen.getByRole("button", { name: /^detach$/i }));
+
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+    expect(onClose).toHaveBeenCalled();
+  });
 });
diff --git a/src/features/upgrades/components/Upgrades/Upgrades.test.tsx b/src/features/upgrades/components/Upgrades/Upgrades.test.tsx
index fa7b0730f..b08adea85 100644
--- a/src/features/upgrades/components/Upgrades/Upgrades.test.tsx
+++ b/src/features/upgrades/components/Upgrades/Upgrades.test.tsx
@@ -1,11 +1,17 @@
-import { describe } from "vitest";
+import { beforeEach, describe, expect, it } from "vitest";
 import { screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { instances } from "@/tests/mocks/instance";
+import { setEndpointStatus } from "@/tests/controllers/controller";
+import { expectErrorNotification } from "@/tests/helpers";
 import { renderWithProviders } from "@/tests/render";
 import Upgrades from "./Upgrades";
 
 describe("Upgrades", () => {
+  beforeEach(() => {
+    setEndpointStatus("default");
+  });
+
   it("should render tabs", async () => {
     renderWithProviders(<Upgrades selectedInstances={instances} />);
 
@@ -58,4 +64,116 @@ describe("Upgrades", () => {
       await screen.findByText(/Showing \d of \d+ security issues/i),
     ).toBeInTheDocument();
   });
+
+  it("submits package upgrades from default tab", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<Upgrades selectedInstances={instances} />);
+
+    await user.click(screen.getByRole("button", { name: "Upgrade" }));
+
+    expect(
+      await screen.findByText("You queued packages to be upgraded"),
+    ).toBeInTheDocument();
+  });
+
+  it("submits USN upgrades when USNs tab is selected", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<Upgrades selectedInstances={instances} />);
+
+    await user.click(screen.getByRole("tab", { name: /usns/i }));
+    await user.click(screen.getByRole("button", { name: "Upgrade" }));
+
+    expect(
+      await screen.findByText("You queued packages to be upgraded"),
+    ).toBeInTheDocument();
+  });
+
+  it("renders only instances and packages tabs when no security upgrades exist", () => {
+    const noSecurityUpgradeInstances = instances.map((instance) => ({
+      ...instance,
+      alerts: (instance.alerts ?? []).filter(
+        ({ type }) => type !== "SecurityUpgradesAlert",
+      ),
+    }));
+
+    renderWithProviders(
+      <Upgrades selectedInstances={noSecurityUpgradeInstances} />,
+    );
+
+    expect(screen.getByRole("tab", { name: /instances/i })).toBeInTheDocument();
+    expect(screen.getByRole("tab", { name: /packages/i })).toBeInTheDocument();
+    expect(
+      screen.queryByRole("tab", { name: /usns/i }),
+    ).not.toBeInTheDocument();
+  });
+
+  it("shows singular success message when upgrading one instance", async () => {
+    const user = userEvent.setup();
+    const [singleInstance] = instances;
+    assert(singleInstance);
+
+    renderWithProviders(<Upgrades selectedInstances={[singleInstance]} />);
+
+    await user.click(screen.getByRole("button", { name: "Upgrade" }));
+
+    expect(
+      await screen.findByText(/Packages on 1 instance will be upgraded/i),
+    ).toBeInTheDocument();
+  });
+
+  it("handles package-upgrade submission errors", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<Upgrades selectedInstances={instances} />);
+
+    setEndpointStatus("error");
+    await user.click(screen.getByRole("button", { name: "Upgrade" }));
+
+    await expectErrorNotification();
+  });
+
+  it("handles usn-upgrade submission errors", async () => {
+    const user = userEvent.setup();
+    renderWithProviders(<Upgrades selectedInstances={instances} />);
+
+    await user.click(screen.getByRole("tab", { name: /usns/i }));
+    setEndpointStatus("error");
+    await user.click(screen.getByRole("button", { name: "Upgrade" }));
+
+    await expectErrorNotification();
+  });
+
+  it("updates excluded package list from packages tab interaction", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<Upgrades selectedInstances={instances} />);
+
+    await user.click(screen.getByRole("tab", { name: /packages/i }));
+    await user.click(
+      screen.getByRole("checkbox", { name: /toggle all packages/i }),
+    );
+    await user.click(screen.getByRole("button", { name: "Upgrade" }));
+
+    expect(
+      await screen.findByText("You queued packages to be upgraded"),
+    ).toBeInTheDocument();
+  });
+
+  it("updates excluded usn list from usns tab interaction", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<Upgrades selectedInstances={instances} />);
+
+    await user.click(screen.getByRole("tab", { name: /usns/i }));
+    await user.click(
+      screen.getByRole("checkbox", { name: /toggle all security issues/i }),
+    );
+    await user.click(screen.getByRole("button", { name: "Upgrade" }));
+
+    expect(
+      await screen.findByText("You queued packages to be upgraded"),
+    ).toBeInTheDocument();
+  });
 });
diff --git a/src/features/upgrades/components/Upgrades/Upgrades.tsx b/src/features/upgrades/components/Upgrades/Upgrades.tsx
index 1b9e91b71..dbbe9eaec 100644
--- a/src/features/upgrades/components/Upgrades/Upgrades.tsx
+++ b/src/features/upgrades/components/Upgrades/Upgrades.tsx
@@ -77,6 +77,10 @@ const Upgrades: FC<UpgradesProps> = ({ selectedInstances }) => {
     validationSchema: VALIDATION_SCHEMA,
   });
 
+  const handleExcludedPackagesChange = async (
+    newExcludedPackages: UpgradesFormProps["excludedPackages"],
+  ) => formik.setFieldValue("excludedPackages", newExcludedPackages);
+
   return (
     <Form onSubmit={formik.handleSubmit}>
       <UpgradeInfo instances={selectedInstances} />
@@ -98,9 +102,7 @@ const Upgrades: FC<UpgradesProps> = ({ selectedInstances }) => {
               <TAB_PANELS.instances
                 excludedPackages={formik.values.excludedPackages}
                 instances={affectedInstances}
-                onExcludedPackagesChange={async (newExcludedPackages) =>
-                  formik.setFieldValue("excludedPackages", newExcludedPackages)
-                }
+                onExcludedPackagesChange={handleExcludedPackagesChange}
               />
             </Suspense>
           )}
@@ -109,9 +111,7 @@ const Upgrades: FC<UpgradesProps> = ({ selectedInstances }) => {
               <TAB_PANELS.packages
                 excludedPackages={formik.values.excludedPackages}
                 instances={affectedInstances}
-                onExcludedPackagesChange={async (newExcludedPackages) =>
-                  formik.setFieldValue("excludedPackages", newExcludedPackages)
-                }
+                onExcludedPackagesChange={handleExcludedPackagesChange}
               />
             </Suspense>
           )}
diff --git a/src/features/welcome-banner/WelcomePopup/WelcomePopup.test.tsx b/src/features/welcome-banner/WelcomePopup/WelcomePopup.test.tsx
index b397eead1..0a88fd7be 100644
--- a/src/features/welcome-banner/WelcomePopup/WelcomePopup.test.tsx
+++ b/src/features/welcome-banner/WelcomePopup/WelcomePopup.test.tsx
@@ -29,24 +29,22 @@ describe("WelcomePopup", () => {
   });
 
   it("should close and save in local storage", async () => {
+    const user = userEvent.setup();
     renderWithProviders(<WelcomePopup />);
 
-    await waitFor(async () => {
-      const closeButton = screen.getByRole("button", {
-        name: /got it!/i,
-      });
-
-      expect(closeButton).toBeInTheDocument();
-
-      await userEvent.click(closeButton);
+    const closeButton = await screen.findByRole("button", {
+      name: /got it!/i,
+    });
+    await user.click(closeButton);
 
+    await waitFor(() => {
       expect(
         screen.queryByText("Landscape web portal (Preview)"),
       ).not.toBeInTheDocument();
-
-      expect(localStorage.getItem("_landscape_isWelcomePopupClosed")).toBe(
-        "true",
-      );
     });
+
+    expect(localStorage.getItem("_landscape_isWelcomePopupClosed")).toBe(
+      "true",
+    );
   });
 });
diff --git a/src/features/wsl/components/WslInstancesHeader/WslInstancesHeader.test.tsx b/src/features/wsl/components/WslInstancesHeader/WslInstancesHeader.test.tsx
index 2b715ea98..d52cc1556 100644
--- a/src/features/wsl/components/WslInstancesHeader/WslInstancesHeader.test.tsx
+++ b/src/features/wsl/components/WslInstancesHeader/WslInstancesHeader.test.tsx
@@ -1,8 +1,15 @@
 import { screen } from "@testing-library/react";
 import { describe, it, expect } from "vitest";
+import userEvent from "@testing-library/user-event";
+import { PATHS, ROUTES } from "@/libs/routes";
+import { setEndpointStatus } from "@/tests/controllers/controller";
 import { renderWithProviders } from "@/tests/render";
 import WslInstancesHeader from "./WslInstancesHeader";
-import { instanceChildren } from "@/tests/mocks/wsl";
+import {
+  instanceChildren,
+  noncompliantInstanceChild,
+  uninstalledInstanceChild,
+} from "@/tests/mocks/wsl";
 import { windowsInstance } from "@/tests/mocks/instance";
 
 describe("WslInstancesHeader", () => {
@@ -61,4 +68,127 @@ describe("WslInstancesHeader", () => {
       screen.getByRole("button", { name: /reinstall/i }),
     ).toBeInTheDocument();
   });
+
+  it("disables install action when selected instance is not uninstalled", () => {
+    renderWithProviders(
+      <WslInstancesHeader
+        windowsInstance={windowsInstance}
+        selectedWslInstances={[instanceChildren[0]]}
+        wslInstances={instanceChildren}
+      />,
+    );
+
+    expect(screen.getByRole("button", { name: /^install$/i })).toHaveAttribute(
+      "aria-disabled",
+      "true",
+    );
+  });
+
+  it("disables uninstall action when selected instance is already not installed", () => {
+    renderWithProviders(
+      <WslInstancesHeader
+        windowsInstance={windowsInstance}
+        selectedWslInstances={[instanceChildren[1]]}
+        wslInstances={instanceChildren}
+      />,
+    );
+
+    expect(
+      screen.getByRole("button", { name: /^uninstall$/i }),
+    ).toHaveAttribute("aria-disabled", "true");
+  });
+
+  it("opens create new instance side panel", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <WslInstancesHeader
+        windowsInstance={windowsInstance}
+        selectedWslInstances={[]}
+        wslInstances={instanceChildren}
+      />,
+      undefined,
+      ROUTES.instances.details.single(windowsInstance.id),
+      `/${PATHS.instances.root}/${PATHS.instances.single}`,
+    );
+
+    await user.click(
+      screen.getByRole("button", { name: /create new instance/i }),
+    );
+
+    expect(
+      await screen.findByRole("heading", { name: "Create new WSL instance" }),
+    ).toBeInTheDocument();
+  });
+
+  it("opens reinstall modal for a noncompliant selection", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <WslInstancesHeader
+        windowsInstance={windowsInstance}
+        selectedWslInstances={[noncompliantInstanceChild]}
+        wslInstances={instanceChildren}
+      />,
+      undefined,
+      ROUTES.instances.details.single(windowsInstance.id),
+      `/${PATHS.instances.root}/${PATHS.instances.single}`,
+    );
+
+    await user.click(screen.getByRole("button", { name: /^reinstall$/i }));
+
+    expect(
+      screen.getByRole("heading", {
+        name: `Reinstall ${noncompliantInstanceChild.name}`,
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it("submits install for selected uninstalled instances", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <WslInstancesHeader
+        windowsInstance={windowsInstance}
+        selectedWslInstances={[uninstalledInstanceChild]}
+        wslInstances={instanceChildren}
+      />,
+      undefined,
+      ROUTES.instances.details.single(windowsInstance.id),
+      `/${PATHS.instances.root}/${PATHS.instances.single}`,
+    );
+
+    await user.click(screen.getByRole("button", { name: /^install$/i }));
+
+    expect(
+      await screen.findByText(
+        /successfully queued "WSL instance associated with profile, not installed, installation in progress" to be installed/i,
+      ),
+    ).toBeInTheDocument();
+  });
+
+  it("shows endpoint error when install request fails", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({
+      status: "error",
+      path: "child-instance-profiles/:name:reapply",
+    });
+
+    renderWithProviders(
+      <WslInstancesHeader
+        windowsInstance={windowsInstance}
+        selectedWslInstances={[uninstalledInstanceChild]}
+        wslInstances={instanceChildren}
+      />,
+      undefined,
+      ROUTES.instances.details.single(windowsInstance.id),
+      `/${PATHS.instances.root}/${PATHS.instances.single}`,
+    );
+
+    await user.click(screen.getByRole("button", { name: /^install$/i }));
+
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+  });
 });
diff --git a/src/main.test.tsx b/src/main.test.tsx
new file mode 100644
index 000000000..f6935aecb
--- /dev/null
+++ b/src/main.test.tsx
@@ -0,0 +1,100 @@
+import { describe, expect, it, vi } from "vitest";
+import { getSentryConfig, renderApp, startApp } from "./main";
+import type { createRoot } from "react-dom/client";
+
+describe("main", () => {
+  it("starts worker in dev when enabled and renders app", async () => {
+    const workerStart = vi.fn();
+    const loadWorker = vi.fn(async () => ({
+      worker: { start: workerStart },
+    }));
+    const render = vi.fn();
+
+    await startApp({
+      mode: "development",
+      isDevEnv: true,
+      isMswEnabled: true,
+      loadWorker,
+      render,
+    });
+
+    expect(loadWorker).toHaveBeenCalledTimes(1);
+    expect(workerStart).toHaveBeenCalledTimes(1);
+    expect(render).toHaveBeenCalledTimes(1);
+  });
+
+  it("does not start worker when msw is disabled", async () => {
+    const loadWorker = vi.fn();
+    const render = vi.fn();
+
+    await startApp({
+      mode: "development",
+      isDevEnv: true,
+      isMswEnabled: false,
+      loadWorker,
+      render,
+    });
+
+    expect(loadWorker).not.toHaveBeenCalled();
+    expect(render).toHaveBeenCalledTimes(1);
+  });
+
+  it("does not start worker outside dev", async () => {
+    const loadWorker = vi.fn();
+    const render = vi.fn();
+
+    await startApp({
+      mode: "development",
+      isDevEnv: false,
+      isMswEnabled: true,
+      loadWorker,
+      render,
+    });
+
+    expect(loadWorker).not.toHaveBeenCalled();
+    expect(render).toHaveBeenCalledTimes(1);
+  });
+
+  it("does not bootstrap app in test mode", async () => {
+    const loadWorker = vi.fn();
+    const render = vi.fn();
+
+    await startApp({
+      mode: "test",
+      isDevEnv: true,
+      isMswEnabled: true,
+      loadWorker,
+      render,
+    });
+
+    expect(loadWorker).not.toHaveBeenCalled();
+    expect(render).not.toHaveBeenCalled();
+  });
+
+  it("renders app root", () => {
+    const render = vi.fn();
+    const createAppRoot = vi.fn(() => ({ render }));
+    const container = document.createElement("div");
+
+    renderApp(createAppRoot as unknown as typeof createRoot, container);
+
+    expect(createAppRoot).toHaveBeenCalledWith(container);
+    expect(render).toHaveBeenCalledTimes(1);
+  });
+
+  it("builds sentry config for fallback release and production", () => {
+    const config = getSentryConfig("", false);
+
+    expect(config.release).toBe("local-dev");
+    expect(config.environment).toBe("production");
+    expect(config.enabled).toBe(true);
+  });
+
+  it("builds sentry config for explicit release and development", () => {
+    const config = getSentryConfig("1.2.3", true);
+
+    expect(config.release).toBe("1.2.3");
+    expect(config.environment).toBe("development");
+    expect(config.enabled).toBe(false);
+  });
+});
diff --git a/src/main.tsx b/src/main.tsx
index d6b96f80f..4dd930d86 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -13,21 +13,31 @@ import { AppProviders } from "@/providers/AppProviders";
 import App from "./App";
 import { BrowserRouter } from "react-router";
 
-Sentry.init({
+export const getSentryConfig = (
+  appVersion = APP_VERSION,
+  isDevEnv = IS_DEV_ENV,
+) => ({
   dsn: "https://774322e0f66e6944afb57769632eca62@o4510662863749120.ingest.de.sentry.io/4510674271338576",
-  release: APP_VERSION || "local-dev",
-  environment: IS_DEV_ENV ? "development" : "production",
-  enabled: !IS_DEV_ENV,
+  release: appVersion || "local-dev",
+  environment: isDevEnv ? "development" : "production",
+  enabled: !isDevEnv,
 });
 
-const initApp = async () => {
-  if (IS_DEV_ENV && IS_MSW_ENABLED) {
-    const { worker } = await import("@/tests/browser");
-    await worker.start();
-  }
+Sentry.init(getSentryConfig());
+
+type WorkerLoader = () => Promise<{
+  worker: {
+    start: () => Promise<unknown> | unknown;
+  };
+}>;
 
-  const container = document.getElementById("root") as HTMLElement;
-  const root = createRoot(container);
+const defaultLoadWorker: WorkerLoader = () => import("@/tests/browser");
+
+export const renderApp = (
+  createAppRoot: typeof createRoot = createRoot,
+  container = document.getElementById("root") as HTMLElement,
+) => {
+  const root = createAppRoot(container);
 
   root.render(
     <StrictMode>
@@ -42,4 +52,33 @@ const initApp = async () => {
   );
 };
 
-initApp();
+interface StartAppOptions {
+  mode?: string;
+  isDevEnv?: boolean;
+  isMswEnabled?: boolean;
+  loadWorker?: WorkerLoader;
+  render?: () => void;
+}
+
+export const startApp = async ({
+  mode = import.meta.env.MODE,
+  isDevEnv = IS_DEV_ENV,
+  isMswEnabled = IS_MSW_ENABLED,
+  loadWorker = defaultLoadWorker,
+  render = () => {
+    renderApp();
+  },
+}: StartAppOptions = {}) => {
+  if (mode === "test") {
+    return;
+  }
+
+  if (isDevEnv && isMswEnabled) {
+    const { worker } = await loadWorker();
+    await worker.start();
+  }
+
+  render();
+};
+
+void startApp();
diff --git a/src/pages/PageNotFound.test.tsx b/src/pages/PageNotFound.test.tsx
new file mode 100644
index 000000000..f1990113f
--- /dev/null
+++ b/src/pages/PageNotFound.test.tsx
@@ -0,0 +1,21 @@
+import { screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import { PATHS } from "@/libs/routes";
+import { renderWithProviders } from "@/tests/render";
+import PageNotFound from "./PageNotFound";
+
+describe("PageNotFound", () => {
+  it("renders not found content and home link", () => {
+    renderWithProviders(<PageNotFound />);
+
+    expect(screen.getByText("Page not found")).toBeInTheDocument();
+    expect(
+      screen.getByText("It seems that page you're looking for doesn't exist."),
+    ).toBeInTheDocument();
+
+    const homeLink = screen.getByRole("link", {
+      name: "Go back to the home page",
+    });
+    expect(homeLink).toHaveAttribute("href", PATHS.root.root);
+  });
+});
diff --git a/src/pages/dashboard/account/AccountPage.test.tsx b/src/pages/dashboard/account/AccountPage.test.tsx
new file mode 100644
index 000000000..348e70eee
--- /dev/null
+++ b/src/pages/dashboard/account/AccountPage.test.tsx
@@ -0,0 +1,29 @@
+import { screen, waitFor } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+import { ROUTES } from "@/libs/routes";
+import { renderWithProviders } from "@/tests/render";
+import AccountPage from "./AccountPage";
+
+const navigate = vi.fn();
+
+vi.mock("react-router", async () => {
+  const actual = await vi.importActual("react-router");
+  return {
+    ...actual,
+    useNavigate: () => navigate,
+  };
+});
+
+describe("AccountPage", () => {
+  it("redirects to account general settings", async () => {
+    renderWithProviders(<AccountPage />);
+
+    await waitFor(() => {
+      expect(navigate).toHaveBeenCalledWith(ROUTES.account.general(), {
+        replace: true,
+      });
+    });
+
+    expect(screen.queryByRole("heading")).not.toBeInTheDocument();
+  });
+});
diff --git a/src/pages/dashboard/account/alerts/AlertsPage.test.tsx b/src/pages/dashboard/account/alerts/AlertsPage.test.tsx
new file mode 100644
index 000000000..49f700a11
--- /dev/null
+++ b/src/pages/dashboard/account/alerts/AlertsPage.test.tsx
@@ -0,0 +1,26 @@
+import { screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import { PATHS, ROUTES } from "@/libs/routes";
+import { renderWithProviders } from "@/tests/render";
+import AlertsPage from "./AlertsPage";
+
+describe("AlertsPage", () => {
+  it("renders alerts table content", async () => {
+    renderWithProviders(
+      <AlertsPage />,
+      undefined,
+      ROUTES.account.alerts(),
+      `/${PATHS.account.root}/${PATHS.account.alerts}`,
+    );
+
+    expect(screen.getByRole("heading", { name: "Alerts" })).toBeInTheDocument();
+    expect(
+      await screen.findByText("Computer Duplicate Alert"),
+    ).toBeInTheDocument();
+    expect(screen.getAllByRole("switch").length).toBeGreaterThan(0);
+    expect(
+      screen.getAllByRole("combobox", { name: "Select tags" }).length,
+    ).toBeGreaterThan(0);
+    expect(screen.queryByText("License Seats Alert")).not.toBeInTheDocument();
+  });
+});
diff --git a/src/pages/dashboard/account/alerts/AlertsPage.tsx b/src/pages/dashboard/account/alerts/AlertsPage.tsx
index 47d848239..e2ea2d2a1 100644
--- a/src/pages/dashboard/account/alerts/AlertsPage.tsx
+++ b/src/pages/dashboard/account/alerts/AlertsPage.tsx
@@ -23,12 +23,11 @@ const AlertsPage: FC = () => {
     [getAlertsQueryResult],
   );
 
-  const tagOptions: MultiSelectItem[] =
-    tags.map((tag) => ({
-      label: tag,
-      value: tag,
-      group: "Tags",
-    })) ?? [];
+  const tagOptions: MultiSelectItem[] = tags.map((tag) => ({
+    label: tag,
+    value: tag,
+    group: "Tags",
+  }));
 
   const availableTagOptions = [
     { label: "All instances", value: "All" },
@@ -40,7 +39,7 @@ const AlertsPage: FC = () => {
       <PageHeader title="Alerts" />
       <PageContent hasTable>
         {isLoading && <LoadingState />}
-        {!isLoading && alerts && (
+        {!isLoading && (
           <AlertsList
             alerts={alerts}
             availableTagOptions={availableTagOptions}
diff --git a/src/pages/dashboard/account/api-credentials/ApiCredentials.test.tsx b/src/pages/dashboard/account/api-credentials/ApiCredentials.test.tsx
new file mode 100644
index 000000000..f61955fcc
--- /dev/null
+++ b/src/pages/dashboard/account/api-credentials/ApiCredentials.test.tsx
@@ -0,0 +1,23 @@
+import { screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import { expectLoadingState } from "@/tests/helpers";
+import { renderWithProviders } from "@/tests/render";
+import ApiCredentials from "./ApiCredentials";
+import { userDetails } from "@/tests/mocks/user";
+
+describe("ApiCredentials", () => {
+  it("renders API credentials table when user and credentials are loaded", async () => {
+    renderWithProviders(<ApiCredentials />);
+
+    expect(
+      screen.getByRole("heading", { name: "API credentials" }),
+    ).toBeInTheDocument();
+    await expectLoadingState();
+
+    const numberOfAccounts = userDetails.accounts.length;
+
+    expect(screen.getAllByText("Generate API credentials")).toHaveLength(
+      numberOfAccounts,
+    );
+  });
+});
diff --git a/src/pages/dashboard/activities/ActivitiesPage.test.tsx b/src/pages/dashboard/activities/ActivitiesPage.test.tsx
new file mode 100644
index 000000000..f13fc7e39
--- /dev/null
+++ b/src/pages/dashboard/activities/ActivitiesPage.test.tsx
@@ -0,0 +1,38 @@
+import { screen } from "@testing-library/react";
+import { beforeEach, describe, expect, it } from "vitest";
+import { setEndpointStatus } from "@/tests/controllers/controller";
+import { expectLoadingState } from "@/tests/helpers";
+import { renderWithProviders } from "@/tests/render";
+import ActivitiesPage from "./ActivitiesPage";
+
+describe("ActivitiesPage", () => {
+  beforeEach(() => {
+    setEndpointStatus("default");
+  });
+
+  it("renders activities page content with list data", async () => {
+    renderWithProviders(<ActivitiesPage />);
+
+    await expectLoadingState();
+
+    expect(
+      screen.getByRole("heading", { name: "Activities" }),
+    ).toBeInTheDocument();
+    expect(screen.getByRole("table")).toBeInTheDocument();
+    expect(screen.queryByText("No activities found")).not.toBeInTheDocument();
+  });
+
+  it("shows empty state when activities endpoint is empty", async () => {
+    setEndpointStatus({ status: "empty", path: "activities" });
+
+    renderWithProviders(<ActivitiesPage />);
+
+    await expectLoadingState();
+
+    expect(screen.getByText("No activities found")).toBeInTheDocument();
+    expect(
+      screen.getByText("There are no activities yet."),
+    ).toBeInTheDocument();
+    expect(screen.queryByRole("table")).not.toBeInTheDocument();
+  });
+});
diff --git a/src/pages/dashboard/instances/InstancesPage/helpers.test.ts b/src/pages/dashboard/instances/InstancesPage/helpers.test.ts
new file mode 100644
index 000000000..bfa5c64e8
--- /dev/null
+++ b/src/pages/dashboard/instances/InstancesPage/helpers.test.ts
@@ -0,0 +1,86 @@
+import { describe, expect, it } from "vitest";
+import { FILTERS } from "@/features/instances";
+import { getOptionQuery, getQuery } from "./helpers";
+
+const windowsOption = FILTERS.os.options.find(
+  (option) => option.value === "windows",
+);
+const offlineStatusOption = FILTERS.status.options.find(
+  (option) => option.value === "computer-offline",
+);
+const contractOption = FILTERS.contractExpiryDays.options.find(
+  (option) => option.value === "30",
+);
+
+assert(windowsOption);
+assert(offlineStatusOption);
+assert(contractOption);
+
+describe("InstancesPage helpers", () => {
+  it("returns option query for select filters", () => {
+    expect(getOptionQuery(FILTERS.os, windowsOption.value)).toBe(
+      windowsOption.query,
+    );
+  });
+
+  it("returns empty string when select option does not exist", () => {
+    expect(getOptionQuery(FILTERS.os, "missing-option")).toBe("");
+  });
+
+  it("returns empty query for non-select filters", () => {
+    expect(getOptionQuery(FILTERS.wsl, "parent")).toBe("");
+  });
+
+  it("builds combined search query from all active filters", () => {
+    const query = getQuery({
+      os: windowsOption.value,
+      status: offlineStatusOption.value,
+      contractExpiryDays: contractOption.value,
+      query: "name:web,annotation:prod",
+      tags: ["db", "prod"],
+      accessGroups: ["global", "ops"],
+      availabilityZones: ["eu-west-1a", "eu-west-1b"],
+    });
+
+    expect(query).toBe(
+      [
+        windowsOption.query,
+        getOptionQuery(FILTERS.status, offlineStatusOption.value),
+        getOptionQuery(FILTERS.contractExpiryDays, contractOption.value),
+        "name:web",
+        "annotation:prod",
+        "tag:db OR tag:prod",
+        "access-group:global OR access-group:ops",
+        "availability-zone:eu-west-1a OR availability-zone:eu-west-1b",
+      ].join(" "),
+    );
+  });
+
+  it("uses null availability zone query when none is selected", () => {
+    const query = getQuery({
+      os: "",
+      status: "",
+      contractExpiryDays: "",
+      query: "",
+      tags: [],
+      accessGroups: [],
+      availabilityZones: ["none"],
+    });
+
+    expect(query).toBe("availability-zone:null");
+  });
+
+  it("omits availability zone when none are selected", () => {
+    const query = getQuery({
+      os: windowsOption.value,
+      status: "",
+      contractExpiryDays: "",
+      query: "",
+      tags: [],
+      accessGroups: [],
+      availabilityZones: [],
+    });
+
+    expect(query).toBe(windowsOption.query);
+  });
+});
diff --git a/src/pages/dashboard/instances/ReportForm/ReportForm.test.tsx b/src/pages/dashboard/instances/ReportForm/ReportForm.test.tsx
new file mode 100644
index 000000000..b31ff54fc
--- /dev/null
+++ b/src/pages/dashboard/instances/ReportForm/ReportForm.test.tsx
@@ -0,0 +1,61 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it, vi } from "vitest";
+import ReportForm from "./ReportForm";
+
+describe("ReportForm", () => {
+  it("renders report controls", () => {
+    renderWithProviders(<ReportForm instanceIds={[1, 2]} />);
+
+    expect(screen.getByLabelText("Report by CVE")).toBeInTheDocument();
+    expect(screen.getByLabelText("Range")).toBeInTheDocument();
+    expect(
+      screen.getByRole("button", { name: "Download" }),
+    ).toBeInTheDocument();
+  });
+
+  it("downloads CSV when submitting the form", async () => {
+    const user = userEvent.setup();
+    const clickSpy = vi
+      .spyOn(HTMLAnchorElement.prototype, "click")
+      .mockImplementation(() => undefined);
+    const createObjectUrl = vi
+      .spyOn(URL, "createObjectURL")
+      .mockReturnValue("blob:report");
+
+    renderWithProviders(<ReportForm instanceIds={[3]} />);
+
+    await user.click(screen.getByRole("button", { name: "Download" }));
+
+    expect(createObjectUrl).toHaveBeenCalledTimes(1);
+
+    const [csvBlob] = createObjectUrl.mock.calls[0] ?? [];
+    expect(csvBlob).toBeInstanceOf(Blob);
+    expect(await (csvBlob as Blob).text()).toContain("name,status");
+
+    expect(clickSpy).toHaveBeenCalledTimes(1);
+
+    clickSpy.mockRestore();
+    createObjectUrl.mockRestore();
+  });
+
+  it("downloads empty CSV when endpoint is empty", async () => {
+    const user = userEvent.setup();
+    const createObjectUrl = vi
+      .spyOn(URL, "createObjectURL")
+      .mockReturnValue("blob:report");
+    setEndpointStatus({ status: "empty", path: "reports" });
+
+    renderWithProviders(<ReportForm instanceIds={[3]} />);
+
+    await user.click(screen.getByRole("button", { name: "Download" }));
+
+    const [csvBlob] = createObjectUrl.mock.calls[0] ?? [];
+    expect(csvBlob).toBeInstanceOf(Blob);
+    expect(await (csvBlob as Blob).text()).toBe("");
+
+    createObjectUrl.mockRestore();
+  });
+});
diff --git a/src/pages/dashboard/instances/[single]/SingleInstanceContainer/SingleInstanceContainer.test.tsx b/src/pages/dashboard/instances/[single]/SingleInstanceContainer/SingleInstanceContainer.test.tsx
index 7a70c8f13..8c6b630ae 100644
--- a/src/pages/dashboard/instances/[single]/SingleInstanceContainer/SingleInstanceContainer.test.tsx
+++ b/src/pages/dashboard/instances/[single]/SingleInstanceContainer/SingleInstanceContainer.test.tsx
@@ -1,35 +1,141 @@
-import { ubuntuCoreInstance } from "@/tests/mocks/instance";
+import { renderWithProviders } from "@/tests/render";
+import { PATHS, ROUTES } from "@/libs/routes";
+import { render, screen } from "@testing-library/react";
 import { describe } from "vitest";
-import {
-  isInstancePackagesQueryEnabled,
-  isLivepatchInfoQueryEnabled,
-  isUsnQueryEnabled,
-} from "./helpers";
+import userEvent from "@testing-library/user-event";
+import SingleInstanceContainer from "./SingleInstanceContainer";
+import { AuthContext } from "@/context/auth";
+import { authUser } from "@/tests/mocks/auth";
+import { AppProviders } from "@/providers/AppProviders";
+import { useState } from "react";
+import { MemoryRouter, Route, Routes } from "react-router";
+
+const INSTANCE_ID = 11;
+const INSTANCE_WITHOUT_DISTRIBUTION_ID = 12;
+const MISSING_INSTANCE_ID = 99999;
 
 describe("SingleInstanceContainer", () => {
-  describe("isInstancePackagesQueryEnabled", () => {
-    it("should be false for an ubuntu core instance", () => {
-      assert(
-        !isInstancePackagesQueryEnabled(
-          ubuntuCoreInstance,
-          undefined,
-          undefined,
-        ),
+  describe("component", () => {
+    it("renders tabs for a found instance", async () => {
+      renderWithProviders(
+        <SingleInstanceContainer />,
+        undefined,
+        ROUTES.instances.details.single(INSTANCE_ID, { tab: "activities" }),
+        `/${PATHS.instances.root}/${PATHS.instances.single}`,
       );
+
+      expect(
+        await screen.findByRole("tab", { name: "Info" }),
+      ).toBeInTheDocument();
+      expect(
+        screen.getByRole("tab", { name: "Activities" }),
+      ).toBeInTheDocument();
     });
-  });
 
-  describe("isLivepatchInfoQueryEnabled", () => {
-    it("should be false for an ubuntu core instance", () => {
-      assert(
-        !isLivepatchInfoQueryEnabled(ubuntuCoreInstance, undefined, undefined),
+    it("renders empty state when instance is not found", async () => {
+      renderWithProviders(
+        <SingleInstanceContainer />,
+        undefined,
+        ROUTES.instances.details.single(MISSING_INSTANCE_ID, { tab: "info" }),
+        `/${PATHS.instances.root}/${PATHS.instances.single}`,
       );
+
+      expect(await screen.findByText("Instance not found")).toBeInTheDocument();
     });
-  });
 
-  describe("isUsnQueryEnabled", () => {
-    it("should be false for an ubuntu core instance", () => {
-      assert(!isUsnQueryEnabled(ubuntuCoreInstance, undefined, undefined));
+    it("renders details for instances without distribution data", async () => {
+      renderWithProviders(
+        <SingleInstanceContainer />,
+        undefined,
+        ROUTES.instances.details.single(INSTANCE_WITHOUT_DISTRIBUTION_ID, {
+          tab: "activities",
+        }),
+        `/${PATHS.instances.root}/${PATHS.instances.single}`,
+      );
+
+      expect(
+        await screen.findByRole("tab", { name: "Info" }),
+      ).toBeInTheDocument();
+      expect(
+        screen.getByRole("tab", { name: "Activities" }),
+      ).toBeInTheDocument();
+    });
+
+    it("redirects to root route when current account changes", async () => {
+      const user = userEvent.setup();
+
+      const AccountSwitchHarness = () => {
+        const [currentAccount, setCurrentAccount] = useState("account-a");
+
+        const userWithCurrentAccount = {
+          ...authUser,
+          current_account: currentAccount,
+          accounts: [
+            {
+              ...authUser.accounts[0],
+              name: currentAccount,
+              title: currentAccount,
+              subdomain: null,
+              classic_dashboard_url: "",
+            },
+          ],
+        };
+
+        return (
+          <AuthContext.Provider
+            value={{
+              authLoading: false,
+              authorized: true,
+              hasAccounts: true,
+              isFeatureEnabled: () => true,
+              logout: vi.fn(),
+              redirectToExternalUrl: vi.fn(),
+              safeRedirect: vi.fn(),
+              setUser: vi.fn(),
+              user: userWithCurrentAccount,
+            }}
+          >
+            <button
+              type="button"
+              onClick={() => {
+                setCurrentAccount("account-b");
+              }}
+            >
+              Switch account
+            </button>
+            <SingleInstanceContainer />
+          </AuthContext.Provider>
+        );
+      };
+
+      render(
+        <MemoryRouter
+          initialEntries={[ROUTES.instances.details.single(INSTANCE_ID)]}
+        >
+          <AppProviders>
+            <Routes>
+              <Route
+                path={`/${PATHS.instances.root}`}
+                element={<p>Instances root page</p>}
+              />
+              <Route
+                path={`/${PATHS.instances.root}/${PATHS.instances.single}`}
+                element={<AccountSwitchHarness />}
+              />
+            </Routes>
+          </AppProviders>
+        </MemoryRouter>,
+      );
+
+      expect(
+        await screen.findByRole("tab", { name: "Info" }),
+      ).toBeInTheDocument();
+
+      await user.click(screen.getByRole("button", { name: "Switch account" }));
+
+      expect(
+        await screen.findByText("Instances root page"),
+      ).toBeInTheDocument();
     });
   });
 });
diff --git a/src/pages/dashboard/instances/[single]/SingleInstanceContainer/helpers.test.ts b/src/pages/dashboard/instances/[single]/SingleInstanceContainer/helpers.test.ts
new file mode 100644
index 000000000..bcc755039
--- /dev/null
+++ b/src/pages/dashboard/instances/[single]/SingleInstanceContainer/helpers.test.ts
@@ -0,0 +1,203 @@
+import { ROUTES } from "@/libs/routes";
+import {
+  instances,
+  ubuntuCoreInstance,
+  ubuntuInstance,
+  windowsInstance,
+} from "@/tests/mocks/instance";
+import { describe, expect, it } from "vitest";
+import {
+  getBreadcrumbs,
+  getInstanceRequestId,
+  getInstanceTitle,
+  getKernelCount,
+  getPackageCount,
+  getQueryComputerIdsParam,
+  getQueryInstanceIdParam,
+  getUsnCount,
+  isInstanceFound,
+  isInstancePackagesQueryEnabled,
+  isInstanceQueryEnabled,
+  isLivepatchInfoQueryEnabled,
+  isUsnQueryEnabled,
+} from "./helpers";
+
+const INSTANCE_ID = 11;
+const CHILD_INSTANCE_ID = 22;
+const childWithParent = instances.find(
+  (instance) => instance.parent?.id === windowsInstance.id,
+);
+
+assert(childWithParent);
+assert(childWithParent.parent);
+const parentInstance = childWithParent.parent;
+
+describe("SingleInstanceContainer helpers", () => {
+  it("returns false for package-like query enablement on ubuntu core instances", () => {
+    expect(
+      isInstancePackagesQueryEnabled(ubuntuCoreInstance, undefined, undefined),
+    ).toBe(false);
+    expect(
+      isLivepatchInfoQueryEnabled(ubuntuCoreInstance, undefined, undefined),
+    ).toBe(false);
+    expect(isUsnQueryEnabled(ubuntuCoreInstance, undefined, undefined)).toBe(
+      false,
+    );
+  });
+
+  it("returns child instance id when child id is provided", () => {
+    expect(
+      getInstanceRequestId(String(INSTANCE_ID), String(CHILD_INSTANCE_ID)),
+    ).toBe(CHILD_INSTANCE_ID);
+  });
+
+  it("returns parent instance id when child id is not provided", () => {
+    expect(getInstanceRequestId(String(INSTANCE_ID), undefined)).toBe(
+      INSTANCE_ID,
+    );
+  });
+
+  it("returns empty title when instance is undefined", () => {
+    expect(getInstanceTitle(undefined)).toBe("");
+  });
+
+  it("returns breadcrumbs for a top-level instance", () => {
+    expect(getBreadcrumbs(ubuntuInstance)).toEqual([
+      { label: "Instances", path: ROUTES.instances.root() },
+      { label: ubuntuInstance.title, current: true },
+    ]);
+  });
+
+  it("returns breadcrumbs for a child instance", () => {
+    expect(getBreadcrumbs(childWithParent)).toEqual([
+      { label: "Instances", path: ROUTES.instances.root() },
+      {
+        label: parentInstance.title,
+        path: ROUTES.instances.details.single(parentInstance.id),
+      },
+      { label: childWithParent.title, current: true },
+    ]);
+  });
+
+  it("returns undefined breadcrumbs when instance is missing", () => {
+    expect(getBreadcrumbs(undefined)).toBeUndefined();
+  });
+
+  it("returns kernel count when livepatch fixes are available", () => {
+    expect(
+      getKernelCount([
+        {
+          Livepatch: {
+            Fixes: [{}, {}],
+          },
+        },
+      ] as never),
+    ).toBe(2);
+  });
+
+  it("returns undefined kernel count for missing livepatch data", () => {
+    expect(getKernelCount(undefined)).toBeUndefined();
+    expect(getKernelCount([])).toBeUndefined();
+    expect(
+      getKernelCount([
+        {
+          Livepatch: {},
+        },
+      ] as never),
+    ).toBeUndefined();
+  });
+
+  it("returns request package and usn counts only when instance has a distribution", () => {
+    const noDistributionInstance = { ...ubuntuInstance, distribution: "" };
+
+    expect(getPackageCount(ubuntuInstance, 7)).toBe(7);
+    expect(getUsnCount(ubuntuInstance, 5)).toBe(5);
+    expect(getPackageCount(noDistributionInstance, 7)).toBe(0);
+    expect(getUsnCount(noDistributionInstance, 5)).toBe(0);
+  });
+
+  it("evaluates instance-query enablement based on account consistency", () => {
+    expect(isInstanceQueryEnabled(undefined, undefined, undefined)).toBe(false);
+    expect(isInstanceQueryEnabled("11", undefined, "account-a")).toBe(true);
+    expect(isInstanceQueryEnabled("11", "account-a", "account-a")).toBe(true);
+    expect(isInstanceQueryEnabled("11", "account-a", "account-b")).toBe(false);
+  });
+
+  it("returns query params derived from instance", () => {
+    expect(getQueryComputerIdsParam(ubuntuInstance)).toEqual([
+      ubuntuInstance.id,
+    ]);
+    expect(getQueryComputerIdsParam(undefined)).toEqual([]);
+    expect(getQueryInstanceIdParam(ubuntuInstance)).toBe(ubuntuInstance.id);
+    expect(getQueryInstanceIdParam(undefined)).toBe(0);
+  });
+
+  it("enables package-like queries only when child-parent relation matches", () => {
+    expect(isInstancePackagesQueryEnabled(ubuntuInstance, "1", undefined)).toBe(
+      true,
+    );
+    expect(isLivepatchInfoQueryEnabled(ubuntuInstance, "1", undefined)).toBe(
+      true,
+    );
+    expect(isUsnQueryEnabled(ubuntuInstance, "1", undefined)).toBe(true);
+    expect(
+      isInstancePackagesQueryEnabled(
+        childWithParent,
+        String(windowsInstance.id),
+        "22",
+      ),
+    ).toBe(false);
+    expect(
+      isInstancePackagesQueryEnabled(
+        childWithParent,
+        String(ubuntuInstance.id),
+        "22",
+      ),
+    ).toBe(false);
+    expect(
+      isLivepatchInfoQueryEnabled(
+        childWithParent,
+        String(windowsInstance.id),
+        "22",
+      ),
+    ).toBe(false);
+    expect(
+      isUsnQueryEnabled(childWithParent, String(windowsInstance.id), "22"),
+    ).toBe(false);
+  });
+
+  it("returns null when child instance id is provided but instance has no parent", () => {
+    expect(isInstanceFound(ubuntuInstance, String(INSTANCE_ID), "22")).toBe(
+      null,
+    );
+  });
+
+  it("returns true when child belongs to parent instance", () => {
+    expect(
+      isInstanceFound(
+        childWithParent,
+        String(windowsInstance.id),
+        String(INSTANCE_ID),
+      ),
+    ).toBe(true);
+  });
+
+  it("returns false when child does not belong to parent instance", () => {
+    expect(
+      isInstanceFound(
+        childWithParent,
+        String(ubuntuInstance.id),
+        String(INSTANCE_ID),
+      ),
+    ).toBe(false);
+  });
+
+  it("returns instance itself when there is no child constraint", () => {
+    expect(
+      isInstanceFound(ubuntuInstance, String(ubuntuInstance.id), undefined),
+    ).toBe(true);
+    expect(
+      isInstanceFound(undefined, String(ubuntuInstance.id), undefined),
+    ).toBe(undefined);
+  });
+});
diff --git a/src/pages/dashboard/instances/[single]/tabs/info/AssignEmployeeToInstanceForm/AssignEmployeeToInstanceForm.test.tsx b/src/pages/dashboard/instances/[single]/tabs/info/AssignEmployeeToInstanceForm/AssignEmployeeToInstanceForm.test.tsx
index 85cba3614..21a71c04c 100644
--- a/src/pages/dashboard/instances/[single]/tabs/info/AssignEmployeeToInstanceForm/AssignEmployeeToInstanceForm.test.tsx
+++ b/src/pages/dashboard/instances/[single]/tabs/info/AssignEmployeeToInstanceForm/AssignEmployeeToInstanceForm.test.tsx
@@ -1,19 +1,28 @@
 import { renderWithProviders } from "@/tests/render";
+import { PATHS, ROUTES } from "@/libs/routes";
 import { screen } from "@testing-library/react";
 import type { ComponentProps } from "react";
 import { describe, expect } from "vitest";
 import AssignEmployeeToInstanceForm from "./AssignEmployeeToInstanceForm";
 import userEvent from "@testing-library/user-event";
+import { setEndpointStatus } from "@/tests/controllers/controller";
 
 const props: ComponentProps<typeof AssignEmployeeToInstanceForm> = {
   instanceTitle: "Test Instance",
 };
 
+const routePattern = `/${PATHS.instances.root}/${PATHS.instances.single}`;
+
 describe("AssignEmployeeToInstanceForm", () => {
   const user = userEvent.setup();
 
   beforeEach(async () => {
-    renderWithProviders(<AssignEmployeeToInstanceForm {...props} />);
+    renderWithProviders(
+      <AssignEmployeeToInstanceForm {...props} />,
+      undefined,
+      ROUTES.instances.details.single(1),
+      routePattern,
+    );
   });
 
   it("renders form correctly", () => {
@@ -39,4 +48,56 @@ describe("AssignEmployeeToInstanceForm", () => {
     const errorMessage = screen.getByText(/This field is required./i);
     expect(errorMessage).toBeInTheDocument();
   });
+
+  it("clears validation error after selecting an employee", async () => {
+    await user.click(screen.getByRole("button", { name: /Associate/i }));
+    expect(screen.getByText(/This field is required./i)).toBeInTheDocument();
+
+    const search = screen.getByRole("searchbox", {
+      name: /search for an employee/i,
+    });
+
+    await user.type(search, "John");
+    await user.click(await screen.findByTestId("dropdownElement"));
+
+    expect(
+      screen.queryByText(/This field is required./i),
+    ).not.toBeInTheDocument();
+  });
+
+  it("shows success notification when associating an employee", async () => {
+    const search = screen.getByRole("searchbox", {
+      name: /search for an employee/i,
+    });
+
+    await user.type(search, "John");
+    await user.click(await screen.findByTestId("dropdownElement"));
+    await user.click(screen.getByRole("button", { name: /Associate/i }));
+
+    expect(
+      await screen.findByText(
+        "John Doe has been successfully associated with Test Instance.",
+      ),
+    ).toBeInTheDocument();
+    expect(screen.queryByRole("form")).not.toBeInTheDocument();
+  });
+
+  it("shows an error notification when association fails", async () => {
+    const search = screen.getByRole("searchbox", {
+      name: /search for an employee/i,
+    });
+
+    setEndpointStatus({
+      status: "error",
+      path: "associateEmployeeWithInstance",
+    });
+
+    await user.type(search, "John");
+    await user.click(await screen.findByTestId("dropdownElement"));
+    await user.click(screen.getByRole("button", { name: /Associate/i }));
+
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+  });
 });
diff --git a/src/pages/dashboard/instances/[single]/tabs/info/EditInstance/EditInstance.test.tsx b/src/pages/dashboard/instances/[single]/tabs/info/EditInstance/EditInstance.test.tsx
new file mode 100644
index 000000000..35ed9ee91
--- /dev/null
+++ b/src/pages/dashboard/instances/[single]/tabs/info/EditInstance/EditInstance.test.tsx
@@ -0,0 +1,200 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
+import { ubuntuInstance } from "@/tests/mocks/instance";
+import { PATHS, ROUTES } from "@/libs/routes";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import EditInstance from "./EditInstance";
+
+const routePattern = `/${PATHS.instances.root}/${PATHS.instances.single}`;
+const routePath = ROUTES.instances.details.single(1);
+
+describe("EditInstance", () => {
+  it("renders editable fields and access group options", async () => {
+    renderWithProviders(
+      <EditInstance instance={ubuntuInstance} />,
+      undefined,
+      routePath,
+      routePattern,
+    );
+
+    expect(await screen.findByRole("textbox", { name: "Title" })).toHaveValue(
+      "Application Server 1",
+    );
+    expect(
+      screen.getByRole("combobox", { name: "Access group" }),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("option", { name: "Global access" }),
+    ).toBeInTheDocument();
+    expect(screen.getByRole("textbox", { name: "Comment" })).toHaveValue(
+      "my awesome instance comment",
+    );
+  });
+
+  it("disables title editing for WSL instances", async () => {
+    renderWithProviders(
+      <EditInstance instance={{ ...ubuntuInstance, is_wsl_instance: true }} />,
+      undefined,
+      routePath,
+      routePattern,
+    );
+
+    expect(
+      await screen.findByRole("textbox", { name: "Title" }),
+    ).toBeDisabled();
+  });
+
+  it("shows tag confirmation modal when adding a new tag", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <EditInstance instance={ubuntuInstance} />,
+      undefined,
+      routePath,
+      routePattern,
+    );
+
+    await screen.findByRole("textbox", { name: "Title" });
+
+    await user.click(screen.getByPlaceholderText("Add tags"));
+    await user.click(await screen.findByRole("button", { name: "asd" }));
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    expect(
+      await screen.findByText(
+        "Adding tags could trigger irreversible changes to your instances.",
+      ),
+    ).toBeInTheDocument();
+  });
+
+  it("submits directly when no tags were added", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <EditInstance instance={ubuntuInstance} />,
+      undefined,
+      routePath,
+      routePattern,
+    );
+
+    const titleInput = await screen.findByRole("textbox", { name: "Title" });
+    await user.clear(titleInput);
+    await user.type(titleInput, "Renamed instance");
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    expect(await screen.findByText("Instance updated")).toBeInTheDocument();
+    expect(
+      screen.queryByText(
+        "Adding tags could trigger irreversible changes to your instances.",
+      ),
+    ).not.toBeInTheDocument();
+    expect(
+      screen.queryByRole("button", { name: "Add tags" }),
+    ).not.toBeInTheDocument();
+  });
+
+  it("submits from tag confirmation modal", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <EditInstance instance={ubuntuInstance} />,
+      undefined,
+      routePath,
+      routePattern,
+    );
+
+    await screen.findByRole("textbox", { name: "Title" });
+    await user.click(screen.getByPlaceholderText("Add tags"));
+    await user.click(await screen.findByRole("button", { name: "asd" }));
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+    await user.click(await screen.findByRole("button", { name: "Add tags" }));
+
+    expect(await screen.findByText("Instance updated")).toBeInTheDocument();
+    expect(
+      screen.queryByRole("button", { name: "Add tags" }),
+    ).not.toBeInTheDocument();
+  });
+
+  it("shows error notification when edit fails", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "error", path: "editInstance" });
+
+    renderWithProviders(
+      <EditInstance instance={ubuntuInstance} />,
+      undefined,
+      routePath,
+      routePattern,
+    );
+
+    await screen.findByRole("textbox", { name: "Title" });
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+  });
+
+  it("shows endpoint error when profile-diff request fails", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "error", path: "tags/profile-diff" });
+
+    renderWithProviders(
+      <EditInstance instance={ubuntuInstance} />,
+      undefined,
+      routePath,
+      routePattern,
+    );
+
+    await screen.findByRole("textbox", { name: "Title" });
+    await user.click(screen.getByPlaceholderText("Add tags"));
+    await user.click(await screen.findByRole("button", { name: "asd" }));
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+  });
+
+  it("submits directly when profile-diff result is empty", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "empty", path: "tags/profile-diff" });
+
+    renderWithProviders(
+      <EditInstance instance={ubuntuInstance} />,
+      undefined,
+      routePath,
+      routePattern,
+    );
+
+    await screen.findByRole("textbox", { name: "Title" });
+    await user.click(screen.getByPlaceholderText("Add tags"));
+    await user.click(await screen.findByRole("button", { name: "asd" }));
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    expect(await screen.findByText("Instance updated")).toBeInTheDocument();
+    expect(
+      screen.queryByText(
+        "Adding tags could trigger irreversible changes to your instances.",
+      ),
+    ).not.toBeInTheDocument();
+  });
+
+  it("renders when access groups request fails", async () => {
+    setEndpointStatus({ status: "error", path: "GetAccessGroups" });
+
+    renderWithProviders(
+      <EditInstance instance={ubuntuInstance} />,
+      undefined,
+      routePath,
+      routePattern,
+    );
+
+    expect(
+      await screen.findByRole("combobox", { name: "Access group" }),
+    ).toBeInTheDocument();
+    expect(
+      screen.queryByRole("option", { name: "Global access" }),
+    ).not.toBeInTheDocument();
+  });
+});
diff --git a/src/pages/dashboard/instances/[single]/tabs/packages/PackagesPanel/helpers.test.ts b/src/pages/dashboard/instances/[single]/tabs/packages/PackagesPanel/helpers.test.ts
new file mode 100644
index 000000000..645417da8
--- /dev/null
+++ b/src/pages/dashboard/instances/[single]/tabs/packages/PackagesPanel/helpers.test.ts
@@ -0,0 +1,22 @@
+import { describe, expect, it } from "vitest";
+import { getEmptyMessage } from "./helpers";
+
+describe("PackagesPanel helpers", () => {
+  it("returns empty-state messages by package filter", () => {
+    expect(getEmptyMessage("", "")).toBe("No packages found.");
+    expect(getEmptyMessage("upgrade", "")).toBe("No available upgrades found.");
+    expect(getEmptyMessage("security", "")).toBe(
+      "No available security upgrades found.",
+    );
+    expect(getEmptyMessage("installed", "")).toBe(
+      "No installed packages found.",
+    );
+    expect(getEmptyMessage("held", "")).toBe("No held packages found.");
+  });
+
+  it("appends package search term when provided", () => {
+    expect(getEmptyMessage("upgrade", "openssl")).toBe(
+      'No available upgrades found with the search "openssl".',
+    );
+  });
+});
diff --git a/src/pages/dashboard/instances/[single]/tabs/users/EditUserForm/EditUserForm.test.tsx b/src/pages/dashboard/instances/[single]/tabs/users/EditUserForm/EditUserForm.test.tsx
index 065e0888f..40b5d616b 100644
--- a/src/pages/dashboard/instances/[single]/tabs/users/EditUserForm/EditUserForm.test.tsx
+++ b/src/pages/dashboard/instances/[single]/tabs/users/EditUserForm/EditUserForm.test.tsx
@@ -1,24 +1,34 @@
+import { PATHS, ROUTES } from "@/libs/routes";
+import { setEndpointStatus } from "@/tests/controllers/controller";
 import { users } from "@/tests/mocks/user";
+import { userGroups } from "@/tests/mocks/userGroup";
 import { renderWithProviders } from "@/tests/render";
-import { screen, within } from "@testing-library/react";
+import type { User } from "@/types/User";
+import { screen, waitFor, within } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import EditUserForm from "./EditUserForm";
 
-const props = {
-  instanceId: 1,
-  user: users[0],
-};
+const routePattern = `/${PATHS.instances.root}/${PATHS.instances.single}`;
+
+const renderEditUserForm = (user: User = users[0]) =>
+  renderWithProviders(
+    <EditUserForm user={user} />,
+    undefined,
+    ROUTES.instances.details.single(1),
+    routePattern,
+  );
 
 describe("EditUserForm", () => {
-  beforeEach(() => {
-    renderWithProviders(<EditUserForm {...props} />);
-  });
   it("renders the form", () => {
+    renderEditUserForm();
+
     const form = screen.getByRole("form");
     expect(form).toBeInTheDocument();
   });
 
   it("renders form fields", () => {
+    renderEditUserForm();
+
     const form = screen.getByRole("form");
     expect(form).toHaveTexts([
       "Username",
@@ -34,27 +44,52 @@ describe("EditUserForm", () => {
   });
 
   it("renders form fields with user data", () => {
+    renderEditUserForm();
+
+    const form = screen.getByRole("form");
+    expect(form).toHaveInputValues([
+      users[0].username,
+      users[0].name ?? "",
+      users[0].location ?? "",
+      users[0].home_phone ?? "",
+      users[0].work_phone ?? "",
+    ]);
+  });
+
+  it("renders empty optional profile fields when missing", () => {
+    const userWithoutProfileDetails: User = {
+      ...users[8],
+      name: undefined,
+      location: undefined,
+      home_phone: undefined,
+      work_phone: undefined,
+    };
+
+    renderEditUserForm(userWithoutProfileDetails);
+
     const form = screen.getByRole("form");
     expect(form).toHaveInputValues([
-      props.user.username,
-      props.user.name ?? "",
-      props.user.location ?? "",
-      props.user.home_phone ?? "",
-      props.user.work_phone ?? "",
+      userWithoutProfileDetails.username,
+      "",
+      "",
+      "",
+      "",
     ]);
   });
 
   it("can edit user data", async () => {
+    renderEditUserForm();
+
     const form = screen.getByRole("form");
     let username;
-    if (props.user.name === props.user.username) {
+    if (users[0].name === users[0].username) {
       const inputs = await within(form).findAllByDisplayValue(
-        props.user.username,
+        users[0].username,
       );
       [username] = inputs;
       assert(username !== undefined);
     } else {
-      username = await within(form).findByDisplayValue(props.user.username);
+      username = await within(form).findByDisplayValue(users[0].username);
     }
 
     await userEvent.clear(username);
@@ -62,4 +97,96 @@ describe("EditUserForm", () => {
 
     expect(form).toHaveInputValues(["newusername"]);
   });
+
+  it("shows validation error when confirm password does not match", async () => {
+    const user = userEvent.setup();
+    renderEditUserForm();
+
+    await user.type(screen.getByLabelText("Password"), "new-password");
+    await user.type(
+      screen.getByLabelText("Confirm password"),
+      "different-password",
+    );
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    expect(await screen.findByText("Passwords must match")).toBeInTheDocument();
+  });
+
+  it("submits and shows success notification", async () => {
+    const user = userEvent.setup();
+    renderEditUserForm();
+
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    expect(
+      await screen.findByText("User updated successfully"),
+    ).toBeInTheDocument();
+  });
+
+  it("shows endpoint error notification on submit failure", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "error", path: "users" });
+    renderEditUserForm();
+
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    await waitFor(() => {
+      expect(
+        screen.getByText('The endpoint status is set to "error".'),
+      ).toBeInTheDocument();
+    });
+  });
+
+  it("adds a newly selected additional group", async () => {
+    const user = userEvent.setup();
+    const daemonGroup = userGroups.find((entry) => entry.name === "daemon");
+    const binGroup = userGroups.find((entry) => entry.name === "bin");
+    assert(daemonGroup);
+    assert(binGroup);
+
+    setEndpointStatus({ status: "default", path: "users/groups:daemon" });
+    renderEditUserForm();
+
+    await user.click(
+      screen.getByRole("combobox", { name: "Additional Groups" }),
+    );
+    await user.click(
+      await screen.findByRole("checkbox", { name: binGroup.name }),
+    );
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    expect(
+      await screen.findByText("User updated successfully"),
+    ).toBeInTheDocument();
+  });
+
+  it("submits when no additional groups are assigned", async () => {
+    const user = userEvent.setup();
+
+    setEndpointStatus({ status: "empty", path: "users/groups" });
+    renderEditUserForm();
+
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    expect(
+      await screen.findByText("User updated successfully"),
+    ).toBeInTheDocument();
+  });
+
+  it("allows changing additional groups selection", async () => {
+    const user = userEvent.setup();
+    const group = userGroups.find((entry) => entry.name === "daemon");
+    assert(group);
+    renderEditUserForm();
+
+    await user.click(
+      screen.getByRole("combobox", { name: "Additional Groups" }),
+    );
+    await user.click(await screen.findByRole("checkbox", { name: group.name }));
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    expect(
+      await screen.findByText("User updated successfully"),
+    ).toBeInTheDocument();
+  });
 });
diff --git a/src/pages/dashboard/instances/[single]/tabs/users/UserList/UserList.test.tsx b/src/pages/dashboard/instances/[single]/tabs/users/UserList/UserList.test.tsx
index 60baa1ad7..ca5dd2837 100644
--- a/src/pages/dashboard/instances/[single]/tabs/users/UserList/UserList.test.tsx
+++ b/src/pages/dashboard/instances/[single]/tabs/users/UserList/UserList.test.tsx
@@ -1,5 +1,5 @@
-import NoData from "@/components/layout/NoData";
-import { expectLoadingState, setScreenSize } from "@/tests/helpers";
+import NoData, { NO_DATA_TEXT } from "@/components/layout/NoData";
+import { setScreenSize } from "@/tests/helpers";
 import { users } from "@/tests/mocks/user";
 import { userGroups } from "@/tests/mocks/userGroup";
 import { renderWithProviders } from "@/tests/render";
@@ -67,6 +67,18 @@ describe("UserList", () => {
       expect(checkedCheckboxes).toHaveLength(userIds.length + 1);
     });
 
+    it("should clear all selected users when clicking ToggleAll with selected users", async () => {
+      const user = userEvent.setup();
+      renderWithProviders(<UserList {...props} selected={userIds} />);
+
+      const toggleAllCheckbox = await screen.findByRole("checkbox", {
+        name: /toggle all/i,
+      });
+      await user.click(toggleAllCheckbox);
+
+      expect(props.setSelected).toHaveBeenCalledWith([]);
+    });
+
     it("should select user when clicking on its row checkbox", async () => {
       renderWithProviders(<UserList {...props} />);
 
@@ -80,12 +92,29 @@ describe("UserList", () => {
 
       expect(props.setSelected).toHaveBeenCalledWith([selectedUser.uid]);
     });
+
+    it("should unselect user when clicking an already selected row checkbox", async () => {
+      const user = userEvent.setup();
+      const [selectedUser] = users;
+      assert(selectedUser);
+
+      renderWithProviders(
+        <UserList {...props} selected={[selectedUser.uid]} />,
+      );
+
+      const userCheckbox = await screen.findByRole("checkbox", {
+        name: `Select user ${selectedUser.username}`,
+      });
+      await user.click(userCheckbox);
+
+      expect(props.setSelected).toHaveBeenCalledWith([]);
+    });
   });
 
   describe("User details sidepanel", () => {
     beforeEach(() => {
-      renderWithProviders(<UserList {...props} />);
       setScreenSize("lg");
+      renderWithProviders(<UserList {...props} />);
     });
     it("should open side panel when user in table is clicked", async () => {
       const user = await screen.findByRole("button", {
@@ -109,12 +138,11 @@ describe("UserList", () => {
       await userEvent.click(userTableButton);
 
       const form = await screen.findByRole("complementary");
-
-      await expectLoadingState();
-
+      await within(form).findByRole("button", { name: "Unlock" });
       buttonNames.forEach((buttonName) => {
-        const button = within(form).getByText(buttonName);
-        expect(button).toBeInTheDocument();
+        expect(
+          within(form).getByRole("button", { name: buttonName }),
+        ).toBeInTheDocument();
       });
     });
 
@@ -128,9 +156,11 @@ describe("UserList", () => {
       const form = await screen.findByRole("complementary");
       const buttonsNames = ["Lock", "Edit", "Delete"];
 
+      await within(form).findByRole("button", { name: "Lock" });
       buttonsNames.forEach((buttonName) => {
-        const button = within(form).getByText(buttonName);
-        expect(button).toBeInTheDocument();
+        expect(
+          within(form).getByRole("button", { name: buttonName }),
+        ).toBeInTheDocument();
       });
     });
 
@@ -148,7 +178,11 @@ describe("UserList", () => {
         userGroups.find((group) => group.gid === user.primary_gid)?.name ?? "";
 
       const groupsData = userGroups.map((group) => group.name).join(", ");
-      const loaded = await screen.findByText(primaryGroup);
+      const loaded = await within(form).findByText(
+        primaryGroup,
+        {},
+        { timeout: 5000 },
+      );
       expect(loaded).toBeInTheDocument();
       const getFieldsToCheck = (item: User) => {
         return [
@@ -167,5 +201,42 @@ describe("UserList", () => {
         expect(form).toHaveInfoItem(field.label, field.value);
       });
     });
+
+    it("should open edit user side panel from list actions", async () => {
+      const user = userEvent.setup();
+      const [firstUser] = users;
+      assert(firstUser);
+
+      const actionsToggle = await screen.findByRole("button", {
+        name: `"${firstUser.name}" user actions`,
+      });
+      await user.click(actionsToggle);
+
+      await user.click(await screen.findByText("Edit"));
+
+      const sidePanel = await screen.findByRole("complementary");
+      expect(within(sidePanel).getByText("Edit user")).toBeInTheDocument();
+    });
+  });
+
+  it("shows no-data marker when a user has no full name", async () => {
+    const userWithoutName = {
+      ...users[0],
+      uid: 999,
+      username: "no-name-user",
+      name: "",
+    };
+
+    renderWithProviders(
+      <UserList {...props} users={[userWithoutName]} selected={[]} />,
+    );
+
+    const detailsButton = await screen.findByRole("button", {
+      name: `Show details of user ${userWithoutName.username}`,
+    });
+    const row = detailsButton.closest("tr");
+    assert(row);
+
+    expect(within(row).getByText(NO_DATA_TEXT)).toBeInTheDocument();
   });
 });
diff --git a/src/pages/dashboard/instances/[single]/tabs/users/UserList/helpers.test.ts b/src/pages/dashboard/instances/[single]/tabs/users/UserList/helpers.test.ts
new file mode 100644
index 000000000..bb2501b4e
--- /dev/null
+++ b/src/pages/dashboard/instances/[single]/tabs/users/UserList/helpers.test.ts
@@ -0,0 +1,32 @@
+import { describe, expect, it } from "vitest";
+import type { Cell } from "react-table";
+import type { User } from "@/types/User";
+import { handleCellProps } from "./helpers";
+
+const toCell = (id: string) => {
+  return { column: { id } } as unknown as Cell<User>;
+};
+
+describe("UserList helpers", () => {
+  it("adds rowheader role for username cells", () => {
+    expect(handleCellProps(toCell("username"))).toEqual({
+      role: "rowheader",
+    });
+  });
+
+  it("adds accessibility labels for known columns", () => {
+    expect(handleCellProps(toCell("enabled"))).toEqual({
+      "aria-label": "Status",
+    });
+    expect(handleCellProps(toCell("uid"))).toEqual({
+      "aria-label": "User id",
+    });
+    expect(handleCellProps(toCell("name"))).toEqual({
+      "aria-label": "Full name",
+    });
+  });
+
+  it("returns empty props for unknown columns", () => {
+    expect(handleCellProps(toCell("shell"))).toEqual({});
+  });
+});
diff --git a/src/pages/dashboard/instances/[single]/tabs/users/UserPanelActionButtons/UserPanelActionButtons.test.tsx b/src/pages/dashboard/instances/[single]/tabs/users/UserPanelActionButtons/UserPanelActionButtons.test.tsx
index 0e83a620b..56831a747 100644
--- a/src/pages/dashboard/instances/[single]/tabs/users/UserPanelActionButtons/UserPanelActionButtons.test.tsx
+++ b/src/pages/dashboard/instances/[single]/tabs/users/UserPanelActionButtons/UserPanelActionButtons.test.tsx
@@ -1,9 +1,12 @@
 import { resetScreenSize, setScreenSize } from "@/tests/helpers";
 import "@/tests/matcher";
+import { PATHS, ROUTES } from "@/libs/routes";
+import { setEndpointStatus } from "@/tests/controllers/controller";
 import { users } from "@/tests/mocks/user";
 import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
-import { describe, vi } from "vitest";
+import { screen, within } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, vi } from "vitest";
 import { getSelectedUsers } from "../UserPanelHeader/helpers";
 import UserPanelActionButtons from "./UserPanelActionButtons";
 
@@ -27,6 +30,8 @@ const mixedSelectedUsers = [
 const tableUserButtons = ["Add user", "Lock", "Unlock", "Delete"];
 const formLockedUserButtons = ["Unlock", "Edit", "Delete"];
 const formUnlockedUserButtons = ["Lock", "Edit", "Delete"];
+const routePattern = `/${PATHS.instances.root}/${PATHS.instances.single}`;
+const routePath = ROUTES.instances.details.single(1);
 
 describe("UserPanelActionButtons", () => {
   beforeEach(() => {
@@ -44,10 +49,33 @@ describe("UserPanelActionButtons", () => {
           selectedUsers={getSelectedUsers(users, userData.empty)}
           handleClearSelection={vi.fn()}
         />,
+        undefined,
+        routePath,
+        routePattern,
       );
       expect(container).toHaveTexts(tableUserButtons);
     });
 
+    it("opens add user side panel from table action", async () => {
+      const user = userEvent.setup();
+
+      renderWithProviders(
+        <UserPanelActionButtons
+          selectedUsers={getSelectedUsers(users, userData.empty)}
+          handleClearSelection={vi.fn()}
+        />,
+        undefined,
+        routePath,
+        routePattern,
+      );
+
+      await user.click(screen.getByRole("button", { name: "Add user" }));
+
+      expect(
+        await screen.findByText("Require password reset"),
+      ).toBeInTheDocument();
+    });
+
     describe("Check button disabled statuses", () => {
       it("renders buttons disabled when no users selected", () => {
         renderWithProviders(
@@ -55,6 +83,9 @@ describe("UserPanelActionButtons", () => {
             selectedUsers={getSelectedUsers(users, userData.empty)}
             handleClearSelection={vi.fn()}
           />,
+          undefined,
+          routePath,
+          routePattern,
         );
 
         for (const button of tableUserButtons) {
@@ -77,6 +108,9 @@ describe("UserPanelActionButtons", () => {
             )}
             handleClearSelection={vi.fn()}
           />,
+          undefined,
+          routePath,
+          routePattern,
         );
         const unlockButton = screen.getByRole("button", { name: "Unlock" });
         expect(unlockButton).toHaveAttribute("aria-disabled");
@@ -91,6 +125,9 @@ describe("UserPanelActionButtons", () => {
             )}
             handleClearSelection={vi.fn()}
           />,
+          undefined,
+          routePath,
+          routePattern,
         );
         const lockButton = screen.getByRole("button", { name: "Lock" });
         expect(lockButton).toHaveAttribute("aria-disabled");
@@ -102,6 +139,9 @@ describe("UserPanelActionButtons", () => {
             selectedUsers={getSelectedUsers(users, mixedSelectedUsers)}
             handleClearSelection={vi.fn()}
           />,
+          undefined,
+          routePath,
+          routePattern,
         );
         const lockButton = screen.getByRole("button", { name: "Lock" });
         const unlockButton = screen.getByRole("button", { name: "Unlock" });
@@ -121,6 +161,9 @@ describe("UserPanelActionButtons", () => {
           handleClearSelection={vi.fn()}
           sidePanel
         />,
+        undefined,
+        routePath,
+        routePattern,
       );
 
       expect(container).toHaveTexts(formLockedUserButtons);
@@ -135,9 +178,283 @@ describe("UserPanelActionButtons", () => {
           handleClearSelection={vi.fn()}
           sidePanel
         />,
+        undefined,
+        routePath,
+        routePattern,
       );
 
       expect(container).toHaveTexts(formUnlockedUserButtons);
     });
+
+    it("does not render edit button for multiple selected users in sidepanel", () => {
+      renderWithProviders(
+        <UserPanelActionButtons
+          selectedUsers={getSelectedUsers(users, mixedSelectedUsers)}
+          handleClearSelection={vi.fn()}
+          sidePanel
+        />,
+        undefined,
+        routePath,
+        routePattern,
+      );
+
+      expect(
+        screen.queryByRole("button", { name: "Edit" }),
+      ).not.toBeInTheDocument();
+    });
+
+    it("does not render add user button in sidepanel", () => {
+      renderWithProviders(
+        <UserPanelActionButtons
+          selectedUsers={getSelectedUsers(users, [userData.single.lockedUser])}
+          handleClearSelection={vi.fn()}
+          sidePanel
+        />,
+        undefined,
+        routePath,
+        routePattern,
+      );
+
+      expect(
+        screen.queryByRole("button", { name: "Add user" }),
+      ).not.toBeInTheDocument();
+    });
+
+    it("opens edit user form from sidepanel action", async () => {
+      const user = userEvent.setup();
+
+      renderWithProviders(
+        <UserPanelActionButtons
+          selectedUsers={getSelectedUsers(users, [userData.single.lockedUser])}
+          handleClearSelection={vi.fn()}
+          sidePanel
+        />,
+        undefined,
+        routePath,
+        routePattern,
+      );
+
+      await user.click(screen.getByRole("button", { name: "Edit" }));
+
+      expect(await screen.findByRole("form")).toBeInTheDocument();
+      expect(screen.getByText("Confirm password")).toBeInTheDocument();
+    });
+
+    it("opens lock confirmation and submits lock action", async () => {
+      const user = userEvent.setup();
+
+      renderWithProviders(
+        <UserPanelActionButtons
+          selectedUsers={getSelectedUsers(users, [
+            userData.single.unlockedUser,
+          ])}
+          handleClearSelection={vi.fn()}
+          sidePanel
+        />,
+        undefined,
+        routePath,
+        routePattern,
+      );
+
+      await user.click(screen.getByRole("button", { name: "Lock" }));
+      expect(
+        screen.getByRole("heading", { name: /lock user/i }),
+      ).toBeInTheDocument();
+
+      await user.click(
+        within(screen.getByRole("dialog")).getByRole("button", {
+          name: "Lock",
+        }),
+      );
+      expect(
+        await screen.findByText("Successfully requested to be locked"),
+      ).toBeInTheDocument();
+    });
+
+    it("submits lock action when clear-selection handler is omitted", async () => {
+      const user = userEvent.setup();
+
+      renderWithProviders(
+        <UserPanelActionButtons
+          selectedUsers={getSelectedUsers(users, [
+            userData.single.unlockedUser,
+          ])}
+          sidePanel
+        />,
+        undefined,
+        routePath,
+        routePattern,
+      );
+
+      await user.click(screen.getByRole("button", { name: "Lock" }));
+      await user.click(
+        within(screen.getByRole("dialog")).getByRole("button", {
+          name: "Lock",
+        }),
+      );
+
+      expect(
+        await screen.findByText("Successfully requested to be locked"),
+      ).toBeInTheDocument();
+    });
+
+    it("opens unlock confirmation and submits unlock action", async () => {
+      const user = userEvent.setup();
+
+      renderWithProviders(
+        <UserPanelActionButtons
+          selectedUsers={getSelectedUsers(users, [userData.single.lockedUser])}
+          handleClearSelection={vi.fn()}
+          sidePanel
+        />,
+        undefined,
+        routePath,
+        routePattern,
+      );
+
+      await user.click(screen.getByRole("button", { name: "Unlock" }));
+      expect(
+        screen.getByRole("heading", { name: /unlock user/i }),
+      ).toBeInTheDocument();
+
+      await user.click(
+        within(screen.getByRole("dialog")).getByRole("button", {
+          name: "Unlock",
+        }),
+      );
+      expect(
+        await screen.findByText("Successfully requested to be unlocked"),
+      ).toBeInTheDocument();
+    });
+
+    it("opens delete confirmation and submits remove action", async () => {
+      const user = userEvent.setup();
+
+      renderWithProviders(
+        <UserPanelActionButtons
+          selectedUsers={getSelectedUsers(users, [userData.single.lockedUser])}
+          handleClearSelection={vi.fn()}
+          sidePanel
+        />,
+        undefined,
+        routePath,
+        routePattern,
+      );
+
+      await user.click(screen.getByRole("button", { name: "Delete" }));
+      expect(
+        screen.getByRole("heading", { name: /delete user/i }),
+      ).toBeInTheDocument();
+
+      await user.click(
+        screen.getByRole("checkbox", {
+          name: "Delete the home folders as well",
+        }),
+      );
+      await user.click(
+        within(screen.getByRole("dialog")).getByRole("button", {
+          name: "Delete",
+        }),
+      );
+
+      expect(
+        await screen.findByText("Successfully requested to be removed"),
+      ).toBeInTheDocument();
+    });
+
+    it("shows error notification when user action fails", async () => {
+      const user = userEvent.setup();
+      setEndpointStatus({ status: "error", path: "lockUser" });
+
+      renderWithProviders(
+        <UserPanelActionButtons
+          selectedUsers={getSelectedUsers(users, [
+            userData.single.unlockedUser,
+          ])}
+          handleClearSelection={vi.fn()}
+          sidePanel
+        />,
+        undefined,
+        routePath,
+        routePattern,
+      );
+
+      await user.click(screen.getByRole("button", { name: "Lock" }));
+      await user.click(
+        within(screen.getByRole("dialog")).getByRole("button", {
+          name: "Lock",
+        }),
+      );
+
+      expect(
+        await screen.findByText('The endpoint status is set to "error".'),
+      ).toBeInTheDocument();
+    });
+
+    it("renders multi-user modal copy and supports closing lock/unlock/delete dialogs", async () => {
+      const user = userEvent.setup();
+
+      renderWithProviders(
+        <UserPanelActionButtons
+          selectedUsers={getSelectedUsers(users, mixedSelectedUsers)}
+          handleClearSelection={vi.fn()}
+        />,
+        undefined,
+        routePath,
+        routePattern,
+      );
+
+      await user.click(screen.getByRole("button", { name: "Lock" }));
+      expect(
+        screen.getByRole("heading", {
+          name: `Lock ${mixedSelectedUsers.length} users`,
+        }),
+      ).toBeInTheDocument();
+      await user.click(
+        within(screen.getByRole("dialog")).getByRole("button", {
+          name: "Cancel",
+        }),
+      );
+      expect(
+        screen.queryByRole("heading", {
+          name: `Lock ${mixedSelectedUsers.length} users`,
+        }),
+      ).not.toBeInTheDocument();
+
+      await user.click(screen.getByRole("button", { name: "Unlock" }));
+      expect(
+        screen.getByRole("heading", {
+          name: `Unlock ${mixedSelectedUsers.length} users`,
+        }),
+      ).toBeInTheDocument();
+      await user.click(
+        within(screen.getByRole("dialog")).getByRole("button", {
+          name: "Cancel",
+        }),
+      );
+      expect(
+        screen.queryByRole("heading", {
+          name: `Unlock ${mixedSelectedUsers.length} users`,
+        }),
+      ).not.toBeInTheDocument();
+
+      await user.click(screen.getByRole("button", { name: "Delete" }));
+      expect(
+        screen.getByRole("heading", { name: "Delete users" }),
+      ).toBeInTheDocument();
+      expect(
+        screen.getByText(
+          "This will delete selected users. You can delete their home folders as well.",
+        ),
+      ).toBeInTheDocument();
+      await user.click(
+        within(screen.getByRole("dialog")).getByRole("button", {
+          name: "Cancel",
+        }),
+      );
+      expect(
+        screen.queryByRole("heading", { name: "Delete users" }),
+      ).not.toBeInTheDocument();
+    });
   });
 });
diff --git a/src/pages/dashboard/instances/[single]/tabs/users/UserPanelActionButtons/helpers.test.tsx b/src/pages/dashboard/instances/[single]/tabs/users/UserPanelActionButtons/helpers.test.tsx
new file mode 100644
index 000000000..6ef7776b5
--- /dev/null
+++ b/src/pages/dashboard/instances/[single]/tabs/users/UserPanelActionButtons/helpers.test.tsx
@@ -0,0 +1,138 @@
+import { render, screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import { users } from "@/tests/mocks/user";
+import {
+  UserAction,
+  getSelectedUsernames,
+  getUserLockStatusCounts,
+  renderModalBody,
+} from "./helpers";
+
+describe("UserPanelActionButtons helpers", () => {
+  it("returns selected usernames", () => {
+    expect(getSelectedUsernames(users.slice(0, 3))).toEqual([
+      "user1",
+      "user2",
+      "user3",
+    ]);
+  });
+
+  it("counts locked and unlocked users", () => {
+    expect(getUserLockStatusCounts(users.slice(0, 5))).toEqual({
+      locked: 2,
+      unlocked: 3,
+    });
+  });
+
+  it("renders single-user copy when a specific user is provided", () => {
+    const node = renderModalBody({
+      user: users[0],
+      selectedUsers: [users[0]],
+      userAction: UserAction.Lock,
+    });
+
+    render(<>{node}</>);
+
+    expect(
+      screen.getByText(/prevent this user from logging into this account/i),
+    ).toBeInTheDocument();
+  });
+
+  it("renders same-state copy when all selected users are unlocked and lock is requested", () => {
+    const selectedUsers = users.filter((user) => user.enabled);
+
+    const node = renderModalBody({
+      user: undefined,
+      selectedUsers,
+      userAction: UserAction.Lock,
+    });
+
+    render(<>{node}</>);
+
+    expect(
+      screen.getByText(/prevent users from logging into these accounts/i),
+    ).toBeInTheDocument();
+  });
+
+  it("renders mixed-state summary with hold/leave counts", () => {
+    const selectedUsers = users.slice(0, 4);
+
+    const node = renderModalBody({
+      user: undefined,
+      selectedUsers,
+      userAction: UserAction.Lock,
+    });
+
+    const { container } = render(<>{node}</>);
+
+    expect(
+      screen.getByText(/locking users removes their login access/i),
+    ).toBeInTheDocument();
+    expect(container).toHaveTextContent("You selected 4 users.");
+    expect(container).toHaveTextContent("lock 3 users");
+    expect(container).toHaveTextContent("leave 1 user locked");
+  });
+
+  it("renders unlock copy for a specific user", () => {
+    const lockedUser = users.find((user) => !user.enabled);
+    assert(lockedUser);
+
+    const node = renderModalBody({
+      user: lockedUser,
+      selectedUsers: [lockedUser],
+      userAction: UserAction.Unlock,
+    });
+
+    render(<>{node}</>);
+
+    expect(
+      screen.getByText(/restore login access for the user/i),
+    ).toBeInTheDocument();
+  });
+
+  it("renders same-state copy when all selected users are locked and unlock is requested", () => {
+    const selectedUsers = users.filter((user) => !user.enabled);
+
+    const node = renderModalBody({
+      user: undefined,
+      selectedUsers,
+      userAction: UserAction.Unlock,
+    });
+
+    render(<>{node}</>);
+
+    expect(
+      screen.getByText(/restore login access for the users of these accounts/i),
+    ).toBeInTheDocument();
+  });
+
+  it("returns an empty node for unknown actions", () => {
+    const node = renderModalBody({
+      user: users[0],
+      selectedUsers: [users[0]],
+      userAction: "unknown" as UserAction,
+    });
+
+    const { container } = render(<>{node}</>);
+    expect(container).toHaveTextContent("");
+  });
+
+  it("renders mixed-state summary for unlock action", () => {
+    const selectedUsers = users.slice(0, 4);
+
+    const node = renderModalBody({
+      user: undefined,
+      selectedUsers,
+      userAction: UserAction.Unlock,
+    });
+
+    const { container } = render(<>{node}</>);
+
+    expect(
+      screen.getByText(/unlocking users removes their login access/i),
+    ).toBeInTheDocument();
+    expect(container).toHaveTextContent("You selected 4 users.");
+    expect(container).toHaveTextContent("unlock 1 user");
+    expect(container).toHaveTextContent("leave 3 users unlocked");
+  });
+});
diff --git a/src/pages/dashboard/instances/[single]/tabs/users/UserPanelActionButtons/helpers.tsx b/src/pages/dashboard/instances/[single]/tabs/users/UserPanelActionButtons/helpers.tsx
index 5e7c971f3..2fef8a547 100644
--- a/src/pages/dashboard/instances/[single]/tabs/users/UserPanelActionButtons/helpers.tsx
+++ b/src/pages/dashboard/instances/[single]/tabs/users/UserPanelActionButtons/helpers.tsx
@@ -24,17 +24,16 @@ const getSingleUserMessage = (userAction: UserAction): string => {
   }
 };
 
-const getUsersWithSameStateMessage = (userAction: UserAction): string => {
-  switch (userAction) {
-    case UserAction.Lock:
-      return "This will prevent users from logging into these accounts without deleting the files belonging to the accounts.";
-    case UserAction.Unlock:
-      return "This will restore login access for the users of these accounts.";
-    default:
-      return "";
-  }
+const usersWithSameStateMessages: Record<UserAction, string> = {
+  [UserAction.Lock]:
+    "This will prevent users from logging into these accounts without deleting the files belonging to the accounts.",
+  [UserAction.Unlock]:
+    "This will restore login access for the users of these accounts.",
 };
 
+const getUsersWithSameStateMessage = (userAction: UserAction): string =>
+  usersWithSameStateMessages[userAction];
+
 export const getUserLockStatusCounts = (
   users: User[],
 ): { locked: number; unlocked: number } => {
diff --git a/src/pages/dashboard/overview/OverviewPage.test.tsx b/src/pages/dashboard/overview/OverviewPage.test.tsx
new file mode 100644
index 000000000..613cae330
--- /dev/null
+++ b/src/pages/dashboard/overview/OverviewPage.test.tsx
@@ -0,0 +1,26 @@
+import { screen } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+import { renderWithProviders } from "@/tests/render";
+import OverviewPage from "./OverviewPage";
+
+vi.mock("@/features/overview", async () => {
+  const actual = await vi.importActual("@/features/overview");
+
+  return {
+    ...actual,
+    ChartContainer: () => <div>Chart container</div>,
+  };
+});
+
+describe("OverviewPage", () => {
+  it("renders overview heading and key dashboard sections", async () => {
+    renderWithProviders(<OverviewPage />);
+
+    expect(
+      screen.getByRole("heading", { name: "Overview" }),
+    ).toBeInTheDocument();
+    expect(await screen.findByText("Chart container")).toBeInTheDocument();
+    expect(screen.getByText("Requires approval")).toBeInTheDocument();
+    expect(screen.getByText("In progress")).toBeInTheDocument();
+  });
+});
diff --git a/src/pages/dashboard/repositories/RepositoryPage.tsx b/src/pages/dashboard/repositories/RepositoryPage.tsx
deleted file mode 100644
index b9be62c03..000000000
--- a/src/pages/dashboard/repositories/RepositoryPage.tsx
+++ /dev/null
@@ -1,9 +0,0 @@
-import { ROUTES } from "@/libs/routes";
-import type { FC } from "react";
-import { Navigate } from "react-router";
-
-const RepositoryPage: FC = () => {
-  return <Navigate to={ROUTES.repositories.mirrors()} replace />;
-};
-
-export default RepositoryPage;
diff --git a/src/pages/dashboard/repositories/local-repositories/LocalRepositoriesPage.tsx b/src/pages/dashboard/repositories/local-repositories/LocalRepositoriesPage.tsx
index d861a67a3..f76f73c49 100644
--- a/src/pages/dashboard/repositories/local-repositories/LocalRepositoriesPage.tsx
+++ b/src/pages/dashboard/repositories/local-repositories/LocalRepositoriesPage.tsx
@@ -8,6 +8,7 @@ import useSidePanel from "@/hooks/useSidePanel";
 import { Button } from "@canonical/react-components";
 import type { FC } from "react";
 import { lazy, Suspense } from "react";
+import { GPG_KEYS_DOCS_URL } from "./constants";
 
 const NewAPTSourceForm = lazy(async () =>
   import("@/features/apt-sources").then((module) => ({
@@ -56,7 +57,7 @@ const APTSourcesPage: FC = () => {
                   You haven’t added any APT sources yet.
                 </p>
                 <a
-                  href="https://ubuntu.com/landscape/docs/repositories"
+                  href={GPG_KEYS_DOCS_URL}
                   target="_blank"
                   rel="nofollow noopener noreferrer"
                 >
diff --git a/src/pages/dashboard/repositories/local-repositories/constants.ts b/src/pages/dashboard/repositories/local-repositories/constants.ts
new file mode 100644
index 000000000..5b5d7c09f
--- /dev/null
+++ b/src/pages/dashboard/repositories/local-repositories/constants.ts
@@ -0,0 +1,2 @@
+export const GPG_KEYS_DOCS_URL =
+  "https://ubuntu.com/landscape/docs/repositories";
diff --git a/src/pages/dashboard/repositories/mirrors/DistributionsPage.test.tsx b/src/pages/dashboard/repositories/mirrors/DistributionsPage.test.tsx
new file mode 100644
index 000000000..c64ee5f56
--- /dev/null
+++ b/src/pages/dashboard/repositories/mirrors/DistributionsPage.test.tsx
@@ -0,0 +1,97 @@
+import { screen } from "@testing-library/react";
+import { afterEach, describe, expect, it } from "vitest";
+import userEvent from "@testing-library/user-event";
+import { PATHS, ROUTES } from "@/libs/routes";
+import { setEndpointStatus } from "@/tests/controllers/controller";
+import {
+  expectLoadingState,
+  resetScreenSize,
+  setScreenSize,
+} from "@/tests/helpers";
+import { renderWithProviders } from "@/tests/render";
+import DistributionsPage from "./DistributionsPage";
+
+describe("DistributionsPage", () => {
+  afterEach(() => {
+    resetScreenSize();
+  });
+
+  it("renders distributions and large-screen actions", async () => {
+    setScreenSize("lg");
+
+    renderWithProviders(<DistributionsPage />);
+
+    expect(
+      screen.getByRole("heading", { name: "Mirrors" }),
+    ).toBeInTheDocument();
+    await expectLoadingState();
+
+    expect(await screen.findByText("Distribution 1")).toBeInTheDocument();
+    expect(
+      screen.getByRole("button", { name: "Add distribution" }),
+    ).toBeInTheDocument();
+    expect(screen.getByRole("button", { name: "Add mirror" })).toBeEnabled();
+  });
+
+  it("disables add mirror when there are no distributions", async () => {
+    setScreenSize("lg");
+    setEndpointStatus("empty");
+
+    renderWithProviders(<DistributionsPage />);
+
+    await expectLoadingState();
+    expect(
+      screen.getByText("No mirrors have been added yet."),
+    ).toBeInTheDocument();
+    expect(screen.getByRole("button", { name: "Add mirror" })).toHaveAttribute(
+      "aria-disabled",
+      "true",
+    );
+  });
+
+  it("shows actions menu on small screens", async () => {
+    setScreenSize("xs");
+
+    renderWithProviders(<DistributionsPage />);
+
+    expect(screen.getByRole("button", { name: "Actions" })).toBeInTheDocument();
+  });
+
+  it("opens add distribution side panel", async () => {
+    const user = userEvent.setup();
+    setScreenSize("lg");
+
+    renderWithProviders(
+      <DistributionsPage />,
+      undefined,
+      ROUTES.repositories.mirrors(),
+      `/${PATHS.repositories.root}/${PATHS.repositories.mirrors}`,
+    );
+
+    await expectLoadingState();
+    await user.click(screen.getByRole("button", { name: "Add distribution" }));
+
+    expect(
+      await screen.findByRole("heading", { name: "Add distribution" }),
+    ).toBeInTheDocument();
+  });
+
+  it("opens add mirror side panel when distributions exist", async () => {
+    const user = userEvent.setup();
+    setScreenSize("lg");
+
+    renderWithProviders(
+      <DistributionsPage />,
+      undefined,
+      ROUTES.repositories.mirrors(),
+      `/${PATHS.repositories.root}/${PATHS.repositories.mirrors}`,
+    );
+
+    await expectLoadingState();
+    await user.click(screen.getByRole("button", { name: "Add mirror" }));
+
+    expect(
+      await screen.findByRole("heading", { name: "Add new mirror" }),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/pages/dashboard/repositories/publications/PublicationsPage.tsx b/src/pages/dashboard/repositories/publications/PublicationsPage.tsx
index d861a67a3..b635c9ce2 100644
--- a/src/pages/dashboard/repositories/publications/PublicationsPage.tsx
+++ b/src/pages/dashboard/repositories/publications/PublicationsPage.tsx
@@ -8,6 +8,7 @@ import useSidePanel from "@/hooks/useSidePanel";
 import { Button } from "@canonical/react-components";
 import type { FC } from "react";
 import { lazy, Suspense } from "react";
+import { APT_SOURCES_DOCS_URL } from "./constants";
 
 const NewAPTSourceForm = lazy(async () =>
   import("@/features/apt-sources").then((module) => ({
@@ -56,7 +57,7 @@ const APTSourcesPage: FC = () => {
                   You haven’t added any APT sources yet.
                 </p>
                 <a
-                  href="https://ubuntu.com/landscape/docs/repositories"
+                  href={APT_SOURCES_DOCS_URL}
                   target="_blank"
                   rel="nofollow noopener noreferrer"
                 >
diff --git a/src/pages/dashboard/settings/SettingsPage.test.tsx b/src/pages/dashboard/settings/SettingsPage.test.tsx
new file mode 100644
index 000000000..e918868ad
--- /dev/null
+++ b/src/pages/dashboard/settings/SettingsPage.test.tsx
@@ -0,0 +1,27 @@
+import { waitFor } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+import { ROUTES } from "@/libs/routes";
+import { renderWithProviders } from "@/tests/render";
+import SettingsPage from "./SettingsPage";
+
+const navigate = vi.fn();
+
+vi.mock("react-router", async () => {
+  const actual = await vi.importActual("react-router");
+  return {
+    ...actual,
+    useNavigate: () => navigate,
+  };
+});
+
+describe("SettingsPage", () => {
+  it("redirects to settings general page", async () => {
+    renderWithProviders(<SettingsPage />);
+
+    await waitFor(() => {
+      expect(navigate).toHaveBeenCalledWith(ROUTES.settings.general(), {
+        replace: true,
+      });
+    });
+  });
+});
diff --git a/src/pages/dashboard/settings/access-group/AccessGroupsPage.test.tsx b/src/pages/dashboard/settings/access-group/AccessGroupsPage.test.tsx
new file mode 100644
index 000000000..bc3c780cf
--- /dev/null
+++ b/src/pages/dashboard/settings/access-group/AccessGroupsPage.test.tsx
@@ -0,0 +1,59 @@
+import { screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import { setEndpointStatus } from "@/tests/controllers/controller";
+import { PATHS, ROUTES } from "@/libs/routes";
+import { renderWithProviders } from "@/tests/render";
+import userEvent from "@testing-library/user-event";
+import AccessGroupsPage from "./AccessGroupsPage";
+
+describe("AccessGroupsPage", () => {
+  it("renders access groups table content", async () => {
+    renderWithProviders(
+      <AccessGroupsPage />,
+      undefined,
+      ROUTES.settings.accessGroups(),
+      `/${PATHS.settings.root}/${PATHS.settings.accessGroups}`,
+    );
+
+    expect(
+      screen.getByRole("heading", { name: "Access groups" }),
+    ).toBeInTheDocument();
+    expect(
+      await screen.findByRole("rowheader", { name: "Global access" }),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("button", { name: "Add access group" }),
+    ).toBeInTheDocument();
+  });
+
+  it("renders empty access groups state", async () => {
+    setEndpointStatus("empty");
+
+    renderWithProviders(
+      <AccessGroupsPage />,
+      undefined,
+      ROUTES.settings.accessGroups(),
+      `/${PATHS.settings.root}/${PATHS.settings.accessGroups}`,
+    );
+
+    expect(
+      await screen.findByText("No access groups found"),
+    ).toBeInTheDocument();
+  });
+
+  it("opens add access group side panel", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <AccessGroupsPage />,
+      undefined,
+      ROUTES.settings.accessGroups(),
+      `/${PATHS.settings.root}/${PATHS.settings.accessGroups}`,
+    );
+
+    await user.click(screen.getByRole("button", { name: "Add access group" }));
+
+    expect(await screen.findByText("Title")).toBeInTheDocument();
+    expect(screen.getByText("Parent")).toBeInTheDocument();
+  });
+});
diff --git a/src/pages/dashboard/settings/roles/EditRoleForm/EditRoleForm.test.tsx b/src/pages/dashboard/settings/roles/EditRoleForm/EditRoleForm.test.tsx
index a74be59fb..8eccae8fa 100644
--- a/src/pages/dashboard/settings/roles/EditRoleForm/EditRoleForm.test.tsx
+++ b/src/pages/dashboard/settings/roles/EditRoleForm/EditRoleForm.test.tsx
@@ -1,20 +1,160 @@
 import { roles } from "@/tests/mocks/roles";
+import { setEndpointStatus } from "@/tests/controllers/controller";
 import { renderWithProviders } from "@/tests/render";
 import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
 import type { ComponentProps } from "react";
+import { PATHS, ROUTES } from "@/libs/routes";
 import EditRoleForm from "./EditRoleForm";
 
 const props: ComponentProps<typeof EditRoleForm> = {
   role: roles[0],
 };
+const routePattern = `/${PATHS.settings.root}/${PATHS.settings.roles}`;
+const routePath = ROUTES.settings.roles();
 
 describe("EditRoleForm", () => {
-  it("renders EditRoleForm", () => {
-    renderWithProviders(<EditRoleForm {...props} />);
+  it("renders EditRoleForm", async () => {
+    renderWithProviders(
+      <EditRoleForm {...props} />,
+      undefined,
+      routePath,
+      routePattern,
+    );
+
+    await screen.findAllByRole("checkbox");
 
     expect(screen.getByText("Global permissions")).toBeInTheDocument();
     expect(screen.getByText("Permissions")).toBeInTheDocument();
     expect(screen.getByText("Access Groups")).toBeInTheDocument();
     expect(screen.getByText(/save changes/i)).toBeInTheDocument();
   });
+
+  it("preselects role permissions and access groups", async () => {
+    renderWithProviders(
+      <EditRoleForm {...props} />,
+      undefined,
+      routePath,
+      routePattern,
+    );
+
+    const checkedOptions = await screen.findAllByRole("checkbox", {
+      checked: true,
+    });
+
+    expect(checkedOptions.length).toBeGreaterThan(0);
+  });
+
+  it("closes form when saving without changes", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <EditRoleForm {...props} />,
+      undefined,
+      routePath,
+      routePattern,
+    );
+
+    await screen.findAllByRole("checkbox");
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    expect(
+      screen.queryByText("Role changes have been saved"),
+    ).not.toBeInTheDocument();
+  });
+
+  it("submits role updates and shows success notification", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <EditRoleForm {...props} />,
+      undefined,
+      routePath,
+      routePattern,
+    );
+
+    await screen.findAllByRole("checkbox");
+
+    const removePermissionCheckbox = screen.getByRole("checkbox", {
+      name: "Manage instances",
+    });
+    const addPermissionCheckbox = screen.getByRole("checkbox", {
+      name: "Manage scripts",
+    });
+    const accessGroupCheckbox = screen.getByRole("checkbox", {
+      name: "Server machines",
+    });
+    await user.click(removePermissionCheckbox);
+    await user.click(addPermissionCheckbox);
+    await user.click(accessGroupCheckbox);
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    expect(
+      await screen.findByText("Role changes have been saved"),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByText("You modified the role 'GlobalAdmin'"),
+    ).toBeInTheDocument();
+  });
+
+  it("updates global permissions and existing permissions in one submit", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(
+      <EditRoleForm {...props} />,
+      undefined,
+      routePath,
+      routePattern,
+    );
+
+    await screen.findAllByRole("checkbox");
+
+    await user.click(
+      screen.getByRole("checkbox", {
+        name: "Manage account",
+      }),
+    );
+    await user.click(
+      screen.getByRole("checkbox", {
+        name: "Manage instances",
+      }),
+    );
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    expect(
+      await screen.findByText("Role changes have been saved"),
+    ).toBeInTheDocument();
+  });
+
+  it("shows endpoint error when role update fails", async () => {
+    const user = userEvent.setup();
+    setEndpointStatus({ status: "error", path: "editRole" });
+
+    renderWithProviders(
+      <EditRoleForm {...props} />,
+      undefined,
+      routePath,
+      routePattern,
+    );
+
+    await screen.findAllByRole("checkbox");
+
+    const removePermissionCheckbox = screen.getByRole("checkbox", {
+      name: "Manage instances",
+    });
+    const addPermissionCheckbox = screen.getByRole("checkbox", {
+      name: "Manage scripts",
+    });
+    const accessGroupCheckbox = screen.getByRole("checkbox", {
+      name: "Server machines",
+    });
+    await user.click(removePermissionCheckbox);
+    await user.click(addPermissionCheckbox);
+    await user.click(accessGroupCheckbox);
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    expect(
+      await screen.findByText('The endpoint status is set to "error".'),
+    ).toBeInTheDocument();
+  });
 });
diff --git a/src/pages/dashboard/settings/roles/EditRoleForm/helpers.test.ts b/src/pages/dashboard/settings/roles/EditRoleForm/helpers.test.ts
index cb09d9e04..e5c37dd2a 100644
--- a/src/pages/dashboard/settings/roles/EditRoleForm/helpers.test.ts
+++ b/src/pages/dashboard/settings/roles/EditRoleForm/helpers.test.ts
@@ -1,9 +1,14 @@
 import { accessGroups } from "@/tests/mocks/accessGroup";
-import { permissions } from "@/tests/mocks/roles";
+import { permissions, roles } from "@/tests/mocks/roles";
 import type { Role } from "@/types/Role";
-import type { PermissionOption } from "../types";
+import type { AccessGroupOption, PermissionOption } from "../types";
 import { getAccessGroupOptions, getPermissionOptions } from "../helpers";
-import { addImpliedViewPermissions, getValuesToEditRole } from "./helpers";
+import {
+  addImpliedViewPermissions,
+  getPromisesToEditRole,
+  getRoleFormProps,
+  getValuesToEditRole,
+} from "./helpers";
 
 const manageComputerPermission = permissions.find(
   (p) => p.name === "ManageComputer",
@@ -14,6 +19,36 @@ const viewComputerPermission = permissions.find(
 assert(manageComputerPermission, "Mock 'ManageComputer' permission not found");
 assert(viewComputerPermission, "Mock 'ViewComputer' permission not found");
 
+const helperAccessGroupOptions: AccessGroupOption[] = [
+  {
+    value: "global",
+    label: "global",
+    children: [],
+    depth: 0,
+    parents: [],
+  },
+  {
+    value: "Server machines",
+    label: "Server machines",
+    children: [],
+    depth: 0,
+    parents: [],
+  },
+];
+
+const helperPermissionOptions: PermissionOption[] = [
+  {
+    values: { manage: "ManageComputers", view: "ViewComputers" },
+    label: "Computers",
+    global: false,
+  },
+  {
+    values: { manage: "ManageScripts", view: "ViewScripts" },
+    label: "Scripts",
+    global: false,
+  },
+];
+
 describe("Role Helpers", () => {
   describe("addImpliedViewPermissions", () => {
     const permissionOptions = getPermissionOptions(permissions);
@@ -62,8 +97,8 @@ describe("Role Helpers", () => {
   });
 
   describe("getValuesToEditRole", () => {
-    const permissionOptions = getPermissionOptions(permissions);
-    const accessGroupOptions = getAccessGroupOptions(accessGroups);
+    const rolePermissionOptions = getPermissionOptions(permissions);
+    const roleAccessGroupOptions = getAccessGroupOptions(accessGroups);
     const mockRole: Role = {
       name: "TestRole",
       permissions: [],
@@ -89,8 +124,8 @@ describe("Role Helpers", () => {
       const { permissionsToAdd, permissionsToRemove } = getValuesToEditRole(
         formValues,
         role,
-        accessGroupOptions,
-        permissionOptions,
+        roleAccessGroupOptions,
+        rolePermissionOptions,
       );
 
       expect(permissionsToAdd).toEqual([]);
@@ -110,8 +145,8 @@ describe("Role Helpers", () => {
       const { permissionsToAdd, permissionsToRemove } = getValuesToEditRole(
         formValues,
         role,
-        accessGroupOptions,
-        permissionOptions,
+        roleAccessGroupOptions,
+        rolePermissionOptions,
       );
 
       expect(permissionsToAdd).toEqual([]);
@@ -136,12 +171,108 @@ describe("Role Helpers", () => {
       const { permissionsToAdd, permissionsToRemove } = getValuesToEditRole(
         formValues,
         role,
-        accessGroupOptions,
-        permissionOptions,
+        roleAccessGroupOptions,
+        rolePermissionOptions,
       );
 
       expect(permissionsToAdd).toEqual([]);
       expect(permissionsToRemove).toEqual([]);
     });
+
+    it("computes permission and access-group deltas", () => {
+      const role = {
+        ...mockRole,
+        permissions: ["ManageComputers"],
+        global_permissions: ["ViewComputers"],
+        access_groups: ["global"],
+      };
+      const values = {
+        permissions: ["ManageScripts"],
+        accessGroups: ["global", "Server machines"],
+      };
+
+      expect(
+        getValuesToEditRole(
+          values,
+          role,
+          helperAccessGroupOptions,
+          helperPermissionOptions,
+        ),
+      ).toEqual({
+        accessGroupsToAdd: ["Server machines"],
+        accessGroupsToRemove: [],
+        permissionsToAdd: ["ManageScripts", "ViewScripts"],
+        permissionsToRemove: ["ManageComputers", "ViewComputers"],
+      });
+    });
+  });
+
+  describe("getPromisesToEditRole", () => {
+    it("builds mutation promises only for changed values", () => {
+      const addAccessGroups = vi.fn().mockResolvedValue({} as never);
+      const addPermissions = vi.fn().mockResolvedValue({} as never);
+      const removeAccessGroups = vi.fn().mockResolvedValue({} as never);
+      const removePermissions = vi.fn().mockResolvedValue({} as never);
+
+      const promises = getPromisesToEditRole(
+        {
+          permissions: ["ManageScripts"],
+          accessGroups: ["global", "Server machines"],
+        },
+        {
+          ...roles[0],
+          permissions: ["ManageComputers"],
+          global_permissions: ["ViewComputers"],
+          access_groups: ["global"],
+        },
+        helperAccessGroupOptions,
+        helperPermissionOptions,
+        {
+          addAccessGroups,
+          addPermissions,
+          removeAccessGroups,
+          removePermissions,
+        },
+      );
+
+      expect(promises.addAccessGroupsPromise).toBeDefined();
+      expect(promises.addPermissionsPromise).toBeDefined();
+      expect(promises.removePermissionsPromise).toBeDefined();
+      expect(promises.removeAccessGroupsPromise).toBeUndefined();
+    });
+  });
+
+  describe("getRoleFormProps", () => {
+    it("builds form props with implied permissions and nested access groups", () => {
+      const formProps = getRoleFormProps(
+        {
+          ...roles[0],
+          access_groups: ["global"],
+          permissions: ["ManageComputers"],
+          global_permissions: [],
+        },
+        [
+          {
+            value: "global",
+            label: "global",
+            children: ["child-group"],
+            depth: 0,
+            parents: [],
+          },
+        ],
+        [
+          {
+            values: { manage: "ManageComputers", view: "ViewComputers" },
+            label: "Computers",
+            global: false,
+          },
+        ],
+      );
+
+      expect(formProps).toEqual({
+        accessGroups: ["global", "child-group"],
+        permissions: ["ManageComputers", "ViewComputers"],
+      });
+    });
   });
 });
diff --git a/src/routes/AuthRoutes.test.tsx b/src/routes/AuthRoutes.test.tsx
new file mode 100644
index 000000000..481e586bd
--- /dev/null
+++ b/src/routes/AuthRoutes.test.tsx
@@ -0,0 +1,74 @@
+import {
+  Children,
+  isValidElement,
+  type ReactElement,
+  type ReactNode,
+} from "react";
+import { Outlet } from "react-router";
+import { describe, expect, it } from "vitest";
+import { GuestGuard } from "@/components/guards/GuestGuard";
+import { FeatureGuard } from "@/components/guards/FeatureGuard";
+import { PATHS } from "@/libs/routes";
+import { AuthRoutes } from "./AuthRoutes";
+
+interface RouteLikeProps {
+  children?: ReactNode;
+  element?: ReactElement;
+  path?: string;
+}
+
+const isRouteElement = (
+  value: unknown,
+): value is ReactElement<RouteLikeProps> =>
+  isValidElement<RouteLikeProps>(value);
+
+const getRouteChildren = (element: ReactElement<RouteLikeProps>) => {
+  return Children.toArray(element.props.children).filter(isRouteElement);
+};
+
+describe("AuthRoutes", () => {
+  it("wraps auth routes with guest guard and outlet", () => {
+    const wrapper = (AuthRoutes as ReactElement<RouteLikeProps>).props.element;
+    assert(wrapper);
+    const guardWrapper = wrapper as ReactElement<{ children: ReactElement }>;
+    expect(guardWrapper.type).toBe(GuestGuard);
+
+    const wrappedChild = guardWrapper.props.children;
+    expect(wrappedChild.type).toBe(Outlet);
+  });
+
+  it("defines expected auth paths", () => {
+    const childRoutes = getRouteChildren(
+      AuthRoutes as ReactElement<RouteLikeProps>,
+    );
+    const paths = childRoutes.map((route) => route.props.path);
+
+    expect(paths).toContain(PATHS.auth.login);
+    expect(paths).toContain(PATHS.auth.invitation);
+    expect(paths).toContain(PATHS.auth.createAccount);
+    expect(paths).toContain(PATHS.auth.noAccess);
+    expect(paths).toContain(PATHS.auth.handleOidc);
+    expect(paths).toContain(PATHS.auth.handleUbuntuOne);
+    expect(paths).toContain(PATHS.auth.attach);
+    expect(paths).toContain(PATHS.auth.supportLogin);
+  });
+
+  it("uses feature guard for attach and support login routes", () => {
+    const childRoutes = getRouteChildren(
+      AuthRoutes as ReactElement<RouteLikeProps>,
+    );
+
+    const attachRoute = childRoutes.find(
+      (route) => route.props.path === PATHS.auth.attach,
+    );
+    const supportLoginRoute = childRoutes.find(
+      (route) => route.props.path === PATHS.auth.supportLogin,
+    );
+
+    assert(attachRoute?.props.element);
+    assert(supportLoginRoute?.props.element);
+
+    expect(attachRoute.props.element.type).toBe(FeatureGuard);
+    expect(supportLoginRoute.props.element.type).toBe(FeatureGuard);
+  });
+});
diff --git a/src/routes/elements.test.tsx b/src/routes/elements.test.tsx
new file mode 100644
index 000000000..2545d3c54
--- /dev/null
+++ b/src/routes/elements.test.tsx
@@ -0,0 +1,131 @@
+import { describe, expect, it } from "vitest";
+import type { FC, ReactElement } from "react";
+import * as Pages from "./elements";
+
+const getLazyElementType = (
+  Page: FC,
+): {
+  _payload: unknown;
+  _init: (payload: unknown) => unknown;
+} => {
+  const element = Page({}) as ReactElement<{ children: ReactElement }>;
+  const lazyElement = element.props.children;
+  return lazyElement.type as unknown as {
+    _payload: unknown;
+    _init: (payload: unknown) => unknown;
+  };
+};
+
+const resolveLoadableImport = async (Page: FC) => {
+  const lazyType = getLazyElementType(Page);
+  try {
+    lazyType._init(lazyType._payload);
+  } catch (error) {
+    if (error instanceof Promise) {
+      await error;
+      return;
+    }
+
+    throw error;
+  }
+};
+
+describe("route elements", () => {
+  it("sets loadable display names", () => {
+    expect(Pages.LoginPage.displayName).toContain("Loadable(");
+    expect(Pages.PageNotFound.displayName).toContain("Loadable(");
+    expect(Pages.DashboardPage.displayName).toContain("Loadable(");
+  });
+
+  it("exports wrapped route components", () => {
+    const exportedPages = [
+      Pages.OidcAuthPage,
+      Pages.UbuntuOneAuthPage,
+      Pages.InvitationPage,
+      Pages.AccountCreationPage,
+      Pages.NoAccessPage,
+      Pages.LoginPage,
+      Pages.SupportLoginPage,
+      Pages.AttachPage,
+      Pages.PageNotFound,
+      Pages.EnvError,
+      Pages.DashboardPage,
+      Pages.OverviewPage,
+      Pages.ActivitiesPage,
+      Pages.ScriptsPage,
+      Pages.EventsLogPage,
+      Pages.AlertNotificationsPage,
+      Pages.InstancesPage,
+      Pages.SingleInstance,
+      Pages.DistributionsPage,
+      Pages.RepositoryProfilesPage,
+      Pages.GPGKeysPage,
+      Pages.APTSourcesPage,
+      Pages.PackageProfilesPage,
+      Pages.RemovalProfilesPage,
+      Pages.UpgradeProfilesPage,
+      Pages.WslProfilesPage,
+      Pages.SecurityProfilesPage,
+      Pages.RebootProfilesPage,
+      Pages.AccessGroupsPage,
+      Pages.AdministratorsPage,
+      Pages.EmployeesPage,
+      Pages.RolesPage,
+      Pages.GeneralOrganisationSettings,
+      Pages.IdentityProvidersPage,
+      Pages.GeneralSettings,
+      Pages.Alerts,
+      Pages.ApiCredentials,
+    ];
+
+    for (const exportedPage of exportedPages) {
+      expect(typeof exportedPage).toBe("function");
+    }
+  });
+
+  it("resolves lazy imports for exported route components", async () => {
+    const exportedPages = [
+      Pages.OidcAuthPage,
+      Pages.UbuntuOneAuthPage,
+      Pages.InvitationPage,
+      Pages.AccountCreationPage,
+      Pages.NoAccessPage,
+      Pages.LoginPage,
+      Pages.SupportLoginPage,
+      Pages.AttachPage,
+      Pages.PageNotFound,
+      Pages.EnvError,
+      Pages.DashboardPage,
+      Pages.OverviewPage,
+      Pages.ActivitiesPage,
+      Pages.ScriptsPage,
+      Pages.EventsLogPage,
+      Pages.AlertNotificationsPage,
+      Pages.InstancesPage,
+      Pages.SingleInstance,
+      Pages.DistributionsPage,
+      Pages.RepositoryProfilesPage,
+      Pages.GPGKeysPage,
+      Pages.APTSourcesPage,
+      Pages.PackageProfilesPage,
+      Pages.RemovalProfilesPage,
+      Pages.UpgradeProfilesPage,
+      Pages.WslProfilesPage,
+      Pages.SecurityProfilesPage,
+      Pages.RebootProfilesPage,
+      Pages.AccessGroupsPage,
+      Pages.AdministratorsPage,
+      Pages.EmployeesPage,
+      Pages.RolesPage,
+      Pages.GeneralOrganisationSettings,
+      Pages.IdentityProvidersPage,
+      Pages.GeneralSettings,
+      Pages.Alerts,
+      Pages.ApiCredentials,
+    ] as const;
+
+    for (const exportedPage of exportedPages) {
+      await resolveLoadableImport(exportedPage);
+    }
+  });
+});
diff --git a/src/tests/browser.ts b/src/tests/browser.ts
index 7e486456b..b46a3b2b4 100644
--- a/src/tests/browser.ts
+++ b/src/tests/browser.ts
@@ -17,11 +17,7 @@ const handlers: RequestHandler[] = [
       return passthrough();
     }
 
-    if (
-      MSW_ENDPOINTS_TO_INTERCEPT.some((url: string) =>
-        request.url.includes(url),
-      )
-    ) {
+    if (MSW_ENDPOINTS_TO_INTERCEPT.some((url) => request.url.includes(url))) {
       return;
     }
 
diff --git a/src/tests/mocks/alerts.ts b/src/tests/mocks/alerts.ts
index 3efc302f6..df870acbc 100644
--- a/src/tests/mocks/alerts.ts
+++ b/src/tests/mocks/alerts.ts
@@ -126,6 +126,18 @@ export const alerts = [
   },
 ] as const satisfies Alert[];
 
+export const licenseAlert: Alert = {
+  id: 9999,
+  alert_type: "LicenseSeatsAlert",
+  description: "Alert when available seats are low",
+  subscribed: false,
+  status: "OK",
+  scope: "account",
+  all_computers: false,
+  tags: [],
+  label: "License Seats Alert",
+};
+
 export const alertsSummary = [
   {
     id: 1,
diff --git a/src/tests/mocks/instance.ts b/src/tests/mocks/instance.ts
index 71e12922a..e3ce4f4fd 100644
--- a/src/tests/mocks/instance.ts
+++ b/src/tests/mocks/instance.ts
@@ -1,5 +1,6 @@
 import type {
   Instance,
+  InstanceWithoutRelation,
   PendingInstance,
   WindowsInstance,
 } from "@/types/Instance";
@@ -211,6 +212,7 @@ export const windowsInstance: WindowsInstance = {
       employee_id: null,
       archived: false,
       registered_at: "2023-11-29T18:29:25Z",
+      has_release_upgrades: true,
     },
     {
       id: 65,
@@ -340,8 +342,9 @@ export const windowsInstance: WindowsInstance = {
       employee_id: null,
       archived: false,
       registered_at: "2023-11-29T18:29:25Z",
+      has_release_upgrades: true,
     },
-  ],
+  ] as const satisfies InstanceWithoutRelation[],
   parent: null,
   distribution_info: {
     code_name: "windows",
diff --git a/src/tests/mocks/wsl.ts b/src/tests/mocks/wsl.ts
index df302c086..1a7df2210 100644
--- a/src/tests/mocks/wsl.ts
+++ b/src/tests/mocks/wsl.ts
@@ -43,7 +43,7 @@ export const uninstalledInstanceChild: InstanceChild = {
   default: null,
 };
 
-export const instanceChildren: InstanceChild[] = [
+export const instanceChildren = [
   compliantInstanceChild,
   uninstalledInstanceChild,
   {
@@ -102,4 +102,4 @@ export const instanceChildren: InstanceChild[] = [
     registered: true,
     default: false,
   },
-];
+] as const satisfies InstanceChild[];
diff --git a/src/tests/monacoMock.tsx b/src/tests/monacoMock.tsx
index 15b40904f..b8982855c 100644
--- a/src/tests/monacoMock.tsx
+++ b/src/tests/monacoMock.tsx
@@ -1,4 +1,5 @@
 import React from "react";
+import { useEffect } from "react";
 
 interface EditorProps {
   readonly value?: string;
@@ -7,31 +8,71 @@ interface EditorProps {
   readonly language?: string;
   readonly theme?: string;
   readonly options?: Record<string, unknown>;
-  readonly beforeMount?: unknown;
+  readonly beforeMount?: (monaco: unknown) => void;
   readonly onMount?: unknown;
   readonly loading?: React.ReactNode;
   readonly className?: string;
 }
 
+interface MonacoTextareaProps {
+  readonly beforeMount?: (monaco: unknown) => void;
+  readonly className?: string;
+  readonly defaultValue?: string;
+  readonly language?: string;
+  readonly onChange?: (value: string) => void;
+  readonly theme?: string;
+  readonly value?: string;
+}
+
+function MonacoTextarea({
+  beforeMount,
+  className,
+  defaultValue,
+  language,
+  onChange,
+  theme,
+  value,
+}: MonacoTextareaProps) {
+  useEffect(() => {
+    beforeMount?.({ mocked: true });
+  }, [beforeMount]);
+
+  return (
+    <textarea
+      data-testid="mock-monaco"
+      data-language={language}
+      data-theme={theme}
+      className={className}
+      value={value ?? defaultValue}
+      onChange={(e) => onChange?.(e.target.value)}
+    />
+  );
+}
+
 export const Editor = ({
   value,
   onChange,
   defaultValue,
-  language: _language,
-  theme: _theme,
+  language,
+  theme,
   options: _options,
-  beforeMount: _beforeMount,
+  beforeMount,
   onMount: _onMount,
   loading: _loading,
   className,
-}: EditorProps) => (
-  <textarea
-    data-testid="mock-monaco"
-    className={className}
-    value={value ?? defaultValue}
-    onChange={(e) => onChange?.(e.target.value)}
-  />
-);
+}: EditorProps) => {
+  return (
+    <MonacoTextarea
+      beforeMount={beforeMount}
+      className={className}
+      defaultValue={defaultValue}
+      language={language}
+      onChange={onChange}
+      theme={theme}
+      value={value}
+    />
+  );
+};
 
 interface CodeEditorMockProps {
   readonly label: string;
diff --git a/src/tests/server/handlers/_constants.ts b/src/tests/server/handlers/_constants.ts
index 4a056b2b0..e70034dac 100644
--- a/src/tests/server/handlers/_constants.ts
+++ b/src/tests/server/handlers/_constants.ts
@@ -1,10 +1,13 @@
 import { HttpResponse } from "msw";
 
 export const ENDPOINT_STATUS_API_ERROR_MESSAGE = `The endpoint status is set to "error".`;
-export const ENDPOINT_STATUS_API_ERROR = HttpResponse.json(
-  {
-    error: "EndpointStatusError",
-    message: ENDPOINT_STATUS_API_ERROR_MESSAGE,
-  },
-  { status: 500 },
-);
+export const getEndpointStatusApiError = () =>
+  HttpResponse.json(
+    {
+      error: "EndpointStatusError",
+      message: ENDPOINT_STATUS_API_ERROR_MESSAGE,
+    },
+    { status: 500 },
+  );
+
+export const ENDPOINT_STATUS_API_ERROR = getEndpointStatusApiError();
diff --git a/src/tests/server/handlers/accessGroup.ts b/src/tests/server/handlers/accessGroup.ts
index c0aff62f9..a3c84b60c 100644
--- a/src/tests/server/handlers/accessGroup.ts
+++ b/src/tests/server/handlers/accessGroup.ts
@@ -4,6 +4,7 @@ import { accessGroups } from "@/tests/mocks/accessGroup";
 import type { AccessGroup } from "@/features/access-groups";
 import { isAction } from "@/tests/server/handlers/_helpers";
 import { getEndpointStatus } from "@/tests/controllers/controller";
+import { getEndpointStatusApiError } from "./_constants";
 
 export default [
   http.get<never, never, AccessGroup[]>(API_URL_OLD, ({ request }) => {
@@ -13,6 +14,13 @@ export default [
 
     const endpointStatus = getEndpointStatus();
 
+    if (
+      endpointStatus.status === "error" &&
+      endpointStatus.path === "GetAccessGroups"
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
     if (endpointStatus.status === "empty") {
       return HttpResponse.json([]);
     }
diff --git a/src/tests/server/handlers/activity.ts b/src/tests/server/handlers/activity.ts
index 3d1515294..541bf1a76 100644
--- a/src/tests/server/handlers/activity.ts
+++ b/src/tests/server/handlers/activity.ts
@@ -8,7 +8,7 @@ import {
 } from "@/tests/mocks/activity";
 import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
 import { http, HttpResponse } from "msw";
-import { ENDPOINT_STATUS_API_ERROR } from "./_constants";
+import { getEndpointStatusApiError } from "./_constants";
 import { generatePaginatedResponse, isAction } from "./_helpers";
 
 const STATUS_QUERY_REGEX = /(?:^|\s)status:([^\s]+)/;
@@ -54,7 +54,19 @@ export default [
       const endpointStatus = getEndpointStatus();
 
       if (endpointStatus.status === "error") {
-        throw ENDPOINT_STATUS_API_ERROR;
+        throw getEndpointStatusApiError();
+      }
+
+      if (
+        endpointStatus.status === "empty" &&
+        (!endpointStatus.path || endpointStatus.path.includes("activities"))
+      ) {
+        return HttpResponse.json({
+          results: [],
+          count: 0,
+          next: null,
+          previous: null,
+        });
       }
 
       const url = new URL(request.url);
@@ -168,7 +180,7 @@ export default [
       const endpointStatus = getEndpointStatus();
 
       if (endpointStatus.status === "error") {
-        throw ENDPOINT_STATUS_API_ERROR;
+        throw getEndpointStatusApiError();
       }
 
       return HttpResponse.json([activities[0].id, activities[1].id]);
@@ -181,7 +193,7 @@ export default [
       const endpointStatus = getEndpointStatus();
 
       if (endpointStatus.status === "error") {
-        throw ENDPOINT_STATUS_API_ERROR;
+        throw getEndpointStatusApiError();
       }
 
       return HttpResponse.json([activities[0].id, activities[1].id]);
diff --git a/src/tests/server/handlers/alerts.ts b/src/tests/server/handlers/alerts.ts
index 9b0a8f30c..50913d4ba 100644
--- a/src/tests/server/handlers/alerts.ts
+++ b/src/tests/server/handlers/alerts.ts
@@ -1,14 +1,20 @@
 import { API_URL, API_URL_OLD } from "@/constants";
 import type { AlertSummaryResponse } from "@/features/alert-notifications";
-import type { Alert, SubscriptionParams } from "@/features/alerts";
+import type {
+  Alert,
+  AssociateAlertParams,
+  DisassociateAlertParams,
+  SubscriptionParams,
+} from "@/features/alerts";
 import { getEndpointStatus } from "@/tests/controllers/controller";
-import { alerts, alertsSummary } from "@/tests/mocks/alerts";
+import { alerts, alertsSummary, licenseAlert } from "@/tests/mocks/alerts";
 import { isAction } from "@/tests/server/handlers/_helpers";
 import { http, HttpResponse } from "msw";
+import { getEndpointStatusApiError } from "./_constants";
 
 export default [
   http.get<never, never, Alert[]>(`${API_URL}alerts`, () => {
-    return HttpResponse.json(alerts);
+    return HttpResponse.json([...alerts, licenseAlert]);
   }),
 
   http.get<never, never, AlertSummaryResponse>(
@@ -43,4 +49,43 @@ export default [
 
     return HttpResponse.json();
   }),
+
+  http.get<never, AssociateAlertParams, Alert>(API_URL_OLD, ({ request }) => {
+    if (!isAction(request, "AssociateAlert")) {
+      return;
+    }
+    const endpointStatus = getEndpointStatus();
+    const action = new URL(request.url).searchParams.get("action");
+    if (
+      endpointStatus.status === "error" &&
+      (!endpointStatus.path || endpointStatus.path === action)
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
+    const [firstAlert] = alerts;
+
+    return HttpResponse.json(firstAlert);
+  }),
+
+  http.get<never, DisassociateAlertParams, Alert>(
+    API_URL_OLD,
+    ({ request }) => {
+      if (!isAction(request, "DisassociateAlert")) {
+        return;
+      }
+      const endpointStatus = getEndpointStatus();
+      const action = new URL(request.url).searchParams.get("action");
+      if (
+        endpointStatus.status === "error" &&
+        (!endpointStatus.path || endpointStatus.path === action)
+      ) {
+        throw getEndpointStatusApiError();
+      }
+
+      const [firstAlert] = alerts;
+
+      return HttpResponse.json(firstAlert);
+    },
+  ),
 ];
diff --git a/src/tests/server/handlers/aptSource.ts b/src/tests/server/handlers/aptSource.ts
index 0e7abde8d..06c9b6185 100644
--- a/src/tests/server/handlers/aptSource.ts
+++ b/src/tests/server/handlers/aptSource.ts
@@ -4,7 +4,7 @@ import { getEndpointStatus } from "@/tests/controllers/controller";
 import { aptSources } from "@/tests/mocks/apt-sources";
 import { isAction } from "@/tests/server/handlers/_helpers";
 import { http, HttpResponse } from "msw";
-import { ENDPOINT_STATUS_API_ERROR } from "./_constants";
+import { getEndpointStatusApiError } from "./_constants";
 
 export default [
   http.get<never, GetAPTSourcesParams, APTSource[]>(
@@ -27,7 +27,7 @@ export default [
         endpointStatus.path === "repository/apt-source/:sourceId")
     ) {
       if (endpointStatus.status === "error") {
-        throw HttpResponse.json(ENDPOINT_STATUS_API_ERROR, { status: 500 });
+        throw getEndpointStatusApiError();
       }
     }
 
@@ -35,6 +35,21 @@ export default [
   }),
 
   http.get(`${API_URL}repository/apt-source`, () => {
+    const endpointStatus = getEndpointStatus();
+
+    if (
+      !endpointStatus.path ||
+      (endpointStatus.path && endpointStatus.path === "repository/apt-source")
+    ) {
+      if (endpointStatus.status === "error") {
+        throw getEndpointStatusApiError();
+      }
+
+      if (endpointStatus.status === "empty") {
+        return HttpResponse.json({ results: [] });
+      }
+    }
+
     return HttpResponse.json({ results: aptSources });
   }),
 ];
diff --git a/src/tests/server/handlers/auth.ts b/src/tests/server/handlers/auth.ts
index e2f34c510..f704fffbf 100644
--- a/src/tests/server/handlers/auth.ts
+++ b/src/tests/server/handlers/auth.ts
@@ -16,6 +16,7 @@ import {
 import { allLoginMethods } from "@/tests/mocks/loginMethods";
 import { getEndpointStatus } from "@/tests/controllers/controller";
 import { invitationState } from "./invitations";
+import { getEndpointStatusApiError } from "./_constants";
 
 interface SwitchAccountParams {
   account_name: string;
@@ -157,10 +158,26 @@ export default [
     });
   }),
 
-  http.get(
+  http.get<{ attach_code: string }>(
     `${API_URL}ubuntu-installer-attach-sessions/code/:attach_code`,
-    () => {
+    ({ params }) => {
       const HOUR_S = 3600;
+      const endpointStatus = getEndpointStatus();
+
+      if (
+        endpointStatus.status === "error" &&
+        (!endpointStatus.path ||
+          endpointStatus.path.includes("ubuntu-installer-attach-sessions/code"))
+      ) {
+        throw getEndpointStatusApiError();
+      }
+
+      if (params.attach_code === "EXPIRE") {
+        return HttpResponse.json({
+          valid: false,
+          valid_until: null,
+        });
+      }
 
       return HttpResponse.json({
         valid: true,
@@ -369,7 +386,7 @@ export default [
 
       return HttpResponse.json({
         accounts: [createdAccount],
-        current_account: createdAccount ? createdAccount.account : "",
+        current_account: createdAccount.account,
         email: "new-user@example.com",
         has_password: false,
         name: "New Ubuntu One User",
diff --git a/src/tests/server/handlers/autoinstallFiles.ts b/src/tests/server/handlers/autoinstallFiles.ts
index 0ed8b5eaf..401dc3ade 100644
--- a/src/tests/server/handlers/autoinstallFiles.ts
+++ b/src/tests/server/handlers/autoinstallFiles.ts
@@ -12,6 +12,7 @@ import { autoinstallFiles } from "@/tests/mocks/autoinstallFiles";
 import { generatePaginatedResponse } from "@/tests/server/handlers/_helpers";
 import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
 import { delay, http, HttpResponse } from "msw";
+import { getEndpointStatusApiError } from "./_constants";
 
 export default [
   http.get<
@@ -87,6 +88,32 @@ export default [
       });
     },
   ),
+  http.post(`${API_URL}autoinstall:validate`, async () => {
+    const endpointStatus = getEndpointStatus();
+
+    if (
+      endpointStatus.status === "error" &&
+      endpointStatus.path === "autoinstall:validate-override"
+    ) {
+      return HttpResponse.json(
+        {
+          error: "AutoinstallOverrideWarning",
+          message:
+            "The autoinstall file you submitted overrides fields users, identity",
+        },
+        { status: 400 },
+      );
+    }
+
+    if (
+      endpointStatus.status === "error" &&
+      endpointStatus.path === "autoinstall:validate"
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
+    return HttpResponse.json({});
+  }),
 
   http.delete<{ autoinstallFileId: string }, DeleteAutoinstallFileParams, null>(
     `${API_URL}autoinstall/:autoinstallFileId`,
diff --git a/src/tests/server/handlers/employees.ts b/src/tests/server/handlers/employees.ts
index 74cbb22d1..447d65d49 100644
--- a/src/tests/server/handlers/employees.ts
+++ b/src/tests/server/handlers/employees.ts
@@ -5,20 +5,35 @@ import { employees } from "@/tests/mocks/employees";
 import { generatePaginatedResponse } from "@/tests/server/handlers/_helpers";
 import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
 import { http, HttpResponse } from "msw";
+import { getEndpointStatusApiError } from "./_constants";
 
 export default [
   http.get<never, GetEmployeesParams, ApiPaginatedResponse<Employee>>(
     `${API_URL}employees`,
     async ({ request }) => {
       const DEFAULT_PAGE_SIZE = 20;
+      const NEXT_PAGE_LOADING_DELAY_MS = 150;
 
       const endpointStatus = getEndpointStatus();
 
+      if (
+        endpointStatus.status === "error" &&
+        (!endpointStatus.path || endpointStatus.path === "employees")
+      ) {
+        throw getEndpointStatusApiError();
+      }
+
       const url = new URL(request.url);
       const offset = Number(url.searchParams.get("offset")) || 0;
       const limit = Number(url.searchParams.get("limit")) || DEFAULT_PAGE_SIZE;
       const search = url.searchParams.get("search") ?? "";
 
+      if (endpointStatus.path === "employees:next-page-loading" && offset > 0) {
+        await new Promise((resolve) => {
+          setTimeout(resolve, NEXT_PAGE_LOADING_DELAY_MS);
+        });
+      }
+
       return HttpResponse.json(
         generatePaginatedResponse<Employee>({
           data: endpointStatus.status === "empty" ? [] : employees,
@@ -35,6 +50,32 @@ export default [
     return HttpResponse.json();
   }),
 
+  http.post(`${API_URL}employees/:id/computers`, async () => {
+    const endpointStatus = getEndpointStatus();
+    if (
+      endpointStatus.status === "error" &&
+      (!endpointStatus.path ||
+        endpointStatus.path === "associateEmployeeWithInstance")
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
+    return HttpResponse.json();
+  }),
+
+  http.delete(`${API_URL}employees/:id/computers/:computerId`, async () => {
+    const endpointStatus = getEndpointStatus();
+    if (
+      endpointStatus.status === "error" &&
+      (!endpointStatus.path ||
+        endpointStatus.path === "disassociateEmployeeFromInstance")
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
+    return HttpResponse.json();
+  }),
+
   http.post(`${API_URL}employees/:id/offboard`, async () => {
     return HttpResponse.json();
   }),
diff --git a/src/tests/server/handlers/gpgKey.ts b/src/tests/server/handlers/gpgKey.ts
index eb830b661..009cf8ac6 100644
--- a/src/tests/server/handlers/gpgKey.ts
+++ b/src/tests/server/handlers/gpgKey.ts
@@ -1,8 +1,10 @@
 import { http, HttpResponse } from "msw";
 import { API_URL_OLD } from "@/constants";
 import type { GetGPGKeysParams, GPGKey } from "@/features/gpg-keys";
+import { getEndpointStatus } from "@/tests/controllers/controller";
 import { gpgKeys } from "@/tests/mocks/gpgKey";
 import { isAction } from "@/tests/server/handlers/_helpers";
+import { getEndpointStatusApiError } from "./_constants";
 
 export default [
   http.get<never, GetGPGKeysParams, GPGKey[]>(API_URL_OLD, ({ request }) => {
@@ -10,6 +12,35 @@ export default [
       return;
     }
 
+    const endpointStatus = getEndpointStatus();
+
+    if (!endpointStatus.path || endpointStatus.path === "gpgKey") {
+      if (endpointStatus.status === "error") {
+        throw getEndpointStatusApiError();
+      }
+
+      if (endpointStatus.status === "empty") {
+        return HttpResponse.json([]);
+      }
+    }
+
     return HttpResponse.json(gpgKeys);
   }),
+
+  http.get(API_URL_OLD, ({ request }) => {
+    if (!isAction(request, "ImportGPGKey")) {
+      return;
+    }
+
+    const endpointStatus = getEndpointStatus();
+
+    if (
+      endpointStatus.status === "error" &&
+      (!endpointStatus.path || endpointStatus.path === "importGpgKey")
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
+    return HttpResponse.json(gpgKeys[0]);
+  }),
 ];
diff --git a/src/tests/server/handlers/index.ts b/src/tests/server/handlers/index.ts
index dd4e13ba8..79a0c7a7c 100644
--- a/src/tests/server/handlers/index.ts
+++ b/src/tests/server/handlers/index.ts
@@ -26,6 +26,7 @@ import process from "./process";
 import rebootProfiles from "./rebootProfiles";
 import removalProfiles from "./removalProfiles";
 import repo from "./repo";
+import reports from "./reports";
 import repositoryProfiles from "./repositoryProfiles";
 import roles from "./roles";
 import scriptProfiles from "./scriptProfiles";
@@ -67,6 +68,7 @@ export default [
   ...rebootProfiles,
   ...removalProfiles,
   ...repo,
+  ...reports,
   ...repositoryProfiles,
   ...roles,
   ...savedSearches,
diff --git a/src/tests/server/handlers/instance.ts b/src/tests/server/handlers/instance.ts
index f5c385963..9d7554a20 100644
--- a/src/tests/server/handlers/instance.ts
+++ b/src/tests/server/handlers/instance.ts
@@ -32,6 +32,7 @@ import type { Instance, PendingInstance } from "@/types/Instance";
 import type { GroupsResponse } from "@/types/User";
 import { delay, http, HttpResponse } from "msw";
 import { generatePaginatedResponse, isAction } from "./_helpers";
+import { getEndpointStatusApiError } from "./_constants";
 
 export default [
   http.get<never, GetInstancesParams, ApiPaginatedResponse<Instance>>(
@@ -39,14 +40,29 @@ export default [
     async ({ request }) => {
       const endpointStatus = getEndpointStatus();
 
-      if (endpointStatus.status === "error") {
-        throw new HttpResponse(null, { status: 500 });
+      const url = new URL(request.url);
+      const query = url.searchParams.get("query") || "";
+
+      if (
+        endpointStatus.status === "error" &&
+        endpointStatus.path === "computers-tagged-loading" &&
+        query.includes(" OR ")
+      ) {
+        return new Promise<never>(() => undefined);
+      }
+
+      if (
+        endpointStatus.status === "error" &&
+        (!endpointStatus.path ||
+          endpointStatus.path === "computers" ||
+          (endpointStatus.path === "computers-tagged-error" &&
+            query.includes(" OR ")))
+      ) {
+        throw getEndpointStatusApiError();
       }
 
-      const url = new URL(request.url);
       const offset = Number(url.searchParams.get("offset")) || 0;
       const limit = Number(url.searchParams.get("limit")) || 1;
-      const query = url.searchParams.get("query") || "";
 
       if (query.includes("has-pro-management:false")) {
         return HttpResponse.json(
@@ -248,20 +264,43 @@ export default [
     const endpointStatus = getEndpointStatus();
 
     if (endpointStatus.status === "error") {
-      throw new HttpResponse(null, { status: 500 });
+      throw getEndpointStatusApiError();
     }
 
     const releaseUpgradeActivity = RELEASE_UPGRADE_ACTIVITY;
     return HttpResponse.json(releaseUpgradeActivity);
   }),
 
+  http.post(`${API_URL}computers/upgrade-packages`, async () => {
+    const endpointStatus = getEndpointStatus();
+
+    if (endpointStatus.status === "error") {
+      throw getEndpointStatusApiError();
+    }
+
+    return HttpResponse.json(activities[0]);
+  }),
+
+  http.post<never, never, Activity>(
+    `${API_URL}computers/:computerId/restart`,
+    async () => {
+      const endpointStatus = getEndpointStatus();
+
+      if (endpointStatus.status === "error") {
+        throw getEndpointStatusApiError();
+      }
+
+      return HttpResponse.json(activities[0]);
+    },
+  ),
+
   http.get<never, GetInstanceParams, Instance>(
     `${API_URL}computers/:computerId`,
     async ({ request }) => {
       const endpointStatus = getEndpointStatus();
 
       if (endpointStatus.status === "error") {
-        throw new HttpResponse(null, { status: 500 });
+        throw getEndpointStatusApiError();
       }
 
       const url = new URL(request.url);
@@ -273,6 +312,33 @@ export default [
     },
   ),
 
+  http.put(`${API_URL}computers/:computerId`, async () => {
+    const endpointStatus = getEndpointStatus();
+    if (
+      endpointStatus.status === "error" &&
+      (!endpointStatus.path || endpointStatus.path === "editInstance")
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
+    return HttpResponse.json(instances[0]);
+  }),
+
+  http.post(
+    `${API_URL}computers/:computerId/usergroups/update_bulk`,
+    async () => {
+      const endpointStatus = getEndpointStatus();
+      if (
+        endpointStatus.status === "error" &&
+        (!endpointStatus.path || endpointStatus.path === "userGroups")
+      ) {
+        throw getEndpointStatusApiError();
+      }
+
+      return HttpResponse.json(activities[0]);
+    },
+  ),
+
   http.get<Record<"computerId", string>, GetGroupsParams, GroupsResponse>(
     `${API_URL}computers/:computerId/groups`,
     () => {
@@ -285,6 +351,22 @@ export default [
     GetUserGroupsParams,
     GroupsResponse
   >(`${API_URL}computers/:computerId/users/:username/groups`, () => {
+    const endpointStatus = getEndpointStatus();
+    const daemonGroups = userGroups.filter((group) => group.name === "daemon");
+    const shouldReturnEmptyGroups =
+      endpointStatus.status === "empty" &&
+      (!endpointStatus.path || endpointStatus.path === "users/groups");
+    const shouldReturnDaemonGroupOnly =
+      endpointStatus.path === "users/groups:daemon";
+
+    if (shouldReturnEmptyGroups) {
+      return HttpResponse.json({ groups: [] });
+    }
+
+    if (shouldReturnDaemonGroupOnly) {
+      return HttpResponse.json({ groups: daemonGroups });
+    }
+
     return HttpResponse.json({ groups: userGroups });
   }),
 
diff --git a/src/tests/server/handlers/kernel.ts b/src/tests/server/handlers/kernel.ts
index 3980b6629..9d89397e1 100644
--- a/src/tests/server/handlers/kernel.ts
+++ b/src/tests/server/handlers/kernel.ts
@@ -1,10 +1,13 @@
 import { API_URL } from "@/constants";
+import type { Activity } from "@/features/activities";
 import type {
   KernelManagementInfo,
   LivepatchInformation,
 } from "@/features/kernel";
 import { getEndpointStatus } from "@/tests/controllers/controller";
+import { activities } from "@/tests/mocks/activity";
 import { http, HttpResponse } from "msw";
+import { getEndpointStatusApiError } from "./_constants";
 
 export default [
   http.get<never, never, KernelManagementInfo>(
@@ -94,4 +97,16 @@ export default [
       });
     },
   ),
+  http.post<never, never, Activity>(
+    `${API_URL}computers/:id/kernel/upgrade`,
+    async () => {
+      const endpointStatus = getEndpointStatus();
+
+      if (endpointStatus.status === "error") {
+        throw getEndpointStatusApiError();
+      }
+
+      return HttpResponse.json(activities[0]);
+    },
+  ),
 ];
diff --git a/src/tests/server/handlers/pockets.ts b/src/tests/server/handlers/pockets.ts
index d7533391e..e9cca9cb6 100644
--- a/src/tests/server/handlers/pockets.ts
+++ b/src/tests/server/handlers/pockets.ts
@@ -1,14 +1,16 @@
-import { API_URL_OLD } from "@/constants";
+import { API_URL, API_URL_OLD } from "@/constants";
 import type {
   DiffPullPocketParams,
   ListPocketParams,
 } from "@/features/mirrors";
 import type { PackageDiff, PackageObject } from "@/features/packages";
 import { getEndpointStatus } from "@/tests/controllers/controller";
+import { activities } from "@/tests/mocks/activity";
 import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
 import { http, HttpResponse } from "msw";
 import { generatePaginatedResponse, isAction } from "./_helpers";
 import { diffPocket, listPockets } from "@/tests/mocks/pockets";
+import { getEndpointStatusApiError } from "./_constants";
 
 export default [
   http.get<never, ListPocketParams, ApiPaginatedResponse<PackageObject>>(
@@ -25,10 +27,28 @@ export default [
       const search = url.searchParams.get("search") ?? "";
       const offset = Number(url.searchParams.get("offset")) || 0;
       const limit = Number(url.searchParams.get("limit")) || DEFAULT_PAGE_SIZE;
+      const shouldUseEmptyData =
+        endpointStatus.status === "empty" &&
+        (!endpointStatus.path || endpointStatus.path === "ListPocket");
+      const listPocketSource =
+        endpointStatus.path === "ListPocketMany"
+          ? Array.from({ length: 25 }, (_, index) => {
+              const basePocket = listPockets[index % listPockets.length];
+              if (!basePocket) {
+                throw new Error(
+                  "Expected at least one pocket in mock pocket data",
+                );
+              }
+              return {
+                ...basePocket,
+                name: `${basePocket.name}-${index + 1}`,
+              };
+            })
+          : listPockets;
 
       return HttpResponse.json(
         generatePaginatedResponse<PackageObject>({
-          data: endpointStatus.status === "default" ? listPockets : [],
+          data: shouldUseEmptyData ? [] : listPocketSource,
           limit,
           offset,
           search,
@@ -43,7 +63,117 @@ export default [
         return;
       }
 
+      const endpointStatus = getEndpointStatus();
+
+      if (endpointStatus.path === "DiffPullPocketUpdate") {
+        return HttpResponse.json({
+          "main:amd64": {
+            add: [],
+            update: [["pocket1", "1.0.0", "2.0.0"]],
+            delete: [["pocket2", "1.0.0"]],
+          },
+        });
+      }
+
+      if (endpointStatus.path === "DiffPullPocketAddOnly") {
+        return HttpResponse.json({
+          "main:amd64": {
+            add: [["pocket1", "1.0.0"]],
+            update: [],
+            delete: [],
+          },
+        });
+      }
+
+      if (endpointStatus.path === "DiffPullPocketNoChanges") {
+        return HttpResponse.json({});
+      }
+
       return HttpResponse.json(diffPocket);
     },
   ),
+  http.get(API_URL_OLD, async ({ request }) => {
+    if (
+      !isAction(request, [
+        "EditPocket",
+        "SyncMirrorPocket",
+        "PullPackagesToPocket",
+      ])
+    ) {
+      return;
+    }
+
+    const endpointStatus = getEndpointStatus();
+    const action = new URL(request.url).searchParams.get("action");
+    if (
+      endpointStatus.path === "SyncMirrorPocketLoading" &&
+      isAction(request, "SyncMirrorPocket")
+    ) {
+      return new Promise<never>(() => undefined);
+    }
+
+    if (
+      endpointStatus.status === "error" &&
+      (!endpointStatus.path || endpointStatus.path === action)
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
+    return HttpResponse.json(activities[0]);
+  }),
+  http.get(API_URL_OLD, async ({ request }) => {
+    if (
+      !isAction(request, [
+        "RemovePocket",
+        "RemovePackagesFromPocket",
+        "AddPackageFiltersToPocket",
+        "RemovePackageFiltersFromPocket",
+        "AddUploaderGPGKeysToPocket",
+        "RemoveUploaderGPGKeysFromPocket",
+      ])
+    ) {
+      return;
+    }
+
+    const endpointStatus = getEndpointStatus();
+    const action = new URL(request.url).searchParams.get("action");
+    if (
+      endpointStatus.status === "error" &&
+      (!endpointStatus.path || endpointStatus.path === action)
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
+    return HttpResponse.json(null);
+  }),
+  http.post(`${API_URL}pockets/sync`, async () => {
+    const endpointStatus = getEndpointStatus();
+    if (
+      endpointStatus.status === "error" &&
+      (!endpointStatus.path || endpointStatus.path === "pockets/sync")
+    ) {
+      throw getEndpointStatusApiError();
+    }
+    return HttpResponse.json(activities[0]);
+  }),
+  http.post(`${API_URL}pockets/pull`, async () => {
+    const endpointStatus = getEndpointStatus();
+    if (
+      endpointStatus.status === "error" &&
+      (!endpointStatus.path || endpointStatus.path === "pockets/pull")
+    ) {
+      throw getEndpointStatusApiError();
+    }
+    return HttpResponse.json(activities[0]);
+  }),
+  http.delete(`${API_URL}pockets/:distribution/:series/:name`, async () => {
+    const endpointStatus = getEndpointStatus();
+    if (
+      endpointStatus.status === "error" &&
+      (!endpointStatus.path || endpointStatus.path === "pockets/delete")
+    ) {
+      throw getEndpointStatusApiError();
+    }
+    return new HttpResponse(null, { status: 204 });
+  }),
 ];
diff --git a/src/tests/server/handlers/process.ts b/src/tests/server/handlers/process.ts
index 0937a4382..8bc1c22fe 100644
--- a/src/tests/server/handlers/process.ts
+++ b/src/tests/server/handlers/process.ts
@@ -1,10 +1,13 @@
 import { API_URL } from "@/constants";
+import type { Activity } from "@/features/activities";
 import type { GetProcessesParams, Process } from "@/features/processes";
 import { getEndpointStatus } from "@/tests/controllers/controller";
+import { activities } from "@/tests/mocks/activity";
 import { processes } from "@/tests/mocks/process";
 import { generatePaginatedResponse } from "@/tests/server/handlers/_helpers";
 import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
 import { http, HttpResponse } from "msw";
+import { getEndpointStatusApiError } from "./_constants";
 
 export default [
   http.get<never, GetProcessesParams, ApiPaginatedResponse<Process>>(
@@ -13,7 +16,7 @@ export default [
       const endpointStatus = getEndpointStatus();
 
       if (endpointStatus.status === "error") {
-        throw new HttpResponse(null, { status: 500 });
+        throw getEndpointStatusApiError();
       }
 
       const url = new URL(request.url);
@@ -32,4 +35,25 @@ export default [
       );
     },
   ),
+  http.post<never, never, Activity>(
+    `${API_URL}processes/terminate`,
+    async () => {
+      const endpointStatus = getEndpointStatus();
+
+      if (endpointStatus.status === "error") {
+        throw getEndpointStatusApiError();
+      }
+
+      return HttpResponse.json(activities[0]);
+    },
+  ),
+  http.post<never, never, Activity>(`${API_URL}processes/kill`, async () => {
+    const endpointStatus = getEndpointStatus();
+
+    if (endpointStatus.status === "error") {
+      throw getEndpointStatusApiError();
+    }
+
+    return HttpResponse.json(activities[0]);
+  }),
 ];
diff --git a/src/tests/server/handlers/reports.ts b/src/tests/server/handlers/reports.ts
new file mode 100644
index 000000000..a94835597
--- /dev/null
+++ b/src/tests/server/handlers/reports.ts
@@ -0,0 +1,23 @@
+import { API_URL_OLD } from "@/constants";
+import { getEndpointStatus } from "@/tests/controllers/controller";
+import { http, HttpResponse } from "msw";
+import { isAction } from "./_helpers";
+
+export default [
+  http.get(API_URL_OLD, ({ request }) => {
+    if (!isAction(request, "GetCSVComplianceData")) {
+      return;
+    }
+
+    const endpointStatus = getEndpointStatus();
+
+    if (
+      endpointStatus.status === "empty" &&
+      (!endpointStatus.path || endpointStatus.path === "reports")
+    ) {
+      return HttpResponse.json("");
+    }
+
+    return HttpResponse.json("name,status\ninstance-1,ok");
+  }),
+];
diff --git a/src/tests/server/handlers/roles.ts b/src/tests/server/handlers/roles.ts
index c7f538ef2..8d02eade0 100644
--- a/src/tests/server/handlers/roles.ts
+++ b/src/tests/server/handlers/roles.ts
@@ -1,25 +1,26 @@
 import { API_URL_OLD } from "@/constants";
 import type { GetRolesParams } from "@/hooks/useRoles";
 import { getEndpointStatus } from "@/tests/controllers/controller";
-import { permissions, roles } from "@/tests/mocks/roles";
+import { permissions, roles as roleMocks } from "@/tests/mocks/roles";
 import { isAction } from "@/tests/server/handlers/_helpers";
 import type { Permission } from "@/types/Permission";
 import type { Role } from "@/types/Role";
 import { http, HttpResponse } from "msw";
+import { getEndpointStatusApiError } from "./_constants";
 
 export default [
   http.get<never, GetRolesParams, Role[]>(API_URL_OLD, ({ request }) => {
-    const { status } = getEndpointStatus();
+    const { status, path } = getEndpointStatus();
 
     if (!isAction(request, "GetRoles")) {
       return;
     }
 
-    if (status === "empty") {
+    if (status === "empty" && (!path || path === "roles")) {
       return HttpResponse.json([]);
     }
 
-    return HttpResponse.json(roles);
+    return HttpResponse.json(roleMocks);
   }),
 
   http.get<never, never, Permission[]>(API_URL_OLD, ({ request }) => {
@@ -29,4 +30,58 @@ export default [
 
     return HttpResponse.json(permissions);
   }),
+
+  http.get(API_URL_OLD, ({ request }) => {
+    if (
+      !isAction(request, [
+        "AddPermissionsToRole",
+        "RemovePermissionsFromRole",
+        "AddAccessGroupsToRole",
+        "RemoveAccessGroupsFromRole",
+      ])
+    ) {
+      return;
+    }
+
+    const { status, path } = getEndpointStatus();
+
+    if (status === "error" && (!path || path === "editRole")) {
+      throw getEndpointStatusApiError();
+    }
+
+    const [role] = roleMocks;
+    if (!role) {
+      throw new Error("Expected at least one role in mock role data");
+    }
+
+    const { searchParams } = new URL(request.url);
+    const roleName = searchParams.get("name");
+    const getMultiValueParams = (baseName: string): string[] => {
+      const values = searchParams.getAll(baseName);
+
+      for (const [key, value] of searchParams.entries()) {
+        if (key.startsWith(`${baseName}.`)) {
+          values.push(value);
+        }
+      }
+
+      return values;
+    };
+
+    const accessGroups = Array.from(
+      new Set(getMultiValueParams("access_groups")),
+    );
+    const permissionsParams = Array.from(
+      new Set(getMultiValueParams("permissions")),
+    );
+
+    return HttpResponse.json({
+      ...role,
+      name: roleName ?? role.name,
+      access_groups:
+        accessGroups.length > 0 ? accessGroups : role.access_groups,
+      permissions:
+        permissionsParams.length > 0 ? permissionsParams : role.permissions,
+    });
+  }),
 ];
diff --git a/src/tests/server/handlers/script.ts b/src/tests/server/handlers/script.ts
index c3351221a..9cbe8c8d7 100644
--- a/src/tests/server/handlers/script.ts
+++ b/src/tests/server/handlers/script.ts
@@ -1,5 +1,6 @@
 import { API_URL, API_URL_OLD } from "@/constants";
 import { getEndpointStatus } from "@/tests/controllers/controller";
+import { activities } from "@/tests/mocks/activity";
 import {
   detailedScriptsData,
   scriptAttachment,
@@ -9,12 +10,12 @@ import {
   scriptVersionsWithPagination,
 } from "@/tests/mocks/script";
 import { scriptProfiles } from "@/tests/mocks/scriptProfiles";
-import { activities } from "@/tests/mocks/activity";
 import {
   generatePaginatedResponse,
   isAction,
 } from "@/tests/server/handlers/_helpers";
 import { http, HttpResponse } from "msw";
+import { getEndpointStatusApiError } from "./_constants";
 
 export default [
   http.get(`${API_URL}scripts`, async ({ request }) => {
@@ -56,10 +57,10 @@ export default [
 
   http.get(`${API_URL}scripts/:id/script-profiles`, async () => {
     const endpointStatus = getEndpointStatus();
+
     if (
-      (!endpointStatus.path ||
-        endpointStatus.path.includes("script-profiles")) &&
-      endpointStatus.status === "empty"
+      endpointStatus.status === "empty" &&
+      endpointStatus.path === "script-profiles"
     ) {
       return HttpResponse.json({
         results: [],
@@ -68,13 +69,13 @@ export default [
         previous: null,
       });
     }
-    return HttpResponse.json(
-      generatePaginatedResponse({
-        data: scriptProfiles,
-        limit: 20,
-        offset: 0,
-      }),
-    );
+
+    return HttpResponse.json({
+      results: scriptProfiles,
+      count: scriptProfiles.length,
+      next: null,
+      previous: null,
+    });
   }),
 
   http.get(`${API_URL}scripts/:id`, async ({ params }) => {
@@ -90,26 +91,33 @@ export default [
     return HttpResponse.json(scriptVersion);
   }),
 
-  http.get(`${API_URL}scripts/:id/attachments/:attachmentId`, async () => {
-    const endpointStatus = getEndpointStatus();
+  http.get(
+    `${API_URL}scripts/:id/attachments/:attachmentId`,
+    async ({ params }) => {
+      if (params.attachmentId === "999") {
+        return new HttpResponse(null, { status: 404 });
+      }
 
-    if (
-      endpointStatus.path &&
-      endpointStatus.path.includes("scripts/attachments/html")
-    ) {
-      return new HttpResponse(scriptAttachmentHtml, {
+      const endpointStatus = getEndpointStatus();
+
+      if (
+        endpointStatus.path &&
+        endpointStatus.path.includes("scripts/attachments/html")
+      ) {
+        return new HttpResponse(scriptAttachmentHtml, {
+          headers: {
+            "Content-Type": "text/html",
+          },
+        });
+      }
+
+      return new HttpResponse(scriptAttachment, {
         headers: {
-          "Content-Type": "text/html",
+          "Content-Type": "text/plain",
         },
       });
-    }
-
-    return new HttpResponse(scriptAttachment, {
-      headers: {
-        "Content-Type": "text/plain",
-      },
-    });
-  }),
+    },
+  ),
 
   http.get(`${API_URL}scripts/:id/versions`, async ({ request }) => {
     const DEFAULT_PAGE_SIZE = 20;
@@ -128,10 +136,33 @@ export default [
     );
   }),
 
-  http.get(API_URL_OLD, ({ request }) => {
-    if (!isAction(request, "EditScript")) {
+  http.post(API_URL_OLD, ({ request }) => {
+    if (!isAction(request, "CreateScript")) {
+      return;
+    }
+
+    if (
+      getEndpointStatus().status === "error" &&
+      getEndpointStatus().path === "CreateScript"
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
+    return HttpResponse.json({ id: 99 });
+  }),
+
+  http.post(API_URL_OLD, ({ request }) => {
+    if (!isAction(request, "CreateScriptAttachment")) {
       return;
     }
+
+    if (
+      getEndpointStatus().status === "error" &&
+      getEndpointStatus().path === "CreateScriptAttachment"
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
     return HttpResponse.json({});
   }),
 
@@ -139,13 +170,29 @@ export default [
     if (!isAction(request, "EditScript")) {
       return;
     }
+
+    if (
+      getEndpointStatus().status === "error" &&
+      getEndpointStatus().path === "EditScript"
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
     return HttpResponse.json({});
   }),
 
-  http.post(API_URL_OLD, ({ request }) => {
-    if (!isAction(request, "CreateScriptAttachment")) {
+  http.get(API_URL_OLD, ({ request }) => {
+    if (!isAction(request, "RemoveScriptAttachment")) {
       return;
     }
+
+    if (
+      getEndpointStatus().status === "error" &&
+      getEndpointStatus().path === "RemoveScriptAttachment"
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
     return HttpResponse.json({});
   }),
 
@@ -153,6 +200,14 @@ export default [
     if (!isAction(request, "ExecuteScript")) {
       return;
     }
+
+    if (
+      getEndpointStatus().status === "error" &&
+      getEndpointStatus().path === "ExecuteScript"
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
     return HttpResponse.json(activities[0]);
   }),
 ];
diff --git a/src/tests/server/handlers/tag.ts b/src/tests/server/handlers/tag.ts
index b89f0ed58..d95bb927f 100644
--- a/src/tests/server/handlers/tag.ts
+++ b/src/tests/server/handlers/tag.ts
@@ -9,7 +9,9 @@ import {
   isAction,
 } from "@/tests/server/handlers/_helpers";
 import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
+import { getEndpointStatus } from "@/tests/controllers/controller";
 import { http, HttpResponse } from "msw";
+import { getEndpointStatusApiError } from "./_constants";
 
 export default [
   http.get<never, never, ApiPaginatedResponse<string>>(`${API_URL}tags`, () => {
@@ -27,15 +29,39 @@ export default [
     UseGetProfileChangesParams,
     ApiPaginatedResponse<ProfileChange>
   >(`${API_URL}tags/profile-diff`, ({ request }) => {
+    const endpointStatus = getEndpointStatus();
+
+    if (
+      endpointStatus.status === "error" &&
+      endpointStatus.path === "tags/profile-diff"
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
     const { searchParams } = new URL(request.url);
 
     const offset = searchParams.get("offset");
     const limit = searchParams.get("limit");
+    const parsedOffset = offset ? parseInt(offset) : 0;
+    const parsedLimit = limit ? parseInt(limit) : 100;
+
+    if (
+      endpointStatus.status === "empty" &&
+      endpointStatus.path === "tags/profile-diff"
+    ) {
+      return HttpResponse.json(
+        generatePaginatedResponse<ProfileChange>({
+          data: [],
+          offset: parsedOffset,
+          limit: parsedLimit,
+        }),
+      );
+    }
 
     const response = generatePaginatedResponse<ProfileChange>({
       data: profileChanges,
-      offset: offset ? parseInt(offset) : 0,
-      limit: limit ? parseInt(limit) : 100,
+      offset: parsedOffset,
+      limit: parsedLimit,
     });
 
     return HttpResponse.json(response);
diff --git a/src/tests/server/handlers/user.ts b/src/tests/server/handlers/user.ts
index ab6fb20bd..6bdf8eeae 100644
--- a/src/tests/server/handlers/user.ts
+++ b/src/tests/server/handlers/user.ts
@@ -5,6 +5,27 @@ import type { User } from "@/types/User";
 import { userDetails, users } from "@/tests/mocks/user";
 import { getEndpointStatus } from "@/tests/controllers/controller";
 import { MAX_USERS_LIMIT } from "@/pages/dashboard/instances/[single]/tabs/users/UserPanel/constants";
+import type { UserCredentials } from "@/features/api-credentials";
+import { getEndpointStatusApiError } from "./_constants";
+
+const [defaultAccount] = userDetails.accounts;
+
+if (!defaultAccount) {
+  throw new Error("Expected at least one account in mock userDetails data");
+}
+
+const userCredentials: UserCredentials = {
+  credentials: [
+    {
+      account_name: defaultAccount.name,
+      account_title: defaultAccount.title,
+      endpoint: "https://api.example.com/test-account",
+      access_key: "",
+      secret_key: "",
+      exports: "",
+    },
+  ],
+};
 
 export default [
   http.get(`${API_URL}users`, () => {
@@ -20,9 +41,75 @@ export default [
     );
   }),
 
+  http.post(`${API_URL}users`, async () => {
+    const endpointStatus = getEndpointStatus();
+    if (
+      endpointStatus.status === "error" &&
+      (!endpointStatus.path || endpointStatus.path === "users")
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
+    return HttpResponse.json(userDetails);
+  }),
+
+  http.put(`${API_URL}users`, async () => {
+    const endpointStatus = getEndpointStatus();
+    if (
+      endpointStatus.status === "error" &&
+      (!endpointStatus.path || endpointStatus.path === "users")
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
+    return HttpResponse.json(userDetails);
+  }),
+
+  http.delete(`${API_URL}users`, async () => {
+    const endpointStatus = getEndpointStatus();
+    if (
+      endpointStatus.status === "error" &&
+      (!endpointStatus.path || endpointStatus.path === "users")
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
+    return HttpResponse.json(userDetails);
+  }),
+
+  http.post(`${API_URL}users/lock`, async () => {
+    const endpointStatus = getEndpointStatus();
+    if (
+      endpointStatus.status === "error" &&
+      (!endpointStatus.path || endpointStatus.path === "lockUser")
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
+    return HttpResponse.json(userDetails);
+  }),
+
+  http.post(`${API_URL}users/unlock`, async () => {
+    const endpointStatus = getEndpointStatus();
+    if (
+      endpointStatus.status === "error" &&
+      (!endpointStatus.path || endpointStatus.path === "unlockUser")
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
+    return HttpResponse.json(userDetails);
+  }),
+
   http.get(`${API_URL}person`, async () => {
     await delay();
 
     return HttpResponse.json(userDetails);
   }),
+
+  http.get(`${API_URL}credentials`, async () => {
+    await delay();
+
+    return HttpResponse.json(userCredentials);
+  }),
 ];
diff --git a/src/tests/server/handlers/usn.ts b/src/tests/server/handlers/usn.ts
index 8cda91ca2..171752e89 100644
--- a/src/tests/server/handlers/usn.ts
+++ b/src/tests/server/handlers/usn.ts
@@ -3,8 +3,11 @@ import type { GetUsnsParams } from "@/features/usns";
 import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
 import type { Usn } from "@/types/Usn";
 import { API_URL } from "@/constants";
+import { getEndpointStatus } from "@/tests/controllers/controller";
 import { usnPackages, usns } from "@/tests/mocks/usn";
+import { activities } from "@/tests/mocks/activity";
 import { generatePaginatedResponse } from "@/tests/server/handlers/_helpers";
+import { getEndpointStatusApiError } from "./_constants";
 
 export default [
   http.get<never, GetUsnsParams, ApiPaginatedResponse<Usn>>(
@@ -31,4 +34,14 @@ export default [
   http.get(`${API_URL}usns/:usnName`, () => {
     return HttpResponse.json(usnPackages);
   }),
+
+  http.post(`${API_URL}computers/usns/upgrade-packages`, () => {
+    const endpointStatus = getEndpointStatus();
+
+    if (endpointStatus.status === "error") {
+      throw getEndpointStatusApiError();
+    }
+
+    return HttpResponse.json(activities[0]);
+  }),
 ];
diff --git a/src/tests/server/handlers/wsl.ts b/src/tests/server/handlers/wsl.ts
index 6d280e8a5..6ea274c8e 100644
--- a/src/tests/server/handlers/wsl.ts
+++ b/src/tests/server/handlers/wsl.ts
@@ -2,10 +2,12 @@ import { API_URL, API_URL_OLD } from "@/constants";
 import type { Activity } from "@/features/activities";
 import type { WslInstanceType } from "@/features/wsl";
 import type { MakeWindowsInstancesCompliantParams } from "@/features/wsl-profiles";
+import { getEndpointStatus } from "@/tests/controllers/controller";
 import { instanceChildren, wslInstanceNames } from "@/tests/mocks/wsl";
 import type { InstanceChild } from "@/types/Instance";
 import { http, HttpResponse } from "msw";
 import { isAction } from "./_helpers";
+import { getEndpointStatusApiError } from "./_constants";
 
 export default [
   http.get<{ id: string }, never, { children: InstanceChild[] }>(
@@ -28,6 +30,15 @@ export default [
   ),
 
   http.post(`${API_URL}child-instance-profiles/:name\\:reapply`, () => {
+    const endpointStatus = getEndpointStatus();
+
+    if (
+      endpointStatus.status === "error" &&
+      endpointStatus.path === "child-instance-profiles/:name:reapply"
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
     return HttpResponse.json();
   }),
 
diff --git a/src/types/Instance.ts b/src/types/Instance.ts
index 44e1f5c90..f57c638d1 100644
--- a/src/types/Instance.ts
+++ b/src/types/Instance.ts
@@ -201,6 +201,7 @@ export interface InstanceWithoutRelation extends Record<string, unknown> {
 
 type WithRelation<T extends InstanceWithoutRelation> = T & {
   parent: InstanceWithoutRelation | null;
+  children: Omit<InstanceWithoutRelation, "children">[];
 };
 
 export type Instance = WithRelation<InstanceWithoutRelation>;

From dbc803d0c841904f4d77867ad5573a0064b0435e Mon Sep 17 00:00:00 2001
From: Rubin Aga <66167934+rubinaga@users.noreply.github.com>
Date: Mon, 20 Apr 2026 18:22:27 +0200
Subject: [PATCH 23/42] fix: remove undo activity action (#560)

## Summary

This ticket covers [this Jira
ticket](https://warthogs.atlassian.net/browse/LNDENG-4188)

Additionally, since "activities" feature was touched, I also refactored
the `useActivities` hook to separate api hooks under the `/api` folder.

The commits are organized for a quicker review.

## Release Impact

According to the [Landscape Server Release
Cycle](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `dev` / `main` (Beta)
- **Version Impact**:
  - [x] Patch (Fix)
  - [ ] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [x] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [x] **UI Verified**: I have verified the changes locally.
- [x] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.
---
 .changeset/easy-words-tickle.md               |   5 +
 src/features/activities/api/index.ts          |   5 +
 .../activities/api/useApproveActivities.ts    |  29 +++++
 .../activities/api/useCancelActivities.ts     |  29 +++++
 .../activities/api/useGetActivityTypes.ts     |  29 +++++
 .../activities/api/useGetSingleActivity.ts    |  39 ++++++
 .../activities/api/useRedoActivities.ts       |  28 +++++
 .../components/Activities/Activities.tsx      |  26 +---
 .../ActivitiesActions.test.tsx                | 100 ---------------
 .../ActivitiesActions/ActivitiesActions.tsx   |  85 +++----------
 .../ActivitiesHeader.test.tsx                 |  11 ++
 .../ActivitiesHeader/ActivitiesHeader.tsx     |   7 +-
 .../ActivityDetails/ActivityDetails.tsx       |  24 ++--
 .../ActivityDetailsButtons.test.tsx           |  37 ------
 .../ActivityDetailsButtons.tsx                |  87 +++----------
 .../ActivityTypeFilter.test.tsx               |   5 +-
 src/features/activities/constants.ts          |   2 +
 src/features/activities/hooks/index.ts        |   2 +-
 .../activities/hooks/useActivities.tsx        | 119 ------------------
 .../hooks/useOpenActivityDetailsPanel.tsx     |  26 ++++
 src/features/activities/index.tsx             |  11 +-
 src/features/activities/types/Activity.ts     |   1 -
 .../activities/types/ActivityParams.ts        |   2 +-
 src/features/activities/types/index.ts        |   2 +-
 .../EmployeeInstancesTableActions.tsx         |   4 +-
 .../DistributionUpgrades.tsx                  |   4 +-
 .../GenerateRecoveryKeyModal.tsx              |   4 +-
 .../RegenerateRecoveryKeyModal.tsx            |   4 +-
 .../components/RestartModal/RestartModal.tsx  |   4 +-
 .../ShutDownModal/ShutDownModal.tsx           |   4 +-
 .../DowngradeKernelForm.tsx                   |   4 +-
 .../RestartInstanceForm.tsx                   |   4 +-
 .../UpgradeKernelForm/UpgradeKernelForm.tsx   |   4 +-
 .../InfoTablesContainer.tsx                   |  10 +-
 .../InstalledPackagesActionForm.tsx           |   4 +-
 .../PackagesInstallForm.tsx                   |   4 +-
 .../SecurityProfileDownloadAuditForm.tsx      |  19 ++-
 .../DetachTokenModal/DetachTokenModal.tsx     |   4 +-
 .../TokenFormBase/TokenFormBase.tsx           |   4 +-
 .../WslInstanceInstallForm.tsx                |   4 +-
 .../tabs/info/InfoPanel/InfoPanel.tsx         |   4 +-
 src/tests/mocks/activity.ts                   |   9 --
 src/tests/server/handlers/activity.ts         |  13 --
 43 files changed, 312 insertions(+), 510 deletions(-)
 create mode 100644 .changeset/easy-words-tickle.md
 create mode 100644 src/features/activities/api/useApproveActivities.ts
 create mode 100644 src/features/activities/api/useCancelActivities.ts
 create mode 100644 src/features/activities/api/useGetActivityTypes.ts
 create mode 100644 src/features/activities/api/useGetSingleActivity.ts
 create mode 100644 src/features/activities/api/useRedoActivities.ts
 delete mode 100644 src/features/activities/hooks/useActivities.tsx
 create mode 100644 src/features/activities/hooks/useOpenActivityDetailsPanel.tsx

diff --git a/.changeset/easy-words-tickle.md b/.changeset/easy-words-tickle.md
new file mode 100644
index 000000000..69b7b3e9f
--- /dev/null
+++ b/.changeset/easy-words-tickle.md
@@ -0,0 +1,5 @@
+---
+"landscape-ui": patch
+---
+
+Remove undo action from activities
diff --git a/src/features/activities/api/index.ts b/src/features/activities/api/index.ts
index cee9ce15b..9ee7f8f37 100644
--- a/src/features/activities/api/index.ts
+++ b/src/features/activities/api/index.ts
@@ -1 +1,6 @@
 export { default as useGetActivities } from "./useGetActivities";
+export { default as useApproveActivities } from "./useApproveActivities";
+export { default as useCancelActivities } from "./useCancelActivities";
+export { default as useGetActivityTypes } from "./useGetActivityTypes";
+export { default as useGetSingleActivity } from "./useGetSingleActivity";
+export { default as useRedoActivities } from "./useRedoActivities";
diff --git a/src/features/activities/api/useApproveActivities.ts b/src/features/activities/api/useApproveActivities.ts
new file mode 100644
index 000000000..891f7763c
--- /dev/null
+++ b/src/features/activities/api/useApproveActivities.ts
@@ -0,0 +1,29 @@
+import useFetchOld from "@/hooks/useFetchOld";
+import type { ApiError } from "@/types/api/ApiError";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError } from "axios";
+import type { ApproveActivitiesParams } from "../types";
+
+const useApproveActivities = () => {
+  const authFetchOld = useFetchOld();
+  const queryClient = useQueryClient();
+
+  const { mutateAsync, isPending } = useMutation<
+    string[],
+    AxiosError<ApiError>,
+    ApproveActivitiesParams
+  >({
+    mutationKey: ["activities", "approve"],
+    mutationFn: async (params) =>
+      authFetchOld.get("ApproveActivities", { params }),
+    onSuccess: async () =>
+      queryClient.invalidateQueries({ queryKey: ["activities"] }),
+  });
+
+  return {
+    approveActivities: mutateAsync,
+    isApprovingActivities: isPending,
+  };
+};
+
+export default useApproveActivities;
diff --git a/src/features/activities/api/useCancelActivities.ts b/src/features/activities/api/useCancelActivities.ts
new file mode 100644
index 000000000..2b3e9791d
--- /dev/null
+++ b/src/features/activities/api/useCancelActivities.ts
@@ -0,0 +1,29 @@
+import useFetchOld from "@/hooks/useFetchOld";
+import type { ApiError } from "@/types/api/ApiError";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError } from "axios";
+import type { CancelActivitiesParams } from "../types";
+
+const useCancelActivities = () => {
+  const authFetchOld = useFetchOld();
+  const queryClient = useQueryClient();
+
+  const { mutateAsync, isPending } = useMutation<
+    number[],
+    AxiosError<ApiError>,
+    CancelActivitiesParams
+  >({
+    mutationKey: ["activities", "cancel"],
+    mutationFn: async (params) =>
+      authFetchOld.get("CancelActivities", { params }),
+    onSuccess: async () =>
+      queryClient.invalidateQueries({ queryKey: ["activities"] }),
+  });
+
+  return {
+    cancelActivities: mutateAsync,
+    isCancelingActivities: isPending,
+  };
+};
+
+export default useCancelActivities;
diff --git a/src/features/activities/api/useGetActivityTypes.ts b/src/features/activities/api/useGetActivityTypes.ts
new file mode 100644
index 000000000..358a254ad
--- /dev/null
+++ b/src/features/activities/api/useGetActivityTypes.ts
@@ -0,0 +1,29 @@
+import useFetchOld from "@/hooks/useFetchOld";
+import type { ApiError } from "@/types/api/ApiError";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+import { EXCLUDED_ACTIVITY_TYPE_OPTIONS } from "../constants";
+
+const useGetActivityTypes = () => {
+  const authFetchOld = useFetchOld();
+
+  const { data: response, isPending } = useQuery<
+    AxiosResponse<string[]>,
+    AxiosError<ApiError>
+  >({
+    queryKey: ["activityTypes"],
+    queryFn: async () => authFetchOld.get("GetActivityTypes"),
+  });
+
+  const filteredActivityTypes =
+    response?.data.filter(
+      (activityType) => !EXCLUDED_ACTIVITY_TYPE_OPTIONS.includes(activityType),
+    ) ?? [];
+
+  return {
+    activityTypes: filteredActivityTypes,
+    isGettingActivityTypes: isPending,
+  };
+};
+
+export default useGetActivityTypes;
diff --git a/src/features/activities/api/useGetSingleActivity.ts b/src/features/activities/api/useGetSingleActivity.ts
new file mode 100644
index 000000000..793542f4f
--- /dev/null
+++ b/src/features/activities/api/useGetSingleActivity.ts
@@ -0,0 +1,39 @@
+import useFetch from "@/hooks/useFetch";
+import type { ApiError } from "@/types/api/ApiError";
+import type { UseQueryOptions } from "@tanstack/react-query";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+import type { Activity, GetSingleActivityParams } from "../types";
+
+const useGetSingleActivity = (
+  { activityId, ...queryParams }: GetSingleActivityParams,
+  options: Omit<
+    UseQueryOptions<AxiosResponse<Activity>, AxiosError<ApiError>>,
+    "queryKey" | "queryFn"
+  > = {},
+) => {
+  const authFetch = useFetch();
+
+  const {
+    data: response,
+    isPending,
+    isLoading,
+    isError,
+    error,
+  } = useQuery<AxiosResponse<Activity>, AxiosError<ApiError>>({
+    queryKey: ["activities", { activityId, ...queryParams }],
+    queryFn: async () =>
+      authFetch.get(`activities/${activityId}`, { params: queryParams }),
+    ...options,
+  });
+
+  return {
+    activity: response?.data,
+    activityError: error,
+    isActivityError: isError,
+    isGettingActivity: isPending,
+    isLoadingActivity: isLoading,
+  };
+};
+
+export default useGetSingleActivity;
diff --git a/src/features/activities/api/useRedoActivities.ts b/src/features/activities/api/useRedoActivities.ts
new file mode 100644
index 000000000..7b41d9f5d
--- /dev/null
+++ b/src/features/activities/api/useRedoActivities.ts
@@ -0,0 +1,28 @@
+import useFetch from "@/hooks/useFetch";
+import type { ApiError } from "@/types/api/ApiError";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError } from "axios";
+import type { RedoActivitiesParams } from "../types";
+
+const useRedoActivities = () => {
+  const authFetch = useFetch();
+  const queryClient = useQueryClient();
+
+  const { mutateAsync, isPending } = useMutation<
+    number[],
+    AxiosError<ApiError>,
+    RedoActivitiesParams
+  >({
+    mutationKey: ["activities", "redo"],
+    mutationFn: async (params) => authFetch.post("activities/reapply", params),
+    onSuccess: async () =>
+      queryClient.invalidateQueries({ queryKey: ["activities"] }),
+  });
+
+  return {
+    redoActivities: mutateAsync,
+    isRedoingActivities: isPending,
+  };
+};
+
+export default useRedoActivities;
diff --git a/src/features/activities/components/Activities/Activities.tsx b/src/features/activities/components/Activities/Activities.tsx
index 7798c9e69..2330b255f 100644
--- a/src/features/activities/components/Activities/Activities.tsx
+++ b/src/features/activities/components/Activities/Activities.tsx
@@ -3,25 +3,23 @@ import NoData from "@/components/layout/NoData";
 import ResponsiveTable from "@/components/layout/ResponsiveTable";
 import { TablePagination } from "@/components/layout/TablePagination";
 import { BREAKPOINT_PX, DISPLAY_DATE_TIME_FORMAT } from "@/constants";
-import useSidePanel from "@/hooks/useSidePanel";
 import { ROUTES } from "@/libs/routes";
 import { Button, CheckboxInput } from "@canonical/react-components";
 import moment from "moment/moment";
 import type { FC } from "react";
-import { lazy, Suspense, useCallback, useMemo } from "react";
+import { useCallback, useMemo } from "react";
 import { Link } from "react-router";
 import type { CellProps, Column } from "react-table";
 import { useMediaQuery } from "usehooks-ts";
 import { ACTIVITY_STATUSES } from "../../constants";
-import { useOpenActivityDetails } from "../../hooks";
+import {
+  useOpenActivityDetails,
+  useOpenActivityDetailsPanel,
+} from "../../hooks";
 import type { ActivityCommon } from "../../types";
 import ActivitiesHeader from "../ActivitiesHeader";
 import classes from "./Activities.module.scss";
 
-const ActivityDetails = lazy(
-  async () => import("@/features/activities/components/ActivityDetails"),
-);
-
 interface ActivitiesProps {
   readonly activities: ActivityCommon[];
   readonly activitiesCount: number | undefined;
@@ -39,19 +37,7 @@ const Activities: FC<ActivitiesProps> = ({
   selectedActivities,
   setSelectedActivities,
 }) => {
-  const { setSidePanelContent } = useSidePanel();
-
-  const handleActivityDetailsOpen = useCallback(
-    (activity: ActivityCommon) => {
-      setSidePanelContent(
-        activity.summary,
-        <Suspense fallback={<LoadingState />}>
-          <ActivityDetails activityId={activity.id} />
-        </Suspense>,
-      );
-    },
-    [setSidePanelContent],
-  );
+  const handleActivityDetailsOpen = useOpenActivityDetailsPanel();
 
   const isMedium = useMediaQuery(`(max-width: ${BREAKPOINT_PX.md}px)`);
 
diff --git a/src/features/activities/components/ActivitiesActions/ActivitiesActions.test.tsx b/src/features/activities/components/ActivitiesActions/ActivitiesActions.test.tsx
index c7e971302..75ff6addc 100644
--- a/src/features/activities/components/ActivitiesActions/ActivitiesActions.test.tsx
+++ b/src/features/activities/components/ActivitiesActions/ActivitiesActions.test.tsx
@@ -14,7 +14,6 @@ describe("ActivitiesActions", () => {
         approvable: true,
         cancelable: true,
         reappliable: true,
-        revertable: true,
       },
     },
     {
@@ -23,7 +22,6 @@ describe("ActivitiesActions", () => {
         approvable: true,
         cancelable: true,
         reappliable: true,
-        revertable: true,
       },
     },
   ] as const satisfies Activity[];
@@ -52,7 +50,6 @@ describe("ActivitiesActions", () => {
             approvable: false,
             cancelable: true,
             reappliable: true,
-            revertable: true,
           },
         },
       ];
@@ -145,7 +142,6 @@ describe("ActivitiesActions", () => {
             approvable: true,
             cancelable: false,
             reappliable: true,
-            revertable: true,
           },
         },
       ];
@@ -214,99 +210,6 @@ describe("ActivitiesActions", () => {
     });
   });
 
-  describe("Undo button", () => {
-    it("should be disabled when no activities are selected", () => {
-      renderWithProviders(<ActivitiesActions selected={[]} />);
-
-      const undoButton = screen.getByRole("button", { name: "Undo" });
-      expect(undoButton).toHaveAttribute("aria-disabled", "true");
-    });
-
-    it("should be enabled when activities with revertable action are selected", () => {
-      renderWithProviders(<ActivitiesActions selected={mockActivities} />);
-
-      const undoButton = screen.getByRole("button", { name: "Undo" });
-      expect(undoButton).not.toHaveAttribute("aria-disabled");
-      expect(undoButton).toBeEnabled();
-    });
-
-    it("should be disabled when selected activities are not revertable", () => {
-      const nonRevertableActivities = [
-        {
-          ...activities[0],
-          actions: {
-            approvable: true,
-            cancelable: true,
-            reappliable: true,
-            revertable: false,
-          },
-        },
-      ];
-
-      renderWithProviders(
-        <ActivitiesActions selected={nonRevertableActivities} />,
-      );
-
-      const undoButton = screen.getByRole("button", { name: "Undo" });
-      expect(undoButton).toHaveAttribute("aria-disabled", "true");
-    });
-
-    it("should show confirmation modal and undo single activity", async () => {
-      const singleActivity = [mockActivities[0]];
-      renderWithProviders(<ActivitiesActions selected={singleActivity} />);
-
-      await userEvent.click(screen.getByRole("button", { name: "Undo" }));
-
-      const modal = screen.getByRole("dialog");
-      expect(within(modal).getByText("Undo activity")).toBeInTheDocument();
-      expect(
-        within(modal).getByText(
-          "Are you sure you want to undo selected activity?",
-        ),
-      ).toBeInTheDocument();
-
-      await userEvent.click(
-        within(modal).getByRole("button", { name: "Undo" }),
-      );
-
-      expect(
-        await screen.findByText("You have successfully undone an activity."),
-      ).toBeInTheDocument();
-      expect(
-        screen.getByText(
-          "An activity has been queued to revert the changes delivered by this activity.",
-        ),
-      ).toBeInTheDocument();
-    });
-
-    it("should show confirmation modal and undo multiple activities", async () => {
-      renderWithProviders(<ActivitiesActions selected={mockActivities} />);
-
-      await userEvent.click(screen.getByRole("button", { name: "Undo" }));
-
-      const modal = screen.getByRole("dialog");
-      expect(within(modal).getByText("Undo activities")).toBeInTheDocument();
-      expect(
-        within(modal).getByText(
-          "Are you sure you want to undo selected activities?",
-        ),
-      ).toBeInTheDocument();
-
-      await userEvent.click(
-        within(modal).getByRole("button", { name: "Undo" }),
-      );
-
-      expect(
-        await screen.findByText("You have successfully undone 2 activities."),
-      ).toBeInTheDocument();
-      expect(
-        screen.getByText(
-          "Activities have been queued to revert the changes delivered by these activities.",
-        ),
-      ).toBeInTheDocument();
-    });
-  });
-
   describe("Redo button", () => {
     it("should be disabled when no activities are selected", () => {
       renderWithProviders(<ActivitiesActions selected={[]} />);
@@ -331,7 +234,6 @@ describe("ActivitiesActions", () => {
             approvable: true,
             cancelable: true,
             reappliable: false,
-            revertable: true,
           },
         },
       ];
@@ -409,7 +311,6 @@ describe("ActivitiesActions", () => {
             approvable: true,
             cancelable: true,
             reappliable: true,
-            revertable: true,
           },
         },
         {
@@ -418,7 +319,6 @@ describe("ActivitiesActions", () => {
             approvable: false,
             cancelable: true,
             reappliable: true,
-            revertable: true,
           },
         },
       ];
diff --git a/src/features/activities/components/ActivitiesActions/ActivitiesActions.tsx b/src/features/activities/components/ActivitiesActions/ActivitiesActions.tsx
index b853d1e90..67c8558bd 100644
--- a/src/features/activities/components/ActivitiesActions/ActivitiesActions.tsx
+++ b/src/features/activities/components/ActivitiesActions/ActivitiesActions.tsx
@@ -1,10 +1,14 @@
 import type { FC } from "react";
-import { useActivities } from "../../hooks";
 import useDebug from "@/hooks/useDebug";
 import useNotify from "@/hooks/useNotify";
 import type { ActivityCommon } from "../../types";
 import { pluralize, pluralizeArray } from "@/utils/_helpers";
 import { ConfirmationButton } from "@canonical/react-components";
+import {
+  useApproveActivities,
+  useCancelActivities,
+  useRedoActivities,
+} from "../../api";
 
 interface ActivitiesActionsProps {
   readonly selected: ActivityCommon[];
@@ -13,23 +17,9 @@ interface ActivitiesActionsProps {
 const ActivitiesActions: FC<ActivitiesActionsProps> = ({ selected }) => {
   const { notify } = useNotify();
   const debug = useDebug();
-  const {
-    approveActivitiesQuery,
-    cancelActivitiesQuery,
-    redoActivitiesQuery,
-    undoActivitiesQuery,
-  } = useActivities();
-
-  const {
-    mutateAsync: approveActivities,
-    isPending: approveActivitiesLoading,
-  } = approveActivitiesQuery;
-  const { mutateAsync: cancelActivities, isPending: cancelActivitiesLoading } =
-    cancelActivitiesQuery;
-  const { mutateAsync: redoActivities, isPending: redoActivitiesLoading } =
-    redoActivitiesQuery;
-  const { mutateAsync: undoActivities, isPending: undoActivitiesLoading } =
-    undoActivitiesQuery;
+  const { approveActivities, isApprovingActivities } = useApproveActivities();
+  const { cancelActivities, isCancelingActivities } = useCancelActivities();
+  const { redoActivities, isRedoingActivities } = useRedoActivities();
 
   const selectedIds = selected.map((activity) => activity.id);
   const quantifiedActivity = pluralizeArray(
@@ -86,23 +76,6 @@ const ActivitiesActions: FC<ActivitiesActionsProps> = ({ selected }) => {
     }
   };
 
-  const handleUndoActivities = async () => {
-    try {
-      await undoActivities({ activity_ids: selectedIds });
-
-      notify.success({
-        title: `You have successfully undone ${quantifiedActivity}.`,
-        message: `${pluralize(
-          selected.length,
-          "An activity has been queued to revert the changes delivered by this activity.",
-          "Activities have been queued to revert the changes delivered by these activities.",
-        )}`,
-      });
-    } catch (error) {
-      debug(error);
-    }
-  };
-
   return (
     <div key="buttons" className="p-segmented-control">
       <div className="p-segmented-control__list">
@@ -111,7 +84,7 @@ const ActivitiesActions: FC<ActivitiesActionsProps> = ({ selected }) => {
           type="button"
           disabled={
             !selected.length ||
-            approveActivitiesLoading ||
+            isApprovingActivities ||
             selected.some((activity) => !activity.actions?.approvable)
           }
           confirmationModalProps={{
@@ -123,8 +96,8 @@ const ActivitiesActions: FC<ActivitiesActionsProps> = ({ selected }) => {
             ),
             confirmButtonLabel: "Approve",
             confirmButtonAppearance: "positive",
-            confirmButtonDisabled: approveActivitiesLoading,
-            confirmButtonLoading: approveActivitiesLoading,
+            confirmButtonDisabled: isApprovingActivities,
+            confirmButtonLoading: isApprovingActivities,
             onConfirm: handleApproveActivities,
           }}
         >
@@ -135,7 +108,7 @@ const ActivitiesActions: FC<ActivitiesActionsProps> = ({ selected }) => {
           type="button"
           disabled={
             !selected.length ||
-            cancelActivitiesLoading ||
+            isCancelingActivities ||
             selected.some((activity) => !activity.actions?.cancelable)
           }
           confirmationModalProps={{
@@ -147,8 +120,8 @@ const ActivitiesActions: FC<ActivitiesActionsProps> = ({ selected }) => {
             ),
             confirmButtonLabel: "Confirm",
             confirmButtonAppearance: "negative",
-            confirmButtonDisabled: cancelActivitiesLoading,
-            confirmButtonLoading: cancelActivitiesLoading,
+            confirmButtonDisabled: isCancelingActivities,
+            confirmButtonLoading: isCancelingActivities,
             onConfirm: handleCancelActivities,
           }}
         >
@@ -159,31 +132,7 @@ const ActivitiesActions: FC<ActivitiesActionsProps> = ({ selected }) => {
           type="button"
           disabled={
             !selected.length ||
-            undoActivitiesLoading ||
-            selected.some((activity) => !activity.actions?.revertable)
-          }
-          confirmationModalProps={{
-            title: `Undo ${pluralizedActivity}`,
-            children: (
-              <p>
-                Are you sure you want to undo selected {pluralizedActivity}?
-              </p>
-            ),
-            confirmButtonLabel: "Undo",
-            confirmButtonAppearance: "positive",
-            confirmButtonDisabled: undoActivitiesLoading,
-            confirmButtonLoading: undoActivitiesLoading,
-            onConfirm: handleUndoActivities,
-          }}
-        >
-          Undo
-        </ConfirmationButton>
-        <ConfirmationButton
-          className="p-segmented-control__button"
-          type="button"
-          disabled={
-            !selected.length ||
-            redoActivitiesLoading ||
+            isRedoingActivities ||
             selected.some((activity) => !activity.actions?.reappliable)
           }
           confirmationModalProps={{
@@ -195,8 +144,8 @@ const ActivitiesActions: FC<ActivitiesActionsProps> = ({ selected }) => {
             ),
             confirmButtonLabel: "Redo",
             confirmButtonAppearance: "positive",
-            confirmButtonDisabled: redoActivitiesLoading,
-            confirmButtonLoading: redoActivitiesLoading,
+            confirmButtonDisabled: isRedoingActivities,
+            confirmButtonLoading: isRedoingActivities,
             onConfirm: handleRedoActivities,
           }}
         >
diff --git a/src/features/activities/components/ActivitiesHeader/ActivitiesHeader.test.tsx b/src/features/activities/components/ActivitiesHeader/ActivitiesHeader.test.tsx
index 49bfc0728..6e3673609 100644
--- a/src/features/activities/components/ActivitiesHeader/ActivitiesHeader.test.tsx
+++ b/src/features/activities/components/ActivitiesHeader/ActivitiesHeader.test.tsx
@@ -4,6 +4,7 @@ import userEvent from "@testing-library/user-event";
 import { describe, expect, it, vi, beforeEach } from "vitest";
 import type { ComponentProps } from "react";
 import ActivitiesHeader from "./ActivitiesHeader";
+import { EXCLUDED_ACTIVITY_TYPE_OPTIONS } from "../../constants";
 
 const props: ComponentProps<typeof ActivitiesHeader> = {
   selected: [],
@@ -42,6 +43,16 @@ describe("ActivitiesHeader", () => {
     expect(dateFilterButton).toBeInTheDocument();
   });
 
+  it("should not show excluded activity types in the type filter", async () => {
+    await user.click(screen.getByRole("button", { name: "Type" }));
+
+    expect(
+      screen.queryByRole("button", {
+        name: EXCLUDED_ACTIVITY_TYPE_OPTIONS[0],
+      }),
+    ).not.toBeInTheDocument();
+  });
+
   it("should allow typing in search box", async () => {
     const searchBox = screen.getByRole("searchbox", { name: /search/i });
     await user.type(searchBox, "test activity");
diff --git a/src/features/activities/components/ActivitiesHeader/ActivitiesHeader.tsx b/src/features/activities/components/ActivitiesHeader/ActivitiesHeader.tsx
index 89fe1a9c9..9918217b1 100644
--- a/src/features/activities/components/ActivitiesHeader/ActivitiesHeader.tsx
+++ b/src/features/activities/components/ActivitiesHeader/ActivitiesHeader.tsx
@@ -6,7 +6,7 @@ import type { UrlParams } from "@/types/UrlParams";
 import type { FC } from "react";
 import { useEffect, useState } from "react";
 import { useParams } from "react-router";
-import { useActivities } from "../../hooks";
+import { useGetActivityTypes } from "../../api";
 import type { ActivityCommon } from "../../types";
 import ActivitiesActions from "../ActivitiesActions";
 import ActivitiesDateFilter from "../ActivitiesDateFilter";
@@ -31,11 +31,8 @@ const ActivitiesHeader: FC<ActivitiesHeaderProps> = ({
 
   const { query, setPageParams, createPageParamsSetter } = usePageParams();
   const { instanceId } = useParams<UrlParams>();
-  const { getActivityTypesQuery } = useActivities();
 
-  const { data: activityTypesQueryData } = getActivityTypesQuery();
-
-  const activityTypes = activityTypesQueryData?.data ?? [];
+  const { activityTypes } = useGetActivityTypes();
 
   const activityResultOptions = activityTypes.map((activityType) => ({
     label: activityType,
diff --git a/src/features/activities/components/ActivityDetails/ActivityDetails.tsx b/src/features/activities/components/ActivityDetails/ActivityDetails.tsx
index cc34f7cf9..29bb094b3 100644
--- a/src/features/activities/components/ActivityDetails/ActivityDetails.tsx
+++ b/src/features/activities/components/ActivityDetails/ActivityDetails.tsx
@@ -7,7 +7,7 @@ import { CodeSnippet, Icon } from "@canonical/react-components";
 import moment from "moment";
 import type { FC } from "react";
 import { ACTIVITY_STATUSES } from "../../constants";
-import { useActivities } from "../../hooks";
+import { useGetSingleActivity } from "../../api";
 import classes from "./ActivityDetails.module.scss";
 import ActivityDetailsButtons from "./components/ActivityDetailsButtons";
 import { ROUTES } from "@/libs/routes/routes";
@@ -17,15 +17,11 @@ interface ActivityDetailsProps {
 }
 
 const ActivityDetails: FC<ActivityDetailsProps> = ({ activityId }) => {
-  const { getSingleActivityQuery } = useActivities();
+  const { activity, isGettingActivity, activityError } = useGetSingleActivity({
+    activityId,
+  });
 
-  const {
-    data: getSingleActivityQueryResult,
-    isPending: getSingleActivityQueryPending,
-    error: getSingleActivityQueryError,
-  } = getSingleActivityQuery({ activityId });
-
-  const instanceId = getSingleActivityQueryResult?.data.computer_id;
+  const instanceId = activity?.computer_id;
 
   const isInstanceIdDefined = instanceId !== undefined;
 
@@ -34,15 +30,15 @@ const ActivityDetails: FC<ActivityDetailsProps> = ({ activityId }) => {
     { enabled: isInstanceIdDefined },
   );
 
-  if (getSingleActivityQueryPending) {
+  if (isGettingActivity) {
     return <LoadingState />;
   }
 
-  if (getSingleActivityQueryError) {
-    throw getSingleActivityQueryError;
+  if (activityError) {
+    throw activityError;
   }
 
-  if (!getSingleActivityQueryResult?.data) {
+  if (!activity) {
     throw new Error();
   }
 
@@ -50,8 +46,6 @@ const ActivityDetails: FC<ActivityDetailsProps> = ({ activityId }) => {
     return <LoadingState />;
   }
 
-  const activity = getSingleActivityQueryResult.data;
-
   return (
     <>
       <ActivityDetailsButtons activity={activity} />
diff --git a/src/features/activities/components/ActivityDetails/components/ActivityDetailsButtons/ActivityDetailsButtons.test.tsx b/src/features/activities/components/ActivityDetails/components/ActivityDetailsButtons/ActivityDetailsButtons.test.tsx
index 3d70d6132..b7884e7e7 100644
--- a/src/features/activities/components/ActivityDetails/components/ActivityDetailsButtons/ActivityDetailsButtons.test.tsx
+++ b/src/features/activities/components/ActivityDetails/components/ActivityDetailsButtons/ActivityDetailsButtons.test.tsx
@@ -14,7 +14,6 @@ describe("ActivityDetailsButtons", () => {
       approvable: true,
       cancelable: true,
       reappliable: true,
-      revertable: true,
     },
   };
 
@@ -63,7 +62,6 @@ describe("ActivityDetailsButtons", () => {
           approvable: false,
           cancelable: true,
           reappliable: false,
-          revertable: false,
         },
       };
       renderWithProviders(
@@ -108,41 +106,6 @@ describe("ActivityDetailsButtons", () => {
     });
   });
 
-  describe("Undo button", () => {
-    it("should render when activity is revertable", () => {
-      renderWithProviders(<ActivityDetailsButtons activity={mockActivity} />);
-      expect(screen.getByRole("button", { name: "Undo" })).toBeInTheDocument();
-    });
-
-    it("should not render when activity is not revertable", () => {
-      const nonRevertableActivity = {
-        ...mockActivity,
-        actions: { ...mockActivity.actions, revertable: false },
-      };
-      renderWithProviders(
-        <ActivityDetailsButtons activity={nonRevertableActivity} />,
-      );
-      expect(
-        screen.queryByRole("button", { name: "Undo" }),
-      ).not.toBeInTheDocument();
-    });
-
-    it("should show confirmation modal and undo activity", async () => {
-      renderWithProviders(<ActivityDetailsButtons activity={mockActivity} />);
-
-      await user.click(screen.getByRole("button", { name: "Undo" }));
-
-      const modal = screen.getByRole("dialog");
-      expect(within(modal).getByText("Undo activity")).toBeInTheDocument();
-
-      await user.click(within(modal).getByRole("button", { name: "Undo" }));
-
-      expect(
-        await screen.findByText("You have successfully undone an activity."),
-      ).toBeInTheDocument();
-    });
-  });
-
   describe("Redo button", () => {
     it("should render when activity is reappliable", () => {
       renderWithProviders(<ActivityDetailsButtons activity={mockActivity} />);
diff --git a/src/features/activities/components/ActivityDetails/components/ActivityDetailsButtons/ActivityDetailsButtons.tsx b/src/features/activities/components/ActivityDetails/components/ActivityDetailsButtons/ActivityDetailsButtons.tsx
index eb365c4fa..a0daff1f6 100644
--- a/src/features/activities/components/ActivityDetails/components/ActivityDetailsButtons/ActivityDetailsButtons.tsx
+++ b/src/features/activities/components/ActivityDetails/components/ActivityDetailsButtons/ActivityDetailsButtons.tsx
@@ -1,4 +1,9 @@
-import { useActivities, type Activity } from "@/features/activities";
+import {
+  useApproveActivities,
+  useCancelActivities,
+  useRedoActivities,
+  type Activity,
+} from "@/features/activities";
 import useDebug from "@/hooks/useDebug";
 import useNotify from "@/hooks/useNotify";
 import useSidePanel from "@/hooks/useSidePanel";
@@ -15,23 +20,9 @@ const ActivityDetailsButtons: FC<ActivityDetailsButtonsProps> = ({
   const debug = useDebug();
   const { notify } = useNotify();
   const { closeSidePanel } = useSidePanel();
-  const {
-    approveActivitiesQuery,
-    cancelActivitiesQuery,
-    redoActivitiesQuery,
-    undoActivitiesQuery,
-  } = useActivities();
-
-  const {
-    mutateAsync: approveActivities,
-    isPending: approveActivitiesLoading,
-  } = approveActivitiesQuery;
-  const { mutateAsync: cancelActivities, isPending: cancelActivitiesLoading } =
-    cancelActivitiesQuery;
-  const { mutateAsync: redoActivities, isPending: redoActivitiesLoading } =
-    redoActivitiesQuery;
-  const { mutateAsync: undoActivities, isPending: undoActivitiesLoading } =
-    undoActivitiesQuery;
+  const { approveActivities, isApprovingActivities } = useApproveActivities();
+  const { cancelActivities, isCancelingActivities } = useCancelActivities();
+  const { redoActivities, isRedoingActivities } = useRedoActivities();
 
   const handleApproveActivity = async (a: Activity) => {
     try {
@@ -80,22 +71,6 @@ const ActivityDetailsButtons: FC<ActivityDetailsButtonsProps> = ({
     }
   };
 
-  const handleUndoActivity = async (a: Activity) => {
-    try {
-      await undoActivities({ activity_ids: [a.id] });
-
-      closeSidePanel();
-
-      notify.success({
-        title: "You have successfully undone an activity.",
-        message:
-          "An activity has been queued to revert the changes delivered by this activity.",
-      });
-    } catch (error) {
-      debug(error);
-    }
-  };
-
   return (
     <div key="buttons" className="p-segmented-control">
       <div className="p-segmented-control__list">
@@ -103,7 +78,7 @@ const ActivityDetailsButtons: FC<ActivityDetailsButtonsProps> = ({
           <ConfirmationButton
             className="p-segmented-control__button u-no-margin"
             type="button"
-            disabled={approveActivitiesLoading}
+            disabled={isApprovingActivities}
             confirmationModalProps={{
               title: "Approve activity",
               children: (
@@ -113,8 +88,8 @@ const ActivityDetailsButtons: FC<ActivityDetailsButtonsProps> = ({
               ),
               confirmButtonLabel: "Approve",
               confirmButtonAppearance: "positive",
-              confirmButtonDisabled: approveActivitiesLoading,
-              confirmButtonLoading: approveActivitiesLoading,
+              confirmButtonDisabled: isApprovingActivities,
+              confirmButtonLoading: isApprovingActivities,
               onConfirm: async () => handleApproveActivity(activity),
             }}
           >
@@ -125,7 +100,7 @@ const ActivityDetailsButtons: FC<ActivityDetailsButtonsProps> = ({
           <ConfirmationButton
             className="p-segmented-control__button u-no-margin"
             type="button"
-            disabled={cancelActivitiesLoading}
+            disabled={isCancelingActivities}
             confirmationModalProps={{
               title: "Cancel activity",
               children: (
@@ -135,45 +110,21 @@ const ActivityDetailsButtons: FC<ActivityDetailsButtonsProps> = ({
               ),
               confirmButtonLabel: "Confirm",
               confirmButtonAppearance: "negative",
-              confirmButtonDisabled: cancelActivitiesLoading,
-              confirmButtonLoading: cancelActivitiesLoading,
+              confirmButtonDisabled: isCancelingActivities,
+              confirmButtonLoading: isCancelingActivities,
               onConfirm: async () => handleCancelActivity(activity),
             }}
           >
-            {!activity.actions?.approvable &&
-            !activity.actions?.reappliable &&
-            !activity.actions?.revertable
+            {!activity.actions?.approvable && !activity.actions?.reappliable
               ? "Cancel activity"
               : "Cancel"}
           </ConfirmationButton>
         )}
-        {activity.actions?.revertable && (
-          <ConfirmationButton
-            className="p-segmented-control__button u-no-margin"
-            type="button"
-            disabled={undoActivitiesLoading}
-            confirmationModalProps={{
-              title: "Undo activity",
-              children: (
-                <p>
-                  Are you sure you want to undo {activity.summary} activity?
-                </p>
-              ),
-              confirmButtonLabel: "Undo",
-              confirmButtonAppearance: "positive",
-              confirmButtonDisabled: undoActivitiesLoading,
-              confirmButtonLoading: undoActivitiesLoading,
-              onConfirm: async () => handleUndoActivity(activity),
-            }}
-          >
-            Undo
-          </ConfirmationButton>
-        )}
         {activity.actions?.reappliable && (
           <ConfirmationButton
             className="p-segmented-control__button u-no-margin"
             type="button"
-            disabled={redoActivitiesLoading}
+            disabled={isRedoingActivities}
             confirmationModalProps={{
               title: "Redo activity",
               children: (
@@ -183,8 +134,8 @@ const ActivityDetailsButtons: FC<ActivityDetailsButtonsProps> = ({
               ),
               confirmButtonLabel: "Redo",
               confirmButtonAppearance: "positive",
-              confirmButtonDisabled: redoActivitiesLoading,
-              confirmButtonLoading: redoActivitiesLoading,
+              confirmButtonDisabled: isRedoingActivities,
+              confirmButtonLoading: isRedoingActivities,
               onConfirm: async () => handleRedoActivity(activity),
             }}
           >
diff --git a/src/features/activities/components/ActivityTypeFilter/ActivityTypeFilter.test.tsx b/src/features/activities/components/ActivityTypeFilter/ActivityTypeFilter.test.tsx
index af9dffbec..4156482d2 100644
--- a/src/features/activities/components/ActivityTypeFilter/ActivityTypeFilter.test.tsx
+++ b/src/features/activities/components/ActivityTypeFilter/ActivityTypeFilter.test.tsx
@@ -26,8 +26,9 @@ describe("ActivityTypeFilter", () => {
 
     await user.click(toggle);
 
-    const listItems = screen.getAllByRole("listitem");
-    expect(listItems).toHaveLength(options.length);
+    expect(
+      screen.getByRole("button", { name: activityTypes[0] }),
+    ).toBeInTheDocument();
   });
 
   it("handles case-insensitive search", async () => {
diff --git a/src/features/activities/constants.ts b/src/features/activities/constants.ts
index 1bc81df74..02733150e 100644
--- a/src/features/activities/constants.ts
+++ b/src/features/activities/constants.ts
@@ -1,6 +1,8 @@
 import type { ActivityStatus } from "./types";
 import classes from "./activities.module.scss";
 
+export const EXCLUDED_ACTIVITY_TYPE_OPTIONS = ["StubRevertableRequest"];
+
 export const ACTIVITY_STATUSES: Record<
   ActivityStatus,
   { icon: string; label: string }
diff --git a/src/features/activities/hooks/index.ts b/src/features/activities/hooks/index.ts
index c9a25d2c6..a7624e81e 100644
--- a/src/features/activities/hooks/index.ts
+++ b/src/features/activities/hooks/index.ts
@@ -1,2 +1,2 @@
-export { default as useActivities } from "./useActivities";
 export { default as useOpenActivityDetails } from "./useOpenActivityDetails";
+export { default as useOpenActivityDetailsPanel } from "./useOpenActivityDetailsPanel";
diff --git a/src/features/activities/hooks/useActivities.tsx b/src/features/activities/hooks/useActivities.tsx
deleted file mode 100644
index e1f386ad2..000000000
--- a/src/features/activities/hooks/useActivities.tsx
+++ /dev/null
@@ -1,119 +0,0 @@
-import LoadingState from "@/components/layout/LoadingState";
-import useFetch from "@/hooks/useFetch";
-import useFetchOld from "@/hooks/useFetchOld";
-import useSidePanel from "@/hooks/useSidePanel";
-import type { ApiError } from "@/types/api/ApiError";
-import type { QueryFnType } from "@/types/api/QueryFnType";
-import type { UseQueryOptions } from "@tanstack/react-query";
-import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
-import type { AxiosError, AxiosResponse } from "axios";
-import { lazy, Suspense } from "react";
-import type {
-  Activity,
-  ActivityCommon,
-  ApproveActivitiesParams,
-  CancelActivitiesParams,
-  GetSingleActivityParams,
-  RedoUndoActivitiesParams,
-} from "../types";
-
-const ActivityDetails = lazy(
-  async () => import("../components/ActivityDetails"),
-);
-
-export default function useActivities() {
-  const authFetchOld = useFetchOld();
-  const authFetch = useFetch();
-  const queryClient = useQueryClient();
-  const { setSidePanelContent } = useSidePanel();
-
-  const getSingleActivityQuery = (
-    { activityId, ...queryParams }: GetSingleActivityParams,
-    config: Omit<
-      UseQueryOptions<AxiosResponse<Activity>, AxiosError<ApiError>>,
-      "queryKey" | "queryFn"
-    > = {},
-  ) => {
-    return useQuery<AxiosResponse<Activity>, AxiosError<ApiError>>({
-      queryKey: ["activities", { activityId, ...queryParams }],
-      queryFn: async () =>
-        authFetch.get(`activities/${activityId}`, { params: queryParams }),
-      ...config,
-    });
-  };
-
-  const getActivityTypesQuery: QueryFnType<
-    AxiosResponse<string[]>,
-    Record<never, unknown>
-  > = (queryParams = {}, config = {}) => {
-    return useQuery<AxiosResponse<string[]>, AxiosError<ApiError>>({
-      queryKey: ["activityTypes"],
-      queryFn: async () =>
-        authFetchOld.get("GetActivityTypes", { params: queryParams }),
-      ...config,
-    });
-  };
-
-  const cancelActivitiesQuery = useMutation<
-    number[],
-    AxiosError<ApiError>,
-    CancelActivitiesParams
-  >({
-    mutationKey: ["activities", "cancel"],
-    mutationFn: async (params) =>
-      authFetchOld.get("CancelActivities", { params }),
-    onSuccess: async () =>
-      queryClient.invalidateQueries({ queryKey: ["activities"] }),
-  });
-
-  const approveActivitiesQuery = useMutation<
-    string[],
-    AxiosError<ApiError>,
-    ApproveActivitiesParams
-  >({
-    mutationKey: ["activities", "approve"],
-    mutationFn: async (params) =>
-      authFetchOld.get("ApproveActivities", { params }),
-    onSuccess: async () =>
-      queryClient.invalidateQueries({ queryKey: ["activities"] }),
-  });
-
-  const redoActivitiesQuery = useMutation<
-    number[],
-    AxiosError<ApiError>,
-    RedoUndoActivitiesParams
-  >({
-    mutationFn: async (params) => authFetch.post("activities/reapply", params),
-    onSuccess: async () =>
-      queryClient.invalidateQueries({ queryKey: ["activities"] }),
-  });
-
-  const undoActivitiesQuery = useMutation<
-    number[],
-    AxiosError<ApiError>,
-    RedoUndoActivitiesParams
-  >({
-    mutationFn: async (params) => authFetch.post("activities/revert", params),
-    onSuccess: async () =>
-      queryClient.invalidateQueries({ queryKey: ["activities"] }),
-  });
-
-  const openActivityDetails = (activity: ActivityCommon) => {
-    setSidePanelContent(
-      activity.summary,
-      <Suspense fallback={<LoadingState />}>
-        <ActivityDetails activityId={activity.id} />
-      </Suspense>,
-    );
-  };
-
-  return {
-    getSingleActivityQuery,
-    getActivityTypesQuery,
-    cancelActivitiesQuery,
-    approveActivitiesQuery,
-    redoActivitiesQuery,
-    undoActivitiesQuery,
-    openActivityDetails,
-  };
-}
diff --git a/src/features/activities/hooks/useOpenActivityDetailsPanel.tsx b/src/features/activities/hooks/useOpenActivityDetailsPanel.tsx
new file mode 100644
index 000000000..03b68c219
--- /dev/null
+++ b/src/features/activities/hooks/useOpenActivityDetailsPanel.tsx
@@ -0,0 +1,26 @@
+import LoadingState from "@/components/layout/LoadingState";
+import useSidePanel from "@/hooks/useSidePanel";
+import type { ActivityCommon } from "../types";
+import { lazy, Suspense, useCallback } from "react";
+
+const ActivityDetails = lazy(
+  async () => import("../components/ActivityDetails"),
+);
+
+const useOpenActivityDetailsPanel = () => {
+  const { setSidePanelContent } = useSidePanel();
+
+  return useCallback(
+    (activity: ActivityCommon) => {
+      setSidePanelContent(
+        activity.summary,
+        <Suspense fallback={<LoadingState />}>
+          <ActivityDetails activityId={activity.id} />
+        </Suspense>,
+      );
+    },
+    [setSidePanelContent],
+  );
+};
+
+export default useOpenActivityDetailsPanel;
diff --git a/src/features/activities/index.tsx b/src/features/activities/index.tsx
index b543e8b1a..e1a574c19 100644
--- a/src/features/activities/index.tsx
+++ b/src/features/activities/index.tsx
@@ -16,12 +16,19 @@ export const ActivityDetails: FC<
   );
 };
 
-export { useGetActivities } from "./api";
+export {
+  useApproveActivities,
+  useCancelActivities,
+  useGetActivities,
+  useGetActivityTypes,
+  useGetSingleActivity,
+  useRedoActivities,
+} from "./api";
 export { default as Activities } from "./components/Activities";
 export { default as ActivitiesActions } from "./components/ActivitiesActions";
 export { default as ActivitiesEmptyState } from "./components/ActivitiesEmptyState";
 export { ACTIVITY_STATUSES } from "./constants";
-export { useActivities } from "./hooks";
+export { useOpenActivityDetails, useOpenActivityDetailsPanel } from "./hooks";
 export type {
   Activity,
   ActivityCommon,
diff --git a/src/features/activities/types/Activity.ts b/src/features/activities/types/Activity.ts
index 088bfba18..8e67543f6 100644
--- a/src/features/activities/types/Activity.ts
+++ b/src/features/activities/types/Activity.ts
@@ -15,7 +15,6 @@ interface ActivityActions {
   approvable: boolean;
   cancelable: boolean;
   reappliable: boolean;
-  revertable: boolean;
 }
 
 export interface ActivityCommon extends Record<string, unknown> {
diff --git a/src/features/activities/types/ActivityParams.ts b/src/features/activities/types/ActivityParams.ts
index b07c96194..eb2eb0a13 100644
--- a/src/features/activities/types/ActivityParams.ts
+++ b/src/features/activities/types/ActivityParams.ts
@@ -16,6 +16,6 @@ export interface ApproveActivitiesParams {
   query: string;
 }
 
-export interface RedoUndoActivitiesParams {
+export interface RedoActivitiesParams {
   activity_ids: number[];
 }
diff --git a/src/features/activities/types/index.ts b/src/features/activities/types/index.ts
index c85f39573..4a4fe6cb4 100644
--- a/src/features/activities/types/index.ts
+++ b/src/features/activities/types/index.ts
@@ -13,5 +13,5 @@ export type {
   CancelActivitiesParams,
   GetActivitiesParams,
   GetSingleActivityParams,
-  RedoUndoActivitiesParams,
+  RedoActivitiesParams,
 } from "./ActivityParams";
diff --git a/src/features/employees/components/EmployeeInstancesTableActions/EmployeeInstancesTableActions.tsx b/src/features/employees/components/EmployeeInstancesTableActions/EmployeeInstancesTableActions.tsx
index c3d24995d..e49a7def9 100644
--- a/src/features/employees/components/EmployeeInstancesTableActions/EmployeeInstancesTableActions.tsx
+++ b/src/features/employees/components/EmployeeInstancesTableActions/EmployeeInstancesTableActions.tsx
@@ -1,6 +1,6 @@
 import TextConfirmationModal from "@/components/form/TextConfirmationModal";
 import ListActions from "@/components/layout/ListActions";
-import { useActivities } from "@/features/activities";
+import { useOpenActivityDetailsPanel } from "@/features/activities";
 import {
   GenerateRecoveryKeyModal,
   isRecoveryKeyActivityInProgress,
@@ -30,7 +30,7 @@ const EmployeeInstancesTableActions: FC<EmployeeInstancesTableActionsProps> = ({
   const debug = useDebug();
   const { notify } = useNotify();
   const navigate = useNavigate();
-  const { openActivityDetails } = useActivities();
+  const openActivityDetails = useOpenActivityDetailsPanel();
 
   const { sanitizeInstance, isSanitizingInstance } = useSanitizeInstance();
   const { recoveryKey, recoveryKeyActivityStatus, isRecoveryKeyFetched } =
diff --git a/src/features/instances/components/DistributionUpgrades/DistributionUpgrades.tsx b/src/features/instances/components/DistributionUpgrades/DistributionUpgrades.tsx
index a9d2737a0..2d97fef25 100644
--- a/src/features/instances/components/DistributionUpgrades/DistributionUpgrades.tsx
+++ b/src/features/instances/components/DistributionUpgrades/DistributionUpgrades.tsx
@@ -1,5 +1,5 @@
 import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
-import { useActivities } from "@/features/activities";
+import { useOpenActivityDetailsPanel } from "@/features/activities";
 import { useCreateDistributionUpgrades } from "@/features/instances";
 import useDebug from "@/hooks/useDebug";
 import useNotify from "@/hooks/useNotify";
@@ -51,7 +51,7 @@ const DistributionUpgrades: FC<DistributionUpgradesProps> = ({
   const debug = useDebug();
   const { notify } = useNotify();
   const { closeSidePanel } = useSidePanel();
-  const { openActivityDetails } = useActivities();
+  const openActivityDetails = useOpenActivityDetailsPanel();
 
   const { isGettingDistributionUpgradeTargets, eligibleIds, tableData } =
     useDistributionUpgradesTableData(selectedInstances);
diff --git a/src/features/instances/components/GenerateRecoveryKeyModal/GenerateRecoveryKeyModal.tsx b/src/features/instances/components/GenerateRecoveryKeyModal/GenerateRecoveryKeyModal.tsx
index 3dd3b4361..7d7369506 100644
--- a/src/features/instances/components/GenerateRecoveryKeyModal/GenerateRecoveryKeyModal.tsx
+++ b/src/features/instances/components/GenerateRecoveryKeyModal/GenerateRecoveryKeyModal.tsx
@@ -1,4 +1,4 @@
-import { useActivities } from "@/features/activities";
+import { useOpenActivityDetailsPanel } from "@/features/activities";
 import useDebug from "@/hooks/useDebug";
 import useNotify from "@/hooks/useNotify";
 import type { Instance } from "@/types/Instance";
@@ -17,7 +17,7 @@ const GenerateRecoveryKeyModal: FC<GenerateRecoveryKeyModalProps> = ({
 }) => {
   const debug = useDebug();
   const { notify } = useNotify();
-  const { openActivityDetails } = useActivities();
+  const openActivityDetails = useOpenActivityDetailsPanel();
 
   const { generateRecoveryKey, isGeneratingRecoveryKey } =
     useGenerateRecoveryKey();
diff --git a/src/features/instances/components/RegenerateRecoveryKeyModal/RegenerateRecoveryKeyModal.tsx b/src/features/instances/components/RegenerateRecoveryKeyModal/RegenerateRecoveryKeyModal.tsx
index 14ad1c8c0..17bbd66af 100644
--- a/src/features/instances/components/RegenerateRecoveryKeyModal/RegenerateRecoveryKeyModal.tsx
+++ b/src/features/instances/components/RegenerateRecoveryKeyModal/RegenerateRecoveryKeyModal.tsx
@@ -1,5 +1,5 @@
 import TextConfirmationModal from "@/components/form/TextConfirmationModal";
-import { useActivities } from "@/features/activities";
+import { useOpenActivityDetailsPanel } from "@/features/activities";
 import useDebug from "@/hooks/useDebug";
 import useNotify from "@/hooks/useNotify";
 import type { Instance } from "@/types/Instance";
@@ -19,7 +19,7 @@ const RegenerateRecoveryKeyModal: FC<RegenerateRecoveryKeyModalProps> = ({
 }) => {
   const debug = useDebug();
   const { notify } = useNotify();
-  const { openActivityDetails } = useActivities();
+  const openActivityDetails = useOpenActivityDetailsPanel();
 
   const { generateRecoveryKey, isGeneratingRecoveryKey } =
     useGenerateRecoveryKey();
diff --git a/src/features/instances/components/RestartModal/RestartModal.tsx b/src/features/instances/components/RestartModal/RestartModal.tsx
index 2f93db896..b90a9a50f 100644
--- a/src/features/instances/components/RestartModal/RestartModal.tsx
+++ b/src/features/instances/components/RestartModal/RestartModal.tsx
@@ -14,7 +14,7 @@ import {
   REBOOT_OR_SHUT_DOWN_INITIAL_VALUES,
   REBOOT_OR_SHUT_DOWN_VALIDATION_SCHEMA,
 } from "../../constants";
-import { useActivities } from "@/features/activities";
+import { useOpenActivityDetailsPanel } from "@/features/activities";
 import { pluralizeArray } from "@/utils/_helpers";
 
 interface RestartModalProps {
@@ -26,7 +26,7 @@ const RestartModal: FC<RestartModalProps> = ({ instances, close }) => {
   const debug = useDebug();
   const { notify } = useNotify();
 
-  const { openActivityDetails } = useActivities();
+  const openActivityDetails = useOpenActivityDetailsPanel();
 
   const { restartInstances, isRestartingInstances } = useRestartInstances();
 
diff --git a/src/features/instances/components/ShutDownModal/ShutDownModal.tsx b/src/features/instances/components/ShutDownModal/ShutDownModal.tsx
index 190a3d980..623d2b489 100644
--- a/src/features/instances/components/ShutDownModal/ShutDownModal.tsx
+++ b/src/features/instances/components/ShutDownModal/ShutDownModal.tsx
@@ -15,7 +15,7 @@ import {
   REBOOT_OR_SHUT_DOWN_INITIAL_VALUES,
   REBOOT_OR_SHUT_DOWN_VALIDATION_SCHEMA,
 } from "../../constants";
-import { useActivities } from "@/features/activities";
+import { useOpenActivityDetailsPanel } from "@/features/activities";
 import { pluralizeArray } from "@/utils/_helpers";
 
 interface ShutDownModalProps {
@@ -27,7 +27,7 @@ const ShutDownModal: FC<ShutDownModalProps> = ({ instances, close }) => {
   const debug = useDebug();
   const { notify } = useNotify();
 
-  const { openActivityDetails } = useActivities();
+  const openActivityDetails = useOpenActivityDetailsPanel();
 
   const { shutDownInstances, isShuttingDownInstances } = useShutDownInstances();
 
diff --git a/src/features/kernel/components/DowngradeKernelForm/DowngradeKernelForm.tsx b/src/features/kernel/components/DowngradeKernelForm/DowngradeKernelForm.tsx
index 34b1c47f5..2839a7b7b 100644
--- a/src/features/kernel/components/DowngradeKernelForm/DowngradeKernelForm.tsx
+++ b/src/features/kernel/components/DowngradeKernelForm/DowngradeKernelForm.tsx
@@ -3,7 +3,7 @@ import {
   RandomizationBlock,
 } from "@/components/form/DeliveryScheduling";
 import InfoGrid from "@/components/layout/InfoGrid";
-import { useActivities } from "@/features/activities";
+import { useOpenActivityDetailsPanel } from "@/features/activities";
 import useDebug from "@/hooks/useDebug";
 import useNotify from "@/hooks/useNotify";
 import useSidePanel from "@/hooks/useSidePanel";
@@ -46,7 +46,7 @@ const DowngradeKernelForm: FC<DowngradeKernelFormProps> = ({
   const { closeSidePanel } = useSidePanel();
   const { notify } = useNotify();
   const { downgradeKernelQuery } = useKernel();
-  const { openActivityDetails } = useActivities();
+  const openActivityDetails = useOpenActivityDetailsPanel();
 
   const { mutateAsync: downgradeKernel, isPending: isDowngradingKernel } =
     downgradeKernelQuery;
diff --git a/src/features/kernel/components/RestartInstanceForm/RestartInstanceForm.tsx b/src/features/kernel/components/RestartInstanceForm/RestartInstanceForm.tsx
index 138def80d..4112352a7 100644
--- a/src/features/kernel/components/RestartInstanceForm/RestartInstanceForm.tsx
+++ b/src/features/kernel/components/RestartInstanceForm/RestartInstanceForm.tsx
@@ -1,4 +1,4 @@
-import { useActivities } from "@/features/activities";
+import { useOpenActivityDetailsPanel } from "@/features/activities";
 import { useRestartInstance } from "@/features/instances";
 import useDebug from "@/hooks/useDebug";
 import useNotify from "@/hooks/useNotify";
@@ -42,7 +42,7 @@ const RestartInstanceForm: FC<RestartInstanceFormProps> = ({
   const { closeSidePanel } = useSidePanel();
   const { notify } = useNotify();
   const { upgradeKernelQuery } = useKernel();
-  const { openActivityDetails } = useActivities();
+  const openActivityDetails = useOpenActivityDetailsPanel();
 
   const { restartInstance, isRestartingInstance } = useRestartInstance();
   const { mutateAsync: upgradeKernel, isPending: isUpgradingAndRestarting } =
diff --git a/src/features/kernel/components/UpgradeKernelForm/UpgradeKernelForm.tsx b/src/features/kernel/components/UpgradeKernelForm/UpgradeKernelForm.tsx
index 7c51eb2e3..1d6e33a20 100644
--- a/src/features/kernel/components/UpgradeKernelForm/UpgradeKernelForm.tsx
+++ b/src/features/kernel/components/UpgradeKernelForm/UpgradeKernelForm.tsx
@@ -3,7 +3,7 @@ import {
   RandomizationBlock,
 } from "@/components/form/DeliveryScheduling";
 import InfoGrid from "@/components/layout/InfoGrid";
-import { useActivities } from "@/features/activities";
+import { useOpenActivityDetailsPanel } from "@/features/activities";
 import useDebug from "@/hooks/useDebug";
 import useNotify from "@/hooks/useNotify";
 import useSidePanel from "@/hooks/useSidePanel";
@@ -46,7 +46,7 @@ const UpgradeKernelForm: FC<UpgradeKernelFormProps> = ({
   const { closeSidePanel } = useSidePanel();
   const { notify } = useNotify();
   const { upgradeKernelQuery } = useKernel();
-  const { openActivityDetails } = useActivities();
+  const openActivityDetails = useOpenActivityDetailsPanel();
 
   const { mutateAsync: upgradeKernel, isPending: isUpgradingKernel } =
     upgradeKernelQuery;
diff --git a/src/features/overview/components/InfoTablesContainer/InfoTablesContainer.tsx b/src/features/overview/components/InfoTablesContainer/InfoTablesContainer.tsx
index c7bb67787..5706bcdca 100644
--- a/src/features/overview/components/InfoTablesContainer/InfoTablesContainer.tsx
+++ b/src/features/overview/components/InfoTablesContainer/InfoTablesContainer.tsx
@@ -4,7 +4,7 @@ import LoadingState from "@/components/layout/LoadingState";
 import NoData from "@/components/layout/NoData";
 import { DISPLAY_DATE_TIME_FORMAT } from "@/constants";
 import type { Activity, ActivityCommon } from "@/features/activities";
-import { useActivities, useGetActivities } from "@/features/activities";
+import { useApproveActivities, useGetActivities } from "@/features/activities";
 import { useGetInstances } from "@/features/instances";
 import type { Package } from "@/features/packages";
 import { usePackages } from "@/features/packages";
@@ -52,12 +52,10 @@ const InfoTablesContainer: FC = () => {
   const { notify } = useNotify();
   const { getPackagesQuery, upgradePackagesQuery } = usePackages();
   const { getUsnsQuery } = useUsns();
-  const { approveActivitiesQuery } = useActivities();
 
   const { mutateAsync: upgradePackages, isPending: isUpgrading } =
     upgradePackagesQuery;
-  const { mutateAsync: approveActivities, isPending: isApproving } =
-    approveActivitiesQuery;
+  const { approveActivities, isApprovingActivities } = useApproveActivities();
 
   const [packagesLimit, setPackagesLimit] = useState(MAX_PACKAGE_COUNT);
   const [usnsLimit, setUsnsLimit] = useState(MAX_USN_COUNT);
@@ -541,8 +539,8 @@ const InfoTablesContainer: FC = () => {
                 ),
                 confirmButtonLabel: "Approve",
                 confirmButtonAppearance: "positive",
-                confirmButtonDisabled: isApproving,
-                confirmButtonLoading: isApproving,
+                confirmButtonDisabled: isApprovingActivities,
+                confirmButtonLoading: isApprovingActivities,
                 onConfirm: handleApproveActivities,
               }}
             >
diff --git a/src/features/packages/components/InstalledPackagesActionForm/InstalledPackagesActionForm.tsx b/src/features/packages/components/InstalledPackagesActionForm/InstalledPackagesActionForm.tsx
index ba87c6549..4ee44a41b 100644
--- a/src/features/packages/components/InstalledPackagesActionForm/InstalledPackagesActionForm.tsx
+++ b/src/features/packages/components/InstalledPackagesActionForm/InstalledPackagesActionForm.tsx
@@ -5,7 +5,7 @@ import {
 import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
 import InfoItem from "@/components/layout/InfoItem";
 import type { Activity } from "@/features/activities";
-import { useActivities } from "@/features/activities";
+import { useOpenActivityDetailsPanel } from "@/features/activities";
 import useDebug from "@/hooks/useDebug";
 import useNotify from "@/hooks/useNotify";
 import useSidePanel from "@/hooks/useSidePanel";
@@ -39,7 +39,7 @@ const InstalledPackagesActionForm: FC<InstalledPackagesActionFormProps> = ({
   const { instanceId: urlInstanceId, childInstanceId } = useParams<UrlParams>();
   const debug = useDebug();
   const { notify } = useNotify();
-  const { openActivityDetails } = useActivities();
+  const openActivityDetails = useOpenActivityDetailsPanel();
   const { closeSidePanel } = useSidePanel();
   const {
     downgradePackageVersionQuery,
diff --git a/src/features/packages/components/PackagesInstallForm/PackagesInstallForm.tsx b/src/features/packages/components/PackagesInstallForm/PackagesInstallForm.tsx
index 61bdd3c38..f79851149 100644
--- a/src/features/packages/components/PackagesInstallForm/PackagesInstallForm.tsx
+++ b/src/features/packages/components/PackagesInstallForm/PackagesInstallForm.tsx
@@ -2,7 +2,7 @@ import type { FC } from "react";
 import { useState } from "react";
 import { useParams } from "react-router";
 import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
-import { useActivities } from "@/features/activities";
+import { useOpenActivityDetailsPanel } from "@/features/activities";
 import useDebug from "@/hooks/useDebug";
 import useNotify from "@/hooks/useNotify";
 import useSidePanel from "@/hooks/useSidePanel";
@@ -20,7 +20,7 @@ const PackagesInstallForm: FC = () => {
   const { notify } = useNotify();
   const { packagesActionQuery } = usePackages();
   const { closeSidePanel } = useSidePanel();
-  const { openActivityDetails } = useActivities();
+  const openActivityDetails = useOpenActivityDetailsPanel();
 
   const instanceId = Number(childInstanceId ?? urlInstanceId);
 
diff --git a/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/components/SecurityProfileDownloadAuditForm/SecurityProfileDownloadAuditForm.tsx b/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/components/SecurityProfileDownloadAuditForm/SecurityProfileDownloadAuditForm.tsx
index 0dd62453b..9f8bb52ee 100644
--- a/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/components/SecurityProfileDownloadAuditForm/SecurityProfileDownloadAuditForm.tsx
+++ b/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/components/SecurityProfileDownloadAuditForm/SecurityProfileDownloadAuditForm.tsx
@@ -2,7 +2,7 @@ import RadioGroup from "@/components/form/RadioGroup";
 import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
 import LoadingState from "@/components/layout/LoadingState";
 import { INPUT_DATE_FORMAT } from "@/constants";
-import { useActivities } from "@/features/activities";
+import { useGetSingleActivity } from "@/features/activities";
 import useDebug from "@/hooks/useDebug";
 import usePageParams from "@/hooks/usePageParams";
 import { getFormikError } from "@/utils/formikErrors";
@@ -39,7 +39,6 @@ const SecurityProfileDownloadAuditForm: FC<
   const debug = useDebug();
   const { sidePath, popSidePath, createPageParamsSetter } = usePageParams();
 
-  const { getSingleActivityQuery } = useActivities();
   const { getSecurityProfileReport, isSecurityProfileReportLoading } =
     useGetSecurityProfileReport();
 
@@ -55,11 +54,7 @@ const SecurityProfileDownloadAuditForm: FC<
 
   const pendingReport = pendingReports.find((report) => report.profileId == id);
 
-  const {
-    data: getSingleActivityQueryResponse,
-    isLoading: isGettingActivity,
-    isError: isActivityError,
-  } = getSingleActivityQuery(
+  const { activity, isLoadingActivity, isActivityError } = useGetSingleActivity(
     {
       activityId: pendingReport?.activityId ?? 0,
     },
@@ -76,19 +71,19 @@ const SecurityProfileDownloadAuditForm: FC<
   }
 
   useEffect(() => {
-    if (!getSingleActivityQueryResponse) {
+    if (!activity) {
       return;
     }
 
-    if (getSingleActivityQueryResponse.data.activity_status == "succeeded") {
+    if (activity.activity_status == "succeeded") {
       setStatus({
         type: "ready",
-        report_uri: getSingleActivityQueryResponse.data.result_text as string,
+        report_uri: activity.result_text as string,
       });
     } else {
       setStatus({ type: "pending" });
     }
-  }, [getSingleActivityQueryResponse]);
+  }, [activity]);
 
   const formik = useFormik<SecurityProfileDownloadAuditFormValues>({
     initialValues: {
@@ -171,7 +166,7 @@ const SecurityProfileDownloadAuditForm: FC<
     },
   });
 
-  if (isGettingActivity) {
+  if (isLoadingActivity) {
     return <LoadingState />;
   }
 
diff --git a/src/features/ubuntupro/components/DetachTokenModal/DetachTokenModal.tsx b/src/features/ubuntupro/components/DetachTokenModal/DetachTokenModal.tsx
index aedff1fb0..b40d24637 100644
--- a/src/features/ubuntupro/components/DetachTokenModal/DetachTokenModal.tsx
+++ b/src/features/ubuntupro/components/DetachTokenModal/DetachTokenModal.tsx
@@ -1,5 +1,5 @@
 import TextConfirmationModal from "@/components/form/TextConfirmationModal";
-import { useActivities } from "@/features/activities";
+import { useOpenActivityDetailsPanel } from "@/features/activities";
 import useDebug from "@/hooks/useDebug";
 import useNotify from "@/hooks/useNotify";
 import { pluralize, pluralizeWithCount } from "@/utils/_helpers";
@@ -24,7 +24,7 @@ const DetachTokenModal: FC<DetachTokenModalProps> = ({
 }) => {
   const { notify } = useNotify();
   const debug = useDebug();
-  const { openActivityDetails } = useActivities();
+  const openActivityDetails = useOpenActivityDetailsPanel();
   const { detachToken, isDetachingToken } = useDetachToken();
 
   const count = instanceCount ?? computerIds.length;
diff --git a/src/features/ubuntupro/components/TokenFormBase/TokenFormBase.tsx b/src/features/ubuntupro/components/TokenFormBase/TokenFormBase.tsx
index e9b681d27..0555dbc36 100644
--- a/src/features/ubuntupro/components/TokenFormBase/TokenFormBase.tsx
+++ b/src/features/ubuntupro/components/TokenFormBase/TokenFormBase.tsx
@@ -1,5 +1,5 @@
 import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
-import { useActivities } from "@/features/activities";
+import { useOpenActivityDetailsPanel } from "@/features/activities";
 import { useGetInstances } from "@/features/instances";
 import useDebug from "@/hooks/useDebug";
 import useNotify from "@/hooks/useNotify";
@@ -42,7 +42,7 @@ const TokenFormBase: FC<TokenFormBaseProps> = ({
   const debug = useDebug();
   const { notify } = useNotify();
   const { closeSidePanel } = useSidePanel();
-  const { openActivityDetails } = useActivities();
+  const openActivityDetails = useOpenActivityDetailsPanel();
   const { attachToken, isAttachingToken } = useAttachToken();
 
   const idListQuery = selectedInstances.map((i) => `id:${i.id}`).join(" OR ");
diff --git a/src/features/wsl/components/WslInstanceInstallForm/WslInstanceInstallForm.tsx b/src/features/wsl/components/WslInstanceInstallForm/WslInstanceInstallForm.tsx
index 52d680d1a..9a3630097 100644
--- a/src/features/wsl/components/WslInstanceInstallForm/WslInstanceInstallForm.tsx
+++ b/src/features/wsl/components/WslInstanceInstallForm/WslInstanceInstallForm.tsx
@@ -1,6 +1,6 @@
 import FileInput from "@/components/form/FileInput";
 import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
-import { useActivities } from "@/features/activities";
+import { useOpenActivityDetailsPanel } from "@/features/activities";
 import useDebug from "@/hooks/useDebug";
 import useNotify from "@/hooks/useNotify";
 import useSidePanel from "@/hooks/useSidePanel";
@@ -27,7 +27,7 @@ const WslInstanceInstallForm: FC = () => {
   const debug = useDebug();
   const { closeSidePanel } = useSidePanel();
   const { notify } = useNotify();
-  const { openActivityDetails } = useActivities();
+  const openActivityDetails = useOpenActivityDetailsPanel();
 
   const { isGettingWslInstanceTypes, wslInstanceTypes } =
     useGetWslInstanceTypes();
diff --git a/src/pages/dashboard/instances/[single]/tabs/info/InfoPanel/InfoPanel.tsx b/src/pages/dashboard/instances/[single]/tabs/info/InfoPanel/InfoPanel.tsx
index e211af953..463b908c3 100644
--- a/src/pages/dashboard/instances/[single]/tabs/info/InfoPanel/InfoPanel.tsx
+++ b/src/pages/dashboard/instances/[single]/tabs/info/InfoPanel/InfoPanel.tsx
@@ -5,7 +5,7 @@ import HeaderActions from "@/components/layout/HeaderActions";
 import InfoGrid from "@/components/layout/InfoGrid";
 import LoadingState from "@/components/layout/LoadingState";
 import { DISPLAY_DATE_TIME_FORMAT } from "@/constants";
-import { useActivities } from "@/features/activities";
+import { useOpenActivityDetailsPanel } from "@/features/activities";
 import {
   useDisassociateEmployeeFromInstance,
   useGetEmployee,
@@ -86,7 +86,7 @@ const InfoPanel: FC<InfoPanelProps> = ({ instance }) => {
   const { notify } = useNotify();
   const { setSidePanelContent } = useSidePanel();
 
-  const { openActivityDetails } = useActivities();
+  const openActivityDetails = useOpenActivityDetailsPanel();
   const { employee, isGettingEmployee } = useGetEmployee(
     { id: instance.employee_id ?? 0 },
     { enabled: !!instance.employee_id },
diff --git a/src/tests/mocks/activity.ts b/src/tests/mocks/activity.ts
index a42b4cc36..febaedefd 100644
--- a/src/tests/mocks/activity.ts
+++ b/src/tests/mocks/activity.ts
@@ -16,7 +16,6 @@ export const RELEASE_UPGRADE_ACTIVITY: Activity = {
     approvable: false,
     cancelable: true,
     reappliable: false,
-    revertable: false,
   },
   approval_time: null,
   delivery_time: null,
@@ -35,7 +34,6 @@ export const activities = [
       approvable: true,
       cancelable: true,
       reappliable: true,
-      revertable: true,
     },
     creation_time: "2024-04-15T15:47:07Z",
     creator: {
@@ -66,7 +64,6 @@ export const activities = [
       approvable: true,
       cancelable: true,
       reappliable: true,
-      revertable: true,
     },
     creation_time: "2024-04-15T15:46:50Z",
     creator: {
@@ -97,7 +94,6 @@ export const activities = [
       approvable: true,
       cancelable: true,
       reappliable: true,
-      revertable: true,
     },
     creation_time: "2024-04-15T14:42:34Z",
     creator: {
@@ -128,7 +124,6 @@ export const activities = [
       approvable: true,
       cancelable: true,
       reappliable: true,
-      revertable: true,
     },
     creation_time: "2024-03-22T12:23:39Z",
     creator: {
@@ -159,7 +154,6 @@ export const activities = [
       approvable: true,
       cancelable: true,
       reappliable: true,
-      revertable: true,
     },
     creation_time: "2024-03-22T12:16:24Z",
     creator: {
@@ -190,7 +184,6 @@ export const activities = [
       approvable: true,
       cancelable: true,
       reappliable: true,
-      revertable: true,
     },
     creation_time: "2024-03-22T08:47:54Z",
     creator: {
@@ -221,7 +214,6 @@ export const activities = [
       approvable: true,
       cancelable: true,
       reappliable: true,
-      revertable: true,
     },
     creation_time: "2024-03-22T08:47:22Z",
     creator: {
@@ -252,7 +244,6 @@ export const activities = [
       approvable: true,
       cancelable: true,
       reappliable: true,
-      revertable: true,
     },
     creation_time: "2024-03-22T08:47:22Z",
     creator: {
diff --git a/src/tests/server/handlers/activity.ts b/src/tests/server/handlers/activity.ts
index 541bf1a76..b473b0676 100644
--- a/src/tests/server/handlers/activity.ts
+++ b/src/tests/server/handlers/activity.ts
@@ -174,19 +174,6 @@ export default [
     ]);
   }),
 
-  http.post<never, { activity_ids: number[] }, number[]>(
-    `${API_URL}activities/revert`,
-    async () => {
-      const endpointStatus = getEndpointStatus();
-
-      if (endpointStatus.status === "error") {
-        throw getEndpointStatusApiError();
-      }
-
-      return HttpResponse.json([activities[0].id, activities[1].id]);
-    },
-  ),
-
   http.post<never, { activity_ids: number[] }, number[]>(
     `${API_URL}activities/reapply`,
     async () => {

From ab5272c76cc4c2fa4d37bcefa620d59066c074e0 Mon Sep 17 00:00:00 2001
From: Ethan Shaw <ethan.shaw@canonical.com>
Date: Fri, 27 Mar 2026 18:50:35 +0000
Subject: [PATCH 24/42] add navigation

Rebase deb-archive with changes from main.
---
 .../AttachmentFile/AttachmentFile.test.tsx    | 92 +------------------
 .../local-repositories/constants.ts           |  2 -
 .../dashboard/Navigation/constants.ts         |  3 +-
 3 files changed, 3 insertions(+), 94 deletions(-)
 delete mode 100644 src/pages/dashboard/repositories/local-repositories/constants.ts

diff --git a/src/features/scripts/components/AttachmentFile/AttachmentFile.test.tsx b/src/features/scripts/components/AttachmentFile/AttachmentFile.test.tsx
index 453b3a5aa..e1f9e9b3b 100644
--- a/src/features/scripts/components/AttachmentFile/AttachmentFile.test.tsx
+++ b/src/features/scripts/components/AttachmentFile/AttachmentFile.test.tsx
@@ -1,22 +1,9 @@
 import { renderWithProviders } from "@/tests/render";
 import { screen } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
 import type { ComponentProps } from "react";
-import { afterEach, describe, expect, it, vi } from "vitest";
+import { describe, it } from "vitest";
 import AttachmentFile from "./AttachmentFile";
 
-const createObjectURLMock = vi.fn((_object: Blob | MediaSource) => "blob:test");
-const revokeObjectURLMock = vi.fn();
-
-Object.defineProperty(URL, "createObjectURL", {
-  writable: true,
-  value: createObjectURLMock,
-});
-Object.defineProperty(URL, "revokeObjectURL", {
-  writable: true,
-  value: revokeObjectURLMock,
-});
-
 const baseProps: ComponentProps<typeof AttachmentFile> = {
   attachmentId: 1,
   filename: "test.txt",
@@ -34,11 +21,6 @@ const propsWithInitialAttachmentDelete: ComponentProps<typeof AttachmentFile> =
   };
 
 describe("AttachmentFile", () => {
-  afterEach(() => {
-    vi.clearAllMocks();
-    vi.restoreAllMocks();
-  });
-
   it("should display attachment file with script id prop", async () => {
     renderWithProviders(<AttachmentFile {...propsWithScriptId} />);
 
@@ -72,76 +54,4 @@ describe("AttachmentFile", () => {
     });
     expect(deleteButton).toBeInTheDocument();
   });
-
-  it("calls delete callback when remove button is clicked", async () => {
-    const user = userEvent.setup();
-
-    renderWithProviders(
-      <AttachmentFile {...propsWithInitialAttachmentDelete} />,
-    );
-
-    await user.click(
-      screen.getByRole("button", {
-        name: `Remove ${propsWithInitialAttachmentDelete.filename} attachment`,
-      }),
-    );
-
-    expect(
-      propsWithInitialAttachmentDelete.onInitialAttachmentDelete,
-    ).toHaveBeenCalledTimes(1);
-  });
-
-  it("downloads attachment file when download button is clicked", async () => {
-    const user = userEvent.setup();
-    const anchorClickSpy = vi
-      .spyOn(HTMLAnchorElement.prototype, "click")
-      .mockImplementation(() => undefined);
-    const createObjectUrlSpy = vi
-      .spyOn(URL, "createObjectURL")
-      .mockReturnValue("blob:attachment");
-    const revokeObjectUrlSpy = vi.spyOn(URL, "revokeObjectURL");
-
-    renderWithProviders(<AttachmentFile {...propsWithScriptId} />);
-
-    await user.click(
-      screen.getByRole("button", {
-        name: `Download ${propsWithScriptId.filename}`,
-      }),
-    );
-
-    expect(createObjectUrlSpy).toHaveBeenCalledTimes(1);
-
-    const [downloadedAttachmentBlob] = createObjectUrlSpy.mock.calls[0] ?? [];
-    expect(downloadedAttachmentBlob).toBeInstanceOf(Blob);
-    expect(await (downloadedAttachmentBlob as Blob).text()).toContain(
-      "attachment",
-    );
-
-    expect(anchorClickSpy).toHaveBeenCalledTimes(1);
-    expect(revokeObjectUrlSpy).toHaveBeenCalledWith("blob:attachment");
-  });
-
-  it("does not try to download when attachment data is missing", async () => {
-    const user = userEvent.setup();
-    const createObjectUrlSpy = vi.spyOn(URL, "createObjectURL");
-    const anchorClickSpy = vi
-      .spyOn(HTMLAnchorElement.prototype, "click")
-      .mockImplementation(() => undefined);
-    const missingDataProps: ComponentProps<typeof AttachmentFile> = {
-      attachmentId: 999,
-      filename: "missing.txt",
-      scriptId: 999,
-    };
-
-    renderWithProviders(<AttachmentFile {...missingDataProps} />);
-
-    await user.click(
-      screen.getByRole("button", {
-        name: `Download ${missingDataProps.filename}`,
-      }),
-    );
-
-    expect(createObjectUrlSpy).not.toHaveBeenCalled();
-    expect(anchorClickSpy).not.toHaveBeenCalled();
-  });
 });
diff --git a/src/pages/dashboard/repositories/local-repositories/constants.ts b/src/pages/dashboard/repositories/local-repositories/constants.ts
deleted file mode 100644
index 5b5d7c09f..000000000
--- a/src/pages/dashboard/repositories/local-repositories/constants.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export const GPG_KEYS_DOCS_URL =
-  "https://ubuntu.com/landscape/docs/repositories";
diff --git a/src/templates/dashboard/Navigation/constants.ts b/src/templates/dashboard/Navigation/constants.ts
index 3ae116d87..3717acffa 100644
--- a/src/templates/dashboard/Navigation/constants.ts
+++ b/src/templates/dashboard/Navigation/constants.ts
@@ -23,6 +23,7 @@ export const REPOSITORY_SUBMENU: MenuItem[] = [
   {
     label: "Local repositories",
     path: ROUTES.repositories.localRepositories(),
+    env: "selfHosted"
   },
   { label: "Publications", path: ROUTES.repositories.publications(), env: "selfHosted" },
   {
@@ -80,7 +81,7 @@ export const MENU_ITEMS: MenuItem[] = [
     icon: "fork",
     items: REPOSITORY_SUBMENU,
     secondary: true,
-    env: "selfHosted"
+    env: "selfHosted",
   },
   {
     label: "Org. settings",

From 3ac9d73265ce848cd33063489d6159df30e04802 Mon Sep 17 00:00:00 2001
From: Marc Bucchieri <marc.bucchieri@canonical.com>
Date: Tue, 21 Apr 2026 12:47:51 -0700
Subject: [PATCH 25/42] Remove unused RepositoryPage and test, remove pages
 that no longer exist from testing elements

---
 src/routes/elements.test.tsx | 6 ------
 1 file changed, 6 deletions(-)

diff --git a/src/routes/elements.test.tsx b/src/routes/elements.test.tsx
index 2545d3c54..8775ec5e2 100644
--- a/src/routes/elements.test.tsx
+++ b/src/routes/elements.test.tsx
@@ -57,10 +57,7 @@ describe("route elements", () => {
       Pages.AlertNotificationsPage,
       Pages.InstancesPage,
       Pages.SingleInstance,
-      Pages.DistributionsPage,
       Pages.RepositoryProfilesPage,
-      Pages.GPGKeysPage,
-      Pages.APTSourcesPage,
       Pages.PackageProfilesPage,
       Pages.RemovalProfilesPage,
       Pages.UpgradeProfilesPage,
@@ -103,10 +100,7 @@ describe("route elements", () => {
       Pages.AlertNotificationsPage,
       Pages.InstancesPage,
       Pages.SingleInstance,
-      Pages.DistributionsPage,
       Pages.RepositoryProfilesPage,
-      Pages.GPGKeysPage,
-      Pages.APTSourcesPage,
       Pages.PackageProfilesPage,
       Pages.RemovalProfilesPage,
       Pages.UpgradeProfilesPage,

From aaa2ee821608ca5f3d6a19feffd490ffbeea7bec Mon Sep 17 00:00:00 2001
From: Rubin Aga <66167934+rubinaga@users.noreply.github.com>
Date: Fri, 24 Apr 2026 16:33:12 +0200
Subject: [PATCH 26/42] feat: add publications page (#551)

## Summary

Summarize the changes made in this pull request. Include any relevant
context or background information that would help reviewers understand
the purpose and scope of the changes.

## Release Impact

According to the [Landscape Server Release
Cycle](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `dev` / `main` (Beta)
- **Version Impact**:
  - [ ] Patch (Fix)
  - [ ] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [ ] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [ ] **UI Verified**: I have verified the changes locally.
- [ ] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.
---
 .env.local.example                            |   4 +-
 .env.production                               |   1 +
 src/api/fetchDebArchive.tsx                   |  69 +++
 src/components/layout/Blocks/Item/Item.tsx    |  17 +-
 .../layout/InfoGrid/InfoGrid.module.scss      |   4 +
 src/components/layout/InfoGrid/InfoGrid.tsx   |   7 +-
 src/constants.ts                              |   1 +
 src/features/publications/api/index.ts        |  11 +
 .../publications/api/useBatchGetLocals.ts     |  36 ++
 .../publications/api/useBatchGetMirrors.ts    |  36 ++
 .../api/useBatchGetPublicationTargets.ts      |  37 ++
 .../publications/api/useCreatePublication.ts  |  34 ++
 .../publications/api/useDeletePublication.ts  |  30 ++
 src/features/publications/api/useGetLocals.ts |  28 ++
 .../publications/api/useGetMirrors.ts         |  33 ++
 .../publications/api/useGetPublication.ts     |  25 ++
 .../api/useGetPublicationTargets.ts           |  40 ++
 .../publications/api/useGetPublications.ts    | 107 +++++
 .../publications/api/usePublishPublication.ts |  33 ++
 .../AddPublicationButton.test.tsx             |  27 ++
 .../AddPublicationButton.tsx                  |  33 ++
 .../components/AddPublicationButton/index.ts  |   1 +
 .../AddPublicationForm.module.scss            |  30 ++
 .../AddPublicationForm.test.tsx               | 222 ++++++++++
 .../AddPublicationForm/AddPublicationForm.tsx | 406 ++++++++++++++++++
 .../AddPublicationForm/constants.ts           |  40 ++
 .../components/AddPublicationForm/helpers.ts  | 117 +++++
 .../components/AddPublicationForm/index.ts    |   1 +
 .../components/AddPublicationForm/types.ts    |  24 ++
 .../NoPublicationsEmptyState.test.tsx         |  36 ++
 .../NoPublicationsEmptyState.tsx              |  29 ++
 .../NoPublicationsEmptyState/constants.ts     |   2 +
 .../NoPublicationsEmptyState/index.ts         |   1 +
 .../NoPublicationTargetEmptyState.test.tsx    |  25 ++
 .../NoPublicationTargetEmptyState.tsx         |  39 ++
 .../constants.ts                              |   2 +
 .../NoPublicationsTargetEmptyState/index.ts   |   1 +
 .../PublicationDetails.test.tsx               |  89 ++++
 .../PublicationDetails/PublicationDetails.tsx | 149 +++++++
 .../components/PublicationDetails/index.ts    |   1 +
 .../PublicationDetailsSidePanel.tsx           |  66 +++
 .../PublicationDetailsSidePanel/index.ts      |   1 +
 .../PublicationsContainer.test.tsx            |  40 ++
 .../PublicationsContainer.tsx                 |  99 +++++
 .../components/PublicationsContainer/index.ts |   1 +
 .../PublicationsHeader.test.tsx               |  12 +
 .../PublicationsHeader/PublicationsHeader.tsx |  17 +
 .../components/PublicationsHeader/index.ts    |   1 +
 .../PublicationsList.test.tsx                 | 104 +++++
 .../PublicationsList/PublicationsList.tsx     |  96 +++++
 .../components/PublicationsList/index.ts      |   1 +
 .../PublicationsListActions.test.tsx          |  70 +++
 .../PublicationsListActions.tsx               |  82 ++++
 .../PublicationsListActions/index.ts          |   1 +
 .../RemovePublicationModal.test.tsx           |  68 +++
 .../RemovePublicationModal.tsx                |  65 +++
 .../RemovePublicationModal/index.ts           |   1 +
 .../RepublishPublicationModal.test.tsx        |  70 +++
 .../RepublishPublicationModal.tsx             |  66 +++
 .../RepublishPublicationModal/index.ts        |   1 +
 src/features/publications/helpers.ts          |  21 +
 src/features/publications/index.ts            |  14 +
 .../publications/types/Publication.ts         | 134 ++++++
 src/features/publications/types/index.ts      |  15 +
 src/hooks/useFetchDebArchive.ts               |  14 +
 src/libs/pageParamsManager/constants.ts       |   5 +
 src/libs/pageParamsManager/types.ts           |   1 +
 src/pages/dashboard/repositories/index.ts     |   2 +-
 .../LocalRepositoriesPage.tsx                 |   4 +-
 ...ionsPage.test.tsx => MirrorsPage.test.tsx} |  14 +-
 .../publications/PublicationsPage.tsx         |  95 ++--
 src/providers/AppProviders.tsx                |   5 +-
 src/routes/DashboardRoutes.tsx                |  43 +-
 .../dashboard/DashboardTemplate.module.scss   |   7 +
 src/templates/dashboard/DashboardTemplate.tsx |   3 +-
 src/tests/browser.ts                          |  13 +-
 src/tests/mocks/publications.ts               |  93 ++++
 src/tests/server/handlers/features.ts         |  13 +-
 src/tests/server/handlers/index.ts            |   2 +
 src/tests/server/handlers/publications.ts     | 398 +++++++++++++++++
 src/vite-env.d.ts                             |   1 +
 vite.config.ts                                |   6 +
 82 files changed, 3486 insertions(+), 107 deletions(-)
 create mode 100644 src/api/fetchDebArchive.tsx
 create mode 100644 src/features/publications/api/index.ts
 create mode 100644 src/features/publications/api/useBatchGetLocals.ts
 create mode 100644 src/features/publications/api/useBatchGetMirrors.ts
 create mode 100644 src/features/publications/api/useBatchGetPublicationTargets.ts
 create mode 100644 src/features/publications/api/useCreatePublication.ts
 create mode 100644 src/features/publications/api/useDeletePublication.ts
 create mode 100644 src/features/publications/api/useGetLocals.ts
 create mode 100644 src/features/publications/api/useGetMirrors.ts
 create mode 100644 src/features/publications/api/useGetPublication.ts
 create mode 100644 src/features/publications/api/useGetPublicationTargets.ts
 create mode 100644 src/features/publications/api/useGetPublications.ts
 create mode 100644 src/features/publications/api/usePublishPublication.ts
 create mode 100644 src/features/publications/components/AddPublicationButton/AddPublicationButton.test.tsx
 create mode 100644 src/features/publications/components/AddPublicationButton/AddPublicationButton.tsx
 create mode 100644 src/features/publications/components/AddPublicationButton/index.ts
 create mode 100644 src/features/publications/components/AddPublicationForm/AddPublicationForm.module.scss
 create mode 100644 src/features/publications/components/AddPublicationForm/AddPublicationForm.test.tsx
 create mode 100644 src/features/publications/components/AddPublicationForm/AddPublicationForm.tsx
 create mode 100644 src/features/publications/components/AddPublicationForm/constants.ts
 create mode 100644 src/features/publications/components/AddPublicationForm/helpers.ts
 create mode 100644 src/features/publications/components/AddPublicationForm/index.ts
 create mode 100644 src/features/publications/components/AddPublicationForm/types.ts
 create mode 100644 src/features/publications/components/NoPublicationsEmptyState/NoPublicationsEmptyState.test.tsx
 create mode 100644 src/features/publications/components/NoPublicationsEmptyState/NoPublicationsEmptyState.tsx
 create mode 100644 src/features/publications/components/NoPublicationsEmptyState/constants.ts
 create mode 100644 src/features/publications/components/NoPublicationsEmptyState/index.ts
 create mode 100644 src/features/publications/components/NoPublicationsTargetEmptyState/NoPublicationTargetEmptyState.test.tsx
 create mode 100644 src/features/publications/components/NoPublicationsTargetEmptyState/NoPublicationTargetEmptyState.tsx
 create mode 100644 src/features/publications/components/NoPublicationsTargetEmptyState/constants.ts
 create mode 100644 src/features/publications/components/NoPublicationsTargetEmptyState/index.ts
 create mode 100644 src/features/publications/components/PublicationDetails/PublicationDetails.test.tsx
 create mode 100644 src/features/publications/components/PublicationDetails/PublicationDetails.tsx
 create mode 100644 src/features/publications/components/PublicationDetails/index.ts
 create mode 100644 src/features/publications/components/PublicationDetailsSidePanel/PublicationDetailsSidePanel.tsx
 create mode 100644 src/features/publications/components/PublicationDetailsSidePanel/index.ts
 create mode 100644 src/features/publications/components/PublicationsContainer/PublicationsContainer.test.tsx
 create mode 100644 src/features/publications/components/PublicationsContainer/PublicationsContainer.tsx
 create mode 100644 src/features/publications/components/PublicationsContainer/index.ts
 create mode 100644 src/features/publications/components/PublicationsHeader/PublicationsHeader.test.tsx
 create mode 100644 src/features/publications/components/PublicationsHeader/PublicationsHeader.tsx
 create mode 100644 src/features/publications/components/PublicationsHeader/index.ts
 create mode 100644 src/features/publications/components/PublicationsList/PublicationsList.test.tsx
 create mode 100644 src/features/publications/components/PublicationsList/PublicationsList.tsx
 create mode 100644 src/features/publications/components/PublicationsList/index.ts
 create mode 100644 src/features/publications/components/PublicationsListActions/PublicationsListActions.test.tsx
 create mode 100644 src/features/publications/components/PublicationsListActions/PublicationsListActions.tsx
 create mode 100644 src/features/publications/components/PublicationsListActions/index.ts
 create mode 100644 src/features/publications/components/RemovePublicationModal/RemovePublicationModal.test.tsx
 create mode 100644 src/features/publications/components/RemovePublicationModal/RemovePublicationModal.tsx
 create mode 100644 src/features/publications/components/RemovePublicationModal/index.ts
 create mode 100644 src/features/publications/components/RepublishPublicationModal/RepublishPublicationModal.test.tsx
 create mode 100644 src/features/publications/components/RepublishPublicationModal/RepublishPublicationModal.tsx
 create mode 100644 src/features/publications/components/RepublishPublicationModal/index.ts
 create mode 100644 src/features/publications/helpers.ts
 create mode 100644 src/features/publications/index.ts
 create mode 100644 src/features/publications/types/Publication.ts
 create mode 100644 src/features/publications/types/index.ts
 create mode 100644 src/hooks/useFetchDebArchive.ts
 rename src/pages/dashboard/repositories/mirrors/{DistributionsPage.test.tsx => MirrorsPage.test.tsx} (89%)
 create mode 100644 src/tests/mocks/publications.ts
 create mode 100644 src/tests/server/handlers/publications.ts

diff --git a/.env.local.example b/.env.local.example
index fab5e056f..11da589c4 100644
--- a/.env.local.example
+++ b/.env.local.example
@@ -1,9 +1,11 @@
 VITE_API_URL=
 VITE_API_URL_OLD=
+VITE_API_URL_DEB_ARCHIVE=
 VITE_ROOT_PATH=
 VITE_SELF_HOSTED_ENV=
 VITE_REPORT_VIEW_ENABLED=
 VITE_DETAILED_UPGRADES_VIEW_ENABLED=
 VITE_MSW_ENABLED=
 VITE_MSW_ENDPOINTS_TO_INTERCEPT=
-VITE_API_PROXY_TARGET=
\ No newline at end of file
+VITE_API_PROXY_TARGET=
+VITE_DEBARCHIVE_PROXY_TARGET=
\ No newline at end of file
diff --git a/.env.production b/.env.production
index 670d34930..1c9c979c5 100644
--- a/.env.production
+++ b/.env.production
@@ -1,5 +1,6 @@
 VITE_API_URL=/api/v2/
 VITE_API_URL_OLD=/api/
+VITE_API_URL_DEB_ARCHIVE=/debarchive/v1/
 VITE_ROOT_PATH=/new_dashboard/
 VITE_REPORT_VIEW_ENABLED=false
 VITE_DETAILED_UPGRADES_VIEW_ENABLED=false
diff --git a/src/api/fetchDebArchive.tsx b/src/api/fetchDebArchive.tsx
new file mode 100644
index 000000000..aa98a384c
--- /dev/null
+++ b/src/api/fetchDebArchive.tsx
@@ -0,0 +1,69 @@
+import type { FC, ReactNode } from "react";
+import React, {
+  useContext,
+  useEffectEvent,
+  useLayoutEffect,
+  useMemo,
+} from "react";
+import type { AxiosInstance } from "axios";
+import axios from "axios";
+import { API_URL_DEB_ARCHIVE } from "@/constants";
+import { AuthContext } from "@/context/auth";
+import {
+  setupRequestInterceptor,
+  setupResponseInterceptor,
+} from "@/api/interceptors";
+
+export const FetchDebArchiveContext = React.createContext<AxiosInstance | null>(
+  null,
+);
+
+interface FetchDebArchiveProviderProps {
+  readonly children: ReactNode;
+}
+
+const FetchDebArchiveProvider: FC<FetchDebArchiveProviderProps> = ({
+  children,
+}) => {
+  const { user, logout } = useContext(AuthContext);
+
+  const authFetchDebArchive = useMemo(() => {
+    const debArchiveBaseUrl = API_URL_DEB_ARCHIVE;
+
+    return axios.create({ baseURL: debArchiveBaseUrl });
+  }, []);
+
+  const getLatestToken = useEffectEvent(() => {
+    return user?.token;
+  });
+
+  const onLogout = useEffectEvent(() => {
+    logout();
+  });
+
+  useLayoutEffect(() => {
+    const cleanupRequest = setupRequestInterceptor(
+      authFetchDebArchive,
+      getLatestToken,
+      false,
+    );
+
+    const cleanupResponse = setupResponseInterceptor(
+      authFetchDebArchive,
+      () => onLogout,
+    );
+
+    return () => {
+      cleanupRequest();
+      cleanupResponse();
+    };
+  }, [authFetchDebArchive]);
+
+  return (
+    <FetchDebArchiveContext.Provider value={authFetchDebArchive}>
+      {children}
+    </FetchDebArchiveContext.Provider>
+  );
+};
+
+export default FetchDebArchiveProvider;
diff --git a/src/components/layout/Blocks/Item/Item.tsx b/src/components/layout/Blocks/Item/Item.tsx
index 4fd4f0fe6..a1d798a30 100644
--- a/src/components/layout/Blocks/Item/Item.tsx
+++ b/src/components/layout/Blocks/Item/Item.tsx
@@ -5,12 +5,23 @@ import classes from "./Item.module.scss";
 export interface ItemProps {
   readonly children: ReactNode;
   readonly title?: string;
+  readonly titleClassName?: string;
+  readonly containerClassName?: string;
 }
 
-const Item: FC<ItemProps> = ({ children, title }: ItemProps) => (
-  <section className={classes.item}>
+const Item: FC<ItemProps> = ({
+  children,
+  title,
+  titleClassName,
+  containerClassName,
+}: ItemProps) => (
+  <section className={classNames(classes.item, containerClassName)}>
     {title && (
-      <h4 className={classNames(classes.heading, "p-heading--5")}>{title}</h4>
+      <h4
+        className={classNames(classes.heading, "p-heading--5", titleClassName)}
+      >
+        {title}
+      </h4>
     )}
     {children}
   </section>
diff --git a/src/components/layout/InfoGrid/InfoGrid.module.scss b/src/components/layout/InfoGrid/InfoGrid.module.scss
index 167220fe7..f4b75b0f9 100644
--- a/src/components/layout/InfoGrid/InfoGrid.module.scss
+++ b/src/components/layout/InfoGrid/InfoGrid.module.scss
@@ -25,3 +25,7 @@
     min-width: 0;
   }
 }
+
+.denseGrid {
+  gap: $sph--x-large;
+}
diff --git a/src/components/layout/InfoGrid/InfoGrid.tsx b/src/components/layout/InfoGrid/InfoGrid.tsx
index 220a51e27..ee9e04fca 100644
--- a/src/components/layout/InfoGrid/InfoGrid.tsx
+++ b/src/components/layout/InfoGrid/InfoGrid.tsx
@@ -7,11 +7,13 @@ import Item from "./Item";
 export interface InfoGridProps extends HTMLAttributes<HTMLDivElement> {
   readonly children: ReactNode;
   readonly spaced?: boolean;
+  readonly dense?: boolean;
 }
 
 const InfoGrid: FC<InfoGridProps> & { Item: FC<ItemProps> } = ({
   className,
   spaced,
+  dense,
   ...props
 }: InfoGridProps) => (
   <div
@@ -21,7 +23,10 @@ const InfoGrid: FC<InfoGridProps> & { Item: FC<ItemProps> } = ({
       className,
     )}
   >
-    <div className={classes.grid} {...props} />
+    <div
+      className={classNames(classes.grid, { [classes.denseGrid]: dense })}
+      {...props}
+    />
   </div>
 );
 
diff --git a/src/constants.ts b/src/constants.ts
index aacc3a981..dd66f4cf2 100644
--- a/src/constants.ts
+++ b/src/constants.ts
@@ -4,6 +4,7 @@ export const IS_DEV_ENV = import.meta.env.DEV;
 export const IS_SELF_HOSTED_ENV = import.meta.env.VITE_SELF_HOSTED_ENV;
 export const API_URL = import.meta.env.VITE_API_URL;
 export const API_URL_OLD = import.meta.env.VITE_API_URL_OLD;
+export const API_URL_DEB_ARCHIVE = import.meta.env.VITE_API_URL_DEB_ARCHIVE;
 export const ROOT_PATH = import.meta.env.VITE_ROOT_PATH;
 export const API_VERSION = "2011-08-01";
 export const APP_TITLE = import.meta.env.VITE_APP_TITLE;
diff --git a/src/features/publications/api/index.ts b/src/features/publications/api/index.ts
new file mode 100644
index 000000000..43b004620
--- /dev/null
+++ b/src/features/publications/api/index.ts
@@ -0,0 +1,11 @@
+export * from "./useBatchGetLocals";
+export * from "./useBatchGetMirrors";
+export * from "./useBatchGetPublicationTargets";
+export * from "./useGetPublication";
+export * from "./useGetPublications";
+export * from "./useGetPublicationTargets";
+export * from "./usePublishPublication";
+export * from "./useCreatePublication";
+export * from "./useDeletePublication";
+export * from "./useGetMirrors";
+export * from "./useGetLocals";
diff --git a/src/features/publications/api/useBatchGetLocals.ts b/src/features/publications/api/useBatchGetLocals.ts
new file mode 100644
index 000000000..1aa775990
--- /dev/null
+++ b/src/features/publications/api/useBatchGetLocals.ts
@@ -0,0 +1,36 @@
+import type { BatchGetLocalsResponse } from "../types";
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError } from "axios";
+
+export const useBatchGetLocals = (names: string[]) => {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  const { data, isLoading } = useQuery<
+    Record<string, string>,
+    AxiosError<ApiError>
+  >({
+    queryKey: ["locals", "batch", names],
+    queryFn: async () => {
+      const response = await authFetchDebArchive.post<BatchGetLocalsResponse>(
+        "locals:batchGet",
+        { names: names },
+      );
+
+      const lookup: Record<string, string> = {};
+      for (const local of response.data.locals ?? []) {
+        if (local.name) {
+          lookup[local.name] = local.displayName;
+        }
+      }
+      return lookup;
+    },
+    enabled: names.length > 0,
+  });
+
+  return {
+    localDisplayNames: data ?? {},
+    isLoadingLocalDisplayNames: isLoading,
+  };
+};
diff --git a/src/features/publications/api/useBatchGetMirrors.ts b/src/features/publications/api/useBatchGetMirrors.ts
new file mode 100644
index 000000000..2a78cdf2d
--- /dev/null
+++ b/src/features/publications/api/useBatchGetMirrors.ts
@@ -0,0 +1,36 @@
+import type { BatchGetMirrorsResponse } from "../types";
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError } from "axios";
+
+export const useBatchGetMirrors = (names: string[]) => {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  const { data, isLoading } = useQuery<
+    Record<string, string>,
+    AxiosError<ApiError>
+  >({
+    queryKey: ["mirrors", "batch", names],
+    queryFn: async () => {
+      const response = await authFetchDebArchive.post<BatchGetMirrorsResponse>(
+        "mirrors:batchGet",
+        { names },
+      );
+
+      const lookup: Record<string, string> = {};
+      for (const mirror of response.data.mirrors ?? []) {
+        if (mirror.name) {
+          lookup[mirror.name] = mirror.displayName;
+        }
+      }
+      return lookup;
+    },
+    enabled: names.length > 0,
+  });
+
+  return {
+    mirrorDisplayNames: data ?? {},
+    isLoadingMirrorDisplayNames: isLoading,
+  };
+};
diff --git a/src/features/publications/api/useBatchGetPublicationTargets.ts b/src/features/publications/api/useBatchGetPublicationTargets.ts
new file mode 100644
index 000000000..cea055b61
--- /dev/null
+++ b/src/features/publications/api/useBatchGetPublicationTargets.ts
@@ -0,0 +1,37 @@
+import type { BatchGetPublicationTargetsResponse } from "../types";
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError } from "axios";
+
+export const useBatchGetPublicationTargets = (names: string[]) => {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  const { data, isLoading } = useQuery<
+    Record<string, string>,
+    AxiosError<ApiError>
+  >({
+    queryKey: ["publicationTargets", "batch", names],
+    queryFn: async () => {
+      const response =
+        await authFetchDebArchive.post<BatchGetPublicationTargetsResponse>(
+          "publicationTargets:batchGet",
+          { names },
+        );
+
+      const lookup: Record<string, string> = {};
+      for (const target of response.data.publicationTargets ?? []) {
+        if (target.name) {
+          lookup[target.name] = target.displayName;
+        }
+      }
+      return lookup;
+    },
+    enabled: names.length > 0,
+  });
+
+  return {
+    publicationTargetDisplayNames: data ?? {},
+    isLoadingPublicationTargetDisplayNames: isLoading,
+  };
+};
diff --git a/src/features/publications/api/useCreatePublication.ts b/src/features/publications/api/useCreatePublication.ts
new file mode 100644
index 000000000..9e9290406
--- /dev/null
+++ b/src/features/publications/api/useCreatePublication.ts
@@ -0,0 +1,34 @@
+import type { Publication, PublicationWritable } from "../types";
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+
+interface CreatePublicationParams {
+  body: PublicationWritable;
+  publicationId?: string;
+}
+
+export const useCreatePublication = () => {
+  const authFetchDebArchive = useFetchDebArchive();
+  const queryClient = useQueryClient();
+
+  const { mutateAsync, isPending } = useMutation<
+    AxiosResponse<Publication>,
+    AxiosError<ApiError>,
+    CreatePublicationParams
+  >({
+    mutationKey: ["publications", "create"],
+    mutationFn: async ({ body, publicationId }) =>
+      authFetchDebArchive.post("publications", body, {
+        params: { publicationId },
+      }),
+    onSuccess: async () =>
+      queryClient.invalidateQueries({ queryKey: ["publications"] }),
+  });
+
+  return {
+    createPublication: mutateAsync,
+    isCreatingPublication: isPending,
+  };
+};
diff --git a/src/features/publications/api/useDeletePublication.ts b/src/features/publications/api/useDeletePublication.ts
new file mode 100644
index 000000000..601b06e3c
--- /dev/null
+++ b/src/features/publications/api/useDeletePublication.ts
@@ -0,0 +1,30 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+
+interface DeletePublicationParams {
+  publicationName: string;
+}
+
+export const useDeletePublication = () => {
+  const authFetchDebArchive = useFetchDebArchive();
+  const queryClient = useQueryClient();
+
+  const { mutateAsync, isPending } = useMutation<
+    AxiosResponse<Record<string, unknown>>,
+    AxiosError<ApiError>,
+    DeletePublicationParams
+  >({
+    mutationKey: ["publications", "delete"],
+    mutationFn: async ({ publicationName }) =>
+      authFetchDebArchive.delete(publicationName),
+    onSuccess: async () =>
+      queryClient.invalidateQueries({ queryKey: ["publications"] }),
+  });
+
+  return {
+    deletePublication: mutateAsync,
+    isRemovingPublication: isPending,
+  };
+};
diff --git a/src/features/publications/api/useGetLocals.ts b/src/features/publications/api/useGetLocals.ts
new file mode 100644
index 000000000..5b856247c
--- /dev/null
+++ b/src/features/publications/api/useGetLocals.ts
@@ -0,0 +1,28 @@
+import type { Local, ListLocalsResponse } from "../types";
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError } from "axios";
+
+const FETCH_PAGE_SIZE = 1000;
+
+export const useGetLocals = () => {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  const { data, isLoading } = useQuery<Local[], AxiosError<ApiError>>({
+    queryKey: ["locals", "all"],
+    queryFn: async () => {
+      const response = await authFetchDebArchive.get<ListLocalsResponse>(
+        "locals",
+        { params: { pageSize: FETCH_PAGE_SIZE } },
+      );
+
+      return response.data.locals ?? [];
+    },
+  });
+
+  return {
+    locals: data ?? [],
+    isGettingLocals: isLoading,
+  };
+};
diff --git a/src/features/publications/api/useGetMirrors.ts b/src/features/publications/api/useGetMirrors.ts
new file mode 100644
index 000000000..73a085bb9
--- /dev/null
+++ b/src/features/publications/api/useGetMirrors.ts
@@ -0,0 +1,33 @@
+import type { ListMirrorsResponse, Mirror } from "../types";
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError } from "axios";
+
+interface UseGetMirrorsReturnType {
+  mirrors: Mirror[];
+  isGettingMirrors: boolean;
+}
+
+const FETCH_PAGE_SIZE = 1000;
+// TODO: remove
+export const useGetMirrors = (): UseGetMirrorsReturnType => {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  const { data, isLoading } = useQuery<Mirror[], AxiosError<ApiError>>({
+    queryKey: ["mirrors", "all"],
+    queryFn: async () => {
+      const response = await authFetchDebArchive.get<ListMirrorsResponse>(
+        "mirrors",
+        { params: { pageSize: FETCH_PAGE_SIZE } },
+      );
+
+      return response.data.mirrors ?? [];
+    },
+  });
+
+  return {
+    mirrors: data ?? [],
+    isGettingMirrors: isLoading,
+  };
+};
diff --git a/src/features/publications/api/useGetPublication.ts b/src/features/publications/api/useGetPublication.ts
new file mode 100644
index 000000000..0420fdd9d
--- /dev/null
+++ b/src/features/publications/api/useGetPublication.ts
@@ -0,0 +1,25 @@
+import type { Publication } from "../types";
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError } from "axios";
+
+export const useGetPublication = (id: string) => {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  const { data, isLoading } = useQuery<Publication, AxiosError<ApiError>>({
+    queryKey: ["publications", id],
+    queryFn: async () => {
+      const response = await authFetchDebArchive.get<Publication>(
+        `publications/${id}`,
+      );
+      return response.data;
+    },
+    enabled: !!id,
+  });
+
+  return {
+    publication: data,
+    isGettingPublication: isLoading,
+  };
+};
diff --git a/src/features/publications/api/useGetPublicationTargets.ts b/src/features/publications/api/useGetPublicationTargets.ts
new file mode 100644
index 000000000..5ac50c0af
--- /dev/null
+++ b/src/features/publications/api/useGetPublicationTargets.ts
@@ -0,0 +1,40 @@
+import type {
+  ListPublicationTargetsResponse,
+  PublicationTarget,
+} from "../types";
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError } from "axios";
+
+const DEFAULT_PAGE_SIZE = 1000;
+interface UseGetPublicationTargetsOptions {
+  pageSize?: number;
+}
+
+export const useGetPublicationTargets = ({
+  pageSize = DEFAULT_PAGE_SIZE,
+}: UseGetPublicationTargetsOptions = {}) => {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  const { data, isLoading } = useQuery<
+    PublicationTarget[],
+    AxiosError<ApiError>
+  >({
+    queryKey: ["publicationTargets", "all", pageSize],
+    queryFn: async () => {
+      const response =
+        await authFetchDebArchive.get<ListPublicationTargetsResponse>(
+          "publicationTargets",
+          { params: { pageSize } },
+        );
+
+      return response.data.publicationTargets ?? [];
+    },
+  });
+
+  return {
+    publicationTargets: data ?? [],
+    isGettingPublicationTargets: isLoading,
+  };
+};
diff --git a/src/features/publications/api/useGetPublications.ts b/src/features/publications/api/useGetPublications.ts
new file mode 100644
index 000000000..2eb2952c8
--- /dev/null
+++ b/src/features/publications/api/useGetPublications.ts
@@ -0,0 +1,107 @@
+import type { Publication } from "../types";
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import usePageParams from "@/hooks/usePageParams";
+import type { ApiError } from "@/types/api/ApiError";
+import type { ListPublicationsResponse } from "../types";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError } from "axios";
+import { useMemo } from "react";
+import {
+  getPublicationTargetName,
+  getSourceName,
+  getSourceType,
+} from "../helpers";
+
+const FETCH_PAGE_SIZE = 1000;
+
+const SEARCH_PREFIXES = [
+  "publicationTarget:",
+  "source:",
+  "sourceType:",
+] as const;
+type SearchPrefix = (typeof SEARCH_PREFIXES)[number];
+
+const parseSearchQuery = (
+  search: string,
+):
+  | { prefix: SearchPrefix; value: string }
+  | { prefix: null; value: string } => {
+  for (const prefix of SEARCH_PREFIXES) {
+    if (search.startsWith(prefix)) {
+      return {
+        prefix,
+        value: search.slice(prefix.length).trim().toLowerCase(),
+      };
+    }
+  }
+  return { prefix: null, value: search.trim().toLowerCase() };
+};
+
+const matchesSearch = (
+  publication: Publication,
+  prefix: SearchPrefix | null,
+  value: string,
+): boolean => {
+  if (!value) return true;
+  switch (prefix) {
+    case "publicationTarget:":
+      return (getPublicationTargetName(publication.publicationTarget) ?? "")
+        .toLowerCase()
+        .includes(value);
+    case "source:":
+      return (getSourceName(publication.source) ?? "")
+        .toLowerCase()
+        .includes(value);
+    case "sourceType:":
+      return getSourceType(publication.source).toLowerCase().includes(value);
+    default:
+      return publication.label.toLowerCase().includes(value);
+  }
+};
+
+export const useGetPublications = () => {
+  const authFetchDebArchive = useFetchDebArchive();
+  const { currentPage, pageSize, query } = usePageParams();
+
+  const { data, isLoading } = useQuery<Publication[], AxiosError<ApiError>>({
+    queryKey: ["publications", "all"],
+    queryFn: async () => {
+      const response = await authFetchDebArchive.get<ListPublicationsResponse>(
+        "publications",
+        {
+          params: {
+            pageSize: FETCH_PAGE_SIZE,
+          },
+        },
+      );
+
+      return response.data.publications ?? [];
+    },
+  });
+
+  const filteredPublications = useMemo(() => {
+    const normalizedSearch = query?.trim() ?? "";
+
+    if (!normalizedSearch) {
+      return data ?? [];
+    }
+
+    const { prefix, value } = parseSearchQuery(normalizedSearch);
+
+    return (data ?? []).filter((publication) =>
+      matchesSearch(publication, prefix, value),
+    );
+  }, [data, query]);
+
+  const paginatedPublications = useMemo(() => {
+    const offset = (currentPage - 1) * pageSize;
+
+    return filteredPublications.slice(offset, offset + pageSize);
+  }, [currentPage, filteredPublications, pageSize]);
+
+  return {
+    publications: paginatedPublications,
+    publicationsCount: filteredPublications.length ?? 0,
+    isGettingPublications: isLoading,
+  };
+};
diff --git a/src/features/publications/api/usePublishPublication.ts b/src/features/publications/api/usePublishPublication.ts
new file mode 100644
index 000000000..860a56b51
--- /dev/null
+++ b/src/features/publications/api/usePublishPublication.ts
@@ -0,0 +1,33 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+import type { PublishPublicationResponse } from "../types";
+import type { PublicationServicePublishPublicationBody } from "../types/Publication";
+
+interface PublishPublicationParams {
+  publicationName: string;
+  body: PublicationServicePublishPublicationBody;
+}
+
+export const usePublishPublication = () => {
+  const authFetchDebArchive = useFetchDebArchive();
+  const queryClient = useQueryClient();
+
+  const { mutateAsync, isPending } = useMutation<
+    AxiosResponse<PublishPublicationResponse>,
+    AxiosError<ApiError>,
+    PublishPublicationParams
+  >({
+    mutationKey: ["publications", "publish"],
+    mutationFn: async ({ publicationName, body }) =>
+      authFetchDebArchive.post(`${publicationName}:publish`, body),
+    onSuccess: async () =>
+      queryClient.invalidateQueries({ queryKey: ["publications"] }),
+  });
+
+  return {
+    publishPublication: mutateAsync,
+    isPublishingPublication: isPending,
+  };
+};
diff --git a/src/features/publications/components/AddPublicationButton/AddPublicationButton.test.tsx b/src/features/publications/components/AddPublicationButton/AddPublicationButton.test.tsx
new file mode 100644
index 000000000..477243a05
--- /dev/null
+++ b/src/features/publications/components/AddPublicationButton/AddPublicationButton.test.tsx
@@ -0,0 +1,27 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it } from "vitest";
+import AddPublicationButton from "./AddPublicationButton";
+
+describe("AddPublicationButton", () => {
+  const user = userEvent.setup();
+
+  it("renders add publication button", () => {
+    renderWithProviders(<AddPublicationButton />);
+
+    expect(
+      screen.getByRole("button", { name: "Add publication" }),
+    ).toBeInTheDocument();
+  });
+
+  it("opens side panel on click", async () => {
+    renderWithProviders(<AddPublicationButton />);
+
+    await user.click(screen.getByRole("button", { name: "Add publication" }));
+
+    expect(
+      await screen.findByRole("heading", { name: "Add publication" }),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/publications/components/AddPublicationButton/AddPublicationButton.tsx b/src/features/publications/components/AddPublicationButton/AddPublicationButton.tsx
new file mode 100644
index 000000000..70f71dae7
--- /dev/null
+++ b/src/features/publications/components/AddPublicationButton/AddPublicationButton.tsx
@@ -0,0 +1,33 @@
+import LoadingState from "@/components/layout/LoadingState";
+import useSidePanel from "@/hooks/useSidePanel";
+import { Button, Icon } from "@canonical/react-components";
+import { lazy, Suspense } from "react";
+
+const AddPublicationForm = lazy(() => import("../AddPublicationForm"));
+
+const AddPublicationButton = () => {
+  const { setSidePanelContent } = useSidePanel();
+
+  const handleAddPublication = () => {
+    setSidePanelContent(
+      "Add publication",
+      <Suspense fallback={<LoadingState />}>
+        <AddPublicationForm />
+      </Suspense>,
+    );
+  };
+
+  return (
+    <Button
+      appearance="positive"
+      hasIcon
+      type="button"
+      onClick={handleAddPublication}
+    >
+      <Icon name="plus" light />
+      <span>Add publication</span>
+    </Button>
+  );
+};
+
+export default AddPublicationButton;
diff --git a/src/features/publications/components/AddPublicationButton/index.ts b/src/features/publications/components/AddPublicationButton/index.ts
new file mode 100644
index 000000000..b86785396
--- /dev/null
+++ b/src/features/publications/components/AddPublicationButton/index.ts
@@ -0,0 +1 @@
+export { default } from "./AddPublicationButton";
diff --git a/src/features/publications/components/AddPublicationForm/AddPublicationForm.module.scss b/src/features/publications/components/AddPublicationForm/AddPublicationForm.module.scss
new file mode 100644
index 000000000..3a3853a7f
--- /dev/null
+++ b/src/features/publications/components/AddPublicationForm/AddPublicationForm.module.scss
@@ -0,0 +1,30 @@
+@import "vanilla-framework/scss/settings_spacing";
+@import "vanilla-framework/scss/settings_colors";
+
+.settingLabel {
+  margin-right: $sph--x-small;
+}
+
+.tooltipPositionElement {
+  display: inline !important;
+}
+
+.derivedDistribution {
+  align-items: center;
+  display: flex;
+  justify-content: space-between;
+  padding: $spv--small $sph--small;
+  background-color: $colors--theme--background-inputs;
+}
+
+.derivedDistributionValue {
+  font-weight: 500;
+}
+
+.sectionTitle {
+  margin-bottom: $spv--small;
+}
+
+.section {
+  padding-top: $spv--large !important;
+}
diff --git a/src/features/publications/components/AddPublicationForm/AddPublicationForm.test.tsx b/src/features/publications/components/AddPublicationForm/AddPublicationForm.test.tsx
new file mode 100644
index 000000000..9d7c41849
--- /dev/null
+++ b/src/features/publications/components/AddPublicationForm/AddPublicationForm.test.tsx
@@ -0,0 +1,222 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen, waitFor } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it } from "vitest";
+import AddPublicationForm from "./AddPublicationForm";
+
+describe("AddPublicationForm", () => {
+  const selectMirrorSource = async (
+    user: ReturnType<typeof userEvent.setup>,
+  ) => {
+    const sourceTypeSelect = screen.getByRole("combobox", {
+      name: "Source type",
+    });
+    const sourceSelect = screen.getByRole("combobox", { name: "Source" });
+
+    await user.selectOptions(sourceTypeSelect, "Mirror");
+
+    await waitFor(() => {
+      expect(sourceSelect).toBeEnabled();
+    });
+
+    await user.selectOptions(sourceSelect, "ubuntu-archive-mirror");
+  };
+
+  const selectLocalSource = async (
+    user: ReturnType<typeof userEvent.setup>,
+  ) => {
+    const sourceTypeSelect = screen.getByRole("combobox", {
+      name: "Source type",
+    });
+    const sourceSelect = screen.getByRole("combobox", { name: "Source" });
+
+    await user.selectOptions(sourceTypeSelect, "Local repository");
+
+    await waitFor(() => {
+      expect(sourceSelect).toBeEnabled();
+    });
+
+    await user.selectOptions(sourceSelect, "internal-packages");
+  };
+
+  it("updates uploader fields when a mirror source is selected", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<AddPublicationForm />);
+
+    await selectMirrorSource(user);
+
+    expect(screen.getByText("jammy")).toBeInTheDocument();
+    expect(
+      screen.getByRole("combobox", { name: "Architectures" }),
+    ).toBeInTheDocument();
+    expect(screen.getByRole("option", { name: "amd64" })).toBeInTheDocument();
+    expect(screen.getByRole("option", { name: "arm64" })).toBeInTheDocument();
+  });
+
+  it("updates mirror publication fields based on the selected source", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<AddPublicationForm />);
+
+    await user.type(
+      screen.getByRole("textbox", { name: "Publication name" }),
+      "new-mirror-publication",
+    );
+    await selectMirrorSource(user);
+
+    const publicationTargetSelect = screen.getByRole("combobox", {
+      name: "Publication target",
+    });
+
+    await waitFor(() => {
+      expect(publicationTargetSelect).toBeEnabled();
+    });
+
+    await user.selectOptions(publicationTargetSelect, "primary-us-mirror");
+    await user.selectOptions(
+      screen.getByRole("combobox", { name: "Architectures" }),
+      "amd64",
+    );
+    await user.type(
+      screen.getByRole("textbox", { name: "Directory prefix" }),
+      "edge",
+    );
+    await user.click(
+      screen.getByRole("checkbox", {
+        name: /Preserve mirror signing key/i,
+      }),
+    );
+    await user.type(
+      screen.getByRole("textbox", { name: "Signing GPG key" }),
+      "-----BEGIN PGP PRIVATE KEY BLOCK-----test-key",
+    );
+    await user.click(
+      screen.getByRole("checkbox", { name: /Hash based indexing/i }),
+    );
+    await user.click(
+      screen.getByRole("checkbox", { name: /Automatic installation/i }),
+    );
+    await user.click(
+      screen.getByRole("checkbox", { name: /Automatic upgrades/i }),
+    );
+    await user.click(screen.getByRole("checkbox", { name: /Skip bz2/i }));
+    await user.click(
+      screen.getByRole("checkbox", { name: /Skip content indexing/i }),
+    );
+
+    expect(publicationTargetSelect).toHaveValue("primary-us-mirror");
+    expect(screen.getByRole("combobox", { name: "Architectures" })).toHaveValue(
+      "amd64",
+    );
+    expect(
+      screen.getByRole("textbox", { name: "Directory prefix" }),
+    ).toHaveValue("edge");
+    expect(
+      screen.getByRole("textbox", { name: "Signing GPG key" }),
+    ).toHaveValue("-----BEGIN PGP PRIVATE KEY BLOCK-----test-key");
+  });
+
+  it("uses static local-source fields without uploader architectures", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<AddPublicationForm />);
+
+    await user.type(
+      screen.getByRole("textbox", { name: "Publication name" }),
+      "new-local-publication",
+    );
+    await selectLocalSource(user);
+
+    expect(screen.getByText("focal")).toBeInTheDocument();
+    expect(
+      screen.queryByRole("combobox", { name: "Architectures" }),
+    ).not.toBeInTheDocument();
+
+    const publicationTargetSelect = screen.getByRole("combobox", {
+      name: "Publication target",
+    });
+
+    await waitFor(() => {
+      expect(publicationTargetSelect).toBeEnabled();
+    });
+
+    await user.selectOptions(publicationTargetSelect, "internal-datacenter");
+
+    expect(publicationTargetSelect).toHaveValue("internal-datacenter");
+  });
+
+  it("hides preserve mirror signing key when local source is selected", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<AddPublicationForm />);
+
+    await selectMirrorSource(user);
+
+    const preserveKeyCheckbox = screen.getByRole("checkbox", {
+      name: /Preserve mirror signing key/i,
+    });
+
+    expect(preserveKeyCheckbox).toBeInTheDocument();
+
+    await selectLocalSource(user);
+
+    expect(
+      screen.queryByRole("checkbox", {
+        name: /Preserve mirror signing key/i,
+      }),
+    ).not.toBeInTheDocument();
+  });
+
+  it("resets preserve_mirror_signing_key to default when switching source type", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<AddPublicationForm />);
+
+    await selectMirrorSource(user);
+
+    const preserveKeyCheckbox = screen.getByRole("checkbox", {
+      name: /Preserve mirror signing key/i,
+    });
+
+    await user.click(preserveKeyCheckbox);
+    expect(preserveKeyCheckbox).not.toBeChecked();
+
+    await selectLocalSource(user);
+
+    const sourceTypeSelect = screen.getByRole("combobox", {
+      name: "Source type",
+    });
+    await user.selectOptions(sourceTypeSelect, "Mirror");
+
+    await waitFor(() => {
+      expect(
+        screen.getByRole("checkbox", { name: /Preserve mirror signing key/i }),
+      ).toBeChecked();
+    });
+  });
+
+  it("resets mirror_signing_key when switching source type", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<AddPublicationForm />);
+
+    await selectMirrorSource(user);
+
+    await user.click(
+      screen.getByRole("checkbox", { name: /Preserve mirror signing key/i }),
+    );
+
+    const signingKeyTextarea = screen.getByRole("textbox", {
+      name: "Signing GPG key",
+    });
+    await user.type(signingKeyTextarea, "my-signing-key");
+    expect(signingKeyTextarea).toHaveValue("my-signing-key");
+
+    await selectLocalSource(user);
+
+    expect(
+      screen.getByRole("textbox", { name: "Signing GPG key" }),
+    ).toHaveValue("");
+  });
+});
diff --git a/src/features/publications/components/AddPublicationForm/AddPublicationForm.tsx b/src/features/publications/components/AddPublicationForm/AddPublicationForm.tsx
new file mode 100644
index 000000000..e82aa2097
--- /dev/null
+++ b/src/features/publications/components/AddPublicationForm/AddPublicationForm.tsx
@@ -0,0 +1,406 @@
+import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
+import Blocks from "@/components/layout/Blocks";
+import useDebug from "@/hooks/useDebug";
+import useNotify from "@/hooks/useNotify";
+import useSidePanel from "@/hooks/useSidePanel";
+import type { SelectOption } from "@/types/SelectOption";
+import { getFormikError } from "@/utils/formikErrors";
+import {
+  Form,
+  Icon,
+  Input,
+  Select,
+  Textarea,
+  Tooltip,
+} from "@canonical/react-components";
+import classNames from "classnames";
+import { useFormik } from "formik";
+import type { FC } from "react";
+import { useMemo } from "react";
+import classes from "./AddPublicationForm.module.scss";
+import {
+  INITIAL_VALUES,
+  SETTINGS_HELP_TEXT,
+  SOURCE_TYPE_LOCAL_REPOSITORY,
+  SOURCE_TYPE_MIRROR,
+  SOURCE_TYPE_OPTIONS,
+} from "./constants";
+import {
+  getPublicationPayload,
+  stripResourcePrefix,
+  VALIDATION_SCHEMA,
+} from "./helpers";
+import type { FormProps, SelectableSource } from "./types";
+import {
+  useCreatePublication,
+  useGetLocals,
+  useGetMirrors,
+  useGetPublicationTargets,
+} from "../../api";
+
+const AddPublicationForm: FC = () => {
+  const debug = useDebug();
+  const { notify } = useNotify();
+  const { closeSidePanel } = useSidePanel();
+  const { mirrors, isGettingMirrors } = useGetMirrors();
+  const { locals, isGettingLocals } = useGetLocals();
+  const { publicationTargets, isGettingPublicationTargets } =
+    useGetPublicationTargets();
+  const { createPublication, isCreatingPublication } = useCreatePublication();
+
+  const formik = useFormik<FormProps>({
+    initialValues: INITIAL_VALUES,
+    validationSchema: VALIDATION_SCHEMA,
+    onSubmit: async (values) => {
+      try {
+        const payload = getPublicationPayload(values);
+        await createPublication(payload);
+
+        closeSidePanel();
+
+        notify.success({
+          title: "Publication created",
+          message: `Publication "${values.name}" has been created.`,
+        });
+      } catch (error) {
+        debug(error);
+      }
+    },
+  });
+
+  const mirrorSources = useMemo<SelectableSource[]>(
+    () =>
+      mirrors
+        .filter((mirror) => Boolean(mirror.name))
+        .map((mirror) => ({
+          label: mirror.displayName,
+          value: stripResourcePrefix(mirror.name, "mirrors/"),
+          sourceType: SOURCE_TYPE_MIRROR,
+          distribution: mirror.distribution,
+          architectures: mirror.architectures ?? [],
+        })),
+    [mirrors],
+  );
+
+  const localSources = useMemo<SelectableSource[]>(
+    () =>
+      locals
+        .filter((localSource) => Boolean(localSource.name))
+        .map((localSource) => ({
+          label: localSource.displayName,
+          value: stripResourcePrefix(localSource.name, "locals/"),
+          sourceType: SOURCE_TYPE_LOCAL_REPOSITORY,
+          distribution: localSource.defaultDistribution,
+          architectures: [],
+        })),
+    [locals],
+  );
+
+  const selectableSources = useMemo(() => {
+    if (formik.values.source_type === SOURCE_TYPE_MIRROR) {
+      return mirrorSources;
+    }
+
+    if (formik.values.source_type === SOURCE_TYPE_LOCAL_REPOSITORY) {
+      return localSources;
+    }
+
+    return [];
+  }, [formik.values.source_type, localSources, mirrorSources]);
+
+  const sourceOptions = useMemo(
+    () => [
+      { label: "Select source", value: "" },
+      ...selectableSources.map(({ label, value }) => ({ label, value })),
+    ],
+    [selectableSources],
+  );
+
+  const selectedSource = selectableSources.find(
+    ({ value }) => value === formik.values.source,
+  );
+
+  const isLocalSourceType =
+    formik.values.source_type === SOURCE_TYPE_LOCAL_REPOSITORY;
+
+  const isGettingSources = isGettingLocals || isGettingMirrors;
+
+  const publicationTargetOptions = useMemo<SelectOption[]>(
+    () => [
+      { label: "Select publication target", value: "" },
+      ...publicationTargets
+        .filter((publicationTarget) => Boolean(publicationTarget.name))
+        .map((publicationTarget) => ({
+          label: publicationTarget.displayName,
+          value: stripResourcePrefix(
+            publicationTarget.name,
+            "publicationTargets/",
+          ),
+        })),
+    ],
+    [publicationTargets],
+  );
+
+  const architectureOptions = useMemo(
+    () => [
+      {
+        label: "Select architecture",
+        value: "",
+      },
+      ...(selectedSource?.architectures ?? []).map((architecture) => ({
+        label: architecture,
+        value: architecture,
+      })),
+    ],
+    [selectedSource],
+  );
+
+  const handleSourceTypeChange = async (
+    event: React.ChangeEvent<HTMLSelectElement>,
+  ): Promise<void> => {
+    await formik.setFieldValue("source_type", event.target.value);
+    await formik.setFieldValue("source", "");
+    await formik.setFieldValue("uploader_distribution", "");
+    await formik.setFieldValue("uploader_architectures", "");
+    await formik.setFieldValue(
+      "preserve_mirror_signing_key",
+      INITIAL_VALUES.preserve_mirror_signing_key,
+    );
+    await formik.setFieldValue(
+      "mirror_signing_key",
+      INITIAL_VALUES.mirror_signing_key,
+    );
+  };
+
+  const handleSourceChange = async (
+    event: React.ChangeEvent<HTMLSelectElement>,
+  ): Promise<void> => {
+    const sourceValue = event.target.value;
+    const source = selectableSources.find(({ value }) => value === sourceValue);
+
+    await formik.setFieldValue("source", sourceValue);
+    await formik.setFieldValue(
+      "uploader_distribution",
+      source?.distribution ?? "",
+    );
+
+    if (source?.sourceType === SOURCE_TYPE_LOCAL_REPOSITORY) {
+      await formik.setFieldValue("uploader_architectures", "");
+
+      return;
+    }
+
+    await formik.setFieldValue("uploader_architectures", "");
+  };
+
+  return (
+    <Form noValidate onSubmit={formik.handleSubmit}>
+      <Blocks>
+        <Blocks.Item
+          title="Details"
+          titleClassName={classNames(
+            "p-text--small-caps",
+            classes.sectionTitle,
+          )}
+          containerClassName={classes.section}
+        >
+          <Input
+            type="text"
+            label="Publication name"
+            required
+            error={getFormikError(formik, "name")}
+            {...formik.getFieldProps("name")}
+          />
+
+          <Select
+            label="Source type"
+            required
+            options={SOURCE_TYPE_OPTIONS}
+            error={getFormikError(formik, "source_type")}
+            {...formik.getFieldProps("source_type")}
+            onChange={handleSourceTypeChange}
+          />
+
+          <Select
+            label="Source"
+            required
+            disabled={!formik.values.source_type || isGettingSources}
+            options={sourceOptions}
+            error={getFormikError(formik, "source")}
+            {...formik.getFieldProps("source")}
+            onChange={handleSourceChange}
+          />
+
+          <Select
+            label="Publication target"
+            required
+            disabled={isGettingPublicationTargets}
+            options={publicationTargetOptions}
+            error={getFormikError(formik, "publication_target")}
+            {...formik.getFieldProps("publication_target")}
+          />
+
+          <Input
+            type="text"
+            label="Directory prefix"
+            error={getFormikError(formik, "prefix")}
+            {...formik.getFieldProps("prefix")}
+          />
+
+          {!isLocalSourceType && (
+            <>
+              <span>Signing GPG key</span>
+              <Input
+                type="checkbox"
+                label="Preserve mirror signing key"
+                checked={formik.values.preserve_mirror_signing_key}
+                {...formik.getFieldProps("preserve_mirror_signing_key")}
+              />
+            </>
+          )}
+
+          <Textarea
+            label="Signing GPG key"
+            labelClassName={!isLocalSourceType ? "u-off-screen" : undefined}
+            rows={4}
+            disabled={formik.values.preserve_mirror_signing_key}
+            error={getFormikError(formik, "mirror_signing_key")}
+            {...formik.getFieldProps("mirror_signing_key")}
+          />
+        </Blocks.Item>
+
+        <Blocks.Item
+          title="Uploaders"
+          titleClassName={classNames(
+            "p-text--small-caps",
+            classes.sectionTitle,
+          )}
+          containerClassName={classes.section}
+        >
+          <label
+            className="p-form__label is-required"
+            htmlFor="uploader_distribution"
+          >
+            Distribution
+          </label>
+          <div
+            className={classNames(
+              "u-no-margin--bottom",
+              classes.derivedDistribution,
+            )}
+          >
+            <span
+              className={classes.derivedDistributionValue}
+              id="uploader_distribution"
+            >
+              {formik.values.uploader_distribution}
+            </span>
+            <Icon name="lock-locked" aria-hidden />
+          </div>
+
+          {!isLocalSourceType && (
+            <Select
+              label="Architectures"
+              required
+              disabled={!formik.values.source}
+              options={architectureOptions}
+              error={getFormikError(formik, "uploader_architectures")}
+              {...formik.getFieldProps("uploader_architectures")}
+            />
+          )}
+        </Blocks.Item>
+
+        <Blocks.Item
+          title="Settings"
+          titleClassName={classNames(
+            classes.sectionTitle,
+            "p-text--small-caps",
+          )}
+          containerClassName={classes.section}
+        >
+          <Input
+            type="checkbox"
+            label={
+              <span>
+                <span className={classes.settingLabel}>
+                  Hash based indexing
+                </span>
+                <Tooltip
+                  message={SETTINGS_HELP_TEXT.hashIndexing}
+                  position="top-center"
+                  positionElementClassName={classes.tooltipPositionElement}
+                >
+                  <Icon name="help" aria-hidden />
+                  <span className="u-off-screen">Help</span>
+                </Tooltip>
+              </span>
+            }
+            checked={formik.values.hash_indexing}
+            {...formik.getFieldProps("hash_indexing")}
+          />
+
+          <Input
+            type="checkbox"
+            label={
+              <span>
+                <span className={classes.settingLabel}>
+                  Automatic installation
+                </span>
+                <Tooltip
+                  message={SETTINGS_HELP_TEXT.automaticInstallation}
+                  position="top-center"
+                  positionElementClassName={classes.tooltipPositionElement}
+                >
+                  <Icon name="help" aria-hidden />
+                  <span className="u-off-screen">Help</span>
+                </Tooltip>
+              </span>
+            }
+            checked={formik.values.automatic_installation}
+            {...formik.getFieldProps("automatic_installation")}
+          />
+
+          <Input
+            type="checkbox"
+            label={
+              <span>
+                <span className={classes.settingLabel}>Automatic upgrades</span>
+                <Tooltip
+                  message={SETTINGS_HELP_TEXT.automaticUpgrades}
+                  position="top-center"
+                  positionElementClassName={classes.tooltipPositionElement}
+                >
+                  <Icon name="help" aria-hidden />
+                  <span className="u-off-screen">Help</span>
+                </Tooltip>
+              </span>
+            }
+            checked={formik.values.automatic_upgrades}
+            {...formik.getFieldProps("automatic_upgrades")}
+          />
+
+          <Input
+            type="checkbox"
+            label="Skip bz2"
+            checked={formik.values.skip_bz2}
+            {...formik.getFieldProps("skip_bz2")}
+          />
+
+          <Input
+            type="checkbox"
+            label="Skip content indexing"
+            checked={formik.values.skip_content_indexing}
+            {...formik.getFieldProps("skip_content_indexing")}
+          />
+        </Blocks.Item>
+      </Blocks>
+
+      <SidePanelFormButtons
+        submitButtonDisabled={formik.isSubmitting || isCreatingPublication}
+        submitButtonText="Add publication"
+      />
+    </Form>
+  );
+};
+
+export default AddPublicationForm;
diff --git a/src/features/publications/components/AddPublicationForm/constants.ts b/src/features/publications/components/AddPublicationForm/constants.ts
new file mode 100644
index 000000000..e60575141
--- /dev/null
+++ b/src/features/publications/components/AddPublicationForm/constants.ts
@@ -0,0 +1,40 @@
+import type { SelectOption } from "@/types/SelectOption";
+import type { FormProps } from "./types";
+
+export const SOURCE_TYPE_MIRROR = "Mirror";
+export const SOURCE_TYPE_LOCAL_REPOSITORY = "Local repository";
+
+export const SOURCE_TYPE_OPTIONS: SelectOption[] = [
+  { label: "Select source type", value: "" },
+  { label: SOURCE_TYPE_MIRROR, value: SOURCE_TYPE_MIRROR },
+  {
+    label: SOURCE_TYPE_LOCAL_REPOSITORY,
+    value: SOURCE_TYPE_LOCAL_REPOSITORY,
+  },
+];
+
+export const SETTINGS_HELP_TEXT = {
+  hashIndexing:
+    'Provides repository index files (like Packages and Sources) via their hash sums instead of just their names. This prevents "Hash Sum Mismatch" errors on client machines if the repository is updated during an active apt-get update session.',
+  automaticInstallation:
+    'This creates an exception to the "Limit Automatic Installation" rule. While new packages from this repository won\'t be installed automatically, any package already installed on a system will be upgraded whenever a newer version is published to this repository.',
+  automaticUpgrades:
+    "This tells apt that packages in this repository should not be installed or upgraded automatically. Users must explicitly target this repository or specific package versions to install them.",
+};
+
+export const INITIAL_VALUES: FormProps = {
+  name: "",
+  source_type: "",
+  source: "",
+  publication_target: "",
+  prefix: "",
+  uploader_distribution: "",
+  uploader_architectures: "",
+  preserve_mirror_signing_key: true,
+  mirror_signing_key: "",
+  hash_indexing: false,
+  automatic_installation: false,
+  automatic_upgrades: false,
+  skip_bz2: false,
+  skip_content_indexing: false,
+};
diff --git a/src/features/publications/components/AddPublicationForm/helpers.ts b/src/features/publications/components/AddPublicationForm/helpers.ts
new file mode 100644
index 000000000..6c1c9836a
--- /dev/null
+++ b/src/features/publications/components/AddPublicationForm/helpers.ts
@@ -0,0 +1,117 @@
+import * as Yup from "yup";
+import type { FormProps } from "./types";
+import type { PublicationWritable } from "../../types";
+import { SOURCE_TYPE_LOCAL_REPOSITORY } from "./constants";
+
+export interface CreatePublicationPayload {
+  publicationId?: string;
+  body: PublicationWritable;
+}
+
+const REQUIRED_FIELD_MESSAGE = "This field is required";
+
+export const getCsvValues = (value?: string): string[] => {
+  return (value ?? "")
+    .split(",")
+    .map((item) => item.trim())
+    .filter(Boolean);
+};
+
+export const VALIDATION_SCHEMA = Yup.object().shape({
+  name: Yup.string().required(REQUIRED_FIELD_MESSAGE),
+  source_type: Yup.string().required(REQUIRED_FIELD_MESSAGE),
+  source: Yup.string().required(REQUIRED_FIELD_MESSAGE),
+  publication_target: Yup.string().required(REQUIRED_FIELD_MESSAGE),
+  prefix: Yup.string(),
+  uploader_distribution: Yup.string().required(REQUIRED_FIELD_MESSAGE),
+  uploader_architectures: Yup.string()
+    .when("source_type", {
+      is: SOURCE_TYPE_LOCAL_REPOSITORY,
+      then: (schema) => schema,
+      otherwise: (schema) => schema.required(REQUIRED_FIELD_MESSAGE),
+    })
+    .test({
+      name: "has-architectures",
+      message: REQUIRED_FIELD_MESSAGE,
+      test: (value, context) => {
+        if (context.parent.source_type === SOURCE_TYPE_LOCAL_REPOSITORY) {
+          return true;
+        }
+
+        return getCsvValues(value).length > 0;
+      },
+    }),
+  preserve_mirror_signing_key: Yup.boolean(),
+  mirror_signing_key: Yup.string().when("preserve_mirror_signing_key", {
+    is: false,
+    then: (schema) => schema.required(REQUIRED_FIELD_MESSAGE),
+    otherwise: (schema) => schema,
+  }),
+  hash_indexing: Yup.boolean(),
+  automatic_installation: Yup.boolean(),
+  automatic_upgrades: Yup.boolean(),
+  skip_bz2: Yup.boolean(),
+  skip_content_indexing: Yup.boolean(),
+});
+
+export const getPreviewValue = (value?: string): string => {
+  return value?.trim() || "-";
+};
+
+const prependResourcePrefix = (value: string, prefix: string) => {
+  const trimmedValue = value.trim();
+
+  if (!trimmedValue) {
+    return "";
+  }
+
+  if (trimmedValue.startsWith(prefix)) {
+    return trimmedValue;
+  }
+
+  return `${prefix}${trimmedValue}`;
+};
+
+export const getPublicationPayload = (values: FormProps) => {
+  const publicationId = values.name.trim() || undefined;
+  const sourcePrefix =
+    values.source_type === SOURCE_TYPE_LOCAL_REPOSITORY
+      ? "locals/"
+      : "mirrors/";
+  const architectures =
+    values.source_type === SOURCE_TYPE_LOCAL_REPOSITORY
+      ? []
+      : getCsvValues(values.uploader_architectures);
+
+  return {
+    publicationId,
+    body: {
+      publicationTarget: prependResourcePrefix(
+        values.publication_target,
+        "publicationTargets/",
+      ),
+      source: prependResourcePrefix(values.source, sourcePrefix),
+      distribution: values.uploader_distribution.trim() || undefined,
+      label: values.prefix.trim() || undefined,
+      architectures: architectures.length > 0 ? architectures : undefined,
+      acquireByHash: values.hash_indexing,
+      notAutomatic: !values.automatic_installation,
+      butAutomaticUpgrades: values.automatic_upgrades,
+      skipBz2: values.skip_bz2,
+      skipContents: values.skip_content_indexing,
+      gpgKey: values.preserve_mirror_signing_key
+        ? undefined
+        : {
+            armor: values.mirror_signing_key.trim(),
+          },
+    },
+  };
+};
+
+export const stripResourcePrefix = (value?: string, prefix?: string) => {
+  if (!value || !prefix) {
+    return value ?? "";
+  }
+
+  return value.startsWith(prefix) ? value.slice(prefix.length) : value;
+};
diff --git a/src/features/publications/components/AddPublicationForm/index.ts b/src/features/publications/components/AddPublicationForm/index.ts
new file mode 100644
index 000000000..976f75e75
--- /dev/null
+++ b/src/features/publications/components/AddPublicationForm/index.ts
@@ -0,0 +1 @@
+export { default } from "./AddPublicationForm";
diff --git a/src/features/publications/components/AddPublicationForm/types.ts b/src/features/publications/components/AddPublicationForm/types.ts
new file mode 100644
index 000000000..eef9f3b32
--- /dev/null
+++ b/src/features/publications/components/AddPublicationForm/types.ts
@@ -0,0 +1,24 @@
+export interface FormProps {
+  name: string;
+  source_type: string;
+  source: string;
+  publication_target: string;
+  prefix: string;
+  uploader_distribution: string;
+  uploader_architectures: string;
+  preserve_mirror_signing_key: boolean;
+  mirror_signing_key: string;
+  hash_indexing: boolean;
+  automatic_installation: boolean;
+  automatic_upgrades: boolean;
+  skip_bz2: boolean;
+  skip_content_indexing: boolean;
+}
+
+export interface SelectableSource {
+  label: string;
+  value: string;
+  sourceType: string;
+  distribution?: string;
+  architectures: string[];
+}
diff --git a/src/features/publications/components/NoPublicationsEmptyState/NoPublicationsEmptyState.test.tsx b/src/features/publications/components/NoPublicationsEmptyState/NoPublicationsEmptyState.test.tsx
new file mode 100644
index 000000000..704914153
--- /dev/null
+++ b/src/features/publications/components/NoPublicationsEmptyState/NoPublicationsEmptyState.test.tsx
@@ -0,0 +1,36 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it } from "vitest";
+import NoPublicationsEmptyState from "./NoPublicationsEmptyState";
+import { DOCUMENTATION_URL } from "./constants";
+
+describe("NoPublicationsEmptyState", () => {
+  const user = userEvent.setup();
+
+  it("renders title, docs link and CTA", () => {
+    renderWithProviders(<NoPublicationsEmptyState />);
+
+    expect(
+      screen.getByText(/you don.t have any publications yet/i),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("link", {
+        name: /learn more about repository mirroring/i,
+      }),
+    ).toHaveAttribute("href", DOCUMENTATION_URL);
+    expect(
+      screen.getByRole("button", { name: /add publication/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("opens add publication side panel from CTA", async () => {
+    renderWithProviders(<NoPublicationsEmptyState />);
+
+    await user.click(screen.getByRole("button", { name: "Add publication" }));
+
+    expect(
+      await screen.findByRole("heading", { name: "Add publication" }),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/publications/components/NoPublicationsEmptyState/NoPublicationsEmptyState.tsx b/src/features/publications/components/NoPublicationsEmptyState/NoPublicationsEmptyState.tsx
new file mode 100644
index 000000000..3cc3fdb4c
--- /dev/null
+++ b/src/features/publications/components/NoPublicationsEmptyState/NoPublicationsEmptyState.tsx
@@ -0,0 +1,29 @@
+import EmptyState from "@/components/layout/EmptyState";
+import AddPublicationButton from "../AddPublicationButton";
+import { DOCUMENTATION_URL } from "./constants";
+
+const NoPublicationsEmptyState = () => {
+  return (
+    <EmptyState
+      title="You don’t have any publications yet"
+      body={
+        <>
+          <p>
+            On this page you will find all publications created when publishing
+            a mirror or a local repository.{" "}
+          </p>
+          <a
+            href={DOCUMENTATION_URL}
+            target="_blank"
+            rel="nofollow noopener noreferrer"
+          >
+            Learn more about repository mirroring.
+          </a>
+        </>
+      }
+      cta={[<AddPublicationButton key="add-publication-button" />]}
+    />
+  );
+};
+
+export default NoPublicationsEmptyState;
diff --git a/src/features/publications/components/NoPublicationsEmptyState/constants.ts b/src/features/publications/components/NoPublicationsEmptyState/constants.ts
new file mode 100644
index 000000000..8209f5032
--- /dev/null
+++ b/src/features/publications/components/NoPublicationsEmptyState/constants.ts
@@ -0,0 +1,2 @@
+export const DOCUMENTATION_URL =
+  "https://documentation.ubuntu.com/landscape/explanation/features/repository-mirroring";
diff --git a/src/features/publications/components/NoPublicationsEmptyState/index.ts b/src/features/publications/components/NoPublicationsEmptyState/index.ts
new file mode 100644
index 000000000..7b262e7ee
--- /dev/null
+++ b/src/features/publications/components/NoPublicationsEmptyState/index.ts
@@ -0,0 +1 @@
+export { default } from "./NoPublicationsEmptyState";
diff --git a/src/features/publications/components/NoPublicationsTargetEmptyState/NoPublicationTargetEmptyState.test.tsx b/src/features/publications/components/NoPublicationsTargetEmptyState/NoPublicationTargetEmptyState.test.tsx
new file mode 100644
index 000000000..dcd26cdd8
--- /dev/null
+++ b/src/features/publications/components/NoPublicationsTargetEmptyState/NoPublicationTargetEmptyState.test.tsx
@@ -0,0 +1,25 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import NoPublicationTargetEmptyState from "./NoPublicationTargetEmptyState";
+import { DOCUMENTATION_URL } from "./constants";
+
+describe("NoPublicationTargetEmptyState", () => {
+  it("renders title, docs link and CTA button", () => {
+    renderWithProviders(<NoPublicationTargetEmptyState />);
+
+    expect(
+      screen.getByText(
+        /you must first add a publication target in order to add a publication/i,
+      ),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("link", {
+        name: /learn more about repository mirroring/i,
+      }),
+    ).toHaveAttribute("href", DOCUMENTATION_URL);
+    expect(
+      screen.getByRole("button", { name: /add publication target/i }),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/publications/components/NoPublicationsTargetEmptyState/NoPublicationTargetEmptyState.tsx b/src/features/publications/components/NoPublicationsTargetEmptyState/NoPublicationTargetEmptyState.tsx
new file mode 100644
index 000000000..43ccb11a1
--- /dev/null
+++ b/src/features/publications/components/NoPublicationsTargetEmptyState/NoPublicationTargetEmptyState.tsx
@@ -0,0 +1,39 @@
+import EmptyState from "@/components/layout/EmptyState";
+import { Button, Icon } from "@canonical/react-components";
+import { DOCUMENTATION_URL } from "./constants";
+
+const NoPublicationTargetEmptyState = () => {
+  return (
+    <EmptyState
+      title="You must first add a publication target in order to add a publication"
+      body={
+        <>
+          <p>
+            On this page you will find all publications created when publishing
+            a mirror or a local repository.
+          </p>
+          <a
+            href={DOCUMENTATION_URL}
+            target="_blank"
+            rel="nofollow noopener noreferrer"
+          >
+            Learn more about repository mirroring.
+          </a>
+        </>
+      }
+      cta={[
+        <Button
+          appearance="positive"
+          hasIcon
+          key="add-publication-target-button"
+          type="button"
+        >
+          <Icon name="plus" light />
+          <span>Add publication target</span>
+        </Button>,
+      ]}
+    />
+  );
+};
+
+export default NoPublicationTargetEmptyState;
diff --git a/src/features/publications/components/NoPublicationsTargetEmptyState/constants.ts b/src/features/publications/components/NoPublicationsTargetEmptyState/constants.ts
new file mode 100644
index 000000000..8209f5032
--- /dev/null
+++ b/src/features/publications/components/NoPublicationsTargetEmptyState/constants.ts
@@ -0,0 +1,2 @@
+export const DOCUMENTATION_URL =
+  "https://documentation.ubuntu.com/landscape/explanation/features/repository-mirroring";
diff --git a/src/features/publications/components/NoPublicationsTargetEmptyState/index.ts b/src/features/publications/components/NoPublicationsTargetEmptyState/index.ts
new file mode 100644
index 000000000..d0c02cf67
--- /dev/null
+++ b/src/features/publications/components/NoPublicationsTargetEmptyState/index.ts
@@ -0,0 +1 @@
+export { default } from "./NoPublicationTargetEmptyState";
diff --git a/src/features/publications/components/PublicationDetails/PublicationDetails.test.tsx b/src/features/publications/components/PublicationDetails/PublicationDetails.test.tsx
new file mode 100644
index 000000000..bb3ec5eac
--- /dev/null
+++ b/src/features/publications/components/PublicationDetails/PublicationDetails.test.tsx
@@ -0,0 +1,89 @@
+import { mirrors, publicationTargets, publications } from "@/tests/mocks/publications";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it } from "vitest";
+import PublicationDetails from "./PublicationDetails";
+
+describe("PublicationDetails", () => {
+  const user = userEvent.setup();
+  const [publication] = publications;
+
+  const sourceDisplayName =
+    mirrors.find((m) => m.name === publication.source)?.displayName ??
+    publication.source;
+  const publicationTargetDisplayName =
+    publicationTargets.find((t) => t.name === publication.publicationTarget)
+      ?.displayName ?? publication.publicationTarget;
+
+  it("renders all info sections and values", () => {
+    const { container } = renderWithProviders(
+      <PublicationDetails
+        publication={publication}
+        sourceDisplayName={sourceDisplayName}
+        publicationTargetDisplayName={publicationTargetDisplayName}
+      />,
+    );
+
+    const infoItems = [
+      { label: "Name", value: publication.label },
+      { label: "Source", value: sourceDisplayName },
+      { label: "Publication target", value: publicationTargetDisplayName },
+      { label: "Distribution", value: publication.distribution },
+      { label: "Label", value: publication.label },
+      { label: "Origin", value: publication.origin },
+      {
+        label: "Architectures",
+        value: publication.architectures.join(", "),
+      },
+      { label: "Hash indexing", value: "Yes" },
+      { label: "Automatic installation", value: "Yes" },
+      { label: "Automatic upgrades", value: "No" },
+      { label: "Multi dist", value: "No" },
+      { label: "Skip bz2", value: "No" },
+      { label: "Skip content indexing", value: "No" },
+    ];
+
+    for (const { label, value } of infoItems) {
+      expect(container).toHaveInfoItem(label, value);
+    }
+  });
+
+  it("opens republish modal", async () => {
+    renderWithProviders(
+      <PublicationDetails
+        publication={publication}
+        sourceDisplayName={sourceDisplayName}
+        publicationTargetDisplayName={publicationTargetDisplayName}
+      />,
+    );
+    const publicationLabel = publication.label;
+
+    await user.click(
+      screen.getByRole("button", { name: `Republish ${publicationLabel}` }),
+    );
+
+    expect(
+      screen.getByRole("heading", { name: `Republish ${publicationLabel}` }),
+    ).toBeInTheDocument();
+  });
+
+  it("opens remove modal", async () => {
+    renderWithProviders(
+      <PublicationDetails
+        publication={publication}
+        sourceDisplayName={sourceDisplayName}
+        publicationTargetDisplayName={publicationTargetDisplayName}
+      />,
+    );
+    const publicationLabel = publication.label;
+
+    await user.click(
+      screen.getByRole("button", { name: `Remove ${publicationLabel}` }),
+    );
+
+    expect(
+      screen.getByRole("heading", { name: `Remove ${publicationLabel}` }),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/publications/components/PublicationDetails/PublicationDetails.tsx b/src/features/publications/components/PublicationDetails/PublicationDetails.tsx
new file mode 100644
index 000000000..850552b00
--- /dev/null
+++ b/src/features/publications/components/PublicationDetails/PublicationDetails.tsx
@@ -0,0 +1,149 @@
+import Blocks from "@/components/layout/Blocks";
+import InfoGrid from "@/components/layout/InfoGrid";
+import { boolToLabel } from "@/utils/output";
+import { Button, Icon, ICONS } from "@canonical/react-components";
+import { useBoolean } from "usehooks-ts";
+import type { Publication } from "../../types";
+import RemovePublicationModal from "../RemovePublicationModal";
+import RepublishPublicationModal from "../RepublishPublicationModal";
+
+interface PublicationDetailsProps {
+  readonly publication: Publication;
+  readonly sourceDisplayName?: string;
+  readonly publicationTargetDisplayName?: string;
+}
+
+const PublicationDetails = ({
+  publication,
+  sourceDisplayName,
+  publicationTargetDisplayName,
+}: PublicationDetailsProps) => {
+  const {
+    value: isRemoveModalOpen,
+    setTrue: openRemoveModal,
+    setFalse: closeRemoveModal,
+  } = useBoolean();
+
+  const {
+    value: isRepublishModalOpen,
+    setTrue: openRepublishModal,
+    setFalse: closeRepublishModal,
+  } = useBoolean();
+
+  return (
+    <>
+      <div
+        className="p-segmented-control"
+        style={{
+          marginBottom: "1.5rem",
+        }}
+      >
+        <div className="p-segmented-control__list">
+          <Button
+            type="button"
+            className="p-segmented-control__button"
+            onClick={openRepublishModal}
+            hasIcon
+            aria-label={`Republish ${publication.label}`}
+          >
+            <Icon name="upload" />
+            <span>Republish</span>
+          </Button>
+
+          <Button
+            type="button"
+            className="p-segmented-control__button"
+            onClick={openRemoveModal}
+            hasIcon
+            aria-label={`Remove ${publication.label}`}
+          >
+            <Icon name={`${ICONS.delete}--negative`} />
+            <span className="u-text--negative">Remove</span>
+          </Button>
+        </div>
+      </div>
+
+      <Blocks>
+        <Blocks.Item title="Details" titleClassName="p-text--small-caps">
+          <InfoGrid dense>
+            <InfoGrid.Item label="Name" large value={publication.label} />
+
+            <InfoGrid.Item label="Source" value={sourceDisplayName} />
+
+            <InfoGrid.Item
+              label="Publication target"
+              value={publicationTargetDisplayName}
+            />
+
+            <InfoGrid.Item
+              label="Distribution"
+              value={publication.distribution}
+            />
+
+            <InfoGrid.Item label="Label" value={publication.label} />
+
+            <InfoGrid.Item label="Origin" value={publication.origin} />
+          </InfoGrid>
+        </Blocks.Item>
+
+        <Blocks.Item title="Uploaders" titleClassName="p-text--small-caps">
+          <InfoGrid>
+            <InfoGrid.Item
+              label="Architectures"
+              large
+              value={publication.architectures.join(", ")}
+            />
+          </InfoGrid>
+        </Blocks.Item>
+
+        <Blocks.Item title="Settings" titleClassName="p-text--small-caps">
+          <InfoGrid>
+            <InfoGrid.Item
+              label="Hash indexing"
+              value={boolToLabel(Boolean(publication.acquireByHash))}
+            />
+
+            <InfoGrid.Item
+              label="Automatic installation"
+              value={boolToLabel(!publication.notAutomatic)}
+            />
+
+            <InfoGrid.Item
+              label="Automatic upgrades"
+              value={boolToLabel(Boolean(publication.butAutomaticUpgrades))}
+            />
+
+            <InfoGrid.Item
+              label="Multi dist"
+              value={boolToLabel(Boolean(publication.multiDist))}
+            />
+
+            <InfoGrid.Item
+              label="Skip bz2"
+              value={boolToLabel(Boolean(publication.skipBz2))}
+            />
+
+            <InfoGrid.Item
+              label="Skip content indexing"
+              value={boolToLabel(Boolean(publication.skipContents))}
+            />
+          </InfoGrid>
+        </Blocks.Item>
+      </Blocks>
+
+      <RepublishPublicationModal
+        isOpen={isRepublishModalOpen}
+        close={closeRepublishModal}
+        publication={publication}
+      />
+
+      <RemovePublicationModal
+        isOpen={isRemoveModalOpen}
+        close={closeRemoveModal}
+        publication={publication}
+      />
+    </>
+  );
+};
+
+export default PublicationDetails;
diff --git a/src/features/publications/components/PublicationDetails/index.ts b/src/features/publications/components/PublicationDetails/index.ts
new file mode 100644
index 000000000..dc8bbeb97
--- /dev/null
+++ b/src/features/publications/components/PublicationDetails/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublicationDetails";
diff --git a/src/features/publications/components/PublicationDetailsSidePanel/PublicationDetailsSidePanel.tsx b/src/features/publications/components/PublicationDetailsSidePanel/PublicationDetailsSidePanel.tsx
new file mode 100644
index 000000000..cecae107a
--- /dev/null
+++ b/src/features/publications/components/PublicationDetailsSidePanel/PublicationDetailsSidePanel.tsx
@@ -0,0 +1,66 @@
+import SidePanel from "@/components/layout/SidePanel";
+import usePageParams from "@/hooks/usePageParams";
+import type { FC } from "react";
+import { useMemo } from "react";
+import {
+  useBatchGetLocals,
+  useBatchGetMirrors,
+  useBatchGetPublicationTargets,
+  useGetPublication,
+} from "../../api";
+import { getPublicationTargetName, getSourceName } from "../../helpers";
+import PublicationDetails from "../PublicationDetails";
+
+const PublicationDetailsSidePanel: FC = () => {
+  const { publication: publicationId } = usePageParams();
+  const { publication, isGettingPublication } = useGetPublication(publicationId);
+
+  const publicationTargetNames = useMemo(
+    () => (publication ? [publication.publicationTarget] : []),
+    [publication],
+  );
+
+  const mirrorNames = useMemo(
+    () =>
+      publication?.source.startsWith("mirrors/") ? [publication.source] : [],
+    [publication],
+  );
+
+  const localNames = useMemo(
+    () =>
+      publication?.source.startsWith("locals/") ? [publication.source] : [],
+    [publication],
+  );
+
+  const { publicationTargetDisplayNames } =
+    useBatchGetPublicationTargets(publicationTargetNames);
+  const { mirrorDisplayNames } = useBatchGetMirrors(mirrorNames);
+  const { localDisplayNames } = useBatchGetLocals(localNames);
+
+  const sourceDisplayNames = { ...mirrorDisplayNames, ...localDisplayNames };
+
+  if (isGettingPublication || !publication) {
+    return <SidePanel.LoadingState />;
+  }
+
+  return (
+    <>
+      <SidePanel.Header>{publication.label}</SidePanel.Header>
+      <SidePanel.Content>
+        <PublicationDetails
+          publication={publication}
+          sourceDisplayName={
+            sourceDisplayNames[publication.source] ??
+            getSourceName(publication.source)
+          }
+          publicationTargetDisplayName={
+            publicationTargetDisplayNames[publication.publicationTarget] ??
+            getPublicationTargetName(publication.publicationTarget)
+          }
+        />
+      </SidePanel.Content>
+    </>
+  );
+};
+
+export default PublicationDetailsSidePanel;
diff --git a/src/features/publications/components/PublicationDetailsSidePanel/index.ts b/src/features/publications/components/PublicationDetailsSidePanel/index.ts
new file mode 100644
index 000000000..b3ba7ac46
--- /dev/null
+++ b/src/features/publications/components/PublicationDetailsSidePanel/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublicationDetailsSidePanel";
diff --git a/src/features/publications/components/PublicationsContainer/PublicationsContainer.test.tsx b/src/features/publications/components/PublicationsContainer/PublicationsContainer.test.tsx
new file mode 100644
index 000000000..ac0bf7c55
--- /dev/null
+++ b/src/features/publications/components/PublicationsContainer/PublicationsContainer.test.tsx
@@ -0,0 +1,40 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
+import { publications } from "@/tests/mocks/publications";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import PublicationsContainer from "./PublicationsContainer";
+
+describe("PublicationsContainer", () => {
+  it("renders publications list data", async () => {
+    renderWithProviders(<PublicationsContainer />);
+
+    expect(
+      await screen.findByRole("button", {
+        name: publications[0].label,
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it("renders publication target empty state when there are no publication targets", async () => {
+    setEndpointStatus({ status: "empty", path: "publicationTargets" });
+
+    renderWithProviders(<PublicationsContainer />);
+
+    expect(
+      await screen.findByText(
+        /you must first add a publication target in order to add a publication/i,
+      ),
+    ).toBeInTheDocument();
+  });
+
+  it("renders publication empty state when there are no publications", async () => {
+    setEndpointStatus({ status: "empty", path: "publications" });
+
+    renderWithProviders(<PublicationsContainer />);
+
+    expect(
+      await screen.findByText(/you don.t have any publications yet/i),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/publications/components/PublicationsContainer/PublicationsContainer.tsx b/src/features/publications/components/PublicationsContainer/PublicationsContainer.tsx
new file mode 100644
index 000000000..6786a843c
--- /dev/null
+++ b/src/features/publications/components/PublicationsContainer/PublicationsContainer.tsx
@@ -0,0 +1,99 @@
+import PublicationsList from "../PublicationsList";
+import NoPublicationTargetEmptyState from "../NoPublicationsTargetEmptyState/NoPublicationTargetEmptyState";
+import NoPublicationsEmptyState from "../NoPublicationsEmptyState/NoPublicationsEmptyState";
+import LoadingState from "@/components/layout/LoadingState";
+import { TablePagination } from "@/components/layout/TablePagination";
+import usePageParams from "@/hooks/usePageParams";
+import PublicationsHeader from "../PublicationsHeader";
+import { useMemo } from "react";
+import {
+  useBatchGetLocals,
+  useBatchGetMirrors,
+  useBatchGetPublicationTargets,
+  useGetPublications,
+  useGetPublicationTargets,
+} from "../../api";
+
+const PublicationsContainer = () => {
+  const { query } = usePageParams();
+  const { publicationTargets, isGettingPublicationTargets } =
+    useGetPublicationTargets({ pageSize: 1 });
+  const { publications, publicationsCount, isGettingPublications } =
+    useGetPublications();
+
+  const publicationTargetNames = useMemo(
+    () => [...new Set(publications.map((p) => p.publicationTarget))],
+    [publications],
+  );
+
+  const mirrorNames = useMemo(
+    () => [
+      ...new Set(
+        publications
+          .map((p) => p.source)
+          .filter((s) => s.startsWith("mirrors/")),
+      ),
+    ],
+    [publications],
+  );
+
+  const localNames = useMemo(
+    () => [
+      ...new Set(
+        publications
+          .map((p) => p.source)
+          .filter((s) => s.startsWith("locals/")),
+      ),
+    ],
+    [publications],
+  );
+
+  const {
+    publicationTargetDisplayNames,
+    isLoadingPublicationTargetDisplayNames,
+  } = useBatchGetPublicationTargets(publicationTargetNames);
+  const { mirrorDisplayNames, isLoadingMirrorDisplayNames } =
+    useBatchGetMirrors(mirrorNames);
+  const { localDisplayNames, isLoadingLocalDisplayNames } =
+    useBatchGetLocals(localNames);
+
+  const sourceDisplayNames = useMemo(
+    () => ({ ...mirrorDisplayNames, ...localDisplayNames }),
+    [mirrorDisplayNames, localDisplayNames],
+  );
+
+  const isLoadingDisplayNames =
+    isLoadingPublicationTargetDisplayNames ||
+    isLoadingMirrorDisplayNames ||
+    isLoadingLocalDisplayNames;
+
+  if (
+    isGettingPublicationTargets ||
+    isGettingPublications ||
+    isLoadingDisplayNames
+  ) {
+    return <LoadingState />;
+  }
+
+  if (publicationTargets.length === 0) {
+    return <NoPublicationTargetEmptyState />;
+  }
+
+  if (publicationsCount === 0 && !query) {
+    return <NoPublicationsEmptyState />;
+  }
+
+  return (
+    <>
+      <PublicationsHeader />
+      <PublicationsList
+        publications={publications}
+        sourceDisplayNames={sourceDisplayNames}
+        publicationTargetDisplayNames={publicationTargetDisplayNames}
+      />
+      <TablePagination totalItems={publicationsCount} />
+    </>
+  );
+};
+
+export default PublicationsContainer;
diff --git a/src/features/publications/components/PublicationsContainer/index.ts b/src/features/publications/components/PublicationsContainer/index.ts
new file mode 100644
index 000000000..7622f34a1
--- /dev/null
+++ b/src/features/publications/components/PublicationsContainer/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublicationsContainer";
diff --git a/src/features/publications/components/PublicationsHeader/PublicationsHeader.test.tsx b/src/features/publications/components/PublicationsHeader/PublicationsHeader.test.tsx
new file mode 100644
index 000000000..9588785af
--- /dev/null
+++ b/src/features/publications/components/PublicationsHeader/PublicationsHeader.test.tsx
@@ -0,0 +1,12 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import PublicationsHeader from "./PublicationsHeader";
+
+describe("PublicationsHeader", () => {
+  it("renders search input", () => {
+    renderWithProviders(<PublicationsHeader />);
+
+    expect(screen.getByRole("searchbox")).toBeInTheDocument();
+  });
+});
diff --git a/src/features/publications/components/PublicationsHeader/PublicationsHeader.tsx b/src/features/publications/components/PublicationsHeader/PublicationsHeader.tsx
new file mode 100644
index 000000000..61a00a448
--- /dev/null
+++ b/src/features/publications/components/PublicationsHeader/PublicationsHeader.tsx
@@ -0,0 +1,17 @@
+import HeaderWithSearch from "@/components/form/HeaderWithSearch";
+import usePageParams from "@/hooks/usePageParams";
+
+const PublicationsHeader = () => {
+  const { query, setPageParams } = usePageParams();
+
+  return (
+    <HeaderWithSearch
+      searchText={query}
+      onSearch={(value) => {
+        setPageParams({ query: value });
+      }}
+    />
+  );
+};
+
+export default PublicationsHeader;
diff --git a/src/features/publications/components/PublicationsHeader/index.ts b/src/features/publications/components/PublicationsHeader/index.ts
new file mode 100644
index 000000000..00a295e2b
--- /dev/null
+++ b/src/features/publications/components/PublicationsHeader/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublicationsHeader";
diff --git a/src/features/publications/components/PublicationsList/PublicationsList.test.tsx b/src/features/publications/components/PublicationsList/PublicationsList.test.tsx
new file mode 100644
index 000000000..3ad0d5d35
--- /dev/null
+++ b/src/features/publications/components/PublicationsList/PublicationsList.test.tsx
@@ -0,0 +1,104 @@
+import {
+  mirrors,
+  publicationTargets,
+  publications,
+} from "@/tests/mocks/publications";
+import { renderWithProviders } from "@/tests/render";
+import { screen, within } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it } from "vitest";
+import PublicationsList from "./PublicationsList";
+
+const buildDisplayNameMaps = (pubs: typeof publications) => {
+  const sourceDisplayNames: Record<string, string> = {};
+  const publicationTargetDisplayNames: Record<string, string> = {};
+
+  for (const pub of pubs) {
+    const mirror = mirrors.find((m) => m.name === pub.source);
+    if (mirror?.name) sourceDisplayNames[mirror.name] = mirror.displayName;
+
+    const target = publicationTargets.find(
+      (t) => t.name === pub.publicationTarget,
+    );
+    if (target?.name)
+      publicationTargetDisplayNames[target.name] = target.displayName;
+  }
+
+  return { sourceDisplayNames, publicationTargetDisplayNames };
+};
+
+describe("PublicationsList", () => {
+  const user = userEvent.setup();
+  const [publication] = publications;
+  const { sourceDisplayNames, publicationTargetDisplayNames } =
+    buildDisplayNameMaps(publications);
+
+  it("renders list columns and row data", () => {
+    renderWithProviders(
+      <PublicationsList
+        publications={publications}
+        sourceDisplayNames={sourceDisplayNames}
+        publicationTargetDisplayNames={publicationTargetDisplayNames}
+      />,
+    );
+
+    expect(screen.getByRole("columnheader", { name: "name" })).toBeVisible();
+    expect(
+      screen.getByRole("columnheader", { name: "source type" }),
+    ).toBeVisible();
+    expect(screen.getByRole("columnheader", { name: "source" })).toBeVisible();
+    expect(
+      screen.getByRole("columnheader", { name: "publication target" }),
+    ).toBeVisible();
+
+    expect(
+      screen.getByRole("button", {
+        name: publication.label,
+      }),
+    ).toBeInTheDocument();
+    expect(screen.getAllByText("Mirror")).toHaveLength(publications.length);
+    expect(
+      screen.getByRole("link", {
+        name: sourceDisplayNames[publication.source],
+      }),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("link", {
+        name: publicationTargetDisplayNames[publication.publicationTarget],
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it("opens sidepanel when clicking a publication name", async () => {
+    renderWithProviders(
+      <PublicationsList
+        publications={publications}
+        sourceDisplayNames={sourceDisplayNames}
+        publicationTargetDisplayNames={publicationTargetDisplayNames}
+      />,
+    );
+    const publicationLabel = publication.label;
+
+    await user.click(screen.getByRole("button", { name: publicationLabel }));
+
+    const sidePanel = screen.getByRole("complementary");
+    expect(sidePanel).toBeInTheDocument();
+    expect(
+      within(sidePanel).getByRole("heading", { name: publicationLabel }),
+    ).toBeInTheDocument();
+  });
+
+  it("shows empty message with search query", () => {
+    renderWithProviders(
+      <PublicationsList publications={[]} />,
+      undefined,
+      "/?query=test-publication",
+    );
+
+    expect(
+      screen.getByText(
+        'No publications found with the search: "test-publication"',
+      ),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/publications/components/PublicationsList/PublicationsList.tsx b/src/features/publications/components/PublicationsList/PublicationsList.tsx
new file mode 100644
index 000000000..6dacd0011
--- /dev/null
+++ b/src/features/publications/components/PublicationsList/PublicationsList.tsx
@@ -0,0 +1,96 @@
+import { LIST_ACTIONS_COLUMN_PROPS } from "@/components/layout/ListActions/constants";
+import ResponsiveTable from "@/components/layout/ResponsiveTable";
+import StaticLink from "@/components/layout/StaticLink";
+import usePageParams from "@/hooks/usePageParams";
+import { Button } from "@canonical/react-components";
+import type { FC } from "react";
+import { useMemo } from "react";
+import type { CellProps, Column } from "react-table";
+import type { Publication } from "../../types";
+import PublicationsListActions from "../PublicationsListActions";
+import {
+  getPublicationTargetName,
+  getSourceName,
+  getSourceType,
+} from "../../helpers";
+
+interface PublicationsListProps {
+  readonly publications: Publication[];
+  readonly sourceDisplayNames?: Record<string, string>;
+  readonly publicationTargetDisplayNames?: Record<string, string>;
+}
+
+const PublicationsList: FC<PublicationsListProps> = ({
+  publications,
+  sourceDisplayNames = {},
+  publicationTargetDisplayNames = {},
+}) => {
+  const { query, createPageParamsSetter } = usePageParams();
+
+  const columns = useMemo<Column<Publication>[]>(
+    () => [
+      {
+        accessor: "name",
+        Header: "name",
+        Cell: ({ row }: CellProps<Publication>) => (
+          <Button
+            type="button"
+            appearance="link"
+            className="u-no-margin--bottom u-no-padding--top u-align-text--left"
+            onClick={createPageParamsSetter({
+              sidePath: ["view"],
+              publication: row.original.publicationId,
+            })}
+          >
+            {row.original.label}
+          </Button>
+        ),
+      },
+      {
+        id: "sourceType",
+        accessor: "source",
+        Header: "source type",
+        Cell: ({ row: { original } }: CellProps<Publication>) => (
+          <>{getSourceType(original.source)}</>
+        ),
+      },
+      {
+        accessor: "source",
+        Header: "source",
+        Cell: ({ row: { original } }: CellProps<Publication>) => (
+          <StaticLink to="/">
+            {sourceDisplayNames[original.source] ??
+              getSourceName(original.source)}
+          </StaticLink>
+        ),
+      },
+      {
+        accessor: "publicationTarget",
+        Header: "publication target",
+        Cell: ({ row: { original } }: CellProps<Publication>) => (
+          <StaticLink to="/">
+            {publicationTargetDisplayNames[original.publicationTarget] ??
+              getPublicationTargetName(original.publicationTarget)}
+          </StaticLink>
+        ),
+      },
+      {
+        ...LIST_ACTIONS_COLUMN_PROPS,
+        Cell: ({ row: { original } }: CellProps<Publication>) => (
+          <PublicationsListActions publication={original} />
+        ),
+      },
+    ],
+    [createPageParamsSetter, sourceDisplayNames, publicationTargetDisplayNames],
+  );
+
+  return (
+    <ResponsiveTable
+      columns={columns}
+      data={publications}
+      emptyMsg={`No publications found with the search: "${query}"`}
+    />
+  );
+};
+
+export default PublicationsList;
diff --git a/src/features/publications/components/PublicationsList/index.ts b/src/features/publications/components/PublicationsList/index.ts
new file mode 100644
index 000000000..d28119ae6
--- /dev/null
+++ b/src/features/publications/components/PublicationsList/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublicationsList";
diff --git a/src/features/publications/components/PublicationsListActions/PublicationsListActions.test.tsx b/src/features/publications/components/PublicationsListActions/PublicationsListActions.test.tsx
new file mode 100644
index 000000000..465a208c7
--- /dev/null
+++ b/src/features/publications/components/PublicationsListActions/PublicationsListActions.test.tsx
@@ -0,0 +1,70 @@
+import { publications } from "@/tests/mocks/publications";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it } from "vitest";
+import PublicationsListActions from "./PublicationsListActions";
+
+describe("PublicationsListActions", () => {
+  const user = userEvent.setup();
+  const [publication] = publications;
+  const publicationLabel = publication.label;
+
+  it("shows all dropdown actions", async () => {
+    renderWithProviders(<PublicationsListActions publication={publication} />);
+
+    await user.click(
+      screen.getByRole("button", { name: `${publicationLabel} actions` }),
+    );
+
+    expect(
+      screen.getByRole("menuitem", {
+        name: `View details of "${publicationLabel}" publication`,
+      }),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("menuitem", {
+        name: `Republish "${publicationLabel}" publication`,
+      }),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("menuitem", {
+        name: `Remove "${publicationLabel}" publication`,
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it("opens republish modal from menu", async () => {
+    renderWithProviders(<PublicationsListActions publication={publication} />);
+
+    await user.click(
+      screen.getByRole("button", { name: `${publicationLabel} actions` }),
+    );
+    await user.click(
+      screen.getByRole("menuitem", {
+        name: `Republish "${publicationLabel}" publication`,
+      }),
+    );
+
+    expect(
+      screen.getByRole("heading", { name: `Republish ${publicationLabel}` }),
+    ).toBeInTheDocument();
+  });
+
+  it("opens remove modal from menu", async () => {
+    renderWithProviders(<PublicationsListActions publication={publication} />);
+
+    await user.click(
+      screen.getByRole("button", { name: `${publicationLabel} actions` }),
+    );
+    await user.click(
+      screen.getByRole("menuitem", {
+        name: `Remove "${publicationLabel}" publication`,
+      }),
+    );
+
+    expect(
+      screen.getByRole("heading", { name: `Remove ${publicationLabel}` }),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/publications/components/PublicationsListActions/PublicationsListActions.tsx b/src/features/publications/components/PublicationsListActions/PublicationsListActions.tsx
new file mode 100644
index 000000000..2fa1c7674
--- /dev/null
+++ b/src/features/publications/components/PublicationsListActions/PublicationsListActions.tsx
@@ -0,0 +1,82 @@
+import ListActions from "@/components/layout/ListActions";
+import usePageParams from "@/hooks/usePageParams";
+import type { Action } from "@/types/Action";
+import type { FC } from "react";
+import { useBoolean } from "usehooks-ts";
+import type { Publication } from "../../types";
+import RemovePublicationModal from "../RemovePublicationModal";
+import RepublishPublicationModal from "../RepublishPublicationModal";
+
+interface PublicationsListActionsProps {
+  readonly publication: Publication;
+}
+
+const PublicationsListActions: FC<PublicationsListActionsProps> = ({
+  publication,
+}) => {
+  const { createPageParamsSetter } = usePageParams();
+  const publicationLabel = publication.label;
+
+  const {
+    value: isRemoveModalOpen,
+    setTrue: openRemovalModal,
+    setFalse: closeRemovalModal,
+  } = useBoolean();
+
+  const {
+    value: isRepublishModalOpen,
+    setTrue: openRepublishModal,
+    setFalse: closeRepublishModal,
+  } = useBoolean();
+
+  const actions: Action[] = [
+    {
+      icon: "show",
+      label: "View details",
+      "aria-label": `View details of "${publicationLabel}" publication`,
+      onClick: createPageParamsSetter({
+        sidePath: ["view"],
+        publication: publication.publicationId,
+      }),
+    },
+    {
+      icon: "upload",
+      label: "Republish",
+      "aria-label": `Republish "${publicationLabel}" publication`,
+      onClick: openRepublishModal,
+    },
+  ];
+
+  const destructiveActions: Action[] = [
+    {
+      icon: "delete",
+      label: "Remove",
+      "aria-label": `Remove "${publicationLabel}" publication`,
+      onClick: openRemovalModal,
+    },
+  ];
+
+  return (
+    <>
+      <ListActions
+        toggleAriaLabel={`${publicationLabel} actions`}
+        actions={actions}
+        destructiveActions={destructiveActions}
+      />
+
+      <RepublishPublicationModal
+        isOpen={isRepublishModalOpen}
+        close={closeRepublishModal}
+        publication={publication}
+      />
+
+      <RemovePublicationModal
+        isOpen={isRemoveModalOpen}
+        close={closeRemovalModal}
+        publication={publication}
+      />
+    </>
+  );
+};
+
+export default PublicationsListActions;
diff --git a/src/features/publications/components/PublicationsListActions/index.ts b/src/features/publications/components/PublicationsListActions/index.ts
new file mode 100644
index 000000000..b3a2f40f2
--- /dev/null
+++ b/src/features/publications/components/PublicationsListActions/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublicationsListActions";
diff --git a/src/features/publications/components/RemovePublicationModal/RemovePublicationModal.test.tsx b/src/features/publications/components/RemovePublicationModal/RemovePublicationModal.test.tsx
new file mode 100644
index 000000000..5458c960b
--- /dev/null
+++ b/src/features/publications/components/RemovePublicationModal/RemovePublicationModal.test.tsx
@@ -0,0 +1,68 @@
+import { publications } from "@/tests/mocks/publications";
+import { setEndpointStatus } from "@/tests/controllers/controller";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import type { ComponentProps } from "react";
+import { describe, expect, it, vi } from "vitest";
+import RemovePublicationModal from "./RemovePublicationModal";
+import { ENDPOINT_STATUS_API_ERROR_MESSAGE } from "@/tests/server/handlers/_constants";
+
+describe("RemovePublicationModal", () => {
+  const user = userEvent.setup();
+  const [publication] = publications;
+  const publicationLabel = publication.label;
+
+  it("does not render when closed", () => {
+    const props: ComponentProps<typeof RemovePublicationModal> = {
+      close: vi.fn(),
+      isOpen: false,
+      publication,
+    };
+
+    renderWithProviders(<RemovePublicationModal {...props} />);
+
+    expect(
+      screen.queryByRole("heading", { name: `Remove ${publicationLabel}` }),
+    ).not.toBeInTheDocument();
+  });
+
+  it("removes a publication and closes modal", async () => {
+    const props: ComponentProps<typeof RemovePublicationModal> = {
+      close: vi.fn(),
+      isOpen: true,
+      publication,
+    };
+
+    renderWithProviders(<RemovePublicationModal {...props} />);
+
+    await user.click(screen.getByRole("button", { name: "Remove publication" }));
+
+    expect(props.close).toHaveBeenCalledTimes(1);
+    expect(
+      await screen.findByText(`You have successfully removed ${publicationLabel}`),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByText("The publication has been removed from Landscape."),
+    ).toBeInTheDocument();
+  });
+
+  it("shows an error notification when removing fails", async () => {
+    const props: ComponentProps<typeof RemovePublicationModal> = {
+      close: vi.fn(),
+      isOpen: true,
+      publication,
+    };
+
+    setEndpointStatus({ status: "error", path: "/publications" });
+
+    renderWithProviders(<RemovePublicationModal {...props} />);
+
+    await user.click(screen.getByRole("button", { name: "Remove publication" }));
+
+    expect(props.close).toHaveBeenCalledTimes(1);
+    expect(
+      await screen.findByText(ENDPOINT_STATUS_API_ERROR_MESSAGE),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/publications/components/RemovePublicationModal/RemovePublicationModal.tsx b/src/features/publications/components/RemovePublicationModal/RemovePublicationModal.tsx
new file mode 100644
index 000000000..92c999bb2
--- /dev/null
+++ b/src/features/publications/components/RemovePublicationModal/RemovePublicationModal.tsx
@@ -0,0 +1,65 @@
+import type { TextConfirmationModalProps } from "@/components/form/TextConfirmationModal";
+import useDebug from "@/hooks/useDebug";
+import useNotify from "@/hooks/useNotify";
+import { ConfirmationModal } from "@canonical/react-components";
+import type { FC } from "react";
+import type { Publication } from "../../types";
+import { useDeletePublication } from "../../api";
+
+interface RemovePublicationModalProps extends Pick<
+  TextConfirmationModalProps,
+  "close" | "isOpen"
+> {
+  readonly publication: Publication;
+}
+
+const RemovePublicationModal: FC<RemovePublicationModalProps> = ({
+  close,
+  isOpen,
+  publication,
+}) => {
+  const debug = useDebug();
+  const { notify } = useNotify();
+  const { deletePublication, isRemovingPublication } = useDeletePublication();
+
+  const handleRemovePublication = async () => {
+    try {
+      await deletePublication({ publicationName: publication.name });
+
+      notify.success({
+        title: `You have successfully removed ${publication.label}`,
+        message: "The publication has been removed from Landscape.",
+      });
+    } catch (error) {
+      debug(error);
+    } finally {
+      close();
+    }
+  };
+
+  if (!isOpen) {
+    return null;
+  }
+
+  return (
+    <ConfirmationModal
+      renderInPortal
+      title={`Remove ${publication.label}`}
+      confirmButtonLabel="Remove publication"
+      confirmButtonAppearance="negative"
+      confirmButtonLoading={isRemovingPublication}
+      confirmButtonDisabled={isRemovingPublication}
+      onConfirm={handleRemovePublication}
+      close={close}
+    >
+      <p>
+        Removing this publication will prevent you from being able to publish
+        mirrors to it or manage it from Landscape. This WILL NOT remove the
+        publication from its publication target. This action is{" "}
+        <b>irreversible</b>.
+      </p>
+    </ConfirmationModal>
+  );
+};
+
+export default RemovePublicationModal;
diff --git a/src/features/publications/components/RemovePublicationModal/index.ts b/src/features/publications/components/RemovePublicationModal/index.ts
new file mode 100644
index 000000000..aa1930f46
--- /dev/null
+++ b/src/features/publications/components/RemovePublicationModal/index.ts
@@ -0,0 +1 @@
+export { default } from "./RemovePublicationModal";
diff --git a/src/features/publications/components/RepublishPublicationModal/RepublishPublicationModal.test.tsx b/src/features/publications/components/RepublishPublicationModal/RepublishPublicationModal.test.tsx
new file mode 100644
index 000000000..354c0c9bf
--- /dev/null
+++ b/src/features/publications/components/RepublishPublicationModal/RepublishPublicationModal.test.tsx
@@ -0,0 +1,70 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
+import { publications } from "@/tests/mocks/publications";
+import { renderWithProviders } from "@/tests/render";
+import { ENDPOINT_STATUS_API_ERROR_MESSAGE } from "@/tests/server/handlers/_constants";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import type { ComponentProps } from "react";
+import { describe, expect, it, vi } from "vitest";
+import RepublishPublicationModal from "./RepublishPublicationModal";
+
+describe("RepublishPublicationModal", () => {
+  const user = userEvent.setup();
+  const [publication] = publications;
+  const publicationLabel = publication.label;
+
+  it("does not render when closed", () => {
+    const props: ComponentProps<typeof RepublishPublicationModal> = {
+      close: vi.fn(),
+      isOpen: false,
+      publication,
+    };
+
+    renderWithProviders(<RepublishPublicationModal {...props} />);
+
+    expect(
+      screen.queryByRole("heading", { name: `Republish ${publicationLabel}` }),
+    ).not.toBeInTheDocument();
+  });
+
+  it("republishes a publication and closes modal", async () => {
+    const props: ComponentProps<typeof RepublishPublicationModal> = {
+      close: vi.fn(),
+      isOpen: true,
+      publication,
+    };
+
+    renderWithProviders(<RepublishPublicationModal {...props} />);
+
+    await user.click(screen.getByRole("button", { name: "Republish" }));
+
+    expect(props.close).toHaveBeenCalledTimes(1);
+    expect(
+      await screen.findByText(`You have marked ${publicationLabel} to be republished`),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByText(
+        "This publication has been queued for republishing to the designated target.",
+      ),
+    ).toBeInTheDocument();
+  });
+
+  it("shows an error notification when republish fails", async () => {
+    const props: ComponentProps<typeof RepublishPublicationModal> = {
+      close: vi.fn(),
+      isOpen: true,
+      publication,
+    };
+
+    setEndpointStatus({ status: "error", path: "publications/publish" });
+
+    renderWithProviders(<RepublishPublicationModal {...props} />);
+
+    await user.click(screen.getByRole("button", { name: "Republish" }));
+
+    expect(props.close).toHaveBeenCalledTimes(1);
+    expect(
+      await screen.findByText(ENDPOINT_STATUS_API_ERROR_MESSAGE),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/publications/components/RepublishPublicationModal/RepublishPublicationModal.tsx b/src/features/publications/components/RepublishPublicationModal/RepublishPublicationModal.tsx
new file mode 100644
index 000000000..6240acee5
--- /dev/null
+++ b/src/features/publications/components/RepublishPublicationModal/RepublishPublicationModal.tsx
@@ -0,0 +1,66 @@
+import useDebug from "@/hooks/useDebug";
+import useNotify from "@/hooks/useNotify";
+import { ConfirmationModal } from "@canonical/react-components";
+import type { FC } from "react";
+import type { Publication } from "../../types";
+import { usePublishPublication } from "../../api";
+
+interface RepublishPublicationModalProps {
+  readonly publication: Publication;
+  readonly isOpen: boolean;
+  readonly close: () => void;
+}
+
+const RepublishPublicationModal: FC<RepublishPublicationModalProps> = ({
+  publication,
+  isOpen,
+  close,
+}) => {
+  const debug = useDebug();
+  const { notify } = useNotify();
+  const { publishPublication, isPublishingPublication } =
+    usePublishPublication();
+
+  const handleRepublishPublication = async () => {
+    try {
+      await publishPublication({
+        publicationName: publication.name,
+        body: { forceOverwrite: true, forceCleanup: true },
+      });
+
+      notify.success({
+        title: `You have marked ${publication.label} to be republished`,
+        message:
+          "This publication has been queued for republishing to the designated target.",
+      });
+    } catch (error) {
+      debug(error);
+    } finally {
+      close();
+    }
+  };
+
+  if (!isOpen) {
+    return null;
+  }
+
+  return (
+    <ConfirmationModal
+      renderInPortal
+      close={close}
+      title={`Republish ${publication.label}`}
+      confirmButtonLabel="Republish"
+      confirmButtonAppearance="positive"
+      confirmButtonLoading={isPublishingPublication}
+      confirmButtonDisabled={isPublishingPublication}
+      onConfirm={handleRepublishPublication}
+    >
+      <p>
+        Republishing will update the contents of this publication with the
+        latest state of its source mirror.
+      </p>
+    </ConfirmationModal>
+  );
+};
+
+export default RepublishPublicationModal;
diff --git a/src/features/publications/components/RepublishPublicationModal/index.ts b/src/features/publications/components/RepublishPublicationModal/index.ts
new file mode 100644
index 000000000..201745dd3
--- /dev/null
+++ b/src/features/publications/components/RepublishPublicationModal/index.ts
@@ -0,0 +1 @@
+export { default } from "./RepublishPublicationModal";
diff --git a/src/features/publications/helpers.ts b/src/features/publications/helpers.ts
new file mode 100644
index 000000000..6c92b4290
--- /dev/null
+++ b/src/features/publications/helpers.ts
@@ -0,0 +1,21 @@
+export const getSourceType = (source: string) => {
+  if (source.startsWith("mirrors/")) {
+    return "Mirror";
+  }
+
+  if (source.startsWith("locals/")) {
+    return "Local repository";
+  }
+
+  return "Unknown";
+};
+
+export const getSourceName = (source: string) => {
+  const parts = source.split("/");
+  return parts.length > 1 ? (parts[1] ?? source) : source;
+};
+
+export const getPublicationTargetName = (publicationTarget: string) => {
+  const parts = publicationTarget.split("/");
+  return parts.length > 1 ? (parts[1] ?? publicationTarget) : publicationTarget;
+};
diff --git a/src/features/publications/index.ts b/src/features/publications/index.ts
new file mode 100644
index 000000000..e1c9265e4
--- /dev/null
+++ b/src/features/publications/index.ts
@@ -0,0 +1,14 @@
+export { default as PublicationsContainer } from "./components/PublicationsContainer";
+export { default as AddPublicationButton } from "./components/AddPublicationButton";
+export { default as PublicationDetails } from "./components/PublicationDetails";
+export { default as PublicationDetailsSidePanel } from "./components/PublicationDetailsSidePanel";
+export type {
+  Publication,
+  PublicationTarget,
+  Local,
+  Mirror,
+  PublishPublicationResponse,
+  BatchGetLocalsResponse,
+  BatchGetMirrorsResponse,
+  BatchGetPublicationTargetsResponse,
+} from "./types";
diff --git a/src/features/publications/types/Publication.ts b/src/features/publications/types/Publication.ts
new file mode 100644
index 000000000..ed61aabca
--- /dev/null
+++ b/src/features/publications/types/Publication.ts
@@ -0,0 +1,134 @@
+interface GpgKeyWritable {
+  armor: string;
+}
+
+interface GpgKey extends Record<string, unknown> {
+  armor: string;
+}
+
+interface UploadersGroup {
+  title: string;
+  users?: string[];
+}
+
+interface UploadersRule {
+  condition: string;
+  allow?: string[];
+  deny?: string[];
+}
+
+interface Uploaders {
+  groups?: UploadersGroup[];
+  rules?: UploadersRule[];
+}
+
+export interface Local extends Record<string, unknown> {
+  name?: string;
+  localId?: string;
+  displayName: string;
+  comment?: string;
+  defaultDistribution?: string;
+  defaultComponent?: string;
+  uploaders?: Uploaders;
+}
+
+export interface Mirror extends Record<string, unknown> {
+  name?: string;
+  mirrorId?: string;
+  status?: string;
+  displayName: string;
+  archiveRoot: string;
+  distribution?: string;
+  architectures?: string[];
+  components?: string[];
+}
+
+export interface PublicationTarget extends Record<string, unknown> {
+  name?: string;
+  displayName: string;
+  publicationTargetId?: string;
+}
+
+export interface PublicationWritable {
+  name?: string;
+  publicationTarget: string;
+  source: string;
+  distribution?: string;
+  label?: string;
+  origin?: string;
+  architectures?: string[];
+  acquireByHash?: boolean;
+  butAutomaticUpgrades?: boolean;
+  notAutomatic?: boolean;
+  multiDist?: boolean;
+  skipBz2?: boolean;
+  skipContents?: boolean;
+  gpgKey?: GpgKeyWritable;
+}
+
+export interface Publication extends Record<string, unknown> {
+  publicationId: string;
+  name: string;
+  publicationTarget: string;
+  source: string;
+  distribution: string;
+  label: string;
+  origin: string;
+  architectures: string[];
+  acquireByHash: boolean;
+  butAutomaticUpgrades: boolean;
+  notAutomatic: boolean;
+  multiDist: boolean;
+  skipBz2: boolean;
+  skipContents: boolean;
+  gpgKey?: GpgKey;
+}
+
+export interface ListPublicationsResponse {
+  publications?: Publication[];
+  nextPageToken?: string;
+}
+
+export interface ListLocalsResponse {
+  locals?: Local[];
+  nextPageToken?: string;
+}
+
+export interface ListMirrorsResponse {
+  mirrors?: Mirror[];
+  nextPageToken?: string;
+}
+
+export interface ListPublicationTargetsResponse {
+  publicationTargets?: PublicationTarget[];
+  nextPageToken?: string;
+}
+
+interface Task {
+  name?: string;
+  displayName?: string;
+  taskId?: string;
+  status?: string;
+  output?: string;
+}
+
+export interface BatchGetPublicationTargetsResponse {
+  publicationTargets?: PublicationTarget[];
+}
+
+export interface BatchGetMirrorsResponse {
+  mirrors?: Mirror[];
+}
+
+export interface BatchGetLocalsResponse {
+  locals?: Local[];
+}
+
+export interface PublishPublicationResponse {
+  task?: Task;
+}
+
+export interface PublicationServicePublishPublicationBody {
+  forceOverwrite: boolean;
+  forceCleanup: boolean;
+}
diff --git a/src/features/publications/types/index.ts b/src/features/publications/types/index.ts
new file mode 100644
index 000000000..a246b4f9e
--- /dev/null
+++ b/src/features/publications/types/index.ts
@@ -0,0 +1,15 @@
+export type {
+  BatchGetLocalsResponse,
+  BatchGetMirrorsResponse,
+  BatchGetPublicationTargetsResponse,
+  ListLocalsResponse,
+  ListMirrorsResponse,
+  ListPublicationsResponse,
+  ListPublicationTargetsResponse,
+  Local,
+  Mirror,
+  Publication,
+  PublicationTarget,
+  PublicationWritable,
+  PublishPublicationResponse,
+} from "./Publication";
diff --git a/src/hooks/useFetchDebArchive.ts b/src/hooks/useFetchDebArchive.ts
new file mode 100644
index 000000000..62cc35549
--- /dev/null
+++ b/src/hooks/useFetchDebArchive.ts
@@ -0,0 +1,14 @@
+import { useContext } from "react";
+import { FetchDebArchiveContext } from "@/api/fetchDebArchive";
+
+export default function useFetchDebArchive() {
+  const fetch = useContext(FetchDebArchiveContext);
+
+  if (!fetch) {
+    throw new Error(
+      "useFetchDebArchive must be used within FetchDebArchiveProvider",
+    );
+  }
+
+  return fetch;
+}
diff --git a/src/libs/pageParamsManager/constants.ts b/src/libs/pageParamsManager/constants.ts
index 44358b2c1..26c1b6a4c 100644
--- a/src/libs/pageParamsManager/constants.ts
+++ b/src/libs/pageParamsManager/constants.ts
@@ -140,4 +140,9 @@ export const PARAMS_CONFIG: ParamsConfig = [
     shouldResetPage: false,
     defaultValue: DEFAULT_EMPTY_STRING,
   },
+  {
+    urlParam: "publication",
+    shouldResetPage: false,
+    defaultValue: DEFAULT_EMPTY_STRING,
+  },
 ];
diff --git a/src/libs/pageParamsManager/types.ts b/src/libs/pageParamsManager/types.ts
index b623b11b0..6eaba8b06 100644
--- a/src/libs/pageParamsManager/types.ts
+++ b/src/libs/pageParamsManager/types.ts
@@ -33,6 +33,7 @@ export interface PageParams {
   code: string;
   sidePath: string[];
   profile: string;
+  publication: string;
 }
 
 /**
diff --git a/src/pages/dashboard/repositories/index.ts b/src/pages/dashboard/repositories/index.ts
index 75748440c..95064dcad 100644
--- a/src/pages/dashboard/repositories/index.ts
+++ b/src/pages/dashboard/repositories/index.ts
@@ -1 +1 @@
-export { default } from "./RepositoryPage";
+// export { default } from "./RepositoryPage"; // TODO: discard
diff --git a/src/pages/dashboard/repositories/local-repositories/LocalRepositoriesPage.tsx b/src/pages/dashboard/repositories/local-repositories/LocalRepositoriesPage.tsx
index f76f73c49..8aee14ba5 100644
--- a/src/pages/dashboard/repositories/local-repositories/LocalRepositoriesPage.tsx
+++ b/src/pages/dashboard/repositories/local-repositories/LocalRepositoriesPage.tsx
@@ -8,7 +8,7 @@ import useSidePanel from "@/hooks/useSidePanel";
 import { Button } from "@canonical/react-components";
 import type { FC } from "react";
 import { lazy, Suspense } from "react";
-import { GPG_KEYS_DOCS_URL } from "./constants";
+// import { GPG_KEYS_DOCS_URL } from "./constants";
 
 const NewAPTSourceForm = lazy(async () =>
   import("@/features/apt-sources").then((module) => ({
@@ -57,7 +57,7 @@ const APTSourcesPage: FC = () => {
                   You haven’t added any APT sources yet.
                 </p>
                 <a
-                  href={GPG_KEYS_DOCS_URL}
+                  href="#" // TODO: discard
                   target="_blank"
                   rel="nofollow noopener noreferrer"
                 >
diff --git a/src/pages/dashboard/repositories/mirrors/DistributionsPage.test.tsx b/src/pages/dashboard/repositories/mirrors/MirrorsPage.test.tsx
similarity index 89%
rename from src/pages/dashboard/repositories/mirrors/DistributionsPage.test.tsx
rename to src/pages/dashboard/repositories/mirrors/MirrorsPage.test.tsx
index c64ee5f56..57ca7022b 100644
--- a/src/pages/dashboard/repositories/mirrors/DistributionsPage.test.tsx
+++ b/src/pages/dashboard/repositories/mirrors/MirrorsPage.test.tsx
@@ -9,9 +9,9 @@ import {
   setScreenSize,
 } from "@/tests/helpers";
 import { renderWithProviders } from "@/tests/render";
-import DistributionsPage from "./DistributionsPage";
+import MirrorsPage from "./MirrorsPage";
 
-describe("DistributionsPage", () => {
+describe("MirrorsPage", () => {
   afterEach(() => {
     resetScreenSize();
   });
@@ -19,7 +19,7 @@ describe("DistributionsPage", () => {
   it("renders distributions and large-screen actions", async () => {
     setScreenSize("lg");
 
-    renderWithProviders(<DistributionsPage />);
+    renderWithProviders(<MirrorsPage />);
 
     expect(
       screen.getByRole("heading", { name: "Mirrors" }),
@@ -37,7 +37,7 @@ describe("DistributionsPage", () => {
     setScreenSize("lg");
     setEndpointStatus("empty");
 
-    renderWithProviders(<DistributionsPage />);
+    renderWithProviders(<MirrorsPage />);
 
     await expectLoadingState();
     expect(
@@ -52,7 +52,7 @@ describe("DistributionsPage", () => {
   it("shows actions menu on small screens", async () => {
     setScreenSize("xs");
 
-    renderWithProviders(<DistributionsPage />);
+    renderWithProviders(<MirrorsPage />);
 
     expect(screen.getByRole("button", { name: "Actions" })).toBeInTheDocument();
   });
@@ -62,7 +62,7 @@ describe("DistributionsPage", () => {
     setScreenSize("lg");
 
     renderWithProviders(
-      <DistributionsPage />,
+      <MirrorsPage />,
       undefined,
       ROUTES.repositories.mirrors(),
       `/${PATHS.repositories.root}/${PATHS.repositories.mirrors}`,
@@ -81,7 +81,7 @@ describe("DistributionsPage", () => {
     setScreenSize("lg");
 
     renderWithProviders(
-      <DistributionsPage />,
+      <MirrorsPage />,
       undefined,
       ROUTES.repositories.mirrors(),
       `/${PATHS.repositories.root}/${PATHS.repositories.mirrors}`,
diff --git a/src/pages/dashboard/repositories/publications/PublicationsPage.tsx b/src/pages/dashboard/repositories/publications/PublicationsPage.tsx
index b635c9ce2..acaa0971b 100644
--- a/src/pages/dashboard/repositories/publications/PublicationsPage.tsx
+++ b/src/pages/dashboard/repositories/publications/PublicationsPage.tsx
@@ -1,86 +1,43 @@
-import EmptyState from "@/components/layout/EmptyState";
-import LoadingState from "@/components/layout/LoadingState";
 import PageContent from "@/components/layout/PageContent";
 import PageHeader from "@/components/layout/PageHeader";
 import PageMain from "@/components/layout/PageMain";
-import { APTSourcesList, useGetAPTSources } from "@/features/apt-sources";
-import useSidePanel from "@/hooks/useSidePanel";
-import { Button } from "@canonical/react-components";
+import SidePanel from "@/components/layout/SidePanel";
+import useSetDynamicFilterValidation from "@/hooks/useDynamicFilterValidation";
+import usePageParams from "@/hooks/usePageParams";
+import {
+  AddPublicationButton,
+  PublicationDetailsSidePanel,
+  PublicationsContainer,
+} from "@/features/publications";
 import type { FC } from "react";
-import { lazy, Suspense } from "react";
-import { APT_SOURCES_DOCS_URL } from "./constants";
 
-const NewAPTSourceForm = lazy(async () =>
-  import("@/features/apt-sources").then((module) => ({
-    default: module.NewAPTSourceForm,
-  })),
-);
+const PublicationsPage: FC = () => {
+  const { sidePath, createPageParamsSetter } = usePageParams();
 
-const APTSourcesPage: FC = () => {
-  const { setSidePanelContent } = useSidePanel();
-  const { aptSources: items, isGettingAPTSources: isLoading } =
-    useGetAPTSources();
-
-  const handleOpen = () => {
-    setSidePanelContent(
-      "Add APT source",
-      <Suspense fallback={<LoadingState />}>
-        <NewAPTSourceForm />
-      </Suspense>,
-    );
-  };
+  useSetDynamicFilterValidation("sidePath", ["view"]);
 
   return (
     <PageMain>
       <PageHeader
-        title="APT sources"
-        actions={[
-          <Button
-            key="new-key-button"
-            appearance="positive"
-            onClick={handleOpen}
-            type="button"
-          >
-            Add APT source
-          </Button>,
-        ]}
+        title="Publications"
+        actions={[<AddPublicationButton key="add-publication-button" />]}
       />
       <PageContent hasTable>
-        {isLoading && <LoadingState />}
-        {!isLoading && items.length === 0 && (
-          <EmptyState
-            title="No APT sources found"
-            icon="connected"
-            body={
-              <>
-                <p className="u-no-margin--bottom">
-                  You haven’t added any APT sources yet.
-                </p>
-                <a
-                  href={APT_SOURCES_DOCS_URL}
-                  target="_blank"
-                  rel="nofollow noopener noreferrer"
-                >
-                  How to manage APT sources in Landscape
-                </a>
-              </>
-            }
-            cta={[
-              <Button
-                appearance="positive"
-                key="table-add-new-mirror"
-                onClick={handleOpen}
-                type="button"
-              >
-                Add APT source
-              </Button>,
-            ]}
-          />
-        )}
-        {!isLoading && items.length > 0 && <APTSourcesList items={items} />}
+        <PublicationsContainer />
       </PageContent>
+
+      <SidePanel
+        isOpen={!!sidePath.length}
+        onClose={createPageParamsSetter({ sidePath: [], publication: "" })}
+      >
+        {sidePath.includes("view") && (
+          <SidePanel.Suspense key="view">
+            <PublicationDetailsSidePanel />
+          </SidePanel.Suspense>
+        )}
+      </SidePanel>
     </PageMain>
   );
 };
 
-export default APTSourcesPage;
+export default PublicationsPage;
diff --git a/src/providers/AppProviders.tsx b/src/providers/AppProviders.tsx
index 5d5068ca2..8952b7ffe 100644
--- a/src/providers/AppProviders.tsx
+++ b/src/providers/AppProviders.tsx
@@ -1,6 +1,7 @@
 import type { FC, ReactNode } from "react";
 import AuthProvider from "@/context/auth";
 import FetchProvider from "@/api/fetch";
+import FetchDebArchiveProvider from "@/api/fetchDebArchive";
 import FetchOldProvider from "@/api/fetchOld";
 import NotifyProvider from "@/context/notify";
 import EnvProvider from "@/context/env";
@@ -21,7 +22,9 @@ export const AppProviders: FC<AppProvidersProps> = ({ children }) => {
             <AuthProvider>
               <AccountsProvider>
                 <FetchOldProvider>
-                  <FetchProvider>{children}</FetchProvider>
+                  <FetchDebArchiveProvider>
+                    <FetchProvider>{children}</FetchProvider>
+                  </FetchDebArchiveProvider>
                 </FetchOldProvider>
               </AccountsProvider>
             </AuthProvider>
diff --git a/src/routes/DashboardRoutes.tsx b/src/routes/DashboardRoutes.tsx
index 0c61a7648..fbe809ad3 100644
--- a/src/routes/DashboardRoutes.tsx
+++ b/src/routes/DashboardRoutes.tsx
@@ -8,6 +8,7 @@ import { ACCOUNT_SETTINGS } from "@/templates/dashboard/SecondaryNavigation/cons
 import DarkModeSwitch from "@/templates/dashboard/SecondaryNavigation/components/DarkModeSwitch";
 import { REPOSITORY_SUBMENU } from "@/templates/dashboard/Navigation/constants";
 import { SelfHostedGuard } from "@/components/guards/SelfHostedGuard";
+import classes from "@/templates/dashboard/DashboardTemplate.module.scss";
 
 export const DashboardRoutes = (
   <Route
@@ -79,21 +80,25 @@ export const DashboardRoutes = (
         path={PATHS.repositories.root}
         element={
           <SelfHostedGuard>
-            <SecondaryNavigation
-              title="Repositories"
-              items={REPOSITORY_SUBMENU}
-            />
-            <Outlet />
+            <div className={classes.wrapper}>
+              <SecondaryNavigation
+                title="Repositories"
+                items={REPOSITORY_SUBMENU}
+              />
+              <div className={classes.pageContent}>
+                <Outlet />
+              </div>
+            </div>
           </SelfHostedGuard>
         }
       >
         <Route
           path={PATHS.repositories.mirrors}
           element={
-          <SelfHostedGuard>
-            <Pages.MirrorsPage />
-          </SelfHostedGuard>
-        }
+            <SelfHostedGuard>
+              <Pages.MirrorsPage />
+            </SelfHostedGuard>
+          }
         />
         <Route
           path={PATHS.repositories.localRepositories}
@@ -125,7 +130,7 @@ export const DashboardRoutes = (
             <SelfHostedGuard>
               <Pages.RepositoryProfilesPage />
             </SelfHostedGuard>
-          }     
+          }
         />
       </Route>
 
@@ -169,13 +174,17 @@ export const DashboardRoutes = (
         path={PATHS.account.root}
         element={
           <>
-            <SecondaryNavigation
-              title={ACCOUNT_SETTINGS.label}
-              items={ACCOUNT_SETTINGS.items}
-            >
-              <DarkModeSwitch />
-            </SecondaryNavigation>
-            <Outlet />
+            <div className={classes.wrapper}>
+              <SecondaryNavigation
+                title={ACCOUNT_SETTINGS.label}
+                items={ACCOUNT_SETTINGS.items}
+              >
+                <DarkModeSwitch />
+              </SecondaryNavigation>
+              <div className={classes.pageContent}>
+                <Outlet />
+              </div>
+            </div>
           </>
         }
       >
diff --git a/src/templates/dashboard/DashboardTemplate.module.scss b/src/templates/dashboard/DashboardTemplate.module.scss
index 7c3da587b..c1b1e8f82 100644
--- a/src/templates/dashboard/DashboardTemplate.module.scss
+++ b/src/templates/dashboard/DashboardTemplate.module.scss
@@ -3,3 +3,10 @@
 .wrapper {
   display: flex;
 }
+
+.pageContent {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  width: 100%;
+}
diff --git a/src/templates/dashboard/DashboardTemplate.tsx b/src/templates/dashboard/DashboardTemplate.tsx
index d6d6c8c2e..bb7ead374 100644
--- a/src/templates/dashboard/DashboardTemplate.tsx
+++ b/src/templates/dashboard/DashboardTemplate.tsx
@@ -19,7 +19,8 @@ const DashboardTemplate: FC<DashboardTemplateProps> = ({ children }) => {
         <Sidebar />
         <ApplicationIdContext value={applicationId}>
           <main className={classNames("l-main", classes.wrapper)}>
-            {children}
+            <div className={classes.pageContent}>{children}</div>
+            {/* {children} */}
           </main>
         </ApplicationIdContext>
       </SidePanelProvider>
diff --git a/src/tests/browser.ts b/src/tests/browser.ts
index b46a3b2b4..cef515ab6 100644
--- a/src/tests/browser.ts
+++ b/src/tests/browser.ts
@@ -1,4 +1,9 @@
-import { API_URL, API_URL_OLD, MSW_ENDPOINTS_TO_INTERCEPT } from "@/constants";
+import {
+  API_URL,
+  API_URL_DEB_ARCHIVE,
+  API_URL_OLD,
+  MSW_ENDPOINTS_TO_INTERCEPT,
+} from "@/constants";
 import type { RequestHandler } from "msw";
 import { http, HttpResponse, passthrough } from "msw";
 import { setupWorker } from "msw/browser";
@@ -13,7 +18,11 @@ const handlers: RequestHandler[] = [
     return;
   }),
   http.all("*", async ({ request }) => {
-    if (!request.url.includes(API_URL) && !request.url.includes(API_URL_OLD)) {
+    if (
+      !request.url.includes(API_URL) &&
+      !request.url.includes(API_URL_OLD) &&
+      !request.url.includes(API_URL_DEB_ARCHIVE)
+    ) {
       return passthrough();
     }
 
diff --git a/src/tests/mocks/publications.ts b/src/tests/mocks/publications.ts
new file mode 100644
index 000000000..55f5c4fe9
--- /dev/null
+++ b/src/tests/mocks/publications.ts
@@ -0,0 +1,93 @@
+import type {
+  Local,
+  Mirror,
+  Publication,
+  PublicationTarget,
+} from "@/features/publications";
+
+export const publications = [
+  {
+    name: "publications/7b1d5c2f-0c4e-4d8e-8f2f-99d4f2d9a123",
+    publicationId: "7b1d5c2f-0c4e-4d8e-8f2f-99d4f2d9a123",
+    publicationTarget: "publicationTargets/primary-us-mirror",
+    source: "mirrors/ubuntu-archive-mirror",
+    distribution: "jammy",
+    label: "Primary publication",
+    origin: "Canonical",
+    architectures: ["amd64", "arm64"],
+    acquireByHash: true,
+    butAutomaticUpgrades: false,
+    notAutomatic: false,
+    multiDist: false,
+    skipBz2: false,
+    skipContents: false,
+  },
+  {
+    name: "publications/c9f6355e-c8f3-4e73-ab4c-ef6a4c8af4c0",
+    publicationId: "c9f6355e-c8f3-4e73-ab4c-ef6a4c8af4c0",
+    publicationTarget: "publicationTargets/emea-mirror",
+    source: "mirrors/ubuntu-security-mirror",
+    distribution: "noble",
+    label: "EMEA publication",
+    origin: "Canonical",
+    architectures: ["amd64"],
+    acquireByHash: false,
+    butAutomaticUpgrades: true,
+    notAutomatic: true,
+    multiDist: true,
+    skipBz2: true,
+    skipContents: true,
+    gpgKey: {
+      armor: "-----BEGIN PGP PRIVATE KEY BLOCK-----...",
+    },
+  },
+] as const satisfies Publication[];
+
+export const mirrors = [
+  {
+    name: "mirrors/ubuntu-archive-mirror",
+    mirrorId: "ubuntu-archive-mirror",
+    displayName: "Ubuntu archive mirror",
+    archiveRoot: "https://archive.ubuntu.com/ubuntu",
+    distribution: "jammy",
+    components: ["main", "restricted", "universe", "multiverse"],
+    architectures: ["amd64", "arm64"],
+  },
+  {
+    name: "mirrors/ubuntu-security-mirror",
+    mirrorId: "ubuntu-security-mirror",
+    displayName: "Security mirror",
+    archiveRoot: "https://security.ubuntu.com/ubuntu",
+    distribution: "noble",
+    components: ["main", "universe"],
+    architectures: ["amd64"],
+  },
+] as const satisfies Mirror[];
+
+export const locals = [
+  {
+    name: "locals/internal-packages",
+    localId: "internal-packages",
+    displayName: "Internal packages",
+    defaultDistribution: "focal",
+    defaultComponent: "main",
+  },
+] as const satisfies Local[];
+
+export const publicationTargets = [
+  {
+    name: "publicationTargets/primary-us-mirror",
+    publicationTargetId: "primary-us-mirror",
+    displayName: "Primary US mirror",
+  },
+  {
+    name: "publicationTargets/emea-mirror",
+    publicationTargetId: "emea-mirror",
+    displayName: "EMEA mirror",
+  },
+  {
+    name: "publicationTargets/internal-datacenter",
+    publicationTargetId: "internal-datacenter",
+    displayName: "Internal datacenter",
+  },
+] as const satisfies PublicationTarget[];
diff --git a/src/tests/server/handlers/features.ts b/src/tests/server/handlers/features.ts
index f9c91d963..41ffef122 100644
--- a/src/tests/server/handlers/features.ts
+++ b/src/tests/server/handlers/features.ts
@@ -6,13 +6,19 @@ import type { Feature } from "@/types/Feature";
 import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
 import { generatePaginatedResponse } from "@/tests/server/handlers/_helpers";
 
+const matchesFeaturesPath = (endpointPath?: string) =>
+  !endpointPath || endpointPath.includes("features");
+
 export default [
   http.get<never, never, ApiPaginatedResponse<Feature>>(
     `${API_URL}features`,
     () => {
       const endpointStatus = getEndpointStatus();
 
-      if (endpointStatus.status === "empty") {
+      if (
+        endpointStatus.status === "empty" &&
+        matchesFeaturesPath(endpointStatus.path)
+      ) {
         return HttpResponse.json(
           generatePaginatedResponse<Feature>({
             data: [],
@@ -22,7 +28,10 @@ export default [
         );
       }
 
-      if (endpointStatus.status === "error") {
+      if (
+        endpointStatus.status === "error" &&
+        matchesFeaturesPath(endpointStatus.path)
+      ) {
         throw new HttpResponse(null, { status: 500 });
       }
 
diff --git a/src/tests/server/handlers/index.ts b/src/tests/server/handlers/index.ts
index 79a0c7a7c..570c1db46 100644
--- a/src/tests/server/handlers/index.ts
+++ b/src/tests/server/handlers/index.ts
@@ -23,6 +23,7 @@ import packageProfile from "./packageProfile";
 import packages from "./packages";
 import pockets from "./pockets";
 import process from "./process";
+import publications from "./publications";
 import rebootProfiles from "./rebootProfiles";
 import removalProfiles from "./removalProfiles";
 import repo from "./repo";
@@ -65,6 +66,7 @@ export default [
   ...packages,
   ...pockets,
   ...process,
+  ...publications,
   ...rebootProfiles,
   ...removalProfiles,
   ...repo,
diff --git a/src/tests/server/handlers/publications.ts b/src/tests/server/handlers/publications.ts
new file mode 100644
index 000000000..56089c93a
--- /dev/null
+++ b/src/tests/server/handlers/publications.ts
@@ -0,0 +1,398 @@
+import { API_URL_DEB_ARCHIVE } from "@/constants";
+import type {
+  PublishPublicationResponse,
+  BatchGetPublicationTargetsResponse,
+  BatchGetMirrorsResponse,
+  BatchGetLocalsResponse,
+} from "@/features/publications";
+import { getEndpointStatus } from "@/tests/controllers/controller";
+import {
+  locals,
+  mirrors,
+  publications,
+  publicationTargets,
+} from "@/tests/mocks/publications";
+import type { StrictResponse } from "msw";
+import { http, HttpResponse } from "msw";
+import { generateFilteredResponse } from "./_helpers";
+import { ENDPOINT_STATUS_API_ERROR } from "./_constants";
+
+const matchesPublicationsPath = (endpointPath?: string) =>
+  !endpointPath || endpointPath.includes("publications");
+
+const getPublicationParam = (requestPublicationName: string) => {
+  const decodedPublicationName = decodeURIComponent(requestPublicationName);
+
+  return publications.find(
+    ({ name, publicationId }) =>
+      name === decodedPublicationName ||
+      publicationId === decodedPublicationName,
+  );
+};
+
+const toObjectBody = (value: unknown): Record<string, unknown> => {
+  if (typeof value === "object" && value !== null) {
+    return value as Record<string, unknown>;
+  }
+
+  return {};
+};
+
+const getPaginationParams = (requestUrl: string) => {
+  const { searchParams } = new URL(requestUrl);
+  const pageSize = parseInt(searchParams.get("pageSize") ?? "20", 10);
+  const pageToken = parseInt(searchParams.get("pageToken") ?? "0", 10) || 0;
+
+  return {
+    pageSize,
+    pageToken,
+  };
+};
+
+const getPaginatedResponse = <T extends Record<string, unknown>>(
+  data: T[],
+  pageToken: number,
+  pageSize: number,
+) => {
+  const paginatedData = data.slice(pageToken, pageToken + pageSize);
+
+  const nextPageToken =
+    pageToken + pageSize < data.length
+      ? String(pageToken + pageSize)
+      : undefined;
+
+  return {
+    paginatedData,
+    nextPageToken,
+  };
+};
+
+const getMirrorsResponse = (requestUrl: string) => {
+  const { pageSize, pageToken } = getPaginationParams(requestUrl);
+  const { paginatedData, nextPageToken } = getPaginatedResponse(
+    mirrors,
+    pageToken,
+    pageSize,
+  );
+
+  return HttpResponse.json({
+    mirrors: paginatedData,
+    nextPageToken,
+  });
+};
+
+const getLocalsResponse = (requestUrl: string) => {
+  const { pageSize, pageToken } = getPaginationParams(requestUrl);
+  const { paginatedData, nextPageToken } = getPaginatedResponse(
+    locals,
+    pageToken,
+    pageSize,
+  );
+
+  return HttpResponse.json({
+    locals: paginatedData,
+    nextPageToken,
+  });
+};
+
+const getPublicationTargetsResponse = (requestUrl: string) => {
+  const { pageSize, pageToken } = getPaginationParams(requestUrl);
+  const { paginatedData, nextPageToken } = getPaginatedResponse(
+    publicationTargets,
+    pageToken,
+    pageSize,
+  );
+
+  return HttpResponse.json({
+    publicationTargets: paginatedData,
+    nextPageToken,
+  });
+};
+
+const getPublicationsResponse = (requestUrl: string) => {
+  const { searchParams } = new URL(requestUrl);
+  const search = searchParams.get("search") ?? undefined;
+  const { pageSize, pageToken } = getPaginationParams(requestUrl);
+
+  const filteredPublications = search
+    ? generateFilteredResponse(publications, search, [
+        "name",
+        "source",
+        "publicationTarget",
+      ])
+    : publications;
+
+  const { paginatedData, nextPageToken } = getPaginatedResponse(
+    filteredPublications,
+    pageToken,
+    pageSize,
+  );
+
+  return HttpResponse.json({
+    publications: paginatedData,
+    nextPageToken,
+  });
+};
+
+const getCreatePublicationResponse = async (request: Request) => {
+  const publicationBody = toObjectBody(await request.json());
+
+  return HttpResponse.json(
+    {
+      ...publications[0],
+      ...publicationBody,
+    },
+    { status: 200 },
+  );
+};
+
+const getPublicationDetailsResponse = (publicationName: string) => {
+  const publication = getPublicationParam(publicationName);
+
+  if (!publication) {
+    return HttpResponse.json(
+      { message: "Publication not found" },
+      { status: 404 },
+    );
+  }
+
+  return HttpResponse.json(publication);
+};
+
+const getUpdatePublicationResponse = async (
+  publicationName: string,
+  request: Request,
+) => {
+  const publication = getPublicationParam(publicationName);
+
+  if (!publication) {
+    return HttpResponse.json(
+      { message: "Publication not found" },
+      { status: 404 },
+    );
+  }
+
+  const body = toObjectBody(await request.json());
+
+  return HttpResponse.json({
+    ...publication,
+    ...body,
+  });
+};
+
+const getDeletePublicationResponse = () => {
+  return HttpResponse.json({}, { status: 200 });
+};
+
+const getPublishPublicationResponse =
+  (): StrictResponse<PublishPublicationResponse> => {
+    return HttpResponse.json(
+      {
+        task: {
+          name: "tasks/2b3f9f18-2f74-4b6f-95f0-57c4e12fd8d3",
+          displayName:
+            "publish publications/7b1d5c2f-0c4e-4d8e-8f2f-99d4f2d9a123",
+          taskId: "2b3f9f18-2f74-4b6f-95f0-57c4e12fd8d3",
+          status: "RUNNING",
+          output: "",
+        },
+      },
+      { status: 200 },
+    );
+  };
+
+const getBatchPublicationTargetsResponse = async (
+  request: Request,
+): Promise<StrictResponse<BatchGetPublicationTargetsResponse>> => {
+  const body = (await request.json()) as { names?: string[] };
+  const requestedNames = body.names ?? [];
+  const matched = publicationTargets.filter(({ name }) =>
+    name ? requestedNames.includes(name) : false,
+  );
+  return HttpResponse.json({ publicationTargets: matched });
+};
+
+const getBatchMirrorsResponse = async (
+  request: Request,
+): Promise<StrictResponse<BatchGetMirrorsResponse>> => {
+  const body = (await request.json()) as { names?: string[] };
+  const requestedNames = body.names ?? [];
+  const matched = mirrors.filter(({ name }) =>
+    name ? requestedNames.includes(name) : false,
+  );
+  return HttpResponse.json({ mirrors: matched });
+};
+
+const getBatchLocalsResponse = async (
+  request: Request,
+): Promise<StrictResponse<BatchGetLocalsResponse>> => {
+  const body = (await request.json()) as { names?: string[] };
+  const requestedNames = body.names ?? [];
+  const matched = locals.filter(({ name }) =>
+    name ? requestedNames.includes(name) : false,
+  );
+  return HttpResponse.json({ locals: matched });
+};
+
+export default [
+  http.post(
+    `${API_URL_DEB_ARCHIVE}publicationTargets:batchGet`,
+    async ({ request }) => {
+      return getBatchPublicationTargetsResponse(request);
+    },
+  ),
+
+  http.post(`${API_URL_DEB_ARCHIVE}mirrors:batchGet`, async ({ request }) => {
+    return getBatchMirrorsResponse(request);
+  }),
+
+  http.post(`${API_URL_DEB_ARCHIVE}locals:batchGet`, async ({ request }) => {
+    return getBatchLocalsResponse(request);
+  }),
+
+  http.get(`${API_URL_DEB_ARCHIVE}mirrors`, ({ request }) => {
+    const endpointStatus = getEndpointStatus();
+
+    if (
+      endpointStatus.status === "error" &&
+      endpointStatus.path === "mirrors"
+    ) {
+      return ENDPOINT_STATUS_API_ERROR;
+    }
+
+    return getMirrorsResponse(request.url);
+  }),
+
+  http.get(`${API_URL_DEB_ARCHIVE}locals`, ({ request }) => {
+    const endpointStatus = getEndpointStatus();
+
+    if (endpointStatus.status === "error" && endpointStatus.path === "locals") {
+      return ENDPOINT_STATUS_API_ERROR;
+    }
+
+    return getLocalsResponse(request.url);
+  }),
+
+  http.get(`${API_URL_DEB_ARCHIVE}publicationTargets`, ({ request }) => {
+    const endpointStatus = getEndpointStatus();
+
+    if (
+      endpointStatus.status === "error" &&
+      endpointStatus.path === "publicationTargets"
+    ) {
+      return ENDPOINT_STATUS_API_ERROR;
+    }
+
+    if (
+      endpointStatus.status === "empty" &&
+      endpointStatus.path === "publicationTargets"
+    ) {
+      return HttpResponse.json({
+        publicationTargets: [],
+        nextPageToken: "",
+      });
+    }
+
+    return getPublicationTargetsResponse(request.url);
+  }),
+
+  http.get(`${API_URL_DEB_ARCHIVE}publications`, ({ request }) => {
+    const endpointStatus = getEndpointStatus();
+
+    if (
+      endpointStatus.status === "error" &&
+      matchesPublicationsPath(endpointStatus.path)
+    ) {
+      return ENDPOINT_STATUS_API_ERROR;
+    }
+
+    if (
+      endpointStatus.status === "empty" &&
+      matchesPublicationsPath(endpointStatus.path)
+    ) {
+      return HttpResponse.json({
+        publications: [],
+        nextPageToken: "",
+      });
+    }
+
+    return getPublicationsResponse(request.url);
+  }),
+
+  http.post(`${API_URL_DEB_ARCHIVE}publications`, async ({ request }) => {
+    const endpointStatus = getEndpointStatus();
+
+    if (
+      endpointStatus.status === "error" &&
+      matchesPublicationsPath(endpointStatus.path)
+    ) {
+      return ENDPOINT_STATUS_API_ERROR;
+    }
+
+    return getCreatePublicationResponse(request);
+  }),
+
+  http.get(
+    `${API_URL_DEB_ARCHIVE}publications/:publicationName`,
+    ({ params }) => {
+      const endpointStatus = getEndpointStatus();
+
+      if (
+        endpointStatus.status === "error" &&
+        matchesPublicationsPath(endpointStatus.path)
+      ) {
+        return ENDPOINT_STATUS_API_ERROR;
+      }
+
+      return getPublicationDetailsResponse(params.publicationName as string);
+    },
+  ),
+
+  http.patch(
+    `${API_URL_DEB_ARCHIVE}publications/:publicationName`,
+    async ({ params, request }) => {
+      const endpointStatus = getEndpointStatus();
+
+      if (
+        endpointStatus.status === "error" &&
+        matchesPublicationsPath(endpointStatus.path)
+      ) {
+        return ENDPOINT_STATUS_API_ERROR;
+      }
+
+      return getUpdatePublicationResponse(
+        params.publicationName as string,
+        request,
+      );
+    },
+  ),
+
+  http.delete(`${API_URL_DEB_ARCHIVE}publications/:publicationName`, () => {
+    const endpointStatus = getEndpointStatus();
+
+    if (
+      endpointStatus.status === "error" &&
+      matchesPublicationsPath(endpointStatus.path)
+    ) {
+      return ENDPOINT_STATUS_API_ERROR;
+    }
+
+    return getDeletePublicationResponse();
+  }),
+
+  http.post(
+    new RegExp(`${API_URL_DEB_ARCHIVE}publications/.+:publish$`),
+    () => {
+      const endpointStatus = getEndpointStatus();
+
+      if (
+        endpointStatus.status === "error" &&
+        matchesPublicationsPath(endpointStatus.path)
+      ) {
+        return ENDPOINT_STATUS_API_ERROR;
+      }
+
+      return getPublishPublicationResponse();
+    },
+  ),
+];
diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts
index 6d2fce157..392356083 100644
--- a/src/vite-env.d.ts
+++ b/src/vite-env.d.ts
@@ -4,6 +4,7 @@ interface ImportMetaEnv {
   readonly VITE_APP_TITLE: string;
   readonly VITE_API_URL: string;
   readonly VITE_API_URL_OLD: string;
+  readonly VITE_API_URL_DEB_ARCHIVE: string;
   readonly VITE_ROOT_PATH: string;
   readonly VITE_SELF_HOSTED_ENV: string | undefined;
   readonly VITE_REPORT_VIEW_ENABLED: string;
diff --git a/vite.config.ts b/vite.config.ts
index e0dadeb99..fdf9e4e99 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -46,6 +46,12 @@ export default defineConfig(({ mode }) => {
           changeOrigin: true,
           secure: false,
         },
+        "/debarchive": {
+          target: env.VITE_DEBARCHIVE_PROXY_TARGET || "http://localhost:8000",
+          changeOrigin: true,
+          secure: false,
+          rewrite: (path) => path.replace(/^\/debarchive/, ""),
+        },
       },
     },
   };

From 117f574933b797192b75f140c7ca0d962aaf6353 Mon Sep 17 00:00:00 2001
From: Ethan Shaw <ethan.shaw@canonical.com>
Date: Fri, 24 Apr 2026 10:47:47 -0700
Subject: [PATCH 27/42] Mirrors (#565)

## Summary

Summarize the changes made in this pull request. Include any relevant
context or background information that would help reviewers understand
the purpose and scope of the changes.

## Release Impact

According to the [Landscape Server Release
Cycle](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `dev` / `main` (Beta)
- **Version Impact**:
  - [ ] Patch (Fix)
  - [x] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [ ] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [ ] **UI Verified**: I have verified the changes locally.
- [ ] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.

---------

Co-authored-by: Copilot <copilot@github.com>
---
 package.json                                  |    1 +
 pnpm-lock.yaml                                |    8 +
 .../ReadOnlyField/ReadOnlyField.module.scss   |   21 +
 .../form/ReadOnlyField/ReadOnlyField.tsx      |   33 +
 src/components/form/ReadOnlyField/index.ts    |    1 +
 .../layout/Card/Card.module.scss}             |    0
 src/components/layout/Card/index.ts           |    1 +
 .../components/AlertsList/AlertsList.tsx      |   10 +-
 .../ApiCredentialsTables.module.scss          |    6 +
 .../ApiCredentialsTables.tsx                  |   15 +-
 src/features/mirrors/api/index.ts             |   10 +
 src/features/mirrors/api/useCreateMirror.ts   |   21 +
 src/features/mirrors/api/useDeleteMirror.ts   |   27 +
 src/features/mirrors/api/useGetMirror.ts      |   31 +
 .../mirrors/api/useGetUbuntuArchiveInfo.ts    |   29 +
 .../mirrors/api/useGetUbuntuEsmInfo.ts        |   30 +
 .../mirrors/api/useListMirrorPackages.ts      |   33 +
 src/features/mirrors/api/useListMirrors.ts    |   31 +
 .../mirrors/api/useListPublications.ts        |   31 +
 src/features/mirrors/api/useSyncMirror.ts     |   27 +
 src/features/mirrors/api/useUpdateMirror.ts   |   27 +
 .../AddMirrorForm/AddMirrorForm.tsx           |  322 ++
 .../constants.ts                              |   18 -
 .../components/AddMirrorForm/helpers.ts       |  162 +
 .../mirrors/components/AddMirrorForm/index.ts |    1 +
 .../mirrors/components/AddMirrorForm/types.ts |   41 +
 .../DeriveSeriesForm.test.tsx                 |   28 -
 .../DeriveSeriesForm/DeriveSeriesForm.tsx     |   83 -
 .../components/DeriveSeriesForm/constants.ts  |    5 -
 .../components/DeriveSeriesForm/index.ts      |    1 -
 .../components/DeriveSeriesForm/types.ts      |    3 -
 .../DistributionCard.module.scss              |   20 -
 .../DistributionCard.test.tsx                 |  134 -
 .../DistributionCard/DistributionCard.tsx     |  189 -
 .../components/DistributionCard/index.ts      |    2 -
 .../DistributionContainer.test.tsx            |   36 -
 .../DistributionContainer.tsx                 |   86 -
 .../DistributionContainer/constants.ts        |    1 -
 .../components/DistributionContainer/index.ts |    1 -
 .../DistributionsEmptyState.test.tsx          |   33 -
 .../DistributionsEmptyState.tsx               |   53 -
 .../DistributionsEmptyState/index.ts          |    1 -
 .../EditMirrorForm/EditMirrorForm.tsx         |  176 +
 .../components/EditMirrorForm/index.ts        |    1 +
 .../components/EditMirrorForm/types.ts        |    7 +
 .../EditPocketForm/EditPocketForm.test.tsx    |  315 --
 .../EditPocketForm/EditPocketForm.tsx         |  326 --
 .../components/EditPocketForm/constants.ts    |   18 -
 .../components/EditPocketForm/helpers.test.ts |  132 -
 .../components/EditPocketForm/helpers.ts      |  133 -
 .../components/EditPocketForm/index.ts        |    1 -
 .../components/EditPocketForm/types.ts        |   14 -
 .../EmptyDistribution.module.scss             |   24 -
 .../EmptyDistribution.test.tsx                |   39 -
 .../EmptyDistribution/EmptyDistribution.tsx   |   59 -
 .../components/EmptyDistribution/index.ts     |    1 -
 .../MirrorActions/MirrorActions.tsx           |   91 +
 .../mirrors/components/MirrorActions/index.ts |    1 +
 .../MirrorDetails/MirrorDetails.tsx           |  167 +
 .../components/MirrorDetails/helpers.ts       |   18 +
 .../mirrors/components/MirrorDetails/index.ts |    1 +
 .../MirrorPackagesCount.tsx                   |   17 +
 .../components/MirrorPackagesCount/index.ts   |    1 +
 .../MirrorPublicationsLinks.tsx               |   37 +
 .../MirrorPublicationsLink/index.ts           |    1 +
 .../MirrorPublicationsList.tsx                |   59 +
 .../MirrorPublicationsList/index.ts           |    1 +
 .../components/MirrorsList/MirrorsList.tsx    |   98 +
 .../mirrors/components/MirrorsList/index.ts   |    1 +
 .../NewDistributionForm.test.tsx              |   16 -
 .../NewDistributionForm.tsx                   |   95 -
 .../NewDistributionForm/constants.ts          |    6 -
 .../components/NewDistributionForm/index.ts   |    1 -
 .../components/NewDistributionForm/types.ts   |    4 -
 .../NewPocketForm/NewPocketForm.test.tsx      |  125 -
 .../NewPocketForm/NewPocketForm.tsx           |  389 --
 .../components/NewPocketForm/constants.ts     |   49 -
 .../components/NewPocketForm/helpers.ts       |  136 -
 .../mirrors/components/NewPocketForm/index.ts |    1 -
 .../mirrors/components/NewPocketForm/types.ts |   21 -
 .../NewSeriesForm/NewSeriesForm.test.tsx      |  130 -
 .../NewSeriesForm/NewSeriesForm.tsx           |  427 --
 .../components/NewSeriesForm/helpers.ts       |  102 -
 .../mirrors/components/NewSeriesForm/index.ts |    1 -
 .../mirrors/components/NewSeriesForm/types.ts |   10 -
 .../PackageList/PackageList.module.scss       |    5 -
 .../PackageList/PackageList.test.tsx          |  309 --
 .../components/PackageList/PackageList.tsx    |  454 --
 .../mirrors/components/PackageList/index.ts   |    1 -
 .../PackageTable/PackageTable.module.scss     |    9 -
 .../PackageTable/PackageTable.test.tsx        |   39 -
 .../components/PackageTable/PackageTable.tsx  |  125 -
 .../mirrors/components/PackageTable/index.ts  |    1 -
 .../PocketSyncActivity.module.scss            |   33 -
 .../PocketSyncActivity.test.tsx               |  122 -
 .../PocketSyncActivity/PocketSyncActivity.tsx |  115 -
 .../components/PocketSyncActivity/helpers.ts  |   14 -
 .../components/PocketSyncActivity/index.ts    |    1 -
 .../PublishMirrorForm/PublishMirrorForm.tsx   |   74 +
 .../components/PublishMirrorForm/index.ts     |    1 +
 .../components/PublishMirrorForm/types.ts     |    3 +
 .../RemoveMirrorModal/RemoveMirrorModal.tsx   |   92 +
 .../components/RemoveMirrorModal/index.ts     |    1 +
 .../SelectableMirrorContentsBlock.tsx         |  138 +
 .../SelectableMirrorContentsBlock/index.ts    |    1 +
 .../components/SeriesCard/SeriesCard.test.tsx |  130 -
 .../components/SeriesCard/SeriesCard.tsx      |  230 -
 .../mirrors/components/SeriesCard/index.ts    |    2 -
 .../SeriesPocketDetailsButton.test.tsx        |   50 -
 .../SeriesPocketDetailsButton.tsx             |   54 -
 .../SeriesPocketDetailsButton/index.ts        |    1 -
 .../SeriesPocketList.test.tsx                 |   27 -
 .../SeriesPocketList/SeriesPocketList.tsx     |   93 -
 .../components/SeriesPocketList/helpers.ts    |   26 -
 .../components/SeriesPocketList/index.ts      |    1 -
 .../components/SeriesPocketList/types.ts      |   26 -
 .../SeriesPocketListActions.test.tsx          |  164 -
 .../SeriesPocketListActions.tsx               |  235 -
 .../SeriesPocketListActions/index.ts          |    1 -
 .../UpdateMirrorModal/UpdateMirrorModal.tsx   |  110 +
 .../components/UpdateMirrorModal/index.ts     |    1 +
 src/features/mirrors/constants.ts             |   55 +-
 src/features/mirrors/helpers.ts               |   11 +
 src/features/mirrors/hooks/index.ts           |    3 -
 .../mirrors/hooks/useGPGKeysOptions.ts        |   27 -
 src/features/mirrors/hooks/usePockets.ts      |  220 -
 src/features/mirrors/hooks/useSeries.ts       |   72 -
 src/features/mirrors/index.ts                 |   17 +-
 src/features/mirrors/types/Architecture.ts    |    4 +
 src/features/mirrors/types/Component.ts       |    4 +
 src/features/mirrors/types/Distribution.ts    |   12 +-
 src/features/mirrors/types/FormTypes.ts       |    1 -
 .../mirrors/types/FormattedPackage.ts         |    6 -
 src/features/mirrors/types/PocketParams.ts    |  120 -
 src/features/mirrors/types/Series.ts          |   17 -
 src/features/mirrors/types/SeriesParams.ts    |   27 -
 src/features/mirrors/types/SyncPocketRef.ts   |    5 -
 .../mirrors/types/UbuntuArchiveInfo.ts        |    8 +
 .../mirrors/types/UseGPGKeysOptionsResult.ts  |    6 -
 .../mirrors/types/UsePocketsResult.ts         |   87 -
 src/features/mirrors/types/UseSeriesResult.ts |   30 -
 src/features/mirrors/types/index.ts           |   49 +-
 .../api/useGetPagePackageProfile.ts           |    2 +-
 .../PackageProfileAddSidePanel.tsx            |    2 +-
 .../PackageProfileDuplicateForm.tsx           |    2 +-
 .../PackageProfileEditForm.tsx                |    2 +-
 .../PackageProfileList/PackageProfileList.tsx |    2 +-
 .../PackageProfileListActions.tsx             |    6 +-
 .../PackageProfileRemoveModal.tsx             |    2 +-
 .../PackageProfilesEmptyState.tsx             |    2 +-
 .../PublicationDetails.test.tsx               |    3 +-
 .../PublicationDetailsSidePanel.tsx           |   10 +-
 .../PublicationsList.test.tsx                 |    7 +-
 .../PublicationsList/PublicationsList.tsx     |    2 +-
 .../PublicationsListActions.tsx               |    2 +-
 .../api/useGetPageRebootProfile.ts            |    2 +-
 .../RebootProfileRemoveModal.tsx              |    2 +-
 .../RebootProfilesContainer.tsx               |    2 +-
 .../RebootProfilesForm/RebootProfilesForm.tsx |    2 +-
 .../RebootProfilesList/RebootProfilesList.tsx |    2 +-
 .../RebootProfilesListActions.tsx             |    4 +-
 .../api/useGetPageRemovalProfile.ts           |    2 +-
 .../RemovalProfileList/RemovalProfileList.tsx |    2 +-
 .../RemovalProfileListActions.tsx             |    2 +-
 .../RemovalProfileRemoveModal.tsx             |    2 +-
 .../RemovalProfilesEmptyState.tsx             |    2 +-
 .../SingleRemovalProfileForm.tsx              |    2 +-
 .../api/useGetPageScriptProfile.ts            |    2 +-
 .../AddScriptProfileButton.tsx                |    2 +-
 .../ScriptProfileForm/ScriptProfileForm.tsx   |    2 +-
 .../ScriptProfilesList/ScriptProfilesList.tsx |    2 +-
 .../ScriptProfilesListActions.tsx             |    4 +-
 .../ScriptProfilesTab/ScriptProfilesTab.tsx   |    2 +-
 .../ScriptDetailsInfo/ScriptDetailsInfo.tsx   |    2 +-
 .../components/ScriptList/ScriptList.tsx      |    2 +-
 .../api/useGetPageSecurityProfile.tsx         |    2 +-
 .../SecurityProfileDownloadAuditForm.tsx      |    2 +-
 .../SecurityProfileForm.tsx                   |    4 +-
 .../SecurityProfileListActions.tsx            |   12 +-
 .../SecurityProfileRunFixSidePanel.tsx        |    2 +-
 .../SecurityProfilesContainer.tsx             |    2 +-
 .../SecurityProfilesList.tsx                  |    2 +-
 .../hooks/useSecurityProfileForm.tsx          |    2 +-
 .../api/useGetPageUpgradeProfile.ts           |    2 +-
 .../SingleUpgradeProfileForm.tsx              |    2 +-
 .../UpgradeProfileList/UpgradeProfileList.tsx |    2 +-
 .../UpgradeProfileListActions.tsx             |    2 +-
 .../UpgradeProfileRemoveModal.tsx             |    2 +-
 .../wsl-profiles/api/useGetPageWslProfile.ts  |    2 +-
 .../WslProfileAddButton.tsx                   |    2 +-
 .../WslProfileEditForm/WslProfileEditForm.tsx |    2 +-
 .../WslProfileRemoveModal.tsx                 |    2 +-
 .../WslProfilesList/WslProfilesList.tsx       |    4 +-
 .../WslProfilesListActions.tsx                |    2 +-
 src/libs/pageParamsManager/constants.ts       |    7 +-
 src/libs/pageParamsManager/types.ts           |    3 +-
 .../[single]/tabs/info/ProfileLink/helpers.ts |   14 +-
 .../PackageProfilesPage.tsx                   |    4 +-
 .../RebootProfilesPage/RebootProfilesPage.tsx |    4 +-
 .../RemovalProfilesPage.tsx                   |    4 +-
 .../SecurityProfilesPage.tsx                  |    4 +-
 .../UpgradeProfilesPage.tsx                   |    2 +-
 .../profiles/wsl-profiles/WslProfilesPage.tsx |    2 +-
 .../repositories/mirrors/MirrorsPage.tsx      |  184 +-
 .../publications/PublicationsPage.tsx         |    2 +-
 src/tests/mocks/mirrors.ts                    |   30 +
 src/tests/mocks/publications.ts               |   22 -
 src/tests/mocks/repo.ts                       |   78 -
 src/tests/mocks/ubuntuArchiveInfo.ts          | 4239 +++++++++++++++++
 src/tests/server/handlers/_helpers.ts         |   31 +
 src/tests/server/handlers/index.ts            |    6 +-
 src/tests/server/handlers/mirrors.ts          |   98 +
 src/tests/server/handlers/pockets.ts          |   88 +-
 src/tests/server/handlers/publications.ts     |   97 +-
 src/tests/server/handlers/repo.ts             |   15 -
 src/tests/server/handlers/repository.ts       |   25 +
 src/types/SelectOption.ts                     |    1 +
 src/utils/_helpers.ts                         |    7 +
 218 files changed, 6686 insertions(+), 6756 deletions(-)
 create mode 100644 src/components/form/ReadOnlyField/ReadOnlyField.module.scss
 create mode 100644 src/components/form/ReadOnlyField/ReadOnlyField.tsx
 create mode 100644 src/components/form/ReadOnlyField/index.ts
 rename src/{features/mirrors/components/SeriesCard/SeriesCard.module.scss => components/layout/Card/Card.module.scss} (100%)
 create mode 100644 src/components/layout/Card/index.ts
 create mode 100644 src/features/mirrors/api/index.ts
 create mode 100644 src/features/mirrors/api/useCreateMirror.ts
 create mode 100644 src/features/mirrors/api/useDeleteMirror.ts
 create mode 100644 src/features/mirrors/api/useGetMirror.ts
 create mode 100644 src/features/mirrors/api/useGetUbuntuArchiveInfo.ts
 create mode 100644 src/features/mirrors/api/useGetUbuntuEsmInfo.ts
 create mode 100644 src/features/mirrors/api/useListMirrorPackages.ts
 create mode 100644 src/features/mirrors/api/useListMirrors.ts
 create mode 100644 src/features/mirrors/api/useListPublications.ts
 create mode 100644 src/features/mirrors/api/useSyncMirror.ts
 create mode 100644 src/features/mirrors/api/useUpdateMirror.ts
 create mode 100644 src/features/mirrors/components/AddMirrorForm/AddMirrorForm.tsx
 rename src/features/mirrors/components/{NewSeriesForm => AddMirrorForm}/constants.ts (54%)
 create mode 100644 src/features/mirrors/components/AddMirrorForm/helpers.ts
 create mode 100644 src/features/mirrors/components/AddMirrorForm/index.ts
 create mode 100644 src/features/mirrors/components/AddMirrorForm/types.ts
 delete mode 100644 src/features/mirrors/components/DeriveSeriesForm/DeriveSeriesForm.test.tsx
 delete mode 100644 src/features/mirrors/components/DeriveSeriesForm/DeriveSeriesForm.tsx
 delete mode 100644 src/features/mirrors/components/DeriveSeriesForm/constants.ts
 delete mode 100644 src/features/mirrors/components/DeriveSeriesForm/index.ts
 delete mode 100644 src/features/mirrors/components/DeriveSeriesForm/types.ts
 delete mode 100644 src/features/mirrors/components/DistributionCard/DistributionCard.module.scss
 delete mode 100644 src/features/mirrors/components/DistributionCard/DistributionCard.test.tsx
 delete mode 100644 src/features/mirrors/components/DistributionCard/DistributionCard.tsx
 delete mode 100644 src/features/mirrors/components/DistributionCard/index.ts
 delete mode 100644 src/features/mirrors/components/DistributionContainer/DistributionContainer.test.tsx
 delete mode 100644 src/features/mirrors/components/DistributionContainer/DistributionContainer.tsx
 delete mode 100644 src/features/mirrors/components/DistributionContainer/constants.ts
 delete mode 100644 src/features/mirrors/components/DistributionContainer/index.ts
 delete mode 100644 src/features/mirrors/components/DistributionsEmptyState/DistributionsEmptyState.test.tsx
 delete mode 100644 src/features/mirrors/components/DistributionsEmptyState/DistributionsEmptyState.tsx
 delete mode 100644 src/features/mirrors/components/DistributionsEmptyState/index.ts
 create mode 100644 src/features/mirrors/components/EditMirrorForm/EditMirrorForm.tsx
 create mode 100644 src/features/mirrors/components/EditMirrorForm/index.ts
 create mode 100644 src/features/mirrors/components/EditMirrorForm/types.ts
 delete mode 100644 src/features/mirrors/components/EditPocketForm/EditPocketForm.test.tsx
 delete mode 100644 src/features/mirrors/components/EditPocketForm/EditPocketForm.tsx
 delete mode 100644 src/features/mirrors/components/EditPocketForm/constants.ts
 delete mode 100644 src/features/mirrors/components/EditPocketForm/helpers.test.ts
 delete mode 100644 src/features/mirrors/components/EditPocketForm/helpers.ts
 delete mode 100644 src/features/mirrors/components/EditPocketForm/index.ts
 delete mode 100644 src/features/mirrors/components/EditPocketForm/types.ts
 delete mode 100644 src/features/mirrors/components/EmptyDistribution/EmptyDistribution.module.scss
 delete mode 100644 src/features/mirrors/components/EmptyDistribution/EmptyDistribution.test.tsx
 delete mode 100644 src/features/mirrors/components/EmptyDistribution/EmptyDistribution.tsx
 delete mode 100644 src/features/mirrors/components/EmptyDistribution/index.ts
 create mode 100644 src/features/mirrors/components/MirrorActions/MirrorActions.tsx
 create mode 100644 src/features/mirrors/components/MirrorActions/index.ts
 create mode 100644 src/features/mirrors/components/MirrorDetails/MirrorDetails.tsx
 create mode 100644 src/features/mirrors/components/MirrorDetails/helpers.ts
 create mode 100644 src/features/mirrors/components/MirrorDetails/index.ts
 create mode 100644 src/features/mirrors/components/MirrorPackagesCount/MirrorPackagesCount.tsx
 create mode 100644 src/features/mirrors/components/MirrorPackagesCount/index.ts
 create mode 100644 src/features/mirrors/components/MirrorPublicationsLink/MirrorPublicationsLinks.tsx
 create mode 100644 src/features/mirrors/components/MirrorPublicationsLink/index.ts
 create mode 100644 src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.tsx
 create mode 100644 src/features/mirrors/components/MirrorPublicationsList/index.ts
 create mode 100644 src/features/mirrors/components/MirrorsList/MirrorsList.tsx
 create mode 100644 src/features/mirrors/components/MirrorsList/index.ts
 delete mode 100644 src/features/mirrors/components/NewDistributionForm/NewDistributionForm.test.tsx
 delete mode 100644 src/features/mirrors/components/NewDistributionForm/NewDistributionForm.tsx
 delete mode 100644 src/features/mirrors/components/NewDistributionForm/constants.ts
 delete mode 100644 src/features/mirrors/components/NewDistributionForm/index.ts
 delete mode 100644 src/features/mirrors/components/NewDistributionForm/types.ts
 delete mode 100644 src/features/mirrors/components/NewPocketForm/NewPocketForm.test.tsx
 delete mode 100644 src/features/mirrors/components/NewPocketForm/NewPocketForm.tsx
 delete mode 100644 src/features/mirrors/components/NewPocketForm/constants.ts
 delete mode 100644 src/features/mirrors/components/NewPocketForm/helpers.ts
 delete mode 100644 src/features/mirrors/components/NewPocketForm/index.ts
 delete mode 100644 src/features/mirrors/components/NewPocketForm/types.ts
 delete mode 100644 src/features/mirrors/components/NewSeriesForm/NewSeriesForm.test.tsx
 delete mode 100644 src/features/mirrors/components/NewSeriesForm/NewSeriesForm.tsx
 delete mode 100644 src/features/mirrors/components/NewSeriesForm/helpers.ts
 delete mode 100644 src/features/mirrors/components/NewSeriesForm/index.ts
 delete mode 100644 src/features/mirrors/components/NewSeriesForm/types.ts
 delete mode 100644 src/features/mirrors/components/PackageList/PackageList.module.scss
 delete mode 100644 src/features/mirrors/components/PackageList/PackageList.test.tsx
 delete mode 100644 src/features/mirrors/components/PackageList/PackageList.tsx
 delete mode 100644 src/features/mirrors/components/PackageList/index.ts
 delete mode 100644 src/features/mirrors/components/PackageTable/PackageTable.module.scss
 delete mode 100644 src/features/mirrors/components/PackageTable/PackageTable.test.tsx
 delete mode 100644 src/features/mirrors/components/PackageTable/PackageTable.tsx
 delete mode 100644 src/features/mirrors/components/PackageTable/index.ts
 delete mode 100644 src/features/mirrors/components/PocketSyncActivity/PocketSyncActivity.module.scss
 delete mode 100644 src/features/mirrors/components/PocketSyncActivity/PocketSyncActivity.test.tsx
 delete mode 100644 src/features/mirrors/components/PocketSyncActivity/PocketSyncActivity.tsx
 delete mode 100644 src/features/mirrors/components/PocketSyncActivity/helpers.ts
 delete mode 100644 src/features/mirrors/components/PocketSyncActivity/index.ts
 create mode 100644 src/features/mirrors/components/PublishMirrorForm/PublishMirrorForm.tsx
 create mode 100644 src/features/mirrors/components/PublishMirrorForm/index.ts
 create mode 100644 src/features/mirrors/components/PublishMirrorForm/types.ts
 create mode 100644 src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.tsx
 create mode 100644 src/features/mirrors/components/RemoveMirrorModal/index.ts
 create mode 100644 src/features/mirrors/components/SelectableMirrorContentsBlock/SelectableMirrorContentsBlock.tsx
 create mode 100644 src/features/mirrors/components/SelectableMirrorContentsBlock/index.ts
 delete mode 100644 src/features/mirrors/components/SeriesCard/SeriesCard.test.tsx
 delete mode 100644 src/features/mirrors/components/SeriesCard/SeriesCard.tsx
 delete mode 100644 src/features/mirrors/components/SeriesCard/index.ts
 delete mode 100644 src/features/mirrors/components/SeriesPocketDetailsButton/SeriesPocketDetailsButton.test.tsx
 delete mode 100644 src/features/mirrors/components/SeriesPocketDetailsButton/SeriesPocketDetailsButton.tsx
 delete mode 100644 src/features/mirrors/components/SeriesPocketDetailsButton/index.ts
 delete mode 100644 src/features/mirrors/components/SeriesPocketList/SeriesPocketList.test.tsx
 delete mode 100644 src/features/mirrors/components/SeriesPocketList/SeriesPocketList.tsx
 delete mode 100644 src/features/mirrors/components/SeriesPocketList/helpers.ts
 delete mode 100644 src/features/mirrors/components/SeriesPocketList/index.ts
 delete mode 100644 src/features/mirrors/components/SeriesPocketList/types.ts
 delete mode 100644 src/features/mirrors/components/SeriesPocketListActions/SeriesPocketListActions.test.tsx
 delete mode 100644 src/features/mirrors/components/SeriesPocketListActions/SeriesPocketListActions.tsx
 delete mode 100644 src/features/mirrors/components/SeriesPocketListActions/index.ts
 create mode 100644 src/features/mirrors/components/UpdateMirrorModal/UpdateMirrorModal.tsx
 create mode 100644 src/features/mirrors/components/UpdateMirrorModal/index.ts
 create mode 100644 src/features/mirrors/helpers.ts
 delete mode 100644 src/features/mirrors/hooks/useGPGKeysOptions.ts
 delete mode 100644 src/features/mirrors/hooks/usePockets.ts
 delete mode 100644 src/features/mirrors/hooks/useSeries.ts
 create mode 100644 src/features/mirrors/types/Architecture.ts
 create mode 100644 src/features/mirrors/types/Component.ts
 delete mode 100644 src/features/mirrors/types/FormTypes.ts
 delete mode 100644 src/features/mirrors/types/FormattedPackage.ts
 delete mode 100644 src/features/mirrors/types/PocketParams.ts
 delete mode 100644 src/features/mirrors/types/SeriesParams.ts
 delete mode 100644 src/features/mirrors/types/SyncPocketRef.ts
 create mode 100644 src/features/mirrors/types/UbuntuArchiveInfo.ts
 delete mode 100644 src/features/mirrors/types/UseGPGKeysOptionsResult.ts
 delete mode 100644 src/features/mirrors/types/UsePocketsResult.ts
 delete mode 100644 src/features/mirrors/types/UseSeriesResult.ts
 create mode 100644 src/tests/mocks/mirrors.ts
 delete mode 100644 src/tests/mocks/repo.ts
 create mode 100644 src/tests/mocks/ubuntuArchiveInfo.ts
 create mode 100644 src/tests/server/handlers/mirrors.ts
 delete mode 100644 src/tests/server/handlers/repo.ts
 create mode 100644 src/tests/server/handlers/repository.ts

diff --git a/package.json b/package.json
index d0fc4fa15..19d8f424f 100644
--- a/package.json
+++ b/package.json
@@ -24,6 +24,7 @@
     "tcm:watch": "pnpm tcm:run --watch"
   },
   "dependencies": {
+    "@canonical/landscape-openapi": "0.0.50",
     "@canonical/react-components": "4.2.0",
     "@monaco-editor/react": "4.7.0",
     "@sentry/react": "10.47.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index cfce44cdf..b7ece4304 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -8,6 +8,9 @@ importers:
 
   .:
     dependencies:
+      '@canonical/landscape-openapi':
+        specifier: 0.0.50
+        version: 0.0.50
       '@canonical/react-components':
         specifier: 4.2.0
         version: 4.2.0(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(formik@2.4.9(@types/react@19.2.14)(react@19.2.4))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(vanilla-framework@4.46.0(sass@1.99.0))
@@ -276,6 +279,9 @@ packages:
   '@cacheable/utils@2.4.1':
     resolution: {integrity: sha512-eiFgzCbIneyMlLOmNG4g9xzF7Hv3Mga4LjxjcSC/ues6VYq2+gUbQI8JqNuw/ZM8tJIeIaBGpswAsqV2V7ApgA==}
 
+  '@canonical/landscape-openapi@0.0.50':
+    resolution: {integrity: sha512-D9quhDND6+EJKhqUl97xkXp/sjipDTxSMLi1Obdj9fKs09GxQrR0IicIJaxgljfGQYT/yAine7I1GeTQCxOpEw==}
+
   '@canonical/react-components@4.2.0':
     resolution: {integrity: sha512-e4rYL0fvJTHynQtd7bfDtzYf25NxYGQq+BXtSMbpTU6cYxsw47EgITxYouB8yNa18iuAxYxINP3tRZugQK6qOw==}
     peerDependencies:
@@ -4206,6 +4212,8 @@ snapshots:
       hashery: 1.5.1
       keyv: 5.6.0
 
+  '@canonical/landscape-openapi@0.0.50': {}
+
   '@canonical/react-components@4.2.0(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(formik@2.4.9(@types/react@19.2.14)(react@19.2.4))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(vanilla-framework@4.46.0(sass@1.99.0))':
     dependencies:
       '@types/jest': 30.0.0
diff --git a/src/components/form/ReadOnlyField/ReadOnlyField.module.scss b/src/components/form/ReadOnlyField/ReadOnlyField.module.scss
new file mode 100644
index 000000000..127cd2f5b
--- /dev/null
+++ b/src/components/form/ReadOnlyField/ReadOnlyField.module.scss
@@ -0,0 +1,21 @@
+@import "vanilla-framework/scss/settings_spacing";
+@import "vanilla-framework/scss/settings_colors";
+
+.field {
+  display: flex;
+  flex-direction: column;
+}
+
+.container > span {
+  width: 100%;
+}
+
+.locked {
+  display: flex;
+  width: 100%;
+  justify-content: space-between;
+  align-items: center;
+  padding: $spv--small $sph--small;
+  margin-bottom: $spv--large;
+  background-color: $colors--theme--background-inputs;
+}
diff --git a/src/components/form/ReadOnlyField/ReadOnlyField.tsx b/src/components/form/ReadOnlyField/ReadOnlyField.tsx
new file mode 100644
index 000000000..b5dd69aa2
--- /dev/null
+++ b/src/components/form/ReadOnlyField/ReadOnlyField.tsx
@@ -0,0 +1,33 @@
+import { Icon, Tooltip } from "@canonical/react-components";
+import type { FC } from "react";
+import classes from "./ReadOnlyField.module.scss";
+import NoData from "@/components/layout/NoData";
+
+interface ReadOnlyFieldProps {
+  readonly label?: string;
+  readonly value?: string;
+  readonly tooltipMessage?: string;
+}
+
+const ReadOnlyField: FC<ReadOnlyFieldProps> = ({
+  label,
+  value,
+  tooltipMessage,
+}) => (
+  <div className={classes.field}>
+    <label>{label}</label>
+    <Tooltip
+      position="btm-left"
+      className={classes.container}
+      message={tooltipMessage}
+      followMouse
+    >
+      <div className={classes.locked}>
+        <span>{value || <NoData />}</span>
+        <Icon name="lock-locked" />
+      </div>
+    </Tooltip>
+  </div>
+);
+
+export default ReadOnlyField;
diff --git a/src/components/form/ReadOnlyField/index.ts b/src/components/form/ReadOnlyField/index.ts
new file mode 100644
index 000000000..295711ab0
--- /dev/null
+++ b/src/components/form/ReadOnlyField/index.ts
@@ -0,0 +1 @@
+export { default } from "./ReadOnlyField";
diff --git a/src/features/mirrors/components/SeriesCard/SeriesCard.module.scss b/src/components/layout/Card/Card.module.scss
similarity index 100%
rename from src/features/mirrors/components/SeriesCard/SeriesCard.module.scss
rename to src/components/layout/Card/Card.module.scss
diff --git a/src/components/layout/Card/index.ts b/src/components/layout/Card/index.ts
new file mode 100644
index 000000000..3a12032a5
--- /dev/null
+++ b/src/components/layout/Card/index.ts
@@ -0,0 +1 @@
+export { default as cardClasses } from "./Card.module.scss";
diff --git a/src/features/alerts/components/AlertsList/AlertsList.tsx b/src/features/alerts/components/AlertsList/AlertsList.tsx
index ca282b01e..268f403f5 100644
--- a/src/features/alerts/components/AlertsList/AlertsList.tsx
+++ b/src/features/alerts/components/AlertsList/AlertsList.tsx
@@ -1,4 +1,4 @@
-import { seriesCardClasses } from "@/features/mirrors";
+import { cardClasses } from "@/components/layout/Card";
 import useAuth from "@/hooks/useAuth";
 import type { MultiSelectItem } from "@canonical/react-components";
 import classNames from "classnames";
@@ -18,11 +18,11 @@ const AlertsList: FC<AlertsListProps> = ({ alerts, availableTagOptions }) => {
     (account) => account.name === user.current_account,
   );
   return (
-    <div className={classNames(seriesCardClasses.card, classes.card)}>
-      <div className={seriesCardClasses.header}>
-        <p className={seriesCardClasses.title}>{account?.title || "Alerts"}</p>
+    <div className={classNames(cardClasses.card, classes.card)}>
+      <div className={cardClasses.header}>
+        <p className={cardClasses.title}>{account?.title || "Alerts"}</p>
       </div>
-      <div className={classNames(seriesCardClasses.content, classes.content)}>
+      <div className={classNames(cardClasses.content, classes.content)}>
         <AlertsTable
           alerts={alerts}
           availableTagOptions={availableTagOptions}
diff --git a/src/features/api-credentials/components/ApiCredentialsTables/ApiCredentialsTables.module.scss b/src/features/api-credentials/components/ApiCredentialsTables/ApiCredentialsTables.module.scss
index 6dce5444c..59940fa5d 100644
--- a/src/features/api-credentials/components/ApiCredentialsTables/ApiCredentialsTables.module.scss
+++ b/src/features/api-credentials/components/ApiCredentialsTables/ApiCredentialsTables.module.scss
@@ -2,6 +2,12 @@
 @import "vanilla-framework/scss/settings_spacing";
 @import "vanilla-framework/scss/utilities_off-screen";
 
+.container {
+  &:not(:last-child) {
+    margin-bottom: $sp-x-large;
+  }
+}
+
 .tableWrapper {
   thead {
     &:not(:focus, :active) {
diff --git a/src/features/api-credentials/components/ApiCredentialsTables/ApiCredentialsTables.tsx b/src/features/api-credentials/components/ApiCredentialsTables/ApiCredentialsTables.tsx
index 624f5cda7..881813c1d 100644
--- a/src/features/api-credentials/components/ApiCredentialsTables/ApiCredentialsTables.tsx
+++ b/src/features/api-credentials/components/ApiCredentialsTables/ApiCredentialsTables.tsx
@@ -1,7 +1,7 @@
 import InfoItem from "@/components/layout/InfoItem";
 import { NOT_AVAILABLE } from "@/constants";
 import type { UserDetails } from "@/features/general-settings";
-import { distributionCardClasses, seriesCardClasses } from "@/features/mirrors";
+import { cardClasses } from "@/components/layout/Card";
 import useDebug from "@/hooks/useDebug";
 
 import {
@@ -98,10 +98,10 @@ const ApiCredentialsTables: FC<ApiCredentialsTablesProps> = ({
         : "Generate";
 
     return (
-      <div key={account.title} className={distributionCardClasses.item}>
-        <div className={seriesCardClasses.card}>
-          <div className={seriesCardClasses.header}>
-            <p className={seriesCardClasses.title}>{account.title}</p>
+      <div key={account.title} className={classes.container}>
+        <div className={cardClasses.card}>
+          <div className={cardClasses.header}>
+            <p className={cardClasses.title}>{account.title}</p>
             <ConfirmationButton
               className={classNames("u-no-margin--bottom", {
                 "is-small": isLargeScreen,
@@ -128,10 +128,7 @@ const ApiCredentialsTables: FC<ApiCredentialsTablesProps> = ({
             </ConfirmationButton>
           </div>
           <div
-            className={classNames(
-              seriesCardClasses.content,
-              classes.tableWrapper,
-            )}
+            className={classNames(cardClasses.content, classes.tableWrapper)}
           >
             {isLargeScreen ? (
               <ModularTable
diff --git a/src/features/mirrors/api/index.ts b/src/features/mirrors/api/index.ts
new file mode 100644
index 000000000..a002f520a
--- /dev/null
+++ b/src/features/mirrors/api/index.ts
@@ -0,0 +1,10 @@
+export * from "./useListMirrors";
+export * from "./useListMirrorPackages";
+export * from "./useListPublications";
+export * from "./useDeleteMirror";
+export * from "./useUpdateMirror";
+export * from "./useSyncMirror";
+export * from "./useGetUbuntuArchiveInfo";
+export * from "./useGetUbuntuEsmInfo";
+export * from "./useCreateMirror";
+export * from "./useGetMirror";
diff --git a/src/features/mirrors/api/useCreateMirror.ts b/src/features/mirrors/api/useCreateMirror.ts
new file mode 100644
index 000000000..b00943d1a
--- /dev/null
+++ b/src/features/mirrors/api/useCreateMirror.ts
@@ -0,0 +1,21 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type {
+  CreateMirrorData,
+  CreateMirrorError,
+  CreateMirrorResponse,
+} from "@canonical/landscape-openapi";
+import { useMutation } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+
+export function useCreateMirror() {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  return useMutation<
+    AxiosResponse<CreateMirrorResponse>,
+    AxiosError<CreateMirrorError>,
+    CreateMirrorData["body"]
+  >({
+    mutationKey: ["mirrors"],
+    mutationFn: async (params) => authFetchDebArchive.post("mirrors", params),
+  });
+}
diff --git a/src/features/mirrors/api/useDeleteMirror.ts b/src/features/mirrors/api/useDeleteMirror.ts
new file mode 100644
index 000000000..6b03fa01f
--- /dev/null
+++ b/src/features/mirrors/api/useDeleteMirror.ts
@@ -0,0 +1,27 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type {
+  DeleteMirrorData,
+  DeleteMirrorError,
+  DeleteMirrorResponse,
+} from "@canonical/landscape-openapi";
+import { useMutation } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+
+export interface UseDeleteMirrorVariables {
+  mirrorName: DeleteMirrorData["path"]["name_1"];
+  params?: DeleteMirrorData["query"];
+}
+
+export function useDeleteMirror() {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  return useMutation<
+    AxiosResponse<DeleteMirrorResponse>,
+    AxiosError<DeleteMirrorError>,
+    UseDeleteMirrorVariables
+  >({
+    mutationKey: ["mirrors"],
+    mutationFn: async ({ mirrorName, params }) =>
+      authFetchDebArchive.delete(mirrorName, { params }),
+  });
+}
diff --git a/src/features/mirrors/api/useGetMirror.ts b/src/features/mirrors/api/useGetMirror.ts
new file mode 100644
index 000000000..156234835
--- /dev/null
+++ b/src/features/mirrors/api/useGetMirror.ts
@@ -0,0 +1,31 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type {
+  GetMirrorData,
+  GetMirrorError,
+  GetMirrorResponse,
+} from "@canonical/landscape-openapi";
+import type { UseQueryOptions } from "@tanstack/react-query";
+import { useSuspenseQuery } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+
+export function useGetMirror(
+  mirrorName: GetMirrorData["path"]["name_1"],
+  options: Omit<
+    UseQueryOptions<
+      AxiosResponse<GetMirrorResponse>,
+      AxiosError<GetMirrorError>
+    >,
+    "queryKey" | "queryFn"
+  > = {},
+) {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  return useSuspenseQuery<
+    AxiosResponse<GetMirrorResponse>,
+    AxiosError<GetMirrorError>
+  >({
+    queryKey: ["mirrors", mirrorName],
+    queryFn: async () => authFetchDebArchive.get(mirrorName),
+    ...options,
+  });
+}
diff --git a/src/features/mirrors/api/useGetUbuntuArchiveInfo.ts b/src/features/mirrors/api/useGetUbuntuArchiveInfo.ts
new file mode 100644
index 000000000..3570c730b
--- /dev/null
+++ b/src/features/mirrors/api/useGetUbuntuArchiveInfo.ts
@@ -0,0 +1,29 @@
+import useFetch from "@/hooks/useFetch";
+import type { ApiError } from "@/types/api/ApiError";
+import type { UseQueryOptions } from "@tanstack/react-query";
+import { useSuspenseQuery } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+import type { UbuntuArchiveInfo } from "../types/UbuntuArchiveInfo";
+
+export function useGetUbuntuArchiveInfo(
+  options: Omit<
+    UseQueryOptions<AxiosResponse<UbuntuArchiveInfo>, AxiosError<ApiError>>,
+    "queryKey" | "queryFn"
+  > = {},
+) {
+  const authFetch = useFetch();
+
+  return useSuspenseQuery<
+    AxiosResponse<UbuntuArchiveInfo>,
+    AxiosError<ApiError>
+  >({
+    queryKey: ["ubuntuArchiveInfo", "archive"],
+    queryFn: async () =>
+      authFetch.get("repository/ubuntu-archive-info", {
+        params: {
+          archive_type: "archive",
+        },
+      }),
+    ...options,
+  });
+}
diff --git a/src/features/mirrors/api/useGetUbuntuEsmInfo.ts b/src/features/mirrors/api/useGetUbuntuEsmInfo.ts
new file mode 100644
index 000000000..4638208fa
--- /dev/null
+++ b/src/features/mirrors/api/useGetUbuntuEsmInfo.ts
@@ -0,0 +1,30 @@
+import useFetch from "@/hooks/useFetch";
+import type { ApiError } from "@/types/api/ApiError";
+import type { UseQueryOptions } from "@tanstack/react-query";
+import { useSuspenseQuery } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+import type { UbuntuArchiveInfo } from "../types/UbuntuArchiveInfo";
+
+export interface UbuntuESMInfo {
+  results: UbuntuArchiveInfo[];
+}
+
+export function useGetUbuntuEsmInfo(
+  options: Omit<
+    UseQueryOptions<AxiosResponse<UbuntuESMInfo>, AxiosError<ApiError>>,
+    "queryKey" | "queryFn"
+  > = {},
+) {
+  const authFetch = useFetch();
+
+  return useSuspenseQuery<AxiosResponse<UbuntuESMInfo>, AxiosError<ApiError>>({
+    queryKey: ["ubuntuArchiveInfo", "esm"],
+    queryFn: async () =>
+      authFetch.get("repository/ubuntu-archive-info", {
+        params: {
+          archive_type: "ESM",
+        },
+      }),
+    ...options,
+  });
+}
diff --git a/src/features/mirrors/api/useListMirrorPackages.ts b/src/features/mirrors/api/useListMirrorPackages.ts
new file mode 100644
index 000000000..fbe1fa814
--- /dev/null
+++ b/src/features/mirrors/api/useListMirrorPackages.ts
@@ -0,0 +1,33 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type {
+  ListMirrorPackagesData,
+  ListMirrorPackagesError,
+  ListMirrorPackagesResponse,
+} from "@canonical/landscape-openapi";
+import type { UseQueryOptions } from "@tanstack/react-query";
+import { useSuspenseQuery } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+
+export function useListMirrorPackages(
+  mirrorName: ListMirrorPackagesData["path"]["parent_1"],
+  params: ListMirrorPackagesData["query"] = {},
+  options: Omit<
+    UseQueryOptions<
+      AxiosResponse<ListMirrorPackagesResponse>,
+      AxiosError<ListMirrorPackagesError>
+    >,
+    "queryKey" | "queryFn"
+  > = {},
+) {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  return useSuspenseQuery<
+    AxiosResponse<ListMirrorPackagesResponse>,
+    AxiosError<ListMirrorPackagesError>
+  >({
+    queryKey: ["mirrorPackages", mirrorName, params],
+    queryFn: async () =>
+      authFetchDebArchive.get(`${mirrorName}/packages`, { params }),
+    ...options,
+  });
+}
diff --git a/src/features/mirrors/api/useListMirrors.ts b/src/features/mirrors/api/useListMirrors.ts
new file mode 100644
index 000000000..8ba1d495d
--- /dev/null
+++ b/src/features/mirrors/api/useListMirrors.ts
@@ -0,0 +1,31 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type {
+  ListMirrorsData,
+  ListMirrorsError,
+  ListMirrorsResponse,
+} from "@canonical/landscape-openapi";
+import type { UseQueryOptions } from "@tanstack/react-query";
+import { useSuspenseQuery } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+
+export function useListMirrors(
+  params: ListMirrorsData["query"] = {},
+  options: Omit<
+    UseQueryOptions<
+      AxiosResponse<ListMirrorsResponse>,
+      AxiosError<ListMirrorsError>
+    >,
+    "queryKey" | "queryFn"
+  > = {},
+) {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  return useSuspenseQuery<
+    AxiosResponse<ListMirrorsResponse>,
+    AxiosError<ListMirrorsError>
+  >({
+    queryKey: ["mirrors", params],
+    queryFn: async () => authFetchDebArchive.get("mirrors", { params }),
+    ...options,
+  });
+}
diff --git a/src/features/mirrors/api/useListPublications.ts b/src/features/mirrors/api/useListPublications.ts
new file mode 100644
index 000000000..174c2d647
--- /dev/null
+++ b/src/features/mirrors/api/useListPublications.ts
@@ -0,0 +1,31 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type {
+  ListPublicationsData,
+  ListPublicationsError,
+  ListPublicationsResponse,
+} from "@canonical/landscape-openapi";
+import type { UseQueryOptions } from "@tanstack/react-query";
+import { useSuspenseQuery } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+
+export function useListPublications(
+  params: ListPublicationsData["query"] = {},
+  options: Omit<
+    UseQueryOptions<
+      AxiosResponse<ListPublicationsResponse>,
+      AxiosError<ListPublicationsError>
+    >,
+    "queryKey" | "queryFn"
+  > = {},
+) {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  return useSuspenseQuery<
+    AxiosResponse<ListPublicationsResponse>,
+    AxiosError<ListPublicationsError>
+  >({
+    queryKey: ["publications", params],
+    queryFn: async () => authFetchDebArchive.get("publications", { params }),
+    ...options,
+  });
+}
diff --git a/src/features/mirrors/api/useSyncMirror.ts b/src/features/mirrors/api/useSyncMirror.ts
new file mode 100644
index 000000000..ab900fe0e
--- /dev/null
+++ b/src/features/mirrors/api/useSyncMirror.ts
@@ -0,0 +1,27 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type {
+  SyncMirrorData,
+  SyncMirrorError,
+  SyncMirrorResponse,
+} from "@canonical/landscape-openapi";
+import { useMutation } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+
+export interface UseSyncMirrorVariables {
+  mirrorName: SyncMirrorData["path"]["name"];
+  params?: SyncMirrorData["body"];
+}
+
+export function useSyncMirror() {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  return useMutation<
+    AxiosResponse<SyncMirrorResponse>,
+    AxiosError<SyncMirrorError>,
+    UseSyncMirrorVariables
+  >({
+    mutationKey: ["mirrors"],
+    mutationFn: async ({ mirrorName, params }) =>
+      authFetchDebArchive.post(`${mirrorName}:sync`, params),
+  });
+}
diff --git a/src/features/mirrors/api/useUpdateMirror.ts b/src/features/mirrors/api/useUpdateMirror.ts
new file mode 100644
index 000000000..f25ddaf52
--- /dev/null
+++ b/src/features/mirrors/api/useUpdateMirror.ts
@@ -0,0 +1,27 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type {
+  UpdateMirrorData,
+  UpdateMirrorError,
+  UpdateMirrorResponse,
+} from "@canonical/landscape-openapi";
+import { useMutation } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+
+export interface UseUpdateMirrorVariables {
+  mirrorName: UpdateMirrorData["path"]["mirror.name"];
+  params: UpdateMirrorData["body"];
+}
+
+export function useUpdateMirror() {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  return useMutation<
+    AxiosResponse<UpdateMirrorResponse>,
+    AxiosError<UpdateMirrorError>,
+    UseUpdateMirrorVariables
+  >({
+    mutationKey: ["mirrors"],
+    mutationFn: async ({ mirrorName, params }) =>
+      authFetchDebArchive.patch(mirrorName, params),
+  });
+}
diff --git a/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.tsx b/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.tsx
new file mode 100644
index 000000000..4e24b4b91
--- /dev/null
+++ b/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.tsx
@@ -0,0 +1,322 @@
+import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
+import useDebug from "@/hooks/useDebug";
+import type { SelectOption } from "@/types/SelectOption";
+import { getFormikError } from "@/utils/formikErrors";
+import {
+  CheckboxInput,
+  Form,
+  Icon,
+  ICONS,
+  Input,
+  Select,
+  Textarea,
+  Tooltip,
+} from "@canonical/react-components";
+import { useFormik } from "formik";
+import type { ComponentProps, FC } from "react";
+import type { FormProps } from "./types";
+import SidePanel from "@/components/layout/SidePanel/SidePanel";
+import Blocks from "@/components/layout/Blocks";
+import {
+  useCreateMirror,
+  useGetUbuntuArchiveInfo,
+  useGetUbuntuEsmInfo,
+} from "../../api";
+import { getInitialValues } from "./helpers";
+import useNotify from "@/hooks/useNotify";
+import usePageParams from "@/hooks/usePageParams";
+import SelectableMirrorContentsBlock from "../SelectableMirrorContentsBlock";
+import { UBUNTU_SNAPSHOTS_HOST } from "../../constants";
+import ReadOnlyField from "@/components/form/ReadOnlyField";
+import { isArchiveInfoValid } from "../../helpers";
+import * as Yup from "yup";
+
+const AddMirrorForm: FC = () => {
+  const debug = useDebug();
+  const { notify } = useNotify();
+  const { createPageParamsSetter } = usePageParams();
+
+  const ubuntuArchiveInfo = useGetUbuntuArchiveInfo().data.data;
+  const ubuntuEsmInfo = useGetUbuntuEsmInfo().data.data.results;
+  const createMirror = useCreateMirror().mutateAsync;
+  const close = createPageParamsSetter({ sidePath: [] });
+
+  const formik = useFormik<FormProps>({
+    initialValues: getInitialValues({
+      ubuntuArchiveInfo,
+      ubuntuEsmInfo,
+    }),
+
+    validationSchema: Yup.object().shape({
+      name: Yup.string().required("This field is required."),
+      sourceType: Yup.string().required("This field is required."),
+      sourceUrl: Yup.string().required("This field is required."),
+      distribution: Yup.string().required("This field is required."),
+      components: Yup.array()
+        .of(Yup.string())
+        .min(1, "At least one component must be specified."),
+      architectures: Yup.array()
+        .of(Yup.string())
+        .min(1, "At least one architecture must be specified."),
+      token: Yup.string().when("sourceType", {
+        is: "ubuntu-pro",
+        then: (schema) => schema.required("This field is required."),
+      }),
+      snapshotDate: Yup.string().when("sourceType", {
+        is: "ubuntu-snapshots",
+        then: (schema) => schema.required("This field is required."),
+      }),
+      proService: Yup.string().when("sourceType", {
+        is: "ubuntu-pro",
+        then: (schema) => schema.required("This field is required."),
+      }),
+    }),
+
+    validateOnBlur: true,
+
+    onSubmit: async (values) => {
+      try {
+        const archiveRoot =
+          values.sourceType === "ubuntu-snapshots"
+            ? `https://${UBUNTU_SNAPSHOTS_HOST}/ubuntu/${values.snapshotDate}`
+            : values.sourceUrl;
+
+        await createMirror({
+          archiveRoot,
+          components: values.components.map((component) => component.trim()),
+          displayName: values.name,
+          architectures: values.architectures.map((architecture) =>
+            architecture.trim(),
+          ),
+          distribution: values.distribution,
+          downloadInstaller: values.downloadInstallerFiles,
+          downloadSources: values.downloadSources,
+          downloadUdebs: values.downloadUdebPackages,
+          gpgKey:
+            values.verificationGpgKey === undefined
+              ? undefined
+              : {
+                  armor: values.verificationGpgKey,
+                },
+        });
+
+        close();
+
+        notify.success({
+          title: `You have successfully added ${values.name}.`,
+          message: "The mirror has been created.",
+        });
+      } catch (error) {
+        debug(error);
+      }
+    },
+  });
+
+  const proServiceOptions: SelectOption[] = ubuntuEsmInfo.map((proService) => ({
+    label: proService.label,
+    value: proService.mirror_type,
+    disabled: !isArchiveInfoValid(proService),
+  }));
+
+  return (
+    <>
+      <SidePanel.Header>Add mirror</SidePanel.Header>
+      <SidePanel.Content>
+        <Form onSubmit={formik.handleSubmit} noValidate>
+          <Blocks>
+            <Blocks.Item title="Details">
+              <Input
+                type="text"
+                label="Name"
+                required
+                {...formik.getFieldProps("name")}
+                error={getFormikError(formik, "name")}
+              />
+              <Select
+                label="Source type"
+                required
+                options={[
+                  {
+                    label: "Ubuntu archive",
+                    value: "ubuntu-archive",
+                    disabled: !isArchiveInfoValid(ubuntuArchiveInfo),
+                  },
+                  {
+                    label: "Ubuntu snapshots",
+                    value: "ubuntu-snapshots",
+                    disabled: !isArchiveInfoValid(ubuntuArchiveInfo),
+                  },
+                  {
+                    label: "Ubuntu Pro",
+                    value: "ubuntu-pro",
+                    disabled: !ubuntuEsmInfo.some(isArchiveInfoValid),
+                  },
+                  { label: "Third party", value: "third-party" },
+                ]}
+                {...formik.getFieldProps("sourceType")}
+                onChange={(event) => {
+                  if (
+                    !(
+                      event.target.value === "ubuntu-archive" ||
+                      event.target.value === "ubuntu-snapshots" ||
+                      event.target.value === "ubuntu-pro" ||
+                      event.target.value === "third-party"
+                    )
+                  ) {
+                    throw new Error();
+                  }
+
+                  formik.setValues({
+                    ...getInitialValues({
+                      sourceType: event.target.value,
+                      ubuntuArchiveInfo,
+                      ubuntuEsmInfo,
+                    }),
+                    name: formik.values.name,
+                    downloadUdebPackages: formik.values.downloadUdebPackages,
+                    downloadInstallerFiles:
+                      formik.values.downloadInstallerFiles,
+                    downloadSources: formik.values.downloadSources,
+                  });
+                }}
+                error={getFormikError(formik, "sourceType")}
+              />
+              {formik.values.sourceType === "ubuntu-pro" && (
+                <Input
+                  type="text"
+                  label="Token"
+                  required
+                  {...formik.getFieldProps("token")}
+                  error={getFormikError(formik, "token")}
+                />
+              )}
+              {formik.values.sourceType === "third-party" ? (
+                <Input
+                  type="text"
+                  label="Source URL"
+                  required
+                  {...formik.getFieldProps("sourceUrl")}
+                  error={getFormikError(formik, "sourceUrl")}
+                />
+              ) : (
+                <ReadOnlyField
+                  label="Source URL"
+                  value={formik.values.sourceUrl}
+                  tooltipMessage="The source URL is set automatically by the source type."
+                />
+              )}
+            </Blocks.Item>
+            <Blocks.Item title="Mirror contents">
+              {formik.values.sourceType === "ubuntu-snapshots" && (
+                <Input
+                  type="date"
+                  label="Snapshot date"
+                  required
+                  {...formik.getFieldProps("snapshotDate")}
+                  error={getFormikError(formik, "snapshotDate")}
+                />
+              )}
+              {formik.values.sourceType === "ubuntu-pro" && (
+                <Select
+                  label="Pro service"
+                  required
+                  options={proServiceOptions}
+                  {...formik.getFieldProps("proService")}
+                  error={getFormikError(formik, "proService")}
+                />
+              )}
+              {formik.values.sourceType === "third-party" ? (
+                <>
+                  <Input
+                    type="text"
+                    label="Distribution"
+                    required
+                    {...formik.getFieldProps("distribution")}
+                    error={getFormikError(formik, "distribution")}
+                  />
+                  <Input
+                    type="text"
+                    label="Components"
+                    {...formik.getFieldProps("components")}
+                    error={getFormikError(formik, "components")}
+                    value={formik.values.components.join(", ")}
+                    onChange={async (event) => {
+                      await formik.setFieldValue(
+                        "components",
+                        event.target.value.split(", ").filter(Boolean),
+                      );
+                    }}
+                    required
+                  />
+                  <Input
+                    type="text"
+                    label="Architectures"
+                    {...formik.getFieldProps("architectures")}
+                    error={getFormikError(formik, "architectures")}
+                    value={formik.values.architectures.join(", ")}
+                    onChange={async (event) => {
+                      await formik.setFieldValue(
+                        "architectures",
+                        event.target.value.split(", ").filter(Boolean),
+                      );
+                    }}
+                    required
+                  />
+                </>
+              ) : (
+                <SelectableMirrorContentsBlock
+                  formik={
+                    formik as ComponentProps<
+                      typeof SelectableMirrorContentsBlock
+                    >["formik"]
+                  }
+                  ubuntuArchiveInfo={ubuntuArchiveInfo}
+                  ubuntuEsmInfo={ubuntuEsmInfo}
+                />
+              )}
+              <p>Download options:</p>
+              <CheckboxInput
+                label="Download .udeb packages "
+                {...formik.getFieldProps("downloadUdebPackages")}
+                checked={formik.values.downloadUdebPackages}
+                inline
+              />
+              <Tooltip
+                position="right"
+                message="Enables the mirroring of micro-debian (.udeb) packages. These are essential if you intend to use this mirror for network booting (PXE), netboot installations, or hardware discovery during the initial OS installation process."
+              >
+                <Icon name={ICONS.help} />
+              </Tooltip>
+              <CheckboxInput
+                label="Download sources"
+                {...formik.getFieldProps("downloadSources")}
+                checked={formik.values.downloadSources}
+              />
+              <CheckboxInput
+                label="Download installer files"
+                {...formik.getFieldProps("downloadInstallerFiles")}
+                checked={formik.values.downloadInstallerFiles}
+              />
+            </Blocks.Item>
+            {formik.values.sourceType === "third-party" && (
+              <Blocks.Item title="Authentication">
+                <Textarea
+                  label="Verification GPG key"
+                  {...formik.getFieldProps("verificationGpgKey")}
+                  error={getFormikError(formik, "verificationGpgKey")}
+                />
+              </Blocks.Item>
+            )}
+          </Blocks>
+          <SidePanelFormButtons
+            submitButtonLoading={formik.isSubmitting}
+            submitButtonText="Add mirror"
+            onCancel={close}
+          />
+        </Form>
+      </SidePanel.Content>
+    </>
+  );
+};
+
+export default AddMirrorForm;
diff --git a/src/features/mirrors/components/NewSeriesForm/constants.ts b/src/features/mirrors/components/AddMirrorForm/constants.ts
similarity index 54%
rename from src/features/mirrors/components/NewSeriesForm/constants.ts
rename to src/features/mirrors/components/AddMirrorForm/constants.ts
index da27e2c68..4d83d6fca 100644
--- a/src/features/mirrors/components/NewSeriesForm/constants.ts
+++ b/src/features/mirrors/components/AddMirrorForm/constants.ts
@@ -1,26 +1,8 @@
-import { INPUT_DATE_FORMAT } from "@/constants";
 import type { SelectOption } from "@/types/SelectOption";
-import moment from "moment";
-import type { FormProps } from "./types";
 
 export const SNAPSHOT_START_DATE = "2023-02-28";
 export const SNAPSHOT_TIMESTAMP_FORMAT = "YYYYMMDD[T]HHmmss[Z]";
 
-export const INITIAL_VALUES: FormProps = {
-  type: "ubuntu",
-  name: "",
-  distribution: "",
-  mirror_series: "",
-  mirror_uri: "",
-  gpg_key: "",
-  pockets: [],
-  components: [],
-  architectures: [],
-  include_udeb: false,
-  hasPockets: false,
-  snapshotDate: moment().format(INPUT_DATE_FORMAT),
-};
-
 export const POCKET_OPTIONS: SelectOption[] = [
   {
     label: "Release",
diff --git a/src/features/mirrors/components/AddMirrorForm/helpers.ts b/src/features/mirrors/components/AddMirrorForm/helpers.ts
new file mode 100644
index 000000000..4344a1395
--- /dev/null
+++ b/src/features/mirrors/components/AddMirrorForm/helpers.ts
@@ -0,0 +1,162 @@
+import { INPUT_DATE_FORMAT } from "@/constants";
+import moment from "moment";
+import type {
+  BaseFormProps,
+  FormProps,
+  ThirdPartyFormProps,
+  UbuntuArchiveFormProps,
+  UbuntuProFormProps,
+  UbuntuSnapshotsFormProps,
+} from "./types";
+import type {
+  Architecture,
+  Component,
+  Distribution,
+  UbuntuArchiveInfo,
+} from "../../types";
+import { UBUNTU_ARCHIVE_HOST, UBUNTU_PRO_HOST } from "../../constants";
+import { hasOneItem } from "@/utils/_helpers";
+import { isArchiveInfoValid } from "../../helpers";
+
+export function getStrippedUrl(url: string): string {
+  return url.replace(/\/[^\\/@]*@/, "/");
+}
+
+export function getInitialSourceType({
+  ubuntuArchiveInfo,
+  ubuntuEsmInfo,
+}: {
+  ubuntuArchiveInfo: UbuntuArchiveInfo;
+  ubuntuEsmInfo: UbuntuArchiveInfo[];
+}) {
+  if (isArchiveInfoValid(ubuntuArchiveInfo)) {
+    return "ubuntu-archive";
+  } else if (ubuntuEsmInfo.some(isArchiveInfoValid)) {
+    return "ubuntu-pro";
+  } else {
+    return "third-party";
+  }
+}
+
+export function getInitialDistribution(
+  distributions: Distribution[],
+): Distribution {
+  const preselectedDistribution = distributions.find(
+    ({ preselected }: Component | Architecture) => preselected,
+  );
+
+  const [firstDistribution] = distributions;
+
+  const emptyDistribution = {
+    architectures: [],
+    components: [],
+    label: "",
+    slug: "",
+    preselected: false,
+  };
+
+  return preselectedDistribution ?? firstDistribution ?? emptyDistribution;
+}
+
+export function getInitialBaseValues(
+  distributions: Distribution[],
+): Omit<BaseFormProps, "sourceType" | "sourceUrl"> {
+  const distribution: Distribution = getInitialDistribution(distributions);
+
+  const preselectedComponents = hasOneItem(distribution.components)
+    ? distribution.components
+    : distribution.components.filter(({ preselected }) => preselected);
+
+  const components: string[] = preselectedComponents.map(
+    (component) => component.slug,
+  );
+
+  const preselectedArchitectures = hasOneItem(distribution.architectures)
+    ? distribution.architectures
+    : distribution.architectures.filter(({ preselected }) => preselected);
+
+  const architectures: string[] = preselectedArchitectures.map(
+    (architecture) => architecture.slug,
+  );
+
+  return {
+    name: "",
+    distribution: distribution.slug,
+    components,
+    architectures,
+    downloadUdebPackages: false,
+    downloadSources: false,
+    downloadInstallerFiles: false,
+  };
+}
+
+export function getInitialUbuntuArchiveValues(
+  ubuntuArchiveInfo: UbuntuArchiveInfo,
+): UbuntuArchiveFormProps {
+  return {
+    ...getInitialBaseValues(ubuntuArchiveInfo.distributions),
+    sourceType: "ubuntu-archive",
+    sourceUrl: `http://${UBUNTU_ARCHIVE_HOST}/ubuntu/`,
+  };
+}
+
+export function getInitialUbuntuSnapshotsValues(
+  ubuntuArchiveInfo: UbuntuArchiveInfo,
+): UbuntuSnapshotsFormProps {
+  return {
+    ...getInitialBaseValues(ubuntuArchiveInfo.distributions),
+    sourceType: "ubuntu-snapshots",
+    sourceUrl: `http://${UBUNTU_ARCHIVE_HOST}/ubuntu/`,
+    snapshotDate: moment().format(INPUT_DATE_FORMAT),
+  };
+}
+
+export const getInitialUbuntuProValues = (
+  ubuntuEsmInfo: UbuntuArchiveInfo[],
+): UbuntuProFormProps => {
+  const [firstValidProService] = ubuntuEsmInfo.filter(isArchiveInfoValid);
+  return {
+    ...getInitialBaseValues(
+      firstValidProService ? firstValidProService.distributions : [],
+    ),
+    sourceType: "ubuntu-pro",
+    token: "",
+    sourceUrl: `https://${UBUNTU_PRO_HOST}/`,
+    proService: firstValidProService ? firstValidProService.mirror_type : "",
+  };
+};
+
+export const getInitialThirdPartyValues = (): ThirdPartyFormProps => {
+  return {
+    ...getInitialBaseValues([]),
+    sourceType: "third-party",
+    sourceUrl: "",
+    verificationGpgKey: "",
+  };
+};
+
+export const getInitialValues = ({
+  sourceType,
+  ubuntuArchiveInfo,
+  ubuntuEsmInfo,
+}: {
+  sourceType?: FormProps["sourceType"];
+  ubuntuArchiveInfo: UbuntuArchiveInfo;
+  ubuntuEsmInfo: UbuntuArchiveInfo[];
+}): FormProps => {
+  sourceType ??= getInitialSourceType({
+    ubuntuArchiveInfo,
+    ubuntuEsmInfo,
+  });
+
+  switch (sourceType) {
+    case "ubuntu-archive":
+      return getInitialUbuntuArchiveValues(ubuntuArchiveInfo);
+    case "ubuntu-snapshots":
+      return getInitialUbuntuSnapshotsValues(ubuntuArchiveInfo);
+    case "ubuntu-pro":
+      return getInitialUbuntuProValues(ubuntuEsmInfo);
+    case "third-party":
+      return getInitialThirdPartyValues();
+  }
+};
diff --git a/src/features/mirrors/components/AddMirrorForm/index.ts b/src/features/mirrors/components/AddMirrorForm/index.ts
new file mode 100644
index 000000000..7b7b8cb61
--- /dev/null
+++ b/src/features/mirrors/components/AddMirrorForm/index.ts
@@ -0,0 +1 @@
+export { default } from "./AddMirrorForm";
diff --git a/src/features/mirrors/components/AddMirrorForm/types.ts b/src/features/mirrors/components/AddMirrorForm/types.ts
new file mode 100644
index 000000000..2078356f3
--- /dev/null
+++ b/src/features/mirrors/components/AddMirrorForm/types.ts
@@ -0,0 +1,41 @@
+export interface BaseFormProps {
+  name: string;
+  sourceType: string;
+  sourceUrl: string;
+  distribution: string;
+  components: string[];
+  architectures: string[];
+  downloadUdebPackages: boolean;
+  downloadSources: boolean;
+  downloadInstallerFiles: boolean;
+  token?: string;
+  snapshotDate?: string;
+  proService?: string;
+  verificationGpgKey?: string;
+}
+
+export interface UbuntuArchiveFormProps extends BaseFormProps {
+  sourceType: "ubuntu-archive";
+}
+
+export interface UbuntuSnapshotsFormProps extends BaseFormProps {
+  sourceType: "ubuntu-snapshots";
+  snapshotDate: string;
+}
+
+export interface UbuntuProFormProps extends BaseFormProps {
+  sourceType: "ubuntu-pro";
+  token: string;
+  proService: string;
+}
+
+export interface ThirdPartyFormProps extends BaseFormProps {
+  sourceType: "third-party";
+  verificationGpgKey: string;
+}
+
+export type FormProps =
+  | UbuntuArchiveFormProps
+  | UbuntuSnapshotsFormProps
+  | UbuntuProFormProps
+  | ThirdPartyFormProps;
diff --git a/src/features/mirrors/components/DeriveSeriesForm/DeriveSeriesForm.test.tsx b/src/features/mirrors/components/DeriveSeriesForm/DeriveSeriesForm.test.tsx
deleted file mode 100644
index bfff6fc2e..000000000
--- a/src/features/mirrors/components/DeriveSeriesForm/DeriveSeriesForm.test.tsx
+++ /dev/null
@@ -1,28 +0,0 @@
-import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
-import DeriveSeriesForm from "./DeriveSeriesForm";
-import type { ComponentProps } from "react";
-import { distributions } from "@/tests/mocks/distributions";
-
-const props: ComponentProps<typeof DeriveSeriesForm> = {
-  distribution: distributions[0],
-  origin: "focal",
-};
-
-describe("DeriveSeriesForm", () => {
-  it("renders form fields", () => {
-    const { container } = renderWithProviders(<DeriveSeriesForm {...props} />);
-
-    expect(container).toHaveTexts(["Series name"]);
-
-    const informationText = screen.getByText(
-      `You are deriving ${props.distribution.name}/${props.origin}.`,
-    );
-    expect(informationText).toBeVisible();
-
-    const deriveSeriesButton = screen.getByRole("button", {
-      name: /derive series/i,
-    });
-    expect(deriveSeriesButton).toBeInTheDocument();
-  });
-});
diff --git a/src/features/mirrors/components/DeriveSeriesForm/DeriveSeriesForm.tsx b/src/features/mirrors/components/DeriveSeriesForm/DeriveSeriesForm.tsx
deleted file mode 100644
index b8558f37e..000000000
--- a/src/features/mirrors/components/DeriveSeriesForm/DeriveSeriesForm.tsx
+++ /dev/null
@@ -1,83 +0,0 @@
-import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
-import useDebug from "@/hooks/useDebug";
-import useSidePanel from "@/hooks/useSidePanel";
-import { getFormikError } from "@/utils/formikErrors";
-import { testLowercaseAlphaNumeric } from "@/utils/tests";
-import { Form, Input } from "@canonical/react-components";
-import { useFormik } from "formik";
-import type { FC } from "react";
-import * as Yup from "yup";
-import { useSeries } from "../../hooks";
-import type { Distribution, Series } from "../../types";
-import { INITIAL_VALUES } from "./constants";
-import type { FormProps } from "./types";
-
-interface DeriveSeriesProps {
-  readonly distribution: Distribution;
-  readonly origin: Series["name"];
-}
-
-const DeriveSeriesForm: FC<DeriveSeriesProps> = ({ distribution, origin }) => {
-  const debug = useDebug();
-  const { closeSidePanel } = useSidePanel();
-  const { deriveSeriesQuery } = useSeries();
-
-  const { mutateAsync: deriveSeries } = deriveSeriesQuery;
-
-  const validationSchema = Yup.object().shape({
-    name: Yup.string()
-      .required("This field is required")
-      .test({
-        test: testLowercaseAlphaNumeric.test,
-        message: testLowercaseAlphaNumeric.message,
-      })
-      .test({
-        params: { distribution },
-        test: (value) => {
-          return !distribution.series.map(({ name }) => name).includes(value);
-        },
-        message: "It must be unique within the distribution.",
-      }),
-  });
-
-  const formik = useFormik<FormProps>({
-    validationSchema,
-    initialValues: INITIAL_VALUES,
-    onSubmit: async (values) => {
-      try {
-        await deriveSeries({
-          name: values.name,
-          distribution: distribution.name,
-          origin,
-        });
-
-        closeSidePanel();
-      } catch (error) {
-        debug(error);
-      }
-    },
-  });
-
-  return (
-    <Form onSubmit={formik.handleSubmit} noValidate>
-      <Input
-        type="text"
-        label="Series name"
-        required
-        {...formik.getFieldProps("name")}
-        error={getFormikError(formik, "name")}
-      />
-
-      <p className="u-text--muted">
-        You are deriving {distribution.name}/{origin}.
-      </p>
-
-      <SidePanelFormButtons
-        submitButtonDisabled={formik.isSubmitting}
-        submitButtonText="Derive series"
-      />
-    </Form>
-  );
-};
-
-export default DeriveSeriesForm;
diff --git a/src/features/mirrors/components/DeriveSeriesForm/constants.ts b/src/features/mirrors/components/DeriveSeriesForm/constants.ts
deleted file mode 100644
index 3bffe58e1..000000000
--- a/src/features/mirrors/components/DeriveSeriesForm/constants.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-import type { FormProps } from "./types";
-
-export const INITIAL_VALUES: FormProps = {
-  name: "",
-};
diff --git a/src/features/mirrors/components/DeriveSeriesForm/index.ts b/src/features/mirrors/components/DeriveSeriesForm/index.ts
deleted file mode 100644
index b9020de96..000000000
--- a/src/features/mirrors/components/DeriveSeriesForm/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./DeriveSeriesForm";
diff --git a/src/features/mirrors/components/DeriveSeriesForm/types.ts b/src/features/mirrors/components/DeriveSeriesForm/types.ts
deleted file mode 100644
index bf457e579..000000000
--- a/src/features/mirrors/components/DeriveSeriesForm/types.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export interface FormProps {
-  name: string;
-}
diff --git a/src/features/mirrors/components/DistributionCard/DistributionCard.module.scss b/src/features/mirrors/components/DistributionCard/DistributionCard.module.scss
deleted file mode 100644
index dc639e408..000000000
--- a/src/features/mirrors/components/DistributionCard/DistributionCard.module.scss
+++ /dev/null
@@ -1,20 +0,0 @@
-@import "vanilla-framework/scss/settings_colors";
-@import "vanilla-framework/scss/settings_spacing";
-
-.item {
-  &:not(:last-child) {
-    margin-bottom: $sp-x-large;
-  }
-}
-
-.titleGroup {
-  align-items: center;
-  column-gap: $sph--large;
-  display: flex;
-  margin-bottom: $spv--large;
-
-  .title,
-  button {
-    margin-bottom: 0 !important;
-  }
-}
diff --git a/src/features/mirrors/components/DistributionCard/DistributionCard.test.tsx b/src/features/mirrors/components/DistributionCard/DistributionCard.test.tsx
deleted file mode 100644
index 1aa4ab734..000000000
--- a/src/features/mirrors/components/DistributionCard/DistributionCard.test.tsx
+++ /dev/null
@@ -1,134 +0,0 @@
-import { resetScreenSize, setScreenSize } from "@/tests/helpers";
-import { distributions } from "@/tests/mocks/distributions";
-import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import type { ComponentProps } from "react";
-import { vi } from "vitest";
-import DistributionCard from "./DistributionCard";
-
-const commonProps: ComponentProps<typeof DistributionCard> = {
-  distribution: {
-    access_group: "",
-    creation_time: "",
-    name: "distribution-name",
-    series: [],
-  },
-  syncPocketRefAdd: vi.fn(),
-  syncPocketRefs: [],
-};
-
-const emptySeriesProps: ComponentProps<typeof DistributionCard> = commonProps;
-const withSeriesProps: ComponentProps<typeof DistributionCard> = {
-  ...commonProps,
-  distribution: {
-    ...commonProps.distribution,
-    series: distributions.find((d) => d.series.length > 0)?.series ?? [],
-  },
-};
-
-const checkModalActions = async ({
-  distributionName,
-  isLarge,
-}: {
-  distributionName: string;
-  isLarge: boolean;
-}) => {
-  const removeDistributionAction = await screen.findByRole(
-    isLarge ? "button" : "menuitem",
-    { name: /remove distribution/i },
-  );
-
-  expect(removeDistributionAction).toBeVisible();
-
-  await userEvent.click(removeDistributionAction);
-
-  const removeButton = screen.getByRole("button", {
-    name: "Remove",
-  });
-  const cancelButton = screen.getByRole("button", {
-    name: /cancel/i,
-  });
-
-  expect(removeButton).toBeVisible();
-  expect(cancelButton).toBeVisible();
-
-  expect(
-    screen.getByText("Are you sure? This action cannot be undone."),
-  ).toBeVisible();
-
-  await userEvent.click(cancelButton);
-
-  if (!isLarge) {
-    await userEvent.click(
-      screen.getByLabelText(`${distributionName} distribution actions`),
-    );
-  }
-  const addSeriesAction = await screen.findByRole(
-    isLarge ? "button" : "menuitem",
-    { name: /add series/i },
-  );
-  expect(addSeriesAction).toBeVisible();
-};
-
-describe("DistributionCard", () => {
-  afterEach(() => {
-    resetScreenSize();
-  });
-
-  it("renders menu buttons", async () => {
-    setScreenSize("lg");
-
-    renderWithProviders(<DistributionCard {...commonProps} />);
-
-    await checkModalActions({
-      distributionName: commonProps.distribution.name,
-      isLarge: true,
-    });
-  });
-
-  it("renders contextual menu buttons", async () => {
-    setScreenSize("xs");
-
-    renderWithProviders(<DistributionCard {...commonProps} />);
-
-    const contextualMenuButton = await screen.findByRole("button", {
-      name: /actions/i,
-    });
-    expect(contextualMenuButton).toBeVisible();
-
-    await userEvent.click(contextualMenuButton);
-    await checkModalActions({
-      distributionName: commonProps.distribution.name,
-      isLarge: false,
-    });
-  });
-
-  it("renders empty distribution card", () => {
-    renderWithProviders(<DistributionCard {...emptySeriesProps} />);
-
-    expect(screen.getByText(emptySeriesProps.distribution.name)).toBeVisible();
-    expect(screen.getByText("No series have been added yet")).toBeVisible();
-    expect(
-      screen.getByText("Add a new mirror or series to get started"),
-    ).toBeVisible();
-    expect(
-      screen.getByRole("button", {
-        name: /add mirror/i,
-      }),
-    ).toBeVisible();
-  });
-
-  it("renders distribution card with series", () => {
-    const { container } = renderWithProviders(
-      <DistributionCard {...withSeriesProps} />,
-    );
-
-    expect(screen.getByText(withSeriesProps.distribution.name)).toBeVisible();
-
-    expect(container).toHaveTexts(["Pocket", "Mode", "Last synced", "Content"]);
-    for (const series of withSeriesProps.distribution.series) {
-      expect(screen.getByText(series.name)).toBeVisible();
-    }
-  });
-});
diff --git a/src/features/mirrors/components/DistributionCard/DistributionCard.tsx b/src/features/mirrors/components/DistributionCard/DistributionCard.tsx
deleted file mode 100644
index d4bb61434..000000000
--- a/src/features/mirrors/components/DistributionCard/DistributionCard.tsx
+++ /dev/null
@@ -1,189 +0,0 @@
-import ListActions from "@/components/layout/ListActions";
-import LoadingState from "@/components/layout/LoadingState";
-import useDebug from "@/hooks/useDebug";
-import useSidePanel from "@/hooks/useSidePanel";
-import type { Action } from "@/types/Action";
-import {
-  Button,
-  ConfirmationButton,
-  ConfirmationModal,
-} from "@canonical/react-components";
-import classNames from "classnames";
-import type { FC } from "react";
-import { lazy, Suspense, useState } from "react";
-import { useMediaQuery } from "usehooks-ts";
-import { useDistributions } from "../../hooks";
-import type { Distribution, SyncPocketRef } from "../../types";
-import EmptyDistribution from "../EmptyDistribution/EmptyDistribution";
-import SeriesCard from "../SeriesCard";
-import classes from "./DistributionCard.module.scss";
-
-const NewSeriesForm = lazy(async () => import("../NewSeriesForm"));
-
-interface DistributionCardProps {
-  readonly distribution: Distribution;
-  readonly syncPocketRefAdd: (ref: SyncPocketRef) => void;
-  readonly syncPocketRefs: SyncPocketRef[];
-}
-
-const DistributionCard: FC<DistributionCardProps> = ({
-  distribution,
-  syncPocketRefAdd,
-  syncPocketRefs,
-}) => {
-  const [modalOpen, setModalOpen] = useState(false);
-
-  const { setSidePanelContent } = useSidePanel();
-  const isLargeScreen = useMediaQuery("(min-width: 620px)");
-  const { removeDistributionQuery } = useDistributions();
-  const debug = useDebug();
-
-  const { mutateAsync: removeDistribution, isPending: isRemoving } =
-    removeDistributionQuery;
-
-  const handleAddSeries = (): void => {
-    setSidePanelContent(
-      `Add series to ${distribution.name}`,
-      <Suspense fallback={<LoadingState />}>
-        <NewSeriesForm distribution={distribution} ctaText="Add series" />
-      </Suspense>,
-    );
-  };
-
-  const handleOpenModal = (): void => {
-    setModalOpen(true);
-  };
-
-  const handleCloseModal = (): void => {
-    setModalOpen(false);
-  };
-
-  const handleRemoveDistribution = async (): Promise<void> => {
-    try {
-      await removeDistribution({ name: distribution.name });
-    } catch (error) {
-      debug(error);
-    } finally {
-      handleCloseModal();
-    }
-  };
-
-  const addSeriesButton = {
-    label: "Add series",
-    ariaLabel: `Add series to ${distribution.name}`,
-    onClick: handleAddSeries,
-  };
-
-  const removeDistributionButton = {
-    label: "Remove distribution",
-    ariaLabel: `Remove ${distribution.name} distribution`,
-    appearance: "negative",
-    modalTitle: `Removing ${distribution.name} distribution`,
-    modalBody: <p>Are you sure? This action cannot be undone.</p>,
-    modalActionLabel: "Remove",
-    isLoading: isRemoving,
-    onClick: handleOpenModal,
-    onConfirm: handleRemoveDistribution,
-  };
-
-  const largeScreenButtons = [
-    <Button
-      key={`${addSeriesButton.label}-button`}
-      type="button"
-      className="is-small"
-      aria-label={addSeriesButton.ariaLabel}
-      onClick={addSeriesButton.onClick}
-    >
-      {addSeriesButton.label}
-    </Button>,
-    <ConfirmationButton
-      key={`${removeDistributionButton.label}-button`}
-      type="button"
-      className="is-small"
-      aria-label={removeDistributionButton.ariaLabel}
-      confirmationModalProps={{
-        title: removeDistributionButton.modalTitle,
-        children: removeDistributionButton.modalBody,
-        confirmButtonLabel: removeDistributionButton.modalActionLabel,
-        confirmButtonAppearance: removeDistributionButton.appearance,
-        confirmButtonLoading: isRemoving,
-        confirmButtonDisabled: isRemoving,
-        onConfirm: removeDistributionButton.onConfirm,
-      }}
-    >
-      {removeDistributionButton.label}
-    </ConfirmationButton>,
-  ];
-
-  const actions: Action[] = [
-    {
-      icon: "plus",
-      label: addSeriesButton.label,
-      "aria-label": addSeriesButton.ariaLabel,
-      onClick: addSeriesButton.onClick,
-    },
-  ];
-
-  const destructiveActions: Action[] = [
-    {
-      icon: "delete",
-      label: removeDistributionButton.label,
-      "aria-label": removeDistributionButton.ariaLabel,
-      onClick: removeDistributionButton.onClick,
-    },
-  ];
-
-  return (
-    <>
-      <div className={classes.item}>
-        <div className={classes.titleGroup}>
-          <h2
-            className={classNames(
-              "p-heading--4 u-no-margin--bottom u-no-padding--top",
-              classes.title,
-            )}
-          >
-            {distribution.name}
-          </h2>
-          {isLargeScreen ? (
-            <div>{largeScreenButtons}</div>
-          ) : (
-            <ListActions
-              toggleAriaLabel={`${distribution.name} distribution actions`}
-              actions={actions}
-              destructiveActions={destructiveActions}
-            />
-          )}
-        </div>
-        {!distribution.series.length ? (
-          <EmptyDistribution distribution={distribution} />
-        ) : (
-          distribution.series.map((series) => (
-            <SeriesCard
-              key={series.name}
-              distribution={distribution}
-              series={series}
-              syncPocketRefAdd={syncPocketRefAdd}
-              syncPocketRefs={syncPocketRefs}
-            />
-          ))
-        )}
-      </div>
-      {modalOpen && (
-        <ConfirmationModal
-          title={removeDistributionButton.modalTitle}
-          confirmButtonLabel={removeDistributionButton.modalActionLabel}
-          confirmButtonAppearance={removeDistributionButton.appearance}
-          confirmButtonDisabled={removeDistributionButton.isLoading}
-          confirmButtonLoading={removeDistributionButton.isLoading}
-          onConfirm={removeDistributionButton.onConfirm}
-          close={handleCloseModal}
-        >
-          {removeDistributionButton.modalBody}
-        </ConfirmationModal>
-      )}
-    </>
-  );
-};
-
-export default DistributionCard;
diff --git a/src/features/mirrors/components/DistributionCard/index.ts b/src/features/mirrors/components/DistributionCard/index.ts
deleted file mode 100644
index 1a89614b8..000000000
--- a/src/features/mirrors/components/DistributionCard/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export { default } from "./DistributionCard";
-export { default as distributionCardClasses } from "./DistributionCard.module.scss";
diff --git a/src/features/mirrors/components/DistributionContainer/DistributionContainer.test.tsx b/src/features/mirrors/components/DistributionContainer/DistributionContainer.test.tsx
deleted file mode 100644
index 13337de62..000000000
--- a/src/features/mirrors/components/DistributionContainer/DistributionContainer.test.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import { renderWithProviders } from "@/tests/render";
-import type { ComponentProps } from "react";
-import { vi } from "vitest";
-import DistributionContainer from "./DistributionContainer";
-import { setEndpointStatus } from "@/tests/controllers/controller";
-import { expectLoadingState } from "@/tests/helpers";
-import { screen } from "@testing-library/react";
-import { distributions } from "@/tests/mocks/distributions";
-
-const props: ComponentProps<typeof DistributionContainer> = {
-  onDistributionsLengthChange: vi.fn(),
-};
-
-describe("DistributionContainer", () => {
-  it("renders empty state", async () => {
-    setEndpointStatus("empty");
-
-    renderWithProviders(<DistributionContainer {...props} />);
-
-    await expectLoadingState();
-    expect(screen.getByText("No mirrors have been added yet.")).toBeVisible();
-    expect(
-      screen.getByRole("button", { name: /add distribution/i }),
-    ).toBeVisible();
-  });
-
-  it("renders distributions", async () => {
-    renderWithProviders(<DistributionContainer {...props} />);
-
-    await expectLoadingState();
-
-    for (const distribution of distributions) {
-      expect(screen.getByText(distribution.name)).toBeVisible();
-    }
-  });
-});
diff --git a/src/features/mirrors/components/DistributionContainer/DistributionContainer.tsx b/src/features/mirrors/components/DistributionContainer/DistributionContainer.tsx
deleted file mode 100644
index 64d829e4a..000000000
--- a/src/features/mirrors/components/DistributionContainer/DistributionContainer.tsx
+++ /dev/null
@@ -1,86 +0,0 @@
-import LoadingState from "@/components/layout/LoadingState";
-import type { FC } from "react";
-import { useEffect, useState } from "react";
-import { useDistributions } from "../../hooks";
-import type { SyncPocketRef } from "../../types";
-import DistributionCard from "../DistributionCard";
-import DistributionsEmptyState from "../DistributionsEmptyState";
-import { REFETCH_INTERVAL } from "./constants";
-
-interface DistributionContainerProps {
-  readonly onDistributionsLengthChange: (length: number) => void;
-}
-
-const DistributionContainer: FC<DistributionContainerProps> = ({
-  onDistributionsLengthChange,
-}) => {
-  const [syncPocketRefs, setSyncPocketRefs] = useState<SyncPocketRef[]>([]);
-
-  const { getDistributionsQuery } = useDistributions();
-
-  const { data, isLoading } = getDistributionsQuery(
-    {
-      include_latest_sync: true,
-    },
-    {
-      refetchInterval: !syncPocketRefs.length ? undefined : REFETCH_INTERVAL,
-    },
-  );
-
-  const distributions = data?.data ?? [];
-
-  useEffect(() => {
-    onDistributionsLengthChange(distributions.length);
-  }, [distributions.length]);
-
-  useEffect(() => {
-    for (const syncPocketRef of syncPocketRefs) {
-      const pocket = distributions
-        .find(({ name }) => name === syncPocketRef.distributionName)
-        ?.series.find(({ name }) => name === syncPocketRef.seriesName)
-        ?.pockets.find(({ name }) => name === syncPocketRef.pocketName);
-
-      if (
-        !pocket ||
-        (pocket.mode !== "mirror" && pocket.mode !== "pull") ||
-        pocket.last_sync_status === "in progress"
-      ) {
-        continue;
-      }
-
-      setSyncPocketRefs((prevState) =>
-        prevState.filter(
-          ({ distributionName }) =>
-            distributionName !== syncPocketRef.distributionName,
-        ),
-      );
-    }
-  }, [distributions]);
-
-  if (isLoading) {
-    return <LoadingState />;
-  }
-
-  if (!distributions.length) {
-    return <DistributionsEmptyState />;
-  }
-
-  const handleSyncPocketRefAdd = (ref: SyncPocketRef): void => {
-    setSyncPocketRefs((prevState) => [...prevState, ref]);
-  };
-
-  return (
-    <>
-      {distributions.map((distribution) => (
-        <DistributionCard
-          key={distribution.name}
-          distribution={distribution}
-          syncPocketRefAdd={handleSyncPocketRefAdd}
-          syncPocketRefs={syncPocketRefs}
-        />
-      ))}
-    </>
-  );
-};
-
-export default DistributionContainer;
diff --git a/src/features/mirrors/components/DistributionContainer/constants.ts b/src/features/mirrors/components/DistributionContainer/constants.ts
deleted file mode 100644
index 2b1153b91..000000000
--- a/src/features/mirrors/components/DistributionContainer/constants.ts
+++ /dev/null
@@ -1 +0,0 @@
-export const REFETCH_INTERVAL = 1000;
diff --git a/src/features/mirrors/components/DistributionContainer/index.ts b/src/features/mirrors/components/DistributionContainer/index.ts
deleted file mode 100644
index 98a5a7025..000000000
--- a/src/features/mirrors/components/DistributionContainer/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./DistributionContainer";
diff --git a/src/features/mirrors/components/DistributionsEmptyState/DistributionsEmptyState.test.tsx b/src/features/mirrors/components/DistributionsEmptyState/DistributionsEmptyState.test.tsx
deleted file mode 100644
index f239d5b92..000000000
--- a/src/features/mirrors/components/DistributionsEmptyState/DistributionsEmptyState.test.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import DistributionsEmptyState from "./DistributionsEmptyState";
-
-describe("DistributionsEmptyState", () => {
-  it("renders empty state", () => {
-    const { container } = renderWithProviders(<DistributionsEmptyState />);
-
-    expect(container).toHaveTexts([
-      "No mirrors have been added yet.",
-      "To add a new mirror, you must first add a distribution.",
-      "How to manage repositories in Landscape",
-    ]);
-
-    expect(
-      screen.getByRole("button", { name: /add distribution/i }),
-    ).toBeVisible();
-  });
-
-  it("opens sidepanel form", async () => {
-    renderWithProviders(<DistributionsEmptyState />);
-
-    await userEvent.click(
-      screen.getByRole("button", { name: /add distribution/i }),
-    );
-
-    const formTitle = await screen.findByRole("heading", {
-      name: /add distribution/i,
-    });
-    expect(formTitle).toBeVisible();
-  });
-});
diff --git a/src/features/mirrors/components/DistributionsEmptyState/DistributionsEmptyState.tsx b/src/features/mirrors/components/DistributionsEmptyState/DistributionsEmptyState.tsx
deleted file mode 100644
index cfc2ff7dc..000000000
--- a/src/features/mirrors/components/DistributionsEmptyState/DistributionsEmptyState.tsx
+++ /dev/null
@@ -1,53 +0,0 @@
-import EmptyState from "@/components/layout/EmptyState";
-import LoadingState from "@/components/layout/LoadingState";
-import useSidePanel from "@/hooks/useSidePanel";
-import { Button } from "@canonical/react-components";
-import type { FC } from "react";
-import { lazy, Suspense } from "react";
-
-const NewDistributionForm = lazy(async () => import("../NewDistributionForm"));
-
-const DistributionsEmptyState: FC = () => {
-  const { setSidePanelContent } = useSidePanel();
-
-  const handleCreateDistribution = (): void => {
-    setSidePanelContent(
-      "Add distribution",
-      <Suspense fallback={<LoadingState />}>
-        <NewDistributionForm />
-      </Suspense>,
-    );
-  };
-
-  return (
-    <EmptyState
-      title="No mirrors have been added yet."
-      icon="containers"
-      body={
-        <>
-          <p className="u-no-margin--bottom">
-            To add a new mirror, you must first add a distribution.
-          </p>
-          <a
-            href="https://ubuntu.com/landscape/docs/repositories"
-            target="_blank"
-            rel="nofollow noopener noreferrer"
-          >
-            How to manage repositories in Landscape
-          </a>
-        </>
-      }
-      cta={[
-        <Button
-          key="add-distribution"
-          onClick={handleCreateDistribution}
-          type="button"
-        >
-          Add distribution
-        </Button>,
-      ]}
-    />
-  );
-};
-
-export default DistributionsEmptyState;
diff --git a/src/features/mirrors/components/DistributionsEmptyState/index.ts b/src/features/mirrors/components/DistributionsEmptyState/index.ts
deleted file mode 100644
index 761093215..000000000
--- a/src/features/mirrors/components/DistributionsEmptyState/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./DistributionsEmptyState";
diff --git a/src/features/mirrors/components/EditMirrorForm/EditMirrorForm.tsx b/src/features/mirrors/components/EditMirrorForm/EditMirrorForm.tsx
new file mode 100644
index 000000000..1c758096f
--- /dev/null
+++ b/src/features/mirrors/components/EditMirrorForm/EditMirrorForm.tsx
@@ -0,0 +1,176 @@
+import type { FC } from "react";
+import SidePanel from "@/components/layout/SidePanel/SidePanel";
+import usePageParams from "@/hooks/usePageParams";
+import SidePanelFormButtons from "@/components/form/SidePanelFormButtons/SidePanelFormButtons";
+import useDebug from "@/hooks/useDebug";
+import useNotify from "@/hooks/useNotify";
+import { useGetMirror, useUpdateMirror } from "../../api";
+import { useFormik } from "formik";
+import type { FormProps } from "./types";
+import Blocks from "@/components/layout/Blocks";
+import {
+  CheckboxInput,
+  Form,
+  Icon,
+  ICONS,
+  Input,
+  Textarea,
+  Tooltip,
+} from "@canonical/react-components";
+import { getFormikError } from "@/utils/formikErrors";
+import { getSourceType } from "../MirrorDetails/helpers";
+import {
+  UBUNTU_ARCHIVE_HOST,
+  UBUNTU_PRO_HOST,
+  UBUNTU_SNAPSHOTS_HOST,
+} from "../../constants";
+import ReadOnlyField from "@/components/form/ReadOnlyField";
+import * as Yup from "yup";
+
+const EditMirrorForm: FC = () => {
+  const debug = useDebug();
+  const { notify } = useNotify();
+  const { name, sidePath, popSidePath, createPageParamsSetter } =
+    usePageParams();
+
+  const mirror = useGetMirror(name).data.data;
+  const updateMirror = useUpdateMirror().mutateAsync;
+
+  const close = createPageParamsSetter({ sidePath: [], name: "" });
+
+  const formik = useFormik<FormProps>({
+    initialValues: {
+      name: mirror.displayName,
+      downloadUdebPackages: !!mirror.downloadUdebs,
+      downloadSources: !!mirror.downloadSources,
+      downloadInstallerFiles: !!mirror.downloadInstaller,
+      verificationGpgKey: mirror.gpgKey?.armor,
+    },
+
+    validationSchema: Yup.object().shape({
+      name: Yup.string().required("This field is required."),
+    }),
+
+    onSubmit: async (values) => {
+      try {
+        await updateMirror({
+          mirrorName: name,
+          params: {
+            displayName: values.name,
+            archiveRoot: mirror.archiveRoot,
+            components: mirror.components,
+            downloadUdebs: values.downloadUdebPackages,
+            downloadSources: values.downloadSources,
+            downloadInstaller: values.downloadInstallerFiles,
+            gpgKey:
+              values.verificationGpgKey === undefined
+                ? undefined
+                : { armor: values.verificationGpgKey },
+          },
+        });
+
+        close();
+
+        notify.success({
+          title: `You have successfully edited ${mirror.displayName}.`,
+          message: "The mirror details have been updated.",
+        });
+      } catch (error) {
+        debug(error);
+      }
+    },
+  });
+
+  return (
+    <>
+      <SidePanel.Header>Edit {mirror.displayName}</SidePanel.Header>
+      <SidePanel.Content>
+        <Form onSubmit={formik.handleSubmit} noValidate>
+          <Blocks>
+            <Blocks.Item title="Details">
+              <Input
+                type="text"
+                label="Name"
+                required
+                {...formik.getFieldProps("name")}
+                error={getFormikError(formik, "name")}
+              />
+              <ReadOnlyField
+                label="Source type"
+                value={getSourceType(mirror.archiveRoot)}
+                tooltipMessage="You can’t change the source type after the mirror is created."
+              />
+              <ReadOnlyField
+                label="Source URL"
+                value={mirror.archiveRoot}
+                tooltipMessage="You can’t change the source URL after the mirror is created."
+              />
+            </Blocks.Item>
+            <Blocks.Item title="Mirror contents">
+              <ReadOnlyField
+                label="Distribution"
+                value={mirror.distribution}
+                tooltipMessage="You can’t change the distribution after the mirror is created."
+              />
+              <ReadOnlyField
+                label="Components"
+                value={mirror.components.join(", ")}
+                tooltipMessage="You can’t change the components after the mirror is created."
+              />
+              <ReadOnlyField
+                label="Architectures"
+                value={mirror.architectures?.join(", ")}
+                tooltipMessage="You can’t change the architectures after the mirror is created."
+              />
+              <p>Download options:</p>
+              <CheckboxInput
+                label="Download .udeb packages "
+                {...formik.getFieldProps("downloadUdebPackages")}
+                checked={formik.values.downloadUdebPackages}
+                inline
+              />
+              <Tooltip
+                position="right"
+                message="Enables the mirroring of micro-debian (.udeb) packages. These are essential if you intend to use this mirror for network booting (PXE), netboot installations, or hardware discovery during the initial OS installation process."
+              >
+                <Icon name={ICONS.help} />
+              </Tooltip>
+              <CheckboxInput
+                label="Download sources"
+                {...formik.getFieldProps("downloadSources")}
+                checked={formik.values.downloadSources}
+              />
+              <CheckboxInput
+                label="Download installer files"
+                {...formik.getFieldProps("downloadInstallerFiles")}
+                checked={formik.values.downloadInstallerFiles}
+              />
+              {![
+                UBUNTU_ARCHIVE_HOST,
+                UBUNTU_SNAPSHOTS_HOST,
+                UBUNTU_PRO_HOST,
+              ].includes(new URL(mirror.archiveRoot).host) && (
+                <Blocks.Item title="Authentication">
+                  <Textarea
+                    label="Verification GPG key"
+                    {...formik.getFieldProps("verificationGpgKey")}
+                    error={getFormikError(formik, "verificationGpgKey")}
+                  />
+                </Blocks.Item>
+              )}
+            </Blocks.Item>
+          </Blocks>
+          <SidePanelFormButtons
+            submitButtonLoading={formik.isSubmitting}
+            submitButtonText="Save changes"
+            onCancel={close}
+            hasBackButton={sidePath.length > 1}
+            onBackButtonPress={popSidePath}
+          />
+        </Form>
+      </SidePanel.Content>
+    </>
+  );
+};
+
+export default EditMirrorForm;
diff --git a/src/features/mirrors/components/EditMirrorForm/index.ts b/src/features/mirrors/components/EditMirrorForm/index.ts
new file mode 100644
index 000000000..1a67c0d32
--- /dev/null
+++ b/src/features/mirrors/components/EditMirrorForm/index.ts
@@ -0,0 +1 @@
+export { default } from "./EditMirrorForm";
diff --git a/src/features/mirrors/components/EditMirrorForm/types.ts b/src/features/mirrors/components/EditMirrorForm/types.ts
new file mode 100644
index 000000000..cbac1c125
--- /dev/null
+++ b/src/features/mirrors/components/EditMirrorForm/types.ts
@@ -0,0 +1,7 @@
+export interface FormProps {
+  name: string;
+  downloadUdebPackages: boolean;
+  downloadSources: boolean;
+  downloadInstallerFiles: boolean;
+  verificationGpgKey?: string;
+}
diff --git a/src/features/mirrors/components/EditPocketForm/EditPocketForm.test.tsx b/src/features/mirrors/components/EditPocketForm/EditPocketForm.test.tsx
deleted file mode 100644
index 6910bf14a..000000000
--- a/src/features/mirrors/components/EditPocketForm/EditPocketForm.test.tsx
+++ /dev/null
@@ -1,315 +0,0 @@
-import { setEndpointStatus } from "@/tests/controllers/controller";
-import { pockets } from "@/tests/mocks/pockets";
-import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import type { ComponentProps } from "react";
-import { DEFAULT_SNAPSHOT_URI } from "../../constants";
-import EditPocketForm from "./EditPocketForm";
-
-const mirrorPocket = pockets.find(
-  (p) => p.mode === "mirror" && !p.mirror_uri.startsWith(DEFAULT_SNAPSHOT_URI),
-);
-assert(mirrorPocket);
-const mirrorPocketProps: ComponentProps<typeof EditPocketForm> = {
-  distributionName: "Ubuntu",
-  seriesName: "Focal Fossa",
-  pocket: mirrorPocket,
-};
-
-const uploadPocket = pockets.find((p) => p.mode === "upload");
-assert(uploadPocket);
-const uploadPocketProps: ComponentProps<typeof EditPocketForm> = {
-  distributionName: "Ubuntu",
-  seriesName: "Focal Fossa",
-  pocket: uploadPocket,
-};
-const uploadPocketAllowUnsignedProps: ComponentProps<typeof EditPocketForm> = {
-  distributionName: "Ubuntu",
-  seriesName: "Focal Fossa",
-  pocket: {
-    ...uploadPocket,
-    upload_allow_unsigned: true,
-  },
-};
-
-const uploadPocketWithKnownGpgKeysProps: ComponentProps<typeof EditPocketForm> =
-  {
-    distributionName: "Ubuntu",
-    seriesName: "Focal Fossa",
-    pocket: {
-      ...uploadPocket,
-      upload_gpg_keys: [
-        {
-          fingerprint: "",
-          id: 26,
-          has_secret: false,
-          name: "test-public",
-        },
-      ],
-    },
-  };
-
-const pullPocketWithFilterType = pockets.find(
-  (p) => p.mode === "pull" && p.filter_type,
-);
-assert(pullPocketWithFilterType);
-const pullPocketWithFilterTypeProps: ComponentProps<typeof EditPocketForm> = {
-  distributionName: "Ubuntu",
-  seriesName: "Focal Fossa",
-  pocket: pullPocketWithFilterType,
-};
-
-const pullPocketWithoutFilterType = pockets.find(
-  (p) => p.mode === "pull" && p.filter_type === null,
-);
-assert(pullPocketWithoutFilterType);
-const pullPocketWithoutFilterTypeProps: ComponentProps<typeof EditPocketForm> =
-  {
-    distributionName: "Ubuntu",
-    seriesName: "Focal Fossa",
-    pocket: pullPocketWithoutFilterType,
-  };
-
-const fillRequiredFields = async (user: ReturnType<typeof userEvent.setup>) => {
-  await user.click(screen.getByRole("checkbox", { name: "Main" }));
-  await user.click(screen.getByRole("checkbox", { name: "amd64" }));
-};
-
-describe("EditPocketForm", () => {
-  beforeEach(() => {
-    setEndpointStatus("default");
-  });
-
-  it("renders form fields for mirror pocket", () => {
-    const { container } = renderWithProviders(
-      <EditPocketForm {...mirrorPocketProps} />,
-    );
-    expect(container).toHaveTexts([
-      "Components",
-      "Architectures",
-      "GPG Key",
-      "Mirror URI",
-      "Mirror suite",
-      "Mirror GPG key",
-    ]);
-
-    expect(screen.getByText("Include .udeb packages")).toBeInTheDocument();
-    expect(
-      screen.getByRole("button", {
-        name: /save changes/i,
-      }),
-    ).toBeVisible();
-  });
-
-  it("renders form fields for upload pocket", () => {
-    const { container } = renderWithProviders(
-      <EditPocketForm {...uploadPocketProps} />,
-    );
-    expect(container).toHaveTexts([
-      "Components",
-      "Architectures",
-      "GPG Key",
-      "Allow uploaded packages to be unsigned",
-      "Uploader GPG keys",
-    ]);
-
-    expect(screen.getByText("Include .udeb packages")).toBeInTheDocument();
-    expect(
-      screen.getByRole("button", {
-        name: /save changes/i,
-      }),
-    ).toBeVisible();
-  });
-
-  it("renders form fields for pull pocket with filter type", () => {
-    const { container } = renderWithProviders(
-      <EditPocketForm {...pullPocketWithFilterTypeProps} />,
-    );
-    expect(container).toHaveTexts([
-      "Components",
-      "Architectures",
-      "GPG Key",
-      "Filter packages",
-    ]);
-
-    expect(screen.getByText("Include .udeb packages")).toBeInTheDocument();
-    expect(
-      screen.getByRole("button", {
-        name: /save changes/i,
-      }),
-    ).toBeVisible();
-  });
-
-  it("renders form fields for pull pocket without filter type", () => {
-    const { container } = renderWithProviders(
-      <EditPocketForm {...pullPocketWithoutFilterTypeProps} />,
-    );
-    expect(container).toHaveTexts(["Components", "Architectures", "GPG Key"]);
-
-    expect(screen.getByText("Include .udeb packages")).toBeInTheDocument();
-    expect(
-      screen.getByRole("button", {
-        name: /save changes/i,
-      }),
-    ).toBeVisible();
-  });
-
-  it("disables uploader gpg keys when unsigned uploads are allowed", async () => {
-    const user = userEvent.setup();
-
-    renderWithProviders(<EditPocketForm {...uploadPocketProps} />);
-
-    await user.click(
-      screen.getByRole("checkbox", {
-        name: "Allow uploaded packages to be unsigned",
-      }),
-    );
-
-    expect(
-      screen.getByRole("combobox", { name: "Uploader GPG keys" }),
-    ).toHaveAttribute("disabled");
-  });
-
-  it("normalizes filter package input by removing spaces", async () => {
-    const user = userEvent.setup();
-
-    renderWithProviders(<EditPocketForm {...pullPocketWithFilterTypeProps} />);
-
-    const filterInput = screen.getByRole("textbox", {
-      name: "Filter packages",
-    });
-
-    await user.clear(filterInput);
-    await user.type(filterInput, "  foo, bar ,baz ");
-
-    expect(filterInput).toHaveValue("foo,bar,baz");
-  });
-
-  it("updates checkbox groups", async () => {
-    const user = userEvent.setup();
-    renderWithProviders(<EditPocketForm {...mirrorPocketProps} />);
-
-    await fillRequiredFields(user);
-
-    expect(screen.getByRole("checkbox", { name: "Main" })).toBeChecked();
-    expect(screen.getByRole("checkbox", { name: "amd64" })).toBeChecked();
-  });
-
-  it("submits upload pocket changes and supports uploader gpg key selection", async () => {
-    const user = userEvent.setup();
-    renderWithProviders(<EditPocketForm {...uploadPocketProps} />);
-    await fillRequiredFields(user);
-
-    await user.click(
-      screen.getByRole("combobox", { name: "Uploader GPG keys" }),
-    );
-    await user.click(screen.getByRole("checkbox", { name: "test-public" }));
-    await user.click(screen.getByRole("button", { name: /save changes/i }));
-
-    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
-  });
-
-  it("submits upload pocket changes when unsigned uploads are enabled", async () => {
-    const user = userEvent.setup();
-    renderWithProviders(<EditPocketForm {...uploadPocketProps} />);
-    await fillRequiredFields(user);
-
-    await user.click(
-      screen.getByRole("checkbox", {
-        name: "Allow uploaded packages to be unsigned",
-      }),
-    );
-    await user.click(screen.getByRole("button", { name: /save changes/i }));
-
-    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
-  });
-
-  it("submits upload pocket with original allow-unsigned pocket data", async () => {
-    const user = userEvent.setup();
-    renderWithProviders(<EditPocketForm {...uploadPocketAllowUnsignedProps} />);
-    await fillRequiredFields(user);
-
-    await user.click(
-      screen.getByRole("checkbox", {
-        name: "Allow uploaded packages to be unsigned",
-      }),
-    );
-    await user.click(screen.getByRole("button", { name: /save changes/i }));
-
-    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
-  });
-
-  it("submits upload pocket without uploader gpg key changes", async () => {
-    const user = userEvent.setup();
-    renderWithProviders(
-      <EditPocketForm {...uploadPocketWithKnownGpgKeysProps} />,
-    );
-    await fillRequiredFields(user);
-
-    await user.click(screen.getByRole("button", { name: /save changes/i }));
-
-    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
-  });
-
-  it("submits pull pocket changes with updated filter package list", async () => {
-    const user = userEvent.setup();
-    renderWithProviders(<EditPocketForm {...pullPocketWithFilterTypeProps} />);
-    await fillRequiredFields(user);
-
-    const filterInput = screen.getByRole("textbox", {
-      name: "Filter packages",
-    });
-    await user.clear(filterInput);
-    await user.type(filterInput, "alpha,beta");
-    await user.click(screen.getByRole("button", { name: /save changes/i }));
-
-    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
-  });
-
-  it("submits pull pocket changes without modifying filters", async () => {
-    const user = userEvent.setup();
-    renderWithProviders(<EditPocketForm {...pullPocketWithFilterTypeProps} />);
-    await fillRequiredFields(user);
-
-    await user.click(screen.getByRole("button", { name: /save changes/i }));
-
-    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
-  });
-
-  it("submits pull pocket without filter type", async () => {
-    const user = userEvent.setup();
-    renderWithProviders(
-      <EditPocketForm {...pullPocketWithoutFilterTypeProps} />,
-    );
-    await fillRequiredFields(user);
-
-    await user.click(screen.getByRole("button", { name: /save changes/i }));
-
-    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
-  });
-
-  it("submits mirror pocket changes", async () => {
-    const user = userEvent.setup();
-    renderWithProviders(<EditPocketForm {...mirrorPocketProps} />);
-    await fillRequiredFields(user);
-
-    await user.click(screen.getByRole("button", { name: /save changes/i }));
-
-    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
-  });
-
-  it("shows notification when edit pocket submit fails", async () => {
-    const user = userEvent.setup();
-    setEndpointStatus({ status: "error", path: "EditPocket" });
-
-    renderWithProviders(<EditPocketForm {...mirrorPocketProps} />);
-    await fillRequiredFields(user);
-
-    await user.click(screen.getByRole("button", { name: /save changes/i }));
-
-    expect(
-      await screen.findByText('The endpoint status is set to "error".'),
-    ).toBeInTheDocument();
-  });
-});
diff --git a/src/features/mirrors/components/EditPocketForm/EditPocketForm.tsx b/src/features/mirrors/components/EditPocketForm/EditPocketForm.tsx
deleted file mode 100644
index 3573ef16a..000000000
--- a/src/features/mirrors/components/EditPocketForm/EditPocketForm.tsx
+++ /dev/null
@@ -1,326 +0,0 @@
-import CheckboxGroup from "@/components/form/CheckboxGroup";
-import FieldDescription from "@/components/form/FieldDescription";
-import MultiSelectField from "@/components/form/MultiSelectField";
-import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
-import UdebCheckboxInput from "@/components/form/UdebCheckboxInput";
-import useDebug from "@/hooks/useDebug";
-import useSidePanel from "@/hooks/useSidePanel";
-import { getFormikError } from "@/utils/formikErrors";
-import {
-  CheckboxInput,
-  Form,
-  Input,
-  Select,
-  Textarea,
-} from "@canonical/react-components";
-import { useFormik } from "formik";
-import type { FC } from "react";
-import {
-  ARCHITECTURE_OPTIONS,
-  COMPONENT_OPTIONS,
-  DEFAULT_SNAPSHOT_URI,
-} from "../../constants";
-import { useGPGKeysOptions, usePockets } from "../../hooks";
-import type { Distribution, Pocket, Series } from "../../types";
-import type { PullPocket, UploadPocket } from "../../types/Pocket";
-import {
-  getEditPocketParams,
-  getInitialValues,
-  getValidationSchema,
-} from "./helpers";
-import type { FormProps } from "./types";
-
-interface EditPocketFormProps {
-  readonly pocket: Pocket;
-  readonly distributionName: Distribution["name"];
-  readonly seriesName: Series["name"];
-}
-
-const EditPocketForm: FC<EditPocketFormProps> = ({
-  distributionName,
-  pocket,
-  seriesName,
-}) => {
-  const debug = useDebug();
-  const { closeSidePanel } = useSidePanel();
-  const {
-    editPocketQuery,
-    addPackageFiltersToPocketQuery,
-    removePackageFiltersFromPocketQuery,
-    addUploaderGPGKeysToPocketQuery,
-    removeUploaderGPGKeysFromPocketQuery,
-  } = usePockets();
-
-  const { mutateAsync: editPocket } = editPocketQuery;
-  const { mutateAsync: addPackageFiltersToPocket } =
-    addPackageFiltersToPocketQuery;
-  const { mutateAsync: removePackageFiltersFromPocket } =
-    removePackageFiltersFromPocketQuery;
-  const { mutateAsync: addUploaderGPGKeysToPocket } =
-    addUploaderGPGKeysToPocketQuery;
-  const { mutateAsync: removeUploaderGPGKeysFromPocket } =
-    removeUploaderGPGKeysFromPocketQuery;
-  const { privateGPGKeysOptions, publicGPGKeysOptions } = useGPGKeysOptions();
-
-  const { mode } = pocket;
-
-  const handlePullMode = async (
-    editPocketPromise: Promise<unknown>,
-    pullPocket: PullPocket,
-    values: FormProps,
-  ): Promise<unknown> => {
-    const promises: Promise<unknown>[] = [editPocketPromise];
-
-    const deletedPackages = pullPocket.filters.filter(
-      (originalPackage) => !values.filters.includes(originalPackage),
-    );
-    const addedPackages = values.filters
-      .filter((x) => x)
-      .filter((newPackage) => !pullPocket.filters.includes(newPackage));
-
-    if (deletedPackages.length) {
-      promises.push(
-        removePackageFiltersFromPocket({
-          name: values.name,
-          distribution: values.distribution,
-          series: values.series,
-          packages: deletedPackages,
-        }),
-      );
-    }
-
-    if (addedPackages.length) {
-      promises.push(
-        addPackageFiltersToPocket({
-          name: values.name,
-          distribution: values.distribution,
-          series: values.series,
-          packages: addedPackages,
-        }),
-      );
-    }
-
-    return Promise.all(promises);
-  };
-
-  const handleUploadMode = async (
-    editPocketPromise: Promise<unknown>,
-    pullPocket: UploadPocket,
-    values: FormProps,
-  ): Promise<unknown> => {
-    const promises: Promise<unknown>[] = [];
-
-    if (pullPocket.upload_allow_unsigned) {
-      await editPocketPromise;
-    } else {
-      promises.push(editPocketPromise);
-    }
-
-    const pocketUploadGPGKeyNames = pullPocket.upload_gpg_keys.map(
-      ({ name }) => name,
-    );
-
-    const addedUploaderGPGKeys = values.upload_gpg_keys.filter(
-      (gpgKey) => !pocketUploadGPGKeyNames.includes(gpgKey),
-    );
-
-    const removedUploaderGPGKeys = pocketUploadGPGKeyNames.filter(
-      (gpgKey) => !values.upload_gpg_keys.includes(gpgKey),
-    );
-
-    if (addedUploaderGPGKeys.length) {
-      promises.push(
-        addUploaderGPGKeysToPocket({
-          name: values.name,
-          series: values.series,
-          distribution: values.distribution,
-          gpg_keys: addedUploaderGPGKeys,
-        }),
-      );
-    }
-
-    if (removedUploaderGPGKeys.length) {
-      promises.push(
-        removeUploaderGPGKeysFromPocket({
-          name: values.name,
-          series: values.series,
-          distribution: values.distribution,
-          gpg_keys: removedUploaderGPGKeys,
-        }),
-      );
-    }
-
-    return Promise.all(promises);
-  };
-
-  const formik = useFormik<FormProps>({
-    validationSchema: getValidationSchema(mode),
-    initialValues: getInitialValues(distributionName, seriesName, pocket),
-    onSubmit: async (values) => {
-      try {
-        const editPocketPromise = editPocket(getEditPocketParams(values, mode));
-
-        if ("pull" === pocket.mode && pocket.filter_type) {
-          await handlePullMode(editPocketPromise, pocket, values);
-        } else if ("upload" === pocket.mode && !values.upload_allow_unsigned) {
-          await handleUploadMode(editPocketPromise, pocket, values);
-        } else {
-          await editPocketPromise;
-        }
-
-        closeSidePanel();
-      } catch (error) {
-        debug(error);
-      }
-    },
-  });
-
-  return (
-    <Form onSubmit={formik.handleSubmit} noValidate>
-      <CheckboxGroup
-        label="Components"
-        required
-        options={COMPONENT_OPTIONS}
-        {...formik.getFieldProps("components")}
-        onChange={(newOptions) => {
-          formik.setFieldValue("components", newOptions);
-        }}
-        error={getFormikError(formik, "components")}
-      />
-
-      <CheckboxGroup
-        label="Architectures"
-        required
-        options={ARCHITECTURE_OPTIONS}
-        {...formik.getFieldProps("architectures")}
-        onChange={(newOptions) => {
-          formik.setFieldValue("architectures", newOptions);
-        }}
-        error={getFormikError(formik, "architectures")}
-      />
-
-      <Select
-        label="GPG Key"
-        options={privateGPGKeysOptions}
-        {...formik.getFieldProps("gpg_key")}
-        error={getFormikError(formik, "gpg_key")}
-      />
-
-      {"mirror" === pocket.mode &&
-        !pocket.mirror_uri.startsWith(DEFAULT_SNAPSHOT_URI) && (
-          <>
-            <Input
-              type="text"
-              label="Mirror URI"
-              {...formik.getFieldProps("mirror_uri")}
-              error={getFormikError(formik, "mirror_uri")}
-            />
-
-            <Input
-              type="text"
-              label={
-                <FieldDescription
-                  label="Mirror suite"
-                  description={
-                    <>
-                      <span>
-                        {
-                          "The specific sub-directory under dists/ that should be mirrored. If the suite name ends with a ‘/’, the remote repository is flat (no dists/ structure, see "
-                        }
-                      </span>
-                      <a
-                        href="http://wiki.debian.org/RepositoryFormat#Flat_Repository_Format"
-                        target="_blank"
-                        rel="nofollow noopener noreferrer"
-                      >
-                        wiki.debian.org/RepositoryFormat#Flat_Repository_Format
-                      </a>
-                      <span>
-                        ); in this case a single value must be passed for the
-                        ‘components’ parameter. Packages from the remote
-                        repository will be mirrored in the specified component.
-                        This parameter is optional and defaults to the same name
-                        as local series and pocket.
-                      </span>
-                    </>
-                  }
-                />
-              }
-              {...formik.getFieldProps("mirror_suite")}
-              error={getFormikError(formik, "mirror_suite")}
-            />
-
-            <Select
-              label="Mirror GPG key"
-              options={[
-                { label: "Select GPG key", value: "-" },
-                ...publicGPGKeysOptions,
-              ]}
-              {...formik.getFieldProps("mirror_gpg_key")}
-              error={getFormikError(formik, "mirror_gpg_key")}
-              help="If none is given, the stock Ubuntu archive one will be used."
-            />
-          </>
-        )}
-
-      {"upload" === pocket.mode && (
-        <>
-          <CheckboxInput
-            label="Allow uploaded packages to be unsigned"
-            {...formik.getFieldProps("upload_allow_unsigned")}
-            checked={formik.values.upload_allow_unsigned}
-          />
-
-          <MultiSelectField
-            variant="condensed"
-            label="Uploader GPG keys"
-            disabled={formik.values.upload_allow_unsigned}
-            items={publicGPGKeysOptions}
-            selectedItems={publicGPGKeysOptions.filter(({ value }) =>
-              formik.values.upload_gpg_keys.includes(value),
-            )}
-            onItemsUpdate={(items) => {
-              formik.setFieldValue(
-                "upload_gpg_keys",
-                items.map(({ value }) => value),
-              );
-            }}
-            error={
-              (formik.touched.upload_gpg_keys &&
-                (Array.isArray(formik.errors.upload_gpg_keys)
-                  ? formik.errors.upload_gpg_keys.join(", ")
-                  : formik.errors.upload_gpg_keys)) ||
-              undefined
-            }
-          />
-        </>
-      )}
-
-      {"pull" === pocket.mode && pocket.filter_type && (
-        <Textarea
-          label="Filter packages"
-          rows={3}
-          help="List packages to filter separated by commas."
-          {...formik.getFieldProps("filters")}
-          onChange={(event) => {
-            formik.setFieldValue(
-              "filters",
-              event.target.value.replace(/\s/g, "").split(","),
-            );
-          }}
-          value={formik.values.filters.join(",")}
-          error={getFormikError(formik, "filters")}
-        />
-      )}
-
-      <UdebCheckboxInput formik={formik} />
-
-      <SidePanelFormButtons
-        submitButtonDisabled={formik.isSubmitting}
-        submitButtonText="Save changes"
-      />
-    </Form>
-  );
-};
-
-export default EditPocketForm;
diff --git a/src/features/mirrors/components/EditPocketForm/constants.ts b/src/features/mirrors/components/EditPocketForm/constants.ts
deleted file mode 100644
index cb79839d5..000000000
--- a/src/features/mirrors/components/EditPocketForm/constants.ts
+++ /dev/null
@@ -1,18 +0,0 @@
-import { DEFAULT_MIRROR_URI } from "../../constants";
-import type { FormProps } from "./types";
-
-export const INITIAL_VALUES: FormProps = {
-  series: "",
-  distribution: "",
-  name: "",
-  architectures: [],
-  components: [],
-  gpg_key: "",
-  include_udeb: false,
-  mirror_uri: DEFAULT_MIRROR_URI,
-  upload_allow_unsigned: false,
-  mirror_suite: "",
-  mirror_gpg_key: "",
-  filters: [],
-  upload_gpg_keys: [],
-};
diff --git a/src/features/mirrors/components/EditPocketForm/helpers.test.ts b/src/features/mirrors/components/EditPocketForm/helpers.test.ts
deleted file mode 100644
index 6bbbc04f5..000000000
--- a/src/features/mirrors/components/EditPocketForm/helpers.test.ts
+++ /dev/null
@@ -1,132 +0,0 @@
-import { describe, expect, it } from "vitest";
-import { pockets } from "@/tests/mocks/pockets";
-import type { Pocket } from "../../types";
-import {
-  getEditPocketParams,
-  getInitialValues,
-  getValidationSchema,
-} from "./helpers";
-import { INITIAL_VALUES } from "./constants";
-
-const mirrorPocket = pockets.find((pocket) => pocket.mode === "mirror");
-const uploadPocket = pockets.find((pocket) => pocket.mode === "upload");
-const pullPocket = pockets.find((pocket) => pocket.mode === "pull");
-
-assert(mirrorPocket);
-assert(uploadPocket);
-assert(pullPocket);
-
-describe("EditPocketForm helpers", () => {
-  it("enforces single component for mirror suite directories", async () => {
-    const schema = getValidationSchema("mirror");
-
-    await expect(
-      schema.validate({
-        ...INITIAL_VALUES,
-        name: "Pocket",
-        distribution: "Distribution",
-        series: "Series",
-        mirror_suite: "focal/",
-        components: ["main", "restricted"],
-        architectures: ["amd64"],
-      }),
-    ).rejects.toThrowError(/single component must be passed/i);
-
-    await expect(
-      schema.validate({
-        ...INITIAL_VALUES,
-        name: "Pocket",
-        distribution: "Distribution",
-        series: "Series",
-        mirror_suite: "focal/",
-        components: ["main"],
-        architectures: ["amd64"],
-      }),
-    ).resolves.toBeTruthy();
-  });
-
-  it("allows multiple components for non-mirror modes", async () => {
-    const schema = getValidationSchema("pull");
-
-    await expect(
-      schema.validate({
-        ...INITIAL_VALUES,
-        name: "Pocket",
-        distribution: "Distribution",
-        series: "Series",
-        components: ["main", "restricted"],
-        architectures: ["amd64"],
-      }),
-    ).resolves.toBeTruthy();
-  });
-
-  it("allows multiple components in mirror mode when suite is not a directory", async () => {
-    const schema = getValidationSchema("mirror");
-
-    await expect(
-      schema.validate({
-        ...INITIAL_VALUES,
-        name: "Pocket",
-        distribution: "Distribution",
-        series: "Series",
-        mirror_suite: "focal-updates",
-        components: ["main", "restricted"],
-        architectures: ["amd64"],
-      }),
-    ).resolves.toBeTruthy();
-  });
-
-  it("builds mode-specific initial values", () => {
-    const mirrorValues = getInitialValues("Dist", "Series", mirrorPocket);
-    const uploadValues = getInitialValues("Dist", "Series", uploadPocket);
-    const pullValues = getInitialValues("Dist", "Series", pullPocket);
-
-    expect(mirrorValues.mirror_uri).toBe(mirrorPocket.mirror_uri);
-    expect(mirrorValues.mirror_suite).toBe(mirrorPocket.mirror_suite);
-    expect(uploadValues.upload_allow_unsigned).toBe(
-      uploadPocket.upload_allow_unsigned,
-    );
-    expect(uploadValues.upload_gpg_keys).toEqual(
-      uploadPocket.upload_gpg_keys.map((key) => key.name),
-    );
-    expect(pullValues.filters).toEqual(pullPocket.filters);
-  });
-
-  it("falls back to empty key names when optional key objects are missing", () => {
-    const pocketWithoutKeys = {
-      ...mirrorPocket,
-      gpg_key: undefined,
-      mirror_gpg_key: undefined,
-    } as unknown as Pocket;
-
-    const values = getInitialValues("Dist", "Series", pocketWithoutKeys);
-
-    expect(values.gpg_key).toBe("");
-    expect(values.mirror_gpg_key).toBe("");
-  });
-
-  it("returns mode-specific edit params", () => {
-    const mirrorValues = getInitialValues("Dist", "Series", mirrorPocket);
-    const uploadValues = getInitialValues("Dist", "Series", uploadPocket);
-    const pullValues = getInitialValues("Dist", "Series", pullPocket);
-
-    const mirrorParams = getEditPocketParams(mirrorValues, "mirror");
-    const uploadParams = getEditPocketParams(uploadValues, "upload");
-    const pullParams = getEditPocketParams(pullValues, "pull");
-
-    expect(mirrorParams).toHaveProperty("mirror_uri");
-    expect(mirrorParams).toHaveProperty("mirror_suite");
-    expect(uploadParams).toHaveProperty("upload_allow_unsigned");
-    expect(pullParams).not.toHaveProperty("mirror_uri");
-    expect(pullParams).not.toHaveProperty("upload_allow_unsigned");
-  });
-
-  it("throws for invalid pocket mode when building edit params", () => {
-    expect(() =>
-      getEditPocketParams(
-        getInitialValues("Dist", "Series", pullPocket),
-        "invalid" as Pocket["mode"],
-      ),
-    ).toThrowError(/provided: invalid for pocket mode/i);
-  });
-});
diff --git a/src/features/mirrors/components/EditPocketForm/helpers.ts b/src/features/mirrors/components/EditPocketForm/helpers.ts
deleted file mode 100644
index c96359725..000000000
--- a/src/features/mirrors/components/EditPocketForm/helpers.ts
+++ /dev/null
@@ -1,133 +0,0 @@
-import { assertNever } from "@/utils/debug";
-import * as Yup from "yup";
-import { MIN_SELECTION_COUNT } from "../../constants";
-import type {
-  EditMirrorPocketParams,
-  EditPullPocketParams,
-  EditUploadPocketParams,
-  Pocket,
-} from "../../types";
-import { INITIAL_VALUES } from "./constants";
-import type { FormProps } from "./types";
-
-export const getValidationSchema = (
-  mode: "mirror" | "pull" | "upload",
-): Yup.Schema => {
-  return Yup.object().shape({
-    name: Yup.string().required("This field is required"),
-    distribution: Yup.string().required("This field is required"),
-    series: Yup.string().required("This field is required"),
-    components: Yup.array()
-      .defined()
-      .of(Yup.string().defined())
-      .min(MIN_SELECTION_COUNT, "Please choose at least one component")
-      .test({
-        name: "flat-mirror-sub-directory",
-        message: "A single component must be passed",
-        params: { mode },
-        test: (value, context) => {
-          const { mirror_suite } = context.parent;
-
-          if ("mirror" === mode && mirror_suite?.endsWith("/")) {
-            return MIN_SELECTION_COUNT === value.length;
-          }
-
-          return true;
-        },
-      }),
-    architectures: Yup.array()
-      .defined()
-      .of(Yup.string().defined())
-      .min(MIN_SELECTION_COUNT, "Please choose at least one architecture"),
-    gpg_key: Yup.string(),
-    include_udeb: Yup.boolean(),
-    mirror_uri: Yup.string(),
-    mirror_suite: Yup.string(),
-    mirror_gpg_key: Yup.string(),
-    upload_allow_unsigned: Yup.boolean(),
-    filters: Yup.array().of(Yup.string()),
-    upload_gpg_keys: Yup.array().of(Yup.string()),
-  });
-};
-
-export const getInitialValues = (
-  distributionName: string,
-  seriesName: string,
-  pocket: Pocket,
-): FormProps => {
-  const baseValues: FormProps = {
-    ...INITIAL_VALUES,
-    distribution: distributionName,
-    series: seriesName,
-    name: pocket.name,
-    components: pocket.components,
-    architectures: pocket.architectures,
-    gpg_key: pocket.gpg_key?.name ?? "",
-    include_udeb: pocket.include_udeb,
-  };
-
-  switch (pocket.mode) {
-    case "mirror":
-      return {
-        ...baseValues,
-        mirror_uri: pocket.mirror_uri,
-        mirror_suite: pocket.mirror_suite,
-        mirror_gpg_key: pocket.mirror_gpg_key?.name ?? "",
-      };
-    case "upload":
-      return {
-        ...baseValues,
-        upload_allow_unsigned: pocket.upload_allow_unsigned,
-        upload_gpg_keys: pocket.upload_gpg_keys.map(({ name }) => name),
-      };
-    default:
-      return {
-        ...baseValues,
-        filters: pocket.filters,
-      };
-  }
-};
-
-export const getEditPocketParams = (
-  values: FormProps,
-  mode: Pocket["mode"],
-): EditMirrorPocketParams | EditPullPocketParams | EditUploadPocketParams => {
-  switch (mode) {
-    case "mirror":
-      return {
-        distribution: values.distribution,
-        series: values.series,
-        name: values.name,
-        components: values.components,
-        architectures: values.architectures,
-        gpg_key: values.gpg_key,
-        include_udeb: values.include_udeb,
-        mirror_uri: values.mirror_uri,
-        mirror_suite: values.mirror_suite,
-        mirror_gpg_key: values.mirror_gpg_key,
-      };
-    case "upload":
-      return {
-        distribution: values.distribution,
-        series: values.series,
-        name: values.name,
-        components: values.components,
-        architectures: values.architectures,
-        gpg_key: values.gpg_key,
-        include_udeb: values.include_udeb,
-        upload_allow_unsigned: values.upload_allow_unsigned,
-      };
-    case "pull":
-      return {
-        distribution: values.distribution,
-        series: values.series,
-        name: values.name,
-        components: values.components,
-        architectures: values.architectures,
-        gpg_key: values.gpg_key,
-        include_udeb: values.include_udeb,
-      };
-    default:
-      return assertNever(mode, "pocket mode");
-  }
-};
diff --git a/src/features/mirrors/components/EditPocketForm/index.ts b/src/features/mirrors/components/EditPocketForm/index.ts
deleted file mode 100644
index 1a293cd54..000000000
--- a/src/features/mirrors/components/EditPocketForm/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./EditPocketForm";
diff --git a/src/features/mirrors/components/EditPocketForm/types.ts b/src/features/mirrors/components/EditPocketForm/types.ts
deleted file mode 100644
index 30dcdad80..000000000
--- a/src/features/mirrors/components/EditPocketForm/types.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import type {
-  EditMirrorPocketParams,
-  EditPullPocketParams,
-  EditUploadPocketParams,
-} from "../../types";
-
-export interface FormProps
-  extends
-    Required<EditMirrorPocketParams>,
-    Required<EditPullPocketParams>,
-    Required<EditUploadPocketParams> {
-  filters: string[];
-  upload_gpg_keys: string[];
-}
diff --git a/src/features/mirrors/components/EmptyDistribution/EmptyDistribution.module.scss b/src/features/mirrors/components/EmptyDistribution/EmptyDistribution.module.scss
deleted file mode 100644
index 872c5c6ca..000000000
--- a/src/features/mirrors/components/EmptyDistribution/EmptyDistribution.module.scss
+++ /dev/null
@@ -1,24 +0,0 @@
-@import "vanilla-framework/scss/settings_colors";
-
-.card {
-  border: 1px solid $colors--theme--border-default;
-}
-
-.header {
-  background-color: $colors--theme--background-default;
-  border-bottom: 1px solid $colors--theme--border-default;
-  padding: 0.5rem 1rem;
-}
-
-.title {
-  color: $colors--theme--text-default;
-  font-size: 1rem;
-  font-weight: 500;
-  line-height: 1.5;
-  margin-bottom: 0;
-  padding-top: 0;
-}
-
-.content {
-  padding: 1rem;
-}
diff --git a/src/features/mirrors/components/EmptyDistribution/EmptyDistribution.test.tsx b/src/features/mirrors/components/EmptyDistribution/EmptyDistribution.test.tsx
deleted file mode 100644
index dffbea6e3..000000000
--- a/src/features/mirrors/components/EmptyDistribution/EmptyDistribution.test.tsx
+++ /dev/null
@@ -1,39 +0,0 @@
-import { distributions } from "@/tests/mocks/distributions";
-import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import type { ComponentProps } from "react";
-import EmptyDistribution from "./EmptyDistribution";
-
-const props: ComponentProps<typeof EmptyDistribution> = {
-  distribution: distributions[0],
-};
-
-describe("EmptyDistribution", () => {
-  it("renders empty state", () => {
-    const { container } = renderWithProviders(<EmptyDistribution {...props} />);
-
-    expect(container).toHaveTexts([
-      "No series have been added yet",
-      "Add a new mirror or series to get started",
-      "How to manage repositories in Landscape",
-    ]);
-
-    expect(
-      screen.getByRole("button", {
-        name: /add mirror/i,
-      }),
-    ).toBeVisible();
-  });
-
-  it("opens sidepanel form", async () => {
-    renderWithProviders(<EmptyDistribution {...props} />);
-
-    await userEvent.click(screen.getByRole("button", { name: /add mirror/i }));
-
-    const formTitle = await screen.findByRole("heading", {
-      name: `Add mirror for ${props.distribution.name}`,
-    });
-    expect(formTitle).toBeVisible();
-  });
-});
diff --git a/src/features/mirrors/components/EmptyDistribution/EmptyDistribution.tsx b/src/features/mirrors/components/EmptyDistribution/EmptyDistribution.tsx
deleted file mode 100644
index 17633ba93..000000000
--- a/src/features/mirrors/components/EmptyDistribution/EmptyDistribution.tsx
+++ /dev/null
@@ -1,59 +0,0 @@
-import LoadingState from "@/components/layout/LoadingState";
-import useSidePanel from "@/hooks/useSidePanel";
-import { Button } from "@canonical/react-components";
-import type { FC } from "react";
-import { lazy, Suspense } from "react";
-import type { Distribution } from "../../types";
-import classes from "./EmptyDistribution.module.scss";
-
-const NewSeriesForm = lazy(async () => import("../NewSeriesForm"));
-
-interface EmptyDistributionProps {
-  readonly distribution: Distribution;
-}
-
-const EmptyDistribution: FC<EmptyDistributionProps> = ({ distribution }) => {
-  const { setSidePanelContent } = useSidePanel();
-
-  const handleAddMirror = (): void => {
-    setSidePanelContent(
-      `Add mirror for ${distribution.name}`,
-      <Suspense fallback={<LoadingState />}>
-        <NewSeriesForm distribution={distribution} />
-      </Suspense>,
-    );
-  };
-
-  return (
-    <div className={classes.card}>
-      <div className={classes.header}>
-        <h3 className={classes.title}>No series have been added yet</h3>
-      </div>
-      <div className={classes.content}>
-        <p className="u-no-margin--bottom">
-          Add a new mirror or series to get started
-        </p>
-        <p className="u-no-margin--top">
-          <a
-            href="https://ubuntu.com/landscape/docs/repositories"
-            target="_blank"
-            rel="nofollow noopener noreferrer"
-          >
-            How to manage repositories in Landscape
-          </a>
-        </p>
-        <Button
-          type="button"
-          appearance="positive"
-          className="u-no-margin--bottom"
-          onClick={handleAddMirror}
-          aria-label={`Add mirror for ${distribution.name}`}
-        >
-          Add mirror
-        </Button>
-      </div>
-    </div>
-  );
-};
-
-export default EmptyDistribution;
diff --git a/src/features/mirrors/components/EmptyDistribution/index.ts b/src/features/mirrors/components/EmptyDistribution/index.ts
deleted file mode 100644
index 3b40898d5..000000000
--- a/src/features/mirrors/components/EmptyDistribution/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./EmptyDistribution";
diff --git a/src/features/mirrors/components/MirrorActions/MirrorActions.tsx b/src/features/mirrors/components/MirrorActions/MirrorActions.tsx
new file mode 100644
index 000000000..d748988e4
--- /dev/null
+++ b/src/features/mirrors/components/MirrorActions/MirrorActions.tsx
@@ -0,0 +1,91 @@
+import ListActions from "@/components/layout/ListActions";
+import usePageParams from "@/hooks/usePageParams";
+import type { FC } from "react";
+import type { Mirror } from "@canonical/landscape-openapi";
+import { useBoolean } from "usehooks-ts";
+import UpdateMirrorModal from "../UpdateMirrorModal";
+import RemoveMirrorModal from "../RemoveMirrorModal";
+
+interface MirrorActionsProps {
+  readonly mirror: Mirror;
+}
+
+const MirrorActions: FC<MirrorActionsProps> = ({ mirror }) => {
+  const { createPageParamsSetter } = usePageParams();
+
+  const {
+    value: isUpdateModalOpen,
+    setTrue: openUpdateModal,
+    setFalse: closeUpdateModal,
+  } = useBoolean();
+  const {
+    value: isRemoveModalOpen,
+    setTrue: openRemoveModal,
+    setFalse: closeRemoveModal,
+  } = useBoolean();
+
+  const { name: mirrorName } = mirror;
+
+  if (mirrorName === undefined) {
+    return null;
+  }
+
+  return (
+    <>
+      <ListActions
+        actions={[
+          {
+            icon: "show",
+            label: "View details",
+            onClick: createPageParamsSetter({
+              sidePath: ["view"],
+              name: mirror.name,
+            }),
+          },
+          {
+            icon: "edit",
+            label: "Edit",
+            onClick: createPageParamsSetter({
+              sidePath: ["edit"],
+              name: mirror.name,
+            }),
+          },
+          {
+            icon: "restart",
+            label: "Update",
+            onClick: openUpdateModal,
+          },
+          {
+            icon: "upload",
+            label: "Publish",
+            onClick: createPageParamsSetter({
+              sidePath: ["publish"],
+              name: mirror.name,
+            }),
+          },
+        ]}
+        destructiveActions={[
+          {
+            icon: "delete",
+            label: "Remove",
+            onClick: openRemoveModal,
+          },
+        ]}
+      />
+      <UpdateMirrorModal
+        isOpen={isUpdateModalOpen}
+        close={closeUpdateModal}
+        mirrorDisplayName={mirror.displayName}
+        mirrorName={mirrorName}
+      />
+      <RemoveMirrorModal
+        isOpen={isRemoveModalOpen}
+        close={closeRemoveModal}
+        mirrorDisplayName={mirror.displayName}
+        mirrorName={mirrorName}
+      />
+    </>
+  );
+};
+
+export default MirrorActions;
diff --git a/src/features/mirrors/components/MirrorActions/index.ts b/src/features/mirrors/components/MirrorActions/index.ts
new file mode 100644
index 000000000..472543de3
--- /dev/null
+++ b/src/features/mirrors/components/MirrorActions/index.ts
@@ -0,0 +1 @@
+export { default } from "./MirrorActions";
diff --git a/src/features/mirrors/components/MirrorDetails/MirrorDetails.tsx b/src/features/mirrors/components/MirrorDetails/MirrorDetails.tsx
new file mode 100644
index 000000000..9d7098a85
--- /dev/null
+++ b/src/features/mirrors/components/MirrorDetails/MirrorDetails.tsx
@@ -0,0 +1,167 @@
+import type { FC } from "react";
+import SidePanel from "@/components/layout/SidePanel/SidePanel";
+import { Button, Icon, ICONS } from "@canonical/react-components";
+import Blocks from "@/components/layout/Blocks";
+import InfoGrid from "@/components/layout/InfoGrid";
+import { useGetMirror, useListPublications } from "../../api";
+import usePageParams from "@/hooks/usePageParams";
+import { getSourceType } from "./helpers";
+import MirrorPackagesCount from "../MirrorPackagesCount";
+import moment from "moment";
+import { DISPLAY_DATE_TIME_FORMAT } from "@/constants";
+import MirrorPublicationsList from "../MirrorPublicationsList";
+import UpdateMirrorModal from "../UpdateMirrorModal";
+import { useBoolean } from "usehooks-ts";
+import RemoveMirrorModal from "../RemoveMirrorModal";
+
+const MirrorDetails: FC = () => {
+  const { name, createSidePathPusher } = usePageParams();
+  const {
+    value: isUpdateModalOpen,
+    setTrue: openUpdateModal,
+    setFalse: closeUpdateModal,
+  } = useBoolean();
+  const {
+    value: isRemoveModalOpen,
+    setTrue: openRemoveModal,
+    setFalse: closeRemoveModal,
+  } = useBoolean();
+
+  const mirror = useGetMirror(name).data.data;
+
+  const { publications = [] } = useListPublications({
+    filter: `source="${name}"`,
+    pageSize: 1000,
+  }).data.data;
+
+  return (
+    <>
+      <SidePanel.Header>{mirror.displayName}</SidePanel.Header>
+      <SidePanel.Content>
+        <div className="p-segmented-control">
+          <Button
+            type="button"
+            hasIcon
+            className="p-segmented-control__button"
+            onClick={createSidePathPusher("edit")}
+          >
+            <Icon name="edit" />
+            <span>Edit</span>
+          </Button>
+          <Button
+            type="button"
+            hasIcon
+            className="p-segmented-control__button"
+            onClick={openUpdateModal}
+          >
+            <Icon name="restart" />
+            <span>Update</span>
+          </Button>
+          <Button
+            type="button"
+            hasIcon
+            className="p-segmented-control__button"
+            onClick={createSidePathPusher("publish")}
+          >
+            <Icon name="upload" />
+            <span>Publish</span>
+          </Button>
+          <Button
+            type="button"
+            hasIcon
+            className="p-segmented-control__button"
+            onClick={openRemoveModal}
+          >
+            <Icon name={`${ICONS.delete}--negative`} />
+            <span className="u-text--negative">Remove</span>
+          </Button>
+        </div>
+        <Blocks>
+          <Blocks.Item title="Details">
+            <InfoGrid dense>
+              <InfoGrid.Item label="Name" value={mirror.displayName} />
+              <InfoGrid.Item
+                label="Source type"
+                value={getSourceType(mirror.archiveRoot)}
+              />
+              <InfoGrid.Item
+                label="Source URL"
+                value={
+                  <a
+                    href={mirror.archiveRoot}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                  >
+                    {mirror.archiveRoot}
+                  </a>
+                }
+                large
+              />
+              <InfoGrid.Item
+                label="Last update"
+                value={
+                  mirror.lastDownloadDate &&
+                  moment(mirror.lastDownloadDate).format(
+                    DISPLAY_DATE_TIME_FORMAT,
+                  )
+                }
+              />
+              <InfoGrid.Item
+                label="Packages"
+                value={
+                  mirror.name && (
+                    <MirrorPackagesCount mirrorName={mirror.name} />
+                  )
+                }
+              />
+            </InfoGrid>
+          </Blocks.Item>
+          <Blocks.Item title="Contents">
+            <InfoGrid dense>
+              <InfoGrid.Item label="Distribution" value={mirror.distribution} />
+              <InfoGrid.Item
+                label="Components"
+                value={mirror.components?.join(", ")}
+                large
+              />
+              <InfoGrid.Item
+                label="Architectures"
+                value={mirror.architectures?.join(", ")}
+                large
+              />
+              <InfoGrid.Item
+                label="Download .udeb"
+                value={mirror.downloadUdebs ? "Yes" : "No"}
+              />
+              <InfoGrid.Item
+                label="Download sources"
+                value={mirror.downloadSources ? "Yes" : "No"}
+              />
+              <InfoGrid.Item
+                label="Download installer files"
+                value={mirror.downloadInstaller ? "Yes" : "No"}
+              />
+            </InfoGrid>
+          </Blocks.Item>
+          <Blocks.Item title="Used in">
+            <MirrorPublicationsList publications={publications} />
+          </Blocks.Item>
+        </Blocks>
+      </SidePanel.Content>
+      <UpdateMirrorModal
+        isOpen={isUpdateModalOpen}
+        close={closeUpdateModal}
+        mirrorDisplayName={mirror.displayName}
+        mirrorName={name}
+      />
+      <RemoveMirrorModal
+        isOpen={isRemoveModalOpen}
+        close={closeRemoveModal}
+        mirrorDisplayName={mirror.displayName}
+        mirrorName={name}
+      />
+    </>
+  );
+};
+
+export default MirrorDetails;
diff --git a/src/features/mirrors/components/MirrorDetails/helpers.ts b/src/features/mirrors/components/MirrorDetails/helpers.ts
new file mode 100644
index 000000000..3df58fd8c
--- /dev/null
+++ b/src/features/mirrors/components/MirrorDetails/helpers.ts
@@ -0,0 +1,18 @@
+import {
+  UBUNTU_ARCHIVE_HOST,
+  UBUNTU_PRO_HOST,
+  UBUNTU_SNAPSHOTS_HOST,
+} from "../../constants";
+
+export function getSourceType(archiveRoot: string): string {
+  switch (new URL(archiveRoot).host) {
+    case UBUNTU_ARCHIVE_HOST:
+      return "Ubuntu archive";
+    case UBUNTU_SNAPSHOTS_HOST:
+      return "Ubuntu snapshots";
+    case UBUNTU_PRO_HOST:
+      return "Ubuntu Pro";
+    default:
+      return "Third party";
+  }
+}
diff --git a/src/features/mirrors/components/MirrorDetails/index.ts b/src/features/mirrors/components/MirrorDetails/index.ts
new file mode 100644
index 000000000..a30fbfedb
--- /dev/null
+++ b/src/features/mirrors/components/MirrorDetails/index.ts
@@ -0,0 +1 @@
+export { default } from "./MirrorDetails";
diff --git a/src/features/mirrors/components/MirrorPackagesCount/MirrorPackagesCount.tsx b/src/features/mirrors/components/MirrorPackagesCount/MirrorPackagesCount.tsx
new file mode 100644
index 000000000..8cd5e271f
--- /dev/null
+++ b/src/features/mirrors/components/MirrorPackagesCount/MirrorPackagesCount.tsx
@@ -0,0 +1,17 @@
+import type { FC } from "react";
+import { useListMirrorPackages } from "../../api";
+import { pluralizeNew } from "@/utils/_helpers";
+
+interface MirrorPackagesCount {
+  readonly mirrorName: string;
+}
+
+const MirrorPackagesCount: FC<MirrorPackagesCount> = ({ mirrorName }) => {
+  const { data } = useListMirrorPackages(mirrorName, { pageSize: 1000 });
+
+  return pluralizeNew(data.data.mirrorPackages?.length ?? 0, "package", {
+    showCount: data.data.nextPageToken === undefined ? "exact" : "limited",
+  });
+};
+
+export default MirrorPackagesCount;
diff --git a/src/features/mirrors/components/MirrorPackagesCount/index.ts b/src/features/mirrors/components/MirrorPackagesCount/index.ts
new file mode 100644
index 000000000..a20505fa4
--- /dev/null
+++ b/src/features/mirrors/components/MirrorPackagesCount/index.ts
@@ -0,0 +1 @@
+export { default } from "./MirrorPackagesCount";
diff --git a/src/features/mirrors/components/MirrorPublicationsLink/MirrorPublicationsLinks.tsx b/src/features/mirrors/components/MirrorPublicationsLink/MirrorPublicationsLinks.tsx
new file mode 100644
index 000000000..13de81775
--- /dev/null
+++ b/src/features/mirrors/components/MirrorPublicationsLink/MirrorPublicationsLinks.tsx
@@ -0,0 +1,37 @@
+import type { FC } from "react";
+import { useListPublications } from "../../api";
+import { pluralizeNew } from "@/utils/_helpers";
+import StaticLink from "@/components/layout/StaticLink";
+import { ROUTES } from "@/libs/routes";
+
+interface MirrorPublicationsLinkProps {
+  readonly mirrorName: string;
+}
+
+const MirrorPublicationsLink: FC<MirrorPublicationsLinkProps> = ({
+  mirrorName,
+}) => {
+  const { data } = useListPublications({
+    filter: `source="${mirrorName}"`,
+    pageSize: 1000,
+  });
+
+  if (!data.data.publications?.length) {
+    return "0 publications";
+  }
+
+  return (
+    <StaticLink
+      to={{
+        pathname: ROUTES.repositories.publications(),
+        search: `?query=${encodeURIComponent(`source="${mirrorName}"`)}`,
+      }}
+    >
+      {pluralizeNew(data.data.publications.length, "publication", {
+        showCount: data.data.nextPageToken === undefined ? "exact" : "limited",
+      })}
+    </StaticLink>
+  );
+};
+
+export default MirrorPublicationsLink;
diff --git a/src/features/mirrors/components/MirrorPublicationsLink/index.ts b/src/features/mirrors/components/MirrorPublicationsLink/index.ts
new file mode 100644
index 000000000..137bd879a
--- /dev/null
+++ b/src/features/mirrors/components/MirrorPublicationsLink/index.ts
@@ -0,0 +1 @@
+export { default } from "./MirrorPublicationsLinks";
diff --git a/src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.tsx b/src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.tsx
new file mode 100644
index 000000000..9f39a5395
--- /dev/null
+++ b/src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.tsx
@@ -0,0 +1,59 @@
+import type { CellProps, Column } from "react-table";
+import { useMemo, type FC } from "react";
+import type { Publication } from "@canonical/landscape-openapi";
+import { ModularTable } from "@canonical/react-components";
+import { ModalTablePagination } from "@/components/layout/TablePagination";
+import { useCounter } from "usehooks-ts";
+import { DEFAULT_MODAL_PAGE_SIZE } from "@/constants";
+import { Link } from "react-router";
+
+interface MirrorPublicationsListProps {
+  readonly publications: Publication[];
+}
+
+const MirrorPublicationsList: FC<MirrorPublicationsListProps> = ({
+  publications,
+}) => {
+  const { count, increment, decrement } = useCounter(1);
+
+  const columns = useMemo<Column<Publication>[]>(
+    () => [
+      {
+        Header: "Publication",
+        Cell: ({ row: { original: publication } }: CellProps<Publication>) => {
+          return (
+            <Link
+              to={{
+                pathname: "/repositories/publications",
+                search: `?sidePath=view&name=${publication.publicationId}`,
+              }}
+            >
+              {publication.label}
+            </Link>
+          );
+        },
+      },
+    ],
+    [],
+  );
+
+  return (
+    <>
+      <ModularTable
+        columns={columns}
+        data={publications.slice(
+          (count - 1) * DEFAULT_MODAL_PAGE_SIZE,
+          count * DEFAULT_MODAL_PAGE_SIZE,
+        )}
+      />
+      <ModalTablePagination
+        current={count}
+        max={Math.ceil(publications.length / DEFAULT_MODAL_PAGE_SIZE)}
+        onNext={increment}
+        onPrev={decrement}
+      />
+    </>
+  );
+};
+
+export default MirrorPublicationsList;
diff --git a/src/features/mirrors/components/MirrorPublicationsList/index.ts b/src/features/mirrors/components/MirrorPublicationsList/index.ts
new file mode 100644
index 000000000..8bbed3a24
--- /dev/null
+++ b/src/features/mirrors/components/MirrorPublicationsList/index.ts
@@ -0,0 +1 @@
+export { default } from "./MirrorPublicationsList";
diff --git a/src/features/mirrors/components/MirrorsList/MirrorsList.tsx b/src/features/mirrors/components/MirrorsList/MirrorsList.tsx
new file mode 100644
index 000000000..48b4ca49e
--- /dev/null
+++ b/src/features/mirrors/components/MirrorsList/MirrorsList.tsx
@@ -0,0 +1,98 @@
+import ResponsiveTable from "@/components/layout/ResponsiveTable";
+import { DISPLAY_DATE_TIME_FORMAT } from "@/constants";
+import type { Mirror } from "@canonical/landscape-openapi";
+import { Button, Spinner } from "@canonical/react-components";
+import moment from "moment";
+import { Suspense, useMemo, type FC } from "react";
+import type { CellProps, Column } from "react-table";
+import { LIST_ACTIONS_COLUMN_PROPS } from "@/components/layout/ListActions";
+import MirrorPublicationsLink from "../MirrorPublicationsLink";
+import NoData from "@/components/layout/NoData";
+import usePageParams from "@/hooks/usePageParams";
+import MirrorPackagesCount from "../MirrorPackagesCount";
+import MirrorActions from "../MirrorActions";
+
+interface MirrorsListProps {
+  readonly mirrors: Mirror[];
+}
+
+const MirrorsList: FC<MirrorsListProps> = ({ mirrors }) => {
+  const { createPageParamsSetter } = usePageParams();
+
+  const columns = useMemo<Column<Mirror>[]>(
+    () => [
+      {
+        Header: "Mirror name",
+        Cell: ({ row: { original: mirror } }: CellProps<Mirror>) => (
+          <Button
+            type="button"
+            appearance="link"
+            className="u-no-margin--bottom u-no-padding--top"
+            onClick={createPageParamsSetter({
+              sidePath: ["view"],
+              name: mirror.name,
+            })}
+          >
+            {mirror.displayName}
+          </Button>
+        ),
+      },
+      {
+        Header: "Distribution",
+        Cell: ({ row: { original: mirror } }: CellProps<Mirror>) =>
+          mirror.distribution,
+      },
+      {
+        Header: "Last update",
+        Cell: ({ row: { original: mirror } }: CellProps<Mirror>) =>
+          mirror.lastDownloadDate ? (
+            moment(mirror.lastDownloadDate).format(DISPLAY_DATE_TIME_FORMAT)
+          ) : (
+            <NoData />
+          ),
+      },
+      {
+        Header: "Packages",
+        Cell: ({ row: { original: mirror } }: CellProps<Mirror>) =>
+          mirror.name !== undefined ? (
+            <Suspense fallback={<Spinner />}>
+              <MirrorPackagesCount mirrorName={mirror.name} />
+            </Suspense>
+          ) : (
+            <NoData />
+          ),
+      },
+      {
+        Header: "Publications",
+        Cell: ({ row: { original: mirror } }: CellProps<Mirror>) =>
+          mirror.name !== undefined ? (
+            <Suspense fallback={<Spinner />}>
+              <MirrorPublicationsLink mirrorName={mirror.name} />
+            </Suspense>
+          ) : (
+            <NoData />
+          ),
+      },
+      {
+        ...LIST_ACTIONS_COLUMN_PROPS,
+        accessor: undefined,
+        Cell: ({ row: { original: mirror } }: CellProps<Mirror>) => (
+          <Suspense fallback={<Spinner />}>
+            <MirrorActions mirror={mirror} />
+          </Suspense>
+        ),
+      },
+    ],
+    [createPageParamsSetter],
+  );
+
+  return (
+    <ResponsiveTable
+      columns={columns}
+      data={mirrors}
+      emptyMsg="No mirrors found according to your search parameters."
+    />
+  );
+};
+
+export default MirrorsList;
diff --git a/src/features/mirrors/components/MirrorsList/index.ts b/src/features/mirrors/components/MirrorsList/index.ts
new file mode 100644
index 000000000..26263e280
--- /dev/null
+++ b/src/features/mirrors/components/MirrorsList/index.ts
@@ -0,0 +1 @@
+export { default } from "./MirrorsList";
diff --git a/src/features/mirrors/components/NewDistributionForm/NewDistributionForm.test.tsx b/src/features/mirrors/components/NewDistributionForm/NewDistributionForm.test.tsx
deleted file mode 100644
index 7d8ae8f59..000000000
--- a/src/features/mirrors/components/NewDistributionForm/NewDistributionForm.test.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
-import NewDistributionForm from "./NewDistributionForm";
-
-describe("NewDistributionForm", () => {
-  it("renders form fields for mirror pocket", () => {
-    const { container } = renderWithProviders(<NewDistributionForm />);
-    expect(container).toHaveTexts(["Distribution name", "Access group"]);
-
-    expect(
-      screen.getByRole("button", {
-        name: /add distribution/i,
-      }),
-    ).toBeVisible();
-  });
-});
diff --git a/src/features/mirrors/components/NewDistributionForm/NewDistributionForm.tsx b/src/features/mirrors/components/NewDistributionForm/NewDistributionForm.tsx
deleted file mode 100644
index 8e652aac5..000000000
--- a/src/features/mirrors/components/NewDistributionForm/NewDistributionForm.tsx
+++ /dev/null
@@ -1,95 +0,0 @@
-import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
-import type { AccessGroup } from "@/features/access-groups";
-import useDebug from "@/hooks/useDebug";
-import useRoles from "@/hooks/useRoles";
-import useSidePanel from "@/hooks/useSidePanel";
-import type { SelectOption } from "@/types/SelectOption";
-import { getFormikError } from "@/utils/formikErrors";
-import { testLowercaseAlphaNumeric } from "@/utils/tests";
-import { Form, Input, Select } from "@canonical/react-components";
-import { useFormik } from "formik";
-import type { FC } from "react";
-import * as Yup from "yup";
-import { string } from "yup";
-import { useDistributions } from "../../hooks";
-import { INITIAL_VALUES } from "./constants";
-import type { FormProps } from "./types";
-
-const NewDistributionForm: FC = () => {
-  const debug = useDebug();
-  const { closeSidePanel } = useSidePanel();
-  const { createDistributionQuery, getDistributionsQuery } = useDistributions();
-  const { getAccessGroupQuery } = useRoles();
-
-  const { mutateAsync: createDistribution } = createDistributionQuery;
-  const { data: { data: accessGroups } = { data: [] as AccessGroup[] } } =
-    getAccessGroupQuery();
-
-  const accessGroupsOptions: SelectOption[] = accessGroups.map(
-    (accessGroup) => ({
-      label: accessGroup.title,
-      value: accessGroup.name,
-    }),
-  );
-
-  const { data: getDistributionsResponse } = getDistributionsQuery({
-    include_latest_sync: true,
-  });
-
-  const formik = useFormik<FormProps>({
-    initialValues: INITIAL_VALUES,
-    validationSchema: Yup.object().shape({
-      name: string()
-        .required("This field is required.")
-        .test({
-          test: testLowercaseAlphaNumeric.test,
-          message: testLowercaseAlphaNumeric.message,
-        })
-        .test({
-          params: { getDistributionsResponse },
-          test: (value) => {
-            return !(getDistributionsResponse?.data ?? []).some(
-              ({ name }) => name == value,
-            );
-          },
-          message: "It must be unique within the account.",
-        }),
-      access_group: Yup.string(),
-    }),
-    onSubmit: async (values) => {
-      try {
-        await createDistribution(values);
-
-        closeSidePanel();
-      } catch (error) {
-        debug(error);
-      }
-    },
-  });
-
-  return (
-    <Form onSubmit={formik.handleSubmit} noValidate>
-      <Input
-        type="text"
-        label="Distribution name"
-        required
-        {...formik.getFieldProps("name")}
-        error={getFormikError(formik, "name")}
-      />
-
-      <Select
-        label="Access group"
-        options={accessGroupsOptions}
-        {...formik.getFieldProps("access_group")}
-        error={getFormikError(formik, "access_group")}
-      />
-
-      <SidePanelFormButtons
-        submitButtonDisabled={formik.isSubmitting}
-        submitButtonText="Add distribution"
-      />
-    </Form>
-  );
-};
-
-export default NewDistributionForm;
diff --git a/src/features/mirrors/components/NewDistributionForm/constants.ts b/src/features/mirrors/components/NewDistributionForm/constants.ts
deleted file mode 100644
index 1f9ee2b83..000000000
--- a/src/features/mirrors/components/NewDistributionForm/constants.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-import { DEFAULT_ACCESS_GROUP_NAME } from "@/constants";
-
-export const INITIAL_VALUES = {
-  name: "",
-  access_group: DEFAULT_ACCESS_GROUP_NAME,
-};
diff --git a/src/features/mirrors/components/NewDistributionForm/index.ts b/src/features/mirrors/components/NewDistributionForm/index.ts
deleted file mode 100644
index 3543ccccc..000000000
--- a/src/features/mirrors/components/NewDistributionForm/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./NewDistributionForm";
diff --git a/src/features/mirrors/components/NewDistributionForm/types.ts b/src/features/mirrors/components/NewDistributionForm/types.ts
deleted file mode 100644
index 485300eb4..000000000
--- a/src/features/mirrors/components/NewDistributionForm/types.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export interface FormProps {
-  name: string;
-  access_group: string;
-}
diff --git a/src/features/mirrors/components/NewPocketForm/NewPocketForm.test.tsx b/src/features/mirrors/components/NewPocketForm/NewPocketForm.test.tsx
deleted file mode 100644
index 627c8acc8..000000000
--- a/src/features/mirrors/components/NewPocketForm/NewPocketForm.test.tsx
+++ /dev/null
@@ -1,125 +0,0 @@
-import { distributions } from "@/tests/mocks/distributions";
-import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import type { ComponentProps } from "react";
-import {
-  ARCHITECTURE_OPTIONS,
-  COMPONENT_OPTIONS,
-  DEFAULT_MIRROR_URI,
-} from "../../constants";
-import NewPocketForm from "./NewPocketForm";
-
-const distribution = distributions.find((d) => d.series.length > 0);
-assert(distribution);
-const [series] = distribution.series;
-assert(series);
-const props: ComponentProps<typeof NewPocketForm> = {
-  distribution,
-  series,
-};
-
-describe("NewPocketForm", () => {
-  it("renders basic form fields for mirror pocket", () => {
-    const { container } = renderWithProviders(<NewPocketForm {...props} />);
-    expect(container).toHaveTexts(["Type", "Mode", "Name", "GPG Key"]);
-
-    expect(screen.getByText("Include .udeb packages")).toBeInTheDocument();
-
-    expect(
-      screen.getByRole("button", {
-        name: /add pocket/i,
-      }),
-    ).toBeVisible();
-  });
-
-  it("handles mirror mode change correctly", async () => {
-    renderWithProviders(<NewPocketForm {...props} />);
-    const modeSelect = screen.getByRole("combobox", { name: /mode/i });
-    const typeSelect = screen.getByRole("combobox", { name: /type/i });
-
-    await userEvent.selectOptions(typeSelect, "ubuntu");
-    await userEvent.selectOptions(modeSelect, "mirror");
-
-    expect(modeSelect).toHaveValue("mirror");
-
-    const mirrorUri = screen.getByRole("textbox", { name: /mirror uri/i });
-    expect(mirrorUri).toBeVisible();
-    expect(mirrorUri).toHaveValue(DEFAULT_MIRROR_URI);
-
-    await userEvent.selectOptions(typeSelect, "third-party");
-    expect(mirrorUri).toHaveValue("");
-  });
-
-  it("handles pull mode change correctly", async () => {
-    renderWithProviders(<NewPocketForm {...props} />);
-
-    const modeSelect = screen.getByRole("combobox", { name: /mode/i });
-    await userEvent.selectOptions(modeSelect, "pull");
-
-    expect(modeSelect).toHaveValue("pull");
-
-    expect(screen.getByText("Pull from")).toBeVisible();
-
-    const filterTypeSelect = screen.getByRole("combobox", {
-      name: /filter type/i,
-    });
-    expect(filterTypeSelect).toBeVisible();
-
-    const filterPackages = screen.queryByText("Filter packages");
-    expect(filterPackages).not.toBeInTheDocument();
-
-    await userEvent.selectOptions(filterTypeSelect, "Allow list");
-
-    expect(screen.getByText("Filter packages")).toBeVisible();
-  });
-
-  it("handles upload mode change correctly", async () => {
-    renderWithProviders(<NewPocketForm {...props} />);
-
-    const modeSelect = screen.getByRole("combobox", { name: /mode/i });
-    await userEvent.selectOptions(modeSelect, "upload");
-
-    expect(modeSelect).toHaveValue("upload");
-
-    expect(
-      screen.getByText("Allow uploaded packages to be unsigned"),
-    ).toBeVisible();
-    expect(screen.getByText("Uploader GPG keys")).toBeVisible();
-  });
-
-  it("handles ubuntu type change correctly", async () => {
-    renderWithProviders(<NewPocketForm {...props} />);
-
-    const typeSelect = screen.getByRole("combobox", { name: /type/i });
-    await userEvent.selectOptions(typeSelect, "ubuntu");
-
-    expect(typeSelect).toHaveValue("ubuntu");
-
-    COMPONENT_OPTIONS.forEach((component) => {
-      expect(screen.getByLabelText(component.label)).toBeVisible();
-    });
-
-    ARCHITECTURE_OPTIONS.forEach((architecture) => {
-      expect(screen.getByLabelText(architecture.label)).toBeVisible();
-    });
-  });
-
-  it("handles third-party type change correctly", async () => {
-    renderWithProviders(<NewPocketForm {...props} />);
-
-    const typeSelect = screen.getByRole("combobox", { name: /type/i });
-    await userEvent.selectOptions(typeSelect, "third-party");
-
-    expect(typeSelect).toHaveValue("third-party");
-
-    const componentsInput = screen.getByRole("textbox", {
-      name: /components/i,
-    });
-    const architecturesInput = screen.getByRole("textbox", {
-      name: /architectures/i,
-    });
-    expect(componentsInput).toBeVisible();
-    expect(architecturesInput).toBeVisible();
-  });
-});
diff --git a/src/features/mirrors/components/NewPocketForm/NewPocketForm.tsx b/src/features/mirrors/components/NewPocketForm/NewPocketForm.tsx
deleted file mode 100644
index 260b854b1..000000000
--- a/src/features/mirrors/components/NewPocketForm/NewPocketForm.tsx
+++ /dev/null
@@ -1,389 +0,0 @@
-import CheckboxGroup from "@/components/form/CheckboxGroup";
-import FieldDescription from "@/components/form/FieldDescription";
-import MultiSelectField from "@/components/form/MultiSelectField";
-import type { groupedOption } from "@/components/form/SelectGrouped";
-import SelectGrouped from "@/components/form/SelectGrouped";
-import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
-import UdebCheckboxInput from "@/components/form/UdebCheckboxInput";
-import useDebug from "@/hooks/useDebug";
-import useSidePanel from "@/hooks/useSidePanel";
-import { getFormikError } from "@/utils/formikErrors";
-import {
-  CheckboxInput,
-  Form,
-  Input,
-  Select,
-  Textarea,
-} from "@canonical/react-components";
-import classNames from "classnames";
-import { useFormik } from "formik";
-import type { FC } from "react";
-import {
-  ARCHITECTURE_OPTIONS,
-  COMPONENT_OPTIONS,
-  DEFAULT_MIRROR_URI,
-  PRE_SELECTED_ARCHITECTURES,
-  PRE_SELECTED_COMPONENTS,
-} from "../../constants";
-import { useGPGKeysOptions, usePockets } from "../../hooks";
-import type { Distribution, Series } from "../../types";
-import {
-  filterTypeOptions,
-  PRE_DEFINED_POCKET_MODE_OPTIONS,
-} from "./constants";
-import {
-  getCreatePocketParams,
-  getInitialValues,
-  getValidationSchema,
-} from "./helpers";
-import type { FormProps } from "./types";
-
-interface NewPocketFormProps {
-  readonly distribution: Distribution;
-  readonly series: Series;
-}
-
-const NewPocketForm: FC<NewPocketFormProps> = ({ distribution, series }) => {
-  const debug = useDebug();
-  const { closeSidePanel } = useSidePanel();
-  const { createPocketQuery, addUploaderGPGKeysToPocketQuery } = usePockets();
-
-  const { mutateAsync: createPocket } = createPocketQuery;
-  const { mutateAsync: addUploaderGPGKeysToPocket } =
-    addUploaderGPGKeysToPocketQuery;
-  const { privateGPGKeysOptions, publicGPGKeysOptions } = useGPGKeysOptions();
-
-  const formik = useFormik<FormProps>({
-    initialValues: getInitialValues(distribution.name, series.name),
-    validationSchema: getValidationSchema(series),
-    onSubmit: async (values) => {
-      try {
-        await createPocket(getCreatePocketParams(values));
-
-        if (
-          "upload" === values.mode &&
-          !values.upload_allow_unsigned &&
-          values.upload_gpg_keys.length
-        ) {
-          await addUploaderGPGKeysToPocket({
-            name: values.name,
-            series: values.series,
-            distribution: values.distribution,
-            gpg_keys: values.upload_gpg_keys,
-          });
-        }
-
-        closeSidePanel();
-      } catch (error) {
-        debug(error);
-      }
-    },
-  });
-
-  const handleTypeChange = (
-    event: React.ChangeEvent<HTMLSelectElement>,
-  ): void => {
-    const newType = event.target.value as "ubuntu" | "third-party";
-    const newFields: Partial<FormProps> =
-      newType === "ubuntu"
-        ? {
-            type: newType,
-            components: PRE_SELECTED_COMPONENTS.ubuntu,
-            architectures: PRE_SELECTED_ARCHITECTURES.ubuntu,
-            mirror_uri:
-              formik.values.mode === "mirror" ? DEFAULT_MIRROR_URI : "",
-          }
-        : {
-            type: newType,
-            components: PRE_SELECTED_COMPONENTS.thirdParty,
-            architectures: PRE_SELECTED_ARCHITECTURES.thirdParty,
-            mirror_uri: formik.values.mode === "mirror" ? "" : undefined,
-          };
-
-    formik.setValues({
-      ...formik.values,
-      ...newFields,
-    });
-  };
-
-  const handleModeChange = (
-    event: React.ChangeEvent<HTMLSelectElement>,
-  ): void => {
-    const newMode = event.target.value;
-    if (newMode === "mirror" && formik.values.type === "ubuntu") {
-      formik.setFieldValue("mirror_uri", DEFAULT_MIRROR_URI);
-    } else {
-      formik.setFieldValue("mirror_uri", "");
-    }
-    formik.setFieldValue("mode", newMode);
-  };
-
-  const groupedPocketOptionsNew: groupedOption[] = distribution.series.map(
-    (item) => ({
-      options: item.pockets.map(({ name }) => ({
-        label: name,
-        value: name,
-      })),
-      optGroup: item.name,
-    }),
-  );
-
-  return (
-    <Form onSubmit={formik.handleSubmit} noValidate>
-      <Select
-        label="Type"
-        required
-        options={[
-          { label: "Ubuntu", value: "ubuntu" },
-          { label: "Third party", value: "third-party" },
-        ]}
-        {...formik.getFieldProps("type")}
-        onChange={handleTypeChange}
-        error={getFormikError(formik, "type")}
-      />
-
-      <Select
-        label="Mode"
-        required
-        options={PRE_DEFINED_POCKET_MODE_OPTIONS}
-        {...formik.getFieldProps("mode")}
-        onChange={handleModeChange}
-        error={getFormikError(formik, "mode")}
-      />
-
-      {"mirror" === formik.values.mode && (
-        <Input
-          type="text"
-          label="Mirror URI"
-          required
-          {...formik.getFieldProps("mirror_uri")}
-          error={getFormikError(formik, "mirror_uri")}
-        />
-      )}
-
-      <div
-        className={classNames({
-          row: "pull" === formik.values.mode,
-          "u-no-padding--left": "pull" === formik.values.mode,
-          "u-no-padding--right": "pull" === formik.values.mode,
-        })}
-      >
-        <Input
-          type="text"
-          label="Name"
-          required
-          wrapperClassName={classNames({
-            "col-6": "pull" === formik.values.mode,
-          })}
-          style={{ display: "block !important" }}
-          {...formik.getFieldProps("name")}
-          error={getFormikError(formik, "name")}
-        />
-
-        {"pull" == formik.values.mode && (
-          <SelectGrouped
-            label="Pull from"
-            required
-            name="pull_pocket"
-            wrapperClassName="col-6"
-            groupedOptions={groupedPocketOptionsNew}
-            option={formik.values.pull_pocket}
-            group={formik.values.pull_series}
-            emptyOption={{ enabled: true, label: "Select pull pocket" }}
-            onChange={async (newOption, newGroup) => {
-              await formik.setFieldValue("pull_pocket", newOption);
-              await formik.setFieldValue("pull_series", newGroup);
-            }}
-            onBlur={formik.handleBlur}
-            error={getFormikError(formik, "pull_pocket")}
-          />
-        )}
-      </div>
-
-      <Select
-        label="GPG Key"
-        required
-        options={[
-          { label: "Select GPG key", value: "" },
-          ...privateGPGKeysOptions,
-        ]}
-        {...formik.getFieldProps("gpg_key")}
-        error={getFormikError(formik, "gpg_key")}
-      />
-
-      {"mirror" === formik.values.mode && (
-        <>
-          <Input
-            type="text"
-            label={
-              <FieldDescription
-                label="Mirror suite"
-                description={
-                  <>
-                    <span>
-                      {
-                        "The specific sub-directory under dists/ that should be mirrored. If the suite name ends with a ‘/’, the remote repository is flat (no dists/ structure, see "
-                      }
-                    </span>
-                    <a
-                      href="http://wiki.debian.org/RepositoryFormat#Flat_Repository_Format"
-                      target="_blank"
-                      rel="nofollow noopener noreferrer"
-                    >
-                      wiki.debian.org/RepositoryFormat#Flat_Repository_Format
-                    </a>
-                    <span>
-                      ); in this case a single value must be passed for the
-                      ‘components’ parameter. Packages from the remote
-                      repository will be mirrored in the specified component.
-                      This parameter is optional and defaults to the same name
-                      as local series and pocket.
-                    </span>
-                  </>
-                }
-              />
-            }
-            {...formik.getFieldProps("mirror_suite")}
-            error={getFormikError(formik, "mirror_suite")}
-          />
-
-          <Select
-            label="Mirror GPG key"
-            options={[
-              { label: "Select GPG key", value: "" },
-              ...publicGPGKeysOptions,
-            ]}
-            {...formik.getFieldProps("mirror_gpg_key")}
-            error={getFormikError(formik, "mirror_gpg_key")}
-            help="If none is given, the stock Ubuntu archive one will be used."
-          />
-        </>
-      )}
-
-      {"pull" === formik.values.mode && (
-        <>
-          <Select
-            label="Filter type"
-            options={filterTypeOptions}
-            {...formik.getFieldProps("filter_type")}
-            error={getFormikError(formik, "filter_type")}
-          />
-
-          {"" !== formik.values.filter_type && (
-            <Textarea
-              label="Filter packages"
-              rows={3}
-              help="List packages to filter separated by commas."
-              {...formik.getFieldProps("filter_packages")}
-              onChange={(event) => {
-                formik.setFieldValue(
-                  "filter_packages",
-                  event.target.value.replace(/\s/g, "").split(","),
-                );
-              }}
-              value={formik.values.filter_packages.join(",")}
-              error={getFormikError(formik, "filter_packages")}
-            />
-          )}
-        </>
-      )}
-
-      {"upload" === formik.values.mode && (
-        <>
-          <CheckboxInput
-            label="Allow uploaded packages to be unsigned"
-            {...formik.getFieldProps("upload_allow_unsigned")}
-            checked={formik.values.upload_allow_unsigned}
-          />
-
-          <MultiSelectField
-            variant="condensed"
-            label="Uploader GPG keys"
-            disabled={formik.values.upload_allow_unsigned}
-            items={publicGPGKeysOptions}
-            selectedItems={publicGPGKeysOptions.filter(({ value }) =>
-              formik.values.upload_gpg_keys.includes(value),
-            )}
-            onItemsUpdate={(items) => {
-              formik.setFieldValue(
-                "upload_gpg_keys",
-                items.map(({ value }) => value),
-              );
-            }}
-            error={getFormikError(formik, "upload_gpg_keys")}
-          />
-        </>
-      )}
-
-      {"ubuntu" === formik.values.type && (
-        <>
-          <CheckboxGroup
-            label="Components"
-            required
-            options={COMPONENT_OPTIONS}
-            {...formik.getFieldProps("components")}
-            onChange={(newOptions) => {
-              formik.setFieldValue("components", newOptions);
-            }}
-            error={getFormikError(formik, "components")}
-          />
-
-          <CheckboxGroup
-            label="Architectures"
-            required
-            options={ARCHITECTURE_OPTIONS}
-            {...formik.getFieldProps("architectures")}
-            onChange={(newOptions) => {
-              formik.setFieldValue("architectures", newOptions);
-            }}
-            error={getFormikError(formik, "architectures")}
-          />
-        </>
-      )}
-
-      {"third-party" === formik.values.type && (
-        <>
-          <Input
-            type="text"
-            label="Components"
-            required
-            {...formik.getFieldProps("components")}
-            value={formik.values.components.join(",")}
-            onChange={(event) => {
-              formik.setFieldValue(
-                "components",
-                event.target.value.replace(/\s/g, "").split(","),
-              );
-            }}
-            error={getFormikError(formik, "components")}
-          />
-
-          <Input
-            type="text"
-            label="Architectures"
-            required
-            {...formik.getFieldProps("architectures")}
-            value={formik.values.architectures.join(",")}
-            onChange={(event) => {
-              formik.setFieldValue(
-                "architectures",
-                event.target.value.replace(/\s/g, "").split(","),
-              );
-            }}
-            error={getFormikError(formik, "architectures")}
-          />
-        </>
-      )}
-
-      <UdebCheckboxInput formik={formik} />
-
-      <SidePanelFormButtons
-        submitButtonDisabled={formik.isSubmitting}
-        submitButtonText="Add pocket"
-        submitButtonAriaLabel="Add pocket"
-      />
-    </Form>
-  );
-};
-
-export default NewPocketForm;
diff --git a/src/features/mirrors/components/NewPocketForm/constants.ts b/src/features/mirrors/components/NewPocketForm/constants.ts
deleted file mode 100644
index c0283687b..000000000
--- a/src/features/mirrors/components/NewPocketForm/constants.ts
+++ /dev/null
@@ -1,49 +0,0 @@
-import type { SelectOption } from "@/types/SelectOption";
-import {
-  DEFAULT_MIRROR_URI,
-  PRE_SELECTED_ARCHITECTURES,
-  PRE_SELECTED_COMPONENTS,
-} from "../../constants";
-import type { FormProps } from "./types";
-
-export const PRE_DEFINED_POCKET_MODE_OPTIONS: SelectOption[] = [
-  {
-    label: "Mirror",
-    value: "mirror",
-  },
-  {
-    label: "Pull",
-    value: "pull",
-  },
-  {
-    label: "Upload",
-    value: "upload",
-  },
-];
-
-export const INITIAL_VALUES: FormProps = {
-  type: "ubuntu",
-  series: "",
-  distribution: "",
-  name: "",
-  architectures: PRE_SELECTED_ARCHITECTURES.ubuntu,
-  components: PRE_SELECTED_COMPONENTS.ubuntu,
-  gpg_key: "",
-  include_udeb: false,
-  filter_type: "",
-  mode: "mirror",
-  pull_pocket: "",
-  pull_series: "",
-  mirror_uri: DEFAULT_MIRROR_URI,
-  upload_allow_unsigned: false,
-  mirror_suite: "",
-  mirror_gpg_key: "",
-  filter_packages: [],
-  upload_gpg_keys: [],
-};
-
-export const filterTypeOptions: SelectOption[] = [
-  { label: "Select filter type", value: "" },
-  { label: "Allow list", value: "whitelist" },
-  { label: "Disallow list", value: "blacklist" },
-];
diff --git a/src/features/mirrors/components/NewPocketForm/helpers.ts b/src/features/mirrors/components/NewPocketForm/helpers.ts
deleted file mode 100644
index dd422e808..000000000
--- a/src/features/mirrors/components/NewPocketForm/helpers.ts
+++ /dev/null
@@ -1,136 +0,0 @@
-import { assertNever } from "@/utils/debug";
-import { testLowercaseAlphaNumeric } from "@/utils/tests";
-import * as Yup from "yup";
-import { MIN_SELECTION_COUNT } from "../../constants";
-import type {
-  CreateMirrorPocketParams,
-  CreatePullPocketParams,
-  CreateUploadPocketParams,
-  Series,
-} from "../../types";
-import { INITIAL_VALUES } from "./constants";
-import type { FormProps } from "./types";
-
-export const getCreatePocketParams = (
-  values: FormProps,
-):
-  | CreateMirrorPocketParams
-  | CreatePullPocketParams
-  | CreateUploadPocketParams => {
-  switch (values.mode) {
-    case "mirror":
-      return {
-        mode: values.mode,
-        distribution: values.distribution,
-        series: values.series,
-        name: values.name,
-        architectures: values.architectures,
-        components: values.components,
-        gpg_key: values.gpg_key,
-        include_udeb: values.include_udeb,
-        mirror_uri: values.mirror_uri,
-        mirror_suite: values.mirror_suite,
-        mirror_gpg_key: values.mirror_gpg_key,
-      };
-    case "upload":
-      return {
-        mode: values.mode,
-        distribution: values.distribution,
-        series: values.series,
-        name: values.name,
-        architectures: values.architectures,
-        components: values.components,
-        gpg_key: values.gpg_key,
-        include_udeb: values.include_udeb,
-        upload_allow_unsigned: values.upload_allow_unsigned,
-      };
-    case "pull":
-      return {
-        mode: values.mode,
-        distribution: values.distribution,
-        series: values.series,
-        name: values.name,
-        architectures: values.architectures,
-        components: values.components,
-        gpg_key: values.gpg_key,
-        include_udeb: values.include_udeb,
-        pull_series: values.pull_series,
-        pull_pocket: values.pull_pocket,
-        filter_type: "" !== values.filter_type ? values.filter_type : undefined,
-        filter_packages: values.filter_packages,
-      };
-    default:
-      return assertNever(values.mode, "pocket mode");
-  }
-};
-
-export const getValidationSchema = (series: Series): Yup.Schema =>
-  Yup.object().shape({
-    type: Yup.string<FormProps["type"]>().required("This field is required."),
-    name: Yup.string()
-      .required("This field is required")
-      .test({
-        test: testLowercaseAlphaNumeric.test,
-        message: testLowercaseAlphaNumeric.message,
-      })
-      .test({
-        params: { series },
-        test: (value) => {
-          return !series.pockets.map(({ name }) => name).includes(value);
-        },
-        message: "It must be unique within series.",
-      }),
-    distribution: Yup.string().required("This field is required"),
-    series: Yup.string().required("This field is required"),
-    components: Yup.array()
-      .defined()
-      .of(Yup.string().defined())
-      .min(MIN_SELECTION_COUNT, "Please choose at least one component")
-      .test({
-        name: "flat-mirror-sub-directory",
-        message: "A single component must be passed",
-        test: (value, context) => {
-          const { mode, mirror_suite } = context.parent;
-
-          if ("mirror" === mode && mirror_suite?.endsWith("/")) {
-            return MIN_SELECTION_COUNT === value.length;
-          }
-
-          return true;
-        },
-      })
-      .required("This field is required"),
-    architectures: Yup.array()
-      .defined()
-      .of(Yup.string().defined())
-      .min(MIN_SELECTION_COUNT, "Please choose at least one architecture"),
-    mode: Yup.string<FormProps["mode"]>().required("This field is required"),
-    gpg_key: Yup.string().required("This field is required"),
-    include_udeb: Yup.boolean().required("This field is required"),
-    mirror_uri: Yup.string().when("mode", {
-      is: "mirror",
-      then: (schema) => schema.required("This field is required"),
-    }),
-    mirror_suite: Yup.string(),
-    mirror_gpg_key: Yup.string(),
-    pull_pocket: Yup.string().when("mode", {
-      is: "pull",
-      then: (schema) => schema.required("This field is required"),
-    }),
-    pull_series: Yup.string(),
-    filter_type: Yup.string<"blacklist" | "whitelist">(),
-    filter_packages: Yup.array().of(Yup.string().defined()),
-    upload_allow_unsigned: Yup.boolean(),
-    upload_gpg_keys: Yup.array().of(Yup.string().defined()),
-  });
-
-export const getInitialValues = (
-  distributionName: string,
-  seriesName: string,
-): FormProps => {
-  return {
-    ...INITIAL_VALUES,
-    distribution: distributionName,
-    series: seriesName,
-  };
-};
diff --git a/src/features/mirrors/components/NewPocketForm/index.ts b/src/features/mirrors/components/NewPocketForm/index.ts
deleted file mode 100644
index 3a62ace67..000000000
--- a/src/features/mirrors/components/NewPocketForm/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./NewPocketForm";
diff --git a/src/features/mirrors/components/NewPocketForm/types.ts b/src/features/mirrors/components/NewPocketForm/types.ts
deleted file mode 100644
index b2f16dedb..000000000
--- a/src/features/mirrors/components/NewPocketForm/types.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import type {
-  CreateMirrorPocketParams,
-  CreatePullPocketParams,
-  CreateUploadPocketParams,
-} from "../../types";
-
-export interface FormProps
-  extends
-    Omit<CreateMirrorPocketParams, "mode">,
-    Omit<CreatePullPocketParams, "mode" | "filter_type">,
-    Omit<CreateUploadPocketParams, "mode"> {
-  type: "ubuntu" | "third-party";
-  mode:
-    | CreateMirrorPocketParams["mode"]
-    | CreatePullPocketParams["mode"]
-    | CreateUploadPocketParams["mode"];
-  pull_series: string;
-  filter_type: CreatePullPocketParams["filter_type"] | "";
-  filter_packages: string[];
-  upload_gpg_keys: string[];
-}
diff --git a/src/features/mirrors/components/NewSeriesForm/NewSeriesForm.test.tsx b/src/features/mirrors/components/NewSeriesForm/NewSeriesForm.test.tsx
deleted file mode 100644
index 79c657371..000000000
--- a/src/features/mirrors/components/NewSeriesForm/NewSeriesForm.test.tsx
+++ /dev/null
@@ -1,130 +0,0 @@
-import { distributions } from "@/tests/mocks/distributions";
-import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import type { ComponentProps } from "react";
-import { describe, it } from "vitest";
-import {
-  ARCHITECTURE_OPTIONS,
-  DEFAULT_MIRROR_URI,
-  PRE_SELECTED_POCKETS,
-} from "../../constants";
-import NewSeriesForm from "./NewSeriesForm";
-import { getStrippedUrl } from "./helpers";
-
-const [distribution] = distributions;
-
-const props: ComponentProps<typeof NewSeriesForm> = {
-  distribution: distribution,
-  ctaText: "Add series",
-};
-
-describe("NewSeriesForm", () => {
-  it("renders form", () => {
-    const { container } = renderWithProviders(<NewSeriesForm />);
-    expect(container).toHaveTexts([
-      "Type",
-      "Mirror URI",
-      "Mirror series",
-      "Series name",
-      "Mirror GPG key",
-      "GPG key",
-      "Pockets",
-      "Components",
-      "Architectures",
-      "Include .udeb packages",
-    ]);
-  });
-
-  it("strips token from url", () => {
-    const url1 = "https://username:password@example.com";
-    const url2 = "https://bearer:AJ8H8HghkhgeqpvjzHHAVZMhuv981@example.com";
-    const url3 = "https://badString:AJ8H8HghkhgeqpvjzHHAVZMhuv981@example.com";
-    const url4 = "https://example.com";
-    expect(getStrippedUrl(url1)).toBe("https://example.com");
-    expect(getStrippedUrl(url2)).toBe("https://example.com");
-    expect(getStrippedUrl(url3)).toBe("https://example.com");
-    expect(getStrippedUrl(url4)).toBe("https://example.com");
-  });
-
-  it("handles ubuntu archive type change correctly", async () => {
-    renderWithProviders(
-      <NewSeriesForm distribution={distribution} ctaText="Add series" />,
-    );
-    const typeSelect = screen.getByRole("combobox", { name: /type/i });
-
-    await userEvent.selectOptions(typeSelect, "ubuntu");
-
-    expect(typeSelect).toHaveValue("ubuntu");
-
-    const mirrorUri = screen.getByRole("textbox", { name: /mirror uri/i });
-    expect(mirrorUri).toBeVisible();
-    expect(mirrorUri).toHaveValue(DEFAULT_MIRROR_URI);
-
-    PRE_SELECTED_POCKETS.ubuntu.forEach((component) => {
-      expect(
-        screen.getByRole("checkbox", {
-          name: component.charAt(0).toUpperCase() + component.slice(1),
-        }),
-      ).toBeChecked();
-    });
-
-    ARCHITECTURE_OPTIONS.forEach((architecture) => {
-      expect(screen.getByLabelText(architecture.label)).toBeVisible();
-    });
-
-    await userEvent.selectOptions(typeSelect, "third-party");
-    expect(mirrorUri).toHaveValue("");
-  });
-
-  it("handles snapshot type change correctly", async () => {
-    renderWithProviders(<NewSeriesForm {...props} />);
-    const typeSelect = screen.getByRole("combobox", { name: /type/i });
-
-    await userEvent.selectOptions(typeSelect, "ubuntu-snapshot");
-
-    expect(typeSelect).toHaveValue("ubuntu-snapshot");
-
-    expect(screen.getByText(/snapshot date/i)).toBeVisible();
-
-    const mirrorGPGKey = screen.queryByRole("textbox", {
-      name: /mirror gpg key/i,
-    });
-    expect(mirrorGPGKey).not.toBeInTheDocument();
-
-    PRE_SELECTED_POCKETS.ubuntu.forEach((component) => {
-      expect(
-        screen.getByRole("checkbox", {
-          name: component.charAt(0).toUpperCase() + component.slice(1),
-        }),
-      ).toBeChecked();
-    });
-
-    ARCHITECTURE_OPTIONS.forEach((architecture) => {
-      expect(screen.getByLabelText(architecture.label)).toBeVisible();
-    });
-  });
-
-  it("handles third-party type change correctly", async () => {
-    renderWithProviders(<NewSeriesForm {...props} />);
-
-    const typeSelect = screen.getByRole("combobox", { name: /type/i });
-
-    await userEvent.selectOptions(typeSelect, "third-party");
-
-    expect(typeSelect).toHaveValue("third-party");
-
-    const componentsInput = screen.getByRole("textbox", {
-      name: /components/i,
-    });
-    const architecturesInput = screen.getByRole("textbox", {
-      name: /architectures/i,
-    });
-    const pocketsInput = screen.getByRole("textbox", {
-      name: /pockets/i,
-    });
-    expect(componentsInput).toBeVisible();
-    expect(architecturesInput).toBeVisible();
-    expect(pocketsInput).toBeVisible();
-  });
-});
diff --git a/src/features/mirrors/components/NewSeriesForm/NewSeriesForm.tsx b/src/features/mirrors/components/NewSeriesForm/NewSeriesForm.tsx
deleted file mode 100644
index b0ce75a7c..000000000
--- a/src/features/mirrors/components/NewSeriesForm/NewSeriesForm.tsx
+++ /dev/null
@@ -1,427 +0,0 @@
-import CheckboxGroup from "@/components/form/CheckboxGroup";
-import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
-import UdebCheckboxInput from "@/components/form/UdebCheckboxInput";
-import { DISPLAY_DATE_FORMAT, INPUT_DATE_FORMAT } from "@/constants";
-
-import { useGPGKeys } from "@/features/gpg-keys";
-import useDebug from "@/hooks/useDebug";
-import useSidePanel from "@/hooks/useSidePanel";
-import type { SelectOption } from "@/types/SelectOption";
-import { getFormikError } from "@/utils/formikErrors";
-import { Col, Form, Input, Row, Select } from "@canonical/react-components";
-import { useFormik } from "formik";
-import moment from "moment";
-import type { ChangeEvent, FC } from "react";
-import { useEffect, useState } from "react";
-import {
-  ARCHITECTURE_OPTIONS,
-  COMPONENT_OPTIONS,
-  DEFAULT_MIRROR_URI,
-  DEFAULT_SNAPSHOT_URI,
-  PRE_SELECTED_ARCHITECTURES,
-  PRE_SELECTED_COMPONENTS,
-  PRE_SELECTED_POCKETS,
-} from "../../constants";
-import { useDistributions, useSeries } from "../../hooks";
-import type { Distribution } from "../../types";
-import {
-  POCKET_OPTIONS,
-  SNAPSHOT_START_DATE,
-  SNAPSHOT_TIMESTAMP_FORMAT,
-} from "./constants";
-import {
-  getInitialValues,
-  getStrippedUrl,
-  getValidationSchema,
-} from "./helpers";
-import type { FormProps } from "./types";
-
-interface NewSeriesFormProps {
-  readonly distribution?: Distribution;
-  readonly ctaText?: string;
-}
-
-const NewSeriesForm: FC<NewSeriesFormProps> = ({
-  distribution,
-  ctaText = "Add mirror",
-}) => {
-  const [mirrorUri, setMirrorUri] = useState(DEFAULT_MIRROR_URI);
-  const [seriesOptions, setSeriesOptions] = useState<SelectOption[]>([]);
-
-  const debug = useDebug();
-  const { closeSidePanel } = useSidePanel();
-  const { getGPGKeysQuery } = useGPGKeys();
-  const { createSeriesQuery, getRepoInfo } = useSeries();
-  const { getDistributionsQuery } = useDistributions();
-
-  const { data: getDistributionsQueryResult } = getDistributionsQuery(
-    { include_latest_sync: true },
-    { enabled: !distribution },
-  );
-
-  const distributions = getDistributionsQueryResult?.data ?? [];
-
-  const { data: gpgKeysData } = getGPGKeysQuery();
-
-  const { mutateAsync: createSeries } = createSeriesQuery;
-
-  const gpgKeys = gpgKeysData?.data ?? [];
-
-  const distributionOptions: SelectOption[] = distributions.map(({ name }) => ({
-    label: name,
-    value: name,
-  }));
-
-  const formik = useFormik<FormProps>({
-    initialValues: getInitialValues(distribution),
-    validationSchema: getValidationSchema(distributions, distribution),
-    onSubmit: async (values) => {
-      try {
-        await createSeries({
-          name: values.name,
-          distribution: values.distribution,
-          mirror_series: values.mirror_series,
-          gpg_key: values.gpg_key,
-          include_udeb: values.include_udeb,
-          mirror_uri: values.mirror_uri,
-          components: values.components,
-          pockets: values.pockets,
-          architectures: values.architectures,
-          mirror_gpg_key: values.mirror_gpg_key,
-        });
-
-        closeSidePanel();
-      } catch (error) {
-        debug(error);
-      }
-    },
-  });
-
-  const handleSnapshotDateChange = async (
-    event: ChangeEvent<HTMLInputElement>,
-  ): Promise<void> => {
-    await formik.setFieldValue("snapshotDate", event.target.value);
-    await formik.setFieldValue(
-      "mirror_uri",
-      `${DEFAULT_SNAPSHOT_URI}/${moment(event.target.value).format(
-        SNAPSHOT_TIMESTAMP_FORMAT,
-      )}`,
-    );
-  };
-
-  const handleTypeChange = async (
-    event: ChangeEvent<HTMLSelectElement>,
-  ): Promise<void> => {
-    await formik.setFieldValue("type", event.target.value);
-
-    if ("ubuntu" === event.target.value) {
-      await formik.setFieldValue("mirror_uri", DEFAULT_MIRROR_URI);
-      await formik.setFieldValue("pockets", PRE_SELECTED_POCKETS.ubuntu);
-      await formik.setFieldValue("hasPockets", true);
-      await formik.setFieldValue("components", PRE_SELECTED_COMPONENTS.ubuntu);
-      await formik.setFieldValue(
-        "architectures",
-        PRE_SELECTED_ARCHITECTURES.ubuntu,
-      );
-
-      if (!formik.values.mirror_uri?.startsWith(DEFAULT_MIRROR_URI)) {
-        await formik.setFieldValue("mirror_uri", DEFAULT_MIRROR_URI);
-      }
-
-      setMirrorUri(DEFAULT_MIRROR_URI);
-    } else if ("third-party" === event.target.value) {
-      await formik.setFieldValue("mirror_uri", "");
-      await formik.setFieldValue("pockets", PRE_SELECTED_POCKETS.thirdParty);
-      await formik.setFieldValue("hasPockets", true);
-      await formik.setFieldValue(
-        "components",
-        PRE_SELECTED_COMPONENTS.thirdParty,
-      );
-      await formik.setFieldValue(
-        "architectures",
-        PRE_SELECTED_ARCHITECTURES.thirdParty,
-      );
-      setMirrorUri("");
-    } else if ("ubuntu-snapshot" === event.target.value) {
-      await formik.setFieldValue(
-        "mirror_uri",
-        `${DEFAULT_SNAPSHOT_URI}/${moment(formik.values.snapshotDate).format(
-          SNAPSHOT_TIMESTAMP_FORMAT,
-        )}`,
-      );
-      await formik.setFieldValue("pockets", PRE_SELECTED_POCKETS.ubuntu);
-      await formik.setFieldValue("hasPockets", true);
-      await formik.setFieldValue("components", PRE_SELECTED_COMPONENTS.ubuntu);
-      setMirrorUri(DEFAULT_MIRROR_URI);
-    }
-  };
-
-  const handleMirrorSeriesChange = async (
-    event: ChangeEvent<HTMLSelectElement>,
-  ): Promise<void> => {
-    const { value } = event.target;
-
-    await formik.setFieldValue("mirror_series", value);
-
-    if (!value || formik.values.name) {
-      return;
-    }
-
-    await formik.setFieldValue(
-      "name",
-      "ubuntu-snapshot" === formik.values.type
-        ? `${value}-snapshot-${moment(formik.values.snapshotDate).format(
-            INPUT_DATE_FORMAT,
-          )}`
-        : value,
-    );
-  };
-
-  const { data: { data: repoInfo } = { data: undefined } } = getRepoInfo(
-    {
-      mirror_uri: getStrippedUrl(mirrorUri),
-    },
-    {
-      enabled: !!mirrorUri,
-    },
-  );
-
-  useEffect(() => {
-    if (!repoInfo) {
-      setSeriesOptions([]);
-      return;
-    }
-
-    if (!repoInfo.ubuntu) {
-      formik.setFieldValue("type", "third-party");
-    } else if (formik.values.mirror_uri?.startsWith(DEFAULT_MIRROR_URI)) {
-      formik.setFieldValue("type", "ubuntu");
-    }
-
-    setSeriesOptions(
-      repoInfo.repos.map(({ description, repo }) => ({
-        label: repoInfo.ubuntu ? description : repo,
-        value: repo,
-      })),
-    );
-  }, [repoInfo]);
-
-  return (
-    <Form onSubmit={formik.handleSubmit} noValidate>
-      <Select
-        label="Type"
-        required
-        options={[
-          { label: "Ubuntu Archive", value: "ubuntu" },
-          {
-            label: "Ubuntu Snapshot",
-            value: "ubuntu-snapshot",
-          },
-          { label: "Third party", value: "third-party" },
-        ]}
-        {...formik.getFieldProps("type")}
-        onChange={handleTypeChange}
-        error={getFormikError(formik, "type")}
-      />
-
-      {"ubuntu-snapshot" !== formik.values.type ? (
-        <Input
-          type="text"
-          label="Mirror URI"
-          required={formik.values.hasPockets}
-          help="Absolute URL or file path"
-          {...formik.getFieldProps("mirror_uri")}
-          onBlur={(event) => {
-            setMirrorUri(event.target.value);
-          }}
-          error={getFormikError(formik, "mirror_uri")}
-        />
-      ) : (
-        <Input
-          type="date"
-          min={moment(SNAPSHOT_START_DATE).format(INPUT_DATE_FORMAT)}
-          max={moment().format(INPUT_DATE_FORMAT)}
-          label="Snapshot date"
-          required
-          {...formik.getFieldProps("snapshotDate")}
-          onChange={handleSnapshotDateChange}
-          error={getFormikError(formik, "snapshotDate")}
-          help={`Starting from approximately ${moment(
-            SNAPSHOT_START_DATE,
-          ).format(DISPLAY_DATE_FORMAT)} in dd.mm.yyyy format`}
-        />
-      )}
-
-      {!distribution && (
-        <Select
-          label="Distribution"
-          required
-          options={[
-            { label: "Select distribution", value: "" },
-            ...distributionOptions,
-          ]}
-          {...formik.getFieldProps("distribution")}
-          error={getFormikError(formik, "distribution")}
-        />
-      )}
-
-      <Row className="u-no-padding">
-        <Col size={6} medium={3} small={2}>
-          <Select
-            label="Mirror series"
-            options={[{ label: "Select series", value: "" }, ...seriesOptions]}
-            {...formik.getFieldProps("mirror_series")}
-            onChange={handleMirrorSeriesChange}
-            error={getFormikError(formik, "mirror_series")}
-          />
-        </Col>
-        <Col size={6} medium={3} small={2}>
-          <Input
-            type="text"
-            label="Series name"
-            required
-            {...formik.getFieldProps("name")}
-            error={getFormikError(formik, "name")}
-          />
-        </Col>
-      </Row>
-
-      <Row className="u-no-padding">
-        {"ubuntu-snapshot" !== formik.values.type && (
-          <Col size={6} medium={3} small={2}>
-            <Select
-              label="Mirror GPG key"
-              options={[
-                { label: "Select mirror GPG key", value: "" },
-                ...gpgKeys
-                  .filter(({ has_secret }) => !has_secret)
-                  .map(({ name }) => ({
-                    label: name,
-                    value: name,
-                  })),
-              ]}
-              {...formik.getFieldProps("mirror_gpg_key")}
-              error={getFormikError(formik, "mirror_gpg_key")}
-              help="If none is given, the stock Ubuntu archive one will be used."
-            />
-          </Col>
-        )}
-
-        <Col size={6} medium={3} small={2}>
-          <Select
-            label="GPG key"
-            required={formik.values.hasPockets}
-            options={[
-              { label: "Select GPG key", value: "" },
-              ...gpgKeys
-                .filter(({ has_secret }) => has_secret)
-                .map(({ name }) => ({
-                  label: name,
-                  value: name,
-                })),
-            ]}
-            {...formik.getFieldProps("gpg_key")}
-            error={getFormikError(formik, "gpg_key")}
-          />
-        </Col>
-      </Row>
-
-      {"third-party" !== formik.values.type ? (
-        <>
-          <CheckboxGroup
-            label="Pockets"
-            style={{ marginTop: "1.5rem" }}
-            options={POCKET_OPTIONS}
-            {...formik.getFieldProps("pockets")}
-            onChange={async (newOptions) => {
-              await formik.setFieldValue("pockets", newOptions);
-              await formik.setFieldValue("hasPockets", !!newOptions.length);
-            }}
-            error={getFormikError(formik, "pockets")}
-          />
-          <CheckboxGroup
-            label="Components"
-            required={formik.values.hasPockets}
-            options={COMPONENT_OPTIONS}
-            {...formik.getFieldProps("components")}
-            onChange={async (newOptions) => {
-              await formik.setFieldValue("components", newOptions);
-            }}
-            error={getFormikError(formik, "components")}
-          />
-          <CheckboxGroup
-            label="Architectures"
-            required={formik.values.hasPockets}
-            options={ARCHITECTURE_OPTIONS}
-            {...formik.getFieldProps("architectures")}
-            onChange={async (newOptions) => {
-              await formik.setFieldValue("architectures", newOptions);
-            }}
-            error={getFormikError(formik, "architectures")}
-          />
-        </>
-      ) : (
-        <>
-          <Input
-            type="text"
-            label="Pockets"
-            placeholder="E.g. releases, security, etc."
-            {...formik.getFieldProps("pockets")}
-            value={formik.values.pockets.join(",")}
-            onChange={async (event) => {
-              await formik.setFieldValue(
-                "pockets",
-                event.target.value.replace(/\s/g, "").split(","),
-              );
-
-              await formik.setFieldValue("hasPockets", !!event.target.value);
-            }}
-            error={getFormikError(formik, "pockets")}
-            help="List the pocket names separated by commas."
-          />
-          <Input
-            type="text"
-            label="Components"
-            required={formik.values.hasPockets}
-            placeholder="E.g. main, universe, etc."
-            {...formik.getFieldProps("components")}
-            value={formik.values.components.join(",")}
-            onChange={async (event) => {
-              await formik.setFieldValue(
-                "components",
-                event.target.value.replace(/\s/g, "").split(","),
-              );
-            }}
-            error={getFormikError(formik, "components")}
-            help="List the component names separated by commas."
-          />
-          <Input
-            type="text"
-            label="Architectures"
-            required={formik.values.hasPockets}
-            placeholder="E.g. amd64, riscv, etc."
-            {...formik.getFieldProps("architectures")}
-            value={formik.values.architectures.join(",")}
-            onChange={async (event) => {
-              await formik.setFieldValue(
-                "architectures",
-                event.target.value.replace(/\s/g, "").split(","),
-              );
-            }}
-            error={getFormikError(formik, "architectures")}
-            help="List the architectures separated by commas."
-          />
-        </>
-      )}
-
-      <UdebCheckboxInput formik={formik} />
-
-      <SidePanelFormButtons
-        submitButtonDisabled={formik.isSubmitting}
-        submitButtonText={ctaText}
-      />
-    </Form>
-  );
-};
-
-export default NewSeriesForm;
diff --git a/src/features/mirrors/components/NewSeriesForm/helpers.ts b/src/features/mirrors/components/NewSeriesForm/helpers.ts
deleted file mode 100644
index 6ccaac983..000000000
--- a/src/features/mirrors/components/NewSeriesForm/helpers.ts
+++ /dev/null
@@ -1,102 +0,0 @@
-import { DISPLAY_DATE_FORMAT } from "@/constants";
-import { testLowercaseAlphaNumeric } from "@/utils/tests";
-import moment from "moment";
-import * as Yup from "yup";
-import { MIN_SELECTION_COUNT } from "../../constants";
-import type { Distribution } from "../../types";
-import { INITIAL_VALUES, SNAPSHOT_START_DATE } from "./constants";
-import type { FormProps } from "./types";
-
-export const getStrippedUrl = (url: string): string =>
-  url.replace(/\/[^\\/@]*@/, "/");
-
-export const getInitialValues = (distribution?: Distribution): FormProps => {
-  return distribution
-    ? { ...INITIAL_VALUES, distribution: distribution.name }
-    : INITIAL_VALUES;
-};
-
-export const getValidationSchema = (
-  distributions: Distribution[],
-  distribution?: Distribution,
-): Yup.Schema => {
-  return Yup.object().shape({
-    distribution: Yup.string().required("This field is required."),
-    type: Yup.string<FormProps["type"]>().required("This field is required."),
-    name: Yup.string()
-      .required("This field is required.")
-      .test({
-        test: testLowercaseAlphaNumeric.test,
-        message: testLowercaseAlphaNumeric.message,
-      })
-      .test({
-        test: (_, context) => {
-          return !!context.parent.distribution;
-        },
-        message: "First select the distribution.",
-      })
-      .test({
-        params: { distribution, distributions },
-        test: (value, context) => {
-          if (!context.parent.distribution) {
-            return true;
-          }
-
-          const seriesNames = distribution
-            ? distribution.series.map(({ name }) => name)
-            : distributions
-                .find(({ name }) => name === context.parent.distribution)
-                ?.series.map(({ name }) => name);
-
-          return !seriesNames?.includes(value);
-        },
-        message: "It must be unique within series within the distribution.",
-      }),
-    hasPockets: Yup.boolean(),
-    mirror_series: Yup.string(),
-    mirror_gpg_key: Yup.string(),
-    mirror_uri: Yup.string().when("hasPockets", ([value], schema) =>
-      value ? schema.nonNullable().required("This field is required.") : schema,
-    ),
-    snapshotDate: Yup.string().when("type", ([value], schema) =>
-      value === "ubuntu-snapshot"
-        ? schema.required("This field is required.").test({
-            test: (valueToTest) => {
-              return moment(valueToTest).isBetween(
-                moment(SNAPSHOT_START_DATE),
-                moment(),
-              );
-            },
-            message: `The date must be after ${moment(
-              SNAPSHOT_START_DATE,
-            ).format(DISPLAY_DATE_FORMAT)} and not in the future.`,
-          })
-        : schema,
-    ),
-    gpg_key: Yup.string().when("hasPockets", ([value], schema) =>
-      value ? schema.required("This field is required.") : schema,
-    ),
-    pockets: Yup.array().of(Yup.string()),
-    components: Yup.array()
-      .of(Yup.string())
-      .when("hasPockets", ([value], schema) =>
-        value
-          ? schema.min(
-              MIN_SELECTION_COUNT,
-              "Please choose at least one component.",
-            )
-          : schema,
-      ),
-    architectures: Yup.array()
-      .of(Yup.string())
-      .when("hasPockets", ([value], schema) =>
-        value
-          ? schema.min(
-              MIN_SELECTION_COUNT,
-              "Please choose at least one architecture.",
-            )
-          : schema,
-      ),
-    include_udeb: Yup.boolean().required(),
-  });
-};
diff --git a/src/features/mirrors/components/NewSeriesForm/index.ts b/src/features/mirrors/components/NewSeriesForm/index.ts
deleted file mode 100644
index d555437e1..000000000
--- a/src/features/mirrors/components/NewSeriesForm/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./NewSeriesForm";
diff --git a/src/features/mirrors/components/NewSeriesForm/types.ts b/src/features/mirrors/components/NewSeriesForm/types.ts
deleted file mode 100644
index 192370d2f..000000000
--- a/src/features/mirrors/components/NewSeriesForm/types.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import type { CreateSeriesParams } from "../../types";
-
-export interface FormProps extends CreateSeriesParams {
-  type: "ubuntu" | "ubuntu-snapshot" | "third-party";
-  pockets: string[];
-  components: string[];
-  architectures: string[];
-  hasPockets: boolean;
-  snapshotDate: string;
-}
diff --git a/src/features/mirrors/components/PackageList/PackageList.module.scss b/src/features/mirrors/components/PackageList/PackageList.module.scss
deleted file mode 100644
index 16f8c741a..000000000
--- a/src/features/mirrors/components/PackageList/PackageList.module.scss
+++ /dev/null
@@ -1,5 +0,0 @@
-@import "vanilla-framework/scss/settings_spacing";
-
-.ctaRow {
-  row-gap: $spv--x-large;
-}
diff --git a/src/features/mirrors/components/PackageList/PackageList.test.tsx b/src/features/mirrors/components/PackageList/PackageList.test.tsx
deleted file mode 100644
index 172874086..000000000
--- a/src/features/mirrors/components/PackageList/PackageList.test.tsx
+++ /dev/null
@@ -1,309 +0,0 @@
-import { expectLoadingState } from "@/tests/helpers";
-import { setEndpointStatus } from "@/tests/controllers/controller";
-import { listPockets, pockets } from "@/tests/mocks/pockets";
-import { renderWithProviders } from "@/tests/render";
-import { screen, within } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import type { ComponentProps } from "react";
-import { waitFor } from "@testing-library/react";
-import { describe, expect } from "vitest";
-import PackageList from "./PackageList";
-
-const mirrorPocket = pockets.find((p) => p.mode === "mirror");
-assert(mirrorPocket);
-const mirrorPocketProps: ComponentProps<typeof PackageList> = {
-  distributionName: "Ubuntu",
-  seriesName: "Focal Fossa",
-  pocket: mirrorPocket,
-};
-
-const uploadPocket = pockets.find((p) => p.mode === "upload");
-assert(uploadPocket);
-const uploadPocketProps: ComponentProps<typeof PackageList> = {
-  distributionName: "Ubuntu",
-  seriesName: "Focal Fossa",
-  pocket: uploadPocket,
-};
-
-const pullPocket = pockets.find((p) => p.mode === "pull" && p.filter_type);
-assert(pullPocket);
-const pullPocketProps: ComponentProps<typeof PackageList> = {
-  distributionName: "Ubuntu",
-  seriesName: "Focal Fossa",
-  pocket: pullPocket,
-};
-describe("PackageList", () => {
-  beforeEach(() => {
-    setEndpointStatus("default");
-  });
-
-  it("renders common buttons", () => {
-    renderWithProviders(<PackageList {...mirrorPocketProps} />);
-    expect(screen.getByRole("button", { name: /edit/i })).toBeVisible();
-    expect(screen.getByRole("button", { name: /remove/i })).toBeVisible();
-  });
-
-  it("renders correct mirror conditionals", async () => {
-    renderWithProviders(<PackageList {...mirrorPocketProps} />);
-    expect(screen.getByRole("button", { name: /sync/i })).toBeVisible();
-    await expectLoadingState();
-
-    expect(screen.getByRole("searchbox", { name: /search/i })).toBeVisible();
-  });
-
-  it("renders correct pull conditionals", async () => {
-    renderWithProviders(<PackageList {...pullPocketProps} />);
-    expect(screen.getByRole("button", { name: /pull/i })).toBeVisible();
-
-    await expectLoadingState();
-    expect(screen.getByRole("searchbox", { name: /search/i })).toBeVisible();
-  });
-
-  it("renders table with correct columns for mirror pocket", async () => {
-    renderWithProviders(<PackageList {...mirrorPocketProps} />);
-
-    await expectLoadingState();
-    expect(screen.getByText("Package")).toBeVisible();
-
-    const checkboxes = screen.queryAllByRole("checkbox");
-    expect(checkboxes.length).toEqual(0);
-  });
-
-  it("renders table with correct columns", async () => {
-    renderWithProviders(<PackageList {...uploadPocketProps} />);
-
-    await expectLoadingState();
-    const toggleAllCheckbox = screen.getByRole("checkbox", {
-      name: /toggle all/i,
-    });
-    expect(toggleAllCheckbox).toBeVisible();
-
-    const rowCheckboxes = screen.getAllByRole("checkbox").length - 1;
-    expect(rowCheckboxes).toEqual(listPockets.length);
-  });
-
-  it("does not show sync or search controls for upload pocket", async () => {
-    renderWithProviders(<PackageList {...uploadPocketProps} />);
-
-    await expectLoadingState();
-
-    expect(
-      screen.queryByRole("button", { name: /^sync$/i }),
-    ).not.toBeInTheDocument();
-    expect(
-      screen.queryByRole("button", { name: /^pull$/i }),
-    ).not.toBeInTheDocument();
-    expect(
-      screen.queryByRole("searchbox", { name: /package search/i }),
-    ).not.toBeInTheDocument();
-  });
-
-  it("renders empty state when no packages are returned", async () => {
-    setEndpointStatus("empty");
-
-    renderWithProviders(<PackageList {...mirrorPocketProps} />);
-
-    await expectLoadingState();
-
-    expect(screen.getByText("No packages found")).toBeInTheDocument();
-    expect(
-      screen.queryByRole("searchbox", { name: /package search/i }),
-    ).not.toBeInTheDocument();
-  });
-
-  it("opens the edit side panel from actions", async () => {
-    const user = userEvent.setup();
-    renderWithProviders(<PackageList {...mirrorPocketProps} />);
-
-    await user.click(screen.getByRole("button", { name: /edit/i }));
-
-    expect(
-      await screen.findByRole("heading", { name: /edit .* pocket/i }),
-    ).toBeInTheDocument();
-  });
-
-  it("removes pocket successfully", async () => {
-    const user = userEvent.setup();
-    renderWithProviders(<PackageList {...mirrorPocketProps} />);
-
-    await user.click(
-      screen.getByRole("button", {
-        name: `Remove ${mirrorPocketProps.pocket.name} pocket of ${mirrorPocketProps.distributionName}/${mirrorPocketProps.seriesName}`,
-      }),
-    );
-    const dialog = screen.getByRole("dialog", { name: "Deleting pocket" });
-    await user.click(within(dialog).getByRole("button", { name: "Delete" }));
-
-    await waitFor(() => {
-      expect(
-        screen.queryByRole("dialog", { name: "Deleting pocket" }),
-      ).not.toBeInTheDocument();
-    });
-  });
-
-  it("submits mirror sync confirmation flow", async () => {
-    const user = userEvent.setup();
-    renderWithProviders(<PackageList {...mirrorPocketProps} />);
-
-    await user.click(
-      screen.getByRole("button", {
-        name: new RegExp(
-          `Synchronize ${mirrorPocketProps.pocket.name} pocket of ${mirrorPocketProps.distributionName}/${mirrorPocketProps.seriesName}`,
-          "i",
-        ),
-      }),
-    );
-
-    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
-  });
-
-  it("submits pull sync flow", async () => {
-    const user = userEvent.setup();
-    renderWithProviders(<PackageList {...pullPocketProps} />);
-
-    await user.click(
-      screen.getByRole("button", {
-        name: new RegExp(
-          `Pull packages to ${pullPocketProps.pocket.name} pocket of ${pullPocketProps.distributionName}/${pullPocketProps.seriesName}`,
-          "i",
-        ),
-      }),
-    );
-
-    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
-  });
-
-  it("renders pull package diffs with updates and deletions", async () => {
-    setEndpointStatus({ status: "default", path: "DiffPullPocketUpdate" });
-    renderWithProviders(<PackageList {...pullPocketProps} />);
-
-    await expectLoadingState();
-    await waitFor(() => {
-      expect(
-        document.querySelectorAll(".p-icon--warning").length,
-      ).toBeGreaterThan(0);
-    });
-  });
-
-  it("renders pull package list when diffs contain only additions", async () => {
-    setEndpointStatus({ status: "default", path: "DiffPullPocketAddOnly" });
-
-    renderWithProviders(<PackageList {...pullPocketProps} />);
-    await expectLoadingState();
-
-    expect(await screen.findByText("pocket1")).toBeInTheDocument();
-    expect(document.querySelector(".p-icon--warning")).not.toBeInTheDocument();
-  });
-
-  it("submits upload remove-packages flow", async () => {
-    const user = userEvent.setup();
-    const [firstPackage] = listPockets;
-    assert(firstPackage);
-    renderWithProviders(<PackageList {...uploadPocketProps} />);
-
-    await expectLoadingState();
-    await user.click(screen.getByLabelText(firstPackage.name));
-    await user.click(
-      screen.getByRole("button", { name: /remove selected packages from/i }),
-    );
-    const dialog = screen.getByRole("dialog", {
-      name: /deleting packages from pocket/i,
-    });
-    await user.click(within(dialog).getByRole("button", { name: /^delete$/i }));
-
-    expect(screen.queryByText(/error/i)).not.toBeInTheDocument();
-  });
-
-  it("searches and clears package search", async () => {
-    const user = userEvent.setup();
-    renderWithProviders(<PackageList {...mirrorPocketProps} />);
-
-    await expectLoadingState();
-
-    const searchInput = screen.getByRole("searchbox", {
-      name: /package search/i,
-    });
-    await user.type(searchInput, "pocket1{enter}");
-    expect(searchInput).toHaveValue("pocket1");
-
-    await user.click(
-      screen.getByRole("button", { name: /clear search field/i }),
-    );
-    expect(searchInput).toHaveValue("");
-  });
-
-  it("resets selected packages when paginating upload list", async () => {
-    const user = userEvent.setup();
-    setEndpointStatus({ status: "default", path: "ListPocketMany" });
-    renderWithProviders(<PackageList {...uploadPocketProps} />);
-
-    await screen.findByRole("checkbox", { name: "Toggle all" });
-    const [, firstRowCheckbox] = screen.getAllByRole("checkbox");
-    assert(firstRowCheckbox);
-    await user.click(firstRowCheckbox);
-    await user.click(screen.getByRole("button", { name: /next page/i }));
-    await user.click(screen.getByRole("button", { name: /previous page/i }));
-
-    await waitFor(() => {
-      expect(
-        screen.getByRole("button", { name: /remove selected packages from/i }),
-      ).toHaveAttribute("aria-disabled", "true");
-    });
-  });
-
-  it("changes page size via pagination select", async () => {
-    const user = userEvent.setup();
-    setEndpointStatus({ status: "default", path: "ListPocketMany" });
-    renderWithProviders(<PackageList {...uploadPocketProps} />);
-
-    await screen.findByRole("combobox", { name: "Instances per page" });
-    await user.selectOptions(
-      screen.getByRole("combobox", { name: "Instances per page" }),
-      "50",
-    );
-
-    expect(
-      screen.queryByRole("button", { name: /next page/i }),
-    ).not.toBeInTheDocument();
-  });
-
-  it("shows error notification when removing pocket fails", async () => {
-    const user = userEvent.setup();
-    setEndpointStatus({ status: "error", path: "RemovePocket" });
-    renderWithProviders(<PackageList {...mirrorPocketProps} />);
-
-    await user.click(
-      screen.getByRole("button", {
-        name: `Remove ${mirrorPocketProps.pocket.name} pocket of ${mirrorPocketProps.distributionName}/${mirrorPocketProps.seriesName}`,
-      }),
-    );
-    const dialog = screen.getByRole("dialog", { name: "Deleting pocket" });
-    await user.click(within(dialog).getByRole("button", { name: "Delete" }));
-
-    expect(
-      await screen.findByText('The endpoint status is set to "error".'),
-    ).toBeInTheDocument();
-  });
-
-  it("shows error notification when removing packages fails", async () => {
-    const user = userEvent.setup();
-    setEndpointStatus({ status: "error", path: "RemovePackagesFromPocket" });
-    renderWithProviders(<PackageList {...uploadPocketProps} />);
-
-    const [firstPocket] = listPockets;
-    assert(firstPocket);
-    await screen.findByRole("checkbox", { name: firstPocket.name });
-    await user.click(screen.getByLabelText(firstPocket.name));
-    await user.click(
-      screen.getByRole("button", { name: /remove selected packages from/i }),
-    );
-    const dialog = screen.getByRole("dialog", {
-      name: /deleting packages from pocket/i,
-    });
-    await user.click(within(dialog).getByRole("button", { name: /^delete$/i }));
-
-    expect(
-      await screen.findByText('The endpoint status is set to "error".'),
-    ).toBeInTheDocument();
-  });
-});
diff --git a/src/features/mirrors/components/PackageList/PackageList.tsx b/src/features/mirrors/components/PackageList/PackageList.tsx
deleted file mode 100644
index 4833f6ed7..000000000
--- a/src/features/mirrors/components/PackageList/PackageList.tsx
+++ /dev/null
@@ -1,454 +0,0 @@
-import LoadingState from "@/components/layout/LoadingState";
-import { SidePanelTablePagination } from "@/components/layout/TablePagination";
-import useDebug from "@/hooks/useDebug";
-import useSidePanel from "@/hooks/useSidePanel";
-import { pluralizeWithCount } from "@/utils/_helpers";
-import {
-  Button,
-  Col,
-  ConfirmationButton,
-  Form,
-  Row,
-  SearchBox,
-} from "@canonical/react-components";
-import classNames from "classnames";
-import type { ComponentProps, FC } from "react";
-import { lazy, Suspense, useEffect, useMemo, useState } from "react";
-import { useBoolean, useMediaQuery } from "usehooks-ts";
-import { usePockets } from "../../hooks";
-import type { Distribution, Pocket, Series } from "../../types";
-import type { FormattedPackage } from "../../types/FormattedPackage";
-import PackageTable from "../PackageTable";
-import classes from "./PackageList.module.scss";
-
-const EditPocketForm = lazy(async () => import("../EditPocketForm"));
-
-interface PackageListProps {
-  readonly distributionName: Distribution["name"];
-  readonly pocket: Pocket;
-  readonly seriesName: Series["name"];
-}
-
-const defaultPage = 1;
-const defaultItemsPerPage = 20;
-
-const PackageList: FC<PackageListProps> = ({
-  distributionName,
-  pocket,
-  seriesName,
-}) => {
-  const [currentPage, setCurrentPage] = useState(defaultPage);
-  const [itemsPerPage, setItemsPerPage] = useState(defaultItemsPerPage);
-  const [selectedPackages, setSelectedPackages] = useState<number[]>([]);
-  const {
-    value: hasUpdatedOrDeletedPackages,
-    setTrue: setHasUpdatedOrDeletedPackagesTrue,
-  } = useBoolean();
-  const [inputText, setInputText] = useState("");
-  const [search, setSearch] = useState("");
-  const [diffPullPocket, setDiffPullPocket] = useState<
-    {
-      packageName: string;
-      newVersion: string;
-      difference: "update" | "delete" | "add";
-    }[]
-  >([]);
-
-  const isSmallerScreen = useMediaQuery("(max-width: 619px)");
-
-  const debug = useDebug();
-  const { setSidePanelContent, closeSidePanel } = useSidePanel();
-
-  const {
-    listPocketQuery,
-    diffPullPocketQuery,
-    pullPackagesToPocketQuery,
-    syncMirrorPocketQuery,
-    removePackagesFromPocketQuery,
-    removePocketQuery,
-  } = usePockets();
-
-  const { mutate: syncMirrorPocket, isPending: isSynchronizingMirrorPocket } =
-    syncMirrorPocketQuery;
-  const { mutate: pullPackagesToPocket, isPending: isPullingPackagesToPocket } =
-    pullPackagesToPocketQuery;
-
-  const handleSync = (): void => {
-    if ("pull" === pocket.mode) {
-      pullPackagesToPocket({
-        name: pocket.name,
-        series: seriesName,
-        distribution: distributionName,
-      });
-      return;
-    }
-
-    syncMirrorPocket({
-      name: pocket.name,
-      series: seriesName,
-      distribution: distributionName,
-    });
-  };
-
-  const handleEditPocket = (): void => {
-    setSidePanelContent(
-      `Edit ${pocket.name} pocket`,
-      <Suspense fallback={<LoadingState />}>
-        <EditPocketForm
-          pocket={pocket}
-          distributionName={distributionName}
-          seriesName={seriesName}
-        />
-      </Suspense>,
-    );
-  };
-
-  const { mutateAsync: removePocket, isPending: isRemovingPocket } =
-    removePocketQuery;
-
-  const handleRemovePocket = async (): Promise<void> => {
-    try {
-      await removePocket({
-        distribution: distributionName,
-        series: seriesName,
-        name: pocket.name,
-      });
-
-      closeSidePanel();
-    } catch (error) {
-      debug(error);
-    }
-  };
-
-  const {
-    mutateAsync: removePackagesFromPocket,
-    isPending: isRemovingPackagesFromPocket,
-  } = removePackagesFromPocketQuery;
-
-  const noQueryIsPending =
-    !isSynchronizingMirrorPocket &&
-    !isPullingPackagesToPocket &&
-    !isRemovingPackagesFromPocket &&
-    !isRemovingPocket;
-
-  const { data: listPocketQueryResult, isLoading: listPocketLoading } =
-    listPocketQuery(
-      {
-        name: pocket.name,
-        series: seriesName,
-        distribution: distributionName,
-        search,
-        limit: itemsPerPage,
-        offset: currentPage * itemsPerPage - itemsPerPage,
-      },
-      {
-        enabled: noQueryIsPending,
-      },
-    );
-
-  const listPocketData = listPocketQueryResult?.data ?? {
-    count: 0,
-    results: [],
-  };
-
-  const pocketPackages: FormattedPackage[] = listPocketData.results.map(
-    (newPackage) => {
-      return {
-        packageName: newPackage.name,
-        packageVersion: newPackage.version,
-      };
-    },
-  );
-
-  const { data: diffPullPocketQueryResult } = diffPullPocketQuery(
-    {
-      name: pocket.name,
-      series: seriesName,
-      distribution: distributionName,
-    },
-    {
-      enabled: "pull" === pocket.mode && !listPocketLoading && noQueryIsPending,
-    },
-  );
-
-  useEffect(() => {
-    const diffPullPocketData = diffPullPocketQueryResult?.data ?? {};
-
-    const diffs: {
-      packageName: string;
-      newVersion: string;
-      difference: "update" | "delete" | "add";
-    }[] = [];
-
-    for (const dataKey in diffPullPocketData) {
-      const diff = {
-        add: [],
-        update: [],
-        delete: [],
-        ...diffPullPocketData[dataKey],
-      };
-
-      for (const [packageName, newVersion] of diff.add) {
-        diffs.push({
-          packageName,
-          newVersion,
-          difference: "add",
-        });
-      }
-
-      if (diff.update.length || diff.delete.length) {
-        setHasUpdatedOrDeletedPackagesTrue();
-      }
-
-      for (const [packageName, , newVersion] of diff.update) {
-        diffs.push({
-          packageName,
-          newVersion,
-          difference: "update",
-        });
-      }
-
-      for (const [packageName] of diff.delete) {
-        diffs.push({
-          packageName,
-          difference: "delete",
-          newVersion: "",
-        });
-      }
-    }
-
-    setDiffPullPocket(diffs);
-  }, [diffPullPocketQueryResult]);
-
-  const getSortedPackages = (): FormattedPackage[] => {
-    if (!hasUpdatedOrDeletedPackages) {
-      return pocketPackages;
-    }
-
-    pocketPackages.forEach((pocketPackage) => {
-      const alteredPackage = diffPullPocket.find(
-        ({ packageName }) => pocketPackage.packageName === packageName,
-      );
-
-      if (alteredPackage) {
-        pocketPackage.difference = alteredPackage.difference;
-
-        if ("" !== alteredPackage.newVersion) {
-          pocketPackage.newVersion = alteredPackage.newVersion;
-        }
-      }
-    });
-
-    return [
-      ...pocketPackages.filter(({ difference }) => difference),
-      ...pocketPackages.filter(({ difference }) => !difference),
-    ];
-  };
-
-  const packagesToShow = useMemo(
-    () => getSortedPackages(),
-    [
-      currentPage,
-      itemsPerPage,
-      search,
-      hasUpdatedOrDeletedPackages,
-      pocketPackages.length,
-      diffPullPocket.length,
-    ],
-  );
-
-  const handleRemovePackages = async (): Promise<void> => {
-    const packages = packagesToShow
-      .filter((_, index) => selectedPackages.includes(index))
-      .map(({ packageName }) => packageName);
-
-    try {
-      await removePackagesFromPocket({
-        name: pocket.name,
-        series: seriesName,
-        distribution: distributionName,
-        packages,
-      });
-    } catch (error) {
-      debug(error);
-    }
-  };
-
-  const hasNoPackages =
-    !search &&
-    currentPage === defaultPage &&
-    itemsPerPage === defaultItemsPerPage &&
-    !listPocketData.count;
-
-  const colProps: ComponentProps<typeof Col> =
-    "upload" === pocket.mode
-      ? {
-          size: 8,
-          medium: 4,
-        }
-      : {
-          size: 6,
-          medium: 3,
-        };
-  const isSyncButtonDisabled =
-    isSynchronizingMirrorPocket || isPullingPackagesToPocket;
-
-  return (
-    <>
-      <Row
-        className={classNames(
-          "u-no-padding--left u-no-padding--right",
-          classes.ctaRow,
-        )}
-      >
-        <Col {...colProps}>
-          <div className="p-segmented-control">
-            <div className="p-segmented-control__list">
-              {"upload" !== pocket.mode && (
-                <Button
-                  className="p-segmented-control__button"
-                  type="button"
-                  onClick={handleSync}
-                  disabled={isSyncButtonDisabled}
-                  aria-label={
-                    "mirror" === pocket.mode
-                      ? `Synchronize ${pocket.name} pocket of ${distributionName}/${seriesName}`
-                      : `Pull packages to ${pocket.name} pocket of ${distributionName}/${seriesName}`
-                  }
-                >
-                  {"mirror" === pocket.mode ? "Sync" : "Pull"}
-                </Button>
-              )}
-              <Button
-                className="p-segmented-control__button"
-                type="button"
-                onClick={handleEditPocket}
-                aria-label={`Edit ${pocket.name} pocket of ${distributionName}/${seriesName}`}
-              >
-                Edit
-              </Button>
-              <ConfirmationButton
-                className="p-segmented-control__button"
-                type="button"
-                aria-label={`Remove ${pocket.name} pocket of ${distributionName}/${seriesName}`}
-                confirmationModalProps={{
-                  title: "Deleting pocket",
-                  children: (
-                    <p>
-                      Do you really want to delete {pocket.name} pocket from{" "}
-                      {seriesName} series of {distributionName} distribution?
-                    </p>
-                  ),
-                  confirmButtonLabel: "Delete",
-                  confirmButtonAppearance: "negative",
-                  confirmButtonDisabled: isRemovingPocket,
-                  confirmButtonLoading: isRemovingPocket,
-                  onConfirm: handleRemovePocket,
-                }}
-              >
-                Remove
-              </ConfirmationButton>
-              {"upload" === pocket.mode && (
-                <ConfirmationButton
-                  className="p-segmented-control__button"
-                  type="button"
-                  disabled={
-                    !selectedPackages.length || isRemovingPackagesFromPocket
-                  }
-                  aria-label={`Remove selected packages from ${pocket.name} pocket of ${distributionName}/${seriesName}`}
-                  confirmationModalProps={{
-                    title: "Deleting packages from pocket",
-                    children: (
-                      <p>
-                        This will delete{" "}
-                        {pluralizeWithCount(
-                          selectedPackages.length,
-                          "selected package",
-                        )}{" "}
-                        from {pocket.name} pocket {seriesName} series of{" "}
-                        {distributionName} distribution
-                      </p>
-                    ),
-                    confirmButtonLabel: "Delete",
-                    confirmButtonAppearance: "negative",
-                    confirmButtonDisabled: isRemovingPackagesFromPocket,
-                    confirmButtonLoading: isRemovingPackagesFromPocket,
-                    onConfirm: handleRemovePackages,
-                  }}
-                >
-                  Remove packages
-                </ConfirmationButton>
-              )}
-            </div>
-          </div>
-        </Col>
-        {"upload" !== pocket.mode && !hasNoPackages && (
-          <Col size={6} medium={3}>
-            <Form
-              onSubmit={(event) => {
-                event.preventDefault();
-                setSearch(inputText);
-                setCurrentPage(defaultPage);
-              }}
-              noValidate
-            >
-              <SearchBox
-                externallyControlled
-                shouldRefocusAfterReset
-                aria-label="Package search"
-                onChange={(inputValue) => {
-                  setInputText(inputValue);
-                }}
-                value={inputText}
-                onClear={() => {
-                  setInputText("");
-                  setSearch("");
-                  setCurrentPage(defaultPage);
-                }}
-                className={classNames({
-                  "is-dense": !isSmallerScreen,
-                  "u-no-margin--bottom": isSmallerScreen,
-                })}
-                onSearch={() => {
-                  setSearch(inputText);
-                  setCurrentPage(defaultPage);
-                }}
-                autocomplete="off"
-              />
-            </Form>
-          </Col>
-        )}
-      </Row>
-
-      {listPocketLoading ? (
-        <LoadingState />
-      ) : hasNoPackages ? (
-        <p>No packages found</p>
-      ) : (
-        <>
-          <PackageTable
-            isUpload={"upload" === pocket.mode}
-            packagesToShow={packagesToShow}
-            search={search}
-            selectedPackages={selectedPackages}
-            setSelectedPackages={setSelectedPackages}
-          />
-          <SidePanelTablePagination
-            currentPage={currentPage}
-            totalItems={listPocketData.count}
-            paginate={(page) => {
-              setSelectedPackages([]);
-              setCurrentPage(page);
-            }}
-            pageSize={itemsPerPage}
-            setPageSize={(itemsNumber) => {
-              setItemsPerPage(itemsNumber);
-            }}
-          />
-        </>
-      )}
-    </>
-  );
-};
-
-export default PackageList;
diff --git a/src/features/mirrors/components/PackageList/index.ts b/src/features/mirrors/components/PackageList/index.ts
deleted file mode 100644
index a2093f77e..000000000
--- a/src/features/mirrors/components/PackageList/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./PackageList";
diff --git a/src/features/mirrors/components/PackageTable/PackageTable.module.scss b/src/features/mirrors/components/PackageTable/PackageTable.module.scss
deleted file mode 100644
index fd417837f..000000000
--- a/src/features/mirrors/components/PackageTable/PackageTable.module.scss
+++ /dev/null
@@ -1,9 +0,0 @@
-@import "vanilla-framework/scss/settings_spacing";
-
-.version {
-  width: 53.3%;
-}
-
-.content {
-  margin-top: $spv--x-large;
-}
diff --git a/src/features/mirrors/components/PackageTable/PackageTable.test.tsx b/src/features/mirrors/components/PackageTable/PackageTable.test.tsx
deleted file mode 100644
index 58a785ef0..000000000
--- a/src/features/mirrors/components/PackageTable/PackageTable.test.tsx
+++ /dev/null
@@ -1,39 +0,0 @@
-import { render, screen } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import type { ComponentProps } from "react";
-import { describe } from "vitest";
-import PackageTable from "./PackageTable";
-
-describe("PackageTable", () => {
-  const props: ComponentProps<typeof PackageTable> = {
-    isUpload: true,
-    packagesToShow: [
-      {
-        difference: "delete",
-        packageName: "name",
-        packageVersion: "version",
-      },
-    ],
-    search: "search",
-    selectedPackages: [0],
-    setSelectedPackages: () => undefined,
-  };
-
-  it("should toggle all packages", async () => {
-    render(<PackageTable {...props} />);
-
-    await userEvent.click(screen.getByRole("checkbox", { name: "Toggle all" }));
-    await userEvent.click(screen.getByRole("checkbox", { name: "Toggle all" }));
-  });
-
-  it("should toggle one package", async () => {
-    render(<PackageTable {...props} />);
-
-    await userEvent.click(screen.getByRole("checkbox", { name: "name" }));
-    await userEvent.click(screen.getByRole("checkbox", { name: "name" }));
-  });
-
-  it("should render without upload controls", () => {
-    render(<PackageTable {...props} isUpload={false} />);
-  });
-});
diff --git a/src/features/mirrors/components/PackageTable/PackageTable.tsx b/src/features/mirrors/components/PackageTable/PackageTable.tsx
deleted file mode 100644
index b5b3f8640..000000000
--- a/src/features/mirrors/components/PackageTable/PackageTable.tsx
+++ /dev/null
@@ -1,125 +0,0 @@
-import {
-  CheckboxInput,
-  ModularTable,
-  Tooltip,
-} from "@canonical/react-components";
-import type { Dispatch, ReactNode, SetStateAction } from "react";
-import { useMemo, type FC } from "react";
-import type { CellProps, Column, HeaderProps } from "react-table";
-import type { FormattedPackage } from "../../types/FormattedPackage";
-import classes from "./PackageTable.module.scss";
-
-interface PackageTableProps {
-  readonly isUpload: boolean;
-  readonly packagesToShow: FormattedPackage[];
-  readonly search: string;
-  readonly selectedPackages: number[];
-  readonly setSelectedPackages: Dispatch<SetStateAction<number[]>>;
-}
-
-const PackageTable: FC<PackageTableProps> = ({
-  isUpload,
-  packagesToShow,
-  search,
-  selectedPackages,
-  setSelectedPackages,
-}) => {
-  const columns = useMemo<Column<FormattedPackage>[]>(
-    () => [
-      {
-        accessor: "packageName",
-        Header: ({ rows }: HeaderProps<FormattedPackage>): ReactNode =>
-          isUpload ? (
-            <>
-              <CheckboxInput
-                inline
-                label={<span className="u-off-screen">Toggle all</span>}
-                disabled={!rows.length}
-                indeterminate={
-                  !!selectedPackages.length &&
-                  selectedPackages.length < rows.length
-                }
-                checked={
-                  selectedPackages.length === rows.length &&
-                  !!selectedPackages.length
-                }
-                onChange={() => {
-                  setSelectedPackages((prevState) =>
-                    prevState.length ? [] : rows.map((_, index) => index),
-                  );
-                }}
-              />
-              <span>Package</span>
-            </>
-          ) : (
-            "Package"
-          ),
-        Cell: ({ row }: CellProps<FormattedPackage>): ReactNode =>
-          isUpload ? (
-            <CheckboxInput
-              inline
-              label={row.original.packageName}
-              checked={selectedPackages.includes(row.index)}
-              onChange={() => {
-                setSelectedPackages((prevState) =>
-                  prevState.includes(row.index)
-                    ? prevState.filter(
-                        (selectedPackage) => selectedPackage !== row.index,
-                      )
-                    : [...prevState, row.index],
-                );
-              }}
-            />
-          ) : (
-            row.original.packageName
-          ),
-      },
-      {
-        accessor: "packageVersion",
-        Header: "Version",
-        getCellIcon: ({ row }: CellProps<FormattedPackage>): string | false =>
-          row.original.difference ? "warning" : false,
-        className: classes.version,
-        Cell: ({ row }: CellProps<FormattedPackage>): ReactNode =>
-          row.original.difference ? (
-            <Tooltip
-              position="top-center"
-              message={
-                "delete" === row.original.difference
-                  ? "Package deleted"
-                  : `Version differs\nfrom parent pocket.\nParent version:\n${row.original.newVersion}`
-              }
-            >
-              <span>{row.original.packageVersion}</span>
-            </Tooltip>
-          ) : (
-            row.original.packageVersion
-          ),
-      },
-    ],
-    [packagesToShow, selectedPackages.length],
-  );
-
-  return (
-    <ModularTable
-      columns={columns}
-      data={packagesToShow}
-      emptyMsg={
-        search ? `No packages found with the search: "${search}".` : undefined
-      }
-      className={classes.content}
-      getCellProps={({ column }) => {
-        switch (column.id) {
-          case "packageName":
-            return { role: "rowheader" };
-          case "packageVersion":
-            return { "aria-label": "Version" };
-          default:
-            return {};
-        }
-      }}
-    />
-  );
-};
-
-export default PackageTable;
diff --git a/src/features/mirrors/components/PackageTable/index.ts b/src/features/mirrors/components/PackageTable/index.ts
deleted file mode 100644
index 55f61deeb..000000000
--- a/src/features/mirrors/components/PackageTable/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./PackageTable";
diff --git a/src/features/mirrors/components/PocketSyncActivity/PocketSyncActivity.module.scss b/src/features/mirrors/components/PocketSyncActivity/PocketSyncActivity.module.scss
deleted file mode 100644
index 2340463d0..000000000
--- a/src/features/mirrors/components/PocketSyncActivity/PocketSyncActivity.module.scss
+++ /dev/null
@@ -1,33 +0,0 @@
-@import "vanilla-framework/scss/settings_colors";
-@import "vanilla-framework/scss/settings_placeholders";
-@import "vanilla-framework/scss/settings_spacing";
-
-.progressContainer {
-  align-items: center;
-  column-gap: $sph--large;
-  display: flex;
-}
-
-.progress {
-  flex: 0 0 $sp-xx-large;
-}
-
-.progressBarContainer {
-  background-color: #d6e4ec;
-  border: $border;
-  border-radius: $sp-xxxx-large;
-  display: inline-block;
-  flex-grow: 1;
-  max-width: 5.5rem;
-  overflow: hidden;
-}
-
-.progressBar {
-  background-color: $color-link;
-  border-radius: $sp-xx-small;
-  height: $spv--small;
-}
-
-.iconContainer {
-  margin-left: -$sph--small;
-}
diff --git a/src/features/mirrors/components/PocketSyncActivity/PocketSyncActivity.test.tsx b/src/features/mirrors/components/PocketSyncActivity/PocketSyncActivity.test.tsx
deleted file mode 100644
index be62d8935..000000000
--- a/src/features/mirrors/components/PocketSyncActivity/PocketSyncActivity.test.tsx
+++ /dev/null
@@ -1,122 +0,0 @@
-import { NO_DATA_TEXT } from "@/components/layout/NoData";
-import { DISPLAY_DATE_TIME_FORMAT, NOT_AVAILABLE } from "@/constants";
-import { ACTIVITY_STATUSES } from "@/features/activities";
-import { pockets } from "@/tests/mocks/pockets";
-import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
-import moment from "moment";
-import type { ComponentProps } from "react";
-import { describe, expect, vi } from "vitest";
-import type { MirrorPocket, PullPocket } from "../../types/Pocket";
-import PocketSyncActivity from "./PocketSyncActivity";
-
-const commonProps = {
-  syncPocketRefs: [],
-  syncPocketRefAdd: vi.fn(),
-};
-
-const uploadPocket = pockets.find((p) => p.mode === "upload");
-assert(uploadPocket);
-const propsWithUploadPocket: ComponentProps<typeof PocketSyncActivity> = {
-  ...commonProps,
-  pocket: uploadPocket,
-};
-
-const pocketWithNoLastSyncStatus = pockets.find(
-  (p) => p.mode !== "upload" && !p.last_sync_status,
-);
-assert(pocketWithNoLastSyncStatus);
-const propsWithNoLastSyncStatus: ComponentProps<typeof PocketSyncActivity> = {
-  ...commonProps,
-  pocket: pocketWithNoLastSyncStatus,
-};
-
-const pocketWithScynedLastSyncStatus = pockets.find(
-  (p) => p.mode !== "upload" && p.last_sync_time,
-);
-assert(pocketWithScynedLastSyncStatus);
-const propsWithSyncedLastSyncStatus: ComponentProps<typeof PocketSyncActivity> =
-  {
-    ...commonProps,
-    pocket: pocketWithScynedLastSyncStatus,
-  };
-
-const pocketWithInProgressLastSyncStatus = pockets.find(
-  (p) =>
-    p.mode !== "upload" &&
-    p.last_sync_status === "in progress" &&
-    p.last_sync_activity !== null,
-);
-assert(pocketWithInProgressLastSyncStatus);
-const propsWithInProgressLastSyncStatus: ComponentProps<
-  typeof PocketSyncActivity
-> = {
-  ...commonProps,
-  pocket: pocketWithInProgressLastSyncStatus,
-};
-
-const mirrorPocket = pockets.find((p) => p.mode === "mirror");
-assert(mirrorPocket);
-const propsWithMirrorPocket: ComponentProps<typeof PocketSyncActivity> = {
-  ...commonProps,
-  pocket: mirrorPocket,
-};
-
-describe("PocketSyncActivity", () => {
-  it("renders upload pocket", () => {
-    renderWithProviders(<PocketSyncActivity {...propsWithUploadPocket} />);
-    expect(screen.getByText(NOT_AVAILABLE)).toBeVisible();
-  });
-
-  it("renders pocket with no last sync status", () => {
-    renderWithProviders(<PocketSyncActivity {...propsWithNoLastSyncStatus} />);
-
-    expect(screen.getByText(NO_DATA_TEXT)).toBeVisible();
-  });
-
-  it("renders pocket with synced last sync status", () => {
-    renderWithProviders(
-      <PocketSyncActivity {...propsWithSyncedLastSyncStatus} />,
-    );
-
-    expect(
-      screen.getByText(
-        moment(
-          (propsWithSyncedLastSyncStatus.pocket as MirrorPocket | PullPocket)
-            .last_sync_time,
-        ).format(DISPLAY_DATE_TIME_FORMAT),
-      ),
-    ).toBeVisible();
-  });
-
-  it("renders pocket with in progress last sync status", () => {
-    renderWithProviders(
-      <PocketSyncActivity {...propsWithInProgressLastSyncStatus} />,
-    );
-
-    expect(
-      screen.getByText(
-        `${
-          (
-            propsWithInProgressLastSyncStatus.pocket as
-              | MirrorPocket
-              | PullPocket
-          ).last_sync_activity?.progress
-        }%`,
-      ),
-    ).toBeVisible();
-  });
-
-  it("renders pocket activity status", () => {
-    renderWithProviders(<PocketSyncActivity {...propsWithMirrorPocket} />);
-
-    const pocket = propsWithMirrorPocket.pocket as MirrorPocket;
-
-    const key =
-      pocket.last_sync_status === "queued"
-        ? "undelivered"
-        : (pocket.last_sync_status as "canceled" | "failed" | "undelivered");
-
-    expect(screen.getByText(ACTIVITY_STATUSES[key].label)).toBeVisible();
-  });
-});
diff --git a/src/features/mirrors/components/PocketSyncActivity/PocketSyncActivity.tsx b/src/features/mirrors/components/PocketSyncActivity/PocketSyncActivity.tsx
deleted file mode 100644
index 9db27f263..000000000
--- a/src/features/mirrors/components/PocketSyncActivity/PocketSyncActivity.tsx
+++ /dev/null
@@ -1,115 +0,0 @@
-import NoData from "@/components/layout/NoData";
-import { DISPLAY_DATE_TIME_FORMAT, NOT_AVAILABLE } from "@/constants";
-import { ACTIVITY_STATUSES, ActivityDetails } from "@/features/activities";
-import useSidePanel from "@/hooks/useSidePanel";
-import { Button, Icon } from "@canonical/react-components";
-import classNames from "classnames";
-import moment from "moment";
-import type { FC } from "react";
-import { useEffect } from "react";
-import { useMediaQuery } from "usehooks-ts";
-import type { Pocket, SyncPocketRef } from "../../types";
-import { getLastSyncStatusIcon } from "./helpers";
-import classes from "./PocketSyncActivity.module.scss";
-
-interface PocketSyncActivityProps {
-  readonly pocket: Pocket;
-  readonly syncPocketRefAdd: (ref: SyncPocketRef) => void;
-  readonly syncPocketRefs: SyncPocketRef[];
-}
-
-const PocketSyncActivity: FC<PocketSyncActivityProps> = ({
-  pocket,
-  syncPocketRefAdd,
-  syncPocketRefs,
-}) => {
-  const isLargerScreen = useMediaQuery("(min-width: 620px)");
-  const { setSidePanelContent } = useSidePanel();
-
-  useEffect(() => {
-    if (
-      pocket.mode === "upload" ||
-      pocket.last_sync_status !== "in progress" ||
-      syncPocketRefs.some(
-        ({ distributionName }) => distributionName === pocket.distribution.name,
-      )
-    ) {
-      return;
-    }
-
-    syncPocketRefAdd({
-      distributionName: pocket.distribution.name,
-      seriesName: pocket.series.name,
-      pocketName: pocket.name,
-    });
-  }, [pocket, syncPocketRefs]);
-
-  if (pocket.mode === "upload") {
-    return NOT_AVAILABLE;
-  }
-
-  if (!pocket.last_sync_status) {
-    return <NoData />;
-  }
-
-  if (pocket.last_sync_status === "synced") {
-    return (
-      <span className="font-monospace">
-        {moment(pocket.last_sync_time).format(DISPLAY_DATE_TIME_FORMAT)}
-      </span>
-    );
-  }
-
-  if (pocket.last_sync_status === "in progress") {
-    return (
-      <div className={classes.progressContainer}>
-        {isLargerScreen && (
-          <div className={classes.progressBarContainer}>
-            <div
-              className={classes.progressBar}
-              style={{
-                width: `${pocket.last_sync_activity.progress}%`,
-              }}
-            />
-          </div>
-        )}
-        <span
-          className={classes.progress}
-        >{`${pocket.last_sync_activity.progress}%`}</span>
-      </div>
-    );
-  }
-
-  const key =
-    pocket.last_sync_status === "queued"
-      ? "undelivered"
-      : pocket.last_sync_status;
-
-  const handleActivityClick = (): void => {
-    setSidePanelContent(
-      pocket.last_sync_activity.summary,
-      <ActivityDetails activityId={pocket.last_sync_activity.id} />,
-    );
-  };
-
-  return (
-    <div
-      className={classNames(
-        "p-table__cell--icon-placeholder",
-        classes.iconContainer,
-      )}
-    >
-      <Icon name={getLastSyncStatusIcon(pocket.last_sync_status)} />
-      <Button
-        type="button"
-        appearance="link"
-        className="u-no-margin--bottom u-no-padding--top"
-        onClick={handleActivityClick}
-      >
-        {ACTIVITY_STATUSES[key].label}
-      </Button>
-    </div>
-  );
-};
-
-export default PocketSyncActivity;
diff --git a/src/features/mirrors/components/PocketSyncActivity/helpers.ts b/src/features/mirrors/components/PocketSyncActivity/helpers.ts
deleted file mode 100644
index 32292be9e..000000000
--- a/src/features/mirrors/components/PocketSyncActivity/helpers.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { ACTIVITY_STATUSES } from "@/features/activities";
-import type { PocketLastSyncProps } from "../../types";
-
-export const getLastSyncStatusIcon = (
-  status: PocketLastSyncProps["last_sync_status"],
-): string => {
-  if (!status || status === "synced" || status === "in progress") {
-    return "";
-  }
-
-  const key = status === "queued" ? "undelivered" : status;
-
-  return ACTIVITY_STATUSES[key].icon;
-};
diff --git a/src/features/mirrors/components/PocketSyncActivity/index.ts b/src/features/mirrors/components/PocketSyncActivity/index.ts
deleted file mode 100644
index a55288f8a..000000000
--- a/src/features/mirrors/components/PocketSyncActivity/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./PocketSyncActivity";
diff --git a/src/features/mirrors/components/PublishMirrorForm/PublishMirrorForm.tsx b/src/features/mirrors/components/PublishMirrorForm/PublishMirrorForm.tsx
new file mode 100644
index 000000000..e511bebe2
--- /dev/null
+++ b/src/features/mirrors/components/PublishMirrorForm/PublishMirrorForm.tsx
@@ -0,0 +1,74 @@
+import type { FC } from "react";
+import SidePanel from "@/components/layout/SidePanel/SidePanel";
+import usePageParams from "@/hooks/usePageParams";
+import { useGetMirror } from "../../api";
+import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
+import Blocks from "@/components/layout/Blocks";
+import RadioGroup from "@/components/form/RadioGroup";
+import { useFormik } from "formik";
+import type { FormProps } from "./types";
+import useDebug from "@/hooks/useDebug";
+import useNotify from "@/hooks/useNotify";
+
+const PublishMirrorForm: FC = () => {
+  const debug = useDebug();
+  const { notify } = useNotify();
+  const { name, sidePath, popSidePath, createPageParamsSetter } =
+    usePageParams();
+
+  const mirror = useGetMirror(name).data.data;
+
+  const close = createPageParamsSetter({ sidePath: [], name: "" });
+
+  const formik = useFormik<FormProps>({
+    initialValues: {
+      publishTo: "new-publication",
+    },
+    onSubmit: async (values) => {
+      try {
+        close();
+
+        switch (values.publishTo) {
+          case "new-publication":
+            notify.success({
+              title: `You have marked ${mirror.displayName} to be published.`,
+              message:
+                "A publication has been created and an activity has been queued to publish it to the designated target.",
+            });
+            break;
+
+          case "existing-publication":
+            notify.success({
+              title: `You have marked ${mirror.displayName} to be published.`,
+              message:
+                "The mirror will be added to the publication and an activity has been queued to publish it to the designated target.",
+            });
+            break;
+        }
+      } catch (error) {
+        debug(error);
+      }
+    },
+  });
+
+  return (
+    <>
+      <SidePanel.Header>Publish {mirror.displayName}</SidePanel.Header>
+      <SidePanel.Content>
+        <Blocks>
+          <Blocks.Item>
+            <RadioGroup field="publishTo" formik={formik} label="Publish to" />
+          </Blocks.Item>
+        </Blocks>
+        <SidePanelFormButtons
+          submitButtonText="Publish mirror"
+          onCancel={close}
+          hasBackButton={sidePath.length > 1}
+          onBackButtonPress={popSidePath}
+        />
+      </SidePanel.Content>
+    </>
+  );
+};
+
+export default PublishMirrorForm;
diff --git a/src/features/mirrors/components/PublishMirrorForm/index.ts b/src/features/mirrors/components/PublishMirrorForm/index.ts
new file mode 100644
index 000000000..85309dd10
--- /dev/null
+++ b/src/features/mirrors/components/PublishMirrorForm/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublishMirrorForm";
diff --git a/src/features/mirrors/components/PublishMirrorForm/types.ts b/src/features/mirrors/components/PublishMirrorForm/types.ts
new file mode 100644
index 000000000..60a5ec55e
--- /dev/null
+++ b/src/features/mirrors/components/PublishMirrorForm/types.ts
@@ -0,0 +1,3 @@
+export interface FormProps {
+  publishTo: "new-publication" | "existing-publication";
+}
diff --git a/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.tsx b/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.tsx
new file mode 100644
index 000000000..a7c34dc4d
--- /dev/null
+++ b/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.tsx
@@ -0,0 +1,92 @@
+import useDebug from "@/hooks/useDebug";
+import { ConfirmationModal, Icon } from "@canonical/react-components";
+import type { FC } from "react";
+import { useDeleteMirror, useListPublications } from "../../api";
+import useNotify from "@/hooks/useNotify";
+import MirrorPublicationsList from "../MirrorPublicationsList";
+import usePageParams from "@/hooks/usePageParams";
+
+interface RemoveMirrorModalProps {
+  readonly close: () => void;
+  readonly isOpen: boolean;
+  readonly mirrorDisplayName: string;
+  readonly mirrorName: string;
+}
+
+const RemoveMirrorModal: FC<RemoveMirrorModalProps> = ({
+  close,
+  isOpen,
+  mirrorDisplayName,
+  mirrorName,
+}) => {
+  const debug = useDebug();
+  const { notify } = useNotify();
+  const { setPageParams } = usePageParams();
+
+  const { publications = [] } = useListPublications({
+    filter: `source="${mirrorName}"`,
+    pageSize: 1000,
+  }).data.data;
+
+  const { mutateAsync: deleteMirror, isPending: isDeletingMirror } =
+    useDeleteMirror();
+
+  if (!isOpen) {
+    return;
+  }
+
+  const tryRemoveMirror = async () => {
+    try {
+      await deleteMirror({
+        mirrorName,
+      });
+
+      setPageParams({ sidePath: [], name: "" });
+      close();
+
+      notify.success({
+        title: `You have successfully removed ${mirrorDisplayName}.`,
+        message: "The mirror has been removed from Landscape.",
+      });
+    } catch (error) {
+      debug(error);
+    }
+  };
+
+  return (
+    <ConfirmationModal
+      confirmButtonLabel={
+        <>
+          <Icon name="delete" light />
+          <span>Remove mirror</span>
+        </>
+      }
+      onConfirm={tryRemoveMirror}
+      confirmButtonAppearance="negative"
+      title={`Remove ${mirrorDisplayName}`}
+      close={close}
+      confirmButtonLoading={isDeletingMirror}
+      renderInPortal
+    >
+      {publications.length ? (
+        <>
+          <p>This mirror is associated with the following publications:</p>
+          <MirrorPublicationsList publications={publications} />
+          <p>
+            After removal you won’t be able to update any of these publications,
+            but they will continue to be available.{" "}
+            <strong>This action is irreversible.</strong>
+          </p>
+        </>
+      ) : (
+        <p>
+          This action will remove the mirror from Landscape and it won’t be
+          available to be published in the future.{" "}
+          <strong>This action is irreversible.</strong>
+        </p>
+      )}
+    </ConfirmationModal>
+  );
+};
+
+export default RemoveMirrorModal;
diff --git a/src/features/mirrors/components/RemoveMirrorModal/index.ts b/src/features/mirrors/components/RemoveMirrorModal/index.ts
new file mode 100644
index 000000000..1d8949640
--- /dev/null
+++ b/src/features/mirrors/components/RemoveMirrorModal/index.ts
@@ -0,0 +1 @@
+export { default } from "./RemoveMirrorModal";
diff --git a/src/features/mirrors/components/SelectableMirrorContentsBlock/SelectableMirrorContentsBlock.tsx b/src/features/mirrors/components/SelectableMirrorContentsBlock/SelectableMirrorContentsBlock.tsx
new file mode 100644
index 000000000..4b49bcb76
--- /dev/null
+++ b/src/features/mirrors/components/SelectableMirrorContentsBlock/SelectableMirrorContentsBlock.tsx
@@ -0,0 +1,138 @@
+import MultiSelectField from "@/components/form/MultiSelectField";
+import type { SelectOption } from "@/types/SelectOption";
+import { Select } from "@canonical/react-components";
+import type { FormikContextType } from "formik";
+import type { FC } from "react";
+import type { FormProps, ThirdPartyFormProps } from "../AddMirrorForm/types";
+import type { UbuntuArchiveInfo } from "../../types";
+import { getFormikError } from "@/utils/formikErrors";
+import { hasOneItem } from "@/utils/_helpers";
+import ReadOnlyField from "@/components/form/ReadOnlyField";
+import { isDistributionValid } from "../../helpers";
+
+interface SelectableMirrorContentsBlockProps {
+  readonly formik: FormikContextType<Exclude<FormProps, ThirdPartyFormProps>>;
+  readonly ubuntuArchiveInfo: UbuntuArchiveInfo;
+  readonly ubuntuEsmInfo: UbuntuArchiveInfo[];
+}
+
+const SelectableMirrorContentsBlock: FC<SelectableMirrorContentsBlockProps> = ({
+  formik,
+  ubuntuArchiveInfo,
+  ubuntuEsmInfo,
+}) => {
+  const getDistributions = () => {
+    switch (formik.values.sourceType) {
+      case "ubuntu-archive":
+      case "ubuntu-snapshots": {
+        return ubuntuArchiveInfo.distributions;
+      }
+
+      case "ubuntu-pro": {
+        const proService = ubuntuEsmInfo.find(
+          ({ mirror_type }) => mirror_type === formik.values.proService,
+        );
+
+        return proService ? proService.distributions : [];
+      }
+    }
+  };
+
+  const distributions = getDistributions();
+
+  const distributionOptions: SelectOption[] = distributions.map(
+    (distribution) => ({
+      label: distribution.label,
+      value: distribution.slug,
+      disabled: !isDistributionValid(distribution),
+    }),
+  );
+
+  const componentOptions: SelectOption[] =
+    distributions
+      .find(({ slug }) => slug === formik.values.distribution)
+      ?.components.map((component) => ({
+        label: component.slug,
+        value: component.slug,
+      })) ?? [];
+
+  const architectureOptions: SelectOption[] =
+    distributions
+      .find(({ slug }) => slug === formik.values.distribution)
+      ?.architectures.map((architecture) => ({
+        label: architecture.slug,
+        value: architecture.slug,
+      })) ?? [];
+
+  return (
+    <>
+      {hasOneItem(distributionOptions) ? (
+        <ReadOnlyField
+          label="Distribution"
+          value={distributionOptions[0].label}
+          tooltipMessage="This source only has one distribution."
+        />
+      ) : (
+        <Select
+          label="Distribution"
+          required
+          options={distributionOptions}
+          {...formik.getFieldProps("distribution")}
+          error={getFormikError(formik, "distribution")}
+        />
+      )}
+      {hasOneItem(componentOptions) ? (
+        <ReadOnlyField
+          label="Components"
+          value={componentOptions[0].label}
+          tooltipMessage="This distribution only has one component."
+        />
+      ) : (
+        <MultiSelectField
+          variant="condensed"
+          hasSelectedItemsFirst={false}
+          label="Components"
+          {...formik.getFieldProps("components")}
+          items={componentOptions}
+          selectedItems={componentOptions.filter(({ value }) =>
+            formik.values.components?.includes(value),
+          )}
+          onItemsUpdate={async (items) =>
+            formik.setFieldValue(
+              "components",
+              items.map(({ value }) => value),
+            )
+          }
+          required
+        />
+      )}
+      {hasOneItem(architectureOptions) ? (
+        <ReadOnlyField
+          label="Architectures"
+          value={architectureOptions[0].label}
+          tooltipMessage="This distribution only has one architecture."
+        />
+      ) : (
+        <MultiSelectField
+          variant="condensed"
+          hasSelectedItemsFirst={false}
+          label="Architectures"
+          {...formik.getFieldProps("architectures")}
+          items={architectureOptions}
+          selectedItems={architectureOptions.filter(({ value }) =>
+            formik.values.architectures?.includes(value),
+          )}
+          onItemsUpdate={async (items) =>
+            formik.setFieldValue(
+              "architectures",
+              items.map(({ value }) => value),
+            )
+          }
+          required
+        />
+      )}
+    </>
+  );
+};
+
+export default SelectableMirrorContentsBlock;
diff --git a/src/features/mirrors/components/SelectableMirrorContentsBlock/index.ts b/src/features/mirrors/components/SelectableMirrorContentsBlock/index.ts
new file mode 100644
index 000000000..4696d2570
--- /dev/null
+++ b/src/features/mirrors/components/SelectableMirrorContentsBlock/index.ts
@@ -0,0 +1 @@
+export { default } from "./SelectableMirrorContentsBlock";
diff --git a/src/features/mirrors/components/SeriesCard/SeriesCard.test.tsx b/src/features/mirrors/components/SeriesCard/SeriesCard.test.tsx
deleted file mode 100644
index bb407bb86..000000000
--- a/src/features/mirrors/components/SeriesCard/SeriesCard.test.tsx
+++ /dev/null
@@ -1,130 +0,0 @@
-import { resetScreenSize, setScreenSize } from "@/tests/helpers";
-import { distributions } from "@/tests/mocks/distributions";
-import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import type { ComponentProps } from "react";
-import { describe, expect, it, vi } from "vitest";
-import { DEFAULT_SNAPSHOT_URI } from "../../constants";
-import type { Distribution } from "../../types";
-import SeriesCard from "./SeriesCard";
-
-const checkModalActions = async ({
-  isLarge,
-  distributionName,
-  seriesName,
-}: {
-  isLarge: boolean;
-  distributionName: string;
-  seriesName: string;
-}) => {
-  if (!isLarge) {
-    const actionsButton = screen.getByText(/actions/i);
-    await userEvent.click(actionsButton);
-  }
-  const deriveSeriesButton = await screen.findByRole("button", {
-    name: /derive series/i,
-  });
-  expect(deriveSeriesButton).toBeVisible();
-  await userEvent.click(deriveSeriesButton);
-
-  const deriveSeriesFormHeaderText = await screen.findByRole("heading", {
-    name: /derive series/i,
-  });
-  expect(deriveSeriesFormHeaderText).toBeVisible();
-  await userEvent.click(
-    screen.getByRole("button", { name: /close side panel/i }),
-  );
-
-  if (!isLarge) {
-    const actionsButton = screen.getByText(/actions/i);
-    await userEvent.click(actionsButton);
-  }
-
-  const newPocketButton = await screen.findByRole("button", {
-    name: /new pocket/i,
-  });
-  expect(newPocketButton).toBeVisible();
-
-  const removeButton = screen.getByRole("button", {
-    name: `Remove ${distributionName}/${seriesName}`,
-  });
-  expect(removeButton).toBeVisible();
-
-  await userEvent.click(removeButton);
-
-  expect(
-    screen.getByText("Are you sure? This action cannot be undone."),
-  ).toBeVisible();
-
-  const cancelButton = screen.getByRole("button", {
-    name: /cancel/i,
-  });
-  expect(cancelButton).toBeVisible();
-
-  await userEvent.click(cancelButton);
-};
-
-const findDistributionWithoutSnapshot = (): Distribution => {
-  const dist = distributions.find((d) =>
-    d.series.some((s) =>
-      s.pockets.every(
-        (p) =>
-          p.mode !== "mirror" ||
-          (p.mode === "mirror" &&
-            !p.mirror_uri.startsWith(DEFAULT_SNAPSHOT_URI)),
-      ),
-    ),
-  );
-  assert(dist);
-  return dist;
-};
-
-const distributionWithoutSnapshot = findDistributionWithoutSnapshot();
-
-const seriesWithoutSnapshot = distributionWithoutSnapshot.series.find((s) =>
-  s.pockets.some(
-    (p) =>
-      p.mode === "mirror" && !p.mirror_uri.startsWith(DEFAULT_SNAPSHOT_URI),
-  ),
-);
-assert(seriesWithoutSnapshot);
-
-const propsWithoutSnapshotDate: ComponentProps<typeof SeriesCard> = {
-  distribution: distributionWithoutSnapshot,
-  series: seriesWithoutSnapshot,
-  syncPocketRefAdd: vi.fn(),
-  syncPocketRefs: [],
-};
-
-describe("SeriesCard", () => {
-  afterEach(() => {
-    resetScreenSize();
-  });
-
-  it("renders series card", () => {
-    const { container } = renderWithProviders(
-      <SeriesCard {...propsWithoutSnapshotDate} />,
-    );
-    expect(
-      screen.getByText(propsWithoutSnapshotDate.series.name),
-    ).toBeVisible();
-
-    expect(container).toHaveTexts(["Pocket", "Mode", "Last synced", "Content"]);
-  });
-
-  it("renders series card buttons", async () => {
-    setScreenSize("lg");
-
-    renderWithProviders(<SeriesCard {...propsWithoutSnapshotDate} />);
-    expect(
-      screen.getByText(propsWithoutSnapshotDate.series.name),
-    ).toBeVisible();
-
-    await checkModalActions({
-      isLarge: true,
-      distributionName: propsWithoutSnapshotDate.distribution.name,
-      seriesName: propsWithoutSnapshotDate.series.name,
-    });
-  });
-});
diff --git a/src/features/mirrors/components/SeriesCard/SeriesCard.tsx b/src/features/mirrors/components/SeriesCard/SeriesCard.tsx
deleted file mode 100644
index c4f982be1..000000000
--- a/src/features/mirrors/components/SeriesCard/SeriesCard.tsx
+++ /dev/null
@@ -1,230 +0,0 @@
-import LoadingState from "@/components/layout/LoadingState";
-import { DISPLAY_DATE_FORMAT } from "@/constants";
-import useDebug from "@/hooks/useDebug";
-import useSidePanel from "@/hooks/useSidePanel";
-import type { MenuLink } from "@canonical/react-components";
-import {
-  Button,
-  ConfirmationButton,
-  ConfirmationModal,
-  ContextualMenu,
-} from "@canonical/react-components";
-import classNames from "classnames";
-import moment from "moment";
-import type { FC } from "react";
-import { lazy, Suspense, useEffect, useState } from "react";
-import { useMediaQuery } from "usehooks-ts";
-import { DEFAULT_SNAPSHOT_URI } from "../../constants";
-import { useSeries } from "../../hooks";
-import type { Distribution, Series, SyncPocketRef } from "../../types";
-import SeriesPocketList from "../SeriesPocketList";
-import classes from "./SeriesCard.module.scss";
-
-const NewPocketForm = lazy(async () => import("../NewPocketForm"));
-
-const DeriveSeriesForm = lazy(async () => import("../DeriveSeriesForm"));
-
-interface SeriesCardProps {
-  readonly distribution: Distribution;
-  readonly series: Series;
-  readonly syncPocketRefAdd: (ref: SyncPocketRef) => void;
-  readonly syncPocketRefs: SyncPocketRef[];
-}
-
-const SeriesCard: FC<SeriesCardProps> = ({
-  distribution,
-  series,
-  syncPocketRefAdd,
-  syncPocketRefs,
-}) => {
-  const [modalOpen, setModalOpen] = useState(false);
-  const [snapshotDate, setSnapshotDate] = useState("");
-
-  useEffect(() => {
-    const [pocket] = series.pockets;
-
-    if (
-      !pocket ||
-      pocket.mode !== "mirror" ||
-      !pocket.mirror_uri.startsWith(DEFAULT_SNAPSHOT_URI)
-    ) {
-      return;
-    }
-
-    setSnapshotDate(pocket.mirror_uri.replace(/^.*\/(\d{8})T\d{6}Z$/, "$1"));
-  }, [series]);
-
-  const isLargeScreen = useMediaQuery("(min-width: 620px)");
-  const { setSidePanelContent } = useSidePanel();
-  const { removeSeriesQuery } = useSeries();
-  const debug = useDebug();
-
-  const { mutateAsync: removeSeries, isPending: isRemoving } =
-    removeSeriesQuery;
-
-  const handleCloseModal = (): void => {
-    setModalOpen(false);
-  };
-
-  const handleRemoveSeries = async (): Promise<void> => {
-    try {
-      await removeSeries({
-        name: series.name,
-        distribution: distribution.name,
-      });
-    } catch (error) {
-      debug(error);
-    } finally {
-      handleCloseModal();
-    }
-  };
-
-  const handleOpenModal = (): void => {
-    setModalOpen(true);
-  };
-
-  const handleDeriveSeries = (): void => {
-    setSidePanelContent(
-      "Derive series",
-      <Suspense fallback={<LoadingState />}>
-        <DeriveSeriesForm distribution={distribution} origin={series.name} />
-      </Suspense>,
-    );
-  };
-
-  const handleAddPocket = (): void => {
-    setSidePanelContent(
-      `New pocket for ${series.name}`,
-      <Suspense fallback={<LoadingState />}>
-        <NewPocketForm distribution={distribution} series={series} />
-      </Suspense>,
-    );
-  };
-
-  const actionButtons = [
-    {
-      label: "Derive series",
-      ariaLabel: `Derive series ${distribution.name}/${series.name}`,
-      onClick: handleDeriveSeries,
-    },
-    {
-      label: "New pocket",
-      ariaLabel: `Add new pocket for ${distribution.name}/${series.name}`,
-      onClick: handleAddPocket,
-    },
-  ];
-
-  const modalButton = {
-    label: "Remove",
-    ariaLabel: `Remove ${distribution.name}/${series.name}`,
-    appearance: "negative",
-    modalTitle: "Remove series",
-    modalBody: <p>Are you sure? This action cannot be undone.</p>,
-    isLoading: isRemoving,
-    onClick: handleOpenModal,
-    onConfirm: handleRemoveSeries,
-  };
-
-  const buttons = [...actionButtons, modalButton];
-
-  const largeScreenActionButtons = actionButtons.map((item) => (
-    <Button
-      key={`${item.label}-button`}
-      type="button"
-      className="is-small"
-      aria-label={item.ariaLabel}
-      onMouseDown={(event) => {
-        event.preventDefault();
-      }}
-      onClick={item.onClick}
-    >
-      {item.label}
-    </Button>
-  ));
-
-  const largeScreenButtons = [
-    ...largeScreenActionButtons,
-    <ConfirmationButton
-      key={`${modalButton.label}-button`}
-      type="button"
-      className="is-small"
-      aria-label={modalButton.ariaLabel}
-      confirmationModalProps={{
-        title: modalButton.modalTitle,
-        children: modalButton.modalBody,
-        confirmButtonLabel: modalButton.label,
-        confirmButtonAppearance: modalButton.appearance,
-        confirmButtonLoading: modalButton.isLoading,
-        confirmButtonDisabled: modalButton.isLoading,
-        onConfirm: modalButton.onConfirm,
-      }}
-    >
-      {modalButton.label}
-    </ConfirmationButton>,
-  ];
-
-  const contextualMenuLinks: MenuLink[] = buttons
-    .map((item) => ({
-      children: item.label,
-      "aria-label": item.ariaLabel,
-      onClick: item.onClick,
-    }))
-    .filter(
-      (link) =>
-        !(
-          snapshotDate &&
-          (link.children === "Derive series" || link.children === "New pocket")
-        ),
-    );
-
-  return (
-    <>
-      <div className={classes.card}>
-        <div className={classes.header}>
-          <h3 className={classes.title}>{series.name}</h3>
-          {!!snapshotDate && (
-            <span
-              className={classNames("u-text--muted", classes.snapshot)}
-            >{`Snapshot from ${moment(snapshotDate).format(
-              DISPLAY_DATE_FORMAT,
-            )}`}</span>
-          )}
-          {isLargeScreen ? (
-            <div className={classes.cta}>{largeScreenButtons}</div>
-          ) : (
-            <ContextualMenu
-              position="left"
-              hasToggleIcon
-              toggleLabel="Actions"
-              toggleClassName="u-no-margin--bottom"
-              links={contextualMenuLinks}
-            />
-          )}
-        </div>
-        <div className={classes.content}>
-          <SeriesPocketList
-            distributionName={distribution.name}
-            series={series}
-            syncPocketRefAdd={syncPocketRefAdd}
-            syncPocketRefs={syncPocketRefs}
-          />
-        </div>
-      </div>
-      {modalOpen && (
-        <ConfirmationModal
-          title={modalButton.modalTitle}
-          confirmButtonLabel={modalButton.label}
-          close={handleCloseModal}
-          confirmButtonAppearance={modalButton.appearance}
-          confirmButtonLoading={modalButton.isLoading}
-          confirmButtonDisabled={modalButton.isLoading}
-          onConfirm={modalButton.onConfirm}
-        >
-          {modalButton.modalBody}
-        </ConfirmationModal>
-      )}
-    </>
-  );
-};
-
-export default SeriesCard;
diff --git a/src/features/mirrors/components/SeriesCard/index.ts b/src/features/mirrors/components/SeriesCard/index.ts
deleted file mode 100644
index 9774ef21c..000000000
--- a/src/features/mirrors/components/SeriesCard/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export { default } from "./SeriesCard";
-export { default as seriesCardClasses } from "./SeriesCard.module.scss";
diff --git a/src/features/mirrors/components/SeriesPocketDetailsButton/SeriesPocketDetailsButton.test.tsx b/src/features/mirrors/components/SeriesPocketDetailsButton/SeriesPocketDetailsButton.test.tsx
deleted file mode 100644
index 7a2c10126..000000000
--- a/src/features/mirrors/components/SeriesPocketDetailsButton/SeriesPocketDetailsButton.test.tsx
+++ /dev/null
@@ -1,50 +0,0 @@
-import { pockets } from "@/tests/mocks/pockets";
-import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
-import type { ComponentProps } from "react";
-import SeriesPocketDetailsButton from "./SeriesPocketDetailsButton";
-
-const mirrorPocket = pockets.find((p) => p.mode === "mirror");
-assert(mirrorPocket);
-const propsWithMirrorPocket: ComponentProps<typeof SeriesPocketDetailsButton> =
-  {
-    distributionName: "Ubuntu",
-    seriesName: "Focal Fossa",
-    pocket: mirrorPocket,
-  };
-
-const pullPocket = pockets.find((p) => p.mode === "pull");
-assert(pullPocket);
-const propsWithPullPocket: ComponentProps<typeof SeriesPocketDetailsButton> = {
-  distributionName: "Ubuntu",
-  seriesName: "Focal Fossa",
-  pocket: pullPocket,
-};
-
-describe("SeriesPocketDetailsButton", () => {
-  it("renders buttons for mirror pocket", () => {
-    renderWithProviders(
-      <SeriesPocketDetailsButton {...propsWithMirrorPocket} />,
-    );
-
-    expect(
-      screen.getByRole("button", {
-        name: `List ${propsWithMirrorPocket.pocket.name} pocket of ${propsWithMirrorPocket.distributionName}/${propsWithMirrorPocket.seriesName}`,
-      }),
-    ).toBeVisible();
-    const pullingPocketText = screen.queryByText(/pulling from/i);
-    expect(pullingPocketText).not.toBeInTheDocument();
-  });
-
-  it("renders buttons for pull pocket", () => {
-    renderWithProviders(<SeriesPocketDetailsButton {...propsWithPullPocket} />);
-
-    expect(
-      screen.getByRole("button", {
-        name: `List ${propsWithPullPocket.pocket.name} pocket of ${propsWithPullPocket.distributionName}/${propsWithPullPocket.seriesName}`,
-      }),
-    ).toBeVisible();
-    const pullingPocketText = screen.getByText(/pulling from/i);
-    expect(pullingPocketText).toBeVisible();
-  });
-});
diff --git a/src/features/mirrors/components/SeriesPocketDetailsButton/SeriesPocketDetailsButton.tsx b/src/features/mirrors/components/SeriesPocketDetailsButton/SeriesPocketDetailsButton.tsx
deleted file mode 100644
index a54e3a077..000000000
--- a/src/features/mirrors/components/SeriesPocketDetailsButton/SeriesPocketDetailsButton.tsx
+++ /dev/null
@@ -1,54 +0,0 @@
-import LoadingState from "@/components/layout/LoadingState";
-import useSidePanel from "@/hooks/useSidePanel";
-import { Button } from "@canonical/react-components";
-import type { FC } from "react";
-import { lazy, Suspense } from "react";
-import type { Distribution, Pocket, Series } from "../../types";
-
-const PackageList = lazy(async () => import("../PackageList"));
-
-interface SeriesPocketDetailsButtonProps {
-  readonly distributionName: Distribution["name"];
-  readonly pocket: Pocket;
-  readonly seriesName: Series["name"];
-}
-
-const SeriesPocketDetailsButton: FC<SeriesPocketDetailsButtonProps> = ({
-  distributionName,
-  pocket,
-  seriesName,
-}) => {
-  const { setSidePanelContent } = useSidePanel();
-
-  const handleListPocket = (): void => {
-    setSidePanelContent(
-      `${seriesName} ${pocket.name}`,
-      <Suspense fallback={<LoadingState />}>
-        <PackageList
-          distributionName={distributionName}
-          pocket={pocket as Pocket}
-          seriesName={seriesName}
-        />
-      </Suspense>,
-    );
-  };
-
-  return (
-    <>
-      <Button
-        type="button"
-        appearance="link"
-        className="u-no-margin--bottom u-no-padding--top"
-        onClick={handleListPocket}
-        aria-label={`List ${pocket.name} pocket of ${distributionName}/${seriesName}`}
-      >
-        {pocket.name}
-      </Button>
-      {pocket.mode === "pull" && (
-        <p className="p-text--small u-text--muted u-no-margin--bottom">{`pulling from ${pocket.pull_pocket}`}</p>
-      )}
-    </>
-  );
-};
-
-export default SeriesPocketDetailsButton;
diff --git a/src/features/mirrors/components/SeriesPocketDetailsButton/index.ts b/src/features/mirrors/components/SeriesPocketDetailsButton/index.ts
deleted file mode 100644
index a8166dc4c..000000000
--- a/src/features/mirrors/components/SeriesPocketDetailsButton/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./SeriesPocketDetailsButton";
diff --git a/src/features/mirrors/components/SeriesPocketList/SeriesPocketList.test.tsx b/src/features/mirrors/components/SeriesPocketList/SeriesPocketList.test.tsx
deleted file mode 100644
index 5b4d51a87..000000000
--- a/src/features/mirrors/components/SeriesPocketList/SeriesPocketList.test.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { distributions } from "@/tests/mocks/distributions";
-import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
-import type { ComponentProps } from "react";
-import { vi } from "vitest";
-import SeriesPocketList from "./SeriesPocketList";
-
-const series = distributions.find((d) => d.series.length > 0)?.series[0];
-assert(series);
-
-const props: ComponentProps<typeof SeriesPocketList> = {
-  distributionName: "Ubuntu",
-  series,
-  syncPocketRefAdd: vi.fn(),
-  syncPocketRefs: [],
-};
-
-describe("SeriesPocketList", () => {
-  it("renders table series pocket list for big screens", () => {
-    const { container } = renderWithProviders(<SeriesPocketList {...props} />);
-
-    const table = screen.getByRole("table");
-    expect(table).toBeVisible();
-
-    expect(container).toHaveTexts(["Pocket", "Mode", "Last synced", "Content"]);
-  });
-});
diff --git a/src/features/mirrors/components/SeriesPocketList/SeriesPocketList.tsx b/src/features/mirrors/components/SeriesPocketList/SeriesPocketList.tsx
deleted file mode 100644
index c40414bc5..000000000
--- a/src/features/mirrors/components/SeriesPocketList/SeriesPocketList.tsx
+++ /dev/null
@@ -1,93 +0,0 @@
-import { LIST_ACTIONS_COLUMN_PROPS } from "@/components/layout/ListActions";
-import { pluralizeWithCount } from "@/utils/_helpers";
-import type { FC, ReactNode } from "react";
-import { useMemo } from "react";
-import type { CellProps, Column } from "react-table";
-import type { Distribution, Pocket, Series, SyncPocketRef } from "../../types";
-import PocketSyncActivity from "../PocketSyncActivity";
-import SeriesPocketDetailsButton from "../SeriesPocketDetailsButton";
-import SeriesPocketListActions from "../SeriesPocketListActions";
-import { getCellProps } from "./helpers";
-import type { CommonPocket } from "./types";
-import ResponsiveTable from "@/components/layout/ResponsiveTable";
-
-interface SeriesPocketListProps {
-  readonly distributionName: Distribution["name"];
-  readonly series: Series;
-  readonly syncPocketRefAdd: (ref: SyncPocketRef) => void;
-  readonly syncPocketRefs: SyncPocketRef[];
-}
-
-const SeriesPocketList: FC<SeriesPocketListProps> = ({
-  distributionName,
-  series,
-  syncPocketRefAdd,
-  syncPocketRefs,
-}) => {
-  const pockets = useMemo<CommonPocket[]>(
-    () => series.pockets as CommonPocket[],
-    [series.pockets],
-  );
-
-  const columns = useMemo<Column<CommonPocket>[]>(
-    () => [
-      {
-        accessor: "name",
-        Header: "Pocket",
-        Cell: ({ row: { original } }: CellProps<CommonPocket>): ReactNode => (
-          <SeriesPocketDetailsButton
-            distributionName={distributionName}
-            pocket={original as Pocket}
-            seriesName={series.name}
-          />
-        ),
-      },
-      {
-        accessor: "mode",
-        Header: "Mode",
-      },
-      {
-        accessor: "last_sync",
-        Header: "Last synced",
-        className: "date-cell",
-        Cell: ({ row: { original } }: CellProps<CommonPocket>): ReactNode => (
-          <PocketSyncActivity
-            pocket={original as Pocket}
-            syncPocketRefAdd={syncPocketRefAdd}
-            syncPocketRefs={syncPocketRefs}
-          />
-        ),
-      },
-      {
-        accessor: "package_count",
-        Header: "Content",
-        Cell: ({ row: { original } }: CellProps<CommonPocket>): ReactNode => (
-          <>{pluralizeWithCount(original.package_count, "package")}</>
-        ),
-      },
-      {
-        ...LIST_ACTIONS_COLUMN_PROPS,
-        Cell: ({ row: { original } }: CellProps<CommonPocket>): ReactNode => (
-          <SeriesPocketListActions
-            distributionName={distributionName}
-            pocket={original as Pocket}
-            seriesName={series.name}
-            syncPocketRefs={syncPocketRefs}
-          />
-        ),
-      },
-    ],
-    [pockets, syncPocketRefs],
-  );
-
-  return (
-    <ResponsiveTable
-      columns={columns}
-      data={pockets}
-      getCellProps={getCellProps}
-      emptyMsg="No pockets yet"
-    />
-  );
-};
-
-export default SeriesPocketList;
diff --git a/src/features/mirrors/components/SeriesPocketList/helpers.ts b/src/features/mirrors/components/SeriesPocketList/helpers.ts
deleted file mode 100644
index 3f1f2666c..000000000
--- a/src/features/mirrors/components/SeriesPocketList/helpers.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-import type { HTMLProps } from "react";
-import type { Cell, TableCellProps } from "react-table";
-import type { CommonPocket } from "./types";
-
-export const getCellProps = ({
-  column,
-}: Cell<CommonPocket>): Partial<
-  TableCellProps & HTMLProps<HTMLTableCellElement>
-> => {
-  const cellProps: Partial<TableCellProps & HTMLProps<HTMLTableCellElement>> =
-    {};
-
-  if (column.id === "name") {
-    cellProps.role = "rowheader";
-  } else if (column.id === "mode") {
-    cellProps["aria-label"] = "Mode";
-  } else if (column.id === "last_sync") {
-    cellProps["aria-label"] = "Last synced";
-  } else if (column.id === "package_count") {
-    cellProps["aria-label"] = "Content";
-  } else if (column.id === "actions") {
-    cellProps["aria-label"] = "Actions";
-  }
-
-  return cellProps;
-};
diff --git a/src/features/mirrors/components/SeriesPocketList/index.ts b/src/features/mirrors/components/SeriesPocketList/index.ts
deleted file mode 100644
index af9b6f638..000000000
--- a/src/features/mirrors/components/SeriesPocketList/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./SeriesPocketList";
diff --git a/src/features/mirrors/components/SeriesPocketList/types.ts b/src/features/mirrors/components/SeriesPocketList/types.ts
deleted file mode 100644
index 3a1ad73b8..000000000
--- a/src/features/mirrors/components/SeriesPocketList/types.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-import type {
-  PocketCommonProps,
-  PocketLastSyncProps,
-  PocketMirrorProps,
-  PocketPullProps,
-  PocketUploadProps,
-} from "../../types";
-
-// Flatten the discriminated union into a single optional-property object so
-// that CommonPocket remains a plain object type (not a union), which is
-// required for react-table's Column<D> generic constraint.
-type PartialLastSyncProps = {
-  [K in keyof PocketLastSyncProps]?: PocketLastSyncProps[K];
-};
-
-export type CommonPocket = Record<string, unknown> &
-  PocketCommonProps &
-  PartialLastSyncProps &
-  Partial<Omit<PocketMirrorProps, "mode">> &
-  Partial<Omit<PocketPullProps, "mode">> &
-  Partial<Omit<PocketUploadProps, "mode">> & {
-    mode:
-      | PocketMirrorProps["mode"]
-      | PocketPullProps["mode"]
-      | PocketUploadProps["mode"];
-  };
diff --git a/src/features/mirrors/components/SeriesPocketListActions/SeriesPocketListActions.test.tsx b/src/features/mirrors/components/SeriesPocketListActions/SeriesPocketListActions.test.tsx
deleted file mode 100644
index 9f0342bd8..000000000
--- a/src/features/mirrors/components/SeriesPocketListActions/SeriesPocketListActions.test.tsx
+++ /dev/null
@@ -1,164 +0,0 @@
-import { distributions } from "@/tests/mocks/distributions";
-import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import type { ComponentProps } from "react";
-import type { PullPocket } from "../../types/Pocket";
-import SeriesPocketListActions from "./SeriesPocketListActions";
-
-const user = userEvent.setup();
-
-const pockets = distributions
-  .find((distribution) => distribution.series.length > 0)
-  ?.series.flatMap((series) => series.pockets);
-assert(pockets);
-
-const mirrorPocket = pockets.find((pocket) => pocket.mode === "mirror");
-assert(mirrorPocket);
-const propsWithMirrorPocket: ComponentProps<typeof SeriesPocketListActions> = {
-  distributionName: "Ubuntu",
-  pocket: mirrorPocket,
-  seriesName: "Focal Fossa",
-  syncPocketRefs: [],
-};
-
-const pullPocket = pockets.find((pocket) => pocket.mode === "pull");
-assert(pullPocket);
-const propsWithPullPocket: ComponentProps<typeof SeriesPocketListActions> = {
-  distributionName: "Ubuntu",
-  pocket: pullPocket,
-  seriesName: "Focal Fossa",
-  syncPocketRefs: [],
-};
-
-const uploadPocket = pockets.find((pocket) => pocket.mode === "upload");
-assert(uploadPocket);
-const propsWithUploadPocket: ComponentProps<typeof SeriesPocketListActions> = {
-  distributionName: "Ubuntu",
-  pocket: uploadPocket,
-  seriesName: "Focal Fossa",
-  syncPocketRefs: [],
-};
-
-const checkEditAndDeleteButtons = async (
-  pocketName: string,
-  seriesName: string,
-  distributionName: string,
-) => {
-  await userEvent.click(
-    screen.getByLabelText(
-      `${pocketName} pocket of ${distributionName}/${seriesName} actions`,
-    ),
-  );
-
-  const editMenuItem = screen.getByRole("menuitem", {
-    name: `Edit ${pocketName} pocket of ${distributionName}/${seriesName}`,
-  });
-  expect(editMenuItem).toBeInTheDocument();
-
-  await user.click(editMenuItem);
-
-  const formHeader = await screen.findByText(`Edit ${pocketName} pocket`);
-  expect(formHeader).toBeInTheDocument();
-
-  await user.click(screen.getByRole("button", { name: /close side panel/i }));
-
-  await userEvent.click(
-    screen.getByLabelText(
-      `${pocketName} pocket of ${distributionName}/${seriesName} actions`,
-    ),
-  );
-
-  const deleteMenuItem = screen.getByRole("menuitem", {
-    name: `Remove ${pocketName} pocket of ${distributionName}/${seriesName}`,
-  });
-  expect(deleteMenuItem).toBeInTheDocument();
-  await user.click(deleteMenuItem);
-
-  expect(
-    screen.getByText(
-      `Do you really want to delete ${pocketName} pocket from ${seriesName} series of ${distributionName} distribution?`,
-    ),
-  ).toBeVisible();
-  await user.click(screen.getByRole("button", { name: /cancel/i }));
-};
-
-describe("SeriesPocketListActions", () => {
-  it("renders correct buttons for mirror pockets", async () => {
-    renderWithProviders(<SeriesPocketListActions {...propsWithMirrorPocket} />);
-    const contextualListButton = screen.getByLabelText(
-      `${propsWithMirrorPocket.pocket.name} pocket of ${propsWithMirrorPocket.distributionName}/${propsWithMirrorPocket.seriesName} actions`,
-    );
-    await user.click(contextualListButton);
-
-    const syncMenuItem = screen.getByRole("menuitem", {
-      name: `Synchronize ${propsWithMirrorPocket.pocket.name} pocket of ${propsWithMirrorPocket.distributionName}/${propsWithMirrorPocket.seriesName}`,
-    });
-    expect(syncMenuItem).toBeInTheDocument();
-
-    await user.click(syncMenuItem);
-    expect(
-      screen.getByText("Do you want to synchronize packages?"),
-    ).toBeInTheDocument();
-
-    await userEvent.click(screen.getByRole("button", { name: /cancel/i }));
-
-    await checkEditAndDeleteButtons(
-      propsWithMirrorPocket.pocket.name,
-      propsWithMirrorPocket.seriesName,
-      propsWithMirrorPocket.distributionName,
-    );
-  });
-
-  it("renders correct buttons for pull pockets", async () => {
-    renderWithProviders(<SeriesPocketListActions {...propsWithPullPocket} />);
-    const contextualListButton = screen.getByLabelText(
-      `${propsWithPullPocket.pocket.name} pocket of ${propsWithPullPocket.distributionName}/${propsWithPullPocket.seriesName} actions`,
-    );
-
-    await user.click(contextualListButton);
-
-    const pullMenuItem = screen.getByRole("menuitem", {
-      name: `Pull packages to ${propsWithPullPocket.pocket.name} pocket of ${propsWithPullPocket.distributionName}/${propsWithPullPocket.seriesName}`,
-    });
-    expect(pullMenuItem).toBeInTheDocument();
-
-    await user.click(pullMenuItem);
-    expect(
-      screen.getByText(
-        `Do you want to pull packages from ${(propsWithPullPocket.pocket as PullPocket).pull_pocket}?`,
-      ),
-    ).toBeInTheDocument();
-
-    await userEvent.click(screen.getByRole("button", { name: /cancel/i }));
-
-    await checkEditAndDeleteButtons(
-      propsWithPullPocket.pocket.name,
-      propsWithPullPocket.seriesName,
-      propsWithPullPocket.distributionName,
-    );
-  });
-
-  it("renders correct buttons for upload pockets", async () => {
-    renderWithProviders(<SeriesPocketListActions {...propsWithUploadPocket} />);
-    const contextualListButton = screen.getByLabelText(
-      `${propsWithUploadPocket.pocket.name} pocket of ${propsWithUploadPocket.distributionName}/${propsWithUploadPocket.seriesName} actions`,
-    );
-    await user.click(contextualListButton);
-
-    const menuItemsLength = screen.getAllByRole("menuitem").length;
-    expect(menuItemsLength).toBe(2);
-
-    await userEvent.click(
-      screen.getByLabelText(
-        `${propsWithUploadPocket.pocket.name} pocket of ${propsWithUploadPocket.distributionName}/${propsWithUploadPocket.seriesName} actions`,
-      ),
-    );
-
-    await checkEditAndDeleteButtons(
-      propsWithUploadPocket.pocket.name,
-      propsWithUploadPocket.seriesName,
-      propsWithUploadPocket.distributionName,
-    );
-  });
-});
diff --git a/src/features/mirrors/components/SeriesPocketListActions/SeriesPocketListActions.tsx b/src/features/mirrors/components/SeriesPocketListActions/SeriesPocketListActions.tsx
deleted file mode 100644
index 078bdbd52..000000000
--- a/src/features/mirrors/components/SeriesPocketListActions/SeriesPocketListActions.tsx
+++ /dev/null
@@ -1,235 +0,0 @@
-import ListActions from "@/components/layout/ListActions";
-import LoadingState from "@/components/layout/LoadingState";
-import useDebug from "@/hooks/useDebug";
-import useSidePanel from "@/hooks/useSidePanel";
-import type { Action } from "@/types/Action";
-import { ConfirmationModal } from "@canonical/react-components";
-import type { FC, MouseEvent as ReactMouseEvent } from "react";
-import { lazy, Suspense } from "react";
-import { useBoolean } from "usehooks-ts";
-import { usePockets } from "../../hooks";
-import type { Pocket, SyncPocketRef } from "../../types";
-
-const EditPocketForm = lazy(async () => import("../EditPocketForm"));
-
-interface SeriesPocketListActionsProps {
-  readonly distributionName: string;
-  readonly pocket: Pocket;
-  readonly seriesName: string;
-  readonly syncPocketRefs: SyncPocketRef[];
-}
-
-const SeriesPocketListActions: FC<SeriesPocketListActionsProps> = ({
-  distributionName,
-  pocket,
-  seriesName,
-  syncPocketRefs,
-}) => {
-  const debug = useDebug();
-  const { setSidePanelContent } = useSidePanel();
-
-  const {
-    removePocketQuery,
-    syncMirrorPocketQuery,
-    pullPackagesToPocketQuery,
-  } = usePockets();
-
-  const {
-    value: isSyncModalOpen,
-    setTrue: openSyncModal,
-    setFalse: closeSyncModal,
-  } = useBoolean();
-
-  const {
-    value: isPullModalOpen,
-    setTrue: openPullModal,
-    setFalse: closePullModal,
-  } = useBoolean();
-
-  const {
-    value: isRemoveModalOpen,
-    setTrue: openRemoveModal,
-    setFalse: closeRemoveModal,
-  } = useBoolean();
-
-  const { mutateAsync: removePocket, isPending: isRemovingPocket } =
-    removePocketQuery;
-
-  const handleRemovePocket = async (): Promise<void> => {
-    try {
-      await removePocket({
-        distribution: distributionName,
-        series: seriesName,
-        name: pocket.name,
-      });
-    } catch (error) {
-      debug(error);
-    }
-  };
-
-  const {
-    mutateAsync: syncMirrorPocket,
-    isPending: isSynchronizingMirrorPocket,
-  } = syncMirrorPocketQuery;
-  const {
-    mutateAsync: pullPackagesToPocket,
-    isPending: isPullingPackagesToPocket,
-  } = pullPackagesToPocketQuery;
-
-  const handleSyncPocket = async (): Promise<void> => {
-    try {
-      await syncMirrorPocket({
-        name: pocket.name,
-        series: seriesName,
-        distribution: distributionName,
-      });
-    } catch (error) {
-      debug(error);
-    }
-  };
-
-  const handlePullPackagesToPocket = async (): Promise<void> => {
-    try {
-      await pullPackagesToPocket({
-        name: pocket.name,
-        series: seriesName,
-        distribution: distributionName,
-      });
-    } catch (error) {
-      debug(error);
-    }
-  };
-
-  const handleEditPocket = (
-    event: ReactMouseEvent<HTMLButtonElement, MouseEvent>,
-  ): void => {
-    event.currentTarget.blur();
-
-    setSidePanelContent(
-      `Edit ${pocket.name} pocket`,
-      <Suspense fallback={<LoadingState />}>
-        <EditPocketForm
-          pocket={pocket}
-          distributionName={distributionName}
-          seriesName={seriesName}
-        />
-      </Suspense>,
-    );
-  };
-
-  const disabled = syncPocketRefs.some(
-    (ref) => ref.distributionName === distributionName,
-  );
-
-  const actions: Action[] = [];
-
-  switch (pocket.mode) {
-    case "mirror": {
-      actions.push({
-        icon: "change-version",
-        label: "Sync",
-        "aria-label": `Synchronize ${pocket.name} pocket of ${distributionName}/${seriesName}`,
-        onClick: openSyncModal,
-        disabled,
-      });
-
-      break;
-    }
-
-    case "pull": {
-      actions.push({
-        icon: "change-version",
-        label: "Pull",
-        "aria-label": `Pull packages to ${pocket.name} pocket of ${distributionName}/${seriesName}`,
-        onClick: openPullModal,
-        disabled,
-      });
-
-      break;
-    }
-  }
-
-  actions.push({
-    icon: "edit",
-    label: "Edit",
-    "aria-label": `Edit ${pocket.name} pocket of ${distributionName}/${seriesName}`,
-    onClick: handleEditPocket,
-    disabled,
-  });
-
-  const destructiveActions: Action[] = [
-    {
-      icon: "delete",
-      label: "Remove",
-      "aria-label": `Remove ${pocket.name} pocket of ${distributionName}/${seriesName}`,
-      onClick: openRemoveModal,
-      disabled,
-    },
-  ];
-
-  return (
-    <>
-      <ListActions
-        toggleAriaLabel={`${pocket.name} pocket of ${distributionName}/${seriesName} actions`}
-        actions={actions}
-        destructiveActions={destructiveActions}
-      />
-
-      {pocket.mode === "mirror" && isSyncModalOpen && (
-        <ConfirmationModal
-          title={`Synchronizing ${pocket.name} pocket`}
-          confirmButtonLabel="Sync"
-          confirmButtonAppearance="positive"
-          confirmButtonDisabled={isSynchronizingMirrorPocket}
-          confirmButtonLoading={isSynchronizingMirrorPocket}
-          onConfirm={async () => {
-            await handleSyncPocket();
-            closeSyncModal();
-          }}
-          close={closeSyncModal}
-        >
-          <p>Do you want to synchronize packages?</p>
-        </ConfirmationModal>
-      )}
-
-      {pocket.mode === "pull" && isPullModalOpen && (
-        <ConfirmationModal
-          title={`Pulling packages to ${pocket.name} pocket`}
-          confirmButtonLabel="Pull"
-          confirmButtonAppearance="positive"
-          confirmButtonDisabled={isPullingPackagesToPocket}
-          confirmButtonLoading={isPullingPackagesToPocket}
-          onConfirm={async () => {
-            await handlePullPackagesToPocket();
-            closePullModal();
-          }}
-          close={closePullModal}
-        >
-          <p>Do you want to pull packages from {pocket.pull_pocket}?</p>
-        </ConfirmationModal>
-      )}
-
-      {isRemoveModalOpen && (
-        <ConfirmationModal
-          title="Deleting pocket"
-          confirmButtonLabel="Delete"
-          confirmButtonAppearance="negative"
-          confirmButtonDisabled={isRemovingPocket}
-          confirmButtonLoading={isRemovingPocket}
-          onConfirm={async () => {
-            await handleRemovePocket();
-            closeRemoveModal();
-          }}
-          close={closeRemoveModal}
-        >
-          <p>
-            Do you really want to delete {pocket.name} pocket from {seriesName}{" "}
-            series of {distributionName} distribution?
-          </p>
-        </ConfirmationModal>
-      )}
-    </>
-  );
-};
-
-export default SeriesPocketListActions;
diff --git a/src/features/mirrors/components/SeriesPocketListActions/index.ts b/src/features/mirrors/components/SeriesPocketListActions/index.ts
deleted file mode 100644
index 4240572e3..000000000
--- a/src/features/mirrors/components/SeriesPocketListActions/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./SeriesPocketListActions";
diff --git a/src/features/mirrors/components/UpdateMirrorModal/UpdateMirrorModal.tsx b/src/features/mirrors/components/UpdateMirrorModal/UpdateMirrorModal.tsx
new file mode 100644
index 000000000..413a5b08f
--- /dev/null
+++ b/src/features/mirrors/components/UpdateMirrorModal/UpdateMirrorModal.tsx
@@ -0,0 +1,110 @@
+import useDebug from "@/hooks/useDebug";
+import {
+  CheckboxInput,
+  ConfirmationModal,
+  Icon,
+} from "@canonical/react-components";
+import type { FC } from "react";
+import { useSyncMirror } from "../../api";
+import { useBoolean } from "usehooks-ts";
+import useNotify from "@/hooks/useNotify";
+
+interface UpdateMirrorModalProps {
+  readonly close: () => void;
+  readonly isOpen: boolean;
+  readonly mirrorDisplayName: string;
+  readonly mirrorName: string;
+}
+
+const UpdateMirrorModal: FC<UpdateMirrorModalProps> = ({
+  close,
+  isOpen,
+  mirrorDisplayName,
+  mirrorName,
+}) => {
+  const debug = useDebug();
+  const { notify } = useNotify();
+
+  const { mutateAsync: syncMirror, isPending: isSyncingMirror } =
+    useSyncMirror();
+
+  const { value: ignoreChecksums, toggle: toggleIgnoreChecksums } =
+    useBoolean();
+  const { value: ignoreSignatures, toggle: toggleIgnoreSignatures } =
+    useBoolean();
+  const { value: forceUpdate, toggle: toggleForceUpdate } = useBoolean();
+  const { value: skipExistingPackages, toggle: toggleSkipExistingPackages } =
+    useBoolean();
+
+  if (!isOpen) {
+    return;
+  }
+
+  const tryUpdateMirror = async () => {
+    try {
+      await syncMirror({
+        mirrorName,
+        params: {
+          ignoreChecksums,
+          ignoreSignatures,
+          forceUpdate,
+          skipExistingPackages,
+        },
+      });
+
+      close();
+
+      notify.success({
+        title: `You have marked ${mirrorDisplayName} to be updated.`,
+        message: "An activity has been queued to update the mirror contents.",
+      });
+    } catch (error) {
+      debug(error);
+    }
+  };
+
+  return (
+    <ConfirmationModal
+      confirmButtonLabel={
+        <>
+          <Icon name="restart" light />
+          <span>Update mirror</span>
+        </>
+      }
+      onConfirm={tryUpdateMirror}
+      confirmButtonAppearance="positive"
+      title={`Update ${mirrorDisplayName}`}
+      close={close}
+      confirmButtonLoading={isSyncingMirror}
+      renderInPortal
+    >
+      <p>
+        By updating this mirror you will synchronize the local copy of that
+        repository with the remote source.
+      </p>
+      <CheckboxInput
+        label="Ignore checksum mismatches"
+        onChange={toggleIgnoreChecksums}
+        checked={ignoreChecksums}
+      />
+      <CheckboxInput
+        label="Ignore signature verification failures"
+        onChange={toggleIgnoreSignatures}
+        checked={ignoreSignatures}
+      />
+      <CheckboxInput
+        label="Force a full update"
+        onChange={toggleForceUpdate}
+        checked={forceUpdate}
+      />
+      <CheckboxInput
+        label="Skip downloading packages that already exist"
+        onChange={toggleSkipExistingPackages}
+        checked={skipExistingPackages && !forceUpdate}
+        disabled={forceUpdate}
+      />
+    </ConfirmationModal>
+  );
+};
+
+export default UpdateMirrorModal;
diff --git a/src/features/mirrors/components/UpdateMirrorModal/index.ts b/src/features/mirrors/components/UpdateMirrorModal/index.ts
new file mode 100644
index 000000000..b71db77ac
--- /dev/null
+++ b/src/features/mirrors/components/UpdateMirrorModal/index.ts
@@ -0,0 +1 @@
+export { default } from "./UpdateMirrorModal";
diff --git a/src/features/mirrors/constants.ts b/src/features/mirrors/constants.ts
index 4b3697629..2151d13f3 100644
--- a/src/features/mirrors/constants.ts
+++ b/src/features/mirrors/constants.ts
@@ -1,52 +1,3 @@
-import type { SelectOption } from "@/types/SelectOption";
-import type { PreSelected } from "./types/FormTypes";
-
-export const DEFAULT_MIRROR_URI = "http://archive.ubuntu.com/ubuntu";
-export const DEFAULT_SNAPSHOT_URI = "https://snapshot.ubuntu.com/ubuntu";
-
-export const PRE_SELECTED_COMPONENTS: PreSelected = {
-  ubuntu: ["main", "universe", "restricted", "multiverse"],
-  thirdParty: ["main"],
-};
-
-export const PRE_SELECTED_ARCHITECTURES: PreSelected = {
-  ubuntu: ["amd64"],
-  thirdParty: ["amd64"],
-};
-
-export const PRE_SELECTED_POCKETS = {
-  ubuntu: ["release", "security", "updates"],
-  thirdParty: ["release"],
-} as const satisfies PreSelected;
-
-export const COMPONENT_OPTIONS: SelectOption[] = [
-  {
-    label: "Main",
-    value: "main",
-  },
-  {
-    label: "Universe",
-    value: "universe",
-  },
-  {
-    label: "Restricted",
-    value: "restricted",
-  },
-  {
-    label: "Multiverse",
-    value: "multiverse",
-  },
-];
-
-export const ARCHITECTURE_OPTIONS: SelectOption[] = [
-  {
-    label: "amd64",
-    value: "amd64",
-  },
-  {
-    label: "i386",
-    value: "i386",
-  },
-];
-
-export const MIN_SELECTION_COUNT = 1;
+export const UBUNTU_ARCHIVE_HOST = "archive.ubuntu.com";
+export const UBUNTU_SNAPSHOTS_HOST = "snapshot.ubuntu.com";
+export const UBUNTU_PRO_HOST = "esm.ubuntu.com";
diff --git a/src/features/mirrors/helpers.ts b/src/features/mirrors/helpers.ts
new file mode 100644
index 000000000..962a6edef
--- /dev/null
+++ b/src/features/mirrors/helpers.ts
@@ -0,0 +1,11 @@
+import type { Distribution, UbuntuArchiveInfo } from "./types";
+
+export function isDistributionValid(distribution: Distribution): boolean {
+  return (
+    distribution.architectures.length > 0 && distribution.components.length > 0
+  );
+}
+
+export function isArchiveInfoValid(archiveInfo: UbuntuArchiveInfo): boolean {
+  return archiveInfo.distributions.some(isDistributionValid);
+}
diff --git a/src/features/mirrors/hooks/index.ts b/src/features/mirrors/hooks/index.ts
index 86c1dd70b..297cb6429 100644
--- a/src/features/mirrors/hooks/index.ts
+++ b/src/features/mirrors/hooks/index.ts
@@ -1,4 +1 @@
 export { default as useDistributions } from "./useDistributions";
-export { default as useGPGKeysOptions } from "./useGPGKeysOptions";
-export { default as usePockets } from "./usePockets";
-export { default as useSeries } from "./useSeries";
diff --git a/src/features/mirrors/hooks/useGPGKeysOptions.ts b/src/features/mirrors/hooks/useGPGKeysOptions.ts
deleted file mode 100644
index 3868321f9..000000000
--- a/src/features/mirrors/hooks/useGPGKeysOptions.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { useGPGKeys } from "@/features/gpg-keys";
-import type { UseGPGKeysOptionsResult } from "../types/UseGPGKeysOptionsResult";
-
-const useGPGKeysOptions = (): UseGPGKeysOptionsResult => {
-  const { getGPGKeysQuery } = useGPGKeys();
-
-  const { data: getGPGKeysQueryResult } = getGPGKeysQuery();
-
-  const gpgKeys = getGPGKeysQueryResult?.data ?? [];
-
-  return {
-    privateGPGKeysOptions: gpgKeys
-      .filter(({ has_secret }) => has_secret)
-      .map((item) => ({
-        label: item.name,
-        value: item.name,
-      })),
-    publicGPGKeysOptions: gpgKeys
-      .filter(({ has_secret }) => !has_secret)
-      .map((item) => ({
-        label: item.name,
-        value: item.name,
-      })),
-  };
-};
-
-export default useGPGKeysOptions;
diff --git a/src/features/mirrors/hooks/usePockets.ts b/src/features/mirrors/hooks/usePockets.ts
deleted file mode 100644
index c848f5f47..000000000
--- a/src/features/mirrors/hooks/usePockets.ts
+++ /dev/null
@@ -1,220 +0,0 @@
-import type { Activity } from "@/features/activities";
-import type { PackageDiff, PackageObject } from "@/features/packages";
-import useFetchOld from "@/hooks/useFetchOld";
-import type { ApiError } from "@/types/api/ApiError";
-import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
-import type { QueryFnType } from "@/types/api/QueryFnType";
-import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
-import type { AxiosError, AxiosResponse } from "axios";
-import type {
-  AddPackageFiltersToPocketParams,
-  AddUploaderGPGKeysToPocketParams,
-  CreateMirrorPocketParams,
-  CreatePullPocketParams,
-  CreateUploadPocketParams,
-  DiffPullPocketParams,
-  EditMirrorPocketParams,
-  EditPullPocketParams,
-  EditUploadPocketParams,
-  ListPocketParams,
-  Pocket,
-  PullPackagesToPocketParams,
-  RemovePackageFiltersFromPocketParams,
-  RemovePackagesFromPocketParams,
-  RemovePocketParams,
-  RemoveUploaderGPGKeysFromPocketParams,
-  SyncMirrorPocketParams,
-} from "../types";
-import type { UsePocketsResult } from "../types/UsePocketsResult";
-
-export default function usePockets(): UsePocketsResult {
-  const queryClient = useQueryClient();
-  const authFetch = useFetchOld();
-
-  const createPocketQuery = useMutation<
-    AxiosResponse<Pocket>,
-    AxiosError<ApiError>,
-    CreateMirrorPocketParams | CreatePullPocketParams | CreateUploadPocketParams
-  >({
-    mutationKey: ["pockets", "create"],
-    mutationFn: async (params) => authFetch.get("CreatePocket", { params }),
-    onSuccess: async () =>
-      queryClient.invalidateQueries({ queryKey: ["distributions"] }),
-  });
-
-  const editPocketQuery = useMutation<
-    AxiosResponse<Pocket>,
-    AxiosError<ApiError>,
-    EditMirrorPocketParams | EditPullPocketParams | EditUploadPocketParams
-  >({
-    mutationKey: ["pockets", "edit"],
-    mutationFn: async (params) => authFetch.get("EditPocket", { params }),
-    onSuccess: async () =>
-      queryClient.invalidateQueries({ queryKey: ["distributions"] }),
-  });
-
-  const removePocketQuery = useMutation<
-    AxiosResponse<void>,
-    AxiosError<ApiError>,
-    RemovePocketParams
-  >({
-    mutationKey: ["pockets", "remove"],
-    mutationFn: async (params) => authFetch.get("RemovePocket", { params }),
-    onSuccess: async () =>
-      queryClient.invalidateQueries({ queryKey: ["distributions"] }),
-  });
-
-  const syncMirrorPocketQuery = useMutation<
-    AxiosResponse<Activity>,
-    AxiosError<ApiError>,
-    SyncMirrorPocketParams
-  >({
-    mutationKey: ["pocketPackages", "sync"],
-    mutationFn: async (params) => authFetch.get("SyncMirrorPocket", { params }),
-    onSuccess: async (_, variables) =>
-      Promise.all([
-        queryClient.invalidateQueries({
-          queryKey: ["pocketPackages", { ...variables }],
-        }),
-        queryClient.invalidateQueries({ queryKey: ["distributions"] }),
-      ]),
-  });
-
-  const pullPackagesToPocketQuery = useMutation<
-    AxiosResponse<Activity>,
-    AxiosError<ApiError>,
-    PullPackagesToPocketParams
-  >({
-    mutationKey: ["pocketPackages", "pull"],
-    mutationFn: async (params) =>
-      authFetch.get("PullPackagesToPocket", { params }),
-    onSuccess: async (_, variables) =>
-      Promise.all([
-        queryClient.invalidateQueries({
-          queryKey: ["pocketPackages", { ...variables }],
-        }),
-        queryClient.invalidateQueries({ queryKey: ["distributions"] }),
-      ]),
-  });
-
-  const removePackagesFromPocketQuery = useMutation<
-    AxiosResponse<void>,
-    AxiosError<ApiError>,
-    RemovePackagesFromPocketParams
-  >({
-    mutationKey: ["pocketPackages", "remove"],
-    mutationFn: async (params) =>
-      authFetch.get("RemovePackagesFromPocket", { params }),
-    onSuccess: async (_, variables) =>
-      queryClient.invalidateQueries({
-        queryKey: ["pocketPackages", { ...variables }, "list"],
-      }),
-  });
-
-  const diffPullPocketQuery: QueryFnType<
-    AxiosResponse<PackageDiff>,
-    DiffPullPocketParams
-  > = (queryParams, config = {}) =>
-    useQuery<AxiosResponse<PackageDiff>, AxiosError<ApiError>>({
-      queryKey: ["pocketPackages", { ...queryParams }, "difference"],
-      queryFn: async () =>
-        authFetch.get("DiffPullPocket", { params: queryParams }),
-      ...config,
-    });
-
-  const listPocketQuery: QueryFnType<
-    AxiosResponse<ApiPaginatedResponse<PackageObject>>,
-    ListPocketParams
-  > = (queryParams, config = {}) =>
-    useQuery<
-      AxiosResponse<ApiPaginatedResponse<PackageObject>>,
-      AxiosError<ApiError>
-    >({
-      queryKey: ["pocketPackages", { ...queryParams }, "list"],
-      queryFn: async () => authFetch.get("ListPocket", { params: queryParams }),
-      ...config,
-    });
-
-  const addPackageFiltersToPocketQuery = useMutation<
-    AxiosResponse<Pocket>,
-    AxiosError<ApiError>,
-    AddPackageFiltersToPocketParams
-  >({
-    mutationKey: ["packageFilters", "add"],
-    mutationFn: async (params) =>
-      authFetch.get("AddPackageFiltersToPocket", { params }),
-    onSuccess: async (_, variables) =>
-      Promise.all([
-        queryClient.invalidateQueries({ queryKey: ["distributions"] }),
-        queryClient.invalidateQueries({
-          queryKey: ["pocketPackages", { ...variables }],
-        }),
-      ]),
-  });
-
-  const removePackageFiltersFromPocketQuery = useMutation<
-    AxiosResponse<Pocket>,
-    AxiosError<ApiError>,
-    RemovePackageFiltersFromPocketParams
-  >({
-    mutationKey: ["packageFilters", "remove"],
-    mutationFn: async (params) =>
-      authFetch.get("RemovePackageFiltersFromPocket", { params }),
-    onSuccess: async (_, variables) =>
-      Promise.all([
-        queryClient.invalidateQueries({ queryKey: ["distributions"] }),
-        queryClient.invalidateQueries({
-          queryKey: ["pocketPackages", { ...variables }],
-        }),
-      ]),
-  });
-
-  const addUploaderGPGKeysToPocketQuery = useMutation<
-    AxiosResponse<Pocket>,
-    AxiosError<ApiError>,
-    AddUploaderGPGKeysToPocketParams
-  >({
-    mutationKey: ["uploaderGPGKeys", "add"],
-    mutationFn: async (params) =>
-      authFetch.get("AddUploaderGPGKeysToPocket", { params }),
-    onSuccess: async (_, variables) =>
-      Promise.all([
-        queryClient.invalidateQueries({ queryKey: ["distributions"] }),
-        queryClient.invalidateQueries({
-          queryKey: ["pocketPackages", { ...variables }],
-        }),
-      ]),
-  });
-
-  const removeUploaderGPGKeysFromPocketQuery = useMutation<
-    AxiosResponse<Pocket>,
-    AxiosError<ApiError>,
-    RemoveUploaderGPGKeysFromPocketParams
-  >({
-    mutationKey: ["uploaderGPGKeys", "remove"],
-    mutationFn: async (params) =>
-      authFetch.get("RemoveUploaderGPGKeysFromPocket", { params }),
-    onSuccess: async (_, variables) =>
-      Promise.all([
-        queryClient.invalidateQueries({ queryKey: ["distributions"] }),
-        queryClient.invalidateQueries({
-          queryKey: ["pocketPackages", { ...variables }],
-        }),
-      ]),
-  });
-
-  return {
-    createPocketQuery,
-    editPocketQuery,
-    syncMirrorPocketQuery,
-    pullPackagesToPocketQuery,
-    diffPullPocketQuery,
-    removePocketQuery,
-    listPocketQuery,
-    removePackagesFromPocketQuery,
-    addPackageFiltersToPocketQuery,
-    removePackageFiltersFromPocketQuery,
-    addUploaderGPGKeysToPocketQuery,
-    removeUploaderGPGKeysFromPocketQuery,
-  };
-}
diff --git a/src/features/mirrors/hooks/useSeries.ts b/src/features/mirrors/hooks/useSeries.ts
deleted file mode 100644
index 2b924825a..000000000
--- a/src/features/mirrors/hooks/useSeries.ts
+++ /dev/null
@@ -1,72 +0,0 @@
-import useFetchOld from "@/hooks/useFetchOld";
-import type { ApiError } from "@/types/api/ApiError";
-import type { QueryFnType } from "@/types/api/QueryFnType";
-import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
-import type { AxiosError, AxiosResponse } from "axios";
-import type {
-  CreateSeriesParams,
-  DeriveSeriesParams,
-  GetRepoInfoParams,
-  RemoveSeriesParams,
-  RepoInfo,
-  Series,
-} from "../types";
-import type { UseSeriesResult } from "../types/UseSeriesResult";
-
-export default function useSeries(): UseSeriesResult {
-  const queryClient = useQueryClient();
-  const authFetch = useFetchOld();
-
-  const createSeriesQuery = useMutation<
-    AxiosResponse<Series>,
-    AxiosError<ApiError>,
-    CreateSeriesParams
-  >({
-    mutationKey: ["series", "new"],
-    mutationFn: async (params) => authFetch.get("CreateSeries", { params }),
-    onSuccess: async () =>
-      queryClient.invalidateQueries({ queryKey: ["distributions"] }),
-  });
-
-  const deriveSeriesQuery = useMutation<
-    AxiosResponse<Series>,
-    AxiosError<ApiError>,
-    DeriveSeriesParams
-  >({
-    mutationKey: ["series", "derive"],
-    mutationFn: async (params) => authFetch.get("DeriveSeries", { params }),
-    onSuccess: async () =>
-      queryClient.invalidateQueries({ queryKey: ["distributions"] }),
-  });
-
-  const removeSeriesQuery = useMutation<
-    AxiosResponse<void>,
-    AxiosError<ApiError>,
-    RemoveSeriesParams
-  >({
-    mutationKey: ["series", "remove"],
-    mutationFn: async (params) => authFetch.get("RemoveSeries", { params }),
-    onSuccess: async () =>
-      queryClient.invalidateQueries({ queryKey: ["distributions"] }),
-  });
-
-  const getRepoInfo: QueryFnType<AxiosResponse<RepoInfo>, GetRepoInfoParams> = (
-    queryParams,
-    config = {},
-  ) =>
-    useQuery<AxiosResponse<RepoInfo>, AxiosError<ApiError>>({
-      queryKey: ["repoInfo", { queryParams }],
-      queryFn: async () =>
-        authFetch.get("GetRepoInfo", {
-          params: queryParams,
-        }),
-      ...config,
-    });
-
-  return {
-    createSeriesQuery,
-    removeSeriesQuery,
-    deriveSeriesQuery,
-    getRepoInfo,
-  };
-}
diff --git a/src/features/mirrors/index.ts b/src/features/mirrors/index.ts
index 20eebd61e..427425233 100644
--- a/src/features/mirrors/index.ts
+++ b/src/features/mirrors/index.ts
@@ -1,17 +1,14 @@
-export { default as DistributionContainer } from "./components/DistributionContainer";
-export { default as NewDistributionForm } from "./components/NewDistributionForm";
-export { default as NewSeriesForm } from "./components/NewSeriesForm";
-export { distributionCardClasses } from "./components/DistributionCard";
-export { seriesCardClasses } from "./components/SeriesCard";
+export { default as AddMirrorForm } from "./components/AddMirrorForm";
 export { useDistributions } from "./hooks";
-export { DEFAULT_SNAPSHOT_URI } from "./constants";
 export type {
-  DiffPullPocketParams,
   Distribution,
   GetDistributionsParams,
-  GetRepoInfoParams,
-  ListPocketParams,
   Pocket,
-  RepoInfo,
   Series,
+  UbuntuArchiveInfo,
 } from "./types";
+export * from "./api";
+export { default as MirrorsList } from "./components/MirrorsList";
+export { default as MirrorDetails } from "./components/MirrorDetails";
+export { default as EditMirrorForm } from "./components/EditMirrorForm";
+export { default as PublishMirrorForm } from "./components/PublishMirrorForm";
diff --git a/src/features/mirrors/types/Architecture.ts b/src/features/mirrors/types/Architecture.ts
new file mode 100644
index 000000000..69c279cfe
--- /dev/null
+++ b/src/features/mirrors/types/Architecture.ts
@@ -0,0 +1,4 @@
+export interface Architecture {
+  slug: string;
+  preselected: boolean;
+}
\ No newline at end of file
diff --git a/src/features/mirrors/types/Component.ts b/src/features/mirrors/types/Component.ts
new file mode 100644
index 000000000..1544cc0e0
--- /dev/null
+++ b/src/features/mirrors/types/Component.ts
@@ -0,0 +1,4 @@
+export interface Component {
+  slug: string;
+  preselected: boolean;
+}
diff --git a/src/features/mirrors/types/Distribution.ts b/src/features/mirrors/types/Distribution.ts
index 3b1765db8..02158e430 100644
--- a/src/features/mirrors/types/Distribution.ts
+++ b/src/features/mirrors/types/Distribution.ts
@@ -1,8 +1,10 @@
-import type { Series } from "./Series";
+import type { Architecture } from "./Architecture";
+import type { Component } from "./Component";
 
 export interface Distribution {
-  access_group: string;
-  creation_time: string;
-  name: string;
-  series: Series[];
+  slug: string;
+  label: string;
+  preselected: boolean;
+  components: Component[];
+  architectures: Architecture[];
 }
diff --git a/src/features/mirrors/types/FormTypes.ts b/src/features/mirrors/types/FormTypes.ts
deleted file mode 100644
index f35ffc11f..000000000
--- a/src/features/mirrors/types/FormTypes.ts
+++ /dev/null
@@ -1 +0,0 @@
-export type PreSelected = Record<"ubuntu" | "thirdParty", string[]>;
diff --git a/src/features/mirrors/types/FormattedPackage.ts b/src/features/mirrors/types/FormattedPackage.ts
deleted file mode 100644
index e06376d9b..000000000
--- a/src/features/mirrors/types/FormattedPackage.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-export interface FormattedPackage extends Record<string, unknown> {
-  packageName: string;
-  packageVersion: string;
-  difference?: "update" | "delete" | "add";
-  newVersion?: string;
-}
diff --git a/src/features/mirrors/types/PocketParams.ts b/src/features/mirrors/types/PocketParams.ts
deleted file mode 100644
index 1a9751c0a..000000000
--- a/src/features/mirrors/types/PocketParams.ts
+++ /dev/null
@@ -1,120 +0,0 @@
-export interface CreateCommonPocketParams {
-  architectures: string[];
-  components: string[];
-  distribution: string;
-  gpg_key: string;
-  include_udeb: boolean;
-  name: string;
-  series: string;
-}
-
-export interface CreateMirrorPocketParams extends CreateCommonPocketParams {
-  mirror_uri: string;
-  mode: "mirror";
-  mirror_gpg_key?: string;
-  mirror_suite?: string;
-}
-
-export interface CreatePullPocketParams extends CreateCommonPocketParams {
-  mode: "pull";
-  pull_pocket: string;
-  filter_packages?: string[];
-  filter_type?: "whitelist" | "blacklist";
-  pull_series?: string;
-}
-
-export interface CreateUploadPocketParams extends CreateCommonPocketParams {
-  mode: "upload";
-  upload_allow_unsigned: boolean;
-}
-
-export interface EditCommonPocketParams {
-  architectures: string[];
-  components: string[];
-  distribution: string;
-  gpg_key: string;
-  name: string;
-  series: string;
-  include_udeb?: boolean;
-}
-
-export interface EditMirrorPocketParams extends EditCommonPocketParams {
-  mirror_uri: string;
-  mirror_gpg_key?: string;
-  mirror_suite?: string;
-}
-
-// eslint-disable-next-line @typescript-eslint/no-empty-object-type
-export interface EditPullPocketParams extends EditCommonPocketParams {}
-
-export interface EditUploadPocketParams extends EditCommonPocketParams {
-  upload_allow_unsigned: boolean;
-}
-
-export interface RemovePocketParams {
-  distribution: string;
-  name: string;
-  series: string;
-}
-
-export interface SyncMirrorPocketParams {
-  distribution: string;
-  name: string;
-  series: string;
-}
-
-export interface PullPackagesToPocketParams {
-  distribution: string;
-  name: string;
-  series: string;
-}
-
-export interface DiffPullPocketParams {
-  distribution: string;
-  name: string;
-  series: string;
-}
-
-export interface ListPocketParams {
-  distribution: string;
-  limit: number;
-  name: string;
-  offset: number;
-  series: string;
-  search?: string;
-}
-
-export interface RemovePackagesFromPocketParams {
-  distribution: string;
-  name: string;
-  packages: string[];
-  series: string;
-}
-
-export interface AddPackageFiltersToPocketParams {
-  distribution: string;
-  name: string;
-  packages: string[];
-  series: string;
-}
-
-export interface RemovePackageFiltersFromPocketParams {
-  distribution: string;
-  name: string;
-  packages: string[];
-  series: string;
-}
-
-export interface AddUploaderGPGKeysToPocketParams {
-  distribution: string;
-  gpg_keys: string[];
-  name: string;
-  series: string;
-}
-
-export interface RemoveUploaderGPGKeysFromPocketParams {
-  distribution: string;
-  gpg_keys: string[];
-  name: string;
-  series: string;
-}
diff --git a/src/features/mirrors/types/Series.ts b/src/features/mirrors/types/Series.ts
index 67682333a..3dc310069 100644
--- a/src/features/mirrors/types/Series.ts
+++ b/src/features/mirrors/types/Series.ts
@@ -5,20 +5,3 @@ export interface Series {
   name: string;
   pockets: Pocket[];
 }
-
-export interface Repo {
-  architectures: string;
-  codename: string;
-  description: string;
-  label: string;
-  origin: string;
-  repo: string;
-  url: string;
-  version: string;
-}
-
-export interface RepoInfo {
-  flat: boolean;
-  repos: Repo[];
-  ubuntu: boolean;
-}
diff --git a/src/features/mirrors/types/SeriesParams.ts b/src/features/mirrors/types/SeriesParams.ts
deleted file mode 100644
index c676851f5..000000000
--- a/src/features/mirrors/types/SeriesParams.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-export interface CreateSeriesParams {
-  distribution: string;
-  include_udeb: boolean;
-  name: string;
-  architectures?: string[];
-  components?: string[];
-  gpg_key?: string;
-  mirror_gpg_key?: string;
-  mirror_series?: string;
-  mirror_uri?: string;
-  pockets?: string[];
-}
-
-export interface DeriveSeriesParams {
-  distribution: string;
-  name: string;
-  origin: string;
-}
-
-export interface RemoveSeriesParams {
-  distribution: string;
-  name: string;
-}
-
-export interface GetRepoInfoParams {
-  mirror_uri: string;
-}
diff --git a/src/features/mirrors/types/SyncPocketRef.ts b/src/features/mirrors/types/SyncPocketRef.ts
deleted file mode 100644
index 4fb151083..000000000
--- a/src/features/mirrors/types/SyncPocketRef.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-export interface SyncPocketRef {
-  distributionName: string;
-  pocketName: string;
-  seriesName: string;
-}
diff --git a/src/features/mirrors/types/UbuntuArchiveInfo.ts b/src/features/mirrors/types/UbuntuArchiveInfo.ts
new file mode 100644
index 000000000..1da0f8f5a
--- /dev/null
+++ b/src/features/mirrors/types/UbuntuArchiveInfo.ts
@@ -0,0 +1,8 @@
+import type { Distribution } from "./Distribution";
+
+export interface UbuntuArchiveInfo {
+  label: string;
+  mirror_type: string;
+  mirror_url: string;
+  distributions: Distribution[];
+}
diff --git a/src/features/mirrors/types/UseGPGKeysOptionsResult.ts b/src/features/mirrors/types/UseGPGKeysOptionsResult.ts
deleted file mode 100644
index 4c0739368..000000000
--- a/src/features/mirrors/types/UseGPGKeysOptionsResult.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-import type { SelectOption } from "@/types/SelectOption";
-
-export interface UseGPGKeysOptionsResult {
-  privateGPGKeysOptions: SelectOption[];
-  publicGPGKeysOptions: SelectOption[];
-}
diff --git a/src/features/mirrors/types/UsePocketsResult.ts b/src/features/mirrors/types/UsePocketsResult.ts
deleted file mode 100644
index 9942c8105..000000000
--- a/src/features/mirrors/types/UsePocketsResult.ts
+++ /dev/null
@@ -1,87 +0,0 @@
-import type { Activity } from "@/features/activities";
-import type { PackageDiff, PackageObject } from "@/features/packages";
-import type { ApiError } from "@/types/api/ApiError";
-import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
-import type { QueryFnType } from "@/types/api/QueryFnType";
-import type { UseMutationResult } from "@tanstack/react-query";
-import type { AxiosError, AxiosResponse } from "axios";
-import type { Pocket } from "./Pocket";
-import type {
-  AddPackageFiltersToPocketParams,
-  AddUploaderGPGKeysToPocketParams,
-  CreateMirrorPocketParams,
-  CreatePullPocketParams,
-  CreateUploadPocketParams,
-  DiffPullPocketParams,
-  EditMirrorPocketParams,
-  EditPullPocketParams,
-  EditUploadPocketParams,
-  ListPocketParams,
-  PullPackagesToPocketParams,
-  RemovePackageFiltersFromPocketParams,
-  RemovePackagesFromPocketParams,
-  RemovePocketParams,
-  RemoveUploaderGPGKeysFromPocketParams,
-  SyncMirrorPocketParams,
-} from "./PocketParams";
-
-export interface UsePocketsResult {
-  addPackageFiltersToPocketQuery: UseMutationResult<
-    AxiosResponse<Pocket>,
-    AxiosError<ApiError>,
-    AddPackageFiltersToPocketParams
-  >;
-  addUploaderGPGKeysToPocketQuery: UseMutationResult<
-    AxiosResponse<Pocket>,
-    AxiosError<ApiError>,
-    AddUploaderGPGKeysToPocketParams
-  >;
-  createPocketQuery: UseMutationResult<
-    AxiosResponse<Pocket>,
-    AxiosError<ApiError>,
-    CreateMirrorPocketParams | CreatePullPocketParams | CreateUploadPocketParams
-  >;
-  diffPullPocketQuery: QueryFnType<
-    AxiosResponse<PackageDiff>,
-    DiffPullPocketParams
-  >;
-  editPocketQuery: UseMutationResult<
-    AxiosResponse<Pocket>,
-    AxiosError<ApiError>,
-    EditMirrorPocketParams | EditPullPocketParams | EditUploadPocketParams
-  >;
-  listPocketQuery: QueryFnType<
-    AxiosResponse<ApiPaginatedResponse<PackageObject>>,
-    ListPocketParams
-  >;
-  pullPackagesToPocketQuery: UseMutationResult<
-    AxiosResponse<Activity>,
-    AxiosError<ApiError>,
-    PullPackagesToPocketParams
-  >;
-  removePackageFiltersFromPocketQuery: UseMutationResult<
-    AxiosResponse<Pocket>,
-    AxiosError<ApiError>,
-    RemovePackageFiltersFromPocketParams
-  >;
-  removePackagesFromPocketQuery: UseMutationResult<
-    AxiosResponse<void>,
-    AxiosError<ApiError>,
-    RemovePackagesFromPocketParams
-  >;
-  removePocketQuery: UseMutationResult<
-    AxiosResponse<void>,
-    AxiosError<ApiError>,
-    RemovePocketParams
-  >;
-  removeUploaderGPGKeysFromPocketQuery: UseMutationResult<
-    AxiosResponse<Pocket>,
-    AxiosError<ApiError>,
-    RemoveUploaderGPGKeysFromPocketParams
-  >;
-  syncMirrorPocketQuery: UseMutationResult<
-    AxiosResponse<Activity>,
-    AxiosError<ApiError>,
-    SyncMirrorPocketParams
-  >;
-}
diff --git a/src/features/mirrors/types/UseSeriesResult.ts b/src/features/mirrors/types/UseSeriesResult.ts
deleted file mode 100644
index cc97642e0..000000000
--- a/src/features/mirrors/types/UseSeriesResult.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-import type { ApiError } from "@/types/api/ApiError";
-import type { QueryFnType } from "@/types/api/QueryFnType";
-import type { UseMutationResult } from "@tanstack/react-query";
-import type { AxiosError, AxiosResponse } from "axios";
-import type { RepoInfo, Series } from "./Series";
-import type {
-  CreateSeriesParams,
-  DeriveSeriesParams,
-  GetRepoInfoParams,
-  RemoveSeriesParams,
-} from "./SeriesParams";
-
-export interface UseSeriesResult {
-  createSeriesQuery: UseMutationResult<
-    AxiosResponse<Series>,
-    AxiosError<ApiError>,
-    CreateSeriesParams
-  >;
-  deriveSeriesQuery: UseMutationResult<
-    AxiosResponse<Series>,
-    AxiosError<ApiError>,
-    DeriveSeriesParams
-  >;
-  getRepoInfo: QueryFnType<AxiosResponse<RepoInfo>, GetRepoInfoParams>;
-  removeSeriesQuery: UseMutationResult<
-    AxiosResponse<void>,
-    AxiosError<ApiError>,
-    RemoveSeriesParams
-  >;
-}
diff --git a/src/features/mirrors/types/index.ts b/src/features/mirrors/types/index.ts
index 56c3f4016..a31c7a76f 100644
--- a/src/features/mirrors/types/index.ts
+++ b/src/features/mirrors/types/index.ts
@@ -1,42 +1,7 @@
-export type { SyncPocketRef } from "./SyncPocketRef";
-export type { Distribution } from "./Distribution";
-export type {
-  CreateDistributionParams,
-  GetDistributionsParams,
-  RemoveDistributionParams,
-} from "./DistributionParams";
-export type { Series, Repo, RepoInfo } from "./Series";
-export type {
-  CreateSeriesParams,
-  DeriveSeriesParams,
-  GetRepoInfoParams,
-  RemoveSeriesParams,
-} from "./SeriesParams";
-export type {
-  Pocket,
-  PocketLastSyncProps,
-  PocketCommonProps,
-  PocketMirrorProps,
-  PocketPullProps,
-  PocketUploadProps,
-} from "./Pocket";
-export type {
-  AddPackageFiltersToPocketParams,
-  AddUploaderGPGKeysToPocketParams,
-  CreateCommonPocketParams,
-  CreateMirrorPocketParams,
-  CreatePullPocketParams,
-  CreateUploadPocketParams,
-  DiffPullPocketParams,
-  EditCommonPocketParams,
-  EditMirrorPocketParams,
-  EditPullPocketParams,
-  EditUploadPocketParams,
-  ListPocketParams,
-  PullPackagesToPocketParams,
-  RemovePackageFiltersFromPocketParams,
-  RemovePackagesFromPocketParams,
-  RemovePocketParams,
-  RemoveUploaderGPGKeysFromPocketParams,
-  SyncMirrorPocketParams,
-} from "./PocketParams";
+export * from "./Architecture";
+export * from "./Component";
+export * from "./Distribution";
+export * from "./DistributionParams";
+export * from "./Series";
+export * from "./Pocket";
+export * from "./UbuntuArchiveInfo";
diff --git a/src/features/package-profiles/api/useGetPagePackageProfile.ts b/src/features/package-profiles/api/useGetPagePackageProfile.ts
index 6c782928a..1b69e3a22 100644
--- a/src/features/package-profiles/api/useGetPagePackageProfile.ts
+++ b/src/features/package-profiles/api/useGetPagePackageProfile.ts
@@ -5,7 +5,7 @@ import type { PackageProfile } from "../types";
 const useGetPagePackageProfile = ():
   | { packageProfile: PackageProfile; isGettingPackageProfile: false }
   | { packageProfile: undefined; isGettingPackageProfile: true } => {
-  const { profile: packageProfileName } = usePageParams();
+  const { name: packageProfileName } = usePageParams();
 
   const { packageProfile, isGettingPackageProfile, packageProfileError } =
     useGetPackageProfile(packageProfileName);
diff --git a/src/features/package-profiles/components/PackageProfileAddSidePanel/PackageProfileAddSidePanel.tsx b/src/features/package-profiles/components/PackageProfileAddSidePanel/PackageProfileAddSidePanel.tsx
index 744918d5b..5e9723de7 100644
--- a/src/features/package-profiles/components/PackageProfileAddSidePanel/PackageProfileAddSidePanel.tsx
+++ b/src/features/package-profiles/components/PackageProfileAddSidePanel/PackageProfileAddSidePanel.tsx
@@ -34,7 +34,7 @@ const PackageProfileAddSidePanel: FC = () => {
 
   const { mutateAsync: createPackageProfile } = createPackageProfileQuery;
 
-  const closeSidePanel = createPageParamsSetter({ sidePath: [], profile: "" });
+  const closeSidePanel = createPageParamsSetter({ sidePath: [], name: "" });
 
   const handleSubmit = async (values: AddFormProps) => {
     const valuesToProfileCreation: CreatePackageProfileParams = {
diff --git a/src/features/package-profiles/components/PackageProfileDuplicateSidePanel/components/PackageProfileDuplicateForm/PackageProfileDuplicateForm.tsx b/src/features/package-profiles/components/PackageProfileDuplicateSidePanel/components/PackageProfileDuplicateForm/PackageProfileDuplicateForm.tsx
index 2da76a330..c8e09da93 100644
--- a/src/features/package-profiles/components/PackageProfileDuplicateSidePanel/components/PackageProfileDuplicateForm/PackageProfileDuplicateForm.tsx
+++ b/src/features/package-profiles/components/PackageProfileDuplicateSidePanel/components/PackageProfileDuplicateForm/PackageProfileDuplicateForm.tsx
@@ -39,7 +39,7 @@ const PackageProfileDuplicateForm: FC<PackageProfileDuplicateFormProps> = ({
       value: name,
     })) ?? [];
 
-  const closeSidePanel = createPageParamsSetter({ sidePath: [], profile: "" });
+  const closeSidePanel = createPageParamsSetter({ sidePath: [], name: "" });
 
   const handleSubmit = async (values: DuplicateFormProps) => {
     const valuesToSubmit: CopyPackageProfileParams = {
diff --git a/src/features/package-profiles/components/PackageProfileEditSidePanel/components/PackageProfileEditForm/PackageProfileEditForm.tsx b/src/features/package-profiles/components/PackageProfileEditSidePanel/components/PackageProfileEditForm/PackageProfileEditForm.tsx
index 706d88ad7..34c09feca 100644
--- a/src/features/package-profiles/components/PackageProfileEditSidePanel/components/PackageProfileEditForm/PackageProfileEditForm.tsx
+++ b/src/features/package-profiles/components/PackageProfileEditSidePanel/components/PackageProfileEditForm/PackageProfileEditForm.tsx
@@ -35,7 +35,7 @@ const PackageProfileEditForm: FC<PackageProfileEditFormProps> = ({
       value: name,
     })) ?? [];
 
-  const closeSidePanel = createPageParamsSetter({ sidePath: [], profile: "" });
+  const closeSidePanel = createPageParamsSetter({ sidePath: [], name: "" });
 
   const handleSubmit = async (values: EditFormProps) => {
     try {
diff --git a/src/features/package-profiles/components/PackageProfileList/PackageProfileList.tsx b/src/features/package-profiles/components/PackageProfileList/PackageProfileList.tsx
index a5ceb1cae..8579994f7 100644
--- a/src/features/package-profiles/components/PackageProfileList/PackageProfileList.tsx
+++ b/src/features/package-profiles/components/PackageProfileList/PackageProfileList.tsx
@@ -60,7 +60,7 @@ const PackageProfileList: FC<PackageProfileListProps> = ({
               className="u-no-margin--bottom u-no-padding--top u-align-text--left"
               onClick={createPageParamsSetter({
                 sidePath: ["view"],
-                profile: original.name,
+                name: original.name,
               })}
             >
               {original.title}
diff --git a/src/features/package-profiles/components/PackageProfileListActions/PackageProfileListActions.tsx b/src/features/package-profiles/components/PackageProfileListActions/PackageProfileListActions.tsx
index 335b7f7e8..d32cfa752 100644
--- a/src/features/package-profiles/components/PackageProfileListActions/PackageProfileListActions.tsx
+++ b/src/features/package-profiles/components/PackageProfileListActions/PackageProfileListActions.tsx
@@ -23,17 +23,17 @@ const PackageProfileListActions: FC<PackageProfileListActionsProps> = ({
 
   const handleConstraintsChange = createPageParamsSetter({
     sidePath: ["edit-constraints"],
-    profile: profile.name,
+    name: profile.name,
   });
 
   const handlePackageProfileEdit = createPageParamsSetter({
     sidePath: ["edit"],
-    profile: profile.name,
+    name: profile.name,
   });
 
   const handlePackageProfileDuplicate = createPageParamsSetter({
     sidePath: ["duplicate"],
-    profile: profile.name,
+    name: profile.name,
   });
 
   const actions: Action[] = [
diff --git a/src/features/package-profiles/components/PackageProfileRemoveModal/PackageProfileRemoveModal.tsx b/src/features/package-profiles/components/PackageProfileRemoveModal/PackageProfileRemoveModal.tsx
index dc91f2224..4c5b6f4cc 100644
--- a/src/features/package-profiles/components/PackageProfileRemoveModal/PackageProfileRemoveModal.tsx
+++ b/src/features/package-profiles/components/PackageProfileRemoveModal/PackageProfileRemoveModal.tsx
@@ -31,7 +31,7 @@ const PackageProfileRemoveModal: FC<PackageProfileRemoveModalProps> = ({
     try {
       await removePackageProfile({ name: packageProfile.name });
 
-      setPageParams({ sidePath: [], profile: "" });
+      setPageParams({ sidePath: [], name: "" });
 
       notify.success({
         message: `Package profile "${packageProfile.name}" removed successfully.`,
diff --git a/src/features/package-profiles/components/PackageProfilesEmptyState/PackageProfilesEmptyState.tsx b/src/features/package-profiles/components/PackageProfilesEmptyState/PackageProfilesEmptyState.tsx
index fc6291535..3de76866b 100644
--- a/src/features/package-profiles/components/PackageProfilesEmptyState/PackageProfilesEmptyState.tsx
+++ b/src/features/package-profiles/components/PackageProfilesEmptyState/PackageProfilesEmptyState.tsx
@@ -8,7 +8,7 @@ const PackageProfilesEmptyState: FC = () => {
 
   const handleCreatePackageProfile = createPageParamsSetter({
     sidePath: ["add"],
-    profile: "",
+    name: "",
   });
 
   return (
diff --git a/src/features/publications/components/PublicationDetails/PublicationDetails.test.tsx b/src/features/publications/components/PublicationDetails/PublicationDetails.test.tsx
index bb3ec5eac..3b263de8d 100644
--- a/src/features/publications/components/PublicationDetails/PublicationDetails.test.tsx
+++ b/src/features/publications/components/PublicationDetails/PublicationDetails.test.tsx
@@ -1,9 +1,10 @@
-import { mirrors, publicationTargets, publications } from "@/tests/mocks/publications";
+import { publicationTargets, publications } from "@/tests/mocks/publications";
 import { renderWithProviders } from "@/tests/render";
 import { screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { describe, expect, it } from "vitest";
 import PublicationDetails from "./PublicationDetails";
+import { mirrors } from "@/tests/mocks/mirrors";
 
 describe("PublicationDetails", () => {
   const user = userEvent.setup();
diff --git a/src/features/publications/components/PublicationDetailsSidePanel/PublicationDetailsSidePanel.tsx b/src/features/publications/components/PublicationDetailsSidePanel/PublicationDetailsSidePanel.tsx
index cecae107a..f14b003e6 100644
--- a/src/features/publications/components/PublicationDetailsSidePanel/PublicationDetailsSidePanel.tsx
+++ b/src/features/publications/components/PublicationDetailsSidePanel/PublicationDetailsSidePanel.tsx
@@ -12,8 +12,9 @@ import { getPublicationTargetName, getSourceName } from "../../helpers";
 import PublicationDetails from "../PublicationDetails";
 
 const PublicationDetailsSidePanel: FC = () => {
-  const { publication: publicationId } = usePageParams();
-  const { publication, isGettingPublication } = useGetPublication(publicationId);
+  const { name: publicationId } = usePageParams();
+  const { publication, isGettingPublication } =
+    useGetPublication(publicationId);
 
   const publicationTargetNames = useMemo(
     () => (publication ? [publication.publicationTarget] : []),
@@ -32,8 +33,9 @@ const PublicationDetailsSidePanel: FC = () => {
     [publication],
   );
 
-  const { publicationTargetDisplayNames } =
-    useBatchGetPublicationTargets(publicationTargetNames);
+  const { publicationTargetDisplayNames } = useBatchGetPublicationTargets(
+    publicationTargetNames,
+  );
   const { mirrorDisplayNames } = useBatchGetMirrors(mirrorNames);
   const { localDisplayNames } = useBatchGetLocals(localNames);
 
diff --git a/src/features/publications/components/PublicationsList/PublicationsList.test.tsx b/src/features/publications/components/PublicationsList/PublicationsList.test.tsx
index 3ad0d5d35..582ef6fcf 100644
--- a/src/features/publications/components/PublicationsList/PublicationsList.test.tsx
+++ b/src/features/publications/components/PublicationsList/PublicationsList.test.tsx
@@ -1,13 +1,10 @@
-import {
-  mirrors,
-  publicationTargets,
-  publications,
-} from "@/tests/mocks/publications";
+import { publicationTargets, publications } from "@/tests/mocks/publications";
 import { renderWithProviders } from "@/tests/render";
 import { screen, within } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { describe, expect, it } from "vitest";
 import PublicationsList from "./PublicationsList";
+import { mirrors } from "@/tests/mocks/mirrors";
 
 const buildDisplayNameMaps = (pubs: typeof publications) => {
   const sourceDisplayNames: Record<string, string> = {};
diff --git a/src/features/publications/components/PublicationsList/PublicationsList.tsx b/src/features/publications/components/PublicationsList/PublicationsList.tsx
index 6dacd0011..7498ae906 100644
--- a/src/features/publications/components/PublicationsList/PublicationsList.tsx
+++ b/src/features/publications/components/PublicationsList/PublicationsList.tsx
@@ -39,7 +39,7 @@ const PublicationsList: FC<PublicationsListProps> = ({
             className="u-no-margin--bottom u-no-padding--top u-align-text--left"
             onClick={createPageParamsSetter({
               sidePath: ["view"],
-              publication: row.original.publicationId,
+              name: row.original.publicationId,
             })}
           >
             {row.original.label}
diff --git a/src/features/publications/components/PublicationsListActions/PublicationsListActions.tsx b/src/features/publications/components/PublicationsListActions/PublicationsListActions.tsx
index 2fa1c7674..591a9fc1f 100644
--- a/src/features/publications/components/PublicationsListActions/PublicationsListActions.tsx
+++ b/src/features/publications/components/PublicationsListActions/PublicationsListActions.tsx
@@ -36,7 +36,7 @@ const PublicationsListActions: FC<PublicationsListActionsProps> = ({
       "aria-label": `View details of "${publicationLabel}" publication`,
       onClick: createPageParamsSetter({
         sidePath: ["view"],
-        publication: publication.publicationId,
+        name: publication.publicationId,
       }),
     },
     {
diff --git a/src/features/reboot-profiles/api/useGetPageRebootProfile.ts b/src/features/reboot-profiles/api/useGetPageRebootProfile.ts
index 0af39ffcd..0279d1a01 100644
--- a/src/features/reboot-profiles/api/useGetPageRebootProfile.ts
+++ b/src/features/reboot-profiles/api/useGetPageRebootProfile.ts
@@ -8,7 +8,7 @@ const useGetPageRebootProfile = ():
       isGettingRebootProfile: false;
     }
   | { rebootProfile: undefined; isGettingRebootProfile: true } => {
-  const { profile: rebootProfileId } = usePageParams();
+  const { name: rebootProfileId } = usePageParams();
 
   const { isGettingRebootProfile, rebootProfile, rebootProfileError } =
     useGetRebootProfile({ id: parseInt(rebootProfileId) });
diff --git a/src/features/reboot-profiles/components/RebootProfileRemoveModal/RebootProfileRemoveModal.tsx b/src/features/reboot-profiles/components/RebootProfileRemoveModal/RebootProfileRemoveModal.tsx
index d39115283..4abfdf5fc 100644
--- a/src/features/reboot-profiles/components/RebootProfileRemoveModal/RebootProfileRemoveModal.tsx
+++ b/src/features/reboot-profiles/components/RebootProfileRemoveModal/RebootProfileRemoveModal.tsx
@@ -30,7 +30,7 @@ const RebootProfileRemoveModal: FC<RebootProfileRemoveModalProps> = ({
         id: rebootProfile.id,
       });
 
-      setPageParams({ sidePath: [], profile: "" });
+      setPageParams({ sidePath: [], name: "" });
 
       notify.success({
         title: "Reboot profile removed",
diff --git a/src/features/reboot-profiles/components/RebootProfilesContainer/RebootProfilesContainer.tsx b/src/features/reboot-profiles/components/RebootProfilesContainer/RebootProfilesContainer.tsx
index a01a5c735..7446fbf14 100644
--- a/src/features/reboot-profiles/components/RebootProfilesContainer/RebootProfilesContainer.tsx
+++ b/src/features/reboot-profiles/components/RebootProfilesContainer/RebootProfilesContainer.tsx
@@ -13,7 +13,7 @@ const RebootProfilesContainer: FC = () => {
 
   const handleAddProfile = createPageParamsSetter({
     sidePath: ["add"],
-    profile: "",
+    name: "",
   });
 
   return (
diff --git a/src/features/reboot-profiles/components/RebootProfilesForm/RebootProfilesForm.tsx b/src/features/reboot-profiles/components/RebootProfilesForm/RebootProfilesForm.tsx
index 41c0bbec7..6e591e0a3 100644
--- a/src/features/reboot-profiles/components/RebootProfilesForm/RebootProfilesForm.tsx
+++ b/src/features/reboot-profiles/components/RebootProfilesForm/RebootProfilesForm.tsx
@@ -48,7 +48,7 @@ const RebootProfilesForm: FC<RebootProfilesFormProps> = (props) => {
       value: name,
     })) ?? [];
 
-  const closeSidePanel = createPageParamsSetter({ sidePath: [], profile: "" });
+  const closeSidePanel = createPageParamsSetter({ sidePath: [], name: "" });
 
   const formik = useFormik<FormProps>({
     initialValues: getInitialValues(props),
diff --git a/src/features/reboot-profiles/components/RebootProfilesList/RebootProfilesList.tsx b/src/features/reboot-profiles/components/RebootProfilesList/RebootProfilesList.tsx
index cac2bfc37..57e659800 100644
--- a/src/features/reboot-profiles/components/RebootProfilesList/RebootProfilesList.tsx
+++ b/src/features/reboot-profiles/components/RebootProfilesList/RebootProfilesList.tsx
@@ -55,7 +55,7 @@ const RebootProfilesList: FC<RebootProfilesListProps> = ({ profiles }) => {
             className="u-no-margin--bottom u-no-padding--top u-align-text--left"
             onClick={createPageParamsSetter({
               sidePath: ["view"],
-              profile: original.id.toString(),
+              name: original.id.toString(),
             })}
           >
             {original.title}
diff --git a/src/features/reboot-profiles/components/RebootProfilesListActions/RebootProfilesListActions.tsx b/src/features/reboot-profiles/components/RebootProfilesListActions/RebootProfilesListActions.tsx
index c373f01d7..bacc2adbb 100644
--- a/src/features/reboot-profiles/components/RebootProfilesListActions/RebootProfilesListActions.tsx
+++ b/src/features/reboot-profiles/components/RebootProfilesListActions/RebootProfilesListActions.tsx
@@ -23,12 +23,12 @@ const RebootProfilesListActions: FC<RebootProfilesListActionsProps> = ({
 
   const handleRebootProfileEdit = createPageParamsSetter({
     sidePath: ["edit"],
-    profile: profile.id.toString(),
+    name: profile.id.toString(),
   });
 
   const handleRebootProfileDuplicate = createPageParamsSetter({
     sidePath: ["duplicate"],
-    profile: profile.id.toString(),
+    name: profile.id.toString(),
   });
 
   const actions: Action[] = [
diff --git a/src/features/removal-profiles/api/useGetPageRemovalProfile.ts b/src/features/removal-profiles/api/useGetPageRemovalProfile.ts
index 22e8db84e..2818238f6 100644
--- a/src/features/removal-profiles/api/useGetPageRemovalProfile.ts
+++ b/src/features/removal-profiles/api/useGetPageRemovalProfile.ts
@@ -8,7 +8,7 @@ const useGetPageRemovalProfile = ():
       isGettingRemovalProfile: false;
     }
   | { removalProfile: undefined; isGettingRemovalProfile: true } => {
-  const { profile: removalProfileId } = usePageParams();
+  const { name: removalProfileId } = usePageParams();
 
   const { isGettingRemovalProfile, removalProfile, removalProfileError } =
     useGetRemovalProfile(parseInt(removalProfileId));
diff --git a/src/features/removal-profiles/components/RemovalProfileList/RemovalProfileList.tsx b/src/features/removal-profiles/components/RemovalProfileList/RemovalProfileList.tsx
index 35f4bfb7b..262b743cc 100644
--- a/src/features/removal-profiles/components/RemovalProfileList/RemovalProfileList.tsx
+++ b/src/features/removal-profiles/components/RemovalProfileList/RemovalProfileList.tsx
@@ -55,7 +55,7 @@ const RemovalProfileList: FC<RemovalProfileListProps> = ({ profiles }) => {
               appearance="link"
               onClick={createPageParamsSetter({
                 sidePath: ["view"],
-                profile: original.id.toString(),
+                name: original.id.toString(),
               })}
               className="u-no-margin--bottom u-no-padding--top u-align--left"
               aria-label={`Open "${original.title}" profile details`}
diff --git a/src/features/removal-profiles/components/RemovalProfileListActions/RemovalProfileListActions.tsx b/src/features/removal-profiles/components/RemovalProfileListActions/RemovalProfileListActions.tsx
index 3c9f649f8..09355f165 100644
--- a/src/features/removal-profiles/components/RemovalProfileListActions/RemovalProfileListActions.tsx
+++ b/src/features/removal-profiles/components/RemovalProfileListActions/RemovalProfileListActions.tsx
@@ -23,7 +23,7 @@ const RemovalProfileListActions: FC<RemovalProfileListActionsProps> = ({
 
   const handleRemovalProfileEdit = createPageParamsSetter({
     sidePath: ["edit"],
-    profile: profile.id.toString(),
+    name: profile.id.toString(),
   });
 
   const actions: Action[] = [
diff --git a/src/features/removal-profiles/components/RemovalProfileRemoveModal/RemovalProfileRemoveModal.tsx b/src/features/removal-profiles/components/RemovalProfileRemoveModal/RemovalProfileRemoveModal.tsx
index c1dadd020..478144489 100644
--- a/src/features/removal-profiles/components/RemovalProfileRemoveModal/RemovalProfileRemoveModal.tsx
+++ b/src/features/removal-profiles/components/RemovalProfileRemoveModal/RemovalProfileRemoveModal.tsx
@@ -31,7 +31,7 @@ const RemovalProfileRemoveModal: FC<RemovalProfileRemoveModalProps> = ({
     try {
       await removeRemovalProfile({ name: removalProfile.name });
 
-      setPageParams({ sidePath: [], profile: "" });
+      setPageParams({ sidePath: [], name: "" });
 
       notify.success({
         title: "Removal profile removed",
diff --git a/src/features/removal-profiles/components/RemovalProfilesEmptyState/RemovalProfilesEmptyState.tsx b/src/features/removal-profiles/components/RemovalProfilesEmptyState/RemovalProfilesEmptyState.tsx
index 5c144556b..b2c0c6b34 100644
--- a/src/features/removal-profiles/components/RemovalProfilesEmptyState/RemovalProfilesEmptyState.tsx
+++ b/src/features/removal-profiles/components/RemovalProfilesEmptyState/RemovalProfilesEmptyState.tsx
@@ -24,7 +24,7 @@ const RemovalProfilesEmptyState: FC = () => {
         <Button
           key="table-add-new-mirror"
           appearance="positive"
-          onClick={createPageParamsSetter({ sidePath: ["add"], profile: "" })}
+          onClick={createPageParamsSetter({ sidePath: ["add"], name: "" })}
           type="button"
         >
           Add removal profile
diff --git a/src/features/removal-profiles/components/SingleRemovalProfileForm/SingleRemovalProfileForm.tsx b/src/features/removal-profiles/components/SingleRemovalProfileForm/SingleRemovalProfileForm.tsx
index 85a107123..12e303176 100644
--- a/src/features/removal-profiles/components/SingleRemovalProfileForm/SingleRemovalProfileForm.tsx
+++ b/src/features/removal-profiles/components/SingleRemovalProfileForm/SingleRemovalProfileForm.tsx
@@ -47,7 +47,7 @@ const SingleRemovalProfileForm: FC<SingleRemovalProfileFormProps> = (props) => {
   const { mutateAsync: createRemovalProfile } = createRemovalProfileQuery;
   const { mutateAsync: editRemovalProfile } = editRemovalProfileQuery;
 
-  const closeSidePanel = createPageParamsSetter({ sidePath: [], profile: "" });
+  const closeSidePanel = createPageParamsSetter({ sidePath: [], name: "" });
 
   const handleSubmit = async (values: FormProps) => {
     const valuesToSubmit: CreateRemovalProfileParams = {
diff --git a/src/features/script-profiles/api/useGetPageScriptProfile.ts b/src/features/script-profiles/api/useGetPageScriptProfile.ts
index c94550b22..624226506 100644
--- a/src/features/script-profiles/api/useGetPageScriptProfile.ts
+++ b/src/features/script-profiles/api/useGetPageScriptProfile.ts
@@ -5,7 +5,7 @@ import type { ScriptProfile } from "../types";
 const useGetPageScriptProfile = ():
   | { scriptProfile: ScriptProfile; isGettingScriptProfile: false }
   | { scriptProfile: undefined; isGettingScriptProfile: true } => {
-  const { profile: scriptProfileId } = usePageParams();
+  const { name: scriptProfileId } = usePageParams();
 
   const { isGettingScriptProfile, scriptProfile, scriptProfileError } =
     useGetScriptProfile({ id: parseInt(scriptProfileId) });
diff --git a/src/features/script-profiles/components/AddScriptProfileButton/AddScriptProfileButton.tsx b/src/features/script-profiles/components/AddScriptProfileButton/AddScriptProfileButton.tsx
index 4de55d66f..9bcd8bcd3 100644
--- a/src/features/script-profiles/components/AddScriptProfileButton/AddScriptProfileButton.tsx
+++ b/src/features/script-profiles/components/AddScriptProfileButton/AddScriptProfileButton.tsx
@@ -17,7 +17,7 @@ const AddScriptProfileButton: FC<AddScriptProfileButtonProps> = ({
     useGetScriptProfiles({ listenToUrlParams: false }, { archived: "active" });
   const { scriptProfileLimits } = useGetScriptProfileLimits();
 
-  const addProfile = createPageParamsSetter({ sidePath: ["add"], profile: "" });
+  const addProfile = createPageParamsSetter({ sidePath: ["add"], name: "" });
 
   return (
     <Button
diff --git a/src/features/script-profiles/components/ScriptProfileForm/ScriptProfileForm.tsx b/src/features/script-profiles/components/ScriptProfileForm/ScriptProfileForm.tsx
index 60d401adf..8e5ddb316 100644
--- a/src/features/script-profiles/components/ScriptProfileForm/ScriptProfileForm.tsx
+++ b/src/features/script-profiles/components/ScriptProfileForm/ScriptProfileForm.tsx
@@ -67,7 +67,7 @@ const ScriptProfileForm: FC<ScriptProfileFormProps> = ({
   const { scriptProfileLimits, isGettingScriptProfileLimits } =
     useGetScriptProfileLimits();
 
-  const closeSidePanel = createPageParamsSetter({ sidePath: [], profile: "" });
+  const closeSidePanel = createPageParamsSetter({ sidePath: [], name: "" });
 
   const formik = useFormik<ScriptProfileFormValues>({
     initialValues,
diff --git a/src/features/script-profiles/components/ScriptProfilesList/ScriptProfilesList.tsx b/src/features/script-profiles/components/ScriptProfilesList/ScriptProfilesList.tsx
index 2c6b3af0f..93c4edd22 100644
--- a/src/features/script-profiles/components/ScriptProfilesList/ScriptProfilesList.tsx
+++ b/src/features/script-profiles/components/ScriptProfilesList/ScriptProfilesList.tsx
@@ -39,7 +39,7 @@ const ScriptProfilesList: FC<ScriptProfilesListProps> = ({ profiles }) => {
             className="u-no-margin u-no-padding--top u-align-text--left"
             onClick={createPageParamsSetter({
               sidePath: ["view"],
-              profile: profile.id.toString(),
+              name: profile.id.toString(),
             })}
           >
             {profile.title}
diff --git a/src/features/script-profiles/components/ScriptProfilesListActions/ScriptProfilesListActions.tsx b/src/features/script-profiles/components/ScriptProfilesListActions/ScriptProfilesListActions.tsx
index c76032300..4fd1e2fb1 100644
--- a/src/features/script-profiles/components/ScriptProfilesListActions/ScriptProfilesListActions.tsx
+++ b/src/features/script-profiles/components/ScriptProfilesListActions/ScriptProfilesListActions.tsx
@@ -27,7 +27,7 @@ const ScriptProfilesListActions: FC<ScriptProfilesListActionsProps> = ({
       label: "View details",
       onClick: createPageParamsSetter({
         sidePath: ["view"],
-        profile: scriptProfile.id.toString(),
+        name: scriptProfile.id.toString(),
       }),
     },
   ];
@@ -38,7 +38,7 @@ const ScriptProfilesListActions: FC<ScriptProfilesListActionsProps> = ({
       label: "Edit",
       onClick: createPageParamsSetter({
         sidePath: ["edit"],
-        profile: scriptProfile.id.toString(),
+        name: scriptProfile.id.toString(),
       }),
     });
   }
diff --git a/src/features/script-profiles/components/ScriptProfilesTab/ScriptProfilesTab.tsx b/src/features/script-profiles/components/ScriptProfilesTab/ScriptProfilesTab.tsx
index 735f8de92..c533509d8 100644
--- a/src/features/script-profiles/components/ScriptProfilesTab/ScriptProfilesTab.tsx
+++ b/src/features/script-profiles/components/ScriptProfilesTab/ScriptProfilesTab.tsx
@@ -20,7 +20,7 @@ const ScriptProfilesTab: FC = () => {
   const { sidePath, lastSidePathSegment, createPageParamsSetter } =
     usePageParams();
 
-  const close = createPageParamsSetter({ sidePath: [], profile: "" });
+  const close = createPageParamsSetter({ sidePath: [], name: "" });
 
   useSetDynamicFilterValidation("sidePath", ["add", "edit", "view"]);
 
diff --git a/src/features/scripts/components/ScriptDetailsInfo/ScriptDetailsInfo.tsx b/src/features/scripts/components/ScriptDetailsInfo/ScriptDetailsInfo.tsx
index e7b85764a..0e6ba648a 100644
--- a/src/features/scripts/components/ScriptDetailsInfo/ScriptDetailsInfo.tsx
+++ b/src/features/scripts/components/ScriptDetailsInfo/ScriptDetailsInfo.tsx
@@ -76,7 +76,7 @@ const ScriptDetailsInfo: FC<ScriptDetailsInfoProps> = ({ script }) => {
                   to={ROUTES.scripts.root({
                     tab: "profiles",
                     sidePath: ["view"],
-                    profile: profile.id.toString(),
+                    name: profile.id.toString(),
                   })}
                   key={profile.id}
                 >
diff --git a/src/features/scripts/components/ScriptList/ScriptList.tsx b/src/features/scripts/components/ScriptList/ScriptList.tsx
index f6c98ca86..c94a6056f 100644
--- a/src/features/scripts/components/ScriptList/ScriptList.tsx
+++ b/src/features/scripts/components/ScriptList/ScriptList.tsx
@@ -114,7 +114,7 @@ const ScriptList: FC<ScriptListProps> = ({ scripts }) => {
                   to={ROUTES.scripts.root({
                     tab: "profiles",
                     sidePath: ["view"],
-                    profile: id.toString(),
+                    name: id.toString(),
                   })}
                   key={id}
                   className="truncatedItem"
diff --git a/src/features/security-profiles/api/useGetPageSecurityProfile.tsx b/src/features/security-profiles/api/useGetPageSecurityProfile.tsx
index b229dc1c6..97f9b4a44 100644
--- a/src/features/security-profiles/api/useGetPageSecurityProfile.tsx
+++ b/src/features/security-profiles/api/useGetPageSecurityProfile.tsx
@@ -11,7 +11,7 @@ const useGetPageSecurityProfile = ():
       securityProfile: undefined;
       isGettingSecurityProfile: true;
     } => {
-  const { profile: securityProfileId } = usePageParams();
+  const { name: securityProfileId } = usePageParams();
 
   const { isGettingSecurityProfile, securityProfile, securityProfileError } =
     useGetSecurityProfile(parseInt(securityProfileId));
diff --git a/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/components/SecurityProfileDownloadAuditForm/SecurityProfileDownloadAuditForm.tsx b/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/components/SecurityProfileDownloadAuditForm/SecurityProfileDownloadAuditForm.tsx
index 9f8bb52ee..4cdd1bed5 100644
--- a/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/components/SecurityProfileDownloadAuditForm/SecurityProfileDownloadAuditForm.tsx
+++ b/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/components/SecurityProfileDownloadAuditForm/SecurityProfileDownloadAuditForm.tsx
@@ -307,7 +307,7 @@ const SecurityProfileDownloadAuditForm: FC<
         submitButtonText="Generate CSV"
         hasBackButton={sidePath.length > 1}
         onBackButtonPress={popSidePath}
-        onCancel={createPageParamsSetter({ sidePath: [], profile: "" })}
+        onCancel={createPageParamsSetter({ sidePath: [], name: "" })}
       />
     </>
   );
diff --git a/src/features/security-profiles/components/SecurityProfileForm/SecurityProfileForm.tsx b/src/features/security-profiles/components/SecurityProfileForm/SecurityProfileForm.tsx
index 076535a74..ccda2edda 100644
--- a/src/features/security-profiles/components/SecurityProfileForm/SecurityProfileForm.tsx
+++ b/src/features/security-profiles/components/SecurityProfileForm/SecurityProfileForm.tsx
@@ -84,7 +84,7 @@ const SecurityProfileForm: FC<SecurityProfileFormProps> = ({
           submitButtonDisabled={!!step.isLoading || submitting}
           submitButtonLoading={step.isLoading || submitting}
           submitButtonText={submitButtonText}
-          onCancel={createPageParamsSetter({ sidePath: [], profile: "" })}
+          onCancel={createPageParamsSetter({ sidePath: [], name: "" })}
         />
       </>
     );
@@ -109,7 +109,7 @@ const SecurityProfileForm: FC<SecurityProfileFormProps> = ({
         submitButtonText={submitButtonText}
         hasBackButton={hasBackButton}
         onBackButtonPress={onBackButtonPress}
-        onCancel={createPageParamsSetter({ sidePath: [], profile: "" })}
+        onCancel={createPageParamsSetter({ sidePath: [], name: "" })}
       />
     </>
   );
diff --git a/src/features/security-profiles/components/SecurityProfileListActions/SecurityProfileListActions.tsx b/src/features/security-profiles/components/SecurityProfileListActions/SecurityProfileListActions.tsx
index 94093e474..dc4342048 100644
--- a/src/features/security-profiles/components/SecurityProfileListActions/SecurityProfileListActions.tsx
+++ b/src/features/security-profiles/components/SecurityProfileListActions/SecurityProfileListActions.tsx
@@ -38,7 +38,7 @@ const SecurityProfileListActions: FC<SecurityProfileListActionsProps> = ({
     try {
       const { data: activity } = await runSecurityProfile({ id: profile.id });
 
-      setPageParams({ sidePath: [], profile: "" });
+      setPageParams({ sidePath: [], name: "" });
 
       const message = getNotificationMessage(profile.mode);
 
@@ -70,7 +70,7 @@ const SecurityProfileListActions: FC<SecurityProfileListActionsProps> = ({
       "aria-label": `View "${profile.title}" security profile details`,
       onClick: createPageParamsSetter({
         sidePath: ["view"],
-        profile: profile.id.toString(),
+        name: profile.id.toString(),
       }),
     },
     {
@@ -79,7 +79,7 @@ const SecurityProfileListActions: FC<SecurityProfileListActionsProps> = ({
       "aria-label": `Download "${profile.title}" security profile audit`,
       onClick: createPageParamsSetter({
         sidePath: ["download"],
-        profile: profile.id.toString(),
+        name: profile.id.toString(),
       }),
     },
   ];
@@ -92,7 +92,7 @@ const SecurityProfileListActions: FC<SecurityProfileListActionsProps> = ({
         "aria-label": `Edit "${profile.title}" security profile`,
         onClick: createPageParamsSetter({
           sidePath: ["edit"],
-          profile: profile.id.toString(),
+          name: profile.id.toString(),
         }),
       },
       {
@@ -105,7 +105,7 @@ const SecurityProfileListActions: FC<SecurityProfileListActionsProps> = ({
             return;
           }
 
-          setPageParams({ sidePath: ["run"], profile: profile.id.toString() });
+          setPageParams({ sidePath: ["run"], name: profile.id.toString() });
         },
         disabled: !profile.associated_instances,
       },
@@ -118,7 +118,7 @@ const SecurityProfileListActions: FC<SecurityProfileListActionsProps> = ({
     "aria-label": `Duplicate "${profile.title}" security profile`,
     onClick: createPageParamsSetter({
       sidePath: ["duplicate"],
-      profile: profile.id.toString(),
+      name: profile.id.toString(),
     }),
     disabled: profileLimitReached,
   });
diff --git a/src/features/security-profiles/components/SecurityProfileRunFixSidePanel/SecurityProfileRunFixSidePanel.tsx b/src/features/security-profiles/components/SecurityProfileRunFixSidePanel/SecurityProfileRunFixSidePanel.tsx
index bf2f327a4..60c2fa2f4 100644
--- a/src/features/security-profiles/components/SecurityProfileRunFixSidePanel/SecurityProfileRunFixSidePanel.tsx
+++ b/src/features/security-profiles/components/SecurityProfileRunFixSidePanel/SecurityProfileRunFixSidePanel.tsx
@@ -28,7 +28,7 @@ const SecurityProfileRunFixSidePanel: FC = () => {
     return <SidePanel.LoadingState />;
   }
 
-  const closeSidePanel = createPageParamsSetter({ sidePath: [], profile: "" });
+  const closeSidePanel = createPageParamsSetter({ sidePath: [], name: "" });
 
   const handleSubmit = async (event: SyntheticEvent) => {
     event.preventDefault();
diff --git a/src/features/security-profiles/components/SecurityProfilesContainer/SecurityProfilesContainer.tsx b/src/features/security-profiles/components/SecurityProfilesContainer/SecurityProfilesContainer.tsx
index 6b4fd6b05..ccae661fd 100644
--- a/src/features/security-profiles/components/SecurityProfilesContainer/SecurityProfilesContainer.tsx
+++ b/src/features/security-profiles/components/SecurityProfilesContainer/SecurityProfilesContainer.tsx
@@ -167,7 +167,7 @@ const SecurityProfilesContainer: FC<SecurityProfilesContainerProps> = ({
             appearance="link"
             onClick={createPageParamsSetter({
               sidePath: ["edit"],
-              profile: overLimitSecurityProfiles[0].id.toString(),
+              name: overLimitSecurityProfiles[0].id.toString(),
             })}
           >
             Edit profile
diff --git a/src/features/security-profiles/components/SecurityProfilesList/SecurityProfilesList.tsx b/src/features/security-profiles/components/SecurityProfilesList/SecurityProfilesList.tsx
index f96e71598..896d6d077 100644
--- a/src/features/security-profiles/components/SecurityProfilesList/SecurityProfilesList.tsx
+++ b/src/features/security-profiles/components/SecurityProfilesList/SecurityProfilesList.tsx
@@ -61,7 +61,7 @@ const SecurityProfilesList: FC<SecurityProfilesListProps> = ({
                 className="u-no-margin--bottom u-no-padding--top u-align--left"
                 onClick={createPageParamsSetter({
                   sidePath: ["view"],
-                  profile: profile.id.toString(),
+                  name: profile.id.toString(),
                 })}
               >
                 {profile.title}
diff --git a/src/features/security-profiles/hooks/useSecurityProfileForm.tsx b/src/features/security-profiles/hooks/useSecurityProfileForm.tsx
index 34e47c1a4..b059711e4 100644
--- a/src/features/security-profiles/hooks/useSecurityProfileForm.tsx
+++ b/src/features/security-profiles/hooks/useSecurityProfileForm.tsx
@@ -197,7 +197,7 @@ const useSecurityProfileForm = ({
         return;
       }
 
-      setPageParams({ sidePath: [], profile: "" });
+      setPageParams({ sidePath: [], name: "" });
 
       onSuccess(values);
     },
diff --git a/src/features/upgrade-profiles/api/useGetPageUpgradeProfile.ts b/src/features/upgrade-profiles/api/useGetPageUpgradeProfile.ts
index 04dc95c69..0653f95b4 100644
--- a/src/features/upgrade-profiles/api/useGetPageUpgradeProfile.ts
+++ b/src/features/upgrade-profiles/api/useGetPageUpgradeProfile.ts
@@ -11,7 +11,7 @@ const useGetPageUpgradeProfile = ():
       upgradeProfile: undefined;
       isGettingUpgradeProfile: true;
     } => {
-  const { profile: upgradeProfileId } = usePageParams();
+  const { name: upgradeProfileId } = usePageParams();
 
   const { isGettingUpgradeProfile, upgradeProfile, upgradeProfileError } =
     useGetUpgradeProfile(parseInt(upgradeProfileId));
diff --git a/src/features/upgrade-profiles/components/SingleUpgradeProfileForm/SingleUpgradeProfileForm.tsx b/src/features/upgrade-profiles/components/SingleUpgradeProfileForm/SingleUpgradeProfileForm.tsx
index 0fa81c3ef..24e870558 100644
--- a/src/features/upgrade-profiles/components/SingleUpgradeProfileForm/SingleUpgradeProfileForm.tsx
+++ b/src/features/upgrade-profiles/components/SingleUpgradeProfileForm/SingleUpgradeProfileForm.tsx
@@ -46,7 +46,7 @@ const SingleUpgradeProfileForm: FC<SingleUpgradeProfileFormProps> = (props) => {
   const { mutateAsync: createUpgradeProfile } = createUpgradeProfileQuery;
   const { mutateAsync: editUpgradeProfile } = editUpgradeProfileQuery;
 
-  const closeSidePanel = createPageParamsSetter({ sidePath: [], profile: "" });
+  const closeSidePanel = createPageParamsSetter({ sidePath: [], name: "" });
 
   const handleSubmit = async (values: FormProps) => {
     const valuesToSubmit: CreateUpgradeProfileParams = {
diff --git a/src/features/upgrade-profiles/components/UpgradeProfileList/UpgradeProfileList.tsx b/src/features/upgrade-profiles/components/UpgradeProfileList/UpgradeProfileList.tsx
index 33f3d313b..02a5ea3de 100644
--- a/src/features/upgrade-profiles/components/UpgradeProfileList/UpgradeProfileList.tsx
+++ b/src/features/upgrade-profiles/components/UpgradeProfileList/UpgradeProfileList.tsx
@@ -57,7 +57,7 @@ const UpgradeProfileList: FC<UpgradeProfileListProps> = ({ profiles }) => {
               className="u-no-margin--bottom u-no-padding--top u-align-text--left"
               onClick={createPageParamsSetter({
                 sidePath: ["view"],
-                profile: original.id.toString(),
+                name: original.id.toString(),
               })}
             >
               {original.title}
diff --git a/src/features/upgrade-profiles/components/UpgradeProfileListActions/UpgradeProfileListActions.tsx b/src/features/upgrade-profiles/components/UpgradeProfileListActions/UpgradeProfileListActions.tsx
index 5ac68c13c..bafef0246 100644
--- a/src/features/upgrade-profiles/components/UpgradeProfileListActions/UpgradeProfileListActions.tsx
+++ b/src/features/upgrade-profiles/components/UpgradeProfileListActions/UpgradeProfileListActions.tsx
@@ -23,7 +23,7 @@ const UpgradeProfileListActions: FC<UpgradeProfileListActionsProps> = ({
 
   const handleUpgradeProfileEdit = createPageParamsSetter({
     sidePath: ["edit"],
-    profile: profile.id.toString(),
+    name: profile.id.toString(),
   });
 
   const actions: Action[] = [
diff --git a/src/features/upgrade-profiles/components/UpgradeProfileRemoveModal/UpgradeProfileRemoveModal.tsx b/src/features/upgrade-profiles/components/UpgradeProfileRemoveModal/UpgradeProfileRemoveModal.tsx
index 455b21d8c..59f8271f6 100644
--- a/src/features/upgrade-profiles/components/UpgradeProfileRemoveModal/UpgradeProfileRemoveModal.tsx
+++ b/src/features/upgrade-profiles/components/UpgradeProfileRemoveModal/UpgradeProfileRemoveModal.tsx
@@ -31,7 +31,7 @@ const UpgradeProfileRemoveModal: FC<UpgradeProfileRemoveModalProps> = ({
     try {
       await removeUpgradeProfile({ name: upgradeProfile.name });
 
-      setPageParams({ sidePath: [], profile: "" });
+      setPageParams({ sidePath: [], name: "" });
 
       notify.success({
         title: "Upgrade profile removed",
diff --git a/src/features/wsl-profiles/api/useGetPageWslProfile.ts b/src/features/wsl-profiles/api/useGetPageWslProfile.ts
index 0f1c8c438..20dd1521f 100644
--- a/src/features/wsl-profiles/api/useGetPageWslProfile.ts
+++ b/src/features/wsl-profiles/api/useGetPageWslProfile.ts
@@ -11,7 +11,7 @@ const useGetPageWslProfile = ():
       wslProfile: undefined;
       isGettingWslProfile: true;
     } => {
-  const { profile: wslProfileName } = usePageParams();
+  const { name: wslProfileName } = usePageParams();
 
   const { wslProfile, isGettingWslProfile, wslProfileError } = useGetWslProfile(
     { profile_name: wslProfileName },
diff --git a/src/features/wsl-profiles/components/WslProfileAddButton/WslProfileAddButton.tsx b/src/features/wsl-profiles/components/WslProfileAddButton/WslProfileAddButton.tsx
index f0ba9991a..00c998ee7 100644
--- a/src/features/wsl-profiles/components/WslProfileAddButton/WslProfileAddButton.tsx
+++ b/src/features/wsl-profiles/components/WslProfileAddButton/WslProfileAddButton.tsx
@@ -23,7 +23,7 @@ const WslProfileAddButton: FC<WslProfileAddButtonProps> = ({ disabled }) => {
 
   const openAddSidePanel = createPageParamsSetter({
     sidePath: ["add"],
-    profile: "",
+    name: "",
   });
 
   const handleClick = () => {
diff --git a/src/features/wsl-profiles/components/WslProfileEditSidePanel/components/WslProfileEditForm/WslProfileEditForm.tsx b/src/features/wsl-profiles/components/WslProfileEditSidePanel/components/WslProfileEditForm/WslProfileEditForm.tsx
index 04ca2bab7..a6e26067e 100644
--- a/src/features/wsl-profiles/components/WslProfileEditSidePanel/components/WslProfileEditForm/WslProfileEditForm.tsx
+++ b/src/features/wsl-profiles/components/WslProfileEditSidePanel/components/WslProfileEditForm/WslProfileEditForm.tsx
@@ -58,7 +58,7 @@ const WslProfileEditForm: FC<WslProfileEditFormProps> = ({ profile }) => {
       value: name,
     })) ?? [];
 
-  const closeSidePanel = createPageParamsSetter({ sidePath: [], profile: "" });
+  const closeSidePanel = createPageParamsSetter({ sidePath: [], name: "" });
 
   const handleSubmit = async (values: FormProps) => {
     try {
diff --git a/src/features/wsl-profiles/components/WslProfileRemoveModal/WslProfileRemoveModal.tsx b/src/features/wsl-profiles/components/WslProfileRemoveModal/WslProfileRemoveModal.tsx
index 156791316..28bbb4794 100644
--- a/src/features/wsl-profiles/components/WslProfileRemoveModal/WslProfileRemoveModal.tsx
+++ b/src/features/wsl-profiles/components/WslProfileRemoveModal/WslProfileRemoveModal.tsx
@@ -27,7 +27,7 @@ const WslProfileRemoveModal: FC<WslProfileRemoveModalProps> = ({
     try {
       await deleteWslProfile({ name: wslProfile.name });
 
-      setPageParams({ sidePath: [], profile: "" });
+      setPageParams({ sidePath: [], name: "" });
 
       notify.success({
         message: "Instances created by this profile won't be affected.",
diff --git a/src/features/wsl-profiles/components/WslProfilesList/WslProfilesList.tsx b/src/features/wsl-profiles/components/WslProfilesList/WslProfilesList.tsx
index d68f75f32..c4b7e2998 100644
--- a/src/features/wsl-profiles/components/WslProfilesList/WslProfilesList.tsx
+++ b/src/features/wsl-profiles/components/WslProfilesList/WslProfilesList.tsx
@@ -44,7 +44,7 @@ const WslProfilesList: FC = () => {
         Cell: ({ row: { original: wslProfile } }: CellProps<WslProfile>) => {
           const openWslProfileDetails = createPageParamsSetter({
             sidePath: ["view"],
-            profile: wslProfile.name,
+            name: wslProfile.name,
           });
 
           return (
@@ -177,7 +177,7 @@ const WslProfilesList: FC = () => {
             wslProfile={wslProfile}
             onClick={createPageParamsSetter({
               sidePath: ["noncompliant"],
-              profile: wslProfile.name,
+              name: wslProfile.name,
             })}
           />
         ),
diff --git a/src/features/wsl-profiles/components/WslProfilesListActions/WslProfilesListActions.tsx b/src/features/wsl-profiles/components/WslProfilesListActions/WslProfilesListActions.tsx
index 39a2c49b0..843879d5c 100644
--- a/src/features/wsl-profiles/components/WslProfilesListActions/WslProfilesListActions.tsx
+++ b/src/features/wsl-profiles/components/WslProfilesListActions/WslProfilesListActions.tsx
@@ -23,7 +23,7 @@ const WslProfilesListActions: FC<WslProfilesListActionsProps> = ({
 
   const handleWslProfileEdit = createPageParamsSetter({
     sidePath: ["edit"],
-    profile: profile.name,
+    name: profile.name,
   });
 
   const actions: Action[] = [
diff --git a/src/libs/pageParamsManager/constants.ts b/src/libs/pageParamsManager/constants.ts
index 26c1b6a4c..e269543c9 100644
--- a/src/libs/pageParamsManager/constants.ts
+++ b/src/libs/pageParamsManager/constants.ts
@@ -136,12 +136,7 @@ export const PARAMS_CONFIG: ParamsConfig = [
     defaultValue: DEFAULT_EMPTY_ARRAY,
   },
   {
-    urlParam: "profile",
-    shouldResetPage: false,
-    defaultValue: DEFAULT_EMPTY_STRING,
-  },
-  {
-    urlParam: "publication",
+    urlParam: "name",
     shouldResetPage: false,
     defaultValue: DEFAULT_EMPTY_STRING,
   },
diff --git a/src/libs/pageParamsManager/types.ts b/src/libs/pageParamsManager/types.ts
index 6eaba8b06..88196becf 100644
--- a/src/libs/pageParamsManager/types.ts
+++ b/src/libs/pageParamsManager/types.ts
@@ -32,8 +32,7 @@ export interface PageParams {
   wsl: string[];
   code: string;
   sidePath: string[];
-  profile: string;
-  publication: string;
+  name: string;
 }
 
 /**
diff --git a/src/pages/dashboard/instances/[single]/tabs/info/ProfileLink/helpers.ts b/src/pages/dashboard/instances/[single]/tabs/info/ProfileLink/helpers.ts
index 6494f0d78..977efb1bc 100644
--- a/src/pages/dashboard/instances/[single]/tabs/info/ProfileLink/helpers.ts
+++ b/src/pages/dashboard/instances/[single]/tabs/info/ProfileLink/helpers.ts
@@ -6,17 +6,17 @@ export const getTo = (profile: Profile) => {
     case "package":
       return ROUTES.profiles.package({
         sidePath: ["view"],
-        profile: profile.name || "",
+        name: profile.name || "",
       });
     case "reboot":
       return ROUTES.profiles.reboot({
         sidePath: ["view"],
-        profile: profile.id.toString() || "",
+        name: profile.id.toString() || "",
       });
     case "removal":
       return ROUTES.profiles.removal({
         sidePath: ["view"],
-        profile: profile.id.toString() || "",
+        name: profile.id.toString() || "",
       });
     case "repository":
       return ROUTES.repositories.repositoryProfiles({
@@ -26,22 +26,22 @@ export const getTo = (profile: Profile) => {
       return ROUTES.scripts.root({
         tab: "profiles",
         sidePath: ["view"],
-        profile: profile.id.toString() || "",
+        name: profile.id.toString() || "",
       });
     case "security":
       return ROUTES.profiles.security({
         sidePath: ["view"],
-        profile: profile.id.toString() || "",
+        name: profile.id.toString() || "",
       });
     case "upgrade":
       return ROUTES.profiles.upgrade({
         sidePath: ["view"],
-        profile: profile.id.toString() || "",
+        name: profile.id.toString() || "",
       });
     case "wsl":
       return ROUTES.profiles.wsl({
         sidePath: ["view"],
-        profile: profile.name || "",
+        name: profile.name || "",
       });
   }
 };
diff --git a/src/pages/dashboard/profiles/package-profiles/PackageProfilesPage/PackageProfilesPage.tsx b/src/pages/dashboard/profiles/package-profiles/PackageProfilesPage/PackageProfilesPage.tsx
index 5060d82f0..b6d96ce46 100644
--- a/src/pages/dashboard/profiles/package-profiles/PackageProfilesPage/PackageProfilesPage.tsx
+++ b/src/pages/dashboard/profiles/package-profiles/PackageProfilesPage/PackageProfilesPage.tsx
@@ -59,7 +59,7 @@ const PackageProfilesPage: FC = () => {
 
   const handleAddPackageProfile = createPageParamsSetter({
     sidePath: ["add"],
-    profile: "",
+    name: "",
   });
 
   return (
@@ -82,7 +82,7 @@ const PackageProfilesPage: FC = () => {
       </PageContent>
 
       <SidePanel
-        onClose={createPageParamsSetter({ sidePath: [], profile: "" })}
+        onClose={createPageParamsSetter({ sidePath: [], name: "" })}
         isOpen={!!sidePath.length}
         size={
           lastSidePathSegment === "add" ||
diff --git a/src/pages/dashboard/profiles/reboot-profiles/RebootProfilesPage/RebootProfilesPage.tsx b/src/pages/dashboard/profiles/reboot-profiles/RebootProfilesPage/RebootProfilesPage.tsx
index 1a68e9475..05c5aeffe 100644
--- a/src/pages/dashboard/profiles/reboot-profiles/RebootProfilesPage/RebootProfilesPage.tsx
+++ b/src/pages/dashboard/profiles/reboot-profiles/RebootProfilesPage/RebootProfilesPage.tsx
@@ -46,7 +46,7 @@ const RebootProfilesPage: FC = () => {
 
   const handleAddProfile = createPageParamsSetter({
     sidePath: ["add"],
-    profile: "",
+    name: "",
   });
 
   return (
@@ -69,7 +69,7 @@ const RebootProfilesPage: FC = () => {
       </PageContent>
 
       <SidePanel
-        onClose={createPageParamsSetter({ sidePath: [], profile: "" })}
+        onClose={createPageParamsSetter({ sidePath: [], name: "" })}
         key="add"
         isOpen={!!sidePath.length}
       >
diff --git a/src/pages/dashboard/profiles/removal-profiles/RemovalProfilesPage/RemovalProfilesPage.tsx b/src/pages/dashboard/profiles/removal-profiles/RemovalProfilesPage/RemovalProfilesPage.tsx
index 514dd7a08..edb8356f3 100644
--- a/src/pages/dashboard/profiles/removal-profiles/RemovalProfilesPage/RemovalProfilesPage.tsx
+++ b/src/pages/dashboard/profiles/removal-profiles/RemovalProfilesPage/RemovalProfilesPage.tsx
@@ -34,7 +34,7 @@ const RemovalProfilesPage: FC = () => {
 
   const handleCreate = createPageParamsSetter({
     sidePath: ["add"],
-    profile: "",
+    name: "",
   });
 
   return (
@@ -58,7 +58,7 @@ const RemovalProfilesPage: FC = () => {
 
       <SidePanel
         isOpen={!!sidePath.length}
-        onClose={createPageParamsSetter({ sidePath: [], profile: "" })}
+        onClose={createPageParamsSetter({ sidePath: [], name: "" })}
       >
         {lastSidePathSegment === "add" && (
           <SidePanel.Suspense key="add">
diff --git a/src/pages/dashboard/profiles/security-profiles/SecurityProfilesPage/SecurityProfilesPage.tsx b/src/pages/dashboard/profiles/security-profiles/SecurityProfilesPage/SecurityProfilesPage.tsx
index c6584b51f..f6a769920 100644
--- a/src/pages/dashboard/profiles/security-profiles/SecurityProfilesPage/SecurityProfilesPage.tsx
+++ b/src/pages/dashboard/profiles/security-profiles/SecurityProfilesPage/SecurityProfilesPage.tsx
@@ -83,7 +83,7 @@ const SecurityProfilesPage: FC = () => {
 
   const openAddSidePanel = createPageParamsSetter({
     sidePath: ["add"],
-    profile: "",
+    name: "",
   });
 
   return (
@@ -147,7 +147,7 @@ const SecurityProfilesPage: FC = () => {
       </PageContent>
 
       <SidePanel
-        onClose={createPageParamsSetter({ sidePath: [], profile: "" })}
+        onClose={createPageParamsSetter({ sidePath: [], name: "" })}
         isOpen={!!sidePath.length}
         size={lastSidePathSegment === "view" ? "medium" : undefined}
       >
diff --git a/src/pages/dashboard/profiles/upgrade-profiles/UpgradeProfilesPage/UpgradeProfilesPage.tsx b/src/pages/dashboard/profiles/upgrade-profiles/UpgradeProfilesPage/UpgradeProfilesPage.tsx
index ca30a01ee..85ddd81e4 100644
--- a/src/pages/dashboard/profiles/upgrade-profiles/UpgradeProfilesPage/UpgradeProfilesPage.tsx
+++ b/src/pages/dashboard/profiles/upgrade-profiles/UpgradeProfilesPage/UpgradeProfilesPage.tsx
@@ -55,7 +55,7 @@ const UpgradeProfilesPage: FC = () => {
       </PageContent>
 
       <SidePanel
-        onClose={createPageParamsSetter({ sidePath: [], profile: "" })}
+        onClose={createPageParamsSetter({ sidePath: [], name: "" })}
         isOpen={!!sidePath.length}
       >
         {lastSidePathSegment === "add" && (
diff --git a/src/pages/dashboard/profiles/wsl-profiles/WslProfilesPage.tsx b/src/pages/dashboard/profiles/wsl-profiles/WslProfilesPage.tsx
index 54c0d6a9c..dd298c132 100644
--- a/src/pages/dashboard/profiles/wsl-profiles/WslProfilesPage.tsx
+++ b/src/pages/dashboard/profiles/wsl-profiles/WslProfilesPage.tsx
@@ -127,7 +127,7 @@ const WslProfilesPage: FC = () => {
       )}
 
       <SidePanel
-        onClose={createPageParamsSetter({ sidePath: [], profile: "" })}
+        onClose={createPageParamsSetter({ sidePath: [], name: "" })}
         isOpen={!!sidePath.length}
         size={lastSidePathSegment === "noncompliant" ? "large" : undefined}
       >
diff --git a/src/pages/dashboard/repositories/mirrors/MirrorsPage.tsx b/src/pages/dashboard/repositories/mirrors/MirrorsPage.tsx
index d004aef39..0a0de8294 100644
--- a/src/pages/dashboard/repositories/mirrors/MirrorsPage.tsx
+++ b/src/pages/dashboard/repositories/mirrors/MirrorsPage.tsx
@@ -1,118 +1,116 @@
-import LoadingState from "@/components/layout/LoadingState";
+import HeaderWithSearch from "@/components/form/HeaderWithSearch";
+import EmptyState from "@/components/layout/EmptyState";
 import PageContent from "@/components/layout/PageContent";
 import PageHeader from "@/components/layout/PageHeader";
 import PageMain from "@/components/layout/PageMain";
-import { DistributionContainer } from "@/features/mirrors";
-import useSidePanel from "@/hooks/useSidePanel";
-import type { MenuLink } from "@canonical/react-components";
-import { Button, ContextualMenu } from "@canonical/react-components";
-import type { FC } from "react";
-import { lazy, Suspense, useState } from "react";
-import { useMediaQuery } from "usehooks-ts";
+import SidePanel from "@/components/layout/SidePanel";
+import { useListMirrors } from "@/features/mirrors";
+import { MirrorsList } from "@/features/mirrors";
+import useSetDynamicFilterValidation from "@/hooks/useDynamicFilterValidation";
+import usePageParams from "@/hooks/usePageParams";
+import { Button, Icon, ICONS } from "@canonical/react-components";
+import { lazy, type FC } from "react";
 
-const NewDistributionForm = lazy(async () =>
+const EditMirrorForm = lazy(async () =>
   import("@/features/mirrors").then((module) => ({
-    default: module.NewDistributionForm,
+    default: module.EditMirrorForm,
   })),
 );
-const NewSeriesForm = lazy(async () =>
+
+const AddMirrorForm = lazy(async () =>
+  import("@/features/mirrors").then((module) => ({
+    default: module.AddMirrorForm,
+  })),
+);
+
+const MirrorDetails = lazy(async () =>
   import("@/features/mirrors").then((module) => ({
-    default: module.NewSeriesForm,
+    default: module.MirrorDetails,
   })),
 );
 
-const DistributionsPage: FC = () => {
-  const [distributionsLength, setDistributionsLength] = useState(0);
+const PublishMirrorForm = lazy(async () =>
+  import("@/features/mirrors").then((module) => ({
+    default: module.PublishMirrorForm,
+  })),
+);
 
-  const isLargeScreen = useMediaQuery("(min-width: 620px)");
-  const { setSidePanelContent } = useSidePanel();
+const MirrorsPage: FC = () => {
+  const { search, sidePath, lastSidePathSegment, createPageParamsSetter } =
+    usePageParams();
 
-  const handleAddDistribution = () => {
-    setSidePanelContent(
-      "Add distribution",
-      <Suspense fallback={<LoadingState />}>
-        <NewDistributionForm />
-      </Suspense>,
-    );
-  };
+  useSetDynamicFilterValidation("sidePath", ["add", "edit", "publish", "view"]);
 
-  const handleCreateMirror = () => {
-    setSidePanelContent(
-      "Add new mirror",
-      <Suspense fallback={<LoadingState />}>
-        <NewSeriesForm />
-      </Suspense>,
-    );
-  };
+  const { data } = useListMirrors({ filter: search, pageSize: 20 });
+
+  const openAddMirrorForm = createPageParamsSetter({
+    sidePath: ["add"],
+    name: "",
+  });
 
   const buttons = [
-    {
-      label: "Add distribution",
-      ariaLabel: "Add distribution",
-      onClick: handleAddDistribution,
-      disabled: false,
-      appearance: undefined,
-    },
-    {
-      label: "Add mirror",
-      ariaLabel: "Add mirror",
-      onClick: handleCreateMirror,
-      disabled: distributionsLength === 0,
-      appearance: "positive",
-    },
+    <Button key="add" appearance="positive" onClick={openAddMirrorForm} hasIcon>
+      <Icon name={ICONS.plus} light />
+      <span>Add mirror</span>
+    </Button>,
   ];
 
-  const largeScreenButtons = buttons.map((item) => (
-    <Button
-      key={`${item.label}-button`}
-      type="button"
-      className="u-no-margin--right"
-      aria-label={item.ariaLabel}
-      onMouseDown={(event) => {
-        event.preventDefault();
-      }}
-      appearance={item.appearance}
-      disabled={item.disabled}
-      onClick={item.onClick}
-    >
-      {item.label}
-    </Button>
-  ));
-
-  const contextualMenuLinks: MenuLink[] = buttons.map((item) => ({
-    children: item.label,
-    "aria-label": item.ariaLabel,
-    onClick: item.onClick,
-    disabled: item.disabled,
-  }));
+  const { actions, children, hasTable } = data.data.mirrors?.length
+    ? {
+        actions: buttons,
+        children: (
+          <>
+            <HeaderWithSearch />
+            <MirrorsList mirrors={data.data.mirrors} />
+          </>
+        ),
+        hasTable: true,
+      }
+    : {
+        children: (
+          <EmptyState
+            title="You don't have any mirrors yet."
+            body={
+              <>
+                <p>This feature allows you to mirror Debian repositories.</p>
+              </>
+            }
+            cta={buttons}
+          />
+        ),
+      };
 
   return (
     <PageMain>
-      <PageHeader
-        title="Mirrors"
-        actions={
-          isLargeScreen
-            ? largeScreenButtons
-            : [
-                <ContextualMenu
-                  key="menu"
-                  hasToggleIcon
-                  toggleLabel="Actions"
-                  toggleClassName="u-no-margin--bottom"
-                  links={contextualMenuLinks}
-                />,
-              ]
-        }
-      />
-      <PageContent>
-        <DistributionContainer
-          onDistributionsLengthChange={(length) => {
-            setDistributionsLength(length);
-          }}
-        />
-      </PageContent>
+      <PageHeader title="Mirrors" actions={actions} />
+      <PageContent hasTable={hasTable}>{children}</PageContent>
+      <SidePanel
+        onClose={createPageParamsSetter({ sidePath: [], name: "" })}
+        isOpen={!!sidePath.length}
+      >
+        {lastSidePathSegment === "add" && (
+          <SidePanel.Suspense key="add">
+            <AddMirrorForm />
+          </SidePanel.Suspense>
+        )}
+        {lastSidePathSegment === "edit" && (
+          <SidePanel.Suspense key="edit">
+            <EditMirrorForm />
+          </SidePanel.Suspense>
+        )}
+        {lastSidePathSegment === "publish" && (
+          <SidePanel.Suspense key="publish">
+            <PublishMirrorForm />
+          </SidePanel.Suspense>
+        )}
+        {lastSidePathSegment === "view" && (
+          <SidePanel.Suspense key="view">
+            <MirrorDetails />
+          </SidePanel.Suspense>
+        )}
+      </SidePanel>
     </PageMain>
   );
 };
 
-export default DistributionsPage;
+export default MirrorsPage;
diff --git a/src/pages/dashboard/repositories/publications/PublicationsPage.tsx b/src/pages/dashboard/repositories/publications/PublicationsPage.tsx
index acaa0971b..d31ad472c 100644
--- a/src/pages/dashboard/repositories/publications/PublicationsPage.tsx
+++ b/src/pages/dashboard/repositories/publications/PublicationsPage.tsx
@@ -28,7 +28,7 @@ const PublicationsPage: FC = () => {
 
       <SidePanel
         isOpen={!!sidePath.length}
-        onClose={createPageParamsSetter({ sidePath: [], publication: "" })}
+        onClose={createPageParamsSetter({ sidePath: [], name: "" })}
       >
         {sidePath.includes("view") && (
           <SidePanel.Suspense key="view">
diff --git a/src/tests/mocks/mirrors.ts b/src/tests/mocks/mirrors.ts
new file mode 100644
index 000000000..671377a7f
--- /dev/null
+++ b/src/tests/mocks/mirrors.ts
@@ -0,0 +1,30 @@
+import type { Mirror } from "@canonical/landscape-openapi";
+
+export const mirrors = [
+  {
+    name: "mirrors/ubuntu-archive-mirror",
+    mirrorId: "ubuntu-archive-mirror",
+    displayName: "Ubuntu archive mirror",
+    archiveRoot: "https://archive.ubuntu.com/ubuntu",
+    distribution: "jammy",
+    components: ["main", "restricted", "universe", "multiverse"],
+    architectures: ["amd64", "arm64"],
+    downloadInstaller: true,
+    downloadSources: false,
+    downloadUdebs: true,
+    lastDownloadDate: new Date("2024-06-01T12:00:00Z"),
+  },
+  {
+    name: "mirrors/ubuntu-security-mirror",
+    mirrorId: "ubuntu-security-mirror",
+    displayName: "Security mirror",
+    archiveRoot: "https://security.ubuntu.com/ubuntu",
+    distribution: "noble",
+    components: ["main", "universe"],
+    architectures: ["amd64"],
+    downloadInstaller: false,
+    downloadSources: true,
+    downloadUdebs: false,
+    lastDownloadDate: new Date("2024-05-01T12:00:00Z"),
+  },
+] as const satisfies Mirror[];
diff --git a/src/tests/mocks/publications.ts b/src/tests/mocks/publications.ts
index 55f5c4fe9..3151f05ff 100644
--- a/src/tests/mocks/publications.ts
+++ b/src/tests/mocks/publications.ts
@@ -1,6 +1,5 @@
 import type {
   Local,
-  Mirror,
   Publication,
   PublicationTarget,
 } from "@/features/publications";
@@ -43,27 +42,6 @@ export const publications = [
   },
 ] as const satisfies Publication[];
 
-export const mirrors = [
-  {
-    name: "mirrors/ubuntu-archive-mirror",
-    mirrorId: "ubuntu-archive-mirror",
-    displayName: "Ubuntu archive mirror",
-    archiveRoot: "https://archive.ubuntu.com/ubuntu",
-    distribution: "jammy",
-    components: ["main", "restricted", "universe", "multiverse"],
-    architectures: ["amd64", "arm64"],
-  },
-  {
-    name: "mirrors/ubuntu-security-mirror",
-    mirrorId: "ubuntu-security-mirror",
-    displayName: "Security mirror",
-    archiveRoot: "https://security.ubuntu.com/ubuntu",
-    distribution: "noble",
-    components: ["main", "universe"],
-    architectures: ["amd64"],
-  },
-] as const satisfies Mirror[];
-
 export const locals = [
   {
     name: "locals/internal-packages",
diff --git a/src/tests/mocks/repo.ts b/src/tests/mocks/repo.ts
deleted file mode 100644
index a0739b9ae..000000000
--- a/src/tests/mocks/repo.ts
+++ /dev/null
@@ -1,78 +0,0 @@
-import type { RepoInfo } from "@/features/mirrors";
-
-export const repoInfo: RepoInfo = {
-  flat: false,
-  ubuntu: true,
-  repos: [
-    {
-      repo: "xenial",
-      url: "http://archive.ubuntu.com/ubuntu/dists/xenial/InRelease",
-      architectures: "amd64 arm64 armhf i386 powerpc ppc64el s390x",
-      codename: "xenial",
-      description: "Ubuntu Xenial 16.04",
-      label: "Ubuntu",
-      origin: "Ubuntu",
-      version: "16.04",
-    },
-    {
-      repo: "bionic",
-      url: "http://archive.ubuntu.com/ubuntu/dists/bionic/InRelease",
-      architectures: "amd64 arm64 armhf i386 ppc64el s390x",
-      codename: "bionic",
-      description: "Ubuntu Bionic 18.04",
-      label: "Ubuntu",
-      origin: "Ubuntu",
-      version: "18.04",
-    },
-    {
-      repo: "focal",
-      url: "http://archive.ubuntu.com/ubuntu/dists/focal/InRelease",
-      architectures: "amd64 arm64 armhf i386 ppc64el riscv64 s390x",
-      codename: "focal",
-      description: "Ubuntu Focal 20.04",
-      label: "Ubuntu",
-      origin: "Ubuntu",
-      version: "20.04",
-    },
-    {
-      repo: "jammy",
-      url: "http://archive.ubuntu.com/ubuntu/dists/jammy/InRelease",
-      architectures: "amd64 arm64 armhf i386 ppc64el riscv64 s390x",
-      codename: "jammy",
-      description: "Ubuntu Jammy 22.04",
-      label: "Ubuntu",
-      origin: "Ubuntu",
-      version: "22.04",
-    },
-    {
-      repo: "lunar",
-      url: "http://archive.ubuntu.com/ubuntu/dists/lunar/InRelease",
-      architectures: "amd64 arm64 armhf i386 ppc64el riscv64 s390x",
-      codename: "lunar",
-      description: "Ubuntu Lunar 23.04",
-      label: "Ubuntu",
-      origin: "Ubuntu",
-      version: "23.04",
-    },
-    {
-      repo: "mantic",
-      url: "http://archive.ubuntu.com/ubuntu/dists/mantic/InRelease",
-      architectures: "amd64 arm64 armhf i386 ppc64el riscv64 s390x",
-      codename: "mantic",
-      description: "Ubuntu Mantic 23.10",
-      label: "Ubuntu",
-      origin: "Ubuntu",
-      version: "23.10",
-    },
-    {
-      repo: "noble",
-      url: "http://archive.ubuntu.com/ubuntu/dists/noble/InRelease",
-      architectures: "amd64 arm64 armhf i386 ppc64el riscv64 s390x",
-      codename: "noble",
-      description: "Ubuntu Noble 24.04",
-      label: "Ubuntu",
-      origin: "Ubuntu",
-      version: "24.04",
-    },
-  ],
-};
diff --git a/src/tests/mocks/ubuntuArchiveInfo.ts b/src/tests/mocks/ubuntuArchiveInfo.ts
new file mode 100644
index 000000000..847cd0892
--- /dev/null
+++ b/src/tests/mocks/ubuntuArchiveInfo.ts
@@ -0,0 +1,4239 @@
+import type { UbuntuArchiveInfo } from "@/features/mirrors";
+
+export const ubuntuArchiveInfo = {
+  label: "Ubuntu Archive",
+  mirror_type: "archive",
+  mirror_url: "https://archive.ubuntu.com/ubuntu/",
+  distributions: [
+    {
+      slug: "trusty-backports",
+      label: "trusty-backports",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "trusty-proposed",
+      label: "trusty-proposed",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "trusty-security",
+      label: "trusty-security",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "trusty-updates",
+      label: "trusty-updates",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "xenial",
+      label: "xenial",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "powerpc",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "xenial-backports",
+      label: "xenial-backports",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "xenial-proposed",
+      label: "xenial-proposed",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "xenial-security",
+      label: "xenial-security",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "xenial-updates",
+      label: "xenial-updates",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "bionic",
+      label: "bionic",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "bionic-backports",
+      label: "bionic-backports",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "bionic-proposed",
+      label: "bionic-proposed",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "bionic-security",
+      label: "bionic-security",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "bionic-updates",
+      label: "bionic-updates",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "focal",
+      label: "focal",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "focal-backports",
+      label: "focal-backports",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "focal-proposed",
+      label: "focal-proposed",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "focal-security",
+      label: "focal-security",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "focal-updates",
+      label: "focal-updates",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "jammy",
+      label: "jammy",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "jammy-backports",
+      label: "jammy-backports",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "jammy-proposed",
+      label: "jammy-proposed",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "jammy-security",
+      label: "jammy-security",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "jammy-updates",
+      label: "jammy-updates",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "noble",
+      label: "noble",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "noble-backports",
+      label: "noble-backports",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "noble-proposed",
+      label: "noble-proposed",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "noble-security",
+      label: "noble-security",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "noble-updates",
+      label: "noble-updates",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "plucky",
+      label: "plucky",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "plucky-backports",
+      label: "plucky-backports",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "plucky-proposed",
+      label: "plucky-proposed",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "plucky-security",
+      label: "plucky-security",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "plucky-updates",
+      label: "plucky-updates",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "questing",
+      label: "questing",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "amd64v3",
+          preselected: false,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "questing-backports",
+      label: "questing-backports",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "amd64v3",
+          preselected: false,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "questing-proposed",
+      label: "questing-proposed",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "amd64v3",
+          preselected: false,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "questing-security",
+      label: "questing-security",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "amd64v3",
+          preselected: false,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "questing-updates",
+      label: "questing-updates",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "amd64v3",
+          preselected: false,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "resolute-backports",
+      label: "resolute-backports",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "amd64v3",
+          preselected: false,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "resolute-proposed",
+      label: "resolute-proposed",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "amd64v3",
+          preselected: false,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "resolute-security",
+      label: "resolute-security",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "amd64v3",
+          preselected: false,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "resolute-updates",
+      label: "resolute-updates",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "amd64v3",
+          preselected: false,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "resolute",
+      label: "resolute",
+      preselected: true,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+        {
+          slug: "restricted",
+          preselected: false,
+        },
+        {
+          slug: "universe",
+          preselected: false,
+        },
+        {
+          slug: "multiverse",
+          preselected: false,
+        },
+      ],
+      architectures: [
+        {
+          slug: "amd64",
+          preselected: true,
+        },
+        {
+          slug: "amd64v3",
+          preselected: false,
+        },
+        {
+          slug: "arm64",
+          preselected: false,
+        },
+        {
+          slug: "armhf",
+          preselected: false,
+        },
+        {
+          slug: "i386",
+          preselected: false,
+        },
+        {
+          slug: "ppc64el",
+          preselected: false,
+        },
+        {
+          slug: "riscv64",
+          preselected: false,
+        },
+        {
+          slug: "s390x",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "one-component-one-architecture",
+      label: "one-component-one-architecture",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+      ],
+      architectures: [
+        {
+          slug: "i386",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "no-components",
+      label: "no-components",
+      preselected: false,
+      components: [],
+      architectures: [
+        {
+          slug: "i386",
+          preselected: false,
+        },
+      ],
+    },
+    {
+      slug: "no-architectures",
+      label: "no-architectures",
+      preselected: false,
+      components: [
+        {
+          slug: "main",
+          preselected: true,
+        },
+      ],
+      architectures: [],
+    },
+  ],
+} as const satisfies UbuntuArchiveInfo;
+
+export const ubuntuESMInfo = [
+  {
+    label: "Infra",
+    mirror_type: "infra",
+    mirror_url: "https://esm.ubuntu.com/infra/ubuntu/",
+    distributions: [
+      {
+        slug: "precise",
+        label: "precise",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+        ],
+      },
+      {
+        slug: "trusty-infra-security",
+        label: "trusty-infra-security",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "trusty-infra-updates",
+        label: "trusty-infra-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "trusty-security",
+        label: "trusty-security",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "trusty-updates",
+        label: "trusty-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "xenial-infra-security",
+        label: "xenial-infra-security",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "xenial-infra-updates",
+        label: "xenial-infra-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "bionic-infra-security",
+        label: "bionic-infra-security",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "bionic-infra-updates",
+        label: "bionic-infra-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "focal-infra-security",
+        label: "focal-infra-security",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "riscv64",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "focal-infra-updates",
+        label: "focal-infra-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "riscv64",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "jammy-infra-security",
+        label: "jammy-infra-security",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "riscv64",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "jammy-infra-updates",
+        label: "jammy-infra-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "riscv64",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "noble-infra-security",
+        label: "noble-infra-security",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "riscv64",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "noble-infra-updates",
+        label: "noble-infra-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "riscv64",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "resolute-infra-security",
+        label: "resolute-infra-security",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "riscv64",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "resolute-infra-updates",
+        label: "resolute-infra-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "riscv64",
+            preselected: false,
+          },
+        ],
+      },
+    ],
+  },
+  {
+    label: "Apps",
+    mirror_type: "apps",
+    mirror_url: "https://esm.ubuntu.com/apps/ubuntu/",
+    distributions: [
+      {
+        slug: "xenial-apps-security",
+        label: "xenial-apps-security",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "xenial-apps-updates",
+        label: "xenial-apps-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "bionic-apps-security",
+        label: "bionic-apps-security",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "bionic-apps-updates",
+        label: "bionic-apps-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "focal-apps-security",
+        label: "focal-apps-security",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "riscv64",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "focal-apps-updates",
+        label: "focal-apps-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "riscv64",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "jammy-apps-security",
+        label: "jammy-apps-security",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "riscv64",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "jammy-apps-updates",
+        label: "jammy-apps-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "riscv64",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "noble-apps-security",
+        label: "noble-apps-security",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "riscv64",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "noble-apps-updates",
+        label: "noble-apps-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "riscv64",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "resolute-apps-security",
+        label: "resolute-apps-security",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "riscv64",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "resolute-apps-updates",
+        label: "resolute-apps-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "riscv64",
+            preselected: false,
+          },
+        ],
+      },
+    ],
+  },
+  {
+    label: "FIPS Updates",
+    mirror_type: "fips-updates",
+    mirror_url: "https://esm.ubuntu.com/fips-updates/ubuntu/",
+    distributions: [
+      {
+        slug: "xenial-updates",
+        label: "xenial-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "bionic-updates",
+        label: "bionic-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "focal-updates",
+        label: "focal-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "jammy-updates",
+        label: "jammy-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "noble-updates",
+        label: "noble-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+    ],
+  },
+  {
+    label: "CIS",
+    mirror_type: "cis",
+    mirror_url: "https://esm.ubuntu.com/cis/ubuntu/",
+    distributions: [
+      {
+        slug: "xenial",
+        label: "xenial",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+        ],
+      },
+      {
+        slug: "bionic",
+        label: "bionic",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+        ],
+      },
+      {
+        slug: "focal",
+        label: "focal",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "jammy",
+        label: "jammy",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "noble",
+        label: "noble",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+        ],
+      },
+    ],
+  },
+  {
+    label: "Infra Legacy",
+    mirror_type: "infra-legacy",
+    mirror_url: "https://esm.ubuntu.com/infra-legacy/ubuntu/",
+    distributions: [
+      {
+        slug: "trusty-infra-legacy-security",
+        label: "trusty-infra-legacy-security",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "trusty-infra-legacy-updates",
+        label: "trusty-infra-legacy-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "xenial-infra-legacy-security",
+        label: "xenial-infra-legacy-security",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "xenial-infra-legacy-updates",
+        label: "xenial-infra-legacy-updates",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "i386",
+            preselected: false,
+          },
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+          {
+            slug: "armhf",
+            preselected: false,
+          },
+          {
+            slug: "armel",
+            preselected: false,
+          },
+          {
+            slug: "powerpc",
+            preselected: false,
+          },
+          {
+            slug: "ppc64el",
+            preselected: false,
+          },
+          {
+            slug: "s390x",
+            preselected: false,
+          },
+        ],
+      },
+    ],
+  },
+  {
+    label: "Realtime",
+    mirror_type: "realtime",
+    mirror_url: "https://esm.ubuntu.com/realtime/ubuntu/",
+    distributions: [
+      {
+        slug: "jammy",
+        label: "jammy",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+        ],
+      },
+      {
+        slug: "noble",
+        label: "noble",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+          {
+            slug: "arm64",
+            preselected: false,
+          },
+        ],
+      },
+    ],
+  },
+  {
+    label: "Pro service with no valid distributions",
+    mirror_type: "invalid",
+    mirror_url: "https://esm.ubuntu.com/invalid/ubuntu/",
+    distributions: [
+      {
+        slug: "jammy",
+        label: "jammy",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [],
+      },
+    ],
+  },
+] as const satisfies UbuntuArchiveInfo[];
diff --git a/src/tests/server/handlers/_helpers.ts b/src/tests/server/handlers/_helpers.ts
index 2cf7f7a40..704daf7f7 100644
--- a/src/tests/server/handlers/_helpers.ts
+++ b/src/tests/server/handlers/_helpers.ts
@@ -128,3 +128,34 @@ export const parseArray = (paramValue: string | null): string[] => {
     return ids.length > 0 ? ids : [];
   }
 };
+
+export const getDebArchivePaginationParams = (requestUrl: string) => {
+  const { searchParams } = new URL(requestUrl);
+  const pageSize = parseInt(searchParams.get("pageSize") ?? "20", 10);
+  const pageToken = parseInt(searchParams.get("pageToken") ?? "0", 10) || 0;
+
+  return {
+    pageSize,
+    pageToken,
+  };
+};
+
+export const getDebArchivePaginatedResponse = <
+  T extends Record<string, unknown>,
+>(
+  data: T[],
+  pageToken: number,
+  pageSize: number,
+) => {
+  const paginatedData = data.slice(pageToken, pageToken + pageSize);
+
+  const nextPageToken =
+    pageToken + pageSize < data.length
+      ? String(pageToken + pageSize)
+      : undefined;
+
+  return {
+    paginatedData,
+    nextPageToken,
+  };
+};
diff --git a/src/tests/server/handlers/index.ts b/src/tests/server/handlers/index.ts
index 570c1db46..d3e58a165 100644
--- a/src/tests/server/handlers/index.ts
+++ b/src/tests/server/handlers/index.ts
@@ -17,6 +17,7 @@ import gpgKey from "./gpgKey";
 import instance from "./instance";
 import invitations from "./invitations";
 import kernel from "./kernel";
+import mirrors from "./mirrors";
 import oidcIssuers from "./oidcIssuers";
 import organisationPreferences from "./organisationPreferences";
 import packageProfile from "./packageProfile";
@@ -26,8 +27,8 @@ import process from "./process";
 import publications from "./publications";
 import rebootProfiles from "./rebootProfiles";
 import removalProfiles from "./removalProfiles";
-import repo from "./repo";
 import reports from "./reports";
+import repository from "./repository";
 import repositoryProfiles from "./repositoryProfiles";
 import roles from "./roles";
 import scriptProfiles from "./scriptProfiles";
@@ -61,6 +62,7 @@ export default [
   ...instance,
   ...invitations,
   ...kernel,
+  ...mirrors,
   ...organisationPreferences,
   ...packageProfile,
   ...packages,
@@ -69,8 +71,8 @@ export default [
   ...publications,
   ...rebootProfiles,
   ...removalProfiles,
-  ...repo,
   ...reports,
+  ...repository,
   ...repositoryProfiles,
   ...roles,
   ...savedSearches,
diff --git a/src/tests/server/handlers/mirrors.ts b/src/tests/server/handlers/mirrors.ts
new file mode 100644
index 000000000..5bd0c898d
--- /dev/null
+++ b/src/tests/server/handlers/mirrors.ts
@@ -0,0 +1,98 @@
+import { API_URL_DEB_ARCHIVE } from "@/constants";
+import type { BatchGetMirrorsResponse } from "@/features/publications";
+import { getEndpointStatus } from "@/tests/controllers/controller";
+import { mirrors } from "@/tests/mocks/mirrors";
+import type { StrictResponse } from "msw";
+import { delay, http, HttpResponse } from "msw";
+import { ENDPOINT_STATUS_API_ERROR } from "./_constants";
+import type {
+  DeleteMirrorResponse,
+  ListMirrorPackagesResponse,
+  GetMirrorResponse,
+  UpdateMirrorResponse,
+  CreateMirrorResponse,
+  SyncMirrorResponse,
+} from "@canonical/landscape-openapi";
+import {
+  getDebArchivePaginatedResponse,
+  getDebArchivePaginationParams,
+} from "./_helpers";
+
+const getMirrorsResponse = (requestUrl: string) => {
+  const { pageSize, pageToken } = getDebArchivePaginationParams(requestUrl);
+  const { paginatedData, nextPageToken } = getDebArchivePaginatedResponse(
+    mirrors,
+    pageToken,
+    pageSize,
+  );
+
+  return HttpResponse.json({
+    mirrors: paginatedData,
+    nextPageToken,
+  });
+};
+
+const getBatchMirrorsResponse = async (
+  request: Request,
+): Promise<StrictResponse<BatchGetMirrorsResponse>> => {
+  const body = (await request.json()) as { names?: string[] };
+  const requestedNames = body.names ?? [];
+  const matched = mirrors.filter(({ name }) =>
+    name ? requestedNames.includes(name) : false,
+  );
+  return HttpResponse.json({ mirrors: matched });
+};
+
+export default [
+  http.post(`${API_URL_DEB_ARCHIVE}mirrors:batchGet`, async ({ request }) => {
+    return getBatchMirrorsResponse(request);
+  }),
+
+  http.get(`${API_URL_DEB_ARCHIVE}mirrors`, async ({ request }) => {
+    await delay();
+
+    const endpointStatus = getEndpointStatus();
+
+    if (
+      endpointStatus.status === "error" &&
+      endpointStatus.path === "mirrors"
+    ) {
+      return ENDPOINT_STATUS_API_ERROR;
+    }
+
+    return getMirrorsResponse(request.url);
+  }),
+
+  http.post(`${API_URL_DEB_ARCHIVE}mirrors`, async () => {
+    await delay();
+    return HttpResponse.json<CreateMirrorResponse>();
+  }),
+
+  http.get(`${API_URL_DEB_ARCHIVE}mirrors/:mirrorName`, async () => {
+    await delay();
+    return HttpResponse.json<GetMirrorResponse>(mirrors[0]);
+  }),
+
+  http.get(`${API_URL_DEB_ARCHIVE}mirrors/:mirrorName/packages`, async () => {
+    await delay();
+
+    return HttpResponse.json<ListMirrorPackagesResponse>({
+      mirrorPackages: ["package-1", "package-2", "package-3"],
+    });
+  }),
+
+  http.patch(`${API_URL_DEB_ARCHIVE}mirrors/:mirrorName`, async () => {
+    await delay();
+    return HttpResponse.json<UpdateMirrorResponse>();
+  }),
+
+  http.delete(`${API_URL_DEB_ARCHIVE}mirrors/:mirrorName`, async () => {
+    await delay();
+    return HttpResponse.json<DeleteMirrorResponse>();
+  }),
+
+  http.post(`${API_URL_DEB_ARCHIVE}mirrors/:mirrorName\\:sync`, async () => {
+    await delay();
+    return HttpResponse.json<SyncMirrorResponse>();
+  }),
+];
diff --git a/src/tests/server/handlers/pockets.ts b/src/tests/server/handlers/pockets.ts
index e9cca9cb6..d6198b977 100644
--- a/src/tests/server/handlers/pockets.ts
+++ b/src/tests/server/handlers/pockets.ts
@@ -1,97 +1,11 @@
 import { API_URL, API_URL_OLD } from "@/constants";
-import type {
-  DiffPullPocketParams,
-  ListPocketParams,
-} from "@/features/mirrors";
-import type { PackageDiff, PackageObject } from "@/features/packages";
 import { getEndpointStatus } from "@/tests/controllers/controller";
 import { activities } from "@/tests/mocks/activity";
-import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
 import { http, HttpResponse } from "msw";
-import { generatePaginatedResponse, isAction } from "./_helpers";
-import { diffPocket, listPockets } from "@/tests/mocks/pockets";
+import { isAction } from "./_helpers";
 import { getEndpointStatusApiError } from "./_constants";
 
 export default [
-  http.get<never, ListPocketParams, ApiPaginatedResponse<PackageObject>>(
-    API_URL_OLD,
-    ({ request }) => {
-      if (!isAction(request, "ListPocket")) {
-        return;
-      }
-
-      const DEFAULT_PAGE_SIZE = 20;
-
-      const endpointStatus = getEndpointStatus();
-      const url = new URL(request.url);
-      const search = url.searchParams.get("search") ?? "";
-      const offset = Number(url.searchParams.get("offset")) || 0;
-      const limit = Number(url.searchParams.get("limit")) || DEFAULT_PAGE_SIZE;
-      const shouldUseEmptyData =
-        endpointStatus.status === "empty" &&
-        (!endpointStatus.path || endpointStatus.path === "ListPocket");
-      const listPocketSource =
-        endpointStatus.path === "ListPocketMany"
-          ? Array.from({ length: 25 }, (_, index) => {
-              const basePocket = listPockets[index % listPockets.length];
-              if (!basePocket) {
-                throw new Error(
-                  "Expected at least one pocket in mock pocket data",
-                );
-              }
-              return {
-                ...basePocket,
-                name: `${basePocket.name}-${index + 1}`,
-              };
-            })
-          : listPockets;
-
-      return HttpResponse.json(
-        generatePaginatedResponse<PackageObject>({
-          data: shouldUseEmptyData ? [] : listPocketSource,
-          limit,
-          offset,
-          search,
-        }),
-      );
-    },
-  ),
-  http.get<never, DiffPullPocketParams, PackageDiff>(
-    API_URL_OLD,
-    ({ request }) => {
-      if (!isAction(request, "DiffPullPocket")) {
-        return;
-      }
-
-      const endpointStatus = getEndpointStatus();
-
-      if (endpointStatus.path === "DiffPullPocketUpdate") {
-        return HttpResponse.json({
-          "main:amd64": {
-            add: [],
-            update: [["pocket1", "1.0.0", "2.0.0"]],
-            delete: [["pocket2", "1.0.0"]],
-          },
-        });
-      }
-
-      if (endpointStatus.path === "DiffPullPocketAddOnly") {
-        return HttpResponse.json({
-          "main:amd64": {
-            add: [["pocket1", "1.0.0"]],
-            update: [],
-            delete: [],
-          },
-        });
-      }
-
-      if (endpointStatus.path === "DiffPullPocketNoChanges") {
-        return HttpResponse.json({});
-      }
-
-      return HttpResponse.json(diffPocket);
-    },
-  ),
   http.get(API_URL_OLD, async ({ request }) => {
     if (
       !isAction(request, [
diff --git a/src/tests/server/handlers/publications.ts b/src/tests/server/handlers/publications.ts
index 56089c93a..14cd56234 100644
--- a/src/tests/server/handlers/publications.ts
+++ b/src/tests/server/handlers/publications.ts
@@ -2,19 +2,21 @@ import { API_URL_DEB_ARCHIVE } from "@/constants";
 import type {
   PublishPublicationResponse,
   BatchGetPublicationTargetsResponse,
-  BatchGetMirrorsResponse,
   BatchGetLocalsResponse,
 } from "@/features/publications";
 import { getEndpointStatus } from "@/tests/controllers/controller";
 import {
   locals,
-  mirrors,
   publications,
   publicationTargets,
 } from "@/tests/mocks/publications";
 import type { StrictResponse } from "msw";
-import { http, HttpResponse } from "msw";
-import { generateFilteredResponse } from "./_helpers";
+import { delay, http, HttpResponse } from "msw";
+import {
+  generateFilteredResponse,
+  getDebArchivePaginatedResponse,
+  getDebArchivePaginationParams,
+} from "./_helpers";
 import { ENDPOINT_STATUS_API_ERROR } from "./_constants";
 
 const matchesPublicationsPath = (endpointPath?: string) =>
@@ -38,52 +40,9 @@ const toObjectBody = (value: unknown): Record<string, unknown> => {
   return {};
 };
 
-const getPaginationParams = (requestUrl: string) => {
-  const { searchParams } = new URL(requestUrl);
-  const pageSize = parseInt(searchParams.get("pageSize") ?? "20", 10);
-  const pageToken = parseInt(searchParams.get("pageToken") ?? "0", 10) || 0;
-
-  return {
-    pageSize,
-    pageToken,
-  };
-};
-
-const getPaginatedResponse = <T extends Record<string, unknown>>(
-  data: T[],
-  pageToken: number,
-  pageSize: number,
-) => {
-  const paginatedData = data.slice(pageToken, pageToken + pageSize);
-
-  const nextPageToken =
-    pageToken + pageSize < data.length
-      ? String(pageToken + pageSize)
-      : undefined;
-
-  return {
-    paginatedData,
-    nextPageToken,
-  };
-};
-
-const getMirrorsResponse = (requestUrl: string) => {
-  const { pageSize, pageToken } = getPaginationParams(requestUrl);
-  const { paginatedData, nextPageToken } = getPaginatedResponse(
-    mirrors,
-    pageToken,
-    pageSize,
-  );
-
-  return HttpResponse.json({
-    mirrors: paginatedData,
-    nextPageToken,
-  });
-};
-
 const getLocalsResponse = (requestUrl: string) => {
-  const { pageSize, pageToken } = getPaginationParams(requestUrl);
-  const { paginatedData, nextPageToken } = getPaginatedResponse(
+  const { pageSize, pageToken } = getDebArchivePaginationParams(requestUrl);
+  const { paginatedData, nextPageToken } = getDebArchivePaginatedResponse(
     locals,
     pageToken,
     pageSize,
@@ -96,8 +55,8 @@ const getLocalsResponse = (requestUrl: string) => {
 };
 
 const getPublicationTargetsResponse = (requestUrl: string) => {
-  const { pageSize, pageToken } = getPaginationParams(requestUrl);
-  const { paginatedData, nextPageToken } = getPaginatedResponse(
+  const { pageSize, pageToken } = getDebArchivePaginationParams(requestUrl);
+  const { paginatedData, nextPageToken } = getDebArchivePaginatedResponse(
     publicationTargets,
     pageToken,
     pageSize,
@@ -112,7 +71,7 @@ const getPublicationTargetsResponse = (requestUrl: string) => {
 const getPublicationsResponse = (requestUrl: string) => {
   const { searchParams } = new URL(requestUrl);
   const search = searchParams.get("search") ?? undefined;
-  const { pageSize, pageToken } = getPaginationParams(requestUrl);
+  const { pageSize, pageToken } = getDebArchivePaginationParams(requestUrl);
 
   const filteredPublications = search
     ? generateFilteredResponse(publications, search, [
@@ -122,7 +81,7 @@ const getPublicationsResponse = (requestUrl: string) => {
       ])
     : publications;
 
-  const { paginatedData, nextPageToken } = getPaginatedResponse(
+  const { paginatedData, nextPageToken } = getDebArchivePaginatedResponse(
     filteredPublications,
     pageToken,
     pageSize,
@@ -212,17 +171,6 @@ const getBatchPublicationTargetsResponse = async (
   return HttpResponse.json({ publicationTargets: matched });
 };
 
-const getBatchMirrorsResponse = async (
-  request: Request,
-): Promise<StrictResponse<BatchGetMirrorsResponse>> => {
-  const body = (await request.json()) as { names?: string[] };
-  const requestedNames = body.names ?? [];
-  const matched = mirrors.filter(({ name }) =>
-    name ? requestedNames.includes(name) : false,
-  );
-  return HttpResponse.json({ mirrors: matched });
-};
-
 const getBatchLocalsResponse = async (
   request: Request,
 ): Promise<StrictResponse<BatchGetLocalsResponse>> => {
@@ -242,27 +190,10 @@ export default [
     },
   ),
 
-  http.post(`${API_URL_DEB_ARCHIVE}mirrors:batchGet`, async ({ request }) => {
-    return getBatchMirrorsResponse(request);
-  }),
-
   http.post(`${API_URL_DEB_ARCHIVE}locals:batchGet`, async ({ request }) => {
     return getBatchLocalsResponse(request);
   }),
 
-  http.get(`${API_URL_DEB_ARCHIVE}mirrors`, ({ request }) => {
-    const endpointStatus = getEndpointStatus();
-
-    if (
-      endpointStatus.status === "error" &&
-      endpointStatus.path === "mirrors"
-    ) {
-      return ENDPOINT_STATUS_API_ERROR;
-    }
-
-    return getMirrorsResponse(request.url);
-  }),
-
   http.get(`${API_URL_DEB_ARCHIVE}locals`, ({ request }) => {
     const endpointStatus = getEndpointStatus();
 
@@ -296,7 +227,9 @@ export default [
     return getPublicationTargetsResponse(request.url);
   }),
 
-  http.get(`${API_URL_DEB_ARCHIVE}publications`, ({ request }) => {
+  http.get(`${API_URL_DEB_ARCHIVE}publications`, async ({ request }) => {
+    await delay();
+
     const endpointStatus = getEndpointStatus();
 
     if (
diff --git a/src/tests/server/handlers/repo.ts b/src/tests/server/handlers/repo.ts
deleted file mode 100644
index 0d4872ea8..000000000
--- a/src/tests/server/handlers/repo.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { http, HttpResponse } from "msw";
-import { API_URL_OLD } from "@/constants";
-import type { GetRepoInfoParams, RepoInfo } from "@/features/mirrors";
-import { repoInfo } from "@/tests/mocks/repo";
-import { isAction } from "@/tests/server/handlers/_helpers";
-
-export default [
-  http.get<never, GetRepoInfoParams, RepoInfo>(API_URL_OLD, ({ request }) => {
-    if (!isAction(request, "GetRepoInfo")) {
-      return;
-    }
-
-    return HttpResponse.json(repoInfo);
-  }),
-];
diff --git a/src/tests/server/handlers/repository.ts b/src/tests/server/handlers/repository.ts
new file mode 100644
index 000000000..ef8432946
--- /dev/null
+++ b/src/tests/server/handlers/repository.ts
@@ -0,0 +1,25 @@
+import { API_URL } from "@/constants";
+import { delay, http, HttpResponse } from "msw";
+import type { UbuntuArchiveInfo } from "@/features/mirrors";
+import {
+  ubuntuArchiveInfo,
+  ubuntuESMInfo,
+} from "@/tests/mocks/ubuntuArchiveInfo";
+
+export default [
+  http.get(`${API_URL}repository/ubuntu-archive-info`, async ({ request }) => {
+    const archiveType = new URL(request.url).searchParams.get("archive_type");
+
+    await delay();
+
+    if (archiveType === "archive") {
+      return HttpResponse.json<UbuntuArchiveInfo>(ubuntuArchiveInfo);
+    } else if (archiveType === "ESM") {
+      return HttpResponse.json<{ results: UbuntuArchiveInfo[] }>({
+        results: ubuntuESMInfo,
+      });
+    } else {
+      return HttpResponse.json(null, { status: 400 });
+    }
+  }),
+];
diff --git a/src/types/SelectOption.ts b/src/types/SelectOption.ts
index c97ed8a25..b0dd4fd51 100644
--- a/src/types/SelectOption.ts
+++ b/src/types/SelectOption.ts
@@ -1,4 +1,5 @@
 export interface SelectOption {
   label: string;
   value: string;
+  disabled?: boolean;
 }
diff --git a/src/utils/_helpers.ts b/src/utils/_helpers.ts
index 588c195d1..2428f9ae5 100644
--- a/src/utils/_helpers.ts
+++ b/src/utils/_helpers.ts
@@ -95,6 +95,13 @@ export const pluralizeWithCount = (
   return `${count.toLocaleString()} ${pluralize(count, singularForm, pluralForm)}`;
 };
 
+export const pluralizeNew = (
+  count: number,
+  singularForm: string,
+  options: { pluralForm?: string; showCount?: "exact" | "limited" } = {},
+) =>
+  `${options.showCount ? `${count}${options.showCount === "limited" ? "+" : ""} ` : ""}${count === 1 ? singularForm : (options.pluralForm ?? `${singularForm}s`)}`;
+
 export const pluralizeArray = <T>(
   items: readonly T[],
   getSingularForm: (item: T) => string,

From a31c9c337082e0e435e008ca6c62b6151d439b9e Mon Sep 17 00:00:00 2001
From: Gabe Esquivel Gaghi <gabe.gaghi@canonical.com>
Date: Fri, 24 Apr 2026 19:13:36 -0300
Subject: [PATCH 28/42] Local repositories (#566)

## Summary

Adding local repositories page and side panels.

## Release Impact

According to the [Landscape Server Release
Cycle](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `dev` / `main` (Beta)
- **Version Impact**:
  - [ ] Patch (Fix)
  - [x] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [ ] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [x] **UI Verified**: I have verified the changes locally.
- [x] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.

---------

Co-authored-by: Marc Bucchieri <marc.bucchieri@canonical.com>
---
 src/components/form/RadioGroup/RadioGroup.tsx |   2 +
 .../layout/ListActions/constants.ts           |   1 -
 src/features/local-repositories/api/index.ts  |   3 +
 .../api/useCreateLocalRepository.ts           |  27 ++
 .../api/useGetLocalRepositories.ts            |  45 ++++
 .../api/useGetLocalRepository.ts              |  27 ++
 .../api/useGetPageLocalRepository.ts          |  36 +++
 .../api/useGetPublicationsBySource.ts         |  49 ++++
 .../api/useGetRepositoryPackages.ts           |  44 ++++
 .../api/useImportRepositoryPackages.ts        |  27 ++
 .../api/useRemoveLocalRepository.ts           |  29 +++
 .../api/useUpdateLocalRepository.ts           |  32 +++
 .../AddLocalRepositoryButton.tsx              |  17 ++
 .../AddLocalRepositoryButton/index.ts         |   1 +
 .../AddLocalRepositorySidePanel.tsx           | 111 ++++++++
 .../AddLocalRepositorySidePanel/constants.ts  |  22 ++
 .../AddLocalRepositorySidePanel/index.ts      |   1 +
 .../EditLocalRepositoryForm.tsx               | 111 ++++++++
 .../EditLocalRepositoryForm/constants.ts      |  11 +
 .../EditLocalRepositoryForm/index.ts          |   1 +
 .../EditLocalRepositorySidePanel.tsx          |  23 ++
 .../EditLocalRepositorySidePanel/index.ts     |   1 +
 ...ortRepositoryPackagesSidePanel.module.scss |  16 ++
 .../ImportRepositoryPackagesSidePanel.tsx     | 193 ++++++++++++++
 .../index.ts                                  |   1 +
 .../LocalRepositoriesContainer.tsx            |  58 +++++
 .../LocalRepositoriesContainer/index.ts       |   1 +
 .../LocalRepositoriesList.tsx                 | 113 +++++++++
 .../LocalRepositoriesListActions.tsx          |  59 +++++
 .../LocalRepositoriesListActions/index.ts     |   1 +
 .../LocalRepositoryPackagesCount.tsx          |  25 ++
 .../LocalRepositoryPackagesCount/index.ts     |   1 +
 .../LocalRepositoryPublicationsCount.tsx      |  39 +++
 .../LocalRepositoryPublicationsCount/index.ts |   1 +
 .../components/LocalRepositoriesList/index.ts |   1 +
 .../LocalRepositoryPublicationsList.tsx       |  81 ++++++
 .../LocalRepositoryPublicationsList/index.ts  |   1 +
 .../NoPublicationTargetsModal.tsx             |  35 +++
 .../NoPublicationTargetsModal/index.ts        |   1 +
 .../PublishLocalRepositoryGuard.tsx           |  34 +++
 .../PublishLocalRepositoryGuard/index.ts      |   1 +
 ...ublishLocalRepositorySidePanel.module.scss |  32 +++
 .../PublishLocalRepositorySidePanel.tsx       |  58 +++++
 .../PublishRepositoryContentsBlock.tsx        |  30 +++
 .../PublishRepositoryContentsBlock/index.ts   |   1 +
 .../PublishRepositoryExistingForm.tsx         | 207 +++++++++++++++
 .../PublishRepositoryExistingForm/index.ts    |   1 +
 .../PublishRepositoryNewForm.tsx              | 236 ++++++++++++++++++
 .../PublishRepositoryNewForm/index.ts         |   1 +
 .../constants.ts                              |  35 +++
 .../PublishLocalRepositorySidePanel/index.ts  |   1 +
 .../RemoveLocalRepositoryModal.tsx            |  90 +++++++
 .../RemoveLocalRepositoryModal/index.ts       |   1 +
 .../ViewLocalRepositorySidePanel.module.scss  |   5 +
 .../ViewLocalRepositorySidePanel.tsx          |  67 +++++
 .../LocalRepositoryPackagesList.tsx           |  65 +++++
 .../LocalRepositoryPackagesList/index.ts      |   1 +
 .../ViewLocalRepositoryDetailsTab.tsx         |  51 ++++
 .../ViewLocalRepositoryDetailsTab/index.ts    |   1 +
 .../ViewRepositoryActionsBlock.tsx            |  83 ++++++
 .../ViewRepositoryActionsBlock/index.ts       |   1 +
 .../ViewLocalRepositorySidePanel/index.ts     |   1 +
 .../local-repositories/hooks/index.ts         |   1 +
 .../hooks/useGetRepositoryActions.ts          |  71 ++++++
 src/features/local-repositories/index.ts      |  17 ++
 .../types/LocalRepository.ts                  |  35 +++
 src/features/local-repositories/types/Task.ts |   9 +
 .../local-repositories/types/index.ts         |   8 +
 src/features/mirrors/types/Architecture.ts    |   2 +-
 .../api/useGetPublicationTargets.ts           |  37 +++
 src/features/publication-targets/index.ts     |   2 +
 .../types/PublicationTarget.ts                |   5 +
 .../publications/api/useAddPublication.ts     |  43 ++++
 .../publications/api/usePublishPublicaton.ts  |  33 +++
 .../RemovePublicationModal.test.tsx           |  12 +-
 .../RepublishPublicationModal.test.tsx        |   4 +-
 src/features/publications/index.ts            |   4 +-
 .../publications/types/Publication.ts         |  36 +--
 src/features/publications/types/index.ts      |   3 -
 .../LocalRepositoriesPage.tsx                 | 161 +++++++-----
 src/styles/partials/icons.scss                |   6 +
 .../dashboard/Navigation/constants.ts         |  12 +-
 .../SecondaryNavigation.test.tsx              |  10 +-
 src/tests/mocks/localRepositories.ts          |  61 +++++
 src/tests/mocks/publications.ts               |  88 +++++--
 src/tests/server/handlers/index.ts            |   2 +
 src/tests/server/handlers/localRepository.ts  | 107 ++++++++
 src/tests/server/handlers/publications.ts     |  69 +----
 88 files changed, 2885 insertions(+), 204 deletions(-)
 create mode 100644 src/features/local-repositories/api/index.ts
 create mode 100644 src/features/local-repositories/api/useCreateLocalRepository.ts
 create mode 100644 src/features/local-repositories/api/useGetLocalRepositories.ts
 create mode 100644 src/features/local-repositories/api/useGetLocalRepository.ts
 create mode 100644 src/features/local-repositories/api/useGetPageLocalRepository.ts
 create mode 100644 src/features/local-repositories/api/useGetPublicationsBySource.ts
 create mode 100644 src/features/local-repositories/api/useGetRepositoryPackages.ts
 create mode 100644 src/features/local-repositories/api/useImportRepositoryPackages.ts
 create mode 100644 src/features/local-repositories/api/useRemoveLocalRepository.ts
 create mode 100644 src/features/local-repositories/api/useUpdateLocalRepository.ts
 create mode 100644 src/features/local-repositories/components/AddLocalRepositoryButton/AddLocalRepositoryButton.tsx
 create mode 100644 src/features/local-repositories/components/AddLocalRepositoryButton/index.ts
 create mode 100644 src/features/local-repositories/components/AddLocalRepositorySidePanel/AddLocalRepositorySidePanel.tsx
 create mode 100644 src/features/local-repositories/components/AddLocalRepositorySidePanel/constants.ts
 create mode 100644 src/features/local-repositories/components/AddLocalRepositorySidePanel/index.ts
 create mode 100644 src/features/local-repositories/components/EditLocalRepositorySidePanel/EditLocalRepositoryForm/EditLocalRepositoryForm.tsx
 create mode 100644 src/features/local-repositories/components/EditLocalRepositorySidePanel/EditLocalRepositoryForm/constants.ts
 create mode 100644 src/features/local-repositories/components/EditLocalRepositorySidePanel/EditLocalRepositoryForm/index.ts
 create mode 100644 src/features/local-repositories/components/EditLocalRepositorySidePanel/EditLocalRepositorySidePanel.tsx
 create mode 100644 src/features/local-repositories/components/EditLocalRepositorySidePanel/index.ts
 create mode 100644 src/features/local-repositories/components/ImportRepositoryPackagesSidePanel/ImportRepositoryPackagesSidePanel.module.scss
 create mode 100644 src/features/local-repositories/components/ImportRepositoryPackagesSidePanel/ImportRepositoryPackagesSidePanel.tsx
 create mode 100644 src/features/local-repositories/components/ImportRepositoryPackagesSidePanel/index.ts
 create mode 100644 src/features/local-repositories/components/LocalRepositoriesContainer/LocalRepositoriesContainer.tsx
 create mode 100644 src/features/local-repositories/components/LocalRepositoriesContainer/index.ts
 create mode 100644 src/features/local-repositories/components/LocalRepositoriesList/LocalRepositoriesList.tsx
 create mode 100644 src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoriesListActions/LocalRepositoriesListActions.tsx
 create mode 100644 src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoriesListActions/index.ts
 create mode 100644 src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPackagesCount/LocalRepositoryPackagesCount.tsx
 create mode 100644 src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPackagesCount/index.ts
 create mode 100644 src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPublicationsCount/LocalRepositoryPublicationsCount.tsx
 create mode 100644 src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPublicationsCount/index.ts
 create mode 100644 src/features/local-repositories/components/LocalRepositoriesList/index.ts
 create mode 100644 src/features/local-repositories/components/LocalRepositoryPublicationsList/LocalRepositoryPublicationsList.tsx
 create mode 100644 src/features/local-repositories/components/LocalRepositoryPublicationsList/index.ts
 create mode 100644 src/features/local-repositories/components/NoPublicationTargetsModal/NoPublicationTargetsModal.tsx
 create mode 100644 src/features/local-repositories/components/NoPublicationTargetsModal/index.ts
 create mode 100644 src/features/local-repositories/components/PublishLocalRepositoryGuard/PublishLocalRepositoryGuard.tsx
 create mode 100644 src/features/local-repositories/components/PublishLocalRepositoryGuard/index.ts
 create mode 100644 src/features/local-repositories/components/PublishLocalRepositorySidePanel/PublishLocalRepositorySidePanel.module.scss
 create mode 100644 src/features/local-repositories/components/PublishLocalRepositorySidePanel/PublishLocalRepositorySidePanel.tsx
 create mode 100644 src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryContentsBlock/PublishRepositoryContentsBlock.tsx
 create mode 100644 src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryContentsBlock/index.ts
 create mode 100644 src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryExistingForm/PublishRepositoryExistingForm.tsx
 create mode 100644 src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryExistingForm/index.ts
 create mode 100644 src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryNewForm/PublishRepositoryNewForm.tsx
 create mode 100644 src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryNewForm/index.ts
 create mode 100644 src/features/local-repositories/components/PublishLocalRepositorySidePanel/constants.ts
 create mode 100644 src/features/local-repositories/components/PublishLocalRepositorySidePanel/index.ts
 create mode 100644 src/features/local-repositories/components/RemoveLocalRepositoryModal/RemoveLocalRepositoryModal.tsx
 create mode 100644 src/features/local-repositories/components/RemoveLocalRepositoryModal/index.ts
 create mode 100644 src/features/local-repositories/components/ViewLocalRepositorySidePanel/ViewLocalRepositorySidePanel.module.scss
 create mode 100644 src/features/local-repositories/components/ViewLocalRepositorySidePanel/ViewLocalRepositorySidePanel.tsx
 create mode 100644 src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/LocalRepositoryPackagesList/LocalRepositoryPackagesList.tsx
 create mode 100644 src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/LocalRepositoryPackagesList/index.ts
 create mode 100644 src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/ViewLocalRepositoryDetailsTab/ViewLocalRepositoryDetailsTab.tsx
 create mode 100644 src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/ViewLocalRepositoryDetailsTab/index.ts
 create mode 100644 src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/ViewRepositoryActionsBlock/ViewRepositoryActionsBlock.tsx
 create mode 100644 src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/ViewRepositoryActionsBlock/index.ts
 create mode 100644 src/features/local-repositories/components/ViewLocalRepositorySidePanel/index.ts
 create mode 100644 src/features/local-repositories/hooks/index.ts
 create mode 100644 src/features/local-repositories/hooks/useGetRepositoryActions.ts
 create mode 100644 src/features/local-repositories/index.ts
 create mode 100644 src/features/local-repositories/types/LocalRepository.ts
 create mode 100644 src/features/local-repositories/types/Task.ts
 create mode 100644 src/features/local-repositories/types/index.ts
 create mode 100644 src/features/publication-targets/api/useGetPublicationTargets.ts
 create mode 100644 src/features/publication-targets/index.ts
 create mode 100644 src/features/publication-targets/types/PublicationTarget.ts
 create mode 100644 src/features/publications/api/useAddPublication.ts
 create mode 100644 src/features/publications/api/usePublishPublicaton.ts
 create mode 100644 src/tests/mocks/localRepositories.ts
 create mode 100644 src/tests/server/handlers/localRepository.ts

diff --git a/src/components/form/RadioGroup/RadioGroup.tsx b/src/components/form/RadioGroup/RadioGroup.tsx
index 94fd2c78f..74f6a0a53 100644
--- a/src/components/form/RadioGroup/RadioGroup.tsx
+++ b/src/components/form/RadioGroup/RadioGroup.tsx
@@ -26,6 +26,8 @@ interface RadioGroupProps<
     onSelect?: () => Promise<void> | void;
   })[];
   readonly label?: ReactNode;
+  readonly labelHeading?: boolean;
+  readonly sideByside?: boolean;
 }
 
 const RadioGroup = <
diff --git a/src/components/layout/ListActions/constants.ts b/src/components/layout/ListActions/constants.ts
index 37a68931d..377d34bac 100644
--- a/src/components/layout/ListActions/constants.ts
+++ b/src/components/layout/ListActions/constants.ts
@@ -1,7 +1,6 @@
 import classes from "./ListActions.module.scss";
 
 export const LIST_ACTIONS_COLUMN_PROPS = {
-  accessor: "actions",
   className: classes.actions,
   disableSortBy: true,
   Header: "Actions",
diff --git a/src/features/local-repositories/api/index.ts b/src/features/local-repositories/api/index.ts
new file mode 100644
index 000000000..d222f76ef
--- /dev/null
+++ b/src/features/local-repositories/api/index.ts
@@ -0,0 +1,3 @@
+export { useGetLocalRepositories } from "./useGetLocalRepositories";
+export { useGetRepositoryPackages } from "./useGetRepositoryPackages";
+export { useRemoveLocalRepository } from "./useRemoveLocalRepository";
diff --git a/src/features/local-repositories/api/useCreateLocalRepository.ts b/src/features/local-repositories/api/useCreateLocalRepository.ts
new file mode 100644
index 000000000..292d96a61
--- /dev/null
+++ b/src/features/local-repositories/api/useCreateLocalRepository.ts
@@ -0,0 +1,27 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+import type { Local } from "../types";
+import type { CreateLocalRequest } from "../types/LocalRepository";
+
+export const useCreateLocalRepository = () => {
+  const authFetchDebArchive = useFetchDebArchive();
+  const queryClient = useQueryClient();
+
+  const { mutateAsync, isPending } = useMutation<
+    AxiosResponse<Local>,
+    AxiosError<ApiError>,
+    CreateLocalRequest
+  >({
+    mutationKey: ["local", "create"],
+    mutationFn: async (params) => authFetchDebArchive.post("locals", params),
+    onSuccess: async () =>
+      queryClient.invalidateQueries({ queryKey: ["locals"] }),
+  });
+
+  return {
+    createRepository: mutateAsync,
+    isCreatingRepository: isPending,
+  };
+};
diff --git a/src/features/local-repositories/api/useGetLocalRepositories.ts b/src/features/local-repositories/api/useGetLocalRepositories.ts
new file mode 100644
index 000000000..b65bbec97
--- /dev/null
+++ b/src/features/local-repositories/api/useGetLocalRepositories.ts
@@ -0,0 +1,45 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError } from "axios";
+import type { Local } from "../types";
+
+interface ListLocalsResponse {
+  locals: Local[];
+  next_page_token: string;
+}
+
+export const useGetLocalRepositories = (search?: string) => {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  const { data, isPending } = useQuery<Local[], AxiosError<ApiError>>({
+    queryKey: ["locals", search],
+    queryFn: async () => {
+      let page_token: string | undefined;
+      const repositories: Local[] = [];
+
+      do {
+        const response = await authFetchDebArchive.get<ListLocalsResponse>(
+          "locals",
+          {
+            params: {
+              filter: search ? `display_name="*${search}*"` : undefined,
+              page_size: 1000,
+              page_token,
+            },
+          },
+        );
+
+        repositories.push(...(response.data.locals ?? []));
+        page_token = response.data.next_page_token;
+      } while (page_token);
+
+      return repositories;
+    },
+  });
+
+  return {
+    repositories: data ?? [],
+    isGettingRepositories: isPending,
+  };
+};
diff --git a/src/features/local-repositories/api/useGetLocalRepository.ts b/src/features/local-repositories/api/useGetLocalRepository.ts
new file mode 100644
index 000000000..7296c3d81
--- /dev/null
+++ b/src/features/local-repositories/api/useGetLocalRepository.ts
@@ -0,0 +1,27 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+import type { Local } from "../types";
+
+export const useGetLocalRepository = (name: string) => {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  const {
+    data: response,
+    isPending,
+    error,
+  } = useQuery<AxiosResponse<Local>, AxiosError<ApiError>>({
+    queryKey: ["local", name],
+    queryFn: async () => authFetchDebArchive.get(name),
+  });
+
+  return {
+    repository: response?.data,
+    repositoryError:
+      response && !response.data
+        ? new Error(`The local repository "${name}" could not be found.`)
+        : error,
+    isGettingRepository: isPending,
+  };
+};
diff --git a/src/features/local-repositories/api/useGetPageLocalRepository.ts b/src/features/local-repositories/api/useGetPageLocalRepository.ts
new file mode 100644
index 000000000..baf6dddc1
--- /dev/null
+++ b/src/features/local-repositories/api/useGetPageLocalRepository.ts
@@ -0,0 +1,36 @@
+import type { Local } from "../types";
+import { useGetLocalRepository } from "./useGetLocalRepository";
+import usePageParams from "@/hooks/usePageParams";
+
+type GetPageLocalRepositoryReturnType =
+  | {
+      repository: Local;
+      isGettingRepository: false;
+    }
+  | {
+      repository: undefined;
+      isGettingRepository: true;
+    };
+
+export const useGetPageLocalRepository =
+  (): GetPageLocalRepositoryReturnType => {
+    const { name } = usePageParams();
+    const { repository, isGettingRepository, repositoryError } =
+      useGetLocalRepository(`locals/${name}`);
+
+    if (repositoryError) {
+      throw repositoryError;
+    }
+
+    if (isGettingRepository) {
+      return {
+        repository: undefined,
+        isGettingRepository: true,
+      };
+    }
+
+    return {
+      repository: repository as Local,
+      isGettingRepository: false,
+    };
+  };
diff --git a/src/features/local-repositories/api/useGetPublicationsBySource.ts b/src/features/local-repositories/api/useGetPublicationsBySource.ts
new file mode 100644
index 000000000..d64d32c9e
--- /dev/null
+++ b/src/features/local-repositories/api/useGetPublicationsBySource.ts
@@ -0,0 +1,49 @@
+import type { Publication } from "@/features/publications";
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError } from "axios";
+
+interface ListPublicationsResponse {
+  publications: Publication[];
+  next_page_token?: string;
+}
+
+const useGetPublicationsBySource = (source?: string) => {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  const { data, isLoading } = useQuery<Publication[], AxiosError<ApiError>>({
+    queryKey: ["publications", source],
+    enabled: !!source,
+    queryFn: async () => {
+      let page_token: string | undefined;
+      const publications: Publication[] = [];
+
+      do {
+        const response =
+          await authFetchDebArchive.get<ListPublicationsResponse>(
+            "publications",
+            {
+              params: {
+                filter: `source="${source}"`,
+                page_size: 1000,
+                page_token,
+              },
+            },
+          );
+
+        publications.push(...(response.data.publications ?? []));
+        page_token = response.data.next_page_token;
+      } while (page_token);
+
+      return publications;
+    },
+  });
+
+  return {
+    publications: data ?? [],
+    isGettingPublications: isLoading,
+  };
+};
+
+export default useGetPublicationsBySource;
diff --git a/src/features/local-repositories/api/useGetRepositoryPackages.ts b/src/features/local-repositories/api/useGetRepositoryPackages.ts
new file mode 100644
index 000000000..ecbbe67a0
--- /dev/null
+++ b/src/features/local-repositories/api/useGetRepositoryPackages.ts
@@ -0,0 +1,44 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError } from "axios";
+
+interface ListLocalPackagesResponse {
+  local_packages: string[];
+  next_page_token: string;
+}
+
+export const useGetRepositoryPackages = (repository: string) => {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  const { data, isPending } = useQuery<string[], AxiosError<ApiError>>({
+    queryKey: ["packages", repository],
+    queryFn: async () => {
+      let page_token: string | undefined;
+      const packages: string[] = [];
+
+      do {
+        const response =
+          await authFetchDebArchive.get<ListLocalPackagesResponse>(
+            `${repository}/packages`,
+            {
+              params: {
+                page_size: 1000,
+                page_token,
+              },
+            },
+          );
+
+        packages.push(...(response.data.local_packages ?? []));
+        page_token = response.data.next_page_token;
+      } while (page_token);
+
+      return packages;
+    },
+  });
+
+  return {
+    packages: data?.map((name) => ({ name: name })) ?? [],
+    isGettingRepositoryPackages: isPending,
+  };
+};
diff --git a/src/features/local-repositories/api/useImportRepositoryPackages.ts b/src/features/local-repositories/api/useImportRepositoryPackages.ts
new file mode 100644
index 000000000..2bf0e48a6
--- /dev/null
+++ b/src/features/local-repositories/api/useImportRepositoryPackages.ts
@@ -0,0 +1,27 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+import type { ImportLocalPackagesRequest, Task } from "../types";
+
+export const useImportRepositoryPackages = () => {
+  const authFetchDebArchive = useFetchDebArchive();
+  const queryClient = useQueryClient();
+
+  const { mutateAsync, isPending } = useMutation<
+    AxiosResponse<Task>,
+    AxiosError<ApiError>,
+    ImportLocalPackagesRequest
+  >({
+    mutationKey: ["locals", "packages", "import"],
+    mutationFn: async ({ name, ...params }) =>
+      authFetchDebArchive.post(`${name}:importPackages`, params),
+    onSuccess: async () =>
+      queryClient.invalidateQueries({ queryKey: ["locals", "packages"] }),
+  });
+
+  return {
+    importRepositoryPackages: mutateAsync,
+    isImportingRepositoryPackages: isPending,
+  };
+};
diff --git a/src/features/local-repositories/api/useRemoveLocalRepository.ts b/src/features/local-repositories/api/useRemoveLocalRepository.ts
new file mode 100644
index 000000000..cb0d0f740
--- /dev/null
+++ b/src/features/local-repositories/api/useRemoveLocalRepository.ts
@@ -0,0 +1,29 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+
+interface RemoveLocalRepositoryParams {
+  name: string;
+}
+
+export const useRemoveLocalRepository = () => {
+  const authFetchDebArchive = useFetchDebArchive();
+  const queryClient = useQueryClient();
+
+  const { mutateAsync, isPending } = useMutation<
+    AxiosResponse,
+    AxiosError<ApiError>,
+    RemoveLocalRepositoryParams
+  >({
+    mutationKey: ["locals", "delete"],
+    mutationFn: async ({ name }) => authFetchDebArchive.delete(name),
+    onSuccess: async () =>
+      queryClient.invalidateQueries({ queryKey: ["locals"] }),
+  });
+
+  return {
+    removeRepository: mutateAsync,
+    isRemovingRepository: isPending,
+  };
+};
diff --git a/src/features/local-repositories/api/useUpdateLocalRepository.ts b/src/features/local-repositories/api/useUpdateLocalRepository.ts
new file mode 100644
index 000000000..2926412a0
--- /dev/null
+++ b/src/features/local-repositories/api/useUpdateLocalRepository.ts
@@ -0,0 +1,32 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+import type { Local } from "../types";
+
+interface UpdateLocalRepositoryParams {
+  readonly local: Partial<Local> & Required<Pick<Local, "name">>;
+  readonly field_mask?: string[];
+}
+
+export const useUpdateLocalRepository = () => {
+  const authFetchDebArchive = useFetchDebArchive();
+  const queryClient = useQueryClient();
+
+  const { mutateAsync, isPending } = useMutation<
+    AxiosResponse<Local>,
+    AxiosError<ApiError>,
+    UpdateLocalRepositoryParams
+  >({
+    mutationKey: ["local", "update"],
+    mutationFn: async (params) =>
+      authFetchDebArchive.patch(params.local.name, params),
+    onSuccess: async () =>
+      queryClient.invalidateQueries({ queryKey: ["locals"] }),
+  });
+
+  return {
+    updateRepository: mutateAsync,
+    isUpdatingRepository: isPending,
+  };
+};
diff --git a/src/features/local-repositories/components/AddLocalRepositoryButton/AddLocalRepositoryButton.tsx b/src/features/local-repositories/components/AddLocalRepositoryButton/AddLocalRepositoryButton.tsx
new file mode 100644
index 000000000..907d82150
--- /dev/null
+++ b/src/features/local-repositories/components/AddLocalRepositoryButton/AddLocalRepositoryButton.tsx
@@ -0,0 +1,17 @@
+import usePageParams from "@/hooks/usePageParams";
+import { Button, Icon } from "@canonical/react-components";
+import type { FC } from "react";
+
+const AddLocalRepositoryButton: FC = () => {
+  const { createPageParamsSetter } = usePageParams();
+  const handleOpen = createPageParamsSetter({ sidePath: ["add"] });
+
+  return (
+    <Button appearance="positive" hasIcon onClick={handleOpen} type="button">
+      <Icon name="plus" light />
+      <span>Add local repository</span>
+    </Button>
+  );
+};
+
+export default AddLocalRepositoryButton;
diff --git a/src/features/local-repositories/components/AddLocalRepositoryButton/index.ts b/src/features/local-repositories/components/AddLocalRepositoryButton/index.ts
new file mode 100644
index 000000000..04ba30ba0
--- /dev/null
+++ b/src/features/local-repositories/components/AddLocalRepositoryButton/index.ts
@@ -0,0 +1 @@
+export { default } from "./AddLocalRepositoryButton";
diff --git a/src/features/local-repositories/components/AddLocalRepositorySidePanel/AddLocalRepositorySidePanel.tsx b/src/features/local-repositories/components/AddLocalRepositorySidePanel/AddLocalRepositorySidePanel.tsx
new file mode 100644
index 000000000..370411667
--- /dev/null
+++ b/src/features/local-repositories/components/AddLocalRepositorySidePanel/AddLocalRepositorySidePanel.tsx
@@ -0,0 +1,111 @@
+import type { FC } from "react";
+import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
+import SidePanel from "@/components/layout/SidePanel";
+import useDebug from "@/hooks/useDebug";
+import useNotify from "@/hooks/useNotify";
+import usePageParams from "@/hooks/usePageParams";
+import { getFormikError } from "@/utils/formikErrors";
+import { Form, Input } from "@canonical/react-components";
+import { useFormik } from "formik";
+import {
+  type AddLocalRepositoryFormValues,
+  INITIAL_VALUES,
+  VALIDATION_SCHEMA,
+} from "./constants";
+import { useCreateLocalRepository } from "../../api/useCreateLocalRepository";
+import Blocks from "@/components/layout/Blocks";
+
+const AddLocalRepositorySidePanel: FC = () => {
+  const debug = useDebug();
+  const { notify } = useNotify();
+  const { createPageParamsSetter } = usePageParams();
+  const { createRepository, isCreatingRepository } = useCreateLocalRepository();
+
+  const closeSidePanel = createPageParamsSetter({
+    sidePath: [],
+    name: "",
+  });
+
+  const handleSubmit = async (values: AddLocalRepositoryFormValues) => {
+    const valuesforCreation = {
+      display_name: values.name,
+      comment: values.description,
+      distribution: values.distribution,
+      component: values.component,
+    };
+
+    try {
+      await createRepository(valuesforCreation);
+
+      closeSidePanel();
+
+      notify.success({
+        title: `You have successfully added ${values.name}`,
+        message:
+          "The local repository has been created and is now available to import packages.",
+      });
+    } catch (error) {
+      debug(error);
+    }
+  };
+
+  const formik = useFormik({
+    initialValues: INITIAL_VALUES,
+    onSubmit: handleSubmit,
+    validationSchema: VALIDATION_SCHEMA,
+    validateOnMount: true,
+  });
+
+  return (
+    <>
+      <SidePanel.Header>Add local repository</SidePanel.Header>
+      <SidePanel.Content>
+        <Form onSubmit={formik.handleSubmit} noValidate>
+          <Blocks>
+            <Blocks.Item title="Details">
+              <Input
+                type="text"
+                label="Name"
+                required
+                {...formik.getFieldProps("name")}
+                error={getFormikError(formik, "name")}
+              />
+
+              <Input
+                type="text"
+                label="Description"
+                autoComplete="off"
+                {...formik.getFieldProps("description")}
+                error={getFormikError(formik, "description")}
+              />
+
+              <Input
+                type="text"
+                label="Distribution"
+                required
+                {...formik.getFieldProps("distribution")}
+                error={getFormikError(formik, "distribution")}
+              />
+
+              <Input
+                type="text"
+                label="Component"
+                required
+                {...formik.getFieldProps("component")}
+                error={getFormikError(formik, "component")}
+              />
+            </Blocks.Item>
+          </Blocks>
+
+          <SidePanelFormButtons
+            submitButtonLoading={formik.isSubmitting || isCreatingRepository}
+            submitButtonText="Add repository"
+            onCancel={closeSidePanel}
+          />
+        </Form>
+      </SidePanel.Content>
+    </>
+  );
+};
+
+export default AddLocalRepositorySidePanel;
diff --git a/src/features/local-repositories/components/AddLocalRepositorySidePanel/constants.ts b/src/features/local-repositories/components/AddLocalRepositorySidePanel/constants.ts
new file mode 100644
index 000000000..b5439a8d3
--- /dev/null
+++ b/src/features/local-repositories/components/AddLocalRepositorySidePanel/constants.ts
@@ -0,0 +1,22 @@
+import * as Yup from "yup";
+
+export interface AddLocalRepositoryFormValues {
+  name: string;
+  description: string;
+  distribution: string;
+  component: string;
+}
+
+export const VALIDATION_SCHEMA = Yup.object().shape({
+  name: Yup.string().required("This field is required."),
+  description: Yup.string(),
+  distribution: Yup.string().required("This field is required."),
+  component: Yup.string().required("This field is required."),
+});
+
+export const INITIAL_VALUES = {
+  name: "",
+  description: "",
+  distribution: "",
+  component: "",
+};
diff --git a/src/features/local-repositories/components/AddLocalRepositorySidePanel/index.ts b/src/features/local-repositories/components/AddLocalRepositorySidePanel/index.ts
new file mode 100644
index 000000000..4c97a89ae
--- /dev/null
+++ b/src/features/local-repositories/components/AddLocalRepositorySidePanel/index.ts
@@ -0,0 +1 @@
+export { default } from "./AddLocalRepositorySidePanel";
diff --git a/src/features/local-repositories/components/EditLocalRepositorySidePanel/EditLocalRepositoryForm/EditLocalRepositoryForm.tsx b/src/features/local-repositories/components/EditLocalRepositorySidePanel/EditLocalRepositoryForm/EditLocalRepositoryForm.tsx
new file mode 100644
index 000000000..09f7e89e5
--- /dev/null
+++ b/src/features/local-repositories/components/EditLocalRepositorySidePanel/EditLocalRepositoryForm/EditLocalRepositoryForm.tsx
@@ -0,0 +1,111 @@
+import type { FC } from "react";
+import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
+import useDebug from "@/hooks/useDebug";
+import useNotify from "@/hooks/useNotify";
+import usePageParams from "@/hooks/usePageParams";
+import { getFormikError } from "@/utils/formikErrors";
+import { Form, Input } from "@canonical/react-components";
+import { useFormik } from "formik";
+import {
+  type EditLocalRepositoryFormValues,
+  VALIDATION_SCHEMA,
+} from "./constants";
+import Blocks from "@/components/layout/Blocks";
+import { useUpdateLocalRepository } from "../../../api/useUpdateLocalRepository";
+import type { Local } from "../../../types";
+import ReadOnlyField from "@/components/form/ReadOnlyField";
+
+interface EditLocalRepositoryFormProps {
+  readonly repository: Local;
+}
+
+const EditLocalRepositoryForm: FC<EditLocalRepositoryFormProps> = ({
+  repository,
+}) => {
+  const debug = useDebug();
+  const { notify } = useNotify();
+  const { sidePath, popSidePath, createPageParamsSetter } = usePageParams();
+  const { updateRepository, isUpdatingRepository } = useUpdateLocalRepository();
+
+  const closeSidePanel = createPageParamsSetter({
+    sidePath: [],
+    name: "",
+  });
+
+  const handleSubmit = async (values: EditLocalRepositoryFormValues) => {
+    const localToUpdate = {
+      name: repository.name,
+      display_name: values.displayName ?? repository.display_name,
+      comment: values.description ?? repository.comment,
+    };
+
+    try {
+      await updateRepository({ local: localToUpdate });
+
+      closeSidePanel();
+
+      notify.success({
+        title: `You have successfully edited ${values.displayName}`,
+        message: "The local repository details have been updated.",
+      });
+    } catch (error) {
+      debug(error);
+    }
+  };
+
+  const formik = useFormik({
+    initialValues: {
+      displayName: repository.display_name,
+      description: repository.comment,
+    },
+    onSubmit: handleSubmit,
+    validationSchema: VALIDATION_SCHEMA,
+    validateOnMount: true,
+  });
+
+  return (
+    <Form onSubmit={formik.handleSubmit} noValidate>
+      <Blocks>
+        <Blocks.Item title="Details">
+          <Input
+            type="text"
+            label="Name"
+            required
+            {...formik.getFieldProps("displayName")}
+            error={getFormikError(formik, "displayName")}
+          />
+
+          <Input
+            type="text"
+            label="Description"
+            autoComplete="off"
+            {...formik.getFieldProps("description")}
+            error={getFormikError(formik, "description")}
+          />
+
+          <ReadOnlyField
+            label="Distribution"
+            value={repository.distribution}
+            tooltipMessage={`You can't change the distribution after the local repository is created`}
+          />
+
+          <ReadOnlyField
+            label="Component"
+            value={repository.component}
+            tooltipMessage={`You can't change the component after the local repository is created`}
+          />
+        </Blocks.Item>
+      </Blocks>
+
+      <SidePanelFormButtons
+        submitButtonLoading={formik.isSubmitting || isUpdatingRepository}
+        submitButtonText="Save changes"
+        hasBackButton={sidePath.length > 1}
+        onBackButtonPress={popSidePath}
+        onCancel={closeSidePanel}
+      />
+    </Form>
+  );
+};
+
+export default EditLocalRepositoryForm;
diff --git a/src/features/local-repositories/components/EditLocalRepositorySidePanel/EditLocalRepositoryForm/constants.ts b/src/features/local-repositories/components/EditLocalRepositorySidePanel/EditLocalRepositoryForm/constants.ts
new file mode 100644
index 000000000..1134c5bfb
--- /dev/null
+++ b/src/features/local-repositories/components/EditLocalRepositorySidePanel/EditLocalRepositoryForm/constants.ts
@@ -0,0 +1,11 @@
+import * as Yup from "yup";
+
+export interface EditLocalRepositoryFormValues {
+  displayName?: string;
+  description?: string;
+}
+
+export const VALIDATION_SCHEMA = Yup.object().shape({
+  displayName: Yup.string(),
+  description: Yup.string(),
+});
diff --git a/src/features/local-repositories/components/EditLocalRepositorySidePanel/EditLocalRepositoryForm/index.ts b/src/features/local-repositories/components/EditLocalRepositorySidePanel/EditLocalRepositoryForm/index.ts
new file mode 100644
index 000000000..979d64886
--- /dev/null
+++ b/src/features/local-repositories/components/EditLocalRepositorySidePanel/EditLocalRepositoryForm/index.ts
@@ -0,0 +1 @@
+export { default } from "./EditLocalRepositoryForm";
diff --git a/src/features/local-repositories/components/EditLocalRepositorySidePanel/EditLocalRepositorySidePanel.tsx b/src/features/local-repositories/components/EditLocalRepositorySidePanel/EditLocalRepositorySidePanel.tsx
new file mode 100644
index 000000000..6128dd151
--- /dev/null
+++ b/src/features/local-repositories/components/EditLocalRepositorySidePanel/EditLocalRepositorySidePanel.tsx
@@ -0,0 +1,23 @@
+import type { FC } from "react";
+import SidePanel from "@/components/layout/SidePanel";
+import { useGetPageLocalRepository } from "../../api/useGetPageLocalRepository";
+import EditLocalRepositoryForm from "./EditLocalRepositoryForm";
+
+const EditLocalRepositorySidePanel: FC = () => {
+  const { repository, isGettingRepository } = useGetPageLocalRepository();
+
+  if (isGettingRepository) {
+    return <SidePanel.LoadingState />;
+  }
+
+  return (
+    <>
+      <SidePanel.Header>Edit {repository.display_name}</SidePanel.Header>
+      <SidePanel.Content>
+        <EditLocalRepositoryForm repository={repository} />
+      </SidePanel.Content>
+    </>
+  );
+};
+
+export default EditLocalRepositorySidePanel;
diff --git a/src/features/local-repositories/components/EditLocalRepositorySidePanel/index.ts b/src/features/local-repositories/components/EditLocalRepositorySidePanel/index.ts
new file mode 100644
index 000000000..54e954f85
--- /dev/null
+++ b/src/features/local-repositories/components/EditLocalRepositorySidePanel/index.ts
@@ -0,0 +1 @@
+export { default } from "./EditLocalRepositorySidePanel";
diff --git a/src/features/local-repositories/components/ImportRepositoryPackagesSidePanel/ImportRepositoryPackagesSidePanel.module.scss b/src/features/local-repositories/components/ImportRepositoryPackagesSidePanel/ImportRepositoryPackagesSidePanel.module.scss
new file mode 100644
index 000000000..2a4229b82
--- /dev/null
+++ b/src/features/local-repositories/components/ImportRepositoryPackagesSidePanel/ImportRepositoryPackagesSidePanel.module.scss
@@ -0,0 +1,16 @@
+@import "vanilla-framework/scss/settings_spacing";
+@import "vanilla-framework/scss/settings_colors";
+
+.row {
+  display: flex;
+  flex-direction: row;
+}
+
+.button {
+  margin: 2.5rem 0 auto $sph--large;
+  width: 13.5rem;
+}
+
+.file {
+  padding: $spv--small 0 $spv--large;
+}
diff --git a/src/features/local-repositories/components/ImportRepositoryPackagesSidePanel/ImportRepositoryPackagesSidePanel.tsx b/src/features/local-repositories/components/ImportRepositoryPackagesSidePanel/ImportRepositoryPackagesSidePanel.tsx
new file mode 100644
index 000000000..925e3ba04
--- /dev/null
+++ b/src/features/local-repositories/components/ImportRepositoryPackagesSidePanel/ImportRepositoryPackagesSidePanel.tsx
@@ -0,0 +1,193 @@
+import { useState, type FC } from "react";
+import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
+import SidePanel from "@/components/layout/SidePanel";
+import useDebug from "@/hooks/useDebug";
+import useNotify from "@/hooks/useNotify";
+import usePageParams from "@/hooks/usePageParams";
+import { getFormikError } from "@/utils/formikErrors";
+import {
+  Button,
+  Form,
+  Input,
+  List,
+  Notification,
+} from "@canonical/react-components";
+import { useFormik } from "formik";
+import Blocks from "@/components/layout/Blocks";
+import { useGetPageLocalRepository } from "../../api/useGetPageLocalRepository";
+import * as Yup from "yup";
+import { useImportRepositoryPackages } from "../../api/useImportRepositoryPackages";
+import LoadingState from "@/components/layout/LoadingState";
+import classes from "./ImportRepositoryPackagesSidePanel.module.scss";
+import { pluralizeWithCount } from "@/utils/_helpers";
+import type { TaskStatus } from "../../types/Task";
+
+const ImportRepositoryPackagesSidePanel: FC = () => {
+  const debug = useDebug();
+  const { notify } = useNotify();
+  const {
+    sidePath,
+    popSidePath,
+    name,
+    createPageParamsSetter,
+  } = usePageParams();
+  const { repository, isGettingRepository } = useGetPageLocalRepository();
+
+  const { importRepositoryPackages, isImportingRepositoryPackages } =
+    useImportRepositoryPackages();
+  const closeSidePanel = createPageParamsSetter({
+    sidePath: [],
+    name: "",
+  });
+
+  const repositoryName = `locals/${name}`;
+  const [validateTask, setValidateTask] = useState<
+    | {
+        status: TaskStatus;
+        output: string[];
+      }
+    | undefined
+  >(undefined);
+
+  const handleSubmit = async (values: { source: string }) => {
+    try {
+      await importRepositoryPackages({
+        name: repositoryName,
+        url: values.source,
+      });
+
+      closeSidePanel();
+
+      notify.success({
+        title: `You have marked ${repository?.display_name} to import packages`,
+        message:
+          "An activity has been queued to import the packages to the local repository.",
+      });
+    } catch (error) {
+      debug(error);
+    }
+  };
+
+  const formik = useFormik({
+    initialValues: { source: "" },
+    onSubmit: handleSubmit,
+    validationSchema: Yup.object().shape({
+      source: Yup.string().required("This field is required."),
+    }),
+  });
+
+  if (isGettingRepository) {
+    return <SidePanel.LoadingState />;
+  }
+
+  const handleValidate = async () => {
+    try {
+      setValidateTask(undefined);
+
+      const { data } = await importRepositoryPackages({
+        name: repositoryName,
+        url: formik.values.source,
+        validate_only: true,
+      });
+
+      const output = data.output ? data.output.split(", ") : [];
+      setValidateTask({ status: data.status, output });
+    } catch (error) {
+      debug(error);
+    }
+  };
+
+  const hasPackages =
+    validateTask?.status === "succeeded" && !!validateTask.output.length;
+
+  const packagesCount = hasPackages
+    ? pluralizeWithCount(validateTask?.output.length, "package")
+    : "packages";
+
+  return (
+    <>
+      <SidePanel.Header>
+        Import packages to {repository.display_name}
+      </SidePanel.Header>
+      <SidePanel.Content>
+        <Form onSubmit={formik.handleSubmit} noValidate>
+          <Blocks>
+            <Blocks.Item title="Repository Contents">
+              <div className={classes.row}>
+                <Input
+                  type="text"
+                  label="Source URL"
+                  {...formik.getFieldProps("source")}
+                  error={getFormikError(formik, "source")}
+                  help={
+                    "In order to upload packages, provide a URL for Landscape to fetch the packages from."
+                  }
+                />
+
+                <Button
+                  disabled={!formik.values.source}
+                  onClick={handleValidate}
+                  type="button"
+                  className={classes.button}
+                >
+                  {isImportingRepositoryPackages ||
+                  validateTask?.status === "in progress" ? (
+                    <LoadingState inline />
+                  ) : (
+                    "Fetch packages"
+                  )}
+                </Button>
+              </div>
+
+              {validateTask?.status === "failed" && (
+                <Notification
+                  severity="caution"
+                  title="Fetching packages timed out"
+                  borderless
+                >
+                  <span>
+                    You can still proceed to import packages, although this
+                    process may fail if we can&apos;t fetch the packages from
+                    the source provided.
+                  </span>
+                </Notification>
+              )}
+
+              {validateTask?.status === "succeeded" && (
+                <>
+                  {!validateTask?.output.length ? (
+                    <Notification
+                      severity="negative"
+                      title="No packages available from the URL provided"
+                      borderless
+                    />
+                  ) : (
+                    <List
+                      items={validateTask.output.map((file) => (
+                        <div className={classes.file} key={file}>
+                          {file}
+                        </div>
+                      ))}
+                      divided
+                    />
+                  )}
+                </>
+              )}
+            </Blocks.Item>
+          </Blocks>
+
+          <SidePanelFormButtons
+            submitButtonDisabled={!hasPackages}
+            submitButtonLoading={formik.isSubmitting}
+            submitButtonText={`Import ${packagesCount}`}
+            hasBackButton={sidePath.length > 1}
+            onBackButtonPress={popSidePath}
+            onCancel={closeSidePanel}
+          />
+        </Form>
+      </SidePanel.Content>
+    </>
+  );
+};
+
+export default ImportRepositoryPackagesSidePanel;
diff --git a/src/features/local-repositories/components/ImportRepositoryPackagesSidePanel/index.ts b/src/features/local-repositories/components/ImportRepositoryPackagesSidePanel/index.ts
new file mode 100644
index 000000000..25824a91d
--- /dev/null
+++ b/src/features/local-repositories/components/ImportRepositoryPackagesSidePanel/index.ts
@@ -0,0 +1 @@
+export { default } from "./ImportRepositoryPackagesSidePanel";
diff --git a/src/features/local-repositories/components/LocalRepositoriesContainer/LocalRepositoriesContainer.tsx b/src/features/local-repositories/components/LocalRepositoriesContainer/LocalRepositoriesContainer.tsx
new file mode 100644
index 000000000..1b24fb262
--- /dev/null
+++ b/src/features/local-repositories/components/LocalRepositoriesContainer/LocalRepositoriesContainer.tsx
@@ -0,0 +1,58 @@
+import HeaderWithSearch from "@/components/form/HeaderWithSearch";
+import LoadingState from "@/components/layout/LoadingState";
+import type { FC } from "react";
+import LocalRepositoriesList from "../LocalRepositoriesList";
+import AddLocalRepositoryButton from "../AddLocalRepositoryButton";
+import EmptyState from "@/components/layout/EmptyState";
+import type { Local } from "../../types";
+import usePageParams from "@/hooks/usePageParams";
+
+interface LocalRepositoriesContainerProps {
+  readonly isPending: boolean;
+  readonly repositories: Local[];
+}
+
+const LocalRepositoriesContainer: FC<LocalRepositoriesContainerProps> = ({
+  isPending,
+  repositories,
+}) => {
+  const { search } = usePageParams();
+
+  if (isPending) {
+    return <LoadingState />;
+  }
+
+  if (!search && !repositories.length) {
+    return (
+      <EmptyState
+        title="You don't have any local repositories yet"
+        body={
+          <>
+            <p className="u-no-margin--bottom">
+              Use local repositories to host internal packages and distribute
+              them to your fleet, either through publications or via repository
+              profiles.
+            </p>
+            <a
+              href="https://ubuntu.com/landscape/docs/repositories"
+              target="_blank"
+              rel="nofollow noopener noreferrer"
+            >
+              Learn more about repository mirroring
+            </a>
+          </>
+        }
+        cta={[<AddLocalRepositoryButton key="add-local-repository" />]}
+      />
+    );
+  }
+
+  return (
+    <>
+      <HeaderWithSearch />
+      <LocalRepositoriesList repositories={repositories} />
+    </>
+  );
+};
+
+export default LocalRepositoriesContainer;
diff --git a/src/features/local-repositories/components/LocalRepositoriesContainer/index.ts b/src/features/local-repositories/components/LocalRepositoriesContainer/index.ts
new file mode 100644
index 000000000..b0aa7ffe5
--- /dev/null
+++ b/src/features/local-repositories/components/LocalRepositoriesContainer/index.ts
@@ -0,0 +1 @@
+export { default } from "./LocalRepositoriesContainer";
diff --git a/src/features/local-repositories/components/LocalRepositoriesList/LocalRepositoriesList.tsx b/src/features/local-repositories/components/LocalRepositoriesList/LocalRepositoriesList.tsx
new file mode 100644
index 000000000..875f2e1ea
--- /dev/null
+++ b/src/features/local-repositories/components/LocalRepositoriesList/LocalRepositoriesList.tsx
@@ -0,0 +1,113 @@
+import { LIST_ACTIONS_COLUMN_PROPS } from "@/components/layout/ListActions";
+import NoData from "@/components/layout/NoData";
+import ResponsiveTable from "@/components/layout/ResponsiveTable";
+import { Button } from "@canonical/react-components";
+import { useMemo, type FC } from "react";
+import type { Column, CellProps } from "react-table";
+import type { Local } from "../../types";
+import usePageParams from "@/hooks/usePageParams";
+import { TablePagination } from "@/components/layout/TablePagination";
+import LocalRepositoriesListActions from "./components/LocalRepositoriesListActions";
+import LocalRepositoryPackagesCount from "./components/LocalRepositoryPackagesCount";
+import LocalRepositoryPublicationsCount from "./components/LocalRepositoryPublicationsCount";
+
+interface LocalRepositoriesListProps {
+  readonly repositories: Local[];
+}
+
+const LocalRepositoriesList: FC<LocalRepositoriesListProps> = ({
+  repositories,
+}) => {
+  const { search, currentPage, pageSize, createPageParamsSetter } =
+    usePageParams();
+
+  const pagedRepositories = useMemo(
+    () =>
+      repositories.slice((currentPage - 1) * pageSize, currentPage * pageSize),
+    [repositories, currentPage, pageSize],
+  );
+
+  const columns = useMemo<Column<Local>[]>(
+    () => [
+      {
+        accessor: "name",
+        Header: "Name",
+        meta: {
+          ariaLabel: ({ original: repository }) =>
+            `${repository.display_name} local repository name`,
+        },
+        Cell: ({ row: { original: repository } }: CellProps<Local>) => (
+          <Button
+            type="button"
+            appearance="link"
+            className="u-no-margin--bottom u-no-padding--top u-align-text--left"
+            onClick={createPageParamsSetter({
+              sidePath: ["view"],
+              name: repository.local_id,
+            })}
+          >
+            {repository.display_name}
+          </Button>
+        ),
+      },
+      {
+        Header: "Description",
+        meta: {
+          ariaLabel: ({ original: repository }) =>
+            repository.comment
+              ? `${repository.display_name} profile description`
+              : `No description for ${repository.display_name} profile`,
+        },
+        Cell: ({ row: { original: repository } }: CellProps<Local>) =>
+          repository.comment || <NoData />,
+      },
+      {
+        Header: "Packages",
+        meta: {
+          ariaLabel: ({ original: repository }) =>
+            `${repository.display_name} local repository packages`,
+        },
+        Cell: ({ row: { original: repository } }: CellProps<Local>) => (
+          <LocalRepositoryPackagesCount repository={repository} />
+        ),
+      },
+      {
+        Header: "Publications",
+        meta: {
+          ariaLabel: ({ original: repository }) =>
+            `${repository.display_name} local repository publications`,
+        },
+        Cell: ({ row: { original: repository } }: CellProps<Local>) => (
+          <LocalRepositoryPublicationsCount repository={repository} />
+        ),
+      },
+      {
+        ...LIST_ACTIONS_COLUMN_PROPS,
+        meta: {
+          ariaLabel: ({ original: repository }) =>
+            `"${repository.display_name}" local repository actions`,
+        },
+        Cell: ({ row: { original: repository } }: CellProps<Local>) => (
+          <LocalRepositoriesListActions repository={repository} />
+        ),
+      },
+    ],
+    [createPageParamsSetter],
+  );
+
+  return (
+    <>
+      <ResponsiveTable
+        columns={columns}
+        data={pagedRepositories}
+        emptyMsg={`No local repositories found with the search: "${search}"`}
+      />
+      <TablePagination
+        totalItems={repositories.length}
+        currentItemCount={pagedRepositories.length}
+      />
+    </>
+  );
+};
+
+export default LocalRepositoriesList;
diff --git a/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoriesListActions/LocalRepositoriesListActions.tsx b/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoriesListActions/LocalRepositoriesListActions.tsx
new file mode 100644
index 000000000..9406e380b
--- /dev/null
+++ b/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoriesListActions/LocalRepositoriesListActions.tsx
@@ -0,0 +1,59 @@
+import type { FC } from "react";
+import type { Local } from "../../../../types";
+import ListActions from "@/components/layout/ListActions";
+import { useBoolean } from "usehooks-ts";
+import RemoveLocalRepositoryModal from "../../../RemoveLocalRepositoryModal";
+import { useGetRepositoryActions } from "../../../../hooks";
+import PublishLocalRepositoryGuard from "../../../PublishLocalRepositoryGuard";
+
+interface LocalRepositoriesListActionsProps {
+  readonly repository: Local;
+}
+
+const LocalRepositoriesListActions: FC<LocalRepositoriesListActionsProps> = ({
+  repository,
+}) => {
+  const {
+    value: isRemovalModalOpen,
+    setTrue: openRemovalModal,
+    setFalse: closeRemovalModal,
+  } = useBoolean();
+
+  const {
+    value: isPublishGuardOpen,
+    setTrue: openPublishGuard,
+    setFalse: closePublishGuard,
+  } = useBoolean();
+
+  const { viewAction, actions, destructiveActions } = useGetRepositoryActions({
+    repository,
+    openRemovalModal,
+    openPublishGuard,
+  });
+
+  return (
+    <>
+      <ListActions
+        toggleAriaLabel={`${repository.display_name} actions`}
+        actions={[viewAction, ...actions]}
+        destructiveActions={destructiveActions}
+      />
+
+      {isRemovalModalOpen && (
+        <RemoveLocalRepositoryModal
+          close={closeRemovalModal}
+          repository={repository}
+        />
+      )}
+
+      {isPublishGuardOpen && (
+        <PublishLocalRepositoryGuard
+          close={closePublishGuard}
+          repository={repository}
+        />
+      )}
+    </>
+  );
+};
+
+export default LocalRepositoriesListActions;
diff --git a/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoriesListActions/index.ts b/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoriesListActions/index.ts
new file mode 100644
index 000000000..5f36d912e
--- /dev/null
+++ b/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoriesListActions/index.ts
@@ -0,0 +1 @@
+export { default } from "./LocalRepositoriesListActions";
diff --git a/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPackagesCount/LocalRepositoryPackagesCount.tsx b/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPackagesCount/LocalRepositoryPackagesCount.tsx
new file mode 100644
index 000000000..908db65ac
--- /dev/null
+++ b/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPackagesCount/LocalRepositoryPackagesCount.tsx
@@ -0,0 +1,25 @@
+import LoadingState from "@/components/layout/LoadingState";
+import type { FC } from "react";
+import type { Local } from "../../../../types";
+import { useGetRepositoryPackages } from "../../../../api";
+import { pluralizeWithCount } from "@/utils/_helpers";
+
+interface LocalRepositoryPackagesCountProps {
+  readonly repository: Local;
+}
+
+const LocalRepositoryPackagesCount: FC<LocalRepositoryPackagesCountProps> = ({
+  repository,
+}) => {
+  const { packages, isGettingRepositoryPackages } = useGetRepositoryPackages(
+    repository.name,
+  );
+
+  if (isGettingRepositoryPackages) {
+    return <LoadingState inline />;
+  }
+
+  return pluralizeWithCount(packages.length, "package");
+};
+
+export default LocalRepositoryPackagesCount;
diff --git a/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPackagesCount/index.ts b/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPackagesCount/index.ts
new file mode 100644
index 000000000..dd6665e4e
--- /dev/null
+++ b/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPackagesCount/index.ts
@@ -0,0 +1 @@
+export { default } from "./LocalRepositoryPackagesCount";
diff --git a/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPublicationsCount/LocalRepositoryPublicationsCount.tsx b/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPublicationsCount/LocalRepositoryPublicationsCount.tsx
new file mode 100644
index 000000000..39c3baa2f
--- /dev/null
+++ b/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPublicationsCount/LocalRepositoryPublicationsCount.tsx
@@ -0,0 +1,39 @@
+import LoadingState from "@/components/layout/LoadingState";
+import type { FC } from "react";
+import type { Local } from "../../../../types";
+import useGetPublicationsBySource from "../../../../api/useGetPublicationsBySource";
+import { pluralizeWithCount } from "@/utils/_helpers";
+import StaticLink from "@/components/layout/StaticLink";
+import { ROUTES } from "@/libs/routes";
+
+interface LocalRepositoryPublicationsCountProps {
+  readonly repository: Local;
+}
+
+const LocalRepositoryPublicationsCount: FC<
+  LocalRepositoryPublicationsCountProps
+> = ({ repository }) => {
+  const { publications, isGettingPublications } = useGetPublicationsBySource(
+    repository.name,
+  );
+
+  if (isGettingPublications) {
+    return <LoadingState inline />;
+  }
+
+  if (!publications.length) {
+    return "0 publications";
+  }
+
+  return (
+    <StaticLink
+      to={ROUTES.repositories.publications({
+        query: `source="${repository.name}"`,
+      })}
+    >
+      {pluralizeWithCount(publications.length, "publication")}
+    </StaticLink>
+  );
+};
+
+export default LocalRepositoryPublicationsCount;
diff --git a/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPublicationsCount/index.ts b/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPublicationsCount/index.ts
new file mode 100644
index 000000000..c74a12608
--- /dev/null
+++ b/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPublicationsCount/index.ts
@@ -0,0 +1 @@
+export { default } from "./LocalRepositoryPublicationsCount";
diff --git a/src/features/local-repositories/components/LocalRepositoriesList/index.ts b/src/features/local-repositories/components/LocalRepositoriesList/index.ts
new file mode 100644
index 000000000..be05544d3
--- /dev/null
+++ b/src/features/local-repositories/components/LocalRepositoriesList/index.ts
@@ -0,0 +1 @@
+export { default } from "./LocalRepositoriesList";
diff --git a/src/features/local-repositories/components/LocalRepositoryPublicationsList/LocalRepositoryPublicationsList.tsx b/src/features/local-repositories/components/LocalRepositoryPublicationsList/LocalRepositoryPublicationsList.tsx
new file mode 100644
index 000000000..eee50be89
--- /dev/null
+++ b/src/features/local-repositories/components/LocalRepositoryPublicationsList/LocalRepositoryPublicationsList.tsx
@@ -0,0 +1,81 @@
+import { ROUTES } from "@/libs/routes";
+import type { Publication } from "@/features/publications";
+import { useMemo, type FC } from "react";
+import StaticLink from "@/components/layout/StaticLink";
+import ResponsiveTable from "@/components/layout/ResponsiveTable";
+import type { Column, CellProps } from "react-table";
+import usePageParams from "@/hooks/usePageParams";
+import { TablePagination } from "@/components/layout/TablePagination";
+
+interface LocalRepositoryPublicationsListProps {
+  readonly publications: Publication[];
+  readonly openNewTab?: boolean;
+}
+
+const LocalRepositoryPublicationsList: FC<
+  LocalRepositoryPublicationsListProps
+> = ({ publications, openNewTab }) => {
+  const { currentPage, pageSize } = usePageParams();
+
+  const pagedPublications = useMemo(
+    () =>
+      publications.slice((currentPage - 1) * pageSize, currentPage * pageSize),
+    [publications, currentPage, pageSize],
+  );
+
+  const columns = useMemo<Column<Publication>[]>(() => {
+    const newTabProps = openNewTab
+      ? {
+          target: "_blank",
+          rel: "noopener noreferrer",
+        }
+      : undefined;
+
+    return [
+      {
+        Header: "Publication",
+        meta: {
+          ariaLabel: ({ original: publication }) =>
+            `${publication.displayName} publication name`,
+        },
+        Cell: ({ row: { original: publication } }: CellProps<Publication>) => (
+          <StaticLink
+            to={ROUTES.repositories.publications({
+              sidePath: ["view"],
+              name: publication.publicationId,
+            })}
+            {...newTabProps}
+          >
+            {publication.label}
+          </StaticLink>
+        ),
+      },
+      {
+        Header: "Date published",
+        meta: {
+          ariaLabel: ({ original: publication }) =>
+            `Date when the ${publication.displayName} publication was published`,
+        },
+        Cell: ({ row: { original: publication } }: CellProps<Publication>) =>
+          publication.publishTime,
+      },
+    ] as Column<Publication>[];
+  }, [openNewTab]);
+
+  return (
+    <>
+      <ResponsiveTable
+        columns={columns}
+        data={pagedPublications}
+        emptyMsg={"No publications associated with this local repository."}
+        minWidth={320}
+      />
+      <TablePagination
+        totalItems={publications.length}
+        currentItemCount={pagedPublications.length}
+      />
+    </>
+  );
+};
+
+export default LocalRepositoryPublicationsList;
diff --git a/src/features/local-repositories/components/LocalRepositoryPublicationsList/index.ts b/src/features/local-repositories/components/LocalRepositoryPublicationsList/index.ts
new file mode 100644
index 000000000..3b3852203
--- /dev/null
+++ b/src/features/local-repositories/components/LocalRepositoryPublicationsList/index.ts
@@ -0,0 +1 @@
+export { default } from "./LocalRepositoryPublicationsList";
diff --git a/src/features/local-repositories/components/NoPublicationTargetsModal/NoPublicationTargetsModal.tsx b/src/features/local-repositories/components/NoPublicationTargetsModal/NoPublicationTargetsModal.tsx
new file mode 100644
index 000000000..079bc0e73
--- /dev/null
+++ b/src/features/local-repositories/components/NoPublicationTargetsModal/NoPublicationTargetsModal.tsx
@@ -0,0 +1,35 @@
+import type { FC } from "react";
+import { ConfirmationModal } from "@canonical/react-components";
+import { useNavigate } from "react-router";
+import { ROUTES } from "@/libs/routes";
+
+interface NoPublicationTargetsModalProps {
+  readonly close: () => void;
+}
+
+const NoPublicationTargetsModal: FC<NoPublicationTargetsModalProps> = ({
+  close,
+}) => {
+  const navigate = useNavigate();
+
+  return (
+    <ConfirmationModal
+      title="No publication targets have been added"
+      confirmButtonLabel="Add publication target"
+      confirmButtonAppearance="positive"
+      onConfirm={() =>
+        navigate(ROUTES.repositories.publicationTargets({ sidePath: ["add"] }))
+      }
+      close={close}
+      renderInPortal
+    >
+      <p>
+        In order to publish a mirror or a local repository you must first add a
+        publication target to indicate the location you wish to publish that
+        mirror to.
+      </p>
+    </ConfirmationModal>
+  );
+};
+
+export default NoPublicationTargetsModal;
diff --git a/src/features/local-repositories/components/NoPublicationTargetsModal/index.ts b/src/features/local-repositories/components/NoPublicationTargetsModal/index.ts
new file mode 100644
index 000000000..43267d4b5
--- /dev/null
+++ b/src/features/local-repositories/components/NoPublicationTargetsModal/index.ts
@@ -0,0 +1 @@
+export { default } from "./NoPublicationTargetsModal";
diff --git a/src/features/local-repositories/components/PublishLocalRepositoryGuard/PublishLocalRepositoryGuard.tsx b/src/features/local-repositories/components/PublishLocalRepositoryGuard/PublishLocalRepositoryGuard.tsx
new file mode 100644
index 000000000..aabc60e6a
--- /dev/null
+++ b/src/features/local-repositories/components/PublishLocalRepositoryGuard/PublishLocalRepositoryGuard.tsx
@@ -0,0 +1,34 @@
+import { type FC } from "react";
+import NoPublicationTargetsModal from "../NoPublicationTargetsModal";
+import useGetPublicationTargets from "@/features/publication-targets";
+import LoadingState from "@/components/layout/LoadingState";
+import usePageParams from "@/hooks/usePageParams";
+import type { Local } from "../../types";
+
+interface PublishRepositoryGuardProps {
+  readonly close: () => void;
+  readonly repository: Local;
+}
+
+const PublishLocalRepositoryGuard: FC<PublishRepositoryGuardProps> = ({
+  close,
+  repository,
+}) => {
+  const { publicationTargets, isGettingPublicationTargets } =
+    useGetPublicationTargets();
+  const { setPageParams } = usePageParams();
+
+  if (isGettingPublicationTargets) {
+    return <LoadingState />;
+  }
+
+  if (!publicationTargets.length) {
+    return <NoPublicationTargetsModal close={close} />;
+  }
+
+  setPageParams({ sidePath: ["publish"], name: repository.local_id });
+
+  return null;
+};
+
+export default PublishLocalRepositoryGuard;
diff --git a/src/features/local-repositories/components/PublishLocalRepositoryGuard/index.ts b/src/features/local-repositories/components/PublishLocalRepositoryGuard/index.ts
new file mode 100644
index 000000000..5ddc8589a
--- /dev/null
+++ b/src/features/local-repositories/components/PublishLocalRepositoryGuard/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublishLocalRepositoryGuard";
diff --git a/src/features/local-repositories/components/PublishLocalRepositorySidePanel/PublishLocalRepositorySidePanel.module.scss b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/PublishLocalRepositorySidePanel.module.scss
new file mode 100644
index 000000000..4e34d3593
--- /dev/null
+++ b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/PublishLocalRepositorySidePanel.module.scss
@@ -0,0 +1,32 @@
+@import "vanilla-framework/scss/settings_spacing";
+@import "vanilla-framework/scss/settings_colors";
+
+.settingLabel {
+  margin-right: $sph--x-small;
+}
+
+.tooltipPositionElement {
+  display: inline !important;
+}
+
+.distribution {
+  align-items: center;
+  display: flex;
+  justify-content: space-between;
+  padding: $spv--small $sph--small;
+  background-color: $colors--theme--background-inputs;
+}
+
+.radio {
+  display: flex;
+  align-items: end;
+  margin-bottom: $spv--large;
+
+  > label {
+    margin-right: $sph--x-large;
+  }
+
+  & span {
+    padding-left: $sph--x-large;
+  }
+}
diff --git a/src/features/local-repositories/components/PublishLocalRepositorySidePanel/PublishLocalRepositorySidePanel.tsx b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/PublishLocalRepositorySidePanel.tsx
new file mode 100644
index 000000000..afbf5af57
--- /dev/null
+++ b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/PublishLocalRepositorySidePanel.tsx
@@ -0,0 +1,58 @@
+import { RadioInput } from "@canonical/react-components";
+import type { FC } from "react";
+import classes from "./PublishLocalRepositorySidePanel.module.scss";
+import useGetPublicationsBySource from "../../api/useGetPublicationsBySource";
+import SidePanel from "@/components/layout/SidePanel";
+import PublishRepositoryNewForm from "./components/PublishRepositoryNewForm";
+import PublishRepositoryExistingForm from "./components/PublishRepositoryExistingForm";
+import { useBoolean } from "usehooks-ts";
+import { useGetPageLocalRepository } from "../../api/useGetPageLocalRepository";
+
+const PublishLocalRepositorySidePanel: FC = () => {
+  const { repository, isGettingRepository } = useGetPageLocalRepository();
+  const { publications, isGettingPublications } = useGetPublicationsBySource(
+    repository?.name,
+  );
+
+  const { value: useNewPublication, toggle } = useBoolean(true);
+
+  if (isGettingRepository || isGettingPublications) {
+    return <SidePanel.LoadingState />;
+  }
+
+  return (
+    <>
+      <SidePanel.Header>Publish {repository.display_name}</SidePanel.Header>
+      <SidePanel.Content>
+        {!!publications.length && (
+          <>
+            <label>Publish to</label>
+            <div className={classes.radio}>
+              <RadioInput
+                label="New publication"
+                checked={useNewPublication}
+                onChange={toggle}
+              />
+              <RadioInput
+                label="Existing publication"
+                checked={!useNewPublication}
+                onChange={toggle}
+              />
+            </div>
+          </>
+        )}
+
+        {useNewPublication ? (
+          <PublishRepositoryNewForm repository={repository} />
+        ) : (
+          <PublishRepositoryExistingForm
+            repository={repository}
+            publications={publications}
+          />
+        )}
+      </SidePanel.Content>
+    </>
+  );
+};
+
+export default PublishLocalRepositorySidePanel;
diff --git a/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryContentsBlock/PublishRepositoryContentsBlock.tsx b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryContentsBlock/PublishRepositoryContentsBlock.tsx
new file mode 100644
index 000000000..d69cdbf59
--- /dev/null
+++ b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryContentsBlock/PublishRepositoryContentsBlock.tsx
@@ -0,0 +1,30 @@
+import Blocks from "@/components/layout/Blocks";
+import type { FC } from "react";
+import type { Local } from "../../../../types";
+import ReadOnlyField from "@/components/form/ReadOnlyField";
+
+interface PublishRepositoryContentsBlockProps {
+  readonly repository: Local;
+}
+
+const PublishRepositoryContentsBlock: FC<
+  PublishRepositoryContentsBlockProps
+> = ({ repository }) => {
+  return (
+    <Blocks.Item title="Contents">
+      <ReadOnlyField
+        label="Distribution"
+        value={repository.distribution}
+        tooltipMessage={"The distribution is defined by the repository."}
+      />
+
+      <ReadOnlyField
+        label="Component"
+        value={repository.component}
+        tooltipMessage={"The component is defined by the repository."}
+      />
+    </Blocks.Item>
+  );
+};
+
+export default PublishRepositoryContentsBlock;
diff --git a/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryContentsBlock/index.ts b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryContentsBlock/index.ts
new file mode 100644
index 000000000..f53a5747d
--- /dev/null
+++ b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryContentsBlock/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublishRepositoryContentsBlock";
diff --git a/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryExistingForm/PublishRepositoryExistingForm.tsx b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryExistingForm/PublishRepositoryExistingForm.tsx
new file mode 100644
index 000000000..b5812e3e6
--- /dev/null
+++ b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryExistingForm/PublishRepositoryExistingForm.tsx
@@ -0,0 +1,207 @@
+import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
+import Blocks from "@/components/layout/Blocks";
+import useDebug from "@/hooks/useDebug";
+import usePageParams from "@/hooks/usePageParams";
+import { getFormikError } from "@/utils/formikErrors";
+import {
+  Form,
+  Icon,
+  Input,
+  Select,
+  Tooltip,
+} from "@canonical/react-components";
+import { useFormik } from "formik";
+import { useMemo, type FC } from "react";
+import {
+  SETTINGS_HELP_TEXT,
+  VALIDATION_SCHEMA_EXISTING,
+} from "../../constants";
+import useNotify from "@/hooks/useNotify";
+import classes from "../../PublishLocalRepositorySidePanel.module.scss";
+import type { SelectOption } from "@/types/SelectOption";
+import type { Local } from "../../../../types";
+import {
+  type Publication,
+  usePublishPublication,
+} from "@/features/publications";
+import ReadOnlyField from "@/components/form/ReadOnlyField";
+import PublishRepositoryContentsBlock from "../PublishRepositoryContentsBlock";
+
+interface PublishRepositoryExistingFormProps {
+  readonly repository: Local;
+  readonly publications: Publication[];
+}
+
+const PublishRepositoryExistingForm: FC<PublishRepositoryExistingFormProps> = ({
+  repository,
+  publications,
+}) => {
+  const debug = useDebug();
+  const { notify } = useNotify();
+  const { sidePath, popSidePath, createPageParamsSetter } = usePageParams();
+  const { publishPublication, isPublishingPublication } =
+    usePublishPublication();
+
+  const closeSidePanel = createPageParamsSetter({
+    sidePath: [],
+    name: "",
+  });
+
+  const handleSubmit = async (values: { name: string }) => {
+    try {
+      await publishPublication({ name: values.name });
+
+      closeSidePanel();
+
+      notify.success({
+        title: `You have marked ${repository.display_name} to be published`,
+        message:
+          "An activity has been queued to publish the selected publication to the designated target.",
+      });
+    } catch (error) {
+      debug(error);
+    }
+  };
+
+  const formik = useFormik({
+    initialValues: { name: "" },
+    onSubmit: handleSubmit,
+    validationSchema: VALIDATION_SCHEMA_EXISTING,
+    validateOnMount: true,
+  });
+
+  const publicationOptions = useMemo<SelectOption[]>(
+    () => [
+      { label: "Select publication", value: "" },
+      ...publications.map((publication) => ({
+        label: publication.displayName,
+        value: publication.name,
+      })),
+    ],
+    [publications],
+  );
+
+  const publication = publications.find(
+    ({ name }) => name === formik.values.name,
+  );
+
+  return (
+    <Form onSubmit={formik.handleSubmit} noValidate>
+      <Blocks>
+        <Blocks.Item title="Details">
+          <Select
+            label="Publication name"
+            required
+            options={publicationOptions}
+            error={getFormikError(formik, "name")}
+            {...formik.getFieldProps("name")}
+          />
+
+          <ReadOnlyField
+            label="Publication target"
+            value={publication?.publicationTarget ?? ""}
+            tooltipMessage={
+              "The publication target is defined by the publication."
+            }
+          />
+
+          <ReadOnlyField
+            label="Signing GPG key"
+            value={publication?.gpgKey?.armor ?? ""}
+            tooltipMessage={"The GPG key is defined by the publication."}
+          />
+        </Blocks.Item>
+
+        <PublishRepositoryContentsBlock repository={repository} />
+
+        <Blocks.Item title="Settings">
+          <Input
+            type="checkbox"
+            label={
+              <>
+                <span className={classes.settingLabel}>
+                  Hash based indexing
+                </span>
+                <Tooltip
+                  message={SETTINGS_HELP_TEXT.hashIndexing}
+                  position="top-center"
+                  positionElementClassName={classes.tooltipPositionElement}
+                >
+                  <Icon name="help" aria-hidden />
+                  <span className="u-off-screen">Help</span>
+                </Tooltip>
+              </>
+            }
+            checked={publication?.acquireByHash ?? false}
+            disabled
+          />
+
+          <Input
+            type="checkbox"
+            label={
+              <span>
+                <span className={classes.settingLabel}>
+                  Automatic installation
+                </span>
+                <Tooltip
+                  message={SETTINGS_HELP_TEXT.automaticInstallation}
+                  position="top-center"
+                  positionElementClassName={classes.tooltipPositionElement}
+                >
+                  <Icon name="help" aria-hidden />
+                  <span className="u-off-screen">Help</span>
+                </Tooltip>
+              </span>
+            }
+            checked={publication?.notAutomatic ?? false}
+            disabled
+          />
+
+          <Input
+            type="checkbox"
+            label={
+              <span>
+                <span className={classes.settingLabel}>Automatic upgrades</span>
+                <Tooltip
+                  message={SETTINGS_HELP_TEXT.automaticUpgrades}
+                  position="top-center"
+                  positionElementClassName={classes.tooltipPositionElement}
+                >
+                  <Icon name="help" aria-hidden />
+                  <span className="u-off-screen">Help</span>
+                </Tooltip>
+              </span>
+            }
+            checked={publication?.butAutomaticUpgrades ?? false}
+            disabled
+          />
+
+          <Input
+            type="checkbox"
+            label="Skip bz2"
+            checked={publication?.skipBz2 ?? false}
+            disabled
+          />
+
+          <Input
+            type="checkbox"
+            label="Skip content indexing"
+            checked={publication?.skipContents ?? false}
+            disabled
+          />
+        </Blocks.Item>
+      </Blocks>
+
+      <SidePanelFormButtons
+        submitButtonDisabled={!formik.isValid}
+        submitButtonLoading={formik.isSubmitting || isPublishingPublication}
+        submitButtonText="Publish repository"
+        onCancel={closeSidePanel}
+        hasBackButton={sidePath.length > 1}
+        onBackButtonPress={popSidePath}
+      />
+    </Form>
+  );
+};
+
+export default PublishRepositoryExistingForm;
diff --git a/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryExistingForm/index.ts b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryExistingForm/index.ts
new file mode 100644
index 000000000..bfa5dd399
--- /dev/null
+++ b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryExistingForm/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublishRepositoryExistingForm";
diff --git a/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryNewForm/PublishRepositoryNewForm.tsx b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryNewForm/PublishRepositoryNewForm.tsx
new file mode 100644
index 000000000..a18896f3e
--- /dev/null
+++ b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryNewForm/PublishRepositoryNewForm.tsx
@@ -0,0 +1,236 @@
+import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
+import Blocks from "@/components/layout/Blocks";
+import useDebug from "@/hooks/useDebug";
+import usePageParams from "@/hooks/usePageParams";
+import { getFormikError } from "@/utils/formikErrors";
+import {
+  Form,
+  Icon,
+  Input,
+  Select,
+  Textarea,
+  Tooltip,
+} from "@canonical/react-components";
+import { useFormik } from "formik";
+import { useMemo, type FC } from "react";
+import {
+  type PublishRepositoryNewFormValues,
+  SETTINGS_HELP_TEXT,
+  VALIDATION_SCHEMA_NEW,
+} from "../../constants";
+import useNotify from "@/hooks/useNotify";
+import classes from "../../PublishLocalRepositorySidePanel.module.scss";
+import type { SelectOption } from "@/types/SelectOption";
+import useGetPublicationTargets from "@/features/publication-targets";
+import type { Local } from "../../../../types";
+import {
+  useAddPublication,
+  usePublishPublication,
+} from "@/features/publications";
+import PublishRepositoryContentsBlock from "../PublishRepositoryContentsBlock";
+
+interface PublishRepositoryNewFormProps {
+  readonly repository: Local;
+}
+
+const PublishRepositoryNewForm: FC<PublishRepositoryNewFormProps> = ({
+  repository,
+}) => {
+  const debug = useDebug();
+  const { notify } = useNotify();
+  const { sidePath, popSidePath, createPageParamsSetter } = usePageParams();
+  const { publicationTargets, isGettingPublicationTargets } =
+    useGetPublicationTargets();
+  const { addPublication, isAddingPublication } = useAddPublication();
+  const { publishPublication, isPublishingPublication } =
+    usePublishPublication();
+
+  const closeSidePanel = createPageParamsSetter({
+    sidePath: [],
+    name: "",
+  });
+
+  const initialValues: PublishRepositoryNewFormValues = {
+    name: "",
+    publication_target: "",
+    signing_key: "",
+    hash_indexing: false,
+    automatic_installation: false,
+    automatic_upgrades: false,
+    skip_bz2: false,
+    skip_content_indexing: false,
+  };
+
+  const handleSubmit = async (values: PublishRepositoryNewFormValues) => {
+    const valuesforCreation = {
+      publication_target: values.publication_target,
+      source: repository.name,
+      distribution: repository.distribution,
+      hash_indexing: values.hash_indexing,
+      automatic_installation: values.automatic_installation,
+      automatic_upgrades: values.automatic_upgrades,
+      skip_bz2: values.skip_bz2,
+      skip_content_indexing: values.skip_content_indexing,
+      gpg_key: values.signing_key,
+    };
+
+    try {
+      const { data: publication } = await addPublication(valuesforCreation);
+
+      await publishPublication({ name: publication.name });
+
+      closeSidePanel();
+
+      notify.success({
+        title: `You have marked ${repository.display_name} to be published`,
+        message:
+          "A publication has been created and an activity has been queued to publish it to the designated target.",
+      });
+    } catch (error) {
+      debug(error);
+    }
+  };
+
+  const formik = useFormik({
+    initialValues: initialValues,
+    onSubmit: handleSubmit,
+    validationSchema: VALIDATION_SCHEMA_NEW,
+    validateOnMount: true,
+  });
+
+  const publicationTargetOptions = useMemo<SelectOption[]>(
+    () => [
+      { label: "Select publication target", value: "" },
+      ...publicationTargets.map((publicationTarget) => ({
+        label: publicationTarget.displayName,
+        value: publicationTarget.name,
+      })),
+    ],
+    [publicationTargets],
+  );
+
+  return (
+    <Form onSubmit={formik.handleSubmit} noValidate>
+      <Blocks>
+        <Blocks.Item title="Details">
+          <Input
+            type="text"
+            label="Publication name"
+            required
+            error={getFormikError(formik, "name")}
+            {...formik.getFieldProps("name")}
+          />
+
+          <Select
+            label="Publication target"
+            required
+            disabled={isGettingPublicationTargets}
+            options={publicationTargetOptions}
+            error={getFormikError(formik, "publication_target")}
+            {...formik.getFieldProps("publication_target")}
+          />
+
+          <Textarea
+            label="Signing GPG key"
+            rows={4}
+            error={getFormikError(formik, "signing_key")}
+            {...formik.getFieldProps("signing_key")}
+            className="u-no-margin--bottom"
+          />
+        </Blocks.Item>
+
+        <PublishRepositoryContentsBlock repository={repository} />
+
+        <Blocks.Item title="Settings">
+          <Input
+            type="checkbox"
+            label={
+              <span>
+                <span className={classes.settingLabel}>
+                  Hash based indexing
+                </span>
+                <Tooltip
+                  message={SETTINGS_HELP_TEXT.hashIndexing}
+                  position="top-center"
+                  positionElementClassName={classes.tooltipPositionElement}
+                >
+                  <Icon name="help" aria-hidden />
+                  <span className="u-off-screen">Help</span>
+                </Tooltip>
+              </span>
+            }
+            checked={formik.values.hash_indexing}
+            {...formik.getFieldProps("hash_indexing")}
+          />
+
+          <Input
+            type="checkbox"
+            label={
+              <span>
+                <span className={classes.settingLabel}>
+                  Automatic installation
+                </span>
+                <Tooltip
+                  message={SETTINGS_HELP_TEXT.automaticInstallation}
+                  position="top-center"
+                  positionElementClassName={classes.tooltipPositionElement}
+                >
+                  <Icon name="help" aria-hidden />
+                  <span className="u-off-screen">Help</span>
+                </Tooltip>
+              </span>
+            }
+            checked={formik.values.automatic_installation}
+            {...formik.getFieldProps("automatic_installation")}
+          />
+
+          <Input
+            type="checkbox"
+            label={
+              <span>
+                <span className={classes.settingLabel}>Automatic upgrades</span>
+                <Tooltip
+                  message={SETTINGS_HELP_TEXT.automaticUpgrades}
+                  position="top-center"
+                  positionElementClassName={classes.tooltipPositionElement}
+                >
+                  <Icon name="help" aria-hidden />
+                  <span className="u-off-screen">Help</span>
+                </Tooltip>
+              </span>
+            }
+            checked={formik.values.automatic_upgrades}
+            {...formik.getFieldProps("automatic_upgrades")}
+          />
+
+          <Input
+            type="checkbox"
+            label="Skip bz2"
+            checked={formik.values.skip_bz2}
+            {...formik.getFieldProps("skip_bz2")}
+          />
+
+          <Input
+            type="checkbox"
+            label="Skip content indexing"
+            checked={formik.values.skip_content_indexing}
+            {...formik.getFieldProps("skip_content_indexing")}
+          />
+        </Blocks.Item>
+      </Blocks>
+
+      <SidePanelFormButtons
+        submitButtonDisabled={!formik.isValid}
+        submitButtonLoading={
+          formik.isSubmitting || isAddingPublication || isPublishingPublication
+        }
+        submitButtonText="Publish repository"
+        onCancel={closeSidePanel}
+        hasBackButton={sidePath.length > 1}
+        onBackButtonPress={popSidePath}
+      />
+    </Form>
+  );
+};
+
+export default PublishRepositoryNewForm;
diff --git a/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryNewForm/index.ts b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryNewForm/index.ts
new file mode 100644
index 000000000..a58a2ca59
--- /dev/null
+++ b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryNewForm/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublishRepositoryNewForm";
diff --git a/src/features/local-repositories/components/PublishLocalRepositorySidePanel/constants.ts b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/constants.ts
new file mode 100644
index 000000000..30f371dac
--- /dev/null
+++ b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/constants.ts
@@ -0,0 +1,35 @@
+import * as Yup from "yup";
+
+export interface PublishRepositoryNewFormValues {
+  name: string;
+  publication_target: string;
+  signing_key: string;
+  hash_indexing: boolean;
+  automatic_installation: boolean;
+  automatic_upgrades: boolean;
+  skip_bz2: boolean;
+  skip_content_indexing: boolean;
+}
+
+const REQUIRED_FIELD_MESSAGE = "This field is required";
+
+export const VALIDATION_SCHEMA_NEW = Yup.object().shape({
+  name: Yup.string().required(REQUIRED_FIELD_MESSAGE),
+  publication_target: Yup.string().required(REQUIRED_FIELD_MESSAGE),
+  signing_key: Yup.string(),
+  hash_indexing: Yup.boolean(),
+  automatic_installation: Yup.boolean(),
+  automatic_upgrades: Yup.boolean(),
+  skip_bz2: Yup.boolean(),
+  skip_content_indexing: Yup.boolean(),
+});
+
+export const VALIDATION_SCHEMA_EXISTING = Yup.object().shape({
+  name: Yup.string().required(REQUIRED_FIELD_MESSAGE),
+});
+
+export const SETTINGS_HELP_TEXT = {
+  hashIndexing: `Provides repository index files (like Packages and Sources) via their hash sums instead of just their names. This prevents "Hash Sum Mismatch" errors on client machines if the repository is updated during an active apt-get update session.`,
+  automaticInstallation: `This creates an exception to the "Limit Automatic Installation" rule. While new packages from this repository won't be installed automatically, any package already installed on a system will be upgraded whenever a newer version is published to this repository.`,
+  automaticUpgrades: `This tells apt that packages in this repository should not be installed or upgraded automatically. Users must explicitly target this repository or specific package versions to install them.`,
+};
diff --git a/src/features/local-repositories/components/PublishLocalRepositorySidePanel/index.ts b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/index.ts
new file mode 100644
index 000000000..bae8f8bf0
--- /dev/null
+++ b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublishLocalRepositorySidePanel";
diff --git a/src/features/local-repositories/components/RemoveLocalRepositoryModal/RemoveLocalRepositoryModal.tsx b/src/features/local-repositories/components/RemoveLocalRepositoryModal/RemoveLocalRepositoryModal.tsx
new file mode 100644
index 000000000..e64b3e16c
--- /dev/null
+++ b/src/features/local-repositories/components/RemoveLocalRepositoryModal/RemoveLocalRepositoryModal.tsx
@@ -0,0 +1,90 @@
+import type { FC } from "react";
+import type { Local } from "../../types";
+import useDebug from "@/hooks/useDebug";
+import usePageParams from "@/hooks/usePageParams";
+import useNotify from "@/hooks/useNotify";
+import { useRemoveLocalRepository } from "../../api";
+import { ConfirmationModal } from "@canonical/react-components";
+import LocalRepositoryPublicationsList from "../LocalRepositoryPublicationsList";
+import useGetPublicationsBySource from "../../api/useGetPublicationsBySource";
+import LoadingState from "@/components/layout/LoadingState";
+
+interface RemoveLocalRepositoryModalProps {
+  readonly close: () => void;
+  readonly repository: Local;
+}
+
+const RemoveLocalRepositoryModal: FC<RemoveLocalRepositoryModalProps> = ({
+  close,
+  repository,
+}) => {
+  const { notify } = useNotify();
+  const debug = useDebug();
+  const { setPageParams } = usePageParams();
+  const { removeRepository, isRemovingRepository } = useRemoveLocalRepository();
+  const { publications, isGettingPublications } = useGetPublicationsBySource(
+    repository.name,
+  );
+
+  const noPublicationsText = (
+    <p>
+      This action will remove the local repository from Landscape and it
+      won&apos;t be available to be published in the future.{" "}
+      <strong>This action is irreversible.</strong>
+    </p>
+  );
+
+  const publicationsContent = (
+    <>
+      <p>This repository is associated with the following publications:</p>
+      <LocalRepositoryPublicationsList publications={publications} openNewTab />
+      <br />
+      <p>
+        After removal you won&apos;t be able to update any of these
+        publications, but they will continue to be available.{" "}
+        <strong>This action is irreversible.</strong>
+      </p>
+    </>
+  );
+
+  const content = !publications.length
+    ? noPublicationsText
+    : publicationsContent;
+
+  const handleRemoveLocalRepository = async () => {
+    try {
+      await removeRepository({ name: repository.name });
+
+      setPageParams({ sidePath: [], name: "" });
+
+      notify.success({
+        title: `You have successfully removed ${repository.display_name}`,
+        message: "The local repository has been removed from Landscape.",
+      });
+    } catch (error) {
+      debug(error);
+    } finally {
+      close();
+    }
+  };
+
+  if (isGettingPublications) {
+    return <LoadingState />;
+  }
+
+  return (
+    <ConfirmationModal
+      title={`Remove ${repository.display_name}`}
+      confirmButtonLabel="Remove local repository"
+      confirmButtonAppearance="negative"
+      onConfirm={handleRemoveLocalRepository}
+      confirmButtonLoading={isRemovingRepository}
+      close={close}
+      renderInPortal
+    >
+      {content}
+    </ConfirmationModal>
+  );
+};
+
+export default RemoveLocalRepositoryModal;
diff --git a/src/features/local-repositories/components/RemoveLocalRepositoryModal/index.ts b/src/features/local-repositories/components/RemoveLocalRepositoryModal/index.ts
new file mode 100644
index 000000000..a56c8ce7f
--- /dev/null
+++ b/src/features/local-repositories/components/RemoveLocalRepositoryModal/index.ts
@@ -0,0 +1 @@
+export { default } from "./RemoveLocalRepositoryModal";
diff --git a/src/features/local-repositories/components/ViewLocalRepositorySidePanel/ViewLocalRepositorySidePanel.module.scss b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/ViewLocalRepositorySidePanel.module.scss
new file mode 100644
index 000000000..8c6269d8d
--- /dev/null
+++ b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/ViewLocalRepositorySidePanel.module.scss
@@ -0,0 +1,5 @@
+@import "vanilla-framework/scss/settings_spacing";
+
+.marginBottom {
+  margin-bottom: $spv--x-large;
+}
diff --git a/src/features/local-repositories/components/ViewLocalRepositorySidePanel/ViewLocalRepositorySidePanel.tsx b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/ViewLocalRepositorySidePanel.tsx
new file mode 100644
index 000000000..cfc5051a6
--- /dev/null
+++ b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/ViewLocalRepositorySidePanel.tsx
@@ -0,0 +1,67 @@
+import { Suspense, useState, type FC } from "react";
+import SidePanel from "@/components/layout/SidePanel";
+import LoadingState from "@/components/layout/LoadingState";
+import { Tabs } from "@canonical/react-components";
+import classes from "./ViewLocalRepositorySidePanel.module.scss";
+import ViewRepositoryActionsBlock from "./components/ViewRepositoryActionsBlock";
+import ViewLocalRepositoryDetailsTab from "./components/ViewLocalRepositoryDetailsTab";
+import LocalRepositoryPackagesList from "./components/LocalRepositoryPackagesList";
+import { useGetPageLocalRepository } from "../../api/useGetPageLocalRepository";
+
+const ViewLocalRepositorySidePanel: FC = () => {
+  const [tabId, setTabId] = useState<"details" | "packages">("details");
+  const { repository, isGettingRepository } = useGetPageLocalRepository();
+
+  if (isGettingRepository) {
+    return <SidePanel.LoadingState />;
+  }
+
+  const tabs: { label: string; id: "details" | "packages" }[] = [
+    {
+      label: "General details",
+      id: "details",
+    },
+    {
+      label: "Packages",
+      id: "packages",
+    },
+  ];
+
+  const links = tabs.map(({ label, id }) => ({
+    label,
+    active: tabId == id,
+    onClick: () => {
+      setTabId(id);
+    },
+  }));
+
+  return (
+    <>
+      <SidePanel.Header>{repository.display_name}</SidePanel.Header>
+      <SidePanel.Content>
+        <ViewRepositoryActionsBlock repository={repository} />
+        <Tabs listClassName={classes.marginBottom} links={links} />
+
+        {tabId === "details" && (
+          <Suspense fallback={<LoadingState />}>
+            <ViewLocalRepositoryDetailsTab
+              repository={repository}
+              key="details"
+            />
+          </Suspense>
+        )}
+
+        {tabId === "packages" && (
+          <Suspense fallback={<LoadingState />}>
+            <LocalRepositoryPackagesList
+              repository={repository}
+              key="packages"
+            />
+          </Suspense>
+        )}
+      </SidePanel.Content>
+    </>
+  );
+};
+
+export default ViewLocalRepositorySidePanel;
diff --git a/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/LocalRepositoryPackagesList/LocalRepositoryPackagesList.tsx b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/LocalRepositoryPackagesList/LocalRepositoryPackagesList.tsx
new file mode 100644
index 000000000..e017efa42
--- /dev/null
+++ b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/LocalRepositoryPackagesList/LocalRepositoryPackagesList.tsx
@@ -0,0 +1,65 @@
+import { useMemo, type FC } from "react";
+import type { Local } from "../../../../types";
+import { useGetRepositoryPackages } from "../../../../api";
+import ResponsiveTable from "@/components/layout/ResponsiveTable";
+import type { Column, CellProps } from "react-table";
+import LoadingState from "@/components/layout/LoadingState";
+import { TablePagination } from "@/components/layout/TablePagination";
+import usePageParams from "@/hooks/usePageParams";
+import type { LocalPackage } from "../../../../types";
+
+interface LocalRepositoryPackagesListProps {
+  readonly repository: Local;
+}
+
+const LocalRepositoryPackagesList: FC<LocalRepositoryPackagesListProps> = ({
+  repository,
+}) => {
+  const { currentPage, pageSize } = usePageParams();
+  const { packages, isGettingRepositoryPackages } = useGetRepositoryPackages(
+    repository.name,
+  );
+
+  const pagedPackages = useMemo(
+    () => packages.slice((currentPage - 1) * pageSize, currentPage * pageSize),
+    [packages, currentPage, pageSize],
+  );
+
+  const columns = useMemo<Column<LocalPackage>[]>(
+    () => [
+      {
+        Header: "Package name",
+        meta: {
+          ariaLabel: ({ original: { name } }) => `${name} package name`,
+        },
+        Cell: ({
+          row: {
+            original: { name },
+          },
+        }: CellProps<LocalPackage>) => name,
+      },
+    ],
+    [],
+  );
+
+  if (isGettingRepositoryPackages) {
+    return <LoadingState />;
+  }
+
+  return (
+    <>
+      <ResponsiveTable
+        columns={columns}
+        data={pagedPackages}
+        emptyMsg={"No packages associated with this local repository."}
+        minWidth={320}
+      />
+      <TablePagination
+        totalItems={packages.length}
+        currentItemCount={pagedPackages.length}
+      />
+    </>
+  );
+};
+
+export default LocalRepositoryPackagesList;
diff --git a/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/LocalRepositoryPackagesList/index.ts b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/LocalRepositoryPackagesList/index.ts
new file mode 100644
index 000000000..248af6aed
--- /dev/null
+++ b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/LocalRepositoryPackagesList/index.ts
@@ -0,0 +1 @@
+export { default } from "./LocalRepositoryPackagesList";
diff --git a/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/ViewLocalRepositoryDetailsTab/ViewLocalRepositoryDetailsTab.tsx b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/ViewLocalRepositoryDetailsTab/ViewLocalRepositoryDetailsTab.tsx
new file mode 100644
index 000000000..d50b567b9
--- /dev/null
+++ b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/ViewLocalRepositoryDetailsTab/ViewLocalRepositoryDetailsTab.tsx
@@ -0,0 +1,51 @@
+import type { FC } from "react";
+import type { Local } from "../../../../types";
+import Blocks from "@/components/layout/Blocks";
+import InfoGrid from "@/components/layout/InfoGrid";
+import LocalRepositoryPublicationsList from "../../../LocalRepositoryPublicationsList";
+import LoadingState from "@/components/layout/LoadingState";
+import useGetPublicationsBySource from "../../../../api/useGetPublicationsBySource";
+
+interface ViewLocalRepositoryDetailsTabProps {
+  readonly repository: Local;
+}
+
+const ViewLocalRepositoryDetailsTab: FC<ViewLocalRepositoryDetailsTabProps> = ({
+  repository,
+}) => {
+  const { publications, isGettingPublications } = useGetPublicationsBySource(
+    repository.name,
+  );
+
+  return (
+    <Blocks>
+      <Blocks.Item title="Details">
+        <InfoGrid>
+          <InfoGrid.Item label="Name" value={repository.display_name} />
+
+          <InfoGrid.Item label="Description" large value={repository.comment} />
+
+          <InfoGrid.Item
+            label="Default distribution"
+            value={repository.distribution}
+          />
+
+          <InfoGrid.Item
+            label="Default component"
+            value={repository.component}
+          />
+        </InfoGrid>
+      </Blocks.Item>
+
+      <Blocks.Item title="Used in">
+        {isGettingPublications ? (
+          <LoadingState />
+        ) : (
+          <LocalRepositoryPublicationsList publications={publications} />
+        )}
+      </Blocks.Item>
+    </Blocks>
+  );
+};
+
+export default ViewLocalRepositoryDetailsTab;
diff --git a/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/ViewLocalRepositoryDetailsTab/index.ts b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/ViewLocalRepositoryDetailsTab/index.ts
new file mode 100644
index 000000000..8bb872860
--- /dev/null
+++ b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/ViewLocalRepositoryDetailsTab/index.ts
@@ -0,0 +1 @@
+export { default } from "./ViewLocalRepositoryDetailsTab";
diff --git a/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/ViewRepositoryActionsBlock/ViewRepositoryActionsBlock.tsx b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/ViewRepositoryActionsBlock/ViewRepositoryActionsBlock.tsx
new file mode 100644
index 000000000..d03e6d1a2
--- /dev/null
+++ b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/ViewRepositoryActionsBlock/ViewRepositoryActionsBlock.tsx
@@ -0,0 +1,83 @@
+import type { FC } from "react";
+import type { Local } from "../../../../types";
+import { ResponsiveButtons } from "@/components/ui";
+import { useGetRepositoryActions } from "../../../../hooks/useGetRepositoryActions";
+import { useBoolean } from "usehooks-ts";
+import { Button, Icon } from "@canonical/react-components";
+import RemoveLocalRepositoryModal from "../../../RemoveLocalRepositoryModal";
+import classes from "../../ViewLocalRepositorySidePanel.module.scss";
+import type { Action } from "@/types/Action";
+import PublishLocalRepositoryGuard from "../../../PublishLocalRepositoryGuard";
+
+interface ViewRepositoryActionsBlockProps {
+  readonly repository: Local;
+}
+
+const ViewRepositoryActionsBlock: FC<ViewRepositoryActionsBlockProps> = ({
+  repository: repository,
+}) => {
+  const {
+    value: isRemovalModalOpen,
+    setTrue: openRemovalModal,
+    setFalse: closeRemovalModal,
+  } = useBoolean();
+
+  const {
+    value: isPublishGuardOpen,
+    setTrue: openPublishGuard,
+    setFalse: closePublishGuard,
+  } = useBoolean();
+
+  const { actions, destructiveActions } = useGetRepositoryActions({
+    repository,
+    openRemovalModal,
+    openPublishGuard,
+  });
+  const buttons = [...actions, ...destructiveActions];
+  const isNegative = (action: Action) => action.appearance === "negative";
+
+  return (
+    <>
+      <ResponsiveButtons
+        className={classes.marginBottom}
+        buttons={buttons.map((button) => (
+          <Button
+            key={button.label}
+            hasIcon
+            type="button"
+            onClick={button.onClick}
+            aria-label={`${button.label} ${repository.display_name} local repository`}
+            disabled={button.disabled}
+          >
+            <Icon
+              name={
+                isNegative(button) ? `${button.icon}--negative` : button.icon
+              }
+            />
+            <span className={isNegative(button) ? "u-text--negative" : ""}>
+              {button.label}
+            </span>
+          </Button>
+        ))}
+        collapseFrom={"xs"}
+        menuPosition="left"
+      />
+
+      {isRemovalModalOpen && (
+        <RemoveLocalRepositoryModal
+          close={closeRemovalModal}
+          repository={repository}
+        />
+      )}
+
+      {isPublishGuardOpen && (
+        <PublishLocalRepositoryGuard
+          close={closePublishGuard}
+          repository={repository}
+        />
+      )}
+    </>
+  );
+};
+
+export default ViewRepositoryActionsBlock;
diff --git a/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/ViewRepositoryActionsBlock/index.ts b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/ViewRepositoryActionsBlock/index.ts
new file mode 100644
index 000000000..987cda636
--- /dev/null
+++ b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/components/ViewRepositoryActionsBlock/index.ts
@@ -0,0 +1 @@
+export { default } from "./ViewRepositoryActionsBlock";
diff --git a/src/features/local-repositories/components/ViewLocalRepositorySidePanel/index.ts b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/index.ts
new file mode 100644
index 000000000..5f273e87f
--- /dev/null
+++ b/src/features/local-repositories/components/ViewLocalRepositorySidePanel/index.ts
@@ -0,0 +1 @@
+export { default } from "./ViewLocalRepositorySidePanel";
diff --git a/src/features/local-repositories/hooks/index.ts b/src/features/local-repositories/hooks/index.ts
new file mode 100644
index 000000000..fc65bfb3f
--- /dev/null
+++ b/src/features/local-repositories/hooks/index.ts
@@ -0,0 +1 @@
+export { useGetRepositoryActions } from "./useGetRepositoryActions";
diff --git a/src/features/local-repositories/hooks/useGetRepositoryActions.ts b/src/features/local-repositories/hooks/useGetRepositoryActions.ts
new file mode 100644
index 000000000..82c46e57a
--- /dev/null
+++ b/src/features/local-repositories/hooks/useGetRepositoryActions.ts
@@ -0,0 +1,71 @@
+import usePageParams from "@/hooks/usePageParams";
+import type { Local } from "../types";
+import type { Action } from "@/types/Action";
+
+interface UseGetRepositoryActionsProps {
+  readonly repository: Local;
+  readonly openRemovalModal: () => void;
+  readonly openPublishGuard: () => void;
+}
+
+export const useGetRepositoryActions = ({
+  repository,
+  openRemovalModal,
+  openPublishGuard,
+}: UseGetRepositoryActionsProps) => {
+  const { sidePath, createSidePathPusher, createPageParamsSetter } =
+    usePageParams();
+
+  const openSidePanel = (action: string) => {
+    if (!sidePath.length) {
+      return createPageParamsSetter({
+        sidePath: [action],
+        name: repository.local_id,
+      });
+    }
+    return createSidePathPusher(action);
+  };
+
+  const viewAction: Action = {
+    icon: "show",
+    label: "View details",
+    "aria-label": `View details of "${repository.display_name}" repository`,
+    onClick: openSidePanel("view"),
+  };
+
+  const actions: Action[] = [
+    {
+      icon: "edit",
+      label: "Edit",
+      "aria-label": `Edit "${repository.display_name}" repository`,
+      onClick: openSidePanel("edit"),
+    },
+    {
+      icon: "import",
+      label: "Import packages",
+      "aria-label": `Import packages to "${repository.display_name}" repository`,
+      onClick: openSidePanel("import-packages"),
+    },
+    {
+      icon: "upload",
+      label: "Publish",
+      "aria-label": `Publish "${repository.display_name}" repository`,
+      onClick: openPublishGuard,
+    },
+  ];
+
+  const destructiveActions: Action[] = [
+    {
+      icon: "delete",
+      label: "Remove",
+      "aria-label": `Remove "${repository.display_name}" repository`,
+      onClick: openRemovalModal,
+    },
+  ];
+
+  return {
+    viewAction,
+    actions,
+    destructiveActions,
+  };
+};
diff --git a/src/features/local-repositories/index.ts b/src/features/local-repositories/index.ts
new file mode 100644
index 000000000..9c49d53be
--- /dev/null
+++ b/src/features/local-repositories/index.ts
@@ -0,0 +1,17 @@
+export { useGetLocalRepositories } from "./api";
+
+export { default as LocalRepositoriesContainer } from "./components/LocalRepositoriesContainer";
+export { default as AddLocalRepositoryButton } from "./components/AddLocalRepositoryButton";
+export { default as ViewLocalRepositorySidePanel } from "./components/ViewLocalRepositorySidePanel";
+export { default as AddLocalRepositorySidePanel } from "./components/AddLocalRepositorySidePanel";
+export { default as PublishLocalRepositorySidePanel } from "./components/PublishLocalRepositorySidePanel";
+export { default as EditLocalRepositorySidePanel } from "./components/EditLocalRepositorySidePanel";
+export { default as ImportRepositoryPackagesSidePanel } from "./components/ImportRepositoryPackagesSidePanel";
+
+export type {
+  Local,
+  Task,
+  ImportLocalPackagesRequest,
+  CreateLocalRequest,
+  BatchGetLocalsRequest,
+} from "./types";
diff --git a/src/features/local-repositories/types/LocalRepository.ts b/src/features/local-repositories/types/LocalRepository.ts
new file mode 100644
index 000000000..2fce21a98
--- /dev/null
+++ b/src/features/local-repositories/types/LocalRepository.ts
@@ -0,0 +1,35 @@
+export interface Local extends Record<string, unknown> {
+  name: string;
+  local_id: string;
+  display_name: string;
+  comment?: string;
+  distribution: string;
+  component: string;
+}
+
+export interface LocalPackage {
+  name: string;
+}
+
+export interface CreateLocalRequest {
+  display_name: string;
+  comment?: string;
+  distribution: string;
+  component: string;
+}
+
+export interface BatchGetLocalsRequest {
+  names: string[];
+}
+
+export interface ImportLocalPackagesRequest {
+  name: string;
+  url: string;
+  validate_only?: boolean;
+}
+
+export interface ListLocalPackagesRequest {
+  repository: string;
+  page_size?: number;
+  page_token?: string;
+}
diff --git a/src/features/local-repositories/types/Task.ts b/src/features/local-repositories/types/Task.ts
new file mode 100644
index 000000000..1960a50e3
--- /dev/null
+++ b/src/features/local-repositories/types/Task.ts
@@ -0,0 +1,9 @@
+export type TaskStatus = "idle" | "in progress" | "succeeded" | "failed";
+
+export interface Task {
+  name: string;
+  display_name: string;
+  task_id: string;
+  status: TaskStatus;
+  output: string;
+}
diff --git a/src/features/local-repositories/types/index.ts b/src/features/local-repositories/types/index.ts
new file mode 100644
index 000000000..dc191efe7
--- /dev/null
+++ b/src/features/local-repositories/types/index.ts
@@ -0,0 +1,8 @@
+export type {
+  Local,
+  ImportLocalPackagesRequest,
+  LocalPackage,
+  CreateLocalRequest,
+  BatchGetLocalsRequest,
+} from "./LocalRepository";
+export type { Task } from "./Task";
diff --git a/src/features/mirrors/types/Architecture.ts b/src/features/mirrors/types/Architecture.ts
index 69c279cfe..b5731854b 100644
--- a/src/features/mirrors/types/Architecture.ts
+++ b/src/features/mirrors/types/Architecture.ts
@@ -1,4 +1,4 @@
 export interface Architecture {
   slug: string;
   preselected: boolean;
-}
\ No newline at end of file
+}
diff --git a/src/features/publication-targets/api/useGetPublicationTargets.ts b/src/features/publication-targets/api/useGetPublicationTargets.ts
new file mode 100644
index 000000000..011463707
--- /dev/null
+++ b/src/features/publication-targets/api/useGetPublicationTargets.ts
@@ -0,0 +1,37 @@
+import type { PublicationTarget } from "../types/PublicationTarget";
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+
+interface UseGetPublicationTargetsReturnType {
+  publicationTargets: PublicationTarget[];
+  isGettingPublicationTargets: boolean;
+}
+
+export interface ListPublicationTargetsResponse {
+  publicationTargets?: PublicationTarget[];
+  nextPageToken?: string;
+}
+
+const useGetPublicationTargets = (): UseGetPublicationTargetsReturnType => {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  const { data, isLoading } = useQuery<
+    AxiosResponse<ListPublicationTargetsResponse>,
+    AxiosError<ApiError>
+  >({
+    queryKey: ["publicationTargets", "all"],
+    queryFn: async () =>
+      await authFetchDebArchive.get("publicationTargets", {
+        params: { pageSize: 100 },
+      }),
+  });
+
+  return {
+    publicationTargets: data?.data?.publicationTargets ?? [],
+    isGettingPublicationTargets: isLoading,
+  };
+};
+
+export default useGetPublicationTargets;
diff --git a/src/features/publication-targets/index.ts b/src/features/publication-targets/index.ts
new file mode 100644
index 000000000..b342ba817
--- /dev/null
+++ b/src/features/publication-targets/index.ts
@@ -0,0 +1,2 @@
+export { default } from "./api/useGetPublicationTargets";
+export type { PublicationTarget } from "./types/PublicationTarget";
diff --git a/src/features/publication-targets/types/PublicationTarget.ts b/src/features/publication-targets/types/PublicationTarget.ts
new file mode 100644
index 000000000..16072bb08
--- /dev/null
+++ b/src/features/publication-targets/types/PublicationTarget.ts
@@ -0,0 +1,5 @@
+export interface PublicationTarget extends Record<string, unknown> {
+  name: string;
+  publication_target_id: string;
+  displayName: string;
+}
diff --git a/src/features/publications/api/useAddPublication.ts b/src/features/publications/api/useAddPublication.ts
new file mode 100644
index 000000000..02fc87ccd
--- /dev/null
+++ b/src/features/publications/api/useAddPublication.ts
@@ -0,0 +1,43 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+import type { Publication } from "../types";
+
+interface CreatePublicationParams {
+  publication_target: string;
+  source: string;
+  distribution?: string;
+  label?: string;
+  origin?: string;
+  architectures?: string[];
+  hash_indexing?: boolean;
+  automatic_installation?: boolean;
+  automatic_upgrades?: boolean;
+  multi_dist?: boolean;
+  skip_bz2?: boolean;
+  skip_content_indexing?: boolean;
+  gpg_key?: string;
+}
+
+export const useAddPublication = () => {
+  const authFetchDebArchive = useFetchDebArchive();
+  const queryClient = useQueryClient();
+
+  const { mutateAsync, isPending } = useMutation<
+    AxiosResponse<Publication>,
+    AxiosError<ApiError>,
+    CreatePublicationParams
+  >({
+    mutationKey: ["publication", "create"],
+    mutationFn: async (params) =>
+      authFetchDebArchive.post("publications", params),
+    onSuccess: async () =>
+      queryClient.invalidateQueries({ queryKey: ["publications"] }),
+  });
+
+  return {
+    addPublication: mutateAsync,
+    isAddingPublication: isPending,
+  };
+};
diff --git a/src/features/publications/api/usePublishPublicaton.ts b/src/features/publications/api/usePublishPublicaton.ts
new file mode 100644
index 000000000..acd20f9a6
--- /dev/null
+++ b/src/features/publications/api/usePublishPublicaton.ts
@@ -0,0 +1,33 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+import type { LocalRepository } from "../types";
+
+interface PublishPublicationParams {
+  name: string;
+  force_overwrite?: boolean;
+  force_cleanup?: boolean;
+}
+
+export const usePublishPublication = () => {
+  const authFetchDebArchive = useFetchDebArchive();
+  const queryClient = useQueryClient();
+
+  const { mutateAsync, isPending } = useMutation<
+    AxiosResponse<LocalRepository>,
+    AxiosError<ApiError>,
+    PublishPublicationParams
+  >({
+    mutationKey: ["publication", "publish"],
+    mutationFn: async ({ name, ...params }) =>
+      authFetchDebArchive.post(`${name}:publish`, params),
+    onSuccess: async () =>
+      queryClient.invalidateQueries({ queryKey: ["publications"] }),
+  });
+
+  return {
+    publishPublication: mutateAsync,
+    isPublishingPublication: isPending,
+  };
+};
diff --git a/src/features/publications/components/RemovePublicationModal/RemovePublicationModal.test.tsx b/src/features/publications/components/RemovePublicationModal/RemovePublicationModal.test.tsx
index 5458c960b..9b392b752 100644
--- a/src/features/publications/components/RemovePublicationModal/RemovePublicationModal.test.tsx
+++ b/src/features/publications/components/RemovePublicationModal/RemovePublicationModal.test.tsx
@@ -36,11 +36,15 @@ describe("RemovePublicationModal", () => {
 
     renderWithProviders(<RemovePublicationModal {...props} />);
 
-    await user.click(screen.getByRole("button", { name: "Remove publication" }));
+    await user.click(
+      screen.getByRole("button", { name: "Remove publication" }),
+    );
 
     expect(props.close).toHaveBeenCalledTimes(1);
     expect(
-      await screen.findByText(`You have successfully removed ${publicationLabel}`),
+      await screen.findByText(
+        `You have successfully removed ${publicationLabel}`,
+      ),
     ).toBeInTheDocument();
     expect(
       screen.getByText("The publication has been removed from Landscape."),
@@ -58,7 +62,9 @@ describe("RemovePublicationModal", () => {
 
     renderWithProviders(<RemovePublicationModal {...props} />);
 
-    await user.click(screen.getByRole("button", { name: "Remove publication" }));
+    await user.click(
+      screen.getByRole("button", { name: "Remove publication" }),
+    );
 
     expect(props.close).toHaveBeenCalledTimes(1);
     expect(
diff --git a/src/features/publications/components/RepublishPublicationModal/RepublishPublicationModal.test.tsx b/src/features/publications/components/RepublishPublicationModal/RepublishPublicationModal.test.tsx
index 354c0c9bf..3df7f14f5 100644
--- a/src/features/publications/components/RepublishPublicationModal/RepublishPublicationModal.test.tsx
+++ b/src/features/publications/components/RepublishPublicationModal/RepublishPublicationModal.test.tsx
@@ -40,7 +40,9 @@ describe("RepublishPublicationModal", () => {
 
     expect(props.close).toHaveBeenCalledTimes(1);
     expect(
-      await screen.findByText(`You have marked ${publicationLabel} to be republished`),
+      await screen.findByText(
+        `You have marked ${publicationLabel} to be republished`,
+      ),
     ).toBeInTheDocument();
     expect(
       screen.getByText(
diff --git a/src/features/publications/index.ts b/src/features/publications/index.ts
index e1c9265e4..0dfe11d58 100644
--- a/src/features/publications/index.ts
+++ b/src/features/publications/index.ts
@@ -5,10 +5,10 @@ export { default as PublicationDetailsSidePanel } from "./components/Publication
 export type {
   Publication,
   PublicationTarget,
-  Local,
   Mirror,
   PublishPublicationResponse,
-  BatchGetLocalsResponse,
   BatchGetMirrorsResponse,
   BatchGetPublicationTargetsResponse,
 } from "./types";
+export { useAddPublication } from "./api/useAddPublication";
+export { usePublishPublication } from "./api/usePublishPublicaton";
diff --git a/src/features/publications/types/Publication.ts b/src/features/publications/types/Publication.ts
index ed61aabca..9cf064204 100644
--- a/src/features/publications/types/Publication.ts
+++ b/src/features/publications/types/Publication.ts
@@ -6,32 +6,6 @@ interface GpgKey extends Record<string, unknown> {
   armor: string;
 }
 
-interface UploadersGroup {
-  title: string;
-  users?: string[];
-}
-
-interface UploadersRule {
-  condition: string;
-  allow?: string[];
-  deny?: string[];
-}
-
-interface Uploaders {
-  groups?: UploadersGroup[];
-  rules?: UploadersRule[];
-}
-
-export interface Local extends Record<string, unknown> {
-  name?: string;
-  localId?: string;
-  displayName: string;
-  comment?: string;
-  defaultDistribution?: string;
-  defaultComponent?: string;
-  uploaders?: Uploaders;
-}
-
 export interface Mirror extends Record<string, unknown> {
   name?: string;
   mirrorId?: string;
@@ -69,6 +43,7 @@ export interface PublicationWritable {
 export interface Publication extends Record<string, unknown> {
   publicationId: string;
   name: string;
+  displayName: string;
   publicationTarget: string;
   source: string;
   distribution: string;
@@ -89,11 +64,6 @@ export interface ListPublicationsResponse {
   nextPageToken?: string;
 }
 
-export interface ListLocalsResponse {
-  locals?: Local[];
-  nextPageToken?: string;
-}
-
 export interface ListMirrorsResponse {
   mirrors?: Mirror[];
   nextPageToken?: string;
@@ -120,10 +90,6 @@ export interface BatchGetMirrorsResponse {
   mirrors?: Mirror[];
 }
 
-export interface BatchGetLocalsResponse {
-  locals?: Local[];
-}
-
 export interface PublishPublicationResponse {
   task?: Task;
 }
diff --git a/src/features/publications/types/index.ts b/src/features/publications/types/index.ts
index a246b4f9e..3f056ec3c 100644
--- a/src/features/publications/types/index.ts
+++ b/src/features/publications/types/index.ts
@@ -1,12 +1,9 @@
 export type {
-  BatchGetLocalsResponse,
   BatchGetMirrorsResponse,
   BatchGetPublicationTargetsResponse,
-  ListLocalsResponse,
   ListMirrorsResponse,
   ListPublicationsResponse,
   ListPublicationTargetsResponse,
-  Local,
   Mirror,
   Publication,
   PublicationTarget,
diff --git a/src/pages/dashboard/repositories/local-repositories/LocalRepositoriesPage.tsx b/src/pages/dashboard/repositories/local-repositories/LocalRepositoriesPage.tsx
index 8aee14ba5..a750faf99 100644
--- a/src/pages/dashboard/repositories/local-repositories/LocalRepositoriesPage.tsx
+++ b/src/pages/dashboard/repositories/local-repositories/LocalRepositoriesPage.tsx
@@ -1,86 +1,115 @@
-import EmptyState from "@/components/layout/EmptyState";
-import LoadingState from "@/components/layout/LoadingState";
 import PageContent from "@/components/layout/PageContent";
 import PageHeader from "@/components/layout/PageHeader";
 import PageMain from "@/components/layout/PageMain";
-import { APTSourcesList, useGetAPTSources } from "@/features/apt-sources";
-import useSidePanel from "@/hooks/useSidePanel";
-import { Button } from "@canonical/react-components";
+import SidePanel from "@/components/layout/SidePanel";
+import {
+  useGetLocalRepositories,
+  LocalRepositoriesContainer,
+  AddLocalRepositoryButton,
+} from "@/features/local-repositories";
+import useSetDynamicFilterValidation from "@/hooks/useDynamicFilterValidation";
+import usePageParams from "@/hooks/usePageParams";
 import type { FC } from "react";
-import { lazy, Suspense } from "react";
-// import { GPG_KEYS_DOCS_URL } from "./constants";
+import { lazy } from "react";
 
-const NewAPTSourceForm = lazy(async () =>
-  import("@/features/apt-sources").then((module) => ({
-    default: module.NewAPTSourceForm,
+const AddLocalRepositorySidePanel = lazy(async () =>
+  import("@/features/local-repositories").then((module) => ({
+    default: module.AddLocalRepositorySidePanel,
   })),
 );
 
-const APTSourcesPage: FC = () => {
-  const { setSidePanelContent } = useSidePanel();
-  const { aptSources: items, isGettingAPTSources: isLoading } =
-    useGetAPTSources();
+const ViewLocalRepositorySidePanel = lazy(async () =>
+  import("@/features/local-repositories").then((module) => ({
+    default: module.ViewLocalRepositorySidePanel,
+  })),
+);
+
+const EditLocalRepositorySidePanel = lazy(async () =>
+  import("@/features/local-repositories").then((module) => ({
+    default: module.EditLocalRepositorySidePanel,
+  })),
+);
+
+const ImportRepositoryPackagesSidePanel = lazy(async () =>
+  import("@/features/local-repositories").then((module) => ({
+    default: module.ImportRepositoryPackagesSidePanel,
+  })),
+);
+
+const PublishLocalRepositorySidePanel = lazy(async () =>
+  import("@/features/local-repositories").then((module) => ({
+    default: module.PublishLocalRepositorySidePanel,
+  })),
+);
+
+const LocalRepositoriesPage: FC = () => {
+  const { search, lastSidePathSegment, sidePath, createPageParamsSetter } =
+    usePageParams();
 
-  const handleOpen = () => {
-    setSidePanelContent(
-      "Add APT source",
-      <Suspense fallback={<LoadingState />}>
-        <NewAPTSourceForm />
-      </Suspense>,
-    );
-  };
+  const { repositories, isGettingRepositories } =
+    useGetLocalRepositories(search);
+
+  useSetDynamicFilterValidation("sidePath", [
+    "add",
+    "publish",
+    "edit",
+    "import-packages",
+    "view",
+  ]);
 
   return (
     <PageMain>
       <PageHeader
-        title="APT sources"
-        actions={[
-          <Button
-            key="new-key-button"
-            appearance="positive"
-            onClick={handleOpen}
-            type="button"
-          >
-            Add APT source
-          </Button>,
-        ]}
+        title="Local Repositories"
+        actions={
+          repositories.length
+            ? [<AddLocalRepositoryButton key="add-local-repository" />]
+            : undefined
+        }
       />
       <PageContent hasTable>
-        {isLoading && <LoadingState />}
-        {!isLoading && items.length === 0 && (
-          <EmptyState
-            title="No APT sources found"
-            icon="connected"
-            body={
-              <>
-                <p className="u-no-margin--bottom">
-                  You haven’t added any APT sources yet.
-                </p>
-                <a
-                  href="#" // TODO: discard
-                  target="_blank"
-                  rel="nofollow noopener noreferrer"
-                >
-                  How to manage APT sources in Landscape
-                </a>
-              </>
-            }
-            cta={[
-              <Button
-                appearance="positive"
-                key="table-add-new-mirror"
-                onClick={handleOpen}
-                type="button"
-              >
-                Add APT source
-              </Button>,
-            ]}
-          />
-        )}
-        {!isLoading && items.length > 0 && <APTSourcesList items={items} />}
+        <LocalRepositoriesContainer
+          isPending={isGettingRepositories}
+          repositories={repositories}
+        />
       </PageContent>
+
+      <SidePanel
+        onClose={createPageParamsSetter({ sidePath: [], name: "" })}
+        isOpen={!!sidePath.length}
+      >
+        {lastSidePathSegment === "add" && (
+          <SidePanel.Suspense key="add">
+            <AddLocalRepositorySidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "view" && (
+          <SidePanel.Suspense key="view">
+            <ViewLocalRepositorySidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "edit" && (
+          <SidePanel.Suspense key="edit">
+            <EditLocalRepositorySidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "import-packages" && (
+          <SidePanel.Suspense key="import-packages">
+            <ImportRepositoryPackagesSidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "publish" && (
+          <SidePanel.Suspense key="publish">
+            <PublishLocalRepositorySidePanel />
+          </SidePanel.Suspense>
+        )}
+      </SidePanel>
     </PageMain>
   );
 };
 
-export default APTSourcesPage;
+export default LocalRepositoriesPage;
diff --git a/src/styles/partials/icons.scss b/src/styles/partials/icons.scss
index 418185e05..effa9948d 100644
--- a/src/styles/partials/icons.scss
+++ b/src/styles/partials/icons.scss
@@ -57,6 +57,7 @@
 @include vf-p-icon-security-tick;
 @include vf-p-icon-filter;
 @include vf-p-icon-arrow-up;
+@include vf-p-icon-import;
 
 @mixin vf-icon-okta($color) {
   background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='256px' height='256px' viewBox='0 0 256 256' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' preserveAspectRatio='xMidYMid'%3E%3Ctitle%3Eokta%3C/title%3E%3Cg%3E%3Cpath d='M140.84428,1.77777778 L135.578481,66.6311111 C133.0879,66.3466667 130.59732,66.2044444 128.03558,66.2044444 C124.833405,66.2044444 121.702389,66.4177778 118.642533,66.9155556 L115.653837,35.4844444 C115.582677,34.4888889 116.365431,33.6355556 117.361663,33.6355556 L122.698621,33.6355556 L120.136881,1.84888889 C120.065722,0.853333333 120.848476,0 121.773549,0 L139.207612,0 C140.203845,0 140.986598,0.853333333 140.84428,1.84888889 L140.84428,1.84888889 L140.84428,1.77777778 Z M96.8677434,4.97777778 C96.5831056,4.05333333 95.5868734,3.48444444 94.6618006,3.84 L78.2951286,9.81333333 C77.3700558,10.1688889 76.9430991,11.2355556 77.3700558,12.0888889 L90.6768718,41.1022222 L85.6245513,42.9511111 C84.6994785,43.3066667 84.2725218,44.3733333 84.6994785,45.2266667 L98.2909322,73.7422222 C103.200934,71.04 108.537892,68.9777778 114.159488,67.6977778 L96.9389028,4.97777778 L96.8677434,4.97777778 Z M56.7338171,23.04 L94.3771628,76.0888889 C89.6094801,79.2177778 85.268754,82.9155556 81.568463,87.1822222 L59.0109193,64.9955556 C58.2993249,64.2844444 58.3704843,63.1466667 59.0820788,62.5066667 L63.2093265,59.0933333 L40.7941017,36.4088889 C40.0825073,35.6977778 40.1536667,34.56 40.9364206,33.92 L54.2432366,22.7555556 C55.0259905,22.1155556 56.0933821,22.2577778 56.6626577,23.04 L56.7338171,23.04 Z M25.1390241,53.76 C24.3562702,53.1911111 23.2177191,53.4755556 22.719603,54.3288889 L14.0381509,69.4044444 C13.5400348,70.2577778 13.895832,71.3244444 14.7497453,71.7511111 L43.6404795,85.4044444 L40.9364206,90.0266667 C40.4383045,90.88 40.7941017,92.0177778 41.7191745,92.3733333 L70.4675897,105.528889 C72.5312136,100.195556 75.3064319,95.2177778 78.7220852,90.7377778 L25.1390241,53.76 Z M3.86235042,94.72 C4.00466931,93.7244444 5.00090152,93.1555556 5.92597429,93.3688889 L68.902082,109.795556 C67.2654148,115.128889 66.340342,120.746667 66.1980231,126.577778 L34.6743896,124.017778 C33.6781573,123.946667 32.9665629,123.022222 33.1800412,122.026667 L34.105114,116.764444 L2.29684266,113.777778 C1.30061044,113.706667 0.660175451,112.782222 0.802494339,111.786667 L3.79119098,94.6488889 L3.79119098,94.6488889 L3.86235042,94.72 Z M1.51408878,137.244444 C0.517856564,137.315556 -0.12257843,138.24 0.0197404578,139.235556 L3.07959654,156.373333 C3.22191543,157.368889 4.21814764,157.937778 5.14322041,157.724444 L36.026419,149.688889 L36.9514918,154.951111 C37.0938106,155.946667 38.0900429,156.515556 39.0151156,156.302222 L69.4713575,147.911111 C67.6923714,142.648889 66.5538203,137.031111 66.2691826,131.271111 L1.44292933,137.244444 L1.51408878,137.244444 Z M11.6187298,182.328889 C11.1206137,181.475556 11.4764109,180.408889 12.3303242,179.982222 L71.1080247,152.106667 C73.3139675,157.368889 76.3026641,162.275556 79.8606363,166.684444 L54.1009177,185.031111 C53.3181638,185.6 52.1796127,185.386667 51.6814966,184.533333 L48.9774377,179.84 L22.719603,197.973333 C21.9368491,198.542222 20.798298,198.257778 20.3001819,197.404444 L11.5475703,182.328889 L11.6187298,182.328889 Z M82.849333,170.097778 L37.0938106,216.391111 C36.3822162,217.102222 36.4533756,218.24 37.2361295,218.88 L50.6141049,230.044444 C51.3968588,230.684444 52.4642505,230.542222 53.033526,229.76 L71.5349814,203.733333 L75.6622291,207.217778 C76.444983,207.857778 77.5835341,207.715556 78.1528097,206.862222 L96.0849895,180.835556 C91.2461473,177.848889 86.7631024,174.222222 82.9204924,170.097778 L82.849333,170.097778 Z M73.8120836,244.408889 C72.8870108,244.053333 72.4600542,242.986667 72.8870108,242.133333 L99.9987589,182.968889 C104.97992,185.528889 110.388038,187.448889 116.009634,188.515556 L108.039776,219.093333 C107.826298,220.017778 106.758906,220.586667 105.833833,220.231111 L100.781513,218.382222 L92.313539,249.173333 C92.0289012,250.097778 91.032669,250.666667 90.1075962,250.311111 L73.7409242,244.337778 L73.7409242,244.337778 L73.8120836,244.408889 Z M120.492679,189.297778 L115.22688,254.151111 C115.15572,255.146667 115.938474,256 116.863547,256 L134.297611,256 C135.293843,256 136.076597,255.146667 135.934278,254.151111 L133.372538,222.364444 L138.709496,222.364444 C139.705728,222.364444 140.488482,221.511111 140.417323,220.515556 L137.428626,189.084444 C134.36877,189.582222 131.237755,189.795556 128.03558,189.795556 C125.47384,189.795556 122.983259,189.653333 120.492679,189.297778 L120.492679,189.297778 Z M183.255308,13.7244444 C183.682265,12.8 183.255308,11.8044444 182.330235,11.4488889 L165.963563,5.47555556 C165.03849,5.12 164.042258,5.68888889 163.75762,6.61333333 L155.289647,37.4044444 L150.237326,35.5555556 C149.312253,35.2 148.316021,35.7688889 148.031383,36.6933333 L140.061526,67.2711111 C145.754281,68.4088889 151.091239,70.3288889 156.072401,72.8177778 L183.255308,13.7244444 L183.255308,13.7244444 Z M218.977349,39.5377778 L173.221826,85.8311111 C169.379217,81.7066667 164.967331,78.08 160.057329,75.0933333 L177.989509,49.0666667 C178.558785,48.2844444 179.697336,48.0711111 180.48009,48.7111111 L184.607337,52.1955556 L203.108793,26.1688889 C203.678068,25.3866667 204.81662,25.2444444 205.528214,25.8844444 L218.906189,37.0488889 C219.688943,37.6888889 219.688943,38.8266667 219.048508,39.5377778 L218.977349,39.5377778 Z M243.740835,75.9466667 C244.665908,75.52 244.950546,74.4533333 244.45243,73.6 L235.699818,58.5244444 C235.201702,57.6711111 234.063151,57.4577778 233.280397,57.9555556 L207.022562,76.0888889 L204.318503,71.4666667 C203.820387,70.6133333 202.681836,70.3288889 201.899082,70.9688889 L176.139364,89.3155556 C179.697336,93.7244444 182.614873,98.6311111 184.891975,103.893333 L243.669676,76.0177778 L243.740835,75.9466667 Z M252.991563,99.5555556 L255.98026,116.693333 C256.122578,117.688889 255.482143,118.542222 254.485911,118.684444 L189.659658,124.728889 C189.37502,118.897778 188.236469,113.351111 186.457483,108.088889 L216.913725,99.6977778 C217.838798,99.4133333 218.83503,100.053333 218.977349,101.048889 L219.902422,106.311111 L250.78562,98.2755556 C251.710693,98.0622222 252.706925,98.6311111 252.849244,99.6266667 L252.849244,99.6266667 L252.991563,99.5555556 Z M250.074026,162.488889 C250.999098,162.702222 251.995331,162.133333 252.13765,161.137778 L255.126346,144 C255.268665,143.004444 254.62823,142.151111 253.631998,142.008889 L221.823727,139.022222 L222.748799,133.76 C222.891118,132.764444 222.250683,131.911111 221.254451,131.768889 L189.730817,129.208889 C189.588499,135.04 188.663426,140.657778 187.026759,145.991111 L250.002866,162.417778 L250.002866,162.417778 L250.074026,162.488889 Z M233.280397,201.6 C232.782281,202.453333 231.64373,202.666667 230.860976,202.168889 L177.277915,165.191111 C180.693568,160.711111 183.468786,155.733333 185.53241,150.4 L214.280826,163.555556 C215.205898,163.982222 215.561696,165.048889 215.063579,165.902222 L212.359521,170.524444 L241.250255,184.177778 C242.104168,184.604444 242.459965,185.671111 241.961849,186.524444 L233.280397,201.6 L233.280397,201.6 L233.280397,201.6 Z M161.622837,179.768889 L199.266183,232.817778 C199.835458,233.6 200.97401,233.742222 201.685604,233.102222 L214.99242,221.937778 C215.775174,221.297778 215.775174,220.16 215.134739,219.448889 L192.719514,196.764444 L196.846762,193.351111 C197.629516,192.711111 197.629516,191.573333 196.917921,190.862222 L174.360378,168.675556 C170.588927,172.942222 166.31936,176.711111 161.551678,179.768889 L161.551678,179.768889 L161.622837,179.768889 Z M161.26704,252.017778 C160.341967,252.373333 159.345735,251.804444 159.061097,250.88 L141.840512,188.16 C147.462108,186.88 152.799066,184.817778 157.709068,182.115556 L171.300522,210.631111 C171.727478,211.555556 171.300522,212.622222 170.375449,212.906667 L165.323128,214.755556 L178.629944,243.768889 C179.056901,244.693333 178.629944,245.688889 177.704871,246.044444 L161.338199,252.017778 L161.338199,252.017778 L161.26704,252.017778 Z' fill='#{vf-url-friendly-color($color)}'%3E%3C/path%3E%3C/g%3E%3C/svg%3E%0A");
@@ -296,6 +297,11 @@
   @include vf-icon-close($color-negative);
 }
 
+.p-icon--close--muted {
+  @extend %icon;
+  @include vf-icon-close($color-mid-dark);
+}
+
 .p-icon--security-tick--negative {
   @extend %icon;
   @include vf-icon-security-tick($color-negative);
diff --git a/src/templates/dashboard/Navigation/constants.ts b/src/templates/dashboard/Navigation/constants.ts
index 3717acffa..b3c47877d 100644
--- a/src/templates/dashboard/Navigation/constants.ts
+++ b/src/templates/dashboard/Navigation/constants.ts
@@ -23,18 +23,22 @@ export const REPOSITORY_SUBMENU: MenuItem[] = [
   {
     label: "Local repositories",
     path: ROUTES.repositories.localRepositories(),
-    env: "selfHosted"
+    env: "selfHosted",
+  },
+  {
+    label: "Publications",
+    path: ROUTES.repositories.publications(),
+    env: "selfHosted",
   },
-  { label: "Publications", path: ROUTES.repositories.publications(), env: "selfHosted" },
   {
     label: "Publication targets",
     path: ROUTES.repositories.publicationTargets(),
-    env: "selfHosted"
+    env: "selfHosted",
   },
   {
     label: "Repository profiles",
     path: ROUTES.repositories.repositoryProfiles(),
-    env: "selfHosted"
+    env: "selfHosted",
   },
 ];
 
diff --git a/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.test.tsx b/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.test.tsx
index e126e3b2f..fa7028790 100644
--- a/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.test.tsx
+++ b/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.test.tsx
@@ -16,10 +16,12 @@ vi.mock("usehooks-ts", async () => {
 
 describe("SecondaryNavigation", () => {
   it("renders correctly", () => {
-    renderWithProviders(<SecondaryNavigation
-                          title={ACCOUNT_SETTINGS.label}
-                          items={ACCOUNT_SETTINGS.items}
-                        />);
+    renderWithProviders(
+      <SecondaryNavigation
+        title={ACCOUNT_SETTINGS.label}
+        items={ACCOUNT_SETTINGS.items}
+      />,
+    );
 
     expect(
       screen.getByRole("heading", { name: ACCOUNT_SETTINGS.label }),
diff --git a/src/tests/mocks/localRepositories.ts b/src/tests/mocks/localRepositories.ts
new file mode 100644
index 000000000..15df9194f
--- /dev/null
+++ b/src/tests/mocks/localRepositories.ts
@@ -0,0 +1,61 @@
+import type { Local } from "@/features/local-repositories";
+
+export const repositories: Local[] = [
+  {
+    name: "locals/aaaa-bbbb-cccc",
+    local_id: "aaaa-bbbb-cccc",
+    display_name: "repo 1",
+    distribution: "distribution 1",
+    component: "component 1",
+  },
+  {
+    name: "locals/bbbb-cccc-dddd",
+    local_id: "bbbb-cccc-dddd",
+    display_name: "repo 2",
+    comment: "repo 2 description",
+    distribution: "distribution 2",
+    component: "component 2",
+  },
+  {
+    name: "locals/cccc-dddd-eeee",
+    local_id: "cccc-dddd-eeee",
+    display_name: "repo 3",
+    comment: "repo 3 description",
+    distribution: "distribution 3",
+    component: "component 3",
+  },
+] as const;
+
+export const repoPackages = ["package 1", "package 2", "package 3"] as const;
+
+export const succeededTask = {
+  name: "task/vvvv-tttt-pppp",
+  display_name: "validate packages",
+  task_id: "vvvv-tttt-pppp",
+  status: "succeeded",
+  output: "package-A, package-B",
+};
+
+export const failedTask = {
+  name: "task/vvvv-tttt-pppp",
+  display_name: "validate packages",
+  task_id: "vvvv-tttt-pppp",
+  status: "failed",
+  output: "package-A, package-B",
+};
+
+export const inProgressTask = {
+  name: "task/vvvv-tttt-pppp",
+  display_name: "validate packages",
+  task_id: "vvvv-tttt-pppp",
+  status: "in progress",
+  output: "",
+};
+
+export const emptyTask = {
+  name: "task/vvvv-tttt-pppp",
+  display_name: "validate packages",
+  task_id: "vvvv-tttt-pppp",
+  status: "succeeded",
+  output: "",
+};
diff --git a/src/tests/mocks/publications.ts b/src/tests/mocks/publications.ts
index 3151f05ff..09a2c9646 100644
--- a/src/tests/mocks/publications.ts
+++ b/src/tests/mocks/publications.ts
@@ -1,8 +1,5 @@
-import type {
-  Local,
-  Publication,
-  PublicationTarget,
-} from "@/features/publications";
+import type { Publication } from "@/features/publications";
+import type { PublicationTarget } from "@/features/publication-targets";
 
 export const publications = [
   {
@@ -10,6 +7,7 @@ export const publications = [
     publicationId: "7b1d5c2f-0c4e-4d8e-8f2f-99d4f2d9a123",
     publicationTarget: "publicationTargets/primary-us-mirror",
     source: "mirrors/ubuntu-archive-mirror",
+    displayName: "jammy publication",
     distribution: "jammy",
     label: "Primary publication",
     origin: "Canonical",
@@ -20,12 +18,14 @@ export const publications = [
     multiDist: false,
     skipBz2: false,
     skipContents: false,
+    publishTime: "March 12, 2026",
   },
   {
     name: "publications/c9f6355e-c8f3-4e73-ab4c-ef6a4c8af4c0",
     publicationId: "c9f6355e-c8f3-4e73-ab4c-ef6a4c8af4c0",
+    displayName: "noble publication",
     publicationTarget: "publicationTargets/emea-mirror",
-    source: "mirrors/ubuntu-security-mirror",
+    source: "locals/aaaa-bbbb-cccc",
     distribution: "noble",
     label: "EMEA publication",
     origin: "Canonical",
@@ -39,33 +39,69 @@ export const publications = [
     gpgKey: {
       armor: "-----BEGIN PGP PRIVATE KEY BLOCK-----...",
     },
+    publishTime: "March 12, 2026",
   },
-] as const satisfies Publication[];
-
-export const locals = [
   {
-    name: "locals/internal-packages",
-    localId: "internal-packages",
-    displayName: "Internal packages",
-    defaultDistribution: "focal",
-    defaultComponent: "main",
+    name: "publications/g8h8888e-c8f8-8e88-ab8c-ef8a8c8af8c8",
+    publicationId: "g8h8888e-c8f8-8e88-ab8c-ef8a8c8af8c8",
+    displayName: "local publication",
+    publicationTarget: "publicationTargets/local",
+    source: "locals/aaaa-bbbb-cccc",
+    distribution: "noble",
+    label: "Local publication",
+    origin: "Canonical",
+    architectures: ["amd64"],
+    acquireByHash: false,
+    butAutomaticUpgrades: false,
+    notAutomatic: true,
+    multiDist: false,
+    skipBz2: true,
+    skipContents: true,
+    publishTime: "April 20, 2026",
   },
-] as const satisfies Local[];
+] as const satisfies Publication[];
 
-export const publicationTargets = [
+export const publicationTargets: PublicationTarget[] = [
   {
-    name: "publicationTargets/primary-us-mirror",
-    publicationTargetId: "primary-us-mirror",
-    displayName: "Primary US mirror",
+    name: "publicationTargets/aaaaaaaa-0000-0000-0000-000000000001",
+    publication_target_id: "aaaaaaaa-0000-0000-0000-000000000001",
+    displayName: "prod-s3-us-east",
+    s3: {
+      region: "us-east-1",
+      bucket: "landscape-prod-packages",
+      awsAccessKeyId: "AKIAIOSFODNN7EXAMPLE",
+      awsSecretAccessKey: "wJalrXUtnFEMI/K7MDENG/bPxRfiCYEXAMPLEKEY",
+      prefix: "ubuntu/",
+      acl: "private",
+      storageClass: "STANDARD",
+      encryptionMethod: "AES256",
+      disableMultiDel: false,
+      forceSigV2: false,
+    },
   },
   {
-    name: "publicationTargets/emea-mirror",
-    publicationTargetId: "emea-mirror",
-    displayName: "EMEA mirror",
+    name: "publicationTargets/bbbbbbbb-0000-0000-0000-000000000002",
+    publication_target_id: "bbbbbbbb-0000-0000-0000-000000000002",
+    displayName: "staging-s3-eu-west",
+    s3: {
+      region: "eu-west-1",
+      bucket: "landscape-staging-packages",
+      awsAccessKeyId: "AKIAIOSFODNN7EXAMPLE2",
+      awsSecretAccessKey: "wJalrXUtnFEMI/K7MDENG/bPxRfiCYEXAMPLEKEY2",
+      disableMultiDel: true,
+      forceSigV2: false,
+    },
   },
   {
-    name: "publicationTargets/internal-datacenter",
-    publicationTargetId: "internal-datacenter",
-    displayName: "Internal datacenter",
+    name: "publicationTargets/cccccccc-0000-0000-0000-000000000003",
+    publication_target_id: "cccccccc-0000-0000-0000-000000000003",
+    displayName: "swift-internal",
+    swift: {
+      container: "landscape-packages",
+      username: "admin",
+      password: "supersecret",
+      authUrl: "https://keystone.example.com/v3",
+      tenant: "landscape",
+    },
   },
-] as const satisfies PublicationTarget[];
+] as const;
diff --git a/src/tests/server/handlers/index.ts b/src/tests/server/handlers/index.ts
index d3e58a165..f19a1336c 100644
--- a/src/tests/server/handlers/index.ts
+++ b/src/tests/server/handlers/index.ts
@@ -18,6 +18,7 @@ import instance from "./instance";
 import invitations from "./invitations";
 import kernel from "./kernel";
 import mirrors from "./mirrors";
+import localRepository from "./localRepository";
 import oidcIssuers from "./oidcIssuers";
 import organisationPreferences from "./organisationPreferences";
 import packageProfile from "./packageProfile";
@@ -63,6 +64,7 @@ export default [
   ...invitations,
   ...kernel,
   ...mirrors,
+  ...localRepository,
   ...organisationPreferences,
   ...packageProfile,
   ...packages,
diff --git a/src/tests/server/handlers/localRepository.ts b/src/tests/server/handlers/localRepository.ts
new file mode 100644
index 000000000..43760fcd6
--- /dev/null
+++ b/src/tests/server/handlers/localRepository.ts
@@ -0,0 +1,107 @@
+import { delay, http, HttpResponse } from "msw";
+import { API_URL_DEB_ARCHIVE } from "@/constants";
+import {
+  repoPackages,
+  repositories,
+  succeededTask,
+  failedTask,
+  inProgressTask,
+  emptyTask,
+} from "@/tests/mocks/localRepositories";
+import type {
+  ImportLocalPackagesRequest,
+  BatchGetLocalsRequest,
+  CreateLocalRequest,
+} from "@/features/local-repositories";
+
+export default [
+  http.get(`${API_URL_DEB_ARCHIVE}locals`, ({ request }) => {
+    const url = new URL(request.url);
+    const search = url.searchParams.get("filter")?.split("=").pop() ?? "";
+
+    if (!search) {
+      return HttpResponse.json({ locals: repositories });
+    }
+
+    return HttpResponse.json({
+      locals: repositories.filter(({ display_name }) =>
+        display_name.includes(search.substring(2, search.length - 2)),
+      ),
+    });
+  }),
+
+  http.post<never, CreateLocalRequest>(
+    `${API_URL_DEB_ARCHIVE}locals`,
+    async ({ request }) => {
+      const { display_name: namePosted } = await request.json();
+
+      return HttpResponse.json(
+        repositories.find(({ display_name }) => namePosted === display_name),
+      );
+    },
+  ),
+
+  http.post<never, BatchGetLocalsRequest>(
+    `${API_URL_DEB_ARCHIVE}locals\\:batchGet`,
+    async ({ request }) => {
+      const { names } = await request.json();
+
+      return HttpResponse.json(
+        repositories.filter(({ name }) => names.includes(name)),
+      );
+    },
+  ),
+
+  http.get(`${API_URL_DEB_ARCHIVE}locals/:repository`, ({ params }) => {
+    const { repository } = params;
+
+    return HttpResponse.json(
+      repositories.find(({ local_id }) => local_id === repository),
+    );
+  }),
+
+  http.patch(`${API_URL_DEB_ARCHIVE}locals/:repository`, ({ params }) => {
+    const { repository } = params;
+
+    return HttpResponse.json(
+      repositories.find(({ local_id }) => local_id === repository),
+    );
+  }),
+
+  http.delete(`${API_URL_DEB_ARCHIVE}locals/:repository`, () => {
+    return HttpResponse.json(repositories[0]);
+  }),
+
+  http.get(`${API_URL_DEB_ARCHIVE}locals/:repository/packages`, () => {
+    return HttpResponse.json({
+      local_packages: repoPackages,
+    });
+  }),
+
+  http.post<never, ImportLocalPackagesRequest>(
+    `${API_URL_DEB_ARCHIVE}locals/:repository\\:importPackages`,
+    async ({ request }) => {
+      const { url } = await request.json();
+
+      delay(1000);
+
+      if (url === "failed") {
+        return HttpResponse.json(failedTask);
+      }
+
+      if (url === "in/progress") {
+        return HttpResponse.json(inProgressTask);
+      }
+
+      if (url === "empty") {
+        return HttpResponse.json(emptyTask);
+      }
+
+      return HttpResponse.json(succeededTask);
+    },
+  ),
+
+  http.delete(`${API_URL_DEB_ARCHIVE}locals/:repository/packages`, () => {
+    return HttpResponse.json(repoPackages[0]);
+  }),
+];
diff --git a/src/tests/server/handlers/publications.ts b/src/tests/server/handlers/publications.ts
index 14cd56234..97c2ed846 100644
--- a/src/tests/server/handlers/publications.ts
+++ b/src/tests/server/handlers/publications.ts
@@ -2,14 +2,9 @@ import { API_URL_DEB_ARCHIVE } from "@/constants";
 import type {
   PublishPublicationResponse,
   BatchGetPublicationTargetsResponse,
-  BatchGetLocalsResponse,
 } from "@/features/publications";
 import { getEndpointStatus } from "@/tests/controllers/controller";
-import {
-  locals,
-  publications,
-  publicationTargets,
-} from "@/tests/mocks/publications";
+import { publications, publicationTargets } from "@/tests/mocks/publications";
 import type { StrictResponse } from "msw";
 import { delay, http, HttpResponse } from "msw";
 import {
@@ -40,20 +35,6 @@ const toObjectBody = (value: unknown): Record<string, unknown> => {
   return {};
 };
 
-const getLocalsResponse = (requestUrl: string) => {
-  const { pageSize, pageToken } = getDebArchivePaginationParams(requestUrl);
-  const { paginatedData, nextPageToken } = getDebArchivePaginatedResponse(
-    locals,
-    pageToken,
-    pageSize,
-  );
-
-  return HttpResponse.json({
-    locals: paginatedData,
-    nextPageToken,
-  });
-};
-
 const getPublicationTargetsResponse = (requestUrl: string) => {
   const { pageSize, pageToken } = getDebArchivePaginationParams(requestUrl);
   const { paginatedData, nextPageToken } = getDebArchivePaginatedResponse(
@@ -171,17 +152,6 @@ const getBatchPublicationTargetsResponse = async (
   return HttpResponse.json({ publicationTargets: matched });
 };
 
-const getBatchLocalsResponse = async (
-  request: Request,
-): Promise<StrictResponse<BatchGetLocalsResponse>> => {
-  const body = (await request.json()) as { names?: string[] };
-  const requestedNames = body.names ?? [];
-  const matched = locals.filter(({ name }) =>
-    name ? requestedNames.includes(name) : false,
-  );
-  return HttpResponse.json({ locals: matched });
-};
-
 export default [
   http.post(
     `${API_URL_DEB_ARCHIVE}publicationTargets:batchGet`,
@@ -190,20 +160,6 @@ export default [
     },
   ),
 
-  http.post(`${API_URL_DEB_ARCHIVE}locals:batchGet`, async ({ request }) => {
-    return getBatchLocalsResponse(request);
-  }),
-
-  http.get(`${API_URL_DEB_ARCHIVE}locals`, ({ request }) => {
-    const endpointStatus = getEndpointStatus();
-
-    if (endpointStatus.status === "error" && endpointStatus.path === "locals") {
-      return ENDPOINT_STATUS_API_ERROR;
-    }
-
-    return getLocalsResponse(request.url);
-  }),
-
   http.get(`${API_URL_DEB_ARCHIVE}publicationTargets`, ({ request }) => {
     const endpointStatus = getEndpointStatus();
 
@@ -313,19 +269,16 @@ export default [
     return getDeletePublicationResponse();
   }),
 
-  http.post(
-    new RegExp(`${API_URL_DEB_ARCHIVE}publications/.+:publish$`),
-    () => {
-      const endpointStatus = getEndpointStatus();
+  http.post(`${API_URL_DEB_ARCHIVE}publications/:publication\\:publish`, () => {
+    const endpointStatus = getEndpointStatus();
 
-      if (
-        endpointStatus.status === "error" &&
-        matchesPublicationsPath(endpointStatus.path)
-      ) {
-        return ENDPOINT_STATUS_API_ERROR;
-      }
+    if (
+      endpointStatus.status === "error" &&
+      matchesPublicationsPath(endpointStatus.path)
+    ) {
+      return ENDPOINT_STATUS_API_ERROR;
+    }
 
-      return getPublishPublicationResponse();
-    },
-  ),
+    return getPublishPublicationResponse();
+  }),
 ];

From 9a2bf780c51896d7f9e10ea9389449964a7a658a Mon Sep 17 00:00:00 2001
From: Ethan Shaw <ethan.shaw@canonical.com>
Date: Mon, 27 Apr 2026 10:11:23 -0700
Subject: [PATCH 29/42] Mirrors page tests (#569)

Tests for mirrors page

Also fixed profile side panel tests, which weren't updated to use the
newly renamed `name` param

---------

Co-authored-by: Copilot <copilot@github.com>
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
---
 .../AddMirrorForm/AddMirrorForm.test.tsx      | 113 ++++++++++++++++++
 .../AddMirrorForm/AddMirrorForm.tsx           |  29 ++---
 .../EditMirrorForm/EditMirrorForm.test.tsx    | 103 ++++++++++++++++
 .../MirrorActions/MirrorActions.test.tsx      |  14 +++
 .../MirrorActions/MirrorActions.tsx           |  25 ++--
 .../MirrorDetails/MirrorDetails.test.tsx      |  21 ++++
 .../MirrorDetails/MirrorDetails.tsx           |   7 +-
 .../MirrorPackagesCount.test.tsx              |  48 ++++++++
 .../MirrorPackagesCount.tsx                   |   2 +-
 .../MirrorPublicationsLink.test.tsx           |  75 ++++++++++++
 .../MirrorPublicationsList.test.tsx           |  10 ++
 .../MirrorsList/MirrorsList.test.tsx          |  38 ++++++
 .../components/MirrorsList/MirrorsList.tsx    |  16 ++-
 .../RemoveMirrorModal.test.tsx                |  87 ++++++++++++++
 .../SelectableMirrorContentsBlock.test.tsx    |  82 +++++++++++++
 .../UpdateMirrorModal.test.tsx                |  48 ++++++++
 .../PackageProfileDetailsSidePanel.test.tsx   |   2 +-
 .../PackageProfileEditSidePanel.test.tsx      |   2 +-
 .../RebootProfileDetailsSidePanel.test.tsx    |   2 +-
 .../RebootProfileDuplicateSidePanel.test.tsx  |   2 +-
 .../RebootProfileEditSidePanel.test.tsx       |   2 +-
 .../RemovalProfileDetailsSidePanel.test.tsx   |   4 +-
 .../RemovalProfileEditSidePanel.test.tsx      |   2 +-
 .../SecurityProfileDetailsSidePanel.test.tsx  |   4 +-
 ...rityProfileDownloadAuditSidePanel.test.tsx |   2 +-
 .../UpgradeProfileDetailsSidePanel.test.tsx   |   2 +-
 .../WslProfileDetailsSidePanel.test.tsx       |   2 +-
 .../WslProfileEditSidePanel.test.tsx          |   2 +-
 src/tests/mocks/ubuntuArchiveInfo.ts          |  24 ++++
 src/tests/server/handlers/mirrors.ts          |  19 ++-
 src/utils/_helpers.ts                         |   2 +-
 src/utils/output.ts                           |   2 +-
 32 files changed, 734 insertions(+), 59 deletions(-)
 create mode 100644 src/features/mirrors/components/AddMirrorForm/AddMirrorForm.test.tsx
 create mode 100644 src/features/mirrors/components/EditMirrorForm/EditMirrorForm.test.tsx
 create mode 100644 src/features/mirrors/components/MirrorActions/MirrorActions.test.tsx
 create mode 100644 src/features/mirrors/components/MirrorDetails/MirrorDetails.test.tsx
 create mode 100644 src/features/mirrors/components/MirrorPackagesCount/MirrorPackagesCount.test.tsx
 create mode 100644 src/features/mirrors/components/MirrorPublicationsLink/MirrorPublicationsLink.test.tsx
 create mode 100644 src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.test.tsx
 create mode 100644 src/features/mirrors/components/MirrorsList/MirrorsList.test.tsx
 create mode 100644 src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.test.tsx
 create mode 100644 src/features/mirrors/components/SelectableMirrorContentsBlock/SelectableMirrorContentsBlock.test.tsx
 create mode 100644 src/features/mirrors/components/UpdateMirrorModal/UpdateMirrorModal.test.tsx

diff --git a/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.test.tsx b/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.test.tsx
new file mode 100644
index 000000000..358bcc029
--- /dev/null
+++ b/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.test.tsx
@@ -0,0 +1,113 @@
+import { renderWithProviders } from "@/tests/render";
+import AddMirrorForm from "./AddMirrorForm";
+import userEvent from "@testing-library/user-event";
+import { fireEvent, screen } from "@testing-library/react";
+import { Suspense } from "react";
+import LoadingState from "@/components/layout/LoadingState";
+import { expectLoadingState } from "@/tests/helpers";
+import { beforeEach, expect, vi } from "vitest";
+import { UBUNTU_SNAPSHOTS_HOST } from "../../constants";
+import type { CreateMirrorData } from "@canonical/landscape-openapi";
+
+const mockCreateMirror = vi.fn();
+
+vi.mock("../../api", async () => {
+  const actual = await vi.importActual("../../api");
+
+  return {
+    ...actual,
+    useCreateMirror: () => ({
+      mutateAsync: mockCreateMirror,
+    }),
+  };
+});
+
+describe("AddMirrorForm", () => {
+  const user = userEvent.setup();
+
+  beforeEach(async () => {
+    mockCreateMirror.mockClear();
+
+    renderWithProviders(
+      <Suspense fallback={<LoadingState />}>
+        <AddMirrorForm />
+      </Suspense>,
+    );
+
+    await expectLoadingState();
+    await user.type(screen.getByLabelText("Name"), "Name");
+  });
+
+  it("submits an ubuntu snapshot mirror", async () => {
+    const date = "2026-04-15";
+
+    await user.selectOptions(
+      screen.getByLabelText("Source type"),
+      "Ubuntu snapshots",
+    );
+
+    fireEvent.change(screen.getByLabelText("Snapshot date"), {
+      target: { value: date },
+    });
+
+    await user.click(screen.getByRole("button", { name: "Add mirror" }));
+
+    expect(mockCreateMirror).toHaveBeenCalledExactlyOnceWith(
+      expect.objectContaining({
+        archiveRoot: `https://${UBUNTU_SNAPSHOTS_HOST}/ubuntu/${date}`,
+      }),
+    );
+  });
+
+  it("submits an ubuntu pro mirror", async () => {
+    const token = "ABCDEFG";
+
+    await user.selectOptions(
+      screen.getByLabelText("Source type"),
+      "Ubuntu Pro",
+    );
+
+    await user.type(screen.getByLabelText("Token"), token);
+    await user.click(screen.getByRole("button", { name: "Add mirror" }));
+
+    expect(mockCreateMirror).toHaveBeenCalledExactlyOnceWith(
+      expect.objectContaining({}),
+    );
+  });
+
+  it("submits a third-party mirror", async () => {
+    const params = {
+      archiveRoot: "https://archive.ubuntu.com/",
+      distribution: "focal",
+      components: ["main", "universe"],
+      architectures: ["amd64", "arm64"],
+      gpgKey: { armor: "ABCDEFG" },
+    } satisfies Partial<CreateMirrorData["body"]>;
+
+    await user.selectOptions(
+      screen.getByLabelText("Source type"),
+      "Third party",
+    );
+
+    await user.type(screen.getByLabelText("Source URL"), params.archiveRoot);
+
+    await user.type(screen.getByLabelText("Distribution"), params.distribution);
+    await user.type(
+      screen.getByLabelText("Components"),
+      params.components.join(", "),
+    );
+    await user.type(
+      screen.getByLabelText("Architectures"),
+      params.architectures.join(", "),
+    );
+    await user.type(
+      screen.getByLabelText("Verification GPG key"),
+      params.gpgKey.armor,
+    );
+    await user.click(screen.getByRole("button", { name: "Add mirror" }));
+
+    expect(mockCreateMirror).toHaveBeenCalledExactlyOnceWith(
+      expect.objectContaining(params),
+    );
+  });
+});
diff --git a/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.tsx b/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.tsx
index 4e24b4b91..42b8a1d32 100644
--- a/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.tsx
+++ b/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.tsx
@@ -155,20 +155,9 @@ const AddMirrorForm: FC = () => {
                 ]}
                 {...formik.getFieldProps("sourceType")}
                 onChange={(event) => {
-                  if (
-                    !(
-                      event.target.value === "ubuntu-archive" ||
-                      event.target.value === "ubuntu-snapshots" ||
-                      event.target.value === "ubuntu-pro" ||
-                      event.target.value === "third-party"
-                    )
-                  ) {
-                    throw new Error();
-                  }
-
                   formik.setValues({
                     ...getInitialValues({
-                      sourceType: event.target.value,
+                      sourceType: event.target.value as FormProps["sourceType"],
                       ubuntuArchiveInfo,
                       ubuntuEsmInfo,
                     }),
@@ -237,10 +226,16 @@ const AddMirrorForm: FC = () => {
                   <Input
                     type="text"
                     label="Components"
-                    {...formik.getFieldProps("components")}
                     error={getFormikError(formik, "components")}
+                    {...formik.getFieldProps("components")}
                     value={formik.values.components.join(", ")}
                     onChange={async (event) => {
+                      await formik.setFieldValue(
+                        "components",
+                        event.target.value.split(", "),
+                      );
+                    }}
+                    onBlur={async (event) => {
                       await formik.setFieldValue(
                         "components",
                         event.target.value.split(", ").filter(Boolean),
@@ -251,10 +246,16 @@ const AddMirrorForm: FC = () => {
                   <Input
                     type="text"
                     label="Architectures"
-                    {...formik.getFieldProps("architectures")}
                     error={getFormikError(formik, "architectures")}
+                    {...formik.getFieldProps("architectures")}
                     value={formik.values.architectures.join(", ")}
                     onChange={async (event) => {
+                      await formik.setFieldValue(
+                        "architectures",
+                        event.target.value.split(", "),
+                      );
+                    }}
+                    onBlur={async (event) => {
                       await formik.setFieldValue(
                         "architectures",
                         event.target.value.split(", ").filter(Boolean),
diff --git a/src/features/mirrors/components/EditMirrorForm/EditMirrorForm.test.tsx b/src/features/mirrors/components/EditMirrorForm/EditMirrorForm.test.tsx
new file mode 100644
index 000000000..70509e98c
--- /dev/null
+++ b/src/features/mirrors/components/EditMirrorForm/EditMirrorForm.test.tsx
@@ -0,0 +1,103 @@
+import { renderWithProviders } from "@/tests/render";
+import userEvent from "@testing-library/user-event";
+import { screen } from "@testing-library/react";
+import { Suspense } from "react";
+import LoadingState from "@/components/layout/LoadingState";
+import { expectLoadingState } from "@/tests/helpers";
+import { beforeEach, expect, vi } from "vitest";
+import { EditMirrorForm } from "../..";
+import { mirrors } from "@/tests/mocks/mirrors";
+import {
+  UBUNTU_ARCHIVE_HOST,
+  UBUNTU_PRO_HOST,
+  UBUNTU_SNAPSHOTS_HOST,
+} from "../../constants";
+import usePageParams from "@/hooks/usePageParams";
+
+const TestComponent = () => {
+  const { lastSidePathSegment } = usePageParams();
+
+  if (lastSidePathSegment === "edit") {
+    return <EditMirrorForm />;
+  }
+};
+
+const mockUpdateMirror = vi.fn();
+
+vi.mock("../../api", async () => {
+  const actual = await vi.importActual("../../api");
+
+  return {
+    ...actual,
+    useUpdateMirror: () => ({
+      mutateAsync: mockUpdateMirror,
+    }),
+  };
+});
+
+describe("EditMirrorForm", () => {
+  const user = userEvent.setup();
+
+  beforeEach(async () => {
+    mockUpdateMirror.mockReset();
+  });
+
+  it("edits an ubuntu archive mirror", async () => {
+    const mirror = mirrors.find(
+      ({ archiveRoot }) => new URL(archiveRoot).host === UBUNTU_ARCHIVE_HOST,
+    );
+
+    assert(mirror);
+
+    renderWithProviders(
+      <Suspense fallback={<LoadingState />}>
+        <TestComponent />
+      </Suspense>,
+      undefined,
+      `?sidePath=edit&name=${encodeURIComponent(mirror.name)}`,
+    );
+
+    await expectLoadingState();
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    expect(mockUpdateMirror).toHaveBeenCalledExactlyOnceWith(
+      expect.objectContaining({}),
+    );
+  });
+
+  it("edits a third party mirror", async () => {
+    const mirror = mirrors.find(
+      ({ archiveRoot }) =>
+        ![UBUNTU_ARCHIVE_HOST, UBUNTU_SNAPSHOTS_HOST, UBUNTU_PRO_HOST].includes(
+          new URL(archiveRoot).host,
+        ),
+    );
+
+    assert(mirror);
+
+    renderWithProviders(
+      <Suspense fallback={<LoadingState />}>
+        <TestComponent />
+      </Suspense>,
+      undefined,
+      `?sidePath=edit&name=${encodeURIComponent(mirror.name)}`,
+    );
+
+    await expectLoadingState();
+
+    const params = {
+      gpgKey: { armor: "ABCDEF" },
+    };
+
+    await user.type(
+      screen.getByLabelText("Verification GPG key"),
+      params.gpgKey.armor,
+    );
+
+    await user.click(screen.getByRole("button", { name: "Save changes" }));
+
+    expect(mockUpdateMirror).toHaveBeenCalledExactlyOnceWith(
+      expect.objectContaining({ params: expect.objectContaining(params) }),
+    );
+  });
+});
diff --git a/src/features/mirrors/components/MirrorActions/MirrorActions.test.tsx b/src/features/mirrors/components/MirrorActions/MirrorActions.test.tsx
new file mode 100644
index 000000000..0b2a759fe
--- /dev/null
+++ b/src/features/mirrors/components/MirrorActions/MirrorActions.test.tsx
@@ -0,0 +1,14 @@
+import { renderWithProviders } from "@/tests/render";
+import { describe } from "vitest";
+import MirrorActions from "./MirrorActions";
+
+describe("MirrorActions", () => {
+  it("renders", () => {
+    renderWithProviders(
+      <MirrorActions
+        mirrorDisplayName="Mirror display name"
+        mirrorName="mirrors/name"
+      />,
+    );
+  });
+});
diff --git a/src/features/mirrors/components/MirrorActions/MirrorActions.tsx b/src/features/mirrors/components/MirrorActions/MirrorActions.tsx
index d748988e4..b4eabfc13 100644
--- a/src/features/mirrors/components/MirrorActions/MirrorActions.tsx
+++ b/src/features/mirrors/components/MirrorActions/MirrorActions.tsx
@@ -1,16 +1,19 @@
 import ListActions from "@/components/layout/ListActions";
 import usePageParams from "@/hooks/usePageParams";
 import type { FC } from "react";
-import type { Mirror } from "@canonical/landscape-openapi";
 import { useBoolean } from "usehooks-ts";
 import UpdateMirrorModal from "../UpdateMirrorModal";
 import RemoveMirrorModal from "../RemoveMirrorModal";
 
 interface MirrorActionsProps {
-  readonly mirror: Mirror;
+  readonly mirrorDisplayName: string;
+  readonly mirrorName: string;
 }
 
-const MirrorActions: FC<MirrorActionsProps> = ({ mirror }) => {
+const MirrorActions: FC<MirrorActionsProps> = ({
+  mirrorDisplayName,
+  mirrorName,
+}) => {
   const { createPageParamsSetter } = usePageParams();
 
   const {
@@ -24,12 +27,6 @@ const MirrorActions: FC<MirrorActionsProps> = ({ mirror }) => {
     setFalse: closeRemoveModal,
   } = useBoolean();
 
-  const { name: mirrorName } = mirror;
-
-  if (mirrorName === undefined) {
-    return null;
-  }
-
   return (
     <>
       <ListActions
@@ -39,7 +36,7 @@ const MirrorActions: FC<MirrorActionsProps> = ({ mirror }) => {
             label: "View details",
             onClick: createPageParamsSetter({
               sidePath: ["view"],
-              name: mirror.name,
+              name: mirrorName,
             }),
           },
           {
@@ -47,7 +44,7 @@ const MirrorActions: FC<MirrorActionsProps> = ({ mirror }) => {
             label: "Edit",
             onClick: createPageParamsSetter({
               sidePath: ["edit"],
-              name: mirror.name,
+              name: mirrorName,
             }),
           },
           {
@@ -60,7 +57,7 @@ const MirrorActions: FC<MirrorActionsProps> = ({ mirror }) => {
             label: "Publish",
             onClick: createPageParamsSetter({
               sidePath: ["publish"],
-              name: mirror.name,
+              name: mirrorName,
             }),
           },
         ]}
@@ -75,13 +72,13 @@ const MirrorActions: FC<MirrorActionsProps> = ({ mirror }) => {
       <UpdateMirrorModal
         isOpen={isUpdateModalOpen}
         close={closeUpdateModal}
-        mirrorDisplayName={mirror.displayName}
+        mirrorDisplayName={mirrorDisplayName}
         mirrorName={mirrorName}
       />
       <RemoveMirrorModal
         isOpen={isRemoveModalOpen}
         close={closeRemoveModal}
-        mirrorDisplayName={mirror.displayName}
+        mirrorDisplayName={mirrorDisplayName}
         mirrorName={mirrorName}
       />
     </>
diff --git a/src/features/mirrors/components/MirrorDetails/MirrorDetails.test.tsx b/src/features/mirrors/components/MirrorDetails/MirrorDetails.test.tsx
new file mode 100644
index 000000000..53cbccd27
--- /dev/null
+++ b/src/features/mirrors/components/MirrorDetails/MirrorDetails.test.tsx
@@ -0,0 +1,21 @@
+import { renderWithProviders } from "@/tests/render";
+import { describe } from "vitest";
+import MirrorDetails from "./MirrorDetails";
+import { mirrors } from "@/tests/mocks/mirrors";
+import { Suspense } from "react";
+import LoadingState from "@/components/layout/LoadingState";
+import { expectLoadingState } from "@/tests/helpers";
+
+describe("MirrorDetails", () => {
+  it("renders", async () => {
+    renderWithProviders(
+      <Suspense fallback={<LoadingState />}>
+        <MirrorDetails />
+      </Suspense>,
+      undefined,
+      `?name=${mirrors[0].name}`,
+    );
+
+    await expectLoadingState();
+  });
+});
diff --git a/src/features/mirrors/components/MirrorDetails/MirrorDetails.tsx b/src/features/mirrors/components/MirrorDetails/MirrorDetails.tsx
index 9d7098a85..da37b392c 100644
--- a/src/features/mirrors/components/MirrorDetails/MirrorDetails.tsx
+++ b/src/features/mirrors/components/MirrorDetails/MirrorDetails.tsx
@@ -13,6 +13,7 @@ import MirrorPublicationsList from "../MirrorPublicationsList";
 import UpdateMirrorModal from "../UpdateMirrorModal";
 import { useBoolean } from "usehooks-ts";
 import RemoveMirrorModal from "../RemoveMirrorModal";
+import { boolToLabel } from "@/utils/output";
 
 const MirrorDetails: FC = () => {
   const { name, createSidePathPusher } = usePageParams();
@@ -131,15 +132,15 @@ const MirrorDetails: FC = () => {
               />
               <InfoGrid.Item
                 label="Download .udeb"
-                value={mirror.downloadUdebs ? "Yes" : "No"}
+                value={boolToLabel(mirror.downloadUdebs)}
               />
               <InfoGrid.Item
                 label="Download sources"
-                value={mirror.downloadSources ? "Yes" : "No"}
+                value={boolToLabel(mirror.downloadSources)}
               />
               <InfoGrid.Item
                 label="Download installer files"
-                value={mirror.downloadInstaller ? "Yes" : "No"}
+                value={boolToLabel(mirror.downloadInstaller)}
               />
             </InfoGrid>
           </Blocks.Item>
diff --git a/src/features/mirrors/components/MirrorPackagesCount/MirrorPackagesCount.test.tsx b/src/features/mirrors/components/MirrorPackagesCount/MirrorPackagesCount.test.tsx
new file mode 100644
index 000000000..6e766dcac
--- /dev/null
+++ b/src/features/mirrors/components/MirrorPackagesCount/MirrorPackagesCount.test.tsx
@@ -0,0 +1,48 @@
+import { renderWithProviders } from "@/tests/render";
+import { describe } from "vitest";
+import MirrorPackagesCount from "./MirrorPackagesCount";
+import { mirrors } from "@/tests/mocks/mirrors";
+import { screen } from "@testing-library/react";
+
+const useListMirrorPackages = vi.hoisted(() => vi.fn());
+
+vi.mock("../../api", async () => {
+  const actual = await vi.importActual("../../api");
+
+  return {
+    ...actual,
+    useListMirrorPackages,
+  };
+});
+
+describe("MirrorPackagesCount", () => {
+  it("shows an exact count", () => {
+    useListMirrorPackages.mockReturnValueOnce({
+      data: {
+        data: {
+          mirrorPackages: ["package-1", "package-2", "package-3"],
+          nextPageToken: undefined,
+        },
+      },
+    });
+
+    renderWithProviders(<MirrorPackagesCount mirrorName={mirrors[0].name} />);
+
+    expect(screen.getByText("3 packages")).toBeInTheDocument();
+  });
+
+  it("shows a limited count", () => {
+    useListMirrorPackages.mockReturnValueOnce({
+      data: {
+        data: {
+          mirrorPackages: ["package-1", "package-2", "package-3"],
+          nextPageToken: "token",
+        },
+      },
+    });
+
+    renderWithProviders(<MirrorPackagesCount mirrorName={mirrors[0].name} />);
+
+    expect(screen.getByText("3+ packages")).toBeInTheDocument();
+  });
+});
diff --git a/src/features/mirrors/components/MirrorPackagesCount/MirrorPackagesCount.tsx b/src/features/mirrors/components/MirrorPackagesCount/MirrorPackagesCount.tsx
index 8cd5e271f..53fc2c694 100644
--- a/src/features/mirrors/components/MirrorPackagesCount/MirrorPackagesCount.tsx
+++ b/src/features/mirrors/components/MirrorPackagesCount/MirrorPackagesCount.tsx
@@ -9,7 +9,7 @@ interface MirrorPackagesCount {
 const MirrorPackagesCount: FC<MirrorPackagesCount> = ({ mirrorName }) => {
   const { data } = useListMirrorPackages(mirrorName, { pageSize: 1000 });
 
-  return pluralizeNew(data.data.mirrorPackages?.length ?? 0, "package", {
+  return pluralizeNew(data.data.mirrorPackages?.length, "package", {
     showCount: data.data.nextPageToken === undefined ? "exact" : "limited",
   });
 };
diff --git a/src/features/mirrors/components/MirrorPublicationsLink/MirrorPublicationsLink.test.tsx b/src/features/mirrors/components/MirrorPublicationsLink/MirrorPublicationsLink.test.tsx
new file mode 100644
index 000000000..edb2a0738
--- /dev/null
+++ b/src/features/mirrors/components/MirrorPublicationsLink/MirrorPublicationsLink.test.tsx
@@ -0,0 +1,75 @@
+import { renderWithProviders } from "@/tests/render";
+import { describe, expect } from "vitest";
+import MirrorPublicationsLink from "./MirrorPublicationsLinks";
+import { mirrors } from "@/tests/mocks/mirrors";
+import { Suspense } from "react";
+import LoadingState from "@/components/layout/LoadingState";
+import { screen } from "@testing-library/react";
+
+const useListPublications = vi.hoisted(() => vi.fn());
+
+vi.mock("../../api", async () => {
+  const actual = await vi.importActual("../../api");
+
+  return {
+    ...actual,
+    useListPublications,
+  };
+});
+
+describe("MirrorPublicationsLink", () => {
+  it("renders with no publications", async () => {
+    useListPublications.mockReturnValueOnce({
+      data: {
+        data: {
+          publications: [],
+        },
+      },
+    });
+
+    renderWithProviders(
+      <Suspense fallback={<LoadingState />}>
+        <MirrorPublicationsLink mirrorName={mirrors[0].name} />
+      </Suspense>,
+    );
+
+    expect(screen.getByText("0 publications")).toBeInTheDocument();
+  });
+
+  it("renders a link with an exact count", async () => {
+    useListPublications.mockReturnValueOnce({
+      data: {
+        data: {
+          publications: ["publication-1", "publication-2", "publication-3"],
+        },
+      },
+    });
+
+    renderWithProviders(
+      <Suspense fallback={<LoadingState />}>
+        <MirrorPublicationsLink mirrorName={mirrors[0].name} />
+      </Suspense>,
+    );
+
+    expect(screen.getByText("3 publications")).toBeInTheDocument();
+  });
+
+  it("renders a link with a limited count", async () => {
+    useListPublications.mockReturnValueOnce({
+      data: {
+        data: {
+          publications: ["publication-1", "publication-2", "publication-3"],
+          nextPageToken: "token",
+        },
+      },
+    });
+
+    renderWithProviders(
+      <Suspense fallback={<LoadingState />}>
+        <MirrorPublicationsLink mirrorName={mirrors[0].name} />
+      </Suspense>,
+    );
+
+    expect(screen.getByText("3+ publications")).toBeInTheDocument();
+  });
+});
diff --git a/src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.test.tsx b/src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.test.tsx
new file mode 100644
index 000000000..0378715d2
--- /dev/null
+++ b/src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.test.tsx
@@ -0,0 +1,10 @@
+import { renderWithProviders } from "@/tests/render";
+import { describe } from "vitest";
+import MirrorPublicationsList from "./MirrorPublicationsList";
+import { publications } from "@/tests/mocks/publications";
+
+describe("MirrorPublicationsList", () => {
+  it("renders", () => {
+    renderWithProviders(<MirrorPublicationsList publications={publications} />);
+  });
+});
diff --git a/src/features/mirrors/components/MirrorsList/MirrorsList.test.tsx b/src/features/mirrors/components/MirrorsList/MirrorsList.test.tsx
new file mode 100644
index 000000000..dfcfe5482
--- /dev/null
+++ b/src/features/mirrors/components/MirrorsList/MirrorsList.test.tsx
@@ -0,0 +1,38 @@
+import { renderWithProviders } from "@/tests/render";
+import { describe } from "vitest";
+import MirrorsList from "./MirrorsList";
+import { mirrors } from "@/tests/mocks/mirrors";
+import moment from "moment";
+import { DISPLAY_DATE_TIME_FORMAT } from "@/constants";
+import { screen } from "@testing-library/react";
+import { NO_DATA_TEXT } from "@/components/layout/NoData";
+
+describe("MirrorsList", () => {
+  it("renders with data", () => {
+    const mirror = mirrors.find(
+      ({ name, lastDownloadDate }) => name && lastDownloadDate,
+    );
+
+    assert(mirror);
+
+    renderWithProviders(<MirrorsList mirrors={[mirror]} />);
+
+    expect(
+      screen.getByText(
+        moment(mirror.lastDownloadDate).format(DISPLAY_DATE_TIME_FORMAT),
+      ),
+    ).toBeInTheDocument();
+  });
+
+  it("renders without data", () => {
+    const mirror = {
+      ...mirrors[0],
+      name: undefined,
+      lastDownloadDate: undefined,
+    };
+
+    renderWithProviders(<MirrorsList mirrors={[mirror]} />);
+
+    expect(screen.getAllByText(NO_DATA_TEXT)).toHaveLength(4);
+  });
+});
diff --git a/src/features/mirrors/components/MirrorsList/MirrorsList.tsx b/src/features/mirrors/components/MirrorsList/MirrorsList.tsx
index 48b4ca49e..5f83dd6a5 100644
--- a/src/features/mirrors/components/MirrorsList/MirrorsList.tsx
+++ b/src/features/mirrors/components/MirrorsList/MirrorsList.tsx
@@ -76,11 +76,17 @@ const MirrorsList: FC<MirrorsListProps> = ({ mirrors }) => {
       {
         ...LIST_ACTIONS_COLUMN_PROPS,
         accessor: undefined,
-        Cell: ({ row: { original: mirror } }: CellProps<Mirror>) => (
-          <Suspense fallback={<Spinner />}>
-            <MirrorActions mirror={mirror} />
-          </Suspense>
-        ),
+        Cell: ({ row: { original: mirror } }: CellProps<Mirror>) =>
+          mirror.name !== undefined ? (
+            <Suspense fallback={<Spinner />}>
+              <MirrorActions
+                mirrorDisplayName={mirror.displayName}
+                mirrorName={mirror.name}
+              />
+            </Suspense>
+          ) : (
+            <NoData />
+          ),
       },
     ],
     [createPageParamsSetter],
diff --git a/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.test.tsx b/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.test.tsx
new file mode 100644
index 000000000..aad27ec71
--- /dev/null
+++ b/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.test.tsx
@@ -0,0 +1,87 @@
+import { renderWithProviders } from "@/tests/render";
+import { describe } from "vitest";
+import RemoveMirrorModal from "./RemoveMirrorModal";
+import type { ComponentProps } from "react";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { publications } from "@/tests/mocks/publications";
+import type { Publication } from "@canonical/landscape-openapi";
+
+const mockDeleteMirror = vi.fn();
+
+const useListPublications = vi.hoisted(() =>
+  vi.fn(() => ({
+    data: {
+      data: {
+        publications: publications as Publication[],
+      },
+    },
+  })),
+);
+
+vi.mock("../../api", async () => {
+  const actual = await vi.importActual("../../api");
+
+  return {
+    ...actual,
+    useDeleteMirror: () => ({
+      mutateAsync: mockDeleteMirror,
+    }),
+    useListPublications,
+  };
+});
+
+describe("RemoveMirrorModal", () => {
+  const props: ComponentProps<typeof RemoveMirrorModal> = {
+    close: () => undefined,
+    isOpen: true,
+    mirrorDisplayName: "Mirror display name",
+    mirrorName: "mirrors/name",
+  };
+
+  const user = userEvent.setup();
+
+  it("doesn't render while closed", async () => {
+    renderWithProviders(<RemoveMirrorModal {...props} isOpen={false} />);
+
+    expect(
+      screen.queryByText(`Remove ${props.mirrorDisplayName}`),
+    ).not.toBeInTheDocument();
+  });
+
+  it("renders a list of publications", async () => {
+    renderWithProviders(<RemoveMirrorModal {...props} />);
+
+    for (const { label } of publications) {
+      expect(screen.getByText(label)).toBeInTheDocument();
+    }
+  });
+
+  it("renders a message when there are no publications", async () => {
+    useListPublications.mockReturnValueOnce({
+      data: {
+        data: {
+          publications: [],
+        },
+      },
+    });
+
+    renderWithProviders(<RemoveMirrorModal {...props} />);
+
+    expect(
+      screen.queryByText(
+        "This mirror is associated with the following publications:",
+      ),
+    ).not.toBeInTheDocument();
+  });
+
+  it("removes a mirror", async () => {
+    renderWithProviders(<RemoveMirrorModal {...props} />);
+
+    await user.click(screen.getByRole("button", { name: /remove mirror/i }));
+
+    expect(mockDeleteMirror).toHaveBeenCalledWith(
+      expect.objectContaining({ mirrorName: props.mirrorName }),
+    );
+  });
+});
diff --git a/src/features/mirrors/components/SelectableMirrorContentsBlock/SelectableMirrorContentsBlock.test.tsx b/src/features/mirrors/components/SelectableMirrorContentsBlock/SelectableMirrorContentsBlock.test.tsx
new file mode 100644
index 000000000..03070ca95
--- /dev/null
+++ b/src/features/mirrors/components/SelectableMirrorContentsBlock/SelectableMirrorContentsBlock.test.tsx
@@ -0,0 +1,82 @@
+import { renderWithProviders } from "@/tests/render";
+import { describe } from "vitest";
+import SelectableMirrorContentsBlock from "./SelectableMirrorContentsBlock";
+import { useFormik } from "formik";
+import {
+  ubuntuArchiveInfo,
+  ubuntuESMInfo,
+} from "@/tests/mocks/ubuntuArchiveInfo";
+import type { FormProps } from "../AddMirrorForm/types";
+import type { ComponentProps } from "react";
+import { hasOneItem } from "@/utils/_helpers";
+import type { Distribution } from "../../types";
+
+const TestComponent = ({
+  initialValues,
+}: {
+  readonly initialValues: FormProps;
+}) => {
+  const formik = useFormik<FormProps>({
+    initialValues,
+    onSubmit: () => undefined,
+  });
+
+  return (
+    <SelectableMirrorContentsBlock
+      formik={
+        formik as ComponentProps<typeof SelectableMirrorContentsBlock>["formik"]
+      }
+      ubuntuArchiveInfo={ubuntuArchiveInfo}
+      ubuntuEsmInfo={ubuntuESMInfo}
+    />
+  );
+};
+
+describe("SelectableMirrorContentsBlock", () => {
+  it("renders select components", () => {
+    renderWithProviders(
+      <TestComponent
+        initialValues={{
+          architectures: [],
+          components: [],
+          distribution: ubuntuArchiveInfo.distributions[0].slug,
+          downloadInstallerFiles: false,
+          downloadSources: false,
+          downloadUdebPackages: false,
+          name: "",
+          sourceType: "ubuntu-archive",
+          sourceUrl: "",
+        }}
+      />,
+    );
+  });
+
+  it("renders readonly components when there is only one option", () => {
+    const proService = ubuntuESMInfo.find(
+      ({ distributions }) =>
+        hasOneItem(distributions as Distribution[]) &&
+        distributions[0].components.length === 1 &&
+        distributions[0].architectures.length === 1,
+    );
+
+    assert(proService && proService.distributions[0].architectures[0]);
+
+    renderWithProviders(
+      <TestComponent
+        initialValues={{
+          architectures: [proService.distributions[0].architectures[0].slug],
+          components: [proService.distributions[0].components[0].slug],
+          distribution: proService.distributions[0].slug,
+          downloadInstallerFiles: false,
+          downloadSources: false,
+          downloadUdebPackages: false,
+          name: "",
+          sourceType: "ubuntu-pro",
+          sourceUrl: "",
+          proService: proService.mirror_type,
+          token: "",
+        }}
+      />,
+    );
+  });
+});
diff --git a/src/features/mirrors/components/UpdateMirrorModal/UpdateMirrorModal.test.tsx b/src/features/mirrors/components/UpdateMirrorModal/UpdateMirrorModal.test.tsx
new file mode 100644
index 000000000..a80409545
--- /dev/null
+++ b/src/features/mirrors/components/UpdateMirrorModal/UpdateMirrorModal.test.tsx
@@ -0,0 +1,48 @@
+import { renderWithProviders } from "@/tests/render";
+import { describe } from "vitest";
+import type { ComponentProps } from "react";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import UpdateMirrorModal from "./UpdateMirrorModal";
+
+const mockSyncMirror = vi.fn();
+
+vi.mock("../../api", async () => {
+  const actual = await vi.importActual("../../api");
+
+  return {
+    ...actual,
+    useSyncMirror: () => ({
+      mutateAsync: mockSyncMirror,
+    }),
+  };
+});
+
+describe("UpdateMirrorModal", () => {
+  const props: ComponentProps<typeof UpdateMirrorModal> = {
+    close: () => undefined,
+    isOpen: true,
+    mirrorDisplayName: "Mirror display name",
+    mirrorName: "mirrors/name",
+  };
+
+  const user = userEvent.setup();
+
+  it("doesn't render while closed", async () => {
+    renderWithProviders(<UpdateMirrorModal {...props} isOpen={false} />);
+
+    expect(
+      screen.queryByText(`Update ${props.mirrorDisplayName}`),
+    ).not.toBeInTheDocument();
+  });
+
+  it("updates a mirror", async () => {
+    renderWithProviders(<UpdateMirrorModal {...props} />);
+
+    await user.click(screen.getByRole("button", { name: /update mirror/i }));
+
+    expect(mockSyncMirror).toHaveBeenCalledWith(
+      expect.objectContaining({ mirrorName: props.mirrorName }),
+    );
+  });
+});
diff --git a/src/features/package-profiles/components/PackageProfileDetailsSidePanel/PackageProfileDetailsSidePanel.test.tsx b/src/features/package-profiles/components/PackageProfileDetailsSidePanel/PackageProfileDetailsSidePanel.test.tsx
index fc7194cfe..f0d4fdfc0 100644
--- a/src/features/package-profiles/components/PackageProfileDetailsSidePanel/PackageProfileDetailsSidePanel.test.tsx
+++ b/src/features/package-profiles/components/PackageProfileDetailsSidePanel/PackageProfileDetailsSidePanel.test.tsx
@@ -13,7 +13,7 @@ const renderAndRemove = async () => {
   renderWithProviders(
     <PackageProfileDetailsSidePanel />,
     undefined,
-    `?profile=${packageProfiles[0].name}`,
+    `?name=${packageProfiles[0].name}`,
   );
 
   expect(
diff --git a/src/features/package-profiles/components/PackageProfileEditSidePanel/PackageProfileEditSidePanel.test.tsx b/src/features/package-profiles/components/PackageProfileEditSidePanel/PackageProfileEditSidePanel.test.tsx
index f25759e59..24d5f10f7 100644
--- a/src/features/package-profiles/components/PackageProfileEditSidePanel/PackageProfileEditSidePanel.test.tsx
+++ b/src/features/package-profiles/components/PackageProfileEditSidePanel/PackageProfileEditSidePanel.test.tsx
@@ -10,7 +10,7 @@ describe("PackageProfileEditSidePanel", () => {
     renderWithProviders(
       <PackageProfileEditSidePanel />,
       undefined,
-      `/?profile=${packageProfiles[0].name}`,
+      `/?name=${packageProfiles[0].name}`,
     );
 
     await expectLoadingState();
diff --git a/src/features/reboot-profiles/components/RebootProfileDetailsSidePanel/RebootProfileDetailsSidePanel.test.tsx b/src/features/reboot-profiles/components/RebootProfileDetailsSidePanel/RebootProfileDetailsSidePanel.test.tsx
index b8efa44aa..ef9b4a790 100644
--- a/src/features/reboot-profiles/components/RebootProfileDetailsSidePanel/RebootProfileDetailsSidePanel.test.tsx
+++ b/src/features/reboot-profiles/components/RebootProfileDetailsSidePanel/RebootProfileDetailsSidePanel.test.tsx
@@ -23,7 +23,7 @@ describe("RebootProfileDetailsSidePanel", () => {
     const { container } = renderWithProviders(
       <RebootProfileDetailsSidePanel />,
       undefined,
-      `/?profile=${profile.id}`,
+      `/?name=${profile.id}`,
     );
 
     await expectLoadingState();
diff --git a/src/features/reboot-profiles/components/RebootProfileDuplicateSidePanel/RebootProfileDuplicateSidePanel.test.tsx b/src/features/reboot-profiles/components/RebootProfileDuplicateSidePanel/RebootProfileDuplicateSidePanel.test.tsx
index 8a1add7d9..add069693 100644
--- a/src/features/reboot-profiles/components/RebootProfileDuplicateSidePanel/RebootProfileDuplicateSidePanel.test.tsx
+++ b/src/features/reboot-profiles/components/RebootProfileDuplicateSidePanel/RebootProfileDuplicateSidePanel.test.tsx
@@ -12,7 +12,7 @@ describe("PackageProfileAddSidePanel", () => {
     renderWithProviders(
       <RebootProfileDuplicateSidePanel />,
       undefined,
-      `/?profile=${rebootProfile.id}`,
+      `/?name=${rebootProfile.id}`,
     );
 
     await expectLoadingState();
diff --git a/src/features/reboot-profiles/components/RebootProfileEditSidePanel/RebootProfileEditSidePanel.test.tsx b/src/features/reboot-profiles/components/RebootProfileEditSidePanel/RebootProfileEditSidePanel.test.tsx
index 2d7ac9508..696066685 100644
--- a/src/features/reboot-profiles/components/RebootProfileEditSidePanel/RebootProfileEditSidePanel.test.tsx
+++ b/src/features/reboot-profiles/components/RebootProfileEditSidePanel/RebootProfileEditSidePanel.test.tsx
@@ -12,7 +12,7 @@ describe("PackageProfileAddSidePanel", () => {
     renderWithProviders(
       <RebootProfileEditSidePanel />,
       undefined,
-      `/?profile=${rebootProfile.id}`,
+      `/?name=${rebootProfile.id}`,
     );
 
     await expectLoadingState();
diff --git a/src/features/removal-profiles/components/RemovalProfileDetailsSidePanel/RemovalProfileDetailsSidePanel.test.tsx b/src/features/removal-profiles/components/RemovalProfileDetailsSidePanel/RemovalProfileDetailsSidePanel.test.tsx
index 5d261bf9d..13746111d 100644
--- a/src/features/removal-profiles/components/RemovalProfileDetailsSidePanel/RemovalProfileDetailsSidePanel.test.tsx
+++ b/src/features/removal-profiles/components/RemovalProfileDetailsSidePanel/RemovalProfileDetailsSidePanel.test.tsx
@@ -17,7 +17,7 @@ describe("RemovalProfileDetails", () => {
     const { container } = renderWithProviders(
       <RemovalProfileDetailsSidePanel />,
       undefined,
-      `/?profile=${profile.id}`,
+      `/?name=${profile.id}`,
     );
 
     await expectLoadingState();
@@ -44,7 +44,7 @@ describe("RemovalProfileDetails", () => {
     renderWithProviders(
       <RemovalProfileDetailsSidePanel />,
       undefined,
-      `/?profile=${profile.id}`,
+      `/?name=${profile.id}`,
     );
 
     await expectLoadingState();
diff --git a/src/features/removal-profiles/components/RemovalProfileEditSidePanel/RemovalProfileEditSidePanel.test.tsx b/src/features/removal-profiles/components/RemovalProfileEditSidePanel/RemovalProfileEditSidePanel.test.tsx
index 111ff3c6b..22fc02c42 100644
--- a/src/features/removal-profiles/components/RemovalProfileEditSidePanel/RemovalProfileEditSidePanel.test.tsx
+++ b/src/features/removal-profiles/components/RemovalProfileEditSidePanel/RemovalProfileEditSidePanel.test.tsx
@@ -12,7 +12,7 @@ describe("RemovalProfileEditSidePanel", () => {
     renderWithProviders(
       <RemovalProfileEditSidePanel />,
       undefined,
-      `/?profile=${removalProfile.id}`,
+      `/?name=${removalProfile.id}`,
     );
 
     await expectLoadingState();
diff --git a/src/features/security-profiles/components/SecurityProfileDetailsSidePanel/SecurityProfileDetailsSidePanel.test.tsx b/src/features/security-profiles/components/SecurityProfileDetailsSidePanel/SecurityProfileDetailsSidePanel.test.tsx
index 8741ad396..c0ee37817 100644
--- a/src/features/security-profiles/components/SecurityProfileDetailsSidePanel/SecurityProfileDetailsSidePanel.test.tsx
+++ b/src/features/security-profiles/components/SecurityProfileDetailsSidePanel/SecurityProfileDetailsSidePanel.test.tsx
@@ -9,7 +9,7 @@ describe("SecurityProfileDetailsSidePanel", () => {
     renderWithProviders(
       <SecurityProfileDetailsSidePanel />,
       undefined,
-      "/?profile=7",
+      "/?name=7",
     );
 
     expect((await screen.findAllByText(NO_DATA_TEXT))[0]).toBeInTheDocument();
@@ -20,7 +20,7 @@ describe("SecurityProfileDetailsSidePanel", () => {
     renderWithProviders(
       <SecurityProfileDetailsSidePanel />,
       undefined,
-      "/?profile=8",
+      "/?name=8",
     );
 
     expect(
diff --git a/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/SecurityProfileDownloadAuditSidePanel.test.tsx b/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/SecurityProfileDownloadAuditSidePanel.test.tsx
index b03e3ac67..527c56bfa 100644
--- a/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/SecurityProfileDownloadAuditSidePanel.test.tsx
+++ b/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/SecurityProfileDownloadAuditSidePanel.test.tsx
@@ -9,7 +9,7 @@ describe("SecurityProfileDownloadAuditForm", () => {
     renderWithProviders(
       <SecurityProfileDownloadAuditSidePanel />,
       undefined,
-      "/?profile=0",
+      "/?name=0",
     );
 
     await userEvent.click(
diff --git a/src/features/upgrade-profiles/components/UpgradeProfileDetailsSidePanel/UpgradeProfileDetailsSidePanel.test.tsx b/src/features/upgrade-profiles/components/UpgradeProfileDetailsSidePanel/UpgradeProfileDetailsSidePanel.test.tsx
index 5f8bbfdbe..85bab1231 100644
--- a/src/features/upgrade-profiles/components/UpgradeProfileDetailsSidePanel/UpgradeProfileDetailsSidePanel.test.tsx
+++ b/src/features/upgrade-profiles/components/UpgradeProfileDetailsSidePanel/UpgradeProfileDetailsSidePanel.test.tsx
@@ -44,7 +44,7 @@ describe("UpgradeProfileDetailsSidePanel", () => {
     const { container } = renderWithProviders(
       <UpgradeProfileDetailsSidePanel />,
       undefined,
-      `/?profile=${testProfile.id}`,
+      `/?name=${testProfile.id}`,
     );
 
     await expectLoadingState();
diff --git a/src/features/wsl-profiles/components/WslProfileDetailsSidePanel/WslProfileDetailsSidePanel.test.tsx b/src/features/wsl-profiles/components/WslProfileDetailsSidePanel/WslProfileDetailsSidePanel.test.tsx
index 038ac4bc4..6d0d8e74b 100644
--- a/src/features/wsl-profiles/components/WslProfileDetailsSidePanel/WslProfileDetailsSidePanel.test.tsx
+++ b/src/features/wsl-profiles/components/WslProfileDetailsSidePanel/WslProfileDetailsSidePanel.test.tsx
@@ -54,7 +54,7 @@ describe("WslProfileDetailsSidePanel", () => {
     const { container } = renderWithProviders(
       <WslProfileDetailsSidePanel />,
       undefined,
-      `/?profile=${testProfile.name}`,
+      `/?name=${testProfile.name}`,
     );
 
     await expectLoadingState();
diff --git a/src/features/wsl-profiles/components/WslProfileEditSidePanel/WslProfileEditSidePanel.test.tsx b/src/features/wsl-profiles/components/WslProfileEditSidePanel/WslProfileEditSidePanel.test.tsx
index 3d2286d7b..f61cbe9b6 100644
--- a/src/features/wsl-profiles/components/WslProfileEditSidePanel/WslProfileEditSidePanel.test.tsx
+++ b/src/features/wsl-profiles/components/WslProfileEditSidePanel/WslProfileEditSidePanel.test.tsx
@@ -11,7 +11,7 @@ describe("WslProfileEditSidePanel", () => {
     const { container } = renderWithProviders(
       <WslProfileEditSidePanel />,
       undefined,
-      `/?profile=${testProfile.name}`,
+      `/?name=${testProfile.name}`,
     );
 
     await expectLoadingState();
diff --git a/src/tests/mocks/ubuntuArchiveInfo.ts b/src/tests/mocks/ubuntuArchiveInfo.ts
index 847cd0892..e86fe6121 100644
--- a/src/tests/mocks/ubuntuArchiveInfo.ts
+++ b/src/tests/mocks/ubuntuArchiveInfo.ts
@@ -4236,4 +4236,28 @@ export const ubuntuESMInfo = [
       },
     ],
   },
+  {
+    label: "Pro service with one of each",
+    mirror_type: "one-of-each",
+    mirror_url: "https://esm.ubuntu.com/one-of-each/ubuntu/",
+    distributions: [
+      {
+        slug: "jammy",
+        label: "jammy",
+        preselected: true,
+        components: [
+          {
+            slug: "main",
+            preselected: true,
+          },
+        ],
+        architectures: [
+          {
+            slug: "amd64",
+            preselected: true,
+          },
+        ],
+      },
+    ],
+  },
 ] as const satisfies UbuntuArchiveInfo[];
diff --git a/src/tests/server/handlers/mirrors.ts b/src/tests/server/handlers/mirrors.ts
index 5bd0c898d..099e358e8 100644
--- a/src/tests/server/handlers/mirrors.ts
+++ b/src/tests/server/handlers/mirrors.ts
@@ -68,12 +68,19 @@ export default [
     return HttpResponse.json<CreateMirrorResponse>();
   }),
 
-  http.get(`${API_URL_DEB_ARCHIVE}mirrors/:mirrorName`, async () => {
+  http.get(`${API_URL_DEB_ARCHIVE}mirrors/:mirrorId`, async ({ params }) => {
     await delay();
-    return HttpResponse.json<GetMirrorResponse>(mirrors[0]);
+
+    const mirror = mirrors.find(({ mirrorId }) => mirrorId === params.mirrorId);
+
+    if (!mirror) {
+      return new HttpResponse(null, { status: 404 });
+    } else {
+      return HttpResponse.json<GetMirrorResponse>(mirror);
+    }
   }),
 
-  http.get(`${API_URL_DEB_ARCHIVE}mirrors/:mirrorName/packages`, async () => {
+  http.get(`${API_URL_DEB_ARCHIVE}mirrors/:mirrorId/packages`, async () => {
     await delay();
 
     return HttpResponse.json<ListMirrorPackagesResponse>({
@@ -81,17 +88,17 @@ export default [
     });
   }),
 
-  http.patch(`${API_URL_DEB_ARCHIVE}mirrors/:mirrorName`, async () => {
+  http.patch(`${API_URL_DEB_ARCHIVE}mirrors/:mirrorId`, async () => {
     await delay();
     return HttpResponse.json<UpdateMirrorResponse>();
   }),
 
-  http.delete(`${API_URL_DEB_ARCHIVE}mirrors/:mirrorName`, async () => {
+  http.delete(`${API_URL_DEB_ARCHIVE}mirrors/:mirrorId`, async () => {
     await delay();
     return HttpResponse.json<DeleteMirrorResponse>();
   }),
 
-  http.post(`${API_URL_DEB_ARCHIVE}mirrors/:mirrorName\\:sync`, async () => {
+  http.post(`${API_URL_DEB_ARCHIVE}mirrors/:mirrorId\\:sync`, async () => {
     await delay();
     return HttpResponse.json<SyncMirrorResponse>();
   }),
diff --git a/src/utils/_helpers.ts b/src/utils/_helpers.ts
index 2428f9ae5..c3e274e3f 100644
--- a/src/utils/_helpers.ts
+++ b/src/utils/_helpers.ts
@@ -96,7 +96,7 @@ export const pluralizeWithCount = (
 };
 
 export const pluralizeNew = (
-  count: number,
+  count = 0,
   singularForm: string,
   options: { pluralForm?: string; showCount?: "exact" | "limited" } = {},
 ) =>
diff --git a/src/utils/output.ts b/src/utils/output.ts
index c295239ff..70f1529cc 100644
--- a/src/utils/output.ts
+++ b/src/utils/output.ts
@@ -1 +1 @@
-export const boolToLabel = (value: boolean) => (value ? "Yes" : "No");
+export const boolToLabel = (value?: boolean) => (value ? "Yes" : "No");

From cca228621f9aa4c1c46b70745a97f5956e57b032 Mon Sep 17 00:00:00 2001
From: Ethan Shaw <ethan.shaw@canonical.com>
Date: Mon, 27 Apr 2026 10:11:48 -0700
Subject: [PATCH 30/42] `RemoveMirrorModal` improvements (#568)

- Publication links open in a new tab
- Uses text confirmation

<img width="757" height="562" alt="image"
src="https://github.com/user-attachments/assets/60b725fc-6acf-47e4-a660-c3cac5eb9d26"
/>

---------

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
---
 .../MirrorPublicationsList.tsx                    |  6 +++++-
 .../RemoveMirrorModal/RemoveMirrorModal.tsx       | 15 +++++++--------
 2 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.tsx b/src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.tsx
index 9f39a5395..94ca9fcb8 100644
--- a/src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.tsx
+++ b/src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.tsx
@@ -9,10 +9,12 @@ import { Link } from "react-router";
 
 interface MirrorPublicationsListProps {
   readonly publications: Publication[];
+  readonly openInNewTab?: boolean;
 }
 
 const MirrorPublicationsList: FC<MirrorPublicationsListProps> = ({
   publications,
+  openInNewTab = false,
 }) => {
   const { count, increment, decrement } = useCounter(1);
 
@@ -27,6 +29,8 @@ const MirrorPublicationsList: FC<MirrorPublicationsListProps> = ({
                 pathname: "/repositories/publications",
                 search: `?sidePath=view&name=${publication.publicationId}`,
               }}
+              target={openInNewTab ? "_blank" : undefined}
+              rel={openInNewTab ? "noopener noreferrer" : undefined}
             >
               {publication.label}
             </Link>
@@ -34,7 +38,7 @@ const MirrorPublicationsList: FC<MirrorPublicationsListProps> = ({
         },
       },
     ],
-    [],
+    [openInNewTab],
   );
 
   return (
diff --git a/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.tsx b/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.tsx
index a7c34dc4d..14336b630 100644
--- a/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.tsx
+++ b/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.tsx
@@ -1,10 +1,11 @@
 import useDebug from "@/hooks/useDebug";
-import { ConfirmationModal, Icon } from "@canonical/react-components";
+import { Icon } from "@canonical/react-components";
 import type { FC } from "react";
 import { useDeleteMirror, useListPublications } from "../../api";
 import useNotify from "@/hooks/useNotify";
 import MirrorPublicationsList from "../MirrorPublicationsList";
 import usePageParams from "@/hooks/usePageParams";
+import TextConfirmationModal from "@/components/form/TextConfirmationModal";
 
 interface RemoveMirrorModalProps {
   readonly close: () => void;
@@ -31,10 +32,6 @@ const RemoveMirrorModal: FC<RemoveMirrorModalProps> = ({
   const { mutateAsync: deleteMirror, isPending: isDeletingMirror } =
     useDeleteMirror();
 
-  if (!isOpen) {
-    return;
-  }
-
   const tryRemoveMirror = async () => {
     try {
       await deleteMirror({
@@ -54,7 +51,9 @@ const RemoveMirrorModal: FC<RemoveMirrorModalProps> = ({
   };
 
   return (
-    <ConfirmationModal
+    <TextConfirmationModal
+      isOpen={isOpen}
+      confirmationText={`remove ${mirrorDisplayName}`}
       confirmButtonLabel={
         <>
           <Icon name="delete" light />
@@ -71,7 +70,7 @@ const RemoveMirrorModal: FC<RemoveMirrorModalProps> = ({
       {publications.length ? (
         <>
           <p>This mirror is associated with the following publications:</p>
-          <MirrorPublicationsList publications={publications} />
+          <MirrorPublicationsList publications={publications} openInNewTab />
           <p>
             After removal you won’t be able to update any of these publications,
             but they will continue to be available.{" "}
@@ -85,7 +84,7 @@ const RemoveMirrorModal: FC<RemoveMirrorModalProps> = ({
           <strong>This action is irreversible.</strong>
         </p>
       )}
-    </ConfirmationModal>
+    </TextConfirmationModal>
   );
 };
 

From 4dab9da26fca440ac5471d80be8d006c306f0eac Mon Sep 17 00:00:00 2001
From: Marc Bucchieri <marc.bucchieri@canonical.com>
Date: Mon, 27 Apr 2026 15:05:35 -0700
Subject: [PATCH 31/42] feat: repository profiles page (#562)

## Summary

Add the Repository Profiles page to the deb-archive branch. [Resolves
this ticket](https://warthogs.atlassian.net/browse/LNDENG-4315).
Incorporates components from
[feat/standardize-profiles](https://github.com/canonical/landscape-ui/pull/508)
but will also cause conflicts with that branch since both modify
/features/repository-profiles.

## Release Impact

According to the [Landscape Server Release
Cycle](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `deb-archive`
- **Version Impact**:
  - [ ] Patch (Fix)
  - [X] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [X] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [X] **UI Verified**: I have verified the changes locally.
- [X] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.

---------

Co-authored-by: Copilot <copilot@github.com>
---
 .changeset/fair-otters-ask.md                 |   5 +
 .changeset/nine-drinks-switch.md              |   5 +
 .github/agents/architect.agent.md             |  31 ++
 .github/agents/debugger.agent.md              |  68 +++
 .github/agents/implementer.agent.md           |  35 ++
 .github/agents/prompt-engineer.agent.md       |  60 +++
 .github/agents/tester.agent.md                |  71 +++
 .github/copilot-instructions.md               | 484 ++++++++++++++++++
 .../testing/repository-profiles-followup.md   | 157 ++++++
 .github/prompts/explore-plan.prompt.md        |  55 ++
 .../repository-profile-form-refactor.md       | 398 ++++++++++++++
 src/components/layout/Blocks/Blocks.tsx       |  13 +-
 .../layout/Blocks/Item/Item.module.scss       |   4 +
 src/components/layout/Blocks/Item/Item.tsx    |  20 +-
 src/components/layout/InfoGrid/InfoGrid.tsx   |   4 +-
 src/components/layout/ListTitle/constants.tsx |   3 +-
 .../layout/LoadingState/LoadingState.tsx      |   2 +-
 src/context/profiles.tsx                      |  91 ++++
 src/context/sidePanel.tsx                     |  13 +-
 .../apt-sources/api/useGetAPTSources.ts       |  13 +-
 src/features/package-profiles/api/index.ts    |   1 +
 .../api/useGetPackageProfile.ts               |  13 +-
 .../api/useGetPagePackageProfile.ts           |   8 +-
 .../PackageProfileConstraintsAddSidePanel.tsx |   2 +-
 ...PackageProfileConstraintsEditSidePanel.tsx |   2 +-
 .../PackageProfileDetailsConstraints.test.tsx |   3 +-
 .../PackageProfileDetailsConstraints.tsx      |  22 +-
 .../PackageProfileDuplicateSidePanel.tsx      |   2 +-
 .../PackageProfileDuplicateForm.tsx           |   2 +-
 .../PackageProfileEditSidePanel.tsx           |   2 +-
 .../PackageProfileEditForm.tsx                |   2 +-
 src/features/package-profiles/index.ts        |   8 +-
 .../package-profiles/types/PackageProfile.ts  |  15 +-
 .../AddProfileButton.test.tsx                 |  98 ++++
 .../AddProfileButton/AddProfileButton.tsx     |  86 ++++
 .../components/AddProfileButton/index.ts      |   1 +
 .../ProfileAssociatedInstancesLink.test.tsx   | 163 ++++++
 .../ProfileAssociatedInstancesLink.tsx        | 100 ++++
 .../ProfileAssociatedInstancesLink/index.ts   |   1 +
 .../ProfilesContainer.test.tsx                | 114 +++++
 .../ProfilesContainer/ProfilesContainer.tsx   |  67 +++
 .../components/ProfilesContainer/index.ts     |   1 +
 .../ProfilesEmptyState.test.tsx               |  37 ++
 .../ProfilesEmptyState/ProfilesEmptyState.tsx |  33 ++
 .../components/ProfilesEmptyState/helpers.ts  |  35 ++
 .../components/ProfilesEmptyState/index.ts    |   1 +
 .../ProfilesHeader/ProfilesHeader.module.scss |  11 +
 .../ProfilesHeader/ProfilesHeader.test.tsx    |  55 ++
 .../ProfilesHeader/ProfilesHeader.tsx         |  70 +++
 .../components/ProfilesHeader/constants.ts    |   7 +
 .../components/ProfilesHeader/index.ts        |   1 +
 .../ProfilesList/ProfilesList.test.tsx        | 214 ++++++++
 .../components/ProfilesList/ProfilesList.tsx  |  96 ++++
 .../AssociatedInstancesCell.tsx               |  29 ++
 .../AssociatedInstancesCell/index.ts          |   1 +
 .../ProfilesListActions.test.tsx              | 162 ++++++
 .../ProfilesListActions.tsx                   |  48 ++
 .../components/ProfilesListActions/index.ts   |   1 +
 .../components/ProfilesList/helpers.tsx       | 302 +++++++++++
 .../profiles/components/ProfilesList/index.ts |   1 +
 .../RemoveProfileModal.test.tsx               | 120 +++++
 .../RemoveProfileModal/RemoveProfileModal.tsx |  76 +++
 .../components/RemoveProfileModal/helpers.ts  |  29 ++
 .../components/RemoveProfileModal/index.ts    |   1 +
 .../ViewProfileSidePanel.module.scss          |   5 +
 .../ViewProfileSidePanel.tsx                  |  80 +++
 .../ViewProfileActionsBlock.module.scss       |   5 +
 .../ViewProfileActionsBlock.tsx               |  87 ++++
 .../ViewProfileActionsBlock/index.ts          |   1 +
 .../ViewProfileAssociationBlock.test.tsx      | 110 ++++
 .../ViewProfileAssociationBlock.tsx           |  93 ++++
 .../ViewProfileAssociationBlock/index.ts      |   1 +
 .../ViewProfileDetailsBlock.test.tsx          |  46 ++
 .../ViewProfileDetailsBlock.tsx               |  84 +++
 .../ViewProfileDetailsBlock/index.ts          |   1 +
 .../ViewProfileGeneralBlock.test.tsx          |  94 ++++
 .../ViewProfileGeneralBlock.tsx               |  60 +++
 .../ViewProfileGeneralBlock/index.ts          |   1 +
 .../ViewProfileInfoTab.test.tsx               |  54 ++
 .../ViewProfileInfoTab/ViewProfileInfoTab.tsx |  32 ++
 .../components/ViewProfileInfoTab/index.ts    |   1 +
 .../ViewProfileScheduleBlock.test.tsx         | 145 ++++++
 .../ViewProfileScheduleBlock.tsx              |  94 ++++
 .../ViewProfileScheduleBlock/helpers.ts       | 133 +++++
 .../ViewProfileScheduleBlock/index.ts         |   1 +
 .../ViewProfileSidePanel/helpers.ts           |  36 ++
 .../components/ViewProfileSidePanel/index.ts  |   1 +
 src/features/profiles/helpers.ts              | 129 +++++
 src/features/profiles/hooks/index.ts          |   3 +
 .../profiles/hooks/useGetProfileActions.ts    | 178 +++++++
 .../hooks/useGetProfileAssociatedCount.ts     |  51 ++
 .../profiles/hooks/useOpenProfileSidePanel.ts |  22 +
 src/features/profiles/index.ts                |  14 +
 src/features/profiles/types/Profiles.ts       |  23 +
 src/features/profiles/types/index.ts          |   5 +
 .../{hooks => api}/index.ts                   |   2 +
 .../api/useGetProfileInstancesCount.ts        |  30 ++
 .../api/useGetRepositoryProfile.ts            |  22 +
 .../{hooks => api}/useRepositoryProfiles.ts   |  27 +-
 .../RepositoryProfileAddButton.test.tsx       |  29 ++
 .../RepositoryProfileAddButton.tsx            |   6 +-
 .../RepositoryProfileContainer.test.tsx       | 115 +++++
 .../RepositoryProfileContainer.tsx            |  15 +-
 .../RepositoryProfileDetails.test.tsx         | 111 ++++
 .../RepositoryProfileDetails.tsx              | 140 +++++
 .../RepositoryProfileDetails/index.ts         |   1 +
 .../RepositoryProfileEditForm.test.tsx        |  82 +++
 .../RepositoryProfileEditForm.tsx             |  29 ++
 .../RepositoryProfileEditForm/index.ts        |   1 +
 .../RepositoryProfileForm.module.scss         |   5 +
 .../RepositoryProfileForm.test.tsx            | 142 ++++-
 .../RepositoryProfileForm.tsx                 | 253 ++++++---
 .../RepositoryProfileForm/constants.ts        |   4 +-
 .../RepositoryProfileForm/helpers.ts          |   3 +-
 ...ositoryProfileFormAptSourcesPanel.test.tsx |   6 +-
 .../RepositoryProfileFormAptSourcesPanel.tsx  |  25 +-
 ...RepositoryProfileFormDetailsPanel.test.tsx |  13 +-
 .../RepositoryProfileFormDetailsPanel.tsx     |  30 +-
 ...itoryProfileFormSourcesSection.module.scss |  17 +
 ...positoryProfileFormSourcesSection.test.tsx |  96 ++++
 .../RepositoryProfileFormSourcesSection.tsx   | 123 +++++
 .../index.ts                                  |   1 +
 .../RepositoryProfileFormTabs.test.tsx        |  44 +-
 .../RepositoryProfileList.module.scss         |  12 +-
 .../RepositoryProfileList.test.tsx            |  62 ++-
 .../RepositoryProfileList.tsx                 | 109 ++--
 .../RepositoryProfileListActions.test.tsx     |  97 +++-
 .../RepositoryProfileListActions.tsx          |  21 +-
 .../RepositoryProfileSourceForm.test.tsx      | 117 +++++
 .../RepositoryProfileSourceForm.tsx           |  73 +++
 .../RepositoryProfileSourceForm/constants.ts  |   7 +
 .../RepositoryProfileSourceForm/helpers.ts    |  18 +
 .../RepositoryProfileSourceForm/index.ts      |   1 +
 ...sitoryProfileSourceFormOverlay.module.scss |  24 +
 ...epositoryProfileSourceFormOverlay.test.tsx |  70 +++
 .../RepositoryProfileSourceFormOverlay.tsx    |  36 ++
 .../index.ts                                  |   1 +
 src/features/repository-profiles/index.ts     |   4 +-
 .../types/RepositoryProfile.ts                |   4 +-
 .../types/RepositoryProfileFormValues.ts      |  11 +-
 .../RepositoryProfileSourceFormValues.d.ts    |   5 +
 .../repository-profiles/types/index.ts        |   1 +
 src/features/script-profiles/api/index.ts     |   1 +
 .../api/useGetPageScriptProfile.ts            |  11 +-
 .../api/useGetScriptProfileLimits.ts          |   4 +-
 .../ScriptProfileEditSidePanel.tsx            |   2 +-
 .../ScriptProfilesTab.test.tsx                |  59 +++
 .../ScriptProfilesTab/ScriptProfilesTab.tsx   | 110 +++-
 .../ViewScriptProfileDetailsBlock.test.tsx    |  33 ++
 .../ViewScriptProfileDetailsBlock.tsx         |  43 ++
 .../ViewScriptProfileDetailsBlock/index.ts    |   1 +
 src/features/script-profiles/index.ts         |   4 +-
 .../script-profiles/types/ScriptProfile.ts    |   8 +-
 src/features/security-profiles/api/index.ts   |   1 +
 .../api/useGetPageSecurityProfile.tsx         |  10 +-
 .../api/useIsSecurityProfilesLimitReached.ts  |   2 +-
 .../SecurityProfileAddSidePanel.tsx           |   7 +-
 .../SecurityProfileAuditPassRate.module.scss  |  68 +++
 .../SecurityProfileAuditPassRate.test.tsx     |  50 ++
 .../SecurityProfileAuditPassRate.tsx          | 127 +++++
 .../SecurityProfileAuditPassRate/index.ts     |   1 +
 .../SecurityProfileDownloadAuditSidePanel.tsx |   2 +-
 .../SecurityProfileDuplicateSidePanel.tsx     |   2 +-
 .../SecurityProfileEditSidePanel.tsx          |   2 +-
 ...rityProfileLastRunWithSchedule.module.scss |  20 +
 .../SecurityProfileLastRunWithSchedule.tsx    |  68 +++
 .../index.ts                                  |   1 +
 .../SecurityProfileRunFixSidePanel.tsx        |   2 +-
 .../SecurityProfilesContainer.test.tsx        |  22 +-
 .../SecurityProfilesList.test.tsx             |  32 --
 .../SecurityProfilesList.tsx                  |   6 +-
 .../SecurityProfilesNotifications.test.tsx    | 157 ++++++
 .../SecurityProfilesNotifications.tsx         | 188 +++++++
 .../SecurityProfilesNotifications/index.ts    |   1 +
 .../ViewSecurityProfileDetailsBlock.test.tsx  |  56 ++
 .../ViewSecurityProfileDetailsBlock.tsx       |  35 ++
 .../ViewSecurityProfileDetailsBlock/index.ts  |   1 +
 src/features/security-profiles/helpers.tsx    |  11 +-
 .../hooks/useSecurityProfileDownloadAudit.tsx |  34 ++
 src/features/security-profiles/index.ts       |  17 +-
 .../types/SecurityProfile.ts                  |  52 +-
 src/features/wsl-profiles/api/index.ts        |   3 +-
 .../wsl-profiles/api/useGetPageWslProfile.ts  |   5 +-
 .../wsl-profiles/api/useRemoveWslProfile.ts   |  30 ++
 .../ViewWslProfileDetailsBlock.test.tsx       |  49 ++
 .../ViewWslProfileDetailsBlock.tsx            |  42 ++
 .../ViewWslProfileDetailsBlock/index.ts       |   1 +
 .../WslProfileEditSidePanel.tsx               |   6 +-
 .../WslProfileEditForm/WslProfileEditForm.tsx |   2 +-
 .../components/WslProfileEditForm/helpers.ts  |   1 -
 ...ofileNonCompliantInstancesList.module.scss |  13 +
 .../WslProfileNonCompliantInstancesList.tsx   | 233 +++++++++
 .../WindowsInstanceActions.tsx                |  42 ++
 .../WindowsInstanceActions/index.ts           |   1 +
 .../helpers.ts                                |  32 ++
 .../index.ts                                  |   1 +
 .../WslProfilesList/WslProfilesList.test.tsx  |  59 ---
 src/features/wsl-profiles/index.tsx           |   8 +-
 src/features/wsl-profiles/types/WslProfile.ts |  17 +-
 src/hooks/useProfiles.ts                      |   6 +
 .../PackageProfilesContent.tsx                |   5 +-
 .../PackageProfilesPage.test.tsx              |  25 +-
 .../package-profiles/PackageProfilesPage.tsx  | 155 ++++++
 .../reboot-profiles/RebootProfilesPage.tsx    | 123 +++++
 .../removal-profiles/RemovalProfilesPage.tsx  | 104 ++++
 .../SecurityProfilesPage.test.tsx             | 117 +++++
 .../SecurityProfilesPage.tsx                  | 212 ++++++++
 .../upgrade-profiles/UpgradeProfilesPage.tsx  | 102 ++++
 .../wsl-profiles/WslProfilesPage.test.tsx     |  74 +++
 .../profiles/wsl-profiles/WslProfilesPage.tsx | 186 +++----
 .../RepositoryProfilesPage.test.tsx           |  64 +++
 .../RepositoryProfilesPage.tsx                |  36 +-
 src/routes/DashboardRoutes.tsx                |  17 +-
 .../dashboard/Navigation/constants.ts         |   5 +
 .../SecondaryNavigation.module.scss           |   6 +-
 .../SecondaryNavigation.tsx                   |   4 +-
 src/tests/mocks/apt-sources.ts                |  64 ++-
 src/tests/mocks/profiles.ts                   |  31 ++
 src/tests/mocks/repositoryProfiles.ts         |  41 +-
 src/tests/server/handlers/instance.ts         |  10 +
 .../server/handlers/repositoryProfiles.ts     |  75 ++-
 221 files changed, 9805 insertions(+), 663 deletions(-)
 create mode 100644 .changeset/fair-otters-ask.md
 create mode 100644 .changeset/nine-drinks-switch.md
 create mode 100644 .github/agents/architect.agent.md
 create mode 100644 .github/agents/debugger.agent.md
 create mode 100644 .github/agents/implementer.agent.md
 create mode 100644 .github/agents/prompt-engineer.agent.md
 create mode 100644 .github/agents/tester.agent.md
 create mode 100644 .github/copilot-instructions.md
 create mode 100644 .github/features/testing/repository-profiles-followup.md
 create mode 100644 .github/prompts/explore-plan.prompt.md
 create mode 100644 feature-plans/repository-profile-form-refactor.md
 create mode 100644 src/context/profiles.tsx
 create mode 100644 src/features/profiles/components/AddProfileButton/AddProfileButton.test.tsx
 create mode 100644 src/features/profiles/components/AddProfileButton/AddProfileButton.tsx
 create mode 100644 src/features/profiles/components/AddProfileButton/index.ts
 create mode 100644 src/features/profiles/components/ProfileAssociatedInstancesLink/ProfileAssociatedInstancesLink.test.tsx
 create mode 100644 src/features/profiles/components/ProfileAssociatedInstancesLink/ProfileAssociatedInstancesLink.tsx
 create mode 100644 src/features/profiles/components/ProfileAssociatedInstancesLink/index.ts
 create mode 100644 src/features/profiles/components/ProfilesContainer/ProfilesContainer.test.tsx
 create mode 100644 src/features/profiles/components/ProfilesContainer/ProfilesContainer.tsx
 create mode 100644 src/features/profiles/components/ProfilesContainer/index.ts
 create mode 100644 src/features/profiles/components/ProfilesEmptyState/ProfilesEmptyState.test.tsx
 create mode 100644 src/features/profiles/components/ProfilesEmptyState/ProfilesEmptyState.tsx
 create mode 100644 src/features/profiles/components/ProfilesEmptyState/helpers.ts
 create mode 100644 src/features/profiles/components/ProfilesEmptyState/index.ts
 create mode 100644 src/features/profiles/components/ProfilesHeader/ProfilesHeader.module.scss
 create mode 100644 src/features/profiles/components/ProfilesHeader/ProfilesHeader.test.tsx
 create mode 100644 src/features/profiles/components/ProfilesHeader/ProfilesHeader.tsx
 create mode 100644 src/features/profiles/components/ProfilesHeader/constants.ts
 create mode 100644 src/features/profiles/components/ProfilesHeader/index.ts
 create mode 100644 src/features/profiles/components/ProfilesList/ProfilesList.test.tsx
 create mode 100644 src/features/profiles/components/ProfilesList/ProfilesList.tsx
 create mode 100644 src/features/profiles/components/ProfilesList/components/AssociatedInstancesCell/AssociatedInstancesCell.tsx
 create mode 100644 src/features/profiles/components/ProfilesList/components/AssociatedInstancesCell/index.ts
 create mode 100644 src/features/profiles/components/ProfilesList/components/ProfilesListActions/ProfilesListActions.test.tsx
 create mode 100644 src/features/profiles/components/ProfilesList/components/ProfilesListActions/ProfilesListActions.tsx
 create mode 100644 src/features/profiles/components/ProfilesList/components/ProfilesListActions/index.ts
 create mode 100644 src/features/profiles/components/ProfilesList/helpers.tsx
 create mode 100644 src/features/profiles/components/ProfilesList/index.ts
 create mode 100644 src/features/profiles/components/RemoveProfileModal/RemoveProfileModal.test.tsx
 create mode 100644 src/features/profiles/components/RemoveProfileModal/RemoveProfileModal.tsx
 create mode 100644 src/features/profiles/components/RemoveProfileModal/helpers.ts
 create mode 100644 src/features/profiles/components/RemoveProfileModal/index.ts
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/ViewProfileSidePanel.module.scss
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/ViewProfileSidePanel.tsx
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileActionsBlock/ViewProfileActionsBlock.module.scss
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileActionsBlock/ViewProfileActionsBlock.tsx
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileActionsBlock/index.ts
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileAssociationBlock/ViewProfileAssociationBlock.test.tsx
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileAssociationBlock/ViewProfileAssociationBlock.tsx
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileAssociationBlock/index.ts
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileDetailsBlock/ViewProfileDetailsBlock.test.tsx
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileDetailsBlock/ViewProfileDetailsBlock.tsx
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileDetailsBlock/index.ts
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileGeneralBlock/ViewProfileGeneralBlock.test.tsx
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileGeneralBlock/ViewProfileGeneralBlock.tsx
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileGeneralBlock/index.ts
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileInfoTab/ViewProfileInfoTab.test.tsx
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileInfoTab/ViewProfileInfoTab.tsx
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileInfoTab/index.ts
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileScheduleBlock/ViewProfileScheduleBlock.test.tsx
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileScheduleBlock/ViewProfileScheduleBlock.tsx
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileScheduleBlock/helpers.ts
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileScheduleBlock/index.ts
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/helpers.ts
 create mode 100644 src/features/profiles/components/ViewProfileSidePanel/index.ts
 create mode 100644 src/features/profiles/helpers.ts
 create mode 100644 src/features/profiles/hooks/index.ts
 create mode 100644 src/features/profiles/hooks/useGetProfileActions.ts
 create mode 100644 src/features/profiles/hooks/useGetProfileAssociatedCount.ts
 create mode 100644 src/features/profiles/hooks/useOpenProfileSidePanel.ts
 create mode 100644 src/features/profiles/index.ts
 create mode 100644 src/features/profiles/types/Profiles.ts
 create mode 100644 src/features/profiles/types/index.ts
 rename src/features/repository-profiles/{hooks => api}/index.ts (51%)
 create mode 100644 src/features/repository-profiles/api/useGetProfileInstancesCount.ts
 create mode 100644 src/features/repository-profiles/api/useGetRepositoryProfile.ts
 rename src/features/repository-profiles/{hooks => api}/useRepositoryProfiles.ts (79%)
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileAddButton/RepositoryProfileAddButton.test.tsx
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileContainer/RepositoryProfileContainer.test.tsx
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileDetails/RepositoryProfileDetails.test.tsx
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileDetails/RepositoryProfileDetails.tsx
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileDetails/index.ts
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileEditForm/RepositoryProfileEditForm.test.tsx
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileEditForm/RepositoryProfileEditForm.tsx
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileEditForm/index.ts
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.module.scss
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.module.scss
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.test.tsx
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.tsx
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/index.ts
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.test.tsx
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.tsx
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileSourceForm/constants.ts
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileSourceForm/helpers.ts
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileSourceForm/index.ts
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.module.scss
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.test.tsx
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.tsx
 create mode 100644 src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/index.ts
 create mode 100644 src/features/repository-profiles/types/RepositoryProfileSourceFormValues.d.ts
 create mode 100644 src/features/script-profiles/components/ScriptProfilesTab/ScriptProfilesTab.test.tsx
 create mode 100644 src/features/script-profiles/components/ViewScriptProfileDetailsBlock/ViewScriptProfileDetailsBlock.test.tsx
 create mode 100644 src/features/script-profiles/components/ViewScriptProfileDetailsBlock/ViewScriptProfileDetailsBlock.tsx
 create mode 100644 src/features/script-profiles/components/ViewScriptProfileDetailsBlock/index.ts
 create mode 100644 src/features/security-profiles/components/SecurityProfileAuditPassRate/SecurityProfileAuditPassRate.module.scss
 create mode 100644 src/features/security-profiles/components/SecurityProfileAuditPassRate/SecurityProfileAuditPassRate.test.tsx
 create mode 100644 src/features/security-profiles/components/SecurityProfileAuditPassRate/SecurityProfileAuditPassRate.tsx
 create mode 100644 src/features/security-profiles/components/SecurityProfileAuditPassRate/index.ts
 create mode 100644 src/features/security-profiles/components/SecurityProfileLastRunWithSchedule/SecurityProfileLastRunWithSchedule.module.scss
 create mode 100644 src/features/security-profiles/components/SecurityProfileLastRunWithSchedule/SecurityProfileLastRunWithSchedule.tsx
 create mode 100644 src/features/security-profiles/components/SecurityProfileLastRunWithSchedule/index.ts
 delete mode 100644 src/features/security-profiles/components/SecurityProfilesList/SecurityProfilesList.test.tsx
 create mode 100644 src/features/security-profiles/components/SecurityProfilesNotifications/SecurityProfilesNotifications.test.tsx
 create mode 100644 src/features/security-profiles/components/SecurityProfilesNotifications/SecurityProfilesNotifications.tsx
 create mode 100644 src/features/security-profiles/components/SecurityProfilesNotifications/index.ts
 create mode 100644 src/features/security-profiles/components/ViewSecurityProfileDetailsBlock/ViewSecurityProfileDetailsBlock.test.tsx
 create mode 100644 src/features/security-profiles/components/ViewSecurityProfileDetailsBlock/ViewSecurityProfileDetailsBlock.tsx
 create mode 100644 src/features/security-profiles/components/ViewSecurityProfileDetailsBlock/index.ts
 create mode 100644 src/features/security-profiles/hooks/useSecurityProfileDownloadAudit.tsx
 create mode 100644 src/features/wsl-profiles/api/useRemoveWslProfile.ts
 create mode 100644 src/features/wsl-profiles/components/ViewWslProfileDetailsBlock/ViewWslProfileDetailsBlock.test.tsx
 create mode 100644 src/features/wsl-profiles/components/ViewWslProfileDetailsBlock/ViewWslProfileDetailsBlock.tsx
 create mode 100644 src/features/wsl-profiles/components/ViewWslProfileDetailsBlock/index.ts
 create mode 100644 src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/WslProfileNonCompliantInstancesList.module.scss
 create mode 100644 src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/WslProfileNonCompliantInstancesList.tsx
 create mode 100644 src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/components/WindowsInstanceActions/WindowsInstanceActions.tsx
 create mode 100644 src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/components/WindowsInstanceActions/index.ts
 create mode 100644 src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/helpers.ts
 create mode 100644 src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/index.ts
 delete mode 100644 src/features/wsl-profiles/components/WslProfilesList/WslProfilesList.test.tsx
 create mode 100644 src/hooks/useProfiles.ts
 rename src/pages/dashboard/profiles/package-profiles/{PackageProfilesPage => }/PackageProfilesPage.test.tsx (80%)
 create mode 100644 src/pages/dashboard/profiles/package-profiles/PackageProfilesPage.tsx
 create mode 100644 src/pages/dashboard/profiles/reboot-profiles/RebootProfilesPage.tsx
 create mode 100644 src/pages/dashboard/profiles/removal-profiles/RemovalProfilesPage.tsx
 create mode 100644 src/pages/dashboard/profiles/security-profiles/SecurityProfilesPage.test.tsx
 create mode 100644 src/pages/dashboard/profiles/security-profiles/SecurityProfilesPage.tsx
 create mode 100644 src/pages/dashboard/profiles/upgrade-profiles/UpgradeProfilesPage.tsx
 create mode 100644 src/pages/dashboard/profiles/wsl-profiles/WslProfilesPage.test.tsx
 create mode 100644 src/pages/dashboard/repositories/repository-profiles/RepositoryProfilesPage.test.tsx
 create mode 100644 src/tests/mocks/profiles.ts

diff --git a/.changeset/fair-otters-ask.md b/.changeset/fair-otters-ask.md
new file mode 100644
index 000000000..53aba9e05
--- /dev/null
+++ b/.changeset/fair-otters-ask.md
@@ -0,0 +1,5 @@
+---
+"landscape-ui": patch
+---
+
+Fixed failing test for SecondaryNavigation.tsx and updated styles to keep it fixed vertically.
diff --git a/.changeset/nine-drinks-switch.md b/.changeset/nine-drinks-switch.md
new file mode 100644
index 000000000..7f85511de
--- /dev/null
+++ b/.changeset/nine-drinks-switch.md
@@ -0,0 +1,5 @@
+---
+"landscape-ui": minor
+---
+
+Adds Repository Profiles debarchive page, incorporating some profile components from feat/standardize-profiles.
diff --git a/.github/agents/architect.agent.md b/.github/agents/architect.agent.md
new file mode 100644
index 000000000..02fe4c9d5
--- /dev/null
+++ b/.github/agents/architect.agent.md
@@ -0,0 +1,31 @@
+---
+name: architect
+description: Lead Systems Architect for Landscape UI. Plans features and API integrations.
+tools: [vscode/getProjectSetupInfo, vscode/installExtension, vscode/memory, vscode/newWorkspace, vscode/resolveMemoryFileUri, vscode/runCommand, vscode/vscodeAPI, vscode/extensions, vscode/askQuestions, execute/runNotebookCell, execute/testFailure, execute/getTerminalOutput, execute/killTerminal, execute/sendToTerminal, execute/createAndRunTask, execute/runInTerminal, execute/runTests, read/getNotebookSummary, read/problems, read/readFile, read/viewImage, read/terminalSelection, read/terminalLastCommand, agent/runSubagent, edit/createDirectory, edit/createFile, edit/createJupyterNotebook, edit/editFiles, edit/editNotebook, edit/rename, search/changes, search/codebase, search/fileSearch, search/listDirectory, search/textSearch, search/usages, web/fetch, web/githubRepo, browser/openBrowserPage, todo]
+---
+
+# Role
+Lead Architect for Landscape UI. Produces type-safe, project-consistent blueprints for new features.
+
+# Workflow
+1. **Discovery:** Search for existing components/hooks to reuse.
+2. **Pre-flight:** If request lacks detail, stop and ask:
+   - "What are the specific REST endpoints?"
+   - "Are feature flags (SaaS vs Self-hosted) involved?"
+3. **Drafting:** Generate plan in `.github/feature-plans/{{feature-name}}.md`.
+
+# Knowledge Base
+Read `AGENTS.md` first, then:
+- Structure/providers: `docs/ARCHITECTURE.md`
+- Fetch/query/mutation/endpoints: `docs/API.md`
+
+# Constraints
+- **Blueprint only:** No executable component logic or hook bodies. Interfaces + signatures only.
+- Follow Architectural Invariants in `copilot-instructions.md`, `docs/ARCHITECTURE.md`, `docs/API.md`.
+- All file paths relative to root (e.g., `src/features/...`).
+
+# Plan Structure (`.github/feature-plans/`)
+- **API Design:** React Query hook signatures + response types.
+- **Component Hierarchy:** Proposed file structure in `src/features/`.
+- **Forms & State:** Yup validation schemas + Formik initial values.
+- **Testing Strategy:** MSW handler requirements + Vitest focus areas.
\ No newline at end of file
diff --git a/.github/agents/debugger.agent.md b/.github/agents/debugger.agent.md
new file mode 100644
index 000000000..a9320c8fd
--- /dev/null
+++ b/.github/agents/debugger.agent.md
@@ -0,0 +1,68 @@
+---
+name: debugger
+description: "Forensic troubleshooting for API, State, and Test issues. Use when: debugging failed API calls, TanStack Query cache problems, MSW interference, React hook state bugs, Vitest test regressions, CORS mismatches, missing env vars, or useDebug hook violations in Landscape UI."
+tools: [execute/runNotebookCell, execute/testFailure, execute/getTerminalOutput, execute/killTerminal, execute/sendToTerminal, execute/createAndRunTask, execute/runInTerminal, execute/runTests, read/getNotebookSummary, read/problems, read/readFile, read/viewImage, read/terminalSelection, read/terminalLastCommand, agent/runSubagent, edit/createDirectory, edit/createFile, edit/createJupyterNotebook, edit/editFiles, edit/editNotebook, edit/rename, search/changes, search/codebase, search/fileSearch, search/listDirectory, search/textSearch, search/usages, web/fetch, web/githubRepo, todo]
+---
+
+Forensic debug engineer for Landscape UI. Isolate/resolve UI state issues, failed API calls, test regressions.
+
+## Discovery (Always First)
+
+1. Read `AGENTS.md`.
+2. Read smallest relevant doc:
+   - API failures → `docs/API.md`
+   - State/hook issues → `docs/FRONTEND.md`
+   - Test regressions → `docs/testing/index.md`
+   - Architecture → `docs/ARCHITECTURE.md`
+3. Read feature's `src/features/<name>/api/` hooks before forming hypothesis.
+
+## Constraints
+
+- No architectural changes or refactors — report only.
+- No `debug-report.md` unless explicitly requested.
+- No guessing root cause before gathering evidence.
+- Code changes only for confirmed, isolated bugs.
+
+## Diagnostic Workflows
+
+### API Failure
+
+1. Check missing/misconfigured env vars (`.env.local`, `VITE_API_URL`, `VITE_API_URL_OLD`).
+2. Inspect feature `api/` hook — endpoint path, HTTP method, query params.
+3. Check CORS — request origin vs backend allowed origins.
+4. Check MSW handler interference in `src/tests/mocks/`.
+5. Verify Axios interceptors in `FetchProvider` not stripping required headers.
+
+### TanStack Query State
+
+1. Inspect `queryKey` — confirm includes all params affecting response.
+2. Check `staleTime`, `gcTime`, background refetch vs freshness requirements.
+3. Trace raw `data` → transformed return (e.g., `{ results, count, isLoading }`). Report mismatch.
+4. Look for missing `invalidateQueries` after mutations in same feature.
+
+### React Hook/Context
+
+1. Confirm component inside all required providers (`FetchProvider`, `QueryClientProvider`, `NotifyProvider`).
+2. Flag direct auth logic outside `useAuth()`.
+3. For `useFetch` issues, trace through `FetchProvider` → Axios instance.
+
+### useDebug Protocol
+
+1. Search feature components/hooks for `try/catch`.
+2. Verify each `catch` calls `debug(error)` from `useDebug()`.
+3. **Flag violation:** any `catch` using `console.error`, `console.log`, or silent swallow.
+4. Report all violations with file path + line before suggesting any fix.
+
+### Test Regression
+
+1. Run `pnpm vitest --reporter=verbose <test-file>` — capture exact output.
+2. Identify failure: mock, assertion, or render error.
+3. Check MSW handler — mock response shape vs updated hook's expected type.
+4. Verify test uses `renderWithProviders` not bare `render`.
+
+## Communication
+
+- Concise, evidence-based report. Include file paths + findings.
+- Format: **Finding → Evidence → Suspected Cause → Recommended Fix**.
+- Only create `debug-report.md` when explicitly requested.
+- If root cause unconfirmed, state what evidence is needed and how to gather it.
diff --git a/.github/agents/implementer.agent.md b/.github/agents/implementer.agent.md
new file mode 100644
index 000000000..bd0eeb7e8
--- /dev/null
+++ b/.github/agents/implementer.agent.md
@@ -0,0 +1,35 @@
+---
+name: implementer
+description: Autonomous lead developer for Landscape UI.
+tools: [vscode/getProjectSetupInfo, vscode/installExtension, vscode/memory, vscode/newWorkspace, vscode/resolveMemoryFileUri, vscode/runCommand, vscode/vscodeAPI, vscode/extensions, vscode/askQuestions, read/getNotebookSummary, read/problems, read/readFile, read/viewImage, read/terminalSelection, read/terminalLastCommand, agent/runSubagent, edit/createDirectory, edit/createFile, edit/createJupyterNotebook, edit/editFiles, edit/editNotebook, edit/rename, search/changes, search/codebase, search/fileSearch, search/listDirectory, search/textSearch, search/usages, web/fetch, web/githubRepo, todo]
+---
+
+# Role
+Lead Implementer for Landscape UI. Takes architectural plans → production-ready code.
+
+# Knowledge Base
+Read `AGENTS.md` first, then:
+- Structure/providers: `docs/ARCHITECTURE.md`
+- Fetch/query/mutation/endpoints: `docs/API.md`
+- Component placement/naming: `docs/FRONTEND.md`
+
+# Context
+1. Start by reading plan in `.github/feature-plans/`.
+2. Follow rules in `copilot-instructions.md` + `docs/ARCHITECTURE.md`, `docs/API.md`, `docs/FRONTEND.md`.
+3. Session loop:
+   - **Step 1:** Search codebase for existing patterns.
+   - **Step 2:** Propose file creations/modifications.
+   - **Step 3:** Run `pnpm build` or `pnpm lint` to verify.
+
+# Rules
+- Work strictly within `src/features/{{feature}}`.
+- Use `@/` alias only.
+- Fix linting errors autonomously before declaring complete.
+- When finished, ping user to run `@tester` agent.
+
+# Workflow
+When asked to implement (e.g., "implement user-settings"):
+1. Find `.github/feature-plans/user-settings.md`.
+2. Map plan to codebase.
+3. Scaffold API hooks first, then components.
+4. Verify types via TS compiler in terminal.
\ No newline at end of file
diff --git a/.github/agents/prompt-engineer.agent.md b/.github/agents/prompt-engineer.agent.md
new file mode 100644
index 000000000..c70e7cb15
--- /dev/null
+++ b/.github/agents/prompt-engineer.agent.md
@@ -0,0 +1,60 @@
+---
+description: "A specialized chat mode for analyzing and improving prompts. Every user input is treated as a prompt to be improved. It first provides a detailed analysis of the original prompt within a <reasoning> tag, evaluating it against a systematic framework based on OpenAI's prompt engineering best practices. Following the analysis, it generates a new, improved prompt."
+name: 'Prompt Engineer'
+---
+
+Treat every user input as a prompt to be improved or created. Do NOT complete the input — use it as a starting point. Produce a detailed system prompt to guide a language model in completing the task effectively.
+
+First respond with `<reasoning>` analysis, then output the full improved prompt verbatim.
+
+<reasoning>
+- Simple Change: (yes/no) Is the change explicit and simple? (If so, skip rest.)
+- Reasoning: (yes/no) Does prompt use reasoning/chain of thought?
+    - Identify: (max 10 words) which section(s)?
+    - Conclusion: (yes/no) used to determine a conclusion?
+    - Ordering: (before/after) located before or after conclusion?
+- Structure: (yes/no) well defined structure?
+- Examples: (yes/no) few-shot examples present?
+    - Representative: (1-5) how representative?
+- Complexity: (1-5) prompt complexity?
+    - Task: (1-5) implied task complexity?
+- Specificity: (1-5) how detailed/specific?
+- Prioritization: (list) top 1-3 categories to address.
+- Conclusion: (max 30 words) concise imperative description of what to change and how.
+</reasoning>
+
+# Guidelines
+
+- Understand objective, goals, requirements, constraints, expected output.
+- Minimal changes for simple prompts. For complex: enhance clarity, add missing elements, preserve structure.
+- Reasoning before conclusions. If examples show reasoning after — REVERSE order. Never start examples with conclusions.
+- Include high-quality examples with placeholders [in brackets] when helpful.
+- Clear, specific language. No unnecessary instructions.
+- Markdown for readability. No ``` code blocks unless requested.
+- Preserve existing guidelines/examples entirely. Break down vague steps.
+- Include constants (guides, rubrics, examples) — not susceptible to prompt injection.
+- Specify output format explicitly (length, syntax, JSON, etc.). Bias toward JSON for structured data. Never wrap JSON in ```.
+
+Output only the completed system prompt. No commentary, no "---" wrapper.
+
+[Concise task instruction — first line, no section header]
+
+[Additional details as needed.]
+
+# Steps [optional]
+
+[Detailed breakdown of steps]
+
+# Output Format
+
+[Format, length, structure]
+
+# Examples [optional]
+
+[1-3 examples with placeholders. Mark start/end, input/output clearly.]
+
+# Notes [optional]
+
+[Edge cases, important considerations]
+
+[NOTE: First token must be `<reasoning>`]
\ No newline at end of file
diff --git a/.github/agents/tester.agent.md b/.github/agents/tester.agent.md
new file mode 100644
index 000000000..6a9005b2b
--- /dev/null
+++ b/.github/agents/tester.agent.md
@@ -0,0 +1,71 @@
+---
+name: tester
+description: QA Specialist for Landscape UI. Generates Vitest integration tests and MSW handlers.
+tools: [execute/runNotebookCell, execute/testFailure, execute/getTerminalOutput, execute/killTerminal, execute/sendToTerminal, execute/createAndRunTask, execute/runInTerminal, execute/runTests, read/getNotebookSummary, read/problems, read/readFile, read/viewImage, read/terminalSelection, read/terminalLastCommand, agent/runSubagent, edit/createDirectory, edit/createFile, edit/createJupyterNotebook, edit/editFiles, edit/editNotebook, edit/rename, search/changes, search/codebase, search/fileSearch, search/listDirectory, search/textSearch, search/usages, browser/openBrowserPage, todo]
+---
+
+# Knowledge Base
+Read `AGENTS.md` first, then:
+- Test strategy (Vitest, RTL, MSW, Playwright): `docs/testing/index.md`
+- Completion criteria/validation: `docs/verification/index.md`
+
+# Role
+Lead QA Engineer for Landscape UI. Ensure reliable test coverage via Vitest, RTL, and MSW.
+
+# Mandatory Patterns
+
+1. **Render:** Use `renderWithProviders` from `@/tests/render`. Never bare `render`.
+2. **Async:** Use `await expectLoadingState()` from `@/tests/helpers`.
+3. **Mocks:** Pull from `src/tests/mocks/`. Use `assert()` to narrow types. Create new files there if needed.
+4. **Interactions:** Use `userEvent.setup()` + async interactions (`await user.click()`).
+5. **Assertions:** Use `screen`. Prefer `getByRole`/`getByText`. Use custom matchers (e.g., `toHaveTexts`).
+6. **Hook Testing:** No dedicated hook test files. Test hooks through component tests:
+   - Queries → container/page component tests
+   - Mutations → form/action component tests via user interactions
+
+# Workflow
+
+1. Read component + associated React Query hooks.
+2. Search `src/tests/mocks/` for matching data structures.
+3. Plan tests: loading state, happy path, business logic states, user interactions.
+4. Create/update `*.test.tsx` in same directory as component.
+
+# Hook Testing Strategy
+
+**Queries:** Test through container/page components that render + display query data.
+
+**Mutations:** Test through form/action components:
+1. Render form component.
+2. Fill fields via `userEvent.type()`.
+3. Submit via `userEvent.click()`.
+4. Verify success notification + side effects (panel closes, etc.).
+5. Test error path: mock mutation to reject → verify `useDebug` called.
+
+# Guardrails
+- No snapshot tests.
+- No dedicated `useCustomHook.test.tsx` files.
+- Import order: 1. Helpers/Mocks, 2. Providers/Renderers, 3. Testing Library/Vitest, 4. Component.
+- After generating, suggest `pnpm vitest path/to/file.test.tsx`.
+
+# Template
+
+```tsx
+import { expectLoadingState } from "@/tests/helpers";
+import { mockData } from "@/tests/mocks/feature";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, it, expect } from "vitest";
+import MyComponent from "./MyComponent";
+
+describe("MyComponent", () => {
+  const user = userEvent.setup();
+
+  it("should handle the primary action", async () => {
+    renderWithProviders(<MyComponent />);
+    await expectLoadingState();
+    const button = screen.getByRole("button", { name: /action/i });
+    await user.click(button);
+    expect(screen.getByText(/success/i)).toBeInTheDocument();
+  });
+});
\ No newline at end of file
diff --git a/.github/copilot-instructions.md b/.github/copilot-instructions.md
new file mode 100644
index 000000000..521cd0041
--- /dev/null
+++ b/.github/copilot-instructions.md
@@ -0,0 +1,484 @@
+# Landscape UI – Copilot Instructions
+
+## Purpose
+
+This file defines project context, build conventions, and review constraints for **GitHub Copilot** and related AI coding assistants.  
+Copilot must align with these patterns when proposing or reviewing code.
+
+---
+
+## Repository Overview
+
+**Landscape UI** is Canonical’s next-generation web interface for managing Ubuntu systems.  
+Frontend only — communicates with Landscape API through authenticated REST endpoints.
+
+**Stack**
+
+- React 19 + TypeScript (strict mode)
+- Vite 7 (build/dev server)
+- PNPM for dependency management
+- React Query (@tanstack/react-query) for server state
+- React Router v7 for routing
+- Formik + Yup for forms
+- Axios (via FetchProvider)
+- Vanilla Framework + @canonical/react-components for styling
+- Vitest / Playwright / MSW / ESLint for quality control
+
+---
+
+## Repository Structure
+
+```
+src/
+ ├─ app/                 # Entry point, global layout, routing
+ ├─ features/<name>/     # Feature folders (API + components + tests)
+ │   ├─ api/             # React Query hooks
+ │   ├─ components/      # Feature components
+ │   ├─ types/           # Local types/interfaces
+ │   ├─ constants.ts
+ │   ├─ helpers.ts
+ │   └─ index.ts
+ ├─ context/             # Global React contexts
+ ├─ libs/                # Shared logic (routes, tables, utils)
+ ├─ components/          # Shared UI elements
+ ├─ hooks/               # Cross-feature custom hooks
+ ├─ tests/               # Test utilities and mocks
+ └─ styles/              # SCSS modules and Vanilla overrides
+```
+
+**Alias root:** `@/` → `src/`
+
+---
+
+## Build and Run
+
+```bash
+pnpm install --frozen-lockfile
+cp .env.local.example .env.local
+pnpm dev       # Vite dev server (5173)
+pnpm build     # Lint + typecheck + Vite build
+pnpm vitest    # Unit/integration tests
+pnpm test      # Playwright E2E
+```
+
+---
+
+## Architectural Invariants
+
+Copilot must **not** propose changes that violate these rules.
+
+| Area              | Rule                                                                     |
+| ----------------- | ------------------------------------------------------------------------ |
+| **Imports**       | Use `@/` alias only. No deep imports into `features/*/*`.                |
+| **API calls**     | Must go through React Query hooks in each feature’s `api/`.              |
+| **State**         | Local state: React hooks. Server state: React Query. No Redux/MobX.      |
+| **Forms**         | Always use Formik + Yup.                                                 |
+| **Styling**       | Vanilla Framework classes for layout; component styles use SCSS modules. |
+| **Testing**       | Use Vitest + React Testing Library. Mock network via MSW.                |
+| **Auth**          | Only `useAuth()` / `FetchProvider` manage authentication.                |
+| **Routing**       | Routes defined in `src/libs/routes`. Type-safe generation only.          |
+| **Feature Flags** | Access via `useAuth().isFeatureEnabled(key)`.                            |
+| **Build Output**  | Generated `dist/` is gitignored. Never edit manually.                    |
+
+---
+
+## Copilot Behavior Rules
+
+### 1. Code Generation
+
+Copilot should:
+
+- Use **existing hooks/components** before suggesting new ones.
+- Prefer **composition** over duplication.
+- Propose typed React Query hooks that adapt the raw API response into a simple, usable object (e.g., return `{ scripts, count, isLoading }` instead of the raw data object), matching the example pattern.
+- Generate **async/await** API calls wrapped in `try/catch`.
+- Always infer `type` imports (`import type`) for TS interfaces.
+- Respect ESLint and Prettier configs from root.
+
+### 2. Review Feedback Expectations
+
+When analyzing PRs, Copilot should:
+
+- Check for architectural invariant violations above.
+- Warn if new code bypasses providers (`useAuth`, `FetchProvider`, `NotifyProvider`).
+- Verify consistent naming (`PascalCase` for components, `camelCase` for helpers).
+- Flag untested UI or logic.
+- Ensure proper semantic HTML (`<button>`, `<label>`, `<main>`, etc.).
+- Point out missing `aria-` or keyboard accessibility attributes.
+- Validate keyboard navigation support.
+- Check that color contrast follows Vanilla Framework tokens.
+- Reject inline styling or direct DOM manipulation.
+- Require cleanup of temporary debugging (console, TODOs, etc.).
+- Ensure imports are grouped logically.
+
+### 3. Commit and PR Guidance
+
+Copilot should encourage:
+
+- Focused commits with clear, imperative messages.
+- Matching unit tests per feature change.
+- Updates to this file when workflow conventions change.
+- Descriptive PR titles and summaries.
+
+---
+
+## Common Patterns
+
+### Example: Data Fetching Pattern
+
+```tsx
+// src/features/scripts/api/useGetScripts.ts
+import type { Script } from "@/features/scripts";
+import useFetch from "@/hooks/useFetch";
+import usePageParams from "@/hooks/usePageParams";
+import type { ApiError } from "@/types/api/ApiError";
+import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
+import type { PaginatedGetHookParams } from "@/types/api/PaginatedGetHookParams";
+import type { UseQueryOptions } from "@tanstack/react-query";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+
+const DEFAULT_CONFIG: PaginatedGetHookParams = {
+  listenToUrlParams: true,
+};
+
+interface GetScriptsParams {
+  limit?: number;
+  offset?: number;
+  parent_access_group?: string;
+  search?: string;
+  script_type: string;
+}
+
+const getStatus = (status: string) => {
+  if (status === "all") {
+    return "v2";
+  }
+
+  if (status) {
+    return status;
+  }
+
+  return "active";
+};
+
+export const useGetScripts = (
+  config?: PaginatedGetHookParams,
+  params?: GetScriptsParams,
+  options: Omit<
+    UseQueryOptions<
+      AxiosResponse<ApiPaginatedResponse<Script>>,
+      AxiosError<ApiError>
+    >,
+    "queryKey" | "queryFn"
+  > = {},
+) => {
+  const authFetch = useFetch();
+  const { currentPage, pageSize, status, search } = usePageParams();
+
+  config = {
+    ...DEFAULT_CONFIG,
+    ...config,
+  };
+
+  const paramsWithPagination = {
+    ...(config.listenToUrlParams
+      ? {
+          limit: pageSize,
+          offset: (currentPage - 1) * pageSize,
+          search: search ?? undefined,
+          script_type: getStatus(status),
+        }
+      : params),
+  };
+
+  const { data, isLoading } = useQuery<
+    AxiosResponse<ApiPaginatedResponse<Script>>,
+    AxiosError<ApiError>
+  >({
+    queryKey: ["scripts", paramsWithPagination, config],
+    queryFn: async () =>
+      authFetch.get("scripts", { params: paramsWithPagination }),
+    ...options,
+  });
+
+  return {
+    scripts: data?.data.results ?? [],
+    scriptsCount: data?.data.count ?? 0,
+    isScriptsLoading: isLoading,
+  };
+};
+```
+
+### Example: Form Handling Pattern (Formik + Canonical Components)
+
+```tsx
+import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
+import useDebug from "@/hooks/useDebug";
+import useRoles from "@/hooks/useRoles";
+import useSidePanel from "@/hooks/useSidePanel";
+import { Form, Input, Select } from "@canonical/react-components";
+import { useFormik } from "formik";
+import type { FC } from "react";
+import { INITIAL_VALUES, VALIDATION_SCHEMA } from "./constants";
+import type { FormProps } from "./types";
+import { getFormikError } from "@/utils/formikErrors";
+
+const NewAccessGroupForm: FC = () => {
+  const { createAccessGroupQuery, getAccessGroupQuery } = useRoles();
+  const { mutateAsync } = createAccessGroupQuery;
+  const { closeSidePanel } = useSidePanel();
+  const { data: accessGroupsResponse, isLoading: isGettingAccessGroups } =
+    getAccessGroupQuery();
+
+  const accessGroupsOptionsResults = (accessGroupsResponse?.data ?? []).map(
+    (accessGroup) => ({
+      label: accessGroup.title,
+      value: accessGroup.name,
+    }),
+  );
+
+  const debug = useDebug();
+  const formik = useFormik<FormProps>({
+    initialValues: INITIAL_VALUES,
+    validationSchema: VALIDATION_SCHEMA,
+    onSubmit: async (values) => {
+      try {
+        await mutateAsync(values);
+        closeSidePanel();
+      } catch (error) {
+        debug(error);
+      }
+    },
+  });
+
+  return (
+    <Form noValidate onSubmit={formik.handleSubmit}>
+      <Input
+        type="text"
+        label="Title"
+        required
+        error={getFormikError(formik, "title")}
+        {...formik.getFieldProps("title")}
+      />
+      <Select
+        required
+        label="Parent"
+        disabled={isGettingAccessGroups}
+        options={accessGroupsOptionsResults}
+        error={getFormikError(formik, "parent")}
+        {...formik.getFieldProps("parent")}
+      />
+      <SidePanelFormButtons
+        submitButtonDisabled={formik.isSubmitting}
+        submitButtonText="Add access group"
+      />
+    </Form>
+  );
+};
+
+export default NewAccessGroupForm;
+```
+
+### Example: Error Handling Pattern (useDebug)
+
+- All try/catch blocks should use the useDebug hook to handle errors. This hook centralizes error parsing, developer-only console logging, and user-facing notifications.
+
+```ts
+// src/hooks/useDebug.ts (Simplified for instruction)
+import { IS_DEV_ENV } from "@/constants";
+import type { ApiError } from "@/types/api/ApiError";
+import { isAxiosError } from "axios";
+import useNotify from "./useNotify";
+
+export default function useDebug() {
+  const { notify } = useNotify();
+
+  return (error: unknown) => {
+    let errorMessage = "Unknown error";
+
+    if (isAxiosError<ApiError>(error) && error.response) {
+      errorMessage = error.response.data.message;
+    } else if (error instanceof Error) {
+      errorMessage = error.message;
+    } else if (typeof error === "string") {
+      errorMessage = error;
+    }
+
+    // Always show a notification to the user
+    notify.error({ message: errorMessage, error });
+
+    // Only log the full error in development
+    if (IS_DEV_ENV) {
+      console.error("An error occurred:", error);
+    }
+  };
+}
+```
+
+Usage in Forms:
+
+```tsx
+// In a Formik onSubmit:
+  onSubmit: async (values) => {
+    try {
+      await mutateAsync(values);
+      closeSidePanel();
+    } catch (error) {
+      // Correct: debug() handles everything.
+      debug(error);
+    }
+  },
+```
+
+### Conditional Routing
+
+```tsx
+<Route
+  path={ROUTES.instances()}
+  element={
+    <AuthRoute>
+      <InstancesPage />
+    </AuthRoute>
+  }
+/>
+```
+
+---
+
+## Testing Standards
+
+- **Unit/integration:** Vitest (`*.test.tsx`) alongside source files
+- **Mocks:** MSW handlers in `src/tests/mocks/`
+- **E2E:** Playwright (`pnpm test`, `pnpm test:ui`)
+- **Coverage threshold:** 85% line coverage minimum
+- **Snapshot tests:** Avoid unless required for layout regressions
+
+### Hook Testing Pattern
+
+**Do not create dedicated test files for custom hooks** (e.g., `useCustomHook.test.tsx`). This violates React's rule: _"Hooks can only be called inside of the body of a function component."_
+
+**Instead, test hooks implicitly through component integration tests:**
+
+- **Queries (fetch hooks):** Test in container/page component tests that render the hook's consumer components
+- **Mutations (create/edit/delete hooks):** Test through form/action component tests by:
+  - Rendering the component that uses the mutation
+  - Simulating user interactions (form submission, button clicks)
+  - Verifying success/error states and side effects
+
+**Example:** Instead of `usePublicationTargets.test.tsx`, test the hook's methods through:
+- `NewPublicationTargetForm.test.tsx` → exercises `createPublicationTargetQuery`
+- `EditTargetForm.test.tsx` → exercises `editPublicationTargetQuery`
+- `RemoveTargetForm.test.tsx` → exercises `removePublicationTargetQuery` (including error paths)
+
+This pattern ensures hooks are tested in realistic component contexts with all required providers (QueryClientProvider, FetchProvider, etc.) already configured via `renderWithProviders`.
+
+---
+
+## CI/CD Workflows (Authoritative)
+
+The repo uses multiple workflows. Copilot must follow these triggers, job orders, and tool versions.
+
+### Lint & Format (`.github/workflows/lint.yml`)
+
+**Trigger:** PR → `dev`  
+**Jobs:**
+
+- **ESLint:** Diff-only TS/TSX (added/modified).
+- **Prettier:** Diff-only JS/TS/TSX/JSON/MD/HTML.
+- **Stylelint:** Diff-only SCSS.  
+  **Common:**
+- Node `24`, pnpm `10`, `pnpm install --frozen-lockfile`.
+- Skip job if no matching changed files.
+
+### Tests + TICS on PRs (`.github/workflows/run-tests-and-tics.yml`)
+
+**Trigger:** PR → `dev`  
+**Jobs:**
+
+- **e2e-tests** (self-hosted runner, Playwright container): matrix for `saas` + `self-hosted`; each builds → installs browsers → runs matching Playwright project (untagged "common" tests run in both) → uploads report.
+- **unit-tests** (self-hosted): `vitest run --coverage` → upload coverage artifact to `reports/`.
+- **tics-report** (Ubuntu hosted): downloads `vitest-report` → runs TICS action with `installTics: true`.  
+  **Env (examples):** `VITE_API_URL`, `VITE_API_URL_OLD`, `VITE_ROOT_PATH=/`, `VITE_SELF_HOSTED_ENV=true/false`, `VITE_MSW_ENABLED=true/false`.  
+  **Constraints:** keep memory flag `NODE_OPTIONS='--max_old_space_size=4096'`.
+
+### Tests on Push (`.github/workflows/run-tests.yml`)
+
+**Trigger:** push → `dev`  
+**Jobs:**
+
+- **eslint-check:** `pnpm run lint`.
+- **e2e-tests:** needs eslint; same matrix pattern as PR e2e.
+- **unit-tests:** needs eslint; same pattern as PR unit tests; uploads `coverage-report`.
+
+### PPA Build Commit (`.github/workflows/ppa-build.yml`)
+
+**Trigger:** push → `dev` **or** successful `Release` workflow (`workflow_run`)  
+**Jobs:**
+
+- **build:** checks out `dev` (or `main` when from `workflow_run`), builds with env:
+  - `VITE_API_URL=/api/v2/`, `VITE_API_URL_OLD=/api/`, `VITE_ROOT_PATH=/new_dashboard/`
+  - archives `dist` as artifact.
+- **commit:** checks out destination branch (`ppa-build-dev` or `ppa-build`) → replaces tree with built `dist/` → auto-commits.  
+  **Rule:** Do not change branch selection logic or artifact dance.
+
+### Release (`.github/workflows/release.yml`)
+
+**Trigger:** push → `main`  
+**Job:** **semantic-release** with `GITHUB_TOKEN` and full history (`fetch-depth: 0`).  
+**Rule:** Only `main` publishes tags and releases. Do not introduce prerelease steps elsewhere.
+
+### Security Scan & SBOM (`.github/workflows/security.yml`)
+
+**Triggers:** manual, weekly cron, PRs touching `Dockerfile` or this workflow  
+**Jobs:**
+
+- **build-image:** builds and pushes OCI image to GHCR, saves as `image.tar` artifact.
+- **scan-and-report** (self-hosted): runs Canonical secscan client on `image.tar`.
+  - Exit code handling: `0` = clean; `100–199` = CVEs found → fail; other non-zero = scan failure → fail.
+  - On failure: open GitHub issue with scan output.
+- **generate-and-submit-sbom:** Trivy SBOM (`spdx-json`) and submit to GitHub Dependency Graph; upload artifact.  
+  **Rule:** Preserve exit-code semantics and issue creation logic.
+
+### Full TICS (Manual) (`.github/workflows/tics-full.yml`)
+
+**Trigger:** workflow_dispatch  
+**Jobs:**
+
+- **unit-tests:** same as PR unit tests; uploads `vitest-report`.
+- **tics-report:** self-hosted TIOBE runner with `mode: qserver`.
+
+---
+
+### CI Tooling Contracts
+
+- **Node:** `24`
+- **pnpm:** `10`
+- **Install:** `pnpm install --frozen-lockfile` only
+- **Build:** `pnpm run build` before Playwright runs
+- **Playwright:** install browsers with `pnpm exec playwright install --with-deps` inside the container job
+- **Caching:** use `actions/setup-node@v4` cache `"pnpm"`
+- **Artifacts:** preserve report paths as defined (`playwright-report`, `reports/`, `dist`)
+
+### Copilot MUST NOT
+
+- Suggest `npm`/`yarn` commands or change Node/pnpm versions.
+- Bypass diff-filter logic in `lint.yml`.
+- Move Playwright browser install outside the e2e job.
+- Change branch logic in PPA build or release triggers.
+- Alter TICS exit-code handling or security scan failure behavior.
+
+## Update Policy
+
+Whenever code or CI steps change:
+
+1. Update this file.
+2. Validate build and test steps.
+3. Ensure Copilot-suggested patterns remain valid.
+
+---
+
+## Summary Rule for Copilot
+
+> Follow the architecture, type safety, and feature isolation principles defined here.  
+> Suggest improvements only if they comply with this document’s invariants.
diff --git a/.github/features/testing/repository-profiles-followup.md b/.github/features/testing/repository-profiles-followup.md
new file mode 100644
index 000000000..203e6de91
--- /dev/null
+++ b/.github/features/testing/repository-profiles-followup.md
@@ -0,0 +1,157 @@
+# Repository Profiles — Test Coverage Follow-ups
+
+Outstanding test coverage tasks deferred from the initial high-priority pass.
+Pick them up in any order; each item is self-contained.
+
+---
+
+## High Priority — Broken test
+
+### `RepositoryProfileList` — "clicking a profile title opens the profile details side panel"
+
+**File:** `src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.test.tsx`
+
+**Root cause:** Clicking a profile title mounts `RepositoryProfileDetails`, which renders `AssociatedCountCell`. That cell calls `useGetProfileInstancesCount`, which fires `GET computers?query=profile:repository:<id>`. The MSW `computers` handler in `src/tests/server/handlers/instance.ts` does not recognise this query string and throws an unhandled-request error, causing the test to fail.
+
+**Fix required (handler change):**
+
+In `src/tests/server/handlers/instance.ts`, extend the `GET computers` handler to accept a `query` param containing `"profile:repository:"` and return a normal paginated response, e.g.:
+
+```ts
+if (query?.includes("profile:repository:")) {
+  return HttpResponse.json(generatePaginatedResponse([]));
+}
+```
+
+**Test to add/fix** (already exists in the file):
+
+```tsx
+it("clicking a profile title opens the profile details side panel", async () => {
+  const user = userEvent.setup();
+  renderWithProviders(
+    <RepositoryProfileList repositoryProfiles={repositoryProfiles} />,
+  );
+
+  await user.click(screen.getByRole("button", { name: repositoryProfiles[0].title }));
+
+  expect(
+    await screen.findByRole("heading", { name: repositoryProfiles[0].title }),
+  ).toBeInTheDocument();
+});
+```
+
+---
+
+## Medium Priority
+
+### `RepositoryProfileList` — `AssociatedCountCell` resolves count
+
+**File:** `src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.test.tsx`
+
+**Depends on:** `computers` handler fix above.
+
+**Test to add:**
+
+Assert that after the `useGetProfileInstancesCount` query resolves, each row shows the correct `applied_count` number in the Associated column. Currently `applied_count` from the mock data is rendered synchronously; verify the hook-resolved count also renders (or supersedes) it.
+
+---
+
+### `RepositoryProfileListActions` — remove modal closes after confirmation
+
+**File:** `src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.test.tsx`
+
+**Test to add** (extend existing `openRemoveModal` helper):
+
+```tsx
+it("closes the remove modal after successful confirmation", async () => {
+  renderWithProviders(<RepositoryProfileListActions profile={repositoryProfiles[0]} />);
+  await openRemoveModal(user);
+
+  await user.type(
+    screen.getByRole("textbox"),
+    repositoryProfiles[0].name,
+  );
+  await user.click(screen.getByRole("button", { name: /Remove/i }));
+
+  await waitFor(() =>
+    expect(screen.queryByRole("dialog")).not.toBeInTheDocument(),
+  );
+});
+```
+
+---
+
+### `RepositoryProfileForm` — edit mutation diff logic
+
+**File:** `src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.test.tsx`
+
+**What to test:** When editing a profile and removing an existing apt source, `editRepositoryProfileQuery` is called with the removed source's id in `remove_apt_sources` and the value absent from `add_apt_sources`. Mirror the inverse for new (id=0) sources appearing in `add_apt_sources`.
+
+**Approach:** Use `vi.spyOn` or wrap the MSW PUT handler to capture the request body, then assert its shape.
+
+---
+
+## Low Priority — Accessibility
+
+All items below add `aria-*` assertions to existing test files; no new files are needed.
+
+### `RepositoryProfileList` — column cell aria-labels
+
+**File:** `src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.test.tsx`
+
+Assert that the title link/button, access group cell, and associated count cell carry accessible labels that screen readers can announce clearly.
+
+---
+
+### `RepositoryProfileListActions` — keyboard navigation of actions menu
+
+**File:** `src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.test.tsx`
+
+Assert that the actions toggle button has an `aria-label` (e.g. `"Actions for <profile name>"`), and that `{Tab}` + `{Enter}` opens the menu without a mouse click.
+
+---
+
+### `RepositoryProfileDetails` — aria-label on Remove button
+
+**File:** `src/features/repository-profiles/components/RepositoryProfileDetails/RepositoryProfileDetails.test.tsx`
+
+Assert that the Remove button carries an accessible label (e.g. `"Remove <profile title>"`), not just the generic text "Remove".
+
+---
+
+### `RepositoryProfileForm` — form field labels and required indicators
+
+**File:** `src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.test.tsx`
+
+Assert that the submit button's accessible name matches the `CTA_INFO` label for both add and edit actions, and that required fields expose `aria-required="true"`.
+
+---
+
+## Low Priority — Detail panel coverage
+
+### `RepositoryProfileFormDetailsPanel` — access group Select options
+
+**File:** `src/features/repository-profiles/components/RepositoryProfileFormDetailsPanel/RepositoryProfileFormDetailsPanel.test.tsx`
+
+Assert that each item in the `accessGroups` prop appears as a labelled `<option>` inside the access group `<Select>`.
+
+---
+
+### `RepositoryProfileFormDetailsPanel` — formik validation error for title
+
+**File:** `src/features/repository-profiles/components/RepositoryProfileFormDetailsPanel/RepositoryProfileFormDetailsPanel.test.tsx`
+
+Pass a formik context with `errors.title = "Required"` and `touched.title = true`, then assert the error text is rendered below the title input.
+
+---
+
+## Low Priority — Orphaned components
+
+These components have no known production imports. Investigate before adding tests; if they are still in use, add tests; if not, open a separate cleanup PR to delete them.
+
+| Component | File |
+|---|---|
+| `RepositoryProfileFormAptSourcesPanel` | `src/features/repository-profiles/components/RepositoryProfileFormAptSourcesPanel/` |
+| `RepositoryProfileFormTabs` | `src/features/repository-profiles/components/RepositoryProfileFormTabs/` |
+
+Note: `RepositoryProfileFormAptSourcesPanel` has a `apt_sources: [2]` type mismatch (`number[]` vs `APTSource[]`) that must be resolved before meaningful tests can be written.
diff --git a/.github/prompts/explore-plan.prompt.md b/.github/prompts/explore-plan.prompt.md
new file mode 100644
index 000000000..21a83aff8
--- /dev/null
+++ b/.github/prompts/explore-plan.prompt.md
@@ -0,0 +1,55 @@
+---
+name: explore-plan
+description: Plans a new feature and generates a <feature-name>.md plan in the project root.
+arguments:
+  - name: featureName
+    description: The name of the feature (e.g., "scripts", "access-groups")
+  - name: description
+    description: Brief description of what the feature should do.
+---
+
+# Role
+Invoke the **@Architect** persona.
+
+# Process
+1. **Clarification (Pre-flight):** If the user's description is vague or missing API endpoints, you **MUST** ask for them before generating the plan.
+2. **Analysis:** Analyze the repo structure and `copilot-instructions.md`.
+3. **Drafting:** Generate the markdown plan.
+
+# Strict Constraints
+- **NO IMPLEMENTATION:** Do not generate component logic, hook bodies, or CSS.
+- **TYPE DEFINITIONS ONLY:** You may define TypeScript interfaces for API responses, but no executable code.
+- **FILE PATHS:** All file paths must be absolute relative to root (e.g., `src/features/...`).
+
+# Task
+Generate a comprehensive implementation plan for the feature: `{{featureName}}`. 
+
+# Output Format
+Create a file named `feature-plans/{{featureName}}.md`. If the `feature-plans/` directory doesn't exist, instruct the user to create it. Use the following structure:
+
+## 1. Feature Overview
+- **Objective:** {{description}}
+- **Location:** `src/features/{{featureName}}/`
+
+## 2. API Design
+- **Endpoints:** [List endpoints provided by user or inferred]
+- **Hooks to Create:**
+  - `useGet{{featureName}}`: (List params and transformed return object)
+  - `useCreate{{featureName}}`: (List mutation details)
+
+## 3. Component Hierarchy
+- `{{featureName}}Page.tsx`: Main entry point.
+- `components/`: List specific sub-components (e.g., `{{featureName}}Table.tsx`, `New{{featureName}}Form.tsx`).
+
+## 4. State & Logic
+- **Forms:** Define `INITIAL_VALUES` and `VALIDATION_SCHEMA` (Yup).
+- **Global Context:** Does this need a new context in `src/context/`? (Default to No).
+
+## 5. Testing Plan
+- **Unit Tests:** List key logic to test in `*.test.tsx`.
+- **MSW Handlers:** Define the mock responses needed in `src/tests/mocks/`.
+
+# Rules
+- Reference `copilot-instructions.md` for naming conventions and imports.
+- Ensure all imports use the `@/` alias.
+- Use `Formik` + `Vanilla Framework` for all UI logic.
\ No newline at end of file
diff --git a/feature-plans/repository-profile-form-refactor.md b/feature-plans/repository-profile-form-refactor.md
new file mode 100644
index 000000000..a5efaccda
--- /dev/null
+++ b/feature-plans/repository-profile-form-refactor.md
@@ -0,0 +1,398 @@
+# Feature Plan: `repository-profile-form-refactor`
+
+## 1. Feature Overview
+
+- **Objective:** Refactor `RepositoryProfileForm` to replace the current 3-tab layout (Details, Pockets, APT Sources) with 3 vertically-stacked sections (DETAILS, SOURCES, ASSOCIATION). The SOURCES section renders associated APT sources in a table and allows creating/editing sources via a nested sub-panel overlay that opens on top of the main form.
+- **Location:** `src/features/repository-profiles/`
+- **APT Sources API:** Uses `GET /repository/apt-source` (v2) for display. Sources are created/associated inline via the v2 profile PUT (`add_apt_sources`). Editing an existing source uses DELETE + POST (delete the old record, create the replacement via `add_apt_sources` on the next profile save).
+- **Source types:** Only deb-line sources (`apt_line` + optional `gpg_key`). HTTPS and S3 are not in scope.
+- **Source deletion behaviour:** Clicking delete on an existing source row tracks the ID in `removedSourceIds`. Pending (not-yet-saved) sources are removed from local state. Changes are persisted when the parent profile form is submitted.
+
+---
+
+## 2. API Design
+
+### Endpoints Used
+
+| Method   | Endpoint                     | Purpose                                              | API Version |
+|----------|------------------------------|------------------------------------------------------|-------------|
+| `GET`    | `/repository/apt-source`     | List APT sources (optionally by `ids[]`)             | v2          |
+| `PUT`    | `/repositoryprofiles/{name}` | Edit profile; creates/associates sources inline      | v2          |
+| `DELETE` | `/repository/apt-source/{id}`| Delete an APT source record (used during edit flow)  | v2          |
+
+### Key Backend Types
+
+The v2 PUT profile endpoint uses `RepositoryProfileEditBody`:
+
+```python
+class GpgKeyBody(BaseModel):
+    content: str          # raw GPG key material
+
+class AptSourceBody(BaseModel):
+    name: str
+    line: str             # the deb line
+    gpg_key: GpgKeyBody | None = None
+
+class RepositoryProfileEditBody(BaseModel):
+    title: str
+    add_apt_sources: list[AptSourceBody] = []   # creates + associates new sources inline
+    remove_apt_sources: list[int] = []           # disassociates existing sources by ID
+    # no apt_sources: int[] field
+```
+
+**There is no PATCH endpoint for APT sources.** Editing an existing source is implemented as DELETE (the old record) + inline creation via `add_apt_sources` on the next profile PUT.
+
+### Hook to Update
+
+**`src/features/repository-profiles/hooks/useRepositoryProfiles.ts`** — update `EditRepositoryProfileParams` and the mutation payload:
+
+```typescript
+// Replace the current apt_sources?: number[]
+interface EditRepositoryProfileParams {
+  name: string;
+  title?: string;
+  description?: string;
+  all_computers?: boolean;
+  tags?: string[];
+  add_apt_sources?: AptSourceBody[];   // new sources to create + associate inline
+  remove_apt_sources?: number[];       // IDs of sources to disassociate
+  pockets?: number[];                  // kept for backward compat; backend ignores via Pydantic
+}
+```
+
+Where `AptSourceBody` is a new shared type (see section 3).
+
+### Existing Hooks Reused
+
+- `useGetAPTSources` (v2) — list sources by IDs for display in the table
+- `useRemoveAPTSource` (v2) — called immediately when a user edits an existing source (deletes the old record; the replacement is queued in `pendingNewSources` and created inline on profile save)
+
+---
+
+## 3. TypeScript Types
+
+### New Types
+
+**`src/features/apt-sources/types/AptSourceBody.d.ts`** (shared type mirroring backend)
+```typescript
+export interface GpgKeyBody {
+  content: string;   // raw GPG key material
+}
+
+export interface AptSourceBody {
+  name: string;
+  line: string;                // the deb line (apt_line maps to this)
+  gpg_key?: GpgKeyBody | null;
+}
+```
+Export from `src/features/apt-sources/types/index.d.ts`.
+
+**`src/features/repository-profiles/types/RepositoryProfileSourceFormValues.d.ts`**
+```typescript
+export interface RepositoryProfileSourceFormValues {
+  name: string;
+  deb_line: string;   // required; maps to AptSourceBody.line on save
+  gpg_key: string;    // optional; maps to AptSourceBody.gpg_key.content if non-empty
+}
+```
+
+
+
+### Modified Types
+
+**`src/features/repository-profiles/hooks/useRepositoryProfiles.ts`** — `EditRepositoryProfileParams`: replace `apt_sources?: number[]` with `add_apt_sources?: AptSourceBody[]` and `remove_apt_sources?: number[]` (see section 2).
+
+---
+
+## 4. Component Hierarchy
+
+### Deleted / Deprecated
+
+| Component | Reason |
+|---|---|
+| `RepositoryProfileFormTabs` | Tabs layout removed |
+| `RepositoryProfileFormPocketsPanel` | Pockets out of scope |
+| `RepositoryProfileFormAptSourcesPanel` | Replaced by `RepositoryProfileFormSourcesSection` |
+
+> These components should remain in the codebase but stop being rendered by `RepositoryProfileForm`. A follow-up cleanup PR can delete them once this refactor is stable.
+
+### New Components
+
+```
+src/features/repository-profiles/components/
+  RepositoryProfileFormSourcesSection/
+    RepositoryProfileFormSourcesSection.tsx      # Sources table + "Add source" button
+    RepositoryProfileFormSourcesSection.test.tsx
+    index.ts
+
+  RepositoryProfileSourceForm/
+    RepositoryProfileSourceForm.tsx              # Add/Edit source sub-panel form
+    RepositoryProfileSourceForm.test.tsx
+    constants.ts                                 # INITIAL_VALUES
+    helpers.ts                                   # getValidationSchema()
+    types.d.ts                                   # re-export RepositoryProfileSourceFormValues
+    index.ts
+
+  RepositoryProfileSourceFormOverlay/
+    RepositoryProfileSourceFormOverlay.tsx       # Overlay wrapper (absolute positioning)
+    index.ts
+```
+
+### Modified Components
+
+- **`RepositoryProfileForm/RepositoryProfileForm.tsx`** — orchestrates the new layout, manages `sourceFormState` local state, conditionally renders the overlay
+- **`RepositoryProfileForm/constants.ts`** — update `INITIAL_VALUES` (remove `pockets`)
+- **`RepositoryProfileForm/helpers.ts`** — update `getValidationSchema` (remove `pockets`)
+
+---
+
+## 5. Detailed Component Specifications
+
+### 5.1 `RepositoryProfileForm` (Modified)
+
+**Layout (vertical sections, no tabs):**
+```
+<Form>
+  <h4>Details</h4>
+  <RepositoryProfileFormDetailsPanel ... />   {/* existing — remove AssociationBlock from it */}
+
+  <h4>Sources</h4>
+  <RepositoryProfileFormSourcesSection
+    formik={formik}
+    profileAptSourceIds={formik.values.apt_sources}
+  />
+
+  <h4>Association</h4>
+  <AssociationBlock formik={formik} />          {/* existing, unchanged */}
+
+  <SidePanelFormButtons ... />
+
+  {/* Overlay — rendered on top when sourceFormState is non-null */}
+  {sourceFormState && (
+    <RepositoryProfileSourceFormOverlay
+      state={sourceFormState}
+      onClose={() => setSourceFormState(null)}
+      onSourceAdded={(id) => {
+        formik.setFieldValue("apt_sources", [...formik.values.apt_sources, id]);
+        setSourceFormState(null);
+      }}
+      onSourceEdited={() => setSourceFormState(null)}
+    />
+  )}
+</Form>
+```
+
+**Local state:**
+```typescript
+// tracks sources queued for creation when the profile is saved
+const [pendingNewSources, setPendingNewSources] = useState<AptSourceBody[]>([]);
+// tracks IDs of associated sources the user has removed from the table
+const [removedSourceIds, setRemovedSourceIds] = useState<number[]>([]);
+// controls visibility of the "Add source" overlay
+const [showSourceOverlay, setShowSourceOverlay] = useState(false);
+```
+
+**Removed from this component:**
+- `getDistributionsQuery` and `getAPTSourcesQuery` calls
+- `currentTab` / `setCurrentTab` state
+- `RepositoryProfileFormTabs` render
+- Tab-based conditional rendering
+
+**Updated in `handleSubmit`:**
+```typescript
+// Replace apt_sources: values.apt_sources with:
+add_apt_sources: pendingNewSources,
+remove_apt_sources: removedSourceIds,
+```
+
+**Unchanged in this component:**
+- `action: "add" | "edit"` props
+- `createRepositoryProfileQuery` / `editRepositoryProfileQuery` mutations
+- `getAccessGroupQuery` call (still needed for Details panel)
+- `useEffect` for setting edit-mode values (remove `pockets` from `formik.setValues`)
+
+---
+
+### 5.2 `RepositoryProfileFormSourcesSection`
+
+**Props:**
+```typescript
+interface RepositoryProfileFormSourcesSectionProps {
+  readonly formik: FormikContextType<RepositoryProfileFormValues>;
+  readonly profileAptSourceIds: number[];
+  readonly onAddSource: () => void;
+  readonly onEditSource: (source: APTSource) => void;
+  readonly onRemoveSource: (id: number) => void;
+}
+```
+
+**Props:**
+```typescript
+interface RepositoryProfileFormSourcesSectionProps {
+  readonly profileAptSourceIds: number[];           // from formik.values.apt_sources (edit mode)
+  readonly pendingNewSources: AptSourceBody[];       // queued sources not yet persisted
+  readonly onAddSource: (source: AptSourceBody) => void;
+  readonly onRemoveExistingSource: (id: number) => void;
+  readonly onRemovePendingSource: (name: string) => void;
+  readonly onShowAddOverlay: () => void;
+}
+```
+
+**Behaviour:**
+- Calls `useGetAPTSources({ ids: profileAptSourceIds })` (skips when empty)
+- Renders a table with two groups of rows: **existing** sources (fetched by ID) and **pending** sources (`pendingNewSources` shown with a visual indicator like a "pending" badge)
+- Columns: **Source Name**, **Deb line** (truncated), **Actions**
+- **Actions column**: Edit button (pencil icon) + Delete button (trash icon)
+  - Edit existing source: calls `onEditSource(source)` → opens overlay in edit mode
+  - Edit pending source: calls `onEditPendingSource(source.name)` → opens overlay in edit mode (no DELETE call needed; just replace in local state)
+  - Delete existing source: calls `onRemoveExistingSource(source.id)`
+  - Delete pending source: calls `onRemovePendingSource(source.name)`
+- "Add source" button → calls `onShowAddOverlay()`
+- Empty state: "No sources added yet." with "Add source" CTA
+
+**Handlers in `RepositoryProfileForm`:**
+```typescript
+const handleAddSource = (source: AptSourceBody) => {
+  setPendingNewSources((prev) => [...prev, source]);
+  setShowSourceOverlay(false);
+};
+
+const handleRemoveExistingSource = (id: number) => {
+  setRemovedSourceIds((prev) => [...prev, id]);
+  formik.setFieldValue(
+    "apt_sources",
+    formik.values.apt_sources.filter((sourceId) => sourceId !== id),
+  );
+};
+
+const handleRemovePendingSource = (name: string) => {
+  setPendingNewSources((prev) => prev.filter((s) => s.name !== name));
+};
+```
+
+> **Overlay notes (`RepositoryProfileSourceFormOverlay`):** Absolutely-positioned over `.p-panel__content`. Header: `"Add/Edit repository profile / Add/Edit Source"` (adjusts based on `action`). Contains `<RepositoryProfileSourceForm>` and a back/close button. Does **not** call `setSidePanelContent` — local DOM overlay only.
+
+---
+
+### 5.3 `RepositoryProfileSourceForm`
+
+**Props:**
+```typescript
+type RepositoryProfileSourceFormProps =
+  | { action: "add"; onSuccess: (source: AptSourceBody) => void; onCancel: () => void }
+  | { action: "edit"; source: APTSource; onSuccess: (replacement: AptSourceBody) => void; onCancel: () => void };
+```
+
+In edit mode the `source` prop pre-fills the form fields. The source name field is disabled (names are immutable). On submit, `useRemoveAPTSource` is called immediately to delete the old record, then `onSuccess(replacement)` is called to queue the new body.
+
+> The form handles both **add** and **edit** actions. In both cases no API call is made when the sub-form is submitted — the result is an `AptSourceBody` that is queued in local state. For **edit**, the old APT source is deleted immediately via `useRemoveAPTSource` when the user confirms; the replacement is queued in `pendingNewSources` and created inline when the parent profile form is saved.
+
+**Fields:**
+
+| Field | Component | Required |
+|---|---|---|
+| Source name | `<Input type="text">` | Yes |
+| Deb line | `<Input type="text">` | Yes |
+| GPG key | `<Input type="text">` | No |
+
+> No `type` selector or edit mode in this iteration. The form always produces an `AptSourceBody` (`{ name, line, gpg_key? }`).
+
+> No `access_group` field. On submit, calls `onSuccess({ name, line, gpg_key })` — no API call. The `AptSourceBody` object is accumulated in local state and sent to the backend only when the parent profile form is saved. No `try/catch` needed in this form.
+
+**`constants.ts`:**
+```typescript
+export const INITIAL_VALUES: RepositoryProfileSourceFormValues = {
+  name: "",
+  deb_line: "",
+  gpg_key: "",
+};
+```
+
+**`helpers.ts` — `getValidationSchema()`:**
+```typescript
+Yup.object().shape({
+  name: Yup.string()
+    .required("This field is required.")
+    .matches(/^[a-z0-9][a-z0-9+.-]*$/, "Name must start with alphanumeric and contain only lowercase letters, numbers, -, or +."),
+  deb_line: Yup.string().required("This field is required."),
+  gpg_key: Yup.string(),
+});
+```
+
+---
+
+## 6. Testing Plan
+
+### 6.1 Unit Tests
+
+#### `RepositoryProfileForm.test.tsx` (Modified)
+
+- **Remove** tests for tab switching, pocket tab content, APT sources tab content
+- **Add:**
+  - Renders Details, Sources, and Association sections (no tabs present)
+  - Title field is required in add mode
+  - `pockets` field is not present in submitted payload
+  - Clicking "Add source" renders the source overlay
+  - Clicking edit on a source row renders the overlay with pre-filled values
+  - Clicking delete on a source row removes it from the sources table
+  - On successful add-source, the new source ID is reflected in the sources table
+
+#### `RepositoryProfileFormSourcesSection.test.tsx` (New)
+
+- Renders empty state when no sources are associated
+- Renders table rows for each pre-loaded APT source (Source name + type columns)
+- "Add source" button calls `onAddSource`
+- Edit button on a row calls `onEditSource` with the correct `APTSource` object
+- Delete button on a row calls `onRemoveSource` with the correct source ID
+
+#### `RepositoryProfileSourceForm.test.tsx` (New)
+
+- Renders source name and deb_line fields
+- Shows required validation errors for empty name and deb_line on submit
+- Calls `onSuccess` with correct `AptSourceBody` after valid submit (name, line, gpg_key)
+- Does **not** call any API on submit (deferred creation)
+- Calls `onCancel` when cancel button is clicked
+
+### 6.2 MSW Handlers
+
+**Existing handlers to confirm present:**
+- `GET /repository/apt-source` — should already exist in apt-sources handlers
+- `PUT /repositoryprofiles/:name` — should already exist in repository-profiles handlers; verify it handles `add_apt_sources`/`remove_apt_sources` in the mock response
+
+No new handlers required for this iteration (PATCH endpoint does not exist yet).
+
+### 6.3 Mock Data
+
+**`src/tests/mocks/aptSources.ts`** (verify or extend):
+- At least 2-3 mock `APTSource` objects with `id`, `name`, `line`, `access_group`, `gpg_key`, `profiles[]`
+- Ensure IDs match the `apt_sources` arrays in `src/tests/mocks/repositoryProfiles.ts`
+
+---
+
+## 7. Implementation Order
+
+1. **`AptSourceBody` type** — add to `src/features/apt-sources/types/`; export from types index
+2. **Update `EditRepositoryProfileParams`** — replace `apt_sources` with `add_apt_sources`/`remove_apt_sources` in `useRepositoryProfiles.ts`
+3. **`RepositoryProfileSourceForm`** — new form component + constants + helpers + types (add-only, no API call on submit)
+4. **`RepositoryProfileSourceFormOverlay`** — overlay wrapper (add-only header)
+5. **`RepositoryProfileFormSourcesSection`** — sources table (existing + pending rows, delete only)
+6. **`RepositoryProfileForm` modifications** — remove tabs/pockets, wire up 3 sections, local state for pending/removed sources
+7. **`RepositoryProfileFormDetailsPanel`** — remove `<AssociationBlock>` (moved to main form)
+8. **`RepositoryProfileForm/constants.ts` + `helpers.ts`** — remove `pockets` from `INITIAL_VALUES` and validation schema
+9. **Tests** — update `RepositoryProfileForm.test.tsx`; add new test files
+
+---
+
+## 8. Resolved Decisions
+
+| # | Question | Resolution |
+|---|---|---|
+| 1 | Pockets removal | Confirmed. Remove pockets from form; keep components in codebase for future cleanup PR. |
+| 2 | Access group per source | No per-source access group. Field omitted from source form entirely. |
+| 3 | Delete behaviour | Disassociation only — matches previous behaviour. APT source record is not deleted via API. |
+| 4 | Edit source flow | No PATCH endpoint. Edit = DELETE old APT source record immediately + queue replacement `AptSourceBody` in `pendingNewSources`; created inline on profile save. |
+| 5 | HTTPS / S3 source types | **Out of scope and not documented.** Only deb-line sources are supported. |
+| 6 | AssociationBlock location | Move out of `RepositoryProfileFormDetailsPanel`; render as a separate `<h4>Association</h4>` section directly in `RepositoryProfileForm`. Modify DetailsPanel to remove `<AssociationBlock>`. |
+| 7 | GPG key field | Free-text `<Input type="text">` (not a `<Select>`). No API call needed. |
+| 8 | Type selector | Removed. Only deb-line sources are supported. No `<Select>` type field is needed. |
+| 9 | Pockets in submit payload | Keep `pockets: []` in the submitted payload for backward compatibility. Remove only from the form UI and `INITIAL_VALUES`. |
diff --git a/src/components/layout/Blocks/Blocks.tsx b/src/components/layout/Blocks/Blocks.tsx
index 927a0e5d5..78cf02951 100644
--- a/src/components/layout/Blocks/Blocks.tsx
+++ b/src/components/layout/Blocks/Blocks.tsx
@@ -1,15 +1,24 @@
-import { type FC, type ReactNode } from "react";
+import { createContext, useContext, type FC, type ReactNode } from "react";
 import classes from "./Blocks.module.scss";
 import type { ItemProps } from "./Item";
 import Item from "./Item";
 
 interface BlocksProps {
   readonly children: ReactNode;
+  readonly dense?: boolean;
 }
 
+export const BlocksDenseContext = createContext(false);
+export const useBlocksDense = () => useContext(BlocksDenseContext);
+
 const Blocks: FC<BlocksProps> & { Item: FC<ItemProps> } = ({
   children,
-}: BlocksProps) => <div className={classes.blocks}>{children}</div>;
+  dense = false,
+}: BlocksProps) => (
+  <BlocksDenseContext.Provider value={dense}>
+    <div className={classes.blocks}>{children}</div>
+  </BlocksDenseContext.Provider>
+);
 
 Blocks.Item = Item;
 export default Blocks;
diff --git a/src/components/layout/Blocks/Item/Item.module.scss b/src/components/layout/Blocks/Item/Item.module.scss
index e531aa475..876ce6c98 100644
--- a/src/components/layout/Blocks/Item/Item.module.scss
+++ b/src/components/layout/Blocks/Item/Item.module.scss
@@ -10,3 +10,7 @@
   margin: -$sp-unit 0 $sp-unit * 4;
   padding: 0;
 }
+
+.denseHeading {
+  margin-bottom: 0.5rem;
+}
diff --git a/src/components/layout/Blocks/Item/Item.tsx b/src/components/layout/Blocks/Item/Item.tsx
index a1d798a30..aaabf050b 100644
--- a/src/components/layout/Blocks/Item/Item.tsx
+++ b/src/components/layout/Blocks/Item/Item.tsx
@@ -1,10 +1,12 @@
 import classNames from "classnames";
 import type { FC, ReactNode } from "react";
 import classes from "./Item.module.scss";
+import { useBlocksDense } from "../Blocks";
 
 export interface ItemProps {
   readonly children: ReactNode;
   readonly title?: string;
+  readonly action?: ReactNode;
   readonly titleClassName?: string;
   readonly containerClassName?: string;
 }
@@ -12,16 +14,22 @@ export interface ItemProps {
 const Item: FC<ItemProps> = ({
   children,
   title,
+  action,
   titleClassName,
   containerClassName,
 }: ItemProps) => (
   <section className={classNames(classes.item, containerClassName)}>
-    {title && (
-      <h4
-        className={classNames(classes.heading, "p-heading--5", titleClassName)}
-      >
-        {title}
-      </h4>
+    {(title || action) && (
+      <div className={classes.heading}>
+        {title && (
+          <h4
+            className={classNames(classes.heading, "p-heading--5", titleClassName)}
+          >
+            {title}
+          </h4>
+        )}
+        {action}
+      </div>
     )}
     {children}
   </section>
diff --git a/src/components/layout/InfoGrid/InfoGrid.tsx b/src/components/layout/InfoGrid/InfoGrid.tsx
index ee9e04fca..9410be00f 100644
--- a/src/components/layout/InfoGrid/InfoGrid.tsx
+++ b/src/components/layout/InfoGrid/InfoGrid.tsx
@@ -19,12 +19,12 @@ const InfoGrid: FC<InfoGridProps> & { Item: FC<ItemProps> } = ({
   <div
     className={classNames(
       classes.infoGrid,
-      { [classes.spacedInfoGrid]: spaced },
+      { [classes.spacedInfoGrid as string]: spaced },
       className,
     )}
   >
     <div
-      className={classNames(classes.grid, { [classes.denseGrid]: dense })}
+      className={classNames(classes.grid, { [classes.denseGrid as string]: dense })}
       {...props}
     />
   </div>
diff --git a/src/components/layout/ListTitle/constants.tsx b/src/components/layout/ListTitle/constants.tsx
index e441e4ac1..6a336132c 100644
--- a/src/components/layout/ListTitle/constants.tsx
+++ b/src/components/layout/ListTitle/constants.tsx
@@ -5,8 +5,7 @@ export const LIST_TITLE_COLUMN_PROPS = {
   id: "title",
   Header: (
     <div className={classes.header}>
-      Title
-      <span className="u-text--muted">Name</span>
+      Profile Name
     </div>
   ),
 };
diff --git a/src/components/layout/LoadingState/LoadingState.tsx b/src/components/layout/LoadingState/LoadingState.tsx
index cf1b5b2ff..f0dbc3e89 100644
--- a/src/components/layout/LoadingState/LoadingState.tsx
+++ b/src/components/layout/LoadingState/LoadingState.tsx
@@ -21,7 +21,7 @@ const LoadingState: FC<LoadingStateProps> = ({ centerOnScreen, inline }) => {
   }
 
   return (
-    <div className={classNames({ [classes.root]: centerOnScreen })}>
+    <div className={classNames({ [classes.root as string]: centerOnScreen })}>
       <div className="p-strip" role="status">
         <div className="u-align-text--center">{spinningElement}</div>
       </div>
diff --git a/src/context/profiles.tsx b/src/context/profiles.tsx
new file mode 100644
index 000000000..b3f459c3a
--- /dev/null
+++ b/src/context/profiles.tsx
@@ -0,0 +1,91 @@
+import type { UseMutateAsyncFunction } from "@tanstack/react-query";
+import type { FC, ReactNode } from "react";
+import { createContext, useCallback, useRef, useState } from "react";
+
+export interface RemoveProfileParams {
+  id: number;
+  name: string;
+}
+
+type RemoveProfileFn = UseMutateAsyncFunction<
+  unknown,
+  unknown,
+  RemoveProfileParams
+>;
+
+const noopRemoveProfile: RemoveProfileFn = async () => {
+  throw new Error("removeProfile is not configured");
+};
+
+interface ProfilesContextProps {
+  isProfileLimitReached: boolean;
+  setIsProfileLimitReached: (limitReached: boolean) => void;
+  profileLimit: number;
+  setProfileLimit: (limit: number) => void;
+  removeProfile: RemoveProfileFn;
+  setRemoveProfile: (removalFn: RemoveProfileFn) => void;
+  isRemovingProfile: boolean;
+  setIsRemovingProfile: (isRemoving: boolean) => void;
+}
+
+const initialState = {
+  isProfileLimitReached: false,
+  setIsProfileLimitReached: () => undefined,
+  profileLimit: 0,
+  setProfileLimit: () => undefined,
+  removeProfile: noopRemoveProfile,
+  setRemoveProfile: () => undefined,
+  isRemovingProfile: false,
+  setIsRemovingProfile: () => undefined,
+};
+
+export const ProfilesContext =
+  createContext<ProfilesContextProps>(initialState);
+
+interface ProfilesProviderProps {
+  readonly children: ReactNode;
+  readonly path: string;
+}
+
+export const ProfilesProvider: FC<ProfilesProviderProps> = ({
+  children,
+  path,
+}) => {
+  const [isProfileLimitReached, setIsProfileLimitReached] = useState(false);
+  const [profileLimit, setProfileLimit] = useState(0);
+  const [resetKey, setResetKey] = useState(path);
+  const removeProfileRef = useRef<RemoveProfileFn>(noopRemoveProfile);
+  const [isRemovingProfile, setIsRemovingProfile] = useState(false);
+
+  const removeProfile: RemoveProfileFn = useCallback(
+    (variables, options) => removeProfileRef.current(variables, options),
+    [],
+  );
+
+  const setRemoveProfile: ProfilesContextProps["setRemoveProfile"] =
+    useCallback((removalFn) => {
+      removeProfileRef.current = removalFn;
+    }, []);
+
+  if (path !== resetKey) {
+    setIsProfileLimitReached(false);
+    setResetKey(path);
+  }
+
+  return (
+    <ProfilesContext.Provider
+      value={{
+        isProfileLimitReached,
+        setIsProfileLimitReached,
+        profileLimit,
+        setProfileLimit,
+        removeProfile,
+        setRemoveProfile,
+        isRemovingProfile,
+        setIsRemovingProfile,
+      }}
+    >
+      {children}
+    </ProfilesContext.Provider>
+  );
+};
diff --git a/src/context/sidePanel.tsx b/src/context/sidePanel.tsx
index e715c2b34..835dba4ef 100644
--- a/src/context/sidePanel.tsx
+++ b/src/context/sidePanel.tsx
@@ -5,7 +5,7 @@ import usePageParams from "@/hooks/usePageParams";
 import { Button, Icon, ICONS } from "@canonical/react-components";
 import classNames from "classnames";
 import type { FC, ReactNode } from "react";
-import { createContext, useEffect, useState } from "react";
+import { createContext, useEffect, useRef, useState } from "react";
 import { useLocation } from "react-router";
 import classes from "./SidePanelProvider.module.scss";
 
@@ -22,6 +22,7 @@ interface SidePanelContextProps {
     titleLabel?: string,
   ) => void;
   setSidePanelTitle: (title: ReactNode) => void;
+  setOnCloseOverride: (handler: (() => void) | undefined) => void;
 }
 
 const initialState: SidePanelContextProps = {
@@ -30,6 +31,7 @@ const initialState: SidePanelContextProps = {
   closeSidePanel: () => undefined,
   setSidePanelContent: () => undefined,
   setSidePanelTitle: () => undefined,
+  setOnCloseOverride: () => undefined,
 };
 
 export const SidePanelContext =
@@ -43,6 +45,7 @@ const SidePanelProvider: FC<SidePanelProviderProps> = ({ children }) => {
   const [open, setOpen] = useState(false);
   const [size, setSize] = useState<SidePanelSize>("small");
   const [title, setTitle] = useState<ReactNode>(undefined);
+  const onCloseOverrideRef = useRef<(() => void) | undefined>(undefined);
   const [titleLabel, setTitleLabel] = useState("");
   const [body, setBody] = useState<ReactNode | null>(null);
 
@@ -57,6 +60,7 @@ const SidePanelProvider: FC<SidePanelProviderProps> = ({ children }) => {
     setBody(null);
     setSize("small");
     sidePanel.setOpen(false);
+    onCloseOverrideRef.current = undefined;
   };
 
   useEffect(() => {
@@ -97,6 +101,9 @@ const SidePanelProvider: FC<SidePanelProviderProps> = ({ children }) => {
         closeSidePanel: handleSidePanelClose,
         setSidePanelContent: handleContentChange,
         setSidePanelTitle: handleTitleChange,
+        setOnCloseOverride: (handler) => {
+          onCloseOverrideRef.current = handler;
+        },
       }}
     >
       {children}
@@ -120,7 +127,9 @@ const SidePanelProvider: FC<SidePanelProviderProps> = ({ children }) => {
               <div className="p-panel__controls">
                 <Button
                   type="button"
-                  onClick={handleSidePanelClose}
+                  onClick={() =>
+                    (onCloseOverrideRef.current ?? handleSidePanelClose)()
+                  }
                   className="p-button--base u-no-margin--bottom has-icon"
                   aria-label="Close side panel"
                 >
diff --git a/src/features/apt-sources/api/useGetAPTSources.ts b/src/features/apt-sources/api/useGetAPTSources.ts
index db946358b..1e4985e01 100644
--- a/src/features/apt-sources/api/useGetAPTSources.ts
+++ b/src/features/apt-sources/api/useGetAPTSources.ts
@@ -1,6 +1,7 @@
 import useFetch from "@/hooks/useFetch";
 import type { ApiError } from "@/types/api/ApiError";
 import { useQuery } from "@tanstack/react-query";
+import type { UseQueryOptions } from "@tanstack/react-query";
 import type { AxiosError, AxiosResponse } from "axios";
 import type { APTSource } from "../types";
 
@@ -13,7 +14,16 @@ interface GetAPTSourcesResult {
   results: APTSource[];
 }
 
-export const useGetAPTSources = (params?: GetAPTSourcesParams) => {
+export const useGetAPTSources = (
+  params?: GetAPTSourcesParams,
+  options?: Omit<
+    UseQueryOptions<
+      AxiosResponse<GetAPTSourcesResult>,
+      AxiosError<ApiError>
+    >,
+    "queryKey" | "queryFn"
+  >,
+) => {
   const authFetch = useFetch();
 
   const { data: response, isPending } = useQuery<
@@ -22,6 +32,7 @@ export const useGetAPTSources = (params?: GetAPTSourcesParams) => {
   >({
     queryKey: ["aptSources", params],
     queryFn: () => authFetch.get("repository/apt-source", { params }),
+    ...options,
   });
 
   return {
diff --git a/src/features/package-profiles/api/index.ts b/src/features/package-profiles/api/index.ts
index 136988e83..43c909fd6 100644
--- a/src/features/package-profiles/api/index.ts
+++ b/src/features/package-profiles/api/index.ts
@@ -1 +1,2 @@
 export * from "./useGetPackageProfile";
+export * from "./useGetPagePackageProfile";
diff --git a/src/features/package-profiles/api/useGetPackageProfile.ts b/src/features/package-profiles/api/useGetPackageProfile.ts
index 0bc89e17a..f91bbe60b 100644
--- a/src/features/package-profiles/api/useGetPackageProfile.ts
+++ b/src/features/package-profiles/api/useGetPackageProfile.ts
@@ -1,5 +1,6 @@
 import useFetch from "@/hooks/useFetch";
 import type { ApiError } from "@/types/api/ApiError";
+import type { UseQueryOptions } from "@tanstack/react-query";
 import { useQuery } from "@tanstack/react-query";
 import type { AxiosError, AxiosResponse } from "axios";
 import type { PackageProfile } from "../types";
@@ -8,7 +9,16 @@ export interface UseGetPackageProfileParams {
   name: string;
 }
 
-export const useGetPackageProfile = (name: string) => {
+export const useGetPackageProfile = (
+  name: string,
+  config: Omit<
+    UseQueryOptions<
+      AxiosResponse<{ result: [PackageProfile] }>,
+      AxiosError<ApiError>
+    >,
+    "queryKey" | "queryFn"
+  > = {},
+) => {
   const authFetch = useFetch();
 
   const {
@@ -25,6 +35,7 @@ export const useGetPackageProfile = (name: string) => {
         params: { names: [name] },
         signal,
       }),
+    ...config,
   });
 
   const packageProfile = response?.data.result[0];
diff --git a/src/features/package-profiles/api/useGetPagePackageProfile.ts b/src/features/package-profiles/api/useGetPagePackageProfile.ts
index 1b69e3a22..ce4600b26 100644
--- a/src/features/package-profiles/api/useGetPagePackageProfile.ts
+++ b/src/features/package-profiles/api/useGetPagePackageProfile.ts
@@ -1,14 +1,14 @@
 import usePageParams from "@/hooks/usePageParams";
-import { useGetPackageProfile } from ".";
+import { useGetPackageProfile } from "./useGetPackageProfile";
 import type { PackageProfile } from "../types";
 
-const useGetPagePackageProfile = ():
+export const useGetPagePackageProfile = ():
   | { packageProfile: PackageProfile; isGettingPackageProfile: false }
   | { packageProfile: undefined; isGettingPackageProfile: true } => {
   const { name: packageProfileName } = usePageParams();
 
   const { packageProfile, isGettingPackageProfile, packageProfileError } =
-    useGetPackageProfile(packageProfileName);
+    useGetPackageProfile(packageProfileName, { enabled: !!packageProfileName });
 
   if (packageProfileError) {
     throw packageProfileError;
@@ -26,5 +26,3 @@ const useGetPagePackageProfile = ():
     isGettingPackageProfile: false,
   };
 };
-
-export default useGetPagePackageProfile;
diff --git a/src/features/package-profiles/components/PackageProfileConstraintsAddSidePanel/PackageProfileConstraintsAddSidePanel.tsx b/src/features/package-profiles/components/PackageProfileConstraintsAddSidePanel/PackageProfileConstraintsAddSidePanel.tsx
index bacb1f831..084cbfe57 100644
--- a/src/features/package-profiles/components/PackageProfileConstraintsAddSidePanel/PackageProfileConstraintsAddSidePanel.tsx
+++ b/src/features/package-profiles/components/PackageProfileConstraintsAddSidePanel/PackageProfileConstraintsAddSidePanel.tsx
@@ -1,6 +1,6 @@
 import SidePanel from "@/components/layout/SidePanel";
 import type { FC } from "react";
-import useGetPagePackageProfile from "../../api/useGetPagePackageProfile";
+import { useGetPagePackageProfile } from "../../api/useGetPagePackageProfile";
 import PackageProfileConstraintsAddForm from "./components/PackageProfileConstraintsAddForm";
 
 const PackageProfileConstraintsAddSidePanel: FC = () => {
diff --git a/src/features/package-profiles/components/PackageProfileConstraintsEditSidePanel/PackageProfileConstraintsEditSidePanel.tsx b/src/features/package-profiles/components/PackageProfileConstraintsEditSidePanel/PackageProfileConstraintsEditSidePanel.tsx
index 2c1dc7264..6497b19b2 100644
--- a/src/features/package-profiles/components/PackageProfileConstraintsEditSidePanel/PackageProfileConstraintsEditSidePanel.tsx
+++ b/src/features/package-profiles/components/PackageProfileConstraintsEditSidePanel/PackageProfileConstraintsEditSidePanel.tsx
@@ -1,6 +1,6 @@
 import SidePanel from "@/components/layout/SidePanel";
 import type { FC } from "react";
-import useGetPagePackageProfile from "../../api/useGetPagePackageProfile";
+import { useGetPagePackageProfile } from "../../api/useGetPagePackageProfile";
 import PackageProfileConstraintsEditForm from "./components/PackageProfileConstraintsEditForm";
 
 const PackageProfileConstraintsEditSidePanel: FC = () => {
diff --git a/src/features/package-profiles/components/PackageProfileDetailsConstraints/PackageProfileDetailsConstraints.test.tsx b/src/features/package-profiles/components/PackageProfileDetailsConstraints/PackageProfileDetailsConstraints.test.tsx
index f179a844e..92cf10507 100644
--- a/src/features/package-profiles/components/PackageProfileDetailsConstraints/PackageProfileDetailsConstraints.test.tsx
+++ b/src/features/package-profiles/components/PackageProfileDetailsConstraints/PackageProfileDetailsConstraints.test.tsx
@@ -12,11 +12,10 @@ describe("PackageProfileDetailsConstraints", () => {
     );
   });
 
-  it("should render profile constraint list with the search and CTA", async () => {
+  it("should render profile constraint list with the search", async () => {
     await expectLoadingState();
 
     expect(screen.getByPlaceholderText("Search")).toBeInTheDocument();
-    expect(screen.getByText("Change package constraints")).toBeInTheDocument();
 
     packageProfiles[0].constraints.forEach((constraint) => {
       expect(
diff --git a/src/features/package-profiles/components/PackageProfileDetailsConstraints/PackageProfileDetailsConstraints.tsx b/src/features/package-profiles/components/PackageProfileDetailsConstraints/PackageProfileDetailsConstraints.tsx
index 9a2bf0ae1..dcb0054a0 100644
--- a/src/features/package-profiles/components/PackageProfileDetailsConstraints/PackageProfileDetailsConstraints.tsx
+++ b/src/features/package-profiles/components/PackageProfileDetailsConstraints/PackageProfileDetailsConstraints.tsx
@@ -1,15 +1,12 @@
 import HeaderWithSearch from "@/components/form/HeaderWithSearch";
 import LoadingState from "@/components/layout/LoadingState";
 import { SidePanelTablePagination } from "@/components/layout/TablePagination";
-import usePageParams from "@/hooks/usePageParams";
 import { DEFAULT_PAGE_SIZE } from "@/libs/pageParamsManager";
-import { Button } from "@canonical/react-components";
 import type { FC } from "react";
 import { useState } from "react";
 import { usePackageProfiles } from "../../hooks";
 import type { PackageProfile } from "../../types";
 import PackageProfileDetailsConstraintsInfo from "../PackageProfileDetailsConstraintsInfo";
-import classes from "./PackageProfileDetailsConstraints.module.scss";
 
 interface PackageProfileDetailsConstraintsProps {
   readonly profile: PackageProfile;
@@ -22,7 +19,6 @@ const PackageProfileDetailsConstraints: FC<
   const [pageSize, setPageSize] = useState<number>(DEFAULT_PAGE_SIZE);
   const [search, setSearch] = useState("");
 
-  const { createSidePathPusher } = usePageParams();
   const { getPackageProfileConstraintsQuery } = usePackageProfiles();
 
   const {
@@ -35,9 +31,6 @@ const PackageProfileDetailsConstraints: FC<
     search,
   });
 
-  const handlePackageConstraintsChange =
-    createSidePathPusher("edit-constraints");
-
   return (
     <>
       {!search &&
@@ -52,20 +45,7 @@ const PackageProfileDetailsConstraints: FC<
           getPackageProfileConstraintsQueryResult &&
           getPackageProfileConstraintsQueryResult.data.results.length > 0)) && (
         <>
-          <HeaderWithSearch
-            className={classes.actions}
-            onSearch={setSearch}
-            searchText={search}
-            actions={
-              <Button
-                className="u-no-margin--bottom"
-                type="button"
-                onClick={handlePackageConstraintsChange}
-              >
-                Change package constraints
-              </Button>
-            }
-          />
+          <HeaderWithSearch onSearch={setSearch} searchText={search} />
 
           <PackageProfileDetailsConstraintsInfo
             isConstraintsLoading={getPackageProfileConstraintsQueryLoading}
diff --git a/src/features/package-profiles/components/PackageProfileDuplicateSidePanel/PackageProfileDuplicateSidePanel.tsx b/src/features/package-profiles/components/PackageProfileDuplicateSidePanel/PackageProfileDuplicateSidePanel.tsx
index 6ebdc710d..660d72c70 100644
--- a/src/features/package-profiles/components/PackageProfileDuplicateSidePanel/PackageProfileDuplicateSidePanel.tsx
+++ b/src/features/package-profiles/components/PackageProfileDuplicateSidePanel/PackageProfileDuplicateSidePanel.tsx
@@ -1,6 +1,6 @@
 import SidePanel from "@/components/layout/SidePanel";
 import type { FC } from "react";
-import useGetPagePackageProfile from "../../api/useGetPagePackageProfile";
+import { useGetPagePackageProfile } from "../../api/useGetPagePackageProfile";
 import PackageProfileDuplicateForm from "./components/PackageProfileDuplicateForm";
 
 const PackageProfileDuplicateSidePanel: FC = () => {
diff --git a/src/features/package-profiles/components/PackageProfileDuplicateSidePanel/components/PackageProfileDuplicateForm/PackageProfileDuplicateForm.tsx b/src/features/package-profiles/components/PackageProfileDuplicateSidePanel/components/PackageProfileDuplicateForm/PackageProfileDuplicateForm.tsx
index c8e09da93..77a47eb19 100644
--- a/src/features/package-profiles/components/PackageProfileDuplicateSidePanel/components/PackageProfileDuplicateForm/PackageProfileDuplicateForm.tsx
+++ b/src/features/package-profiles/components/PackageProfileDuplicateSidePanel/components/PackageProfileDuplicateForm/PackageProfileDuplicateForm.tsx
@@ -72,7 +72,7 @@ const PackageProfileDuplicateForm: FC<PackageProfileDuplicateFormProps> = ({
     initialValues: {
       access_group: profile.access_group,
       all_computers: profile.all_computers,
-      description: profile.description,
+      description: profile.description ?? "",
       tags: profile.tags,
       title: `${profile.title} (copy)`,
     },
diff --git a/src/features/package-profiles/components/PackageProfileEditSidePanel/PackageProfileEditSidePanel.tsx b/src/features/package-profiles/components/PackageProfileEditSidePanel/PackageProfileEditSidePanel.tsx
index f4a6269e6..ab0b52112 100644
--- a/src/features/package-profiles/components/PackageProfileEditSidePanel/PackageProfileEditSidePanel.tsx
+++ b/src/features/package-profiles/components/PackageProfileEditSidePanel/PackageProfileEditSidePanel.tsx
@@ -1,6 +1,6 @@
 import SidePanel from "@/components/layout/SidePanel";
 import type { FC } from "react";
-import useGetPagePackageProfile from "../../api/useGetPagePackageProfile";
+import { useGetPagePackageProfile } from "../../api/useGetPagePackageProfile";
 import PackageProfileEditForm from "./components/PackageProfileEditForm";
 
 const PackageProfileEditSidePanel: FC = () => {
diff --git a/src/features/package-profiles/components/PackageProfileEditSidePanel/components/PackageProfileEditForm/PackageProfileEditForm.tsx b/src/features/package-profiles/components/PackageProfileEditSidePanel/components/PackageProfileEditForm/PackageProfileEditForm.tsx
index 34c09feca..b69f4f8bc 100644
--- a/src/features/package-profiles/components/PackageProfileEditSidePanel/components/PackageProfileEditForm/PackageProfileEditForm.tsx
+++ b/src/features/package-profiles/components/PackageProfileEditSidePanel/components/PackageProfileEditForm/PackageProfileEditForm.tsx
@@ -60,7 +60,7 @@ const PackageProfileEditForm: FC<PackageProfileEditFormProps> = ({
     enableReinitialize: true,
     initialValues: {
       all_computers: profile.all_computers,
-      description: profile.description,
+      description: profile.description ?? "",
       tags: profile.tags,
       title: profile.title,
     },
diff --git a/src/features/package-profiles/index.ts b/src/features/package-profiles/index.ts
index 502ffd089..ee99fb6c5 100644
--- a/src/features/package-profiles/index.ts
+++ b/src/features/package-profiles/index.ts
@@ -1,11 +1,11 @@
+export { useGetPagePackageProfile } from "./api";
+export { usePackageProfiles } from "./hooks";
 export { default as PackageProfileAddSidePanel } from "./components/PackageProfileAddSidePanel";
 export { default as PackageProfileConstraintsAddSidePanel } from "./components/PackageProfileConstraintsAddSidePanel";
 export { default as PackageProfileConstraintsEditSidePanel } from "./components/PackageProfileConstraintsEditSidePanel";
-export { default as PackageProfileDetailsSidePanel } from "./components/PackageProfileDetailsSidePanel";
 export { default as PackageProfileDuplicateSidePanel } from "./components/PackageProfileDuplicateSidePanel";
 export { default as PackageProfileEditSidePanel } from "./components/PackageProfileEditSidePanel";
+export { default as PackageProfileDetailsConstraints } from "./components/PackageProfileDetailsConstraints";
 export { default as PackageProfileHeader } from "./components/PackageProfileHeader";
 export { default as PackageProfileList } from "./components/PackageProfileList";
-export { default as PackageProfilesEmptyState } from "./components/PackageProfilesEmptyState";
-export { usePackageProfiles } from "./hooks";
-export type { PackageProfile, PackageProfileConstraint } from "./types";
+export type { PackageProfile } from "./types";
diff --git a/src/features/package-profiles/types/PackageProfile.ts b/src/features/package-profiles/types/PackageProfile.ts
index 723ad1f74..19430e531 100644
--- a/src/features/package-profiles/types/PackageProfile.ts
+++ b/src/features/package-profiles/types/PackageProfile.ts
@@ -8,21 +8,10 @@ export interface PackageProfileConstraint extends Record<string, unknown> {
   version: string;
 }
 
-export interface PackageProfile extends Record<string, unknown> {
-  access_group: string;
-  all_computers: boolean;
-  computers: {
-    constrained: number[];
-    "non-compliant": number[];
-    pending: number[];
-  };
+export interface PackageProfile extends Profile {
+  computers: ComplianceInstanceCounts;
   constraints: PackageProfileConstraint[];
   creation_time: string;
-  description: string;
-  id: number;
   modification_time: string;
-  name: string;
-  tags: string[];
-  title: string;
   version: string;
 }
diff --git a/src/features/profiles/components/AddProfileButton/AddProfileButton.test.tsx b/src/features/profiles/components/AddProfileButton/AddProfileButton.test.tsx
new file mode 100644
index 000000000..aba41b5f3
--- /dev/null
+++ b/src/features/profiles/components/AddProfileButton/AddProfileButton.test.tsx
@@ -0,0 +1,98 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import { within } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { beforeEach, describe, expect, it, vi } from "vitest";
+import AddProfileButton from "./AddProfileButton";
+import usePageParams from "@/hooks/usePageParams";
+import useProfiles from "@/hooks/useProfiles";
+
+vi.mock("@/hooks/usePageParams", () => ({
+  default: vi.fn(),
+}));
+
+vi.mock("@/hooks/useProfiles", () => ({
+  default: vi.fn(),
+}));
+
+const mockCreatePageParamsSetter = vi.fn();
+const mockUsePageParams = vi.mocked(usePageParams);
+const mockUseProfiles = vi.mocked(useProfiles);
+
+describe("AddProfileButton", () => {
+  const openAddSidePanel = vi.fn();
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+    localStorage.clear();
+
+    mockCreatePageParamsSetter.mockReturnValue(openAddSidePanel);
+
+    mockUsePageParams.mockReturnValue({
+      createPageParamsSetter: mockCreatePageParamsSetter,
+    } as unknown as ReturnType<typeof usePageParams>);
+
+    mockUseProfiles.mockReturnValue({
+      isProfileLimitReached: false,
+    } as ReturnType<typeof useProfiles>);
+  });
+
+  it("displays specific appearance for scripts header", async () => {
+    renderWithProviders(<AddProfileButton isInsideScriptHeader />);
+
+    expect(
+      screen.getByRole("button", { name: /add profile/i }),
+    ).not.toHaveClass("p-button--positive");
+  });
+
+  it("opens add side panel for non-WSL type", async () => {
+    renderWithProviders(<AddProfileButton />);
+
+    await userEvent.click(screen.getByRole("button", { name: /add profile/i }));
+
+    expect(openAddSidePanel).toHaveBeenCalledTimes(1);
+  });
+
+  it("opens confirmation modal for WSL when not acknowledged", async () => {
+    renderWithProviders(<AddProfileButton />, undefined, "/profiles/wsl");
+
+    await userEvent.click(screen.getByRole("button", { name: /add profile/i }));
+
+    expect(
+      screen.getByText("WSL profiles is a beta feature"),
+    ).toBeInTheDocument();
+
+    const modal = screen.getByRole("dialog");
+    await userEvent.click(
+      within(modal).getByRole("button", { name: /add WSL profile/i }),
+    );
+
+    expect(openAddSidePanel).toHaveBeenCalledTimes(1);
+  });
+
+  it("skips modal for WSL when already acknowledged", async () => {
+    localStorage.setItem("_landscape_isWslPopupClosed", "true");
+
+    renderWithProviders(<AddProfileButton />, undefined, "/profiles/wsl");
+
+    await userEvent.click(screen.getByRole("button", { name: /add profile/i }));
+
+    expect(openAddSidePanel).toHaveBeenCalledTimes(1);
+    expect(
+      screen.queryByText("WSL profiles is a beta feature"),
+    ).not.toBeInTheDocument();
+  });
+
+  it("disables button when profile limit is reached", () => {
+    mockUseProfiles.mockReturnValue({
+      isProfileLimitReached: true,
+    } as ReturnType<typeof useProfiles>);
+
+    renderWithProviders(<AddProfileButton />);
+
+    const button = screen.getByRole("button", { name: /add profile/i });
+
+    expect(button).toHaveClass("p-button--positive");
+    expect(button).toHaveAttribute("aria-disabled", "true");
+  });
+});
diff --git a/src/features/profiles/components/AddProfileButton/AddProfileButton.tsx b/src/features/profiles/components/AddProfileButton/AddProfileButton.tsx
new file mode 100644
index 000000000..792318434
--- /dev/null
+++ b/src/features/profiles/components/AddProfileButton/AddProfileButton.tsx
@@ -0,0 +1,86 @@
+import { Button, ConfirmationModal, Icon } from "@canonical/react-components";
+import { type FC } from "react";
+import { useLocation } from "react-router";
+import useProfiles from "@/hooks/useProfiles";
+import usePageParams from "@/hooks/usePageParams";
+import { useBoolean } from "usehooks-ts";
+import { PROFILES_PATHS } from "@/libs/routes/profiles";
+
+const LOCAL_STORAGE_ITEM = "_landscape_isWslPopupClosed";
+
+interface AddProfileButtonProps {
+  readonly isInsideScriptHeader?: boolean;
+}
+
+const AddProfileButton: FC<AddProfileButtonProps> = ({
+  isInsideScriptHeader = false,
+}) => {
+  const { pathname } = useLocation();
+  const isWsl = pathname.includes(`/${PROFILES_PATHS.wsl}`);
+  const { createPageParamsSetter } = usePageParams();
+  const { isProfileLimitReached } = useProfiles();
+
+  const settings = isInsideScriptHeader
+    ? { className: "u-no-margin--bottom" }
+    : { appearance: "positive", light: true };
+
+  const { value: isModalRead, setTrue: readModal } = useBoolean(
+    !!localStorage.getItem(LOCAL_STORAGE_ITEM),
+  );
+
+  const {
+    value: isModalOpen,
+    setTrue: openModal,
+    setFalse: closeModal,
+  } = useBoolean();
+
+  const openAddSidePanel = createPageParamsSetter({
+    sidePath: ["add"],
+    profile: "",
+  });
+
+  const handleClick = () => {
+    if (isWsl && !isModalRead) {
+      openModal();
+    } else {
+      openAddSidePanel();
+    }
+  };
+
+  const handleConfirm = () => {
+    closeModal();
+    openAddSidePanel();
+    localStorage.setItem(LOCAL_STORAGE_ITEM, "true");
+    readModal();
+  };
+
+  return (
+    <>
+      <Button
+        type="button"
+        appearance={settings.appearance}
+        className={settings.className}
+        onClick={handleClick}
+        hasIcon
+        disabled={isProfileLimitReached}
+      >
+        <Icon name="plus" light={settings.light} />
+        <span>Add profile</span>
+      </Button>
+
+      {isModalOpen && (
+        <ConfirmationModal
+          close={closeModal}
+          title="WSL profiles is a beta feature"
+          onConfirm={handleConfirm}
+          confirmButtonLabel="Add WSL profile"
+          confirmButtonAppearance="positive"
+        >
+          <p>We are gathering feedback to improve this feature.</p>
+        </ConfirmationModal>
+      )}
+    </>
+  );
+};
+
+export default AddProfileButton;
diff --git a/src/features/profiles/components/AddProfileButton/index.ts b/src/features/profiles/components/AddProfileButton/index.ts
new file mode 100644
index 000000000..8f61446b3
--- /dev/null
+++ b/src/features/profiles/components/AddProfileButton/index.ts
@@ -0,0 +1 @@
+export { default } from "./AddProfileButton";
diff --git a/src/features/profiles/components/ProfileAssociatedInstancesLink/ProfileAssociatedInstancesLink.test.tsx b/src/features/profiles/components/ProfileAssociatedInstancesLink/ProfileAssociatedInstancesLink.test.tsx
new file mode 100644
index 000000000..cbf69bb60
--- /dev/null
+++ b/src/features/profiles/components/ProfileAssociatedInstancesLink/ProfileAssociatedInstancesLink.test.tsx
@@ -0,0 +1,163 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it } from "vitest";
+import ProfileAssociatedInstancesLink from "./ProfileAssociatedInstancesLink";
+import { profiles } from "@/tests/mocks/profiles";
+import { NO_DATA_TEXT } from "@/components/layout/NoData";
+
+const [profile] = profiles;
+
+const packageProfile = {
+  ...profile,
+  all_computers: true,
+  constraints: [],
+  computers: {
+    constrained: [1, 2, 3],
+    pending: [],
+    "non-compliant": [1, 2],
+  },
+};
+
+describe("ProfileAssociatedInstancesLink", () => {
+  it("renders loading state if isPending is true", () => {
+    renderWithProviders(
+      <ProfileAssociatedInstancesLink
+        count={4}
+        profile={profile}
+        query="script:1"
+        isPending
+      />,
+    );
+
+    expect(screen.getByRole("status")).toBeInTheDocument();
+  });
+
+  it("renders no data when profile has no associations", () => {
+    renderWithProviders(
+      <ProfileAssociatedInstancesLink
+        count={4}
+        profile={{ ...profile, tags: [] }}
+        query="script:1"
+      />,
+    );
+
+    expect(screen.getByText(NO_DATA_TEXT)).toBeInTheDocument();
+  });
+
+  it("renders no data for post-enrollment script profiles", () => {
+    const scriptProfile = {
+      ...profile,
+      script_id: 123,
+      trigger: {
+        trigger_type: "event",
+        event_type: "post_enrollment",
+      },
+    };
+
+    renderWithProviders(
+      <ProfileAssociatedInstancesLink
+        count={4}
+        profile={scriptProfile}
+        query="script:1"
+      />,
+    );
+
+    expect(screen.getByText(NO_DATA_TEXT)).toBeInTheDocument();
+  });
+
+  it("renders 0 instances text when association count is zero", () => {
+    renderWithProviders(
+      <ProfileAssociatedInstancesLink
+        count={0}
+        profile={profile}
+        query="script:1"
+      />,
+    );
+
+    expect(screen.getByText("0 instances")).toBeInTheDocument();
+  });
+
+  it("renders link with formatted standard query for general association", () => {
+    renderWithProviders(
+      <ProfileAssociatedInstancesLink
+        count={2}
+        profile={profile}
+        query="PACKAGE:1"
+        isGeneralAssociation
+      />,
+    );
+
+    expect(screen.getByRole("link", { name: "2 instances" })).toHaveAttribute(
+      "href",
+      expect.stringContaining("profile%3Apackage%3A1"),
+    );
+  });
+
+  it("renders link with special query for package noncompliant", () => {
+    renderWithProviders(
+      <ProfileAssociatedInstancesLink
+        count={2}
+        profile={packageProfile}
+        query="package:1:noncompliant"
+      />,
+    );
+
+    expect(screen.getByRole("link", { name: "2 instances" })).toHaveAttribute(
+      "href",
+      expect.stringContaining("id%3A1+OR+id%3A2"),
+    );
+  });
+
+  it("renders link with special query for package compliant", () => {
+    renderWithProviders(
+      <ProfileAssociatedInstancesLink
+        count={1}
+        profile={packageProfile}
+        query="package:1:compliant"
+      />,
+    );
+
+    expect(screen.getByRole("link", { name: "1 instance" })).toHaveAttribute(
+      "href",
+      expect.stringContaining("id%3A3"),
+    );
+  });
+
+  it("renders All instances text for profile with all computers in general association", () => {
+    renderWithProviders(
+      <ProfileAssociatedInstancesLink
+        count={2}
+        profile={{ ...profile, all_computers: true }}
+        query="package:1"
+        isGeneralAssociation
+      />,
+    );
+
+    expect(screen.getByRole("link", { name: "All instances" })).toHaveAttribute(
+      "href",
+      expect.stringContaining("profile%3Apackage%3A1"),
+    );
+  });
+
+  it("opens side panel for WSL noncompliant query", async () => {
+    const wslProfile = {
+      ...profile,
+      image_name: "ubuntu-image",
+    };
+
+    renderWithProviders(
+      <ProfileAssociatedInstancesLink
+        count={3}
+        profile={wslProfile}
+        query="wsl:1:noncompliant"
+      />,
+    );
+
+    await userEvent.click(screen.getByRole("button", { name: "3 instances" }));
+
+    expect(
+      screen.getByText("Instances not compliant with Profile One"),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/profiles/components/ProfileAssociatedInstancesLink/ProfileAssociatedInstancesLink.tsx b/src/features/profiles/components/ProfileAssociatedInstancesLink/ProfileAssociatedInstancesLink.tsx
new file mode 100644
index 000000000..a7839e071
--- /dev/null
+++ b/src/features/profiles/components/ProfileAssociatedInstancesLink/ProfileAssociatedInstancesLink.tsx
@@ -0,0 +1,100 @@
+import LoadingState from "@/components/layout/LoadingState";
+import StaticLink from "@/components/layout/StaticLink";
+import { WslProfileNonCompliantInstancesList } from "@/features/wsl-profiles";
+import { ROUTES } from "@/libs/routes";
+import { pluralizeWithCount } from "@/utils/_helpers";
+import { Button } from "@canonical/react-components";
+import { Suspense, type FC } from "react";
+import type { Profile } from "../../types";
+import {
+  hasAssociations,
+  isPackageProfile,
+  isPostEnrollmentScriptProfile,
+  isWslProfile,
+} from "../../helpers";
+import useSidePanel from "@/hooks/useSidePanel";
+import NoData from "@/components/layout/NoData";
+
+interface ProfileAssociatedInstancesLinkProps {
+  readonly count: number;
+  readonly profile: Profile;
+  readonly query: string;
+  readonly isPending?: boolean;
+  readonly isGeneralAssociation?: boolean;
+}
+
+const ProfileAssociatedInstancesLink: FC<
+  ProfileAssociatedInstancesLinkProps
+> = ({
+  count,
+  profile,
+  query,
+  isPending = false,
+  isGeneralAssociation = false,
+}) => {
+  const { setSidePanelContent } = useSidePanel();
+
+  if (isPending) {
+    return <LoadingState inline />;
+  }
+
+  const hasNoAssociations =
+    !hasAssociations(profile) || isPostEnrollmentScriptProfile(profile);
+
+  if (hasNoAssociations) {
+    return <NoData />;
+  }
+
+  if (count === 0) {
+    return <>0 instances</>;
+  }
+
+  const text =
+    isGeneralAssociation && profile.all_computers
+      ? "All instances"
+      : pluralizeWithCount(count, "instance");
+
+  const getPackageComplianceIds = () => {
+    if (isPackageProfile(profile) && !isGeneralAssociation) {
+      return query.endsWith(":noncompliant")
+        ? profile.computers["non-compliant"]
+        : profile.computers.constrained.filter(
+            (id) => !profile.computers["non-compliant"].includes(id),
+          );
+    }
+  };
+
+  const formattedQuery =
+    getPackageComplianceIds()
+      ?.map((id) => `id:${id}`)
+      .join(" OR ") ?? `profile:${query.toLowerCase()}`;
+
+  if (isWslProfile(profile) && query.endsWith(":noncompliant")) {
+    return (
+      <Button
+        className="u-no-padding--top u-no-margin--bottom"
+        type="button"
+        appearance="link"
+        onClick={() => {
+          setSidePanelContent(
+            `Instances not compliant with ${profile.title}`,
+            <Suspense fallback={<LoadingState />}>
+              <WslProfileNonCompliantInstancesList wslProfile={profile} />
+            </Suspense>,
+            "large",
+          );
+        }}
+      >
+        {text}
+      </Button>
+    );
+  }
+
+  return (
+    <StaticLink to={ROUTES.instances.root({ query: formattedQuery })}>
+      {text}
+    </StaticLink>
+  );
+};
+
+export default ProfileAssociatedInstancesLink;
diff --git a/src/features/profiles/components/ProfileAssociatedInstancesLink/index.ts b/src/features/profiles/components/ProfileAssociatedInstancesLink/index.ts
new file mode 100644
index 000000000..03872d982
--- /dev/null
+++ b/src/features/profiles/components/ProfileAssociatedInstancesLink/index.ts
@@ -0,0 +1 @@
+export { default } from "./ProfileAssociatedInstancesLink";
diff --git a/src/features/profiles/components/ProfilesContainer/ProfilesContainer.test.tsx b/src/features/profiles/components/ProfilesContainer/ProfilesContainer.test.tsx
new file mode 100644
index 000000000..c45c45e45
--- /dev/null
+++ b/src/features/profiles/components/ProfilesContainer/ProfilesContainer.test.tsx
@@ -0,0 +1,114 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import ProfilesContainer from "./ProfilesContainer";
+import { ProfileTypes } from "../../helpers";
+import useProfiles from "@/hooks/useProfiles";
+import { profiles as profileList } from "@/tests/mocks/profiles";
+import type { ComponentProps } from "react";
+
+vi.mock("@/hooks/useProfiles", () => ({
+  default: vi.fn(),
+}));
+
+const mockUseProfiles = vi.mocked(useProfiles);
+
+const props: ComponentProps<typeof ProfilesContainer> = {
+  type: ProfileTypes.security,
+  profiles: profileList,
+  isPending: false,
+};
+
+describe("ProfilesContainer", () => {
+  beforeEach(() => {
+    mockUseProfiles.mockReturnValue({
+      isProfileLimitReached: false,
+    } as unknown as ReturnType<typeof useProfiles>);
+  });
+
+  it("renders loading state when pending", () => {
+    renderWithProviders(<ProfilesContainer {...props} isPending />);
+
+    expect(screen.getByRole("status")).toBeInTheDocument();
+  });
+
+  it("renders empty state when no profiles and no search", () => {
+    renderWithProviders(
+      <ProfilesContainer
+        {...props}
+        type={ProfileTypes.package}
+        profiles={[]}
+      />,
+    );
+
+    expect(
+      screen.getByText("You haven't added any package profiles yet."),
+    ).toBeInTheDocument();
+  });
+
+  it("renders empty table when no profiles with search", () => {
+    renderWithProviders(
+      <ProfilesContainer {...props} profiles={[]} />,
+      undefined,
+      "/?search=search",
+    );
+
+    expect(
+      screen.getByText(
+        "No security profiles found according to your search parameters.",
+      ),
+    ).toBeInTheDocument();
+  });
+
+  it("renders header and list when data exists", async () => {
+    renderWithProviders(<ProfilesContainer {...props} />);
+
+    expect(await screen.findByRole("searchbox")).toBeInTheDocument();
+    expect(
+      screen.getByRole("button", {
+        name: 'Open "Profile One" profile details',
+      }),
+    ).toBeInTheDocument();
+    expect(screen.getByText("Profile Two")).toBeInTheDocument();
+    expect(screen.getByText("Profile Three")).toBeInTheDocument();
+  });
+
+  it("renders pagination when count exists", () => {
+    renderWithProviders(<ProfilesContainer {...props} profilesCount={10} />);
+
+    expect(screen.getByText("Showing 3 of 10 results")).toBeInTheDocument();
+  });
+
+  it("shows security profile limit notification when limit is reached", () => {
+    mockUseProfiles.mockReturnValue({
+      isProfileLimitReached: true,
+      profileLimit: 5,
+    } as ReturnType<typeof useProfiles>);
+
+    renderWithProviders(<ProfilesContainer {...props} />);
+
+    expect(screen.getByText("Profile limit reached:")).toBeInTheDocument();
+    expect(
+      screen.getByText(
+        /You've reached the limit of 5 active security profiles\. You must archive/i,
+      ),
+    ).toBeInTheDocument();
+  });
+
+  it("shows wsl profile limit notification when limit is reached", () => {
+    mockUseProfiles.mockReturnValue({
+      isProfileLimitReached: true,
+      profileLimit: 100,
+    } as ReturnType<typeof useProfiles>);
+
+    renderWithProviders(
+      <ProfilesContainer {...props} type={ProfileTypes.wsl} />,
+    );
+
+    expect(
+      screen.getByText(
+        /You've reached the limit of 100 active wsl profiles\. You must remove/i,
+      ),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/profiles/components/ProfilesContainer/ProfilesContainer.tsx b/src/features/profiles/components/ProfilesContainer/ProfilesContainer.tsx
new file mode 100644
index 000000000..962e1d646
--- /dev/null
+++ b/src/features/profiles/components/ProfilesContainer/ProfilesContainer.tsx
@@ -0,0 +1,67 @@
+import LoadingState from "@/components/layout/LoadingState";
+import usePageParams from "@/hooks/usePageParams";
+import { type FC } from "react";
+import ProfilesHeader from "../ProfilesHeader";
+import ProfilesList from "../ProfilesList";
+import ProfilesEmptyState from "../ProfilesEmptyState";
+import type { Profile } from "../../types";
+import { TablePagination } from "@/components/layout/TablePagination";
+import { Notification } from "@canonical/react-components";
+import { canArchiveProfile, type ProfileTypes } from "../../helpers";
+import { useBoolean } from "usehooks-ts";
+import useProfiles from "@/hooks/useProfiles";
+
+interface ProfilesContainerProps {
+  readonly type: ProfileTypes;
+  readonly profiles: Profile[];
+  readonly isPending: boolean;
+  readonly profilesCount?: number;
+}
+const ProfilesContainer: FC<ProfilesContainerProps> = ({
+  type,
+  profiles,
+  isPending,
+  profilesCount,
+}) => {
+  const { isProfileLimitReached, profileLimit } = useProfiles();
+  const { search } = usePageParams();
+  const { value: isNotificationVisible, setFalse: hideNotification } =
+    useBoolean(true);
+
+  if (isPending) {
+    return <LoadingState />;
+  }
+
+  if (profiles.length === 0 && !search) {
+    return <ProfilesEmptyState type={type} />;
+  }
+
+  const removalType = canArchiveProfile(type) ? "archive" : "remove";
+
+  return (
+    <>
+      <ProfilesHeader type={type} />
+      {isNotificationVisible && isProfileLimitReached && (
+        <Notification
+          severity="caution"
+          inline
+          title="Profile limit reached:"
+          onDismiss={hideNotification}
+        >
+          You&apos;ve reached the limit of {profileLimit} active {type}{" "}
+          profiles. You must {removalType} an active profile to be able to add a
+          new one.
+        </Notification>
+      )}
+      <ProfilesList profiles={profiles} type={type} />
+      {!!profilesCount && (
+        <TablePagination
+          totalItems={profilesCount}
+          currentItemCount={profiles.length}
+        />
+      )}
+    </>
+  );
+};
+
+export default ProfilesContainer;
diff --git a/src/features/profiles/components/ProfilesContainer/index.ts b/src/features/profiles/components/ProfilesContainer/index.ts
new file mode 100644
index 000000000..b73a928ce
--- /dev/null
+++ b/src/features/profiles/components/ProfilesContainer/index.ts
@@ -0,0 +1 @@
+export { default } from "./ProfilesContainer";
diff --git a/src/features/profiles/components/ProfilesEmptyState/ProfilesEmptyState.test.tsx b/src/features/profiles/components/ProfilesEmptyState/ProfilesEmptyState.test.tsx
new file mode 100644
index 000000000..6251ab3b8
--- /dev/null
+++ b/src/features/profiles/components/ProfilesEmptyState/ProfilesEmptyState.test.tsx
@@ -0,0 +1,37 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import ProfilesEmptyState from "./ProfilesEmptyState";
+import { ProfileTypes } from "../../helpers";
+
+describe("ProfilesEmptyState", () => {
+  it.each([
+    [ProfileTypes.package],
+    [ProfileTypes.repository],
+    [ProfileTypes.reboot],
+    [ProfileTypes.removal],
+    [ProfileTypes.script],
+    [ProfileTypes.security],
+    [ProfileTypes.upgrade],
+    [ProfileTypes.wsl],
+  ])("renders package message without external link", (type) => {
+    renderWithProviders(<ProfilesEmptyState type={type} />);
+
+    expect(
+      screen.getByText(`You haven't added any ${type} profiles yet.`),
+    ).toBeInTheDocument();
+
+    expect(
+      screen.queryByRole("link", {
+        name: `How to manage ${type} profiles in Landscape`,
+      }),
+    ).toHaveAttribute(
+      "href",
+      expect.stringContaining(`${type.toLocaleLowerCase()}-profile`),
+    );
+
+    expect(screen.getByRole("button", { name: "Add profile" })).toHaveIcon(
+      "plus",
+    );
+  });
+});
diff --git a/src/features/profiles/components/ProfilesEmptyState/ProfilesEmptyState.tsx b/src/features/profiles/components/ProfilesEmptyState/ProfilesEmptyState.tsx
new file mode 100644
index 000000000..da5a2d72f
--- /dev/null
+++ b/src/features/profiles/components/ProfilesEmptyState/ProfilesEmptyState.tsx
@@ -0,0 +1,33 @@
+import EmptyState from "@/components/layout/EmptyState";
+import type { FC } from "react";
+import AddProfileButton from "../AddProfileButton";
+import { Link } from "@canonical/react-components";
+import { getLink, getMessage } from "./helpers";
+import type { ProfileTypes } from "../../helpers";
+
+interface ProfilesEmptyStateProps {
+  readonly type: ProfileTypes;
+}
+
+const ProfilesEmptyState: FC<ProfilesEmptyStateProps> = ({ type }) => {
+  const message = getMessage(type);
+  const link = getLink(type);
+
+  return (
+    <EmptyState
+      body={
+        <>
+          <p>{message}</p>
+          <Link href={link} target="_blank" rel="nofollow noopener noreferrer">
+            How to manage {type} profiles in Landscape
+          </Link>
+        </>
+      }
+      cta={[<AddProfileButton key="add" />]}
+      title={`You haven't added any ${type} profiles yet.`}
+      size="large"
+    />
+  );
+};
+
+export default ProfilesEmptyState;
diff --git a/src/features/profiles/components/ProfilesEmptyState/helpers.ts b/src/features/profiles/components/ProfilesEmptyState/helpers.ts
new file mode 100644
index 000000000..ee118546f
--- /dev/null
+++ b/src/features/profiles/components/ProfilesEmptyState/helpers.ts
@@ -0,0 +1,35 @@
+import { ProfileTypes } from "../../helpers";
+
+export const getMessage = (type: ProfileTypes) => {
+  switch (type) {
+    case ProfileTypes.package:
+      return "Package profiles let you manage how packages should exist on associated instances by defining constraints such as dependencies or conflicts between packages.";
+    case ProfileTypes.repository:
+      return "Repository profiles let you define which software repositories are available to associated instances, controlling where packages and updates are retrieved from.";
+    case ProfileTypes.reboot:
+      return "Reboot profiles let you schedule and manage automatic reboots across associated instances. Regular reboots keep your system healthy and secure by applying the latest updates. They also help maintain Livepatch coverage.";
+    case ProfileTypes.removal:
+      return "Removal profiles let you automatically remove client instances from Landscape that haven't communicated with the Landscape server in a specified number of days. This helps Landscape keep license seats open and avoid tracking stale or retired data for long periods of time.";
+    case ProfileTypes.script:
+      return "Script profiles let you automate your script runs based on triggers. Triggers can be either a recurring schedule, on a set date, or after enrollment.";
+    case ProfileTypes.security:
+      return "Add a security profile to ensure security and compliance across your instances. Security profile audits aggregate audit results over time and in bulk, helping you align with tailored security benchmarks, run scheduled audits, and generate detailed audits for your estate.";
+    case ProfileTypes.upgrade:
+      return "Upgrade profiles let you schedule when upgrades should be automatically installed on associated instances.";
+    case ProfileTypes.wsl:
+      return "WSL profiles let you define configuration settings for WSL instances created on associated Windows hosts. You must have a Windows host machine registered with Landscape before making any WSL instances.";
+  }
+};
+
+export const getLink = (type: ProfileTypes) => {
+  switch (type) {
+    case ProfileTypes.repository:
+      return "https://documentation.ubuntu.com/landscape/how-to-guides/repository-mirrors/manage-repositories-in-the-web-portal/#create-a-repository-profile-and-associate-client-machines-to-the-profile";
+    case ProfileTypes.security:
+      return "https://documentation.ubuntu.com/landscape/how-to-guides/security/use-security-profiles/#how-to-web-portal-use-security-profiles";
+    case ProfileTypes.wsl:
+      return "https://documentation.ubuntu.com/landscape/how-to-guides/wsl-integration/use-wsl-profiles/#how-to-use-wsl-profiles";
+    default:
+      return `https://documentation.ubuntu.com/landscape/how-to-guides/web-portal/web-portal-24-04-or-later/use-profiles/#${type}-profiles`;
+  }
+};
diff --git a/src/features/profiles/components/ProfilesEmptyState/index.ts b/src/features/profiles/components/ProfilesEmptyState/index.ts
new file mode 100644
index 000000000..7c1b08d0c
--- /dev/null
+++ b/src/features/profiles/components/ProfilesEmptyState/index.ts
@@ -0,0 +1 @@
+export { default } from "./ProfilesEmptyState";
diff --git a/src/features/profiles/components/ProfilesHeader/ProfilesHeader.module.scss b/src/features/profiles/components/ProfilesHeader/ProfilesHeader.module.scss
new file mode 100644
index 000000000..a970f927b
--- /dev/null
+++ b/src/features/profiles/components/ProfilesHeader/ProfilesHeader.module.scss
@@ -0,0 +1,11 @@
+@import "vanilla-framework/scss/settings_spacing";
+
+.actions {
+  display: flex;
+  justify-content: space-between;
+}
+
+.filters {
+  column-gap: $sph--small;
+  display: flex;
+}
diff --git a/src/features/profiles/components/ProfilesHeader/ProfilesHeader.test.tsx b/src/features/profiles/components/ProfilesHeader/ProfilesHeader.test.tsx
new file mode 100644
index 000000000..710257e37
--- /dev/null
+++ b/src/features/profiles/components/ProfilesHeader/ProfilesHeader.test.tsx
@@ -0,0 +1,55 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import ProfilesHeader from "./ProfilesHeader";
+import { ProfileTypes } from "../../helpers";
+import userEvent from "@testing-library/user-event";
+
+describe("ProfilesHeader", () => {
+  it("renders script status filter and add button", async () => {
+    renderWithProviders(<ProfilesHeader type={ProfileTypes.script} />);
+
+    expect(screen.getByRole("searchbox")).toBeInTheDocument();
+    expect(
+      screen.queryByRole("button", { name: "Pass rate" }),
+    ).not.toBeInTheDocument();
+    expect(screen.getByText("Add profile")).toBeInTheDocument();
+
+    const statusFilter = screen.getByRole("button", { name: "Status" });
+    await userEvent.click(statusFilter);
+
+    const archivedOption = screen.getByRole("button", { name: "Archived" });
+    await userEvent.click(archivedOption);
+    expect(screen.getByText("Status: Archived")).toBeInTheDocument();
+  });
+
+  it("renders security status filter and pass rate filter", async () => {
+    renderWithProviders(<ProfilesHeader type={ProfileTypes.security} />);
+
+    expect(screen.getByRole("searchbox")).toBeInTheDocument();
+    expect(screen.getByRole("button", { name: "Status" })).toBeInTheDocument();
+    expect(screen.queryByText(/add/i)).not.toBeInTheDocument();
+
+    const passRateFilter = screen.getByRole("button", { name: "Pass rate" });
+    await userEvent.click(passRateFilter);
+
+    const passRateFromInput = screen.getByRole("spinbutton", { name: "From" });
+    await userEvent.type(passRateFromInput, "50{enter}");
+    expect(screen.getByText("From pass rate: 50%")).toBeInTheDocument();
+  });
+
+  it("renders only search chips for non-archivable profile types", async () => {
+    renderWithProviders(<ProfilesHeader type={ProfileTypes.package} />);
+
+    expect(
+      screen.queryByRole("button", { name: "Status" }),
+    ).not.toBeInTheDocument();
+    expect(
+      screen.queryByRole("button", { name: "Pass rate" }),
+    ).not.toBeInTheDocument();
+
+    const search = screen.getByRole("searchbox");
+    await userEvent.type(search, "search{enter}");
+    expect(screen.getByText("Search: search")).toBeInTheDocument();
+  });
+});
diff --git a/src/features/profiles/components/ProfilesHeader/ProfilesHeader.tsx b/src/features/profiles/components/ProfilesHeader/ProfilesHeader.tsx
new file mode 100644
index 000000000..89b7931b5
--- /dev/null
+++ b/src/features/profiles/components/ProfilesHeader/ProfilesHeader.tsx
@@ -0,0 +1,70 @@
+import type { FC } from "react";
+import HeaderWithSearch from "@/components/form/HeaderWithSearch";
+import { PageParamFilter, TableFilterChips } from "@/components/filter";
+import PassRateFilter from "@/components/filter/PassRateFilter";
+import type { FilterKey } from "@/components/filter/TableFilterChips/types";
+import classes from "./ProfilesHeader.module.scss";
+import { STATUS_OPTIONS } from "./constants";
+import { canArchiveProfile, ProfileTypes } from "../../helpers";
+import AddProfileButton from "../AddProfileButton";
+
+interface ProfilesHeaderProps {
+  readonly type: ProfileTypes;
+}
+
+const ProfilesHeader: FC<ProfilesHeaderProps> = ({ type }) => {
+  const hasFilters = canArchiveProfile(type);
+
+  const getFilters = (): FilterKey[] => {
+    switch (type) {
+      case ProfileTypes.script:
+        return ["search", "status"];
+      case ProfileTypes.security:
+        return ["status", "search", "passRateFrom", "passRateTo"];
+      default:
+        return ["search"];
+    }
+  };
+
+  const getActionsClass = () => {
+    switch (type) {
+      case ProfileTypes.script:
+        return classes.actions;
+      case ProfileTypes.security:
+        return classes.filters;
+      default:
+        return undefined;
+    }
+  };
+
+  return (
+    <>
+      <HeaderWithSearch
+        actions={
+          <div className={getActionsClass()}>
+            {hasFilters && (
+              <>
+                <PageParamFilter
+                  pageParamKey="status"
+                  label="Status"
+                  options={STATUS_OPTIONS}
+                />
+                {type === ProfileTypes.script ? (
+                  <AddProfileButton isInsideScriptHeader={true} />
+                ) : (
+                  <PassRateFilter />
+                )}
+              </>
+            )}
+          </div>
+        }
+      />
+      <TableFilterChips
+        filtersToDisplay={getFilters()}
+        statusOptions={hasFilters ? STATUS_OPTIONS : undefined}
+      />
+    </>
+  );
+};
+
+export default ProfilesHeader;
diff --git a/src/features/profiles/components/ProfilesHeader/constants.ts b/src/features/profiles/components/ProfilesHeader/constants.ts
new file mode 100644
index 000000000..e5321d701
--- /dev/null
+++ b/src/features/profiles/components/ProfilesHeader/constants.ts
@@ -0,0 +1,7 @@
+import type { SelectOption } from "@/types/SelectOption";
+
+export const STATUS_OPTIONS: SelectOption[] = [
+  { label: "All", value: "all" },
+  { label: "Active", value: "" },
+  { label: "Archived", value: "archived" },
+];
diff --git a/src/features/profiles/components/ProfilesHeader/index.ts b/src/features/profiles/components/ProfilesHeader/index.ts
new file mode 100644
index 000000000..a47e8df20
--- /dev/null
+++ b/src/features/profiles/components/ProfilesHeader/index.ts
@@ -0,0 +1 @@
+export { default } from "./ProfilesHeader";
diff --git a/src/features/profiles/components/ProfilesList/ProfilesList.test.tsx b/src/features/profiles/components/ProfilesList/ProfilesList.test.tsx
new file mode 100644
index 000000000..bc603c76e
--- /dev/null
+++ b/src/features/profiles/components/ProfilesList/ProfilesList.test.tsx
@@ -0,0 +1,214 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen, within } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import ProfilesList from "./ProfilesList";
+import { ProfileTypes } from "../../helpers";
+import { profiles } from "@/tests/mocks/profiles";
+import { NO_DATA_TEXT } from "@/components/layout/NoData";
+import { securityProfiles } from "@/tests/mocks/securityProfiles";
+import { capitalize } from "@/utils/_helpers";
+import { wslProfiles } from "@/tests/mocks/wsl-profiles";
+
+describe("ProfilesList", () => {
+  it.each([
+    [
+      ProfileTypes.repository,
+      ["Profile name", "Access group", "Associated", "Actions"],
+    ],
+    [
+      ProfileTypes.package,
+      [
+        "Profile name",
+        "Access group",
+        "Associated",
+        "Compliant",
+        "Not compliant",
+        "Actions",
+      ],
+    ],
+    [
+      ProfileTypes.reboot,
+      ["Profile name", "Access group", "Associated", "Next restart", "Actions"],
+    ],
+    [
+      ProfileTypes.removal,
+      [
+        "Profile name",
+        "Access group",
+        "Associated",
+        "Removal timeframe",
+        "Actions",
+      ],
+    ],
+    [
+      ProfileTypes.script,
+      [
+        "Profile name",
+        "Status",
+        "Access group",
+        "Associated",
+        "Last run",
+        "Trigger",
+        "Actions",
+      ],
+    ],
+    [
+      ProfileTypes.security,
+      [
+        "Profile name",
+        "Status",
+        "Access group",
+        "Associated",
+        "Pass rate",
+        "Last runSchedule",
+        "Mode",
+        "Actions",
+      ],
+    ],
+    [
+      ProfileTypes.upgrade,
+      ["Profile name", "Access group", "Associated", "Actions"],
+    ],
+    [
+      ProfileTypes.wsl,
+      [
+        "Profile name",
+        "Access group",
+        "Associated",
+        "Compliant",
+        "Not compliant",
+        "Actions",
+      ],
+    ],
+  ])("renders table headers for %s profile", async (type, expected) => {
+    renderWithProviders(<ProfilesList profiles={profiles} type={type} />);
+
+    const headers = await screen.findAllByRole("columnheader");
+    expect(headers.length).toEqual(expected.length);
+
+    for (let i = 0; i < expected.length; i++) {
+      expect(headers[i]).toHaveTextContent(expected[i] ?? "invalid");
+    }
+  });
+
+  it("filters rows based on search query if no api search", () => {
+    renderWithProviders(
+      <ProfilesList profiles={profiles} type={ProfileTypes.repository} />,
+      undefined,
+      "/?search=searchText",
+    );
+
+    expect(
+      screen.getByText(
+        "No repository profiles found according to your search parameters.",
+      ),
+    ).toBeInTheDocument();
+  });
+
+  it("renders rows with security profile data", async () => {
+    const selectedProfiles = securityProfiles.slice(0, 2);
+    renderWithProviders(
+      <ProfilesList profiles={selectedProfiles} type={ProfileTypes.security} />,
+    );
+
+    for (const profile of selectedProfiles) {
+      const row = screen.getByRole("row", {
+        name: (name) => name.includes(profile.title),
+      });
+      expect(
+        within(row).getByRole("button", {
+          name: `Open "${profile.title}" profile details`,
+        }),
+      ).toBeInTheDocument();
+
+      expect(
+        within(row).getByText(capitalize(profile.status)),
+      ).toBeInTheDocument();
+
+      expect(await within(row).findByText("Global access")).toBeInTheDocument();
+
+      if (profile.associated_instances) {
+        expect(
+          within(row).getByRole("link", {
+            name: `${profile.associated_instances.toLocaleString()} instances`,
+          }),
+        ).toBeInTheDocument();
+      }
+
+      if (profile.last_run_results.timestamp) {
+        expect(
+          within(row).getByText(profile.last_run_results.passing + " passed"),
+        ).toBeInTheDocument();
+        expect(
+          within(row).getByText(profile.last_run_results.failing + " failed"),
+        ).toBeInTheDocument();
+      }
+
+      const lastRunSchedule = within(row).getByRole("cell", {
+        name: `Last run for ${profile.title} profileSchedule for ${profile.title} profile`,
+      });
+      expect(
+        within(lastRunSchedule).getByText(
+          profile.last_run_results.timestamp
+            ? "May 15, 2024, 15:47"
+            : NO_DATA_TEXT,
+        ),
+      ).toBeInTheDocument();
+      expect(
+        within(lastRunSchedule).getByText(
+          profile.schedule.includes("COUNT=1") ? "On a date" : "Recurring",
+        ),
+      ).toBeInTheDocument();
+
+      expect(
+        within(row).getByText(
+          profile.mode === "audit" ? "Audit only" : "Fix, restart, audit",
+        ),
+      );
+
+      expect(
+        within(row).getByRole("button", {
+          name: `"${profile.title}" profile actions`,
+        }),
+      ).toBeInTheDocument();
+    }
+  });
+
+  it("renders rows with wsl profile data", async () => {
+    renderWithProviders(
+      <ProfilesList profiles={wslProfiles} type={ProfileTypes.wsl} />,
+    );
+
+    for (const profile of wslProfiles) {
+      const row = await screen.findByRole("row", {
+        name: (name) => name.includes(profile.title),
+      });
+      const associatedCount = profile.computers.constrained.length;
+      const countText = profile.all_computers
+        ? "All"
+        : associatedCount.toLocaleString();
+      expect(
+        within(row).getByRole("link", {
+          name: `${countText} instances`,
+        }),
+      ).toBeInTheDocument();
+
+      const count = associatedCount - profile.computers["non-compliant"].length;
+      if (count) {
+        expect(
+          within(row).getByRole("link", {
+            name: `${count} instances`,
+          }),
+        ).toBeInTheDocument();
+      }
+
+      if (profile.computers["non-compliant"].length) {
+        expect(
+          within(row).getByRole("button", {
+            name: `1 instance`,
+          }),
+        ).toBeInTheDocument();
+      }
+    }
+  });
+});
diff --git a/src/features/profiles/components/ProfilesList/ProfilesList.tsx b/src/features/profiles/components/ProfilesList/ProfilesList.tsx
new file mode 100644
index 000000000..d771e194f
--- /dev/null
+++ b/src/features/profiles/components/ProfilesList/ProfilesList.tsx
@@ -0,0 +1,96 @@
+import ResponsiveTable from "@/components/layout/ResponsiveTable";
+import usePageParams from "@/hooks/usePageParams";
+import useRoles from "@/hooks/useRoles";
+import type { FC } from "react";
+import { useMemo } from "react";
+import type { Profile } from "../../types";
+import type { Column } from "react-table";
+import {
+  getComplianceColumns,
+  getGeneralColumns,
+  getRebootColumn,
+  getRemovalColumn,
+  getScriptColumns,
+  getSecurityColumns,
+  getStatusColumn,
+} from "./helpers";
+import {
+  canArchiveProfile,
+  hasApiSearch,
+  hasComplianceColumns,
+  ProfileTypes,
+} from "../../helpers";
+import { useOpenProfileSidePanel } from "../../hooks/useOpenProfileSidePanel";
+
+interface ProfilesListProps {
+  readonly profiles: Profile[];
+  readonly type: ProfileTypes;
+}
+
+const ProfilesList: FC<ProfilesListProps> = ({ profiles, type }) => {
+  const { search } = usePageParams();
+  const { getAccessGroupQuery } = useRoles();
+
+  const { data: getAccessGroupQueryResult } = getAccessGroupQuery();
+
+  const openProfileSidePanel = useOpenProfileSidePanel();
+
+  const filteredProfiles = useMemo(() => {
+    if (!search || hasApiSearch(type)) {
+      return profiles;
+    }
+
+    return profiles.filter(({ title }) =>
+      title.toLowerCase().includes(search.toLowerCase()),
+    );
+  }, [profiles, search, type]);
+
+  const columns = useMemo<Column<Profile>[]>(() => {
+    const { name, accessGroup, associated, actions } = getGeneralColumns(
+      type,
+      openProfileSidePanel,
+      getAccessGroupQueryResult,
+    );
+    const cols = [name];
+
+    if (canArchiveProfile(type)) {
+      cols.push(getStatusColumn());
+    }
+
+    cols.push(accessGroup, associated);
+
+    if (hasComplianceColumns(type)) {
+      cols.push(...getComplianceColumns(type));
+    }
+
+    if (type === ProfileTypes.security) {
+      cols.push(...getSecurityColumns());
+    }
+
+    if (type === ProfileTypes.script) {
+      cols.push(...getScriptColumns());
+    }
+
+    if (type === ProfileTypes.reboot) {
+      cols.push(getRebootColumn());
+    }
+
+    if (type === ProfileTypes.removal) {
+      cols.push(getRemovalColumn());
+    }
+
+    cols.push(actions);
+
+    return cols;
+  }, [getAccessGroupQueryResult, openProfileSidePanel, type]);
+
+  return (
+    <ResponsiveTable
+      columns={columns}
+      data={filteredProfiles}
+      emptyMsg={`No ${type} profiles found according to your search parameters.`}
+    />
+  );
+};
+
+export default ProfilesList;
diff --git a/src/features/profiles/components/ProfilesList/components/AssociatedInstancesCell/AssociatedInstancesCell.tsx b/src/features/profiles/components/ProfilesList/components/AssociatedInstancesCell/AssociatedInstancesCell.tsx
new file mode 100644
index 000000000..a510c2be3
--- /dev/null
+++ b/src/features/profiles/components/ProfilesList/components/AssociatedInstancesCell/AssociatedInstancesCell.tsx
@@ -0,0 +1,29 @@
+import type { Profile } from "../../../../types";
+import ProfileAssociatedInstancesLink from "../../../ProfileAssociatedInstancesLink";
+import { useGetProfileAssociatedCount } from "../../../../hooks/useGetProfileAssociatedCount";
+import type { ProfileTypes } from "../../../../helpers";
+
+interface AssociatedInstancesCellProps {
+  readonly profile: Profile;
+  readonly type: ProfileTypes;
+}
+
+function AssociatedInstancesCell({
+  profile,
+  type,
+}: AssociatedInstancesCellProps) {
+  const { associatedCount, isGettingInstances } =
+    useGetProfileAssociatedCount(profile);
+
+  return (
+    <ProfileAssociatedInstancesLink
+      profile={profile}
+      count={associatedCount}
+      query={`${type}:${profile.id}`}
+      isPending={isGettingInstances}
+      isGeneralAssociation
+    />
+  );
+}
+
+export default AssociatedInstancesCell;
diff --git a/src/features/profiles/components/ProfilesList/components/AssociatedInstancesCell/index.ts b/src/features/profiles/components/ProfilesList/components/AssociatedInstancesCell/index.ts
new file mode 100644
index 000000000..dc32306cf
--- /dev/null
+++ b/src/features/profiles/components/ProfilesList/components/AssociatedInstancesCell/index.ts
@@ -0,0 +1 @@
+export { default } from "./AssociatedInstancesCell";
diff --git a/src/features/profiles/components/ProfilesList/components/ProfilesListActions/ProfilesListActions.test.tsx b/src/features/profiles/components/ProfilesList/components/ProfilesListActions/ProfilesListActions.test.tsx
new file mode 100644
index 000000000..40a5e38e6
--- /dev/null
+++ b/src/features/profiles/components/ProfilesList/components/ProfilesListActions/ProfilesListActions.test.tsx
@@ -0,0 +1,162 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import ProfilesListActions from "./ProfilesListActions";
+import { ProfileTypes } from "../../../../helpers";
+import userEvent from "@testing-library/user-event";
+import { profiles } from "@/tests/mocks/profiles";
+
+const actionLabels = {
+  security: [
+    "View details",
+    "Edit",
+    "Download audit",
+    "Run",
+    "Duplicate",
+    "Archive",
+  ],
+  package: [
+    "View details",
+    "Edit",
+    "Edit package constraints",
+    "Duplicate",
+    "Remove",
+  ],
+  reboot: ["View details", "Edit", "Duplicate", "Remove"],
+  script: ["View details", "Edit", "Archive"],
+  default: ["View details", "Edit", "Remove"],
+  archivedSecurity: ["View details", "Download audit", "Duplicate"],
+  archivedScript: ["View details"],
+};
+
+const [baseProfile] = profiles;
+
+describe("ProfilesListActions", () => {
+  it("opens removal modal for default profiles", async () => {
+    renderWithProviders(
+      <ProfilesListActions
+        profile={baseProfile}
+        type={ProfileTypes.repository}
+      />,
+    );
+
+    expect(
+      screen.queryByText("Remove repository profile"),
+    ).not.toBeInTheDocument();
+
+    const menu = await screen.findByRole("button", {
+      name: `"${baseProfile.title}" profile actions`,
+    });
+    await userEvent.click(menu);
+
+    await userEvent.click(screen.getByRole("menuitem", { name: /remove/i }));
+    expect(
+      await screen.findByText("Remove repository profile"),
+    ).toBeInTheDocument();
+  });
+
+  it("opens archival modal for script profile", async () => {
+    renderWithProviders(
+      <ProfilesListActions
+        profile={{ ...baseProfile, script_id: 1 }}
+        type={ProfileTypes.script}
+      />,
+    );
+
+    expect(
+      screen.queryByText("Archive script profile"),
+    ).not.toBeInTheDocument();
+
+    const menu = await screen.findByRole("button", {
+      name: `"${baseProfile.title}" profile actions`,
+    });
+    await userEvent.click(menu);
+
+    await userEvent.click(screen.getByRole("menuitem", { name: /archive/i }));
+    expect(
+      await screen.findByText("Archive script profile"),
+    ).toBeInTheDocument();
+  });
+
+  it.each([
+    ["default", baseProfile, ProfileTypes.repository, actionLabels.default],
+    [
+      "security",
+      { ...baseProfile, benchmark: "cis_level1_workstation" },
+      ProfileTypes.security,
+      actionLabels.security,
+    ],
+    [
+      "reboot",
+      {
+        ...baseProfile,
+        num_computers: 0,
+        schedule: "schedule",
+        next_run: "next run",
+      },
+      ProfileTypes.reboot,
+      actionLabels.reboot,
+    ],
+    [
+      "package",
+      {
+        ...baseProfile,
+        constraints: {
+          constraint: "depends",
+          id: 1,
+          package: "package",
+          rule: "rule",
+          version: "1.0.0",
+        },
+      },
+      ProfileTypes.package,
+      actionLabels.package,
+    ],
+    [
+      "script",
+      { ...baseProfile, script_id: 3 },
+      ProfileTypes.script,
+      actionLabels.script,
+    ],
+    [
+      "archived security",
+      {
+        ...baseProfile,
+        benchmark: "cis_level1_workstation",
+        status: "archived",
+      },
+      ProfileTypes.security,
+      actionLabels.archivedSecurity,
+    ],
+    [
+      "archived script",
+      {
+        ...baseProfile,
+        script_id: 1,
+        archived: true,
+      },
+      ProfileTypes.script,
+      actionLabels.archivedScript,
+    ],
+  ])(
+    `displays the proper actions for %s profile`,
+    async (_, profile, type, actions) => {
+      renderWithProviders(
+        <ProfilesListActions profile={profile} type={type} />,
+      );
+
+      await userEvent.click(
+        screen.getByRole("button", {
+          name: `"${baseProfile.title}" profile actions`,
+        }),
+      );
+
+      const buttons = screen.getAllByRole("menuitem");
+      expect(buttons.length).toEqual(actions.length);
+
+      for (let i = 0; i < actions.length; i++) {
+        expect(buttons[i]).toHaveTextContent(actions[i] ?? "invalid");
+      }
+    },
+  );
+});
diff --git a/src/features/profiles/components/ProfilesList/components/ProfilesListActions/ProfilesListActions.tsx b/src/features/profiles/components/ProfilesList/components/ProfilesListActions/ProfilesListActions.tsx
new file mode 100644
index 000000000..b67c2a1a6
--- /dev/null
+++ b/src/features/profiles/components/ProfilesList/components/ProfilesListActions/ProfilesListActions.tsx
@@ -0,0 +1,48 @@
+import ListActions from "@/components/layout/ListActions";
+import { lazy, type FC } from "react";
+import { useBoolean } from "usehooks-ts";
+import type { Profile } from "../../../../types";
+import { useGetProfileActions } from "../../../../hooks";
+import type { ProfileTypes } from "../../../../helpers";
+
+const RemoveProfileModal = lazy(
+  async () => import("../../../RemoveProfileModal"),
+);
+
+interface ProfileListActionsProps {
+  readonly profile: Profile;
+  readonly type: ProfileTypes;
+}
+
+const ProfileListActions: FC<ProfileListActionsProps> = ({ profile, type }) => {
+  const {
+    value: isModalOpen,
+    setTrue: openModal,
+    setFalse: closeModal,
+  } = useBoolean();
+
+  const { viewAction, actions, destructiveActions } = useGetProfileActions({
+    profile,
+    type,
+    openModal,
+  });
+
+  return (
+    <>
+      <ListActions
+        toggleAriaLabel={`"${profile.title}" profile actions`}
+        actions={[viewAction, ...actions]}
+        destructiveActions={destructiveActions}
+      />
+
+      <RemoveProfileModal
+        closeModal={closeModal}
+        opened={isModalOpen}
+        profile={profile}
+        type={type}
+      />
+    </>
+  );
+};
+
+export default ProfileListActions;
diff --git a/src/features/profiles/components/ProfilesList/components/ProfilesListActions/index.ts b/src/features/profiles/components/ProfilesList/components/ProfilesListActions/index.ts
new file mode 100644
index 000000000..384b35fa0
--- /dev/null
+++ b/src/features/profiles/components/ProfilesList/components/ProfilesListActions/index.ts
@@ -0,0 +1 @@
+export { default } from "./ProfilesListActions";
diff --git a/src/features/profiles/components/ProfilesList/helpers.tsx b/src/features/profiles/components/ProfilesList/helpers.tsx
new file mode 100644
index 000000000..95bd9f168
--- /dev/null
+++ b/src/features/profiles/components/ProfilesList/helpers.tsx
@@ -0,0 +1,302 @@
+import { Icon, ICONS, Tooltip } from "@canonical/react-components";
+import type { Profile, ProfileActions } from "../../types";
+import {
+  getTriggerText,
+  isPackageProfile,
+  isProfileArchived,
+  isRebootProfile,
+  isRemovalProfile,
+  isScriptProfile,
+  isSecurityProfile,
+  isWslProfile,
+  type ProfileTypes,
+} from "../../helpers";
+import ProfileAssociatedInstancesLink from "../ProfileAssociatedInstancesLink";
+import { LIST_ACTIONS_COLUMN_PROPS } from "@/components/layout/ListActions";
+import NoData from "@/components/layout/NoData";
+import { getTitleByName } from "@/utils/_helpers";
+import { Button, Link } from "@canonical/react-components";
+import type { CellProps, Column } from "react-table";
+import ProfilesListActions from "./components/ProfilesListActions";
+import moment from "moment";
+import { DISPLAY_DATE_TIME_FORMAT } from "@/constants";
+import { ROUTES } from "@/libs/routes";
+import type { AxiosResponse } from "axios";
+import type { ScriptProfile } from "@/features/script-profiles";
+import {
+  type SecurityProfile,
+  SECURITY_PROFILE_ASSOCIATED_INSTANCES_LIMIT,
+  SECURITY_PROFILE_MODE_LABELS,
+  SecurityProfileAuditPassRate,
+  SecurityProfileLastRunWithSchedule,
+} from "@/features/security-profiles";
+import AssociatedInstancesCell from "./components/AssociatedInstancesCell";
+
+const getStatus = (profile: ScriptProfile | SecurityProfile) => {
+  if (isProfileArchived(profile)) {
+    return { label: "Archived", icon: "status-queued-small" };
+  }
+
+  if (
+    isSecurityProfile(profile) &&
+    profile.associated_instances > SECURITY_PROFILE_ASSOCIATED_INSTANCES_LIMIT
+  ) {
+    return {
+      label: (
+        <div style={{ display: "inline-flex", gap: "1rem" }}>
+          <span>Over limit</span>
+          <Tooltip
+            position="top-center"
+            message="Only the first 5,000 instances are covered. Instances beyond the limit are not covered."
+          >
+            <div style={{ transform: "translateX(16px)" }}>
+              <Icon name={ICONS.help} />
+            </div>
+          </Tooltip>
+        </div>
+      ),
+      icon: "status-failed-small",
+    };
+  }
+
+  return { label: "Active", icon: "status-succeeded-small" };
+};
+
+type ColumnNames = "name" | "accessGroup" | "associated" | "actions";
+
+export const getGeneralColumns = (
+  type: ProfileTypes,
+  onNameClick: (profile: Profile, action: ProfileActions) => void,
+  accessGroupData: AxiosResponse | undefined,
+): Record<ColumnNames, Column<Profile>> => ({
+  name: {
+    accessor: "title",
+    Header: "Profile name",
+    id: "title",
+    meta: {
+      ariaLabel: ({ original: profile }) => `"${profile.title}" profile name`,
+    },
+    Cell: ({ row: { original: profile } }: CellProps<Profile>) => (
+      <Button
+        type="button"
+        appearance="link"
+        className="u-no-margin--bottom u-no-padding--top u-align-text--left"
+        onClick={() => {
+          onNameClick(profile, "view");
+        }}
+        aria-label={`Open "${profile.title}" profile details`}
+      >
+        {profile.title}
+      </Button>
+    ),
+  },
+  accessGroup: {
+    accessor: "access_group",
+    Header: "Access group",
+    meta: {
+      ariaLabel: ({ original: profile }) =>
+        `"${profile.title}" profile access group`,
+    },
+    Cell: ({ row: { original: profile } }: CellProps<Profile>) =>
+      getTitleByName(profile.access_group, accessGroupData),
+  },
+  associated: {
+    accessor: "associated",
+    Header: "Associated",
+    meta: {
+      ariaLabel: ({ original: profile }) =>
+        `"${profile.title}" profile associated instances`,
+    },
+    Cell: ({ row: { original: profile } }: CellProps<Profile>) => (
+      <AssociatedInstancesCell type={type} profile={profile} />
+    ),
+  },
+  actions: {
+    ...LIST_ACTIONS_COLUMN_PROPS,
+    meta: {
+      ariaLabel: ({ original: profile }) =>
+        `"${profile.title}" profile actions`,
+    },
+    Cell: ({ row: { original: profile } }: CellProps<Profile>) => (
+      <ProfilesListActions profile={profile} type={type} />
+    ),
+  },
+});
+
+export const getStatusColumn = (): Column<Profile> => ({
+  Header: "Status",
+  accessor: (row) => (isSecurityProfile(row) ? "status" : "archived"),
+  meta: {
+    ariaLabel: ({ original: profile }) => `"${profile.title}" profile status`,
+  },
+  getCellIcon: ({ row: { original: profile } }: CellProps<Profile>) => {
+    if (isSecurityProfile(profile) || isScriptProfile(profile)) {
+      return getStatus(profile).icon;
+    }
+  },
+  Cell: ({ row: { original: profile } }: CellProps<Profile>) => {
+    if (isSecurityProfile(profile) || isScriptProfile(profile)) {
+      return getStatus(profile).label;
+    }
+  },
+});
+
+export const getComplianceColumns = (type: ProfileTypes): Column<Profile>[] => [
+  {
+    Header: "Compliant",
+    meta: {
+      ariaLabel: ({ original }) =>
+        `${original.title} profile compliant instances`,
+    },
+    Cell: ({ row: { original: profile } }: CellProps<Profile>) => {
+      if (isWslProfile(profile) || isPackageProfile(profile)) {
+        return (
+          <ProfileAssociatedInstancesLink
+            profile={profile}
+            count={
+              profile.computers.constrained.length -
+              profile.computers["non-compliant"].length
+            }
+            query={`${type}:${profile.id}:compliant`}
+          />
+        );
+      }
+    },
+  },
+  {
+    Header: "Not compliant",
+    meta: {
+      ariaLabel: ({ original: profile }) =>
+        `"${profile.title}" profile non-compliant instances`,
+    },
+    Cell: ({ row: { original: profile } }: CellProps<Profile>) => {
+      if (isWslProfile(profile) || isPackageProfile(profile)) {
+        return (
+          <ProfileAssociatedInstancesLink
+            profile={profile}
+            count={profile.computers["non-compliant"].length}
+            query={`${type}:${profile.id}:noncompliant`}
+          />
+        );
+      }
+    },
+  },
+];
+
+export const getSecurityColumns = (): Column<Profile>[] => [
+  {
+    accessor: "last_run_results",
+    className: "medium-cell",
+    Header: "Pass rate",
+    meta: {
+      ariaLabel: ({ original: profile }) =>
+        `"${profile.title}" profile last audit pass rate`,
+    },
+    Cell: ({ row: { original: profile } }: CellProps<Profile>) => {
+      if (isSecurityProfile(profile)) {
+        return <SecurityProfileAuditPassRate profile={profile} />;
+      }
+    },
+  },
+  {
+    accessor: "schedule",
+    Header: (
+      <div>
+        Last run
+        <br />
+        <span className="u-text--muted">Schedule</span>
+      </div>
+    ),
+    meta: {
+      ariaLabel: ({ original: profile }) =>
+        `"${profile.title}" profile last run and schedule`,
+    },
+    Cell: ({ row: { original: profile } }: CellProps<Profile>) => {
+      if (isSecurityProfile(profile)) {
+        return <SecurityProfileLastRunWithSchedule profile={profile} />;
+      }
+    },
+  },
+  {
+    accessor: "mode",
+    Header: "Mode",
+    meta: {
+      ariaLabel: ({ original: profile }) => `"${profile.title}" profile mode`,
+    },
+    Cell: ({ row: { original: profile } }: CellProps<Profile>) => {
+      if (isSecurityProfile(profile)) {
+        return SECURITY_PROFILE_MODE_LABELS[profile.mode];
+      }
+    },
+  },
+];
+
+export const getScriptColumns = (): Column<Profile>[] => [
+  {
+    Header: "Last run",
+    accessor: "activities.last_activity.creation_time",
+    meta: {
+      ariaLabel: ({ original: profile }) =>
+        `"${profile.title}" profile last run`,
+    },
+    Cell: ({ row: { original: profile } }: CellProps<Profile>) => {
+      if (isScriptProfile(profile)) {
+        const { last_activity } = profile.activities;
+        return last_activity ? (
+          <Link
+            href={ROUTES.activities.root({
+              query: `parent-id:${last_activity.id}`,
+            })}
+          >
+            {moment(last_activity.creation_time)
+              .utc()
+              .format(DISPLAY_DATE_TIME_FORMAT)}
+          </Link>
+        ) : (
+          <NoData />
+        );
+      }
+    },
+  },
+  {
+    Header: "Trigger",
+    accessor: "trigger",
+    meta: {
+      ariaLabel: ({ original: profile }) =>
+        `"${profile.title}" profile trigger`,
+    },
+    Cell: ({ row: { original: profile } }: CellProps<Profile>) => {
+      if (isScriptProfile(profile)) {
+        return getTriggerText(profile);
+      }
+    },
+  },
+];
+
+export const getRebootColumn = (): Column<Profile> => ({
+  accessor: "next_run",
+  Header: "Next restart",
+  meta: {
+    ariaLabel: ({ original: profile }) =>
+      `"${profile.title}" profile next restart`,
+  },
+  Cell: ({ row: { original: profile } }: CellProps<Profile>) => {
+    if (isRebootProfile(profile)) {
+      return moment(profile.next_run).utc().format(DISPLAY_DATE_TIME_FORMAT);
+    }
+  },
+});
+
+export const getRemovalColumn = (): Column<Profile> => ({
+  accessor: "days_without_exchange",
+  Header: "Removal timeframe",
+  meta: {
+    ariaLabel: ({ original: profile }) =>
+      `"${profile.title}" profile removal timeframe`,
+  },
+  Cell: ({ row: { original: profile } }: CellProps<Profile>) => {
+    if (isRemovalProfile(profile)) {
+      return `${profile.days_without_exchange} days`;
+    }
+  },
+});
diff --git a/src/features/profiles/components/ProfilesList/index.ts b/src/features/profiles/components/ProfilesList/index.ts
new file mode 100644
index 000000000..5a7d154c2
--- /dev/null
+++ b/src/features/profiles/components/ProfilesList/index.ts
@@ -0,0 +1 @@
+export { default } from "./ProfilesList";
diff --git a/src/features/profiles/components/RemoveProfileModal/RemoveProfileModal.test.tsx b/src/features/profiles/components/RemoveProfileModal/RemoveProfileModal.test.tsx
new file mode 100644
index 000000000..b6e2ccebc
--- /dev/null
+++ b/src/features/profiles/components/RemoveProfileModal/RemoveProfileModal.test.tsx
@@ -0,0 +1,120 @@
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { beforeEach, describe, expect, it, vi } from "vitest";
+import { ProfileTypes } from "../../helpers";
+import RemoveProfileModal from "./RemoveProfileModal";
+import useProfiles from "@/hooks/useProfiles";
+import { profiles } from "@/tests/mocks/profiles";
+import { renderWithProviders } from "@/tests/render";
+
+vi.mock("@/hooks/useProfiles", () => ({
+  default: vi.fn(),
+}));
+
+const mockUseProfiles = vi.mocked(useProfiles);
+
+const [baseProfile] = profiles;
+
+describe("RemoveProfileModal", () => {
+  const removeProfile = vi.fn();
+  const closeModal = vi.fn();
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+
+    mockUseProfiles.mockReturnValue({
+      removeProfile,
+      isRemovingProfile: false,
+    } as unknown as ReturnType<typeof useProfiles>);
+  });
+
+  it("submits archive and shows success notification", async () => {
+    renderWithProviders(
+      <RemoveProfileModal
+        profile={baseProfile}
+        type={ProfileTypes.script}
+        opened
+        closeModal={closeModal}
+      />,
+    );
+
+    expect(screen.getByText("Archive script profile")).toBeInTheDocument();
+    expect(screen.getByText("archive Profile One")).toBeInTheDocument();
+    await userEvent.type(screen.getByRole("textbox"), "archive Profile One");
+    await userEvent.click(screen.getByRole("button", { name: "Archive" }));
+
+    expect(removeProfile).toHaveBeenCalledWith({
+      id: baseProfile.id,
+      name: baseProfile.name,
+    });
+
+    expect(screen.getByText("Script profile archived")).toBeInTheDocument();
+    expect(closeModal).toHaveBeenCalled();
+  });
+
+  it("submits remove and shows success notification", async () => {
+    renderWithProviders(
+      <RemoveProfileModal
+        profile={baseProfile}
+        type={ProfileTypes.repository}
+        opened
+        closeModal={closeModal}
+      />,
+    );
+
+    expect(screen.getByText("Remove repository profile")).toBeInTheDocument();
+    expect(screen.getByText("remove Profile One")).toBeInTheDocument();
+    await userEvent.type(screen.getByRole("textbox"), "remove Profile One");
+    await userEvent.click(screen.getByRole("button", { name: "Remove" }));
+
+    expect(removeProfile).toHaveBeenCalledWith({
+      id: baseProfile.id,
+      name: baseProfile.name,
+    });
+
+    expect(screen.getByText("Repository profile removed")).toBeInTheDocument();
+    expect(closeModal).toHaveBeenCalled();
+  });
+
+  it("calls debug on failure and still closes modal", async () => {
+    const error = new Error("request failed");
+    removeProfile.mockRejectedValue(error);
+
+    renderWithProviders(
+      <RemoveProfileModal
+        profile={baseProfile}
+        type={ProfileTypes.package}
+        opened
+        closeModal={closeModal}
+      />,
+    );
+
+    await userEvent.type(screen.getByRole("textbox"), "remove Profile One");
+    await userEvent.click(screen.getByRole("button", { name: "Remove" }));
+
+    expect(closeModal).toHaveBeenCalled();
+    expect(screen.getByText("request failed")).toBeInTheDocument();
+  });
+
+  it("disables confirm button while request is pending", () => {
+    mockUseProfiles.mockReturnValue({
+      removeProfile,
+      isRemovingProfile: true,
+    } as unknown as ReturnType<typeof useProfiles>);
+
+    renderWithProviders(
+      <RemoveProfileModal
+        profile={baseProfile}
+        type={ProfileTypes.script}
+        opened
+        closeModal={closeModal}
+      />,
+    );
+
+    const loadingButton = screen.getByRole("button", {
+      name: "Waiting for action to complete",
+    });
+    expect(loadingButton).toHaveAttribute("aria-disabled", "true");
+    expect(loadingButton).toHaveClass("is-disabled");
+  });
+});
diff --git a/src/features/profiles/components/RemoveProfileModal/RemoveProfileModal.tsx b/src/features/profiles/components/RemoveProfileModal/RemoveProfileModal.tsx
new file mode 100644
index 000000000..bf963ee39
--- /dev/null
+++ b/src/features/profiles/components/RemoveProfileModal/RemoveProfileModal.tsx
@@ -0,0 +1,76 @@
+import TextConfirmationModal from "@/components/form/TextConfirmationModal";
+import type { FC } from "react";
+import type { Profile } from "../../types";
+import useDebug from "@/hooks/useDebug";
+import useNotify from "@/hooks/useNotify";
+import { capitalize } from "@/utils/_helpers";
+import { getModalMessage, getNotificationMessage } from "./helpers";
+import { canArchiveProfile, type ProfileTypes } from "../../helpers";
+import usePageParams from "@/hooks/usePageParams";
+import useProfiles from "@/hooks/useProfiles";
+
+interface RemoveProfileModalProps {
+  readonly profile: Profile;
+  readonly type: ProfileTypes;
+  readonly opened: boolean;
+  readonly closeModal: () => void;
+}
+
+const RemoveProfileModal: FC<RemoveProfileModalProps> = ({
+  profile,
+  type,
+  opened,
+  closeModal,
+}) => {
+  const removalType = canArchiveProfile(type) ? "archive" : "remove";
+  const removalTypeTitle = capitalize(removalType);
+
+  const notificationMessage = `You have successfully ${removalType}d "${profile.title}" profile. ${getNotificationMessage(type)}`;
+
+  const { notify } = useNotify();
+  const debug = useDebug();
+  const { setPageParams } = usePageParams();
+  const { removeProfile, isRemovingProfile } = useProfiles();
+
+  const handleRemoveProfile = async () => {
+    try {
+      await removeProfile({
+        id: profile.id,
+        name: profile.name,
+      });
+
+      setPageParams({ sidePath: [], profile: "" });
+
+      notify.success({
+        title: `${capitalize(type)} profile ${removalType}d`,
+        message: notificationMessage,
+      });
+    } catch (error) {
+      debug(error);
+    } finally {
+      closeModal();
+    }
+  };
+
+  return (
+    <TextConfirmationModal
+      isOpen={opened}
+      title={`${removalTypeTitle} ${type} profile`}
+      confirmButtonLabel={removalTypeTitle}
+      confirmButtonAppearance="negative"
+      onConfirm={handleRemoveProfile}
+      confirmButtonDisabled={isRemovingProfile}
+      confirmButtonLoading={isRemovingProfile}
+      close={closeModal}
+      confirmationText={`${removalType} ${profile.title}`}
+      renderInPortal
+    >
+      <p>{getModalMessage(type, profile.title)}</p>
+      <p>
+        This action is <strong>irreversible</strong>.
+      </p>
+    </TextConfirmationModal>
+  );
+};
+
+export default RemoveProfileModal;
diff --git a/src/features/profiles/components/RemoveProfileModal/helpers.ts b/src/features/profiles/components/RemoveProfileModal/helpers.ts
new file mode 100644
index 000000000..4928fd18f
--- /dev/null
+++ b/src/features/profiles/components/RemoveProfileModal/helpers.ts
@@ -0,0 +1,29 @@
+import { ProfileTypes } from "../../helpers";
+
+export const getModalMessage = (type: ProfileTypes, profileName: string) => {
+  switch (type) {
+    case ProfileTypes.script:
+      return `Archiving "${profileName}" script profile will prevent it from running in the future.`;
+    case ProfileTypes.security:
+      return `Archiving "${profileName}" security profile will prevent it from running. However, it will NOT delete past audit data or remove the profile details. You will not be able to reactivate the profile after it has been archived.`;
+    case ProfileTypes.wsl:
+      return `Removing "${profileName}" WSL profile will not remove the WSL child instances associated with it.`;
+    case ProfileTypes.reboot:
+      return `Removing "${profileName}" may impact scheduled reboots for associated instances.`;
+    default:
+      return `This will remove "${profileName}" ${type} profile.`;
+  }
+};
+
+export const getNotificationMessage = (type: ProfileTypes) => {
+  switch (type) {
+    case ProfileTypes.script:
+      return "It will no longer run.";
+    case ProfileTypes.security:
+      return "It will no longer run, but past audit data and profile details will remain accessible for selected duration of the retention period.";
+    case ProfileTypes.wsl:
+      return "Instances created by this profile won't be affected.";
+    default:
+      return "";
+  }
+};
diff --git a/src/features/profiles/components/RemoveProfileModal/index.ts b/src/features/profiles/components/RemoveProfileModal/index.ts
new file mode 100644
index 000000000..b762aae93
--- /dev/null
+++ b/src/features/profiles/components/RemoveProfileModal/index.ts
@@ -0,0 +1 @@
+export { default } from "./RemoveProfileModal";
diff --git a/src/features/profiles/components/ViewProfileSidePanel/ViewProfileSidePanel.module.scss b/src/features/profiles/components/ViewProfileSidePanel/ViewProfileSidePanel.module.scss
new file mode 100644
index 000000000..21bfb096b
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/ViewProfileSidePanel.module.scss
@@ -0,0 +1,5 @@
+@import "vanilla-framework/scss/settings_spacing";
+
+nav .tabs {
+  margin-bottom: $spv--x-large;
+}
diff --git a/src/features/profiles/components/ViewProfileSidePanel/ViewProfileSidePanel.tsx b/src/features/profiles/components/ViewProfileSidePanel/ViewProfileSidePanel.tsx
new file mode 100644
index 000000000..d71d6212b
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/ViewProfileSidePanel.tsx
@@ -0,0 +1,80 @@
+import { Suspense, useState, type FC } from "react";
+import ViewProfileActionsBlock from "./components/ViewProfileActionsBlock";
+import LoadingState from "@/components/layout/LoadingState";
+import { ScriptProfileActivityHistory } from "@/features/script-profiles";
+import { Tabs } from "@canonical/react-components";
+import ViewProfileInfoTab from "./components/ViewProfileInfoTab";
+import classes from "./ViewProfileSidePanel.module.scss";
+import {
+  isPackageProfile,
+  isScriptProfile,
+} from "../../helpers";
+import { PackageProfileDetailsConstraints } from "@/features/package-profiles";
+import { getTabs, type TabTypes } from "./helpers";
+import type { Profile } from "../../types";
+import type { ProfileTypes } from "../../helpers";
+import { hasOneItem } from "@/utils/_helpers";
+import SidePanel from "@/components/layout/SidePanel";
+
+interface ViewProfileSidePanelProps {
+  readonly profile: Profile | undefined;
+  readonly type: ProfileTypes;
+}
+
+const ViewProfileSidePanel: FC<ViewProfileSidePanelProps> = ({
+  profile,
+  type,
+}) => {
+  const [tabId, setTabId] = useState<TabTypes>("info");
+
+  if (!profile) {
+    return <SidePanel.LoadingState />;
+  }
+
+  const tabs = getTabs(type);
+  const links = tabs.map(({ label, id }) => ({
+    label,
+    active: tabId == id,
+    onClick: () => {
+      setTabId(id);
+    },
+  }));
+
+  return (
+    <>
+      <SidePanel.Header>{profile.title}</SidePanel.Header>
+      <SidePanel.Content>
+        <ViewProfileActionsBlock profile={profile} type={type} />
+        {hasOneItem(tabs) ? (
+          <ViewProfileInfoTab profile={profile} type={type} key="info" />
+        ) : (
+          <>
+            <Tabs listClassName={classes.tabs} links={links} />
+
+            <Suspense fallback={<LoadingState />}>
+              {tabId === "info" && (
+                <ViewProfileInfoTab profile={profile} type={type} key="info" />
+              )}
+
+              {isScriptProfile(profile) && tabId === "activity-history" && (
+                <ScriptProfileActivityHistory
+                  profile={profile}
+                  key="activity-history"
+                />
+              )}
+
+              {isPackageProfile(profile) && tabId === "package-constraints" && (
+                <PackageProfileDetailsConstraints
+                  profile={profile}
+                  key="package-constraints"
+                />
+              )}
+            </Suspense>
+          </>
+        )}
+      </SidePanel.Content>
+    </>
+  );
+};
+
+export default ViewProfileSidePanel;
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileActionsBlock/ViewProfileActionsBlock.module.scss b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileActionsBlock/ViewProfileActionsBlock.module.scss
new file mode 100644
index 000000000..139305f1d
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileActionsBlock/ViewProfileActionsBlock.module.scss
@@ -0,0 +1,5 @@
+@import "vanilla-framework/scss/settings_spacing";
+
+.actions {
+  margin-bottom: $spv--x-large;
+}
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileActionsBlock/ViewProfileActionsBlock.tsx b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileActionsBlock/ViewProfileActionsBlock.tsx
new file mode 100644
index 000000000..865dedbde
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileActionsBlock/ViewProfileActionsBlock.tsx
@@ -0,0 +1,87 @@
+import { Button, Icon, Notification } from "@canonical/react-components";
+import { lazy, type FC } from "react";
+import { useBoolean } from "usehooks-ts";
+import type { Profile } from "../../../../types";
+import { ResponsiveButtons } from "@/components/ui";
+import type { Action } from "@/types/Action";
+import classes from "./ViewProfileActionsBlock.module.scss";
+import { useGetProfileActions } from "../../../../hooks/useGetProfileActions";
+import { isScriptProfile, type ProfileTypes } from "../../../../helpers";
+import moment from "moment";
+import { DISPLAY_DATE_TIME_FORMAT } from "@/constants";
+
+const RemoveProfileModal = lazy(
+  async () => import("../../../RemoveProfileModal"),
+);
+
+interface ViewProfileActionsBlockProps {
+  readonly profile: Profile;
+  readonly type: ProfileTypes;
+}
+
+const ViewProfileActionsBlock: FC<ViewProfileActionsBlockProps> = ({
+  profile,
+  type,
+}) => {
+  const {
+    value: modalOpen,
+    setTrue: openModal,
+    setFalse: closeModal,
+  } = useBoolean();
+
+  const { actions, destructiveActions } = useGetProfileActions({
+    profile,
+    type,
+    openModal,
+  });
+  const buttons = [...actions, ...(destructiveActions ?? [])];
+  const isNegative = (action: Action) => action.appearance === "negative";
+
+  if (isScriptProfile(profile) && profile.archived) {
+    return (
+      <Notification inline title="Profile archived:" severity="caution">
+        The profile was archived on{" "}
+        {moment(profile.last_edited_at).format(DISPLAY_DATE_TIME_FORMAT)}.
+      </Notification>
+    );
+  }
+
+  return (
+    <>
+      <ResponsiveButtons
+        className={classes.actions}
+        buttons={buttons.map((button) => (
+          <Button
+            key={button.label}
+            hasIcon
+            type="button"
+            onClick={button.onClick}
+            aria-label={`${button.label} ${profile.title} ${type} profile`}
+            disabled={button.disabled}
+          >
+            <Icon
+              name={
+                isNegative(button) ? `${button.icon}--negative` : button.icon
+              }
+            />
+            <span className={isNegative(button) ? "u-text--negative" : ""}>
+              {button.label}
+            </span>
+          </Button>
+        ))}
+        collapseFrom={"xs"}
+        alwaysCollapse={buttons.length > 3}
+        menuPosition="left"
+      />
+
+      <RemoveProfileModal
+        closeModal={closeModal}
+        opened={modalOpen}
+        profile={profile}
+        type={type}
+      />
+    </>
+  );
+};
+
+export default ViewProfileActionsBlock;
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileActionsBlock/index.ts b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileActionsBlock/index.ts
new file mode 100644
index 000000000..41e013716
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileActionsBlock/index.ts
@@ -0,0 +1 @@
+export { default } from "./ViewProfileActionsBlock";
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileAssociationBlock/ViewProfileAssociationBlock.test.tsx b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileAssociationBlock/ViewProfileAssociationBlock.test.tsx
new file mode 100644
index 000000000..f963032bc
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileAssociationBlock/ViewProfileAssociationBlock.test.tsx
@@ -0,0 +1,110 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+import ViewProfileAssociationBlock from "./ViewProfileAssociationBlock";
+import type { Profile } from "../../../../types";
+import { ProfileTypes } from "../../../../helpers";
+import { useGetProfileAssociatedCount } from "../../../../hooks/useGetProfileAssociatedCount";
+
+vi.mock("../../../../hooks/useGetProfileAssociatedCount", () => ({
+  useGetProfileAssociatedCount: vi.fn(),
+}));
+
+const mockedUseGetProfileAssociatedCount = vi.mocked(
+  useGetProfileAssociatedCount,
+);
+
+const profile: Profile = {
+  access_group: "global",
+  all_computers: false,
+  description: "description",
+  id: 12,
+  name: "profile-3",
+  tags: ["tag1", "tag2"],
+  title: "Profile Three",
+};
+
+describe("ViewProfileAssociationBlock", () => {
+  it("shows no associations message", () => {
+    mockedUseGetProfileAssociatedCount.mockReturnValue({
+      associatedCount: 0,
+      isGettingInstances: false,
+    });
+
+    renderWithProviders(
+      <ViewProfileAssociationBlock
+        profile={{ ...profile, tags: [] }}
+        type={ProfileTypes.script}
+      />,
+    );
+
+    expect(screen.getByText("Association")).toBeInTheDocument();
+    expect(screen.getByText("Associated Instances")).toBeInTheDocument();
+    expect(
+      screen.getByText(
+        /This profile has not yet been associated with any instances/i,
+      ),
+    ).toBeInTheDocument();
+
+    expect(screen.queryByText("Compliant")).not.toBeInTheDocument();
+    expect(screen.queryByText("Not Compliant")).not.toBeInTheDocument();
+    expect(screen.queryByText("Tags")).not.toBeInTheDocument();
+  });
+
+  it("renders tags when profile has them", () => {
+    mockedUseGetProfileAssociatedCount.mockReturnValue({
+      associatedCount: 6,
+      isGettingInstances: false,
+    });
+
+    renderWithProviders(
+      <ViewProfileAssociationBlock
+        profile={profile}
+        type={ProfileTypes.package}
+      />,
+    );
+
+    expect(screen.getByText("Tags")).toBeInTheDocument();
+    expect(screen.getByText("tag1")).toBeInTheDocument();
+    expect(screen.getByText("tag2")).toBeInTheDocument();
+  });
+
+  it("renders compliance links when profile has compliance data", () => {
+    mockedUseGetProfileAssociatedCount.mockReturnValue({
+      associatedCount: 3,
+      isGettingInstances: false,
+    });
+
+    const packageProfile = {
+      ...profile,
+      constraints: [],
+      computers: {
+        constrained: [1, 2, 3],
+        "non-compliant": [2],
+        pending: [],
+      },
+    };
+
+    renderWithProviders(
+      <ViewProfileAssociationBlock
+        profile={packageProfile}
+        type={ProfileTypes.package}
+      />,
+    );
+
+    expect(screen.getByRole("link", { name: /3 instances/i })).toHaveAttribute(
+      "href",
+      expect.stringContaining("profile%3Apackage%3A12"),
+    );
+    expect(screen.getByText("Compliant")).toBeInTheDocument();
+    expect(screen.getByText("Not compliant")).toBeInTheDocument();
+    expect(screen.getByRole("link", { name: /2 instances/i })).toHaveAttribute(
+      "href",
+      expect.stringContaining("id%3A1+OR+id%3A3"),
+    );
+    expect(screen.getByRole("link", { name: /1 instance/i })).toHaveAttribute(
+      "href",
+      expect.stringContaining("id%3A2"),
+    );
+  });
+});
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileAssociationBlock/ViewProfileAssociationBlock.tsx b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileAssociationBlock/ViewProfileAssociationBlock.tsx
new file mode 100644
index 000000000..d4d0db30b
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileAssociationBlock/ViewProfileAssociationBlock.tsx
@@ -0,0 +1,93 @@
+import InfoGrid from "@/components/layout/InfoGrid";
+import type { FC } from "react";
+import {
+  hasAssociations,
+  hasComplianceData,
+  type ProfileTypes,
+} from "../../../../helpers";
+import ProfileAssociatedInstancesLink from "../../../ProfileAssociatedInstancesLink";
+import Blocks from "@/components/layout/Blocks";
+import Chip from "@/components/layout/Chip";
+import type { Profile } from "../../../../types";
+import { useGetProfileAssociatedCount } from "../../../../hooks/useGetProfileAssociatedCount";
+
+interface ViewProfileAssociationBlockProps {
+  readonly profile: Profile;
+  readonly type: ProfileTypes;
+}
+
+const ViewProfileAssociationBlock: FC<ViewProfileAssociationBlockProps> = ({
+  profile,
+  type,
+}) => {
+  const { associatedCount, isGettingInstances } =
+    useGetProfileAssociatedCount(profile);
+
+  return (
+    <Blocks.Item title="Association">
+      <InfoGrid dense>
+        <InfoGrid.Item
+          label="Associated Instances"
+          large
+          value={
+            !hasAssociations(profile) ? (
+              <span>
+                This profile has not yet been associated with any instances.
+              </span>
+            ) : (
+              <ProfileAssociatedInstancesLink
+                profile={profile}
+                count={associatedCount}
+                query={`${type}:${profile.id}`}
+                isPending={isGettingInstances}
+                isGeneralAssociation
+              />
+            )
+          }
+        />
+
+        {hasAssociations(profile) && hasComplianceData(profile) && (
+          <>
+            <InfoGrid.Item
+              label="Compliant"
+              value={
+                <ProfileAssociatedInstancesLink
+                  profile={profile}
+                  count={
+                    profile.computers.constrained.length -
+                    profile.computers["non-compliant"].length
+                  }
+                  query={`${type}:${profile.id}:compliant`}
+                  isPending={isGettingInstances}
+                />
+              }
+            />
+
+            <InfoGrid.Item
+              label="Not compliant"
+              value={
+                <ProfileAssociatedInstancesLink
+                  profile={profile}
+                  count={profile.computers["non-compliant"].length}
+                  query={`${type}:${profile.id}:noncompliant`}
+                  isPending={isGettingInstances}
+                />
+              }
+            />
+          </>
+        )}
+        {!!profile.tags.length && (
+          <InfoGrid.Item
+            label="Tags"
+            large
+            value={profile.tags.map((tag) => (
+              <Chip key={tag} value={tag} />
+            ))}
+          />
+        )}
+      </InfoGrid>
+    </Blocks.Item>
+  );
+};
+
+export default ViewProfileAssociationBlock;
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileAssociationBlock/index.ts b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileAssociationBlock/index.ts
new file mode 100644
index 000000000..331ad1e6b
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileAssociationBlock/index.ts
@@ -0,0 +1 @@
+export { default } from "./ViewProfileAssociationBlock";
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileDetailsBlock/ViewProfileDetailsBlock.test.tsx b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileDetailsBlock/ViewProfileDetailsBlock.test.tsx
new file mode 100644
index 000000000..7c6de6f00
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileDetailsBlock/ViewProfileDetailsBlock.test.tsx
@@ -0,0 +1,46 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+import ViewProfileDetailsBlock from "./ViewProfileDetailsBlock";
+import { profiles } from "@/tests/mocks/profiles";
+
+vi.mock("@/features/script-profiles/", () => ({
+  ViewScriptProfileDetailsBlock: () => <div>script details</div>,
+}));
+vi.mock("@/features/removal-profiles/", () => ({
+  ViewRemovalProfileDetailsBlock: () => <div>removal details</div>,
+}));
+vi.mock("@/features/security-profiles/", () => ({
+  ViewSecurityProfileDetailsBlock: () => <div>security details</div>,
+}));
+vi.mock("@/features/upgrade-profiles/", () => ({
+  ViewUpgradeProfileDetailsBlock: () => <div>upgrade details</div>,
+}));
+vi.mock("@/features/wsl-profiles", () => ({
+  ViewWslProfileDetailsBlock: () => <div>wsl details</div>,
+}));
+
+const [baseProfile] = profiles;
+
+describe("ViewProfileDetailsBlock", () => {
+  it.each([
+    ["removal", { ...baseProfile, days_without_exchange: 30 }],
+    ["script", { ...baseProfile, script_id: 3 }],
+    ["security", { ...baseProfile, benchmark: "disa_stig" }],
+    ["upgrade", { ...baseProfile, upgrade_type: "all" }],
+    ["wsl", { ...baseProfile, image_name: "image" }],
+  ])("renders details block for %s profiles", async (type, profile) => {
+    renderWithProviders(<ViewProfileDetailsBlock profile={profile} />);
+
+    expect(
+      await screen.findByRole("heading", { name: /Details/i }),
+    ).toBeInTheDocument();
+    expect(await screen.findByText(type + " details")).toBeInTheDocument();
+  });
+
+  it("renders nothing when profile type is unsupported", () => {
+    renderWithProviders(<ViewProfileDetailsBlock profile={baseProfile} />);
+
+    expect(screen.queryByText(/Details/i)).not.toBeInTheDocument();
+  });
+});
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileDetailsBlock/ViewProfileDetailsBlock.tsx b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileDetailsBlock/ViewProfileDetailsBlock.tsx
new file mode 100644
index 000000000..f069c59c3
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileDetailsBlock/ViewProfileDetailsBlock.tsx
@@ -0,0 +1,84 @@
+import { lazy, type FC } from "react";
+import type { Profile } from "../../../../types";
+import {
+  isRemovalProfile,
+  isScriptProfile,
+  isSecurityProfile,
+  isUpgradeProfile,
+  isWslProfile,
+} from "../../../../helpers";
+import InfoGrid from "@/components/layout/InfoGrid/InfoGrid";
+import Blocks from "@/components/layout/Blocks";
+
+const ViewRemovalProfileDetailsBlock = lazy(async () =>
+  import("@/features/removal-profiles").then((module) => ({
+    default: module.ViewRemovalProfileDetailsBlock,
+  })),
+);
+
+const ViewScriptProfileDetailsBlock = lazy(async () =>
+  import("@/features/script-profiles").then((module) => ({
+    default: module.ViewScriptProfileDetailsBlock,
+  })),
+);
+
+const ViewSecurityProfileDetailsBlock = lazy(async () =>
+  import("@/features/security-profiles").then((module) => ({
+    default: module.ViewSecurityProfileDetailsBlock,
+  })),
+);
+
+const ViewUpgradeProfileDetailsBlock = lazy(async () =>
+  import("@/features/upgrade-profiles").then((module) => ({
+    default: module.ViewUpgradeProfileDetailsBlock,
+  })),
+);
+
+const ViewWslProfileDetailsBlock = lazy(async () =>
+  import("@/features/wsl-profiles").then((module) => ({
+    default: module.ViewWslProfileDetailsBlock,
+  })),
+);
+
+interface ViewProfileDetailsBlockProps {
+  readonly profile: Profile;
+}
+
+const ViewProfileDetailsBlock: FC<ViewProfileDetailsBlockProps> = ({
+  profile,
+}) => {
+  const getProfileDetailsBlock = () => {
+    if (isRemovalProfile(profile)) {
+      return <ViewRemovalProfileDetailsBlock profile={profile} />;
+    }
+
+    if (isScriptProfile(profile)) {
+      return <ViewScriptProfileDetailsBlock profile={profile} />;
+    }
+
+    if (isSecurityProfile(profile)) {
+      return <ViewSecurityProfileDetailsBlock profile={profile} />;
+    }
+
+    if (isUpgradeProfile(profile)) {
+      return <ViewUpgradeProfileDetailsBlock profile={profile} />;
+    }
+
+    if (isWslProfile(profile)) {
+      return <ViewWslProfileDetailsBlock profile={profile} />;
+    }
+    return;
+  };
+
+  const profileDetailsBlock = getProfileDetailsBlock();
+  if (profileDetailsBlock) {
+    return (
+      <Blocks.Item title="Details">
+        <InfoGrid dense>{profileDetailsBlock}</InfoGrid>
+      </Blocks.Item>
+    );
+  }
+  return;
+};
+
+export default ViewProfileDetailsBlock;
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileDetailsBlock/index.ts b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileDetailsBlock/index.ts
new file mode 100644
index 000000000..4e9cd6d07
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileDetailsBlock/index.ts
@@ -0,0 +1 @@
+export { default } from "./ViewProfileDetailsBlock";
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileGeneralBlock/ViewProfileGeneralBlock.test.tsx b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileGeneralBlock/ViewProfileGeneralBlock.test.tsx
new file mode 100644
index 000000000..5715f83c7
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileGeneralBlock/ViewProfileGeneralBlock.test.tsx
@@ -0,0 +1,94 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import ViewProfileGeneralBlock from "./ViewProfileGeneralBlock";
+import { ProfileTypes } from "../../../../helpers";
+import { profiles } from "@/tests/mocks/profiles";
+
+const [baseProfile] = profiles;
+
+describe("ViewProfileGeneralBlock", () => {
+  it("shows loading state while access groups are loading", () => {
+    renderWithProviders(
+      <ViewProfileGeneralBlock
+        profile={baseProfile}
+        type={ProfileTypes.script}
+      />,
+    );
+
+    expect(screen.getByRole("status")).toBeInTheDocument();
+  });
+
+  it.each([
+    [ProfileTypes.reboot],
+    [ProfileTypes.upgrade],
+    [ProfileTypes.removal],
+  ])("renders no status nor description for %s profile", async (type) => {
+    renderWithProviders(
+      <ViewProfileGeneralBlock profile={baseProfile} type={type} />,
+    );
+
+    expect(
+      await screen.findByRole("heading", { name: /^General$/i }),
+    ).toBeInTheDocument();
+    expect(screen.getByText(/^Name$/i)).toBeInTheDocument();
+    expect(screen.getByText(baseProfile.title)).toBeInTheDocument();
+    expect(screen.getByText(/^Access group$/i)).toBeInTheDocument();
+    expect(screen.getByText("Global access")).toBeInTheDocument();
+
+    expect(screen.queryByText(/^Status$/i)).not.toBeInTheDocument();
+    expect(screen.queryByText(/^Description$/i)).not.toBeInTheDocument();
+  });
+
+  it.each([[ProfileTypes.script], [ProfileTypes.security]])(
+    "renders active status for %s profile",
+    async (type) => {
+      renderWithProviders(
+        <ViewProfileGeneralBlock profile={baseProfile} type={type} />,
+      );
+
+      expect(
+        await screen.findByRole("heading", { name: /^General$/i }),
+      ).toBeInTheDocument();
+      expect(screen.getByText(/^Name$/i)).toBeInTheDocument();
+      expect(screen.getByText(/^Access group$/i)).toBeInTheDocument();
+
+      expect(screen.getByText(/^Status$/i)).toBeInTheDocument();
+      expect(screen.getByText("Active")).toBeInTheDocument();
+
+      expect(screen.queryByText(/^Description$/i)).not.toBeInTheDocument();
+    },
+  );
+
+  it.each([
+    [ProfileTypes.script, { ...baseProfile, archived: true }],
+    [ProfileTypes.security, { ...baseProfile, status: "archived" }],
+  ])("renders archived status for %s profile", async (type, profile) => {
+    renderWithProviders(
+      <ViewProfileGeneralBlock profile={profile} type={type} />,
+    );
+
+    expect(await screen.findByText("Archived")).toBeInTheDocument();
+  });
+
+  it.each([
+    [ProfileTypes.package],
+    [ProfileTypes.repository],
+    [ProfileTypes.wsl],
+  ])("renders description for %s profile", async (type) => {
+    renderWithProviders(
+      <ViewProfileGeneralBlock profile={baseProfile} type={type} />,
+    );
+
+    expect(
+      await screen.findByRole("heading", { name: /^General$/i }),
+    ).toBeInTheDocument();
+    expect(screen.getByText(/^Name$/i)).toBeInTheDocument();
+    expect(screen.getByText(/^Access group$/i)).toBeInTheDocument();
+
+    expect(screen.getByText(/^Description$/i)).toBeInTheDocument();
+    expect(screen.getByText(baseProfile.description)).toBeInTheDocument();
+
+    expect(screen.queryByText(/^Status$/i)).not.toBeInTheDocument();
+  });
+});
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileGeneralBlock/ViewProfileGeneralBlock.tsx b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileGeneralBlock/ViewProfileGeneralBlock.tsx
new file mode 100644
index 000000000..d1563956f
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileGeneralBlock/ViewProfileGeneralBlock.tsx
@@ -0,0 +1,60 @@
+import InfoGrid from "@/components/layout/InfoGrid";
+import SidePanel from "@/components/layout/SidePanel";
+import useRoles from "@/hooks/useRoles";
+import { getTitleByName } from "@/utils/_helpers";
+import type { FC } from "react";
+import type { Profile } from "../../../../types";
+import {
+  canArchiveProfile,
+  hasDescription,
+  isProfileArchived,
+  type ProfileTypes,
+} from "../../../../helpers";
+import Blocks from "@/components/layout/Blocks";
+
+interface ViewProfileGeneralBlockProps {
+  readonly profile: Profile;
+  readonly type: ProfileTypes;
+}
+
+const ViewProfileGeneralBlock: FC<ViewProfileGeneralBlockProps> = ({
+  profile,
+  type,
+}) => {
+  const { getAccessGroupQuery } = useRoles();
+  const { data: accessGroupsData, isPending: isGettingAccessGroups } =
+    getAccessGroupQuery();
+
+  if (isGettingAccessGroups) {
+    return <SidePanel.LoadingState />;
+  }
+
+  const status = isProfileArchived(profile) ? "Archived" : "Active";
+
+  return (
+    <Blocks.Item title="General">
+      <InfoGrid dense>
+        <InfoGrid.Item label="Name" value={profile.title} />
+
+        {canArchiveProfile(type) && (
+          <InfoGrid.Item label="Status" value={status} />
+        )}
+
+        <InfoGrid.Item
+          label="Access group"
+          value={getTitleByName(profile.access_group, accessGroupsData)}
+        />
+
+        {hasDescription(type) && (
+          <InfoGrid.Item
+            label="Description"
+            large
+            value={profile.description}
+          />
+        )}
+      </InfoGrid>
+    </Blocks.Item>
+  );
+};
+
+export default ViewProfileGeneralBlock;
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileGeneralBlock/index.ts b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileGeneralBlock/index.ts
new file mode 100644
index 000000000..17cfc806d
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileGeneralBlock/index.ts
@@ -0,0 +1 @@
+export { default } from "./ViewProfileGeneralBlock";
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileInfoTab/ViewProfileInfoTab.test.tsx b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileInfoTab/ViewProfileInfoTab.test.tsx
new file mode 100644
index 000000000..ff2e5fd9c
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileInfoTab/ViewProfileInfoTab.test.tsx
@@ -0,0 +1,54 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+import ViewProfileInfoTab from "./ViewProfileInfoTab";
+import { ProfileTypes } from "../../../../helpers";
+import { profiles } from "@/tests/mocks/profiles";
+
+vi.mock("../ViewProfileGeneralBlock", () => ({
+  default: () => <div>general block</div>,
+}));
+
+vi.mock("../ViewProfileDetailsBlock", () => ({
+  default: () => <div>details block</div>,
+}));
+
+vi.mock("../ViewProfileAssociationBlock", () => ({
+  default: () => <div>association block</div>,
+}));
+
+vi.mock("../ViewProfileScheduleBlock", () => ({
+  default: () => <div>schedule block</div>,
+}));
+
+const [profile] = profiles;
+
+describe("ViewProfileInfoTab", () => {
+  it.each([
+    [ProfileTypes.script],
+    [ProfileTypes.security],
+    [ProfileTypes.upgrade],
+    [ProfileTypes.reboot],
+  ])("renders schedule block for %s profile", async (type) => {
+    renderWithProviders(<ViewProfileInfoTab profile={profile} type={type} />);
+
+    expect(await screen.findByText("general block")).toBeInTheDocument();
+    expect(await screen.findByText("details block")).toBeInTheDocument();
+    expect(await screen.findByText("association block")).toBeInTheDocument();
+    expect(await screen.findByText("schedule block")).toBeInTheDocument();
+  });
+
+  it.each([
+    [ProfileTypes.package],
+    [ProfileTypes.repository],
+    [ProfileTypes.removal],
+    [ProfileTypes.wsl],
+  ])("does not render schedule block for %s profile", async (type) => {
+    renderWithProviders(<ViewProfileInfoTab profile={profile} type={type} />);
+
+    expect(await screen.findByText("general block")).toBeInTheDocument();
+    expect(await screen.findByText("details block")).toBeInTheDocument();
+    expect(await screen.findByText("association block")).toBeInTheDocument();
+    expect(screen.queryByText("schedule block")).not.toBeInTheDocument();
+  });
+});
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileInfoTab/ViewProfileInfoTab.tsx b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileInfoTab/ViewProfileInfoTab.tsx
new file mode 100644
index 000000000..345ba1fd8
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileInfoTab/ViewProfileInfoTab.tsx
@@ -0,0 +1,32 @@
+import { lazy, type FC } from "react";
+import type { Profile } from "../../../../types";
+import { hasSchedule, type ProfileTypes } from "../../../../helpers";
+import Blocks from "@/components/layout/Blocks";
+import ViewProfileGeneralBlock from "../ViewProfileGeneralBlock";
+import ViewProfileAssociationBlock from "../ViewProfileAssociationBlock";
+import ViewProfileDetailsBlock from "../ViewProfileDetailsBlock";
+
+const ViewProfileScheduleBlock = lazy(
+  async () => import("../ViewProfileScheduleBlock"),
+);
+
+interface ViewProfileInfoTabProps {
+  readonly profile: Profile;
+  readonly type: ProfileTypes;
+}
+
+const ViewProfileInfoTab: FC<ViewProfileInfoTabProps> = ({ profile, type }) => {
+  return (
+    <Blocks>
+      <ViewProfileGeneralBlock type={type} profile={profile} />
+
+      <ViewProfileDetailsBlock profile={profile} />
+
+      {hasSchedule(type) && <ViewProfileScheduleBlock profile={profile} />}
+
+      <ViewProfileAssociationBlock type={type} profile={profile} />
+    </Blocks>
+  );
+};
+
+export default ViewProfileInfoTab;
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileInfoTab/index.ts b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileInfoTab/index.ts
new file mode 100644
index 000000000..43cb466f2
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileInfoTab/index.ts
@@ -0,0 +1 @@
+export { default } from "./ViewProfileInfoTab";
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileScheduleBlock/ViewProfileScheduleBlock.test.tsx b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileScheduleBlock/ViewProfileScheduleBlock.test.tsx
new file mode 100644
index 000000000..527838ce1
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileScheduleBlock/ViewProfileScheduleBlock.test.tsx
@@ -0,0 +1,145 @@
+/* eslint-disable @typescript-eslint/no-magic-numbers */
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+import ViewProfileScheduleBlock from "./ViewProfileScheduleBlock";
+import { profiles } from "@/tests/mocks/profiles";
+
+vi.mock("./helpers", () => ({
+  getScheduleMessage: () => "Every Monday",
+  getLastRunData: () => "2024-01-01T12:00:00Z",
+  getNextRunData: () => "2024-01-02T12:00:00Z",
+}));
+
+const [baseProfile] = profiles;
+
+describe("ViewProfileScheduleBlock", () => {
+  it("renders trigger and last run for script profile", () => {
+    const scriptProfile = {
+      ...baseProfile,
+      script_id: 1,
+      trigger: {
+        trigger_type: "one_time",
+        next_run: "x",
+        last_run: "y",
+        timestamp: "z",
+      },
+      activities: { last_activity: { creation_time: "2024-01-01T12:00:00Z" } },
+    };
+
+    renderWithProviders(<ViewProfileScheduleBlock profile={scriptProfile} />);
+
+    expect(
+      screen.getByRole("heading", { name: /Running schedule/i }),
+    ).toBeInTheDocument();
+    expect(screen.getByText(/Trigger/i)).toBeInTheDocument();
+    expect(screen.getByText(/Every Monday/i)).toBeInTheDocument();
+    expect(screen.getByText(/Last run/i)).toBeInTheDocument();
+    expect(screen.getByText(/Next run/i)).toBeInTheDocument();
+
+    expect(screen.queryByText(/^Schedule$/i)).not.toBeInTheDocument();
+    expect(
+      screen.queryByText(/Delivery delay window/i),
+    ).not.toBeInTheDocument();
+  });
+
+  it("renders last run for security profile", () => {
+    const securityProfile = {
+      ...baseProfile,
+      benchmark: "cis_level1_server",
+      mode: "audit-fix",
+      restart_deliver_delay: 2,
+      restart_deliver_delay_window: 30,
+      next_run_time: "2024-01-02T12:00:00Z",
+      last_run_results: { timestamp: "2024-01-01T12:00:00Z" },
+      status: "active",
+    };
+
+    renderWithProviders(<ViewProfileScheduleBlock profile={securityProfile} />);
+
+    expect(
+      screen.getByRole("heading", { name: /Running schedule/i }),
+    ).toBeInTheDocument();
+    expect(screen.getByText(/^Schedule$/i)).toBeInTheDocument();
+    expect(screen.getByText(/Last run/i)).toBeInTheDocument();
+    expect(screen.getByText(/Next run/i)).toBeInTheDocument();
+    expect(screen.getByText(/Jan 02, 2024, 12:00 UTC/i)).toBeInTheDocument();
+
+    expect(screen.queryByText(/Restart schedule/i)).not.toBeInTheDocument();
+    expect(
+      screen.queryByText(/Delivery delay window/i),
+    ).not.toBeInTheDocument();
+  });
+
+  it("renders restart schedule for audit-fix-restart security mode", () => {
+    const securityProfile = {
+      ...baseProfile,
+      benchmark: "cis_level1_server",
+      mode: "audit-fix-restart",
+      restart_deliver_delay: 2,
+      restart_deliver_delay_window: 30,
+      next_run_time: "2024-01-02T12:00:00Z",
+      last_run_results: { timestamp: "2024-01-01T12:00:00Z" },
+      status: "active",
+    };
+
+    renderWithProviders(<ViewProfileScheduleBlock profile={securityProfile} />);
+
+    expect(screen.getByText(/Restart schedule/i)).toBeInTheDocument();
+    expect(
+      screen.getByText(
+        /Delayed by 2 hours, randomize delivery over 30 minutes/i,
+      ),
+    ).toBeInTheDocument();
+  });
+
+  it("renders next restart for reboot profile", () => {
+    const securityProfile = {
+      ...baseProfile,
+      next_run: "",
+      schedule: "",
+      deliver_within: 40,
+      deliver_delay_window: 15,
+      num_computers: 7,
+    };
+
+    renderWithProviders(<ViewProfileScheduleBlock profile={securityProfile} />);
+    expect(
+      screen.getByRole("heading", { name: /Running schedule/i }),
+    ).toBeInTheDocument();
+    expect(screen.getByText(/^Schedule$/i)).toBeInTheDocument();
+    expect(screen.getByText(/Next restart/i)).toBeInTheDocument();
+
+    expect(screen.queryByText(/Next run/i)).not.toBeInTheDocument();
+    expect(screen.queryByText(/Restart schedule/i)).not.toBeInTheDocument();
+    expect(
+      screen.queryByText(/Delivery delay window/i),
+    ).not.toBeInTheDocument();
+    expect(screen.queryByText(/Last run/i)).not.toBeInTheDocument();
+  });
+
+  it("renders delivery delay window for upgrade profile", () => {
+    const upgradeProfile = {
+      ...baseProfile,
+      upgrade_type: "all",
+      at_minute: `${20}`,
+      deliver_delay_window: `${30}`,
+      every: "week",
+      next_run: "string",
+      at_hour: `${12}`,
+      on_days: ["mo"],
+    };
+
+    renderWithProviders(<ViewProfileScheduleBlock profile={upgradeProfile} />);
+
+    expect(
+      screen.getByRole("heading", { name: /Running schedule/i }),
+    ).toBeInTheDocument();
+    expect(screen.getByText(/^Schedule$/i)).toBeInTheDocument();
+    expect(screen.getByText(/Delivery delay window/i)).toBeInTheDocument();
+    expect(screen.getByText(/Next run/i)).toBeInTheDocument();
+
+    expect(screen.queryByText(/Restart schedule/i)).not.toBeInTheDocument();
+    expect(screen.queryByText(/Last run/i)).not.toBeInTheDocument();
+  });
+});
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileScheduleBlock/ViewProfileScheduleBlock.tsx b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileScheduleBlock/ViewProfileScheduleBlock.tsx
new file mode 100644
index 000000000..07c00547a
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileScheduleBlock/ViewProfileScheduleBlock.tsx
@@ -0,0 +1,94 @@
+import InfoGrid from "@/components/layout/InfoGrid";
+import type { FC } from "react";
+import type { Profile } from "../../../../types";
+import {
+  hasLastRunData,
+  isPostEnrollmentScriptProfile,
+  isProfileArchived,
+  isRebootProfile,
+  isScriptProfile,
+  isSecurityProfile,
+  isUpgradeProfile,
+} from "../../../../helpers";
+import Blocks from "@/components/layout/Blocks";
+import { DISPLAY_DATE_TIME_FORMAT } from "@/constants";
+import moment from "moment";
+import { getLastRunData, getNextRunData, getScheduleMessage } from "./helpers";
+import { pluralizeWithCount } from "@/utils/_helpers";
+
+interface ViewProfileScheduleBlockProps {
+  readonly profile: Profile;
+}
+
+const ViewProfileScheduleBlock: FC<ViewProfileScheduleBlockProps> = ({
+  profile,
+}) => {
+  const scheduleLabel = isScriptProfile(profile) ? "Trigger" : "Schedule";
+  const lastRun = getLastRunData(profile);
+  const hasNextRun =
+    !isProfileArchived(profile) && !isPostEnrollmentScriptProfile(profile);
+  const nextRun = getNextRunData(profile);
+  const nextLabel = isRebootProfile(profile) ? "Next restart" : "Next run";
+
+  return (
+    <Blocks.Item title="Running schedule">
+      <InfoGrid dense>
+        <InfoGrid.Item
+          label={scheduleLabel}
+          large
+          value={getScheduleMessage(profile)}
+        />
+
+        {hasLastRunData(profile) && (
+          <InfoGrid.Item
+            label="Last run"
+            value={
+              lastRun
+                ? `${moment(lastRun).utc().format(DISPLAY_DATE_TIME_FORMAT)} UTC`
+                : null
+            }
+          />
+        )}
+
+        {isUpgradeProfile(profile) && (
+          <InfoGrid.Item
+            label="Delivery delay window"
+            value={`${pluralizeWithCount(
+              Number(profile.deliver_delay_window),
+              "minute",
+            )}`}
+          />
+        )}
+
+        {hasNextRun && (
+          <InfoGrid.Item
+            label={nextLabel}
+            value={
+              nextRun
+                ? `${moment(nextRun).utc().format(DISPLAY_DATE_TIME_FORMAT)} UTC`
+                : null
+            }
+          />
+        )}
+
+        {isSecurityProfile(profile) && profile.mode == "audit-fix-restart" && (
+          <InfoGrid.Item
+            label="Restart schedule"
+            large
+            value={`${
+              profile.restart_deliver_delay
+                ? `Delayed by ${pluralizeWithCount(profile.restart_deliver_delay, "hour")}`
+                : "As soon as possible"
+            }${
+              profile.restart_deliver_delay_window
+                ? `, randomize delivery over ${pluralizeWithCount(profile.restart_deliver_delay_window, "minute")}`
+                : ""
+            }`}
+          />
+        )}
+      </InfoGrid>
+    </Blocks.Item>
+  );
+};
+
+export default ViewProfileScheduleBlock;
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileScheduleBlock/helpers.ts b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileScheduleBlock/helpers.ts
new file mode 100644
index 000000000..8d5a653c5
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileScheduleBlock/helpers.ts
@@ -0,0 +1,133 @@
+import { hasProperty, pluralizeWithCount } from "@/utils/_helpers";
+import {
+  getTriggerText,
+  isRebootProfile,
+  isScriptProfile,
+  isSecurityProfile,
+  isUpgradeProfile,
+} from "../../../../helpers";
+import type { Profile } from "../../../../types";
+import type { UpgradeProfile } from "@/features/upgrade-profiles";
+import type { RebootProfile } from "@/features/reboot-profiles";
+import { getSecuritySchedule } from "@/features/security-profiles";
+
+const WEEKDAY_MAP = {
+  mo: "Monday",
+  tu: "Tuesday",
+  we: "Wednesday",
+  th: "Thursday",
+  fr: "Friday",
+  sa: "Saturday",
+  su: "Sunday",
+};
+
+const getScheduledDays = (onDays: string[]) => {
+  if (onDays.length === 7) {
+    return "Every day";
+  }
+  return onDays
+    .map((code) => code.toLowerCase())
+    .filter((value) => hasProperty(WEEKDAY_MAP, value))
+    .map((code) => WEEKDAY_MAP[code])
+    .join(", ");
+};
+
+const getUpgradeSchedule = (profile: UpgradeProfile) => {
+  const { at_hour, every, on_days } = profile;
+
+  let scheduleMessage = "Every ";
+
+  const atMinute = parseInt(profile.at_minute);
+
+  if (every === "hour") {
+    scheduleMessage += `hour at ${pluralizeWithCount(atMinute, "minute")}`;
+
+    if (on_days) {
+      scheduleMessage += ` on ${getScheduledDays(on_days)}`;
+    }
+  }
+
+  if (every === "week") {
+    if (!on_days || !at_hour) {
+      return "Every week";
+    }
+
+    const atHour = parseInt(at_hour);
+
+    scheduleMessage += `${getScheduledDays(on_days)} at ${atHour > 9 ? atHour : `0${atHour}`}:${atMinute > 9 ? atMinute : `0${atMinute}`} UTC`;
+  }
+
+  return scheduleMessage;
+};
+
+const parseSchedule = (schedule: string) => {
+  const map = new Map(
+    schedule.split(";").map((part) => {
+      const [key, value] = part.split("=", 2) as [string, string | undefined];
+
+      return [key.toUpperCase(), value];
+    }),
+  );
+
+  const freq = map.get("FREQ")?.toLowerCase() ?? "";
+  const at_hour = parseInt(map.get("BYHOUR") ?? "");
+  const at_minute = parseInt(map.get("BYMINUTE") ?? "");
+  const on_days = (map.get("BYDAY") ?? "").split(",");
+
+  return {
+    freq,
+    at_hour,
+    at_minute,
+    on_days,
+  };
+};
+
+const getRebootSchedule = (profile: RebootProfile): string => {
+  const { freq, on_days, at_hour, at_minute } = parseSchedule(profile.schedule);
+
+  if (freq !== "weekly" || !on_days.length) {
+    return "One-time";
+  }
+
+  const days = getScheduledDays(on_days);
+
+  return `${days} at ${at_hour}:${at_minute} UTC`;
+};
+
+export const getScheduleMessage = (profile: Profile) => {
+  if (isRebootProfile(profile)) {
+    return getRebootSchedule(profile);
+  }
+  if (isUpgradeProfile(profile)) {
+    return getUpgradeSchedule(profile);
+  }
+  if (isSecurityProfile(profile)) {
+    return getSecuritySchedule(profile);
+  }
+  if (isScriptProfile(profile)) {
+    return getTriggerText(profile, true);
+  }
+};
+
+export const getLastRunData = (profile: Profile) => {
+  if (isScriptProfile(profile)) {
+    return profile.activities.last_activity?.creation_time ?? null;
+  }
+  if (isSecurityProfile(profile)) {
+    return profile.last_run_results.timestamp;
+  }
+  return null;
+};
+
+export const getNextRunData = (profile: Profile) => {
+  if (isScriptProfile(profile) && profile.trigger.trigger_type !== "event") {
+    return profile.trigger.next_run;
+  }
+  if (isSecurityProfile(profile)) {
+    return profile.next_run_time;
+  }
+  if (isRebootProfile(profile) || isUpgradeProfile(profile)) {
+    return profile.next_run;
+  }
+  return null;
+};
diff --git a/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileScheduleBlock/index.ts b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileScheduleBlock/index.ts
new file mode 100644
index 000000000..5b61a7925
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/components/ViewProfileScheduleBlock/index.ts
@@ -0,0 +1 @@
+export { default } from "./ViewProfileScheduleBlock";
diff --git a/src/features/profiles/components/ViewProfileSidePanel/helpers.ts b/src/features/profiles/components/ViewProfileSidePanel/helpers.ts
new file mode 100644
index 000000000..0bea1e83d
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/helpers.ts
@@ -0,0 +1,36 @@
+import { ProfileTypes } from "../../helpers";
+
+export type TabTypes =
+  | "info"
+  | "activity-history"
+  | "package-constraints"
+  | "pockets"
+  | "apt-sources";
+
+export const getTabs = (type: ProfileTypes) => {
+  const tabs: { label: string; id: TabTypes }[] = [
+    {
+      label: "Info",
+      id: "info",
+    },
+  ];
+
+  if (type === ProfileTypes.script) {
+    tabs.push({
+      label: "Activity history",
+      id: "activity-history",
+    });
+  } else if (type === ProfileTypes.package) {
+    tabs.push({
+      label: "Package constraints",
+      id: "package-constraints",
+    });
+  } else if (type === ProfileTypes.repository) {
+    tabs.push({
+      label: "APT sources",
+      id: "apt-sources",
+    });
+  }
+
+  return tabs;
+};
diff --git a/src/features/profiles/components/ViewProfileSidePanel/index.ts b/src/features/profiles/components/ViewProfileSidePanel/index.ts
new file mode 100644
index 000000000..5e7094e79
--- /dev/null
+++ b/src/features/profiles/components/ViewProfileSidePanel/index.ts
@@ -0,0 +1 @@
+export { default } from "./ViewProfileSidePanel";
diff --git a/src/features/profiles/helpers.ts b/src/features/profiles/helpers.ts
new file mode 100644
index 000000000..bc417db55
--- /dev/null
+++ b/src/features/profiles/helpers.ts
@@ -0,0 +1,129 @@
+import type { RepositoryProfile } from "../repository-profiles";
+import type { ScriptProfile } from "../script-profiles";
+import type { RebootProfile } from "../reboot-profiles";
+import type { WslProfile } from "../wsl-profiles";
+import type { PackageProfile } from "../package-profiles";
+import type { UpgradeProfile } from "../upgrade-profiles";
+import type { SecurityProfile } from "../security-profiles";
+import type { RemovalProfile } from "../removal-profiles";
+import type { Profile } from "./types";
+import { toCronPhrase } from "@/components/form/CronSchedule/components/CronSchedule/helpers";
+
+export enum ProfileTypes {
+  package = "package",
+  reboot = "reboot",
+  removal = "removal",
+  repository = "repository",
+  script = "script",
+  security = "security",
+  upgrade = "upgrade",
+  wsl = "WSL",
+}
+
+export const getTriggerText = (profile: ScriptProfile, long = false) => {
+  switch (profile.trigger.trigger_type) {
+    case "event":
+      return "Post enrollment";
+    case "one_time":
+      return "On a date";
+    case "recurring": {
+      if (long) {
+        return `Recurring, ${toCronPhrase(profile.trigger.interval)}`;
+      }
+      return "Recurring";
+    }
+  }
+};
+
+export function isScriptProfile(profile: Profile): profile is ScriptProfile {
+  return "script_id" in profile;
+}
+
+export function isSecurityProfile(
+  profile: Profile,
+): profile is SecurityProfile {
+  return "benchmark" in profile;
+}
+
+export function isRebootProfile(profile: Profile): profile is RebootProfile {
+  return ["num_computers", "schedule", "next_run"].every(
+    (key) => key in profile,
+  );
+}
+
+export function isUpgradeProfile(profile: Profile): profile is UpgradeProfile {
+  return "upgrade_type" in profile;
+}
+
+export function isPackageProfile(profile: Profile): profile is PackageProfile {
+  return "constraints" in profile;
+}
+
+export function isRemovalProfile(profile: Profile): profile is RemovalProfile {
+  return "days_without_exchange" in profile;
+}
+
+export function isRepositoryProfile(
+  profile: Profile,
+): profile is RepositoryProfile {
+  return "apt_sources" in profile;
+}
+
+export function isWslProfile(profile: Profile): profile is WslProfile {
+  return "image_name" in profile;
+}
+
+export const canDuplicateProfile = (
+  profile: Profile,
+): profile is RebootProfile | PackageProfile | SecurityProfile =>
+  isRebootProfile(profile) ||
+  isPackageProfile(profile) ||
+  isSecurityProfile(profile);
+
+export const hasComplianceData = (
+  profile: Profile,
+): profile is WslProfile | PackageProfile =>
+  isWslProfile(profile) || isPackageProfile(profile);
+
+export const usesNameAsIdentifier = (
+  profile: Profile,
+): profile is WslProfile | PackageProfile | RepositoryProfile =>
+  isWslProfile(profile) ||
+  isPackageProfile(profile) ||
+  isRepositoryProfile(profile);
+
+export const hasLastRunData = (
+  profile: Profile,
+): profile is ScriptProfile | SecurityProfile =>
+  isScriptProfile(profile) || isSecurityProfile(profile);
+
+export const hasAssociations = (profile: Profile) =>
+  !!profile.tags.length || profile.all_computers;
+
+export const isProfileArchived = (profile: Profile) =>
+  profile.status === "archived" || !!profile.archived;
+
+export const isPostEnrollmentScriptProfile = (profile: Profile) =>
+  isScriptProfile(profile) && profile.trigger.trigger_type === "event";
+
+export const hasSchedule = (type: ProfileTypes) =>
+  [
+    ProfileTypes.script,
+    ProfileTypes.reboot,
+    ProfileTypes.upgrade,
+    ProfileTypes.security,
+  ].includes(type);
+
+export const hasDescription = (type: ProfileTypes) =>
+  [ProfileTypes.repository, ProfileTypes.wsl, ProfileTypes.package].includes(
+    type,
+  );
+
+export const canArchiveProfile = (type: ProfileTypes) =>
+  [ProfileTypes.security, ProfileTypes.script].includes(type);
+
+export const hasApiSearch = (type: ProfileTypes) =>
+  [ProfileTypes.script, ProfileTypes.security, ProfileTypes.wsl].includes(type);
+
+export const hasComplianceColumns = (type: ProfileTypes) =>
+  [ProfileTypes.wsl, ProfileTypes.package].includes(type);
diff --git a/src/features/profiles/hooks/index.ts b/src/features/profiles/hooks/index.ts
new file mode 100644
index 000000000..93b9ac988
--- /dev/null
+++ b/src/features/profiles/hooks/index.ts
@@ -0,0 +1,3 @@
+export { useOpenProfileSidePanel } from "./useOpenProfileSidePanel";
+export { useGetProfileAssociatedCount } from "./useGetProfileAssociatedCount";
+export { useGetProfileActions } from "./useGetProfileActions";
diff --git a/src/features/profiles/hooks/useGetProfileActions.ts b/src/features/profiles/hooks/useGetProfileActions.ts
new file mode 100644
index 000000000..7fe69a8cc
--- /dev/null
+++ b/src/features/profiles/hooks/useGetProfileActions.ts
@@ -0,0 +1,178 @@
+import type { Action } from "@/types/Action";
+import { ICONS } from "@canonical/react-components";
+import {
+  isSecurityProfile,
+  isPackageProfile,
+  canDuplicateProfile,
+  canArchiveProfile,
+  isProfileArchived,
+  type ProfileTypes,
+} from "../helpers";
+import useDebug from "@/hooks/useDebug";
+import { useNavigate } from "react-router";
+import useNotify from "@/hooks/useNotify";
+import { useRunSecurityProfile } from "@/features/security-profiles";
+import { ROUTES } from "@/libs/routes";
+import { useOpenProfileSidePanel } from "./useOpenProfileSidePanel";
+import type { SecurityProfileMode } from "@/features/security-profiles";
+import useProfiles from "@/hooks/useProfiles";
+import type { Profile } from "../types";
+
+interface UseGetProfileActionsProps {
+  readonly profile: Profile;
+  readonly type: ProfileTypes;
+  readonly openModal: () => void;
+}
+
+export const useGetProfileActions = ({
+  profile,
+  type,
+  openModal,
+}: UseGetProfileActionsProps) => {
+  const openProfileSidePanel = useOpenProfileSidePanel();
+  const { runSecurityProfile } = useRunSecurityProfile();
+  const { isProfileLimitReached } = useProfiles();
+  const debug = useDebug();
+  const navigate = useNavigate();
+  const { notify } = useNotify();
+
+  const getNotificationMessage = (mode: SecurityProfileMode) => {
+    switch (mode) {
+      case "audit-fix-restart":
+        return "Applying remediation fixes, restarting associated instances, and generating an audit have been queued in Activities.";
+      case "audit":
+        return "Generating an audit has been queued in Activities.";
+      default:
+        return "Applying remediation fixes and generating an audit have been queued in Activities.";
+    }
+  };
+
+  const handleRunSecurityProfile = async (mode: SecurityProfileMode) => {
+    try {
+      const { data: activity } = await runSecurityProfile({ id: profile.id });
+
+      const message = getNotificationMessage(mode);
+
+      notify.success({
+        title: `You have successfully initiated run of the ${profile.title} security profile`,
+        message,
+        actions: [
+          {
+            label: "View details",
+            onClick: () => {
+              navigate(
+                ROUTES.activities.root({
+                  query: `parent-id:${activity.id}`,
+                }),
+              );
+            },
+          },
+        ],
+      });
+    } catch (error) {
+      debug(error);
+    }
+  };
+
+  const view: Action = {
+    icon: "show",
+    label: "View details",
+    "aria-label": `View ${profile.title} ${type} profile details`,
+    onClick: () => {
+      openProfileSidePanel(profile, "view");
+    },
+  };
+
+  const actions: Action[] = [
+    {
+      icon: "edit",
+      label: "Edit",
+      "aria-label": `Edit ${profile.title} ${type} profile`,
+      onClick: () => {
+        openProfileSidePanel(profile, "edit");
+      },
+    },
+  ];
+
+  if (isPackageProfile(profile)) {
+    actions.push({
+      icon: "edit",
+      label: "Edit package constraints",
+      "aria-label": `Edit ${profile.title} profile package constraints`,
+      onClick: () => {
+        openProfileSidePanel(profile, "edit-constraints");
+      },
+    });
+  }
+
+  if (isSecurityProfile(profile)) {
+    actions.push(
+      {
+        icon: "begin-downloading",
+        label: "Download audit",
+        "aria-label": `Download ${profile.title} security profile audit`,
+        onClick: () => {
+          openProfileSidePanel(profile, "download");
+        },
+      },
+      {
+        icon: "play",
+        label: "Run",
+        "aria-label": `Run ${profile.title} security profile`,
+        onClick: async () => {
+          if (!profile.mode.includes("fix")) {
+            await handleRunSecurityProfile(profile.mode);
+            return;
+          }
+          openProfileSidePanel(profile, "run");
+        },
+        disabled: !profile.associated_instances,
+      },
+    );
+  }
+
+  if (canDuplicateProfile(profile)) {
+    actions.push({
+      icon: "canvas",
+      label: "Duplicate",
+      "aria-label": `Duplicate ${profile.title} ${type} profile`,
+      onClick: () => {
+        openProfileSidePanel(profile, "duplicate");
+      },
+      disabled: isProfileLimitReached,
+    });
+  }
+
+  if (isProfileArchived(profile)) {
+    const filteredActions = actions.filter(
+      ({ label }) => label !== "Edit" && label !== "Run",
+    );
+
+    return {
+      viewAction: view,
+      actions: filteredActions,
+    };
+  }
+
+  const remove: Action = canArchiveProfile(type)
+    ? {
+        icon: "archive",
+        label: "Archive",
+        "aria-label": `Archive ${profile.title} ${type} profile`,
+        onClick: openModal,
+        appearance: "negative",
+      }
+    : {
+        icon: ICONS.delete,
+        label: "Remove",
+        "aria-label": `Remove ${profile.title} ${type} profile`,
+        onClick: openModal,
+        appearance: "negative",
+      };
+
+  return {
+    viewAction: view,
+    actions: actions,
+    destructiveActions: [remove],
+  };
+};
diff --git a/src/features/profiles/hooks/useGetProfileAssociatedCount.ts b/src/features/profiles/hooks/useGetProfileAssociatedCount.ts
new file mode 100644
index 000000000..11a0141e6
--- /dev/null
+++ b/src/features/profiles/hooks/useGetProfileAssociatedCount.ts
@@ -0,0 +1,51 @@
+import { useGetInstances } from "@/features/instances";
+import {
+  isRemovalProfile,
+  isScriptProfile,
+  isUpgradeProfile,
+  hasComplianceData,
+  isRebootProfile,
+  isRepositoryProfile,
+  isSecurityProfile,
+  hasAssociations,
+} from "../helpers";
+import type { Profile } from "../types";
+
+export const useGetProfileAssociatedCount = (profile: Profile) => {
+  const isAssociationQueryEnabled =
+    isRepositoryProfile(profile) && hasAssociations(profile);
+
+  const { instancesCount = 0, isGettingInstances } = useGetInstances(
+    {
+      limit: 1,
+      query: `profile:repository:${profile.id}`,
+    },
+    { listenToUrlParams: false },
+    { enabled: isAssociationQueryEnabled },
+  );
+
+  const getAssociationFromProfile = () => {
+    if (
+      isRemovalProfile(profile) ||
+      isScriptProfile(profile) ||
+      isUpgradeProfile(profile)
+    ) {
+      return profile.computers.num_associated_computers;
+    }
+    if (hasComplianceData(profile)) {
+      return profile.computers.constrained.length;
+    }
+    if (isRebootProfile(profile)) {
+      return profile.num_computers;
+    }
+    if (isSecurityProfile(profile)) {
+      return profile.associated_instances;
+    }
+    return instancesCount;
+  };
+
+  return {
+    associatedCount: getAssociationFromProfile(),
+    isGettingInstances: isAssociationQueryEnabled ? isGettingInstances : false,
+  };
+};
diff --git a/src/features/profiles/hooks/useOpenProfileSidePanel.ts b/src/features/profiles/hooks/useOpenProfileSidePanel.ts
new file mode 100644
index 000000000..6d0556dea
--- /dev/null
+++ b/src/features/profiles/hooks/useOpenProfileSidePanel.ts
@@ -0,0 +1,22 @@
+import type { Profile, ProfileActions } from "../types";
+import usePageParams from "@/hooks/usePageParams";
+import { usesNameAsIdentifier } from "../helpers";
+
+export const useOpenProfileSidePanel = () => {
+  const { sidePath, setPageParams, createSidePathPusher } = usePageParams();
+
+  return (profile: Profile, action: ProfileActions) => {
+    const profileIdentifier = usesNameAsIdentifier(profile)
+      ? profile.name
+      : `${profile.id}`;
+
+    if (!sidePath.length || action === "view") {
+      setPageParams({
+        sidePath: [action],
+        profile: profileIdentifier,
+      });
+    } else {
+      createSidePathPusher(action)();
+    }
+  };
+};
diff --git a/src/features/profiles/index.ts b/src/features/profiles/index.ts
new file mode 100644
index 000000000..c58f4fe1c
--- /dev/null
+++ b/src/features/profiles/index.ts
@@ -0,0 +1,14 @@
+export { default as AddProfileButton } from "./components/AddProfileButton";
+export { default as ViewProfileSidePanel } from "./components/ViewProfileSidePanel";
+export { default as ProfilesContainer } from "./components/ProfilesContainer";
+export { default as ProfilesEmptyState } from "./components/ProfilesEmptyState";
+export { default as ProfilesHeader } from "./components/ProfilesHeader";
+export { default as ProfilesList } from "./components/ProfilesList";
+export { default as ProfilesListActions } from "./components/ProfilesList/components/ProfilesListActions";
+export { default as RemoveProfileModal } from "./components/RemoveProfileModal";
+
+export { useOpenProfileSidePanel } from "./hooks";
+
+export { ProfileTypes } from "./helpers";
+
+export type { Profile, ComplianceInstanceCounts } from "./types";
diff --git a/src/features/profiles/types/Profiles.ts b/src/features/profiles/types/Profiles.ts
new file mode 100644
index 000000000..a3676f02f
--- /dev/null
+++ b/src/features/profiles/types/Profiles.ts
@@ -0,0 +1,23 @@
+export type ProfileActions =
+  | "edit"
+  | "edit-constraints"
+  | "run"
+  | "download"
+  | "duplicate"
+  | "view";
+
+export interface ComplianceInstanceCounts {
+  constrained: number[];
+  "non-compliant": number[];
+  pending: number[];
+}
+
+export interface Profile extends Record<string, unknown> {
+  access_group: string;
+  all_computers: boolean;
+  description?: string;
+  id: number;
+  name: string;
+  tags: string[];
+  title: string;
+}
diff --git a/src/features/profiles/types/index.ts b/src/features/profiles/types/index.ts
new file mode 100644
index 000000000..3d24114e5
--- /dev/null
+++ b/src/features/profiles/types/index.ts
@@ -0,0 +1,5 @@
+export type {
+  Profile,
+  ProfileActions,
+  ComplianceInstanceCounts,
+} from "./Profiles";
diff --git a/src/features/repository-profiles/hooks/index.ts b/src/features/repository-profiles/api/index.ts
similarity index 51%
rename from src/features/repository-profiles/hooks/index.ts
rename to src/features/repository-profiles/api/index.ts
index 9be55ef80..348c435df 100644
--- a/src/features/repository-profiles/hooks/index.ts
+++ b/src/features/repository-profiles/api/index.ts
@@ -1,2 +1,4 @@
 export { default as useRepositoryProfiles } from "./useRepositoryProfiles";
 export type { CreateRepositoryProfileParams } from "./useRepositoryProfiles";
+export { useGetProfileInstancesCount } from "./useGetProfileInstancesCount";
+export { useGetRepositoryProfile } from "./useGetRepositoryProfile";
diff --git a/src/features/repository-profiles/api/useGetProfileInstancesCount.ts b/src/features/repository-profiles/api/useGetProfileInstancesCount.ts
new file mode 100644
index 000000000..45eec8e97
--- /dev/null
+++ b/src/features/repository-profiles/api/useGetProfileInstancesCount.ts
@@ -0,0 +1,30 @@
+import useFetch from "@/hooks/useFetch";
+import type { ApiError } from "@/types/api/ApiError";
+import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
+import type { Instance } from "@/types/Instance";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+
+export const useGetProfileInstancesCount = (profileId: number) => {
+  const authFetch = useFetch();
+
+  const { data: response, isPending } = useQuery<
+    AxiosResponse<ApiPaginatedResponse<Instance>>,
+    AxiosError<ApiError>
+  >({
+    queryKey: ["profileInstancesCount", profileId],
+    queryFn: async () =>
+      authFetch.get("computers", {
+        params: {
+          query: `profile:repository:${profileId}`,
+          root_only: false,
+          limit: 1
+        },
+      }),
+  });
+
+  return {
+    associatedCount: response?.data.count ?? 0,
+    isLoadingCount: isPending,
+  };
+};
diff --git a/src/features/repository-profiles/api/useGetRepositoryProfile.ts b/src/features/repository-profiles/api/useGetRepositoryProfile.ts
new file mode 100644
index 000000000..8319fb178
--- /dev/null
+++ b/src/features/repository-profiles/api/useGetRepositoryProfile.ts
@@ -0,0 +1,22 @@
+import useFetch from "@/hooks/useFetch";
+import type { ApiError } from "@/types/api/ApiError";
+import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
+import { useSuspenseQuery } from "@tanstack/react-query";
+import type { AxiosError } from "axios";
+import type { RepositoryProfile } from "../types";
+
+export function useGetRepositoryProfile(name: string) {
+  const authFetch = useFetch();
+
+  return useSuspenseQuery<RepositoryProfile, AxiosError<ApiError>>({
+    queryKey: ["repositoryProfile", name],
+    queryFn: async () => {
+      const response = await authFetch.get<ApiPaginatedResponse<RepositoryProfile>>("repositoryprofiles");
+      const profile = response.data.results.find((p) => p.name === name);
+
+      if (!profile) throw new Error(`Repository profile "${name}" not found`);
+
+      return profile;
+    },
+  });
+}
diff --git a/src/features/repository-profiles/hooks/useRepositoryProfiles.ts b/src/features/repository-profiles/api/useRepositoryProfiles.ts
similarity index 79%
rename from src/features/repository-profiles/hooks/useRepositoryProfiles.ts
rename to src/features/repository-profiles/api/useRepositoryProfiles.ts
index dbbf09ae5..b4397979e 100644
--- a/src/features/repository-profiles/hooks/useRepositoryProfiles.ts
+++ b/src/features/repository-profiles/api/useRepositoryProfiles.ts
@@ -1,4 +1,5 @@
 import type { Activity } from "@/features/activities";
+import type { APTSource } from "@/features/apt-sources";
 import useFetch from "@/hooks/useFetch";
 import useFetchOld from "@/hooks/useFetchOld";
 import type { ApiError } from "@/types/api/ApiError";
@@ -18,7 +19,7 @@ export interface CreateRepositoryProfileParams {
   title: string;
   access_group?: string;
   all_computers?: boolean;
-  apt_sources?: number[];
+  apt_sources?: APTSource[];
   description?: string;
   pockets?: number[];
   tags?: string[];
@@ -27,7 +28,8 @@ export interface CreateRepositoryProfileParams {
 interface EditRepositoryProfileParams {
   name: string;
   all_computers?: boolean;
-  apt_sources?: number[];
+  add_apt_sources?: APTSource[];
+  remove_apt_sources?: number[];
   description?: string;
   pockets?: number[];
   tags?: string[];
@@ -64,7 +66,15 @@ export default function useRepositoryProfiles() {
     AxiosError<ApiError>,
     CreateRepositoryProfileParams
   >({
-    mutationFn: async (params) => authFetch.post("repositoryprofiles", params),
+    mutationFn: async ({ apt_sources, ...params }) =>
+      authFetch.post("repositoryprofiles", {
+        ...params,
+        apt_sources: apt_sources?.map(({ name: sourceName, line, gpg_key }) => ({
+          name: sourceName,
+          line,
+          gpg_key: gpg_key ? { content: gpg_key } : null,
+        })),
+      }),
     onSuccess: async () => {
       queryClient.invalidateQueries({
         queryKey: ["aptSources"],
@@ -79,8 +89,15 @@ export default function useRepositoryProfiles() {
     AxiosError<ApiError>,
     EditRepositoryProfileParams
   >({
-    mutationFn: async ({ name, ...params }) =>
-      authFetch.put(`repositoryprofiles/${name}`, params),
+    mutationFn: async ({ name, add_apt_sources, ...params }) =>
+      authFetch.put(`repositoryprofiles/${name}`, {
+        ...params,
+        add_apt_sources: add_apt_sources?.map(({ name: sourceName, line, gpg_key }) => ({
+          name: sourceName,
+          line,
+          gpg_key: gpg_key ? { content: gpg_key } : null,
+        })),
+      }),
     onSuccess: async () => {
       queryClient.invalidateQueries({
         queryKey: ["aptSources"],
diff --git a/src/features/repository-profiles/components/RepositoryProfileAddButton/RepositoryProfileAddButton.test.tsx b/src/features/repository-profiles/components/RepositoryProfileAddButton/RepositoryProfileAddButton.test.tsx
new file mode 100644
index 000000000..d4ad77e40
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileAddButton/RepositoryProfileAddButton.test.tsx
@@ -0,0 +1,29 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it } from "vitest";
+import RepositoryProfileAddButton from "./RepositoryProfileAddButton";
+
+describe("RepositoryProfileAddButton", () => {
+  const user = userEvent.setup();
+
+  it("renders button with correct label", () => {
+    renderWithProviders(<RepositoryProfileAddButton />);
+
+    expect(
+      screen.getByRole("button", { name: /Add repository profile/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("opens add repository profile form in side panel on click", async () => {
+    renderWithProviders(<RepositoryProfileAddButton />);
+
+    await user.click(
+      screen.getByRole("button", { name: /Add repository profile/i }),
+    );
+
+    expect(
+      await screen.findByRole("heading", { name: "Add repository profile" }),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/repository-profiles/components/RepositoryProfileAddButton/RepositoryProfileAddButton.tsx b/src/features/repository-profiles/components/RepositoryProfileAddButton/RepositoryProfileAddButton.tsx
index 3c3d6fe57..0577d3ed8 100644
--- a/src/features/repository-profiles/components/RepositoryProfileAddButton/RepositoryProfileAddButton.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileAddButton/RepositoryProfileAddButton.tsx
@@ -1,6 +1,6 @@
 import LoadingState from "@/components/layout/LoadingState";
 import useSidePanel from "@/hooks/useSidePanel";
-import { Button } from "@canonical/react-components";
+import { Button, Icon } from "@canonical/react-components";
 import { lazy, Suspense, type FC } from "react";
 
 const RepositoryProfileForm = lazy(
@@ -26,8 +26,10 @@ const RepositoryProfileAddButton: FC = () => {
       key="add"
       onClick={handleAddProfile}
       type="button"
+      hasIcon
     >
-      Add repository profile
+      <Icon name="plus" light={true} />
+      <span>Add repository profile</span>
     </Button>
   );
 };
diff --git a/src/features/repository-profiles/components/RepositoryProfileContainer/RepositoryProfileContainer.test.tsx b/src/features/repository-profiles/components/RepositoryProfileContainer/RepositoryProfileContainer.test.tsx
new file mode 100644
index 000000000..b41d06ff7
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileContainer/RepositoryProfileContainer.test.tsx
@@ -0,0 +1,115 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
+import { expectLoadingState } from "@/tests/helpers";
+import { repositoryProfiles } from "@/tests/mocks/repositoryProfiles";
+import { renderWithProviders } from "@/tests/render";
+import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
+import type { UseQueryResult } from "@tanstack/react-query";
+import { screen } from "@testing-library/react";
+import type { AxiosResponse } from "axios";
+import { describe, expect, it } from "vitest";
+import type { RepositoryProfile } from "../../types";
+import RepositoryProfileContainer from "./RepositoryProfileContainer";
+
+type UnfilteredResult = UseQueryResult<
+  AxiosResponse<ApiPaginatedResponse<RepositoryProfile>>
+> & { isPending: false };
+
+const makeUnfilteredResult = (
+  count: number,
+  override?: { data?: undefined; error: Error },
+): UnfilteredResult => {
+  if (override && override.data === undefined) {
+    return {
+      data: undefined,
+      error: override.error,
+      isPending: false,
+    } as unknown as UnfilteredResult;
+  }
+
+  return {
+    data: {
+      data: {
+        count,
+        results: repositoryProfiles.slice(0, count),
+        next: null,
+        previous: null,
+      },
+      status: 200,
+      statusText: "OK",
+      headers: {},
+      config: {} as AxiosResponse["config"],
+    } as AxiosResponse<ApiPaginatedResponse<RepositoryProfile>>,
+    error: null,
+    isPending: false,
+  } as unknown as UnfilteredResult;
+};
+
+describe("RepositoryProfileContainer", () => {
+  it("renders the profile list and header when profiles exist", async () => {
+    renderWithProviders(
+      <RepositoryProfileContainer
+        unfilteredRepositoryProfilesResult={makeUnfilteredResult(
+          repositoryProfiles.length,
+        )}
+      />,
+    );
+
+    await expectLoadingState();
+
+    expect(screen.getByRole("table")).toBeInTheDocument();
+    expect(
+      screen.getByText(repositoryProfiles[0].title),
+    ).toBeInTheDocument();
+  });
+
+  it("renders loading state while filtered profiles are pending", async () => {
+    renderWithProviders(
+      <RepositoryProfileContainer
+        unfilteredRepositoryProfilesResult={makeUnfilteredResult(
+          repositoryProfiles.length,
+        )}
+      />,
+    );
+
+    await expectLoadingState();
+  });
+
+  it("renders empty state when unfiltered count is zero", async () => {
+    setEndpointStatus("empty");
+    renderWithProviders(
+      <RepositoryProfileContainer
+        unfilteredRepositoryProfilesResult={makeUnfilteredResult(0)}
+      />,
+      undefined,
+    );
+
+    expect(
+      await screen.findByText("No repository profiles found"),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("link", {
+        name: "How to manage repositories in Landscape",
+      }),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("button", { name: /Add repository profile/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("filters profiles by search parameter from URL", async () => {
+    const [firstProfile] = repositoryProfiles;
+    renderWithProviders(
+      <RepositoryProfileContainer
+        unfilteredRepositoryProfilesResult={makeUnfilteredResult(
+          repositoryProfiles.length,
+        )}
+      />,
+      undefined,
+      `/?search=${firstProfile.name}`,
+    );
+
+    await expectLoadingState();
+
+    expect(screen.getByRole("table")).toBeInTheDocument();
+  });
+});
diff --git a/src/features/repository-profiles/components/RepositoryProfileContainer/RepositoryProfileContainer.tsx b/src/features/repository-profiles/components/RepositoryProfileContainer/RepositoryProfileContainer.tsx
index ae582bb68..44d947232 100644
--- a/src/features/repository-profiles/components/RepositoryProfileContainer/RepositoryProfileContainer.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileContainer/RepositoryProfileContainer.tsx
@@ -1,12 +1,11 @@
 import EmptyState from "@/components/layout/EmptyState";
 import LoadingState from "@/components/layout/LoadingState";
-import { TablePagination } from "@/components/layout/TablePagination";
 import usePageParams from "@/hooks/usePageParams";
 import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
 import type { UseQueryResult } from "@tanstack/react-query";
 import type { AxiosResponse } from "axios";
 import type { FC } from "react";
-import { useRepositoryProfiles } from "../../hooks";
+import { useRepositoryProfiles } from "../../api";
 import type { RepositoryProfile } from "../../types";
 import RepositoryProfileAddButton from "../RepositoryProfileAddButton";
 import RepositoryProfileHeader from "../RepositoryProfileHeader";
@@ -30,7 +29,6 @@ const RepositoryProfileContainer: FC<RepositoryProfileContainerProps> = ({
   const {
     data: repositoryProfilesResponse,
     isPending: isPendingRepositoryProfiles,
-    error: repositoryProfilesError,
   } = getRepositoryProfilesQuery({
     limit: pageSize,
     offset: (currentPage - 1) * pageSize,
@@ -66,19 +64,12 @@ const RepositoryProfileContainer: FC<RepositoryProfileContainerProps> = ({
     return <LoadingState />;
   }
 
-  if (!repositoryProfilesResponse) {
-    throw repositoryProfilesError;
-  }
-
   return (
     <>
       <RepositoryProfileHeader />
       <RepositoryProfileList
-        repositoryProfiles={repositoryProfilesResponse.data.results}
-      />
-      <TablePagination
-        totalItems={repositoryProfilesResponse.data.count}
-        currentItemCount={repositoryProfilesResponse.data.results.length}
+        repositoryProfiles={repositoryProfilesResponse?.data.results ?? []}
+        totalCount={repositoryProfilesResponse?.data.count ?? 0}
       />
     </>
   );
diff --git a/src/features/repository-profiles/components/RepositoryProfileDetails/RepositoryProfileDetails.test.tsx b/src/features/repository-profiles/components/RepositoryProfileDetails/RepositoryProfileDetails.test.tsx
new file mode 100644
index 000000000..5159649d8
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileDetails/RepositoryProfileDetails.test.tsx
@@ -0,0 +1,111 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
+import { repositoryProfiles } from "@/tests/mocks/repositoryProfiles";
+import { renderWithProviders } from "@/tests/render";
+import { ENDPOINT_STATUS_API_ERROR_MESSAGE } from "@/tests/server/handlers/_constants";
+import { screen, waitFor } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { Suspense } from "react";
+import { describe, expect, it } from "vitest";
+import RepositoryProfileDetails from "./RepositoryProfileDetails";
+import type { RepositoryProfile } from "../../types";
+
+const [profileWithSources, profileWithoutSources] = repositoryProfiles;
+
+const renderDetails = (profile: RepositoryProfile) =>
+  renderWithProviders(
+    <Suspense fallback={null}>
+      <RepositoryProfileDetails />
+    </Suspense>,
+    undefined,
+    `/?sidePath=view&name=${profile.name}`,
+  );
+
+describe("RepositoryProfileDetails", () => {
+  const user = userEvent.setup();
+
+  it("renders apt sources table with source names", async () => {
+    renderDetails(profileWithSources);
+
+    for (const source of profileWithSources.apt_sources) {
+      expect(await screen.findByText(source.name)).toBeInTheDocument();
+    }
+  });
+
+  it("renders empty sources message when profile has no apt sources", async () => {
+    renderDetails(profileWithoutSources);
+
+    expect(
+      await screen.findByText("No sources have been added yet."),
+    ).toBeInTheDocument();
+  });
+
+  it("sets sidePath=view,edit in URL on edit button click", async () => {
+    renderDetails(profileWithSources);
+
+    await user.click(await screen.findByRole("button", { name: "Edit" }));
+
+    expect(
+      screen.queryByRole("heading", {
+        name: `Edit "${profileWithSources.title}" profile`,
+      }),
+    ).not.toBeInTheDocument();
+  });
+
+  it("opens remove confirmation modal on remove button click", async () => {
+    renderDetails(profileWithSources);
+
+    await user.click(
+      await screen.findByRole("button", {
+        name: `Remove ${profileWithSources.title}`,
+      }),
+    );
+
+    expect(screen.getByRole("dialog")).toBeInTheDocument();
+    expect(
+      screen.getByText(/This will remove/),
+    ).toBeInTheDocument();
+  });
+
+  it("closes the confirmation modal after successful profile removal", async () => {
+    renderDetails(profileWithSources);
+
+    await user.click(
+      await screen.findByRole("button", {
+        name: `Remove ${profileWithSources.title}`,
+      }),
+    );
+    expect(screen.getByRole("dialog")).toBeInTheDocument();
+
+    await user.type(
+      screen.getByRole("textbox"),
+      `remove ${profileWithSources.title}`,
+    );
+    await user.click(screen.getByRole("button", { name: "Remove" }));
+
+    await waitFor(() => {
+      expect(screen.queryByRole("dialog")).not.toBeInTheDocument();
+    });
+  });
+
+  it("shows error notification when profile removal fails", async () => {
+    renderDetails(profileWithSources);
+
+    setEndpointStatus({ status: "error", path: "RemoveRepositoryProfile" });
+
+    await user.click(
+      await screen.findByRole("button", {
+        name: `Remove ${profileWithSources.title}`,
+      }),
+    );
+
+    await user.type(
+      screen.getByRole("textbox"),
+      `remove ${profileWithSources.title}`,
+    );
+    await user.click(screen.getByRole("button", { name: "Remove" }));
+
+    expect(
+      await screen.findByText(ENDPOINT_STATUS_API_ERROR_MESSAGE),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/repository-profiles/components/RepositoryProfileDetails/RepositoryProfileDetails.tsx b/src/features/repository-profiles/components/RepositoryProfileDetails/RepositoryProfileDetails.tsx
new file mode 100644
index 000000000..6e7281fbb
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileDetails/RepositoryProfileDetails.tsx
@@ -0,0 +1,140 @@
+import TextConfirmationModal from "@/components/form/TextConfirmationModal";
+import SidePanel from "@/components/layout/SidePanel";
+import ViewProfileGeneralBlock from "../../../profiles/components/ViewProfileSidePanel/components/ViewProfileGeneralBlock/ViewProfileGeneralBlock";
+import useDebug from "@/hooks/useDebug";
+import useNotify from "@/hooks/useNotify";
+import usePageParams from "@/hooks/usePageParams";
+import { Button, Icon, ICONS, ModularTable } from "@canonical/react-components";
+import { ModalTablePagination } from "@/components/layout/TablePagination";
+import type { APTSource } from "@/features/apt-sources";
+import type { FC } from "react";
+import { useMemo, useState } from "react";
+import type { Column } from "react-table";
+import { useBoolean } from "usehooks-ts";
+import { useGetRepositoryProfile, useRepositoryProfiles } from "../../api";
+import Blocks from "@/components/layout/Blocks/Blocks";
+import ViewProfileAssociationBlock from "../../../profiles/components/ViewProfileSidePanel/components/ViewProfileAssociationBlock/ViewProfileAssociationBlock";
+import { ProfileTypes } from "@/features/profiles";
+
+const SOURCES_PAGE_SIZE = 10;
+
+const aptSourceColumns: Column<APTSource>[] = [
+  {
+    accessor: "name",
+    Header: "Source",
+  },
+];
+
+const RepositoryProfileDetails: FC = () => {
+  const { name, createPageParamsSetter, createSidePathPusher } = usePageParams();
+  const profile = useGetRepositoryProfile(name).data;
+  const closePanel = createPageParamsSetter({ sidePath: [], name: "" });
+  const debug = useDebug();
+  const { notify } = useNotify();
+
+  const [sourcesPage, setSourcesPage] = useState(1);
+  const totalSourcePages = Math.max(1, Math.ceil(profile.apt_sources.length / SOURCES_PAGE_SIZE));
+  const safeSourcesPage = Math.min(sourcesPage, totalSourcePages);
+  const pagedSources = useMemo(
+    () => profile.apt_sources.slice((safeSourcesPage - 1) * SOURCES_PAGE_SIZE, safeSourcesPage * SOURCES_PAGE_SIZE),
+    [profile.apt_sources, safeSourcesPage],
+  );
+
+  const { removeRepositoryProfileQuery } = useRepositoryProfiles();
+  const { mutateAsync: removeRepositoryProfile, isPending: isRemoving } =
+    removeRepositoryProfileQuery;
+
+  const {
+    value: isModalOpen,
+    setTrue: openModal,
+    setFalse: closeModal,
+  } = useBoolean();
+
+  const handleEditProfile = createSidePathPusher("edit");
+
+  const handleRemoveProfile = async (): Promise<void> => {
+    try {
+      await removeRepositoryProfile({ name: profile.name });
+
+      notify.success({
+        title: "Repository profile removed",
+        message: `Repository profile "${profile.title}" removed successfully`,
+      });
+
+      closePanel();
+    } catch (error) {
+      debug(error);
+    } finally {
+      closeModal();
+    }
+  };
+
+  return (
+    <>
+      <SidePanel.Header>{profile.title}</SidePanel.Header>
+      <SidePanel.Content>
+      <div className="p-segmented-control u-sv2">
+        <div className="p-segmented-control__list">
+          <Button
+            type="button"
+            className="p-segmented-control__button"
+            onClick={handleEditProfile}
+            hasIcon
+          >
+            <Icon name="edit" />
+            <span>Edit</span>
+          </Button>
+
+          <Button
+            type="button"
+            className="p-segmented-control__button"
+            onClick={openModal}
+            hasIcon
+            aria-label={`Remove ${profile.title}`}
+          >
+            <Icon name={`${ICONS.delete}--negative`} />
+            <span className="u-text--negative">Remove</span>
+          </Button>
+        </div>
+      </div>
+      <Blocks dense>
+        <ViewProfileGeneralBlock profile={profile} type={ProfileTypes.repository} />
+        <Blocks.Item title="Sources">
+          <ModularTable
+            columns={aptSourceColumns}
+            data={pagedSources}
+            emptyMsg="No sources have been added yet."
+          />
+          <ModalTablePagination
+            current={safeSourcesPage}
+            max={totalSourcePages}
+            onPrev={() => { setSourcesPage(safeSourcesPage - 1); }}
+            onNext={() => { setSourcesPage(safeSourcesPage + 1); }}
+          />
+        </Blocks.Item>
+        </Blocks>
+
+        <ViewProfileAssociationBlock profile={profile} type={ProfileTypes.repository} />
+      </SidePanel.Content>
+
+        <TextConfirmationModal
+          isOpen={isModalOpen}
+          confirmationText={`remove ${profile.title}`}
+          title="Remove repository profile"
+          confirmButtonLabel="Remove"
+          confirmButtonAppearance="negative"
+          confirmButtonDisabled={isRemoving}
+          confirmButtonLoading={isRemoving}
+          onConfirm={handleRemoveProfile}
+          close={closeModal}
+        >
+          <p>
+            This will remove &quot;{profile.title}&quot; profile. This action is{" "}
+            <b>irreversible</b>.
+          </p>
+        </TextConfirmationModal>
+    </>
+  );
+};
+
+export default RepositoryProfileDetails;
diff --git a/src/features/repository-profiles/components/RepositoryProfileDetails/index.ts b/src/features/repository-profiles/components/RepositoryProfileDetails/index.ts
new file mode 100644
index 000000000..ed7c9cfae
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileDetails/index.ts
@@ -0,0 +1 @@
+export { default } from "./RepositoryProfileDetails";
diff --git a/src/features/repository-profiles/components/RepositoryProfileEditForm/RepositoryProfileEditForm.test.tsx b/src/features/repository-profiles/components/RepositoryProfileEditForm/RepositoryProfileEditForm.test.tsx
new file mode 100644
index 000000000..09ca6f029
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileEditForm/RepositoryProfileEditForm.test.tsx
@@ -0,0 +1,82 @@
+import usePageParams from "@/hooks/usePageParams";
+import { repositoryProfiles } from "@/tests/mocks/repositoryProfiles";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { Suspense } from "react";
+import { describe, expect, it } from "vitest";
+import RepositoryProfileEditForm from "./RepositoryProfileEditForm";
+
+const [profile] = repositoryProfiles;
+
+// Mirrors real app behavior: only mount when name param is set
+const NameGuard = () => {
+  const { name } = usePageParams();
+  if (!name) return null;
+  return (
+    <Suspense fallback={null}>
+      <RepositoryProfileEditForm />
+    </Suspense>
+  );
+};
+
+const renderEditForm = (sidePath = "view,edit") =>
+  renderWithProviders(
+    <NameGuard />,
+    undefined,
+    `/?sidePath=${sidePath}&name=${profile.name}`,
+  );
+
+describe("RepositoryProfileEditForm", () => {
+  const user = userEvent.setup();
+
+  it("renders the edit panel heading with the profile title", async () => {
+    renderEditForm();
+
+    expect(
+      await screen.findByRole("heading", { name: `Edit ${profile.title}` }),
+    ).toBeInTheDocument();
+  });
+
+  it("renders the repository profile form in edit mode", async () => {
+    renderEditForm();
+
+    expect(
+      await screen.findByRole("button", { name: /save changes/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("does not render back button when sidePath has only one segment", async () => {
+    renderWithProviders(
+      <NameGuard />,
+      undefined,
+      `/?sidePath=edit&name=${profile.name}`,
+    );
+
+    await screen.findByRole("heading", { name: `Edit ${profile.title}` });
+
+    expect(
+      screen.queryByRole("button", { name: /back/i }),
+    ).not.toBeInTheDocument();
+  });
+
+  it("renders back button when sidePath has more than one segment", async () => {
+    renderEditForm("view,edit");
+
+    expect(
+      await screen.findByRole("button", { name: /back/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("clears sidePath and name URL params on close button click", async () => {
+    renderEditForm();
+
+    await screen.findByRole("heading", { name: `Edit ${profile.title}` });
+
+    await user.click(screen.getByRole("button", { name: /cancel/i }));
+
+    expect(
+      screen.queryByRole("heading", { name: `Edit ${profile.title}` }),
+    ).not.toBeInTheDocument();
+  });
+});
diff --git a/src/features/repository-profiles/components/RepositoryProfileEditForm/RepositoryProfileEditForm.tsx b/src/features/repository-profiles/components/RepositoryProfileEditForm/RepositoryProfileEditForm.tsx
new file mode 100644
index 000000000..5fd7da5bb
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileEditForm/RepositoryProfileEditForm.tsx
@@ -0,0 +1,29 @@
+import SidePanel from "@/components/layout/SidePanel";
+import usePageParams from "@/hooks/usePageParams";
+import type { FC } from "react";
+import { useGetRepositoryProfile } from "../../api";
+import RepositoryProfileForm from "../RepositoryProfileForm";
+
+const RepositoryProfileEditForm: FC = () => {
+  const { name, sidePath, popSidePath, createPageParamsSetter } =
+    usePageParams();
+  const { data: profile } = useGetRepositoryProfile(name);
+  const closePanel = createPageParamsSetter({ sidePath: [], name: "" });
+
+  return (
+    <>
+      <SidePanel.Header>{`Edit ${profile.title}`}</SidePanel.Header>
+      <SidePanel.Content>
+        <RepositoryProfileForm
+          action="edit"
+          profile={profile}
+          onClose={closePanel}
+          hasBackButton={sidePath.length > 1}
+          onBackButtonPress={popSidePath}
+        />
+      </SidePanel.Content>
+    </>
+  );
+};
+
+export default RepositoryProfileEditForm;
diff --git a/src/features/repository-profiles/components/RepositoryProfileEditForm/index.ts b/src/features/repository-profiles/components/RepositoryProfileEditForm/index.ts
new file mode 100644
index 000000000..0fb52de37
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileEditForm/index.ts
@@ -0,0 +1 @@
+export { default } from "./RepositoryProfileEditForm";
diff --git a/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.module.scss b/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.module.scss
new file mode 100644
index 000000000..e22584332
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.module.scss
@@ -0,0 +1,5 @@
+.sourcesHeader {
+  align-items: center;
+  display: flex;
+  justify-content: space-between;
+}
diff --git a/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.test.tsx b/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.test.tsx
index 5179b09e9..10eae94e0 100644
--- a/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.test.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.test.tsx
@@ -1,24 +1,48 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
 import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
+import { ENDPOINT_STATUS_API_ERROR_MESSAGE } from "@/tests/server/handlers/_constants";
+import { repositoryProfiles } from "@/tests/mocks/repositoryProfiles";
+import { screen, waitFor } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-import { describe, it } from "vitest";
+import { beforeEach, describe, it } from "vitest";
 import RepositoryProfileForm from "./RepositoryProfileForm";
-import { repositoryProfiles } from "@/tests/mocks/repositoryProfiles";
-
-const user = userEvent.setup();
 
 describe("RepositoryProfileForm", () => {
-  it("submits valid form on add action", async () => {
+  let user: ReturnType<typeof userEvent.setup>;
+
+  beforeEach(() => {
+    user = userEvent.setup();
+  });
+
+  const fillAndAddSource = async () => {
+    await user.click(
+      screen.getByRole("button", { name: /add source/i }),
+    );
+    await user.type(
+      await screen.findByLabelText(/source name/i),
+      "my-source",
+    );
+    await user.type(
+      screen.getByLabelText(/deb line/i),
+      "deb http://archive.ubuntu.com/ubuntu focal main",
+    );
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+  };
+  it("submits without errors on valid add form", async () => {
     renderWithProviders(<RepositoryProfileForm action="add" />);
 
-    await user.type(screen.getByLabelText(/Title/i), "repo‑test");
-    await user.type(screen.getByLabelText(/Description/i), "test desc");
+    await user.type(screen.getByLabelText(/Profile name/i), "repo-test");
+    await fillAndAddSource();
 
     await user.click(
       screen.getByRole("button", { name: /Add a new repository profile/i }),
     );
 
-    expect(screen.queryByRole("alert")).not.toBeInTheDocument();
+    await waitFor(() => {
+      expect(
+        screen.queryByText(/this field is required/i),
+      ).not.toBeInTheDocument();
+    });
   });
 
   it("renders save changes button on edit action", async () => {
@@ -27,43 +51,49 @@ describe("RepositoryProfileForm", () => {
     );
 
     const saveButton = await screen.findByRole("button", {
-      name: /edit repository profile/i,
+      name: /save changes/i,
     });
     expect(saveButton).toBeInTheDocument();
     expect(saveButton).toHaveAttribute("type", "submit");
     expect(saveButton).toHaveTextContent(/Save changes/i);
   });
 
-  it("resets to first tab on validation error", async () => {
-    renderWithProviders(<RepositoryProfileForm action="add" />);
+  it("submits edit form successfully and shows no errors", async () => {
+    renderWithProviders(
+      <RepositoryProfileForm action="edit" profile={repositoryProfiles[0]} />,
+    );
 
-    await user.click(screen.getByRole("tab", { name: "Pockets" }));
+    await screen.findByDisplayValue(repositoryProfiles[0].title);
     await user.click(
-      screen.getByRole("button", { name: /Add a new repository profile/i }),
+      screen.getByRole("button", { name: /Save changes to repository profile/i }),
     );
 
-    expect(screen.getByRole("tab", { name: "Details" })).toHaveAttribute(
-      "aria-selected",
-      "true",
-    );
+    expect(screen.queryByText(/this field is required/i)).not.toBeInTheDocument();
   });
 
-  it("shows validation errors for required fields", async () => {
+  it("shows validation error for required title field in add mode", async () => {
     renderWithProviders(<RepositoryProfileForm action="add" />);
 
     await user.click(
       screen.getByRole("button", { name: /Add a new repository profile/i }),
     );
 
-    expect(screen.getByText(/this field is required/i)).toBeInTheDocument();
+    expect(
+      await screen.findByText(/this field is required/i),
+    ).toBeInTheDocument();
   });
 
-  it("shows correct tab content when switching tabs", async () => {
+  it("shows apt_sources validation error when no sources are added", async () => {
     renderWithProviders(<RepositoryProfileForm action="add" />);
-    await user.click(screen.getByRole("tab", { name: "Pockets" }));
-    expect(screen.getByText("Distribution")).toBeInTheDocument();
-    await user.click(screen.getByRole("tab", { name: "Details" }));
-    expect(screen.getByLabelText("Title")).toBeInTheDocument();
+
+    await user.type(screen.getByLabelText(/Profile name/i), "repo-test");
+    await user.click(
+      screen.getByRole("button", { name: /Add a new repository profile/i }),
+    );
+
+    expect(
+      await screen.findByText(/at least one source is required/i),
+    ).toBeInTheDocument();
   });
 
   it("shows enabled access group field in add mode", async () => {
@@ -72,11 +102,69 @@ describe("RepositoryProfileForm", () => {
     expect(screen.getByLabelText(/access group/i)).toBeEnabled();
   });
 
-  it("shows disabled access group field in edit mode", async () => {
+  it("shows read-only access group field in edit mode", async () => {
     renderWithProviders(
       <RepositoryProfileForm action="edit" profile={repositoryProfiles[0]} />,
     );
 
-    expect(screen.getByLabelText(/access group/i)).toBeDisabled();
+    expect(screen.queryByRole("combobox", { name: /access group/i })).not.toBeInTheDocument();
+  });
+
+  it("clicking Add source opens the source form overlay", async () => {
+    renderWithProviders(<RepositoryProfileForm action="add" />);
+
+    await user.click(screen.getByRole("button", { name: /add source/i }));
+
+    expect(
+      await screen.findByLabelText(/source name/i),
+    ).toBeInTheDocument();
+    expect(screen.getByLabelText(/deb line/i)).toBeInTheDocument();
+  });
+
+  it("shows error notification when create API call fails", async () => {
+    renderWithProviders(<RepositoryProfileForm action="add" />);
+
+    setEndpointStatus({ status: "error", path: "repositoryprofiles" });
+
+    await user.type(screen.getByLabelText(/Profile name/i), "repo-test");
+    await fillAndAddSource();
+
+    await user.click(
+      screen.getByRole("button", { name: /Add a new repository profile/i }),
+    );
+
+    expect(
+      await screen.findByText(ENDPOINT_STATUS_API_ERROR_MESSAGE),
+    ).toBeInTheDocument();
+  });
+
+  it("clears error notification when a pending source is edited", async () => {
+    renderWithProviders(<RepositoryProfileForm action="add" />);
+
+    await user.type(screen.getByLabelText(/Profile name/i), "repo-test");
+    await fillAndAddSource();
+
+    setEndpointStatus({ status: "error", path: "repositoryprofiles" });
+    await user.click(
+      screen.getByRole("button", { name: /Add a new repository profile/i }),
+    );
+    expect(
+      await screen.findByText(ENDPOINT_STATUS_API_ERROR_MESSAGE),
+    ).toBeInTheDocument();
+
+    setEndpointStatus("default");
+
+    await user.click(
+      screen.getByRole("button", { name: /Edit my-source/i }),
+    );
+    await user.click(
+      await screen.findByRole("button", { name: /save changes/i }),
+    );
+
+    await waitFor(() => {
+      expect(
+        screen.queryByText(ENDPOINT_STATUS_API_ERROR_MESSAGE),
+      ).not.toBeInTheDocument();
+    });
   });
 });
diff --git a/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.tsx b/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.tsx
index 8c8312f68..3b11b5564 100644
--- a/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.tsx
@@ -1,26 +1,26 @@
 import { useFormik } from "formik";
 import type { FC } from "react";
 import { useEffect, useState } from "react";
-import { Form } from "@canonical/react-components";
+import { Button, Form, Icon, Link } from "@canonical/react-components";
 import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
-import RepositoryProfileFormAptSourcesPanel from "../RepositoryProfileFormAptSourcesPanel";
+import AssociationBlock from "@/components/form/AssociationBlock";
 import RepositoryProfileFormDetailsPanel from "../RepositoryProfileFormDetailsPanel";
-import RepositoryProfileFormPocketsPanel from "../RepositoryProfileFormPocketsPanel";
-import RepositoryProfileFormTabs from "../RepositoryProfileFormTabs";
-import type { CreateRepositoryProfileParams } from "../../hooks";
-import { useRepositoryProfiles } from "../../hooks";
-import type {
-  RepositoryProfile,
-  RepositoryProfileFormValues,
-} from "../../types";
-import { useAPTSources } from "@/features/apt-sources";
+import RepositoryProfileFormSourcesSection from "../RepositoryProfileFormSourcesSection";
+import RepositoryProfileSourceFormOverlay from "../RepositoryProfileSourceFormOverlay";
+import type { CreateRepositoryProfileParams } from "../../api";
+import { useRepositoryProfiles } from "../../api";
+import type { RepositoryProfile, RepositoryProfileFormValues } from "../../types";
+import type { APTSource } from "@/features/apt-sources";
 import useDebug from "@/hooks/useDebug";
-import { useDistributions } from "@/features/mirrors";
+import useNotify from "@/hooks/useNotify";
 import useRoles from "@/hooks/useRoles";
 import useSidePanel from "@/hooks/useSidePanel";
 import { CTA_INFO, INITIAL_VALUES } from "./constants";
 import { getValidationSchema } from "./helpers";
+import { getFormikError } from "@/utils/formikErrors";
 import { AppErrorBoundary } from "@/components/layout/AppErrorBoundary";
+import Blocks from "@/components/layout/Blocks/Blocks";
+import classes from "./RepositoryProfileForm.module.scss";
 
 type RepositoryProfileFormProps =
   | {
@@ -29,22 +29,28 @@ type RepositoryProfileFormProps =
   | {
       action: "edit";
       profile: RepositoryProfile;
+      onClose?: () => void;
+      hasBackButton?: boolean;
+      onBackButtonPress?: () => void;
     };
 
 const RepositoryProfileForm: FC<RepositoryProfileFormProps> = (props) => {
-  const [currentTab, setCurrentTab] = useState(0);
+  const [showSourceOverlay, setShowSourceOverlay] = useState(false);
+  const [sourceToEdit, setSourceToEdit] = useState<APTSource | null>(null);
 
   const debug = useDebug();
-  const { closeSidePanel } = useSidePanel();
+  const { notify } = useNotify();
+  const { closeSidePanel, setSidePanelTitle, setOnCloseOverride } = useSidePanel();
+
+  const panelTitle =
+    props.action === "add"
+      ? "Add repository profile"
+      : `Edit ${props.profile.title}`;
 
-  const { getDistributionsQuery } = useDistributions();
   const { getAccessGroupQuery } = useRoles();
-  const { getAPTSourcesQuery } = useAPTSources();
   const { createRepositoryProfileQuery, editRepositoryProfileQuery } =
     useRepositoryProfiles();
 
-  const { data: getDistributionsResult } = getDistributionsQuery();
-  const { data: getAPTSourcesResult } = getAPTSourcesQuery();
   const { data: accessGroupsResult } = getAccessGroupQuery(
     {},
     { enabled: props.action === "add" },
@@ -56,7 +62,6 @@ const RepositoryProfileForm: FC<RepositoryProfileFormProps> = (props) => {
   const handleSubmit = async (values: RepositoryProfileFormValues) => {
     const valuesToSubmit: CreateRepositoryProfileParams = {
       all_computers: values.all_computers,
-      apt_sources: values.apt_sources,
       description: values.description,
       pockets: values.pockets,
       title: values.title,
@@ -71,15 +76,29 @@ const RepositoryProfileForm: FC<RepositoryProfileFormProps> = (props) => {
         await createRepositoryProfile({
           access_group: values.access_group,
           ...valuesToSubmit,
+          apt_sources: values.apt_sources,
+        });
+        closeSidePanel();
+        notify.success({
+          title: "Repository profile created",
+          message: `Repository profile "${values.title}" created successfully`,
         });
       } else {
+        const originalSources = props.profile.apt_sources ?? [];
         await editRepositoryProfile({
           name: props.profile.name,
           ...valuesToSubmit,
+          add_apt_sources: values.apt_sources.filter((s) => s.id === 0),
+          remove_apt_sources: originalSources
+            .filter((orig) => !values.apt_sources.some((cur) => cur.id === orig.id))
+            .map((s) => s.id),
+        });
+        (props.onClose ?? closeSidePanel)();
+        notify.success({
+          title: `You have successfully edited ${values.title}`,
+          message: `The repository profile details have been updated.`,
         });
       }
-
-      closeSidePanel();
     } catch (error) {
       debug(error);
     }
@@ -91,14 +110,6 @@ const RepositoryProfileForm: FC<RepositoryProfileFormProps> = (props) => {
     validationSchema: getValidationSchema(props.action),
   });
 
-  useEffect(() => {
-    if (props.action !== "add" || !formik.errors || !formik.submitCount) {
-      return;
-    }
-
-    setCurrentTab(0);
-  }, [formik.submitCount, formik.errors, props.action]);
-
   useEffect(() => {
     if (props.action !== "edit") {
       return;
@@ -107,67 +118,147 @@ const RepositoryProfileForm: FC<RepositoryProfileFormProps> = (props) => {
     formik.setValues({
       access_group: props.profile.access_group,
       all_computers: props.profile.all_computers,
-      apt_sources: props.profile.apt_sources,
+      apt_sources: props.profile.apt_sources ?? [],
       description: props.profile.description,
-      pockets: props.profile.pockets.map(({ id }) => id),
+      pockets: (props.profile.pockets ?? []).map(({ id }) => id),
       tags: props.profile.tags,
       title: props.profile.title,
     });
   }, [props]);
 
+  const closeSourceOverlay = () => {
+    setShowSourceOverlay(false);
+    setSourceToEdit(null);
+    setSidePanelTitle(panelTitle);
+    setOnCloseOverride(undefined);
+  };
+
+  const handleAddSource = (source: APTSource) => {
+    formik.setFieldValue("apt_sources", [
+      ...formik.values.apt_sources,
+      { ...source, id: 0 },
+    ]);
+    closeSourceOverlay();
+  };
+
+  const handleRemoveSource = (source: APTSource) => {
+    formik.setFieldValue(
+      "apt_sources",
+      formik.values.apt_sources.filter((s) =>
+        s.id !== 0 ? s.id !== source.id : s.name !== source.name,
+      ),
+    );
+  };
+
+  const handleEditSource = (source: APTSource) => {
+    setSourceToEdit(source);
+    setShowSourceOverlay(true);
+    setOnCloseOverride(closeSourceOverlay);
+    setSidePanelTitle(
+      <>
+        <Link
+          className="u-no-margin--bottom"
+          onClick={closeSourceOverlay}
+        >
+          {panelTitle}
+        </Link>
+        {" / Edit source"}
+      </>,
+    );
+  };
+
+  const handleSourceEdited = (updatedSource: APTSource) => {
+    if (sourceToEdit?.id === 0) {
+      notify.clear();
+    }
+    formik.setFieldValue(
+      "apt_sources",
+      formik.values.apt_sources.map((s) => {
+        const matches =
+          s.id !== 0
+            ? s.id === sourceToEdit?.id
+            : s.name === sourceToEdit?.name;
+        return matches ? { ...updatedSource, id: 0 } : s;
+      }),
+    );
+    closeSourceOverlay();
+  };
+
   return (
-    <Form onSubmit={formik.handleSubmit} noValidate>
-      <RepositoryProfileFormTabs
-        currentTab={currentTab}
-        onCurrentTabChange={(tab) => {
-          setCurrentTab(tab);
-        }}
-      />
-
-      <AppErrorBoundary>
-        {0 === currentTab && (
-          <RepositoryProfileFormDetailsPanel
-            accessGroups={accessGroupsResult?.data ?? []}
-            isTitleRequired={props.action === "add"}
-            isAccessGroupDisabled={props.action === "edit"}
-            formik={formik}
-          />
-        )}
-
-        {1 === currentTab && (
-          <>
-            {!getDistributionsResult?.data.length && (
-              <p>No distributions found.</p>
-            )}
-            {getDistributionsResult &&
-              getDistributionsResult.data.length > 0 && (
-                <RepositoryProfileFormPocketsPanel
-                  distributions={getDistributionsResult.data}
-                  formik={formik}
-                />
-              )}
-          </>
-        )}
-
-        {2 === currentTab && (
-          <>
-            {!getAPTSourcesResult?.data.length && <p>No APT sources found.</p>}
-            {getAPTSourcesResult && getAPTSourcesResult.data.length > 0 && (
-              <RepositoryProfileFormAptSourcesPanel
-                aptSources={getAPTSourcesResult.data}
+    <div style={{ position: "relative" }}>
+      <Form onSubmit={formik.handleSubmit} noValidate>
+        <AppErrorBoundary>
+          <Blocks dense>
+            <Blocks.Item title="Details">
+              <RepositoryProfileFormDetailsPanel
+                accessGroups={accessGroupsResult?.data ?? []}
+                isTitleRequired={props.action === "add"}
+                isAccessGroupDisabled={props.action === "edit"}
                 formik={formik}
               />
-            )}
-          </>
-        )}
-      </AppErrorBoundary>
-
-      <SidePanelFormButtons
-        submitButtonDisabled={formik.isSubmitting}
-        submitButtonText={CTA_INFO[props.action].label}
-        submitButtonAriaLabel={CTA_INFO[props.action].ariaLabel}
-      />
-    </Form>
+            </Blocks.Item>
+
+
+            <Blocks.Item>
+              <div className={classes.sourcesHeader}>
+                <h4 className="p-heading--5 u-no-margin--bottom">Sources</h4>
+                <Button
+                  type="button"
+                  hasIcon
+                  dense
+                  appearance="base"
+                  onClick={() => {
+                    setShowSourceOverlay(true);
+                    setOnCloseOverride(closeSourceOverlay);
+                    setSidePanelTitle(
+                      <>
+                        <Link
+                          className="u-no-margin--bottom"
+                          onClick={closeSourceOverlay}
+                        >
+                          {panelTitle}
+                        </Link>
+                        {" / Add source"}
+                      </>,
+                    );
+                  }}
+                >
+                  <Icon name="plus" />
+                  <span>Add source</span>
+                </Button>
+              </div>
+              <RepositoryProfileFormSourcesSection
+                sources={formik.values.apt_sources}
+                onRemoveSource={handleRemoveSource}
+                onEditSource={handleEditSource}
+                error={getFormikError(formik, "apt_sources")}
+              />
+            </Blocks.Item>
+
+            <Blocks.Item>
+              <AssociationBlock formik={formik} />
+            </Blocks.Item>
+          </Blocks>
+        </AppErrorBoundary>
+
+        <SidePanelFormButtons
+          submitButtonDisabled={formik.isSubmitting}
+          submitButtonText={CTA_INFO[props.action].label}
+          submitButtonAriaLabel={CTA_INFO[props.action].ariaLabel}
+          onCancel={props.action === "edit" ? props.onClose : undefined}
+          hasBackButton={props.action === "edit" ? props.hasBackButton : undefined}
+          onBackButtonPress={props.action === "edit" ? props.onBackButtonPress : undefined}
+        />
+      </Form>
+
+      {showSourceOverlay && (
+        <RepositoryProfileSourceFormOverlay
+          onClose={closeSourceOverlay}
+          onSourceAdded={sourceToEdit ? handleSourceEdited : handleAddSource}
+          sourceToEdit={sourceToEdit}
+        />
+      )}
+    </div>
   );
 };
 
diff --git a/src/features/repository-profiles/components/RepositoryProfileForm/constants.ts b/src/features/repository-profiles/components/RepositoryProfileForm/constants.ts
index 9ef918c95..a059d1515 100644
--- a/src/features/repository-profiles/components/RepositoryProfileForm/constants.ts
+++ b/src/features/repository-profiles/components/RepositoryProfileForm/constants.ts
@@ -14,10 +14,10 @@ export const INITIAL_VALUES: RepositoryProfileFormValues = {
 export const CTA_INFO = {
   add: {
     ariaLabel: "Add a new repository profile",
-    label: "Add repository profile",
+    label: "Add profile",
   },
   edit: {
-    ariaLabel: "Edit repository profile",
+    ariaLabel: "Save changes to repository profile",
     label: "Save changes",
   },
 };
diff --git a/src/features/repository-profiles/components/RepositoryProfileForm/helpers.ts b/src/features/repository-profiles/components/RepositoryProfileForm/helpers.ts
index e7f42d831..15d2f71c4 100644
--- a/src/features/repository-profiles/components/RepositoryProfileForm/helpers.ts
+++ b/src/features/repository-profiles/components/RepositoryProfileForm/helpers.ts
@@ -4,9 +4,8 @@ export const getValidationSchema = (action: "add" | "edit") => {
   return Yup.object().shape({
     access_group: Yup.string(),
     all_computers: Yup.boolean(),
-    apt_sources: Yup.array().of(Yup.string()),
+    apt_sources: Yup.array().min(1, "At least one source is required."),
     description: Yup.string(),
-    pockets: Yup.array().of(Yup.string()),
     tags: Yup.array().of(Yup.string()),
     title: Yup.string().test({
       message: "This field is required.",
diff --git a/src/features/repository-profiles/components/RepositoryProfileFormAptSourcesPanel/RepositoryProfileFormAptSourcesPanel.test.tsx b/src/features/repository-profiles/components/RepositoryProfileFormAptSourcesPanel/RepositoryProfileFormAptSourcesPanel.test.tsx
index 0e9c31acf..2472debfa 100644
--- a/src/features/repository-profiles/components/RepositoryProfileFormAptSourcesPanel/RepositoryProfileFormAptSourcesPanel.test.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileFormAptSourcesPanel/RepositoryProfileFormAptSourcesPanel.test.tsx
@@ -46,7 +46,7 @@ describe("RepositoryProfileFormAptSourcesPanel", () => {
   });
 
   it("selects and deselects APT sources", async () => {
-    const { formik } = renderWrapper({ apt_sources: [2] });
+    const { formik } = renderWrapper({ apt_sources: [aptSources[1]] });
 
     const sourceCheckbox = screen.getByRole("checkbox", { name: "source1" });
     const selectedCheckbox = screen.getByRole("checkbox", { name: "source2" });
@@ -54,10 +54,10 @@ describe("RepositoryProfileFormAptSourcesPanel", () => {
     expect(selectedCheckbox).toBeChecked();
 
     await user.click(sourceCheckbox);
-    expect(formik.setFieldValue).toHaveBeenCalledWith("apt_sources", [2, 1]);
+    expect(formik.setFieldValue).toHaveBeenCalledWith("apt_sources", [aptSources[1], aptSources[0]]);
 
     await user.click(selectedCheckbox);
-    expect(formik.setFieldValue).toHaveBeenCalledWith("apt_sources", [1]);
+    expect(formik.setFieldValue).toHaveBeenCalledWith("apt_sources", [aptSources[0]]);
   });
 
   it("shows empty state when no APT sources match search", async () => {
diff --git a/src/features/repository-profiles/components/RepositoryProfileFormAptSourcesPanel/RepositoryProfileFormAptSourcesPanel.tsx b/src/features/repository-profiles/components/RepositoryProfileFormAptSourcesPanel/RepositoryProfileFormAptSourcesPanel.tsx
index 7b0ff3bee..6e271ee1d 100644
--- a/src/features/repository-profiles/components/RepositoryProfileFormAptSourcesPanel/RepositoryProfileFormAptSourcesPanel.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileFormAptSourcesPanel/RepositoryProfileFormAptSourcesPanel.tsx
@@ -53,29 +53,36 @@ const RepositoryProfileFormAptSourcesPanel: FC<
 
         {filteredAptSources.length > 0 && (
           <ul className="p-list--divided u-no-margin--bottom">
-            {filteredAptSources.map(({ id, line, name }) => (
-              <li key={name} className="p-list__item">
+            {filteredAptSources.map((aptSource) => (
+              <li key={aptSource.name} className="p-list__item">
                 <Row className="u-no-padding--left u-no-padding--right">
                   <Col small={1} medium={2} size={4}>
                     <CheckboxInput
-                      label={name}
+                      label={aptSource.name}
                       {...formik.getFieldProps("apt_sources")}
-                      checked={formik.values.apt_sources.includes(id)}
+                      checked={formik.values.apt_sources.some(
+                        ({ id }) => id === aptSource.id,
+                      )}
                       onChange={() =>
                         formik.setFieldValue(
                           "apt_sources",
-                          formik.values.apt_sources.includes(id)
+                          formik.values.apt_sources.some(
+                            ({ id }) => id === aptSource.id,
+                          )
                             ? formik.values.apt_sources.filter(
-                                (item) => item !== id,
+                                ({ id }) => id !== aptSource.id,
                               )
-                            : [...formik.values.apt_sources, id],
+                            : [...formik.values.apt_sources, aptSource],
                         )
                       }
                     />
                   </Col>
                   <Col small={3} medium={4} size={8}>
-                    <p className="u-no-margin--bottom u-truncate" title={line}>
-                      {line}
+                    <p
+                      className="u-no-margin--bottom u-truncate"
+                      title={aptSource.line}
+                    >
+                      {aptSource.line}
                     </p>
                   </Col>
                 </Row>
diff --git a/src/features/repository-profiles/components/RepositoryProfileFormDetailsPanel/RepositoryProfileFormDetailsPanel.test.tsx b/src/features/repository-profiles/components/RepositoryProfileFormDetailsPanel/RepositoryProfileFormDetailsPanel.test.tsx
index aefdad4b4..7776c78d5 100644
--- a/src/features/repository-profiles/components/RepositoryProfileFormDetailsPanel/RepositoryProfileFormDetailsPanel.test.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileFormDetailsPanel/RepositoryProfileFormDetailsPanel.test.tsx
@@ -28,27 +28,28 @@ describe("RepositoryProfileFormDetailsPanel", () => {
 
   it("renders input fields", () => {
     renderWithProviders(<Wrapper />);
-    expect(screen.getByLabelText("Title")).toBeInTheDocument();
+    expect(screen.getByLabelText("Profile name")).toBeInTheDocument();
     expect(screen.getByLabelText("Description")).toBeInTheDocument();
     expect(screen.getByLabelText("Access group")).toBeInTheDocument();
   });
 
   it("renders title as required when isTitleRequired is true", async () => {
     renderWithProviders(<Wrapper isTitleRequired />);
-    expect(screen.getByLabelText("Title")).toHaveAttribute("required");
+    expect(screen.getByLabelText("Profile name")).toHaveAttribute("required");
   });
 
   it("renders title as optional when isTitleRequired is false", () => {
     renderWithProviders(<Wrapper />);
-    expect(screen.getByLabelText("Title")).not.toHaveAttribute("required");
+    expect(screen.getByLabelText("Profile name")).toHaveAttribute("required");
   });
 
-  it("renders disabled access group when isAccessGroupDisabled is true", () => {
+  it("renders read-only access group when isAccessGroupDisabled is true", () => {
     renderWithProviders(<Wrapper isAccessGroupDisabled />);
-    expect(screen.getByLabelText("Access group")).toBeDisabled();
+    expect(screen.getByText("Access group")).toBeInTheDocument();
+    expect(screen.queryByRole("combobox")).not.toBeInTheDocument();
   });
 
-  it("renders enabled access group when isAccessGroupDisabled is false", () => {
+  it("renders enabled access group select when isAccessGroupDisabled is false", () => {
     renderWithProviders(<Wrapper />);
     expect(screen.getByLabelText("Access group")).toBeEnabled();
   });
diff --git a/src/features/repository-profiles/components/RepositoryProfileFormDetailsPanel/RepositoryProfileFormDetailsPanel.tsx b/src/features/repository-profiles/components/RepositoryProfileFormDetailsPanel/RepositoryProfileFormDetailsPanel.tsx
index 8aa799294..27a0e443e 100644
--- a/src/features/repository-profiles/components/RepositoryProfileFormDetailsPanel/RepositoryProfileFormDetailsPanel.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileFormDetailsPanel/RepositoryProfileFormDetailsPanel.tsx
@@ -1,10 +1,10 @@
 import type { FormikContextType } from "formik";
 import type { FC } from "react";
 import { Input, Select } from "@canonical/react-components";
-import AssociationBlock from "@/components/form/AssociationBlock";
 import type { RepositoryProfileFormValues } from "../../types";
 import type { AccessGroup } from "@/features/access-groups";
 import { getFormikError } from "@/utils/formikErrors";
+import ReadOnlyField from "@/components/form/ReadOnlyField";
 
 interface RepositoryProfileFormDetailsPanelProps {
   readonly accessGroups: AccessGroup[];
@@ -18,7 +18,6 @@ const RepositoryProfileFormDetailsPanel: FC<
 > = ({
   accessGroups,
   formik,
-  isTitleRequired = false,
   isAccessGroupDisabled = false,
 }) => {
   const accessGroupOptions = accessGroups.map(({ name, title }) => ({
@@ -30,8 +29,8 @@ const RepositoryProfileFormDetailsPanel: FC<
     <>
       <Input
         type="text"
-        label="Title"
-        required={isTitleRequired}
+        label="Profile name"
+        required
         autoComplete="off"
         error={getFormikError(formik, "title")}
         {...formik.getFieldProps("title")}
@@ -43,14 +42,21 @@ const RepositoryProfileFormDetailsPanel: FC<
         error={getFormikError(formik, "description")}
         {...formik.getFieldProps("description")}
       />
-      <Select
-        label="Access group"
-        options={accessGroupOptions}
-        disabled={isAccessGroupDisabled}
-        error={getFormikError(formik, "access_group")}
-        {...formik.getFieldProps("access_group")}
-      />
-      <AssociationBlock formik={formik} />
+      {isAccessGroupDisabled ? (
+        <ReadOnlyField
+          label="Access group"
+          tooltipMessage={`You can't change the access group after the repository profile has been created`}
+          {...formik.getFieldProps("access_group")}
+        />
+      ) : (
+        <Select
+          label="Access group"
+          options={accessGroupOptions}
+          required
+          error={getFormikError(formik, "access_group")}
+          {...formik.getFieldProps("access_group")}
+        />
+      )}
     </>
   );
 };
diff --git a/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.module.scss b/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.module.scss
new file mode 100644
index 000000000..da4cb6f5e
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.module.scss
@@ -0,0 +1,17 @@
+.nameColumn {
+  width: 50%;
+}
+.actionsColumn {
+  text-align: right;
+  white-space: nowrap;
+}
+
+.actionsCell {
+  display: flex;
+  gap: 0;
+  justify-content: flex-end;
+
+  button {
+    margin-right: 5px;
+  }
+}
diff --git a/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.test.tsx b/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.test.tsx
new file mode 100644
index 000000000..f1e6850a4
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.test.tsx
@@ -0,0 +1,96 @@
+import { aptSources } from "@/tests/mocks/apt-sources";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it, vi } from "vitest";
+import RepositoryProfileFormSourcesSection from "./RepositoryProfileFormSourcesSection";
+
+const defaultProps = {
+  sources: aptSources,
+  onRemoveSource: vi.fn(),
+  onEditSource: vi.fn(),
+};
+
+describe("RepositoryProfileFormSourcesSection", () => {
+  const user = userEvent.setup();
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it("renders column headers", () => {
+    renderWithProviders(<RepositoryProfileFormSourcesSection {...defaultProps} />);
+
+    expect(screen.getByText("Source name")).toBeInTheDocument();
+  });
+
+  it("renders empty state message when no sources", () => {
+    renderWithProviders(
+      <RepositoryProfileFormSourcesSection
+        {...defaultProps}
+        sources={[]}
+      />,
+    );
+
+    expect(
+      screen.getByText("No sources have been added yet."),
+    ).toBeInTheDocument();
+  });
+
+  it("renders source names and types", () => {
+    renderWithProviders(<RepositoryProfileFormSourcesSection {...defaultProps} />);
+
+    for (const source of aptSources.slice(0, 10)) {
+      expect(screen.getByText(source.name)).toBeInTheDocument();
+    }
+  });
+
+  it("calls onEditSource with the correct APTSource on edit button click", async () => {
+    const [firstSource] = aptSources;
+    renderWithProviders(<RepositoryProfileFormSourcesSection {...defaultProps} />);
+
+    await user.click(
+      screen.getByRole("button", { name: `Edit ${firstSource.name}` }),
+    );
+
+    expect(defaultProps.onEditSource).toHaveBeenCalledOnce();
+    expect(defaultProps.onEditSource).toHaveBeenCalledWith(
+      expect.objectContaining({ name: firstSource.name }),
+    );
+  });
+
+  it("calls onRemoveSource with the correct APTSource on remove button click", async () => {
+    const [firstSource] = aptSources;
+    renderWithProviders(<RepositoryProfileFormSourcesSection {...defaultProps} />);
+
+    await user.click(
+      screen.getByRole("button", { name: `Remove ${firstSource.name}` }),
+    );
+
+    expect(defaultProps.onRemoveSource).toHaveBeenCalledOnce();
+    expect(defaultProps.onRemoveSource).toHaveBeenCalledWith(
+      expect.objectContaining({ name: firstSource.name }),
+    );
+  });
+
+  it("renders validation error message when error prop is provided", () => {
+    renderWithProviders(
+      <RepositoryProfileFormSourcesSection
+        {...defaultProps}
+        error="At least one source is required."
+      />,
+    );
+
+    expect(
+      screen.getByText("At least one source is required."),
+    ).toBeInTheDocument();
+  });
+
+  it("does not render error message when error prop is absent", () => {
+    renderWithProviders(<RepositoryProfileFormSourcesSection {...defaultProps} />);
+
+    expect(
+      screen.queryByText("At least one source is required."),
+    ).not.toBeInTheDocument();
+  });
+});
diff --git a/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.tsx b/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.tsx
new file mode 100644
index 000000000..8c7b726d0
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.tsx
@@ -0,0 +1,123 @@
+import type { APTSource } from "@/features/apt-sources";
+import { ModalTablePagination } from "@/components/layout/TablePagination";
+import { Button, Icon, ModularTable } from "@canonical/react-components";
+import type { FC } from "react";
+import { useMemo, useState } from "react";
+import type { CellProps, Column } from "react-table";
+import classes from "./RepositoryProfileFormSourcesSection.module.scss";
+
+interface SourceRow extends Record<string, unknown> {
+  name: string;
+  line: string;
+  isPending: boolean;
+  source: APTSource;
+}
+
+interface RepositoryProfileFormSourcesSectionProps {
+  readonly sources: APTSource[];
+  readonly onRemoveSource: (source: APTSource) => void;
+  readonly onEditSource: (source: APTSource) => void;
+  readonly error?: string;
+}
+
+const RepositoryProfileFormSourcesSection: FC<
+  RepositoryProfileFormSourcesSectionProps
+> = ({
+  sources,
+  onRemoveSource,
+  onEditSource,
+  error,
+}) => {
+  const [currentPage, setCurrentPage] = useState(1);
+  const pageSize = 10;
+
+  const rows: SourceRow[] = useMemo(
+    () =>
+      sources.map((s) => ({
+        name: s.name,
+        line: s.line,
+        isPending: s.id === 0,
+        source: s,
+      })),
+    [sources],
+  );
+
+  const safePage = Math.min(currentPage, Math.max(1, Math.ceil(rows.length / pageSize)));
+
+  const pagedRows = useMemo(
+    () => rows.slice((safePage - 1) * pageSize, safePage * pageSize),
+    [rows, safePage, pageSize],
+  );
+
+  const columns = useMemo<Column<SourceRow>[]>(
+    () => [
+      {
+        accessor: "name",
+        Header: "Source name",
+        className: classes.nameColumn,
+        Cell: ({ row: { original } }: CellProps<SourceRow>) => (
+            original.name
+        ),
+      },
+      {
+        id: "actions",
+        Header: "",
+        className: classes.actionsColumn,
+        Cell: ({ row: { original } }: CellProps<SourceRow>) => (
+          <div className={classes.actionsCell}>
+            <Button
+              appearance="base"
+              hasIcon
+              dense
+              type="button"
+              className="u-no-margin--bottom u-no-padding"
+              aria-label={`Edit ${original.name}`}
+              onClick={() => {
+                onEditSource(original.source);
+              }}
+            >
+              <Icon name="edit" className="u-no-margin--left u-no-margin--right" />
+            </Button>
+            <Button
+              appearance="base"
+              hasIcon
+              dense
+              type="button"
+              className="u-no-margin--bottom u-no-padding"
+              aria-label={`Remove ${original.name}`}
+              onClick={() => {
+                onRemoveSource(original.source);
+              }}
+            >
+              <Icon name="delete" className="u-no-margin--left u-no-margin--right" />
+            </Button>
+          </div>
+        ),
+      },
+    ],
+    [onRemoveSource, onEditSource],
+  );
+
+  return (
+    <>
+      <ModularTable
+        columns={columns}
+        data={pagedRows}
+        emptyMsg="No sources have been added yet."
+      />
+      <ModalTablePagination
+        current={safePage}
+        max={Math.max(1, Math.ceil(rows.length / pageSize))}
+        onPrev={() => { setCurrentPage(safePage - 1); }}
+        onNext={() => { setCurrentPage(safePage + 1); }}
+      />
+      {error && (
+        <div className="p-form-validation is-error">
+          <p className="p-form-validation__message">{error}</p>
+        </div>
+      )}
+    </>
+  );
+};
+
+export default RepositoryProfileFormSourcesSection;
diff --git a/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/index.ts b/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/index.ts
new file mode 100644
index 000000000..bac2f16b2
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/index.ts
@@ -0,0 +1 @@
+export { default } from "./RepositoryProfileFormSourcesSection";
diff --git a/src/features/repository-profiles/components/RepositoryProfileFormTabs/RepositoryProfileFormTabs.test.tsx b/src/features/repository-profiles/components/RepositoryProfileFormTabs/RepositoryProfileFormTabs.test.tsx
index d389d7339..31e6f2ef3 100644
--- a/src/features/repository-profiles/components/RepositoryProfileFormTabs/RepositoryProfileFormTabs.test.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileFormTabs/RepositoryProfileFormTabs.test.tsx
@@ -1,13 +1,43 @@
 import { renderWithProviders } from "@/tests/render";
 import { screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-import { describe, it } from "vitest";
+import { describe, expect, it, vi } from "vitest";
 import RepositoryProfileFormTabs from "./RepositoryProfileFormTabs";
 
 describe("RepositoryProfileFormTabs", () => {
   const user = userEvent.setup();
 
-  it("switches tabs on click", async () => {
+  it("renders all three tabs", () => {
+    renderWithProviders(
+      <RepositoryProfileFormTabs currentTab={0} onCurrentTabChange={vi.fn()} />,
+    );
+
+    expect(screen.getByRole("tab", { name: "Details" })).toBeInTheDocument();
+    expect(screen.getByRole("tab", { name: "Pockets" })).toBeInTheDocument();
+    expect(screen.getByRole("tab", { name: "APT sources" })).toBeInTheDocument();
+  });
+
+  it("marks the active tab based on currentTab prop", () => {
+    renderWithProviders(
+      <RepositoryProfileFormTabs currentTab={1} onCurrentTabChange={vi.fn()} />,
+    );
+
+    expect(screen.getByRole("tab", { name: "Pockets" })).toHaveAttribute("aria-selected", "true");
+    expect(screen.getByRole("tab", { name: "Details" })).not.toHaveAttribute("aria-selected", "true");
+    expect(screen.getByRole("tab", { name: "APT sources" })).not.toHaveAttribute("aria-selected", "true");
+  });
+
+  it("calls onCurrentTabChange with 0 when Details tab is clicked", async () => {
+    const setTab = vi.fn();
+    renderWithProviders(
+      <RepositoryProfileFormTabs currentTab={1} onCurrentTabChange={setTab} />,
+    );
+
+    await user.click(screen.getByRole("tab", { name: "Details" }));
+    expect(setTab).toHaveBeenCalledWith(0);
+  });
+
+  it("calls onCurrentTabChange with 1 when Pockets tab is clicked", async () => {
     const setTab = vi.fn();
     renderWithProviders(
       <RepositoryProfileFormTabs currentTab={0} onCurrentTabChange={setTab} />,
@@ -16,4 +46,14 @@ describe("RepositoryProfileFormTabs", () => {
     await user.click(screen.getByRole("tab", { name: "Pockets" }));
     expect(setTab).toHaveBeenCalledWith(1);
   });
+
+  it("calls onCurrentTabChange with 2 when APT sources tab is clicked", async () => {
+    const setTab = vi.fn();
+    renderWithProviders(
+      <RepositoryProfileFormTabs currentTab={0} onCurrentTabChange={setTab} />,
+    );
+
+    await user.click(screen.getByRole("tab", { name: "APT sources" }));
+    expect(setTab).toHaveBeenCalledWith(2);
+  });
 });
diff --git a/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.module.scss b/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.module.scss
index 50c29d5f6..a7aaf8e5d 100644
--- a/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.module.scss
+++ b/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.module.scss
@@ -4,6 +4,14 @@
   width: 15%;
 }
 
-.description {
-  width: 45%;
+.applied {
+  width: 15%;
+}
+
+.pending {
+  width: 15%;
+}
+
+.associated {
+  width: 15%;
 }
diff --git a/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.test.tsx b/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.test.tsx
index d0e8d61e9..4bdc037db 100644
--- a/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.test.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.test.tsx
@@ -1,19 +1,26 @@
-import { NO_DATA_TEXT } from "@/components/layout/NoData";
 import { accessGroups } from "@/tests/mocks/accessGroup";
 import { repositoryProfiles } from "@/tests/mocks/repositoryProfiles";
 import { renderWithProviders } from "@/tests/render";
 import { screen, within } from "@testing-library/react";
-import { describe, it } from "vitest";
+import userEvent from "@testing-library/user-event";
+import { useLocation } from "react-router";
+import { describe, expect, it } from "vitest";
 import RepositoryProfileList from "./RepositoryProfileList";
 
+const LocationDisplay = () => {
+  const { search } = useLocation();
+  return <div data-testid="location">{search}</div>;
+};
+
 describe("RepositoryProfileList", () => {
+  const user = userEvent.setup();
   it("renders table headers and rows", async () => {
     renderWithProviders(
       <RepositoryProfileList repositoryProfiles={repositoryProfiles} />,
     );
 
     const table = screen.getByRole("table");
-    expect(table).toHaveTexts(["Title", "Description", "Access group"]);
+    expect(table).toHaveTexts(["Profile Name", "Associated", "Access group"]);
 
     for (const profile of repositoryProfiles) {
       const row = within(table).getByRole("row", {
@@ -22,14 +29,6 @@ describe("RepositoryProfileList", () => {
       });
       expect(row).toBeInTheDocument();
 
-      if (profile.description) {
-        expect(within(row).getByText(profile.description)).toBeInTheDocument();
-      } else {
-        expect(
-          within(row).getByRole("cell", { name: /description/i }),
-        ).toHaveTextContent(NO_DATA_TEXT);
-      }
-
       const accessGroup = accessGroups.find(
         (group) => group.name === profile.access_group,
       )?.title;
@@ -39,9 +38,46 @@ describe("RepositoryProfileList", () => {
     }
   });
 
-  it("filters with search param", () => {
+  it("renders applied count for each profile row", async () => {
+    const [firstProfile] = repositoryProfiles;
     renderWithProviders(
-      <RepositoryProfileList repositoryProfiles={repositoryProfiles} />,
+      <RepositoryProfileList repositoryProfiles={[firstProfile]} />,
+    );
+
+    const table = screen.getByRole("table");
+    const row = within(table).getByRole("row", {
+      name: (name) => name.toLowerCase().includes(firstProfile.title.toLowerCase()),
+    });
+
+    expect(
+      await within(row).findByText(String(firstProfile.applied_count)),
+    ).toBeInTheDocument();
+  });
+
+  it("sets sidePath=view and name in URL when clicking a profile title", async () => {
+    const [firstProfile] = repositoryProfiles;
+    renderWithProviders(
+      <>
+        <RepositoryProfileList repositoryProfiles={repositoryProfiles} />
+        <LocationDisplay />
+      </>,
+    );
+
+    await user.click(
+      await screen.findByRole("button", { name: firstProfile.title }),
+    );
+
+    expect(
+      await screen.findByText(/sidePath=view/, { selector: "[data-testid='location']" }),
+    ).toHaveTextContent(`name=${firstProfile.name}`);
+  });
+
+  it("renders only the profiles passed in (server-side filtering)", () => {
+    renderWithProviders(
+      <RepositoryProfileList
+        repositoryProfiles={[repositoryProfiles[0]]}
+        totalCount={1}
+      />,
       undefined,
       `/?search=${repositoryProfiles[0].title}`,
     );
diff --git a/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.tsx b/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.tsx
index 7210755a4..aa00f83c9 100644
--- a/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.tsx
@@ -2,27 +2,40 @@ import { LIST_ACTIONS_COLUMN_PROPS } from "@/components/layout/ListActions";
 import ListTitle, {
   LIST_TITLE_COLUMN_PROPS,
 } from "@/components/layout/ListTitle";
-import NoData from "@/components/layout/NoData";
+import LoadingState from "@/components/layout/LoadingState";
 import ResponsiveTable from "@/components/layout/ResponsiveTable";
+import { TablePagination } from "@/components/layout/TablePagination";
 import usePageParams from "@/hooks/usePageParams";
 import useRoles from "@/hooks/useRoles";
 import type { SelectOption } from "@/types/SelectOption";
+import { Button } from "@canonical/react-components";
 import type { FC } from "react";
 import { useMemo } from "react";
 import type { CellProps, Column } from "react-table";
 import type { RepositoryProfile } from "../../types";
+import { useGetProfileInstancesCount } from "../../api";
 import RepositoryProfileListActions from "../RepositoryProfileListActions";
 import { getCellProps, getRowProps } from "./helpers";
 import classes from "./RepositoryProfileList.module.scss";
 
+const AssociatedCountCell: FC<{ readonly profileId: number }> = ({ profileId }) => {
+  const { associatedCount, isLoadingCount } = useGetProfileInstancesCount(profileId);
+  if (isLoadingCount) {
+    return <LoadingState inline />;
+  }
+  return <>{associatedCount}</>;
+};
+
 interface RepositoryProfileListProps {
   readonly repositoryProfiles: RepositoryProfile[];
+  readonly totalCount?: number;
 }
 
 const RepositoryProfileList: FC<RepositoryProfileListProps> = ({
   repositoryProfiles,
+  totalCount = 0,
 }) => {
-  const { search } = usePageParams();
+  const { search, createPageParamsSetter } = usePageParams();
   const { getAccessGroupQuery } = useRoles();
   const { data: accessGroupsResponse } = getAccessGroupQuery();
 
@@ -33,44 +46,28 @@ const RepositoryProfileList: FC<RepositoryProfileListProps> = ({
     value: name,
   }));
 
-  const profiles = useMemo(() => {
-    if (!search) {
-      return repositoryProfiles;
-    }
-
-    return repositoryProfiles.filter((profile) => {
-      return profile.title.toLowerCase().includes(search.toLowerCase());
-    });
-  }, [repositoryProfiles, search]);
-
   const columns = useMemo<Column<RepositoryProfile>[]>(
-    () => [
+    () => {
+      return [
       {
         ...LIST_TITLE_COLUMN_PROPS,
         meta: {
           ariaLabel: ({ original }) =>
             `${original.title} profile title and name`,
         },
-        Cell: ({ row }: CellProps<RepositoryProfile>) => (
+        Cell: ({ row: { original } }: CellProps<RepositoryProfile>) => (
           <ListTitle>
-            {row.original.title}
-            <span className="u-text--muted">{row.original.name}</span>
+            <Button
+              type="button"
+              appearance="link"
+              className="u-no-margin--bottom u-no-padding--top u-align--left"
+              onClick={createPageParamsSetter({ sidePath: ["view"], name: original.name })}
+            >
+              {original.title}
+            </Button>
           </ListTitle>
         ),
       },
-      {
-        accessor: "description",
-        Header: "Description",
-        className: classes.description,
-        meta: {
-          ariaLabel: ({ original }) =>
-            original.description
-              ? `${original.title} profile description`
-              : `No description for ${original.title} profile`,
-        },
-        Cell: ({ row }: CellProps<RepositoryProfile>) =>
-          row.original.description || <NoData />,
-      },
       {
         accessor: "access_group",
         Header: "Access group",
@@ -83,24 +80,62 @@ const RepositoryProfileList: FC<RepositoryProfileListProps> = ({
             ({ value }) => original.access_group === value,
           )?.label ?? original.access_group,
       },
+      {
+        accessor: "associated",
+        Header: "Associated",
+        className: classes.associated,
+        meta: {
+          ariaLabel: ({ original }) => `${original.title} profile associated machines count`,
+        },
+        Cell: ({ row: { original } }: CellProps<RepositoryProfile>) => (
+          <AssociatedCountCell profileId={original.id} />
+        ),
+      },
+      {
+        accessor: "applied_count",
+        Header: "Applied",
+        className: classes.applied,
+        meta: {
+          ariaLabel: ({ original }) => `${original.title} profile applied machines count`,
+        },
+        Cell: ({ row: { original } }: CellProps<RepositoryProfile>) =>
+          <>{original.applied_count ?? 0}</>,
+      },
+      {
+        accessor: "pending_count",
+        Header: "Pending",
+        className: classes.pending,
+        meta: {
+          ariaLabel: ({ original }) => `${original.title} profile pending machines count`,
+        },
+        Cell: ({ row: { original } }: CellProps<RepositoryProfile>) =>
+          <>{original.pending_count ?? 0}</>,
+      },
       {
         ...LIST_ACTIONS_COLUMN_PROPS,
         Cell: ({ row }: CellProps<RepositoryProfile>) => (
           <RepositoryProfileListActions profile={row.original} />
         ),
       },
-    ],
+    ];
+  },
     [accessGroupOptions],
   );
 
   return (
-    <ResponsiveTable
-      columns={columns}
-      data={profiles}
-      getCellProps={getCellProps()}
-      getRowProps={getRowProps()}
-      emptyMsg={`No repository profiles found with the search "${search}"`}
-    />
+    <>
+      <ResponsiveTable
+        columns={columns}
+        data={repositoryProfiles}
+        getCellProps={getCellProps()}
+        getRowProps={getRowProps()}
+        emptyMsg={`No repository profiles found with the search "${search}"`}
+      />
+      <TablePagination
+        totalItems={totalCount}
+        currentItemCount={repositoryProfiles.length}
+      />
+    </>
   );
 };
 
diff --git a/src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.test.tsx b/src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.test.tsx
index d532e51c1..36bebfe11 100644
--- a/src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.test.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.test.tsx
@@ -1,21 +1,42 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
 import { renderWithProviders } from "@/tests/render";
+import { ENDPOINT_STATUS_API_ERROR_MESSAGE } from "@/tests/server/handlers/_constants";
 import { screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
+import { useLocation } from "react-router";
 import { describe, it, expect } from "vitest";
 import { repositoryProfiles } from "@/tests/mocks/repositoryProfiles";
 import RepositoryProfileListActions from "./RepositoryProfileListActions";
 
+const LocationDisplay = () => {
+  const { search } = useLocation();
+  return <div data-testid="location">{search}</div>;
+};
+
 const [profile] = repositoryProfiles;
 
 describe("RepositoryProfileListActions", () => {
   const user = userEvent.setup();
 
-  it("opens actions menu and shows options", async () => {
-    renderWithProviders(<RepositoryProfileListActions profile={profile} />);
-
+  const openMenu = async () => {
     await user.click(
       screen.getByRole("button", { name: `${profile.title} profile actions` }),
     );
+  };
+
+  const openRemoveModal = async () => {
+    await openMenu();
+    await user.click(
+      screen.getByRole("menuitem", {
+        name: `Remove "${profile.title}" repository profile`,
+      }),
+    );
+  };
+
+  it("opens actions menu and shows options", async () => {
+    renderWithProviders(<RepositoryProfileListActions profile={profile} />);
+
+    await openMenu();
     expect(
       screen.getByRole("menuitem", { name: `Edit "${profile.title}" profile` }),
     ).toBeInTheDocument();
@@ -26,30 +47,72 @@ describe("RepositoryProfileListActions", () => {
     ).toBeInTheDocument();
   });
 
-  it("opens sidepanel when clicking edit button", async () => {
-    renderWithProviders(<RepositoryProfileListActions profile={profile} />);
-    await user.click(
-      screen.getByRole("button", { name: `${profile.title} profile actions` }),
+  it("sets sidePath=edit and name in URL when clicking edit button", async () => {
+    renderWithProviders(
+      <>
+        <RepositoryProfileListActions profile={profile} />
+        <LocationDisplay />
+      </>,
     );
+    await openMenu();
     await user.click(
       screen.getByRole("menuitem", { name: `Edit "${profile.title}" profile` }),
     );
 
-    expect(
-      screen.getByRole("heading", { name: `Edit ${profile.title}` }),
-    ).toBeInTheDocument();
+    const locationEl = screen.getByTestId("location");
+    expect(locationEl).toHaveTextContent(`sidePath=edit`);
+    expect(locationEl).toHaveTextContent(`name=${profile.name}`);
   });
 
   it("opens modal when clicking remove button", async () => {
     renderWithProviders(<RepositoryProfileListActions profile={profile} />);
-    await user.click(
-      screen.getByRole("button", { name: `${profile.title} profile actions` }),
+    await openRemoveModal();
+
+    expect(screen.getByRole("dialog")).toBeInTheDocument();
+  });
+
+  it("keeps Remove button disabled until confirmation text is typed", async () => {
+    renderWithProviders(<RepositoryProfileListActions profile={profile} />);
+    await openRemoveModal();
+
+    const removeButton = screen.getByRole("button", { name: "Remove" });
+    expect(removeButton).toHaveAttribute("aria-disabled", "true");
+
+    await user.type(
+      screen.getByRole("textbox"),
+      `remove ${profile.title}`,
     );
-    await user.click(
-      screen.getByRole("menuitem", {
-        name: `Remove "${profile.title}" repository profile`,
-      }),
+    expect(removeButton).not.toHaveAttribute("aria-disabled", "true");
+  });
+
+  it("shows success notification after successful profile removal", async () => {
+    renderWithProviders(<RepositoryProfileListActions profile={profile} />);
+    await openRemoveModal();
+
+    await user.type(
+      screen.getByRole("textbox"),
+      `remove ${profile.title}`,
     );
-    expect(screen.getByRole("dialog")).toBeInTheDocument();
+    await user.click(screen.getByRole("button", { name: "Remove" }));
+
+    expect(
+      await screen.findByText("Repository profile removed"),
+    ).toBeInTheDocument();
+  });
+
+  it("shows error notification when removal fails", async () => {
+    renderWithProviders(<RepositoryProfileListActions profile={profile} />);
+    setEndpointStatus({ status: "error", path: "RemoveRepositoryProfile" });
+
+    await openRemoveModal();
+    await user.type(
+      screen.getByRole("textbox"),
+      `remove ${profile.title}`,
+    );
+    await user.click(screen.getByRole("button", { name: "Remove" }));
+
+    expect(
+      await screen.findByText(ENDPOINT_STATUS_API_ERROR_MESSAGE),
+    ).toBeInTheDocument();
   });
 });
diff --git a/src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.tsx b/src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.tsx
index b239d0f3e..e1411f241 100644
--- a/src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.tsx
@@ -1,20 +1,14 @@
 import TextConfirmationModal from "@/components/form/TextConfirmationModal";
 import ListActions from "@/components/layout/ListActions";
-import LoadingState from "@/components/layout/LoadingState";
 import useDebug from "@/hooks/useDebug";
 import useNotify from "@/hooks/useNotify";
-import useSidePanel from "@/hooks/useSidePanel";
+import usePageParams from "@/hooks/usePageParams";
 import type { Action } from "@/types/Action";
 import type { FC } from "react";
-import { lazy, Suspense } from "react";
 import { useBoolean } from "usehooks-ts";
-import { useRepositoryProfiles } from "../../hooks";
+import { useRepositoryProfiles } from "../../api";
 import type { RepositoryProfile } from "../../types";
 
-const RepositoryProfileForm = lazy(
-  async () => import("../RepositoryProfileForm"),
-);
-
 interface RepositoryProfileListActionsProps {
   readonly profile: RepositoryProfile;
 }
@@ -24,7 +18,7 @@ const RepositoryProfileListActions: FC<RepositoryProfileListActionsProps> = ({
 }) => {
   const debug = useDebug();
   const { notify } = useNotify();
-  const { setSidePanelContent } = useSidePanel();
+  const { createPageParamsSetter } = usePageParams();
 
   const { removeRepositoryProfileQuery } = useRepositoryProfiles();
 
@@ -37,14 +31,7 @@ const RepositoryProfileListActions: FC<RepositoryProfileListActionsProps> = ({
   const { mutateAsync: removeRepositoryProfile, isPending: isRemoving } =
     removeRepositoryProfileQuery;
 
-  const handleEditProfile = () => {
-    setSidePanelContent(
-      `Edit ${profile.title}`,
-      <Suspense fallback={<LoadingState />}>
-        <RepositoryProfileForm action="edit" profile={profile} />
-      </Suspense>,
-    );
-  };
+  const handleEditProfile = createPageParamsSetter({ sidePath: ["edit"], name: profile.name });
 
   const handleRemoveProfile = async () => {
     try {
diff --git a/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.test.tsx b/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.test.tsx
new file mode 100644
index 000000000..8420a3405
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.test.tsx
@@ -0,0 +1,117 @@
+import type { APTSource } from "@/features/apt-sources";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it, vi } from "vitest";
+import RepositoryProfileSourceForm from "./RepositoryProfileSourceForm";
+
+const user = userEvent.setup();
+
+const defaultProps = {
+  onSuccess: vi.fn(),
+  onBack: vi.fn(),
+};
+
+describe("RepositoryProfileSourceForm", () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it("renders source name, deb line, and GPG key fields", () => {
+    renderWithProviders(<RepositoryProfileSourceForm {...defaultProps} />);
+
+    expect(screen.getByLabelText(/source name/i)).toBeInTheDocument();
+    expect(screen.getByLabelText(/deb line/i)).toBeInTheDocument();
+    expect(screen.getByLabelText(/gpg key/i)).toBeInTheDocument();
+  });
+
+  it("shows required validation errors when submitting empty form", async () => {
+    renderWithProviders(<RepositoryProfileSourceForm {...defaultProps} />);
+
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    expect(
+      await screen.findAllByText("This field is required."),
+    ).toHaveLength(2);
+  });
+
+  it("calls onSuccess with correct APTSource on valid submit (no GPG key)", async () => {
+    renderWithProviders(<RepositoryProfileSourceForm {...defaultProps} />);
+
+    await user.type(screen.getByLabelText(/source name/i), "my-source");
+    await user.type(
+      screen.getByLabelText(/deb line/i),
+      "deb http://example.com/ubuntu focal main",
+    );
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    const expected: APTSource = {
+      id: 0,
+      access_group: "",
+      profiles: [],
+      name: "my-source",
+      line: "deb http://example.com/ubuntu focal main",
+      gpg_key: null,
+    };
+
+    expect(defaultProps.onSuccess).toHaveBeenCalledOnce();
+    expect(defaultProps.onSuccess).toHaveBeenCalledWith(expected);
+  });
+
+  it("includes gpg_key in APTSource when GPG key is provided", async () => {
+    renderWithProviders(<RepositoryProfileSourceForm {...defaultProps} />);
+
+    await user.type(screen.getByLabelText(/source name/i), "my-source");
+    await user.type(
+      screen.getByLabelText(/deb line/i),
+      "deb http://example.com/ubuntu focal main",
+    );
+    await user.type(screen.getByLabelText(/gpg key/i), "sign-key");
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    const expected: APTSource = {
+      id: 0,
+      access_group: "",
+      profiles: [],
+      name: "my-source",
+      line: "deb http://example.com/ubuntu focal main",
+      gpg_key: "sign-key",
+    };
+
+    expect(defaultProps.onSuccess).toHaveBeenCalledWith(expected);
+  });
+
+  it("does not call any mutation hook on submit", async () => {
+    renderWithProviders(<RepositoryProfileSourceForm {...defaultProps} />);
+
+    await user.type(screen.getByLabelText(/source name/i), "my-source");
+    await user.type(
+      screen.getByLabelText(/deb line/i),
+      "deb http://example.com/ubuntu focal main",
+    );
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    expect(defaultProps.onSuccess).toHaveBeenCalledOnce();
+  });
+
+  it("calls onBack when cancel button is clicked", async () => {
+    renderWithProviders(<RepositoryProfileSourceForm {...defaultProps} />);
+
+    await user.click(screen.getByRole("button", { name: /cancel/i }));
+
+    expect(defaultProps.onBack).toHaveBeenCalledOnce();
+  });
+
+  it("shows name validation error for invalid characters", async () => {
+    renderWithProviders(<RepositoryProfileSourceForm {...defaultProps} />);
+
+    await user.type(screen.getByLabelText(/source name/i), "INVALID NAME");
+    await user.tab();
+
+    expect(
+      await screen.findByText(
+        /name must start with alphanumeric/i,
+      ),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.tsx b/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.tsx
new file mode 100644
index 000000000..b74e550e3
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.tsx
@@ -0,0 +1,73 @@
+import type { APTSource } from "@/features/apt-sources";
+import type { RepositoryProfileSourceFormValues } from "../../types";
+import { getFormikError } from "@/utils/formikErrors";
+import { Form, Input, Textarea } from "@canonical/react-components";
+import { useFormik } from "formik";
+import type { FC } from "react";
+import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
+import { INITIAL_VALUES } from "./constants";
+import { getValidationSchema } from "./helpers";
+
+interface RepositoryProfileSourceFormProps {
+  readonly onSuccess: (source: APTSource) => void;
+  readonly onBack: () => void;
+  readonly initialValues?: RepositoryProfileSourceFormValues;
+}
+
+const RepositoryProfileSourceForm: FC<RepositoryProfileSourceFormProps> = ({
+  onSuccess,
+  onBack,
+  initialValues,
+}) => {
+  const formik = useFormik<RepositoryProfileSourceFormValues>({
+    initialValues: initialValues ?? INITIAL_VALUES,
+    validationSchema: getValidationSchema(),
+    onSubmit: (values) => {
+      const source: APTSource = {
+        id: 0,
+        access_group: "",
+        profiles: [],
+        name: values.name,
+        line: values.deb_line,
+        gpg_key: values.gpg_key_name || null,
+      };
+      onSuccess(source);
+    },
+  });
+
+  return (
+    <Form noValidate onSubmit={formik.handleSubmit}>
+      <Input
+        type="text"
+        label="Source name"
+        help={!formik.errors.name 
+          ? "Name must start with alphanumeric and contain only lowercase letters, numbers, -, or +." 
+          : undefined}
+        required
+        autoComplete="off"
+        error={getFormikError(formik, "name")}
+        {...formik.getFieldProps("name")}
+      />
+      <Input
+        type="text"
+        label="Deb line"
+        required
+        autoComplete="off"
+        placeholder="deb http://archive.ubuntu.com/ubuntu focal main"
+        error={getFormikError(formik, "deb_line")}
+        {...formik.getFieldProps("deb_line")}
+      />
+      <Textarea
+        label="GPG key"
+        error={getFormikError(formik, "gpg_key_name")}
+        {...formik.getFieldProps("gpg_key_name")}
+      />
+      <SidePanelFormButtons
+        submitButtonText="Save changes"
+        onCancel={onBack}
+      />
+    </Form>
+  );
+};
+
+export default RepositoryProfileSourceForm;
diff --git a/src/features/repository-profiles/components/RepositoryProfileSourceForm/constants.ts b/src/features/repository-profiles/components/RepositoryProfileSourceForm/constants.ts
new file mode 100644
index 000000000..fa6708cf6
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileSourceForm/constants.ts
@@ -0,0 +1,7 @@
+import type { RepositoryProfileSourceFormValues } from "../../types";
+
+export const INITIAL_VALUES: RepositoryProfileSourceFormValues = {
+  name: "",
+  deb_line: "",
+  gpg_key_name: "",
+};
diff --git a/src/features/repository-profiles/components/RepositoryProfileSourceForm/helpers.ts b/src/features/repository-profiles/components/RepositoryProfileSourceForm/helpers.ts
new file mode 100644
index 000000000..580ac0fa0
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileSourceForm/helpers.ts
@@ -0,0 +1,18 @@
+import * as Yup from "yup";
+
+export const getValidationSchema = () =>
+  Yup.object().shape({
+    name: Yup.string()
+      .required("This field is required.")
+      .matches(
+        /^[a-z0-9][a-z0-9+.-]*$/,
+        "Name must start with alphanumeric and contain only lowercase letters, numbers, -, or +.",
+      ),
+    deb_line: Yup.string()
+      .required("This field is required.")
+      .matches(
+        /^(deb|deb-src)\s+\S+/,
+        'Must start with "deb" or "deb-src" followed by a URL.',
+      ),
+    gpg_key_name: Yup.string(),
+  });
diff --git a/src/features/repository-profiles/components/RepositoryProfileSourceForm/index.ts b/src/features/repository-profiles/components/RepositoryProfileSourceForm/index.ts
new file mode 100644
index 000000000..4227bc2d1
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileSourceForm/index.ts
@@ -0,0 +1 @@
+export { default } from "./RepositoryProfileSourceForm";
diff --git a/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.module.scss b/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.module.scss
new file mode 100644
index 000000000..a9c74d961
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.module.scss
@@ -0,0 +1,24 @@
+.overlay {
+  background: var(--vf-color-background-default, #fff);
+  bottom: 0;
+  display: flex;
+  flex-direction: column;
+  left: 0;
+  position: absolute;
+  right: 0;
+  top: -40px;
+  z-index: 400;
+}
+
+.content {
+  flex-grow: 1;
+  overflow-y: auto;
+  padding: 1rem 1.5rem;
+}
+
+.title {
+  flex-grow: 1;
+  font-size: 1rem;
+  font-weight: 400;
+  margin: 0;
+}
diff --git a/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.test.tsx b/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.test.tsx
new file mode 100644
index 000000000..df0dc19f0
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.test.tsx
@@ -0,0 +1,70 @@
+import { aptSources } from "@/tests/mocks/apt-sources";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it, vi } from "vitest";
+import RepositoryProfileSourceFormOverlay from "./RepositoryProfileSourceFormOverlay";
+
+const defaultProps = {
+  onClose: vi.fn(),
+  onSourceAdded: vi.fn(),
+};
+
+describe("RepositoryProfileSourceFormOverlay", () => {
+  const user = userEvent.setup();
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it("renders empty source name, deb line, and GPG key fields when no sourceToEdit", () => {
+    renderWithProviders(<RepositoryProfileSourceFormOverlay {...defaultProps} />);
+
+    expect(screen.getByLabelText(/source name/i)).toHaveValue("");
+    expect(screen.getByLabelText(/deb line/i)).toHaveValue("");
+    expect(screen.getByLabelText(/gpg key/i)).toHaveValue("");
+  });
+
+  it("pre-populates fields from sourceToEdit when provided", () => {
+    const [sourceToEdit] = aptSources;
+    renderWithProviders(
+      <RepositoryProfileSourceFormOverlay
+        {...defaultProps}
+        sourceToEdit={sourceToEdit}
+      />,
+    );
+
+    expect(screen.getByLabelText(/source name/i)).toHaveValue(sourceToEdit.name);
+    expect(screen.getByLabelText(/deb line/i)).toHaveValue(sourceToEdit.line);
+    expect(screen.getByLabelText(/gpg key/i)).toHaveValue(
+      sourceToEdit.gpg_key ?? "",
+    );
+  });
+
+  it("calls onClose when cancel is clicked", async () => {
+    renderWithProviders(<RepositoryProfileSourceFormOverlay {...defaultProps} />);
+
+    await user.click(screen.getByRole("button", { name: /cancel/i }));
+
+    expect(defaultProps.onClose).toHaveBeenCalledOnce();
+  });
+
+  it("calls onSourceAdded with correct values on valid submit", async () => {
+    renderWithProviders(<RepositoryProfileSourceFormOverlay {...defaultProps} />);
+
+    await user.type(screen.getByLabelText(/source name/i), "my-source");
+    await user.type(
+      screen.getByLabelText(/deb line/i),
+      "deb http://archive.ubuntu.com/ubuntu focal main",
+    );
+    await user.click(screen.getByRole("button", { name: /save changes/i }));
+
+    expect(defaultProps.onSourceAdded).toHaveBeenCalledOnce();
+    expect(defaultProps.onSourceAdded).toHaveBeenCalledWith(
+      expect.objectContaining({
+        name: "my-source",
+        line: "deb http://archive.ubuntu.com/ubuntu focal main",
+      }),
+    );
+  });
+});
diff --git a/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.tsx b/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.tsx
new file mode 100644
index 000000000..d69a9ff8a
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.tsx
@@ -0,0 +1,36 @@
+import type { APTSource } from "@/features/apt-sources";
+import type { FC } from "react";
+import RepositoryProfileSourceForm from "../RepositoryProfileSourceForm";
+import classes from "./RepositoryProfileSourceFormOverlay.module.scss";
+
+interface RepositoryProfileSourceFormOverlayProps {
+  readonly onClose: () => void;
+  readonly onSourceAdded: (source: APTSource) => void;
+  readonly sourceToEdit?: APTSource | null;
+}
+
+const RepositoryProfileSourceFormOverlay: FC<
+  RepositoryProfileSourceFormOverlayProps
+> = ({ onClose, onSourceAdded, sourceToEdit }) => {
+  const derivedInitialValues = sourceToEdit
+    ? {
+        name: sourceToEdit.name,
+        deb_line: sourceToEdit.line,
+        gpg_key_name: sourceToEdit.gpg_key ?? "",
+      }
+    : undefined;
+
+  return (
+    <div className={classes.overlay}>
+      <div className={classes.content}>
+        <RepositoryProfileSourceForm
+          onSuccess={onSourceAdded}
+          onBack={onClose}
+          initialValues={derivedInitialValues}
+        />
+      </div>
+    </div>
+  );
+};
+
+export default RepositoryProfileSourceFormOverlay;
diff --git a/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/index.ts b/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/index.ts
new file mode 100644
index 000000000..071761174
--- /dev/null
+++ b/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/index.ts
@@ -0,0 +1 @@
+export { default } from "./RepositoryProfileSourceFormOverlay";
diff --git a/src/features/repository-profiles/index.ts b/src/features/repository-profiles/index.ts
index 5a070f68d..7d666d7c4 100644
--- a/src/features/repository-profiles/index.ts
+++ b/src/features/repository-profiles/index.ts
@@ -1,7 +1,9 @@
 export { default as RepositoryProfileAddButton } from "./components/RepositoryProfileAddButton";
 export { default as RepositoryProfileContainer } from "./components/RepositoryProfileContainer";
+export { default as RepositoryProfileDetails } from "./components/RepositoryProfileDetails";
+export { default as RepositoryProfileEditForm } from "./components/RepositoryProfileEditForm";
 export { default as RepositoryProfileForm } from "./components/RepositoryProfileForm";
 export { default as RepositoryProfileHeader } from "./components/RepositoryProfileHeader";
 export { default as RepositoryProfileList } from "./components/RepositoryProfileList";
-export { useRepositoryProfiles } from "./hooks";
+export { useRepositoryProfiles, useGetProfileInstancesCount, useGetRepositoryProfile } from "./api";
 export type { RepositoryProfile } from "./types";
diff --git a/src/features/repository-profiles/types/RepositoryProfile.ts b/src/features/repository-profiles/types/RepositoryProfile.ts
index 35e5ffb84..15c3d07cb 100644
--- a/src/features/repository-profiles/types/RepositoryProfile.ts
+++ b/src/features/repository-profiles/types/RepositoryProfile.ts
@@ -1,3 +1,4 @@
+import type { APTSource } from "@/features/apt-sources";
 import type { Distribution, Pocket, Series } from "@/features/mirrors";
 
 type RepositoryProfilePocket = Pocket & {
@@ -8,7 +9,8 @@ type RepositoryProfilePocket = Pocket & {
 export interface RepositoryProfile extends Record<string, unknown> {
   access_group: string;
   all_computers: boolean;
-  apt_sources: number[];
+  applied_count: number;
+  apt_sources: APTSource[];
   description: string;
   id: number;
   name: string;
diff --git a/src/features/repository-profiles/types/RepositoryProfileFormValues.ts b/src/features/repository-profiles/types/RepositoryProfileFormValues.ts
index 9618bd64f..7211e6920 100644
--- a/src/features/repository-profiles/types/RepositoryProfileFormValues.ts
+++ b/src/features/repository-profiles/types/RepositoryProfileFormValues.ts
@@ -1,4 +1,9 @@
-import type { CreateRepositoryProfileParams } from "../hooks";
+import type { APTSource } from "@/features/apt-sources";
+import type { CreateRepositoryProfileParams } from "../api";
 
-export type RepositoryProfileFormValues =
-  Required<CreateRepositoryProfileParams>;
+export type RepositoryProfileFormValues = Omit<
+  Required<CreateRepositoryProfileParams>,
+  "apt_sources"
+> & {
+  apt_sources: APTSource[];
+};
diff --git a/src/features/repository-profiles/types/RepositoryProfileSourceFormValues.d.ts b/src/features/repository-profiles/types/RepositoryProfileSourceFormValues.d.ts
new file mode 100644
index 000000000..c1b0bf373
--- /dev/null
+++ b/src/features/repository-profiles/types/RepositoryProfileSourceFormValues.d.ts
@@ -0,0 +1,5 @@
+export interface RepositoryProfileSourceFormValues {
+  name: string;
+  deb_line: string;
+  gpg_key_name: string;
+}
diff --git a/src/features/repository-profiles/types/index.ts b/src/features/repository-profiles/types/index.ts
index 073a667c3..555d7ca31 100644
--- a/src/features/repository-profiles/types/index.ts
+++ b/src/features/repository-profiles/types/index.ts
@@ -1,2 +1,3 @@
 export type { RepositoryProfileFormValues } from "./RepositoryProfileFormValues";
+export type { RepositoryProfileSourceFormValues } from "./RepositoryProfileSourceFormValues";
 export type { RepositoryProfile } from "./RepositoryProfile";
diff --git a/src/features/script-profiles/api/index.ts b/src/features/script-profiles/api/index.ts
index e6c1fc474..79a152a5d 100644
--- a/src/features/script-profiles/api/index.ts
+++ b/src/features/script-profiles/api/index.ts
@@ -5,3 +5,4 @@ export * from "./useGetScriptProfileActivities";
 export * from "./useGetScriptProfileLimits";
 export * from "./useGetScriptProfiles";
 export * from "./useGetScriptProfile";
+export * from "./useGetPageScriptProfile";
diff --git a/src/features/script-profiles/api/useGetPageScriptProfile.ts b/src/features/script-profiles/api/useGetPageScriptProfile.ts
index 624226506..3e07e4664 100644
--- a/src/features/script-profiles/api/useGetPageScriptProfile.ts
+++ b/src/features/script-profiles/api/useGetPageScriptProfile.ts
@@ -1,14 +1,17 @@
 import usePageParams from "@/hooks/usePageParams";
-import { useGetScriptProfile } from ".";
+import { useGetScriptProfile } from "./useGetScriptProfile";
 import type { ScriptProfile } from "../types";
 
-const useGetPageScriptProfile = ():
+export const useGetPageScriptProfile = ():
   | { scriptProfile: ScriptProfile; isGettingScriptProfile: false }
   | { scriptProfile: undefined; isGettingScriptProfile: true } => {
   const { name: scriptProfileId } = usePageParams();
 
   const { isGettingScriptProfile, scriptProfile, scriptProfileError } =
-    useGetScriptProfile({ id: parseInt(scriptProfileId) });
+    useGetScriptProfile(
+      { id: parseInt(scriptProfileId) },
+      { enabled: !!scriptProfileId },
+    );
 
   if (scriptProfileError) {
     throw scriptProfileError;
@@ -23,5 +26,3 @@ const useGetPageScriptProfile = ():
     isGettingScriptProfile: false,
   };
 };
-
-export default useGetPageScriptProfile;
diff --git a/src/features/script-profiles/api/useGetScriptProfileLimits.ts b/src/features/script-profiles/api/useGetScriptProfileLimits.ts
index b9dc06fe1..808b4e692 100644
--- a/src/features/script-profiles/api/useGetScriptProfileLimits.ts
+++ b/src/features/script-profiles/api/useGetScriptProfileLimits.ts
@@ -12,7 +12,7 @@ export interface GetScriptProfileLimitsResponse {
 export const useGetScriptProfileLimits = () => {
   const authFetch = useFetch();
 
-  const { data: response, isLoading } = useQuery<
+  const { data: response, isPending } = useQuery<
     AxiosResponse<GetScriptProfileLimitsResponse>,
     AxiosError<ApiError>
   >({
@@ -22,6 +22,6 @@ export const useGetScriptProfileLimits = () => {
 
   return {
     scriptProfileLimits: response?.data ?? null,
-    isGettingScriptProfileLimits: isLoading,
+    isGettingScriptProfileLimits: isPending,
   };
 };
diff --git a/src/features/script-profiles/components/ScriptProfileEditSidePanel/ScriptProfileEditSidePanel.tsx b/src/features/script-profiles/components/ScriptProfileEditSidePanel/ScriptProfileEditSidePanel.tsx
index ba171f3da..f7def81da 100644
--- a/src/features/script-profiles/components/ScriptProfileEditSidePanel/ScriptProfileEditSidePanel.tsx
+++ b/src/features/script-profiles/components/ScriptProfileEditSidePanel/ScriptProfileEditSidePanel.tsx
@@ -2,7 +2,7 @@ import SidePanel from "@/components/layout/SidePanel";
 import useNotify from "@/hooks/useNotify";
 import type { FC } from "react";
 import { useEditScriptProfile } from "../../api";
-import useGetPageScriptProfile from "../../api/useGetPageScriptProfile";
+import { useGetPageScriptProfile } from "../../api/useGetPageScriptProfile";
 import type { ScriptProfileFormSubmitValues } from "../ScriptProfileForm";
 import ScriptProfileForm from "../ScriptProfileForm";
 import { getScriptProfileEditFormInitialValues } from "./helpers";
diff --git a/src/features/script-profiles/components/ScriptProfilesTab/ScriptProfilesTab.test.tsx b/src/features/script-profiles/components/ScriptProfilesTab/ScriptProfilesTab.test.tsx
new file mode 100644
index 000000000..ef88ac084
--- /dev/null
+++ b/src/features/script-profiles/components/ScriptProfilesTab/ScriptProfilesTab.test.tsx
@@ -0,0 +1,59 @@
+import { scriptProfiles } from "@/tests/mocks/scriptProfiles";
+import { renderWithProviders } from "@/tests/render";
+import { screen, within } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import ScriptProfilesTab from "./ScriptProfilesTab";
+import { expectLoadingState } from "@/tests/helpers";
+import userEvent from "@testing-library/user-event";
+
+describe("ScriptProfilesTab", () => {
+  it("has a button to add a profile", async () => {
+    renderWithProviders(<ScriptProfilesTab />);
+
+    const user = userEvent.setup();
+
+    await user.click(
+      await screen.findByRole("button", { name: "Add profile" }),
+    );
+    await expectLoadingState();
+
+    expect(
+      await screen.findByRole("heading", { name: "Add script profile" }),
+    ).toBeInTheDocument();
+    await user.click(screen.getByLabelText("Close"));
+
+    expect(
+      screen.queryByRole("heading", { name: "Add script profile" }),
+    ).not.toBeInTheDocument();
+  });
+
+  it("renders a side panel to edit", async () => {
+    renderWithProviders(
+      <ScriptProfilesTab />,
+      undefined,
+      `/?sidePath=edit&profile=${scriptProfiles[0].id}`,
+    );
+
+    await expectLoadingState();
+    expect(
+      await within(screen.getByLabelText("Side panel")).findByRole("heading", {
+        name: `Edit ${scriptProfiles[0].title}`,
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it("renders a side panel to view", async () => {
+    renderWithProviders(
+      <ScriptProfilesTab />,
+      undefined,
+      `/?sidePath=view&profile=${scriptProfiles[0].id}`,
+    );
+
+    await expectLoadingState();
+    expect(
+      await within(screen.getByLabelText("Side panel")).findByRole("heading", {
+        name: scriptProfiles[0].title,
+      }),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/script-profiles/components/ScriptProfilesTab/ScriptProfilesTab.tsx b/src/features/script-profiles/components/ScriptProfilesTab/ScriptProfilesTab.tsx
index c533509d8..79c7983c5 100644
--- a/src/features/script-profiles/components/ScriptProfilesTab/ScriptProfilesTab.tsx
+++ b/src/features/script-profiles/components/ScriptProfilesTab/ScriptProfilesTab.tsx
@@ -1,8 +1,21 @@
+import { useGetScripts } from "@/features/scripts";
+import { lazy, useEffect, type FC } from "react";
+import {
+  useArchiveScriptProfile,
+  useGetPageScriptProfile,
+  useGetScriptProfileLimits,
+  useGetScriptProfiles,
+} from "../../api";
+import NoScriptsEmptyState from "../NoScriptsEmptyState";
+import {
+  ProfilesContainer,
+  ProfileTypes,
+  ViewProfileSidePanel,
+} from "@/features/profiles";
+import useProfiles from "@/hooks/useProfiles";
 import SidePanel from "@/components/layout/SidePanel";
 import useSetDynamicFilterValidation from "@/hooks/useDynamicFilterValidation";
 import usePageParams from "@/hooks/usePageParams";
-import { lazy, type FC } from "react";
-import ScriptProfilesPanel from "../ScriptProfilesPanel";
 
 const ScriptProfileAddSidePanel = lazy(
   () => import("../ScriptProfileAddSidePanel"),
@@ -12,23 +25,97 @@ const ScriptProfileEditSidePanel = lazy(
   () => import("../ScriptProfileEditSidePanel"),
 );
 
-const ScriptProfileDetailsSidePanel = lazy(
-  () => import("../ScriptProfileDetailsSidePanel"),
-);
-
 const ScriptProfilesTab: FC = () => {
   const { sidePath, lastSidePathSegment, createPageParamsSetter } =
     usePageParams();
 
-  const close = createPageParamsSetter({ sidePath: [], name: "" });
+  const {
+    scriptsCount: activeScriptsCount,
+    isScriptsLoading: isGettingActiveScripts,
+  } = useGetScripts(
+    { listenToUrlParams: false },
+    {
+      script_type: "active",
+      limit: 0,
+      offset: 0,
+    },
+  );
+
+  const { scriptProfiles, scriptProfilesCount, isGettingScriptProfiles } =
+    useGetScriptProfiles();
+
+  const {
+    scriptProfilesCount: activeScriptProfilesCount,
+    isGettingScriptProfiles: isGettingActiveScriptProfiles,
+  } = useGetScriptProfiles(
+    { listenToUrlParams: false },
+    { archived: "active" },
+  );
+
+  const { scriptProfileLimits, isGettingScriptProfileLimits } =
+    useGetScriptProfileLimits();
+
+  const {
+    setIsProfileLimitReached,
+    setProfileLimit,
+    setRemoveProfile,
+    setIsRemovingProfile,
+  } = useProfiles();
+
+  const { scriptProfile } = useGetPageScriptProfile();
+
+  const { archiveScriptProfile, isArchivingScriptProfile } =
+    useArchiveScriptProfile();
+
+  useEffect(() => {
+    setRemoveProfile(({ id }) => archiveScriptProfile({ id }));
+    setIsRemovingProfile(isArchivingScriptProfile);
+  }, [
+    setRemoveProfile,
+    setIsRemovingProfile,
+    archiveScriptProfile,
+    isArchivingScriptProfile,
+  ]);
 
   useSetDynamicFilterValidation("sidePath", ["add", "edit", "view"]);
 
+  const isScriptProfileLimitReached =
+    !!scriptProfileLimits &&
+    !!activeScriptProfilesCount &&
+    activeScriptProfilesCount >= scriptProfileLimits.max_num_profiles;
+
+  useEffect(() => {
+    setIsProfileLimitReached(isScriptProfileLimitReached);
+    setProfileLimit(scriptProfileLimits?.max_num_profiles ?? 0);
+  }, [
+    setIsProfileLimitReached,
+    isScriptProfileLimitReached,
+    scriptProfileLimits?.max_num_profiles,
+    setProfileLimit,
+  ]);
+
+  if (!isGettingActiveScripts && !activeScriptsCount) {
+    return <NoScriptsEmptyState />;
+  }
+
   return (
     <>
-      <ScriptProfilesPanel />
+      <ProfilesContainer
+        type={ProfileTypes.script}
+        profiles={scriptProfiles}
+        profilesCount={scriptProfilesCount}
+        isPending={
+          isGettingActiveScripts ||
+          isGettingScriptProfiles ||
+          isGettingActiveScriptProfiles ||
+          isGettingScriptProfileLimits
+        }
+      />
 
-      <SidePanel onClose={close} isOpen={!!sidePath.length}>
+      <SidePanel
+        onClose={createPageParamsSetter({ sidePath: [], profile: "" })}
+        isOpen={!!sidePath.length}
+      >
         {lastSidePathSegment === "add" && (
           <SidePanel.Suspense key="add">
             <ScriptProfileAddSidePanel />
@@ -43,7 +130,10 @@ const ScriptProfilesTab: FC = () => {
 
         {lastSidePathSegment === "view" && (
           <SidePanel.Suspense key="view">
-            <ScriptProfileDetailsSidePanel />
+            <ViewProfileSidePanel
+              type={ProfileTypes.script}
+              profile={scriptProfile}
+            />
           </SidePanel.Suspense>
         )}
       </SidePanel>
diff --git a/src/features/script-profiles/components/ViewScriptProfileDetailsBlock/ViewScriptProfileDetailsBlock.test.tsx b/src/features/script-profiles/components/ViewScriptProfileDetailsBlock/ViewScriptProfileDetailsBlock.test.tsx
new file mode 100644
index 000000000..fb7d8fdf7
--- /dev/null
+++ b/src/features/script-profiles/components/ViewScriptProfileDetailsBlock/ViewScriptProfileDetailsBlock.test.tsx
@@ -0,0 +1,33 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import ViewScriptProfileDetailsBlock from "./ViewScriptProfileDetailsBlock";
+import { scriptProfiles } from "@/tests/mocks/scriptProfiles";
+import { detailedScriptsData } from "@/tests/mocks/script";
+
+const [profile] = scriptProfiles;
+
+describe("ViewScriptProfileDetailsBlock", () => {
+  it("renders spinner for script while script details are unavailable", () => {
+    renderWithProviders(
+      <ViewScriptProfileDetailsBlock
+        profile={{ ...profile, script_id: 999_999 }}
+      />,
+    );
+
+    expect(screen.getByRole("status")).toBeInTheDocument();
+
+    expect(screen.getByText("Run as User")).toBeInTheDocument();
+    expect(screen.getByText("root")).toBeInTheDocument();
+    expect(screen.getByText("Time limit")).toBeInTheDocument();
+    expect(screen.getByText("300s")).toBeInTheDocument();
+  });
+
+  it("renders script link when script is resolved", async () => {
+    renderWithProviders(<ViewScriptProfileDetailsBlock profile={profile} />);
+
+    expect(
+      await screen.findByRole("link", { name: detailedScriptsData[0].title }),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/script-profiles/components/ViewScriptProfileDetailsBlock/ViewScriptProfileDetailsBlock.tsx b/src/features/script-profiles/components/ViewScriptProfileDetailsBlock/ViewScriptProfileDetailsBlock.tsx
new file mode 100644
index 000000000..a0c318d19
--- /dev/null
+++ b/src/features/script-profiles/components/ViewScriptProfileDetailsBlock/ViewScriptProfileDetailsBlock.tsx
@@ -0,0 +1,43 @@
+import InfoGrid from "@/components/layout/InfoGrid";
+import type { FC } from "react";
+import type { ScriptProfile } from "../../types";
+import { Link } from "react-router";
+import { ROUTES } from "@/libs/routes";
+import { useGetSingleScript } from "@/features/scripts";
+import LoadingState from "@/components/layout/LoadingState";
+
+interface ViewScriptProfileDetailsBlockProps {
+  readonly profile: ScriptProfile;
+}
+
+const ViewScriptProfileDetailsBlock: FC<ViewScriptProfileDetailsBlockProps> = ({
+  profile,
+}) => {
+  const { script } = useGetSingleScript(profile.script_id);
+
+  return (
+    <>
+      <InfoGrid.Item
+        label="Script"
+        value={
+          script ? (
+            <Link
+              to={ROUTES.scripts.root({ tab: "scripts" })}
+              state={{ scriptId: script.id }}
+            >
+              {script.title}
+            </Link>
+          ) : (
+            <LoadingState inline />
+          )
+        }
+      />
+
+      <InfoGrid.Item label="Run as User" value={profile.username} />
+
+      <InfoGrid.Item label="Time limit" value={`${profile.time_limit}s`} />
+    </>
+  );
+};
+
+export default ViewScriptProfileDetailsBlock;
diff --git a/src/features/script-profiles/components/ViewScriptProfileDetailsBlock/index.ts b/src/features/script-profiles/components/ViewScriptProfileDetailsBlock/index.ts
new file mode 100644
index 000000000..2d30d3daf
--- /dev/null
+++ b/src/features/script-profiles/components/ViewScriptProfileDetailsBlock/index.ts
@@ -0,0 +1 @@
+export { default } from "./ViewScriptProfileDetailsBlock";
diff --git a/src/features/script-profiles/index.ts b/src/features/script-profiles/index.ts
index e4b364ace..1653fb417 100644
--- a/src/features/script-profiles/index.ts
+++ b/src/features/script-profiles/index.ts
@@ -1,2 +1,4 @@
-export { default as ScriptProfilesPanel } from "./components/ScriptProfilesPanel";
+export { default as ViewScriptProfileDetailsBlock } from "./components/ViewScriptProfileDetailsBlock";
+export { default as ScriptProfileActivityHistory } from "./components/ScriptProfileActivityHistory";
+export { useArchiveScriptProfile, useGetPageScriptProfile } from "./api";
 export type { ScriptProfile } from "./types";
diff --git a/src/features/script-profiles/types/ScriptProfile.ts b/src/features/script-profiles/types/ScriptProfile.ts
index eccc348ef..3bfafa24d 100644
--- a/src/features/script-profiles/types/ScriptProfile.ts
+++ b/src/features/script-profiles/types/ScriptProfile.ts
@@ -1,4 +1,5 @@
 import type { Activity } from "@/features/activities";
+import type { Profile } from "@/features/profiles";
 
 export type Trigger =
   | {
@@ -19,22 +20,17 @@ export type Trigger =
       start_after: string;
     };
 
-export interface ScriptProfile extends Record<string, unknown> {
-  access_group: string;
+export interface ScriptProfile extends Profile {
   activities: {
     last_activity: Activity | null;
   };
-  all_computers: boolean;
   archived: boolean;
   computers: { num_associated_computers: number };
   created_at: string;
   created_by: { name: string; id: number } | null;
-  id: number;
   last_edited_at: string;
   script_id: number;
-  tags: string[];
   time_limit: number;
-  title: string;
   trigger: Trigger;
   username: string;
 }
diff --git a/src/features/security-profiles/api/index.ts b/src/features/security-profiles/api/index.ts
index 3cc09d58a..bd5b671d1 100644
--- a/src/features/security-profiles/api/index.ts
+++ b/src/features/security-profiles/api/index.ts
@@ -2,6 +2,7 @@ export * from "./useAddSecurityProfile";
 export * from "./useArchiveSecurityProfile";
 export * from "./useGetOverLimitSecurityProfiles";
 export * from "./useGetSecurityProfile";
+export * from "./useGetPageSecurityProfile";
 export * from "./useGetSecurityProfileAuditDownload";
 export * from "./useGetSecurityProfileReport";
 export * from "./useGetSecurityProfiles";
diff --git a/src/features/security-profiles/api/useGetPageSecurityProfile.tsx b/src/features/security-profiles/api/useGetPageSecurityProfile.tsx
index 97f9b4a44..e74b1910f 100644
--- a/src/features/security-profiles/api/useGetPageSecurityProfile.tsx
+++ b/src/features/security-profiles/api/useGetPageSecurityProfile.tsx
@@ -1,8 +1,8 @@
 import usePageParams from "@/hooks/usePageParams";
-import { useGetSecurityProfile } from ".";
+import { useGetSecurityProfile } from "./useGetSecurityProfile";
 import type { SecurityProfile } from "../types";
 
-const useGetPageSecurityProfile = ():
+export const useGetPageSecurityProfile = ():
   | {
       securityProfile: SecurityProfile;
       isGettingSecurityProfile: false;
@@ -14,7 +14,9 @@ const useGetPageSecurityProfile = ():
   const { name: securityProfileId } = usePageParams();
 
   const { isGettingSecurityProfile, securityProfile, securityProfileError } =
-    useGetSecurityProfile(parseInt(securityProfileId));
+    useGetSecurityProfile(parseInt(securityProfileId), {
+      enabled: !!securityProfileId,
+    });
 
   if (securityProfileError) {
     throw securityProfileError;
@@ -32,5 +34,3 @@ const useGetPageSecurityProfile = ():
     isGettingSecurityProfile: false,
   };
 };
-
-export default useGetPageSecurityProfile;
diff --git a/src/features/security-profiles/api/useIsSecurityProfilesLimitReached.ts b/src/features/security-profiles/api/useIsSecurityProfilesLimitReached.ts
index ae60a6061..b14954f9a 100644
--- a/src/features/security-profiles/api/useIsSecurityProfilesLimitReached.ts
+++ b/src/features/security-profiles/api/useIsSecurityProfilesLimitReached.ts
@@ -4,7 +4,7 @@ import type { ApiPaginatedResponse } from "@/types/api/ApiPaginatedResponse";
 import { useQuery } from "@tanstack/react-query";
 import type { AxiosError, AxiosResponse } from "axios";
 import type { SecurityProfile } from "../types";
-import { ACTIVE_SECURITY_PROFILES_LIMIT } from "@/features/security-profiles";
+import { ACTIVE_SECURITY_PROFILES_LIMIT } from "../constants";
 
 export const useIsSecurityProfilesLimitReached = () => {
   const authFetch = useFetch();
diff --git a/src/features/security-profiles/components/SecurityProfileAddSidePanel/SecurityProfileAddSidePanel.tsx b/src/features/security-profiles/components/SecurityProfileAddSidePanel/SecurityProfileAddSidePanel.tsx
index 06eea376b..807dd0070 100644
--- a/src/features/security-profiles/components/SecurityProfileAddSidePanel/SecurityProfileAddSidePanel.tsx
+++ b/src/features/security-profiles/components/SecurityProfileAddSidePanel/SecurityProfileAddSidePanel.tsx
@@ -10,16 +10,15 @@ import { useState } from "react";
 import { useAddSecurityProfile } from "../../api";
 import { notifyCreation } from "../../helpers";
 import useSecurityProfileForm from "../../hooks/useSecurityProfileForm";
-import type { SecurityProfileFormValues } from "../../types/SecurityProfileAddFormValues";
 import classes from "./SecurityProfileAddSidePanel.module.scss";
 import type { StepIndex } from "./types";
 
 interface SecurityProfileAddSidePanelProps {
-  readonly onSuccess: (values: SecurityProfileFormValues) => void;
+  readonly showRetentionNotification: () => void;
 }
 
 const SecurityProfileAddSidePanel: FC<SecurityProfileAddSidePanelProps> = ({
-  onSuccess,
+  showRetentionNotification,
 }) => {
   const { notify } = useNotify();
   const { createPageParamsSetter } = usePageParams();
@@ -68,7 +67,7 @@ const SecurityProfileAddSidePanel: FC<SecurityProfileAddSidePanelProps> = ({
     },
     onSuccess: (values) => {
       notifyCreation(values, notify);
-      onSuccess(values);
+      showRetentionNotification();
     },
   });
 
diff --git a/src/features/security-profiles/components/SecurityProfileAuditPassRate/SecurityProfileAuditPassRate.module.scss b/src/features/security-profiles/components/SecurityProfileAuditPassRate/SecurityProfileAuditPassRate.module.scss
new file mode 100644
index 000000000..c0178d3df
--- /dev/null
+++ b/src/features/security-profiles/components/SecurityProfileAuditPassRate/SecurityProfileAuditPassRate.module.scss
@@ -0,0 +1,68 @@
+@import "vanilla-framework/scss/settings_colors";
+@import "vanilla-framework/scss/settings_spacing";
+
+.textContainer {
+  align-items: center;
+  display: flex;
+  justify-content: space-between;
+  margin-bottom: $spv--small;
+  width: 85%;
+}
+
+.lineContainer {
+  background-color: $colors--theme--background-alt;
+  border: 1px solid $colors--theme--border-default;
+  border-radius: 5px;
+  display: flex;
+  margin-bottom: $spv--small;
+  overflow: hidden;
+  width: 85%;
+}
+
+.linePassed,
+.lineFailed,
+.lineInProgress,
+.lineNotRun {
+  display: inline-block;
+  height: $spv--small;
+}
+
+.linePassed {
+  background-color: $color-positive;
+}
+
+.lineFailed {
+  background-color: $color-negative;
+  border-left: 1px solid $colors--theme--border-default;
+}
+
+.lineInProgress {
+  background-color: rgb(0 0 0 / 60%);
+  border-left: 1px solid $colors--theme--border-default;
+}
+
+.lineNotRun {
+  background-color: $colors--theme--border-default;
+}
+
+.lineContainer *:last-child {
+  border-bottom-right-radius: 5px;
+  border-top-right-radius: 5px;
+}
+
+.lineContainer *:not(:last-child) {
+  border-bottom-right-radius: 0;
+  border-top-right-radius: 0;
+}
+
+.tooltip {
+  display: flex !important;
+}
+
+.lineFailed + .lineInProgress {
+  border-left: 1px solid $colors--theme--border-default;
+}
+
+.linePassed + .lineInProgress {
+  border-left: 1px solid $colors--theme--border-default;
+}
diff --git a/src/features/security-profiles/components/SecurityProfileAuditPassRate/SecurityProfileAuditPassRate.test.tsx b/src/features/security-profiles/components/SecurityProfileAuditPassRate/SecurityProfileAuditPassRate.test.tsx
new file mode 100644
index 000000000..2f983515e
--- /dev/null
+++ b/src/features/security-profiles/components/SecurityProfileAuditPassRate/SecurityProfileAuditPassRate.test.tsx
@@ -0,0 +1,50 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen, within } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import SecurityProfileAuditPassRate from "./SecurityProfileAuditPassRate";
+import { securityProfiles } from "@/tests/mocks/securityProfiles";
+import { NO_DATA_TEXT } from "@/components/layout/NoData";
+import userEvent from "@testing-library/user-event";
+
+const [profile, profileWithRun] = securityProfiles;
+describe("SecurityProfileAuditPassRate", () => {
+  it("shows no data when there are no results", () => {
+    renderWithProviders(<SecurityProfileAuditPassRate profile={profile} />);
+
+    expect(screen.getByText(NO_DATA_TEXT)).toBeInTheDocument();
+  });
+
+  it("renders pass/fail counts and links when counts are non-zero", async () => {
+    renderWithProviders(
+      <SecurityProfileAuditPassRate profile={profileWithRun} />,
+    );
+
+    const results = profileWithRun.last_run_results;
+
+    expect(
+      screen.getByRole("link", { name: `${results.passing} passed` }),
+    ).toHaveAttribute(
+      "href",
+      expect.stringContaining(`security-profile%3A${profileWithRun.id}%3Apass`),
+    );
+    expect(screen.getByText(`${results.failing} failed`)).not.toHaveRole(
+      "link",
+    );
+
+    await userEvent.hover(screen.getByTestId("passrate-line"));
+    const tooltip = await screen.findByRole("tooltip");
+
+    expect(within(tooltip).getByText(/Passed:/)).toBeInTheDocument();
+    expect(within(tooltip).getByText(/Failed:/)).toBeInTheDocument();
+    expect(within(tooltip).getByText(/In progress:/)).toBeInTheDocument();
+    expect(within(tooltip).getByText(/Not run:/)).toBeInTheDocument();
+
+    expect(
+      within(tooltip).getByText(`${results.passing} instances (20%)`),
+    ).toBeInTheDocument();
+    expect(
+      within(tooltip).getByText(`${results.in_progress} instances (80%)`),
+    ).toBeInTheDocument();
+    expect(within(tooltip).getAllByText(`0 instances (0%)`)).toHaveLength(2);
+  });
+});
diff --git a/src/features/security-profiles/components/SecurityProfileAuditPassRate/SecurityProfileAuditPassRate.tsx b/src/features/security-profiles/components/SecurityProfileAuditPassRate/SecurityProfileAuditPassRate.tsx
new file mode 100644
index 000000000..8d3a0a93f
--- /dev/null
+++ b/src/features/security-profiles/components/SecurityProfileAuditPassRate/SecurityProfileAuditPassRate.tsx
@@ -0,0 +1,127 @@
+import NoData from "@/components/layout/NoData";
+import { ROUTES } from "@/libs/routes";
+import { Tooltip } from "@canonical/react-components";
+import type { FC } from "react";
+import { Link } from "react-router";
+import classes from "./SecurityProfileAuditPassRate.module.scss";
+import type { SecurityProfile } from "../../types";
+
+interface SecurityProfileAuditPassRateProps {
+  readonly profile: SecurityProfile;
+}
+
+const SecurityProfileAuditPassRate: FC<SecurityProfileAuditPassRateProps> = ({
+  profile,
+}) => {
+  const { passing, failing, in_progress, not_started } =
+    profile.last_run_results;
+  const total = passing + failing + in_progress + not_started;
+
+  if (!total) {
+    return <NoData />;
+  }
+
+  const passingPercent = ((passing / total) * 100).toFixed(0);
+  const failingPercent = ((failing / total) * 100).toFixed(0);
+  const inProgressPercent = ((in_progress / total) * 100).toFixed(0);
+  const notRunPercent = ((not_started / total) * 100).toFixed(0);
+
+  const totalPercent =
+    parseInt(passingPercent) +
+    parseInt(failingPercent) +
+    parseInt(inProgressPercent) +
+    parseInt(notRunPercent);
+  const difference = 100 - totalPercent;
+
+  const adjustedPassingPercent = (
+    parseInt(passingPercent) + difference
+  ).toString();
+
+  const tooltipMessage = (
+    <>
+      <div>
+        <div>
+          <strong>Passed:</strong>{" "}
+          {`${passing} instances (${adjustedPassingPercent}%)`}
+        </div>
+        <div>
+          <strong>Failed:</strong> {`${failing} instances (${failingPercent}%)`}
+        </div>
+        <div>
+          <strong>In progress:</strong>{" "}
+          {`${in_progress} instances (${inProgressPercent}%)`}
+        </div>
+        <div>
+          <strong>Not run:</strong>{" "}
+          {`${not_started} instances (${notRunPercent}%)`}
+        </div>
+      </div>
+    </>
+  );
+
+  return (
+    <div>
+      <div className={classes.textContainer}>
+        <div>
+          {passing > 0 ? (
+            <Link
+              to={ROUTES.instances.root({
+                query: `security-profile:${profile.id}:pass`,
+              })}
+            >
+              <span>{passing} passed</span>
+            </Link>
+          ) : (
+            <span>{passing} passed</span>
+          )}
+        </div>
+        {failing > 0 ? (
+          <Link
+            to={ROUTES.instances.root({
+              query: `security-profile:${profile.id}:fail`,
+            })}
+          >
+            <span>{failing} failed</span>
+          </Link>
+        ) : (
+          <span>{failing} failed</span>
+        )}
+      </div>
+
+      <Tooltip
+        position="btm-center"
+        positionElementClassName={classes.tooltip}
+        message={tooltipMessage}
+      >
+        <div className={classes.lineContainer} data-testid="passrate-line">
+          {passing > 0 && (
+            <div
+              className={classes.linePassed}
+              style={{ width: `${(passing / total) * 100}%` }}
+            />
+          )}
+          {failing > 0 && (
+            <div
+              className={classes.lineFailed}
+              style={{ width: `${(failing / total) * 100}%` }}
+            />
+          )}
+          {in_progress > 0 && (
+            <div
+              className={classes.lineInProgress}
+              style={{ width: `${(in_progress / total) * 100}%` }}
+            />
+          )}
+          {not_started > 0 && (
+            <div
+              className={classes.lineNotRun}
+              style={{ width: `${(not_started / total) * 100}%` }}
+            />
+          )}
+        </div>
+      </Tooltip>
+    </div>
+  );
+};
+
+export default SecurityProfileAuditPassRate;
diff --git a/src/features/security-profiles/components/SecurityProfileAuditPassRate/index.ts b/src/features/security-profiles/components/SecurityProfileAuditPassRate/index.ts
new file mode 100644
index 000000000..38af7b1e4
--- /dev/null
+++ b/src/features/security-profiles/components/SecurityProfileAuditPassRate/index.ts
@@ -0,0 +1 @@
+export { default } from "./SecurityProfileAuditPassRate";
diff --git a/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/SecurityProfileDownloadAuditSidePanel.tsx b/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/SecurityProfileDownloadAuditSidePanel.tsx
index 3de583d25..fb5283599 100644
--- a/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/SecurityProfileDownloadAuditSidePanel.tsx
+++ b/src/features/security-profiles/components/SecurityProfileDownloadAuditSidePanel/SecurityProfileDownloadAuditSidePanel.tsx
@@ -1,6 +1,6 @@
 import SidePanel from "@/components/layout/SidePanel";
 import type { FC } from "react";
-import useGetPageSecurityProfile from "../../api/useGetPageSecurityProfile";
+import { useGetPageSecurityProfile } from "../../api/useGetPageSecurityProfile";
 import SecurityProfileDownloadAuditForm from "./components/SecurityProfileDownloadAuditForm";
 
 const SecurityProfileDownloadAuditSidePanel: FC = () => {
diff --git a/src/features/security-profiles/components/SecurityProfileDuplicateSidePanel/SecurityProfileDuplicateSidePanel.tsx b/src/features/security-profiles/components/SecurityProfileDuplicateSidePanel/SecurityProfileDuplicateSidePanel.tsx
index e0f9931f3..b11998428 100644
--- a/src/features/security-profiles/components/SecurityProfileDuplicateSidePanel/SecurityProfileDuplicateSidePanel.tsx
+++ b/src/features/security-profiles/components/SecurityProfileDuplicateSidePanel/SecurityProfileDuplicateSidePanel.tsx
@@ -3,7 +3,7 @@ import useNotify from "@/hooks/useNotify";
 import usePageParams from "@/hooks/usePageParams";
 import type { FC } from "react";
 import { useAddSecurityProfile } from "../../api";
-import useGetPageSecurityProfile from "../../api/useGetPageSecurityProfile";
+import { useGetPageSecurityProfile } from "../../api/useGetPageSecurityProfile";
 import { getInitialValues, notifyCreation } from "../../helpers";
 import SecurityProfileForm from "../SecurityProfileForm";
 
diff --git a/src/features/security-profiles/components/SecurityProfileEditSidePanel/SecurityProfileEditSidePanel.tsx b/src/features/security-profiles/components/SecurityProfileEditSidePanel/SecurityProfileEditSidePanel.tsx
index ec2d7f9b7..2204314e0 100644
--- a/src/features/security-profiles/components/SecurityProfileEditSidePanel/SecurityProfileEditSidePanel.tsx
+++ b/src/features/security-profiles/components/SecurityProfileEditSidePanel/SecurityProfileEditSidePanel.tsx
@@ -3,7 +3,7 @@ import useNotify from "@/hooks/useNotify";
 import usePageParams from "@/hooks/usePageParams";
 import type { FC } from "react";
 import { useUpdateSecurityProfile } from "../../api";
-import useGetPageSecurityProfile from "../../api/useGetPageSecurityProfile";
+import { useGetPageSecurityProfile } from "../../api/useGetPageSecurityProfile";
 import { getInitialValues } from "../../helpers";
 import SecurityProfileForm from "../SecurityProfileForm";
 
diff --git a/src/features/security-profiles/components/SecurityProfileLastRunWithSchedule/SecurityProfileLastRunWithSchedule.module.scss b/src/features/security-profiles/components/SecurityProfileLastRunWithSchedule/SecurityProfileLastRunWithSchedule.module.scss
new file mode 100644
index 000000000..18ff0b6a2
--- /dev/null
+++ b/src/features/security-profiles/components/SecurityProfileLastRunWithSchedule/SecurityProfileLastRunWithSchedule.module.scss
@@ -0,0 +1,20 @@
+@import "vanilla-framework/scss/settings_colors";
+@import "vanilla-framework/scss/settings_spacing";
+
+.tooltip {
+  display: flex !important;
+}
+
+.truncated {
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
+.ellipsis {
+  color: $colors--theme--text-muted;
+  display: inline-block;
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
diff --git a/src/features/security-profiles/components/SecurityProfileLastRunWithSchedule/SecurityProfileLastRunWithSchedule.tsx b/src/features/security-profiles/components/SecurityProfileLastRunWithSchedule/SecurityProfileLastRunWithSchedule.tsx
new file mode 100644
index 000000000..145ad2b32
--- /dev/null
+++ b/src/features/security-profiles/components/SecurityProfileLastRunWithSchedule/SecurityProfileLastRunWithSchedule.tsx
@@ -0,0 +1,68 @@
+import NoData from "@/components/layout/NoData";
+import { Tooltip } from "@canonical/react-components";
+import type { FC } from "react";
+import type { SecurityProfile } from "../../types";
+import classes from "./SecurityProfileLastRunWithSchedule.module.scss";
+import moment from "moment";
+import { DISPLAY_DATE_TIME_FORMAT } from "@/constants";
+import { getSecuritySchedule } from "../../helpers";
+
+interface SecurityProfileLastRunWithScheduleProps {
+  readonly profile: SecurityProfile;
+}
+
+const SecurityProfileLastRunWithSchedule: FC<
+  SecurityProfileLastRunWithScheduleProps
+> = ({ profile }) => {
+  const lastRun = !profile.last_run_results.timestamp ? (
+    <NoData />
+  ) : (
+    moment(profile.last_run_results.timestamp)
+      .utc()
+      .format(DISPLAY_DATE_TIME_FORMAT)
+  );
+  const nextRun = !profile.next_run_time ? (
+    <NoData />
+  ) : (
+    moment(profile.next_run_time).utc().format(DISPLAY_DATE_TIME_FORMAT)
+  );
+
+  const tooltipMessage = (
+    <>
+      <div>
+        <strong>Last run:</strong> {lastRun}
+        {!profile.last_run_results.timestamp ? "" : " UTC"}
+      </div>
+      <div>
+        <strong>Next run:</strong> {nextRun}
+        {!profile.next_run_time ? "" : " UTC"}
+      </div>
+      <div>
+        <strong>Schedule:</strong> {getSecuritySchedule(profile)}
+      </div>
+    </>
+  );
+
+  return (
+    <Tooltip
+      position="top-center"
+      positionElementClassName={classes.tooltip}
+      message={tooltipMessage}
+    >
+      <div className={classes.truncated}>
+        <span aria-label={`Last run for ${profile.title} profile`}>
+          {lastRun}
+        </span>
+        <br />
+        <span
+          className={classes.ellipsis}
+          aria-label={`Schedule for ${profile.title} profile`}
+        >
+          {getSecuritySchedule(profile, true)}
+        </span>
+      </div>
+    </Tooltip>
+  );
+};
+
+export default SecurityProfileLastRunWithSchedule;
diff --git a/src/features/security-profiles/components/SecurityProfileLastRunWithSchedule/index.ts b/src/features/security-profiles/components/SecurityProfileLastRunWithSchedule/index.ts
new file mode 100644
index 000000000..ed2f5422c
--- /dev/null
+++ b/src/features/security-profiles/components/SecurityProfileLastRunWithSchedule/index.ts
@@ -0,0 +1 @@
+export { default } from "./SecurityProfileLastRunWithSchedule";
diff --git a/src/features/security-profiles/components/SecurityProfileRunFixSidePanel/SecurityProfileRunFixSidePanel.tsx b/src/features/security-profiles/components/SecurityProfileRunFixSidePanel/SecurityProfileRunFixSidePanel.tsx
index 60c2fa2f4..62ec22c09 100644
--- a/src/features/security-profiles/components/SecurityProfileRunFixSidePanel/SecurityProfileRunFixSidePanel.tsx
+++ b/src/features/security-profiles/components/SecurityProfileRunFixSidePanel/SecurityProfileRunFixSidePanel.tsx
@@ -10,7 +10,7 @@ import { Form } from "@canonical/react-components";
 import type { FC, SyntheticEvent } from "react";
 import { useNavigate } from "react-router";
 import { useRunSecurityProfile } from "../../api";
-import useGetPageSecurityProfile from "../../api/useGetPageSecurityProfile";
+import { useGetPageSecurityProfile } from "../../api/useGetPageSecurityProfile";
 import { getNotificationMessage } from "../../helpers";
 import { ROUTES } from "@/libs/routes";
 
diff --git a/src/features/security-profiles/components/SecurityProfilesContainer/SecurityProfilesContainer.test.tsx b/src/features/security-profiles/components/SecurityProfilesContainer/SecurityProfilesContainer.test.tsx
index 8d51ff299..41f4eb1a6 100644
--- a/src/features/security-profiles/components/SecurityProfilesContainer/SecurityProfilesContainer.test.tsx
+++ b/src/features/security-profiles/components/SecurityProfilesContainer/SecurityProfilesContainer.test.tsx
@@ -6,7 +6,7 @@ import SecurityProfilesContainer from "./SecurityProfilesContainer";
 
 describe("SecurityProfilesContainer", () => {
   it("should filter security profiles that match the search text", async () => {
-    const searchText = securityProfiles[0].title.charAt(0);
+    const searchText = securityProfiles[0].name.charAt(0);
 
     renderWithProviders(
       <SecurityProfilesContainer hideRetentionNotification={() => undefined} />,
@@ -16,14 +16,20 @@ describe("SecurityProfilesContainer", () => {
 
     await expectLoadingState();
 
-    for (const profile of securityProfiles) {
-      const button = screen.queryByRole("button", { name: profile.title });
+    for (const profile of securityProfiles.filter(({ title }) =>
+      title.startsWith(searchText),
+    )) {
+      expect(
+        screen.getByRole("button", { name: profile.title }),
+      ).toBeInTheDocument();
+    }
 
-      if (profile.title.startsWith(searchText)) {
-        expect(button).toBeInTheDocument();
-      } else {
-        expect(button).not.toBeInTheDocument();
-      }
+    for (const profile of securityProfiles.filter(
+      ({ title }) => !title.startsWith(searchText),
+    )) {
+      expect(
+        screen.queryByRole("button", { name: profile.title }),
+      ).not.toBeInTheDocument();
     }
   });
 });
diff --git a/src/features/security-profiles/components/SecurityProfilesList/SecurityProfilesList.test.tsx b/src/features/security-profiles/components/SecurityProfilesList/SecurityProfilesList.test.tsx
deleted file mode 100644
index 26caa3830..000000000
--- a/src/features/security-profiles/components/SecurityProfilesList/SecurityProfilesList.test.tsx
+++ /dev/null
@@ -1,32 +0,0 @@
-import { securityProfiles } from "@/tests/mocks/securityProfiles";
-import { renderWithProviders } from "@/tests/render";
-import { screen } from "@testing-library/react";
-import type { ComponentProps } from "react";
-import SecurityProfilesList from "./SecurityProfilesList";
-
-const props: ComponentProps<typeof SecurityProfilesList> = {
-  securityProfiles: securityProfiles,
-};
-
-describe("SecurityProfilesList", () => {
-  it("should render security profiles list", () => {
-    renderWithProviders(<SecurityProfilesList {...props} />);
-
-    expect(screen.getByText("Name")).toBeInTheDocument();
-    expect(screen.getByText("Status")).toBeInTheDocument();
-    expect(screen.getByText("Last audit's pass rate")).toBeInTheDocument();
-    expect(screen.getByText("Associated instances")).toBeInTheDocument();
-    expect(screen.getByText("Tags")).toBeInTheDocument();
-    expect(screen.getByText("Mode")).toBeInTheDocument();
-    expect(screen.getByText("Last run")).toBeInTheDocument();
-    expect(screen.getByText("Schedule")).toBeInTheDocument();
-    expect(screen.getByText("Actions")).toBeInTheDocument();
-
-    for (const profile of securityProfiles) {
-      expect(screen.getByText(profile.title)).toBeInTheDocument();
-      expect(
-        screen.getByLabelText(`${profile.title} profile actions`),
-      ).toBeInTheDocument();
-    }
-  });
-});
diff --git a/src/features/security-profiles/components/SecurityProfilesList/SecurityProfilesList.tsx b/src/features/security-profiles/components/SecurityProfilesList/SecurityProfilesList.tsx
index 896d6d077..073a5785c 100644
--- a/src/features/security-profiles/components/SecurityProfilesList/SecurityProfilesList.tsx
+++ b/src/features/security-profiles/components/SecurityProfilesList/SecurityProfilesList.tsx
@@ -15,7 +15,7 @@ import { useMemo } from "react";
 import { Link } from "react-router";
 import type { CellProps, Column } from "react-table";
 import { SECURITY_PROFILE_MODE_LABELS } from "../../constants";
-import { getSchedule, getStatus, getTags } from "../../helpers";
+import { getSecuritySchedule, getStatus, getTags } from "../../helpers";
 import type { SecurityProfile } from "../../types";
 import SecurityProfileListActions from "../SecurityProfileListActions";
 import classes from "./SecurityProfilesList.module.scss";
@@ -272,7 +272,7 @@ const SecurityProfilesList: FC<SecurityProfilesListProps> = ({
                 {!nextRun ? " GMT" : ""}
               </div>
               <div>
-                <strong>Schedule:</strong> {getSchedule(row.original)}
+                <strong>Schedule:</strong> {getSecuritySchedule(row.original)}
               </div>
             </>
           );
@@ -295,7 +295,7 @@ const SecurityProfilesList: FC<SecurityProfilesListProps> = ({
                   className={classes.ellipsis}
                   aria-label={`Schedule for ${row.original.title} profile`}
                 >
-                  {getSchedule(row.original)}
+                  {getSecuritySchedule(row.original)}
                 </span>
               </div>
             </Tooltip>
diff --git a/src/features/security-profiles/components/SecurityProfilesNotifications/SecurityProfilesNotifications.test.tsx b/src/features/security-profiles/components/SecurityProfilesNotifications/SecurityProfilesNotifications.test.tsx
new file mode 100644
index 000000000..e60e9dca8
--- /dev/null
+++ b/src/features/security-profiles/components/SecurityProfilesNotifications/SecurityProfilesNotifications.test.tsx
@@ -0,0 +1,157 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it, vi } from "vitest";
+import SecurityProfilesNotifications from "./SecurityProfilesNotifications";
+import { useGetOverLimitSecurityProfiles } from "../../api";
+import { useGetActivities } from "@/features/activities";
+import { securityProfiles } from "@/tests/mocks/securityProfiles";
+import type * as actualModule from "react-router";
+
+vi.mock("../../api", () => ({
+  useGetOverLimitSecurityProfiles: vi.fn(),
+}));
+
+vi.mock("@/features/activities", () => ({
+  useGetActivities: vi.fn(),
+}));
+
+const downloadAudit = vi.fn();
+vi.mock("../../hooks/useSecurityProfileDownloadAudit", () => ({
+  useSecurityProfileDownloadAudit: () => downloadAudit,
+}));
+
+const pathname = "current/path/";
+const navigate = vi.fn();
+
+vi.mock("react-router", async () => {
+  const actual = await vi.importActual<typeof actualModule>("react-router");
+
+  return {
+    ...actual,
+    useLocation: () => ({ pathname }),
+    useNavigate: () => navigate,
+  };
+});
+
+const openProfileSidePanel = vi.fn();
+vi.mock("@/features/profiles", () => ({
+  useOpenProfileSidePanel: () => openProfileSidePanel,
+}));
+
+const mockUseGetOverLimitSecurityProfiles = vi.mocked(
+  useGetOverLimitSecurityProfiles,
+);
+const mockUseGetActivities = vi.mocked(useGetActivities);
+
+const [profileA, profileB] = securityProfiles;
+
+describe("SecurityProfilesNotifications", () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it("renders retention notification when visible", () => {
+    mockUseGetOverLimitSecurityProfiles.mockReturnValue({
+      overLimitSecurityProfiles: [],
+    } as unknown as ReturnType<typeof useGetOverLimitSecurityProfiles>);
+    mockUseGetActivities.mockReturnValue({
+      activities: [],
+    } as unknown as ReturnType<typeof useGetActivities>);
+
+    renderWithProviders(
+      <SecurityProfilesNotifications
+        isRetentionNotificationVisible
+        hideRetentionNotification={vi.fn()}
+      />,
+    );
+
+    expect(screen.getByText("Audit retention policy:")).toBeInTheDocument();
+  });
+
+  it("renders single-profile notifications", async () => {
+    mockUseGetOverLimitSecurityProfiles.mockReturnValue({
+      overLimitSecurityProfiles: [profileA],
+    } as unknown as ReturnType<typeof useGetOverLimitSecurityProfiles>);
+    mockUseGetActivities.mockReturnValue({
+      activities: [{ result_text: "result" }],
+    } as unknown as ReturnType<typeof useGetActivities>);
+
+    renderWithProviders(
+      <SecurityProfilesNotifications
+        isRetentionNotificationVisible={false}
+        hideRetentionNotification={vi.fn()}
+      />,
+    );
+
+    expect(
+      screen.queryByText("Audit retention policy:"),
+    ).not.toBeInTheDocument();
+
+    expect(
+      screen.getByRole("heading", {
+        name: "Your audit is ready for download:",
+      }),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByText(/Your audit has been successfully generated/),
+    ).toBeInTheDocument();
+    await userEvent.click(
+      screen.getByRole("button", { name: "Download audit" }),
+    );
+    expect(downloadAudit).toHaveBeenCalledWith("result");
+
+    expect(
+      screen.getByRole("heading", {
+        name: "Profile exceeded associated instance limit:",
+      }),
+    ).toBeInTheDocument();
+    expect(screen.getByText(profileA.title)).toBeInTheDocument();
+    await userEvent.click(screen.getByRole("button", { name: "Edit profile" }));
+    expect(openProfileSidePanel).toHaveBeenCalledWith(profileA, "edit");
+  });
+
+  it("renders multi-profile notifications", async () => {
+    mockUseGetOverLimitSecurityProfiles.mockReturnValue({
+      overLimitSecurityProfiles: [profileA, profileB],
+    } as unknown as ReturnType<typeof useGetOverLimitSecurityProfiles>);
+    mockUseGetActivities.mockReturnValue({
+      activities: [{ result_text: "result-a" }, { result_text: "result-b" }],
+    } as unknown as ReturnType<typeof useGetActivities>);
+
+    renderWithProviders(
+      <SecurityProfilesNotifications
+        isRetentionNotificationVisible={false}
+        hideRetentionNotification={vi.fn()}
+      />,
+    );
+
+    expect(
+      screen.getByRole("heading", {
+        name: "Your audits are ready for download:",
+      }),
+    ).toBeInTheDocument();
+    expect(screen.getByText(/Several of your audits/)).toBeInTheDocument();
+    await userEvent.click(
+      screen.getByRole("button", { name: "Download audits" }),
+    );
+    expect(downloadAudit).toHaveBeenCalledTimes(2);
+
+    expect(
+      screen.getByRole("heading", {
+        name: "Profiles exceeded associated instance limit:",
+      }),
+    ).toBeInTheDocument();
+
+    expect(
+      screen.getByText(/Some of your security profiles/),
+    ).toBeInTheDocument();
+    await userEvent.click(
+      screen.getByRole("button", { name: "View profiles" }),
+    );
+    expect(navigate).toHaveBeenCalledWith({
+      pathname,
+      search: "?status=over-limit",
+    });
+  });
+});
diff --git a/src/features/security-profiles/components/SecurityProfilesNotifications/SecurityProfilesNotifications.tsx b/src/features/security-profiles/components/SecurityProfilesNotifications/SecurityProfilesNotifications.tsx
new file mode 100644
index 000000000..ac7713e99
--- /dev/null
+++ b/src/features/security-profiles/components/SecurityProfilesNotifications/SecurityProfilesNotifications.tsx
@@ -0,0 +1,188 @@
+import IgnorableNotifcation from "@/components/layout/IgnorableNotification";
+import { useGetActivities } from "@/features/activities";
+import { SECURITY_PROFILE_ASSOCIATED_INSTANCES_LIMIT } from "../../constants";
+import { hasOneItem } from "@/utils/_helpers";
+import { Button, Notification } from "@canonical/react-components";
+import type { FC } from "react";
+import { useState } from "react";
+import { useLocation, useNavigate } from "react-router";
+import { useGetOverLimitSecurityProfiles } from "../../api";
+import { useSecurityProfileDownloadAudit } from "../../hooks/useSecurityProfileDownloadAudit";
+import { useOpenProfileSidePanel } from "@/features/profiles";
+
+interface SecurityProfilesNotificationsProps {
+  readonly isRetentionNotificationVisible: boolean;
+  readonly hideRetentionNotification: () => void;
+}
+
+const SecurityProfilesNotifications: FC<SecurityProfilesNotificationsProps> = ({
+  isRetentionNotificationVisible,
+  hideRetentionNotification,
+}) => {
+  const location = useLocation();
+  const navigate = useNavigate();
+  const openProfileSidePanel = useOpenProfileSidePanel();
+
+  const { overLimitSecurityProfiles } = useGetOverLimitSecurityProfiles({
+    limit: 20,
+    offset: 0,
+  });
+
+  const [pendingReports, setPendingReports] = useState<
+    { activityId: number; profileId: number }[]
+  >(
+    JSON.parse(
+      localStorage.getItem("_landscape_pendingSecurityProfileReports") ?? "[]",
+    ),
+  );
+
+  const { activities } = useGetActivities(
+    {
+      query: `status:succeeded ${pendingReports
+        .map((report) => `id:${report.activityId}`)
+        .join(" OR ")}`,
+    },
+    { listenToUrlParams: false },
+    { enabled: !!pendingReports.length },
+  );
+
+  const downloadAudit = useSecurityProfileDownloadAudit();
+
+  return (
+    <>
+      {isRetentionNotificationVisible && (
+        <IgnorableNotifcation
+          inline
+          title="Audit retention policy:"
+          storageKey="_landscape_isAuditModalIgnored"
+          hide={hideRetentionNotification}
+          modalProps={{
+            title: "Dismiss audit retention acknowledgment",
+            confirmButtonAppearance: "positive",
+            confirmButtonLabel: "Dismiss",
+            checkboxProps: {
+              label:
+                "I understand and acknowledge this policy. Don't show this message again.",
+            },
+          }}
+        >
+          <>
+            Any audit older than the specified retention period for a given
+            profile will be automatically removed. We recommend downloading and
+            storing audit data externally before it expires. You can view the
+            exact retention period for each profile in its details.
+          </>
+        </IgnorableNotifcation>
+      )}
+
+      {overLimitSecurityProfiles.length > 1 && (
+        <Notification
+          severity="negative"
+          inline
+          title="Profiles exceeded associated instance limit:"
+        >
+          Some of your security profiles are assigned to more than{" "}
+          <strong>
+            {SECURITY_PROFILE_ASSOCIATED_INSTANCES_LIMIT.toLocaleString()}{" "}
+            instances
+          </strong>
+          . Only the first{" "}
+          {SECURITY_PROFILE_ASSOCIATED_INSTANCES_LIMIT.toLocaleString()} will be
+          audited. Edit the profiles or duplicate them to cover the rest.{" "}
+          <Button
+            type="button"
+            appearance="link"
+            onClick={() => {
+              navigate({
+                pathname: location.pathname,
+                search: "?status=over-limit",
+              });
+            }}
+          >
+            View profiles
+          </Button>
+        </Notification>
+      )}
+
+      {hasOneItem(overLimitSecurityProfiles) && (
+        <Notification
+          severity="negative"
+          inline
+          title="Profile exceeded associated instance limit:"
+        >
+          Your security profile{" "}
+          <strong>{overLimitSecurityProfiles[0].title}</strong> is assigned to
+          more than{" "}
+          <strong>
+            {SECURITY_PROFILE_ASSOCIATED_INSTANCES_LIMIT.toLocaleString()}{" "}
+            instances
+          </strong>
+          . Only the first{" "}
+          {SECURITY_PROFILE_ASSOCIATED_INSTANCES_LIMIT.toLocaleString()} will be
+          covered. Edit the profile or duplicate it to cover the rest.{" "}
+          <Button
+            type="button"
+            appearance="link"
+            onClick={() => {
+              openProfileSidePanel(overLimitSecurityProfiles[0], "edit");
+            }}
+          >
+            Edit profile
+          </Button>
+        </Notification>
+      )}
+
+      {activities.length > 1 && (
+        <Notification
+          inline
+          title="Your audits are ready for download:"
+          onDismiss={() => {
+            localStorage.removeItem("_landscape_pendingSecurityProfileReports");
+            setPendingReports([]);
+          }}
+        >
+          Several of your audits have been successfully generated and are now
+          ready for download.{" "}
+          <Button
+            appearance="link"
+            type="button"
+            className="u-no-margin--bottom u-no-padding--top"
+            onClick={() => {
+              for (const activity of activities) {
+                downloadAudit(activity.result_text);
+              }
+            }}
+          >
+            Download audits
+          </Button>
+        </Notification>
+      )}
+
+      {hasOneItem(activities) && (
+        <Notification
+          inline
+          title="Your audit is ready for download:"
+          onDismiss={() => {
+            localStorage.removeItem("_landscape_pendingSecurityProfileReports");
+            setPendingReports([]);
+          }}
+        >
+          Your audit has been successfully generated and is now ready for
+          download.{" "}
+          <Button
+            appearance="link"
+            type="button"
+            className="u-no-margin--bottom u-no-padding--top"
+            onClick={() => {
+              downloadAudit(activities[0].result_text);
+            }}
+          >
+            Download audit
+          </Button>
+        </Notification>
+      )}
+    </>
+  );
+};
+
+export default SecurityProfilesNotifications;
diff --git a/src/features/security-profiles/components/SecurityProfilesNotifications/index.ts b/src/features/security-profiles/components/SecurityProfilesNotifications/index.ts
new file mode 100644
index 000000000..4e9cd9f67
--- /dev/null
+++ b/src/features/security-profiles/components/SecurityProfilesNotifications/index.ts
@@ -0,0 +1 @@
+export { default } from "./SecurityProfilesNotifications";
diff --git a/src/features/security-profiles/components/ViewSecurityProfileDetailsBlock/ViewSecurityProfileDetailsBlock.test.tsx b/src/features/security-profiles/components/ViewSecurityProfileDetailsBlock/ViewSecurityProfileDetailsBlock.test.tsx
new file mode 100644
index 000000000..a0b9aa0d9
--- /dev/null
+++ b/src/features/security-profiles/components/ViewSecurityProfileDetailsBlock/ViewSecurityProfileDetailsBlock.test.tsx
@@ -0,0 +1,56 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import ViewSecurityProfileDetailsBlock from "./ViewSecurityProfileDetailsBlock";
+import { securityProfiles } from "@/tests/mocks/securityProfiles";
+import { NO_DATA_TEXT } from "@/components/layout/NoData";
+
+describe("ViewSecurityProfileDetailsBlock", () => {
+  it.each([
+    ["disa_stig", "audit", null, "DISA-STIG", "Audit only", NO_DATA_TEXT],
+    [
+      "cis_level1_workstation",
+      "audit-fix",
+      "root/",
+      "CIS Level 1 Workstation",
+      "Fix and audit",
+      "tailoring-file.xml",
+    ],
+    [
+      "cis_level2_server",
+      "audit-fix-restart",
+      "root/file",
+      "CIS Level 2 Server",
+      "Fix, restart, audit",
+      "file",
+    ],
+  ] as const)(
+    "renders benchmark, tailoring and mode labels",
+    (
+      benchmark,
+      mode,
+      tailoringFile,
+      expectedBenchmark,
+      expectedMode,
+      expectedTailoringFile,
+    ) => {
+      renderWithProviders(
+        <ViewSecurityProfileDetailsBlock
+          profile={{
+            ...securityProfiles[0],
+            benchmark,
+            mode,
+            tailoring_file_uri: tailoringFile,
+          }}
+        />,
+      );
+
+      expect(screen.getByText("Benchmark")).toBeInTheDocument();
+      expect(screen.getByText(expectedBenchmark)).toBeInTheDocument();
+      expect(screen.getByText("Tailoring file")).toBeInTheDocument();
+      expect(screen.getByText(expectedTailoringFile)).toBeInTheDocument();
+      expect(screen.getByText("Mode")).toBeInTheDocument();
+      expect(screen.getByText(expectedMode)).toBeInTheDocument();
+    },
+  );
+});
diff --git a/src/features/security-profiles/components/ViewSecurityProfileDetailsBlock/ViewSecurityProfileDetailsBlock.tsx b/src/features/security-profiles/components/ViewSecurityProfileDetailsBlock/ViewSecurityProfileDetailsBlock.tsx
new file mode 100644
index 000000000..3b9de431d
--- /dev/null
+++ b/src/features/security-profiles/components/ViewSecurityProfileDetailsBlock/ViewSecurityProfileDetailsBlock.tsx
@@ -0,0 +1,35 @@
+import InfoGrid from "@/components/layout/InfoGrid";
+import type { FC } from "react";
+import type { SecurityProfile } from "../../types";
+import {
+  SECURITY_PROFILE_BENCHMARK_LABELS,
+  SECURITY_PROFILE_MODE_LABELS,
+} from "../../constants";
+import { getTailoringFile } from "../../helpers";
+
+interface ViewSecurityProfileDetailsBlockProps {
+  readonly profile: SecurityProfile;
+}
+
+const ViewSecurityProfileDetailsBlock: FC<
+  ViewSecurityProfileDetailsBlockProps
+> = ({ profile }) => {
+  return (
+    <>
+      <InfoGrid.Item
+        label="Benchmark"
+        value={SECURITY_PROFILE_BENCHMARK_LABELS[profile.benchmark]}
+      />
+
+      <InfoGrid.Item label="Tailoring file" value={getTailoringFile(profile)} />
+
+      <InfoGrid.Item
+        label="Mode"
+        large
+        value={SECURITY_PROFILE_MODE_LABELS[profile.mode]}
+      />
+    </>
+  );
+};
+
+export default ViewSecurityProfileDetailsBlock;
diff --git a/src/features/security-profiles/components/ViewSecurityProfileDetailsBlock/index.ts b/src/features/security-profiles/components/ViewSecurityProfileDetailsBlock/index.ts
new file mode 100644
index 000000000..7fbbf0b1a
--- /dev/null
+++ b/src/features/security-profiles/components/ViewSecurityProfileDetailsBlock/index.ts
@@ -0,0 +1 @@
+export { default } from "./ViewSecurityProfileDetailsBlock";
diff --git a/src/features/security-profiles/helpers.tsx b/src/features/security-profiles/helpers.tsx
index 45b8667cd..406cd7ce6 100644
--- a/src/features/security-profiles/helpers.tsx
+++ b/src/features/security-profiles/helpers.tsx
@@ -73,7 +73,10 @@ export const getTailoringFile = (
   );
 };
 
-export const getSchedule = (profile: SecurityProfile) => {
+export const getSecuritySchedule = (
+  profile: SecurityProfile,
+  short = false,
+) => {
   const schedule = Object.fromEntries(
     profile.schedule.split(";").map((part) => part.split("=")),
   );
@@ -84,6 +87,10 @@ export const getSchedule = (profile: SecurityProfile) => {
     return "On a date";
   }
 
+  if (short) {
+    return "Recurring";
+  }
+
   let scheduleText = "Recurring, every ";
 
   if (schedule.INTERVAL > 1) {
@@ -157,7 +164,7 @@ export const getSchedule = (profile: SecurityProfile) => {
   }
 
   if (schedule.UNTIL) {
-    scheduleText += ` until ${moment(schedule.UNTIL).format(DISPLAY_DATE_TIME_FORMAT)}`;
+    scheduleText += ` until ${moment(schedule.UNTIL).utc().format(DISPLAY_DATE_TIME_FORMAT)} UTC`;
   }
 
   return scheduleText;
diff --git a/src/features/security-profiles/hooks/useSecurityProfileDownloadAudit.tsx b/src/features/security-profiles/hooks/useSecurityProfileDownloadAudit.tsx
new file mode 100644
index 000000000..445d0fa47
--- /dev/null
+++ b/src/features/security-profiles/hooks/useSecurityProfileDownloadAudit.tsx
@@ -0,0 +1,34 @@
+import { useGetSecurityProfileAuditDownload } from "../api/useGetSecurityProfileAuditDownload";
+
+export const useSecurityProfileDownloadAudit = () => {
+  const { getSecurityProfileAuditDownload } =
+    useGetSecurityProfileAuditDownload();
+
+  return async (path: string | null) => {
+    if (!path) {
+      throw new Error();
+    }
+
+    const { data } = await getSecurityProfileAuditDownload({
+      path,
+    });
+
+    const blob = new Blob([data], {
+      type: "text/csv;charset=utf-8;",
+    });
+
+    const url = URL.createObjectURL(blob);
+
+    const link = document.createElement("a");
+
+    link.href = url;
+
+    link.download = path.slice(path.lastIndexOf("/") + 1);
+
+    document.body.appendChild(link);
+
+    link.click();
+
+    document.body.removeChild(link);
+  };
+};
diff --git a/src/features/security-profiles/index.ts b/src/features/security-profiles/index.ts
index f13d1d8a7..216b95ff5 100644
--- a/src/features/security-profiles/index.ts
+++ b/src/features/security-profiles/index.ts
@@ -2,21 +2,24 @@ export {
   useGetOverLimitSecurityProfiles,
   useGetSecurityProfiles,
   useIsSecurityProfilesLimitReached,
-  useUpdateSecurityProfile,
+  useArchiveSecurityProfile,
+  useRunSecurityProfile,
+  useGetPageSecurityProfile,
 } from "./api";
 export type { AddSecurityProfileParams } from "./api";
 export { default as SecurityProfileAddSidePanel } from "./components/SecurityProfileAddSidePanel";
-export { default as SecurityProfileDetailsSidePanel } from "./components/SecurityProfileDetailsSidePanel";
 export { default as SecurityProfileDownloadAuditSidePanel } from "./components/SecurityProfileDownloadAuditSidePanel";
 export { default as SecurityProfileDuplicateSidePanel } from "./components/SecurityProfileDuplicateSidePanel";
 export { default as SecurityProfileEditSidePanel } from "./components/SecurityProfileEditSidePanel";
-export { default as SecurityProfileForm } from "./components/SecurityProfileForm";
 export { default as SecurityProfileRunFixSidePanel } from "./components/SecurityProfileRunFixSidePanel";
-export { default as SecurityProfilesContainer } from "./components/SecurityProfilesContainer";
-export { default as SecurityProfilesHeader } from "./components/SecurityProfilesHeader";
-export { default as SecurityProfilesList } from "./components/SecurityProfilesList";
+export { default as SecurityProfilesNotifications } from "./components/SecurityProfilesNotifications";
+export { default as SecurityProfileAuditPassRate } from "./components/SecurityProfileAuditPassRate";
+export { default as SecurityProfileLastRunWithSchedule } from "./components/SecurityProfileLastRunWithSchedule";
+export { default as ViewSecurityProfileDetailsBlock } from "./components/ViewSecurityProfileDetailsBlock";
 export {
   ACTIVE_SECURITY_PROFILES_LIMIT,
   SECURITY_PROFILE_ASSOCIATED_INSTANCES_LIMIT,
+  SECURITY_PROFILE_MODE_LABELS,
 } from "./constants";
-export type { SecurityProfile } from "./types";
+export { getSecuritySchedule } from "./helpers";
+export type { SecurityProfile, SecurityProfileMode } from "./types";
diff --git a/src/features/security-profiles/types/SecurityProfile.ts b/src/features/security-profiles/types/SecurityProfile.ts
index 2298d1769..61da5d08f 100644
--- a/src/features/security-profiles/types/SecurityProfile.ts
+++ b/src/features/security-profiles/types/SecurityProfile.ts
@@ -1,34 +1,38 @@
-export interface SecurityProfile extends Record<string, unknown> {
-  access_group: string;
+import type { Profile } from "@/features/profiles";
+
+export type SecurityBenchmark =
+  | "disa_stig"
+  | "cis_level1_workstation"
+  | "cis_level1_server"
+  | "cis_level2_workstation"
+  | "cis_level2_server";
+
+export type SecurityProfileStatus = "active" | "archived" | "over-limit";
+
+export type SecurityProfileMode = "audit" | "audit-fix" | "audit-fix-restart";
+
+export interface LastRunResults {
+  passing: number;
+  failing: number;
+  in_progress: number;
+  not_started: number;
+  pass_rate: number;
+  report_uri: string | null;
+  timestamp: string | null;
+}
+
+export interface SecurityProfile extends Profile {
   account_id: number;
-  all_computers: boolean;
-  benchmark:
-    | "disa_stig"
-    | "cis_level1_workstation"
-    | "cis_level1_server"
-    | "cis_level2_workstation"
-    | "cis_level2_server";
+  benchmark: SecurityBenchmark;
   creation_time: string;
-  id: number;
-  last_run_results: {
-    passing: number;
-    failing: number;
-    in_progress: number;
-    not_started: number;
-    pass_rate: number;
-    report_uri: string | null;
-    timestamp: string | null;
-  };
-  mode: "audit" | "audit-fix" | "audit-fix-restart";
+  last_run_results: LastRunResults;
+  mode: SecurityProfileMode;
   modification_time: string;
-  name: string;
   next_run_time: string | null;
   retention_period: number;
   schedule: string;
-  status: "active" | "archived" | "over-limit";
-  tags: string[];
+  status: SecurityProfileStatus;
   tailoring_file_uri: string | null;
-  title: string;
   associated_instances: number;
   restart_deliver_delay_window: number;
   restart_deliver_delay: number;
diff --git a/src/features/wsl-profiles/api/index.ts b/src/features/wsl-profiles/api/index.ts
index f99484748..515f2b4b0 100644
--- a/src/features/wsl-profiles/api/index.ts
+++ b/src/features/wsl-profiles/api/index.ts
@@ -1,7 +1,8 @@
 export * from "./useAddWslProfile";
-export * from "./useDeleteWslProfile";
+export * from "./useRemoveWslProfile";
 export * from "./useEditWslProfile";
 export * from "./useGetWslProfile";
+export * from "./useGetPageWslProfile";
 export * from "./useGetWslProfiles";
 export * from "./useMakeWindowsInstancesCompliant";
 export * from "./useReapplyWslProfile";
diff --git a/src/features/wsl-profiles/api/useGetPageWslProfile.ts b/src/features/wsl-profiles/api/useGetPageWslProfile.ts
index 20dd1521f..03931c237 100644
--- a/src/features/wsl-profiles/api/useGetPageWslProfile.ts
+++ b/src/features/wsl-profiles/api/useGetPageWslProfile.ts
@@ -2,7 +2,7 @@ import usePageParams from "@/hooks/usePageParams";
 import type { WslProfile } from "../types";
 import { useGetWslProfile } from "./useGetWslProfile";
 
-const useGetPageWslProfile = ():
+export const useGetPageWslProfile = ():
   | {
       wslProfile: WslProfile;
       isGettingWslProfile: false;
@@ -15,6 +15,7 @@ const useGetPageWslProfile = ():
 
   const { wslProfile, isGettingWslProfile, wslProfileError } = useGetWslProfile(
     { profile_name: wslProfileName },
+    { enabled: !!wslProfileName },
   );
 
   if (wslProfileError) {
@@ -33,5 +34,3 @@ const useGetPageWslProfile = ():
     isGettingWslProfile: false,
   };
 };
-
-export default useGetPageWslProfile;
diff --git a/src/features/wsl-profiles/api/useRemoveWslProfile.ts b/src/features/wsl-profiles/api/useRemoveWslProfile.ts
new file mode 100644
index 000000000..ecf497b5d
--- /dev/null
+++ b/src/features/wsl-profiles/api/useRemoveWslProfile.ts
@@ -0,0 +1,30 @@
+import type { Activity } from "@/features/activities";
+import useFetch from "@/hooks/useFetch";
+import type { ApiError } from "@/types/api/ApiError";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+
+interface RemoveWslProfileParams {
+  name: string;
+}
+
+export const useRemoveWslProfile = () => {
+  const authFetch = useFetch();
+  const queryClient = useQueryClient();
+
+  const { isPending, mutateAsync } = useMutation<
+    AxiosResponse<Activity>,
+    AxiosError<ApiError>,
+    RemoveWslProfileParams
+  >({
+    mutationFn: async ({ name }) =>
+      authFetch.delete(`child-instance-profiles/${name}`),
+    onSuccess: async () =>
+      queryClient.invalidateQueries({ queryKey: ["wslProfiles"] }),
+  });
+
+  return {
+    removeWslProfile: mutateAsync,
+    isRemovingWslProfile: isPending,
+  };
+};
diff --git a/src/features/wsl-profiles/components/ViewWslProfileDetailsBlock/ViewWslProfileDetailsBlock.test.tsx b/src/features/wsl-profiles/components/ViewWslProfileDetailsBlock/ViewWslProfileDetailsBlock.test.tsx
new file mode 100644
index 000000000..4b22e58f2
--- /dev/null
+++ b/src/features/wsl-profiles/components/ViewWslProfileDetailsBlock/ViewWslProfileDetailsBlock.test.tsx
@@ -0,0 +1,49 @@
+import { wslProfiles } from "@/tests/mocks/wsl-profiles";
+import { render, screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import ViewWslProfileDetailsBlock from "./ViewWslProfileDetailsBlock";
+import { NO_DATA_TEXT } from "@/components/layout/NoData";
+
+describe("ViewWslProfileDetailsBlock", () => {
+  it("shows image source for custom image profiles", () => {
+    const cloudInit = "#cloud-config";
+    const profile = {
+      ...wslProfiles[1],
+      cloud_init_contents: cloudInit,
+    };
+
+    render(<ViewWslProfileDetailsBlock profile={profile} />);
+
+    expect(screen.getByText("Rootfs image")).toBeInTheDocument();
+    expect(screen.getByText("From URL")).toBeInTheDocument();
+    expect(screen.getByText("Image name")).toBeInTheDocument();
+    expect(screen.getByText(profile.image_name)).toBeInTheDocument();
+    expect(screen.getByText("Image source")).toBeInTheDocument();
+    expect(screen.getByText(profile.image_source)).toBeInTheDocument();
+    expect(screen.getByText("Cloud init")).toBeInTheDocument();
+    expect(screen.getByText(/#cloud-config/)).toBeInTheDocument();
+    expect(screen.getByText("Compliance settings")).toBeInTheDocument();
+    expect(
+      screen.getByText(
+        "Uninstall WSL child instances that have not been created by Landscape",
+      ),
+    ).toBeInTheDocument();
+  });
+
+  it("hides image source for store image profiles", () => {
+    const profile = {
+      ...wslProfiles[0],
+    };
+
+    render(<ViewWslProfileDetailsBlock profile={profile} />);
+
+    expect(screen.queryByText("Image source")).not.toBeInTheDocument();
+    expect(screen.getByText("Cloud init")).toBeInTheDocument();
+    expect(screen.getByText(NO_DATA_TEXT)).toBeInTheDocument();
+    expect(
+      screen.getByText(
+        "Ignore WSL child instances that have not been created by Landscape",
+      ),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/wsl-profiles/components/ViewWslProfileDetailsBlock/ViewWslProfileDetailsBlock.tsx b/src/features/wsl-profiles/components/ViewWslProfileDetailsBlock/ViewWslProfileDetailsBlock.tsx
new file mode 100644
index 000000000..07fe6d647
--- /dev/null
+++ b/src/features/wsl-profiles/components/ViewWslProfileDetailsBlock/ViewWslProfileDetailsBlock.tsx
@@ -0,0 +1,42 @@
+import InfoGrid from "@/components/layout/InfoGrid";
+import type { FC } from "react";
+import type { WslProfile } from "../../types";
+
+interface ViewWslProfileDetailsBlockProps {
+  readonly profile: WslProfile;
+}
+
+const ViewWslProfileDetailsBlock: FC<ViewWslProfileDetailsBlockProps> = ({
+  profile,
+}) => {
+  return (
+    <>
+      <InfoGrid.Item label="Rootfs image" value="From URL" />
+      <InfoGrid.Item label="Image name" value={profile.image_name} />
+      {profile.image_source !== null && (
+        <InfoGrid.Item
+          label="Image source"
+          large
+          value={profile.image_source}
+          type="truncated"
+        />
+      )}
+      <InfoGrid.Item
+        label="Cloud init"
+        large
+        value={profile.cloud_init_contents}
+      />
+      <InfoGrid.Item
+        label="Compliance settings"
+        large
+        value={
+          profile.only_landscape_created
+            ? "Uninstall WSL child instances that have not been created by Landscape"
+            : "Ignore WSL child instances that have not been created by Landscape"
+        }
+      />
+    </>
+  );
+};
+
+export default ViewWslProfileDetailsBlock;
diff --git a/src/features/wsl-profiles/components/ViewWslProfileDetailsBlock/index.ts b/src/features/wsl-profiles/components/ViewWslProfileDetailsBlock/index.ts
new file mode 100644
index 000000000..d626d0334
--- /dev/null
+++ b/src/features/wsl-profiles/components/ViewWslProfileDetailsBlock/index.ts
@@ -0,0 +1 @@
+export { default } from "./ViewWslProfileDetailsBlock";
diff --git a/src/features/wsl-profiles/components/WslProfileEditSidePanel/WslProfileEditSidePanel.tsx b/src/features/wsl-profiles/components/WslProfileEditSidePanel/WslProfileEditSidePanel.tsx
index a601fe539..102a3ca45 100644
--- a/src/features/wsl-profiles/components/WslProfileEditSidePanel/WslProfileEditSidePanel.tsx
+++ b/src/features/wsl-profiles/components/WslProfileEditSidePanel/WslProfileEditSidePanel.tsx
@@ -1,6 +1,6 @@
 import SidePanel from "@/components/layout/SidePanel";
 import type { FC } from "react";
-import useGetPageWslProfile from "../../api/useGetPageWslProfile";
+import { useGetPageWslProfile } from "../../api/useGetPageWslProfile";
 import WslProfileEditForm from "./components/WslProfileEditForm";
 
 const WslProfileEditSidePanel: FC = () => {
@@ -12,9 +12,7 @@ const WslProfileEditSidePanel: FC = () => {
 
   return (
     <>
-      <SidePanel.Header>
-        Edit &quot;{wslProfile.title}&quot; profile
-      </SidePanel.Header>
+      <SidePanel.Header>Edit {wslProfile.title}</SidePanel.Header>
       <SidePanel.Content>
         <WslProfileEditForm profile={wslProfile} />
       </SidePanel.Content>
diff --git a/src/features/wsl-profiles/components/WslProfileEditSidePanel/components/WslProfileEditForm/WslProfileEditForm.tsx b/src/features/wsl-profiles/components/WslProfileEditSidePanel/components/WslProfileEditForm/WslProfileEditForm.tsx
index a6e26067e..30e06f4b9 100644
--- a/src/features/wsl-profiles/components/WslProfileEditSidePanel/components/WslProfileEditForm/WslProfileEditForm.tsx
+++ b/src/features/wsl-profiles/components/WslProfileEditSidePanel/components/WslProfileEditForm/WslProfileEditForm.tsx
@@ -84,7 +84,7 @@ const WslProfileEditForm: FC<WslProfileEditFormProps> = ({ profile }) => {
   const formik = useFormik({
     initialValues: {
       title: profile.title,
-      description: profile.description,
+      description: profile.description ?? "",
       instanceType: profile.image_source ? "custom" : profile.image_name,
       customImageName: profile.image_source ? profile.image_name : "",
       rootfsImage: profile.image_source || "",
diff --git a/src/features/wsl-profiles/components/WslProfileEditSidePanel/components/WslProfileEditForm/helpers.ts b/src/features/wsl-profiles/components/WslProfileEditSidePanel/components/WslProfileEditForm/helpers.ts
index 981227d51..ecfd352a5 100644
--- a/src/features/wsl-profiles/components/WslProfileEditSidePanel/components/WslProfileEditForm/helpers.ts
+++ b/src/features/wsl-profiles/components/WslProfileEditSidePanel/components/WslProfileEditForm/helpers.ts
@@ -4,7 +4,6 @@ export const getValidationSchema = () => {
   return Yup.object().shape({
     title: Yup.string().required("This field is required"),
     description: Yup.string().required("This field is required"),
-    access_group: Yup.string().required("This field is required"),
     all_computers: Yup.boolean(),
     tags: Yup.array().of(Yup.string()),
   });
diff --git a/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/WslProfileNonCompliantInstancesList.module.scss b/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/WslProfileNonCompliantInstancesList.module.scss
new file mode 100644
index 000000000..ab053280d
--- /dev/null
+++ b/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/WslProfileNonCompliantInstancesList.module.scss
@@ -0,0 +1,13 @@
+@import "vanilla-framework/scss/settings_spacing";
+
+.header {
+  column-gap: $sph--x-large;
+  display: flex;
+  justify-content: space-between;
+  margin-bottom: $spv--x-large;
+}
+
+.search {
+  flex-basis: 30rem;
+  min-width: 300px;
+}
diff --git a/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/WslProfileNonCompliantInstancesList.tsx b/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/WslProfileNonCompliantInstancesList.tsx
new file mode 100644
index 000000000..e92444101
--- /dev/null
+++ b/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/WslProfileNonCompliantInstancesList.tsx
@@ -0,0 +1,233 @@
+import { SidePanelTableFilterChips } from "@/components/filter";
+import { LIST_ACTIONS_COLUMN_PROPS } from "@/components/layout/ListActions";
+import LoadingState from "@/components/layout/LoadingState";
+import NoData from "@/components/layout/NoData";
+import ResponsiveTable from "@/components/layout/ResponsiveTable";
+import StaticLink from "@/components/layout/StaticLink";
+import TruncatedCell from "@/components/layout/TruncatedCell";
+import { DISPLAY_DATE_TIME_FORMAT } from "@/constants";
+import { useGetInstances } from "@/features/instances";
+import { WindowsInstanceMakeCompliantModal } from "@/features/wsl";
+import { useExpandableRow } from "@/hooks/useExpandableRow";
+import useSelection from "@/hooks/useSelection";
+import {
+  DEFAULT_CURRENT_PAGE,
+  DEFAULT_PAGE_SIZE,
+} from "@/libs/pageParamsManager/constants";
+import { ROUTES } from "@/libs/routes";
+import type { WindowsInstance } from "@/types/Instance";
+import {
+  Button,
+  CheckboxInput,
+  Icon,
+  SearchBox,
+} from "@canonical/react-components";
+import classNames from "classnames";
+import moment from "moment";
+import { useMemo, useState, type FC } from "react";
+import type { CellProps, Column } from "react-table";
+import { useBoolean } from "usehooks-ts";
+import type { WslProfile } from "../../types";
+import classes from "./WslProfileNonCompliantInstancesList.module.scss";
+import WindowsInstanceActions from "./components/WindowsInstanceActions";
+import { getCellProps, getRowProps } from "./helpers";
+
+interface WslProfileNonCompliantInstancesListProps {
+  readonly wslProfile: WslProfile;
+}
+
+const WslProfileNonCompliantInstancesList: FC<
+  WslProfileNonCompliantInstancesListProps
+> = ({ wslProfile }) => {
+  const { expandedRowIndex, getTableRowsRef, handleExpand } =
+    useExpandableRow();
+  const [inputValue, setInputValue] = useState("");
+  const [currentPage] = useState(DEFAULT_CURRENT_PAGE);
+  const [pageSize] = useState(DEFAULT_PAGE_SIZE);
+  const [search, setSearch] = useState("");
+
+  const { instances, isGettingInstances } = useGetInstances({
+    query: [search, `profile:wsl:${wslProfile.id}:noncompliant`]
+      .filter(Boolean)
+      .join(" "),
+    limit: pageSize,
+    offset: (currentPage - 1) * pageSize,
+    with_wsl_profiles: true,
+  });
+
+  const {
+    selectedItems: selectedInstances,
+    setSelectedItems: setSelectedInstances,
+  } = useSelection(instances, isGettingInstances);
+
+  const {
+    value: isMakeCompliantModalOpen,
+    setTrue: openMakeCompliantModal,
+    setFalse: closeMakeCompliantModal,
+  } = useBoolean();
+
+  const columns = useMemo<Column<WindowsInstance>[]>(
+    () => [
+      {
+        accessor: "title",
+        Header: (
+          <>
+            <CheckboxInput
+              label={<span className="u-off-screen">Toggle all instances</span>}
+              inline
+              disabled={!instances.length}
+              indeterminate={
+                !!selectedInstances.length &&
+                selectedInstances.length < instances.length
+              }
+              checked={
+                !!instances.length &&
+                selectedInstances.length === instances.length
+              }
+              onChange={({ currentTarget: { checked } }) => {
+                setSelectedInstances(checked ? instances : []);
+              }}
+            />
+            Instance name
+          </>
+        ),
+        Cell: ({ row: { original: instance } }: CellProps<WindowsInstance>) => (
+          <>
+            <CheckboxInput
+              inline
+              label={
+                <span className="u-off-screen">Select {instance.title}</span>
+              }
+              checked={selectedInstances.includes(instance)}
+              onChange={({ currentTarget: { checked } }) => {
+                setSelectedInstances(
+                  checked
+                    ? [...selectedInstances, instance]
+                    : selectedInstances.filter((i) => i !== instance),
+                );
+              }}
+            />
+
+            <StaticLink to={ROUTES.instances.details.single(instance.id)}>
+              {instance.title}
+            </StaticLink>
+          </>
+        ),
+      },
+      {
+        Header: "OS",
+        Cell: ({ row: { original: instance } }: CellProps<WindowsInstance>) =>
+          instance.distribution_info?.description,
+      },
+      {
+        accessor: "profiles",
+        Header: "WSL profiles",
+        Cell: ({
+          row: { original: instance, index },
+        }: CellProps<WindowsInstance>) => (
+          <TruncatedCell
+            content={instance.wsl_profiles
+              ?.map((profile) => profile.title)
+              .join(", ")}
+            isExpanded={index === expandedRowIndex}
+            onExpand={() => {
+              handleExpand(index);
+            }}
+          />
+        ),
+      },
+      {
+        Header: "Last ping",
+        Cell: ({ row: { original: instance } }: CellProps<WindowsInstance>) => {
+          const dateTime = moment(instance.last_ping_time);
+
+          if (dateTime.isValid()) {
+            return (
+              <span className="font-monospace">
+                {dateTime.format(DISPLAY_DATE_TIME_FORMAT)}
+              </span>
+            );
+          } else {
+            return <NoData />;
+          }
+        },
+      },
+      {
+        ...LIST_ACTIONS_COLUMN_PROPS,
+        Cell: ({ row: { original: instance } }: CellProps<WindowsInstance>) => (
+          <WindowsInstanceActions instance={instance as WindowsInstance} />
+        ),
+      },
+    ],
+    [
+      instances,
+      selectedInstances,
+      setSelectedInstances,
+      expandedRowIndex,
+      handleExpand,
+    ],
+  );
+
+  const clear = () => {
+    setInputValue("");
+    setSearch("");
+  };
+
+  return (
+    <>
+      <div className={classes.header}>
+        <SearchBox
+          className={classNames("u-no-margin--bottom", classes.search)}
+          externallyControlled
+          value={inputValue}
+          onChange={setInputValue}
+          onClear={clear}
+          onSearch={setSearch}
+          autoComplete="off"
+        />
+
+        <Button
+          type="button"
+          className="u-no-margin"
+          hasIcon
+          onClick={openMakeCompliantModal}
+          disabled={!selectedInstances.length}
+        >
+          <Icon name="security-tick" />
+          <span>Make compliant</span>
+        </Button>
+      </div>
+
+      <SidePanelTableFilterChips
+        filters={[
+          {
+            label: "Search",
+            item: search || undefined,
+            clear,
+          },
+        ]}
+      />
+
+      {isGettingInstances ? (
+        <LoadingState />
+      ) : (
+        <ResponsiveTable
+          ref={getTableRowsRef}
+          columns={columns}
+          data={instances as WindowsInstance[]}
+          emptyMsg="No Windows instances found according to your search parameters."
+          getCellProps={getCellProps(expandedRowIndex)}
+          getRowProps={getRowProps(expandedRowIndex)}
+        />
+      )}
+
+      <WindowsInstanceMakeCompliantModal
+        close={closeMakeCompliantModal}
+        instances={selectedInstances as WindowsInstance[]}
+        isOpen={isMakeCompliantModalOpen}
+      />
+    </>
+  );
+};
+
+export default WslProfileNonCompliantInstancesList;
diff --git a/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/components/WindowsInstanceActions/WindowsInstanceActions.tsx b/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/components/WindowsInstanceActions/WindowsInstanceActions.tsx
new file mode 100644
index 000000000..e4a1225cc
--- /dev/null
+++ b/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/components/WindowsInstanceActions/WindowsInstanceActions.tsx
@@ -0,0 +1,42 @@
+import ListActions from "@/components/layout/ListActions";
+import { WindowsInstanceMakeCompliantModal } from "@/features/wsl";
+import type { WindowsInstanceWithoutRelation } from "@/types/Instance";
+import type { FC } from "react";
+import { useBoolean } from "usehooks-ts";
+
+interface WindowsInstanceActionsProps {
+  readonly instance: WindowsInstanceWithoutRelation;
+}
+
+const WindowsInstanceActions: FC<WindowsInstanceActionsProps> = ({
+  instance,
+}) => {
+  const {
+    value: isMakeCompliantModalOpen,
+    setTrue: openMakeCompliantModal,
+    setFalse: closeMakeCompliantModal,
+  } = useBoolean();
+
+  return (
+    <>
+      <ListActions
+        destructiveActions={[
+          {
+            icon: "security-tick",
+            label: "Make compliant",
+            onClick: openMakeCompliantModal,
+          },
+        ]}
+        toggleAriaLabel={`${instance.title} actions`}
+      />
+
+      <WindowsInstanceMakeCompliantModal
+        close={closeMakeCompliantModal}
+        instances={[instance]}
+        isOpen={isMakeCompliantModalOpen}
+      />
+    </>
+  );
+};
+
+export default WindowsInstanceActions;
diff --git a/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/components/WindowsInstanceActions/index.ts b/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/components/WindowsInstanceActions/index.ts
new file mode 100644
index 000000000..eca41bfbf
--- /dev/null
+++ b/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/components/WindowsInstanceActions/index.ts
@@ -0,0 +1 @@
+export { default } from "./WindowsInstanceActions";
diff --git a/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/helpers.ts b/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/helpers.ts
new file mode 100644
index 000000000..99a287da2
--- /dev/null
+++ b/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/helpers.ts
@@ -0,0 +1,32 @@
+import type { WindowsInstance } from "@/types/Instance";
+import type { HTMLProps } from "react";
+import type { Cell, Row, TableCellProps, TableRowProps } from "react-table";
+
+export const getCellProps = (expandedRowIndex: number | null) => {
+  return ({
+    column,
+    row: { index },
+  }: Cell<WindowsInstance>): Partial<
+    TableCellProps & HTMLProps<HTMLTableCellElement>
+  > => {
+    if (column.id === "profiles" && expandedRowIndex === index) {
+      return { className: "expandedCell" };
+    } else {
+      return {};
+    }
+  };
+};
+
+export const getRowProps = (expandedRowIndex: number | null) => {
+  return ({
+    index,
+  }: Row<WindowsInstance>): Partial<
+    TableRowProps & HTMLProps<HTMLTableRowElement>
+  > => {
+    if (expandedRowIndex === index) {
+      return { className: "expandedRow" };
+    } else {
+      return {};
+    }
+  };
+};
diff --git a/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/index.ts b/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/index.ts
new file mode 100644
index 000000000..ed9b24727
--- /dev/null
+++ b/src/features/wsl-profiles/components/WslProfileNonCompliantInstancesList/index.ts
@@ -0,0 +1 @@
+export { default } from "./WslProfileNonCompliantInstancesList";
diff --git a/src/features/wsl-profiles/components/WslProfilesList/WslProfilesList.test.tsx b/src/features/wsl-profiles/components/WslProfilesList/WslProfilesList.test.tsx
deleted file mode 100644
index 5f2197e08..000000000
--- a/src/features/wsl-profiles/components/WslProfilesList/WslProfilesList.test.tsx
+++ /dev/null
@@ -1,59 +0,0 @@
-import { expectLoadingState } from "@/tests/helpers";
-import { wslProfiles } from "@/tests/mocks/wsl-profiles";
-import { renderWithProviders } from "@/tests/render";
-import { screen, waitFor } from "@testing-library/react";
-import type { ComponentProps } from "react";
-import WslProfilesList from "./WslProfilesList";
-
-const props: ComponentProps<typeof WslProfilesList> = {
-  wslProfiles: wslProfiles,
-};
-
-describe("WslProfilesList", () => {
-  it("should render profile list", async () => {
-    const { container } = renderWithProviders(<WslProfilesList {...props} />);
-
-    await expectLoadingState();
-
-    expect(container).toHaveTexts([
-      "Name",
-      "Description",
-      "Access group",
-      "Tags",
-      "Associated parents",
-      "Not compliant",
-      "Compliant",
-      "Actions",
-    ]);
-
-    expect(screen.getAllByRole("row")).toHaveLength(wslProfiles.length + 1);
-
-    await waitFor(() => {
-      wslProfiles.forEach(async (profile) => {
-        expect(
-          screen.getByRole("button", { name: profile.title }),
-        ).toBeInTheDocument();
-
-        expect(
-          screen.getByLabelText(`${profile.title} profile actions`),
-        ).toBeInTheDocument();
-      });
-    });
-  });
-
-  it("should filter profiles by search", () => {
-    const searchText = wslProfiles[0].title;
-
-    renderWithProviders(
-      <WslProfilesList {...props} />,
-      undefined,
-      `/profiles/wsl?search=${searchText}`,
-    );
-
-    wslProfiles
-      .filter(({ title }) => !title.includes(searchText))
-      .forEach((profile) => {
-        expect(screen.queryByText(profile.title)).not.toBeInTheDocument();
-      });
-  });
-});
diff --git a/src/features/wsl-profiles/index.tsx b/src/features/wsl-profiles/index.tsx
index c804c44a6..9a330a19f 100644
--- a/src/features/wsl-profiles/index.tsx
+++ b/src/features/wsl-profiles/index.tsx
@@ -1,10 +1,6 @@
 export * from "./api";
-export { default as WslProfileAddButton } from "./components/WslProfileAddButton";
 export { default as WslProfileAddSidePanel } from "./components/WslProfileAddSidePanel";
-export { default as WslProfileDetailsSidePanel } from "./components/WslProfileDetailsSidePanel";
 export { default as WslProfileEditSidePanel } from "./components/WslProfileEditSidePanel";
-export { default as WslProfileNonCompliantInstancesSidePanel } from "./components/WslProfileNonCompliantInstancesSidePanel";
-export { default as WslProfilesEmptyState } from "./components/WslProfilesEmptyState";
-export { default as WslProfilesHeader } from "./components/WslProfilesHeader";
-export { default as WslProfilesList } from "./components/WslProfilesList";
+export { default as WslProfileNonCompliantInstancesList } from "./components/WslProfileNonCompliantInstancesList";
+export { default as ViewWslProfileDetailsBlock } from "./components/ViewWslProfileDetailsBlock";
 export type { WslProfile } from "./types";
diff --git a/src/features/wsl-profiles/types/WslProfile.ts b/src/features/wsl-profiles/types/WslProfile.ts
index 652f89a0f..be580348e 100644
--- a/src/features/wsl-profiles/types/WslProfile.ts
+++ b/src/features/wsl-profiles/types/WslProfile.ts
@@ -1,20 +1,11 @@
-export interface WslProfile extends Record<string, unknown> {
-  access_group: string;
-  all_computers: boolean;
-  computers: {
-    constrained: number[];
-    "non-compliant": number[];
-    pending: number[];
-  };
+import type { Profile, ComplianceInstanceCounts } from "@/features/profiles";
+
+export interface WslProfile extends Profile {
+  computers: ComplianceInstanceCounts;
   cloud_init_contents: string | null;
   cloud_init_secret_name: string | null;
-  description: string;
-  id: number;
   image_name: string;
   image_source: string | null;
   instance_type: string;
-  name: string;
   only_landscape_created: boolean;
-  tags: string[];
-  title: string;
 }
diff --git a/src/hooks/useProfiles.ts b/src/hooks/useProfiles.ts
new file mode 100644
index 000000000..123a1f4e0
--- /dev/null
+++ b/src/hooks/useProfiles.ts
@@ -0,0 +1,6 @@
+import { useContext } from "react";
+import { ProfilesContext } from "@/context/profiles";
+
+export default function useProfilesContext() {
+  return useContext(ProfilesContext);
+}
diff --git a/src/pages/dashboard/profiles/package-profiles/PackageProfilesContent/PackageProfilesContent.tsx b/src/pages/dashboard/profiles/package-profiles/PackageProfilesContent/PackageProfilesContent.tsx
index 9238dc0e7..1066cfd76 100644
--- a/src/pages/dashboard/profiles/package-profiles/PackageProfilesContent/PackageProfilesContent.tsx
+++ b/src/pages/dashboard/profiles/package-profiles/PackageProfilesContent/PackageProfilesContent.tsx
@@ -1,9 +1,6 @@
 import type { FC } from "react";
 import type { PackageProfile } from "@/features/package-profiles";
-import {
-  PackageProfileHeader,
-  PackageProfileList,
-} from "@/features/package-profiles";
+import { PackageProfileHeader, PackageProfileList } from "@/features/package-profiles";
 
 interface PackageProfilesContentProps {
   readonly packageProfiles: PackageProfile[] | undefined;
diff --git a/src/pages/dashboard/profiles/package-profiles/PackageProfilesPage/PackageProfilesPage.test.tsx b/src/pages/dashboard/profiles/package-profiles/PackageProfilesPage.test.tsx
similarity index 80%
rename from src/pages/dashboard/profiles/package-profiles/PackageProfilesPage/PackageProfilesPage.test.tsx
rename to src/pages/dashboard/profiles/package-profiles/PackageProfilesPage.test.tsx
index e09898f7c..6cb205723 100644
--- a/src/pages/dashboard/profiles/package-profiles/PackageProfilesPage/PackageProfilesPage.test.tsx
+++ b/src/pages/dashboard/profiles/package-profiles/PackageProfilesPage.test.tsx
@@ -5,21 +5,35 @@ import { screen, within } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { describe, expect } from "vitest";
 import PackageProfilesPage from "./PackageProfilesPage";
+import type * as actualModule from "@/features/profiles";
+
+vi.mock("@/features/profiles", async () => {
+  const actual = await vi.importActual<typeof actualModule>(
+    "@/features/profiles",
+  );
+
+  return {
+    ...actual,
+    ProfilesContainer: () => <div>Package profiles table</div>,
+  };
+});
 
 describe("PackageProfilesPage", () => {
-  it("has a button to add a package profile", async () => {
+  it("has a button to add a profile", async () => {
     renderWithProviders(<PackageProfilesPage />);
 
     const user = userEvent.setup();
 
     await user.click(
-      screen.getByRole("button", { name: "Add package profile" }),
+      await screen.findByRole("button", { name: "Add profile" }),
     );
     await expectLoadingState();
+
     expect(
-      screen.getByRole("heading", { name: "Add package profile" }),
+      await screen.findByRole("heading", { name: "Add package profile" }),
     ).toBeInTheDocument();
     await user.click(screen.getByLabelText("Close"));
+
     expect(
       screen.queryByRole("heading", { name: "Add package profile" }),
     ).not.toBeInTheDocument();
@@ -32,6 +46,7 @@ describe("PackageProfilesPage", () => {
       `/?sidePath=add-constraints&profile=${packageProfiles[0].name}`,
     );
 
+    await expectLoadingState();
     expect(
       await within(screen.getByLabelText("Side panel")).findByRole("heading", {
         name: `Add package constraints to "${packageProfiles[0].title}" profile`,
@@ -46,6 +61,7 @@ describe("PackageProfilesPage", () => {
       `/?sidePath=duplicate&profile=${packageProfiles[0].name}`,
     );
 
+    await expectLoadingState();
     expect(
       await within(screen.getByLabelText("Side panel")).findByRole("heading", {
         name: `Duplicate ${packageProfiles[0].title}`,
@@ -60,6 +76,7 @@ describe("PackageProfilesPage", () => {
       `/?sidePath=edit&profile=${packageProfiles[0].name}`,
     );
 
+    await expectLoadingState();
     expect(
       await within(screen.getByLabelText("Side panel")).findByRole("heading", {
         name: `Edit ${packageProfiles[0].title}`,
@@ -74,6 +91,7 @@ describe("PackageProfilesPage", () => {
       `/?sidePath=edit-constraints&profile=${packageProfiles[0].name}`,
     );
 
+    await expectLoadingState();
     expect(
       await within(screen.getByLabelText("Side panel")).findByRole("heading", {
         name: `Change "${packageProfiles[0].title}" profile's constraints`,
@@ -88,6 +106,7 @@ describe("PackageProfilesPage", () => {
       `/?sidePath=view&profile=${packageProfiles[0].name}`,
     );
 
+    await expectLoadingState();
     expect(
       await within(screen.getByLabelText("Side panel")).findByRole("heading", {
         name: packageProfiles[0].title,
diff --git a/src/pages/dashboard/profiles/package-profiles/PackageProfilesPage.tsx b/src/pages/dashboard/profiles/package-profiles/PackageProfilesPage.tsx
new file mode 100644
index 000000000..6cd7d0f6b
--- /dev/null
+++ b/src/pages/dashboard/profiles/package-profiles/PackageProfilesPage.tsx
@@ -0,0 +1,155 @@
+import PageContent from "@/components/layout/PageContent";
+import PageHeader from "@/components/layout/PageHeader";
+import PageMain from "@/components/layout/PageMain";
+import {
+  usePackageProfiles,
+  useGetPagePackageProfile,
+} from "@/features/package-profiles";
+import type { FC } from "react";
+import {
+  AddProfileButton,
+  ProfilesContainer,
+  ViewProfileSidePanel,
+} from "@/features/profiles";
+import SidePanel from "@/components/layout/SidePanel";
+import useSetDynamicFilterValidation from "@/hooks/useDynamicFilterValidation";
+import usePageParams from "@/hooks/usePageParams";
+import { lazy, useEffect } from "react";
+import { ProfileTypes } from "@/features/profiles";
+import useProfiles from "@/hooks/useProfiles";
+
+const PackageProfileAddSidePanel = lazy(async () =>
+  import("@/features/package-profiles").then((module) => ({
+    default: module.PackageProfileAddSidePanel,
+  })),
+);
+
+const PackageProfileConstraintsAddSidePanel = lazy(async () =>
+  import("@/features/package-profiles").then((module) => ({
+    default: module.PackageProfileConstraintsAddSidePanel,
+  })),
+);
+
+const PackageProfileConstraintsEditSidePanel = lazy(async () =>
+  import("@/features/package-profiles").then((module) => ({
+    default: module.PackageProfileConstraintsEditSidePanel,
+  })),
+);
+
+const PackageProfileDuplicateSidePanel = lazy(async () =>
+  import("@/features/package-profiles").then((module) => ({
+    default: module.PackageProfileDuplicateSidePanel,
+  })),
+);
+
+const PackageProfileEditSidePanel = lazy(async () =>
+  import("@/features/package-profiles").then((module) => ({
+    default: module.PackageProfileEditSidePanel,
+  })),
+);
+
+const PackageProfilesPage: FC = () => {
+  const { getPackageProfilesQuery } = usePackageProfiles();
+  const { sidePath, lastSidePathSegment, createPageParamsSetter } =
+    usePageParams();
+
+  const { packageProfile } = useGetPagePackageProfile();
+
+  useSetDynamicFilterValidation("sidePath", [
+    "add",
+    "add-constraints",
+    "duplicate",
+    "edit",
+    "edit-constraints",
+    "view",
+  ]);
+
+  const {
+    data: getPackageProfilesQueryResult,
+    isPending: isGettingPackageProfiles,
+  } = getPackageProfilesQuery();
+  const packageProfiles = getPackageProfilesQueryResult?.data.result ?? [];
+
+  const { removePackageProfileQuery } = usePackageProfiles();
+  const { setRemoveProfile, setIsRemovingProfile } = useProfiles();
+
+  useEffect(() => {
+    setRemoveProfile(({ name }) =>
+      removePackageProfileQuery.mutateAsync({ name }),
+    );
+    setIsRemovingProfile(removePackageProfileQuery.isPending);
+  }, [setRemoveProfile, removePackageProfileQuery, setIsRemovingProfile]);
+
+  return (
+    <PageMain>
+      <PageHeader
+        title="Package profiles"
+        actions={
+          packageProfiles.length
+            ? [<AddProfileButton key="add-package-profile" />]
+            : undefined
+        }
+      />
+      <PageContent hasTable>
+        <ProfilesContainer
+          type={ProfileTypes.package}
+          profiles={packageProfiles}
+          isPending={isGettingPackageProfiles}
+        />
+      </PageContent>
+
+      <SidePanel
+        onClose={createPageParamsSetter({ sidePath: [], profile: "" })}
+        isOpen={!!sidePath.length}
+        size={
+          lastSidePathSegment === "add" ||
+          lastSidePathSegment === "add-constraints" ||
+          lastSidePathSegment === "edit-constraints"
+            ? "medium"
+            : undefined
+        }
+      >
+        {lastSidePathSegment === "add" && (
+          <SidePanel.Suspense key="add">
+            <PackageProfileAddSidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "add-constraints" && (
+          <SidePanel.Suspense key="add-constraints">
+            <PackageProfileConstraintsAddSidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "duplicate" && (
+          <SidePanel.Suspense key="duplicate">
+            <PackageProfileDuplicateSidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "edit" && (
+          <SidePanel.Suspense key="edit">
+            <PackageProfileEditSidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "edit-constraints" && (
+          <SidePanel.Suspense key="edit-constraints">
+            <PackageProfileConstraintsEditSidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "view" && (
+          <SidePanel.Suspense key="view">
+            <ViewProfileSidePanel
+              type={ProfileTypes.package}
+              profile={packageProfile}
+            />
+          </SidePanel.Suspense>
+        )}
+      </SidePanel>
+    </PageMain>
+  );
+};
+
+export default PackageProfilesPage;
diff --git a/src/pages/dashboard/profiles/reboot-profiles/RebootProfilesPage.tsx b/src/pages/dashboard/profiles/reboot-profiles/RebootProfilesPage.tsx
new file mode 100644
index 000000000..a009cea80
--- /dev/null
+++ b/src/pages/dashboard/profiles/reboot-profiles/RebootProfilesPage.tsx
@@ -0,0 +1,123 @@
+import PageContent from "@/components/layout/PageContent";
+import PageHeader from "@/components/layout/PageHeader";
+import PageMain from "@/components/layout/PageMain";
+import useSetDynamicFilterValidation from "@/hooks/useDynamicFilterValidation";
+import usePageParams from "@/hooks/usePageParams";
+import {
+  AddProfileButton,
+  ProfilesContainer,
+  ViewProfileSidePanel,
+} from "@/features/profiles";
+import {
+  useGetRebootProfiles,
+  useGetPageRebootProfile,
+  useRemoveRebootProfile,
+} from "@/features/reboot-profiles";
+import type { FC } from "react";
+import SidePanel from "@/components/layout/SidePanel";
+import { lazy, useEffect } from "react";
+import { ProfileTypes } from "@/features/profiles";
+import useProfiles from "@/hooks/useProfiles";
+
+const RebootProfileAddSidePanel = lazy(async () =>
+  import("@/features/reboot-profiles").then((module) => ({
+    default: module.RebootProfileAddSidePanel,
+  })),
+);
+
+const RebootProfileDuplicateSidePanel = lazy(async () =>
+  import("@/features/reboot-profiles").then((module) => ({
+    default: module.RebootProfileDuplicateSidePanel,
+  })),
+);
+
+const RebootProfileEditSidePanel = lazy(async () =>
+  import("@/features/reboot-profiles").then((module) => ({
+    default: module.RebootProfileEditSidePanel,
+  })),
+);
+
+const RebootProfilesPage: FC = () => {
+  const { rebootProfiles, rebootProfilesCount, isGettingRebootProfiles } =
+    useGetRebootProfiles();
+  const { sidePath, lastSidePathSegment, createPageParamsSetter } =
+    usePageParams();
+
+  const { rebootProfile } = useGetPageRebootProfile();
+
+  const { removeRebootProfile, isRemovingRebootProfile } =
+    useRemoveRebootProfile();
+  const { setRemoveProfile, setIsRemovingProfile } = useProfiles();
+
+  useEffect(() => {
+    setRemoveProfile(({ id }) => removeRebootProfile({ id }));
+    setIsRemovingProfile(isRemovingRebootProfile);
+  }, [
+    setRemoveProfile,
+    setIsRemovingProfile,
+    removeRebootProfile,
+    isRemovingRebootProfile,
+  ]);
+
+  useSetDynamicFilterValidation("sidePath", [
+    "add",
+    "duplicate",
+    "edit",
+    "view",
+  ]);
+
+  return (
+    <PageMain>
+      <PageHeader
+        title="Reboot profiles"
+        actions={
+          rebootProfilesCount
+            ? [<AddProfileButton key="add-reboot-profile" />]
+            : undefined
+        }
+      />
+      <PageContent hasTable>
+        <ProfilesContainer
+          type={ProfileTypes.reboot}
+          profiles={rebootProfiles}
+          isPending={isGettingRebootProfiles}
+          profilesCount={rebootProfilesCount}
+        />
+      </PageContent>
+
+      <SidePanel
+        onClose={createPageParamsSetter({ sidePath: [], profile: "" })}
+        isOpen={!!sidePath.length}
+      >
+        {lastSidePathSegment === "add" && (
+          <SidePanel.Suspense key="add">
+            <RebootProfileAddSidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "duplicate" && (
+          <SidePanel.Suspense key="duplicate">
+            <RebootProfileDuplicateSidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "edit" && (
+          <SidePanel.Suspense key="edit">
+            <RebootProfileEditSidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "view" && (
+          <SidePanel.Suspense key="view">
+            <ViewProfileSidePanel
+              type={ProfileTypes.reboot}
+              profile={rebootProfile}
+            />
+          </SidePanel.Suspense>
+        )}
+      </SidePanel>
+    </PageMain>
+  );
+};
+
+export default RebootProfilesPage;
diff --git a/src/pages/dashboard/profiles/removal-profiles/RemovalProfilesPage.tsx b/src/pages/dashboard/profiles/removal-profiles/RemovalProfilesPage.tsx
new file mode 100644
index 000000000..0c1c5e579
--- /dev/null
+++ b/src/pages/dashboard/profiles/removal-profiles/RemovalProfilesPage.tsx
@@ -0,0 +1,104 @@
+import PageContent from "@/components/layout/PageContent";
+import PageHeader from "@/components/layout/PageHeader";
+import PageMain from "@/components/layout/PageMain";
+import {
+  AddProfileButton,
+  ProfilesContainer,
+  ViewProfileSidePanel,
+} from "@/features/profiles";
+import {
+  useRemovalProfiles,
+  useGetPageRemovalProfile,
+} from "@/features/removal-profiles";
+import type { FC } from "react";
+import useSetDynamicFilterValidation from "@/hooks/useDynamicFilterValidation";
+import usePageParams from "@/hooks/usePageParams";
+import { lazy, useEffect } from "react";
+import SidePanel from "@/components/layout/SidePanel";
+import { ProfileTypes } from "@/features/profiles";
+import useProfiles from "@/hooks/useProfiles";
+
+const RemovalProfileAddSidePanel = lazy(async () =>
+  import("@/features/removal-profiles").then((module) => ({
+    default: module.RemovalProfileAddSidePanel,
+  })),
+);
+
+const RemovalProfileEditSidePanel = lazy(async () =>
+  import("@/features/removal-profiles").then((module) => ({
+    default: module.RemovalProfileEditSidePanel,
+  })),
+);
+
+const RemovalProfilesPage: FC = () => {
+  const { getRemovalProfilesQuery } = useRemovalProfiles();
+  const {
+    data: getRemovalProfilesQueryResult,
+    isPending: isGettingRemovalProfiles,
+  } = getRemovalProfilesQuery();
+
+  const { sidePath, lastSidePathSegment, createPageParamsSetter } =
+    usePageParams();
+
+  const { removalProfile } = useGetPageRemovalProfile();
+
+  const { removeRemovalProfileQuery } = useRemovalProfiles();
+  const { setRemoveProfile, setIsRemovingProfile } = useProfiles();
+
+  useEffect(() => {
+    setRemoveProfile(({ name }) =>
+      removeRemovalProfileQuery.mutateAsync({ name }),
+    );
+    setIsRemovingProfile(removeRemovalProfileQuery.isPending);
+  }, [setRemoveProfile, setIsRemovingProfile, removeRemovalProfileQuery]);
+
+  useSetDynamicFilterValidation("sidePath", ["add", "edit", "view"]);
+
+  return (
+    <PageMain>
+      <PageHeader
+        title="Removal profiles"
+        actions={
+          getRemovalProfilesQueryResult?.data.length
+            ? [<AddProfileButton key="add-removal-profile" />]
+            : undefined
+        }
+      />
+      <PageContent hasTable>
+        <ProfilesContainer
+          type={ProfileTypes.removal}
+          profiles={getRemovalProfilesQueryResult?.data ?? []}
+          isPending={isGettingRemovalProfiles}
+        />
+      </PageContent>
+
+      <SidePanel
+        isOpen={!!sidePath.length}
+        onClose={createPageParamsSetter({ sidePath: [], profile: "" })}
+      >
+        {lastSidePathSegment === "add" && (
+          <SidePanel.Suspense key="add">
+            <RemovalProfileAddSidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "edit" && (
+          <SidePanel.Suspense key="edit">
+            <RemovalProfileEditSidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "view" && (
+          <SidePanel.Suspense key="view">
+            <ViewProfileSidePanel
+              type={ProfileTypes.removal}
+              profile={removalProfile}
+            />
+          </SidePanel.Suspense>
+        )}
+      </SidePanel>
+    </PageMain>
+  );
+};
+
+export default RemovalProfilesPage;
diff --git a/src/pages/dashboard/profiles/security-profiles/SecurityProfilesPage.test.tsx b/src/pages/dashboard/profiles/security-profiles/SecurityProfilesPage.test.tsx
new file mode 100644
index 000000000..6cf1a5053
--- /dev/null
+++ b/src/pages/dashboard/profiles/security-profiles/SecurityProfilesPage.test.tsx
@@ -0,0 +1,117 @@
+import { securityProfiles } from "@/tests/mocks/securityProfiles";
+import { renderWithProviders } from "@/tests/render";
+import { screen, within } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import SecurityProfilesPage from "./SecurityProfilesPage";
+import userEvent from "@testing-library/user-event";
+import { expectLoadingState } from "@/tests/helpers";
+import type * as actualModule from "@/features/profiles";
+
+vi.mock("@/features/profiles", async () => {
+  const actual = await vi.importActual<typeof actualModule>(
+    "@/features/profiles",
+  );
+
+  return {
+    ...actual,
+    ProfilesContainer: () => <div>Security profiles table</div>,
+  };
+});
+
+describe("SecurityProfilesPage", () => {
+  it("has a button to add a profile", async () => {
+    renderWithProviders(<SecurityProfilesPage />);
+    const user = userEvent.setup();
+
+    await user.click(
+      await screen.findByRole("button", { name: "Add profile" }),
+    );
+    await expectLoadingState();
+
+    expect(
+      await screen.findByRole("heading", {
+        name: "Add security profileStep 1 of 5",
+      }),
+    ).toBeInTheDocument();
+    await user.click(screen.getByLabelText("Close"));
+
+    expect(
+      screen.queryByRole("heading", { name: "Add security profile" }),
+    ).not.toBeInTheDocument();
+  });
+
+  it("renders a side panel to download", async () => {
+    renderWithProviders(
+      <SecurityProfilesPage />,
+      undefined,
+      `/?sidePath=download&profile=${securityProfiles[1].id}`,
+    );
+
+    await expectLoadingState();
+    expect(
+      await within(screen.getByLabelText("Side panel")).findByRole("heading", {
+        name: `Download audit for ${securityProfiles[1].title} security profile`,
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it("renders a side panel to duplicate", async () => {
+    renderWithProviders(
+      <SecurityProfilesPage />,
+      undefined,
+      `/?sidePath=duplicate&profile=${securityProfiles[1].id}`,
+    );
+
+    await expectLoadingState();
+    expect(
+      await within(screen.getByLabelText("Side panel")).findByRole("heading", {
+        name: `Duplicate ${securityProfiles[1].title}`,
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it("renders a side panel to edit", async () => {
+    renderWithProviders(
+      <SecurityProfilesPage />,
+      undefined,
+      `/?sidePath=edit&profile=${securityProfiles[1].id}`,
+    );
+
+    await expectLoadingState();
+    expect(
+      await within(screen.getByLabelText("Side panel")).findByRole("heading", {
+        name: `Edit ${securityProfiles[1].title}`,
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it("renders a side panel to run", async () => {
+    renderWithProviders(
+      <SecurityProfilesPage />,
+      undefined,
+      `/?sidePath=run&profile=${securityProfiles[1].id}`,
+    );
+
+    await expectLoadingState();
+    expect(
+      await within(screen.getByLabelText("Side panel")).findByRole("heading", {
+        name: `Run "${securityProfiles[1].title}" profile`,
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it("renders a side panel to view", async () => {
+    renderWithProviders(
+      <SecurityProfilesPage />,
+      undefined,
+      `/?sidePath=view&profile=${securityProfiles[1].id}`,
+    );
+
+    await expectLoadingState();
+    expect(
+      await within(screen.getByLabelText("Side panel")).findByRole("heading", {
+        name: securityProfiles[1].title,
+      }),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/pages/dashboard/profiles/security-profiles/SecurityProfilesPage.tsx b/src/pages/dashboard/profiles/security-profiles/SecurityProfilesPage.tsx
new file mode 100644
index 000000000..4e45184fd
--- /dev/null
+++ b/src/pages/dashboard/profiles/security-profiles/SecurityProfilesPage.tsx
@@ -0,0 +1,212 @@
+import PageContent from "@/components/layout/PageContent";
+import PageHeader from "@/components/layout/PageHeader";
+import PageMain from "@/components/layout/PageMain";
+import {
+  AddProfileButton,
+  ProfilesContainer,
+  ViewProfileSidePanel,
+} from "@/features/profiles";
+import {
+  SecurityProfilesNotifications,
+  useGetSecurityProfiles,
+  useIsSecurityProfilesLimitReached,
+  useGetPageSecurityProfile,
+  ACTIVE_SECURITY_PROFILES_LIMIT,
+  useArchiveSecurityProfile,
+} from "@/features/security-profiles";
+import usePageParams from "@/hooks/usePageParams";
+import { lazy, useEffect, type FC } from "react";
+import useProfiles from "@/hooks/useProfiles";
+import SidePanel from "@/components/layout/SidePanel";
+import { useBoolean } from "usehooks-ts";
+import useSetDynamicFilterValidation from "@/hooks/useDynamicFilterValidation";
+import { ProfileTypes } from "@/features/profiles";
+
+const SecurityProfileAddSidePanel = lazy(() =>
+  import("@/features/security-profiles").then((module) => ({
+    default: module.SecurityProfileAddSidePanel,
+  })),
+);
+
+const SecurityProfileDownloadAuditSidePanel = lazy(() =>
+  import("@/features/security-profiles").then((module) => ({
+    default: module.SecurityProfileDownloadAuditSidePanel,
+  })),
+);
+
+const SecurityProfileDuplicateSidePanel = lazy(() =>
+  import("@/features/security-profiles").then((module) => ({
+    default: module.SecurityProfileDuplicateSidePanel,
+  })),
+);
+
+const SecurityProfileEditSidePanel = lazy(() =>
+  import("@/features/security-profiles").then((module) => ({
+    default: module.SecurityProfileEditSidePanel,
+  })),
+);
+
+const SecurityProfileRunFixSidePanel = lazy(() =>
+  import("@/features/security-profiles").then((module) => ({
+    default: module.SecurityProfileRunFixSidePanel,
+  })),
+);
+
+const SecurityProfilesPage: FC = () => {
+  const {
+    createPageParamsSetter,
+    lastSidePathSegment,
+    sidePath,
+    currentPage,
+    pageSize,
+    search,
+    status,
+    passRateFrom,
+    passRateTo,
+  } = usePageParams();
+  const {
+    setIsProfileLimitReached,
+    setProfileLimit,
+    setRemoveProfile,
+    setIsRemovingProfile,
+  } = useProfiles();
+  const {
+    value: isRetentionNotificationVisible,
+    setTrue: showRetentionNotification,
+    setFalse: hideRetentionNotification,
+  } = useBoolean(false);
+
+  const { securityProfile } = useGetPageSecurityProfile();
+
+  const { archiveSecurityProfile, isArchivingSecurityProfile } =
+    useArchiveSecurityProfile();
+
+  useEffect(() => {
+    setRemoveProfile(({ id }) => archiveSecurityProfile({ id }));
+    setIsRemovingProfile(isArchivingSecurityProfile);
+  }, [
+    setRemoveProfile,
+    setIsRemovingProfile,
+    isArchivingSecurityProfile,
+    archiveSecurityProfile,
+  ]);
+
+  const isSecurityProfileLimitReached = useIsSecurityProfilesLimitReached();
+
+  useEffect(() => {
+    setIsProfileLimitReached(isSecurityProfileLimitReached);
+    setProfileLimit(ACTIVE_SECURITY_PROFILES_LIMIT);
+  }, [
+    setIsProfileLimitReached,
+    isSecurityProfileLimitReached,
+    setProfileLimit,
+  ]);
+
+  useSetDynamicFilterValidation("sidePath", [
+    "add",
+    "download",
+    "duplicate",
+    "edit",
+    "run",
+    "view",
+  ]);
+
+  const getStatus = () => {
+    if (status === "all") {
+      return undefined;
+    }
+    if (status) {
+      return status;
+    }
+    return "active";
+  };
+
+  const {
+    securityProfiles,
+    securityProfilesCount,
+    isSecurityProfilesLoading: isGettingSecurityProfiles,
+  } = useGetSecurityProfiles({
+    search,
+    status: getStatus(),
+    limit: pageSize,
+    offset: (currentPage - 1) * pageSize,
+    pass_rate_from: passRateFrom != 0 ? passRateFrom : undefined,
+    pass_rate_to: passRateTo != 100 ? passRateTo : undefined,
+  });
+
+  return (
+    <PageMain>
+      <PageHeader
+        title="Security profiles"
+        actions={
+          securityProfilesCount
+            ? [<AddProfileButton key="add-security-profile" />]
+            : undefined
+        }
+      />
+
+      <PageContent hasTable>
+        {!isGettingSecurityProfiles && !!securityProfilesCount && (
+          <SecurityProfilesNotifications
+            isRetentionNotificationVisible={isRetentionNotificationVisible}
+            hideRetentionNotification={hideRetentionNotification}
+          />
+        )}
+        <ProfilesContainer
+          type={ProfileTypes.security}
+          profiles={securityProfiles}
+          isPending={isGettingSecurityProfiles}
+          profilesCount={securityProfilesCount}
+        />
+      </PageContent>
+
+      <SidePanel
+        onClose={createPageParamsSetter({ sidePath: [], profile: "" })}
+        isOpen={!!sidePath.length}
+      >
+        {lastSidePathSegment === "add" && (
+          <SidePanel.Suspense key="add">
+            <SecurityProfileAddSidePanel
+              showRetentionNotification={showRetentionNotification}
+            />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "download" && (
+          <SidePanel.Suspense key="download">
+            <SecurityProfileDownloadAuditSidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "duplicate" && (
+          <SidePanel.Suspense key="duplicate">
+            <SecurityProfileDuplicateSidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "edit" && (
+          <SidePanel.Suspense key="edit">
+            <SecurityProfileEditSidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "run" && (
+          <SidePanel.Suspense key="run">
+            <SecurityProfileRunFixSidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "view" && (
+          <SidePanel.Suspense key="view">
+            <ViewProfileSidePanel
+              type={ProfileTypes.security}
+              profile={securityProfile}
+            />
+          </SidePanel.Suspense>
+        )}
+      </SidePanel>
+    </PageMain>
+  );
+};
+
+export default SecurityProfilesPage;
diff --git a/src/pages/dashboard/profiles/upgrade-profiles/UpgradeProfilesPage.tsx b/src/pages/dashboard/profiles/upgrade-profiles/UpgradeProfilesPage.tsx
new file mode 100644
index 000000000..02cf9691f
--- /dev/null
+++ b/src/pages/dashboard/profiles/upgrade-profiles/UpgradeProfilesPage.tsx
@@ -0,0 +1,102 @@
+import PageContent from "@/components/layout/PageContent";
+import PageHeader from "@/components/layout/PageHeader";
+import PageMain from "@/components/layout/PageMain";
+import {
+  AddProfileButton,
+  ProfilesContainer,
+  ViewProfileSidePanel,
+} from "@/features/profiles";
+import {
+  useUpgradeProfiles,
+  useGetPageUpgradeProfile,
+} from "@/features/upgrade-profiles";
+import type { FC } from "react";
+import { lazy, useEffect } from "react";
+import useSetDynamicFilterValidation from "@/hooks/useDynamicFilterValidation";
+import usePageParams from "@/hooks/usePageParams";
+import SidePanel from "@/components/layout/SidePanel";
+import { ProfileTypes } from "@/features/profiles";
+import useProfiles from "@/hooks/useProfiles";
+
+const UpgradeProfileAddSidePanel = lazy(() =>
+  import("@/features/upgrade-profiles").then((module) => ({
+    default: module.UpgradeProfileAddSidePanel,
+  })),
+);
+
+const UpgradeProfileEditSidePanel = lazy(() =>
+  import("@/features/upgrade-profiles").then((module) => ({
+    default: module.UpgradeProfileEditSidePanel,
+  })),
+);
+
+const UpgradeProfilesPage: FC = () => {
+  const { getUpgradeProfilesQuery } = useUpgradeProfiles();
+  const { data: getUpgradeProfilesResult, isPending } =
+    getUpgradeProfilesQuery();
+
+  const { sidePath, lastSidePathSegment, createPageParamsSetter } =
+    usePageParams();
+
+  const { upgradeProfile } = useGetPageUpgradeProfile();
+
+  const { removeUpgradeProfileQuery } = useUpgradeProfiles();
+  const { setRemoveProfile, setIsRemovingProfile } = useProfiles();
+
+  useEffect(() => {
+    setRemoveProfile(({ name }) =>
+      removeUpgradeProfileQuery.mutateAsync({ name }),
+    );
+    setIsRemovingProfile(removeUpgradeProfileQuery.isPending);
+  }, [setRemoveProfile, removeUpgradeProfileQuery, setIsRemovingProfile]);
+
+  useSetDynamicFilterValidation("sidePath", ["add", "edit", "view"]);
+
+  return (
+    <PageMain>
+      <PageHeader
+        title="Upgrade profiles"
+        actions={
+          getUpgradeProfilesResult?.data.length
+            ? [<AddProfileButton key="add-upgrade-profile" />]
+            : undefined
+        }
+      />
+      <PageContent hasTable>
+        <ProfilesContainer
+          type={ProfileTypes.upgrade}
+          isPending={isPending}
+          profiles={getUpgradeProfilesResult?.data ?? []}
+        />
+      </PageContent>
+
+      <SidePanel
+        onClose={createPageParamsSetter({ sidePath: [], profile: "" })}
+        isOpen={!!sidePath.length}
+      >
+        {lastSidePathSegment === "add" && (
+          <SidePanel.Suspense key="add">
+            <UpgradeProfileAddSidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "edit" && (
+          <SidePanel.Suspense key="edit">
+            <UpgradeProfileEditSidePanel />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "view" && (
+          <SidePanel.Suspense key="view">
+            <ViewProfileSidePanel
+              type={ProfileTypes.upgrade}
+              profile={upgradeProfile}
+            />
+          </SidePanel.Suspense>
+        )}
+      </SidePanel>
+    </PageMain>
+  );
+};
+
+export default UpgradeProfilesPage;
diff --git a/src/pages/dashboard/profiles/wsl-profiles/WslProfilesPage.test.tsx b/src/pages/dashboard/profiles/wsl-profiles/WslProfilesPage.test.tsx
new file mode 100644
index 000000000..863d59fd7
--- /dev/null
+++ b/src/pages/dashboard/profiles/wsl-profiles/WslProfilesPage.test.tsx
@@ -0,0 +1,74 @@
+import { wslProfiles } from "@/tests/mocks/wsl-profiles";
+import { renderWithProviders } from "@/tests/render";
+import { screen, within } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import WslProfilesPage from "./WslProfilesPage";
+import userEvent from "@testing-library/user-event";
+import { expectLoadingState } from "@/tests/helpers";
+import type * as actualModule from "@/features/profiles";
+
+vi.mock("@/features/profiles", async () => {
+  const actual = await vi.importActual<typeof actualModule>(
+    "@/features/profiles",
+  );
+
+  return {
+    ...actual,
+    ProfilesContainer: () => <div>WSL profiles table</div>,
+  };
+});
+
+describe("WslProfilesPage", () => {
+  it("has a button to add a profile", async () => {
+    renderWithProviders(<WslProfilesPage />, undefined, "/profiles/wsl");
+    const user = userEvent.setup();
+
+    await user.click(
+      await screen.findByRole("button", { name: "Add profile" }),
+    );
+
+    await user.click(
+      await screen.findByRole("button", { name: "Add WSL profile" }),
+    );
+    await expectLoadingState();
+
+    expect(
+      await screen.findByRole("heading", { name: "Add WSL profile" }),
+    ).toBeInTheDocument();
+    await user.click(screen.getByLabelText("Close"));
+
+    expect(
+      screen.queryByRole("heading", { name: "Add WSL profile" }),
+    ).not.toBeInTheDocument();
+  });
+
+  it("renders a side panel to edit", async () => {
+    renderWithProviders(
+      <WslProfilesPage />,
+      undefined,
+      `/?sidePath=edit&profile=${wslProfiles[0].name}`,
+    );
+
+    await expectLoadingState();
+    expect(
+      await within(screen.getByLabelText("Side panel")).findByRole("heading", {
+        name: `Edit ${wslProfiles[0].title}`,
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it("renders a side panel to view", async () => {
+    renderWithProviders(
+      <WslProfilesPage />,
+      undefined,
+      `/?sidePath=view&profile=${wslProfiles[0].name}`,
+    );
+
+    await expectLoadingState();
+    expect(
+      await within(screen.getByLabelText("Side panel")).findByRole("heading", {
+        name: wslProfiles[0].title,
+      }),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/pages/dashboard/profiles/wsl-profiles/WslProfilesPage.tsx b/src/pages/dashboard/profiles/wsl-profiles/WslProfilesPage.tsx
index dd298c132..33a5d53d3 100644
--- a/src/pages/dashboard/profiles/wsl-profiles/WslProfilesPage.tsx
+++ b/src/pages/dashboard/profiles/wsl-profiles/WslProfilesPage.tsx
@@ -1,21 +1,25 @@
-import LoadingState from "@/components/layout/LoadingState";
 import PageContent from "@/components/layout/PageContent";
 import PageHeader from "@/components/layout/PageHeader";
 import PageMain from "@/components/layout/PageMain";
-import SidePanel from "@/components/layout/SidePanel";
+import {
+  AddProfileButton,
+  ProfilesContainer,
+  ViewProfileSidePanel,
+} from "@/features/profiles";
 import { useGetWslLimits } from "@/features/wsl";
 import {
+  useGetPageWslProfile,
   useGetWslProfiles,
-  WslProfileAddButton,
-  WslProfilesEmptyState,
-  WslProfilesHeader,
-  WslProfilesList,
+  useRemoveWslProfile,
 } from "@/features/wsl-profiles";
-import useSetDynamicFilterValidation from "@/hooks/useDynamicFilterValidation";
-import usePageParams from "@/hooks/usePageParams";
 import { DEFAULT_PAGE_SIZE } from "@/libs/pageParamsManager/constants";
 import { Notification } from "@canonical/react-components";
-import { lazy, type FC } from "react";
+import { lazy, useEffect, type FC } from "react";
+import useProfiles from "@/hooks/useProfiles";
+import useSetDynamicFilterValidation from "@/hooks/useDynamicFilterValidation";
+import usePageParams from "@/hooks/usePageParams";
+import SidePanel from "@/components/layout/SidePanel";
+import { ProfileTypes } from "@/features/profiles";
 
 const WslProfileAddSidePanel = lazy(() =>
   import("@/features/wsl-profiles").then((module) => ({
@@ -23,113 +27,92 @@ const WslProfileAddSidePanel = lazy(() =>
   })),
 );
 
-const WslProfileDetailsSidePanel = lazy(() =>
-  import("@/features/wsl-profiles").then((module) => ({
-    default: module.WslProfileDetailsSidePanel,
-  })),
-);
-
 const WslProfileEditSidePanel = lazy(() =>
   import("@/features/wsl-profiles").then((module) => ({
     default: module.WslProfileEditSidePanel,
   })),
 );
 
-const WslProfileNonCompliantInstancesSidePanel = lazy(() =>
-  import("@/features/wsl-profiles").then((module) => ({
-    default: module.WslProfileNonCompliantInstancesSidePanel,
-  })),
-);
-
 const WslProfilesPage: FC = () => {
+  const { wslProfilesCount: allWslProfilesCount } = useGetWslProfiles(
+    { limit: 1 },
+    { listenToUrlParams: false },
+  );
+
+  const { isGettingWslProfiles, wslProfiles, wslProfilesCount } =
+    useGetWslProfiles({
+      limit: DEFAULT_PAGE_SIZE,
+      offset: 0,
+    });
+  const {
+    setIsProfileLimitReached,
+    setProfileLimit,
+    setRemoveProfile,
+    setIsRemovingProfile,
+  } = useProfiles();
   const { sidePath, lastSidePathSegment, createPageParamsSetter } =
     usePageParams();
 
-  useSetDynamicFilterValidation("sidePath", [
-    "add",
-    "edit",
-    "noncompliant",
-    "view",
+  const { wslProfile } = useGetPageWslProfile();
+
+  const { removeWslProfile, isRemovingWslProfile } = useRemoveWslProfile();
+
+  useEffect(() => {
+    setRemoveProfile(({ name }) => removeWslProfile({ name }));
+    setIsRemovingProfile(isRemovingWslProfile);
+  }, [
+    setRemoveProfile,
+    setIsRemovingProfile,
+    removeWslProfile,
+    isRemovingWslProfile,
   ]);
 
-  const {
-    isGettingWslProfiles: isGettingUnfilteredWslProfiles,
-    wslProfilesCount: unfilteredWslProfilesCount,
-  } = useGetWslProfiles(
-    {
-      limit: DEFAULT_PAGE_SIZE,
-      offset: 0,
-    },
-    { listenToUrlParams: false },
-  );
+  useSetDynamicFilterValidation("sidePath", ["add", "edit", "view"]);
 
   const { isGettingWslLimits, wslProfileLimit } = useGetWslLimits();
-
-  const isWslProfileLimitReached =
-    unfilteredWslProfilesCount >= wslProfileLimit;
+  const isWslProfileLimitReached = allWslProfilesCount >= wslProfileLimit;
+
+  useEffect(() => {
+    setIsProfileLimitReached(isWslProfileLimitReached);
+    setProfileLimit(wslProfileLimit);
+  }, [
+    isWslProfileLimitReached,
+    setIsProfileLimitReached,
+    setProfileLimit,
+    wslProfileLimit,
+  ]);
 
   return (
     <PageMain>
-      {isGettingUnfilteredWslProfiles ? (
-        <LoadingState />
-      ) : (
-        <>
-          <PageHeader
-            title="WSL profiles"
-            actions={[
-              <WslProfileAddButton
-                key="add-wsl-profile"
-                disabled={isWslProfileLimitReached}
-              />,
-            ]}
-          />
-
-          <PageContent hasTable>
-            {!unfilteredWslProfilesCount ? (
-              <WslProfilesEmptyState />
-            ) : isGettingWslLimits ? (
-              <LoadingState />
-            ) : (
-              <>
-                <Notification
-                  severity="caution"
-                  title="WSL profiles is a beta feature"
-                >
-                  We are gathering feedback to improve this feature.{" "}
-                  <a
-                    target="_blank"
-                    rel="noreferrer noopener nofollow"
-                    href="https://discourse.ubuntu.com/t/feedback-on-the-new-web-portal/50528"
-                  >
-                    Share your feedback
-                  </a>
-                </Notification>
-
-                <WslProfilesHeader />
-
-                {isWslProfileLimitReached && (
-                  <Notification
-                    severity="caution"
-                    inline
-                    title="Profile limit reached:"
-                  >
-                    You&apos;ve reached the limit of {wslProfileLimit} active
-                    WSL profiles. You must remove a profile to be able to add a
-                    new one.
-                  </Notification>
-                )}
-
-                <WslProfilesList />
-              </>
-            )}
-          </PageContent>
-        </>
-      )}
-
+      <PageHeader
+        title="WSL profiles"
+        actions={
+          wslProfilesCount
+            ? [<AddProfileButton key="add-wsl-profile" />]
+            : undefined
+        }
+      />
+      <PageContent hasTable>
+        <Notification severity="caution" title="WSL profiles is a beta feature">
+          We are gathering feedback to improve this feature.{" "}
+          <a
+            target="_blank"
+            rel="noreferrer noopener nofollow"
+            href="https://discourse.ubuntu.com/t/feedback-on-the-new-web-portal/50528"
+          >
+            Share your feedback
+          </a>
+        </Notification>
+        <ProfilesContainer
+          type={ProfileTypes.wsl}
+          profiles={wslProfiles}
+          profilesCount={wslProfilesCount}
+          isPending={isGettingWslLimits || isGettingWslProfiles}
+        />
+      </PageContent>
       <SidePanel
         onClose={createPageParamsSetter({ sidePath: [], name: "" })}
         isOpen={!!sidePath.length}
-        size={lastSidePathSegment === "noncompliant" ? "large" : undefined}
       >
         {lastSidePathSegment === "add" && (
           <SidePanel.Suspense key="add">
@@ -143,15 +126,12 @@ const WslProfilesPage: FC = () => {
           </SidePanel.Suspense>
         )}
 
-        {lastSidePathSegment === "noncompliant" && (
-          <SidePanel.Suspense key="noncompliant">
-            <WslProfileNonCompliantInstancesSidePanel />
-          </SidePanel.Suspense>
-        )}
-
         {lastSidePathSegment === "view" && (
           <SidePanel.Suspense key="view">
-            <WslProfileDetailsSidePanel />
+            <ViewProfileSidePanel
+              type={ProfileTypes.wsl}
+              profile={wslProfile}
+            />
           </SidePanel.Suspense>
         )}
       </SidePanel>
diff --git a/src/pages/dashboard/repositories/repository-profiles/RepositoryProfilesPage.test.tsx b/src/pages/dashboard/repositories/repository-profiles/RepositoryProfilesPage.test.tsx
new file mode 100644
index 000000000..b3bcc84e9
--- /dev/null
+++ b/src/pages/dashboard/repositories/repository-profiles/RepositoryProfilesPage.test.tsx
@@ -0,0 +1,64 @@
+import { setEndpointStatus } from "@/tests/controllers/controller";
+import { repositoryProfiles } from "@/tests/mocks/repositoryProfiles";
+import { renderWithProviders } from "@/tests/render";
+import { expectLoadingState } from "@/tests/helpers";
+import { screen, within } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import RepositoryProfilesPage from "./RepositoryProfilesPage";
+
+describe("RepositoryProfilesPage", () => {
+  it("renders repository profile list with table and pagination", async () => {
+    renderWithProviders(<RepositoryProfilesPage />);
+
+    expect(
+      await screen.findByRole("table"),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("heading", { name: "Repository profiles" }),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByText(repositoryProfiles[0].title),
+    ).toBeInTheDocument();
+  });
+
+  it("renders empty state when no profiles exist", async () => {
+    setEndpointStatus("empty");
+    renderWithProviders(<RepositoryProfilesPage />);
+
+    expect(
+      await screen.findByText("No repository profiles found"),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("link", {
+        name: "How to manage repositories in Landscape",
+      }),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("button", { name: /Add repository profile/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("renders add profile button in header when profiles exist", async () => {
+    renderWithProviders(<RepositoryProfilesPage />);
+
+    expect(
+      await screen.findByRole("button", { name: /Add repository profile/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("opens profile details panel when sidePath=view and name are set in URL", async () => {
+    const [profile] = repositoryProfiles;
+    renderWithProviders(
+      <RepositoryProfilesPage />,
+      undefined,
+      `/?sidePath=view&name=${profile.name}`,
+    );
+
+    await expectLoadingState();
+    expect(
+      await within(screen.getByLabelText("Side panel")).findByRole("heading", {
+        name: profile.title,
+      }),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/pages/dashboard/repositories/repository-profiles/RepositoryProfilesPage.tsx b/src/pages/dashboard/repositories/repository-profiles/RepositoryProfilesPage.tsx
index f6147c8a6..282276791 100644
--- a/src/pages/dashboard/repositories/repository-profiles/RepositoryProfilesPage.tsx
+++ b/src/pages/dashboard/repositories/repository-profiles/RepositoryProfilesPage.tsx
@@ -2,15 +2,34 @@ import LoadingState from "@/components/layout/LoadingState";
 import PageContent from "@/components/layout/PageContent";
 import PageHeader from "@/components/layout/PageHeader";
 import PageMain from "@/components/layout/PageMain";
+import SidePanel from "@/components/layout/SidePanel";
 import {
   RepositoryProfileAddButton,
   RepositoryProfileContainer,
   useRepositoryProfiles,
 } from "@/features/repository-profiles";
-import type { FC } from "react";
+import usePageParams from "@/hooks/usePageParams";
+import useSetDynamicFilterValidation from "@/hooks/useDynamicFilterValidation";
+import { lazy, type FC } from "react";
+
+const RepositoryProfileDetails = lazy(async () =>
+  import("@/features/repository-profiles").then((module) => ({
+    default: module.RepositoryProfileDetails,
+  })),
+);
+
+const RepositoryProfileEditForm = lazy(async () =>
+  import("@/features/repository-profiles").then((module) => ({
+    default: module.RepositoryProfileEditForm,
+  })),
+);
 
 const RepositoryProfilesPage: FC = () => {
   const { getRepositoryProfilesQuery } = useRepositoryProfiles();
+  const { sidePath, lastSidePathSegment, createPageParamsSetter } =
+    usePageParams();
+
+  useSetDynamicFilterValidation("sidePath", ["view", "edit"]);
 
   const unfilteredRepositoryProfilesResult = getRepositoryProfilesQuery({
     limit: 0,
@@ -37,6 +56,21 @@ const RepositoryProfilesPage: FC = () => {
           }
         />
       </PageContent>
+      <SidePanel
+        onClose={createPageParamsSetter({ sidePath: [], name: "" })}
+        isOpen={!!sidePath.length}
+      >
+        {lastSidePathSegment === "view" && (
+          <SidePanel.Suspense key="view">
+            <RepositoryProfileDetails />
+          </SidePanel.Suspense>
+        )}
+        {lastSidePathSegment === "edit" && (
+          <SidePanel.Suspense key="edit">
+            <RepositoryProfileEditForm />
+          </SidePanel.Suspense>
+        )}
+      </SidePanel>
     </PageMain>
   );
 };
diff --git a/src/routes/DashboardRoutes.tsx b/src/routes/DashboardRoutes.tsx
index fbe809ad3..dba11cf69 100644
--- a/src/routes/DashboardRoutes.tsx
+++ b/src/routes/DashboardRoutes.tsx
@@ -39,6 +39,10 @@ export const DashboardRoutes = (
 
       {/* --- Profiles --- */}
       <Route path={PATHS.profiles.root}>
+        <Route
+          path={PATHS.repositories.repositoryProfiles}
+          element={<Pages.RepositoryProfilesPage />}
+        />
         <Route
           path={PATHS.profiles.package}
           element={<Pages.PackageProfilesPage />}
@@ -124,16 +128,13 @@ export const DashboardRoutes = (
             </SelfHostedGuard>
           }
         />
-        <Route
-          path={PATHS.repositories.repositoryProfiles}
-          element={
-            <SelfHostedGuard>
-              <Pages.RepositoryProfilesPage />
-            </SelfHostedGuard>
-          }
-        />
       </Route>
 
+      <Route
+        path={`${PATHS.repositories.root}/${PATHS.repositories.repositoryProfiles}`}
+        element={<Pages.RepositoryProfilesPage />}
+      />
+
       {/* --- Settings --- */}
       <Route path={PATHS.settings.root}>
         <Route
diff --git a/src/templates/dashboard/Navigation/constants.ts b/src/templates/dashboard/Navigation/constants.ts
index b3c47877d..afe85d006 100644
--- a/src/templates/dashboard/Navigation/constants.ts
+++ b/src/templates/dashboard/Navigation/constants.ts
@@ -2,6 +2,11 @@ import { ROUTES } from "@/libs/routes";
 import type { MenuItem } from "./types";
 
 const PROFILES_SUBMENU: MenuItem[] = [
+  {
+    label: "Repository profiles",
+    path: ROUTES.repositories.repositoryProfiles(),
+    env: "saas",
+  },
   { label: "Package profiles", path: ROUTES.profiles.package() },
   { label: "Upgrade profiles", path: ROUTES.profiles.upgrade() },
   { label: "Reboot profiles", path: ROUTES.profiles.reboot() },
diff --git a/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.module.scss b/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.module.scss
index cb5eda2ca..a064f09cf 100644
--- a/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.module.scss
+++ b/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.module.scss
@@ -4,7 +4,11 @@
 @import "vanilla-framework/scss/layouts_application";
 
 .secondaryNavigationDrawer {
+  align-self: flex-start;
   flex-shrink: 0;
+  height: 100vh;
+  position: sticky;
+  top: 0;
 }
 
 .secondaryNavigation {
@@ -26,8 +30,6 @@
 .secondaryNavigation__drawer {
   max-width: 100%;
   min-height: 100%;
-  position: static;
-  transform: none;
 }
 
 .secondaryNavigation__title {
diff --git a/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.tsx b/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.tsx
index 32c997b15..ba81f69e2 100644
--- a/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.tsx
+++ b/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.tsx
@@ -63,9 +63,7 @@ export const SecondaryNavigation: FC<SecondaryNavigationProps> = ({
                     className={classNames(
                       "p-side-navigation__link",
                       classes.secondaryNavigation__link,
-                      {
-                        [classes.isActive]: isActive,
-                      },
+                      isActive && classes.isActive,
                     )}
                     to={item.path}
                   >
diff --git a/src/tests/mocks/apt-sources.ts b/src/tests/mocks/apt-sources.ts
index f01aa071d..e76a73245 100644
--- a/src/tests/mocks/apt-sources.ts
+++ b/src/tests/mocks/apt-sources.ts
@@ -18,7 +18,7 @@ export const aptSources = [
       "repo-profile-9",
       "repo-profile-10",
       "repo-profile-11",
-      "repo-profile-12",
+      "repo-profile-12"
     ] as string[],
   },
   {
@@ -53,4 +53,66 @@ export const aptSources = [
     name: "source5",
     profiles: [] as string[],
   },
+  {
+    id: 6,
+    access_group: "group1",
+    gpg_key: "key1",
+    line: "deb http://example.com/ubuntu focal main",
+    name: "source6",
+    profiles: ["repo-profile-1",] as string[],
+  },
+
+  {
+    id: 7,
+    access_group: "group1",
+    gpg_key: "key1",
+    line: "deb http://example.com/ubuntu focal main",
+    name: "source7",
+    profiles: ["repo-profile-1"] as string[],
+  },
+
+  {
+    id: 8,
+    access_group: "group1",
+    gpg_key: "key1",
+    line: "deb http://example.com/ubuntu focal main",
+    name: "source8",
+    profiles: ["repo-profile-1"] as string[],
+  },
+
+  {
+    id: 9,
+    access_group: "group1",
+    gpg_key: "key1",
+    line: "deb http://example.com/ubuntu focal main",
+    name: "source9",
+    profiles: ["repo-profile-1"] as string[],
+  },
+
+  {
+    id: 10,
+    access_group: "group1",
+    gpg_key: "key1",
+    line: "deb http://example.com/ubuntu focal main",
+    name: "source10",
+    profiles: ["repo-profile-1"] as string[],
+  },
+
+  {
+    id: 11,
+    access_group: "group1",
+    gpg_key: "key1",
+    line: "deb http://example.com/ubuntu focal main",
+    name: "source11",
+    profiles: ["repo-profile-1"] as string[],
+  },
+
+  {
+    id: 12,
+    access_group: "group1",
+    gpg_key: "key1",
+    line: "deb http://example.com/ubuntu focal main",
+    name: "source12",
+    profiles: ["repo-profile-1"] as string[],
+  },
 ] as const satisfies APTSource[];
diff --git a/src/tests/mocks/profiles.ts b/src/tests/mocks/profiles.ts
new file mode 100644
index 000000000..76ae07a52
--- /dev/null
+++ b/src/tests/mocks/profiles.ts
@@ -0,0 +1,31 @@
+import type { Profile } from "@/features/profiles";
+
+export const profiles = [
+  {
+    access_group: "global",
+    all_computers: false,
+    description: "first profile description",
+    id: 1,
+    name: "profile-1",
+    tags: ["tag"],
+    title: "Profile One",
+  },
+  {
+    access_group: "global",
+    all_computers: false,
+    description: "desc",
+    id: 2,
+    name: "two",
+    tags: [],
+    title: "Profile Two",
+  },
+  {
+    access_group: "global",
+    all_computers: true,
+    description: "",
+    id: 3,
+    name: "three",
+    tags: [],
+    title: "Profile Three",
+  },
+] as const satisfies Profile[];
diff --git a/src/tests/mocks/repositoryProfiles.ts b/src/tests/mocks/repositoryProfiles.ts
index 411b1bf99..08f63bfa2 100644
--- a/src/tests/mocks/repositoryProfiles.ts
+++ b/src/tests/mocks/repositoryProfiles.ts
@@ -1,4 +1,5 @@
 import type { RepositoryProfile } from "@/features/repository-profiles";
+import { aptSources } from "./apt-sources";
 
 export const repositoryProfiles = [
   {
@@ -8,7 +9,14 @@ export const repositoryProfiles = [
     description: "Test profile one",
     access_group: "global",
     all_computers: false,
-    apt_sources: [1, 2],
+    apt_sources: [
+      aptSources[0], 
+      aptSources[1], 
+      aptSources[2], 
+      aptSources[3], 
+      aptSources[4], 
+      aptSources[5]],
+    applied_count: 3,
     pockets: [],
     tags: ["web", "prod"],
     pending_count: 0,
@@ -21,6 +29,7 @@ export const repositoryProfiles = [
     access_group: "global",
     all_computers: true,
     apt_sources: [],
+    applied_count: 0,
     pockets: [],
     tags: [],
     pending_count: 0,
@@ -32,7 +41,8 @@ export const repositoryProfiles = [
     description: "Test profile one",
     access_group: "global",
     all_computers: false,
-    apt_sources: [1],
+    apt_sources: [aptSources[0]],
+    applied_count: 0,
     pockets: [],
     tags: ["web", "prod"],
     pending_count: 0,
@@ -44,7 +54,8 @@ export const repositoryProfiles = [
     description: "Test profile one",
     access_group: "global",
     all_computers: false,
-    apt_sources: [1],
+    apt_sources: [aptSources[0]],
+    applied_count: 0,
     pockets: [],
     tags: ["web", "prod"],
     pending_count: 0,
@@ -56,7 +67,8 @@ export const repositoryProfiles = [
     description: "Test profile one",
     access_group: "global",
     all_computers: false,
-    apt_sources: [1],
+    apt_sources: [aptSources[0]],
+    applied_count: 0,
     pockets: [],
     tags: ["web", "prod"],
     pending_count: 0,
@@ -68,7 +80,8 @@ export const repositoryProfiles = [
     description: "Test profile one",
     access_group: "global",
     all_computers: false,
-    apt_sources: [1],
+    apt_sources: [aptSources[0]],
+    applied_count: 0,
     pockets: [],
     tags: ["web", "prod"],
     pending_count: 0,
@@ -80,7 +93,8 @@ export const repositoryProfiles = [
     description: "Test profile one",
     access_group: "global",
     all_computers: false,
-    apt_sources: [1],
+    apt_sources: [aptSources[0]],
+    applied_count: 0,
     pockets: [],
     tags: ["web", "prod"],
     pending_count: 0,
@@ -92,7 +106,8 @@ export const repositoryProfiles = [
     description: "Test profile one",
     access_group: "global",
     all_computers: false,
-    apt_sources: [1],
+    apt_sources: [aptSources[0]],
+    applied_count: 0,
     pockets: [],
     tags: ["web", "prod"],
     pending_count: 0,
@@ -104,7 +119,8 @@ export const repositoryProfiles = [
     description: "Test profile one",
     access_group: "global",
     all_computers: false,
-    apt_sources: [1],
+    apt_sources: [aptSources[0]],
+    applied_count: 0,
     pockets: [],
     tags: ["web", "prod"],
     pending_count: 0,
@@ -116,7 +132,8 @@ export const repositoryProfiles = [
     description: "Test profile one",
     access_group: "global",
     all_computers: false,
-    apt_sources: [1],
+    apt_sources: [aptSources[0]],
+    applied_count: 0,
     pockets: [],
     tags: ["web", "prod"],
     pending_count: 0,
@@ -128,7 +145,8 @@ export const repositoryProfiles = [
     description: "Test profile one",
     access_group: "global",
     all_computers: false,
-    apt_sources: [1],
+    apt_sources: [aptSources[0]],
+    applied_count: 0,
     pockets: [],
     tags: ["web", "prod"],
     pending_count: 0,
@@ -140,7 +158,8 @@ export const repositoryProfiles = [
     description: "Test profile one",
     access_group: "global",
     all_computers: false,
-    apt_sources: [1],
+    apt_sources: [aptSources[0]],
+    applied_count: 0,
     pockets: [],
     tags: ["web", "prod"],
     pending_count: 0,
diff --git a/src/tests/server/handlers/instance.ts b/src/tests/server/handlers/instance.ts
index 9d7554a20..d7b7f5974 100644
--- a/src/tests/server/handlers/instance.ts
+++ b/src/tests/server/handlers/instance.ts
@@ -94,6 +94,16 @@ export default [
         );
       }
 
+      if (query.includes("profile:repository:")) {
+        return HttpResponse.json(
+          generatePaginatedResponse<Instance>({
+            data: instances.slice(0, 2),
+            limit,
+            offset,
+          }),
+        );
+      }
+
       return HttpResponse.json(
         generatePaginatedResponse<Instance>({
           data: instances,
diff --git a/src/tests/server/handlers/repositoryProfiles.ts b/src/tests/server/handlers/repositoryProfiles.ts
index 42bf2bac1..4625f7d63 100644
--- a/src/tests/server/handlers/repositoryProfiles.ts
+++ b/src/tests/server/handlers/repositoryProfiles.ts
@@ -1,8 +1,11 @@
-import { API_URL } from "@/constants";
+import { API_URL, API_URL_OLD } from "@/constants";
 import { getEndpointStatus } from "@/tests/controllers/controller";
 import { repositoryProfiles } from "@/tests/mocks/repositoryProfiles";
+import type { RepositoryProfile } from "@/features/repository-profiles";
+import type { APTSource } from "@/features/apt-sources";
 import { http, HttpResponse } from "msw";
-import { generatePaginatedResponse } from "./_helpers";
+import { getEndpointStatusApiError } from "./_constants";
+import { generatePaginatedResponse, isAction } from "./_helpers";
 
 export default [
   http.get(`${API_URL}repositoryprofiles`, ({ request }) => {
@@ -14,6 +17,15 @@ export default [
       throw new HttpResponse(null, { status: 500 });
     }
 
+    if (
+      endpointStatus.status === "empty" &&
+      (!endpointStatus.path || endpointStatus.path === "repositoryprofiles")
+    ) {
+      return HttpResponse.json(
+        generatePaginatedResponse({ data: [], limit: 20, offset: 0 }),
+      );
+    }
+
     const { searchParams } = new URL(request.url);
 
     const names =
@@ -35,6 +47,65 @@ export default [
   }),
 
   http.post(`${API_URL}repositoryprofiles`, async () => {
+    const endpointStatus = getEndpointStatus();
+    if (
+      endpointStatus.status === "error" &&
+      (!endpointStatus.path || endpointStatus.path === "repositoryprofiles")
+    ) {
+      throw getEndpointStatusApiError();
+    }
     return HttpResponse.json(repositoryProfiles[0], { status: 201 });
   }),
+
+  http.put(`${API_URL}repositoryprofiles/:name`, async ({ params, request }) => {
+    type PutBody = Omit<Partial<RepositoryProfile>, "apt_sources"> & {
+      add_apt_sources?: { name: string; line: string; gpg_key: { content: string } | null }[];
+      remove_apt_sources?: number[];
+    };
+    const body = (await request.json()) as PutBody;
+    const profile = repositoryProfiles.find((p) => p.name === params.name);
+    if (!profile) {
+      return new HttpResponse(null, { status: 404 });
+    }
+
+    const { add_apt_sources, remove_apt_sources, ...rest } = body;
+
+    let updatedSources: APTSource[] = profile.apt_sources ?? [];
+    if (remove_apt_sources?.length) {
+      updatedSources = updatedSources.filter((s) => !remove_apt_sources.includes(s.id));
+    }
+    if (add_apt_sources?.length) {
+      const maxId = Math.max(0, ...updatedSources.map((s) => s.id));
+      const newSources: APTSource[] = add_apt_sources.map((s, i) => ({
+        id: maxId + i + 1,
+        name: s.name,
+        line: s.line,
+        gpg_key: s.gpg_key ? s.gpg_key.content : null,
+        access_group: profile.access_group,
+        profiles: [profile.name],
+      }));
+      updatedSources = [...updatedSources, ...newSources];
+    }
+
+    Object.assign(profile, { ...rest, apt_sources: updatedSources });
+
+    return HttpResponse.json(profile, { status: 200 });
+  }),
+
+  http.get(API_URL_OLD, ({ request }) => {
+    if (!isAction(request, "RemoveRepositoryProfile")) {
+      return;
+    }
+
+    const endpointStatus = getEndpointStatus();
+    if (
+      endpointStatus.status === "error" &&
+      (!endpointStatus.path || endpointStatus.path === "RemoveRepositoryProfile")
+    ) {
+      throw getEndpointStatusApiError();
+    }
+
+    return HttpResponse.json({ id: 1 }, { status: 200 });
+  }),
 ];
+

From 4522eb491c5714fbd127dce274b32a79719b53f3 Mon Sep 17 00:00:00 2001
From: Marc Bucchieri <marc.bucchieri@canonical.com>
Date: Mon, 27 Apr 2026 15:36:28 -0700
Subject: [PATCH 32/42] feat: add publication targets page (#548)

## Summary

Created new page at /repositories/publication-targets with UI matching
the design file. Since no API endpoints exist yet all
/publicationTargets and /publications endpoints should be mocked.
PublicationsTable will need to be updated with links to individual
publications and sources once those pages are added. Leaving as a draft
so we can decide whether to merge in to deb-archive now or wait for
those changes.

## Release Impact

According to the [Landscape Server Release
Cycle](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `dev` / `main` (Beta)
- **Version Impact**:
  - [ ] Patch (Fix)
  - [X] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [X] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [X] **UI Verified**: I have verified the changes locally.
- [X] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.

---------

Co-authored-by: Rubin Aga <rubin.aga@canonical.com>
Co-authored-by: Copilot <copilot@github.com>
---
 .changeset/bold-loops-retire.md               |     5 +
 .github/feature-plans/debarchive-seed-data.md |   187 +
 .../publication-links-per-target.md           |   105 +
 .github/feature-plans/publication-targets.md  |   694 +
 .github/feature-plans/publications-context.md |   455 +
 .../targets-with-publications.md              |   289 +
 .github/prompts/architect.prompt.md           |    20 +
 AGENTS.md                                     |     9 +
 package-lock.json                             | 13179 ++++++++++++++++
 package.json                                  |     4 +-
 pnpm-lock.yaml                                |    20 +-
 src/api/fetchDebArchive.tsx                   |     4 +-
 .../form/ReadOnlyField/ReadOnlyField.tsx      |    16 +-
 src/components/layout/Blocks/Item/Item.tsx    |    32 +-
 .../PublishLocalRepositoryGuard.tsx           |     2 +-
 .../PublishRepositoryNewForm.tsx              |     2 +-
 src/features/publication-targets/api/index.ts |     5 +
 .../api/useCreatePublicationTarget.ts         |    36 +
 .../api/useEditPublicationTarget.ts           |    37 +
 .../api/useGetPublicationTargets.ts           |    50 +-
 .../api/useGetPublicationsByTarget.ts         |    50 +
 .../api/useRemovePublicationTarget.ts         |    31 +
 .../AddPublicationTargetForm.test.tsx         |   129 +
 .../AddPublicationTargetForm.tsx              |   171 +
 .../AddPublicationTargetForm/constants.ts     |    29 +
 .../AddPublicationTargetForm/index.ts         |     1 +
 .../EditTargetForm/EditTargetForm.test.tsx    |   158 +
 .../EditTargetForm/EditTargetForm.tsx         |   213 +
 .../components/EditTargetForm/index.ts        |     1 +
 .../PublicationTargetAddButton.test.tsx       |    38 +
 .../PublicationTargetAddButton.tsx            |    18 +
 .../PublicationTargetAddButton/index.ts       |     1 +
 .../PublicationTargetContainer.test.tsx       |    66 +
 .../PublicationTargetContainer.tsx            |    43 +
 .../PublicationTargetContainer/index.ts       |     1 +
 ...PublicationTargetList.integration.test.tsx |    15 +
 .../PublicationTargetList.test.tsx            |   205 +
 .../PublicationTargetList.tsx                 |   125 +
 .../components/PublicationTargetList/index.ts |     1 +
 .../PublicationTargetListActions.test.tsx     |   181 +
 .../PublicationTargetListActions.tsx          |    78 +
 .../PublicationTargetListActions/index.ts     |     1 +
 .../PublicationsTable/LocalLink/LocalLink.tsx |    22 +
 .../MirrorLink/MirrorLink.tsx                 |    22 +
 .../PublicationLink/PublicationLink.tsx       |    23 +
 .../PublicationsTable.test.tsx                |   213 +
 .../PublicationsTable/PublicationsTable.tsx   |    94 +
 .../RemoveTargetForm.test.tsx                 |   228 +
 .../RemoveTargetForm/RemoveTargetModal.tsx    |    85 +
 .../components/RemoveTargetForm/index.ts      |     1 +
 .../TargetDetails/TargetDetails.test.tsx      |   240 +
 .../TargetDetails/TargetDetails.tsx           |   114 +
 .../components/TargetDetails/index.ts         |     1 +
 src/features/publication-targets/index.ts     |    21 +-
 .../publication-targets/types/Publication.ts  |     3 +
 .../types/PublicationTarget.ts                |    10 +-
 .../publication-targets/types/index.ts        |     6 +
 src/features/publications/api/index.ts        |     1 +
 .../publications/api/useGetPagePublication.ts |    30 +
 .../publications/api/useGetPublications.ts    |     5 +
 .../publications/api/useUpdatePublication.ts  |    34 +
 .../AddPublicationButton.tsx                  |    19 +-
 .../AddPublicationForm/AddPublicationForm.tsx |    25 +-
 .../PublicationDetails.test.tsx               |     3 +-
 .../PublicationsList.test.tsx                 |    23 +-
 src/features/publications/index.ts            |    14 +-
 .../RepositoryProfileEditForm.test.tsx        |    22 +-
 src/libs/pageParamsManager/constants.ts       |     5 +
 src/libs/pageParamsManager/types.ts           |     1 +
 .../PublicationTargetsPage.test.tsx           |    53 +
 .../PublicationTargetsPage.tsx                |   123 +-
 .../publications/PublicationsPage.tsx         |    16 +-
 src/routes/DashboardRoutes.tsx                |    27 +-
 src/tests/browser.ts                          |     8 +-
 src/tests/mocks/publicationTargets.ts         |    46 +
 src/tests/mocks/publications.ts               |    63 +-
 src/tests/server/handlers/index.ts            |     2 +
 .../server/handlers/publicationTargets.ts     |    55 +
 src/tests/server/handlers/publications.ts     |     3 +-
 vite.config.ts                                |    11 +-
 80 files changed, 18119 insertions(+), 260 deletions(-)
 create mode 100644 .changeset/bold-loops-retire.md
 create mode 100644 .github/feature-plans/debarchive-seed-data.md
 create mode 100644 .github/feature-plans/publication-links-per-target.md
 create mode 100644 .github/feature-plans/publication-targets.md
 create mode 100644 .github/feature-plans/publications-context.md
 create mode 100644 .github/feature-plans/targets-with-publications.md
 create mode 100644 .github/prompts/architect.prompt.md
 create mode 100644 package-lock.json
 create mode 100644 src/features/publication-targets/api/index.ts
 create mode 100644 src/features/publication-targets/api/useCreatePublicationTarget.ts
 create mode 100644 src/features/publication-targets/api/useEditPublicationTarget.ts
 create mode 100644 src/features/publication-targets/api/useGetPublicationsByTarget.ts
 create mode 100644 src/features/publication-targets/api/useRemovePublicationTarget.ts
 create mode 100644 src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.test.tsx
 create mode 100644 src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.tsx
 create mode 100644 src/features/publication-targets/components/AddPublicationTargetForm/constants.ts
 create mode 100644 src/features/publication-targets/components/AddPublicationTargetForm/index.ts
 create mode 100644 src/features/publication-targets/components/EditTargetForm/EditTargetForm.test.tsx
 create mode 100644 src/features/publication-targets/components/EditTargetForm/EditTargetForm.tsx
 create mode 100644 src/features/publication-targets/components/EditTargetForm/index.ts
 create mode 100644 src/features/publication-targets/components/PublicationTargetAddButton/PublicationTargetAddButton.test.tsx
 create mode 100644 src/features/publication-targets/components/PublicationTargetAddButton/PublicationTargetAddButton.tsx
 create mode 100644 src/features/publication-targets/components/PublicationTargetAddButton/index.ts
 create mode 100644 src/features/publication-targets/components/PublicationTargetContainer/PublicationTargetContainer.test.tsx
 create mode 100644 src/features/publication-targets/components/PublicationTargetContainer/PublicationTargetContainer.tsx
 create mode 100644 src/features/publication-targets/components/PublicationTargetContainer/index.ts
 create mode 100644 src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.integration.test.tsx
 create mode 100644 src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.test.tsx
 create mode 100644 src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.tsx
 create mode 100644 src/features/publication-targets/components/PublicationTargetList/index.ts
 create mode 100644 src/features/publication-targets/components/PublicationTargetListActions/PublicationTargetListActions.test.tsx
 create mode 100644 src/features/publication-targets/components/PublicationTargetListActions/PublicationTargetListActions.tsx
 create mode 100644 src/features/publication-targets/components/PublicationTargetListActions/index.ts
 create mode 100644 src/features/publication-targets/components/PublicationsTable/LocalLink/LocalLink.tsx
 create mode 100644 src/features/publication-targets/components/PublicationsTable/MirrorLink/MirrorLink.tsx
 create mode 100644 src/features/publication-targets/components/PublicationsTable/PublicationLink/PublicationLink.tsx
 create mode 100644 src/features/publication-targets/components/PublicationsTable/PublicationsTable.test.tsx
 create mode 100644 src/features/publication-targets/components/PublicationsTable/PublicationsTable.tsx
 create mode 100644 src/features/publication-targets/components/RemoveTargetForm/RemoveTargetForm.test.tsx
 create mode 100644 src/features/publication-targets/components/RemoveTargetForm/RemoveTargetModal.tsx
 create mode 100644 src/features/publication-targets/components/RemoveTargetForm/index.ts
 create mode 100644 src/features/publication-targets/components/TargetDetails/TargetDetails.test.tsx
 create mode 100644 src/features/publication-targets/components/TargetDetails/TargetDetails.tsx
 create mode 100644 src/features/publication-targets/components/TargetDetails/index.ts
 create mode 100644 src/features/publication-targets/types/Publication.ts
 create mode 100644 src/features/publication-targets/types/index.ts
 create mode 100644 src/features/publications/api/useGetPagePublication.ts
 create mode 100644 src/features/publications/api/useUpdatePublication.ts
 create mode 100644 src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.test.tsx
 create mode 100644 src/tests/mocks/publicationTargets.ts
 create mode 100644 src/tests/server/handlers/publicationTargets.ts

diff --git a/.changeset/bold-loops-retire.md b/.changeset/bold-loops-retire.md
new file mode 100644
index 000000000..0065dab1b
--- /dev/null
+++ b/.changeset/bold-loops-retire.md
@@ -0,0 +1,5 @@
+---
+"landscape-ui": minor
+---
+
+Added publication targets page with associated types, hooks, and tests. Blocked from merging with main until API endpoints are added. Will also need updates to PublicationsTable.tsx with source and publication links once those pages have been merged in.
diff --git a/.github/feature-plans/debarchive-seed-data.md b/.github/feature-plans/debarchive-seed-data.md
new file mode 100644
index 000000000..465399534
--- /dev/null
+++ b/.github/feature-plans/debarchive-seed-data.md
@@ -0,0 +1,187 @@
+# Feature Plan: debarchive Sample Data Seeding
+
+**Date:** 2026-04-15  
+**Scope:** `landscape-packaging/docker/ui-dev/` (Docker Compose environment)  
+**Goal:** Populate the debarchive service with realistic sample data (publication targets, mirrors, locals, publications) on first `docker compose up`, so landscape-ui development renders meaningfully without manual API calls.
+
+---
+
+## Recommendation: Single-service seeder using the Connect RPC API
+
+### Why not `postgres-init/` SQL?
+
+`postgres-init/` runs exactly once (on first volume creation) and before any service is healthy. It works for DDL (creating the database — see `02-debarchive.sql`). For DML seeding it has critical drawbacks here:
+
+| Problem | Detail |
+|---|---|
+| Aptly-managed tables | `mirror_aptly`, `local_repository_aptly`, `published_repo_aptly` contain aptly's internal binary/JSON serialisation. Raw SQL cannot produce correct values without reimplementing aptly's encoding. |
+| Foreign-key ordering | Publications reference mirrors/locals by aptly-internal UUID linkage, not just a simple FK. The API enforces this; SQL does not. |
+| No idempotency | Re-running after a DB wipe requires manual intervention; a service can check before inserting. |
+
+The `publication_target` table is simple (UUID + JSONB blob), so it _could_ be seeded via SQL. But seeding it in one place while other entities go through the API creates split ownership with no gain.
+
+### Why the seeder service pattern?
+
+The `builder` service in `compose.yaml` is the established precedent for one-shot initialisation containers. It:
+- Declares `depends_on` with `condition: service_completed_successfully`
+- Exits 0 on success, which downstream `depends_on` respect
+- Is cheap (no long-running process)
+
+A `debarchive-seeder` service follows the same pattern and calls the debarchive Connect RPC API via `curl` after the debarchive container is healthy.
+
+---
+
+## Implementation Steps
+
+### Step 1 — Create the seeder shell script
+
+**File:** `docker/ui-dev/debarchive-seed.sh`
+
+The script must be idempotent. Check `ListPublicationTargets`; if the response already contains items, exit 0 immediately (avoids duplicate data after a restart without a full volume wipe).
+
+**Logical flow:**
+```
+1. Wait-for-debarchive (already handled by depends_on: service_healthy)
+2. GET ListPublicationTargets → if count > 0 → exit 0 (already seeded)
+3. CreatePublicationTarget × 3 (two S3, one Swift) → capture returned IDs
+4. CreateMirror × 3 (Ubuntu noble, Ubuntu jammy, a PPA) → capture returned IDs
+5. CreateLocal × 2 (noble-local, jammy-local) → capture returned IDs
+6. CreatePublication × ~6 (pair each mirror/local with a publication target) → done
+```
+
+**Connect RPC JSON wire format** (unary):
+```bash
+curl -s -X POST "http://landscape-debarchive:8000/${SERVICE_PATH}/${METHOD}" \
+  -H "Content-Type: application/connect+json" \
+  -d "${JSON_BODY}"
+```
+
+Service paths follow the proto package: `canonical.landscape.debarchive.v1.PublicationTargetService`, etc.
+
+**Sample entities to create:**
+
+*Publication Targets:*
+| displayName | type | region/container |
+|---|---|---|
+| `Dev S3 Bucket` | S3 | `us-east-1` / `landscape-dev-packages` |
+| `Staging S3 Bucket` | S3 | `eu-west-1` / `landscape-staging-packages` |
+| `Swift Store` | Swift | container: `landscape-archive` |
+
+*Mirrors:*
+| displayName | archiveRoot | distribution | components | architectures |
+|---|---|---|---|---|
+| `Ubuntu Noble Main` | `http://archive.ubuntu.com/ubuntu` | `noble` | `["main","restricted"]` | `["amd64","arm64"]` |
+| `Ubuntu Jammy Main` | `http://archive.ubuntu.com/ubuntu` | `jammy` | `["main","universe"]` | `["amd64"]` |
+| `Landscape PPA` | `https://ppa.launchpadcontent.net/landscape/landscape-client/ubuntu` | `noble` | `["main"]` | `["amd64","arm64"]` |
+
+*Locals:*
+| displayName | defaultDistribution | defaultComponent |
+|---|---|---|
+| `Noble Internal` | `noble` | `main` |
+| `Jammy Internal` | `jammy` | `main` |
+
+*Publications (mirror each source to a target):*
+| publicationTarget | source | distribution | component |
+|---|---|---|---|
+| `Dev S3 Bucket` | noble mirror | `noble` | `main` |
+| `Dev S3 Bucket` | jammy mirror | `jammy` | `main` |
+| `Staging S3 Bucket` | noble mirror | `noble` | `main` |
+| `Dev S3 Bucket` | noble local | `noble` | `main` |
+| `Dev S3 Bucket` | jammy local | `jammy` | `main` |
+| `Swift Store` | Landscape PPA mirror | `noble` | `main` |
+
+---
+
+### Step 2 — Add the Dockerfile for the seeder
+
+**File:** `docker/ui-dev/Dockerfile.debarchive-seed`
+
+```dockerfile
+FROM ubuntu:24.04
+RUN apt-get update && apt-get install -y --no-install-recommends curl jq && rm -rf /var/lib/apt/lists/*
+COPY debarchive-seed.sh /seed.sh
+RUN chmod +x /seed.sh
+CMD ["/seed.sh"]
+```
+
+Using `ubuntu:24.04` with `curl` + `jq` is sufficient. No Go toolchain required. `jq` makes parsing returned IDs from JSON responses straightforward.
+
+---
+
+### Step 3 — Add the seeder service to compose.yaml
+
+**File:** `docker/ui-dev/compose.yaml`
+
+Add after the `debarchive` service:
+
+```yaml
+  debarchive-seeder:
+    build:
+      context: .
+      dockerfile: Dockerfile.debarchive-seed
+    container_name: landscape-debarchive-seeder
+    restart: "no"
+    depends_on:
+      debarchive:
+        condition: service_healthy
+    networks:
+      - landscape-net
+```
+
+No env_file needed — the script targets the internal Docker hostname `landscape-debarchive:8000` directly.
+
+---
+
+### Step 4 — Make the debarchive service health-checkable
+
+The `debarchive` service in `compose.yaml` currently has no `healthcheck`. The seeder's `depends_on: condition: service_healthy` requires one.
+
+Add to the `debarchive` service:
+```yaml
+    healthcheck:
+      test: ["CMD-SHELL", "curl -sf -I http://localhost:8000/ || exit 1"]
+      interval: 5s
+      timeout: 3s
+      retries: 10
+      start_period: 15s
+```
+
+The health endpoint is `HEAD /` (root) — `mux.HandleFunc("HEAD /{$}", handlers.HealthCheck)` in `routes/routes.go`. Use `-I` to send HEAD.
+
+---
+
+### Step 5 — Optional: Makefile target
+
+In `docker/ui-dev/Makefile`, add:
+
+```makefile
+seed-debarchive: ## Re-run the debarchive seeder (useful after a data wipe)
+	docker compose run --rm debarchive-seeder
+```
+
+---
+
+## File Checklist
+
+| File | Action |
+|---|---|
+| `docker/ui-dev/debarchive-seed.sh` | Create — idempotent seeder script |
+| `docker/ui-dev/Dockerfile.debarchive-seed` | Create — ubuntu:24.04 + curl + jq |
+| `docker/ui-dev/compose.yaml` | Modify — add `debarchive-seeder` service + healthcheck on `debarchive` |
+| `docker/ui-dev/Makefile` | Modify — add `seed-debarchive` target (optional) |
+
+---
+
+## Pre-flight Questions — Resolved
+
+1. **Health check path:** `HEAD /` (root). Route: `mux.HandleFunc("HEAD /{$}", handlers.HealthCheck)` in `routes/routes.go`. Healthcheck test: `curl -sf -I http://localhost:8000/ || exit 1`.
+2. **Connect RPC wire format:** `application/connect+json` on **port 8000** is correct. URL path: `POST /canonical.landscape.debarchive.v1.{ServiceName}/{MethodName}`. The gRPC-gateway routes are on a separate mux (port 8001).
+3. **`CreateMirror` side-effects:** None. `CreateMirror` returns immediately with the mirror in `idle` status. No background task is triggered. `CreatePublication` only checks that the mirror exists — it does not require a prior sync. The seeder can call `CreatePublication` directly after `CreateMirror`.
+4. **Publications with no published data:** `CreatePublication` is valid with an unsynced mirror. The UI renders "not published" state gracefully (confirmed by product owner).
+
+---
+
+## Non-Goals
+
+- This plan does not seed GPG keys, snapshots, or package data — those require external artefacts and are not needed for UI component rendering.
+- This plan does not modify `landscape-server`'s seeding mechanism (`uv run schema`). The two services are independent.
diff --git a/.github/feature-plans/publication-links-per-target.md b/.github/feature-plans/publication-links-per-target.md
new file mode 100644
index 000000000..394247e14
--- /dev/null
+++ b/.github/feature-plans/publication-links-per-target.md
@@ -0,0 +1,105 @@
+# Feature Plan: `publication-links-per-target`
+
+## 1. Feature Overview
+
+- **Objective:** In `PublicationsTable` (rendered inside `PublicationTargetContainer` on the publication-targets page), each publication's label cell should link to `/repositories/publications` and automatically open the `PublicationDetails` side panel for that publication.
+- **Reference pattern:** `PackageProfilesPage` + `PackageProfileDetailsSidePanel` (`src/pages/dashboard/profiles/package-profiles/`).
+
+---
+
+## 2. URL Pattern
+
+```
+/repositories/publications?sidePath=view&profile=<publication-name>
+```
+
+`sidePath` and `profile` already exist in `PageParams`. No changes to `types.d.ts` or `constants.ts`.
+
+---
+
+## 3. Changes
+
+### 3a. `PublicationsTable` — label cell → cross-page `<Link>`
+
+**File:** `src/features/publication-targets/components/PublicationsTable/PublicationsTable.tsx`
+
+Replace the plain `{ accessor: "label" }` shorthand with a `Cell` renderer using a React Router `<Link>` to `ROUTES.repositories.publications({ sidePath: ["view"], profile: row.original.name })`. Link text: `row.original.label ?? row.original.name`.
+
+### 3b. `PublicationsList` — `setSidePanelContent` → URL params
+
+**File:** `src/features/publications/components/PublicationsList/PublicationsList.tsx`
+
+Replace `openPublicationDetails` with `createPageParamsSetter({ sidePath: ["view"], profile: row.original.name })`. Remove: `useSidePanel`, `PublicationDetails` import, `useCallback`.
+
+### 3c. `PublicationsListActions` — "View details" action → URL params
+
+**File:** `src/features/publications/components/PublicationsListActions/PublicationsListActions.tsx`
+
+Replace `handlePublicationDetails` with `createPageParamsSetter({ sidePath: ["view"], profile: publication.name })`. Remove: `useSidePanel`, `PublicationDetails` import.
+
+### 3d. `PublicationsPage` — add `<SidePanel>` driven by `sidePath`
+
+**File:** `src/pages/dashboard/repositories/publications/PublicationsPage.tsx`
+
+Add `<SidePanel isOpen={!!sidePath.length} onClose={createPageParamsSetter({ sidePath: [], profile: "" })}>` with `lastSidePathSegment === "view"` rendering `<PublicationDetailsSidePanel />` (lazy). Add `useSetDynamicFilterValidation("sidePath", ["view"])`.
+
+### 3e. `PublicationDetailsSidePanel` — URL-aware wrapper *(new)*
+
+**File:** `src/features/publications/components/PublicationDetailsSidePanel/PublicationDetailsSidePanel.tsx`
+
+Calls `useGetPagePublication()`. Renders `<SidePanel.LoadingState />` while loading, `<PublicationDetails publication={publication} />` when loaded. If `publication` is undefined after loading, render an appropriate empty/error state.
+
+Export from `src/features/publications/index.ts`.
+
+---
+
+## 4. New API Hook
+
+**File:** `src/features/publications/api/useGetPagePublication.ts`
+
+```ts
+export default function useGetPagePublication(): {
+  publication: Publication | undefined;
+  isGettingPublication: boolean;
+}
+// const { profile: publicationName } = usePageParams();
+// return useGetPublication({ publicationName });
+```
+
+---
+
+## 5. Testing
+
+### `PublicationsTable.test.tsx`
+- Assert each label cell renders an `<a>` whose `href` contains `sidePath=view&profile=<name>`.
+
+### `PublicationsList.test.tsx`
+- Replace assertions on `setSidePanelContent`. Assert clicking a name sets URL to `?sidePath=view&profile=<name>`.
+
+### `PublicationsListActions.test.tsx`
+- Update `"opens details side panel from menu"` — assert clicking "View details" sets URL to `?sidePath=view&profile=<name>` instead of asserting a panel heading appears.
+
+### `PublicationsPage.test.tsx`
+- Panel renders when URL has `?sidePath=view&profile=<name>`.
+- Panel is closed by default (no `sidePath`).
+- Closing calls `createPageParamsSetter` clearing both params.
+
+### `PublicationDetailsSidePanel.test.tsx`
+- Renders `PublicationDetails` when publication is loaded.
+- Renders loading state while `isGettingPublication` is true.
+
+No new MSW handlers needed.
+
+---
+
+## 6. Files Summary
+
+| File | Change |
+|------|--------|
+| `src/features/publication-targets/components/PublicationsTable/PublicationsTable.tsx` | Label column → `<Link>` Cell renderer |
+| `src/features/publications/components/PublicationsList/PublicationsList.tsx` | `setSidePanelContent` → `createPageParamsSetter` |
+| `src/features/publications/components/PublicationsListActions/PublicationsListActions.tsx` | `setSidePanelContent` → `createPageParamsSetter` |
+| `src/features/publications/api/useGetPagePublication.ts` | **New** |
+| `src/features/publications/components/PublicationDetailsSidePanel/PublicationDetailsSidePanel.tsx` | **New** |
+| `src/features/publications/index.ts` | Export `PublicationDetailsSidePanel` |
+| `src/pages/dashboard/repositories/publications/PublicationsPage.tsx` | Add `<SidePanel>` with `sidePath` routing |
diff --git a/.github/feature-plans/publication-targets.md b/.github/feature-plans/publication-targets.md
new file mode 100644
index 000000000..df4daf619
--- /dev/null
+++ b/.github/feature-plans/publication-targets.md
@@ -0,0 +1,694 @@
+# Implementation Plan: `publication-targets`
+
+## 1. Feature Overview
+
+- **Objective:** Add a Publication Targets page nested under the Repositories section, enabling users to list, create, edit, and delete publication targets (S3 or Swift storage destinations). Routes to `/repositories/publication-targets` using the existing `REPOSITORIES_ROUTES.publicationTargets` route.
+- **Location:** `src/features/publication-targets/`
+
+> **Status:** Core implementation is complete. The page is functional with list, add, edit, remove, and details flows. Swift edit support is pending (EditTargetForm is currently S3-only).
+
+---
+
+## 2. API Design
+
+The backend is a Connect-RPC (gRPC-JSON transcoding) service. All calls go through the v2 API base URL (`VITE_API_URL` → `/api/v2/`). Endpoint paths follow the resource name pattern `publicationTargets/{id}`.
+
+### Endpoints
+
+Proto HTTP transcoding (`body: "publication_target"`) means POST and PATCH bodies are the `PublicationTarget` message directly — **not** nested under a wrapper key.
+
+| Method | Path | Body | Purpose |
+|---|---|---|---|
+| `GET` | `publicationTargets` | — | List all publication targets (response includes embedded publications via `PublicationTargetWithPublications`) |
+| `POST` | `publicationTargets` | `PublicationTarget` fields (flat) | Create a new publication target |
+| `GET` | `publicationTargets/{id}` | — | Get a single publication target |
+| `PATCH` | `publicationTargets/{id}` | `PublicationTarget` fields + `name` (flat) | Update a publication target |
+| `DELETE` | `publicationTargets/{id}` | — | Delete a publication target |
+
+`{id}` is the UUID segment of the resource `name` (e.g. `name = "publicationTargets/uuid"` → path `publicationTargets/uuid`).
+
+> **Note:** There is no separate `GET publications` endpoint usage. Publications are embedded in the `GET publicationTargets` response as `publications: Publication[]` on each target object. The `PublicationTargetWithPublications` extends `PublicationTarget` with this field.
+
+### TypeScript Interfaces (`src/features/publication-targets/types/`)
+
+**`PublicationTarget.d.ts`**
+```ts
+export interface S3Target {
+  region: string;
+  bucket: string;
+  endpoint?: string;
+  aws_access_key_id: string;
+  aws_secret_access_key: string;
+  prefix?: string;
+  acl?: string;
+  storage_class?: string;
+  encryption_method?: string;
+  plus_workaround?: boolean;
+  disable_multi_del?: boolean;
+  force_sig_v2?: boolean;
+  debug?: boolean;
+}
+
+export interface SwiftTarget {
+  container: string;
+  username: string;
+  password: string;
+  prefix?: string;
+  auth_url?: string;
+  tenant?: string;
+  tenant_id?: string;
+  domain?: string;
+  domain_id?: string;
+  tenant_domain?: string;
+  tenant_domain_id?: string;
+}
+
+export interface PublicationTarget extends Record<string, unknown> {
+  name: string;                      // e.g. "publicationTargets/{uuid}"
+  publication_target_id: string;     // UUID
+  display_name: string;
+  s3?: S3Target;
+  swift?: SwiftTarget;
+}
+```
+
+**`Publication.d.ts`**
+```ts
+import type { PublicationTarget } from "./PublicationTarget";
+
+export interface Publication extends Record<string, unknown> {
+  name: string;
+  publication_id: string;
+  display_name: string;
+  publication_target: string;  // resource name, e.g. "publicationTargets/{uuid}"
+  mirror?: string;             // resource name of the source mirror
+  distribution?: string;
+}
+
+export interface PublicationTargetWithPublications extends PublicationTarget {
+  publications: Publication[];
+}
+```
+
+### Hooks (`src/features/publication-targets/hooks/`)
+
+**[Implemented] `usePublicationTargets` (`usePublicationTargets.tsx`)**  
+Main consolidated CRUD hook using the `QueryFnType` pattern (same pattern as `useRepositoryProfiles`). Returned queries/mutations:
+
+- `getPublicationTargetsQuery(params?, config?)` — `GET publicationTargets`; response: `{ publication_targets: PublicationTargetWithPublications[] }`
+- `createPublicationTargetQuery` — `POST publicationTargets`; body: flat `PublicationTarget` fields
+- `editPublicationTargetQuery` — `PATCH publicationTargets/{name}`; body: flat fields including `name`
+- `removePublicationTargetQuery` — `DELETE publicationTargets/{name}`
+
+All mutations invalidate `["publicationTargets"]` on success.
+
+> **Note:** There is no `useGetPublications` hook. Publications are embedded in the target response and typed via `PublicationTargetWithPublications`.
+
+---
+
+## 3. Component Hierarchy
+
+```
+src/features/publication-targets/
+├── hooks/
+│   ├── index.ts                                 # exports usePublicationTargets
+│   ├── usePublicationTargets.tsx                # ✅ full CRUD; QueryFnType pattern
+│   ├── useGetPublicationTargets.tsx             # ⚠️  standalone simple hook (may be redundant)
+│   ├── useCreatePublicationTarget.tsx           # ⚠️  standalone mutation (may be redundant)
+│   └── useDeleteTargetModal.tsx                 # 🗑️  dead code; safe to delete
+├── components/
+│   ├── PublicationTargetContainer/
+│   │   └── PublicationTargetContainer.tsx       # ✅ Routes to empty state or PublicationTargetList
+│   ├── PublicationTargetList/
+│   │   └── PublicationTargetList.tsx            # ✅ Table; columns: Name, Type, Publications count, Actions
+│   ├── PublicationTargetListActions/
+│   │   └── PublicationTargetListActions.tsx     # ✅ 3-dot ListActions; View details / Edit / Remove
+│   ├── TargetDetails/
+│   │   └── TargetDetails.tsx                    # ✅ Side panel details view; Edit + Remove buttons at top;
+│   │                                            #    DETAILS section (InfoGrid); USED IN section (PublicationsTable)
+│   ├── PublicationsTable/
+│   │   └── PublicationsTable.tsx                # ✅ Shared table: Publication / Source / Distribution;
+│   │                                            #    optional pageSize prop enables SidePanelTablePagination
+│   ├── NewPublicationTargetForm/
+│   │   ├── NewPublicationTargetForm.tsx         # ✅ Formik form; S3 and Swift fields
+│   │   └── constants.ts                         # ✅ INITIAL_VALUES, VALIDATION_SCHEMA
+│   ├── EditTargetForm/
+│   │   └── EditTargetForm.tsx                   # ✅ Pre-populated Formik form; ⚠️ currently S3-only
+│   ├── RemoveTargetForm/
+│   │   └── RemoveTargetForm.tsx                 # ✅ Side panel confirmation form; shows PublicationsTable
+│   │                                            #    of associated publications; Cancel + Remove buttons
+│   └── PublicationTargetAddButton/
+│       └── PublicationTargetAddButton.tsx       # ✅ Button; opens NewPublicationTargetForm in side panel
+├── types/
+│   ├── PublicationTarget.d.ts
+│   ├── Publication.d.ts                         # also defines PublicationTargetWithPublications
+│   └── index.d.ts
+└── index.ts                                     # Barrel exports
+```
+
+### Table Columns (`PublicationTargetList`)
+
+| Column | Source | Notes |
+|---|---|---|
+| Name | `display_name` | Plain text |
+| Type | derived from presence of `s3` / `swift` key | `"S3"`, `"Swift"`, or `"—"` |
+| Publications | `target.publications.length` | e.g. `"2"` from embedded array |
+| Actions | `PublicationTargetListActions` | 3-dot menu via `ListActions` component |
+
+### Actions (`PublicationTargetListActions`)
+
+All three actions open the **right-side side panel** via `setSidePanelContent` — no modals are used.
+
+| Action | Opens |
+|---|---|
+| **View details** | `TargetDetails` side panel |
+| **Edit** | `EditTargetForm` side panel |
+| **Remove** | `RemoveTargetForm` side panel |
+
+> **Design decision:** Original plan specified modals for details and removal. Implementation uses side panels exclusively for consistency with the rest of the application. `TargetDetails` also exposes Edit and Remove buttons that open the same sub-panels.
+
+### `TargetDetails` Layout
+
+1. Edit and Remove buttons (segmented control at top)
+2. `<hr />` divider
+3. **DETAILS** section via `InfoGrid` — Name in full row; S3 or Swift fields in two-column grid
+4. **USED IN** section — `PublicationsTable` (no pagination in details view; full list)
+
+### `RemoveTargetForm` Layout
+
+1. `<hr />` divider at top
+2. If target has associated publications: explanatory text + `PublicationsTable` with `pageSize={5}`
+3. Warning text ("This action is irreversible")
+4. `<hr />` divider
+5. Right-aligned button row: Cancel + Remove target (negative, delete icon)
+
+---
+
+## 4. State & Logic
+
+### Forms
+
+All forms use Formik + Yup.
+
+#### `NewPublicationTargetForm` — `INITIAL_VALUES` and `VALIDATION_SCHEMA`
+
+See `src/features/publication-targets/components/NewPublicationTargetForm/constants.ts`.
+
+Required S3 fields: `region`, `bucket`, `aws_access_key_id`, `aws_secret_access_key`.  
+Required Swift fields: `container`, `username`, `password`.
+
+#### `EditTargetForm` — current state
+
+Pre-populated from the target passed as prop. Currently **S3-only** — Swift edit fields are not yet implemented. The form submits a `PATCH` with the full S3 payload.
+
+> **Pending work:** Add Swift field support to `EditTargetForm`, matching the structure of `NewPublicationTargetForm`.
+
+### Publications Data
+
+Publications are **not fetched separately**. They arrive embedded in `GET publicationTargets` as `publications: Publication[]` on each target. `PublicationTargetWithPublications` (from `types/Publication.d.ts`) is the runtime type used throughout components.
+
+The `PublicationsPage.tsx` maps the raw response:
+```ts
+const targets = (
+  publicationTargetsResult.data?.data.publication_targets ?? []
+).map((target) => ({ ...target, publications: target.publications ?? [] }));
+```
+
+### Global Context
+
+No new context. Uses `useSidePanel()`, `useNotify()`, `useDebug()` from shared hooks.
+
+---
+
+## 5. Testing Status
+
+### MSW Handlers (`src/tests/server/handlers/publicationTargets.ts`)
+
+| Endpoint | Status |
+|---|---|
+| `GET publicationTargets` | ✅ Returns `publicationTargetsWithPublications` (3 targets; prod-s3-us-east has 3 publications) |
+| `POST publicationTargets` | ✅ Returns 201 with generated name/id |
+| `DELETE publicationTargets/:id` | ✅ Returns 204 |
+| `PATCH publicationTargets/:id` | ✅ Returns updated target body |
+
+### Mock Data (`src/tests/mocks/publication-targets.ts`)
+
+Exports:
+- `publications` — 3 `Publication` objects (Jammy, Noble, Focal), all linked to `prod-s3-us-east`
+- `publicationTargets` — 3 `PublicationTarget` objects (2 S3, 1 Swift)
+- `publicationTargetsWithPublications` — same 3 targets with embedded publications
+
+### Unit Tests
+
+| File | Status |
+|---|---|
+| `PublicationTargetListActions.test.tsx` | ✅ Exists |
+| All other component/hook tests | ❌ Not yet written |
+
+> **Pending work:** Unit tests for hooks, `PublicationTargetList`, `TargetDetails`, `NewPublicationTargetForm`, `EditTargetForm`, `RemoveTargetForm`, and `PublicationsTable`.
+
+---
+
+## 6. Routing & Navigation (Already Wired)
+
+The following are already in place and **must not be changed**:
+
+- Route path: `REPOSITORIES_PATHS.publicationTargets = "publication-targets"` in `src/libs/routes/repositories.ts`
+- Route entry: `REPOSITORIES_ROUTES.publicationTargets` (same file)
+- Lazy page load: `PublicationTargetsPage` in `src/routes/elements.tsx`
+- Dashboard route: `src/routes/DashboardRoutes.tsx`
+- Navigation link: `src/templates/dashboard/Navigation/constants.ts`
+
+---
+
+## 7. Pending Work
+
+| Item | Priority | Notes |
+|---|---|---|
+| Swift edit support in `EditTargetForm` | High | Currently S3-only; add Swift field block matching `NewPublicationTargetForm` |
+| Unit tests (all components and hooks) | High | See testing plan in original spec; `PublicationTargetListActions.test.tsx` exists |
+| Delete `useDeleteTargetModal.tsx` | Low | Dead code; replaced by `RemoveTargetForm` |
+| Consolidate/remove `useGetPublicationTargets` and `useCreatePublicationTarget` | Low | Redundant with `usePublicationTargets`; remove after confirming no references |
+
+---
+
+## 8. Implementation Notes / Decisions
+
+| Decision | Rationale |
+|---|---|
+| Side panels instead of modals for details/removal | Consistent with application-wide pattern in other features (scripts, mirrors, etc.) |
+| Publications embedded in target response | Avoids a secondary `GET publications` request; backend already returns associated publications with each target |
+| Single `usePublicationTargets` hook for all CRUD | Follows `useRepositoryProfiles` pattern; `QueryFnType` enables param passing while keeping the hook composable |
+| `PublicationsTable` shared component | Both `TargetDetails` and `RemoveTargetForm` render the same 3-column publications table; extracted to avoid duplication |
+| `PublicationTargetContainer` added | Separates data-fetching concerns from the page; mirrors pattern in other feature areas |
+
+
+---
+
+## 2. API Design
+
+The backend is a Connect-RPC (gRPC-JSON transcoding) service. All calls go through the v2 API base URL (`VITE_API_URL` → `/api/v2/`). Endpoint paths follow the resource name pattern `publicationTargets/{id}`.
+
+### Endpoints
+
+Proto HTTP transcoding (`body: "publication_target"`) means POST and PATCH bodies are the `PublicationTarget` message directly — **not** nested under a wrapper key.
+
+| Method | Path | Body | Purpose |
+|---|---|---|---|
+| `GET` | `publicationTargets` | — | List all publication targets |
+| `POST` | `publicationTargets` | `PublicationTarget` fields (flat) | Create a new publication target |
+| `GET` | `publicationTargets/{id}` | — | Get a single publication target |
+| `PATCH` | `publicationTargets/{id}` | `PublicationTarget` fields + `name` (flat) | Update a publication target |
+| `DELETE` | `publicationTargets/{id}` | — | Delete a publication target |
+
+`{id}` is the UUID segment of the resource `name` (e.g. `name = "publicationTargets/uuid"` → path `publicationTargets/uuid`).
+
+### TypeScript Interfaces (to be placed in `src/features/publication-targets/types/`)
+
+```ts
+// PublicationTarget.d.ts
+
+export interface S3Target {
+  region: string;
+  bucket: string;
+  endpoint?: string;
+  aws_access_key_id: string;
+  aws_secret_access_key: string;
+  prefix?: string;
+  acl?: string;
+  storage_class?: string;
+  encryption_method?: string;
+  plus_workaround?: boolean;
+  disable_multi_del?: boolean;
+  force_sig_v2?: boolean;
+  debug?: boolean;
+}
+
+export interface SwiftTarget {
+  container: string;
+  username: string;
+  password: string;
+  prefix?: string;
+  auth_url?: string;        // not server-validated as required (proto buf validate only checks container/username/password)
+  tenant?: string;
+  tenant_id?: string;
+  domain?: string;
+  domain_id?: string;
+  tenant_domain?: string;
+  tenant_domain_id?: string;
+}
+
+export interface PublicationTarget {
+  name: string;                      // e.g. "publicationTargets/{uuid}"
+  publication_target_id: string;     // UUID
+  display_name: string;
+  s3?: S3Target;
+  swift?: SwiftTarget;
+}
+```
+
+```ts
+// index.d.ts
+export type { PublicationTarget, S3Target, SwiftTarget } from "./PublicationTarget";
+```
+
+### Hooks to Create (`src/features/publication-targets/hooks/`)
+
+#### `useGetPublicationTargets` (`useGetPublicationTargets.ts`)
+
+```ts
+// Returns:
+{
+  publicationTargets: PublicationTarget[];
+  isPublicationTargetsLoading: boolean;
+}
+// queryKey: ["publicationTargets"]
+// queryFn: authFetch.get("publicationTargets")
+// Response shape: { publication_targets: PublicationTarget[] }
+```
+
+#### `useCreatePublicationTarget` (`useCreatePublicationTarget.ts`)
+
+```ts
+// Mutation params (body sent flat — proto body: "publication_target" transcoding):
+{
+  display_name: string;
+  s3?: S3Target;    // exactly one of s3 / swift must be set
+  swift?: SwiftTarget;
+}
+// POST publicationTargets
+// On success: invalidate ["publicationTargets"]
+```
+
+#### `useUpdatePublicationTarget` (`useUpdatePublicationTarget.ts`)
+
+```ts
+// Mutation params (body sent flat — proto body: "publication_target" transcoding):
+{
+  name: string;          // full resource name: "publicationTargets/{uuid}"
+  display_name?: string;
+  s3?: S3Target;
+  swift?: SwiftTarget;
+  update_mask?: string;  // optional field mask e.g. "display_name,s3"
+}
+// PATCH publicationTargets/{uuid}  (uuid extracted from name)
+// Axios call: authFetch.patch(name, { name, display_name?, s3?, swift?, update_mask? })
+// On success: invalidate ["publicationTargets"]
+```
+
+#### `useDeletePublicationTarget` (`useDeletePublicationTarget.ts`)
+
+```ts
+// Mutation params:
+{ name: string }  // full resource name: "publicationTargets/{uuid}"
+// DELETE publicationTargets/{uuid}  (Axios: authFetch.delete(name))
+// On success: invalidate ["publicationTargets"]
+```
+
+#### `useGetPublications` (`useGetPublications.ts`)
+
+```ts
+// Used by RemovePublicationTargetModal to display which publications reference a target.
+// Returns:
+{
+  publications: Publication[];
+  isPublicationsLoading: boolean;
+}
+// queryKey: ["publications"]
+// queryFn: authFetch.get("publications")
+// Response shape: { publications: Publication[] }
+// Filter client-side: publications.filter(p => p.publication_target === target.name)
+```
+
+All hooks use `useFetch` (v2 API). The hook index at `src/features/publication-targets/hooks/index.ts` re-exports all hooks.
+
+### Pagination Strategy
+
+Follow the mirrors pattern: **fetch all items in a single request** (no offset/cursor pagination). The `ListPublicationTargetsRequest` proto supports `page_size` / `page_token` but publication targets are a small, bounded dataset. Do not wire up `usePageParams` for this feature.
+
+---
+
+## 3. Component Hierarchy
+
+```
+src/features/publication-targets/
+├── hooks/
+│   ├── index.ts
+│   ├── useGetPublicationTargets.ts
+│   ├── useGetPublications.ts                    # Used by RemovePublicationTargetModal; may be replaced by a shared publications hook later
+│   ├── useCreatePublicationTarget.ts
+│   ├── useUpdatePublicationTarget.ts
+│   └── useDeletePublicationTarget.ts
+├── components/
+│   ├── PublicationTargetList/
+│   │   └── PublicationTargetList.tsx            # ResponsiveTable; columns: display_name, type, publications count, actions
+│   ├── PublicationTargetListActions/
+│   │   └── PublicationTargetListActions.tsx     # ContextualMenu (3-dot) — items: View details, Edit, Remove
+│   ├── PublicationTargetDetailsModal/
+│   │   └── PublicationTargetDetailsModal.tsx    # Read-only modal showing all fields for a target (S3 or Swift)
+│   ├── RemovePublicationTargetModal/
+│   │   └── RemovePublicationTargetModal.tsx     # Confirmation modal: "Remove [name]" + publications currently using target
+│   ├── NewPublicationTargetForm/
+│   │   ├── NewPublicationTargetForm.tsx         # Formik form; target type selector (S3/Swift/file system) switches sub-fields
+│   │   ├── S3Fields.tsx                         # Input group for S3Target fields
+│   │   ├── SwiftFields.tsx                      # Input group for SwiftTarget fields
+│   │   └── constants.ts                         # INITIAL_VALUES, VALIDATION_SCHEMA
+│   ├── EditPublicationTargetForm/
+│   │   ├── EditPublicationTargetForm.tsx        # Same sub-field layout; target type shown read-only (locked after creation)
+│   │   └── constants.ts                         # VALIDATION_SCHEMA for edit
+│   └── PublicationTargetAddButton/
+│       └── PublicationTargetAddButton.tsx       # Button that opens side panel with NewPublicationTargetForm
+├── types/
+│   ├── PublicationTarget.d.ts
+│   ├── FormTypes.d.ts                           # NewPublicationTargetFormValues, EditPublicationTargetFormValues
+│   └── index.d.ts
+├── constants.ts                                 # TARGET_TYPE_OPTIONS, TARGET_TYPE_LABELS
+└── index.ts                                     # Public barrel exports
+```
+
+### Table Columns
+
+| Column | Source | Notes |
+|---|---|---|
+| Name | `display_name` | Plain text |
+| Type | derived from presence of `s3` / `swift` key | Rendered via `TARGET_TYPE_LABELS` — `"S3"`, `"Swift"`, or `"File system"` |
+| Publications | count of `publications` whose `publication_target === target.name` | e.g. `"2 publications"`; data from `useGetPublications` |
+| Actions | `PublicationTargetListActions` | `ContextualMenu` from `@canonical/react-components` — 3-dot trigger |
+
+> **Note:** `"File system"` is a future type. The current proto only defines `s3` and `swift` in the `target` oneof. Add a `filesystem` placeholder to `TARGET_TYPE_OPTIONS` but do not render `FileSystemFields` until the proto is extended.
+
+### Actions Menu Items
+
+- **View details** — opens `PublicationTargetDetailsModal` (full field dump, read-only)
+- **Edit** — opens side panel with `EditPublicationTargetForm` (pre-populated; target type shown as `<Select disabled>`, not interactive)
+- **Remove** — opens `RemovePublicationTargetModal`
+
+### `RemovePublicationTargetModal` Behaviour
+
+- Title: `Remove [display_name]`
+- Body: `"This publication target is currently being used by the following publications:"` followed by an inline list of publication names (filtered from `useGetPublications` by `publication_target === target.name`). If no publications use the target, show a simple confirmation with no list.
+- Confirm button calls `useDeletePublicationTarget`, then closes the modal.
+- Use the existing modal pattern from `src/components/ui/` (check for a shared `ConfirmationModal` or `Modal` wrapper before creating a new one).
+
+### Page Entry Point
+
+`src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx`  
+(already exists; **replace its current body** with the proper implementation using feature components)
+
+- Uses `useGetPublicationTargets()` for data.
+- Renders `PageMain > PageHeader > PageContent`.
+- `PageHeader` has title `"Publication targets"` and an `Add publication target` button.
+- Shows `LoadingState` while loading, `EmptyState` when no items, otherwise `PublicationTargetList`.
+- Side panel opened via `useSidePanel()` renders `NewPublicationTargetForm` (lazy-loaded).
+- `PublicationTargetDetailsModal` and `RemovePublicationTargetModal` are rendered inline in the page, each controlled by local `useState<PublicationTarget | null>` (one state variable per modal).
+
+---
+
+## 4. State & Logic
+
+### Forms
+
+All forms use Formik + Yup. Define in each form's `constants.ts`:
+
+#### `NewPublicationTargetForm` — `INITIAL_VALUES`
+
+```ts
+{
+  display_name: "",
+  target_type: "s3" as "s3" | "swift" | "filesystem",  // selector drives which sub-fields render; filesystem is a placeholder
+  s3: {
+    region: "",
+    bucket: "",
+    endpoint: "",
+    aws_access_key_id: "",
+    aws_secret_access_key: "",
+    prefix: "",
+    acl: "",
+    storage_class: "",
+    encryption_method: "",
+    plus_workaround: false,
+    disable_multi_del: false,
+    force_sig_v2: false,
+    debug: false,
+  },
+  swift: {
+    container: "",
+    username: "",
+    password: "",
+    prefix: "",
+    auth_url: "",
+    tenant: "",
+    tenant_id: "",
+    domain: "",
+    domain_id: "",
+    tenant_domain: "",
+    tenant_domain_id: "",
+  },
+}
+```
+
+#### `NewPublicationTargetForm` — `VALIDATION_SCHEMA` (Yup)
+
+```ts
+// display_name: required string
+// When target_type === "s3":  s3.region required, s3.bucket required, s3.aws_access_key_id required, s3.aws_secret_access_key required
+//   (mirrors proto buf validate: region/bucket/aws_access_key_id/aws_secret_access_key)
+// When target_type === "swift": swift.container required, swift.username required, swift.password required
+//   (auth_url is NOT proto-validated as required — omit from required rules)
+// Use Yup.when() for conditional validation
+```
+
+#### `EditPublicationTargetForm` — `INITIAL_VALUES`
+
+Pre-populated from the selected `PublicationTarget` object. The `target_type` is derived from whether `s3` or `swift` field is present and rendered as a **`<Select disabled>`** — changing target type after creation is not supported.
+
+### Global Context
+
+No new context needed. Default: **No**.
+
+### Side Panel
+
+Use `useSidePanel()` to open `NewPublicationTargetForm` and `EditPublicationTargetForm` in the application's existing side panel. Close via `closeSidePanel()` on successful mutation.
+
+---
+
+## 5. Testing Plan
+
+### Unit Tests (`*.test.tsx` alongside source)
+
+| File | What to test |
+|---|---|
+| `hooks/useGetPublicationTargets.test.ts` | Returns `publicationTargets` array and `isPublicationTargetsLoading`; handles empty list |
+| `hooks/useGetPublications.test.ts` | Returns `publications` array; client-side filter by `publication_target` name works |
+| `hooks/useCreatePublicationTarget.test.ts` | Calls `POST publicationTargets`; invalidates query key on success |
+| `hooks/useUpdatePublicationTarget.test.ts` | Calls `PATCH publicationTargets/{name}`; invalidates query key on success |
+| `hooks/useDeletePublicationTarget.test.ts` | Calls `DELETE publicationTargets/{name}`; invalidates query key on success |
+| `components/PublicationTargetList/PublicationTargetList.test.tsx` | Renders correct columns (name, type label, publications count); opens 3-dot menu |
+| `components/PublicationTargetListActions/PublicationTargetListActions.test.tsx` | View details / Edit / Remove items each fire the correct callback |
+| `components/PublicationTargetDetailsModal/PublicationTargetDetailsModal.test.tsx` | Renders all fields for an S3 target; renders all fields for a Swift target |
+| `components/RemovePublicationTargetModal/RemovePublicationTargetModal.test.tsx` | Shows publication list when target is in use; shows plain confirm when unused; calls delete on confirm |
+| `components/NewPublicationTargetForm/NewPublicationTargetForm.test.tsx` | Shows S3 fields by default; switches to Swift fields; validates required proto fields; submits correctly |
+| `components/EditPublicationTargetForm/EditPublicationTargetForm.test.tsx` | Pre-populates from existing target; target type selector is disabled; submits PATCH on save |
+| `PublicationTargetsPage.test.tsx` | Loading state; empty state; list rendered; add button opens side panel; details modal opens; remove modal opens |
+
+### MSW Handlers (`src/tests/mocks/`)
+
+Create `publicationTargets.ts` and `publications.ts` (if not already present) and register them in the handler index:
+
+```ts
+// GET /api/v2/publicationTargets
+http.get(`${API_URL}publicationTargets`, () =>
+  HttpResponse.json({
+    publication_targets: [
+      {
+        name: "publicationTargets/00000000-0000-0000-0000-000000000001",
+        publication_target_id: "00000000-0000-0000-0000-000000000001",
+        display_name: "My S3 Bucket",
+        s3: {
+          region: "us-east-1",
+          bucket: "my-bucket",
+          aws_access_key_id: "AKIA...",
+          aws_secret_access_key: "secret",
+        },
+      },
+    ],
+  }),
+);
+
+// POST /api/v2/publicationTargets
+http.post(`${API_URL}publicationTargets`, () =>
+  HttpResponse.json({ name: "publicationTargets/new-uuid", publication_target_id: "new-uuid", display_name: "New Target" }, { status: 201 }),
+);
+
+// PATCH /api/v2/publicationTargets/:id  (body is flat PublicationTarget fields)
+http.patch(`${API_URL}publicationTargets/:id`, () =>
+  HttpResponse.json({ name: "publicationTargets/some-uuid", publication_target_id: "some-uuid", display_name: "Updated Target" }),
+);
+
+// DELETE /api/v2/publicationTargets/:id  (:id is the UUID, matching resource name "publicationTargets/{id}")
+http.delete(`${API_URL}publicationTargets/:id`, () =>
+  new HttpResponse(null, { status: 200 }),
+);
+
+// GET /api/v2/publications  (used by RemovePublicationTargetModal)
+http.get(`${API_URL}publications`, () =>
+  HttpResponse.json({
+    publications: [
+      {
+        name: "publications/00000000-0000-0000-0000-000000000010",
+        publication_id: "00000000-0000-0000-0000-000000000010",
+        display_name: "My Publication",
+        publication_target: "publicationTargets/00000000-0000-0000-0000-000000000001",
+        mirror: "mirrors/some-mirror",
+      },
+    ],
+  }),
+);
+```
+
+---
+
+## 6. Routing & Navigation (Already Wired)
+
+The following are already in place and **must not be changed**:
+
+- Route path: `REPOSITORIES_PATHS.publicationTargets = "publication-targets"` in `src/libs/routes/repositories.ts`
+- Route entry: `REPOSITORIES_ROUTES.publicationTargets` (same file)
+- Lazy page load: `PublicationTargetsPage` in `src/routes/elements.tsx` (line 95–96)
+- Dashboard route: `src/routes/DashboardRoutes.tsx` (lines 102–103)
+- Navigation link: `src/templates/dashboard/Navigation/constants.ts` (line 30)
+
+---
+
+## 7. `constants.ts` Reference
+
+```ts
+export const TARGET_TYPE_OPTIONS = [
+  { label: "S3", value: "s3" },
+  { label: "Swift", value: "swift" },
+  { label: "File system", value: "filesystem" }, // placeholder — not yet in proto
+] as const;
+
+export const TARGET_TYPE_LABELS: Record<string, string> = {
+  s3: "S3",
+  swift: "Swift",
+  filesystem: "File system",
+};
+```
+
+---
+
+## 8. Implementation Order
+
+1. Define types in `src/features/publication-targets/types/`
+2. Implement `useGetPublicationTargets` + `useGetPublications` hooks
+3. Implement remaining mutation hooks (`useCreatePublicationTarget`, `useUpdatePublicationTarget`, `useDeletePublicationTarget`)
+4. Implement `PublicationTargetList` + `PublicationTargetListActions` (3-dot `ContextualMenu`)
+5. Implement `PublicationTargetDetailsModal`
+6. Implement `RemovePublicationTargetModal`
+7. Implement `NewPublicationTargetForm` (with `S3Fields`, `SwiftFields`, `constants.ts`)
+8. Implement `EditPublicationTargetForm` (locked target type)
+9. Implement `PublicationTargetAddButton`
+10. Create `src/features/publication-targets/index.ts` barrel
+11. Replace body of `PublicationTargetsPage.tsx`
+12. Add MSW handlers + write unit tests
diff --git a/.github/feature-plans/publications-context.md b/.github/feature-plans/publications-context.md
new file mode 100644
index 000000000..e2581673d
--- /dev/null
+++ b/.github/feature-plans/publications-context.md
@@ -0,0 +1,455 @@
+### pulication_target.proto
+
+syntax = "proto3";
+
+package canonical.landscape.debarchive.v1;
+
+import "buf/validate/validate.proto";
+import "canonical/landscape/debarchive/v1/publication.proto";
+import "canonical/landscape/debarchive/v1/task.proto";
+import "google/api/annotations.proto";
+import "google/api/client.proto";
+import "google/api/field_behavior.proto";
+import "google/api/resource.proto";
+import "google/protobuf/empty.proto";
+import "google/protobuf/field_mask.proto";
+
+// PublicationService manages the publication of Debian artifacts.
+service PublicationService {
+  // CreatePublication creates a new Publication.
+  rpc CreatePublication(CreatePublicationRequest) returns (Publication) {
+    option (google.api.http) = {
+      post: "/v1/publications"
+      body: "publication"
+    };
+    option (google.api.method_signature) = "publication,publication_id";
+  }
+
+  // GetPublication retrieves a Publication by its resource name.
+  rpc GetPublication(GetPublicationRequest) returns (Publication) {
+    option (google.api.http) = {get: "/v1/{name=publications/*}"};
+    option (google.api.method_signature) = "name";
+  }
+
+  // ListPublications returns a list of Publications.
+  rpc ListPublications(ListPublicationsRequest) returns (ListPublicationsResponse) {
+    option (google.api.http) = {get: "/v1/publications"};
+    option (google.api.method_signature) = "";
+  }
+
+  // UpdatePublication updates the details of a Publication.
+  rpc UpdatePublication(UpdatePublicationRequest) returns (Publication) {
+    option (google.api.http) = {
+      patch: "/v1/{publication.name=publications/*}"
+      body: "publication"
+    };
+    option (google.api.method_signature) = "publication,update_mask";
+  }
+
+  // DeletePublication deletes a Publication.
+  // Note: This operation may trigger a background Task to clean up published artifacts.
+  rpc DeletePublication(DeletePublicationRequest) returns (google.protobuf.Empty) {
+    option (google.api.http) = {delete: "/v1/{name=publications/*}"};
+    option (google.api.method_signature) = "name";
+  }
+
+  // PublishPublication triggers the actual publication process.
+  // This is a custom method that returns a background Task.
+  rpc PublishPublication(PublishPublicationRequest) returns (PublishPublicationResponse) {
+    option (google.api.http) = {
+      post: "/v1/{name=publications/*}:publish"
+      body: "*"
+    };
+    option (google.api.method_signature) = "name";
+  }
+}
+
+// CreatePublicationRequest is the request message for CreatePublication.
+message CreatePublicationRequest {
+  // The ID to use for the publication (optional).
+  string publication_id = 1 [(google.api.field_behavior) = OPTIONAL];
+
+  // The publication to create.
+  Publication publication = 2 [
+    (google.api.field_behavior) = REQUIRED,
+
+    (buf.validate.field).required = true,
+
+    (buf.validate.field).cel = {
+      id: "publication_target.required"
+      message: "publication target is required"
+      expression: "this.publication_target.size() > 0"
+    },
+
+    (buf.validate.field).cel = {
+      id: "mirror.required"
+      message: "mirror is required"
+      expression: "this.mirror.size() > 0"
+    }
+  ];
+}
+
+// GetPublicationRequest is the request message for GetPublication.
+message GetPublicationRequest {
+  // The resource name of the publication to retrieve.
+  // Format: "publications/{publication}"
+  string name = 1 [
+    (google.api.field_behavior) = REQUIRED,
+    (google.api.resource_reference) = {type: "landscape.canonical.com/Publication"},
+    (buf.validate.field).required = true
+  ];
+}
+
+// UpdatePublicationRequest is the request message for UpdatePublication.
+message UpdatePublicationRequest {
+  // The publication to update.
+  Publication publication = 1 [
+    (google.api.field_behavior) = REQUIRED,
+
+    (buf.validate.field).required = true,
+
+    (buf.validate.field).cel = {
+      id: "name.required"
+      message: "name is required"
+      expression: "this.name.size() > 0"
+    }
+  ];
+
+  // The list of fields to update.
+  google.protobuf.FieldMask update_mask = 2 [(google.api.field_behavior) = OPTIONAL];
+}
+
+// DeletePublicationRequest is the request message for DeletePublication.
+message DeletePublicationRequest {
+  // The resource name of the publication to delete.
+  // Format: "publications/{publication}"
+  string name = 1 [
+    (google.api.field_behavior) = REQUIRED,
+    (google.api.resource_reference) = {type: "landscape.canonical.com/Publication"},
+    (buf.validate.field).required = true
+  ];
+}
+
+// ListPublicationsRequest is the request message for ListPublications.
+message ListPublicationsRequest {
+  // The maximum number of publications to return.
+  // The service may return fewer than this value.
+  // If unspecified, at most 100 publications will be returned.
+  // The maximum value is 1000; values above 1000 will be coerced to 1000.
+  int32 page_size = 1 [(google.api.field_behavior) = OPTIONAL];
+
+  // A page token, received from a previous `ListPublication` call.
+  // Provide this to retrieve the subsequent page.
+  //
+  // When paginating, all other parameters provided to `ListPublication` must match
+  // the call that provided the page token.
+  string page_token = 2 [(google.api.field_behavior) = OPTIONAL];
+}
+
+// ListPublicationsResponse is the response message for ListPublications.
+message ListPublicationsResponse {
+  // A list of publications.
+  repeated Publication publications = 1;
+
+  // A token, which can be sent as `page_token` to retrieve the next page.
+  // If this field is omitted, there are no subsequent pages.
+  string next_page_token = 2;
+}
+
+// PublishPublicationRequest is the request message for PublishPublication.
+message PublishPublicationRequest {
+  // The resource name of the publication to publish.
+  // Format: "publications/{publication}"
+  string name = 1 [
+    (google.api.field_behavior) = REQUIRED,
+    (google.api.resource_reference) = {type: "landscape.canonical.com/Publication"},
+    (buf.validate.field).required = true
+  ];
+
+  // Force overwrite of existing artifacts.
+  bool force_overwrite = 2 [(google.api.field_behavior) = OPTIONAL];
+
+  // Force cleanup of old artifacts.
+  bool force_cleanup = 3 [(google.api.field_behavior) = OPTIONAL];
+}
+
+// PublishPublicationResponse is the response message for PublishPublication.
+message PublishPublicationResponse {
+  // The resulting task from a sync mirror.
+  Task task = 1;
+}
+
+
+### pulication_target_service.proto
+syntax = "proto3";
+
+package canonical.landscape.debarchive.v1;
+
+import "buf/validate/validate.proto";
+import "canonical/landscape/debarchive/v1/publication_target.proto";
+import "google/api/annotations.proto";
+import "google/api/client.proto";
+import "google/api/field_behavior.proto";
+import "google/api/resource.proto";
+import "google/protobuf/empty.proto";
+import "google/protobuf/field_mask.proto";
+
+// PublicationTargetService manages the storage destinations for Debian archives.
+service PublicationTargetService {
+  // CreatePublicationTarget creates a new PublicationTarget.
+  rpc CreatePublicationTarget(CreatePublicationTargetRequest) returns (PublicationTarget) {
+    option (google.api.http) = {
+      post: "/v1/publicationTargets"
+      body: "publication_target"
+    };
+    option (google.api.method_signature) = "publication_target,publication_target_id";
+  }
+
+  // GetPublicationTarget gets details of a single PublicationTarget.
+  rpc GetPublicationTarget(GetPublicationTargetRequest) returns (PublicationTarget) {
+    option (google.api.http) = {get: "/v1/{name=publicationTargets/*}"};
+    option (google.api.method_signature) = "name";
+  }
+
+  // ListPublicationTargets lists all PublicationTargets.
+  rpc ListPublicationTargets(ListPublicationTargetsRequest) returns (ListPublicationTargetsResponse) {
+    option (google.api.http) = {get: "/v1/publicationTargets"};
+    option (google.api.method_signature) = "";
+  }
+
+  // UpdatePublicationTarget replaces (full replacement) an existing PublicationTarget.
+  rpc UpdatePublicationTarget(UpdatePublicationTargetRequest) returns (PublicationTarget) {
+    option (google.api.http) = {
+      patch: "/v1/{publication_target.name=publicationTargets/*}"
+      body: "publication_target"
+    };
+    option (google.api.method_signature) = "publication_target,update_mask";
+  }
+
+  // DeletePublicationTarget deletes a PublicationTarget.
+  rpc DeletePublicationTarget(DeletePublicationTargetRequest) returns (google.protobuf.Empty) {
+    option (google.api.http) = {delete: "/v1/{name=publicationTargets/*}"};
+    option (google.api.method_signature) = "name";
+  }
+}
+
+// CreatePublicationTargetRequest is the request message for CreatePublicationTarget.
+message CreatePublicationTargetRequest {
+  // The ID to use for the publication target (optional).
+  // If not provided, the server will generate one.
+  string publication_target_id = 1 [(google.api.field_behavior) = OPTIONAL];
+
+  // The resource to create.
+  PublicationTarget publication_target = 2 [
+    (google.api.field_behavior) = REQUIRED,
+
+    (buf.validate.field).required = true,
+
+    (buf.validate.field).cel = {
+      id: "display_name.required"
+      message: "display name is required"
+      expression: "this.display_name.size() > 0"
+    },
+
+    (buf.validate.field).cel = {
+      id: "target.required"
+      message: "target is required"
+      expression: "has(this.s3) || has(this.swift)"
+    },
+
+    (buf.validate.field).cel = {
+      id: "s3.region.required"
+      message: "s3 region is required"
+      expression: "has(this.s3) ? this.s3.region.size() > 0 : true"
+    },
+
+    (buf.validate.field).cel = {
+      id: "s3.bucket.required"
+      message: "s3 bucket is required"
+      expression: "has(this.s3) ? this.s3.bucket.size() > 0 : true"
+    },
+
+    (buf.validate.field).cel = {
+      id: "s3.aws_access_key_id.required"
+      message: "s3 aws access key id is required"
+      expression: "has(this.s3) ? this.s3.aws_access_key_id.size() > 0 : true"
+    },
+
+    (buf.validate.field).cel = {
+      id: "s3.aws_secret_access_key.required"
+      message: "s3 aws secret access key is required"
+      expression: "has(this.s3) ? this.s3.aws_secret_access_key.size() > 0 : true"
+    },
+
+    (buf.validate.field).cel = {
+      id: "swift.container.required"
+      message: "swift container name is required"
+      expression: "has(this.swift) ? this.swift.container.size() > 0 : true"
+    },
+
+    (buf.validate.field).cel = {
+      id: "swift.username.required"
+      message: "swift username is required"
+      expression: "has(this.swift) ? this.swift.username.size() > 0 : true"
+    },
+
+    (buf.validate.field).cel = {
+      id: "swift.password.required"
+      message: "swift password is required"
+      expression: "has(this.swift) ? this.swift.password.size() > 0 : true"
+    }
+  ];
+}
+
+// GetPublicationTargetRequest is the request message for GetPublicationTarget.
+message GetPublicationTargetRequest {
+  // The name of the publication target to retrieve.
+  // Format: "publicationTargets/{publication_target}"
+  string name = 1 [
+    (google.api.field_behavior) = REQUIRED,
+    (google.api.resource_reference) = {type: "landscape.canonical.com/PublicationTarget"},
+    (buf.validate.field).required = true
+  ];
+}
+
+// ListPublicationTargetsRequest is the request message for ListPublicationTargets.
+message ListPublicationTargetsRequest {
+  // The maximum number of publication targets to return.
+  // The service may return fewer than this value.
+  // If unspecified, at most 100 publication targets will be returned.
+  // The maximum value is 1000; values above 1000 will be coerced to 1000.
+  int32 page_size = 1 [(google.api.field_behavior) = OPTIONAL];
+
+  // A page token, received from a previous `ListPublicationTargets` call.
+  // Provide this to retrieve the subsequent page.
+  //
+  // When paginating, all other parameters provided to `ListPublicationTargets` must match
+  // the call that provided the page token.
+  string page_token = 2 [(google.api.field_behavior) = OPTIONAL];
+}
+
+// ListPublicationTargetsResponse is the response message for ListPublicationTargets.
+message ListPublicationTargetsResponse {
+  // The publication targets.
+  repeated PublicationTarget publication_targets = 1;
+
+  // A token, which can be sent as `page_token` to retrieve the next page.
+  // If this field is omitted, there are no subsequent pages.
+  string next_page_token = 2;
+}
+
+// UpdatePublicationTargetRequest is the request message for UpdatePublicationTarget.
+message UpdatePublicationTargetRequest {
+  // The resource to update.
+  PublicationTarget publication_target = 1 [
+    (google.api.field_behavior) = REQUIRED,
+
+    (buf.validate.field).required = true,
+
+    (buf.validate.field).cel = {
+      id: "name.required"
+      message: "name is required"
+      expression: "this.name.size() > 0"
+    }
+  ];
+
+  // The list of fields to update.
+  google.protobuf.FieldMask update_mask = 2 [(google.api.field_behavior) = OPTIONAL];
+}
+
+// DeletePublicationTargetRequest is the request message for DeletePublicationTarget.
+message DeletePublicationTargetRequest {
+  // The name of the publication target to delete.
+  // Format: "publicationTargets/{publication_target}"
+  string name = 1 [
+    (google.api.field_behavior) = REQUIRED,
+    (google.api.resource_reference) = {type: "landscape.canonical.com/PublicationTarget"},
+    (buf.validate.field).required = true
+  ];
+}
+
+### publication.proto
+syntax = "proto3";
+
+package canonical.landscape.debarchive.v1;
+
+import "canonical/landscape/debarchive/v1/gpg_key.proto";
+import "google/api/field_behavior.proto";
+import "google/api/resource.proto";
+
+// Publication represents the configuration for publishing Debian artifacts
+// from a Source (Mirror) to a Target.
+message Publication {
+  option (google.api.resource) = {
+    type: "landscape.canonical.com/Publication"
+    pattern: "publications/{publication}"
+    singular: "publication"
+    plural: "publications"
+  };
+
+  // The resource name of the publication.
+  // Format: "publications/{uuid}"
+  string name = 1 [(google.api.field_behavior) = IDENTIFIER];
+
+  // The publication ID (UUID) is exposed separately for convenience.
+  string publication_id = 2 [(google.api.field_behavior) = OUTPUT_ONLY];
+
+  // The resource name of the publication target.
+  // Format: "publicationTargets/{publication_target}"
+  string publication_target = 3 [
+    (google.api.field_behavior) = REQUIRED,
+    (google.api.resource_reference) = {type: "landscape.canonical.com/PublicationTarget"}
+  ];
+
+  // The resource name of the source mirror.
+  // Format: "mirrors/{mirror}"
+  string mirror = 4 [
+    (google.api.field_behavior) = REQUIRED,
+    (google.api.resource_reference) = {type: "landscape.canonical.com/Mirror"}
+  ];
+
+  // The name of the distribution.
+  // Inferred from the source if omitted.
+  string distribution = 5 [(google.api.field_behavior) = OPTIONAL];
+
+  // The name of the component to publish.
+  // Inferred from the source if omitted.
+  string component = 6 [(google.api.field_behavior) = OPTIONAL];
+
+  // Value for the `Label:` field in the Release file.
+  string label = 7 [(google.api.field_behavior) = OPTIONAL];
+
+  // Value for the `Origin:` field in the Release file.
+  // Inferred from the source if omitted.
+  string origin = 8 [(google.api.field_behavior) = OPTIONAL];
+
+  // List of architectures to publish.
+  // Defaults to all source architectures if omitted.
+  repeated string architectures = 9 [
+    (google.api.field_behavior) = OPTIONAL,
+    (google.api.field_behavior) = UNORDERED_LIST
+  ];
+
+  // Provides index file by hash if unique.
+  // (-- api-linter: core::0140::prepositions=disabled --)
+  bool acquire_by_hash = 10 [(google.api.field_behavior) = OPTIONAL];
+
+  // Sets `ButAutomaticUpgrade: yes|no` in the Release file if provided.
+  // (-- api-linter: core::0140::prepositions=disabled --)
+  optional bool but_automatic_upgrades = 11 [(google.api.field_behavior) = OPTIONAL];
+
+  // Sets `NotAutomatic: yes|no` in the Release file if provided.
+  optional bool not_automatic = 12 [(google.api.field_behavior) = OPTIONAL];
+
+  // Indicates if multiple distributions are supported.
+  bool multi_dist = 13 [(google.api.field_behavior) = OPTIONAL];
+
+  // Indicates if bz2 compression should be skipped for index files.
+  bool skip_bz2 = 14 [(google.api.field_behavior) = OPTIONAL];
+
+  // Indicates if content indexes should not be generated.
+  bool skip_contents = 15 [(google.api.field_behavior) = OPTIONAL];
+
+  // Optional GPG key to sign the release file(s).
+  optional GpgKey gpg_key = 16 [(google.api.field_behavior) = OPTIONAL];
+}
\ No newline at end of file
diff --git a/.github/feature-plans/targets-with-publications.md b/.github/feature-plans/targets-with-publications.md
new file mode 100644
index 000000000..9752e8172
--- /dev/null
+++ b/.github/feature-plans/targets-with-publications.md
@@ -0,0 +1,289 @@
+# Feature Plan: Lazy Publications Loading (`targets-with-publications`)
+
+> **Final** — standalone `useGetPublicationsByTarget`; server-side filter; no changes to `src/features/publications/`.
+
+---
+
+## 1. Feature Overview
+
+- **Objective:** Replace the single eager "fetch all publications and client-side join" strategy with a per-target, on-demand, server-side filtered query. The publications count column stays in the list table. Publications data is fetched only when needed for a specific target.
+- **Location:** `src/features/publication-targets/`
+
+---
+
+## 2. Root Cause
+
+`useGetPublicationTargets` unconditionally calls the local `useGetPublications()` (which paginates through *all* publications) and client-side joins the result into every list row. The publications payload grows linearly with account activity and is O(total publications) regardless of how many targets are displayed.
+
+---
+
+## 3. `src/features/publications/` — No Changes
+
+The existing `useGetPublications` hook is designed for the Publications list page: it is URL-params-driven (consumes `usePageParams`), applies client-side search filtering, and returns paginated results. It must not be modified as part of this refactor.
+
+Both `Publication` and `ListPublicationsResponse` are exported from `@/features/publications` and are available for the new hook to import.
+
+---
+
+## 4. Changes to `src/features/publication-targets/`
+
+### 4.1 New Hook: `useGetPublicationsByTarget`
+
+**File:** `src/features/publication-targets/api/useGetPublicationsByTarget.ts`
+
+A standalone hook that calls the `publications` endpoint directly with a server-side `publicationTargetId` filter. It does not wrap the `publications` feature's `useGetPublications`.
+
+```ts
+// Signature
+function useGetPublicationsByTarget(publicationTargetId: string | undefined): {
+  publications: Publication[];
+  isGettingPublications: boolean;
+}
+```
+
+- **Endpoint:** `GET publications?publicationTargetId=<uuid>` (paginated, cursor-based).
+- **Query key:** `["publications", { publicationTargetId }]` — distinct per target, independently cached.
+- If `publicationTargetId` is `undefined`, the query is disabled (`enabled: false`); returns `{ publications: [], isGettingPublications: false }`.
+- Pagination follows the same `do { … } while (pageToken)` pattern as other hooks in this feature.
+- Import sources:
+  - `Publication` from `@/features/publications`
+  - `ListPublicationsResponse` from `@/api/generated/debArchive.schemas` (not exported by `@/features/publications`)
+  - `useFetchDebArchive` from `@/hooks/useFetchDebArchive`
+
+```ts
+// Query params sent to the API
+{ publicationTargetId: string, pageSize: 100, pageToken?: string }
+```
+
+### 4.2 `useGetPublicationTargets` (MODIFY)
+
+**File:** `src/features/publication-targets/api/useGetPublicationTargets.ts`
+
+- Remove `import useGetPublications` (local hook).
+- Remove `import type { PublicationTargetWithPublications }`.
+- Remove the client-side join (`targets.map(...)`).
+- Return plain `PublicationTarget[]`.
+
+```ts
+// Signature after refactor
+function useGetPublicationTargets(): {
+  publicationTargets: PublicationTarget[];
+  isGettingPublicationTargets: boolean;
+}
+```
+
+### 4.3 `useRemovePublicationTarget` (MODIFY)
+
+**File:** `src/features/publication-targets/api/useRemovePublicationTarget.ts`
+
+The `onSuccess` handler currently only invalidates `["publication-targets"]`. Add invalidation of `["publications"]` so per-target count caches are busted when a target is deleted.
+
+```ts
+onSuccess: async () => {
+  await Promise.all([
+    queryClient.invalidateQueries({ queryKey: ["publication-targets"] }),
+    queryClient.invalidateQueries({ queryKey: ["publications"] }),
+  ]);
+}
+```
+
+### 4.4 Delete: `useGetPublications` in `publication-targets`
+
+**File:** `src/features/publication-targets/api/useGetPublications.ts` — **delete**.
+
+This was a copy of the global publications fetch used solely for the join. It has no remaining consumers after this refactor.
+
+### 4.5 `src/features/publication-targets/api/index.ts`
+
+- Remove `export { default as useGetPublications }`.
+- Add `export { default as useGetPublicationsByTarget }`.
+
+### 4.6 Component Changes
+
+#### Updated Type Flow
+
+```
+PublicationTargetContainer          → passes PublicationTarget[]
+  └─ PublicationTargetList          → accepts PublicationTarget[]
+       └─ PublicationsCountCell     → calls useGetPublicationsByTarget(target.publicationTargetId)
+       └─ PublicationTargetListActions → accepts PublicationTarget
+            ├─ TargetDetails        → accepts PublicationTarget; calls useGetPublicationsByTarget internally
+            ├─ EditTargetForm       → unchanged
+            └─ RemoveTargetForm     → accepts PublicationTarget; calls useGetPublicationsByTarget internally
+```
+
+#### `PublicationTargetList` (MODIFY)
+
+- Change `PublicationTargetWithPublications` → `PublicationTarget` throughout.
+- Extract a `PublicationsCountCell` named sub-component — hooks cannot be called inside `Cell` render functions.
+- Publications column accessor: `(row) => row.publicationTargetId` (opaque value; count derived in cell).
+
+```ts
+interface PublicationsCountCellProps {
+  publicationTargetId: string | undefined;
+}
+// PublicationsCountCell calls useGetPublicationsByTarget and renders:
+//   isGettingPublications → <Icon name="spinner" className="u-animation--spin" aria-hidden />
+//   loaded, length === 0  → <NoData />
+//   loaded, length > 0    → "{n} publication(s)"
+```
+
+There is no standalone `<Spinner />` component in the project. Use the same pattern as `LoadingState`: `<Icon name="spinner" className="u-animation--spin" aria-hidden />` imported from `@canonical/react-components`.
+
+#### `PublicationTargetListActions` (MODIFY)
+- Change prop type `PublicationTargetWithPublications` → `PublicationTarget`.
+- Remove debug `console.log` referencing `target.publications`.
+
+#### `TargetDetails` (MODIFY)
+- Change prop type: `target: PublicationTarget`.
+- Call `useGetPublicationsByTarget(target.publicationTargetId)` in the component body.
+- Replace `target.publications` with `publications` from the hook.
+- Show `<LoadingState />` in the "USED IN" section while `isGettingPublications` is `true`.
+
+```ts
+interface TargetDetailsProps {
+  readonly target: PublicationTarget;
+}
+```
+
+#### `RemoveTargetForm` (MODIFY)
+- Change prop type: `target: PublicationTarget`.
+- Call `useGetPublicationsByTarget(target.publicationTargetId)` in the component body.
+- Replace `target.publications` with `publications` from hook.
+- Gate `hasPublications` on `!isGettingPublications && publications.length > 0`.
+
+```ts
+interface RemoveTargetFormProps {
+  readonly target: PublicationTarget;
+}
+```
+
+### 4.7 Types (MODIFY)
+
+`src/features/publication-targets/types/Publication.d.ts`:
+- Import `Publication` from `@/features/publications` instead of `@/api/generated/debArchive.schemas` directly.
+- Delete `PublicationTargetWithPublications`.
+
+`src/features/publication-targets/types/index.d.ts`:
+- Remove `PublicationTargetWithPublications` export.
+
+`src/features/publication-targets/index.ts`:
+- Remove `PublicationTargetWithPublications` from public exports.
+
+---
+
+## 5. Caching Behaviour
+
+Each unique `publicationTargetId` gets its own React Query cache entry under key `["publications", { publicationTargetId }]`.
+
+- All visible list rows request their counts in parallel on first render.
+- Opening `TargetDetails` for target A → cache hit, zero extra network requests.
+- Opening `RemoveTargetForm` for the same target → cache hit.
+- On target deletion, both `["publication-targets"]` and `["publications"]` are invalidated (see §4.3).
+
+---
+
+## 6. State & Logic
+
+| Location | Before | After |
+|---|---|---|
+| `PublicationTargetContainer` | Blocks until targets + **all** publications resolve | Blocks only until targets resolve |
+| `PublicationTargetList` count cell | Synchronous (data in prop) | Per-row parallel requests; spinner icon while loading; cached on re-render |
+| `TargetDetails` | Publications in prop, no loading | `<LoadingState />` while hook resolves; cache hit on 2nd open |
+| `RemoveTargetForm` | Publications in prop, no loading | Inline loading; cache hit on 2nd open |
+
+---
+
+## 7. MSW Handlers
+
+**File:** `src/tests/server/handlers/publications.ts`
+
+Update the `GET publications` handler to read `publicationTargetId` from search params and return a filtered subset when present:
+
+```
+GET ${API_URL_DEBARCHIVE}v1/publications?publicationTargetId=<id>  → filtered subset
+GET ${API_URL_DEBARCHIVE}v1/publications                            → all (unchanged)
+```
+
+Branch on `request.url.searchParams.get("publicationTargetId")`.
+
+---
+
+## 8. Testing Plan
+
+### 8.1 Component Tests
+
+#### `PublicationTargetList.test.tsx` (new)
+- Render with plain `PublicationTarget[]` mock data.
+- Assert each row's Publications cell renders a count after the filtered MSW handler resolves.
+- Assert spinner icon is shown before the query resolves.
+
+#### `RemoveTargetForm.test.tsx` (update)
+- Change `target` prop: `publicationTargetsWithPublications[0]` → `publicationTargets[0]` (plain `PublicationTarget`).
+- Behaviour identical — MSW serves filtered result by `publicationTargetId`.
+- Verify publications table renders when MSW returns matching items; hidden otherwise.
+
+#### `TargetDetails.test.tsx` (new)
+- Render `<TargetDetails target={publicationTargets[0]} />`.
+- Assert S3 `InfoGrid` renders immediately (not gated on publications).
+- Assert `<LoadingState />` shown while filtered publications query is in-flight.
+- Assert `PublicationsTable` renders after MSW resolves filtered publications.
+
+### 8.2 Hook Coverage
+`useGetPublicationsByTarget` is exercised implicitly through the above component tests. No dedicated hook test file per project convention.
+
+### 8.3 Mocking Strategy
+All component tests that internally call `useGetPublicationsByTarget` should mock it via `vi.mock` at the top of each test file. This keeps tests fast and isolated — no MSW dependency for publications data in those tests.
+
+---
+
+## 9. Migration Checklist
+
+> **Status:** Implementation complete — pending `pnpm build` verification and deletion of the stale `useGetPublications.ts` file (requires terminal access).
+
+### Phase 1 — New `useGetPublicationsByTarget` hook
+- [x] Add `src/features/publication-targets/api/useGetPublicationsByTarget.ts`
+- [x] Update `src/features/publication-targets/api/index.ts` (add export)
+
+### Phase 2 — Strip publications join from `useGetPublicationTargets`; fix invalidation
+- [x] Update `src/features/publication-targets/api/useGetPublicationTargets.ts` (remove join, change return type)
+- [x] Delete `src/features/publication-targets/api/useGetPublications.ts` (**manual step** — no consumers remain; file must be deleted from disk)
+- [x] Remove its export from `src/features/publication-targets/api/index.ts`
+- [x] Update `src/features/publication-targets/api/useRemovePublicationTarget.ts` (add `["publications"]` invalidation to `onSuccess`)
+
+### Phase 3 — Component updates
+- [x] Add `PublicationsCountCell` sub-component in `PublicationTargetList/` (spinner: `<Icon name="spinner" className="u-animation--spin" aria-hidden />`)
+- [x] Update `src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.tsx`
+- [x] Update `src/features/publication-targets/components/PublicationTargetListActions/PublicationTargetListActions.tsx`
+- [x] Update `src/features/publication-targets/components/TargetDetails/TargetDetails.tsx`
+- [x] Update `src/features/publication-targets/components/RemoveTargetForm/RemoveTargetForm.tsx`
+
+### Phase 4 — Type cleanup
+- [x] Update `src/features/publication-targets/types/Publication.d.ts` (re-exports `Publication` from `@/features/publications`; `PublicationTargetWithPublications` deleted)
+- [x] Update `src/features/publication-targets/types/index.d.ts`
+- [x] Update `src/features/publication-targets/index.ts`
+
+### Phase 5 — MSW + tests
+- [x] Update `src/tests/server/handlers/publications.ts` (add `publicationTargetId` filter branch; imports `publications` from `@/tests/mocks/publication-targets`)
+- [x] Update `src/features/publication-targets/components/RemoveTargetForm/RemoveTargetForm.test.tsx`
+- [x] Update `src/features/publication-targets/components/TargetDetails/TargetDetails.test.tsx`
+- [x] Update `src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.test.tsx`
+- [x] Update `src/features/publication-targets/components/PublicationTargetListActions/PublicationTargetListActions.test.tsx` (prop type change)
+- [x] Update `src/features/publication-targets/components/PublicationTargetContainer/PublicationTargetContainer.test.tsx` (was also using `publicationTargetsWithPublications`)
+- [x] Remove `publicationTargetsWithPublications` from `src/tests/mocks/publication-targets.ts`
+
+---
+
+## 10. Implementation Notes
+
+### Type resolution
+`useGetPublicationsByTarget` imports `Publication` from `../types` (the local feature types, which re-exports from `@/features/publications`). `ListPublicationsResponse` comes from `@/api/generated/debArchive.schemas` as agreed. A cast `as Publication[]` bridges the schema type (optional `publicationId`) to the stricter domain type at the API boundary.
+
+### Import paths
+All intra-feature imports of `useGetPublicationsByTarget` use relative paths (e.g. `../../api/useGetPublicationsByTarget`), not the `@/features/publication-targets/api/...` deep-import form, to comply with the ESLint import restriction rule.
+
+### Remaining manual step
+Delete `src/features/publication-targets/api/useGetPublications.ts`. It has no remaining importers after this refactor. Run `pnpm build` after deletion to confirm clean compilation.
+
+### Pre-existing errors (out of scope)
+`PublicationsTable.test.tsx` and `NewPublicationTargetForm/AddPublicationTargetForm.tsx` contain pre-existing type errors unrelated to this refactor. They should be tracked separately.
diff --git a/.github/prompts/architect.prompt.md b/.github/prompts/architect.prompt.md
new file mode 100644
index 000000000..58fe644da
--- /dev/null
+++ b/.github/prompts/architect.prompt.md
@@ -0,0 +1,20 @@
+---
+name: Architect
+description: Plans Landscape UI features without writing implementation code.
+---
+
+You are the **Landscape UI Architect**. You are a senior-level systems designer who prioritizes project consistency and type safety.
+
+## Your Mandatory Workflow
+
+1.  **Identify Ambiguity:** Before planning, ask the user:
+    * "What are the specific REST endpoints involved?"
+    * "Are there specific feature flags controlling this UI?"
+    * "Is this a 'SaaS' only feature or 'Self-hosted' as well?"
+2.  **Referential Integrity:** Cross-reference `src/libs/routes` and `src/components/` to ensure we aren't reinventing wheels.
+3.  **Strict No-Code Policy:** You are a "Blueprinter." You provide the structure, hooks signatures, and data flow. You never provide the function body.
+
+## Response Style
+- Technical, concise, and architectural.
+- Use Mermaid diagrams if the data flow between React Query and components is complex.
+- Always conclude by asking: "Shall I proceed with generating the `.md` plan file in `.github/feature-plans/`, or do we need to adjust the architecture?"
\ No newline at end of file
diff --git a/AGENTS.md b/AGENTS.md
index 3f5d5f6a1..c71715c6e 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -63,3 +63,12 @@ Note: `pnpm test` runs Playwright, not Vitest. Use `pnpm vitest` for unit and co
 Copy `.env.local.example` to `.env.local` and fill in values for your local Landscape instance. Required variables include `VITE_API_URL`, `VITE_API_URL_OLD`, and `VITE_ROOT_PATH`. Set `VITE_MSW_ENABLED=true` to use Mock Service Worker for offline development. See `.env.local.example` for the full list.
 
 Node.js ≥24 is required (`engines` in `package.json`).
+## Agent Failure Protocol
+
+**Stop and ask the user instead of retrying** when:
+
+- A file write (overwrite, truncation, replacement) appears to succeed (exit 0) but the file content does not change on re-read. This indicates VS Code workspace locking or a tool limitation — retrying the same approach will not help.
+- Two different tool strategies for the same operation both fail to produce the expected result.
+- A `replace_string_in_file` cannot find a unique anchor because the target content is duplicated or spans more than ~30 lines.
+
+In these cases: describe the exact manual action needed (file path, line numbers, what to delete/change) and wait for the user to confirm it is done before continuing.
diff --git a/package-lock.json b/package-lock.json
new file mode 100644
index 000000000..6bb1d0f5c
--- /dev/null
+++ b/package-lock.json
@@ -0,0 +1,13179 @@
+{
+  "name": "landscape-ui",
+  "version": "26.04.0.47",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "": {
+      "name": "landscape-ui",
+      "version": "26.04.0.47",
+      "dependencies": {
+        "@canonical/landscape-openapi": ">=0.0.56",
+        "@canonical/react-components": "4.0.0",
+        "@monaco-editor/react": "4.7.0",
+        "@sentry/react": "10.45.0",
+        "@tanstack/react-query": "5.91.2",
+        "axios": "1.13.6",
+        "buffer": "6.0.3",
+        "chart.js": "4.5.1",
+        "classnames": "2.5.1",
+        "downshift": "9.3.2",
+        "formik": "2.4.9",
+        "moment": "2.30.1",
+        "monaco-editor": "0.55.1",
+        "path-to-regexp": "8.3.0",
+        "react": "19.2.4",
+        "react-chartjs-2": "5.3.1",
+        "react-dom": "19.2.4",
+        "react-router": "7.13.1",
+        "usehooks-ts": "3.1.1",
+        "vanilla-framework": "4.46.0",
+        "yup": "1.7.1"
+      },
+      "devDependencies": {
+        "@changesets/cli": "2.30.0",
+        "@eslint/js": "9.39.4",
+        "@playwright/test": "1.58.2",
+        "@testing-library/jest-dom": "6.9.1",
+        "@testing-library/react": "16.3.2",
+        "@testing-library/user-event": "14.6.1",
+        "@types/node": "24.12.0",
+        "@types/react": "19.2.14",
+        "@types/react-dom": "19.2.3",
+        "@types/react-table": "7.7.20",
+        "@vitejs/plugin-react": "6.0.1",
+        "@vitest/coverage-v8": "4.0.18",
+        "eslint": "9.39.4",
+        "eslint-config-prettier": "10.1.8",
+        "eslint-plugin-react": "7.37.5",
+        "eslint-plugin-react-hooks": "7.0.1",
+        "globals": "17.4.0",
+        "jsdom": "29.0.0",
+        "msw": "2.4.11",
+        "prettier": "3.8.1",
+        "sass": "1.98.0",
+        "sass-embedded": "1.98.0",
+        "stylelint": "17.5.0",
+        "stylelint-config-standard-scss": "17.0.0",
+        "stylelint-order": "8.1.1",
+        "typed-css-modules": "0.9.1",
+        "typescript": "5.9.3",
+        "typescript-eslint": "8.57.1",
+        "vite": "8.0.1",
+        "vitest": "4.0.18"
+      },
+      "engines": {
+        "node": ">=24"
+      }
+    },
+    "node_modules/@adobe/css-tools": {
+      "version": "4.4.4",
+      "resolved": "https://registry.npmjs.org/@adobe/css-tools/-/css-tools-4.4.4.tgz",
+      "integrity": "sha512-Elp+iwUx5rN5+Y8xLt5/GRoG20WGoDCQ/1Fb+1LiGtvwbDavuSk0jhD/eZdckHAuzcDzccnkv+rEjyWfRx18gg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@asamuzakjp/css-color": {
+      "version": "5.1.8",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/css-color/-/css-color-5.1.8.tgz",
+      "integrity": "sha512-OISPR9c2uPo23rUdvfEQiLPjoMLOpEeLNnP5iGkxr6tDDxJd3NjD+6fxY0mdaMbIPUjFGL4HFOJqLvow5q4aqQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@csstools/css-calc": "^3.1.1",
+        "@csstools/css-color-parser": "^4.0.2",
+        "@csstools/css-parser-algorithms": "^4.0.0",
+        "@csstools/css-tokenizer": "^4.0.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@asamuzakjp/dom-selector": {
+      "version": "7.0.8",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/dom-selector/-/dom-selector-7.0.8.tgz",
+      "integrity": "sha512-erMO6FgtM02dC24NGm0xufMzWz5OF0wXKR7BpvGD973bq/GbmR8/DbxNZbj0YevQ5hlToJaWSVK/G9/NDgGEVw==",
+      "license": "MIT",
+      "dependencies": {
+        "@asamuzakjp/nwsapi": "^2.3.9",
+        "bidi-js": "^1.0.3",
+        "css-tree": "^3.2.1",
+        "is-potential-custom-element-name": "^1.0.1"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@asamuzakjp/nwsapi": {
+      "version": "2.3.9",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/nwsapi/-/nwsapi-2.3.9.tgz",
+      "integrity": "sha512-n8GuYSrI9bF7FFZ/SjhwevlHc8xaVlb/7HmHelnc/PZXBD2ZR49NnN9sMMuDdEGPeeRQ5d0hqlSlEpgCX3Wl0Q==",
+      "license": "MIT"
+    },
+    "node_modules/@babel/code-frame": {
+      "version": "7.29.0",
+      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.29.0.tgz",
+      "integrity": "sha512-9NhCeYjq9+3uxgdtp20LSiJXJvN0FeCtNGpJxuMFZ1Kv3cWUNb6DOhJwUvcVCzKGR66cw4njwM6hrJLqgOwbcw==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-validator-identifier": "^7.28.5",
+        "js-tokens": "^4.0.0",
+        "picocolors": "^1.1.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/compat-data": {
+      "version": "7.29.0",
+      "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.29.0.tgz",
+      "integrity": "sha512-T1NCJqT/j9+cn8fvkt7jtwbLBfLC/1y1c7NtCeXFRgzGTsafi68MRv8yzkYSapBnFA6L3U2VSc02ciDzoAJhJg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/core": {
+      "version": "7.29.0",
+      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.29.0.tgz",
+      "integrity": "sha512-CGOfOJqWjg2qW/Mb6zNsDm+u5vFQ8DxXfbM09z69p5Z6+mE1ikP2jUXw+j42Pf1XTYED2Rni5f95npYeuwMDQA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/code-frame": "^7.29.0",
+        "@babel/generator": "^7.29.0",
+        "@babel/helper-compilation-targets": "^7.28.6",
+        "@babel/helper-module-transforms": "^7.28.6",
+        "@babel/helpers": "^7.28.6",
+        "@babel/parser": "^7.29.0",
+        "@babel/template": "^7.28.6",
+        "@babel/traverse": "^7.29.0",
+        "@babel/types": "^7.29.0",
+        "@jridgewell/remapping": "^2.3.5",
+        "convert-source-map": "^2.0.0",
+        "debug": "^4.1.0",
+        "gensync": "^1.0.0-beta.2",
+        "json5": "^2.2.3",
+        "semver": "^6.3.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/babel"
+      }
+    },
+    "node_modules/@babel/core/node_modules/semver": {
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      }
+    },
+    "node_modules/@babel/generator": {
+      "version": "7.29.1",
+      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.29.1.tgz",
+      "integrity": "sha512-qsaF+9Qcm2Qv8SRIMMscAvG4O3lJ0F1GuMo5HR/Bp02LopNgnZBC/EkbevHFeGs4ls/oPz9v+Bsmzbkbe+0dUw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/parser": "^7.29.0",
+        "@babel/types": "^7.29.0",
+        "@jridgewell/gen-mapping": "^0.3.12",
+        "@jridgewell/trace-mapping": "^0.3.28",
+        "jsesc": "^3.0.2"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-compilation-targets": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.28.6.tgz",
+      "integrity": "sha512-JYtls3hqi15fcx5GaSNL7SCTJ2MNmjrkHXg4FSpOA/grxK8KwyZ5bubHsCq8FXCkua6xhuaaBit+3b7+VZRfcA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/compat-data": "^7.28.6",
+        "@babel/helper-validator-option": "^7.27.1",
+        "browserslist": "^4.24.0",
+        "lru-cache": "^5.1.1",
+        "semver": "^6.3.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-compilation-targets/node_modules/semver": {
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      }
+    },
+    "node_modules/@babel/helper-globals": {
+      "version": "7.28.0",
+      "resolved": "https://registry.npmjs.org/@babel/helper-globals/-/helper-globals-7.28.0.tgz",
+      "integrity": "sha512-+W6cISkXFa1jXsDEdYA8HeevQT/FULhxzR99pxphltZcVaugps53THCeiWA8SguxxpSp3gKPiuYfSWopkLQ4hw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-module-imports": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.28.6.tgz",
+      "integrity": "sha512-l5XkZK7r7wa9LucGw9LwZyyCUscb4x37JWTPz7swwFE/0FMQAGpiWUZn8u9DzkSBWEcK25jmvubfpw2dnAMdbw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/traverse": "^7.28.6",
+        "@babel/types": "^7.28.6"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-module-transforms": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.28.6.tgz",
+      "integrity": "sha512-67oXFAYr2cDLDVGLXTEABjdBJZ6drElUSI7WKp70NrpyISso3plG9SAGEF6y7zbha/wOzUByWWTJvEDVNIUGcA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-module-imports": "^7.28.6",
+        "@babel/helper-validator-identifier": "^7.28.5",
+        "@babel/traverse": "^7.28.6"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0"
+      }
+    },
+    "node_modules/@babel/helper-string-parser": {
+      "version": "7.27.1",
+      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.27.1.tgz",
+      "integrity": "sha512-qMlSxKbpRlAridDExk92nSobyDdpPijUq2DW6oDnUqd0iOGxmQjyqhMIihI9+zv4LPyZdRje2cavWPbCbWm3eA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-validator-identifier": {
+      "version": "7.28.5",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.28.5.tgz",
+      "integrity": "sha512-qSs4ifwzKJSV39ucNjsvc6WVHs6b7S03sOh2OcHF9UHfVPqWWALUsNUVzhSBiItjRZoLHx7nIarVjqKVusUZ1Q==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-validator-option": {
+      "version": "7.27.1",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.27.1.tgz",
+      "integrity": "sha512-YvjJow9FxbhFFKDSuFnVCe2WxXk1zWc22fFePVNEaWJEu8IrZVlda6N0uHwzZrUM1il7NC9Mlp4MaJYbYd9JSg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helpers": {
+      "version": "7.29.2",
+      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.29.2.tgz",
+      "integrity": "sha512-HoGuUs4sCZNezVEKdVcwqmZN8GoHirLUcLaYVNBK2J0DadGtdcqgr3BCbvH8+XUo4NGjNl3VOtSjEKNzqfFgKw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/template": "^7.28.6",
+        "@babel/types": "^7.29.0"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/parser": {
+      "version": "7.29.2",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.29.2.tgz",
+      "integrity": "sha512-4GgRzy/+fsBa72/RZVJmGKPmZu9Byn8o4MoLpmNe1m8ZfYnz5emHLQz3U4gLud6Zwl0RZIcgiLD7Uq7ySFuDLA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/types": "^7.29.0"
+      },
+      "bin": {
+        "parser": "bin/babel-parser.js"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@babel/runtime": {
+      "version": "7.29.2",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.29.2.tgz",
+      "integrity": "sha512-JiDShH45zKHWyGe4ZNVRrCjBz8Nh9TMmZG1kh4QTK8hCBTWBi8Da+i7s1fJw7/lYpM4ccepSNfqzZ/QvABBi5g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/template": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.28.6.tgz",
+      "integrity": "sha512-YA6Ma2KsCdGb+WC6UpBVFJGXL58MDA6oyONbjyF/+5sBgxY/dwkhLogbMT2GXXyU84/IhRw/2D1Os1B/giz+BQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/code-frame": "^7.28.6",
+        "@babel/parser": "^7.28.6",
+        "@babel/types": "^7.28.6"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/traverse": {
+      "version": "7.29.0",
+      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.29.0.tgz",
+      "integrity": "sha512-4HPiQr0X7+waHfyXPZpWPfWL/J7dcN1mx9gL6WdQVMbPnF3+ZhSMs8tCxN7oHddJE9fhNE7+lxdnlyemKfJRuA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/code-frame": "^7.29.0",
+        "@babel/generator": "^7.29.0",
+        "@babel/helper-globals": "^7.28.0",
+        "@babel/parser": "^7.29.0",
+        "@babel/template": "^7.28.6",
+        "@babel/types": "^7.29.0",
+        "debug": "^4.3.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/types": {
+      "version": "7.29.0",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.29.0.tgz",
+      "integrity": "sha512-LwdZHpScM4Qz8Xw2iKSzS+cfglZzJGvofQICy7W7v4caru4EaAmyUuO6BGrbyQ2mYV11W0U8j5mBhd14dd3B0A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-string-parser": "^7.27.1",
+        "@babel/helper-validator-identifier": "^7.28.5"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@bcoe/v8-coverage": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/@bcoe/v8-coverage/-/v8-coverage-1.0.2.tgz",
+      "integrity": "sha512-6zABk/ECA/QYSCQ1NGiVwwbQerUCZ+TQbp64Q3AgmfNvurHH0j8TtXa1qbShXA6qqkpAj4V5W8pP6mLe1mcMqA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@bramus/specificity": {
+      "version": "2.4.2",
+      "resolved": "https://registry.npmjs.org/@bramus/specificity/-/specificity-2.4.2.tgz",
+      "integrity": "sha512-ctxtJ/eA+t+6q2++vj5j7FYX3nRu311q1wfYH3xjlLOsczhlhxAg2FWNUXhpGvAw3BWo1xBcvOV6/YLc2r5FJw==",
+      "license": "MIT",
+      "dependencies": {
+        "css-tree": "^3.0.0"
+      },
+      "bin": {
+        "specificity": "bin/cli.js"
+      }
+    },
+    "node_modules/@bufbuild/protobuf": {
+      "version": "2.11.0",
+      "resolved": "https://registry.npmjs.org/@bufbuild/protobuf/-/protobuf-2.11.0.tgz",
+      "integrity": "sha512-sBXGT13cpmPR5BMgHE6UEEfEaShh5Ror6rfN3yEK5si7QVrtZg8LEPQb0VVhiLRUslD2yLnXtnRzG035J/mZXQ==",
+      "dev": true,
+      "license": "(Apache-2.0 AND BSD-3-Clause)"
+    },
+    "node_modules/@bundled-es-modules/cookie": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/@bundled-es-modules/cookie/-/cookie-2.0.1.tgz",
+      "integrity": "sha512-8o+5fRPLNbjbdGRRmJj3h6Hh1AQJf2dk3qQ/5ZFb+PXkRNiSoMGGUKlsgLfrxneb72axVJyIYji64E2+nNfYyw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "cookie": "^0.7.2"
+      }
+    },
+    "node_modules/@bundled-es-modules/statuses": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@bundled-es-modules/statuses/-/statuses-1.0.1.tgz",
+      "integrity": "sha512-yn7BklA5acgcBr+7w064fGV+SGIFySjCKpqjcWgBAIfrAkY+4GQTJJHQMeT3V/sgz23VTEVV8TtOmkvJAhFVfg==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "statuses": "^2.0.1"
+      }
+    },
+    "node_modules/@bundled-es-modules/tough-cookie": {
+      "version": "0.1.6",
+      "resolved": "https://registry.npmjs.org/@bundled-es-modules/tough-cookie/-/tough-cookie-0.1.6.tgz",
+      "integrity": "sha512-dvMHbL464C0zI+Yqxbz6kZ5TOEp7GLW+pry/RWndAR8MJQAXZ2rPmIs8tziTZjeIyhSNZgZbCePtfSbdWqStJw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "@types/tough-cookie": "^4.0.5",
+        "tough-cookie": "^4.1.4"
+      }
+    },
+    "node_modules/@bundled-es-modules/tough-cookie/node_modules/tough-cookie": {
+      "version": "4.1.4",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-4.1.4.tgz",
+      "integrity": "sha512-Loo5UUvLD9ScZ6jh8beX1T6sO1w2/MpCRpEP7V280GKMVUQ0Jzar2U3UJPsrdbziLEMMhu3Ujnq//rhiFuIeag==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "psl": "^1.1.33",
+        "punycode": "^2.1.1",
+        "universalify": "^0.2.0",
+        "url-parse": "^1.5.3"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@bundled-es-modules/tough-cookie/node_modules/universalify": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.2.0.tgz",
+      "integrity": "sha512-CJ1QgKmNg3CwvAv/kOFmtnEN05f0D/cn9QntgNOQlQF9dgvVTHj3t+8JPdjqawCHk7V/KA+fbUqzZ9XWhcqPUg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4.0.0"
+      }
+    },
+    "node_modules/@cacheable/memory": {
+      "version": "2.0.8",
+      "resolved": "https://registry.npmjs.org/@cacheable/memory/-/memory-2.0.8.tgz",
+      "integrity": "sha512-FvEb29x5wVwu/Kf93IWwsOOEuhHh6dYCJF3vcKLzXc0KXIW181AOzv6ceT4ZpBHDvAfG60eqb+ekmrnLHIy+jw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@cacheable/utils": "^2.4.0",
+        "@keyv/bigmap": "^1.3.1",
+        "hookified": "^1.15.1",
+        "keyv": "^5.6.0"
+      }
+    },
+    "node_modules/@cacheable/memory/node_modules/@keyv/bigmap": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/@keyv/bigmap/-/bigmap-1.3.1.tgz",
+      "integrity": "sha512-WbzE9sdmQtKy8vrNPa9BRnwZh5UF4s1KTmSK0KUVLo3eff5BlQNNWDnFOouNpKfPKDnms9xynJjsMYjMaT/aFQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "hashery": "^1.4.0",
+        "hookified": "^1.15.0"
+      },
+      "engines": {
+        "node": ">= 18"
+      },
+      "peerDependencies": {
+        "keyv": "^5.6.0"
+      }
+    },
+    "node_modules/@cacheable/memory/node_modules/keyv": {
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/keyv/-/keyv-5.6.0.tgz",
+      "integrity": "sha512-CYDD3SOtsHtyXeEORYRx2qBtpDJFjRTGXUtmNEMGyzYOKj1TE3tycdlho7kA1Ufx9OYWZzg52QFBGALTirzDSw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@keyv/serialize": "^1.1.1"
+      }
+    },
+    "node_modules/@cacheable/utils": {
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/@cacheable/utils/-/utils-2.4.1.tgz",
+      "integrity": "sha512-eiFgzCbIneyMlLOmNG4g9xzF7Hv3Mga4LjxjcSC/ues6VYq2+gUbQI8JqNuw/ZM8tJIeIaBGpswAsqV2V7ApgA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "hashery": "^1.5.1",
+        "keyv": "^5.6.0"
+      }
+    },
+    "node_modules/@cacheable/utils/node_modules/keyv": {
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/keyv/-/keyv-5.6.0.tgz",
+      "integrity": "sha512-CYDD3SOtsHtyXeEORYRx2qBtpDJFjRTGXUtmNEMGyzYOKj1TE3tycdlho7kA1Ufx9OYWZzg52QFBGALTirzDSw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@keyv/serialize": "^1.1.1"
+      }
+    },
+    "node_modules/@canonical/landscape-openapi": {
+      "version": ">=0.0.56",
+      "resolved": "https://registry.npmjs.org/@canonical/landscape-openapi/-/landscape-openapi-0.0.46.tgz",
+      "integrity": "sha512-iNdqs9gkkxo1CUlbX+GBj7hfuWTsg+6fEc79VZWG832wmzvfQVTjp8IR23aN9b0SuCqd07VaIUW1ZKW0jBBCKw=="
+    },
+    "node_modules/@canonical/react-components": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@canonical/react-components/-/react-components-4.0.0.tgz",
+      "integrity": "sha512-gcBSNW6M7dcKJhfGBn2Bw0jZj0BNYcKWNK12utmmWtzXmzkulgMHywTAd5ZXdI3TCYKxY1zyw5BZNQeYO+TsFA==",
+      "license": "LGPL-3.0",
+      "dependencies": {
+        "@types/jest": "30.0.0",
+        "@types/node": "20.19.30",
+        "@types/react": "19.2.0",
+        "@types/react-dom": "19.2.0",
+        "@types/react-table": "7.7.20",
+        "classnames": "2.5.1",
+        "fast-deep-equal": "3.1.3",
+        "jest-environment-jsdom": "30.2.0",
+        "prop-types": "15.8.1",
+        "react-table": "7.8.0"
+      },
+      "peerDependencies": {
+        "@types/react": "^18.0.0 || ^19.0.0",
+        "@types/react-dom": "^18.0.0 || ^19.0.0",
+        "formik": "^2.4.5",
+        "react": "^18.0.0 || ^19.0.0",
+        "react-dom": "^18.0.0 || ^19.0.0",
+        "vanilla-framework": "^3.15.1 || ^4.0.0"
+      }
+    },
+    "node_modules/@canonical/react-components/node_modules/@types/node": {
+      "version": "20.19.30",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.19.30.tgz",
+      "integrity": "sha512-WJtwWJu7UdlvzEAUm484QNg5eAoq5QR08KDNx7g45Usrs2NtOPiX8ugDqmKdXkyL03rBqU5dYNYVQetEpBHq2g==",
+      "license": "MIT",
+      "dependencies": {
+        "undici-types": "~6.21.0"
+      }
+    },
+    "node_modules/@canonical/react-components/node_modules/@types/react": {
+      "version": "19.2.0",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.0.tgz",
+      "integrity": "sha512-1LOH8xovvsKsCBq1wnT4ntDUdCJKmnEakhsuoUSy6ExlHCkGP2hqnatagYTgFk6oeL0VU31u7SNjunPN+GchtA==",
+      "license": "MIT",
+      "dependencies": {
+        "csstype": "^3.0.2"
+      }
+    },
+    "node_modules/@canonical/react-components/node_modules/@types/react-dom": {
+      "version": "19.2.0",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-19.2.0.tgz",
+      "integrity": "sha512-brtBs0MnE9SMx7px208g39lRmC5uHZs96caOJfTjFcYSLHNamvaSMfJNagChVNkup2SdtOxKX1FDBkRSJe1ZAg==",
+      "license": "MIT",
+      "peerDependencies": {
+        "@types/react": "^19.2.0"
+      }
+    },
+    "node_modules/@canonical/react-components/node_modules/react-table": {
+      "version": "7.8.0",
+      "resolved": "https://registry.npmjs.org/react-table/-/react-table-7.8.0.tgz",
+      "integrity": "sha512-hNaz4ygkZO4bESeFfnfOft73iBUj8K5oKi1EcSHPAibEydfsX2MyU6Z8KCr3mv3C9Kqqh71U+DhZkFvibbnPbA==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      },
+      "peerDependencies": {
+        "react": "^16.8.3 || ^17.0.0-0 || ^18.0.0"
+      }
+    },
+    "node_modules/@canonical/react-components/node_modules/undici-types": {
+      "version": "6.21.0",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.21.0.tgz",
+      "integrity": "sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==",
+      "license": "MIT"
+    },
+    "node_modules/@changesets/apply-release-plan": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/@changesets/apply-release-plan/-/apply-release-plan-7.1.0.tgz",
+      "integrity": "sha512-yq8ML3YS7koKQ/9bk1PqO0HMzApIFNwjlwCnwFEXMzNe8NpzeeYYKCmnhWJGkN8g7E51MnWaSbqRcTcdIxUgnQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@changesets/config": "^3.1.3",
+        "@changesets/get-version-range-type": "^0.4.0",
+        "@changesets/git": "^3.0.4",
+        "@changesets/should-skip-package": "^0.1.2",
+        "@changesets/types": "^6.1.0",
+        "@manypkg/get-packages": "^1.1.3",
+        "detect-indent": "^6.0.0",
+        "fs-extra": "^7.0.1",
+        "lodash.startcase": "^4.4.0",
+        "outdent": "^0.5.0",
+        "prettier": "^2.7.1",
+        "resolve-from": "^5.0.0",
+        "semver": "^7.5.3"
+      }
+    },
+    "node_modules/@changesets/apply-release-plan/node_modules/prettier": {
+      "version": "2.8.8",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.8.tgz",
+      "integrity": "sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "prettier": "bin-prettier.js"
+      },
+      "engines": {
+        "node": ">=10.13.0"
+      },
+      "funding": {
+        "url": "https://github.com/prettier/prettier?sponsor=1"
+      }
+    },
+    "node_modules/@changesets/assemble-release-plan": {
+      "version": "6.0.9",
+      "resolved": "https://registry.npmjs.org/@changesets/assemble-release-plan/-/assemble-release-plan-6.0.9.tgz",
+      "integrity": "sha512-tPgeeqCHIwNo8sypKlS3gOPmsS3wP0zHt67JDuL20P4QcXiw/O4Hl7oXiuLnP9yg+rXLQ2sScdV1Kkzde61iSQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@changesets/errors": "^0.2.0",
+        "@changesets/get-dependents-graph": "^2.1.3",
+        "@changesets/should-skip-package": "^0.1.2",
+        "@changesets/types": "^6.1.0",
+        "@manypkg/get-packages": "^1.1.3",
+        "semver": "^7.5.3"
+      }
+    },
+    "node_modules/@changesets/changelog-git": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/@changesets/changelog-git/-/changelog-git-0.2.1.tgz",
+      "integrity": "sha512-x/xEleCFLH28c3bQeQIyeZf8lFXyDFVn1SgcBiR2Tw/r4IAWlk1fzxCEZ6NxQAjF2Nwtczoen3OA2qR+UawQ8Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@changesets/types": "^6.1.0"
+      }
+    },
+    "node_modules/@changesets/cli": {
+      "version": "2.30.0",
+      "resolved": "https://registry.npmjs.org/@changesets/cli/-/cli-2.30.0.tgz",
+      "integrity": "sha512-5D3Nk2JPqMI1wK25pEymeWRSlSMdo5QOGlyfrKg0AOufrUcjEE3RQgaCpHoBiM31CSNrtSgdJ0U6zL1rLDDfBA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@changesets/apply-release-plan": "^7.1.0",
+        "@changesets/assemble-release-plan": "^6.0.9",
+        "@changesets/changelog-git": "^0.2.1",
+        "@changesets/config": "^3.1.3",
+        "@changesets/errors": "^0.2.0",
+        "@changesets/get-dependents-graph": "^2.1.3",
+        "@changesets/get-release-plan": "^4.0.15",
+        "@changesets/git": "^3.0.4",
+        "@changesets/logger": "^0.1.1",
+        "@changesets/pre": "^2.0.2",
+        "@changesets/read": "^0.6.7",
+        "@changesets/should-skip-package": "^0.1.2",
+        "@changesets/types": "^6.1.0",
+        "@changesets/write": "^0.4.0",
+        "@inquirer/external-editor": "^1.0.2",
+        "@manypkg/get-packages": "^1.1.3",
+        "ansi-colors": "^4.1.3",
+        "enquirer": "^2.4.1",
+        "fs-extra": "^7.0.1",
+        "mri": "^1.2.0",
+        "package-manager-detector": "^0.2.0",
+        "picocolors": "^1.1.0",
+        "resolve-from": "^5.0.0",
+        "semver": "^7.5.3",
+        "spawndamnit": "^3.0.1",
+        "term-size": "^2.1.0"
+      },
+      "bin": {
+        "changeset": "bin.js"
+      }
+    },
+    "node_modules/@changesets/config": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/@changesets/config/-/config-3.1.3.tgz",
+      "integrity": "sha512-vnXjcey8YgBn2L1OPWd3ORs0bGC4LoYcK/ubpgvzNVr53JXV5GiTVj7fWdMRsoKUH7hhhMAQnsJUqLr21EncNw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@changesets/errors": "^0.2.0",
+        "@changesets/get-dependents-graph": "^2.1.3",
+        "@changesets/logger": "^0.1.1",
+        "@changesets/should-skip-package": "^0.1.2",
+        "@changesets/types": "^6.1.0",
+        "@manypkg/get-packages": "^1.1.3",
+        "fs-extra": "^7.0.1",
+        "micromatch": "^4.0.8"
+      }
+    },
+    "node_modules/@changesets/errors": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/@changesets/errors/-/errors-0.2.0.tgz",
+      "integrity": "sha512-6BLOQUscTpZeGljvyQXlWOItQyU71kCdGz7Pi8H8zdw6BI0g3m43iL4xKUVPWtG+qrrL9DTjpdn8eYuCQSRpow==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "extendable-error": "^0.1.5"
+      }
+    },
+    "node_modules/@changesets/get-dependents-graph": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/@changesets/get-dependents-graph/-/get-dependents-graph-2.1.3.tgz",
+      "integrity": "sha512-gphr+v0mv2I3Oxt19VdWRRUxq3sseyUpX9DaHpTUmLj92Y10AGy+XOtV+kbM6L/fDcpx7/ISDFK6T8A/P3lOdQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@changesets/types": "^6.1.0",
+        "@manypkg/get-packages": "^1.1.3",
+        "picocolors": "^1.1.0",
+        "semver": "^7.5.3"
+      }
+    },
+    "node_modules/@changesets/get-release-plan": {
+      "version": "4.0.15",
+      "resolved": "https://registry.npmjs.org/@changesets/get-release-plan/-/get-release-plan-4.0.15.tgz",
+      "integrity": "sha512-Q04ZaRPuEVZtA+auOYgFaVQQSA98dXiVe/yFaZfY7hoSmQICHGvP0TF4u3EDNHWmmCS4ekA/XSpKlSM2PyTS2g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@changesets/assemble-release-plan": "^6.0.9",
+        "@changesets/config": "^3.1.3",
+        "@changesets/pre": "^2.0.2",
+        "@changesets/read": "^0.6.7",
+        "@changesets/types": "^6.1.0",
+        "@manypkg/get-packages": "^1.1.3"
+      }
+    },
+    "node_modules/@changesets/get-version-range-type": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/@changesets/get-version-range-type/-/get-version-range-type-0.4.0.tgz",
+      "integrity": "sha512-hwawtob9DryoGTpixy1D3ZXbGgJu1Rhr+ySH2PvTLHvkZuQ7sRT4oQwMh0hbqZH1weAooedEjRsbrWcGLCeyVQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@changesets/git": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@changesets/git/-/git-3.0.4.tgz",
+      "integrity": "sha512-BXANzRFkX+XcC1q/d27NKvlJ1yf7PSAgi8JG6dt8EfbHFHi4neau7mufcSca5zRhwOL8j9s6EqsxmT+s+/E6Sw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@changesets/errors": "^0.2.0",
+        "@manypkg/get-packages": "^1.1.3",
+        "is-subdir": "^1.1.1",
+        "micromatch": "^4.0.8",
+        "spawndamnit": "^3.0.1"
+      }
+    },
+    "node_modules/@changesets/logger": {
+      "version": "0.1.1",
+      "resolved": "https://registry.npmjs.org/@changesets/logger/-/logger-0.1.1.tgz",
+      "integrity": "sha512-OQtR36ZlnuTxKqoW4Sv6x5YIhOmClRd5pWsjZsddYxpWs517R0HkyiefQPIytCVh4ZcC5x9XaG8KTdd5iRQUfg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "picocolors": "^1.1.0"
+      }
+    },
+    "node_modules/@changesets/parse": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/@changesets/parse/-/parse-0.4.3.tgz",
+      "integrity": "sha512-ZDmNc53+dXdWEv7fqIUSgRQOLYoUom5Z40gmLgmATmYR9NbL6FJJHwakcCpzaeCy+1D0m0n7mT4jj2B/MQPl7A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@changesets/types": "^6.1.0",
+        "js-yaml": "^4.1.1"
+      }
+    },
+    "node_modules/@changesets/pre": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/@changesets/pre/-/pre-2.0.2.tgz",
+      "integrity": "sha512-HaL/gEyFVvkf9KFg6484wR9s0qjAXlZ8qWPDkTyKF6+zqjBe/I2mygg3MbpZ++hdi0ToqNUF8cjj7fBy0dg8Ug==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@changesets/errors": "^0.2.0",
+        "@changesets/types": "^6.1.0",
+        "@manypkg/get-packages": "^1.1.3",
+        "fs-extra": "^7.0.1"
+      }
+    },
+    "node_modules/@changesets/read": {
+      "version": "0.6.7",
+      "resolved": "https://registry.npmjs.org/@changesets/read/-/read-0.6.7.tgz",
+      "integrity": "sha512-D1G4AUYGrBEk8vj8MGwf75k9GpN6XL3wg8i42P2jZZwFLXnlr2Pn7r9yuQNbaMCarP7ZQWNJbV6XLeysAIMhTA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@changesets/git": "^3.0.4",
+        "@changesets/logger": "^0.1.1",
+        "@changesets/parse": "^0.4.3",
+        "@changesets/types": "^6.1.0",
+        "fs-extra": "^7.0.1",
+        "p-filter": "^2.1.0",
+        "picocolors": "^1.1.0"
+      }
+    },
+    "node_modules/@changesets/should-skip-package": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/@changesets/should-skip-package/-/should-skip-package-0.1.2.tgz",
+      "integrity": "sha512-qAK/WrqWLNCP22UDdBTMPH5f41elVDlsNyat180A33dWxuUDyNpg6fPi/FyTZwRriVjg0L8gnjJn2F9XAoF0qw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@changesets/types": "^6.1.0",
+        "@manypkg/get-packages": "^1.1.3"
+      }
+    },
+    "node_modules/@changesets/types": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/@changesets/types/-/types-6.1.0.tgz",
+      "integrity": "sha512-rKQcJ+o1nKNgeoYRHKOS07tAMNd3YSN0uHaJOZYjBAgxfV7TUE7JE+z4BzZdQwb5hKaYbayKN5KrYV7ODb2rAA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@changesets/write": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/@changesets/write/-/write-0.4.0.tgz",
+      "integrity": "sha512-CdTLvIOPiCNuH71pyDu3rA+Q0n65cmAbXnwWH84rKGiFumFzkmHNT8KHTMEchcxN+Kl8I54xGUhJ7l3E7X396Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@changesets/types": "^6.1.0",
+        "fs-extra": "^7.0.1",
+        "human-id": "^4.1.1",
+        "prettier": "^2.7.1"
+      }
+    },
+    "node_modules/@changesets/write/node_modules/prettier": {
+      "version": "2.8.8",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.8.8.tgz",
+      "integrity": "sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "prettier": "bin-prettier.js"
+      },
+      "engines": {
+        "node": ">=10.13.0"
+      },
+      "funding": {
+        "url": "https://github.com/prettier/prettier?sponsor=1"
+      }
+    },
+    "node_modules/@csstools/color-helpers": {
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/@csstools/color-helpers/-/color-helpers-6.0.2.tgz",
+      "integrity": "sha512-LMGQLS9EuADloEFkcTBR3BwV/CGHV7zyDxVRtVDTwdI2Ca4it0CCVTT9wCkxSgokjE5Ho41hEPgb8OEUwoXr6Q==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT-0",
+      "engines": {
+        "node": ">=20.19.0"
+      }
+    },
+    "node_modules/@csstools/css-calc": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/@csstools/css-calc/-/css-calc-3.1.1.tgz",
+      "integrity": "sha512-HJ26Z/vmsZQqs/o3a6bgKslXGFAungXGbinULZO3eMsOyNJHeBBZfup5FiZInOghgoM4Hwnmw+OgbJCNg1wwUQ==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.19.0"
+      },
+      "peerDependencies": {
+        "@csstools/css-parser-algorithms": "^4.0.0",
+        "@csstools/css-tokenizer": "^4.0.0"
+      }
+    },
+    "node_modules/@csstools/css-color-parser": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/@csstools/css-color-parser/-/css-color-parser-4.0.2.tgz",
+      "integrity": "sha512-0GEfbBLmTFf0dJlpsNU7zwxRIH0/BGEMuXLTCvFYxuL1tNhqzTbtnFICyJLTNK4a+RechKP75e7w42ClXSnJQw==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@csstools/color-helpers": "^6.0.2",
+        "@csstools/css-calc": "^3.1.1"
+      },
+      "engines": {
+        "node": ">=20.19.0"
+      },
+      "peerDependencies": {
+        "@csstools/css-parser-algorithms": "^4.0.0",
+        "@csstools/css-tokenizer": "^4.0.0"
+      }
+    },
+    "node_modules/@csstools/css-parser-algorithms": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-4.0.0.tgz",
+      "integrity": "sha512-+B87qS7fIG3L5h3qwJ/IFbjoVoOe/bpOdh9hAjXbvx0o8ImEmUsGXN0inFOnk2ChCFgqkkGFQ+TpM5rbhkKe4w==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.19.0"
+      },
+      "peerDependencies": {
+        "@csstools/css-tokenizer": "^4.0.0"
+      }
+    },
+    "node_modules/@csstools/css-syntax-patches-for-csstree": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/@csstools/css-syntax-patches-for-csstree/-/css-syntax-patches-for-csstree-1.1.2.tgz",
+      "integrity": "sha512-5GkLzz4prTIpoyeUiIu3iV6CSG3Plo7xRVOFPKI7FVEJ3mZ0A8SwK0XU3Gl7xAkiQ+mDyam+NNp875/C5y+jSA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT-0",
+      "peerDependencies": {
+        "css-tree": "^3.2.1"
+      },
+      "peerDependenciesMeta": {
+        "css-tree": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@csstools/css-tokenizer": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-4.0.0.tgz",
+      "integrity": "sha512-QxULHAm7cNu72w97JUNCBFODFaXpbDg+dP8b/oWFAZ2MTRppA3U00Y2L1HqaS4J6yBqxwa/Y3nMBaxVKbB/NsA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.19.0"
+      }
+    },
+    "node_modules/@csstools/media-query-list-parser": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/@csstools/media-query-list-parser/-/media-query-list-parser-5.0.0.tgz",
+      "integrity": "sha512-T9lXmZOfnam3eMERPsszjY5NK0jX8RmThmmm99FZ8b7z8yMaFZWKwLWGZuTwdO3ddRY5fy13GmmEYZXB4I98Eg==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.19.0"
+      },
+      "peerDependencies": {
+        "@csstools/css-parser-algorithms": "^4.0.0",
+        "@csstools/css-tokenizer": "^4.0.0"
+      }
+    },
+    "node_modules/@csstools/selector-resolve-nested": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@csstools/selector-resolve-nested/-/selector-resolve-nested-4.0.0.tgz",
+      "integrity": "sha512-9vAPxmp+Dx3wQBIUwc1v7Mdisw1kbbaGqXUM8QLTgWg7SoPGYtXBsMXvsFs/0Bn5yoFhcktzxNZGNaUt0VjgjA==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT-0",
+      "engines": {
+        "node": ">=20.19.0"
+      },
+      "peerDependencies": {
+        "postcss-selector-parser": "^7.1.1"
+      }
+    },
+    "node_modules/@csstools/selector-specificity": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/@csstools/selector-specificity/-/selector-specificity-6.0.0.tgz",
+      "integrity": "sha512-4sSgl78OtOXEX/2d++8A83zHNTgwCJMaR24FvsYL7Uf/VS8HZk9PTwR51elTbGqMuwH3szLvvOXEaVnqn0Z3zA==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT-0",
+      "engines": {
+        "node": ">=20.19.0"
+      },
+      "peerDependencies": {
+        "postcss-selector-parser": "^7.1.1"
+      }
+    },
+    "node_modules/@emnapi/core": {
+      "version": "1.9.2",
+      "resolved": "https://registry.npmjs.org/@emnapi/core/-/core-1.9.2.tgz",
+      "integrity": "sha512-UC+ZhH3XtczQYfOlu3lNEkdW/p4dsJ1r/bP7H8+rhao3TTTMO1ATq/4DdIi23XuGoFY+Cz0JmCbdVl0hz9jZcA==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "peer": true,
+      "dependencies": {
+        "@emnapi/wasi-threads": "1.2.1",
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@emnapi/runtime": {
+      "version": "1.9.2",
+      "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.9.2.tgz",
+      "integrity": "sha512-3U4+MIWHImeyu1wnmVygh5WlgfYDtyf0k8AbLhMFxOipihf6nrWC4syIm/SwEeec0mNSafiiNnMJwbza/Is6Lw==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "peer": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@emnapi/wasi-threads": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@emnapi/wasi-threads/-/wasi-threads-1.2.1.tgz",
+      "integrity": "sha512-uTII7OYF+/Mes/MrcIOYp5yOtSMLBWSIoLPpcgwipoiKbli6k322tcoFsxoIIxPDqW01SQGAgko4EzZi2BNv2w==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "peer": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@esbuild/aix-ppc64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.7.tgz",
+      "integrity": "sha512-EKX3Qwmhz1eMdEJokhALr0YiD0lhQNwDqkPYyPhiSwKrh7/4KRjQc04sZ8db+5DVVnZ1LmbNDI1uAMPEUBnQPg==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "aix"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/android-arm": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.7.tgz",
+      "integrity": "sha512-jbPXvB4Yj2yBV7HUfE2KHe4GJX51QplCN1pGbYjvsyCZbQmies29EoJbkEc+vYuU5o45AfQn37vZlyXy4YJ8RQ==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/android-arm64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.7.tgz",
+      "integrity": "sha512-62dPZHpIXzvChfvfLJow3q5dDtiNMkwiRzPylSCfriLvZeq0a1bWChrGx/BbUbPwOrsWKMn8idSllklzBy+dgQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/android-x64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.7.tgz",
+      "integrity": "sha512-x5VpMODneVDb70PYV2VQOmIUUiBtY3D3mPBG8NxVk5CogneYhkR7MmM3yR/uMdITLrC1ml/NV1rj4bMJuy9MCg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/darwin-arm64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.7.tgz",
+      "integrity": "sha512-5lckdqeuBPlKUwvoCXIgI2D9/ABmPq3Rdp7IfL70393YgaASt7tbju3Ac+ePVi3KDH6N2RqePfHnXkaDtY9fkw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/darwin-x64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.7.tgz",
+      "integrity": "sha512-rYnXrKcXuT7Z+WL5K980jVFdvVKhCHhUwid+dDYQpH+qu+TefcomiMAJpIiC2EM3Rjtq0sO3StMV/+3w3MyyqQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/freebsd-arm64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.7.tgz",
+      "integrity": "sha512-B48PqeCsEgOtzME2GbNM2roU29AMTuOIN91dsMO30t+Ydis3z/3Ngoj5hhnsOSSwNzS+6JppqWsuhTp6E82l2w==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/freebsd-x64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.7.tgz",
+      "integrity": "sha512-jOBDK5XEjA4m5IJK3bpAQF9/Lelu/Z9ZcdhTRLf4cajlB+8VEhFFRjWgfy3M1O4rO2GQ/b2dLwCUGpiF/eATNQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-arm": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.7.tgz",
+      "integrity": "sha512-RkT/YXYBTSULo3+af8Ib0ykH8u2MBh57o7q/DAs3lTJlyVQkgQvlrPTnjIzzRPQyavxtPtfg0EopvDyIt0j1rA==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-arm64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.7.tgz",
+      "integrity": "sha512-RZPHBoxXuNnPQO9rvjh5jdkRmVizktkT7TCDkDmQ0W2SwHInKCAV95GRuvdSvA7w4VMwfCjUiPwDi0ZO6Nfe9A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-ia32": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.7.tgz",
+      "integrity": "sha512-GA48aKNkyQDbd3KtkplYWT102C5sn/EZTY4XROkxONgruHPU72l+gW+FfF8tf2cFjeHaRbWpOYa/uRBz/Xq1Pg==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-loong64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.7.tgz",
+      "integrity": "sha512-a4POruNM2oWsD4WKvBSEKGIiWQF8fZOAsycHOt6JBpZ+JN2n2JH9WAv56SOyu9X5IqAjqSIPTaJkqN8F7XOQ5Q==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-mips64el": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.7.tgz",
+      "integrity": "sha512-KabT5I6StirGfIz0FMgl1I+R1H73Gp0ofL9A3nG3i/cYFJzKHhouBV5VWK1CSgKvVaG4q1RNpCTR2LuTVB3fIw==",
+      "cpu": [
+        "mips64el"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-ppc64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.7.tgz",
+      "integrity": "sha512-gRsL4x6wsGHGRqhtI+ifpN/vpOFTQtnbsupUF5R5YTAg+y/lKelYR1hXbnBdzDjGbMYjVJLJTd2OFmMewAgwlQ==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-riscv64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.7.tgz",
+      "integrity": "sha512-hL25LbxO1QOngGzu2U5xeXtxXcW+/GvMN3ejANqXkxZ/opySAZMrc+9LY/WyjAan41unrR3YrmtTsUpwT66InQ==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-s390x": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.7.tgz",
+      "integrity": "sha512-2k8go8Ycu1Kb46vEelhu1vqEP+UeRVj2zY1pSuPdgvbd5ykAw82Lrro28vXUrRmzEsUV0NzCf54yARIK8r0fdw==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-x64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.7.tgz",
+      "integrity": "sha512-hzznmADPt+OmsYzw1EE33ccA+HPdIqiCRq7cQeL1Jlq2gb1+OyWBkMCrYGBJ+sxVzve2ZJEVeePbLM2iEIZSxA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/netbsd-arm64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.7.tgz",
+      "integrity": "sha512-b6pqtrQdigZBwZxAn1UpazEisvwaIDvdbMbmrly7cDTMFnw/+3lVxxCTGOrkPVnsYIosJJXAsILG9XcQS+Yu6w==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/netbsd-x64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.7.tgz",
+      "integrity": "sha512-OfatkLojr6U+WN5EDYuoQhtM+1xco+/6FSzJJnuWiUw5eVcicbyK3dq5EeV/QHT1uy6GoDhGbFpprUiHUYggrw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/openbsd-arm64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.7.tgz",
+      "integrity": "sha512-AFuojMQTxAz75Fo8idVcqoQWEHIXFRbOc1TrVcFSgCZtQfSdc1RXgB3tjOn/krRHENUB4j00bfGjyl2mJrU37A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/openbsd-x64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.7.tgz",
+      "integrity": "sha512-+A1NJmfM8WNDv5CLVQYJ5PshuRm/4cI6WMZRg1by1GwPIQPCTs1GLEUHwiiQGT5zDdyLiRM/l1G0Pv54gvtKIg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/openharmony-arm64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.7.tgz",
+      "integrity": "sha512-+KrvYb/C8zA9CU/g0sR6w2RBw7IGc5J2BPnc3dYc5VJxHCSF1yNMxTV5LQ7GuKteQXZtspjFbiuW5/dOj7H4Yw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openharmony"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/sunos-x64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.7.tgz",
+      "integrity": "sha512-ikktIhFBzQNt/QDyOL580ti9+5mL/YZeUPKU2ivGtGjdTYoqz6jObj6nOMfhASpS4GU4Q/Clh1QtxWAvcYKamA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "sunos"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/win32-arm64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.7.tgz",
+      "integrity": "sha512-7yRhbHvPqSpRUV7Q20VuDwbjW5kIMwTHpptuUzV+AA46kiPze5Z7qgt6CLCK3pWFrHeNfDd1VKgyP4O+ng17CA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/win32-ia32": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.7.tgz",
+      "integrity": "sha512-SmwKXe6VHIyZYbBLJrhOoCJRB/Z1tckzmgTLfFYOfpMAx63BJEaL9ExI8x7v0oAO3Zh6D/Oi1gVxEYr5oUCFhw==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/win32-x64": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.7.tgz",
+      "integrity": "sha512-56hiAJPhwQ1R4i+21FVF7V8kSD5zZTdHcVuRFMW0hn753vVfQN8xlx4uOPT4xoGH0Z/oVATuR82AiqSTDIpaHg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@eslint-community/eslint-utils": {
+      "version": "4.9.1",
+      "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.9.1.tgz",
+      "integrity": "sha512-phrYmNiYppR7znFEdqgfWHXR6NCkZEK7hwWDHZUjit/2/U0r6XvkDl0SYnoM51Hq7FhCGdLDT6zxCCOY1hexsQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "eslint-visitor-keys": "^3.4.3"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^6.0.0 || ^7.0.0 || >=8.0.0"
+      }
+    },
+    "node_modules/@eslint-community/eslint-utils/node_modules/eslint-visitor-keys": {
+      "version": "3.4.3",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz",
+      "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/@eslint-community/regexpp": {
+      "version": "4.12.2",
+      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.12.2.tgz",
+      "integrity": "sha512-EriSTlt5OC9/7SXkRSCAhfSxxoSUgBm33OH+IkwbdpgoqsSsUg7y3uh+IICI/Qg4BBWr3U2i39RpmycbxMq4ew==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^12.0.0 || ^14.0.0 || >=16.0.0"
+      }
+    },
+    "node_modules/@eslint/config-array": {
+      "version": "0.21.2",
+      "resolved": "https://registry.npmjs.org/@eslint/config-array/-/config-array-0.21.2.tgz",
+      "integrity": "sha512-nJl2KGTlrf9GjLimgIru+V/mzgSK0ABCDQRvxw5BjURL7WfH5uoWmizbH7QB6MmnMBd8cIC9uceWnezL1VZWWw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@eslint/object-schema": "^2.1.7",
+        "debug": "^4.3.1",
+        "minimatch": "^3.1.5"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      }
+    },
+    "node_modules/@eslint/config-helpers": {
+      "version": "0.4.2",
+      "resolved": "https://registry.npmjs.org/@eslint/config-helpers/-/config-helpers-0.4.2.tgz",
+      "integrity": "sha512-gBrxN88gOIf3R7ja5K9slwNayVcZgK6SOUORm2uBzTeIEfeVaIhOpCtTox3P6R7o2jLFwLFTLnC7kU/RGcYEgw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@eslint/core": "^0.17.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      }
+    },
+    "node_modules/@eslint/core": {
+      "version": "0.17.0",
+      "resolved": "https://registry.npmjs.org/@eslint/core/-/core-0.17.0.tgz",
+      "integrity": "sha512-yL/sLrpmtDaFEiUj1osRP4TI2MDz1AddJL+jZ7KSqvBuliN4xqYY54IfdN8qD8Toa6g1iloph1fxQNkjOxrrpQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@types/json-schema": "^7.0.15"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      }
+    },
+    "node_modules/@eslint/eslintrc": {
+      "version": "3.3.5",
+      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-3.3.5.tgz",
+      "integrity": "sha512-4IlJx0X0qftVsN5E+/vGujTRIFtwuLbNsVUe7TO6zYPDR1O6nFwvwhIKEKSrl6dZchmYBITazxKoUYOjdtjlRg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ajv": "^6.14.0",
+        "debug": "^4.3.2",
+        "espree": "^10.0.1",
+        "globals": "^14.0.0",
+        "ignore": "^5.2.0",
+        "import-fresh": "^3.2.1",
+        "js-yaml": "^4.1.1",
+        "minimatch": "^3.1.5",
+        "strip-json-comments": "^3.1.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/@eslint/eslintrc/node_modules/globals": {
+      "version": "14.0.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-14.0.0.tgz",
+      "integrity": "sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@eslint/js": {
+      "version": "9.39.4",
+      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.39.4.tgz",
+      "integrity": "sha512-nE7DEIchvtiFTwBw4Lfbu59PG+kCofhjsKaCWzxTpt4lfRjRMqG6uMBzKXuEcyXhOHoUp9riAm7/aWYGhXZ9cw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://eslint.org/donate"
+      }
+    },
+    "node_modules/@eslint/object-schema": {
+      "version": "2.1.7",
+      "resolved": "https://registry.npmjs.org/@eslint/object-schema/-/object-schema-2.1.7.tgz",
+      "integrity": "sha512-VtAOaymWVfZcmZbp6E2mympDIHvyjXs/12LqWYjVw6qjrfF+VK+fyG33kChz3nnK+SU5/NeHOqrTEHS8sXO3OA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      }
+    },
+    "node_modules/@eslint/plugin-kit": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.4.1.tgz",
+      "integrity": "sha512-43/qtrDUokr7LJqoF2c3+RInu/t4zfrpYdoSDfYyhg52rwLV6TnOvdG4fXm7IkSB3wErkcmJS9iEhjVtOSEjjA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@eslint/core": "^0.17.0",
+        "levn": "^0.4.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      }
+    },
+    "node_modules/@exodus/bytes": {
+      "version": "1.15.0",
+      "resolved": "https://registry.npmjs.org/@exodus/bytes/-/bytes-1.15.0.tgz",
+      "integrity": "sha512-UY0nlA+feH81UGSHv92sLEPLCeZFjXOuHhrIo0HQydScuQc8s0A7kL/UdgwgDq8g8ilksmuoF35YVTNphV2aBQ==",
+      "license": "MIT",
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      },
+      "peerDependencies": {
+        "@noble/hashes": "^1.8.0 || ^2.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@noble/hashes": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@humanfs/core": {
+      "version": "0.19.1",
+      "resolved": "https://registry.npmjs.org/@humanfs/core/-/core-0.19.1.tgz",
+      "integrity": "sha512-5DyQ4+1JEUzejeK1JGICcideyfUbGixgS9jNgex5nqkW+cY7WZhxBigmieN5Qnw9ZosSNVC9KQKyb+GUaGyKUA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=18.18.0"
+      }
+    },
+    "node_modules/@humanfs/node": {
+      "version": "0.16.7",
+      "resolved": "https://registry.npmjs.org/@humanfs/node/-/node-0.16.7.tgz",
+      "integrity": "sha512-/zUx+yOsIrG4Y43Eh2peDeKCxlRt/gET6aHfaKpuq267qXdYDFViVHfMaLyygZOnl0kGWxFIgsBy8QFuTLUXEQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@humanfs/core": "^0.19.1",
+        "@humanwhocodes/retry": "^0.4.0"
+      },
+      "engines": {
+        "node": ">=18.18.0"
+      }
+    },
+    "node_modules/@humanwhocodes/module-importer": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@humanwhocodes/module-importer/-/module-importer-1.0.1.tgz",
+      "integrity": "sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=12.22"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/nzakas"
+      }
+    },
+    "node_modules/@humanwhocodes/retry": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/@humanwhocodes/retry/-/retry-0.4.3.tgz",
+      "integrity": "sha512-bV0Tgo9K4hfPCek+aMAn81RppFKv2ySDQeMoSZuvTASywNTnVJCArCZE2FWqpvIatKu7VMRLWlR1EazvVhDyhQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=18.18"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/nzakas"
+      }
+    },
+    "node_modules/@inquirer/confirm": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/confirm/-/confirm-3.2.0.tgz",
+      "integrity": "sha512-oOIwPs0Dvq5220Z8lGL/6LHRTEr9TgLHmiI99Rj1PJ1p1czTys+olrgBqZk4E2qC0YTzeHprxSQmoHioVdJ7Lw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^9.1.0",
+        "@inquirer/type": "^1.5.3"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@inquirer/core": {
+      "version": "9.2.1",
+      "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-9.2.1.tgz",
+      "integrity": "sha512-F2VBt7W/mwqEU4bL0RnHNZmC/OxzNx9cOYxHqnXX3MP6ruYvZUZAW9imgN9+h/uBT/oP8Gh888J2OZSbjSeWcg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/figures": "^1.0.6",
+        "@inquirer/type": "^2.0.0",
+        "@types/mute-stream": "^0.0.4",
+        "@types/node": "^22.5.5",
+        "@types/wrap-ansi": "^3.0.0",
+        "ansi-escapes": "^4.3.2",
+        "cli-width": "^4.1.0",
+        "mute-stream": "^1.0.0",
+        "signal-exit": "^4.1.0",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^6.2.0",
+        "yoctocolors-cjs": "^2.1.2"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@inquirer/core/node_modules/@inquirer/type": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@inquirer/type/-/type-2.0.0.tgz",
+      "integrity": "sha512-XvJRx+2KR3YXyYtPUUy+qd9i7p+GO9Ko6VIIpWlBrpWwXDv8WLFeHTxz35CfQFUiBMLXlGHhGzys7lqit9gWag==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "mute-stream": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@inquirer/core/node_modules/@types/node": {
+      "version": "22.19.17",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-22.19.17.tgz",
+      "integrity": "sha512-wGdMcf+vPYM6jikpS/qhg6WiqSV/OhG+jeeHT/KlVqxYfD40iYJf9/AE1uQxVWFvU7MipKRkRv8NSHiCGgPr8Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "undici-types": "~6.21.0"
+      }
+    },
+    "node_modules/@inquirer/core/node_modules/undici-types": {
+      "version": "6.21.0",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.21.0.tgz",
+      "integrity": "sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@inquirer/external-editor": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@inquirer/external-editor/-/external-editor-1.0.3.tgz",
+      "integrity": "sha512-RWbSrDiYmO4LbejWY7ttpxczuwQyZLBUyygsA9Nsv95hpzUWwnNTVQmAq3xuh7vNwCp07UTmE5i11XAEExx4RA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "chardet": "^2.1.1",
+        "iconv-lite": "^0.7.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/figures": {
+      "version": "1.0.15",
+      "resolved": "https://registry.npmjs.org/@inquirer/figures/-/figures-1.0.15.tgz",
+      "integrity": "sha512-t2IEY+unGHOzAaVM5Xx6DEWKeXlDDcNPeDyUpsRc6CUhBfU3VQOEl+Vssh7VNp1dR8MdUJBWhuObjXCsVpjN5g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@inquirer/type": {
+      "version": "1.5.5",
+      "resolved": "https://registry.npmjs.org/@inquirer/type/-/type-1.5.5.tgz",
+      "integrity": "sha512-MzICLu4yS7V8AA61sANROZ9vT1H3ooca5dSmI1FjZkzq7o/koMsRfQSzRtFo+F3Ao4Sf1C0bpLKejpKB/+j6MA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "mute-stream": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@isaacs/cliui": {
+      "version": "8.0.2",
+      "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
+      "integrity": "sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "string-width": "^5.1.2",
+        "string-width-cjs": "npm:string-width@^4.2.0",
+        "strip-ansi": "^7.0.1",
+        "strip-ansi-cjs": "npm:strip-ansi@^6.0.1",
+        "wrap-ansi": "^8.1.0",
+        "wrap-ansi-cjs": "npm:wrap-ansi@^7.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/ansi-regex": {
+      "version": "6.2.2",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.2.2.tgz",
+      "integrity": "sha512-Bq3SmSpyFHaWjPk8If9yc6svM8c56dB5BAtW4Qbw5jHTwwXXcTLoRMkpDJp6VL0XzlWaCHTXrkFURMYmD0sLqg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-regex?sponsor=1"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/ansi-styles": {
+      "version": "6.2.3",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.3.tgz",
+      "integrity": "sha512-4Dj6M28JB+oAH8kFkTLUo+a2jwOFkuqb3yucU0CANcRRUbxS0cP0nZYCGjcc3BNXwRIsUVmDGgzawme7zvJHvg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/emoji-regex": {
+      "version": "9.2.2",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-9.2.2.tgz",
+      "integrity": "sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@isaacs/cliui/node_modules/string-width": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
+      "integrity": "sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "eastasianwidth": "^0.2.0",
+        "emoji-regex": "^9.2.2",
+        "strip-ansi": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/strip-ansi": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.2.0.tgz",
+      "integrity": "sha512-yDPMNjp4WyfYBkHnjIRLfca1i6KMyGCtsVgoKe/z1+6vukgaENdgGBZt+ZmKPc4gavvEZ5OgHfHdrazhgNyG7w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^6.2.2"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/strip-ansi?sponsor=1"
+      }
+    },
+    "node_modules/@isaacs/cliui/node_modules/wrap-ansi": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz",
+      "integrity": "sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^6.1.0",
+        "string-width": "^5.0.1",
+        "strip-ansi": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
+    "node_modules/@jest/diff-sequences": {
+      "version": "30.3.0",
+      "resolved": "https://registry.npmjs.org/@jest/diff-sequences/-/diff-sequences-30.3.0.tgz",
+      "integrity": "sha512-cG51MVnLq1ecVUaQ3fr6YuuAOitHK1S4WUJHnsPFE/quQr33ADUx1FfrTCpMCRxvy0Yr9BThKpDjSlcTi91tMA==",
+      "license": "MIT",
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@jest/environment": {
+      "version": "30.2.0",
+      "resolved": "https://registry.npmjs.org/@jest/environment/-/environment-30.2.0.tgz",
+      "integrity": "sha512-/QPTL7OBJQ5ac09UDRa3EQes4gt1FTEG/8jZ/4v5IVzx+Cv7dLxlVIvfvSVRiiX2drWyXeBjkMSR8hvOWSog5g==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/fake-timers": "30.2.0",
+        "@jest/types": "30.2.0",
+        "@types/node": "*",
+        "jest-mock": "30.2.0"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@jest/environment-jsdom-abstract": {
+      "version": "30.2.0",
+      "resolved": "https://registry.npmjs.org/@jest/environment-jsdom-abstract/-/environment-jsdom-abstract-30.2.0.tgz",
+      "integrity": "sha512-kazxw2L9IPuZpQ0mEt9lu9Z98SqR74xcagANmMBU16X0lS23yPc0+S6hGLUz8kVRlomZEs/5S/Zlpqwf5yu6OQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/environment": "30.2.0",
+        "@jest/fake-timers": "30.2.0",
+        "@jest/types": "30.2.0",
+        "@types/jsdom": "^21.1.7",
+        "@types/node": "*",
+        "jest-mock": "30.2.0",
+        "jest-util": "30.2.0"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      },
+      "peerDependencies": {
+        "canvas": "^3.0.0",
+        "jsdom": "*"
+      },
+      "peerDependenciesMeta": {
+        "canvas": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@jest/environment-jsdom-abstract/node_modules/jest-mock": {
+      "version": "30.2.0",
+      "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-30.2.0.tgz",
+      "integrity": "sha512-JNNNl2rj4b5ICpmAcq+WbLH83XswjPbjH4T7yvGzfAGCPh1rw+xVNbtk+FnRslvt9lkCcdn9i1oAoKUuFsOxRw==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/types": "30.2.0",
+        "@types/node": "*",
+        "jest-util": "30.2.0"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@jest/environment-jsdom-abstract/node_modules/jest-util": {
+      "version": "30.2.0",
+      "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-30.2.0.tgz",
+      "integrity": "sha512-QKNsM0o3Xe6ISQU869e+DhG+4CK/48aHYdJZGlFQVTjnbvgpcKyxpzk29fGiO7i/J8VENZ+d2iGnSsvmuHywlA==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/types": "30.2.0",
+        "@types/node": "*",
+        "chalk": "^4.1.2",
+        "ci-info": "^4.2.0",
+        "graceful-fs": "^4.2.11",
+        "picomatch": "^4.0.2"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@jest/environment/node_modules/jest-mock": {
+      "version": "30.2.0",
+      "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-30.2.0.tgz",
+      "integrity": "sha512-JNNNl2rj4b5ICpmAcq+WbLH83XswjPbjH4T7yvGzfAGCPh1rw+xVNbtk+FnRslvt9lkCcdn9i1oAoKUuFsOxRw==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/types": "30.2.0",
+        "@types/node": "*",
+        "jest-util": "30.2.0"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@jest/environment/node_modules/jest-util": {
+      "version": "30.2.0",
+      "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-30.2.0.tgz",
+      "integrity": "sha512-QKNsM0o3Xe6ISQU869e+DhG+4CK/48aHYdJZGlFQVTjnbvgpcKyxpzk29fGiO7i/J8VENZ+d2iGnSsvmuHywlA==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/types": "30.2.0",
+        "@types/node": "*",
+        "chalk": "^4.1.2",
+        "ci-info": "^4.2.0",
+        "graceful-fs": "^4.2.11",
+        "picomatch": "^4.0.2"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@jest/expect-utils": {
+      "version": "30.3.0",
+      "resolved": "https://registry.npmjs.org/@jest/expect-utils/-/expect-utils-30.3.0.tgz",
+      "integrity": "sha512-j0+W5iQQ8hBh7tHZkTQv3q2Fh/M7Je72cIsYqC4OaktgtO7v1So9UTjp6uPBHIaB6beoF/RRsCgMJKvti0wADA==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/get-type": "30.1.0"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@jest/fake-timers": {
+      "version": "30.2.0",
+      "resolved": "https://registry.npmjs.org/@jest/fake-timers/-/fake-timers-30.2.0.tgz",
+      "integrity": "sha512-HI3tRLjRxAbBy0VO8dqqm7Hb2mIa8d5bg/NJkyQcOk7V118ObQML8RC5luTF/Zsg4474a+gDvhce7eTnP4GhYw==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/types": "30.2.0",
+        "@sinonjs/fake-timers": "^13.0.0",
+        "@types/node": "*",
+        "jest-message-util": "30.2.0",
+        "jest-mock": "30.2.0",
+        "jest-util": "30.2.0"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@jest/fake-timers/node_modules/ansi-styles": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/@jest/fake-timers/node_modules/jest-message-util": {
+      "version": "30.2.0",
+      "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-30.2.0.tgz",
+      "integrity": "sha512-y4DKFLZ2y6DxTWD4cDe07RglV88ZiNEdlRfGtqahfbIjfsw1nMCPx49Uev4IA/hWn3sDKyAnSPwoYSsAEdcimw==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/code-frame": "^7.27.1",
+        "@jest/types": "30.2.0",
+        "@types/stack-utils": "^2.0.3",
+        "chalk": "^4.1.2",
+        "graceful-fs": "^4.2.11",
+        "micromatch": "^4.0.8",
+        "pretty-format": "30.2.0",
+        "slash": "^3.0.0",
+        "stack-utils": "^2.0.6"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@jest/fake-timers/node_modules/jest-mock": {
+      "version": "30.2.0",
+      "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-30.2.0.tgz",
+      "integrity": "sha512-JNNNl2rj4b5ICpmAcq+WbLH83XswjPbjH4T7yvGzfAGCPh1rw+xVNbtk+FnRslvt9lkCcdn9i1oAoKUuFsOxRw==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/types": "30.2.0",
+        "@types/node": "*",
+        "jest-util": "30.2.0"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@jest/fake-timers/node_modules/jest-util": {
+      "version": "30.2.0",
+      "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-30.2.0.tgz",
+      "integrity": "sha512-QKNsM0o3Xe6ISQU869e+DhG+4CK/48aHYdJZGlFQVTjnbvgpcKyxpzk29fGiO7i/J8VENZ+d2iGnSsvmuHywlA==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/types": "30.2.0",
+        "@types/node": "*",
+        "chalk": "^4.1.2",
+        "ci-info": "^4.2.0",
+        "graceful-fs": "^4.2.11",
+        "picomatch": "^4.0.2"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@jest/fake-timers/node_modules/pretty-format": {
+      "version": "30.2.0",
+      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.2.0.tgz",
+      "integrity": "sha512-9uBdv/B4EefsuAL+pWqueZyZS2Ba+LxfFeQ9DN14HU4bN8bhaxKdkpjpB6fs9+pSjIBu+FXQHImEg8j/Lw0+vA==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/schemas": "30.0.5",
+        "ansi-styles": "^5.2.0",
+        "react-is": "^18.3.1"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@jest/get-type": {
+      "version": "30.1.0",
+      "resolved": "https://registry.npmjs.org/@jest/get-type/-/get-type-30.1.0.tgz",
+      "integrity": "sha512-eMbZE2hUnx1WV0pmURZY9XoXPkUYjpc55mb0CrhtdWLtzMQPFvu/rZkTLZFTsdaVQa+Tr4eWAteqcUzoawq/uA==",
+      "license": "MIT",
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@jest/pattern": {
+      "version": "30.0.1",
+      "resolved": "https://registry.npmjs.org/@jest/pattern/-/pattern-30.0.1.tgz",
+      "integrity": "sha512-gWp7NfQW27LaBQz3TITS8L7ZCQ0TLvtmI//4OwlQRx4rnWxcPNIYjxZpDcN4+UlGxgm3jS5QPz8IPTCkb59wZA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/node": "*",
+        "jest-regex-util": "30.0.1"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@jest/schemas": {
+      "version": "30.0.5",
+      "resolved": "https://registry.npmjs.org/@jest/schemas/-/schemas-30.0.5.tgz",
+      "integrity": "sha512-DmdYgtezMkh3cpU8/1uyXakv3tJRcmcXxBOcO0tbaozPwpmh4YMsnWrQm9ZmZMfa5ocbxzbFk6O4bDPEc/iAnA==",
+      "license": "MIT",
+      "dependencies": {
+        "@sinclair/typebox": "^0.34.0"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@jest/types": {
+      "version": "30.2.0",
+      "resolved": "https://registry.npmjs.org/@jest/types/-/types-30.2.0.tgz",
+      "integrity": "sha512-H9xg1/sfVvyfU7o3zMfBEjQ1gcsdeTMgqHoYdN79tuLqfTtuu7WckRA1R5whDwOzxaZAeMKTYWqP+WCAi0CHsg==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/pattern": "30.0.1",
+        "@jest/schemas": "30.0.5",
+        "@types/istanbul-lib-coverage": "^2.0.6",
+        "@types/istanbul-reports": "^3.0.4",
+        "@types/node": "*",
+        "@types/yargs": "^17.0.33",
+        "chalk": "^4.1.2"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@jridgewell/gen-mapping": {
+      "version": "0.3.13",
+      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.13.tgz",
+      "integrity": "sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/sourcemap-codec": "^1.5.0",
+        "@jridgewell/trace-mapping": "^0.3.24"
+      }
+    },
+    "node_modules/@jridgewell/remapping": {
+      "version": "2.3.5",
+      "resolved": "https://registry.npmjs.org/@jridgewell/remapping/-/remapping-2.3.5.tgz",
+      "integrity": "sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/gen-mapping": "^0.3.5",
+        "@jridgewell/trace-mapping": "^0.3.24"
+      }
+    },
+    "node_modules/@jridgewell/resolve-uri": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
+      "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@jridgewell/sourcemap-codec": {
+      "version": "1.5.5",
+      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.5.tgz",
+      "integrity": "sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@jridgewell/trace-mapping": {
+      "version": "0.3.31",
+      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.31.tgz",
+      "integrity": "sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/resolve-uri": "^3.1.0",
+        "@jridgewell/sourcemap-codec": "^1.4.14"
+      }
+    },
+    "node_modules/@keyv/serialize": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@keyv/serialize/-/serialize-1.1.1.tgz",
+      "integrity": "sha512-dXn3FZhPv0US+7dtJsIi2R+c7qWYiReoEh5zUntWCf4oSpMNib8FDhSoed6m3QyZdx5hK7iLFkYk3rNxwt8vTA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@kurkle/color": {
+      "version": "0.3.4",
+      "resolved": "https://registry.npmjs.org/@kurkle/color/-/color-0.3.4.tgz",
+      "integrity": "sha512-M5UknZPHRu3DEDWoipU6sE8PdkZ6Z/S+v4dD+Ke8IaNlpdSQah50lz1KtcFBa2vsdOnwbbnxJwVM4wty6udA5w==",
+      "license": "MIT"
+    },
+    "node_modules/@manypkg/find-root": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@manypkg/find-root/-/find-root-1.1.0.tgz",
+      "integrity": "sha512-mki5uBvhHzO8kYYix/WRy2WX8S3B5wdVSc9D6KcU5lQNglP2yt58/VfLuAK49glRXChosY8ap2oJ1qgma3GUVA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.5.5",
+        "@types/node": "^12.7.1",
+        "find-up": "^4.1.0",
+        "fs-extra": "^8.1.0"
+      }
+    },
+    "node_modules/@manypkg/find-root/node_modules/@types/node": {
+      "version": "12.20.55",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-12.20.55.tgz",
+      "integrity": "sha512-J8xLz7q2OFulZ2cyGTLE1TbbZcjpno7FaN6zdJNrgAdrJ+DZzh/uFR6YrTb4C+nXakvud8Q4+rbhoIWlYQbUFQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@manypkg/find-root/node_modules/fs-extra": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-8.1.0.tgz",
+      "integrity": "sha512-yhlQgA6mnOJUKOsRUFsgJdQCvkKhcz8tlZG5HBQfReYZy46OwLcY+Zia0mtdHsOo9y/hP+CxMN0TU9QxoOtG4g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "graceful-fs": "^4.2.0",
+        "jsonfile": "^4.0.0",
+        "universalify": "^0.1.0"
+      },
+      "engines": {
+        "node": ">=6 <7 || >=8"
+      }
+    },
+    "node_modules/@manypkg/get-packages": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/@manypkg/get-packages/-/get-packages-1.1.3.tgz",
+      "integrity": "sha512-fo+QhuU3qE/2TQMQmbVMqaQ6EWbMhi4ABWP+O4AM1NqPBuy0OrApV5LO6BrrgnhtAHS2NH6RrVk9OL181tTi8A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.5.5",
+        "@changesets/types": "^4.0.1",
+        "@manypkg/find-root": "^1.1.0",
+        "fs-extra": "^8.1.0",
+        "globby": "^11.0.0",
+        "read-yaml-file": "^1.1.0"
+      }
+    },
+    "node_modules/@manypkg/get-packages/node_modules/@changesets/types": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/@changesets/types/-/types-4.1.0.tgz",
+      "integrity": "sha512-LDQvVDv5Kb50ny2s25Fhm3d9QSZimsoUGBsUioj6MC3qbMUCuC8GPIvk/M6IvXx3lYhAs0lwWUQLb+VIEUCECw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@manypkg/get-packages/node_modules/fs-extra": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-8.1.0.tgz",
+      "integrity": "sha512-yhlQgA6mnOJUKOsRUFsgJdQCvkKhcz8tlZG5HBQfReYZy46OwLcY+Zia0mtdHsOo9y/hP+CxMN0TU9QxoOtG4g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "graceful-fs": "^4.2.0",
+        "jsonfile": "^4.0.0",
+        "universalify": "^0.1.0"
+      },
+      "engines": {
+        "node": ">=6 <7 || >=8"
+      }
+    },
+    "node_modules/@monaco-editor/loader": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/@monaco-editor/loader/-/loader-1.7.0.tgz",
+      "integrity": "sha512-gIwR1HrJrrx+vfyOhYmCZ0/JcWqG5kbfG7+d3f/C1LXk2EvzAbHSg3MQ5lO2sMlo9izoAZ04shohfKLVT6crVA==",
+      "license": "MIT",
+      "dependencies": {
+        "state-local": "^1.0.6"
+      }
+    },
+    "node_modules/@monaco-editor/react": {
+      "version": "4.7.0",
+      "resolved": "https://registry.npmjs.org/@monaco-editor/react/-/react-4.7.0.tgz",
+      "integrity": "sha512-cyzXQCtO47ydzxpQtCGSQGOC8Gk3ZUeBXFAxD+CWXYFo5OqZyZUonFl0DwUlTyAfRHntBfw2p3w4s9R6oe1eCA==",
+      "license": "MIT",
+      "dependencies": {
+        "@monaco-editor/loader": "^1.5.0"
+      },
+      "peerDependencies": {
+        "monaco-editor": ">= 0.25.0 < 1",
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+        "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+      }
+    },
+    "node_modules/@mswjs/interceptors": {
+      "version": "0.35.9",
+      "resolved": "https://registry.npmjs.org/@mswjs/interceptors/-/interceptors-0.35.9.tgz",
+      "integrity": "sha512-SSnyl/4ni/2ViHKkiZb8eajA/eN1DNFaHjhGiLUdZvDz6PKF4COSf/17xqSz64nOo2Ia29SA6B2KNCsyCbVmaQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@open-draft/deferred-promise": "^2.2.0",
+        "@open-draft/logger": "^0.3.0",
+        "@open-draft/until": "^2.0.0",
+        "is-node-process": "^1.2.0",
+        "outvariant": "^1.4.3",
+        "strict-event-emitter": "^0.5.1"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@napi-rs/wasm-runtime": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/@napi-rs/wasm-runtime/-/wasm-runtime-1.1.3.tgz",
+      "integrity": "sha512-xK9sGVbJWYb08+mTJt3/YV24WxvxpXcXtP6B172paPZ+Ts69Re9dAr7lKwJoeIx8OoeuimEiRZ7umkiUVClmmQ==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "@tybys/wasm-util": "^0.10.1"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/Brooooooklyn"
+      },
+      "peerDependencies": {
+        "@emnapi/core": "^1.7.1",
+        "@emnapi/runtime": "^1.7.1"
+      }
+    },
+    "node_modules/@nodelib/fs.scandir": {
+      "version": "2.1.5",
+      "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
+      "integrity": "sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@nodelib/fs.stat": "2.0.5",
+        "run-parallel": "^1.1.9"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/@nodelib/fs.stat": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.5.tgz",
+      "integrity": "sha512-RkhPPp2zrqDAQA/2jNhnztcPAlv64XdhIp7a7454A5ovI7Bukxgt7MX7udwAu3zg1DcpPU0rz3VV1SeaqvY4+A==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/@nodelib/fs.walk": {
+      "version": "1.2.8",
+      "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.8.tgz",
+      "integrity": "sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@nodelib/fs.scandir": "2.1.5",
+        "fastq": "^1.6.0"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/@open-draft/deferred-promise": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/@open-draft/deferred-promise/-/deferred-promise-2.2.0.tgz",
+      "integrity": "sha512-CecwLWx3rhxVQF6V4bAgPS5t+So2sTbPgAzafKkVizyi7tlwpcFpdFqq+wqF2OwNBmqFuu6tOyouTuxgpMfzmA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@open-draft/logger": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/@open-draft/logger/-/logger-0.3.0.tgz",
+      "integrity": "sha512-X2g45fzhxH238HKO4xbSr7+wBS8Fvw6ixhTDuvLd5mqh6bJJCFAPwU9mPDxbcrRtfxv4u5IHCEH77BmxvXmmxQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-node-process": "^1.2.0",
+        "outvariant": "^1.4.0"
+      }
+    },
+    "node_modules/@open-draft/until": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/@open-draft/until/-/until-2.1.0.tgz",
+      "integrity": "sha512-U69T3ItWHvLwGg5eJ0n3I62nWuE6ilHlmz7zM0npLBRvPRd7e6NYmg54vvRtP5mZG7kZqZCFVdsTWo7BPtBujg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@oxc-project/types": {
+      "version": "0.120.0",
+      "resolved": "https://registry.npmjs.org/@oxc-project/types/-/types-0.120.0.tgz",
+      "integrity": "sha512-k1YNu55DuvAip/MGE1FTsIuU3FUCn6v/ujG9V7Nq5Df/kX2CWb13hhwD0lmJGMGqE+bE1MXvv9SZVnMzEXlWcg==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/Boshen"
+      }
+    },
+    "node_modules/@parcel/watcher": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher/-/watcher-2.5.6.tgz",
+      "integrity": "sha512-tmmZ3lQxAe/k/+rNnXQRawJ4NjxO2hqiOLTHvWchtGZULp4RyFeh6aU4XdOYBFe2KE1oShQTv4AblOs2iOrNnQ==",
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "detect-libc": "^2.0.3",
+        "is-glob": "^4.0.3",
+        "node-addon-api": "^7.0.0",
+        "picomatch": "^4.0.3"
+      },
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      },
+      "optionalDependencies": {
+        "@parcel/watcher-android-arm64": "2.5.6",
+        "@parcel/watcher-darwin-arm64": "2.5.6",
+        "@parcel/watcher-darwin-x64": "2.5.6",
+        "@parcel/watcher-freebsd-x64": "2.5.6",
+        "@parcel/watcher-linux-arm-glibc": "2.5.6",
+        "@parcel/watcher-linux-arm-musl": "2.5.6",
+        "@parcel/watcher-linux-arm64-glibc": "2.5.6",
+        "@parcel/watcher-linux-arm64-musl": "2.5.6",
+        "@parcel/watcher-linux-x64-glibc": "2.5.6",
+        "@parcel/watcher-linux-x64-musl": "2.5.6",
+        "@parcel/watcher-win32-arm64": "2.5.6",
+        "@parcel/watcher-win32-ia32": "2.5.6",
+        "@parcel/watcher-win32-x64": "2.5.6"
+      }
+    },
+    "node_modules/@parcel/watcher-android-arm64": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-android-arm64/-/watcher-android-arm64-2.5.6.tgz",
+      "integrity": "sha512-YQxSS34tPF/6ZG7r/Ih9xy+kP/WwediEUsqmtf0cuCV5TPPKw/PQHRhueUo6JdeFJaqV3pyjm0GdYjZotbRt/A==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-darwin-arm64": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-arm64/-/watcher-darwin-arm64-2.5.6.tgz",
+      "integrity": "sha512-Z2ZdrnwyXvvvdtRHLmM4knydIdU9adO3D4n/0cVipF3rRiwP+3/sfzpAwA/qKFL6i1ModaabkU7IbpeMBgiVEA==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-darwin-x64": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-x64/-/watcher-darwin-x64-2.5.6.tgz",
+      "integrity": "sha512-HgvOf3W9dhithcwOWX9uDZyn1lW9R+7tPZ4sug+NGrGIo4Rk1hAXLEbcH1TQSqxts0NYXXlOWqVpvS1SFS4fRg==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-freebsd-x64": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-freebsd-x64/-/watcher-freebsd-x64-2.5.6.tgz",
+      "integrity": "sha512-vJVi8yd/qzJxEKHkeemh7w3YAn6RJCtYlE4HPMoVnCpIXEzSrxErBW5SJBgKLbXU3WdIpkjBTeUNtyBVn8TRng==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-linux-arm-glibc": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-glibc/-/watcher-linux-arm-glibc-2.5.6.tgz",
+      "integrity": "sha512-9JiYfB6h6BgV50CCfasfLf/uvOcJskMSwcdH1PHH9rvS1IrNy8zad6IUVPVUfmXr+u+Km9IxcfMLzgdOudz9EQ==",
+      "cpu": [
+        "arm"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-linux-arm-musl": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-musl/-/watcher-linux-arm-musl-2.5.6.tgz",
+      "integrity": "sha512-Ve3gUCG57nuUUSyjBq/MAM0CzArtuIOxsBdQ+ftz6ho8n7s1i9E1Nmk/xmP323r2YL0SONs1EuwqBp2u1k5fxg==",
+      "cpu": [
+        "arm"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-linux-arm64-glibc": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-glibc/-/watcher-linux-arm64-glibc-2.5.6.tgz",
+      "integrity": "sha512-f2g/DT3NhGPdBmMWYoxixqYr3v/UXcmLOYy16Bx0TM20Tchduwr4EaCbmxh1321TABqPGDpS8D/ggOTaljijOA==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-linux-arm64-musl": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-musl/-/watcher-linux-arm64-musl-2.5.6.tgz",
+      "integrity": "sha512-qb6naMDGlbCwdhLj6hgoVKJl2odL34z2sqkC7Z6kzir8b5W65WYDpLB6R06KabvZdgoHI/zxke4b3zR0wAbDTA==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-linux-x64-glibc": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-x64-glibc/-/watcher-linux-x64-glibc-2.5.6.tgz",
+      "integrity": "sha512-kbT5wvNQlx7NaGjzPFu8nVIW1rWqV780O7ZtkjuWaPUgpv2NMFpjYERVi0UYj1msZNyCzGlaCWEtzc+exjMGbQ==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-linux-x64-musl": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-x64-musl/-/watcher-linux-x64-musl-2.5.6.tgz",
+      "integrity": "sha512-1JRFeC+h7RdXwldHzTsmdtYR/Ku8SylLgTU/reMuqdVD7CtLwf0VR1FqeprZ0eHQkO0vqsbvFLXUmYm/uNKJBg==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-win32-arm64": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-win32-arm64/-/watcher-win32-arm64-2.5.6.tgz",
+      "integrity": "sha512-3ukyebjc6eGlw9yRt678DxVF7rjXatWiHvTXqphZLvo7aC5NdEgFufVwjFfY51ijYEWpXbqF5jtrK275z52D4Q==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-win32-ia32": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-win32-ia32/-/watcher-win32-ia32-2.5.6.tgz",
+      "integrity": "sha512-k35yLp1ZMwwee3Ez/pxBi5cf4AoBKYXj00CZ80jUz5h8prpiaQsiRPKQMxoLstNuqe2vR4RNPEAEcjEFzhEz/g==",
+      "cpu": [
+        "ia32"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-win32-x64": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-win32-x64/-/watcher-win32-x64-2.5.6.tgz",
+      "integrity": "sha512-hbQlYcCq5dlAX9Qx+kFb0FHue6vbjlf0FrNzSKdYK2APUf7tGfGxQCk2ihEREmbR6ZMc0MVAD5RIX/41gpUzTw==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@pkgjs/parseargs": {
+      "version": "0.11.0",
+      "resolved": "https://registry.npmjs.org/@pkgjs/parseargs/-/parseargs-0.11.0.tgz",
+      "integrity": "sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "engines": {
+        "node": ">=14"
+      }
+    },
+    "node_modules/@playwright/test": {
+      "version": "1.58.2",
+      "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.58.2.tgz",
+      "integrity": "sha512-akea+6bHYBBfA9uQqSYmlJXn61cTa+jbO87xVLCWbTqbWadRVmhxlXATaOjOgcBaWU4ePo0wB41KMFv3o35IXA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "playwright": "1.58.2"
+      },
+      "bin": {
+        "playwright": "cli.js"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@rolldown/binding-android-arm64": {
+      "version": "1.0.0-rc.10",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-android-arm64/-/binding-android-arm64-1.0.0-rc.10.tgz",
+      "integrity": "sha512-jOHxwXhxmFKuXztiu1ORieJeTbx5vrTkcOkkkn2d35726+iwhrY1w/+nYY/AGgF12thg33qC3R1LMBF5tHTZHg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-darwin-arm64": {
+      "version": "1.0.0-rc.10",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-darwin-arm64/-/binding-darwin-arm64-1.0.0-rc.10.tgz",
+      "integrity": "sha512-gED05Teg/vtTZbIJBc4VNMAxAFDUPkuO/rAIyyxZjTj1a1/s6z5TII/5yMGZ0uLRCifEtwUQn8OlYzuYc0m70w==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-darwin-x64": {
+      "version": "1.0.0-rc.10",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-darwin-x64/-/binding-darwin-x64-1.0.0-rc.10.tgz",
+      "integrity": "sha512-rI15NcM1mA48lqrIxVkHfAqcyFLcQwyXWThy+BQ5+mkKKPvSO26ir+ZDp36AgYoYVkqvMcdS8zOE6SeBsR9e8A==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-freebsd-x64": {
+      "version": "1.0.0-rc.10",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-freebsd-x64/-/binding-freebsd-x64-1.0.0-rc.10.tgz",
+      "integrity": "sha512-XZRXHdTa+4ME1MuDVp021+doQ+z6Ei4CCFmNc5/sKbqb8YmkiJdj8QKlV3rCI0AJtAeSB5n0WGPuJWNL9p/L2w==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-arm-gnueabihf": {
+      "version": "1.0.0-rc.10",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm-gnueabihf/-/binding-linux-arm-gnueabihf-1.0.0-rc.10.tgz",
+      "integrity": "sha512-R0SQMRluISSLzFE20sPWYHVmJdDQnRyc/FzSCN72BqQmh2SOZUFG+N3/vBZpR4C6WpEUVYJLrYUXaj43sJsNLA==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-arm64-gnu": {
+      "version": "1.0.0-rc.10",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm64-gnu/-/binding-linux-arm64-gnu-1.0.0-rc.10.tgz",
+      "integrity": "sha512-Y1reMrV/o+cwpduYhJuOE3OMKx32RMYCidf14y+HssARRmhDuWXJ4yVguDg2R/8SyyGNo+auzz64LnPK9Hq6jg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-arm64-musl": {
+      "version": "1.0.0-rc.10",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm64-musl/-/binding-linux-arm64-musl-1.0.0-rc.10.tgz",
+      "integrity": "sha512-vELN+HNb2IzuzSBUOD4NHmP9yrGwl1DVM29wlQvx1OLSclL0NgVWnVDKl/8tEks79EFek/kebQKnNJkIAA4W2g==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-ppc64-gnu": {
+      "version": "1.0.0-rc.10",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-ppc64-gnu/-/binding-linux-ppc64-gnu-1.0.0-rc.10.tgz",
+      "integrity": "sha512-ZqrufYTgzxbHwpqOjzSsb0UV/aV2TFIY5rP8HdsiPTv/CuAgCRjM6s9cYFwQ4CNH+hf9Y4erHW1GjZuZ7WoI7w==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-s390x-gnu": {
+      "version": "1.0.0-rc.10",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-s390x-gnu/-/binding-linux-s390x-gnu-1.0.0-rc.10.tgz",
+      "integrity": "sha512-gSlmVS1FZJSRicA6IyjoRoKAFK7IIHBs7xJuHRSmjImqk3mPPWbR7RhbnfH2G6bcmMEllCt2vQ/7u9e6bBnByg==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-x64-gnu": {
+      "version": "1.0.0-rc.10",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-x64-gnu/-/binding-linux-x64-gnu-1.0.0-rc.10.tgz",
+      "integrity": "sha512-eOCKUpluKgfObT2pHjztnaWEIbUabWzk3qPZ5PuacuPmr4+JtQG4k2vGTY0H15edaTnicgU428XW/IH6AimcQw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-x64-musl": {
+      "version": "1.0.0-rc.10",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-x64-musl/-/binding-linux-x64-musl-1.0.0-rc.10.tgz",
+      "integrity": "sha512-Xdf2jQbfQowJnLcgYfD/m0Uu0Qj5OdxKallD78/IPPfzaiaI4KRAwZzHcKQ4ig1gtg1SuzC7jovNiM2TzQsBXA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-openharmony-arm64": {
+      "version": "1.0.0-rc.10",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-openharmony-arm64/-/binding-openharmony-arm64-1.0.0-rc.10.tgz",
+      "integrity": "sha512-o1hYe8hLi1EY6jgPFyxQgQ1wcycX+qz8eEbVmot2hFkgUzPxy9+kF0u0NIQBeDq+Mko47AkaFFaChcvZa9UX9Q==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openharmony"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-wasm32-wasi": {
+      "version": "1.0.0-rc.10",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-wasm32-wasi/-/binding-wasm32-wasi-1.0.0-rc.10.tgz",
+      "integrity": "sha512-Ugv9o7qYJudqQO5Y5y2N2SOo6S4WiqiNOpuQyoPInnhVzCY+wi/GHltcLHypG9DEUYMB0iTB/huJrpadiAcNcA==",
+      "cpu": [
+        "wasm32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "@napi-rs/wasm-runtime": "^1.1.1"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/@rolldown/binding-win32-arm64-msvc": {
+      "version": "1.0.0-rc.10",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-win32-arm64-msvc/-/binding-win32-arm64-msvc-1.0.0-rc.10.tgz",
+      "integrity": "sha512-7UODQb4fQUNT/vmgDZBl3XOBAIOutP5R3O/rkxg0aLfEGQ4opbCgU5vOw/scPe4xOqBwL9fw7/RP1vAMZ6QlAQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-win32-x64-msvc": {
+      "version": "1.0.0-rc.10",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-win32-x64-msvc/-/binding-win32-x64-msvc-1.0.0-rc.10.tgz",
+      "integrity": "sha512-PYxKHMVHOb5NJuDL53vBUl1VwUjymDcYI6rzpIni0C9+9mTiJedvUxSk7/RPp7OOAm3v+EjgMu9bIy3N6b408w==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/pluginutils": {
+      "version": "1.0.0-rc.7",
+      "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-rc.7.tgz",
+      "integrity": "sha512-qujRfC8sFVInYSPPMLQByRh7zhwkGFS4+tyMQ83srV1qrxL4g8E2tyxVVyxd0+8QeBM1mIk9KbWxkegRr76XzA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@rollup/rollup-android-arm-eabi": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.60.1.tgz",
+      "integrity": "sha512-d6FinEBLdIiK+1uACUttJKfgZREXrF0Qc2SmLII7W2AD8FfiZ9Wjd+rD/iRuf5s5dWrr1GgwXCvPqOuDquOowA==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
+    "node_modules/@rollup/rollup-android-arm64": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.60.1.tgz",
+      "integrity": "sha512-YjG/EwIDvvYI1YvYbHvDz/BYHtkY4ygUIXHnTdLhG+hKIQFBiosfWiACWortsKPKU/+dUwQQCKQM3qrDe8c9BA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
+    "node_modules/@rollup/rollup-darwin-arm64": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.60.1.tgz",
+      "integrity": "sha512-mjCpF7GmkRtSJwon+Rq1N8+pI+8l7w5g9Z3vWj4T7abguC4Czwi3Yu/pFaLvA3TTeMVjnu3ctigusqWUfjZzvw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@rollup/rollup-darwin-x64": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.60.1.tgz",
+      "integrity": "sha512-haZ7hJ1JT4e9hqkoT9R/19XW2QKqjfJVv+i5AGg57S+nLk9lQnJ1F/eZloRO3o9Scy9CM3wQ9l+dkXtcBgN5Ew==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@rollup/rollup-freebsd-arm64": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.60.1.tgz",
+      "integrity": "sha512-czw90wpQq3ZsAVBlinZjAYTKduOjTywlG7fEeWKUA7oCmpA8xdTkxZZlwNJKWqILlq0wehoZcJYfBvOyhPTQ6w==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ]
+    },
+    "node_modules/@rollup/rollup-freebsd-x64": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.60.1.tgz",
+      "integrity": "sha512-KVB2rqsxTHuBtfOeySEyzEOB7ltlB/ux38iu2rBQzkjbwRVlkhAGIEDiiYnO2kFOkJp+Z7pUXKyrRRFuFUKt+g==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.60.1.tgz",
+      "integrity": "sha512-L+34Qqil+v5uC0zEubW7uByo78WOCIrBvci69E7sFASRl0X7b/MB6Cqd1lky/CtcSVTydWa2WZwFuWexjS5o6g==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-musleabihf": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.60.1.tgz",
+      "integrity": "sha512-n83O8rt4v34hgFzlkb1ycniJh7IR5RCIqt6mz1VRJD6pmhRi0CXdmfnLu9dIUS6buzh60IvACM842Ffb3xd6Gg==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-gnu": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.60.1.tgz",
+      "integrity": "sha512-Nql7sTeAzhTAja3QXeAI48+/+GjBJ+QmAH13snn0AJSNL50JsDqotyudHyMbO2RbJkskbMbFJfIJKWA6R1LCJQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-musl": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.60.1.tgz",
+      "integrity": "sha512-+pUymDhd0ys9GcKZPPWlFiZ67sTWV5UU6zOJat02M1+PiuSGDziyRuI/pPue3hoUwm2uGfxdL+trT6Z9rxnlMA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-loong64-gnu": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.60.1.tgz",
+      "integrity": "sha512-VSvgvQeIcsEvY4bKDHEDWcpW4Yw7BtlKG1GUT4FzBUlEKQK0rWHYBqQt6Fm2taXS+1bXvJT6kICu5ZwqKCnvlQ==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-loong64-musl": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-musl/-/rollup-linux-loong64-musl-4.60.1.tgz",
+      "integrity": "sha512-4LqhUomJqwe641gsPp6xLfhqWMbQV04KtPp7/dIp0nzPxAkNY1AbwL5W0MQpcalLYk07vaW9Kp1PBhdpZYYcEw==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-ppc64-gnu": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.60.1.tgz",
+      "integrity": "sha512-tLQQ9aPvkBxOc/EUT6j3pyeMD6Hb8QF2BTBnCQWP/uu1lhc9AIrIjKnLYMEroIz/JvtGYgI9dF3AxHZNaEH0rw==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-ppc64-musl": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-musl/-/rollup-linux-ppc64-musl-4.60.1.tgz",
+      "integrity": "sha512-RMxFhJwc9fSXP6PqmAz4cbv3kAyvD1etJFjTx4ONqFP9DkTkXsAMU4v3Vyc5BgzC+anz7nS/9tp4obsKfqkDHg==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-riscv64-gnu": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.60.1.tgz",
+      "integrity": "sha512-QKgFl+Yc1eEk6MmOBfRHYF6lTxiiiV3/z/BRrbSiW2I7AFTXoBFvdMEyglohPj//2mZS4hDOqeB0H1ACh3sBbg==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-riscv64-musl": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.60.1.tgz",
+      "integrity": "sha512-RAjXjP/8c6ZtzatZcA1RaQr6O1TRhzC+adn8YZDnChliZHviqIjmvFwHcxi4JKPSDAt6Uhf/7vqcBzQJy0PDJg==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-s390x-gnu": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.60.1.tgz",
+      "integrity": "sha512-wcuocpaOlaL1COBYiA89O6yfjlp3RwKDeTIA0hM7OpmhR1Bjo9j31G1uQVpDlTvwxGn2nQs65fBFL5UFd76FcQ==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-x64-gnu": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.60.1.tgz",
+      "integrity": "sha512-77PpsFQUCOiZR9+LQEFg9GClyfkNXj1MP6wRnzYs0EeWbPcHs02AXu4xuUbM1zhwn3wqaizle3AEYg5aeoohhg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-x64-musl": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.60.1.tgz",
+      "integrity": "sha512-5cIATbk5vynAjqqmyBjlciMJl1+R/CwX9oLk/EyiFXDWd95KpHdrOJT//rnUl4cUcskrd0jCCw3wpZnhIHdD9w==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-openbsd-x64": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-openbsd-x64/-/rollup-openbsd-x64-4.60.1.tgz",
+      "integrity": "sha512-cl0w09WsCi17mcmWqqglez9Gk8isgeWvoUZ3WiJFYSR3zjBQc2J5/ihSjpl+VLjPqjQ/1hJRcqBfLjssREQILw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ]
+    },
+    "node_modules/@rollup/rollup-openharmony-arm64": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.60.1.tgz",
+      "integrity": "sha512-4Cv23ZrONRbNtbZa37mLSueXUCtN7MXccChtKpUnQNgF010rjrjfHx3QxkS2PI7LqGT5xXyYs1a7LbzAwT0iCA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openharmony"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-arm64-msvc": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.60.1.tgz",
+      "integrity": "sha512-i1okWYkA4FJICtr7KpYzFpRTHgy5jdDbZiWfvny21iIKky5YExiDXP+zbXzm3dUcFpkEeYNHgQ5fuG236JPq0g==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-ia32-msvc": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.60.1.tgz",
+      "integrity": "sha512-u09m3CuwLzShA0EYKMNiFgcjjzwqtUMLmuCJLeZWjjOYA3IT2Di09KaxGBTP9xVztWyIWjVdsB2E9goMjZvTQg==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-x64-gnu": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.60.1.tgz",
+      "integrity": "sha512-k+600V9Zl1CM7eZxJgMyTUzmrmhB/0XZnF4pRypKAlAgxmedUA+1v9R+XOFv56W4SlHEzfeMtzujLJD22Uz5zg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-x64-msvc": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.60.1.tgz",
+      "integrity": "sha512-lWMnixq/QzxyhTV6NjQJ4SFo1J6PvOX8vUx5Wb4bBPsEb+8xZ89Bz6kOXpfXj9ak9AHTQVQzlgzBEc1SyM27xQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@sentry-internal/browser-utils": {
+      "version": "10.45.0",
+      "resolved": "https://registry.npmjs.org/@sentry-internal/browser-utils/-/browser-utils-10.45.0.tgz",
+      "integrity": "sha512-ZPZpeIarXKScvquGx2AfNKcYiVNDA4wegMmjyGVsTA2JPmP0TrJoO3UybJS6KGDeee8V3I3EfD/ruauMm7jOFQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@sentry/core": "10.45.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@sentry-internal/feedback": {
+      "version": "10.45.0",
+      "resolved": "https://registry.npmjs.org/@sentry-internal/feedback/-/feedback-10.45.0.tgz",
+      "integrity": "sha512-vCSurazFVq7RUeYiM5X326jA5gOVrWYD6lYX2fbjBOMcyCEhDnveNxMT62zKkZDyNT/jyD194nz/cjntBUkyWA==",
+      "license": "MIT",
+      "dependencies": {
+        "@sentry/core": "10.45.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@sentry-internal/replay": {
+      "version": "10.45.0",
+      "resolved": "https://registry.npmjs.org/@sentry-internal/replay/-/replay-10.45.0.tgz",
+      "integrity": "sha512-vjosRoGA1bzhVAEO1oce+CsRdd70quzBeo7WvYqpcUnoLe/Rv8qpOMqWX3j26z7XfFHMExWQNQeLxmtYOArvlw==",
+      "license": "MIT",
+      "dependencies": {
+        "@sentry-internal/browser-utils": "10.45.0",
+        "@sentry/core": "10.45.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@sentry-internal/replay-canvas": {
+      "version": "10.45.0",
+      "resolved": "https://registry.npmjs.org/@sentry-internal/replay-canvas/-/replay-canvas-10.45.0.tgz",
+      "integrity": "sha512-nvq/AocdZTuD7y0KSiWi3gVaY0s5HOFy86mC/v1kDZmT/jsBAzN5LDkk/f1FvsWma1peqQmpUqxvhC+YIW294Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@sentry-internal/replay": "10.45.0",
+        "@sentry/core": "10.45.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@sentry/browser": {
+      "version": "10.45.0",
+      "resolved": "https://registry.npmjs.org/@sentry/browser/-/browser-10.45.0.tgz",
+      "integrity": "sha512-e/a8UMiQhqqv706McSIcG6XK+AoQf9INthi2pD+giZfNRTzXTdqHzUT5OIO5hg8Am6eF63nDJc+vrYNPhzs51Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@sentry-internal/browser-utils": "10.45.0",
+        "@sentry-internal/feedback": "10.45.0",
+        "@sentry-internal/replay": "10.45.0",
+        "@sentry-internal/replay-canvas": "10.45.0",
+        "@sentry/core": "10.45.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@sentry/core": {
+      "version": "10.45.0",
+      "resolved": "https://registry.npmjs.org/@sentry/core/-/core-10.45.0.tgz",
+      "integrity": "sha512-s69UXxvefeQxuZ5nY7/THtTrIEvJxNVCp3ns4kwoCw1qMpgpvn/296WCKVmM7MiwnaAdzEKnAvLAwaxZc2nM7Q==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@sentry/react": {
+      "version": "10.45.0",
+      "resolved": "https://registry.npmjs.org/@sentry/react/-/react-10.45.0.tgz",
+      "integrity": "sha512-jLezuxi4BUIU3raKyAPR5xMbQG/nhwnWmKo5p11NCbLmWzkS+lxoyDTUB4B8TAKZLfdtdkKLOn1S0tFc8vbUHw==",
+      "license": "MIT",
+      "dependencies": {
+        "@sentry/browser": "10.45.0",
+        "@sentry/core": "10.45.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "react": "^16.14.0 || 17.x || 18.x || 19.x"
+      }
+    },
+    "node_modules/@sinclair/typebox": {
+      "version": "0.34.49",
+      "resolved": "https://registry.npmjs.org/@sinclair/typebox/-/typebox-0.34.49.tgz",
+      "integrity": "sha512-brySQQs7Jtn0joV8Xh9ZV/hZb9Ozb0pmazDIASBkYKCjXrXU3mpcFahmK/z4YDhGkQvP9mWJbVyahdtU5wQA+A==",
+      "license": "MIT"
+    },
+    "node_modules/@sindresorhus/merge-streams": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@sindresorhus/merge-streams/-/merge-streams-4.0.0.tgz",
+      "integrity": "sha512-tlqY9xq5ukxTUZBmoOp+m61cqwQD5pHJtFY3Mn8CA8ps6yghLH/Hw8UPdqg4OLmFW3IFlcXnQNmo/dh8HzXYIQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@sinonjs/commons": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-3.0.1.tgz",
+      "integrity": "sha512-K3mCHKQ9sVh8o1C9cxkwxaOmXoAMlDxC1mYyHrjqOWEcBjYr76t96zL2zlj5dUGZ3HSw240X1qgH3Mjf1yJWpQ==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "type-detect": "4.0.8"
+      }
+    },
+    "node_modules/@sinonjs/fake-timers": {
+      "version": "13.0.5",
+      "resolved": "https://registry.npmjs.org/@sinonjs/fake-timers/-/fake-timers-13.0.5.tgz",
+      "integrity": "sha512-36/hTbH2uaWuGVERyC6da9YwGWnzUZXuPro/F2LfsdOsLnCojz/iSH8MxUt/FD2S5XBSVPhmArFUXcpCQ2Hkiw==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "@sinonjs/commons": "^3.0.1"
+      }
+    },
+    "node_modules/@standard-schema/spec": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@standard-schema/spec/-/spec-1.1.0.tgz",
+      "integrity": "sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@tanstack/query-core": {
+      "version": "5.91.2",
+      "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.91.2.tgz",
+      "integrity": "sha512-Uz2pTgPC1mhqrrSGg18RKCWT/pkduAYtxbcyIyKBhw7dTWjXZIzqmpzO2lBkyWr4hlImQgpu1m1pei3UnkFRWw==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      }
+    },
+    "node_modules/@tanstack/react-query": {
+      "version": "5.91.2",
+      "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.91.2.tgz",
+      "integrity": "sha512-GClLPzbM57iFXv+FlvOUL56XVe00PxuTaVEyj1zAObhRiKF008J5vedmaq7O6ehs+VmPHe8+PUQhMuEyv8d9wQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@tanstack/query-core": "5.91.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      },
+      "peerDependencies": {
+        "react": "^18 || ^19"
+      }
+    },
+    "node_modules/@testing-library/dom": {
+      "version": "10.4.1",
+      "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-10.4.1.tgz",
+      "integrity": "sha512-o4PXJQidqJl82ckFaXUeoAW+XysPLauYI43Abki5hABd853iMhitooc6znOnczgbTYmEP6U6/y1ZyKAIsvMKGg==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "@babel/code-frame": "^7.10.4",
+        "@babel/runtime": "^7.12.5",
+        "@types/aria-query": "^5.0.1",
+        "aria-query": "5.3.0",
+        "dom-accessibility-api": "^0.5.9",
+        "lz-string": "^1.5.0",
+        "picocolors": "1.1.1",
+        "pretty-format": "^27.0.2"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@testing-library/jest-dom": {
+      "version": "6.9.1",
+      "resolved": "https://registry.npmjs.org/@testing-library/jest-dom/-/jest-dom-6.9.1.tgz",
+      "integrity": "sha512-zIcONa+hVtVSSep9UT3jZ5rizo2BsxgyDYU7WFD5eICBE7no3881HGeb/QkGfsJs6JTkY1aQhT7rIPC7e+0nnA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@adobe/css-tools": "^4.4.0",
+        "aria-query": "^5.0.0",
+        "css.escape": "^1.5.1",
+        "dom-accessibility-api": "^0.6.3",
+        "picocolors": "^1.1.1",
+        "redent": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=14",
+        "npm": ">=6",
+        "yarn": ">=1"
+      }
+    },
+    "node_modules/@testing-library/jest-dom/node_modules/dom-accessibility-api": {
+      "version": "0.6.3",
+      "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.6.3.tgz",
+      "integrity": "sha512-7ZgogeTnjuHbo+ct10G9Ffp0mif17idi0IyWNVA/wcwcm7NPOD/WEHVP3n7n3MhXqxoIYm8d6MuZohYWIZ4T3w==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@testing-library/react": {
+      "version": "16.3.2",
+      "resolved": "https://registry.npmjs.org/@testing-library/react/-/react-16.3.2.tgz",
+      "integrity": "sha512-XU5/SytQM+ykqMnAnvB2umaJNIOsLF3PVv//1Ew4CTcpz0/BRyy/af40qqrt7SjKpDdT1saBMc42CUok5gaw+g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.12.5"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@testing-library/dom": "^10.0.0",
+        "@types/react": "^18.0.0 || ^19.0.0",
+        "@types/react-dom": "^18.0.0 || ^19.0.0",
+        "react": "^18.0.0 || ^19.0.0",
+        "react-dom": "^18.0.0 || ^19.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        },
+        "@types/react-dom": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@testing-library/user-event": {
+      "version": "14.6.1",
+      "resolved": "https://registry.npmjs.org/@testing-library/user-event/-/user-event-14.6.1.tgz",
+      "integrity": "sha512-vq7fv0rnt+QTXgPxr5Hjc210p6YKq2kmdziLgnsZGgLJ9e6VAShx1pACLuRjd/AS/sr7phAR58OIIpf0LlmQNw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12",
+        "npm": ">=6"
+      },
+      "peerDependencies": {
+        "@testing-library/dom": ">=7.21.4"
+      }
+    },
+    "node_modules/@tybys/wasm-util": {
+      "version": "0.10.1",
+      "resolved": "https://registry.npmjs.org/@tybys/wasm-util/-/wasm-util-0.10.1.tgz",
+      "integrity": "sha512-9tTaPJLSiejZKx+Bmog4uSubteqTvFrVrURwkmHixBo0G4seD0zUxp98E1DzUBJxLQ3NPwXrGKDiVjwx/DpPsg==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@types/aria-query": {
+      "version": "5.0.4",
+      "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.4.tgz",
+      "integrity": "sha512-rfT93uj5s0PRL7EzccGMs3brplhcrghnDoV26NqKhCAS1hVo+WdNsPvE/yb6ilfr5hi2MEk6d5EWJTKdxg8jVw==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true
+    },
+    "node_modules/@types/chai": {
+      "version": "5.2.3",
+      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-5.2.3.tgz",
+      "integrity": "sha512-Mw558oeA9fFbv65/y4mHtXDs9bPnFMZAL/jxdPFUpOHHIXX91mcgEHbS5Lahr+pwZFR8A7GQleRWeI6cGFC2UA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/deep-eql": "*",
+        "assertion-error": "^2.0.1"
+      }
+    },
+    "node_modules/@types/cookie": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.6.0.tgz",
+      "integrity": "sha512-4Kh9a6B2bQciAhf7FSuMRRkUWecJgJu9nPnx3yzpsfXX/c50REIqpHY4C82bXP90qrLtXtkDxTZosYO3UpOwlA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/deep-eql": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/@types/deep-eql/-/deep-eql-4.0.2.tgz",
+      "integrity": "sha512-c9h9dVVMigMPc4bwTvC5dxqtqJZwQPePsWjPlpSOnojbor6pGqdk541lfA7AqFQr5pB1BRdq0juY9db81BwyFw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/estree": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.8.tgz",
+      "integrity": "sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/hoist-non-react-statics": {
+      "version": "3.3.7",
+      "resolved": "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.7.tgz",
+      "integrity": "sha512-PQTyIulDkIDro8P+IHbKCsw7U2xxBYflVzW/FgWdCAePD9xGSidgA76/GeJ6lBKoblyhf9pBY763gbrN+1dI8g==",
+      "license": "MIT",
+      "dependencies": {
+        "hoist-non-react-statics": "^3.3.0"
+      },
+      "peerDependencies": {
+        "@types/react": "*"
+      }
+    },
+    "node_modules/@types/istanbul-lib-coverage": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.6.tgz",
+      "integrity": "sha512-2QF/t/auWm0lsy8XtKVPG19v3sSOQlJe/YHZgfjb/KBBHOGSV+J2q/S671rcq9uTBrLAXmZpqJiaQbMT+zNU1w==",
+      "license": "MIT"
+    },
+    "node_modules/@types/istanbul-lib-report": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@types/istanbul-lib-report/-/istanbul-lib-report-3.0.3.tgz",
+      "integrity": "sha512-NQn7AHQnk/RSLOxrBbGyJM/aVQ+pjj5HCgasFxc0K/KhoATfQ/47AyUl15I2yBUpihjmas+a+VJBOqecrFH+uA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/istanbul-lib-coverage": "*"
+      }
+    },
+    "node_modules/@types/istanbul-reports": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@types/istanbul-reports/-/istanbul-reports-3.0.4.tgz",
+      "integrity": "sha512-pk2B1NWalF9toCRu6gjBzR69syFjP4Od8WRAX+0mmf9lAjCRicLOWc+ZrxZHx/0XRjotgkF9t6iaMJ+aXcOdZQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/istanbul-lib-report": "*"
+      }
+    },
+    "node_modules/@types/jest": {
+      "version": "30.0.0",
+      "resolved": "https://registry.npmjs.org/@types/jest/-/jest-30.0.0.tgz",
+      "integrity": "sha512-XTYugzhuwqWjws0CVz8QpM36+T+Dz5mTEBKhNs/esGLnCIlGdRy+Dq78NRjd7ls7r8BC8ZRMOrKlkO1hU0JOwA==",
+      "license": "MIT",
+      "dependencies": {
+        "expect": "^30.0.0",
+        "pretty-format": "^30.0.0"
+      }
+    },
+    "node_modules/@types/jest/node_modules/ansi-styles": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/@types/jest/node_modules/pretty-format": {
+      "version": "30.3.0",
+      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.3.0.tgz",
+      "integrity": "sha512-oG4T3wCbfeuvljnyAzhBvpN45E8iOTXCU/TD3zXW80HA3dQ4ahdqMkWGiPWZvjpQwlbyHrPTWUAqUzGzv4l1JQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/schemas": "30.0.5",
+        "ansi-styles": "^5.2.0",
+        "react-is": "^18.3.1"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@types/jsdom": {
+      "version": "21.1.7",
+      "resolved": "https://registry.npmjs.org/@types/jsdom/-/jsdom-21.1.7.tgz",
+      "integrity": "sha512-yOriVnggzrnQ3a9OKOCxaVuSug3w3/SbOj5i7VwXWZEyUNl3bLF9V3MfxGbZKuwqJOQyRfqXyROBB1CoZLFWzA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/node": "*",
+        "@types/tough-cookie": "*",
+        "parse5": "^7.0.0"
+      }
+    },
+    "node_modules/@types/json-schema": {
+      "version": "7.0.15",
+      "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.15.tgz",
+      "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/mute-stream": {
+      "version": "0.0.4",
+      "resolved": "https://registry.npmjs.org/@types/mute-stream/-/mute-stream-0.0.4.tgz",
+      "integrity": "sha512-CPM9nzrCPPJHQNA9keH9CVkVI+WR5kMa+7XEs5jcGQ0VoAGnLv242w8lIVgwAEfmE4oufJRaTc9PNLQl0ioAow==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/node": "*"
+      }
+    },
+    "node_modules/@types/node": {
+      "version": "24.12.0",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-24.12.0.tgz",
+      "integrity": "sha512-GYDxsZi3ChgmckRT9HPU0WEhKLP08ev/Yfcq2AstjrDASOYCSXeyjDsHg4v5t4jOj7cyDX3vmprafKlWIG9MXQ==",
+      "license": "MIT",
+      "dependencies": {
+        "undici-types": "~7.16.0"
+      }
+    },
+    "node_modules/@types/react": {
+      "version": "19.2.14",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.14.tgz",
+      "integrity": "sha512-ilcTH/UniCkMdtexkoCN0bI7pMcJDvmQFPvuPvmEaYA/NSfFTAgdUSLAoVjaRJm7+6PvcM+q1zYOwS4wTYMF9w==",
+      "license": "MIT",
+      "dependencies": {
+        "csstype": "^3.2.2"
+      }
+    },
+    "node_modules/@types/react-dom": {
+      "version": "19.2.3",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-19.2.3.tgz",
+      "integrity": "sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ==",
+      "dev": true,
+      "license": "MIT",
+      "peerDependencies": {
+        "@types/react": "^19.2.0"
+      }
+    },
+    "node_modules/@types/react-table": {
+      "version": "7.7.20",
+      "resolved": "https://registry.npmjs.org/@types/react-table/-/react-table-7.7.20.tgz",
+      "integrity": "sha512-ahMp4pmjVlnExxNwxyaDrFgmKxSbPwU23sGQw2gJK4EhCvnvmib2s/O/+y1dfV57dXOwpr2plfyBol+vEHbi2w==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/react": "*"
+      }
+    },
+    "node_modules/@types/stack-utils": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-2.0.3.tgz",
+      "integrity": "sha512-9aEbYZ3TbYMznPdcdr3SmIrLXwC/AKZXQeCf9Pgao5CKb8CyHuEX5jzWPTkvregvhRJHcpRO6BFoGW9ycaOkYw==",
+      "license": "MIT"
+    },
+    "node_modules/@types/statuses": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/@types/statuses/-/statuses-2.0.6.tgz",
+      "integrity": "sha512-xMAgYwceFhRA2zY+XbEA7mxYbA093wdiW8Vu6gZPGWy9cmOyU9XesH1tNcEWsKFd5Vzrqx5T3D38PWx1FIIXkA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/tough-cookie": {
+      "version": "4.0.5",
+      "resolved": "https://registry.npmjs.org/@types/tough-cookie/-/tough-cookie-4.0.5.tgz",
+      "integrity": "sha512-/Ad8+nIOV7Rl++6f1BdKxFSMgmoqEoYbHRpPcx3JEfv8VRsQe9Z4mCXeJBzxs7mbHY/XOZZuXlRNfhpVPbs6ZA==",
+      "license": "MIT"
+    },
+    "node_modules/@types/trusted-types": {
+      "version": "2.0.7",
+      "resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.7.tgz",
+      "integrity": "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==",
+      "license": "MIT",
+      "optional": true
+    },
+    "node_modules/@types/wrap-ansi": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/@types/wrap-ansi/-/wrap-ansi-3.0.0.tgz",
+      "integrity": "sha512-ltIpx+kM7g/MLRZfkbL7EsCEjfzCcScLpkg37eXEtx5kmrAKBkTJwd1GIAjDSL8wTpM6Hzn5YO4pSb91BEwu1g==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/yargs": {
+      "version": "17.0.35",
+      "resolved": "https://registry.npmjs.org/@types/yargs/-/yargs-17.0.35.tgz",
+      "integrity": "sha512-qUHkeCyQFxMXg79wQfTtfndEC+N9ZZg76HJftDJp+qH2tV7Gj4OJi7l+PiWwJ+pWtW8GwSmqsDj/oymhrTWXjg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/yargs-parser": "*"
+      }
+    },
+    "node_modules/@types/yargs-parser": {
+      "version": "21.0.3",
+      "resolved": "https://registry.npmjs.org/@types/yargs-parser/-/yargs-parser-21.0.3.tgz",
+      "integrity": "sha512-I4q9QU9MQv4oEOz4tAHJtNz1cwuLxn2F3xcc2iV5WdqLPpUnj30aUuxt1mAxYTG+oe8CZMV/+6rU4S4gRDzqtQ==",
+      "license": "MIT"
+    },
+    "node_modules/@typescript-eslint/eslint-plugin": {
+      "version": "8.57.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.57.1.tgz",
+      "integrity": "sha512-Gn3aqnvNl4NGc6x3/Bqk1AOn0thyTU9bqDRhiRnUWezgvr2OnhYCWCgC8zXXRVqBsIL1pSDt7T9nJUe0oM0kDQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@eslint-community/regexpp": "^4.12.2",
+        "@typescript-eslint/scope-manager": "8.57.1",
+        "@typescript-eslint/type-utils": "8.57.1",
+        "@typescript-eslint/utils": "8.57.1",
+        "@typescript-eslint/visitor-keys": "8.57.1",
+        "ignore": "^7.0.5",
+        "natural-compare": "^1.4.0",
+        "ts-api-utils": "^2.4.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "@typescript-eslint/parser": "^8.57.1",
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/ignore": {
+      "version": "7.0.5",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.5.tgz",
+      "integrity": "sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4"
+      }
+    },
+    "node_modules/@typescript-eslint/parser": {
+      "version": "8.57.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.57.1.tgz",
+      "integrity": "sha512-k4eNDan0EIMTT/dUKc/g+rsJ6wcHYhNPdY19VoX/EOtaAG8DLtKCykhrUnuHPYvinn5jhAPgD2Qw9hXBwrahsw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/scope-manager": "8.57.1",
+        "@typescript-eslint/types": "8.57.1",
+        "@typescript-eslint/typescript-estree": "8.57.1",
+        "@typescript-eslint/visitor-keys": "8.57.1",
+        "debug": "^4.4.3"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/project-service": {
+      "version": "8.57.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.57.1.tgz",
+      "integrity": "sha512-vx1F37BRO1OftsYlmG9xay1TqnjNVlqALymwWVuYTdo18XuKxtBpCj1QlzNIEHlvlB27osvXFWptYiEWsVdYsg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/tsconfig-utils": "^8.57.1",
+        "@typescript-eslint/types": "^8.57.1",
+        "debug": "^4.4.3"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/scope-manager": {
+      "version": "8.57.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.57.1.tgz",
+      "integrity": "sha512-hs/QcpCwlwT2L5S+3fT6gp0PabyGk4Q0Rv2doJXA0435/OpnSR3VRgvrp8Xdoc3UAYSg9cyUjTeFXZEPg/3OKg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.57.1",
+        "@typescript-eslint/visitor-keys": "8.57.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/tsconfig-utils": {
+      "version": "8.57.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.57.1.tgz",
+      "integrity": "sha512-0lgOZB8cl19fHO4eI46YUx2EceQqhgkPSuCGLlGi79L2jwYY1cxeYc1Nae8Aw1xjgW3PKVDLlr3YJ6Bxx8HkWg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/type-utils": {
+      "version": "8.57.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.57.1.tgz",
+      "integrity": "sha512-+Bwwm0ScukFdyoJsh2u6pp4S9ktegF98pYUU0hkphOOqdMB+1sNQhIz8y5E9+4pOioZijrkfNO/HUJVAFFfPKA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.57.1",
+        "@typescript-eslint/typescript-estree": "8.57.1",
+        "@typescript-eslint/utils": "8.57.1",
+        "debug": "^4.4.3",
+        "ts-api-utils": "^2.4.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/types": {
+      "version": "8.57.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.57.1.tgz",
+      "integrity": "sha512-S29BOBPJSFUiblEl6RzPPjJt6w25A6XsBqRVDt53tA/tlL8q7ceQNZHTjPeONt/3S7KRI4quk+yP9jK2WjBiPQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree": {
+      "version": "8.57.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.57.1.tgz",
+      "integrity": "sha512-ybe2hS9G6pXpqGtPli9Gx9quNV0TWLOmh58ADlmZe9DguLq0tiAKVjirSbtM1szG6+QH6rVXyU6GTLQbWnMY+g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/project-service": "8.57.1",
+        "@typescript-eslint/tsconfig-utils": "8.57.1",
+        "@typescript-eslint/types": "8.57.1",
+        "@typescript-eslint/visitor-keys": "8.57.1",
+        "debug": "^4.4.3",
+        "minimatch": "^10.2.2",
+        "semver": "^7.7.3",
+        "tinyglobby": "^0.2.15",
+        "ts-api-utils": "^2.4.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/balanced-match": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-4.0.4.tgz",
+      "integrity": "sha512-BLrgEcRTwX2o6gGxGOCNyMvGSp35YofuYzw9h1IMTRmKqttAZZVU67bdb9Pr2vUHA8+j3i2tJfjO6C6+4myGTA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "18 || 20 || >=22"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/brace-expansion": {
+      "version": "5.0.5",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-5.0.5.tgz",
+      "integrity": "sha512-VZznLgtwhn+Mact9tfiwx64fA9erHH/MCXEUfB/0bX/6Fz6ny5EGTXYltMocqg4xFAQZtnO3DHWWXi8RiuN7cQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^4.0.2"
+      },
+      "engines": {
+        "node": "18 || 20 || >=22"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/minimatch": {
+      "version": "10.2.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-10.2.5.tgz",
+      "integrity": "sha512-MULkVLfKGYDFYejP07QOurDLLQpcjk7Fw+7jXS2R2czRQzR56yHRveU5NDJEOviH+hETZKSkIk5c+T23GjFUMg==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "dependencies": {
+        "brace-expansion": "^5.0.5"
+      },
+      "engines": {
+        "node": "18 || 20 || >=22"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/@typescript-eslint/utils": {
+      "version": "8.57.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.57.1.tgz",
+      "integrity": "sha512-XUNSJ/lEVFttPMMoDVA2r2bwrl8/oPx8cURtczkSEswY5T3AeLmCy+EKWQNdL4u0MmAHOjcWrqJp2cdvgjn8dQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@eslint-community/eslint-utils": "^4.9.1",
+        "@typescript-eslint/scope-manager": "8.57.1",
+        "@typescript-eslint/types": "8.57.1",
+        "@typescript-eslint/typescript-estree": "8.57.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/visitor-keys": {
+      "version": "8.57.1",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.57.1.tgz",
+      "integrity": "sha512-YWnmJkXbofiz9KbnbbwuA2rpGkFPLbAIetcCNO6mJ8gdhdZ/v7WDXsoGFAJuM6ikUFKTlSQnjWnVO4ux+UzS6A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.57.1",
+        "eslint-visitor-keys": "^5.0.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/visitor-keys/node_modules/eslint-visitor-keys": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-5.0.1.tgz",
+      "integrity": "sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/@vitejs/plugin-react": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-6.0.1.tgz",
+      "integrity": "sha512-l9X/E3cDb+xY3SWzlG1MOGt2usfEHGMNIaegaUGFsLkb3RCn/k8/TOXBcab+OndDI4TBtktT8/9BwwW8Vi9KUQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@rolldown/pluginutils": "1.0.0-rc.7"
+      },
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      },
+      "peerDependencies": {
+        "@rolldown/plugin-babel": "^0.1.7 || ^0.2.0",
+        "babel-plugin-react-compiler": "^1.0.0",
+        "vite": "^8.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@rolldown/plugin-babel": {
+          "optional": true
+        },
+        "babel-plugin-react-compiler": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@vitest/coverage-v8": {
+      "version": "4.0.18",
+      "resolved": "https://registry.npmjs.org/@vitest/coverage-v8/-/coverage-v8-4.0.18.tgz",
+      "integrity": "sha512-7i+N2i0+ME+2JFZhfuz7Tg/FqKtilHjGyGvoHYQ6iLV0zahbsJ9sljC9OcFcPDbhYKCet+sG8SsVqlyGvPflZg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@bcoe/v8-coverage": "^1.0.2",
+        "@vitest/utils": "4.0.18",
+        "ast-v8-to-istanbul": "^0.3.10",
+        "istanbul-lib-coverage": "^3.2.2",
+        "istanbul-lib-report": "^3.0.1",
+        "istanbul-reports": "^3.2.0",
+        "magicast": "^0.5.1",
+        "obug": "^2.1.1",
+        "std-env": "^3.10.0",
+        "tinyrainbow": "^3.0.3"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      },
+      "peerDependencies": {
+        "@vitest/browser": "4.0.18",
+        "vitest": "4.0.18"
+      },
+      "peerDependenciesMeta": {
+        "@vitest/browser": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@vitest/expect": {
+      "version": "4.0.18",
+      "resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-4.0.18.tgz",
+      "integrity": "sha512-8sCWUyckXXYvx4opfzVY03EOiYVxyNrHS5QxX3DAIi5dpJAAkyJezHCP77VMX4HKA2LDT/Jpfo8i2r5BE3GnQQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@standard-schema/spec": "^1.0.0",
+        "@types/chai": "^5.2.2",
+        "@vitest/spy": "4.0.18",
+        "@vitest/utils": "4.0.18",
+        "chai": "^6.2.1",
+        "tinyrainbow": "^3.0.3"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/pretty-format": {
+      "version": "4.0.18",
+      "resolved": "https://registry.npmjs.org/@vitest/pretty-format/-/pretty-format-4.0.18.tgz",
+      "integrity": "sha512-P24GK3GulZWC5tz87ux0m8OADrQIUVDPIjjj65vBXYG17ZeU3qD7r+MNZ1RNv4l8CGU2vtTRqixrOi9fYk/yKw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "tinyrainbow": "^3.0.3"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/runner": {
+      "version": "4.0.18",
+      "resolved": "https://registry.npmjs.org/@vitest/runner/-/runner-4.0.18.tgz",
+      "integrity": "sha512-rpk9y12PGa22Jg6g5M3UVVnTS7+zycIGk9ZNGN+m6tZHKQb7jrP7/77WfZy13Y/EUDd52NDsLRQhYKtv7XfPQw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/utils": "4.0.18",
+        "pathe": "^2.0.3"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/snapshot": {
+      "version": "4.0.18",
+      "resolved": "https://registry.npmjs.org/@vitest/snapshot/-/snapshot-4.0.18.tgz",
+      "integrity": "sha512-PCiV0rcl7jKQjbgYqjtakly6T1uwv/5BQ9SwBLekVg/EaYeQFPiXcgrC2Y7vDMA8dM1SUEAEV82kgSQIlXNMvA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/pretty-format": "4.0.18",
+        "magic-string": "^0.30.21",
+        "pathe": "^2.0.3"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/spy": {
+      "version": "4.0.18",
+      "resolved": "https://registry.npmjs.org/@vitest/spy/-/spy-4.0.18.tgz",
+      "integrity": "sha512-cbQt3PTSD7P2OARdVW3qWER5EGq7PHlvE+QfzSC0lbwO+xnt7+XH06ZzFjFRgzUX//JmpxrCu92VdwvEPlWSNw==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/utils": {
+      "version": "4.0.18",
+      "resolved": "https://registry.npmjs.org/@vitest/utils/-/utils-4.0.18.tgz",
+      "integrity": "sha512-msMRKLMVLWygpK3u2Hybgi4MNjcYJvwTb0Ru09+fOyCXIgT5raYP041DRRdiJiI3k/2U6SEbAETB3YtBrUkCFA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/pretty-format": "4.0.18",
+        "tinyrainbow": "^3.0.3"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/acorn": {
+      "version": "8.16.0",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.16.0.tgz",
+      "integrity": "sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "acorn": "bin/acorn"
+      },
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
+    "node_modules/acorn-jsx": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz",
+      "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==",
+      "dev": true,
+      "license": "MIT",
+      "peerDependencies": {
+        "acorn": "^6.0.0 || ^7.0.0 || ^8.0.0"
+      }
+    },
+    "node_modules/agent-base": {
+      "version": "7.1.4",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.4.tgz",
+      "integrity": "sha512-MnA+YT8fwfJPgBx3m60MNqakm30XOkyIoH1y6huTQvC0PwZG7ki8NacLBcrPbNoo8vEZy7Jpuk7+jMO+CUovTQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 14"
+      }
+    },
+    "node_modules/ajv": {
+      "version": "6.14.0",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.14.0.tgz",
+      "integrity": "sha512-IWrosm/yrn43eiKqkfkHis7QioDleaXQHdDVPKg0FSwwd/DuvyX79TZnFOnYpB7dcsFAMmtFztZuXPDvSePkFw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fast-deep-equal": "^3.1.1",
+        "fast-json-stable-stringify": "^2.0.0",
+        "json-schema-traverse": "^0.4.1",
+        "uri-js": "^4.2.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/epoberezkin"
+      }
+    },
+    "node_modules/ansi-colors": {
+      "version": "4.1.3",
+      "resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-4.1.3.tgz",
+      "integrity": "sha512-/6w/C21Pm1A7aZitlI5Ni/2J6FFQN8i1Cvz3kHABAAbw93v/NlvKdVOqz7CCWz/3iv/JplRSEEZ83XION15ovw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/ansi-escapes": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-4.3.2.tgz",
+      "integrity": "sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "type-fest": "^0.21.3"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/ansi-escapes/node_modules/type-fest": {
+      "version": "0.21.3",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.21.3.tgz",
+      "integrity": "sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==",
+      "dev": true,
+      "license": "(MIT OR CC0-1.0)",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "license": "MIT",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/anymatch": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
+      "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "normalize-path": "^3.0.0",
+        "picomatch": "^2.0.4"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/anymatch/node_modules/picomatch": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.2.tgz",
+      "integrity": "sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/argparse": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
+      "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
+      "dev": true,
+      "license": "Python-2.0"
+    },
+    "node_modules/aria-query": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.0.tgz",
+      "integrity": "sha512-b0P0sZPKtyu8HkeRAfCq0IfURZK+SuwMjY1UXGBU27wpAiTwQAIlq56IbIO+ytk/JjS1fMR14ee5WBBfKi5J6A==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "dequal": "^2.0.3"
+      }
+    },
+    "node_modules/array-buffer-byte-length": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.2.tgz",
+      "integrity": "sha512-LHE+8BuR7RYGDKvnrmcuSq3tDcKv9OFEXQt/HpbZhY7V6h0zlUXutnAD82GiFx9rdieCMjkvtcsPqBwgUl1Iiw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "is-array-buffer": "^3.0.5"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/array-includes": {
+      "version": "3.1.9",
+      "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.1.9.tgz",
+      "integrity": "sha512-FmeCCAenzH0KH381SPT5FZmiA/TmpndpcaShhfgEN9eCVjnFBqq3l1xrI42y8+PPLI6hypzou4GXw00WHmPBLQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.24.0",
+        "es-object-atoms": "^1.1.1",
+        "get-intrinsic": "^1.3.0",
+        "is-string": "^1.1.1",
+        "math-intrinsics": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/array-union": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz",
+      "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/array.prototype.findlast": {
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/array.prototype.findlast/-/array.prototype.findlast-1.2.5.tgz",
+      "integrity": "sha512-CVvd6FHg1Z3POpBLxO6E6zr+rSKEQ9L6rZHAaY7lLfhKsWYUBBOuMs0e9o24oopj6H+geRCX0YJ+TJLBK2eHyQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.2",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.0.0",
+        "es-shim-unscopables": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/array.prototype.flat": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/array.prototype.flat/-/array.prototype.flat-1.3.3.tgz",
+      "integrity": "sha512-rwG/ja1neyLqCuGZ5YYrznA62D4mZXg0i1cIskIUKSiqF3Cje9/wXAls9B9s1Wa2fomMsIv8czB8jZcPmxCXFg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.5",
+        "es-shim-unscopables": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/array.prototype.flatmap": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/array.prototype.flatmap/-/array.prototype.flatmap-1.3.3.tgz",
+      "integrity": "sha512-Y7Wt51eKJSyi80hFrJCePGGNo5ktJCslFuboqJsbf57CCPcm5zztluPlc4/aD8sWsKvlwatezpV4U1efk8kpjg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.5",
+        "es-shim-unscopables": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/array.prototype.tosorted": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/array.prototype.tosorted/-/array.prototype.tosorted-1.1.4.tgz",
+      "integrity": "sha512-p6Fx8B7b7ZhL/gmUsAy0D15WhvDccw3mnGNbZpi3pmeJdxtWsj2jEaI4Y6oo3XiHfzuSgPwKc04MYt6KgvC/wA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.3",
+        "es-errors": "^1.3.0",
+        "es-shim-unscopables": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/arraybuffer.prototype.slice": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.4.tgz",
+      "integrity": "sha512-BNoCY6SXXPQ7gF2opIP4GBE+Xw7U+pHMYKuzjgCN3GwiaIR09UUeKfheyIry77QtrCBlC0KK0q5/TER/tYh3PQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "array-buffer-byte-length": "^1.0.1",
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.5",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.6",
+        "is-array-buffer": "^3.0.4"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/assertion-error": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-2.0.1.tgz",
+      "integrity": "sha512-Izi8RQcffqCeNVgFigKli1ssklIbpHnCYc6AknXGYoB6grJqyeby7jv12JUQgmTAnIDnbck1uxksT4dzN3PWBA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/ast-v8-to-istanbul": {
+      "version": "0.3.12",
+      "resolved": "https://registry.npmjs.org/ast-v8-to-istanbul/-/ast-v8-to-istanbul-0.3.12.tgz",
+      "integrity": "sha512-BRRC8VRZY2R4Z4lFIL35MwNXmwVqBityvOIwETtsCSwvjl0IdgFsy9NhdaA6j74nUdtJJlIypeRhpDam19Wq3g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/trace-mapping": "^0.3.31",
+        "estree-walker": "^3.0.3",
+        "js-tokens": "^10.0.0"
+      }
+    },
+    "node_modules/ast-v8-to-istanbul/node_modules/js-tokens": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-10.0.0.tgz",
+      "integrity": "sha512-lM/UBzQmfJRo9ABXbPWemivdCW8V2G8FHaHdypQaIy523snUjog0W71ayWXTjiR+ixeMyVHN2XcpnTd/liPg/Q==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/astral-regex": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/astral-regex/-/astral-regex-2.0.0.tgz",
+      "integrity": "sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/async-function": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/async-function/-/async-function-1.0.0.tgz",
+      "integrity": "sha512-hsU18Ae8CDTR6Kgu9DYf0EbCr/a5iGL0rytQDobUcdpYOKokk8LEjVphnXkDkgpi0wYVsqrXuP0bZxJaTqdgoA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/asynckit": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
+      "integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==",
+      "license": "MIT"
+    },
+    "node_modules/available-typed-arrays": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz",
+      "integrity": "sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "possible-typed-array-names": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/axios": {
+      "version": "1.13.6",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-1.13.6.tgz",
+      "integrity": "sha512-ChTCHMouEe2kn713WHbQGcuYrr6fXTBiu460OTwWrWob16g1bXn4vtz07Ope7ewMozJAnEquLk5lWQWtBig9DQ==",
+      "license": "MIT",
+      "dependencies": {
+        "follow-redirects": "^1.15.11",
+        "form-data": "^4.0.5",
+        "proxy-from-env": "^1.1.0"
+      }
+    },
+    "node_modules/balanced-match": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
+      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/base64-js": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
+      "integrity": "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT"
+    },
+    "node_modules/baseline-browser-mapping": {
+      "version": "2.10.16",
+      "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.10.16.tgz",
+      "integrity": "sha512-Lyf3aK28zpsD1yQMiiHD4RvVb6UdMoo8xzG2XzFIfR9luPzOpcBlAsT/qfB1XWS1bxWT+UtE4WmQgsp297FYOA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "bin": {
+        "baseline-browser-mapping": "dist/cli.cjs"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/better-path-resolve": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/better-path-resolve/-/better-path-resolve-1.0.0.tgz",
+      "integrity": "sha512-pbnl5XzGBdrFU/wT4jqmJVPn2B6UHPBOhzMQkY/SPUPB6QtUXtmBHBIwCbXJol93mOpGMnQyP/+BB19q04xj7g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-windows": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/bidi-js": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/bidi-js/-/bidi-js-1.0.3.tgz",
+      "integrity": "sha512-RKshQI1R3YQ+n9YJz2QQ147P66ELpa1FQEg20Dk8oW9t2KgLbpDLLp9aGZ7y8WHSshDknG0bknqGw5/tyCs5tw==",
+      "license": "MIT",
+      "dependencies": {
+        "require-from-string": "^2.0.2"
+      }
+    },
+    "node_modules/binary-extensions": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz",
+      "integrity": "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/brace-expansion": {
+      "version": "1.1.13",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.13.tgz",
+      "integrity": "sha512-9ZLprWS6EENmhEOpjCYW2c8VkmOvckIJZfkr7rBW6dObmfgJ/L1GpSYW5Hpo9lDz4D1+n0Ckz8rU7FwHDQiG/w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0",
+        "concat-map": "0.0.1"
+      }
+    },
+    "node_modules/braces": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz",
+      "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==",
+      "license": "MIT",
+      "dependencies": {
+        "fill-range": "^7.1.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/browserslist": {
+      "version": "4.28.2",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.28.2.tgz",
+      "integrity": "sha512-48xSriZYYg+8qXna9kwqjIVzuQxi+KYWp2+5nCYnYKPTr0LvD89Jqk2Or5ogxz0NUMfIjhh2lIUX/LyX9B4oIg==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/browserslist"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/browserslist"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "baseline-browser-mapping": "^2.10.12",
+        "caniuse-lite": "^1.0.30001782",
+        "electron-to-chromium": "^1.5.328",
+        "node-releases": "^2.0.36",
+        "update-browserslist-db": "^1.2.3"
+      },
+      "bin": {
+        "browserslist": "cli.js"
+      },
+      "engines": {
+        "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7"
+      }
+    },
+    "node_modules/buffer": {
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/buffer/-/buffer-6.0.3.tgz",
+      "integrity": "sha512-FTiCpNxtwiZZHEZbcbTIcZjERVICn9yq/pDFkTl95/AxzD1naBctN7YO68riM/gLSDY7sdrMby8hofADYuuqOA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "base64-js": "^1.3.1",
+        "ieee754": "^1.2.1"
+      }
+    },
+    "node_modules/cacheable": {
+      "version": "2.3.4",
+      "resolved": "https://registry.npmjs.org/cacheable/-/cacheable-2.3.4.tgz",
+      "integrity": "sha512-djgxybDbw9fL/ZWMI3+CE8ZilNxcwFkVtDc1gJ+IlOSSWkSMPQabhV/XCHTQ6pwwN6aivXPZ43omTooZiX06Ew==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@cacheable/memory": "^2.0.8",
+        "@cacheable/utils": "^2.4.0",
+        "hookified": "^1.15.0",
+        "keyv": "^5.6.0",
+        "qified": "^0.9.0"
+      }
+    },
+    "node_modules/cacheable/node_modules/keyv": {
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/keyv/-/keyv-5.6.0.tgz",
+      "integrity": "sha512-CYDD3SOtsHtyXeEORYRx2qBtpDJFjRTGXUtmNEMGyzYOKj1TE3tycdlho7kA1Ufx9OYWZzg52QFBGALTirzDSw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@keyv/serialize": "^1.1.1"
+      }
+    },
+    "node_modules/call-bind": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.8.tgz",
+      "integrity": "sha512-oKlSFMcMwpUg2ednkhQ454wfWiU/ul3CkJe/PEHcTKuiX6RpbehUiFMXu13HalGZxfUwCQzZG747YXBn1im9ww==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.0",
+        "es-define-property": "^1.0.0",
+        "get-intrinsic": "^1.2.4",
+        "set-function-length": "^1.2.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/call-bind-apply-helpers": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
+      "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/call-bound": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/call-bound/-/call-bound-1.0.4.tgz",
+      "integrity": "sha512-+ys997U96po4Kx/ABpBCqhA9EuxJaQWDQg7295H4hBphv3IZg0boBKuwYpt4YXp6MZ5AmZQnU/tyMTlRpaSejg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "get-intrinsic": "^1.3.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/callsites": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
+      "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/camelcase": {
+      "version": "6.3.0",
+      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-6.3.0.tgz",
+      "integrity": "sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/caniuse-lite": {
+      "version": "1.0.30001787",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001787.tgz",
+      "integrity": "sha512-mNcrMN9KeI68u7muanUpEejSLghOKlVhRqS/Za2IeyGllJ9I9otGpR9g3nsw7n4W378TE/LyIteA0+/FOZm4Kg==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/browserslist"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/caniuse-lite"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "CC-BY-4.0"
+    },
+    "node_modules/chai": {
+      "version": "6.2.2",
+      "resolved": "https://registry.npmjs.org/chai/-/chai-6.2.2.tgz",
+      "integrity": "sha512-NUPRluOfOiTKBKvWPtSD4PhFvWCqOi0BGStNWs57X9js7XGTprSmFoz5F0tWhR4WPjNeR9jXqdC7/UpSJTnlRg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/chalk": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+      "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.1.0",
+        "supports-color": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/chardet": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/chardet/-/chardet-2.1.1.tgz",
+      "integrity": "sha512-PsezH1rqdV9VvyNhxxOW32/d75r01NY7TQCmOqomRo15ZSOKbpTFVsfjghxo6JloQUCGnH4k1LGu0R4yCLlWQQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/chart.js": {
+      "version": "4.5.1",
+      "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.5.1.tgz",
+      "integrity": "sha512-GIjfiT9dbmHRiYi6Nl2yFCq7kkwdkp1W/lp2J99rX0yo9tgJGn3lKQATztIjb5tVtevcBtIdICNWqlq5+E8/Pw==",
+      "license": "MIT",
+      "dependencies": {
+        "@kurkle/color": "^0.3.0"
+      },
+      "engines": {
+        "pnpm": ">=8"
+      }
+    },
+    "node_modules/chokidar": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-4.0.3.tgz",
+      "integrity": "sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==",
+      "license": "MIT",
+      "dependencies": {
+        "readdirp": "^4.0.1"
+      },
+      "engines": {
+        "node": ">= 14.16.0"
+      },
+      "funding": {
+        "url": "https://paulmillr.com/funding/"
+      }
+    },
+    "node_modules/ci-info": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-4.4.0.tgz",
+      "integrity": "sha512-77PSwercCZU2Fc4sX94eF8k8Pxte6JAwL4/ICZLFjJLqegs7kCuAsqqj/70NQF6TvDpgFjkubQB2FW2ZZddvQg==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/sibiraj-s"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/classnames": {
+      "version": "2.5.1",
+      "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.5.1.tgz",
+      "integrity": "sha512-saHYOzhIQs6wy2sVxTM6bUDsQO4F50V9RQ22qBpEdCW+I+/Wmke2HOl6lS6dTpdxVhb88/I6+Hs+438c3lfUow==",
+      "license": "MIT"
+    },
+    "node_modules/cli-width": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-4.1.0.tgz",
+      "integrity": "sha512-ouuZd4/dm2Sw5Gmqy6bGyNNNe1qt9RpmxveLSO7KcgsTnU7RXfsw+/bukWGo1abgBiMAic068rclZsO4IWmmxQ==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": ">= 12"
+      }
+    },
+    "node_modules/cliui": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
+      "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "string-width": "^4.2.0",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/cliui/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/cliui/node_modules/wrap-ansi": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
+    "node_modules/color-convert": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "license": "MIT",
+      "dependencies": {
+        "color-name": "~1.1.4"
+      },
+      "engines": {
+        "node": ">=7.0.0"
+      }
+    },
+    "node_modules/color-name": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+      "license": "MIT"
+    },
+    "node_modules/colord": {
+      "version": "2.9.3",
+      "resolved": "https://registry.npmjs.org/colord/-/colord-2.9.3.tgz",
+      "integrity": "sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/colorjs.io": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/colorjs.io/-/colorjs.io-0.5.2.tgz",
+      "integrity": "sha512-twmVoizEW7ylZSN32OgKdXRmo1qg+wT5/6C3xu5b9QsWzSFAhHLn2xd8ro0diCsKfCj1RdaTP/nrcW+vAoQPIw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/combined-stream": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
+      "integrity": "sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==",
+      "license": "MIT",
+      "dependencies": {
+        "delayed-stream": "~1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/compute-scroll-into-view": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/compute-scroll-into-view/-/compute-scroll-into-view-3.1.1.tgz",
+      "integrity": "sha512-VRhuHOLoKYOy4UbilLbUzbYg93XLjv2PncJC50EuTWPA3gaja1UjBsUP/D/9/juV3vQFr6XBEzn9KCAHdUvOHw==",
+      "license": "MIT"
+    },
+    "node_modules/concat-map": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
+      "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/convert-source-map": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
+      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/cookie": {
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.7.2.tgz",
+      "integrity": "sha512-yki5XnKuf750l50uGTllt6kKILY4nQ1eNIQatoXEByZ5dWgnKqbnqmTrBE5B4N7lrMJKQ2ytWMiTO2o0v6Ew/w==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/cosmiconfig": {
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-9.0.1.tgz",
+      "integrity": "sha512-hr4ihw+DBqcvrsEDioRO31Z17x71pUYoNe/4h6Z0wB72p7MU7/9gH8Q3s12NFhHPfYBBOV3qyfUxmr/Yn3shnQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "env-paths": "^2.2.1",
+        "import-fresh": "^3.3.0",
+        "js-yaml": "^4.1.0",
+        "parse-json": "^5.2.0"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/d-fischer"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.9.5"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/cross-spawn": {
+      "version": "7.0.6",
+      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
+      "integrity": "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "path-key": "^3.1.0",
+        "shebang-command": "^2.0.0",
+        "which": "^2.0.1"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/css-functions-list": {
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/css-functions-list/-/css-functions-list-3.3.3.tgz",
+      "integrity": "sha512-8HFEBPKhOpJPEPu70wJJetjKta86Gw9+CCyCnB3sui2qQfOvRyqBy4IKLKKAwdMpWb2lHXWk9Wb4Z6AmaUT1Pg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/css-tree": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-3.2.1.tgz",
+      "integrity": "sha512-X7sjQzceUhu1u7Y/ylrRZFU2FS6LRiFVp6rKLPg23y3x3c3DOKAwuXGDp+PAGjh6CSnCjYeAul8pcT8bAl+lSA==",
+      "license": "MIT",
+      "dependencies": {
+        "mdn-data": "2.27.1",
+        "source-map-js": "^1.2.1"
+      },
+      "engines": {
+        "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0"
+      }
+    },
+    "node_modules/css.escape": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/css.escape/-/css.escape-1.5.1.tgz",
+      "integrity": "sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/cssesc": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
+      "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "cssesc": "bin/cssesc"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/cssstyle": {
+      "version": "4.6.0",
+      "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-4.6.0.tgz",
+      "integrity": "sha512-2z+rWdzbbSZv6/rhtvzvqeZQHrBaqgogqt85sqFNbabZOuFbCVFb8kPeEtZjiKkbrm395irpNKiYeFeLiQnFPg==",
+      "license": "MIT",
+      "dependencies": {
+        "@asamuzakjp/css-color": "^3.2.0",
+        "rrweb-cssom": "^0.8.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/cssstyle/node_modules/@asamuzakjp/css-color": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/css-color/-/css-color-3.2.0.tgz",
+      "integrity": "sha512-K1A6z8tS3XsmCMM86xoWdn7Fkdn9m6RSVtocUrJYIwZnFVkng/PvkEoWtOWmP+Scc6saYWHWZYbndEEXxl24jw==",
+      "license": "MIT",
+      "dependencies": {
+        "@csstools/css-calc": "^2.1.3",
+        "@csstools/css-color-parser": "^3.0.9",
+        "@csstools/css-parser-algorithms": "^3.0.4",
+        "@csstools/css-tokenizer": "^3.0.3",
+        "lru-cache": "^10.4.3"
+      }
+    },
+    "node_modules/cssstyle/node_modules/@csstools/color-helpers": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/@csstools/color-helpers/-/color-helpers-5.1.0.tgz",
+      "integrity": "sha512-S11EXWJyy0Mz5SYvRmY8nJYTFFd1LCNV+7cXyAgQtOOuzb4EsgfqDufL+9esx72/eLhsRdGZwaldu/h+E4t4BA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT-0",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/cssstyle/node_modules/@csstools/css-calc": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/@csstools/css-calc/-/css-calc-2.1.4.tgz",
+      "integrity": "sha512-3N8oaj+0juUw/1H3YwmDDJXCgTB1gKU6Hc/bB502u9zR0q2vd786XJH9QfrKIEgFlZmhZiq6epXl4rHqhzsIgQ==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@csstools/css-parser-algorithms": "^3.0.5",
+        "@csstools/css-tokenizer": "^3.0.4"
+      }
+    },
+    "node_modules/cssstyle/node_modules/@csstools/css-color-parser": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@csstools/css-color-parser/-/css-color-parser-3.1.0.tgz",
+      "integrity": "sha512-nbtKwh3a6xNVIp/VRuXV64yTKnb1IjTAEEh3irzS+HkKjAOYLTGNb9pmVNntZ8iVBHcWDA2Dof0QtPgFI1BaTA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@csstools/color-helpers": "^5.1.0",
+        "@csstools/css-calc": "^2.1.4"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@csstools/css-parser-algorithms": "^3.0.5",
+        "@csstools/css-tokenizer": "^3.0.4"
+      }
+    },
+    "node_modules/cssstyle/node_modules/@csstools/css-parser-algorithms": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-3.0.5.tgz",
+      "integrity": "sha512-DaDeUkXZKjdGhgYaHNJTV9pV7Y9B3b644jCLs9Upc3VeNGg6LWARAT6O+Q+/COo+2gg/bM5rhpMAtf70WqfBdQ==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@csstools/css-tokenizer": "^3.0.4"
+      }
+    },
+    "node_modules/cssstyle/node_modules/@csstools/css-tokenizer": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-3.0.4.tgz",
+      "integrity": "sha512-Vd/9EVDiu6PPJt9yAh6roZP6El1xHrdvIVGjyBsHR0RYwNHgL7FJPyIIW4fANJNG6FtyZfvlRPpFI4ZM/lubvw==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/cssstyle/node_modules/lru-cache": {
+      "version": "10.4.3",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
+      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
+      "license": "ISC"
+    },
+    "node_modules/csstype": {
+      "version": "3.2.3",
+      "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.2.3.tgz",
+      "integrity": "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==",
+      "license": "MIT"
+    },
+    "node_modules/data-urls": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-7.0.0.tgz",
+      "integrity": "sha512-23XHcCF+coGYevirZceTVD7NdJOqVn+49IHyxgszm+JIiHLoB2TkmPtsYkNWT1pvRSGkc35L6NHs0yHkN2SumA==",
+      "license": "MIT",
+      "dependencies": {
+        "whatwg-mimetype": "^5.0.0",
+        "whatwg-url": "^16.0.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      }
+    },
+    "node_modules/data-view-buffer": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/data-view-buffer/-/data-view-buffer-1.0.2.tgz",
+      "integrity": "sha512-EmKO5V3OLXh1rtK2wgXRansaK1/mtVdTUEiEI0W8RkvgT05kfxaH29PliLnpLP73yYO6142Q72QNa8Wx/A5CqQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "es-errors": "^1.3.0",
+        "is-data-view": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/data-view-byte-length": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/data-view-byte-length/-/data-view-byte-length-1.0.2.tgz",
+      "integrity": "sha512-tuhGbE6CfTM9+5ANGf+oQb72Ky/0+s3xKUpHvShfiz2RxMFgFPjsXuRLBVMtvMs15awe45SRb83D6wH4ew6wlQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "es-errors": "^1.3.0",
+        "is-data-view": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/inspect-js"
+      }
+    },
+    "node_modules/data-view-byte-offset": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/data-view-byte-offset/-/data-view-byte-offset-1.0.1.tgz",
+      "integrity": "sha512-BS8PfmtDGnrgYdOonGZQdLZslWIeCGFP9tpan0hi1Co2Zr2NKADsvGYA8XxuG/4UWgJ6Cjtv+YJnB6MM69QGlQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "es-errors": "^1.3.0",
+        "is-data-view": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/debug": {
+      "version": "4.4.3",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz",
+      "integrity": "sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==",
+      "license": "MIT",
+      "dependencies": {
+        "ms": "^2.1.3"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/decimal.js": {
+      "version": "10.6.0",
+      "resolved": "https://registry.npmjs.org/decimal.js/-/decimal.js-10.6.0.tgz",
+      "integrity": "sha512-YpgQiITW3JXGntzdUmyUR1V812Hn8T1YVXhCu+wO3OpS4eU9l4YdD3qjyiKdV6mvV29zapkMeD390UVEf2lkUg==",
+      "license": "MIT"
+    },
+    "node_modules/deep-is": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz",
+      "integrity": "sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/deepmerge": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-2.2.1.tgz",
+      "integrity": "sha512-R9hc1Xa/NOBi9WRVUWg19rl1UB7Tt4kuPd+thNJgFZoxXsTz7ncaPaeIm+40oSGuP33DfMb4sZt1QIGiJzC4EA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/define-data-property": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.4.tgz",
+      "integrity": "sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-define-property": "^1.0.0",
+        "es-errors": "^1.3.0",
+        "gopd": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/define-properties": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.2.1.tgz",
+      "integrity": "sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "define-data-property": "^1.0.1",
+        "has-property-descriptors": "^1.0.0",
+        "object-keys": "^1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/delayed-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
+      "integrity": "sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
+    "node_modules/dequal": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/dequal/-/dequal-2.0.3.tgz",
+      "integrity": "sha512-0je+qPKHEMohvfRTCEo3CrPG6cAzAYgmzKyxRiYSSDkS6eGJdyVJm7WaYA5ECaAD9wLB2T4EEeymA5aFVcYXCA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/detect-indent": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/detect-indent/-/detect-indent-6.1.0.tgz",
+      "integrity": "sha512-reYkTUJAZb9gUuZ2RvVCNhVHdg62RHnJ7WJl8ftMi4diZ6NWlciOzQN88pUhSELEwflJht4oQDv0F0BMlwaYtA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/detect-libc": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.2.tgz",
+      "integrity": "sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==",
+      "devOptional": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/dir-glob": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz",
+      "integrity": "sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "path-type": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/doctrine": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.1.0.tgz",
+      "integrity": "sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "esutils": "^2.0.2"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/dom-accessibility-api": {
+      "version": "0.5.16",
+      "resolved": "https://registry.npmjs.org/dom-accessibility-api/-/dom-accessibility-api-0.5.16.tgz",
+      "integrity": "sha512-X7BJ2yElsnOJ30pZF4uIIDfBEVgF4XEBxL9Bxhy6dnrm5hkzqmsWHGTiHqRiITNhMyFLyAiWndIJP7Z1NTteDg==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true
+    },
+    "node_modules/dompurify": {
+      "version": "3.2.7",
+      "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.2.7.tgz",
+      "integrity": "sha512-WhL/YuveyGXJaerVlMYGWhvQswa7myDG17P7Vu65EWC05o8vfeNbvNf4d/BOvH99+ZW+LlQsc1GDKMa1vNK6dw==",
+      "license": "(MPL-2.0 OR Apache-2.0)",
+      "optionalDependencies": {
+        "@types/trusted-types": "^2.0.7"
+      }
+    },
+    "node_modules/downshift": {
+      "version": "9.3.2",
+      "resolved": "https://registry.npmjs.org/downshift/-/downshift-9.3.2.tgz",
+      "integrity": "sha512-5VD0WZLQDhipWiDU+K5ili3VDhGrXwlvOlSaSG1Cb0eS4XpssxVuoD09JNgju+bAzxB2Wvlwx+FwTE/FNdrqow==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/runtime": "^7.28.6",
+        "compute-scroll-into-view": "^3.1.1",
+        "prop-types": "^15.8.1",
+        "react-is": "^18.2.0",
+        "tslib": "^2.8.1"
+      },
+      "peerDependencies": {
+        "react": ">=16.12.0"
+      }
+    },
+    "node_modules/dunder-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
+      "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "gopd": "^1.2.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/eastasianwidth": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
+      "integrity": "sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/electron-to-chromium": {
+      "version": "1.5.334",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.334.tgz",
+      "integrity": "sha512-mgjZAz7Jyx1SRCwEpy9wefDS7GvNPazLthHg8eQMJ76wBdGQQDW33TCrUTvQ4wzpmOrv2zrFoD3oNufMdyMpog==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/enquirer": {
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/enquirer/-/enquirer-2.4.1.tgz",
+      "integrity": "sha512-rRqJg/6gd538VHvR3PSrdRBb/1Vy2YfzHqzvbhGIQpDRKIa4FgV/54b5Q1xYSxOOwKvjXweS26E0Q+nAMwp2pQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-colors": "^4.1.1",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8.6"
+      }
+    },
+    "node_modules/entities": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-6.0.1.tgz",
+      "integrity": "sha512-aN97NXWF6AWBTahfVOIrB/NShkzi5H7F9r1s9mD3cDj4Ko5f2qhhVoYMibXF7GlLveb/D2ioWay8lxI97Ven3g==",
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=0.12"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
+    "node_modules/env-paths": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/env-paths/-/env-paths-2.2.1.tgz",
+      "integrity": "sha512-+h1lkLKhZMTYjog1VEpJNG7NZJWcuc2DDk/qsqSTRRCOXiLjeQ1d1/udrUGhqMxUgAlwKNZ0cf2uqan5GLuS2A==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/error-ex": {
+      "version": "1.3.4",
+      "resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.4.tgz",
+      "integrity": "sha512-sqQamAnR14VgCr1A618A3sGrygcpK+HEbenA/HiEAkkUwcZIIB/tgWqHFxWgOyDh4nB4JCRimh79dR5Ywc9MDQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-arrayish": "^0.2.1"
+      }
+    },
+    "node_modules/es-abstract": {
+      "version": "1.24.2",
+      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.24.2.tgz",
+      "integrity": "sha512-2FpH9Q5i2RRwyEP1AylXe6nYLR5OhaJTZwmlcP0dL/+JCbgg7yyEo/sEK6HeGZRf3dFpWwThaRHVApXSkW3xeg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "array-buffer-byte-length": "^1.0.2",
+        "arraybuffer.prototype.slice": "^1.0.4",
+        "available-typed-arrays": "^1.0.7",
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
+        "data-view-buffer": "^1.0.2",
+        "data-view-byte-length": "^1.0.2",
+        "data-view-byte-offset": "^1.0.1",
+        "es-define-property": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.1.1",
+        "es-set-tostringtag": "^2.1.0",
+        "es-to-primitive": "^1.3.0",
+        "function.prototype.name": "^1.1.8",
+        "get-intrinsic": "^1.3.0",
+        "get-proto": "^1.0.1",
+        "get-symbol-description": "^1.1.0",
+        "globalthis": "^1.0.4",
+        "gopd": "^1.2.0",
+        "has-property-descriptors": "^1.0.2",
+        "has-proto": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "hasown": "^2.0.2",
+        "internal-slot": "^1.1.0",
+        "is-array-buffer": "^3.0.5",
+        "is-callable": "^1.2.7",
+        "is-data-view": "^1.0.2",
+        "is-negative-zero": "^2.0.3",
+        "is-regex": "^1.2.1",
+        "is-set": "^2.0.3",
+        "is-shared-array-buffer": "^1.0.4",
+        "is-string": "^1.1.1",
+        "is-typed-array": "^1.1.15",
+        "is-weakref": "^1.1.1",
+        "math-intrinsics": "^1.1.0",
+        "object-inspect": "^1.13.4",
+        "object-keys": "^1.1.1",
+        "object.assign": "^4.1.7",
+        "own-keys": "^1.0.1",
+        "regexp.prototype.flags": "^1.5.4",
+        "safe-array-concat": "^1.1.3",
+        "safe-push-apply": "^1.0.0",
+        "safe-regex-test": "^1.1.0",
+        "set-proto": "^1.0.0",
+        "stop-iteration-iterator": "^1.1.0",
+        "string.prototype.trim": "^1.2.10",
+        "string.prototype.trimend": "^1.0.9",
+        "string.prototype.trimstart": "^1.0.8",
+        "typed-array-buffer": "^1.0.3",
+        "typed-array-byte-length": "^1.0.3",
+        "typed-array-byte-offset": "^1.0.4",
+        "typed-array-length": "^1.0.7",
+        "unbox-primitive": "^1.1.0",
+        "which-typed-array": "^1.1.19"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/es-define-property": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
+      "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-errors": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
+      "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-iterator-helpers": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/es-iterator-helpers/-/es-iterator-helpers-1.3.1.tgz",
+      "integrity": "sha512-zWwRvqWiuBPr0muUG/78cW3aHROFCNIQ3zpmYDpwdbnt2m+xlNyRWpHBpa2lJjSBit7BQ+RXA1iwbSmu5yJ/EQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.24.1",
+        "es-errors": "^1.3.0",
+        "es-set-tostringtag": "^2.1.0",
+        "function-bind": "^1.1.2",
+        "get-intrinsic": "^1.3.0",
+        "globalthis": "^1.0.4",
+        "gopd": "^1.2.0",
+        "has-property-descriptors": "^1.0.2",
+        "has-proto": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "internal-slot": "^1.1.0",
+        "iterator.prototype": "^1.1.5",
+        "math-intrinsics": "^1.1.0",
+        "safe-array-concat": "^1.1.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-module-lexer": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-1.7.0.tgz",
+      "integrity": "sha512-jEQoCwk8hyb2AZziIOLhDqpm5+2ww5uIE6lkO/6jcOCusfk6LhMHpXXfBLXTZ7Ydyt0j4VoUQv6uGNYbdW+kBA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/es-object-atoms": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.1.tgz",
+      "integrity": "sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-set-tostringtag": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.1.0.tgz",
+      "integrity": "sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==",
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.6",
+        "has-tostringtag": "^1.0.2",
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-shim-unscopables": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/es-shim-unscopables/-/es-shim-unscopables-1.1.0.tgz",
+      "integrity": "sha512-d9T8ucsEhh8Bi1woXCf+TIKDIROLG5WCkxg8geBCbvk22kzwC5G2OnXVMO6FUsvQlgUUXQ2itephWDLqDzbeCw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-to-primitive": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.3.0.tgz",
+      "integrity": "sha512-w+5mJ3GuFL+NjVtJlvydShqE1eN3h3PbI7/5LAsYJP/2qtuMXjfL2LpHSRqo4b4eSF5K/DH1JXKUAHSB2UW50g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-callable": "^1.2.7",
+        "is-date-object": "^1.0.5",
+        "is-symbol": "^1.0.4"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/esbuild": {
+      "version": "0.27.7",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.7.tgz",
+      "integrity": "sha512-IxpibTjyVnmrIQo5aqNpCgoACA/dTKLTlhMHihVHhdkxKyPO1uBBthumT0rdHmcsk9uMonIWS0m4FljWzILh3w==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "bin": {
+        "esbuild": "bin/esbuild"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "optionalDependencies": {
+        "@esbuild/aix-ppc64": "0.27.7",
+        "@esbuild/android-arm": "0.27.7",
+        "@esbuild/android-arm64": "0.27.7",
+        "@esbuild/android-x64": "0.27.7",
+        "@esbuild/darwin-arm64": "0.27.7",
+        "@esbuild/darwin-x64": "0.27.7",
+        "@esbuild/freebsd-arm64": "0.27.7",
+        "@esbuild/freebsd-x64": "0.27.7",
+        "@esbuild/linux-arm": "0.27.7",
+        "@esbuild/linux-arm64": "0.27.7",
+        "@esbuild/linux-ia32": "0.27.7",
+        "@esbuild/linux-loong64": "0.27.7",
+        "@esbuild/linux-mips64el": "0.27.7",
+        "@esbuild/linux-ppc64": "0.27.7",
+        "@esbuild/linux-riscv64": "0.27.7",
+        "@esbuild/linux-s390x": "0.27.7",
+        "@esbuild/linux-x64": "0.27.7",
+        "@esbuild/netbsd-arm64": "0.27.7",
+        "@esbuild/netbsd-x64": "0.27.7",
+        "@esbuild/openbsd-arm64": "0.27.7",
+        "@esbuild/openbsd-x64": "0.27.7",
+        "@esbuild/openharmony-arm64": "0.27.7",
+        "@esbuild/sunos-x64": "0.27.7",
+        "@esbuild/win32-arm64": "0.27.7",
+        "@esbuild/win32-ia32": "0.27.7",
+        "@esbuild/win32-x64": "0.27.7"
+      }
+    },
+    "node_modules/escalade": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz",
+      "integrity": "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/escape-string-regexp": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz",
+      "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/eslint": {
+      "version": "9.39.4",
+      "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.39.4.tgz",
+      "integrity": "sha512-XoMjdBOwe/esVgEvLmNsD3IRHkm7fbKIUGvrleloJXUZgDHig2IPWNniv+GwjyJXzuNqVjlr5+4yVUZjycJwfQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@eslint-community/eslint-utils": "^4.8.0",
+        "@eslint-community/regexpp": "^4.12.1",
+        "@eslint/config-array": "^0.21.2",
+        "@eslint/config-helpers": "^0.4.2",
+        "@eslint/core": "^0.17.0",
+        "@eslint/eslintrc": "^3.3.5",
+        "@eslint/js": "9.39.4",
+        "@eslint/plugin-kit": "^0.4.1",
+        "@humanfs/node": "^0.16.6",
+        "@humanwhocodes/module-importer": "^1.0.1",
+        "@humanwhocodes/retry": "^0.4.2",
+        "@types/estree": "^1.0.6",
+        "ajv": "^6.14.0",
+        "chalk": "^4.0.0",
+        "cross-spawn": "^7.0.6",
+        "debug": "^4.3.2",
+        "escape-string-regexp": "^4.0.0",
+        "eslint-scope": "^8.4.0",
+        "eslint-visitor-keys": "^4.2.1",
+        "espree": "^10.4.0",
+        "esquery": "^1.5.0",
+        "esutils": "^2.0.2",
+        "fast-deep-equal": "^3.1.3",
+        "file-entry-cache": "^8.0.0",
+        "find-up": "^5.0.0",
+        "glob-parent": "^6.0.2",
+        "ignore": "^5.2.0",
+        "imurmurhash": "^0.1.4",
+        "is-glob": "^4.0.0",
+        "json-stable-stringify-without-jsonify": "^1.0.1",
+        "lodash.merge": "^4.6.2",
+        "minimatch": "^3.1.5",
+        "natural-compare": "^1.4.0",
+        "optionator": "^0.9.3"
+      },
+      "bin": {
+        "eslint": "bin/eslint.js"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://eslint.org/donate"
+      },
+      "peerDependencies": {
+        "jiti": "*"
+      },
+      "peerDependenciesMeta": {
+        "jiti": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/eslint-config-prettier": {
+      "version": "10.1.8",
+      "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-10.1.8.tgz",
+      "integrity": "sha512-82GZUjRS0p/jganf6q1rEO25VSoHH0hKPCTrgillPjdI/3bgBhAE1QzHrHTizjpRvy6pGAvKjDJtk2pF9NDq8w==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "eslint-config-prettier": "bin/cli.js"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint-config-prettier"
+      },
+      "peerDependencies": {
+        "eslint": ">=7.0.0"
+      }
+    },
+    "node_modules/eslint-plugin-react": {
+      "version": "7.37.5",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-react/-/eslint-plugin-react-7.37.5.tgz",
+      "integrity": "sha512-Qteup0SqU15kdocexFNAJMvCJEfa2xUKNV4CC1xsVMrIIqEy3SQ/rqyxCWNzfrd3/ldy6HMlD2e0JDVpDg2qIA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "array-includes": "^3.1.8",
+        "array.prototype.findlast": "^1.2.5",
+        "array.prototype.flatmap": "^1.3.3",
+        "array.prototype.tosorted": "^1.1.4",
+        "doctrine": "^2.1.0",
+        "es-iterator-helpers": "^1.2.1",
+        "estraverse": "^5.3.0",
+        "hasown": "^2.0.2",
+        "jsx-ast-utils": "^2.4.1 || ^3.0.0",
+        "minimatch": "^3.1.2",
+        "object.entries": "^1.1.9",
+        "object.fromentries": "^2.0.8",
+        "object.values": "^1.2.1",
+        "prop-types": "^15.8.1",
+        "resolve": "^2.0.0-next.5",
+        "semver": "^6.3.1",
+        "string.prototype.matchall": "^4.0.12",
+        "string.prototype.repeat": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=4"
+      },
+      "peerDependencies": {
+        "eslint": "^3 || ^4 || ^5 || ^6 || ^7 || ^8 || ^9.7"
+      }
+    },
+    "node_modules/eslint-plugin-react-hooks": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-7.0.1.tgz",
+      "integrity": "sha512-O0d0m04evaNzEPoSW+59Mezf8Qt0InfgGIBJnpC0h3NH/WjUAR7BIKUfysC6todmtiZ/A0oUVS8Gce0WhBrHsA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/core": "^7.24.4",
+        "@babel/parser": "^7.24.4",
+        "hermes-parser": "^0.25.1",
+        "zod": "^3.25.0 || ^4.0.0",
+        "zod-validation-error": "^3.5.0 || ^4.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "eslint": "^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0 || ^9.0.0"
+      }
+    },
+    "node_modules/eslint-plugin-react/node_modules/semver": {
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      }
+    },
+    "node_modules/eslint-scope": {
+      "version": "8.4.0",
+      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-8.4.0.tgz",
+      "integrity": "sha512-sNXOfKCn74rt8RICKMvJS7XKV/Xk9kA7DyJr8mJik3S7Cwgy3qlkkmyS2uQB3jiJg6VNdZd/pDBJu0nvG2NlTg==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "esrecurse": "^4.3.0",
+        "estraverse": "^5.2.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/eslint-visitor-keys": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz",
+      "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/eslint/node_modules/find-up": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz",
+      "integrity": "sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "locate-path": "^6.0.0",
+        "path-exists": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/eslint/node_modules/locate-path": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
+      "integrity": "sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "p-locate": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/eslint/node_modules/p-limit": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-3.1.0.tgz",
+      "integrity": "sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "yocto-queue": "^0.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/eslint/node_modules/p-locate": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-5.0.0.tgz",
+      "integrity": "sha512-LaNjtRWUBY++zB5nE/NwcaoMylSPk+S+ZHNB1TzdbMJMny6dynpAGt7X/tl/QYq3TIeE6nxHppbo2LGymrG5Pw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "p-limit": "^3.0.2"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/espree": {
+      "version": "10.4.0",
+      "resolved": "https://registry.npmjs.org/espree/-/espree-10.4.0.tgz",
+      "integrity": "sha512-j6PAQ2uUr79PZhBjP5C5fhl8e39FmRnOjsD5lGnWrFU8i2G776tBK7+nP8KuQUTTyAZUwfQqXAgrVH5MbH9CYQ==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "acorn": "^8.15.0",
+        "acorn-jsx": "^5.3.2",
+        "eslint-visitor-keys": "^4.2.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/esprima": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz",
+      "integrity": "sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "bin": {
+        "esparse": "bin/esparse.js",
+        "esvalidate": "bin/esvalidate.js"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/esquery": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.7.0.tgz",
+      "integrity": "sha512-Ap6G0WQwcU/LHsvLwON1fAQX9Zp0A2Y6Y/cJBl9r/JbW90Zyg4/zbG6zzKa2OTALELarYHmKu0GhpM5EO+7T0g==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "estraverse": "^5.1.0"
+      },
+      "engines": {
+        "node": ">=0.10"
+      }
+    },
+    "node_modules/esrecurse": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.3.0.tgz",
+      "integrity": "sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "estraverse": "^5.2.0"
+      },
+      "engines": {
+        "node": ">=4.0"
+      }
+    },
+    "node_modules/estraverse": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
+      "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=4.0"
+      }
+    },
+    "node_modules/estree-walker": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-3.0.3.tgz",
+      "integrity": "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree": "^1.0.0"
+      }
+    },
+    "node_modules/esutils": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz",
+      "integrity": "sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/expect": {
+      "version": "30.3.0",
+      "resolved": "https://registry.npmjs.org/expect/-/expect-30.3.0.tgz",
+      "integrity": "sha512-1zQrciTiQfRdo7qJM1uG4navm8DayFa2TgCSRlzUyNkhcJ6XUZF3hjnpkyr3VhAqPH7i/9GkG7Tv5abz6fqz0Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/expect-utils": "30.3.0",
+        "@jest/get-type": "30.1.0",
+        "jest-matcher-utils": "30.3.0",
+        "jest-message-util": "30.3.0",
+        "jest-mock": "30.3.0",
+        "jest-util": "30.3.0"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/expect-type": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/expect-type/-/expect-type-1.3.0.tgz",
+      "integrity": "sha512-knvyeauYhqjOYvQ66MznSMs83wmHrCycNEN6Ao+2AeYEfxUIkuiVxdEa1qlGEPK+We3n0THiDciYSsCcgW/DoA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
+    "node_modules/extendable-error": {
+      "version": "0.1.7",
+      "resolved": "https://registry.npmjs.org/extendable-error/-/extendable-error-0.1.7.tgz",
+      "integrity": "sha512-UOiS2in6/Q0FK0R0q6UY9vYpQ21mr/Qn1KOnte7vsACuNJf514WvCCUHSRCPcgjPT2bAhNIJdlE6bVap1GKmeg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/fast-deep-equal": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
+      "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
+      "license": "MIT"
+    },
+    "node_modules/fast-glob": {
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.3.tgz",
+      "integrity": "sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@nodelib/fs.stat": "^2.0.2",
+        "@nodelib/fs.walk": "^1.2.3",
+        "glob-parent": "^5.1.2",
+        "merge2": "^1.3.0",
+        "micromatch": "^4.0.8"
+      },
+      "engines": {
+        "node": ">=8.6.0"
+      }
+    },
+    "node_modules/fast-glob/node_modules/glob-parent": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "is-glob": "^4.0.1"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
+    "node_modules/fast-json-stable-stringify": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz",
+      "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/fast-levenshtein": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
+      "integrity": "sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/fast-uri": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/fast-uri/-/fast-uri-3.1.0.tgz",
+      "integrity": "sha512-iPeeDKJSWf4IEOasVVrknXpaBV0IApz/gp7S2bb7Z4Lljbl2MGJRqInZiUrQwV16cpzw/D3S5j5Julj/gT52AA==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/fastify"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/fastify"
+        }
+      ],
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/fastest-levenshtein": {
+      "version": "1.0.16",
+      "resolved": "https://registry.npmjs.org/fastest-levenshtein/-/fastest-levenshtein-1.0.16.tgz",
+      "integrity": "sha512-eRnCtTTtGZFpQCwhJiUOuxPQWRXVKYDn0b2PeHfXL6/Zi53SLAzAHfVhVWK2AryC/WH05kGfxhFIPvTF0SXQzg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4.9.1"
+      }
+    },
+    "node_modules/fastq": {
+      "version": "1.20.1",
+      "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.20.1.tgz",
+      "integrity": "sha512-GGToxJ/w1x32s/D2EKND7kTil4n8OVk/9mycTc4VDza13lOvpUZTGX3mFSCtV9ksdGBVzvsyAVLM6mHFThxXxw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "reusify": "^1.0.4"
+      }
+    },
+    "node_modules/fdir": {
+      "version": "6.5.0",
+      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
+      "integrity": "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "peerDependencies": {
+        "picomatch": "^3 || ^4"
+      },
+      "peerDependenciesMeta": {
+        "picomatch": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/file-entry-cache": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-8.0.0.tgz",
+      "integrity": "sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "flat-cache": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=16.0.0"
+      }
+    },
+    "node_modules/fill-range": {
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
+      "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==",
+      "license": "MIT",
+      "dependencies": {
+        "to-regex-range": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/find-up": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-4.1.0.tgz",
+      "integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "locate-path": "^5.0.0",
+        "path-exists": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/flat-cache": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-4.0.1.tgz",
+      "integrity": "sha512-f7ccFPK3SXFHpx15UIGyRJ/FJQctuKZ0zVuN3frBo4HnK3cay9VEW0R6yPYFHC0AgqhukPzKjq22t5DmAyqGyw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "flatted": "^3.2.9",
+        "keyv": "^4.5.4"
+      },
+      "engines": {
+        "node": ">=16"
+      }
+    },
+    "node_modules/flatted": {
+      "version": "3.4.2",
+      "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.4.2.tgz",
+      "integrity": "sha512-PjDse7RzhcPkIJwy5t7KPWQSZ9cAbzQXcafsetQoD7sOJRQlGikNbx7yZp2OotDnJyrDcbyRq3Ttb18iYOqkxA==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/follow-redirects": {
+      "version": "1.15.11",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.11.tgz",
+      "integrity": "sha512-deG2P0JfjrTxl50XGCDyfI97ZGVCxIpfKYmfyrQ54n5FO/0gfIES8C/Psl6kWVDolizcaaxZJnTS0QSMxvnsBQ==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://github.com/sponsors/RubenVerborgh"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=4.0"
+      },
+      "peerDependenciesMeta": {
+        "debug": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/for-each": {
+      "version": "0.3.5",
+      "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.5.tgz",
+      "integrity": "sha512-dKx12eRCVIzqCxFGplyFKJMPvLEWgmNtUrpTiJIR5u97zEhRG8ySrtboPHZXx7daLxQVrl643cTzbab2tkQjxg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-callable": "^1.2.7"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/foreground-child": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/foreground-child/-/foreground-child-3.3.1.tgz",
+      "integrity": "sha512-gIXjKqtFuWEgzFRJA9WCQeSJLZDjgJUOMCMzxtvFq/37KojM1BFGufqsCy0r4qSQmYLsZYMeyRqzIWOMup03sw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "cross-spawn": "^7.0.6",
+        "signal-exit": "^4.0.1"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/form-data": {
+      "version": "4.0.5",
+      "resolved": "https://registry.npmjs.org/form-data/-/form-data-4.0.5.tgz",
+      "integrity": "sha512-8RipRLol37bNs2bhoV67fiTEvdTrbMUYcFTiy3+wuuOnUog2QBHCZWXDRijWQfAkhBj2Uf5UnVaiWwA5vdd82w==",
+      "license": "MIT",
+      "dependencies": {
+        "asynckit": "^0.4.0",
+        "combined-stream": "^1.0.8",
+        "es-set-tostringtag": "^2.1.0",
+        "hasown": "^2.0.2",
+        "mime-types": "^2.1.12"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
+    "node_modules/formik": {
+      "version": "2.4.9",
+      "resolved": "https://registry.npmjs.org/formik/-/formik-2.4.9.tgz",
+      "integrity": "sha512-5nI94BMnlFDdQRBY4Sz39WkhxajZJ57Fzs8wVbtsQlm5ScKIR1QLYqv/ultBnobObtlUyxpxoLodpixrsf36Og==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://opencollective.com/formik"
+        }
+      ],
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@types/hoist-non-react-statics": "^3.3.1",
+        "deepmerge": "^2.1.1",
+        "hoist-non-react-statics": "^3.3.0",
+        "lodash": "^4.17.21",
+        "lodash-es": "^4.17.21",
+        "react-fast-compare": "^2.0.1",
+        "tiny-warning": "^1.0.2",
+        "tslib": "^2.0.0"
+      },
+      "peerDependencies": {
+        "react": ">=16.8.0"
+      }
+    },
+    "node_modules/fs-extra": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-7.0.1.tgz",
+      "integrity": "sha512-YJDaCJZEnBmcbw13fvdAM9AwNOJwOzrE4pqMqBq5nFiEqXUqHwlK4B+3pUw6JNvfSPtX05xFHtYy/1ni01eGCw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "graceful-fs": "^4.1.2",
+        "jsonfile": "^4.0.0",
+        "universalify": "^0.1.0"
+      },
+      "engines": {
+        "node": ">=6 <7 || >=8"
+      }
+    },
+    "node_modules/fsevents": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
+      "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+      }
+    },
+    "node_modules/function-bind": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
+      "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/function.prototype.name": {
+      "version": "1.1.8",
+      "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.8.tgz",
+      "integrity": "sha512-e5iwyodOHhbMr/yNrc7fDYG4qlbIvI5gajyzPnb5TCwyhjApznQh1BMFou9b30SevY43gCJKXycoCBjMbsuW0Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
+        "define-properties": "^1.2.1",
+        "functions-have-names": "^1.2.3",
+        "hasown": "^2.0.2",
+        "is-callable": "^1.2.7"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/functions-have-names": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/functions-have-names/-/functions-have-names-1.2.3.tgz",
+      "integrity": "sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/generator-function": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/generator-function/-/generator-function-2.0.1.tgz",
+      "integrity": "sha512-SFdFmIJi+ybC0vjlHN0ZGVGHc3lgE0DxPAT0djjVg+kjOnSqclqmj0KQ7ykTOLP6YxoqOvuAODGdcHJn+43q3g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/gensync": {
+      "version": "1.0.0-beta.2",
+      "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
+      "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/get-caller-file": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
+      "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "6.* || 8.* || >= 10.*"
+      }
+    },
+    "node_modules/get-east-asian-width": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/get-east-asian-width/-/get-east-asian-width-1.5.0.tgz",
+      "integrity": "sha512-CQ+bEO+Tva/qlmw24dCejulK5pMzVnUOFOijVogd3KQs07HnRIgp8TGipvCCRT06xeYEbpbgwaCxglFyiuIcmA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/get-intrinsic": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
+      "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "es-define-property": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.1.1",
+        "function-bind": "^1.1.2",
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "hasown": "^2.0.2",
+        "math-intrinsics": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/get-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
+      "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",
+      "license": "MIT",
+      "dependencies": {
+        "dunder-proto": "^1.0.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/get-symbol-description": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.1.0.tgz",
+      "integrity": "sha512-w9UMqWwJxHNOvoNzSJ2oPF5wvYcvP7jUvYzhp67yEhTi17ZDBBC1z9pTdGuzjD+EFIqLSYRweZjqfiPzQ06Ebg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.6"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/glob": {
+      "version": "10.5.0",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-10.5.0.tgz",
+      "integrity": "sha512-DfXN8DfhJ7NH3Oe7cFmu3NCu1wKbkReJ8TorzSAFbSKrlNaQSKfIzqYqVY8zlbs2NLBbWpRiU52GX2PbaBVNkg==",
+      "deprecated": "Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "foreground-child": "^3.1.0",
+        "jackspeak": "^3.1.2",
+        "minimatch": "^9.0.4",
+        "minipass": "^7.1.2",
+        "package-json-from-dist": "^1.0.0",
+        "path-scurry": "^1.11.1"
+      },
+      "bin": {
+        "glob": "dist/esm/bin.mjs"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/glob-parent": {
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
+      "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "is-glob": "^4.0.3"
+      },
+      "engines": {
+        "node": ">=10.13.0"
+      }
+    },
+    "node_modules/glob/node_modules/brace-expansion": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.3.tgz",
+      "integrity": "sha512-MCV/fYJEbqx68aE58kv2cA/kiky1G8vux3OR6/jbS+jIMe/6fJWa0DTzJU7dqijOWYwHi1t29FlfYI9uytqlpA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0"
+      }
+    },
+    "node_modules/glob/node_modules/minimatch": {
+      "version": "9.0.9",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.9.tgz",
+      "integrity": "sha512-OBwBN9AL4dqmETlpS2zasx+vTeWclWzkblfZk7KTA5j3jeOONz/tRCnZomUyvNg83wL5Zv9Ss6HMJXAgL8R2Yg==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^2.0.2"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/global-modules": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-2.0.0.tgz",
+      "integrity": "sha512-NGbfmJBp9x8IxyJSd1P+otYK8vonoJactOogrVfFRIAEY1ukil8RSKDz2Yo7wh1oihl51l/r6W4epkeKJHqL8A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "global-prefix": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/global-prefix": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-3.0.0.tgz",
+      "integrity": "sha512-awConJSVCHVGND6x3tmMaKcQvwXLhjdkmomy2W+Goaui8YPgYgXJZewhg3fWC+DlfqqQuWg8AwqjGTD2nAPVWg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ini": "^1.3.5",
+        "kind-of": "^6.0.2",
+        "which": "^1.3.1"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/global-prefix/node_modules/which": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
+      "integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "isexe": "^2.0.0"
+      },
+      "bin": {
+        "which": "bin/which"
+      }
+    },
+    "node_modules/globals": {
+      "version": "17.4.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-17.4.0.tgz",
+      "integrity": "sha512-hjrNztw/VajQwOLsMNT1cbJiH2muO3OROCHnbehc8eY5JyD2gqz4AcMHPqgaOR59DjgUjYAYLeH699g/eWi2jw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/globalthis": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/globalthis/-/globalthis-1.0.4.tgz",
+      "integrity": "sha512-DpLKbNU4WylpxJykQujfCcwYWiV/Jhm50Goo0wrVILAv5jOr9d+H+UR3PhSCD2rCCEIg0uc+G+muBTwD54JhDQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "define-properties": "^1.2.1",
+        "gopd": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/globby": {
+      "version": "11.1.0",
+      "resolved": "https://registry.npmjs.org/globby/-/globby-11.1.0.tgz",
+      "integrity": "sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "array-union": "^2.1.0",
+        "dir-glob": "^3.0.1",
+        "fast-glob": "^3.2.9",
+        "ignore": "^5.2.0",
+        "merge2": "^1.4.1",
+        "slash": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/globjoin": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/globjoin/-/globjoin-0.1.4.tgz",
+      "integrity": "sha512-xYfnw62CKG8nLkZBfWbhWwDw02CHty86jfPcc2cr3ZfeuK9ysoVPPEUxf21bAD/rWAgk52SuBrLJlefNy8mvFg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/gopd": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
+      "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/graceful-fs": {
+      "version": "4.2.11",
+      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz",
+      "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==",
+      "license": "ISC"
+    },
+    "node_modules/graphql": {
+      "version": "16.13.2",
+      "resolved": "https://registry.npmjs.org/graphql/-/graphql-16.13.2.tgz",
+      "integrity": "sha512-5bJ+nf/UCpAjHM8i06fl7eLyVC9iuNAjm9qzkiu2ZGhM0VscSvS6WDPfAwkdkBuoXGM9FJSbKl6wylMwP9Ktig==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^12.22.0 || ^14.16.0 || ^16.0.0 || >=17.0.0"
+      }
+    },
+    "node_modules/has-bigints": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/has-bigints/-/has-bigints-1.1.0.tgz",
+      "integrity": "sha512-R3pbpkcIqv2Pm3dUwgjclDRVmWpTJW2DcMzcIhEXEx1oh/CEMObMm3KLmRJOdvhM7o4uQBnwr8pzRK2sJWIqfg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/has-flag": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+      "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/has-property-descriptors": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz",
+      "integrity": "sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-define-property": "^1.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/has-proto": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.2.0.tgz",
+      "integrity": "sha512-KIL7eQPfHQRC8+XluaIw7BHUwwqL19bQn4hzNgdr+1wXoU0KKj6rufu47lhY7KbJR2C6T6+PfyN0Ea7wkSS+qQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "dunder-proto": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/has-symbols": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
+      "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/has-tostringtag": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz",
+      "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==",
+      "license": "MIT",
+      "dependencies": {
+        "has-symbols": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/hashery": {
+      "version": "1.5.1",
+      "resolved": "https://registry.npmjs.org/hashery/-/hashery-1.5.1.tgz",
+      "integrity": "sha512-iZyKG96/JwPz1N55vj2Ie2vXbhu440zfUfJvSwEqEbeLluk7NnapfGqa7LH0mOsnDxTF85Mx8/dyR6HfqcbmbQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "hookified": "^1.15.0"
+      },
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/hasown": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz",
+      "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==",
+      "license": "MIT",
+      "dependencies": {
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/headers-polyfill": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/headers-polyfill/-/headers-polyfill-4.0.3.tgz",
+      "integrity": "sha512-IScLbePpkvO846sIwOtOTDjutRMWdXdJmXdMvk6gCBHxFO8d+QKOQedyZSxFTTFYRSmlgSTDtXqqq4pcenBXLQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/hermes-estree": {
+      "version": "0.25.1",
+      "resolved": "https://registry.npmjs.org/hermes-estree/-/hermes-estree-0.25.1.tgz",
+      "integrity": "sha512-0wUoCcLp+5Ev5pDW2OriHC2MJCbwLwuRx+gAqMTOkGKJJiBCLjtrvy4PWUGn6MIVefecRpzoOZ/UV6iGdOr+Cw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/hermes-parser": {
+      "version": "0.25.1",
+      "resolved": "https://registry.npmjs.org/hermes-parser/-/hermes-parser-0.25.1.tgz",
+      "integrity": "sha512-6pEjquH3rqaI6cYAXYPcz9MS4rY6R4ngRgrgfDshRptUZIc3lw0MCIJIGDj9++mfySOuPTHB4nrSW99BCvOPIA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "hermes-estree": "0.25.1"
+      }
+    },
+    "node_modules/hoist-non-react-statics": {
+      "version": "3.3.2",
+      "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz",
+      "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "react-is": "^16.7.0"
+      }
+    },
+    "node_modules/hoist-non-react-statics/node_modules/react-is": {
+      "version": "16.13.1",
+      "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
+      "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
+      "license": "MIT"
+    },
+    "node_modules/hookified": {
+      "version": "1.15.1",
+      "resolved": "https://registry.npmjs.org/hookified/-/hookified-1.15.1.tgz",
+      "integrity": "sha512-MvG/clsADq1GPM2KGo2nyfaWVyn9naPiXrqIe4jYjXNZQt238kWyOGrsyc/DmRAQ+Re6yeo6yX/yoNCG5KAEVg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/html-encoding-sniffer": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-6.0.0.tgz",
+      "integrity": "sha512-CV9TW3Y3f8/wT0BRFc1/KAVQ3TUHiXmaAb6VW9vtiMFf7SLoMd1PdAc4W3KFOFETBJUb90KatHqlsZMWV+R9Gg==",
+      "license": "MIT",
+      "dependencies": {
+        "@exodus/bytes": "^1.6.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      }
+    },
+    "node_modules/html-escaper": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/html-escaper/-/html-escaper-2.0.2.tgz",
+      "integrity": "sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/html-tags": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/html-tags/-/html-tags-5.1.0.tgz",
+      "integrity": "sha512-n6l5uca7/y5joxZ3LUePhzmBFUJ+U2YWzhMa8XUTecSeSlQiZdF5XAd/Q3/WUl0VsXgUwWi8I7CNIwdI5WN1SQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/http-proxy-agent": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-7.0.2.tgz",
+      "integrity": "sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==",
+      "license": "MIT",
+      "dependencies": {
+        "agent-base": "^7.1.0",
+        "debug": "^4.3.4"
+      },
+      "engines": {
+        "node": ">= 14"
+      }
+    },
+    "node_modules/https-proxy-agent": {
+      "version": "7.0.6",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.6.tgz",
+      "integrity": "sha512-vK9P5/iUfdl95AI+JVyUuIcVtd4ofvtrOr3HNtM2yxC9bnMbEdp3x01OhQNnjb8IJYi38VlTE3mBXwcfvywuSw==",
+      "license": "MIT",
+      "dependencies": {
+        "agent-base": "^7.1.2",
+        "debug": "4"
+      },
+      "engines": {
+        "node": ">= 14"
+      }
+    },
+    "node_modules/human-id": {
+      "version": "4.1.3",
+      "resolved": "https://registry.npmjs.org/human-id/-/human-id-4.1.3.tgz",
+      "integrity": "sha512-tsYlhAYpjCKa//8rXZ9DqKEawhPoSytweBC2eNvcaDK+57RZLHGqNs3PZTQO6yekLFSuvA6AlnAfrw1uBvtb+Q==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "human-id": "dist/cli.js"
+      }
+    },
+    "node_modules/iconv-lite": {
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.7.2.tgz",
+      "integrity": "sha512-im9DjEDQ55s9fL4EYzOAv0yMqmMBSZp6G0VvFyTMPKWxiSBHUj9NW/qqLmXUwXrrM7AvqSlTCfvqRb0cM8yYqw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "safer-buffer": ">= 2.1.2 < 3.0.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/icss-replace-symbols": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/icss-replace-symbols/-/icss-replace-symbols-1.1.0.tgz",
+      "integrity": "sha512-chIaY3Vh2mh2Q3RGXttaDIzeiPvaVXJ+C4DAh/w3c37SKZ/U6PGMmuicR2EQQp9bKG8zLMCl7I+PtIoOOPp8Gg==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/icss-utils": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-5.1.0.tgz",
+      "integrity": "sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "^10 || ^12 || >= 14"
+      },
+      "peerDependencies": {
+        "postcss": "^8.1.0"
+      }
+    },
+    "node_modules/ieee754": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz",
+      "integrity": "sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/ignore": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
+      "integrity": "sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4"
+      }
+    },
+    "node_modules/immutable": {
+      "version": "5.1.5",
+      "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.5.tgz",
+      "integrity": "sha512-t7xcm2siw+hlUM68I+UEOK+z84RzmN59as9DZ7P1l0994DKUWV7UXBMQZVxaoMSRQ+PBZbHCOoBt7a2wxOMt+A==",
+      "license": "MIT"
+    },
+    "node_modules/import-fresh": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.1.tgz",
+      "integrity": "sha512-TR3KfrTZTYLPB6jUjfx6MF9WcWrHL9su5TObK4ZkYgBdWKPOFoSoQIdEuTuR82pmtxH2spWG9h6etwfr1pLBqQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "parent-module": "^1.0.0",
+        "resolve-from": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/import-fresh/node_modules/resolve-from": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
+      "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/import-meta-resolve": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/import-meta-resolve/-/import-meta-resolve-4.2.0.tgz",
+      "integrity": "sha512-Iqv2fzaTQN28s/FwZAoFq0ZSs/7hMAHJVX+w8PZl3cY19Pxk6jFFalxQoIfW2826i/fDLXv8IiEZRIT0lDuWcg==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/imurmurhash": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
+      "integrity": "sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.8.19"
+      }
+    },
+    "node_modules/indent-string": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-4.0.0.tgz",
+      "integrity": "sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/ini": {
+      "version": "1.3.8",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz",
+      "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/internal-slot": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.1.0.tgz",
+      "integrity": "sha512-4gd7VpWNQNB4UKKCFFVcp1AVv+FMOgs9NKzjHKusc8jTMhd5eL1NqQqOpE0KzMds804/yHlglp3uxgluOqAPLw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "hasown": "^2.0.2",
+        "side-channel": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/is-array-buffer": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.5.tgz",
+      "integrity": "sha512-DDfANUiiG2wC1qawP66qlTugJeL5HyzMpfr8lLK+jMQirGzNod0B12cFB/9q838Ru27sBwfw78/rdoU7RERz6A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
+        "get-intrinsic": "^1.2.6"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-arrayish": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
+      "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/is-async-function": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/is-async-function/-/is-async-function-2.1.1.tgz",
+      "integrity": "sha512-9dgM/cZBnNvjzaMYHVoxxfPj2QXt22Ev7SuuPrs+xav0ukGB0S6d4ydZdEiM48kLx5kDV+QBPrpVnFyefL8kkQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "async-function": "^1.0.0",
+        "call-bound": "^1.0.3",
+        "get-proto": "^1.0.1",
+        "has-tostringtag": "^1.0.2",
+        "safe-regex-test": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-bigint": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.1.0.tgz",
+      "integrity": "sha512-n4ZT37wG78iz03xPRKJrHTdZbe3IicyucEtdRsV5yglwc3GyUfbAfpSeD0FJ41NbUNSt5wbhqfp1fS+BgnvDFQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "has-bigints": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-binary-path": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
+      "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "binary-extensions": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/is-boolean-object": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.2.2.tgz",
+      "integrity": "sha512-wa56o2/ElJMYqjCjGkXri7it5FbebW5usLw/nPmCMs5DeZ7eziSYZhSmPRn0txqeW4LnAmQQU7FgqLpsEFKM4A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "has-tostringtag": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-callable": {
+      "version": "1.2.7",
+      "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.2.7.tgz",
+      "integrity": "sha512-1BC0BVFhS/p0qtw6enp8e+8OD0UrK0oFLztSjNzhcKA3WDuJxxAPXzPuPtKkjEY9UUoEWlX/8fgKeu2S8i9JTA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-core-module": {
+      "version": "2.16.1",
+      "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.16.1.tgz",
+      "integrity": "sha512-UfoeMA6fIJ8wTYFEUjelnaGI67v6+N7qXJEvQuIGa99l4xsCruSYOVSQ0uPANn4dAzm8lkYPaKLrrijLq7x23w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-data-view": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/is-data-view/-/is-data-view-1.0.2.tgz",
+      "integrity": "sha512-RKtWF8pGmS87i2D6gqQu/l7EYRlVdfzemCJN/P3UOs//x1QE7mfhvzHIApBTRf7axvT6DMGwSwBXYCT0nfB9xw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "get-intrinsic": "^1.2.6",
+        "is-typed-array": "^1.1.13"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-date-object": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.1.0.tgz",
+      "integrity": "sha512-PwwhEakHVKTdRNVOw+/Gyh0+MzlCl4R6qKvkhuvLtPMggI1WAHt9sOwZxQLSGpUaDnrdyDsomoRgNnCfKNSXXg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "has-tostringtag": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-extglob": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+      "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
+      "devOptional": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/is-finalizationregistry": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-finalizationregistry/-/is-finalizationregistry-1.1.1.tgz",
+      "integrity": "sha512-1pC6N8qWJbWoPtEjgcL2xyhQOP491EQjeUo3qTKcmV8YSDDJrOepfG8pcC7h/QgnQHYSv0mJ3Z/ZWxmatVrysg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-fullwidth-code-point": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/is-generator-function": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/is-generator-function/-/is-generator-function-1.1.2.tgz",
+      "integrity": "sha512-upqt1SkGkODW9tsGNG5mtXTXtECizwtS2kA161M+gJPc1xdb/Ax629af6YrTwcOeQHbewrPNlE5Dx7kzvXTizA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.4",
+        "generator-function": "^2.0.0",
+        "get-proto": "^1.0.1",
+        "has-tostringtag": "^1.0.2",
+        "safe-regex-test": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-glob": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
+      "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
+      "devOptional": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-extglob": "^2.1.1"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/is-map": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-map/-/is-map-2.0.3.tgz",
+      "integrity": "sha512-1Qed0/Hr2m+YqxnM09CjA2d/i6YZNfF6R2oRAOj36eUdS6qIV/huPJNSEpKbupewFs+ZsJlxsjjPbc0/afW6Lw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-negative-zero": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.3.tgz",
+      "integrity": "sha512-5KoIu2Ngpyek75jXodFvnafB6DJgr3u8uuK0LEZJjrU19DrMD3EVERaR8sjz8CCGgpZvxPl9SuE1GMVPFHx1mw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-node-process": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/is-node-process/-/is-node-process-1.2.0.tgz",
+      "integrity": "sha512-Vg4o6/fqPxIjtxgUH5QLJhwZ7gW5diGCVlXpuUfELC62CuxM1iHcRe51f2W1FDy04Ai4KJkagKjx3XaqyfRKXw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/is-number": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
+      "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.12.0"
+      }
+    },
+    "node_modules/is-number-object": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-number-object/-/is-number-object-1.1.1.tgz",
+      "integrity": "sha512-lZhclumE1G6VYD8VHe35wFaIif+CTy5SJIi5+3y4psDgWu4wPDoBhF8NxUOinEc7pHgiTsT6MaBb92rKhhD+Xw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "has-tostringtag": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-path-inside": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-4.0.0.tgz",
+      "integrity": "sha512-lJJV/5dYS+RcL8uQdBDW9c9uWFLLBNRyFhnAKXw5tVqLlKZ4RMGZKv+YQ/IA3OhD+RpbJa1LLFM1FQPGyIXvOA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/is-plain-object": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-5.0.0.tgz",
+      "integrity": "sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/is-potential-custom-element-name": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-potential-custom-element-name/-/is-potential-custom-element-name-1.0.1.tgz",
+      "integrity": "sha512-bCYeRA2rVibKZd+s2625gGnGF/t7DSqDs4dP7CrLA1m7jKWz6pps0LpYLJN8Q64HtmPKJ1hrN3nzPNKFEKOUiQ==",
+      "license": "MIT"
+    },
+    "node_modules/is-regex": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.2.1.tgz",
+      "integrity": "sha512-MjYsKHO5O7mCsmRGxWcLWheFqN9DJ/2TmngvjKXihe6efViPqc274+Fx/4fYj/r03+ESvBdTXK0V6tA3rgez1g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "gopd": "^1.2.0",
+        "has-tostringtag": "^1.0.2",
+        "hasown": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-set": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/is-set/-/is-set-2.0.3.tgz",
+      "integrity": "sha512-iPAjerrse27/ygGLxw+EBR9agv9Y6uLeYVJMu+QNCoouJ1/1ri0mGrcWpfCqFZuzzx3WjtwxG098X+n4OuRkPg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-shared-array-buffer": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.4.tgz",
+      "integrity": "sha512-ISWac8drv4ZGfwKl5slpHG9OwPNty4jOWPRIhBpxOoD+hqITiwuipOQ2bNthAzwA3B4fIjO4Nln74N0S9byq8A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-string": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-string/-/is-string-1.1.1.tgz",
+      "integrity": "sha512-BtEeSsoaQjlSPBemMQIrY1MY0uM6vnS1g5fmufYOtnxLGUZM2178PKbhsk7Ffv58IX+ZtcvoGwccYsh0PglkAA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "has-tostringtag": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-subdir": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/is-subdir/-/is-subdir-1.2.0.tgz",
+      "integrity": "sha512-2AT6j+gXe/1ueqbW6fLZJiIw3F8iXGJtt0yDrZaBhAZEG1raiTxKWU+IPqMCzQAXOUCKdA4UDMgacKH25XG2Cw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "better-path-resolve": "1.0.0"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/is-symbol": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.1.1.tgz",
+      "integrity": "sha512-9gGx6GTtCQM73BgmHQXfDmLtfjjTUDSyoxTCbp5WtoixAhfgsDirWIcVQ/IHpvI5Vgd5i/J5F7B9cN/WlVbC/w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "has-symbols": "^1.1.0",
+        "safe-regex-test": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-there": {
+      "version": "4.5.2",
+      "resolved": "https://registry.npmjs.org/is-there/-/is-there-4.5.2.tgz",
+      "integrity": "sha512-ixMkfz3rtS1vEsLf0TjgjqUn96Q0ukpUVDMnPYVocJyTzu2G/QgEtqYddcHZawHO+R31cKVPggJmBLrm1vJCOg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/is-typed-array": {
+      "version": "1.1.15",
+      "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.15.tgz",
+      "integrity": "sha512-p3EcsicXjit7SaskXHs1hA91QxgTw46Fv6EFKKGS5DRFLD8yKnohjF3hxoju94b/OcMZoQukzpPpBE9uLVKzgQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "which-typed-array": "^1.1.16"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-weakmap": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/is-weakmap/-/is-weakmap-2.0.2.tgz",
+      "integrity": "sha512-K5pXYOm9wqY1RgjpL3YTkF39tni1XajUIkawTLUo9EZEVUFga5gSQJF8nNS7ZwJQ02y+1YCNYcMh+HIf1ZqE+w==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-weakref": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/is-weakref/-/is-weakref-1.1.1.tgz",
+      "integrity": "sha512-6i9mGWSlqzNMEqpCp93KwRS1uUOodk2OJ6b+sq7ZPDSy2WuI5NFIxp/254TytR8ftefexkWn5xNiHUNpPOfSew==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-weakset": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/is-weakset/-/is-weakset-2.0.4.tgz",
+      "integrity": "sha512-mfcwb6IzQyOKTs84CQMrOwW4gQcaTOAWJ0zzJCl2WSPDrWk/OzDaImWFH3djXhb24g4eudZfLRozAvPGw4d9hQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "get-intrinsic": "^1.2.6"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/is-windows": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-1.0.2.tgz",
+      "integrity": "sha512-eXK1UInq2bPmjyX6e3VHIzMLobc4J94i4AWn+Hpq3OU5KkrRC96OAcR3PRJ/pGu6m8TRnBHP9dkXQVsT/COVIA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/isarray": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz",
+      "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/isexe": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
+      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/istanbul-lib-coverage": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-3.2.2.tgz",
+      "integrity": "sha512-O8dpsF+r0WV/8MNRKfnmrtCWhuKjxrq2w+jpzBL5UZKTi2LeVWnWOmWRxFlesJONmc+wLAGvKQZEOanko0LFTg==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/istanbul-lib-report": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-report/-/istanbul-lib-report-3.0.1.tgz",
+      "integrity": "sha512-GCfE1mtsHGOELCU8e/Z7YWzpmybrx/+dSTfLrvY8qRmaY6zXTKWn6WQIjaAFw069icm6GVMNkgu0NzI4iPZUNw==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "istanbul-lib-coverage": "^3.0.0",
+        "make-dir": "^4.0.0",
+        "supports-color": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/istanbul-reports": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/istanbul-reports/-/istanbul-reports-3.2.0.tgz",
+      "integrity": "sha512-HGYWWS/ehqTV3xN10i23tkPkpH46MLCIMFNCaaKNavAXTF1RkqxawEPtnjnGZ6XKSInBKkiOA5BKS+aZiY3AvA==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "html-escaper": "^2.0.0",
+        "istanbul-lib-report": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/iterator.prototype": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/iterator.prototype/-/iterator.prototype-1.1.5.tgz",
+      "integrity": "sha512-H0dkQoCa3b2VEeKQBOxFph+JAbcrQdE7KC0UkqwpLmv2EC4P41QXP+rqo9wYodACiG5/WM5s9oDApTU8utwj9g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "define-data-property": "^1.1.4",
+        "es-object-atoms": "^1.0.0",
+        "get-intrinsic": "^1.2.6",
+        "get-proto": "^1.0.0",
+        "has-symbols": "^1.1.0",
+        "set-function-name": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/jackspeak": {
+      "version": "3.4.3",
+      "resolved": "https://registry.npmjs.org/jackspeak/-/jackspeak-3.4.3.tgz",
+      "integrity": "sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "dependencies": {
+        "@isaacs/cliui": "^8.0.2"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      },
+      "optionalDependencies": {
+        "@pkgjs/parseargs": "^0.11.0"
+      }
+    },
+    "node_modules/jest-diff": {
+      "version": "30.3.0",
+      "resolved": "https://registry.npmjs.org/jest-diff/-/jest-diff-30.3.0.tgz",
+      "integrity": "sha512-n3q4PDQjS4LrKxfWB3Z5KNk1XjXtZTBwQp71OP0Jo03Z6V60x++K5L8k6ZrW8MY8pOFylZvHM0zsjS1RqlHJZQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/diff-sequences": "30.3.0",
+        "@jest/get-type": "30.1.0",
+        "chalk": "^4.1.2",
+        "pretty-format": "30.3.0"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/jest-diff/node_modules/ansi-styles": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/jest-diff/node_modules/pretty-format": {
+      "version": "30.3.0",
+      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.3.0.tgz",
+      "integrity": "sha512-oG4T3wCbfeuvljnyAzhBvpN45E8iOTXCU/TD3zXW80HA3dQ4ahdqMkWGiPWZvjpQwlbyHrPTWUAqUzGzv4l1JQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/schemas": "30.0.5",
+        "ansi-styles": "^5.2.0",
+        "react-is": "^18.3.1"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/jest-environment-jsdom": {
+      "version": "30.2.0",
+      "resolved": "https://registry.npmjs.org/jest-environment-jsdom/-/jest-environment-jsdom-30.2.0.tgz",
+      "integrity": "sha512-zbBTiqr2Vl78pKp/laGBREYzbZx9ZtqPjOK4++lL4BNDhxRnahg51HtoDrk9/VjIy9IthNEWdKVd7H5bqBhiWQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/environment": "30.2.0",
+        "@jest/environment-jsdom-abstract": "30.2.0",
+        "@types/jsdom": "^21.1.7",
+        "@types/node": "*",
+        "jsdom": "^26.1.0"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      },
+      "peerDependencies": {
+        "canvas": "^3.0.0"
+      },
+      "peerDependenciesMeta": {
+        "canvas": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/jest-environment-jsdom/node_modules/data-urls": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-5.0.0.tgz",
+      "integrity": "sha512-ZYP5VBHshaDAiVZxjbRVcFJpc+4xGgT0bK3vzy1HLN8jTO975HEbuYzZJcHoQEY5K1a0z8YayJkyVETa08eNTg==",
+      "license": "MIT",
+      "dependencies": {
+        "whatwg-mimetype": "^4.0.0",
+        "whatwg-url": "^14.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/jest-environment-jsdom/node_modules/html-encoding-sniffer": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-4.0.0.tgz",
+      "integrity": "sha512-Y22oTqIU4uuPgEemfz7NDJz6OeKf12Lsu+QC+s3BVpda64lTiMYCyGwg5ki4vFxkMwQdeZDl2adZoqUgdFuTgQ==",
+      "license": "MIT",
+      "dependencies": {
+        "whatwg-encoding": "^3.1.1"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/jest-environment-jsdom/node_modules/jsdom": {
+      "version": "26.1.0",
+      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-26.1.0.tgz",
+      "integrity": "sha512-Cvc9WUhxSMEo4McES3P7oK3QaXldCfNWp7pl2NNeiIFlCoLr3kfq9kb1fxftiwk1FLV7CvpvDfonxtzUDeSOPg==",
+      "license": "MIT",
+      "dependencies": {
+        "cssstyle": "^4.2.1",
+        "data-urls": "^5.0.0",
+        "decimal.js": "^10.5.0",
+        "html-encoding-sniffer": "^4.0.0",
+        "http-proxy-agent": "^7.0.2",
+        "https-proxy-agent": "^7.0.6",
+        "is-potential-custom-element-name": "^1.0.1",
+        "nwsapi": "^2.2.16",
+        "parse5": "^7.2.1",
+        "rrweb-cssom": "^0.8.0",
+        "saxes": "^6.0.0",
+        "symbol-tree": "^3.2.4",
+        "tough-cookie": "^5.1.1",
+        "w3c-xmlserializer": "^5.0.0",
+        "webidl-conversions": "^7.0.0",
+        "whatwg-encoding": "^3.1.1",
+        "whatwg-mimetype": "^4.0.0",
+        "whatwg-url": "^14.1.1",
+        "ws": "^8.18.0",
+        "xml-name-validator": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "canvas": "^3.0.0"
+      },
+      "peerDependenciesMeta": {
+        "canvas": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/jest-environment-jsdom/node_modules/tldts": {
+      "version": "6.1.86",
+      "resolved": "https://registry.npmjs.org/tldts/-/tldts-6.1.86.tgz",
+      "integrity": "sha512-WMi/OQ2axVTf/ykqCQgXiIct+mSQDFdH2fkwhPwgEwvJ1kSzZRiinb0zF2Xb8u4+OqPChmyI6MEu4EezNJz+FQ==",
+      "license": "MIT",
+      "dependencies": {
+        "tldts-core": "^6.1.86"
+      },
+      "bin": {
+        "tldts": "bin/cli.js"
+      }
+    },
+    "node_modules/jest-environment-jsdom/node_modules/tldts-core": {
+      "version": "6.1.86",
+      "resolved": "https://registry.npmjs.org/tldts-core/-/tldts-core-6.1.86.tgz",
+      "integrity": "sha512-Je6p7pkk+KMzMv2XXKmAE3McmolOQFdxkKw0R8EYNr7sELW46JqnNeTX8ybPiQgvg1ymCoF8LXs5fzFaZvJPTA==",
+      "license": "MIT"
+    },
+    "node_modules/jest-environment-jsdom/node_modules/tough-cookie": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-5.1.2.tgz",
+      "integrity": "sha512-FVDYdxtnj0G6Qm/DhNPSb8Ju59ULcup3tuJxkFb5K8Bv2pUXILbf0xZWU8PX8Ov19OXljbUyveOFwRMwkXzO+A==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "tldts": "^6.1.32"
+      },
+      "engines": {
+        "node": ">=16"
+      }
+    },
+    "node_modules/jest-environment-jsdom/node_modules/tr46": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/tr46/-/tr46-5.1.1.tgz",
+      "integrity": "sha512-hdF5ZgjTqgAntKkklYw0R03MG2x/bSzTtkxmIRw/sTNV8YXsCJ1tfLAX23lhxhHJlEf3CRCOCGGWw3vI3GaSPw==",
+      "license": "MIT",
+      "dependencies": {
+        "punycode": "^2.3.1"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/jest-environment-jsdom/node_modules/webidl-conversions": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz",
+      "integrity": "sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==",
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/jest-environment-jsdom/node_modules/whatwg-mimetype": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-4.0.0.tgz",
+      "integrity": "sha512-QaKxh0eNIi2mE9p2vEdzfagOKHCcj1pJ56EEHGQOVxp8r9/iszLUUV7v89x9O1p/T+NlTM5W7jW6+cz4Fq1YVg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/jest-environment-jsdom/node_modules/whatwg-url": {
+      "version": "14.2.0",
+      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-14.2.0.tgz",
+      "integrity": "sha512-De72GdQZzNTUBBChsXueQUnPKDkg/5A5zp7pFDuQAj5UFoENpiACU0wlCvzpAGnTkj++ihpKwKyYewn/XNUbKw==",
+      "license": "MIT",
+      "dependencies": {
+        "tr46": "^5.1.0",
+        "webidl-conversions": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/jest-matcher-utils": {
+      "version": "30.3.0",
+      "resolved": "https://registry.npmjs.org/jest-matcher-utils/-/jest-matcher-utils-30.3.0.tgz",
+      "integrity": "sha512-HEtc9uFQgaUHkC7nLSlQL3Tph4Pjxt/yiPvkIrrDCt9jhoLIgxaubo1G+CFOnmHYMxHwwdaSN7mkIFs6ZK8OhA==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/get-type": "30.1.0",
+        "chalk": "^4.1.2",
+        "jest-diff": "30.3.0",
+        "pretty-format": "30.3.0"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/jest-matcher-utils/node_modules/ansi-styles": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/jest-matcher-utils/node_modules/pretty-format": {
+      "version": "30.3.0",
+      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.3.0.tgz",
+      "integrity": "sha512-oG4T3wCbfeuvljnyAzhBvpN45E8iOTXCU/TD3zXW80HA3dQ4ahdqMkWGiPWZvjpQwlbyHrPTWUAqUzGzv4l1JQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/schemas": "30.0.5",
+        "ansi-styles": "^5.2.0",
+        "react-is": "^18.3.1"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/jest-message-util": {
+      "version": "30.3.0",
+      "resolved": "https://registry.npmjs.org/jest-message-util/-/jest-message-util-30.3.0.tgz",
+      "integrity": "sha512-Z/j4Bo+4ySJ+JPJN3b2Qbl9hDq3VrXmnjjGEWD/x0BCXeOXPTV1iZYYzl2X8c1MaCOL+ewMyNBcm88sboE6YWw==",
+      "license": "MIT",
+      "dependencies": {
+        "@babel/code-frame": "^7.27.1",
+        "@jest/types": "30.3.0",
+        "@types/stack-utils": "^2.0.3",
+        "chalk": "^4.1.2",
+        "graceful-fs": "^4.2.11",
+        "picomatch": "^4.0.3",
+        "pretty-format": "30.3.0",
+        "slash": "^3.0.0",
+        "stack-utils": "^2.0.6"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/jest-message-util/node_modules/@jest/types": {
+      "version": "30.3.0",
+      "resolved": "https://registry.npmjs.org/@jest/types/-/types-30.3.0.tgz",
+      "integrity": "sha512-JHm87k7bA33hpBngtU8h6UBub/fqqA9uXfw+21j5Hmk7ooPHlboRNxHq0JcMtC+n8VJGP1mcfnD3Mk+XKe1oSw==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/pattern": "30.0.1",
+        "@jest/schemas": "30.0.5",
+        "@types/istanbul-lib-coverage": "^2.0.6",
+        "@types/istanbul-reports": "^3.0.4",
+        "@types/node": "*",
+        "@types/yargs": "^17.0.33",
+        "chalk": "^4.1.2"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/jest-message-util/node_modules/ansi-styles": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/jest-message-util/node_modules/pretty-format": {
+      "version": "30.3.0",
+      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-30.3.0.tgz",
+      "integrity": "sha512-oG4T3wCbfeuvljnyAzhBvpN45E8iOTXCU/TD3zXW80HA3dQ4ahdqMkWGiPWZvjpQwlbyHrPTWUAqUzGzv4l1JQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/schemas": "30.0.5",
+        "ansi-styles": "^5.2.0",
+        "react-is": "^18.3.1"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/jest-mock": {
+      "version": "30.3.0",
+      "resolved": "https://registry.npmjs.org/jest-mock/-/jest-mock-30.3.0.tgz",
+      "integrity": "sha512-OTzICK8CpE+t4ndhKrwlIdbM6Pn8j00lvmSmq5ejiO+KxukbLjgOflKWMn3KE34EZdQm5RqTuKj+5RIEniYhog==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/types": "30.3.0",
+        "@types/node": "*",
+        "jest-util": "30.3.0"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/jest-mock/node_modules/@jest/types": {
+      "version": "30.3.0",
+      "resolved": "https://registry.npmjs.org/@jest/types/-/types-30.3.0.tgz",
+      "integrity": "sha512-JHm87k7bA33hpBngtU8h6UBub/fqqA9uXfw+21j5Hmk7ooPHlboRNxHq0JcMtC+n8VJGP1mcfnD3Mk+XKe1oSw==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/pattern": "30.0.1",
+        "@jest/schemas": "30.0.5",
+        "@types/istanbul-lib-coverage": "^2.0.6",
+        "@types/istanbul-reports": "^3.0.4",
+        "@types/node": "*",
+        "@types/yargs": "^17.0.33",
+        "chalk": "^4.1.2"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/jest-regex-util": {
+      "version": "30.0.1",
+      "resolved": "https://registry.npmjs.org/jest-regex-util/-/jest-regex-util-30.0.1.tgz",
+      "integrity": "sha512-jHEQgBXAgc+Gh4g0p3bCevgRCVRkB4VB70zhoAE48gxeSr1hfUOsM/C2WoJgVL7Eyg//hudYENbm3Ne+/dRVVA==",
+      "license": "MIT",
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/jest-util": {
+      "version": "30.3.0",
+      "resolved": "https://registry.npmjs.org/jest-util/-/jest-util-30.3.0.tgz",
+      "integrity": "sha512-/jZDa00a3Sz7rdyu55NLrQCIrbyIkbBxareejQI315f/i8HjYN+ZWsDLLpoQSiUIEIyZF/R8fDg3BmB8AtHttg==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/types": "30.3.0",
+        "@types/node": "*",
+        "chalk": "^4.1.2",
+        "ci-info": "^4.2.0",
+        "graceful-fs": "^4.2.11",
+        "picomatch": "^4.0.3"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/jest-util/node_modules/@jest/types": {
+      "version": "30.3.0",
+      "resolved": "https://registry.npmjs.org/@jest/types/-/types-30.3.0.tgz",
+      "integrity": "sha512-JHm87k7bA33hpBngtU8h6UBub/fqqA9uXfw+21j5Hmk7ooPHlboRNxHq0JcMtC+n8VJGP1mcfnD3Mk+XKe1oSw==",
+      "license": "MIT",
+      "dependencies": {
+        "@jest/pattern": "30.0.1",
+        "@jest/schemas": "30.0.5",
+        "@types/istanbul-lib-coverage": "^2.0.6",
+        "@types/istanbul-reports": "^3.0.4",
+        "@types/node": "*",
+        "@types/yargs": "^17.0.33",
+        "chalk": "^4.1.2"
+      },
+      "engines": {
+        "node": "^18.14.0 || ^20.0.0 || ^22.0.0 || >=24.0.0"
+      }
+    },
+    "node_modules/js-tokens": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
+      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
+      "license": "MIT"
+    },
+    "node_modules/js-yaml": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.1.tgz",
+      "integrity": "sha512-qQKT4zQxXl8lLwBtHMWwaTcGfFOZviOJet3Oy/xmGk2gZH677CJM9EvtfdSkgWcATZhj/55JZ0rmy3myCT5lsA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "argparse": "^2.0.1"
+      },
+      "bin": {
+        "js-yaml": "bin/js-yaml.js"
+      }
+    },
+    "node_modules/jsdom": {
+      "version": "29.0.0",
+      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-29.0.0.tgz",
+      "integrity": "sha512-9FshNB6OepopZ08unmmGpsF7/qCjxGPbo3NbgfJAnPeHXnsODE9WWffXZtRFRFe0ntzaAOcSKNJFz8wiyvF1jQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@asamuzakjp/css-color": "^5.0.1",
+        "@asamuzakjp/dom-selector": "^7.0.2",
+        "@bramus/specificity": "^2.4.2",
+        "@csstools/css-syntax-patches-for-csstree": "^1.1.1",
+        "@exodus/bytes": "^1.15.0",
+        "css-tree": "^3.2.1",
+        "data-urls": "^7.0.0",
+        "decimal.js": "^10.6.0",
+        "html-encoding-sniffer": "^6.0.0",
+        "is-potential-custom-element-name": "^1.0.1",
+        "lru-cache": "^11.2.7",
+        "parse5": "^8.0.0",
+        "saxes": "^6.0.0",
+        "symbol-tree": "^3.2.4",
+        "tough-cookie": "^6.0.1",
+        "undici": "^7.24.3",
+        "w3c-xmlserializer": "^5.0.0",
+        "webidl-conversions": "^8.0.1",
+        "whatwg-mimetype": "^5.0.0",
+        "whatwg-url": "^16.0.1",
+        "xml-name-validator": "^5.0.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24.0.0"
+      },
+      "peerDependencies": {
+        "canvas": "^3.0.0"
+      },
+      "peerDependenciesMeta": {
+        "canvas": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/jsdom/node_modules/lru-cache": {
+      "version": "11.3.3",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-11.3.3.tgz",
+      "integrity": "sha512-JvNw9Y81y33E+BEYPr0U7omo+U9AySnsMsEiXgwT6yqd31VQWTLNQqmT4ou5eqPFUrTfIDFta2wKhB1hyohtAQ==",
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": "20 || >=22"
+      }
+    },
+    "node_modules/jsdom/node_modules/parse5": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/parse5/-/parse5-8.0.0.tgz",
+      "integrity": "sha512-9m4m5GSgXjL4AjumKzq1Fgfp3Z8rsvjRNbnkVwfu2ImRqE5D0LnY2QfDen18FSY9C573YU5XxSapdHZTZ2WolA==",
+      "license": "MIT",
+      "dependencies": {
+        "entities": "^6.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/inikulin/parse5?sponsor=1"
+      }
+    },
+    "node_modules/jsesc": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.1.0.tgz",
+      "integrity": "sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "jsesc": "bin/jsesc"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/json-buffer": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.1.tgz",
+      "integrity": "sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/json-parse-even-better-errors": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz",
+      "integrity": "sha512-xyFwyhro/JEof6Ghe2iz2NcXoj2sloNsWr/XsERDK/oiPCfaNhl5ONfp+jQdAZRQQ0IJWNzH9zIZF7li91kh2w==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/json-schema-traverse": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
+      "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/json-stable-stringify-without-jsonify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz",
+      "integrity": "sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/json5": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz",
+      "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "json5": "lib/cli.js"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/jsonfile": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-4.0.0.tgz",
+      "integrity": "sha512-m6F1R3z8jjlf2imQHS2Qez5sjKWQzbuuhuJ/FKYFRZvPE3PuHcSMVZzfsLhGVOkfd20obL5SWEBew5ShlquNxg==",
+      "dev": true,
+      "license": "MIT",
+      "optionalDependencies": {
+        "graceful-fs": "^4.1.6"
+      }
+    },
+    "node_modules/jsx-ast-utils": {
+      "version": "3.3.5",
+      "resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-3.3.5.tgz",
+      "integrity": "sha512-ZZow9HBI5O6EPgSJLUb8n2NKgmVWTwCvHGwFuJlMjvLFqlGG6pjirPhtdsseaLZjSibD8eegzmYpUZwoIlj2cQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "array-includes": "^3.1.6",
+        "array.prototype.flat": "^1.3.1",
+        "object.assign": "^4.1.4",
+        "object.values": "^1.1.6"
+      },
+      "engines": {
+        "node": ">=4.0"
+      }
+    },
+    "node_modules/keyv": {
+      "version": "4.5.4",
+      "resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.4.tgz",
+      "integrity": "sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "json-buffer": "3.0.1"
+      }
+    },
+    "node_modules/kind-of": {
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.3.tgz",
+      "integrity": "sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/known-css-properties": {
+      "version": "0.37.0",
+      "resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.37.0.tgz",
+      "integrity": "sha512-JCDrsP4Z1Sb9JwG0aJ8Eo2r7k4Ou5MwmThS/6lcIe1ICyb7UBJKGRIUUdqc2ASdE/42lgz6zFUnzAIhtXnBVrQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/levn": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/levn/-/levn-0.4.1.tgz",
+      "integrity": "sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "prelude-ls": "^1.2.1",
+        "type-check": "~0.4.0"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/lightningcss": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.32.0.tgz",
+      "integrity": "sha512-NXYBzinNrblfraPGyrbPoD19C1h9lfI/1mzgWYvXUTe414Gz/X1FD2XBZSZM7rRTrMA8JL3OtAaGifrIKhQ5yQ==",
+      "dev": true,
+      "license": "MPL-2.0",
+      "dependencies": {
+        "detect-libc": "^2.0.3"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      },
+      "optionalDependencies": {
+        "lightningcss-android-arm64": "1.32.0",
+        "lightningcss-darwin-arm64": "1.32.0",
+        "lightningcss-darwin-x64": "1.32.0",
+        "lightningcss-freebsd-x64": "1.32.0",
+        "lightningcss-linux-arm-gnueabihf": "1.32.0",
+        "lightningcss-linux-arm64-gnu": "1.32.0",
+        "lightningcss-linux-arm64-musl": "1.32.0",
+        "lightningcss-linux-x64-gnu": "1.32.0",
+        "lightningcss-linux-x64-musl": "1.32.0",
+        "lightningcss-win32-arm64-msvc": "1.32.0",
+        "lightningcss-win32-x64-msvc": "1.32.0"
+      }
+    },
+    "node_modules/lightningcss-android-arm64": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-android-arm64/-/lightningcss-android-arm64-1.32.0.tgz",
+      "integrity": "sha512-YK7/ClTt4kAK0vo6w3X+Pnm0D2cf2vPHbhOXdoNti1Ga0al1P4TBZhwjATvjNwLEBCnKvjJc2jQgHXH0NEwlAg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-darwin-arm64": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-darwin-arm64/-/lightningcss-darwin-arm64-1.32.0.tgz",
+      "integrity": "sha512-RzeG9Ju5bag2Bv1/lwlVJvBE3q6TtXskdZLLCyfg5pt+HLz9BqlICO7LZM7VHNTTn/5PRhHFBSjk5lc4cmscPQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-darwin-x64": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-darwin-x64/-/lightningcss-darwin-x64-1.32.0.tgz",
+      "integrity": "sha512-U+QsBp2m/s2wqpUYT/6wnlagdZbtZdndSmut/NJqlCcMLTWp5muCrID+K5UJ6jqD2BFshejCYXniPDbNh73V8w==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-freebsd-x64": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-freebsd-x64/-/lightningcss-freebsd-x64-1.32.0.tgz",
+      "integrity": "sha512-JCTigedEksZk3tHTTthnMdVfGf61Fky8Ji2E4YjUTEQX14xiy/lTzXnu1vwiZe3bYe0q+SpsSH/CTeDXK6WHig==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm-gnueabihf": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm-gnueabihf/-/lightningcss-linux-arm-gnueabihf-1.32.0.tgz",
+      "integrity": "sha512-x6rnnpRa2GL0zQOkt6rts3YDPzduLpWvwAF6EMhXFVZXD4tPrBkEFqzGowzCsIWsPjqSK+tyNEODUBXeeVHSkw==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm64-gnu": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-gnu/-/lightningcss-linux-arm64-gnu-1.32.0.tgz",
+      "integrity": "sha512-0nnMyoyOLRJXfbMOilaSRcLH3Jw5z9HDNGfT/gwCPgaDjnx0i8w7vBzFLFR1f6CMLKF8gVbebmkUN3fa/kQJpQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm64-musl": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-musl/-/lightningcss-linux-arm64-musl-1.32.0.tgz",
+      "integrity": "sha512-UpQkoenr4UJEzgVIYpI80lDFvRmPVg6oqboNHfoH4CQIfNA+HOrZ7Mo7KZP02dC6LjghPQJeBsvXhJod/wnIBg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-x64-gnu": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.32.0.tgz",
+      "integrity": "sha512-V7Qr52IhZmdKPVr+Vtw8o+WLsQJYCTd8loIfpDaMRWGUZfBOYEJeyJIkqGIDMZPwPx24pUMfwSxxI8phr/MbOA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-x64-musl": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-musl/-/lightningcss-linux-x64-musl-1.32.0.tgz",
+      "integrity": "sha512-bYcLp+Vb0awsiXg/80uCRezCYHNg1/l3mt0gzHnWV9XP1W5sKa5/TCdGWaR/zBM2PeF/HbsQv/j2URNOiVuxWg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-win32-arm64-msvc": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-win32-arm64-msvc/-/lightningcss-win32-arm64-msvc-1.32.0.tgz",
+      "integrity": "sha512-8SbC8BR40pS6baCM8sbtYDSwEVQd4JlFTOlaD3gWGHfThTcABnNDBda6eTZeqbofalIJhFx0qKzgHJmcPTnGdw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-win32-x64-msvc": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.32.0.tgz",
+      "integrity": "sha512-Amq9B/SoZYdDi1kFrojnoqPLxYhQ4Wo5XiL8EVJrVsB8ARoC1PWW6VGtT0WKCemjy8aC+louJnjS7U18x3b06Q==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lines-and-columns": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
+      "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/locate-path": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
+      "integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "p-locate": "^4.1.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/lodash": {
+      "version": "4.18.1",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.18.1.tgz",
+      "integrity": "sha512-dMInicTPVE8d1e5otfwmmjlxkZoUpiVLwyeTdUsi/Caj/gfzzblBcCE5sRHV/AsjuCmxWrte2TNGSYuCeCq+0Q==",
+      "license": "MIT"
+    },
+    "node_modules/lodash-es": {
+      "version": "4.18.1",
+      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.18.1.tgz",
+      "integrity": "sha512-J8xewKD/Gk22OZbhpOVSwcs60zhd95ESDwezOFuA3/099925PdHJ7OFHNTGtajL3AlZkykD32HykiMo+BIBI8A==",
+      "license": "MIT"
+    },
+    "node_modules/lodash.debounce": {
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
+      "integrity": "sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==",
+      "license": "MIT"
+    },
+    "node_modules/lodash.merge": {
+      "version": "4.6.2",
+      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
+      "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/lodash.startcase": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/lodash.startcase/-/lodash.startcase-4.4.0.tgz",
+      "integrity": "sha512-+WKqsK294HMSc2jEbNgpHpd0JfIBhp7rEV4aqXWqFr6AlXov+SlcgB1Fv01y2kGe3Gc8nMW7VA0SrGuSkRfIEg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/lodash.truncate": {
+      "version": "4.4.2",
+      "resolved": "https://registry.npmjs.org/lodash.truncate/-/lodash.truncate-4.4.2.tgz",
+      "integrity": "sha512-jttmRe7bRse52OsWIMDLaXxWqRAmtIUccAQ3garviCqJjafXOfNMO0yMfNpdD6zbGaTU0P5Nz7e7gAT6cKmJRw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/loose-envify": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
+      "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
+      "license": "MIT",
+      "dependencies": {
+        "js-tokens": "^3.0.0 || ^4.0.0"
+      },
+      "bin": {
+        "loose-envify": "cli.js"
+      }
+    },
+    "node_modules/lru-cache": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
+      "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "yallist": "^3.0.2"
+      }
+    },
+    "node_modules/lz-string": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/lz-string/-/lz-string-1.5.0.tgz",
+      "integrity": "sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "bin": {
+        "lz-string": "bin/bin.js"
+      }
+    },
+    "node_modules/magic-string": {
+      "version": "0.30.21",
+      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.21.tgz",
+      "integrity": "sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/sourcemap-codec": "^1.5.5"
+      }
+    },
+    "node_modules/magicast": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/magicast/-/magicast-0.5.2.tgz",
+      "integrity": "sha512-E3ZJh4J3S9KfwdjZhe2afj6R9lGIN5Pher1pF39UGrXRqq/VDaGVIGN13BjHd2u8B61hArAGOnso7nBOouW3TQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/parser": "^7.29.0",
+        "@babel/types": "^7.29.0",
+        "source-map-js": "^1.2.1"
+      }
+    },
+    "node_modules/make-dir": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-4.0.0.tgz",
+      "integrity": "sha512-hXdUTZYIVOt1Ex//jAQi+wTZZpUpwBj/0QsOzqegb3rGMMeJiSEu5xLHnYfBrRV4RH2+OCSOO95Is/7x1WJ4bw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "semver": "^7.5.3"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/marked": {
+      "version": "14.0.0",
+      "resolved": "https://registry.npmjs.org/marked/-/marked-14.0.0.tgz",
+      "integrity": "sha512-uIj4+faQ+MgHgwUW1l2PsPglZLOLOT1uErt06dAPtx2kjteLAkbsd/0FiYg/MGS+i7ZKLb7w2WClxHkzOOuryQ==",
+      "license": "MIT",
+      "bin": {
+        "marked": "bin/marked.js"
+      },
+      "engines": {
+        "node": ">= 18"
+      }
+    },
+    "node_modules/math-intrinsics": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
+      "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/mathml-tag-names": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/mathml-tag-names/-/mathml-tag-names-4.0.0.tgz",
+      "integrity": "sha512-aa6AU2Pcx0VP/XWnh8IGL0SYSgQHDT6Ucror2j2mXeFAlN3ahaNs8EZtG1YiticMkSLj3Gt6VPFfZogt7G5iFQ==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
+    "node_modules/mdn-data": {
+      "version": "2.27.1",
+      "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.27.1.tgz",
+      "integrity": "sha512-9Yubnt3e8A0OKwxYSXyhLymGW4sCufcLG6VdiDdUGVkPhpqLxlvP5vl1983gQjJl3tqbrM731mjaZaP68AgosQ==",
+      "license": "CC0-1.0"
+    },
+    "node_modules/meow": {
+      "version": "14.1.0",
+      "resolved": "https://registry.npmjs.org/meow/-/meow-14.1.0.tgz",
+      "integrity": "sha512-EDYo6VlmtnumlcBCbh1gLJ//9jvM/ndXHfVXIFrZVr6fGcwTUyCTFNTLCKuY3ffbK8L/+3Mzqnd58RojiZqHVw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/merge2": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
+      "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/micromatch": {
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
+      "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
+      "license": "MIT",
+      "dependencies": {
+        "braces": "^3.0.3",
+        "picomatch": "^2.3.1"
+      },
+      "engines": {
+        "node": ">=8.6"
+      }
+    },
+    "node_modules/micromatch/node_modules/picomatch": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.2.tgz",
+      "integrity": "sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/mime-db": {
+      "version": "1.52.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
+      "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/mime-types": {
+      "version": "2.1.35",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz",
+      "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==",
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": "1.52.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/min-indent": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/min-indent/-/min-indent-1.0.1.tgz",
+      "integrity": "sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/minimatch": {
+      "version": "3.1.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.5.tgz",
+      "integrity": "sha512-VgjWUsnnT6n+NUk6eZq77zeFdpW2LWDzP6zFGrCbHXiYNul5Dzqk2HHQ5uFH2DNW5Xbp8+jVzaeNt94ssEEl4w==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^1.1.7"
+      },
+      "engines": {
+        "node": "*"
+      }
+    },
+    "node_modules/minipass": {
+      "version": "7.1.3",
+      "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.3.tgz",
+      "integrity": "sha512-tEBHqDnIoM/1rXME1zgka9g6Q2lcoCkxHLuc7ODJ5BxbP5d4c2Z5cGgtXAku59200Cx7diuHTOYfSBD8n6mm8A==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      }
+    },
+    "node_modules/mkdirp": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-3.0.1.tgz",
+      "integrity": "sha512-+NsyUUAZDmo6YVHzL/stxSu3t9YS1iljliy3BSDrXJ/dkn1KYdmtZODGGjLcc9XLgVVpH4KshHB8XmZgMhaBXg==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "mkdirp": "dist/cjs/src/bin.js"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/moment": {
+      "version": "2.30.1",
+      "resolved": "https://registry.npmjs.org/moment/-/moment-2.30.1.tgz",
+      "integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==",
+      "license": "MIT",
+      "engines": {
+        "node": "*"
+      }
+    },
+    "node_modules/monaco-editor": {
+      "version": "0.55.1",
+      "resolved": "https://registry.npmjs.org/monaco-editor/-/monaco-editor-0.55.1.tgz",
+      "integrity": "sha512-jz4x+TJNFHwHtwuV9vA9rMujcZRb0CEilTEwG2rRSpe/A7Jdkuj8xPKttCgOh+v/lkHy7HsZ64oj+q3xoAFl9A==",
+      "license": "MIT",
+      "dependencies": {
+        "dompurify": "3.2.7",
+        "marked": "14.0.0"
+      }
+    },
+    "node_modules/mri": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/mri/-/mri-1.2.0.tgz",
+      "integrity": "sha512-tzzskb3bG8LvYGFF/mDTpq3jpI6Q9wc3LEmBaghu+DdCssd1FakN7Bc0hVNmEyGq1bq3RgfkCb3cmQLpNPOroA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/ms": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
+      "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
+      "license": "MIT"
+    },
+    "node_modules/msw": {
+      "version": "2.4.11",
+      "resolved": "https://registry.npmjs.org/msw/-/msw-2.4.11.tgz",
+      "integrity": "sha512-TVEw9NOPTc6ufOQLJ53234S9NBRxQbu7xFMxs+OCP43JQcNEIOKiZHxEm2nDzYIrwccoIhUxUf8wr99SukD76A==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "dependencies": {
+        "@bundled-es-modules/cookie": "^2.0.0",
+        "@bundled-es-modules/statuses": "^1.0.1",
+        "@bundled-es-modules/tough-cookie": "^0.1.6",
+        "@inquirer/confirm": "^3.0.0",
+        "@mswjs/interceptors": "^0.35.8",
+        "@open-draft/until": "^2.1.0",
+        "@types/cookie": "^0.6.0",
+        "@types/statuses": "^2.0.4",
+        "chalk": "^4.1.2",
+        "graphql": "^16.8.1",
+        "headers-polyfill": "^4.0.2",
+        "is-node-process": "^1.2.0",
+        "outvariant": "^1.4.3",
+        "path-to-regexp": "^6.3.0",
+        "strict-event-emitter": "^0.5.1",
+        "type-fest": "^4.26.1",
+        "yargs": "^17.7.2"
+      },
+      "bin": {
+        "msw": "cli/index.js"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/mswjs"
+      },
+      "peerDependencies": {
+        "typescript": ">= 4.8.x"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/msw/node_modules/path-to-regexp": {
+      "version": "6.3.0",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-6.3.0.tgz",
+      "integrity": "sha512-Yhpw4T9C6hPpgPeA28us07OJeqZ5EzQTkbfwuhsUg0c237RomFoETJgmp2sa3F/41gfLE6G5cqcYwznmeEeOlQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/mute-stream": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-1.0.0.tgz",
+      "integrity": "sha512-avsJQhyd+680gKXyG/sQc0nXaC6rBkPOfyHYcFb9+hdkqQkR9bdnkJ0AMZhke0oesPqIO+mFFJ+IdBc7mst4IA==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "^14.17.0 || ^16.13.0 || >=18.0.0"
+      }
+    },
+    "node_modules/nanoid": {
+      "version": "3.3.11",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz",
+      "integrity": "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "bin": {
+        "nanoid": "bin/nanoid.cjs"
+      },
+      "engines": {
+        "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
+      }
+    },
+    "node_modules/natural-compare": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz",
+      "integrity": "sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/node-addon-api": {
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-7.1.1.tgz",
+      "integrity": "sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ==",
+      "license": "MIT",
+      "optional": true
+    },
+    "node_modules/node-exports-info": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/node-exports-info/-/node-exports-info-1.6.0.tgz",
+      "integrity": "sha512-pyFS63ptit/P5WqUkt+UUfe+4oevH+bFeIiPPdfb0pFeYEu/1ELnJu5l+5EcTKYL5M7zaAa7S8ddywgXypqKCw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "array.prototype.flatmap": "^1.3.3",
+        "es-errors": "^1.3.0",
+        "object.entries": "^1.1.9",
+        "semver": "^6.3.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/node-exports-info/node_modules/semver": {
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      }
+    },
+    "node_modules/node-releases": {
+      "version": "2.0.37",
+      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.37.tgz",
+      "integrity": "sha512-1h5gKZCF+pO/o3Iqt5Jp7wc9rH3eJJ0+nh/CIoiRwjRxde/hAHyLPXYN4V3CqKAbiZPSeJFSWHmJsbkicta0Eg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/normalize-path": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
+      "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/nwsapi": {
+      "version": "2.2.23",
+      "resolved": "https://registry.npmjs.org/nwsapi/-/nwsapi-2.2.23.tgz",
+      "integrity": "sha512-7wfH4sLbt4M0gCDzGE6vzQBo0bfTKjU7Sfpqy/7gs1qBfYz2vEJH6vXcBKpO3+6Yu1telwd0t9HpyOoLEQQbIQ==",
+      "license": "MIT"
+    },
+    "node_modules/object-assign": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+      "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/object-inspect": {
+      "version": "1.13.4",
+      "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.4.tgz",
+      "integrity": "sha512-W67iLl4J2EXEGTbfeHCffrjDfitvLANg0UlX3wFUUSTx92KXRFegMHUVgSqE+wvhAbi4WqjGg9czysTV2Epbew==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/object-keys": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.1.1.tgz",
+      "integrity": "sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/object.assign": {
+      "version": "4.1.7",
+      "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.7.tgz",
+      "integrity": "sha512-nK28WOo+QIjBkDduTINE4JkF/UJJKyf2EJxvJKfblDpyg0Q+pkOHNTL0Qwy6NP6FhE/EnzV73BxxqcJaXY9anw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.0.0",
+        "has-symbols": "^1.1.0",
+        "object-keys": "^1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/object.entries": {
+      "version": "1.1.9",
+      "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.1.9.tgz",
+      "integrity": "sha512-8u/hfXFRBD1O0hPUjioLhoWFHRmt6tKA4/vZPyckBr18l1KE9uHrFaFaUi8MDRTpi4uak2goyPTSNJLXX2k2Hw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/object.fromentries": {
+      "version": "2.0.8",
+      "resolved": "https://registry.npmjs.org/object.fromentries/-/object.fromentries-2.0.8.tgz",
+      "integrity": "sha512-k6E21FzySsSK5a21KRADBd/NGneRegFO5pLHfdQLpRDETUNJueLXs3WCzyQ3tFRDYgbq3KHGXfTbi2bs8WQ6rQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.2",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/object.values": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.2.1.tgz",
+      "integrity": "sha512-gXah6aZrcUxjWg2zR2MwouP2eHlCBzdV4pygudehaKXSGW4v2AsRQUK+lwwXhii6KFZcunEnmSUoYp5CXibxtA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/obug": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/obug/-/obug-2.1.1.tgz",
+      "integrity": "sha512-uTqF9MuPraAQ+IsnPf366RG4cP9RtUi7MLO1N3KEc+wb0a6yKpeL0lmk2IB1jY5KHPAlTc6T/JRdC/YqxHNwkQ==",
+      "dev": true,
+      "funding": [
+        "https://github.com/sponsors/sxzz",
+        "https://opencollective.com/debug"
+      ],
+      "license": "MIT"
+    },
+    "node_modules/optionator": {
+      "version": "0.9.4",
+      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.4.tgz",
+      "integrity": "sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "deep-is": "^0.1.3",
+        "fast-levenshtein": "^2.0.6",
+        "levn": "^0.4.1",
+        "prelude-ls": "^1.2.1",
+        "type-check": "^0.4.0",
+        "word-wrap": "^1.2.5"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/outdent": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmjs.org/outdent/-/outdent-0.5.0.tgz",
+      "integrity": "sha512-/jHxFIzoMXdqPzTaCpFzAAWhpkSjZPF4Vsn6jAfNpmbH/ymsmd7Qc6VE9BGn0L6YMj6uwpQLxCECpus4ukKS9Q==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/outvariant": {
+      "version": "1.4.3",
+      "resolved": "https://registry.npmjs.org/outvariant/-/outvariant-1.4.3.tgz",
+      "integrity": "sha512-+Sl2UErvtsoajRDKCE5/dBz4DIvHXQQnAxtQTF04OJxY0+DyZXSo5P5Bb7XYWOh81syohlYL24hbDwxedPUJCA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/own-keys": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/own-keys/-/own-keys-1.0.1.tgz",
+      "integrity": "sha512-qFOyK5PjiWZd+QQIh+1jhdb9LpxTF0qs7Pm8o5QHYZ0M3vKqSqzsZaEB6oWlxZ+q2sJBMI/Ktgd2N5ZwQoRHfg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "get-intrinsic": "^1.2.6",
+        "object-keys": "^1.1.1",
+        "safe-push-apply": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/p-filter": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/p-filter/-/p-filter-2.1.0.tgz",
+      "integrity": "sha512-ZBxxZ5sL2HghephhpGAQdoskxplTwr7ICaehZwLIlfL6acuVgZPm8yBNuRAFBGEqtD/hmUeq9eqLg2ys9Xr/yw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "p-map": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/p-limit": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz",
+      "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "p-try": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/p-locate": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-4.1.0.tgz",
+      "integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "p-limit": "^2.2.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/p-map": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/p-map/-/p-map-2.1.0.tgz",
+      "integrity": "sha512-y3b8Kpd8OAN444hxfBbFfj1FY/RjtTd8tzYwhUqNYXx0fXx2iX4maP4Qr6qhIKbQXI02wTLAda4fYUbDagTUFw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/p-try": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
+      "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/package-json-from-dist": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/package-json-from-dist/-/package-json-from-dist-1.0.1.tgz",
+      "integrity": "sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==",
+      "dev": true,
+      "license": "BlueOak-1.0.0"
+    },
+    "node_modules/package-manager-detector": {
+      "version": "0.2.11",
+      "resolved": "https://registry.npmjs.org/package-manager-detector/-/package-manager-detector-0.2.11.tgz",
+      "integrity": "sha512-BEnLolu+yuz22S56CU1SUKq3XC3PkwD5wv4ikR4MfGvnRVcmzXR9DwSlW2fEamyTPyXHomBJRzgapeuBvRNzJQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "quansync": "^0.2.7"
+      }
+    },
+    "node_modules/parent-module": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
+      "integrity": "sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "callsites": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/parse-json": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/parse-json/-/parse-json-5.2.0.tgz",
+      "integrity": "sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/code-frame": "^7.0.0",
+        "error-ex": "^1.3.1",
+        "json-parse-even-better-errors": "^2.3.0",
+        "lines-and-columns": "^1.1.6"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/parse5": {
+      "version": "7.3.0",
+      "resolved": "https://registry.npmjs.org/parse5/-/parse5-7.3.0.tgz",
+      "integrity": "sha512-IInvU7fabl34qmi9gY8XOVxhYyMyuH2xUNpb2q8/Y+7552KlejkRvqvD19nMoUW/uQGGbqNpA6Tufu5FL5BZgw==",
+      "license": "MIT",
+      "dependencies": {
+        "entities": "^6.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/inikulin/parse5?sponsor=1"
+      }
+    },
+    "node_modules/path-exists": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
+      "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/path-key": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
+      "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/path-parse": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/path-parse/-/path-parse-1.0.7.tgz",
+      "integrity": "sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/path-scurry": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.11.1.tgz",
+      "integrity": "sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "dependencies": {
+        "lru-cache": "^10.2.0",
+        "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/path-scurry/node_modules/lru-cache": {
+      "version": "10.4.3",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
+      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/path-to-regexp": {
+      "version": "8.3.0",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-8.3.0.tgz",
+      "integrity": "sha512-7jdwVIRtsP8MYpdXSwOS0YdD0Du+qOoF/AEPIt88PcCFrZCzx41oxku1jD88hZBwbNUIEfpqvuhjFaMAqMTWnA==",
+      "license": "MIT",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/path-type": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz",
+      "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/pathe": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/pathe/-/pathe-2.0.3.tgz",
+      "integrity": "sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/picocolors": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
+      "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==",
+      "license": "ISC"
+    },
+    "node_modules/picomatch": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz",
+      "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/pify": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/pify/-/pify-4.0.1.tgz",
+      "integrity": "sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/playwright": {
+      "version": "1.58.2",
+      "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.58.2.tgz",
+      "integrity": "sha512-vA30H8Nvkq/cPBnNw4Q8TWz1EJyqgpuinBcHET0YVJVFldr8JDNiU9LaWAE1KqSkRYazuaBhTpB5ZzShOezQ6A==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "playwright-core": "1.58.2"
+      },
+      "bin": {
+        "playwright": "cli.js"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "optionalDependencies": {
+        "fsevents": "2.3.2"
+      }
+    },
+    "node_modules/playwright-core": {
+      "version": "1.58.2",
+      "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.58.2.tgz",
+      "integrity": "sha512-yZkEtftgwS8CsfYo7nm0KE8jsvm6i/PTgVtB8DL726wNf6H2IMsDuxCpJj59KDaxCtSnrWan2AeDqM7JBaultg==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "bin": {
+        "playwright-core": "cli.js"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/possible-typed-array-names": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/possible-typed-array-names/-/possible-typed-array-names-1.1.0.tgz",
+      "integrity": "sha512-/+5VFTchJDoVj3bhoqi6UeymcD00DAwb1nJwamzPvHEszJ4FpF6SNNbUbOS8yI56qHzdV8eK0qEfOSiodkTdxg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/postcss": {
+      "version": "8.5.9",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.9.tgz",
+      "integrity": "sha512-7a70Nsot+EMX9fFU3064K/kdHWZqGVY+BADLyXc8Dfv+mTLLVl6JzJpPaCZ2kQL9gIJvKXSLMHhqdRRjwQeFtw==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/postcss"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "nanoid": "^3.3.11",
+        "picocolors": "^1.1.1",
+        "source-map-js": "^1.2.1"
+      },
+      "engines": {
+        "node": "^10 || ^12 || >=14"
+      }
+    },
+    "node_modules/postcss-media-query-parser": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/postcss-media-query-parser/-/postcss-media-query-parser-0.2.3.tgz",
+      "integrity": "sha512-3sOlxmbKcSHMjlUXQZKQ06jOswE7oVkXPxmZdoB1r5l0q6gTFTQSHxNxOrCccElbW7dxNytifNEo8qidX2Vsig==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/postcss-modules-extract-imports": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.1.0.tgz",
+      "integrity": "sha512-k3kNe0aNFQDAZGbin48pL2VNidTF0w4/eASDsxlyspobzU3wZQLOGj7L9gfRe0Jo9/4uud09DsjFNH7winGv8Q==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "^10 || ^12 || >= 14"
+      },
+      "peerDependencies": {
+        "postcss": "^8.1.0"
+      }
+    },
+    "node_modules/postcss-modules-local-by-default": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules-local-by-default/-/postcss-modules-local-by-default-4.2.0.tgz",
+      "integrity": "sha512-5kcJm/zk+GJDSfw+V/42fJ5fhjL5YbFDl8nVdXkJPLLW+Vf9mTD5Xe0wqIaDnLuL2U6cDNpTr+UQ+v2HWIBhzw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "icss-utils": "^5.0.0",
+        "postcss-selector-parser": "^7.0.0",
+        "postcss-value-parser": "^4.1.0"
+      },
+      "engines": {
+        "node": "^10 || ^12 || >= 14"
+      },
+      "peerDependencies": {
+        "postcss": "^8.1.0"
+      }
+    },
+    "node_modules/postcss-modules-scope": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/postcss-modules-scope/-/postcss-modules-scope-3.2.1.tgz",
+      "integrity": "sha512-m9jZstCVaqGjTAuny8MdgE88scJnCiQSlSrOWcTQgM2t32UBe+MUmFSO5t7VMSfAf/FJKImAxBav8ooCHJXCJA==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "postcss-selector-parser": "^7.0.0"
+      },
+      "engines": {
+        "node": "^10 || ^12 || >= 14"
+      },
+      "peerDependencies": {
+        "postcss": "^8.1.0"
+      }
+    },
+    "node_modules/postcss-modules-values": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-modules-values/-/postcss-modules-values-4.0.0.tgz",
+      "integrity": "sha512-RDxHkAiEGI78gS2ofyvCsu7iycRv7oqw5xMWn9iMoR0N/7mf9D50ecQqUo5BZ9Zh2vH4bCUR/ktCqbB9m8vJjQ==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "icss-utils": "^5.0.0"
+      },
+      "engines": {
+        "node": "^10 || ^12 || >= 14"
+      },
+      "peerDependencies": {
+        "postcss": "^8.1.0"
+      }
+    },
+    "node_modules/postcss-resolve-nested-selector": {
+      "version": "0.1.6",
+      "resolved": "https://registry.npmjs.org/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.6.tgz",
+      "integrity": "sha512-0sglIs9Wmkzbr8lQwEyIzlDOOC9bGmfVKcJTaxv3vMmd3uo4o4DerC3En0bnmgceeql9BfC8hRkp7cg0fjdVqw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/postcss-safe-parser": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/postcss-safe-parser/-/postcss-safe-parser-7.0.1.tgz",
+      "integrity": "sha512-0AioNCJZ2DPYz5ABT6bddIqlhgwhpHZ/l65YAYo0BCIn0xiDpsnTHz0gnoTGk0OXZW0JRs+cDwL8u/teRdz+8A==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/postcss-safe-parser"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=18.0"
+      },
+      "peerDependencies": {
+        "postcss": "^8.4.31"
+      }
+    },
+    "node_modules/postcss-scss": {
+      "version": "4.0.9",
+      "resolved": "https://registry.npmjs.org/postcss-scss/-/postcss-scss-4.0.9.tgz",
+      "integrity": "sha512-AjKOeiwAitL/MXxQW2DliT28EKukvvbEWx3LBmJIRN8KfBGZbRTxNYW0kSqi1COiTZ57nZ9NW06S6ux//N1c9A==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/postcss-scss"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=12.0"
+      },
+      "peerDependencies": {
+        "postcss": "^8.4.29"
+      }
+    },
+    "node_modules/postcss-selector-parser": {
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-7.1.1.tgz",
+      "integrity": "sha512-orRsuYpJVw8LdAwqqLykBj9ecS5/cRHlI5+nvTo8LcCKmzDmqVORXtOIYEEQuL9D4BxtA1lm5isAqzQZCoQ6Eg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cssesc": "^3.0.0",
+        "util-deprecate": "^1.0.2"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/postcss-sorting": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/postcss-sorting/-/postcss-sorting-10.0.0.tgz",
+      "integrity": "sha512-TXbU+h6vVRW+86c/+ewhWq9k7pr7ijASTnepVhCQiC87zAOTkvB1v2dHyWP+ggstSTX/PNvjzS+IOqzejndz9w==",
+      "dev": true,
+      "license": "MIT",
+      "peerDependencies": {
+        "postcss": "^8.4.20"
+      }
+    },
+    "node_modules/postcss-value-parser": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
+      "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/prelude-ls": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
+      "integrity": "sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/prettier": {
+      "version": "3.8.1",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.8.1.tgz",
+      "integrity": "sha512-UOnG6LftzbdaHZcKoPFtOcCKztrQ57WkHDeRD9t/PTQtmT0NHSeWWepj6pS0z/N7+08BHFDQVUrfmfMRcZwbMg==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "prettier": "bin/prettier.cjs"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/prettier/prettier?sponsor=1"
+      }
+    },
+    "node_modules/pretty-format": {
+      "version": "27.5.1",
+      "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-27.5.1.tgz",
+      "integrity": "sha512-Qb1gy5OrP5+zDf2Bvnzdl3jsTf1qXVMazbvCoKhtKqVs4/YK4ozX4gKQJJVyNe+cajNPn0KoC0MC3FUmaHWEmQ==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "ansi-regex": "^5.0.1",
+        "ansi-styles": "^5.0.0",
+        "react-is": "^17.0.1"
+      },
+      "engines": {
+        "node": "^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0"
+      }
+    },
+    "node_modules/pretty-format/node_modules/ansi-styles": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/pretty-format/node_modules/react-is": {
+      "version": "17.0.2",
+      "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
+      "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true
+    },
+    "node_modules/prop-types": {
+      "version": "15.8.1",
+      "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
+      "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
+      "license": "MIT",
+      "dependencies": {
+        "loose-envify": "^1.4.0",
+        "object-assign": "^4.1.1",
+        "react-is": "^16.13.1"
+      }
+    },
+    "node_modules/prop-types/node_modules/react-is": {
+      "version": "16.13.1",
+      "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
+      "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
+      "license": "MIT"
+    },
+    "node_modules/property-expr": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/property-expr/-/property-expr-2.0.6.tgz",
+      "integrity": "sha512-SVtmxhRE/CGkn3eZY1T6pC8Nln6Fr/lu1mKSgRud0eC73whjGfoAogbn78LkD8aFL0zz3bAFerKSnOl7NlErBA==",
+      "license": "MIT"
+    },
+    "node_modules/proxy-from-env": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
+      "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
+      "license": "MIT"
+    },
+    "node_modules/psl": {
+      "version": "1.15.0",
+      "resolved": "https://registry.npmjs.org/psl/-/psl-1.15.0.tgz",
+      "integrity": "sha512-JZd3gMVBAVQkSs6HdNZo9Sdo0LNcQeMNP3CozBJb3JYC/QUYZTnKxP+f8oWRX4rHP5EurWxqAHTSwUCjlNKa1w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "punycode": "^2.3.1"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/lupomontero"
+      }
+    },
+    "node_modules/punycode": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
+      "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/qified": {
+      "version": "0.9.1",
+      "resolved": "https://registry.npmjs.org/qified/-/qified-0.9.1.tgz",
+      "integrity": "sha512-n7mar4T0xQ+39dE2vGTAlbxUEpndwPANH0kDef1/MYsB8Bba9wshkybIRx74qgcvKQPEWErf9AqAdYjhzY2Ilg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "hookified": "^2.1.1"
+      },
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/qified/node_modules/hookified": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/hookified/-/hookified-2.1.1.tgz",
+      "integrity": "sha512-AHb76R16GB5EsPBE2J7Ko5kiEyXwviB9P5SMrAKcuAu4vJPZttViAbj9+tZeaQE5zjDme+1vcHP78Yj/WoAveA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/quansync": {
+      "version": "0.2.11",
+      "resolved": "https://registry.npmjs.org/quansync/-/quansync-0.2.11.tgz",
+      "integrity": "sha512-AifT7QEbW9Nri4tAwR5M/uzpBuqfZf+zwaEM/QkzEjj7NBuFD2rBuy0K3dE+8wltbezDV7JMA0WfnCPYRSYbXA==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://github.com/sponsors/antfu"
+        },
+        {
+          "type": "individual",
+          "url": "https://github.com/sponsors/sxzz"
+        }
+      ],
+      "license": "MIT"
+    },
+    "node_modules/querystringify": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz",
+      "integrity": "sha512-FIqgj2EUvTa7R50u0rGsyTftzjYmv/a3hO345bZNrqabNqjtgiDMgmo4mkUjd+nzU5oF3dClKqFIPUKybUyqoQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/queue-microtask": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz",
+      "integrity": "sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT"
+    },
+    "node_modules/react": {
+      "version": "19.2.4",
+      "resolved": "https://registry.npmjs.org/react/-/react-19.2.4.tgz",
+      "integrity": "sha512-9nfp2hYpCwOjAN+8TZFGhtWEwgvWHXqESH8qT89AT/lWklpLON22Lc8pEtnpsZz7VmawabSU0gCjnj8aC0euHQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/react-chartjs-2": {
+      "version": "5.3.1",
+      "resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-5.3.1.tgz",
+      "integrity": "sha512-h5IPXKg9EXpjoBzUfyWJvllMjG2mQ4EiuHQFhms/AjUm0XSZHhyRy2xVmLXHKrtcdrPO4mnGqRtYoD0vp95A0A==",
+      "license": "MIT",
+      "peerDependencies": {
+        "chart.js": "^4.1.1",
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+      }
+    },
+    "node_modules/react-dom": {
+      "version": "19.2.4",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.4.tgz",
+      "integrity": "sha512-AXJdLo8kgMbimY95O2aKQqsz2iWi9jMgKJhRBAxECE4IFxfcazB2LmzloIoibJI3C12IlY20+KFaLv+71bUJeQ==",
+      "license": "MIT",
+      "dependencies": {
+        "scheduler": "^0.27.0"
+      },
+      "peerDependencies": {
+        "react": "^19.2.4"
+      }
+    },
+    "node_modules/react-fast-compare": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-2.0.4.tgz",
+      "integrity": "sha512-suNP+J1VU1MWFKcyt7RtjiSWUjvidmQSlqu+eHslq+342xCbGTYmC0mEhPCOHxlW0CywylOC1u2DFAT+bv4dBw==",
+      "license": "MIT"
+    },
+    "node_modules/react-is": {
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
+      "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
+      "license": "MIT"
+    },
+    "node_modules/react-router": {
+      "version": "7.13.1",
+      "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.13.1.tgz",
+      "integrity": "sha512-td+xP4X2/6BJvZoX6xw++A2DdEi++YypA69bJUV5oVvqf6/9/9nNlD70YO1e9d3MyamJEBQFEzk6mbfDYbqrSA==",
+      "license": "MIT",
+      "dependencies": {
+        "cookie": "^1.0.1",
+        "set-cookie-parser": "^2.6.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "react": ">=18",
+        "react-dom": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "react-dom": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/react-router/node_modules/cookie": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-1.1.1.tgz",
+      "integrity": "sha512-ei8Aos7ja0weRpFzJnEA9UHJ/7XQmqglbRwnf2ATjcB9Wq874VKH9kfjjirM6UhU2/E5fFYadylyhFldcqSidQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/read-yaml-file": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/read-yaml-file/-/read-yaml-file-1.1.0.tgz",
+      "integrity": "sha512-VIMnQi/Z4HT2Fxuwg5KrY174U1VdUIASQVWXXyqtNRtxSr9IYkn1rsI6Tb6HsrHCmB7gVpNwX6JxPTHcH6IoTA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "graceful-fs": "^4.1.5",
+        "js-yaml": "^3.6.1",
+        "pify": "^4.0.1",
+        "strip-bom": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/read-yaml-file/node_modules/argparse": {
+      "version": "1.0.10",
+      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
+      "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "sprintf-js": "~1.0.2"
+      }
+    },
+    "node_modules/read-yaml-file/node_modules/js-yaml": {
+      "version": "3.14.2",
+      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.14.2.tgz",
+      "integrity": "sha512-PMSmkqxr106Xa156c2M265Z+FTrPl+oxd/rgOQy2tijQeK5TxQ43psO1ZCwhVOSdnn+RzkzlRz/eY4BgJBYVpg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "argparse": "^1.0.7",
+        "esprima": "^4.0.0"
+      },
+      "bin": {
+        "js-yaml": "bin/js-yaml.js"
+      }
+    },
+    "node_modules/readdirp": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-4.1.2.tgz",
+      "integrity": "sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 14.18.0"
+      },
+      "funding": {
+        "type": "individual",
+        "url": "https://paulmillr.com/funding/"
+      }
+    },
+    "node_modules/redent": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/redent/-/redent-3.0.0.tgz",
+      "integrity": "sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "indent-string": "^4.0.0",
+        "strip-indent": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/reflect.getprototypeof": {
+      "version": "1.0.10",
+      "resolved": "https://registry.npmjs.org/reflect.getprototypeof/-/reflect.getprototypeof-1.0.10.tgz",
+      "integrity": "sha512-00o4I+DVrefhv+nX0ulyi3biSHCPDe+yLv5o/p6d/UVlirijB8E16FtfwSAi4g3tcqrQ4lRAqQSoFEZJehYEcw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.9",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.0.0",
+        "get-intrinsic": "^1.2.7",
+        "get-proto": "^1.0.1",
+        "which-builtin-type": "^1.2.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/regexp.prototype.flags": {
+      "version": "1.5.4",
+      "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.4.tgz",
+      "integrity": "sha512-dYqgNSZbDwkaJ2ceRd9ojCGjBq+mOm9LmtXnAnEGyHhN/5R7iDW2TRw3h+o/jCFxus3P2LfWIIiwowAjANm7IA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "define-properties": "^1.2.1",
+        "es-errors": "^1.3.0",
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
+        "set-function-name": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/require-directory": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+      "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/require-from-string": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz",
+      "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/requires-port": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/requires-port/-/requires-port-1.0.0.tgz",
+      "integrity": "sha512-KigOCHcocU3XODJxsu8i/j8T9tzT4adHiecwORRQ0ZZFcp7ahwXuRU1m+yuO90C5ZUyGeGfocHDI14M3L3yDAQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/resolve": {
+      "version": "2.0.0-next.6",
+      "resolved": "https://registry.npmjs.org/resolve/-/resolve-2.0.0-next.6.tgz",
+      "integrity": "sha512-3JmVl5hMGtJ3kMmB3zi3DL25KfkCEyy3Tw7Gmw7z5w8M9WlwoPFnIvwChzu1+cF3iaK3sp18hhPz8ANeimdJfA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "is-core-module": "^2.16.1",
+        "node-exports-info": "^1.6.0",
+        "object-keys": "^1.1.1",
+        "path-parse": "^1.0.7",
+        "supports-preserve-symlinks-flag": "^1.0.0"
+      },
+      "bin": {
+        "resolve": "bin/resolve"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/resolve-from": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-5.0.0.tgz",
+      "integrity": "sha512-qYg9KP24dD5qka9J47d0aVky0N+b4fTU89LN9iDnjB5waksiC49rvMB0PrUJQGoTmH50XPiqOvAjDfaijGxYZw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/reusify": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.1.0.tgz",
+      "integrity": "sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "iojs": ">=1.0.0",
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/rolldown": {
+      "version": "1.0.0-rc.10",
+      "resolved": "https://registry.npmjs.org/rolldown/-/rolldown-1.0.0-rc.10.tgz",
+      "integrity": "sha512-q7j6vvarRFmKpgJUT8HCAUljkgzEp4LAhPlJUvQhA5LA1SUL36s5QCysMutErzL3EbNOZOkoziSx9iZC4FddKA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@oxc-project/types": "=0.120.0",
+        "@rolldown/pluginutils": "1.0.0-rc.10"
+      },
+      "bin": {
+        "rolldown": "bin/cli.mjs"
+      },
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      },
+      "optionalDependencies": {
+        "@rolldown/binding-android-arm64": "1.0.0-rc.10",
+        "@rolldown/binding-darwin-arm64": "1.0.0-rc.10",
+        "@rolldown/binding-darwin-x64": "1.0.0-rc.10",
+        "@rolldown/binding-freebsd-x64": "1.0.0-rc.10",
+        "@rolldown/binding-linux-arm-gnueabihf": "1.0.0-rc.10",
+        "@rolldown/binding-linux-arm64-gnu": "1.0.0-rc.10",
+        "@rolldown/binding-linux-arm64-musl": "1.0.0-rc.10",
+        "@rolldown/binding-linux-ppc64-gnu": "1.0.0-rc.10",
+        "@rolldown/binding-linux-s390x-gnu": "1.0.0-rc.10",
+        "@rolldown/binding-linux-x64-gnu": "1.0.0-rc.10",
+        "@rolldown/binding-linux-x64-musl": "1.0.0-rc.10",
+        "@rolldown/binding-openharmony-arm64": "1.0.0-rc.10",
+        "@rolldown/binding-wasm32-wasi": "1.0.0-rc.10",
+        "@rolldown/binding-win32-arm64-msvc": "1.0.0-rc.10",
+        "@rolldown/binding-win32-x64-msvc": "1.0.0-rc.10"
+      }
+    },
+    "node_modules/rolldown/node_modules/@rolldown/pluginutils": {
+      "version": "1.0.0-rc.10",
+      "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-rc.10.tgz",
+      "integrity": "sha512-UkVDEFk1w3mveXeKgaTuYfKWtPbvgck1dT8TUG3bnccrH0XtLTuAyfCoks4Q/M5ZGToSVJTIQYCzy2g/atAOeg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/rollup": {
+      "version": "4.60.1",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.60.1.tgz",
+      "integrity": "sha512-VmtB2rFU/GroZ4oL8+ZqXgSA38O6GR8KSIvWmEFv63pQ0G6KaBH9s07PO8XTXP4vI+3UJUEypOfjkGfmSBBR0w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree": "1.0.8"
+      },
+      "bin": {
+        "rollup": "dist/bin/rollup"
+      },
+      "engines": {
+        "node": ">=18.0.0",
+        "npm": ">=8.0.0"
+      },
+      "optionalDependencies": {
+        "@rollup/rollup-android-arm-eabi": "4.60.1",
+        "@rollup/rollup-android-arm64": "4.60.1",
+        "@rollup/rollup-darwin-arm64": "4.60.1",
+        "@rollup/rollup-darwin-x64": "4.60.1",
+        "@rollup/rollup-freebsd-arm64": "4.60.1",
+        "@rollup/rollup-freebsd-x64": "4.60.1",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.60.1",
+        "@rollup/rollup-linux-arm-musleabihf": "4.60.1",
+        "@rollup/rollup-linux-arm64-gnu": "4.60.1",
+        "@rollup/rollup-linux-arm64-musl": "4.60.1",
+        "@rollup/rollup-linux-loong64-gnu": "4.60.1",
+        "@rollup/rollup-linux-loong64-musl": "4.60.1",
+        "@rollup/rollup-linux-ppc64-gnu": "4.60.1",
+        "@rollup/rollup-linux-ppc64-musl": "4.60.1",
+        "@rollup/rollup-linux-riscv64-gnu": "4.60.1",
+        "@rollup/rollup-linux-riscv64-musl": "4.60.1",
+        "@rollup/rollup-linux-s390x-gnu": "4.60.1",
+        "@rollup/rollup-linux-x64-gnu": "4.60.1",
+        "@rollup/rollup-linux-x64-musl": "4.60.1",
+        "@rollup/rollup-openbsd-x64": "4.60.1",
+        "@rollup/rollup-openharmony-arm64": "4.60.1",
+        "@rollup/rollup-win32-arm64-msvc": "4.60.1",
+        "@rollup/rollup-win32-ia32-msvc": "4.60.1",
+        "@rollup/rollup-win32-x64-gnu": "4.60.1",
+        "@rollup/rollup-win32-x64-msvc": "4.60.1",
+        "fsevents": "~2.3.2"
+      }
+    },
+    "node_modules/rrweb-cssom": {
+      "version": "0.8.0",
+      "resolved": "https://registry.npmjs.org/rrweb-cssom/-/rrweb-cssom-0.8.0.tgz",
+      "integrity": "sha512-guoltQEx+9aMf2gDZ0s62EcV8lsXR+0w8915TC3ITdn2YueuNjdAYh/levpU9nFaoChh9RUS5ZdQMrKfVEN9tw==",
+      "license": "MIT"
+    },
+    "node_modules/run-parallel": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
+      "integrity": "sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "queue-microtask": "^1.2.2"
+      }
+    },
+    "node_modules/rxjs": {
+      "version": "7.8.2",
+      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.2.tgz",
+      "integrity": "sha512-dhKf903U/PQZY6boNNtAGdWbG85WAbjT/1xYoZIC7FAY0yWapOBQVsVrDl58W86//e1VpMNBtRV4MaXfdMySFA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "tslib": "^2.1.0"
+      }
+    },
+    "node_modules/safe-array-concat": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.3.tgz",
+      "integrity": "sha512-AURm5f0jYEOydBj7VQlVvDrjeFgthDdEF5H1dP+6mNpoXOMo1quQqJ4wvJDyRZ9+pO3kGWoOdmV08cSv2aJV6Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.2",
+        "get-intrinsic": "^1.2.6",
+        "has-symbols": "^1.1.0",
+        "isarray": "^2.0.5"
+      },
+      "engines": {
+        "node": ">=0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/safe-push-apply": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/safe-push-apply/-/safe-push-apply-1.0.0.tgz",
+      "integrity": "sha512-iKE9w/Z7xCzUMIZqdBsp6pEQvwuEebH4vdpjcDWnyzaI6yl6O9FHvVpmGelvEHNsoY6wGblkxR6Zty/h00WiSA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "isarray": "^2.0.5"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/safe-regex-test": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.1.0.tgz",
+      "integrity": "sha512-x/+Cz4YrimQxQccJf5mKEbIa1NzeCRNI5Ecl/ekmlYaampdNLPalVyIcCZNNH3MvmqBugV5TMYZXv0ljslUlaw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "es-errors": "^1.3.0",
+        "is-regex": "^1.2.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/safer-buffer": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
+      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
+      "license": "MIT"
+    },
+    "node_modules/sass": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.98.0.tgz",
+      "integrity": "sha512-+4N/u9dZ4PrgzGgPlKnaaRQx64RO0JBKs9sDhQ2pLgN6JQZ25uPQZKQYaBJU48Kd5BxgXoJ4e09Dq7nMcOUW3A==",
+      "license": "MIT",
+      "dependencies": {
+        "chokidar": "^4.0.0",
+        "immutable": "^5.1.5",
+        "source-map-js": ">=0.6.2 <2.0.0"
+      },
+      "bin": {
+        "sass": "sass.js"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      },
+      "optionalDependencies": {
+        "@parcel/watcher": "^2.4.1"
+      }
+    },
+    "node_modules/sass-embedded": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded/-/sass-embedded-1.98.0.tgz",
+      "integrity": "sha512-Do7u6iRb6K+lrllcTkB1BXcHwOxcKe3rEfOF/GcCLE2w3WpddakRAosJOHFUR37DpsvimQXEt5abs3NzUjEIqg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@bufbuild/protobuf": "^2.5.0",
+        "colorjs.io": "^0.5.0",
+        "immutable": "^5.1.5",
+        "rxjs": "^7.4.0",
+        "supports-color": "^8.1.1",
+        "sync-child-process": "^1.0.2",
+        "varint": "^6.0.0"
+      },
+      "bin": {
+        "sass": "dist/bin/sass.js"
+      },
+      "engines": {
+        "node": ">=16.0.0"
+      },
+      "optionalDependencies": {
+        "sass-embedded-all-unknown": "1.98.0",
+        "sass-embedded-android-arm": "1.98.0",
+        "sass-embedded-android-arm64": "1.98.0",
+        "sass-embedded-android-riscv64": "1.98.0",
+        "sass-embedded-android-x64": "1.98.0",
+        "sass-embedded-darwin-arm64": "1.98.0",
+        "sass-embedded-darwin-x64": "1.98.0",
+        "sass-embedded-linux-arm": "1.98.0",
+        "sass-embedded-linux-arm64": "1.98.0",
+        "sass-embedded-linux-musl-arm": "1.98.0",
+        "sass-embedded-linux-musl-arm64": "1.98.0",
+        "sass-embedded-linux-musl-riscv64": "1.98.0",
+        "sass-embedded-linux-musl-x64": "1.98.0",
+        "sass-embedded-linux-riscv64": "1.98.0",
+        "sass-embedded-linux-x64": "1.98.0",
+        "sass-embedded-unknown-all": "1.98.0",
+        "sass-embedded-win32-arm64": "1.98.0",
+        "sass-embedded-win32-x64": "1.98.0"
+      }
+    },
+    "node_modules/sass-embedded-all-unknown": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-all-unknown/-/sass-embedded-all-unknown-1.98.0.tgz",
+      "integrity": "sha512-6n4RyK7/1mhdfYvpP3CClS3fGoYqDvRmLClCESS6I7+SAzqjxvGG6u5Fo+cb1nrPNbbilgbM4QKdgcgWHO9NCA==",
+      "cpu": [
+        "!arm",
+        "!arm64",
+        "!riscv64",
+        "!x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "sass": "1.98.0"
+      }
+    },
+    "node_modules/sass-embedded-android-arm": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-android-arm/-/sass-embedded-android-arm-1.98.0.tgz",
+      "integrity": "sha512-LjGiMhHgu7VL1n7EJxTCre1x14bUsWd9d3dnkS2rku003IWOI/fxc7OXgaKagoVzok1kv09rzO3vFXJR5ZeONQ==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/sass-embedded-android-arm64": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-android-arm64/-/sass-embedded-android-arm64-1.98.0.tgz",
+      "integrity": "sha512-M9Ra98A6vYJHpwhoC/5EuH1eOshQ9ZyNwC8XifUDSbRl/cGeQceT1NReR9wFj3L7s1pIbmes1vMmaY2np0uAKQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/sass-embedded-android-riscv64": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-android-riscv64/-/sass-embedded-android-riscv64-1.98.0.tgz",
+      "integrity": "sha512-WPe+0NbaJIZE1fq/RfCZANMeIgmy83x4f+SvFOG7LhUthHpZWcOcrPTsCKKmN3xMT3iw+4DXvqTYOCYGRL3hcQ==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/sass-embedded-android-x64": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-android-x64/-/sass-embedded-android-x64-1.98.0.tgz",
+      "integrity": "sha512-zrD25dT7OHPEgLWuPEByybnIfx4rnCtfge4clBgjZdZ3lF6E7qNLRBtSBmoFflh6Vg0RlEjJo5VlpnTMBM5MQQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/sass-embedded-darwin-arm64": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-darwin-arm64/-/sass-embedded-darwin-arm64-1.98.0.tgz",
+      "integrity": "sha512-cgr1z9rBnCdMf8K+JabIaYd9Rag2OJi5mjq08XJfbJGMZV/TA6hFJCLGkr5/+ZOn4/geTM5/3aSfQ8z5EIJAOg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/sass-embedded-darwin-x64": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-darwin-x64/-/sass-embedded-darwin-x64-1.98.0.tgz",
+      "integrity": "sha512-OLBOCs/NPeiMqTdOrMFbVHBQFj19GS3bSVSxIhcCq16ZyhouUkYJEZjxQgzv9SWA2q6Ki8GCqp4k6jMeUY9dcA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/sass-embedded-linux-arm": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-linux-arm/-/sass-embedded-linux-arm-1.98.0.tgz",
+      "integrity": "sha512-03baQZCxVyEp8v1NWBRlzGYrmVT/LK7ZrHlF1piscGiGxwfdxoLXVuxsylx3qn/dD/4i/rh7Bzk7reK1br9jvQ==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/sass-embedded-linux-arm64": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-linux-arm64/-/sass-embedded-linux-arm64-1.98.0.tgz",
+      "integrity": "sha512-axOE3t2MTBwCtkUCbrdM++Gj0gC0fdHJPrgzQ+q1WUmY9NoNMGqflBtk5mBZaWUeha2qYO3FawxCB8lctFwCtw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/sass-embedded-linux-musl-arm": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-arm/-/sass-embedded-linux-musl-arm-1.98.0.tgz",
+      "integrity": "sha512-OBkjTDPYR4hSaueOGIM6FDpl9nt/VZwbSRpbNu9/eEJcxE8G/vynRugW8KRZmCFjPy8j/jkGBvvS+k9iOqKV3g==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/sass-embedded-linux-musl-arm64": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-arm64/-/sass-embedded-linux-musl-arm64-1.98.0.tgz",
+      "integrity": "sha512-LeqNxQA8y4opjhe68CcFvMzCSrBuJqYVFbwElEj9bagHXQHTp9xVPJRn6VcrC+0VLEDq13HVXMv7RslIuU0zmA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/sass-embedded-linux-musl-riscv64": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-riscv64/-/sass-embedded-linux-musl-riscv64-1.98.0.tgz",
+      "integrity": "sha512-7w6hSuOHKt8FZsmjRb3iGSxEzM87fO9+M8nt5JIQYMhHTj5C+JY/vcske0v715HCVj5e1xyTnbGXf8FcASeAIw==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/sass-embedded-linux-musl-x64": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-x64/-/sass-embedded-linux-musl-x64-1.98.0.tgz",
+      "integrity": "sha512-QikNyDEJOVqPmxyCFkci8ZdCwEssdItfjQFJB+D+Uy5HFqcS5Lv3d3GxWNX/h1dSb23RPyQdQc267ok5SbEyJw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/sass-embedded-linux-riscv64": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-linux-riscv64/-/sass-embedded-linux-riscv64-1.98.0.tgz",
+      "integrity": "sha512-E7fNytc/v4xFBQKzgzBddV/jretA4ULAPO6XmtBiQu4zZBdBozuSxsQLe2+XXeb0X4S2GIl72V7IPABdqke/vA==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/sass-embedded-linux-x64": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-linux-x64/-/sass-embedded-linux-x64-1.98.0.tgz",
+      "integrity": "sha512-VsvP0t/uw00mMNPv3vwyYKUrFbqzxQHnRMO+bHdAMjvLw4NFf6mscpym9Bzf+NXwi1ZNKnB6DtXjmcpcvqFqYg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/sass-embedded-unknown-all": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-unknown-all/-/sass-embedded-unknown-all-1.98.0.tgz",
+      "integrity": "sha512-C4MMzcAo3oEDQnW7L8SBgB9F2Fq5qHPnaYTZRMOH3Mp/7kM4OooBInXpCiiFjLnjY95hzP4KyctVx0uYR6MYlQ==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "!android",
+        "!darwin",
+        "!linux",
+        "!win32"
+      ],
+      "dependencies": {
+        "sass": "1.98.0"
+      }
+    },
+    "node_modules/sass-embedded-win32-arm64": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-win32-arm64/-/sass-embedded-win32-arm64-1.98.0.tgz",
+      "integrity": "sha512-nP/10xbAiPbhQkMr3zQfXE4TuOxPzWRQe1Hgbi90jv2R4TbzbqQTuZVOaJf7KOAN4L2Bo6XCTRjK5XkVnwZuwQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/sass-embedded-win32-x64": {
+      "version": "1.98.0",
+      "resolved": "https://registry.npmjs.org/sass-embedded-win32-x64/-/sass-embedded-win32-x64-1.98.0.tgz",
+      "integrity": "sha512-/lbrVsfbcbdZQ5SJCWcV0NVPd6YRs+FtAnfedp4WbCkO/ZO7Zt/58MvI4X2BVpRY/Nt5ZBo1/7v2gYcQ+J4svQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/sass-embedded/node_modules/supports-color": {
+      "version": "8.1.1",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
+      "integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "has-flag": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/supports-color?sponsor=1"
+      }
+    },
+    "node_modules/saxes": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/saxes/-/saxes-6.0.0.tgz",
+      "integrity": "sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==",
+      "license": "ISC",
+      "dependencies": {
+        "xmlchars": "^2.2.0"
+      },
+      "engines": {
+        "node": ">=v12.22.7"
+      }
+    },
+    "node_modules/scheduler": {
+      "version": "0.27.0",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.27.0.tgz",
+      "integrity": "sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==",
+      "license": "MIT"
+    },
+    "node_modules/semver": {
+      "version": "7.7.4",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.4.tgz",
+      "integrity": "sha512-vFKC2IEtQnVhpT78h1Yp8wzwrf8CM+MzKMHGJZfBtzhZNycRFnXsHk6E5TxIkkMsgNS7mdX3AGB7x2QM2di4lA==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/set-cookie-parser": {
+      "version": "2.7.2",
+      "resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.7.2.tgz",
+      "integrity": "sha512-oeM1lpU/UvhTxw+g3cIfxXHyJRc/uidd3yK1P242gzHds0udQBYzs3y8j4gCCW+ZJ7ad0yctld8RYO+bdurlvw==",
+      "license": "MIT"
+    },
+    "node_modules/set-function-length": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz",
+      "integrity": "sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "define-data-property": "^1.1.4",
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2",
+        "get-intrinsic": "^1.2.4",
+        "gopd": "^1.0.1",
+        "has-property-descriptors": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/set-function-name": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.2.tgz",
+      "integrity": "sha512-7PGFlmtwsEADb0WYyvCMa1t+yke6daIG4Wirafur5kcf+MhUnPms1UeR0CKQdTZD81yESwMHbtn+TR+dMviakQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "define-data-property": "^1.1.4",
+        "es-errors": "^1.3.0",
+        "functions-have-names": "^1.2.3",
+        "has-property-descriptors": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/set-proto": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/set-proto/-/set-proto-1.0.0.tgz",
+      "integrity": "sha512-RJRdvCo6IAnPdsvP/7m6bsQqNnn1FCBX5ZNtFL98MmFF/4xAIJTIg1YbHW5DC2W5SKZanrC6i4HsJqlajw/dZw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "dunder-proto": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/shebang-command": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
+      "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "shebang-regex": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/shebang-regex": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
+      "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/side-channel": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.1.0.tgz",
+      "integrity": "sha512-ZX99e6tRweoUXqR+VBrslhda51Nh5MTQwou5tnUDgbtyM0dBgmhEDtWGP/xbKn6hqfPRHujUNwz5fy/wbbhnpw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "object-inspect": "^1.13.3",
+        "side-channel-list": "^1.0.0",
+        "side-channel-map": "^1.0.1",
+        "side-channel-weakmap": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/side-channel-list": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/side-channel-list/-/side-channel-list-1.0.1.tgz",
+      "integrity": "sha512-mjn/0bi/oUURjc5Xl7IaWi/OJJJumuoJFQJfDDyO46+hBWsfaVM65TBHq2eoZBhzl9EchxOijpkbRC8SVBQU0w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "object-inspect": "^1.13.4"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/side-channel-map": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/side-channel-map/-/side-channel-map-1.0.1.tgz",
+      "integrity": "sha512-VCjCNfgMsby3tTdo02nbjtM/ewra6jPHmpThenkTYh8pG9ucZ/1P8So4u4FGBek/BjpOVsDCMoLA/iuBKIFXRA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.5",
+        "object-inspect": "^1.13.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/side-channel-weakmap": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/side-channel-weakmap/-/side-channel-weakmap-1.0.2.tgz",
+      "integrity": "sha512-WPS/HvHQTYnHisLo9McqBHOJk2FkHO/tlpvldyrnem4aeQp4hai3gythswg6p01oSoTl58rcpiFAjF2br2Ak2A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.5",
+        "object-inspect": "^1.13.3",
+        "side-channel-map": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/siginfo": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/siginfo/-/siginfo-2.0.0.tgz",
+      "integrity": "sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/signal-exit": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
+      "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/slash": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz",
+      "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/slice-ansi": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-4.0.0.tgz",
+      "integrity": "sha512-qMCMfhY040cVHT43K9BFygqYbUPFZKHOg7K73mtTWJRb8pyP3fzf4Ixd5SzdEJQ6MRUg/WBnOLxghZtKKurENQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "astral-regex": "^2.0.0",
+        "is-fullwidth-code-point": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/slice-ansi?sponsor=1"
+      }
+    },
+    "node_modules/source-map-js": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
+      "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/spawndamnit": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/spawndamnit/-/spawndamnit-3.0.1.tgz",
+      "integrity": "sha512-MmnduQUuHCoFckZoWnXsTg7JaiLBJrKFj9UI2MbRPGaJeVpsLcVBu6P/IGZovziM/YBsellCmsprgNA+w0CzVg==",
+      "dev": true,
+      "license": "SEE LICENSE IN LICENSE",
+      "dependencies": {
+        "cross-spawn": "^7.0.5",
+        "signal-exit": "^4.0.1"
+      }
+    },
+    "node_modules/sprintf-js": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
+      "integrity": "sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==",
+      "dev": true,
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/stack-utils": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/stack-utils/-/stack-utils-2.0.6.tgz",
+      "integrity": "sha512-XlkWvfIm6RmsWtNJx+uqtKLS8eqFbxUg0ZzLXqY0caEy9l7hruX8IpiDnjsLavoBgqCCR71TqWO8MaXYheJ3RQ==",
+      "license": "MIT",
+      "dependencies": {
+        "escape-string-regexp": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/stack-utils/node_modules/escape-string-regexp": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-2.0.0.tgz",
+      "integrity": "sha512-UpzcLCXolUWcNu5HtVMHYdXJjArjsF9C0aNnquZYY4uW/Vu0miy5YoWvbV345HauVvcAUnpRuhMMcqTcGOY2+w==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/stackback": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/stackback/-/stackback-0.0.2.tgz",
+      "integrity": "sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/state-local": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/state-local/-/state-local-1.0.7.tgz",
+      "integrity": "sha512-HTEHMNieakEnoe33shBYcZ7NX83ACUjCu8c40iOGEZsngj9zRnkqS9j1pqQPXwobB0ZcVTk27REb7COQ0UR59w==",
+      "license": "MIT"
+    },
+    "node_modules/statuses": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.2.tgz",
+      "integrity": "sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/std-env": {
+      "version": "3.10.0",
+      "resolved": "https://registry.npmjs.org/std-env/-/std-env-3.10.0.tgz",
+      "integrity": "sha512-5GS12FdOZNliM5mAOxFRg7Ir0pWz8MdpYm6AY6VPkGpbA7ZzmbzNcBJQ0GPvvyWgcY7QAhCgf9Uy89I03faLkg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/stop-iteration-iterator": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/stop-iteration-iterator/-/stop-iteration-iterator-1.1.0.tgz",
+      "integrity": "sha512-eLoXW/DHyl62zxY4SCaIgnRhuMr6ri4juEYARS8E6sCEqzKpOiE521Ucofdx+KnDZl5xmvGYaaKCk5FEOxJCoQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "internal-slot": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/strict-event-emitter": {
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/strict-event-emitter/-/strict-event-emitter-0.5.1.tgz",
+      "integrity": "sha512-vMgjE/GGEPEFnhFub6pa4FmJBRBVOLpIII2hvCZ8Kzb7K0hlHo7mQv6xYrBvCL2LtAIBwFUK8wvuJgTVSQ5MFQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/string-width": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-8.2.0.tgz",
+      "integrity": "sha512-6hJPQ8N0V0P3SNmP6h2J99RLuzrWz2gvT7VnK5tKvrNqJoyS9W4/Fb8mo31UiPvy00z7DQXkP2hnKBVav76thw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "get-east-asian-width": "^1.5.0",
+        "strip-ansi": "^7.1.2"
+      },
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/string-width-cjs": {
+      "name": "string-width",
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/string-width/node_modules/ansi-regex": {
+      "version": "6.2.2",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.2.2.tgz",
+      "integrity": "sha512-Bq3SmSpyFHaWjPk8If9yc6svM8c56dB5BAtW4Qbw5jHTwwXXcTLoRMkpDJp6VL0XzlWaCHTXrkFURMYmD0sLqg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-regex?sponsor=1"
+      }
+    },
+    "node_modules/string-width/node_modules/strip-ansi": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.2.0.tgz",
+      "integrity": "sha512-yDPMNjp4WyfYBkHnjIRLfca1i6KMyGCtsVgoKe/z1+6vukgaENdgGBZt+ZmKPc4gavvEZ5OgHfHdrazhgNyG7w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^6.2.2"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/strip-ansi?sponsor=1"
+      }
+    },
+    "node_modules/string.prototype.matchall": {
+      "version": "4.0.12",
+      "resolved": "https://registry.npmjs.org/string.prototype.matchall/-/string.prototype.matchall-4.0.12.tgz",
+      "integrity": "sha512-6CC9uyBL+/48dYizRf7H7VAYCMCNTBeM78x/VTUe9bFEaxBepPJDa1Ow99LqI/1yF7kuy7Q3cQsYMrcjGUcskA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.3",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.6",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.0.0",
+        "get-intrinsic": "^1.2.6",
+        "gopd": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "internal-slot": "^1.1.0",
+        "regexp.prototype.flags": "^1.5.3",
+        "set-function-name": "^2.0.2",
+        "side-channel": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/string.prototype.repeat": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/string.prototype.repeat/-/string.prototype.repeat-1.0.0.tgz",
+      "integrity": "sha512-0u/TldDbKD8bFCQ/4f5+mNRrXwZ8hg2w7ZR8wa16e8z9XpePWl3eGEcUD0OXpEH/VJH/2G3gjUtR3ZOiBe2S/w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "define-properties": "^1.1.3",
+        "es-abstract": "^1.17.5"
+      }
+    },
+    "node_modules/string.prototype.trim": {
+      "version": "1.2.10",
+      "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.10.tgz",
+      "integrity": "sha512-Rs66F0P/1kedk5lyYyH9uBzuiI/kNRmwJAR9quK6VOtIpZ2G+hMZd+HQbbv25MgCA6gEffoMZYxlTod4WcdrKA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.2",
+        "define-data-property": "^1.1.4",
+        "define-properties": "^1.2.1",
+        "es-abstract": "^1.23.5",
+        "es-object-atoms": "^1.0.0",
+        "has-property-descriptors": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/string.prototype.trimend": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.9.tgz",
+      "integrity": "sha512-G7Ok5C6E/j4SGfyLCloXTrngQIQU3PWtXGst3yM7Bea9FRURf1S42ZHlZZtsNque2FN2PoUhfZXYLNWwEr4dLQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.2",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/string.prototype.trimstart": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.8.tgz",
+      "integrity": "sha512-UXSH262CSZY1tfu3G3Secr6uGLCFVPMhIqHjlgCUtCCcgihYc/xKs9djMTMUOb2j1mVSeU8EU6NWc/iQKU6Gfg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.7",
+        "define-properties": "^1.2.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/strip-ansi-cjs": {
+      "name": "strip-ansi",
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/strip-bom": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/strip-bom/-/strip-bom-3.0.0.tgz",
+      "integrity": "sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/strip-indent": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-3.0.0.tgz",
+      "integrity": "sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "min-indent": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/strip-json-comments": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz",
+      "integrity": "sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/stylelint": {
+      "version": "17.5.0",
+      "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-17.5.0.tgz",
+      "integrity": "sha512-o/NS6zhsPZFmgUm5tXX4pVNg1XDOZSlucLdf2qow/lVn4JIyzZIQ5b3kad1ugqUj3GSIgr2u5lQw7X8rjqw33g==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/stylelint"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/stylelint"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@csstools/css-calc": "^3.1.1",
+        "@csstools/css-parser-algorithms": "^4.0.0",
+        "@csstools/css-syntax-patches-for-csstree": "^1.0.29",
+        "@csstools/css-tokenizer": "^4.0.0",
+        "@csstools/media-query-list-parser": "^5.0.0",
+        "@csstools/selector-resolve-nested": "^4.0.0",
+        "@csstools/selector-specificity": "^6.0.0",
+        "colord": "^2.9.3",
+        "cosmiconfig": "^9.0.1",
+        "css-functions-list": "^3.3.3",
+        "css-tree": "^3.2.1",
+        "debug": "^4.4.3",
+        "fast-glob": "^3.3.3",
+        "fastest-levenshtein": "^1.0.16",
+        "file-entry-cache": "^11.1.2",
+        "global-modules": "^2.0.0",
+        "globby": "^16.1.1",
+        "globjoin": "^0.1.4",
+        "html-tags": "^5.1.0",
+        "ignore": "^7.0.5",
+        "import-meta-resolve": "^4.2.0",
+        "imurmurhash": "^0.1.4",
+        "is-plain-object": "^5.0.0",
+        "mathml-tag-names": "^4.0.0",
+        "meow": "^14.1.0",
+        "micromatch": "^4.0.8",
+        "normalize-path": "^3.0.0",
+        "picocolors": "^1.1.1",
+        "postcss": "^8.5.8",
+        "postcss-safe-parser": "^7.0.1",
+        "postcss-selector-parser": "^7.1.1",
+        "postcss-value-parser": "^4.2.0",
+        "string-width": "^8.2.0",
+        "supports-hyperlinks": "^4.4.0",
+        "svg-tags": "^1.0.0",
+        "table": "^6.9.0",
+        "write-file-atomic": "^7.0.0"
+      },
+      "bin": {
+        "stylelint": "bin/stylelint.mjs"
+      },
+      "engines": {
+        "node": ">=20.19.0"
+      }
+    },
+    "node_modules/stylelint-config-recommended": {
+      "version": "18.0.0",
+      "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-18.0.0.tgz",
+      "integrity": "sha512-mxgT2XY6YZ3HWWe3Di8umG6aBmWmHTblTgu/f10rqFXnyWxjKWwNdjSWkgkwCtxIKnqjSJzvFmPT5yabVIRxZg==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/stylelint"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/stylelint"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.19.0"
+      },
+      "peerDependencies": {
+        "stylelint": "^17.0.0"
+      }
+    },
+    "node_modules/stylelint-config-recommended-scss": {
+      "version": "17.0.0",
+      "resolved": "https://registry.npmjs.org/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-17.0.0.tgz",
+      "integrity": "sha512-VkVD9r7jfUT/dq3mA3/I1WXXk2U71rO5wvU2yIil9PW5o1g3UM7Xc82vHmuVJHV7Y8ok5K137fmW5u3HbhtTOA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "postcss-scss": "^4.0.9",
+        "stylelint-config-recommended": "^18.0.0",
+        "stylelint-scss": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=20"
+      },
+      "peerDependencies": {
+        "postcss": "^8.3.3",
+        "stylelint": "^17.0.0"
+      },
+      "peerDependenciesMeta": {
+        "postcss": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/stylelint-config-standard": {
+      "version": "40.0.0",
+      "resolved": "https://registry.npmjs.org/stylelint-config-standard/-/stylelint-config-standard-40.0.0.tgz",
+      "integrity": "sha512-EznGJxOUhtWck2r6dJpbgAdPATIzvpLdK9+i5qPd4Lx70es66TkBPljSg4wN3Qnc6c4h2n+WbUrUynQ3fanjHw==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/stylelint"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/stylelint"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "stylelint-config-recommended": "^18.0.0"
+      },
+      "engines": {
+        "node": ">=20.19.0"
+      },
+      "peerDependencies": {
+        "stylelint": "^17.0.0"
+      }
+    },
+    "node_modules/stylelint-config-standard-scss": {
+      "version": "17.0.0",
+      "resolved": "https://registry.npmjs.org/stylelint-config-standard-scss/-/stylelint-config-standard-scss-17.0.0.tgz",
+      "integrity": "sha512-uLJS6xgOCBw5EMsDW7Ukji8l28qRoMnkRch15s0qwZpskXvWt9oPzMmcYM307m9GN4MxuWLsQh4I6hU9yI53cQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "stylelint-config-recommended-scss": "^17.0.0",
+        "stylelint-config-standard": "^40.0.0"
+      },
+      "engines": {
+        "node": ">=20"
+      },
+      "peerDependencies": {
+        "postcss": "^8.3.3",
+        "stylelint": "^17.0.0"
+      },
+      "peerDependenciesMeta": {
+        "postcss": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/stylelint-order": {
+      "version": "8.1.1",
+      "resolved": "https://registry.npmjs.org/stylelint-order/-/stylelint-order-8.1.1.tgz",
+      "integrity": "sha512-LqsEB6VggJuu5v10RtkrQsBObcdwBE7GuAOlwfc/LR3VL/w8UqKX2BOLIjhyGt0Gne/njo7gRNGiJAKhfmPMNw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "postcss": "^8.5.8",
+        "postcss-sorting": "^10.0.0"
+      },
+      "engines": {
+        "node": ">=20.19.0"
+      },
+      "peerDependencies": {
+        "stylelint": "^16.18.0 || ^17.0.0"
+      }
+    },
+    "node_modules/stylelint-scss": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-7.0.0.tgz",
+      "integrity": "sha512-H88kCC+6Vtzj76NsC8rv6x/LW8slBzIbyeSjsKVlS+4qaEJoDrcJR4L+8JdrR2ORdTscrBzYWiiT2jq6leYR1Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "css-tree": "^3.0.1",
+        "is-plain-object": "^5.0.0",
+        "known-css-properties": "^0.37.0",
+        "mdn-data": "^2.25.0",
+        "postcss-media-query-parser": "^0.2.3",
+        "postcss-resolve-nested-selector": "^0.1.6",
+        "postcss-selector-parser": "^7.1.1",
+        "postcss-value-parser": "^4.2.0"
+      },
+      "engines": {
+        "node": ">=20.19.0"
+      },
+      "peerDependencies": {
+        "stylelint": "^16.8.2 || ^17.0.0"
+      }
+    },
+    "node_modules/stylelint/node_modules/file-entry-cache": {
+      "version": "11.1.2",
+      "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-11.1.2.tgz",
+      "integrity": "sha512-N2WFfK12gmrK1c1GXOqiAJ1tc5YE+R53zvQ+t5P8S5XhnmKYVB5eZEiLNZKDSmoG8wqqbF9EXYBBW/nef19log==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "flat-cache": "^6.1.20"
+      }
+    },
+    "node_modules/stylelint/node_modules/flat-cache": {
+      "version": "6.1.22",
+      "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-6.1.22.tgz",
+      "integrity": "sha512-N2dnzVJIphnNsjHcrxGW7DePckJ6haPrSFqpsBUhHYgwtKGVq4JrBGielEGD2fCVnsGm1zlBVZ8wGhkyuetgug==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cacheable": "^2.3.4",
+        "flatted": "^3.4.2",
+        "hookified": "^1.15.0"
+      }
+    },
+    "node_modules/stylelint/node_modules/globby": {
+      "version": "16.2.0",
+      "resolved": "https://registry.npmjs.org/globby/-/globby-16.2.0.tgz",
+      "integrity": "sha512-QrJia2qDf5BB/V6HYlDTs0I0lBahyjLzpGQg3KT7FnCdTonAyPy2RtY802m2k4ALx6Dp752f82WsOczEVr3l6Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@sindresorhus/merge-streams": "^4.0.0",
+        "fast-glob": "^3.3.3",
+        "ignore": "^7.0.5",
+        "is-path-inside": "^4.0.0",
+        "slash": "^5.1.0",
+        "unicorn-magic": "^0.4.0"
+      },
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/stylelint/node_modules/ignore": {
+      "version": "7.0.5",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.5.tgz",
+      "integrity": "sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4"
+      }
+    },
+    "node_modules/stylelint/node_modules/slash": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/slash/-/slash-5.1.0.tgz",
+      "integrity": "sha512-ZA6oR3T/pEyuqwMgAKT0/hAv8oAXckzbkmR0UkUosQ+Mc4RxGoJkRmwHgHufaenlyAgE1Mxgpdcrf75y6XcnDg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=14.16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/supports-color": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+      "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+      "license": "MIT",
+      "dependencies": {
+        "has-flag": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/supports-hyperlinks": {
+      "version": "4.4.0",
+      "resolved": "https://registry.npmjs.org/supports-hyperlinks/-/supports-hyperlinks-4.4.0.tgz",
+      "integrity": "sha512-UKbpT93hN5Nr9go5UY7bopIB9YQlMz9nm/ct4IXt/irb5YRkn9WaqrOBJGZ5Pwvsd5FQzSVeYlGdXoCAPQZrPg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "has-flag": "^5.0.1",
+        "supports-color": "^10.2.2"
+      },
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/supports-hyperlinks?sponsor=1"
+      }
+    },
+    "node_modules/supports-hyperlinks/node_modules/has-flag": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-5.0.1.tgz",
+      "integrity": "sha512-CsNUt5x9LUdx6hnk/E2SZLsDyvfqANZSUq4+D3D8RzDJ2M+HDTIkF60ibS1vHaK55vzgiZw1bEPFG9yH7l33wA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/supports-hyperlinks/node_modules/supports-color": {
+      "version": "10.2.2",
+      "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-10.2.2.tgz",
+      "integrity": "sha512-SS+jx45GF1QjgEXQx4NJZV9ImqmO2NPz5FNsIHrsDjh2YsHnawpan7SNQ1o8NuhrbHZy9AZhIoCUiCeaW/C80g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/supports-color?sponsor=1"
+      }
+    },
+    "node_modules/supports-preserve-symlinks-flag": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz",
+      "integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/svg-tags": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/svg-tags/-/svg-tags-1.0.0.tgz",
+      "integrity": "sha512-ovssysQTa+luh7A5Weu3Rta6FJlFBBbInjOh722LIt6klpU2/HtdUbszju/G4devcvk8PGt7FCLv5wftu3THUA==",
+      "dev": true
+    },
+    "node_modules/symbol-tree": {
+      "version": "3.2.4",
+      "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
+      "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==",
+      "license": "MIT"
+    },
+    "node_modules/sync-child-process": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/sync-child-process/-/sync-child-process-1.0.2.tgz",
+      "integrity": "sha512-8lD+t2KrrScJ/7KXCSyfhT3/hRq78rC0wBFqNJXv3mZyn6hW2ypM05JmlSvtqRbeq6jqA94oHbxAr2vYsJ8vDA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "sync-message-port": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=16.0.0"
+      }
+    },
+    "node_modules/sync-message-port": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/sync-message-port/-/sync-message-port-1.2.0.tgz",
+      "integrity": "sha512-gAQ9qrUN/UCypHtGFbbe7Rc/f9bzO88IwrG8TDo/aMKAApKyD6E3W4Cm0EfhfBb6Z6SKt59tTCTfD+n1xmAvMg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=16.0.0"
+      }
+    },
+    "node_modules/table": {
+      "version": "6.9.0",
+      "resolved": "https://registry.npmjs.org/table/-/table-6.9.0.tgz",
+      "integrity": "sha512-9kY+CygyYM6j02t5YFHbNz2FN5QmYGv9zAjVp4lCDjlCw7amdckXlEt/bjMhUIfj4ThGRE4gCUH5+yGnNuPo5A==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "ajv": "^8.0.1",
+        "lodash.truncate": "^4.4.2",
+        "slice-ansi": "^4.0.0",
+        "string-width": "^4.2.3",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=10.0.0"
+      }
+    },
+    "node_modules/table/node_modules/ajv": {
+      "version": "8.18.0",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.18.0.tgz",
+      "integrity": "sha512-PlXPeEWMXMZ7sPYOHqmDyCJzcfNrUr3fGNKtezX14ykXOEIvyK81d+qydx89KY5O71FKMPaQ2vBfBFI5NHR63A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fast-deep-equal": "^3.1.3",
+        "fast-uri": "^3.0.1",
+        "json-schema-traverse": "^1.0.0",
+        "require-from-string": "^2.0.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/epoberezkin"
+      }
+    },
+    "node_modules/table/node_modules/json-schema-traverse": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
+      "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/table/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/term-size": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/term-size/-/term-size-2.2.1.tgz",
+      "integrity": "sha512-wK0Ri4fOGjv/XPy8SBHZChl8CM7uMc5VML7SqiQ0zG7+J5Vr+RMQDoHa2CNT6KHUnTGIXH34UDMkPzAUyapBZg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/tiny-case": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/tiny-case/-/tiny-case-1.0.3.tgz",
+      "integrity": "sha512-Eet/eeMhkO6TX8mnUteS9zgPbUMQa4I6Kkp5ORiBD5476/m+PIRiumP5tmh5ioJpH7k51Kehawy2UDfsnxxY8Q==",
+      "license": "MIT"
+    },
+    "node_modules/tiny-warning": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz",
+      "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==",
+      "license": "MIT"
+    },
+    "node_modules/tinybench": {
+      "version": "2.9.0",
+      "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.9.0.tgz",
+      "integrity": "sha512-0+DUvqWMValLmha6lr4kD8iAMK1HzV0/aKnCtWb9v9641TnP/MFb7Pc2bxoxQjTXAErryXVgUOfv2YqNllqGeg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/tinyexec": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/tinyexec/-/tinyexec-1.1.1.tgz",
+      "integrity": "sha512-VKS/ZaQhhkKFMANmAOhhXVoIfBXblQxGX1myCQ2faQrfmobMftXeJPcZGp0gS07ocvGJWDLZGyOZDadDBqYIJg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/tinyglobby": {
+      "version": "0.2.16",
+      "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.16.tgz",
+      "integrity": "sha512-pn99VhoACYR8nFHhxqix+uvsbXineAasWm5ojXoN8xEwK5Kd3/TrhNn1wByuD52UxWRLy8pu+kRMniEi6Eq9Zg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fdir": "^6.5.0",
+        "picomatch": "^4.0.4"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/SuperchupuDev"
+      }
+    },
+    "node_modules/tinyrainbow": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/tinyrainbow/-/tinyrainbow-3.1.0.tgz",
+      "integrity": "sha512-Bf+ILmBgretUrdJxzXM0SgXLZ3XfiaUuOj/IKQHuTXip+05Xn+uyEYdVg0kYDipTBcLrCVyUzAPz7QmArb0mmw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/tldts": {
+      "version": "7.0.28",
+      "resolved": "https://registry.npmjs.org/tldts/-/tldts-7.0.28.tgz",
+      "integrity": "sha512-+Zg3vWhRUv8B1maGSTFdev9mjoo8Etn2Ayfs4cnjlD3CsGkxXX4QyW3j2WJ0wdjYcYmy7Lx2RDsZMhgCWafKIw==",
+      "license": "MIT",
+      "dependencies": {
+        "tldts-core": "^7.0.28"
+      },
+      "bin": {
+        "tldts": "bin/cli.js"
+      }
+    },
+    "node_modules/tldts-core": {
+      "version": "7.0.28",
+      "resolved": "https://registry.npmjs.org/tldts-core/-/tldts-core-7.0.28.tgz",
+      "integrity": "sha512-7W5Efjhsc3chVdFhqtaU0KtK32J37Zcr9RKtID54nG+tIpcY79CQK/veYPODxtD/LJ4Lue66jvrQzIX2Z2/pUQ==",
+      "license": "MIT"
+    },
+    "node_modules/to-regex-range": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
+      "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
+      "license": "MIT",
+      "dependencies": {
+        "is-number": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=8.0"
+      }
+    },
+    "node_modules/toposort": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/toposort/-/toposort-2.0.2.tgz",
+      "integrity": "sha512-0a5EOkAUp8D4moMi2W8ZF8jcga7BgZd91O/yabJCFY8az+XSzeGyTKs0Aoo897iV1Nj6guFq8orWDS96z91oGg==",
+      "license": "MIT"
+    },
+    "node_modules/tough-cookie": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-6.0.1.tgz",
+      "integrity": "sha512-LktZQb3IeoUWB9lqR5EWTHgW/VTITCXg4D21M+lvybRVdylLrRMnqaIONLVb5mav8vM19m44HIcGq4qASeu2Qw==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "tldts": "^7.0.5"
+      },
+      "engines": {
+        "node": ">=16"
+      }
+    },
+    "node_modules/tr46": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/tr46/-/tr46-6.0.0.tgz",
+      "integrity": "sha512-bLVMLPtstlZ4iMQHpFHTR7GAGj2jxi8Dg0s2h2MafAE4uSWF98FC/3MomU51iQAMf8/qDUbKWf5GxuvvVcXEhw==",
+      "license": "MIT",
+      "dependencies": {
+        "punycode": "^2.3.1"
+      },
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/ts-api-utils": {
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.5.0.tgz",
+      "integrity": "sha512-OJ/ibxhPlqrMM0UiNHJ/0CKQkoKF243/AEmplt3qpRgkW8VG7IfOS41h7V8TjITqdByHzrjcS/2si+y4lIh8NA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18.12"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4"
+      }
+    },
+    "node_modules/tslib": {
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
+      "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
+      "license": "0BSD"
+    },
+    "node_modules/type-check": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
+      "integrity": "sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "prelude-ls": "^1.2.1"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/type-detect": {
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/type-detect/-/type-detect-4.0.8.tgz",
+      "integrity": "sha512-0fr/mIH1dlO+x7TlcMy+bIDqKPsw/70tVyeHW787goQjhmqaZe10uwLujubK9q9Lg6Fiho1KUKDYz0Z7k7g5/g==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/type-fest": {
+      "version": "4.41.0",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-4.41.0.tgz",
+      "integrity": "sha512-TeTSQ6H5YHvpqVwBRcnLDCBnDOHWYu7IvGbHT6N8AOymcr9PJGjc1GTtiWZTYg0NCgYwvnYWEkVChQAr9bjfwA==",
+      "dev": true,
+      "license": "(MIT OR CC0-1.0)",
+      "engines": {
+        "node": ">=16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/typed-array-buffer": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.3.tgz",
+      "integrity": "sha512-nAYYwfY3qnzX30IkA6AQZjVbtK6duGontcQm1WSG1MD94YLqK0515GNApXkoxKOWMusVssAHWLh9SeaoefYFGw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "es-errors": "^1.3.0",
+        "is-typed-array": "^1.1.14"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/typed-array-byte-length": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.3.tgz",
+      "integrity": "sha512-BaXgOuIxz8n8pIq3e7Atg/7s+DpiYrxn4vdot3w9KbnBhcRQq6o3xemQdIfynqSeXeDrF32x+WvfzmOjPiY9lg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.8",
+        "for-each": "^0.3.3",
+        "gopd": "^1.2.0",
+        "has-proto": "^1.2.0",
+        "is-typed-array": "^1.1.14"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/typed-array-byte-offset": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.4.tgz",
+      "integrity": "sha512-bTlAFB/FBYMcuX81gbL4OcpH5PmlFHqlCCpAl8AlEzMz5k53oNDvN8p1PNOWLEmI2x4orp3raOFB51tv9X+MFQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "available-typed-arrays": "^1.0.7",
+        "call-bind": "^1.0.8",
+        "for-each": "^0.3.3",
+        "gopd": "^1.2.0",
+        "has-proto": "^1.2.0",
+        "is-typed-array": "^1.1.15",
+        "reflect.getprototypeof": "^1.0.9"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/typed-array-length": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.7.tgz",
+      "integrity": "sha512-3KS2b+kL7fsuk/eJZ7EQdnEmQoaho/r6KUef7hxvltNA5DR8NAUM+8wJMbJyZ4G9/7i3v5zPBIMN5aybAh2/Jg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind": "^1.0.7",
+        "for-each": "^0.3.3",
+        "gopd": "^1.0.1",
+        "is-typed-array": "^1.1.13",
+        "possible-typed-array-names": "^1.0.0",
+        "reflect.getprototypeof": "^1.0.6"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/typed-css-modules": {
+      "version": "0.9.1",
+      "resolved": "https://registry.npmjs.org/typed-css-modules/-/typed-css-modules-0.9.1.tgz",
+      "integrity": "sha512-W2HWKncdKd+bLWsnuWB2EyuQBzZ7KJ9Byr/67KLiiyGegcN52rOveun9JR8yAvuL5IXunRMxt0eORMtAUj5bmA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "camelcase": "^6.0.0",
+        "chalk": "^4.0.0",
+        "chokidar": "^3.4.0",
+        "glob": "^10.3.10",
+        "icss-replace-symbols": "^1.1.0",
+        "is-there": "^4.4.2",
+        "mkdirp": "^3.0.0",
+        "postcss": "^8.0.0",
+        "postcss-modules-extract-imports": "^3.0.0",
+        "postcss-modules-local-by-default": "^4.0.0",
+        "postcss-modules-scope": "^3.0.0",
+        "postcss-modules-values": "^4.0.0",
+        "yargs": "^17.7.2"
+      },
+      "bin": {
+        "tcm": "lib/cli.js"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/typed-css-modules/node_modules/chokidar": {
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
+      "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "anymatch": "~3.1.2",
+        "braces": "~3.0.2",
+        "glob-parent": "~5.1.2",
+        "is-binary-path": "~2.1.0",
+        "is-glob": "~4.0.1",
+        "normalize-path": "~3.0.0",
+        "readdirp": "~3.6.0"
+      },
+      "engines": {
+        "node": ">= 8.10.0"
+      },
+      "funding": {
+        "url": "https://paulmillr.com/funding/"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.2"
+      }
+    },
+    "node_modules/typed-css-modules/node_modules/glob-parent": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "is-glob": "^4.0.1"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
+    "node_modules/typed-css-modules/node_modules/picomatch": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.2.tgz",
+      "integrity": "sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/typed-css-modules/node_modules/readdirp": {
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
+      "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "picomatch": "^2.2.1"
+      },
+      "engines": {
+        "node": ">=8.10.0"
+      }
+    },
+    "node_modules/typescript": {
+      "version": "5.9.3",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.9.3.tgz",
+      "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "bin": {
+        "tsc": "bin/tsc",
+        "tsserver": "bin/tsserver"
+      },
+      "engines": {
+        "node": ">=14.17"
+      }
+    },
+    "node_modules/typescript-eslint": {
+      "version": "8.57.1",
+      "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.57.1.tgz",
+      "integrity": "sha512-fLvZWf+cAGw3tqMCYzGIU6yR8K+Y9NT2z23RwOjlNFF2HwSB3KhdEFI5lSBv8tNmFkkBShSjsCjzx1vahZfISA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/eslint-plugin": "8.57.1",
+        "@typescript-eslint/parser": "8.57.1",
+        "@typescript-eslint/typescript-estree": "8.57.1",
+        "@typescript-eslint/utils": "8.57.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/unbox-primitive": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.1.0.tgz",
+      "integrity": "sha512-nWJ91DjeOkej/TA8pXQ3myruKpKEYgqvpw9lz4OPHj/NWFNluYrjbz9j01CJ8yKQd2g4jFoOkINCTW2I5LEEyw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.3",
+        "has-bigints": "^1.0.2",
+        "has-symbols": "^1.1.0",
+        "which-boxed-primitive": "^1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/undici": {
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/undici/-/undici-7.24.7.tgz",
+      "integrity": "sha512-H/nlJ/h0ggGC+uRL3ovD+G0i4bqhvsDOpbDv7At5eFLlj2b41L8QliGbnl2H7SnDiYhENphh1tQFJZf+MyfLsQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.18.1"
+      }
+    },
+    "node_modules/undici-types": {
+      "version": "7.16.0",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.16.0.tgz",
+      "integrity": "sha512-Zz+aZWSj8LE6zoxD+xrjh4VfkIG8Ya6LvYkZqtUQGJPZjYl53ypCaUwWqo7eI0x66KBGeRo+mlBEkMSeSZ38Nw==",
+      "license": "MIT"
+    },
+    "node_modules/unicorn-magic": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/unicorn-magic/-/unicorn-magic-0.4.0.tgz",
+      "integrity": "sha512-wH590V9VNgYH9g3lH9wWjTrUoKsjLF6sGLjhR4sH1LWpLmCOH0Zf7PukhDA8BiS7KHe4oPNkcTHqYkj7SOGUOw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/universalify": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz",
+      "integrity": "sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4.0.0"
+      }
+    },
+    "node_modules/update-browserslist-db": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.2.3.tgz",
+      "integrity": "sha512-Js0m9cx+qOgDxo0eMiFGEueWztz+d4+M3rGlmKPT+T4IS/jP4ylw3Nwpu6cpTTP8R1MAC1kF4VbdLt3ARf209w==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/browserslist"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/browserslist"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "escalade": "^3.2.0",
+        "picocolors": "^1.1.1"
+      },
+      "bin": {
+        "update-browserslist-db": "cli.js"
+      },
+      "peerDependencies": {
+        "browserslist": ">= 4.21.0"
+      }
+    },
+    "node_modules/uri-js": {
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz",
+      "integrity": "sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "punycode": "^2.1.0"
+      }
+    },
+    "node_modules/url-parse": {
+      "version": "1.5.10",
+      "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.5.10.tgz",
+      "integrity": "sha512-WypcfiRhfeUP9vvF0j6rw0J3hrWrw6iZv3+22h6iRMJ/8z1Tj6XfLP4DsUix5MhMPnXpiHDoKyoZ/bdCkwBCiQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "querystringify": "^2.1.1",
+        "requires-port": "^1.0.0"
+      }
+    },
+    "node_modules/usehooks-ts": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/usehooks-ts/-/usehooks-ts-3.1.1.tgz",
+      "integrity": "sha512-I4diPp9Cq6ieSUH2wu+fDAVQO43xwtulo+fKEidHUwZPnYImbtkTjzIJYcDcJqxgmX31GVqNFURodvcgHcW0pA==",
+      "license": "MIT",
+      "dependencies": {
+        "lodash.debounce": "^4.0.8"
+      },
+      "engines": {
+        "node": ">=16.15.0"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0  || ^17 || ^18 || ^19 || ^19.0.0-rc"
+      }
+    },
+    "node_modules/util-deprecate": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
+      "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/vanilla-framework": {
+      "version": "4.46.0",
+      "resolved": "https://registry.npmjs.org/vanilla-framework/-/vanilla-framework-4.46.0.tgz",
+      "integrity": "sha512-CaDd8QOeCmz6KhawYe3mPpNDP7KS/BxaYUq5/DwPmBU/pLQAvAkvUwizsW4b0+ua0eCgiVx0ILamfcd/V3/dyw==",
+      "license": "LGPL-3.0",
+      "peerDependencies": {
+        "sass": "^1.79.0"
+      }
+    },
+    "node_modules/varint": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/varint/-/varint-6.0.0.tgz",
+      "integrity": "sha512-cXEIW6cfr15lFv563k4GuVuW/fiwjknytD37jIOLSdSWuOI6WnO/oKwmP2FQTU2l01LP8/M5TSAJpzUaGe3uWg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/vite": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-8.0.1.tgz",
+      "integrity": "sha512-wt+Z2qIhfFt85uiyRt5LPU4oVEJBXj8hZNWKeqFG4gRG/0RaRGJ7njQCwzFVjO+v4+Ipmf5CY7VdmZRAYYBPHw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "lightningcss": "^1.32.0",
+        "picomatch": "^4.0.3",
+        "postcss": "^8.5.8",
+        "rolldown": "1.0.0-rc.10",
+        "tinyglobby": "^0.2.15"
+      },
+      "bin": {
+        "vite": "bin/vite.js"
+      },
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      },
+      "funding": {
+        "url": "https://github.com/vitejs/vite?sponsor=1"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.3"
+      },
+      "peerDependencies": {
+        "@types/node": "^20.19.0 || >=22.12.0",
+        "@vitejs/devtools": "^0.1.0",
+        "esbuild": "^0.27.0",
+        "jiti": ">=1.21.0",
+        "less": "^4.0.0",
+        "sass": "^1.70.0",
+        "sass-embedded": "^1.70.0",
+        "stylus": ">=0.54.8",
+        "sugarss": "^5.0.0",
+        "terser": "^5.16.0",
+        "tsx": "^4.8.1",
+        "yaml": "^2.4.2"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        },
+        "@vitejs/devtools": {
+          "optional": true
+        },
+        "esbuild": {
+          "optional": true
+        },
+        "jiti": {
+          "optional": true
+        },
+        "less": {
+          "optional": true
+        },
+        "sass": {
+          "optional": true
+        },
+        "sass-embedded": {
+          "optional": true
+        },
+        "stylus": {
+          "optional": true
+        },
+        "sugarss": {
+          "optional": true
+        },
+        "terser": {
+          "optional": true
+        },
+        "tsx": {
+          "optional": true
+        },
+        "yaml": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/vite/node_modules/fsevents": {
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
+      "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+      }
+    },
+    "node_modules/vitest": {
+      "version": "4.0.18",
+      "resolved": "https://registry.npmjs.org/vitest/-/vitest-4.0.18.tgz",
+      "integrity": "sha512-hOQuK7h0FGKgBAas7v0mSAsnvrIgAvWmRFjmzpJ7SwFHH3g1k2u37JtYwOwmEKhK6ZO3v9ggDBBm0La1LCK4uQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/expect": "4.0.18",
+        "@vitest/mocker": "4.0.18",
+        "@vitest/pretty-format": "4.0.18",
+        "@vitest/runner": "4.0.18",
+        "@vitest/snapshot": "4.0.18",
+        "@vitest/spy": "4.0.18",
+        "@vitest/utils": "4.0.18",
+        "es-module-lexer": "^1.7.0",
+        "expect-type": "^1.2.2",
+        "magic-string": "^0.30.21",
+        "obug": "^2.1.1",
+        "pathe": "^2.0.3",
+        "picomatch": "^4.0.3",
+        "std-env": "^3.10.0",
+        "tinybench": "^2.9.0",
+        "tinyexec": "^1.0.2",
+        "tinyglobby": "^0.2.15",
+        "tinyrainbow": "^3.0.3",
+        "vite": "^6.0.0 || ^7.0.0",
+        "why-is-node-running": "^2.3.0"
+      },
+      "bin": {
+        "vitest": "vitest.mjs"
+      },
+      "engines": {
+        "node": "^20.0.0 || ^22.0.0 || >=24.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      },
+      "peerDependencies": {
+        "@edge-runtime/vm": "*",
+        "@opentelemetry/api": "^1.9.0",
+        "@types/node": "^20.0.0 || ^22.0.0 || >=24.0.0",
+        "@vitest/browser-playwright": "4.0.18",
+        "@vitest/browser-preview": "4.0.18",
+        "@vitest/browser-webdriverio": "4.0.18",
+        "@vitest/ui": "4.0.18",
+        "happy-dom": "*",
+        "jsdom": "*"
+      },
+      "peerDependenciesMeta": {
+        "@edge-runtime/vm": {
+          "optional": true
+        },
+        "@opentelemetry/api": {
+          "optional": true
+        },
+        "@types/node": {
+          "optional": true
+        },
+        "@vitest/browser-playwright": {
+          "optional": true
+        },
+        "@vitest/browser-preview": {
+          "optional": true
+        },
+        "@vitest/browser-webdriverio": {
+          "optional": true
+        },
+        "@vitest/ui": {
+          "optional": true
+        },
+        "happy-dom": {
+          "optional": true
+        },
+        "jsdom": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/vitest/node_modules/@vitest/mocker": {
+      "version": "4.0.18",
+      "resolved": "https://registry.npmjs.org/@vitest/mocker/-/mocker-4.0.18.tgz",
+      "integrity": "sha512-HhVd0MDnzzsgevnOWCBj5Otnzobjy5wLBe4EdeeFGv8luMsGcYqDuFRMcttKWZA5vVO8RFjexVovXvAM4JoJDQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/spy": "4.0.18",
+        "estree-walker": "^3.0.3",
+        "magic-string": "^0.30.21"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      },
+      "peerDependencies": {
+        "msw": "^2.4.9",
+        "vite": "^6.0.0 || ^7.0.0-0"
+      },
+      "peerDependenciesMeta": {
+        "msw": {
+          "optional": true
+        },
+        "vite": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/vitest/node_modules/fsevents": {
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
+      "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+      }
+    },
+    "node_modules/vitest/node_modules/vite": {
+      "version": "7.3.2",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-7.3.2.tgz",
+      "integrity": "sha512-Bby3NOsna2jsjfLVOHKes8sGwgl4TT0E6vvpYgnAYDIF/tie7MRaFthmKuHx1NSXjiTueXH3do80FMQgvEktRg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "esbuild": "^0.27.0",
+        "fdir": "^6.5.0",
+        "picomatch": "^4.0.3",
+        "postcss": "^8.5.6",
+        "rollup": "^4.43.0",
+        "tinyglobby": "^0.2.15"
+      },
+      "bin": {
+        "vite": "bin/vite.js"
+      },
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      },
+      "funding": {
+        "url": "https://github.com/vitejs/vite?sponsor=1"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.3"
+      },
+      "peerDependencies": {
+        "@types/node": "^20.19.0 || >=22.12.0",
+        "jiti": ">=1.21.0",
+        "less": "^4.0.0",
+        "lightningcss": "^1.21.0",
+        "sass": "^1.70.0",
+        "sass-embedded": "^1.70.0",
+        "stylus": ">=0.54.8",
+        "sugarss": "^5.0.0",
+        "terser": "^5.16.0",
+        "tsx": "^4.8.1",
+        "yaml": "^2.4.2"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        },
+        "jiti": {
+          "optional": true
+        },
+        "less": {
+          "optional": true
+        },
+        "lightningcss": {
+          "optional": true
+        },
+        "sass": {
+          "optional": true
+        },
+        "sass-embedded": {
+          "optional": true
+        },
+        "stylus": {
+          "optional": true
+        },
+        "sugarss": {
+          "optional": true
+        },
+        "terser": {
+          "optional": true
+        },
+        "tsx": {
+          "optional": true
+        },
+        "yaml": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/w3c-xmlserializer": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-5.0.0.tgz",
+      "integrity": "sha512-o8qghlI8NZHU1lLPrpi2+Uq7abh4GGPpYANlalzWxyWteJOCsr/P+oPBA49TOLu5FTZO4d3F9MnWJfiMo4BkmA==",
+      "license": "MIT",
+      "dependencies": {
+        "xml-name-validator": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/webidl-conversions": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-8.0.1.tgz",
+      "integrity": "sha512-BMhLD/Sw+GbJC21C/UgyaZX41nPt8bUTg+jWyDeg7e7YN4xOM05YPSIXceACnXVtqyEw/LMClUQMtMZ+PGGpqQ==",
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/whatwg-encoding": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-3.1.1.tgz",
+      "integrity": "sha512-6qN4hJdMwfYBtE3YBTTHhoeuUrDBPZmbQaxWAqSALV/MeEnR5z1xd8UKud2RAkFoPkmB+hli1TZSnyi84xz1vQ==",
+      "deprecated": "Use @exodus/bytes instead for a more spec-conformant and faster implementation",
+      "license": "MIT",
+      "dependencies": {
+        "iconv-lite": "0.6.3"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/whatwg-encoding/node_modules/iconv-lite": {
+      "version": "0.6.3",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
+      "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
+      "license": "MIT",
+      "dependencies": {
+        "safer-buffer": ">= 2.1.2 < 3.0.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/whatwg-mimetype": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-5.0.0.tgz",
+      "integrity": "sha512-sXcNcHOC51uPGF0P/D4NVtrkjSU2fNsm9iog4ZvZJsL3rjoDAzXZhkm2MWt1y+PUdggKAYVoMAIYcs78wJ51Cw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/whatwg-url": {
+      "version": "16.0.1",
+      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-16.0.1.tgz",
+      "integrity": "sha512-1to4zXBxmXHV3IiSSEInrreIlu02vUOvrhxJJH5vcxYTBDAx51cqZiKdyTxlecdKNSjj8EcxGBxNf6Vg+945gw==",
+      "license": "MIT",
+      "dependencies": {
+        "@exodus/bytes": "^1.11.0",
+        "tr46": "^6.0.0",
+        "webidl-conversions": "^8.0.1"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      }
+    },
+    "node_modules/which": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
+      "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "isexe": "^2.0.0"
+      },
+      "bin": {
+        "node-which": "bin/node-which"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/which-boxed-primitive": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/which-boxed-primitive/-/which-boxed-primitive-1.1.1.tgz",
+      "integrity": "sha512-TbX3mj8n0odCBFVlY8AxkqcHASw3L60jIuF8jFP78az3C2YhmGvqbHBpAjTRH2/xqYunrJ9g1jSyjCjpoWzIAA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-bigint": "^1.1.0",
+        "is-boolean-object": "^1.2.1",
+        "is-number-object": "^1.1.1",
+        "is-string": "^1.1.1",
+        "is-symbol": "^1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/which-builtin-type": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/which-builtin-type/-/which-builtin-type-1.2.1.tgz",
+      "integrity": "sha512-6iBczoX+kDQ7a3+YJBnh3T+KZRxM/iYNPXicqk66/Qfm1b93iu+yOImkg0zHbj5LNOcNv1TEADiZ0xa34B4q6Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "function.prototype.name": "^1.1.6",
+        "has-tostringtag": "^1.0.2",
+        "is-async-function": "^2.0.0",
+        "is-date-object": "^1.1.0",
+        "is-finalizationregistry": "^1.1.0",
+        "is-generator-function": "^1.0.10",
+        "is-regex": "^1.2.1",
+        "is-weakref": "^1.0.2",
+        "isarray": "^2.0.5",
+        "which-boxed-primitive": "^1.1.0",
+        "which-collection": "^1.0.2",
+        "which-typed-array": "^1.1.16"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/which-collection": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/which-collection/-/which-collection-1.0.2.tgz",
+      "integrity": "sha512-K4jVyjnBdgvc86Y6BkaLZEN933SwYOuBFkdmBu9ZfkcAbdVbpITnDmjvZ/aQjRXQrv5EPkTnD1s39GiiqbngCw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-map": "^2.0.3",
+        "is-set": "^2.0.3",
+        "is-weakmap": "^2.0.2",
+        "is-weakset": "^2.0.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/which-typed-array": {
+      "version": "1.1.20",
+      "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.20.tgz",
+      "integrity": "sha512-LYfpUkmqwl0h9A2HL09Mms427Q1RZWuOHsukfVcKRq9q95iQxdw0ix1JQrqbcDR9PH1QDwf5Qo8OZb5lksZ8Xg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "available-typed-arrays": "^1.0.7",
+        "call-bind": "^1.0.8",
+        "call-bound": "^1.0.4",
+        "for-each": "^0.3.5",
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
+        "has-tostringtag": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/why-is-node-running": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/why-is-node-running/-/why-is-node-running-2.3.0.tgz",
+      "integrity": "sha512-hUrmaWBdVDcxvYqnyh09zunKzROWjbZTiNy8dBEjkS7ehEDQibXJ7XvlmtbwuTclUiIyN+CyXQD4Vmko8fNm8w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "siginfo": "^2.0.0",
+        "stackback": "0.0.2"
+      },
+      "bin": {
+        "why-is-node-running": "cli.js"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/word-wrap": {
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.5.tgz",
+      "integrity": "sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/wrap-ansi": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-6.2.0.tgz",
+      "integrity": "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/wrap-ansi-cjs": {
+      "name": "wrap-ansi",
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
+    "node_modules/wrap-ansi-cjs/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/wrap-ansi/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/write-file-atomic": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-7.0.1.tgz",
+      "integrity": "sha512-OTIk8iR8/aCRWBqvxrzxR0hgxWpnYBblY1S5hDWBQfk/VFmJwzmJgQFN3WsoUKHISv2eAwe+PpbUzyL1CKTLXg==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "signal-exit": "^4.0.1"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/ws": {
+      "version": "8.20.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.20.0.tgz",
+      "integrity": "sha512-sAt8BhgNbzCtgGbt2OxmpuryO63ZoDk/sqaB/znQm94T4fCEsy/yV+7CdC1kJhOU9lboAEU7R3kquuycDoibVA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=10.0.0"
+      },
+      "peerDependencies": {
+        "bufferutil": "^4.0.1",
+        "utf-8-validate": ">=5.0.2"
+      },
+      "peerDependenciesMeta": {
+        "bufferutil": {
+          "optional": true
+        },
+        "utf-8-validate": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/xml-name-validator": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-5.0.0.tgz",
+      "integrity": "sha512-EvGK8EJ3DhaHfbRlETOWAS5pO9MZITeauHKJyb8wyajUfQUenkIg2MvLDTZ4T/TgIcm3HU0TFBgWWboAZ30UHg==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/xmlchars": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/xmlchars/-/xmlchars-2.2.0.tgz",
+      "integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==",
+      "license": "MIT"
+    },
+    "node_modules/y18n": {
+      "version": "5.0.8",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
+      "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/yallist": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
+      "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/yargs": {
+      "version": "17.7.2",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
+      "integrity": "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cliui": "^8.0.1",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "require-directory": "^2.1.1",
+        "string-width": "^4.2.3",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^21.1.1"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/yargs-parser": {
+      "version": "21.1.1",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz",
+      "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/yargs/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/yocto-queue": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz",
+      "integrity": "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/yoctocolors-cjs": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/yoctocolors-cjs/-/yoctocolors-cjs-2.1.3.tgz",
+      "integrity": "sha512-U/PBtDf35ff0D8X8D0jfdzHYEPFxAI7jJlxZXwCSez5M3190m+QobIfh+sWDWSHMCWWJN2AWamkegn6vr6YBTw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/yup": {
+      "version": "1.7.1",
+      "resolved": "https://registry.npmjs.org/yup/-/yup-1.7.1.tgz",
+      "integrity": "sha512-GKHFX2nXul2/4Dtfxhozv701jLQHdf6J34YDh2cEkpqoo8le5Mg6/LrdseVLrFarmFygZTlfIhHx/QKfb/QWXw==",
+      "license": "MIT",
+      "dependencies": {
+        "property-expr": "^2.0.5",
+        "tiny-case": "^1.0.3",
+        "toposort": "^2.0.2",
+        "type-fest": "^2.19.0"
+      }
+    },
+    "node_modules/yup/node_modules/type-fest": {
+      "version": "2.19.0",
+      "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-2.19.0.tgz",
+      "integrity": "sha512-RAH822pAdBgcNMAfWnCBU3CFZcfZ/i1eZjwFU/dsLKumyuuP3niueg2UAukXYF0E2AAoc82ZSSf9J0WQBinzHA==",
+      "license": "(MIT OR CC0-1.0)",
+      "engines": {
+        "node": ">=12.20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/zod": {
+      "version": "4.3.6",
+      "resolved": "https://registry.npmjs.org/zod/-/zod-4.3.6.tgz",
+      "integrity": "sha512-rftlrkhHZOcjDwkGlnUtZZkvaPHCsDATp4pGpuOOMDaTdDDXF91wuVDJoWoPsKX/3YPQ5fHuF3STjcYyKr+Qhg==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/colinhacks"
+      }
+    },
+    "node_modules/zod-validation-error": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/zod-validation-error/-/zod-validation-error-4.0.2.tgz",
+      "integrity": "sha512-Q6/nZLe6jxuU80qb/4uJ4t5v2VEZ44lzQjPDhYJNztRQ4wyWc6VF3D3Kb/fAuPetZQnhS3hnajCf9CsWesghLQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "peerDependencies": {
+        "zod": "^3.25.0 || ^4.0.0"
+      }
+    }
+  }
+}
diff --git a/package.json b/package.json
index 19d8f424f..64d3d98c5 100644
--- a/package.json
+++ b/package.json
@@ -24,8 +24,8 @@
     "tcm:watch": "pnpm tcm:run --watch"
   },
   "dependencies": {
-    "@canonical/landscape-openapi": "0.0.50",
-    "@canonical/react-components": "4.2.0",
+    "@canonical/landscape-openapi": "^0.0.56",
+    "@canonical/react-components": "4.0.0",
     "@monaco-editor/react": "4.7.0",
     "@sentry/react": "10.47.0",
     "@tanstack/react-query": "5.96.2",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index b7ece4304..6bfa0b183 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -9,11 +9,11 @@ importers:
   .:
     dependencies:
       '@canonical/landscape-openapi':
-        specifier: 0.0.50
-        version: 0.0.50
+        specifier: ^0.0.56
+        version: 0.0.56
       '@canonical/react-components':
-        specifier: 4.2.0
-        version: 4.2.0(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(formik@2.4.9(@types/react@19.2.14)(react@19.2.4))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(vanilla-framework@4.46.0(sass@1.99.0))
+        specifier: 4.0.0
+        version: 4.0.0(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(formik@2.4.9(@types/react@19.2.14)(react@19.2.4))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(vanilla-framework@4.46.0(sass@1.99.0))
       '@monaco-editor/react':
         specifier: 4.7.0
         version: 4.7.0(monaco-editor@0.55.1)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
@@ -279,11 +279,11 @@ packages:
   '@cacheable/utils@2.4.1':
     resolution: {integrity: sha512-eiFgzCbIneyMlLOmNG4g9xzF7Hv3Mga4LjxjcSC/ues6VYq2+gUbQI8JqNuw/ZM8tJIeIaBGpswAsqV2V7ApgA==}
 
-  '@canonical/landscape-openapi@0.0.50':
-    resolution: {integrity: sha512-D9quhDND6+EJKhqUl97xkXp/sjipDTxSMLi1Obdj9fKs09GxQrR0IicIJaxgljfGQYT/yAine7I1GeTQCxOpEw==}
+  '@canonical/landscape-openapi@0.0.56':
+    resolution: {integrity: sha512-WI3w1BYQnWvVIWtSSmq6wxKcz/GVd66Xvf2fY/kq6+bYkT2odPEUf6REXVURlMSIPS8S4E7i/MMCPzaVVoiHGA==}
 
-  '@canonical/react-components@4.2.0':
-    resolution: {integrity: sha512-e4rYL0fvJTHynQtd7bfDtzYf25NxYGQq+BXtSMbpTU6cYxsw47EgITxYouB8yNa18iuAxYxINP3tRZugQK6qOw==}
+  '@canonical/react-components@4.0.0':
+    resolution: {integrity: sha512-gcBSNW6M7dcKJhfGBn2Bw0jZj0BNYcKWNK12utmmWtzXmzkulgMHywTAd5ZXdI3TCYKxY1zyw5BZNQeYO+TsFA==}
     peerDependencies:
       '@types/react': ^18.0.0 || ^19.0.0
       '@types/react-dom': ^18.0.0 || ^19.0.0
@@ -4212,9 +4212,9 @@ snapshots:
       hashery: 1.5.1
       keyv: 5.6.0
 
-  '@canonical/landscape-openapi@0.0.50': {}
+  '@canonical/landscape-openapi@0.0.56': {}
 
-  '@canonical/react-components@4.2.0(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(formik@2.4.9(@types/react@19.2.14)(react@19.2.4))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(vanilla-framework@4.46.0(sass@1.99.0))':
+  '@canonical/react-components@4.0.0(@types/react-dom@19.2.3(@types/react@19.2.14))(@types/react@19.2.14)(formik@2.4.9(@types/react@19.2.14)(react@19.2.4))(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(vanilla-framework@4.46.0(sass@1.99.0))':
     dependencies:
       '@types/jest': 30.0.0
       '@types/node': 20.19.30
diff --git a/src/api/fetchDebArchive.tsx b/src/api/fetchDebArchive.tsx
index aa98a384c..d40dfbfe9 100644
--- a/src/api/fetchDebArchive.tsx
+++ b/src/api/fetchDebArchive.tsx
@@ -28,9 +28,7 @@ const FetchDebArchiveProvider: FC<FetchDebArchiveProviderProps> = ({
   const { user, logout } = useContext(AuthContext);
 
   const authFetchDebArchive = useMemo(() => {
-    const debArchiveBaseUrl = API_URL_DEB_ARCHIVE;
-
-    return axios.create({ baseURL: debArchiveBaseUrl });
+    return axios.create({ baseURL: API_URL_DEB_ARCHIVE });
   }, []);
 
   const getLatestToken = useEffectEvent(() => {
diff --git a/src/components/form/ReadOnlyField/ReadOnlyField.tsx b/src/components/form/ReadOnlyField/ReadOnlyField.tsx
index b5dd69aa2..03502d99c 100644
--- a/src/components/form/ReadOnlyField/ReadOnlyField.tsx
+++ b/src/components/form/ReadOnlyField/ReadOnlyField.tsx
@@ -1,29 +1,25 @@
 import { Icon, Tooltip } from "@canonical/react-components";
 import type { FC } from "react";
 import classes from "./ReadOnlyField.module.scss";
-import NoData from "@/components/layout/NoData";
 
 interface ReadOnlyFieldProps {
   readonly label?: string;
-  readonly value?: string;
+  readonly value: string;
   readonly tooltipMessage?: string;
+  readonly required?: boolean;
 }
 
 const ReadOnlyField: FC<ReadOnlyFieldProps> = ({
   label,
   value,
   tooltipMessage,
+  required,
 }) => (
   <div className={classes.field}>
-    <label>{label}</label>
-    <Tooltip
-      position="btm-left"
-      className={classes.container}
-      message={tooltipMessage}
-      followMouse
-    >
+    <label>{required ? "* " : ""} {label}</label>
+    <Tooltip position="btm-left" className={classes.container} message={tooltipMessage} followMouse>
       <div className={classes.locked}>
-        <span>{value || <NoData />}</span>
+        <span>{value}</span>
         <Icon name="lock-locked" />
       </div>
     </Tooltip>
diff --git a/src/components/layout/Blocks/Item/Item.tsx b/src/components/layout/Blocks/Item/Item.tsx
index aaabf050b..1796d49ba 100644
--- a/src/components/layout/Blocks/Item/Item.tsx
+++ b/src/components/layout/Blocks/Item/Item.tsx
@@ -17,22 +17,30 @@ const Item: FC<ItemProps> = ({
   action,
   titleClassName,
   containerClassName,
-}: ItemProps) => (
-  <section className={classNames(classes.item, containerClassName)}>
+}: ItemProps) => {
+  const dense = useBlocksDense();
+  return (
+    <section className={classNames(classes.item, containerClassName)}>
     {(title || action) && (
       <div className={classes.heading}>
-        {title && (
-          <h4
-            className={classNames(classes.heading, "p-heading--5", titleClassName)}
-          >
-            {title}
-          </h4>
+          {title && (
+            <h4
+              className={classNames(
+            classes.heading,
+            { [classes.denseHeading as string]: dense },
+            "p-heading--5",
+            titleClassName,
+          )}
+            >
+              {title}
+            </h4>
         )}
         {action}
       </div>
-    )}
-    {children}
-  </section>
-);
+      )}
+      {children}
+    </section>
+  );
+};
 
 export default Item;
diff --git a/src/features/local-repositories/components/PublishLocalRepositoryGuard/PublishLocalRepositoryGuard.tsx b/src/features/local-repositories/components/PublishLocalRepositoryGuard/PublishLocalRepositoryGuard.tsx
index aabc60e6a..772c0117e 100644
--- a/src/features/local-repositories/components/PublishLocalRepositoryGuard/PublishLocalRepositoryGuard.tsx
+++ b/src/features/local-repositories/components/PublishLocalRepositoryGuard/PublishLocalRepositoryGuard.tsx
@@ -1,6 +1,6 @@
 import { type FC } from "react";
 import NoPublicationTargetsModal from "../NoPublicationTargetsModal";
-import useGetPublicationTargets from "@/features/publication-targets";
+import { useGetPublicationTargets } from "@/features/publication-targets";
 import LoadingState from "@/components/layout/LoadingState";
 import usePageParams from "@/hooks/usePageParams";
 import type { Local } from "../../types";
diff --git a/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryNewForm/PublishRepositoryNewForm.tsx b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryNewForm/PublishRepositoryNewForm.tsx
index a18896f3e..c4e6434f2 100644
--- a/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryNewForm/PublishRepositoryNewForm.tsx
+++ b/src/features/local-repositories/components/PublishLocalRepositorySidePanel/components/PublishRepositoryNewForm/PublishRepositoryNewForm.tsx
@@ -21,7 +21,7 @@ import {
 import useNotify from "@/hooks/useNotify";
 import classes from "../../PublishLocalRepositorySidePanel.module.scss";
 import type { SelectOption } from "@/types/SelectOption";
-import useGetPublicationTargets from "@/features/publication-targets";
+import { useGetPublicationTargets } from "@/features/publication-targets";
 import type { Local } from "../../../../types";
 import {
   useAddPublication,
diff --git a/src/features/publication-targets/api/index.ts b/src/features/publication-targets/api/index.ts
new file mode 100644
index 000000000..48e9460cb
--- /dev/null
+++ b/src/features/publication-targets/api/index.ts
@@ -0,0 +1,5 @@
+export { default as useGetPublicationTargets } from "./useGetPublicationTargets";
+export { default as useGetPublicationsByTarget } from "./useGetPublicationsByTarget";
+export { default as useCreatePublicationTarget } from "./useCreatePublicationTarget";
+export { default as useEditPublicationTarget } from "./useEditPublicationTarget";
+export { default as useRemovePublicationTarget } from "./useRemovePublicationTarget";
diff --git a/src/features/publication-targets/api/useCreatePublicationTarget.ts b/src/features/publication-targets/api/useCreatePublicationTarget.ts
new file mode 100644
index 000000000..1d1a09c0c
--- /dev/null
+++ b/src/features/publication-targets/api/useCreatePublicationTarget.ts
@@ -0,0 +1,36 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+import type {
+  PublicationTarget,
+  S3Target,
+  SwiftTarget,
+} from "@canonical/landscape-openapi";
+
+interface CreatePublicationTargetParams {
+  displayName: string;
+  s3?: Partial<S3Target>;
+  swift?: Partial<SwiftTarget>;
+}
+
+export default function useCreatePublicationTarget() {
+  const authFetchDebArchive = useFetchDebArchive();
+  const queryClient = useQueryClient();
+
+  const createPublicationTargetQuery = useMutation<
+    AxiosResponse<PublicationTarget>,
+    AxiosError<ApiError>,
+    CreatePublicationTargetParams
+  >({
+    mutationKey: ["publication-targets", "create"],
+    mutationFn: async (params) =>
+      authFetchDebArchive.post("publicationTargets", params),
+    onSuccess: async () =>
+      queryClient.invalidateQueries({ queryKey: ["publication-targets"] }),
+  });
+
+  return {
+    createPublicationTargetQuery,
+  };
+}
diff --git a/src/features/publication-targets/api/useEditPublicationTarget.ts b/src/features/publication-targets/api/useEditPublicationTarget.ts
new file mode 100644
index 000000000..dcff05df4
--- /dev/null
+++ b/src/features/publication-targets/api/useEditPublicationTarget.ts
@@ -0,0 +1,37 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+import type {
+  PublicationTarget,
+  S3Target,
+  SwiftTarget,
+} from "@canonical/landscape-openapi";
+
+interface EditPublicationTargetParams {
+  name?: string;
+  displayName: string;
+  s3?: Partial<S3Target>;
+  swift?: Partial<SwiftTarget>;
+}
+
+export default function useEditPublicationTarget() {
+  const authFetchDebArchive = useFetchDebArchive();
+  const queryClient = useQueryClient();
+
+  const editPublicationTargetQuery = useMutation<
+    AxiosResponse<PublicationTarget>,
+    AxiosError<ApiError>,
+    EditPublicationTargetParams
+  >({
+    mutationKey: ["publication-targets", "edit"],
+    mutationFn: async ({ name, ...params }) =>
+      authFetchDebArchive.patch(name ?? "", params),
+    onSuccess: async () =>
+      queryClient.invalidateQueries({ queryKey: ["publication-targets"] }),
+  });
+
+  return {
+    editPublicationTargetQuery,
+  };
+}
diff --git a/src/features/publication-targets/api/useGetPublicationTargets.ts b/src/features/publication-targets/api/useGetPublicationTargets.ts
index 011463707..85d6ea5cb 100644
--- a/src/features/publication-targets/api/useGetPublicationTargets.ts
+++ b/src/features/publication-targets/api/useGetPublicationTargets.ts
@@ -1,37 +1,41 @@
-import type { PublicationTarget } from "../types/PublicationTarget";
 import useFetchDebArchive from "@/hooks/useFetchDebArchive";
 import type { ApiError } from "@/types/api/ApiError";
 import { useQuery } from "@tanstack/react-query";
-import type { AxiosError, AxiosResponse } from "axios";
+import type { AxiosError } from "axios";
+import type {
+  ListPublicationTargetsResponse,
+  PublicationTarget,
+} from "@canonical/landscape-openapi";
 
-interface UseGetPublicationTargetsReturnType {
-  publicationTargets: PublicationTarget[];
-  isGettingPublicationTargets: boolean;
-}
-
-export interface ListPublicationTargetsResponse {
-  publicationTargets?: PublicationTarget[];
-  nextPageToken?: string;
-}
-
-const useGetPublicationTargets = (): UseGetPublicationTargetsReturnType => {
+export default function useGetPublicationTargets() {
   const authFetchDebArchive = useFetchDebArchive();
 
   const { data, isLoading } = useQuery<
-    AxiosResponse<ListPublicationTargetsResponse>,
+    PublicationTarget[],
     AxiosError<ApiError>
   >({
-    queryKey: ["publicationTargets", "all"],
-    queryFn: async () =>
-      await authFetchDebArchive.get("publicationTargets", {
-        params: { pageSize: 100 },
-      }),
+    queryKey: ["publication-targets", "all"],
+    queryFn: async () => {
+      let pageToken: string | undefined;
+      const targets: PublicationTarget[] = [];
+
+      do {
+        const response =
+          await authFetchDebArchive.get<ListPublicationTargetsResponse>(
+            "publicationTargets",
+            { params: { pageSize: 1000, pageToken } },
+          );
+
+        targets.push(...(response.data.publicationTargets ?? []));
+        pageToken = response.data.nextPageToken || undefined;
+      } while (pageToken);
+
+      return targets;
+    },
   });
 
   return {
-    publicationTargets: data?.data?.publicationTargets ?? [],
+    publicationTargets: data ?? [],
     isGettingPublicationTargets: isLoading,
   };
-};
-
-export default useGetPublicationTargets;
+}
diff --git a/src/features/publication-targets/api/useGetPublicationsByTarget.ts b/src/features/publication-targets/api/useGetPublicationsByTarget.ts
new file mode 100644
index 000000000..532d4dfd4
--- /dev/null
+++ b/src/features/publication-targets/api/useGetPublicationsByTarget.ts
@@ -0,0 +1,50 @@
+import type { Publication } from "../types";
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import type { ListPublicationsResponse } from "@canonical/landscape-openapi";
+import { useQuery } from "@tanstack/react-query";
+import type { AxiosError } from "axios";
+
+interface UseGetPublicationsByTargetReturnType {
+  publications: Publication[];
+  isGettingPublications: boolean;
+}
+
+export default function useGetPublicationsByTarget(
+  publicationTargetId: string | undefined,
+): UseGetPublicationsByTargetReturnType {
+  const authFetchDebArchive = useFetchDebArchive();
+
+  const { data, isLoading } = useQuery<Publication[], AxiosError<ApiError>>({
+    queryKey: ["publications", { publicationTargetId }],
+    enabled: publicationTargetId !== undefined,
+    queryFn: async () => {
+      let pageToken: string | undefined;
+      const publications: Publication[] = [];
+
+      do {
+        const response =
+          await authFetchDebArchive.get<ListPublicationsResponse>(
+            "publications",
+            {
+              params: {
+                publicationTargetId,
+                pageSize: 100,
+                pageToken,
+              },
+            },
+          );
+
+        publications.push(...((response.data.publications ?? []) as Publication[]));
+        pageToken = response.data.nextPageToken || undefined;
+      } while (pageToken);
+
+      return publications;
+    },
+  });
+
+  return {
+    publications: data ?? [],
+    isGettingPublications: publicationTargetId !== undefined && isLoading,
+  };
+}
diff --git a/src/features/publication-targets/api/useRemovePublicationTarget.ts b/src/features/publication-targets/api/useRemovePublicationTarget.ts
new file mode 100644
index 000000000..ea00a7b26
--- /dev/null
+++ b/src/features/publication-targets/api/useRemovePublicationTarget.ts
@@ -0,0 +1,31 @@
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+
+interface RemovePublicationTargetParams {
+  name: string;
+}
+
+export default function useRemovePublicationTarget() {
+  const authFetchDebArchive = useFetchDebArchive();
+  const queryClient = useQueryClient();
+
+  const removePublicationTargetQuery = useMutation<
+    AxiosResponse<void>,
+    AxiosError<ApiError>,
+    RemovePublicationTargetParams
+  >({
+    mutationKey: ["publication-targets", "remove"],
+    mutationFn: async ({ name }) => authFetchDebArchive.delete(name),
+    onSuccess: async () =>
+      Promise.all([
+        queryClient.invalidateQueries({ queryKey: ["publication-targets"] }),
+        queryClient.invalidateQueries({ queryKey: ["publications"] }),
+      ]),
+  });
+
+  return {
+    removePublicationTargetQuery,
+  };
+}
diff --git a/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.test.tsx b/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.test.tsx
new file mode 100644
index 000000000..b57f62fc9
--- /dev/null
+++ b/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.test.tsx
@@ -0,0 +1,129 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it, vi } from "vitest";
+import AddPublicationTargetForm from "./AddPublicationTargetForm";
+
+// TODO: Add tests for Swift target type when Swift form support is implemented.
+
+describe("AddPublicationTargetForm", () => {
+  const user = userEvent.setup();
+
+  it("renders all required S3 fields", () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    expect(screen.getByLabelText("Name")).toBeInTheDocument();
+    expect(screen.getByLabelText(/region/i)).toBeInTheDocument();
+    expect(screen.getByLabelText(/bucket name/i)).toBeInTheDocument();
+    expect(screen.getByLabelText(/aws access key id/i)).toBeInTheDocument();
+    expect(screen.getByLabelText(/aws secret access key/i)).toBeInTheDocument();
+  });
+
+  it("renders optional S3 fields", () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    expect(screen.getByLabelText(/endpoint/i)).toBeInTheDocument();
+    expect(screen.getByLabelText(/prefix/i)).toBeInTheDocument();
+    expect(screen.getByLabelText(/acl/i)).toBeInTheDocument();
+  });
+
+  it("renders the submit button", () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    expect(
+      screen.getByRole("button", { name: /add publication target/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("shows validation errors when required fields are empty on submit", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.click(
+      screen.getByRole("button", { name: /add publication target/i }),
+    );
+
+    expect(
+      await screen.findAllByText(/this field is required/i),
+    ).not.toHaveLength(0);
+  });
+
+  it("submits the form and shows success notification", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.type(screen.getByLabelText("Name"), "My New Target");
+    await user.type(screen.getByLabelText(/bucket name/i), "my-bucket");
+    await user.type(
+      screen.getByLabelText(/aws access key id/i),
+      "AKIAIOSFODNN7EXAMPLE",
+    );
+    await user.type(
+      screen.getByLabelText(/aws secret access key/i),
+      "wJalrXUtnFEMI/K7MDENG/bPxRfiCYEXAMPLEKEY",
+    );
+
+    await user.click(
+      screen.getByRole("button", { name: /add publication target/i }),
+    );
+
+    await vi.waitFor(() => {
+      expect(screen.getByText("Publication target created")).toBeInTheDocument();
+    });
+  });
+
+  it("includes optional fields in submission when all fields are provided", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.type(screen.getByLabelText("Name"), "Full Target");
+    await user.type(screen.getByLabelText(/region/i), "us-east-1");
+    await user.type(screen.getByLabelText(/bucket name/i), "my-bucket");
+    await user.type(screen.getByLabelText(/endpoint/i), "https://s3.example.com");
+    await user.type(
+      screen.getByLabelText(/aws access key id/i),
+      "AKIAIOSFODNN7EXAMPLE",
+    );
+    await user.type(
+      screen.getByLabelText(/aws secret access key/i),
+      "wJalrXUtnFEMI/K7MDENG/bPxRfiCYEXAMPLEKEY",
+    );
+    await user.type(screen.getByLabelText(/prefix/i), "ubuntu/");
+    await user.type(screen.getByLabelText(/^acl$/i), "private");
+    await user.type(screen.getByLabelText(/storage class/i), "STANDARD");
+    await user.type(screen.getByLabelText(/encryption method/i), "AES256");
+
+    await user.click(
+      screen.getByRole("button", { name: /add publication target/i }),
+    );
+
+    await vi.waitFor(() => {
+      expect(screen.getByText("Publication target created")).toBeInTheDocument();
+    });
+  });
+
+  it("toggles the disable_multi_del checkbox", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    const checkbox = screen.getByRole("checkbox", { name: /disable multidel/i });
+    expect(checkbox).not.toBeChecked();
+
+    await user.click(checkbox);
+    expect(checkbox).toBeChecked();
+
+    await user.click(checkbox);
+    expect(checkbox).not.toBeChecked();
+  });
+
+  it("toggles the force_sig_v2 checkbox", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    const checkbox = screen.getByRole("checkbox", {
+      name: /force aws sigv2/i,
+    });
+    expect(checkbox).not.toBeChecked();
+
+    await user.click(checkbox);
+    expect(checkbox).toBeChecked();
+
+    await user.click(checkbox);
+    expect(checkbox).not.toBeChecked();
+  });
+});
diff --git a/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.tsx b/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.tsx
new file mode 100644
index 000000000..d1c585b54
--- /dev/null
+++ b/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.tsx
@@ -0,0 +1,171 @@
+import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
+import useDebug from "@/hooks/useDebug";
+import usePageParams from "@/hooks/usePageParams";
+import { getFormikError } from "@/utils/formikErrors";
+import useCreatePublicationTarget from "../../api/useCreatePublicationTarget";
+import {
+  CheckboxInput,
+  Form,
+  Input,
+} from "@canonical/react-components";
+import { useFormik } from "formik";
+import type { FC } from "react";
+import * as Yup from "yup";
+import { INITIAL_VALUES } from "./constants";
+import type { AddPublicationTargetFormValues } from "./constants";
+import useNotify from "@/hooks/useNotify";
+
+const AddPublicationTargetForm: FC = () => {
+  const debug = useDebug();
+  const { createPageParamsSetter } = usePageParams();
+  const closeForm = createPageParamsSetter({ sidePath: [], name: "" });
+  const { notify } = useNotify();
+  const { createPublicationTargetQuery } = useCreatePublicationTarget();
+
+  const { mutateAsync } = createPublicationTargetQuery;
+
+  const formik = useFormik<AddPublicationTargetFormValues>({
+    initialValues: INITIAL_VALUES,
+    validationSchema: Yup.object().shape({
+      displayName: Yup.string().required("This field is required"),
+      bucket: Yup.string().required("This field is required"),
+      awsAccessKeyId: Yup.string().required("This field is required"),
+      awsSecretAccessKey: Yup.string().required("This field is required"),
+      region: Yup.string().required("This field is required"),
+      endpoint: Yup.string(),
+      prefix: Yup.string(),
+      acl: Yup.string(),
+      storageClass: Yup.string(),
+      encryptionMethod: Yup.string(),
+      disableMultiDel: Yup.boolean(),
+      forceSigV2: Yup.boolean(),
+    }),
+    onSubmit: async (values) => {
+      try {
+        await mutateAsync({
+          displayName: values.displayName,
+          s3: {
+            ...(values.region && { region: values.region }),
+            bucket: values.bucket,
+            awsAccessKeyId: values.awsAccessKeyId,
+            awsSecretAccessKey: values.awsSecretAccessKey,
+            ...(values.endpoint && { endpoint: values.endpoint }),
+            ...(values.prefix && { prefix: values.prefix }),
+            ...(values.acl && { acl: values.acl }),
+            ...(values.storageClass && { storageClass: values.storageClass }),
+            ...(values.encryptionMethod && {
+              encryptionMethod: values.encryptionMethod,
+            }),
+            disableMultiDel: values.disableMultiDel,
+            forceSigV2: values.forceSigV2,
+          },
+        });
+
+        closeForm();
+
+        notify.success({
+          title: "Publication target created",
+          message: `You have successfully added ${values.displayName}`,
+        });
+      } catch (error) {
+        debug(error);
+      }
+    },
+  });
+
+  return (
+    <Form onSubmit={formik.handleSubmit} noValidate>
+      <Input
+        type="text"
+        label="Name"
+        required
+        error={getFormikError(formik, "displayName")}
+        {...formik.getFieldProps("displayName")}
+      />
+      <Input
+        type="text"
+        label="Region"
+        required
+        error={getFormikError(formik, "region")}
+        {...formik.getFieldProps("region")}
+      />
+      <Input
+        type="text"
+        label="Bucket name"
+        required
+        error={getFormikError(formik, "bucket")}
+        {...formik.getFieldProps("bucket")}
+      />
+      <Input
+        type="text"
+        label="Endpoint"
+        error={getFormikError(formik, "endpoint")}
+        {...formik.getFieldProps("endpoint")}
+      />
+      <Input
+        type="text"
+        label="AWS access key ID"
+        required
+        error={getFormikError(formik, "awsAccessKeyId")}
+        {...formik.getFieldProps("awsAccessKeyId")}
+      />
+      <Input
+        type="text"
+        label="AWS secret access key"
+        required
+        error={getFormikError(formik, "awsSecretAccessKey")}
+        {...formik.getFieldProps("awsSecretAccessKey")}
+      />
+      <Input
+        type="text"
+        label="Prefix"
+        error={getFormikError(formik, "prefix")}
+        {...formik.getFieldProps("prefix")}
+      />
+      <Input
+        type="text"
+        label="ACL"
+        error={getFormikError(formik, "acl")}
+        {...formik.getFieldProps("acl")}
+      />
+      <Input
+        type="text"
+        label="Storage class"
+        error={getFormikError(formik, "storageClass")}
+        {...formik.getFieldProps("storageClass")}
+      />
+      <Input
+        type="text"
+        label="Encryption method"
+        error={getFormikError(formik, "encryptionMethod")}
+        {...formik.getFieldProps("encryptionMethod")}
+      />
+      <CheckboxInput
+        label="Disable MultiDel"
+        checked={formik.values.disableMultiDel}
+        onChange={(e) =>
+          formik.setFieldValue(
+            "disableMultiDel",
+            (e.target as HTMLInputElement).checked,
+          )
+        }
+      />
+      <CheckboxInput
+        label="Force AWS SIGv2 (disables SIGv4)"
+        checked={formik.values.forceSigV2}
+        onChange={(e) =>
+          formik.setFieldValue(
+            "forceSigV2",
+            (e.target as HTMLInputElement).checked,
+          )
+        }
+      />
+      <SidePanelFormButtons
+        submitButtonDisabled={formik.isSubmitting}
+        submitButtonText="Add publication target"
+      />
+    </Form>
+  );
+};
+
+export default AddPublicationTargetForm;
diff --git a/src/features/publication-targets/components/AddPublicationTargetForm/constants.ts b/src/features/publication-targets/components/AddPublicationTargetForm/constants.ts
new file mode 100644
index 000000000..7e53e2c7c
--- /dev/null
+++ b/src/features/publication-targets/components/AddPublicationTargetForm/constants.ts
@@ -0,0 +1,29 @@
+export interface AddPublicationTargetFormValues {
+  displayName: string;
+  region: string;
+  bucket: string;
+  endpoint: string;
+  awsAccessKeyId: string;
+  awsSecretAccessKey: string;
+  prefix: string;
+  acl: string;
+  storageClass: string;
+  encryptionMethod: string;
+  disableMultiDel: boolean;
+  forceSigV2: boolean;
+}
+
+export const INITIAL_VALUES: AddPublicationTargetFormValues = {
+  displayName: "",
+  region: "",
+  bucket: "",
+  endpoint: "",
+  awsAccessKeyId: "",
+  awsSecretAccessKey: "",
+  prefix: "",
+  acl: "",
+  storageClass: "",
+  encryptionMethod: "",
+  disableMultiDel: false,
+  forceSigV2: false,
+};
diff --git a/src/features/publication-targets/components/AddPublicationTargetForm/index.ts b/src/features/publication-targets/components/AddPublicationTargetForm/index.ts
new file mode 100644
index 000000000..944921f5f
--- /dev/null
+++ b/src/features/publication-targets/components/AddPublicationTargetForm/index.ts
@@ -0,0 +1 @@
+export { default as AddPublicationTargetForm } from "./AddPublicationTargetForm";
diff --git a/src/features/publication-targets/components/EditTargetForm/EditTargetForm.test.tsx b/src/features/publication-targets/components/EditTargetForm/EditTargetForm.test.tsx
new file mode 100644
index 000000000..298bf57ae
--- /dev/null
+++ b/src/features/publication-targets/components/EditTargetForm/EditTargetForm.test.tsx
@@ -0,0 +1,158 @@
+import { publicationTargets } from "@/tests/mocks/publicationTargets";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it } from "vitest";
+import EditTargetForm from "./EditTargetForm";
+import type { PublicationTarget } from "@canonical/landscape-openapi";
+
+// TODO: add coverage for other target types (swift and filesystem) once those are supported
+
+// S3 targets from mocks. publicationTargets[0] has all optional S3 fields;
+// publicationTargets[1] has minimal optional fields. Both are S3-only in this version.
+const [s3TargetFull, s3TargetMinimal] = publicationTargets;
+
+if (!s3TargetFull?.s3 || !s3TargetMinimal?.s3) {
+  throw new Error("Test targets must have S3 config");
+}
+
+const s3Full = s3TargetFull.s3;
+
+describe("EditTargetForm", () => {
+  const user = userEvent.setup();
+
+  it("pre-populates the display_name field from the target prop", () => {
+    renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+
+    expect(screen.getByLabelText("Name")).toHaveValue(s3TargetFull.displayName);
+  });
+
+  it("pre-populates S3 fields from the target prop", () => {
+    renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+
+    expect(screen.getByText(s3Full.bucket)).toBeInTheDocument();
+    expect(screen.getByLabelText(/aws access key id/i)).toHaveValue(
+      s3Full.awsAccessKeyId,
+    );
+    expect(screen.getByText(s3Full.region)).toBeInTheDocument();
+  });
+
+  it("pre-populates optional S3 fields when present", () => {
+    renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+
+    expect(screen.getByText(s3Full.prefix ?? "")).toBeInTheDocument();
+    expect(screen.getByLabelText(/^acl$/i)).toHaveValue(s3Full.acl);
+    expect(screen.getByLabelText(/storage class/i)).toHaveValue(
+      s3Full.storageClass,
+    );
+    expect(screen.getByLabelText(/encryption method/i)).toHaveValue(
+      s3Full.encryptionMethod,
+    );
+  });
+
+  it("pre-populates with empty strings when optional S3 fields are missing", () => {
+    renderWithProviders(<EditTargetForm target={s3TargetMinimal} />);
+
+    expect(screen.getByLabelText(/^acl$/i)).toHaveValue("");
+    expect(screen.getByLabelText(/storage class/i)).toHaveValue("");
+    expect(screen.getByLabelText(/encryption method/i)).toHaveValue("");
+  });
+
+  it("pre-populates all S3 fields with empty strings when target has no S3 config", () => {
+    const targetWithoutS3 = {
+      name: "publicationTargets/no-s3",
+      publicationTargetId: "no-s3",
+      displayName: "Target without S3",
+    };
+
+    renderWithProviders(<EditTargetForm target={targetWithoutS3} />);
+
+    expect(screen.getByLabelText("Name")).toHaveValue("Target without S3");
+    expect(screen.getByLabelText(/aws access key id/i)).toHaveValue("");
+    expect(screen.getByLabelText(/aws secret access key/i)).toHaveValue("");
+    expect(screen.getByLabelText(/^acl$/i)).toHaveValue("");
+    expect(screen.getByLabelText(/storage class/i)).toHaveValue("");
+    expect(screen.getByLabelText(/encryption method/i)).toHaveValue("");
+  });
+
+  it("pre-populates with mixed null/undefined optional S3 fields", () => {
+    const s3TargetPartiallyNull = {
+      name: "publicationTargets/partial",
+      publicationTargetId: "partial",
+      displayName: "Partially null",
+      s3: {
+        bucket: "my-bucket",
+        awsAccessKeyId: "key",
+        awsSecretAccessKey: "secret",
+        region: "region",
+        endpoint: undefined,
+        prefix: undefined,
+        acl: "private",
+        storageClass: undefined,
+        encryptionMethod: undefined,
+      },
+    } as PublicationTarget;
+
+    renderWithProviders(<EditTargetForm target={s3TargetPartiallyNull} />);
+
+    expect(screen.getByLabelText(/^acl$/i)).toHaveValue("private");
+    expect(screen.getByLabelText(/storage class/i)).toHaveValue("");
+    expect(screen.getByLabelText(/encryption method/i)).toHaveValue("");
+  });
+
+  it("renders the save button", () => {
+    renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+
+    expect(
+      screen.getByRole("button", { name: /save/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("submits the form with all optional fields and shows success notification", async () => {
+    renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+
+    await user.click(screen.getByRole("button", { name: /save/i }));
+
+    expect(
+      await screen.findByText(/publication target edited/i),
+    ).toBeInTheDocument();
+  });
+
+  it("submits the form with empty optional fields and shows success notification", async () => {
+    renderWithProviders(<EditTargetForm target={s3TargetMinimal} />);
+
+    await user.click(screen.getByRole("button", { name: /save/i }));
+
+    expect(
+      await screen.findByText(/publication target edited/i),
+    ).toBeInTheDocument();
+  });
+
+  it("toggles the disable_multi_del checkbox", async () => {
+    renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+
+    const checkbox = screen.getByRole("checkbox", { name: /disable multidel/i });
+    expect(checkbox).not.toBeChecked();
+
+    await user.click(checkbox);
+    expect(checkbox).toBeChecked();
+
+    await user.click(checkbox);
+    expect(checkbox).not.toBeChecked();
+  });
+
+  it("toggles the force_sig_v2 checkbox", async () => {
+    renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+
+    const checkbox = screen.getByRole("checkbox", {
+      name: /force aws sigv2/i,
+    });
+    expect(checkbox).not.toBeChecked();
+
+    await user.click(checkbox);
+    expect(checkbox).toBeChecked();
+
+    await user.click(checkbox);
+    expect(checkbox).not.toBeChecked();
+  });
+});
diff --git a/src/features/publication-targets/components/EditTargetForm/EditTargetForm.tsx b/src/features/publication-targets/components/EditTargetForm/EditTargetForm.tsx
new file mode 100644
index 000000000..4c072c609
--- /dev/null
+++ b/src/features/publication-targets/components/EditTargetForm/EditTargetForm.tsx
@@ -0,0 +1,213 @@
+import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
+import useDebug from "@/hooks/useDebug";
+import usePageParams from "@/hooks/usePageParams";
+import { getFormikError } from "@/utils/formikErrors";
+import useEditPublicationTarget from "../../api/useEditPublicationTarget";
+import {
+  CheckboxInput,
+  Form,
+  Input,
+} from "@canonical/react-components";
+import { useFormik } from "formik";
+import type { FC } from "react";
+import * as Yup from "yup";
+import type { PublicationTarget } from "@canonical/landscape-openapi";
+import ReadOnlyField from "@/components/form/ReadOnlyField";
+import useNotify from "@/hooks/useNotify";
+
+interface EditTargetFormProps {
+  readonly target: PublicationTarget;
+}
+
+const VALIDATION_SCHEMA = Yup.object().shape({
+  displayName: Yup.string().required("This field is required"),
+  bucket: Yup.string().required("This field is required"),
+  awsAccessKeyId: Yup.string().required("This field is required"),
+  awsSecretAccessKey: Yup.string().required("This field is required"),
+  region: Yup.string().required("This field is required"),
+  endpoint: Yup.string(),
+  prefix: Yup.string(),
+  acl: Yup.string(),
+  storageClass: Yup.string(),
+  encryptionMethod: Yup.string(),
+  disableMultiDel: Yup.boolean(),
+  forceSigV2: Yup.boolean(),
+});
+
+const getS3InitialValues = (s3: PublicationTarget["s3"] | undefined) => {
+  if (!s3) {
+    return {
+      region: "",
+      bucket: "",
+      endpoint: "",
+      awsAccessKeyId: "",
+      awsSecretAccessKey: "",
+      prefix: "",
+      acl: "",
+      storageClass: "",
+      encryptionMethod: "",
+      disableMultiDel: false,
+      forceSigV2: false,
+    };
+  }
+  return {
+    region: s3.region ?? "",
+    bucket: s3.bucket,
+    endpoint: s3.endpoint ?? "",
+    awsAccessKeyId: s3.awsAccessKeyId,
+    awsSecretAccessKey: s3.awsSecretAccessKey,
+    prefix: s3.prefix ?? "",
+    acl: s3.acl ?? "",
+    storageClass: s3.storageClass ?? "",
+    encryptionMethod: s3.encryptionMethod ?? "",
+    disableMultiDel: s3.disableMultiDel ?? false,
+    forceSigV2: s3.forceSigV2 ?? false,
+  };
+};
+
+const getInitialValues = (target: PublicationTarget) => ({
+  displayName: target.displayName ?? "",
+  ...getS3InitialValues(target.s3),
+});
+
+const EditTargetForm: FC<EditTargetFormProps> = ({ target }) => {
+  const debug = useDebug();
+  const { createPageParamsSetter, popSidePath, sidePath } = usePageParams();
+  const closeForm = createPageParamsSetter({ sidePath: [], name: "" });
+  const { notify } = useNotify();
+  const { editPublicationTargetQuery } = useEditPublicationTarget();
+  const { mutateAsync: editTarget } = editPublicationTargetQuery;
+
+  const handleSubmit = async (values: ReturnType<typeof getInitialValues>) => {
+    try {
+      await editTarget({
+        name: target.name,
+        displayName: values.displayName,
+        s3: {
+          ...(values.region && { region: values.region }),
+          bucket: values.bucket,
+          awsAccessKeyId: values.awsAccessKeyId,
+          awsSecretAccessKey: values.awsSecretAccessKey,
+          ...(values.endpoint && { endpoint: values.endpoint }),
+          ...(values.prefix && { prefix: values.prefix }),
+          ...(values.acl && { acl: values.acl }),
+          ...(values.storageClass && { storageClass: values.storageClass }),
+          ...(values.encryptionMethod && {
+            encryptionMethod: values.encryptionMethod,
+          }),
+          disableMultiDel: values.disableMultiDel,
+          forceSigV2: values.forceSigV2,
+        },
+      });
+      closeForm();
+
+      notify.success({
+        title: "Publication target edited",
+        message: `You have successfully edited ${values.displayName}`,
+      });
+    } catch (error) {
+      debug(error);
+    }
+  };
+
+  const formik = useFormik({
+    initialValues: getInitialValues(target),
+    validationSchema: VALIDATION_SCHEMA,
+    onSubmit: handleSubmit,
+  });
+
+  return (
+    <Form onSubmit={formik.handleSubmit} noValidate>
+      <Input
+        type="text"
+        label="Name"
+        required
+        error={getFormikError(formik, "displayName")}
+        {...formik.getFieldProps("displayName")}
+      />
+      <ReadOnlyField
+        label="Region"
+        required
+        tooltipMessage="The region cannot be changed after the target has been created. To use a different region, create a new publication target."
+        {...formik.getFieldProps("region")}
+      />
+      <ReadOnlyField
+        label="Bucket name"
+        required
+        tooltipMessage="The bucket name cannot be changed after the target has been created. To use a different bucket, create a new publication target."
+        {...formik.getFieldProps("bucket")}
+      />
+      <ReadOnlyField
+        label="Endpoint"
+        tooltipMessage="The endpoint cannot be changed after the target has been created. To use a different endpoint, create a new publication target."
+        {...formik.getFieldProps("endpoint")}
+      />
+      <Input
+        type="text"
+        label="AWS access key ID"
+        required
+        error={getFormikError(formik, "awsAccessKeyId")}
+        {...formik.getFieldProps("awsAccessKeyId")}
+      />
+      <Input
+        type="text"
+        label="AWS secret access key"
+        required
+        error={getFormikError(formik, "awsSecretAccessKey")}
+        {...formik.getFieldProps("awsSecretAccessKey")}
+      />
+      <ReadOnlyField
+        label="Prefix"
+        tooltipMessage="The prefix cannot be changed after the target has been created. To use a different prefix, create a new publication target."
+        {...formik.getFieldProps("prefix")}
+      />
+      <Input
+        type="text"
+        label="ACL"
+        error={getFormikError(formik, "acl")}
+        {...formik.getFieldProps("acl")}
+      />
+      <Input
+        type="text"
+        label="Storage class"
+        error={getFormikError(formik, "storageClass")}
+        {...formik.getFieldProps("storageClass")}
+      />
+      <Input
+        type="text"
+        label="Encryption method"
+        error={getFormikError(formik, "encryptionMethod")}
+        {...formik.getFieldProps("encryptionMethod")}
+      />
+      <CheckboxInput
+        label="Disable MultiDel"
+        checked={formik.values.disableMultiDel}
+        onChange={(e) =>
+          formik.setFieldValue(
+            "disableMultiDel",
+            (e.target as HTMLInputElement).checked,
+          )
+        }
+      />
+      <CheckboxInput
+        label="Force AWS SIGv2 (disables SIGv4)"
+        checked={formik.values.forceSigV2}
+        onChange={(e) =>
+          formik.setFieldValue(
+            "forceSigV2",
+            (e.target as HTMLInputElement).checked,
+          )
+        }
+      />
+      <SidePanelFormButtons
+        submitButtonDisabled={formik.isSubmitting}
+        submitButtonText="Save changes"
+        onCancel={closeForm}
+        hasBackButton={sidePath.length > 1}
+        onBackButtonPress={popSidePath}
+      />
+    </Form>
+  );
+};
+
+export default EditTargetForm;
diff --git a/src/features/publication-targets/components/EditTargetForm/index.ts b/src/features/publication-targets/components/EditTargetForm/index.ts
new file mode 100644
index 000000000..e972bf9e3
--- /dev/null
+++ b/src/features/publication-targets/components/EditTargetForm/index.ts
@@ -0,0 +1 @@
+export { default } from "./EditTargetForm";
diff --git a/src/features/publication-targets/components/PublicationTargetAddButton/PublicationTargetAddButton.test.tsx b/src/features/publication-targets/components/PublicationTargetAddButton/PublicationTargetAddButton.test.tsx
new file mode 100644
index 000000000..cc96d3489
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationTargetAddButton/PublicationTargetAddButton.test.tsx
@@ -0,0 +1,38 @@
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { useLocation } from "react-router";
+import { describe, expect, it } from "vitest";
+import PublicationTargetAddButton from "./PublicationTargetAddButton";
+
+const LocationDisplay = () => {
+  const { search } = useLocation();
+  return <div data-testid="location">{search}</div>;
+};
+
+describe("PublicationTargetAddButton", () => {
+  const user = userEvent.setup();
+
+  it("renders the Add publication target button", () => {
+    renderWithProviders(<PublicationTargetAddButton />);
+
+    expect(
+      screen.getByRole("button", { name: /add publication target/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("sets sidePath=add in the URL when clicked", async () => {
+    renderWithProviders(
+      <>
+        <PublicationTargetAddButton />
+        <LocationDisplay />
+      </>,
+    );
+
+    await user.click(
+      screen.getByRole("button", { name: /add publication target/i }),
+    );
+
+    expect(screen.getByTestId("location").textContent).toContain("sidePath=add");
+  });
+});
diff --git a/src/features/publication-targets/components/PublicationTargetAddButton/PublicationTargetAddButton.tsx b/src/features/publication-targets/components/PublicationTargetAddButton/PublicationTargetAddButton.tsx
new file mode 100644
index 000000000..1f4098639
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationTargetAddButton/PublicationTargetAddButton.tsx
@@ -0,0 +1,18 @@
+import usePageParams from "@/hooks/usePageParams";
+import { Button, Icon } from "@canonical/react-components";
+import type { FC } from "react";
+
+const PublicationTargetAddButton: FC = () => {
+  const { createPageParamsSetter } = usePageParams();
+
+  const handleAdd = createPageParamsSetter({ sidePath: ["add"], name: "" });
+
+  return (
+    <Button appearance="positive" hasIcon onClick={handleAdd} type="button">
+      <Icon name="plus" light={true} />
+      <span>Add publication target</span>
+    </Button>
+  );
+};
+
+export default PublicationTargetAddButton;
diff --git a/src/features/publication-targets/components/PublicationTargetAddButton/index.ts b/src/features/publication-targets/components/PublicationTargetAddButton/index.ts
new file mode 100644
index 000000000..9287c3c12
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationTargetAddButton/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublicationTargetAddButton";
diff --git a/src/features/publication-targets/components/PublicationTargetContainer/PublicationTargetContainer.test.tsx b/src/features/publication-targets/components/PublicationTargetContainer/PublicationTargetContainer.test.tsx
new file mode 100644
index 000000000..23373061a
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationTargetContainer/PublicationTargetContainer.test.tsx
@@ -0,0 +1,66 @@
+import { API_URL_DEB_ARCHIVE } from "@/constants";
+import { expectLoadingState } from "@/tests/helpers";
+import server from "@/tests/server";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import { http, HttpResponse } from "msw";
+import { describe, expect, it, vi } from "vitest";
+import PublicationTargetContainer from "./PublicationTargetContainer";
+
+vi.mock("../../api/useGetPublicationsByTarget", () => ({
+  default: vi.fn(() => ({ publications: [], isGettingPublications: false })),
+}));
+
+describe("PublicationTargetContainer", () => {
+  it("renders the loading state while fetching", async () => {
+    renderWithProviders(<PublicationTargetContainer />);
+
+    await expectLoadingState();
+  });
+
+  it("renders the empty state when there are no targets", async () => {
+    server.use(
+      http.get(`${API_URL_DEB_ARCHIVE}v1/publicationTargets`, () =>
+        HttpResponse.json({ publicationTargets: [] }),
+      ),
+    );
+
+    renderWithProviders(<PublicationTargetContainer />);
+    await expectLoadingState();
+
+    expect(
+      screen.getByText(/you don't have any publication targets yet/i),
+    ).toBeInTheDocument();
+  });
+
+  it("renders the Add publication target CTA button in the empty state", async () => {
+    server.use(
+      http.get(`${API_URL_DEB_ARCHIVE}v1/publicationTargets`, () =>
+        HttpResponse.json({ publicationTargets: [] }),
+      ),
+    );
+
+    renderWithProviders(<PublicationTargetContainer />);
+    await expectLoadingState();
+
+    expect(
+      screen.getByRole("button", { name: /add publication target/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("renders the publication targets list when targets are present", async () => {
+    renderWithProviders(<PublicationTargetContainer />);
+    await expectLoadingState();
+
+    expect(screen.getByRole("table")).toBeInTheDocument();
+  });
+
+  it("does not render the empty state when targets are present", async () => {
+    renderWithProviders(<PublicationTargetContainer />);
+    await expectLoadingState();
+
+    expect(
+      screen.queryByText(/you don't have any publication targets yet/i),
+    ).not.toBeInTheDocument();
+  });
+});
diff --git a/src/features/publication-targets/components/PublicationTargetContainer/PublicationTargetContainer.tsx b/src/features/publication-targets/components/PublicationTargetContainer/PublicationTargetContainer.tsx
new file mode 100644
index 000000000..6c1834c65
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationTargetContainer/PublicationTargetContainer.tsx
@@ -0,0 +1,43 @@
+import EmptyState from "@/components/layout/EmptyState";
+import LoadingState from "@/components/layout/LoadingState";
+import type { FC } from "react";
+import useGetPublicationTargets from "../../api/useGetPublicationTargets";
+import PublicationTargetAddButton from "../PublicationTargetAddButton";
+import PublicationTargetList from "../PublicationTargetList";
+
+const PublicationTargetContainer: FC = () => {
+  const { publicationTargets, isGettingPublicationTargets } =
+    useGetPublicationTargets();
+
+  if (isGettingPublicationTargets) {
+    return <LoadingState />;
+  }
+
+  if (publicationTargets.length === 0) {
+    return (
+      <EmptyState
+        title="You don't have any publication targets yet"
+        // icon="connected"
+        body={
+          <>
+            <p className="u-no-margin--bottom">
+              On this page you will find all publication targets that you create to publish mirrors to.
+            </p>
+            <a
+              href="https://documentation.ubuntu.com/landscape/explanation/features/repository-mirroring"
+              target="_blank"
+              rel="nofollow noopener noreferrer"
+            >
+              Learn more about repository mirroring
+            </a>
+          </>
+        }
+        cta={[<PublicationTargetAddButton key="add" />]}
+      />
+    );
+  }
+
+  return <PublicationTargetList targets={publicationTargets} />;
+};
+
+export default PublicationTargetContainer;
diff --git a/src/features/publication-targets/components/PublicationTargetContainer/index.ts b/src/features/publication-targets/components/PublicationTargetContainer/index.ts
new file mode 100644
index 000000000..36cba46e6
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationTargetContainer/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublicationTargetContainer";
diff --git a/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.integration.test.tsx b/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.integration.test.tsx
new file mode 100644
index 000000000..7db93b120
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.integration.test.tsx
@@ -0,0 +1,15 @@
+import { publicationTargets } from "@/tests/mocks/publicationTargets";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import { describe, expect, it } from "vitest";
+import PublicationTargetList from "./PublicationTargetList";
+
+describe("PublicationTargetList (integration)", () => {
+  it("fetches and displays the publications count via useGetPublicationsByTarget", async () => {
+    renderWithProviders(
+      <PublicationTargetList targets={publicationTargets} />,
+    );
+
+    expect(await screen.findByRole("link", { name: /publications/i })).toBeInTheDocument();
+  });
+});
diff --git a/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.test.tsx b/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.test.tsx
new file mode 100644
index 000000000..33921d850
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.test.tsx
@@ -0,0 +1,205 @@
+import { NO_DATA_TEXT } from "@/components/layout/NoData";
+import type { PublicationTarget } from "@/features/publication-targets";
+import { publicationTargets } from "@/tests/mocks/publicationTargets";
+import { publications } from "@/tests/mocks/publications";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import type { Mock } from "vitest";
+import { describe, expect, it, vi, beforeEach } from "vitest";
+import PublicationTargetList from "./PublicationTargetList";
+
+vi.mock("../../api/useGetPublicationsByTarget", () => ({
+  default: vi.fn(),
+}));
+
+import useGetPublicationsByTarget from "../../api/useGetPublicationsByTarget";
+
+describe("PublicationTargetList", () => {
+  beforeEach(() => {
+    // Default: prod-s3-us-east has 3 publications, others have 0
+    (useGetPublicationsByTarget as Mock).mockImplementation(
+      (publicationTargetId: string | undefined) => {
+        if (
+          publicationTargetId ===
+          "aaaaaaaa-0000-0000-0000-000000000001"
+        ) {
+          return { publications, isGettingPublications: false };
+        }
+
+        return { publications: [], isGettingPublications: false };
+      },
+    );
+  });
+
+  it("renders table headers", () => {
+    renderWithProviders(
+      <PublicationTargetList targets={publicationTargets} />,
+    );
+
+    expect(screen.getByRole("table")).toHaveTexts([
+      "Name",
+      "Type",
+      "Publications",
+    ]);
+  });
+
+  it("renders the displayName for each target", () => {
+    renderWithProviders(
+      <PublicationTargetList targets={publicationTargets} />,
+    );
+
+    expect(screen.getByText("prod-s3-us-east")).toBeInTheDocument();
+    expect(screen.getByText("staging-s3-eu-west")).toBeInTheDocument();
+    expect(screen.getByText("swift-internal")).toBeInTheDocument();
+  });
+
+  it("renders S3 type label for S3 targets", () => {
+    renderWithProviders(
+      <PublicationTargetList targets={publicationTargets} />,
+    );
+
+    // Two S3 targets: prod-s3-us-east and staging-s3-eu-west
+    expect(screen.getAllByText("S3")).toHaveLength(2);
+  });
+
+  it("renders Swift type label for Swift targets", () => {
+    renderWithProviders(
+      <PublicationTargetList targets={publicationTargets} />,
+    );
+
+    expect(screen.getByText("Swift")).toBeInTheDocument();
+  });
+
+  it("renders the publication count for a target with publications", () => {
+    renderWithProviders(
+      <PublicationTargetList targets={publicationTargets} />,
+    );
+
+    // prod-s3-us-east has 3 publications
+    expect(screen.getByText("3 publications")).toBeInTheDocument();
+  });
+
+  it("renders NoData placeholder when a target has no publications", () => {
+    renderWithProviders(
+      <PublicationTargetList targets={publicationTargets} />,
+    );
+
+    // staging-s3-eu-west and swift-internal each have 0 publications → two NoData cells
+    expect(screen.getAllByText(NO_DATA_TEXT)).toHaveLength(2);
+  });
+
+  it("renders singular 'publication' when a target has exactly one publication", () => {
+    (useGetPublicationsByTarget as Mock).mockReturnValue({
+      publications: [publications[0]],
+      isGettingPublications: false,
+    });
+
+    const [firstTarget] = publicationTargets;
+    if (!firstTarget) throw new Error("Missing mock target");
+    const singleTarget: PublicationTarget[] = [firstTarget];
+
+    renderWithProviders(<PublicationTargetList targets={singleTarget} />);
+
+    expect(screen.getByText("1 publication")).toBeInTheDocument();
+  });
+
+  it("renders table correctly with empty targets array", () => {
+    renderWithProviders(<PublicationTargetList targets={[]} />);
+
+    // Table should still render with headers but no data rows
+    expect(screen.getByRole("table")).toBeInTheDocument();
+    expect(screen.getByRole("table")).toHaveTexts([
+      "Name",
+      "Type",
+      "Publications",
+    ]);
+  });
+
+  it("renders PublicationTargetListActions component in actions column", () => {
+    renderWithProviders(
+      <PublicationTargetList targets={publicationTargets} />,
+    );
+
+    // Each target should have an actions button with aria-label like "{displayName} actions"
+    publicationTargets.forEach((target) => {
+      const actionButton = screen.getByRole("button", {
+        name: `${target.displayName} actions`,
+      });
+      expect(actionButton).toBeInTheDocument();
+    });
+  });
+
+  it("renders 'Unknown' type when target has neither S3 nor Swift", () => {
+    (useGetPublicationsByTarget as Mock).mockReturnValue({
+      publications: [],
+      isGettingPublications: false,
+    });
+
+    const unknownTarget: PublicationTarget = {
+      name: "publicationTargets/dddddddd-0000-0000-0000-000000000004",
+      publicationTargetId: "dddddddd-0000-0000-0000-000000000004",
+      displayName: "unknown-target",
+    };
+
+    renderWithProviders(<PublicationTargetList targets={[unknownTarget]} />);
+
+    expect(screen.getByText("Unknown")).toBeInTheDocument();
+  });
+
+  it("renders NoData placeholder in Name cell when target has no displayName", () => {
+    (useGetPublicationsByTarget as Mock).mockReturnValue({
+      publications: [],
+      isGettingPublications: false,
+    });
+
+    const noNameTarget: PublicationTarget = {
+      name: "publicationTargets/eeeeeeee-0000-0000-0000-000000000005",
+      publicationTargetId: "eeeeeeee-0000-0000-0000-000000000005",
+      displayName: "",
+      s3: {
+        region: "us-east-1",
+        bucket: "test-bucket",
+        disableMultiDel: false,
+        forceSigV2: false,
+        awsAccessKeyId: "AKIA...",
+        awsSecretAccessKey: "SECRET...",
+      },
+    };
+
+    renderWithProviders(<PublicationTargetList targets={[noNameTarget]} />);
+
+    // Name cell and Publications cell both show NoData — there are two instances
+    expect(screen.getAllByText(NO_DATA_TEXT).length).toBeGreaterThanOrEqual(1);
+    // Verify the Name column in particular is NoData by checking the first cell in the row
+    const cells = screen.getAllByRole("cell");
+    expect(cells[0]).toHaveTextContent(NO_DATA_TEXT);
+  });
+
+  it("renders the publications count as a link filtered by publicationTargetId", () => {
+    renderWithProviders(
+      <PublicationTargetList targets={publicationTargets} />,
+    );
+
+    const link = screen.getByRole("link", { name: "3 publications" });
+    expect(link).toHaveAttribute(
+      "href",
+      `/repositories/publications?query=${encodeURIComponent("publicationTargetId:aaaaaaaa-0000-0000-0000-000000000001")}`,
+    );
+  });
+
+  it("renders spinner while publications count is loading", () => {
+    (useGetPublicationsByTarget as Mock).mockReturnValue({
+      publications: [],
+      isGettingPublications: true,
+    });
+
+    const [firstTarget] = publicationTargets;
+    if (!firstTarget) throw new Error("Missing mock target");
+
+    renderWithProviders(<PublicationTargetList targets={[firstTarget]} />);
+
+    // aria-hidden spinner icon is rendered while loading
+    const spinner = document.querySelector(".u-animation--spin");
+    expect(spinner).toBeInTheDocument();
+  });
+});
diff --git a/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.tsx b/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.tsx
new file mode 100644
index 000000000..e3db127fe
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.tsx
@@ -0,0 +1,125 @@
+import { LIST_ACTIONS_COLUMN_PROPS } from "@/components/layout/ListActions";
+import NoData, { NO_DATA_TEXT } from "@/components/layout/NoData";
+import ResponsiveTable from "@/components/layout/ResponsiveTable";
+import { TablePagination } from "@/components/layout/TablePagination";
+import usePageParams from "@/hooks/usePageParams";
+import useGetPublicationsByTarget from "../../api/useGetPublicationsByTarget";
+import { Button, Icon } from "@canonical/react-components";
+import type { FC, ReactElement } from "react";
+import { useMemo } from "react";
+import type { CellProps, Column } from "react-table";
+import type { PublicationTarget } from "@canonical/landscape-openapi";
+import PublicationTargetListActions from "../PublicationTargetListActions";
+import StaticLink from "@/components/layout/StaticLink";
+import { ROUTES } from "@/libs/routes";
+import { pluralizeNew } from "@/utils/_helpers";
+
+interface PublicationTargetListProps {
+  readonly targets: PublicationTarget[];
+}
+
+interface PublicationsCountCellProps {
+  readonly publicationTargetId: string;
+}
+
+const PublicationsCountCell: FC<PublicationsCountCellProps> = ({
+  publicationTargetId,
+}) => {
+  const { publications, isGettingPublications } =
+    useGetPublicationsByTarget(publicationTargetId);
+
+  if (isGettingPublications) {
+    return <Icon name="spinner" className="u-animation--spin" aria-hidden />;
+  }
+
+  const { length } = publications;
+  if (length === 0) return <NoData />;
+  return (
+    <StaticLink
+      to={{
+        pathname: ROUTES.repositories.publications(),
+        search: `?query=${encodeURIComponent(`publicationTargetId:${publicationTargetId}`)}`,
+      }}
+    >
+      {pluralizeNew(publications.length, "publication", {
+        showCount: "exact",
+      })}
+    </StaticLink>
+  );
+};
+
+const getTargetType = (target: PublicationTarget): string => {
+  if (target.s3) return "S3";
+  if (target.swift) return "Swift";
+  return "Unknown";
+};
+
+const PublicationTargetList: FC<PublicationTargetListProps> = ({ targets }) => {
+  const { currentPage, pageSize, createPageParamsSetter } = usePageParams();
+
+  const pagedTargets = useMemo(
+    () => targets.slice((currentPage - 1) * pageSize, currentPage * pageSize),
+    [targets, currentPage, pageSize],
+  );
+
+  const columns = useMemo<Column<PublicationTarget>[]>(
+    () => [
+        {
+          accessor: "displayName",
+          id: "displayName",
+          Header: "Name",
+          Cell: ({ row }: CellProps<PublicationTarget>) => (
+            <Button
+              type="button"
+              appearance="link"
+              className="u-no-margin--bottom u-no-padding--top u-align-text--left"
+              onClick={createPageParamsSetter({ sidePath: ["view"], name: row.original.publicationTargetId ?? "" })}
+              aria-label={`View details for ${row.original.displayName}`}
+            >
+              {row.original.displayName || NO_DATA_TEXT}
+            </Button>
+          ),
+        },
+      {
+        accessor: (row) => getTargetType(row),
+        id: "type",
+        Header: "Type",
+      },
+      {
+        accessor: "publicationTargetId",
+        id: "publications",
+        Header: "Publications",
+        Cell: ({ row }: CellProps<PublicationTarget>): ReactElement => (
+          <PublicationsCountCell
+            publicationTargetId={row.original.publicationTargetId ?? ""}
+          />
+        ),
+      },
+      {
+        ...LIST_ACTIONS_COLUMN_PROPS,
+        Cell: ({
+          row: { original },
+        }: CellProps<PublicationTarget>): ReactElement => (
+          <PublicationTargetListActions target={original} />
+        ),
+      } as Column<PublicationTarget>,
+      ],
+    [createPageParamsSetter],
+  );
+
+  return (
+    <>
+      <ResponsiveTable
+        columns={columns as Column<Record<string, unknown>>[]}
+        data={pagedTargets as unknown as Record<string, unknown>[]}
+        minWidth={800}
+      />
+      <TablePagination
+        totalItems={targets.length}
+        currentItemCount={pagedTargets.length}
+      />
+    </>
+  );
+};
+
+export default PublicationTargetList;
diff --git a/src/features/publication-targets/components/PublicationTargetList/index.ts b/src/features/publication-targets/components/PublicationTargetList/index.ts
new file mode 100644
index 000000000..bf11b951f
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationTargetList/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublicationTargetList";
diff --git a/src/features/publication-targets/components/PublicationTargetListActions/PublicationTargetListActions.test.tsx b/src/features/publication-targets/components/PublicationTargetListActions/PublicationTargetListActions.test.tsx
new file mode 100644
index 000000000..77daee4f1
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationTargetListActions/PublicationTargetListActions.test.tsx
@@ -0,0 +1,181 @@
+import { publicationTargets } from "@/tests/mocks/publicationTargets";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import type { Mock } from "vitest";
+import { describe, expect, it, vi } from "vitest";
+import { useLocation } from "react-router";
+import PublicationTargetListActions from "./PublicationTargetListActions";
+
+vi.mock("../../api/useGetPublicationsByTarget", () => ({
+  default: vi.fn(),
+}));
+
+vi.mock("../../api/useRemovePublicationTarget", () => ({
+  default: vi.fn(() => ({
+    removePublicationTargetQuery: {
+      mutateAsync: vi.fn(),
+      isPending: false,
+    },
+  })),
+}));
+
+import useGetPublicationsByTarget from "../../api/useGetPublicationsByTarget";
+
+const LocationDisplay = () => {
+  const { search } = useLocation();
+  return <div data-testid="location">{search}</div>;
+};
+
+const targetWithDisplayName = publicationTargets[0]!;
+
+describe("PublicationTargetListActions", () => {
+  const user = userEvent.setup();
+
+  it("renders the actions toggle button with display_name", () => {
+    (useGetPublicationsByTarget as Mock).mockReturnValue({
+      publications: [],
+      isGettingPublications: false,
+    });
+
+    renderWithProviders(
+      <>
+        <PublicationTargetListActions target={targetWithDisplayName} />
+        <LocationDisplay />
+      </>,
+    );
+
+    expect(
+      screen.getByRole("button", {
+        name: `${targetWithDisplayName.displayName} actions`,
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it("shows View details, Edit, and Remove actions in the dropdown", async () => {
+    (useGetPublicationsByTarget as Mock).mockReturnValue({
+      publications: [],
+      isGettingPublications: false,
+    });
+
+    renderWithProviders(
+      <>
+        <PublicationTargetListActions target={targetWithDisplayName} />
+        <LocationDisplay />
+      </>,
+    );
+
+    await user.click(
+      screen.getByRole("button", {
+        name: `${targetWithDisplayName.displayName} actions`,
+      }),
+    );
+
+    expect(
+      await screen.findByRole("menuitem", {
+        name: `View details for ${targetWithDisplayName.displayName}`,
+      }),
+    ).toBeInTheDocument();
+    expect(
+      await screen.findByRole("menuitem", {
+        name: `Edit ${targetWithDisplayName.displayName}`,
+      }),
+    ).toBeInTheDocument();
+    expect(
+      await screen.findByRole("menuitem", {
+        name: `Remove ${targetWithDisplayName.displayName}`,
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it("sets sidePath=view and name in URL when View details is clicked", async () => {
+    (useGetPublicationsByTarget as Mock).mockReturnValue({
+      publications: [],
+      isGettingPublications: false,
+    });
+
+    renderWithProviders(
+      <>
+        <PublicationTargetListActions target={targetWithDisplayName} />
+        <LocationDisplay />
+      </>,
+    );
+
+    await user.click(
+      screen.getByRole("button", {
+        name: `${targetWithDisplayName.displayName} actions`,
+      }),
+    );
+    await user.click(
+      await screen.findByRole("menuitem", {
+        name: `View details for ${targetWithDisplayName.displayName}`,
+      }),
+    );
+
+    expect(screen.getByTestId("location")).toHaveTextContent("sidePath=view");
+    expect(screen.getByTestId("location")).toHaveTextContent(
+      `name=${targetWithDisplayName.publicationTargetId}`,
+    );
+  });
+
+  it("sets sidePath=edit and name in URL when Edit is clicked", async () => {
+    (useGetPublicationsByTarget as Mock).mockReturnValue({
+      publications: [],
+      isGettingPublications: false,
+    });
+
+    renderWithProviders(
+      <>
+        <PublicationTargetListActions target={targetWithDisplayName} />
+        <LocationDisplay />
+      </>,
+    );
+
+    await user.click(
+      screen.getByRole("button", {
+        name: `${targetWithDisplayName.displayName} actions`,
+      }),
+    );
+    await user.click(
+      await screen.findByRole("menuitem", {
+        name: `Edit ${targetWithDisplayName.displayName}`,
+      }),
+    );
+
+    expect(screen.getByTestId("location")).toHaveTextContent("sidePath=edit");
+    expect(screen.getByTestId("location")).toHaveTextContent(
+      `name=${targetWithDisplayName.publicationTargetId}`,
+    );
+  });
+
+  it("opens remove confirmation dialog when Remove is clicked", async () => {
+    (useGetPublicationsByTarget as Mock).mockReturnValue({
+      publications: [],
+      isGettingPublications: false,
+    });
+
+    renderWithProviders(
+      <>
+        <PublicationTargetListActions target={targetWithDisplayName} />
+        <LocationDisplay />
+      </>,
+    );
+
+    await user.click(
+      screen.getByRole("button", {
+        name: `${targetWithDisplayName.displayName} actions`,
+      }),
+    );
+    await user.click(
+      await screen.findByRole("menuitem", {
+        name: `Remove ${targetWithDisplayName.displayName}`,
+      }),
+    );
+
+    expect(
+      screen.getByRole("dialog", {
+        name: `Remove ${targetWithDisplayName.displayName}`,
+      }),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/features/publication-targets/components/PublicationTargetListActions/PublicationTargetListActions.tsx b/src/features/publication-targets/components/PublicationTargetListActions/PublicationTargetListActions.tsx
new file mode 100644
index 000000000..4b8f6d0ea
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationTargetListActions/PublicationTargetListActions.tsx
@@ -0,0 +1,78 @@
+import ListActions from "@/components/layout/ListActions";
+import usePageParams from "@/hooks/usePageParams";
+import type { Action } from "@/types/Action";
+import type { FC } from "react";
+import { useBoolean } from "usehooks-ts";
+import type { PublicationTarget } from "../../types";
+import RemoveTargetForm from "../RemoveTargetForm";
+
+
+interface PublicationTargetListActionsProps {
+  readonly target: PublicationTarget;
+}
+
+const PublicationTargetListActions: FC<PublicationTargetListActionsProps> = ({ target }) => {
+  const { createPageParamsSetter } = usePageParams();
+  const {
+    value: isRemoveModalOpen,
+    setTrue: openRemoveModal,
+    setFalse: closeRemoveModal,
+  } = useBoolean();
+
+  const handleViewTargetDetails = createPageParamsSetter({
+    sidePath: ["view"],
+    name: target.publicationTargetId ?? "",
+  });
+
+  const handleEditTarget = createPageParamsSetter({
+    sidePath: ["edit"],
+    name: target.publicationTargetId ?? "",
+  });
+
+  const handleRemoveTarget = (): void => {
+    openRemoveModal();
+  };
+
+  const nondestructiveActions: Action[] = [
+    {
+      icon: "show",
+      label: "View details",
+      "aria-label": `View details for ${target.displayName}`,
+      onClick: handleViewTargetDetails,
+    },
+    {
+      icon: "edit",
+      label: "Edit",
+      "aria-label": `Edit ${target.displayName}`,
+      onClick: handleEditTarget,
+    },
+  ];
+
+  const destructiveActions: Action[] = [
+    {
+      icon: "delete",
+      label: "Remove",
+      "aria-label": `Remove ${target.displayName}`,
+      onClick: handleRemoveTarget,
+    },
+  ];
+
+  return (
+    <>
+      <ListActions
+        toggleAriaLabel={`${target.displayName} actions`}
+        actions={nondestructiveActions}
+        destructiveActions={destructiveActions}
+      />
+
+      <RemoveTargetForm
+        isOpen={isRemoveModalOpen}
+        close={closeRemoveModal}
+        target={target}
+      />
+    </>
+  );
+};
+
+export default PublicationTargetListActions;
+
diff --git a/src/features/publication-targets/components/PublicationTargetListActions/index.ts b/src/features/publication-targets/components/PublicationTargetListActions/index.ts
new file mode 100644
index 000000000..f8822dd9c
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationTargetListActions/index.ts
@@ -0,0 +1 @@
+export { default } from "./PublicationTargetListActions";
diff --git a/src/features/publication-targets/components/PublicationsTable/LocalLink/LocalLink.tsx b/src/features/publication-targets/components/PublicationsTable/LocalLink/LocalLink.tsx
new file mode 100644
index 000000000..6351c303a
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationsTable/LocalLink/LocalLink.tsx
@@ -0,0 +1,22 @@
+import StaticLink from "@/components/layout/StaticLink";
+import { ROUTES } from "@/libs/routes";
+import type { FC } from "react";
+
+interface LocalLinkProps {
+  readonly localName: string;
+  readonly openInNewTab?: boolean;
+}
+
+const LocalLink: FC<LocalLinkProps> = ({ localName, openInNewTab = false }) => (
+  <StaticLink
+    to={ROUTES.repositories.localRepositories({
+      sidePath: ["view"],
+      name: localName.replace(/^locals\//, ""),
+    })}
+    target={openInNewTab ? "_blank" : undefined}
+  >
+    {localName}
+  </StaticLink>
+);
+
+export default LocalLink;
diff --git a/src/features/publication-targets/components/PublicationsTable/MirrorLink/MirrorLink.tsx b/src/features/publication-targets/components/PublicationsTable/MirrorLink/MirrorLink.tsx
new file mode 100644
index 000000000..ddf64a85f
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationsTable/MirrorLink/MirrorLink.tsx
@@ -0,0 +1,22 @@
+import StaticLink from "@/components/layout/StaticLink";
+import { ROUTES } from "@/libs/routes";
+import type { FC } from "react";
+
+interface MirrorLinkProps {
+  readonly mirrorName: string;
+  readonly openInNewTab?: boolean;
+}
+
+const MirrorLink: FC<MirrorLinkProps> = ({ mirrorName, openInNewTab=false }) => (
+  <StaticLink
+    to={ROUTES.repositories.mirrors({
+      sidePath: ["view"],
+      name: mirrorName,
+    })}
+    target={openInNewTab ? "_blank" : undefined}
+  >
+    {mirrorName}
+  </StaticLink>
+);
+
+export default MirrorLink;
diff --git a/src/features/publication-targets/components/PublicationsTable/PublicationLink/PublicationLink.tsx b/src/features/publication-targets/components/PublicationsTable/PublicationLink/PublicationLink.tsx
new file mode 100644
index 000000000..5137b89d3
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationsTable/PublicationLink/PublicationLink.tsx
@@ -0,0 +1,23 @@
+import StaticLink from "@/components/layout/StaticLink";
+import { ROUTES } from "@/libs/routes";
+import type { Publication } from "@canonical/landscape-openapi";
+import type { FC } from "react";
+
+interface PublicationLinkProps {
+  readonly publication: Publication;
+  readonly openInNewTab?: boolean;
+}
+
+const PublicationLink: FC<PublicationLinkProps> = ({ publication, openInNewTab=false }) => (
+  <StaticLink
+    to={ROUTES.repositories.publications({
+      sidePath: ["view"],
+      name: publication.publicationId,
+    })}
+    target={openInNewTab ? "_blank" : undefined}
+  >
+    {publication.displayName ?? publication.name}
+  </StaticLink>
+);
+
+export default PublicationLink;
diff --git a/src/features/publication-targets/components/PublicationsTable/PublicationsTable.test.tsx b/src/features/publication-targets/components/PublicationsTable/PublicationsTable.test.tsx
new file mode 100644
index 000000000..52b3ac13e
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationsTable/PublicationsTable.test.tsx
@@ -0,0 +1,213 @@
+import { publications } from "@/tests/mocks/publications";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import type { Publication } from "../../types";
+import { describe, expect, it } from "vitest";
+import PublicationsTable from "./PublicationsTable";
+
+describe("PublicationsTable", () => {
+  const user = userEvent.setup();
+
+  describe("table structure and columns", () => {
+    it("renders table with correct column headers: Publication, Source, Distribution", () => {
+      renderWithProviders(<PublicationsTable publications={publications} />);
+
+      expect(screen.getByText("Publication")).toBeInTheDocument();
+      expect(screen.getByText("Source")).toBeInTheDocument();
+    });
+
+    it("renders all publications in rows with display_name", () => {
+      renderWithProviders(<PublicationsTable publications={publications} />);
+
+      publications.forEach((pub) => {
+        expect(screen.getByText(pub.source)).toBeInTheDocument();
+      });
+    });
+  });
+
+  describe("column data rendering", () => {
+    it("renders label as a link in Publication column", () => {
+      renderWithProviders(<PublicationsTable publications={publications} />);
+
+      publications.forEach((pub) => {
+        const link = screen.getByRole("link", { name: pub.displayName });
+        expect(link).toBeInTheDocument();
+      });
+    });
+
+    it("Publication column links point to publications page with correct params", () => {
+      renderWithProviders(<PublicationsTable publications={publications} />);
+
+      publications.forEach((pub) => {
+        const link = screen.getByRole("link", {
+          name: pub.displayName,
+        }) as HTMLAnchorElement;
+        expect(link.href).toContain("/repositories/publications");
+        expect(link.href).toContain("sidePath=view");
+        expect(link.href).toContain(`name=${pub.publicationId}`);
+      });
+    });
+
+    it("falls back to publication name when label is undefined", () => {
+      const pubWithoutLabel: Publication = {
+        name: "publications/no-label-id",
+        publicationId: "no-label-id",
+        displayName: "",
+        label: "",
+        publicationTarget: "publicationTargets/test",
+        source: "mirrors/test",
+        distribution: "jammy",
+        origin: "",
+        architectures: [],
+        acquireByHash: false,
+        butAutomaticUpgrades: false,
+        notAutomatic: false,
+        multiDist: false,
+        skipBz2: false,
+        skipContents: false,
+      };
+
+      renderWithProviders(
+        <PublicationsTable publications={[pubWithoutLabel]} />,
+      );
+
+      expect(
+        screen.getByRole("link", { name: pubWithoutLabel.displayName }),
+      ).toBeInTheDocument();
+    });
+
+    it("renders mirror value in Source column when available", () => {
+      renderWithProviders(<PublicationsTable publications={publications} />);
+
+      publications.forEach((pub) => {
+        expect(screen.getByText(pub.source)).toBeInTheDocument();
+      });
+    });
+  });
+
+  describe("pagination", () => {
+    const pageSize = 2;
+
+    it("does not render pagination when publications.length <= pageSize", () => {
+      renderWithProviders(
+        <PublicationsTable
+          publications={publications.slice(0, pageSize)}
+          pageSize={pageSize}
+        />,
+      );
+
+      // Should show all items and no pagination
+      expect(screen.queryByRole("button", { name: /prev|next/i })).not
+        .toBeInTheDocument();
+    });
+
+    it("renders pagination component when publications.length > pageSize", () => {
+      renderWithProviders(
+        <PublicationsTable publications={publications} pageSize={pageSize} />,
+      );
+
+      expect(
+        screen.getByText(/page 1/i),
+      ).toBeInTheDocument();
+    });
+
+    it("shows only pageSize items on first page", () => {
+      renderWithProviders(
+        <PublicationsTable publications={publications} pageSize={pageSize} />,
+      );
+
+      // Count visible publication names on first page (should be pageSize)
+      const firstPagePublications = publications
+        .slice(0, pageSize)
+        .map((pub) => pub.source);
+
+      firstPagePublications.forEach((name) => {
+        expect(screen.getByText(name)).toBeInTheDocument();
+      });
+
+      // Next page publication should not be visible
+      const nextPagePublication = publications[pageSize];
+      if (nextPagePublication) {
+        expect(screen.queryByText(nextPagePublication.source)).not
+          .toBeInTheDocument();
+      }
+    });
+
+    it("updates page content when pagination page changes", async () => {
+      renderWithProviders(
+        <PublicationsTable publications={publications} pageSize={pageSize} />,
+      );
+
+      // First page should show first pageSize items
+      const firstPageFirstPub = publications[0]?.source;
+      if (firstPageFirstPub) {
+        expect(screen.getByText(firstPageFirstPub)).toBeInTheDocument();
+      }
+
+      // Find and click next button (may be labeled differently depending on component)
+      const nextButton = screen.getByRole("button", {
+        name: /next|right|forward/i,
+      });
+      await user.click(nextButton);
+
+      // First page publication should no longer be visible (unless on all pages)
+      // Second page publication should be visible
+      const secondPagePublication = publications[pageSize];
+      if (secondPagePublication) {
+        expect(screen.getByText(secondPagePublication.source)).toBeInTheDocument();
+      }
+    });
+  });
+
+  describe("edge cases", () => {
+    it("renders without error with empty publications array", () => {
+      renderWithProviders(<PublicationsTable publications={[]} />);
+
+      // Table should render but with no data rows
+      expect(screen.getByText("Publication")).toBeInTheDocument();
+    });
+
+    it("renders single publication correctly", () => {
+      const singlePublication = [publications[0]];
+      if (!singlePublication[0]) {
+        return;
+      }
+      const [firstPub] = singlePublication;
+      renderWithProviders(
+        <PublicationsTable publications={[firstPub]} />,
+      );
+
+      expect(screen.getByText(firstPub.source)).toBeInTheDocument();
+    });
+  });
+
+  describe("props handling", () => {
+    it("renders all publications without pageSize prop", () => {
+      renderWithProviders(<PublicationsTable publications={publications} />);
+
+      publications.forEach((pub) => {
+        expect(screen.getByText(pub.source)).toBeInTheDocument();
+      });
+    });
+
+    it("applies custom pageSize when provided", () => {
+      if (!publications || publications.length < 2) {
+        throw new Error("Test failed: 'publications' must be defined with at least 2 items.");
+      }
+      const [firstPub, secondPub] = publications;
+      const customPageSize = 1;
+      if (!firstPub || !secondPub) {
+        throw new Error("Test failed: 'publications' must be defined with at least 2 items.");
+      }
+      renderWithProviders(
+        <PublicationsTable publications={publications} pageSize={customPageSize} />,
+      );
+
+      expect(screen.getByText(firstPub.source)).toBeInTheDocument();
+
+      expect(screen.queryByText(secondPub.source)).not
+        .toBeInTheDocument();
+    });
+  });
+});
diff --git a/src/features/publication-targets/components/PublicationsTable/PublicationsTable.tsx b/src/features/publication-targets/components/PublicationsTable/PublicationsTable.tsx
new file mode 100644
index 000000000..7e09861bc
--- /dev/null
+++ b/src/features/publication-targets/components/PublicationsTable/PublicationsTable.tsx
@@ -0,0 +1,94 @@
+import ModalTablePagination from "@/components/layout/TablePagination/components/ModalTablePagination/ModalTablePagination";
+import NoData from "@/components/layout/NoData";
+import { DISPLAY_DATE_TIME_FORMAT } from "@/constants";
+import { ModularTable } from "@canonical/react-components";
+import moment from "moment";
+import type { FC, ReactNode } from "react";
+import { useMemo, useState } from "react";
+import type { CellProps, Column } from "react-table";
+import type { Publication } from "@canonical/landscape-openapi";
+import PublicationLink from "./PublicationLink/PublicationLink";
+import MirrorLink from "./MirrorLink/MirrorLink";
+import LocalLink from "./LocalLink/LocalLink";
+import { getSourceType } from "@/features/publications";
+
+interface PublicationsTableProps {
+  readonly publications: Publication[];
+  readonly pageSize?: number;
+  readonly openInNewTab?: boolean;
+  readonly showSources?: boolean;
+}
+
+const PublicationsTable: FC<PublicationsTableProps> = ({
+  publications,
+  pageSize=10,
+  openInNewTab=false,
+  showSources=true,
+}) => {
+  const [currentPage, setCurrentPage] = useState(1);
+
+  // TODO: replace label with displayName once it's available in the API, link mirror to /mirrors with sidebar open
+  const columns = useMemo<Column<Publication>[]>(
+    () => [
+      {
+        accessor: "displayName",
+        Header: "Publication",
+        Cell: ({ row: { original } }: CellProps<Publication>): ReactNode => (
+          <PublicationLink publication={original} openInNewTab={openInNewTab} />
+        ),
+      },
+      ...(showSources ? [{
+        accessor: "source" as const,
+        Header: "Source",
+        Cell: ({ row: { original: { source } } }: CellProps<Publication>): ReactNode => {
+          const sourceType = getSourceType(source);
+          if (sourceType === "Mirror") {
+            return <MirrorLink mirrorName={source} openInNewTab={openInNewTab} />;
+          }
+          if (sourceType === "Local repository") {
+            return <LocalLink localName={source} openInNewTab={openInNewTab} />;
+          }
+          return <>{source}</>;
+        },
+      }] : []),
+      {
+        accessor: "publishTime",
+        Header: "Date Published",
+        className: "date-cell",
+        Cell: ({ row: { original: { publishTime } } }: CellProps<Publication>): ReactNode =>
+          publishTime ? (
+            <span>
+              {moment(publishTime).format(DISPLAY_DATE_TIME_FORMAT) + " UTC"}
+            </span>
+          ) : (
+            <NoData />
+          ),
+      }
+    ],
+    [openInNewTab, showSources],
+  );
+
+  const pagedData =
+    pageSize != null
+      ? publications.slice((currentPage - 1) * pageSize, currentPage * pageSize)
+      : publications;
+
+  const maxPage = pageSize != null ? Math.ceil(publications.length / pageSize) : 1;
+
+  return (
+    <>
+      <ModularTable
+        columns={columns as Column<Record<string, unknown>>[]}
+        data={pagedData as unknown as Record<string, unknown>[]}
+      />
+      <ModalTablePagination
+        current={currentPage}
+        max={maxPage}
+        onPrev={() => setCurrentPage((p) => Math.max(1, p - 1))}
+        onNext={() => setCurrentPage((p) => Math.min(maxPage, p + 1))}
+      />
+    </>
+  );
+};
+
+export default PublicationsTable;
diff --git a/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetForm.test.tsx b/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetForm.test.tsx
new file mode 100644
index 000000000..e7d2fe40e
--- /dev/null
+++ b/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetForm.test.tsx
@@ -0,0 +1,228 @@
+import { API_URL_DEB_ARCHIVE } from "@/constants";
+import { publicationTargets } from "@/tests/mocks/publicationTargets";
+import { publications } from "@/tests/mocks/publications";
+import server from "@/tests/server";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { http, HttpResponse } from "msw";
+import type { Mock } from "vitest";
+import { describe, expect, it, vi, beforeEach } from "vitest";
+import RemoveTargetModal from "./RemoveTargetModal";
+
+vi.mock("../../api/useGetPublicationsByTarget", () => ({
+  default: vi.fn(),
+}));
+
+import useGetPublicationsByTarget from "../../api/useGetPublicationsByTarget";
+
+// Target with publications (prod-s3-us-east)
+const [targetWithPublications, targetWithoutPublications] = publicationTargets;
+if (!targetWithPublications || !targetWithoutPublications) {
+  throw new Error("Test targets are missing");
+}
+if (!publications[0]) {
+  throw new Error("Test publications are missing");
+}
+
+const [firstPublication] = publications;
+
+const defaultClose = vi.fn();
+
+describe("RemoveTargetForm", () => {
+  const user = userEvent.setup();
+
+  beforeEach(() => {
+    defaultClose.mockReset();
+  });
+
+  it("renders the irreversible warning", () => {
+    (useGetPublicationsByTarget as Mock).mockReturnValue({
+      publications: publications,
+      isGettingPublications: false,
+    });
+
+    renderWithProviders(
+      <RemoveTargetModal
+        isOpen={true}
+        close={defaultClose}
+        target={targetWithPublications}
+      />,
+    );
+
+    expect(screen.getByText(/this action is irreversible/i)).toBeInTheDocument();
+  });
+
+  it("renders Cancel and Remove target buttons", () => {
+    (useGetPublicationsByTarget as Mock).mockReturnValue({
+      publications: publications,
+      isGettingPublications: false,
+    });
+
+    renderWithProviders(
+      <RemoveTargetModal
+        isOpen={true}
+        close={defaultClose}
+        target={targetWithPublications}
+      />,
+    );
+
+    expect(
+      screen.getByRole("button", { name: /cancel/i }),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByRole("button", { name: /remove target/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("shows the publications table with explanatory text when target has publications", () => {
+    (useGetPublicationsByTarget as Mock).mockReturnValue({
+      publications: publications,
+      isGettingPublications: false,
+    });
+
+    renderWithProviders(
+      <RemoveTargetModal
+        isOpen={true}
+        close={defaultClose}
+        target={targetWithPublications}
+      />,
+    );
+
+    expect(
+      screen.getByText(/currently being used by the following publications/i),
+    ).toBeInTheDocument();
+    // publications table column header
+    expect(screen.getByText("Publication")).toBeInTheDocument();
+    // first publication's label
+    expect(
+      screen.getByText(firstPublication.displayName ?? ""),
+    ).toBeInTheDocument();
+  });
+
+  it("hides the publications section when target has no publications", () => {
+    (useGetPublicationsByTarget as Mock).mockReturnValue({
+      publications: [],
+      isGettingPublications: false,
+    });
+
+    renderWithProviders(
+      <RemoveTargetModal
+        isOpen={true}
+        close={defaultClose}
+        target={targetWithoutPublications}
+      />,
+    );
+
+    expect(
+      screen.queryByText(/currently being used by the following publications/i),
+    ).not.toBeInTheDocument();
+    expect(screen.queryByText("Publication")).not.toBeInTheDocument();
+  });
+
+  it("calls close when Cancel is clicked", async () => {
+    (useGetPublicationsByTarget as Mock).mockReturnValue({
+      publications: [],
+      isGettingPublications: false,
+    });
+
+    renderWithProviders(
+      <RemoveTargetModal
+        isOpen={true}
+        close={defaultClose}
+        target={targetWithPublications}
+      />,
+    );
+
+    await user.click(screen.getByRole("button", { name: /cancel/i }));
+
+    expect(defaultClose).toHaveBeenCalled();
+  });
+
+  it("submits the deletion after typing the confirmation text", async () => {
+    server.use(
+      http.delete(`${API_URL_DEB_ARCHIVE}v1/publicationTargets/:id`, () =>
+        new HttpResponse(null, { status: 204 }),
+      ),
+    );
+
+    (useGetPublicationsByTarget as Mock).mockReturnValue({
+      publications: [],
+      isGettingPublications: false,
+    });
+
+    renderWithProviders(
+      <RemoveTargetModal
+        isOpen={true}
+        close={defaultClose}
+        target={targetWithPublications}
+      />,
+    );
+
+    await user.type(
+      screen.getByPlaceholderText(`remove ${targetWithPublications.displayName}`),
+      `remove ${targetWithPublications.displayName}`,
+    );
+    await user.click(screen.getByRole("button", { name: /remove target/i }));
+
+    expect(
+      await screen.findByText(/successfully removed/i),
+    ).toBeInTheDocument();
+  });
+
+  it("shows an error notification when deletion fails", async () => {
+    server.use(
+      http.delete(`${API_URL_DEB_ARCHIVE}v1/publicationTargets/:id`, () =>
+        HttpResponse.json({ message: "deletion failed" }, { status: 500 }),
+      ),
+    );
+
+    (useGetPublicationsByTarget as Mock).mockReturnValue({
+      publications: [],
+      isGettingPublications: false,
+    });
+
+    renderWithProviders(
+      <RemoveTargetModal
+        isOpen={true}
+        close={defaultClose}
+        target={targetWithPublications}
+      />,
+    );
+
+    await user.type(
+      screen.getByPlaceholderText(`remove ${targetWithPublications.displayName}`),
+      `remove ${targetWithPublications.displayName}`,
+    );
+    await user.click(screen.getByRole("button", { name: /remove target/i }));
+
+    expect(await screen.findByText("deletion failed")).toBeInTheDocument();
+  });
+
+  it("does nothing on submit when target has no name", async () => {
+    (useGetPublicationsByTarget as Mock).mockReturnValue({
+      publications: [],
+      isGettingPublications: false,
+    });
+
+    const targetWithoutName = { ...targetWithPublications, name: "" };
+
+    renderWithProviders(
+      <RemoveTargetModal
+        isOpen={true}
+        close={defaultClose}
+        target={targetWithoutName}
+      />,
+    );
+
+    await user.type(
+      screen.getByPlaceholderText(`remove ${targetWithoutName.displayName}`),
+      `remove ${targetWithoutName.displayName}`,
+    );
+    await user.click(screen.getByRole("button", { name: /remove target/i }));
+
+    expect(
+      screen.queryByText(/removed successfully/i),
+    ).not.toBeInTheDocument();
+  });
+});
diff --git a/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetModal.tsx b/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetModal.tsx
new file mode 100644
index 000000000..be4d292cb
--- /dev/null
+++ b/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetModal.tsx
@@ -0,0 +1,85 @@
+import type { TextConfirmationModalProps } from "@/components/form/TextConfirmationModal";
+import TextConfirmationModal from "@/components/form/TextConfirmationModal";
+import useDebug from "@/hooks/useDebug";
+import useNotify from "@/hooks/useNotify";
+import usePageParams from "@/hooks/usePageParams";
+import type { FC } from "react";
+import useGetPublicationsByTarget from "../../api/useGetPublicationsByTarget";
+import useRemovePublicationTarget from "../../api/useRemovePublicationTarget";
+import type { PublicationTarget } from "../../types";
+import PublicationsTable from "../PublicationsTable/PublicationsTable";
+
+interface RemoveTargetModalProps
+  extends Pick<TextConfirmationModalProps, "close" | "isOpen"> {
+  readonly target: PublicationTarget;
+}
+
+const PAGE_SIZE = 5;
+
+const RemoveTargetModal: FC<RemoveTargetModalProps> = ({
+  close,
+  isOpen,
+  target,
+}) => {
+  const debug = useDebug();
+  const { notify } = useNotify();
+  const { setPageParams } = usePageParams();
+  const { removePublicationTargetQuery } = useRemovePublicationTarget();
+  const { mutateAsync: removeTarget, isPending: isRemoving } =
+    removePublicationTargetQuery;
+  const { publications, isGettingPublications } = useGetPublicationsByTarget(
+    target.publicationTargetId,
+  );
+
+  const hasPublications = !isGettingPublications && publications.length > 0;
+
+  const handleRemoveTarget = async () => {
+    try {
+      if (!target.name) return;
+
+      setPageParams({ sidePath: [], name: "" });
+      await removeTarget({ name: target.name });
+      
+      notify.success({
+        message: `You have successfully removed ${target.displayName}`,
+        title: "Publication target removed",
+      });
+    } catch (error) {
+      debug(error);
+    } finally {
+      close();
+    }
+  };
+
+  return (
+    <TextConfirmationModal
+      isOpen={isOpen}
+      title={`Remove ${target.displayName}`}
+      confirmButtonLabel="Remove target"
+      confirmButtonAppearance="negative"
+      confirmButtonLoading={isRemoving}
+      confirmButtonDisabled={isRemoving}
+      confirmationText={`remove ${target.displayName}`}
+      onConfirm={handleRemoveTarget}
+      close={close}
+      renderInPortal
+    >
+      {hasPublications && (
+        <>
+          <p>
+            This publication target is currently being used by the following
+            publications:
+          </p>
+          <PublicationsTable publications={publications} pageSize={PAGE_SIZE} openInNewTab />
+        </>
+      )}
+      <p>
+        Removing this publication target will cause publications to no longer be
+        able to publish to it. <b>This action is irreversible</b>.
+      </p>
+    </TextConfirmationModal>
+  );
+};
+
+export default RemoveTargetModal;
+
diff --git a/src/features/publication-targets/components/RemoveTargetForm/index.ts b/src/features/publication-targets/components/RemoveTargetForm/index.ts
new file mode 100644
index 000000000..182c6db6b
--- /dev/null
+++ b/src/features/publication-targets/components/RemoveTargetForm/index.ts
@@ -0,0 +1 @@
+export { default } from "./RemoveTargetModal";
diff --git a/src/features/publication-targets/components/TargetDetails/TargetDetails.test.tsx b/src/features/publication-targets/components/TargetDetails/TargetDetails.test.tsx
new file mode 100644
index 000000000..0f6873157
--- /dev/null
+++ b/src/features/publication-targets/components/TargetDetails/TargetDetails.test.tsx
@@ -0,0 +1,240 @@
+import { publicationTargets } from "@/tests/mocks/publicationTargets";
+import { publications } from "@/tests/mocks/publications";
+import { renderWithProviders } from "@/tests/render";
+import { screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { useLocation } from "react-router";
+import type { Mock } from "vitest";
+import { describe, expect, it, vi } from "vitest";
+import TargetDetails from "./TargetDetails";
+
+vi.mock("../../api/useGetPublicationsByTarget", () => ({
+  default: vi.fn(),
+}));
+
+import useGetPublicationsByTarget from "../../api/useGetPublicationsByTarget";
+
+const [targetWithPublications, targetWithoutPublications] = publicationTargets;
+const [firstPublication] = publications;
+
+if (
+  !targetWithPublications?.s3 ||
+  !targetWithoutPublications?.s3 ||
+  !firstPublication?.label
+) {
+  throw new Error("Test data is missing required properties");
+}
+
+const s3WithPubs = targetWithPublications.s3;
+const s3WithoutPubs = targetWithoutPublications.s3;
+const firstPubName = firstPublication.displayName;
+
+const LocationDisplay = () => {
+  const { search } = useLocation();
+  return <div data-testid="location">{search}</div>;
+};
+
+describe("TargetDetails", () => {
+  const user = userEvent.setup();
+
+  describe("action buttons", () => {
+    it("renders Edit and Remove buttons", () => {
+      (useGetPublicationsByTarget as Mock).mockReturnValue({
+        publications: publications,
+        isGettingPublications: false,
+      });
+
+      renderWithProviders(<TargetDetails target={targetWithPublications} />);
+
+      expect(screen.getByRole("button", { name: /edit/i })).toBeInTheDocument();
+      expect(
+        screen.getByRole("button", { name: /remove/i }),
+      ).toBeInTheDocument();
+    });
+
+    it("sets sidePath=edit in URL when Edit is clicked", async () => {
+      (useGetPublicationsByTarget as Mock).mockReturnValue({
+        publications: [],
+        isGettingPublications: false,
+      });
+
+      renderWithProviders(
+        <>
+          <TargetDetails target={targetWithPublications} />
+          <LocationDisplay />
+        </>,
+      );
+
+      await user.click(screen.getByRole("button", { name: /edit/i }));
+
+      expect(screen.getByTestId("location")).toHaveTextContent("sidePath=edit");
+    });
+
+    it("opens the remove confirmation modal when Remove is clicked", async () => {
+      (useGetPublicationsByTarget as Mock).mockReturnValue({
+        publications: [],
+        isGettingPublications: false,
+      });
+
+      renderWithProviders(<TargetDetails target={targetWithPublications} />);
+
+      await user.click(screen.getByRole("button", { name: /remove/i }));
+
+      expect(
+        screen.getByRole("dialog", {
+          name: `Remove ${targetWithPublications.displayName}`,
+        }),
+      ).toBeInTheDocument();
+    });
+  });
+
+  describe("S3 target details", () => {
+    it("renders the DETAILS heading", () => {
+      (useGetPublicationsByTarget as Mock).mockReturnValue({
+        publications: [],
+        isGettingPublications: false,
+      });
+
+      renderWithProviders(<TargetDetails target={targetWithPublications} />);
+
+      expect(screen.getByText("Details")).toBeInTheDocument();
+    });
+
+    it("renders the target displayName", () => {
+      (useGetPublicationsByTarget as Mock).mockReturnValue({
+        publications: [],
+        isGettingPublications: false,
+      });
+
+      renderWithProviders(<TargetDetails target={targetWithPublications} />);
+
+      expect(
+        screen.getByText(targetWithPublications.displayName),
+      ).toBeInTheDocument();
+    });
+
+    it("renders all S3 fields: region, bucket, prefix, acl, storageClass, encryptionMethod, disableMultiDel, forceSigV2", () => {
+      (useGetPublicationsByTarget as Mock).mockReturnValue({
+        publications: [],
+        isGettingPublications: false,
+      });
+
+      const { container } = renderWithProviders(
+        <TargetDetails target={targetWithPublications} />,
+      );
+
+      expect(container).toHaveInfoItem("Region", s3WithPubs.region);
+      expect(container).toHaveInfoItem("Bucket Name", s3WithPubs.bucket);
+      expect(container).toHaveInfoItem("Prefix", s3WithPubs.prefix ?? "");
+      expect(container).toHaveInfoItem("ACL", s3WithPubs.acl ?? "");
+      expect(container).toHaveInfoItem("Storage class", s3WithPubs.storageClass ?? "");
+      expect(container).toHaveInfoItem(
+        "Encryption method",
+        s3WithPubs.encryptionMethod ?? "",
+      );
+      expect(container).toHaveInfoItem(
+        "Disable MultiDel",
+        s3WithPubs.disableMultiDel ? "Yes" : "No",
+      );
+      expect(container).toHaveInfoItem(
+        "Force AWS SIGv2",
+        s3WithPubs.forceSigV2 ? "Yes" : "No",
+      );
+    });
+
+    it("renders S3 configuration with partial fields (missing optional fields have undefined values)", () => {
+      (useGetPublicationsByTarget as Mock).mockReturnValue({
+        publications: [],
+        isGettingPublications: false,
+      });
+
+      const { container } = renderWithProviders(
+        <TargetDetails target={targetWithoutPublications} />,
+      );
+
+      expect(container).toHaveInfoItem("Region", s3WithoutPubs.region);
+      expect(container).toHaveInfoItem("Bucket Name", s3WithoutPubs.bucket);
+      expect(container).toHaveInfoItem(
+        "Disable MultiDel",
+        s3WithoutPubs.disableMultiDel ? "Yes" : "No",
+      );
+    });
+
+    it("renders 'Yes' for forceSigV2 when it is true", () => {
+      (useGetPublicationsByTarget as Mock).mockReturnValue({
+        publications: [],
+        isGettingPublications: false,
+      });
+
+      const targetWithForceSigV2: typeof targetWithPublications = {
+        ...targetWithPublications,
+        s3: { ...s3WithPubs, forceSigV2: true },
+      };
+
+      const { container } = renderWithProviders(
+        <TargetDetails target={targetWithForceSigV2} />,
+      );
+
+      expect(container).toHaveInfoItem("Force AWS SIGv2", "Yes");
+    });
+  });
+
+  describe("Used In section", () => {
+    it("shows the Used In section and publications table when target has publications", () => {
+      (useGetPublicationsByTarget as Mock).mockReturnValue({
+        publications: publications,
+        isGettingPublications: false,
+      });
+
+      renderWithProviders(<TargetDetails target={targetWithPublications} />);
+
+      expect(screen.getByText("Used In")).toBeInTheDocument();
+      expect(screen.getByText(firstPubName)).toBeInTheDocument();
+    });
+
+    it("hides the Used In section when target has no publications", () => {
+      (useGetPublicationsByTarget as Mock).mockReturnValue({
+        publications: [],
+        isGettingPublications: false,
+      });
+
+      renderWithProviders(<TargetDetails target={targetWithoutPublications} />);
+
+      expect(screen.queryByText("Used In")).not.toBeInTheDocument();
+    });
+
+    it("shows LoadingState while publications are loading", () => {
+      (useGetPublicationsByTarget as Mock).mockReturnValue({
+        publications: [],
+        isGettingPublications: true,
+      });
+
+      renderWithProviders(<TargetDetails target={targetWithPublications} />);
+
+      expect(screen.getByText("Details")).toBeInTheDocument();
+      expect(screen.queryByText("Used In")).not.toBeInTheDocument();
+    });
+  });
+
+  describe("Swift target", () => {
+    it("renders DETAILS without S3 fields for a Swift target", () => {
+      (useGetPublicationsByTarget as Mock).mockReturnValue({
+        publications: [],
+        isGettingPublications: false,
+      });
+
+      const swiftTarget = publicationTargets[2];
+      if (!swiftTarget) throw new Error("Missing swift mock target");
+
+      const { container } = renderWithProviders(
+        <TargetDetails target={swiftTarget} />,
+      );
+
+      expect(screen.getByText("Details")).toBeInTheDocument();
+      // S3-specific InfoGrid items should not be present
+      expect(container.textContent).not.toContain("Region");
+      expect(container.textContent).not.toContain("Bucket Name");
+    });
+  });
+});
+
diff --git a/src/features/publication-targets/components/TargetDetails/TargetDetails.tsx b/src/features/publication-targets/components/TargetDetails/TargetDetails.tsx
new file mode 100644
index 000000000..e27c8fb19
--- /dev/null
+++ b/src/features/publication-targets/components/TargetDetails/TargetDetails.tsx
@@ -0,0 +1,114 @@
+import InfoGrid from "@/components/layout/InfoGrid/InfoGrid";
+import LoadingState from "@/components/layout/LoadingState";
+import useGetPublicationsByTarget from "../../api/useGetPublicationsByTarget";
+import usePageParams from "@/hooks/usePageParams";
+import { Button, Icon, ICONS } from "@canonical/react-components";
+import type { FC } from "react";
+import { createPortal } from "react-dom";
+import { useBoolean } from "usehooks-ts";
+import type { PublicationTarget } from "../../types";
+import PublicationsTable from "../PublicationsTable/PublicationsTable";
+import RemoveTargetForm from "../RemoveTargetForm";
+import Blocks from "@/components/layout/Blocks/Blocks";
+
+interface TargetDetailsProps {
+  readonly target: PublicationTarget;
+}
+
+const TargetDetails: FC<TargetDetailsProps> = ({ target }) => {
+  const { createPageParamsSetter, createSidePathPusher } = usePageParams();
+  const { publications, isGettingPublications } = useGetPublicationsByTarget(
+    target.publicationTargetId,
+  );
+  const {
+    value: isRemoveModalOpen,
+    setTrue: openRemoveModal,
+    setFalse: closeRemoveModal,
+  } = useBoolean();
+
+  const handleEditTarget = createSidePathPusher("edit");
+
+  const handleRemoveTarget = (): void => {
+    openRemoveModal();
+  };
+
+  const s3Fields = target.s3
+    ? {
+        region: target.s3.region,
+        bucket: target.s3.bucket,
+        endpoint: target.s3.endpoint,
+        prefix: target.s3.prefix,
+        acl: target.s3.acl,
+        storageClass: target.s3.storageClass,
+        encryptionMethod: target.s3.encryptionMethod,
+        disableMultiDel: target.s3.disableMultiDel ? "Yes" : "No",
+        forceSigV2: target.s3.forceSigV2 ? "Yes" : "No",
+      }
+    : null;
+
+  return (
+    <>
+      <div className="p-segmented-control u-sv2">
+        <Button
+          type="button"
+          hasIcon
+          className="p-segmented-control__button"
+          onClick={handleEditTarget}
+        >
+          <Icon name="edit" />
+          <span>Edit</span>
+        </Button>
+        <Button
+          type="button"
+          className="p-segmented-control__button"
+          hasIcon
+          onClick={handleRemoveTarget}
+        >
+          <Icon name={`${ICONS.delete}--negative`} />
+          <span className="u-text--negative">Remove</span>
+        </Button>
+      </div>
+      <Blocks dense>
+        <Blocks.Item title="Details">
+        <InfoGrid dense>
+            <InfoGrid.Item label="Name" large value={target.displayName} />
+
+            {s3Fields && (
+              <>
+                <InfoGrid.Item label="Region" value={s3Fields.region} />
+                <InfoGrid.Item label="Bucket Name" value={s3Fields.bucket} />
+                <InfoGrid.Item label="Prefix" value={s3Fields.prefix} />
+                <InfoGrid.Item label="ACL" value={s3Fields.acl} />
+                <InfoGrid.Item label="Storage class" value={s3Fields.storageClass} />
+                <InfoGrid.Item label="Encryption method" value={s3Fields.encryptionMethod} />
+                <InfoGrid.Item label="Disable MultiDel" value={s3Fields.disableMultiDel} />
+                <InfoGrid.Item label="Force AWS SIGv2" value={s3Fields.forceSigV2} />
+              </>
+            )}
+
+          </InfoGrid>
+        </Blocks.Item>
+
+        {!isGettingPublications && publications.length > 0 && (
+          <Blocks.Item title="Used In">
+            <PublicationsTable publications={publications} />
+          </Blocks.Item>
+        )}
+      </Blocks>
+
+      {isGettingPublications && <LoadingState />}
+
+      {createPortal(
+        <RemoveTargetForm
+          isOpen={isRemoveModalOpen}
+          close={closeRemoveModal}
+          target={target}
+        />,
+        document.body,
+      )}
+    </>
+  );
+};
+
+export default TargetDetails;
+
diff --git a/src/features/publication-targets/components/TargetDetails/index.ts b/src/features/publication-targets/components/TargetDetails/index.ts
new file mode 100644
index 000000000..1b5d5dd4c
--- /dev/null
+++ b/src/features/publication-targets/components/TargetDetails/index.ts
@@ -0,0 +1 @@
+export { default } from "./TargetDetails";
diff --git a/src/features/publication-targets/index.ts b/src/features/publication-targets/index.ts
index b342ba817..d4a43148f 100644
--- a/src/features/publication-targets/index.ts
+++ b/src/features/publication-targets/index.ts
@@ -1,2 +1,19 @@
-export { default } from "./api/useGetPublicationTargets";
-export type { PublicationTarget } from "./types/PublicationTarget";
+export { AddPublicationTargetForm } from "./components/AddPublicationTargetForm";
+export { default as EditTargetForm } from "./components/EditTargetForm";
+export { default as PublicationTargetAddButton } from "./components/PublicationTargetAddButton";
+export { default as PublicationTargetContainer } from "./components/PublicationTargetContainer";
+export { default as PublicationTargetList } from "./components/PublicationTargetList";
+export { default as TargetDetails } from "./components/TargetDetails/TargetDetails";
+export type {
+  Publication,
+  PublicationTarget,
+  S3Target,
+  SwiftTarget,
+} from "@canonical/landscape-openapi";
+export {
+  useGetPublicationTargets,
+  useGetPublicationsByTarget,
+  useCreatePublicationTarget,
+  useEditPublicationTarget,
+  useRemovePublicationTarget,
+} from "./api";
diff --git a/src/features/publication-targets/types/Publication.ts b/src/features/publication-targets/types/Publication.ts
new file mode 100644
index 000000000..fd2e2ee78
--- /dev/null
+++ b/src/features/publication-targets/types/Publication.ts
@@ -0,0 +1,3 @@
+import type { Publication } from "@/features/publications";
+
+export type { Publication };
diff --git a/src/features/publication-targets/types/PublicationTarget.ts b/src/features/publication-targets/types/PublicationTarget.ts
index 16072bb08..3b9d569d3 100644
--- a/src/features/publication-targets/types/PublicationTarget.ts
+++ b/src/features/publication-targets/types/PublicationTarget.ts
@@ -1,5 +1,5 @@
-export interface PublicationTarget extends Record<string, unknown> {
-  name: string;
-  publication_target_id: string;
-  displayName: string;
-}
+export type {
+  PublicationTarget,
+  S3Target,
+  SwiftTarget,
+} from "@canonical/landscape-openapi";
diff --git a/src/features/publication-targets/types/index.ts b/src/features/publication-targets/types/index.ts
new file mode 100644
index 000000000..bb77866c8
--- /dev/null
+++ b/src/features/publication-targets/types/index.ts
@@ -0,0 +1,6 @@
+export type { Publication } from "./Publication";
+export type {
+  PublicationTarget,
+  S3Target,
+  SwiftTarget,
+} from "@canonical/landscape-openapi";
diff --git a/src/features/publications/api/index.ts b/src/features/publications/api/index.ts
index 43b004620..d29370883 100644
--- a/src/features/publications/api/index.ts
+++ b/src/features/publications/api/index.ts
@@ -1,3 +1,4 @@
+export * from "./useAddPublication";
 export * from "./useBatchGetLocals";
 export * from "./useBatchGetMirrors";
 export * from "./useBatchGetPublicationTargets";
diff --git a/src/features/publications/api/useGetPagePublication.ts b/src/features/publications/api/useGetPagePublication.ts
new file mode 100644
index 000000000..0c47e64b2
--- /dev/null
+++ b/src/features/publications/api/useGetPagePublication.ts
@@ -0,0 +1,30 @@
+import usePageParams from "@/hooks/usePageParams";
+import type { Publication } from "../types";
+import useGetPublication from "./useGetPublication";
+
+const useGetPagePublication = ():
+  | { publication: Publication; isGettingPublication: false }
+  | { publication: undefined; isGettingPublication: true } => {
+  const { name: publicationId } = usePageParams();
+
+  const { publication, isGettingPublication, publicationError } =
+    useGetPublication({ publicationName: publicationId });
+
+  if (publicationError) {
+    throw publicationError;
+  }
+
+  if (isGettingPublication) {
+    return {
+      publication: undefined,
+      isGettingPublication: true,
+    };
+  }
+
+  return {
+    publication: publication as Publication,
+    isGettingPublication: false,
+  };
+};
+
+export default useGetPagePublication;
diff --git a/src/features/publications/api/useGetPublications.ts b/src/features/publications/api/useGetPublications.ts
index 2eb2952c8..b7afc825d 100644
--- a/src/features/publications/api/useGetPublications.ts
+++ b/src/features/publications/api/useGetPublications.ts
@@ -15,6 +15,7 @@ import {
 const FETCH_PAGE_SIZE = 1000;
 
 const SEARCH_PREFIXES = [
+  "publicationTargetId:",
   "publicationTarget:",
   "source:",
   "sourceType:",
@@ -44,6 +45,10 @@ const matchesSearch = (
 ): boolean => {
   if (!value) return true;
   switch (prefix) {
+    case "publicationTargetId:":
+      return (
+        getPublicationTargetName(publication.publicationTarget) === value
+      );
     case "publicationTarget:":
       return (getPublicationTargetName(publication.publicationTarget) ?? "")
         .toLowerCase()
diff --git a/src/features/publications/api/useUpdatePublication.ts b/src/features/publications/api/useUpdatePublication.ts
new file mode 100644
index 000000000..186588b35
--- /dev/null
+++ b/src/features/publications/api/useUpdatePublication.ts
@@ -0,0 +1,34 @@
+import type { Publication, PublicationWritable } from "../types";
+import useFetchDebArchive from "@/hooks/useFetchDebArchive";
+import type { ApiError } from "@/types/api/ApiError";
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import type { AxiosError, AxiosResponse } from "axios";
+
+interface UpdatePublicationParams {
+  publicationName: string;
+  body: PublicationWritable;
+}
+
+export default function useUpdatePublication() {
+  const authFetchDebArchive = useFetchDebArchive();
+  const queryClient = useQueryClient();
+
+  const updatePublicationQuery = useMutation<
+    AxiosResponse<Publication>,
+    AxiosError<ApiError>,
+    UpdatePublicationParams
+  >({
+    mutationKey: ["publications", "update"],
+    mutationFn: async ({ publicationName, body }) =>
+      authFetchDebArchive.patch(
+        `publications/${encodeURIComponent(publicationName)}`,
+        body,
+      ),
+    onSuccess: async () =>
+      queryClient.invalidateQueries({ queryKey: ["publications"] }),
+  });
+
+  return {
+    updatePublicationQuery,
+  };
+}
diff --git a/src/features/publications/components/AddPublicationButton/AddPublicationButton.tsx b/src/features/publications/components/AddPublicationButton/AddPublicationButton.tsx
index 70f71dae7..b866223d1 100644
--- a/src/features/publications/components/AddPublicationButton/AddPublicationButton.tsx
+++ b/src/features/publications/components/AddPublicationButton/AddPublicationButton.tsx
@@ -1,28 +1,15 @@
-import LoadingState from "@/components/layout/LoadingState";
-import useSidePanel from "@/hooks/useSidePanel";
+import usePageParams from "@/hooks/usePageParams";
 import { Button, Icon } from "@canonical/react-components";
-import { lazy, Suspense } from "react";
-
-const AddPublicationForm = lazy(() => import("../AddPublicationForm"));
 
 const AddPublicationButton = () => {
-  const { setSidePanelContent } = useSidePanel();
-
-  const handleAddPublication = () => {
-    setSidePanelContent(
-      "Add publication",
-      <Suspense fallback={<LoadingState />}>
-        <AddPublicationForm />
-      </Suspense>,
-    );
-  };
+  const { createPageParamsSetter } = usePageParams();
 
   return (
     <Button
       appearance="positive"
       hasIcon
       type="button"
-      onClick={handleAddPublication}
+      onClick={createPageParamsSetter({ sidePath: ["add"] })}
     >
       <Icon name="plus" light />
       <span>Add publication</span>
diff --git a/src/features/publications/components/AddPublicationForm/AddPublicationForm.tsx b/src/features/publications/components/AddPublicationForm/AddPublicationForm.tsx
index e82aa2097..6f5a75d9e 100644
--- a/src/features/publications/components/AddPublicationForm/AddPublicationForm.tsx
+++ b/src/features/publications/components/AddPublicationForm/AddPublicationForm.tsx
@@ -2,7 +2,7 @@ import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
 import Blocks from "@/components/layout/Blocks";
 import useDebug from "@/hooks/useDebug";
 import useNotify from "@/hooks/useNotify";
-import useSidePanel from "@/hooks/useSidePanel";
+import usePageParams from "@/hooks/usePageParams";
 import type { SelectOption } from "@/types/SelectOption";
 import { getFormikError } from "@/utils/formikErrors";
 import {
@@ -38,10 +38,29 @@ import {
   useGetPublicationTargets,
 } from "../../api";
 
+interface SelectableSource {
+  label: string;
+  value: string;
+  sourceType: string;
+  distribution?: string;
+  component?: string;
+  components: string[];
+  architectures: string[];
+}
+
+const stripResourcePrefix = (value?: string, prefix?: string) => {
+  if (!value || !prefix) {
+    return value ?? "";
+  }
+
+  return value.startsWith(prefix) ? value.slice(prefix.length) : value;
+};
+
 const AddPublicationForm: FC = () => {
   const debug = useDebug();
   const { notify } = useNotify();
-  const { closeSidePanel } = useSidePanel();
+  const { createPageParamsSetter } = usePageParams();
+  const closePanel = createPageParamsSetter({ sidePath: [], name: "" });
   const { mirrors, isGettingMirrors } = useGetMirrors();
   const { locals, isGettingLocals } = useGetLocals();
   const { publicationTargets, isGettingPublicationTargets } =
@@ -56,7 +75,7 @@ const AddPublicationForm: FC = () => {
         const payload = getPublicationPayload(values);
         await createPublication(payload);
 
-        closeSidePanel();
+        closePanel();
 
         notify.success({
           title: "Publication created",
diff --git a/src/features/publications/components/PublicationDetails/PublicationDetails.test.tsx b/src/features/publications/components/PublicationDetails/PublicationDetails.test.tsx
index 3b263de8d..a9e7f401b 100644
--- a/src/features/publications/components/PublicationDetails/PublicationDetails.test.tsx
+++ b/src/features/publications/components/PublicationDetails/PublicationDetails.test.tsx
@@ -1,4 +1,5 @@
-import { publicationTargets, publications } from "@/tests/mocks/publications";
+import { publications } from "@/tests/mocks/publications";
+import { publicationTargets } from "@/tests/mocks/publicationTargets";
 import { renderWithProviders } from "@/tests/render";
 import { screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
diff --git a/src/features/publications/components/PublicationsList/PublicationsList.test.tsx b/src/features/publications/components/PublicationsList/PublicationsList.test.tsx
index 582ef6fcf..1e29d3dca 100644
--- a/src/features/publications/components/PublicationsList/PublicationsList.test.tsx
+++ b/src/features/publications/components/PublicationsList/PublicationsList.test.tsx
@@ -1,4 +1,5 @@
-import { publicationTargets, publications } from "@/tests/mocks/publications";
+import { publications } from "@/tests/mocks/publications";
+import { publicationTargets } from "@/tests/mocks/publicationTargets";
 import { renderWithProviders } from "@/tests/render";
 import { screen, within } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
@@ -24,6 +25,24 @@ const buildDisplayNameMaps = (pubs: typeof publications) => {
   return { sourceDisplayNames, publicationTargetDisplayNames };
 };
 
+const buildDisplayNameMaps = (pubs: typeof publications) => {
+  const sourceDisplayNames: Record<string, string> = {};
+  const publicationTargetDisplayNames: Record<string, string> = {};
+
+  for (const pub of pubs) {
+    const mirror = mirrors.find((m) => m.name === pub.source);
+    if (mirror?.name) sourceDisplayNames[mirror.name] = mirror.displayName;
+
+    const target = publicationTargets.find(
+      (t) => t.name === pub.publicationTarget,
+    );
+    if (target?.name)
+      publicationTargetDisplayNames[target.name] = target.displayName;
+  }
+
+  return { sourceDisplayNames, publicationTargetDisplayNames };
+};
+
 describe("PublicationsList", () => {
   const user = userEvent.setup();
   const [publication] = publications;
@@ -64,6 +83,8 @@ describe("PublicationsList", () => {
         name: publicationTargetDisplayNames[publication.publicationTarget],
       }),
     ).toBeInTheDocument();
+    expect(screen.getByText(publication.distribution)).toBeInTheDocument();
+    expect(screen.getByText(publication.component)).toBeInTheDocument();
   });
 
   it("opens sidepanel when clicking a publication name", async () => {
diff --git a/src/features/publications/index.ts b/src/features/publications/index.ts
index 0dfe11d58..1479393cc 100644
--- a/src/features/publications/index.ts
+++ b/src/features/publications/index.ts
@@ -1,14 +1,8 @@
+export { useAddPublication, usePublishPublication } from "./api";
 export { default as PublicationsContainer } from "./components/PublicationsContainer";
 export { default as AddPublicationButton } from "./components/AddPublicationButton";
+export { default as AddPublicationForm } from "./components/AddPublicationForm";
 export { default as PublicationDetails } from "./components/PublicationDetails";
 export { default as PublicationDetailsSidePanel } from "./components/PublicationDetailsSidePanel";
-export type {
-  Publication,
-  PublicationTarget,
-  Mirror,
-  PublishPublicationResponse,
-  BatchGetMirrorsResponse,
-  BatchGetPublicationTargetsResponse,
-} from "./types";
-export { useAddPublication } from "./api/useAddPublication";
-export { usePublishPublication } from "./api/usePublishPublicaton";
+export type { Publication, PublicationTarget, Local, Mirror } from "./types";
+export { getSourceName, getSourceType } from "./helpers";
diff --git a/src/features/repository-profiles/components/RepositoryProfileEditForm/RepositoryProfileEditForm.test.tsx b/src/features/repository-profiles/components/RepositoryProfileEditForm/RepositoryProfileEditForm.test.tsx
index 09ca6f029..397aeb3a2 100644
--- a/src/features/repository-profiles/components/RepositoryProfileEditForm/RepositoryProfileEditForm.test.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileEditForm/RepositoryProfileEditForm.test.tsx
@@ -1,4 +1,3 @@
-import usePageParams from "@/hooks/usePageParams";
 import { repositoryProfiles } from "@/tests/mocks/repositoryProfiles";
 import { renderWithProviders } from "@/tests/render";
 import { screen } from "@testing-library/react";
@@ -9,20 +8,11 @@ import RepositoryProfileEditForm from "./RepositoryProfileEditForm";
 
 const [profile] = repositoryProfiles;
 
-// Mirrors real app behavior: only mount when name param is set
-const NameGuard = () => {
-  const { name } = usePageParams();
-  if (!name) return null;
-  return (
-    <Suspense fallback={null}>
-      <RepositoryProfileEditForm />
-    </Suspense>
-  );
-};
-
 const renderEditForm = (sidePath = "view,edit") =>
   renderWithProviders(
-    <NameGuard />,
+    <Suspense fallback={null}>
+      <RepositoryProfileEditForm />
+    </Suspense>,
     undefined,
     `/?sidePath=${sidePath}&name=${profile.name}`,
   );
@@ -48,7 +38,9 @@ describe("RepositoryProfileEditForm", () => {
 
   it("does not render back button when sidePath has only one segment", async () => {
     renderWithProviders(
-      <NameGuard />,
+      <Suspense fallback={null}>
+        <RepositoryProfileEditForm />
+      </Suspense>,
       undefined,
       `/?sidePath=edit&name=${profile.name}`,
     );
@@ -68,7 +60,7 @@ describe("RepositoryProfileEditForm", () => {
     ).toBeInTheDocument();
   });
 
-  it("clears sidePath and name URL params on close button click", async () => {
+  it("closes the panel and clears URL params on close button click", async () => {
     renderEditForm();
 
     await screen.findByRole("heading", { name: `Edit ${profile.title}` });
diff --git a/src/libs/pageParamsManager/constants.ts b/src/libs/pageParamsManager/constants.ts
index e269543c9..0cb0e1bb4 100644
--- a/src/libs/pageParamsManager/constants.ts
+++ b/src/libs/pageParamsManager/constants.ts
@@ -140,4 +140,9 @@ export const PARAMS_CONFIG: ParamsConfig = [
     shouldResetPage: false,
     defaultValue: DEFAULT_EMPTY_STRING,
   },
+  {
+    urlParam: "sidePath",
+    shouldResetPage: false,
+    defaultValue: DEFAULT_EMPTY_ARRAY,
+  },
 ];
diff --git a/src/libs/pageParamsManager/types.ts b/src/libs/pageParamsManager/types.ts
index 88196becf..e5048a7a9 100644
--- a/src/libs/pageParamsManager/types.ts
+++ b/src/libs/pageParamsManager/types.ts
@@ -33,6 +33,7 @@ export interface PageParams {
   code: string;
   sidePath: string[];
   name: string;
+  mirror: string;
 }
 
 /**
diff --git a/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.test.tsx b/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.test.tsx
new file mode 100644
index 000000000..411af4b8e
--- /dev/null
+++ b/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.test.tsx
@@ -0,0 +1,53 @@
+import { expectLoadingState } from "@/tests/helpers";
+import { renderWithProviders } from "@/tests/render";
+import { screen, within } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, expect, it } from "vitest";
+import PublicationTargetsPage from "./PublicationTargetsPage";
+
+describe("PublicationTargetsPage", () => {
+  it("renders the page title", () => {
+    renderWithProviders(<PublicationTargetsPage />);
+
+    expect(
+      screen.getByRole("heading", { name: /publication targets/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("renders the Add publication target button", () => {
+    renderWithProviders(<PublicationTargetsPage />);
+
+    expect(
+      screen.getByRole("button", { name: /add publication target/i }),
+    ).toBeInTheDocument();
+  });
+
+  it("opens the add form side panel when the add button is clicked", async () => {
+    const user = userEvent.setup();
+
+    renderWithProviders(<PublicationTargetsPage />);
+
+    await user.click(
+      screen.getByRole("button", { name: /add publication target/i }),
+    );
+    await expectLoadingState();
+
+    expect(
+      within(screen.getByLabelText("Side panel")).getByRole("button", {
+        name: /add publication target/i,
+      }),
+    ).toBeInTheDocument();
+  });
+
+  it("renders the add form side panel when sidePath=add is in the URL", async () => {
+    renderWithProviders(<PublicationTargetsPage />, undefined, "/?sidePath=add");
+
+    await expectLoadingState();
+
+    expect(
+      within(screen.getByLabelText("Side panel")).getByRole("button", {
+        name: /add publication target/i,
+      }),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx b/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx
index d861a67a3..5dfaa80d3 100644
--- a/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx
+++ b/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx
@@ -1,85 +1,76 @@
-import EmptyState from "@/components/layout/EmptyState";
-import LoadingState from "@/components/layout/LoadingState";
 import PageContent from "@/components/layout/PageContent";
 import PageHeader from "@/components/layout/PageHeader";
 import PageMain from "@/components/layout/PageMain";
-import { APTSourcesList, useGetAPTSources } from "@/features/apt-sources";
-import useSidePanel from "@/hooks/useSidePanel";
-import { Button } from "@canonical/react-components";
-import type { FC } from "react";
-import { lazy, Suspense } from "react";
+import SidePanel from "@/components/layout/SidePanel";
+import useSetDynamicFilterValidation from "@/hooks/useDynamicFilterValidation";
+import usePageParams from "@/hooks/usePageParams";
+import {
+  PublicationTargetAddButton,
+  PublicationTargetContainer,
+  TargetDetails,
+  useGetPublicationTargets,
+} from "@/features/publication-targets";
+import { lazy, type FC } from "react";
 
-const NewAPTSourceForm = lazy(async () =>
-  import("@/features/apt-sources").then((module) => ({
-    default: module.NewAPTSourceForm,
+const AddPublicationTargetForm = lazy(async () =>
+  import("@/features/publication-targets").then((module) => ({
+    default: module.AddPublicationTargetForm,
   })),
 );
 
-const APTSourcesPage: FC = () => {
-  const { setSidePanelContent } = useSidePanel();
-  const { aptSources: items, isGettingAPTSources: isLoading } =
-    useGetAPTSources();
+const EditTargetForm = lazy(async () =>
+  import("@/features/publication-targets").then((module) => ({
+    default: module.EditTargetForm,
+  })),
+);
+
+const PublicationTargetsPage: FC = () => {
+  const { lastSidePathSegment, createPageParamsSetter, name } =
+    usePageParams();
+  const { publicationTargets } = useGetPublicationTargets();
 
-  const handleOpen = () => {
-    setSidePanelContent(
-      "Add APT source",
-      <Suspense fallback={<LoadingState />}>
-        <NewAPTSourceForm />
-      </Suspense>,
-    );
-  };
+  useSetDynamicFilterValidation("sidePath", ["view", "add", "edit"]);
+
+  const viewTarget = publicationTargets.find((t) => t.publicationTargetId === name);
 
   return (
     <PageMain>
       <PageHeader
-        title="APT sources"
-        actions={[
-          <Button
-            key="new-key-button"
-            appearance="positive"
-            onClick={handleOpen}
-            type="button"
-          >
-            Add APT source
-          </Button>,
-        ]}
+        title="Publication targets"
+        actions={[<PublicationTargetAddButton key="add" />]}
       />
       <PageContent hasTable>
-        {isLoading && <LoadingState />}
-        {!isLoading && items.length === 0 && (
-          <EmptyState
-            title="No APT sources found"
-            icon="connected"
-            body={
-              <>
-                <p className="u-no-margin--bottom">
-                  You haven’t added any APT sources yet.
-                </p>
-                <a
-                  href="https://ubuntu.com/landscape/docs/repositories"
-                  target="_blank"
-                  rel="nofollow noopener noreferrer"
-                >
-                  How to manage APT sources in Landscape
-                </a>
-              </>
-            }
-            cta={[
-              <Button
-                appearance="positive"
-                key="table-add-new-mirror"
-                onClick={handleOpen}
-                type="button"
-              >
-                Add APT source
-              </Button>,
-            ]}
-          />
-        )}
-        {!isLoading && items.length > 0 && <APTSourcesList items={items} />}
+        <PublicationTargetContainer />
       </PageContent>
+
+      <SidePanel
+        onClose={createPageParamsSetter({ sidePath: [], name: "" })}
+        isOpen={!!lastSidePathSegment}
+        size="small"
+      >
+        {lastSidePathSegment === "add" && (
+          <SidePanel.Suspense key="add">
+            <SidePanel.Header>Add publication target</SidePanel.Header>
+            <AddPublicationTargetForm />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "view" && viewTarget && (
+          <SidePanel.Suspense key="view">
+            <SidePanel.Header>{viewTarget.displayName}</SidePanel.Header>
+            <TargetDetails target={viewTarget} />
+          </SidePanel.Suspense>
+        )}
+
+        {lastSidePathSegment === "edit" && viewTarget && (
+          <SidePanel.Suspense key="edit">
+            <SidePanel.Header>Edit {viewTarget.displayName ?? viewTarget.name}</SidePanel.Header>
+            <EditTargetForm target={viewTarget} />
+          </SidePanel.Suspense>
+        )}
+      </SidePanel>
     </PageMain>
   );
 };
 
-export default APTSourcesPage;
+export default PublicationTargetsPage;
diff --git a/src/pages/dashboard/repositories/publications/PublicationsPage.tsx b/src/pages/dashboard/repositories/publications/PublicationsPage.tsx
index d31ad472c..9242c638f 100644
--- a/src/pages/dashboard/repositories/publications/PublicationsPage.tsx
+++ b/src/pages/dashboard/repositories/publications/PublicationsPage.tsx
@@ -6,16 +6,16 @@ import useSetDynamicFilterValidation from "@/hooks/useDynamicFilterValidation";
 import usePageParams from "@/hooks/usePageParams";
 import {
   AddPublicationButton,
+  AddPublicationForm,
   PublicationDetailsSidePanel,
   PublicationsContainer,
 } from "@/features/publications";
 import type { FC } from "react";
 
 const PublicationsPage: FC = () => {
-  const { sidePath, createPageParamsSetter } = usePageParams();
-
-  useSetDynamicFilterValidation("sidePath", ["view"]);
+  const { sidePath, lastSidePathSegment, createPageParamsSetter } = usePageParams();
 
+  useSetDynamicFilterValidation("sidePath", ["add", "view"]);
   return (
     <PageMain>
       <PageHeader
@@ -30,7 +30,13 @@ const PublicationsPage: FC = () => {
         isOpen={!!sidePath.length}
         onClose={createPageParamsSetter({ sidePath: [], name: "" })}
       >
-        {sidePath.includes("view") && (
+        {lastSidePathSegment === "add" && (
+          <SidePanel.Suspense key="add">
+            <SidePanel.Header>Add publication</SidePanel.Header>
+            <AddPublicationForm />
+          </SidePanel.Suspense>
+        )}
+        {lastSidePathSegment === "view" && (
           <SidePanel.Suspense key="view">
             <PublicationDetailsSidePanel />
           </SidePanel.Suspense>
@@ -40,4 +46,4 @@ const PublicationsPage: FC = () => {
   );
 };
 
-export default PublicationsPage;
+export default PublicationsPage;
\ No newline at end of file
diff --git a/src/routes/DashboardRoutes.tsx b/src/routes/DashboardRoutes.tsx
index dba11cf69..2508f4a66 100644
--- a/src/routes/DashboardRoutes.tsx
+++ b/src/routes/DashboardRoutes.tsx
@@ -83,17 +83,15 @@ export const DashboardRoutes = (
       <Route
         path={PATHS.repositories.root}
         element={
-          <SelfHostedGuard>
-            <div className={classes.wrapper}>
-              <SecondaryNavigation
-                title="Repositories"
-                items={REPOSITORY_SUBMENU}
-              />
-              <div className={classes.pageContent}>
-                <Outlet />
-              </div>
+          <div className={classes.wrapper}>
+            <SecondaryNavigation
+              title="Repositories"
+              items={REPOSITORY_SUBMENU}
+            />
+            <div className={classes.pageContent}>
+              <Outlet />
             </div>
-          </SelfHostedGuard>
+          </div>
         }
       >
         <Route
@@ -128,13 +126,12 @@ export const DashboardRoutes = (
             </SelfHostedGuard>
           }
         />
+        <Route
+          path={PATHS.repositories.repositoryProfiles}
+          element={<Pages.RepositoryProfilesPage />}
+        />
       </Route>
 
-      <Route
-        path={`${PATHS.repositories.root}/${PATHS.repositories.repositoryProfiles}`}
-        element={<Pages.RepositoryProfilesPage />}
-      />
-
       {/* --- Settings --- */}
       <Route path={PATHS.settings.root}>
         <Route
diff --git a/src/tests/browser.ts b/src/tests/browser.ts
index cef515ab6..3d3d65025 100644
--- a/src/tests/browser.ts
+++ b/src/tests/browser.ts
@@ -20,8 +20,12 @@ const handlers: RequestHandler[] = [
   http.all("*", async ({ request }) => {
     if (
       !request.url.includes(API_URL) &&
-      !request.url.includes(API_URL_OLD) &&
-      !request.url.includes(API_URL_DEB_ARCHIVE)
+      !request.url.includes(API_URL_OLD) &&  !request.url.includes('/v1/')) {
+      return passthrough();
+    }
+
+    if (request.url.match(/\.(ts|tsx|scss)/) 
+        // && !request.url.includes(API_URL_DEB_ARCHIVE)
     ) {
       return passthrough();
     }
diff --git a/src/tests/mocks/publicationTargets.ts b/src/tests/mocks/publicationTargets.ts
new file mode 100644
index 000000000..9a4d0671c
--- /dev/null
+++ b/src/tests/mocks/publicationTargets.ts
@@ -0,0 +1,46 @@
+import type { PublicationTarget } from "@canonical/landscape-openapi";
+
+export const publicationTargets: PublicationTarget[] = [
+  {
+    name: "publicationTargets/aaaaaaaa-0000-0000-0000-000000000001",
+    publicationTargetId: "aaaaaaaa-0000-0000-0000-000000000001",
+    displayName: "prod-s3-us-east",
+    s3: {
+      region: "us-east-1",
+      bucket: "landscape-prod-packages",
+      awsAccessKeyId: "AKIAIOSFODNN7EXAMPLE",
+      awsSecretAccessKey: "wJalrXUtnFEMI/K7MDENG/bPxRfiCYEXAMPLEKEY",
+      prefix: "ubuntu/",
+      acl: "private",
+      storageClass: "STANDARD",
+      encryptionMethod: "AES256",
+      disableMultiDel: false,
+      forceSigV2: false,
+    },
+  },
+  {
+    name: "publicationTargets/bbbbbbbb-0000-0000-0000-000000000002",
+    publicationTargetId: "bbbbbbbb-0000-0000-0000-000000000002",
+    displayName: "staging-s3-eu-west",
+    s3: {
+      region: "eu-west-1",
+      bucket: "landscape-staging-packages",
+      awsAccessKeyId: "AKIAIOSFODNN7EXAMPLE2",
+      awsSecretAccessKey: "wJalrXUtnFEMI/K7MDENG/bPxRfiCYEXAMPLEKEY2",
+      disableMultiDel: true,
+      forceSigV2: false,
+    },
+  },
+  {
+    name: "publicationTargets/cccccccc-0000-0000-0000-000000000003",
+    publicationTargetId: "cccccccc-0000-0000-0000-000000000003",
+    displayName: "swift-internal",
+    swift: {
+      container: "landscape-packages",
+      username: "admin",
+      password: "supersecret",
+      authUrl: "https://keystone.example.com/v3",
+      tenant: "landscape",
+    },
+  },
+];
diff --git a/src/tests/mocks/publications.ts b/src/tests/mocks/publications.ts
index 09a2c9646..b97ba46f3 100644
--- a/src/tests/mocks/publications.ts
+++ b/src/tests/mocks/publications.ts
@@ -1,11 +1,11 @@
 import type { Publication } from "@/features/publications";
-import type { PublicationTarget } from "@/features/publication-targets";
+export { publicationTargets } from "@/tests/mocks/publicationTargets";
 
 export const publications = [
   {
     name: "publications/7b1d5c2f-0c4e-4d8e-8f2f-99d4f2d9a123",
     publicationId: "7b1d5c2f-0c4e-4d8e-8f2f-99d4f2d9a123",
-    publicationTarget: "publicationTargets/primary-us-mirror",
+    publicationTarget: "publicationTargets/aaaaaaaa-0000-0000-0000-000000000001",
     source: "mirrors/ubuntu-archive-mirror",
     displayName: "jammy publication",
     distribution: "jammy",
@@ -18,13 +18,13 @@ export const publications = [
     multiDist: false,
     skipBz2: false,
     skipContents: false,
-    publishTime: "March 12, 2026",
+    publishTime: new Date("March 12, 2026"),
   },
   {
     name: "publications/c9f6355e-c8f3-4e73-ab4c-ef6a4c8af4c0",
     publicationId: "c9f6355e-c8f3-4e73-ab4c-ef6a4c8af4c0",
     displayName: "noble publication",
-    publicationTarget: "publicationTargets/emea-mirror",
+    publicationTarget: "publicationTargets/bbbbbbbb-0000-0000-0000-000000000002",
     source: "locals/aaaa-bbbb-cccc",
     distribution: "noble",
     label: "EMEA publication",
@@ -39,14 +39,14 @@ export const publications = [
     gpgKey: {
       armor: "-----BEGIN PGP PRIVATE KEY BLOCK-----...",
     },
-    publishTime: "March 12, 2026",
+    publishTime: new Date("March 12, 2026"),
   },
   {
     name: "publications/g8h8888e-c8f8-8e88-ab8c-ef8a8c8af8c8",
     publicationId: "g8h8888e-c8f8-8e88-ab8c-ef8a8c8af8c8",
     displayName: "local publication",
-    publicationTarget: "publicationTargets/local",
-    source: "locals/aaaa-bbbb-cccc",
+    publicationTarget: "publicationTargets/cccccccc-0000-0000-0000-000000000003",
+    source: "locals/bbbb-cccc-dddd",
     distribution: "noble",
     label: "Local publication",
     origin: "Canonical",
@@ -57,51 +57,6 @@ export const publications = [
     multiDist: false,
     skipBz2: true,
     skipContents: true,
-    publishTime: "April 20, 2026",
-  },
-] as const satisfies Publication[];
-
-export const publicationTargets: PublicationTarget[] = [
-  {
-    name: "publicationTargets/aaaaaaaa-0000-0000-0000-000000000001",
-    publication_target_id: "aaaaaaaa-0000-0000-0000-000000000001",
-    displayName: "prod-s3-us-east",
-    s3: {
-      region: "us-east-1",
-      bucket: "landscape-prod-packages",
-      awsAccessKeyId: "AKIAIOSFODNN7EXAMPLE",
-      awsSecretAccessKey: "wJalrXUtnFEMI/K7MDENG/bPxRfiCYEXAMPLEKEY",
-      prefix: "ubuntu/",
-      acl: "private",
-      storageClass: "STANDARD",
-      encryptionMethod: "AES256",
-      disableMultiDel: false,
-      forceSigV2: false,
-    },
-  },
-  {
-    name: "publicationTargets/bbbbbbbb-0000-0000-0000-000000000002",
-    publication_target_id: "bbbbbbbb-0000-0000-0000-000000000002",
-    displayName: "staging-s3-eu-west",
-    s3: {
-      region: "eu-west-1",
-      bucket: "landscape-staging-packages",
-      awsAccessKeyId: "AKIAIOSFODNN7EXAMPLE2",
-      awsSecretAccessKey: "wJalrXUtnFEMI/K7MDENG/bPxRfiCYEXAMPLEKEY2",
-      disableMultiDel: true,
-      forceSigV2: false,
-    },
-  },
-  {
-    name: "publicationTargets/cccccccc-0000-0000-0000-000000000003",
-    publication_target_id: "cccccccc-0000-0000-0000-000000000003",
-    displayName: "swift-internal",
-    swift: {
-      container: "landscape-packages",
-      username: "admin",
-      password: "supersecret",
-      authUrl: "https://keystone.example.com/v3",
-      tenant: "landscape",
-    },
+    publishTime: new Date("April 20, 2026"),
   },
-] as const;
+] satisfies Publication[];
diff --git a/src/tests/server/handlers/index.ts b/src/tests/server/handlers/index.ts
index f19a1336c..4b24a68e5 100644
--- a/src/tests/server/handlers/index.ts
+++ b/src/tests/server/handlers/index.ts
@@ -42,6 +42,7 @@ import upgradeProfile from "./upgradeProfile";
 import user from "./user";
 import userSettings from "./userSettings";
 import usn from "./usn";
+import publicationTargets from "./publicationTargets";
 import wsl from "./wsl";
 import wslProfiles from "./wslProfiles";
 
@@ -89,6 +90,7 @@ export default [
   ...user,
   ...userSettings,
   ...usn,
+  ...publicationTargets,
   ...wsl,
   ...wslProfiles,
   ...features,
diff --git a/src/tests/server/handlers/publicationTargets.ts b/src/tests/server/handlers/publicationTargets.ts
new file mode 100644
index 000000000..35d270ade
--- /dev/null
+++ b/src/tests/server/handlers/publicationTargets.ts
@@ -0,0 +1,55 @@
+import { API_URL_DEB_ARCHIVE } from "@/constants";
+import type { PublicationTarget } from "@/features/publication-targets";
+import { publicationTargets } from "@/tests/mocks/publicationTargets";
+import { http, HttpResponse } from "msw";
+
+export default [
+  http.post(`${API_URL_DEB_ARCHIVE}publicationTargets`, async ({ request }) => {
+    const body = (await request.json()) as Omit<
+      PublicationTarget,
+      "name" | "publicationTargetId"
+    >;
+    const now = Date.now();
+    const newTarget: PublicationTarget = {
+      name: `publicationTargets/new-${now}`,
+      publicationTargetId: `new-${now}`,
+      ...body,
+    };
+    return HttpResponse.json(newTarget, { status: 201 });
+  }),
+
+  http.delete(`${API_URL_DEB_ARCHIVE}publicationTargets/:id`, ({ params }) => {
+    const idx = publicationTargets.findIndex(
+      (t) => t.name === `publicationTargets/${params.id}`,
+    );
+    if (idx !== -1) publicationTargets.splice(idx, 1);
+    return new HttpResponse(null, { status: 204 });
+  }),
+
+  http.patch(
+    `${API_URL_DEB_ARCHIVE}publicationTargets/:id`,
+    async ({ params, request }) => {
+      const body = (await request.json()) as Partial<PublicationTarget>;
+      const idx = publicationTargets.findIndex(
+        (t) => t.name === `publicationTargets/${params.id}`,
+      );
+      const existing = publicationTargets[idx];
+      if (idx === -1 || !existing) return new HttpResponse(null, { status: 404 });
+      const updated: PublicationTarget = {
+        ...existing,
+        ...body,
+        ...(body.s3 ? { s3: { ...existing.s3, ...body.s3 } } : {}),
+        ...(body.swift ? { swift: { ...existing.swift, ...body.swift } } : {}),
+      } as PublicationTarget;
+      publicationTargets[idx] = updated;
+      return HttpResponse.json(updated);
+    },
+  ),
+
+  // Fallback GET for integration tests that don't mock useGetPublicationTargets directly
+  http.get(`${API_URL_DEB_ARCHIVE}publicationTargets`, () => {
+    return HttpResponse.json({
+      publicationTargets,
+    });
+  }),
+];
\ No newline at end of file
diff --git a/src/tests/server/handlers/publications.ts b/src/tests/server/handlers/publications.ts
index 97c2ed846..22a2bdc18 100644
--- a/src/tests/server/handlers/publications.ts
+++ b/src/tests/server/handlers/publications.ts
@@ -4,7 +4,8 @@ import type {
   BatchGetPublicationTargetsResponse,
 } from "@/features/publications";
 import { getEndpointStatus } from "@/tests/controllers/controller";
-import { publications, publicationTargets } from "@/tests/mocks/publications";
+import { publications } from "@/tests/mocks/publications";
+import { publicationTargets } from "@/tests/mocks/publicationTargets";
 import type { StrictResponse } from "msw";
 import { delay, http, HttpResponse } from "msw";
 import {
diff --git a/vite.config.ts b/vite.config.ts
index fdf9e4e99..5920b8fc5 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,4 +1,4 @@
-import fs from "fs";
+ import fs from "fs";
 import * as path from "path";
 import { defineConfig, loadEnv } from "vite";
 import react from "@vitejs/plugin-react";
@@ -46,12 +46,19 @@ export default defineConfig(({ mode }) => {
           changeOrigin: true,
           secure: false,
         },
-        "/debarchive": {
+        ...(env.VITE_MSW_ENABLED !== "true" && {
+          "/debarchive": {
           target: env.VITE_DEBARCHIVE_PROXY_TARGET || "http://localhost:8000",
           changeOrigin: true,
           secure: false,
           rewrite: (path) => path.replace(/^\/debarchive/, ""),
         },
+        "/v1": {
+            target: env.VITE_API_DEBARCHIVE_PROXY_TARGET || "http://localhost:8000",
+            changeOrigin: true,
+            secure: false,
+          },
+        }),
       },
     },
   };

From a291714b3cbf0a51840933fa869f3e508b188646 Mon Sep 17 00:00:00 2001
From: Marc Bucchieri <marc.bucchieri@canonical.com>
Date: Tue, 28 Apr 2026 07:16:41 -0700
Subject: [PATCH 33/42] remove add publication button from empty state, fix
 cancel button on add form

Co-authored-by: Copilot <copilot@github.com>
---
 .../AddPublicationTargetForm.tsx              |  1 +
 .../PublicationTargetContainer.tsx            | 26 -----------
 .../PublicationTargetsPage.tsx                | 43 ++++++++++++++++---
 3 files changed, 38 insertions(+), 32 deletions(-)

diff --git a/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.tsx b/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.tsx
index d1c585b54..0a532f7a1 100644
--- a/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.tsx
+++ b/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.tsx
@@ -163,6 +163,7 @@ const AddPublicationTargetForm: FC = () => {
       <SidePanelFormButtons
         submitButtonDisabled={formik.isSubmitting}
         submitButtonText="Add publication target"
+        onCancel={closeForm}
       />
     </Form>
   );
diff --git a/src/features/publication-targets/components/PublicationTargetContainer/PublicationTargetContainer.tsx b/src/features/publication-targets/components/PublicationTargetContainer/PublicationTargetContainer.tsx
index 6c1834c65..634968f87 100644
--- a/src/features/publication-targets/components/PublicationTargetContainer/PublicationTargetContainer.tsx
+++ b/src/features/publication-targets/components/PublicationTargetContainer/PublicationTargetContainer.tsx
@@ -1,8 +1,6 @@
-import EmptyState from "@/components/layout/EmptyState";
 import LoadingState from "@/components/layout/LoadingState";
 import type { FC } from "react";
 import useGetPublicationTargets from "../../api/useGetPublicationTargets";
-import PublicationTargetAddButton from "../PublicationTargetAddButton";
 import PublicationTargetList from "../PublicationTargetList";
 
 const PublicationTargetContainer: FC = () => {
@@ -13,30 +11,6 @@ const PublicationTargetContainer: FC = () => {
     return <LoadingState />;
   }
 
-  if (publicationTargets.length === 0) {
-    return (
-      <EmptyState
-        title="You don't have any publication targets yet"
-        // icon="connected"
-        body={
-          <>
-            <p className="u-no-margin--bottom">
-              On this page you will find all publication targets that you create to publish mirrors to.
-            </p>
-            <a
-              href="https://documentation.ubuntu.com/landscape/explanation/features/repository-mirroring"
-              target="_blank"
-              rel="nofollow noopener noreferrer"
-            >
-              Learn more about repository mirroring
-            </a>
-          </>
-        }
-        cta={[<PublicationTargetAddButton key="add" />]}
-      />
-    );
-  }
-
   return <PublicationTargetList targets={publicationTargets} />;
 };
 
diff --git a/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx b/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx
index 5dfaa80d3..9c927ff0c 100644
--- a/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx
+++ b/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx
@@ -1,3 +1,4 @@
+import EmptyState from "@/components/layout/EmptyState";
 import PageContent from "@/components/layout/PageContent";
 import PageHeader from "@/components/layout/PageHeader";
 import PageMain from "@/components/layout/PageMain";
@@ -33,14 +34,44 @@ const PublicationTargetsPage: FC = () => {
 
   const viewTarget = publicationTargets.find((t) => t.publicationTargetId === name);
 
+  const addButton = <PublicationTargetAddButton key="add" />;
+
+  const { actions, children, hasTable } = publicationTargets.length
+    ? {
+        actions: [addButton],
+        children: <PublicationTargetContainer />,
+        hasTable: true as const,
+      }
+    : {
+        actions: undefined,
+        children: (
+          <EmptyState
+            title="You don't have any publication targets yet"
+            body={
+              <>
+                <p className="u-no-margin--bottom">
+                  On this page you will find all publication targets that you create to publish mirrors to.
+                </p>
+                <a
+                  href="https://documentation.ubuntu.com/landscape/explanation/features/repository-mirroring"
+                  target="_blank"
+                  rel="nofollow noopener noreferrer"
+                >
+                  Learn more about repository mirroring
+                </a>
+              </>
+            }
+            cta={[addButton]}
+          />
+        ),
+        hasTable: undefined,
+      };
+
   return (
     <PageMain>
-      <PageHeader
-        title="Publication targets"
-        actions={[<PublicationTargetAddButton key="add" />]}
-      />
-      <PageContent hasTable>
-        <PublicationTargetContainer />
+      <PageHeader title="Publication targets" actions={actions} />
+      <PageContent hasTable={hasTable}>
+        {children}
       </PageContent>
 
       <SidePanel

From d9f168312333aaeb69c1cd4f746fa8a26c55d064 Mon Sep 17 00:00:00 2001
From: Marc Bucchieri <marc.bucchieri@canonical.com>
Date: Tue, 28 Apr 2026 08:04:57 -0700
Subject: [PATCH 34/42] fix: SecondaryNavigation updates (#546)

## Summary

Fixed failing test for SecondaryNavigation.tsx and updated styles to
keep it fixed vertically.

## Release Impact

According to the [Landscape Server Release
Cycle](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `deb-archive`
- **Version Impact**:
  - [X] Patch (Fix)
  - [ ] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [X] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [X] **UI Verified**: I have verified the changes locally.
- [X] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.

---------

Co-authored-by: Copilot <copilot@github.com>
---
 .../Navigation/Navigation.module.scss         |  3 +-
 .../NavigationExpandable.tsx                  |  8 ++---
 .../NavigationRoute/NavigationRoute.tsx       |  6 ++--
 .../SecondaryNavigation.test.tsx              | 31 +++++++++++++++++++
 .../SecondaryNavigation.tsx                   |  2 +-
 5 files changed, 41 insertions(+), 9 deletions(-)

diff --git a/src/templates/dashboard/Navigation/Navigation.module.scss b/src/templates/dashboard/Navigation/Navigation.module.scss
index 1e3e1032f..fd452aa3a 100644
--- a/src/templates/dashboard/Navigation/Navigation.module.scss
+++ b/src/templates/dashboard/Navigation/Navigation.module.scss
@@ -57,7 +57,8 @@
     width: $sph--large;
   }
 
-  &[aria-expanded="false"] {
+  &[aria-expanded="false"],
+  &.collapsedAccordionButton {
     &::after {
       transform: rotate(-90deg);
     }
diff --git a/src/templates/dashboard/Navigation/components/NavigationExpandable/NavigationExpandable.tsx b/src/templates/dashboard/Navigation/components/NavigationExpandable/NavigationExpandable.tsx
index 14429a674..479422950 100644
--- a/src/templates/dashboard/Navigation/components/NavigationExpandable/NavigationExpandable.tsx
+++ b/src/templates/dashboard/Navigation/components/NavigationExpandable/NavigationExpandable.tsx
@@ -7,8 +7,8 @@ import { getPathToExpand } from "@/templates/dashboard/Navigation/helpers";
 import NavigationRoute from "@/templates/dashboard/Navigation/components/NavigationRoute";
 import NavigationExpandableParent from "@/templates/dashboard/Navigation/components/NavigationExpandableParent";
 import { useMediaQuery } from "usehooks-ts";
-import classes from "../../Navigation.module.scss";
 import classNames from "classnames";
+import classes from "../../Navigation.module.scss";
 
 interface NavigationExpandableProps {
   readonly item: MenuItem;
@@ -31,10 +31,8 @@ const NavigationExpandable: FC<NavigationExpandableProps> = ({ item }) => {
     return (
       <NavigationRoute
         item={item}
-        className={classNames(
-          classes.accordionButton,
-          "p-side-navigation__link",
-        )}
+        className={classNames(classes.accordionButton, classes.collapsedAccordionButton)}
+        withLinkStyle={false}
       />
     );
   }
diff --git a/src/templates/dashboard/Navigation/components/NavigationRoute/NavigationRoute.tsx b/src/templates/dashboard/Navigation/components/NavigationRoute/NavigationRoute.tsx
index febdb1935..5eab42705 100644
--- a/src/templates/dashboard/Navigation/components/NavigationRoute/NavigationRoute.tsx
+++ b/src/templates/dashboard/Navigation/components/NavigationRoute/NavigationRoute.tsx
@@ -9,16 +9,18 @@ interface NavigationRouteProps {
   readonly item: MenuItem;
   readonly current?: boolean;
   readonly className?: string;
+  readonly withLinkStyle?: boolean;
 }
 
 const NavigationRoute: FC<NavigationRouteProps> = ({
   item,
   current,
   className,
+  withLinkStyle = true,
 }) => {
   return (
     <Link
-      className={classNames("p-side-navigation__link", classes.link, className)}
+      className={classNames("p-side-navigation__link", { [classes.link]: withLinkStyle }, className)}
       to={item.path}
       aria-current={current ? "page" : undefined}
     >
@@ -31,7 +33,7 @@ const NavigationRoute: FC<NavigationRouteProps> = ({
         />
       )}
       <span
-        className={classNames("p-side-navigation__label", classes.label, {
+        className={classNames("p-side-navigation__label", classes.label,{
           [classes.hasBadge]: item.badge !== undefined && item.badge.count > 0,
         })}
       >
diff --git a/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.test.tsx b/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.test.tsx
index fa7028790..af77bea76 100644
--- a/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.test.tsx
+++ b/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.test.tsx
@@ -4,6 +4,7 @@ import { describe, expect, it, vi } from "vitest";
 import SecondaryNavigation from "./SecondaryNavigation";
 import { ACCOUNT_SETTINGS } from "./constants";
 import { PATHS, ROUTES } from "@/libs/routes";
+import { useMediaQuery } from "usehooks-ts";
 
 // Mock useMediaQuery to simulate large screen
 vi.mock("usehooks-ts", async () => {
@@ -57,4 +58,34 @@ describe("SecondaryNavigation", () => {
       screen.getByRole("link", { name: ACCOUNT_SETTINGS.items[1].label }),
     ).not.toHaveClass(/isActive/);
   });
+
+  it("renders nothing on small screens", () => {
+    vi.mocked(useMediaQuery).mockImplementation(() => false);
+
+    renderWithProviders(
+      <SecondaryNavigation
+        title={ACCOUNT_SETTINGS.label}
+        items={ACCOUNT_SETTINGS.items}
+      />,
+    );
+
+    expect(screen.queryByRole("navigation")).not.toBeInTheDocument();
+
+    vi.mocked(useMediaQuery).mockImplementation(() => true);
+  });
+
+  it("renders children when provided", () => {
+    renderWithProviders(
+      <SecondaryNavigation
+        title={ACCOUNT_SETTINGS.label}
+        items={ACCOUNT_SETTINGS.items}
+      >
+        <button>Footer action</button>
+      </SecondaryNavigation>,
+    );
+
+    expect(
+      screen.getByRole("button", { name: "Footer action" }),
+    ).toBeInTheDocument();
+  });
 });
diff --git a/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.tsx b/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.tsx
index ba81f69e2..7f8f4f1e8 100644
--- a/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.tsx
+++ b/src/templates/dashboard/SecondaryNavigation/SecondaryNavigation.tsx
@@ -63,7 +63,7 @@ export const SecondaryNavigation: FC<SecondaryNavigationProps> = ({
                     className={classNames(
                       "p-side-navigation__link",
                       classes.secondaryNavigation__link,
-                      isActive && classes.isActive,
+                      { [classes.isActive]: isActive },
                     )}
                     to={item.path}
                   >

From 54670949b3f5cba2ae2d1132857d5e13436900dd Mon Sep 17 00:00:00 2001
From: Marc Bucchieri <marc.bucchieri@canonical.com>
Date: Tue, 28 Apr 2026 08:15:48 -0700
Subject: [PATCH 35/42] don't open side panel for invalid target name

Co-authored-by: Copilot <copilot@github.com>
---
 .../publication-targets/PublicationTargetsPage.tsx           | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx b/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx
index 9c927ff0c..13545cd0e 100644
--- a/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx
+++ b/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx
@@ -76,7 +76,10 @@ const PublicationTargetsPage: FC = () => {
 
       <SidePanel
         onClose={createPageParamsSetter({ sidePath: [], name: "" })}
-        isOpen={!!lastSidePathSegment}
+        isOpen={
+          lastSidePathSegment === "add" ||
+          (!!lastSidePathSegment && !!viewTarget)
+        }
         size="small"
       >
         {lastSidePathSegment === "add" && (

From 8c201dae26fc896c62174a82ce86b16f05ec34e9 Mon Sep 17 00:00:00 2001
From: Marc Bucchieri <marc.bucchieri@canonical.com>
Date: Tue, 28 Apr 2026 08:41:45 -0700
Subject: [PATCH 36/42] add source form style changes

---
 .../RepositoryProfileSourceForm/RepositoryProfileSourceForm.tsx | 2 +-
 .../RepositoryProfileSourceFormOverlay.module.scss              | 1 -
 2 files changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.tsx b/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.tsx
index b74e550e3..27c9fe99b 100644
--- a/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.tsx
@@ -63,7 +63,7 @@ const RepositoryProfileSourceForm: FC<RepositoryProfileSourceFormProps> = ({
         {...formik.getFieldProps("gpg_key_name")}
       />
       <SidePanelFormButtons
-        submitButtonText="Save changes"
+        submitButtonText="Add source"
         onCancel={onBack}
       />
     </Form>
diff --git a/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.module.scss b/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.module.scss
index a9c74d961..a51976dd9 100644
--- a/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.module.scss
+++ b/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.module.scss
@@ -13,7 +13,6 @@
 .content {
   flex-grow: 1;
   overflow-y: auto;
-  padding: 1rem 1.5rem;
 }
 
 .title {

From 324b114d153299f3369cb0c319dec6033978d198 Mon Sep 17 00:00:00 2001
From: Yurii Vasyliev <yurii.vasyliev@canonical.com>
Date: Tue, 28 Apr 2026 18:33:41 +0200
Subject: [PATCH 37/42] feat: unblock add mirror form while archive info loads

---
 .../layout/Blocks/Item/Item.module.scss       |  10 ++
 .../layout/Blocks/Item/Item.test.tsx          |  14 +++
 src/components/layout/Blocks/Item/Item.tsx    |  35 ++++--
 .../mirrors/api/useGetUbuntuArchiveInfo.ts    |   7 +-
 .../mirrors/api/useGetUbuntuEsmInfo.ts        |   4 +-
 .../AddMirrorForm/AddMirrorForm.test.tsx      | 103 ++++++++++++++++--
 .../AddMirrorForm/AddMirrorForm.tsx           |  75 +++++++++++--
 .../components/AddMirrorForm/helpers.ts       |  17 +--
 .../SelectableMirrorContentsBlock.tsx         |   9 +-
 9 files changed, 230 insertions(+), 44 deletions(-)

diff --git a/src/components/layout/Blocks/Item/Item.module.scss b/src/components/layout/Blocks/Item/Item.module.scss
index 876ce6c98..b85bbc6d7 100644
--- a/src/components/layout/Blocks/Item/Item.module.scss
+++ b/src/components/layout/Blocks/Item/Item.module.scss
@@ -14,3 +14,13 @@
 .denseHeading {
   margin-bottom: 0.5rem;
 }
+
+// When a description is provided alongside the title, sit them tight together
+// and let the heading wrapper handle the gap to the children.
+.titleWithDescription {
+  margin-bottom: 0;
+}
+
+.description {
+  margin: 0;
+}
diff --git a/src/components/layout/Blocks/Item/Item.test.tsx b/src/components/layout/Blocks/Item/Item.test.tsx
index f90a194b8..10132d901 100644
--- a/src/components/layout/Blocks/Item/Item.test.tsx
+++ b/src/components/layout/Blocks/Item/Item.test.tsx
@@ -18,4 +18,18 @@ describe("Blocks/Item", () => {
     renderWithProviders(<Item>content</Item>);
     expect(screen.queryByRole("heading")).not.toBeInTheDocument();
   });
+
+  it("renders description when provided", () => {
+    renderWithProviders(
+      <Item title="Section Title" description="Loading helper text">
+        content
+      </Item>,
+    );
+    expect(screen.getByText("Loading helper text")).toBeInTheDocument();
+  });
+
+  it("does not render description when not provided", () => {
+    renderWithProviders(<Item title="Section Title">content</Item>);
+    expect(screen.queryByText("Loading helper text")).not.toBeInTheDocument();
+  });
 });
diff --git a/src/components/layout/Blocks/Item/Item.tsx b/src/components/layout/Blocks/Item/Item.tsx
index 1796d49ba..fe2919032 100644
--- a/src/components/layout/Blocks/Item/Item.tsx
+++ b/src/components/layout/Blocks/Item/Item.tsx
@@ -6,6 +6,7 @@ import { useBlocksDense } from "../Blocks";
 export interface ItemProps {
   readonly children: ReactNode;
   readonly title?: string;
+  readonly description?: ReactNode;
   readonly action?: ReactNode;
   readonly titleClassName?: string;
   readonly containerClassName?: string;
@@ -14,6 +15,7 @@ export interface ItemProps {
 const Item: FC<ItemProps> = ({
   children,
   title,
+  description,
   action,
   titleClassName,
   containerClassName,
@@ -21,22 +23,35 @@ const Item: FC<ItemProps> = ({
   const dense = useBlocksDense();
   return (
     <section className={classNames(classes.item, containerClassName)}>
-    {(title || action) && (
-      <div className={classes.heading}>
+      {(title || description || action) && (
+        <div className={classes.heading}>
           {title && (
             <h4
               className={classNames(
-            classes.heading,
-            { [classes.denseHeading as string]: dense },
-            "p-heading--5",
-            titleClassName,
-          )}
+                classes.heading,
+                { [classes.denseHeading as string]: dense },
+                {
+                  [classes.titleWithDescription as string]: !!description,
+                },
+                "p-heading--5",
+                titleClassName,
+              )}
             >
               {title}
             </h4>
-        )}
-        {action}
-      </div>
+          )}
+          {description && (
+            <p
+              className={classNames(
+                "p-text--small u-text--muted",
+                classes.description,
+              )}
+            >
+              {description}
+            </p>
+          )}
+          {action}
+        </div>
       )}
       {children}
     </section>
diff --git a/src/features/mirrors/api/useGetUbuntuArchiveInfo.ts b/src/features/mirrors/api/useGetUbuntuArchiveInfo.ts
index 3570c730b..89d95d943 100644
--- a/src/features/mirrors/api/useGetUbuntuArchiveInfo.ts
+++ b/src/features/mirrors/api/useGetUbuntuArchiveInfo.ts
@@ -1,7 +1,7 @@
 import useFetch from "@/hooks/useFetch";
 import type { ApiError } from "@/types/api/ApiError";
 import type { UseQueryOptions } from "@tanstack/react-query";
-import { useSuspenseQuery } from "@tanstack/react-query";
+import { useQuery } from "@tanstack/react-query";
 import type { AxiosError, AxiosResponse } from "axios";
 import type { UbuntuArchiveInfo } from "../types/UbuntuArchiveInfo";
 
@@ -13,10 +13,7 @@ export function useGetUbuntuArchiveInfo(
 ) {
   const authFetch = useFetch();
 
-  return useSuspenseQuery<
-    AxiosResponse<UbuntuArchiveInfo>,
-    AxiosError<ApiError>
-  >({
+  return useQuery<AxiosResponse<UbuntuArchiveInfo>, AxiosError<ApiError>>({
     queryKey: ["ubuntuArchiveInfo", "archive"],
     queryFn: async () =>
       authFetch.get("repository/ubuntu-archive-info", {
diff --git a/src/features/mirrors/api/useGetUbuntuEsmInfo.ts b/src/features/mirrors/api/useGetUbuntuEsmInfo.ts
index 4638208fa..59bfde4d6 100644
--- a/src/features/mirrors/api/useGetUbuntuEsmInfo.ts
+++ b/src/features/mirrors/api/useGetUbuntuEsmInfo.ts
@@ -1,7 +1,7 @@
 import useFetch from "@/hooks/useFetch";
 import type { ApiError } from "@/types/api/ApiError";
 import type { UseQueryOptions } from "@tanstack/react-query";
-import { useSuspenseQuery } from "@tanstack/react-query";
+import { useQuery } from "@tanstack/react-query";
 import type { AxiosError, AxiosResponse } from "axios";
 import type { UbuntuArchiveInfo } from "../types/UbuntuArchiveInfo";
 
@@ -17,7 +17,7 @@ export function useGetUbuntuEsmInfo(
 ) {
   const authFetch = useFetch();
 
-  return useSuspenseQuery<AxiosResponse<UbuntuESMInfo>, AxiosError<ApiError>>({
+  return useQuery<AxiosResponse<UbuntuESMInfo>, AxiosError<ApiError>>({
     queryKey: ["ubuntuArchiveInfo", "esm"],
     queryFn: async () =>
       authFetch.get("repository/ubuntu-archive-info", {
diff --git a/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.test.tsx b/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.test.tsx
index 358bcc029..76f6372bb 100644
--- a/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.test.tsx
+++ b/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.test.tsx
@@ -1,14 +1,18 @@
 import { renderWithProviders } from "@/tests/render";
 import AddMirrorForm from "./AddMirrorForm";
 import userEvent from "@testing-library/user-event";
-import { fireEvent, screen } from "@testing-library/react";
-import { Suspense } from "react";
-import LoadingState from "@/components/layout/LoadingState";
-import { expectLoadingState } from "@/tests/helpers";
-import { beforeEach, expect, vi } from "vitest";
+import {
+  fireEvent,
+  screen,
+  waitFor,
+  waitForElementToBeRemoved,
+} from "@testing-library/react";
+import { beforeEach, describe, expect, it, vi } from "vitest";
 import { UBUNTU_SNAPSHOTS_HOST } from "../../constants";
 import type { CreateMirrorData } from "@canonical/landscape-openapi";
 
+const PULLING_NOTE = /pulling and parsing repository data/i;
+
 const mockCreateMirror = vi.fn();
 
 vi.mock("../../api", async () => {
@@ -28,13 +32,15 @@ describe("AddMirrorForm", () => {
   beforeEach(async () => {
     mockCreateMirror.mockClear();
 
-    renderWithProviders(
-      <Suspense fallback={<LoadingState />}>
-        <AddMirrorForm />
-      </Suspense>,
-    );
+    renderWithProviders(<AddMirrorForm />);
 
-    await expectLoadingState();
+    // The form renders immediately; wait for the "pulling…" note in the
+    // Mirror contents block to disappear so the data-dependent dropdowns are
+    // populated before the test interacts with them.
+    await waitForElementToBeRemoved(
+      () => screen.queryByText(PULLING_NOTE),
+      { timeout: 2000 },
+    );
     await user.type(screen.getByLabelText("Name"), "Name");
   });
 
@@ -111,3 +117,78 @@ describe("AddMirrorForm", () => {
     );
   });
 });
+
+describe("AddMirrorForm loading state", () => {
+  const user = userEvent.setup();
+
+  beforeEach(() => {
+    mockCreateMirror.mockClear();
+  });
+
+  it("renders the form immediately with a muted 'pulling' note while archive info is fetched", async () => {
+    renderWithProviders(<AddMirrorForm />);
+
+    // The note appears straight away under the "Mirror contents" heading.
+    expect(screen.getByText(PULLING_NOTE)).toBeInTheDocument();
+
+    // The note disappears once the queries resolve.
+    await waitForElementToBeRemoved(() => screen.queryByText(PULLING_NOTE), {
+      timeout: 2000,
+    });
+    expect(screen.queryByText(PULLING_NOTE)).not.toBeInTheDocument();
+  });
+
+  it("lets users fill the Name field while archive info is still loading and preserves the value after hydration", async () => {
+    renderWithProviders(<AddMirrorForm />);
+
+    // Sanity: still loading.
+    expect(screen.getByText(PULLING_NOTE)).toBeInTheDocument();
+
+    // Name and Source type are interactable while loading.
+    const nameField = screen.getByLabelText("Name");
+    expect(nameField).toBeEnabled();
+    expect(screen.getByLabelText("Source type")).toBeEnabled();
+
+    await user.type(nameField, "early-mirror");
+    expect(nameField).toHaveValue("early-mirror");
+
+    // Wait for the queries to resolve and the form to hydrate.
+    await waitForElementToBeRemoved(() => screen.queryByText(PULLING_NOTE), {
+      timeout: 2000,
+    });
+
+    // The user's typed Name survives hydration.
+    expect(screen.getByLabelText("Name")).toHaveValue("early-mirror");
+  });
+
+  it("disables the Distribution dropdown while archive info is loading and re-enables it once data arrives", async () => {
+    renderWithProviders(<AddMirrorForm />);
+
+    // While loading, the Distribution select is rendered but disabled.
+    const distributionField = screen.getByLabelText("Distribution");
+    expect(distributionField).toBeDisabled();
+
+    await waitForElementToBeRemoved(() => screen.queryByText(PULLING_NOTE), {
+      timeout: 2000,
+    });
+
+    // After hydration, the Distribution dropdown is interactive again.
+    await waitFor(() => {
+      expect(screen.getByLabelText("Distribution")).not.toBeDisabled();
+    });
+  });
+
+  it("hides the 'pulling' note when the user picks the third-party source type during loading", async () => {
+    renderWithProviders(<AddMirrorForm />);
+    expect(screen.getByText(PULLING_NOTE)).toBeInTheDocument();
+
+    await user.selectOptions(
+      screen.getByLabelText("Source type"),
+      "Third party",
+    );
+
+    // Third-party doesn't depend on the archive/ESM info, so the loading
+    // affordance shouldn't appear under the Mirror contents heading.
+    expect(screen.queryByText(PULLING_NOTE)).not.toBeInTheDocument();
+  });
+});
diff --git a/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.tsx b/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.tsx
index 42b8a1d32..68846a681 100644
--- a/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.tsx
+++ b/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.tsx
@@ -13,7 +13,7 @@ import {
   Tooltip,
 } from "@canonical/react-components";
 import { useFormik } from "formik";
-import type { ComponentProps, FC } from "react";
+import { type ComponentProps, type FC, useEffect, useRef } from "react";
 import type { FormProps } from "./types";
 import SidePanel from "@/components/layout/SidePanel/SidePanel";
 import Blocks from "@/components/layout/Blocks";
@@ -36,11 +36,20 @@ const AddMirrorForm: FC = () => {
   const { notify } = useNotify();
   const { createPageParamsSetter } = usePageParams();
 
-  const ubuntuArchiveInfo = useGetUbuntuArchiveInfo().data.data;
-  const ubuntuEsmInfo = useGetUbuntuEsmInfo().data.data.results;
+  const ubuntuArchiveQuery = useGetUbuntuArchiveInfo();
+  const ubuntuEsmQuery = useGetUbuntuEsmInfo();
   const createMirror = useCreateMirror().mutateAsync;
   const close = createPageParamsSetter({ sidePath: [] });
 
+  const ubuntuArchiveInfo = ubuntuArchiveQuery.data?.data;
+  const ubuntuEsmInfo = ubuntuEsmQuery.data?.data.results ?? [];
+  // The form renders immediately so users can start filling in the type-agnostic
+  // fields (Name, Source type) while we fetch the repository structure. The
+  // Mirror contents block stays disabled with a loading note until both
+  // archive and ESM info responses come back.
+  const isMirrorContentsLoading =
+    ubuntuArchiveQuery.isPending || ubuntuEsmQuery.isPending;
+
   const formik = useFormik<FormProps>({
     initialValues: getInitialValues({
       ubuntuArchiveInfo,
@@ -118,6 +127,42 @@ const AddMirrorForm: FC = () => {
     disabled: !isArchiveInfoValid(proService),
   }));
 
+  // Once the archive/ESM info finishes loading, hydrate the data-dependent
+  // fields (distribution, components, architectures, pro service) for the
+  // user's currently selected source type while preserving anything they have
+  // already typed (Name, Source type, download options, token).
+  const hasHydratedRef = useRef(false);
+  useEffect(() => {
+    if (isMirrorContentsLoading || hasHydratedRef.current) {
+      return;
+    }
+    hasHydratedRef.current = true;
+
+    if (formik.values.sourceType === "third-party") {
+      return;
+    }
+
+    void formik.setValues({
+      ...getInitialValues({
+        sourceType: formik.values.sourceType,
+        ubuntuArchiveInfo,
+        ubuntuEsmInfo,
+      }),
+      name: formik.values.name,
+      downloadUdebPackages: formik.values.downloadUdebPackages,
+      downloadInstallerFiles: formik.values.downloadInstallerFiles,
+      downloadSources: formik.values.downloadSources,
+      ...(formik.values.sourceType === "ubuntu-pro" && {
+        token: formik.values.token,
+      }),
+      ...(formik.values.sourceType === "ubuntu-snapshots" &&
+        formik.values.snapshotDate && {
+          snapshotDate: formik.values.snapshotDate,
+        }),
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [isMirrorContentsLoading]);
+
   return (
     <>
       <SidePanel.Header>Add mirror</SidePanel.Header>
@@ -139,17 +184,23 @@ const AddMirrorForm: FC = () => {
                   {
                     label: "Ubuntu archive",
                     value: "ubuntu-archive",
-                    disabled: !isArchiveInfoValid(ubuntuArchiveInfo),
+                    disabled:
+                      !!ubuntuArchiveInfo &&
+                      !isArchiveInfoValid(ubuntuArchiveInfo),
                   },
                   {
                     label: "Ubuntu snapshots",
                     value: "ubuntu-snapshots",
-                    disabled: !isArchiveInfoValid(ubuntuArchiveInfo),
+                    disabled:
+                      !!ubuntuArchiveInfo &&
+                      !isArchiveInfoValid(ubuntuArchiveInfo),
                   },
                   {
                     label: "Ubuntu Pro",
                     value: "ubuntu-pro",
-                    disabled: !ubuntuEsmInfo.some(isArchiveInfoValid),
+                    disabled:
+                      !ubuntuEsmQuery.isPending &&
+                      !ubuntuEsmInfo.some(isArchiveInfoValid),
                   },
                   { label: "Third party", value: "third-party" },
                 ]}
@@ -195,7 +246,15 @@ const AddMirrorForm: FC = () => {
                 />
               )}
             </Blocks.Item>
-            <Blocks.Item title="Mirror contents">
+            <Blocks.Item
+              title="Mirror contents"
+              description={
+                isMirrorContentsLoading &&
+                formik.values.sourceType !== "third-party"
+                  ? "Pulling and parsing repository data…"
+                  : undefined
+              }
+            >
               {formik.values.sourceType === "ubuntu-snapshots" && (
                 <Input
                   type="date"
@@ -211,6 +270,7 @@ const AddMirrorForm: FC = () => {
                   required
                   options={proServiceOptions}
                   {...formik.getFieldProps("proService")}
+                  disabled={isMirrorContentsLoading}
                   error={getFormikError(formik, "proService")}
                 />
               )}
@@ -273,6 +333,7 @@ const AddMirrorForm: FC = () => {
                   }
                   ubuntuArchiveInfo={ubuntuArchiveInfo}
                   ubuntuEsmInfo={ubuntuEsmInfo}
+                  isLoading={isMirrorContentsLoading}
                 />
               )}
               <p>Download options:</p>
diff --git a/src/features/mirrors/components/AddMirrorForm/helpers.ts b/src/features/mirrors/components/AddMirrorForm/helpers.ts
index 4344a1395..0e373954b 100644
--- a/src/features/mirrors/components/AddMirrorForm/helpers.ts
+++ b/src/features/mirrors/components/AddMirrorForm/helpers.ts
@@ -26,10 +26,13 @@ export function getInitialSourceType({
   ubuntuArchiveInfo,
   ubuntuEsmInfo,
 }: {
-  ubuntuArchiveInfo: UbuntuArchiveInfo;
+  ubuntuArchiveInfo: UbuntuArchiveInfo | undefined;
   ubuntuEsmInfo: UbuntuArchiveInfo[];
 }) {
-  if (isArchiveInfoValid(ubuntuArchiveInfo)) {
+  // While archive info is still loading, default to "ubuntu-archive" — it's
+  // the most common case and the data-dependent fields stay disabled with a
+  // loading note until the response arrives.
+  if (!ubuntuArchiveInfo || isArchiveInfoValid(ubuntuArchiveInfo)) {
     return "ubuntu-archive";
   } else if (ubuntuEsmInfo.some(isArchiveInfoValid)) {
     return "ubuntu-pro";
@@ -91,20 +94,20 @@ export function getInitialBaseValues(
 }
 
 export function getInitialUbuntuArchiveValues(
-  ubuntuArchiveInfo: UbuntuArchiveInfo,
+  ubuntuArchiveInfo: UbuntuArchiveInfo | undefined,
 ): UbuntuArchiveFormProps {
   return {
-    ...getInitialBaseValues(ubuntuArchiveInfo.distributions),
+    ...getInitialBaseValues(ubuntuArchiveInfo?.distributions ?? []),
     sourceType: "ubuntu-archive",
     sourceUrl: `http://${UBUNTU_ARCHIVE_HOST}/ubuntu/`,
   };
 }
 
 export function getInitialUbuntuSnapshotsValues(
-  ubuntuArchiveInfo: UbuntuArchiveInfo,
+  ubuntuArchiveInfo: UbuntuArchiveInfo | undefined,
 ): UbuntuSnapshotsFormProps {
   return {
-    ...getInitialBaseValues(ubuntuArchiveInfo.distributions),
+    ...getInitialBaseValues(ubuntuArchiveInfo?.distributions ?? []),
     sourceType: "ubuntu-snapshots",
     sourceUrl: `http://${UBUNTU_ARCHIVE_HOST}/ubuntu/`,
     snapshotDate: moment().format(INPUT_DATE_FORMAT),
@@ -141,7 +144,7 @@ export const getInitialValues = ({
   ubuntuEsmInfo,
 }: {
   sourceType?: FormProps["sourceType"];
-  ubuntuArchiveInfo: UbuntuArchiveInfo;
+  ubuntuArchiveInfo: UbuntuArchiveInfo | undefined;
   ubuntuEsmInfo: UbuntuArchiveInfo[];
 }): FormProps => {
   sourceType ??= getInitialSourceType({
diff --git a/src/features/mirrors/components/SelectableMirrorContentsBlock/SelectableMirrorContentsBlock.tsx b/src/features/mirrors/components/SelectableMirrorContentsBlock/SelectableMirrorContentsBlock.tsx
index 4b49bcb76..502a715da 100644
--- a/src/features/mirrors/components/SelectableMirrorContentsBlock/SelectableMirrorContentsBlock.tsx
+++ b/src/features/mirrors/components/SelectableMirrorContentsBlock/SelectableMirrorContentsBlock.tsx
@@ -12,20 +12,22 @@ import { isDistributionValid } from "../../helpers";
 
 interface SelectableMirrorContentsBlockProps {
   readonly formik: FormikContextType<Exclude<FormProps, ThirdPartyFormProps>>;
-  readonly ubuntuArchiveInfo: UbuntuArchiveInfo;
+  readonly ubuntuArchiveInfo: UbuntuArchiveInfo | undefined;
   readonly ubuntuEsmInfo: UbuntuArchiveInfo[];
+  readonly isLoading?: boolean;
 }
 
 const SelectableMirrorContentsBlock: FC<SelectableMirrorContentsBlockProps> = ({
   formik,
   ubuntuArchiveInfo,
   ubuntuEsmInfo,
+  isLoading,
 }) => {
   const getDistributions = () => {
     switch (formik.values.sourceType) {
       case "ubuntu-archive":
       case "ubuntu-snapshots": {
-        return ubuntuArchiveInfo.distributions;
+        return ubuntuArchiveInfo?.distributions ?? [];
       }
 
       case "ubuntu-pro": {
@@ -78,6 +80,7 @@ const SelectableMirrorContentsBlock: FC<SelectableMirrorContentsBlockProps> = ({
           required
           options={distributionOptions}
           {...formik.getFieldProps("distribution")}
+          disabled={isLoading}
           error={getFormikError(formik, "distribution")}
         />
       )}
@@ -103,6 +106,7 @@ const SelectableMirrorContentsBlock: FC<SelectableMirrorContentsBlockProps> = ({
               items.map(({ value }) => value),
             )
           }
+          disabled={isLoading}
           required
         />
       )}
@@ -128,6 +132,7 @@ const SelectableMirrorContentsBlock: FC<SelectableMirrorContentsBlockProps> = ({
               items.map(({ value }) => value),
             )
           }
+          disabled={isLoading}
           required
         />
       )}

From abbe33c3e8750e878ec01d0451b05b372e1972c8 Mon Sep 17 00:00:00 2001
From: Marc Bucchieri <marc.bucchieri@canonical.com>
Date: Tue, 28 Apr 2026 09:52:54 -0700
Subject: [PATCH 38/42] fix routing for repo profiles

Co-authored-by: Copilot <copilot@github.com>
---
 src/libs/routes/profiles.ts                   |  4 +++
 src/routes/DashboardRoutes.tsx                | 26 ++++++++++++-------
 .../dashboard/Navigation/constants.ts         |  2 +-
 3 files changed, 21 insertions(+), 11 deletions(-)

diff --git a/src/libs/routes/profiles.ts b/src/libs/routes/profiles.ts
index 71cdd014b..ff2f9c3c6 100644
--- a/src/libs/routes/profiles.ts
+++ b/src/libs/routes/profiles.ts
@@ -5,6 +5,7 @@ export const PROFILES_PATHS = {
   package: "package",
   reboot: "reboot",
   removal: "removal",
+  repositoryProfiles: "repository-profiles",
   security: "security",
   upgrade: "upgrade",
   wsl: "wsl",
@@ -19,6 +20,9 @@ export const PROFILES_ROUTES = {
   package: createRoute(buildProfilePath(PROFILES_PATHS.package)),
   reboot: createRoute(buildProfilePath(PROFILES_PATHS.reboot)),
   removal: createRoute(buildProfilePath(PROFILES_PATHS.removal)),
+  repositoryProfiles: createRoute(
+    buildProfilePath(PROFILES_PATHS.repositoryProfiles),
+  ),
   security: createRoute(buildProfilePath(PROFILES_PATHS.security)),
   upgrade: createRoute(buildProfilePath(PROFILES_PATHS.upgrade)),
   wsl: createRoute(buildProfilePath(PROFILES_PATHS.wsl)),
diff --git a/src/routes/DashboardRoutes.tsx b/src/routes/DashboardRoutes.tsx
index 2508f4a66..05b7f9ddb 100644
--- a/src/routes/DashboardRoutes.tsx
+++ b/src/routes/DashboardRoutes.tsx
@@ -40,7 +40,7 @@ export const DashboardRoutes = (
       {/* --- Profiles --- */}
       <Route path={PATHS.profiles.root}>
         <Route
-          path={PATHS.repositories.repositoryProfiles}
+          path={PATHS.profiles.repositoryProfiles}
           element={<Pages.RepositoryProfilesPage />}
         />
         <Route
@@ -83,15 +83,17 @@ export const DashboardRoutes = (
       <Route
         path={PATHS.repositories.root}
         element={
-          <div className={classes.wrapper}>
-            <SecondaryNavigation
-              title="Repositories"
-              items={REPOSITORY_SUBMENU}
-            />
-            <div className={classes.pageContent}>
-              <Outlet />
+          <SelfHostedGuard>
+            <div className={classes.wrapper}>
+              <SecondaryNavigation
+                title="Repositories"
+                items={REPOSITORY_SUBMENU}
+              />
+              <div className={classes.pageContent}>
+                <Outlet />
+              </div>
             </div>
-          </div>
+          </SelfHostedGuard>
         }
       >
         <Route
@@ -128,7 +130,11 @@ export const DashboardRoutes = (
         />
         <Route
           path={PATHS.repositories.repositoryProfiles}
-          element={<Pages.RepositoryProfilesPage />}
+          element={
+            <SelfHostedGuard>
+              <Pages.RepositoryProfilesPage />
+            </SelfHostedGuard>
+          }
         />
       </Route>
 
diff --git a/src/templates/dashboard/Navigation/constants.ts b/src/templates/dashboard/Navigation/constants.ts
index afe85d006..3704f19c5 100644
--- a/src/templates/dashboard/Navigation/constants.ts
+++ b/src/templates/dashboard/Navigation/constants.ts
@@ -4,7 +4,7 @@ import type { MenuItem } from "./types";
 const PROFILES_SUBMENU: MenuItem[] = [
   {
     label: "Repository profiles",
-    path: ROUTES.repositories.repositoryProfiles(),
+    path: ROUTES.profiles.repositoryProfiles(),
     env: "saas",
   },
   { label: "Package profiles", path: ROUTES.profiles.package() },

From 8548d938a0eb77c05163710374576e0b71577d9c Mon Sep 17 00:00:00 2001
From: Yurii Vasyliev <yurii.vasyliev@canonical.com>
Date: Tue, 28 Apr 2026 18:59:03 +0200
Subject: [PATCH 39/42] feat: editable Source URL for Ubuntu archive, enforce
 HTTPS, fix snapshots host

---
 .../AddMirrorForm/AddMirrorForm.test.tsx      | 50 ++++++++++++++++++-
 .../AddMirrorForm/AddMirrorForm.tsx           | 12 ++++-
 .../components/AddMirrorForm/helpers.ts       | 10 ++--
 3 files changed, 66 insertions(+), 6 deletions(-)

diff --git a/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.test.tsx b/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.test.tsx
index 76f6372bb..714991f4f 100644
--- a/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.test.tsx
+++ b/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.test.tsx
@@ -8,7 +8,7 @@ import {
   waitForElementToBeRemoved,
 } from "@testing-library/react";
 import { beforeEach, describe, expect, it, vi } from "vitest";
-import { UBUNTU_SNAPSHOTS_HOST } from "../../constants";
+import { UBUNTU_ARCHIVE_HOST, UBUNTU_SNAPSHOTS_HOST } from "../../constants";
 import type { CreateMirrorData } from "@canonical/landscape-openapi";
 
 const PULLING_NOTE = /pulling and parsing repository data/i;
@@ -44,6 +44,54 @@ describe("AddMirrorForm", () => {
     await user.type(screen.getByLabelText("Name"), "Name");
   });
 
+  it("submits an ubuntu archive mirror with the default https URL", async () => {
+    // Default sourceType is "Ubuntu archive"; the Source URL field is
+    // editable and prefilled with the canonical archive URL over HTTPS.
+    expect(screen.getByLabelText("Source URL")).toHaveValue(
+      `https://${UBUNTU_ARCHIVE_HOST}/ubuntu/`,
+    );
+
+    await user.click(screen.getByRole("button", { name: "Add mirror" }));
+
+    expect(mockCreateMirror).toHaveBeenCalledExactlyOnceWith(
+      expect.objectContaining({
+        archiveRoot: `https://${UBUNTU_ARCHIVE_HOST}/ubuntu/`,
+      }),
+    );
+  });
+
+  it("submits an ubuntu archive mirror pointed at a custom CDN", async () => {
+    const cdnUrl = "https://eu.archive.ubuntu.com/ubuntu/";
+
+    const sourceUrlField = screen.getByLabelText("Source URL");
+    await user.clear(sourceUrlField);
+    await user.type(sourceUrlField, cdnUrl);
+
+    await user.click(screen.getByRole("button", { name: "Add mirror" }));
+
+    expect(mockCreateMirror).toHaveBeenCalledExactlyOnceWith(
+      expect.objectContaining({
+        archiveRoot: cdnUrl,
+      }),
+    );
+  });
+
+  it("rejects an http source URL with an HTTPS validation error", async () => {
+    await user.selectOptions(
+      screen.getByLabelText("Source type"),
+      "Third party",
+    );
+
+    const sourceUrlField = screen.getByLabelText("Source URL");
+    await user.type(sourceUrlField, "http://insecure.example.com/");
+    // validateOnBlur is true on the form; tab out to trigger validation.
+    await user.tab();
+
+    expect(
+      await screen.findByText(/source url must use https/i),
+    ).toBeInTheDocument();
+  });
+
   it("submits an ubuntu snapshot mirror", async () => {
     const date = "2026-04-15";
 
diff --git a/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.tsx b/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.tsx
index 68846a681..6d449855e 100644
--- a/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.tsx
+++ b/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.tsx
@@ -59,7 +59,9 @@ const AddMirrorForm: FC = () => {
     validationSchema: Yup.object().shape({
       name: Yup.string().required("This field is required."),
       sourceType: Yup.string().required("This field is required."),
-      sourceUrl: Yup.string().required("This field is required."),
+      sourceUrl: Yup.string()
+        .required("This field is required.")
+        .matches(/^https:\/\/.+/, "Source URL must use HTTPS."),
       distribution: Yup.string().required("This field is required."),
       components: Yup.array()
         .of(Yup.string())
@@ -230,11 +232,17 @@ const AddMirrorForm: FC = () => {
                   error={getFormikError(formik, "token")}
                 />
               )}
-              {formik.values.sourceType === "third-party" ? (
+              {formik.values.sourceType === "third-party" ||
+              formik.values.sourceType === "ubuntu-archive" ? (
                 <Input
                   type="text"
                   label="Source URL"
                   required
+                  help={
+                    formik.values.sourceType === "ubuntu-archive"
+                      ? "Use the default URL or point to a CDN mirror closer to your network. Must use HTTPS."
+                      : undefined
+                  }
                   {...formik.getFieldProps("sourceUrl")}
                   error={getFormikError(formik, "sourceUrl")}
                 />
diff --git a/src/features/mirrors/components/AddMirrorForm/helpers.ts b/src/features/mirrors/components/AddMirrorForm/helpers.ts
index 0e373954b..ddbef4a9a 100644
--- a/src/features/mirrors/components/AddMirrorForm/helpers.ts
+++ b/src/features/mirrors/components/AddMirrorForm/helpers.ts
@@ -14,7 +14,11 @@ import type {
   Distribution,
   UbuntuArchiveInfo,
 } from "../../types";
-import { UBUNTU_ARCHIVE_HOST, UBUNTU_PRO_HOST } from "../../constants";
+import {
+  UBUNTU_ARCHIVE_HOST,
+  UBUNTU_PRO_HOST,
+  UBUNTU_SNAPSHOTS_HOST,
+} from "../../constants";
 import { hasOneItem } from "@/utils/_helpers";
 import { isArchiveInfoValid } from "../../helpers";
 
@@ -99,7 +103,7 @@ export function getInitialUbuntuArchiveValues(
   return {
     ...getInitialBaseValues(ubuntuArchiveInfo?.distributions ?? []),
     sourceType: "ubuntu-archive",
-    sourceUrl: `http://${UBUNTU_ARCHIVE_HOST}/ubuntu/`,
+    sourceUrl: `https://${UBUNTU_ARCHIVE_HOST}/ubuntu/`,
   };
 }
 
@@ -109,7 +113,7 @@ export function getInitialUbuntuSnapshotsValues(
   return {
     ...getInitialBaseValues(ubuntuArchiveInfo?.distributions ?? []),
     sourceType: "ubuntu-snapshots",
-    sourceUrl: `http://${UBUNTU_ARCHIVE_HOST}/ubuntu/`,
+    sourceUrl: `https://${UBUNTU_SNAPSHOTS_HOST}/ubuntu/`,
     snapshotDate: moment().format(INPUT_DATE_FORMAT),
   };
 }

From d5fdde8919cd366590bc865d9ec41436c93ac6d5 Mon Sep 17 00:00:00 2001
From: Gabe Gaghi <gabe.gaghi@canonical.com>
Date: Tue, 28 Apr 2026 14:11:39 -0300
Subject: [PATCH 40/42] run prettier

---
 .../form/ReadOnlyField/ReadOnlyField.tsx      |  11 +-
 src/components/layout/InfoGrid/InfoGrid.tsx   |   4 +-
 src/components/layout/ListTitle/constants.tsx |   6 +-
 .../apt-sources/api/useGetAPTSources.ts       |   5 +-
 .../ImportRepositoryPackagesSidePanel.tsx     |   8 +-
 .../AddMirrorForm/AddMirrorForm.test.tsx      |   7 +-
 .../ViewProfileSidePanel.tsx                  |   5 +-
 .../api/useGetPublicationsByTarget.ts         |   4 +-
 .../AddPublicationTargetForm.test.tsx         |  17 ++-
 .../AddPublicationTargetForm.tsx              |   6 +-
 .../EditTargetForm/EditTargetForm.test.tsx    |   8 +-
 .../EditTargetForm/EditTargetForm.tsx         |   6 +-
 .../PublicationTargetAddButton.test.tsx       |   4 +-
 ...PublicationTargetList.integration.test.tsx |   8 +-
 .../PublicationTargetList.test.tsx            |  37 ++---
 .../PublicationTargetList.tsx                 |  37 ++---
 .../PublicationTargetListActions.tsx          |   6 +-
 .../MirrorLink/MirrorLink.tsx                 |   5 +-
 .../PublicationLink/PublicationLink.tsx       |   5 +-
 .../PublicationsTable.test.tsx                |  38 ++---
 .../PublicationsTable/PublicationsTable.tsx   |  60 +++++---
 .../RemoveTargetForm.test.tsx                 |  25 ++--
 .../RemoveTargetForm/RemoveTargetModal.tsx    |  15 +-
 .../TargetDetails/TargetDetails.test.tsx      |   6 +-
 .../TargetDetails/TargetDetails.tsx           |  24 +++-
 .../publications/api/useGetPublications.ts    |   4 +-
 .../api/useGetProfileInstancesCount.ts        |   2 +-
 .../api/useGetRepositoryProfile.ts            |   5 +-
 .../api/useRepositoryProfiles.ts              |  24 ++--
 .../RepositoryProfileContainer.test.tsx       |   4 +-
 .../RepositoryProfileDetails.test.tsx         |   4 +-
 .../RepositoryProfileDetails.tsx              | 130 ++++++++++--------
 .../RepositoryProfileForm.test.tsx            |  29 ++--
 .../RepositoryProfileForm.tsx                 |  26 ++--
 ...ositoryProfileFormAptSourcesPanel.test.tsx |   9 +-
 .../RepositoryProfileFormDetailsPanel.tsx     |   6 +-
 ...positoryProfileFormSourcesSection.test.tsx |  25 ++--
 .../RepositoryProfileFormSourcesSection.tsx   |  34 +++--
 .../RepositoryProfileFormTabs.test.tsx        |  18 ++-
 .../RepositoryProfileList.test.tsx            |   7 +-
 .../RepositoryProfileList.tsx                 |  40 +++---
 .../RepositoryProfileListActions.test.tsx     |  15 +-
 .../RepositoryProfileListActions.tsx          |   5 +-
 .../RepositoryProfileSourceForm.test.tsx      |  10 +-
 .../RepositoryProfileSourceForm.tsx           |  13 +-
 ...epositoryProfileSourceFormOverlay.test.tsx |  16 ++-
 src/features/repository-profiles/index.ts     |   6 +-
 .../PackageProfilesContent.tsx                |   5 +-
 .../PublicationTargetsPage.test.tsx           |   6 +-
 .../PublicationTargetsPage.tsx                |  18 +--
 .../publications/PublicationsPage.tsx         |   5 +-
 .../RepositoryProfilesPage.test.tsx           |   8 +-
 .../NavigationExpandable.tsx                  |   5 +-
 .../NavigationRoute/NavigationRoute.tsx       |   8 +-
 src/tests/browser.ts                          |   9 +-
 src/tests/mocks/apt-sources.ts                |   4 +-
 src/tests/mocks/publications.ts               |   9 +-
 src/tests/mocks/repositoryProfiles.ts         |  13 +-
 .../server/handlers/publicationTargets.ts     |   5 +-
 .../server/handlers/repositoryProfiles.ts     |  73 +++++-----
 60 files changed, 541 insertions(+), 416 deletions(-)

diff --git a/src/components/form/ReadOnlyField/ReadOnlyField.tsx b/src/components/form/ReadOnlyField/ReadOnlyField.tsx
index 03502d99c..7f9160e90 100644
--- a/src/components/form/ReadOnlyField/ReadOnlyField.tsx
+++ b/src/components/form/ReadOnlyField/ReadOnlyField.tsx
@@ -16,8 +16,15 @@ const ReadOnlyField: FC<ReadOnlyFieldProps> = ({
   required,
 }) => (
   <div className={classes.field}>
-    <label>{required ? "* " : ""} {label}</label>
-    <Tooltip position="btm-left" className={classes.container} message={tooltipMessage} followMouse>
+    <label>
+      {required ? "* " : ""} {label}
+    </label>
+    <Tooltip
+      position="btm-left"
+      className={classes.container}
+      message={tooltipMessage}
+      followMouse
+    >
       <div className={classes.locked}>
         <span>{value}</span>
         <Icon name="lock-locked" />
diff --git a/src/components/layout/InfoGrid/InfoGrid.tsx b/src/components/layout/InfoGrid/InfoGrid.tsx
index 9410be00f..b0a4f8749 100644
--- a/src/components/layout/InfoGrid/InfoGrid.tsx
+++ b/src/components/layout/InfoGrid/InfoGrid.tsx
@@ -24,7 +24,9 @@ const InfoGrid: FC<InfoGridProps> & { Item: FC<ItemProps> } = ({
     )}
   >
     <div
-      className={classNames(classes.grid, { [classes.denseGrid as string]: dense })}
+      className={classNames(classes.grid, {
+        [classes.denseGrid as string]: dense,
+      })}
       {...props}
     />
   </div>
diff --git a/src/components/layout/ListTitle/constants.tsx b/src/components/layout/ListTitle/constants.tsx
index 6a336132c..96d598cff 100644
--- a/src/components/layout/ListTitle/constants.tsx
+++ b/src/components/layout/ListTitle/constants.tsx
@@ -3,9 +3,5 @@ import classes from "./ListTitle.module.scss";
 export const LIST_TITLE_COLUMN_PROPS = {
   accessor: "title",
   id: "title",
-  Header: (
-    <div className={classes.header}>
-      Profile Name
-    </div>
-  ),
+  Header: <div className={classes.header}>Profile Name</div>,
 };
diff --git a/src/features/apt-sources/api/useGetAPTSources.ts b/src/features/apt-sources/api/useGetAPTSources.ts
index 1e4985e01..711263061 100644
--- a/src/features/apt-sources/api/useGetAPTSources.ts
+++ b/src/features/apt-sources/api/useGetAPTSources.ts
@@ -17,10 +17,7 @@ interface GetAPTSourcesResult {
 export const useGetAPTSources = (
   params?: GetAPTSourcesParams,
   options?: Omit<
-    UseQueryOptions<
-      AxiosResponse<GetAPTSourcesResult>,
-      AxiosError<ApiError>
-    >,
+    UseQueryOptions<AxiosResponse<GetAPTSourcesResult>, AxiosError<ApiError>>,
     "queryKey" | "queryFn"
   >,
 ) => {
diff --git a/src/features/local-repositories/components/ImportRepositoryPackagesSidePanel/ImportRepositoryPackagesSidePanel.tsx b/src/features/local-repositories/components/ImportRepositoryPackagesSidePanel/ImportRepositoryPackagesSidePanel.tsx
index 925e3ba04..baeec73e7 100644
--- a/src/features/local-repositories/components/ImportRepositoryPackagesSidePanel/ImportRepositoryPackagesSidePanel.tsx
+++ b/src/features/local-repositories/components/ImportRepositoryPackagesSidePanel/ImportRepositoryPackagesSidePanel.tsx
@@ -25,12 +25,8 @@ import type { TaskStatus } from "../../types/Task";
 const ImportRepositoryPackagesSidePanel: FC = () => {
   const debug = useDebug();
   const { notify } = useNotify();
-  const {
-    sidePath,
-    popSidePath,
-    name,
-    createPageParamsSetter,
-  } = usePageParams();
+  const { sidePath, popSidePath, name, createPageParamsSetter } =
+    usePageParams();
   const { repository, isGettingRepository } = useGetPageLocalRepository();
 
   const { importRepositoryPackages, isImportingRepositoryPackages } =
diff --git a/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.test.tsx b/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.test.tsx
index 714991f4f..a06c344cd 100644
--- a/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.test.tsx
+++ b/src/features/mirrors/components/AddMirrorForm/AddMirrorForm.test.tsx
@@ -37,10 +37,9 @@ describe("AddMirrorForm", () => {
     // The form renders immediately; wait for the "pulling…" note in the
     // Mirror contents block to disappear so the data-dependent dropdowns are
     // populated before the test interacts with them.
-    await waitForElementToBeRemoved(
-      () => screen.queryByText(PULLING_NOTE),
-      { timeout: 2000 },
-    );
+    await waitForElementToBeRemoved(() => screen.queryByText(PULLING_NOTE), {
+      timeout: 2000,
+    });
     await user.type(screen.getByLabelText("Name"), "Name");
   });
 
diff --git a/src/features/profiles/components/ViewProfileSidePanel/ViewProfileSidePanel.tsx b/src/features/profiles/components/ViewProfileSidePanel/ViewProfileSidePanel.tsx
index d71d6212b..5d83dd790 100644
--- a/src/features/profiles/components/ViewProfileSidePanel/ViewProfileSidePanel.tsx
+++ b/src/features/profiles/components/ViewProfileSidePanel/ViewProfileSidePanel.tsx
@@ -5,10 +5,7 @@ import { ScriptProfileActivityHistory } from "@/features/script-profiles";
 import { Tabs } from "@canonical/react-components";
 import ViewProfileInfoTab from "./components/ViewProfileInfoTab";
 import classes from "./ViewProfileSidePanel.module.scss";
-import {
-  isPackageProfile,
-  isScriptProfile,
-} from "../../helpers";
+import { isPackageProfile, isScriptProfile } from "../../helpers";
 import { PackageProfileDetailsConstraints } from "@/features/package-profiles";
 import { getTabs, type TabTypes } from "./helpers";
 import type { Profile } from "../../types";
diff --git a/src/features/publication-targets/api/useGetPublicationsByTarget.ts b/src/features/publication-targets/api/useGetPublicationsByTarget.ts
index 532d4dfd4..f21868680 100644
--- a/src/features/publication-targets/api/useGetPublicationsByTarget.ts
+++ b/src/features/publication-targets/api/useGetPublicationsByTarget.ts
@@ -35,7 +35,9 @@ export default function useGetPublicationsByTarget(
             },
           );
 
-        publications.push(...((response.data.publications ?? []) as Publication[]));
+        publications.push(
+          ...((response.data.publications ?? []) as Publication[]),
+        );
         pageToken = response.data.nextPageToken || undefined;
       } while (pageToken);
 
diff --git a/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.test.tsx b/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.test.tsx
index b57f62fc9..cbb8ae13b 100644
--- a/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.test.tsx
+++ b/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.test.tsx
@@ -66,7 +66,9 @@ describe("AddPublicationTargetForm", () => {
     );
 
     await vi.waitFor(() => {
-      expect(screen.getByText("Publication target created")).toBeInTheDocument();
+      expect(
+        screen.getByText("Publication target created"),
+      ).toBeInTheDocument();
     });
   });
 
@@ -76,7 +78,10 @@ describe("AddPublicationTargetForm", () => {
     await user.type(screen.getByLabelText("Name"), "Full Target");
     await user.type(screen.getByLabelText(/region/i), "us-east-1");
     await user.type(screen.getByLabelText(/bucket name/i), "my-bucket");
-    await user.type(screen.getByLabelText(/endpoint/i), "https://s3.example.com");
+    await user.type(
+      screen.getByLabelText(/endpoint/i),
+      "https://s3.example.com",
+    );
     await user.type(
       screen.getByLabelText(/aws access key id/i),
       "AKIAIOSFODNN7EXAMPLE",
@@ -95,14 +100,18 @@ describe("AddPublicationTargetForm", () => {
     );
 
     await vi.waitFor(() => {
-      expect(screen.getByText("Publication target created")).toBeInTheDocument();
+      expect(
+        screen.getByText("Publication target created"),
+      ).toBeInTheDocument();
     });
   });
 
   it("toggles the disable_multi_del checkbox", async () => {
     renderWithProviders(<AddPublicationTargetForm />);
 
-    const checkbox = screen.getByRole("checkbox", { name: /disable multidel/i });
+    const checkbox = screen.getByRole("checkbox", {
+      name: /disable multidel/i,
+    });
     expect(checkbox).not.toBeChecked();
 
     await user.click(checkbox);
diff --git a/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.tsx b/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.tsx
index 0a532f7a1..1cdf40223 100644
--- a/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.tsx
+++ b/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.tsx
@@ -3,11 +3,7 @@ import useDebug from "@/hooks/useDebug";
 import usePageParams from "@/hooks/usePageParams";
 import { getFormikError } from "@/utils/formikErrors";
 import useCreatePublicationTarget from "../../api/useCreatePublicationTarget";
-import {
-  CheckboxInput,
-  Form,
-  Input,
-} from "@canonical/react-components";
+import { CheckboxInput, Form, Input } from "@canonical/react-components";
 import { useFormik } from "formik";
 import type { FC } from "react";
 import * as Yup from "yup";
diff --git a/src/features/publication-targets/components/EditTargetForm/EditTargetForm.test.tsx b/src/features/publication-targets/components/EditTargetForm/EditTargetForm.test.tsx
index 298bf57ae..5e17e88c2 100644
--- a/src/features/publication-targets/components/EditTargetForm/EditTargetForm.test.tsx
+++ b/src/features/publication-targets/components/EditTargetForm/EditTargetForm.test.tsx
@@ -103,9 +103,7 @@ describe("EditTargetForm", () => {
   it("renders the save button", () => {
     renderWithProviders(<EditTargetForm target={s3TargetFull} />);
 
-    expect(
-      screen.getByRole("button", { name: /save/i }),
-    ).toBeInTheDocument();
+    expect(screen.getByRole("button", { name: /save/i })).toBeInTheDocument();
   });
 
   it("submits the form with all optional fields and shows success notification", async () => {
@@ -131,7 +129,9 @@ describe("EditTargetForm", () => {
   it("toggles the disable_multi_del checkbox", async () => {
     renderWithProviders(<EditTargetForm target={s3TargetFull} />);
 
-    const checkbox = screen.getByRole("checkbox", { name: /disable multidel/i });
+    const checkbox = screen.getByRole("checkbox", {
+      name: /disable multidel/i,
+    });
     expect(checkbox).not.toBeChecked();
 
     await user.click(checkbox);
diff --git a/src/features/publication-targets/components/EditTargetForm/EditTargetForm.tsx b/src/features/publication-targets/components/EditTargetForm/EditTargetForm.tsx
index 4c072c609..e5d18d582 100644
--- a/src/features/publication-targets/components/EditTargetForm/EditTargetForm.tsx
+++ b/src/features/publication-targets/components/EditTargetForm/EditTargetForm.tsx
@@ -3,11 +3,7 @@ import useDebug from "@/hooks/useDebug";
 import usePageParams from "@/hooks/usePageParams";
 import { getFormikError } from "@/utils/formikErrors";
 import useEditPublicationTarget from "../../api/useEditPublicationTarget";
-import {
-  CheckboxInput,
-  Form,
-  Input,
-} from "@canonical/react-components";
+import { CheckboxInput, Form, Input } from "@canonical/react-components";
 import { useFormik } from "formik";
 import type { FC } from "react";
 import * as Yup from "yup";
diff --git a/src/features/publication-targets/components/PublicationTargetAddButton/PublicationTargetAddButton.test.tsx b/src/features/publication-targets/components/PublicationTargetAddButton/PublicationTargetAddButton.test.tsx
index cc96d3489..f48cbcfcf 100644
--- a/src/features/publication-targets/components/PublicationTargetAddButton/PublicationTargetAddButton.test.tsx
+++ b/src/features/publication-targets/components/PublicationTargetAddButton/PublicationTargetAddButton.test.tsx
@@ -33,6 +33,8 @@ describe("PublicationTargetAddButton", () => {
       screen.getByRole("button", { name: /add publication target/i }),
     );
 
-    expect(screen.getByTestId("location").textContent).toContain("sidePath=add");
+    expect(screen.getByTestId("location").textContent).toContain(
+      "sidePath=add",
+    );
   });
 });
diff --git a/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.integration.test.tsx b/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.integration.test.tsx
index 7db93b120..57525696e 100644
--- a/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.integration.test.tsx
+++ b/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.integration.test.tsx
@@ -6,10 +6,10 @@ import PublicationTargetList from "./PublicationTargetList";
 
 describe("PublicationTargetList (integration)", () => {
   it("fetches and displays the publications count via useGetPublicationsByTarget", async () => {
-    renderWithProviders(
-      <PublicationTargetList targets={publicationTargets} />,
-    );
+    renderWithProviders(<PublicationTargetList targets={publicationTargets} />);
 
-    expect(await screen.findByRole("link", { name: /publications/i })).toBeInTheDocument();
+    expect(
+      await screen.findByRole("link", { name: /publications/i }),
+    ).toBeInTheDocument();
   });
 });
diff --git a/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.test.tsx b/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.test.tsx
index 33921d850..3f4b4a7a2 100644
--- a/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.test.tsx
+++ b/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.test.tsx
@@ -19,10 +19,7 @@ describe("PublicationTargetList", () => {
     // Default: prod-s3-us-east has 3 publications, others have 0
     (useGetPublicationsByTarget as Mock).mockImplementation(
       (publicationTargetId: string | undefined) => {
-        if (
-          publicationTargetId ===
-          "aaaaaaaa-0000-0000-0000-000000000001"
-        ) {
+        if (publicationTargetId === "aaaaaaaa-0000-0000-0000-000000000001") {
           return { publications, isGettingPublications: false };
         }
 
@@ -32,9 +29,7 @@ describe("PublicationTargetList", () => {
   });
 
   it("renders table headers", () => {
-    renderWithProviders(
-      <PublicationTargetList targets={publicationTargets} />,
-    );
+    renderWithProviders(<PublicationTargetList targets={publicationTargets} />);
 
     expect(screen.getByRole("table")).toHaveTexts([
       "Name",
@@ -44,9 +39,7 @@ describe("PublicationTargetList", () => {
   });
 
   it("renders the displayName for each target", () => {
-    renderWithProviders(
-      <PublicationTargetList targets={publicationTargets} />,
-    );
+    renderWithProviders(<PublicationTargetList targets={publicationTargets} />);
 
     expect(screen.getByText("prod-s3-us-east")).toBeInTheDocument();
     expect(screen.getByText("staging-s3-eu-west")).toBeInTheDocument();
@@ -54,35 +47,27 @@ describe("PublicationTargetList", () => {
   });
 
   it("renders S3 type label for S3 targets", () => {
-    renderWithProviders(
-      <PublicationTargetList targets={publicationTargets} />,
-    );
+    renderWithProviders(<PublicationTargetList targets={publicationTargets} />);
 
     // Two S3 targets: prod-s3-us-east and staging-s3-eu-west
     expect(screen.getAllByText("S3")).toHaveLength(2);
   });
 
   it("renders Swift type label for Swift targets", () => {
-    renderWithProviders(
-      <PublicationTargetList targets={publicationTargets} />,
-    );
+    renderWithProviders(<PublicationTargetList targets={publicationTargets} />);
 
     expect(screen.getByText("Swift")).toBeInTheDocument();
   });
 
   it("renders the publication count for a target with publications", () => {
-    renderWithProviders(
-      <PublicationTargetList targets={publicationTargets} />,
-    );
+    renderWithProviders(<PublicationTargetList targets={publicationTargets} />);
 
     // prod-s3-us-east has 3 publications
     expect(screen.getByText("3 publications")).toBeInTheDocument();
   });
 
   it("renders NoData placeholder when a target has no publications", () => {
-    renderWithProviders(
-      <PublicationTargetList targets={publicationTargets} />,
-    );
+    renderWithProviders(<PublicationTargetList targets={publicationTargets} />);
 
     // staging-s3-eu-west and swift-internal each have 0 publications → two NoData cells
     expect(screen.getAllByText(NO_DATA_TEXT)).toHaveLength(2);
@@ -116,9 +101,7 @@ describe("PublicationTargetList", () => {
   });
 
   it("renders PublicationTargetListActions component in actions column", () => {
-    renderWithProviders(
-      <PublicationTargetList targets={publicationTargets} />,
-    );
+    renderWithProviders(<PublicationTargetList targets={publicationTargets} />);
 
     // Each target should have an actions button with aria-label like "{displayName} actions"
     publicationTargets.forEach((target) => {
@@ -176,9 +159,7 @@ describe("PublicationTargetList", () => {
   });
 
   it("renders the publications count as a link filtered by publicationTargetId", () => {
-    renderWithProviders(
-      <PublicationTargetList targets={publicationTargets} />,
-    );
+    renderWithProviders(<PublicationTargetList targets={publicationTargets} />);
 
     const link = screen.getByRole("link", { name: "3 publications" });
     expect(link).toHaveAttribute(
diff --git a/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.tsx b/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.tsx
index e3db127fe..415adbe0c 100644
--- a/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.tsx
+++ b/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.tsx
@@ -64,22 +64,25 @@ const PublicationTargetList: FC<PublicationTargetListProps> = ({ targets }) => {
 
   const columns = useMemo<Column<PublicationTarget>[]>(
     () => [
-        {
-          accessor: "displayName",
-          id: "displayName",
-          Header: "Name",
-          Cell: ({ row }: CellProps<PublicationTarget>) => (
-            <Button
-              type="button"
-              appearance="link"
-              className="u-no-margin--bottom u-no-padding--top u-align-text--left"
-              onClick={createPageParamsSetter({ sidePath: ["view"], name: row.original.publicationTargetId ?? "" })}
-              aria-label={`View details for ${row.original.displayName}`}
-            >
-              {row.original.displayName || NO_DATA_TEXT}
-            </Button>
-          ),
-        },
+      {
+        accessor: "displayName",
+        id: "displayName",
+        Header: "Name",
+        Cell: ({ row }: CellProps<PublicationTarget>) => (
+          <Button
+            type="button"
+            appearance="link"
+            className="u-no-margin--bottom u-no-padding--top u-align-text--left"
+            onClick={createPageParamsSetter({
+              sidePath: ["view"],
+              name: row.original.publicationTargetId ?? "",
+            })}
+            aria-label={`View details for ${row.original.displayName}`}
+          >
+            {row.original.displayName || NO_DATA_TEXT}
+          </Button>
+        ),
+      },
       {
         accessor: (row) => getTargetType(row),
         id: "type",
@@ -103,7 +106,7 @@ const PublicationTargetList: FC<PublicationTargetListProps> = ({ targets }) => {
           <PublicationTargetListActions target={original} />
         ),
       } as Column<PublicationTarget>,
-      ],
+    ],
     [createPageParamsSetter],
   );
 
diff --git a/src/features/publication-targets/components/PublicationTargetListActions/PublicationTargetListActions.tsx b/src/features/publication-targets/components/PublicationTargetListActions/PublicationTargetListActions.tsx
index 4b8f6d0ea..2a0f392df 100644
--- a/src/features/publication-targets/components/PublicationTargetListActions/PublicationTargetListActions.tsx
+++ b/src/features/publication-targets/components/PublicationTargetListActions/PublicationTargetListActions.tsx
@@ -6,12 +6,13 @@ import { useBoolean } from "usehooks-ts";
 import type { PublicationTarget } from "../../types";
 import RemoveTargetForm from "../RemoveTargetForm";
 
-
 interface PublicationTargetListActionsProps {
   readonly target: PublicationTarget;
 }
 
-const PublicationTargetListActions: FC<PublicationTargetListActionsProps> = ({ target }) => {
+const PublicationTargetListActions: FC<PublicationTargetListActionsProps> = ({
+  target,
+}) => {
   const { createPageParamsSetter } = usePageParams();
   const {
     value: isRemoveModalOpen,
@@ -75,4 +76,3 @@ const PublicationTargetListActions: FC<PublicationTargetListActionsProps> = ({ t
 };
 
 export default PublicationTargetListActions;
-
diff --git a/src/features/publication-targets/components/PublicationsTable/MirrorLink/MirrorLink.tsx b/src/features/publication-targets/components/PublicationsTable/MirrorLink/MirrorLink.tsx
index ddf64a85f..d3e7e7111 100644
--- a/src/features/publication-targets/components/PublicationsTable/MirrorLink/MirrorLink.tsx
+++ b/src/features/publication-targets/components/PublicationsTable/MirrorLink/MirrorLink.tsx
@@ -7,7 +7,10 @@ interface MirrorLinkProps {
   readonly openInNewTab?: boolean;
 }
 
-const MirrorLink: FC<MirrorLinkProps> = ({ mirrorName, openInNewTab=false }) => (
+const MirrorLink: FC<MirrorLinkProps> = ({
+  mirrorName,
+  openInNewTab = false,
+}) => (
   <StaticLink
     to={ROUTES.repositories.mirrors({
       sidePath: ["view"],
diff --git a/src/features/publication-targets/components/PublicationsTable/PublicationLink/PublicationLink.tsx b/src/features/publication-targets/components/PublicationsTable/PublicationLink/PublicationLink.tsx
index 5137b89d3..3b6f8d35b 100644
--- a/src/features/publication-targets/components/PublicationsTable/PublicationLink/PublicationLink.tsx
+++ b/src/features/publication-targets/components/PublicationsTable/PublicationLink/PublicationLink.tsx
@@ -8,7 +8,10 @@ interface PublicationLinkProps {
   readonly openInNewTab?: boolean;
 }
 
-const PublicationLink: FC<PublicationLinkProps> = ({ publication, openInNewTab=false }) => (
+const PublicationLink: FC<PublicationLinkProps> = ({
+  publication,
+  openInNewTab = false,
+}) => (
   <StaticLink
     to={ROUTES.repositories.publications({
       sidePath: ["view"],
diff --git a/src/features/publication-targets/components/PublicationsTable/PublicationsTable.test.tsx b/src/features/publication-targets/components/PublicationsTable/PublicationsTable.test.tsx
index 52b3ac13e..752a92499 100644
--- a/src/features/publication-targets/components/PublicationsTable/PublicationsTable.test.tsx
+++ b/src/features/publication-targets/components/PublicationsTable/PublicationsTable.test.tsx
@@ -98,8 +98,9 @@ describe("PublicationsTable", () => {
       );
 
       // Should show all items and no pagination
-      expect(screen.queryByRole("button", { name: /prev|next/i })).not
-        .toBeInTheDocument();
+      expect(
+        screen.queryByRole("button", { name: /prev|next/i }),
+      ).not.toBeInTheDocument();
     });
 
     it("renders pagination component when publications.length > pageSize", () => {
@@ -107,9 +108,7 @@ describe("PublicationsTable", () => {
         <PublicationsTable publications={publications} pageSize={pageSize} />,
       );
 
-      expect(
-        screen.getByText(/page 1/i),
-      ).toBeInTheDocument();
+      expect(screen.getByText(/page 1/i)).toBeInTheDocument();
     });
 
     it("shows only pageSize items on first page", () => {
@@ -129,8 +128,9 @@ describe("PublicationsTable", () => {
       // Next page publication should not be visible
       const nextPagePublication = publications[pageSize];
       if (nextPagePublication) {
-        expect(screen.queryByText(nextPagePublication.source)).not
-          .toBeInTheDocument();
+        expect(
+          screen.queryByText(nextPagePublication.source),
+        ).not.toBeInTheDocument();
       }
     });
 
@@ -155,7 +155,9 @@ describe("PublicationsTable", () => {
       // Second page publication should be visible
       const secondPagePublication = publications[pageSize];
       if (secondPagePublication) {
-        expect(screen.getByText(secondPagePublication.source)).toBeInTheDocument();
+        expect(
+          screen.getByText(secondPagePublication.source),
+        ).toBeInTheDocument();
       }
     });
   });
@@ -174,9 +176,7 @@ describe("PublicationsTable", () => {
         return;
       }
       const [firstPub] = singlePublication;
-      renderWithProviders(
-        <PublicationsTable publications={[firstPub]} />,
-      );
+      renderWithProviders(<PublicationsTable publications={[firstPub]} />);
 
       expect(screen.getByText(firstPub.source)).toBeInTheDocument();
     });
@@ -193,21 +193,27 @@ describe("PublicationsTable", () => {
 
     it("applies custom pageSize when provided", () => {
       if (!publications || publications.length < 2) {
-        throw new Error("Test failed: 'publications' must be defined with at least 2 items.");
+        throw new Error(
+          "Test failed: 'publications' must be defined with at least 2 items.",
+        );
       }
       const [firstPub, secondPub] = publications;
       const customPageSize = 1;
       if (!firstPub || !secondPub) {
-        throw new Error("Test failed: 'publications' must be defined with at least 2 items.");
+        throw new Error(
+          "Test failed: 'publications' must be defined with at least 2 items.",
+        );
       }
       renderWithProviders(
-        <PublicationsTable publications={publications} pageSize={customPageSize} />,
+        <PublicationsTable
+          publications={publications}
+          pageSize={customPageSize}
+        />,
       );
 
       expect(screen.getByText(firstPub.source)).toBeInTheDocument();
 
-      expect(screen.queryByText(secondPub.source)).not
-        .toBeInTheDocument();
+      expect(screen.queryByText(secondPub.source)).not.toBeInTheDocument();
     });
   });
 });
diff --git a/src/features/publication-targets/components/PublicationsTable/PublicationsTable.tsx b/src/features/publication-targets/components/PublicationsTable/PublicationsTable.tsx
index 7e09861bc..a843e8fa4 100644
--- a/src/features/publication-targets/components/PublicationsTable/PublicationsTable.tsx
+++ b/src/features/publication-targets/components/PublicationsTable/PublicationsTable.tsx
@@ -21,9 +21,9 @@ interface PublicationsTableProps {
 
 const PublicationsTable: FC<PublicationsTableProps> = ({
   publications,
-  pageSize=10,
-  openInNewTab=false,
-  showSources=true,
+  pageSize = 10,
+  openInNewTab = false,
+  showSources = true,
 }) => {
   const [currentPage, setCurrentPage] = useState(1);
 
@@ -37,25 +37,44 @@ const PublicationsTable: FC<PublicationsTableProps> = ({
           <PublicationLink publication={original} openInNewTab={openInNewTab} />
         ),
       },
-      ...(showSources ? [{
-        accessor: "source" as const,
-        Header: "Source",
-        Cell: ({ row: { original: { source } } }: CellProps<Publication>): ReactNode => {
-          const sourceType = getSourceType(source);
-          if (sourceType === "Mirror") {
-            return <MirrorLink mirrorName={source} openInNewTab={openInNewTab} />;
-          }
-          if (sourceType === "Local repository") {
-            return <LocalLink localName={source} openInNewTab={openInNewTab} />;
-          }
-          return <>{source}</>;
-        },
-      }] : []),
+      ...(showSources
+        ? [
+            {
+              accessor: "source" as const,
+              Header: "Source",
+              Cell: ({
+                row: {
+                  original: { source },
+                },
+              }: CellProps<Publication>): ReactNode => {
+                const sourceType = getSourceType(source);
+                if (sourceType === "Mirror") {
+                  return (
+                    <MirrorLink
+                      mirrorName={source}
+                      openInNewTab={openInNewTab}
+                    />
+                  );
+                }
+                if (sourceType === "Local repository") {
+                  return (
+                    <LocalLink localName={source} openInNewTab={openInNewTab} />
+                  );
+                }
+                return <>{source}</>;
+              },
+            },
+          ]
+        : []),
       {
         accessor: "publishTime",
         Header: "Date Published",
         className: "date-cell",
-        Cell: ({ row: { original: { publishTime } } }: CellProps<Publication>): ReactNode =>
+        Cell: ({
+          row: {
+            original: { publishTime },
+          },
+        }: CellProps<Publication>): ReactNode =>
           publishTime ? (
             <span>
               {moment(publishTime).format(DISPLAY_DATE_TIME_FORMAT) + " UTC"}
@@ -63,7 +82,7 @@ const PublicationsTable: FC<PublicationsTableProps> = ({
           ) : (
             <NoData />
           ),
-      }
+      },
     ],
     [openInNewTab, showSources],
   );
@@ -73,7 +92,8 @@ const PublicationsTable: FC<PublicationsTableProps> = ({
       ? publications.slice((currentPage - 1) * pageSize, currentPage * pageSize)
       : publications;
 
-  const maxPage = pageSize != null ? Math.ceil(publications.length / pageSize) : 1;
+  const maxPage =
+    pageSize != null ? Math.ceil(publications.length / pageSize) : 1;
 
   return (
     <>
diff --git a/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetForm.test.tsx b/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetForm.test.tsx
index e7d2fe40e..e05dabd93 100644
--- a/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetForm.test.tsx
+++ b/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetForm.test.tsx
@@ -50,7 +50,9 @@ describe("RemoveTargetForm", () => {
       />,
     );
 
-    expect(screen.getByText(/this action is irreversible/i)).toBeInTheDocument();
+    expect(
+      screen.getByText(/this action is irreversible/i),
+    ).toBeInTheDocument();
   });
 
   it("renders Cancel and Remove target buttons", () => {
@@ -67,9 +69,7 @@ describe("RemoveTargetForm", () => {
       />,
     );
 
-    expect(
-      screen.getByRole("button", { name: /cancel/i }),
-    ).toBeInTheDocument();
+    expect(screen.getByRole("button", { name: /cancel/i })).toBeInTheDocument();
     expect(
       screen.getByRole("button", { name: /remove target/i }),
     ).toBeInTheDocument();
@@ -141,8 +141,9 @@ describe("RemoveTargetForm", () => {
 
   it("submits the deletion after typing the confirmation text", async () => {
     server.use(
-      http.delete(`${API_URL_DEB_ARCHIVE}v1/publicationTargets/:id`, () =>
-        new HttpResponse(null, { status: 204 }),
+      http.delete(
+        `${API_URL_DEB_ARCHIVE}v1/publicationTargets/:id`,
+        () => new HttpResponse(null, { status: 204 }),
       ),
     );
 
@@ -160,7 +161,9 @@ describe("RemoveTargetForm", () => {
     );
 
     await user.type(
-      screen.getByPlaceholderText(`remove ${targetWithPublications.displayName}`),
+      screen.getByPlaceholderText(
+        `remove ${targetWithPublications.displayName}`,
+      ),
       `remove ${targetWithPublications.displayName}`,
     );
     await user.click(screen.getByRole("button", { name: /remove target/i }));
@@ -191,7 +194,9 @@ describe("RemoveTargetForm", () => {
     );
 
     await user.type(
-      screen.getByPlaceholderText(`remove ${targetWithPublications.displayName}`),
+      screen.getByPlaceholderText(
+        `remove ${targetWithPublications.displayName}`,
+      ),
       `remove ${targetWithPublications.displayName}`,
     );
     await user.click(screen.getByRole("button", { name: /remove target/i }));
@@ -221,8 +226,6 @@ describe("RemoveTargetForm", () => {
     );
     await user.click(screen.getByRole("button", { name: /remove target/i }));
 
-    expect(
-      screen.queryByText(/removed successfully/i),
-    ).not.toBeInTheDocument();
+    expect(screen.queryByText(/removed successfully/i)).not.toBeInTheDocument();
   });
 });
diff --git a/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetModal.tsx b/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetModal.tsx
index be4d292cb..22411221f 100644
--- a/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetModal.tsx
+++ b/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetModal.tsx
@@ -9,8 +9,10 @@ import useRemovePublicationTarget from "../../api/useRemovePublicationTarget";
 import type { PublicationTarget } from "../../types";
 import PublicationsTable from "../PublicationsTable/PublicationsTable";
 
-interface RemoveTargetModalProps
-  extends Pick<TextConfirmationModalProps, "close" | "isOpen"> {
+interface RemoveTargetModalProps extends Pick<
+  TextConfirmationModalProps,
+  "close" | "isOpen"
+> {
   readonly target: PublicationTarget;
 }
 
@@ -39,7 +41,7 @@ const RemoveTargetModal: FC<RemoveTargetModalProps> = ({
 
       setPageParams({ sidePath: [], name: "" });
       await removeTarget({ name: target.name });
-      
+
       notify.success({
         message: `You have successfully removed ${target.displayName}`,
         title: "Publication target removed",
@@ -70,7 +72,11 @@ const RemoveTargetModal: FC<RemoveTargetModalProps> = ({
             This publication target is currently being used by the following
             publications:
           </p>
-          <PublicationsTable publications={publications} pageSize={PAGE_SIZE} openInNewTab />
+          <PublicationsTable
+            publications={publications}
+            pageSize={PAGE_SIZE}
+            openInNewTab
+          />
         </>
       )}
       <p>
@@ -82,4 +88,3 @@ const RemoveTargetModal: FC<RemoveTargetModalProps> = ({
 };
 
 export default RemoveTargetModal;
-
diff --git a/src/features/publication-targets/components/TargetDetails/TargetDetails.test.tsx b/src/features/publication-targets/components/TargetDetails/TargetDetails.test.tsx
index 0f6873157..0dffc10e8 100644
--- a/src/features/publication-targets/components/TargetDetails/TargetDetails.test.tsx
+++ b/src/features/publication-targets/components/TargetDetails/TargetDetails.test.tsx
@@ -127,7 +127,10 @@ describe("TargetDetails", () => {
       expect(container).toHaveInfoItem("Bucket Name", s3WithPubs.bucket);
       expect(container).toHaveInfoItem("Prefix", s3WithPubs.prefix ?? "");
       expect(container).toHaveInfoItem("ACL", s3WithPubs.acl ?? "");
-      expect(container).toHaveInfoItem("Storage class", s3WithPubs.storageClass ?? "");
+      expect(container).toHaveInfoItem(
+        "Storage class",
+        s3WithPubs.storageClass ?? "",
+      );
       expect(container).toHaveInfoItem(
         "Encryption method",
         s3WithPubs.encryptionMethod ?? "",
@@ -237,4 +240,3 @@ describe("TargetDetails", () => {
     });
   });
 });
-
diff --git a/src/features/publication-targets/components/TargetDetails/TargetDetails.tsx b/src/features/publication-targets/components/TargetDetails/TargetDetails.tsx
index e27c8fb19..b2affeb78 100644
--- a/src/features/publication-targets/components/TargetDetails/TargetDetails.tsx
+++ b/src/features/publication-targets/components/TargetDetails/TargetDetails.tsx
@@ -70,7 +70,7 @@ const TargetDetails: FC<TargetDetailsProps> = ({ target }) => {
       </div>
       <Blocks dense>
         <Blocks.Item title="Details">
-        <InfoGrid dense>
+          <InfoGrid dense>
             <InfoGrid.Item label="Name" large value={target.displayName} />
 
             {s3Fields && (
@@ -79,13 +79,24 @@ const TargetDetails: FC<TargetDetailsProps> = ({ target }) => {
                 <InfoGrid.Item label="Bucket Name" value={s3Fields.bucket} />
                 <InfoGrid.Item label="Prefix" value={s3Fields.prefix} />
                 <InfoGrid.Item label="ACL" value={s3Fields.acl} />
-                <InfoGrid.Item label="Storage class" value={s3Fields.storageClass} />
-                <InfoGrid.Item label="Encryption method" value={s3Fields.encryptionMethod} />
-                <InfoGrid.Item label="Disable MultiDel" value={s3Fields.disableMultiDel} />
-                <InfoGrid.Item label="Force AWS SIGv2" value={s3Fields.forceSigV2} />
+                <InfoGrid.Item
+                  label="Storage class"
+                  value={s3Fields.storageClass}
+                />
+                <InfoGrid.Item
+                  label="Encryption method"
+                  value={s3Fields.encryptionMethod}
+                />
+                <InfoGrid.Item
+                  label="Disable MultiDel"
+                  value={s3Fields.disableMultiDel}
+                />
+                <InfoGrid.Item
+                  label="Force AWS SIGv2"
+                  value={s3Fields.forceSigV2}
+                />
               </>
             )}
-
           </InfoGrid>
         </Blocks.Item>
 
@@ -111,4 +122,3 @@ const TargetDetails: FC<TargetDetailsProps> = ({ target }) => {
 };
 
 export default TargetDetails;
-
diff --git a/src/features/publications/api/useGetPublications.ts b/src/features/publications/api/useGetPublications.ts
index b7afc825d..4297da1dd 100644
--- a/src/features/publications/api/useGetPublications.ts
+++ b/src/features/publications/api/useGetPublications.ts
@@ -46,9 +46,7 @@ const matchesSearch = (
   if (!value) return true;
   switch (prefix) {
     case "publicationTargetId:":
-      return (
-        getPublicationTargetName(publication.publicationTarget) === value
-      );
+      return getPublicationTargetName(publication.publicationTarget) === value;
     case "publicationTarget:":
       return (getPublicationTargetName(publication.publicationTarget) ?? "")
         .toLowerCase()
diff --git a/src/features/repository-profiles/api/useGetProfileInstancesCount.ts b/src/features/repository-profiles/api/useGetProfileInstancesCount.ts
index 45eec8e97..af76a48a8 100644
--- a/src/features/repository-profiles/api/useGetProfileInstancesCount.ts
+++ b/src/features/repository-profiles/api/useGetProfileInstancesCount.ts
@@ -18,7 +18,7 @@ export const useGetProfileInstancesCount = (profileId: number) => {
         params: {
           query: `profile:repository:${profileId}`,
           root_only: false,
-          limit: 1
+          limit: 1,
         },
       }),
   });
diff --git a/src/features/repository-profiles/api/useGetRepositoryProfile.ts b/src/features/repository-profiles/api/useGetRepositoryProfile.ts
index 8319fb178..0951a4e94 100644
--- a/src/features/repository-profiles/api/useGetRepositoryProfile.ts
+++ b/src/features/repository-profiles/api/useGetRepositoryProfile.ts
@@ -11,7 +11,10 @@ export function useGetRepositoryProfile(name: string) {
   return useSuspenseQuery<RepositoryProfile, AxiosError<ApiError>>({
     queryKey: ["repositoryProfile", name],
     queryFn: async () => {
-      const response = await authFetch.get<ApiPaginatedResponse<RepositoryProfile>>("repositoryprofiles");
+      const response =
+        await authFetch.get<ApiPaginatedResponse<RepositoryProfile>>(
+          "repositoryprofiles",
+        );
       const profile = response.data.results.find((p) => p.name === name);
 
       if (!profile) throw new Error(`Repository profile "${name}" not found`);
diff --git a/src/features/repository-profiles/api/useRepositoryProfiles.ts b/src/features/repository-profiles/api/useRepositoryProfiles.ts
index b4397979e..ba2d1f994 100644
--- a/src/features/repository-profiles/api/useRepositoryProfiles.ts
+++ b/src/features/repository-profiles/api/useRepositoryProfiles.ts
@@ -69,11 +69,13 @@ export default function useRepositoryProfiles() {
     mutationFn: async ({ apt_sources, ...params }) =>
       authFetch.post("repositoryprofiles", {
         ...params,
-        apt_sources: apt_sources?.map(({ name: sourceName, line, gpg_key }) => ({
-          name: sourceName,
-          line,
-          gpg_key: gpg_key ? { content: gpg_key } : null,
-        })),
+        apt_sources: apt_sources?.map(
+          ({ name: sourceName, line, gpg_key }) => ({
+            name: sourceName,
+            line,
+            gpg_key: gpg_key ? { content: gpg_key } : null,
+          }),
+        ),
       }),
     onSuccess: async () => {
       queryClient.invalidateQueries({
@@ -92,11 +94,13 @@ export default function useRepositoryProfiles() {
     mutationFn: async ({ name, add_apt_sources, ...params }) =>
       authFetch.put(`repositoryprofiles/${name}`, {
         ...params,
-        add_apt_sources: add_apt_sources?.map(({ name: sourceName, line, gpg_key }) => ({
-          name: sourceName,
-          line,
-          gpg_key: gpg_key ? { content: gpg_key } : null,
-        })),
+        add_apt_sources: add_apt_sources?.map(
+          ({ name: sourceName, line, gpg_key }) => ({
+            name: sourceName,
+            line,
+            gpg_key: gpg_key ? { content: gpg_key } : null,
+          }),
+        ),
       }),
     onSuccess: async () => {
       queryClient.invalidateQueries({
diff --git a/src/features/repository-profiles/components/RepositoryProfileContainer/RepositoryProfileContainer.test.tsx b/src/features/repository-profiles/components/RepositoryProfileContainer/RepositoryProfileContainer.test.tsx
index b41d06ff7..a8db790b7 100644
--- a/src/features/repository-profiles/components/RepositoryProfileContainer/RepositoryProfileContainer.test.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileContainer/RepositoryProfileContainer.test.tsx
@@ -57,9 +57,7 @@ describe("RepositoryProfileContainer", () => {
     await expectLoadingState();
 
     expect(screen.getByRole("table")).toBeInTheDocument();
-    expect(
-      screen.getByText(repositoryProfiles[0].title),
-    ).toBeInTheDocument();
+    expect(screen.getByText(repositoryProfiles[0].title)).toBeInTheDocument();
   });
 
   it("renders loading state while filtered profiles are pending", async () => {
diff --git a/src/features/repository-profiles/components/RepositoryProfileDetails/RepositoryProfileDetails.test.tsx b/src/features/repository-profiles/components/RepositoryProfileDetails/RepositoryProfileDetails.test.tsx
index 5159649d8..db73e3c79 100644
--- a/src/features/repository-profiles/components/RepositoryProfileDetails/RepositoryProfileDetails.test.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileDetails/RepositoryProfileDetails.test.tsx
@@ -61,9 +61,7 @@ describe("RepositoryProfileDetails", () => {
     );
 
     expect(screen.getByRole("dialog")).toBeInTheDocument();
-    expect(
-      screen.getByText(/This will remove/),
-    ).toBeInTheDocument();
+    expect(screen.getByText(/This will remove/)).toBeInTheDocument();
   });
 
   it("closes the confirmation modal after successful profile removal", async () => {
diff --git a/src/features/repository-profiles/components/RepositoryProfileDetails/RepositoryProfileDetails.tsx b/src/features/repository-profiles/components/RepositoryProfileDetails/RepositoryProfileDetails.tsx
index 6e7281fbb..6c571e5d3 100644
--- a/src/features/repository-profiles/components/RepositoryProfileDetails/RepositoryProfileDetails.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileDetails/RepositoryProfileDetails.tsx
@@ -26,17 +26,25 @@ const aptSourceColumns: Column<APTSource>[] = [
 ];
 
 const RepositoryProfileDetails: FC = () => {
-  const { name, createPageParamsSetter, createSidePathPusher } = usePageParams();
+  const { name, createPageParamsSetter, createSidePathPusher } =
+    usePageParams();
   const profile = useGetRepositoryProfile(name).data;
   const closePanel = createPageParamsSetter({ sidePath: [], name: "" });
   const debug = useDebug();
   const { notify } = useNotify();
 
   const [sourcesPage, setSourcesPage] = useState(1);
-  const totalSourcePages = Math.max(1, Math.ceil(profile.apt_sources.length / SOURCES_PAGE_SIZE));
+  const totalSourcePages = Math.max(
+    1,
+    Math.ceil(profile.apt_sources.length / SOURCES_PAGE_SIZE),
+  );
   const safeSourcesPage = Math.min(sourcesPage, totalSourcePages);
   const pagedSources = useMemo(
-    () => profile.apt_sources.slice((safeSourcesPage - 1) * SOURCES_PAGE_SIZE, safeSourcesPage * SOURCES_PAGE_SIZE),
+    () =>
+      profile.apt_sources.slice(
+        (safeSourcesPage - 1) * SOURCES_PAGE_SIZE,
+        safeSourcesPage * SOURCES_PAGE_SIZE,
+      ),
     [profile.apt_sources, safeSourcesPage],
   );
 
@@ -73,66 +81,76 @@ const RepositoryProfileDetails: FC = () => {
     <>
       <SidePanel.Header>{profile.title}</SidePanel.Header>
       <SidePanel.Content>
-      <div className="p-segmented-control u-sv2">
-        <div className="p-segmented-control__list">
-          <Button
-            type="button"
-            className="p-segmented-control__button"
-            onClick={handleEditProfile}
-            hasIcon
-          >
-            <Icon name="edit" />
-            <span>Edit</span>
-          </Button>
+        <div className="p-segmented-control u-sv2">
+          <div className="p-segmented-control__list">
+            <Button
+              type="button"
+              className="p-segmented-control__button"
+              onClick={handleEditProfile}
+              hasIcon
+            >
+              <Icon name="edit" />
+              <span>Edit</span>
+            </Button>
 
-          <Button
-            type="button"
-            className="p-segmented-control__button"
-            onClick={openModal}
-            hasIcon
-            aria-label={`Remove ${profile.title}`}
-          >
-            <Icon name={`${ICONS.delete}--negative`} />
-            <span className="u-text--negative">Remove</span>
-          </Button>
+            <Button
+              type="button"
+              className="p-segmented-control__button"
+              onClick={openModal}
+              hasIcon
+              aria-label={`Remove ${profile.title}`}
+            >
+              <Icon name={`${ICONS.delete}--negative`} />
+              <span className="u-text--negative">Remove</span>
+            </Button>
+          </div>
         </div>
-      </div>
-      <Blocks dense>
-        <ViewProfileGeneralBlock profile={profile} type={ProfileTypes.repository} />
-        <Blocks.Item title="Sources">
-          <ModularTable
-            columns={aptSourceColumns}
-            data={pagedSources}
-            emptyMsg="No sources have been added yet."
-          />
-          <ModalTablePagination
-            current={safeSourcesPage}
-            max={totalSourcePages}
-            onPrev={() => { setSourcesPage(safeSourcesPage - 1); }}
-            onNext={() => { setSourcesPage(safeSourcesPage + 1); }}
+        <Blocks dense>
+          <ViewProfileGeneralBlock
+            profile={profile}
+            type={ProfileTypes.repository}
           />
-        </Blocks.Item>
+          <Blocks.Item title="Sources">
+            <ModularTable
+              columns={aptSourceColumns}
+              data={pagedSources}
+              emptyMsg="No sources have been added yet."
+            />
+            <ModalTablePagination
+              current={safeSourcesPage}
+              max={totalSourcePages}
+              onPrev={() => {
+                setSourcesPage(safeSourcesPage - 1);
+              }}
+              onNext={() => {
+                setSourcesPage(safeSourcesPage + 1);
+              }}
+            />
+          </Blocks.Item>
         </Blocks>
 
-        <ViewProfileAssociationBlock profile={profile} type={ProfileTypes.repository} />
+        <ViewProfileAssociationBlock
+          profile={profile}
+          type={ProfileTypes.repository}
+        />
       </SidePanel.Content>
 
-        <TextConfirmationModal
-          isOpen={isModalOpen}
-          confirmationText={`remove ${profile.title}`}
-          title="Remove repository profile"
-          confirmButtonLabel="Remove"
-          confirmButtonAppearance="negative"
-          confirmButtonDisabled={isRemoving}
-          confirmButtonLoading={isRemoving}
-          onConfirm={handleRemoveProfile}
-          close={closeModal}
-        >
-          <p>
-            This will remove &quot;{profile.title}&quot; profile. This action is{" "}
-            <b>irreversible</b>.
-          </p>
-        </TextConfirmationModal>
+      <TextConfirmationModal
+        isOpen={isModalOpen}
+        confirmationText={`remove ${profile.title}`}
+        title="Remove repository profile"
+        confirmButtonLabel="Remove"
+        confirmButtonAppearance="negative"
+        confirmButtonDisabled={isRemoving}
+        confirmButtonLoading={isRemoving}
+        onConfirm={handleRemoveProfile}
+        close={closeModal}
+      >
+        <p>
+          This will remove &quot;{profile.title}&quot; profile. This action is{" "}
+          <b>irreversible</b>.
+        </p>
+      </TextConfirmationModal>
     </>
   );
 };
diff --git a/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.test.tsx b/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.test.tsx
index 10eae94e0..82f44fb33 100644
--- a/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.test.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.test.tsx
@@ -15,13 +15,8 @@ describe("RepositoryProfileForm", () => {
   });
 
   const fillAndAddSource = async () => {
-    await user.click(
-      screen.getByRole("button", { name: /add source/i }),
-    );
-    await user.type(
-      await screen.findByLabelText(/source name/i),
-      "my-source",
-    );
+    await user.click(screen.getByRole("button", { name: /add source/i }));
+    await user.type(await screen.findByLabelText(/source name/i), "my-source");
     await user.type(
       screen.getByLabelText(/deb line/i),
       "deb http://archive.ubuntu.com/ubuntu focal main",
@@ -65,10 +60,14 @@ describe("RepositoryProfileForm", () => {
 
     await screen.findByDisplayValue(repositoryProfiles[0].title);
     await user.click(
-      screen.getByRole("button", { name: /Save changes to repository profile/i }),
+      screen.getByRole("button", {
+        name: /Save changes to repository profile/i,
+      }),
     );
 
-    expect(screen.queryByText(/this field is required/i)).not.toBeInTheDocument();
+    expect(
+      screen.queryByText(/this field is required/i),
+    ).not.toBeInTheDocument();
   });
 
   it("shows validation error for required title field in add mode", async () => {
@@ -107,7 +106,9 @@ describe("RepositoryProfileForm", () => {
       <RepositoryProfileForm action="edit" profile={repositoryProfiles[0]} />,
     );
 
-    expect(screen.queryByRole("combobox", { name: /access group/i })).not.toBeInTheDocument();
+    expect(
+      screen.queryByRole("combobox", { name: /access group/i }),
+    ).not.toBeInTheDocument();
   });
 
   it("clicking Add source opens the source form overlay", async () => {
@@ -115,9 +116,7 @@ describe("RepositoryProfileForm", () => {
 
     await user.click(screen.getByRole("button", { name: /add source/i }));
 
-    expect(
-      await screen.findByLabelText(/source name/i),
-    ).toBeInTheDocument();
+    expect(await screen.findByLabelText(/source name/i)).toBeInTheDocument();
     expect(screen.getByLabelText(/deb line/i)).toBeInTheDocument();
   });
 
@@ -154,9 +153,7 @@ describe("RepositoryProfileForm", () => {
 
     setEndpointStatus("default");
 
-    await user.click(
-      screen.getByRole("button", { name: /Edit my-source/i }),
-    );
+    await user.click(screen.getByRole("button", { name: /Edit my-source/i }));
     await user.click(
       await screen.findByRole("button", { name: /save changes/i }),
     );
diff --git a/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.tsx b/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.tsx
index 3b11b5564..fcd89531a 100644
--- a/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileForm/RepositoryProfileForm.tsx
@@ -9,7 +9,10 @@ import RepositoryProfileFormSourcesSection from "../RepositoryProfileFormSources
 import RepositoryProfileSourceFormOverlay from "../RepositoryProfileSourceFormOverlay";
 import type { CreateRepositoryProfileParams } from "../../api";
 import { useRepositoryProfiles } from "../../api";
-import type { RepositoryProfile, RepositoryProfileFormValues } from "../../types";
+import type {
+  RepositoryProfile,
+  RepositoryProfileFormValues,
+} from "../../types";
 import type { APTSource } from "@/features/apt-sources";
 import useDebug from "@/hooks/useDebug";
 import useNotify from "@/hooks/useNotify";
@@ -40,7 +43,8 @@ const RepositoryProfileForm: FC<RepositoryProfileFormProps> = (props) => {
 
   const debug = useDebug();
   const { notify } = useNotify();
-  const { closeSidePanel, setSidePanelTitle, setOnCloseOverride } = useSidePanel();
+  const { closeSidePanel, setSidePanelTitle, setOnCloseOverride } =
+    useSidePanel();
 
   const panelTitle =
     props.action === "add"
@@ -90,7 +94,9 @@ const RepositoryProfileForm: FC<RepositoryProfileFormProps> = (props) => {
           ...valuesToSubmit,
           add_apt_sources: values.apt_sources.filter((s) => s.id === 0),
           remove_apt_sources: originalSources
-            .filter((orig) => !values.apt_sources.some((cur) => cur.id === orig.id))
+            .filter(
+              (orig) => !values.apt_sources.some((cur) => cur.id === orig.id),
+            )
             .map((s) => s.id),
         });
         (props.onClose ?? closeSidePanel)();
@@ -156,10 +162,7 @@ const RepositoryProfileForm: FC<RepositoryProfileFormProps> = (props) => {
     setOnCloseOverride(closeSourceOverlay);
     setSidePanelTitle(
       <>
-        <Link
-          className="u-no-margin--bottom"
-          onClick={closeSourceOverlay}
-        >
+        <Link className="u-no-margin--bottom" onClick={closeSourceOverlay}>
           {panelTitle}
         </Link>
         {" / Edit source"}
@@ -198,7 +201,6 @@ const RepositoryProfileForm: FC<RepositoryProfileFormProps> = (props) => {
               />
             </Blocks.Item>
 
-
             <Blocks.Item>
               <div className={classes.sourcesHeader}>
                 <h4 className="p-heading--5 u-no-margin--bottom">Sources</h4>
@@ -246,8 +248,12 @@ const RepositoryProfileForm: FC<RepositoryProfileFormProps> = (props) => {
           submitButtonText={CTA_INFO[props.action].label}
           submitButtonAriaLabel={CTA_INFO[props.action].ariaLabel}
           onCancel={props.action === "edit" ? props.onClose : undefined}
-          hasBackButton={props.action === "edit" ? props.hasBackButton : undefined}
-          onBackButtonPress={props.action === "edit" ? props.onBackButtonPress : undefined}
+          hasBackButton={
+            props.action === "edit" ? props.hasBackButton : undefined
+          }
+          onBackButtonPress={
+            props.action === "edit" ? props.onBackButtonPress : undefined
+          }
         />
       </Form>
 
diff --git a/src/features/repository-profiles/components/RepositoryProfileFormAptSourcesPanel/RepositoryProfileFormAptSourcesPanel.test.tsx b/src/features/repository-profiles/components/RepositoryProfileFormAptSourcesPanel/RepositoryProfileFormAptSourcesPanel.test.tsx
index 2472debfa..6008fb038 100644
--- a/src/features/repository-profiles/components/RepositoryProfileFormAptSourcesPanel/RepositoryProfileFormAptSourcesPanel.test.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileFormAptSourcesPanel/RepositoryProfileFormAptSourcesPanel.test.tsx
@@ -54,10 +54,15 @@ describe("RepositoryProfileFormAptSourcesPanel", () => {
     expect(selectedCheckbox).toBeChecked();
 
     await user.click(sourceCheckbox);
-    expect(formik.setFieldValue).toHaveBeenCalledWith("apt_sources", [aptSources[1], aptSources[0]]);
+    expect(formik.setFieldValue).toHaveBeenCalledWith("apt_sources", [
+      aptSources[1],
+      aptSources[0],
+    ]);
 
     await user.click(selectedCheckbox);
-    expect(formik.setFieldValue).toHaveBeenCalledWith("apt_sources", [aptSources[0]]);
+    expect(formik.setFieldValue).toHaveBeenCalledWith("apt_sources", [
+      aptSources[0],
+    ]);
   });
 
   it("shows empty state when no APT sources match search", async () => {
diff --git a/src/features/repository-profiles/components/RepositoryProfileFormDetailsPanel/RepositoryProfileFormDetailsPanel.tsx b/src/features/repository-profiles/components/RepositoryProfileFormDetailsPanel/RepositoryProfileFormDetailsPanel.tsx
index 27a0e443e..9ea7f2f63 100644
--- a/src/features/repository-profiles/components/RepositoryProfileFormDetailsPanel/RepositoryProfileFormDetailsPanel.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileFormDetailsPanel/RepositoryProfileFormDetailsPanel.tsx
@@ -15,11 +15,7 @@ interface RepositoryProfileFormDetailsPanelProps {
 
 const RepositoryProfileFormDetailsPanel: FC<
   RepositoryProfileFormDetailsPanelProps
-> = ({
-  accessGroups,
-  formik,
-  isAccessGroupDisabled = false,
-}) => {
+> = ({ accessGroups, formik, isAccessGroupDisabled = false }) => {
   const accessGroupOptions = accessGroups.map(({ name, title }) => ({
     label: title,
     value: name,
diff --git a/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.test.tsx b/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.test.tsx
index f1e6850a4..589a031de 100644
--- a/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.test.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.test.tsx
@@ -19,17 +19,16 @@ describe("RepositoryProfileFormSourcesSection", () => {
   });
 
   it("renders column headers", () => {
-    renderWithProviders(<RepositoryProfileFormSourcesSection {...defaultProps} />);
+    renderWithProviders(
+      <RepositoryProfileFormSourcesSection {...defaultProps} />,
+    );
 
     expect(screen.getByText("Source name")).toBeInTheDocument();
   });
 
   it("renders empty state message when no sources", () => {
     renderWithProviders(
-      <RepositoryProfileFormSourcesSection
-        {...defaultProps}
-        sources={[]}
-      />,
+      <RepositoryProfileFormSourcesSection {...defaultProps} sources={[]} />,
     );
 
     expect(
@@ -38,7 +37,9 @@ describe("RepositoryProfileFormSourcesSection", () => {
   });
 
   it("renders source names and types", () => {
-    renderWithProviders(<RepositoryProfileFormSourcesSection {...defaultProps} />);
+    renderWithProviders(
+      <RepositoryProfileFormSourcesSection {...defaultProps} />,
+    );
 
     for (const source of aptSources.slice(0, 10)) {
       expect(screen.getByText(source.name)).toBeInTheDocument();
@@ -47,7 +48,9 @@ describe("RepositoryProfileFormSourcesSection", () => {
 
   it("calls onEditSource with the correct APTSource on edit button click", async () => {
     const [firstSource] = aptSources;
-    renderWithProviders(<RepositoryProfileFormSourcesSection {...defaultProps} />);
+    renderWithProviders(
+      <RepositoryProfileFormSourcesSection {...defaultProps} />,
+    );
 
     await user.click(
       screen.getByRole("button", { name: `Edit ${firstSource.name}` }),
@@ -61,7 +64,9 @@ describe("RepositoryProfileFormSourcesSection", () => {
 
   it("calls onRemoveSource with the correct APTSource on remove button click", async () => {
     const [firstSource] = aptSources;
-    renderWithProviders(<RepositoryProfileFormSourcesSection {...defaultProps} />);
+    renderWithProviders(
+      <RepositoryProfileFormSourcesSection {...defaultProps} />,
+    );
 
     await user.click(
       screen.getByRole("button", { name: `Remove ${firstSource.name}` }),
@@ -87,7 +92,9 @@ describe("RepositoryProfileFormSourcesSection", () => {
   });
 
   it("does not render error message when error prop is absent", () => {
-    renderWithProviders(<RepositoryProfileFormSourcesSection {...defaultProps} />);
+    renderWithProviders(
+      <RepositoryProfileFormSourcesSection {...defaultProps} />,
+    );
 
     expect(
       screen.queryByText("At least one source is required."),
diff --git a/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.tsx b/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.tsx
index 8c7b726d0..2744fbc69 100644
--- a/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileFormSourcesSection/RepositoryProfileFormSourcesSection.tsx
@@ -22,12 +22,7 @@ interface RepositoryProfileFormSourcesSectionProps {
 
 const RepositoryProfileFormSourcesSection: FC<
   RepositoryProfileFormSourcesSectionProps
-> = ({
-  sources,
-  onRemoveSource,
-  onEditSource,
-  error,
-}) => {
+> = ({ sources, onRemoveSource, onEditSource, error }) => {
   const [currentPage, setCurrentPage] = useState(1);
   const pageSize = 10;
 
@@ -42,7 +37,10 @@ const RepositoryProfileFormSourcesSection: FC<
     [sources],
   );
 
-  const safePage = Math.min(currentPage, Math.max(1, Math.ceil(rows.length / pageSize)));
+  const safePage = Math.min(
+    currentPage,
+    Math.max(1, Math.ceil(rows.length / pageSize)),
+  );
 
   const pagedRows = useMemo(
     () => rows.slice((safePage - 1) * pageSize, safePage * pageSize),
@@ -55,9 +53,7 @@ const RepositoryProfileFormSourcesSection: FC<
         accessor: "name",
         Header: "Source name",
         className: classes.nameColumn,
-        Cell: ({ row: { original } }: CellProps<SourceRow>) => (
-            original.name
-        ),
+        Cell: ({ row: { original } }: CellProps<SourceRow>) => original.name,
       },
       {
         id: "actions",
@@ -76,7 +72,10 @@ const RepositoryProfileFormSourcesSection: FC<
                 onEditSource(original.source);
               }}
             >
-              <Icon name="edit" className="u-no-margin--left u-no-margin--right" />
+              <Icon
+                name="edit"
+                className="u-no-margin--left u-no-margin--right"
+              />
             </Button>
             <Button
               appearance="base"
@@ -89,7 +88,10 @@ const RepositoryProfileFormSourcesSection: FC<
                 onRemoveSource(original.source);
               }}
             >
-              <Icon name="delete" className="u-no-margin--left u-no-margin--right" />
+              <Icon
+                name="delete"
+                className="u-no-margin--left u-no-margin--right"
+              />
             </Button>
           </div>
         ),
@@ -108,8 +110,12 @@ const RepositoryProfileFormSourcesSection: FC<
       <ModalTablePagination
         current={safePage}
         max={Math.max(1, Math.ceil(rows.length / pageSize))}
-        onPrev={() => { setCurrentPage(safePage - 1); }}
-        onNext={() => { setCurrentPage(safePage + 1); }}
+        onPrev={() => {
+          setCurrentPage(safePage - 1);
+        }}
+        onNext={() => {
+          setCurrentPage(safePage + 1);
+        }}
       />
       {error && (
         <div className="p-form-validation is-error">
diff --git a/src/features/repository-profiles/components/RepositoryProfileFormTabs/RepositoryProfileFormTabs.test.tsx b/src/features/repository-profiles/components/RepositoryProfileFormTabs/RepositoryProfileFormTabs.test.tsx
index 31e6f2ef3..846b1bb39 100644
--- a/src/features/repository-profiles/components/RepositoryProfileFormTabs/RepositoryProfileFormTabs.test.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileFormTabs/RepositoryProfileFormTabs.test.tsx
@@ -14,7 +14,9 @@ describe("RepositoryProfileFormTabs", () => {
 
     expect(screen.getByRole("tab", { name: "Details" })).toBeInTheDocument();
     expect(screen.getByRole("tab", { name: "Pockets" })).toBeInTheDocument();
-    expect(screen.getByRole("tab", { name: "APT sources" })).toBeInTheDocument();
+    expect(
+      screen.getByRole("tab", { name: "APT sources" }),
+    ).toBeInTheDocument();
   });
 
   it("marks the active tab based on currentTab prop", () => {
@@ -22,9 +24,17 @@ describe("RepositoryProfileFormTabs", () => {
       <RepositoryProfileFormTabs currentTab={1} onCurrentTabChange={vi.fn()} />,
     );
 
-    expect(screen.getByRole("tab", { name: "Pockets" })).toHaveAttribute("aria-selected", "true");
-    expect(screen.getByRole("tab", { name: "Details" })).not.toHaveAttribute("aria-selected", "true");
-    expect(screen.getByRole("tab", { name: "APT sources" })).not.toHaveAttribute("aria-selected", "true");
+    expect(screen.getByRole("tab", { name: "Pockets" })).toHaveAttribute(
+      "aria-selected",
+      "true",
+    );
+    expect(screen.getByRole("tab", { name: "Details" })).not.toHaveAttribute(
+      "aria-selected",
+      "true",
+    );
+    expect(
+      screen.getByRole("tab", { name: "APT sources" }),
+    ).not.toHaveAttribute("aria-selected", "true");
   });
 
   it("calls onCurrentTabChange with 0 when Details tab is clicked", async () => {
diff --git a/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.test.tsx b/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.test.tsx
index 4bdc037db..fd9b956c0 100644
--- a/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.test.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.test.tsx
@@ -46,7 +46,8 @@ describe("RepositoryProfileList", () => {
 
     const table = screen.getByRole("table");
     const row = within(table).getByRole("row", {
-      name: (name) => name.toLowerCase().includes(firstProfile.title.toLowerCase()),
+      name: (name) =>
+        name.toLowerCase().includes(firstProfile.title.toLowerCase()),
     });
 
     expect(
@@ -68,7 +69,9 @@ describe("RepositoryProfileList", () => {
     );
 
     expect(
-      await screen.findByText(/sidePath=view/, { selector: "[data-testid='location']" }),
+      await screen.findByText(/sidePath=view/, {
+        selector: "[data-testid='location']",
+      }),
     ).toHaveTextContent(`name=${firstProfile.name}`);
   });
 
diff --git a/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.tsx b/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.tsx
index aa00f83c9..42729db8e 100644
--- a/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileList/RepositoryProfileList.tsx
@@ -18,8 +18,11 @@ import RepositoryProfileListActions from "../RepositoryProfileListActions";
 import { getCellProps, getRowProps } from "./helpers";
 import classes from "./RepositoryProfileList.module.scss";
 
-const AssociatedCountCell: FC<{ readonly profileId: number }> = ({ profileId }) => {
-  const { associatedCount, isLoadingCount } = useGetProfileInstancesCount(profileId);
+const AssociatedCountCell: FC<{ readonly profileId: number }> = ({
+  profileId,
+}) => {
+  const { associatedCount, isLoadingCount } =
+    useGetProfileInstancesCount(profileId);
   if (isLoadingCount) {
     return <LoadingState inline />;
   }
@@ -46,9 +49,8 @@ const RepositoryProfileList: FC<RepositoryProfileListProps> = ({
     value: name,
   }));
 
-  const columns = useMemo<Column<RepositoryProfile>[]>(
-    () => {
-      return [
+  const columns = useMemo<Column<RepositoryProfile>[]>(() => {
+    return [
       {
         ...LIST_TITLE_COLUMN_PROPS,
         meta: {
@@ -61,7 +63,10 @@ const RepositoryProfileList: FC<RepositoryProfileListProps> = ({
               type="button"
               appearance="link"
               className="u-no-margin--bottom u-no-padding--top u-align--left"
-              onClick={createPageParamsSetter({ sidePath: ["view"], name: original.name })}
+              onClick={createPageParamsSetter({
+                sidePath: ["view"],
+                name: original.name,
+              })}
             >
               {original.title}
             </Button>
@@ -85,7 +90,8 @@ const RepositoryProfileList: FC<RepositoryProfileListProps> = ({
         Header: "Associated",
         className: classes.associated,
         meta: {
-          ariaLabel: ({ original }) => `${original.title} profile associated machines count`,
+          ariaLabel: ({ original }) =>
+            `${original.title} profile associated machines count`,
         },
         Cell: ({ row: { original } }: CellProps<RepositoryProfile>) => (
           <AssociatedCountCell profileId={original.id} />
@@ -96,20 +102,24 @@ const RepositoryProfileList: FC<RepositoryProfileListProps> = ({
         Header: "Applied",
         className: classes.applied,
         meta: {
-          ariaLabel: ({ original }) => `${original.title} profile applied machines count`,
+          ariaLabel: ({ original }) =>
+            `${original.title} profile applied machines count`,
         },
-        Cell: ({ row: { original } }: CellProps<RepositoryProfile>) =>
-          <>{original.applied_count ?? 0}</>,
+        Cell: ({ row: { original } }: CellProps<RepositoryProfile>) => (
+          <>{original.applied_count ?? 0}</>
+        ),
       },
       {
         accessor: "pending_count",
         Header: "Pending",
         className: classes.pending,
         meta: {
-          ariaLabel: ({ original }) => `${original.title} profile pending machines count`,
+          ariaLabel: ({ original }) =>
+            `${original.title} profile pending machines count`,
         },
-        Cell: ({ row: { original } }: CellProps<RepositoryProfile>) =>
-          <>{original.pending_count ?? 0}</>,
+        Cell: ({ row: { original } }: CellProps<RepositoryProfile>) => (
+          <>{original.pending_count ?? 0}</>
+        ),
       },
       {
         ...LIST_ACTIONS_COLUMN_PROPS,
@@ -118,9 +128,7 @@ const RepositoryProfileList: FC<RepositoryProfileListProps> = ({
         ),
       },
     ];
-  },
-    [accessGroupOptions],
-  );
+  }, [accessGroupOptions]);
 
   return (
     <>
diff --git a/src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.test.tsx b/src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.test.tsx
index 36bebfe11..6fe54164a 100644
--- a/src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.test.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.test.tsx
@@ -78,10 +78,7 @@ describe("RepositoryProfileListActions", () => {
     const removeButton = screen.getByRole("button", { name: "Remove" });
     expect(removeButton).toHaveAttribute("aria-disabled", "true");
 
-    await user.type(
-      screen.getByRole("textbox"),
-      `remove ${profile.title}`,
-    );
+    await user.type(screen.getByRole("textbox"), `remove ${profile.title}`);
     expect(removeButton).not.toHaveAttribute("aria-disabled", "true");
   });
 
@@ -89,10 +86,7 @@ describe("RepositoryProfileListActions", () => {
     renderWithProviders(<RepositoryProfileListActions profile={profile} />);
     await openRemoveModal();
 
-    await user.type(
-      screen.getByRole("textbox"),
-      `remove ${profile.title}`,
-    );
+    await user.type(screen.getByRole("textbox"), `remove ${profile.title}`);
     await user.click(screen.getByRole("button", { name: "Remove" }));
 
     expect(
@@ -105,10 +99,7 @@ describe("RepositoryProfileListActions", () => {
     setEndpointStatus({ status: "error", path: "RemoveRepositoryProfile" });
 
     await openRemoveModal();
-    await user.type(
-      screen.getByRole("textbox"),
-      `remove ${profile.title}`,
-    );
+    await user.type(screen.getByRole("textbox"), `remove ${profile.title}`);
     await user.click(screen.getByRole("button", { name: "Remove" }));
 
     expect(
diff --git a/src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.tsx b/src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.tsx
index e1411f241..be456ed60 100644
--- a/src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileListActions/RepositoryProfileListActions.tsx
@@ -31,7 +31,10 @@ const RepositoryProfileListActions: FC<RepositoryProfileListActionsProps> = ({
   const { mutateAsync: removeRepositoryProfile, isPending: isRemoving } =
     removeRepositoryProfileQuery;
 
-  const handleEditProfile = createPageParamsSetter({ sidePath: ["edit"], name: profile.name });
+  const handleEditProfile = createPageParamsSetter({
+    sidePath: ["edit"],
+    name: profile.name,
+  });
 
   const handleRemoveProfile = async () => {
     try {
diff --git a/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.test.tsx b/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.test.tsx
index 8420a3405..4caafc528 100644
--- a/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.test.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.test.tsx
@@ -30,9 +30,9 @@ describe("RepositoryProfileSourceForm", () => {
 
     await user.click(screen.getByRole("button", { name: /save changes/i }));
 
-    expect(
-      await screen.findAllByText("This field is required."),
-    ).toHaveLength(2);
+    expect(await screen.findAllByText("This field is required.")).toHaveLength(
+      2,
+    );
   });
 
   it("calls onSuccess with correct APTSource on valid submit (no GPG key)", async () => {
@@ -109,9 +109,7 @@ describe("RepositoryProfileSourceForm", () => {
     await user.tab();
 
     expect(
-      await screen.findByText(
-        /name must start with alphanumeric/i,
-      ),
+      await screen.findByText(/name must start with alphanumeric/i),
     ).toBeInTheDocument();
   });
 });
diff --git a/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.tsx b/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.tsx
index 27c9fe99b..c8c035af8 100644
--- a/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileSourceForm/RepositoryProfileSourceForm.tsx
@@ -40,9 +40,11 @@ const RepositoryProfileSourceForm: FC<RepositoryProfileSourceFormProps> = ({
       <Input
         type="text"
         label="Source name"
-        help={!formik.errors.name 
-          ? "Name must start with alphanumeric and contain only lowercase letters, numbers, -, or +." 
-          : undefined}
+        help={
+          !formik.errors.name
+            ? "Name must start with alphanumeric and contain only lowercase letters, numbers, -, or +."
+            : undefined
+        }
         required
         autoComplete="off"
         error={getFormikError(formik, "name")}
@@ -62,10 +64,7 @@ const RepositoryProfileSourceForm: FC<RepositoryProfileSourceFormProps> = ({
         error={getFormikError(formik, "gpg_key_name")}
         {...formik.getFieldProps("gpg_key_name")}
       />
-      <SidePanelFormButtons
-        submitButtonText="Add source"
-        onCancel={onBack}
-      />
+      <SidePanelFormButtons submitButtonText="Add source" onCancel={onBack} />
     </Form>
   );
 };
diff --git a/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.test.tsx b/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.test.tsx
index df0dc19f0..3bd46a119 100644
--- a/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.test.tsx
+++ b/src/features/repository-profiles/components/RepositoryProfileSourceFormOverlay/RepositoryProfileSourceFormOverlay.test.tsx
@@ -18,7 +18,9 @@ describe("RepositoryProfileSourceFormOverlay", () => {
   });
 
   it("renders empty source name, deb line, and GPG key fields when no sourceToEdit", () => {
-    renderWithProviders(<RepositoryProfileSourceFormOverlay {...defaultProps} />);
+    renderWithProviders(
+      <RepositoryProfileSourceFormOverlay {...defaultProps} />,
+    );
 
     expect(screen.getByLabelText(/source name/i)).toHaveValue("");
     expect(screen.getByLabelText(/deb line/i)).toHaveValue("");
@@ -34,7 +36,9 @@ describe("RepositoryProfileSourceFormOverlay", () => {
       />,
     );
 
-    expect(screen.getByLabelText(/source name/i)).toHaveValue(sourceToEdit.name);
+    expect(screen.getByLabelText(/source name/i)).toHaveValue(
+      sourceToEdit.name,
+    );
     expect(screen.getByLabelText(/deb line/i)).toHaveValue(sourceToEdit.line);
     expect(screen.getByLabelText(/gpg key/i)).toHaveValue(
       sourceToEdit.gpg_key ?? "",
@@ -42,7 +46,9 @@ describe("RepositoryProfileSourceFormOverlay", () => {
   });
 
   it("calls onClose when cancel is clicked", async () => {
-    renderWithProviders(<RepositoryProfileSourceFormOverlay {...defaultProps} />);
+    renderWithProviders(
+      <RepositoryProfileSourceFormOverlay {...defaultProps} />,
+    );
 
     await user.click(screen.getByRole("button", { name: /cancel/i }));
 
@@ -50,7 +56,9 @@ describe("RepositoryProfileSourceFormOverlay", () => {
   });
 
   it("calls onSourceAdded with correct values on valid submit", async () => {
-    renderWithProviders(<RepositoryProfileSourceFormOverlay {...defaultProps} />);
+    renderWithProviders(
+      <RepositoryProfileSourceFormOverlay {...defaultProps} />,
+    );
 
     await user.type(screen.getByLabelText(/source name/i), "my-source");
     await user.type(
diff --git a/src/features/repository-profiles/index.ts b/src/features/repository-profiles/index.ts
index 7d666d7c4..88da25431 100644
--- a/src/features/repository-profiles/index.ts
+++ b/src/features/repository-profiles/index.ts
@@ -5,5 +5,9 @@ export { default as RepositoryProfileEditForm } from "./components/RepositoryPro
 export { default as RepositoryProfileForm } from "./components/RepositoryProfileForm";
 export { default as RepositoryProfileHeader } from "./components/RepositoryProfileHeader";
 export { default as RepositoryProfileList } from "./components/RepositoryProfileList";
-export { useRepositoryProfiles, useGetProfileInstancesCount, useGetRepositoryProfile } from "./api";
+export {
+  useRepositoryProfiles,
+  useGetProfileInstancesCount,
+  useGetRepositoryProfile,
+} from "./api";
 export type { RepositoryProfile } from "./types";
diff --git a/src/pages/dashboard/profiles/package-profiles/PackageProfilesContent/PackageProfilesContent.tsx b/src/pages/dashboard/profiles/package-profiles/PackageProfilesContent/PackageProfilesContent.tsx
index 1066cfd76..9238dc0e7 100644
--- a/src/pages/dashboard/profiles/package-profiles/PackageProfilesContent/PackageProfilesContent.tsx
+++ b/src/pages/dashboard/profiles/package-profiles/PackageProfilesContent/PackageProfilesContent.tsx
@@ -1,6 +1,9 @@
 import type { FC } from "react";
 import type { PackageProfile } from "@/features/package-profiles";
-import { PackageProfileHeader, PackageProfileList } from "@/features/package-profiles";
+import {
+  PackageProfileHeader,
+  PackageProfileList,
+} from "@/features/package-profiles";
 
 interface PackageProfilesContentProps {
   readonly packageProfiles: PackageProfile[] | undefined;
diff --git a/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.test.tsx b/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.test.tsx
index 411af4b8e..372d34824 100644
--- a/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.test.tsx
+++ b/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.test.tsx
@@ -40,7 +40,11 @@ describe("PublicationTargetsPage", () => {
   });
 
   it("renders the add form side panel when sidePath=add is in the URL", async () => {
-    renderWithProviders(<PublicationTargetsPage />, undefined, "/?sidePath=add");
+    renderWithProviders(
+      <PublicationTargetsPage />,
+      undefined,
+      "/?sidePath=add",
+    );
 
     await expectLoadingState();
 
diff --git a/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx b/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx
index 13545cd0e..640823538 100644
--- a/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx
+++ b/src/pages/dashboard/repositories/publication-targets/PublicationTargetsPage.tsx
@@ -26,13 +26,14 @@ const EditTargetForm = lazy(async () =>
 );
 
 const PublicationTargetsPage: FC = () => {
-  const { lastSidePathSegment, createPageParamsSetter, name } =
-    usePageParams();
+  const { lastSidePathSegment, createPageParamsSetter, name } = usePageParams();
   const { publicationTargets } = useGetPublicationTargets();
 
   useSetDynamicFilterValidation("sidePath", ["view", "add", "edit"]);
 
-  const viewTarget = publicationTargets.find((t) => t.publicationTargetId === name);
+  const viewTarget = publicationTargets.find(
+    (t) => t.publicationTargetId === name,
+  );
 
   const addButton = <PublicationTargetAddButton key="add" />;
 
@@ -50,7 +51,8 @@ const PublicationTargetsPage: FC = () => {
             body={
               <>
                 <p className="u-no-margin--bottom">
-                  On this page you will find all publication targets that you create to publish mirrors to.
+                  On this page you will find all publication targets that you
+                  create to publish mirrors to.
                 </p>
                 <a
                   href="https://documentation.ubuntu.com/landscape/explanation/features/repository-mirroring"
@@ -70,9 +72,7 @@ const PublicationTargetsPage: FC = () => {
   return (
     <PageMain>
       <PageHeader title="Publication targets" actions={actions} />
-      <PageContent hasTable={hasTable}>
-        {children}
-      </PageContent>
+      <PageContent hasTable={hasTable}>{children}</PageContent>
 
       <SidePanel
         onClose={createPageParamsSetter({ sidePath: [], name: "" })}
@@ -98,7 +98,9 @@ const PublicationTargetsPage: FC = () => {
 
         {lastSidePathSegment === "edit" && viewTarget && (
           <SidePanel.Suspense key="edit">
-            <SidePanel.Header>Edit {viewTarget.displayName ?? viewTarget.name}</SidePanel.Header>
+            <SidePanel.Header>
+              Edit {viewTarget.displayName ?? viewTarget.name}
+            </SidePanel.Header>
             <EditTargetForm target={viewTarget} />
           </SidePanel.Suspense>
         )}
diff --git a/src/pages/dashboard/repositories/publications/PublicationsPage.tsx b/src/pages/dashboard/repositories/publications/PublicationsPage.tsx
index 9242c638f..6196ee132 100644
--- a/src/pages/dashboard/repositories/publications/PublicationsPage.tsx
+++ b/src/pages/dashboard/repositories/publications/PublicationsPage.tsx
@@ -13,7 +13,8 @@ import {
 import type { FC } from "react";
 
 const PublicationsPage: FC = () => {
-  const { sidePath, lastSidePathSegment, createPageParamsSetter } = usePageParams();
+  const { sidePath, lastSidePathSegment, createPageParamsSetter } =
+    usePageParams();
 
   useSetDynamicFilterValidation("sidePath", ["add", "view"]);
   return (
@@ -46,4 +47,4 @@ const PublicationsPage: FC = () => {
   );
 };
 
-export default PublicationsPage;
\ No newline at end of file
+export default PublicationsPage;
diff --git a/src/pages/dashboard/repositories/repository-profiles/RepositoryProfilesPage.test.tsx b/src/pages/dashboard/repositories/repository-profiles/RepositoryProfilesPage.test.tsx
index b3bcc84e9..ea7a8f5d1 100644
--- a/src/pages/dashboard/repositories/repository-profiles/RepositoryProfilesPage.test.tsx
+++ b/src/pages/dashboard/repositories/repository-profiles/RepositoryProfilesPage.test.tsx
@@ -10,15 +10,11 @@ describe("RepositoryProfilesPage", () => {
   it("renders repository profile list with table and pagination", async () => {
     renderWithProviders(<RepositoryProfilesPage />);
 
-    expect(
-      await screen.findByRole("table"),
-    ).toBeInTheDocument();
+    expect(await screen.findByRole("table")).toBeInTheDocument();
     expect(
       screen.getByRole("heading", { name: "Repository profiles" }),
     ).toBeInTheDocument();
-    expect(
-      screen.getByText(repositoryProfiles[0].title),
-    ).toBeInTheDocument();
+    expect(screen.getByText(repositoryProfiles[0].title)).toBeInTheDocument();
   });
 
   it("renders empty state when no profiles exist", async () => {
diff --git a/src/templates/dashboard/Navigation/components/NavigationExpandable/NavigationExpandable.tsx b/src/templates/dashboard/Navigation/components/NavigationExpandable/NavigationExpandable.tsx
index 479422950..356633804 100644
--- a/src/templates/dashboard/Navigation/components/NavigationExpandable/NavigationExpandable.tsx
+++ b/src/templates/dashboard/Navigation/components/NavigationExpandable/NavigationExpandable.tsx
@@ -31,7 +31,10 @@ const NavigationExpandable: FC<NavigationExpandableProps> = ({ item }) => {
     return (
       <NavigationRoute
         item={item}
-        className={classNames(classes.accordionButton, classes.collapsedAccordionButton)}
+        className={classNames(
+          classes.accordionButton,
+          classes.collapsedAccordionButton,
+        )}
         withLinkStyle={false}
       />
     );
diff --git a/src/templates/dashboard/Navigation/components/NavigationRoute/NavigationRoute.tsx b/src/templates/dashboard/Navigation/components/NavigationRoute/NavigationRoute.tsx
index 5eab42705..99d81d65c 100644
--- a/src/templates/dashboard/Navigation/components/NavigationRoute/NavigationRoute.tsx
+++ b/src/templates/dashboard/Navigation/components/NavigationRoute/NavigationRoute.tsx
@@ -20,7 +20,11 @@ const NavigationRoute: FC<NavigationRouteProps> = ({
 }) => {
   return (
     <Link
-      className={classNames("p-side-navigation__link", { [classes.link]: withLinkStyle }, className)}
+      className={classNames(
+        "p-side-navigation__link",
+        { [classes.link]: withLinkStyle },
+        className,
+      )}
       to={item.path}
       aria-current={current ? "page" : undefined}
     >
@@ -33,7 +37,7 @@ const NavigationRoute: FC<NavigationRouteProps> = ({
         />
       )}
       <span
-        className={classNames("p-side-navigation__label", classes.label,{
+        className={classNames("p-side-navigation__label", classes.label, {
           [classes.hasBadge]: item.badge !== undefined && item.badge.count > 0,
         })}
       >
diff --git a/src/tests/browser.ts b/src/tests/browser.ts
index 3d3d65025..0c01f9e71 100644
--- a/src/tests/browser.ts
+++ b/src/tests/browser.ts
@@ -20,12 +20,15 @@ const handlers: RequestHandler[] = [
   http.all("*", async ({ request }) => {
     if (
       !request.url.includes(API_URL) &&
-      !request.url.includes(API_URL_OLD) &&  !request.url.includes('/v1/')) {
+      !request.url.includes(API_URL_OLD) &&
+      !request.url.includes("/v1/")
+    ) {
       return passthrough();
     }
 
-    if (request.url.match(/\.(ts|tsx|scss)/) 
-        // && !request.url.includes(API_URL_DEB_ARCHIVE)
+    if (
+      request.url.match(/\.(ts|tsx|scss)/)
+      // && !request.url.includes(API_URL_DEB_ARCHIVE)
     ) {
       return passthrough();
     }
diff --git a/src/tests/mocks/apt-sources.ts b/src/tests/mocks/apt-sources.ts
index e76a73245..5f6e26b4c 100644
--- a/src/tests/mocks/apt-sources.ts
+++ b/src/tests/mocks/apt-sources.ts
@@ -18,7 +18,7 @@ export const aptSources = [
       "repo-profile-9",
       "repo-profile-10",
       "repo-profile-11",
-      "repo-profile-12"
+      "repo-profile-12",
     ] as string[],
   },
   {
@@ -59,7 +59,7 @@ export const aptSources = [
     gpg_key: "key1",
     line: "deb http://example.com/ubuntu focal main",
     name: "source6",
-    profiles: ["repo-profile-1",] as string[],
+    profiles: ["repo-profile-1"] as string[],
   },
 
   {
diff --git a/src/tests/mocks/publications.ts b/src/tests/mocks/publications.ts
index b97ba46f3..6988eaf2f 100644
--- a/src/tests/mocks/publications.ts
+++ b/src/tests/mocks/publications.ts
@@ -5,7 +5,8 @@ export const publications = [
   {
     name: "publications/7b1d5c2f-0c4e-4d8e-8f2f-99d4f2d9a123",
     publicationId: "7b1d5c2f-0c4e-4d8e-8f2f-99d4f2d9a123",
-    publicationTarget: "publicationTargets/aaaaaaaa-0000-0000-0000-000000000001",
+    publicationTarget:
+      "publicationTargets/aaaaaaaa-0000-0000-0000-000000000001",
     source: "mirrors/ubuntu-archive-mirror",
     displayName: "jammy publication",
     distribution: "jammy",
@@ -24,7 +25,8 @@ export const publications = [
     name: "publications/c9f6355e-c8f3-4e73-ab4c-ef6a4c8af4c0",
     publicationId: "c9f6355e-c8f3-4e73-ab4c-ef6a4c8af4c0",
     displayName: "noble publication",
-    publicationTarget: "publicationTargets/bbbbbbbb-0000-0000-0000-000000000002",
+    publicationTarget:
+      "publicationTargets/bbbbbbbb-0000-0000-0000-000000000002",
     source: "locals/aaaa-bbbb-cccc",
     distribution: "noble",
     label: "EMEA publication",
@@ -45,7 +47,8 @@ export const publications = [
     name: "publications/g8h8888e-c8f8-8e88-ab8c-ef8a8c8af8c8",
     publicationId: "g8h8888e-c8f8-8e88-ab8c-ef8a8c8af8c8",
     displayName: "local publication",
-    publicationTarget: "publicationTargets/cccccccc-0000-0000-0000-000000000003",
+    publicationTarget:
+      "publicationTargets/cccccccc-0000-0000-0000-000000000003",
     source: "locals/bbbb-cccc-dddd",
     distribution: "noble",
     label: "Local publication",
diff --git a/src/tests/mocks/repositoryProfiles.ts b/src/tests/mocks/repositoryProfiles.ts
index 08f63bfa2..71f55f2ed 100644
--- a/src/tests/mocks/repositoryProfiles.ts
+++ b/src/tests/mocks/repositoryProfiles.ts
@@ -10,12 +10,13 @@ export const repositoryProfiles = [
     access_group: "global",
     all_computers: false,
     apt_sources: [
-      aptSources[0], 
-      aptSources[1], 
-      aptSources[2], 
-      aptSources[3], 
-      aptSources[4], 
-      aptSources[5]],
+      aptSources[0],
+      aptSources[1],
+      aptSources[2],
+      aptSources[3],
+      aptSources[4],
+      aptSources[5],
+    ],
     applied_count: 3,
     pockets: [],
     tags: ["web", "prod"],
diff --git a/src/tests/server/handlers/publicationTargets.ts b/src/tests/server/handlers/publicationTargets.ts
index 35d270ade..5b4a07ff8 100644
--- a/src/tests/server/handlers/publicationTargets.ts
+++ b/src/tests/server/handlers/publicationTargets.ts
@@ -34,7 +34,8 @@ export default [
         (t) => t.name === `publicationTargets/${params.id}`,
       );
       const existing = publicationTargets[idx];
-      if (idx === -1 || !existing) return new HttpResponse(null, { status: 404 });
+      if (idx === -1 || !existing)
+        return new HttpResponse(null, { status: 404 });
       const updated: PublicationTarget = {
         ...existing,
         ...body,
@@ -52,4 +53,4 @@ export default [
       publicationTargets,
     });
   }),
-];
\ No newline at end of file
+];
diff --git a/src/tests/server/handlers/repositoryProfiles.ts b/src/tests/server/handlers/repositoryProfiles.ts
index 4625f7d63..635a3e28b 100644
--- a/src/tests/server/handlers/repositoryProfiles.ts
+++ b/src/tests/server/handlers/repositoryProfiles.ts
@@ -57,40 +57,49 @@ export default [
     return HttpResponse.json(repositoryProfiles[0], { status: 201 });
   }),
 
-  http.put(`${API_URL}repositoryprofiles/:name`, async ({ params, request }) => {
-    type PutBody = Omit<Partial<RepositoryProfile>, "apt_sources"> & {
-      add_apt_sources?: { name: string; line: string; gpg_key: { content: string } | null }[];
-      remove_apt_sources?: number[];
-    };
-    const body = (await request.json()) as PutBody;
-    const profile = repositoryProfiles.find((p) => p.name === params.name);
-    if (!profile) {
-      return new HttpResponse(null, { status: 404 });
-    }
+  http.put(
+    `${API_URL}repositoryprofiles/:name`,
+    async ({ params, request }) => {
+      type PutBody = Omit<Partial<RepositoryProfile>, "apt_sources"> & {
+        add_apt_sources?: {
+          name: string;
+          line: string;
+          gpg_key: { content: string } | null;
+        }[];
+        remove_apt_sources?: number[];
+      };
+      const body = (await request.json()) as PutBody;
+      const profile = repositoryProfiles.find((p) => p.name === params.name);
+      if (!profile) {
+        return new HttpResponse(null, { status: 404 });
+      }
 
-    const { add_apt_sources, remove_apt_sources, ...rest } = body;
+      const { add_apt_sources, remove_apt_sources, ...rest } = body;
 
-    let updatedSources: APTSource[] = profile.apt_sources ?? [];
-    if (remove_apt_sources?.length) {
-      updatedSources = updatedSources.filter((s) => !remove_apt_sources.includes(s.id));
-    }
-    if (add_apt_sources?.length) {
-      const maxId = Math.max(0, ...updatedSources.map((s) => s.id));
-      const newSources: APTSource[] = add_apt_sources.map((s, i) => ({
-        id: maxId + i + 1,
-        name: s.name,
-        line: s.line,
-        gpg_key: s.gpg_key ? s.gpg_key.content : null,
-        access_group: profile.access_group,
-        profiles: [profile.name],
-      }));
-      updatedSources = [...updatedSources, ...newSources];
-    }
+      let updatedSources: APTSource[] = profile.apt_sources ?? [];
+      if (remove_apt_sources?.length) {
+        updatedSources = updatedSources.filter(
+          (s) => !remove_apt_sources.includes(s.id),
+        );
+      }
+      if (add_apt_sources?.length) {
+        const maxId = Math.max(0, ...updatedSources.map((s) => s.id));
+        const newSources: APTSource[] = add_apt_sources.map((s, i) => ({
+          id: maxId + i + 1,
+          name: s.name,
+          line: s.line,
+          gpg_key: s.gpg_key ? s.gpg_key.content : null,
+          access_group: profile.access_group,
+          profiles: [profile.name],
+        }));
+        updatedSources = [...updatedSources, ...newSources];
+      }
 
-    Object.assign(profile, { ...rest, apt_sources: updatedSources });
+      Object.assign(profile, { ...rest, apt_sources: updatedSources });
 
-    return HttpResponse.json(profile, { status: 200 });
-  }),
+      return HttpResponse.json(profile, { status: 200 });
+    },
+  ),
 
   http.get(API_URL_OLD, ({ request }) => {
     if (!isAction(request, "RemoveRepositoryProfile")) {
@@ -100,7 +109,8 @@ export default [
     const endpointStatus = getEndpointStatus();
     if (
       endpointStatus.status === "error" &&
-      (!endpointStatus.path || endpointStatus.path === "RemoveRepositoryProfile")
+      (!endpointStatus.path ||
+        endpointStatus.path === "RemoveRepositoryProfile")
     ) {
       throw getEndpointStatusApiError();
     }
@@ -108,4 +118,3 @@ export default [
     return HttpResponse.json({ id: 1 }, { status: 200 });
   }),
 ];
-

From e02da13e9550a3adce4fa7b6e90308983d38179a Mon Sep 17 00:00:00 2001
From: Ethan Shaw <ethan.shaw@canonical.com>
Date: Tue, 28 Apr 2026 15:15:00 -0700
Subject: [PATCH 41/42] Replace component for mirror publications list (#573)

- Move `PublicationsTable` to `publications` feature and rename to
`AssociatedPublicationsList` to avoid ambiguity
- Use `AssociatedPubliationsList` for mirrors features

---------

Co-authored-by: Marc Bucchieri <marc.bucchieri@canonical.com>
---
 .../MirrorDetails/MirrorDetails.tsx           |  7 ++-
 .../MirrorPublicationsList.test.tsx           | 10 ---
 .../MirrorPublicationsList.tsx                | 63 -------------------
 .../MirrorPublicationsList/index.ts           |  1 -
 .../RemoveMirrorModal.test.tsx                |  4 +-
 .../RemoveMirrorModal/RemoveMirrorModal.tsx   |  8 ++-
 .../RemoveTargetForm/RemoveTargetModal.tsx    |  4 +-
 .../TargetDetails/TargetDetails.tsx           |  4 +-
 .../AssociatedPublicationsList.test.tsx}      | 57 ++++++++++++-----
 .../AssociatedPublicationsList.tsx}           | 15 +++--
 .../LocalLink/LocalLink.tsx                   |  0
 .../MirrorLink/MirrorLink.tsx                 |  0
 .../PublicationLink/PublicationLink.tsx       |  0
 .../AssociatedPublicationsList/index.ts       |  1 +
 src/features/publications/index.ts            |  1 +
 15 files changed, 68 insertions(+), 107 deletions(-)
 delete mode 100644 src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.test.tsx
 delete mode 100644 src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.tsx
 delete mode 100644 src/features/mirrors/components/MirrorPublicationsList/index.ts
 rename src/features/{publication-targets/components/PublicationsTable/PublicationsTable.test.tsx => publications/components/AssociatedPublicationsList/AssociatedPublicationsList.test.tsx} (80%)
 rename src/features/{publication-targets/components/PublicationsTable/PublicationsTable.tsx => publications/components/AssociatedPublicationsList/AssociatedPublicationsList.tsx} (89%)
 rename src/features/{publication-targets/components/PublicationsTable => publications/components/AssociatedPublicationsList}/LocalLink/LocalLink.tsx (100%)
 rename src/features/{publication-targets/components/PublicationsTable => publications/components/AssociatedPublicationsList}/MirrorLink/MirrorLink.tsx (100%)
 rename src/features/{publication-targets/components/PublicationsTable => publications/components/AssociatedPublicationsList}/PublicationLink/PublicationLink.tsx (100%)
 create mode 100644 src/features/publications/components/AssociatedPublicationsList/index.ts

diff --git a/src/features/mirrors/components/MirrorDetails/MirrorDetails.tsx b/src/features/mirrors/components/MirrorDetails/MirrorDetails.tsx
index da37b392c..4b0b486e5 100644
--- a/src/features/mirrors/components/MirrorDetails/MirrorDetails.tsx
+++ b/src/features/mirrors/components/MirrorDetails/MirrorDetails.tsx
@@ -9,11 +9,11 @@ import { getSourceType } from "./helpers";
 import MirrorPackagesCount from "../MirrorPackagesCount";
 import moment from "moment";
 import { DISPLAY_DATE_TIME_FORMAT } from "@/constants";
-import MirrorPublicationsList from "../MirrorPublicationsList";
 import UpdateMirrorModal from "../UpdateMirrorModal";
 import { useBoolean } from "usehooks-ts";
 import RemoveMirrorModal from "../RemoveMirrorModal";
 import { boolToLabel } from "@/utils/output";
+import { AssociatedPublicationsList } from "@/features/publications";
 
 const MirrorDetails: FC = () => {
   const { name, createSidePathPusher } = usePageParams();
@@ -145,7 +145,10 @@ const MirrorDetails: FC = () => {
             </InfoGrid>
           </Blocks.Item>
           <Blocks.Item title="Used in">
-            <MirrorPublicationsList publications={publications} />
+            <AssociatedPublicationsList
+              publications={publications}
+              showSources={false}
+            />
           </Blocks.Item>
         </Blocks>
       </SidePanel.Content>
diff --git a/src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.test.tsx b/src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.test.tsx
deleted file mode 100644
index 0378715d2..000000000
--- a/src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.test.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import { renderWithProviders } from "@/tests/render";
-import { describe } from "vitest";
-import MirrorPublicationsList from "./MirrorPublicationsList";
-import { publications } from "@/tests/mocks/publications";
-
-describe("MirrorPublicationsList", () => {
-  it("renders", () => {
-    renderWithProviders(<MirrorPublicationsList publications={publications} />);
-  });
-});
diff --git a/src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.tsx b/src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.tsx
deleted file mode 100644
index 94ca9fcb8..000000000
--- a/src/features/mirrors/components/MirrorPublicationsList/MirrorPublicationsList.tsx
+++ /dev/null
@@ -1,63 +0,0 @@
-import type { CellProps, Column } from "react-table";
-import { useMemo, type FC } from "react";
-import type { Publication } from "@canonical/landscape-openapi";
-import { ModularTable } from "@canonical/react-components";
-import { ModalTablePagination } from "@/components/layout/TablePagination";
-import { useCounter } from "usehooks-ts";
-import { DEFAULT_MODAL_PAGE_SIZE } from "@/constants";
-import { Link } from "react-router";
-
-interface MirrorPublicationsListProps {
-  readonly publications: Publication[];
-  readonly openInNewTab?: boolean;
-}
-
-const MirrorPublicationsList: FC<MirrorPublicationsListProps> = ({
-  publications,
-  openInNewTab = false,
-}) => {
-  const { count, increment, decrement } = useCounter(1);
-
-  const columns = useMemo<Column<Publication>[]>(
-    () => [
-      {
-        Header: "Publication",
-        Cell: ({ row: { original: publication } }: CellProps<Publication>) => {
-          return (
-            <Link
-              to={{
-                pathname: "/repositories/publications",
-                search: `?sidePath=view&name=${publication.publicationId}`,
-              }}
-              target={openInNewTab ? "_blank" : undefined}
-              rel={openInNewTab ? "noopener noreferrer" : undefined}
-            >
-              {publication.label}
-            </Link>
-          );
-        },
-      },
-    ],
-    [openInNewTab],
-  );
-
-  return (
-    <>
-      <ModularTable
-        columns={columns}
-        data={publications.slice(
-          (count - 1) * DEFAULT_MODAL_PAGE_SIZE,
-          count * DEFAULT_MODAL_PAGE_SIZE,
-        )}
-      />
-      <ModalTablePagination
-        current={count}
-        max={Math.ceil(publications.length / DEFAULT_MODAL_PAGE_SIZE)}
-        onNext={increment}
-        onPrev={decrement}
-      />
-    </>
-  );
-};
-
-export default MirrorPublicationsList;
diff --git a/src/features/mirrors/components/MirrorPublicationsList/index.ts b/src/features/mirrors/components/MirrorPublicationsList/index.ts
deleted file mode 100644
index 8bbed3a24..000000000
--- a/src/features/mirrors/components/MirrorPublicationsList/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./MirrorPublicationsList";
diff --git a/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.test.tsx b/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.test.tsx
index aad27ec71..491632274 100644
--- a/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.test.tsx
+++ b/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.test.tsx
@@ -52,8 +52,8 @@ describe("RemoveMirrorModal", () => {
   it("renders a list of publications", async () => {
     renderWithProviders(<RemoveMirrorModal {...props} />);
 
-    for (const { label } of publications) {
-      expect(screen.getByText(label)).toBeInTheDocument();
+    for (const { displayName } of publications) {
+      expect(screen.getByText(displayName)).toBeInTheDocument();
     }
   });
 
diff --git a/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.tsx b/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.tsx
index 14336b630..e5a2b6376 100644
--- a/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.tsx
+++ b/src/features/mirrors/components/RemoveMirrorModal/RemoveMirrorModal.tsx
@@ -3,9 +3,9 @@ import { Icon } from "@canonical/react-components";
 import type { FC } from "react";
 import { useDeleteMirror, useListPublications } from "../../api";
 import useNotify from "@/hooks/useNotify";
-import MirrorPublicationsList from "../MirrorPublicationsList";
 import usePageParams from "@/hooks/usePageParams";
 import TextConfirmationModal from "@/components/form/TextConfirmationModal";
+import { AssociatedPublicationsList } from "@/features/publications";
 
 interface RemoveMirrorModalProps {
   readonly close: () => void;
@@ -70,7 +70,11 @@ const RemoveMirrorModal: FC<RemoveMirrorModalProps> = ({
       {publications.length ? (
         <>
           <p>This mirror is associated with the following publications:</p>
-          <MirrorPublicationsList publications={publications} openInNewTab />
+          <AssociatedPublicationsList
+            publications={publications}
+            openInNewTab
+            showSources={false}
+          />
           <p>
             After removal you won’t be able to update any of these publications,
             but they will continue to be available.{" "}
diff --git a/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetModal.tsx b/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetModal.tsx
index 22411221f..43200b69b 100644
--- a/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetModal.tsx
+++ b/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetModal.tsx
@@ -7,7 +7,7 @@ import type { FC } from "react";
 import useGetPublicationsByTarget from "../../api/useGetPublicationsByTarget";
 import useRemovePublicationTarget from "../../api/useRemovePublicationTarget";
 import type { PublicationTarget } from "../../types";
-import PublicationsTable from "../PublicationsTable/PublicationsTable";
+import { AssociatedPublicationsList } from "@/features/publications";
 
 interface RemoveTargetModalProps extends Pick<
   TextConfirmationModalProps,
@@ -72,7 +72,7 @@ const RemoveTargetModal: FC<RemoveTargetModalProps> = ({
             This publication target is currently being used by the following
             publications:
           </p>
-          <PublicationsTable
+          <AssociatedPublicationsList
             publications={publications}
             pageSize={PAGE_SIZE}
             openInNewTab
diff --git a/src/features/publication-targets/components/TargetDetails/TargetDetails.tsx b/src/features/publication-targets/components/TargetDetails/TargetDetails.tsx
index b2affeb78..bf8686942 100644
--- a/src/features/publication-targets/components/TargetDetails/TargetDetails.tsx
+++ b/src/features/publication-targets/components/TargetDetails/TargetDetails.tsx
@@ -7,9 +7,9 @@ import type { FC } from "react";
 import { createPortal } from "react-dom";
 import { useBoolean } from "usehooks-ts";
 import type { PublicationTarget } from "../../types";
-import PublicationsTable from "../PublicationsTable/PublicationsTable";
 import RemoveTargetForm from "../RemoveTargetForm";
 import Blocks from "@/components/layout/Blocks/Blocks";
+import { AssociatedPublicationsList } from "@/features/publications";
 
 interface TargetDetailsProps {
   readonly target: PublicationTarget;
@@ -102,7 +102,7 @@ const TargetDetails: FC<TargetDetailsProps> = ({ target }) => {
 
         {!isGettingPublications && publications.length > 0 && (
           <Blocks.Item title="Used In">
-            <PublicationsTable publications={publications} />
+            <AssociatedPublicationsList publications={publications} />
           </Blocks.Item>
         )}
       </Blocks>
diff --git a/src/features/publication-targets/components/PublicationsTable/PublicationsTable.test.tsx b/src/features/publications/components/AssociatedPublicationsList/AssociatedPublicationsList.test.tsx
similarity index 80%
rename from src/features/publication-targets/components/PublicationsTable/PublicationsTable.test.tsx
rename to src/features/publications/components/AssociatedPublicationsList/AssociatedPublicationsList.test.tsx
index 752a92499..873b923b3 100644
--- a/src/features/publication-targets/components/PublicationsTable/PublicationsTable.test.tsx
+++ b/src/features/publications/components/AssociatedPublicationsList/AssociatedPublicationsList.test.tsx
@@ -2,23 +2,27 @@ import { publications } from "@/tests/mocks/publications";
 import { renderWithProviders } from "@/tests/render";
 import { screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-import type { Publication } from "../../types";
+import type { Publication } from "../../../publication-targets/types";
 import { describe, expect, it } from "vitest";
-import PublicationsTable from "./PublicationsTable";
+import AssociatedPublicationsList from "./AssociatedPublicationsList";
 
-describe("PublicationsTable", () => {
+describe("AssociatedPublicationsList", () => {
   const user = userEvent.setup();
 
   describe("table structure and columns", () => {
     it("renders table with correct column headers: Publication, Source, Distribution", () => {
-      renderWithProviders(<PublicationsTable publications={publications} />);
+      renderWithProviders(
+        <AssociatedPublicationsList publications={publications} />,
+      );
 
       expect(screen.getByText("Publication")).toBeInTheDocument();
       expect(screen.getByText("Source")).toBeInTheDocument();
     });
 
     it("renders all publications in rows with display_name", () => {
-      renderWithProviders(<PublicationsTable publications={publications} />);
+      renderWithProviders(
+        <AssociatedPublicationsList publications={publications} />,
+      );
 
       publications.forEach((pub) => {
         expect(screen.getByText(pub.source)).toBeInTheDocument();
@@ -28,7 +32,9 @@ describe("PublicationsTable", () => {
 
   describe("column data rendering", () => {
     it("renders label as a link in Publication column", () => {
-      renderWithProviders(<PublicationsTable publications={publications} />);
+      renderWithProviders(
+        <AssociatedPublicationsList publications={publications} />,
+      );
 
       publications.forEach((pub) => {
         const link = screen.getByRole("link", { name: pub.displayName });
@@ -37,7 +43,9 @@ describe("PublicationsTable", () => {
     });
 
     it("Publication column links point to publications page with correct params", () => {
-      renderWithProviders(<PublicationsTable publications={publications} />);
+      renderWithProviders(
+        <AssociatedPublicationsList publications={publications} />,
+      );
 
       publications.forEach((pub) => {
         const link = screen.getByRole("link", {
@@ -69,7 +77,7 @@ describe("PublicationsTable", () => {
       };
 
       renderWithProviders(
-        <PublicationsTable publications={[pubWithoutLabel]} />,
+        <AssociatedPublicationsList publications={[pubWithoutLabel]} />,
       );
 
       expect(
@@ -78,7 +86,9 @@ describe("PublicationsTable", () => {
     });
 
     it("renders mirror value in Source column when available", () => {
-      renderWithProviders(<PublicationsTable publications={publications} />);
+      renderWithProviders(
+        <AssociatedPublicationsList publications={publications} />,
+      );
 
       publications.forEach((pub) => {
         expect(screen.getByText(pub.source)).toBeInTheDocument();
@@ -91,7 +101,7 @@ describe("PublicationsTable", () => {
 
     it("does not render pagination when publications.length <= pageSize", () => {
       renderWithProviders(
-        <PublicationsTable
+        <AssociatedPublicationsList
           publications={publications.slice(0, pageSize)}
           pageSize={pageSize}
         />,
@@ -105,7 +115,10 @@ describe("PublicationsTable", () => {
 
     it("renders pagination component when publications.length > pageSize", () => {
       renderWithProviders(
-        <PublicationsTable publications={publications} pageSize={pageSize} />,
+        <AssociatedPublicationsList
+          publications={publications}
+          pageSize={pageSize}
+        />,
       );
 
       expect(screen.getByText(/page 1/i)).toBeInTheDocument();
@@ -113,7 +126,10 @@ describe("PublicationsTable", () => {
 
     it("shows only pageSize items on first page", () => {
       renderWithProviders(
-        <PublicationsTable publications={publications} pageSize={pageSize} />,
+        <AssociatedPublicationsList
+          publications={publications}
+          pageSize={pageSize}
+        />,
       );
 
       // Count visible publication names on first page (should be pageSize)
@@ -136,7 +152,10 @@ describe("PublicationsTable", () => {
 
     it("updates page content when pagination page changes", async () => {
       renderWithProviders(
-        <PublicationsTable publications={publications} pageSize={pageSize} />,
+        <AssociatedPublicationsList
+          publications={publications}
+          pageSize={pageSize}
+        />,
       );
 
       // First page should show first pageSize items
@@ -164,7 +183,7 @@ describe("PublicationsTable", () => {
 
   describe("edge cases", () => {
     it("renders without error with empty publications array", () => {
-      renderWithProviders(<PublicationsTable publications={[]} />);
+      renderWithProviders(<AssociatedPublicationsList publications={[]} />);
 
       // Table should render but with no data rows
       expect(screen.getByText("Publication")).toBeInTheDocument();
@@ -176,7 +195,9 @@ describe("PublicationsTable", () => {
         return;
       }
       const [firstPub] = singlePublication;
-      renderWithProviders(<PublicationsTable publications={[firstPub]} />);
+      renderWithProviders(
+        <AssociatedPublicationsList publications={[firstPub]} />,
+      );
 
       expect(screen.getByText(firstPub.source)).toBeInTheDocument();
     });
@@ -184,7 +205,9 @@ describe("PublicationsTable", () => {
 
   describe("props handling", () => {
     it("renders all publications without pageSize prop", () => {
-      renderWithProviders(<PublicationsTable publications={publications} />);
+      renderWithProviders(
+        <AssociatedPublicationsList publications={publications} />,
+      );
 
       publications.forEach((pub) => {
         expect(screen.getByText(pub.source)).toBeInTheDocument();
@@ -205,7 +228,7 @@ describe("PublicationsTable", () => {
         );
       }
       renderWithProviders(
-        <PublicationsTable
+        <AssociatedPublicationsList
           publications={publications}
           pageSize={customPageSize}
         />,
diff --git a/src/features/publication-targets/components/PublicationsTable/PublicationsTable.tsx b/src/features/publications/components/AssociatedPublicationsList/AssociatedPublicationsList.tsx
similarity index 89%
rename from src/features/publication-targets/components/PublicationsTable/PublicationsTable.tsx
rename to src/features/publications/components/AssociatedPublicationsList/AssociatedPublicationsList.tsx
index a843e8fa4..24f35c3fc 100644
--- a/src/features/publication-targets/components/PublicationsTable/PublicationsTable.tsx
+++ b/src/features/publications/components/AssociatedPublicationsList/AssociatedPublicationsList.tsx
@@ -12,14 +12,14 @@ import MirrorLink from "./MirrorLink/MirrorLink";
 import LocalLink from "./LocalLink/LocalLink";
 import { getSourceType } from "@/features/publications";
 
-interface PublicationsTableProps {
+interface AssociatedPublicationsListProps {
   readonly publications: Publication[];
   readonly pageSize?: number;
   readonly openInNewTab?: boolean;
   readonly showSources?: boolean;
 }
 
-const PublicationsTable: FC<PublicationsTableProps> = ({
+const AssociatedPublicationsList: FC<AssociatedPublicationsListProps> = ({
   publications,
   pageSize = 10,
   openInNewTab = false,
@@ -27,7 +27,6 @@ const PublicationsTable: FC<PublicationsTableProps> = ({
 }) => {
   const [currentPage, setCurrentPage] = useState(1);
 
-  // TODO: replace label with displayName once it's available in the API, link mirror to /mirrors with sidebar open
   const columns = useMemo<Column<Publication>[]>(
     () => [
       {
@@ -104,11 +103,15 @@ const PublicationsTable: FC<PublicationsTableProps> = ({
       <ModalTablePagination
         current={currentPage}
         max={maxPage}
-        onPrev={() => setCurrentPage((p) => Math.max(1, p - 1))}
-        onNext={() => setCurrentPage((p) => Math.min(maxPage, p + 1))}
+        onPrev={() => {
+          setCurrentPage((p) => Math.max(1, p - 1));
+        }}
+        onNext={() => {
+          setCurrentPage((p) => Math.min(maxPage, p + 1));
+        }}
       />
     </>
   );
 };
 
-export default PublicationsTable;
+export default AssociatedPublicationsList;
diff --git a/src/features/publication-targets/components/PublicationsTable/LocalLink/LocalLink.tsx b/src/features/publications/components/AssociatedPublicationsList/LocalLink/LocalLink.tsx
similarity index 100%
rename from src/features/publication-targets/components/PublicationsTable/LocalLink/LocalLink.tsx
rename to src/features/publications/components/AssociatedPublicationsList/LocalLink/LocalLink.tsx
diff --git a/src/features/publication-targets/components/PublicationsTable/MirrorLink/MirrorLink.tsx b/src/features/publications/components/AssociatedPublicationsList/MirrorLink/MirrorLink.tsx
similarity index 100%
rename from src/features/publication-targets/components/PublicationsTable/MirrorLink/MirrorLink.tsx
rename to src/features/publications/components/AssociatedPublicationsList/MirrorLink/MirrorLink.tsx
diff --git a/src/features/publication-targets/components/PublicationsTable/PublicationLink/PublicationLink.tsx b/src/features/publications/components/AssociatedPublicationsList/PublicationLink/PublicationLink.tsx
similarity index 100%
rename from src/features/publication-targets/components/PublicationsTable/PublicationLink/PublicationLink.tsx
rename to src/features/publications/components/AssociatedPublicationsList/PublicationLink/PublicationLink.tsx
diff --git a/src/features/publications/components/AssociatedPublicationsList/index.ts b/src/features/publications/components/AssociatedPublicationsList/index.ts
new file mode 100644
index 000000000..ffa461943
--- /dev/null
+++ b/src/features/publications/components/AssociatedPublicationsList/index.ts
@@ -0,0 +1 @@
+export { default } from "./AssociatedPublicationsList";
diff --git a/src/features/publications/index.ts b/src/features/publications/index.ts
index 1479393cc..4abdf63e2 100644
--- a/src/features/publications/index.ts
+++ b/src/features/publications/index.ts
@@ -6,3 +6,4 @@ export { default as PublicationDetails } from "./components/PublicationDetails";
 export { default as PublicationDetailsSidePanel } from "./components/PublicationDetailsSidePanel";
 export type { Publication, PublicationTarget, Local, Mirror } from "./types";
 export { getSourceName, getSourceType } from "./helpers";
+export { default as AssociatedPublicationsList } from "./components/AssociatedPublicationsList";

From 6b6a4c2e7093f401c26bf44a5d6d9cf22d8c9e92 Mon Sep 17 00:00:00 2001
From: Marc Bucchieri <marc.bucchieri@canonical.com>
Date: Wed, 29 Apr 2026 06:54:45 -0700
Subject: [PATCH 42/42] feat: publication target types (#571)

## Summary

Add swift and filesystem publication target types and test coverage

## Release Impact

According to the [Landscape Server Release
Cycle](https://docs.google.com/document/d/1sKAp5IvArpfArhMNojFwKOHm9LEdHKB4Et6tu1_-0GY/edit?tab=t.0),
this change will target the following release cycle:
- **Target Branch**: `dev` / `main` (Beta)
- **Version Impact**:
  - [ ] Patch (Fix)
  - [X] Minor (Feature)
  - [ ] Major (Breaking)

## Checklist
- [X] **Changeset Added**: I have run `pnpm changeset` and committed the
resulting `.md` file.
- [X] **UI Verified**: I have verified the changes locally.
- [X] **Linting**: No linting errors are present (especially in
`scripts/`).

## Versioning Reminder
> [!IMPORTANT]
> This repository now uses **CalVer** ($YY.0M.Point.Patch$).
> Please ensure your changeset description is clear, as it will be
automatically added to the `CHANGELOG.md` upon merging to `main`.

---------

Co-authored-by: Copilot <copilot@github.com>
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
---
 .changeset/upset-poems-follow.md              |   5 +
 feature-plans/new-target-types.md             | 298 +++++++++++
 .../LocalRepositoriesList.tsx                 |   6 +-
 .../LocalRepositoryPackagesCount.tsx          |   2 +-
 .../api/useCreatePublicationTarget.ts         |   2 +
 .../api/useEditPublicationTarget.ts           |   2 +
 .../AddPublicationTargetForm.test.tsx         | 364 ++++++++++++--
 .../AddPublicationTargetForm.tsx              | 235 +++++----
 .../AddPublicationTargetForm/constants.ts     |  48 +-
 .../EditTargetForm/EditTargetForm.test.tsx    | 414 ++++++++++++----
 .../EditTargetForm/EditTargetForm.tsx         | 469 ++++++++++++------
 .../PublicationTargetContainer.test.tsx       |  24 +-
 .../PublicationTargetList.test.tsx            |  12 +-
 .../PublicationTargetList.tsx                 |   1 +
 .../RemoveTargetForm.test.tsx                 |   7 +-
 .../TargetDetails/TargetDetails.test.tsx      |  71 ++-
 .../TargetDetails/TargetDetails.tsx           |  56 ++-
 .../TargetTypeFields/FilesystemFields.tsx     |  32 ++
 .../components/TargetTypeFields/S3Fields.tsx  |  95 ++++
 .../TargetTypeFields/SwiftFields.tsx          |  87 ++++
 .../TargetTypeFields.module.scss              |   5 +
 .../components/TargetTypeFields/index.ts      |   3 +
 src/features/publication-targets/constants.ts |  79 +++
 src/features/publication-targets/index.ts     |   2 +
 .../AssociatedPublicationsList.test.tsx       | 106 +++-
 src/tests/mocks/publicationTargets.ts         |   9 +
 .../server/handlers/publicationTargets.ts     |   1 +
 27 files changed, 1989 insertions(+), 446 deletions(-)
 create mode 100644 .changeset/upset-poems-follow.md
 create mode 100644 feature-plans/new-target-types.md
 create mode 100644 src/features/publication-targets/components/TargetTypeFields/FilesystemFields.tsx
 create mode 100644 src/features/publication-targets/components/TargetTypeFields/S3Fields.tsx
 create mode 100644 src/features/publication-targets/components/TargetTypeFields/SwiftFields.tsx
 create mode 100644 src/features/publication-targets/components/TargetTypeFields/TargetTypeFields.module.scss
 create mode 100644 src/features/publication-targets/components/TargetTypeFields/index.ts
 create mode 100644 src/features/publication-targets/constants.ts

diff --git a/.changeset/upset-poems-follow.md b/.changeset/upset-poems-follow.md
new file mode 100644
index 000000000..60aff6b5b
--- /dev/null
+++ b/.changeset/upset-poems-follow.md
@@ -0,0 +1,5 @@
+---
+"landscape-ui": minor
+---
+
+Added swift and filesystem publication target types
diff --git a/feature-plans/new-target-types.md b/feature-plans/new-target-types.md
new file mode 100644
index 000000000..747cf7bc4
--- /dev/null
+++ b/feature-plans/new-target-types.md
@@ -0,0 +1,298 @@
+# Feature Plan: new-target-types
+
+## 1. Feature Overview
+
+- **Objective:** Extend the publication targets UI to support Swift (OpenStack) and Filesystem target types alongside the existing S3 type. Users will select a target type in the Add form, see type-specific fields indented below the selector, and the Edit/Details views will render the appropriate fields for each type.
+- **Location:** `src/features/publication-targets/`
+
+---
+
+## 2. API Design
+
+All endpoints are already defined in the proto and reflected in `@canonical/landscape-openapi`. No new hooks are needed — only type extensions.
+
+### Endpoints (no change)
+
+| Method | URL | Usage |
+|--------|-----|-------|
+| `POST` | `/v1/publicationTargets` | Create any target type |
+| `PATCH` | `/v1/publicationTargets/:id` | Edit any target type |
+| `GET` | `/v1/publicationTargets` | List all targets |
+| `DELETE` | `/v1/publicationTargets/:id` | Remove a target |
+
+### Hook Signature Changes
+
+#### `useCreatePublicationTarget` (`src/features/publication-targets/api/useCreatePublicationTarget.ts`)
+
+Extend `CreatePublicationTargetParams` to include `filesystem`:
+
+```typescript
+import type { FilesystemTarget } from "@canonical/landscape-openapi";
+
+interface CreatePublicationTargetParams {
+  displayName: string;
+  s3?: Partial<S3Target>;
+  swift?: Partial<SwiftTarget>;
+  filesystem?: Partial<FilesystemTarget>;
+}
+```
+
+#### `useEditPublicationTarget` (`src/features/publication-targets/api/useEditPublicationTarget.ts`)
+
+Extend `EditPublicationTargetParams` identically:
+
+```typescript
+interface EditPublicationTargetParams {
+  name?: string;
+  displayName: string;
+  s3?: Partial<S3Target>;
+  swift?: Partial<SwiftTarget>;
+  filesystem?: Partial<FilesystemTarget>;
+}
+```
+
+### Type Definitions to Add
+
+Create `src/features/publication-targets/types/index.ts` additions (or update the existing re-export in `index.ts`):
+
+```typescript
+// Add to the re-export block in src/features/publication-targets/index.ts
+export type { FilesystemTarget, FilesystemTargetLinkMethod } from "@canonical/landscape-openapi";
+export { FilesystemTargetLinkMethod } from "@canonical/landscape-openapi";
+```
+
+---
+
+## 3. Component Hierarchy
+
+### New shared sub-components
+
+Extract type-specific field groups into a shared folder, reused by both the Add and Edit forms:
+
+```
+src/features/publication-targets/components/TargetTypeFields/
+  S3Fields.tsx             # All S3 inputs (required + optional, no type logic)
+  SwiftFields.tsx          # All Swift inputs (required + optional)
+  FilesystemFields.tsx     # Path input + LinkMethod select
+  index.ts
+```
+
+Each `*Fields` component receives the Formik `form` instance (typed appropriately) and renders inputs inside a styled indent wrapper (see §4).
+
+### Modified components
+
+#### `AddPublicationTargetForm/AddPublicationTargetForm.tsx`
+
+- Add a `Select` for `targetType` at the top of the form (values: `"s3" | "swift" | "filesystem"`)
+- Render the matching `*Fields` sub-component conditionally below the selector
+- Reset type-specific fields when `targetType` changes (use `formik.setValues`)
+- Only the active type's fields are submitted (other type objects omitted from payload)
+
+#### `EditTargetForm/EditTargetForm.tsx`
+
+- Detect the active type by checking `target.s3 ?? target.swift ?? target.filesystem`
+- Display the type as a `ReadOnlyField` (type cannot change on edit)
+- Render the matching `*Fields` sub-component pre-populated with existing values
+- **INPUT_ONLY fields** (`awsAccessKeyId`, `awsSecretAccessKey` for S3; `username`, `password` for Swift): include in the form but **do not pre-populate** — leave blank so the user must re-enter credentials explicitly. Add helper text (e.g. "Leave blank to keep current value") via the `Input` `help` prop. On submit, omit blank INPUT_ONLY credential fields from the PATCH payload so existing stored values are preserved unless the user enters replacements.
+
+#### `TargetDetails/TargetDetails.tsx`
+
+- Add `swiftFields` and `filesystemFields` blocks analogous to `s3Fields`
+- Render the relevant block inside the existing `InfoGrid`
+
+### Unchanged components
+
+- `PublicationTargetContainer`, `PublicationTargetAddButton`, `PublicationTargetList`, `PublicationsTable`, `RemoveTargetForm` — no changes required
+
+---
+
+## 4. State & Logic
+
+### `AddPublicationTargetForm/constants.ts`
+
+#### `TargetType` union (new)
+
+```typescript
+export type TargetType = "s3" | "swift" | "filesystem";
+```
+
+#### Expanded `AddPublicationTargetFormValues`
+
+```typescript
+export interface AddPublicationTargetFormValues {
+  // Common
+  displayName: string;
+  targetType: TargetType;
+
+  // S3
+  region: string;
+  bucket: string;
+  endpoint: string;
+  awsAccessKeyId: string;
+  awsSecretAccessKey: string;
+  prefix: string;
+  acl: string;
+  storageClass: string;
+  encryptionMethod: string;
+  plusWorkaround: boolean;
+  disableMultiDel: boolean;
+  forceSigV2: boolean;
+
+  // Swift
+  container: string;
+  swiftUsername: string;
+  swiftPassword: string;
+  swiftPrefix: string;
+  authUrl: string;
+  tenant: string;
+  tenantId: string;
+  domain: string;
+  domainId: string;
+  tenantDomain: string;
+  tenantDomainId: string;
+
+  // Filesystem
+  path: string;
+  linkMethod: FilesystemTargetLinkMethod | "";
+}
+```
+
+> Note: Swift credential fields use `swiftUsername`/`swiftPassword` to avoid collision with any future shared field; map to `username`/`password` in the submit payload.
+
+#### Updated `INITIAL_VALUES`
+
+All string fields default to `""`, all booleans to `false`, `targetType` defaults to `"s3"`, `linkMethod` defaults to `""` (rendered as unset in the select).
+
+#### Validation schema — type-conditional rules
+
+Use `Yup.object().shape` with `when` conditions:
+
+```typescript
+// Sketch only — no executable code
+displayName: Yup.string().required("This field is required"),
+targetType: Yup.string().oneOf(["s3", "swift", "filesystem"]).required(),
+
+// S3 required fields: region, bucket, awsAccessKeyId, awsSecretAccessKey
+//   each uses .when("targetType", { is: "s3", then: (s) => s.required(...) })
+
+// Swift required fields: container, swiftUsername, swiftPassword, authUrl
+//   each uses .when("targetType", { is: "swift", then: (s) => s.required(...) })
+
+// Filesystem required fields: path
+//   uses .when("targetType", { is: "filesystem", then: (s) => s.required(...) })
+```
+
+### Indent wrapper
+
+Vanilla Framework does not have a built-in left-border indent component. Use a minimal SCSS module:
+
+```
+src/features/publication-targets/components/TargetTypeFields/TargetTypeFields.module.scss
+```
+
+```scss
+// Suggested rule only
+.typeFieldsIndent {
+  border-left: 3px solid var(--vf-color-border-default, #cdcdcd);
+  padding-left: 1rem;
+  margin-top: 0.5rem;
+}
+```
+
+Apply as `<div className={styles.typeFieldsIndent}>` wrapping each `*Fields` component inside the form.
+
+### Global Context
+
+No new context needed.
+
+---
+
+## 5. Testing Plan
+
+### MSW Handler updates (`src/tests/server/handlers/publicationTargets.ts`)
+
+- **PATCH handler**: extend the merge logic to include `filesystem`:
+  ```typescript
+  ...(body.filesystem ? { filesystem: { ...existing.filesystem, ...body.filesystem } } : {}),
+  ```
+- No other handler changes needed — the POST handler already spreads `body` generically.
+
+### Mock data (`src/tests/mocks/publicationTargets.ts`)
+
+Add a Filesystem mock entry:
+
+```typescript
+{
+  name: "publicationTargets/dddddddd-0000-0000-0000-000000000004",
+  publicationTargetId: "dddddddd-0000-0000-0000-000000000004",
+  displayName: "local-fs-archive",
+  filesystem: {
+    path: "/srv/landscape/archives",
+    linkMethod: "HARDLINK",
+  },
+}
+```
+
+The existing Swift mock (`cccccccc...`) already covers the Swift type.
+
+### Unit/integration tests
+
+#### `AddPublicationTargetForm.test.tsx`
+
+Key scenarios to cover:
+
+- Renders a type selector with options "S3", "Swift", "Filesystem"
+- Default selection is S3; S3 fields are visible
+- Switching to Swift: S3 fields disappear, Swift fields appear (container, username, password, authUrl visible)
+- Switching to Filesystem: Swift fields disappear, path and linkMethod fields appear
+- S3 required-field validation fires only when `targetType === "s3"`
+- Swift required-field validation fires only when `targetType === "swift"`
+- Filesystem required-field validation fires only when `targetType === "filesystem"`
+- Successful S3 submit calls `mutateAsync` with correct `s3` payload and no `swift`/`filesystem` keys
+- Successful Swift submit calls `mutateAsync` with correct `swift` payload
+- Successful Filesystem submit calls `mutateAsync` with correct `filesystem` payload (including `linkMethod`)
+
+#### `EditTargetForm.test.tsx`
+
+Key additions (existing S3 tests remain unchanged):
+
+- Swift target: type field rendered as read-only "Swift"
+- Swift target: container, authUrl pre-populated; username/password fields present but empty
+- Filesystem target: type field rendered as read-only "Filesystem"; path pre-populated
+- Filesystem target: linkMethod select pre-populated from mock
+
+#### `TargetDetails.test.tsx`
+
+- Swift target: "Container", "Auth URL", "Tenant" info grid items present
+- Filesystem target: "Path", "Link Method" info grid items present
+
+---
+
+## 6. File Change Summary
+
+| File | Action |
+|------|--------|
+| `src/features/publication-targets/api/useCreatePublicationTarget.ts` | Add `filesystem` to params interface |
+| `src/features/publication-targets/api/useEditPublicationTarget.ts` | Add `filesystem` to params interface |
+| `src/features/publication-targets/index.ts` | Re-export `FilesystemTarget`, `FilesystemTargetLinkMethod` |
+| `src/features/publication-targets/components/AddPublicationTargetForm/constants.ts` | Expand `AddPublicationTargetFormValues` + `INITIAL_VALUES`; add `TargetType` |
+| `src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.tsx` | Add type selector + conditional field sections |
+| `src/features/publication-targets/components/EditTargetForm/EditTargetForm.tsx` | Detect type, render per-type fields section |
+| `src/features/publication-targets/components/TargetDetails/TargetDetails.tsx` | Add Swift and Filesystem info blocks |
+| `src/features/publication-targets/components/TargetTypeFields/S3Fields.tsx` | **New** — extracted S3 field group |
+| `src/features/publication-targets/components/TargetTypeFields/SwiftFields.tsx` | **New** — Swift field group |
+| `src/features/publication-targets/components/TargetTypeFields/FilesystemFields.tsx` | **New** — Filesystem field group |
+| `src/features/publication-targets/components/TargetTypeFields/TargetTypeFields.module.scss` | **New** — indent border style |
+| `src/features/publication-targets/components/TargetTypeFields/index.ts` | **New** — barrel export |
+| `src/tests/mocks/publicationTargets.ts` | Add Filesystem mock entry |
+| `src/tests/server/handlers/publicationTargets.ts` | Extend PATCH merge for `filesystem` |
+
+---
+
+## 7. Open Questions / Deferred Items
+
+1. **INPUT_ONLY on Edit (credentials):** `awsSecretAccessKey`, `awsAccessKeyId` (S3) and `username`, `password` (Swift) are `INPUT_ONLY` — the server never returns them. The edit form should therefore show these fields blank with helper text such as "Enter a new value to update", and blank values are already omitted from the PATCH payload so the server keeps the existing secret. The remaining open question is backend PATCH semantics for any future explicit "clear/reset secret" behavior, since omission currently means "leave unchanged".
+
+2. **`plusWorkaround` and `debug` (S3):** These S3 boolean fields exist in the proto but are absent from the current Add form. They can be added alongside the other optional booleans with no architectural impact — include or defer per team preference.
+
+3. **Type switching on Edit:** The current plan renders type as `ReadOnlyField`. If the team later wants to allow changing target type on edit, that would require a re-design of the Edit form and is out of scope here.
diff --git a/src/features/local-repositories/components/LocalRepositoriesList/LocalRepositoriesList.tsx b/src/features/local-repositories/components/LocalRepositoriesList/LocalRepositoriesList.tsx
index 875f2e1ea..d77dad733 100644
--- a/src/features/local-repositories/components/LocalRepositoriesList/LocalRepositoriesList.tsx
+++ b/src/features/local-repositories/components/LocalRepositoriesList/LocalRepositoriesList.tsx
@@ -4,7 +4,7 @@ import ResponsiveTable from "@/components/layout/ResponsiveTable";
 import { Button } from "@canonical/react-components";
 import { useMemo, type FC } from "react";
 import type { Column, CellProps } from "react-table";
-import type { Local } from "../../types";
+import type { Local } from "@canonical/landscape-openapi";
 import usePageParams from "@/hooks/usePageParams";
 import { TablePagination } from "@/components/layout/TablePagination";
 import LocalRepositoriesListActions from "./components/LocalRepositoriesListActions";
@@ -43,10 +43,10 @@ const LocalRepositoriesList: FC<LocalRepositoriesListProps> = ({
             className="u-no-margin--bottom u-no-padding--top u-align-text--left"
             onClick={createPageParamsSetter({
               sidePath: ["view"],
-              name: repository.local_id,
+              name: repository.localId,
             })}
           >
-            {repository.display_name}
+            {repository.displayName}
           </Button>
         ),
       },
diff --git a/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPackagesCount/LocalRepositoryPackagesCount.tsx b/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPackagesCount/LocalRepositoryPackagesCount.tsx
index 908db65ac..a258639de 100644
--- a/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPackagesCount/LocalRepositoryPackagesCount.tsx
+++ b/src/features/local-repositories/components/LocalRepositoriesList/components/LocalRepositoryPackagesCount/LocalRepositoryPackagesCount.tsx
@@ -1,6 +1,6 @@
 import LoadingState from "@/components/layout/LoadingState";
 import type { FC } from "react";
-import type { Local } from "../../../../types";
+import type { Local } from "@canonical/landscape-openapi";
 import { useGetRepositoryPackages } from "../../../../api";
 import { pluralizeWithCount } from "@/utils/_helpers";
 
diff --git a/src/features/publication-targets/api/useCreatePublicationTarget.ts b/src/features/publication-targets/api/useCreatePublicationTarget.ts
index 1d1a09c0c..5cbaf1f67 100644
--- a/src/features/publication-targets/api/useCreatePublicationTarget.ts
+++ b/src/features/publication-targets/api/useCreatePublicationTarget.ts
@@ -3,6 +3,7 @@ import type { ApiError } from "@/types/api/ApiError";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import type { AxiosError, AxiosResponse } from "axios";
 import type {
+  FilesystemTarget,
   PublicationTarget,
   S3Target,
   SwiftTarget,
@@ -12,6 +13,7 @@ interface CreatePublicationTargetParams {
   displayName: string;
   s3?: Partial<S3Target>;
   swift?: Partial<SwiftTarget>;
+  filesystem?: Partial<FilesystemTarget>;
 }
 
 export default function useCreatePublicationTarget() {
diff --git a/src/features/publication-targets/api/useEditPublicationTarget.ts b/src/features/publication-targets/api/useEditPublicationTarget.ts
index dcff05df4..a14847cf1 100644
--- a/src/features/publication-targets/api/useEditPublicationTarget.ts
+++ b/src/features/publication-targets/api/useEditPublicationTarget.ts
@@ -3,6 +3,7 @@ import type { ApiError } from "@/types/api/ApiError";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 import type { AxiosError, AxiosResponse } from "axios";
 import type {
+  FilesystemTarget,
   PublicationTarget,
   S3Target,
   SwiftTarget,
@@ -13,6 +14,7 @@ interface EditPublicationTargetParams {
   displayName: string;
   s3?: Partial<S3Target>;
   swift?: Partial<SwiftTarget>;
+  filesystem?: Partial<FilesystemTarget>;
 }
 
 export default function useEditPublicationTarget() {
diff --git a/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.test.tsx b/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.test.tsx
index cbb8ae13b..79830c0b0 100644
--- a/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.test.tsx
+++ b/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.test.tsx
@@ -1,30 +1,60 @@
+import { API_URL_DEB_ARCHIVE } from "@/constants";
+import server from "@/tests/server";
 import { renderWithProviders } from "@/tests/render";
 import { screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
+import { http, HttpResponse } from "msw";
 import { describe, expect, it, vi } from "vitest";
 import AddPublicationTargetForm from "./AddPublicationTargetForm";
 
-// TODO: Add tests for Swift target type when Swift form support is implemented.
-
 describe("AddPublicationTargetForm", () => {
   const user = userEvent.setup();
 
-  it("renders all required S3 fields", () => {
+  it("renders the type selector with S3, Swift and Filesystem options", () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    const select = screen.getByLabelText(/^type$/i);
+    expect(select).toBeInTheDocument();
+    expect(screen.getByRole("option", { name: "S3" })).toBeInTheDocument();
+    expect(screen.getByRole("option", { name: "Swift" })).toBeInTheDocument();
+    expect(
+      screen.getByRole("option", { name: "Filesystem" }),
+    ).toBeInTheDocument();
+  });
+
+  it("shows S3 fields by default", () => {
     renderWithProviders(<AddPublicationTargetForm />);
 
-    expect(screen.getByLabelText("Name")).toBeInTheDocument();
     expect(screen.getByLabelText(/region/i)).toBeInTheDocument();
     expect(screen.getByLabelText(/bucket name/i)).toBeInTheDocument();
     expect(screen.getByLabelText(/aws access key id/i)).toBeInTheDocument();
     expect(screen.getByLabelText(/aws secret access key/i)).toBeInTheDocument();
+    expect(screen.queryByLabelText(/container/i)).not.toBeInTheDocument();
+    expect(screen.queryByLabelText(/^path$/i)).not.toBeInTheDocument();
   });
 
-  it("renders optional S3 fields", () => {
+  it("switches to Swift fields when Swift type is selected", async () => {
     renderWithProviders(<AddPublicationTargetForm />);
 
-    expect(screen.getByLabelText(/endpoint/i)).toBeInTheDocument();
-    expect(screen.getByLabelText(/prefix/i)).toBeInTheDocument();
-    expect(screen.getByLabelText(/acl/i)).toBeInTheDocument();
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "swift");
+
+    expect(screen.getByLabelText(/container/i)).toBeInTheDocument();
+    expect(screen.getByLabelText(/^username$/i)).toBeInTheDocument();
+    expect(screen.getByLabelText(/^password$/i)).toBeInTheDocument();
+    expect(screen.getByLabelText(/auth url/i)).toBeInTheDocument();
+    expect(screen.queryByLabelText(/region/i)).not.toBeInTheDocument();
+    expect(screen.queryByLabelText(/^path$/i)).not.toBeInTheDocument();
+  });
+
+  it("switches to Filesystem fields when Filesystem type is selected", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "filesystem");
+
+    expect(screen.getByLabelText(/^path$/i)).toBeInTheDocument();
+    expect(screen.getByLabelText(/link method/i)).toBeInTheDocument();
+    expect(screen.queryByLabelText(/region/i)).not.toBeInTheDocument();
+    expect(screen.queryByLabelText(/container/i)).not.toBeInTheDocument();
   });
 
   it("renders the submit button", () => {
@@ -35,9 +65,35 @@ describe("AddPublicationTargetForm", () => {
     ).toBeInTheDocument();
   });
 
-  it("shows validation errors when required fields are empty on submit", async () => {
+  it("shows S3 validation errors when required fields are empty on submit", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.click(
+      screen.getByRole("button", { name: /add publication target/i }),
+    );
+
+    expect(
+      await screen.findAllByText(/this field is required/i),
+    ).not.toHaveLength(0);
+  });
+
+  it("shows Swift validation errors when required Swift fields are empty", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "swift");
+    await user.click(
+      screen.getByRole("button", { name: /add publication target/i }),
+    );
+
+    expect(
+      await screen.findAllByText(/this field is required/i),
+    ).not.toHaveLength(0);
+  });
+
+  it("shows Filesystem validation error when path is empty", async () => {
     renderWithProviders(<AddPublicationTargetForm />);
 
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "filesystem");
     await user.click(
       screen.getByRole("button", { name: /add publication target/i }),
     );
@@ -47,10 +103,11 @@ describe("AddPublicationTargetForm", () => {
     ).not.toHaveLength(0);
   });
 
-  it("submits the form and shows success notification", async () => {
+  it("submits S3 form and shows success notification", async () => {
     renderWithProviders(<AddPublicationTargetForm />);
 
-    await user.type(screen.getByLabelText("Name"), "My New Target");
+    await user.type(screen.getByLabelText("Name"), "My S3 Target");
+    await user.type(screen.getByLabelText(/region/i), "us-east-1");
     await user.type(screen.getByLabelText(/bucket name/i), "my-bucket");
     await user.type(
       screen.getByLabelText(/aws access key id/i),
@@ -72,41 +129,51 @@ describe("AddPublicationTargetForm", () => {
     });
   });
 
-  it("includes optional fields in submission when all fields are provided", async () => {
+  it("submits Swift form and shows success notification", async () => {
     renderWithProviders(<AddPublicationTargetForm />);
 
-    await user.type(screen.getByLabelText("Name"), "Full Target");
-    await user.type(screen.getByLabelText(/region/i), "us-east-1");
-    await user.type(screen.getByLabelText(/bucket name/i), "my-bucket");
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "swift");
+    await user.type(screen.getByLabelText("Name"), "My Swift Target");
+    await user.type(screen.getByLabelText(/container/i), "my-container");
+    await user.type(screen.getByLabelText(/^username$/i), "admin");
     await user.type(
-      screen.getByLabelText(/endpoint/i),
-      "https://s3.example.com",
+      screen.getByLabelText(/^password$/i),
+      "secret",
     );
     await user.type(
-      screen.getByLabelText(/aws access key id/i),
-      "AKIAIOSFODNN7EXAMPLE",
+      screen.getByLabelText(/auth url/i),
+      "https://keystone.example.com/v3",
     );
+
+    await user.click(
+      screen.getByRole("button", { name: /add publication target/i }),
+    );
+
+    await vi.waitFor(() => {
+      expect(screen.getByText("Publication target created")).toBeInTheDocument();
+    });
+  });
+
+  it("submits Filesystem form and shows success notification", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "filesystem");
+    await user.type(screen.getByLabelText("Name"), "My Filesystem Target");
     await user.type(
-      screen.getByLabelText(/aws secret access key/i),
-      "wJalrXUtnFEMI/K7MDENG/bPxRfiCYEXAMPLEKEY",
+      screen.getByLabelText(/^path$/i),
+      "/srv/landscape/archives",
     );
-    await user.type(screen.getByLabelText(/prefix/i), "ubuntu/");
-    await user.type(screen.getByLabelText(/^acl$/i), "private");
-    await user.type(screen.getByLabelText(/storage class/i), "STANDARD");
-    await user.type(screen.getByLabelText(/encryption method/i), "AES256");
 
     await user.click(
       screen.getByRole("button", { name: /add publication target/i }),
     );
 
     await vi.waitFor(() => {
-      expect(
-        screen.getByText("Publication target created"),
-      ).toBeInTheDocument();
+      expect(screen.getByText("Publication target created")).toBeInTheDocument();
     });
   });
 
-  it("toggles the disable_multi_del checkbox", async () => {
+  it("toggles the disable MultiDel checkbox on S3 form", async () => {
     renderWithProviders(<AddPublicationTargetForm />);
 
     const checkbox = screen.getByRole("checkbox", {
@@ -121,7 +188,122 @@ describe("AddPublicationTargetForm", () => {
     expect(checkbox).not.toBeChecked();
   });
 
-  it("toggles the force_sig_v2 checkbox", async () => {
+  it("resets type-specific fields when switching type", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.type(screen.getByLabelText(/region/i), "us-east-1");
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "swift");
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "s3");
+
+    expect(screen.getByLabelText(/region/i)).toHaveValue("");
+  });
+
+  it("clears Swift fields when switching from Swift to S3", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "swift");
+    await user.type(screen.getByLabelText(/container/i), "my-container");
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "s3");
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "swift");
+
+    expect(screen.getByLabelText(/container/i)).toHaveValue("");
+  });
+
+  it("clears Filesystem path when switching from Filesystem to Swift", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "filesystem");
+    await user.type(screen.getByLabelText(/^path$/i), "/some/path");
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "swift");
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "filesystem");
+
+    expect(screen.getByLabelText(/^path$/i)).toHaveValue("");
+  });
+
+  it("shows 'Path must start with /' error when path lacks a leading slash", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "filesystem");
+    await user.type(screen.getByLabelText(/^path$/i), "no-leading-slash");
+    await user.click(
+      screen.getByRole("button", { name: /add publication target/i }),
+    );
+
+    expect(
+      await screen.findByText(/path must start with \//i),
+    ).toBeInTheDocument();
+  });
+
+  it("clears path error once a valid path with a leading slash is entered", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "filesystem");
+    await user.type(screen.getByLabelText(/^path$/i), "no-leading-slash");
+    await user.click(
+      screen.getByRole("button", { name: /add publication target/i }),
+    );
+    await screen.findByText(/path must start with \//i);
+
+    await user.clear(screen.getByLabelText(/^path$/i));
+    await user.type(screen.getByLabelText(/^path$/i), "/valid/path");
+
+    expect(
+      screen.queryByText(/path must start with \//i),
+    ).not.toBeInTheDocument();
+  });
+
+  it("shows filesystem path help text when there is no validation error", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "filesystem");
+
+    expect(
+      screen.getByText(/file system path starting with \//i),
+    ).toBeInTheDocument();
+  });
+
+  it("hides filesystem path help text when a validation error is present", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "filesystem");
+    await user.type(screen.getByLabelText(/^path$/i), "no-leading-slash");
+    await user.click(
+      screen.getByRole("button", { name: /add publication target/i }),
+    );
+    await screen.findByText(/path must start with \//i);
+
+    expect(
+      screen.queryByText(/file system path starting with \//i),
+    ).not.toBeInTheDocument();
+  });
+
+  it("renders optional Swift fields when Swift type is selected", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "swift");
+
+    expect(screen.getByLabelText("Tenant")).toBeInTheDocument();
+    expect(screen.getByLabelText("Tenant ID")).toBeInTheDocument();
+    expect(screen.getByLabelText("OpenStack domain name")).toBeInTheDocument();
+    expect(screen.getByLabelText("OpenStack domain ID")).toBeInTheDocument();
+    expect(screen.getByLabelText("OpenStack tenant domain")).toBeInTheDocument();
+    expect(
+      screen.getByLabelText("OpenStack tenant domain ID"),
+    ).toBeInTheDocument();
+  });
+
+  it("accepts input in optional Swift fields", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "swift");
+    await user.type(screen.getByLabelText("Tenant"), "my-tenant");
+    await user.type(screen.getByLabelText("Tenant ID"), "tenant-123");
+
+    expect(screen.getByLabelText("Tenant")).toHaveValue("my-tenant");
+    expect(screen.getByLabelText("Tenant ID")).toHaveValue("tenant-123");
+  });
+
+  it("toggles the Force SIGv2 checkbox on S3 form", async () => {
     renderWithProviders(<AddPublicationTargetForm />);
 
     const checkbox = screen.getByRole("checkbox", {
@@ -135,4 +317,126 @@ describe("AddPublicationTargetForm", () => {
     await user.click(checkbox);
     expect(checkbox).not.toBeChecked();
   });
+
+  it("submits S3 form with optional fields and shows success notification", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.type(screen.getByLabelText("Name"), "S3 Optional Fields");
+    await user.type(screen.getByLabelText(/region/i), "us-east-1");
+    await user.type(screen.getByLabelText(/bucket name/i), "my-bucket");
+    await user.type(
+      screen.getByLabelText(/aws access key id/i),
+      "AKIAIOSFODNN7EXAMPLE",
+    );
+    await user.type(
+      screen.getByLabelText(/aws secret access key/i),
+      "wJalrXUtnFEMI/K7MDENG/bPxRfiCYEXAMPLEKEY",
+    );
+    await user.type(
+      screen.getByLabelText(/endpoint/i),
+      "https://s3.custom.example.com",
+    );
+    await user.type(screen.getByLabelText(/^prefix$/i), "ubuntu/");
+    await user.type(screen.getByLabelText(/^acl$/i), "public-read");
+    await user.type(screen.getByLabelText(/storage class/i), "STANDARD_IA");
+    await user.type(screen.getByLabelText(/encryption method/i), "AES256");
+
+    await user.click(
+      screen.getByRole("button", { name: /add publication target/i }),
+    );
+
+    await vi.waitFor(() => {
+      expect(
+        screen.getByText("Publication target created"),
+      ).toBeInTheDocument();
+    });
+  });
+
+  it("submits Swift form with all optional fields and shows success notification", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "swift");
+    await user.type(screen.getByLabelText("Name"), "Swift Optional Fields");
+    await user.type(screen.getByLabelText(/container/i), "my-container");
+    await user.type(screen.getByLabelText(/^username$/i), "admin");
+    await user.type(screen.getByLabelText(/^password$/i), "secret");
+    await user.type(
+      screen.getByLabelText(/auth url/i),
+      "https://keystone.example.com/v3",
+    );
+    await user.type(screen.getByLabelText(/^prefix$/i), "packages/");
+    await user.type(screen.getByLabelText("Tenant"), "my-tenant");
+    await user.type(screen.getByLabelText("Tenant ID"), "tid-123");
+    await user.type(
+      screen.getByLabelText("OpenStack domain name"),
+      "Default",
+    );
+    await user.type(screen.getByLabelText("OpenStack domain ID"), "did-123");
+    await user.type(
+      screen.getByLabelText("OpenStack tenant domain"),
+      "tenant-domain",
+    );
+    await user.type(
+      screen.getByLabelText("OpenStack tenant domain ID"),
+      "tdid-123",
+    );
+
+    await user.click(
+      screen.getByRole("button", { name: /add publication target/i }),
+    );
+
+    await vi.waitFor(() => {
+      expect(
+        screen.getByText("Publication target created"),
+      ).toBeInTheDocument();
+    });
+  });
+
+  it("submits Filesystem form with linkMethod set and shows success notification", async () => {
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.selectOptions(screen.getByLabelText(/^type$/i), "filesystem");
+    await user.type(screen.getByLabelText("Name"), "FS with link method");
+    await user.type(screen.getByLabelText(/^path$/i), "/srv/archives");
+    await user.selectOptions(screen.getByLabelText(/link method/i), "SYMLINK");
+
+    await user.click(
+      screen.getByRole("button", { name: /add publication target/i }),
+    );
+
+    await vi.waitFor(() => {
+      expect(
+        screen.getByText("Publication target created"),
+      ).toBeInTheDocument();
+    });
+  });
+
+  it("shows an error notification when form submission fails", async () => {
+    server.use(
+      http.post(`${API_URL_DEB_ARCHIVE}publicationTargets`, () =>
+        HttpResponse.json({ message: "server error" }, { status: 500 }),
+      ),
+    );
+
+    renderWithProviders(<AddPublicationTargetForm />);
+
+    await user.type(screen.getByLabelText("Name"), "My S3 Target");
+    await user.type(screen.getByLabelText(/region/i), "us-east-1");
+    await user.type(screen.getByLabelText(/bucket name/i), "my-bucket");
+    await user.type(
+      screen.getByLabelText(/aws access key id/i),
+      "AKIAIOSFODNN7EXAMPLE",
+    );
+    await user.type(
+      screen.getByLabelText(/aws secret access key/i),
+      "wJalrXUtnFEMI/K7MDENG/bPxRfiCYEXAMPLEKEY",
+    );
+
+    await user.click(
+      screen.getByRole("button", { name: /add publication target/i }),
+    );
+
+    expect(await screen.findByText("server error")).toBeInTheDocument();
+  });
 });
+
diff --git a/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.tsx b/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.tsx
index 1cdf40223..96becbf2b 100644
--- a/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.tsx
+++ b/src/features/publication-targets/components/AddPublicationTargetForm/AddPublicationTargetForm.tsx
@@ -3,13 +3,69 @@ import useDebug from "@/hooks/useDebug";
 import usePageParams from "@/hooks/usePageParams";
 import { getFormikError } from "@/utils/formikErrors";
 import useCreatePublicationTarget from "../../api/useCreatePublicationTarget";
-import { CheckboxInput, Form, Input } from "@canonical/react-components";
+import { Form, Input, Select } from "@canonical/react-components";
 import { useFormik } from "formik";
 import type { FC } from "react";
 import * as Yup from "yup";
 import { INITIAL_VALUES } from "./constants";
 import type { AddPublicationTargetFormValues } from "./constants";
 import useNotify from "@/hooks/useNotify";
+import {
+  FilesystemFields,
+  S3Fields,
+  SwiftFields,
+} from "../TargetTypeFields";
+import type { FilesystemTargetLinkMethod } from "@canonical/landscape-openapi";
+
+const TARGET_TYPE_OPTIONS = [
+  { value: "s3", label: "S3" },
+  { value: "swift", label: "Swift" },
+  { value: "filesystem", label: "Filesystem" },
+];
+
+const VALIDATION_SCHEMA = Yup.object().shape({
+  displayName: Yup.string().required("This field is required"),
+  targetType: Yup.string().oneOf(["s3", "swift", "filesystem"]).required(),
+  region: Yup.string().when("targetType", {
+    is: "s3",
+    then: (s) => s.required("This field is required"),
+  }),
+  bucket: Yup.string().when("targetType", {
+    is: "s3",
+    then: (s) => s.required("This field is required"),
+  }),
+  awsAccessKeyId: Yup.string().when("targetType", {
+    is: "s3",
+    then: (s) => s.required("This field is required"),
+  }),
+  awsSecretAccessKey: Yup.string().when("targetType", {
+    is: "s3",
+    then: (s) => s.required("This field is required"),
+  }),
+  container: Yup.string().when("targetType", {
+    is: "swift",
+    then: (s) => s.required("This field is required"),
+  }),
+  swiftUsername: Yup.string().when("targetType", {
+    is: "swift",
+    then: (s) => s.required("This field is required"),
+  }),
+  swiftPassword: Yup.string().when("targetType", {
+    is: "swift",
+    then: (s) => s.required("This field is required"),
+  }),
+  authUrl: Yup.string().when("targetType", {
+    is: "swift",
+    then: (s) => s.required("This field is required"),
+  }),
+  path: Yup.string().when("targetType", {
+    is: "filesystem",
+    then: (s) =>
+      s
+        .required("This field is required")
+        .matches(/^\//, "Path must start with /"),
+  }),
+});
 
 const AddPublicationTargetForm: FC = () => {
   const debug = useDebug();
@@ -22,40 +78,58 @@ const AddPublicationTargetForm: FC = () => {
 
   const formik = useFormik<AddPublicationTargetFormValues>({
     initialValues: INITIAL_VALUES,
-    validationSchema: Yup.object().shape({
-      displayName: Yup.string().required("This field is required"),
-      bucket: Yup.string().required("This field is required"),
-      awsAccessKeyId: Yup.string().required("This field is required"),
-      awsSecretAccessKey: Yup.string().required("This field is required"),
-      region: Yup.string().required("This field is required"),
-      endpoint: Yup.string(),
-      prefix: Yup.string(),
-      acl: Yup.string(),
-      storageClass: Yup.string(),
-      encryptionMethod: Yup.string(),
-      disableMultiDel: Yup.boolean(),
-      forceSigV2: Yup.boolean(),
-    }),
+    validationSchema: VALIDATION_SCHEMA,
     onSubmit: async (values) => {
       try {
-        await mutateAsync({
-          displayName: values.displayName,
-          s3: {
-            ...(values.region && { region: values.region }),
-            bucket: values.bucket,
-            awsAccessKeyId: values.awsAccessKeyId,
-            awsSecretAccessKey: values.awsSecretAccessKey,
-            ...(values.endpoint && { endpoint: values.endpoint }),
-            ...(values.prefix && { prefix: values.prefix }),
-            ...(values.acl && { acl: values.acl }),
-            ...(values.storageClass && { storageClass: values.storageClass }),
-            ...(values.encryptionMethod && {
-              encryptionMethod: values.encryptionMethod,
-            }),
-            disableMultiDel: values.disableMultiDel,
-            forceSigV2: values.forceSigV2,
-          },
-        });
+        if (values.targetType === "s3") {
+          await mutateAsync({
+            displayName: values.displayName,
+            s3: {
+              region: values.region,
+              bucket: values.bucket,
+              awsAccessKeyId: values.awsAccessKeyId,
+              awsSecretAccessKey: values.awsSecretAccessKey,
+              ...(values.endpoint && { endpoint: values.endpoint }),
+              ...(values.s3Prefix && { prefix: values.s3Prefix }),
+              ...(values.acl && { acl: values.acl }),
+              ...(values.storageClass && { storageClass: values.storageClass }),
+              ...(values.encryptionMethod && {
+                encryptionMethod: values.encryptionMethod,
+              }),
+              disableMultiDel: values.disableMultiDel,
+              forceSigV2: values.forceSigV2,
+            },
+          });
+        } else if (values.targetType === "swift") {
+          await mutateAsync({
+            displayName: values.displayName,
+            swift: {
+              container: values.container,
+              username: values.swiftUsername,
+              password: values.swiftPassword,
+              authUrl: values.authUrl,
+              ...(values.swiftPrefix && { prefix: values.swiftPrefix }),
+              ...(values.tenant && { tenant: values.tenant }),
+              ...(values.tenantId && { tenantId: values.tenantId }),
+              ...(values.domain && { domain: values.domain }),
+              ...(values.domainId && { domainId: values.domainId }),
+              ...(values.tenantDomain && { tenantDomain: values.tenantDomain }),
+              ...(values.tenantDomainId && {
+                tenantDomainId: values.tenantDomainId,
+              }),
+            },
+          });
+        } else {
+          await mutateAsync({
+            displayName: values.displayName,
+            filesystem: {
+              path: values.path,
+              ...(values.linkMethod && {
+                linkMethod: values.linkMethod as FilesystemTargetLinkMethod,
+              }),
+            },
+          });
+        }
 
         closeForm();
 
@@ -69,6 +143,14 @@ const AddPublicationTargetForm: FC = () => {
     },
   });
 
+  const handleTypeChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
+    formik.setValues({
+      ...INITIAL_VALUES,
+      displayName: formik.values.displayName,
+      targetType: e.target.value as AddPublicationTargetFormValues["targetType"],
+    });
+  };
+
   return (
     <Form onSubmit={formik.handleSubmit} noValidate>
       <Input
@@ -78,84 +160,19 @@ const AddPublicationTargetForm: FC = () => {
         error={getFormikError(formik, "displayName")}
         {...formik.getFieldProps("displayName")}
       />
-      <Input
-        type="text"
-        label="Region"
-        required
-        error={getFormikError(formik, "region")}
-        {...formik.getFieldProps("region")}
-      />
-      <Input
-        type="text"
-        label="Bucket name"
-        required
-        error={getFormikError(formik, "bucket")}
-        {...formik.getFieldProps("bucket")}
-      />
-      <Input
-        type="text"
-        label="Endpoint"
-        error={getFormikError(formik, "endpoint")}
-        {...formik.getFieldProps("endpoint")}
-      />
-      <Input
-        type="text"
-        label="AWS access key ID"
-        required
-        error={getFormikError(formik, "awsAccessKeyId")}
-        {...formik.getFieldProps("awsAccessKeyId")}
-      />
-      <Input
-        type="text"
-        label="AWS secret access key"
+      <Select
+        label="Type"
         required
-        error={getFormikError(formik, "awsSecretAccessKey")}
-        {...formik.getFieldProps("awsSecretAccessKey")}
-      />
-      <Input
-        type="text"
-        label="Prefix"
-        error={getFormikError(formik, "prefix")}
-        {...formik.getFieldProps("prefix")}
-      />
-      <Input
-        type="text"
-        label="ACL"
-        error={getFormikError(formik, "acl")}
-        {...formik.getFieldProps("acl")}
-      />
-      <Input
-        type="text"
-        label="Storage class"
-        error={getFormikError(formik, "storageClass")}
-        {...formik.getFieldProps("storageClass")}
-      />
-      <Input
-        type="text"
-        label="Encryption method"
-        error={getFormikError(formik, "encryptionMethod")}
-        {...formik.getFieldProps("encryptionMethod")}
-      />
-      <CheckboxInput
-        label="Disable MultiDel"
-        checked={formik.values.disableMultiDel}
-        onChange={(e) =>
-          formik.setFieldValue(
-            "disableMultiDel",
-            (e.target as HTMLInputElement).checked,
-          )
-        }
-      />
-      <CheckboxInput
-        label="Force AWS SIGv2 (disables SIGv4)"
-        checked={formik.values.forceSigV2}
-        onChange={(e) =>
-          formik.setFieldValue(
-            "forceSigV2",
-            (e.target as HTMLInputElement).checked,
-          )
-        }
+        options={TARGET_TYPE_OPTIONS}
+        value={formik.values.targetType}
+        onChange={handleTypeChange}
+        error={getFormikError(formik, "targetType")}
       />
+      {formik.values.targetType === "s3" && <S3Fields formik={formik} />}
+      {formik.values.targetType === "swift" && <SwiftFields formik={formik} />}
+      {formik.values.targetType === "filesystem" && (
+        <FilesystemFields formik={formik} />
+      )}
       <SidePanelFormButtons
         submitButtonDisabled={formik.isSubmitting}
         submitButtonText="Add publication target"
diff --git a/src/features/publication-targets/components/AddPublicationTargetForm/constants.ts b/src/features/publication-targets/components/AddPublicationTargetForm/constants.ts
index 7e53e2c7c..d2d58e182 100644
--- a/src/features/publication-targets/components/AddPublicationTargetForm/constants.ts
+++ b/src/features/publication-targets/components/AddPublicationTargetForm/constants.ts
@@ -1,29 +1,73 @@
+import type { FilesystemTargetLinkMethod } from "@canonical/landscape-openapi";
+
+export type TargetType = "s3" | "swift" | "filesystem";
+
 export interface AddPublicationTargetFormValues {
   displayName: string;
+  targetType: TargetType;
+
+  // S3
   region: string;
   bucket: string;
   endpoint: string;
   awsAccessKeyId: string;
   awsSecretAccessKey: string;
-  prefix: string;
+  s3Prefix: string;
   acl: string;
   storageClass: string;
   encryptionMethod: string;
   disableMultiDel: boolean;
   forceSigV2: boolean;
+
+  // Swift
+  container: string;
+  swiftUsername: string;
+  swiftPassword: string;
+  swiftPrefix: string;
+  authUrl: string;
+  tenant: string;
+  tenantId: string;
+  domain: string;
+  domainId: string;
+  tenantDomain: string;
+  tenantDomainId: string;
+
+  // Filesystem
+  path: string;
+  linkMethod: FilesystemTargetLinkMethod | "";
 }
 
 export const INITIAL_VALUES: AddPublicationTargetFormValues = {
   displayName: "",
+  targetType: "s3",
+
+  // S3
   region: "",
   bucket: "",
   endpoint: "",
   awsAccessKeyId: "",
   awsSecretAccessKey: "",
-  prefix: "",
+  s3Prefix: "",
   acl: "",
   storageClass: "",
   encryptionMethod: "",
   disableMultiDel: false,
   forceSigV2: false,
+
+  // Swift
+  container: "",
+  swiftUsername: "",
+  swiftPassword: "",
+  swiftPrefix: "",
+  authUrl: "",
+  tenant: "",
+  tenantId: "",
+  domain: "",
+  domainId: "",
+  tenantDomain: "",
+  tenantDomainId: "",
+
+  // Filesystem
+  path: "",
+  linkMethod: "",
 };
diff --git a/src/features/publication-targets/components/EditTargetForm/EditTargetForm.test.tsx b/src/features/publication-targets/components/EditTargetForm/EditTargetForm.test.tsx
index 5e17e88c2..019d13793 100644
--- a/src/features/publication-targets/components/EditTargetForm/EditTargetForm.test.tsx
+++ b/src/features/publication-targets/components/EditTargetForm/EditTargetForm.test.tsx
@@ -1,158 +1,354 @@
+import { API_URL_DEB_ARCHIVE } from "@/constants";
 import { publicationTargets } from "@/tests/mocks/publicationTargets";
+import server from "@/tests/server";
 import { renderWithProviders } from "@/tests/render";
 import { screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
+import { http, HttpResponse } from "msw";
 import { describe, expect, it } from "vitest";
 import EditTargetForm from "./EditTargetForm";
-import type { PublicationTarget } from "@canonical/landscape-openapi";
 
-// TODO: add coverage for other target types (swift and filesystem) once those are supported
-
-// S3 targets from mocks. publicationTargets[0] has all optional S3 fields;
-// publicationTargets[1] has minimal optional fields. Both are S3-only in this version.
-const [s3TargetFull, s3TargetMinimal] = publicationTargets;
+const [s3TargetFull, s3TargetMinimal, swiftTarget, filesystemTarget] =
+  publicationTargets;
 
 if (!s3TargetFull?.s3 || !s3TargetMinimal?.s3) {
   throw new Error("Test targets must have S3 config");
 }
+if (!swiftTarget?.swift) {
+  throw new Error("Test target must have Swift config");
+}
+if (!filesystemTarget?.filesystem) {
+  throw new Error("Test target must have Filesystem config");
+}
 
 const s3Full = s3TargetFull.s3;
+const swift = swiftTarget.swift;
+const filesystem = filesystemTarget.filesystem;
 
 describe("EditTargetForm", () => {
   const user = userEvent.setup();
 
-  it("pre-populates the display_name field from the target prop", () => {
-    renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+  describe("S3 target", () => {
+    it("pre-populates the display_name field", () => {
+      renderWithProviders(<EditTargetForm target={s3TargetFull} />);
 
-    expect(screen.getByLabelText("Name")).toHaveValue(s3TargetFull.displayName);
-  });
+      expect(screen.getByLabelText("Name")).toHaveValue(s3TargetFull.displayName);
+    });
 
-  it("pre-populates S3 fields from the target prop", () => {
-    renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+    it("shows Type as read-only S3", () => {
+      renderWithProviders(<EditTargetForm target={s3TargetFull} />);
 
-    expect(screen.getByText(s3Full.bucket)).toBeInTheDocument();
-    expect(screen.getByLabelText(/aws access key id/i)).toHaveValue(
-      s3Full.awsAccessKeyId,
-    );
-    expect(screen.getByText(s3Full.region)).toBeInTheDocument();
-  });
+      expect(screen.getByText("S3")).toBeInTheDocument();
+    });
 
-  it("pre-populates optional S3 fields when present", () => {
-    renderWithProviders(<EditTargetForm target={s3TargetFull} />);
-
-    expect(screen.getByText(s3Full.prefix ?? "")).toBeInTheDocument();
-    expect(screen.getByLabelText(/^acl$/i)).toHaveValue(s3Full.acl);
-    expect(screen.getByLabelText(/storage class/i)).toHaveValue(
-      s3Full.storageClass,
-    );
-    expect(screen.getByLabelText(/encryption method/i)).toHaveValue(
-      s3Full.encryptionMethod,
-    );
-  });
+    it("pre-populates S3 structural fields", () => {
+      renderWithProviders(<EditTargetForm target={s3TargetFull} />);
 
-  it("pre-populates with empty strings when optional S3 fields are missing", () => {
-    renderWithProviders(<EditTargetForm target={s3TargetMinimal} />);
+      expect(screen.getByText(s3Full.bucket)).toBeInTheDocument();
+      expect(screen.getByText(s3Full.region)).toBeInTheDocument();
+    });
 
-    expect(screen.getByLabelText(/^acl$/i)).toHaveValue("");
-    expect(screen.getByLabelText(/storage class/i)).toHaveValue("");
-    expect(screen.getByLabelText(/encryption method/i)).toHaveValue("");
-  });
+    it("leaves INPUT_ONLY credential fields blank", () => {
+      renderWithProviders(<EditTargetForm target={s3TargetFull} />);
 
-  it("pre-populates all S3 fields with empty strings when target has no S3 config", () => {
-    const targetWithoutS3 = {
-      name: "publicationTargets/no-s3",
-      publicationTargetId: "no-s3",
-      displayName: "Target without S3",
-    };
-
-    renderWithProviders(<EditTargetForm target={targetWithoutS3} />);
-
-    expect(screen.getByLabelText("Name")).toHaveValue("Target without S3");
-    expect(screen.getByLabelText(/aws access key id/i)).toHaveValue("");
-    expect(screen.getByLabelText(/aws secret access key/i)).toHaveValue("");
-    expect(screen.getByLabelText(/^acl$/i)).toHaveValue("");
-    expect(screen.getByLabelText(/storage class/i)).toHaveValue("");
-    expect(screen.getByLabelText(/encryption method/i)).toHaveValue("");
-  });
+      expect(screen.getByLabelText(/aws access key id/i)).toHaveValue("");
+      expect(screen.getByLabelText(/aws secret access key/i)).toHaveValue("");
+    });
+
+    it("shows help text for INPUT_ONLY fields", () => {
+      renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+
+      expect(
+        screen.getAllByText(/leave blank to keep current value/i),
+      ).toHaveLength(2);
+    });
+
+    it("pre-populates optional S3 fields when present", () => {
+      renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+
+      expect(screen.getByLabelText(/^acl$/i)).toHaveValue(s3Full.acl);
+      expect(screen.getByLabelText(/storage class/i)).toHaveValue(
+        s3Full.storageClass,
+      );
+      expect(screen.getByLabelText(/encryption method/i)).toHaveValue(
+        s3Full.encryptionMethod,
+      );
+    });
+
+    it("pre-populates with empty strings when optional S3 fields are missing", () => {
+      renderWithProviders(<EditTargetForm target={s3TargetMinimal} />);
+
+      expect(screen.getByLabelText(/^acl$/i)).toHaveValue("");
+      expect(screen.getByLabelText(/storage class/i)).toHaveValue("");
+      expect(screen.getByLabelText(/encryption method/i)).toHaveValue("");
+    });
 
-  it("pre-populates with mixed null/undefined optional S3 fields", () => {
-    const s3TargetPartiallyNull = {
-      name: "publicationTargets/partial",
-      publicationTargetId: "partial",
-      displayName: "Partially null",
-      s3: {
-        bucket: "my-bucket",
-        awsAccessKeyId: "key",
-        awsSecretAccessKey: "secret",
-        region: "region",
-        endpoint: undefined,
-        prefix: undefined,
-        acl: "private",
-        storageClass: undefined,
-        encryptionMethod: undefined,
-      },
-    } as PublicationTarget;
-
-    renderWithProviders(<EditTargetForm target={s3TargetPartiallyNull} />);
-
-    expect(screen.getByLabelText(/^acl$/i)).toHaveValue("private");
-    expect(screen.getByLabelText(/storage class/i)).toHaveValue("");
-    expect(screen.getByLabelText(/encryption method/i)).toHaveValue("");
+    it("renders the save button", () => {
+      renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+
+      expect(
+        screen.getByRole("button", { name: /save/i }),
+      ).toBeInTheDocument();
+    });
+
+    it("submits and shows success notification", async () => {
+      renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+
+      await user.click(screen.getByRole("button", { name: /save/i }));
+
+      expect(
+        await screen.findByText(/publication target edited/i),
+      ).toBeInTheDocument();
+    });
   });
 
-  it("renders the save button", () => {
-    renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+  describe("Swift target", () => {
+    it("shows Type as read-only Swift", () => {
+      renderWithProviders(<EditTargetForm target={swiftTarget} />);
+
+      expect(screen.getByText("Swift")).toBeInTheDocument();
+    });
+
+    it("pre-populates container as read-only", () => {
+      renderWithProviders(<EditTargetForm target={swiftTarget} />);
+
+      expect(screen.getByText(swift.container)).toBeInTheDocument();
+    });
+
+    it("pre-populates authUrl as read-only", () => {
+      renderWithProviders(<EditTargetForm target={swiftTarget} />);
+
+      expect(screen.getByText(swift.authUrl)).toBeInTheDocument();
+    });
+
+    it("leaves INPUT_ONLY credential fields blank with help text", () => {
+      renderWithProviders(<EditTargetForm target={swiftTarget} />);
+
+      expect(screen.getByLabelText(/^username$/i)).toHaveValue("");
+      expect(screen.getByLabelText(/^password$/i)).toHaveValue("");
+      expect(
+        screen.getAllByText(/leave blank to keep current value/i),
+      ).toHaveLength(2);
+    });
+
+    it("pre-populates optional Swift fields when present", () => {
+      renderWithProviders(<EditTargetForm target={swiftTarget} />);
+
+      expect(screen.getByLabelText(/^tenant$/i)).toHaveValue(swift.tenant ?? "");
+    });
 
-    expect(screen.getByRole("button", { name: /save/i })).toBeInTheDocument();
+    it("submits and shows success notification", async () => {
+      renderWithProviders(<EditTargetForm target={swiftTarget} />);
+
+      await user.click(screen.getByRole("button", { name: /save/i }));
+
+      expect(
+        await screen.findByText(/publication target edited/i),
+      ).toBeInTheDocument();
+    });
+
+    it("user can edit optional Swift fields and submit successfully", async () => {
+      renderWithProviders(<EditTargetForm target={swiftTarget} />);
+
+      await user.clear(screen.getByLabelText(/^tenant$/i));
+      await user.type(screen.getByLabelText(/^tenant$/i), "updated-tenant");
+      await user.type(screen.getByLabelText(/^prefix$/i), "packages/");
+      await user.click(screen.getByRole("button", { name: /save/i }));
+
+      expect(
+        await screen.findByText(/publication target edited/i),
+      ).toBeInTheDocument();
+    });
+
+    it("shows 'This field is required' when display name is cleared", async () => {
+      renderWithProviders(<EditTargetForm target={swiftTarget} />);
+
+      await user.clear(screen.getByLabelText("Name"));
+      await user.click(screen.getByRole("button", { name: /save/i }));
+
+      expect(
+        await screen.findByText(/this field is required/i),
+      ).toBeInTheDocument();
+    });
   });
 
-  it("submits the form with all optional fields and shows success notification", async () => {
-    renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+  describe("Filesystem target", () => {
+    it("shows Type as read-only Filesystem", () => {
+      renderWithProviders(<EditTargetForm target={filesystemTarget} />);
+
+      expect(screen.getByText("Filesystem")).toBeInTheDocument();
+    });
+
+    it("pre-populates path as read-only", () => {
+      renderWithProviders(<EditTargetForm target={filesystemTarget} />);
+
+      expect(screen.getByText(filesystem.path)).toBeInTheDocument();
+    });
+
+    it("pre-populates linkMethod select", () => {
+      renderWithProviders(<EditTargetForm target={filesystemTarget} />);
+
+      expect(screen.getByLabelText(/link method/i)).toHaveValue(
+        filesystem.linkMethod ?? "",
+      );
+    });
+
+    it("submits and shows success notification", async () => {
+      renderWithProviders(<EditTargetForm target={filesystemTarget} />);
 
-    await user.click(screen.getByRole("button", { name: /save/i }));
+      await user.click(screen.getByRole("button", { name: /save/i }));
 
-    expect(
-      await screen.findByText(/publication target edited/i),
-    ).toBeInTheDocument();
+      expect(
+        await screen.findByText(/publication target edited/i),
+      ).toBeInTheDocument();
+    });
+
+    it("user can change linkMethod and submit successfully", async () => {
+      renderWithProviders(<EditTargetForm target={filesystemTarget} />);
+
+      await user.selectOptions(screen.getByLabelText(/link method/i), "SYMLINK");
+      await user.click(screen.getByRole("button", { name: /save/i }));
+
+      expect(
+        await screen.findByText(/publication target edited/i),
+      ).toBeInTheDocument();
+    });
+
+    it("shows 'This field is required' when display name is cleared", async () => {
+      renderWithProviders(<EditTargetForm target={filesystemTarget} />);
+
+      await user.clear(screen.getByLabelText("Name"));
+      await user.click(screen.getByRole("button", { name: /save/i }));
+
+      expect(
+        await screen.findByText(/this field is required/i),
+      ).toBeInTheDocument();
+    });
   });
 
-  it("submits the form with empty optional fields and shows success notification", async () => {
-    renderWithProviders(<EditTargetForm target={s3TargetMinimal} />);
+  describe("display name validation", () => {
+    it("shows 'This field is required' when display name is cleared on S3 target", async () => {
+      renderWithProviders(<EditTargetForm target={s3TargetFull} />);
 
-    await user.click(screen.getByRole("button", { name: /save/i }));
+      await user.clear(screen.getByLabelText("Name"));
+      await user.click(screen.getByRole("button", { name: /save/i }));
 
-    expect(
-      await screen.findByText(/publication target edited/i),
-    ).toBeInTheDocument();
+      expect(
+        await screen.findByText(/this field is required/i),
+      ).toBeInTheDocument();
+    });
   });
 
-  it("toggles the disable_multi_del checkbox", async () => {
-    renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+  describe("S3 checkbox fields", () => {
+    it("toggles the disableMultiDel checkbox", async () => {
+      renderWithProviders(<EditTargetForm target={s3TargetFull} />);
 
-    const checkbox = screen.getByRole("checkbox", {
-      name: /disable multidel/i,
+      const checkbox = screen.getByRole("checkbox", {
+        name: /disable multidel/i,
+      });
+      const initialState = (checkbox as HTMLInputElement).checked;
+
+      await user.click(checkbox);
+      expect((checkbox as HTMLInputElement).checked).toBe(!initialState);
     });
-    expect(checkbox).not.toBeChecked();
 
-    await user.click(checkbox);
-    expect(checkbox).toBeChecked();
+    it("toggles the forceSigV2 checkbox", async () => {
+      renderWithProviders(<EditTargetForm target={s3TargetFull} />);
 
-    await user.click(checkbox);
-    expect(checkbox).not.toBeChecked();
-  });
+      const checkbox = screen.getByRole("checkbox", {
+        name: /force aws sigv2/i,
+      });
+      const initialState = (checkbox as HTMLInputElement).checked;
 
-  it("toggles the force_sig_v2 checkbox", async () => {
-    renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+      await user.click(checkbox);
+      expect((checkbox as HTMLInputElement).checked).toBe(!initialState);
+    });
+
+    it("submits S3 form with optional fields populated and shows success", async () => {
+      renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+
+      await user.type(screen.getByLabelText(/aws access key id/i), "NEWKEY");
+      await user.type(
+        screen.getByLabelText(/aws secret access key/i),
+        "NEWSECRET",
+      );
+      await user.clear(screen.getByLabelText(/^acl$/i));
+      await user.type(screen.getByLabelText(/^acl$/i), "public-read");
+      await user.clear(screen.getByLabelText(/storage class/i));
+      await user.type(screen.getByLabelText(/storage class/i), "STANDARD_IA");
+      await user.clear(screen.getByLabelText(/encryption method/i));
+      await user.type(screen.getByLabelText(/encryption method/i), "aws:kms");
+
+      await user.click(screen.getByRole("button", { name: /save/i }));
+
+      expect(
+        await screen.findByText(/publication target edited/i),
+      ).toBeInTheDocument();
+    });
+  });
 
-    const checkbox = screen.getByRole("checkbox", {
-      name: /force aws sigv2/i,
+  describe("Swift optional fields editing", () => {
+    it("submits Swift form with all optional fields populated and shows success", async () => {
+      renderWithProviders(<EditTargetForm target={swiftTarget} />);
+
+      await user.type(screen.getByLabelText(/^prefix$/i), "packages/");
+      await user.clear(screen.getByLabelText(/^tenant$/i));
+      await user.type(screen.getByLabelText(/^tenant$/i), "updated-tenant");
+      await user.type(screen.getByLabelText(/^tenant id$/i), "tid-999");
+      await user.type(screen.getByLabelText(/^domain$/i), "Default");
+      await user.type(screen.getByLabelText(/^domain id$/i), "did-999");
+      await user.type(screen.getByLabelText(/^tenant domain$/i), "td-999");
+      await user.type(
+        screen.getByLabelText(/^tenant domain id$/i),
+        "tdid-999",
+      );
+
+      await user.click(screen.getByRole("button", { name: /save/i }));
+
+      expect(
+        await screen.findByText(/publication target edited/i),
+      ).toBeInTheDocument();
     });
-    expect(checkbox).not.toBeChecked();
+  });
 
-    await user.click(checkbox);
-    expect(checkbox).toBeChecked();
+  describe("error handling", () => {
+    it("shows an error notification when S3 edit fails", async () => {
+      server.use(
+        http.patch(
+          `${API_URL_DEB_ARCHIVE}publicationTargets/:id`,
+          () =>
+            HttpResponse.json(
+              { message: "edit failed" },
+              { status: 500 },
+            ),
+        ),
+      );
+
+      renderWithProviders(<EditTargetForm target={s3TargetFull} />);
+      await user.click(screen.getByRole("button", { name: /save/i }));
+
+      expect(await screen.findByText("edit failed")).toBeInTheDocument();
+    });
 
-    await user.click(checkbox);
-    expect(checkbox).not.toBeChecked();
+    it("shows an error notification when Swift edit fails", async () => {
+      server.use(
+        http.patch(
+          `${API_URL_DEB_ARCHIVE}publicationTargets/:id`,
+          () =>
+            HttpResponse.json(
+              { message: "swift edit failed" },
+              { status: 500 },
+            ),
+        ),
+      );
+
+      renderWithProviders(<EditTargetForm target={swiftTarget} />);
+      await user.click(screen.getByRole("button", { name: /save/i }));
+
+      expect(
+        await screen.findByText("swift edit failed"),
+      ).toBeInTheDocument();
+    });
   });
 });
+
diff --git a/src/features/publication-targets/components/EditTargetForm/EditTargetForm.tsx b/src/features/publication-targets/components/EditTargetForm/EditTargetForm.tsx
index e5d18d582..643b920eb 100644
--- a/src/features/publication-targets/components/EditTargetForm/EditTargetForm.tsx
+++ b/src/features/publication-targets/components/EditTargetForm/EditTargetForm.tsx
@@ -1,69 +1,130 @@
 import SidePanelFormButtons from "@/components/form/SidePanelFormButtons";
+import ReadOnlyField from "@/components/form/ReadOnlyField";
 import useDebug from "@/hooks/useDebug";
 import usePageParams from "@/hooks/usePageParams";
 import { getFormikError } from "@/utils/formikErrors";
 import useEditPublicationTarget from "../../api/useEditPublicationTarget";
-import { CheckboxInput, Form, Input } from "@canonical/react-components";
+import {
+  CheckboxInput,
+  Form,
+  Input,
+  Select,
+} from "@canonical/react-components";
 import { useFormik } from "formik";
 import type { FC } from "react";
-import * as Yup from "yup";
-import type { PublicationTarget } from "@canonical/landscape-openapi";
-import ReadOnlyField from "@/components/form/ReadOnlyField";
+import type {
+  FilesystemTargetLinkMethod,
+  PublicationTarget,
+} from "@canonical/landscape-openapi";
 import useNotify from "@/hooks/useNotify";
+import {
+  EMPTY_VALUES,
+  LINK_METHOD_OPTIONS,
+  TARGET_TYPE_LABELS,
+  VALIDATION_SCHEMA,
+} from "../../constants";
+import type { EditTargetFormValues } from "../../constants";
+
+export { TARGET_TYPE_LABELS } from "../../constants";
 
 interface EditTargetFormProps {
   readonly target: PublicationTarget;
 }
 
-const VALIDATION_SCHEMA = Yup.object().shape({
-  displayName: Yup.string().required("This field is required"),
-  bucket: Yup.string().required("This field is required"),
-  awsAccessKeyId: Yup.string().required("This field is required"),
-  awsSecretAccessKey: Yup.string().required("This field is required"),
-  region: Yup.string().required("This field is required"),
-  endpoint: Yup.string(),
-  prefix: Yup.string(),
-  acl: Yup.string(),
-  storageClass: Yup.string(),
-  encryptionMethod: Yup.string(),
-  disableMultiDel: Yup.boolean(),
-  forceSigV2: Yup.boolean(),
+export const getTargetType = (
+  target: PublicationTarget,
+): "s3" | "swift" | "filesystem" => {
+  if (target.s3) return "s3";
+  if (target.swift) return "swift";
+  if (target.filesystem) return "filesystem";
+  throw new Error("Unsupported publication target type");
+};
+
+const getS3InitialValues = (
+  target: PublicationTarget,
+  base: EditTargetFormValues,
+): EditTargetFormValues => ({
+  ...base,
+  region: target.s3?.region ?? "",
+  bucket: target.s3?.bucket ?? "",
+  endpoint: target.s3?.endpoint ?? "",
+  s3Prefix: target.s3?.prefix ?? "",
+  acl: target.s3?.acl ?? "",
+  storageClass: target.s3?.storageClass ?? "",
+  encryptionMethod: target.s3?.encryptionMethod ?? "",
+  disableMultiDel: target.s3?.disableMultiDel ?? false,
+  forceSigV2: target.s3?.forceSigV2 ?? false,
+});
+
+const getSwiftInitialValues = (
+  target: PublicationTarget,
+  base: EditTargetFormValues,
+): EditTargetFormValues => ({
+  ...base,
+  container: target.swift?.container ?? "",
+  swiftPrefix: target.swift?.prefix ?? "",
+  authUrl: target.swift?.authUrl ?? "",
+  tenant: target.swift?.tenant ?? "",
+  tenantId: target.swift?.tenantId ?? "",
+  domain: target.swift?.domain ?? "",
+  domainId: target.swift?.domainId ?? "",
+  tenantDomain: target.swift?.tenantDomain ?? "",
+  tenantDomainId: target.swift?.tenantDomainId ?? "",
 });
 
-const getS3InitialValues = (s3: PublicationTarget["s3"] | undefined) => {
-  if (!s3) {
-    return {
-      region: "",
-      bucket: "",
-      endpoint: "",
-      awsAccessKeyId: "",
-      awsSecretAccessKey: "",
-      prefix: "",
-      acl: "",
-      storageClass: "",
-      encryptionMethod: "",
-      disableMultiDel: false,
-      forceSigV2: false,
-    };
-  }
-  return {
-    region: s3.region ?? "",
-    bucket: s3.bucket,
-    endpoint: s3.endpoint ?? "",
-    awsAccessKeyId: s3.awsAccessKeyId,
-    awsSecretAccessKey: s3.awsSecretAccessKey,
-    prefix: s3.prefix ?? "",
-    acl: s3.acl ?? "",
-    storageClass: s3.storageClass ?? "",
-    encryptionMethod: s3.encryptionMethod ?? "",
-    disableMultiDel: s3.disableMultiDel ?? false,
-    forceSigV2: s3.forceSigV2 ?? false,
-  };
+const getFilesystemInitialValues = (
+  target: PublicationTarget,
+  base: EditTargetFormValues,
+): EditTargetFormValues => ({
+  ...base,
+  path: target.filesystem?.path ?? "",
+  linkMethod: (target.filesystem?.linkMethod ?? "") as FilesystemTargetLinkMethod | "",
+});
+
+const getInitialValues = (target: PublicationTarget): EditTargetFormValues => {
+  const base = { ...EMPTY_VALUES, displayName: target.displayName ?? "" };
+  if (target.s3) return getS3InitialValues(target, base);
+  if (target.swift) return getSwiftInitialValues(target, base);
+  return getFilesystemInitialValues(target, base);
 };
 
-const getInitialValues = (target: PublicationTarget) => ({
-  displayName: target.displayName ?? "",
-  ...getS3InitialValues(target.s3),
+const buildS3Payload = (values: EditTargetFormValues) => ({
+  region: values.region,
+  bucket: values.bucket,
+  ...(values.awsAccessKeyId && { awsAccessKeyId: values.awsAccessKeyId }),
+  ...(values.awsSecretAccessKey && {
+    awsSecretAccessKey: values.awsSecretAccessKey,
+  }),
+  ...(values.endpoint && { endpoint: values.endpoint }),
+  ...(values.s3Prefix && { prefix: values.s3Prefix }),
+  ...(values.acl && { acl: values.acl }),
+  ...(values.storageClass && { storageClass: values.storageClass }),
+  ...(values.encryptionMethod && {
+    encryptionMethod: values.encryptionMethod,
+  }),
+  disableMultiDel: values.disableMultiDel,
+  forceSigV2: values.forceSigV2,
+});
+
+const buildSwiftPayload = (values: EditTargetFormValues) => ({
+  container: values.container,
+  authUrl: values.authUrl,
+  ...(values.swiftUsername && { username: values.swiftUsername }),
+  ...(values.swiftPassword && { password: values.swiftPassword }),
+  ...(values.swiftPrefix && { prefix: values.swiftPrefix }),
+  ...(values.tenant && { tenant: values.tenant }),
+  ...(values.tenantId && { tenantId: values.tenantId }),
+  ...(values.domain && { domain: values.domain }),
+  ...(values.domainId && { domainId: values.domainId }),
+  ...(values.tenantDomain && { tenantDomain: values.tenantDomain }),
+  ...(values.tenantDomainId && { tenantDomainId: values.tenantDomainId }),
+});
+
+const buildFilesystemPayload = (values: EditTargetFormValues) => ({
+  path: values.path,
+  ...(values.linkMethod && {
+    linkMethod: values.linkMethod as FilesystemTargetLinkMethod,
+  }),
 });
 
 const EditTargetForm: FC<EditTargetFormProps> = ({ target }) => {
@@ -74,42 +135,43 @@ const EditTargetForm: FC<EditTargetFormProps> = ({ target }) => {
   const { editPublicationTargetQuery } = useEditPublicationTarget();
   const { mutateAsync: editTarget } = editPublicationTargetQuery;
 
-  const handleSubmit = async (values: ReturnType<typeof getInitialValues>) => {
-    try {
-      await editTarget({
-        name: target.name,
-        displayName: values.displayName,
-        s3: {
-          ...(values.region && { region: values.region }),
-          bucket: values.bucket,
-          awsAccessKeyId: values.awsAccessKeyId,
-          awsSecretAccessKey: values.awsSecretAccessKey,
-          ...(values.endpoint && { endpoint: values.endpoint }),
-          ...(values.prefix && { prefix: values.prefix }),
-          ...(values.acl && { acl: values.acl }),
-          ...(values.storageClass && { storageClass: values.storageClass }),
-          ...(values.encryptionMethod && {
-            encryptionMethod: values.encryptionMethod,
-          }),
-          disableMultiDel: values.disableMultiDel,
-          forceSigV2: values.forceSigV2,
-        },
-      });
-      closeForm();
-
-      notify.success({
-        title: "Publication target edited",
-        message: `You have successfully edited ${values.displayName}`,
-      });
-    } catch (error) {
-      debug(error);
-    }
-  };
-
-  const formik = useFormik({
+  const targetType = getTargetType(target);
+
+  const formik = useFormik<EditTargetFormValues>({
     initialValues: getInitialValues(target),
     validationSchema: VALIDATION_SCHEMA,
-    onSubmit: handleSubmit,
+    onSubmit: async (values) => {
+      try {
+        if (targetType === "s3") {
+          await editTarget({
+            name: target.name,
+            displayName: values.displayName,
+            s3: buildS3Payload(values),
+          });
+        } else if (targetType === "swift") {
+          await editTarget({
+            name: target.name,
+            displayName: values.displayName,
+            swift: buildSwiftPayload(values),
+          });
+        } else {
+          await editTarget({
+            name: target.name,
+            displayName: values.displayName,
+            filesystem: buildFilesystemPayload(values),
+          });
+        }
+
+        closeForm();
+
+        notify.success({
+          title: "Publication target edited",
+          message: `You have successfully edited ${values.displayName}`,
+        });
+      } catch (error) {
+        debug(error);
+      }
+    },
   });
 
   return (
@@ -122,79 +184,175 @@ const EditTargetForm: FC<EditTargetFormProps> = ({ target }) => {
         {...formik.getFieldProps("displayName")}
       />
       <ReadOnlyField
-        label="Region"
-        required
-        tooltipMessage="The region cannot be changed after the target has been created. To use a different region, create a new publication target."
-        {...formik.getFieldProps("region")}
-      />
-      <ReadOnlyField
-        label="Bucket name"
-        required
-        tooltipMessage="The bucket name cannot be changed after the target has been created. To use a different bucket, create a new publication target."
-        {...formik.getFieldProps("bucket")}
-      />
-      <ReadOnlyField
-        label="Endpoint"
-        tooltipMessage="The endpoint cannot be changed after the target has been created. To use a different endpoint, create a new publication target."
-        {...formik.getFieldProps("endpoint")}
-      />
-      <Input
-        type="text"
-        label="AWS access key ID"
-        required
-        error={getFormikError(formik, "awsAccessKeyId")}
-        {...formik.getFieldProps("awsAccessKeyId")}
-      />
-      <Input
-        type="text"
-        label="AWS secret access key"
-        required
-        error={getFormikError(formik, "awsSecretAccessKey")}
-        {...formik.getFieldProps("awsSecretAccessKey")}
-      />
-      <ReadOnlyField
-        label="Prefix"
-        tooltipMessage="The prefix cannot be changed after the target has been created. To use a different prefix, create a new publication target."
-        {...formik.getFieldProps("prefix")}
-      />
-      <Input
-        type="text"
-        label="ACL"
-        error={getFormikError(formik, "acl")}
-        {...formik.getFieldProps("acl")}
-      />
-      <Input
-        type="text"
-        label="Storage class"
-        error={getFormikError(formik, "storageClass")}
-        {...formik.getFieldProps("storageClass")}
-      />
-      <Input
-        type="text"
-        label="Encryption method"
-        error={getFormikError(formik, "encryptionMethod")}
-        {...formik.getFieldProps("encryptionMethod")}
-      />
-      <CheckboxInput
-        label="Disable MultiDel"
-        checked={formik.values.disableMultiDel}
-        onChange={(e) =>
-          formik.setFieldValue(
-            "disableMultiDel",
-            (e.target as HTMLInputElement).checked,
-          )
-        }
-      />
-      <CheckboxInput
-        label="Force AWS SIGv2 (disables SIGv4)"
-        checked={formik.values.forceSigV2}
-        onChange={(e) =>
-          formik.setFieldValue(
-            "forceSigV2",
-            (e.target as HTMLInputElement).checked,
-          )
-        }
+        label="Type"
+        value={TARGET_TYPE_LABELS[targetType]}
+        tooltipMessage="The type cannot be changed after the target has been created. To use a different type, create a new publication target."
       />
+
+      {targetType === "s3" && (
+        <>
+          <ReadOnlyField
+            label="Region"
+            tooltipMessage="The region cannot be changed after the target has been created. To use a different region, create a new publication target."
+            {...formik.getFieldProps("region")}
+          />
+          <ReadOnlyField
+            label="Bucket name"
+            tooltipMessage="The bucket name cannot be changed after the target has been created. To use a different bucket, create a new publication target."
+            {...formik.getFieldProps("bucket")}
+          />
+          <ReadOnlyField
+            label="Endpoint"
+            tooltipMessage="The endpoint cannot be changed after the target has been created. To use a different endpoint, create a new publication target."
+            {...formik.getFieldProps("endpoint")}
+          />
+          <Input
+            type="text"
+            label="AWS access key ID"
+            help="Leave blank to keep current value"
+            error={getFormikError(formik, "awsAccessKeyId")}
+            {...formik.getFieldProps("awsAccessKeyId")}
+          />
+          <Input
+            type="text"
+            label="AWS secret access key"
+            help="Leave blank to keep current value"
+            error={getFormikError(formik, "awsSecretAccessKey")}
+            {...formik.getFieldProps("awsSecretAccessKey")}
+          />
+          <ReadOnlyField
+            label="Prefix"
+            tooltipMessage="The prefix cannot be changed after the target has been created. To use a different prefix, create a new publication target."
+            {...formik.getFieldProps("s3Prefix")}
+          />
+          <Input
+            type="text"
+            label="ACL"
+            error={getFormikError(formik, "acl")}
+            {...formik.getFieldProps("acl")}
+          />
+          <Input
+            type="text"
+            label="Storage class"
+            error={getFormikError(formik, "storageClass")}
+            {...formik.getFieldProps("storageClass")}
+          />
+          <Input
+            type="text"
+            label="Encryption method"
+            error={getFormikError(formik, "encryptionMethod")}
+            {...formik.getFieldProps("encryptionMethod")}
+          />
+          <CheckboxInput
+            label="Disable MultiDel"
+            checked={formik.values.disableMultiDel}
+            onChange={(e) =>
+              formik.setFieldValue(
+                "disableMultiDel",
+                (e.target as HTMLInputElement).checked,
+              )
+            }
+          />
+          <CheckboxInput
+            label="Force AWS SIGv2 (disables SIGv4)"
+            checked={formik.values.forceSigV2}
+            onChange={(e) =>
+              formik.setFieldValue(
+                "forceSigV2",
+                (e.target as HTMLInputElement).checked,
+              )
+            }
+          />
+        </>
+      )}
+
+      {targetType === "swift" && (
+        <>
+          <ReadOnlyField
+            label="Container"
+            tooltipMessage="The container cannot be changed after the target has been created. To use a different container, create a new publication target."
+            {...formik.getFieldProps("container")}
+          />
+          <Input
+            type="text"
+            label="Username"
+            help="Leave blank to keep current value"
+            error={getFormikError(formik, "swiftUsername")}
+            {...formik.getFieldProps("swiftUsername")}
+          />
+          <Input
+            type="password"
+            label="Password"
+            help="Leave blank to keep current value"
+            error={getFormikError(formik, "swiftPassword")}
+            {...formik.getFieldProps("swiftPassword")}
+          />
+          <ReadOnlyField
+            label="Auth URL"
+            tooltipMessage="The auth URL cannot be changed after the target has been created. To use a different auth URL, create a new publication target."
+            {...formik.getFieldProps("authUrl")}
+          />
+          <Input
+            type="text"
+            label="Prefix"
+            error={getFormikError(formik, "swiftPrefix")}
+            {...formik.getFieldProps("swiftPrefix")}
+          />
+          <Input
+            type="text"
+            label="Tenant"
+            error={getFormikError(formik, "tenant")}
+            {...formik.getFieldProps("tenant")}
+          />
+          <Input
+            type="text"
+            label="Tenant ID"
+            error={getFormikError(formik, "tenantId")}
+            {...formik.getFieldProps("tenantId")}
+          />
+          <Input
+            type="text"
+            label="Domain"
+            error={getFormikError(formik, "domain")}
+            {...formik.getFieldProps("domain")}
+          />
+          <Input
+            type="text"
+            label="Domain ID"
+            error={getFormikError(formik, "domainId")}
+            {...formik.getFieldProps("domainId")}
+          />
+          <Input
+            type="text"
+            label="Tenant domain"
+            error={getFormikError(formik, "tenantDomain")}
+            {...formik.getFieldProps("tenantDomain")}
+          />
+          <Input
+            type="text"
+            label="Tenant domain ID"
+            error={getFormikError(formik, "tenantDomainId")}
+            {...formik.getFieldProps("tenantDomainId")}
+          />
+        </>
+      )}
+
+      {targetType === "filesystem" && (
+        <>
+          <ReadOnlyField
+            label="Path"
+            tooltipMessage="The path cannot be changed after the target has been created. To use a different path, create a new publication target."
+            {...formik.getFieldProps("path")}
+          />
+          <Select
+            label="Link method"
+            options={LINK_METHOD_OPTIONS}
+            error={getFormikError(formik, "linkMethod")}
+            {...formik.getFieldProps("linkMethod")}
+          />
+        </>
+      )}
+
       <SidePanelFormButtons
         submitButtonDisabled={formik.isSubmitting}
         submitButtonText="Save changes"
@@ -207,3 +365,4 @@ const EditTargetForm: FC<EditTargetFormProps> = ({ target }) => {
 };
 
 export default EditTargetForm;
+
diff --git a/src/features/publication-targets/components/PublicationTargetContainer/PublicationTargetContainer.test.tsx b/src/features/publication-targets/components/PublicationTargetContainer/PublicationTargetContainer.test.tsx
index 23373061a..a080bda69 100644
--- a/src/features/publication-targets/components/PublicationTargetContainer/PublicationTargetContainer.test.tsx
+++ b/src/features/publication-targets/components/PublicationTargetContainer/PublicationTargetContainer.test.tsx
@@ -18,9 +18,9 @@ describe("PublicationTargetContainer", () => {
     await expectLoadingState();
   });
 
-  it("renders the empty state when there are no targets", async () => {
+  it("renders an empty table when there are no targets", async () => {
     server.use(
-      http.get(`${API_URL_DEB_ARCHIVE}v1/publicationTargets`, () =>
+      http.get(`${API_URL_DEB_ARCHIVE}publicationTargets`, () =>
         HttpResponse.json({ publicationTargets: [] }),
       ),
     );
@@ -28,24 +28,8 @@ describe("PublicationTargetContainer", () => {
     renderWithProviders(<PublicationTargetContainer />);
     await expectLoadingState();
 
-    expect(
-      screen.getByText(/you don't have any publication targets yet/i),
-    ).toBeInTheDocument();
-  });
-
-  it("renders the Add publication target CTA button in the empty state", async () => {
-    server.use(
-      http.get(`${API_URL_DEB_ARCHIVE}v1/publicationTargets`, () =>
-        HttpResponse.json({ publicationTargets: [] }),
-      ),
-    );
-
-    renderWithProviders(<PublicationTargetContainer />);
-    await expectLoadingState();
-
-    expect(
-      screen.getByRole("button", { name: /add publication target/i }),
-    ).toBeInTheDocument();
+    expect(screen.getByRole("table")).toBeInTheDocument();
+    expect(screen.queryAllByRole("row")).toHaveLength(1); // header row only
   });
 
   it("renders the publication targets list when targets are present", async () => {
diff --git a/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.test.tsx b/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.test.tsx
index 3f4b4a7a2..6c1f7098c 100644
--- a/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.test.tsx
+++ b/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.test.tsx
@@ -59,6 +59,14 @@ describe("PublicationTargetList", () => {
     expect(screen.getByText("Swift")).toBeInTheDocument();
   });
 
+  it("renders Filesystem type label for Filesystem targets", () => {
+    renderWithProviders(
+      <PublicationTargetList targets={publicationTargets} />,
+    );
+
+    expect(screen.getByText("Filesystem")).toBeInTheDocument();
+  });
+
   it("renders the publication count for a target with publications", () => {
     renderWithProviders(<PublicationTargetList targets={publicationTargets} />);
 
@@ -69,8 +77,8 @@ describe("PublicationTargetList", () => {
   it("renders NoData placeholder when a target has no publications", () => {
     renderWithProviders(<PublicationTargetList targets={publicationTargets} />);
 
-    // staging-s3-eu-west and swift-internal each have 0 publications → two NoData cells
-    expect(screen.getAllByText(NO_DATA_TEXT)).toHaveLength(2);
+    // staging-s3-eu-west, swift-internal, and local-fs-archive each have 0 publications → three NoData cells
+    expect(screen.getAllByText(NO_DATA_TEXT)).toHaveLength(3);
   });
 
   it("renders singular 'publication' when a target has exactly one publication", () => {
diff --git a/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.tsx b/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.tsx
index 415adbe0c..8bb061d4a 100644
--- a/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.tsx
+++ b/src/features/publication-targets/components/PublicationTargetList/PublicationTargetList.tsx
@@ -51,6 +51,7 @@ const PublicationsCountCell: FC<PublicationsCountCellProps> = ({
 const getTargetType = (target: PublicationTarget): string => {
   if (target.s3) return "S3";
   if (target.swift) return "Swift";
+  if (target.filesystem) return "Filesystem";
   return "Unknown";
 };
 
diff --git a/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetForm.test.tsx b/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetForm.test.tsx
index e05dabd93..cf3ec72b3 100644
--- a/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetForm.test.tsx
+++ b/src/features/publication-targets/components/RemoveTargetForm/RemoveTargetForm.test.tsx
@@ -141,9 +141,8 @@ describe("RemoveTargetForm", () => {
 
   it("submits the deletion after typing the confirmation text", async () => {
     server.use(
-      http.delete(
-        `${API_URL_DEB_ARCHIVE}v1/publicationTargets/:id`,
-        () => new HttpResponse(null, { status: 204 }),
+      http.delete(`${API_URL_DEB_ARCHIVE}publicationTargets/:id`, () =>
+        new HttpResponse(null, { status: 204 }),
       ),
     );
 
@@ -175,7 +174,7 @@ describe("RemoveTargetForm", () => {
 
   it("shows an error notification when deletion fails", async () => {
     server.use(
-      http.delete(`${API_URL_DEB_ARCHIVE}v1/publicationTargets/:id`, () =>
+      http.delete(`${API_URL_DEB_ARCHIVE}publicationTargets/:id`, () =>
         HttpResponse.json({ message: "deletion failed" }, { status: 500 }),
       ),
     );
diff --git a/src/features/publication-targets/components/TargetDetails/TargetDetails.test.tsx b/src/features/publication-targets/components/TargetDetails/TargetDetails.test.tsx
index 0dffc10e8..90df3ce1c 100644
--- a/src/features/publication-targets/components/TargetDetails/TargetDetails.test.tsx
+++ b/src/features/publication-targets/components/TargetDetails/TargetDetails.test.tsx
@@ -15,6 +15,8 @@ vi.mock("../../api/useGetPublicationsByTarget", () => ({
 import useGetPublicationsByTarget from "../../api/useGetPublicationsByTarget";
 
 const [targetWithPublications, targetWithoutPublications] = publicationTargets;
+const swiftMock = publicationTargets[2];
+const filesystemMock = publicationTargets[3];
 const [firstPublication] = publications;
 
 if (
@@ -24,6 +26,8 @@ if (
 ) {
   throw new Error("Test data is missing required properties");
 }
+if (!swiftMock?.swift) throw new Error("Missing swift mock target");
+if (!filesystemMock?.filesystem) throw new Error("Missing filesystem mock target");
 
 const s3WithPubs = targetWithPublications.s3;
 const s3WithoutPubs = targetWithoutPublications.s3;
@@ -220,21 +224,76 @@ describe("TargetDetails", () => {
   });
 
   describe("Swift target", () => {
-    it("renders DETAILS without S3 fields for a Swift target", () => {
+    it("renders container and authUrl info items", () => {
       (useGetPublicationsByTarget as Mock).mockReturnValue({
         publications: [],
         isGettingPublications: false,
       });
 
-      const swiftTarget = publicationTargets[2];
-      if (!swiftTarget) throw new Error("Missing swift mock target");
+      const { container } = renderWithProviders(
+        <TargetDetails target={swiftMock} />,
+      );
+
+      expect(container).toHaveInfoItem("Container", swiftMock.swift!.container);
+      expect(container).toHaveInfoItem("Auth URL", swiftMock.swift!.authUrl);
+    });
+
+    it("renders optional tenant field when present", () => {
+      (useGetPublicationsByTarget as Mock).mockReturnValue({
+        publications: [],
+        isGettingPublications: false,
+      });
 
       const { container } = renderWithProviders(
-        <TargetDetails target={swiftTarget} />,
+        <TargetDetails target={swiftMock} />,
+      );
+
+      expect(container).toHaveInfoItem("Tenant", swiftMock.swift!.tenant ?? "");
+    });
+
+    it("does not render S3-specific fields", () => {
+      (useGetPublicationsByTarget as Mock).mockReturnValue({
+        publications: [],
+        isGettingPublications: false,
+      });
+
+      const { container } = renderWithProviders(
+        <TargetDetails target={swiftMock} />,
+      );
+
+      expect(container.textContent).not.toContain("Region");
+      expect(container.textContent).not.toContain("Bucket Name");
+    });
+  });
+
+  describe("Filesystem target", () => {
+    it("renders path and link method info items", () => {
+      (useGetPublicationsByTarget as Mock).mockReturnValue({
+        publications: [],
+        isGettingPublications: false,
+      });
+
+      const { container } = renderWithProviders(
+        <TargetDetails target={filesystemMock} />,
+      );
+
+      expect(container).toHaveInfoItem("Path", filesystemMock.filesystem!.path);
+      expect(container).toHaveInfoItem(
+        "Link method",
+        filesystemMock.filesystem!.linkMethod ?? "",
+      );
+    });
+
+    it("does not render S3-specific fields", () => {
+      (useGetPublicationsByTarget as Mock).mockReturnValue({
+        publications: [],
+        isGettingPublications: false,
+      });
+
+      const { container } = renderWithProviders(
+        <TargetDetails target={filesystemMock} />,
       );
 
-      expect(screen.getByText("Details")).toBeInTheDocument();
-      // S3-specific InfoGrid items should not be present
       expect(container.textContent).not.toContain("Region");
       expect(container.textContent).not.toContain("Bucket Name");
     });
diff --git a/src/features/publication-targets/components/TargetDetails/TargetDetails.tsx b/src/features/publication-targets/components/TargetDetails/TargetDetails.tsx
index bf8686942..7f64ed59b 100644
--- a/src/features/publication-targets/components/TargetDetails/TargetDetails.tsx
+++ b/src/features/publication-targets/components/TargetDetails/TargetDetails.tsx
@@ -9,14 +9,14 @@ import { useBoolean } from "usehooks-ts";
 import type { PublicationTarget } from "../../types";
 import RemoveTargetForm from "../RemoveTargetForm";
 import Blocks from "@/components/layout/Blocks/Blocks";
-import { AssociatedPublicationsList } from "@/features/publications";
+import { getTargetType, TARGET_TYPE_LABELS } from "../EditTargetForm/EditTargetForm";
 
 interface TargetDetailsProps {
   readonly target: PublicationTarget;
 }
 
 const TargetDetails: FC<TargetDetailsProps> = ({ target }) => {
-  const { createPageParamsSetter, createSidePathPusher } = usePageParams();
+  const { createSidePathPusher } = usePageParams();
   const { publications, isGettingPublications } = useGetPublicationsByTarget(
     target.publicationTargetId,
   );
@@ -46,6 +46,27 @@ const TargetDetails: FC<TargetDetailsProps> = ({ target }) => {
       }
     : null;
 
+  const swiftFields = target.swift
+    ? {
+        container: target.swift.container,
+        authUrl: target.swift.authUrl,
+        prefix: target.swift.prefix,
+        tenant: target.swift.tenant,
+        tenantId: target.swift.tenantId,
+        domain: target.swift.domain,
+        domainId: target.swift.domainId,
+        tenantDomain: target.swift.tenantDomain,
+        tenantDomainId: target.swift.tenantDomainId,
+      }
+    : null;
+
+  const filesystemFields = target.filesystem
+    ? {
+        path: target.filesystem.path,
+        linkMethod: target.filesystem.linkMethod,
+      }
+    : null;
+
   return (
     <>
       <div className="p-segmented-control u-sv2">
@@ -69,9 +90,14 @@ const TargetDetails: FC<TargetDetailsProps> = ({ target }) => {
         </Button>
       </div>
       <Blocks dense>
-        <Blocks.Item title="Details">
+        <Blocks.Item title="General">
           <InfoGrid dense>
-            <InfoGrid.Item label="Name" large value={target.displayName} />
+            <InfoGrid.Item label="Name" value={target.displayName} />
+            <InfoGrid.Item label="Type" value={TARGET_TYPE_LABELS[getTargetType(target)]} />
+          </InfoGrid>
+        </Blocks.Item>
+        <Blocks.Item title="Details">
+        <InfoGrid dense>
 
             {s3Fields && (
               <>
@@ -97,6 +123,28 @@ const TargetDetails: FC<TargetDetailsProps> = ({ target }) => {
                 />
               </>
             )}
+
+            {swiftFields && (
+              <>
+                <InfoGrid.Item label="Auth URL" large value={swiftFields.authUrl} />
+                <InfoGrid.Item label="Container" value={swiftFields.container} />
+                <InfoGrid.Item label="Prefix" value={swiftFields.prefix} />
+                <InfoGrid.Item label="Tenant" value={swiftFields.tenant} />
+                <InfoGrid.Item label="Tenant ID" value={swiftFields.tenantId} />
+                <InfoGrid.Item label="Domain" value={swiftFields.domain} />
+                <InfoGrid.Item label="Domain ID" value={swiftFields.domainId} />
+                <InfoGrid.Item label="Tenant domain" value={swiftFields.tenantDomain} />
+                <InfoGrid.Item label="Tenant domain ID" value={swiftFields.tenantDomainId} />
+              </>
+            )}
+
+            {filesystemFields && (
+              <>
+                <InfoGrid.Item label="Path" large value={filesystemFields.path} />
+                <InfoGrid.Item label="Link method" value={filesystemFields.linkMethod} />
+              </>
+            )}
+
           </InfoGrid>
         </Blocks.Item>
 
diff --git a/src/features/publication-targets/components/TargetTypeFields/FilesystemFields.tsx b/src/features/publication-targets/components/TargetTypeFields/FilesystemFields.tsx
new file mode 100644
index 000000000..eafb2c87a
--- /dev/null
+++ b/src/features/publication-targets/components/TargetTypeFields/FilesystemFields.tsx
@@ -0,0 +1,32 @@
+import { getFormikError } from "@/utils/formikErrors";
+import { Input, Select } from "@canonical/react-components";
+import type { FormikProps } from "formik";
+import type { FC } from "react";
+import type { AddPublicationTargetFormValues } from "../AddPublicationTargetForm/constants";
+import styles from "./TargetTypeFields.module.scss";
+import { LINK_METHOD_OPTIONS } from "../../constants";
+
+interface FilesystemFieldsProps {
+  readonly formik: FormikProps<AddPublicationTargetFormValues>;
+}
+
+const FilesystemFields: FC<FilesystemFieldsProps> = ({ formik }) => (
+  <div className={styles.typeFieldsIndent}>
+    <Input
+      type="text"
+      label="Path"
+      help={!getFormikError(formik, "path") ? "File system path starting with /" : undefined}
+      required
+      error={getFormikError(formik, "path")}
+      {...formik.getFieldProps("path")}
+    />
+    <Select
+      label="Link method"
+      options={LINK_METHOD_OPTIONS}
+      error={getFormikError(formik, "linkMethod")}
+      {...formik.getFieldProps("linkMethod")}
+    />
+  </div>
+);
+
+export default FilesystemFields;
diff --git a/src/features/publication-targets/components/TargetTypeFields/S3Fields.tsx b/src/features/publication-targets/components/TargetTypeFields/S3Fields.tsx
new file mode 100644
index 000000000..c349bcfab
--- /dev/null
+++ b/src/features/publication-targets/components/TargetTypeFields/S3Fields.tsx
@@ -0,0 +1,95 @@
+import { getFormikError } from "@/utils/formikErrors";
+import { CheckboxInput, Input } from "@canonical/react-components";
+import type { FormikProps } from "formik";
+import type { FC } from "react";
+import type { AddPublicationTargetFormValues } from "../AddPublicationTargetForm/constants";
+import styles from "./TargetTypeFields.module.scss";
+
+interface S3FieldsProps {
+  readonly formik: FormikProps<AddPublicationTargetFormValues>;
+}
+
+const S3Fields: FC<S3FieldsProps> = ({ formik }) => (
+  <div className={styles.typeFieldsIndent}>
+    <Input
+      type="text"
+      label="Region"
+      required
+      error={getFormikError(formik, "region")}
+      {...formik.getFieldProps("region")}
+    />
+    <Input
+      type="text"
+      label="Bucket name"
+      required
+      error={getFormikError(formik, "bucket")}
+      {...formik.getFieldProps("bucket")}
+    />
+    <Input
+      type="text"
+      label="Endpoint"
+      error={getFormikError(formik, "endpoint")}
+      {...formik.getFieldProps("endpoint")}
+    />
+    <Input
+      type="text"
+      label="AWS access key ID"
+      required
+      error={getFormikError(formik, "awsAccessKeyId")}
+      {...formik.getFieldProps("awsAccessKeyId")}
+    />
+    <Input
+      type="text"
+      label="AWS secret access key"
+      required
+      error={getFormikError(formik, "awsSecretAccessKey")}
+      {...formik.getFieldProps("awsSecretAccessKey")}
+    />
+    <Input
+      type="text"
+      label="Prefix"
+      error={getFormikError(formik, "s3Prefix")}
+      {...formik.getFieldProps("s3Prefix")}
+    />
+    <Input
+      type="text"
+      label="ACL"
+      error={getFormikError(formik, "acl")}
+      {...formik.getFieldProps("acl")}
+    />
+    <Input
+      type="text"
+      label="Storage class"
+      error={getFormikError(formik, "storageClass")}
+      {...formik.getFieldProps("storageClass")}
+    />
+    <Input
+      type="text"
+      label="Encryption method"
+      error={getFormikError(formik, "encryptionMethod")}
+      {...formik.getFieldProps("encryptionMethod")}
+    />
+    <CheckboxInput
+      label="Disable MultiDel"
+      checked={formik.values.disableMultiDel}
+      onChange={(e) =>
+        formik.setFieldValue(
+          "disableMultiDel",
+          (e.target as HTMLInputElement).checked,
+        )
+      }
+    />
+    <CheckboxInput
+      label="Force AWS SIGv2 (disables SIGv4)"
+      checked={formik.values.forceSigV2}
+      onChange={(e) =>
+        formik.setFieldValue(
+          "forceSigV2",
+          (e.target as HTMLInputElement).checked,
+        )
+      }
+    />
+  </div>
+);
+
+export default S3Fields;
diff --git a/src/features/publication-targets/components/TargetTypeFields/SwiftFields.tsx b/src/features/publication-targets/components/TargetTypeFields/SwiftFields.tsx
new file mode 100644
index 000000000..e2c832cea
--- /dev/null
+++ b/src/features/publication-targets/components/TargetTypeFields/SwiftFields.tsx
@@ -0,0 +1,87 @@
+import { getFormikError } from "@/utils/formikErrors";
+import { Input } from "@canonical/react-components";
+import type { FormikProps } from "formik";
+import type { FC } from "react";
+import type { AddPublicationTargetFormValues } from "../AddPublicationTargetForm/constants";
+import styles from "./TargetTypeFields.module.scss";
+
+interface SwiftFieldsProps {
+  readonly formik: FormikProps<AddPublicationTargetFormValues>;
+}
+
+const SwiftFields: FC<SwiftFieldsProps> = ({ formik }) => (
+  <div className={styles.typeFieldsIndent}>
+    <Input
+      type="text"
+      label="Container"
+      required
+      error={getFormikError(formik, "container")}
+      {...formik.getFieldProps("container")}
+    />
+    <Input
+      type="text"
+      label="Username"
+      required
+      error={getFormikError(formik, "swiftUsername")}
+      {...formik.getFieldProps("swiftUsername")}
+    />
+    <Input
+      type="password"
+      label="Password"
+      required
+      error={getFormikError(formik, "swiftPassword")}
+      {...formik.getFieldProps("swiftPassword")}
+    />
+    <Input
+      type="text"
+      label="Auth URL"
+      required
+      error={getFormikError(formik, "authUrl")}
+      {...formik.getFieldProps("authUrl")}
+    />
+    <Input
+      type="text"
+      label="Prefix"
+      error={getFormikError(formik, "swiftPrefix")}
+      {...formik.getFieldProps("swiftPrefix")}
+    />
+    <Input
+      type="text"
+      label="Tenant"
+      error={getFormikError(formik, "tenant")}
+      {...formik.getFieldProps("tenant")}
+    />
+    <Input
+      type="text"
+      label="Tenant ID"
+      error={getFormikError(formik, "tenantId")}
+      {...formik.getFieldProps("tenantId")}
+    />
+    <Input
+      type="text"
+      label="OpenStack domain name"
+      error={getFormikError(formik, "domain")}
+      {...formik.getFieldProps("domain")}
+    />
+    <Input
+      type="text"
+      label="OpenStack domain ID"
+      error={getFormikError(formik, "domainId")}
+      {...formik.getFieldProps("domainId")}
+    />
+    <Input
+      type="text"
+      label="OpenStack tenant domain"
+      error={getFormikError(formik, "tenantDomain")}
+      {...formik.getFieldProps("tenantDomain")}
+    />
+    <Input
+      type="text"
+      label="OpenStack tenant domain ID"
+      error={getFormikError(formik, "tenantDomainId")}
+      {...formik.getFieldProps("tenantDomainId")}
+    />
+  </div>
+);
+
+export default SwiftFields;
diff --git a/src/features/publication-targets/components/TargetTypeFields/TargetTypeFields.module.scss b/src/features/publication-targets/components/TargetTypeFields/TargetTypeFields.module.scss
new file mode 100644
index 000000000..72c4ba8f6
--- /dev/null
+++ b/src/features/publication-targets/components/TargetTypeFields/TargetTypeFields.module.scss
@@ -0,0 +1,5 @@
+.typeFieldsIndent {
+  border-left: 1px solid var(--vf-color-border-default, #cdcdcd);
+  padding-left: 1rem;
+  margin-top: 0.5rem;
+}
diff --git a/src/features/publication-targets/components/TargetTypeFields/index.ts b/src/features/publication-targets/components/TargetTypeFields/index.ts
new file mode 100644
index 000000000..7f4064de7
--- /dev/null
+++ b/src/features/publication-targets/components/TargetTypeFields/index.ts
@@ -0,0 +1,3 @@
+export { default as FilesystemFields } from "./FilesystemFields";
+export { default as S3Fields } from "./S3Fields";
+export { default as SwiftFields } from "./SwiftFields";
diff --git a/src/features/publication-targets/constants.ts b/src/features/publication-targets/constants.ts
new file mode 100644
index 000000000..2cbb627ce
--- /dev/null
+++ b/src/features/publication-targets/constants.ts
@@ -0,0 +1,79 @@
+import type { FilesystemTargetLinkMethod } from "@canonical/landscape-openapi";
+import * as Yup from "yup";
+
+export interface EditTargetFormValues {
+  displayName: string;
+  // S3
+  region: string;
+  bucket: string;
+  endpoint: string;
+  awsAccessKeyId: string;
+  awsSecretAccessKey: string;
+  s3Prefix: string;
+  acl: string;
+  storageClass: string;
+  encryptionMethod: string;
+  disableMultiDel: boolean;
+  forceSigV2: boolean;
+  // Swift
+  container: string;
+  swiftUsername: string;
+  swiftPassword: string;
+  swiftPrefix: string;
+  authUrl: string;
+  tenant: string;
+  tenantId: string;
+  domain: string;
+  domainId: string;
+  tenantDomain: string;
+  tenantDomainId: string;
+  // Filesystem
+  path: string;
+  linkMethod: FilesystemTargetLinkMethod | "";
+}
+
+export const EMPTY_VALUES: EditTargetFormValues = {
+  displayName: "",
+  region: "",
+  bucket: "",
+  endpoint: "",
+  awsAccessKeyId: "",
+  awsSecretAccessKey: "",
+  s3Prefix: "",
+  acl: "",
+  storageClass: "",
+  encryptionMethod: "",
+  disableMultiDel: false,
+  forceSigV2: false,
+  container: "",
+  swiftUsername: "",
+  swiftPassword: "",
+  swiftPrefix: "",
+  authUrl: "",
+  tenant: "",
+  tenantId: "",
+  domain: "",
+  domainId: "",
+  tenantDomain: "",
+  tenantDomainId: "",
+  path: "",
+  linkMethod: "",
+};
+
+export const VALIDATION_SCHEMA = Yup.object().shape({
+  displayName: Yup.string().required("This field is required"),
+});
+
+export const LINK_METHOD_OPTIONS = [
+  { value: "", label: "Select a link method" },
+  { value: "HARDLINK", label: "Hardlink" },
+  { value: "SYMLINK", label: "Symlink" },
+  { value: "COPY", label: "Copy" },
+];
+
+export const TARGET_TYPE_LABELS: Record<"s3" | "swift" | "filesystem", string> =
+  {
+    s3: "S3",
+    swift: "Swift",
+    filesystem: "Filesystem",
+  };
diff --git a/src/features/publication-targets/index.ts b/src/features/publication-targets/index.ts
index d4a43148f..696434b91 100644
--- a/src/features/publication-targets/index.ts
+++ b/src/features/publication-targets/index.ts
@@ -5,6 +5,8 @@ export { default as PublicationTargetContainer } from "./components/PublicationT
 export { default as PublicationTargetList } from "./components/PublicationTargetList";
 export { default as TargetDetails } from "./components/TargetDetails/TargetDetails";
 export type {
+  FilesystemTarget,
+  FilesystemTargetLinkMethod,
   Publication,
   PublicationTarget,
   S3Target,
diff --git a/src/features/publications/components/AssociatedPublicationsList/AssociatedPublicationsList.test.tsx b/src/features/publications/components/AssociatedPublicationsList/AssociatedPublicationsList.test.tsx
index 873b923b3..559dbcc2b 100644
--- a/src/features/publications/components/AssociatedPublicationsList/AssociatedPublicationsList.test.tsx
+++ b/src/features/publications/components/AssociatedPublicationsList/AssociatedPublicationsList.test.tsx
@@ -6,6 +6,43 @@ import type { Publication } from "../../../publication-targets/types";
 import { describe, expect, it } from "vitest";
 import AssociatedPublicationsList from "./AssociatedPublicationsList";
 
+const pubWithoutPublishTime: Publication = {
+  name: "publications/no-date-id",
+  publicationId: "no-date-id",
+  displayName: "no-date publication",
+  label: "no date",
+  publicationTarget: "publicationTargets/test",
+  source: "mirrors/no-date-mirror",
+  distribution: "jammy",
+  origin: "",
+  architectures: [],
+  acquireByHash: false,
+  butAutomaticUpgrades: false,
+  notAutomatic: false,
+  multiDist: false,
+  skipBz2: false,
+  skipContents: false,
+};
+
+const pubWithUnknownSource: Publication = {
+  name: "publications/unknown-source-id",
+  publicationId: "unknown-source-id",
+  displayName: "unknown source pub",
+  label: "unknown",
+  publicationTarget: "publicationTargets/test",
+  source: "ppa/some-ppa",
+  distribution: "jammy",
+  origin: "",
+  architectures: [],
+  acquireByHash: false,
+  butAutomaticUpgrades: false,
+  notAutomatic: false,
+  multiDist: false,
+  skipBz2: false,
+  skipContents: false,
+  publishTime: new Date("March 12, 2026"),
+};
+
 describe("AssociatedPublicationsList", () => {
   const user = userEvent.setup();
 
@@ -239,4 +276,71 @@ describe("AssociatedPublicationsList", () => {
       expect(screen.queryByText(secondPub.source)).not.toBeInTheDocument();
     });
   });
-});
+
+  describe("Date Published column", () => {
+    it("renders formatted date when publishTime is present", () => {
+      const [firstPub] = publications;
+      if (!firstPub) throw new Error("Missing mock publication");
+
+      renderWithProviders(<PublicationsTable publications={[firstPub]} />);
+
+      expect(screen.getByText(/Mar 12, 2026/)).toBeInTheDocument();
+    });
+
+    it("renders NoData when publishTime is absent", () => {
+      renderWithProviders(
+        <PublicationsTable publications={[pubWithoutPublishTime]} />,
+      );
+
+      expect(screen.getByText("---")).toBeInTheDocument();
+    });
+  });
+
+  describe("showSources prop", () => {
+    it("hides Source column when showSources is false", () => {
+      renderWithProviders(
+        <PublicationsTable publications={publications} showSources={false} />,
+      );
+
+      expect(screen.queryByText("Source")).not.toBeInTheDocument();
+    });
+
+    it("shows Source column by default", () => {
+      renderWithProviders(<PublicationsTable publications={publications} />);
+
+      expect(screen.getByText("Source")).toBeInTheDocument();
+    });
+
+    it("renders raw source text when source type is unknown", () => {
+      renderWithProviders(
+        <PublicationsTable publications={[pubWithUnknownSource]} />,
+      );
+
+      expect(screen.getByText("ppa/some-ppa")).toBeInTheDocument();
+    });
+  });
+
+  describe("pagination navigation", () => {
+    it("navigates to page 2 with next button and back with prev button", async () => {
+      const pageSize = 1;
+
+      renderWithProviders(
+        <PublicationsTable publications={publications} pageSize={pageSize} />,
+      );
+
+      const [firstPub, secondPub] = publications;
+      if (!firstPub || !secondPub) throw new Error("Missing mock publications");
+
+      expect(screen.getByText(firstPub.source)).toBeInTheDocument();
+
+      await user.click(screen.getByRole("button", { name: /next page/i }));
+
+      expect(screen.getByText(secondPub.source)).toBeInTheDocument();
+      expect(screen.queryByText(firstPub.source)).not.toBeInTheDocument();
+
+      await user.click(screen.getByRole("button", { name: /previous page/i }));
+
+      expect(screen.getByText(firstPub.source)).toBeInTheDocument();
+    });
+  });
+});
\ No newline at end of file
diff --git a/src/tests/mocks/publicationTargets.ts b/src/tests/mocks/publicationTargets.ts
index 9a4d0671c..dda21c161 100644
--- a/src/tests/mocks/publicationTargets.ts
+++ b/src/tests/mocks/publicationTargets.ts
@@ -43,4 +43,13 @@ export const publicationTargets: PublicationTarget[] = [
       tenant: "landscape",
     },
   },
+  {
+    name: "publicationTargets/dddddddd-0000-0000-0000-000000000004",
+    publicationTargetId: "dddddddd-0000-0000-0000-000000000004",
+    displayName: "local-fs-archive",
+    filesystem: {
+      path: "/srv/landscape/archives",
+      linkMethod: "HARDLINK",
+    },
+  },
 ];
diff --git a/src/tests/server/handlers/publicationTargets.ts b/src/tests/server/handlers/publicationTargets.ts
index 5b4a07ff8..4d6d0419e 100644
--- a/src/tests/server/handlers/publicationTargets.ts
+++ b/src/tests/server/handlers/publicationTargets.ts
@@ -41,6 +41,7 @@ export default [
         ...body,
         ...(body.s3 ? { s3: { ...existing.s3, ...body.s3 } } : {}),
         ...(body.swift ? { swift: { ...existing.swift, ...body.swift } } : {}),
+        ...(body.filesystem ? { filesystem: { ...existing.filesystem, ...body.filesystem } } : {}),
       } as PublicationTarget;
       publicationTargets[idx] = updated;
       return HttpResponse.json(updated);