diff --git a/packages/app/custom.d.ts b/packages/app/custom.d.ts index c5be172a..33e7bd38 100644 --- a/packages/app/custom.d.ts +++ b/packages/app/custom.d.ts @@ -66,6 +66,7 @@ declare const CONFIG: { hideFromNavbar: Array; // Limit deck to certain subscriber tier deckSubKind?: number; + showDeck?: boolean; // Create toast notifications when publishing notes noteCreatorToast?: boolean; eventLinkPrefix: NostrPrefix; diff --git a/packages/app/src/Element/Feed/DisplayAsSelector.tsx b/packages/app/src/Element/Feed/DisplayAsSelector.tsx index 51b261ef..c56bc66b 100644 --- a/packages/app/src/Element/Feed/DisplayAsSelector.tsx +++ b/packages/app/src/Element/Feed/DisplayAsSelector.tsx @@ -36,7 +36,7 @@ export const DisplayAsSelector = ({ activeSelection, onSelect, show }: DisplaySe
myOnSelect("list")}> - +
myOnSelect("grid")}> diff --git a/packages/app/src/Element/Feed/TimelineRenderer.tsx b/packages/app/src/Element/Feed/TimelineRenderer.tsx index 11cf6fba..5c99aab5 100644 --- a/packages/app/src/Element/Feed/TimelineRenderer.tsx +++ b/packages/app/src/Element/Feed/TimelineRenderer.tsx @@ -53,11 +53,15 @@ export function TimelineRenderer(props: TimelineRendererProps) { const isVideo = media[0].mimeType?.startsWith("video/"); const noteId = NostrLink.fromEvent(e).encode(CONFIG.eventLinkPrefix); + const onClick = (clickEvent: React.MouseEvent) => { + if (props.noteOnClick) { + props.noteOnClick(e); + clickEvent.preventDefault(); + } + }; + return ( - props.noteOnClick?.(e)}> + Note Media {isVideo && } diff --git a/packages/app/src/Element/SpotlightMedia.css b/packages/app/src/Element/Spotlight/SpotlightMedia.css similarity index 100% rename from packages/app/src/Element/SpotlightMedia.css rename to packages/app/src/Element/Spotlight/SpotlightMedia.css diff --git a/packages/app/src/Element/SpotlightMedia.tsx b/packages/app/src/Element/Spotlight/SpotlightMedia.tsx similarity index 100% rename from packages/app/src/Element/SpotlightMedia.tsx rename to packages/app/src/Element/Spotlight/SpotlightMedia.tsx diff --git a/packages/app/src/Element/Spotlight/SpotlightThreadModal.tsx b/packages/app/src/Element/Spotlight/SpotlightThreadModal.tsx new file mode 100644 index 00000000..705250d9 --- /dev/null +++ b/packages/app/src/Element/Spotlight/SpotlightThreadModal.tsx @@ -0,0 +1,32 @@ +import Modal from "@/Element/Modal"; +import { ThreadContext, ThreadContextWrapper } from "@/Hooks/useThreadContext"; +import { Thread } from "@/Element/Event/Thread"; +import { useContext } from "react"; +import { transformTextCached } from "@/Hooks/useTextTransformCache"; +import { SpotlightMedia } from "@/Element/Spotlight/SpotlightMedia"; +import { NostrLink } from "@snort/system"; + +export function SpotlightThreadModal(props: { thread: NostrLink; onClose?: () => void; onBack?: () => void }) { + const onClose = () => props.onClose?.(); + const onBack = () => props.onBack?.(); + + return ( + + + +
+ +
+
+
+ ); +} + +function SpotlightFromThread({ onClose }: { onClose: () => void }) { + const thread = useContext(ThreadContext); + + const parsed = thread.root ? transformTextCached(thread.root.id, thread.root.content, thread.root.tags) : []; + const images = parsed.filter(a => a.type === "media" && a.mimeType?.startsWith("image/")); + if (images.length === 0) return; + return a.content)} idx={0} onClose={onClose} />; +} diff --git a/packages/app/src/Element/Text.tsx b/packages/app/src/Element/Text.tsx index 00c13ff3..0bb8544b 100644 --- a/packages/app/src/Element/Text.tsx +++ b/packages/app/src/Element/Text.tsx @@ -9,7 +9,7 @@ import HyperText from "@/Element/Embed/HyperText"; import CashuNuts from "@/Element/Embed/CashuNuts"; import RevealMedia from "./Event/RevealMedia"; import { ProxyImg } from "./ProxyImg"; -import { SpotlightMediaModal } from "./SpotlightMedia"; +import { SpotlightMediaModal } from "./Spotlight/SpotlightMedia"; import HighlightedText from "./HighlightedText"; import { useTextTransformer } from "@/Hooks/useTextTransformCache"; diff --git a/packages/app/src/Pages/DeckLayout.tsx b/packages/app/src/Pages/DeckLayout.tsx index 233d29b2..e190f90c 100644 --- a/packages/app/src/Pages/DeckLayout.tsx +++ b/packages/app/src/Pages/DeckLayout.tsx @@ -1,5 +1,5 @@ import "./Deck.css"; -import { createContext, useContext, useEffect, useState } from "react"; +import { createContext, useEffect, useState } from "react"; import { Link, Outlet, useNavigate } from "react-router-dom"; import { FormattedMessage } from "react-intl"; import { NostrLink, TaggedNostrEvent } from "@snort/system"; @@ -13,10 +13,7 @@ import { transformTextCached } from "@/Hooks/useTextTransformCache"; import Icon from "@/Icons/Icon"; import NotificationsPage from "./Notifications/Notifications"; import Modal from "@/Element/Modal"; -import { Thread } from "@/Element/Event/Thread"; import { RootTabs } from "@/Element/Feed/RootTabs"; -import { SpotlightMedia } from "@/Element/SpotlightMedia"; -import { ThreadContext, ThreadContextWrapper } from "@/Hooks/useThreadContext"; import Toaster from "@/Toaster"; import useLogin from "@/Hooks/useLogin"; import { LongFormText } from "@/Element/Event/LongFormText"; @@ -24,6 +21,7 @@ import NavSidebar from "@/Pages/Layout/NavSidebar"; import ErrorBoundary from "@/Element/ErrorBoundary"; import { getCurrentSubscription } from "@/Subscription"; import { mapPlanName } from "./subscribe"; +import { SpotlightThreadModal } from "@/Element/Spotlight/SpotlightThreadModal"; type Cols = "notes" | "articles" | "media" | "streams" | "notifications"; @@ -60,7 +58,8 @@ export function SnortDeckLayout() { }, [login]); if (!login.publicKey) return null; - if (CONFIG.deckSubKind !== undefined && (sub?.type ?? -1) < CONFIG.deckSubKind) { + const showDeck = CONFIG.showDeck || !(CONFIG.deckSubKind !== undefined && (sub?.type ?? -1) < CONFIG.deckSubKind); + if (!showDeck) { return (
@@ -115,16 +114,11 @@ export function SnortDeckLayout() { })}
{deckState.thread && ( - <> - setDeckState({})} className="thread-overlay thread"> - - setDeckState({})} /> -
- setDeckState({})} disableSpotlight={true} /> -
-
-
- + setDeckState({})} + onBack={() => setDeckState({})} + /> )} {deckState.article && ( <> @@ -146,15 +140,6 @@ export function SnortDeckLayout() { ); } -function SpotlightFromThread({ onClose }: { onClose: () => void }) { - const thread = useContext(ThreadContext); - - const parsed = thread.root ? transformTextCached(thread.root.id, thread.root.content, thread.root.tags) : []; - const images = parsed.filter(a => a.type === "media" && a.mimeType?.startsWith("image/")); - if (images.length === 0) return; - return a.content)} idx={0} onClose={onClose} />; -} - function NotesCol() { return (
diff --git a/packages/app/src/Pages/Layout/NavSidebar.tsx b/packages/app/src/Pages/Layout/NavSidebar.tsx index 3029dfb4..feccf6f6 100644 --- a/packages/app/src/Pages/Layout/NavSidebar.tsx +++ b/packages/app/src/Pages/Layout/NavSidebar.tsx @@ -91,6 +91,8 @@ export default function NavSidebar({ narrow = false }) { ); + const showDeck = CONFIG.showDeck || !(CONFIG.deckSubKind !== undefined && (sub?.type ?? -1) < CONFIG.deckSubKind); + return (
@@ -104,7 +106,7 @@ export default function NavSidebar({ narrow = false }) { if ((CONFIG.hideFromNavbar ?? []).includes(a.link)) { return false; } - if (a.link == "/deck" && CONFIG.deckSubKind !== undefined && (sub?.type ?? -1) < CONFIG.deckSubKind) { + if (a.link == "/deck" && !showDeck) { return false; } return true; diff --git a/packages/app/src/Pages/Profile/ProfilePage.tsx b/packages/app/src/Pages/Profile/ProfilePage.tsx index fb66a274..a30ce729 100644 --- a/packages/app/src/Pages/Profile/ProfilePage.tsx +++ b/packages/app/src/Pages/Profile/ProfilePage.tsx @@ -45,7 +45,7 @@ import { EmailRegex } from "@/Const"; import useLogin from "@/Hooks/useLogin"; import { ZapTarget } from "@/Zapper"; import { useStatusFeed } from "@/Feed/StatusFeed"; -import { SpotlightMediaModal } from "@/Element/SpotlightMedia"; +import { SpotlightMediaModal } from "@/Element/Spotlight/SpotlightMedia"; import ProfileTab, { BookMarksTab, FollowersTab, diff --git a/packages/app/src/icons.svg b/packages/app/src/icons.svg index d3bd76e0..3cba64a7 100644 --- a/packages/app/src/icons.svg +++ b/packages/app/src/icons.svg @@ -413,10 +413,15 @@ - + + + + + +