From 839c67918b82999be7ac06764c968c76d1edf476 Mon Sep 17 00:00:00 2001
From: David Inga <david.inga@vizzuality.com>
Date: Mon, 16 Oct 2023 11:43:27 +0200
Subject: [PATCH] fixed when to show data table

---
 .../containers/admin/data-upload-error/component.tsx   | 10 ++++++++++
 client/src/hooks/tasks/index.ts                        |  2 +-
 client/src/pages/data/index.tsx                        |  7 +++----
 3 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/client/src/containers/admin/data-upload-error/component.tsx b/client/src/containers/admin/data-upload-error/component.tsx
index a2d8ce054..f5d626afc 100644
--- a/client/src/containers/admin/data-upload-error/component.tsx
+++ b/client/src/containers/admin/data-upload-error/component.tsx
@@ -50,6 +50,16 @@ const DataUploadError: React.FC<DataUploadErrorProps> = ({ task }) => {
     >
       <div className="flex w-full space-x-6 items-center">
         <div className="space-y-1.5 flex-1">
+          {task?.status === 'processing' && (
+            <>
+              <h3>Upload in progress</h3>
+              <p className="text-gray-500">
+                There is a uploading task in progress created at{' '}
+                {format(new Date(task.createdAt), 'MMM d, yyyy HH:mm z')}.
+              </p>
+            </>
+          )}
+
           {task?.status === 'completed' && task?.errors.length === 0 && (
             <>
               <h3>Upload completed</h3>
diff --git a/client/src/hooks/tasks/index.ts b/client/src/hooks/tasks/index.ts
index eaf9df96f..30cb7cd32 100644
--- a/client/src/hooks/tasks/index.ts
+++ b/client/src/hooks/tasks/index.ts
@@ -58,7 +58,7 @@ export const useLasTask = () => {
     },
   );
 
-  return { ...tasks, data: tasks?.data?.data?.[0] };
+  return { ...tasks, data: tasks?.data?.data?.[0] } as UseQueryResult<TaskAPIResponse>;
 };
 
 export function useTask(
diff --git a/client/src/pages/data/index.tsx b/client/src/pages/data/index.tsx
index 34c919ae0..2f6f48bf5 100644
--- a/client/src/pages/data/index.tsx
+++ b/client/src/pages/data/index.tsx
@@ -1,3 +1,4 @@
+import { useMemo } from 'react';
 import Head from 'next/head';
 
 import { useSourcingLocations } from 'hooks/sourcing-locations';
@@ -19,7 +20,7 @@ const AdminDataPage: React.FC = () => {
   // Getting last task to check if there is a processing task
   const { data: lastTask } = useLasTask();
 
-  const thereIsData = data?.meta?.totalItems > 0;
+  const thereIsData = useMemo(() => data?.meta?.totalItems > 0, [data?.meta?.totalItems]);
 
   return (
     <AdminLayout
@@ -45,9 +46,7 @@ const AdminDataPage: React.FC = () => {
       )}
 
       {/* Content when empty, or upload is processing or failed */}
-      {isFetched && (lastTask?.status === 'processing' || !thereIsData) && (
-        <AdminDataUploader task={lastTask} />
-      )}
+      {isFetched && !thereIsData && <AdminDataUploader task={lastTask} />}
 
       {/* Content when data and upload is completed */}
       {isFetched && thereIsData && <AdminDataTable task={lastTask} />}