🚚(frontend) move to members/members-add
Move addUsers to members/members-add. Rename some of the occurences of user to member.
This commit is contained in:
@@ -16,9 +16,9 @@ test.describe('Document add users', () => {
|
|||||||
await createPad(page, 'select-multi-users', browserName, 1);
|
await createPad(page, 'select-multi-users', browserName, 1);
|
||||||
|
|
||||||
await page.getByLabel('Open the document options').click();
|
await page.getByLabel('Open the document options').click();
|
||||||
await page.getByRole('button', { name: 'Add a user' }).click();
|
await page.getByRole('button', { name: 'Add members' }).click();
|
||||||
|
|
||||||
const inputSearch = page.getByLabel(/Find a user to add to the document/);
|
const inputSearch = page.getByLabel(/Find a member to add to the document/);
|
||||||
await expect(inputSearch).toBeVisible();
|
await expect(inputSearch).toBeVisible();
|
||||||
|
|
||||||
// Select user 1
|
// Select user 1
|
||||||
@@ -77,9 +77,9 @@ test.describe('Document add users', () => {
|
|||||||
await createPad(page, 'user-invitation', browserName, 1);
|
await createPad(page, 'user-invitation', browserName, 1);
|
||||||
|
|
||||||
await page.getByLabel('Open the document options').click();
|
await page.getByLabel('Open the document options').click();
|
||||||
await page.getByRole('button', { name: 'Add a user' }).click();
|
await page.getByRole('button', { name: 'Add members' }).click();
|
||||||
|
|
||||||
const inputSearch = page.getByLabel(/Find a user to add to the document/);
|
const inputSearch = page.getByLabel(/Find a member to add to the document/);
|
||||||
|
|
||||||
const email = randomName('test@test.fr', browserName, 1)[0];
|
const email = randomName('test@test.fr', browserName, 1)[0];
|
||||||
await inputSearch.fill(email);
|
await inputSearch.fill(email);
|
||||||
@@ -127,9 +127,9 @@ test.describe('Document add users', () => {
|
|||||||
await createPad(page, 'user-twice', browserName, 1);
|
await createPad(page, 'user-twice', browserName, 1);
|
||||||
|
|
||||||
await page.getByLabel('Open the document options').click();
|
await page.getByLabel('Open the document options').click();
|
||||||
await page.getByRole('button', { name: 'Add a user' }).click();
|
await page.getByRole('button', { name: 'Add members' }).click();
|
||||||
|
|
||||||
const inputSearch = page.getByLabel(/Find a user to add to the document/);
|
const inputSearch = page.getByLabel(/Find a member to add to the document/);
|
||||||
await inputSearch.fill('user');
|
await inputSearch.fill('user');
|
||||||
const responseSearchUser = await responsePromiseSearchUser;
|
const responseSearchUser = await responsePromiseSearchUser;
|
||||||
const users = (await responseSearchUser.json()).results as {
|
const users = (await responseSearchUser.json()).results as {
|
||||||
@@ -152,7 +152,7 @@ test.describe('Document add users', () => {
|
|||||||
expect(responseAddMember.ok()).toBeTruthy();
|
expect(responseAddMember.ok()).toBeTruthy();
|
||||||
|
|
||||||
await page.getByLabel('Open the document options').click();
|
await page.getByLabel('Open the document options').click();
|
||||||
await page.getByRole('button', { name: 'Add a user' }).click();
|
await page.getByRole('button', { name: 'Add members' }).click();
|
||||||
|
|
||||||
await inputSearch.fill('user');
|
await inputSearch.fill('user');
|
||||||
await expect(
|
await expect(
|
||||||
@@ -167,9 +167,9 @@ test.describe('Document add users', () => {
|
|||||||
await createPad(page, 'invitation-twice', browserName, 1);
|
await createPad(page, 'invitation-twice', browserName, 1);
|
||||||
|
|
||||||
await page.getByLabel('Open the document options').click();
|
await page.getByLabel('Open the document options').click();
|
||||||
await page.getByRole('button', { name: 'Add a user' }).click();
|
await page.getByRole('button', { name: 'Add members' }).click();
|
||||||
|
|
||||||
const inputSearch = page.getByLabel(/Find a user to add to the document/);
|
const inputSearch = page.getByLabel(/Find a member to add to the document/);
|
||||||
|
|
||||||
const email = randomName('test@test.fr', browserName, 1)[0];
|
const email = randomName('test@test.fr', browserName, 1)[0];
|
||||||
await inputSearch.fill(email);
|
await inputSearch.fill(email);
|
||||||
@@ -191,7 +191,7 @@ test.describe('Document add users', () => {
|
|||||||
expect(responseCreateInvitation.ok()).toBeTruthy();
|
expect(responseCreateInvitation.ok()).toBeTruthy();
|
||||||
|
|
||||||
await page.getByLabel('Open the document options').click();
|
await page.getByLabel('Open the document options').click();
|
||||||
await page.getByRole('button', { name: 'Add a user' }).click();
|
await page.getByRole('button', { name: 'Add members' }).click();
|
||||||
|
|
||||||
await inputSearch.fill(email);
|
await inputSearch.fill(email);
|
||||||
await expect(page.getByRole('option', { name: email })).toBeHidden();
|
await expect(page.getByRole('option', { name: email })).toBeHidden();
|
||||||
|
|||||||
@@ -177,7 +177,7 @@ test.describe('Pad Tools', () => {
|
|||||||
await page.getByLabel('Open the document options').click();
|
await page.getByLabel('Open the document options').click();
|
||||||
|
|
||||||
await expect(
|
await expect(
|
||||||
page.getByRole('button', { name: 'Add a user' }),
|
page.getByRole('button', { name: 'Add members' }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
await expect(
|
await expect(
|
||||||
page.getByRole('button', { name: 'Generate PDF' }),
|
page.getByRole('button', { name: 'Generate PDF' }),
|
||||||
@@ -230,7 +230,9 @@ test.describe('Pad Tools', () => {
|
|||||||
|
|
||||||
await page.getByLabel('Open the document options').click();
|
await page.getByLabel('Open the document options').click();
|
||||||
|
|
||||||
await expect(page.getByRole('button', { name: 'Add a user' })).toBeHidden();
|
await expect(
|
||||||
|
page.getByRole('button', { name: 'Add members' }),
|
||||||
|
).toBeHidden();
|
||||||
await expect(
|
await expect(
|
||||||
page.getByRole('button', { name: 'Generate PDF' }),
|
page.getByRole('button', { name: 'Generate PDF' }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
@@ -282,7 +284,9 @@ test.describe('Pad Tools', () => {
|
|||||||
|
|
||||||
await page.getByLabel('Open the document options').click();
|
await page.getByLabel('Open the document options').click();
|
||||||
|
|
||||||
await expect(page.getByRole('button', { name: 'Add a user' })).toBeHidden();
|
await expect(
|
||||||
|
page.getByRole('button', { name: 'Add members' }),
|
||||||
|
).toBeHidden();
|
||||||
await expect(
|
await expect(
|
||||||
page.getByRole('button', { name: 'Generate PDF' }),
|
page.getByRole('button', { name: 'Generate PDF' }),
|
||||||
).toBeVisible();
|
).toBeVisible();
|
||||||
|
|||||||
@@ -1 +0,0 @@
|
|||||||
export * from './components/ModalAddUsers';
|
|
||||||
@@ -2,8 +2,13 @@ import { useMutation, useQueryClient } from '@tanstack/react-query';
|
|||||||
|
|
||||||
import { APIError, errorCauses, fetchAPI } from '@/api';
|
import { APIError, errorCauses, fetchAPI } from '@/api';
|
||||||
import { User } from '@/core/auth';
|
import { User } from '@/core/auth';
|
||||||
|
import {
|
||||||
|
Access,
|
||||||
|
KEY_LIST_PAD,
|
||||||
|
Pad,
|
||||||
|
Role,
|
||||||
|
} from '@/features/pads/pad-management';
|
||||||
|
|
||||||
import { Access, KEY_LIST_PAD, Pad, Role } from '../../pad-management';
|
|
||||||
import { OptionType } from '../types';
|
import { OptionType } from '../types';
|
||||||
|
|
||||||
import { KEY_LIST_USER } from './useUsers';
|
import { KEY_LIST_USER } from './useUsers';
|
||||||
@@ -11,27 +16,27 @@ import { KEY_LIST_USER } from './useUsers';
|
|||||||
interface CreateDocAccessParams {
|
interface CreateDocAccessParams {
|
||||||
role: Role;
|
role: Role;
|
||||||
docId: Pad['id'];
|
docId: Pad['id'];
|
||||||
userId: User['id'];
|
memberId: User['id'];
|
||||||
}
|
}
|
||||||
|
|
||||||
export const createDocAccess = async ({
|
export const createDocAccess = async ({
|
||||||
userId,
|
memberId,
|
||||||
role,
|
role,
|
||||||
docId,
|
docId,
|
||||||
}: CreateDocAccessParams): Promise<Access> => {
|
}: CreateDocAccessParams): Promise<Access> => {
|
||||||
const response = await fetchAPI(`documents/${docId}/accesses/`, {
|
const response = await fetchAPI(`documents/${docId}/accesses/`, {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
body: JSON.stringify({
|
body: JSON.stringify({
|
||||||
user: userId,
|
user: memberId,
|
||||||
role,
|
role,
|
||||||
}),
|
}),
|
||||||
});
|
});
|
||||||
|
|
||||||
if (!response.ok) {
|
if (!response.ok) {
|
||||||
throw new APIError(
|
throw new APIError(
|
||||||
`Failed to add the user in the doc.`,
|
`Failed to add the member in the doc.`,
|
||||||
await errorCauses(response, {
|
await errorCauses(response, {
|
||||||
type: OptionType.NEW_USER,
|
type: OptionType.NEW_MEMBER,
|
||||||
}),
|
}),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
Before Width: | Height: | Size: 925 B After Width: | Height: | Size: 925 B |
@@ -18,10 +18,10 @@ import { useCreateDocAccess, useCreateInvitation } from '../api';
|
|||||||
import IconAddUser from '../assets/add-user.svg';
|
import IconAddUser from '../assets/add-user.svg';
|
||||||
import {
|
import {
|
||||||
OptionInvitation,
|
OptionInvitation,
|
||||||
OptionNewUser,
|
OptionNewMember,
|
||||||
OptionSelect,
|
OptionSelect,
|
||||||
OptionType,
|
OptionType,
|
||||||
isOptionNewUser,
|
isOptionNewMember,
|
||||||
} from '../types';
|
} from '../types';
|
||||||
|
|
||||||
import { ChooseRole } from './ChooseRole';
|
import { ChooseRole } from './ChooseRole';
|
||||||
@@ -38,17 +38,17 @@ type APIErrorUser = APIError<{
|
|||||||
type: OptionType;
|
type: OptionType;
|
||||||
}>;
|
}>;
|
||||||
|
|
||||||
interface ModalAddUsersProps {
|
interface ModalAddMembersProps {
|
||||||
currentRole: Role;
|
currentRole: Role;
|
||||||
onClose: () => void;
|
onClose: () => void;
|
||||||
doc: Pad;
|
doc: Pad;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const ModalAddUsers = ({
|
export const ModalAddMembers = ({
|
||||||
currentRole,
|
currentRole,
|
||||||
onClose,
|
onClose,
|
||||||
doc,
|
doc,
|
||||||
}: ModalAddUsersProps) => {
|
}: ModalAddMembersProps) => {
|
||||||
const { colorsTokens } = useCunninghamTheme();
|
const { colorsTokens } = useCunninghamTheme();
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const [selectedUsers, setSelectedUsers] = useState<OptionsSelect>([]);
|
const [selectedUsers, setSelectedUsers] = useState<OptionsSelect>([]);
|
||||||
@@ -70,11 +70,11 @@ export const ModalAddUsers = ({
|
|||||||
});
|
});
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case OptionType.NEW_USER:
|
case OptionType.NEW_MEMBER:
|
||||||
await createDocAccess({
|
await createDocAccess({
|
||||||
role: selectedRole,
|
role: selectedRole,
|
||||||
docId: doc.id,
|
docId: doc.id,
|
||||||
userId: selectedUser.value.id,
|
memberId: selectedUser.value.id,
|
||||||
});
|
});
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
@@ -92,13 +92,13 @@ export const ModalAddUsers = ({
|
|||||||
? t(`Failed to create the invitation for {{email}}.`, {
|
? t(`Failed to create the invitation for {{email}}.`, {
|
||||||
email: dataError?.value,
|
email: dataError?.value,
|
||||||
})
|
})
|
||||||
: t(`Failed to add the user in the document.`);
|
: t(`Failed to add the member in the document.`);
|
||||||
|
|
||||||
toast(messageError, VariantType.ERROR, toastOptions);
|
toast(messageError, VariantType.ERROR, toastOptions);
|
||||||
};
|
};
|
||||||
|
|
||||||
const onSuccess = (option: OptionSelect) => {
|
const onSuccess = (option: OptionSelect) => {
|
||||||
const message = !isOptionNewUser(option)
|
const message = !isOptionNewMember(option)
|
||||||
? t('Invitation sent to {{email}}.', {
|
? t('Invitation sent to {{email}}.', {
|
||||||
email: option.value.email,
|
email: option.value.email,
|
||||||
})
|
})
|
||||||
@@ -111,7 +111,7 @@ export const ModalAddUsers = ({
|
|||||||
setIsPending(true);
|
setIsPending(true);
|
||||||
|
|
||||||
const settledPromises = await Promise.allSettled<
|
const settledPromises = await Promise.allSettled<
|
||||||
OptionInvitation | OptionNewUser
|
OptionInvitation | OptionNewMember
|
||||||
>(switchActions(selectedUsers));
|
>(switchActions(selectedUsers));
|
||||||
|
|
||||||
onClose();
|
onClose();
|
||||||
@@ -161,7 +161,7 @@ export const ModalAddUsers = ({
|
|||||||
<Box $align="center" $gap="1rem">
|
<Box $align="center" $gap="1rem">
|
||||||
<IconAddUser width={48} color={colorsTokens()['primary-text']} />
|
<IconAddUser width={48} color={colorsTokens()['primary-text']} />
|
||||||
<Text $size="h3" $margin="none">
|
<Text $size="h3" $margin="none">
|
||||||
{t('Add users to the document')}
|
{t('Add members to the document')}
|
||||||
</Text>
|
</Text>
|
||||||
</Box>
|
</Box>
|
||||||
}
|
}
|
||||||
@@ -55,7 +55,7 @@ export const SearchUsers = ({
|
|||||||
let users: OptionsSelect = optionsFiltered.map((user) => ({
|
let users: OptionsSelect = optionsFiltered.map((user) => ({
|
||||||
value: user,
|
value: user,
|
||||||
label: user.email,
|
label: user.email,
|
||||||
type: OptionType.NEW_USER,
|
type: OptionType.NEW_MEMBER,
|
||||||
}));
|
}));
|
||||||
|
|
||||||
if (userQuery && isValidEmail(userQuery)) {
|
if (userQuery && isValidEmail(userQuery)) {
|
||||||
@@ -103,17 +103,17 @@ export const SearchUsers = ({
|
|||||||
return (
|
return (
|
||||||
<AsyncSelect
|
<AsyncSelect
|
||||||
isDisabled={disabled}
|
isDisabled={disabled}
|
||||||
aria-label={t('Find a user to add to the document')}
|
aria-label={t('Find a member to add to the document')}
|
||||||
isMulti
|
isMulti
|
||||||
loadOptions={loadOptions}
|
loadOptions={loadOptions}
|
||||||
defaultOptions={[]}
|
defaultOptions={[]}
|
||||||
onInputChange={onInputChangeHandle}
|
onInputChange={onInputChangeHandle}
|
||||||
inputValue={input}
|
inputValue={input}
|
||||||
placeholder={t('Search new users by email')}
|
placeholder={t('Search new members by email')}
|
||||||
noOptionsMessage={() =>
|
noOptionsMessage={() =>
|
||||||
input
|
input
|
||||||
? t("We didn't find something matching, try to be more accurate")
|
? t("We didn't find a mail matching, try to be more accurate")
|
||||||
: t('Invite new users to {{title}}', { title: doc.title })
|
: t('Invite new members to {{title}}', { title: doc.title })
|
||||||
}
|
}
|
||||||
onChange={(value) => {
|
onChange={(value) => {
|
||||||
setInput('');
|
setInput('');
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
export * from './components/ModalAddMembers';
|
||||||
@@ -1,13 +1,14 @@
|
|||||||
import { User } from '@/core/auth';
|
import { User } from '@/core/auth';
|
||||||
|
import { Pad, Role } from '@/features/pads/pad-management';
|
||||||
import { Pad, Role } from '../pad-management';
|
|
||||||
|
|
||||||
export enum OptionType {
|
export enum OptionType {
|
||||||
INVITATION = 'invitation',
|
INVITATION = 'invitation',
|
||||||
NEW_USER = 'new_user',
|
NEW_MEMBER = 'new_member',
|
||||||
}
|
}
|
||||||
|
|
||||||
export const isOptionNewUser = (data: OptionSelect): data is OptionNewUser => {
|
export const isOptionNewMember = (
|
||||||
|
data: OptionSelect,
|
||||||
|
): data is OptionNewMember => {
|
||||||
return 'id' in data.value;
|
return 'id' in data.value;
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -17,13 +18,13 @@ export interface OptionInvitation {
|
|||||||
type: OptionType.INVITATION;
|
type: OptionType.INVITATION;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface OptionNewUser {
|
export interface OptionNewMember {
|
||||||
value: User;
|
value: User;
|
||||||
label: string;
|
label: string;
|
||||||
type: OptionType.NEW_USER;
|
type: OptionType.NEW_MEMBER;
|
||||||
}
|
}
|
||||||
|
|
||||||
export type OptionSelect = OptionNewUser | OptionInvitation;
|
export type OptionSelect = OptionNewMember | OptionInvitation;
|
||||||
|
|
||||||
export interface DocInvitation {
|
export interface DocInvitation {
|
||||||
id: string;
|
id: string;
|
||||||
@@ -3,6 +3,7 @@ import React, { useMemo, useState } from 'react';
|
|||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
import { Box, DropButton, IconOptions, Text } from '@/components';
|
import { Box, DropButton, IconOptions, Text } from '@/components';
|
||||||
|
import { ModalAddMembers } from '@/features/pads/members/members-add';
|
||||||
import {
|
import {
|
||||||
ModalRemovePad,
|
ModalRemovePad,
|
||||||
ModalUpdatePad,
|
ModalUpdatePad,
|
||||||
@@ -10,7 +11,6 @@ import {
|
|||||||
currentDocRole,
|
currentDocRole,
|
||||||
} from '@/features/pads/pad-management';
|
} from '@/features/pads/pad-management';
|
||||||
|
|
||||||
import { ModalAddUsers } from '../../addUsers';
|
|
||||||
import { TemplatesOrdering, useTemplates } from '../api/useTemplates';
|
import { TemplatesOrdering, useTemplates } from '../api/useTemplates';
|
||||||
|
|
||||||
import { ModalPDF } from './ModalPDF';
|
import { ModalPDF } from './ModalPDF';
|
||||||
@@ -24,7 +24,7 @@ export const PadToolBox = ({ pad }: PadToolBoxProps) => {
|
|||||||
const { data: templates } = useTemplates({
|
const { data: templates } = useTemplates({
|
||||||
ordering: TemplatesOrdering.BY_CREATED_ON_DESC,
|
ordering: TemplatesOrdering.BY_CREATED_ON_DESC,
|
||||||
});
|
});
|
||||||
const [isModalAddUserOpen, setIsModalAddUserOpen] = useState(false);
|
const [isModalAddMembersOpen, setIsModalAddMembersOpen] = useState(false);
|
||||||
const [isModalUpdateOpen, setIsModalUpdateOpen] = useState(false);
|
const [isModalUpdateOpen, setIsModalUpdateOpen] = useState(false);
|
||||||
const [isModalRemoveOpen, setIsModalRemoveOpen] = useState(false);
|
const [isModalRemoveOpen, setIsModalRemoveOpen] = useState(false);
|
||||||
const [isModalPDFOpen, setIsModalPDFOpen] = useState(false);
|
const [isModalPDFOpen, setIsModalPDFOpen] = useState(false);
|
||||||
@@ -63,13 +63,13 @@ export const PadToolBox = ({ pad }: PadToolBoxProps) => {
|
|||||||
{pad.abilities.manage_accesses && (
|
{pad.abilities.manage_accesses && (
|
||||||
<Button
|
<Button
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
setIsModalAddUserOpen(true);
|
setIsModalAddMembersOpen(true);
|
||||||
setIsDropOpen(false);
|
setIsDropOpen(false);
|
||||||
}}
|
}}
|
||||||
color="primary-text"
|
color="primary-text"
|
||||||
icon={<span className="material-icons">person_add</span>}
|
icon={<span className="material-icons">person_add</span>}
|
||||||
>
|
>
|
||||||
<Text $theme="primary">{t('Add a user')}</Text>
|
<Text $theme="primary">{t('Add members')}</Text>
|
||||||
</Button>
|
</Button>
|
||||||
)}
|
)}
|
||||||
{pad.abilities.partial_update && (
|
{pad.abilities.partial_update && (
|
||||||
@@ -108,9 +108,9 @@ export const PadToolBox = ({ pad }: PadToolBoxProps) => {
|
|||||||
</Button>
|
</Button>
|
||||||
</Box>
|
</Box>
|
||||||
</DropButton>
|
</DropButton>
|
||||||
{isModalAddUserOpen && (
|
{isModalAddMembersOpen && (
|
||||||
<ModalAddUsers
|
<ModalAddMembers
|
||||||
onClose={() => setIsModalAddUserOpen(false)}
|
onClose={() => setIsModalAddMembersOpen(false)}
|
||||||
doc={pad}
|
doc={pad}
|
||||||
currentRole={currentDocRole(pad)}
|
currentRole={currentDocRole(pad)}
|
||||||
/>
|
/>
|
||||||
|
|||||||
Reference in New Issue
Block a user