once again change how blog-list is structured

libs/types/src/content/templates/blog-list.d.ts

@@ -1,6 +1,6 @@
 import type { DateRange } from '../dateRange'
 import type { EntryTagCollection } from '../entryTag'
-import type { EntryWithConfig, EntryWithContent } from './shared'
+import type { ListWithEntries } from './shared'
 
 /**
  * This describes aditional information about a blog entry
@@ -8,6 +8,9 @@ import type { EntryWithConfig, EntryWithContent } from './shared'
  * At minimum, the title should be specified.
  */
 export type BlogEntry = {
+  /**
+   * Specifies the date of the blog entry
+   */
   date?: DateRange | string | number
   /**[Supports Markdown]
    * Information to summarize an entry
@@ -21,18 +24,22 @@ export type BlogEntry = {
    * The title of the blog entry
    */
   title: string
+  /**
+   * Information regarding the thumbnail
+   */
   thumbnail?: {
+    /**
+     * Sets the inline-styles for the thumbnail
+     */
     style: CSSStyleDeclaration
   }
-}
-
-export type BlogEntries = { [key: string]:
-  & EntryWithContent
-  & EntryWithConfig<BlogEntry>
+  /**
+   * URL to the markdown document of the blog entry
+   */
+  url: string
 }
 
 export type BlogList = {
-  entries: BlogEntries
   tags?: EntryTagCollection
   removeFromView?: boolean
-}
+} & ListWithEntries<BlogEntry>

libs/types/src/content/templates/shared.d.ts

@@ -1,19 +1,33 @@
 /**
- * Denotes a listing entry that contains content,
- * which can be defined either directly in the list
- * or be defined in a separate file
+ * Defines entries that are already fetched or are embedded directly in the list.
+ * Stored in key-value format where the key is the id of the entry,
+ * and the value is the entry config itself
+ * (defined as `T` based on the type of the entries in the implemented list)
  */
-export type EntryWithContent = {
-  content?: string
-  contentUrl?: string
-}
+export type ListEntry<T> = { [key: string]: T }
 
 /**
- * Denotes a listing entry that contains config,
- * which can be defined either directly in the list
- * or be defined in a separate file
+ * Defines entries that are fetched from remote config files.
+ * Stored in key-value format where the key is the id of the entry,
+ * and the value is the url to the config file.
  */
-export type EntryWithConfig<T> = {
-  config?: T
-  configUrl?: string
+export type ListRemoteEntries<T> = { [key: string]: string }
+
+/**
+ * Defines a list-type template that has config entries defined by id.
+ * One of two must be defined: `entries` or `embeddedEntries`.
+ * Both can be defined and used simultaneously.
+ * Note that in the case of an `id` collision
+ * (i.e. both `entries` and `embeddedEntries` have an entry with the same id),
+ * the implemented behavior should pick the `embeddedEntry`
+ */
+export type ListWithEntries<T> = {
+  /**
+   * Entries that will be fetched from remote config files
+   */
+  entries?: ListRemoteEntries
+  /**
+   * Entries that are embedded directly in the list config
+   */
+  embeddedEntries?: ListEntry
 }

libs/types/src/index.d.ts

@@ -10,4 +10,5 @@ export * from './content/link'
 
 export * from './content/templates/blog-list'
 export * from './content/templates/gallery-list'
+export * from './content/templates/shared'
 export * from './content/templates/templateType'

projects/frontend/src/utilities/fetch.ts

@@ -1,11 +1,10 @@
 import DOMPurify from 'dompurify'
 import { marked } from 'marked'
 import yaml from 'js-yaml'
-
 import type {
-  EntryWithConfig,
-  EntryWithContent,
-} from '@goldenwere/mackenzii-types/src/content/templates/shared'
+  ListEntry,
+  ListWithEntries,
+} from '@goldenwere/mackenzii-types'
 
 /**
  * Config used for DOMPurify.
@@ -129,33 +128,57 @@ export const fetchAndParseMarkdown = async (path: string) => {
 }
 
 /**
- * Fetches content for an entry
- * @param entry the entry whose content should be fetched
- * @returns the markdown content for the entry
+ * Fetches all the entry configs from a given list
+ * @param list the list to fetch configs from
+ * @returns the resolved configs
  */
