kris/reacord
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update website with new remix typings

Browse Source
This commit is contained in:
itsMapleLeaf
2022-07-23 14:15:16 -05:00
committed by Darius
parent e486da0881
commit eed5715f1f
4 changed files with 30 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
packages/website/app/modules/navigation/load-guide-links.server.ts
View File

@@ -2,35 +2,34 @@ import glob from "fast-glob"
import grayMatter from "gray-matter"
import { readFile } from "node:fs/promises"
import { join, parse } from "node:path"
import type { AppLinkProps } from "~/modules/navigation/app-link"
import { z } from "zod"
const guidesFolder = "app/routes/guides"
export type GuideLink = {
title: string
order: number
link: AppLinkProps
}
const frontmatterSchema = z.object({
meta: z.object({
title: z.string(),
description: z.string(),
}),
order: z.number().optional(),
})
export async function loadGuideLinks(): Promise<GuideLink[]> {
export type GuideLink = Awaited<ReturnType<typeof loadGuideLinks>>[0]
export async function loadGuideLinks() {
const guideFiles = await glob(`**/*.md`, { cwd: guidesFolder })
const links: GuideLink[] = await Promise.all(
const links = await Promise.all(
guideFiles.map(async (file) => {
const { data } = grayMatter(await readFile(join(guidesFolder, file)))
let order = data.order
if (!Number.isFinite(order)) {
order = Number.POSITIVE_INFINITY
}
const result = grayMatter(await readFile(join(guidesFolder, file)))
const data = frontmatterSchema.parse(result.data)
return {
title: data.meta?.title,
order,
title: data.meta.title,
order: data.order ?? Number.POSITIVE_INFINITY,
link: {
type: "router",
type: "router" as const,
to: `/guides/${parse(file).name}`,
children: data.meta?.title,
children: data.meta.title,
},
}
}),

18
packages/website/app/root.tsx
View File

@@ -1,8 +1,4 @@
import type {
LinksFunction,
LoaderFunction,
MetaFunction,
} from "@remix-run/node"
import type { LinksFunction, MetaFunction } from "@remix-run/node"
import {
Links,
LiveReload,
@@ -16,7 +12,6 @@ import packageJson from "reacord/package.json"
import bannerUrl from "~/assets/banner.png"
import faviconUrl from "~/assets/favicon.png"
import { GuideLinksProvider } from "~/modules/navigation/guide-links-context"
import type { GuideLink } from "~/modules/navigation/load-guide-links.server"
import { loadGuideLinks } from "~/modules/navigation/load-guide-links.server"
import prismThemeCss from "~/modules/ui/prism-theme.css"
import tailwindCss from "~/modules/ui/tailwind.out.css"
@@ -61,19 +56,14 @@ export const links: LinksFunction = () => [
},
]
type LoaderData = {
guideLinks: GuideLink[]
}
export const loader: LoaderFunction = async () => {
const data: LoaderData = {
export async function loader() {
return {
guideLinks: await loadGuideLinks(),
}
return data
}
export default function App() {
const data: LoaderData = useLoaderData()
const data = useLoaderData<typeof loader>()
return (
<html lang="en" className="bg-slate-900 text-slate-100">
<head>

3
packages/website/package.json
View File

@@ -27,7 +27,8 @@
"react-dom": "^18.2.0",
"react-focus-on": "^3.6.0",
"react-router": "^6.3.0",
"react-router-dom": "^6.3.0"
"react-router-dom": "^6.3.0",
"zod": "^3.17.10"
},
"devDependencies": {
"@remix-run/dev": "^1.6.5",