feat: add projects

Author: openscript

.changeset/tired-hoops-poke.md

@@ -0,0 +1,5 @@
+---
+"r.obin.ch": minor
+---
+
+Add projects

src/collections/notes.ts

@@ -1,7 +1,7 @@
 import { getCollection } from "astro:content";
 import type { GitInfoFrontmatter } from "../remark/remark-git-info";
 
-export type Note = { path: string, title: string, gitInfo: GitInfoFrontmatter["git"] };
+export type Note = { path: string, title: string, gitInfo?: GitInfoFrontmatter };
 export type NestedNotes = {
   [key: string]: NestedNotes | { note: Note };
 };

src/collections/projects.ts

@@ -1,3 +1,28 @@
-import { getCollection } from "astro:content";
+import { getCollection, render } from "astro:content";
+import { getGitInfo } from "../remark/remark-git-info";
 
-export const defaultProjectsCollection = await getCollection("projects");
+const projectsCollection = await getCollection("projects");
+const projectsContentCollection = await getCollection("projectsContent");
+
+export const defaultProjectsCollection = await Promise.all(
+  projectsContentCollection.map(async (content) => {
+    const project = projectsCollection.find(
+      (project) => project.data.contentPath === content.data.contentPath
+    );
+    if (!project) {
+      throw new Error(
+        `Project not found for contentPath: ${content.data.contentPath}`
+      );
+    }
+    const { remarkPluginFrontmatter } = await render(content);
+    const gitInfo = getGitInfo(remarkPluginFrontmatter);
+    return {
+      ...content,
+      data: {
+        gitInfo,
+        ...project.data,
+        ...content.data,
+      },
+    };
+  })
+);

src/components/GitInfo.astro

@@ -5,9 +5,9 @@ import Button from './Button.astro';
 import DateTime from './DateTime.astro';
 import Foldable from './Foldable.astro';
 
-type Props = GitInfoFrontmatter;
+type Props = { gitInfo?: GitInfoFrontmatter };
 
-const { git } = Astro.props;
+const { gitInfo } = Astro.props;
 const locale = parseLocale(Astro.currentLocale);
 const t = useTranslations(locale);
 
@@ -17,16 +17,16 @@ const t = useTranslations(locale);
   <span class="label" slot="title">{t('gitInfoLabel')}</span>
   <dl>
     <slot name="before" />
