From 6029ef535cf835c5d96d45aa5851f72358149181 Mon Sep 17 00:00:00 2001
From: YoannNumericite <85347776+YoannNumericite@users.noreply.github.com>
Date: Fri, 3 Feb 2023 12:35:44 +0100
Subject: [PATCH] feat: see docs on interface sdp (#454)

---
 .husky/pre-commit                             |  4 ++
 formulaire/pages/api/dossier/[id].tsx         | 45 +++++++++++++++-
 formulaire/pages/api/sync/inc/docs/index.tsx  | 51 ++++++++++---------
 formulaire/pages/docs.tsx                     |  1 +
 formulaire/pages/dossier/[id].tsx             |  8 +--
 .../src/components/Dossier/DossierForm.tsx    | 16 +++---
 .../src/components/Dossier/EnfantForm.tsx     |  8 +++
 .../src/components/Dossier/ProjectForm.tsx    |  5 ++
 .../src/components/uiComponents/InputFile.tsx | 19 +++++--
 formulaire/src/context/StateReducer.tsx       |  5 +-
 formulaire/src/fetching/dossiers.tsx          | 22 ++++++--
 package-lock.json                             |  4 +-
 12 files changed, 140 insertions(+), 48 deletions(-)

diff --git a/.husky/pre-commit b/.husky/pre-commit
index 8b1378917..64c624e84 100755
--- a/.husky/pre-commit
+++ b/.husky/pre-commit
@@ -1 +1,5 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+npx lint-staged
 
diff --git a/formulaire/pages/api/dossier/[id].tsx b/formulaire/pages/api/dossier/[id].tsx
index 0dd4eaa8e..62e34aa05 100644
--- a/formulaire/pages/api/dossier/[id].tsx
+++ b/formulaire/pages/api/dossier/[id].tsx
@@ -29,8 +29,12 @@ function getId(req: NextApiRequest): number {
   }
   
   const get: NextApiHandler = async (req, res) => {
+    
     const session = await getSession({ req });
     const prisma = new PrismaClient()   
+
+    var jwt = require('jsonwebtoken');
+
     try {
       const dossierId = getId(req);
       const dossier = await prisma.dossier.findUnique({
@@ -51,7 +55,46 @@ function getId(req: NextApiRequest): number {
         where: { id: dossierId }
       });
       if(dossier?.userId === session?.dbUser.id) {
-        res.status(200).json(dossier);
+        res.status(200).json({dossier: dossier, docs: {
+          dossier: { 
+            id: dossier?.id, 
+            piecesDossier: dossier?.piecesDossier.map((piece) => {
+                let payload = {
+                    iat: new Date().getTime() / 1000,
+                    id: piece.id,
+                    dossierId: dossier.id,
+                    path: piece.link,
+                }
+                let tokenSDP = jwt.sign({...payload}, process.env.SECRET_KEY_DOCS, { expiresIn: 60 * 30 });
+                return {
+                    id: piece.id,
+                    type: piece.type,
+                    statut: piece.statut,
+                    link: `${process.env.NEXTAUTH_URL}/docs?token=${tokenSDP}`
+                }
+            })
+        }, 
+        enfants: dossier?.enfants.map((enfant) => {
+            return {
+                id: enfant.id, 
+                piecesDossier: enfant.piecesDossier.map((piece) => {
+                    let payload = {
+                        iat: new Date().getTime() / 1000,
+                        id: piece.id,
+                        dossierId: dossier.id,
+                        path: piece.link,
+                    }
+                    let tokenSDP = jwt.sign({...payload}, process.env.SECRET_KEY_DOCS, { expiresIn: 60 * 30 });
+                    return {
+                        id: piece.id,
+                        type: piece.type,
+                        statut: piece.statut,
+                        link: `${process.env.NEXTAUTH_URL}/docs?token=${tokenSDP}`
+                    }
+                })
+            }
+        })
+        }});
       } else {
         res.status(401).json({message: 'Unauthorized'})
       }
diff --git a/formulaire/pages/api/sync/inc/docs/index.tsx b/formulaire/pages/api/sync/inc/docs/index.tsx
index 8fbe7549c..c2621ed2a 100644
--- a/formulaire/pages/api/sync/inc/docs/index.tsx
+++ b/formulaire/pages/api/sync/inc/docs/index.tsx
@@ -34,28 +34,11 @@ const get: NextApiHandler = async (req, res) => {
             }
         })
         res.status(200).json({
-            dossier: { 
-                id: dossier?.id, 
-                piecesDossier: dossier?.piecesDossier.map((piece) => {
-                    let payload = {
-                        iat: new Date().getTime() / 1000,
-                        id: piece.id,
-                        dossierId: dossier.id,
-                        path: piece.link,
-                    }
-                    let tokenSDP = jwt.sign({...payload}, process.env.SECRET_KEY_DOCS, { expiresIn: 60 * 30 });
-                    return {
-                        id: piece.id,
-                        type: piece.type,
-                        statut: piece.statut,
-                        link: `${process.env.NEXTAUTH_URL}/docs?token=${tokenSDP}`
-                    }
-                })
-            }, 
-            enfants: dossier?.enfants.map((enfant) => {
-                return {
-                    id: enfant.id, 
-                    piecesDossier: enfant.piecesDossier.map((piece) => {
+            ...dossier,
+            docs: {
+                dossier: { 
+                    id: dossier?.id, 
+                    piecesDossier: dossier?.piecesDossier.map((piece) => {
                         let payload = {
                             iat: new Date().getTime() / 1000,
                             id: piece.id,
@@ -70,8 +53,28 @@ const get: NextApiHandler = async (req, res) => {
                             link: `${process.env.NEXTAUTH_URL}/docs?token=${tokenSDP}`
                         }
                     })
-                }
-            })
+                }, 
+                enfants: dossier?.enfants.map((enfant) => {
+                    return {
+                        id: enfant.id, 
+                        piecesDossier: enfant.piecesDossier.map((piece) => {
+                            let payload = {
+                                iat: new Date().getTime() / 1000,
+                                id: piece.id,
+                                dossierId: dossier.id,
+                                path: piece.link,
+                            }
+                            let tokenSDP = jwt.sign({...payload}, process.env.SECRET_KEY_DOCS, { expiresIn: 60 * 30 });
+                            return {
+                                id: piece.id,
+                                type: piece.type,
+                                statut: piece.statut,
+                                link: `${process.env.NEXTAUTH_URL}/docs?token=${tokenSDP}`
+                            }
+                        })
+                    }
+                })
+            }
         });
     }
 };
diff --git a/formulaire/pages/docs.tsx b/formulaire/pages/docs.tsx
index 7adb8fcde..85208a711 100644
--- a/formulaire/pages/docs.tsx
+++ b/formulaire/pages/docs.tsx
@@ -32,6 +32,7 @@ export const getServerSideProps: GetServerSideProps = async ({query, res}) => {
             'svg': 'image/svg+xml',
             'svgz':  'image/svg+xml',
             'txt': 'text/plain',
+            'xls' : 'application/vnd.ms-excel'
         };
 
         const name = decoded.path.substring(decoded.path.lastIndexOf('/') + 1)
diff --git a/formulaire/pages/dossier/[id].tsx b/formulaire/pages/dossier/[id].tsx
index b3f7c3ea9..0f8439050 100644
--- a/formulaire/pages/dossier/[id].tsx
+++ b/formulaire/pages/dossier/[id].tsx
@@ -6,11 +6,11 @@ import { StateProvider } from 'src/context/StateContext';
 import DossierForm from '../../src/components/Dossier/DossierForm';
 import HeadingDossier from '../../src/components/Dossier/HeadingDossier';
 import Layout from '../../src/components/Layout'
-import { DossierData, getDossier } from '../../src/fetching/dossiers';
+import { DossierData, getDossier, ResDossier } from '../../src/fetching/dossiers';
 
 const DossierPage: React.FC = () => {
   const router = useRouter();
-  const [dossier, setDossier] = React.useState<DossierData>()
+  const [dossier, setDossier] = React.useState<ResDossier>()
 
   const fetchDossier = async () => {
     if (router.query.id) {
@@ -28,7 +28,7 @@ const DossierPage: React.FC = () => {
 
       {dossier && 
         <>
-          <HeadingDossier dossier={dossier}></HeadingDossier>
+          <HeadingDossier dossier={dossier.dossier}></HeadingDossier>
         </>
       }
       <Container>
@@ -36,7 +36,7 @@ const DossierPage: React.FC = () => {
         {dossier && 
           <>
             <StateProvider>
-              <DossierForm dossier={dossier}></DossierForm>
+              <DossierForm dossier={dossier.dossier} docs={dossier.docs}></DossierForm>
             </StateProvider>
           </>
         }
diff --git a/formulaire/src/components/Dossier/DossierForm.tsx b/formulaire/src/components/Dossier/DossierForm.tsx
index f8b28cbd8..705bfb20a 100644
--- a/formulaire/src/components/Dossier/DossierForm.tsx
+++ b/formulaire/src/components/Dossier/DossierForm.tsx
@@ -1,7 +1,7 @@
 
 import { Demandeur, Enfant, SocieteProduction } from "@prisma/client";
 import React, { useContext } from "react";
-import { DossierData, EnfantData, getDossier, updateDossier } from "../../fetching/dossiers";
+import { DossierData, EnfantData, getDossier, ResDocs, updateDossier } from "../../fetching/dossiers";
 import { ButtonLink } from "../../uiComponents/button";
 import styles from "./DossierForm.module.scss";
 import "react-datepicker/dist/react-datepicker.css";
@@ -15,25 +15,20 @@ import Image from "next/image";
 import { sendDossier } from "src/fetching/sync";
 import IconLoader from "../IconLoader";
 import useStateContext from "src/context/StateContext";
-import { updateSociete } from "src/fetching/societeProduction";
 
 interface Props {
     dossier: DossierData
+    docs: ResDocs
 }
 
-const DossierForm: React.FC<Props> = ({ dossier }) => {
+const DossierForm: React.FC<Props> = ({ dossier, docs }) => {
     const router = useRouter()
 
     const [toDisplay, setTodisplay] = React.useState<'Demandeur' | 'Projet' | 'Enfants'>('Demandeur')
-    const [enfantsTmp, setEnfants] = React.useState<EnfantData[]>(dossier.enfants)
     const [messageError, setMessageError] = React.useState<string>('')
     const [messageSuccess, setMessageSuccess] = React.useState<string>('')
     const contextDossier = {...useStateContext()}
 
-    const receiveDataEnfants = (received: EnfantData[]) => {
-        setEnfants(received)
-    }
-
     const saveDossier = useDebouncedCallback(() => {
         console.log('saving dossier ... : ', contextDossier.dossier)
         updateDossier(contextDossier.dossier)
@@ -148,8 +143,13 @@ const DossierForm: React.FC<Props> = ({ dossier }) => {
         contextDossier.processEntity('demandeur', dossier.Demandeur)
         contextDossier.processEntity('societeProduction', dossier.Demandeur.societeProduction ?? {})
         contextDossier.processEntity('enfants', dossier.enfants)
+        contextDossier.processEntity('docs', docs)
     }, [])
 
+    React.useEffect(() => {
+        console.log('docs : ', contextDossier.docs)
+    }, [contextDossier.docs])
+
     return (
         <div className={styles.dossierForm}>
 
diff --git a/formulaire/src/components/Dossier/EnfantForm.tsx b/formulaire/src/components/Dossier/EnfantForm.tsx
index c6f5c69da..ad1e02654 100644
--- a/formulaire/src/components/Dossier/EnfantForm.tsx
+++ b/formulaire/src/components/Dossier/EnfantForm.tsx
@@ -14,6 +14,7 @@ import { createPieceEnfant, deletePieceEnfant } from "src/fetching/pieceEnfant";
 import InputAutocomplete from "../uiComponents/InputAutocomplete";
 import { uploadDoc } from "src/fetching/docs";
 import Link from "next/link";
+import useStateContext from "src/context/StateContext";
 
 interface Props {
     enfant: EnfantData;
@@ -26,6 +27,7 @@ const EnfantForm: React.FC<Props> = ({enfant, allowChanges, refresh}) => {
     const [dataPassed, setDataPassed] = React.useState<Record<'nom' | 'prenom', string>>()
     const [initialRender, setInitialRender] = React.useState<Boolean>(true)
     const [initialDataPassed, setInitialDataPassed] = React.useState<Boolean>(true)
+    const contextDossier = {...useStateContext()}
 
     const handleFormEnfant = (e: React.FormEvent<HTMLInputElement>): void => {
       setEnfant({
@@ -374,6 +376,7 @@ const EnfantForm: React.FC<Props> = ({enfant, allowChanges, refresh}) => {
 
                     <InputFile id={'LIVRET_FAMILLE'} 
                         docs={enfantTmp.piecesDossier || []} 
+                        docsTokenized={contextDossier.docs.enfants.find(enfant => enfant.id === enfantTmp.id)}
                         allowChanges={!allowChanges}
                         label={`Livret de Famille *`} 
                         handleFile={handleFile}
@@ -387,6 +390,7 @@ const EnfantForm: React.FC<Props> = ({enfant, allowChanges, refresh}) => {
 
                     <InputFile id={'AUTORISATION_PARENTALE'} 
                         docs={enfantTmp.piecesDossier || []} 
+                        docsTokenized={contextDossier.docs.enfants.find(enfant => enfant.id === enfantTmp.id)}
                         allowChanges={!allowChanges}
                         label={`Autorisation parentale *`} 
                         handleFile={handleFile}
@@ -400,6 +404,7 @@ const EnfantForm: React.FC<Props> = ({enfant, allowChanges, refresh}) => {
 
                     <InputFile id={'SITUATION_PARTICULIERE'} 
                         docs={enfantTmp.piecesDossier || []} 
+                        docsTokenized={contextDossier.docs.enfants.find(enfant => enfant.id === enfantTmp.id)}
                         allowChanges={!allowChanges}
                         label={`Situation particulière relative à l'autorité parentale`} 
                         handleFile={handleFile}
@@ -413,6 +418,7 @@ const EnfantForm: React.FC<Props> = ({enfant, allowChanges, refresh}) => {
 
                     <InputFile id={'CONTRAT'} 
                         docs={enfantTmp.piecesDossier || []} 
+                        docsTokenized={contextDossier.docs.enfants.find(enfant => enfant.id === enfantTmp.id)}
                         allowChanges={!allowChanges}
                         label={`Projet de contrat de travail *`} 
                         handleFile={handleFile}
@@ -426,6 +432,7 @@ const EnfantForm: React.FC<Props> = ({enfant, allowChanges, refresh}) => {
 
                     <InputFile id={'CERTIFICAT_SCOLARITE'} 
                         docs={enfantTmp.piecesDossier || []} 
+                        docsTokenized={contextDossier.docs.enfants.find(enfant => enfant.id === enfantTmp.id)}
                         allowChanges={!allowChanges}
                         label={`Certificat de scolarité ou avis pédagogique`} 
                         handleFile={handleFile}
@@ -440,6 +447,7 @@ const EnfantForm: React.FC<Props> = ({enfant, allowChanges, refresh}) => {
 
                     <InputFile id={'AVIS_MEDICAL'} 
                         docs={enfantTmp.piecesDossier || []} 
+                        docsTokenized={contextDossier.docs.enfants.find(enfant => enfant.id === enfantTmp.id)}
                         allowChanges={!allowChanges}
                         label={`Avis médical d'aptitude`} 
                         handleFile={handleFile}
diff --git a/formulaire/src/components/Dossier/ProjectForm.tsx b/formulaire/src/components/Dossier/ProjectForm.tsx
index 63adc30a1..a88b2cede 100644
--- a/formulaire/src/components/Dossier/ProjectForm.tsx
+++ b/formulaire/src/components/Dossier/ProjectForm.tsx
@@ -115,6 +115,7 @@ const ProjectForm: React.FC<Props> = ({ allowChanges }) => {
                     <div className={styles.blocForm}>
                         <InputFile id={'SYNOPSIS'} 
                             docs={contextDossier.dossier.piecesDossier} 
+                            docsTokenized={contextDossier.docs.dossier}
                             label={'Synopsis'} 
                             allowChanges={!allowChanges}
                             handleFile={handleFile}
@@ -126,6 +127,7 @@ const ProjectForm: React.FC<Props> = ({ allowChanges }) => {
                     <div className={styles.blocForm}>
                         <InputFile id={'SCENARIO'} 
                             docs={contextDossier.dossier.piecesDossier} 
+                            docsTokenized={contextDossier.docs.dossier}
                             label={'Scenario ou script *'} 
                             allowChanges={!allowChanges}
                             handleFile={handleFile}
@@ -137,6 +139,7 @@ const ProjectForm: React.FC<Props> = ({ allowChanges }) => {
                     <div className={styles.blocForm}>
                         <InputFile id={'MESURES_SECURITE'} 
                             docs={contextDossier.dossier.piecesDossier} 
+                            docsTokenized={contextDossier.docs.dossier}
                             label={'Note précisant les mesures de sécurité *'} 
                             allowChanges={!allowChanges}
                             handleFile={handleFile}
@@ -148,6 +151,7 @@ const ProjectForm: React.FC<Props> = ({ allowChanges }) => {
                     <div className={styles.blocForm}>
                         <InputFile id={'PLAN_TRAVAIL'} 
                             docs={contextDossier.dossier.piecesDossier} 
+                            docsTokenized={contextDossier.docs.dossier}
                             label={'Plan de travail'} 
                             allowChanges={!allowChanges}
                             handleFile={handleFile}
@@ -204,6 +208,7 @@ const ProjectForm: React.FC<Props> = ({ allowChanges }) => {
 
                         <InputFile id={'INFOS_COMPLEMENTAIRES'} 
                             docs={contextDossier.dossier.piecesDossier} 
+                            docsTokenized={contextDossier.docs.dossier}
                             label={`Éléments d'information complémentaires`} 
                             allowChanges={!allowChanges}
                             handleFile={handleFile}
diff --git a/formulaire/src/components/uiComponents/InputFile.tsx b/formulaire/src/components/uiComponents/InputFile.tsx
index 4d5fc9a60..acfbe596f 100644
--- a/formulaire/src/components/uiComponents/InputFile.tsx
+++ b/formulaire/src/components/uiComponents/InputFile.tsx
@@ -1,4 +1,4 @@
-import { JustificatifDossier, JustificatifEnfant, STATUT_PIECE } from "@prisma/client";
+import { JustificatifDossier, JustificatifEnfant, PieceDossier, STATUT_PIECE } from "@prisma/client";
 import Image from "next/image";
 import React from "react";
 import CountPieces from "../CountPieces";
@@ -16,12 +16,13 @@ interface Props {
     label: string,
     text: string,
     docs: Doc[],
+    docsTokenized?: {id: number, piecesDossier: (PieceDossier & {path: string})[]}
     allowChanges: Boolean,
     handleFile: (e: React.ChangeEvent<HTMLInputElement>) => void,
     handleDelete: (id: string) => void
 }
 
-const InputFile: React.FC<Props> = ({ id, label, text, docs, allowChanges, handleFile, handleDelete }) => {
+const InputFile: React.FC<Props> = ({ id, label, text, docs, docsTokenized, allowChanges, handleFile, handleDelete }) => {
 
     return (
         <div className={styles.InputFile}>
@@ -50,7 +51,17 @@ const InputFile: React.FC<Props> = ({ id, label, text, docs, allowChanges, handl
                                         />
                                     </div>
                                 }
-                                <span key={`piece_justificative_${id}_${index}`} className={`${doc.statut === 'REFUSE' ? styles.refused : doc.statut === 'VALIDE' ? styles.accepted : ''}`}>{doc.nom}</span>
+                                
+                                {docsTokenized &&
+                                    <a href={`${docsTokenized.piecesDossier.find(docTmp => docTmp.id === doc.id)?.link}`} 
+                                    target="_blank"
+                                    key={`piece_justificative_${id}_${index}`} 
+                                    className={`${doc.statut === 'REFUSE' ? styles.refused : doc.statut === 'VALIDE' ? styles.accepted : ''}`}
+                                    >{doc.nom}</a>
+                                }
+                                {!docsTokenized &&
+                                    <span key={`piece_justificative_${id}_${index}`} className={`${doc.statut === 'REFUSE' ? styles.refused : doc.statut === 'VALIDE' ? styles.accepted : ''}`}>{doc.nom}</span>
+                                }
                             </div>
                         </div>
                     ))}
@@ -61,7 +72,7 @@ const InputFile: React.FC<Props> = ({ id, label, text, docs, allowChanges, handl
                     <input type="file"
                         id={id} name="justificatif"
                         placeholder="Parcourir..."
-                        accept="image/jpeg,image/gif,image/png,application/pdf,text/plain" onChange={handleFile}>
+                        accept="image/jpeg,image/gif,image/png,application/pdf,text/plain, application/msword, application/vnd.ms-excel" onChange={handleFile}>
                     </input>
                     <p className={styles.smallText}>Documents acceptés : jpeg, png, pdf</p>
                 </div>
diff --git a/formulaire/src/context/StateReducer.tsx b/formulaire/src/context/StateReducer.tsx
index 11718f1fc..b6a6a2fe7 100644
--- a/formulaire/src/context/StateReducer.tsx
+++ b/formulaire/src/context/StateReducer.tsx
@@ -1,5 +1,5 @@
 import { Demandeur, Dossier, Enfant, SocieteProduction } from "@prisma/client"
-import { DossierData, EnfantData } from "src/fetching/dossiers"
+import { DossierData, EnfantData, ResDocs } from "src/fetching/dossiers"
 import { DemandeurData } from "src/lib/types"
 
 export type action = 'SET_ENTITY' | 'SET_INPUT_FOR_ENTITY' | 'SET_FILE'
@@ -8,7 +8,8 @@ export const initialState = {
     dossier: {} as DossierData,
     demandeur: {} as DemandeurData,
     enfants: [] as EnfantData[],
-    societeProduction: {} as SocieteProduction
+    societeProduction: {} as SocieteProduction,
+    docs: {} as ResDocs
 }
 
 export type Contextype = typeof initialState
diff --git a/formulaire/src/fetching/dossiers.tsx b/formulaire/src/fetching/dossiers.tsx
index 4150e7777..7b0735cc9 100644
--- a/formulaire/src/fetching/dossiers.tsx
+++ b/formulaire/src/fetching/dossiers.tsx
@@ -13,7 +13,23 @@ type DossierData = Dossier & {
     societeProduction?: SocieteProduction;
 }
 
+type ResDocs = {
+    dossier: {
+        id: number,
+        piecesDossier: (PieceDossier & {path: string})[]
+    }
+    enfants: [{
+        id: number,
+        piecesDossier: (PieceDossier & {path: string})[]
+    }]
+}
+
 type ResDossier = {
+    dossier: DossierData;
+    docs: ResDocs
+}
+
+type ResDossiers = {
     dossiers: DossierData[]
     countCurrent: number,
     countEnCours: number,
@@ -30,7 +46,7 @@ const getDossiers = async (page: number, status: statusGroup, search: string, te
         }
         return r.json();
     });
-    return fetching as ResDossier
+    return fetching as ResDossiers
 };
 
 const getDossier = async (id: string) => {
@@ -44,7 +60,7 @@ const getDossier = async (id: string) => {
         return r.json();
     });
     console.log('fetching : ', fetching)
-    return fetching as DossierData
+    return fetching as ResDossier
 
 }
 
@@ -89,6 +105,6 @@ const deleteDossier = async (id: number) => {
     return fetching
 };
 
-export type { EnfantData, DossierData, ResDossier }
+export type { EnfantData, DossierData, ResDossiers, ResDossier, ResDocs }
 
 export { getDossier, getDossiers, createDossierEds, updateDossier, deleteDossier }
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index 5c794dd04..4077a53c9 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "enfants-du-spectacle",
-  "version": "1.40.7",
+  "version": "1.41.1",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "enfants-du-spectacle",
-      "version": "1.40.7",
+      "version": "1.41.1",
       "dependencies": {
         "@dataesr/react-dsfr": "^0.9.2",
         "@next-auth/prisma-adapter": "^1.0.0",