@saltcorn/server 0.6.2-beta.2 → 0.6.2-beta.3

package/public/ckeditor/skins/moono-lisa/readme.md

@@ -0,0 +1,46 @@
+"Moono-lisa" Skin
+=================
+
+This skin has been made a **default skin** starting from CKEditor 4.6.0 and is maintained by the core developers.
+
+For more information about skins, please check the [CKEditor Skin SDK](https://ckeditor.com/docs/ckeditor4/latest/guide/skin_sdk_intro.html)
+documentation.
+
+Features
+-------------------
+"Moono-lisa" is a monochromatic skin, which offers a modern, flat and minimalistic look which blends very well in modern design.
+It comes with the following features:
+
+- Chameleon feature with brightness.
+- High-contrast compatibility.
+- Graphics source provided in SVG.
+
+Directory Structure
+-------------------
+
+CSS parts:
+- **editor.css**: the main CSS file. It's simply loading several other files, for easier maintenance,
+- **mainui.css**: the file contains styles of entire editor outline structures,
+- **toolbar.css**: the file contains styles of the editor toolbar space (top),
+- **richcombo.css**: the file contains styles of the rich combo ui elements on toolbar,
+- **panel.css**: the file contains styles of the rich combo drop-down, it's not loaded
+until the first panel open up,
+- **elementspath.css**: the file contains styles of the editor elements path bar (bottom),
+- **menu.css**: the file contains styles of all editor menus including context menu and button drop-down,
+it's not loaded until the first menu open up,
+- **dialog.css**: the CSS files for the dialog UI, it's not loaded until the first dialog open,
+- **reset.css**: the file defines the basis of style resets among all editor UI spaces,
+- **preset.css**: the file defines the default styles of some UI elements reflecting the skin preference,
+- **editor_XYZ.css** and **dialog_XYZ.css**: browser specific CSS hacks.
+
+Other parts:
+- **skin.js**: the only JavaScript part of the skin that registers the skin, its browser specific files and its icons and defines the Chameleon feature,
+- **images/**: contains a fill general used images,
+- **dev/**: contains SVG and PNG source of the skin icons.
+
+License
+-------
+
+Copyright (c) 2003-2021, CKSource - Frederico Knabben. All rights reserved.
+
+For licensing, see LICENSE.md or [https://ckeditor.com/legal/ckeditor-oss-license](https://ckeditor.com/legal/ckeditor-oss-license)

package/public/ckeditor/styles.js

@@ -0,0 +1,137 @@
+/**
+ * Copyright (c) 2003-2021, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+// This file contains style definitions that can be used by CKEditor plugins.
+//
+// The most common use for it is the "stylescombo" plugin which shows the Styles drop-down
+// list containing all styles in the editor toolbar. Other plugins, like
+// the "div" plugin, use a subset of the styles for their features.
+//
+// If you do not have plugins that depend on this file in your editor build, you can simply
+// ignore it. Otherwise it is strongly recommended to customize this file to match your
+// website requirements and design properly.
+//
+// For more information refer to: https://ckeditor.com/docs/ckeditor4/latest/guide/dev_styles.html#style-rules
+
+CKEDITOR.stylesSet.add( 'default', [
+	/* Block styles */
+
+	// These styles are already available in the "Format" drop-down list ("format" plugin),
+	// so they are not needed here by default. You may enable them to avoid
+	// placing the "Format" combo in the toolbar, maintaining the same features.
+	/*
+	{ name: 'Paragraph',		element: 'p' },
+	{ name: 'Heading 1',		element: 'h1' },
+	{ name: 'Heading 2',		element: 'h2' },
+	{ name: 'Heading 3',		element: 'h3' },
+	{ name: 'Heading 4',		element: 'h4' },
+	{ name: 'Heading 5',		element: 'h5' },
+	{ name: 'Heading 6',		element: 'h6' },
+	{ name: 'Preformatted Text',element: 'pre' },
+	{ name: 'Address',			element: 'address' },
+	*/
+
+	{ name: 'Italic Title',		element: 'h2', styles: { 'font-style': 'italic' } },
+	{ name: 'Subtitle',			element: 'h3', styles: { 'color': '#aaa', 'font-style': 'italic' } },
+	{
+		name: 'Special Container',
+		element: 'div',
+		styles: {
+			padding: '5px 10px',
+			background: '#eee',
+			border: '1px solid #ccc'
+		}
+	},
+
+	/* Inline styles */
+
+	// These are core styles available as toolbar buttons. You may opt enabling
+	// some of them in the Styles drop-down list, removing them from the toolbar.
+	// (This requires the "stylescombo" plugin.)
+	/*
+	{ name: 'Strong',			element: 'strong', overrides: 'b' },
+	{ name: 'Emphasis',			element: 'em'	, overrides: 'i' },
+	{ name: 'Underline',		element: 'u' },
+	{ name: 'Strikethrough',	element: 'strike' },
+	{ name: 'Subscript',		element: 'sub' },
+	{ name: 'Superscript',		element: 'sup' },
+	*/
+
+	{ name: 'Marker',			element: 'span', attributes: { 'class': 'marker' } },
+
+	{ name: 'Big',				element: 'big' },
+	{ name: 'Small',			element: 'small' },
+	{ name: 'Typewriter',		element: 'tt' },
+
+	{ name: 'Computer Code',	element: 'code' },
+	{ name: 'Keyboard Phrase',	element: 'kbd' },
+	{ name: 'Sample Text',		element: 'samp' },
+	{ name: 'Variable',			element: 'var' },
+
+	{ name: 'Deleted Text',		element: 'del' },
+	{ name: 'Inserted Text',	element: 'ins' },
+
+	{ name: 'Cited Work',		element: 'cite' },
+	{ name: 'Inline Quotation',	element: 'q' },
+
+	{ name: 'Language: RTL',	element: 'span', attributes: { 'dir': 'rtl' } },
+	{ name: 'Language: LTR',	element: 'span', attributes: { 'dir': 'ltr' } },
+
+	/* Object styles */
+
+	{
+		name: 'Styled Image (left)',
+		element: 'img',
+		attributes: { 'class': 'left' }
+	},
+
+	{
+		name: 'Styled Image (right)',
+		element: 'img',
+		attributes: { 'class': 'right' }
+	},
+
+	{
+		name: 'Compact Table',
+		element: 'table',
+		attributes: {
+			cellpadding: '5',
+			cellspacing: '0',
+			border: '1',
+			bordercolor: '#ccc'
+		},
+		styles: {
+			'border-collapse': 'collapse'
+		}
+	},
+
+	{ name: 'Borderless Table',		element: 'table',	styles: { 'border-style': 'hidden', 'background-color': '#E6E6FA' } },
+	{ name: 'Square Bulleted List',	element: 'ul',		styles: { 'list-style-type': 'square' } },
+
+	/* Widget styles */
+
+	{ name: 'Clean Image', type: 'widget', widget: 'image', attributes: { 'class': 'image-clean' } },
+	{ name: 'Grayscale Image', type: 'widget', widget: 'image', attributes: { 'class': 'image-grayscale' } },
+
+	{ name: 'Featured Snippet', type: 'widget', widget: 'codeSnippet', attributes: { 'class': 'code-featured' } },
+
+	{ name: 'Featured Formula', type: 'widget', widget: 'mathjax', attributes: { 'class': 'math-featured' } },
+
+	{ name: '240p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-240p' }, group: 'size' },
+	{ name: '360p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-360p' }, group: 'size' },
+	{ name: '480p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-480p' }, group: 'size' },
+	{ name: '720p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-720p' }, group: 'size' },
+	{ name: '1080p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-1080p' }, group: 'size' },
+
+	// Adding space after the style name is an intended workaround. For now, there
+	// is no option to create two styles with the same name for different widget types. See https://dev.ckeditor.com/ticket/16664.
+	{ name: '240p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-240p' }, group: 'size' },
+	{ name: '360p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-360p' }, group: 'size' },
+	{ name: '480p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-480p' }, group: 'size' },
+	{ name: '720p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-720p' }, group: 'size' },
+	{ name: '1080p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-1080p' }, group: 'size' }
+
+] );
+

