feat: small vite+template improvements

.changeset/olive-carrots-fetch.md

@@ -0,0 +1,5 @@
+---
+"@kopflos-labs/html-template": patch
+---
+
+By default, pass Core Representation of the page resource to template func

.changeset/rotten-cameras-check.md

@@ -0,0 +1,5 @@
+---
+"@kopflos-cms/core": patch
+---
+
+Added `env.kopflos.variables` to allow accessing and setting variables

.changeset/unlucky-suns-sniff.md

@@ -0,0 +1,5 @@
+---
+"@kopflos-cms/vite": patch
+---
+
+Serve the entire UI build statically. Before, `public` vite resources would not be accessible 

example/kopflos.config.ts

@@ -10,9 +10,6 @@ export default <KopflosConfig> {
       updateUrl: 'http://localhost:7878/update',
     },
   },
-  variables: {
-    uiRoot: 'ui',
-  },
   plugins: {
     '@kopflos-cms/plugin-deploy-resources': {
       paths: ['resources', 'resources.dev'],

example/package.json

@@ -7,7 +7,7 @@
     "build": "kopflos build",
     "start": "kopflos serve --mode development --trust-proxy",
     "prestart:prod": "npm run build",
-    "start:prod": "kopflos serve --trust-proxy --variable uiRoot=dist"
+    "start:prod": "kopflos serve --trust-proxy"
   },
   "dependencies": {
     "@kopflos-cms/vite": "0.0.1-beta.1",

example/resources/api/index.ttl

@@ -36,7 +36,7 @@ PREFIX kl: <https://kopflos.described.at/>
           [
             a code:EcmaScriptModule ;
             code:link <node:@kopflos-cms/serve-file#default> ;
-            code:arguments ( "${uiRoot}/${type}.html"^^code:EcmaScriptTemplateLiteral ) ;
+            code:arguments ( "${VITE.basePath}/${type}.html"^^code:EcmaScriptTemplateLiteral ) ;
           ]
           [
             a code:EcmaScriptModule ;

labs/html-template/index.ts

@@ -17,21 +17,19 @@ export interface TemplateDataFunc {
   (context: HandlerArgs): Promise<DatasetCore> | DatasetCore | Stream
 }
 
-export default function bindTemplate<A extends unknown[] = unknown[]>(evaluateTemplate: TemplateFunc, fetchData?: (...args: A) => TemplateDataFunc, ...args: A): Handler {
+export default function bindTemplate<A extends unknown[] = unknown[]>(evaluateTemplate: TemplateFunc, fetchData: (...args: A) => TemplateDataFunc = coreRepresentation, ...args: A): Handler {
   return async (context, response) => {
     if (typeof response?.body !== 'string') {
       return new Error('Template handler must be chained after another which returns a HTML response')
     }
 
     let dataset: DatasetCore | undefined
 
-    if (fetchData) {
-      const templateData = fetchData(...args)(context)
-      if ('then' in templateData || 'size' in templateData) {
-        dataset = await templateData
-      } else {
-        dataset = await context.env.dataset().import(templateData)
-      }
+    const templateData = fetchData(...args)(context)
+    if ('then' in templateData || 'size' in templateData) {
+      dataset = await templateData
+    } else {
+      dataset = await context.env.dataset().import(templateData)
     }
     const graph = context.env.clownface({ dataset })
 
@@ -45,3 +43,7 @@ export default function bindTemplate<A extends unknown[] = unknown[]>(evaluateTe
     }
   }
 }
+
+function coreRepresentation(): TemplateDataFunc {
+  return ({ subject }) => subject.dataset
+}

packages/core/lib/env/KopflosFactory.ts

@@ -3,15 +3,21 @@ import type { KopflosConfig } from '../Kopflos.js'
 export interface KopflosFactory {
   readonly kopflos: {
     readonly config: KopflosConfig
+    readonly variables: Record<string, unknown>
   }
 }
 
-export default (config: KopflosConfig) => class implements KopflosFactory {
-  get kopflos() {
-    return {
-      config: Object.freeze(config),
+export default (config: KopflosConfig) => {
+  const variables = config.variables || {}
+
+  return class implements KopflosFactory {
+    get kopflos() {
+      return {
+        config: Object.freeze(config),
+        variables,
+      }
     }
-  }
 
-  static exports = ['kopflos']
+    static exports = ['kopflos']
+  }
 }

packages/core/lib/handler.ts

@@ -54,7 +54,7 @@ export const loadHandlers: HandlerLookup = ({ resourceShape, ...rest }: Resource
     .out(env.ns.kopflos.handler)
     .filter(matchingMethod(env, method))
 
-  const vars = new Map(Object.entries(env.kopflos.config.variables || {}))
+  const vars = new Map(Object.entries(env.kopflos.variables))
   if ('subjectVariables' in rest) {
     for (const [k, v] of rest.subjectVariables) {
       vars.set(k, v)

packages/vite/index.ts

@@ -1,5 +1,5 @@
 import { resolve } from 'node:path'
-import type { KopflosPlugin } from '@kopflos-cms/core'
+import type { Kopflos, KopflosPlugin } from '@kopflos-cms/core'
 import express from 'express'
 import { build } from 'vite'
 import { createViteServer } from './lib/server.js'
@@ -22,17 +22,26 @@ declare module '@kopflos-cms/core' {
 }
 
 export default function ({ outDir = 'dist', ...options }: Options): KopflosPlugin {
+  const rootDir = resolve(process.cwd(), options.root || '')
+  const buildDir = resolve(process.cwd(), outDir)
+
   return {
+    onStart({ env }: Kopflos): Promise<void> | void {
+      const viteVars = {
+        basePath: env.kopflos.config.mode === 'development' ? rootDir : buildDir,
+      }
+      log.info('Variables', viteVars)
+      env.kopflos.variables.VITE = Object.freeze(viteVars)
+    },
     async beforeMiddleware(host: express.Router, { env }) {
       if (env.kopflos.config.mode === 'development') {
         log.info('Development UI mode. Creating Vite server...')
         const viteServer = await createViteServer(options)
         host.use(viteServer.middlewares)
       } else {
         log.info('Serving UI from build directory')
-        const buildDir = resolve(process.cwd(), outDir)
         log.debug('Build directory:', buildDir)
-        host.use('/assets', express.static(resolve(buildDir, 'assets')))
+        host.use(express.static(buildDir))
       }
     },
     async build() {