Something went wrong. Try again.
a tool for shared writing and social publishing
Something went wrong. Try again.
2.8 kB · 101 lines
TSX
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102import { HomeSmall } from "components/Icons/HomeSmall";import { ActionButton } from "./ActionButton";import { useIdentityData } from "components/IdentityProvider";import { PublicationButtons } from "./Publications";import { ReaderUnreadSmall } from "components/Icons/ReaderSmall";import { NotificationsReadSmall, NotificationsUnreadSmall,} from "components/Icons/NotificationSmall";import { SpeedyLink } from "components/SpeedyLink";import { Popover } from "components/Popover";import { WriterSmall } from "components/Icons/WriterSmall";export type navPages = | "home" | "reader" | "pub" | "notifications" | "looseleafs" | "tag" | "profile" | "discover";
export const HomeButton = (props: { current?: boolean; className?: string;}) => { return ( <SpeedyLink href={"/home"} className="hover:!no-underline"> <ActionButton nav icon={<HomeSmall />} label="Home" className={`${props.current ? "bg-bg-page! border-border-light!" : ""} w-full! ${props.className}`} /> </SpeedyLink> );};
export const WriterButton = (props: { currentPage: navPages; currentPubUri?: string; compactOnMobile?: boolean;}) => { let current = props.currentPage === "home" || props.currentPage === "looseleafs" || props.currentPage === "pub";
return ( <SpeedyLink href={"/home"} className="hover:!no-underline"> <ActionButton nav labelOnMobile={!props.compactOnMobile} icon={<WriterSmall />} label="Write" className={`${current ? "bg-bg-page! border-border-light!" : ""}`} /> </SpeedyLink> );};
export const ReaderButton = (props: { current?: boolean; subs: boolean; compactOnMobile?: boolean;}) => { return ( <SpeedyLink href={"/reader"} className="hover:no-underline!"> <ActionButton nav labelOnMobile={!props.compactOnMobile} icon={<ReaderUnreadSmall />} label="Read" className={props.current ? "bg-bg-page! border-border-light!" : ""} /> </SpeedyLink> );};
export function NotificationButton(props: { current?: boolean }) { let { identity } = useIdentityData(); let unreads = identity?.notifications[0]?.count;
return ( <SpeedyLink href={"/notifications"} className="hover:no-underline!"> <ActionButton nav labelOnMobile={false} icon={ unreads ? ( <NotificationsUnreadSmall className="text-accent-contrast" /> ) : ( <NotificationsReadSmall /> ) } label="Notifications" className={`${props.current ? "bg-bg-page! border-border-light!" : ""} ${unreads ? "text-accent-contrast!" : ""}`} /> </SpeedyLink> );}