diff --git a/src/components/factory.tsx b/src/components/factory.tsx index 80ad3aa..66efdcf 100644 --- a/src/components/factory.tsx +++ b/src/components/factory.tsx @@ -53,7 +53,7 @@ export const copyToClipboard = (value: string, successText?: string, errorText?: } } -type asyncFunction = (...args: any) => Promise +type asyncFunction = (signal: AbortSignal, ...args: any) => Promise type InvokeOptions = { actionName?: string, @@ -75,23 +75,30 @@ const parseApiEror = (err: unknown, options?: InvokeOptions) => { } } -export const invokeWebApiWrapperAsync = async ( +export const invokeWebApiWrapperAsync = ( funcAsync: asyncFunction, setShowLoader?: Dispatch>, errorNotifyText?: FunctionalValue<(err: unknown) => ReactNode>, options?: InvokeOptions, ) => { + const controller = new AbortController() + const signal = controller.signal + setShowLoader?.(true) - try{ - await funcAsync() - } catch (ex) { - if(isDev()) - console.error(ex) - if (!parseApiEror(ex, options)) + funcAsync(signal) + .then((data) => { + if (data !== false) + setShowLoader?.(false) + }) + .catch((ex) => { + setShowLoader?.(false) + if(isDev()) + console.error(ex) + if (parseApiEror(ex, options)) return notify(getFunctionalValue(errorNotifyText)(ex), 'error', options?.well) - } finally { - setShowLoader?.(false) - } + }) + + return () => controller.abort() } export const download = async (url: string, fileName?: string) => { diff --git a/src/pages/Telemetry/TelemetryView/index.jsx b/src/pages/Telemetry/TelemetryView/index.jsx index c0c0242..3b37f3b 100755 --- a/src/pages/Telemetry/TelemetryView/index.jsx +++ b/src/pages/Telemetry/TelemetryView/index.jsx @@ -143,6 +143,7 @@ const TelemetryView = memo(() => { const [dataSpin, setDataSpin] = useState([]) const [chartInterval, setChartInterval] = useState(defaultPeriod) const [showLoader, setShowLoader] = useState(false) + const [isDataLoading, setIsDataLoading] = useState(false) const [flowChartData, setFlowChartData] = useState([]) const [rop, setRop] = useState(null) const [domain, setDomain] = useState({}) @@ -183,19 +184,23 @@ const TelemetryView = memo(() => { }, [spinSubject$]) useEffect(() => { - invokeWebApiWrapperAsync( - async () => { + const cancel = invokeWebApiWrapperAsync( + async (signal) => { + if (signal.aborted) return false const flowChart = await DrillFlowChartService.getByIdWell(well.id) const dataSaub = await TelemetryDataSaubService.getData(well.id, null, chartInterval) const dataSpin = await TelemetryDataSpinService.getData(well.id, null, chartInterval) + if (signal.aborted) return false setFlowChartData(flowChart ?? []) handleDataSaub(dataSaub) handleDataSpin(dataSpin) }, - null, + setIsDataLoading, `Не удалось получить данные`, { actionName: 'Получение данных по скважине', well } ) + + return () => cancel() }, [well, chartInterval, handleDataSpin, handleDataSaub]) useEffect(() => { @@ -282,6 +287,7 @@ const TelemetryView = memo(() => { { { actionName: 'Изменение данных скважины', well } ), [well]) + const wellContext = useMemo(() => [well, updateWell], [well, updateWell]) + return ( @@ -70,7 +72,7 @@ const Well = memo(() => { } /> - +