Bump version to 1.1.2

Signed-off-by: Julius Härtl <jus@bitgrid.net>

.drone.yml

@@ -5,7 +5,7 @@ steps:
   image: nextcloudci/php7.3:latest
   environment:
     APP_NAME: deck
-    CORE_BRANCH: master
+    CORE_BRANCH: stable20
     DB: sqlite
   commands:
     # Pre-setup steps
@@ -20,7 +20,7 @@ steps:
   image: nextcloudci/php7.2:latest
   environment:
     APP_NAME: deck
-    CORE_BRANCH: master
+    CORE_BRANCH: stable20
     DB: sqlite
   commands:
     - composer install
@@ -29,7 +29,7 @@ steps:
   image: nextcloudci/php7.3:php7.3-2
   environment:
     APP_NAME: deck
-    CORE_BRANCH: master
+    CORE_BRANCH: stable20
     DB: sqlite
   commands:
     - composer install
@@ -38,7 +38,7 @@ steps:
   image: nextcloudci/php7.4:latest
   environment:
       APP_NAME: deck
-      CORE_BRANCH: master
+      CORE_BRANCH: stable20
       DB: sqlite
   commands:
       - composer install
@@ -58,7 +58,7 @@ steps:
     image: nextcloudci/php7.3:latest
     environment:
       APP_NAME: deck
-      CORE_BRANCH: master
+      CORE_BRANCH: stable20
       DB: sqlite
     commands:
       # Pre-setup steps
@@ -84,7 +84,7 @@ steps:
     image: nextcloudci/php7.4:latest
     environment:
       APP_NAME: deck
-      CORE_BRANCH: master
+      CORE_BRANCH: stable20
       DB: sqlite
     commands:
       # Pre-setup steps
@@ -111,7 +111,7 @@ steps:
     image: nextcloudci/php7.3:latest
     environment:
       APP_NAME: deck
-      CORE_BRANCH: master
+      CORE_BRANCH: stable20
       DB: sqlite
     commands:
       # Pre-setup steps

.travis.yml

@@ -2,9 +2,13 @@ language: php
 services:
     - mysql
 php:
+    - 7.2
     - 7.3
+    - 7.4
 env:
-    - CORE_BRANCH=master DB=mysql
+    - CORE_BRANCH=stable20 DB=mysql
+    - CORE_BRANCH=stable19 DB=mysql
+    - CORE_BRANCH=stable18 DB=mysql
 
 matrix:
   include:
@@ -17,10 +21,13 @@ before_install:
     - wget https://raw.githubusercontent.com/nextcloud/travis_ci/master/before_install.sh
     - bash ./before_install.sh deck $CORE_BRANCH $DB
     - cd ../server
-    - ./occ app:enable deck
 
 before_script:
     - cd apps/deck
+    - composer install --no-dev
+    - cd ../../
+    - ./occ app:enable deck
+    - cd apps/deck
 
 script:
     - composer install

CHANGELOG.md

@@ -1,6 +1,27 @@
 # Changelog
 All notable changes to this project will be documented in this file.
 