package/public/ckeditor/vendor/promise.js

@@ -0,0 +1,13 @@
+(function(v,w){"object"===typeof exports&&"undefined"!==typeof module?module.exports=w():"function"===typeof define&&define.amd?define(w):v.ES6Promise=w()})(this,function(){function v(a){return"function"===typeof a}function w(){return function(){return process.nextTick(n)}}function R(){return"undefined"!==typeof B?function(){B(n)}:C()}function S(){var a=0,b=new J(n),c=document.createTextNode("");b.observe(c,{characterData:!0});return function(){c.data=a=++a%2}}function T(){var a=new MessageChannel;
+a.port1.onmessage=n;return function(){return a.port2.postMessage(0)}}function C(){var a=setTimeout;return function(){return a(n,1)}}function n(){for(var a=0;a<k;a+=2)(0,q[a])(q[a+1]),q[a]=void 0,q[a+1]=void 0;k=0}function U(){try{var a=Function("return this")().require("vertx");B=a.runOnLoop||a.runOnContext;return R()}catch(b){return C()}}function D(a,b){var c=this,d=new this.constructor(r);void 0===d[z]&&K(d);var e=c._state;if(e){var f=arguments[e-1];l(function(){return L(e,d,f,c._result)})}else E(c,
+d,a,b);return d}function F(a){if(a&&"object"===typeof a&&a.constructor===this)return a;var b=new this(r);x(b,a);return b}function r(){}function M(a){try{return a.then}catch(b){return p.error=b,p}}function V(a,b,c,d){try{a.call(b,c,d)}catch(e){return e}}function W(a,b,c){l(function(a){var e=!1,f=V(c,b,function(c){e||(e=!0,b!==c?x(a,c):m(a,c))},function(b){e||(e=!0,g(a,b))},"Settle: "+(a._label||" unknown promise"));!e&&f&&(e=!0,g(a,f))},a)}function X(a,b){b._state===y?m(a,b._result):b._state===t?g(a,
+b._result):E(b,void 0,function(b){return x(a,b)},function(b){return g(a,b)})}function N(a,b,c){b.constructor===a.constructor&&c===D&&b.constructor.resolve===F?X(a,b):c===p?(g(a,p.error),p.error=null):void 0===c?m(a,b):v(c)?W(a,b,c):m(a,b)}function x(a,b){if(a===b)g(a,new TypeError("You cannot resolve a promise with itself"));else{var c=typeof b;null===b||"object"!==c&&"function"!==c?m(a,b):N(a,b,M(b))}}function Y(a){a._onerror&&a._onerror(a._result);G(a)}function m(a,b){a._state===u&&(a._result=b,
+a._state=y,0!==a._subscribers.length&&l(G,a))}function g(a,b){a._state===u&&(a._state=t,a._result=b,l(Y,a))}function E(a,b,c,d){var e=a._subscribers,f=e.length;a._onerror=null;e[f]=b;e[f+y]=c;e[f+t]=d;0===f&&a._state&&l(G,a)}function G(a){var b=a._subscribers,c=a._state;if(0!==b.length){for(var d=void 0,e=void 0,f=a._result,g=0;g<b.length;g+=3)d=b[g],e=b[g+c],d?L(c,d,e,f):e(f);a._subscribers.length=0}}function L(a,b,c,d){var e=v(c),f=void 0,h=void 0,k=void 0,l=void 0;if(e){try{f=c(d)}catch(n){p.error=
+n,f=p}f===p?(l=!0,h=f.error,f.error=null):k=!0;if(b===f){g(b,new TypeError("A promises callback cannot return that same promise."));return}}else f=d,k=!0;b._state===u&&(e&&k?x(b,f):l?g(b,h):a===y?m(b,f):a===t&&g(b,f))}function Z(a,b){try{b(function(b){x(a,b)},function(b){g(a,b)})}catch(c){g(a,c)}}function K(a){a[z]=O++;a._state=void 0;a._result=void 0;a._subscribers=[]}var H=void 0,P=H=Array.isArray?Array.isArray:function(a){return"[object Array]"===Object.prototype.toString.call(a)},k=0,B=void 0,
+I=void 0,l=function(a,b){q[k]=a;q[k+1]=b;k+=2;2===k&&(I?I(n):Q())},A=(H="undefined"!==typeof window?window:void 0)||{},J=A.MutationObserver||A.WebKitMutationObserver,A="undefined"===typeof self&&"undefined"!==typeof process&&"[object process]"==={}.toString.call(process),aa="undefined"!==typeof Uint8ClampedArray&&"undefined"!==typeof importScripts&&"undefined"!==typeof MessageChannel,q=Array(1E3),Q=void 0,Q=A?w():J?S():aa?T():void 0===H&&"function"===typeof require?U():C(),z=Math.random().toString(36).substring(2),
+u=void 0,y=1,t=2,p={error:null},O=0,ba=function(){function a(a,c){this._instanceConstructor=a;this.promise=new a(r);this.promise[z]||K(this.promise);P(c)?(this._remaining=this.length=c.length,this._result=Array(this.length),0===this.length?m(this.promise,this._result):(this.length=this.length||0,this._enumerate(c),0===this._remaining&&m(this.promise,this._result))):g(this.promise,Error("Array Methods must be provided an Array"))}a.prototype._enumerate=function(a){for(var c=0;this._state===u&&c<a.length;c++)this._eachEntry(a[c],
+c)};a.prototype._eachEntry=function(a,c){var d=this._instanceConstructor,e=d.resolve;e===F?(e=M(a),e===D&&a._state!==u?this._settledAt(a._state,c,a._result):"function"!==typeof e?(this._remaining--,this._result[c]=a):d===h?(d=new d(r),N(d,a,e),this._willSettleAt(d,c)):this._willSettleAt(new d(function(c){return c(a)}),c)):this._willSettleAt(e(a),c)};a.prototype._settledAt=function(a,c,d){var e=this.promise;e._state===u&&(this._remaining--,a===t?g(e,d):this._result[c]=d);0===this._remaining&&m(e,this._result)};
+a.prototype._willSettleAt=function(a,c){var d=this;E(a,void 0,function(a){return d._settledAt(y,c,a)},function(a){return d._settledAt(t,c,a)})};return a}(),h=function(){function a(b){this[z]=O++;this._result=this._state=void 0;this._subscribers=[];if(r!==b){if("function"!==typeof b)throw new TypeError("You must pass a resolver function as the first argument to the promise constructor");if(this instanceof a)Z(this,b);else throw new TypeError("Failed to construct 'Promise': Please use the 'new' operator, this object constructor cannot be called as a function.");
+}}a.prototype["catch"]=function(a){return this.then(null,a)};a.prototype["finally"]=function(a){var c=this.constructor;return v(a)?this.then(function(d){return c.resolve(a()).then(function(){return d})},function(d){return c.resolve(a()).then(function(){throw d;})}):this.then(a,a)};return a}();h.prototype.then=D;h.all=function(a){return(new ba(this,a)).promise};h.race=function(a){var b=this;return P(a)?new b(function(c,d){for(var e=a.length,f=0;f<e;f++)b.resolve(a[f]).then(c,d)}):new b(function(a,
+b){return b(new TypeError("You must pass an array to race."))})};h.resolve=F;h.reject=function(a){var b=new this(r);g(b,a);return b};h._setScheduler=function(a){I=a};h._setAsap=function(a){l=a};h._asap=l;h.polyfill=function(){var a=void 0;if("undefined"!==typeof global)a=global;else if("undefined"!==typeof self)a=self;else try{a=Function("return this")()}catch(b){throw Error("polyfill failed because global object is unavailable in this environment");}var c=a.Promise;if(c){var d=null;try{d=Object.prototype.toString.call(c.resolve())}catch(e){}if("[object Promise]"===
+d&&!c.cast)return}a.Promise=h};return h.Promise=h});

