fix: update tab behavior to keep one open at all times (#205)

fix #204

src/index.html

@@ -121,12 +121,14 @@ <h4>❤️&nbsp;Support the project</h4>
         <li role="presentation" data-bind="css: {active : $data.isActive}">
           <a href="#" data-bind="click: $parent.activateTab">
             <span data-bind="text: $data.name"></span>
-            <button
-              type="button"
-              class="btn btn-xs btn-danger"
-              data-bind="click: $parent.removeTab, clickBubble: false">
-              <span class="glyphicon glyphicon-remove"></span>
-            </button>
+            <span data-bind="visible: $data.showRemoveTabButton">
+              <button
+                type="button"
+                class="btn btn-xs btn-danger"
+                data-bind="click: $parent.removeTab, clickBubble: false">
+                <span class="glyphicon glyphicon-remove"></span>
+              </button>
+            </span>
           </a>
         </li>
         <!-- /ko -->

src/js/app.js

@@ -844,6 +844,13 @@ requirejs(
 
       const newTab = () => {
         const newTabContext = new TabContextVm(++tabCounter)
+        if (tabContexts().length === 0) {
+          newTabContext.showRemoveTabButton(false)
+        }
+        if (tabContexts().length === 1) {
+          const prevTabContext = tabContexts()[0]
+          prevTabContext.showRemoveTabButton(true)
+        }
         tabContexts.push(newTabContext)
         _activateTab(newTabContext)
       }
@@ -855,6 +862,11 @@ requirejs(
           _activateTab(tabContexts()[Math.abs(tabToRemoveIndex - 1)])
         }
         tabContexts.remove(tab)
+
+        if (tabContexts().length === 1) {
+          const lastTab = tabContexts()[0]
+          lastTab.showRemoveTabButton(false)
+        }
       }
 
       const enableSaveButton = () => {

src/js/app/components/bookmarks/bookmarks_view.html

@@ -134,7 +134,6 @@
         Remove
         <i class="glyphicon glyphicon-trash pull-right"></i>
       </li>
-      <li class="list-group-item ctx-menu-item"></li>
     </ul>
   </div>
 

src/js/app/tabContextVm.js

@@ -13,6 +13,7 @@ define(['knockout', 'app/bookmarkSelectedVm'], function (
     this.bookmarkSelected = new BookmarkSelectedVm()
 
     this.isActive = ko.observable(false)
+    this.showRemoveTabButton = ko.observable(true)
 
     this.reset = () => {
       this.request = {}