Merge main into sweep/user-friendly-error-messages

CNAG-Biomedical-Informatics · Dec 8, 2023 · 6053660 · 6053660
2 parents 22018cb + 15fc6c7
commit 6053660
Show file tree

Hide file tree

Showing 9 changed files with 50 additions and 143 deletions.
diff --git a/...ertPheno_client/src/code/axiosInstance.js → ...ertPheno_client/src/code/AxiosInstance.js b/...ertPheno_client/src/code/axiosInstance.js → ...ertPheno_client/src/code/AxiosInstance.js
diff --git a/convertPheno_client/src/code/apis.js b/convertPheno_client/src/code/apis.js
@@ -10,85 +10,49 @@
   License: GPL-3.0 license
 */
 
-import axiosInstance from "./axiosInstance";
+import axiosInstance from "./AxiosInstance";
+import auth from "./Auth";
 
-export async function fileConversion(token, urlprefix, data) {
+const baseUrl =
+  process.env.NODE_ENV === "production"
+    ? window.REACT_APP_API_URL
+    : import.meta.env.VITE_API_URL;
+
+export async function apiRequest(endpoint, data) {
   try {
-    const res = await axiosInstance.post(`${urlprefix}api/submission/convert`, data, {
+    const url = `${baseUrl}api/${endpoint}`;
+    const res = await axiosInstance.post(url, data, {
       headers: {
-        'Authorization': token
-      }
+        'Authorization': auth.getToken(),
+      },
     });
-    console.log('res', res);
+    console.log(`Response from ${endpoint}:`, res);
     return res;
   } catch (error) {
-    console.error('Error during file conversion:', error);
+    console.error(`Error during ${endpoint} request:`, error);
     throw error;
   }
 }
 
-// TODO
-// reimplment this function using Axios
-export async function fileDownload(token, urlprefix, data, endpoint = "download") {
+export async function fileDownload(endpoint, data) {
   try {
-    const res = await axiosInstance.post(`${urlprefix}api/submission/${endpoint}`, data, {
+    const url = `${baseUrl}api/${endpoint}`;
+    const res = await axiosInstance.post(url, data, {
       headers: {
-        'Authorization': token,
+        'Authorization': auth.getToken(),
       },
       responseType: 'blob'
     });
-    const url = window.URL.createObjectURL(new Blob([res.data]));
+    const objUrl = window.URL.createObjectURL(new Blob([res.data]));
     const a = document.createElement("a");
     a.setAttribute("download", data.downloadName);
     a.style.display = "none";
-    a.href = url;
+    a.href = objUrl;
     document.body.appendChild(a);
     a.click();
-    window.URL.revokeObjectURL(url);
+    window.URL.revokeObjectURL(objUrl);
   } catch (error) {
     console.error('Error during file download:', error);
+    throw error;
   }
 }
-
-export async function getJson(token, urlprefix, data) {
-  return fetch(`${urlprefix}api/clinical/json`, {
-    method: "POST",
-    body: data,
-    headers: {
-      "Content-Type": "application/json",
-      Accept: "application/json",
-      connection: "keep-alive",
-      Authorization: token,
-    },
-  });
-}
-
-export async function getJobData(token, urlprefix, data) {
-  return fetch(`${urlprefix}api/jobs/job`, {
-    method: "POST",
-    body: data,
-    headers: {
-      "Content-Type": "application/json",
-      Accept: "application/json",
-      connection: "keep-alive",
-      Authorization: token,
-    },
-  });
-}
-
-export async function postCaptchaToken(token, urlprefix, data) {
-  console.log("postCaptchaToken data", data);
-  console.log("postCaptchaToken urlprefix", urlprefix);
-  console.log("postCaptchaToken token", token);
-
-  return fetch(`${urlprefix}api/captcha/store`, {
-    method: "POST",
-    body: data,
-    headers: {
-      "Content-Type": "application/json",
-      Accept: "application/json",
-      connection: "keep-alive",
-      Authorization: token,
-    },
-  });
-}
diff --git a/convertPheno_client/src/code/views/conversion/ components/clinicalData/hooks/queryDb.jsx b/convertPheno_client/src/code/views/conversion/ components/clinicalData/hooks/queryDb.jsx
@@ -12,15 +12,7 @@
 
 import { useQuery } from "@tanstack/react-query";
 
-import { getJson } from "../../../../../apis";
-import auth from "../../../../../Auth";
-
-// const api_endpoint = import.meta.env.VITE_API_URL;
-
-const api_endpoint =
-  process.env.NODE_ENV === "production"
-    ? window.REACT_APP_API_URL
-    : import.meta.env.VITE_API_URL;
+import { apiRequest } from "../../../../../apis";
 
 export default function useQueryDb(props) {
   const { query, location, setShownColumns, setHeaders } = props;
@@ -36,16 +28,11 @@ export default function useQueryDb(props) {
   return useQuery({
     queryKey: ["resultsQuery", tabValue, filter, location, shownColumns],
     queryFn: async () => {
-      const res = await getJson(
-        auth.getToken(),
-        api_endpoint,
+      const res = await apiRequest(
+        "clinical/json",
         JSON.stringify(query)
       );
-      if (!res.ok) {
-        const error = await res.json();
-        return Promise.reject(error);
-      }
-      return res.json();
+      return res.data;
     },
     retry: 1,
     retryDelay: 10,

diff --git a/..._client/src/code/views/conversion/ components/submission/components/modals/errorModal.jsx b/..._client/src/code/views/conversion/ components/submission/components/modals/errorModal.jsx
@@ -10,14 +10,13 @@ import {
 } from "@mui/material";
 
 import HCaptcha from "@hcaptcha/react-hcaptcha";
-import { postCaptchaToken, getJobData } from "../../../../../../apis";
+import { apiRequest } from "../../../../../../apis";
 import auth from "../../../../../../Auth";
 
 // TODO
 // another thing which could be used to reset the ratelimit
 // is to trigger a captcha challenge
-
-const api_endpoint =
+const apiBaseUrl =
   process.env.NODE_ENV === "production"
     ? window.REACT_APP_API_URL
     : import.meta.env.VITE_API_URL;
@@ -37,24 +36,11 @@ const handleVerificationSuccess = async (token, ekey, setError) => {
 
   console.log("handleVerificationSuccess data", data);
 
-  // const res = await getJobData(
-  //   auth.getToken(),
-  //   api_endpoint,
-  //   JSON.stringify(data)
-  // );
-
-  const res = await postCaptchaToken(
-    auth.getToken(),
-    api_endpoint,
+  const res = await apiRequest(
+    "captcha/store",
     JSON.stringify(data)
   );
-
-  if (!res.ok) {
-    console.log("handleVerificationSuccess res not ok", res);
-    const error = await res.json();
-    return Promise.reject(error);
-  }
-  return res.json();
+  return res.data;
 
   // const response = await postCaptchaToken(
   //   auth.getToken(),

diff --git a/...on/ components/submission/components/submissionForms/components/fileUpload/FileUpload.jsx b/...on/ components/submission/components/submissionForms/components/fileUpload/FileUpload.jsx
@@ -18,13 +18,6 @@ import InputFormatSelection from "./components/inputFormatSelection/InputFormatS
 import { fileDownload } from "../../../../../../../../apis";
 import auth from "../../../../../../../../Auth";
 
-// const api_endpoint = import.meta.env.VITE_API_URL;
-
-const api_endpoint =
-  process.env.NODE_ENV === "production"
-    ? window.REACT_APP_API_URL
-    : import.meta.env.VITE_API_URL;
-
 export default function fileUpload(props) {
   const {
     inputFormat,
@@ -54,10 +47,9 @@ export default function fileUpload(props) {
       downloadName: inputFormatToFileNameMapping[inputFormat],
     };
     await fileDownload(
-      auth.getToken(),
-      api_endpoint,
-      query,
-      "download/example");
+      "submission/download/example",
+      query
+    );
   };
 
   return (

diff --git a/...onents/submissionForms/components/fileUpload/components/inputFilesPond/InputFilesPond.jsx b/...onents/submissionForms/components/fileUpload/components/inputFilesPond/InputFilesPond.jsx
@@ -3,7 +3,7 @@
 
   This file is part of convert-pheno-ui
 
-  Last modified: Dec/08/2023
+  Last modififed: Dec/08/2023
 
   Copyright (C) 2022-2023 Ivo Christopher Leist - CNAG (Ivo.leist@cnag.eu)
 

diff --git a/...ts/submission/components/submissionSummary/components/downloadButtons/DownloadButtons.jsx b/...ts/submission/components/submissionSummary/components/downloadButtons/DownloadButtons.jsx
@@ -16,13 +16,6 @@ import { Button } from "@mui/material";
 import { fileDownload } from "../../../../../../../../apis";
 import auth from "../../../../../../../../Auth";
 
-// const api_endpoint = import.meta.env.VITE_API_URL;
-
-const api_endpoint =
-  process.env.NODE_ENV === "production"
-    ? window.REACT_APP_API_URL
-    : import.meta.env.VITE_API_URL;
-
 function FileDownloadButton(jobId, tempFilename, newFilename, targetFormat) {
   // better on the server side
   const abbreviationToFullMapping = {
@@ -32,7 +25,10 @@ function FileDownloadButton(jobId, tempFilename, newFilename, targetFormat) {
 
   const data = { jobId, tempFilename, downloadName: newFilename };
   const triggerFileDownload = async (data) => {
-    await fileDownload(auth.getToken(), api_endpoint, data);
+    await fileDownload(
+      "submission/download",
+      data
+    );
   };
   return (
     <Button
@@ -71,7 +67,10 @@ const DownloadAllFilesButton = ({ data }) => {
         downloadName: `${data.jobId}.zip`,
         downloadAllFiles: true,
       };
-      await fileDownload(auth.getToken(), api_endpoint, query);
+      await fileDownload(
+        "submission/download",
+        query
+      );
     } catch (error) {
       console.error("error", error);
     }

diff --git a/...rtPheno_client/src/code/views/conversion/ components/submission/hooks/fileConversions.jsx b/...rtPheno_client/src/code/views/conversion/ components/submission/hooks/fileConversions.jsx
@@ -15,23 +15,16 @@ import { useNavigate } from "react-router-dom";
 import { Typography } from "@mui/material";
 import toast from "react-hot-toast";
 
-import { fileConversion } from "../../../../../apis";
-import auth from "../../../../../Auth";
-
-const api_endpoint =
-  process.env.NODE_ENV === "production"
-    ? window.REACT_APP_API_URL
-    : import.meta.env.VITE_API_URL;
+import { apiRequest } from "../../../../../apis";
 
 export default function useFileConversions(props) {
   const navigate = useNavigate();
   const { startFileConversion, query, onSuccessSetters } = props;
   return useQuery(
     ["allfileconversions"],
     async () => {
-      const res = await fileConversion(
-        auth.getToken(),
-        api_endpoint,
+      const res = await apiRequest(
+        "submission/convert",
         JSON.stringify(query)
       );
       return res.data;

diff --git a/convertPheno_client/src/code/views/conversion/hooks/finishedJobs.jsx b/convertPheno_client/src/code/views/conversion/hooks/finishedJobs.jsx
@@ -11,16 +11,7 @@
 */
 
 import { useQuery } from "@tanstack/react-query";
-
-import { getJobData } from "../../../apis";
-import auth from "../../../Auth";
-
-// const api_endpoint = import.meta.env.VITE_API_URL;
-
-const api_endpoint =
-  process.env.NODE_ENV === "production"
-    ? window.REACT_APP_API_URL
-    : import.meta.env.VITE_API_URL;
+import { apiRequest } from "../../../apis";
 
 export default function useFinishedJobs(props) {
   const { query, conversionFinished } = props;
@@ -29,16 +20,11 @@ export default function useFinishedJobs(props) {
   return useQuery(
     ["finishedJob", jobId],
     async () => {
-      const res = await getJobData(
-        auth.getToken(),
-        api_endpoint,
+      const res = await apiRequest(
+        "jobs/job",
         JSON.stringify(query)
       );
-      if (!res.ok) {
-        const error = await res.json();
-        return Promise.reject(error);
-      }
-      return res.json();
+      return res.data;
     },
     {
       //! when enabled is used query invalidation is not working