mashlib 1.7.17 → 1.7.18-alpha-b5d50d30

package/dist/mashlib.js

@@ -13779,7 +13779,7 @@ module.exports = {
      */
     // const DCT = $rdf.Namespace('http://purl.org/dc/terms/')
 
-    var preferencesFormText = "\n\n  @prefix rdf: <http://www.w3.org/1999/02/22-rdf-syntax-ns#>.\n  @prefix solid: <http://www.w3.org/ns/solid/terms#>.\n  @prefix ui: <http://www.w3.org/ns/ui#>.\n  @prefix : <#>.\n\n  :this\n    <http://purl.org/dc/elements/1.1/title> \"Chat preferences\" ;\n    a ui:Form ;\n    ui:part :colorizeByAuthor, :expandImagesInline, :newestFirst, :inlineImageHeightEms;\n    ui:parts ( :colorizeByAuthor :expandImagesInline :newestFirst :inlineImageHeightEms ).\n\n:colorizeByAuthor a ui:TristateField; ui:property solid:colorizeByAuthor;\n  ui:label \"Color user input by user\".\n:expandImagesInline a ui:TristateField; ui:property solid:expandImagesInline;\n  ui:label \"Expand image URLs inline\".\n:newestFirst a ui:TristateField; ui:property solid:newestFirst;\n  ui:label \"Newest messages at the top\".\n\n:inlineImageHeightEms a ui:IntegerField; ui:property solid:inlineImageHeightEms;\n  ui:label \"Inline image height (lines)\".\n\n";
+    var preferencesFormText = "\n    @prefix rdf: <http://www.w3.org/1999/02/22-rdf-syntax-ns#>.\n    @prefix solid: <http://www.w3.org/ns/solid/terms#>.\n    @prefix ui: <http://www.w3.org/ns/ui#>.\n    @prefix : <#>.\n\n    :this\n      <http://purl.org/dc/elements/1.1/title> \"Chat preferences\" ;\n      a ui:Form ;\n      ui:parts ( :colorizeByAuthor :expandImagesInline :newestFirst :inlineImageHeightEms\n                  :shiftEnterSendsMessage :authorDateOnLeft :showDeletedMessages).\n\n    :colorizeByAuthor a ui:TristateField; ui:property solid:colorizeByAuthor;\n    ui:label \"Color user input by user\".\n\n    :expandImagesInline a ui:TristateField; ui:property solid:expandImagesInline;\n    ui:label \"Expand image URLs inline\".\n\n    :newestFirst a ui:TristateField; ui:property solid:newestFirst;\n    ui:label \"Newest messages at the top\".\n\n    :inlineImageHeightEms a ui:IntegerField; ui:property solid:inlineImageHeightEms;\n    ui:label \"Inline image height (lines)\".\n\n    :shiftEnterSendsMessage a ui:TristateField; ui:property solid:shiftEnterSendsMessage;\n    ui:label \"Shift-Enter sends message\".\n\n    :authorDateOnLeft a ui:TristateField; ui:property solid:authorDateOnLeft;\n    ui:label \"Author & date of message on left\".\n\n    :showDeletedMessages a ui:TristateField; ui:property solid:showDeletedMessages;\n    ui:label \"Show placeholders for deleted messages\".\n";
     var preferencesForm = kb.sym('https://solid.github.io/solid-panes/longCharPane/preferencesForm.ttl#this');
     var preferencesFormDoc = preferencesForm.doc();
 
@@ -41774,7 +41774,7 @@ __webpack_require__.r(__webpack_exports__);
  * Copyright 2017 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
  */
-var t;const i=globalThis.trustedTypes,s=i?i.createPolicy("lit-html",{createHTML:t=>t}):void 0,e=`lit$${(Math.random()+"").slice(9)}$`,o="?"+e,n=`<${o}>`,l=document,h=(t="")=>l.createComment(t),r=t=>null===t||"object"!=typeof t&&"function"!=typeof t,d=Array.isArray,u=t=>{var i;return d(t)||"function"==typeof(null===(i=t)||void 0===i?void 0:i[Symbol.iterator])},c=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,v=/-->/g,a=/>/g,f=/>|[ 	\n\r](?:([^\s"'>=/]+)([ 	\n\r]*=[ 	\n\r]*(?:[^ 	\n\r"'`<>=]|("|')|))|$)/g,_=/'/g,m=/"/g,g=/^(?:script|style|textarea)$/i,p=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),$=p(1),y=p(2),b=Symbol.for("lit-noChange"),w=Symbol.for("lit-nothing"),T=new WeakMap,x=(t,i,s)=>{var e,o;const n=null!==(e=null==s?void 0:s.renderBefore)&&void 0!==e?e:i;let l=n._$litPart$;if(void 0===l){const t=null!==(o=null==s?void 0:s.renderBefore)&&void 0!==o?o:null;n._$litPart$=l=new N(i.insertBefore(h(),t),t,void 0,null!=s?s:{})}return l._$AI(t),l},A=l.createTreeWalker(l,129,null,!1),C=(t,i)=>{const o=t.length-1,l=[];let h,r=2===i?"<svg>":"",d=c;for(let i=0;i<o;i++){const s=t[i];let o,u,p=-1,$=0;for(;$<s.length&&(d.lastIndex=$,u=d.exec(s),null!==u);)$=d.lastIndex,d===c?"!--"===u[1]?d=v:void 0!==u[1]?d=a:void 0!==u[2]?(g.test(u[2])&&(h=RegExp("</"+u[2],"g")),d=f):void 0!==u[3]&&(d=f):d===f?">"===u[0]?(d=null!=h?h:c,p=-1):void 0===u[1]?p=-2:(p=d.lastIndex-u[2].length,o=u[1],d=void 0===u[3]?f:'"'===u[3]?m:_):d===m||d===_?d=f:d===v||d===a?d=c:(d=f,h=void 0);const y=d===f&&t[i+1].startsWith("/>")?" ":"";r+=d===c?s+n:p>=0?(l.push(o),s.slice(0,p)+"$lit$"+s.slice(p)+e+y):s+e+(-2===p?(l.push(void 0),i):y)}const u=r+(t[o]||"<?>")+(2===i?"</svg>":"");if(!Array.isArray(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return[void 0!==s?s.createHTML(u):u,l]};class E{constructor({strings:t,_$litType$:s},n){let l;this.parts=[];let r=0,d=0;const u=t.length-1,c=this.parts,[v,a]=C(t,s);if(this.el=E.createElement(v,n),A.currentNode=this.el.content,2===s){const t=this.el.content,i=t.firstChild;i.remove(),t.append(...i.childNodes)}for(;null!==(l=A.nextNode())&&c.length<u;){if(1===l.nodeType){if(l.hasAttributes()){const t=[];for(const i of l.getAttributeNames())if(i.endsWith("$lit$")||i.startsWith(e)){const s=a[d++];if(t.push(i),void 0!==s){const t=l.getAttribute(s.toLowerCase()+"$lit$").split(e),i=/([.?@])?(.*)/.exec(s);c.push({type:1,index:r,name:i[2],strings:t,ctor:"."===i[1]?M:"?"===i[1]?H:"@"===i[1]?I:S})}else c.push({type:6,index:r})}for(const i of t)l.removeAttribute(i)}if(g.test(l.tagName)){const t=l.textContent.split(e),s=t.length-1;if(s>0){l.textContent=i?i.emptyScript:"";for(let i=0;i<s;i++)l.append(t[i],h()),A.nextNode(),c.push({type:2,index:++r});l.append(t[s],h())}}}else if(8===l.nodeType)if(l.data===o)c.push({type:2,index:r});else{let t=-1;for(;-1!==(t=l.data.indexOf(e,t+1));)c.push({type:7,index:r}),t+=e.length-1}r++}}static createElement(t,i){const s=l.createElement("template");return s.innerHTML=t,s}}function P(t,i,s=t,e){var o,n,l,h;if(i===b)return i;let d=void 0!==e?null===(o=s._$Cl)||void 0===o?void 0:o[e]:s._$Cu;const u=r(i)?void 0:i._$litDirective$;return(null==d?void 0:d.constructor)!==u&&(null===(n=null==d?void 0:d._$AO)||void 0===n||n.call(d,!1),void 0===u?d=void 0:(d=new u(t),d._$AT(t,s,e)),void 0!==e?(null!==(l=(h=s)._$Cl)&&void 0!==l?l:h._$Cl=[])[e]=d:s._$Cu=d),void 0!==d&&(i=P(t,d._$AS(t,i.values),d,e)),i}class V{constructor(t,i){this.v=[],this._$AN=void 0,this._$AD=t,this._$AM=i}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}p(t){var i;const{el:{content:s},parts:e}=this._$AD,o=(null!==(i=null==t?void 0:t.creationScope)&&void 0!==i?i:l).importNode(s,!0);A.currentNode=o;let n=A.nextNode(),h=0,r=0,d=e[0];for(;void 0!==d;){if(h===d.index){let i;2===d.type?i=new N(n,n.nextSibling,this,t):1===d.type?i=new d.ctor(n,d.name,d.strings,this,t):6===d.type&&(i=new L(n,this,t)),this.v.push(i),d=e[++r]}h!==(null==d?void 0:d.index)&&(n=A.nextNode(),h++)}return o}m(t){let i=0;for(const s of this.v)void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++}}class N{constructor(t,i,s,e){var o;this.type=2,this._$AH=w,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cg=null===(o=null==e?void 0:e.isConnected)||void 0===o||o}get _$AU(){var t,i;return null!==(i=null===(t=this._$AM)||void 0===t?void 0:t._$AU)&&void 0!==i?i:this._$Cg}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===t.nodeType&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=P(this,t,i),r(t)?t===w||null==t||""===t?(this._$AH!==w&&this._$AR(),this._$AH=w):t!==this._$AH&&t!==b&&this.$(t):void 0!==t._$litType$?this.T(t):void 0!==t.nodeType?this.S(t):u(t)?this.A(t):this.$(t)}M(t,i=this._$AB){return this._$AA.parentNode.insertBefore(t,i)}S(t){this._$AH!==t&&(this._$AR(),this._$AH=this.M(t))}$(t){this._$AH!==w&&r(this._$AH)?this._$AA.nextSibling.data=t:this.S(l.createTextNode(t)),this._$AH=t}T(t){var i;const{values:s,_$litType$:e}=t,o="number"==typeof e?this._$AC(t):(void 0===e.el&&(e.el=E.createElement(e.h,this.options)),e);if((null===(i=this._$AH)||void 0===i?void 0:i._$AD)===o)this._$AH.m(s);else{const t=new V(o,this),i=t.p(this.options);t.m(s),this.S(i),this._$AH=t}}_$AC(t){let i=T.get(t.strings);return void 0===i&&T.set(t.strings,i=new E(t)),i}A(t){d(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,e=0;for(const o of t)e===i.length?i.push(s=new N(this.M(h()),this.M(h()),this,this.options)):s=i[e],s._$AI(o),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e)}_$AR(t=this._$AA.nextSibling,i){var s;for(null===(s=this._$AP)||void 0===s||s.call(this,!1,!0,i);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i}}setConnected(t){var i;void 0===this._$AM&&(this._$Cg=t,null===(i=this._$AP)||void 0===i||i.call(this,t))}}class S{constructor(t,i,s,e,o){this.type=1,this._$AH=w,this._$AN=void 0,this.element=t,this.name=i,this._$AM=e,this.options=o,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=w}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(t,i=this,s,e){const o=this.strings;let n=!1;if(void 0===o)t=P(this,t,i,0),n=!r(t)||t!==this._$AH&&t!==b,n&&(this._$AH=t);else{const e=t;let l,h;for(t=o[0],l=0;l<o.length-1;l++)h=P(this,e[s+l],i,l),h===b&&(h=this._$AH[l]),n||(n=!r(h)||h!==this._$AH[l]),h===w?t=w:t!==w&&(t+=(null!=h?h:"")+o[l+1]),this._$AH[l]=h}n&&!e&&this.k(t)}k(t){t===w?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,null!=t?t:"")}}class M extends S{constructor(){super(...arguments),this.type=3}k(t){this.element[this.name]=t===w?void 0:t}}const k=i?i.emptyScript:"";class H extends S{constructor(){super(...arguments),this.type=4}k(t){t&&t!==w?this.element.setAttribute(this.name,k):this.element.removeAttribute(this.name)}}class I extends S{constructor(t,i,s,e,o){super(t,i,s,e,o),this.type=5}_$AI(t,i=this){var s;if((t=null!==(s=P(this,t,i,0))&&void 0!==s?s:w)===b)return;const e=this._$AH,o=t===w&&e!==w||t.capture!==e.capture||t.once!==e.once||t.passive!==e.passive,n=t!==w&&(e===w||o);o&&this.element.removeEventListener(this.name,this,e),n&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){var i,s;"function"==typeof this._$AH?this._$AH.call(null!==(s=null===(i=this.options)||void 0===i?void 0:i.host)&&void 0!==s?s:this.element,t):this._$AH.handleEvent(t)}}class L{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s}get _$AU(){return this._$AM._$AU}_$AI(t){P(this,t)}}const R={P:"$lit$",V:e,L:o,I:1,N:C,R:V,D:u,j:P,H:N,O:S,F:H,B:I,W:M,Z:L},z=window.litHtmlPolyfillSupport;null==z||z(E,N),(null!==(t=globalThis.litHtmlVersions)&&void 0!==t?t:globalThis.litHtmlVersions=[]).push("2.1.2");
+var t;const i=globalThis.trustedTypes,s=i?i.createPolicy("lit-html",{createHTML:t=>t}):void 0,e=`lit$${(Math.random()+"").slice(9)}$`,o="?"+e,n=`<${o}>`,l=document,h=(t="")=>l.createComment(t),r=t=>null===t||"object"!=typeof t&&"function"!=typeof t,d=Array.isArray,u=t=>{var i;return d(t)||"function"==typeof(null===(i=t)||void 0===i?void 0:i[Symbol.iterator])},c=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,v=/-->/g,a=/>/g,f=/>|[ 	\n\r](?:([^\s"'>=/]+)([ 	\n\r]*=[ 	\n\r]*(?:[^ 	\n\r"'`<>=]|("|')|))|$)/g,_=/'/g,m=/"/g,g=/^(?:script|style|textarea|title)$/i,p=t=>(i,...s)=>({_$litType$:t,strings:i,values:s}),$=p(1),y=p(2),b=Symbol.for("lit-noChange"),w=Symbol.for("lit-nothing"),T=new WeakMap,x=(t,i,s)=>{var e,o;const n=null!==(e=null==s?void 0:s.renderBefore)&&void 0!==e?e:i;let l=n._$litPart$;if(void 0===l){const t=null!==(o=null==s?void 0:s.renderBefore)&&void 0!==o?o:null;n._$litPart$=l=new N(i.insertBefore(h(),t),t,void 0,null!=s?s:{})}return l._$AI(t),l},A=l.createTreeWalker(l,129,null,!1),C=(t,i)=>{const o=t.length-1,l=[];let h,r=2===i?"<svg>":"",d=c;for(let i=0;i<o;i++){const s=t[i];let o,u,p=-1,$=0;for(;$<s.length&&(d.lastIndex=$,u=d.exec(s),null!==u);)$=d.lastIndex,d===c?"!--"===u[1]?d=v:void 0!==u[1]?d=a:void 0!==u[2]?(g.test(u[2])&&(h=RegExp("</"+u[2],"g")),d=f):void 0!==u[3]&&(d=f):d===f?">"===u[0]?(d=null!=h?h:c,p=-1):void 0===u[1]?p=-2:(p=d.lastIndex-u[2].length,o=u[1],d=void 0===u[3]?f:'"'===u[3]?m:_):d===m||d===_?d=f:d===v||d===a?d=c:(d=f,h=void 0);const y=d===f&&t[i+1].startsWith("/>")?" ":"";r+=d===c?s+n:p>=0?(l.push(o),s.slice(0,p)+"$lit$"+s.slice(p)+e+y):s+e+(-2===p?(l.push(void 0),i):y)}const u=r+(t[o]||"<?>")+(2===i?"</svg>":"");if(!Array.isArray(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return[void 0!==s?s.createHTML(u):u,l]};class E{constructor({strings:t,_$litType$:s},n){let l;this.parts=[];let r=0,d=0;const u=t.length-1,c=this.parts,[v,a]=C(t,s);if(this.el=E.createElement(v,n),A.currentNode=this.el.content,2===s){const t=this.el.content,i=t.firstChild;i.remove(),t.append(...i.childNodes)}for(;null!==(l=A.nextNode())&&c.length<u;){if(1===l.nodeType){if(l.hasAttributes()){const t=[];for(const i of l.getAttributeNames())if(i.endsWith("$lit$")||i.startsWith(e)){const s=a[d++];if(t.push(i),void 0!==s){const t=l.getAttribute(s.toLowerCase()+"$lit$").split(e),i=/([.?@])?(.*)/.exec(s);c.push({type:1,index:r,name:i[2],strings:t,ctor:"."===i[1]?M:"?"===i[1]?H:"@"===i[1]?I:S})}else c.push({type:6,index:r})}for(const i of t)l.removeAttribute(i)}if(g.test(l.tagName)){const t=l.textContent.split(e),s=t.length-1;if(s>0){l.textContent=i?i.emptyScript:"";for(let i=0;i<s;i++)l.append(t[i],h()),A.nextNode(),c.push({type:2,index:++r});l.append(t[s],h())}}}else if(8===l.nodeType)if(l.data===o)c.push({type:2,index:r});else{let t=-1;for(;-1!==(t=l.data.indexOf(e,t+1));)c.push({type:7,index:r}),t+=e.length-1}r++}}static createElement(t,i){const s=l.createElement("template");return s.innerHTML=t,s}}function P(t,i,s=t,e){var o,n,l,h;if(i===b)return i;let d=void 0!==e?null===(o=s._$Cl)||void 0===o?void 0:o[e]:s._$Cu;const u=r(i)?void 0:i._$litDirective$;return(null==d?void 0:d.constructor)!==u&&(null===(n=null==d?void 0:d._$AO)||void 0===n||n.call(d,!1),void 0===u?d=void 0:(d=new u(t),d._$AT(t,s,e)),void 0!==e?(null!==(l=(h=s)._$Cl)&&void 0!==l?l:h._$Cl=[])[e]=d:s._$Cu=d),void 0!==d&&(i=P(t,d._$AS(t,i.values),d,e)),i}class V{constructor(t,i){this.v=[],this._$AN=void 0,this._$AD=t,this._$AM=i}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}p(t){var i;const{el:{content:s},parts:e}=this._$AD,o=(null!==(i=null==t?void 0:t.creationScope)&&void 0!==i?i:l).importNode(s,!0);A.currentNode=o;let n=A.nextNode(),h=0,r=0,d=e[0];for(;void 0!==d;){if(h===d.index){let i;2===d.type?i=new N(n,n.nextSibling,this,t):1===d.type?i=new d.ctor(n,d.name,d.strings,this,t):6===d.type&&(i=new L(n,this,t)),this.v.push(i),d=e[++r]}h!==(null==d?void 0:d.index)&&(n=A.nextNode(),h++)}return o}m(t){let i=0;for(const s of this.v)void 0!==s&&(void 0!==s.strings?(s._$AI(t,s,i),i+=s.strings.length-2):s._$AI(t[i])),i++}}class N{constructor(t,i,s,e){var o;this.type=2,this._$AH=w,this._$AN=void 0,this._$AA=t,this._$AB=i,this._$AM=s,this.options=e,this._$Cg=null===(o=null==e?void 0:e.isConnected)||void 0===o||o}get _$AU(){var t,i;return null!==(i=null===(t=this._$AM)||void 0===t?void 0:t._$AU)&&void 0!==i?i:this._$Cg}get parentNode(){let t=this._$AA.parentNode;const i=this._$AM;return void 0!==i&&11===t.nodeType&&(t=i.parentNode),t}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(t,i=this){t=P(this,t,i),r(t)?t===w||null==t||""===t?(this._$AH!==w&&this._$AR(),this._$AH=w):t!==this._$AH&&t!==b&&this.$(t):void 0!==t._$litType$?this.T(t):void 0!==t.nodeType?this.S(t):u(t)?this.A(t):this.$(t)}M(t,i=this._$AB){return this._$AA.parentNode.insertBefore(t,i)}S(t){this._$AH!==t&&(this._$AR(),this._$AH=this.M(t))}$(t){this._$AH!==w&&r(this._$AH)?this._$AA.nextSibling.data=t:this.S(l.createTextNode(t)),this._$AH=t}T(t){var i;const{values:s,_$litType$:e}=t,o="number"==typeof e?this._$AC(t):(void 0===e.el&&(e.el=E.createElement(e.h,this.options)),e);if((null===(i=this._$AH)||void 0===i?void 0:i._$AD)===o)this._$AH.m(s);else{const t=new V(o,this),i=t.p(this.options);t.m(s),this.S(i),this._$AH=t}}_$AC(t){let i=T.get(t.strings);return void 0===i&&T.set(t.strings,i=new E(t)),i}A(t){d(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let s,e=0;for(const o of t)e===i.length?i.push(s=new N(this.M(h()),this.M(h()),this,this.options)):s=i[e],s._$AI(o),e++;e<i.length&&(this._$AR(s&&s._$AB.nextSibling,e),i.length=e)}_$AR(t=this._$AA.nextSibling,i){var s;for(null===(s=this._$AP)||void 0===s||s.call(this,!1,!0,i);t&&t!==this._$AB;){const i=t.nextSibling;t.remove(),t=i}}setConnected(t){var i;void 0===this._$AM&&(this._$Cg=t,null===(i=this._$AP)||void 0===i||i.call(this,t))}}class S{constructor(t,i,s,e,o){this.type=1,this._$AH=w,this._$AN=void 0,this.element=t,this.name=i,this._$AM=e,this.options=o,s.length>2||""!==s[0]||""!==s[1]?(this._$AH=Array(s.length-1).fill(new String),this.strings=s):this._$AH=w}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(t,i=this,s,e){const o=this.strings;let n=!1;if(void 0===o)t=P(this,t,i,0),n=!r(t)||t!==this._$AH&&t!==b,n&&(this._$AH=t);else{const e=t;let l,h;for(t=o[0],l=0;l<o.length-1;l++)h=P(this,e[s+l],i,l),h===b&&(h=this._$AH[l]),n||(n=!r(h)||h!==this._$AH[l]),h===w?t=w:t!==w&&(t+=(null!=h?h:"")+o[l+1]),this._$AH[l]=h}n&&!e&&this.k(t)}k(t){t===w?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,null!=t?t:"")}}class M extends S{constructor(){super(...arguments),this.type=3}k(t){this.element[this.name]=t===w?void 0:t}}const k=i?i.emptyScript:"";class H extends S{constructor(){super(...arguments),this.type=4}k(t){t&&t!==w?this.element.setAttribute(this.name,k):this.element.removeAttribute(this.name)}}class I extends S{constructor(t,i,s,e,o){super(t,i,s,e,o),this.type=5}_$AI(t,i=this){var s;if((t=null!==(s=P(this,t,i,0))&&void 0!==s?s:w)===b)return;const e=this._$AH,o=t===w&&e!==w||t.capture!==e.capture||t.once!==e.once||t.passive!==e.passive,n=t!==w&&(e===w||o);o&&this.element.removeEventListener(this.name,this,e),n&&this.element.addEventListener(this.name,this,t),this._$AH=t}handleEvent(t){var i,s;"function"==typeof this._$AH?this._$AH.call(null!==(s=null===(i=this.options)||void 0===i?void 0:i.host)&&void 0!==s?s:this.element,t):this._$AH.handleEvent(t)}}class L{constructor(t,i,s){this.element=t,this.type=6,this._$AN=void 0,this._$AM=i,this.options=s}get _$AU(){return this._$AM._$AU}_$AI(t){P(this,t)}}const R={P:"$lit$",V:e,L:o,I:1,N:C,R:V,D:u,j:P,H:N,O:S,F:H,B:I,W:M,Z:L},z=window.litHtmlPolyfillSupport;null==z||z(E,N),(null!==(t=globalThis.litHtmlVersions)&&void 0!==t?t:globalThis.litHtmlVersions=[]).push("2.1.3");
 //# sourceMappingURL=lit-html.js.map
 
 
