Merge pull request #12109 from owncloud/feat(web-pkg)/add-file-extens…

…ion-custom-handler feat(web-pkg): add file extension custom handler
owncloud · Jan 23, 2025 · bd916ad · bd916ad
2 parents ea4f53e + 48b4e1e
commit bd916ad
Show file tree

Hide file tree

Showing 6 changed files with 45 additions and 10 deletions.
diff --git a/changelog/unreleased/enhancement-add-custom-handler-to-file-extensions.md b/changelog/unreleased/enhancement-add-custom-handler-to-file-extensions.md
@@ -0,0 +1,5 @@
+Enhancement: Add custom handler to file extensions
+
+We've added a new property into application file extensions called `customHandler`. This property allows app developers to use completely custom flows when creating new files.
+
+https://github.com/owncloud/web/pull/12109
diff --git a/docs/extension-system/viewer-editor-apps.md b/docs/extension-system/viewer-editor-apps.md
@@ -119,5 +119,10 @@ interface ApplicationFileExtension {
   mimeType?: string
   newFileMenu?: { menuTitle: () => string }
   routeName?: string
+  customHandler? (
+    fileActionOptions: FileActionOptions,
+    extension: string,
+    appFileExtension: ApplicationFileExtension
+  ) => Promise<void> | void
 }
 ```
diff --git a/packages/web-pkg/src/apps/types.ts b/packages/web-pkg/src/apps/types.ts
@@ -4,6 +4,7 @@ import { Extension, ExtensionPoint } from '../composables/piniaStores'
 import { IconFillType } from '../helpers'
 import { Resource, SpaceResource } from '@ownclouders/web-client'
 import { Translations } from 'vue3-gettext'
+import { FileActionOptions } from '../composables/actions/types'
 
 export interface AppReadyHookArgs {
   globalProperties: ComponentCustomProperties & Record<string, any>
@@ -63,6 +64,11 @@ export interface ApplicationFileExtension {
   newFileMenu?: { menuTitle: () => string }
   routeName?: string
   secureView?: boolean
+  customHandler?: (
+    fileActionOptions: FileActionOptions,
+    extension: string,
+    appFileExtension: ApplicationFileExtension
+  ) => Promise<void> | void
 }
 
 /** ApplicationInformation describes required information of an application */

diff --git a/packages/web-pkg/src/composables/actions/files/useFileActionsCreateNewFile.ts b/packages/web-pkg/src/composables/actions/files/useFileActionsCreateNewFile.ts
@@ -184,7 +184,10 @@ export const useFileActionsCreateNewFile = ({ space }: { space?: Ref<SpaceResour
       actions.push({
         name: 'create-new-file',
         icon: 'add',
-        handler: (args) => handler(args, appFileExtension.extension, appFileExtension),
+        handler: (args) =>
+          appFileExtension.customHandler
+            ? appFileExtension.customHandler(args, appFileExtension.extension, appFileExtension)
+            : handler(args, appFileExtension.extension, appFileExtension),
         label: () => $gettext(appFileExtension.newFileMenu.menuTitle()),
         isVisible: () => {
           return unref(currentFolder)?.canUpload({ user: userStore.user })

diff --git a/packages/web-pkg/src/composables/piniaStores/apps.ts b/packages/web-pkg/src/composables/piniaStores/apps.ts
@@ -52,7 +52,8 @@ export const useAppsStore = defineStore('apps', () => {
         data.hasPriority ||
         unref(externalAppConfig)?.[appId]?.priorityExtensions?.includes(data.extension) ||
         false,
-      secureView: data.secureView || false
+      secureView: data.secureView || false,
+      customHandler: data.customHandler || null
     })
   }
 

diff --git a/packages/web-pkg/tests/unit/composables/actions/files/useFileActionsCreateNewFile.spec.ts b/packages/web-pkg/tests/unit/composables/actions/files/useFileActionsCreateNewFile.spec.ts
@@ -68,16 +68,37 @@ describe('useFileActionsCreateNewFile', () => {
       })
     })
   })
+
+  describe('customHandler', () => {
+    it('should use customHandler when it is provided', () => {
+      const action = mock<ApplicationFileExtension>({ app: 'link-opener', customHandler: vi.fn() })
+
+      getWrapper({
+        action,
+        setup: ({ actions }) => {
+          unref(actions).at(0).handler()
+          expect(action.customHandler).toHaveBeenCalled()
+        }
+      })
+    })
+  })
 })
 
 function getWrapper({
   resolveCreateFile = true,
   space = undefined,
-  setup
+  setup,
+  action = mock<ApplicationFileExtension>({
+    app: 'text-editor',
+    extension: '.txt',
+    newFileMenu: { menuTitle: vi.fn() },
+    customHandler: null
+  })
 }: {
   resolveCreateFile?: boolean
   space?: SpaceResource
   setup: (instance: ReturnType<typeof useFileActionsCreateNewFile>) => void
+  action?: ApplicationFileExtension
 }) {
   const mocks = {
     ...defaultComponentMocks({
@@ -111,13 +132,7 @@ function getWrapper({
         pluginOptions: {
           piniaOptions: {
             appsState: {
-              fileExtensions: [
-                mock<ApplicationFileExtension>({
-                  app: 'text-editor',
-                  extension: '.txt',
-                  newFileMenu: { menuTitle: vi.fn() }
-                })
-              ]
+              fileExtensions: [action]
             },
             resourcesStore: { currentFolder }
           }