package/public/saltcorn.css

@@ -81,13 +81,19 @@ div[data-inline-edit-dest-url]:hover .editicon {
 
   border-color: #95a5a6;
 }
-.search-bar input[type="search"] {
+.search-bar input[type="search"]:not(.hasbl) {
   border-left: none;
   border-color: #95a5a6;
   padding-left: 0.3rem;
   background-color: #ffffff;
 }
 
+.search-bar input[type="search"] {
+  border-color: #95a5a6;
+  padding-left: 0.3rem;
+  background-color: #ffffff;
+}
+
 .search-bar button.search-bar {
   border-color: #95a5a6;
   background-color: #ffffff;
@@ -95,10 +101,21 @@ div[data-inline-edit-dest-url]:hover .editicon {
 .search-bar button.dropdown-toggle {
   border-left: none;
 }
+
 #button-search-submit {
   border-right: none;
   padding-right: 0.3rem;
 }
+
+form.menusearch button {
+  border-left: none;
+  padding-right: 0.3rem;
+}
+
+.pl-2p5 {
+  padding-left: 0.75rem !important;
+}
+
 .br-none {
   border-right: none;
 }

package/public/saltcorn.js

@@ -638,3 +638,6 @@ function room_older(viewname, room_id, btn) {
     }
   );
 }
