feat(admin): added update competence bloc page to certification regis…

…try manager update certification page
SocialGouv · Dec 5, 2024 · 50d4f2f · 50d4f2f
1 parent 193639a
commit 50d4f2f
Show file tree

Hide file tree

Showing 5 changed files with 431 additions and 0 deletions.
diff --git a/...rtification-competence-bloc-page/fixtures/certification-competence-bloc-bp-boucher-1.json b/...rtification-competence-bloc-page/fixtures/certification-competence-bloc-bp-boucher-1.json
@@ -0,0 +1,33 @@
+{
+  "data": {
+    "getCertificationCompetenceBloc": {
+      "id": "008a6fab-55ad-4412-ab17-56bc4b8e2fd0",
+      "label": "Préparation, présentation, décoration et vente en boucherie",
+      "code": "RNCP37310BC01",
+      "FCCompetences": "* Réaliser les opérations de préparations des viandes * Mettre en valeur les produits notamment l’intégralité de la carcasse dans une démarche de développement durable * Vendre les produits au client en argumentant et en proposant des conseils culinaires * Communiquer sur l’étiquetage, la conservation, la traçabilité, les signes officiels de qualité et l’origine des viandes",
+      "competences": [
+        {
+          "id": "b8786018-6d24-4538-9622-f4ac62eb1742",
+          "label": "Réaliser les opérations de préparations des viandes"
+        },
+        {
+          "id": "2cbb6688-7b80-416f-940a-e348246484f8",
+          "label": "Mettre en valeur les produits notamment l’intégralité de la carcasse dans une démarche de développement durable"
+        },
+        {
+          "id": "2c829da9-ed10-48a3-ae1b-2f7db433c6d8",
+          "label": "Vendre les produits au client en argumentant et en proposant des conseils culinaires"
+        },
+        {
+          "id": "5aad9206-27a0-4afa-ac28-06d30bab6504",
+          "label": "Communiquer sur l’étiquetage, la conservation, la traçabilité, les signes officiels de qualité et l’origine des viandes"
+        }
+      ],
+      "certification": {
+        "id": "bf78b4d6-f6ac-4c8f-9e6b-d6c6ae9e891b",
+        "codeRncp": "37310",
+        "label": "BP Boucher"
+      }
+    }
+  }
+}
diff --git a/...on-competence-bloc-page/fixtures/update-competence-bloc-bp-boucher-mutation-response.json b/...on-competence-bloc-page/fixtures/update-competence-bloc-bp-boucher-mutation-response.json
@@ -0,0 +1,7 @@
+{
+  "data": {
+    "referential_updateCertificationCompetenceBloc": {
+      "id": "008a6fab-55ad-4412-ab17-56bc4b8e2fd0"
+    }
+  }
+}
diff --git a/...update-certification-competence-bloc-page/update-certification-competence-bloc-page.cy.ts b/...update-certification-competence-bloc-page/update-certification-competence-bloc-page.cy.ts
@@ -0,0 +1,163 @@
+import { stubMutation, stubQuery } from "../../../../utils/graphql";
+import certificationCBBPBoucher1 from "./fixtures/certification-competence-bloc-bp-boucher-1.json";
+import updateCertificationBlocMutationResponse from "./fixtures/update-competence-bloc-bp-boucher-mutation-response.json";
+
+function interceptCertificationCompetenceBloc() {
+  cy.intercept("POST", "/api/graphql", (req) => {
+    stubQuery(
+      req,
+      "activeFeaturesForConnectedUser",
+      "features/active-features.json",
+    );
+    stubQuery(
+      req,
+      "getMaisonMereCGUQuery",
+      "account/gestionnaire-cgu-accepted.json",
+    );
+    stubQuery(
+      req,
+      "getCompetenceBlocForCertificationRegistryManagerUpdateCompetenceBlocPage",
+      certificationCBBPBoucher1,
+    );
+  });
+}
+
+function interceptUpdateCertificationCompetenceBlocMutation() {
+  cy.intercept("POST", "/api/graphql", (req) => {
+    stubMutation(
+      req,
+      "updateCertificationCompetenceBlocForCertificationRegistryManagerUpdateCertificationCompetenceBlocPage",
+      updateCertificationBlocMutationResponse,
+    );
+  });
+}
+
+function interceptDeleteCertificationCompetenceBlocMutation() {
+  cy.intercept("POST", "/api/graphql", (req) => {
+    stubMutation(
+      req,
+      "deleteCertificationCompetenceBlocForCertificationRegistryManagerUpdateCompetenceBlocPage",
+      updateCertificationBlocMutationResponse,
+    );
+  });
+}
+
+context("when i access the update certification page ", () => {
+  it("display the page with a correct title", function () {
+    interceptCertificationCompetenceBloc();
+
+    cy.admin(
+      "http://localhost:3003/admin2/responsable-certifications/certifications/bf78b4d6-f6ac-4c8f-9e6b-d6c6ae9e891b/bloc-competence/008a6fab-55ad-4412-ab17-56bc4b8e2fd0/",
+    );
+    cy.wait("@activeFeaturesForConnectedUser");
+    cy.wait("@getMaisonMereCGUQuery");
+    cy.wait(
+      "@getCompetenceBlocForCertificationRegistryManagerUpdateCompetenceBlocPage",
+    );
+
+    cy.get(
+      '[data-test="certification-registry-manager-update-certification-competence-bloc-page"]',
+    )
+      .children("h1")
+      .should(
+        "have.text",
+        "RNCP37310BC01 - Préparation, présentation, décoration et vente en boucherie",
+      );
+  });
+
+  it("dont let me submit the form if no edit has been made", function () {
+    interceptCertificationCompetenceBloc();
+    cy.admin(
+      "http://localhost:3003/admin2/responsable-certifications/certifications/bf78b4d6-f6ac-4c8f-9e6b-d6c6ae9e891b/bloc-competence/008a6fab-55ad-4412-ab17-56bc4b8e2fd0/",
+    );
+    cy.wait("@activeFeaturesForConnectedUser");
+    cy.wait("@getMaisonMereCGUQuery");
+    cy.wait(
+      "@getCompetenceBlocForCertificationRegistryManagerUpdateCompetenceBlocPage",
+    );
+
+    cy.get("button").contains("Enregistrer").should("be.disabled");
+  });
+
+  it("let me update a competence bloc and submit the form", function () {
+    interceptCertificationCompetenceBloc();
+    interceptUpdateCertificationCompetenceBlocMutation();
+    cy.admin(
+      "http://localhost:3003/admin2/responsable-certifications/certifications/bf78b4d6-f6ac-4c8f-9e6b-d6c6ae9e891b/bloc-competence/008a6fab-55ad-4412-ab17-56bc4b8e2fd0/",
+    );
+    cy.wait("@activeFeaturesForConnectedUser");
+    cy.wait("@getMaisonMereCGUQuery");
+    cy.wait(
+      "@getCompetenceBlocForCertificationRegistryManagerUpdateCompetenceBlocPage",
+    );
+
+    cy.get('[data-test="competence-bloc-label-input"] input')
+      .clear()
+      .type("updated competence bloc label");
+
+    cy.get("button").contains("Enregistrer").click();
+    cy.wait(
+      "@updateCertificationCompetenceBlocForCertificationRegistryManagerUpdateCertificationCompetenceBlocPage",
+    );
+  });
+
+  it("let me add a new competence to the competence bloc", function () {
+    interceptCertificationCompetenceBloc();
+    cy.admin(
+      "http://localhost:3003/admin2/responsable-certifications/certifications/bf78b4d6-f6ac-4c8f-9e6b-d6c6ae9e891b/bloc-competence/008a6fab-55ad-4412-ab17-56bc4b8e2fd0/",
+    );
+    cy.wait("@activeFeaturesForConnectedUser");
+    cy.wait("@getMaisonMereCGUQuery");
+    cy.wait(
+      "@getCompetenceBlocForCertificationRegistryManagerUpdateCompetenceBlocPage",
+    );
+
+    cy.get('[data-test="competence-list"] input').should("have.length", 4);
+
+    cy.get('[data-test="add-competence-button"]').click();
+
+    cy.get('[data-test="competence-list"] input').should("have.length", 5);
+  });
+
+  it("let me delete a competence from the competence bloc", function () {
+    interceptCertificationCompetenceBloc();
+    cy.admin(
+      "http://localhost:3003/admin2/responsable-certifications/certifications/bf78b4d6-f6ac-4c8f-9e6b-d6c6ae9e891b/bloc-competence/008a6fab-55ad-4412-ab17-56bc4b8e2fd0/",
+    );
+    cy.wait("@activeFeaturesForConnectedUser");
+    cy.wait("@getMaisonMereCGUQuery");
+    cy.wait(
+      "@getCompetenceBlocForCertificationRegistryManagerUpdateCompetenceBlocPage",
+    );
+
+    cy.get('[data-test="competence-list"] input').should("have.length", 4);
+
+    cy.get('[data-test="delete-competence-button"]').eq(1).click();
+
+    cy.get('[data-test="competence-list"] input').should("have.length", 3);
+  });
+
+  it("let me delete a competence bloc", function () {
+    interceptCertificationCompetenceBloc();
+    interceptDeleteCertificationCompetenceBlocMutation();
+    cy.admin(
+      "http://localhost:3003/admin2/responsable-certifications/certifications/bf78b4d6-f6ac-4c8f-9e6b-d6c6ae9e891b/bloc-competence/008a6fab-55ad-4412-ab17-56bc4b8e2fd0/",
+    );
+    cy.wait("@activeFeaturesForConnectedUser");
+    cy.wait("@getMaisonMereCGUQuery");
+    cy.wait(
+      "@getCompetenceBlocForCertificationRegistryManagerUpdateCompetenceBlocPage",
+    );
+
+    cy.get('[data-test="delete-competence-bloc-button"]').click();
+
+    cy.wait(
+      "@deleteCertificationCompetenceBlocForCertificationRegistryManagerUpdateCompetenceBlocPage",
+    );
+
+    cy.url().should(
+      "eq",
+      "http://localhost:3003/admin2/responsable-certifications/certifications/bf78b4d6-f6ac-4c8f-9e6b-d6c6ae9e891b/",
+    );
+  });
+});
diff --git a/...certifications/[certificationId]/bloc-competence/[certificationCompetenceBlocId]/page.tsx b/...certifications/[certificationId]/bloc-competence/[certificationCompetenceBlocId]/page.tsx
@@ -0,0 +1,126 @@
+"use client";
+import { useParams, useRouter } from "next/navigation";
+import { useUpdateCompetenceBlocPage } from "./updateCompetenceBloc.hook";
+import { FormOptionalFieldsDisclaimer } from "@/components/form-optional-fields-disclaimer/FormOptionalFieldsDisclaimer";
+import { GrayCard } from "@/components/card/gray-card/GrayCard";
+import { Breadcrumb } from "@codegouvfr/react-dsfr/Breadcrumb";
+import {
+  CompetenceBlocForm,
+  CompetenceBlocFormData,
+} from "../../../../../../components/certifications/competence-bloc-form/CompetenceBlocForm";
+import { graphqlErrorToast, successToast } from "@/components/toast/toast";
+
+type CertificationCompetenceBlocForPage = Exclude<
+  ReturnType<typeof useUpdateCompetenceBlocPage>["competenceBloc"],
+  undefined
+>;
+
+export default function UpdateCompetenceBlocPage() {
+  const { certificationId, certificationCompetenceBlocId } = useParams<{
+    certificationId: string;
+    certificationCompetenceBlocId: string;
+  }>();
+
+  const router = useRouter();
+
+  const {
+    competenceBloc,
+    getCompetenceBlocQueryStatus,
+    updateCertificationCompetenceBloc,
+    deleteCertificationCompetenceBloc,
+  } = useUpdateCompetenceBlocPage({ certificationCompetenceBlocId });
+
+  const handleFormSubmit = async (data: CompetenceBlocFormData) => {
+    try {
+      await updateCertificationCompetenceBloc.mutateAsync(data);
+      successToast("modifications enregistrées");
+    } catch (e) {
+      graphqlErrorToast(e);
+    }
+  };
+
+  const handleCompetenceBlocDeleteButtonClick = async () => {
+    try {
+      await deleteCertificationCompetenceBloc.mutateAsync();
+      successToast("modifications enregistrées");
+      router.push(
+        `/responsable-certifications/certifications/${certificationId}`,
+      );
+    } catch (e) {
+      graphqlErrorToast(e);
+    }
+  };
+  return getCompetenceBlocQueryStatus === "success" && competenceBloc ? (
+    <PageContent
+      competenceBloc={competenceBloc}
+      onSubmit={handleFormSubmit}
+      onDeleteCompetenceBlocButtonClick={handleCompetenceBlocDeleteButtonClick}
+    />
+  ) : null;
+}
+
+const PageContent = ({
+  competenceBloc,
+  onSubmit,
+  onDeleteCompetenceBlocButtonClick,
+}: {
+  competenceBloc: CertificationCompetenceBlocForPage;
+  onSubmit(data: CompetenceBlocFormData): Promise<void>;
+  onDeleteCompetenceBlocButtonClick?: () => void;
+}) => (
+  <div data-test="certification-registry-manager-update-certification-competence-bloc-page">
+    <Breadcrumb
+      currentPageLabel={`${competenceBloc.code} - ${competenceBloc.label}`}
+      homeLinkProps={{
+        href: `/`,
+      }}
+      segments={[
+        {
+          label: competenceBloc.certification.label,
+          linkProps: {
+            href: `/responsable-certifications/certifications/${competenceBloc.certification.id}`,
+          },
+        },
+      ]}
+    />
+
+    <h1>
+      {competenceBloc.code} - {competenceBloc.label}
+    </h1>
+    <FormOptionalFieldsDisclaimer />
+    <p className="mb-12 text-xl">
+      Retrouvez toutes les informations récupérées à partir du code RNCP. Si
+      vous souhaitez les modifier, il est préférable de contacter directement
+      France compétences.
+    </p>
+    <GrayCard as="div" className="gap-6">
+      <h2>
+        Informations France compétences liées au code RNCP{" "}
+        {competenceBloc.certification.codeRncp}
+      </h2>
+      <dl>
+        <dd>Intitulé du bloc de compétences</dd>
+        <dt className="font-medium">
+          {competenceBloc.code} - {competenceBloc.label}
+        </dt>
+      </dl>
+      <dl>
+        <dd>Compétences</dd>
+        <dt className="font-medium">{competenceBloc.FCCompetences}</dt>
+      </dl>
+    </GrayCard>
+    <CompetenceBlocForm
+      className="mt-6"
+      backUrl={`/responsable-certifications/certifications/${competenceBloc.certification.id}`}
+      defaultValues={{
+        ...competenceBloc,
+        competences: competenceBloc.competences.map((c, i) => ({
+          ...c,
+          index: i,
+        })),
+      }}
+      onSubmit={onSubmit}
+      onDeleteCompetenceBlocButtonClick={onDeleteCompetenceBlocButtonClick}
+    />
+  </div>
+);