fix: build warnings

Part-of: <https://dev.funkwhale.audio/funkwhale/funkwhale/-/merge_requests/2346>

front/package.json

@@ -73,7 +73,6 @@
     "@vitejs/plugin-vue": "4.0.0",
     "@vitest/coverage-c8": "0.25.8",
     "@vue/compiler-sfc": "3.2.45",
-    "@vue/devtools": "^6.5.0",
     "@vue/eslint-config-standard": "8.0.1",
     "@vue/eslint-config-typescript": "11.0.2",
     "@vue/test-utils": "2.2.7",

front/src/components/library/FileUpload.vue

@@ -205,7 +205,7 @@ fetchQuota()
 //
 // Filesystem
 //
-const fsPath = reactive([])
+const fsPath = ref([])
 const fsStatus = ref({
   import: {
     status: 'pending'
@@ -223,7 +223,7 @@ const fetchFilesystem = async (updateLoading: boolean) => {
   pause()
 
   try {
-    const response = await axios.get('libraries/fs-import', { params: { path: fsPath.join('/') } })
+    const response = await axios.get('libraries/fs-import', { params: { path: fsPath.value.join('/') } })
     fsStatus.value = response.data
   } catch (error) {
     useErrorHandler(error as Error)
@@ -243,7 +243,7 @@ const importFs = async () => {
 
   try {
     const response = await axios.post('libraries/fs-import', {
-      path: fsPath.join('/'),
+      path: fsPath.value.join('/'),
       library: props.library.uuid,
       import_reference: importReference.value
     })

front/src/components/manage/users/InvitationForm.vue

@@ -120,7 +120,7 @@ const getUrl = (code: string) => store.getters['instance/absoluteUrl'](router.re
       </table>
       <button
         class="ui basic button"
-        @click="invitations = []"
+        @click="invitations.length = 0"
       >
         {{ $t('components.manage.users.InvitationForm.button.clear') }}
       </button>

front/src/main.ts

@@ -2,7 +2,6 @@ import type { InitModule } from '~/types'
 
 import store, { key } from '~/store'
 import router from '~/router'
-import devtools from '@vue/devtools'
 
 import { createApp, defineAsyncComponent, h } from 'vue'
 
@@ -16,10 +15,6 @@ import '~/api'
 // NOTE: Set the theme as fast as possible
 useTheme()
 
-if (import.meta.env.MODE === 'development') {
-  devtools.connect(/* host, port */)
-}
-
 const logger = useLogger()
 logger.info('Loading environment:', import.meta.env.MODE)
 logger.debug('Environment variables:', import.meta.env)

front/src/views/admin/moderation/AccountsDetail.vue

@@ -51,7 +51,7 @@ const fetchPolicy = async (id: number) => {
   isLoadingPolicy.value = false
 }
 
-const permissions = reactive([] as string[])
+const permissions = ref([] as string[])
 const isLoading = ref(false)
 const object = ref()
 const fetchData = async () => {
@@ -68,7 +68,7 @@ const fetchData = async () => {
     if (response.data.user) {
       for (const { code } of allPermissions.value) {
         if (response.data.user.permissions[code]) {
-          permissions.push(code)
+          permissions.value.push(code)
         }
       }
     }
@@ -120,7 +120,7 @@ const updateUser = async (attr: string, toNull = false) => {
 
   if (attr === 'permissions') {
     params.permissions = allPermissions.value.reduce((acc, { code }) => {
-      acc[code] = permissions.includes(code)
+      acc[code] = permissions.value.includes(code)
       return acc
     }, {} as Record<string, boolean>)
   }