leaflet.pub
a tool for shared writing and social publishing
add a looseleaf button to the homepage
cozylittle.house
+49
-24
+3
-4
app/[leaflet_id]/actions/PublishButton.tsx
+3
-4
app/[leaflet_id]/actions/PublishButton.tsx
···
200
200
<div className="text-secondary font-bold">
201
201
Publish as LooseLeaf
202
202
</div>
203
-
<div className="text-tertiary text-sm">
204
-
Publish this as a one off doc <br />
205
-
to AT Proto
203
+
<div className="text-tertiary text-sm font-normal">
204
+
Publish this as a one off doc to AT Proto
206
205
</div>
207
206
</div>
208
207
</div>
···
212
211
<div className="text-secondary font-bold">
213
212
Start a Publication!
214
213
</div>
215
-
<div className="text-tertiary text-sm">
214
+
<div className="text-tertiary text-sm font-normal">
216
215
Publish your writing to a blog or newsletter on AT Proto
217
216
</div>
218
217
</div>
+34
-15
components/ActionBar/Publications.tsx
+34
-15
components/ActionBar/Publications.tsx
···
15
15
import { ButtonSecondary } from "components/Buttons";
16
16
import { useIsMobile } from "src/hooks/isMobile";
17
17
import { useState } from "react";
18
+
import { LooseLeafSmall } from "components/Icons/ArchiveSmall";
19
+
import { navPages } from "./Navigation";
18
20
19
21
export const PublicationButtons = (props: {
22
+
currentPage: navPages;
20
23
currentPubUri: string | undefined;
21
24
}) => {
22
25
let { identity } = useIdentityData();
26
+
let looseleaves = ["placeholder"];
23
27
24
28
// don't show pub list button if not logged in or no pub list
25
29
// we show a "start a pub" banner instead
26
30
if (!identity || !identity.atp_did || identity.publications.length === 0)
27
31
return <PubListEmpty />;
32
+
28
33
return (
29
34
<div className="pubListWrapper w-full flex flex-col gap-1 sm:bg-transparent sm:border-0">
35
+
{looseleaves.length > 0 && (
36
+
<>
37
+
<SpeedyLink
38
+
href={`/lish/looseleaf`}
39
+
className="flex gap-2 items-start text-secondary font-bold hover:no-underline! hover:text-accent-contrast w-full"
40
+
>
41
+
{/*TODO How should i get if this is the current page or not?
42
+
theres not "pub" to check the uri for. Do i need to add it as an option to NavPages? thats kinda annoying*/}
43
+
<ActionButton
44
+
label="Looseleaves"
45
+
icon={<LooseLeafSmall />}
46
+
nav
47
+
className={
48
+
props.currentPage === "looseleaf"
49
+
? "bg-bg-page! border-border!"
50
+
: ""
51
+
}
52
+
/>
53
+
</SpeedyLink>
54
+
<hr className="border-border-light border-dashed mx-1" />
55
+
</>
56
+
)}
57
+
30
58
{identity.publications?.map((d) => {
31
59
return (
32
60
<PublicationOption
33
61
{...d}
34
62
key={d.uri}
35
63
record={d.record}
36
-
asActionButton
37
64
current={d.uri === props.currentPubUri}
38
65
/>
39
66
);
···
52
79
uri: string;
53
80
name: string;
54
81
record: Json;
55
-
asActionButton?: boolean;
56
82
current?: boolean;
57
83
}) => {
58
84
let record = props.record as PubLeafletPublication.Record | null;
···
63
89
href={`${getBasePublicationURL(props)}/dashboard`}
64
90
className="flex gap-2 items-start text-secondary font-bold hover:no-underline! hover:text-accent-contrast w-full"
65
91
>
66
-
{props.asActionButton ? (
67
-
<ActionButton
68
-
label={record.name}
69
-
icon={<PubIcon record={record} uri={props.uri} />}
70
-
nav
71
-
className={props.current ? "bg-bg-page! border-border!" : ""}
72
-
/>
73
-
) : (
74
-
<>
75
-
<PubIcon record={record} uri={props.uri} />
76
-
<div className="truncate">{record.name}</div>
77
-
</>
78
-
)}
92
+
<ActionButton
93
+
label={record.name}
94
+
icon={<PubIcon record={record} uri={props.uri} />}
95
+
nav
96
+
className={props.current ? "bg-bg-page! border-border!" : ""}
97
+
/>
79
98
</SpeedyLink>
80
99
);
81
100
};