diff --git a/src/public/app/services/hoisted_note.js b/src/public/app/services/hoisted_note.js
index e8822ecf3..334df930d 100644
--- a/src/public/app/services/hoisted_note.js
+++ b/src/public/app/services/hoisted_note.js
@@ -1,6 +1,7 @@
 import options from './options.js';
 import appContext from "./app_context.js";
 import treeService from "./tree.js";
+import treeCache from "./tree_cache.js";
 
 function getHoistedNoteId() {
     return options.get('hoistedNoteId');
@@ -9,6 +10,8 @@ function getHoistedNoteId() {
 async function setHoistedNoteId(noteId) {
     await options.save('hoistedNoteId', noteId);
 
+    await treeCache.loadInitialTree();
+
     // FIXME - just use option load event
     appContext.triggerEvent('hoistedNoteChanged', {noteId});
 }
diff --git a/src/public/app/widgets/attribute_list.js b/src/public/app/widgets/attribute_list.js
index 854882ffd..b553873e7 100644
--- a/src/public/app/widgets/attribute_list.js
+++ b/src/public/app/widgets/attribute_list.js
@@ -207,7 +207,7 @@ export default class AttributeListWidget extends TabAwareWidget {
 
     async renderInheritedAttributes(attributes, $container) {
         for (const attribute of attributes) {
-            const $attr = await attributeRenderer.renderAttribute(attribute, false)
+            const $attr = (await attributeRenderer.renderAttribute(attribute, false))
                 .on('click', e => this.attributeDetailWidget.showAttributeDetail({
                     attribute: {
                         noteId: attribute.noteId,
diff --git a/src/public/app/widgets/note_tree.js b/src/public/app/widgets/note_tree.js
index b2406daef..25f591cb1 100644
--- a/src/public/app/widgets/note_tree.js
+++ b/src/public/app/widgets/note_tree.js
@@ -32,7 +32,7 @@ const TPL = `
     .tree {
         height: 100%;
         overflow: auto;
-        padding-bottom: 20px;
+        padding-bottom: 35px;
     }
     
     .refresh-search-button {
@@ -464,9 +464,11 @@ export default class NoteTreeWidget extends TabAwareWidget {
                     && node.data.noteId === hoistedNoteService.getHoistedNoteId()
                     && $span.find('.unhoist-button').length === 0) {
 
-                    const unhoistButton = $('<span>&nbsp; (<a class="unhoist-button">unhoist</a>)</span>');
+                    const unhoistButton = $('<span class="unhoist-button-wrapper" title="Unhoist current note to show the whole note tree">[<a class="unhoist-button">unhoist</a>]</span>');
 
-                    $span.append(unhoistButton);
+                    // prepending since appending could push out (when note title is too long)
+                    // the button too much to the right so that it's not visible
+                    $span.prepend(unhoistButton);
                 }
 
                 const note = await treeCache.getNote(node.data.noteId);
diff --git a/src/public/stylesheets/style.css b/src/public/stylesheets/style.css
index 259f0e69e..91556c525 100644
--- a/src/public/stylesheets/style.css
+++ b/src/public/stylesheets/style.css
@@ -540,6 +540,11 @@ div[data-notify="container"] {
     padding: 2px;
 }
 
+.unhoist-button-wrapper {
+    position: relative;
+    top: -4px;
+}
+
 .unhoist-button {
     text-decoration: underline !important;
     color: var(--link-color) !important;