fix(backport): add missing import/export changes

- Wire up BoardExportModal in AppNavigationBoard
- Add JSON export to BoardApi.exportBoard
- Add importBoard store action
- Add board import/export Cypress tests
- Use showMessage instead of showLoading (not in @nextcloud/dialogs 5.x)

Signed-off-by: silver <s.szmajduch@posteo.de>
Assisted-by: ClaudeCode:claude-opus-5.5

Author: silverkszlo

cypress/e2e/boardFeatures.js

@@ -3,6 +3,7 @@
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 import { randUser } from '../utils/index.js'
+import { sampleBoard } from '../utils/sampleBoard.js'
 const user = randUser()
 const recipient = randUser()
 
@@ -58,3 +59,81 @@ describe('Board', function() {
 			.should('be.visible')
 	})
 })
+
+describe('Board export', function() {
+	before(function() {
+		cy.createUser(user)
+	})
+
+	it('Exports a board as JSON', function() {
+		const boardName = 'Export JSON board'
+		const board = sampleBoard(boardName)
+		cy.createExampleBoard({ user, board }).then((board) => {
+			const boardId = board.id
+			cy.visit(`/apps/deck/board/${boardId}`)
+			cy.get('.app-navigation__list .app-navigation-entry:contains("' + boardName + '")')
+				.parent()
+				.find('button[aria-label="Actions"]')
+				.click()
+			cy.get('button:contains("Export board")')
+				.click()
+			cy.get('.modal-container .checkbox-radio-switch__text:contains("Export as JSON")')
+				.click()
+			cy.get('.modal-container button:contains("Export")')
+				.click()
+
+			const downloadsFolder = Cypress.config('downloadsFolder')
+			cy.readFile(`${downloadsFolder}/${boardName}.json`)
+		})
+	})
+
+	it('Exports a board as CSV', function() {
+		const boardName = 'Export CSV board'
+		const board = sampleBoard(boardName)
+		cy.createExampleBoard({ user, board }).then((board) => {
+			const boardId = board.id
+			cy.visit(`/apps/deck/board/${boardId}`)
+			cy.get('.app-navigation__list .app-navigation-entry:contains("' + boardName + '")')
+				.parent()
+				.find('button[aria-label="Actions"]')
+				.click()
+			cy.get('button:contains("Export board")')
+				.click()
+			cy.get('.modal-container .checkbox-radio-switch__text:contains("Export as CSV")')
+				.click()
+			cy.get('.modal-container button:contains("Export")')
+				.click()
+
+			const downloadsFolder = Cypress.config('downloadsFolder')
+			cy.readFile(`${downloadsFolder}/${boardName}.csv`)
+		})
+	})
+})
+
+describe('Board import', function() {
+	before(function() {
+		cy.createUser(user)
+	})
+	beforeEach(function() {
+		cy.login(user)
+		cy.visit('/apps/deck')
+	})
+
+	it('Imports a board from JSON', function() {
+		cy.get('#app-navigation-vue .app-navigation__list .app-navigation-entry:contains("Import board")')
+			.should('be.visible')
+			.click()
+
+		// Upload a JSON file
+		cy.get('input[type="file"]')
+			.selectFile([
+				{
+					contents: 'cypress/fixtures/import-board.json',
+					fileName: 'import-board.json',
+				},
+			], { force: true })
+
+		cy.get('.app-navigation__list .app-navigation-entry:contains("Imported board")')
+			.should('be.visible')
+	})
+})

src/components/navigation/AppNavigationBoard.vue

@@ -12,7 +12,13 @@
 		:force-display-actions="isTouchDevice"
 		@click="onNavigate"
 		@undo="unDelete">
-		<NcAppNavigationIconBullet slot="icon" :color="board.color" />
+		<template #icon>
+			<NcAppNavigationIconBullet :color="board.color" />
+			<BoardExportModal v-if="exportModalOpen"
+				:board-title="board.title"
+				@export="onExportBoard"
+				@close="onCloseExportBoard" />
+		</template>
 
 		<template #counter>
 			<AccountIcon v-if="board.acl.length > 0" />
