chore: Migrate to Node API

Signed-off-by: Louis Chemineau <[email protected]>

Author: artonge

package-lock.json

@@ -25,8 +25,8 @@
   "scripts": {
     "build": "vite --mode production build",
     "postbuild": "build-js/npm-post-build.sh",
-    "dev": "vite --mode development build",
-    "watch": "vite --mode development build --watch",
+    "dev": "export NODE_ENV=development; vite --mode development build",
+    "watch": "export NODE_ENV=development; vite --mode development build --watch",
     "test": "TZ=CET NODE_ENV=test vitest run",
     "test:coverage": "TZ=CET NODE_ENV=test vitest --coverage run",
     "lint": "eslint --ext .js,.vue src",
@@ -65,6 +65,7 @@
     "leaflet": "^1.9.4",
     "leaflet-defaulticon-compatibility": "^0.1.2",
     "path-posix": "^1.0.0",
+    "pinia": "^3.0.2",
     "qs": "^6.14.0",
     "url-parse": "^1.5.10",
     "vue": "^2.7.14",

package.json

@@ -5,6 +5,14 @@
 
 <template>
 	<NcContent app-name="photos">
+		<!--
+		Needed for isPublicShare to return true
+		https://github.com/nextcloud-libraries/nextcloud-sharing/blob/15f38dfdeb2c72501008e5ae89d3eb424b83aed5/lib/publicShare.ts#L12-L20
+		 -->
+		<input id="isPublic"
+			type="hidden"
+			name="isPublic"
+			value="1">
 		<NcAppContent>
 			<router-view />
 

src/PhotosPublic.vue

@@ -13,7 +13,7 @@
 </template>
 
 <script lang='ts'>
-import { mapGetters } from 'vuex'
+import type { PropType } from 'vue'
 
 import { generateUrl } from '@nextcloud/router'
 import { NcActionLink } from '@nextcloud/vue'
@@ -32,26 +32,26 @@ export default {
 		},
 
 		selectedFileIds: {
-			type: Array,
+			type: Array as PropType<string[]>,
 			required: true,
 		},
 	},
 
 	computed: {
-		...mapGetters([
-			'files',
-		]),
+		files() {
+			return this.$store.state.files.files
+		},
 
 		downloadUrl() {
 			const params = new URLSearchParams()
-			const filePaths = this.fileNames.map(fileName => '/' + fileName.split('/').splice(3).join('/'))
-			params.append('files', JSON.stringify(filePaths))
+			params.append('files', JSON.stringify(this.paths))
 
+			// TODO: FIX ME
 			return generateUrl(`/apps/files/ajax/download.php?${params}`)
 		},
 
-		fileNames() {
-			return this.selectedFileIds.map(fileId => this.files[fileId].filename)
+		paths() {
+			return this.selectedFileIds.map(fileId => this.files[fileId].path)
 		},
 	},
 }

src/components/Actions/ActionDownload.vue

@@ -20,12 +20,13 @@
 </template>
 
 <script lang='ts'>
-import { mapActions, mapGetters } from 'vuex'
+import { defineComponent, type PropType } from 'vue'
 import Star from 'vue-material-design-icons/Star.vue'
 
 import { NcActionButton } from '@nextcloud/vue'
+import { translate as t } from '@nextcloud/l10n'
 
-export default {
+export default defineComponent({
 	name: 'ActionFavorite',
 	components: {
 		Star,
@@ -34,35 +35,32 @@ export default {
 
 	props: {
 		selectedFileIds: {
-			type: Array,
+			type: Array as PropType<string[]>,
 			required: true,
 		},
 	},
 
 	computed: {
-		...mapGetters([
-			'files',
-		]),
+		files() {
+			return this.$store.state.files.files
+		},
 
-		/** @return {boolean} */
 		shouldFavoriteSelection() {
 			// Favorite all selection if at least one file is not in the favorites.
-			return this.selectedFileIds.some((fileId) => this.files[fileId].favorite === 0)
+			return this.selectedFileIds.some((fileId) => this.files[fileId].attributes.favorite === 0)
 		},
 	},
 
 	methods: {
-		...mapActions([
-			'toggleFavoriteForFiles',
-		]),
-
 		async favoriteSelection() {
-			await this.toggleFavoriteForFiles({ fileIds: this.selectedFileIds, favoriteState: 1 })
+			await this.$store.dispatch('toggleFavoriteForFiles', { fileIds: this.selectedFileIds, favoriteState: 1 })
 		},
 
 		async unFavoriteSelection() {
-			await this.toggleFavoriteForFiles({ fileIds: this.selectedFileIds, favoriteState: 0 })
+			await this.$store.dispatch('toggleFavoriteForFiles', { fileIds: this.selectedFileIds, favoriteState: 0 })
 		},
+
+		t,
 	},
-}
+})
 </script>