@@ -112583,23 +112583,23 @@ function _default(context) {
   }
 
   function _getDashboardItems() {
-    _getDashboardItems = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee6() {
+    _getDashboardItems = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee7() {
       var me, div, _yield$Promise$all, _yield$Promise$all2, books, pods, getPods, _getPods, getAddressBooks, _getAddressBooks;
 
-      return regeneratorRuntime.wrap(function _callee6$(_context7) {
+      return regeneratorRuntime.wrap(function _callee7$(_context8) {
         while (1) {
-          switch (_context7.prev = _context7.next) {
+          switch (_context8.prev = _context8.next) {
             case 0:
               _getAddressBooks = function _getAddressBooks3() {
-                _getAddressBooks = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee5() {
-                  var _context5;
+                _getAddressBooks = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee6() {
+                  var _context6;
 
-                  return regeneratorRuntime.wrap(function _callee5$(_context6) {
+                  return regeneratorRuntime.wrap(function _callee6$(_context7) {
                     while (1) {
-                      switch (_context6.prev = _context6.next) {
+                      switch (_context7.prev = _context7.next) {
                         case 0:
-                          _context6.prev = 0;
-                          _context6.next = 3;
+                          _context7.prev = 0;
+                          _context7.next = 3;
                           return UI.authn.findAppInstances({
                             me: me,
                             div: div,
@@ -112607,8 +112607,8 @@ function _default(context) {
                           }, ns.vcard('AddressBook'));
 
                         case 3:
-                          _context5 = _context6.sent;
-                          return _context6.abrupt("return", (_context5.instances || []).map(function (book, index) {
+                          _context6 = _context7.sent;
+                          return _context7.abrupt("return", (_context6.instances || []).map(function (book, index) {
                             return {
                               paneName: 'contact',
                               tabName: "contact-".concat(index),
@@ -112619,19 +112619,19 @@ function _default(context) {
                           }));
 
                         case 7:
-                          _context6.prev = 7;
-                          _context6.t0 = _context6["catch"](0);
+                          _context7.prev = 7;
+                          _context7.t0 = _context7["catch"](0);
                           console.error('oops in globalAppTabs AddressBook');
 
                         case 10:
-                          return _context6.abrupt("return", []);
+                          return _context7.abrupt("return", []);
 
                         case 11:
                         case "end":
-                          return _context6.stop();
+                          return _context7.stop();
                       }
                     }
-                  }, _callee5, null, [[0, 7]]);
+                  }, _callee6, null, [[0, 7]]);
                 }));
                 return _getAddressBooks.apply(this, arguments);
               };
@@ -112641,142 +112641,173 @@ function _default(context) {
               };
 
               _getPods = function _getPods3() {
-                _getPods = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee4() {
-                  var addPodRoot, _addPodRoot, addPodRootFromUrl, _addPodRootFromUrl, pods, uri, podUrl;
+                _getPods = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee5() {
+                  var addPodStorage, _addPodStorage, addPodStorageFromUrl, _addPodStorageFromUrl, pods, uri, podUrl, uniques;
 
-                  return regeneratorRuntime.wrap(function _callee4$(_context4) {
+                  return regeneratorRuntime.wrap(function _callee5$(_context5) {
                     while (1) {
-                      switch (_context4.prev = _context4.next) {
+                      switch (_context5.prev = _context5.next) {
                         case 0:
-                          _addPodRootFromUrl = function _addPodRootFromUrl3() {
-                            _addPodRootFromUrl = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3(url) {
-                              var podStorage;
-                              return regeneratorRuntime.wrap(function _callee3$(_context3) {
+                          uniques = function _uniques(nodes) {
+                            var uniqueNodes = [];
+                            nodes.forEach(function (node) {
+                              if (!uniqueNodes.find(function (uniqueNode) {
+                                return uniqueNode.equals(node);
+                              })) uniqueNodes.push(node);
+                            });
+                            return uniqueNodes;
+                          };
+
+                          _addPodStorageFromUrl = function _addPodStorageFromUrl3() {
+                            _addPodStorageFromUrl = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee4(url) {
+                              var podStorage, pathStorage;
+                              return regeneratorRuntime.wrap(function _callee4$(_context4) {
                                 while (1) {
-                                  switch (_context3.prev = _context3.next) {
+                                  switch (_context4.prev = _context4.next) {
                                     case 0:
-                                      podStorage = new URL(url); // check that origin is not included in pods array
+                                      podStorage = new URL(url); // check for predicate pim:Storage in containers up the path tree
 
-                                      if (pods.some(function (pod) {
-                                        return pod.uri.includes(podStorage.origin);
-                                      })) {
-                                        _context3.next = 10;
-                                        break;
-                                      }
+                                      pathStorage = podStorage.pathname;
 
-                                      _context3.t0 = podStorage.pathname === '/';
-
-                                      if (_context3.t0) {
-                                        _context3.next = 7;
+                                    case 2:
+                                      if (!pathStorage.length) {
+                                        _context4.next = 10;
                                         break;
                                       }
 
-                                      _context3.next = 6;
-                                      return addPodRoot(kb.sym("".concat(podStorage.origin, "/").concat(podStorage.pathname.split('/')[1], "/")));
+                                      pathStorage = pathStorage.substring(0, pathStorage.lastIndexOf('/'));
+                                      _context4.next = 6;
+                                      return addPodStorage(kb.sym("".concat(podStorage.origin).concat(pathStorage, "/")));
 
                                     case 6:
-                                      _context3.t0 = !_context3.sent;
-
-                                    case 7:
-                                      if (!_context3.t0) {
-                                        _context3.next = 10;
+                                      if (!_context4.sent) {
+                                        _context4.next = 8;
                                         break;
                                       }
 
-                                      _context3.next = 10;
-                                      return addPodRoot(kb.sym("".concat(podStorage.origin, "/")));
+                                      return _context4.abrupt("return");
+
+                                    case 8:
+                                      _context4.next = 2;
+                                      break;
 
                                     case 10:
                                     case "end":
-                                      return _context3.stop();
+                                      return _context4.stop();
                                   }
                                 }
-                              }, _callee3);
+                              }, _callee4);
                             }));
-                            return _addPodRootFromUrl.apply(this, arguments);
+                            return _addPodStorageFromUrl.apply(this, arguments);
                           };
 
-                          addPodRootFromUrl = function _addPodRootFromUrl2(_x8) {
-                            return _addPodRootFromUrl.apply(this, arguments);
+                          addPodStorageFromUrl = function _addPodStorageFromUrl2(_x8) {
+                            return _addPodStorageFromUrl.apply(this, arguments);
                           };
 
-                          _addPodRoot = function _addPodRoot3() {
-                            _addPodRoot = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(pod) {
-                              return regeneratorRuntime.wrap(function _callee2$(_context2) {
+                          _addPodStorage = function _addPodStorage3() {
+                            _addPodStorage = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3(pod) {
+                              return regeneratorRuntime.wrap(function _callee3$(_context3) {
                                 while (1) {
-                                  switch (_context2.prev = _context2.next) {
+                                  switch (_context3.prev = _context3.next) {
                                     case 0:
-                                      _context2.next = 2;
-                                      return checkForContainerRepresentation(pod);
+                                      _context3.next = 2;
+                                      return loadContainerRepresentation(pod);
 
                                     case 2:
                                       if (!kb.holds(pod, ns.rdf('type'), ns.space('Storage'), pod.doc())) {
-                                        _context2.next = 5;
+                                        _context3.next = 5;
                                         break;
                                       }
 
                                       pods.push(pod);
-                                      return _context2.abrupt("return", true);
+                                      return _context3.abrupt("return", true);
 
                                     case 5:
-                                      return _context2.abrupt("return", false);
+                                      return _context3.abrupt("return", false);
 
                                     case 6:
                                     case "end":
-                                      return _context2.stop();
+                                      return _context3.stop();
                                   }
                                 }
-                              }, _callee2);
+                              }, _callee3);
                             }));
-                            return _addPodRoot.apply(this, arguments);
+                            return _addPodStorage.apply(this, arguments);
                           };
 
-                          addPodRoot = function _addPodRoot2(_x7) {
-                            return _addPodRoot.apply(this, arguments);
+                          addPodStorage = function _addPodStorage2(_x7) {
+                            return _addPodStorage.apply(this, arguments);
                           };
 
-                          _context4.prev = 4;
-                          _context4.next = 7;
+                          _context5.prev = 5;
+                          _context5.next = 8;
                           return kb.fetcher.load(me.doc());
 
-                        case 7:
-                          _context4.next = 13;
+                        case 8:
+                          _context5.next = 14;
                           break;
 
-                        case 9:
-                          _context4.prev = 9;
-                          _context4.t0 = _context4["catch"](4);
-                          console.error('Unable to load profile', _context4.t0);
-                          return _context4.abrupt("return", []);
+                        case 10:
+                          _context5.prev = 10;
+                          _context5.t0 = _context5["catch"](5);
+                          console.error('Unable to load profile', _context5.t0);
+                          return _context5.abrupt("return", []);
 
-                        case 13:
+                        case 14:
+                          // load pod's storages from profile
                           pods = kb.each(me, ns.space('storage'), null, me.doc());
-                          _context4.prev = 14;
+                          pods.map( /*#__PURE__*/function () {
+                            var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(pod) {
+                              return regeneratorRuntime.wrap(function _callee2$(_context2) {
+                                while (1) {
+                                  switch (_context2.prev = _context2.next) {
+                                    case 0:
+                                      _context2.next = 2;
+                                      return loadContainerRepresentation(pod);
+
+                                    case 2:
+                                    case "end":
+                                      return _context2.stop();
+                                  }
+                                }
+                              }, _callee2);
+                            }));
+
+                            return function (_x9) {
+                              return _ref.apply(this, arguments);
+                            };
+                          }());
+                          _context5.prev = 16;
                           // if uri then SolidOS is a browse.html web app
                           uri = new URL(window.location.href).searchParams.get('uri');
                           podUrl = uri || window.location.href;
-                          _context4.next = 19;
-                          return addPodRootFromUrl(podUrl.substring(0, podUrl.lastIndexOf('/') + 1));
+                          _context5.next = 21;
+                          return addPodStorageFromUrl(podUrl);
 
-                        case 19:
-                          _context4.next = 24;
+                        case 21:
+                          _context5.next = 26;
                           break;
 
-                        case 21:
-                          _context4.prev = 21;
-                          _context4.t1 = _context4["catch"](14);
-                          console.error('cannot load container', _context4.t1);
+                        case 23:
+                          _context5.prev = 23;
+                          _context5.t1 = _context5["catch"](16);
+                          console.error('cannot load container', _context5.t1);
+
+                        case 26:
+                          pods = uniques(pods);
+                          console.log('return pods');
+                          console.log(pods);
 
-                        case 24:
                           if (pods.length) {
-                            _context4.next = 26;
+                            _context5.next = 31;
                             break;
                           }
 
-                          return _context4.abrupt("return", []);
+                          return _context5.abrupt("return", []);
 
-                        case 26:
-                          return _context4.abrupt("return", pods.map(function (pod, index) {
+                        case 31:
+                          return _context5.abrupt("return", pods.map(function (pod, index) {
                             function split(item) {
                               return item.uri.split('//')[1].slice(0, -1);
                             }
@@ -112791,12 +112822,12 @@ function _default(context) {
                             };
                           }));
 
-                        case 27:
+                        case 32:
                         case "end":
-                          return _context4.stop();
+                          return _context5.stop();
                       }
                     }
-                  }, _callee4, null, [[4, 9], [14, 21]]);
+                  }, _callee5, null, [[5, 10], [16, 23]]);
                 }));
                 return _getPods.apply(this, arguments);
               };
@@ -112808,23 +112839,23 @@ function _default(context) {
               me = UI.authn.currentUser();
 
               if (me) {
-                _context7.next = 7;
+                _context8.next = 7;
                 break;
               }
 
-              return _context7.abrupt("return", []);
+              return _context8.abrupt("return", []);
 
             case 7:
               div = dom.createElement('div');
-              _context7.next = 10;
+              _context8.next = 10;
               return Promise.all([getAddressBooks(), getPods()]);
 
             case 10:
-              _yield$Promise$all = _context7.sent;
+              _yield$Promise$all = _context8.sent;
               _yield$Promise$all2 = _slicedToArray(_yield$Promise$all, 2);
               books = _yield$Promise$all2[0];
               pods = _yield$Promise$all2[1];
-              return _context7.abrupt("return", [{
+              return _context8.abrupt("return", [{
                 paneName: 'home',
                 label: 'Your stuff',
                 icon: UI.icons.iconBase + 'noun_547570.svg'
@@ -112840,10 +112871,10 @@ function _default(context) {
 
             case 15:
             case "end":
-              return _context7.stop();
+              return _context8.stop();
           }
         }
-      }, _callee6);
+      }, _callee7);
     }));
     return _getDashboardItems.apply(this, arguments);
   }
@@ -112862,7 +112893,7 @@ function _default(context) {
   }
 
   function _showDashboard() {
-    _showDashboard = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee7() {
+    _showDashboard = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee8() {
       var options,
           dashboardContainer,
           outlineContainer,
@@ -112870,23 +112901,23 @@ function _default(context) {
           dashboard,
           tab,
           closeDashboard,
-          _args7 = arguments;
+          _args8 = arguments;
 
-      return regeneratorRuntime.wrap(function _callee7$(_context8) {
+      return regeneratorRuntime.wrap(function _callee8$(_context9) {
         while (1) {
-          switch (_context8.prev = _context8.next) {
+          switch (_context9.prev = _context9.next) {
             case 0:
               closeDashboard = function _closeDashboard() {
                 dashboardContainer.style.display = 'none';
                 outlineContainer.style.display = 'inherit';
               };
 
-              options = _args7.length > 0 && _args7[0] !== undefined ? _args7[0] : {};
+              options = _args8.length > 0 && _args8[0] !== undefined ? _args8[0] : {};
               dashboardContainer = getDashboardContainer();
               outlineContainer = getOutlineContainer(); // reuse dashboard if already children already is inserted
 
               if (!(dashboardContainer.childNodes.length > 0 && options.pane)) {
-                _context8.next = 12;
+                _context9.next = 12;
                 break;
               }
 
@@ -112895,26 +112926,26 @@ function _default(context) {
               _tab = dashboardContainer.querySelector("[data-global-pane-name=\"".concat(options.pane, "\"]"));
 
               if (!_tab) {
-                _context8.next = 11;
+                _context9.next = 11;
                 break;
               }
 
               _tab.click();
 
-              return _context8.abrupt("return");
+              return _context9.abrupt("return");
 
             case 11:
               console.warn('Did not find the referred tab in global dashboard, will open first one');
 
             case 12:
-              _context8.next = 14;
+              _context9.next = 14;
               return globalAppTabs({
                 selectedTab: options.pane,
                 onClose: closeDashboard
               });
 
             case 14:
-              dashboard = _context8.sent;
+              dashboard = _context9.sent;
               // close the dashboard if user log out
               UI.authn.authSession.onLogout(closeDashboard); // finally - switch to showing dashboard
 
@@ -112928,10 +112959,10 @@ function _default(context) {
 
             case 20:
             case "end":
-              return _context8.stop();
+              return _context9.stop();
           }
         }
-      }, _callee7);
+      }, _callee8);
     }));
     return _showDashboard.apply(this, arguments);
   }
@@ -112962,23 +112993,23 @@ function _default(context) {
     }();
   }
 
-  function checkForContainerRepresentation(_x) {
-    return _checkForContainerRepresentation.apply(this, arguments);
+  function loadContainerRepresentation(_x) {
+    return _loadContainerRepresentation.apply(this, arguments);
   }
 
-  function _checkForContainerRepresentation() {
-    _checkForContainerRepresentation = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee8(subject) {
+  function _loadContainerRepresentation() {
+    _loadContainerRepresentation = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee9(subject) {
       var response, containerTurtle;
-      return regeneratorRuntime.wrap(function _callee8$(_context9) {
+      return regeneratorRuntime.wrap(function _callee9$(_context10) {
         while (1) {
-          switch (_context9.prev = _context9.next) {
+          switch (_context10.prev = _context10.next) {
             case 0:
               if (kb.any(subject, ns.ldp('contains'), undefined, subject.doc())) {
-                _context9.next = 6;
+                _context10.next = 6;
                 break;
               }
 
-              _context9.next = 3;
+              _context10.next = 3;
               return kb.fetcher.webOperation('GET', subject.uri, kb.fetcher.initFetchOptions(subject.uri, {
                 headers: {
                   accept: 'text/turtle'
@@ -112986,18 +113017,18 @@ function _default(context) {
               }));
 
             case 3:
-              response = _context9.sent;
+              response = _context10.sent;
               containerTurtle = response.responseText;
               $rdf.parse(containerTurtle, kb, subject.uri, 'text/turtle');
 
             case 6:
             case "end":
-              return _context9.stop();
+              return _context10.stop();
           }
         }
-      }, _callee8);
+      }, _callee9);
     }));
-    return _checkForContainerRepresentation.apply(this, arguments);
+    return _loadContainerRepresentation.apply(this, arguments);
   }
 
   function getRelevantPanes(_x2, _x3) {
@@ -113005,19 +113036,19 @@ function _default(context) {
   }
 
   function _getRelevantPanes() {
-    _getRelevantPanes = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee9(subject, context) {
+    _getRelevantPanes = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee10(subject, context) {
       var panes, relevantPanes, filteredPanes, firstRelevantPaneIndex, firstFilteredPaneIndex;
-      return regeneratorRuntime.wrap(function _callee9$(_context10) {
+      return regeneratorRuntime.wrap(function _callee10$(_context11) {
         while (1) {
-          switch (_context10.prev = _context10.next) {
+          switch (_context11.prev = _context11.next) {
             case 0:
               if (!subject.uri.endsWith('/')) {
-                _context10.next = 3;
+                _context11.next = 3;
                 break;
               }
 
-              _context10.next = 3;
-              return checkForContainerRepresentation(subject);
+              _context11.next = 3;
+              return loadContainerRepresentation(subject);
 
             case 3:
               panes = context.session.paneRegistry;
@@ -113026,38 +113057,38 @@ function _default(context) {
               });
 
               if (!(relevantPanes.length === 0)) {
-                _context10.next = 7;
+                _context11.next = 7;
                 break;
               }
 
-              return _context10.abrupt("return", [panes.byName('internal')]);
+              return _context11.abrupt("return", [panes.byName('internal')]);
 
             case 7:
-              _context10.next = 9;
+              _context11.next = 9;
               return UI.authn.filterAvailablePanes(relevantPanes);
 
             case 9:
-              filteredPanes = _context10.sent;
+              filteredPanes = _context11.sent;
 
               if (!(filteredPanes.length === 0)) {
-                _context10.next = 12;
+                _context11.next = 12;
                 break;
               }
 
-              return _context10.abrupt("return", [relevantPanes[0]]);
+              return _context11.abrupt("return", [relevantPanes[0]]);
 
             case 12:
               firstRelevantPaneIndex = panes.list.indexOf(relevantPanes[0]);
               firstFilteredPaneIndex = panes.list.indexOf(filteredPanes[0]); // if the first relevant pane is loaded before the panes available wrt role, we still want to offer the most relevant pane
 
-              return _context10.abrupt("return", firstRelevantPaneIndex < firstFilteredPaneIndex ? [relevantPanes[0]].concat(filteredPanes) : filteredPanes);
+              return _context11.abrupt("return", firstRelevantPaneIndex < firstFilteredPaneIndex ? [relevantPanes[0]].concat(filteredPanes) : filteredPanes);
 
             case 15:
             case "end":
-              return _context10.stop();
+              return _context11.stop();
           }
         }
-      }, _callee9);
+      }, _callee10);
     }));
     return _getRelevantPanes.apply(this, arguments);
   }
@@ -113095,50 +113126,50 @@ function _default(context) {
 
 
   function _expandedHeaderTR() {
-    _expandedHeaderTR = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee11(subject, requiredPane, options) {
+    _expandedHeaderTR = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee12(subject, requiredPane, options) {
       var renderPaneIconTray, _renderPaneIconTray, tr, td, header, showHeader, icon, strong;
 
-      return regeneratorRuntime.wrap(function _callee11$(_context12) {
+      return regeneratorRuntime.wrap(function _callee12$(_context13) {
         while (1) {
-          switch (_context12.prev = _context12.next) {
+          switch (_context13.prev = _context13.next) {
             case 0:
               _renderPaneIconTray = function _renderPaneIconTray3() {
-                _renderPaneIconTray = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee10(td) {
+                _renderPaneIconTray = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee11(td) {
                   var options,
                       paneShownStyle,
                       paneHiddenStyle,
                       paneIconTray,
                       relevantPanes,
                       paneNumber,
-                      _args10 = arguments;
-                  return regeneratorRuntime.wrap(function _callee10$(_context11) {
+                      _args11 = arguments;
+                  return regeneratorRuntime.wrap(function _callee11$(_context12) {
                     while (1) {
-                      switch (_context11.prev = _context11.next) {
+                      switch (_context12.prev = _context12.next) {
                         case 0:
-                          options = _args10.length > 1 && _args10[1] !== undefined ? _args10[1] : {};
+                          options = _args11.length > 1 && _args11[1] !== undefined ? _args11[1] : {};
                           paneShownStyle = 'width: 24px; border-radius: 0.5em; border-top: solid #222 1px; border-left: solid #222 0.1em; border-bottom: solid #eee 0.1em; border-right: solid #eee 0.1em; margin-left: 1em; padding: 3px; background-color:   #ffd;';
                           paneHiddenStyle = 'width: 24px; border-radius: 0.5em; margin-left: 1em; padding: 3px';
                           paneIconTray = td.appendChild(dom.createElement('nav'));
                           paneIconTray.style = 'display:flex; justify-content: flex-start; align-items: center;';
 
                           if (!options.hideList) {
-                            _context11.next = 9;
+                            _context12.next = 9;
                             break;
                           }
 
-                          _context11.t0 = [];
-                          _context11.next = 12;
+                          _context12.t0 = [];
+                          _context12.next = 12;
                           break;
 
                         case 9:
-                          _context11.next = 11;
+                          _context12.next = 11;
                           return getRelevantPanes(subject, context);
 
                         case 11:
-                          _context11.t0 = _context11.sent;
+                          _context12.t0 = _context12.sent;
 
                         case 12:
-                          relevantPanes = _context11.t0;
+                          relevantPanes = _context12.t0;
                           tr.firstPane = requiredPane || getPane(relevantPanes, subject);
                           paneNumber = relevantPanes.indexOf(tr.firstPane);
 
@@ -113255,19 +113286,19 @@ function _default(context) {
                             });
                           }
 
-                          return _context11.abrupt("return", paneIconTray);
+                          return _context12.abrupt("return", paneIconTray);
 
                         case 17:
                         case "end":
-                          return _context11.stop();
+                          return _context12.stop();
                       }
                     }
-                  }, _callee10);
+                  }, _callee11);
                 }));
                 return _renderPaneIconTray.apply(this, arguments);
               };
 
-              renderPaneIconTray = function _renderPaneIconTray2(_x9) {
+              renderPaneIconTray = function _renderPaneIconTray2(_x10) {
                 return _renderPaneIconTray.apply(this, arguments);
               };
 
@@ -113299,16 +113330,16 @@ function _default(context) {
                 UI.widgets.makeDraggable(strong, subject);
               }
 
-              _context12.t0 = header;
-              _context12.next = 16;
+              _context13.t0 = header;
+              _context13.next = 16;
               return renderPaneIconTray(td, {
                 hideList: showHeader
               });
 
             case 16:
-              _context12.t1 = _context12.sent;
+              _context13.t1 = _context13.sent;
 
-              _context12.t0.appendChild.call(_context12.t0, _context12.t1);
+              _context13.t0.appendChild.call(_context13.t0, _context13.t1);
 
               // set DOM methods
               tr.firstChild.tabulatorSelect = function () {
@@ -113319,14 +113350,14 @@ function _default(context) {
                 setSelected(this, false);
               };
 
-              return _context12.abrupt("return", tr);
+              return _context13.abrupt("return", tr);
 
             case 21:
             case "end":
-              return _context12.stop();
+              return _context13.stop();
           }
         }
-      }, _callee11);
+      }, _callee12);
     }));
     return _expandedHeaderTR.apply(this, arguments);
   }
@@ -121963,25 +121994,26 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 var _default = {
-  buildTime: '2022-01-28T10:16:20Z',
-  commit: 'ad1ef0272c97b0830f9cb8d74ab8d42af173bcc1',
+  buildTime: '2022-02-09T16:31:11Z',
+  commit: '0d8bceeba53c989c3ab9d5b9a86b786c6977b999',
   npmInfo: {
-    'solid-panes': '3.5.15',
-    npm: '6.14.13',
-    ares: '1.17.1',
-    brotli: '1.0.9',
-    cldr: '39.0',
-    icu: '69.1',
-    llhttp: '2.1.3',
-    modules: '83',
-    napi: '8',
-    nghttp2: '1.42.0',
-    node: '14.17.3',
-    openssl: '1.1.1k',
-    tz: '2021a',
-    unicode: '13.0',
-    uv: '1.41.0',
-    v8: '8.4.371.23-node.67',
+    'solid-panes': '3.5.16-alpha',
+    npm: '6.10.0',
+    ares: '1.15.0',
+    brotli: '1.0.7',
+    cldr: '35.1',
+    http_parser: '2.8.0',
+    icu: '64.2',
+    llhttp: '1.1.4',
+    modules: '72',
+    napi: '4',
+    nghttp2: '1.39.1',
+    node: '12.7.0',
+    openssl: '1.1.1c',
+    tz: '2019a',
+    unicode: '12.1',
+    uv: '1.30.1',
+    v8: '7.5.288.22-node.16',
     zlib: '1.2.11'
   }
 };
@@ -127234,7 +127266,6 @@ var UI = {
 var $rdf = UI.rdf;
 var BOOK = $rdf.Namespace('http://www.w3.org/2002/01/bookmark#');
 var BOOKMARK_ICON = 'noun_45961.svg';
-var kb = _logic.store;
 var label = utils.label;
 var dom = window.document || null;
 /** Create a resource if it really does not exist
@@ -127245,19 +127276,20 @@ var dom = window.document || null;
 
 function createIfNotExists(doc) {
   return new Promise(function (resolve, reject) {
-    kb.fetcher.load(doc).then(function (response) {
-      debug.log('createIfNotExists doc exists, all good ' + doc); // kb.fetcher.webOperation('HEAD', doc.uri).then(response => {
+    _logic.store.fetcher.load(doc).then(function (response) {
+      debug.log('createIfNotExists doc exists, all good ' + doc); // store.fetcher.webOperation('HEAD', doc.uri).then(response => {
 
       resolve(response);
     }, function (err) {
       if (err.response.status === 404) {
         debug.log('createIfNotExists doc does NOT exist, will create... ' + doc);
-        kb.fetcher.webOperation('PUT', doc.uri, {
+
+        _logic.store.fetcher.webOperation('PUT', doc.uri, {
           data: '',
           contentType: 'text/turtle'
         }).then(function (response) {
           // fetcher.requested[doc.uri] = 'done' // do not need to read ??  but no headers
-          delete kb.fetcher.requested[doc.uri]; // delete cached 404 error
+          delete _logic.store.fetcher.requested[doc.uri]; // delete cached 404 error
 
           debug.log('createIfNotExists doc created ok ' + doc);
           resolve(response);
@@ -127276,13 +127308,14 @@ function createIfNotExists(doc) {
 
 function updatePromise(del, ins) {
   return new Promise(function (resolve, reject) {
-    kb.updater.update(del, ins, function (uri, ok, errorBody) {
+    _logic.store.updater.update(del, ins, function (uri, ok, errorBody) {
       if (!ok) {
         reject(new Error(errorBody));
       } else {
         resolve();
       }
     }); // callback
+
   }); // promise
 } // export findBookmarkDocument,
 
@@ -127411,8 +127444,8 @@ function _addBookmark() {
             throw new Error('Must be logged on to add Bookmark');
 
           case 4:
-            author = kb.any(target, ns.foaf('maker'));
-            title = label(author) + ': ' + kb.anyValue(target, ns.sioc('content')).slice(0, 80); // @@ add chat title too?
+            author = _logic.store.any(target, ns.foaf('maker'));
+            title = label(author) + ': ' + _logic.store.anyValue(target, ns.sioc('content')).slice(0, 80); // @@ add chat title too?
 
             bookmarkDoc = context.bookmarkDocument;
             bookmark = UI.widgets.newThing(bookmarkDoc, title);
@@ -127457,10 +127490,10 @@ function _toggleBookmark() {
         switch (_context3.prev = _context3.next) {
           case 0:
             _context3.next = 2;
-            return kb.fetcher.load(userContext.bookmarkDocument);
+            return _logic.store.fetcher.load(userContext.bookmarkDocument);
 
           case 2:
-            bookmarks = kb.each(null, BOOK('recalls'), target, userContext.bookmarkDocument);
+            bookmarks = _logic.store.each(null, BOOK('recalls'), target, userContext.bookmarkDocument);
 
             if (!bookmarks.length) {
               _context3.next = 24;
@@ -127485,7 +127518,7 @@ function _toggleBookmark() {
 
             _context3.prev = 8;
             _context3.next = 11;
-            return updatePromise(kb.connectedStatements(bookmarks[i]), []);
+            return updatePromise(_logic.store.connectedStatements(bookmarks[i]), []);
 
           case 11:
             bookmarkButton.style.backgroundColor = 'white';
@@ -127547,10 +127580,10 @@ function _renderBookmarksButton() {
                     switch (_context4.prev = _context4.next) {
                       case 0:
                         _context4.next = 2;
-                        return kb.fetcher.load(userContext.bookmarkDocument);
+                        return _logic.store.fetcher.load(userContext.bookmarkDocument);
 
                       case 2:
-                        bookmarked = kb.any(null, BOOK('recalls'), bookmarkButton.target, userContext.bookmarkDocument);
+                        bookmarked = _logic.store.any(null, BOOK('recalls'), bookmarkButton.target, userContext.bookmarkDocument);
                         bookmarkButton.style = UI.style.buttonStyle;
                         if (bookmarked) bookmarkButton.style.backgroundColor = 'yellow';
 
@@ -127596,6 +127629,357 @@ function _renderBookmarksButton() {
 
 /***/ }),
 
+/***/ "./node_modules/solid-ui/lib/chat/chatLogic.js":
+/*!*****************************************************!*\
+  !*** ./node_modules/solid-ui/lib/chat/chatLogic.js ***!
+  \*****************************************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/solid-ui/node_modules/@babel/runtime/helpers/interopRequireDefault.js");
+
+var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "./node_modules/solid-ui/node_modules/@babel/runtime/helpers/typeof.js");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ChatChannel = void 0;
+exports._createIfNotExists = _createIfNotExists;
+exports.isDeleted = isDeleted;
+exports.isHidden = isHidden;
+exports.isReplaced = isReplaced;
+exports.mostRecentVersion = mostRecentVersion;
+exports.nick = nick;
+exports.originalVersion = originalVersion;
+
+var _regenerator = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/regenerator */ "./node_modules/solid-ui/node_modules/@babel/runtime/regenerator/index.js"));
+
+var _asyncToGenerator2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/asyncToGenerator */ "./node_modules/solid-ui/node_modules/@babel/runtime/helpers/asyncToGenerator.js"));
+
+var _classCallCheck2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/classCallCheck */ "./node_modules/solid-ui/node_modules/@babel/runtime/helpers/classCallCheck.js"));
+
+var _createClass2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/createClass */ "./node_modules/solid-ui/node_modules/@babel/runtime/helpers/createClass.js"));
+
+var debug = _interopRequireWildcard(__webpack_require__(/*! ../debug */ "./node_modules/solid-ui/lib/debug.js"));
+
+var _index = __webpack_require__(/*! ../authn/index */ "./node_modules/solid-ui/lib/authn/index.js");
+
+var _dateFolder = __webpack_require__(/*! ./dateFolder */ "./node_modules/solid-ui/lib/chat/dateFolder.js");
+
+var _logic = __webpack_require__(/*! ../logic */ "./node_modules/solid-ui/lib/logic.js");
+
+var ns = _interopRequireWildcard(__webpack_require__(/*! ../ns */ "./node_modules/solid-ui/lib/ns.js"));
+
+var $rdf = _interopRequireWildcard(__webpack_require__(/*! rdflib */ "./node_modules/rdflib/esm/index.js"));
+
+var utils = _interopRequireWildcard(__webpack_require__(/*! ../utils */ "./node_modules/solid-ui/lib/utils/index.js"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+/**
+ * Contains the [[ChatChannel]] class and logic for Solid Chat
+ * @packageDocumentation
+ */
+// pull in first avoid cross-refs
+
+/* The Solid logic for a 'LongChat'
+*/
+
+/**
+ * Common code for a chat (discussion area of messages about something)
+ * This version runs over a series of files for different time periods
+ *
+ * Parameters for the whole chat like its title are stored on
+ * index.ttl#this and the chats messages are stored in YYYY/MM/DD/chat.ttl
+ *
+ */
+var ChatChannel = /*#__PURE__*/function () {
+  function ChatChannel(channel, options) {
+    (0, _classCallCheck2["default"])(this, ChatChannel);
+    this.channel = channel;
+    this.channelRoot = channel.doc();
+    this.options = options;
+    this.dateFolder = new _dateFolder.DateFolder(this.channelRoot, 'chat.ttl');
+    this.div = null; // : HTMLElement
+  }
+  /* Store a new message in the web,
+  */
+
+
+  (0, _createClass2["default"])(ChatChannel, [{
+    key: "createMessage",
+    value: function () {
+      var _createMessage = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(text) {
+        return _regenerator["default"].wrap(function _callee$(_context) {
+          while (1) {
+            switch (_context.prev = _context.next) {
+              case 0:
+                return _context.abrupt("return", this.updateMessage(text));
+
+              case 1:
+              case "end":
+                return _context.stop();
+            }
+          }
+        }, _callee, this);
+      }));
+
+      function createMessage(_x) {
+        return _createMessage.apply(this, arguments);
+      }
+
+      return createMessage;
+    }()
+    /* Store a new message in the web,
+      as a replacement for an existing one.
+      The old one iis left, and the two are linked
+    */
+
+  }, {
+    key: "updateMessage",
+    value: function () {
+      var _updateMessage = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(text) {
+        var oldMsg,
+            deleteIt,
+            sts,
+            now,
+            timestamp,
+            dateStamp,
+            chatDocument,
+            message,
+            me,
+            msg,
+            _args2 = arguments;
+        return _regenerator["default"].wrap(function _callee2$(_context2) {
+          while (1) {
+            switch (_context2.prev = _context2.next) {
+              case 0:
+                oldMsg = _args2.length > 1 && _args2[1] !== undefined ? _args2[1] : null;
+                deleteIt = _args2.length > 2 ? _args2[2] : undefined;
+                sts = [];
+                now = new Date();
+                timestamp = '' + now.getTime();
+                dateStamp = $rdf.term(now);
+                chatDocument = oldMsg ? oldMsg.doc() : this.dateFolder.leafDocumentFromDate(now);
+                message = _logic.store.sym(chatDocument.uri + '#' + 'Msg' + timestamp); // const content = store.literal(text)
+
+                me = _index.authn.currentUser(); // If already logged on
+
+                if (oldMsg) {
+                  // edit message replaces old one
+                  sts.push($rdf.st(mostRecentVersion(oldMsg), ns.dct('isReplacedBy'), message, chatDocument));
+
+                  if (deleteIt) {
+                    sts.push($rdf.st(message, ns.schema('dateDeleted'), dateStamp, chatDocument));
+                  }
+                } else {
+                  // link new message to channel
+                  sts.push($rdf.st(this.channel, ns.wf('message'), message, chatDocument));
+                }
+
+                sts.push($rdf.st(message, ns.sioc('content'), _logic.store.literal(text), chatDocument));
+                sts.push($rdf.st(message, ns.dct('created'), dateStamp, chatDocument));
+
+                if (me) {
+                  sts.push($rdf.st(message, ns.foaf('maker'), me, chatDocument));
+                }
+
+                _context2.prev = 13;
+                _context2.next = 16;
+                return _logic.store.updater.update([], sts);
+
+              case 16:
+                _context2.next = 24;
+                break;
+
+              case 18:
+                _context2.prev = 18;
+                _context2.t0 = _context2["catch"](13);
+                msg = 'Error saving chat message: ' + _context2.t0;
+                debug.warn(msg);
+                alert(msg);
+                throw new Error(msg);
+
+              case 24:
+                return _context2.abrupt("return", message);
+
+              case 25:
+              case "end":
+                return _context2.stop();
+            }
+          }
+        }, _callee2, this, [[13, 18]]);
+      }));
+
+      function updateMessage(_x2) {
+        return _updateMessage.apply(this, arguments);
+      }
+
+      return updateMessage;
+    }()
+    /* Mark a message as deleted
+    * Wee add a new version of the message,m witha deletion flag (deletion date)
+    * so that the deletion can be revoked by adding another non-deleted update
+    */
+
+  }, {
+    key: "deleteMessage",
+    value: function () {
+      var _deleteMessage = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3(message) {
+        return _regenerator["default"].wrap(function _callee3$(_context3) {
+          while (1) {
+            switch (_context3.prev = _context3.next) {
+              case 0:
+                return _context3.abrupt("return", this.updateMessage('(message deleted)', message, true));
+
+              case 1:
+              case "end":
+                return _context3.stop();
+            }
+          }
+        }, _callee3, this);
+      }));
+
+      function deleteMessage(_x3) {
+        return _deleteMessage.apply(this, arguments);
+      }
+
+      return deleteMessage;
+    }()
+  }]);
+  return ChatChannel;
+}(); // class ChatChannel
+
+
+exports.ChatChannel = ChatChannel;
+
+function originalVersion(message) {
+  var msg = message;
+
+  while (msg) {
+    message = msg;
+    msg = _logic.store.any(null, ns.dct('isReplacedBy'), message, message.doc());
+  }
+
+  return message;
+}
+
+function mostRecentVersion(message) {
+  var msg = message;
+
+  while (msg) {
+    message = msg;
+    msg = _logic.store.any(message, ns.dct('isReplacedBy'), null, message.doc());
+  }
+
+  return message;
+}
+
+function isDeleted(message) {
+  return _logic.store.holds(message, ns.schema('dateDeleted'), null, message.doc());
+}
+
+function isReplaced(message) {
+  return _logic.store.holds(message, ns.dct('isReplacedBy'), null, message.doc());
+}
+
+function isHidden(message) {
+  return this.isDeleted(message) || this.isReplaced(message);
+} // A Nickname for a person
+
+
+function nick(person) {
+  var s = _logic.store.any(person, ns.foaf('nick'));
+
+  if (s) return '' + s.value;
+  return '' + utils.label(person);
+}
+
+function _createIfNotExists(_x4) {
+  return _createIfNotExists2.apply(this, arguments);
+} // ends
+
+
+function _createIfNotExists2() {
+  _createIfNotExists2 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee4(doc) {
+    var contentType,
+        data,
+        response,
+        _args4 = arguments;
+    return _regenerator["default"].wrap(function _callee4$(_context4) {
+      while (1) {
+        switch (_context4.prev = _context4.next) {
+          case 0:
+            contentType = _args4.length > 1 && _args4[1] !== undefined ? _args4[1] : 'text/turtle';
+            data = _args4.length > 2 && _args4[2] !== undefined ? _args4[2] : '';
+            _context4.prev = 2;
+            _context4.next = 5;
+            return _logic.store.fetcher.load(doc);
+
+          case 5:
+            response = _context4.sent;
+            _context4.next = 28;
+            break;
+
+          case 8:
+            _context4.prev = 8;
+            _context4.t0 = _context4["catch"](2);
+
+            if (!(_context4.t0.response.status === 404)) {
+              _context4.next = 26;
+              break;
+            }
+
+            debug.log('createIfNotExists: doc does NOT exist, will create... ' + doc);
+            _context4.prev = 12;
+            _context4.next = 15;
+            return _logic.store.fetcher.webOperation('PUT', doc.uri, {
+              data: data,
+              contentType: contentType
+            });
+
+          case 15:
+            response = _context4.sent;
+            _context4.next = 22;
+            break;
+
+          case 18:
+            _context4.prev = 18;
+            _context4.t1 = _context4["catch"](12);
+            debug.log('createIfNotExists doc FAILED: ' + doc + ': ' + _context4.t1);
+            throw _context4.t1;
+
+          case 22:
+            delete _logic.store.fetcher.requested[doc.uri]; // delete cached 404 error
+            // debug.log('createIfNotExists doc created ok ' + doc)
+
+            return _context4.abrupt("return", response);
+
+          case 26:
+            debug.log('createIfNotExists doc load error NOT 404:  ' + doc + ': ' + _context4.t0);
+            throw _context4.t0;
+
+          case 28:
+            return _context4.abrupt("return", response);
+
+          case 29:
+          case "end":
+            return _context4.stop();
+        }
+      }
+    }, _callee4, null, [[2, 8], [12, 18]]);
+  }));
+  return _createIfNotExists2.apply(this, arguments);
+}
+//# sourceMappingURL=chatLogic.js.map
+
+/***/ }),
+
 /***/ "./node_modules/solid-ui/lib/chat/dateFolder.js":
 /*!******************************************************!*\
   !*** ./node_modules/solid-ui/lib/chat/dateFolder.js ***!
@@ -127637,14 +128021,14 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 /**
  * Contains the [[DateFolder]] class
- * @packageDocumentation
+ * This tracks data stored in dated folders and sub-folders
+ *
  */
 // pull in first avoid cross-refs
-var kb = _logic.store;
+
 /**
  * Track back through the YYYY/MM/DD tree to find the previous/next day
  */
-
 var DateFolder = /*#__PURE__*/function () {
   function DateFolder(rootThing, leafFileName, membershipProperty) {
     (0, _classCallCheck2["default"])(this, DateFolder);
@@ -127668,7 +128052,7 @@ var DateFolder = /*#__PURE__*/function () {
       var path = isoDate.split('T')[0].replace(/-/g, '/'); //  Like "2018/05/07"
 
       path = this.root.dir().uri + path + '/' + this.leafFileName;
-      return kb.sym(path);
+      return _logic.store.sym(path);
     }
     /* Generate a date object from the leaf file name
      */
@@ -127730,12 +128114,12 @@ var DateFolder = /*#__PURE__*/function () {
                                         }
 
                                         _folder = siblings.pop();
-                                        leafDocument = kb.sym(_folder.uri + thisDateFolder.leafFileName);
+                                        leafDocument = _logic.store.sym(_folder.uri + thisDateFolder.leafFileName);
                                         _context.next = 10;
-                                        return kb.fetcher.load(leafDocument);
+                                        return _logic.store.fetcher.load(leafDocument);
 
                                       case 10:
-                                        if (!(kb.statementsMatching(null, ns.dct('created'), null, leafDocument).length > 0)) {
+                                        if (!(_logic.store.statementsMatching(null, ns.dct('created'), null, leafDocument).length > 0)) {
                                           _context.next = 12;
                                           break;
                                         }
@@ -127779,10 +128163,10 @@ var DateFolder = /*#__PURE__*/function () {
                             // debug.log('  previousPeriod level' + level + ' file ' + file)
                             parent = file.dir();
                             _context2.next = 7;
-                            return kb.fetcher.load(parent);
+                            return _logic.store.fetcher.load(parent);
 
                           case 7:
-                            siblings = kb.each(parent, ns.ldp('contains'));
+                            siblings = _logic.store.each(parent, ns.ldp('contains'));
                             siblings = siblings.filter(younger);
                             _context2.next = 11;
                             return lastNonEmpty(siblings);
@@ -127821,10 +128205,10 @@ var DateFolder = /*#__PURE__*/function () {
 
                           case 21:
                             _context2.next = 23;
-                            return kb.fetcher.load(uncle);
+                            return _logic.store.fetcher.load(uncle);
 
                           case 23:
-                            cousins = kb.each(uncle, ns.ldp('contains'));
+                            cousins = _logic.store.each(uncle, ns.ldp('contains'));
                             _context2.next = 26;
                             return lastNonEmpty(cousins);
 
@@ -127860,7 +128244,7 @@ var DateFolder = /*#__PURE__*/function () {
                   break;
                 }
 
-                doc = kb.sym(found.uri + this.leafFileName);
+                doc = _logic.store.sym(found.uri + this.leafFileName);
                 return _context3.abrupt("return", this.dateFromLeafDocument(doc));
 
               case 10:
@@ -128031,152 +128415,53 @@ var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "./node_m
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.createIfNotExists = createIfNotExists;
 exports.desktopNotification = desktopNotification;
 exports.infiniteMessageArea = infiniteMessageArea;
+exports.insertMessageIntoTable = insertMessageIntoTable;
 
 var _regenerator = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/regenerator */ "./node_modules/solid-ui/node_modules/@babel/runtime/regenerator/index.js"));
 
 var _asyncToGenerator2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/asyncToGenerator */ "./node_modules/solid-ui/node_modules/@babel/runtime/helpers/asyncToGenerator.js"));
 
-var _index = __webpack_require__(/*! ../authn/index */ "./node_modules/solid-ui/lib/authn/index.js");
-
 var debug = _interopRequireWildcard(__webpack_require__(/*! ../debug */ "./node_modules/solid-ui/lib/debug.js"));
 
 var _iconBase = __webpack_require__(/*! ../iconBase */ "./node_modules/solid-ui/lib/iconBase.js");
 
 var _logic = __webpack_require__(/*! ../logic */ "./node_modules/solid-ui/lib/logic.js");
 
-var _index2 = __webpack_require__(/*! ../media/index */ "./node_modules/solid-ui/lib/media/index.js");
-
 var ns = _interopRequireWildcard(__webpack_require__(/*! ../ns */ "./node_modules/solid-ui/lib/ns.js"));
 
-var pad = _interopRequireWildcard(__webpack_require__(/*! ../pad */ "./node_modules/solid-ui/lib/pad.js"));
-
-var _dateFolder = __webpack_require__(/*! ./dateFolder */ "./node_modules/solid-ui/lib/chat/dateFolder.js");
+var _chatLogic = __webpack_require__(/*! ./chatLogic */ "./node_modules/solid-ui/lib/chat/chatLogic.js");
 
 var _message = __webpack_require__(/*! ./message */ "./node_modules/solid-ui/lib/chat/message.js");
 
-var _bookmarks = __webpack_require__(/*! ./bookmarks */ "./node_modules/solid-ui/lib/chat/bookmarks.js");
-
 var $rdf = _interopRequireWildcard(__webpack_require__(/*! rdflib */ "./node_modules/rdflib/esm/index.js"));
 
-var style = _interopRequireWildcard(__webpack_require__(/*! ../style */ "./node_modules/solid-ui/lib/style.js"));
-
-var utils = _interopRequireWildcard(__webpack_require__(/*! ../utils */ "./node_modules/solid-ui/lib/utils/index.js"));
-
 var widgets = _interopRequireWildcard(__webpack_require__(/*! ../widgets */ "./node_modules/solid-ui/lib/widgets/index.js"));
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
-
-var UI = {
-  authn: _index.authn,
-  icons: _iconBase.icons,
-  ns: ns,
-  media: _index2.media,
-  pad: pad,
-  $rdf: $rdf,
-  store: _logic.store,
-  style: style,
-  utils: utils,
-  widgets: widgets
-};
-/* global alert */
-
-var SERVER_MKDIRP_BUG = false; // Set false timbl 2021-10-31 should be fixed by now
-
-function createIfNotExists(_x) {
-  return _createIfNotExists.apply(this, arguments);
-}
-
-function _createIfNotExists() {
-  _createIfNotExists = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(doc) {
-    var contentType,
-        data,
-        fetcher,
-        response,
-        _args = arguments;
-    return _regenerator["default"].wrap(function _callee$(_context) {
-      while (1) {
-        switch (_context.prev = _context.next) {
-          case 0:
-            contentType = _args.length > 1 && _args[1] !== undefined ? _args[1] : 'text/turtle';
-            data = _args.length > 2 && _args[2] !== undefined ? _args[2] : '';
-            fetcher = UI.store.fetcher;
-            _context.prev = 3;
-            _context.next = 6;
-            return fetcher.load(doc);
-
-          case 6:
-            response = _context.sent;
-            _context.next = 29;
-            break;
-
-          case 9:
-            _context.prev = 9;
-            _context.t0 = _context["catch"](3);
-
-            if (!(_context.t0.response.status === 404)) {
-              _context.next = 27;
-              break;
-            }
-
-            debug.log('createIfNotExists: doc does NOT exist, will create... ' + doc);
-            _context.prev = 13;
-            _context.next = 16;
-            return fetcher.webOperation('PUT', doc.uri, {
-              data: data,
-              contentType: contentType
-            });
-
-          case 16:
-            response = _context.sent;
-            _context.next = 23;
-            break;
-
-          case 19:
-            _context.prev = 19;
-            _context.t1 = _context["catch"](13);
-            debug.log('createIfNotExists doc FAILED: ' + doc + ': ' + _context.t1);
-            throw _context.t1;
-
-          case 23:
-            delete fetcher.requested[doc.uri]; // delete cached 404 error
-            // debug.log('createIfNotExists doc created ok ' + doc)
-
-            return _context.abrupt("return", response);
-
-          case 27:
-            debug.log('createIfNotExists doc load error NOT 404:  ' + doc + ': ' + _context.t0);
-            throw _context.t0;
-
-          case 29:
-            return _context.abrupt("return", response);
-
-          case 30:
-          case "end":
-            return _context.stop();
-        }
-      }
-    }, _callee, null, [[3, 9], [13, 19]]);
-  }));
-  return _createIfNotExists.apply(this, arguments);
-}
-
+/**
+ * Contains the [[infiniteMessageArea]] class
+ * @packageDocumentation
+ */
+// import { authn } from '../authn/index'
+// import { media } from '../media/index'
+// import * as pad from '../pad'
+// import { DateFolder } from './dateFolder'
+// import { findBookmarkDocument } from './bookmarks'
+// pull in first avoid cross-refs
+// import * as style from '../style'
+// import * as utils from '../utils'
+// const UI = { authn, icons, ns, media, pad, $rdf, store, style, utils, widgets }
 function desktopNotification(str) {
   // Let's check if the browser supports notifications
   if (!('Notification' in window)) {
-    debug.warn('This browser does not support desktop notification');
+    debug.warn('This browser does no t support desktop notification');
   } else if (Notification.permission === 'granted') {
-    // Let's check whether notification permissions have already been granted
+    // Let's check whether notificatio n permissions have already been granted
     // eslint-disable-next-line no-new
     new Notification(str);
   } else if (Notification.permission !== 'denied') {
@@ -128192,33 +128477,84 @@ function desktopNotification(str) {
   // want to be respectful there is no need to bother them any more.
 
 }
+/**
+ * Renders a chat message inside a `messageTable`
+ */
+
+
+function insertMessageIntoTable(channelObject, messageTable, message, fresh, options, userContext) {
+  var messageRow = (0, _message.renderMessageRow)(channelObject, message, fresh, options, userContext); // const message = messageRow.AJAR_subject
+
+  if (options.selectedMessage && options.selectedMessage.sameTerm(message)) {
+    messageRow.style.backgroundColor = 'yellow';
+    options.selectedElement = messageRow;
+    messageTable.selectedElement = messageRow;
+  }
+
+  var done = false;
+
+  for (var ele = messageTable.firstChild;; ele = ele.nextSibling) {
+    if (!ele) {
+      // empty
+      break;
+    }
+
+    var newestFirst = options.newestfirst === true;
+    var dateString = messageRow.AJAR_date;
+
+    if (dateString > ele.AJAR_date && newestFirst || dateString < ele.AJAR_date && !newestFirst) {
+      messageTable.insertBefore(messageRow, ele);
+      done = true;
+      break;
+    }
+  }
+
+  if (!done) {
+    messageTable.appendChild(messageRow);
+  }
+}
 /**
  * Common code for a chat (discussion area of messages about something)
  * This version runs over a series of files for different time periods
  *
  * Parameters for the whole chat like its title are stored on
  * index.ttl#this and the chats messages are stored in YYYY/MM/DD/chat.ttl
+ *
+ * Use to import store as param 2, now ignores it and uses the UI main store
+ *
+ * Options include:
+
+ - shiftEnterSendsMessage: Use shift/enter to send message, Enter to add newline, instead of the reverse.
+ - authorDateOnLeft:  Display the author's anme and date of the message in the left column instead of first above the content
+ - selectedMessage: Display one message highlighted with the chat around it
+ - solo: By itelf on a webpage, so user scroll anywhere in the web page scan scroll the chat.
+ - newestFirst: Arrange the chat messages chronologically newest at the top insted of at the bottom
+ - infinite:  Use infinite scroll
+ - showDeletedMessages: Show messages which have been delted as "deleted message". Otherwise hide them.
+ - expandImagesInline: If a URI by itself in a message looks like an image URI, replace it with the image
+ - inlineImageHeightEms: The height (in ems) of images expaned from their URIs in the chat.
+
  */
 
 
-function infiniteMessageArea(_x2, _x3, _x4, _x5) {
+function infiniteMessageArea(_x, _x2, _x3, _x4) {
   return _infiniteMessageArea.apply(this, arguments);
 }
 
 function _infiniteMessageArea() {
-  _infiniteMessageArea = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee17(dom, kb, chatChannel, options) {
-    var ns, WF, DCT, newestFirst, dateFolder, messageBodyStyle, div, menuButton, statusArea, userContext, me, updater, newMessageForm, syncMessages, addMessage, insertPreviousMessages, _insertPreviousMessages, removePreviousMessages, createMessageTable, _createMessageTable, renderMessageTable, addNewTableIfNewDay, _addNewTableIfNewDay, appendCurrentMessages, _appendCurrentMessages, liveMessageTable, earliest, latest, lock, loadMoreWhereNeeded, _loadMoreWhereNeeded, loadInitialContent, _loadInitialContent;
+  _infiniteMessageArea = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee12(dom, wasStore, chatChannel, options) {
+    var syncMessages, addMessage, insertPreviousMessages, _insertPreviousMessages, removePreviousMessages, createMessageTable, _createMessageTable, renderMessageTable, addNewChatDocumentIfNewDay, _addNewChatDocumentIfNewDay, appendCurrentMessages, _appendCurrentMessages, loadMoreWhereNeeded, _loadMoreWhereNeeded, loadInitialContent, _loadInitialContent, newestFirst, channelObject, dateFolder, div, statusArea, userContext, liveMessageTable, earliest, latest, lock;
 
-    return _regenerator["default"].wrap(function _callee17$(_context17) {
+    return _regenerator["default"].wrap(function _callee12$(_context12) {
       while (1) {
-        switch (_context17.prev = _context17.next) {
+        switch (_context12.prev = _context12.next) {
           case 0:
             _loadInitialContent = function _loadInitialContent3() {
-              _loadInitialContent = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee16() {
+              _loadInitialContent = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee11() {
                 var yank, fixScroll, live, selectedDocument, now, todayDocument, selectedMessageTable, selectedDate;
-                return _regenerator["default"].wrap(function _callee16$(_context16) {
+                return _regenerator["default"].wrap(function _callee11$(_context11) {
                   while (1) {
-                    switch (_context16.prev = _context16.next) {
+                    switch (_context11.prev = _context11.next) {
                       case 0:
                         fixScroll = function _fixScroll() {
                           if (options.selectedElement) {
@@ -128246,27 +128582,27 @@ function _infiniteMessageArea() {
                         }
 
                         if (!(options.selectedMessage && !live)) {
-                          _context16.next = 15;
+                          _context11.next = 15;
                           break;
                         }
 
                         selectedDate = dateFolder.dateFromLeafDocument(selectedDocument);
-                        _context16.next = 7;
+                        _context11.next = 7;
                         return createMessageTable(selectedDate, live);
 
                       case 7:
-                        selectedMessageTable = _context16.sent;
+                        selectedMessageTable = _context11.sent;
                         div.appendChild(selectedMessageTable);
                         earliest.messageTable = selectedMessageTable;
                         latest.messageTable = selectedMessageTable;
                         yank();
                         setTimeout(yank, 1000); // @@ kludge - restore position distubed by other cHANGES
 
-                        _context16.next = 19;
+                        _context11.next = 19;
                         break;
 
                       case 15:
-                        _context16.next = 17;
+                        _context11.next = 17;
                         return appendCurrentMessages();
 
                       case 17:
@@ -128274,7 +128610,7 @@ function _infiniteMessageArea() {
                         latest.messageTable = liveMessageTable;
 
                       case 19:
-                        _context16.next = 21;
+                        _context11.next = 21;
                         return loadMoreWhereNeeded(null, fixScroll);
 
                       case 21:
@@ -128286,10 +128622,10 @@ function _infiniteMessageArea() {
 
                       case 23:
                       case "end":
-                        return _context16.stop();
+                        return _context11.stop();
                     }
                   }
-                }, _callee16);
+                }, _callee11);
               }));
               return _loadInitialContent.apply(this, arguments);
             };
@@ -128299,18 +128635,18 @@ function _infiniteMessageArea() {
             };
 
             _loadMoreWhereNeeded = function _loadMoreWhereNeeded3() {
-              _loadMoreWhereNeeded = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee15(event, fixScroll) {
+              _loadMoreWhereNeeded = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee10(event, fixScroll) {
                 var freeze, magicZone, done, scrollBottom, scrollTop;
-                return _regenerator["default"].wrap(function _callee15$(_context15) {
+                return _regenerator["default"].wrap(function _callee10$(_context10) {
                   while (1) {
-                    switch (_context15.prev = _context15.next) {
+                    switch (_context10.prev = _context10.next) {
                       case 0:
                         if (!lock) {
-                          _context15.next = 2;
+                          _context10.next = 2;
                           break;
                         }
 
-                        return _context15.abrupt("return");
+                        return _context10.abrupt("return");
 
                       case 2:
                         lock = true;
@@ -128320,12 +128656,12 @@ function _infiniteMessageArea() {
 
                       case 5:
                         if (!(div.scrollTop < magicZone && earliest.messageTable && !earliest.messageTable.initial && earliest.messageTable.extendBackwards)) {
-                          _context15.next = 21;
+                          _context10.next = 21;
                           break;
                         }
 
                         if (!(div.scrollHeight === 0)) {
-                          _context15.next = 10;
+                          _context10.next = 10;
                           break;
                         }
 
@@ -128333,17 +128669,17 @@ function _infiniteMessageArea() {
                         setTimeout(loadMoreWhereNeeded, 2000); // couple be less
 
                         lock = false;
-                        return _context15.abrupt("return");
+                        return _context10.abrupt("return");
 
                       case 10:
                         // console.log('    chat/loadMoreWhereNeeded: Going now')
                         scrollBottom = div.scrollHeight - div.scrollTop;
                         debug.log('infinite scroll: adding above: top ' + div.scrollTop);
-                        _context15.next = 14;
+                        _context10.next = 14;
                         return earliest.messageTable.extendBackwards();
 
                       case 14:
-                        done = _context15.sent;
+                        done = _context10.sent;
 
                         if (freeze) {
                           div.scrollTop = div.scrollHeight - scrollBottom;
@@ -128352,14 +128688,14 @@ function _infiniteMessageArea() {
                         if (fixScroll) fixScroll();
 
                         if (!done) {
-                          _context15.next = 19;
+                          _context10.next = 19;
                           break;
                         }
 
-                        return _context15.abrupt("break", 21);
+                        return _context10.abrupt("break", 21);
 
                       case 19:
-                        _context15.next = 5;
+                        _context10.next = 5;
                         break;
 
                       case 21:
@@ -128367,17 +128703,17 @@ function _infiniteMessageArea() {
                         div.scrollHeight - div.scrollTop - div.clientHeight < magicZone && // we are scrolled right to the bottom
                         latest.messageTable && !latest.messageTable["final"] && // there is more data to come
                         latest.messageTable.extendForwards)) {
-                          _context15.next = 33;
+                          _context10.next = 33;
                           break;
                         }
 
                         scrollTop = div.scrollTop;
                         debug.log('infinite scroll: adding below: bottom: ' + (div.scrollHeight - div.scrollTop - div.clientHeight));
-                        _context15.next = 26;
+                        _context10.next = 26;
                         return latest.messageTable.extendForwards();
 
                       case 26:
-                        done = _context15.sent;
+                        done = _context10.sent;
 
                         // then add more data on the bottom
                         if (freeze) {
@@ -128387,14 +128723,14 @@ function _infiniteMessageArea() {
                         if (fixScroll) fixScroll();
 
                         if (!done) {
-                          _context15.next = 31;
+                          _context10.next = 31;
                           break;
                         }
 
-                        return _context15.abrupt("break", 33);
+                        return _context10.abrupt("break", 33);
 
                       case 31:
-                        _context15.next = 21;
+                        _context10.next = 21;
                         break;
 
                       case 33:
@@ -128402,72 +128738,68 @@ function _infiniteMessageArea() {
 
                       case 34:
                       case "end":
-                        return _context15.stop();
+                        return _context10.stop();
                     }
                   }
-                }, _callee15);
+                }, _callee10);
               }));
               return _loadMoreWhereNeeded.apply(this, arguments);
             };
 
-            loadMoreWhereNeeded = function _loadMoreWhereNeeded2(_x18, _x19) {
+            loadMoreWhereNeeded = function _loadMoreWhereNeeded2(_x10, _x11) {
               return _loadMoreWhereNeeded.apply(this, arguments);
             };
 
             _appendCurrentMessages = function _appendCurrentMessage2() {
-              _appendCurrentMessages = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee14() {
+              _appendCurrentMessages = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee9() {
                 var now, chatDocument, messageTable;
-                return _regenerator["default"].wrap(function _callee14$(_context14) {
+                return _regenerator["default"].wrap(function _callee9$(_context9) {
                   while (1) {
-                    switch (_context14.prev = _context14.next) {
+                    switch (_context9.prev = _context9.next) {
                       case 0:
                         now = new Date();
-                        chatDocument = dateFolder.leafDocumentFromDate(now);
-                        /*   Don't actually make the documemnt until a message is sent  @@@@@ WHEN SERVER FIXED
-                         * currently server won't patch to a file ina non-existent directory
-                         */
+                        chatDocument = dateFolder.leafDocumentFromDate(now); /// ///////////////////////////////////////////////////////////
 
-                        /*
-                        if (SERVER_MKDIRP_BUG) {
-                          try {
-                            await createIfNotExists(chatDocument)
-                          } catch (e) {
-                            div.appendChild(UI.widgets.errorMessageBlock(
-                              dom, 'Problem accessing chat file: ' + e))
-                            return
-                          }
-                        }
-                        */
-                        /// ///////////////////////////////////////////////////////////
-
-                        _context14.next = 4;
+                        _context9.next = 4;
                         return createMessageTable(now, true);
 
                       case 4:
-                        messageTable = _context14.sent;
+                        messageTable = _context9.sent;
                         div.appendChild(messageTable);
+                        div.refresh = /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee8() {
+                          return _regenerator["default"].wrap(function _callee8$(_context8) {
+                            while (1) {
+                              switch (_context8.prev = _context8.next) {
+                                case 0:
+                                  _context8.next = 2;
+                                  return addNewChatDocumentIfNewDay(new Date());
+
+                                case 2:
+                                  syncMessages(chatChannel, messageTable); // @@ livemessagetable??
+
+                                  desktopNotification(chatChannel);
+
+                                case 4:
+                                case "end":
+                                  return _context8.stop();
+                              }
+                            }
+                          }, _callee8);
+                        })); // The short chat version the live update listening is done in the pane but we do it in the widget @@
 
-                        div.refresh = function () {
-                          // only the last messageTable is live
-                          addNewTableIfNewDay(new Date()).then(function () {
-                            syncMessages(chatChannel, messageTable);
-                            desktopNotification(chatChannel);
-                          });
-                        }; // The short chat version fors live update in the pane but we do it in the widget
-
+                        _logic.store.updater.addDownstreamChangeListener(chatDocument, div.refresh); // Live update
 
-                        kb.updater.addDownstreamChangeListener(chatDocument, div.refresh); // Live update
 
                         liveMessageTable = messageTable;
                         latest.messageTable = liveMessageTable;
-                        return _context14.abrupt("return", messageTable);
+                        return _context9.abrupt("return", messageTable);
 
                       case 11:
                       case "end":
-                        return _context14.stop();
+                        return _context9.stop();
                     }
                   }
-                }, _callee14);
+                }, _callee9);
               }));
               return _appendCurrentMessages.apply(this, arguments);
             };
@@ -128476,19 +128808,18 @@ function _infiniteMessageArea() {
               return _appendCurrentMessages.apply(this, arguments);
             };
 
-            _addNewTableIfNewDay = function _addNewTableIfNewDay3() {
-              _addNewTableIfNewDay = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee13(now) {
+            _addNewChatDocumentIfNewDay = function _addNewChatDocumentIf2() {
+              _addNewChatDocumentIfNewDay = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee7() {
                 var newChatDocument, oldChatDocument, sts;
-                return _regenerator["default"].wrap(function _callee13$(_context13) {
+                return _regenerator["default"].wrap(function _callee7$(_context7) {
                   while (1) {
-                    switch (_context13.prev = _context13.next) {
+                    switch (_context7.prev = _context7.next) {
                       case 0:
-                        // let now = new Date()
                         // @@ Remove listener from previous table as it is now static
-                        newChatDocument = dateFolder.leafDocumentFromDate(now);
+                        newChatDocument = dateFolder.leafDocumentFromDate(new Date());
 
                         if (newChatDocument.sameTerm(latest.messageTable.chatDocument)) {
-                          _context13.next = 7;
+                          _context7.next = 7;
                           break;
                         }
 
@@ -128499,36 +128830,37 @@ function _infiniteMessageArea() {
                         }
 
                         oldChatDocument = latest.messageTable.chatDocument;
-                        _context13.next = 6;
+                        _context7.next = 6;
                         return appendCurrentMessages();
 
                       case 6:
                         // Adding a link in the document will ping listeners to add the new block too
-                        if (!kb.holds(oldChatDocument, ns.rdfs('seeAlso'), newChatDocument, oldChatDocument)) {
+                        if (!_logic.store.holds(oldChatDocument, ns.rdfs('seeAlso'), newChatDocument, oldChatDocument)) {
                           sts = [$rdf.st(oldChatDocument, ns.rdfs('seeAlso'), newChatDocument, oldChatDocument)];
-                          updater.update([], sts, function (ok, body) {
-                            if (!ok) {
-                              alert('Unable to link old message block to new one.' + body);
-                            }
-                          });
+
+                          try {
+                            _logic.store.updater.update([], sts);
+                          } catch (err) {
+                            alert('Unable to link old chat file to new one:' + err);
+                          }
                         }
 
                       case 7:
                       case "end":
-                        return _context13.stop();
+                        return _context7.stop();
                     }
                   }
-                }, _callee13);
+                }, _callee7);
               }));
-              return _addNewTableIfNewDay.apply(this, arguments);
+              return _addNewChatDocumentIfNewDay.apply(this, arguments);
             };
 
-            addNewTableIfNewDay = function _addNewTableIfNewDay2(_x17) {
-              return _addNewTableIfNewDay.apply(this, arguments);
+            addNewChatDocumentIfNewDay = function _addNewChatDocumentIf() {
+              return _addNewChatDocumentIfNewDay.apply(this, arguments);
             };
 
             renderMessageTable = function _renderMessageTable(date, live) {
-              var scrollBackButton;
+              var scrollBackbutton;
               var scrollForwardButton; /// /////////////////   Scroll down adding more above
 
               function extendBackwards() {
@@ -128536,23 +128868,23 @@ function _infiniteMessageArea() {
               }
 
               function _extendBackwards() {
-                _extendBackwards = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee7() {
+                _extendBackwards = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
                   var done;
-                  return _regenerator["default"].wrap(function _callee7$(_context7) {
+                  return _regenerator["default"].wrap(function _callee$(_context) {
                     while (1) {
-                      switch (_context7.prev = _context7.next) {
+                      switch (_context.prev = _context.next) {
                         case 0:
-                          _context7.next = 2;
+                          _context.next = 2;
                           return insertPreviousMessages(true);
 
                         case 2:
-                          done = _context7.sent;
+                          done = _context.sent;
 
                           if (done) {
-                            if (scrollBackButton) {
-                              scrollBackButton.firstChild.setAttribute('src', UI.icons.iconBase + 'noun_T-Block_1114655_000000.svg'); // T
+                            if (scrollBackbutton) {
+                              scrollBackbutton.firstChild.setAttribute('src', _iconBase.icons.iconBase + 'noun_T-Block_1114655_000000.svg'); // T
 
-                              scrollBackButton.disabled = true;
+                              scrollBackbutton.disabled = true;
                             }
 
                             messageTable.initial = true;
@@ -128560,67 +128892,67 @@ function _infiniteMessageArea() {
                             messageTable.extendedBack = true;
                           }
 
-                          setScrollBackButtonIcon();
-                          return _context7.abrupt("return", done);
+                          setScrollBackbuttonIcon();
+                          return _context.abrupt("return", done);
 
                         case 6:
                         case "end":
-                          return _context7.stop();
+                          return _context.stop();
                       }
                     }
-                  }, _callee7);
+                  }, _callee);
                 }));
                 return _extendBackwards.apply(this, arguments);
               }
 
-              function setScrollBackButtonIcon() {
-                if (!scrollBackButton) {
+              function setScrollBackbuttonIcon() {
+                if (!scrollBackbutton) {
                   return;
                 }
 
                 var sense = messageTable.extendedBack ? !newestFirst : newestFirst;
                 var scrollBackIcon = messageTable.initial ? 'noun_T-Block_1114655_000000.svg' : getScrollbackIcon(sense);
-                scrollBackButton.firstChild.setAttribute('src', UI.icons.iconBase + scrollBackIcon);
+                scrollBackbutton.firstChild.setAttribute('src', _iconBase.icons.iconBase + scrollBackIcon);
 
                 function getScrollbackIcon(sense) {
                   return sense ? 'noun_1369241.svg' : 'noun_1369237.svg';
                 }
               }
 
-              function scrollBackButtonHandler(_x15) {
-                return _scrollBackButtonHandler.apply(this, arguments);
+              function scrollBackbuttonHandler(_x8) {
+                return _scrollBackbuttonHandler.apply(this, arguments);
               } /// ////////////// Scroll up adding more below
 
 
-              function _scrollBackButtonHandler() {
-                _scrollBackButtonHandler = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee8(_event) {
-                  return _regenerator["default"].wrap(function _callee8$(_context8) {
+              function _scrollBackbuttonHandler() {
+                _scrollBackbuttonHandler = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(_event) {
+                  return _regenerator["default"].wrap(function _callee2$(_context2) {
                     while (1) {
-                      switch (_context8.prev = _context8.next) {
+                      switch (_context2.prev = _context2.next) {
                         case 0:
                           if (!messageTable.extendedBack) {
-                            _context8.next = 6;
+                            _context2.next = 6;
                             break;
                           }
 
                           removePreviousMessages(true, messageTable);
                           messageTable.extendedBack = false;
-                          setScrollBackButtonIcon();
-                          _context8.next = 8;
+                          setScrollBackbuttonIcon();
+                          _context2.next = 8;
                           break;
 
                         case 6:
-                          _context8.next = 8;
+                          _context2.next = 8;
                           return extendBackwards();
 
                         case 8:
                         case "end":
-                          return _context8.stop();
+                          return _context2.stop();
                       }
                     }
-                  }, _callee8);
+                  }, _callee2);
                 }));
-                return _scrollBackButtonHandler.apply(this, arguments);
+                return _scrollBackbuttonHandler.apply(this, arguments);
               }
 
               function extendForwards() {
@@ -128628,20 +128960,20 @@ function _infiniteMessageArea() {
               }
 
               function _extendForwards() {
-                _extendForwards = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee9() {
+                _extendForwards = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3() {
                   var done;
-                  return _regenerator["default"].wrap(function _callee9$(_context9) {
+                  return _regenerator["default"].wrap(function _callee3$(_context3) {
                     while (1) {
-                      switch (_context9.prev = _context9.next) {
+                      switch (_context3.prev = _context3.next) {
                         case 0:
-                          _context9.next = 2;
+                          _context3.next = 2;
                           return insertPreviousMessages(false);
 
                         case 2:
-                          done = _context9.sent;
+                          done = _context3.sent;
 
                           if (done) {
-                            scrollForwardButton.firstChild.setAttribute('src', UI.icons.iconBase + 'noun_T-Block_1114655_000000.svg');
+                            scrollForwardButton.firstChild.setAttribute('src', _iconBase.icons.iconBase + 'noun_T-Block_1114655_000000.svg');
                             scrollForwardButton.disabled = true;
                             messageTable["final"] = true;
                           } else {
@@ -128649,14 +128981,14 @@ function _infiniteMessageArea() {
                           }
 
                           setScrollForwardButtonIcon();
-                          return _context9.abrupt("return", done);
+                          return _context3.abrupt("return", done);
 
                         case 6:
                         case "end":
-                          return _context9.stop();
+                          return _context3.stop();
                       }
                     }
-                  }, _callee9);
+                  }, _callee3);
                 }));
                 return _extendForwards.apply(this, arguments);
               }
@@ -128665,37 +128997,48 @@ function _infiniteMessageArea() {
                 var sense = messageTable.extendedForwards ? !newestFirst : newestFirst; // noun_T-Block_1114657_000000.svg
 
                 var scrollForwardIcon = messageTable["final"] ? 'noun_T-Block_1114657_000000.svg' : getScrollForwardButtonIcon(sense);
-                scrollForwardButton.firstChild.setAttribute('src', UI.icons.iconBase + scrollForwardIcon);
+                scrollForwardButton.firstChild.setAttribute('src', _iconBase.icons.iconBase + scrollForwardIcon);
 
                 function getScrollForwardButtonIcon(sense) {
                   return !sense ? 'noun_1369241.svg' : 'noun_1369237.svg';
                 }
               }
 
-              function scrollForwardButtonHandler(_x16) {
+              function scrollForwardButtonHandler(_x9) {
                 return _scrollForwardButtonHandler.apply(this, arguments);
               } /// ///////////////////////
 
+              /*
+              options = options || {}
+              options.authorDateOnLeft = true
+              const newestFirst = options.newestFirst === '1' || options.newestFirst === true // hack for now
+              const channelObject = new ChatChannel(chatChannel, options)
+              const dateFolder = channelObject.dateFolder
+               const div = dom.createElement('div')
+              const statusArea = div.appendChild(dom.createElement('div'))
+              const userContext = { dom, statusArea, div: statusArea } // logged on state, pointers to user's stuff
+              */
+
 
               function _scrollForwardButtonHandler() {
-                _scrollForwardButtonHandler = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee10(_event) {
-                  return _regenerator["default"].wrap(function _callee10$(_context10) {
+                _scrollForwardButtonHandler = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee4(_event) {
+                  return _regenerator["default"].wrap(function _callee4$(_context4) {
                     while (1) {
-                      switch (_context10.prev = _context10.next) {
+                      switch (_context4.prev = _context4.next) {
                         case 0:
                           if (!messageTable.extendedForwards) {
-                            _context10.next = 6;
+                            _context4.next = 6;
                             break;
                           }
 
                           removePreviousMessages(false, messageTable);
                           messageTable.extendedForwards = false;
                           setScrollForwardButtonIcon();
-                          _context10.next = 9;
+                          _context4.next = 9;
                           break;
 
                         case 6:
-                          _context10.next = 8;
+                          _context4.next = 8;
                           return extendForwards();
 
                         case 8:
@@ -128704,10 +129047,10 @@ function _infiniteMessageArea() {
 
                         case 9:
                         case "end":
-                          return _context10.stop();
+                          return _context4.stop();
                       }
                     }
-                  }, _callee10);
+                  }, _callee4);
                 }));
                 return _scrollForwardButtonHandler.apply(this, arguments);
               }
@@ -128727,7 +129070,7 @@ function _infiniteMessageArea() {
                 messageTable["final"] = true;
                 liveMessageTable = messageTable;
                 latest.messageTable = messageTable;
-                var tr = newMessageForm(messageTable);
+                var tr = (0, _message.renderMessageEditor)(channelObject, messageTable, userContext, options);
 
                 if (newestFirst) {
                   messageTable.insertBefore(tr, messageTable.firstChild); // If newestFirst
@@ -128742,27 +129085,27 @@ function _infiniteMessageArea() {
 
 
               if (options.infinite) {
-                var scrollBackButtonTR = dom.createElement('tr');
-                var scrollBackButtonCell = scrollBackButtonTR.appendChild(dom.createElement('td')); // up traingles: noun_1369237.svg
+                var scrollBackbuttonTR = dom.createElement('tr');
+                var scrollBackbuttonCell = scrollBackbuttonTR.appendChild(dom.createElement('td')); // up traingles: noun_1369237.svg
                 // down triangles: noun_1369241.svg
 
                 var scrollBackIcon = newestFirst ? 'noun_1369241.svg' : 'noun_1369237.svg'; // down and up arrows respoctively
 
-                scrollBackButton = UI.widgets.button(dom, UI.icons.iconBase + scrollBackIcon, 'Previous messages ...');
-                scrollBackButtonCell.style = 'width:3em; height:3em;';
-                scrollBackButton.addEventListener('click', scrollBackButtonHandler, false);
+                scrollBackbutton = widgets.button(dom, _iconBase.icons.iconBase + scrollBackIcon, 'Previous messages ...');
+                scrollBackbuttonCell.style = 'width:3em; height:3em;';
+                scrollBackbutton.addEventListener('click', scrollBackbuttonHandler, false);
                 messageTable.extendedBack = false;
-                scrollBackButtonCell.appendChild(scrollBackButton);
-                setScrollBackButtonIcon();
-                var dateCell = scrollBackButtonTR.appendChild(dom.createElement('td'));
+                scrollBackbuttonCell.appendChild(scrollBackbutton);
+                setScrollBackbuttonIcon();
+                var dateCell = scrollBackbuttonTR.appendChild(dom.createElement('td'));
                 dateCell.style = 'text-align: center; vertical-align: middle; color: #888; font-style: italic;';
-                dateCell.textContent = UI.widgets.shortDate(date.toISOString(), true); // no time, only date
+                dateCell.textContent = widgets.shortDate(date.toISOString(), true); // no time, only date
                 // @@@@@@@@@@@ todo move this button to other end of  message cell, o
 
-                var scrollForwardButtonCell = scrollBackButtonTR.appendChild(dom.createElement('td'));
+                var scrollForwardButtonCell = scrollBackbuttonTR.appendChild(dom.createElement('td'));
                 var scrollForwardIcon = newestFirst ? 'noun_1369241.svg' : 'noun_1369237.svg'; // down and up arrows respoctively
 
-                scrollForwardButton = UI.widgets.button(dom, UI.icons.iconBase + scrollForwardIcon, 'Later messages ...');
+                scrollForwardButton = widgets.button(dom, _iconBase.icons.iconBase + scrollForwardIcon, 'Later messages ...');
                 scrollForwardButtonCell.appendChild(scrollForwardButton);
                 scrollForwardButtonCell.style = 'width:3em; height:3em;';
                 scrollForwardButton.addEventListener('click', scrollForwardButtonHandler, false);
@@ -128772,13 +129115,13 @@ function _infiniteMessageArea() {
 
                 if (!newestFirst) {
                   // opposite end from the entry field
-                  messageTable.insertBefore(scrollBackButtonTR, messageTable.firstChild); // If not newestFirst
+                  messageTable.insertBefore(scrollBackbuttonTR, messageTable.firstChild); // If not newestFirst
                 } else {
-                  messageTable.appendChild(scrollBackButtonTR); //  newestFirst
+                  messageTable.appendChild(scrollBackbuttonTR); //  newestFirst
                 }
               }
 
-              var sts = kb.statementsMatching(null, WF('message'), null, chatDocument);
+              var sts = _logic.store.statementsMatching(null, ns.wf('message'), null, chatDocument);
 
               if (!live && sts.length === 0) {// not todays
                 // no need buttomns at the moment
@@ -128795,57 +129138,57 @@ function _infiniteMessageArea() {
             };
 
             _createMessageTable = function _createMessageTable3() {
-              _createMessageTable = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee12(date, live) {
+              _createMessageTable = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee6(date, live) {
                 var chatDocument, messageTable, statusTR;
-                return _regenerator["default"].wrap(function _callee12$(_context12) {
+                return _regenerator["default"].wrap(function _callee6$(_context6) {
                   while (1) {
-                    switch (_context12.prev = _context12.next) {
+                    switch (_context6.prev = _context6.next) {
                       case 0:
                         debug.log('   createMessageTable for  ' + date);
                         chatDocument = dateFolder.leafDocumentFromDate(date);
-                        _context12.prev = 2;
-                        _context12.next = 5;
-                        return kb.fetcher.load(chatDocument);
+                        _context6.prev = 2;
+                        _context6.next = 5;
+                        return _logic.store.fetcher.load(chatDocument);
 
                       case 5:
-                        _context12.next = 19;
+                        _context6.next = 19;
                         break;
 
                       case 7:
-                        _context12.prev = 7;
-                        _context12.t0 = _context12["catch"](2);
+                        _context6.prev = 7;
+                        _context6.t0 = _context6["catch"](2);
                         messageTable = dom.createElement('table');
                         statusTR = messageTable.appendChild(dom.createElement('tr')); // ### find status in exception
 
-                        if (!(_context12.t0.response && _context12.t0.response.status && _context12.t0.response.status === 404)) {
-                          _context12.next = 16;
+                        if (!(_context6.t0.response && _context6.t0.response.status && _context6.t0.response.status === 404)) {
+                          _context6.next = 16;
                           break;
                         }
 
                         debug.log('Error 404 for chat file ' + chatDocument);
-                        return _context12.abrupt("return", renderMessageTable(date, live));
+                        return _context6.abrupt("return", renderMessageTable(date, live));
 
                       case 16:
                         debug.log('*** Error NON 404 for chat file ' + chatDocument);
-                        statusTR.appendChild(UI.widgets.errorMessageBlock(dom, _context12.t0, 'pink'));
+                        statusTR.appendChild(widgets.errorMessageBlock(dom, _context6.t0, 'pink'));
 
                       case 18:
-                        return _context12.abrupt("return", statusTR);
+                        return _context6.abrupt("return", statusTR);
 
                       case 19:
-                        return _context12.abrupt("return", renderMessageTable(date, live));
+                        return _context6.abrupt("return", renderMessageTable(date, live));
 
                       case 20:
                       case "end":
-                        return _context12.stop();
+                        return _context6.stop();
                     }
                   }
-                }, _callee12, null, [[2, 7]]);
+                }, _callee6, null, [[2, 7]]);
               }));
               return _createMessageTable.apply(this, arguments);
             };
 
-            createMessageTable = function _createMessageTable2(_x13, _x14) {
+            createMessageTable = function _createMessageTable2(_x6, _x7) {
               return _createMessageTable.apply(this, arguments);
             };
 
@@ -128867,38 +129210,38 @@ function _infiniteMessageArea() {
             };
 
             _insertPreviousMessages = function _insertPreviousMessag2() {
-              _insertPreviousMessages = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee11(backwards) {
+              _insertPreviousMessages = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee5(backwards) {
                 var extremity, date, live, todayDoc, doc, newMessageTable;
-                return _regenerator["default"].wrap(function _callee11$(_context11) {
+                return _regenerator["default"].wrap(function _callee5$(_context5) {
                   while (1) {
-                    switch (_context11.prev = _context11.next) {
+                    switch (_context5.prev = _context5.next) {
                       case 0:
                         extremity = backwards ? earliest : latest;
                         date = extremity.messageTable.date; // day in mssecs
 
-                        _context11.next = 4;
+                        _context5.next = 4;
                         return dateFolder.loadPrevious(date, backwards);
 
                       case 4:
-                        date = _context11.sent;
+                        date = _context5.sent;
                         // backwards
                         debug.log("insertPreviousMessages: from ".concat(backwards ? 'backwards' : 'forwards', " loadPrevious: ").concat(date));
 
                         if (!(!date && !backwards && !liveMessageTable)) {
-                          _context11.next = 9;
+                          _context5.next = 9;
                           break;
                         }
 
-                        _context11.next = 9;
+                        _context5.next = 9;
                         return appendCurrentMessages();
 
                       case 9:
                         if (date) {
-                          _context11.next = 11;
+                          _context5.next = 11;
                           break;
                         }
 
-                        return _context11.abrupt("return", true);
+                        return _context5.abrupt("return", true);
 
                       case 11:
                         // done
@@ -128910,11 +129253,11 @@ function _infiniteMessageArea() {
                           live = doc.sameTerm(todayDoc); // Is this todays?
                         }
 
-                        _context11.next = 15;
+                        _context5.next = 15;
                         return createMessageTable(date, live);
 
                       case 15:
-                        newMessageTable = _context11.sent;
+                        newMessageTable = _context5.sent;
                         extremity.messageTable = newMessageTable; // move pointer to earliest
 
                         if (backwards ? newestFirst : !newestFirst) {
@@ -128925,30 +129268,30 @@ function _infiniteMessageArea() {
                           div.insertBefore(newMessageTable, div.firstChild);
                         }
 
-                        return _context11.abrupt("return", live);
+                        return _context5.abrupt("return", live);
 
                       case 19:
                       case "end":
-                        return _context11.stop();
+                        return _context5.stop();
                     }
                   }
-                }, _callee11);
+                }, _callee5);
               }));
               return _insertPreviousMessages.apply(this, arguments);
             };
 
-            insertPreviousMessages = function _insertPreviousMessag(_x12) {
+            insertPreviousMessages = function _insertPreviousMessag(_x5) {
               return _insertPreviousMessages.apply(this, arguments);
             };
 
             addMessage = function _addMessage(message, messageTable) {
-              var bindings = {
-                '?msg': message,
-                '?creator': kb.any(message, ns.foaf('maker')),
-                '?date': kb.any(message, DCT('created')),
-                '?content': kb.any(message, ns.sioc('content'))
-              };
-              (0, _message.renderMessage)(messageTable, bindings, messageTable.fresh, options, userContext); // fresh from elsewhere
+              var latest = (0, _chatLogic.mostRecentVersion)(message); // const content = store.any(latest, ns.sioc('content'))
+
+              if ((0, _chatLogic.isDeleted)(latest) && !options.showDeletedMessages) {
+                return; // ignore deleted messaged -- @@ could also leave a placeholder
+              }
+
+              insertMessageIntoTable(channelObject, messageTable, message, messageTable.fresh, options, userContext); // fresh from elsewhere
             };
 
             syncMessages = function _syncMessages(about, messageTable) {
@@ -128961,9 +129304,10 @@ function _infiniteMessageArea() {
                 }
               }
 
-              var messages = kb.statementsMatching(about, ns.wf('message'), null, messageTable.chatDocument).map(function (st) {
+              var messages = _logic.store.statementsMatching(about, ns.wf('message'), null, messageTable.chatDocument).map(function (st) {
                 return st.object;
               });
+
               var stored = {};
               messages.forEach(function (m) {
                 stored[m.uri] = true;
@@ -128986,368 +129330,28 @@ function _infiniteMessageArea() {
               for (ele = messageTable.firstChild; ele; ele = ele.nextSibling) {
                 if (ele.AJAR_subject) {
                   // Refresh thumbs up etc
-                  UI.widgets.refreshTree(ele); // Things inside may have changed too
+                  widgets.refreshTree(ele); // Things inside may have changed too
                 }
               }
             };
 
-            newMessageForm = function _newMessageForm(messageTable) {
-              var form = dom.createElement('tr');
-              var lhs = dom.createElement('td');
-              var middle = dom.createElement('td');
-              var rhs = dom.createElement('td');
-              form.appendChild(lhs);
-              form.appendChild(middle);
-              form.appendChild(rhs);
-              form.AJAR_date = '9999-01-01T00:00:00Z'; // ISO format for field sort
-
-              var field, sendButton;
-
-              function sendMessage(_x6) {
-                return _sendMessage.apply(this, arguments);
-              } // sendMessage
-
-
-              function _sendMessage() {
-                _sendMessage = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee6(text) {
-                  var now, sts, timestamp, dateStamp, chatDocument, message, content, sendComplete;
-                  return _regenerator["default"].wrap(function _callee6$(_context6) {
-                    while (1) {
-                      switch (_context6.prev = _context6.next) {
-                        case 0:
-                          sendComplete = function _sendComplete() {
-                            var bindings = {
-                              '?msg': message,
-                              '?content': content,
-                              '?date': dateStamp,
-                              '?creator': me
-                            };
-                            (0, _message.renderMessage)(liveMessageTable, bindings, false, options, userContext); // not green
-
-                            if (!text) {
-                              field.value = ''; // clear from out for reuse
-
-                              field.setAttribute('style', messageBodyStyle);
-                              field.disabled = false;
-                              field.scrollIntoView(newestFirst); // allign bottom (top)
-
-                              field.focus(); // Start typing next line immediately
-
-                              field.select();
-                            }
-                          };
-
-                          now = new Date();
-                          _context6.next = 4;
-                          return addNewTableIfNewDay(now);
-
-                        case 4:
-                          if (!text) {
-                            field.setAttribute('style', messageBodyStyle + 'color: #bbb;'); // pendingedit
-
-                            field.disabled = true;
-                          }
-
-                          sts = [];
-                          timestamp = '' + now.getTime();
-                          dateStamp = $rdf.term(now);
-                          chatDocument = dateFolder.leafDocumentFromDate(now);
-                          message = kb.sym(chatDocument.uri + '#' + 'Msg' + timestamp);
-                          content = kb.literal(text || field.value); // if (text) field.value = text  No - don't destroy half-finsihed user input
-
-                          sts.push(new $rdf.Statement(chatChannel, ns.wf('message'), message, chatDocument));
-                          sts.push(new $rdf.Statement(message, ns.sioc('content'), content, chatDocument));
-                          sts.push(new $rdf.Statement(message, DCT('created'), dateStamp, chatDocument));
-
-                          if (me) {
-                            sts.push(new $rdf.Statement(message, ns.foaf('maker'), me, chatDocument));
-                          }
-
-                          if (!(SERVER_MKDIRP_BUG && (kb.fetcher.requested[chatDocument.uri] === undefined || kb.fetcher.requested[chatDocument.uri] === 404))) {
-                            _context6.next = 19;
-                            break;
-                          }
-
-                          debug.log('@@@ SERVER_MKDIRP_BUG: Should only happen once: create chat file: ' + chatDocument);
-                          _context6.next = 19;
-                          return createIfNotExists(chatDocument);
-
-                        case 19:
-                          _context6.prev = 19;
-                          _context6.next = 22;
-                          return updater.update([], sts);
-
-                        case 22:
-                          _context6.next = 28;
-                          break;
-
-                        case 24:
-                          _context6.prev = 24;
-                          _context6.t0 = _context6["catch"](19);
-                          form.appendChild(UI.widgets.errorMessageBlock(dom, 'Error writing message: ' + _context6.t0));
-                          return _context6.abrupt("return");
-
-                        case 28:
-                          sendComplete();
-
-                        case 29:
-                        case "end":
-                          return _context6.stop();
-                      }
-                    }
-                  }, _callee6, null, [[19, 24]]);
-                }));
-                return _sendMessage.apply(this, arguments);
-              }
-
-              form.appendChild(dom.createElement('br')); //    DRAG AND DROP
-
-              function droppedFileHandler(files) {
-                var base = messageTable.chatDocument.dir().uri;
-                UI.widgets.uploadFiles(kb.fetcher, files, base + 'Files', base + 'Pictures', /*#__PURE__*/function () {
-                  var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(theFile, destURI) {
-                    return _regenerator["default"].wrap(function _callee2$(_context2) {
-                      while (1) {
-                        switch (_context2.prev = _context2.next) {
-                          case 0:
-                            _context2.next = 2;
-                            return sendMessage(destURI);
-
-                          case 2:
-                          case "end":
-                            return _context2.stop();
-                        }
-                      }
-                    }, _callee2);
-                  }));
-
-                  return function (_x7, _x8) {
-                    return _ref.apply(this, arguments);
-                  };
-                }());
-              } // When a set of URIs are dropped on the field
-
-
-              var droppedURIHandler = /*#__PURE__*/function () {
-                var _ref2 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3(uris) {
-                  var _iterator, _step, uri;
-
-                  return _regenerator["default"].wrap(function _callee3$(_context3) {
-                    while (1) {
-                      switch (_context3.prev = _context3.next) {
-                        case 0:
-                          _iterator = _createForOfIteratorHelper(uris);
-                          _context3.prev = 1;
-
-                          _iterator.s();
-
-                        case 3:
-                          if ((_step = _iterator.n()).done) {
-                            _context3.next = 9;
-                            break;
-                          }
-
-                          uri = _step.value;
-                          _context3.next = 7;
-                          return sendMessage(uri);
-
-                        case 7:
-                          _context3.next = 3;
-                          break;
-
-                        case 9:
-                          _context3.next = 14;
-                          break;
-
-                        case 11:
-                          _context3.prev = 11;
-                          _context3.t0 = _context3["catch"](1);
-
-                          _iterator.e(_context3.t0);
-
-                        case 14:
-                          _context3.prev = 14;
-
-                          _iterator.f();
-
-                          return _context3.finish(14);
-
-                        case 17:
-                        case "end":
-                          return _context3.stop();
-                      }
-                    }
-                  }, _callee3, null, [[1, 11, 14, 17]]);
-                }));
-
-                return function droppedURIHandler(_x9) {
-                  return _ref2.apply(this, arguments);
-                };
-              }(); // When we are actually logged on
-
-
-              function turnOnInput() {
-                if (options.menuHandler && menuButton) {
-                  var menuOptions = {
-                    me: me,
-                    dom: dom,
-                    div: div,
-                    newBase: messageTable.chatDocument.dir().uri
-                  };
-                  menuButton.addEventListener('click', function (event) {
-                    options.menuHandler(event, chatChannel, menuOptions);
-                  }, false);
-                } // Turn on message input
-
-
-                (0, _message.creatorAndDate)(lhs, me, '', null);
-                field = dom.createElement('textarea');
-                middle.innerHTML = '';
-                middle.appendChild(field);
-                field.rows = 3; // field.cols = 40
-
-                field.setAttribute('style', messageBodyStyle + 'background-color: #eef;'); // Trap the Enter BEFORE it is used ti make a newline
-
-                field.addEventListener('keydown', /*#__PURE__*/function () {
-                  var _ref3 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee4(e) {
-                    return _regenerator["default"].wrap(function _callee4$(_context4) {
-                      while (1) {
-                        switch (_context4.prev = _context4.next) {
-                          case 0:
-                            if (!(e.keyCode === 13)) {
-                              _context4.next = 4;
-                              break;
-                            }
-
-                            if (e.altKey) {
-                              _context4.next = 4;
-                              break;
-                            }
-
-                            _context4.next = 4;
-                            return sendMessage();
-
-                          case 4:
-                          case "end":
-                            return _context4.stop();
-                        }
-                      }
-                    }, _callee4);
-                  }));
-
-                  return function (_x10) {
-                    return _ref3.apply(this, arguments);
-                  };
-                }(), false);
-                UI.widgets.makeDropTarget(field, droppedURIHandler, droppedFileHandler);
-                rhs.innerHTML = '';
-                sendButton = UI.widgets.button(dom, UI.icons.iconBase + 'noun_383448.svg', 'Send');
-                sendButton.setAttribute('style', UI.style.buttonStyle + 'float: right;');
-                sendButton.addEventListener('click', function (_event) {
-                  return sendMessage();
-                }, false);
-                rhs.appendChild(sendButton);
-                var chatDocument = dateFolder.leafDocumentFromDate(new Date());
-                var imageDoc;
-
-                function getImageDoc() {
-                  imageDoc = kb.sym(chatDocument.dir().uri + 'Image_' + Date.now() + '.png');
-                  return imageDoc;
-                }
-
-                function tookPicture(_x11) {
-                  return _tookPicture.apply(this, arguments);
-                }
-
-                function _tookPicture() {
-                  _tookPicture = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee5(imageDoc) {
-                    return _regenerator["default"].wrap(function _callee5$(_context5) {
-                      while (1) {
-                        switch (_context5.prev = _context5.next) {
-                          case 0:
-                            if (!imageDoc) {
-                              _context5.next = 3;
-                              break;
-                            }
-
-                            _context5.next = 3;
-                            return sendMessage(imageDoc.uri);
-
-                          case 3:
-                          case "end":
-                            return _context5.stop();
-                        }
-                      }
-                    }, _callee5);
-                  }));
-                  return _tookPicture.apply(this, arguments);
-                }
-
-                middle.appendChild(UI.media.cameraButton(dom, kb, getImageDoc, tookPicture));
-                UI.pad.recordParticipation(chatChannel, chatChannel.doc()); // participation =
-              } // turn on inpuut
-
-
-              var context = {
-                div: middle,
-                dom: dom
-              };
-              UI.authn.logIn(context).then(function (context) {
-                me = context.me;
-                turnOnInput();
-                Object.assign(context, userContext);
-                (0, _bookmarks.findBookmarkDocument)(context).then(function (context) {
-                  debug.log('Bookmark file: ' + context.bookmarkDocument);
-                });
-              });
-              return form;
-            };
-
-            kb = kb || UI.store;
-            ns = UI.ns;
-            WF = $rdf.Namespace('http://www.w3.org/2005/01/wf/flow#');
-            DCT = $rdf.Namespace('http://purl.org/dc/terms/'); // const POSIX = $rdf.Namespace('http://www.w3.org/ns/posix/stat#')
-
+            // Body of main function
             options = options || {};
-            newestFirst = options.newestFirst === '1' || options.newestFirst === true; // hack for now
+            options.authorDateOnLeft = false; // @@ make a user optiosn
 
-            dateFolder = new _dateFolder.DateFolder(chatChannel, 'chat.ttl');
-            options.authorAboveContent = true; // var participation // An object tracking users use and prefs
-
-            messageBodyStyle = UI.style.messageBodyStyle; // var messageBodyStyle = 'white-space: pre-wrap; width: 90%; font-size:100%; border: 0.07em solid #eee; padding: .2em 0.5em; margin: 0.1em 1em 0.1em 1em;'
-            // 'font-size: 100%; margin: 0.1em 1em 0.1em 1em;  background-color: white; white-space: pre-wrap; padding: 0.1em;'
+            newestFirst = options.newestFirst === '1' || options.newestFirst === true; // hack for now
 
+            channelObject = new _chatLogic.ChatChannel(chatChannel, options);
+            dateFolder = channelObject.dateFolder;
             div = dom.createElement('div');
+            channelObject.div = div;
             statusArea = div.appendChild(dom.createElement('div'));
             userContext = {
               dom: dom,
               statusArea: statusArea,
               div: statusArea
             }; // logged on state, pointers to user's stuff
-
-            updater = UI.store.updater;
-            /** Does a file exist on the web?
-             * @returns {Boolean}
-             */
-
-            /*
-            async function documentExists (doc) {
-              try {
-                await kb.fetcher.load(doc)
-              } catch (err) {
-                if (err.response.status === 404) {
-                  return false
-                } else {
-                  debug.log('documentExists: doc load error NOT 404:  ' + doc + ': ' + err)
-                  throw err
-                }
-              }
-              return true
-            }
-            */
-
-            /*       Form for a new message
-             */
+            // const messageTable = dom.createElement('table') // @@ check does this go in renderMessageTable
 
             earliest = {
               messageTable: null
@@ -129357,18 +129361,18 @@ function _infiniteMessageArea() {
               messageTable: null
             };
             lock = false;
-            _context17.next = 35;
+            _context12.next = 30;
             return loadInitialContent();
 
-          case 35:
-            return _context17.abrupt("return", div);
+          case 30:
+            return _context12.abrupt("return", div);
 
-          case 36:
+          case 31:
           case "end":
-            return _context17.stop();
+            return _context12.stop();
         }
       }
-    }, _callee17);
+    }, _callee12);
   }));
   return _infiniteMessageArea.apply(this, arguments);
 }
@@ -129386,6 +129390,8 @@ function _infiniteMessageArea() {
 "use strict";
 
 
+var _interopRequireDefault = __webpack_require__(/*! @babel/runtime/helpers/interopRequireDefault */ "./node_modules/solid-ui/node_modules/@babel/runtime/helpers/interopRequireDefault.js");
+
 var _typeof = __webpack_require__(/*! @babel/runtime/helpers/typeof */ "./node_modules/solid-ui/node_modules/@babel/runtime/helpers/typeof.js");
 
 Object.defineProperty(exports, "__esModule", {
@@ -129394,10 +129400,24 @@ Object.defineProperty(exports, "__esModule", {
 exports.creatorAndDate = creatorAndDate;
 exports.creatorAndDateHorizontal = creatorAndDateHorizontal;
 exports.elementForImageURI = elementForImageURI;
-exports.renderMessage = renderMessage;
+exports.renderMessageEditor = renderMessageEditor;
+exports.renderMessageRow = renderMessageRow;
+exports.switchToEditor = switchToEditor;
+
+var _regenerator = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/regenerator */ "./node_modules/solid-ui/node_modules/@babel/runtime/regenerator/index.js"));
+
+var _asyncToGenerator2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/asyncToGenerator */ "./node_modules/solid-ui/node_modules/@babel/runtime/helpers/asyncToGenerator.js"));
+
+var _infinite = __webpack_require__(/*! ./infinite */ "./node_modules/solid-ui/lib/chat/infinite.js");
 
 var _messageTools = __webpack_require__(/*! ./messageTools */ "./node_modules/solid-ui/lib/chat/messageTools.js");
 
+var _bookmarks = __webpack_require__(/*! ./bookmarks */ "./node_modules/solid-ui/lib/chat/bookmarks.js");
+
+var _chatLogic = __webpack_require__(/*! ./chatLogic */ "./node_modules/solid-ui/lib/chat/chatLogic.js");
+
+var debug = _interopRequireWildcard(__webpack_require__(/*! ../debug */ "./node_modules/solid-ui/lib/debug.js"));
+
 var _index = __webpack_require__(/*! ../authn/index */ "./node_modules/solid-ui/lib/authn/index.js");
 
 var _iconBase = __webpack_require__(/*! ../iconBase */ "./node_modules/solid-ui/lib/iconBase.js");
@@ -129410,8 +129430,6 @@ var ns = _interopRequireWildcard(__webpack_require__(/*! ../ns */ "./node_module
 
 var pad = _interopRequireWildcard(__webpack_require__(/*! ../pad */ "./node_modules/solid-ui/lib/pad.js"));
 
-var rdf = _interopRequireWildcard(__webpack_require__(/*! rdflib */ "./node_modules/rdflib/esm/index.js"));
-
 var style = _interopRequireWildcard(__webpack_require__(/*! ../style */ "./node_modules/solid-ui/lib/style.js"));
 
 var utils = _interopRequireWildcard(__webpack_require__(/*! ../utils */ "./node_modules/solid-ui/lib/utils/index.js"));
@@ -129422,31 +129440,17 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-/**
- * Contains the [[renderMessage]] function,
- * along with [[elementForImageURI]],
- * [[creatorAndDate]], and [[creatorAndDateHorizontal]]
- * @packageDocumentation
- */
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
 
-/* global $rdf */
-// pull in first avoid cross-refs
-var UI = {
-  authn: _index.authn,
-  icons: _iconBase.icons,
-  ns: ns,
-  media: _index2.media,
-  pad: pad,
-  rdf: rdf,
-  store: _logic.store,
-  style: style,
-  utils: utils,
-  widgets: widgets
-};
-var dom = UI.dom || window.document; // const kb = UI.store
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
-var messageBodyStyle = UI.style.messageBodyStyle;
-var label = UI.utils.label;
+// const UI = { authn, icons, ns, media, pad, rdf, store, style, utils, widgets }
+var dom = window.document; // const store = store
+
+var messageBodyStyle = style.messageBodyStyle;
+var label = utils.label;
 /**
  * HTML component for an image
  */
@@ -129459,14 +129463,14 @@ function elementForImageURI(imageUri, options) {
     height = ('' + options.inlineImageHeightEms).trim();
   }
 
-  img.setAttribute('style', 'max-height: ' + height + 'em; border-radius: 1em; margin: 0.7em;'); // UI.widgets.makeDropTarget(img, handleURIsDroppedOnMugshot, droppedFileHandler)
+  img.setAttribute('style', 'max-height: ' + height + 'em; border-radius: 1em; margin: 0.7em;'); // widgets.makeDropTarget(img, handleURIsDroppedOnMugshot, droppedFileHandler)
 
   if (imageUri) img.setAttribute('src', imageUri);
   var anchor = dom.createElement('a');
   anchor.setAttribute('href', imageUri);
   anchor.setAttribute('target', 'images');
   anchor.appendChild(img);
-  UI.widgets.makeDraggable(img, $rdf.sym(imageUri));
+  widgets.makeDraggable(img, $rdf.sym(imageUri));
   return anchor;
 }
 
@@ -129476,7 +129480,7 @@ var anchor = function anchor(text, term) {
 
   if (term && term.uri) {
     a.setAttribute('href', term.uri);
-    a.addEventListener('click', UI.widgets.openHrefInOutlineMode, true);
+    a.addEventListener('click', widgets.openHrefInOutlineMode, true);
     a.setAttribute('style', 'color: #3B5998; text-decoration: none; '); // font-weight: bold
   }
 
@@ -129485,7 +129489,8 @@ var anchor = function anchor(text, term) {
 };
 
 function nick(person) {
-  var s = UI.store.any(person, UI.ns.foaf('nick'));
+  var s = _logic.store.any(person, ns.foaf('nick'));
+
   if (s) return '' + s.value;
   return '' + label(person);
 }
@@ -129499,7 +129504,7 @@ function creatorAndDate(td1, creator, date, message) {
   var nickAnchor = td1.appendChild(anchor(nick(creator), creator));
 
   if (creator.uri) {
-    UI.store.fetcher.nowOrWhenFetched(creator.doc(), undefined, function (_ok, _body) {
+    _logic.store.fetcher.nowOrWhenFetched(creator.doc(), undefined, function (_ok, _body) {
       nickAnchor.textContent = nick(creator);
     });
   }
@@ -129517,7 +129522,7 @@ function creatorAndDateHorizontal(td1, creator, date, message) {
   var nickAnchor = td1.appendChild(anchor(label(creator), creator));
 
   if (creator.uri) {
-    UI.store.fetcher.nowOrWhenFetched(creator.doc(), undefined, function (_ok, _body) {
+    _logic.store.fetcher.nowOrWhenFetched(creator.doc(), undefined, function (_ok, _body) {
       nickAnchor.textContent = nick(creator);
     });
   }
@@ -129528,65 +129533,54 @@ function creatorAndDateHorizontal(td1, creator, date, message) {
   td1.appendChild(dom.createElement('br'));
 }
 /**
- * Renders a chat message inside a `messageTable`
+ * Renders a chat message, read-only mode
  */
 
 
-function renderMessage(messageTable, bindings, fresh, options, userContext) {
+function renderMessageRow(channelObject, message, fresh, options, userContext) {
   var colorizeByAuthor = options.colorizeByAuthor === '1' || options.colorizeByAuthor === true;
-  var creator = bindings['?creator'];
-  var message = bindings['?msg'];
-  var date = bindings['?date'];
-  var content = bindings['?content'];
-  var dateString = date.value;
-  var messageRow = dom.createElement('tr');
-  messageRow.AJAR_date = dateString;
-  messageRow.AJAR_subject = message;
 
-  if (options.selectedMessage && options.selectedMessage.sameTerm(message)) {
-    messageRow.style.backgroundColor = 'yellow';
-    options.selectedElement = messageRow;
-    messageTable.selectedElement = messageRow;
-  }
+  var creator = _logic.store.any(message, ns.foaf('maker'));
 
-  var done = false;
+  var date = _logic.store.any(message, ns.dct('created'));
 
-  for (var ele = messageTable.firstChild;; ele = ele.nextSibling) {
-    if (!ele) {
-      // empty
-      break;
-    }
+  var latestVersion = (0, _chatLogic.mostRecentVersion)(message);
 
-    var newestFirst = options.newestfirst === true;
+  var content = _logic.store.any(latestVersion, ns.sioc('content'));
 
-    if (dateString > ele.AJAR_date && newestFirst || dateString < ele.AJAR_date && !newestFirst) {
-      messageTable.insertBefore(messageRow, ele);
-      done = true;
-      break;
-    }
-  }
+  var originalMessage = (0, _chatLogic.originalVersion)(message);
+  var edited = !message.sameTerm(originalMessage);
+
+  var sortDate = _logic.store.the(originalMessage, ns.dct('created'), null, originalMessage.doc()); // In message
 
-  if (!done) {
-    messageTable.appendChild(messageRow);
-  }
 
+  var messageRow = dom.createElement('tr');
+  messageRow.AJAR_date = sortDate.value;
+  messageRow.AJAR_subject = message;
   var td1 = dom.createElement('td');
   messageRow.appendChild(td1);
 
-  if (options.authorAboveContent) {
+  if (!options.authorDateOnLeft) {
     var img = dom.createElement('img');
     img.setAttribute('style', 'max-height: 2.5em; max-width: 2.5em; border-radius: 0.5em; margin: auto;');
-    UI.widgets.setImage(img, creator);
+    widgets.setImage(img, creator);
     td1.appendChild(img);
   } else {
-    creatorAndDate(td1, creator, UI.widgets.shortDate(dateString), message);
+    creatorAndDate(td1, creator, widgets.shortDate(sortDate.value), message);
+  }
+
+  var bothDates = widgets.shortDate(sortDate.value);
+
+  if (edited) {
+    bothDates += ' ... ' + widgets.shortDate(date.value);
   } // Render the content ot the message itself
 
 
   var td2 = messageRow.appendChild(dom.createElement('td'));
 
-  if (options.authorAboveContent) {
-    creatorAndDateHorizontal(td2, creator, UI.widgets.shortDate(dateString), message);
+  if (!options.authorDateOnLeft) {
+    creatorAndDateHorizontal(td2, creator, bothDates, // widgets.shortDate(dateString)
+    message);
   }
 
   var text = content.value.trim();
@@ -129616,7 +129610,7 @@ function renderMessage(messageTable, bindings, fresh, options, userContext) {
   }
 
   if (para) {
-    var bgcolor = colorizeByAuthor ? UI.pad.lightColorHash(creator) : getBgColor(fresh);
+    var bgcolor = colorizeByAuthor ? pad.lightColorHash(creator) : getBgColor(fresh);
     para.setAttribute('style', messageBodyStyle + 'background-color: ' + bgcolor + ';');
   }
 
@@ -129635,7 +129629,7 @@ function renderMessage(messageTable, bindings, fresh, options, userContext) {
 
   var td3 = dom.createElement('td');
   messageRow.appendChild(td3);
-  var toolsButton = UI.widgets.button(dom, UI.icons.iconBase + 'noun_243787.svg', '...');
+  var toolsButton = widgets.button(dom, _iconBase.icons.iconBase + 'noun_243787.svg', '...');
   td3.appendChild(toolsButton);
   toolsButton.addEventListener('click', function (_event) {
     if (messageRow.toolTR) {
@@ -129646,7 +129640,7 @@ function renderMessage(messageTable, bindings, fresh, options, userContext) {
     }
 
     var toolsTR = dom.createElement('tr');
-    var tools = (0, _messageTools.messageToolbar)(message, messageRow, userContext);
+    var tools = (0, _messageTools.messageToolbar)(message, messageRow, userContext, channelObject);
     tools.style = 'border: 0.05em solid #888; border-radius: 0 0 0.7em 0.7em;  border-top: 0; height:3.5em; background-color: #fff;'; // @@ fix
 
     if (messageRow.nextSibling) {
@@ -129665,6 +129659,390 @@ function renderMessage(messageTable, bindings, fresh, options, userContext) {
   });
   return messageRow;
 }
+
+function switchToEditor(messageRow, message, channelObject, userContext) {
+  var messageTable = messageRow.parentNode;
+  var editRow = renderMessageEditor(channelObject, messageTable, userContext, channelObject.options, (0, _chatLogic.mostRecentVersion)(message));
+  messageTable.insertBefore(editRow, messageRow);
+  editRow.originalRow = messageRow;
+  messageRow.style.visibility = 'hidden'; // Hide the original message. unhide if user cancels edit
+}
+/*       Control for a new message -- or editing an old message ***************
+ *
+ */
+
+
+function renderMessageEditor(channelObject, messageTable, userContext, options, originalMessage) {
+  function revertEditing(messageEditor) {
+    messageEditor.originalRow.style.visibility = 'visible'; // restore read-only version
+
+    messageEditor.parentNode.removeChild(messageEditor);
+  }
+
+  function handleFieldInput(_x) {
+    return _handleFieldInput.apply(this, arguments);
+  }
+
+  function _handleFieldInput() {
+    _handleFieldInput = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee5(_event) {
+      return _regenerator["default"].wrap(function _callee5$(_context6) {
+        while (1) {
+          switch (_context6.prev = _context6.next) {
+            case 0:
+              _context6.next = 2;
+              return sendMessage(field.value, true);
+
+            case 2:
+            case "end":
+              return _context6.stop();
+          }
+        }
+      }, _callee5);
+    }));
+    return _handleFieldInput.apply(this, arguments);
+  }
+
+  function sendMessage(_x2, _x3) {
+    return _sendMessage.apply(this, arguments);
+  } // sendMessage
+  //    DRAG AND DROP
+
+
+  function _sendMessage() {
+    _sendMessage = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee6(text, fromMainField) {
+      var sendComplete, message, statusArea;
+      return _regenerator["default"].wrap(function _callee6$(_context7) {
+        while (1) {
+          switch (_context7.prev = _context7.next) {
+            case 0:
+              sendComplete = function _sendComplete(message, _text2) {
+                // const dateStamp = store.any(message, ns.dct('created'), null, message.doc())
+                // const content = $rdf.literal(text2)
+                (0, _infinite.insertMessageIntoTable)(channelObject, messageTable, message, false, options, userContext); // not green
+
+                if (originalMessage) {
+                  // editing another message
+                  var oldRow = messageEditor.originalRow; // oldRow.style.display = '' // restore read-only version, re-attack
+
+                  if (oldRow.parentNode) {
+                    oldRow.parentNode.removeChild(oldRow); // No longer needed old version
+                  } else {
+                    debug.warn('No parentNode on old message ' + oldRow.textContent);
+                    oldRow.style.backgroundColor = '#fee';
+                    oldRow.style.visibility = 'hidden'; // @@ FIX THIS AND REMOVE FROM DOM INSTEAD
+                  }
+
+                  messageEditor.parentNode.removeChild(messageEditor); // no longer need editor
+                } else {
+                  if (fromMainField) {
+                    field.value = ''; // clear from out for reuse
+
+                    field.setAttribute('style', messageBodyStyle);
+                    field.disabled = false;
+                    field.scrollIntoView(options.newestFirst); // allign bottom (top)
+
+                    field.focus(); // Start typing next line immediately
+
+                    field.select();
+                  }
+                } // await channelObject.div.refresh() // Add new day if nec  @@ add back
+
+              };
+
+              // const me = authn.currentUser() // Must be logged on or wuld have got login button
+              if (fromMainField) {
+                field.setAttribute('style', messageBodyStyle + 'color: #bbb;'); // pendingedit
+
+                field.disabled = true;
+              }
+
+              _context7.prev = 2;
+              _context7.next = 5;
+              return channelObject.updateMessage(text, originalMessage);
+
+            case 5:
+              message = _context7.sent;
+              _context7.next = 13;
+              break;
+
+            case 8:
+              _context7.prev = 8;
+              _context7.t0 = _context7["catch"](2);
+              statusArea = userContext.statusArea || messageEditor;
+              statusArea.appendChild(widgets.errorMessageBlock(dom, 'Error writing message: ' + _context7.t0));
+              return _context7.abrupt("return");
+
+            case 13:
+              sendComplete(message, text);
+
+            case 14:
+            case "end":
+              return _context7.stop();
+          }
+        }
+      }, _callee6, null, [[2, 8]]);
+    }));
+    return _sendMessage.apply(this, arguments);
+  }
+
+  function droppedFileHandler(files) {
+    var base = messageTable.chatDocument.dir().uri;
+    widgets.uploadFiles(_logic.store.fetcher, files, base + 'Files', base + 'Pictures', /*#__PURE__*/function () {
+      var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(theFile, destURI) {
+        return _regenerator["default"].wrap(function _callee$(_context2) {
+          while (1) {
+            switch (_context2.prev = _context2.next) {
+              case 0:
+                _context2.next = 2;
+                return sendMessage(destURI);
+
+              case 2:
+              case "end":
+                return _context2.stop();
+            }
+          }
+        }, _callee);
+      }));
+
+      return function (_x4, _x5) {
+        return _ref.apply(this, arguments);
+      };
+    }());
+  } // When a set of URIs are dropped on the field
+
+
+  var droppedURIHandler = /*#__PURE__*/function () {
+    var _ref2 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(uris) {
+      var _iterator, _step, uri;
+
+      return _regenerator["default"].wrap(function _callee2$(_context3) {
+        while (1) {
+          switch (_context3.prev = _context3.next) {
+            case 0:
+              _iterator = _createForOfIteratorHelper(uris);
+              _context3.prev = 1;
+
+              _iterator.s();
+
+            case 3:
+              if ((_step = _iterator.n()).done) {
+                _context3.next = 9;
+                break;
+              }
+
+              uri = _step.value;
+              _context3.next = 7;
+              return sendMessage(uri);
+
+            case 7:
+              _context3.next = 3;
+              break;
+
+            case 9:
+              _context3.next = 14;
+              break;
+
+            case 11:
+              _context3.prev = 11;
+              _context3.t0 = _context3["catch"](1);
+
+              _iterator.e(_context3.t0);
+
+            case 14:
+              _context3.prev = 14;
+
+              _iterator.f();
+
+              return _context3.finish(14);
+
+            case 17:
+            case "end":
+              return _context3.stop();
+          }
+        }
+      }, _callee2, null, [[1, 11, 14, 17]]);
+    }));
+
+    return function droppedURIHandler(_x6) {
+      return _ref2.apply(this, arguments);
+    };
+  }(); // When we are actually logged on
+
+
+  function turnOnInput() {
+    function getImageDoc() {
+      imageDoc = $rdf.sym(chatDocument.dir().uri + 'Image_' + Date.now() + '.png');
+      return imageDoc;
+    }
+
+    function tookPicture(_x7) {
+      return _tookPicture.apply(this, arguments);
+    } // Body of turnOnInput
+
+
+    function _tookPicture() {
+      _tookPicture = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee4(imageDoc) {
+        return _regenerator["default"].wrap(function _callee4$(_context5) {
+          while (1) {
+            switch (_context5.prev = _context5.next) {
+              case 0:
+                if (!imageDoc) {
+                  _context5.next = 3;
+                  break;
+                }
+
+                _context5.next = 3;
+                return sendMessage(imageDoc.uri);
+
+              case 3:
+              case "end":
+                return _context5.stop();
+            }
+          }
+        }, _callee4);
+      }));
+      return _tookPicture.apply(this, arguments);
+    }
+
+    var menuButton;
+
+    if (options.menuHandler) {
+      var _menuButton = widgets.button(dom, _iconBase.icons.iconBase + 'noun_243787.svg', 'More');
+
+      _menuButton.setAttribute('style', style.buttonStyle + 'float: right;'); // menuButton.addEventListener('click', _event => sendMessage(), false) (done in turnoninput)
+
+
+      rhs.appendChild(_menuButton);
+    }
+
+    if (options.menuHandler && menuButton) {
+      var _me = _index.authn.currentUser();
+
+      var menuOptions = {
+        me: _me,
+        dom: dom,
+        div: null,
+        // @@ was: div
+        newBase: messageTable.chatDocument.dir().uri
+      };
+      menuButton.addEventListener('click', function (event) {
+        options.menuHandler(event, channelObject.chatChannel, menuOptions);
+      }, false);
+    }
+
+    var me = _index.authn.currentUser(); // If already logged on
+
+
+    creatorAndDate(lhs, me, '', null);
+    field = dom.createElement('textarea');
+    middle.innerHTML = '';
+    middle.appendChild(field);
+    field.rows = 3;
+
+    if (originalMessage) {
+      field.value = _logic.store.anyValue(originalMessage, ns.sioc('content'), null, originalMessage.doc());
+    } // field.cols = 40
+
+
+    field.setAttribute('style', messageBodyStyle + 'background-color: #eef;'); // Trap the Enter BEFORE it is used ti make a newline
+
+    field.addEventListener('keydown', /*#__PURE__*/function () {
+      var _ref3 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3(e) {
+        return _regenerator["default"].wrap(function _callee3$(_context4) {
+          while (1) {
+            switch (_context4.prev = _context4.next) {
+              case 0:
+                if (!(e.code === 'Enter')) {
+                  _context4.next = 4;
+                  break;
+                }
+
+                if (!(!e.shiftKey && !options.shiftEnterSendsMessage || e.shiftKey && options.shiftEnterSendsMessage)) {
+                  _context4.next = 4;
+                  break;
+                }
+
+                _context4.next = 4;
+                return handleFieldInput(e);
+
+              case 4:
+              case "end":
+                return _context4.stop();
+            }
+          }
+        }, _callee3);
+      }));
+
+      return function (_x8) {
+        return _ref3.apply(this, arguments);
+      };
+    }(), false);
+    widgets.makeDropTarget(field, droppedURIHandler, droppedFileHandler);
+    rhs.innerHTML = '';
+    sendButton = widgets.button(dom, sendIcon, 'Send');
+    sendButton.style["float"] = 'right';
+    sendButton.addEventListener('click', function (_event) {
+      return handleFieldInput();
+    }, false);
+    rhs.appendChild(sendButton);
+
+    if (originalMessage) {
+      // Are we editing another message?
+      var cancelButton = rhs.appendChild(widgets.cancelButton(dom));
+      cancelButton.style["float"] = 'left'; // cancelButton.firstChild.style.opacity = '0.3' // moved to buttons
+
+      cancelButton.addEventListener('click', function (_event) {
+        return revertEditing(messageEditor);
+      }, false);
+      rhs.appendChild(cancelButton);
+    }
+
+    var chatDocument = channelObject.dateFolder.leafDocumentFromDate(new Date());
+    var imageDoc;
+    middle.appendChild(_index2.media.cameraButton(dom, _logic.store, getImageDoc, tookPicture));
+    pad.recordParticipation(channelObject.channel, channelObject.channel.doc()); // participation =
+  } // turn on inpuut
+  // Body of renderMessageEditor
+
+
+  var sortDate, sendIcon;
+
+  if (originalMessage) {
+    sortDate = _logic.store.anyValue(originalMessage, ns.dct('created'), null, originalMessage.doc()); // text = store.anyValue(originalMessage, ns.sioc('content'), null, originalMessage.doc())
+
+    sendIcon = _iconBase.icons.iconBase + 'noun_1180158.svg'; // Green check
+    // cancelIcon = icons.iconBase + 'noun_1180156.svg' // Black cross
+  } else {
+    sendIcon = _iconBase.icons.iconBase + 'noun_383448.svg';
+    sortDate = '9999-01-01T00:00:00Z'; // ISO format for field sort
+    // text = ''
+  }
+
+  var messageEditor = dom.createElement('tr');
+  var lhs = dom.createElement('td');
+  var middle = dom.createElement('td');
+  var rhs = dom.createElement('td');
+  messageEditor.appendChild(lhs);
+  messageEditor.appendChild(middle);
+  messageEditor.appendChild(rhs);
+  messageEditor.AJAR_date = sortDate; // messageEditor.appendChild(dom.createElement('br'))
+
+  var field, sendButton;
+  var context = {
+    div: middle,
+    dom: dom
+  };
+
+  _index.authn.logIn(context).then(function (context) {
+    // me = context.me
+    turnOnInput();
+    Object.assign(context, userContext);
+    (0, _bookmarks.findBookmarkDocument)(context).then(function (_context) {// console.log('Bookmark file: ' + context.bookmarkDocument)
+    });
+  });
+
+  return messageEditor;
+} // renderMessageEditor
 //# sourceMappingURL=message.js.map
 
 /***/ }),
@@ -129696,28 +130074,28 @@ var _asyncToGenerator2 = _interopRequireDefault(__webpack_require__(/*! @babel/r
 
 var _slicedToArray2 = _interopRequireDefault(__webpack_require__(/*! @babel/runtime/helpers/slicedToArray */ "./node_modules/solid-ui/node_modules/@babel/runtime/helpers/slicedToArray.js"));
 
+var debug = _interopRequireWildcard(__webpack_require__(/*! ../debug */ "./node_modules/solid-ui/lib/debug.js"));
+
 var _index = __webpack_require__(/*! ../authn/index */ "./node_modules/solid-ui/lib/authn/index.js");
 
 var _iconBase = __webpack_require__(/*! ../iconBase */ "./node_modules/solid-ui/lib/iconBase.js");
 
 var _logic = __webpack_require__(/*! ../logic */ "./node_modules/solid-ui/lib/logic.js");
 
-var _index2 = __webpack_require__(/*! ../media/index */ "./node_modules/solid-ui/lib/media/index.js");
-
 var ns = _interopRequireWildcard(__webpack_require__(/*! ../ns */ "./node_modules/solid-ui/lib/ns.js"));
 
-var pad = _interopRequireWildcard(__webpack_require__(/*! ../pad */ "./node_modules/solid-ui/lib/pad.js"));
-
 var rdf = _interopRequireWildcard(__webpack_require__(/*! rdflib */ "./node_modules/rdflib/esm/index.js"));
 
-var style = _interopRequireWildcard(__webpack_require__(/*! ../style */ "./node_modules/solid-ui/lib/style.js"));
-
 var utils = _interopRequireWildcard(__webpack_require__(/*! ../utils */ "./node_modules/solid-ui/lib/utils/index.js"));
 
 var widgets = _interopRequireWildcard(__webpack_require__(/*! ../widgets */ "./node_modules/solid-ui/lib/widgets/index.js"));
 
 var _bookmarks = __webpack_require__(/*! ./bookmarks */ "./node_modules/solid-ui/lib/chat/bookmarks.js");
 
+var _chatLogic = __webpack_require__(/*! ./chatLogic */ "./node_modules/solid-ui/lib/chat/chatLogic.js");
+
+var _message = __webpack_require__(/*! ./message */ "./node_modules/solid-ui/lib/chat/message.js");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -129731,52 +130109,29 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
  * If you made it originally: edit, delete, attach
  * @packageDocumentation
  */
-
-/* global $rdf */
+// import { media } from '../media/index'
+// import * as pad from '../pad'
 // pull in first avoid cross-refs
-var UI = {
-  authn: _index.authn,
-  icons: _iconBase.icons,
-  ns: ns,
-  media: _index2.media,
-  pad: pad,
-  rdf: rdf,
-  store: _logic.store,
-  style: style,
-  utils: utils,
-  widgets: widgets
-};
-var dom = window.document;
-var kb = _logic.store; // const label = UI.utils.label
-// THE UNUSED ICONS are here as reminders for possible future functionality
+// import * as style from '../style'
+// import { infiniteMessageArea } from './infinite.js'
+// import { renderMessage, creatorAndDate } from './message'
+// import * as debug from '../debug'
+var dom = window.document; // THE UNUSED ICONS are here as reminders for possible future functionality
 // const BOOKMARK_ICON = 'noun_45961.svg'
 // const HEART_ICON = 'noun_130259.svg' -> Add this to my (private) favorites
 // const MENU_ICON = 'noun_897914.svg'
 // const PAPERCLIP_ICON = 'noun_25830.svg' -> add attachments to this message
 // const PIN_ICON = 'noun_562340.svg'  -> pin this message permanently in the chat UI
-// const PENCIL_ICON = 'noun_253504.svg'
+
+var PENCIL_ICON = 'noun_253504.svg'; // edit a message
 // const SPANNER_ICON = 'noun_344563.svg' -> settings
 
 var THUMBS_UP_ICON = 'noun_1384132.svg';
-var THUMBS_DOWN_ICON = 'noun_1384135.svg'; // module.export = { messageTools, sentimentStripLinked, sentimentStrip }
-// @@@@ use the one in rdflib.js when it is avaiable and delete this
-
-function updatePromise(del, ins) {
-  return new Promise(function (resolve, reject) {
-    kb.updater.update(del, ins, function (uri, ok, errorBody) {
-      if (!ok) {
-        reject(new Error(errorBody));
-      } else {
-        resolve();
-      }
-    }); // callback
-  }); // promise
-}
+var THUMBS_DOWN_ICON = 'noun_1384135.svg';
 /**
  * Emoji in Unicode
  */
 
-
 var emoji = {};
 emoji[ns.schema('AgreeAction')] = '👍';
 emoji[ns.schema('DisagreeAction')] = '👎';
@@ -129787,9 +130142,11 @@ emoji[ns.schema('LikeAction')] = '❤️';
  */
 
 function sentimentStrip(target, doc) {
-  var actions = kb.each(null, ns.schema('target'), target, doc);
+  // alain seems not used
+  var latest = (0, _chatLogic.mostRecentVersion)(target);
+  var actions = _logic.store.holds(latest, ns.schema('dateDeleted').value, null, latest.doc()) ? _logic.store.each(null, ns.schema('target'), target, doc) : [];
   var sentiments = actions.map(function (a) {
-    return kb.any(a, ns.rdf('type'), null, doc);
+    return _logic.store.any(a, ns.rdf('type'), null, doc);
   });
   sentiments.sort();
   var strings = sentiments.map(function (x) {
@@ -129810,9 +130167,9 @@ function sentimentStripLinked(target, doc) {
 
   function refresh() {
     strip.innerHTML = '';
-    var actions = kb.each(null, ns.schema('target'), target, doc);
+    var actions = (0, _chatLogic.mostRecentVersion)(target).uri !== ns.schema('dateDeleted').uri ? _logic.store.each(null, ns.schema('target'), target, doc) : [];
     var sentiments = actions.map(function (a) {
-      return [kb.any(a, ns.rdf('type'), null, doc), kb.any(a, ns.schema('agent'), null, doc)];
+      return [_logic.store.any(a, ns.rdf('type'), null, doc), _logic.store.any(a, ns.schema('agent'), null, doc)];
     });
     sentiments.sort();
     sentiments.forEach(function (ss) {
@@ -129843,60 +130200,142 @@ function sentimentStripLinked(target, doc) {
  */
 
 
-function messageToolbar(message, messageRow, userContext) {
-  var div = dom.createElement('div');
+function messageToolbar(message, messageRow, userContext, channelObject) {
+  function deleteMessage() {
+    return _deleteMessage.apply(this, arguments);
+  }
 
-  function closeToolbar() {
-    div.parentElement.parentElement.removeChild(div.parentElement); // remive the TR
+  function _deleteMessage() {
+    _deleteMessage = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
+      var author, msg, area;
+      return _regenerator["default"].wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              author = _logic.store.any(message, ns.foaf('maker'));
+
+              if (me) {
+                _context2.next = 5;
+                break;
+              }
+
+              alert('You can\'t delete the message, you are not logged in.');
+              _context2.next = 22;
+              break;
+
+            case 5:
+              if (!me.sameTerm(author)) {
+                _context2.next = 21;
+                break;
+              }
+
+              _context2.prev = 6;
+              _context2.next = 9;
+              return channelObject.deleteMessage(message);
+
+            case 9:
+              _context2.next = 18;
+              break;
+
+            case 11:
+              _context2.prev = 11;
+              _context2.t0 = _context2["catch"](6);
+              msg = 'Error deleting messaage ' + _context2.t0;
+              debug.warn(msg);
+              alert(msg);
+              area = userContext.statusArea || messageRow.parentNode;
+              area.appendChild(widgets.errorMessageBlock(dom, msg));
+
+            case 18:
+              messageRow.parentNode.removeChild(messageRow);
+              _context2.next = 22;
+              break;
+
+            case 21:
+              alert('You can\'t delete the message, you are not logged in as the author, ' + author);
+
+            case 22:
+              closeToolbar();
+
+            case 23:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2, null, [[6, 11]]);
+    }));
+    return _deleteMessage.apply(this, arguments);
   }
 
-  function deleteThingThen(_x) {
-    return _deleteThingThen.apply(this, arguments);
-  } // Things only the original author can do
+  function editMessage(_x) {
+    return _editMessage.apply(this, arguments);
+  } // alain TODO allow chat owner to fully delete message + sentiments and replacing messages
 
 
-  function _deleteThingThen() {
-    _deleteThingThen = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3(x) {
+  function _editMessage() {
+    _editMessage = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee3(messageRow) {
       return _regenerator["default"].wrap(function _callee3$(_context3) {
         while (1) {
           switch (_context3.prev = _context3.next) {
             case 0:
-              _context3.next = 2;
-              return updatePromise(kb.connectedStatements(x), []);
+              if (me.value === _logic.store.any(message, ns.foaf('maker')).value) {
+                closeToolbar(); // edit is a one-off action
 
-            case 2:
+                (0, _message.switchToEditor)(messageRow, message, channelObject, userContext);
+              }
+
+            case 1:
             case "end":
               return _context3.stop();
           }
         }
       }, _callee3);
     }));
-    return _deleteThingThen.apply(this, arguments);
+    return _editMessage.apply(this, arguments);
   }
 
-  var me = UI.authn.currentUser(); // If already logged on
+  var div = dom.createElement('div'); // is message deleted ?
 
-  if (me && kb.holds(message, ns.foaf('maker'), me)) {
-    // button to delete the message
-    var deleteButton = UI.widgets.deleteButtonWithCheck(dom, div, 'message', /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee() {
-      return _regenerator["default"].wrap(function _callee$(_context) {
+  if ((0, _chatLogic.mostRecentVersion)(message).value === ns.schema('dateDeleted').value) return div;
+
+  function closeToolbar() {
+    div.parentElement.parentElement.removeChild(div.parentElement); // remive the TR
+  }
+
+  function deleteThingThen(_x2) {
+    return _deleteThingThen.apply(this, arguments);
+  } // Things only the original author can do
+
+
+  function _deleteThingThen() {
+    _deleteThingThen = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee4(x) {
+      return _regenerator["default"].wrap(function _callee4$(_context4) {
         while (1) {
-          switch (_context.prev = _context.next) {
+          switch (_context4.prev = _context4.next) {
             case 0:
-              _context.next = 2;
-              return kb.updater.update(kb.connectedStatements[message], []);
+              _context4.next = 2;
+              return _logic.store.updater.update(_logic.store.connectedStatements(x), []);
 
             case 2:
-              closeToolbar();
-
-            case 3:
             case "end":
-              return _context.stop();
+              return _context4.stop();
           }
         }
-      }, _callee);
-    })));
-    div.appendChild(deleteButton);
+      }, _callee4);
+    }));
+    return _deleteThingThen.apply(this, arguments);
+  }
+
+  var me = _index.authn.currentUser(); // If already logged on
+
+
+  if (me && _logic.store.holds(message, ns.foaf('maker'), me)) {
+    // button to delete the message
+    div.appendChild(widgets.deleteButtonWithCheck(dom, div, 'message', deleteMessage)); // button to edit the message
+
+    div.appendChild(widgets.button(dom, _iconBase.icons.iconBase + PENCIL_ICON, 'edit', function () {
+      return editMessage(messageRow);
+    }));
   } // if mine
   // Things anyone can do if they have a bookmark list async
 
@@ -129927,39 +130366,39 @@ function messageToolbar(message, messageRow, userContext) {
       button.style.backgroundColor = action ? 'yellow' : 'white';
     }
 
-    var button = UI.widgets.button(dom, icon, UI.utils.label(actionClass), /*#__PURE__*/function () {
-      var _ref2 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2(_event) {
+    var button = widgets.button(dom, icon, utils.label(actionClass), /*#__PURE__*/function () {
+      var _ref = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(_event) {
         var insertMe, dirty, i, a;
-        return _regenerator["default"].wrap(function _callee2$(_context2) {
+        return _regenerator["default"].wrap(function _callee$(_context) {
           while (1) {
-            switch (_context2.prev = _context2.next) {
+            switch (_context.prev = _context.next) {
               case 0:
                 if (!action) {
-                  _context2.next = 7;
+                  _context.next = 7;
                   break;
                 }
 
-                _context2.next = 3;
+                _context.next = 3;
                 return deleteThingThen(action);
 
               case 3:
                 action = null;
                 setColor();
-                _context2.next = 25;
+                _context.next = 25;
                 break;
 
               case 7:
                 // no action
-                action = UI.widgets.newThing(doc);
-                insertMe = [$rdf.st(action, ns.schema('agent'), context.me, doc), $rdf.st(action, ns.rdf('type'), actionClass, doc), $rdf.st(action, ns.schema('target'), target, doc)];
-                _context2.next = 11;
-                return updatePromise([], insertMe);
+                action = widgets.newThing(doc);
+                insertMe = [rdf.st(action, ns.schema('agent'), context.me, doc), rdf.st(action, ns.rdf('type'), actionClass, doc), rdf.st(action, ns.schema('target'), target, doc)];
+                _context.next = 11;
+                return _logic.store.updater.update([], insertMe);
 
               case 11:
                 setColor();
 
                 if (!mutuallyExclusive) {
-                  _context2.next = 25;
+                  _context.next = 25;
                   break;
                 }
 
@@ -129969,18 +130408,18 @@ function messageToolbar(message, messageRow, userContext) {
 
               case 15:
                 if (!(i < mutuallyExclusive.length)) {
-                  _context2.next = 24;
+                  _context.next = 24;
                   break;
                 }
 
                 a = existingAction(mutuallyExclusive[i]);
 
                 if (!a) {
-                  _context2.next = 21;
+                  _context.next = 21;
                   break;
                 }
 
-                _context2.next = 20;
+                _context.next = 20;
                 return deleteThingThen(a);
 
               case 20:
@@ -129989,34 +130428,35 @@ function messageToolbar(message, messageRow, userContext) {
 
               case 21:
                 i++;
-                _context2.next = 15;
+                _context.next = 15;
                 break;
 
               case 24:
                 if (dirty) {
-                  // UI.widgets.refreshTree(button.parentNode) // requires them all to be immediate siblings
-                  UI.widgets.refreshTree(messageRow); // requires them all to be immediate siblings
+                  // widgets.refreshTree(button.parentNode) // requires them all to be immediate siblings
+                  widgets.refreshTree(messageRow); // requires them all to be immediate siblings
                 }
 
               case 25:
               case "end":
-                return _context2.stop();
+                return _context.stop();
             }
           }
-        }, _callee2);
+        }, _callee);
       }));
 
-      return function (_x2) {
-        return _ref2.apply(this, arguments);
+      return function (_x3) {
+        return _ref.apply(this, arguments);
       };
     }());
 
     function existingAction(actionClass) {
-      var actions = kb.each(null, ns.schema('agent'), context.me, doc).filter(function (x) {
-        return kb.holds(x, ns.rdf('type'), actionClass, doc);
+      var actions = _logic.store.each(null, ns.schema('agent'), context.me, doc).filter(function (x) {
+        return _logic.store.holds(x, ns.rdf('type'), actionClass, doc);
       }).filter(function (x) {
-        return kb.holds(x, ns.schema('target'), target, doc);
+        return _logic.store.holds(x, ns.schema('target'), target, doc);
       });
+
       return actions.length ? actions[0] : null;
     }
 
@@ -130034,23 +130474,23 @@ function messageToolbar(message, messageRow, userContext) {
   // https://schema.org/AgreeAction
 
 
-  me = UI.authn.currentUser(); // If already logged on
+  me = _index.authn.currentUser(); // If already logged on
+  // debug.log('Actions 3' + mostRecentVersion(message).value + ' ' + ns.schema('dateDeleted').value + ' ' + (mostRecentVersion(message).value !== ns.schema('dateDeleted').value))
 
-  if (me) {
-    // Things you mnust be logged in for
+  if (me && (0, _chatLogic.mostRecentVersion)(message).value !== ns.schema('dateDeleted').value) {
     var context1 = {
       me: me,
       dom: dom,
       div: div
     };
-    div.appendChild(sentimentButton(context1, message, // @@ TODO use UI.widgets.sentimentButton
-    UI.icons.iconBase + THUMBS_UP_ICON, ns.schema('AgreeAction'), message.doc(), [ns.schema('DisagreeAction')])); // Thumbs down
+    div.appendChild(sentimentButton(context1, message, // @@ TODO use widgets.sentimentButton
+    _iconBase.icons.iconBase + THUMBS_UP_ICON, ns.schema('AgreeAction'), message.doc(), [ns.schema('DisagreeAction')])); // Thumbs down
 
-    div.appendChild(sentimentButton(context1, message, UI.icons.iconBase + THUMBS_DOWN_ICON, ns.schema('DisagreeAction'), message.doc(), [ns.schema('AgreeAction')]));
+    div.appendChild(sentimentButton(context1, message, _iconBase.icons.iconBase + THUMBS_DOWN_ICON, ns.schema('DisagreeAction'), message.doc(), [ns.schema('AgreeAction')]));
   } // X button to remove the tool UI itself
 
 
-  var cancelButton = div.appendChild(UI.widgets.cancelButton(dom));
+  var cancelButton = div.appendChild(widgets.cancelButton(dom));
   cancelButton.style["float"] = 'right';
   cancelButton.firstChild.style.opacity = '0.3';
   cancelButton.addEventListener('click', closeToolbar);
@@ -137683,10 +138123,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 var _default = {
-  buildTime: '2022-01-27T19:22:56Z',
-  commit: 'fb2b21e1e0c28c850c52cb27596b0bd4d509a104',
+  buildTime: '2022-01-28T22:55:43Z',
+  commit: '9d83fb1702a1835b5d82fb97bc51b3cb98285373',
   npmInfo: {
-    'solid-ui': '2.4.15',
+    'solid-ui': '2.4.16',
     npm: '6.14.15',
     ares: '1.18.1',
     brotli: '1.0.9',
@@ -138405,7 +138845,14 @@ function button(dom, iconURI, text, handler) {
 
 
 function cancelButton(dom, handler) {
-  return button(dom, cancelIconURI, 'Cancel', handler);
+  var b = button(dom, cancelIconURI, 'Cancel', handler);
+
+  if (b.firstChild) {
+    // sigh for tsc
+    b.firstChild.style.opacity = '0.3'; // Black X is too harsh: current language is grey X
+  }
+
+  return b;
 }
 /*  Make a continue button
  *
@@ -148644,25 +149091,25 @@ __webpack_require__.r(__webpack_exports__);
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony default export */ __webpack_exports__["default"] = ({
-  buildTime: '2022-01-28T10:38:24Z',
-  commit: '276e51de4e74a2af05c93703391d461c3bdc82f2',
+  buildTime: '2022-02-09T18:53:32Z',
+  commit: 'b5d50d307d8a17759ad5479106f370bab2910de6',
   npmInfo: {
-    mashlib: '1.7.17',
-    npm: '6.14.13',
-    ares: '1.17.1',
+    mashlib: '1.7.18-alpha',
+    npm: '6.14.15',
+    ares: '1.18.1',
     brotli: '1.0.9',
     cldr: '39.0',
     icu: '69.1',
-    llhttp: '2.1.3',
+    llhttp: '2.1.4',
     modules: '83',
     napi: '8',
     nghttp2: '1.42.0',
-    node: '14.17.3',
-    openssl: '1.1.1k',
+    node: '14.18.3',
+    openssl: '1.1.1l',
     tz: '2021a',
     unicode: '13.0',
-    uv: '1.41.0',
-    v8: '8.4.371.23-node.67',
+    uv: '1.42.0',
+    v8: '8.4.371.23-node.85',
     zlib: '1.2.11'
   }
 });