diff --git a/components/Blog/ContentPage.tsx b/components/Blog/ContentPage.tsx new file mode 100644 index 0000000..97f6baa --- /dev/null +++ b/components/Blog/ContentPage.tsx @@ -0,0 +1,14 @@ +import type { NextPage } from "next"; +import type { ProjectRender, DiaryRender } from "../../lib/content/types"; +import DiaryPageSelector from "./DiaryPageSelector"; + +const ContentPage: NextPage<{ content: ProjectRender | DiaryRender }> = ({ content }) => { + return (<> + {content.type === "diary" ? : null} +
+
+ {content.type === "diary" ? : null} + ); +}; + +export default ContentPage; \ No newline at end of file diff --git a/components/Blog/DiaryPageSelector.tsx b/components/Blog/DiaryPageSelector.tsx index 0d1785f..1b4be56 100644 --- a/components/Blog/DiaryPageSelector.tsx +++ b/components/Blog/DiaryPageSelector.tsx @@ -3,11 +3,11 @@ import Link from "next/link"; import { useRouter } from "next/router"; import type { ChangeEvent, ChangeEventHandler } from "react"; import { useEffect } from "react"; +import type { DiaryEntry } from "../../lib/content/types"; import styles from "../../styles/Blog/DiaryPageSelector.module.scss"; interface IContent { - pages: string[]; name: string; title: string; pageSelected: number @@ -15,10 +15,12 @@ interface IContent { interface IContentNavBar extends IContent { mobile?: boolean; + pages: string[]; } interface IContentNav extends IContent { bottom?: boolean; + pages: DiaryEntry[]; } const PageSelectorBar: NextPage = ({ pages, name, title, pageSelected, mobile }) => { @@ -64,17 +66,18 @@ const PageSelectorBar: NextPage = ({ pages, name, title, pageSel }; const PageSelector: NextPage = (content) => { + const entries = content.pages.map(p => p.title); - if (content.bottom) return ; + if (content.bottom) return ; return (
- +

{content.title}

    - {content.pages.map((e, idx) =>
  • {e}
  • )} + {entries.map((e, idx) =>
  • {e}
  • )}
diff --git a/lib/content/types.ts b/lib/content/types.ts index 984a401..4e583c7 100644 --- a/lib/content/types.ts +++ b/lib/content/types.ts @@ -16,10 +16,21 @@ export interface Project extends Content { type: "project"; } +export interface DiaryEntry { + title: string; + filename: string; +} + export interface Diary extends Content { type: "diary"; - entries: { - title: string; - filename: string; - }[]; + entries: DiaryEntry[]; } + +export interface ProjectRender extends Project { + html: string; +} + +export interface DiaryRender extends Diary { + html: string; + pageSelected: number; +} \ No newline at end of file diff --git a/pages/blog/diary/[did].tsx b/pages/blog/diary/[did].tsx index e79a3e9..d4dd306 100644 --- a/pages/blog/diary/[did].tsx +++ b/pages/blog/diary/[did].tsx @@ -1,21 +1,14 @@ import type { GetServerSideProps, NextPage } from "next"; import Layout from "../../../components/Blog/Layout"; -import DiaryPageSelector from "../../../components/Blog/DiaryPageSelector"; +import ContentPage from "../../../components/Blog/ContentPage"; import { generateContent, getContentList } from "../../../lib/content/generateBackend"; -import type { ContentList, Diary } from "../../../lib/content/types"; +import type { ContentList, DiaryRender, Diary } from "../../../lib/content/types"; import styles from "../../../styles/Blog/Content.module.scss"; -interface IContentRender extends Diary { - html: string; -} - -const DiaryMain: NextPage<{ content: IContentRender }> = ({ content }) => { +const DiaryMain: NextPage<{ content: DiaryRender }> = ({ content }) => { return - e.title)} /> -
-
- e.title)} bottom /> +
; }; @@ -33,7 +26,8 @@ export const getServerSideProps: GetServerSideProps = async (context) => { props: { content: { ...contentEntry, - html: contentHtml + html: contentHtml, + pageSelected: 0 } } }; diff --git a/pages/blog/diary/[did]/[page].tsx b/pages/blog/diary/[did]/[page].tsx index f31728d..1cc74ae 100644 --- a/pages/blog/diary/[did]/[page].tsx +++ b/pages/blog/diary/[did]/[page].tsx @@ -1,21 +1,14 @@ import type { GetServerSideProps, NextPage } from "next"; -import DiaryPageSelector from "../../../../components/Blog/DiaryPageSelector"; +import ContentPage from "../../../../components/Blog/ContentPage"; import Layout from "../../../../components/Blog/Layout"; import { generateContent, getContentList } from "../../../../lib/content/generateBackend"; -import type { ContentList, Diary } from "../../../../lib/content/types"; +import type { ContentList, Diary, DiaryRender } from "../../../../lib/content/types"; import styles from "../../../../styles/Blog/Content.module.scss"; -interface IContentRender extends Diary { - html: string; - pageSelected: number; -} - -const DiaryMain: NextPage<{ content: IContentRender }> = ({ content }) => { +const DiaryMain: NextPage<{ content: DiaryRender }> = ({ content }) => { return -
-
- e.title)} bottom /> +
; }; diff --git a/pages/blog/project/[pid].tsx b/pages/blog/project/[pid].tsx index 92305d0..53c3010 100644 --- a/pages/blog/project/[pid].tsx +++ b/pages/blog/project/[pid].tsx @@ -1,21 +1,14 @@ import type { GetServerSideProps, NextPage } from "next"; +import ContentPage from "../../../components/Blog/ContentPage"; import Layout from "../../../components/Blog/Layout"; import { generateContent, getContentList } from "../../../lib/content/generateBackend"; -import type { ContentList } from "../../../lib/content/types"; +import type { ContentList, ProjectRender } from "../../../lib/content/types"; import styles from "../../../styles/Blog/Content.module.scss"; -interface IContentRender { - more?: string; - repo?: string; - title: string; - html: string; -} - -const Post: NextPage<{ content: IContentRender }> = ({ content }) => { +const Post: NextPage<{ content: ProjectRender }> = ({ content }) => { return -
-
+
; };