update website with new remix typings

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

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,
},
}
}),

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>

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",

6
pnpm-lock.yaml generated
View File

@@ -105,6 +105,7 @@ importers:
typedoc: ^0.23.8
typescript: ^4.7.4
wait-on: ^6.0.1
zod: ^3.17.10
dependencies:
'@headlessui/react': 1.6.6_biqbaboplfbrettd7655fr4n2y
'@heroicons/react': 1.0.6_react@18.2.0
@@ -122,6 +123,7 @@ importers:
react-focus-on: 3.6.0_3hx2ussxxho4jajbwrd6gq34qe
react-router: 6.3.0_react@18.2.0
react-router-dom: 6.3.0_biqbaboplfbrettd7655fr4n2y
zod: 3.17.10
devDependencies:
'@remix-run/dev': 1.6.5_xontd7q62j6h4ge55exoz26nhu
'@testing-library/cypress': 8.0.3_cypress@10.3.1
@@ -11238,6 +11240,10 @@ packages:
engines: {node: '>=10'}
dev: true
/zod/3.17.10:
resolution: {integrity: sha512-IHXnQYQuOOOL/XgHhgl8YjNxBHi3xX0mVcHmqsvJgcxKkEczPshoWdxqyFwsARpf41E0v9U95WUROqsHHxt0UQ==}
dev: false
/zwitch/2.0.2:
resolution: {integrity: sha512-JZxotl7SxAJH0j7dN4pxsTV6ZLXoLdGME+PsjkL/DaBrVryK9kTGq06GfKrwcSOqypP+fdXGoCHE36b99fWVoA==}
dev: true