diff --git a/app/about/page.tsx b/app/about/page.tsx deleted file mode 100644 index 42d35f9c..00000000 --- a/app/about/page.tsx +++ /dev/null @@ -1,30 +0,0 @@ -import { LegalContent } from "app/legal/content"; -import Link from "next/link"; - -export default function AboutPage() { - return ( -
-
-

- Leaflet.pub is a web app for instantly creating and collaborating on - documents.{" "} - - Click here - {" "} - to create one and get started! -

- -

- Leaflet is made by Learning Futures Inc. Previously we built{" "} - hyperlink.academy -

-

- You can find us on{" "} - Bluesky or email as - at contact@leaflet.pub -

-
- -
- ); -} diff --git a/app/lish/[did]/[publication]/dashboard/Actions.tsx b/app/lish/[did]/[publication]/dashboard/Actions.tsx index 96e4452c..6c6d42d5 100644 --- a/app/lish/[did]/[publication]/dashboard/Actions.tsx +++ b/app/lish/[did]/[publication]/dashboard/Actions.tsx @@ -18,13 +18,19 @@ import { PaintSmall } from "components/Icons/PaintSmall"; import { PubThemeSetter } from "components/ThemeManager/PubThemeSetter"; import { useIsMobile } from "src/hooks/isMobile"; import { SpeedyLink } from "components/SpeedyLink"; +import { FormEvent, useState } from "react"; +import { GoBackSmall } from "components/Icons/GoBackSmall"; +import { theme } from "tailwind.config"; +import { ButtonPrimary } from "components/Buttons"; +import { DotLoader } from "components/utils/DotLoader"; +import { GoToArrow } from "components/Icons/GoToArrow"; +import { ArrowRightTiny } from "components/Icons/ArrowRightTiny"; export const Actions = (props: { publication: string }) => { return ( <> - ); @@ -88,12 +94,16 @@ function PublicationShareButton() { function PublicationSettingsButton(props: { publication: string }) { let isMobile = useIsMobile(); + let [state, setState] = useState<"menu" | "general" | "theme">("menu"); + let [loading, setLoading] = useState(false); + return ( } > - + {state === "general" ? ( + setState("menu")} + loading={loading} + setLoading={setLoading} + /> + ) : state === "theme" ? ( + setState("menu")} + loading={loading} + setLoading={setLoading} + /> + ) : ( + + )} ); } -function PublicationThemeButton() { - let isMobile = useIsMobile(); +const SettingsMenu = (props: { + state: "menu" | "general" | "theme"; + setState: (s: typeof props.state) => void; + loading: boolean; + setLoading: (l: boolean) => void; +}) => { + let menuItemClassName = + "hover:bg-[var(--accent-light)] text-secondary hover:no-underline! rounded-md px-2 py-0.5 -mx-[8px] font-bold text-left flex items-center justify-between"; return ( - label="Theme" /> - } - > - - +
+ + + + + About Leaflet + + +
); -} +}; + +export const PubSettingsHeader = (props: { + state: "menu" | "general" | "theme"; + goBackAction?: () => void; + loading: boolean; + setLoadingAction: (l: boolean) => void; +}) => { + return ( +
+ {props.state === "menu" + ? "Settings" + : props.state === "general" + ? "General" + : props.state === "theme" + ? "Publication Theme" + : ""} + {props.state !== "menu" && ( +
+ + + + {props.loading ? : "Update"} + +
+ )} +
+ ); +}; diff --git a/app/lish/createPub/UpdatePubForm.tsx b/app/lish/createPub/UpdatePubForm.tsx index f2b06888..67df5b45 100644 --- a/app/lish/createPub/UpdatePubForm.tsx +++ b/app/lish/createPub/UpdatePubForm.tsx @@ -20,8 +20,13 @@ import { Verification } from "@vercel/sdk/esm/models/getprojectdomainop"; import Link from "next/link"; import { Checkbox } from "components/Checkbox"; import type { GetDomainConfigResponseBody } from "@vercel/sdk/esm/models/getdomainconfigop"; +import { PubSettingsHeader } from "../[did]/[publication]/dashboard/Actions"; -export const EditPubForm = () => { +export const EditPubForm = (props: { + goBack: () => void; + loading: boolean; + setLoading: (l: boolean) => void; +}) => { let { data } = usePublicationData(); let { publication: pubData } = data || {}; let record = pubData?.record as PubLeafletPublication.Record; @@ -57,11 +62,11 @@ export const EditPubForm = () => { return (
{ if (!pubData) return; e.preventDefault(); - setFormState("loading"); + props.setLoading(true); + console.log("step 1:update"); let data = await updatePublication({ uri: pubData.uri, name: nameValue, @@ -73,110 +78,113 @@ export const EditPubForm = () => { }, }); toast({ type: "success", content: "Updated!" }); - setFormState("normal"); + props.setLoading(false); mutate("publication-data"); }} > -
-

- Logo (optional) -

-
fileInputRef.current?.click()} - > - {iconPreview ? ( - Logo preview - ) : ( - - )} + +
+
+

+ Logo (optional) +

+
fileInputRef.current?.click()} + > + {iconPreview ? ( + Logo preview + ) : ( + + )} +
+ { + const file = e.target.files?.[0]; + if (file) { + setIconFile(file); + const reader = new FileReader(); + reader.onload = (e) => { + setIconPreview(e.target?.result as string); + }; + reader.readAsDataURL(file); + } + }} + />
- { - const file = e.target.files?.[0]; - if (file) { - setIconFile(file); - const reader = new FileReader(); - reader.onload = (e) => { - setIconPreview(e.target?.result as string); - }; - reader.readAsDataURL(file); - } - }} - /> -
- - - - -
- - setShowInDiscover(e.target.checked)} - > -
-

