skycel
2269ecdb62
- Enhance ProjectController show() with prev/next navigation data - Create useFetchProject composable with ProjectNavigation type - Implement [slug].vue with full project details: - Hero image, title with featured badge, formatted date - Description, external links (site/GitHub) - Skills grid with level progression (before → after) - Prev/next navigation with project titles - 404 state with spider narrator - Add dynamic SEO meta tags with og:image from project - Responsive design: stacked mobile, grid desktop Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
34 lines
771 B
TypeScript
34 lines
771 B
TypeScript
import type { Project } from '~/types/project'
|
|
|
|
export interface ProjectNavigation {
|
|
prev: { slug: string; title: string } | null
|
|
next: { slug: string; title: string } | null
|
|
}
|
|
|
|
interface ProjectResponse {
|
|
data: Project
|
|
meta: { lang: string }
|
|
navigation: ProjectNavigation
|
|
}
|
|
|
|
interface ProjectError {
|
|
error: {
|
|
code: string
|
|
message: string
|
|
}
|
|
}
|
|
|
|
export function useFetchProject(slug: string | Ref<string>) {
|
|
const config = useRuntimeConfig()
|
|
const { locale } = useI18n()
|
|
const slugValue = toValue(slug)
|
|
|
|
return useFetch<ProjectResponse, ProjectError>(`/projects/${slugValue}`, {
|
|
baseURL: config.public.apiUrl as string,
|
|
headers: {
|
|
'X-API-Key': config.public.apiKey as string,
|
|
'Accept-Language': locale.value,
|
|
},
|
|
})
|
|
}
|