+## 1.1.2 - 2020-10-14
+
+### Bugfixes
+
+* [#2436](https://github.com/nextcloud/deck/pull/2436) Move most destructive actions in drop down menus to the bottom
+* [#2438](https://github.com/nextcloud/deck/pull/2438) Fix scrollable titles with Dyslexia font
+* [#2439](https://github.com/nextcloud/deck/pull/2439) Only remove card padding for editable cards
+* [#2442](https://github.com/nextcloud/deck/pull/2442) Move navigation toggle handling to @nextcloud/vue native one
+* [#2443](https://github.com/nextcloud/deck/pull/2443) Do not open the dialog automatically upon card creation, only upon click
+
+## 1.1.1 - 2020-10-13
+
+### Bugfixes
+
+* [#2364](https://github.com/nextcloud/deck/pull/2364) Use uid instead of displayname for sharee results
+* [#2365](https://github.com/nextcloud/deck/pull/2365) Comments do not depend on the comments app (@jakobroehrl)
+* [#2395](https://github.com/nextcloud/deck/pull/2395) Fix failure if full text search app was enabled
+* [#2396](https://github.com/nextcloud/deck/pull/2396) Also exclude deleted items from calendar boards
+* [#2425](https://github.com/nextcloud/deck/pull/2425) Fix filter popover styling (@Flamenco)
+* [#2432](https://github.com/nextcloud/deck/pull/2432) Properly handle multiple shares in a row and refactor sharee loading
+
 ## 1.1.0 - 2020-10-03
 
 ### Features

appinfo/info.xml

@@ -17,7 +17,7 @@
 - 🚀 Get your project organized
 
 </description>
-    <version>1.1.0</version>
+    <version>1.1.2</version>
     <licence>agpl</licence>
     <author>Julius Härtl</author>
     <namespace>Deck</namespace>
@@ -36,7 +36,7 @@
         <database min-version="9.4">pgsql</database>
         <database>sqlite</database>
         <database min-version="5.5">mysql</database>
-        <nextcloud min-version="18" max-version="21" />
+        <nextcloud min-version="18" max-version="20" />
     </dependencies>
     <background-jobs>
         <job>OCA\Deck\Cron\DeleteCron</job>

lib/Db/BoardMapper.php

@@ -97,13 +97,13 @@ class BoardMapper extends DeckMapper implements IPermissionMapper {
 		// FIXME: One moving to QBMapper we should allow filtering the boards probably by method chaining for additional where clauses
 		$sql = 'SELECT id, title, owner, color, archived, deleted_at, 0 as shared, last_modified FROM `*PREFIX*deck_boards` WHERE owner = ? AND last_modified > ?';
 		if (!$includeArchived) {
-			$sql .= ' AND NOT archived';
+			$sql .= ' AND NOT archived AND deleted_at = 0';
 		}
 		$sql .= ' UNION ' .
 			'SELECT boards.id, title, owner, color, archived, deleted_at, 1 as shared, last_modified FROM `*PREFIX*deck_boards` as boards ' .
 			'JOIN `*PREFIX*deck_board_acl` as acl ON boards.id=acl.board_id WHERE acl.participant=? AND acl.type=? AND boards.owner != ? AND last_modified > ?';
 		if (!$includeArchived) {
-			$sql .= ' AND NOT archived';
+			$sql .= ' AND NOT archived AND deleted_at = 0';
 		}
 		$entries = $this->findEntities($sql, [$userId, $since, $userId, Acl::PERMISSION_TYPE_USER, $userId, $since], $limit, $offset);
 		/* @var Board $entry */
@@ -142,7 +142,7 @@ class BoardMapper extends DeckMapper implements IPermissionMapper {
 		}
 		$sql .= ')';
 		if (!$includeArchived) {
-			$sql .= ' AND NOT archived';
+			$sql .= ' AND NOT archived AND deleted_at = 0';
 		}
 		$entries = $this->findEntities($sql, array_merge([$userId, Acl::PERMISSION_TYPE_GROUP], $groups), $limit, $offset);
 		/* @var Board $entry */
@@ -174,7 +174,7 @@ class BoardMapper extends DeckMapper implements IPermissionMapper {
 		}
 		$sql .= ')';
 		if (!$includeArchived) {
-			$sql .= ' AND NOT archived';
+			$sql .= ' AND NOT archived AND deleted_at = 0';
 		}
 		$entries = $this->findEntities($sql, array_merge([$userId, Acl::PERMISSION_TYPE_CIRCLE], $circles), $limit, $offset);
 		/* @var Board $entry */

lib/Event/FTSEvent.php

@@ -42,7 +42,7 @@ class FTSEvent extends Event {
 	}
 
 	public function getArgument($key) {
-		if ($this->hasArgument($key)) {
+		if (isset($this->arguments[$key])) {
 			return $this->arguments[$key];
 		}
 

package.json

@@ -33,30 +33,30 @@
 		"@juliushaertl/vue-richtext": "^0.3.3",
 		"@nextcloud/auth": "^1.3.0",
 		"@nextcloud/axios": "^1.4.0",
-		"@nextcloud/dialogs": "^2.0.1",
+		"@nextcloud/dialogs": "^3.0.0",
 		"@nextcloud/event-bus": "^1.2.0",
 		"@nextcloud/files": "^1.1.0",
-		"@nextcloud/initial-state": "^1.1.2",
+		"@nextcloud/initial-state": "^1.2.0",
 		"@nextcloud/l10n": "^1.4.1",
 		"@nextcloud/moment": "^1.1.1",
 		"@nextcloud/router": "^1.2.0",
-		"@nextcloud/vue": "^2.6.8",
+		"@nextcloud/vue": "^2.7.0",
 		"@nextcloud/vue-dashboard": "^1.0.1",
 		"blueimp-md5": "^2.18.0",
 		"dompurify": "^2.1.1",
 		"lodash": "^4.17.20",
 		"markdown-it": "^11.0.1",
 		"markdown-it-task-lists": "^2.1.1",
-		"moment": "^2.29.0",
+		"moment": "^2.29.1",
 		"nextcloud-vue-collections": "^0.8.1",
 		"p-queue": "^6.6.1",
 		"url-search-params-polyfill": "^8.1.0",
 		"vue": "^2.6.12",
 		"vue-at": "^2.5.0-beta.2",
 		"vue-click-outside": "^1.1.0",
-		"vue-easymde": "^1.2.2",
+		"vue-easymde": "^1.3.0",
 		"vue-infinite-loading": "^2.4.5",
-		"vue-router": "^3.4.4",
+		"vue-router": "^3.4.6",
 		"vue-smooth-dnd": "^0.8.1",
 		"vuex": "^3.5.1",
 		"vuex-router-sync": "^5.0.0"
@@ -73,44 +73,44 @@
 		"@babel/preset-env": "^7.11.5",
 		"@nextcloud/browserslist-config": "^1.0.0",
 		"@nextcloud/eslint-config": "^2.1.0",
-		"@nextcloud/eslint-plugin": "^1.4.0",
+		"@nextcloud/eslint-plugin": "^1.5.0",
 		"@nextcloud/webpack-vue-config": "^1.4.1",
 		"@vue/test-utils": "^1.1.0",
-		"acorn": "^8.0.1",
+		"acorn": "^8.0.4",
 		"babel-eslint": "^10.1.0",
-		"babel-jest": "^26.3.0",
+		"babel-jest": "^26.5.2",
 		"babel-loader": "^8.1.0",
 		"css-loader": "^4.3.0",
 		"eslint": "^6.8.0",
 		"eslint-config-standard": "^12.0.0",
 		"eslint-friendly-formatter": "^4.0.1",
 		"eslint-loader": "^3.0.4",
-		"eslint-plugin-import": "^2.22.0",
+		"eslint-plugin-import": "^2.22.1",
 		"eslint-plugin-node": "^11.1.0",
 		"eslint-plugin-promise": "^4.2.1",
 		"eslint-plugin-standard": "^4.0.1",
 		"eslint-plugin-vue": "^6.2.2",
-		"file-loader": "^6.1.0",
-		"jest": "^26.4.2",
+		"file-loader": "^6.1.1",
+		"jest": "^26.5.2",
 		"jest-serializer-vue": "^2.0.2",
 		"minimist": "^1.2.5",
 		"node-sass": "^4.14.1",
-		"raw-loader": "^4.0.1",
-		"sass-loader": "^10.0.2",
-		"style-loader": "^1.2.1",
+		"raw-loader": "^4.0.2",
+		"sass-loader": "^10.0.3",
+		"style-loader": "^1.3.0",
 		"stylelint": "^13.7.2",
 		"stylelint-config-recommended": "^3.0.0",
 		"stylelint-config-recommended-scss": "^4.2.0",
 		"stylelint-scss": "^3.18.0",
 		"stylelint-webpack-plugin": "^2.1.0",
-		"url-loader": "^4.1.0",
+		"url-loader": "^4.1.1",
 		"vue-jest": "^3.0.7",
 		"vue-loader": "^15.9.3",
 		"vue-template-compiler": "^2.6.12",
 		"webpack": "^4.44.2",
 		"webpack-cli": "^3.3.12",
 		"webpack-dev-server": "^3.11.0",
-		"webpack-merge": "^5.1.4"
+		"webpack-merge": "^5.2.0"
 	},
 	"jest": {
 		"moduleFileExtensions": [

src/App.vue

@@ -21,11 +21,11 @@
  -->
 
 <template>
-	<div id="content" :class="{ 'nav-hidden': !navShown, 'sidebar-hidden': !sidebarRouterView }">
-		<AppNavigation v-show="navShown" />
-		<div id="app-content">
+	<Content id="content" app-name="deck" :class="{ 'nav-hidden': !navShown, 'sidebar-hidden': !sidebarRouterView }">
+		<AppNavigation />
+		<AppContent>
 			<router-view />
-		</div>
+		</AppContent>
 
 		<Modal v-if="cardDetailsInModal && $route.params.cardId" :title="t('deck', 'Card details')" @close="hideModal()">
 			<div class="modal__content modal__card">
@@ -34,15 +34,16 @@
 		</Modal>
 
 		<router-view v-show="!cardDetailsInModal || !$route.params.cardId" name="sidebar" />
-	</div>
+	</Content>
 </template>
 
 <script>
 
 import { mapState } from 'vuex'
 import AppNavigation from './components/navigation/AppNavigation'
-import { Modal } from '@nextcloud/vue'
+import { Modal, Content, AppContent } from '@nextcloud/vue'
 import { BoardApi } from './services/BoardApi'
+import { emit, subscribe } from '@nextcloud/event-bus'
 
 const boardApi = new BoardApi()
 
@@ -51,6 +52,8 @@ export default {
 	components: {
 		AppNavigation,
 		Modal,
+		Content,
+		AppContent,
 	},
 	data() {
 		return {
@@ -91,6 +94,15 @@ export default {
 		this.$store.dispatch('loadBoards')
 		this.$store.dispatch('loadSharees')
 	},
+	mounted() {
+		// Set navigation to initial state and update in case it gets toggled
+		emit('toggle-navigation', { open: this.navShown, _initial: true })
+		this.$nextTick(() => {
+			subscribe('navigation-toggled', (navState) => {
+				this.$store.dispatch('toggleNav', navState.open)
+			})
+		})
+	},
 	methods: {
 		hideModal() {
 			this.$router.push({ name: 'board' })
@@ -131,13 +143,6 @@ export default {
 			}
 		}
 	}
-</style>
-
-<style lang="scss">
-
-	.multiselect {
-		width: 100%;
-	}
 
 	.modal__card {
 		min-width: 320px;
@@ -147,3 +152,11 @@ export default {
 		height: 80vh;
 	}
 </style>
+
+<style lang="scss">
+
+	.multiselect {
+		width: 100%;
+	}
+
+</style>

src/components/Controls.vue

@@ -22,17 +22,17 @@
 
 <template>
 	<div class="controls">
-		<div id="app-navigation-toggle-custom" class="icon-menu" @click="toggleNav" />
-		<div v-if="board" class="board-title">
+		<div v-if="overviewName" class="board-title">
+			<div class="board-bullet icon-calendar-dark" />
+			<h2>{{ overviewName }}</h2>
+		</div>
+		<div v-else-if="board" class="board-title">
 			<div :style="{backgroundColor: '#' + board.color}" class="board-bullet" />
-			<h2><a href="#">{{ board.title }}</a></h2>
+			<h2>{{ board.title }}</h2>
 			<p v-if="showArchived">
 				({{ t('deck', 'Archived cards') }})
 			</p>
 		</div>
-		<div v-if="overviewName" class="board-title">
-			<h2><a href="#">{{ overviewName }}</a></h2>
-		</div>
 		<div v-if="board" class="board-actions">
 			<div v-if="canManage && !showArchived && !board.archived"
 				id="stack-add"
@@ -321,6 +321,9 @@ export default {
 <style lang="scss" scoped>
 	.controls {
 		display: flex;
+		padding: 3px;
+		height: 44px;
+		padding-left: 44px;
 
 		.board-title {
 			display: flex;
@@ -337,7 +340,7 @@ export default {
 				height: 20px;
 				border: none;
 				border-radius: 50%;
-				background-color: #aaa;
+				background-color: transparent;
 				margin: 12px;
 				margin-left: -4px;
 			}
@@ -395,6 +398,7 @@ export default {
 		width: 250px;
 		max-height: 80vh;
 		overflow: auto;
+		padding: 8px;
 	}
 
 	.filter h3 {

src/components/board/Board.vue

@@ -181,7 +181,7 @@ export default {
 	}
 
 	.board {
-		margin-left: $board-spacing;
+		padding-left: $board-spacing;
 		position: relative;
 		height: calc(100% - 44px);
 		overflow-x: scroll;

src/components/board/SharingTabSidebar.vue

@@ -7,10 +7,19 @@
 			:options="formatedSharees"
 			:user-select="true"
 			label="displayName"
+			:loading="isLoading || !!isSearching"
+			:disabled="isLoading"
 			track-by="multiselectKey"
 			:internal-search="true"
 			@input="clickAddAcl"
-			@search-change="asyncFind" />
+			@search-change="asyncFind">
+			<template #noOptions>
+				{{ isSearching ? t('deck', 'Searching for users, groups and circles ...') : t('deck', 'No participants found') }}
+			</template>
+			<template #noResult>
+				{{ isSearching ? t('deck', 'Searching for users, groups and circles ...') : t('deck', 'No participants found') }}
+			</template>
+		</Multiselect>
 
 		<ul
 			id="shareWithList"
@@ -63,6 +72,7 @@ import { Avatar, Multiselect, Actions, ActionButton, ActionCheckbox } from '@nex
 import { CollectionList } from 'nextcloud-vue-collections'
 import { mapGetters, mapState } from 'vuex'
 import { getCurrentUser } from '@nextcloud/auth'
+import { showError } from '@nextcloud/dialogs'
 
 export default {
 	name: 'SharingTabSidebar',
@@ -83,6 +93,7 @@ export default {
 	data() {
 		return {
 			isLoading: false,
+			isSearching: false,
 			addAcl: null,
 			addAclForAPI: null,
 		}
@@ -102,7 +113,7 @@ export default {
 		formatedSharees() {
 			return this.unallocatedSharees.map(item => {
 				const sharee = {
-					user: item.label,
+					user: item.value.shareWith,
 					displayName: item.label,
 					icon: 'icon-user',
 					multiselectKey: item.shareType + ':' + item.primaryKey,
@@ -137,13 +148,20 @@ export default {
 		this.asyncFind('')
 	},
 	methods: {
-		asyncFind(query) {
-			this.isLoading = true
-			this.$store.dispatch('loadSharees', query).then(response => {
-				this.isLoading = false
-			})
+		async asyncFind(query) {
+			// manual debounce to handle async searching more easily and have more control over the loading state
+			const timestamp = (new Date()).getTime()
+			if (!this.isSearching || timestamp > this.isSearching + 300) {
+				this.isSearching = timestamp
+				await this.$store.dispatch('loadSharees', query)
+
+				// only reset searching flag if the most recent search finished
+				if (this.isSearching === timestamp) {
+					this.isSearching = false
+				}
+			}
 		},
-		clickAddAcl() {
+		async clickAddAcl() {
 			this.addAclForAPI = {
 				type: this.addAcl.value.shareType,
 				participant: this.addAcl.value.shareWith,
@@ -151,7 +169,16 @@ export default {
 				permissionShare: false,
 				permissionManage: false,
 			}
-			this.$store.dispatch('addAclToCurrentBoard', this.addAclForAPI)
+			this.isLoading = true
+			try {
+				await this.$store.dispatch('addAclToCurrentBoard', this.addAclForAPI)
+			} catch (e) {
+				const errorMessage = t('deck', 'Failed to create share with {displayName}', { displayName: this.addAcl.displayName })
+				console.error(errorMessage, e)
+				showError(errorMessage)
+			}
+			this.addAcl = null
+			this.isLoading = false
 		},
 		clickEditAcl(acl) {
 			this.addAclForAPI = Object.assign({}, acl)

src/components/board/Stack.vue

@@ -160,6 +160,7 @@ export default {
 		]),
 		...mapState({
 			showArchived: state => state.showArchived,
+			cardDetailsInModal: state => state.cardDetailsInModal,
 		}),
 		cardsByStack() {
 			return this.$store.getters.cardsByStack(this.stack.id).filter((card) => {
@@ -245,7 +246,9 @@ export default {
 					this.$refs.newCardInput.focus()
 					this.animate = false
 				})
-				this.$router.push({ name: 'card', params: { cardId: newCard.id } })
+				if (!this.cardDetailsInModal) {
+					this.$router.push({ name: 'card', params: { cardId: newCard.id } })
+				}
 			} catch (e) {
 				showError('Could not create card: ' + e.response.data.message)
 			} finally {

src/components/card/CardSidebar.vue

@@ -179,7 +179,7 @@
 			<CardSidebarTabAttachments :card="currentCard" />
 		</AppSidebarTab>
 
-		<AppSidebarTab v-if="hasComments"
+		<AppSidebarTab
 			id="comments"
 			:order="2"
 			:name="t('deck', 'Comments')"
@@ -283,7 +283,6 @@ export default {
 			descriptionSaveTimeout: null,
 			descriptionSaving: false,
 			hasActivity: capabilities && capabilities.activity,
-			hasComments: !!OC.appswebroots['comments'],
 			modalShow: false,
 			lang: {
 				days: getDayNamesMin(),
@@ -572,14 +571,16 @@ export default {
 	// FIXME: Obivously we should at some point not randomly reuse the sidebar component
 	// since this is not oficially supported
 	.modal__card .app-sidebar {
+		$modal-padding: 14px;
 		border: 0;
-		min-width: 100%;
+		min-width: calc(100% - #{$modal-padding*2});
 		position: relative;
 		top: 0;
 		left: 0;
 		right: 0;
-		max-width: 100%;
-		max-height: 100%;
+		max-width: calc(100% - #{$modal-padding*2});
+		padding: 14px;
+		max-height: calc(100% - #{$modal-padding*2});
 		&::v-deep {
 			.app-sidebar-header {
 				position: sticky;

src/components/cards/AvatarList.vue

@@ -144,17 +144,19 @@ export default {
 		}
 	}
 
+	$avatar-offset: 12px;
+
 	.avatar-list {
 		float: right;
 		display: inline-flex;
-		padding-right: 8px;
+		padding-right: $avatar-offset;
 		flex-direction: row-reverse;
 		.avatardiv,
 		/deep/ .avatardiv {
 			width: 36px;
 			height: 36px;
 			box-sizing: content-box !important;
-			margin-right: -12px;
+			margin-right: -$avatar-offset;
 			transition: margin-right 0.2s ease-in-out;
 
 			&.icon-more {

src/components/cards/CardBadges.vue

@@ -121,10 +121,6 @@ export default {
 		}
 	}
 
-	.card:not(.card__editable) .avatars {
-		margin-right: 10px;
-	}
-
 	.fade-enter-active, .fade-leave-active {
 		transition: opacity .125s;
 	}

src/components/cards/CardItem.vue

@@ -31,7 +31,7 @@
 			class="card"
 			@click="openCard">
 			<div class="card-upper">
-				<h3 v-if="isArchived || showArchived || !canEdit">
+				<h3 v-if="compactMode || isArchived || showArchived || !canEdit">
 					{{ card.title }}
 				</h3>
 				<h3 v-else-if="!editing">
@@ -41,6 +41,7 @@
 				<form v-if="editing"
 					v-click-outside="cancelEdit"
 					class="dragDisabled"
+					@click.stop
 					@keyup.esc="cancelEdit"
 					@submit.prevent="finishedEdit(card)">
 					<input v-model="copiedCard.title"
@@ -59,9 +60,9 @@
 				name="zoom"
 				tag="ul"
 				class="labels"
-				@click="openCard">
+				@click.stop="openCard">
 				<li v-for="label in labelsSorted" :key="label.id" :style="labelStyle(label)">
-					<span @click="applyLabelFilter(label)">{{ label.title }}</span>
+					<span @click.stop="applyLabelFilter(label)">{{ label.title }}</span>
 				</li>
 			</transition-group>
 			<div v-show="!compactMode" class="card-controls compact-item" @click="openCard">
@@ -115,10 +116,10 @@ export default {
 		]),
 		canEdit() {
 			if (this.currentBoard) {
-				return this.$store.getters.canEdit
+				return !this.currentBoard.archived && this.$store.getters.canEdit
 			}
 			const board = this.$store.getters.boards.find((item) => item.id === this.card.boardId)
-			return board ? board.permissions.PERMISSION_EDIT : false
+			return board ? !board.archived && board.permissions.PERMISSION_EDIT : false
 		},
 		card() {
 			return this.item ? this.item : this.$store.getters.cardById(this.id)
@@ -171,6 +172,10 @@ export default {
 		background-color: var(--color-main-background);
 		margin-bottom: $card-spacing;
 
+		&::v-deep * {
+			cursor: pointer;
+		}
+
 		body.dark &, body.theme--dark & {
 			border: 2px solid var(--color-border);
 		}
@@ -195,7 +200,7 @@ export default {
 				margin: 12px $card-padding;
 				flex-grow: 1;
 				font-size: 100%;
-				overflow-x: hidden;
+				overflow: hidden;
 				word-wrap: break-word;
 				padding-left: 4px;
 				span {
@@ -212,11 +217,16 @@ export default {
 		.card-controls {
 			display: flex;
 			margin-left: $card-padding;
+			margin-right: $card-padding;
+
 			& > div {
 				display: flex;
 				max-height: 44px;
 			}
 		}
+		&.card__editable .card-controls {
+			margin-right: 0;
+		}
 	}
 
 	.duedate {

src/components/cards/CardMenu.vue

@@ -30,18 +30,18 @@
 				<ActionButton v-if="showArchived === false && isCurrentUserAssigned" icon="icon-user" @click="unassignCardFromMe()">
 					{{ t('deck', 'Unassign myself') }}
 				</ActionButton>
-				<ActionButton icon="icon-archive" @click="archiveUnarchiveCard()">
-					{{ showArchived ? t('deck', 'Unarchive card') : t('deck', 'Archive card') }}
-				</ActionButton>
-				<ActionButton v-if="showArchived === false" icon="icon-delete" @click="deleteCard()">
-					{{ t('deck', 'Delete card') }}
-				</ActionButton>
 				<ActionButton icon="icon-external" @click.stop="modalShow=true">
 					{{ t('deck', 'Move card') }}
 				</ActionButton>
 				<ActionButton icon="icon-settings-dark" @click="openCard">
 					{{ t('deck', 'Card details') }}
 				</ActionButton>
+				<ActionButton icon="icon-archive" @click="archiveUnarchiveCard()">
+					{{ showArchived ? t('deck', 'Unarchive card') : t('deck', 'Archive card') }}
+				</ActionButton>
+				<ActionButton v-if="showArchived === false" icon="icon-delete" @click="deleteCard()">
+					{{ t('deck', 'Delete card') }}
+				</ActionButton>
 			</Actions>
 		</div>
 		<Modal v-if="modalShow" :title="t('deck', 'Move card to another board')" @close="modalShow=false">
@@ -106,7 +106,7 @@ export default {
 				return this.$store.getters.canEdit
 			}
 			const board = this.$store.getters.boards.find((item) => item.id === this.card.boardId)
-			return board.permissions.PERMISSION_EDIT
+			return !!board?.permissions?.PERMISSION_EDIT
 		},
 		isBoardAndStackChoosen() {
 			if (this.selectedBoard === '' || this.selectedStack === '') {

src/components/navigation/AppNavigation.vue

@@ -192,8 +192,4 @@ export default {
 			color: var(--color-text-light);
 		}
 	}
-
-	::v-deep .app-navigation-toggle {
-		display: none;
-	}
 </style>

src/store/main.js

@@ -34,7 +34,6 @@ import comment from './comment'
 import trashbin from './trashbin'
 import attachment from './attachment'
 import overview from './overview'
-import debounce from 'lodash/debounce'
 Vue.use(Vuex)
 
 const apiClient = new BoardApi()
@@ -59,7 +58,7 @@ export default new Vuex.Store({
 	state: {
 		config: loadState('deck', 'config', {}),
 		showArchived: false,
-		navShown: true,
+		navShown: localStorage.getItem('deck.navShown') === 'true',
 		compactMode: localStorage.getItem('deck.compactMode') === 'true',
 		cardDetailsInModal: localStorage.getItem('deck.cardDetailsInModal') === 'true',
 		sidebarShown: false,
@@ -204,8 +203,9 @@ export default new Vuex.Store({
 				return board.id !== b.id
 			})
 		},
-		toggleNav(state) {
-			state.navShown = !state.navShown
+		toggleNav(state, navState) {
+			state.navShown = navState
+			localStorage.setItem('deck.navShown', navState)
 		},
 		toggleSidebar(state) {
 			state.sidebarShown = !state.sidebarShown
@@ -392,7 +392,7 @@ export default new Vuex.Store({
 			const boards = await apiClient.loadBoards()
 			commit('setBoards', boards)
 		},
-		loadSharees: debounce(function({ commit }, query) {
+		async loadSharees({ commit }, query) {
 			const params = new URLSearchParams()
 			if (typeof query === 'undefined') {
 				return
@@ -402,16 +402,15 @@ export default new Vuex.Store({
 			params.append('perPage', 20)
 			params.append('itemType', [0, 1, 7])
 
-			axios.get(generateOcsUrl('apps/files_sharing/api/v1') + 'sharees', { params }).then((response) => {
-				commit('setSharees', response.data.ocs.data)
-			})
-		}, 250),
+			const response = await axios.get(generateOcsUrl('apps/files_sharing/api/v1') + 'sharees', { params })
+			commit('setSharees', response.data.ocs.data)
+		},
 
 		setBoardFilter({ commmit }, filter) {
 			commmit('setBoardFilter', filter)
 		},
-		toggleNav({ commit }) {
-			commit('toggleNav')
+		toggleNav({ commit }, navState) {
+			commit('toggleNav', navState)
 		},
 		toggleSidebar({ commit }) {
 			commit('toggleSidebar')
@@ -454,13 +453,11 @@ export default new Vuex.Store({
 		},
 
 		// acl actions
-		addAclToCurrentBoard({ dispatch, commit }, newAcl) {
+		async addAclToCurrentBoard({ dispatch, commit }, newAcl) {
 			newAcl.boardId = this.state.currentBoard.id
-			apiClient.addAcl(newAcl)
-				.then((returnAcl) => {
-					commit('addAclToCurrentBoard', returnAcl)
-					dispatch('refreshBoard', newAcl.boardId)
-				})
+			const result = await apiClient.addAcl(newAcl)
+			commit('addAclToCurrentBoard', result)
+			dispatch('refreshBoard', newAcl.boardId)
 		},
 		updateAclFromCurrentBoard({ commit }, acl) {
 			acl.boardId = this.state.currentBoard.id