2d96476 · urbit.org · git.iko.soy

git.iko.soy/urbit.org

docs: add weight pagination

commit2d9647643a7f6770a24519b2b2826870b397f7b1 authorMatilde Park <matilde@tlon.io> dateThu 22 Jul 2021, 16:41 (5 years ago) parentb78834e

3 files changed+86−7

compare with master

unifiedsplit

components/Pagination.js+23 content/docs/development/environment.md+6−4 pages/docs/[[...slug]].js+57−3

components/Pagination.jsnew file+23

@@ -0,0 +1,23 @@

1+import Link from "next/link";

2+import { formatDate } from "../lib/lib";

4+export default function Pagination(props) {

5+ return (

6+ <Link

7+ href={`/${props.section}/${props.post.slug}`}

8+ key={`post-${props.post.slug}`}

9+ >

10+ <div className="bg-wall cursor-pointer font-semibold p-2 px-4 rounded-xl">

11+ <p className="text-black">

12+ {props.previous ? "<- " : ""}

13+ {props.post.title}

14+ {props.next ? " ->" : ""}

15+ </p>

16+ </div>

17+ </Link>

18+ );

19+}

20+

21+Pagination.defaultProps = {

22+ className: "",

23+};

content/docs/development/environment.md+6−4

@@ -1,14 +1,14 @@

11+++

22title = "Environment Setup"

33description = "How to set up an environment for Urbit development."

4−weight = 10

4+weight = 11

55template = "doc.html"

66+++

88This guide covers best practices for preparing your environment to develop

99within the Urbit ecosystem.

1010

11−## Creating a development ship

11+## Creating a development ship

1212

1313To do work with Hoon, we recommended using a "fake" ship -- one that's not

1414connected to the network.

@@ -24,8 +24,7 @@ with any valid Urbit ship-name.

2424```

2525

2626This should take a couple of minutes, during which you should see a block of boot

27−messages, starting with the Urbit version number.

28−

27+messages, starting with the Urbit version number.

2928

3029## Hoon support in text editors

3130

@@ -33,17 +32,20 @@ A variety of plugins have been built to provide support for the Hoon language in

3332different text editors:

3433

3534#### Atom

35+

3636Atom is free and open-source and runs on all major operating systems. It is

3737available [here](https://atom.io/). A package for Hoon support is maintained by

3838Tlon and may be obtained using the package manager within the editor by

3939searching for `Hoon`.

4040

4141#### Sublime Text

42+

4243Sublime Text is closed-source, but may be downloaded for free and there is no

4344enforced time limit for evaluation. It runs on all major operating systems. It

4445is available [here](https://www.sublimetext.com/).

4546

4647#### Visual Studio Code

48+

4749Visual Studio Code is free and open-source and runs on all major operating

4850systems. It is available [here](https://code.visualstudio.com/). Hoon support

4951may be acquired in the Extensions menu within the editor by searching for

pages/docs/[[...slug]].js+57−3

@@ -4,7 +4,13 @@ import { useRouter } from "next/router";

44import { useState } from "react";

55import classnames from "classnames";

66import { join } from "path";

7−import { getDocs, formatDate, buildPageTree, getPage } from "../../lib/lib";

7+import {

8+ getPreviousPost,

9+ getNextPost,

10+ buildPageTree,

11+ getPage,

12+} from "../../lib/lib";

13+import Pagination from "../../components/Pagination";

814import Markdown from "../../components/Markdown";

915import ContentArea from "../../components/ContentArea";

1016import Sidebar from "../../components/Sidebar";

@@ -95,7 +101,15 @@ const pageTree = (thisLink, tree, level = 0) => {

95101 );

96102};

97103

98−export default function DocsLayout({ posts, data, params, search, markdown }) {

104+export default function DocsLayout({

105+ posts,

106+ data,

107+ params,

108+ search,

109+ markdown,

110+ previousPost,

111+ nextPost,

112+}) {

99113 const router = useRouter();

100114 const isSelected = "/docs".includes(router.asPath);

101115 const selectedClasses = classnames({

@@ -133,6 +147,30 @@ export default function DocsLayout({ posts, data, params, search, markdown }) {

133147 dangerouslySetInnerHTML={{ __html: decode(markdown) }}

134148 ></article>

135149 </div>

150+ <div className="flex justify-between mt-16">

151+ {previousPost === null ? (

152+ <div className={""} />

153+ ) : (

154+ <Pagination

155+ previous

156+ title="Previous Post"

157+ post={previousPost}

158+ className=""

159+ section={join("docs", params.slug?.slice(0, -1).join("/"))}

160+ />

161+ )}

162+ {nextPost === null ? (

163+ <div className={""} />

164+ ) : (

165+ <Pagination

166+ next

167+ title="Next Post"

168+ post={nextPost}

169+ className=""

170+ section={join("docs", params.slug?.slice(0, -1).join("/"))}

171+ />

172+ )}

173+ </div>

136174 </ContentArea>

137175 </div>

138176 </>

@@ -146,9 +184,25 @@ export async function getStaticProps({ params }) {

146184 join(process.cwd(), "content/docs", params.slug?.join("/") || "/")

147185 );

148186

187+ const previousPost =

188+ getPreviousPost(

189+ params.slug?.slice(-1).join("") || "docs",

190+ ["title", "slug", "weight"],

191+ join("docs", params.slug?.slice(0, -1).join("/") || "/"),

192+ "weight"

193+ ) || null;

194+

195+ const nextPost =

196+ getNextPost(

197+ params.slug?.slice(-1).join("") || "docs",

198+ ["title", "slug", "weight"],

199+ join("docs", params.slug?.slice(0, -1).join("/") || "/"),

200+ "weight"

201+ ) || null;

202+

149203 const markdown = await Markdown({ post: { content: content } });

150204

151− return { props: { posts, data, markdown, params } };

205+ return { props: { posts, data, markdown, previousPost, nextPost, params } };

152206}

153207