@@ -157,6 +163,8 @@ import { loadState } from '@nextcloud/initial-state'
 import { emit } from '@nextcloud/event-bus'
 
 import isTouchDevice from '../../mixins/isTouchDevice.js'
+import BoardExportModal from './BoardExportModal.vue'
+import { showMessage, TOAST_PERMANENT_TIMEOUT } from '@nextcloud/dialogs'
 
 const canCreateState = loadState('deck', 'canCreate')
 
@@ -174,6 +182,7 @@ export default {
 		CloneIcon,
 		CloseIcon,
 		CheckIcon,
+		BoardExportModal,
 	},
 	directives: {
 		ClickOutside,
@@ -201,6 +210,7 @@ export default {
 			isDueSubmenuActive: false,
 			updateDueSetting: null,
 			canCreate: canCreateState,
+			exportModalOpen: false,
 		}
 	},
 	computed: {
@@ -344,7 +354,7 @@ export default {
 		},
 		async onExportBoard(format) {
 			this.exportModalOpen = false
-			const loadingToast = showLoading(t('deck', 'Exporting board...'))
+			const loadingToast = showMessage(t('deck', 'Exporting board...'), { timeout: TOAST_PERMANENT_TIMEOUT })
 			await this.boardApi.exportBoard(this.board, format)
 			loadingToast.hideToast()
 		},

src/components/navigation/AppNavigationImportBoard.vue

@@ -16,7 +16,7 @@
 <script>
 import { NcAppNavigationItem } from '@nextcloud/vue'
 import { showError } from '../../helpers/errors.js'
-import { showSuccess, showLoading } from '@nextcloud/dialogs'
+import { showSuccess, showMessage, TOAST_PERMANENT_TIMEOUT } from '@nextcloud/dialogs'
 
 export default {
 	name: 'AppNavigationImportBoard',
@@ -40,7 +40,7 @@ export default {
 		async doImportBoard(event) {
 			const file = event.target.files[0]
 			if (file) {
-				const loadingToast = showLoading(t('deck', 'Importing board...'))
+				const loadingToast = showMessage(t('deck', 'Importing board...'), { timeout: TOAST_PERMANENT_TIMEOUT })
 				const result = await this.$store.dispatch('importBoard', file)
 				loadingToast.hideToast()
 				if (result?.message) {

src/services/BoardApi.js

@@ -136,6 +136,25 @@ export class BoardApi {
 		return axios.get(this.url(`/boards/${board.id}/export`))
 			.then(
 				(response) => {
+					if (format === 'json') {
+						const exportData = {
+							boards: [response.data],
+						}
+						const stacks = {}
+						for (const stack of response.data.stacks) {
+							stacks[stack.id] = stack
+						}
+						exportData.boards[0].stacks = stacks
+						const blob = new Blob([JSON.stringify(exportData, null, 2)], { type: 'application/json' })
+						const blobUrl = URL.createObjectURL(blob)
+						const a = document.createElement('a')
+						a.href = blobUrl
+						a.download = response.data.title + '.json'
+						a.click()
+						a.remove()
+						return Promise.resolve()
+					}
+
 					const fields = { title: t('deck', 'Card title'), description: t('deck', 'Description'), stackId: t('deck', 'List name'), labels: t('deck', 'Tags'), duedate: t('deck', 'Due date'), createdAt: t('deck', 'Created'), lastModified: t('deck', 'Modified') }
 					let row = ''
 					Object.keys(fields).forEach(field => {

src/store/main.js

@@ -409,6 +409,14 @@ export default function storeFactory() {
 					return err
 				}
 			},
+			async importBoard({ commit }, file) {
+				try {
+					const board = await apiClient.importBoard(file)
+					commit('addBoard', board)
+				} catch (err) {
+					return err
+				}
+			},
 			async cloneBoard({ commit }, boardData) {
 				try {
 					const newBoard = await apiClient.cloneBoard(boardData)