frontend/components/import-dropdown.tsx

61 lines
1.8 KiB
TypeScript

"use client";
import type React from "react";
import { useState } from "react";
import { Button } from "@/components/ui/button";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
import { Download, FileUp } from "lucide-react";
import { useAuth } from "@/contexts/auth-context";
import { MangaDexImportDialog } from "@/components/manga-dex-import-dialog";
import { MangaManualImportDialog } from "@/components/manga-manual-import-dialog";
export function ImportDropdown() {
const { isAuthenticated } = useAuth();
const [mangaDexDialogOpen, setMangaDexDialogOpen] = useState(false);
const [fileImportDialogOpen, setFileImportDialogOpen] = useState(false);
if (!isAuthenticated) {
return null;
}
return (
<>
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="outline" size="sm" className="gap-2 bg-transparent">
<Download className="h-4 w-4" />
Import
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="start" className="">
<DropdownMenuItem onClick={() => setMangaDexDialogOpen(true)}>
<Download className="mr-2 h-4 w-4" />
Import from MangaDex
</DropdownMenuItem>
<DropdownMenuItem onClick={() => setFileImportDialogOpen(true)}>
<FileUp className="mr-2 h-4 w-4" />
Import from File
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
<MangaDexImportDialog
mangaDexDialogOpen={mangaDexDialogOpen}
onMangaDexDialogOpenChange={setMangaDexDialogOpen}
/>
<MangaManualImportDialog
fileImportDialogOpen={fileImportDialogOpen}
onFileImportDialogOpenChange={setFileImportDialogOpen}
/>
</>
);
}