From 8742e4bfe94a1d081804571d69b8e1f9c530384f Mon Sep 17 00:00:00 2001
From: zadam <zadam.apps@gmail.com>
Date: Fri, 24 Nov 2023 00:04:49 +0100
Subject: [PATCH 1/8] make sure the promoted attributes don't take the whole
 screen in mobile, #4468

---
 .../app/widgets/ribbon_widgets/promoted_attributes.js     | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/public/app/widgets/ribbon_widgets/promoted_attributes.js b/src/public/app/widgets/ribbon_widgets/promoted_attributes.js
index ae34550fa..9304b0b0f 100644
--- a/src/public/app/widgets/ribbon_widgets/promoted_attributes.js
+++ b/src/public/app/widgets/ribbon_widgets/promoted_attributes.js
@@ -8,8 +8,14 @@ import options from "../../services/options.js";
 import utils from "../../services/utils.js";
 
 const TPL = `
-<div>
+<div class="promoted-attributes-widget">
     <style>
+    body.mobile .promoted-attributes-widget {
+        /* https://github.com/zadam/trilium/issues/4468 */
+        flex-shrink: 0.4;
+        overflow: auto;
+    }
+    
     .promoted-attributes-container {
         margin: auto;
         display: flex;

From ed129c307b466d5a372eb985f8832675932d9cba Mon Sep 17 00:00:00 2001
From: zadam <zadam.apps@gmail.com>
Date: Fri, 24 Nov 2023 00:17:20 +0100
Subject: [PATCH 2/8] fix printing math, closes #4470

---
 src/public/app/widgets/note_detail.js | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/public/app/widgets/note_detail.js b/src/public/app/widgets/note_detail.js
index 2fdef9bcc..a54e40359 100644
--- a/src/public/app/widgets/note_detail.js
+++ b/src/public/app/widgets/note_detail.js
@@ -258,10 +258,11 @@ export default class NoteDetailWidget extends NoteContextAwareWidget {
                         .append($("<h2>").text(this.note.title))
                         .append($promotedAttributes)
                         .prop('outerHTML'),
+
             footer: `
-<script src="${assetPath}/libraries/katex/katex.min.js"></script>
-<script src="${assetPath}/libraries/katex/mhchem.min.js"></script>
-<script src="${assetPath}/libraries/katex/auto-render.min.js"></script>
+<script src="${assetPath}/node_modules/katex/dist/katex.min.js"></script>
+<script src="${assetPath}/node_modules/katex/dist/contrib/mhchem.min.js"></script>
+<script src="${assetPath}/node_modules/katex/dist/contrib/auto-render.min.js"></script>
 <script>
     document.body.className += ' ck-content printed-content';
     
