kmcom-nuxt-layers 2.2.12 → 2.3.0

package/layers/feeds/server/utils/content-adapter.ts

@@ -2,6 +2,7 @@ import { queryCollection } from '@nuxt/content/nitro'
 import type { H3Event } from 'h3'
 
 import type { FeedItem } from './types'
+import { resolveFeedAuthor, resolveFeedDate } from './feed-author'
 
 type FeedSourceAuthor = {
   name?: string | undefined
@@ -22,7 +23,7 @@ type FeedSourceItem = {
 }
 
 type FeedCollectionQuery = {
-  all(): Promise<FeedSourceItem[]>
+  all: () => Promise<FeedSourceItem[]>
 }
 
 const getFeedCollection = queryCollection as unknown as (
@@ -30,27 +31,6 @@ const getFeedCollection = queryCollection as unknown as (
   collection: string
 ) => FeedCollectionQuery
 
-function resolveFeedAuthor(item: FeedSourceItem): string | undefined {
-  const firstAuthor = item.authors?.[0]
-  if (typeof firstAuthor?.name === 'string' && firstAuthor.name.length > 0) {
-    return firstAuthor.name
-  }
-
-  if (typeof item.author === 'string' && item.author.length > 0) {
-    return item.author
-  }
-
-  if (item.author && typeof item.author === 'object' && typeof item.author.name === 'string') {
-    return item.author.name
-  }
-
-  return undefined
-}
-
-function resolveFeedDate(item: FeedSourceItem): Date {
-  return new Date(item.date ?? item.createdAt ?? Date.now())
-}
-
 export async function getContentFeedItems(
   event: H3Event,
   collection: string = 'blog',

package/layers/feeds/server/utils/feed-author.ts

@@ -0,0 +1,32 @@
+type FeedSourceAuthor = {
+  name?: string | undefined
+}
+
+type FeedSourceItem = {
+  author?: FeedSourceAuthor | string | undefined
+  authors?: FeedSourceAuthor[] | undefined
+}
+
+export function resolveFeedAuthor(item: FeedSourceItem): string | undefined {
+  const firstAuthor = item.authors?.[0]
+  if (typeof firstAuthor?.name === 'string' && firstAuthor.name.length > 0) {
+    return firstAuthor.name
+  }
+
+  if (typeof item.author === 'string' && item.author.length > 0) {
+    return item.author
+  }
+
+  if (item.author && typeof item.author === 'object' && typeof item.author.name === 'string') {
+    return item.author.name
+  }
+
+  return undefined
+}
+
+export function resolveFeedDate(item: {
+  date?: string | number | Date | undefined
+  createdAt?: string | number | Date | undefined
+}): Date {
+  return new Date(item.date ?? item.createdAt ?? Date.now())
+}

package/layers/feeds/server/utils/feed-config.ts

@@ -0,0 +1,88 @@
+import type { SiteConfig } from '#layers/core/app/types/site'
+
+import type { FeedConfig } from './types'
+
+type AppFeedConfig = {
+  site?: SiteConfig
+  feedsLayer?: {
+    feed?: {
+      limit?: number
+      defaultCollection?: string
+    }
+  }
+}
+
+type FeedLayerConfig = NonNullable<AppFeedConfig['feedsLayer']>['feed']
+
+function resolveFeedTitle(site: SiteConfig, collection: string | undefined) {
+  const collectionLabel = collection
+    ? ` — ${collection.charAt(0).toUpperCase() + collection.slice(1)}`
+    : ''
+
+  return `${site.title ?? 'My Site'}${collectionLabel}`
+}
+
+function resolveFeedAuthorName(author: SiteConfig['author']) {
+  const authorName = author?.name ?? ''
+  return authorName.length > 0 ? authorName : undefined
+}
+
+function resolveFeedAuthor(site: SiteConfig) {
+  const authorName = resolveFeedAuthorName(site.author)
+  return authorName
+    ? { name: authorName, email: site.author?.email, link: site.author?.link }
+    : undefined
+}
+
+function resolveFeedCopyright(site: SiteConfig) {
+  const authorName = resolveFeedAuthorName(site.author)
+  if (site.copyright) return site.copyright
+  if (!authorName) return undefined
+  return `Copyright ${new Date().getFullYear()} ${authorName}`
+}
+
+function resolveConfiguredFeedLimit(feedConfig: FeedLayerConfig) {
+  return feedConfig?.limit ?? 30
+}
+
+export function resolveFeedSiteConfig(appConfig: AppFeedConfig, requestUrl: URL) {
+  const site = appConfig.site ?? {}
+  const origin = `${requestUrl.protocol}//${requestUrl.host}`
+  return {
+    site,
+    siteUrl: (site.url as string | undefined)?.replace(/\/$/, '') || origin,
+  }
+}
+
+export function resolveFeedCollection(
+  feedConfig: FeedLayerConfig,
+  collection?: string
+) {
+  return collection ?? feedConfig?.defaultCollection ?? 'blog'
+}
+
+export function createFeedConfig(args: {
+  site: SiteConfig
+  siteUrl: string
+  collection: string | undefined
+}): FeedConfig {
+  const { site, siteUrl, collection } = args
+
+  return {
+    title: resolveFeedTitle(site, collection),
+    description: site.description ?? '',
+    siteUrl,
+    author: resolveFeedAuthor(site),
+    image: site.image || undefined,
+    favicon: site.favicon ?? '/favicon.ico',
+    copyright: resolveFeedCopyright(site),
+  }
+}
+
+export function resolveFeedLimit(
+  feedConfig: FeedLayerConfig,
+  options?: { unlimited?: boolean | undefined }
+) {
+  if (options?.unlimited) return Infinity
+  return resolveConfiguredFeedLimit(feedConfig)
+}

package/layers/feeds/server/utils/feed-service.ts

@@ -1,7 +1,12 @@
-import type { SiteConfig } from '#layers/core/app/types/site'
 import type { H3Event } from 'h3'
 
 import type { FeedConfig, FeedItem } from './types'
+import {
+  createFeedConfig,
+  resolveFeedCollection,
+  resolveFeedLimit,
+  resolveFeedSiteConfig,
+} from './feed-config'
 
 export async function buildFeed(
   event: H3Event,
@@ -9,37 +14,13 @@ export async function buildFeed(
   options?: { unlimited?: boolean }
 ): Promise<{ items: FeedItem[]; config: FeedConfig }> {
   const appConfig = useAppConfig()
-  const site: SiteConfig = (appConfig as { site?: SiteConfig }).site ?? {}
-  const feedConfig =
-    (appConfig as { feedsLayer?: { feed?: { limit?: number; defaultCollection?: string } } })
-      .feedsLayer?.feed ?? {}
-  const limit: number = options?.unlimited ? Infinity : (feedConfig.limit ?? 30)
-  const defaultCollection = feedConfig.defaultCollection ?? 'blog'
-
+  const feedConfig = appConfig.feedsLayer?.feed
   const requestUrl = getRequestURL(event)
-  const origin = `${requestUrl.protocol}//${requestUrl.host}`
-  const siteUrl = (site.url as string | undefined)?.replace(/\/$/, '') || origin
-
-  const authorName = site.author?.name ?? ''
-  const resolvedCollection = collection ?? defaultCollection
-  const collectionLabel = collection
-    ? ` — ${collection.charAt(0).toUpperCase() + collection.slice(1)}`
-    : ''
-
-  const config: FeedConfig = {
-    title: `${site.title ?? 'My Site'}${collectionLabel}`,
-    description: site.description ?? '',
-    siteUrl,
-    author: authorName
-      ? { name: authorName, email: site.author?.email, link: site.author?.link }
-      : undefined,
-    image: site.image || undefined,
-    favicon: site.favicon ?? '/favicon.ico',
-    copyright:
-      site.copyright ||
-      (authorName ? `Copyright ${new Date().getFullYear()} ${authorName}` : undefined),
-  }
+  const { site, siteUrl } = resolveFeedSiteConfig(appConfig, requestUrl)
+  const resolvedCollection = resolveFeedCollection(feedConfig, collection)
+  const limit = resolveFeedLimit(feedConfig, options)
 
+  const config = createFeedConfig({ site, siteUrl, collection })
   const items = await getContentFeedItems(event, resolvedCollection, limit)
 
   return { items, config }

package/layers/feeds/server/utils/feed-xml.ts

@@ -0,0 +1,26 @@
+import type { FeedConfig, FeedItem } from './types'
+
+export function resolveFeedItemId(siteUrl: string, item: FeedItem) {
+  return `${siteUrl}${item.id}`
+}
+
+export function resolveFeedItemLink(siteUrl: string, item: FeedItem) {
+  return `${siteUrl}${item.link}`
+}
+
+export function applyFeedStylesheet(xml: string) {
+  return xml.replace(
+    /<\?xml version="1\.0" encoding="utf-8"\?>/i,
+    '<?xml version="1.0" encoding="UTF-8"?>\n<?xml-stylesheet type="text/xsl" href="/feed/style.xsl"?>'
+  )
+}
+
+export function resolveFeedAuthorPayload(config: FeedConfig['author']) {
+  return config
+    ? {
+        name: config.name,
+        ...(config.email ? { email: config.email } : {}),
+        ...(config.link ? { link: config.link } : {}),
+      }
+    : undefined
+}

package/layers/feeds/server/utils/formats/rss.ts

@@ -1,16 +1,15 @@
 import { Feed } from 'feed'
 
 import type { FeedConfig, FeedItem } from '../types'
+import {
+  applyFeedStylesheet,
+  resolveFeedAuthorPayload,
+  resolveFeedItemId,
+  resolveFeedItemLink,
+} from '../feed-xml'
 
 export function toRSS(items: FeedItem[], config: FeedConfig): string {
-  const author = config.author
-    ? {
-        name: config.author.name,
-        ...(config.author.email ? { email: config.author.email } : {}),
-        ...(config.author.link ? { link: config.author.link } : {}),
-      }
-    : undefined
-
+  const author = resolveFeedAuthorPayload(config.author)
   const feed = new Feed({
     title: config.title,
     description: config.description,
@@ -26,17 +25,13 @@ export function toRSS(items: FeedItem[], config: FeedConfig): string {
   for (const item of items) {
     feed.addItem({
       title: item.title,
-      id: `${config.siteUrl}${item.id}`,
-      link: `${config.siteUrl}${item.link}`,
+      id: resolveFeedItemId(config.siteUrl, item),
+      link: resolveFeedItemLink(config.siteUrl, item),
       ...(item.description ? { description: item.description } : {}),
       date: item.date,
       ...(item.author ? { author: [{ name: item.author }] } : {}),
     })
   }
 
-  const raw = feed.rss2()
-  return raw.replace(
-    '<?xml version="1.0" encoding="UTF-8"?>',
-    '<?xml version="1.0" encoding="UTF-8"?>\n<?xml-stylesheet type="text/xsl" href="/feed/style.xsl"?>'
-  )
+  return applyFeedStylesheet(feed.rss2())
 }

package/layers/feeds/server/utils/formats.test.ts

@@ -0,0 +1,71 @@
+import { describe, expect, it } from 'vitest'
+
+import type { FeedConfig, FeedItem } from './types'
+import { toAtom } from './formats/atom'
+import { toJSONFeed } from './formats/json'
+import { toRSS } from './formats/rss'
+
+const config: FeedConfig = {
+  title: 'Nuxt Layers Feed',
+  description: 'Layered syndication output.',
+  siteUrl: 'https://example.com',
+  author: {
+    name: 'Kieran Mansfield',
+    link: 'https://example.com/about',
+  },
+  favicon: '/favicon.ico',
+}
+
+const items: FeedItem[] = [
+  {
+    title: 'A & B',
+    description: 'Read > write',
+    link: '/posts/a-b',
+    id: '/posts/a-b',
+    date: new Date('2026-01-03T10:00:00.000Z'),
+    author: 'Ada Lovelace',
+    tags: ['nuxt', 'feeds'],
+  },
+]
+
+describe('feed format serializers', () => {
+  it('serializes RSS output with the stylesheet and item data', () => {
+    const xml = toRSS(items, config)
+
+    expect(xml).toContain('<?xml-stylesheet type="text/xsl" href="/feed/style.xsl"?>')
+    expect(xml).toContain('<title>Nuxt Layers Feed</title>')
+    expect(xml).toContain('Ada Lovelace')
+    expect(xml).toContain('/posts/a-b')
+  })
+
+  it('serializes JSON Feed output as a structured object', () => {
+    expect(toJSONFeed(items, config)).toMatchObject({
+      version: 'https://jsonfeed.org/version/1.1',
+      title: 'Nuxt Layers Feed',
+      description: 'Layered syndication output.',
+      home_page_url: 'https://example.com',
+      feed_url: 'https://example.com/feed/json',
+      authors: [{ name: 'Kieran Mansfield', url: 'https://example.com/about' }],
+      items: [
+        {
+          id: 'https://example.com/posts/a-b',
+          url: 'https://example.com/posts/a-b',
+          title: 'A & B',
+          content_text: 'Read > write',
+          date_published: '2026-01-03T10:00:00.000Z',
+          authors: [{ name: 'Ada Lovelace' }],
+          tags: ['nuxt', 'feeds'],
+        },
+      ],
+    })
+  })
+
+  it('serializes Atom output with escaped markup', () => {
+    const xml = toAtom(items, config)
+
+    expect(xml).toContain('<?xml-stylesheet type="text/xsl" href="/feed/style.xsl"?>')
+    expect(xml).toContain('<title>Nuxt Layers Feed</title>')
+    expect(xml).toContain('<title>A &amp; B</title>')
+    expect(xml).toContain('<summary>Read &gt; write</summary>')
+  })
+})

package/layers/forms/app/components/Form/Field.vue

@@ -1,6 +1,12 @@
 <script setup lang="ts">
   import { fieldConfigs, type FieldType } from '../../config/fields'
   import type { FieldSize } from '../../types/fields'
+  import {
+    buildBaseInputProps,
+    buildFormFieldProps,
+    buildNumberInputProps,
+    buildTextInputProps,
+  } from '../../utils/fieldProps'
 
   const {
     type = 'text',
@@ -40,36 +46,6 @@
   const isTextarea = computed(() => config.value.component === 'UTextarea')
   const isNumber = computed(() => config.value.component === 'UInputNumber')
 
-  const formFieldProps = computed(() => ({
-    name,
-    required,
-    size,
-    ...(label !== undefined && { label }),
-    ...(className !== undefined && { class: className }),
-  }))
-
-  const baseInputProps = computed(() => ({
-    size,
-    ...(resolvedPlaceholder.value !== undefined && { placeholder: resolvedPlaceholder.value }),
-    ...(resolvedIcon.value !== undefined && { leadingIcon: resolvedIcon.value }),
-  }))
-
-  const numberInputProps = computed(() => ({
-    size,
-    ...(resolvedPlaceholder.value !== undefined && { placeholder: resolvedPlaceholder.value }),
-    ...(resolvedIcon.value !== undefined && { leadingIcon: resolvedIcon.value }),
-    ...(currencyOptions.value !== undefined && { formatOptions: currencyOptions.value }),
-  }))
-
-  const textInputProps = computed(() => ({
-    type: config.value.inputType,
-    size,
-    ...(config.value.inputMode !== undefined && { inputmode: config.value.inputMode }),
-    ...(config.value.autocomplete !== undefined && { autocomplete: config.value.autocomplete }),
-    ...(resolvedPlaceholder.value !== undefined && { placeholder: resolvedPlaceholder.value }),
-    ...(resolvedIcon.value !== undefined && { leadingIcon: resolvedIcon.value }),
-  }))
-
   const currencyOptions = computed((): Intl.NumberFormatOptions | undefined => {
     if (config.value.format === 'currency') {
       return {
@@ -79,6 +55,42 @@
     }
     return undefined
   })
+
+  const formFieldProps = computed(() =>
+    buildFormFieldProps({
+      name,
+      required,
+      size,
+      label,
+      className,
+    })
+  )
+
+  const baseInputProps = computed(() =>
+    buildBaseInputProps({
+      size,
+      placeholder: resolvedPlaceholder.value,
+      icon: resolvedIcon.value,
+    })
+  )
+
+  const numberInputProps = computed(() =>
+    buildNumberInputProps({
+      size,
+      placeholder: resolvedPlaceholder.value,
+      icon: resolvedIcon.value,
+      formatOptions: currencyOptions.value,
+    })
+  )
+
+  const textInputProps = computed(() =>
+    buildTextInputProps({
+      config: config.value,
+      size,
+      placeholder: resolvedPlaceholder.value,
+      icon: resolvedIcon.value,
+    })
+  )
 </script>
 
 <template>

package/layers/forms/app/utils/fieldProps.ts

@@ -0,0 +1,65 @@
+import type { FieldConfig } from '../types/fields'
+import type { FieldSize } from '../types/fields'
+
+export function buildFormFieldProps(args: {
+  name: string
+  required: boolean
+  size: FieldSize
+  label?: string | undefined
+  className?: string | undefined
+}) {
+  const { name, required, size, label, className } = args
+  return {
+    name,
+    required,
+    size,
+    ...(label !== undefined && { label }),
+    ...(className !== undefined && { class: className }),
+  }
+}
+
+export function buildBaseInputProps(args: {
+  size: FieldSize
+  placeholder?: string | undefined
+  icon?: string | undefined
+}) {
+  const { size, placeholder, icon } = args
+  return {
+    size,
+    ...(placeholder !== undefined && { placeholder }),
+    ...(icon !== undefined && { leadingIcon: icon }),
+  }
+}
+
+// fallow-ignore-next-line complexity
+export function buildTextInputProps(args: {
+  config: FieldConfig
+  size: FieldSize
+  placeholder?: string | undefined
+  icon?: string | undefined
+}) {
+  const { config, size, placeholder, icon } = args
+  return {
+    type: config.inputType,
+    size,
+    ...(config.inputMode !== undefined && { inputmode: config.inputMode }),
+    ...(config.autocomplete !== undefined && { autocomplete: config.autocomplete }),
+    ...(placeholder !== undefined && { placeholder }),
+    ...(icon !== undefined && { leadingIcon: icon }),
+  }
+}
+
+export function buildNumberInputProps(args: {
+  size: FieldSize
+  placeholder?: string | undefined
+  icon?: string | undefined
+  formatOptions?: Intl.NumberFormatOptions | undefined
+}) {
+  const { size, placeholder, icon, formatOptions } = args
+  return {
+    size,
+    ...(placeholder !== undefined && { placeholder }),
+    ...(icon !== undefined && { leadingIcon: icon }),
+    ...(formatOptions !== undefined && { formatOptions }),
+  }
+}