export function ClusterVerify()

in frontend/src/routes/space/access-cluster/steps/cluster-verify/cluster-verify.tsx [36:148]
110 lines of code
11 McCabe index (conditional complexity)

export function ClusterVerify(props: any) {
    const [activeKey, setActiveKey] = useState(DorisNodeTypeEnum.FE);
    const { reqInfo } = useContext(NewSpaceInfoContext);
    const [instance, setInstance] = useState([]);
    const [nodeTypes, setNodeTypes] = useState<any[]>([]);
    const [feNodes, setFENodes] = useState([]);
    const [beNodes, setBENodes] = useState([]);
    const [brokerNodes, setBrokerNodes] = useState([]);
    const [stepDisabled, setStepDisabled] = useRecoilState(stepDisabledState);

    const columns = [
        {
            title: '序号',
            dataIndex: 'instanceId',
            key: 'instanceId',
        },
        {
            title: '节点IP',
            dataIndex: 'nodeHost',
            key: 'nodeHost',
        },
        {
            title: '校验结果',
            key: 'operateStatus',
            render: (record: any) => {
                return (
                    <Steps
                        progressDot={(iconDot, { status }) => {
                            if (status === 'process') return <LoadingOutlined style={{ color: '#1890ff' }} />;
                            return iconDot;
                        }}
                        current={record.operateStage - 1}
                        size="small"
                        style={{ marginLeft: -50 }}
                        status={OperateStatusEnum.getStepStatus(record.operateStatus)}
                    >
                        <Step style={{ width: 80 }} />
                    </Steps>
                );
            },
        },
    ];
    const getClusterInstance = useRequest<IResult<any>, any>(
        (clusterId: string) => {
            return SpaceAPI.getClusterInstance<any>({ clusterId });
        },
        {
            manual: true,
            pollingInterval: 2000,
            onSuccess: (res: any) => {
                if (isSuccess(res)) {
                    const data: any[] = res.data;
                    setInstance(res.data);
                    const types = [];
                    const feNodes = res.data.filter(item => item.moduleName?.toUpperCase() === DorisNodeTypeEnum.FE);
                    const beNodes = res.data.filter(item => item.moduleName?.toUpperCase() === DorisNodeTypeEnum.BE);
                    const brokerNodes = res.data.filter(
                        (item: any) => item.moduleName?.toUpperCase() === DorisNodeTypeEnum.BROKER,
                    );
                    setFENodes(feNodes);
                    setBENodes(beNodes);
                    setBrokerNodes(brokerNodes);
                    if (feNodes.length > 0) {
                        types.push({ key: DorisNodeTypeEnum.FE, tab: 'FE节点', moduleName: DorisNodeTypeEnum.FE });
                    }
                    if (beNodes.length > 0) {
                        types.push({ key: DorisNodeTypeEnum.BE, tab: 'BE节点', moduleName: DorisNodeTypeEnum.BE });
                    }
                    if (brokerNodes.length > 0) {
                        types.push({
                            key: DorisNodeTypeEnum.BROKER,
                            tab: 'Broker节点',
                            moduleName: DorisNodeTypeEnum.BROKER,
                        });
                    }
                    setNodeTypes(types);
                    const failedInstance = data.find(item => ERROR_STATUS.includes(item.operateStatus));
                    if (failedInstance) {
                        message.error(failedInstance.operateResult);
                    }
                    const CANCEL_STATUS = [OperateStatusEnum.PROCESSING, OperateStatusEnum.INIT];
                    if (data.filter(item => CANCEL_STATUS.includes(item.operateStatus)).length === 0) {
                        getClusterInstance.cancel();
                    }
                    if (data.filter(item => item.operateStatus !== OperateStatusEnum.SUCCESS).length > 0) {
                        setStepDisabled({ ...stepDisabled, next: true });
                    } else {
                        setStepDisabled({ ...stepDisabled, next: false });
                    }
                }
            },
            onError: () => {
                if (reqInfo.cluster_id) {
                    message.error('请求出错');
                    getClusterInstance.cancel();
                }
            },
        },
    );

    useEffect(() => {
        if (reqInfo.cluster_id) {
            getClusterInstance.run(reqInfo.cluster_id);
        }
    }, [reqInfo.cluster_id]);

    return (
        <PageContainer
            header={{
                title: <h2>校验集群</h2>,
            }}
        >
            <Tabs activeKey={activeKey} onChange={(key: any) => setActiveKey(key)} type="card">