fix: delay querying backends

src/pages/backends/components/backend-list.tsx

@@ -57,10 +57,13 @@ const ListSkeleton: React.FC<{
         <SpinWrapper>
           <Spin
             spinning={loading}
+            size="middle"
             style={{
               width: '100%'
             }}
-            wrapperClassName="skelton-wrapper"
+            classNames={{
+              root: 'skelton-wrapper'
+            }}
           >
             {isFirst && (
               <SkeletonWrapper>

src/pages/cluster-management/components/add-worker/select-cluster.tsx

@@ -79,7 +79,7 @@ const SelectCluster: React.FC<AddWorkerStepProps> = ({ disabled }) => {
         </div>
       }
     >
-      <Spin spinning={clusterLoading}>
+      <Spin spinning={clusterLoading} size="middle">
         <BaseSelect
           defaultValue={registrationInfo.cluster_id}
           options={clusterList}

src/pages/dashboard/index.tsx

@@ -18,7 +18,7 @@ const Dashboard: React.FC = () => {
   return (
     <DashboardContext.Provider value={{ ...data, fetchData: fetchData }}>
       <PageBox>
-        <Spin spinning={loading} style={{ minHeight: 300 }}>
+        <Spin spinning={loading} style={{ minHeight: 300 }} size="middle">
           <DashboardInner />
         </Spin>
       </PageBox>

src/pages/llmodels/components/catalog/catalog-list.tsx

@@ -37,6 +37,7 @@ const ListSkeleton: React.FC<{
         <SpinWrapper>
           <Spin
             spinning={loading}
+            size="middle"
             style={{
               width: '100%'
             }}

src/pages/llmodels/components/deployment/deploy-modal.tsx

@@ -472,6 +472,9 @@ const AddModal: FC<AddModalProps> = (props) => {
   };
 
   const handleOnOpen = async () => {
+    await new Promise((resolve) => {
+      setTimeout(resolve, 100);
+    });
     const [backendOptions, gpuOptions] = await Promise.all([
       form.current?.getBackendOptions?.({
         cluster_id: initClusterId()

src/pages/llmodels/components/model-source/hf-model-file.tsx

@@ -321,6 +321,7 @@ const HFModelFile: React.FC<HFModelFileProps> = forwardRef((props, ref) => {
         <div className="spin-wrapper">
           <Spin
             spinning={dataSource.loading}
+            size="middle"
             style={{ height: '100%', width: '100%' }}
           ></Spin>
         </div>

src/pages/login/components/login-form.tsx

@@ -241,7 +241,10 @@ const LoginForm = () => {
           <SpinContainer>
             {renderWelCome()}
             <div className="spin">
-              <Spin tip={intl.formatMessage({ id: 'common.login.auth' })}>
+              <Spin
+                tip={intl.formatMessage({ id: 'common.login.auth' })}
+                size="middle"
+              >
                 <div style={{ width: 300 }}></div>
               </Spin>
             </div>

src/pages/playground/embedding/page.tsx

@@ -671,7 +671,7 @@ const GroundEmbedding: React.FC<MessageProps> = forwardRef((props, ref) => {
                   alignItems: 'center'
                 }}
               >
-                <Spin spinning={true}></Spin>
+                <Spin spinning={true} size="middle"></Spin>
               </div>
             )}
             <ResizeContainer

src/pages/playground/video/page.tsx

@@ -183,6 +183,7 @@ const GroundVideo: React.FC<MessageProps> = forwardRef((props, ref) => {
                 >
                   <Spin
                     spinning={loading}
+                    size="middle"
                     styles={{
                       root: {
                         height: '100%'