-export const fetchContent = async (entry: EntryWithContent) => {
-  if (!!entry.content) {
-    return entry.content
-  } else if (!!entry.contentUrl) {
-    return fetchAndParseMarkdown(entry.contentUrl)
-  }
+export const fetchConfigsFromList = async <T>(list: ListWithEntries<T>): Promise<{
+  ids: string[]
+  entries: ListEntry<T>
+}> => {
+  return new Promise(async (resolve, reject) => {
+    let ids: string[] = []
+    let entries: ListEntry<T> = {}
+    if (!!list.entries) {
+      ids = ids.concat(Object.keys(list.entries))
+      const allEntries = await Promise.all(ids.map(async id => ({
+        entry: await fetchAndParseYaml<T>(list.entries[id]),
+        id,
+      })))
+      allEntries.forEach((entry) => {
+        entries[entry.id] = entry.entry
+      })
+    }
+    if (!!list.embeddedEntries) {
+      ids = ids.concat(Object.keys(list.embeddedEntries))
+      entries = {
+        ...entries,
+        ...list.embeddedEntries,
+      }
+    }
 
-  return ''
+    resolve({
+      entries,
+      ids,
+    })
+  })
 }
 
 /**
- * Fetches config for an entry
- * @param entry the entry whose config should be fetched
- * @returns the config object for the entry
+ * Fetches the config for a given id from the given list
+ * @param list the list to query from
+ * @param id the id to query for
+ * @returns the resolved config
  */
-export const fetchConfig = async <T>(entry: EntryWithConfig<T>) => {
-  if (!!entry.config) {
-    return entry.config as T
-  } else if (!!entry.configUrl) {
-    return fetchAndParseYaml(entry.configUrl) as T
-  }
-
-  return {} as T
+export const fetchConfigByIdFromList = async <T>(list: ListWithEntries<T>, id: string): Promise<T> => {
+  return new Promise(async (resolve, reject) => {
+    if (!!list.embeddedEntries && list.embeddedEntries[id]) {
+      resolve(list.embeddedEntries[id])
+    } else if (!!list.entries && list.entries[id]) {
+      const config = await fetchAndParseYaml<T>(list.entries[id])
+      resolve(config)
+    }
+  })
 }
 
 /**

projects/frontend/src/views/blog/blog-list.vue

@@ -6,7 +6,7 @@ import type {
   BlogListDefinition,
 } from '@goldenwere/mackenzii-types'
 
-import { fetchAndParseYaml, fetchConfig } from 'src/utilities/fetch'
+import { fetchAndParseYaml, fetchConfigsFromList } from 'src/utilities/fetch'
 import { getCurrentRoute } from 'src/utilities/vuetils'
 import { useRouteStore } from 'src/routes'
 
@@ -51,12 +51,11 @@ const viewPath = computed(() => `${currentRoute.path}/view`)
 }
 
 onMounted(async () => {
-  config.value = await fetchAndParseYaml<BlogList>(routeConfig.config)
-  entryIds.value = Object.keys(config.value.entries)
-  for (let i = 0; i < entryIds.value.length; ++i) {
-    const id = entryIds.value[i]
-    entries.value[id] = await fetchConfig(config.value.entries[id])
-  }
+  let listConfig = await fetchAndParseYaml<BlogList>(routeConfig.config)
+  const list = await fetchConfigsFromList<BlogEntry>(listConfig)
+  config.value = listConfig
+  entryIds.value = list.ids
+  entries.value = list.entries
   document.title = routeConfig.fullTitle
   ready.value = true
 })

projects/frontend/src/views/blog/blog-view.vue

@@ -7,7 +7,7 @@ import type {
   RoutedWindow,
 } from '@goldenwere/mackenzii-types'
 
-import { fetchAndParseYaml, fetchConfig, fetchContent } from 'src/utilities/fetch'
+import { fetchAndParseMarkdown, fetchAndParseYaml, fetchConfigByIdFromList } from 'src/utilities/fetch'
 import { getCurrentRoute } from 'src/utilities/vuetils'
 import { useRouteStore } from 'src/routes'
 
@@ -29,8 +29,8 @@ const routeSubConfig = routeStore._routes[currentRoute.path]
 
 onMounted(async () => {
   const config = await fetchAndParseYaml<BlogList>(routeConfig.config)
-  info.value = await fetchConfig(config.entries[currentRoute.query.id as string])
-  const md = await fetchContent(config.entries[currentRoute.query.id as string])
+  info.value = await fetchConfigByIdFromList(config, currentRoute.query.id as string)
+  const md = await fetchAndParseMarkdown(info.value.url)
   content.value = md
   document.title = routeSubConfig.fullTitle?.replace('$ENTRY', info.value.title)
   routeStore.setBreadcrumbs(currentRoute, info.value.title)