Add a button to create a new note to the dashboard

appinfo/routes.php

@@ -17,7 +17,6 @@
 		'name' => 'page#create',
 		'url' => '/new',
 		'verb' => 'GET',
-		'postfix' => 'new',
 	],
 	[
 		'name' => 'page#index',

lib/AppInfo/SearchProvider.php

@@ -66,7 +66,7 @@ function (Note $note) : SearchResultEntry {
 					'',
 					$note->getTitle(),
 					$excerpt,
-					$this->url->linkToRouteAbsolute('notes.page.index') . 'note/'.$note->getId(),
+					$this->url->linkToRouteAbsolute('notes.page.indexnote', [ 'id' => $note->getId() ]),
 					'icon-notes-trans'
 				);
 			},

lib/Controller/NotesController.php

@@ -95,9 +95,9 @@ public function index(int $pruneBefore = 0) : JSONResponse {
 	 */
 	public function dashboard() : JSONResponse {
 		return $this->helper->handleErrorResponse(function () {
-			$maxItems = 7;
+			$maxItems = 6;
 			$userId = $this->helper->getUID();
-			$notes = $this->notesService->getTopNotes($userId, $maxItems + 1);
+			$notes = $this->notesService->getTopNotes($userId);
 			$hasMoreNotes = count($notes) > $maxItems;
 			$notes = array_slice($notes, 0, $maxItems);
 			$items = array_map(function ($note) {

lib/Controller/PageController.php

@@ -59,7 +59,7 @@ public function index() : TemplateResponse {
 	public function create() : RedirectResponse {
 		$note = $this->notesService->create($this->userSession->getUser()->getUID(), '', '');
 		$note->setContent('');
-		$url = $this->urlGenerator->linkToRoute('notes.page.index', [ 'id' => $note->getId() ]);
-		return new RedirectResponse($url);
+		$url = $this->urlGenerator->linkToRoute('notes.page.indexnote', [ 'id' => $note->getId() ]);
+		return new RedirectResponse($url . '?new');
 	}
 }

lib/Service/NotesService.php

@@ -37,7 +37,7 @@ public function getAll(string $userId) : array {
 		return [ 'notes' => $notes, 'categories' => $data['categories'] ];
 	}
 
-	public function getTopNotes(string $userId, int $count) : array {
+	public function getTopNotes(string $userId) : array {
 		$notes = $this->getAll($userId)['notes'];
 		usort($notes, function (Note $a, Note $b) {
 			$favA = $a->getFavorite();
@@ -48,7 +48,7 @@ public function getTopNotes(string $userId, int $count) : array {
 				return $favA > $favB ? -1 : 1;
 			}
 		});
-		return array_slice($notes, 0, $count);
+		return $notes;
 	}
 
 	public function get(string $userId, int $id) : Note {

src/App.vue

@@ -213,11 +213,12 @@ export default {
 			}
 		},
 
-		routeToNote(noteId, query) {
-			if (this.$route.name !== 'note' || this.$route.params.noteId !== noteId.toString()) {
+		routeToNote(id, query) {
+			const noteId = id.toString()
+			if (this.$route.name !== 'note' || this.$route.params.noteId !== noteId) {
 				this.$router.push({
 					name: 'note',
-					params: { noteId: noteId.toString() },
+					params: { noteId },
 					query,
 				})
 			}
@@ -228,13 +229,13 @@ export default {
 				return
 			}
 			this.loading.create = true
-			createNote(this.filter.category || '')
+			createNote(this.filter.category)
 				.then(note => {
 					this.routeToNote(note.id, { new: null })
 				})
 				.catch(() => {
 				})
-				.then(() => {
+				.finally(() => {
 					this.loading.create = false
 				})
 		},

src/NotesService.js

@@ -179,7 +179,7 @@ export const setTitle = (noteId, title) => {
 
 export const createNote = category => {
 	return axios
-		.post(url('/notes'), { category })
+		.post(url('/notes'), { category: category || '' })
 		.then(response => {
 			_updateLocalNote(response.data)
 			return response.data

src/components/Dashboard.vue

@@ -1,38 +1,40 @@
 <template>
-	<DashboardWidget :items="items"
-		:loading="loading"
-	>
-		<template #default="{ item }">
-			<DashboardWidgetItem
-				:target-url="getItemTargetUrl(item)"
-				:main-text="item.title"
-				:sub-text="subtext(item)"
-			>
-				<template #avatar>
-					<div
-						class="note-item"
-						:class="{ 'note-item-favorite': item.favorite, 'note-item-no-favorites': !hasFavorites }"
-					/>
-				</template>
-			</DashboardWidgetItem>
-		</template>
-		<template #empty-content>
-			<EmptyContent icon="icon-notes">
-				<template #desc>
-					<p class="notes-empty-content-label">
-						{{ t('notes', 'No notes yet') }}
-					</p>
-					<p>
-						<a :href="createNoteUrl" class="button">{{ t('notes', 'New note') }}</a>
-					</p>
-				</template>
-			</EmptyContent>
-		</template>
-	</DashboardWidget>
+	<div class="dashboard-box">
+		<DashboardWidget :items="items" :loading="loading">
+			<template #default="{ item }">
+				<DashboardWidgetItem
+					:target-url="getItemTargetUrl(item)"
+					:main-text="item.title"
+					:sub-text="subtext(item)"
+				>
+					<template #avatar>
+						<div
+							class="note-item"
+							:class="{ 'note-item-favorite': item.favorite, 'note-item-no-favorites': !hasFavorites }"
+						/>
+					</template>
+				</DashboardWidgetItem>
+			</template>
+			<template #empty-content>
+				<EmptyContent icon="icon-notes">
+					<template #desc>
+						<p class="notes-empty-content-label">
+							{{ t('notes', 'No notes yet') }}
+						</p>
+					</template>
+				</EmptyContent>
+			</template>
+		</DashboardWidget>
+		<div v-if="!loading" class="buttons-footer">
+			<a :href="createNoteUrl" class="button">
+				{{ t('notes', 'New note') }}
+			</a>
+		</div>
+	</div>
 </template>
 
 <script>
-import { DashboardWidget, DashboardWidgetItem } from '@nextcloud/vue-dashboard'
+import { DashboardWidget, DashboardWidgetItem } from '@nextcloud/vue-dashboard' // TODO: should be refactored with next release of @nextcloud/vue : https://github.com/nextcloud/nextcloud-vue-dashboard/issues/407
 import { EmptyContent } from '@nextcloud/vue'
 import { generateUrl } from '@nextcloud/router'
 
@@ -51,6 +53,7 @@ export default {
 	data() {
 		return {
 			loading: true,
+			creating: false,
 			items: [],
 			hasMoreItems: false,
 		}
@@ -71,7 +74,7 @@ export default {
 
 		getItemTargetUrl() {
 			return (note) => {
-				return generateUrl('/apps/notes/note/' + note.id)
+				return generateUrl(`/apps/notes/note/${note.id}`)
 			}
 		},
 	},
@@ -90,13 +93,18 @@ export default {
 		},
 
 		subtext(item) {
-			return item.excerpt ? item.excerpt : categoryLabel(item.category)
+			return item.excerpt || categoryLabel(item.category)
 		},
 	},
-
 }
 </script>
+
 <style scoped>
+.dashboard-box {
+	position: relative;
+	height: 100%;
+}
+
 .note-item-favorite {
 	background: var(--icon-star-dark-FC0, var(--icon-star-dark-fc0));
 }
@@ -118,4 +126,11 @@ export default {
 .notes-empty-content-label {
 	margin-bottom: 20px;
 }
+
+.buttons-footer {
+	position: absolute;
+	bottom: 1em;
+	width: 100%;
+	text-align: center;
+}
 </style>