Cross storage class clone /restore

Signed-off-by: Timothy Asir Jeyasingh <tjeyasin@redhat.com>
openshift · Jan 29, 2024 · 21e954f · 21e954f
1 parent a3b2364
commit 21e954f
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 3 deletions.
diff --git a/frontend/.vscode/settings.json b/frontend/.vscode/settings.json
@@ -82,14 +82,20 @@
     }
   ],
   "editor.codeActionsOnSave": {
-    "source.fixAll.eslint": true
+    "source.fixAll.eslint": "explicit"
   },
   "cucumberautocomplete.steps": ["./packages/*/integration-tests/support/step-definitions/*/*.ts"],
   "cucumberautocomplete.strictGherkinCompletion": true,
   "editor.quickSuggestions": {
     "comments": "on",
     "strings": "on",
     "other": "on"
+  },
+  "[javascript][javascriptreact][typescript][typescriptreact]": {
+    "editor.codeActionsOnSave": {
+      "source.organizeImports": "never",
+      "source.sortImports": "never"
+    }
   }
   // TODO support prettier + stylelint
   // "prettier.stylelintIntegration": true,

diff --git a/frontend/packages/console-app/src/components/modals/clone/clone-pvc-modal.tsx b/frontend/packages/console-app/src/components/modals/clone/clone-pvc-modal.tsx
@@ -47,12 +47,14 @@ import {
 } from '@console/internal/module/k8s';
 import { RedExclamationCircleIcon, isCephProvisioner } from '@console/shared';
 import { getRequestedPVCSize } from '@console/shared/src/selectors';
+import { StorageClassDropdown } from '../../../../../../public/components/utils/storage-class-dropdown';
 import { getPVCAccessModes, AccessModeSelector } from '../../access-modes/access-mode';
 
 import './_clone-pvc-modal.scss';
 
 const ClonePVCModal = withHandlePromise((props: ClonePVCModalProps) => {
   const { t } = useTranslation();
+  const [storageClass, setStorageClass] = React.useState('');
   const { close, cancel, resource, handlePromise, errorMessage, inProgress } = props;
   const { name: pvcName, namespace } = resource?.metadata;
   const baseValue = convertToBaseValue(getRequestedPVCSize(resource));
@@ -65,6 +67,9 @@ const ClonePVCModal = withHandlePromise((props: ClonePVCModalProps) => {
   const [requestedUnit, setRequestedUnit] = React.useState(defaultSize[1] || 'Ti');
   const [validSize, setValidSize] = React.useState(true);
   const pvcAccessMode = getPVCAccessModes(resource, 'title');
+  const handleStorageClass = (updatedStorageClass) => {
+    setStorageClass(updatedStorageClass?.metadata?.name);
+  };
 
   const [scResource, scResourceLoaded, scResourceLoadError] = useK8sGet<StorageClassResourceKind>(
     StorageClassModel,
@@ -103,7 +108,7 @@ const ClonePVCModal = withHandlePromise((props: ClonePVCModalProps) => {
         namespace: resource.metadata.namespace,
       },
       spec: {
-        storageClassName: resource.spec.storageClassName,
+        storageClassName: storageClass,
         dataSource: {
           name: pvcName,
           kind: PersistentVolumeClaimModel.kind,
@@ -186,6 +191,15 @@ const ClonePVCModal = withHandlePromise((props: ClonePVCModalProps) => {
               </FormHelperText>
             )}
           </FormGroup>
+          <StorageClassDropdown
+            onChange={handleStorageClass}
+            id="storageclass-dropdown"
+            data-test="storageclass-dropdown"
+            describedBy="storageclass-dropdown-help"
+            required={false}
+            name="storageClass"
+            filter={(p) => p?.provisioner === scResource?.provisioner}
+          />
           <div className="co-clone-pvc-modal__details">
             <p className="text-muted">{t('console-app~PVC details')}</p>
             <div className="co-clone-pvc-modal__details-section">
@@ -201,7 +215,7 @@ const ClonePVCModal = withHandlePromise((props: ClonePVCModalProps) => {
                   <p className="co-clone-pvc-modal__pvc-details">{t('console-app~StorageClass')}</p>
                   <p>
                     <ResourceIcon kind={StorageClassModel.kind} />
-                    {resource.spec?.storageClassName || '-'}
+                    {storageClass || '-'}
                   </p>
                 </div>
               </div>