itsfinniii/website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add page types, index components, and layout

Browse Source
This commit is contained in:
itsfinniii
2026-03-20 16:40:21 +01:00
parent cb4cb9e578
commit 4bb3fa3671
8 changed files with 258 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
astro/src/components/blogs/BlogIndex.astro Normal file
View File

@@ -0,0 +1,9 @@
---
interface Props {
page: BlogIndex;
}
const { page } = Astro.props;
---
<div>Blog Index</div>

9
astro/src/components/projects/ProjectIndex.astro Normal file
View File

@@ -0,0 +1,9 @@
---
interface Props {
page: ProjectIndex;
}
const { page } = Astro.props;
---
<div>Project Index</div>

23
astro/src/content/pages/pages.ts
View File

@@ -287,6 +287,7 @@ export function dataToPage(pageRecord: any): WebPage {
let page: WebPage = { let page: WebPage = {
type: "Webpage", type: "Webpage",
exists: true,
id: pageRecord["id"], id: pageRecord["id"],
lastModified: lastModified, lastModified: lastModified,
url: pageRecord["url"], url: pageRecord["url"],
@@ -330,5 +331,25 @@ export async function getWebpage(route: string): Promise<WebPage | null> {
route: route route: route
}); });
return dataToPage(result["Pages"][0]); if (result["Pages"].length === 0) {
return {
type: "Webpage",
exists: false
};
}
const page = dataToPage(result["Pages"][0]);
if (!page.exists) {
return {
type: "Webpage",
exists: false
};
}
return {
...page,
type: "Webpage",
exists: true
}
} }

27
astro/src/layouts/WebpageLayout.astro
View File

@@ -2,6 +2,11 @@
import '@/styles/global.css'; import '@/styles/global.css';
import { getSettings } from "@/content/settings/settings"; import { getSettings } from "@/content/settings/settings";
interface Props {
settings: WebpageLayoutProps;
}
const pageSettings = Astro.props.settings.searchEngine;
const settings = await getSettings(); const settings = await getSettings();
--- ---
@@ -9,45 +14,43 @@ const settings = await getSettings();
<head> <head>
<!-- High Priority Metadata --> <!-- High Priority Metadata -->
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="lanuage" content="EN" /> <meta name="lanuage" content="en" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" /> <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width" /> <meta name="viewport" content="width=device-width" />
<meta name="theme-color" content={settings.website.colors.primary} /> <meta name="theme-color" content={settings.website.colors.primary} />
<!-- High Priority Page Metadata --> <!-- High Priority Page Metadata -->
<title>{settings.website.titleTemplate.replaceAll("%T", "")}</title> <title>{settings.website.titleTemplate.replaceAll("%T", pageSettings.title)}</title>
<!-- Medium Priority Metadata --> <!-- Medium Priority Metadata -->
<meta name="msapplication-TileColor" content={settings.website.colors.primary} /> <meta name="msapplication-TileColor" content={settings.website.colors.primary} />
<meta name="msapplication-TileImage" content="" /> <meta name="msapplication-TileImage" content="" />
<link rel="sitemap" href="/sitemap/index.xml" /> <link rel="sitemap" href="/sitemap/index.xml" />
<link rel="alternate" type="application/rss+xml" href="/rss.xml" title="RSS" /> <link rel="alternate" type="application/rss+xml" href="/rss.xml" title="RSS" />
<link rel="canonical" href={`${settings.website.domainName}/`}> <link rel="canonical" href={`${settings.website.domainName}/`} />
<meta name="robots" content="index,follow" /> <meta name="robots" content="index,follow" />
<!-- Low Priority Page Metadata --> <!-- Low Priority Page Metadata -->
<meta name="description" content="" /> <meta name="description" content={pageSettings.description} />
<meta property="og:type" content="website" /> <meta property="og:type" content="website" />
<meta property="og:locale" content="en-GB" /> <meta property="og:locale" content="en-GB" />
<meta property="og:title" content={settings.website.titleTemplate.replaceAll("%T", "")} /> <meta property="og:title" content={settings.website.titleTemplate.replaceAll("%T", "")} />
<meta property="og:description" content="" /> <meta property="og:description" content={pageSettings.description} />
<meta property="og:image:url" content="" /> <meta property="og:image:url" content={pageSettings.thumbnail.url} />
<meta property="og:image:alt" content="" />
<meta property="og:url" content={`${settings.website.domainName}${Astro.url.pathname}`} /> <meta property="og:url" content={`${settings.website.domainName}${Astro.url.pathname}`} />
<meta property="og:site_name" content={settings.website.applicationName} /> <meta property="og:site_name" content={settings.website.applicationName} />
<meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content={settings.website.titleTemplate.replaceAll("%T", "")} /> <meta name="twitter:title" content={settings.website.titleTemplate.replaceAll("%T", "")} />
<meta name="twitter:description" content="" /> <meta name="twitter:description" content={pageSettings.description} />
<meta name="twitter:image" content="" /> <meta name="twitter:image" content={pageSettings.thumbnail.url} />
<meta name="twitter:image:alt" content="" />
<meta name="twitter:url" content={`${settings.website.domainName}${Astro.url.pathname}`} /> <meta name="twitter:url" content={`${settings.website.domainName}${Astro.url.pathname}`} />
<meta name="twitter:site" content={settings.website.twitter.handle} /> <meta name="twitter:site" content={settings.website.twitter.handle} />
<meta name="twitter:creator" content={settings.website.twitter.handle} /> <meta name="twitter:creator" content={settings.website.twitter.handle} />
<meta name="pagename" content="" /> <meta name="pagename" content={pageSettings.title} />
<meta name="category" content="webpage" /> <meta name="category" content="webpage" />
<!-- Low Priority Metadata --> <!-- Low Priority Metadata -->
@@ -59,6 +62,6 @@ const settings = await getSettings();
<meta name="application-name" content={settings.website.applicationName} /> <meta name="application-name" content={settings.website.applicationName} />
</head> </head>
<body> <body>
<slot /> <slot name="content" />
</body> </body>
</html> </html>

