🗑️(frontend) clean member feature

Clean a bit member feature, remove unused files
and refactor some code.
This commit is contained in:
Anthony LC
2024-08-16 16:58:55 +02:00
committed by Anthony LC
parent 5ef0f825e0
commit fe00d65500
8 changed files with 52 additions and 66 deletions

View File

@@ -5,5 +5,6 @@ export * from './DropButton';
export * from './Icon';
export * from './InfiniteScroll';
export * from './Link';
export * from './SideModal';
export * from './Text';
export * from './TextErrors';

View File

@@ -1,3 +1,4 @@
export * from './useCreateDocInvitation';
export * from './useDeleteDocInvitation';
export * from './useDocInvitations';
export * from './useUpdateDocInvitation';

View File

@@ -3,10 +3,12 @@ import { useMutation, useQueryClient } from '@tanstack/react-query';
import { APIError, errorCauses, fetchAPI } from '@/api';
import { User } from '@/core/auth';
import { Doc, Role } from '@/features/docs/doc-management';
import { OptionType } from '@/features/docs/members/members-add/types';
import { ContentLanguage } from '@/i18n/types';
import { KEY_LIST_DOC_INVITATIONS } from '../../invitation-list';
import { DocInvitation, OptionType } from '../types';
import { Invitation } from '../types';
import { KEY_LIST_DOC_INVITATIONS } from './useDocInvitations';
interface CreateDocInvitationParams {
email: User['email'];
@@ -20,7 +22,7 @@ export const createDocInvitation = async ({
role,
docId,
contentLanguage,
}: CreateDocInvitationParams): Promise<DocInvitation> => {
}: CreateDocInvitationParams): Promise<Invitation> => {
const response = await fetchAPI(`documents/${docId}/invitations/`, {
method: 'POST',
headers: {
@@ -42,12 +44,12 @@ export const createDocInvitation = async ({
);
}
return response.json() as Promise<DocInvitation>;
return response.json() as Promise<Invitation>;
};
export function useCreateInvitation() {
export function useCreateDocInvitation() {
const queryClient = useQueryClient();
return useMutation<DocInvitation, APIError, CreateDocInvitationParams>({
return useMutation<Invitation, APIError, CreateDocInvitationParams>({
mutationFn: createDocInvitation,
onSuccess: () => {
void queryClient.invalidateQueries({

View File

@@ -1,3 +1,2 @@
export * from './useCreateDocInvitation';
export * from './useCreateDocAccess';
export * from './useUsers';

View File

@@ -9,9 +9,10 @@ import { useTranslation } from 'react-i18next';
import { APIError } from '@/api';
import { Box, Card, IconBG } from '@/components';
import { Doc, Role } from '@/features/docs/doc-management';
import { useCreateDocInvitation } from '@/features/docs/members/invitation-list/';
import { useLanguage } from '@/i18n/hooks/useLanguage';
import { useCreateDocAccess, useCreateInvitation } from '../api';
import { useCreateDocAccess } from '../api';
import {
OptionInvitation,
OptionNewMember,
@@ -39,7 +40,7 @@ export const AddMembers = ({ currentRole, doc }: ModalAddMembersProps) => {
const [selectedUsers, setSelectedUsers] = useState<OptionsSelect>([]);
const [selectedRole, setSelectedRole] = useState<Role>();
const { toast } = useToastProvider();
const { mutateAsync: createInvitation } = useCreateInvitation();
const { mutateAsync: createInvitation } = useCreateDocInvitation();
const { mutateAsync: createDocAccess } = useCreateDocAccess();
const [resetKey, setResetKey] = useState(1);

View File

@@ -1,5 +1,4 @@
import { User } from '@/core/auth';
import { Doc, Role } from '@/features/docs/doc-management';
export enum OptionType {
INVITATION = 'invitation',
@@ -25,12 +24,3 @@ export interface OptionNewMember {
}
export type OptionSelect = OptionNewMember | OptionInvitation;
export interface DocInvitation {
id: string;
created_at: string;
email: string;
team: Doc['id'];
role: Role;
issuer: User['id'];
}

View File

@@ -1,8 +0,0 @@
<svg viewBox="0 0 48 42" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M4.85735 7.9065L0 3.05123L3.05331 0L41.593 38.5397L38.5418 41.591L28.4121 31.4612C27.3276 31.7198 26.2034 31.8554 25.0584 31.8554C22.0135 31.8554 19.1145 30.896 16.7161 29.2275V33.941H2.11688V25.5986C2.11688 23.3045 3.99392 21.4274 6.28807 21.4274H13.108C14.5262 21.4274 15.7984 22.1991 16.6118 23.3462C18.6369 26.2055 21.7569 27.5528 24.6246 27.6759L21.953 25.0021C20.5035 24.4223 19.2334 23.4421 18.322 22.1574C17.0706 20.4055 15.2144 19.4044 13.2123 19.3627C13.5397 18.8037 14.0819 18.2886 14.7765 17.8256L13.5522 16.6013C12.4281 18.2573 10.5302 19.3418 8.37367 19.3418C4.91158 19.3418 2.11688 16.5471 2.11688 13.085C2.11688 10.9285 3.20139 9.03063 4.85735 7.9065ZM24.1804 15.1915C24.4786 15.1769 24.7727 15.1706 25.0584 15.1706C29.3965 15.1706 35.403 16.7974 36.9046 19.3418C34.9025 19.3835 33.0463 20.3846 31.7949 22.1365C31.7031 22.2679 31.6072 22.3951 31.5071 22.5203L24.1804 15.1915ZM32.9962 24.0094C33.3174 23.634 33.4863 23.3754 33.5051 23.3462C34.1933 22.3659 35.403 21.4274 37.0089 21.4274H43.8288C46.123 21.4274 48 23.3045 48 25.5986V33.941H42.9299L32.9962 24.0094ZM41.7432 19.3418C38.2811 19.3418 35.4864 16.5471 35.4864 13.085C35.4864 9.62294 38.2811 6.82824 41.7432 6.82824C45.2053 6.82824 48 9.62294 48 13.085C48 16.5471 45.2053 19.3418 41.7432 19.3418ZM25.0584 13.085C21.5964 13.085 18.8017 10.2903 18.8017 6.82824C18.8017 3.36615 21.5964 0.571453 25.0584 0.571453C28.5205 0.571453 31.3152 3.36615 31.3152 6.82824C31.3152 10.2903 28.5205 13.085 25.0584 13.085Z"
fill="currentColor"
/>
</svg>

Before

Width:  |  Height:  |  Size: 1.6 KiB

View File

@@ -70,49 +70,49 @@ export const MemberItem = ({
return (
<Box $width="100%">
<Box
$align="center"
$direction="row"
$gap="1rem"
$justify="space-between"
$width="100%"
$wrap="wrap"
>
<Box $direction="row" $gap="1rem">
<IconBG iconName="account_circle" $size="2rem" />
<Box $direction="row" $gap="1rem">
<IconBG iconName="account_circle" $size="2rem" />
<Box
$align="center"
$direction="row"
$gap="1rem"
$justify="space-between"
$width="100%"
$wrap="wrap"
>
<Text $justify="center">{access.user.email}</Text>
</Box>
<Box $direction="row" $gap="1rem" $align="center">
<Box $minWidth="13rem">
<ChooseRole
label={t('Role')}
defaultRole={localRole}
currentRole={currentRole}
<Box $direction="row" $gap="1rem" $align="center">
<Box $minWidth="13rem">
<ChooseRole
label={t('Role')}
defaultRole={localRole}
currentRole={currentRole}
disabled={isNotAllowed}
setRole={(role) => {
setLocalRole(role);
updateDocAccess({
docId,
accessId: access.id,
role,
});
}}
/>
</Box>
<Button
color="tertiary-text"
icon={
<Text
$isMaterialIcon
$theme={isNotAllowed ? 'greyscale' : 'primary'}
$variation={isNotAllowed ? '500' : 'text'}
>
delete
</Text>
}
disabled={isNotAllowed}
setRole={(role) => {
setLocalRole(role);
updateDocAccess({
docId,
accessId: access.id,
role,
});
}}
onClick={() => removeDocAccess({ docId, accessId: access.id })}
/>
</Box>
<Button
color="tertiary-text"
icon={
<Text
$isMaterialIcon
$theme={isNotAllowed ? 'greyscale' : 'primary'}
$variation={isNotAllowed ? '500' : 'text'}
>
delete
</Text>
}
disabled={isNotAllowed}
onClick={() => removeDocAccess({ docId, accessId: access.id })}
/>
</Box>
</Box>
{(errorUpdate || errorDelete) && (