polen 0.9.0-next.3 → 0.9.0-next.4

package/src/api/vite/plugins/core.ts

@@ -1,38 +1,32 @@
 import type { Config } from '#api/config/index'
+import { NavbarData } from '#api/vite/data/navbar'
 import { VitePluginSelfContainedMode } from '#cli/_/self-contained-mode'
 import type { ReactRouter } from '#dep/react-router/index'
 import type { Vite } from '#dep/vite/index'
-import { reportDiagnostics } from '#lib/file-router/diagnostic-reporter'
-import { FileRouter } from '#lib/file-router/index'
-import { Tree } from '#lib/tree/index'
+import { VitePluginJson } from '#lib/vite-plugin-json/index'
+import { VitePluginReactiveData } from '#lib/vite-plugin-reactive-data/index'
 import { ViteVirtual } from '#lib/vite-virtual/index'
 import { debug } from '#singletons/debug'
+import { superjson } from '#singletons/superjson'
 import { Json, Str } from '@wollybeard/kit'
-import jsesc from 'jsesc'
-import type { ProjectData, SidebarIndex, SiteNavigationItem } from '../../../project-data.ts'
-import { superjson } from '../../../singletons/superjson.ts'
+import type { ProjectData } from '../../../project-data.ts'
 import { SchemaAugmentation } from '../../schema-augmentation/index.ts'
 import { Schema } from '../../schema/index.ts'
 import { createLogger } from '../logger.ts'
 import { polenVirtual } from '../vi.ts'
-import { createPagesPlugin, getRouteTree } from './pages.ts'
+import { Pages } from './pages.ts'
 
 const _debug = debug.sub(`vite-plugin-core`)
 
 const viTemplateVariables = polenVirtual([`template`, `variables`])
 const viTemplateSchemaAugmentations = polenVirtual([`template`, `schema-augmentations`])
-const viProjectData = polenVirtual([`project`, `data`])
+const viProjectData = polenVirtual([`project`, `data.jsonsuper`], { allowPluginProcessing: true })
 
 export interface ProjectPagesModule {
   pages: ReactRouter.RouteObject[]
 }
 
 export const Core = (config: Config.Config): Vite.PluginOption[] => {
-  // State for current pages data (updated by pages plugin)
-  let currentPagesData: FileRouter.ScanResult | null = null
-  let currentTreeData: FileRouter.RouteTreeNode | null = null
-  let viteDevServer: Vite.ViteDevServer | null = null
-
   // Schema cache management
   let schemaCache: Awaited<ReturnType<typeof Schema.readOrThrow>> | null = null
 
@@ -52,6 +46,7 @@ export const Core = (config: Config.Config): Vite.PluginOption[] => {
   }
 
   const plugins: Vite.Plugin[] = []
+  const navbarData = NavbarData()
 
   // Note: The main use for this right now is to resolve the react imports
   // from the mdx vite plugin which have to go through the Polen exports since Polen keeps those deps bundled.
@@ -64,26 +59,19 @@ export const Core = (config: Config.Config): Vite.PluginOption[] => {
     }))
   }
 
