Skip to content

Commit bd44f12

Browse files
committed
add remove agency rights button & modal on AgencyLineRightsCTAs
Signed-off-by: Benjamin Bohec <bbohec.pro@gmail.com>
1 parent 86690d6 commit bd44f12

6 files changed

Lines changed: 152 additions & 54 deletions

File tree

front/src/app/components/agency/agencies-table/AgenciesTablesSection.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import { updateUserOnAgencySlice } from "src/core-logic/domain/agencies/update-u
1313
import { connectedUserSelectors } from "src/core-logic/domain/connected-user/connectedUser.selectors";
1414
import type { FeedbackTopic } from "src/core-logic/domain/feedback/feedback.content";
1515
import { Feedback } from "../../feedback/Feedback";
16+
import { SelfRemoveUserAgencyRightFeedback } from "../removeUserAgencyRights";
1617
import { AgencyRightsTable } from "./AgencyRightsTable";
1718

1819
export const AgenciesTablesSection = ({
@@ -58,6 +59,7 @@ export const AgenciesTablesSection = ({
5859
return (
5960
<>
6061
<Feedback topics={["user"]} closable />
62+
<SelfRemoveUserAgencyRightFeedback />
6163

6264
{toReviewAgencyRights.length > 0 && (
6365
<>

front/src/app/components/agency/agencies-table/AgencyRightsTable.tsx

Lines changed: 20 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -106,12 +106,14 @@ export const AgencyRightsTable = ({
106106
return a.agency.name.localeCompare(b.agency.name);
107107
})
108108
.map((agencyRight) =>
109-
AgencyRightLine(
109+
AgencyRightLine({
110110
agencyRight,
111-
onUserUpdateRequested && onUpdateClicked,
112-
onUserRegistrationCancelledRequested,
111+
user,
112+
onUpdateClicked: onUserUpdateRequested && onUpdateClicked,
113+
onRegistrationCancelledClicked:
114+
onUserRegistrationCancelledRequested,
113115
isBackofficeAdmin,
114-
),
116+
}),
115117
)}
116118
/>
117119
{onUserUpdateRequested &&
@@ -159,12 +161,19 @@ export const AgencyRightsTable = ({
159161
);
160162
};
161163

162-
const AgencyRightLine = (
163-
agencyRight: AgencyRight,
164-
onUpdateClicked?: (agencyRight: AgencyRight) => void,
165-
onRegistrationCancelledClicked?: (agencyRight: AgencyRight) => void,
166-
isBackofficeAdmin?: boolean,
167-
) => [
164+
const AgencyRightLine = ({
165+
agencyRight,
166+
user,
167+
onUpdateClicked,
168+
onRegistrationCancelledClicked,
169+
isBackofficeAdmin,
170+
}: {
171+
agencyRight: AgencyRight;
172+
user: User;
173+
onUpdateClicked?: (agencyRight: AgencyRight) => void;
174+
onRegistrationCancelledClicked?: (agencyRight: AgencyRight) => void;
175+
isBackofficeAdmin?: boolean;
176+
}) => [
168177
<Fragment key={`${agencyRight.agency.id}-agency-infos`}>
169178
<AgencyTag refersToAgencyName={agencyRight.agency.refersToAgencyName} />
170179
<AgencyStatusBadge status={agencyRight.agency.status} />
@@ -211,6 +220,7 @@ const AgencyRightLine = (
211220
agencyRight={agencyRight}
212221
onUpdateClicked={onUpdateClicked}
213222
onRegistrationCancelledClicked={onRegistrationCancelledClicked}
223+
user={user}
214224
isBackofficeAdmin={isBackofficeAdmin}
215225
/>
216226
</Fragment>,
Lines changed: 111 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -1,56 +1,123 @@
11
import Button from "@codegouvfr/react-dsfr/Button";
2-
import type { ReactNode } from "react";
3-
import { type AgencyRight, domElementIds, frontRoutes } from "shared";
2+
import { createModal } from "@codegouvfr/react-dsfr/Modal";
3+
import { type ReactNode, useMemo } from "react";
4+
import { createPortal } from "react-dom";
5+
import { useDispatch } from "react-redux";
6+
import {
7+
type AgencyRight,
8+
domElementIds,
9+
frontRoutes,
10+
type User,
11+
} from "shared";
12+
import { removeUserFromAgencySlice } from "src/core-logic/domain/agencies/remove-user-from-agency/removeUserFromAgency.slice";
13+
import { feedbackSlice } from "src/core-logic/domain/feedback/feedback.slice";
14+
import {
15+
makeRemoveUserAgencyRightsButtonProps,
16+
makeRemoveUserAgencyRightsModalProps,
17+
} from "../../removeUserAgencyRights";
418

519
export const AgencyLineRightsCTAs = ({
620
agencyRight,
721
isBackofficeAdmin,
822
onUpdateClicked,
923
onRegistrationCancelledClicked,
24+
user,
1025
}: {
1126
agencyRight: AgencyRight;
1227
onUpdateClicked?: (agencyRight: AgencyRight) => void;
1328
onRegistrationCancelledClicked?: (agencyRight: AgencyRight) => void;
14-
isBackofficeAdmin?: boolean | undefined;
15-
}): ReactNode => (
16-
<>
17-
{onUpdateClicked && (
18-
<Button
19-
size="small"
20-
priority="secondary"
21-
id={`${domElementIds.myAccount.editRoleButton}-${agencyRight.agency.id}`}
22-
onClick={() => {
23-
onUpdateClicked(agencyRight);
24-
}}
25-
>
26-
Modifier
27-
</Button>
28-
)}
29-
{isBackofficeAdmin && (
30-
<Button
31-
priority="tertiary no outline"
32-
id={`${domElementIds.myAccount.adminAgencyLink}-${agencyRight.agency.id}`}
33-
size="small"
34-
linkProps={
35-
frontRoutes.adminAgencyDetail({
36-
agencyId: agencyRight.agency.id,
37-
}).link
38-
}
39-
>
40-
Voir l'agence comme admin IF
41-
</Button>
42-
)}
43-
{onRegistrationCancelledClicked && (
29+
isBackofficeAdmin?: boolean;
30+
user: User;
31+
}): ReactNode => {
32+
const removeUserModalId = `${domElementIds.myAccount.removeAgencyRightModal}-${agencyRight.agency.id}-${user.id}`;
33+
const userRightToRemove = {
34+
agencyRight,
35+
userEmail: user.email,
36+
userId: user.id,
37+
isSelfRemoval: true,
38+
};
39+
const dispatch = useDispatch();
40+
const removeUserModal = useMemo(
41+
() =>
42+
createModal({
43+
isOpenedByDefault: false,
44+
id: removeUserModalId,
45+
}),
46+
[removeUserModalId],
47+
);
48+
49+
return (
50+
<>
51+
{onUpdateClicked && (
52+
<Button
53+
size="small"
54+
priority="secondary"
55+
id={`${domElementIds.myAccount.editRoleButton}-${agencyRight.agency.id}`}
56+
onClick={() => {
57+
onUpdateClicked(agencyRight);
58+
}}
59+
>
60+
Modifier
61+
</Button>
62+
)}
4463
<Button
45-
priority="secondary"
46-
id={`${domElementIds.myAccount.cancelRegistrationButton}-${agencyRight.agency.id}`}
47-
size="small"
48-
onClick={() => {
49-
onRegistrationCancelledClicked(agencyRight);
50-
}}
51-
>
52-
Annuler la demande
53-
</Button>
54-
)}
55-
</>
56-
);
64+
{...makeRemoveUserAgencyRightsButtonProps({
65+
onDeleteClicked: () => {
66+
dispatch(feedbackSlice.actions.clearFeedbacksTriggered());
67+
removeUserModal.open();
68+
},
69+
removeUserButtonId: `${domElementIds.myAccount.removeAgencyRightButton}-${agencyRight.agency.id}-${user.id}`,
70+
userRightToRemove,
71+
size: "small",
72+
})}
73+
/>
74+
{isBackofficeAdmin && (
75+
<Button
76+
priority="tertiary no outline"
77+
id={`${domElementIds.myAccount.adminAgencyLink}-${agencyRight.agency.id}`}
78+
size="small"
79+
linkProps={
80+
frontRoutes.adminAgencyDetail({
81+
agencyId: agencyRight.agency.id,
82+
}).link
83+
}
84+
>
85+
Voir l'agence comme admin IF
86+
</Button>
87+
)}
88+
{onRegistrationCancelledClicked && (
89+
<Button
90+
priority="secondary"
91+
id={`${domElementIds.myAccount.cancelRegistrationButton}-${agencyRight.agency.id}`}
92+
size="small"
93+
onClick={() => {
94+
onRegistrationCancelledClicked(agencyRight);
95+
}}
96+
>
97+
Annuler la demande
98+
</Button>
99+
)}
100+
{createPortal(
101+
removeUserModal.Component(
102+
makeRemoveUserAgencyRightsModalProps({
103+
onCancel: () => removeUserModal.close(),
104+
onSubmitted: () => {
105+
dispatch(
106+
removeUserFromAgencySlice.actions.removeUserFromAgencyRequested(
107+
{
108+
userId: userRightToRemove.userId,
109+
agencyId: userRightToRemove.agencyRight.agency.id,
110+
feedbackTopic: "agency-user-right-self",
111+
},
112+
),
113+
);
114+
removeUserModal.close();
115+
},
116+
userRightToRemove,
117+
}),
118+
),
119+
document.body,
120+
)}
121+
</>
122+
);
123+
};

front/src/app/pages/agency-dashboard/AgencyDashboardMainTab.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { Loader } from "react-design-system";
66
import { useDispatch } from "react-redux";
77
import { type AgencyRight, distinguishAgencyRights } from "shared";
88
import { NoActiveAgencyRights } from "src/app/components/agency/agency-dashboard/NoActiveAgencyRights";
9+
import { SelfRemoveUserAgencyRightFeedback } from "src/app/components/agency/removeUserAgencyRights";
910
import { Feedback } from "src/app/components/feedback/Feedback";
1011
import { useAppSelector } from "src/app/hooks/reduxHooks";
1112
import type { FrontAgencyDashboardRoute } from "src/app/pages/auth/ConnectedPrivateRoutePage";
@@ -43,6 +44,7 @@ export const AgencyDashboardMainTab = ({
4344
<h1>Mon espace prescripteur</h1>
4445
{isLoading && <Loader />}
4546
<Feedback topics={[feedbackTopic]} />
47+
<SelfRemoveUserAgencyRightFeedback />
4648

4749
{match({ currentUser })
4850
.with(

front/src/core-logic/domain/feedback/feedback.content.ts

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -45,6 +45,7 @@ const topics = [
4545
"agency-for-dashboard",
4646
"agency-user-for-dashboard",
4747
"agency-user",
48+
"agency-user-right-self",
4849
"api-consumer-global",
4950
"api-consumer-names",
5051
"api-consumer-renew",
@@ -504,6 +505,20 @@ export const feedbacks: Record<
504505
message: "L'import en masse a réussi, voici le détail :",
505506
},
506507
},
508+
"agency-user-right-self": {
509+
"delete.success": {
510+
action: removeUserFromAgencySlice.actions.removeUserFromAgencySucceeded,
511+
title: "Détachement effectué avec succès",
512+
message:
513+
"Vous avez bien été détaché de l'organisme. Vous n'avez désormais plus accès à ses conventions, bilans et statistiques.",
514+
},
515+
"delete.error": {
516+
action: removeUserFromAgencySlice.actions.removeUserFromAgencyFailed,
517+
title: "Une erreur est survenue",
518+
message:
519+
"Impossible de procéder à votre détachement pour le moment. Veuillez réessayer ultérieurement ou contacter le support.",
520+
},
521+
},
507522
user: {
508523
"update.success": {
509524
action: updateUserOnAgencySlice.actions.updateUserAgencyRightSucceeded,

shared/src/domElementIds.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -931,6 +931,8 @@ export const domElementIds = {
931931
adminAgencyLink: "im-profile__admin-agency-link",
932932
adminEstablishmentLink: "im-profile__admin-establishment-link",
933933
cancelRegistrationButton: "im-profile__cancel-registration-button",
934+
removeAgencyRightButton: "im-profile__remove-agency-right-button",
935+
removeAgencyRightModal: "im-profile__remove-agency-right-modal",
934936
updateOwnInfosLink: "im-profile__update-own-infos-link",
935937
editAgencyUserEmail: "im-profile-edit-agency-user__email",
936938
editAgencyManageUserCheckbox:

0 commit comments

Comments
 (0)