fix(FR-552): can not reopen vfolder createion modal in session launcher (#3199)

resolves #3198 (FR-552)

User cannot reopen vfolder creation modal after closing in session launcher.  To fix added Suspense boundary with Skeleton loading state to the StorageSelect component in the folder creation modal. This also improves the user experience by showing a loading indicator while the storage selection component is being loaded.

Author: yomybaby

react/src/components/FolderCreateModal.tsx

@@ -7,7 +7,17 @@ import BAIModal, { BAIModalProps } from './BAIModal';
 import Flex from './Flex';
 import ProjectSelect from './ProjectSelect';
 import StorageSelect from './StorageSelect';
-import { App, Button, Divider, Form, Input, Radio, Switch, theme } from 'antd';
+import {
+  App,
+  Button,
+  Divider,
+  Form,
+  Input,
+  Radio,
+  Skeleton,
+  Switch,
+  theme,
+} from 'antd';
 import { createStyles } from 'antd-style';
 import { FormInstance } from 'antd/lib';
 import _ from 'lodash';
@@ -216,14 +226,16 @@ const FolderCreateModal: React.FC<FolderCreateModalProps> = ({
         <Divider />
 
         <Form.Item label={t('data.Host')} name={'host'}>
-          <StorageSelect
-            onChange={(value) => {
-              formRef.current?.setFieldValue('host', value);
-            }}
-            showUsageStatus
-            autoSelectType="usage"
-            showSearch
-          />
+          <Suspense fallback={<Skeleton.Input active />}>
+            <StorageSelect
+              onChange={(value) => {
+                formRef.current?.setFieldValue('host', value);
+              }}
+              showUsageStatus
+              autoSelectType="usage"
+              showSearch
+            />
+          </Suspense>
         </Form.Item>
         <Divider />