+  const json = VitePluginJson.create({
+    codec: {
+      validate: superjson,
+      importPath: import.meta.resolve('#singletons/superjson'),
+      importExport: 'superjson',
+    },
+    filter: {
+      moduleTypes: ['jsonsuper'],
+    },
+  })
+
   return [
     ...plugins,
-
-    // Self-contained pages plugin
-    ...createPagesPlugin({
-      config,
-      onPagesChange: (pages) => {
-        currentPagesData = pages
-        // Invalidate project data virtual module to regenerate navigation/sidebar
-        if (viteDevServer) {
-          const projectDataModule = viteDevServer.moduleGraph.getModuleById(viProjectData.resolved)
-          if (projectDataModule) {
-            viteDevServer.moduleGraph.invalidateModule(projectDataModule)
-          }
-        }
-      },
-      onTreeChange: (tree) => {
-        currentTreeData = tree
-      },
-    }),
     /**
      * If a `polen*` import is encountered from the user's project, resolve it to the currently
      * running source code of Polen rather than the user's node_modules.
@@ -95,9 +83,9 @@ export const Core = (config: Config.Config): Vite.PluginOption[] => {
      * 2. Secondary: Using Polen CLI on a project that does not have Polen installed.
      *    (User would likely not want to do this because they would not be able to achieve type safety)
      */
-
     {
       name: `polen:internal-import-alias`,
+      enforce: 'pre' as const,
       resolveId(id, importer) {
         const d = debug.sub(`vite-plugin:internal-import-alias`)
 
@@ -133,11 +121,20 @@ export const Core = (config: Config.Config): Vite.PluginOption[] => {
         return to
       },
     },
+    json,
+    VitePluginReactiveData.create({
+      moduleId: `virtual:polen/project/data/navbar`,
+      data: navbarData.value,
+      codec: superjson,
+      name: `polen-navbar`,
+      moduleType: 'jsonsuper',
+    }),
+    ...Pages({
+      config,
+      navbarData,
+    }),
     {
       name: `polen:core`,
-      configureServer(server) {
-        viteDevServer = server
-      },
       config(_, { command }) {
         // isServing = command === `serve`
         return {
@@ -187,81 +184,15 @@ export const Core = (config: Config.Config): Vite.PluginOption[] => {
           identifier: viProjectData,
           async loader() {
             _debug(`loadingViProjectDataVirtualModule`)
-            // todo: parallel
             const schema = await readSchema()
 
-            // Get pages data from the pages plugin or load initially
-            if (!currentPagesData) {
-              _debug(`loadingPagesDataInitially`)
-              currentPagesData = await FileRouter.scan({
-                dir: config.paths.project.absolute.pages,
-                glob: `**/*.{md,mdx}`,
-              })
-              // Report any diagnostics from initial scan
-              reportDiagnostics(currentPagesData.diagnostics)
-            }
-            if (!currentTreeData) {
-              _debug(`loadingTreeDataInitially`)
-              currentTreeData = await getRouteTree(config)
-            }
-            const pagesScanResult = currentPagesData
-            const routeTree = currentTreeData
-            _debug(`usingPageRoutesFromPagesPlugin`, pagesScanResult.routes.length)
-
-            const siteNavigationItems: SiteNavigationItem[] = []
-
-            //
-            // ━━ Build Navbar
-            //
-
-            // Process first-level children as navigation items
-            for (const child of routeTree.children) {
-              if (child.value.type === 'directory') {
-                // Check if this directory has an index file
-                const hasIndex = child.children.some(c => c.value.type === 'file' && c.value.name === 'index')
-
-                if (hasIndex) {
-                  const pathExp = FileRouter.pathToExpression([child.value.name])
-                  const title = Str.titlizeSlug(child.value.name)
-                  siteNavigationItems.push({
-                    pathExp: pathExp.startsWith('/') ? pathExp.slice(1) : pathExp,
-                    title,
-                  })
-                }
-              } else if (child.value.type === 'file' && child.value.name !== 'index') {
-                const pathExp = FileRouter.pathToExpression([child.value.name])
-                const title = Str.titlizeSlug(child.value.name)
-                siteNavigationItems.push({
-                  pathExp: pathExp.startsWith('/') ? pathExp.slice(1) : pathExp,
-                  title,
-                })
-              }
-            }
-
             // ━ Schema presence causes adding some navbar items
+            const schemaNavbar = navbarData.get('schema')
+            schemaNavbar.length = 0 // Clear existing
             if (schema) {
-              siteNavigationItems.push({ pathExp: `reference`, title: `Reference` })
+              schemaNavbar.push({ pathExp: `reference`, title: `Reference` })
               if (schema.versions.length > 1) {
-                siteNavigationItems.push({ pathExp: `changelog`, title: `Changelog` })
-              }
-            }
-
-            //
-            // ━━ Build Sidebar
-            //
-
-            const sidebarIndex: SidebarIndex = {}
-
-            // Build sidebar for each top-level directory
-            for (const child of routeTree.children) {
-              if (child.value.type === 'directory') {
-                const pathExp = `/${child.value.name}`
-                // Create a subtree starting from this directory
-                const subtree = Tree.node(child.value, child.children)
-                // Pass the directory name as base path so paths are built correctly
-                const sidebar = FileRouter.Sidebar.buildFromTree(subtree, [child.value.name])
-                _debug(`Built sidebar for ${pathExp}:`, sidebar)
-                sidebarIndex[pathExp] = sidebar
+                schemaNavbar.push({ pathExp: `changelog`, title: `Changelog` })
               }
             }
 
@@ -271,10 +202,7 @@ export const Core = (config: Config.Config): Vite.PluginOption[] => {
 
             const projectData: ProjectData = {
               schema,
-              siteNavigationItems,
-              sidebarIndex,
               faviconPath: `/logo.svg`,
-              pagesScanResult: pagesScanResult,
               paths: config.paths.project,
               server: {
                 static: {
@@ -288,14 +216,8 @@ export const Core = (config: Config.Config): Vite.PluginOption[] => {
               },
             }
 
-            const projectDataCode = jsesc(superjson.stringify(projectData))
-            const content = `
-            import { superjson } from '#singletons/superjson'
-
-            export const PROJECT_DATA = superjson.parse('${projectDataCode}')
-          `
-
-            return content
+            // Return just the JSON string - let the JSON plugin handle the transformation
+            return superjson.stringify(projectData)
           },
         },
       ),

package/src/api/vite/plugins/pages.ts

@@ -1,10 +1,12 @@
 import type { Config } from '#api/config/index'
+import type { NavbarDataRegistry } from '#api/vite/data/navbar'
 import { polenVirtual } from '#api/vite/vi'
 import type { Vite } from '#dep/vite/index'
 import { reportDiagnostics } from '#lib/file-router/diagnostic-reporter'
 import { FileRouter } from '#lib/file-router/index'
-import { ViteVirtual } from '#lib/vite-virtual/index'
+import { Tree } from '#lib/tree/index'
 import { debug } from '#singletons/debug'
+import { superjson } from '#singletons/superjson'
 import mdx from '@mdx-js/rollup'
 import { Path, Str } from '@wollybeard/kit'
 import remarkGfm from 'remark-gfm'
@@ -12,19 +14,36 @@ import remarkGfm from 'remark-gfm'
 const _debug = debug.sub(`vite-plugin-pages`)
 
 export const viProjectPages = polenVirtual([`project`, `pages.jsx`], { allowPluginProcessing: true })
+export const viProjectPagesData = polenVirtual([`project`, `data`, 'pages.jsonsuper'], { allowPluginProcessing: true })
 
 export interface PagesTreePluginOptions {
   config: Config.Config
+  navbarData?: NavbarDataRegistry
   onPagesChange?: (pages: FileRouter.ScanResult) => void
   onTreeChange?: (tree: FileRouter.RouteTreeNode) => void
 }
 
+export interface ProjectDataPages {
+  sidebarIndex: SidebarIndex
+  pagesScanResult: FileRouter.ScanResult
+}
+
+export interface SidebarIndex {
+  [pathExpression: string]: FileRouter.Sidebar.Sidebar
+}
+
 /**
  * Pages plugin with tree support
  */
-export const createPagesPlugin = (
-  { config, onPagesChange, onTreeChange }: PagesTreePluginOptions,
-): Vite.Plugin[] => {
+export const Pages = ({
+  config,
+  navbarData,
+  onPagesChange,
+  onTreeChange,
+}: PagesTreePluginOptions): Vite.Plugin[] => {
+  let currentPagesData: FileRouter.ScanResult | null = null
+  let currentTreeData: FileRouter.RouteTreeNode | null = null
+
   // State management
   let pagesCache: FileRouter.ScanResult | null = null
   let treeCache: FileRouter.RouteTreeNode | null = null
@@ -119,60 +138,186 @@ export const createPagesPlugin = (
       },
 
       // Hot update handling
-      async handleHotUpdate({ file, server }) {
+      async handleHotUpdate({ file, server, modules }) {
         _debug(`handleHotUpdate`, file)
         if (!isPageFile(file)) return
 
         _debug(`Page file changed:`, file)
 
-        // Clear cache
+        // Check if this is a content-only change to an existing page
+        const oldPages = pagesCache
+
+        // Clear cache and rescan
         clearCache()
+        const newPages = await scanPages()
+        currentPagesData = newPages
 
-        // Invalidate virtual module
-        const mod = server.moduleGraph.getModuleById(viProjectPages.resolved)
-        if (mod) {
-          server.moduleGraph.invalidateModule(mod)
-          _debug(`Invalidated pages virtual module`)
-        }
+        // Check if page structure changed (added/removed pages)
+        const structureChanged = !oldPages
+          || oldPages.routes.length !== newPages.routes.length
+          || !oldPages.routes.every((oldRoute, i) =>
+            oldRoute.file.path.absolute === newPages.routes[i]?.file.path.absolute
+          )
 
-        // Notify about pages change (for other plugins that depend on pages)
-        if (onPagesChange) {
-          const pages = await scanPages()
-          // Report any diagnostics
-          reportDiagnostics(pages.diagnostics)
-          onPagesChange(pages)
-        }
+        if (structureChanged) {
+          _debug(`Page structure changed, triggering full reload`)
 
-        // Notify about tree change
-        if (onTreeChange) {
-          const tree = await scanTree()
-          onTreeChange(tree)
+          // Invalidate virtual module
+          const mod = server.moduleGraph.getModuleById(viProjectPages.id)
+          if (mod) {
+            server.moduleGraph.invalidateModule(mod)
+            _debug(`Invalidated pages virtual module`)
+          }
+
+          // Notify about changes
+          if (onPagesChange) {
+            reportDiagnostics(newPages.diagnostics)
+            onPagesChange(newPages)
+          }
+
+          if (onTreeChange) {
+            const tree = await scanTree()
+            onTreeChange(tree)
+            currentTreeData = tree
+          }
+
+          // Trigger full reload for structure changes
+          server.ws.send({ type: `full-reload` })
+          return []
+        } else {
+          _debug(`Page content changed, allowing HMR`)
+          // Let default HMR handle the MDX file change
+          return modules
+        }
+      },
+      resolveId(id) {
+        if (id === viProjectPagesData.id) {
+          return viProjectPagesData.resolved
         }
+      },
+      load: {
+        // filter: {
+        //   id: viProjectPagesData.resolved,
+        // },
+        async handler(id) {
+          if (id !== viProjectPagesData.resolved) return
+          _debug(`viProjectDataPages`)
+
+          // Get pages data from the pages plugin or load initially
+          if (!currentPagesData) {
+            _debug(`loadingPagesDataInitially`)
+            currentPagesData = await FileRouter.scan({
+              dir: config.paths.project.absolute.pages,
+              glob: `**/*.{md,mdx}`,
+            })
+            // Report any diagnostics from initial scan
+            reportDiagnostics(currentPagesData.diagnostics)
+          }
+          if (!currentTreeData) {
+            _debug(`loadingTreeDataInitially`)
+            currentTreeData = await getRouteTree(config)
+          }
+          const pagesScanResult = currentPagesData
+          const routeTree = currentTreeData
+          _debug(`usingPageRoutesFromPagesPlugin`, pagesScanResult.routes.length)
+
+          //
+          // ━━ Build Navbar
+          //
 
-        // Trigger full reload
-        server.ws.send({ type: `full-reload` })
+          // Update navbar if provided
+          if (navbarData) {
+            const navbarPages = navbarData.get('pages')
+            navbarPages.length = 0 // Clear existing
 
-        return []
+            // Process first-level children as navigation items
+            for (const child of routeTree.children) {
+              if (child.value.type === 'directory') {
+                // Check if this directory has an index file
+                const hasIndex = child.children.some(c => c.value.type === 'file' && c.value.name === 'index')
+
+                if (hasIndex) {
+                  const pathExp = FileRouter.pathToExpression([child.value.name])
+                  const title = Str.titlizeSlug(child.value.name)
+                  navbarPages.push({
+                    pathExp: pathExp.startsWith('/') ? pathExp.slice(1) : pathExp,
+                    title,
+                  })
+                }
+              } else if (child.value.type === 'file' && child.value.name !== 'index') {
+                const pathExp = FileRouter.pathToExpression([child.value.name])
+                const title = Str.titlizeSlug(child.value.name)
+                navbarPages.push({
+                  pathExp: pathExp.startsWith('/') ? pathExp.slice(1) : pathExp,
+                  title,
+                })
+              }
+            }
+          }
+
+          //
+          // ━━ Build Sidebar
+          //
+
+          const sidebarIndex: SidebarIndex = {}
+
+          // Build sidebar for each top-level directory
+          for (const child of routeTree.children) {
+            if (child.value.type === 'directory') {
+              const pathExp = `/${child.value.name}`
+              // Create a subtree starting from this directory
+              const subtree = Tree.node(child.value, child.children)
+              // Pass the directory name as base path so paths are built correctly
+              const sidebar = FileRouter.Sidebar.buildFromTree(subtree, [child.value.name])
+              _debug(`Built sidebar for ${pathExp}:`, sidebar)
+              sidebarIndex[pathExp] = sidebar
+            }
+          }
+
+          //
+          // ━━ Put It All together
+          //
+
+          const projectDataPages: ProjectDataPages = {
+            sidebarIndex,
+            pagesScanResult: pagesScanResult,
+          }
+
+          // Return just the JSON string - let the JSON plugin handle the transformation
+          return superjson.stringify(projectDataPages)
+        },
       },
+    },
+    // Plugin 4: Virtual Module for Pages Routes
+    {
+      name: 'polen:pages:routes',
+      resolveId(id) {
+        if (id === viProjectPages.id) {
+          return viProjectPages.resolved
+        }
+      },
+      load: {
+        // filter: {
+        //   id: viProjectPages.resolved,
+        // },
+        handler: async (id) => {
+          if (id !== viProjectPages.resolved) return
 
-      // Virtual module handling
-      ...ViteVirtual.IdentifiedLoader.toHooks({
-        identifier: viProjectPages,
-        async loader() {
           _debug(`Loading viProjectPages virtual module`)
-          const pagesScanResult = await scanPages()
-          const tree = await scanTree()
 
-          // Report any diagnostics
-          reportDiagnostics(pagesScanResult.diagnostics)
+          // Ensure we have pages data
+          if (!currentPagesData) {
+            currentPagesData = await scanPages()
+            reportDiagnostics(currentPagesData.diagnostics)
+          }
 
-          // Notify about pages (useful for initial load)
-          onPagesChange?.(pagesScanResult)
-          onTreeChange?.(tree)
-
-          return generatePagesModule(pagesScanResult)
+          // Generate the module code
+          return {
+            code: generatePagesModule(currentPagesData),
+            moduleType: 'js',
+          }
         },
-      }),
+      },
     },
   ]
 }

package/src/api/vite/plugins/serve.ts

@@ -1,11 +1,11 @@
 import type { Config } from '#api/config/index'
+import { reportError } from '#api/server/report-error'
 import type { Hono } from '#dep/hono/index'
 import type { Vite } from '#dep/vite/index'
+import { ResponseInternalServerError } from '#lib/kit-temp'
 import { debug } from '#singletons/debug'
 import * as HonoNodeServer from '@hono/node-server'
-import { Err, Http } from '@wollybeard/kit'
-import cleanStack from 'clean-stack'
-import { ErrorParser } from 'youch-core'
+import { Err } from '@wollybeard/kit'
 
 type App = Hono.Hono
 
@@ -28,25 +28,7 @@ export const Serve = (
         if (Err.is(error)) {
           // ━ Clean Stack Trace
           server.ssrFixStacktrace(error)
-          const stack = cleanStack(error.stack, {
-            pathFilter: (path) => {
-              return !path.match(/.*rolldown-vite.*/)
-            },
-            basePath: config.paths.project.rootDir,
-            // pretty: true,
-          })
-          error.stack = stack
-          // ━ Log Error
-          Err.log(error)
-          const parser = new ErrorParser()
-          const parsedError = await parser.parse(error)
-          const snippet = parsedError.frames[0]?.source?.map(line => {
-            return line.lineNumber.toString().padStart(4, ' ') + `: ` + line.chunk
-          }).join(`\n`)
-          if (snippet) {
-            console.log('-----------------------------')
-            console.log(snippet)
-          }
+          reportError(error)
           return error
         }
         throw error
@@ -97,10 +79,7 @@ export const Serve = (
             const app = await appPromise
             if (Err.is(app)) {
               // Err.log(app)
-              return new Response(null, {
-                status: Http.Status.InternalServerError.code,
-                statusText: Http.Status.InternalServerError.description,
-              })
+              return ResponseInternalServerError()
             }
             const response = await app.fetch(request, { viteDevServer: server })
             return response

package/src/cli/commands/dev.ts

@@ -8,6 +8,7 @@ import { Err, Path } from '@wollybeard/kit'
 import { z } from 'zod'
 
 const args = Command.create()
+  .parameter(`--debug -d`, z.boolean().optional())
   .parameter(
     `--project -p`,
     // @ts-expect-error
@@ -28,7 +29,14 @@ const args = Command.create()
 
 const dir = ensureOptionalAbsoluteWithCwd(args.project) as string
 
-const viteUserConfig = await Api.ConfigResolver.fromFile({ dir })
+const viteUserConfig = await Api.ConfigResolver.fromFile({
+  dir,
+  overrides: {
+    advanced: {
+      debug: args.debug,
+    },
+  },
+})
 
 const viteDevServer = await Err.tryCatch(() => Vite.createServer(viteUserConfig))
 

package/src/lib/debug/environment-variable.ts

@@ -2,6 +2,7 @@ import { Arr, Language } from '@wollybeard/kit'
 
 export const enVarName = `DEBUG`
 
+export const deliminator = `,`
 export const wildcard = `*`
 export const enVarEnabledValuesStatic = [`true`, wildcard, `1`]
 
@@ -10,29 +11,45 @@ export const calcIsEnabledFromEnv = (
   namespace?: string[],
 ): boolean => {
   const namespace_ = namespace?.map(_ => _.toLowerCase())
-  const pattern = typeof enVars[enVarName] === `string`
+
+  const includeFilters = typeof enVars[enVarName] === `string`
     ? enVars[enVarName]
       .trim()
       .toLowerCase()
-      .split(`:`)
-      .map(_ => _.trim())
+      .split(deliminator)
+      .map(patternExpression => {
+        return patternExpression
+          .trim()
+          .split(`:`)
+          .map(_ => _.trim())
+      })
     : undefined
 
-  if (!pattern) return false
+  if (!includeFilters) return false
 
-  if (pattern.length === 1 && enVarEnabledValuesStatic.includes(pattern[0]!)) return true
+  if (includeFilters.length === 0) return false
 
-  if (!namespace_) return false
+  // If any is like * then it means "enable everything"
+  if (
+    includeFilters.some(includeFilter => {
+      if (includeFilter.length === 1 && enVarEnabledValuesStatic.includes(includeFilter[0]!)) return true
+    })
+  ) return true
 
-  if (Arr.getLast(pattern) !== wildcard) {
-    return pattern.join() === namespace_.join()
-  }
+  // At this point, if there is no namespace (e.g. root), then we cannot match anything
+  if (!namespace_) return false
 
-  let i = 0
-  for (const segment of pattern) {
-    if (segment === wildcard) return true
-    if (segment !== namespace_[i]) return false
-    i++
+  for (const includeFilter of includeFilters) {
+    if (Arr.getLast(includeFilter) !== wildcard) {
+      return includeFilter.join() === namespace_.join()
+    }
+
+    let i = 0
+    for (const segment of includeFilter) {
+      if (segment === wildcard) return true
+      if (segment !== namespace_[i]) return false
+      i++
+    }
   }
 
   Language.never()