@@ -273,7 +274,7 @@ export default class NoteDetailWidget extends NoteContextAwareWidget {
                 `${assetPath}/libraries/codemirror/codemirror.css`,
                 `${assetPath}/libraries/ckeditor/ckeditor-content.css`,
                 `${assetPath}/libraries/bootstrap/css/bootstrap.min.css`,
-                `${assetPath}/libraries/katex/katex.min.css`,
+                `${assetPath}/node_modules/katex/dist/katex.min.css`,
                 `${assetPath}/stylesheets/print.css`,
                 `${assetPath}/stylesheets/relation_map.css`,
                 `${assetPath}/stylesheets/ckeditor-theme.css`

From 18e2e6779b507eaff834afb4c940a93bbe728bcc Mon Sep 17 00:00:00 2001
From: zadam <zadam.apps@gmail.com>
Date: Fri, 24 Nov 2023 23:51:12 +0100
Subject: [PATCH 3/8] remove title to fix closing highlights list, fixes #4471

---
 src/public/app/widgets/highlights_list.js | 1 -
 src/public/app/widgets/toc.js             | 1 -
 2 files changed, 2 deletions(-)

diff --git a/src/public/app/widgets/highlights_list.js b/src/public/app/widgets/highlights_list.js
index 285d9634d..032ae36ce 100644
--- a/src/public/app/widgets/highlights_list.js
+++ b/src/public/app/widgets/highlights_list.js
@@ -56,7 +56,6 @@ export default class HighlightsListWidget extends RightPanelWidget {
                 .class("icon-action"),
             new OnClickButtonWidget()
                 .icon("bx-x")
-                .title("Close Highlights List")
                 .titlePlacement("left")
                 .onClick(widget => widget.triggerCommand("closeHlt"))
                 .class("icon-action")
diff --git a/src/public/app/widgets/toc.js b/src/public/app/widgets/toc.js
index 3824c960f..aaad8bc82 100644
--- a/src/public/app/widgets/toc.js
+++ b/src/public/app/widgets/toc.js
@@ -68,7 +68,6 @@ export default class TocWidget extends RightPanelWidget {
                 .class("icon-action"),
             new OnClickButtonWidget()
                 .icon("bx-x")
-                .title("Close Table of Contents")
                 .titlePlacement("left")
                 .onClick(widget => widget.triggerCommand("closeToc"))
                 .class("icon-action")

From 10f3df3ed4af77c2bc9158ea5f8937eb4fe477de Mon Sep 17 00:00:00 2001
From: zadam <zadam.apps@gmail.com>
Date: Sun, 26 Nov 2023 23:51:04 +0100
Subject: [PATCH 4/8] make sure content is string for post-processing

---
 src/services/notes.js | 4 ++++
 src/services/utils.js | 5 +++++
 2 files changed, 9 insertions(+)

diff --git a/src/services/notes.js b/src/services/notes.js
index b89755393..3e63dea8e 100644
--- a/src/services/notes.js
+++ b/src/services/notes.js
@@ -889,6 +889,10 @@ function scanForLinks(note, content) {
  * Things which have to be executed after updating content, but asynchronously (separate transaction)
  */
 async function asyncPostProcessContent(note, content) {
+    if (note.hasStringContent() && !utils.isString(content)) {
+        content = content.toString();
+    }
+
     scanForLinks(note, content);
 }
 
diff --git a/src/services/utils.js b/src/services/utils.js
index a0a84e975..517d65ef9 100644
--- a/src/services/utils.js
+++ b/src/services/utils.js
@@ -303,6 +303,10 @@ function toMap(list, key) {
     return map;
 }
 
+function isString(x) {
+    return Object.prototype.toString.call(x) === "[object String]";
+}
+
 module.exports = {
     randomSecureToken,
     randomString,
@@ -335,4 +339,5 @@ module.exports = {
     normalize,
     hashedBlobId,
     toMap,
+    isString
 };

From ad74952194f07724cfaffa0c6f0e3441e39e6150 Mon Sep 17 00:00:00 2001
From: zadam <zadam.apps@gmail.com>
Date: Mon, 27 Nov 2023 10:10:27 +0100
Subject: [PATCH 5/8] fix thumbnails with chinese titles, closes #4478

---
 package-lock.json                                    | 5 ++---
 src/public/app/services/content_renderer.js          | 6 +++---
 src/public/app/widgets/dialogs/revisions.js          | 8 ++++----
 src/public/app/widgets/type_widgets/editable_text.js | 4 ++--
 src/routes/api/clipper.js                            | 4 +++-
 src/services/import/enex.js                          | 3 ++-
 src/services/notes.js                                | 3 ++-
 7 files changed, 18 insertions(+), 15 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index aacf5d057..3a478467a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,11 @@
 {
   "name": "trilium",
-  "version": "0.62.1-beta",
+  "version": "0.62.2",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
-      "name": "trilium",
-      "version": "0.62.1-beta",
+      "version": "0.62.2",
       "hasInstallScript": true,
       "license": "AGPL-3.0-only",
       "dependencies": {
diff --git a/src/public/app/services/content_renderer.js b/src/public/app/services/content_renderer.js
index 6f66adfb0..8be8ba1e8 100644
--- a/src/public/app/services/content_renderer.js
+++ b/src/public/app/services/content_renderer.js
@@ -117,14 +117,14 @@ async function renderCode(note, $renderedContent) {
 }
 
 function renderImage(entity, $renderedContent, options = {}) {
-    const sanitizedTitle = entity.title.replace(/[^a-z0-9-.]/gi, "");
+    const encodedTitle = encodeURIComponent(entity.title);
 
     let url;
 
     if (entity instanceof FNote) {
-        url = `api/images/${entity.noteId}/${sanitizedTitle}?${Math.random()}`;
+        url = `api/images/${entity.noteId}/${encodedTitle}?${Math.random()}`;
     } else if (entity instanceof FAttachment) {
-        url = `api/attachments/${entity.attachmentId}/image/${sanitizedTitle}?${entity.utcDateModified}">`;
+        url = `api/attachments/${entity.attachmentId}/image/${encodedTitle}?${entity.utcDateModified}">`;
     }
 
     $renderedContent // styles needed for the zoom to work well
diff --git a/src/public/app/widgets/dialogs/revisions.js b/src/public/app/widgets/dialogs/revisions.js
index 1799ce37a..b040ed994 100644
--- a/src/public/app/widgets/dialogs/revisions.js
+++ b/src/public/app/widgets/dialogs/revisions.js
@@ -274,16 +274,16 @@ export default class RevisionsDialog extends BasicWidget {
 
             this.$content.html($table);
         } else if (revisionItem.type === 'canvas') {
-            const sanitizedTitle = revisionItem.title.replace(/[^a-z0-9-.]/gi, "");
+            const encodedTitle = encodeURIComponent(revisionItem.title);
 
             this.$content.html($("<img>")
-                .attr("src", `api/revisions/${revisionItem.revisionId}/image/${sanitizedTitle}?${Math.random()}`)
+                .attr("src", `api/revisions/${revisionItem.revisionId}/image/${encodedTitle}?${Math.random()}`)
                 .css("max-width", "100%"));
         } else if (revisionItem.type === 'mermaid') {
-            const sanitizedTitle = revisionItem.title.replace(/[^a-z0-9-.]/gi, "");
+            const encodedTitle = encodeURIComponent(revisionItem.title);
 
             this.$content.html($("<img>")
-                .attr("src", `api/revisions/${revisionItem.revisionId}/image/${sanitizedTitle}?${Math.random()}`)
+                .attr("src", `api/revisions/${revisionItem.revisionId}/image/${encodedTitle}?${Math.random()}`)
                 .css("max-width", "100%"));
 
             this.$content.append($("<pre>").text(fullRevision.content));
diff --git a/src/public/app/widgets/type_widgets/editable_text.js b/src/public/app/widgets/type_widgets/editable_text.js
index 36cdc170f..d2c601658 100644
--- a/src/public/app/widgets/type_widgets/editable_text.js
+++ b/src/public/app/widgets/type_widgets/editable_text.js
@@ -365,8 +365,8 @@ export default class EditableTextTypeWidget extends AbstractTextTypeWidget {
         const note = await froca.getNote(noteId);
 
         this.watchdog.editor.model.change( writer => {
-            const sanitizedTitle = note.title.replace(/[^a-z0-9-.]/gi, "");
-            const src = `api/images/${note.noteId}/${sanitizedTitle}`;
+            const encodedTitle = encodeURIComponent(note.title);
+            const src = `api/images/${note.noteId}/${encodedTitle}`;
 
             const imageElement = writer.createElement( 'image',  { 'src': src } );
 
diff --git a/src/routes/api/clipper.js b/src/routes/api/clipper.js
index a1eaba3b4..9a39ca797 100644
--- a/src/routes/api/clipper.js
+++ b/src/routes/api/clipper.js
@@ -153,7 +153,9 @@ function processContent(images, note, content) {
             const buffer = Buffer.from(dataUrl.split(",")[1], 'base64');
 
             const attachment = imageService.saveImageToAttachment(note.noteId, buffer, filename, true);
-            const sanitizedTitle = attachment.title.replace(/[^a-z0-9-.]/gi, "");
+
+            // We might want to replace with escape-html. For non-latin-based languages, this doesn't work well.
+            const sanitizedTitle = attachment.title.replace(/[^a-z0-9-.]/gi, "") || "attachment";
             const url = `api/attachments/${attachment.attachmentId}/image/${sanitizedTitle}`;
 
             log.info(`Replacing '${imageId}' with '${url}' in note '${note.noteId}'`);
diff --git a/src/services/import/enex.js b/src/services/import/enex.js
index 5dcd9453b..ec2a36c53 100644
--- a/src/services/import/enex.js
+++ b/src/services/import/enex.js
@@ -303,7 +303,8 @@ function importEnex(taskContext, file, parentNote) {
 
                     const attachment = imageService.saveImageToAttachment(noteEntity.noteId, resource.content, originalName, taskContext.data.shrinkImages);
 
-                    const sanitizedTitle = attachment.title.replace(/[^a-z0-9-.]/gi, "");
+                    // We might want to replace with escape-html. For non-latin-based languages, this doesn't work well.
+                    const sanitizedTitle = attachment.title.replace(/[^a-z0-9-.]/gi, "") || "attachment";
                     const url = `api/attachments/${attachment.attachmentId}/image/${sanitizedTitle}`;
                     const imageLink = `<img src="${url}">`;
 
diff --git a/src/services/notes.js b/src/services/notes.js
index 3e63dea8e..e9c7e1b76 100644
--- a/src/services/notes.js
+++ b/src/services/notes.js
@@ -529,7 +529,8 @@ function downloadImages(noteId, content) {
             const imageService = require('../services/image');
             const attachment = imageService.saveImageToAttachment(noteId, imageBuffer, "inline image", true, true);
 
-            const sanitizedTitle = attachment.title.replace(/[^a-z0-9-.]/gi, "");
+            // We might want to replace with escape-html. For non-latin-based languages, this doesn't work well.
+            const sanitizedTitle = attachment.title.replace(/[^a-z0-9-.]/gi, "") || "attachment";
 
             content = `${content.substr(0, imageMatch.index)}<img src="api/attachments/${attachment.attachmentId}/image/${sanitizedTitle}"${content.substr(imageMatch.index + imageMatch[0].length)}`;
         }

From d07f02b95f86d7ddcf99655a21ee2bdc578b40dd Mon Sep 17 00:00:00 2001
From: zadam <zadam.apps@gmail.com>
Date: Mon, 27 Nov 2023 10:15:29 +0100
Subject: [PATCH 6/8] contrary to what I believed encodeURIComponent() is
 available also in node.js, #4478

---
 src/routes/api/clipper.js   | 5 ++---
 src/services/import/enex.js | 5 ++---
 src/services/notes.js       | 5 ++---
 3 files changed, 6 insertions(+), 9 deletions(-)

diff --git a/src/routes/api/clipper.js b/src/routes/api/clipper.js
index 9a39ca797..15b8dc76d 100644
--- a/src/routes/api/clipper.js
+++ b/src/routes/api/clipper.js
@@ -154,9 +154,8 @@ function processContent(images, note, content) {
 
             const attachment = imageService.saveImageToAttachment(note.noteId, buffer, filename, true);
 
-            // We might want to replace with escape-html. For non-latin-based languages, this doesn't work well.
-            const sanitizedTitle = attachment.title.replace(/[^a-z0-9-.]/gi, "") || "attachment";
-            const url = `api/attachments/${attachment.attachmentId}/image/${sanitizedTitle}`;
+            const encodedTitle = encodeURIComponent(attachment.title);
+            const url = `api/attachments/${attachment.attachmentId}/image/${encodedTitle}`;
 
             log.info(`Replacing '${imageId}' with '${url}' in note '${note.noteId}'`);
 
diff --git a/src/services/import/enex.js b/src/services/import/enex.js
index ec2a36c53..2ae57c806 100644
--- a/src/services/import/enex.js
+++ b/src/services/import/enex.js
@@ -303,9 +303,8 @@ function importEnex(taskContext, file, parentNote) {
 
                     const attachment = imageService.saveImageToAttachment(noteEntity.noteId, resource.content, originalName, taskContext.data.shrinkImages);
 
-                    // We might want to replace with escape-html. For non-latin-based languages, this doesn't work well.
-                    const sanitizedTitle = attachment.title.replace(/[^a-z0-9-.]/gi, "") || "attachment";
-                    const url = `api/attachments/${attachment.attachmentId}/image/${sanitizedTitle}`;
+                    const encodedTitle = encodeURIComponent(attachment.title);
+                    const url = `api/attachments/${attachment.attachmentId}/image/${encodedTitle}`;
                     const imageLink = `<img src="${url}">`;
 
                     content = content.replace(mediaRegex, imageLink);
diff --git a/src/services/notes.js b/src/services/notes.js
index e9c7e1b76..c325bba9b 100644
--- a/src/services/notes.js
+++ b/src/services/notes.js
@@ -529,10 +529,9 @@ function downloadImages(noteId, content) {
             const imageService = require('../services/image');
             const attachment = imageService.saveImageToAttachment(noteId, imageBuffer, "inline image", true, true);
 
-            // We might want to replace with escape-html. For non-latin-based languages, this doesn't work well.
-            const sanitizedTitle = attachment.title.replace(/[^a-z0-9-.]/gi, "") || "attachment";
+            const encodedTitle = encodeURIComponent(attachment.title);
 
-            content = `${content.substr(0, imageMatch.index)}<img src="api/attachments/${attachment.attachmentId}/image/${sanitizedTitle}"${content.substr(imageMatch.index + imageMatch[0].length)}`;
+            content = `${content.substr(0, imageMatch.index)}<img src="api/attachments/${attachment.attachmentId}/image/${encodedTitle}"${content.substr(imageMatch.index + imageMatch[0].length)}`;
         }
         else if (!url.includes('api/images/') && !/api\/attachments\/.+\/image\/?.*/.test(url)
             // this is an exception for the web clipper's "imageId"

From 686af0c6a12d9082fa71537baf9694babbdc710d Mon Sep 17 00:00:00 2001
From: zadam <zadam.apps@gmail.com>
Date: Mon, 27 Nov 2023 10:22:54 +0100
Subject: [PATCH 7/8] when canvas and mermaid are inserted using "include
 note", we insert them as images

---
 src/public/app/widgets/dialogs/include_note.js       | 2 +-
 src/public/app/widgets/type_widgets/editable_text.js | 4 +---
 2 files changed, 2 insertions(+), 4 deletions(-)

diff --git a/src/public/app/widgets/dialogs/include_note.js b/src/public/app/widgets/dialogs/include_note.js
index 7fb1e4c25..f4d81778d 100644
--- a/src/public/app/widgets/dialogs/include_note.js
+++ b/src/public/app/widgets/dialogs/include_note.js
@@ -97,7 +97,7 @@ export default class IncludeNoteDialog extends BasicWidget {
 
         const boxSize = $("input[name='include-note-box-size']:checked").val();
 
-        if (note.type === 'image') {
+        if (['image', 'canvas', 'mermaid'].includes(note.type)) {
             // there's no benefit to use insert note functionlity for images,
             // so we'll just add an IMG tag
             this.textTypeWidget.addImage(noteId);
diff --git a/src/public/app/widgets/type_widgets/editable_text.js b/src/public/app/widgets/type_widgets/editable_text.js
index d2c601658..48cb041aa 100644
--- a/src/public/app/widgets/type_widgets/editable_text.js
+++ b/src/public/app/widgets/type_widgets/editable_text.js
@@ -368,9 +368,7 @@ export default class EditableTextTypeWidget extends AbstractTextTypeWidget {
             const encodedTitle = encodeURIComponent(note.title);
             const src = `api/images/${note.noteId}/${encodedTitle}`;
 
-            const imageElement = writer.createElement( 'image',  { 'src': src } );
-
-            this.watchdog.editor.model.insertContent(imageElement, this.watchdog.editor.model.document.selection);
+            this.watchdog.editor.execute( 'insertImage', { source: src } );
         } );
     }
 

From 93dcce2217d06a0ae6a3f35848bc638754512159 Mon Sep 17 00:00:00 2001
From: zadam <zadam.apps@gmail.com>
Date: Mon, 27 Nov 2023 10:38:19 +0100
Subject: [PATCH 8/8] dragging notes from note tree will automatically insert
 them as images where appropriate (image, canvas, mermaid)

---
 src/public/app/services/link.js     | 11 +++++++++++
 src/public/app/widgets/note_tree.js |  4 ++--
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/src/public/app/services/link.js b/src/public/app/services/link.js
index 73ad58704..cee987305 100644
--- a/src/public/app/services/link.js
+++ b/src/public/app/services/link.js
@@ -42,6 +42,7 @@ async function createLink(notePath, options = {}) {
     const showNotePath = options.showNotePath === undefined ? false : options.showNotePath;
     const showNoteIcon = options.showNoteIcon === undefined ? false : options.showNoteIcon;
     const referenceLink = options.referenceLink === undefined ? false : options.referenceLink;
+    const autoConvertToImage = options.autoConvertToImage === undefined ? false : options.autoConvertToImage;
 
     const { noteId, parentNoteId } = treeService.getNoteIdAndParentIdFromUrl(notePath);
     const viewScope = options.viewScope || {};
@@ -58,6 +59,16 @@ async function createLink(notePath, options = {}) {
         }
     }
 
+    const note = await froca.getNote(noteId);
+
+    if (autoConvertToImage && ['image', 'canvas', 'mermaid'].includes(note.type) && viewMode === 'default') {
+        const encodedTitle = encodeURIComponent(linkTitle);
+
+        return $("<img>")
+            .attr("src", `api/images/${noteId}/${encodedTitle}?${Math.random()}`)
+            .attr("alt", linkTitle);
+    }
+
     const $container = $("<span>");
 
     if (showNoteIcon) {
diff --git a/src/public/app/widgets/note_tree.js b/src/public/app/widgets/note_tree.js
index ad0d41a87..6f70fc78f 100644
--- a/src/public/app/widgets/note_tree.js
+++ b/src/public/app/widgets/note_tree.js
@@ -402,11 +402,11 @@ export default class NoteTreeWidget extends NoteContextAwareWidget {
                     }));
 
                     if (notes.length === 1) {
-                        linkService.createLink(notes[0].noteId, {referenceLink: true})
+                        linkService.createLink(notes[0].noteId, {referenceLink: true, autoConvertToImage: true})
                             .then($link => data.dataTransfer.setData("text/html", $link[0].outerHTML));
                     }
                     else {
-                        Promise.all(notes.map(note => linkService.createLink(note.noteId, {referenceLink: true}))).then(links => {
+                        Promise.all(notes.map(note => linkService.createLink(note.noteId, {referenceLink: true, autoConvertToImage: true}))).then(links => {
                             const $list = $("<ul>").append(...links.map($link => $("<li>").append($link)));
 
                             data.dataTransfer.setData("text/html", $list[0].outerHTML);