fix: #84 (#87)

InseeFr · Feb 2, 2024 · e77fa78 · e77fa78
1 parent e4ed8f8
commit e77fa78
Show file tree

Hide file tree

Showing 9 changed files with 125 additions and 38 deletions.
diff --git a/src/core/application/port/SurveyUnitRepositoryPort.ts b/src/core/application/port/SurveyUnitRepositoryPort.ts
@@ -11,5 +11,8 @@ export type SurveyUnitRepositoryPort = {
     surveyUnitData: File
   ) => Promise<SurveyUnitsMessages>;
 
+  getSurveyUnitsSchemaCSV: (poguesId: string) => Promise<void>;
+  getExistingSurveyUnitsSchemaCSV: (id: number) => Promise<void>;
+
   resetSurveyUnit: (surveyUnitId: string) => Promise<void>;
 };
diff --git a/src/core/infrastructure/SurveyUnitRepository.ts b/src/core/infrastructure/SurveyUnitRepository.ts
@@ -1,7 +1,11 @@
 import { SurveyUnitsData, SurveyUnitsMessages } from "core/application/model";
 import { SurveyUnitRepositoryPort } from "core/application/port";
 import { getRequest } from "core/utils/http";
-import { postRequestMultiPart, putRequest } from "core/utils/http/fetcher";
+import {
+  fetcherFile,
+  postRequestMultiPart,
+  putRequest,
+} from "core/utils/http/fetcher";
 
 /**
  * Get SurveyUnit Repository
@@ -39,9 +43,20 @@ export function createSurveyUnitRepository(
       undefined
     )(token);
   };
+
+  const getSurveyUnitsSchemaCSV = (poguesId: string): Promise<void> => {
+    return fetcherFile(`${apiUrl}/questionnaires/${poguesId}/csv`, token);
+  };
+
+  const getExistingSurveyUnitsSchemaCSV = (id: number): Promise<void> => {
+    return fetcherFile(`${apiUrl}/questionnaires/${id}/data`, token);
+  };
+
   return {
     getSurveyUnitsData,
     checkSurveyUnitsCSV,
     resetSurveyUnit,
+    getSurveyUnitsSchemaCSV,
+    getExistingSurveyUnitsSchemaCSV,
   };
 }
diff --git a/src/core/utils/http/fetcher.ts b/src/core/utils/http/fetcher.ts
@@ -191,3 +191,34 @@ const resolveErrors = async (response: Response) => {
     }
   });
 };
+
+const getFilenameFromHeader = (header: string | null): string => {
+  if (header) {
+    const res = /filename="(.*)"/.exec(header);
+    return res && res.length > 0 ? res[1] : "default.csv";
+  }
+  return "default.csv";
+};
+
+export const fetcherFile = async (url: string, token?: string) => {
+  const response = await fetch(url, {
+    headers: token ? { Authorization: `Bearer ${token}` } : {},
+    method: "GET",
+  });
+  const { ok, headers } = response;
+  if (ok) {
+    try {
+      const blob = await response.blob();
+      const file = window.URL.createObjectURL(blob);
+      const a = document.createElement("a");
+      a.href = file;
+      a.download = getFilenameFromHeader(headers.get("Content-disposition"));
+      a.click();
+      a.remove();
+    } catch (error) {
+      return resolveErrors(response);
+    }
+  }
+  // network error
+  return resolveErrors(response);
+};
diff --git a/src/ui/components/QuestionnaireEditForm.test.tsx b/src/ui/components/QuestionnaireEditForm.test.tsx
@@ -26,6 +26,9 @@ const checkSurveyUnitsCsvData = vi.fn(() =>
   Promise.resolve(surveyUnitsWarningMessages)
 );
 
+const getSurveyUnitsSchemaCSV = vi.fn(() => Promise.resolve());
+const getExistingSurveyUnitsSchemaCSV = vi.fn(() => Promise.resolve());
+
 beforeEach(async () => {
   // Clear mocks and add some testing data after before each test run
   await vi.clearAllMocks();
@@ -44,6 +47,8 @@ function createQuestionnaireEditFormRouter(isEditMode: boolean) {
             isSubmitting={false}
             saveQuestionnaire={saveQuestionnaire}
             checkSurveyUnitsCsvData={checkSurveyUnitsCsvData}
+            getSurveyUnitsSchemaCSV={getSurveyUnitsSchemaCSV}
+            getExistingSurveyUnitsSchemaCSV={getExistingSurveyUnitsSchemaCSV}
           />
         ),
       },

diff --git a/src/ui/components/QuestionnaireEditForm.tsx b/src/ui/components/QuestionnaireEditForm.tsx
@@ -49,6 +49,8 @@ export type QuestionnaireEditFormProps = {
     unknown
   >;
   isSubmitting: boolean;
+  getSurveyUnitsSchemaCSV: (poguesId: string) => Promise<void>;
+  getExistingSurveyUnitsSchemaCSV: (id: number) => Promise<void>;
 };
 
 export const QuestionnaireEditForm = memo(
@@ -160,6 +162,14 @@ export const QuestionnaireEditForm = memo(
       setDisplayConfirmationDialog(false);
     };
 
+    const getExistingSchema = () => {
+      props.getExistingSurveyUnitsSchemaCSV(questionnaire.id);
+    };
+
+    const getExpectedSchema = () => {
+      props.getSurveyUnitsSchemaCSV(questionnaire.poguesId);
+    };
+
     return (
       <Loader isLoading={isLoading}>
         <Title>{questionnaire.label}</Title>
@@ -248,18 +258,14 @@ export const QuestionnaireEditForm = memo(
               </FormHelperText>
               <Typography variant="body2" gutterBottom>
                 {props.isEditMode && (
-                  <Button
-                    href={`${apiUrl}/questionnaires/${questionnaire.id}/data`}
-                  >
+                  <Button onClick={getExistingSchema}>
                     <FileDownloadIcon></FileDownloadIcon>
                     {intl.formatMessage({
                       id: "questionnaire_edit_existing_csv",
                     })}
                   </Button>
                 )}
-                <Button
-                  href={`${apiUrl}/questionnaires/${questionnaire.poguesId}/csv`}
-                >
+                <Button onClick={getExpectedSchema}>
                   <AttachFileIcon></AttachFileIcon>
                   {intl.formatMessage({
                     id: "questionnaire_schema",

diff --git a/src/ui/pages/QuestionnaireAddPage.test.tsx b/src/ui/pages/QuestionnaireAddPage.test.tsx
@@ -13,6 +13,9 @@ describe("QuestionnaireAddPage", () => {
   const checkSurveyUnitsCsvData = vi.fn(() =>
     Promise.resolve(surveyUnitsWarningMessages)
   );
+  const getSurveyUnitsSchemaCSV = vi.fn(() => Promise.resolve());
+  const getExistingSurveyUnitsSchemaCSV = vi.fn(() => Promise.resolve());
+
   const router = createMemoryRouter(
     [
       {
@@ -23,6 +26,8 @@ describe("QuestionnaireAddPage", () => {
             fetchQuestionnaireFromPoguesId={fetchQuestionnaire}
             fetchSurveyContexts={fetchSurveyContexts}
             checkSurveyUnitsCsvData={checkSurveyUnitsCsvData}
+            getSurveyUnitsSchemaCSV={getSurveyUnitsSchemaCSV}
+            getExistingSurveyUnitsSchemaCSV={getExistingSurveyUnitsSchemaCSV}
           />
         ),
       },

diff --git a/src/ui/pages/QuestionnaireAddPage.tsx b/src/ui/pages/QuestionnaireAddPage.tsx
@@ -22,6 +22,8 @@ export type QuestionnaireAddPageProps = {
     poguesId: string,
     surveyUnitsCsvData: File
   ) => Promise<SurveyUnitsMessages>;
+  getSurveyUnitsSchemaCSV: (poguesId: string) => Promise<void>;
+  getExistingSurveyUnitsSchemaCSV: (id: number) => Promise<void>;
 };
 
 export const QuestionnaireAddPage = memo((props: QuestionnaireAddPageProps) => {
@@ -88,6 +90,10 @@ export const QuestionnaireAddPage = memo((props: QuestionnaireAddPageProps) => {
                 isEditMode={false}
                 fetchSurveyContexts={props.fetchSurveyContexts}
                 checkSurveyUnitsCsvData={props.checkSurveyUnitsCsvData}
+                getSurveyUnitsSchemaCSV={props.getSurveyUnitsSchemaCSV}
+                getExistingSurveyUnitsSchemaCSV={
+                  props.getExistingSurveyUnitsSchemaCSV
+                }
                 saveQuestionnaire={saveQuestionnaire}
                 isSubmitting={isSubmitting}
               />

diff --git a/src/ui/pages/QuestionnaireEditPage.tsx b/src/ui/pages/QuestionnaireEditPage.tsx
@@ -20,6 +20,8 @@ export type QuestionnaireEditPageProps = {
     poguesId: string,
     surveyUnitsData: File
   ) => Promise<SurveyUnitsMessages>;
+  getSurveyUnitsSchemaCSV: (poguesId: string) => Promise<void>;
+  getExistingSurveyUnitsSchemaCSV: (id: number) => Promise<void>;
 };
 
 export const QuestionnaireEditPage = memo(
@@ -43,41 +45,43 @@ export const QuestionnaireEditPage = memo(
       });
 
     return (
-      <>
-        <Grid component="main" container justifyContent="center" spacing={3}>
-          <Grid item xs={12} md={8}>
-            <Block>
-              {questionnaire ? (
-                <>
-                  {!questionnaire.isSynchronized && (
-                    <Alert severity="error">
-                      <AlertTitle>
-                        {intl.formatMessage({
-                          id: "questionnaire_notsynchronized_title",
-                        })}
-                      </AlertTitle>
+      <Grid component="main" container justifyContent="center" spacing={3}>
+        <Grid item xs={12} md={8}>
+          <Block>
+            {questionnaire ? (
+              <>
+                {!questionnaire.isSynchronized && (
+                  <Alert severity="error">
+                    <AlertTitle>
                       {intl.formatMessage({
-                        id: "questionnaire_notsynchronized_message",
+                        id: "questionnaire_notsynchronized_title",
                       })}
-                    </Alert>
-                  )}
+                    </AlertTitle>
+                    {intl.formatMessage({
+                      id: "questionnaire_notsynchronized_message",
+                    })}
+                  </Alert>
+                )}
 
-                  <QuestionnaireEditForm
-                    questionnaire={questionnaire}
-                    isEditMode={true}
-                    fetchSurveyContexts={props.fetchSurveyContexts}
-                    checkSurveyUnitsCsvData={props.checkSurveyUnitsCsvData}
-                    saveQuestionnaire={saveQuestionnaire}
-                    isSubmitting={isSubmitting}
-                  />
-                </>
-              ) : (
-                <Loader isLoading={isLoading}></Loader>
-              )}
-            </Block>
-          </Grid>
+                <QuestionnaireEditForm
+                  questionnaire={questionnaire}
+                  isEditMode={true}
+                  fetchSurveyContexts={props.fetchSurveyContexts}
+                  checkSurveyUnitsCsvData={props.checkSurveyUnitsCsvData}
+                  getExistingSurveyUnitsSchemaCSV={
+                    props.getExistingSurveyUnitsSchemaCSV
+                  }
+                  getSurveyUnitsSchemaCSV={props.getSurveyUnitsSchemaCSV}
+                  saveQuestionnaire={saveQuestionnaire}
+                  isSubmitting={isSubmitting}
+                />
+              </>
+            ) : (
+              <Loader isLoading={isLoading}></Loader>
+            )}
+          </Block>
         </Grid>
-      </>
+      </Grid>
     );
   }
 );

diff --git a/src/ui/root/Application.tsx b/src/ui/root/Application.tsx
@@ -85,6 +85,12 @@ export const Application = memo(() => {
                     checkSurveyUnitsCsvData={
                       surveyUnitRepository.checkSurveyUnitsCSV
                     }
+                    getSurveyUnitsSchemaCSV={
+                      surveyUnitRepository.getSurveyUnitsSchemaCSV
+                    }
+                    getExistingSurveyUnitsSchemaCSV={
+                      surveyUnitRepository.getExistingSurveyUnitsSchemaCSV
+                    }
                   />
                 }
               />
@@ -142,6 +148,12 @@ export const Application = memo(() => {
                     checkSurveyUnitsCsvData={
                       surveyUnitRepository.checkSurveyUnitsCSV
                     }
+                    getSurveyUnitsSchemaCSV={
+                      surveyUnitRepository.getSurveyUnitsSchemaCSV
+                    }
+                    getExistingSurveyUnitsSchemaCSV={
+                      surveyUnitRepository.getExistingSurveyUnitsSchemaCSV
+                    }
                   />
                 }
               ></Route>