fix: ux issues

src/pages/gpu-service/storage/forms/basic.tsx

@@ -3,26 +3,19 @@ import {
   Input as CInput,
   InputNumber,
   Select as SealSelect,
-  Textarea,
   useAppUtils
 } from '@gpustack/core-ui';
 import { useIntl } from '@umijs/max';
 import { Flex, Form } from 'antd';
-import { useEffect } from 'react';
+import { useContext } from 'react';
 import OwnerPrincipalIdField from '../../../_components/owner-principal-id-field';
+import { FormContext } from '../config/form-context';
 import { FormData } from '../config/types';
-import useQueryStorageClass from '../services/use-query-storage-class';
 
-const Basic = ({ open, action }: { open: boolean; action: string }) => {
+const Basic = ({ action, open }: { action: string; open: boolean }) => {
   const intl = useIntl();
   const { getRuleMessage } = useAppUtils();
-  const { storageClassList, fetchData, loading } = useQueryStorageClass();
-
-  useEffect(() => {
-    if (open) {
-      fetchData({ page: 1, perPage: 100 });
-    }
-  }, [open]);
+  const { storageClassList } = useContext(FormContext);
 
   return (
     <>
@@ -52,13 +45,6 @@ const Basic = ({ open, action }: { open: boolean; action: string }) => {
           label={intl.formatMessage({ id: 'common.table.displayName' })}
         />
       </Form.Item>
-      <Form.Item<FormData> name="description">
-        <Textarea
-          trim={false}
-          scaleSize={true}
-          label={intl.formatMessage({ id: 'common.table.description' })}
-        />
-      </Form.Item>
       <Flex gap={16}>
         <div style={{ flex: 1 }}>
           <Form.Item<FormData>
@@ -74,7 +60,6 @@ const Basic = ({ open, action }: { open: boolean; action: string }) => {
               disabled={action === PageAction.EDIT}
               label={intl.formatMessage({ id: 'gpuservice.storage.type' })}
               required
-              loading={loading}
               options={storageClassList}
             />
           </Form.Item>