@setzkasten-cms/astro-admin 1.4.2 → 1.5.0

package/src/init/__tests__/patcher-mixed-content-wrapper.test.ts

@@ -17,7 +17,7 @@
  * and accepts arbitrary HTML children (including `<p>`).
  */
 
-import { describe, it, expect } from 'vitest'
+import { describe, expect, it } from 'vitest'
 import { patchTemplateForFields } from '../../init/template-patcher-v2'
 import type { PatchField } from '../../init/template-patcher-v2'
 
@@ -53,15 +53,21 @@ describe('patchMixedContentField — phrasing wrapper conversion', () => {
   ]
 
   it('converts a <p> mixed-content wrapper to <div> so RTE-injected <p> children remain valid', async () => {
-    const patched = await patchTemplateForFields(IMPRESSUM_SECTION, '_page_impressum', fields, [], { mode: 'page' })
+    const patched = await patchTemplateForFields(IMPRESSUM_SECTION, '_page_impressum', fields, [], {
+      mode: 'page',
+    })
 
     // The patched description binding must NOT live on a <p> element —
     // otherwise an RTE-edited value of "<p>…</p>" produces nested <p>'s.
     expect(patched).not.toMatch(/<p[^>]*data-sk-field="_page_impressum\.description"/)
 
     // Instead, the wrapper should be a <div> that retains the original classes.
-    expect(patched).toMatch(/<div[^>]*class="text-sk-slate leading-relaxed"[^>]*data-sk-field="_page_impressum\.description"/)
-    expect(patched).toMatch(/data-sk-field="_page_impressum\.description"[^>]*set:html=\{skData\?\.description/)
+    expect(patched).toMatch(
+      /<div[^>]*class="text-sk-slate leading-relaxed"[^>]*data-sk-field="_page_impressum\.description"/,
+    )
+    expect(patched).toMatch(
+      /data-sk-field="_page_impressum\.description"[^>]*set:html=\{skData\?\.description/,
+    )
 
     // The closing tag must match (no </p> for this binding's wrapper).
     // A simple sanity check: the <div ... data-sk-field="…description"> must be followed by </div>.
@@ -77,12 +83,16 @@ describe('patchMixedContentField — phrasing wrapper conversion', () => {
     // Headings rarely host RTE content but must remain semantically intact.
     // patchTextField (not patchMixedContentField) handles plain text headings,
     // so the <h2> should keep its tag name.
-    const patched = await patchTemplateForFields(IMPRESSUM_SECTION, '_page_impressum', fields, [], { mode: 'page' })
+    const patched = await patchTemplateForFields(IMPRESSUM_SECTION, '_page_impressum', fields, [], {
+      mode: 'page',
+    })
     expect(patched).toMatch(/<h2[^>]*data-sk-field="_page_impressum\.heading2"/)
   })
 
   it('keeps the original <p> classes on the converted <div> wrapper', async () => {
-    const patched = await patchTemplateForFields(IMPRESSUM_SECTION, '_page_impressum', fields, [], { mode: 'page' })
+    const patched = await patchTemplateForFields(IMPRESSUM_SECTION, '_page_impressum', fields, [], {
+      mode: 'page',
+    })
     // The Tailwind classes from the original <p class="text-sk-slate leading-relaxed">
     // must be preserved on the new <div>.
     expect(patched).toContain('text-sk-slate leading-relaxed')

package/src/init/__tests__/patcher-page-mode.test.ts

@@ -9,7 +9,7 @@
  *   5. removeOldVarDeclarations causes TDZ (alias placed before skData declaration)
  */
 
-import { describe, it, expect } from 'vitest'
+import { describe, expect, it } from 'vitest'
 import { patchTemplateForFields } from '../../init/template-patcher-v2'
 import type { PatchField } from '../../init/template-patcher-v2'
 
@@ -60,14 +60,22 @@ import BaseLayout from '../layouts/BaseLayout.astro';
 `
 
   const fields: PatchField[] = [
-    { key: 'items', type: 'array', defaultValue: [
-      { name: '@setzkasten-cms/core', desc: 'Schema, Feldtypen, Validation' },
-      { name: '@setzkasten-cms/ui', desc: 'React-UI: Provider, FormStore' },
-    ]},
-    { key: 'items2', type: 'array', defaultValue: [
-      { title: 'Dependency Inversion', desc: 'UI haengt nur von Ports ab' },
-      { title: 'Schema-First', desc: 'Alles leitet sich vom TypeScript-Schema ab' },
-    ]},
+    {
+      key: 'items',
+      type: 'array',
+      defaultValue: [
+        { name: '@setzkasten-cms/core', desc: 'Schema, Feldtypen, Validation' },
+        { name: '@setzkasten-cms/ui', desc: 'React-UI: Provider, FormStore' },
+      ],
+    },
+    {
+      key: 'items2',
+      type: 'array',
+      defaultValue: [
+        { title: 'Dependency Inversion', desc: 'UI haengt nur von Ports ab' },
+        { title: 'Schema-First', desc: 'Alles leitet sich vom TypeScript-Schema ab' },
+      ],
+    },
   ]
 
   it('should reference skData?.items for the first array', async () => {
@@ -111,9 +119,7 @@ import BaseLayout from '../layouts/BaseLayout.astro';
 </BaseLayout>
 `
 
-  const fields: PatchField[] = [
-    { key: 'heading', type: 'text', defaultValue: 'Titel' },
-  ]
+  const fields: PatchField[] = [{ key: 'heading', type: 'text', defaultValue: 'Titel' }]
 
   it('should add id="section-_page_test" to the <section> element', async () => {
     const patched = await patchTemplateForFields(source, '_page_test', fields, [], { mode: 'page' })
@@ -147,9 +153,7 @@ import BaseLayout from '../layouts/BaseLayout.astro';
 </BaseLayout>
 `
 
-  const fields: PatchField[] = [
-    { key: 'heading', type: 'text', defaultValue: 'Architektur' },
-  ]
+  const fields: PatchField[] = [{ key: 'heading', type: 'text', defaultValue: 'Architektur' }]
 
   it('should add data-sk-field to the <h1> element', async () => {
     const patched = await patchTemplateForFields(source, '_page_test', fields, [], { mode: 'page' })
@@ -203,7 +207,7 @@ const fields = ['Alpha', 'Beta', 'Gamma'];
     const fmMatch = patched.match(/^---\n([\s\S]*?)\n---/)
     const frontmatter = fmMatch ? fmMatch[1]! : patched
 
-    const lines = frontmatter.split('\n').map(l => l.trim())
+    const lines = frontmatter.split('\n').map((l) => l.trim())
     expect(lines).not.toContain(';')
   })
 })
@@ -239,7 +243,9 @@ const fields = ['Alpha', 'Beta', 'Gamma'];
   ]
 
   it('should place the fields alias AFTER the skData declaration', async () => {
-    const patched = await patchTemplateForFields(source, '_page_test', patchFields, [], { mode: 'page' })
+    const patched = await patchTemplateForFields(source, '_page_test', patchFields, [], {
+      mode: 'page',
+    })
 
     const fmMatch = patched.match(/^---\n([\s\S]*?)\n---/)
     const frontmatter = fmMatch ? fmMatch[1]! : patched
@@ -253,17 +259,21 @@ const fields = ['Alpha', 'Beta', 'Gamma'];
   })
 
   it('should not contain a stray semicolon line in frontmatter', async () => {
-    const patched = await patchTemplateForFields(source, '_page_test', patchFields, [], { mode: 'page' })
+    const patched = await patchTemplateForFields(source, '_page_test', patchFields, [], {
+      mode: 'page',
+    })
 
     const fmMatch = patched.match(/^---\n([\s\S]*?)\n---/)
     const frontmatter = fmMatch ? fmMatch[1]! : patched
 
-    const lines = frontmatter.split('\n').map(l => l.trim())
+    const lines = frontmatter.split('\n').map((l) => l.trim())
     expect(lines).not.toContain(';')
   })
 
   it('should preserve fields.length in the template', async () => {
-    const patched = await patchTemplateForFields(source, '_page_test', patchFields, [], { mode: 'page' })
+    const patched = await patchTemplateForFields(source, '_page_test', patchFields, [], {
+      mode: 'page',
+    })
 
     // Extract template (after closing ---)
     const templatePart = patched.split('\n---\n').slice(1).join('\n---\n')

package/src/init/__tests__/section-pipeline.test.ts

@@ -12,9 +12,9 @@
  *   - Stale frontmatter var cleanup
  */
 
-import { describe, it, expect, beforeAll } from 'vitest'
 import { readFileSync, readdirSync } from 'fs'
-import { join, basename } from 'path'
+import { basename, join } from 'path'
+import { beforeAll, describe, expect, it } from 'vitest'
 import { analyzeAstroSection } from '../../init/astro-section-analyzer-v2'
 import { patchTemplateForFields } from '../../init/template-patcher-v2'
 
@@ -23,7 +23,9 @@ import { patchTemplateForFields } from '../../init/template-patcher-v2'
 // ---------------------------------------------------------------------------
 
 const SECTIONS_DIR = join(import.meta.dirname!, '..', '..', '..', '..', '..', 'test-sections')
-const files = readdirSync(SECTIONS_DIR).filter(f => f.endsWith('.astro')).sort()
+const files = readdirSync(SECTIONS_DIR)
+  .filter((f) => f.endsWith('.astro'))
+  .sort()
 
 // ---------------------------------------------------------------------------
 // Helpers (ported from test-sections-runner.mts)
@@ -40,12 +42,16 @@ function extractClassValues(src: string): string[] {
 function checkCssIntegrity(
   source: string,
   patched: string,
-  groups: Array<{ tag: string; instances: Array<{ start: number; end: number }>; fields?: Array<{ key: string; defaultValues?: unknown[] }> }>,
+  groups: Array<{
+    tag: string
+    instances: Array<{ start: number; end: number }>
+    fields?: Array<{ key: string; defaultValues?: unknown[] }>
+  }>,
 ): { ok: boolean; lost: string[] } {
   const lost: string[] = []
   const dynamicClassValues = new Set<string>()
   for (const g of groups) {
-    for (const f of (g.fields ?? [])) {
+    for (const f of g.fields ?? []) {
       if (f.key.startsWith('_class') && f.defaultValues) {
         for (const dv of f.defaultValues) {
           if (typeof dv === 'string') dynamicClassValues.add(dv)
@@ -102,6 +108,17 @@ function checkSkFieldBindings(
       }
       continue
     }
+    // Array fields from repeated component instances use fieldPrefix= instead of data-sk-field
+    // (Astro components don't forward unknown props to the DOM).
+    if (field.type === 'array' && (field as any).options?.sourceComponent) {
+      const fieldPrefixBinding = `${sectionKey}.${field.key}.\${_i}\``
+      if (patched.includes(fieldPrefixBinding)) {
+        found.push(`${sectionKey}.${field.key}.*`)
+      } else {
+        missing.push(`${sectionKey}.${field.key}`)
+      }
+      continue
+    }
     if (!fieldNeedsSkBinding(field)) {
       skipped.push(`${sectionKey}.${field.key} (${field.type})`)
       continue
@@ -122,9 +139,18 @@ function checkSkFieldBindings(
 
   for (const g of groups) {
     for (const innerField of g.fields) {
-      if (innerField.type === 'array') { skipped.push(`${sectionKey}.${g.fieldKey}.*.${innerField.key} (array)`); continue }
-      if (!fieldNeedsSkBinding(innerField)) { skipped.push(`${sectionKey}.${g.fieldKey}.*.${innerField.key} (${innerField.type})`); continue }
-      if (!patched.includes(`item.${innerField.key}`)) { skipped.push(`${sectionKey}.${g.fieldKey}.*.${innerField.key} (not replaced)`); continue }
+      if (innerField.type === 'array') {
+        skipped.push(`${sectionKey}.${g.fieldKey}.*.${innerField.key} (array)`)
+        continue
+      }
+      if (!fieldNeedsSkBinding(innerField)) {
+        skipped.push(`${sectionKey}.${g.fieldKey}.*.${innerField.key} (${innerField.type})`)
+        continue
+      }
+      if (!patched.includes(`item.${innerField.key}`)) {
+        skipped.push(`${sectionKey}.${g.fieldKey}.*.${innerField.key} (not replaced)`)
+        continue
+      }
       const innerBinding = `${sectionKey}.${g.fieldKey}.\${_i}.${innerField.key}`
       if (patched.includes(innerBinding)) {
         found.push(`${sectionKey}.${g.fieldKey}.*.${innerField.key}`)
@@ -162,7 +188,13 @@ describe('Section Pipeline', () => {
         const getSectionMatch = isPageMode ? source.match(/getSection\(['"]([^'"]+)['"]\)/) : null
         sectionKey = getSectionMatch?.[1] ?? filenameKey
         const options = isPageMode ? { mode: 'page' as const } : undefined
-        section = await analyzeAstroSection(source, sectionKey, name, `src/components/sections/${file}`, options)
+        section = await analyzeAstroSection(
+          source,
+          sectionKey,
+          name,
+          `src/components/sections/${file}`,
+          options,
+        )
         groups = (section as any)._analyzerResult?.repeatedGroups ?? []
         patched = await patchTemplateForFields(source, sectionKey, section.fields, groups, options)
       })
@@ -206,10 +238,13 @@ describe('Section Pipeline', () => {
             }
           }
         }
-        const duplicateArrays = section.fields.filter((f: any) =>
-          f.type === 'array' && innerArraySources.has(f.key),
+        const duplicateArrays = section.fields.filter(
+          (f: any) => f.type === 'array' && innerArraySources.has(f.key),
         )
-        expect(duplicateArrays, `Duplicate arrays: ${duplicateArrays.map((f: any) => f.key).join(', ')}`).toHaveLength(0)
+        expect(
+          duplicateArrays,
+          `Duplicate arrays: ${duplicateArrays.map((f: any) => f.key).join(', ')}`,
+        ).toHaveLength(0)
       })
 
       it('should remove consumed frontmatter vars', () => {
@@ -256,7 +291,10 @@ describe('Section Pipeline', () => {
 
         for (const g of groups) {
           const arrayField = section.fields.find((f: any) => f.key === g.fieldKey)
-          if (!arrayField) { issues.push(`No top-level field for group ${g.fieldKey}`); continue }
+          if (!arrayField) {
+            issues.push(`No top-level field for group ${g.fieldKey}`)
+            continue
+          }
 
           const items = arrayField.defaultValue as Array<Record<string, unknown>> | undefined
           if (!Array.isArray(items) || items.length === 0) {
@@ -283,7 +321,7 @@ describe('Section Pipeline', () => {
           }
           for (const refKey of referencedKeys) {
             if (['map', 'length', 'filter', 'forEach', 'join', 'slice'].includes(refKey)) continue
-            const hasInAnyItem = items.some(item => refKey in item)
+            const hasInAnyItem = items.some((item) => refKey in item)
             if (!hasInAnyItem) {
               issues.push(`{item.${refKey}} used in template but missing in content JSON`)
             }
@@ -324,7 +362,9 @@ describe('Section Pipeline', () => {
               const origCount = originalClassCounts.get(val) ?? 0
               if (keys.length > origCount) {
                 const label = instIdx === 0 ? 'template' : `instance ${instIdx}`
-                issues.push(`${g.fieldKey} ${label}: "${val.slice(0, 40)}" assigned to [${keys.join(', ')}] but appears ${origCount}×`)
+                issues.push(
+                  `${g.fieldKey} ${label}: "${val.slice(0, 40)}" assigned to [${keys.join(', ')}] but appears ${origCount}×`,
+                )
               }
             }
           }
@@ -369,7 +409,9 @@ describe('Section Pipeline', () => {
               const actualTag = lastPart.replace(/:\d+$/, '') || g.tag
 
               if (actualTag !== expectedTag) {
-                issues.push(`${cf.key} instance ${instIdx}: expected <${expectedTag}> but on <${actualTag}>`)
+                issues.push(
+                  `${cf.key} instance ${instIdx}: expected <${expectedTag}> but on <${actualTag}>`,
+                )
               }
             }
           }
@@ -390,6 +432,50 @@ describe('Section Pipeline', () => {
         const bindings = checkSkFieldBindings(patched, sectionKey, section.fields, groups)
         expect(bindings.missing, `Missing bindings: ${bindings.missing.join(', ')}`).toHaveLength(0)
       })
+
+      it('should collapse repeated component instances into .map()', () => {
+        const componentArrayFields = section.fields.filter(
+          (f: any) => f.type === 'array' && f.options?.sourceComponent,
+        )
+        if (componentArrayFields.length === 0) return
+        for (const field of componentArrayFields) {
+          const compName = (field as any).options.sourceComponent as string
+          const tagRegex = new RegExp(`<${compName}[\\s/>]`, 'g')
+          const originalCount = (source.match(tagRegex) || []).length
+          const patchedCount = (patched.match(tagRegex) || []).length
+          expect(
+            patchedCount,
+            `<${compName}> count should be reduced (was ${originalCount}, still ${patchedCount})`,
+          ).toBeLessThan(originalCount)
+          expect(patched, `Expected .map( after collapsing <${compName}>`).toContain('.map(')
+        }
+      })
+
+      it('should remove stale frontmatter vars from repeated component props', () => {
+        const componentArrayFields = section.fields.filter(
+          (f: any) =>
+            f.type === 'array' && f.options?.sourceComponent && Array.isArray(f.defaultValue),
+        )
+        if (componentArrayFields.length === 0) return
+        const fmEnd = patched.indexOf('---', patched.indexOf('---') + 3)
+        const patchedFm = fmEnd > 0 ? patched.slice(0, fmEnd) : ''
+        const staleVars: string[] = []
+        for (const field of componentArrayFields) {
+          const items = (field as any).defaultValue as Array<Record<string, unknown>>
+          for (const innerField of ((field as any).options?.arrayItem?.fields ?? []) as Array<{
+            key: string
+          }>) {
+            // Only string-array props might have been declared as frontmatter vars
+            const allVarLike = items.every((item) => Array.isArray(item[innerField.key]))
+            if (!allVarLike) continue
+            const varNames = items.map((_, i) => `${innerField.key}${i === 0 ? '' : i + 1}`)
+            for (const v of varNames) {
+              if (patchedFm.includes(`const ${v}`)) staleVars.push(v)
+            }
+          }
+        }
+        expect(staleVars, `Stale frontmatter vars: ${staleVars.join(', ')}`).toHaveLength(0)
+      })
     })
   }
 })

package/src/init/astro-config-patcher.ts

@@ -21,11 +21,7 @@ export function patchAstroConfig(source: string): string | null {
   // Find the last import statement
   const lastImportIndex = findLastImportEnd(result)
   if (lastImportIndex >= 0) {
-    result =
-      result.slice(0, lastImportIndex) +
-      '\n' +
-      importLine +
-      result.slice(lastImportIndex)
+    result = result.slice(0, lastImportIndex) + '\n' + importLine + result.slice(lastImportIndex)
   } else {
     // No imports found — add at the very top
     result = importLine + '\n' + result
@@ -67,19 +63,11 @@ function addToIntegrations(source: string): string {
 
     // Check if array is empty
     if (after.startsWith(']')) {
-      return (
-        source.slice(0, insertPos) +
-        'setzkasten()' +
-        source.slice(insertPos)
-      )
+      return source.slice(0, insertPos) + 'setzkasten()' + source.slice(insertPos)
     }
 
     // Array has items — prepend
-    return (
-      source.slice(0, insertPos) +
-      '\n    setzkasten(),\n    ' +
-      source.slice(insertPos)
-    )
+    return source.slice(0, insertPos) + '\n    setzkasten(),\n    ' + source.slice(insertPos)
   }
 
   // Case 2: No integrations array — add it to defineConfig
@@ -87,9 +75,7 @@ function addToIntegrations(source: string): string {
   if (defineConfigMatch && defineConfigMatch.index !== undefined) {
     const insertPos = defineConfigMatch.index + defineConfigMatch[0].length
     return (
-      source.slice(0, insertPos) +
-      '\n  integrations: [setzkasten()],\n' +
-      source.slice(insertPos)
+      source.slice(0, insertPos) + '\n  integrations: [setzkasten()],\n' + source.slice(insertPos)
     )
   }
 

package/src/init/astro-detector.ts

@@ -47,9 +47,7 @@ export function findAstroPages(files: RepoFile[], projectRoot: string): AstroPag
 
     const name = relativePath.replace(/\.astro$/, '')
     const isIndex = name === 'index' || name.endsWith('/index')
-    const pageKey = isIndex
-      ? name === 'index' ? 'index' : name.replace(/\/index$/, '')
-      : name
+    const pageKey = isIndex ? (name === 'index' ? 'index' : name.replace(/\/index$/, '')) : name
 
     pages.push({
       filePath: file.path,
@@ -170,10 +168,7 @@ function resolveImportPath(
   // Handle alias imports like @/components/... or ~/components/...
   if (importPath.startsWith('@/') || importPath.startsWith('~/')) {
     const aliasPath = importPath.replace(/^[@~]\//, '')
-    const candidates = [
-      `${projectRoot}/src/${aliasPath}`,
-      `${projectRoot}/src/${aliasPath}.astro`,
-    ]
+    const candidates = [`${projectRoot}/src/${aliasPath}`, `${projectRoot}/src/${aliasPath}.astro`]
     for (const candidate of candidates) {
       if (allFiles.some((f) => f.path === candidate)) return candidate
     }