fix(ai): 修复集群 partitions 为空时，页面崩溃的问题以及拼写错误 (#1147)

当用户配置的集群partitions为空数组时，页面会崩溃报错，增加一下兼容处理 ![6825f45f1db323cde95737cac88df04](https://github.com/PKUHPC/SCOW/assets/130351655/da871800-5abe-4469-9bd1-67367235b3e5)
PKUHPC · Feb 28, 2024 · 4e14446 · 4e14446
1 parent 146e19f
commit 4e14446
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 14 deletions.
diff --git a/.changeset/khaki-trees-kneel.md b/.changeset/khaki-trees-kneel.md
@@ -0,0 +1,5 @@
+---
+"@scow/ai": patch
+---
+
+修复集群 partitions 为空时，页面崩溃的问题以及拼写错误
diff --git a/apps/ai/src/app/(auth)/jobs/[clusterId]/LaunchAppForm.tsx b/apps/ai/src/app/(auth)/jobs/[clusterId]/LaunchAppForm.tsx
@@ -80,7 +80,7 @@ interface Partition {
   comment?: string;
 }
 
-export enum AccessiblityType {
+export enum AccessibilityType {
   PUBLIC = "PUBLIC",
   PRIVATE = "PRIVATE",
 }
@@ -165,7 +165,7 @@ export const LaunchAppForm = (props: Props) => {
   const imageType = Form.useWatch(["image", "type"], form);
   const selectedImage = Form.useWatch(["image", "name"], form);
 
-  const isImagePublic = imageType !== undefined ? imageType === AccessiblityType.PUBLIC : imageType;
+  const isImagePublic = imageType !== undefined ? imageType === AccessibilityType.PUBLIC : imageType;
 
   const { data: images, isLoading: isImagesLoading } = trpc.image.list.useQuery({
     isPublic: isImagePublic,
@@ -287,7 +287,7 @@ export const LaunchAppForm = (props: Props) => {
   useEffect(() => {
     setCurrentPartitionInfo(clusterInfo?.partitions[0]);
     form.setFieldsValue({
-      partition: clusterInfo?.partitions[0].name,
+      partition: clusterInfo?.partitions[0]?.name,
       appJobName: genAppJobName(appName ?? "trainJobs"),
     });
   }, [clusterInfo]);
@@ -393,11 +393,11 @@ export const LaunchAppForm = (props: Props) => {
                 options={
                   [
                     {
-                      value: AccessiblityType.PRIVATE,
+                      value: AccessibilityType.PRIVATE,
                       label: "我的镜像",
                     },
                     {
-                      value:  AccessiblityType.PUBLIC,
+                      value:  AccessibilityType.PUBLIC,
                       label: "公共镜像",
                     },
                   ]
@@ -439,11 +439,11 @@ export const LaunchAppForm = (props: Props) => {
                 options={
                   [
                     {
-                      value: AccessiblityType.PRIVATE,
+                      value: AccessibilityType.PRIVATE,
                       label: "我的算法",
                     },
                     {
-                      value:  AccessiblityType.PUBLIC,
+                      value:  AccessibilityType.PUBLIC,
                       label: "公共算法",
                     },
                   ]
@@ -483,11 +483,11 @@ export const LaunchAppForm = (props: Props) => {
                 options={
                   [
                     {
-                      value: AccessiblityType.PRIVATE,
+                      value: AccessibilityType.PRIVATE,
                       label: "我的数据集",
                     },
                     {
-                      value: AccessiblityType.PUBLIC,
+                      value: AccessibilityType.PUBLIC,
                       label: "公共数据集",
                     },
 
@@ -528,11 +528,11 @@ export const LaunchAppForm = (props: Props) => {
                 options={
                   [
                     {
-                      value: AccessiblityType.PRIVATE,
+                      value: AccessibilityType.PRIVATE,
                       label: "我的模型",
                     },
                     {
-                      value:  AccessiblityType.PUBLIC,
+                      value:  AccessibilityType.PUBLIC,
                       label: "公共模型",
                     },
                   ]

diff --git a/apps/ai/src/app/(auth)/jobs/[clusterId]/hooks.ts b/apps/ai/src/app/(auth)/jobs/[clusterId]/hooks.ts
@@ -14,7 +14,7 @@ import { UseQueryResult } from "@tanstack/react-query";
 import { Form, FormInstance } from "antd";
 import { useMemo } from "react";
 
-import { AccessiblityType } from "./LaunchAppForm";
+import { AccessibilityType } from "./LaunchAppForm";
 
 interface Option {
   label: string;
@@ -36,7 +36,7 @@ export function useDataOptions<T>(
 ): { dataOptions: Option[], isDataLoading: boolean } {
   const typePath = [dataType, "type"];
   const itemType = Form.useWatch(typePath, form);
-  const isItemPublic = itemType !== undefined ? itemType === AccessiblityType.PUBLIC : itemType;
+  const isItemPublic = itemType !== undefined ? itemType === AccessibilityType.PUBLIC : itemType;
 
   const { data: items, isLoading: isDataLoading } = queryHook({
     isPublic : isItemPublic, clusterId,
@@ -59,7 +59,7 @@ export function useDataVersionOptions<T>(
   const namePath = [dataType, "name"];
   const selectedItem = Form.useWatch(namePath, form);
   const itemType = Form.useWatch(typePath, form);
-  const isItemPublic = itemType !== undefined ? itemType === AccessiblityType.PUBLIC : itemType;
+  const isItemPublic = itemType !== undefined ? itemType === AccessibilityType.PUBLIC : itemType;
 
   const { data: versions, isLoading: isDataVersionsLoading } = queryHook({
     [`${dataType}Id`]: selectedItem, isPublic : isItemPublic,