86 lines
2.5 KiB
Plaintext
86 lines
2.5 KiB
Plaintext
---
|
|
import MainLayout from "../../layouts/main.astro";
|
|
import { Client } from "@notionhq/client";
|
|
import { NotionToMarkdown } from "notion-to-md";
|
|
import {marked} from "marked";
|
|
|
|
const notion = new Client({
|
|
auth: "secret_AXxqx7iaGrcuAcG5ib9l6smC0jqaEeLDb6G1jtUwI5i",
|
|
});
|
|
|
|
export async function getStaticPaths() {
|
|
const pageId = "87ff5ccc453349de8aa5ae32833817e3";
|
|
|
|
const notionPagesContent = await (
|
|
await fetch(
|
|
`https://api.notion.com/v1/blocks/${pageId}/children?page_size=100`,
|
|
{
|
|
headers: {
|
|
Authorization: `Bearer secret_AXxqx7iaGrcuAcG5ib9l6smC0jqaEeLDb6G1jtUwI5i`,
|
|
"Notion-Version": "2022-02-22",
|
|
},
|
|
}
|
|
)
|
|
).json();
|
|
|
|
const pages = notionPagesContent.results.filter(
|
|
(page) => page.type === "child_page"
|
|
);
|
|
|
|
return pages.map((page) => ({
|
|
params: {
|
|
id: page.id,
|
|
},
|
|
}));
|
|
}
|
|
|
|
const { id } = Astro.params;
|
|
|
|
const pageData = await (
|
|
await fetch(`https://api.notion.com/v1/pages/${id}`, {
|
|
headers: {
|
|
Authorization: `Bearer secret_AXxqx7iaGrcuAcG5ib9l6smC0jqaEeLDb6G1jtUwI5i`,
|
|
"Notion-Version": "2022-02-22",
|
|
},
|
|
})
|
|
).json();
|
|
|
|
const n2m = new NotionToMarkdown({ notionClient: notion });
|
|
|
|
// @ts-ignore
|
|
const mdblocks = await n2m.pageToMarkdown(id);
|
|
const mdString = n2m.toMarkdownString(mdblocks);
|
|
const generalString = mdString.replace(/(\r\n|\n|\r)/gm, " ").replace(/(-|#)/gm, "").replaceAll(" ", " ");
|
|
const mdArray = mdString.split("\n");
|
|
|
|
for (let i = 0; i < mdArray.length; i++) {
|
|
if (mdArray[i].includes("https://www.youtube.com")) {
|
|
const videoId = mdArray[i].split("watch?v=")[1].split("&")[0];
|
|
mdArray[i] = '<iframe id="' + videoId + '" type="text/html" width="720" height="405" src="https://www.youtube.com/embed/' + videoId + '" frameborder="0" allowfullscreen></iframe>';
|
|
}
|
|
}
|
|
|
|
const mdGood = mdArray.join("\n");
|
|
|
|
const htmlData = marked.parse(mdGood);
|
|
|
|
const title = pageData.properties.title.title[0].plain_text.split(" | ").splice(0, pageData.properties.title.title[0].plain_text.split(" | ").length - 1).join(" - ");
|
|
const description = generalString.substring(0, 250);
|
|
console.log(pageData.cover)
|
|
const image = pageData.cover.external.url;
|
|
---
|
|
|
|
<MainLayout
|
|
title={title}
|
|
description={description}
|
|
image={image}
|
|
blog={false}
|
|
hasMainTitle={true}
|
|
>
|
|
<div class="relative w-full aspect-video flex justify-center items-center mb-4">
|
|
<img src={image} alt={title} class="w-full h-full object-cover absolute top-0 left-0">
|
|
<h1 class="z-10 text-white px-8 text-sm md:text-xl m-0">{title}</h1>
|
|
</div>
|
|
<div set:html={htmlData}></div>
|
|
</MainLayout>
|