lightnet 2.15.2

package/src/i18n/locals.d.ts

@@ -0,0 +1,38 @@
+declare namespace App {
+  interface Locals {
+    /**
+     * Provides internationalization helpers.
+     */
+    i18n: {
+      /**
+       * Translate a key to the language of the current locale.
+       *
+       * @param TranslationKey to be translated.
+       */
+      t: import("./translate").TranslateFn
+
+      /**
+       *  The current locale or the default locale if the current locale is not available.
+       *
+       *  In comparison to Astro.currentLocale this will always return a locale.
+       *  Use Astro.currentLocale if you want to know the locale that is included in the current path.
+       */
+      currentLocale: string
+
+      /**
+       * The current text direction. Left-to-right or right-to-left.
+       */
+      direction: "ltr" | "rtl"
+
+      /**
+       * The default locale as defined in the project configuration.
+       */
+      defaultLocale: string
+
+      /**
+       * The available locales as defined in the project configuration.
+       */
+      locales: string[]
+    }
+  }
+}

package/src/i18n/locals.ts

@@ -0,0 +1,28 @@
+import type { MiddlewareHandler } from "astro"
+import config from "virtual:lightnet/config"
+
+import { resolveDefaultLocale } from "./resolve-default-locale"
+import { resolveLanguage } from "./resolve-language"
+import { resolveLocales } from "./resolve-locales"
+import { useTranslate } from "./translate"
+
+export const onRequest: MiddlewareHandler = (
+  { locals, currentLocale: astroCurrentLocale },
+  next,
+) => {
+  if (!locals.i18n) {
+    const t = useTranslate(astroCurrentLocale)
+    const defaultLocale = resolveDefaultLocale(config)
+    const locales = resolveLocales(config)
+    const currentLocale = astroCurrentLocale ?? defaultLocale
+    const { direction } = resolveLanguage(currentLocale)
+    locals.i18n = {
+      t,
+      currentLocale,
+      defaultLocale,
+      direction,
+      locales,
+    }
+  }
+  return next()
+}

package/src/i18n/resolve-default-locale.ts

@@ -0,0 +1,30 @@
+import { AstroError } from "astro/errors"
+
+export const resolveDefaultLocale = ({
+  languages,
+}: {
+  languages: {
+    code: string
+    isDefaultLocale?: boolean
+    translations?: unknown
+  }[]
+}) => {
+  const defaultLanguage = languages.find((l) => l.isDefaultLocale)
+  if (defaultLanguage) {
+    return defaultLanguage.code
+  }
+  const uiLanguages = languages.filter((l) => !!l.translations)
+  if (uiLanguages.length === 0) {
+    throw new AstroError(
+      "No user interface language found",
+      "Make sure you include a translations object for at least one of your languages.",
+    )
+  }
+  if (uiLanguages.length > 1) {
+    throw new AstroError(
+      "Could not identify the default user interface language",
+      "Make sure you have set one language to be the default language by setting the isDefaultLocale property.",
+    )
+  }
+  return uiLanguages[0].code
+}

package/src/i18n/resolve-language.ts

@@ -0,0 +1,25 @@
+import { AstroError } from "astro/errors"
+
+import { ALL_LANGUAGES } from "./languages"
+import type { TranslateFn } from "./translate"
+
+const languages = Object.fromEntries(
+  ALL_LANGUAGES.map((lang) => [lang.code, lang]),
+)
+
+export const resolveLanguage = (bcp47: string) => {
+  const language = languages[bcp47]
+
+  if (!language) {
+    throw new AstroError(`There is no language definition for: ${bcp47}`)
+  }
+  return language
+}
+
+export const resolveTranslatedLanguage = (bcp47: string, t: TranslateFn) => {
+  const language = resolveLanguage(bcp47)
+  return {
+    ...language,
+    name: t(language.label, { allowFixedStrings: true }),
+  }
+}

package/src/i18n/resolve-locales.ts

@@ -0,0 +1,5 @@
+import type { Language } from "../astro-integration/config"
+
+export const resolveLocales = ({ languages }: { languages: Language[] }) => {
+  return languages.filter((l) => !!l.translations).map((l) => l.code)
+}

package/src/i18n/translate.ts

