🔥(frontend) remove button delete invitation

We can already remove a invitation directly from
the role dropdown, so having a delete button in the
more actions menu is redundant.

src/frontend/apps/e2e/__tests__/app-impress/doc-member-create.spec.ts

@@ -84,7 +84,7 @@ test.describe('Document create member', () => {
 
     // Validate
     await page.getByRole('menuitem', { name: 'Administrator' }).click();
-    await page.getByRole('button', { name: /^Invite / }).click();
+    await page.getByTestId('doc-share-invite-button').click();
 
     // Check invitation added
     await expect(
@@ -135,7 +135,7 @@ test.describe('Document create member', () => {
       (response) =>
         response.url().includes('/invitations/') && response.status() === 201,
     );
-    await page.getByRole('button', { name: /^Invite / }).click();
+    await page.getByTestId('doc-share-invite-button').click();
 
     // Check invitation sent
 
@@ -154,7 +154,7 @@ test.describe('Document create member', () => {
         response.url().includes('/invitations/') && response.status() === 400,
     );
 
-    await page.getByRole('button', { name: /^Invite / }).click();
+    await page.getByTestId('doc-share-invite-button').click();
     await expect(
       page.getByText(`"${email}" is already invited to the document.`),
     ).toBeVisible();
@@ -191,7 +191,7 @@ test.describe('Document create member', () => {
         response.url().includes('/invitations/') && response.status() === 201,
     );
 
-    await page.getByRole('button', { name: /^Invite / }).click();
+    await page.getByTestId('doc-share-invite-button').click();
 
     // Check invitation sent
     const responseCreateInvitation = await responsePromiseCreateInvitation;
@@ -216,12 +216,8 @@ test.describe('Document create member', () => {
     const responsePatchInvitation = await responsePromisePatchInvitation;
     expect(responsePatchInvitation.ok()).toBeTruthy();
 
-    const moreActions = userInvitation.getByRole('button', {
+    await userInvitation.getByTestId('doc-role-dropdown').click();
-      name: 'Open invitation actions menu',
+    await page.getByRole('menuitem', { name: 'Remove access' }).click();
-    });
-    await moreActions.click();
-
-    await page.getByRole('menuitem', { name: 'Delete' }).click();
 
     await expect(userInvitation).toBeHidden();
   });

src/frontend/apps/impress/src/features/docs/doc-share/components/DocShareInvitation.tsx

@@ -3,25 +3,13 @@ import { useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { css } from 'styled-components';
 
-import {
+import { Box, BoxButton, Icon, LoadMoreText, Text } from '@/components';
-  Box,
-  DropdownMenu,
-  DropdownMenuOption,
-  Icon,
-  IconOptions,
-  LoadMoreText,
-  Text,
-} from '@/components';
 import { QuickSearchData, QuickSearchGroup } from '@/components/quick-search';
 import { useCunninghamTheme } from '@/cunningham';
 import { Doc, Role } from '@/docs/doc-management';
 import { User } from '@/features/auth';
 
-import {
+import { useDocInvitationsInfinite, useUpdateDocInvitation } from '../api';
-  useDeleteDocInvitation,
-  useDocInvitationsInfinite,
-  useUpdateDocInvitation,
-} from '../api';
 import { Invitation } from '../types';
 
 import { DocRoleDropdown } from './DocRoleDropdown';
@@ -61,18 +49,6 @@ export const DocShareInvitationItem = ({
     },
   });
 
-  const { mutate: removeDocInvitation } = useDeleteDocInvitation({
-    onError: (error) => {
-      toast(
-        error?.data?.role?.[0] ?? t('Error during delete invitation'),
-        VariantType.ERROR,
-        {
-          duration: 4000,
-        },
-      );
-    },
-  });
-
   const onUpdate = (newRole: Role) => {
     updateDocInvitation({
       docId: doc.id,
@@ -81,19 +57,6 @@ export const DocShareInvitationItem = ({
     });
   };
 
-  const onRemove = () => {
-    removeDocInvitation({ invitationId: invitation.id, docId: doc.id });
-  };
-
-  const moreActions: DropdownMenuOption[] = [
-    {
-      label: t('Delete'),
-      icon: 'delete',
-      callback: onRemove,
-      disabled: !canUpdate,
-    },
-  ];
-
   return (
     <Box
       $width="100%"
@@ -116,16 +79,6 @@ export const DocShareInvitationItem = ({
                 email: invitation.email,
               })}
             />
-
-            {canUpdate && (
-              <DropdownMenu
-                data-testid="doc-share-invitation-more-actions"
-                options={moreActions}
-                label={t('Open invitation actions menu')}
-              >
-                <IconOptions isHorizontal $variation="600" aria-hidden="true" />
-              </DropdownMenu>
-            )}
           </Box>
         }
       />
@@ -149,26 +102,22 @@ export const DocShareModalInviteUserRow = ({
       <SearchUserRow
         user={user}
         right={
-          <Box
+          <BoxButton
             className="right-hover"
             $direction="row"
             $align="center"
             $css={css`
               contain: content;
             `}
-            $color="var(--c--theme--colors--greyscale-400)"
+            $theme="brand"
-            $cursor="pointer"
+            $variation="tertiary"
+            $gap="var(--c--globals--spacings--xxxs)"
           >
-            <Text $theme="primary" $variation="800" $size="sm">
+            <Text $withThemeInherited $size="sm">
               {t('Add')}
             </Text>
-            <Icon
+            <Icon $withThemeInherited iconName="add" />
-              $theme="primary"
+          </BoxButton>
-              $variation="800"
-              iconName="add"
-              aria-hidden="true"
-            />
-          </Box>
         }
       />
     </Box>