+function showHideCol(nm, e) {
+  $("#jsGrid").jsGrid("fieldOption", nm, "visible", e.checked);
+}

package/restart_watcher.js

@@ -18,6 +18,7 @@ const relevantPackages = [
   "postgres",
   "saltcorn-data",
   "saltcorn-markup",
+  "saltcorn-sbadmin2",
   "server",
   "sqlite",
 ];

package/routes/list.js

@@ -12,7 +12,17 @@ const Router = require("express-promise-router");
 
 const db = require("@saltcorn/data/db");
 const { mkTable, h, link, post_btn } = require("@saltcorn/markup");
-const { a, script, domReady, div, text } = require("@saltcorn/markup/tags");
+const {
+  a,
+  script,
+  domReady,
+  div,
+  text,
+  button,
+  input,
+  label,
+  form,
+} = require("@saltcorn/markup/tags");
 const Table = require("@saltcorn/data/models/table");
 const { isAdmin, error_catcher } = require("./utils");
 const moment = require("moment");
@@ -244,6 +254,42 @@ router.get(
               { href: `/table/${table.id || table.name}`, text: table.name },
               { text: req.__("Data") },
             ],
+            right: div(
+              { class: "dropdown" },
+              button(
+                {
+                  class: "btn btn-sm btn-outline-secondary dropdown-toggle",
+                  "data-boundary": "viewport",
+                  type: "button",
+                  id: "btnHideCols",
+                  "data-toggle": "dropdown",
+                  "aria-haspopup": "true",
+                  "aria-expanded": "false",
+                },
+                "Show/hide fields"
+              ),
+              div(
+                {
+                  class: "dropdown-menu",
+                  "aria-labelledby": "btnHideCols",
+                },
+                form(
+                  { class: "px-2" },
+                  fields.map((f) =>
+                    div(
+                      { class: "form-check" },
+                      input({
+                        type: "checkbox",
+                        onChange: `showHideCol('${f.name}', this)`,
+                        class: "form-check-input",
+                        checked: true,
+                      }),
+                      label(f.name)
+                    )
+                  )
+                )
+              )
+            ),
           },
           {
             type: "blank",
@@ -269,6 +315,7 @@ router.get(
          `)
               ),
               div({ id: "jsGridNotify" }),
+
               div({ id: "jsGrid" })
             ),
           },

package/routes/menu.js

@@ -15,11 +15,13 @@ const File = require("@saltcorn/data/models/file");
 const User = require("@saltcorn/data/models/user");
 const View = require("@saltcorn/data/models/view");
 const Page = require("@saltcorn/data/models/page");
+const { save_menu_items } = require("@saltcorn/data/models/config");
 const db = require("@saltcorn/data/db");
 
 const { mkTable, renderForm, link, post_btn } = require("@saltcorn/markup");
 const { script, domReady, div, ul } = require("@saltcorn/markup/tags");
 const { send_infoarch_page } = require("../markup/admin.js");
+const Table = require("@saltcorn/data/models/table");
 
 /**
  * @type {object}
@@ -40,6 +42,25 @@ const menuForm = async (req) => {
   const views = await View.find({}, { orderBy: "name", nocase: true });
   const pages = await Page.find({}, { orderBy: "name", nocase: true });
   const roles = await User.get_roles();
+  const tables = await Table.find({});
+  const dynTableOptions = tables.map((t) => t.name);
+  const dynOrderFieldOptions = {},
+    dynSectionFieldOptions = {};
+  for (const table of tables) {
+    dynOrderFieldOptions[table.name] = [""];
+    dynSectionFieldOptions[table.name] = [""];
+    const fields = await table.getFields();
+    for (const field of fields) {
+      dynOrderFieldOptions[table.name].push(field.name);
+      if (
+        field.type &&
+        field.type.name === "String" &&
+        field.attributes &&
+        field.attributes.options
+      )
+        dynSectionFieldOptions[table.name].push(field.name);
+    }
+  }
 
   return new Form({
     action: "/menu/",
@@ -50,6 +71,11 @@ const menuForm = async (req) => {
     additionalButtons: [
       { label: "Update", id: "btnUpdate", class: "btn btn-primary" },
       { label: "Add", id: "btnAdd", class: "btn btn-primary" },
+      {
+        label: "Recalculate dynamic",
+        id: "btnRecalc",
+        class: "btn btn-primary",
+      },
     ],
     fields: [
       {
@@ -58,7 +84,7 @@ const menuForm = async (req) => {
         input_type: "select",
         class: "menutype item-menu",
         required: true,
-        options: ["View", "Page", "Link", "Header"],
+        options: ["View", "Page", "Link", "Header", "Dynamic", "Search"],
       },
       {
         name: "text",
@@ -74,6 +100,7 @@ const menuForm = async (req) => {
         attributes: {
           html: `<button type="button" id="myEditor_icon" class="btn btn-outline-secondary"></button>`,
         },
+        showIf: { type: ["View", "Page", "Link", "Header"] },
       },
       {
         name: "icon",
@@ -111,6 +138,67 @@ const menuForm = async (req) => {
         attributes: { options: views.map((r) => r.select_option) },
         showIf: { type: "View" },
       },
+      {
+        name: "dyn_table",
+        label: req.__("Table"),
+        class: "item-menu",
+        type: "String",
+        attributes: {
+          options: dynTableOptions,
+        },
+        required: true,
+        showIf: { type: "Dynamic" },
+      },
+      {
+        name: "dyn_order",
+        label: req.__("Order field"),
+        class: "item-menu",
+        type: "String",
+        attributes: {
+          calcOptions: ["dyn_table", dynOrderFieldOptions],
+        },
+        showIf: { type: "Dynamic" },
+      },
+      {
+        name: "dyn_section_field",
+        label: req.__("Section field"),
+        class: "item-menu",
+        type: "String",
+        attributes: {
+          calcOptions: ["dyn_table", dynSectionFieldOptions],
+        },
+        sublabel: req.__(
+          "Optional. String type with options, each of which will become a menu section"
+        ),
+        showIf: { type: "Dynamic" },
+      },
+      {
+        name: "dyn_label_fml",
+        label: req.__("Label formula"),
+        class: "item-menu",
+        type: "String",
+        required: true,
+        showIf: { type: "Dynamic" },
+      },
+      {
+        name: "dyn_url_fml",
+        label: req.__("URL formula"),
+        class: "item-menu",
+        type: "String",
+        required: true,
+        showIf: { type: "Dynamic" },
+      },
+      {
+        name: "dyn_include_fml",
+        label: req.__("Include formula"),
+        sublabel: req.__(
+          "If specified, only include in menu rows that evaluate to true"
+        ),
+        class: "item-menu",
+        type: "String",
+        required: true,
+        showIf: { type: "Dynamic" },
+      },
       {
         name: "style",
         label: req.__("Style"),
@@ -118,6 +206,7 @@ const menuForm = async (req) => {
         class: "item-menu",
         type: "String",
         required: true,
+        showIf: { type: ["View", "Page", "Link", "Header", "Dynamic"] },
         attributes: {
           options: [
             { name: "", label: "Link" },
@@ -139,6 +228,7 @@ const menuForm = async (req) => {
       {
         name: "location",
         label: req.__("Location"),
+        showIf: { type: ["View", "Page", "Link", "Header", "Dynamic"] },
         sublabel: req.__("Not all themes support all locations"),
         class: "item-menu",
         type: "String",
@@ -164,9 +254,9 @@ const menuEditorScript = (menu_items) => `
   var iconPickerOptions = {searchText: "Search icon...", labelHeader: "{0}/{1}"};
   let lastState;
   let editor;  
-  function ajax_save_menu() {
+  function ajax_save_menu(skip_check) {
     const s = editor.getString()    
-    if(s===lastState) return;
+    if(s===lastState && !skip_check) return;
     lastState=s;
     ajax_post('/menu', {data: s, 
       success: ()=>{}, dataType : 'json', contentType: 'application/json;charset=UTF-8'})
@@ -192,6 +282,11 @@ const menuEditorScript = (menu_items) => `
       editor.update();
       ajax_save_menu();
   });
+  $("#btnRecalc").click(function(){
+    editor.update();
+    ajax_save_menu(true);
+    location.reload();
+});
   // Calling the add method
   $('#btnAdd').click(function(){
       editor.add();
@@ -213,18 +308,6 @@ const menuTojQME = (menu_items) =>
     ...(mi.subitems ? { children: menuTojQME(mi.subitems) } : {}),
   }));
 
-/**
- * @param {object[]} menu_items
- * @returns {object[]}
- */
-const jQMEtoMenu = (menu_items) =>
-  menu_items.map((mi) => ({
-    ...mi,
-    label: mi.text,
-    children: undefined,
-    ...(mi.children ? { subitems: jQMEtoMenu(mi.children) } : {}),
-  }));
-
 /**
  * @name get
  * @function
@@ -277,6 +360,17 @@ router.get(
     });
   })
 );
+/**
+ * @param {object[]} menu_items
+ * @returns {object[]}
+ */
+const jQMEtoMenu = (menu_items) =>
+  menu_items.map((mi) => ({
+    ...mi,
+    label: mi.text,
+    children: undefined,
+    ...(mi.children ? { subitems: jQMEtoMenu(mi.children) } : {}),
+  }));
 
 /**
  * @name post
@@ -288,16 +382,10 @@ router.post(
   "/",
   isAdmin,
   error_catcher(async (req, res) => {
-    if (req.xhr) {
-      const new_menu = req.body;
-      await getState().setConfig("menu_items", jQMEtoMenu(new_menu));
-      res.json({ success: true });
-    } else {
-      const new_menu = JSON.parse(req.body.menu);
-      await getState().setConfig("menu_items", jQMEtoMenu(new_menu));
-      req.flash("success", req.__(`Menu updated`));
+    const new_menu = req.body;
+    const menu_items = jQMEtoMenu(new_menu);
+    await save_menu_items(menu_items);
 
-      res.redirect(`/menu`);
-    }
+    res.json({ success: true });
   })
 );

package/tests/admin.test.js

@@ -268,8 +268,10 @@ describe("menu editor", () => {
     await request(app)
       .post("/menu")
       .set("Cookie", loginCookie)
-      .send("menu=" + encodeURIComponent(JSON.stringify(menu_json)))
-      .expect(toRedirect("/menu"));
+      .send(menu_json)
+      .set("Content-Type", "application/json")
+      .set("Accept", "application/json")
+      .expect(toSucceed);
   });
   it("show new menu", async () => {
     const app = await getApp({ disableCsrf: true });

package/wrapper.js

@@ -16,7 +16,10 @@ const getFlashes = (req) =>
     .filter((a) => a.msg && a.msg.length && a.msg.length > 0);
 
 const get_extra_menu = (role, state, req) => {
-  const cfg = getState().getConfig("menu_items", []);
+  let cfg = getState().getConfig("unrolled_menu_items", []);
+  if (!cfg || cfg.length === 0) {
+    cfg = getState().getConfig("menu_items", []);
+  }
   const locale = req.getLocale();
   const __ = (s) => state.i18n.__({ phrase: s, locale }) || s;
   const transform = (items) =>
@@ -27,6 +30,7 @@ const get_extra_menu = (role, state, req) => {
         icon: item.icon,
         location: item.location,
         style: item.style || "",
+        type: item.type,
         link:
           item.type === "Link"
             ? item.url