From fde676cc82cff135d5aafca28f221437117ca825 Mon Sep 17 00:00:00 2001
From: Enjeck C <patrathewhiz@gmail.com>
Date: Sun, 27 Apr 2025 09:51:49 +0100
Subject: [PATCH] feat: Toggle notes list sidebar

Signed-off-by: Enjeck C <patrathewhiz@gmail.com>
---
 src/components/CategoriesList.vue | 12 ++++++++++++
 src/components/NotesView.vue      |  6 ++++--
 src/store/app.js                  |  8 ++++++++
 3 files changed, 24 insertions(+), 2 deletions(-)

diff --git a/src/components/CategoriesList.vue b/src/components/CategoriesList.vue
index 94cbaa9c8..44b210f45 100644
--- a/src/components/CategoriesList.vue
+++ b/src/components/CategoriesList.vue
@@ -5,6 +5,9 @@
 
 <template>
 	<Fragment>
+		<NcButton @click="onToggleNotesList">
+			{{ t('notes', 'Toggle Notes List') }}
+		</NcButton>
 		<NcAppNavigationItem
 			:name="t('notes', 'All notes')"
 			:class="{ active: selectedCategory === null }"
@@ -47,6 +50,7 @@ import {
 	NcAppNavigationItem,
 	NcAppNavigationCaption,
 	NcCounterBubble,
+	NcButton,
 } from '@nextcloud/vue'
 import { Fragment } from 'vue-frag'
 
@@ -65,6 +69,7 @@ export default {
 		Fragment,
 		NcAppNavigationItem,
 		NcAppNavigationCaption,
+		NcButton,
 		NcCounterBubble,
 		FolderIcon,
 		FolderOutlineIcon,
@@ -83,9 +88,16 @@ export default {
 		selectedCategory() {
 			return store.getters.getSelectedCategory()
 		},
+		toggleNotesList() {
+			return store.getters.getToggleNotesList()
+		},
 	},
 
 	methods: {
+		onToggleNotesList() {
+			store.commit('setToggleNotesList', !this.toggleNotesList)
+		},
+
 		categoryTitle(category) {
 			return categoryLabel(category)
 		},
diff --git a/src/components/NotesView.vue b/src/components/NotesView.vue
index f4b5dbe04..5176446d7 100644
--- a/src/components/NotesView.vue
+++ b/src/components/NotesView.vue
@@ -6,7 +6,7 @@
 <template>
 	<NcAppContent pane-config-key="note" :show-details="showNote" @update:showDetails="hideNote">
 		<template slot="list">
-			<NcAppContentList class="content-list">
+			<NcAppContentList v-if="!showNotesList" class="content-list">
 				<div class="content-list__search">
 					<NcTextField
 						:value.sync="searchText"
@@ -59,7 +59,6 @@
 </template>
 
 <script>
-
 import {
 	NcAppContent,
 	NcAppContentList,
@@ -131,6 +130,9 @@ export default {
 				return this.filteredNotes
 			}
 		},
+		showNotesList() {
+			return store.state.app.toggleNotesList
+		},
 
 		// group notes by time ("All notes") or by category (if category chosen)
 		groupedNotes() {
diff --git a/src/store/app.js b/src/store/app.js
index f95536b68..406804273 100644
--- a/src/store/app.js
+++ b/src/store/app.js
@@ -11,9 +11,13 @@ const state = {
 	isManualSave: false,
 	documentTitle: null,
 	searchText: '',
+	toggleNotesList: false,
 }
 
 const getters = {
+	getToggleNotesList: (state) => () => {
+		return state.toggleNotesList
+	},
 }
 
 const mutations = {
@@ -40,6 +44,10 @@ const mutations = {
 	updateSearchText(state, searchText) {
 		state.searchText = searchText
 	},
+
+	setToggleNotesList(state, value) {
+		state.toggleNotesList = value
+	},
 }
 
 const actions = {