From 4d546379219f06e09681263cf5adb6241e54e92b Mon Sep 17 00:00:00 2001 From: Joel Date: Fri, 12 Apr 2024 16:02:56 +0800 Subject: [PATCH] chore: replace all set interval (#3411) --- .../base/auto-height-textarea/index.tsx | 12 ++-- .../create/embedding-process/index.tsx | 42 +++++++------- .../documents/detail/embedding/index.tsx | 57 ++++++++++--------- .../share/text-generation/result/index.tsx | 21 +++---- 4 files changed, 70 insertions(+), 62 deletions(-) diff --git a/web/app/components/base/auto-height-textarea/index.tsx b/web/app/components/base/auto-height-textarea/index.tsx index 760badebc277c..f1abbe3c578ed 100644 --- a/web/app/components/base/auto-height-textarea/index.tsx +++ b/web/app/components/base/auto-height-textarea/index.tsx @@ -1,5 +1,6 @@ import { forwardRef, useEffect, useRef } from 'react' import cn from 'classnames' +import { sleep } from '@/utils' type IProps = { placeholder?: string @@ -32,14 +33,13 @@ const AutoHeightTextarea = forwardRef( return false } - const focus = () => { + const focus = async () => { if (!doFocus()) { let hasFocus = false - const runId = setInterval(() => { - hasFocus = doFocus() - if (hasFocus) - clearInterval(runId) - }, 100) + await sleep(100) + hasFocus = doFocus() + if (!hasFocus) + focus() } } diff --git a/web/app/components/datasets/create/embedding-process/index.tsx b/web/app/components/datasets/create/embedding-process/index.tsx index 58160fd5e4eda..5fb34018c6e39 100644 --- a/web/app/components/datasets/create/embedding-process/index.tsx +++ b/web/app/components/datasets/create/embedding-process/index.tsx @@ -21,6 +21,7 @@ import UpgradeBtn from '@/app/components/billing/upgrade-btn' import { useProviderContext } from '@/context/provider-context' import TooltipPlus from '@/app/components/base/tooltip-plus' import { AlertCircle } from '@/app/components/base/icons/src/vender/solid/alertsAndFeedback' +import { sleep } from '@/utils' type Props = { datasetId: string @@ -95,38 +96,41 @@ const EmbeddingProcess: FC = ({ datasetId, batchId, documents = [], index return status.data } - // const [_, setRunId, getRunId] = useGetState>() - const [runId, setRunId] = useState>() - const runIdRef = useRef(runId) - const getRunId = () => runIdRef.current + const [isStopQuery, setIsStopQuery] = useState(false) + const isStopQueryRef = useRef(isStopQuery) useEffect(() => { - runIdRef.current = runId - }, [runId]) + isStopQueryRef.current = isStopQuery + }, [isStopQuery]) const stopQueryStatus = () => { - clearInterval(getRunId()) - setRunId(undefined) + setIsStopQuery(true) } - const startQueryStatus = () => { - const runId = setInterval(async () => { - // It's so strange that the interval can't be cleared after the clearInterval called. And the runId is current. - if (!getRunId()) - return + const startQueryStatus = async () => { + if (isStopQueryRef.current) + return + try { const indexingStatusBatchDetail = await fetchIndexingStatus() - const isCompleted = indexingStatusBatchDetail.every(indexingStatusDetail => ['completed', 'error'].includes(indexingStatusDetail.indexing_status)) - if (isCompleted) + const isCompleted = indexingStatusBatchDetail.every(indexingStatusDetail => ['completed', 'error', 'paused'].includes(indexingStatusDetail.indexing_status)) + if (isCompleted) { stopQueryStatus() - }, 2500) - setRunId(runId) + return + } + await sleep(2500) + await startQueryStatus() + } + catch (e) { + await sleep(2500) + await startQueryStatus() + } } useEffect(() => { - fetchIndexingStatus() startQueryStatus() return () => { stopQueryStatus() } + // eslint-disable-next-line react-hooks/exhaustive-deps }, []) // get rule @@ -154,7 +158,7 @@ const EmbeddingProcess: FC = ({ datasetId, batchId, documents = [], index return indexingStatusBatchDetail.some(indexingStatusDetail => ['indexing', 'splitting', 'parsing', 'cleaning'].includes(indexingStatusDetail?.indexing_status || '')) }, [indexingStatusBatchDetail]) const isEmbeddingCompleted = useMemo(() => { - return indexingStatusBatchDetail.every(indexingStatusDetail => ['completed', 'error'].includes(indexingStatusDetail?.indexing_status || '')) + return indexingStatusBatchDetail.every(indexingStatusDetail => ['completed', 'error', 'paused'].includes(indexingStatusDetail?.indexing_status || '')) }, [indexingStatusBatchDetail]) const getSourceName = (id: string) => { diff --git a/web/app/components/datasets/documents/detail/embedding/index.tsx b/web/app/components/datasets/documents/detail/embedding/index.tsx index 80d1cc3b4bd0e..bb844e35a4817 100644 --- a/web/app/components/datasets/documents/detail/embedding/index.tsx +++ b/web/app/components/datasets/documents/detail/embedding/index.tsx @@ -1,12 +1,11 @@ import type { FC, SVGProps } from 'react' -import React, { useCallback, useEffect, useMemo, useState } from 'react' +import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react' import useSWR from 'swr' import { useRouter } from 'next/navigation' import { useContext } from 'use-context-selector' import { useTranslation } from 'react-i18next' import { omit } from 'lodash-es' import { ArrowRightIcon } from '@heroicons/react/24/solid' -import { useGetState } from 'ahooks' import cn from 'classnames' import SegmentCard from '../completed/SegmentCard' import { FieldInfo } from '../metadata' @@ -18,7 +17,7 @@ import Divider from '@/app/components/base/divider' import { ToastContext } from '@/app/components/base/toast' import type { FullDocumentDetail, ProcessRuleResponse } from '@/models/datasets' import type { CommonResponse } from '@/models/common' -import { asyncRunSafe } from '@/utils' +import { asyncRunSafe, sleep } from '@/utils' import { formatNumber } from '@/utils/format' import { fetchIndexingStatus as doFetchIndexingStatus, fetchIndexingEstimate, fetchProcessRule, pauseDocIndexing, resumeDocIndexing } from '@/service/datasets' import DatasetDetailContext from '@/context/dataset-detail' @@ -120,45 +119,49 @@ const EmbeddingDetail: FC = ({ detail, stopPosition = 'top', datasetId: d const localDocumentId = docId ?? documentId const localIndexingTechnique = indexingType ?? indexingTechnique - const [indexingStatusDetail, setIndexingStatusDetail, getIndexingStatusDetail] = useGetState(null) + const [indexingStatusDetail, setIndexingStatusDetail] = useState(null) const fetchIndexingStatus = async () => { - try { - const status = await doFetchIndexingStatus({ datasetId: localDatasetId, documentId: localDocumentId }) - setIndexingStatusDetail(status) - // eslint-disable-next-line @typescript-eslint/no-use-before-define - startQueryStatus() - } - catch (err) { - // eslint-disable-next-line @typescript-eslint/no-use-before-define - stopQueryStatus() - notify({ type: 'error', message: `error: ${err}` }) - } + const status = await doFetchIndexingStatus({ datasetId: localDatasetId, documentId: localDocumentId }) + setIndexingStatusDetail(status) + return status } - const [runId, setRunId, getRunId] = useGetState(null) - + const [isStopQuery, setIsStopQuery] = useState(false) + const isStopQueryRef = useRef(isStopQuery) + useEffect(() => { + isStopQueryRef.current = isStopQuery + }, [isStopQuery]) const stopQueryStatus = () => { - clearInterval(getRunId()) + setIsStopQuery(true) } - const startQueryStatus = () => { - const runId = setInterval(() => { - const indexingStatusDetail = getIndexingStatusDetail() - if (indexingStatusDetail?.indexing_status === 'completed') { + const startQueryStatus = async () => { + if (isStopQueryRef.current) + return + + try { + const indexingStatusDetail = await fetchIndexingStatus() + if (['completed', 'error', 'paused'].includes(indexingStatusDetail?.indexing_status)) { stopQueryStatus() detailUpdate() return } - fetchIndexingStatus() - }, 2500) - setRunId(runId) + await sleep(2500) + await startQueryStatus() + } + catch (e) { + await sleep(2500) + await startQueryStatus() + } } useEffect(() => { - fetchIndexingStatus() + setIsStopQuery(false) + startQueryStatus() return () => { stopQueryStatus() } + // eslint-disable-next-line react-hooks/exhaustive-deps }, []) const { data: indexingEstimateDetail, error: indexingEstimateErr } = useSWR({ @@ -300,4 +303,4 @@ const EmbeddingDetail: FC = ({ detail, stopPosition = 'top', datasetId: d ) } -export default EmbeddingDetail +export default React.memo(EmbeddingDetail) diff --git a/web/app/components/share/text-generation/result/index.tsx b/web/app/components/share/text-generation/result/index.tsx index 6ccff5a2fdc6b..541365746992f 100644 --- a/web/app/components/share/text-generation/result/index.tsx +++ b/web/app/components/share/text-generation/result/index.tsx @@ -17,6 +17,7 @@ import type { ModerationService } from '@/models/common' import { TransferMethod, type VisionFile, type VisionSettings } from '@/types/app' import { NodeRunningStatus, WorkflowRunningStatus } from '@/app/components/workflow/types' import type { WorkflowProcess } from '@/app/components/base/chat/types' +import { sleep } from '@/utils' export type IResultProps = { isWorkflow: boolean @@ -179,16 +180,16 @@ const Result: FC = ({ onShowRes() setRespondingTrue() - const startTime = Date.now() - let isTimeout = false - const runId = setInterval(() => { - if (Date.now() - startTime > 1000 * 60) { // 1min timeout - clearInterval(runId) + let isEnd = false + let isTimeout = false; + (async () => { + await sleep(1000 * 60) // 1min timeout + if (!isEnd) { setRespondingFalse() onCompleted(getCompletionRes(), taskId, false) isTimeout = true } - }, 1000) + })() if (isWorkflow) { sendWorkflowMessage( @@ -234,7 +235,7 @@ const Result: FC = ({ notify({ type: 'error', message: data.error }) setRespondingFalse() onCompleted(getCompletionRes(), taskId, false) - clearInterval(runId) + isEnd = true return } setWorkflowProccessData(produce(getWorkflowProccessData()!, (draft) => { @@ -249,7 +250,7 @@ const Result: FC = ({ setRespondingFalse() setMessageId(tempMessageId) onCompleted(getCompletionRes(), taskId, true) - clearInterval(runId) + isEnd = true }, }, isInstalledApp, @@ -269,7 +270,7 @@ const Result: FC = ({ setRespondingFalse() setMessageId(tempMessageId) onCompleted(getCompletionRes(), taskId, true) - clearInterval(runId) + isEnd = true }, onMessageReplace: (messageReplace) => { res = [messageReplace.answer] @@ -280,7 +281,7 @@ const Result: FC = ({ return setRespondingFalse() onCompleted(getCompletionRes(), taskId, false) - clearInterval(runId) + isEnd = true }, }, isInstalledApp, installedAppInfo?.id) }