Something went wrong. Try again.
a tool for shared writing and social publishing
Something went wrong. Try again.
2.5 kB · 92 lines
TSX
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293"use client";import { useState } from "react";import { SubscribeWithHandle } from "./HandleSubscribe";import { EmailInput, EmailConfirm } from "./EmailSubscribe";import { EmailSubscribeSuccess } from "./EmailSubscribeSuccess";import { Modal } from "components/Modal";import { ButtonPrimary } from "components/Buttons";import { PostPubInfo } from "app/lish/[did]/[publication]/[rkey]/PostPubInfo";import { ManageSubscription } from "./ManageSubscribe";
export const SubscribeButton = (props: { autoFocus?: boolean; newsletterMode: boolean; user: { loggedIn: boolean; email: string | undefined; handle: string | undefined; subscribed: boolean; };}) => { return ( <Modal className="px-0! py-3! sm:py-4! w-[1000px] sm:max-w-md max-w-full" asChild trigger={ props.user.subscribed ? ( <ManageSubscription {...props} /> ) : ( <ButtonPrimary compact className="text-sm"> Subscribe </ButtonPrimary> ) } > <PostPubInfo autoFocus {...props} /> </Modal> );};
export const SubscribeInput = (props: { autoFocus?: boolean; newsletterMode: boolean; user: { loggedIn: boolean; email: string | undefined; handle: string | undefined; subscribed: boolean; };}) => { let [email, setEmail] = useState(props.user?.email ?? ""); let [confirmState, setConfirmState] = useState<"confirm" | "success">( "confirm", );
if (props.user.subscribed) { return <ManageSubscription {...props} />; } if (props.newsletterMode) { return ( <EmailInput value={email} onChange={setEmail} disabled={props.user?.loggedIn} autoFocus={props.autoFocus} action={ <Modal trigger={ <ButtonPrimary compact className="leading-tight! outline-none! text-sm!"> subscribe </ButtonPrimary> } > {confirmState === "success" ? ( <EmailSubscribeSuccess email={props.user?.email} handle={props.user?.handle} /> ) : ( <EmailConfirm emailValue={email} onSubmit={() => setConfirmState("success")} /> )} </Modal> } /> ); } else return ( <SubscribeWithHandle user={props.user} autoFocus={props.autoFocus} /> );};