diff --git a/components/Bag/Bulk/index.tsx b/components/Bag/Bulk/index.tsx new file mode 100644 index 0000000..6fd6e36 --- /dev/null +++ b/components/Bag/Bulk/index.tsx @@ -0,0 +1,242 @@ +import { DeckImportType } from "@/components/DeckPool/deck-import.type"; +import { MapData, useLocalDeckStorage, useLocalMapStorage } from "@/lib/hooks"; +import { useCopyToClipboard } from "@/lib/hooks/useCopyToClipboard"; +import { useGenericImport } from "@/lib/hooks/useGenericImport"; +import { useJsonCheck } from "@/lib/hooks/useJsonCheck"; +import { + Box, + Button, + Divider, + FormLabel, + Grid, + HStack, + Input, + Switch, + Text, + Textarea, + useDisclosure, +} from "@chakra-ui/react"; +import dynamic from "next/dynamic"; +import Link from "next/link"; +import { useRouter } from "next/router"; +import { useEffect, useState } from "react"; +import { toast } from "react-hot-toast"; +import { useDebounce } from "use-debounce"; +const DynamicReactJson = dynamic(import("react-json-view"), { ssr: false }); + +export const BagBulkContainer = () => { + const { query, push } = useRouter(); + const { decks, pushDeck, removeDeckbyId } = useLocalDeckStorage(); + const { data: maps, add: addMap } = useLocalMapStorage(); + + const [rawText, setRawText] = useState(); + const [_url, setUrl] = useState(); + const [url] = useDebounce(_url, 300); + + const { data: dataGeneric } = useGenericImport(url); + + const urlDisclosure = useDisclosure(); + + const localBulk = { decks, maps }; + + useEffect(() => { + if (query?.url) { + urlDisclosure.onOpen(); + setUrl(query.url as string); + } + }, [query?.url]); + + return ( + + + + Backup your existing storage or upload decks and maps in bulk! + + + + + + {urlDisclosure.isOpen ? ( + Enter URL + ) : ( + Viewing Local Storage + )} + + {urlDisclosure.isOpen && ( + + { + if (rawText) setRawText(undefined); + if (e.target.value === "") { + setUrl(undefined); + return; + } + setUrl(e.target.value); + }} + /> + {!query?.url && ( + + )} + + {query?.url && ( + + )} + + )} + + {urlDisclosure.isOpen && ( + + Or copy/paste the json +