TransactionsListMenu.tsx raw
1 import { DownloadIcon, EllipsisVerticalIcon, FunnelIcon } from "lucide-react";
2 import { useState } from "react";
3 import { TransactionsFilterDialog } from "src/components/TransactionsFilterDialog";
4 import { Button } from "src/components/ui/button";
5 import {
6 DropdownMenu,
7 DropdownMenuContent,
8 DropdownMenuItem,
9 DropdownMenuTrigger,
10 } from "src/components/ui/dropdown-menu";
11 import { ProDropdownMenuItem } from "src/components/UpgradeDialog";
12 import useTransactionFiltersStore from "src/state/TransactionFiltersStore";
13 import { handleExportTransactions } from "./transactions-utils";
14
15 export const TransactionsListMenu = ({ appId }: { appId?: number }) => {
16 const [filterDialogOpen, setFilterDialogOpen] = useState(false);
17 const { filters, setFilters } = useTransactionFiltersStore();
18
19 return (
20 <>
21 <DropdownMenu>
22 <Button asChild size="icon" variant="ghost">
23 <DropdownMenuTrigger>
24 <EllipsisVerticalIcon className="h-4 w-4" />
25 </DropdownMenuTrigger>
26 </Button>
27 <DropdownMenuContent align="end">
28 <DropdownMenuItem onClick={() => setFilterDialogOpen(true)}>
29 <FunnelIcon className="h-4 w-4" />
30 Filter Transactions
31 </DropdownMenuItem>
32 <ProDropdownMenuItem onClick={() => handleExportTransactions(appId)}>
33 <DownloadIcon className="h-4 w-4" />
34 Export Transactions
35 </ProDropdownMenuItem>
36 </DropdownMenuContent>
37 </DropdownMenu>
38 <TransactionsFilterDialog
39 open={filterDialogOpen}
40 onOpenChange={setFilterDialogOpen}
41 filters={filters}
42 onFiltersChange={setFilters}
43 />
44 </>
45 );
46 };
47