Make fileActions mixin standalone again.

packages/web-app-files/src/components/AppBar/SelectedResources/BatchActions.vue

@@ -23,14 +23,9 @@ import DownloadFile from '../../../mixins/actions/downloadFile'
 import EmptyTrashBin from '../../../mixins/actions/emptyTrashBin'
 import Move from '../../../mixins/actions/move'
 import Restore from '../../../mixins/actions/restore'
-import { useIsFilesAppActive } from '../../../composables/useIsFilesAppActive'
+import { useIsFilesAppActive } from '../../../composables'
 
 export default {
-  setup() {
-    return {
-      isFilesAppActive: useIsFilesAppActive()
-    }
-  },
   name: 'BatchActions',
   components: { ActionMenuItem },
   mixins: [
@@ -44,6 +39,11 @@ export default {
     Move,
     Restore
   ],
+  setup() {
+    return {
+      isFilesAppActive: useIsFilesAppActive()
+    }
+  },
   computed: {
     ...mapGetters('Files', ['selectedFiles']),
 

packages/web-app-files/src/components/FilesList/ContextActions.vue

@@ -39,14 +39,8 @@ import Restore from '../../mixins/actions/restore'
 import ShowActions from '../../mixins/actions/showActions'
 import ShowDetails from '../../mixins/actions/showDetails'
 import ShowShares from '../../mixins/actions/showShares'
-import { useIsFilesAppActive } from '../../composables/useIsFilesAppActive'
 
 export default {
-  setup() {
-    return {
-      isFilesAppActive: useIsFilesAppActive()
-    }
-  },
   name: 'ContextActions',
   components: { ActionMenuItem },
   mixins: [

packages/web-app-files/src/components/SideBar/Actions/FileActions.vue

@@ -15,14 +15,8 @@ import { mapGetters } from 'vuex'
 import ActionMenuItem from '../../ActionMenuItem.vue'
 
 import FileActions from '../../../mixins/fileActions'
-import { useIsFilesAppActive } from '../../../composables/useIsFilesAppActive'
 
 export default {
-  setup() {
-    return {
-      isFilesAppActive: useIsFilesAppActive()
-    }
-  },
   name: 'FileActions',
   title: ($gettext) => {
     return $gettext('Actions')

packages/web-app-files/src/composables/router/index.ts

@@ -1 +1,2 @@
 export * from './useActiveLocation'
+export * from './useIsFilesAppActive'

packages/web-app-files/src/composables/useIsFilesAppActive.ts → packages/web-app-files/src/composables/router/useIsFilesAppActive.ts

@@ -1,6 +1,11 @@
 import { computed, ComputedRef, unref } from '@vue/composition-api'
 import { useActiveApp } from 'web-pkg/src/composables'
-import FilesApp from '../index'
+
+export const isFilesAppActive = (activeApp: string): boolean => {
+  // FIXME: we should use this constant but it somehow breaks the unit tests
+  // return activeApp === FilesApp.appInfo.id
+  return activeApp === 'files'
+}
 
 /*
  * This composable can be used to check whether the current route
@@ -12,6 +17,6 @@ import FilesApp from '../index'
 export const useIsFilesAppActive = (): ComputedRef<boolean> => {
   const activeApp = useActiveApp()
   return computed(() => {
-    return unref(activeApp) === FilesApp.appInfo.id
+    return isFilesAppActive(unref(activeApp))
   })
 }

packages/web-app-files/src/mixins/fileActions.js

@@ -17,6 +17,9 @@ import Rename from './actions/rename'
 import Restore from './actions/restore'
 import kebabCase from 'lodash-es/kebabCase'
 
+import { activeApp } from 'web-pkg/src/composables'
+import { isFilesAppActive } from '../composables'
+
 const actionsMixins = [
   'fetch',
   'navigate',
@@ -55,6 +58,12 @@ export default {
     ...mapGetters('Files', ['highlightedFile', 'currentFolder']),
     ...mapGetters(['capabilities', 'configuration']),
 
+    // TODO: Replace this with the useIsFilesAppActive composable
+    // once we port this mixin to something using the composition api
+    isFilesAppActive() {
+      return isFilesAppActive(activeApp(this.$route))
+    },
+
     $_fileActions_systemActions() {
       return actionsMixins.flatMap((actionMixin) => {
         return this[`$_${actionMixin}_items`]

packages/web-pkg/src/composables/router/useActiveApp.ts

@@ -1,9 +1,14 @@
 import { computed, ComputedRef, unref } from '@vue/composition-api'
 import { useRoute } from './useRoute'
+import { Route } from 'vue-router'
+
+export const activeApp = (route: Route): string => {
+  return route.path.split('/')[1]
+}
 
 export const useActiveApp = (): ComputedRef<string> => {
   const route = useRoute()
   return computed(() => {
-    return unref(route).path.split('/')[1]
+    return activeApp(unref(route))
   })
 }