Merge branch 'main' into 2633-RefactoAppHomePage

.codeclimate.yml

@@ -29,7 +29,3 @@ exclude_patterns:
   - "**/vendor/"
   - "**/*_test.go"
   - "**/*.d.ts"
-  - "**/snu-lib/"
-  - "**/*.ts"
-  - "snu-lib/"
-  - "lib/"

.github/workflows/mirroring.yml

@@ -2,7 +2,7 @@ name: Mirroring
 
 on:
   push:
-    branches: [main]
+    branches: [production_state]
 
 jobs:
   mirror:

admin/Dockerfile

@@ -30,7 +30,7 @@ RUN npm install
 # Build the project and its dependencies
 COPY --from=builder /app/out/full/ .
 COPY turbo.json turbo.json
-COPY front.tsconfig.json front.tsconfig.json
+COPY tsconfig.front.json tsconfig.front.json
 
 ARG RELEASE=""
 ENV RELEASE=${RELEASE}

admin/package.json

@@ -31,7 +31,7 @@
     "browser-image-resizer": "^2.4.1",
     "chart.js": "^4.2.1",
     "core-js": "3.26.0",
-    "date-fns": "^2.30.0",
+    "date-fns": "^3.6.0",
     "dayjs": "1.11.9",
     "fetch-retry": "^5.0.6",
     "file-saver": "2.0.5",
@@ -45,7 +45,7 @@
     "react-beautiful-dnd": "13.1.1",
     "react-chartjs-2": "^5.2.0",
     "react-datepicker": "^4.8.0",
-    "react-day-picker": "^8.6.0",
+    "react-day-picker": "^8.10.1",
     "react-dom": "18.2.0",
     "react-hook-form": "^7.43.9",
     "react-icons": "4.11.0",

admin/src/app.jsx

