feat: add Accounts List Card to Calendar Settings (#4129)

Closes #4061

packages/twenty-front/src/modules/settings/accounts/components/SettingsAccountsRowDropdownMenu.tsx

@@ -1,6 +1,8 @@
 import { useNavigate } from 'react-router-dom';
 
 import { ConnectedAccount } from '@/accounts/types/ConnectedAccount';
+import { CoreObjectNameSingular } from '@/object-metadata/types/CoreObjectNameSingular';
+import { useDeleteOneRecord } from '@/object-record/hooks/useDeleteOneRecord';
 import { IconDotsVertical, IconMail, IconTrash } from '@/ui/display/icon';
 import { LightIconButton } from '@/ui/input/button/components/LightIconButton';
 import { Dropdown } from '@/ui/layout/dropdown/components/Dropdown';
@@ -10,21 +12,23 @@ import { useDropdown } from '@/ui/layout/dropdown/hooks/useDropdown';
 import { MenuItem } from '@/ui/navigation/menu-item/components/MenuItem';
 
 type SettingsAccountsRowDropdownMenuProps = {
-  account: ConnectedAccount;
+  account: Pick<ConnectedAccount, 'id' | 'messageChannels'>;
   className?: string;
-  onRemove?: (uuid: string) => void;
 };
 
 export const SettingsAccountsRowDropdownMenu = ({
   account,
   className,
-  onRemove,
 }: SettingsAccountsRowDropdownMenuProps) => {
   const dropdownId = `settings-account-row-${account.id}`;
 
   const navigate = useNavigate();
   const { closeDropdown } = useDropdown(dropdownId);
 
+  const { deleteOneRecord } = useDeleteOneRecord({
+    objectNameSingular: CoreObjectNameSingular.ConnectedAccount,
+  });
+
   return (
     <Dropdown
       dropdownId={dropdownId}
@@ -47,17 +51,15 @@ export const SettingsAccountsRowDropdownMenu = ({
                 closeDropdown();
               }}
             />
-            {!!onRemove && (
-              <MenuItem
-                accent="danger"
-                LeftIcon={IconTrash}
-                text="Remove account"
-                onClick={() => {
-                  onRemove(account.id);
-                  closeDropdown();
-                }}
-              />
-            )}
+            <MenuItem
+              accent="danger"
+              LeftIcon={IconTrash}
+              text="Remove account"
+              onClick={() => {
+                deleteOneRecord(account.id);
+                closeDropdown();
+              }}
+            />
           </DropdownMenuItemsContainer>
         </DropdownMenu>
       }