feat(storage) default storage pool for volume creation [WD-7675]

Signed-off-by: Mason Hu <mason.hu@canonical.com>
canonical · Dec 8, 2023 · 4ac25bc · 4ac25bc
1 parent 225aa1e
commit 4ac25bc
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 6 deletions.
diff --git a/src/pages/storage/StorageVolumes.tsx b/src/pages/storage/StorageVolumes.tsx
@@ -366,6 +366,9 @@ const StorageVolumes: FC = () => {
     return <Loader text="Loading storage volumes..." />;
   }
 
+  const defaultPoolForVolumeCreate =
+    filters.pools.length === 1 ? filters.pools[0] : "";
+
   return volumes.length === 0 ? (
     <EmptyState
       className="empty-state"
@@ -392,7 +395,10 @@ const StorageVolumes: FC = () => {
           <StorageVolumesFilter key={project} volumes={volumes} />
         </div>
         <div>
-          <CreateVolumeBtn project={project} />
+          <CreateVolumeBtn
+            project={project}
+            defaultPool={defaultPoolForVolumeCreate}
+          />
         </div>
       </div>
       <Pagination

diff --git a/src/pages/storage/actions/CreateVolumeBtn.tsx b/src/pages/storage/actions/CreateVolumeBtn.tsx
@@ -4,15 +4,19 @@ import { useNavigate } from "react-router-dom";
 
 interface Props {
   project: string;
+  defaultPool?: string;
   className?: string;
 }
 
-const CreateVolumeBtn: FC<Props> = ({ project, className }) => {
+const CreateVolumeBtn: FC<Props> = ({ project, className, defaultPool }) => {
   const navigate = useNavigate();
 
   const handleAdd = () => {
-    navigate(`/ui/project/${project}/storage/volumes/create
-    `);
+    navigate(
+      `/ui/project/${project}/storage/volumes/create${
+        defaultPool ? `?pool=${defaultPool}` : ""
+      }`,
+    );
   };
 
   return (

diff --git a/src/pages/storage/forms/StorageVolumeCreate.tsx b/src/pages/storage/forms/StorageVolumeCreate.tsx
@@ -7,7 +7,7 @@ import { queryKeys } from "util/queryKeys";
 import SubmitButton from "components/SubmitButton";
 import { createStorageVolume } from "api/storage-pools";
 import NotificationRow from "components/NotificationRow";
-import { useNavigate, useParams } from "react-router-dom";
+import { useNavigate, useParams, useSearchParams } from "react-router-dom";
 import { testDuplicateStorageVolumeName } from "util/storageVolume";
 import BaseLayout from "components/BaseLayout";
 import {
@@ -17,6 +17,7 @@ import {
 import StorageVolumeForm from "pages/storage/forms/StorageVolumeForm";
 import { MAIN_CONFIGURATION } from "pages/storage/forms/StorageVolumeFormMenu";
 import { slugify } from "util/slugify";
+import { POOL } from "../StorageVolumesFilter";
 
 const StorageVolumeCreate: FC = () => {
   const navigate = useNavigate();
@@ -25,6 +26,7 @@ const StorageVolumeCreate: FC = () => {
   const [section, setSection] = useState(slugify(MAIN_CONFIGURATION));
   const controllerState = useState<AbortController | null>(null);
   const { project } = useParams<{ project: string }>();
+  const [searchParams] = useSearchParams();
 
   if (!project) {
     return <>Missing project</>;
@@ -44,7 +46,7 @@ const StorageVolumeCreate: FC = () => {
       type: "custom",
       name: "",
       project: project,
-      pool: "",
+      pool: searchParams.get(POOL) || "",
       size: "GiB",
       isReadOnly: false,
       isCreating: true,