lightnet 3.12.2 → 4.0.0

package/src/pages/search-page/components/SearchFilter.astro

@@ -2,35 +2,26 @@
 import config from "virtual:lightnet/config"
 
 import { getUsedCategories } from "../../../content/get-categories"
-import { contentLanguages } from "../../../content/get-languages"
-import { getMediaTypes } from "../../../content/get-media-types"
+import { getUsedLanguages } from "../../../content/get-languages"
+import { getUsedMediaTypes } from "../../../content/get-media-types"
 import { prepareI18nConfig } from "../../../i18n/react/prepare-i18n-config"
 import SearchFilterReact from "./SearchFilter.tsx"
 
-const { t, currentLocale } = Astro.locals.i18n
+const { currentLocale, tMap } = Astro.locals.i18n
 
-const sortByLabelText = (array: { id: string; labelText: string }[]) =>
-  array.sort((a, b) => a.labelText.localeCompare(b.labelText, currentLocale))
-
-const categories = (await getUsedCategories(currentLocale, t)).map(
+const categories = (await getUsedCategories(currentLocale, tMap)).map(
   ({ id, labelText }) => ({ id, labelText }),
 )
 
-const mediaTypes = sortByLabelText(
-  (await getMediaTypes()).map((type) => ({
-    id: type.id,
-    labelText: t(type.data.label),
-  })),
+const mediaTypes = (await getUsedMediaTypes(currentLocale, tMap)).map(
+  ({ id, labelText }) => ({ id, labelText }),
 )
 
-const languages = sortByLabelText(
-  contentLanguages.map((language) => ({
-    id: language.code,
-    labelText: t(language.label),
-  })),
+const languages = (await getUsedLanguages(currentLocale, tMap)).map(
+  ({ code: id, labelText }) => ({ id, labelText }),
 )
 
-const languageFilterEnabled = contentLanguages.length > 1
+const languageFilterEnabled = languages.length > 1
 const typesFilterEnabled = mediaTypes.length > 1
 // Not every media item has a category. So it makes
 // sense to have the filter when there is only one category.
@@ -38,9 +29,7 @@ const categoriesFilterEnabled = categories.length > 0
 
 const filterByLocale = !!config.searchPage?.filterByLocale
 let initialLanguageFilter: string | undefined = undefined
-const hasContentLanguage = contentLanguages.find(
-  ({ code }) => code === currentLocale,
-)
+const hasContentLanguage = languages.find(({ id }) => id === currentLocale)
 if (
   filterByLocale &&
   currentLocale &&

package/src/pages/search-page/components/SearchFilter.tsx

@@ -1,6 +1,6 @@
+import { SearchIcon } from "lucide-react"
 import { useRef } from "react"
 
-import Icon from "../../../components/Icon"
 import { createI18n, type I18nConfig } from "../../../i18n/react/i18n-context"
 import { useDebounce } from "../hooks/use-debounce"
 import { useSearchQueryParam } from "../hooks/use-search-query-param"
@@ -57,7 +57,7 @@ export default function SearchFilter({
           onInput={(e) => debouncedSetSearch(e.currentTarget.value)}
           onKeyDown={(e) => e.key === "Enter" && searchInput.current?.blur()}
         />
-        <Icon className="text-xl mdi--magnify" ariaLabel="" />
+        <SearchIcon className="shrink-0 text-gray-700" />
       </label>
       <div className="mb-8 grid grid-cols-1 gap-2 sm:grid-cols-3 sm:gap-6 md:mb-10">
         {languageFilterEnabled && (

package/src/pages/search-page/components/SearchList.astro

@@ -2,15 +2,15 @@
 import { getCollection } from "astro:content"
 
 import { getUsedCategories } from "../../../content/get-categories"
-import { contentLanguages } from "../../../content/get-languages"
+import { getUsedLanguages } from "../../../content/get-languages"
 import { getMediaTypes } from "../../../content/get-media-types"
 import { prepareI18nConfig } from "../../../i18n/react/prepare-i18n-config"
 import SearchListReact from "./SearchList.tsx"
 
-const { t, currentLocale } = Astro.locals.i18n
+const { currentLocale, tMap } = Astro.locals.i18n
 
 const categories: Record<string, string> = {}
-for (const { id, labelText } of await getUsedCategories(currentLocale, t)) {
+for (const { id, labelText } of await getUsedCategories(currentLocale, tMap)) {
   categories[id] = labelText
 }
 
@@ -18,23 +18,26 @@ const mediaTypes = Object.fromEntries(
   (await getMediaTypes()).map((type) => [
     type.id,
     {
-      labelText: t(type.data.label),
+      labelText: tMap(type.data.label, {
+        path: ["media-types", type.id, "label"],
+      }),
       icon: type.data.icon,
       coverImageStyle: type.data.coverImageStyle,
     },
   ]),
 )
 
+const contentLanguagesList = await getUsedLanguages(currentLocale, tMap)
 const languages = Object.fromEntries(
-  contentLanguages.map((language) => [
+  contentLanguagesList.map((language) => [
     language.code,
-    { direction: language.direction, labelText: t(language.label) },
+    { direction: language.direction, labelText: language.labelText },
   ]),
 )
 
 const mediaItemsTotal = (await getCollection("media")).length
 
-const showLanguage = contentLanguages.length > 1
+const showLanguage = contentLanguagesList.length > 1
 
 const i18nConfig = prepareI18nConfig(Astro.locals.i18n, [
   "ln.search.no-results",

package/src/pages/search-page/components/SearchListItem.tsx

@@ -1,3 +1,5 @@
+import { ChevronRightIcon } from "lucide-react"
+
 import CoverImageDecorator from "../../../components/CoverImageDecorator"
 import Icon from "../../../components/Icon"
 import { useI18n } from "../../../i18n/react/use-i18n"
@@ -32,6 +34,7 @@ export default function SearchListItem({
 }: Props) {
   const { currentLocale, direction } = useI18n()
   const coverImageStyle = mediaTypes[item.type].coverImageStyle
+  const iconDirectionClass = direction === "rtl" ? "scale-x-[-1]" : ""
   return (
     <a
       href={detailsPagePath(currentLocale, {
@@ -98,10 +101,8 @@ export default function SearchListItem({
           </p>
         </div>
       </div>
-      <Icon
-        className="my-auto me-4 ms-2 hidden shrink-0 text-2xl text-gray-300 mdi--chevron-right sm:block md:group-hover:text-primary"
-        flipIcon={direction === "rtl"}
-        ariaLabel=""
+      <ChevronRightIcon
+        className={`my-auto me-4 ms-2 hidden shrink-0 text-gray-300 sm:block md:group-hover:text-primary ${iconDirectionClass}`}
       />
     </a>
   )

package/src/pages/search-page/hooks/use-search.ts

@@ -1,6 +1,7 @@
 import Fuse from "fuse.js"
 import { useEffect, useMemo, useRef, useState } from "react"
 
+import { pathWithBase } from "../../../utils/paths"
 import type { SearchItem, SearchResponse } from "../api/search-response"
 import { observeSearchQuery, type SearchQuery } from "../utils/search-query"
 
@@ -10,6 +11,8 @@ interface Context {
   languages: Record<string, { labelText: string }>
 }
 
+const SEARCH_API_PATH = pathWithBase("/api/internal/search.json")
+
 export function useSearch({ categories, mediaTypes, languages }: Context) {
   const fuse = useRef<Fuse<SearchItem>>(undefined)
   const [allItems, setAllItems] = useState<SearchItem[]>([])
@@ -28,10 +31,10 @@ export function useSearch({ categories, mediaTypes, languages }: Context) {
     })
     const fetchData = async () => {
       try {
-        const response = await fetch("/api/internal/search.json")
+        const response = await fetch(SEARCH_API_PATH)
         if (!response.ok) {
           throw new Error(
-            "Was not able to load search results from /api/internal/search.json.",
+            `Was not able to load search results from ${SEARCH_API_PATH}.`,
           )
         }
         const { items }: SearchResponse = await response.json()

package/src/utils/lazy.ts

@@ -0,0 +1,20 @@
+/**
+ * Creates a lazily initialized value and caches the computed result after the
+ * first access.
+ *
+ * @param compute Function that produces the value when `get()` is called for
+ * the first time.
+ * @returns An object with a `get()` method that returns the cached value.
+ */
+export const lazy = <TReturn>(compute: () => TReturn) => {
+  let initialized = false
+  let value: TReturn
+  const get = () => {
+    if (!initialized) {
+      value = compute()
+      initialized = true
+    }
+    return value
+  }
+  return { get }
+}

package/src/utils/paths.ts

@@ -1,3 +1,38 @@
+/**
+ * Prefix a site-internal path with Astro's configured base path.
+ *
+ * This helper trims any trailing slash from `BASE_URL`, ensures the input
+ * path starts with a leading slash, and concatenates the two values.
+ * Absolute URLs are out of scope for this helper.
+ *
+ * @param path internal path such as "/en/media", "/api/internal/search.json", or "/"
+ * @returns base-aware internal path
+ */
+export function pathWithBase(path: string) {
+  const normalizedBase = import.meta.env.BASE_URL.replace(/\/+$/, "")
+  const normalizedPath = path.startsWith("/") ? path : `/${path}`
+  return `${normalizedBase}${normalizedPath}`
+}
+
+/**
+ * Remove Astro's configured base path from a pathname when present.
+ *
+ * @param pathname pathname such as "/docs/en/media" or "/en/media"
+ * @param base Astro base path. Defaults to `import.meta.env.BASE_URL`.
+ * @returns pathname without the base prefix
+ */
+export function pathWithoutBase(
+  pathname: string,
+  base = import.meta.env.BASE_URL,
+) {
+  const normalizedBase = base !== "/" ? base.replace(/\/+$/, "") : ""
+
+  return normalizedBase &&
+    (pathname === normalizedBase || pathname.startsWith(`${normalizedBase}/`))
+    ? pathname.slice(normalizedBase.length) || "/"
+    : pathname
+}
+
 /**
  * Build path to media item page.
  *
@@ -9,7 +44,7 @@ export function detailsPagePath(
   locale: string | undefined,
   { id }: { id: string },
 ) {
-  return `/${locale}/media/${id}`
+  return pathWithBase(`/${locale}/media/${id}`)
 }
 
 /**
@@ -42,7 +77,7 @@ export function searchPagePath(
     searchParams.append("type", filter.type)
   }
   const query = searchParams.size ? `?${searchParams.toString()}` : ""
-  return `/${locale}/media${query}`
+  return pathWithBase(`/${locale}/media${query}`)
 }
 
 /**
@@ -56,5 +91,7 @@ export function searchPagePath(
  * @returns resolved path. Eg. '/en/about' for input "en" and "/about"
  */
 export function localizePath(locale: string | undefined, path: string) {
-  return `${locale ? `/${locale}` : ""}/${path.replace(/^\//, "")}`
+  return pathWithBase(
+    `${locale ? `/${locale}` : ""}/${path.replace(/^\//, "")}`,
+  )
 }

package/src/utils/urls.ts

@@ -1,5 +1,4 @@
 import config from "virtual:lightnet/config"
-import projectContext from "virtual:lightnet/project-context"
 
 /**
  * Test if a given url is outside this site.
@@ -21,7 +20,7 @@ export function isExternalUrl(url: string) {
   if (config.internalDomains.includes(parsedUrl.hostname)) {
     return false
   }
-  const { site } = projectContext
+  const { SITE: site } = import.meta.env
   if (!site) {
     return true
   }

package/src/utils/verify-schema.ts

@@ -8,10 +8,11 @@ export async function verifySchemaAsync<T extends z.Schema>(
   hint: string | ((id: string | undefined) => string),
 ): Promise<z.output<T>> {
   const parsed = await schema.safeParseAsync(toVerify)
-  if (!parsed.success) {
-    throwParseError(toVerify, errorMessage, hint, parsed)
+  if (parsed.success) {
+    return parsed.data
   }
-  return parsed.data
+
+  throwParseError(toVerify, errorMessage, hint, parsed)
 }
 
 export function verifySchema<T extends z.Schema>(
@@ -21,24 +22,25 @@ export function verifySchema<T extends z.Schema>(
   hint: string | ((id: string | undefined) => string),
 ): z.output<T> {
   const parsed = schema.safeParse(toVerify, {})
-  if (!parsed.success) {
-    throwParseError(toVerify, errorMessage, hint, parsed)
+  if (parsed.success) {
+    return parsed.data
   }
-  return parsed.data
+
+  throwParseError(toVerify, errorMessage, hint, parsed)
 }
 
 function throwParseError(
   toVerify: unknown,
   errorMessage: string | ((id: string | undefined) => string),
   hint: string | ((id: string | undefined) => string),
-  parsed: z.SafeParseError<unknown>,
-) {
+  parsed: z.ZodSafeParseError<unknown>,
+): never {
   const id = z.object({ id: z.string() }).safeParse(toVerify).data?.id
   const message =
     typeof errorMessage === "string" ? errorMessage : errorMessage(id)
   const hintFinal = typeof hint === "string" ? hint : hint(id)
-  const issues = parsed.error.errors
-    .map((e) => `- ${e.path.join(".")}: ${e.message}`)
+  const issues = parsed.error.issues
+    .map((issue) => `- ${issue.path.join(".")}: ${issue.message}`)
     .join("\n")
   throw new AstroError(message, `${hintFinal}\n\n${issues}`)
 }

package/tailwind.config.ts

@@ -1,6 +1,5 @@
 import { addIconSelectors } from "@iconify/tailwind"
 import typography from "@tailwindcss/typography"
-import daisyui from "daisyui"
 import type { Config } from "tailwindcss"
 
 const DEFAULT_COLOR_PRIMARY = "#E6B15C"
@@ -27,30 +26,7 @@ export function lightnetStyles({
         },
       },
     },
-    daisyui: {
-      themes: [
-        {
-          lightnet: {
-            primary,
-            secondary: primary,
-            accent: primary,
-            neutral: "#030712",
-            error: "#9f1239",
-            "base-100": "#f9fafb",
-
-            "--rounded-box": "0.375rem", // border radius rounded-box utility class, used in card and other large boxes
-            "--rounded-btn": "0.375rem", // border radius rounded-btn utility class, used in buttons and similar element
-            "--rounded-badge": "0.375rem", // border radius rounded-badge utility class, used in badges and similar
-            "--tab-radius": "0.375rem", // border radius of tabs
-          },
-        },
-      ],
-      base: false, // applies background color and foreground color for root element by default
-      utils: true, // adds responsive and modifier utility classes
-      logs: false, // Shows info about daisyUI version and used config in the console when building your CSS
-      prefix: "dy-",
-    },
-    plugins: [typography, daisyui, addIconSelectors(["mdi"])],
+    plugins: [typography, addIconSelectors(["mdi", "lucide"])],
   }
 }
 

package/vitest.config.js

@@ -9,9 +9,25 @@ export default defineConfig({
   plugins: [
     vitePluginLightnetConfig(
       {
-        title: "Sk8 Ministries",
+        title: { en: "Sk8 Ministries" },
         logo: { src: "./logo.svg" },
-        languages: [{ code: "en", label: "English" }],
+        languages: [
+          {
+            code: "en",
+            label: { en: "English" },
+            isDefaultSiteLanguage: true,
+            isSiteLanguage: true,
+            fallbackLanguages: [],
+          },
+          {
+            code: "de",
+            label: { en: "German" },
+            isSiteLanguage: true,
+            fallbackLanguages: ["en"],
+          },
+        ],
+        locales: ["en", "de"],
+        defaultLocale: "en",
         internalDomains: [],
       },
       { site: "https://sk8-ministries.dev" },

package/src/astro-integration/project-context.ts

@@ -1,5 +0,0 @@
-export type ProjectContext = {
-  root: URL
-  srcDir: URL
-  site?: string
-}

package/src/content/compare-media-collection-items.ts

@@ -1,24 +0,0 @@
-import type { MediaItemEntry } from "./content-schema"
-
-export function compareMediaCollectionItems(
-  item1: MediaItemEntry,
-  item2: MediaItemEntry,
-  collectionId: string,
-) {
-  const getIndex = (item: MediaItemEntry) =>
-    item.data.collections?.find(
-      ({ collection }) => collection.id === collectionId,
-    )?.index
-  const index1 = getIndex(item1)
-  const index2 = getIndex(item2)
-  if (index1 === index2) {
-    return item1.id.localeCompare(item2.id)
-  }
-  if (index1 === undefined && index2 !== undefined) {
-    return 1
-  }
-  if (index1 !== undefined && index2 === undefined) {
-    return -1
-  }
-  return index1! - index2!
-}

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

@@ -1,19 +0,0 @@
-import { AstroError } from "astro/errors"
-
-export const resolveDefaultLocale = ({
-  languages,
-}: {
-  languages: {
-    code: string
-    isDefaultSiteLanguage?: boolean
-  }[]
-}) => {
-  const defaultLanguage = languages.find((l) => l.isDefaultSiteLanguage)
-  if (!defaultLanguage) {
-    throw new AstroError(
-      "No default site language set",
-      "To fix the issue, set isDefaultSiteLanguage for one language in the LightNet configuration in your astro.config.mjs file.",
-    )
-  }
-  return defaultLanguage.code
-}

package/src/i18n/resolve-locales.ts

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

package/src/pages/details-page/utils/get-collection-items.ts

@@ -1,29 +0,0 @@
-import { compareMediaCollectionItems } from "../../../content/compare-media-collection-items"
-import type { MediaItemEntry } from "../../../content/content-schema"
-import { getMediaItems } from "../../../content/get-media-items"
-
-const groupItemsByCollections = async () => {
-  const items = await getMediaItems()
-  items.forEach((item) => {
-    item.data.collections?.forEach(({ collection }) => {
-      if (!itemsByCollections.has(collection.id)) {
-        itemsByCollections.set(collection.id, [])
-      }
-      itemsByCollections.get(collection.id)?.push(item)
-    })
-  })
-  itemsByCollections.forEach((entries, collectionId) =>
-    entries.sort((a, b) => compareMediaCollectionItems(a, b, collectionId)),
-  )
-}
-
-let isInitialized = false
-const itemsByCollections = new Map<string, MediaItemEntry[]>()
-
-export const getCollectionItems = async (collectionId: string) => {
-  if (!isInitialized) {
-    isInitialized = true
-    await groupItemsByCollections()
-  }
-  return itemsByCollections.get(collectionId) ?? []
-}