@@ -0,0 +1,64 @@
+import { AstroError } from "astro/errors"
+import config from "virtual:lightnet/config"
+
+import { resolveDefaultLocale } from "./resolve-default-locale"
+import de from "./translations/de.json"
+import en from "./translations/en.json"
+
+type TranslationsByLocales = Record<string, Record<string, string>>
+
+// We add (string & NonNullable<unknown>) to preserve typescript autocompletion for known keys
+export type TranslationKey = keyof typeof en | (string & NonNullable<unknown>)
+export type TranslationOptions = { allowFixedStrings?: boolean }
+
+export type TranslateFn = (
+  key: TranslationKey,
+  options?: TranslationOptions,
+) => string
+
+const configTranslations = config.languages
+  .filter((l) => !!l.translations)
+  .reduce((prev, curr) => ({ ...prev, [curr.code]: curr.translations }), {})
+const translationsByLocales = merge({ de, en }, configTranslations)
+const defaultLocale = resolveDefaultLocale(config)
+
+export function useTranslate(locale: string | undefined): TranslateFn {
+  const resolvedLocale = locale ?? defaultLocale
+  const translations = translationsByLocales[resolvedLocale]
+  const defaultTranslations = translationsByLocales[defaultLocale]
+  if (!translations) {
+    throw new AstroError(
+      `No translations found for language ${resolvedLocale}`,
+      "Add them to your lightnet config inside astro.config.mjs.",
+    )
+  }
+  return (key: TranslationKey, options?: TranslationOptions) => {
+    const value = translations[key] ?? defaultTranslations[key]
+    const isTranslationKey = key.startsWith("custom.") || key.startsWith("ln.")
+    if (!value && options?.allowFixedStrings && !isTranslationKey) {
+      return key
+    }
+    if (!value) {
+      throw new AstroError(
+        `Missing translation: '${key}' is undefined for language '${resolvedLocale}'.`,
+        `Add a translation for '${key}' to src/translations/${resolvedLocale}.json`,
+      )
+    }
+    return value
+  }
+}
+
+function merge(
+  source: TranslationsByLocales,
+  toMerge: TranslationsByLocales,
+): TranslationsByLocales {
+  const result = { ...source }
+  for (const key of Object.keys(toMerge)) {
+    if (!source[key]) {
+      result[key] = toMerge[key]
+    } else {
+      result[key] = { ...source[key], ...toMerge[key] }
+    }
+  }
+  return result
+}

package/src/i18n/translations/de.json

@@ -0,0 +1,25 @@
+{
+  "ln.404.go-to-the-home-page": "Zurück zur Startseite",
+  "ln.404.page-not-found": "Seite nicht gefunden",
+  "ln.common.categories": "Kategorien",
+  "ln.common.category": "Kategorie",
+  "ln.common.language": "Sprache",
+  "ln.common.languages": "Sprachen",
+  "ln.common.type": "Typ",
+  "ln.common.a11y.external-link": "Externer link",
+  "ln.details.open": "Öffnen",
+  "ln.details.part-of": "Teil der Sammlung",
+  "ln.details.download": "Download",
+  "ln.details.share": "Teilen",
+  "ln.header.a11y.open-main-menu": "Öffne Hauptmenü",
+  "ln.header.a11y.select-language": "Sprache auswählen",
+  "ln.home.title": "Startseite",
+  "ln.search.all-categories": "Alle Kategorien",
+  "ln.search.all-languages": "Alle Sprachen",
+  "ln.search.all-types": "Alle Typen",
+  "ln.search.more-results": "Mehr Ergebnisse",
+  "ln.search.no-results": "Keine Ergebnisse",
+  "ln.search.placeholder": "Suche in Titel, Autor, Beschreibung...",
+  "ln.search.title": "Suche",
+  "ln.share.url-copied-to-clipboard": "URL in die Zwischenablage kopiert"
+}

package/src/i18n/translations/en.json

@@ -0,0 +1,25 @@
+{
+  "ln.404.go-to-the-home-page": "Go to the Home page",
+  "ln.404.page-not-found": "Page not found",
+  "ln.common.categories": "Categories",
+  "ln.common.category": "Category",
+  "ln.common.language": "Language",
+  "ln.common.languages": "Languages",
+  "ln.common.a11y.external-link": "External link",
+  "ln.common.type": "Type",
+  "ln.details.open": "Open",
+  "ln.details.share": "Share",
+  "ln.details.part-of-collection": "Part of Collection",
+  "ln.details.download": "Download",
+  "ln.header.a11y.open-main-menu": "Open Main Menu",
+  "ln.header.a11y.select-language": "Select language",
+  "ln.home.title": "Home",
+  "ln.search.all-categories": "All Categories",
+  "ln.search.all-languages": "All Languages",
+  "ln.search.all-types": "All Types",
+  "ln.search.more-results": "More results",
+  "ln.search.no-results": "No Results",
+  "ln.search.placeholder": "Search in Title, Author, Description...",
+  "ln.search.title": "Search",
+  "ln.share.url-copied-to-clipboard": "URL copied to clipboard"
+}