@@ -53,26 +53,26 @@ const DashboardHeadCenterV2 = lazy(() => import("./scenes/dashboardV2/head-cente
 const DashboardV2 = lazy(() => import("./scenes/dashboardV2/moderator-ref"));
 const DashboardResponsibleV2 = lazy(() => import("./scenes/dashboardV2/responsible"));
 const DashboardVisitorV2 = lazy(() => import("./scenes/dashboardV2/visitor"));
+const Team = lazy(() => import("./scenes/team"));
 
 import Loader from "./components/Loader";
-const Footer = lazy(() => import("./components/footer"));
+import Footer from "./components/footer";
 
 import api, { initApi } from "./services/api";
 
 import { adminURL, environment } from "./config";
 import { ROLES, ROLES_LIST } from "./utils";
 
-const ModalCGU = lazy(() => import("./components/modals/ModalCGU"));
+import ModalCGU from "./components/modals/ModalCGU";
 import "./index.css";
-const Team = lazy(() => import("./scenes/team"));
 
 import { getCohorts } from "./services/cohort.service";
-const RestorePreviousSignin = lazy(() => import("./components/RestorePreviousSignin"));
+import RestorePreviousSignin from "./components/RestorePreviousSignin";
 import useRefreshToken from "./hooks/useRefreshToken";
 
-const SideBar = lazy(() => import("./components/drawer/SideBar"));
-const ApplicationError = lazy(() => import("./components/layout/ApplicationError"));
-const NotFound = lazy(() => import("./components/layout/NotFound"));
+import SideBar from "./components/drawer/SideBar";
+import ApplicationError from "./components/layout/ApplicationError";
+import NotFound from "./components/layout/NotFound";
 import { getDefaultSession } from "./utils/session";
 import { COHORTS_ACTIONS } from "./redux/cohorts/actions";
 

admin/src/components/PaginationServerDriven.tsx

@@ -62,6 +62,7 @@ export default function PaginationServerDriven({ currentPageNumber, setCurrentPa
             placeholder="par page"
             defaultValue={sizeOptions[0].value}
             options={sizeOptions}
+            closeMenuOnSelect={true}
             value={sizeOptions.find((option) => Number(option.value) === size) || null}
             onChange={(option) => {
               checkSize(Number(option.value));

admin/src/components/drawer/components/invite.jsx

@@ -398,7 +398,9 @@ const Invitation = styled.div`
     background-clip: padding-box;
     border: 1px solid #ced4da;
     border-radius: 0.25rem;
-    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+    transition:
+      border-color 0.15s ease-in-out,
+      box-shadow 0.15s ease-in-out;
   }
   h3 {
     border: 1px solid ${colors.red};

admin/src/components/filters-system-v2/components/Filters.jsx

@@ -28,8 +28,8 @@ export default function Filters({
   setParamData,
   defaultUrlParam = undefined,
   size,
-  intermediateFilters = undefined,
-  disabled,
+  intermediateFilters = [],
+  disabled = false,
 }) {
   const [search, setSearch] = useState("");
   const [dataFilter, setDataFilter] = useState({});
@@ -243,7 +243,7 @@ export default function Filters({
                                 ?.map((item) => {
                                   let customItem = item;
                                   const intermediateFilter = intermediateFilters?.find((intermediateFilter) => intermediateFilter.key === item.name);
-                                  if (intermediateFilters && intermediateFilter && item.name === intermediateFilter?.key) {
+                                  if (intermediateFilters.length > 0 && intermediateFilter && item.name === intermediateFilter?.key) {
                                     customItem = {
                                       ...item,
                                       allowEmpty: false,

admin/src/components/filters-system-v2/components/Save.jsx

@@ -7,7 +7,7 @@ import { toastr } from "react-redux-toastr";
 import api from "../../../services/api";
 import { useHistory } from "react-router-dom";
 
-export default function Save({ filterArray, selectedFilters, page = 1, pageId, disabled }) {
+export default function Save({ filterArray, selectedFilters, page = 1, pageId, disabled = false }) {
   // handle click outside
   const ref = React.useRef();
   const [nameView, setNameView] = React.useState("");

admin/src/components/filters-system-v2/components/SelectedFilters.jsx

@@ -4,7 +4,7 @@ import { DropDown } from "./filters/FilterPopOver";
 import { Popover } from "@headlessui/react";
 import Trash from "../../../assets/icons/Trash";
 
-export default function SelectedFilters({ filterArray, selectedFilters, setSelectedFilters, paramData, setParamData, disabled }) {
+export default function SelectedFilters({ filterArray, selectedFilters, setSelectedFilters, paramData, setParamData, disabled = false }) {
   // check if all filters are defaultValue if yes, we don't show the delete button
   const hasOnlyDefaultFiltersSelected = useMemo(
     () =>

admin/src/components/filters-system-v2/components/filters/FilterPopOver.tsx

@@ -82,9 +82,10 @@ export const DropDown = ({ isShowing, filter, selectedFilters, setSelectedFilter
   const ref: React.MutableRefObject<any> = React.useRef(null);
   React.useEffect(() => {
     if (!data) return;
-    const temp = data;
+    let temp = data;
+
     if (filter?.filter) {
-      temp.filter(filter.filter);
+      temp = temp.filter(filter.filter);
     }
     if (filter?.sort) {
       filter.sort(temp);
@@ -102,9 +103,8 @@ export const DropDown = ({ isShowing, filter, selectedFilters, setSelectedFilter
         data[emptyIndex].key = "N/A";
       }
     }
-
     setOptionsVisible(temp);
-  }, [data, filter]);
+  }, [data, filter, selectedFilters]);
 
   React.useEffect(() => {
     // normalize search

admin/src/components/layout/GenericError.jsx

@@ -24,7 +24,7 @@ export default function GenericError({ title = "Une erreur s’est produite !",
         </a>{" "}
         ou revenez à l’accueil.
         <br />
-        Si le problème persiste n’hésitezpas à{" "}
+        Si le problème persiste n’hésitez pas à{" "}
         <a href={`${adminURL}/besoin-d-aide?from=${window.location.pathname}`} className="underline">
           nous contacter
         </a>

admin/src/index.jsx

@@ -4,15 +4,22 @@ import React from "react";
 import ReactDOM from "react-dom/client";
 import { Provider } from "react-redux";
 import ReduxToastr from "react-redux-toastr";
+import { captureMessage } from "./sentry";
 import "react-redux-toastr/lib/css/react-redux-toastr.min.css";
 import "react-day-picker/dist/style.css";
 
 import { Chart as ChartJS, ArcElement, Tooltip, Legend, LinearScale } from "chart.js";
 ChartJS.register(ArcElement, Tooltip, Legend, LinearScale);
 
 import store from "./redux/store";
+
 import App from "./app.jsx";
 
+window.addEventListener("vite:preloadError", (event) => {
+  captureMessage("Preloading Error", event);
+  window.location.reload(true);
+});
+
 ReactDOM.createRoot(document.getElementById("root")).render(
   <React.StrictMode>
     <Provider store={store}>

admin/src/scenes/centersV2/components/Field.tsx

@@ -15,7 +15,7 @@ interface Props {
   copy?: string;
   className?: string;
   tooltips?: string | null;
-  onChange: ChangeEventHandler<HTMLInputElement>;
+  onChange?: ChangeEventHandler<HTMLInputElement>;
 }
 
 export default function Field({ onChange, value, label, disabled = false, error, readOnly = false, copy, className = "", tooltips = null }: Props) {
@@ -52,13 +52,7 @@ export default function Field({ onChange, value, label, disabled = false, error,
             {copied ? <HiCheckCircle className="h-4 w-4 text-green-500" /> : <BiCopy className="h-4 w-4 text-gray-400" />}
           </div>
         )}
-        <input
-          className={`w-full ${disabled ? "bg-gray-100" : ""} ${readOnly && "cursor-default"}`}
-          value={value}
-          onChange={onChange}
-          disabled={disabled}
-          readOnly={readOnly}
-        />
+        <input className={`w-full ${disabled ? "bg-gray-100" : ""} ${readOnly && "cursor-default"}`} value={value} onChange={onChange} disabled={disabled} readOnly={readOnly} />
       </div>
       {error && <div className="text-[#EF4444]">{error}</div>}
     </div>

admin/src/scenes/centersV2/components/ModalRattacherCentre.tsx

@@ -3,7 +3,7 @@ import { useSelector } from "react-redux";
 import { toastr } from "react-redux-toastr";
 import { useHistory } from "react-router-dom";
 
-import { translate, isSessionEditionOpen, validateEmailAcademique } from "snu-lib";
+import { translate, isSessionEditionOpen, validateEmailAcademique, COHORT_TYPE } from "snu-lib";
 import { InputText, Label, Select } from "@snu/ds/admin";
 import Sejour from "@/scenes/dashboardV2/components/ui/icons/Sejour";
 import { Center, User } from "@/types";
@@ -34,26 +34,15 @@ export default function ModalRattacherCentre({ isOpen, onSuccess, onCancel, user
   const [isLoading, setIsLoading] = React.useState(false);
   const disabled = !selectedCohort || !selectedCentre || !placesTotal || isLoading;
 
+  const selectedCohortData = cohorts.find((c) => c.name === selectedCohort);
+
   const fetchCenters = async (q: string) => {
     const { responses } = await api.post("/elasticsearch/cohesioncenter/not-in-cohort/" + selectedCohort, { filters: { searchbar: [q] } });
     const options = responses[0].hits.hits.map((hit) => ({ label: hit._source.name, value: hit._id, center: { ...hit._source, _id: hit._id } }));
-    options.push({
-      label: (
-        <div className="p-1 border-t-2 text-center">
-          <p className="mt-2 text-center">Le centre n'est pas dans la liste ?</p>
-          <p className="mt-2 text-blue-600">Créer un centre</p>
-        </div>
-      ),
-      value: "new",
-    });
     return options;
   };
 
   const handleChange = (option) => {
-    if (option.value === "new") {
-      history.push(`/centre/nouveau?cohort=${selectedCohort}`);
-      return;
-    }
     setSelectedCentre(option.center);
   };
 
@@ -134,15 +123,19 @@ export default function ModalRattacherCentre({ isOpen, onSuccess, onCancel, user
             <InputText name="placesTotal" label="Nombre de places ouvertes" onChange={(e) => setPlacesTotal(e.target.value)} value={placesTotal} className="mt-3" />
           </>
         )}
-        <>
-          <Label
-            title="Réception des fiches sanitaires (facultatif)"
-            tooltip="Si vous renseignez l'adresse email suivante, elle sera visible sur l'espace personnel des volontaires. Ils seront ainsi invités à envoyer leurs fiches sanitaires à cette adresse. Seules les adresses emails académiques sécurisées sont autorisées."
-            name="email"
-            className="my-3"
-          />
-          <InputText name="email" label="Adresse email académique" onChange={(e) => setEmail(e.target.value)} value={email} error={errors.email} />
-        </>
+
+        {selectedCohortData?.type === COHORT_TYPE.VOLONTAIRE && (
+          <>
+            <Label
+              title="Réception des fiches sanitaires (facultatif)"
+              tooltip="Si vous renseignez l'adresse email suivante, elle sera visible sur l'espace personnel des volontaires. Ils seront ainsi invités à envoyer leurs fiches sanitaires à cette adresse. Seules les adresses emails académiques sécurisées sont autorisées."
+              name="email"
+              className="my-3"
+            />
+            <InputText name="email" label="Adresse email académique" onChange={(e) => setEmail(e.target.value)} value={email} error={errors.email} />
+          </>
+        )}
+
         <div className="mt-10 flex items-center gap-4">
           <button type="button" onClick={onCancel} className="w-1/2 rounded-lg border-[1px] border-gray-300 py-2">
             Annuler

admin/src/scenes/centersV2/components/Toggle.jsx → admin/src/scenes/centersV2/components/Toggle.tsx

@@ -5,11 +5,17 @@ function classNames(...classes) {
   return classes.filter(Boolean).join(" ");
 }
 
-export default function Toggle({ onChange, value, disabled = false }) {
+interface Props {
+  onChange?: (e: any) => void;
+  value: boolean;
+  disabled?: boolean;
+}
+
+export default function Toggle({ onChange, value, disabled = false }: Props) {
   return (
     <Switch
       checked={value}
-      onChange={(e) => !disabled && onChange(e)}
+      onChange={(e) => !disabled && onChange && onChange(e)}
       className={` group relative inline-flex h-5 w-10 flex-shrink-0 cursor-wait items-center justify-center rounded-full `}>
       <span
         aria-hidden="true"

admin/src/scenes/centersV2/components/sessions/SessionList.tsx

@@ -8,7 +8,7 @@ import { toastr } from "react-redux-toastr";
 
 import { Container, InputText, InputNumber, Label, ModalConfirmation } from "@snu/ds/admin";
 
-import { canCreateOrUpdateCohesionCenter, canPutSpecificDateOnSessionPhase1, isSessionEditionOpen, validateEmailAcademique } from "snu-lib";
+import { canCreateOrUpdateCohesionCenter, canPutSpecificDateOnSessionPhase1, COHORT_TYPE, isSessionEditionOpen, validateEmailAcademique } from "snu-lib";
 import { capture } from "@/sentry";
 import api from "@/services/api";
 import dayjs from "@/utils/dayjs.utils";
@@ -235,38 +235,42 @@ export default function SessionList({ center, setCenter, sessions, setSessions }
                 </div>
               </div>
 
-              <div className="flex flex-call justify-start items-center w-full mt-2">
-                <div className="w-full mt-3">
-                  <Label
-                    className="text-xs leading-5 font-medium"
-                    title="Réception des fiches sanitaires (facultatif)"
-                    name="sanitaryContactEmail"
-                    tooltip={
-                      <>
-                        <p>
-                          Si vous renseignez l'adresse email suivante, elle sera visible sur l'espace personnel des volontaires. Ils seront ainsi invités à envoyer leurs fiches
-                          sanitaires à cette adresse.
-                        </p>
-                        <ul>
-                          <li className="mt-2 list-outside">Seules les adresses emails académiques sécurisées sont autorisées.</li>
-                          <li className="mt-2 list-outside">Toute modification est impossible après l'annonce des affectations.</li>
-                        </ul>
-                      </>
-                    }
-                  />
-                  <InputText
-                    label="Adresse email académique"
-                    name="sanitaryContactEmail"
-                    value={values ? values.sanitaryContactEmail : session.sanitaryContactEmail}
-                    onChange={(e) => {
-                      if (values) setValues({ ...values, sanitaryContactEmail: e.target.value });
-                    }}
-                    readOnly={!values}
-                    disabled={cohort?.isAssignmentAnnouncementsOpenForYoung}
-                  />
-                </div>
-              </div>
-              {errors?.sanitaryContactEmail && <div className="text-[#EF4444] mx-auto mt-1">{errors?.sanitaryContactEmail}</div>}
+              {cohort.type === COHORT_TYPE.VOLONTAIRE && (
+                <>
+                  <div className="flex flex-call justify-start items-center w-full mt-2">
+                    <div className="w-full mt-3">
+                      <Label
+                        className="text-xs leading-5 font-medium"
+                        title="Réception des fiches sanitaires (facultatif)"
+                        name="sanitaryContactEmail"
+                        tooltip={
+                          <>
+                            <p>
+                              Si vous renseignez l'adresse email suivante, elle sera visible sur l'espace personnel des volontaires. Ils seront ainsi invités à envoyer leurs fiches
+                              sanitaires à cette adresse.
+                            </p>
+                            <ul>
+                              <li className="mt-2 list-outside">Seules les adresses emails académiques sécurisées sont autorisées.</li>
+                              <li className="mt-2 list-outside">Toute modification est impossible après l'annonce des affectations.</li>
+                            </ul>
+                          </>
+                        }
+                      />
+                      <InputText
+                        label="Adresse email académique"
+                        name="sanitaryContactEmail"
+                        value={values ? values.sanitaryContactEmail : session.sanitaryContactEmail}
+                        onChange={(e) => {
+                          if (values) setValues({ ...values, sanitaryContactEmail: e.target.value });
+                        }}
+                        readOnly={!values}
+                        disabled={cohort?.isAssignmentAnnouncementsOpenForYoung}
+                      />
+                    </div>
+                  </div>
+                  {errors?.sanitaryContactEmail && <div className="text-[#EF4444] mx-auto mt-1">{errors?.sanitaryContactEmail}</div>}
+                </>
+              )}
             </div>
             <div className="flex w-[10%] items-center justify-center">
               <div className="h-4/5 w-[1px] border-r-[1px] border-gray-300"></div>