feat: replace Handlebars with Nunjucks in TEMPLATE renderer

.changeset/nunjucks-template-renderer.md

@@ -0,0 +1,12 @@
+---
+"sqlseal": minor
+---
+
+Replace Handlebars with Nunjucks in TEMPLATE renderer
+
+Swap the template engine from Handlebars to Nunjucks for richer template capabilities.
+Nunjucks provides native groupby/unique filters, macros, template inheritance,
+set/variables, and include/import directives without SQL workarounds.
+
+Breaking change: existing templates using Handlebars syntax ({{#each}}, {{#if}}, {{#unless}})
+must be updated to Nunjucks equivalents ({% for %}, {% if %}, {% set %}).

package.json

@@ -67,7 +67,7 @@
     "esbuild-plugin-polyfill-node": "^0.3.0",
     "esprima": "^4.0.1",
     "estraverse": "^5.3.0",
-    "handlebars": "^4.7.8",
+    "nunjucks": "^3.2.4",
     "json5": "^2.2.3",
     "jsonpath": "^1.1.1",
     "lodash": "^4.17.21",

src/modules/editor/parser.ts

@@ -51,7 +51,7 @@ export const SQLSealLangDefinition = (views: ViewDefinition[], flags: readonly F
             ViewExpression =           ${viewsDefinitions}
             ExtraFlags =               ${flagsDefinitions}
             anyObject =                "{"  (~selectKeyword any)*
-            handlebarsTemplate =       (~selectKeyword any)*
+            nunjucksTemplate =       (~selectKeyword any)*
             javascriptTemplate =       (~selectKeyword any)*
             selectKeyword =            caseInsensitive<"WITH"> | caseInsensitive<"SELECT">
             tableKeyword =             caseInsensitive<"TABLE">

src/modules/editor/renderer/TemplateRenderer.ts

@@ -1,60 +1,91 @@
-// This is renderer for a very basic List view.
 import { App } from "obsidian";
 import { RendererConfig, RendererContext } from "./rendererRegistry";
 import { displayError } from "../../../utils/ui";
-import Handlebars from "handlebars";
+import nunjucks from "nunjucks";
 import { ViewDefinition } from "../parser";
 import { ParseResults } from "../../syntaxHighlight/cellParser/parseResults";
 
+const env = new nunjucks.Environment(null, { autoescape: false });
+
+// Register custom filters
+env.addFilter("groupby", (arr: any[], key: string) => {
+    const groups: Record<string, any[]> = {};
+    for (const item of arr) {
+        const groupKey = String(item[key] ?? "");
+        groups[groupKey] ??= [];
+        groups[groupKey].push(item);
+    }
+    return Object.entries(groups).map(([k, items]) => ({
+        grouper: k,
+        list: items,
+    }));
+});
+
+env.addFilter("unique", (arr: any[], key?: string) => {
+    if (!key) return [...new Set(arr)];
+    const seen = new Set<string>();
+    return arr.filter((item) => {
+        const val = String(item[key] ?? "");
+        if (seen.has(val)) return false;
+        seen.add(val);
+        return true;
+    });
+});
+
 interface TemplateRendererConfig {
-    template: HandlebarsTemplateDelegate
+    template: nunjucks.Template;
 }
 
 export class TemplateRenderer implements RendererConfig {
-    constructor(private readonly app: App) {
-    }
+    constructor(private readonly app: App) {}
 
     get rendererKey() {
-        return 'template'
+        return "template";
     }
 
     get viewDefinition(): ViewDefinition {
         return {
             name: this.rendererKey,
-            argument: 'handlebarsTemplate?',
-            singleLine: false
-        }
+            argument: "nunjucksTemplate?",
+            singleLine: false,
+        };
     }
 
     validateConfig(config: string): TemplateRendererConfig {
         if (!config) {
             return {
-                template: Handlebars.compile('No template Provided')
-            }
+                template: nunjucks.compile("No template provided", env),
+            };
         }
         return {
-            template: Handlebars.compile(config)
-        }
+            template: nunjucks.compile(config, env),
+        };
     }
 
-    render(config: TemplateRendererConfig, el: HTMLElement, { cellParser }: RendererContext) {
+    render(
+        config: TemplateRendererConfig,
+        el: HTMLElement,
+        { cellParser }: RendererContext,
+    ) {
         return {
             render: ({ columns, data, frontmatter }: any) => {
-                el.empty()
-
-                const parser = new ParseResults(cellParser!, (el) => new Handlebars.SafeString(el.outerHTML))
+                el.empty();
+
+                const parser = new ParseResults(
+                    cellParser!,
+                    (el) => new nunjucks.runtime.SafeString(el.outerHTML),
+                );
 
-                // Seems to be the only way to render handlebars into DOM. Don't like it but what can we do.
-                el.innerHTML = config.template({
+                el.innerHTML = config.template.render({
                     data: parser.parse(data, columns),
                     columns,
-                    properties: frontmatter
-                })
-                parser.initialise(el)
+                    properties: frontmatter,
+                });
+                parser.initialise(el);
             },
             error: (error: string) => {
-                displayError(el, error)
-            }
-        }
+                displayError(el, error);
+            },
+        };
     }
-}
+}