Remove payments API routing initialization
[ProtonMail-WebClient.git] / packages / components / containers / filters / ActionsFilterToolbar.tsx
blobbec334a939f449f00e18723cc04497e3bc3af63d
1 import { c } from 'ttag';
3 import { useUser } from '@proton/account/user/hooks';
4 import { Button } from '@proton/atoms';
5 import useModalState from '@proton/components/components/modalTwo/useModalState';
6 import MailUpsellButton from '@proton/components/components/upsell/MailUpsellButton';
7 import FiltersUpsellModal from '@proton/components/components/upsell/modal/types/FiltersUpsellModal';
8 import { useFilters } from '@proton/mail/filters/hooks';
9 import { hasReachedFiltersLimit } from '@proton/shared/lib/helpers/filters';
11 import FilterModal from './modal/FilterModal';
12 import AdvancedFilterModal from './modal/advanced/AdvancedFilterModal';
14 function ActionsFilterToolbar() {
15     const [user] = useUser();
16     const [filterModalProps, setFilterModalOpen] = useModalState();
17     const [advancedFilterModalProps, setAdvancedFilterModalOpen] = useModalState();
18     const [filters = []] = useFilters();
20     const canCreateFilters = !hasReachedFiltersLimit(user, filters);
22     const [upsellModalProps, handleUpsellModalDisplay, renderUpsellModal] = useModalState();
24     return (
25         <>
26             <div className="mb-4">
27                 {canCreateFilters ? (
28                     <>
29                         <Button color="norm" onClick={() => setFilterModalOpen(true)} className="mb-2 md:mb-0 mr-4">
30                             {c('Action').t`Add filter`}
31                         </Button>
32                         <Button
33                             shape="outline"
34                             onClick={() => setAdvancedFilterModalOpen(true)}
35                             className="mb-2 md:mb-0"
36                         >
37                             {c('Action').t`Add sieve filter`}
38                         </Button>
39                     </>
40                 ) : (
41                     <MailUpsellButton
42                         onClick={() => handleUpsellModalDisplay(true)}
43                         text={c('Action').t`Get more filters`}
44                     />
45                 )}
46             </div>
47             <FilterModal {...filterModalProps} />
48             <AdvancedFilterModal {...advancedFilterModalProps} />
50             {renderUpsellModal && <FiltersUpsellModal modalProps={upsellModalProps} isSettings />}
51         </>
52     );
55 export default ActionsFilterToolbar;