backoffice ui

1 files changed, 63 insertions, 49 deletions

diff --git a/packages/merchant-backoffice-ui/src/hooks/templates.ts b/packages/merchant-backoffice-ui/src/hooks/templates.ts
index 56cdd3046..ee8728cc8 100644
--- a/packages/merchant-backoffice-ui/src/hooks/templates.ts
+++ b/packages/merchant-backoffice-ui/src/hooks/templates.ts
@@ -82,10 +82,19 @@ export function useTemplateAPI(): TemplateAPI {
     return res;
   };
 
+  const testTemplateExist = async (
+    templateId: string,
+  ): Promise<HttpResponseOk<void>> => {
+    const res = await request<void>(`/private/templates/${templateId}`, { method: "GET", });
+    return res;
+  };
+
+
   return {
     createTemplate,
     updateTemplate,
     deleteTemplate,
+    testTemplateExist,
     createOrderFromTemplate,
   };
 }
@@ -98,6 +107,9 @@ export interface TemplateAPI {
     id: string,
     data: MerchantBackend.Template.TemplatePatchDetails,
   ) => Promise<HttpResponseOk<void>>;
+  testTemplateExist: (
+    id: string
+  ) => Promise<HttpResponseOk<void>>;
   deleteTemplate: (id: string) => Promise<HttpResponseOk<void>>;
   createOrderFromTemplate: (
     id: string,
@@ -119,11 +131,11 @@ export function useInstanceTemplates(
 > {
   const { templateFetcher } = useBackendInstanceRequest();
 
-  // const [pageBefore, setPageBefore] = useState(1);
+  const [pageBefore, setPageBefore] = useState(1);
   const [pageAfter, setPageAfter] = useState(1);
 
   const totalAfter = pageAfter * PAGE_SIZE;
-  // const totalBefore = args?.position !== undefined ? pageBefore * PAGE_SIZE : 0;
+  const totalBefore = args?.position ? pageBefore * PAGE_SIZE : 0;
 
   /**
    * FIXME: this can be cleaned up a little
@@ -131,20 +143,20 @@ export function useInstanceTemplates(
    * the logic of double query should be inside the orderFetch so from the hook perspective and cache
    * is just one query and one error status
    */
-  // const {
-  //   data: beforeData,
-  //   error: beforeError,
-  //   isValidating: loadingBefore,
-  // } = useSWR<HttpResponseOk<MerchantBackend.Template.TemplateSummaryResponse>, HttpError>(
-  //   [
-  //     `/private/templates`,
-  //     token,
-  //     url,
-  //     args?.position,
-  //     totalBefore,
-  //   ],
-  //   templateFetcher,
-  // );
+  const {
+    data: beforeData,
+    error: beforeError,
+    isValidating: loadingBefore,
+  } = useSWR<
+    HttpResponseOk<MerchantBackend.Template.TemplateSummaryResponse>,
+    RequestError<MerchantBackend.ErrorDetail>>(
+      [
+        `/private/templates`,
+        args?.position,
+        totalBefore,
+      ],
+      templateFetcher,
+    );
   const {
     data: afterData,
     error: afterError,
@@ -155,9 +167,13 @@ export function useInstanceTemplates(
   >([`/private/templates`, args?.position, -totalAfter], templateFetcher);
 
   //this will save last result
-  // const [lastBefore, setLastBefore] = useState<
-  //   HttpResponse<MerchantBackend.Template.TemplateSummaryResponse, MerchantBackend.ErrorDetail>
-  // >({ loading: true });
+  const [lastBefore, setLastBefore] = useState<
+    HttpResponse<
+      MerchantBackend.Template.TemplateSummaryResponse,
+      MerchantBackend.ErrorDetail
+    >
+  >({ loading: true });
+
   const [lastAfter, setLastAfter] = useState<
     HttpResponse<
       MerchantBackend.Template.TemplateSummaryResponse,
@@ -166,19 +182,18 @@ export function useInstanceTemplates(
   >({ loading: true });
   useEffect(() => {
     if (afterData) setLastAfter(afterData);
-    // if (beforeData) setLastBefore(beforeData);
-  }, [afterData /*, beforeData*/]);
+    if (beforeData) setLastBefore(beforeData);
+  }, [afterData, beforeData]);
 
-  // if (beforeError) return beforeError;
+  if (beforeError) return beforeError.cause;
   if (afterError) return afterError.cause;
 
   // if the query returns less that we ask, then we have reach the end or beginning
   const isReachingEnd =
     afterData && afterData.data.templates.length < totalAfter;
-  const isReachingStart = false;
-  // args?.position === undefined
-  // ||
-  // (beforeData && beforeData.data.templates.length < totalBefore);
+  const isReachingStart = args?.position === undefined
+    ||
+    (beforeData && beforeData.data.templates.length < totalBefore);
 
   const pagination = {
     isReachingEnd,
@@ -188,37 +203,36 @@ export function useInstanceTemplates(
       if (afterData.data.templates.length < MAX_RESULT_SIZE) {
         setPageAfter(pageAfter + 1);
       } else {
-        const from = `${
-          afterData.data.templates[afterData.data.templates.length - 1]
-            .template_id
-        }`;
+        const from = `${afterData.data.templates[afterData.data.templates.length - 1]
+          .template_id
+          }`;
         if (from && updatePosition) updatePosition(from);
       }
     },
     loadMorePrev: () => {
-      // if (!beforeData || isReachingStart) return;
-      // if (beforeData.data.templates.length < MAX_RESULT_SIZE) {
-      //   setPageBefore(pageBefore + 1);
-      // } else if (beforeData) {
-      //   const from = `${beforeData.data.templates[beforeData.data.templates.length - 1]
-      //     .template_id
-      //     }`;
-      //   if (from && updatePosition) updatePosition(from);
-      // }
+      if (!beforeData || isReachingStart) return;
+      if (beforeData.data.templates.length < MAX_RESULT_SIZE) {
+        setPageBefore(pageBefore + 1);
+      } else if (beforeData) {
+        const from = `${beforeData.data.templates[beforeData.data.templates.length - 1]
+          .template_id
+          }`;
+        if (from && updatePosition) updatePosition(from);
+      }
     },
   };
 
-  const templates = !afterData ? [] : (afterData || lastAfter).data.templates;
-  // const templates =
-  //   !beforeData || !afterData
-  //     ? []
-  //     : (beforeData || lastBefore).data.templates
-  //       .slice()
-  //       .reverse()
-  //       .concat((afterData || lastAfter).data.templates);
-  if (loadingAfter /* || loadingBefore */)
+  // const templates = !afterData ? [] : (afterData || lastAfter).data.templates;
+  const templates =
+    !beforeData || !afterData
+      ? []
+      : (beforeData || lastBefore).data.templates
+        .slice()
+        .reverse()
+        .concat((afterData || lastAfter).data.templates);
+  if (loadingAfter || loadingBefore)
     return { loading: true, data: { templates } };
-  if (/*beforeData &&*/ afterData) {
+  if (beforeData && afterData) {
     return { ok: true, data: { templates }, ...pagination };
   }
   return { loading: true };