@theotherwillembotha/node-red-loki 0.0.55 → 0.1.0

package/build/Nodes.html

@@ -8,6 +8,128 @@
     
 -->
 
+<script type="text/javascript">
+    RED.nodes.registerType('LokiServiceConfigNode', {
+      category: 'config',
+      label: function() {
+        return this.name
+      },
+      paletteLabel: 'Loki Service',
+      defaults: {
+        name: {
+          value: 'Loki Service',
+          required: true
+        },
+        url: {
+          value: 'http://localhost:3100',
+          required: true
+        },
+        userid: {
+          required: false
+        },
+        authtoken: {
+          required: false
+        },
+        tenantid: {
+          required: false
+        },
+      },
+      oneditprepare: function() {
+        // **** LokiServiceConfigNode **** //
+        {
+          $("#loki-service-test-btn").on("click", function() {
+            let $btn = $(this);
+            let $status = $("#loki-service-test-status");
+            $btn.prop("disabled", true);
+            $status.text("Testing...").css("color", "gray");
+            $.ajax({
+              url: "lokiservice/testconnection",
+              type: "POST",
+              contentType: "application/json; charset=utf-8",
+              data: JSON.stringify({
+                url: $("#node-config-input-url").val(),
+                userid: $("#node-config-input-userid").val(),
+                authtoken: $("#node-config-input-authtoken").val(),
+                tenantid: $("#node-config-input-tenantid").val(),
+              }),
+              success: function(response) {
+                if (response.success) {
+                  $status.text("\u2714 Connected").css("color", "green");
+                } else {
+                  let detail = response.error ? " \u2014 " + response.error : "";
+                  $status.text("\u2718 Failed" + detail).css("color", "red");
+                }
+              },
+              error: function(jqXHR, textStatus, errorThrown) {
+                $status.text("\u2718 Failed \u2014 " + errorThrown).css("color", "red");
+              },
+              complete: function() {
+                $btn.prop("disabled", false);
+              }
+            });
+          });
+        }
+      },
+      oneditsave: function() {
+        // **** LokiServiceConfigNode **** //
+        {}
+      },
+      oneditcancel: function() {},
+      oneditdelete: function() {},
+    });
+
+</script>
+
+
+<script type="text/html" data-template-name='LokiServiceConfigNode'>
+    <div id='section_LokiServiceConfigNode'>
+        <div class="form-row">
+            <label for="node-config-input-name"><i class="fa fa-tag"></i> Name</label>
+            <input type="text" id="node-config-input-name" />
+        </div>
+
+        <div class="form-row">
+            <label for="node-config-input-url"><i class="fa fa-server"></i> URL</label>
+            <input type="text" id="node-config-input-url" placeholder="http://localhost:3100" />
+        </div>
+
+        <div class="form-row">
+            <label for="node-config-input-tenantid"><i class="fa fa-building-o"></i> Tenant ID</label>
+            <input type="text" id="node-config-input-tenantid" placeholder="(optional)" />
+        </div>
+
+        <div class="form-row">
+            <label for="node-config-input-userid"><i class="fa fa-user"></i> Username</label>
+            <input type="text" id="node-config-input-userid" placeholder="(optional)" />
+        </div>
+
+        <div class="form-row">
+            <label for="node-config-input-authtoken"><i class="fa fa-key"></i> Auth Token</label>
+            <input type="password" id="node-config-input-authtoken" placeholder="(optional)" />
+        </div>
+
+        <div class="form-row" style="margin-top:12px;">
+            <label></label>
+            <button id="loki-service-test-btn" type="button" class="red-ui-button">
+                <i class="fa fa-plug"></i> Test Connection
+            </button>
+            <span id="loki-service-test-status" style="margin-left:10px; font-size:12px;"></span>
+        </div>
+
+    </div>
+</script>
+
+<script type="text/markdown" data-help-name='LokiServiceConfigNode'>
+Shared connection configuration for a Grafana Loki instance. Referenced by the Loki Logger and Loki Query nodes.
+
+### Properties
+
+: *name*       (string) : Display label for this config node.
+: *url*        (string) : Base URL of the Loki instance, including port (e.g. `http://localhost:3100`).
+: *tenant ID*  (string) : Tenant identifier for multi-tenant deployments (`X-Scope-OrgID` header). Leave blank for single-tenant setups.
+: *username*   (string) : Username for basic authentication. Leave blank if auth is not required.
+: *auth token* (string) : Password or token for basic authentication.
+</script>
 <script type="text/javascript">
     RED.nodes.registerType('LokiLoggerConfigNode', {
       category: 'config',
@@ -28,10 +150,10 @@
           value: 'info',
           required: true
         },
-        loki_host: {},
-        loki_tenantid: {},
-        loki_userid: {},
-        loki_authtoken: {},
+        lokiservice: {
+          type: 'LokiServiceConfigNode',
+          required: true
+        },
       },
       oneditprepare: function() {
         // **** LokiLoggerConfigNode **** //
@@ -94,20 +216,8 @@
             </div>
 
             <div class="form-row">
-                <label class="towb_editorlabel" for="node-config-input-loki_host"><i class="fa fa-server"></i> Host</label>
-                <input class="required" type="text" id="node-config-input-loki_host" />
-            </div>
-            <div class="form-row">
-                <label class="towb_editorlabel" for="node-config-input-loki_tenantid"><i class="fa fa-building-o"></i> Tenant ID</label>
-                <input class="" type="text" id="node-config-input-loki_tenantid" />
-            </div>
-            <div class="form-row">
-                <label class="towb_editorlabel" for="node-config-input-loki_userid"><i class="fa fa-user"></i> Username</label>
-                <input class="" type="text" id="node-config-input-loki_userid" />
-            </div>
-            <div class="form-row">
-                <label class="towb_editorlabel" for="node-config-input-loki_authtoken"><i class="fa fa-key"></i> Auth Token</label>
-                <input class="" type="password" id="node-config-input-loki_authtoken" />
+                <label class="towb_editorlabel" for="node-config-input-lokiservice"><i class="fa fa-server"></i> Loki Service</label>
+                <input type="text" id="node-config-input-lokiservice" />
             </div>
 
             <div class="form-row">
@@ -123,13 +233,10 @@
 Pushes log messages to a Grafana Loki instance using the Loki HTTP API.
 
 ### Properties
-: *name*        (string)    : A descriptive name for this logger configuration.
-: *level*       (level)     : The minimum log level. Messages below this threshold are suppressed. Options: DEBUG, INFO, WARNING, ERROR.
-: *host*        (string)    : The base URL of the Loki instance, including port (e.g. `http://localhost:3100`).
-: *tenant ID*   (string)    : The tenant identifier for multi-tenant Loki deployments (`X-Scope-OrgID` header). Leave blank for single-tenant deployments.
-: *username*    (string)    : Username for Loki authentication.
-: *auth token*  (string)    : Authentication token or password for Loki.
-: *template*    (mustache)  : A Mustache/Handlebars template that formats the log message body.
+: *name*         (string) : A descriptive name for this logger configuration.
+: *loki service* (config) : The Loki Service config node that provides the connection URL and credentials.
+: *level*        (level)  : The minimum log level. Messages below this threshold are suppressed. Options: DEBUG, INFO, WARNING, ERROR.
+: *template*     (mustache) : A Mustache/Handlebars template that formats the log message body.
 
 ### Mustache Templating
 Mustache/Handlebars templates build the message string pushed to Loki.
@@ -142,12 +249,947 @@ Mustache/Handlebars templates build the message string pushed to Loki.
 : *json*        (helper)    : Serialises an object to a JSON string using `JSON.stringify`.
 
 #### Examples
-- `{{{json msg}}}` — serialises the full message object as JSON.
+- `{{{json msg}}}` - serialises the full message object as JSON.
 
 #### References
-- [Grafana Loki — HTTP API](https://grafana.com/docs/loki/latest/reference/loki-http-api/)
-- [Mustache — Wikipedia](https://en.wikipedia.org/wiki/Mustache_(template_system))
-- [Mustache — Playground](https://jgonggrijp.gitlab.io/wontache/playground.html)
+- [Grafana Loki - HTTP API](https://grafana.com/docs/loki/latest/reference/loki-http-api/)
+- [Mustache - Wikipedia](https://en.wikipedia.org/wiki/Mustache_(template_system))
+- [Mustache - Playground](https://jgonggrijp.gitlab.io/wontache/playground.html)
+</script>
+<!-- LokiQueryNode -->
+<script type="text/javascript">
+    window.PluginCore = window.PluginCore || {};
+    /**
+     * PluginCore.createLogQLEditor(elementId, initialValue)
+     *
+     * Creates a Monaco editor pre-configured with the LogQL language:
+     * syntax highlighting for stream selectors, pipeline stages, metric
+     * functions, and aggregation operators; plus snippet completions.
+     *
+     * The LogQL language is registered with Monaco lazily on first call.
+     *
+     * @param {string} elementId    - DOM id of the container element.
+     * @param {string} initialValue - Starting content of the editor.
+     * @returns {{ getValue(): string, dispose(): void \}}
+     */
+    PluginCore.createLogQLEditor = function(elementId, initialValue) {
+      // Register the LogQL language with Monaco once per session.
+      if (!PluginCore._logqlReady) {
+        PluginCore._logqlReady = true;
+        monaco.languages.register({
+          id: 'logql'
+        });
+        monaco.languages.setLanguageConfiguration('logql', {
+          brackets: [
+            ['{', '}'],
+            ['[', ']'],
+            ['(', ')']
+          ],
+          autoClosingPairs: [{
+            open: '{',
+            close: '}'
+          }, {
+            open: '[',
+            close: ']'
+          }, {
+            open: '(',
+            close: ')'
+          }, {
+            open: '"',
+            close: '"'
+          }, {
+            open: "'",
+            close: "'"
+          }, {
+            open: '`',
+            close: '`'
+          }],
+          surroundingPairs: [{
+            open: '{',
+            close: '}'
+          }, {
+            open: '[',
+            close: ']'
+          }, {
+            open: '(',
+            close: ')'
+          }, {
+            open: '"',
+            close: '"'
+          }, {
+            open: "'",
+            close: "'"
+          }]
+        });
+        monaco.languages.setMonarchTokensProvider('logql', {
+          defaultToken: '',
+          tokenPostfix: '.logql',
+          keywords: ['by', 'without', 'on', 'ignoring', 'group_left', 'group_right', 'bool', 'or', 'and', 'unless', 'offset'],
+          metricFns: ['rate', 'count_over_time', 'bytes_rate', 'bytes_over_time', 'absent_over_time', 'sum_over_time', 'avg_over_time', 'min_over_time', 'max_over_time', 'first_over_time', 'last_over_time', 'stddev_over_time', 'stdvar_over_time', 'quantile_over_time', 'label_replace', 'vector', 'sort', 'sort_desc'],
+          aggregations: ['sum', 'avg', 'min', 'max', 'count', 'stddev', 'stdvar', 'bottomk', 'topk'],
+          pipelineStages: ['json', 'logfmt', 'pattern', 'regexp', 'unpack', 'line_format', 'label_format', 'drop', 'keep', 'decolorize', 'unwrap', 'ip', 'duration', 'bytes', 'distinct'],
+          tokenizer: {
+            root: [
+              // Stream selector open brace
+              [/\{/, {
+                token: 'delimiter.curly',
+                bracket: '@open',
+                next: '@streamSelector'
+              }],
+              // Range vector e.g. [5m]
+              [/\[\d+(ms|s|m|h|d|w|y)\]/, 'number.duration'],
+              // Pipeline filter operators
+              [/[|!][=~]/, 'operator.filter'],
+              // Pipe
+              [/\|/, 'operator.pipe'],
+              // Comparison operators
+              [/[><=!]+/, 'operator'],
+              // Numbers
+              [/\d+(\.\d+)?/, 'number'],
+              // Identifiers -> map to keyword/function/aggregation/pipeline categories
+              [/[a-zA-Z_]\w*/, {
+                cases: {
+                  '@keywords': 'keyword',
+                  '@aggregations': 'type.aggregate',
+                  '@metricFns': 'type.function',
+                  '@pipelineStages': 'type.pipeline',
+                  '@default': 'identifier'
+                }
+              }],
+              // String literals
+              [/"/, {
+                token: 'string.quote',
+                bracket: '@open',
+                next: '@dblString'
+              }],
+              [/'/, {
+                token: 'string.quote',
+                bracket: '@open',
+                next: '@sglString'
+              }],
+              [/`/, {
+                token: 'string.quote',
+                bracket: '@open',
+                next: '@rawString'
+              }]
+            ],
+            streamSelector: [
+              [/\}/, {
+                token: 'delimiter.curly',
+                bracket: '@close',
+                next: '@pop'
+              }],
+              [/[a-zA-Z_]\w*/, 'attribute.name'],
+              [/=~|!=|=|!~/, 'operator'],
+              [/"/, {
+                token: 'string.quote',
+                bracket: '@open',
+                next: '@dblString'
+              }],
+              [/'/, {
+                token: 'string.quote',
+                bracket: '@open',
+                next: '@sglString'
+              }],
+              [/`/, {
+                token: 'string.quote',
+                bracket: '@open',
+                next: '@rawString'
+              }],
+              [/,/, 'delimiter']
+            ],
+            dblString: [
+              [/[^"\\]+/, 'string'],
+              [/\\./, 'string.escape'],
+              [/"/, {
+                token: 'string.quote',
+                bracket: '@close',
+                next: '@pop'
+              }]
+            ],
+            sglString: [
+              [/[^'\\]+/, 'string'],
+              [/\\./, 'string.escape'],
+              [/'/, {
+                token: 'string.quote',
+                bracket: '@close',
+                next: '@pop'
+              }]
+            ],
+            rawString: [
+              [/[^`]+/, 'string'],
+              [/`/, {
+                token: 'string.quote',
+                bracket: '@close',
+                next: '@pop'
+              }]
+            ]
+          }
+        });
+        monaco.languages.registerCompletionItemProvider('logql', {
+          triggerCharacters: ['{', '|', ' ', '('],
+          provideCompletionItems: function(model, position) {
+            var word = model.getWordUntilPosition(position);
+            var range = {
+              startLineNumber: position.lineNumber,
+              endLineNumber: position.lineNumber,
+              startColumn: word.startColumn,
+              endColumn: word.endColumn
+            };
+            var mk = monaco.languages.CompletionItemKind;
+            var SR = monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet;
+            var suggestions = [];
+            // Stream selector template
+            suggestions.push({
+              label: '{label="value"}',
+              kind: mk.Snippet,
+              detail: 'Log stream selector',
+              documentation: 'Select log streams matching a set of label matchers.',
+              insertText: '{${1:app}="${2:nodered}"}',
+              insertTextRules: SR,
+              range: range
+            });
+            // Metric query functions
+            [{
+              l: 'rate',
+              d: 'Per-second rate of log entries',
+              s: 'rate({${1:app}="${2}"} [${3:5m}])'
+            }, {
+              l: 'count_over_time',
+              d: 'Count of log entries over time range',
+              s: 'count_over_time({${1:app}="${2}"} [${3:5m}])'
+            }, {
+              l: 'bytes_rate',
+              d: 'Per-second byte rate of log entries',
+              s: 'bytes_rate({${1:app}="${2}"} [${3:5m}])'
+            }, {
+              l: 'bytes_over_time',
+              d: 'Total bytes of log entries over range',
+              s: 'bytes_over_time({${1:app}="${2}"} [${3:5m}])'
+            }, {
+              l: 'absent_over_time',
+              d: 'Returns 1 if no entries found in range',
+              s: 'absent_over_time({${1:app}="${2}"} [${3:5m}])'
+            }, {
+              l: 'sum_over_time',
+              d: 'Sum of unwrapped values over range',
+              s: 'sum_over_time({${1:app}="${2}"} | unwrap ${3:field} [${4:5m}])'
+            }, {
+              l: 'avg_over_time',
+              d: 'Average of unwrapped values over range',
+              s: 'avg_over_time({${1:app}="${2}"} | unwrap ${3:field} [${4:5m}])'
+            }, {
+              l: 'min_over_time',
+              d: 'Minimum of unwrapped values over range',
+              s: 'min_over_time({${1:app}="${2}"} | unwrap ${3:field} [${4:5m}])'
+            }, {
+              l: 'max_over_time',
+              d: 'Maximum of unwrapped values over range',
+              s: 'max_over_time({${1:app}="${2}"} | unwrap ${3:field} [${4:5m}])'
+            }, {
+              l: 'quantile_over_time',
+              d: 'Quantile of unwrapped values',
+              s: 'quantile_over_time(${1:0.99}, {${2:app}="${3}"} | unwrap ${4:field} [${5:5m}])'
+            }, {
+              l: 'first_over_time',
+              d: 'First unwrapped value over range',
+              s: 'first_over_time({${1:app}="${2}"} | unwrap ${3:field} [${4:5m}])'
+            }, {
+              l: 'last_over_time',
+              d: 'Last unwrapped value over range',
+              s: 'last_over_time({${1:app}="${2}"} | unwrap ${3:field} [${4:5m}])'
+            }, {
+              l: 'label_replace',
+              d: 'Replace label value using regex',
+              s: 'label_replace(${1:expr}, "${2:dst_label}", "${3:$1}", "${4:src_label}", "${5:(.*)}")'
+            }].forEach(function(f) {
+              suggestions.push({
+                label: f.l,
+                kind: mk.Function,
+                detail: f.d,
+                insertText: f.s,
+                insertTextRules: SR,
+                range: range
+              });
+            });
+            // Aggregation operators
+            [{
+              l: 'sum',
+              d: 'Sum over dimensions'
+            }, {
+              l: 'avg',
+              d: 'Average over dimensions'
+            }, {
+              l: 'min',
+              d: 'Minimum over dimensions'
+            }, {
+              l: 'max',
+              d: 'Maximum over dimensions'
+            }, {
+              l: 'count',
+              d: 'Count over dimensions'
+            }, {
+              l: 'stddev',
+              d: 'Standard deviation'
+            }, {
+              l: 'stdvar',
+              d: 'Standard variance'
+            }, {
+              l: 'bottomk',
+              d: 'Smallest k elements',
+              s: 'bottomk(${1:5}, ${2:expr})'
+            }, {
+              l: 'topk',
+              d: 'Largest k elements',
+              s: 'topk(${1:5}, ${2:expr})'
+            }].forEach(function(a) {
+              var snippet = a.s || (a.l + '(${1:by (${2:label})}) (${3:expr})');
+              suggestions.push({
+                label: a.l,
+                kind: mk.Keyword,
+                detail: a.d,
+                insertText: snippet,
+                insertTextRules: SR,
+                range: range
+              });
+            });
+            // Pipeline stages
+            [{
+              l: '|= "..."',
+              s: '|= "${1}"',
+              d: 'Filter: line contains string'
+            }, {
+              l: '!= "..."',
+              s: '!= "${1}"',
+              d: 'Filter: line does not contain string'
+            }, {
+              l: '|~ "..."',
+              s: '|~ "${1}"',
+              d: 'Filter: line matches regex'
+            }, {
+              l: '!~ "..."',
+              s: '!~ "${1}"',
+              d: 'Filter: line does not match regex'
+            }, {
+              l: '| json',
+              s: '| json',
+              d: 'Parse JSON log line'
+            }, {
+              l: '| logfmt',
+              s: '| logfmt',
+              d: 'Parse logfmt log line'
+            }, {
+              l: '| pattern "..."',
+              s: '| pattern "${1:<_> level=<level> <_>}"',
+              d: 'Parse using pattern'
+            }, {
+              l: '| regexp "..."',
+              s: '| regexp "${1:(?P<level>[a-z]+)}"',
+              d: 'Parse using named regex groups'
+            }, {
+              l: '| line_format "..."',
+              s: '| line_format "${1:{{.level\}} {{.msg\}}}"',
+              d: 'Reformat the log line'
+            }, {
+              l: '| label_format',
+              s: '| label_format ${1:new_label}=${2:old_label}',
+              d: 'Rename or transform labels'
+            }, {
+              l: '| unwrap',
+              s: '| unwrap ${1:label}',
+              d: 'Extract numeric value for metric queries'
+            }, {
+              l: '| unpack',
+              s: '| unpack',
+              d: 'Unpack JSON log fields into labels'
+            }, {
+              l: '| drop',
+              s: '| drop ${1:label}',
+              d: 'Drop specified labels'
+            }, {
+              l: '| keep',
+              s: '| keep ${1:label}',
+              d: 'Keep only specified labels'
+            }, {
+              l: '| decolorize',
+              s: '| decolorize',
+              d: 'Strip ANSI colour codes'
+            }].forEach(function(p) {
+              suggestions.push({
+                label: p.l,
+                kind: mk.Operator,
+                detail: p.d,
+                insertText: p.s,
+                insertTextRules: SR,
+                range: range
+              });
+            });
+            // Keywords
+            ['by', 'without', 'on', 'or', 'and', 'unless', 'bool', 'offset', 'ignoring'].forEach(function(kw) {
+              suggestions.push({
+                label: kw,
+                kind: mk.Keyword,
+                insertText: kw,
+                range: range
+              });
+            });
+            return {
+              suggestions: suggestions
+            };
+          }
+        });
+      }
+      var editor = monaco.editor.create(document.getElementById(elementId), {
+        value: initialValue || '',
+        language: 'logql',
+        automaticLayout: true,
+        minimap: {
+          enabled: false
+        },
+        lineNumbers: 'off',
+        wordWrap: 'on',
+        scrollBeyondLastLine: false,
+        fontSize: 13,
+        overviewRulerLanes: 0,
+        folding: false,
+        padding: {
+          top: 6,
+          bottom: 6
+        }
+      });
+      return {
+        getValue: function() {
+          return editor.getValue();
+        },
+        dispose: function() {
+          editor.dispose();
+        }
+      };
+    };
+
+</script>
+<!-- logger -->
+<style>
+    .editorgroupborder {
+      border-width: 1px;
+      border-style: solid;
+      border-color: lightgray;
+      padding: 3px;
+      margin-top: 2px;
+      margin-bottom: 2px;
+    }
+
+    .editorsectionheading {
+      font-weight: 600;
+      margin-bottom: 1px !important;
+      margin-top: 6px !important;
+    }
+
+    .nomargin {
+      margin-bottom: 1px !important;
+      margin-top: 1px !important;
+    }
+
+    .slidecontainer {
+      width: 100%;
+    }
+
+    .slider {
+      -webkit-appearance: none;
+      appearance: none;
+      width: 100%;
+      height: 25px;
+      background: #d3d3d3;
+      outline: none;
+      opacity: 0.7;
+      -webkit-transition: .2s;
+      transition: opacity .2s;
+    }
+
+    .slider:hover {
+      opacity: 1;
+    }
+
+    .slider::-webkit-slider-thumb {
+      -webkit-appearance: none;
+      appearance: none;
+      width: 25px;
+      height: 25px;
+      background: #04AA6D;
+      cursor: pointer;
+    }
+
+    .slider::-moz-range-thumb {
+      width: 25px;
+      height: 25px;
+      background: #04AA6D;
+      cursor: pointer;
+    }
+
+    .towb_editorlabel {
+      width: 120px !important;
+    }
+
+    input.towb_editorfield,
+    select.towb_editorfield,
+    textarea.towb_editorfield {
+      width: 70% !important;
+    }
+
+    input.towb_editorfield_short,
+    select.towb_editorfield_short {
+      width: 30% !important;
+    }
+
+</style>
+<script type="text/javascript">
+    // CSS
+    dropdownStyles = `
+    .loggertype-dropdown {
+        position: absolute;
+        background: white;
+        border: 1px solid #ccc;
+        border-radius: 4px;
+        box-shadow: 0 2px 8px rgba(0,0,0,0.15);
+        max-height: 150px;
+        overflow-y: auto;
+        z-index: 1000;
+        min-width: 150px;
+    }
+    .loggertype-dropdown .dropdown-item {
+        padding: 6px 12px;
+        cursor: pointer;
+    }
+    .loggertype-dropdown .dropdown-item:hover {
+        background: #f0f0f0;
+    }
+    `;
+    $('<style>').text(dropdownStyles).appendTo('head');
+
+</script>
+<script type="text/javascript">
+    RED.nodes.registerType('LokiQueryNode', {
+      category: 'loki',
+      icon: 'loki.png',
+      color: '#8D7974',
+      labelStyle: 'node_label_white',
+      label: function() {
+        return this.name
+      },
+      paletteLabel: 'Loki Query',
+      inputs: 1,
+      inputLabels: (i) => 'input',
+      outputs: 1,
+      outputLabels: (i) => ['logLines'][i],
+      defaults: {
+        name: {
+          value: 'Loki Query',
+          required: true
+        },
+        lokiservice: {
+          type: 'LokiServiceConfigNode',
+          required: true
+        },
+        query: {
+          value: '{app="nodered"}',
+          required: true
+        },
+        start: {
+          value: '1h',
+          required: true
+        },
+        start_type: {
+          value: 'relative',
+          required: false
+        },
+        end: {
+          value: '',
+          required: false
+        },
+        end_type: {
+          value: 'now',
+          required: false
+        },
+        outputpath: {
+          value: 'payload',
+          required: false
+        },
+        batchMode: {
+          required: false
+        },
+        logEnabled: {
+          value: false,
+          required: true
+        },
+        logger: {
+          required: false,
+          value: '',
+          type: 'DelegatedConfigReferenceNode'
+        },
+        logTemplateOverrideEnabled: {
+          value: false
+        },
+        logTemplateOverride: {
+          value: 'message:{{msg}}'
+        },
+      },
+      oneditprepare: function() {
+        // **** LokiQueryNode **** //
+        {
+          let durationRegex = /^\d+(ms|s|m|h|d|w)$/i;
+          let timeTypes = [{
+            value: "relative",
+            label: "Relative",
+            icon: "fa fa-clock-o",
+            validate: function(v) {
+              return durationRegex.test(v);
+            },
+            hasValue: true
+          }, {
+            value: "absolute",
+            label: "Date/Time",
+            icon: "fa fa-calendar",
+            validate: function(v) {
+              return !isNaN(Date.parse(v));
+            },
+            hasValue: true
+          }];
+          $("#node-input-start").typedInput({
+            types: timeTypes,
+            default: "relative",
+            typeField: "#node-input-start_type"
+          });
+          $("#node-input-end").typedInput({
+            types: [{
+              value: "now",
+              label: "Now",
+              icon: "fa fa-circle",
+              hasValue: false
+            }].concat(timeTypes),
+            default: "now",
+            typeField: "#node-input-end_type"
+          });
+          $("#node-input-outputpath").typedInput({
+            types: ["msg"]
+          });
+          $("#node-input-batchMode").prop("checked", this.batchMode === true);
+          this.queryEditor = PluginCore.createLogQLEditor("node-input-query-editor", this.query || "");
+        }
+        // **** logger **** //
+        {
+          let node = this;
+          // controls.
+          let logEnabled = $("#node-input-logEnabled");
+          let logTemplateEnabled = $("#node-input-logTemplateOverrideEnabled");
+          let logTemplateEnabledSection = $("#section_logTemplateOverrideEnabled");
+          let logEnabledSection = $("#section_logEnabled");
+          // functions.
+          let getLoggerTypes = async function() {
+            let types = [];
+            await $.ajax({
+              url: "nodetypeservice/find?tag=LoggerType",
+              type: "GET",
+              contentType: "application/json; charset=utf-8",
+              data: JSON.stringify({
+                id: node.id
+              }),
+              success: (response) => {
+                types = response;
+              },
+              error: (jqXHR, textStatus, errorThrown) => {
+                console.log(jqXHR, textStatus, errorThrown);
+              },
+            });
+            return types;
+          }
+          let getLoggers = async () => {
+            let loggers = [];
+            // get the list of types again.
+            let loggerTypes = (await getLoggerTypes()).map(type => type.id);
+            // add all of the known loggers.
+            RED.nodes.eachConfig(cfg => {
+              if (loggerTypes.includes(cfg.type)) {
+                loggers.push({
+                  id: cfg.id,
+                  name: cfg.label(),
+                  type: cfg.type
+                });
+              }
+            });
+            return loggers;
+          };
+          let updateLoggerSelectorList = async () => {
+            loggerSelector.empty();
+            (await getLoggers()).forEach(logger => {
+              $('<option value="' + logger.id + '">' + logger.name + '</option>').appendTo(loggerSelector);
+            });
+            $('<option value="_ADD_">none</option>').appendTo(loggerSelector);
+          }
+          logEnabled.on('change', function() {
+            if (logEnabled.prop("checked")) {
+              logEnabledSection.show();
+              node._def.defaults.logger.required = true;
+            } else {
+              logEnabledSection.hide()
+              node._def.defaults.logger.required = false;
+            }
+          });
+          logTemplateEnabled.on('change', function() {
+            if (logTemplateEnabled.prop("checked")) {
+              logTemplateEnabledSection.show();
+              node._def.defaults.logTemplateOverride.required = true;
+            } else {
+              logTemplateEnabledSection.hide()
+              node._def.defaults.logTemplateOverride.required = false;
+            }
+          });
+          node.logTemplateOverrideEditor = RED.editor.createEditor({
+            id: 'node-input-logTemplateOverrideEditor',
+            mode: 'ace/mode/handlebars',
+            value: node.logTemplateOverride
+          });
+          let loggerSelector = $("#logger-selector");
+          let loggerEditButton = $("#logger-edit-btn");
+          let loggerAddButton = $("#logger-add-btn");
+          loggerEditButton.on('click', async function(event) {
+            event.stopPropagation();
+            if (loggerEditButton.hasClass("disabled")) {
+              return;
+            }
+            // figure out what type of logger this is.
+            let selectedLogger = (await getLoggers()).find(logger => logger.id === loggerSelector.val());
+            RED.editor.editConfig("#logger-selector", selectedLogger.type, selectedLogger.id);
+          });
+          loggerAddButton.on('click', function(event) {
+            event.stopPropagation();
+            let $btn = $(event.target);
+            // Remove any existing dropdown
+            $('.loggertype-dropdown').remove();
+            getLoggerTypes().then(loggerTypes => {
+              let $dropdown = $('<div class="loggertype-dropdown red-ui-editor"></div>');
+              loggerTypes.forEach(loggerType => {
+                $('<div class="dropdown-item"></div>').text(loggerType.name).data('value', loggerType.id).css({
+                  padding: '4px 8px',
+                  cursor: 'pointer'
+                }).appendTo($dropdown);
+              });
+              // Append first so outerWidth() is measurable, then position so the
+              // right edge of the dropdown aligns with the right edge of the button.
+              $('body').append($dropdown);
+              $dropdown.css({
+                top: $btn.offset().top + $btn.outerHeight(),
+                left: $btn.offset().left + $btn.outerWidth() - $dropdown.outerWidth()
+              });
+              $(document).on('mousedown.dropdown', function(e) {
+                if (!$(e.target).closest('.loggertype-dropdown').length) {
+                  $dropdown.remove();
+                  $(document).off('mousedown.dropdown'); // Clean up the listener
+                }
+              });
+              // Handle item selection
+              $dropdown.on('click', '.dropdown-item', function(e) {
+                e.stopPropagation();
+                const selectedValue = $(this).data('value');
+                const selectedText = $(this).text();
+                // Do whatever you need with the selection
+                console.log('Selected:', selectedValue, selectedText);
+                $dropdown.remove();
+                RED.editor.editConfig("#logger-selector", selectedValue, "_ADD_");
+              });
+            })
+          });
+          loggerSelector.on("focus", updateLoggerSelectorList);
+          loggerSelector.on('change', function(event) {
+            if ("_ADD_" === loggerSelector.val()) {
+              loggerEditButton.addClass("disabled")
+            } else {
+              loggerEditButton.removeClass("disabled")
+            }
+          });
+          // lastly, make sure that we set the correct value on the logger selector.
+          updateLoggerSelectorList().then(() => {
+            loggerSelector.val(node.logger);
+            loggerSelector.trigger('change');
+          });
+        }
+      },
+      oneditsave: function() {
+        // **** LokiQueryNode **** //
+        {
+          this.query = this.queryEditor.getValue();
+          this.batchMode = $("#node-input-batchMode").is(":checked");
+          this.queryEditor.dispose();
+          delete this.queryEditor;
+        }
+        // **** logger **** //
+        {
+          node = this;
+          var selectedLogger = $("#logger-selector").val();
+          node.logger = (selectedLogger && selectedLogger !== "_ADD_") ? selectedLogger : '';
+          node.logTemplateOverride = node.logTemplateOverrideEditor.getValue();
+          node.logTemplateOverrideEditor.destroy();
+          delete node.logTemplateOverrideEditor;
+        }
+      },
+      oneditcancel: function() {
+        // **** LokiQueryNode **** //
+        {
+          if (this.queryEditor) {
+            this.queryEditor.dispose();
+            delete this.queryEditor;
+          }
+        }
+      },
+      oneditdelete: function() {},
+    });
+
+</script>
+
+
+<script type="text/html" data-template-name='LokiQueryNode'>
+    <div id='section_LokiQueryNode'>
+        <div class="form-row">
+            <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
+            <input type="text" id="node-input-name" />
+        </div>
+
+        <div class="form-row">
+            <label for="node-input-lokiservice"><i class="fa fa-server"></i> Loki Service</label>
+            <input type="text" id="node-input-lokiservice" />
+        </div>
+
+        <div class="form-row">
+            <label for="node-input-query-editor"><i class="fa fa-search"></i> Query</label>
+            <div id="node-input-query-editor" style="height:120px; min-height:80px; border:1px solid #ccc; border-radius:3px;"></div>
+        </div>
+
+        <div class="form-row">
+            <label for="node-input-start"><i class="fa fa-clock-o"></i> Start</label>
+            <input type="text" id="node-input-start" />
+            <input type="hidden" id="node-input-start_type" />
+        </div>
+
+        <div class="form-row">
+            <label for="node-input-end"><i class="fa fa-clock-o"></i> End</label>
+            <input type="text" id="node-input-end" />
+            <input type="hidden" id="node-input-end_type" />
+        </div>
+
+        <div class="form-row">
+            <label for="node-input-outputpath"><i class="fa fa-arrow-right"></i> Output Path</label>
+            <input type="text" id="node-input-outputpath" />
+        </div>
+
+        <div class="form-row">
+            <label for="node-input-batchMode"><i class="fa fa-list"></i> Batch Mode</label>
+            <input type="checkbox" id="node-input-batchMode" style="width:auto; margin-top:4px;" />
+            <span style="margin-left:6px; color:#888; font-size:0.9em;">Collect all results into a single array message</span>
+        </div>
+
+    </div>
+
+    <div id='section_logger'>
+        <div id="section_loggerconfig">
+            <div class="form-row editorsectionheading">
+                <i class="w-16 fa fa-eye"></i> <span>Logging</span>
+            </div>
+            <div class="editorgroupborder">
+                <div class="form-row nomargin logEnableCheck">
+                    <input type="checkbox" id="node-input-logEnabled" placeholder="logEnabled" value="false" style="margin:8px 0 10px 102px; width:20px;">
+                    <label style="width:auto" for="node-input-logEnabled"><span>Enable Logging</span></label>
+                </div>
+
+                <div id="section_logEnabled">
+                    <div class="form-row nomargin">
+                        <label for="logger-selector">Logger</label>
+                        <div style="width: 70%; display: inline-flex;">
+                            <select id="logger-selector" style="flex-grow: 1;" class="">
+                                <option value="_ADD_">none</option>
+                            </select>
+                            <a id="logger-edit-btn" class="red-ui-button disabled" style="margin-left: 10px;">
+                                <i class="fa fa-pencil"></i>
+                            </a>
+                            <a id="logger-add-btn" class="red-ui-button" style="margin-left: 10px;">
+                                <i class="fa fa-plus"></i>
+                            </a>
+                        </div>
+                    </div>
+
+                    <div class="form-row nomargin">
+                        <input type="checkbox" id="node-input-logTemplateOverrideEnabled" placeholder="" value="false" style="margin:8px 0 10px 102px; width:20px;">
+                        <label style="width:auto" for="node-input-logTemplateOverrideEnabled"><span>Override Template</span></label>
+                    </div>
+
+                    <div id="section_logTemplateOverrideEnabled">
+                        <div class="form-row">
+                            <label class="towb_editorlabel" for="node-input-logTemplateOverrideEditor"><i class="fa fa-code"></i> Template</label>
+                            <div style="height: 250px; min-height:150px;" class="node-text-editor" id="node-input-logTemplateOverrideEditor"></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+    </div>
+</script>
+
+<script type="text/markdown" data-help-name='LokiQueryNode'>
+Runs a LogQL query against a Grafana Loki instance and emits log lines as messages.
+
+### Properties
+
+: *name*         (string) : Display label for this node.
+: *loki service* (config) : The Loki Service config node that provides the connection URL and credentials.
+: *query*        (LogQL)  : The LogQL query to execute. A Monaco editor with LogQL syntax highlighting and completions is provided.
+: *start*        (time)   : Start of the query time range. Required. Accepts relative durations or absolute date/times.
+: *end*          (time)   : End of the query time range. Defaults to **Now**.
+: *output path*  (msg)    : Where in the output message to place each log line object. Defaults to `msg.payload`.
+: *batch mode*   (bool)   : When enabled, all results are collected into a single array message. When disabled (default), one message is emitted per log line.
+
+### Time formats
+
+The *start* and *end* fields accept:
+
+- **Relative** - `1h`, `30m`, `7d`, `2w` (subtracted from now at query time)
+- **Date/Time** - `2024-01-01T00:00:00Z` or any parseable date string
+
+### Query editor
+
+The query editor provides:
+- Syntax highlighting for stream selectors `\{app="nodered"\}`, pipeline stages, metric functions, and aggregation operators.
+- Snippet completions for all major LogQL constructs (trigger with `Ctrl+Space`).
+
+### Inputs
+
+: *msg*         : Any message. Used as a trigger.
+: *msg.query*   : *(optional)* Overrides the configured LogQL query.
+: *msg.start*   : *(optional)* Overrides the configured start time (parsed as relative or date string).
+: *msg.end*     : *(optional)* Overrides the configured end time.
+
+### Outputs
+
+**Individual mode** (default): one message per log line - a copy of the input message with the output path set to:
+
+```json
+\{
+  "timestamp": "2024-01-01T00:00:00.000Z",
+  "line": "the log message text",
+  "labels": \{ "app": "nodered", "level": "error" \}
+\}
+```
+
+**Batch mode**: a single message with the output path set to an array of the above objects.
+
+### Notes
+
+- Results are capped at **1 000 log lines** or **10 MB** of response data, whichever is reached first.
+- Lines are emitted in the order returned by Loki (oldest first within each stream).
+
+### Logging
+: *enable logging* (boolean)        : if checked, then the node will produce logging output to the specified logger.
+: *logger* (logconfig)              : the endppoint that the node will log events to.
+: *override template* (logconfig)   : if checked, a custom logging template can be provided for the log message.
+: *logger template* (mustache)      : a template in mustache format to generate a message for logging purposes (see LoggerConfig node for more information)
 </script>