package/src/layouts/MarkdownPage.astro

@@ -0,0 +1,11 @@
+---
+import Page from "./Page.astro"
+---
+
+<Page>
+  <article
+    class="prose prose-gray mx-auto mt-8 max-w-screen-md px-4 sm:mt-16 md:px-8"
+  >
+    <slot />
+  </article>
+</Page>

package/src/layouts/Page.astro

@@ -0,0 +1,54 @@
+---
+import { ClientRouter } from "astro:transitions"
+import config from "virtual:lightnet/config"
+
+import { resolveLanguage } from "../i18n/resolve-language"
+import Favicon from "./components/Favicon.astro"
+import PageNavigation from "./components/PageNavigation.astro"
+import PageTitle from "./components/PageTitle.astro"
+import PreloadReact from "./components/PreloadReact"
+
+interface Props {
+  title?: string
+  description?: string
+}
+
+const { title, description } = Astro.props
+const configTitle = Astro.locals.i18n.t(config.title, {
+  allowFixedStrings: true,
+})
+
+const { currentLocale } = Astro.locals.i18n
+const language = resolveLanguage(currentLocale)
+---
+
+<!doctype html>
+<html lang={currentLocale} dir={language.direction}>
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>{title ? `${title} | ${configTitle}` : configTitle}</title>
+    {description && <meta name="description" content={description} />}
+    {config.manifest && <link rel="manifest" href={config.manifest} />}
+    <link rel="prefetch" href="/api/search.json" />
+    <Favicon />
+    <ClientRouter />
+  </head>
+  <body class="overflow-y-scroll bg-gray-50 text-gray-900">
+    <header
+      class="fixed top-0 z-50 h-14 w-full bg-gray-50 shadow-lg sm:h-20"
+      transition:animate="none"
+    >
+      <div
+        class="mx-auto flex h-full max-w-screen-xl justify-between px-4 md:px-8"
+      >
+        <PageTitle />
+        <PageNavigation />
+      </div>
+    </header>
+    <main class="mx-auto min-h-screen pb-8 pt-14 sm:py-20">
+      <slot />
+    </main>
+    <PreloadReact client:idle />
+  </body>
+</html>

package/src/layouts/components/Favicon.astro

@@ -0,0 +1,32 @@
+---
+import { extname } from "node:path"
+
+import { AstroError } from "astro/errors"
+import config from "virtual:lightnet/config"
+
+const faviconTypes = {
+  ".ico": "image/x-icon",
+  ".gif": "image/gif",
+  ".jpeg": "image/jpeg",
+  ".jpg": "image/jpeg",
+  ".png": "image/png",
+  ".svg": "image/svg+xml",
+} as Record<string, string>
+
+const favicons = config.favicon?.map((favicon) => {
+  const type = faviconTypes[extname(favicon.href)]
+  if (!type) {
+    throw new AstroError(
+      `Unsupported favicon ${favicon.href}`,
+      "favicon must be a .ico, .gif, .jpg, .png, or .svg file",
+    )
+  }
+  return { ...favicon, type }
+})
+---
+
+{
+  favicons?.map(({ rel, type, href, sizes }) => (
+    <link rel={rel} type={type} href={href} sizes={sizes} />
+  ))
+}

package/src/layouts/components/LanguagePicker.astro

