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

git.iko.soy/urbit.org

on master help sign in

docs: add weight pagination

2d96476Matilde Park5 years ago

components/Pagination.jsnew file+23

compare with master

unifiedsplit

@@ -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 @@

1+++

2title = "Environment Setup"

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

4−weight = 10

4+weight = 11

5template = "doc.html"

6+++

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

9within the Urbit ecosystem.

11−## Creating a development ship

11+## Creating a development ship

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

14connected to the network.

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

24```

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

27−messages, starting with the Urbit version number.

27+messages, starting with the Urbit version number.

28−

30## Hoon support in text editors

29## Hoon support in text editors

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

33different text editors:

32different text editors:

35#### Atom

34#### Atom

35+

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

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

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

39searching for `Hoon`.

41#### Sublime Text

42+

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

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

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

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

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

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

46#### Visual Studio Code

47#### Visual Studio Code

48+

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

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

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

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

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

51may 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";

4import { useState } from "react";

5import classnames from "classnames";

6import { 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";

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

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

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

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

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

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

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

95 );

101 );

96};

102};

103

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+}) {

99 const router = useRouter();

113 const router = useRouter();

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

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

101 const selectedClasses = classnames({

115 const selectedClasses = classnames({

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

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

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

134 ></article>

148 ></article>

135 </div>

149 </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>

136 </ContentArea>

174 </ContentArea>

137 </div>

175 </div>

138 </>

176 </>

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

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

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

147 );

185 );

148

186

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+

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

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

150

204

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

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

152}

206}

153

207