frontpage/pages/index.tsx

48 lines
1.7 KiB
TypeScript
Raw Normal View History

2022-09-30 19:23:14 +02:00
import type { NextPage } from "next";
2021-12-17 18:55:00 +01:00
import Head from "next/head";
2022-09-30 19:23:14 +02:00
import useSWR from "swr";
2022-08-08 12:38:52 +02:00
import type { ContentList } from "../lib/content/types";
2022-09-30 19:23:14 +02:00
import Navigation from "../components/Blog/Navigation";
import ProjectCard from "../components/Blog/Card";
import Spinner from "../components/Spinner";
2022-10-01 14:04:21 +02:00
import styles from "../styles/Blog/Front.module.scss";
2021-11-30 23:48:54 +01:00
2022-10-03 01:20:17 +02:00
const Blog: NextPage<{ content: ContentList }> = ({content}) => {
//const { data: projectList, error } = useSWR("/content/list.json", (...args) => fetch(...args).then(res => res.json()));
2022-06-12 14:22:15 +02:00
2022-09-30 19:38:25 +02:00
const generateCards = (type: string) => {
2022-10-03 01:20:17 +02:00
//if (error) return <div>Error on fetching projects.</div>;
//if (!projectList) return <Spinner size={200} color={"#ff0000"} />;
/*else*/ return <div className={styles.contentList}>{content.filter(p => p.type === type).map(p => <ProjectCard key={p.name} title={p.title} description={p.desc.join(" ")} />)}</div>;
2022-09-30 19:38:25 +02:00
};
2022-09-30 19:23:14 +02:00
return <>
2022-01-14 14:27:19 +01:00
<Head>
<title>c0ntroller.de</title>
</Head>
2022-10-01 14:39:46 +02:00
<div className={styles.container}>
<header>
<Navigation />
</header>
<main>
<h1>Hello there!</h1>
<p>Miaumiau Lorem ipsum</p>
<h2>Projects</h2>
{ generateCards("project") }
<h2>Diaries</h2>
{ generateCards("diary") }
</main>
</div>
2022-09-30 19:23:14 +02:00
</>;
2022-06-14 19:07:21 +02:00
};
2022-10-03 01:20:17 +02:00
export async function getServerSideProps() {
const url = process.env.BASE_URL || "https://c0ntroller.de";
const res = await fetch(`${url}/content/list.json`);
const content = await res.json();
return { props: { content } };
}
2022-09-30 19:23:14 +02:00
export default Blog;