a tool for shared writing and social publishing
added some styling to published list
+51
-31
+4
-4
app/lish/[handle]/[publication]/PublicationDashboard.tsx
+4
-4
app/lish/[handle]/[publication]/PublicationDashboard.tsx
···
10
10
let [tab, setTab] = useState(props.defaultTab);
11
11
let content = props.tabs[tab];
12
12
return (
13
-
<div className="w-full flex flex-col items-stretch">
14
-
<div className="flex flex-row w-full justify-between border-b border-border text-secondary items-center">
13
+
<div className="pubDashWrapper w-full flex flex-col items-stretch px-3">
14
+
<div className="pubDashTabWrapper flex flex-row w-full justify-between border-b border-border text-secondary items-center">
15
15
<div className="font-bold text-tertiary">{props.name}</div>
16
-
<div className="flex flex-row gap-2">
16
+
<div className="pubDashTabs flex flex-row gap-2">
17
17
{Object.keys(props.tabs).map((t) => (
18
18
<Tab
19
19
key={t}
···
24
24
))}
25
25
</div>
26
26
</div>
27
-
<div className="pt-4">{content}</div>
27
+
<div className="pubDashContent pt-4">{content}</div>
28
28
</div>
29
29
);
30
30
}
+47
-27
app/lish/[handle]/[publication]/page.tsx
+47
-27
app/lish/[handle]/[publication]/page.tsx
···
15
15
import Link from "next/link";
16
16
import { AtUri } from "@atproto/syntax";
17
17
import { PubLeafletDocument } from "lexicons/api";
18
+
import React from "react";
19
+
import { MoreOptionsVerticalTiny } from "components/Icons/MoreOptionsVerticalTiny";
20
+
import { Menu, MenuItem } from "components/Layout";
18
21
19
22
const idResolver = new IdResolver();
20
23
···
73
76
</Sidebar>
74
77
</div>
75
78
<div
76
-
className={`h-full overflow-y-scroll pt-4 px-3 sm:pl-8 sm:pr-1 sm:pt-9 w-full`}
79
+
className={`h-full overflow-y-scroll pt-4 px-3 sm:pl-5 sm:pt-9 w-full`}
77
80
>
78
81
<PublicationDashboard
79
82
name={publication.name}
···
86
89
)}
87
90
/>
88
91
),
89
-
Published: (
90
-
<div className="w-full container text-center place-items-center flex flex-col gap-3 p-3">
91
-
{publication.documents_in_publications.length === 0 ? (
92
-
<div className="italic text-tertiary">
93
-
Nothing's been published yet...
94
-
</div>
95
-
) : (
96
-
publication.documents_in_publications.map((doc) => {
92
+
Published:
93
+
publication.documents_in_publications.length === 0 ? (
94
+
<div className="italic text-tertiary w-full container text-center place-items-center flex flex-col gap-3 p-3">
95
+
Nothing's been published yet...
96
+
</div>
97
+
) : (
98
+
<div className="publishedList w-full flex flex-col gap-4 pb-6">
99
+
{publication.documents_in_publications.map((doc) => {
97
100
if (!doc.documents) return null;
98
101
let leaflet = publication.leaflets_in_publications.find(
99
102
(l) => doc.documents && l.doc === doc.documents.uri,
···
101
104
let uri = new AtUri(doc.documents.uri);
102
105
let record = doc.documents
103
106
.data as PubLeafletDocument.Record;
107
+
108
+
console.log(record);
109
+
104
110
return (
105
-
<div
106
-
className="w-full flex flex-row justify-between"
107
-
key={doc.documents?.uri}
108
-
>
109
-
<Link
110
-
href={`/lish/${params.handle}/${params.publication}/${uri.rkey}`}
111
-
>
112
-
{record.title}
113
-
</Link>
114
-
{leaflet && (
115
-
<Link href={`/${leaflet.leaflet}`}>edit</Link>
116
-
)}
117
-
</div>
111
+
<React.Fragment key={doc.documents?.uri}>
112
+
<div className="flex w-full ">
113
+
<Link
114
+
href={`/lish/${params.handle}/${params.publication}/${uri.rkey}`}
115
+
className="publishedPost grow flex flex-col gap-0 hover:!no-underline"
116
+
>
117
+
<h3 className="text-primary">{record.title}</h3>
118
+
<p className="italic text-secondary">
119
+
This is a placeholder for description
120
+
</p>
121
+
<p className="text-sm text-tertiary pt-2">
122
+
{record.publishedAt} PlaceholderDate
123
+
</p>
124
+
</Link>
125
+
{leaflet && (
126
+
<Link href={`/${leaflet.leaflet}`}>edit</Link>
127
+
)}
128
+
<MoreOptionsVerticalTiny />
129
+
{/* <Menu trigger={<MoreOptionsVerticalTiny />}>
130
+
<MenuItem onSelect={() => {}}>
131
+
Edit Post
132
+
</MenuItem>
133
+
<MenuItem onSelect={() => {}}>
134
+
Delete Post
135
+
</MenuItem>
136
+
</Menu> */}
137
+
</div>
138
+
<hr className="last:hidden border-border-light" />
139
+
</React.Fragment>
118
140
);
119
-
})
120
-
)}
121
-
<NewDraftSecondaryButton publication={publication.uri} />
122
-
</div>
123
-
),
141
+
})}
142
+
</div>
143
+
),
124
144
}}
125
145
defaultTab={"Drafts"}
126
146
/>