Merge pull request #12019 from owncloud/fix/file-extension-label-callback

fix: allow callback for file extension labels

Author: JammingBen

packages/web-app-external/src/index.ts

@@ -58,7 +58,7 @@ export default defineWebApplication({
         const provider = mimeType.app_providers.find((provider) => provider.name === appName)
         return {
           extension: mimeType.ext,
-          label: $gettext('Open in %{app}', { app: provider.name }),
+          label: () => $gettext('Open in %{app}', { app: provider.name }),
           icon: provider.icon,
           name: provider.name,
           mimeType: mimeType.mime_type,

packages/web-app-preview/src/index.ts

@@ -1,4 +1,4 @@
-import { AppWrapperRoute, defineWebApplication } from '@ownclouders/web-pkg'
+import { ApplicationInformation, AppWrapperRoute, defineWebApplication } from '@ownclouders/web-pkg'
 import translations from '../l10n/translations.json'
 import * as app from './App.vue'
 import { useGettext } from 'vue3-gettext'
@@ -30,14 +30,14 @@ export default defineWebApplication({
 
     const routeName = 'preview-media'
 
-    const appInfo = {
+    const appInfo: ApplicationInformation = {
       name: $gettext('Preview'),
       id: appId,
       icon: 'eye',
       extensions: mimeTypes.map((mimeType) => ({
         mimeType,
         routeName,
-        label: $gettext('Preview')
+        label: () => $gettext('Preview')
       }))
     }
 

packages/web-app-text-editor/src/index.ts

@@ -25,39 +25,39 @@ export default defineWebApplication({
       const extensions: ApplicationFileExtension[] = [
         {
           extension: 'txt',
-          label: $gettext('Plain text file')
+          label: () => $gettext('Plain text file')
         },
         {
           extension: 'md',
-          label: $gettext('Markdown file')
+          label: () => $gettext('Markdown file')
         },
         {
           extension: 'markdown',
-          label: $gettext('Markdown file')
+          label: () => $gettext('Markdown file')
         },
         {
           extension: 'js',
-          label: $gettext('JavaScript file')
+          label: () => $gettext('JavaScript file')
         },
         {
           extension: 'json',
-          label: $gettext('JSON file')
+          label: () => $gettext('JSON file')
         },
         {
           extension: 'xml',
-          label: $gettext('XML file')
+          label: () => $gettext('XML file')
         },
         {
           extension: 'py',
-          label: $gettext('Python file')
+          label: () => $gettext('Python file')
         },
         {
           extension: 'php',
-          label: $gettext('PHP file')
+          label: () => $gettext('PHP file')
         },
         {
           extension: 'yaml',
-          label: $gettext('YAML file')
+          label: () => $gettext('YAML file')
         }
       ]
 
@@ -75,7 +75,10 @@ export default defineWebApplication({
         if (isPrimary) {
           extensionItem.newFileMenu = {
             menuTitle() {
-              return $gettext(extensionItem.label)
+              if (typeof extensionItem.label === 'function') {
+                return extensionItem.label()
+              }
+              return extensionItem.label
             }
           }
         }

packages/web-pkg/src/apps/types.ts

@@ -56,7 +56,7 @@ export interface ApplicationFileExtension {
     currentFolder: Resource
   }) => Promise<Resource>
   hasPriority?: boolean
-  label?: string
+  label?: string | (() => string)
   name?: string
   icon?: string
   mimeType?: string

packages/web-pkg/src/components/ContextActions/ActionMenuItem.vue

@@ -147,7 +147,7 @@ export default defineComponent({
     const openInNewTabHint = computed(() => {
       return $gettext(
         'Hold %{key} and click to open in new tab',
-        { key: unref(isMacOs) ? '⌘' : 'ctrl' },
+        { key: unref(isMacOs) ? '⌘' : $gettext('ctrl') },
         true
       )
     })

packages/web-pkg/src/composables/actions/files/useFileActions.ts

@@ -119,7 +119,10 @@ export const useFileActions = () => {
           name: `editor-${fileExtension.app}`,
           label: () => {
             if (fileExtension.label) {
-              return $gettext(fileExtension.label)
+              if (typeof fileExtension.label === 'function') {
+                return fileExtension.label()
+              }
+              return fileExtension.label
             }
             return $gettext('Open in %{app}', { app: appInfo.name }, true)
           },