Mustache lambdas emiting any object including components (extended #951)

mwdb/web/src/commons/helpers/renderTokens.tsx

@@ -37,10 +37,11 @@ export type Token = {
 
 export type Option = {
     searchEndpoint: string;
+    lambdaResults?: { [id: string]: any };
 };
 
 // Custom renderer into React components
-export function renderTokens(tokens: Token[], options?: Option): any {
+export function renderTokens(tokens: Token[], options: Option): any {
     const renderers = {
         text(token: Token) {
             return token.tokens
@@ -89,24 +90,32 @@ export function renderTokens(tokens: Token[], options?: Option): any {
             );
         },
         link(token: Token) {
-            if (token.href && token.href.startsWith("search#")) {
-                const query = token.href.slice("search#".length);
-                const search =
-                    "?" +
-                    new URLSearchParams({
-                        q: decodeURIComponent(query),
-                    }).toString();
-                return (
-                    <Link
-                        key={uniqueId()}
-                        to={{
-                            pathname: options?.searchEndpoint,
-                            search,
-                        }}
-                    >
-                        {renderTokens(token.tokens ?? [], options)}
-                    </Link>
-                );
+            if (token.href) {
+                if (token.href.startsWith("search#")) {
+                    const query = token.href.slice("search#".length);
+                    const search =
+                        "?" +
+                        new URLSearchParams({
+                            q: decodeURIComponent(query),
+                        }).toString();
+                    return (
+                        <Link
+                            key={uniqueId()}
+                            to={{
+                                pathname: options?.searchEndpoint,
+                                search,
+                            }}
+                        >
+                            {renderTokens(token.tokens ?? [], options)}
+                        </Link>
+                    );
+                } else if (token.href.startsWith("lambda#")) {
+                    const id = token.href.slice("lambda#".length);
+                    if (!options.lambdaResults?.hasOwnProperty(id)) {
+                        return <i>{`(BUG: No lambda result for ${id})`}</i>;
+                    }
+                    return options.lambdaResults[id];
+                }
             }
             return (
                 <a key={uniqueId()} href={token.href}>

mwdb/web/src/components/RichAttribute/MarkedMustache.tsx

@@ -1,3 +1,4 @@
+import _, { uniqueId } from "lodash";
 import Mustache, { Context } from "mustache";
 import { marked, Tokenizer } from "marked";
 import {
@@ -6,6 +7,8 @@ import {
     renderTokens,
     Token,
 } from "@mwdb-web/commons/helpers";
+import { fromPlugins } from "@mwdb-web/commons/plugins";
+import { builtinLambdas, LambdaFunction } from "./builtinLambdas";
 
 /**
  * Markdown with Mustache templates for React
@@ -24,14 +27,20 @@ function appendToLastElement(array: string[], value: string) {
     return [...array.slice(0, -1), array[array.length - 1] + value];
 }
 
-function splitName(name: string) {
-    if (name === ".")
-        // Special case for "this"
-        return [];
+function isFunction(obj: Object): boolean {
+    return typeof obj === "function";
+}
+
+function splitByUnescapedSeparator(name: string, separator: string) {
+    const splitRegex = new RegExp(
+        String.raw`(?<!\\)((?:\\\\)*[${separator}])`,
+        "g"
+    );
+    const replaceRegex = new RegExp(String.raw`\\([${separator}\\])`, "g");
     return name
-        .split(/(?<!\\)((?:\\\\)*[.])/g)
+        .split(splitRegex)
         .reduce((acc: string[], current: string, index: number) => {
-            const unescapedCurrent = current.replaceAll(/\\([.\\])/g, "$1");
+            const unescapedCurrent = current.replaceAll(replaceRegex, "$1");
             if (index % 2) {
                 // Last character is a dot, rest must be appended to last element
                 const currentWithoutLast = unescapedCurrent.slice(0, -1);
@@ -43,6 +52,13 @@ function splitName(name: string) {
         }, []);
 }
 
+function splitName(name: string) {
+    if (name === ".")
+        // Special case for "this"
+        return [];
+    return splitByUnescapedSeparator(name, ".");
+}
+
 function makeQuery(path: string[], value: string, attributeKey: string) {
     if (path[0] !== "value" && path[0] !== "value*")
         /**
@@ -80,13 +96,22 @@ class MustacheContext extends Mustache.Context {
     globalView: any;
     lastPath: string[] | null;
     lastValue: string | null;
-    constructor(view: Object, parent?: Context, globalView?: any) {
+    lambdaResults: { [id: string]: any };
+    lambdas: { [name: string]: LambdaFunction };
+    constructor(view: Object, parent?: MustacheContext, globalView?: any) {
         super(view, parent);
         this.globalView = globalView === undefined ? view : globalView;
         // Stored absolute path of last lookup
         this.lastPath = null;
         // Stored value from last lookup to determine the type
         this.lastValue = null;
+        this.lambdaResults = parent ? parent.lambdaResults : {};
+        this.lambdas = parent ? parent.lambdas : {};
+    }
+
+    registerLambdas(lambdas: { [name: string]: LambdaFunction }) {
+        for (let lambdaName of Object.keys(lambdas))
+            this.lambdas[lambdaName] = lambdas[lambdaName];
     }
 
     push(view: Object): Context {
@@ -103,40 +128,101 @@ class MustacheContext extends Mustache.Context {
         return parentPath;
     }
 
-    lookup(name: string) {
-        let searchable = false;
-        // Check for searchable mark at the beginning
-        if (name[0] === "@") {
-            name = name.slice(1);
-            searchable = true;
-        }
+    lookupView(name: string) {
+        // Make a lookup within a view object
         if (!name) return undefined;
         const path = splitName(name);
+
         let currentObject = this.view;
         for (let element of path) {
             if (!Object.prototype.hasOwnProperty.call(currentObject, element))
                 return undefined;
             currentObject = currentObject[element];
         }
+
         this.lastPath = this.getParentPath()!.concat(path);
         this.lastValue = currentObject;
-        if (searchable) {
-            if (
-                typeof currentObject === "object" ||
-                typeof currentObject === "function"
-            )
-                // Non-primitives are not directly searchable
-                return undefined;
-            const query = makeQuery(
-                this.lastPath,
-                currentObject,
-                this.globalView["key"]
-            );
-            if (!query) return undefined;
-            return new SearchReference(query, currentObject);
-        }
         return currentObject;
     }
+
+    emitLambdaResult(result: any): string {
+        if (typeof result !== "string") {
+            let lambdaResultId = uniqueId("lambda_result");
+            this.lambdaResults[lambdaResultId] = result;
+            // Emit reference in markdown
+            return `[](lambda#${lambdaResultId})`;
+        } else {
+            return result;
+        }
+    }
+
+    lookupLambda(name: string) {
+        const lambda = this.lambdas[name];
+        if (!lambda) return undefined;
+        const context = this;
+        return function lambdaFunction(
+            this: any,
+            text: string,
+            renderer: Function
+        ): string {
+            let result = lambda.call(this, text, {
+                callType: "section",
+                renderer,
+            });
+            return context.emitLambdaResult(result);
+        };
+    }
+
+    lookupPipeline(pipeline: string) {
+        const [name, ...lambdaNames] = pipeline
+            .split("|")
+            .map((name) => name.trim());
+        let result = this.lookupView(name);
+        if (typeof result === "undefined") return undefined;
+        for (let lambdaName of lambdaNames) {
+            const lambda = this.lambdas[lambdaName];
+            if (!lambda) return undefined;
+            result = lambda.call(this.view, result, { callType: "pipeline" });
+            if (typeof result === "undefined") return undefined;
+        }
+        return this.emitLambdaResult(result);
+    }
+
+    lookupSearchable(name: string) {
+        if (!name) return undefined;
+        let currentObject = this.lookupView(name);
+        if (typeof currentObject === "undefined") return undefined;
+        if (isFunction(currentObject) || typeof currentObject === "object")
+            // Non-primitives are not directly searchable
+            return undefined;
+        const query = makeQuery(
+            this.lastPath as string[],
+            currentObject,
+            this.globalView["key"]
+        );
+        if (!query) return undefined;
+        return new SearchReference(query, currentObject);
+    }
+
+    lookup(name: string) {
+        // Check for searchable mark at the beginning
+        if (name[0] === "@") {
+            // Searchable field mark
+            name = name.slice(1);
+            return this.lookupSearchable(name);
+        } else if (name.includes("|")) {
+            // Pipeline expression
+            return this.lookupPipeline(name);
+        }
+
+        let object = this.lookupView(name);
+        if (typeof object !== "undefined") return object;
+
+        let lambda = this.lookupLambda(name);
+        if (typeof lambda !== "undefined") return lambda;
+
+        return undefined;
+    }
 }
 
 // Extended Writer to escape Markdown characters instead of HTML
@@ -157,10 +243,6 @@ class MustacheWriter extends Mustache.Writer {
                 : escapeMarkdown(value);
         return "";
     }
-
-    render(template: string, view: Object) {
-        return super.render(template, new MustacheContext(view));
-    }
 }
 
 // Overrides to not use HTML escape
@@ -213,10 +295,27 @@ const mustacheWriter = new MustacheWriter();
 const markedTokenizer = new MarkedTokenizer();
 
 export function renderValue(template: string, value: Object, options: Option) {
-    const markdown = mustacheWriter.render(template, value);
+    const pluginLambdas = [
+        builtinLambdas,
+        ...fromPlugins("mustacheExtensions"),
+    ];
+    const context = new MustacheContext({
+        ...value,
+    });
+    for (let lambdaSet of pluginLambdas) {
+        context.registerLambdas(lambdaSet);
+    }
+    const markdown = mustacheWriter.render(template, context);
     const tokens = marked.lexer(markdown, {
         ...marked.defaults,
         tokenizer: markedTokenizer,
     }) as Token[];
-    return <div>{renderTokens(tokens, options)}</div>;
+    return (
+        <div>
+            {renderTokens(tokens, {
+                ...options,
+                lambdaResults: context.lambdaResults,
+            })}
+        </div>
+    );
 }

mwdb/web/src/components/RichAttribute/builtinLambdas.tsx

@@ -0,0 +1,14 @@
+function noop() {}
+
+export type LambdaFunction = (
+    this: object,
+    input: any,
+    options: { callType: "section" | "pipeline"; renderer?: Function }
+) => any;
+
+export const builtinLambdas = {
+    makeTable: noop,
+    makeList: noop,
+    count: noop,
+    sort: noop,
+};