portfolio/src/pages/[slug].tsx

62 lines
1.5 KiB
TypeScript

import { GetStaticPaths, GetStaticProps } from 'next/types'
import resume from '../../_content/resume.json'
import Project from '../components/Project'
import ProjectNav from '../components/ProjectNav'
import type ProjectType from '../interfaces/project'
import Page from '../layouts/Page'
import {
getAllProjects,
getProjectBySlug,
getProjectSlugs
} from '../lib/content'
type Props = {
project: ProjectType
projects: { slug: string }[]
}
export default function ProjectPage({ project, projects }: Props) {
const pageMeta = {
title: `${
project.title
} // ${resume.basics.name.toLowerCase()} { ${resume.basics.label.toLowerCase()} }`,
description: project.description,
image: project.images[0].src,
slug: project.slug
}
return (
<Page {...pageMeta}>
<Project project={project} />
<ProjectNav projects={projects} currentSlug={project.slug} />
</Page>
)
}
type Params = {
params: {
slug: string
}
}
export const getStaticProps: GetStaticProps = async ({ params }: Params) => {
const project = await getProjectBySlug(params.slug, [
'title',
'description',
'slug',
'images',
'techstack',
'links'
])
const projects = await getAllProjects(['slug', 'title', 'images'])
return { props: { project, projects } }
}
export const getStaticPaths: GetStaticPaths = () => {
const slugs = getProjectSlugs()
return {
paths: slugs.map((slug) => ({ params: { slug } })),
fallback: false
}
}