import clsx from "clsx"; import { AnimatePresence, motion } from "framer-motion"; import Link from "next/link"; import { useTranslation } from "next-i18next"; import React from "react"; import Menu from "@/components/icons/menu.svg"; import User from "@/components/icons/user.svg"; import UserCircle from "@/components/icons/user-circle.svg"; import Logo from "~/public/logo.svg"; import Dropdown, { DropdownItem, DropdownProps } from "./dropdown"; import Adjustments from "./icons/adjustments.svg"; import Cash from "./icons/cash.svg"; import DotsVertical from "./icons/dots-vertical.svg"; import Github from "./icons/github.svg"; import Login from "./icons/login.svg"; import Logout from "./icons/logout.svg"; import Pencil from "./icons/pencil.svg"; import Question from "./icons/question-mark-circle.svg"; import Support from "./icons/support.svg"; import Twitter from "./icons/twitter.svg"; import LoginForm from "./login-form"; import { useModal } from "./modal"; import { useModalContext } from "./modal/modal-provider"; import Popover from "./popover"; import Preferences from "./preferences"; import { useSession } from "./session"; const HomeLink = () => { return ( ); }; const MobileNavigation: React.VoidFunctionComponent<{ openLoginModal: () => void; }> = ({ openLoginModal }) => { const { user } = useSession(); const { t } = useTranslation("app"); return (
{user ? null : ( )} {user ? (
{user.shortName}
} /> ) : null}
{t("preferences")} } > {t("menu")} } >
); }; const AppMenu: React.VoidFunctionComponent<{ className?: string }> = ({ className, }) => { const { t } = useTranslation("app"); return (
{t("newPoll")} {t("support")}
); }; const UserDropdown: React.VoidFunctionComponent< DropdownProps & { openLoginModal: () => void } > = ({ children, openLoginModal, ...forwardProps }) => { const { logout, user } = useSession(); const { t } = useTranslation("app"); const modalContext = useModalContext(); if (!user) { return null; } return ( {children} {user.isGuest ? ( { modalContext.render({ showClose: true, content: (
Guest
{user.shortName}

{t("guestSessionNotice")}

{t("guestSessionReadMore")}
), overlayClosable: true, footer: null, }); }} /> ) : null} {!user.isGuest ? ( ) : null} {user.isGuest ? ( ) : null} { if (user?.isGuest) { modalContext.render({ title: t("areYouSure"), description: t("endingGuestSessionNotice"), onOk: logout, okButtonProps: { type: "danger", }, okText: t("endSession"), cancelText: t("cancel"), }); } else { logout(); } }} />
); }; const StandardLayout: React.VoidFunctionComponent<{ children?: React.ReactNode; }> = ({ children, ...rest }) => { const { user } = useSession(); const { t } = useTranslation("app"); const [loginModal, openLoginModal] = useModal({ footer: null, overlayClosable: true, showClose: true, content: , }); return (
{loginModal}
{t("newPoll")} {t("support")} {t("preferences")} } > {user ? null : ( )}
{user ? (
{user.shortName}
{user.isGuest ? t("guest") : t("user")}
} /> ) : null}
{children}
{t("donate")}
); }; export default StandardLayout;