- Show In{" "} - - Discover - +

+ Publication Name

-

- This publication will appear on our public Discover page + { + setNameValue(e.currentTarget.value); + }} + /> + +

+ Description (optional)

-
- + { + setDescriptionValue(e.currentTarget.value); + }} + /> + - setShowComments(e.target.checked)} - > -
-

Show comments on posts

-
- -
+ +
+ + setShowInDiscover(e.target.checked)} + > +
+

+ Show In{" "} + + Discover + +

+

+ This publication will appear on our public Discover page +

+
+ - - {formState === "loading" ? : "Update!"} - + setShowComments(e.target.checked)} + > +
+

Show comments on posts

+
+ +
); }; diff --git a/components/ActionBar/Navigation.tsx b/components/ActionBar/Navigation.tsx index c0af668e..63323ad6 100644 --- a/components/ActionBar/Navigation.tsx +++ b/components/ActionBar/Navigation.tsx @@ -19,6 +19,7 @@ import { redirect } from "next/navigation"; import { hydrateNotifications } from "src/notifications"; import { supabaseServerClient } from "supabase/serverClient"; import { CommentNotification } from "app/(home-pages)/notifications/CommentNotication"; +import { Separator } from "components/Layout"; export type navPages = "home" | "reader" | "pub" | "discover" | "notifications"; @@ -51,8 +52,6 @@ export const MobileNavigation = (props: { ); return (
- - e.preventDefault()} asChild @@ -82,6 +81,7 @@ export const MobileNavigation = (props: { isMobile /> +
); }; diff --git a/components/Icons/GoBackSmall.tsx b/components/Icons/GoBackSmall.tsx index 5d0cb916..3c3c36b1 100644 --- a/components/Icons/GoBackSmall.tsx +++ b/components/Icons/GoBackSmall.tsx @@ -8,6 +8,7 @@ export const GoBackSmall = (props: Props) => { viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" + {...props} > { - let [loading, setLoading] = useState(false); +export const PubThemeSetter = (props: { + goBack: () => void; + loading: boolean; + setLoading: (l: boolean) => void; +}) => { let [sample, setSample] = useState<"pub" | "post">("pub"); let [openPicker, setOpenPicker] = useState("null"); let { data, mutate } = usePublicationData(); @@ -58,11 +62,10 @@ export const PubThemeSetter = () => { return (
{ e.preventDefault(); if (!pub) return; - setLoading(true); + props.setLoading(true); let result = await updatePublicationTheme({ uri: pub.uri, theme: { @@ -86,118 +89,118 @@ export const PubThemeSetter = () => { }; return pub; }, false); - setLoading(false); + props.setLoading(false); }} > -

Publication Theme

- - {loading ? : "Update"} - + -
-
-
-
-
- { - setTheme((t) => ({ ...t, bgPage: color })); - }} - setBackgroundColor={(color) => { - setTheme((t) => ({ ...t, bgLeaflet: color })); - }} - openPicker={openPicker} - setOpenPicker={setOpenPicker} - hasPageBackground={!!showPageBackground} - setHasPageBackground={setShowPageBackground} - /> -
- - -
-
- +
+
-
- + { setTheme((t) => ({ ...t, bgPage: color })); }} - setPrimary={(color) => { - setTheme((t) => ({ ...t, primary: color })); + setBackgroundColor={(color) => { + setTheme((t) => ({ ...t, bgLeaflet: color })); }} openPicker={openPicker} - setOpenPicker={(pickers) => setOpenPicker(pickers)} - hasPageBackground={showPageBackground} - /> - { - setTheme((t) => ({ ...t, accent1: color })); - }} - accent2={localPubTheme.accent2} - setAccent2={(color) => { - setTheme((t) => ({ ...t, accent2: color })); - }} - openPicker={openPicker} - setOpenPicker={(pickers) => setOpenPicker(pickers)} + setOpenPicker={setOpenPicker} + hasPageBackground={!!showPageBackground} + setHasPageBackground={setShowPageBackground} />
+ +
-
-
-
Preview
- {" "} - - -
- {sample === "pub" ? ( - - ) : ( - - )} +
+ +
+
+ { + setTheme((t) => ({ ...t, bgPage: color })); + }} + setPrimary={(color) => { + setTheme((t) => ({ ...t, primary: color })); + }} + openPicker={openPicker} + setOpenPicker={(pickers) => setOpenPicker(pickers)} + hasPageBackground={showPageBackground} + /> + { + setTheme((t) => ({ ...t, accent1: color })); + }} + accent2={localPubTheme.accent2} + setAccent2={(color) => { + setTheme((t) => ({ ...t, accent2: color })); + }} + openPicker={openPicker} + setOpenPicker={(pickers) => setOpenPicker(pickers)} + /> +
+
+
+
+
Preview
+ {" "} + +
+ {sample === "pub" ? ( + + ) : ( + + )}
diff --git a/components/Toast.tsx b/components/Toast.tsx index 5435781c..d7fd453c 100644 --- a/components/Toast.tsx +++ b/components/Toast.tsx @@ -95,18 +95,14 @@ const Toast = (props: { from: { top: -40 }, enter: { top: 8 }, leave: { top: -40 }, - config: { - mass: 8, - friction: 150, - tension: 2000, - }, + config: {}, }); return transitions((style, item) => { return item ? (