on master help sign in
pages/id: show all known groups, applications on id pages
28a0011Matilde Park
content/application/_index.mdnew file+3
@@ -0,0 +1,3 @@
1++++
2+title = "Application Directory"
3++++
pages/id/[id].js+49−4
@@ -1,11 +1,9 @@
1import Head from "next/head";
1import Head from "next/head";
2import Link from "next/link";
2import Link from "next/link";
3−import { getPage } from "../../lib/lib";
3+import { getPage, getAllPosts } from "../../lib/lib";
4import { join } from "path";
4import { join } from "path";
5−import Meta from "../../components/Meta";
6import Container from "../../components/Container";
5import Container from "../../components/Container";
7import SingleColumn from "../../components/SingleColumn";
6import SingleColumn from "../../components/SingleColumn";
8−import ErrorPage from "../404";
9import Section from "../../components/Section";
7import Section from "../../components/Section";
10import ob from "urbit-ob";
8import ob from "urbit-ob";
11import Markdown from "../../components/Markdown";
9import Markdown from "../../components/Markdown";
@@ -17,7 +15,7 @@ import MetadataLink from "../../components/gateway/MetadataLink";
17import Description from "../../components/gateway/Description";
15import Description from "../../components/gateway/Description";
18import axios from "axios";
16import axios from "axios";
19
17
20−const IdPage = ({ data, markdown, network, params }) => {
18+const IdPage = ({ data, markdown, applications, groups, network, params }) => {
21 const { id } = params;
19 const { id } = params;
22 if (!ob.isValidPatp(id) || id.length > 14) {
20 if (!ob.isValidPatp(id) || id.length > 14) {
23 return <Gateway404 type="ID" />;
21 return <Gateway404 type="ID" />;
@@ -97,6 +95,18 @@ const IdPage = ({ data, markdown, network, params }) => {
97 />
95 />
98 )}
96 )}
99 </div>
97 </div>
98+ <Creations
99+ title="Applications"
100+ id={id}
101+ parentSlug="application"
102+ data={applications}
103+ />
104+ <Creations
105+ title="Hosted Groups"
106+ id={id}
107+ parentSlug="group"
108+ data={groups}
109+ />
100 <Description
110 <Description
101 description={data.description}
111 description={data.description}
102 fallback="An Urbit ID."
112 fallback="An Urbit ID."
@@ -157,6 +167,33 @@ const IdPage = ({ data, markdown, network, params }) => {
157 );
167 );
158};
168};
159
169
170+const Creations = ({ id, title, data, parentSlug }) => {
171+ return (
172+ data?.length > 0 && (
173+ <div className="flex flex-col space-y-2">
174+ <p className="text-wall-400 font-semibold">{title}</p>
175+ <div className="flex flex-wrap space-x-4">
176+ {data.map((each) => (
177+ <Link href={`/${parentSlug}/${id}/${each.slug}`}>
178+ <div className="cursor-pointer flex flex-col items-center space-y-1">
179+ <img
180+ className="overflow-hidden rounded-xl"
181+ style={{ width: 100, height: 100 }}
182+ src={
183+ each?.image ||
184+ "https://media.urbit.org/logo/urbit-logo-card.png"
185+ }
186+ />
187+ <a className="text-green-400 font-semibold">{each.title}</a>
188+ </div>
189+ </Link>
190+ ))}
191+ </div>
192+ </div>
193+ )
194+ );
195+};
196+
160function deSig(string) {
197function deSig(string) {
161 return string.startsWith("~") ? string.substring(1) : string;
198 return string.startsWith("~") ? string.substring(1) : string;
162}
199}
@@ -171,6 +208,12 @@ export const getServerSideProps = async ({ params, res }) => {
171 join(process.cwd(), "content/id/", params.id.slice(1))
208 join(process.cwd(), "content/id/", params.id.slice(1))
172 ) || { data: {}, content: "" };
209 ) || { data: {}, content: "" };
173
210
211+ const applications = getAllPosts(
212+ ["title", "slug", "image"],
213+ `application/${params.id}`
214+ );
215+ const groups = getAllPosts(["title", "slug", "image"], `group/${params.id}`);
216+
174 if (!data.ship && ob.isValidPatp(params.id)) {
217 if (!data.ship && ob.isValidPatp(params.id)) {
175 data = { ship: params.id, description: "An Urbit ID." };
218 data = { ship: params.id, description: "An Urbit ID." };
176 }
219 }
@@ -188,6 +231,8 @@ export const getServerSideProps = async ({ params, res }) => {
188 return {
231 return {
189 props: {
232 props: {
190 data,
233 data,
234+ applications,
235+ groups,
191 markdown,
236 markdown,
192 network,
237 network,
193 params,
238 params,