Skip to content

Commit 4412195

Browse files
joachimeichbornjoachimeichborn
committed
Added option to have all categories always visible in the navigation listgit
Signed-off-by: Joachim von Eichborn <joachimeichborn@users.noreply.github.com>
1 parent ce4401c commit 4412195

File tree

7 files changed

+128
-34
lines changed

7 files changed

+128
-34
lines changed

‎l10n/de_DE.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,8 @@ OC.L10N.register(
2020
"File extension for new notes" : "Dateiendung für neue Notizen",
2121
"Display mode for notes" : "Anzeigemodus für Notizen",
2222
"User defined" : "Benutzerdefiniert",
23+
"Always show all categories" : "Immer alle Kategorien anzeigen",
24+
"Collapse categories" : "Kategorien einklappen",
2325
"Open in edit mode" : "Im Bearbeitungsmodus öffnen",
2426
"Open in preview mode" : "Im Vorschaumodus öffnen",
2527
"No notes yet" : "Noch keine Notizen vorhanden",

‎l10n/de_DE.json‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,8 @@
1818
"File extension for new notes" : "Dateiendung für neue Notizen",
1919
"Display mode for notes" : "Anzeigemodus für Notizen",
2020
"User defined" : "Benutzerdefiniert",
21+
"Always show all categories" : "Immer alle Kategorien anzeigen",
22+
"Collapse categories" : "Kategorien einklappen",
2123
"Open in edit mode" : "Im Bearbeitungsmodus öffnen",
2224
"Open in preview mode" : "Im Vorschaumodus öffnen",
2325
"No notes yet" : "Noch keine Notizen vorhanden",

‎lib/Service/SettingsService.php‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@ public function __construct(
4646
return implode(DIRECTORY_SEPARATOR, $path);
4747
},
4848
],
49+
'categoriesMode' => $this->getListAttrs('visible', 'collapsed'),
4950
'noteMode' => $this->getListAttrs('edit', 'preview'),
5051
'customSuffix' => [
5152
'default' => '.txt',

‎src/components/AppSettings.vue‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,16 @@
3232
@change="onChangeSettings"
3333
>
3434
</div>
35+
<div class="settings-block">
36+
<p class="settings-hint">
37+
<label for="categoriesMode">{{ t('notes', 'Display mode for categories') }}</label>
38+
</p>
39+
<select id="categoriesMode" v-model="settings.categoriesMode" @change="onChangeSettings">
40+
<option v-for="mode in categoriesModes" :key="mode.value" :value="mode.value">
41+
{{ mode.label }}
42+
</option>
43+
</select>
44+
</div>
3545
<div class="settings-block">
3646
<p class="settings-hint">
3747
<label for="noteMode">{{ t('notes', 'Display mode for notes') }}</label>
@@ -67,6 +77,10 @@ export default {
6777
{ value: '.md', label: '.md' },
6878
{ value: 'custom', label: t('notes', 'User defined') },
6979
],
80+
categoriesModes: [
81+
{ value: 'visible', label: t('notes', 'Always show all categories') },
82+
{ value: 'collapsed', label: t('notes', 'Collapse categories') },
83+
],
7084
noteModes: [
7185
{ value: 'edit', label: t('notes', 'Open in edit mode') },
7286
{ value: 'preview', label: t('notes', 'Open in preview mode') },

‎src/components/NavigationCategoriesItem.vue‎

Lines changed: 6 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -8,46 +8,27 @@
88
:allow-collapse="true"
99
@click.prevent.stop="onToggleCategories"
1010
>
11-
<AppNavigationItem
12-
:title="t('notes', 'All notes')"
13-
icon="icon-recent"
14-
@click.prevent.stop="onSelectCategory(null)"
15-
>
16-
<AppNavigationCounter slot="counter">
17-
{{ numNotes }}
18-
</AppNavigationCounter>
19-
</AppNavigationItem>
20-
21-
<AppNavigationItem v-for="category in categories"
22-
:key="category.name"
23-
:title="categoryTitle(category.name)"
24-
:icon="category.name === '' ? 'icon-emptyfolder' : 'icon-files'"
25-
@click.prevent.stop="onSelectCategory(category.name)"
26-
>
27-
<AppNavigationCounter slot="counter">
28-
{{ category.count }}
29-
</AppNavigationCounter>
30-
</AppNavigationItem>
11+
<NavigationCategoriesList
12+
:selected-category="selectedCategory"
13+
@category-selected="onSelectCategory"
14+
/>
3115
</AppNavigationItem>
3216
</template>
3317

3418
<script>
3519
import {
3620
AppNavigationItem,
37-
AppNavigationCounter,
3821
} from '@nextcloud/vue'
3922
40-
import { getCategories } from '../NotesService'
4123
import { categoryLabel } from '../Util'
42-
43-
import store from '../store'
24+
import NavigationCategoriesList from './NavigationCategoriesList.vue'
4425
4526
export default {
4627
name: 'NavigationCategoriesItem',
4728
4829
components: {
4930
AppNavigationItem,
50-
AppNavigationCounter,
31+
NavigationCategoriesList,
5132
},
5233
5334
props: {
@@ -64,14 +45,6 @@ export default {
6445
},
6546
6647
computed: {
67-
numNotes() {
68-
return store.getters.numNotes()
69-
},
70-
71-
categories() {
72-
return getCategories(1, true)
73-
},
74-
7548
title() {
7649
return this.selectedCategory === null ? this.t('notes', 'Categories') : categoryLabel(this.selectedCategory)
7750
},

‎src/components/NavigationCategoriesList.vue‎

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
<template>
2+
<Fragment class="app-navigation-noclose separator-below">
3+
<AppNavigationItem
4+
:title="t('notes', 'All notes')"
5+
icon="icon-recent"
6+
:class="{ active: null === selectedCategory }"
7+
@click.prevent.stop="onSelectCategory(null)"
8+
>
9+
<AppNavigationCounter slot="counter">
10+
{{ numNotes }}
11+
</AppNavigationCounter>
12+
</AppNavigationItem>
13+
14+
<AppNavigationItem v-for="category in categories"
15+
:key="category.name"
16+
:title="categoryTitle(category.name)"
17+
:icon="category.name === '' ? 'icon-emptyfolder' : 'icon-files'"
18+
:class="{ active: category.name === selectedCategory }"
19+
@click.prevent.stop="onSelectCategory(category.name)"
20+
>
21+
<AppNavigationCounter slot="counter">
22+
{{ category.count }}
23+
</AppNavigationCounter>
24+
</AppNavigationItem>
25+
26+
<AppNavigationSpacer v-if="showSpacer" class="separator-above" />
27+
</Fragment>
28+
</template>
29+
30+
<script>
31+
import {
32+
AppNavigationItem,
33+
AppNavigationCounter,
34+
AppNavigationSpacer,
35+
} from '@nextcloud/vue'
36+
import { Fragment } from 'vue-fragment'
37+
38+
import { getCategories } from '../NotesService'
39+
import { categoryLabel } from '../Util'
40+
41+
import store from '../store'
42+
43+
export default {
44+
name: 'NavigationCategoriesList',
45+
46+
components: {
47+
Fragment,
48+
AppNavigationItem,
49+
AppNavigationCounter,
50+
AppNavigationSpacer,
51+
},
52+
53+
props: {
54+
selectedCategory: {
55+
type: String,
56+
default: null,
57+
},
58+
showSpacer: {
59+
type: Boolean,
60+
default: false,
61+
},
62+
},
63+
64+
computed: {
65+
numNotes() {
66+
return store.getters.numNotes()
67+
},
68+
69+
categories() {
70+
return getCategories(1, true)
71+
},
72+
},
73+
74+
methods: {
75+
categoryTitle(category) {
76+
return categoryLabel(category)
77+
},
78+
79+
onSelectCategory(category) {
80+
this.$emit('category-selected', category)
81+
},
82+
},
83+
}
84+
</script>
85+
<style scoped>
86+
.separator-above {
87+
border-top: 1px solid var(--color-border);
88+
}
89+
</style>

‎src/components/NavigationList.vue‎

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,18 @@
22
<Fragment>
33
<!-- collapsible categories -->
44
<NavigationCategoriesItem
5-
v-if="numNotes"
5+
v-if="numNotes && showCollapsed"
66
:selected-category="category"
77
@category-selected="$emit('category-selected', $event)"
88
/>
99

10+
<NavigationCategoriesList
11+
v-if="numNotes && !showCollapsed"
12+
:selected-category="category"
13+
:show-spacer="true"
14+
@category-selected="$emit('category-selected', $event)"
15+
/>
16+
1017
<!-- list of notes -->
1118
<template v-for="item in noteItems">
1219
<AppNavigationCaption v-if="category!==null && category!==item.category"
@@ -45,6 +52,7 @@ import { Fragment } from 'vue-fragment'
4552
4653
import { categoryLabel } from '../Util'
4754
import NavigationCategoriesItem from './NavigationCategoriesItem'
55+
import NavigationCategoriesList from './NavigationCategoriesList'
4856
import NavigationNoteItem from './NavigationNoteItem'
4957
import store from '../store'
5058
@@ -58,6 +66,7 @@ export default {
5866
AppNavigationItem,
5967
Fragment,
6068
NavigationCategoriesItem,
69+
NavigationCategoriesList,
6170
NavigationNoteItem,
6271
},
6372
@@ -86,6 +95,10 @@ export default {
8695
},
8796
8897
computed: {
98+
showCollapsed() {
99+
return store.state.app.settings.categoriesMode === 'collapsed'
100+
},
101+
89102
numNotes() {
90103
return store.getters.numNotes()
91104
},

0 commit comments

Comments
 (0)