@@ -0,0 +1,38 @@
+---
+import { resolveTranslatedLanguage } from "../../i18n/resolve-language"
+import { localizePath } from "../../utils/paths"
+import Menu from "./Menu.astro"
+import MenuItem from "./MenuItem.astro"
+
+const { t, locales } = Astro.locals.i18n
+
+const translations = locales
+  .map((locale) => ({
+    locale,
+    label: resolveTranslatedLanguage(locale, t).name,
+    active: locale === Astro.currentLocale,
+    href: currentPathWithLocale(locale),
+  }))
+  .sort((a, b) => a.label.localeCompare(b.label))
+
+function currentPathWithLocale(locale: string) {
+  const currentPath = Astro.url.pathname
+  const currentPathWithoutLocale =
+    Astro.currentLocale && currentPath.startsWith(`/${Astro.currentLocale}`)
+      ? currentPath.slice(Astro.currentLocale.length + 1)
+      : currentPath
+  return localizePath(locale, currentPathWithoutLocale)
+}
+---
+
+{
+  translations.length > 1 && (
+    <Menu icon="mdi--translate" label="ln.header.a11y.select-language">
+      {translations.map(({ label, locale, active, href }) => (
+        <MenuItem href={href} hreflang={locale} active={active}>
+          {label}
+        </MenuItem>
+      ))}
+    </Menu>
+  )
+}

package/src/layouts/components/Menu.astro

@@ -0,0 +1,28 @@
+---
+import Icon from "../../components/Icon"
+
+interface Props {
+  icon: string
+  label: string
+}
+
+const { icon, label } = Astro.props
+---
+
+<div class="dy-dropdown dy-dropdown-end">
+  <div
+    role="button"
+    tabindex="0"
+    aria-label={Astro.locals.i18n.t(label)}
+    class="hover:text-primary flex rounded-md p-3 text-gray-600"
+  >
+    <Icon className={icon} ariaLabel="" />
+  </div>
+
+  <ul
+    tabindex="0"
+    class="dy-dropdown-content top-px me-3 mt-[3.25rem] w-48 overflow-hidden rounded-b-md bg-gray-50 py-3 shadow-lg sm:mt-16"
+  >
+    <slot />
+  </ul>
+</div>

package/src/layouts/components/MenuItem.astro

@@ -0,0 +1,21 @@
+---
+interface Props {
+  href: string
+  active: boolean
+  hreflang?: string
+  target?: "_blank" | "_self"
+}
+const { href, hreflang, active, target } = Astro.props
+---
+
+<li>
+  <a
+    href={href}
+    hreflang={hreflang}
+    target={target}
+    class="flex items-center gap-3 px-6 py-3 decoration-gray-800"
+    class:list={[active ? "font-bold" : "hover:underline"]}
+  >
+    <slot />
+  </a>
+</li>

package/src/layouts/components/PageNavigation.astro

@@ -0,0 +1,65 @@
+---
+import config from "virtual:lightnet/config"
+
+import Icon from "../../components/Icon"
+import { localizePath, searchPagePath } from "../../utils/paths"
+import { isExternalUrl } from "../../utils/urls"
+import LanguagePicker from "./LanguagePicker.astro"
+import Menu from "./Menu.astro"
+import MenuItem from "./MenuItem.astro"
+
+const currentPath = Astro.url.pathname
+const items = (config.mainMenu ?? []).map(({ href, label, requiresLocale }) => {
+  const isExternal = isExternalUrl(href)
+  const path =
+    isExternal || !requiresLocale
+      ? href
+      : localizePath(Astro.currentLocale, href)
+  const isActive =
+    !isExternal &&
+    (currentPath === localizePath(Astro.currentLocale, href) ||
+      currentPath === localizePath(Astro.currentLocale, `${href}/`) ||
+      currentPath === href)
+  return {
+    path,
+    isExternal,
+    label,
+    isActive,
+  }
+})
+
+const t = Astro.locals.i18n.t
+---
+
+<nav class="-me-3 flex items-center">
+  <a
+    class="hover:text-primary flex p-3 text-gray-600"
+    aria-label={t("ln.search.title")}
+    data-astro-prefetch="viewport"
+    href={searchPagePath(Astro.currentLocale)}
+    ><Icon className="mdi--magnify" ariaLabel="" /></a
+  >
+  <LanguagePicker />
+
+  {
+    !!items.length && (
+      <Menu icon="mdi--menu" label="ln.header.a11y.open-main-menu">
+        {items.map(({ label, path, isActive, isExternal }) => (
+          <MenuItem
+            href={path}
+            active={isActive}
+            target={isExternal ? "_blank" : "_self"}
+          >
+            {t(label, { allowFixedStrings: true })}
+            {isExternal && (
+              <Icon
+                className="mdi--external-link shrink-0 text-base"
+                ariaLabel=""
+              />
+            )}
+          </MenuItem>
+        ))}
+      </Menu>
+    )
+  }
+</nav>

