{props.bskyPostText}
diff --git a/app/(home-pages)/notifications/Notification.tsx b/app/(home-pages)/notifications/Notification.tsx
index 205d15a8..62fbc905 100644
--- a/app/(home-pages)/notifications/Notification.tsx
+++ b/app/(home-pages)/notifications/Notification.tsx
@@ -23,14 +23,9 @@ export const Notification = (props: {
+
);
return (
-
-
+
+
+ Notifications
+
{notifications.map((n) => {
if (n.type === "comment") {
if (n.parentData) return ;
diff --git a/app/(home-pages)/notifications/QuoteNotification.tsx b/app/(home-pages)/notifications/QuoteNotification.tsx
index 6c7b3f16..27335ad7 100644
--- a/app/(home-pages)/notifications/QuoteNotification.tsx
+++ b/app/(home-pages)/notifications/QuoteNotification.tsx
@@ -27,12 +27,9 @@ export const QuoteNotification = (props: HydratedQuoteNotification) => {
content={
-
+
{postText}
diff --git a/app/(home-pages)/p/[didOrHandle]/PostsContent.tsx b/app/(home-pages)/p/[didOrHandle]/PostsContent.tsx
index 7bd67c3c..b5022e1c 100644
--- a/app/(home-pages)/p/[didOrHandle]/PostsContent.tsx
+++ b/app/(home-pages)/p/[didOrHandle]/PostsContent.tsx
@@ -1,5 +1,6 @@
"use client";
+import { EmptyState } from "components/EmptyState";
import { PostListing } from "components/PostListing";
import type { Post } from "app/(home-pages)/reader/getReaderFeed";
import type { Cursor } from "./getProfilePosts";
@@ -64,7 +65,7 @@ export const ProfilePostsContent = (props: {
const allPosts = data ? data.flatMap((page) => page.posts) : [];
if (allPosts.length === 0 && !isValidating) {
- return No posts yet;
+ return ;
}
return (
diff --git a/app/(home-pages)/p/[didOrHandle]/ProfileHeader.tsx b/app/(home-pages)/p/[didOrHandle]/ProfileHeader.tsx
index 3589e780..56627e9d 100644
--- a/app/(home-pages)/p/[didOrHandle]/ProfileHeader.tsx
+++ b/app/(home-pages)/p/[didOrHandle]/ProfileHeader.tsx
@@ -45,7 +45,7 @@ export const ProfileHeader = (props: {
return (
{!props.popover && }
diff --git a/app/(home-pages)/p/[didOrHandle]/ProfileLayout.tsx b/app/(home-pages)/p/[didOrHandle]/ProfileLayout.tsx
index 15e598d0..df27af0e 100644
--- a/app/(home-pages)/p/[didOrHandle]/ProfileLayout.tsx
+++ b/app/(home-pages)/p/[didOrHandle]/ProfileLayout.tsx
@@ -10,10 +10,10 @@ export function ProfileLayout(props: { children: React.ReactNode }) {
className={`
${
cardBorderHidden
- ? ""
- : "overflow-y-scroll h-full border border-border-light rounded-lg bg-bg-page px-3 sm:px-4"
+ ? "bg-transparent"
+ : "overflow-y-scroll h-full border border-border-light rounded-lg! container px-3 sm:px-4 sm:-mt-2"
}
- max-w-prose mx-auto w-full
+ max-w-prose w-full
flex flex-col pb-3
text-center
`}
diff --git a/app/(home-pages)/p/[didOrHandle]/ProfileTabs.tsx b/app/(home-pages)/p/[didOrHandle]/ProfileTabs.tsx
index bb058749..5155bde4 100644
--- a/app/(home-pages)/p/[didOrHandle]/ProfileTabs.tsx
+++ b/app/(home-pages)/p/[didOrHandle]/ProfileTabs.tsx
@@ -41,7 +41,9 @@ export const ProfileTabs = (props: { didOrHandle: string }) => {
const bgColor = cardBorderHidden ? "var(--bg-leaflet)" : "var(--bg-page)";
return (
-
+
{
scrollPosWithinTabContent < 20
? {
backgroundColor: !cardBorderHidden
- ? `rgba(${bgColor}, ${scrollPosWithinTabContent / 60 + 0.75})`
+ ? `rgba(${bgColor}, ${scrollPosWithinTabContent / 60})`
: `rgba(${bgColor}, ${scrollPosWithinTabContent / 20})`,
paddingLeft: !cardBorderHidden
? "4px"
diff --git a/app/(home-pages)/p/[didOrHandle]/comments/CommentsContent.tsx b/app/(home-pages)/p/[didOrHandle]/comments/CommentsContent.tsx
index a2a3f474..39b183ac 100644
--- a/app/(home-pages)/p/[didOrHandle]/comments/CommentsContent.tsx
+++ b/app/(home-pages)/p/[didOrHandle]/comments/CommentsContent.tsx
@@ -1,5 +1,6 @@
"use client";
+import { EmptyState } from "components/EmptyState";
import { useEffect, useRef, useMemo } from "react";
import useSWRInfinite from "swr/infinite";
import { AppBskyActorProfile, AtUri } from "@atproto/api";
@@ -79,9 +80,7 @@ export const ProfileCommentsContent = (props: {
const allComments = data ? data.flatMap((page) => page.comments) : [];
if (allComments.length === 0 && !isValidating) {
- return (
- No comments yet
- );
+ return ;
}
return (
@@ -206,7 +205,7 @@ const CommentItem = ({ comment }: { comment: ProfileComment }) => {
)}
No subscriptions yet
- );
+ return ;
}
return (
diff --git a/app/(home-pages)/reader/GlobalContent.tsx b/app/(home-pages)/reader/GlobalContent.tsx
index 94134cfe..31ae8004 100644
--- a/app/(home-pages)/reader/GlobalContent.tsx
+++ b/app/(home-pages)/reader/GlobalContent.tsx
@@ -2,6 +2,7 @@
import { use } from "react";
import useSWR from "swr";
import { callRPC } from "app/api/rpc/client";
+import { EmptyState } from "components/EmptyState";
import { PostListing } from "components/PostListing";
import type { Post } from "./getReaderFeed";
import {
@@ -33,11 +34,7 @@ export const GlobalContent = (props: {
let selectedPost = useSelectedPostListing((s) => s.selectedPostListing);
if (posts.length === 0) {
- return (
-
- Nothing trending right now. Check back soon!
-
- );
+ return ;
}
return (
diff --git a/app/(home-pages)/reader/NewContent.tsx b/app/(home-pages)/reader/NewContent.tsx
index 9a0e7296..0c8d477b 100644
--- a/app/(home-pages)/reader/NewContent.tsx
+++ b/app/(home-pages)/reader/NewContent.tsx
@@ -1,6 +1,7 @@
"use client";
import { use } from "react";
+import { EmptyState } from "components/EmptyState";
import type { Cursor, Post } from "./getReaderFeed";
import useSWRInfinite from "swr/infinite";
import { getNewFeed } from "./getNewFeed";
@@ -65,11 +66,7 @@ export const NewContent = (props: {
const allPosts = data ? data.flatMap((page) => page.posts) : [];
if (allPosts.length === 0) {
- return (
-
- No posts yet. Check back soon!
-
- );
+ return ;
}
return (
diff --git a/app/(home-pages)/reader/ReaderMentionsContent.tsx b/app/(home-pages)/reader/ReaderMentionsContent.tsx
index 517e6be0..b379075a 100644
--- a/app/(home-pages)/reader/ReaderMentionsContent.tsx
+++ b/app/(home-pages)/reader/ReaderMentionsContent.tsx
@@ -2,6 +2,7 @@
import useSWR from "swr";
import { PostView } from "@atproto/api/dist/client/types/app/bsky/feed/defs";
import { BskyPostContent } from "app/lish/[did]/[publication]/[rkey]/BskyPostContent";
+import { EmptyState } from "components/EmptyState";
import { DotLoader } from "components/utils/DotLoader";
async function fetchBskyPosts(uris: string[]): Promise {
@@ -17,9 +18,10 @@ export function ReaderMentionsContent(props: {
quotesAndMentions: { uri: string; link?: string }[];
}) {
const uris = props.quotesAndMentions.map((q) => q.uri);
- const key = uris.length > 0
- ? `/api/bsky/hydrate?${new URLSearchParams({ uris: JSON.stringify(uris) }).toString()}`
- : null;
+ const key =
+ uris.length > 0
+ ? `/api/bsky/hydrate?${new URLSearchParams({ uris: JSON.stringify(uris) }).toString()}`
+ : null;
const { data: bskyPosts, isLoading } = useSWR(key, () =>
fetchBskyPosts(uris),
@@ -27,9 +29,11 @@ export function ReaderMentionsContent(props: {
if (props.quotesAndMentions.length === 0) {
return (
-
- no mentions yet!
-
+
);
}
diff --git a/app/(home-pages)/tag/[tag]/page.tsx b/app/(home-pages)/tag/[tag]/page.tsx
index 2121ab72..29edf137 100644
--- a/app/(home-pages)/tag/[tag]/page.tsx
+++ b/app/(home-pages)/tag/[tag]/page.tsx
@@ -41,37 +41,27 @@ const TagContent = (props: {
posts: Awaited>["posts"];
}) => {
return (
-
-
-
-
-
+
+ Tag: {props.tag}
+
+
{props.posts.length === 0 ? (
) : (
- props.posts.map((post) => (
-
- ))
+ <>
+
+ {props.posts.length} {props.posts.length === 1 ? "post" : "posts"}
+
+ {props.posts.map((post) => (
+
+ ))}
+ >
)}
);
};
-const TagHeader = (props: { tag: string; postCount: number }) => {
- return (
-
-
-
- {props.tag}
-
-
- {props.postCount} {props.postCount === 1 ? "post" : "posts"}
-
-
- );
-};
-
const EmptyState = (props: { tag: string }) => {
return (
diff --git a/app/lish/[did]/[publication]/dashboard/PublishedPostsLists.tsx b/app/lish/[did]/[publication]/dashboard/PublishedPostsLists.tsx
index 83a12aea..47b18411 100644
--- a/app/lish/[did]/[publication]/dashboard/PublishedPostsLists.tsx
+++ b/app/lish/[did]/[publication]/dashboard/PublishedPostsLists.tsx
@@ -1,6 +1,7 @@
"use client";
import { AtUri } from "@atproto/syntax";
import { EditTiny } from "components/Icons/EditTiny";
+import { EmptyState } from "components/EmptyState";
import {
usePublicationData,
@@ -29,11 +30,7 @@ export function PublishedPostsList(props: {
if (!publication) return null;
if (!documents || documents.length === 0)
- return (
-
- Nothing's been published yet...
-
- );
+ return ;
// Sort by publishedAt (most recent first)
const sortedDocuments = [...documents].sort((a, b) => {
diff --git a/app/lish/[did]/[publication]/dashboard/settings/GeneralSettings.tsx b/app/lish/[did]/[publication]/dashboard/settings/GeneralSettings.tsx
index 6c2f8f18..8f1c9721 100644
--- a/app/lish/[did]/[publication]/dashboard/settings/GeneralSettings.tsx
+++ b/app/lish/[did]/[publication]/dashboard/settings/GeneralSettings.tsx
@@ -1,6 +1,7 @@
import { useRef } from "react";
import { Input } from "components/Input";
import { AddTiny } from "components/Icons/AddTiny";
+import { DashboardContainer } from "./SettingsContent";
export function GeneralSettings(props: {
nameValue: string;
@@ -14,7 +15,7 @@ export function GeneralSettings(props: {
let fileInputRef = useRef(null);
return (
-
+
General Settings
@@ -80,6 +81,6 @@ export function GeneralSettings(props: {
onChange={(e) => props.setDescriptionValue(e.currentTarget.value)}
/>
-
+
);
}
diff --git a/app/lish/[did]/[publication]/dashboard/settings/PostSettings.tsx b/app/lish/[did]/[publication]/dashboard/settings/PostSettings.tsx
index b1c68a5b..f1f314bd 100644
--- a/app/lish/[did]/[publication]/dashboard/settings/PostSettings.tsx
+++ b/app/lish/[did]/[publication]/dashboard/settings/PostSettings.tsx
@@ -1,4 +1,6 @@
import { Toggle } from "components/Toggle";
+import { DashboardContainer } from "./SettingsContent";
+import { useCardBorderHidden } from "components/Pages/useCardBorderHidden";
export function PostSettings(props: {
showComments: boolean;
@@ -12,10 +14,11 @@ export function PostSettings(props: {
showInDiscover: boolean;
setShowInDiscover: (v: boolean) => void;
}) {
+ let cardBorderHidden = useCardBorderHidden();
return (
<>
-
- Discovery
+
+ Discovery
props.setShowInDiscover(!props.showInDiscover)}
@@ -31,52 +34,54 @@ export function PostSettings(props: {
-
-
+
+ {cardBorderHidden &&
}
- Post Layout
- props.setShowPrevNext(!props.showPrevNext)}
- >
- Show Prev/Next Buttons on Post
-
-
-
-
- Post Interactions
-
+
+ Post Layout
props.setShowComments(!props.showComments)}
+ toggle={props.showPrevNext}
+ onToggle={() => props.setShowPrevNext(!props.showPrevNext)}
>
- Show Comments
+ Show Prev/Next Buttons on Post
+
+ {cardBorderHidden &&
}
+
+ Post Interactions
+
+ props.setShowComments(!props.showComments)}
+ >
+ Show Comments
+
- props.setShowMentions(!props.showMentions)}
- >
-
- Show Mentions
-
- Display a list of Bluesky mentions about your post
+ props.setShowMentions(!props.showMentions)}
+ >
+
+ Show Mentions
+
+ Display a list of Bluesky mentions about your post
+
-
-
+
- props.setShowRecommends(!props.showRecommends)}
- >
-
- Show Recommends
-
- Allow readers to recommend/like your post
+ props.setShowRecommends(!props.showRecommends)}
+ >
+
+ Show Recommends
+
+ Allow readers to recommend/like your post
+
-
-
-
+
+
+
>
);
}
diff --git a/app/lish/[did]/[publication]/dashboard/settings/SettingsContent.tsx b/app/lish/[did]/[publication]/dashboard/settings/SettingsContent.tsx
index cfc0311e..00ba73d0 100644
--- a/app/lish/[did]/[publication]/dashboard/settings/SettingsContent.tsx
+++ b/app/lish/[did]/[publication]/dashboard/settings/SettingsContent.tsx
@@ -25,7 +25,7 @@ export function SettingsContent(props: { showPageBackground: boolean }) {
if (view === "theme") {
return (
-
+
setView("all")}
loading={themeLoading}
@@ -41,11 +41,11 @@ export function SettingsContent(props: { showPageBackground: boolean }) {
function SettingsForm(props: { onOpenTheme: () => void }) {
let { data } = usePublicationData();
let { publication: pubData } = data || {};
+ let cardBorderHidden = useCardBorderHidden();
let record = useNormalizedPublicationRecord();
let [loading, setLoading] = useState(false);
let toast = useToaster();
- // --- General Settings state ---
let [nameValue, setNameValue] = useState(record?.name || "");
let [descriptionValue, setDescriptionValue] = useState(
record?.description || "",
@@ -94,7 +94,7 @@ function SettingsForm(props: { onOpenTheme: () => void }) {
return (