fix(email-sender): fix url, add a graph, and tag for productions

src/api/send-mail/index.tsx

@@ -13,9 +13,13 @@ function EmailSender({
 }) {
   const [, setEmailSent] = useState(false);
   const [userResponse, setUserResponse] = useState("");
-  const basePath = window.location.pathname.includes("contact")
-    ? "contact"
-    : "contribute";
+  let basePath = "contact";
+
+  if (window.location.pathname.includes("contribute")) {
+    basePath = "contribute";
+  } else if (window.location.pathname.includes("apioperations")) {
+    basePath = "contribute_productions";
+  }
 
   const [selectedProfile, setSelectedProfile] = useState("");
 
@@ -74,6 +78,7 @@ function EmailSender({
     setResponseScanR(dataForScanR);
     setEmailSent(true);
     toast.success("Mail envoyé!");
+    setUserResponse("");
   };
 
   return (
@@ -88,7 +93,12 @@ function EmailSender({
           />
         </Col>
         <Col>
-          <Button variant="secondary" onClick={sendEmail} size="sm">
+          <Button
+            className="fr-mt-1w"
+            variant="secondary"
+            onClick={sendEmail}
+            size="sm"
+          >
             {contribution.comment ? "Renvoyer un mail" : "Répondre"}
           </Button>
         </Col>

src/components/edit-modal/index.tsx

@@ -9,13 +9,13 @@ import {
   Button,
   Row,
 } from "@dataesr/dsfr-plus";
-import { Contribution } from "../../types";
+import { Contribute_Production, Contribution } from "../../types";
 import { postHeaders } from "../../config/api";
 import Select from "react-select";
 
 type EditModalProps = {
   isOpen: boolean;
-  data: Contribution;
+  data: Contribution | Contribute_Production;
   onClose: () => void;
 };
 
@@ -58,13 +58,13 @@ const EditModal: React.FC<EditModalProps> = ({ isOpen, data, onClose }) => {
 
   if (window.location.pathname.includes("contribute")) {
     basePath = "contribute";
-  } else if (window.location.pathname.includes("contribute_production")) {
-    basePath = "contribute_production";
+  } else if (window.location.pathname.includes("apioperations")) {
+    basePath = "contribute_productions";
   }
-
   const handleSubmit = async () => {
     try {
       const response = await fetch(
+        // `https://scanr-api.dataesr.ovh/${basePath}/${data._id}`,
         `${window.location.origin}/api/${basePath}/${data._id}`,
         {
           method: "PATCH",

src/components/graphs/by-missing-productions.tsx

@@ -0,0 +1,65 @@
+import Highcharts from "highcharts";
+import HighchartsReact from "highcharts-react-official";
+import useGetContributionData from "../../api/contribution-api/useGetObjectContributeData";
+import { Contribute_Production } from "../../types";
+import { productionUrl } from "../../config/api";
+
+const ContributionsGraphByStatus = () => {
+  const { data, isLoading, isError } = useGetContributionData(productionUrl, 0);
+  const contributions = (data as { data: Contribute_Production[] })?.data;
+
+  if (isLoading) {
+    return <div>Chargement...</div>;
+  }
+
+  if (isError) {
+    return <div>Une erreur s'est produite</div>;
+  }
+
+  if (!Array.isArray(contributions)) {
+    return <div>Les données ne sont pas disponibles</div>;
+  }
+
+  const newCount = contributions.filter(
+    (contribution) => contribution.status === "new"
+  ).length;
+  const ongoingCount = contributions.filter(
+    (contribution) => contribution.status === "ongoing"
+  ).length;
+  const treatedCount = contributions.filter(
+    (contribution) => contribution.status === "treated"
+  ).length;
+
+  const chartData = [
+    { name: "New", y: newCount },
+    { name: "Ongoing", y: ongoingCount },
+    { name: "Treated", y: treatedCount },
+  ];
+
+  const options = {
+    chart: {
+      type: "column",
+    },
+    title: {
+      text: "Nombre de demande d'affiliation par statut",
+    },
+    xAxis: {
+      type: "category",
+    },
+    yAxis: {
+      title: {
+        text: "Nombre de contributions",
+      },
+    },
+    series: [
+      {
+        name: "Statut",
+        data: chartData,
+      },
+    ],
+  };
+
+  return <HighchartsReact highcharts={Highcharts} options={options} />;
+};
+
+export default ContributionsGraphByStatus;

src/config/api.ts

@@ -3,11 +3,11 @@ export const headers = API_KEY ? { Authorization: `Basic ${API_KEY}` } : {};
 export const postHeaders = { ...headers, "Content-Type": "application/json" };
 
 export const contributionUrl = "/api/contribute?max_results=2000";
+export const contactUrl = "/api/contact?max_results=2000";
+export const productionUrl = "/api/contribute_productions?max_results=2000";
 // export const contributionUrl =
 //   "https://scanr-api.dataesr.ovh/contribute?max_results=2000";
-export const contactUrl = "/api/contact?max_results=2000";
 // export const contactUrl =
-// "https://scanr-api.dataesr.ovh/contact?max_results=2000";
+//   "https://scanr-api.dataesr.ovh/contact?max_results=2000";
 // export const productionUrl =
-//   "https://scanr-api.dataesr.ovh/contribute_production?max_results=2000";
-export const productionUrl = "/api/contribute_production?max_results=2000";
+//   "https://scanr-api.dataesr.ovh/contribute_productions?max_results=2000";

src/pages/api-operation-page/contribution-production-card.tsx

@@ -28,6 +28,16 @@ const ContributionProductionItem = ({
           >
             {data.status}
           </Badge>
+          {data.tag && (
+            <Badge
+              size="sm"
+              color="pink-tuile"
+              className="fr-mr-1w fr-mb-1w status"
+            >
+              {data.tag}
+            </Badge>
+          )}
+
           <Badge
             size="sm"
             color="green-emeraude"

src/pages/api-operation-page/index.tsx

@@ -53,7 +53,6 @@ const ContributionPage: React.FC<ContributionPageProps> = () => {
     buildURL(sort, status, query, page),
     reload
   );
-  console.log(data);
 
   const meta = (data as { meta: any }).meta;
   const maxPage = meta ? Math.ceil(meta?.total / 10) : 1;

src/pages/api-operation-page/message-preview.tsx

@@ -23,37 +23,9 @@ const MessagePreview = ({ data }: { data: Contribute_Production }) => {
   const handleCloseModal = () => {
     setShowModal(false);
   };
-
   return (
     <Container fluid>
-      <EditModal
-        isOpen={showModal}
-        onClose={handleCloseModal}
-        data-production={data}
-        data={{
-          responseByMail: "",
-          responseFrom: "",
-          modified_at: "",
-          team: undefined,
-          _id: undefined,
-          status: "",
-          tags: undefined,
-          message: "",
-          created_at: "",
-          fonction: undefined,
-          organisation: undefined,
-          email: undefined,
-          name: undefined,
-          type: "",
-          id: "",
-          comment: "",
-          data: [],
-          meta: {
-            total: 0,
-          },
-          highlightedQuery: "",
-        }}
-      />
+      <EditModal isOpen={showModal} onClose={handleCloseModal} data={data} />
       <Row className="contributorProductionSideInfo">
         {data.id && (
           <Text

src/pages/api-operation-page/staff-production-action.tsx

@@ -2,6 +2,7 @@ import EmailSender from "../../api/send-mail";
 import type { Contribute_Production } from "../../types";
 import { useState } from "react";
 import { Col, Text } from "@dataesr/dsfr-plus";
+import "./styles.scss";
 
 const StaffProductionActions = ({ data }: { data: Contribute_Production }) => {
   const [responseScanR, setResponseScanR] = useState(null);

src/pages/home/index.tsx

@@ -7,6 +7,7 @@ import ContributionsGraphByDomains from "../../components/graphs/by-domains";
 import ContributionsGraphByTypes from "../../components/graphs/by-types";
 import AdminTreatmentGraph from "../../components/graphs/treatment-by-admin";
 import AdminResponseGraph from "../../components/graphs/response-by-admin";
+import ContributionsGraphByProductions from "../../components/graphs/by-missing-productions";
 
 const Home = () => {
   return (
@@ -44,6 +45,11 @@ const Home = () => {
           <AdminResponseGraph />
         </Col>
       </Row>
+      <Row gutters className="fr-grid-row--center fr-mt-5w">
+        <Col md="6">
+          <ContributionsGraphByProductions />
+        </Col>
+      </Row>
     </Container>
   );
 };

src/types/index.ts

@@ -54,6 +54,7 @@ export type MessagePreviewProps = {
 };
 
 export type Contribute_Production = {
+  tag: string;
   _id: string;
   team: any;
   modified_at: string | number | Date;