feat(app/metrics): add warnings for embed misconfiguration (closes #1196)

source/app/metrics/index.mjs

@@ -4,7 +4,7 @@ import util from "util"
 import * as utils from "./utils.mjs"
 
 //Setup
-export default async function metrics({login, q}, {graphql, rest, plugins, conf, die = false, verify = false, convert = null, callbacks = null}, {Plugins, Templates}) {
+export default async function metrics({login, q}, {graphql, rest, plugins, conf, die = false, verify = false, convert = null, callbacks = null, warnings = []}, {Plugins, Templates}) {
   //Compute rendering
   try {
     //Debug
@@ -39,7 +39,7 @@ export default async function metrics({login, q}, {graphql, rest, plugins, conf,
         : null),
     }
     const extras = {css: imports.metadata.plugins.core.extras("extras_css", {...conf.settings, error: false}) ? q["extras.css"] ?? "" : "", js: imports.metadata.plugins.core.extras("extras_js", {...conf.settings, error: false}) ? q["extras.js"] ?? "" : ""}
-    const data = {q, animated: true, large: false, base: {}, config: {}, errors: [], plugins: {}, computed: {}, extras, postscripts: []}
+    const data = {q, animated: true, large: false, base: {}, config: {}, errors: [], warnings, plugins: {}, computed: {}, extras, postscripts: []}
     const experimental = new Set(decodeURIComponent(q["experimental.features"] ?? "").split(" ").map(x => x.trim().toLocaleLowerCase()).filter(x => x))
     if (conf.settings["debug.headless"])
       imports.puppeteer.headless = false
@@ -139,8 +139,14 @@ export default async function metrics({login, q}, {graphql, rest, plugins, conf,
           q.config_animations = false
         }
         q = Object.fromEntries([...Object.entries(q).map(([key, value]) => [key.replace(/^plugin_/, "").replace(/_/g, "."), value]), ["base", false]])
+        //Check users errors
+        const warnings = []
+        if ((!Object.keys(Plugins).filter(key => q[key]).length)&&(!parts.length))
+          warnings.push({warning:{message:"No plugin were selected"}})
+        const ineffective = Object.keys(q).filter(key => (key.includes(".")) && (key.split(".").at(0) !== "base") && (key.split(".").at(0) in Plugins)).filter(key => !q[key.split(".").at(0)])
+        warnings.push(...ineffective.map(key => ({warning:{message:`"${key}" has no effect because "${key.split(".").at(0)}: true" is not set`}})))
         //Compute rendering
-        const {rendered} = await metrics({login, q}, {...arguments[1], convert: ["svg", "png", "jpeg"].includes(q["config.output"]) ? q["config.output"] : null}, arguments[2])
+        const {rendered} = await metrics({login, q}, {...arguments[1], convert: ["svg", "png", "jpeg"].includes(q["config.output"]) ? q["config.output"] : null, warnings}, arguments[2])
         console.debug(`metrics/compute/${login}/embed > ${name} > success >>>>>>>>>>>>>>>>>>>>>>`)
         return `<img class="metrics-cacheable" data-name="${name}" src="data:image/${{png: "png", jpeg: "jpeg"}[q["config.output"]] ?? "svg+xml"};base64,${Buffer.from(rendered).toString("base64")}">`
       }

source/templates/classic/image.svg

@@ -6,6 +6,17 @@
 
   <foreignObject x="0" y="0" width="100%" height="100%">
     <div xmlns="http://www.w3.org/1999/xhtml" xmlns:xlink="http://www.w3.org/1999/xlink" class="items-wrapper">
+      <% if (warnings.length) { %>
+        <section>
+          <div class="row">
+            <div class="field warning">
+              <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M8.22 1.754a.25.25 0 00-.44 0L1.698 13.132a.25.25 0 00.22.368h12.164a.25.25 0 00.22-.368L8.22 1.754zm-1.763-.707c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0114.082 15H1.918a1.75 1.75 0 01-1.543-2.575L6.457 1.047zM9 11a1 1 0 11-2 0 1 1 0 012 0zm-.25-5.25a.75.75 0 00-1.5 0v2.5a.75.75 0 001.5 0v-2.5z"></path></svg>
+              <%= warnings.map(({warning}) => warning.message).join(", ") %>
+            </div>
+          </div>
+        </section>
+      <% } %>
+
       <% for (const partial of [...partials]) { %>
         <%- await include(`partials/${partial}.ejs`) %>
       <% } %>

source/templates/classic/style.css

@@ -103,6 +103,12 @@
   .field.error svg {
     fill: #cb2431;
   }
+  .field.warning {
+    color: #D79533;
+  }
+  .field.warning svg {
+    fill: #D79533;
+  }
 
 /* Displays */
   .row {

source/templates/repository/image.svg

@@ -7,6 +7,16 @@
 
   <foreignObject x="0" y="0" width="100%" height="100%">
     <div xmlns="http://www.w3.org/1999/xhtml" xmlns:xlink="http://www.w3.org/1999/xlink">
+      <% if (warnings.length) { %>
+        <section>
+          <div class="row">
+            <div class="field warning">
+              <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path fill-rule="evenodd" d="M8.22 1.754a.25.25 0 00-.44 0L1.698 13.132a.25.25 0 00.22.368h12.164a.25.25 0 00.22-.368L8.22 1.754zm-1.763-.707c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0114.082 15H1.918a1.75 1.75 0 01-1.543-2.575L6.457 1.047zM9 11a1 1 0 11-2 0 1 1 0 012 0zm-.25-5.25a.75.75 0 00-1.5 0v2.5a.75.75 0 001.5 0v-2.5z"></path></svg>
+              <%= warnings.map(({warning}) => warning.message).join(", ") %>
+            </div>
+          </div>
+        </section>
+      <% } %>
 
       <% if (errors.length) { %>
         <section>

source/templates/terminal/image.svg

@@ -51,6 +51,7 @@ WARRANTY, to the extent permitted by applicable law.
 
 Last generated: <%= meta.generated %>
 </div><% } -%>
+<% if (warnings.length) { %><div class="warnings"><%- warnings.map(({warning}) => `WARN: ${warning.message}`).join("<br/>") %></div><% } %><%# -%>
 <% for (const partial of [...partials]) { %><%- await include(`partials/${partial}.ejs`) %><% } -%>
 <% if (base.metadata) { -%>
 

source/templates/terminal/style.css

@@ -62,6 +62,10 @@
   .banner, footer {
     color: #AE9DA7;
   }
+  .warnings {
+    color: #D79533;
+    white-space: normal;
+  }
 
 /* Isocalendar */
   .isocalendar svg {