enh(Whatsnew): Add a changelog-style whatsnew modal

Signed-off-by: Marcel Klehr <mklehr@gmx.net>

lib/Controller/SettingsController.php

@@ -224,4 +224,31 @@ class SettingsController extends ApiController {
 	public function setBackupPath(string $backupPath): JSONResponse {
 		return $this->setSetting('backup.filePath', $backupPath);
 	}
+
+	/**
+	 * get hasSeenWhatsnew
+	 *
+	 * @return JSONResponse
+	 *
+	 * @NoAdminRequired
+	 */
+	public function getWhatsnew(): JSONResponse {
+		return $this->getSetting(
+			'hasSeenWhatsnew',
+			'hasSeenWhatsnew',
+			'0'
+		);
+	}
+
+	/**
+	 * set hasSeenWhatsnew
+	 *
+	 * @param string $hasSeenWhatsnew
+	 * @return JSONResponse
+	 *
+	 * @NoAdminRequired
+	 */
+	public function setWhatsnew(string $hasSeenWhatsnew): JSONResponse {
+		return $this->setSetting('hasSeenWhatsnew', $hasSeenWhatsnew);
+	}
 }

lib/Controller/WebViewController.php

@@ -116,7 +116,7 @@ class WebViewController extends Controller {
 		$this->initialState->provideInitialState($this->appName, 'folders', $this->folderController->getFolders()->getData()['data']);
 
 		$settings = [];
-		foreach (['sorting', 'viewMode'] as $setting) {
+		foreach (['sorting', 'viewMode', 'hasSeenWhatsnew'] as $setting) {
 			$settings[$setting] = $this->config->getUserValue($this->userId, $this->appName, $setting);
 		}
 		$this->initialState->provideInitialState($this->appName, 'settings', $settings);

src/components/ViewPrivate.vue

@@ -22,6 +22,7 @@
 		<CopyDialog />
 		<LoadingModal />
 		<BookmarkContent />
+		<WhatsnewModal />
 	</NcContent>
 </template>
 
@@ -39,6 +40,7 @@ import { privateRoutes } from '../router.js'
 import { actions, mutations } from '../store/index.js'
 import LoadingModal from './LoadingModal.vue'
 import BookmarkContent from './BookmarkContent.vue'
+import WhatsnewModal from './WhatsnewModal.vue'
 import { getCurrentUser } from '@nextcloud/auth'
 
 export default {
@@ -56,12 +58,14 @@ export default {
 		SidebarFolder,
 		MoveDialog,
 		CopyDialog,
+		WhatsnewModal,
 	},
 	data() {
 		return {
 			newBookmark: false,
 			showDetails: false,
 			smallScreen: false,
+			showWhatsnew: false,
 		}
 	},
 	computed: {

src/components/WhatsnewModal.vue

@@ -0,0 +1,61 @@
+<!--
+  - Copyright (c) 2021 Artem Lavrukhin <lavryha4590@gmail.com>
+  -
+  - This file is licensed under the Affero General Public License version 3 or later. See the COPYING file.
+  -->
+
+<template>
+	<NcModal v-if="showModal" :title="t('bookmarks', `What's new?`)" @close="onClose">
+		<div class="whatsnew">
+			<h3>✨ {{ t('bookmarks', 'What\'s new in Bookmarks?') }}</h3>
+			<ul>
+				<li>📜 Support for javascript and file links</li>
+				<li>📂 Bookmarklet now allows putting new bookmarks in a certain folder by default<br><small>(by first navigating to the folder and then dragging the bookmarklet button to your bookmarks as usual)</small></li>
+				<li>🖊 Edit the title of shared folders even if you don't have edit permissions</li>
+				<li>🐛 Lots of small bug fixes</li>
+			</ul>
+		</div>
+	</NcModal>
+</template>
+<script>
+import { NcModal } from '@nextcloud/vue'
+import { actions } from '../store/index.js'
+import packageJson from '../../package.json'
+
+export default {
+	name: 'WhatsnewModal',
+	components: {
+		NcModal,
+	},
+	computed: {
+		showModal() {
+			return this.$store.state.settings.hasSeenWhatsnew !== packageJson.version
+		},
+	},
+	methods: {
+		onClose() {
+			this.$store.dispatch(actions.SET_SETTING, {
+				key: 'hasSeenWhatsnew',
+				value: packageJson.version,
+			})
+		},
+	},
+}
+</script>
+<style>
+.whatsnew {
+	min-width: 300px;
+	overflow-y: scroll;
+	padding: 30px;
+}
+
+.whatsnew li {
+	font-size: 1.3em;
+	margin-bottom: 15px;
+}
+
+.whatsnew h3 {
+	font-size: 2em;
+	margin-bottom: 25px;
+}
+</style>

src/store/index.js

@@ -49,6 +49,7 @@ export default {
 			limit: 0,
 			backupPath: '',
 			backupEnabled: '1',
+			hasSeenWhatsnew: '',
 		},
 		bookmarks: [],
 		bookmarksById: {},