new import dialog

src/public/javascripts/dialogs/import.js

@@ -0,0 +1,30 @@
+import treeService from '../services/tree.js';
+import exportService from "../services/export.js";
+import treeUtils from "../services/tree_utils.js";
+
+const $dialog = $("#import-dialog");
+const $form = $("#import-form");
+const $noteTitle = $dialog.find(".note-title");
+
+async function showDialog() {
+    glob.activeDialog = $dialog;
+
+    const currentNode = treeService.getCurrentNode();
+    $noteTitle.text(await treeUtils.getNoteTitle(currentNode.data.noteId));
+
+    $dialog.modal();
+}
+
+$form.submit(() => {
+    const currentNode = treeService.getCurrentNode();
+
+    exportService.importIntoNote(currentNode.data.noteId).then(() => {
+        $dialog.modal('hide');
+    });
+
+    return false;
+});
+
+export default {
+    showDialog
+}

src/public/javascripts/services/export.js

@@ -3,29 +3,21 @@ import protectedSessionHolder from './protected_session_holder.js';
 import utils from './utils.js';
 import server from './server.js';
 
+const $fileUploadInput = $("#import-file-upload-input");
+
 function exportBranch(branchId, type, format) {
     const url = utils.getHost() + `/api/notes/${branchId}/export/${type}/${format}?protectedSessionId=` + encodeURIComponent(protectedSessionHolder.getProtectedSessionId());
 
-    console.log(url);
-
     utils.download(url);
 }
 
-let importNoteId;
-
-function importIntoNote(noteId) {
-    importNoteId = noteId;
-
-    $("#import-upload").trigger('click');
-}
-
-$("#import-upload").change(async function() {
+async function importIntoNote(importNoteId) {
     const formData = new FormData();
-    formData.append('upload', this.files[0]);
+    formData.append('upload', $fileUploadInput[0].files[0]);
 
     // this is done to reset the field otherwise triggering import same file again would not work
     // https://github.com/zadam/trilium/issues/388
-    $("#import-upload").val('');
+    $fileUploadInput.val('');
 
     await $.ajax({
         url: baseApiUrl + 'notes/' + importNoteId + '/import',
@@ -46,7 +38,7 @@ $("#import-upload").change(async function() {
                 node.setExpanded(true);
             }
         });
-});
+}
 
 export default {
     exportBranch,

src/public/javascripts/services/tree_context_menu.js

@@ -1,12 +1,12 @@
 import treeService from './tree.js';
 import cloningService from './cloning.js';
-import exportService from './export.js';
 import messagingService from './messaging.js';
 import protectedSessionService from './protected_session.js';
 import treeChangesService from './branches.js';
 import treeUtils from './tree_utils.js';
 import branchPrefixDialog from '../dialogs/branch_prefix.js';
 import exportDialog from '../dialogs/export.js';
+import importDialog from '../dialogs/import.js';
 import infoService from "./info.js";
 import treeCache from "./tree_cache.js";
 import syncService from "./sync.js";
@@ -95,7 +95,7 @@ const contextMenuItems = [
     {title: "Paste after", cmd: "pasteAfter", uiIcon: "clipboard"},
     {title: "----"},
     {title: "Export", cmd: "export", uiIcon: "arrow-up-right"},
-    {title: "Import into note (tar, opml, md, enex)", cmd: "importIntoNote", uiIcon: "arrow-down-left"},
+    {title: "Import into note", cmd: "importIntoNote", uiIcon: "arrow-down-left"},
     {title: "----"},
     {title: "Collapse subtree <kbd>Alt+-</kbd>", cmd: "collapseSubtree", uiIcon: "align-justify"},
     {title: "Force note sync", cmd: "forceNoteSync", uiIcon: "refresh"},
@@ -180,7 +180,7 @@ function selectContextMenuItem(event, cmd) {
         exportDialog.showDialog("subtree");
     }
     else if (cmd === "importIntoNote") {
-        exportService.importIntoNote(node.data.noteId);
+        importDialog.showDialog();
     }
     else if (cmd === "collapseSubtree") {
         treeService.collapseTree(node);

src/routes/api/image.js

@@ -21,7 +21,7 @@ async function returnImage(req, res) {
 
     res.set('Content-Type', image.mime);
 
-    res.send((await note.getNoteContent()).content);
+    res.send(await image.getContent());
 }
 
 async function uploadImage(req) {

src/services/import/tar.js

@@ -33,11 +33,6 @@ async function importTar(fileBuffer, importRootNote) {
             return "";
         }
 
-        // we allow references to root and they don't need translation
-        if (origNoteId === 'root') {
-            return origNoteId;
-        }
-
         if (!noteIdMap[origNoteId]) {
             noteIdMap[origNoteId] = utils.newEntityId();
         }

src/views/desktop.ejs

@@ -99,8 +99,6 @@
             <a id="toggle-search-button" title="Search in notes. Shortcut CTRL+S" class="icon-action jam jam-search"></a>
         </div>
 
-        <input type="file" id="import-upload" style="display: none" />
-
         <div id="search-box">
             <div style="display: flex; align-items: center; flex-wrap: wrap;">
                 <input name="search-text" id="search-text" placeholder="Search text, labels" style="flex-grow: 100; margin-left: 5px; margin-right: 5px; flex-basis: 5em; min-width: 0;" autocomplete="off">
@@ -215,6 +213,7 @@
     <% include dialogs/branch_prefix.ejs %>
     <% include dialogs/event_log.ejs %>
     <% include dialogs/export.ejs %>
+    <% include dialogs/import.ejs %>
     <% include dialogs/jump_to_note.ejs %>
     <% include dialogs/markdown_import.ejs %>
     <% include dialogs/note_revisions.ejs %>

src/views/dialogs/export.ejs

@@ -59,7 +59,7 @@
                     </div>
                 </div>
                 <div class="modal-footer">
-                    <button class="btn btn-primary btn-sm">Export</button>
+                    <button class="btn btn-primary">Export</button>
                 </div>
             </form>
         </div>

src/views/dialogs/import.ejs

@@ -0,0 +1,37 @@
+<div id="import-dialog" class="modal fade mx-auto" tabindex="-1" role="dialog">
+    <div class="modal-dialog modal-lg" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title">Import into note</h5>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+            </div>
+            <form id="import-form">
+                <div class="modal-body">
+                    <div class="form-group">
+                        <label for="import-file-upload-input"><strong>Choose import file</strong></label>
+
+                        <input type="file" id="import-file-upload-input" class="form-control-file" />
+
+                        <p>File will be imported as child note(s) into <strong class="note-title"></strong>. Import file must be of supported type and have correct extension - one of <code>.html</code>, <code>.md</code>, <code>.tar</code>, <code>.enex</code>.</p>
+                    </div>
+
+                    <div class="form-group">
+                        <div class="checkbox">
+                            <label>
+                                <input id="safe-import" value="1" type="checkbox" checked> <strong>Safe import</strong>
+                            </label>
+
+                            <br/>
+                            Trilium <code>.tar</code> export files can contain executable scripts which may contain harmful behavior. Safe import will deactivate automatic execution of all imported scripts. Uncheck "Safe import" only if the imported tar archive is supposed to contain executable scripts and you completely trust the contents of the import file.
+                        </div>
+                    </div>
+                </div>
+                <div class="modal-footer">
+                    <button class="btn btn-primary">Import</button>
+                </div>
+            </form>
+        </div>
+    </div>
+</div>