-    {git?.lastCommit && (
+    {gitInfo?.lastCommit && (
       <dt>{t('authorLabel')}</dt>
-      <dd>{git.lastCommit.authorName}</dd>
+      <dd>{gitInfo.lastCommit.authorName}</dd>
       <dt>{t('lastUpdatedLabel')}</dt>
-      <dd><DateTime date={new Date(git.lastCommit.date)} /></dd>
+      <dd><DateTime date={new Date(gitInfo.lastCommit.date)} /></dd>
       <dt>{t('linksLabel')}</dt>
       <dd>
-        <Button href={git.remoteViewUrl}>{t('sourceLabel')}</Button>
-        <Button href={git.remoteHistoryUrl}>{t('historyLabel')}</Button>
-        <Button href={git.remoteEditUrl}>{t('editLabel')}</Button>
+        <Button href={gitInfo.remoteViewUrl}>{t('sourceLabel')}</Button>
+        <Button href={gitInfo.remoteHistoryUrl}>{t('historyLabel')}</Button>
+        <Button href={gitInfo.remoteEditUrl}>{t('editLabel')}</Button>
       </dd>
     )}
     <slot name="after" />

src/components/NoteListEntry.astro

@@ -5,7 +5,7 @@ import DateTime from "./DateTime.astro";
 type Props = {
   path: string;
   title: string;
-  gitInfo: GitInfoFrontmatter["git"];
+  gitInfo?: GitInfoFrontmatter;
 };
 
 const { path, title, gitInfo } = Astro.props;
@@ -23,7 +23,7 @@ const { path, title, gitInfo } = Astro.props;
 <a href={path}>
   <span class="note-title">{title}</span>
   {
-    gitInfo.lastCommit && (
+    gitInfo?.lastCommit && (
       <span class="note-modified">
         <DateTime date={new Date(gitInfo.lastCommit?.date)} dateStyle="short" />
       </span>

src/content.config.ts

@@ -45,14 +45,14 @@ const galleryCollection = defineCollection({
   ),
 });
 const projectsCollection = defineCollection({
-  loader: glob({ pattern: "**/[^_]*.{md,mdx}", base: "./src/content/projects" }),
-  schema: ({ image }) =>
+  loader: i18nContentLoader({ pattern: "**/[^_]*.yml", base: "./src/content/projects" }),
+  schema: ({ image }) => extendI18nLoaderSchema(
     z.object({
-      title: z.string(),
-      summary: z.string(),
       homepage: z.string().url().optional(),
       source: z.string().url().optional(),
       cover: image().optional(),
+      status: z.enum(["active", "maintenance", "archived"]),
+      type: z.enum(["website", "app", "library", "tool", "other"]),
       images: z.array(
         z.object({
           src: image(),
@@ -61,6 +61,16 @@ const projectsCollection = defineCollection({
         }),
       ).optional(),
     }),
+  ),
+});
+const projectsContentCollection = defineCollection({
+  loader: i18nLoader({ pattern: "**/[^_]*.{md,mdx}", base: "./src/content/projects" }),
+  schema: extendI18nLoaderSchema(
+    z.object({
+      title: z.string(),
+      summary: z.string(),
+    }),
+  ),
 });
 const pagesCollection = defineCollection({
   loader: i18nLoader({ pattern: "**/[^_]*.{md,mdx}", base: "./src/content/pages" }),
@@ -96,6 +106,7 @@ export const collections = {
   notes: notesCollection,
   gallery: galleryCollection,
   projects: projectsCollection,
+  projectsContent: projectsContentCollection,
   pages: pagesCollection,
   navigation: navigationCollection,
   sections: sectionsCollection,

src/content/projects/astro-loader-i18n/astro-loader-i18n.de.mdx

@@ -0,0 +1,5 @@
+---
+title: Astro-Loader für Internationalisierung und Lokalisierung
+summary: Ein Astro Glob Loader für i18n-Dateien und Ordnerstrukturen.
+---
+

src/content/projects/astro-loader-i18n/astro-loader-i18n.en.mdx

@@ -0,0 +1,5 @@
+---
+title: Astro Loader for Internationalization and Localization
+summary: An Astro glob content loader for i18n files and folder structures.
+---
+

src/content/projects/astro-loader-i18n/astro-loader-i18n.yml

@@ -0,0 +1,4 @@
+homepage: https://www.npmjs.com/package/astro-loader-i18n
+source: https://github.com/openscript/astro-loader-i18n
+status: active
+type: library

src/content/projects/gatsby-plugin-i18n-l10n.de.mdx

@@ -0,0 +1,5 @@
+---
+title: Gatsby-Plugin für Internationalisierung und Lokalisierung
+summary: Gatsby-Plugin, der es ermöglicht, Seiten, Inhalte und die URLs oder Slugs von Seiten zu übersetzen.
+---
+

src/content/projects/gatsby-plugin-i18n-l10n/gatsby-plugin-i18n-l10n.de.mdx

@@ -1,8 +1,5 @@
 ---
 title: Gatsby Plugin for internationalization and localization
 summary: Gatsby Plugin, that let you translate pages, content and the url or slugs of pages.
-homepage: https://www.gatsbyjs.com/plugins/gatsby-plugin-i18n-l10n
-source: https://github.com/openscript-ch/gatsby-plugin-i18n-l10n
 ---
 
-Test

src/content/projects/gatsby-plugin-i18n-l10n.en.mdx renamed to src/content/projects/gatsby-plugin-i18n-l10n/gatsby-plugin-i18n-l10n.en.mdx

@@ -0,0 +1,4 @@
+homepage: https://www.gatsbyjs.com/plugins/gatsby-plugin-i18n-l10n
+source: https://github.com/openscript-ch/gatsby-plugin-i18n-l10n
+status: maintenance
+type: library

src/content/projects/gatsby-plugin-i18n-l10n/gatsby-plugin-i18n-l10n.yml

@@ -1,7 +1,5 @@
 /// <reference path="../.astro/types.d.ts" />
 
-type ArrayElement<ArrayType extends readonly unknown[]> = ArrayType extends readonly (infer ElementType)[] ? ElementType : never;
-
 export {};
 
 declare global {

src/env.d.ts

@@ -17,7 +17,6 @@ export const getStaticPaths = async () => {
 };
 
 const page = Astro.props;
-
 const { Content } = await render(page);
 ---
 

src/pages/[...locale]/[...pages].astro

@@ -3,7 +3,7 @@ import DefaultLayout from "../../../layouts/DefaultLayout.astro";
 import Post from "../../../layouts/pages/Post.astro";
 import TableOfContents from "../../../components/TableOfContents.astro";
 import GitInfo from "../../../components/GitInfo.astro";
-import type { GitInfoFrontmatter } from "../../../remark/remark-git-info";
+import { getGitInfo } from "../../../remark/remark-git-info";
 import { parseLocale, useTranslations } from "../../../utils/i18n";
 import Comments from "../../../components/Comments.astro";
 import Meta from "../../../layouts/groups/Meta.astro";
@@ -41,7 +41,7 @@ const blogPath =
     ? originalResolvePath(paramsBlog)
     : originalResolvePath(locale, paramsBlog);
 
-const git: GitInfoFrontmatter["git"] = remarkPluginFrontmatter.git;
+const gitInfo = getGitInfo(remarkPluginFrontmatter);
 const t = useTranslations(parseLocale(locale));
 ---
 
@@ -52,7 +52,7 @@ const t = useTranslations(parseLocale(locale));
     <Content />
     <Comments />
     <Fragment slot="right">
-      <GitInfo git={git}>
+      <GitInfo gitInfo={gitInfo}>
         <Fragment slot="after">
           <dt>{t("tagsLabel")}</dt>
           <dd>

src/pages/[...locale]/[blog]/[...slug].astro

@@ -8,19 +8,19 @@ import GalleryCard from "../../../components/GalleryCard.astro";
 import { generateGetStaticIndexPaths, resolvePath } from "../../../utils/paths";
 import { C } from "../../../site.config";
 import slug from "limax";
+import Meta from "../../../layouts/groups/Meta.astro";
 
 export const getStaticPaths = generateGetStaticIndexPaths(
   "[...locale]/[gallery]",
 );
-const { translations } = Astro.props;
+const { translations, data: { locale } } = Astro.props;
 
-const locale = parseLocale(Astro.props.data.locale);
 const localeParam = locale === C.DEFAULT_LOCALE ? undefined : locale;
 const collection = await getCollection(
   "gallery",
   (category) => category.data.locale === locale,
 );
-const t = useTranslations(locale);
+const t = useTranslations(parseLocale(locale));
 ---
 
 
@@ -33,8 +33,9 @@ const t = useTranslations(locale);
 </style>
 
 <DefaultLayout translations={translations}>
+  <Meta slot="meta" title={t("galleryTitle")} />
   <Page>
-    <h1>{t("galleryTitle")}</h1>
+    <h1 slot="title">{t("galleryTitle")}</h1>
     <CardList classNames="grid">
       {
         collection

src/pages/[...locale]/[gallery]/index.astro

@@ -8,7 +8,7 @@ import { defaultPropsAndParamsOptions, generateGetStaticIndexPaths } from "../..
 import { i18nProps } from "astro-loader-i18n";
 import slug from "limax";
 import { defaultNotesCollection } from "../../../collections/notes";
-import type { GitInfoFrontmatter } from "../../../remark/remark-git-info";
+import { getGitInfo, type GitInfoFrontmatter } from "../../../remark/remark-git-info";
 import { render } from "astro:content";
 
 export const getStaticPaths = generateGetStaticIndexPaths(
@@ -29,13 +29,13 @@ const notes = i18nProps(collection, {
 });
 
 type NestedNotes = {
-  [key: string]: NestedNotes | { note: { path: string; title: string; gitInfo: GitInfoFrontmatter["git"] } };
+  [key: string]: NestedNotes | { note: { path: string; title: string; gitInfo?: GitInfoFrontmatter } };
 };
 
 const notesWithGitInfo = await Promise.all(
   notes.map(async (note) => {
     const { remarkPluginFrontmatter } = await render(note);
-    const gitInfo = remarkPluginFrontmatter?.git as GitInfoFrontmatter["git"];
+    const gitInfo = getGitInfo(remarkPluginFrontmatter)
     return {
       ...note,
       gitInfo,

src/pages/[...locale]/[notes]/index.astro

@@ -0,0 +1,33 @@
+---
+import { i18nPropsAndParams } from "astro-loader-i18n";
+import { defaultProjectsCollection } from "../../../collections/projects";
+import { defaultPropsAndParamsOptions } from "../../../utils/paths";
+import DefaultLayout from "../../../layouts/DefaultLayout.astro";
+import Meta from "../../../layouts/groups/Meta.astro";
+import { render } from "astro:content";
+import Page from "../../../layouts/pages/Page.astro";
+
+export const getStaticPaths = async () => {
+  const routePattern = "[...locale]/[projects]/[project]";
+
+  return i18nPropsAndParams(defaultProjectsCollection, {
+    ...defaultPropsAndParamsOptions,
+    routePattern,
+    generateSegments: (entry) => ({ project: entry.data.contentPath }),
+  });
+};
+
+const page = Astro.props;
+
+console.log(page.data);
+const { Content } = await render(page);
+---
+
+<DefaultLayout translations={page.translations}>
+  <Meta slot="meta" title={page.data.title} />
+  <Page>
+    <h1 slot="title">{page.data.title}</h1>
+    <p>{page.data.summary}</p>
+    <Content />
+  </Page>
+</DefaultLayout>