From 7268456414fa1c36f64873c2adeadcad36465079 Mon Sep 17 00:00:00 2001 From: celine Date: Tue, 25 Nov 2025 15:02:19 -0500 Subject: [PATCH] create invite contributors page --- app/globals.css | 7 + app/lish/[did]/[publication]/PubNotFound.tsx | 13 ++ .../PublicationContributors.tsx | 4 +- .../[publication]/invite-contributor/page.tsx | 172 ++++++++++++++++++ app/lish/[did]/[publication]/page.tsx | 13 +- components/Buttons.tsx | 18 +- components/PageLayouts/ModalLayout.tsx | 9 + 7 files changed, 213 insertions(+), 23 deletions(-) create mode 100644 app/lish/[did]/[publication]/PubNotFound.tsx create mode 100644 app/lish/[did]/[publication]/invite-contributor/page.tsx create mode 100644 components/PageLayouts/ModalLayout.tsx diff --git a/app/globals.css b/app/globals.css index 03008310..e9ee4e6d 100644 --- a/app/globals.css +++ b/app/globals.css @@ -377,6 +377,13 @@ pre.shiki { @apply rounded-md; } +.page-container { + background: rgba(var(--bg-page), var(--bg-page-alpha)); + @apply border; + @apply border-bg-page; + @apply rounded-md; +} + .container { background: rgba(var(--bg-page), 0.75); @apply border; diff --git a/app/lish/[did]/[publication]/PubNotFound.tsx b/app/lish/[did]/[publication]/PubNotFound.tsx new file mode 100644 index 00000000..73bddce3 --- /dev/null +++ b/app/lish/[did]/[publication]/PubNotFound.tsx @@ -0,0 +1,13 @@ +import { NotFoundLayout } from "components/PageLayouts/NotFoundLayout"; + +export const PubNotFound = () => { + return ( + +

Sorry, we can't find this publication!

+

+ This may be a glitch on our end. If the issue persists please{" "} + send us a note. +

+ + ); +}; diff --git a/app/lish/[did]/[publication]/dashboard/publicationSettings/PublicationContributors.tsx b/app/lish/[did]/[publication]/dashboard/publicationSettings/PublicationContributors.tsx index 1b9d1bef..cd10a4f7 100644 --- a/app/lish/[did]/[publication]/dashboard/publicationSettings/PublicationContributors.tsx +++ b/app/lish/[did]/[publication]/dashboard/publicationSettings/PublicationContributors.tsx @@ -40,7 +40,7 @@ export const PubContributorManager = (props: { const PubContributorsEmpty = () => { return (
- +
Contributors can make drafts and publish in this publication!{" "}
@@ -135,7 +135,7 @@ const PubContributorOptions = () => { ); }; -const PubContibutorEmptyIllo = () => { +export const PubContributorEmptyIllo = () => { return ( ; +}) { + let identity = await getIdentityData(); + let params = await props.params; + let did = decodeURIComponent(params.did); + if (!did) return ; + let uri; + let publication_name = decodeURIComponent(params.publication); + if (/^(?!\.$|\.\.S)[A-Za-z0-9._:~-]{1,512}$/.test(publication_name)) { + uri = AtUri.make( + did, + "pub.leaflet.publication", + publication_name, + ).toString(); + } + let [{ data: publication }] = await Promise.all([ + supabaseServerClient + .from("publications") + .select( + `*, + publication_subscriptions(*), + documents_in_publications(documents( + *, + comments_on_documents(count), + document_mentions_in_bsky(count) + )) + `, + ) + .eq("identity_did", did) + .or(`name.eq."${publication_name}", uri.eq."${uri}"`) + .single(), + ]); + + let pubRecord = publication?.record as PubLeafletPublication.Record; + let showPageBackground = pubRecord?.theme?.showPageBackground; + let pubUrl = getPublicationURL(publication!); + let invited = false; + + if (!publication) return ; + + return ( + + +
+
+ {!identity || !identity?.atp_did ? ( + + ) : invited ? ( + + ) : ( + + )} +
+
+ + + ); +} + +const InvitedContent = (props: { + pubRecord: PubLeafletPublication.Record; + uri: string; + pubUrl: string; +}) => { + return ( + <> +

Become a Contributor!

+ +
+ You've been invited to write for
+ {props.pubRecord.name}!{" "} +
+ Accept Invite + + ); +}; + +const NotInvitedContent = (props: { + pubRecord: PubLeafletPublication.Record; + uri: string; + pubUrl: string; +}) => { + return ( + <> +

You haven't been invited to contribute yet...

+ + +
+ If you are expecting an invite, please check that the owner of this + publication added you to the invited contributors list. +
+ + ); +}; + +const LoggedOutContent = (props: { + pubRecord: PubLeafletPublication.Record; + uri: string; + pubUrl: string; +}) => { + return ( + <> +

Log in to Contribute

+ +
+ Log in with an AT Proto handle to contribute this publication +
+ + + ); +}; + +const PubLink = (props: { + pubRecord: PubLeafletPublication.Record; + uri: string; + pubUrl: string; +}) => { + return ( + + +

{props.pubRecord.name}

+
{props.pubRecord.description}
+ + ); +}; diff --git a/app/lish/[did]/[publication]/page.tsx b/app/lish/[did]/[publication]/page.tsx index aa1ac273..59b52ee3 100644 --- a/app/lish/[did]/[publication]/page.tsx +++ b/app/lish/[did]/[publication]/page.tsx @@ -16,6 +16,7 @@ import { QuoteTiny } from "components/Icons/QuoteTiny"; import { CommentTiny } from "components/Icons/CommentTiny"; import { LocalizedDate } from "./LocalizedDate"; import { PublicationHomeLayout } from "./PublicationHomeLayout"; +import { PubNotFound } from "./PubNotFound"; export default async function Publication(props: { params: Promise<{ publication: string; did: string }>; @@ -195,15 +196,3 @@ export default async function Publication(props: { return 
{JSON.stringify(e, undefined, 2)}
; } } - -const PubNotFound = () => { - return ( - -

Sorry, we can't find this publication!

-

- This may be a glitch on our end. If the issue persists please{" "} - send us a note. -

- - ); -}; diff --git a/components/Buttons.tsx b/components/Buttons.tsx index 9dc29742..55bafb83 100644 --- a/components/Buttons.tsx +++ b/components/Buttons.tsx @@ -35,10 +35,10 @@ export const ButtonPrimary = forwardRef< m-0 h-max ${fullWidth ? "w-full" : fullWidthOnMobile ? "w-full sm:w-max" : "w-max"} ${compact ? "py-0 px-1" : "px-2 py-0.5 "} - bg-accent-1 outline-transparent border border-accent-1 + bg-accent-1 border border-accent-1 rounded-md text-base font-bold text-accent-2 flex gap-2 items-center justify-center shrink-0 - transparent-outline focus:outline-accent-1 hover:outline-accent-1 outline-offset-1 + transparent-outline focus:outline-accent-1! hover:outline-accent-1! outline-offset-1 disabled:bg-border-light disabled:border-border-light disabled:text-border disabled:hover:text-border ${className} `} @@ -73,13 +73,13 @@ export const ButtonSecondary = forwardRef< className={`m-0 h-max ${fullWidth ? "w-full" : fullWidthOnMobile ? "w-full sm:w-max" : "w-max"} ${props.compact ? "py-0 px-1" : "px-2 py-0.5 "} - bg-bg-page outline-transparent - rounded-md text-base font-bold text-accent-contrast - flex gap-2 items-center justify-center shrink-0 - transparent-outline focus:outline-accent-contrast hover:outline-accent-contrast outline-offset-1 - border border-accent-contrast - disabled:bg-border-light disabled:text-border disabled:hover:text-border - ${props.className} + bg-bg-page + rounded-md text-base font-bold text-accent-contrast + flex gap-2 items-center justify-center shrink-0 + transparent-outline focus:outline-accent-contrast! hover:outline-accent-contrast! outline-offset-1 + border border-accent-contrast + disabled:bg-border-light disabled:text-border disabled:hover:text-border + ${props.className} `} > {props.children} diff --git a/components/PageLayouts/ModalLayout.tsx b/components/PageLayouts/ModalLayout.tsx new file mode 100644 index 00000000..aba5d6cb --- /dev/null +++ b/components/PageLayouts/ModalLayout.tsx @@ -0,0 +1,9 @@ +export const ModalLayout = (props: { children: React.ReactNode }) => { + return ( +
+
+ {props.children} +
+
+ ); +}; -- 2.51.2