edit mode

src/components/nav_panel/nav_panel.js

@@ -4,6 +4,7 @@ import { TIMELINES, ROOT_ITEMS } from 'src/components/navigation/navigation.js'
 import { getListEntries, filterNavigation } from 'src/components/navigation/filter.js'
 import NavigationEntry from 'src/components/navigation/navigation_entry.vue'
 import NavigationPins from 'src/components/navigation/navigation_pins.vue'
+import Checkbox from 'src/components/checkbox/checkbox.vue'
 
 import { library } from '@fortawesome/fontawesome-svg-core'
 import {
@@ -34,16 +35,18 @@ library.add(
   faList
 )
 const NavPanel = {
-  props: ['forceExpand'],
+  props: ['forceExpand', 'forceEditMode'],
   created () {
   },
   components: {
     ListsMenuContent,
     NavigationEntry,
-    NavigationPins
+    NavigationPins,
+    Checkbox
   },
   data () {
     return {
+      editMode: false,
       showTimelines: false,
       showLists: false,
       timelinesList: Object.entries(TIMELINES).map(([k, v]) => ({ ...v, name: k })),
@@ -57,6 +60,9 @@ const NavPanel = {
     toggleLists () {
       this.showLists = !this.showLists
     },
+    toggleEditMode () {
+      this.editMode = !this.editMode
+    },
     toggleCollapse () {
       this.$store.commit('setPreference', { path: 'simple.collapseNav', value: !this.collapsed })
       this.$store.dispatch('pushServerSideStorage')

src/components/nav_panel/nav_panel.vue

@@ -46,7 +46,7 @@
               <NavigationEntry
                 v-for="item in timelinesItems"
                 :key="item.name"
-                :show-pin="true"
+                :show-pin="editMode"
                 :item="item"
               />
             </ul>
@@ -83,7 +83,7 @@
             class="timelines-background"
           >
             <ListsMenuContent
-              :show-pin="true"
+              :show-pin="editMode"
               class="timelines"
             />
           </div>
@@ -91,9 +91,17 @@
         <NavigationEntry
           v-for="item in rootItems"
           :key="item.name"
-          :show-pin="true"
+          :show-pin="editMode || forceEditMode"
           :item="item"
         />
+        <div
+          v-if="!forceEditMode"
+          class="panel-footer"
+        >
+          <Checkbox v-model="editMode">
+            {{ $t('nav.edit_pinned') }}
+          </Checkbox>
+        </div>
       </ul>
     </div>
   </div>