a tool for shared writing and social publishing
support logged out view for Reader with empty states
+38
-19
+8
-5
app/reader/ReaderContent.tsx
+8
-5
app/reader/ReaderContent.tsx
···
19
19
import { getReaderFeed } from "./getReaderFeed";
20
20
import { useEffect, useRef } from "react";
21
21
import { useRouter } from "next/navigation";
22
+
import Link from "next/link";
22
23
23
24
export const ReaderContent = (props: {
24
25
root_entity: string;
···
266
267
</div>
267
268
);
268
269
};
269
-
const ReaderEmpty = () => {
270
+
export const ReaderEmpty = () => {
270
271
return (
271
-
<div className="flex flex-col gap-2 container bg-[rgba(var(--bg-page),.7)] sm:p-4 p-3 justify-between text-center font-bold text-tertiary">
272
+
<div className="flex flex-col gap-2 container bg-[rgba(var(--bg-page),.7)] sm:p-4 p-3 justify-between text-center text-tertiary">
272
273
Nothing to read yet… <br />
273
274
Subscribe to publications and find their posts here!
274
-
<ButtonPrimary className="mx-auto place-self-center">
275
-
<DiscoverSmall /> Discover Publications
276
-
</ButtonPrimary>
275
+
<Link href={"/discover"}>
276
+
<ButtonPrimary className="mx-auto place-self-center">
277
+
<DiscoverSmall /> Discover Publications
278
+
</ButtonPrimary>
279
+
</Link>
277
280
</div>
278
281
);
279
282
};
+8
-5
app/reader/SubscriptionsContent.tsx
+8
-5
app/reader/SubscriptionsContent.tsx
···
7
7
import useSWRInfinite from "swr/infinite";
8
8
import { useEffect, useRef } from "react";
9
9
import { Cursor } from "./getReaderFeed";
10
+
import Link from "next/link";
10
11
11
12
export const SubscriptionsContent = (props: {
12
13
publications: PublicationSubscription[];
···
90
91
);
91
92
};
92
93
93
-
const SubscriptionsEmpty = () => {
94
+
export const SubscriptionsEmpty = () => {
94
95
return (
95
-
<div className="flex flex-col gap-2 container bg-[rgba(var(--bg-page),.7)] sm:p-4 p-3 justify-between text-center font-bold text-tertiary">
96
+
<div className="flex flex-col gap-2 container bg-[rgba(var(--bg-page),.7)] sm:p-4 p-3 justify-between text-center text-tertiary">
96
97
You haven't subscribed to any publications yet!
97
-
<ButtonPrimary className="mx-auto place-self-center">
98
-
<DiscoverSmall /> Discover Publications
99
-
</ButtonPrimary>
98
+
<Link href={"/discover"}>
99
+
<ButtonPrimary className="mx-auto place-self-center">
100
+
<DiscoverSmall /> Discover Publications
101
+
</ButtonPrimary>
102
+
</Link>
100
103
</div>
101
104
);
102
105
};
+22
-9
app/reader/page.tsx
+22
-9
app/reader/page.tsx
···
11
11
12
12
import { NotFoundLayout } from "components/PageLayouts/NotFoundLayout";
13
13
import { DashboardLayout } from "components/PageLayouts/DashboardLayout";
14
-
import { ReaderContent } from "./ReaderContent";
15
-
import { SubscriptionsContent } from "./SubscriptionsContent";
14
+
import { ReaderContent, ReaderEmpty } from "./ReaderContent";
15
+
import {
16
+
SubscriptionsContent,
17
+
SubscriptionsEmpty,
18
+
} from "./SubscriptionsContent";
16
19
import { getReaderFeed } from "./getReaderFeed";
17
20
import { getSubscriptions } from "./getSubscriptions";
18
21
···
23
26
let permission_token = auth_res?.home_leaflet;
24
27
if (!permission_token)
25
28
return (
26
-
<NotFoundLayout>
27
-
<p className="font-bold">Sorry, we can't find this page!</p>
28
-
<p>
29
-
This may be a glitch on our end. If the issue persists please{" "}
30
-
<a href="mailto:contact@leaflet.pub">send us a note</a>.
31
-
</p>
32
-
</NotFoundLayout>
29
+
<DashboardLayout
30
+
id="reader"
31
+
cardBorderHidden={false}
32
+
currentPage="reader"
33
+
defaultTab="Read"
34
+
actions={null}
35
+
tabs={{
36
+
Read: {
37
+
controls: null,
38
+
content: <ReaderEmpty />,
39
+
},
40
+
Subscriptions: {
41
+
controls: null,
42
+
content: <SubscriptionsEmpty />,
43
+
},
44
+
}}
45
+
/>
33
46
);
34
47
let [homeLeafletFacts] = await Promise.all([
35
48
supabaseServerClient.rpc("get_facts", {