import { Button } from "~/components/ui/button"; import logoPng from "~/images/lume-logo.png?url"; import lumeColorLogoPng from "~/images/lume-color-logo.png?url"; import discordLogoPng from "~/images/discord-logo.png?url"; import { Link, useLocation } from "@remix-run/react"; import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger, } from "~/components/ui/dialog"; import { useUppy } from "./lib/uppy"; import type { UppyFile } from "@uppy/core"; import { Progress } from "~/components/ui/progress"; import { DialogClose } from "@radix-ui/react-dialog"; import { ChevronDownIcon, ExitIcon, TrashIcon } from "@radix-ui/react-icons"; import { ClockIcon, DriveIcon, CircleLockIcon, CloudUploadIcon, CloudCheckIcon, BoxCheckedIcon, PageIcon, ThemeIcon, } from "./icons"; import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, } from "./ui/dropdown-menu"; import { Avatar } from "@radix-ui/react-avatar"; import { cn } from "~/utils"; import { useGetIdentity, useLogout } from "@refinedev/core"; import { PinningNetworkBanner } from "./pinning-network-banner"; import { PinningProvider } from "~/providers/PinningProvider"; import type { Identity } from "~/data/auth-provider"; import { Tooltip, TooltipContent, TooltipTrigger, TooltipProvider, } from "./ui/tooltip"; export const GeneralLayout = ({ children }: React.PropsWithChildren) => { const location = useLocation(); const { data: identity } = useGetIdentity(); const { mutate: logout } = useLogout(); return (
Lume logo

Freedom

Privacy

Ownership

logout()}> Logout
{children}
); }; const UploadFileForm = () => { const { getRootProps, getInputProps, getFiles, upload, state, removeFile, cancelAll, } = useUppy(); console.log({ state, files: getFiles() }); const isUploading = state === "uploading"; const isCompleted = state === "completed"; const hasStarted = state !== "idle" && state !== "initializing"; return ( <> Upload Files {!hasStarted ? (

Drag & Drop Files or Browse

) : null}
{getFiles().map((file) => ( { removeFile(id); }} /> ))}
{hasStarted ? (
{isCompleted ? "Upload completed" : `${getFiles().length} files being uploaded`}
) : null} {isUploading ? ( ) : null} {isCompleted ? ( ) : null} {!hasStarted && !isCompleted && !isUploading ? ( ) : null} ); }; function bytestoMegabytes(bytes: number) { return bytes / 1024 / 1024; } const UploadFileItem = ({ file, onRemove, }: { file: UppyFile; onRemove: (id: string) => void; }) => { const sizeInMb = bytestoMegabytes(file.size).toFixed(2); return (
{file.progress?.uploadComplete ? ( ) : ( )}

{file.name} {" "} ({sizeInMb}MB)

{file.name} ({sizeInMb}MB)

{file.progress?.uploadStarted && !file.progress.uploadComplete ? ( ) : null}
); }; const NavigationButton = ({ children, active, }: React.PropsWithChildren<{ active?: boolean }>) => { return ( ); };