fix: add worker button do not work
This commit is contained in:
@@ -95,7 +95,7 @@ const LogsViewer: React.FC<LogsViewerProps> = forwardRef((props, ref) => {
|
|||||||
|
|
||||||
const createChunkConnection = async () => {
|
const createChunkConnection = async () => {
|
||||||
chunkRequedtRef.current?.current?.cancel?.();
|
chunkRequedtRef.current?.current?.cancel?.();
|
||||||
chunkRequedtRef.current = setChunkRequest({
|
chunkRequedtRef.current = await setChunkRequest({
|
||||||
url,
|
url,
|
||||||
params: {
|
params: {
|
||||||
...props.params,
|
...props.params,
|
||||||
|
|||||||
@@ -166,11 +166,11 @@ const useSetChunkRequest = () => {
|
|||||||
return axiosToken.current;
|
return axiosToken.current;
|
||||||
};
|
};
|
||||||
|
|
||||||
const setChunkRequest = (config: RequestConfig) => {
|
const setChunkRequest = async (config: RequestConfig) => {
|
||||||
requestConfig.current = { ...particalConfig, ...config };
|
requestConfig.current = { ...particalConfig, ...config };
|
||||||
retryCount.current = totalCount;
|
retryCount.current = totalCount;
|
||||||
clearTimeout(timer.current);
|
clearTimeout(timer.current);
|
||||||
axiosChunkRequest(requestConfig.current);
|
await axiosChunkRequest(requestConfig.current);
|
||||||
return axiosToken;
|
return axiosToken;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@@ -117,7 +117,7 @@ export default function useTableFetch<T>(
|
|||||||
try {
|
try {
|
||||||
const query = _.omit(params || queryParams, ['page', 'perPage']);
|
const query = _.omit(params || queryParams, ['page', 'perPage']);
|
||||||
|
|
||||||
chunkRequedtRef.current = setChunkRequest({
|
chunkRequedtRef.current = await setChunkRequest({
|
||||||
url: `${API}?${qs.stringify(_.pickBy(query, (val: any) => !!val))}`,
|
url: `${API}?${qs.stringify(_.pickBy(query, (val: any) => !!val))}`,
|
||||||
handler: updateHandler
|
handler: updateHandler
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -30,7 +30,7 @@ export default function useWatchList<T = Record<string, any>>(API: string) {
|
|||||||
const createWatchChunkRequest = useMemoizedFn(async () => {
|
const createWatchChunkRequest = useMemoizedFn(async () => {
|
||||||
chunkRequestRef.current?.current?.cancel?.();
|
chunkRequestRef.current?.current?.cancel?.();
|
||||||
try {
|
try {
|
||||||
chunkRequestRef.current = setChunkRequest({
|
chunkRequestRef.current = await setChunkRequest({
|
||||||
url: `${watchAPI}`,
|
url: `${watchAPI}`,
|
||||||
params: {},
|
params: {},
|
||||||
handler: updateWatchDataListHandler
|
handler: updateWatchDataListHandler
|
||||||
|
|||||||
@@ -64,17 +64,11 @@ const AddWorkerSteps: React.FC<AddWorkerProps> = (props) => {
|
|||||||
const [collapseKey, setCollapseKey] = React.useState<Set<string>>(
|
const [collapseKey, setCollapseKey] = React.useState<Set<string>>(
|
||||||
new Set([stepList[0]])
|
new Set([stepList[0]])
|
||||||
);
|
);
|
||||||
const startWatchRef = React.useRef(false);
|
|
||||||
const { update, summary, register } = useSummaryStatus();
|
const { update, summary, register } = useSummaryStatus();
|
||||||
const { addedCount, createModelsChunkRequest } = useAddWorkerMessage({
|
const { addedCount, createModelsChunkRequest } = useAddWorkerMessage();
|
||||||
startWatch: startWatchRef
|
|
||||||
});
|
|
||||||
|
|
||||||
const onToggle = (open: boolean, key: string) => {
|
const onToggle = (open: boolean, key: string) => {
|
||||||
setCollapseKey(open ? new Set([key]) : new Set());
|
setCollapseKey(open ? new Set([key]) : new Set());
|
||||||
if (key === StepNamesMap.RunCommand && open) {
|
|
||||||
startWatchRef.current = true;
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleOnClusterChange = (value: number, row?: any) => {
|
const handleOnClusterChange = (value: number, row?: any) => {
|
||||||
|
|||||||
@@ -58,10 +58,7 @@ const AddWorker: React.FC<AddWorkerProps> = (props) => {
|
|||||||
stepList = []
|
stepList = []
|
||||||
} = props || {};
|
} = props || {};
|
||||||
const intl = useIntl();
|
const intl = useIntl();
|
||||||
const startWatchRef = React.useRef(false);
|
const { addedCount, createModelsChunkRequest } = useAddWorkerMessage();
|
||||||
const { addedCount, createModelsChunkRequest } = useAddWorkerMessage({
|
|
||||||
startWatch: startWatchRef
|
|
||||||
});
|
|
||||||
const firstLoad = React.useRef(true);
|
const firstLoad = React.useRef(true);
|
||||||
const [registrationInfo, setRegistrationInfo] = React.useState<{
|
const [registrationInfo, setRegistrationInfo] = React.useState<{
|
||||||
token: string;
|
token: string;
|
||||||
@@ -83,7 +80,6 @@ const AddWorker: React.FC<AddWorkerProps> = (props) => {
|
|||||||
...data,
|
...data,
|
||||||
cluster_id: value
|
cluster_id: value
|
||||||
});
|
});
|
||||||
startWatchRef.current = true;
|
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
firstLoad.current = false;
|
firstLoad.current = false;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,15 +1,15 @@
|
|||||||
import useSetChunkRequest from '@/hooks/use-chunk-request';
|
import useSetChunkRequest from '@/hooks/use-chunk-request';
|
||||||
import useUpdateChunkedList from '@/hooks/use-update-chunk-list';
|
import useUpdateChunkedList from '@/hooks/use-update-chunk-list';
|
||||||
import _ from 'lodash';
|
import _ from 'lodash';
|
||||||
import { useRef, useState } from 'react';
|
import { useEffect, useRef, useState } from 'react';
|
||||||
import { WORKERS_API } from '../../resources/apis';
|
import { WORKERS_API } from '../../resources/apis';
|
||||||
|
|
||||||
export default function useAddWorkerMessage(params: {
|
export default function useAddWorkerMessage() {
|
||||||
startWatch?: React.RefObject<boolean>;
|
|
||||||
}) {
|
|
||||||
const chunkRequestRef = useRef<any>(null);
|
const chunkRequestRef = useRef<any>(null);
|
||||||
const newItemsRef = useRef<any[]>([]);
|
const newItemsRef = useRef<any[]>([]);
|
||||||
const [addedCount, setAddedCount] = useState(0);
|
const [addedCount, setAddedCount] = useState(0);
|
||||||
|
const startWatchRef = useRef(false);
|
||||||
|
const timerRef = useRef<any>(null);
|
||||||
|
|
||||||
const showAddWorkerMessage = () => {
|
const showAddWorkerMessage = () => {
|
||||||
if (newItemsRef.current.length > 0) {
|
if (newItemsRef.current.length > 0) {
|
||||||
@@ -23,7 +23,7 @@ export default function useAddWorkerMessage(params: {
|
|||||||
events: ['CREATE', 'INSERT'],
|
events: ['CREATE', 'INSERT'],
|
||||||
dataList: [],
|
dataList: [],
|
||||||
onCreate: (newItems: any) => {
|
onCreate: (newItems: any) => {
|
||||||
if (params.startWatch?.current) {
|
if (startWatchRef.current) {
|
||||||
newItemsRef.current = newItemsRef.current.concat(newItems);
|
newItemsRef.current = newItemsRef.current.concat(newItems);
|
||||||
console.log('newItemsRef.current:', newItemsRef.current);
|
console.log('newItemsRef.current:', newItemsRef.current);
|
||||||
showAddWorkerMessage();
|
showAddWorkerMessage();
|
||||||
@@ -37,18 +37,38 @@ export default function useAddWorkerMessage(params: {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const resetAddedCount = () => {
|
||||||
|
setAddedCount(0);
|
||||||
|
newItemsRef.current = [];
|
||||||
|
startWatchRef.current = false;
|
||||||
|
clearTimeout(timerRef.current);
|
||||||
|
};
|
||||||
|
|
||||||
const createModelsChunkRequest = async () => {
|
const createModelsChunkRequest = async () => {
|
||||||
chunkRequestRef.current?.current?.cancel?.();
|
chunkRequestRef.current?.current?.cancel?.();
|
||||||
|
resetAddedCount();
|
||||||
try {
|
try {
|
||||||
chunkRequestRef.current = setChunkRequest({
|
chunkRequestRef.current = await setChunkRequest({
|
||||||
url: WORKERS_API,
|
url: WORKERS_API,
|
||||||
handler: updateHandler
|
handler: updateHandler
|
||||||
});
|
});
|
||||||
|
timerRef.current = setTimeout(() => {
|
||||||
|
startWatchRef.current = true;
|
||||||
|
}, 1000);
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
// ignore
|
// ignore
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
return () => {
|
||||||
|
chunkRequestRef.current?.current?.cancel?.();
|
||||||
|
startWatchRef.current = false;
|
||||||
|
newItemsRef.current = [];
|
||||||
|
clearTimeout(timerRef.current);
|
||||||
|
};
|
||||||
|
}, []);
|
||||||
|
|
||||||
return {
|
return {
|
||||||
addedCount,
|
addedCount,
|
||||||
createModelsChunkRequest
|
createModelsChunkRequest
|
||||||
|
|||||||
@@ -1,8 +1,11 @@
|
|||||||
|
import { clusterSessionAtom } from '@/atoms/clusters';
|
||||||
import IconFont from '@/components/icon-font';
|
import IconFont from '@/components/icon-font';
|
||||||
import ScrollerModal from '@/components/scroller-modal/index';
|
import ScrollerModal from '@/components/scroller-modal/index';
|
||||||
|
import { PageAction } from '@/config';
|
||||||
import useClusterList from '@/pages/cluster-management/hooks/use-cluster-list';
|
import useClusterList from '@/pages/cluster-management/hooks/use-cluster-list';
|
||||||
import { useIntl, useNavigate } from '@umijs/max';
|
import { useIntl, useNavigate } from '@umijs/max';
|
||||||
import { Button } from 'antd';
|
import { Button } from 'antd';
|
||||||
|
import { useAtom } from 'jotai';
|
||||||
import { useMemo, useState } from 'react';
|
import { useMemo, useState } from 'react';
|
||||||
import styled from 'styled-components';
|
import styled from 'styled-components';
|
||||||
|
|
||||||
@@ -53,6 +56,7 @@ const Content = styled.div`
|
|||||||
export default function useAddResource() {
|
export default function useAddResource() {
|
||||||
const intl = useIntl();
|
const intl = useIntl();
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
|
const [, setClusterSession] = useAtom(clusterSessionAtom);
|
||||||
|
|
||||||
const { fetchAll, clusterList, workerList, clustersAtom, workersAtom } =
|
const { fetchAll, clusterList, workerList, clustersAtom, workersAtom } =
|
||||||
useClusterList();
|
useClusterList();
|
||||||
@@ -87,7 +91,27 @@ export default function useAddResource() {
|
|||||||
return isNoResource && !hiddenModal;
|
return isNoResource && !hiddenModal;
|
||||||
}, [isNoResource, hiddenModal]);
|
}, [isNoResource, hiddenModal]);
|
||||||
|
|
||||||
const handleCreate = () => {};
|
const handleCreate = () => {
|
||||||
|
if (clusterList.length === 0) {
|
||||||
|
setClusterSession({
|
||||||
|
firstAddWorker: false,
|
||||||
|
firstAddCluster: true
|
||||||
|
});
|
||||||
|
|
||||||
|
navigate(
|
||||||
|
`/cluster-management/clusters/create?action=${PageAction.CREATE}`
|
||||||
|
);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (workerList.length === 0) {
|
||||||
|
setClusterSession({
|
||||||
|
firstAddWorker: true,
|
||||||
|
firstAddCluster: false
|
||||||
|
});
|
||||||
|
navigate(`/cluster-management/clusters/list`);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
const handleCancel = () => {
|
const handleCancel = () => {
|
||||||
setHiddenModal(true);
|
setHiddenModal(true);
|
||||||
|
|||||||
@@ -72,9 +72,11 @@ const ViewLogsModal: React.FC<ViewModalProps> = (props) => {
|
|||||||
if (!props.id) return;
|
if (!props.id) return;
|
||||||
if (open) {
|
if (open) {
|
||||||
requestRef.current?.current?.cancel?.();
|
requestRef.current?.current?.cancel?.();
|
||||||
requestRef.current = setChunkRequest({
|
setChunkRequest({
|
||||||
url: `${MODELS_API}/${props.modelId}/instances`,
|
url: `${MODELS_API}/${props.modelId}/instances`,
|
||||||
handler: updateHandler
|
handler: updateHandler
|
||||||
|
}).then((res) => {
|
||||||
|
requestRef.current = res;
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
logsViewerRef.current?.abort();
|
logsViewerRef.current?.abort();
|
||||||
|
|||||||
@@ -201,7 +201,7 @@ const Models: React.FC = () => {
|
|||||||
search: search,
|
search: search,
|
||||||
categories: categories
|
categories: categories
|
||||||
};
|
};
|
||||||
chunkRequedtRef.current = setChunkRequest({
|
chunkRequedtRef.current = await setChunkRequest({
|
||||||
url: `${MODELS_API}?${qs.stringify(_.pickBy(query, (val: any) => !!val))}`,
|
url: `${MODELS_API}?${qs.stringify(_.pickBy(query, (val: any) => !!val))}`,
|
||||||
handler: updateHandler
|
handler: updateHandler
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user