packages/pass/components/SecureLink/SecureLinkQuickActions.tsx

   1 import { type FC } from 'react';
   2 import { useSelector } from 'react-redux';
   3
   4 import { c } from 'ttag';
   5
   6 import { DropdownMenuButton } from '@proton/pass/components/Layout/Dropdown/DropdownMenuButton';
   7 import { QuickActionsDropdown } from '@proton/pass/components/Layout/Dropdown/QuickActionsDropdown';
   8 import { useRequest } from '@proton/pass/hooks/useRequest';
   9 import { secureLinksRemoveInactive } from '@proton/pass/store/actions';
  10 import { selectInactiveSecureLinks } from '@proton/pass/store/selectors';
  11
  12 export const SecureLinkQuickActions: FC = () => {
  13     const inactiveLinkCount = useSelector(selectInactiveSecureLinks).length;
  14     const { loading, dispatch } = useRequest(secureLinksRemoveInactive, { initial: true });
  15
  16     return (
  17         <QuickActionsDropdown iconSize={4} originalPlacement="bottom-end" pill shape="ghost" size="small">
  18             <DropdownMenuButton
  19                 danger
  20                 loading={loading}
  21                 disabled={inactiveLinkCount === 0 || loading}
  22                 onClick={() => dispatch()}
  23                 label={
  24                     inactiveLinkCount
  25                         ? c('Action').t`Remove all expired links (${inactiveLinkCount})`
  26                         : c('Action').t`No expired links`
  27                 }
  28                 ellipsis
  29                 icon="trash"
  30                 size="small"
  31             />
  32         </QuickActionsDropdown>
  33     );
  34 };