From c7e50a1b6891290c8b39d7085824d116760b76f9 Mon Sep 17 00:00:00 2001 From: Alexandre Garbe Date: Thu, 14 Nov 2024 11:03:22 +0100 Subject: [PATCH] feat(admin): admin can now delete a competence bloc from the update competence bloc page of certification v2 --- ...e-certification-competence-bloc-page.cy.ts | 36 +++++++++++++++++-- .../[certificationCompetenceBlocId]/page.tsx | 27 ++++++++++++-- .../updateCompetenceBloc.hook.ts | 24 +++++++++++++ .../_components/CompetenceBlocForm.tsx | 21 +++++++++-- 4 files changed, 99 insertions(+), 9 deletions(-) diff --git a/packages/reva-admin-react/cypress/e2e/certifications/update-certification-competence-bloc-page/update-certification-competence-bloc-page.cy.ts b/packages/reva-admin-react/cypress/e2e/certifications/update-certification-competence-bloc-page/update-certification-competence-bloc-page.cy.ts index 935ad0af9..b44528c12 100644 --- a/packages/reva-admin-react/cypress/e2e/certifications/update-certification-competence-bloc-page/update-certification-competence-bloc-page.cy.ts +++ b/packages/reva-admin-react/cypress/e2e/certifications/update-certification-competence-bloc-page/update-certification-competence-bloc-page.cy.ts @@ -32,6 +32,16 @@ function interceptUpdateCertificationCompetenceBlocMutation() { }); } +function interceptDeleteCertificationCompetenceBlocMutation() { + cy.intercept("POST", "/api/graphql", (req) => { + stubMutation( + req, + "deleteCertificationCompetenceBlocForUpdateCompetenceBlocPage", + updateCertificationBlocMutationResponse, + ); + }); +} + context("when i access the update certification page ", () => { it("display the page with a correct title", function () { interceptCertificationCompetenceBloc(); @@ -83,7 +93,7 @@ context("when i access the update certification page ", () => { ); }); - it("let me add a new competence bloc", function () { + it("let me add a new competence to the competence bloc", function () { interceptCertificationCompetenceBloc(); cy.admin( "http://localhost:3003/admin2/certifications-v2/bf78b4d6-f6ac-4c8f-9e6b-d6c6ae9e891b/bloc-competence/008a6fab-55ad-4412-ab17-56bc4b8e2fd0/", @@ -99,7 +109,7 @@ context("when i access the update certification page ", () => { cy.get('[data-test="competence-list"] input').should("have.length", 5); }); - it("let me remove a competence bloc", function () { + it("let me delete a competence from the competence bloc", function () { interceptCertificationCompetenceBloc(); cy.admin( "http://localhost:3003/admin2/certifications-v2/bf78b4d6-f6ac-4c8f-9e6b-d6c6ae9e891b/bloc-competence/008a6fab-55ad-4412-ab17-56bc4b8e2fd0/", @@ -110,8 +120,28 @@ context("when i access the update certification page ", () => { cy.get('[data-test="competence-list"] input').should("have.length", 4); - cy.get('[data-test="remove-competence-button"]').eq(1).click(); + 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/certifications-v2/bf78b4d6-f6ac-4c8f-9e6b-d6c6ae9e891b/bloc-competence/008a6fab-55ad-4412-ab17-56bc4b8e2fd0/", + ); + cy.wait("@activeFeaturesForConnectedUser"); + cy.wait("@getMaisonMereCGUQuery"); + cy.wait("@getCompetenceBlocForUpdateCompetenceBlocPage"); + + cy.get('[data-test="delete-competence-bloc-button"]').click(); + + cy.wait("@deleteCertificationCompetenceBlocForUpdateCompetenceBlocPage"); + + cy.url().should( + "eq", + "http://localhost:3003/admin2/certifications-v2/bf78b4d6-f6ac-4c8f-9e6b-d6c6ae9e891b/", + ); + }); }); diff --git a/packages/reva-admin-react/src/app/(admin)/certifications-v2/[certificationId]/bloc-competence/[certificationCompetenceBlocId]/page.tsx b/packages/reva-admin-react/src/app/(admin)/certifications-v2/[certificationId]/bloc-competence/[certificationCompetenceBlocId]/page.tsx index 3835537eb..82abc1d2f 100644 --- a/packages/reva-admin-react/src/app/(admin)/certifications-v2/[certificationId]/bloc-competence/[certificationCompetenceBlocId]/page.tsx +++ b/packages/reva-admin-react/src/app/(admin)/certifications-v2/[certificationId]/bloc-competence/[certificationCompetenceBlocId]/page.tsx @@ -1,5 +1,5 @@ "use client"; -import { useParams } from "next/navigation"; +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"; @@ -16,14 +16,18 @@ type CertificationCompetenceBlocForPage = Exclude< >; export default function UpdateCompetenceBlocPage() { - const { certificationCompetenceBlocId } = useParams<{ + const { certificationId, certificationCompetenceBlocId } = useParams<{ + certificationId: string; certificationCompetenceBlocId: string; }>(); + const router = useRouter(); + const { competenceBloc, getCompetenceBlocQueryStatus, updateCertificationCompetenceBloc, + deleteCertificationCompetenceBloc, } = useUpdateCompetenceBlocPage({ certificationCompetenceBlocId }); const handleFormSubmit = async (data: CompetenceBlocFormData) => { @@ -34,17 +38,33 @@ export default function UpdateCompetenceBlocPage() { graphqlErrorToast(e); } }; + + const handleCompetenceBlocDeleteButtonClick = async () => { + try { + await deleteCertificationCompetenceBloc.mutateAsync(); + successToast("modifications enregistrées"); + router.push(`/certifications-v2/${certificationId}`); + } catch (e) { + graphqlErrorToast(e); + } + }; return getCompetenceBlocQueryStatus === "success" && competenceBloc ? ( - + ) : null; } const PageContent = ({ competenceBloc, onSubmit, + onDeleteCompetenceBlocButtonClick, }: { competenceBloc: CertificationCompetenceBlocForPage; onSubmit(data: CompetenceBlocFormData): Promise; + onDeleteCompetenceBlocButtonClick?: () => void; }) => (
); diff --git a/packages/reva-admin-react/src/app/(admin)/certifications-v2/[certificationId]/bloc-competence/[certificationCompetenceBlocId]/updateCompetenceBloc.hook.ts b/packages/reva-admin-react/src/app/(admin)/certifications-v2/[certificationId]/bloc-competence/[certificationCompetenceBlocId]/updateCompetenceBloc.hook.ts index 9196c0753..d435c28d9 100644 --- a/packages/reva-admin-react/src/app/(admin)/certifications-v2/[certificationId]/bloc-competence/[certificationCompetenceBlocId]/updateCompetenceBloc.hook.ts +++ b/packages/reva-admin-react/src/app/(admin)/certifications-v2/[certificationId]/bloc-competence/[certificationCompetenceBlocId]/updateCompetenceBloc.hook.ts @@ -37,6 +37,18 @@ const updateCertificationCompetenceBlocMutation = graphql(` } `); +const deleteCertificationCompetenceBlocMutation = graphql(` + mutation deleteCertificationCompetenceBlocForUpdateCompetenceBlocPage( + $certificationCompetenceBlocId: String! + ) { + referential_deleteCertificationCompetenceBloc( + certificationCompetenceBlocId: $certificationCompetenceBlocId + ) { + id + } + } +`); + export const useUpdateCompetenceBlocPage = ({ certificationCompetenceBlocId, }: { @@ -71,6 +83,17 @@ export const useUpdateCompetenceBlocPage = ({ }), }); + const deleteCertificationCompetenceBloc = useMutation({ + mutationFn: () => + graphqlClient.request(deleteCertificationCompetenceBlocMutation, { + certificationCompetenceBlocId, + }), + onSuccess: () => + queryClient.invalidateQueries({ + queryKey: [certificationCompetenceBlocId], + }), + }); + const competenceBloc = getCompetenceBlocResponse?.getCertificationCompetenceBloc; @@ -78,5 +101,6 @@ export const useUpdateCompetenceBlocPage = ({ competenceBloc, getCompetenceBlocQueryStatus, updateCertificationCompetenceBloc, + deleteCertificationCompetenceBloc, }; }; diff --git a/packages/reva-admin-react/src/app/(admin)/certifications-v2/[certificationId]/bloc-competence/_components/CompetenceBlocForm.tsx b/packages/reva-admin-react/src/app/(admin)/certifications-v2/[certificationId]/bloc-competence/_components/CompetenceBlocForm.tsx index b581a5076..91ecc3440 100644 --- a/packages/reva-admin-react/src/app/(admin)/certifications-v2/[certificationId]/bloc-competence/_components/CompetenceBlocForm.tsx +++ b/packages/reva-admin-react/src/app/(admin)/certifications-v2/[certificationId]/bloc-competence/_components/CompetenceBlocForm.tsx @@ -23,11 +23,13 @@ export const CompetenceBlocForm = ({ defaultValues, backUrl, className = "", + onDeleteCompetenceBlocButtonClick, }: { onSubmit(data: CompetenceBlocFormData): Promise; defaultValues: Partial; backUrl: string; className?: string; + onDeleteCompetenceBlocButtonClick?: () => void; }) => { const methods = useForm({ resolver: zodResolver(competenceBlocFormSchema), @@ -52,7 +54,7 @@ export const CompetenceBlocForm = ({ const handleFormSubmit = handleSubmit(onSubmit, (e) => console.log(e)); return ( -
+
{competencesFields.map((c, cIndex) => ( @@ -78,7 +80,7 @@ export const CompetenceBlocForm = ({ nativeInputProps={{ ...register(`competences.${cIndex}.label`) }} /> +
+ {onDeleteCompetenceBlocButtonClick && ( + + )}