From c8050b91e55a0b2c06deff7248e4d2806bbedee0 Mon Sep 17 00:00:00 2001
From: goodmice <av.sirotkin@autodrilling.ru>
Date: Tue, 23 Aug 2022 17:44:02 +0500
Subject: [PATCH] =?UTF-8?q?=D0=98=D1=81=D0=BF=D1=80=D0=B0=D0=B2=D0=BB?=
 =?UTF-8?q?=D0=B5=D0=BD=D0=BE=20=D0=BD=D0=B0=D0=BB=D0=BE=D0=B6=D0=B5=D0=BD?=
 =?UTF-8?q?=D0=B8=D0=B5=20=D1=82=D0=B5=D0=BB=D0=B5=D0=BC=D0=B5=D1=82=D1=80?=
 =?UTF-8?q?=D0=B8=D0=B9=20=D0=BF=D1=80=D0=B8=20=D1=81=D0=BC=D0=B5=D0=BD?=
 =?UTF-8?q?=D0=B5=20=D1=81=D0=BA=D0=B2=D0=B0=D0=B6=D0=B8=D0=BD=D1=8B=20*?=
 =?UTF-8?q?=20=D0=94=D0=BE=D0=B1=D0=B0=D0=B2=D0=BB=D0=B5=D0=BD=D0=BE=20?=
 =?UTF-8?q?=D0=BE=D1=82=D0=BE=D0=B1=D1=80=D0=B0=D0=B6=D0=B5=D0=BD=D0=B8?=
 =?UTF-8?q?=D0=B5=20=D0=B7=D0=B0=D0=B3=D1=80=D1=83=D0=B7=D0=BA=D0=B8=20?=
 =?UTF-8?q?=D0=B3=D1=80=D0=B0=D1=84=D0=B8=D0=BA=D0=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/factory.tsx                  | 29 +++++++++++++--------
 src/pages/Telemetry/TelemetryView/index.jsx | 12 ++++++---
 src/pages/Well.jsx                          |  4 ++-
 3 files changed, 30 insertions(+), 15 deletions(-)

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<any|void>
+type asyncFunction = (signal: AbortSignal, ...args: any) => Promise<any|void>
 
 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<SetStateAction<boolean>>,
   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(() => {
         </GridItem>
         <GridItem col={2} row={2} colSpan={8} rowSpan={2}>
           <D3MonitoringCharts
+            loading={!showLoader && isDataLoading}
             methods={setChartMethods}
             chartName={'monitoring'}
             datasetGroups={chartGroups}
diff --git a/src/pages/Well.jsx b/src/pages/Well.jsx
index a54f6b1..75d6eea 100755
--- a/src/pages/Well.jsx
+++ b/src/pages/Well.jsx
@@ -57,6 +57,8 @@ const Well = memo(() => {
       { actionName: 'Изменение данных скважины', well }
   ), [well])
 
+  const wellContext = useMemo(() => [well, updateWell], [well, updateWell])
+
   return (
     <LayoutPortal>
       <RootPathContext.Provider value={rootPath}>
@@ -70,7 +72,7 @@ const Well = memo(() => {
           <PrivateMenu.Link content={DrillingProgram} icon={<FolderOutlined />} />
         </PrivateMenu>
 
-        <WellContext.Provider value={[well, updateWell]}>
+        <WellContext.Provider value={wellContext}>
           <Layout>
             <Content className={'site-layout-background'}>
               <Routes>