27
astro/src/lib/pages.ts
View File

@@ -61,7 +61,10 @@ export async function getPage(settings: GlobalSettings, route: string): Promise<
return { return {
route: route, route: route,
pageType: "ProjectIndex", pageType: "ProjectIndex",
page: null page: {
type: "ProjectIndex",
pageNumber: params["page"] !== undefined ? Number(params["page"]) : 1
}
}; };
} }
// Project Post // Project Post
@@ -163,14 +166,34 @@ export async function getPage(settings: GlobalSettings, route: string): Promise<
} }
}; };
} }
// Regular webpage
else if (regexToRoute({ template: "/", allowPagination: false }).regex.test(route) || else if (regexToRoute({ template: "/", allowPagination: false }).regex.test(route) ||
regexToRoute({ template: "/%R", allowPagination: false }).regex.test(route)) { regexToRoute({ template: "/%R", allowPagination: false }).regex.test(route)) {
const webpageContent = await getWebpage(route); const webpageContent = await getWebpage(route);
if (webpageContent === null || !webpageContent.exists) {
return { return {
route: route, route: route,
pageType: "Webpage", pageType: "Webpage",
page: webpageContent page: {
type: "Webpage",
exists: false
}
}
}
return {
route: route,
pageType: "Webpage",
page: {
type: "Webpage",
exists: true,
id: webpageContent.id,
lastModified: webpageContent.lastModified,
url: webpageContent.url,
searchEngine: webpageContent.searchEngine,
components: webpageContent.components
}
}; };
} }
else { else {

158
astro/src/pages/[...route].astro
View File

@@ -3,27 +3,169 @@ import { getAllRoutesList } from "@/lib/routing";
import { getPage } from "@/lib/pages"; import { getPage } from "@/lib/pages";
import { getSettings } from "@/content/settings/settings" import { getSettings } from "@/content/settings/settings"
import WebpageLayout from "@/layouts/WebpageLayout.astro"; import WebpageLayout from "@/layouts/WebpageLayout.astro";
import BlogIndex from "@/components/blogs/BlogIndex.astro";
import ProjectIndex from "@/components/projects/ProjectIndex.astro";
export async function getStaticPaths() { export async function getStaticPaths() {
const settings = await getSettings(); const settings = await getSettings();
const pages = await getAllRoutesList(settings); const pages = await getAllRoutesList(settings);
console.log(pages);
let routes: any[] = []; let routes: any[] = [];
pages.forEach((page) => { pages.forEach((page) => {
routes.push({ params: { route: page } }); routes.push({ params: { route: page } });
}) });
return routes; return routes;
} }
const settings = await getSettings(); const settings = await getSettings();
const routes = await getAllRoutesList(settings); const page = await getPage(settings, Astro.url.pathname);
const page = await getPage(settings, "/album/2026/mirai-nexus-2026/6c0e4453ab");
if (page === null) {
return new Response("Page not found.", {
status: 404,
statusText: "Not Found"
});
}
--- ---
<WebpageLayout> { page.pageType === "Webpage" && (
<h1>Test</h1> <WebpageLayout settings={{
</WebpageLayout> searchEngine: {
title: "",
description: "",
allowCrawlers: true,
canonical: null,
priority: 65,
thumbnail: {
url: "",
width: 1200,
height: 630
}
}}}>
<Fragment slot="content">
<div>Webpage</div>
</Fragment>
</WebpageLayout>
) }
{ page.pageType === "BlogIndex" && (
<WebpageLayout settings={{
searchEngine: {
title: "Blogs",
description: "",
allowCrawlers: true,
canonical: null,
priority: 65,
thumbnail: {
url: "",
width: 1200,
height: 630
}
}}}>
<Fragment slot="content">
<BlogIndex page={page.page as BlogIndex} />
</Fragment>
</WebpageLayout>
) }
{ page?.pageType === "BlogPost" && (
<WebpageLayout settings={{
searchEngine: {
title: "Blogs",
description: "",
allowCrawlers: true,
canonical: null,
priority: 65,
thumbnail: {
url: "",
width: 1200,
height: 630
}
}}}>
<Fragment slot="content">
<dib>BlogPost</dib>
</Fragment>
</WebpageLayout>
) }
{ page.pageType === "ProjectIndex" && (
<WebpageLayout settings={{
searchEngine: {
title: "Projects",
description: "",
allowCrawlers: true,
canonical: null,
priority: 65,
thumbnail: {
url: "",
width: 1200,
height: 630
}
}}}>
<Fragment slot="content">
<ProjectIndex page={page.page as ProjectIndex} />
</Fragment>
</WebpageLayout>
) }
{ page.pageType === "ProjectPost" && (
<WebpageLayout settings={{
searchEngine: {
title: "Projects",
description: "",
allowCrawlers: true,
canonical: null,
priority: 65,
thumbnail: {
url: "",
width: 1200,
height: 630
}
}}}>
<Fragment slot="content">
<div>ProjectPost</div>
</Fragment>
</WebpageLayout>
) }
{ page.pageType === "PhotoCategoryIndex" && (
<WebpageLayout settings={{
searchEngine: {
title: "Projects",
description: "",
allowCrawlers: true,
canonical: null,
priority: 65,
thumbnail: {
url: "",
width: 1200,
height: 630
}
}}}>
<Fragment slot="content">
<div>PhotoCategoryIndex</div>
</Fragment>
</WebpageLayout>
) }
{ page.pageType === "Photo" && (
<WebpageLayout settings={{
searchEngine: {
title: "Projects",
description: "",
allowCrawlers: true,
canonical: null,
priority: 65,
thumbnail: {
url: "",
width: 1200,
height: 630
}
}}}>
<Fragment slot="content">
<div>Photo</div>
</Fragment>
</WebpageLayout>
) }

3
astro/src/types/layouts/webpageLayout.d.ts vendored Normal file
View File

@@ -0,0 +1,3 @@
type WebpageLayoutProps = {
searchEngine: SearchEngine;
}

32
astro/src/types/pages/page.d.ts vendored
View File

@@ -1,13 +1,18 @@
type WebPage = { type WebPage =
| {
type: "Webpage"; type: "Webpage";
exists: false;
}
| {
type: "Webpage";
exists: true;
id: string; id: string;
lastModified: Date; lastModified: Date;
url: string; url: string;
searchEngine: SearchEngine; searchEngine: SearchEngine;
components: WebpageComponent[]; components: WebpageComponent[];
} };
type WebpageComponent = type WebpageComponent =
ContactComponent | ContactComponent |
@@ -28,13 +33,14 @@ type PageRegexMatchProps = {
allowPagination: boolean; allowPagination: boolean;
} }
type PageType = { type PageType =
route: string; | { pageType: "Webpage"; page: WebPage; route: string }
pageType: "Webpage" | "BlogIndex" | "BlogPost" | | { pageType: "BlogIndex"; page: BlogIndex; route: string }
"ProjectIndex" | "ProjectPost" | "PhotoCategoryIndex" | | { pageType: "BlogPost"; page: BlogPost; route: string }
"PhotoCategory" | "PhotoAlbum" | "Photo"; | { pageType: "ProjectIndex"; page: ProjectIndex; route: string }
page: WebPage | BlogPost | ProjectPost | BlogIndex | | { pageType: "ProjectPost"; page: ProjectPost; route: string }
ProjectIndex | PhotoCategoryIndex | PhotoCategory | | { pageType: "PhotoCategoryIndex"; page: PhotoCategoryIndex; route: string }
PhotoAlbum | PhotoPage | null; | { pageType: "PhotoCategory"; page: PhotoCategory; route: string }
} | { pageType: "PhotoAlbum"; page: PhotoAlbum; route: string }
| { pageType: "Photo"; page: PhotoPage; route: string }
| { pageType: "Unknown"; page: null; route: string };