4d7198a · urbit.org · git.iko.soy

git.iko.soy/urbit.org

adding articles ecosystem section and new tlon public group

commit4d7198a3a310d15208ae2e0c0a4961c28564f302 authorGordon <gordon@hey.com> dateMon 3 Oct 2022, 12:27 (4 years ago) parent758146b

7 files changed+183−4

compare with master

unifiedsplit

components/ecosystem/BasicPage.js+25−2 components/ecosystem/IndexCard.js+1 components/ecosystem/Post.js+8 content/articles/2022-09-29_the-dream-of-digital-homesteading.md+10 content/groups/~nibset-napwyn/tlon-public.md+12 pages/articles/[slug].js+84 pages/ecosystem/index.js+43−2

components/ecosystem/BasicPage.js+25−2

@@ -28,6 +28,7 @@ export default function BasicPage({

2828 metaPost.title = `${post.title} - ${section}`;

2929 metaPost.description =

3030 section === "Podcast" ? `${post.podcast} - ${post.date}` : post.description;

31+ section === "Article" ? `${post.publication} - ${post.date}` : post.description;

3132 return (

3233 <Container>

3334 <Head>

@@ -43,7 +44,7 @@ export default function BasicPage({

4344 <div className="flex items-center space-x-4">

4445 <img src={post.image} className="w-36" />

4546 <div className="flex flex-col pl-2">

46− <h1 className={classnames({ "text-3xl": section === "Podcast" })}>

47+ <h1 className={classnames({ "text-3xl": section === "Podcast" },{ "text-3xl": section === "Article" })}>

4748 {post.title}

4849 </h1>

4950 <p>{section}</p>

@@ -58,13 +59,26 @@ export default function BasicPage({

5859 <p>{post.podcast}</p>

5960 </div>

6061 )}

62+ {post?.publication && (

63+ <div className="flex flex-col">

64+ <p className="font-bold text-wall-400">Publication</p>

65+ <p>{post.publication}</p>

66+ </div>

67+ )}

68+ {post?.author && (

69+ <div className="flex flex-col">

70+ <p className="font-bold text-wall-400">Author</p>

71+ <p>{post.author}</p>

72+ </div>

73+ )}

6174 {post?.date && (

6275 <div className="flex flex-col">

6376 <p className="font-bold text-wall-400">Date</p>

6477 <p className="shrink-0">{post.date}</p>

6578 </div>

6679 )}

67− {post?.URL && section !== "Podcast" && (

80+

81+ {post?.URL && section !== "Podcast" && section !== "Article" && (

6882 <div className="flex flex-col">

6983 <p className="font-bold text-wall-400">Website</p>

7084 <a

@@ -75,6 +89,7 @@ export default function BasicPage({

7589 </a>

7690 </div>

7791 )}

92+

7893 {post?.URL && section === "Urbit Marketplace" && (

7994 <div className="flex flex-col">

8095 <p className="font-bold text-wall-400">Accepts</p>

@@ -93,6 +108,14 @@ export default function BasicPage({

93108  Listen

94109 </a>

95110 )}

111+ {post?.URL && section === "Article" && (

112+ <a

113+ href={post.URL}

114+ className="button-lg bg-green-400 text-white cursor-pointer flex space-x-2"

115+ >

116+ Read

117+ </a>

118+ )}

96119 </div>

97120 <div className="flex">

98121 <div className="markdown w-full">

components/ecosystem/IndexCard.js+1

@@ -43,6 +43,7 @@ const badge = (type) => {

4343 "bg-[#83b2d4]": type === "Application",

4444 "bg-wall-600": type === "Podcast",

4545 "bg-[#8dd5b1]": type === "Marketplace",

46+ "bg-[#000000]": type === "Article",

4647 }

4748 )}

4849 >

components/ecosystem/Post.js+8

@@ -49,6 +49,14 @@ export default function Post({ post }) {

4949 </Link>

5050 )}

5151

52+ {post[feat].type === "Article" && (

53+ <Link href={href || "#"} passHref>

54+ <a class="button-sm text-white flex-col bg-green-400 cursor-pointer pr-4 w-fit">

55+ Listen to {post[feat].type}

56+ </a>

57+ </Link>

58+ )}

59+

5260 {post[feat].type === "Application" && (

5361 <Link href={href || "#"} passHref>

5462 <a class="button-sm text-white flex-col bg-green-400 cursor-pointer pr-4 w-fit">

content/articles/2022-09-29_the-dream-of-digital-homesteading.mdnew file+10

@@ -0,0 +1,10 @@

1++++

2+title = "The Dream of Digital Homesteading"

3+publication = "Compact"

4+author = "Geoff Schullenberger"

5+date = "2022-09-29"

6+URL = "https://compactmag.com/article/the-dream-of-digital-homesteading"

7+image = "https://storage.googleapis.com/media.urbit.org/site/ecosystem/articles/compactmag.png"

8++++

10+Geoff Schullenberger attends Assembly 2022 and chronicles his impressions and thoughts.

content/groups/~nibset-napwyn/tlon-public.mdnew file+12

@@ -0,0 +1,12 @@

1++++

2+title = "Tlon Public"

3+shortcode = "~nibset-napwyn/tlon-public"

4+description = "Updates, announcements, and broadcasts from Tlon."

5+type = "Public"

6+tile = "https://storage.googleapis.com/media.urbit.org/site/ecosystem/organizations/tlon.png"

7+participant_range = "200+"

8++++

10+Download the latest alphas of Tlon products, check out Tlon's visual inspiration and design work, and chat with Tlon team about their software.

11+

12+![](https://storage.googleapis.com/media.urbit.org/site/ecosystem/groups/tlon-public.png)

pages/articles/[slug].jsnew file+84

@@ -0,0 +1,84 @@

1+import BasicPage from "../../components/ecosystem/BasicPage";

2+import {

3+ Markdown,

4+ getAllPosts,

5+ getPostBySlug,

6+ getPostSlugs,

7+} from "@urbit/foundation-design-system";

8+import Link from "next/link";

10+export default function Article({

11+ post,

12+ markdown,

13+ search,

14+ index,

15+ spotlights = [],

16+}) {

17+ return (

18+ <BasicPage

19+ section="Article"

20+ post={post}

21+ markdown={markdown}

22+ search={search}

23+ index={index}

24+ >

25+ {spotlights.length > 0 && (

26+ <p>

27+ Featured in{" "}

28+ {spotlights.map((e, i) => (

29+ <>

30+ {i ? ", " : ""}

31+ <Link href={`/ecosystem/spotlight/${e.slug}`}>{e.title}</Link>

32+ </>

33+ ))}

34+ </p>

35+ )}

36+ </BasicPage>

37+ );

38+}

39+

40+export async function getStaticProps({ params }) {

41+ const post = getPostBySlug(

42+ params.slug,

43+ ["title", "slug", "URL", "publication", "date", "image", "content"],

44+ "articles"

45+ );

46+

47+ const spotlights = getAllPosts(

48+ ["title", "slug", "featured-1", "featured-2", "featured-3"],

49+ "ecosystem/spotlight"

50+ ).filter(

51+ (e) =>

52+ e?.["featured-1"]?.title === post.title ||

53+ e?.["featured-2"]?.title === post.title ||

54+ e?.["featured-3"]?.title === post.title

55+ );

56+

57+ let { index } = post?.extra || { index: null };

58+

59+ if (index === undefined) {

60+ index = null;

61+ }

62+

63+ const markdown = JSON.stringify(Markdown.parse({ post }));

64+ return {

65+ props: { post, markdown, spotlights, index },

66+ };

67+}

68+

69+export async function getStaticPaths() {

70+ const posts = getPostSlugs("articles");

71+

72+ const slugs = posts.map((e) => e.slice(0, -3));

73+

74+ return {

75+ paths: slugs.map((post) => {

76+ return {

77+ params: {

78+ slug: post,

79+ },

80+ };

81+ }),

82+ fallback: false,

83+ };

84+}

pages/ecosystem/index.js+43−2

@@ -30,6 +30,7 @@ export default function Ecosystem({

3030 marketplaces,

3131 organizations,

3232 podcasts,

33+ articles

3334}) {

3435 const router = useRouter();

3536

@@ -54,6 +55,9 @@ export default function Ecosystem({

5455 case "organizations":

5556 title = "Organizations • Ecosystem";

5657 break;

58+ case "articles":

59+ title = "Articles • Ecosystem";

60+ break;

5761 default:

5862 title = "Ecosystem Spotlight";

5963 }

@@ -112,8 +116,8 @@ export default function Ecosystem({

112116

113117 <div

114118 className={classnames("grid gap-12 w-full", {

115− "grid-cols-2 md:grid-cols-3": type !== "podcasts",

116− "grid-cols-1": type === "podcasts",

119+ "grid-cols-2 md:grid-cols-3": type == "organizations" || type == "marketplaces",

120+ "grid-cols-1": type === "podcasts" || type === "articles",

117121 "grid-cols-1 md:grid-cols-1 lg:grid-cols-1 xl:grid-cols-2":

118122 type === "applications" || type === "groups",

119123 hidden: type === undefined,

@@ -209,6 +213,26 @@ export default function Ecosystem({

209213 </div>

210214 </Link>

211215 ))}

216+

217+ {type === "articles" &&

218+ articles.map((article) => (

219+ <Link href={`/articles/${article.slug}`}>

220+ <div className="flex cursor-pointer space-x-4 items-center hover:opacity-90">

221+ <img className="w-28" src={article.image} />

222+ <div className="flex flex-col space-y-2 min-w-0">

223+ <p className="font-bold">{article.publication}</p>

224+ <p className="min-w-0 min-h-0 leading-5 ">

225+ {article.title}

226+ </p>

227+ <p className="text-wall-400">

228+ {formatDate(generateDisplayDate(article.date))}

229+ </p>

230+ </div>

231+ </div>

232+ </Link>

233+ ))}

234+

235+

212236 </div>

213237 </div>

214238 </div>

@@ -283,6 +307,16 @@ function EcosystemSidebar() {

283307 >

284308 Podcasts

285309 </ActiveLink>

310+

311+ <ActiveLink

312+ currentPath={currentPath}

313+ className="mr-5 type-ui"

314+ href="/ecosystem?type=articles"

315+ >

316+ Articles

317+ </ActiveLink>

318+

319+

286320 </div>

287321 );

288322}

@@ -362,6 +396,11 @@ export async function getStaticProps({}) {

362396 "podcasts",

363397 "date"

364398 );

399+ const articles = getAllPosts(

400+ ["title", "image", "date", "publication", "author", "slug"],

401+ "articles",

402+ "date"

403+ );

365404 const organizations = getAllPosts(

366405 ["title", "image", "slug"],

367406 "organizations"

@@ -411,6 +450,7 @@ export async function getStaticProps({}) {

411450 ...applications.map((e) => ({ ...e, type: "Application" })),

412451 ...organizations.map((e) => ({ ...e, type: "Organization" })),

413452 ...podcasts.map((e) => ({ ...e, type: "Podcast" })),

453+ ...articles.map((e) => ({ ...e, type: "Article" })),

414454 ...marketplaces.map((e) => ({ ...e, type: "Marketplace" })),

415455 ].filter((e) => e.title === post[feat].title)?.[0];

416456 post[feat].image = post[feat]?.image || matchedPost?.image || null;

@@ -433,6 +473,7 @@ export async function getStaticProps({}) {

433473 marketplaces,

434474 podcasts,

435475 organizations,

476+ articles

436477 },

437478 };

438479}