package/src/layouts/components/PageTitle.astro

@@ -0,0 +1,44 @@
+---
+import type { ImageMetadata } from "astro"
+import { Image } from "astro:assets"
+import config from "virtual:lightnet/config"
+import logo from "virtual:lightnet/logo"
+
+import { localizePath } from "../../utils/paths"
+
+function getWidth(logo: ImageMetadata) {
+  const size = config.logo?.size ?? 28
+  // Calculate width to use for the logo.
+  // This based on the size that should measure the shorter side
+  // of the image
+  return Math.floor(size * Math.max(1, logo.width / logo.height))
+}
+
+const logoAlt = config.logo?.alt ?? ""
+const t = Astro.locals.i18n.t
+---
+
+<a
+  class="flex items-center gap-3 font-bold text-gray-600 md:text-lg"
+  href={localizePath(Astro.currentLocale, "/")}
+>
+  {
+    logo &&
+      (logo.format === "svg" ? (
+        <img
+          src={logo.src}
+          alt={t(logoAlt, { allowFixedStrings: true })}
+          style={`width:${getWidth(logo)}px;`}
+        />
+      ) : (
+        <Image
+          src={logo}
+          alt={t(logoAlt, { allowFixedStrings: true })}
+          style={`width:${getWidth(logo)}px;`}
+          width={getWidth(logo)}
+          densities={[1.5, 2, 3]}
+          loading="eager"
+        />
+      ))
+  }{t(config.title, { allowFixedStrings: true })}</a
+>

package/src/layouts/components/PreloadReact.tsx

@@ -0,0 +1,3 @@
+export default function PreloadReact() {
+  return <></>
+}

package/src/pages/404.astro

@@ -0,0 +1,14 @@
+---
+import Page from "../layouts/Page.astro"
+---
+
+<Page>
+  <div class="flex flex-col items-center">
+    <p class="pb-8 pt-20 text-center text-3xl opacity-80">
+      {Astro.locals.i18n.t("ln.404.page-not-found")}
+    </p>
+    <a href={`/${Astro.locals.i18n.defaultLocale}`} class="dy-btn"
+      >{Astro.locals.i18n.t("ln.404.go-to-the-home-page")}</a
+    >
+  </div>
+</Page>

package/src/pages/RedirectToDefaultLocale.astro

@@ -0,0 +1,3 @@
+---
+return Astro.rewrite(`/${Astro.locals.i18n.defaultLocale}`)
+---

package/src/pages/api/search-response.ts

@@ -0,0 +1,14 @@
+export type SearchItem = {
+  title: string
+  id: string
+  type: string
+  authors?: string[]
+  categories?: string[]
+  description?: string
+  language: string
+  image: { src: string; width: number; height: number }
+}
+
+export type SearchResponse = {
+  items: SearchItem[]
+}

package/src/pages/api/search.ts

@@ -0,0 +1,47 @@
+import type { APIRoute } from "astro"
+import { getImage } from "astro:assets"
+
+import type { MediaItemEntry } from "../../content/content-schema-internal"
+import { getMediaItems } from "../../content/get-media-items"
+import { markdownToText } from "../../utils/markdown"
+import type { SearchItem } from "./search-response"
+
+export const GET: APIRoute = async () => {
+  const items = await searchResults()
+  return new Response(JSON.stringify({ items }))
+}
+
+export async function searchResults() {
+  const items: SearchItem[] = []
+  for await (const mediaItem of await getMediaItems()) {
+    items.push(await createSearchItem(mediaItem))
+  }
+  return items.sort((a, b) => {
+    return 10 * a.type.localeCompare(b.type) + a.title.localeCompare(b.title)
+  })
+}
+
+async function createSearchItem(mediaItem: MediaItemEntry) {
+  const {
+    id,
+    data: { image, title, authors, categories, language, description, type },
+  } = mediaItem
+  const {
+    src,
+    attributes: { width, height },
+  } = await getImage({
+    src: image,
+    format: "webp",
+    width: 144,
+  })
+  return {
+    title,
+    id,
+    type: type.id,
+    authors,
+    categories: categories?.map(({ id }) => id),
+    description: markdownToText(description)?.slice(0, 350),
+    language,
+    image: { src, width, height },
+  }
+}