1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
import { ConfirmationForm } from '@/components/common/ConfirmationForm';
import { useDeleteQuery, useMessages, useModified } from '@/components/hooks';
export function TeamLeaveForm({
teamId,
userId,
teamName,
onSave,
onClose,
}: {
teamId: string;
userId: string;
teamName: string;
onSave: () => void;
onClose: () => void;
}) {
const { formatMessage, labels, messages, getErrorMessage, FormattedMessage } = useMessages();
const { mutateAsync, error, isPending } = useDeleteQuery(`/teams/${teamId}/users/${userId}`);
const { touch } = useModified();
const handleConfirm = async () => {
await mutateAsync(null, {
onSuccess: async () => {
touch('teams:members');
onSave();
onClose();
},
});
};
return (
<ConfirmationForm
buttonLabel={formatMessage(labels.leave)}
message={
<FormattedMessage
{...messages.confirmLeave}
values={{
target: <b>{teamName}</b>,
}}
/>
}
onConfirm={handleConfirm}
onClose={onClose}
isLoading={isPending}
error={getErrorMessage(error)}
/>
);
}
|