diff --git a/react-ui/src/app.tsx b/react-ui/src/app.tsx index 3666ff81..e95027ba 100644 --- a/react-ui/src/app.tsx +++ b/react-ui/src/app.tsx @@ -10,7 +10,7 @@ import '../public/fonts/font.css'; import { getAccessToken } from './access'; import ErrorBoundary from './components/ErrorBoundary'; import './dayjsConfig'; -import { removeAllPageCacheState } from './hooks/pageCacheState'; +import { removeAllPageCacheState } from './hooks/useCacheState'; import { getRemoteMenu, getRoutersInfo, diff --git a/react-ui/src/components/ParameterSelect/config.tsx b/react-ui/src/components/ParameterSelect/config.tsx index f9ac72d2..662a7981 100644 --- a/react-ui/src/components/ParameterSelect/config.tsx +++ b/react-ui/src/components/ParameterSelect/config.tsx @@ -1,4 +1,4 @@ -import { filterResourceStandard, resourceFieldNames } from '@/hooks/resource'; +import { filterResourceStandard, resourceFieldNames } from '@/hooks/useComputingResource'; import { ServiceData } from '@/pages/ModelDeployment/types'; import { getDatasetList, getModelList } from '@/services/dataset/index.js'; import { getServiceListReq } from '@/services/modelDeployment'; diff --git a/react-ui/src/components/ParameterSelect/index.tsx b/react-ui/src/components/ParameterSelect/index.tsx index b765ea61..36b75d30 100644 --- a/react-ui/src/components/ParameterSelect/index.tsx +++ b/react-ui/src/components/ParameterSelect/index.tsx @@ -4,7 +4,7 @@ * @Description: 参数下拉选择组件，支持资源规格、数据集、模型、服务 */ -import { useComputingResource } from '@/hooks/resource'; +import { useComputingResource } from '@/hooks/useComputingResource'; import { to } from '@/utils/promise'; import { Select, type SelectProps } from 'antd'; import { useEffect, useState } from 'react'; diff --git a/react-ui/src/hooks/index.ts b/react-ui/src/hooks/index.ts deleted file mode 100644 index 59ba1d6e..00000000 --- a/react-ui/src/hooks/index.ts +++ /dev/null @@ -1,202 +0,0 @@ -/* - * @Author: 赵伟 - * @Date: 2024-04-15 10:01:29 - * @Description: 自定义 hooks - */ -import { FormInstance } from 'antd'; -import { debounce } from 'lodash'; -import { useCallback, useEffect, useMemo, useRef, useState } from 'react'; -/** - * 生成具有初始值的状态引用 - * - * @param initialValue - 状态的初始值 - * @return 包含状态值、状态设置函数和可变引用对象的数组 - */ -export function useStateRef(initialValue: T) { - const [value, setValue] = useState(initialValue); - - const ref = useRef(value); - - useEffect(() => { - ref.current = value; - }, [value]); - - return [value, setValue, ref] as const; -} - -/** - * 生成一个自定义钩子，用于管理模态框的可见性状态。 - * - * @param initialValue - 模态框的初始可见性状态。 - * @return 一个数组，包含可见性状态和打开和关闭模态框的函数。 - */ -export function useVisible(initialValue: boolean) { - const [visible, setVisible] = useState(initialValue); - const ref = useRef(initialValue); - - const open = useCallback(() => { - setVisible(true); - }, []); - - const close = useCallback(() => { - setVisible(false); - }, []); - - useEffect(() => { - ref.current = visible; - }, [visible]); - - return [visible, open, close, ref] as const; -} - -type Callback = (state: T) => void; - -/** - * 生成一个具有回调机制的可变状态值和更新它的函数。 - * - * @param initialValue - 初始状态值。 - * @return 一个元组，包含当前状态值和用于更新状态的函数。 - */ -export function useCallbackState(initialValue: T) { - const [state, _setState] = useState(initialValue); - const callbackQueue = useRef[]>([]); - useEffect(() => { - callbackQueue.current.forEach((cb) => cb(state)); - callbackQueue.current = []; - }, [state]); - const setState = (newValue: T | ((prevState: T) => T), callback?: Callback) => { - _setState(newValue); - if (callback && typeof callback === 'function') { - callbackQueue.current.push(callback); - } - }; - return [state, setState] as const; -} - -/** - * 用于追踪 DOM 元素尺寸的 hook。 - * - * @param initialWidth - 初始宽度。 - * @param initialHeight - 初始高度。 - * @param deps - 依赖列表。 - * @return 一个元组，包含 DOM 元素的 ref、当前宽度和当前高度。 - */ -export function useDomSize( - initialWidth: number, - initialHeight: number, - deps: React.DependencyList = [], -) { - const domRef = useRef(null); - const [width, setWidth] = useState(initialWidth); - const [height, setHeight] = useState(initialHeight); - - useEffect(() => { - const setDomHeight = () => { - if (domRef.current) { - setHeight(domRef.current.offsetHeight); - setWidth(domRef.current.offsetWidth); - } - }; - const debounceFunc = debounce(setDomHeight, 100); - - setDomHeight(); - window.addEventListener('resize', debounceFunc); - - return () => { - window.removeEventListener('resize', debounceFunc); - }; - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [domRef, ...deps]); - - return [domRef, { width, height }] as const; -} - -/** - * 用于在 modal 关闭时重置 Form 表单的 hook。 - * - * @param form - Ant Design Form 表单实例 - * @param open - modal 是否打开 - */ -export const useResetFormOnCloseModal = (form: FormInstance, open: boolean) => { - const prevOpenRef = useRef(); - - useEffect(() => { - prevOpenRef.current = open; - }, [open]); - - const prevOpen = prevOpenRef.current; - - useEffect(() => { - if (!open && prevOpen) { - form.resetFields(); - } - }, [form, prevOpen, open]); -}; - -/** - * Executes the effect function when the specified condition is true. - * - * @param effect - The effect function to execute. - * @param when - The condition to trigger the effect. - * @param deps - The dependencies for the effect. - */ -export const useEffectWhen = (effect: () => void, when: boolean, deps: React.DependencyList) => { - const requestFns = useRef<(() => void)[]>([]); - useEffect(() => { - if (when) { - effect(); - } else { - requestFns.current.splice(0, 1, effect); - } - // eslint-disable-next-line react-hooks/exhaustive-deps - }, deps); - - useEffect(() => { - if (when) { - const fn = requestFns.current.pop(); - fn?.(); - } - }, [when]); -}; - -// 选择、全选操作 -export const useCheck = (list: T[]) => { - const [selected, setSelected] = useState([]); - - const checked = useMemo(() => { - return selected.length === list.length && selected.length > 0; - }, [selected, list]); - - const indeterminate = useMemo(() => { - return selected.length > 0 && selected.length < list.length; - }, [selected, list]); - - const checkAll = useCallback(() => { - setSelected(checked ? [] : list); - }, [list, checked]); - - const isSingleChecked = useCallback((item: T) => selected.includes(item), [selected]); - - const checkSingle = useCallback( - (item: T) => { - setSelected((prev) => { - if (isSingleChecked(item)) { - return prev.filter((i) => i !== item); - } else { - return [...prev, item]; - } - }); - }, - [isSingleChecked], - ); - - return [ - selected, - setSelected, - checked, - indeterminate, - checkAll, - isSingleChecked, - checkSingle, - ] as const; -}; diff --git a/react-ui/src/hooks/pageCacheState.ts b/react-ui/src/hooks/useCacheState.ts similarity index 100% rename from react-ui/src/hooks/pageCacheState.ts rename to react-ui/src/hooks/useCacheState.ts diff --git a/react-ui/src/hooks/useCallbackState.ts b/react-ui/src/hooks/useCallbackState.ts new file mode 100644 index 00000000..820e770b --- /dev/null +++ b/react-ui/src/hooks/useCallbackState.ts @@ -0,0 +1,25 @@ +import { useEffect, useRef, useState } from 'react'; + +type Callback = (state: T) => void; + +/** + * 生成一个具有回调机制的可变状态值和更新它的函数。谨慎使用 + * + * @param initialValue - 初始状态值。 + * @return 一个元组，包含当前状态值和用于更新状态的函数。 + */ +export function useCallbackState(initialValue: T) { + const [state, _setState] = useState(initialValue); + const callbackQueue = useRef[]>([]); + useEffect(() => { + callbackQueue.current.forEach((cb) => cb(state)); + callbackQueue.current = []; + }, [state]); + const setState = (newValue: T | ((prevState: T) => T), callback?: Callback) => { + _setState(newValue); + if (callback && typeof callback === 'function') { + callbackQueue.current.push(callback); + } + }; + return [state, setState] as const; +} diff --git a/react-ui/src/hooks/useCheck.ts b/react-ui/src/hooks/useCheck.ts new file mode 100644 index 00000000..1b965549 --- /dev/null +++ b/react-ui/src/hooks/useCheck.ts @@ -0,0 +1,53 @@ +import { useCallback, useMemo, useState } from 'react'; + +/** + * @description 选择、全选操作 + * @param list 需要进行选择的列表 + * @returns selected 选中的项 + * setSelected 设置 selected 的方法 + * checked 是否全选 + * indeterminate 是否部分选中 + * checkAll 全选 + * isSingleChecked 是否单个选中 + * checkSingle 单个选中 + */ +export const useCheck = (list: T[]) => { + const [selected, setSelected] = useState([]); + + const checked = useMemo(() => { + return selected.length === list.length && selected.length > 0; + }, [selected, list]); + + const indeterminate = useMemo(() => { + return selected.length > 0 && selected.length < list.length; + }, [selected, list]); + + const checkAll = useCallback(() => { + setSelected(checked ? [] : list); + }, [list, checked]); + + const isSingleChecked = useCallback((item: T) => selected.includes(item), [selected]); + + const checkSingle = useCallback( + (item: T) => { + setSelected((prev) => { + if (isSingleChecked(item)) { + return prev.filter((i) => i !== item); + } else { + return [...prev, item]; + } + }); + }, + [isSingleChecked], + ); + + return [ + selected, + setSelected, + checked, + indeterminate, + checkAll, + isSingleChecked, + checkSingle, + ] as const; +}; diff --git a/react-ui/src/hooks/resource.ts b/react-ui/src/hooks/useComputingResource.ts similarity index 100% rename from react-ui/src/hooks/resource.ts rename to react-ui/src/hooks/useComputingResource.ts diff --git a/react-ui/src/hooks/useDomSize.ts b/react-ui/src/hooks/useDomSize.ts new file mode 100644 index 00000000..ba1992ea --- /dev/null +++ b/react-ui/src/hooks/useDomSize.ts @@ -0,0 +1,40 @@ +import { debounce } from 'lodash'; +import { useEffect, useRef, useState } from 'react'; + +/** + * 用于追踪 DOM 元素尺寸的 hook。 + * + * @param initialWidth - 初始宽度。 + * @param initialHeight - 初始高度。 + * @param deps - 依赖列表。 + * @return 一个元组，包含 DOM 元素的 ref、当前宽度和当前高度。 + */ +export function useDomSize( + initialWidth: number, + initialHeight: number, + deps: React.DependencyList = [], +) { + const domRef = useRef(null); + const [width, setWidth] = useState(initialWidth); + const [height, setHeight] = useState(initialHeight); + + useEffect(() => { + const setDomHeight = () => { + if (domRef.current) { + setHeight(domRef.current.offsetHeight); + setWidth(domRef.current.offsetWidth); + } + }; + const debounceFunc = debounce(setDomHeight, 100); + + setDomHeight(); + window.addEventListener('resize', debounceFunc); + + return () => { + window.removeEventListener('resize', debounceFunc); + }; + // eslint-disable-next-line react-hooks/exhaustive-deps + }, deps); + + return [domRef, { width, height }] as const; +} diff --git a/react-ui/src/hooks/draggable.ts b/react-ui/src/hooks/useDraggable.ts similarity index 100% rename from react-ui/src/hooks/draggable.ts rename to react-ui/src/hooks/useDraggable.ts diff --git a/react-ui/src/hooks/useEffectWhen.ts b/react-ui/src/hooks/useEffectWhen.ts new file mode 100644 index 00000000..77b53c08 --- /dev/null +++ b/react-ui/src/hooks/useEffectWhen.ts @@ -0,0 +1,27 @@ +import { useEffect, useRef } from 'react'; + +/** + * 当指定的条件为真时执行 Effect 函数。 + * + * @param effect - The effect function to execute. + * @param when - The condition to trigger the effect. + * @param deps - The dependencies for the effect. + */ +export const useEffectWhen = (effect: () => void, when: boolean, deps: React.DependencyList) => { + const requestFns = useRef<(() => void)[]>([]); + useEffect(() => { + if (when) { + effect(); + } else { + requestFns.current.splice(0, 1, effect); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, deps); + + useEffect(() => { + if (when) { + const fn = requestFns.current.pop(); + fn?.(); + } + }, [when]); +}; diff --git a/react-ui/src/hooks/useResetForm.ts b/react-ui/src/hooks/useResetForm.ts new file mode 100644 index 00000000..acefd84e --- /dev/null +++ b/react-ui/src/hooks/useResetForm.ts @@ -0,0 +1,24 @@ +import { FormInstance } from 'antd'; +import { useEffect, useRef } from 'react'; + +/** + * 用于在 modal 关闭时重置 Form 表单的 hook。 + * + * @param form - Ant Design Form 表单实例 + * @param open - modal 是否打开 + */ +export const useResetForm = (form: FormInstance, open: boolean) => { + const prevOpenRef = useRef(); + + useEffect(() => { + prevOpenRef.current = open; + }, [open]); + + const prevOpen = prevOpenRef.current; + + useEffect(() => { + if (!open && prevOpen) { + form.resetFields(); + } + }, [form, prevOpen, open]); +}; diff --git a/react-ui/src/hooks/useSSE.ts b/react-ui/src/hooks/useSSE.ts new file mode 100644 index 00000000..5e278675 --- /dev/null +++ b/react-ui/src/hooks/useSSE.ts @@ -0,0 +1,46 @@ +import { parseJsonText } from '@/utils'; +import { useCallback, useRef } from 'react'; + +export const useSSE = (onMessage: (data: any) => void) => { + const evtSourceRef = useRef(null); + + const setupSSE = useCallback( + (name: string, namespace: string) => { + const { origin } = location; + const params = encodeURIComponent(`metadata.namespace=${namespace},metadata.name=${name}`); + const evtSource = new EventSource( + `${origin}/api/v1/realtimeStatus?listOptions.fieldSelector=${params}`, + { withCredentials: false }, + ); + evtSource.onmessage = (event) => { + const data = event?.data; + if (!data) { + return; + } + const dataJson = parseJsonText(data); + if (dataJson) { + const nodes = dataJson?.result?.object?.status?.nodes; + if (nodes) { + onMessage(nodes); + } + } + }; + + evtSource.onerror = (error) => { + console.error('SSE error: ', error); + }; + + evtSourceRef.current = evtSource; + }, + [onMessage], + ); + + const closeSSE = useCallback(() => { + if (evtSourceRef.current) { + evtSourceRef.current.close(); + evtSourceRef.current = null; + } + }, []); + + return [setupSSE, closeSSE]; +}; diff --git a/react-ui/src/hooks/useStateRef.ts b/react-ui/src/hooks/useStateRef.ts new file mode 100644 index 00000000..5cc260b3 --- /dev/null +++ b/react-ui/src/hooks/useStateRef.ts @@ -0,0 +1,19 @@ +import { useEffect, useRef, useState } from 'react'; + +/** + * 生成具有初始值的状态引用 + * + * @param initialValue - 状态的初始值 + * @return 包含状态值、状态设置函数和可变引用对象的数组 + */ +export function useStateRef(initialValue: T) { + const [value, setValue] = useState(initialValue); + + const ref = useRef(value); + + useEffect(() => { + ref.current = value; + }, [value]); + + return [value, setValue, ref] as const; +} diff --git a/react-ui/src/hooks/useVisible.ts b/react-ui/src/hooks/useVisible.ts new file mode 100644 index 00000000..461fa3c8 --- /dev/null +++ b/react-ui/src/hooks/useVisible.ts @@ -0,0 +1,26 @@ +import { useCallback, useEffect, useRef, useState } from 'react'; + +/** + * 生成一个自定义钩子，用于管理模态框的可见性状态。 + * + * @param initialValue - 模态框的初始可见性状态。 + * @return 一个数组，包含 visible、打开函数、关闭函数和 visible ref。 + */ +export function useVisible(initialValue: boolean) { + const [visible, setVisible] = useState(initialValue); + const ref = useRef(initialValue); + + const open = useCallback(() => { + setVisible(true); + }, []); + + const close = useCallback(() => { + setVisible(false); + }, []); + + useEffect(() => { + ref.current = visible; + }, [visible]); + + return [visible, open, close, ref] as const; +} diff --git a/react-ui/src/pages/AutoML/components/ExperimentInstance/index.tsx b/react-ui/src/pages/AutoML/components/ExperimentInstance/index.tsx index e7837120..756b11c7 100644 --- a/react-ui/src/pages/AutoML/components/ExperimentInstance/index.tsx +++ b/react-ui/src/pages/AutoML/components/ExperimentInstance/index.tsx @@ -1,6 +1,6 @@ import KFIcon from '@/components/KFIcon'; import { ExperimentStatus } from '@/enums'; -import { useCheck } from '@/hooks'; +import { useCheck } from '@/hooks/useCheck'; import { experimentStatusInfo } from '@/pages/Experiment/status'; import themes from '@/styles/theme.less'; import { type ExperimentInstance } from '@/types'; diff --git a/react-ui/src/pages/AutoML/components/ExperimentList/index.tsx b/react-ui/src/pages/AutoML/components/ExperimentList/index.tsx index e187167f..d4628c24 100644 --- a/react-ui/src/pages/AutoML/components/ExperimentList/index.tsx +++ b/react-ui/src/pages/AutoML/components/ExperimentList/index.tsx @@ -7,7 +7,7 @@ import KFIcon from '@/components/KFIcon'; import PageTitle from '@/components/PageTitle'; import { ExperimentStatus } from '@/enums'; -import { useCacheState } from '@/hooks/pageCacheState'; +import { useCacheState } from '@/hooks/useCacheState'; import { AutoMLData } from '@/pages/AutoML/types'; import { experimentStatusInfo } from '@/pages/Experiment/status'; import themes from '@/styles/theme.less'; diff --git a/react-ui/src/pages/Dataset/components/ResourcePage/index.tsx b/react-ui/src/pages/Dataset/components/ResourcePage/index.tsx index f8a22729..fce95046 100644 --- a/react-ui/src/pages/Dataset/components/ResourcePage/index.tsx +++ b/react-ui/src/pages/Dataset/components/ResourcePage/index.tsx @@ -1,5 +1,5 @@ import { CommonTabKeys } from '@/enums'; -import { useCacheState } from '@/hooks/pageCacheState'; +import { useCacheState } from '@/hooks/useCacheState'; import { getAssetIcon } from '@/services/dataset/index.js'; import { to } from '@/utils/promise'; import { Flex, Tabs, type TabsProps } from 'antd'; diff --git a/react-ui/src/pages/DevelopmentEnvironment/List/index.tsx b/react-ui/src/pages/DevelopmentEnvironment/List/index.tsx index cc90524d..357471d1 100644 --- a/react-ui/src/pages/DevelopmentEnvironment/List/index.tsx +++ b/react-ui/src/pages/DevelopmentEnvironment/List/index.tsx @@ -6,7 +6,7 @@ import KFIcon from '@/components/KFIcon'; import { DevEditorStatus } from '@/enums'; -import { useCacheState } from '@/hooks/pageCacheState'; +import { useCacheState } from '@/hooks/useCacheState'; import { deleteEditorReq, getEditorListReq, diff --git a/react-ui/src/pages/Experiment/Info/index.jsx b/react-ui/src/pages/Experiment/Info/index.jsx index c40726ee..fd795873 100644 --- a/react-ui/src/pages/Experiment/Info/index.jsx +++ b/react-ui/src/pages/Experiment/Info/index.jsx @@ -1,5 +1,6 @@ import { ExperimentStatus } from '@/enums'; -import { useStateRef, useVisible } from '@/hooks'; +import { useStateRef } from '@/hooks/useStateRef'; +import { useVisible } from '@/hooks/useVisible'; import { getExperimentIns } from '@/services/experiment/index.js'; import { getWorkflowById } from '@/services/pipeline/index.js'; import themes from '@/styles/theme.less'; diff --git a/react-ui/src/pages/Experiment/components/ExperimentInstance/index.tsx b/react-ui/src/pages/Experiment/components/ExperimentInstance/index.tsx index d184deee..9812b893 100644 --- a/react-ui/src/pages/Experiment/components/ExperimentInstance/index.tsx +++ b/react-ui/src/pages/Experiment/components/ExperimentInstance/index.tsx @@ -1,6 +1,6 @@ import KFIcon from '@/components/KFIcon'; import { ExperimentStatus } from '@/enums'; -import { useCheck } from '@/hooks'; +import { useCheck } from '@/hooks/useCheck'; import { experimentStatusInfo } from '@/pages/Experiment/status'; import { deleteManyExperimentIns, diff --git a/react-ui/src/pages/Experiment/components/LogGroup/index.tsx b/react-ui/src/pages/Experiment/components/LogGroup/index.tsx index 3bc1b566..f64f23c4 100644 --- a/react-ui/src/pages/Experiment/components/LogGroup/index.tsx +++ b/react-ui/src/pages/Experiment/components/LogGroup/index.tsx @@ -5,7 +5,7 @@ */ import { ExperimentStatus } from '@/enums'; -import { useStateRef } from '@/hooks'; +import { useStateRef } from '@/hooks/useStateRef'; import { getExperimentPodsLog } from '@/services/experiment/index.js'; import { DoubleRightOutlined, DownOutlined, UpOutlined } from '@ant-design/icons'; import { Button } from 'antd'; diff --git a/react-ui/src/pages/Experiment/index.jsx b/react-ui/src/pages/Experiment/index.jsx index 91737c32..d283d863 100644 --- a/react-ui/src/pages/Experiment/index.jsx +++ b/react-ui/src/pages/Experiment/index.jsx @@ -1,7 +1,7 @@ import KFIcon from '@/components/KFIcon'; import PageTitle from '@/components/PageTitle'; import { ExperimentStatus, TensorBoardStatus } from '@/enums'; -import { useCacheState } from '@/hooks/pageCacheState'; +import { useCacheState } from '@/hooks/useCacheState'; import { deleteExperimentById, getExperiment, diff --git a/react-ui/src/pages/HyperParameter/components/HyperParameterBasic/index.tsx b/react-ui/src/pages/HyperParameter/components/HyperParameterBasic/index.tsx index feb72d48..77cbff36 100644 --- a/react-ui/src/pages/HyperParameter/components/HyperParameterBasic/index.tsx +++ b/react-ui/src/pages/HyperParameter/components/HyperParameterBasic/index.tsx @@ -1,6 +1,6 @@ import ConfigInfo, { type BasicInfoData } from '@/components/ConfigInfo'; import { hyperParameterOptimizedMode } from '@/enums'; -import { useComputingResource } from '@/hooks/resource'; +import { useComputingResource } from '@/hooks/useComputingResource'; import { experimentStatusInfo } from '@/pages/Experiment/status'; import { schedulerAlgorithms, diff --git a/react-ui/src/pages/Mirror/Info/index.tsx b/react-ui/src/pages/Mirror/Info/index.tsx index b08fcc06..09d88372 100644 --- a/react-ui/src/pages/Mirror/Info/index.tsx +++ b/react-ui/src/pages/Mirror/Info/index.tsx @@ -7,8 +7,8 @@ import KFIcon from '@/components/KFIcon'; import PageTitle from '@/components/PageTitle'; import SubAreaTitle from '@/components/SubAreaTitle'; import { MirrorVersionStatus } from '@/enums'; -import { useDomSize } from '@/hooks'; -import { useCacheState } from '@/hooks/pageCacheState'; +import { useCacheState } from '@/hooks/useCacheState'; +import { useDomSize } from '@/hooks/useDomSize'; import { deleteMirrorVersionReq, getMirrorInfoReq, diff --git a/react-ui/src/pages/Mirror/List/index.tsx b/react-ui/src/pages/Mirror/List/index.tsx index 1c74ddea..0671261b 100644 --- a/react-ui/src/pages/Mirror/List/index.tsx +++ b/react-ui/src/pages/Mirror/List/index.tsx @@ -5,7 +5,7 @@ */ import KFIcon from '@/components/KFIcon'; import { CommonTabKeys } from '@/enums'; -import { useCacheState } from '@/hooks/pageCacheState'; +import { useCacheState } from '@/hooks/useCacheState'; import { deleteMirrorReq, getMirrorListReq } from '@/services/mirror'; import themes from '@/styles/theme.less'; import { to } from '@/utils/promise'; diff --git a/react-ui/src/pages/Model/components/ModelEvolution/index.tsx b/react-ui/src/pages/Model/components/ModelEvolution/index.tsx index 42b85f21..7fa62184 100644 --- a/react-ui/src/pages/Model/components/ModelEvolution/index.tsx +++ b/react-ui/src/pages/Model/components/ModelEvolution/index.tsx @@ -4,7 +4,7 @@ * @Description: 模型演化 */ -import { useEffectWhen } from '@/hooks'; +import { useEffectWhen } from '@/hooks/useEffectWhen'; import { getModelAtlasReq } from '@/services/dataset/index.js'; import themes from '@/styles/theme.less'; import { to } from '@/utils/promise'; diff --git a/react-ui/src/pages/Model/components/ModelMetrics/index.tsx b/react-ui/src/pages/Model/components/ModelMetrics/index.tsx index 0b8c2652..afcb9be3 100644 --- a/react-ui/src/pages/Model/components/ModelMetrics/index.tsx +++ b/react-ui/src/pages/Model/components/ModelMetrics/index.tsx @@ -1,6 +1,6 @@ import SubAreaTitle from '@/components/SubAreaTitle'; import TableColTitle from '@/components/TableColTitle'; -import { useCheck } from '@/hooks'; +import { useCheck } from '@/hooks/useCheck'; import { getModelPageVersionsReq, getModelVersionsMetricsReq } from '@/services/dataset'; import { tableSorter } from '@/utils'; import { to } from '@/utils/promise'; diff --git a/react-ui/src/pages/ModelDeployment/List/index.tsx b/react-ui/src/pages/ModelDeployment/List/index.tsx index 389931f2..4d5f7a3c 100644 --- a/react-ui/src/pages/ModelDeployment/List/index.tsx +++ b/react-ui/src/pages/ModelDeployment/List/index.tsx @@ -6,7 +6,7 @@ import KFIcon from '@/components/KFIcon'; import PageTitle from '@/components/PageTitle'; import { serviceTypeOptions } from '@/enums'; -import { useCacheState } from '@/hooks/pageCacheState'; +import { useCacheState } from '@/hooks/useCacheState'; import { deleteServiceReq, getServiceListReq } from '@/services/modelDeployment'; import themes from '@/styles/theme.less'; import { to } from '@/utils/promise'; diff --git a/react-ui/src/pages/ModelDeployment/ServiceInfo/index.tsx b/react-ui/src/pages/ModelDeployment/ServiceInfo/index.tsx index a0cecfe0..aceea197 100644 --- a/react-ui/src/pages/ModelDeployment/ServiceInfo/index.tsx +++ b/react-ui/src/pages/ModelDeployment/ServiceInfo/index.tsx @@ -8,8 +8,8 @@ import KFIcon from '@/components/KFIcon'; import PageTitle from '@/components/PageTitle'; import SubAreaTitle from '@/components/SubAreaTitle'; import { ServiceRunStatus, serviceStatusOptions } from '@/enums'; -import { useCacheState } from '@/hooks/pageCacheState'; -import { useComputingResource } from '@/hooks/resource'; +import { useCacheState } from '@/hooks/useCacheState'; +import { useComputingResource } from '@/hooks/useComputingResource'; import { deleteServiceVersionReq, getServiceInfoReq, diff --git a/react-ui/src/pages/ModelDeployment/components/VersionBasicInfo/index.tsx b/react-ui/src/pages/ModelDeployment/components/VersionBasicInfo/index.tsx index 00093c46..2e052a0d 100644 --- a/react-ui/src/pages/ModelDeployment/components/VersionBasicInfo/index.tsx +++ b/react-ui/src/pages/ModelDeployment/components/VersionBasicInfo/index.tsx @@ -1,6 +1,6 @@ import BasicInfo, { type BasicInfoData } from '@/components/BasicInfo'; import { ServiceRunStatus } from '@/enums'; -import { useComputingResource } from '@/hooks/resource'; +import { useComputingResource } from '@/hooks/useComputingResource'; import { ServiceVersionData } from '@/pages/ModelDeployment/types'; import { formatDate } from '@/utils/date'; import { formatCodeConfig, formatModel } from '@/utils/format'; diff --git a/react-ui/src/pages/ModelDeployment/components/VersionCompareModal/index.tsx b/react-ui/src/pages/ModelDeployment/components/VersionCompareModal/index.tsx index 9d021e9b..b38ff770 100644 --- a/react-ui/src/pages/ModelDeployment/components/VersionCompareModal/index.tsx +++ b/react-ui/src/pages/ModelDeployment/components/VersionCompareModal/index.tsx @@ -1,6 +1,6 @@ import KFModal from '@/components/KFModal'; import { ServiceRunStatus } from '@/enums'; -import { useComputingResource } from '@/hooks/resource'; +import { useComputingResource } from '@/hooks/useComputingResource'; import { type ServiceVersionData } from '@/pages/ModelDeployment/types'; import { getServiceVersionCompareReq } from '@/services/modelDeployment'; import { isEmpty } from '@/utils'; diff --git a/react-ui/src/pages/Pipeline/Info/index.jsx b/react-ui/src/pages/Pipeline/Info/index.jsx index 1e1e078b..27003d68 100644 --- a/react-ui/src/pages/Pipeline/Info/index.jsx +++ b/react-ui/src/pages/Pipeline/Info/index.jsx @@ -1,5 +1,6 @@ import KFIcon from '@/components/KFIcon'; -import { useStateRef, useVisible } from '@/hooks'; +import { useStateRef } from '@/hooks/useStateRef'; +import { useVisible } from '@/hooks/useVisible'; import { getWorkflowById, saveWorkflow } from '@/services/pipeline/index.js'; import themes from '@/styles/theme.less'; import { fittingString, parseJsonText, s8 } from '@/utils'; diff --git a/react-ui/src/pages/Pipeline/index.jsx b/react-ui/src/pages/Pipeline/index.jsx index e78be54e..cbfe26b4 100644 --- a/react-ui/src/pages/Pipeline/index.jsx +++ b/react-ui/src/pages/Pipeline/index.jsx @@ -1,7 +1,7 @@ import KFIcon from '@/components/KFIcon'; import KFModal from '@/components/KFModal'; import PageTitle from '@/components/PageTitle'; -import { useCacheState } from '@/hooks/pageCacheState'; +import { useCacheState } from '@/hooks/useCacheState'; import { addWorkflow, cloneWorkflow, diff --git a/react-ui/src/pages/Workspace/index.tsx b/react-ui/src/pages/Workspace/index.tsx index b88f3d58..0546f22a 100644 --- a/react-ui/src/pages/Workspace/index.tsx +++ b/react-ui/src/pages/Workspace/index.tsx @@ -1,4 +1,4 @@ -import { useDraggable } from '@/hooks/draggable'; +import { useDraggable } from '@/hooks/useDraggable'; import { getWorkspaceOverviewReq } from '@/services/workspace'; import { ExperimentInstance } from '@/types'; import { to } from '@/utils/promise'; diff --git a/react-ui/src/utils/ui.tsx b/react-ui/src/utils/ui.tsx index d9953a3e..df042bc9 100644 --- a/react-ui/src/utils/ui.tsx +++ b/react-ui/src/utils/ui.tsx @@ -4,7 +4,7 @@ * @Description: UI 公共方法 */ import { PageEnum } from '@/enums/pagesEnums'; -import { removeAllPageCacheState } from '@/hooks/pageCacheState'; +import { removeAllPageCacheState } from '@/hooks/useCacheState'; import themes from '@/styles/theme.less'; import { type ClientInfo } from '@/types'; import { history } from '@umijs/max';