[full-ci] Set document title consistently for all apps in useAppDefaults composable

packages/web-app-draw-io/src/App.vue

@@ -34,7 +34,7 @@ export default {
   setup() {
     return {
       ...useAppDefaults({
-        applicationName: 'draw-io'
+        applicationId: 'draw-io'
       })
     }
   },

packages/web-app-external/src/App.vue

@@ -68,7 +68,7 @@ export default {
   setup() {
     return {
       ...useAppDefaults({
-        applicationName: 'external'
+        applicationId: 'external'
       })
     }
   },
@@ -103,10 +103,6 @@ export default {
       return this.$route.query.fileId
     }
   },
-  mounted() {
-    const appNameTitle = this.appName ? `${this.appName} - ` : ''
-    document.title = `${this.currentFileContext.fileName} - ${appNameTitle}${this.configuration.currentTheme.general.name}`
-  },
   async created() {
     await unauthenticatedUserReady(this.$router, this.$store)
 

packages/web-app-files/src/components/AppBar/CreateAndUpload.vue

@@ -119,7 +119,7 @@ import MixinFileActions, { EDITOR_MODE_CREATE } from '../../mixins/fileActions'
 import { buildResource, buildWebDavFilesPath, buildWebDavSpacesPath } from '../../helpers/resources'
 import { isLocationPublicActive, isLocationSpacesActive } from '../../router'
 import { useActiveLocation } from '../../composables'
-import { useAppDefaults, useCapabilityShareJailEnabled } from 'web-pkg/src/composables'
+import { useRequest, useCapabilityShareJailEnabled } from 'web-pkg/src/composables'
 
 import { DavProperties, DavProperty } from 'web-pkg/src/constants'
 
@@ -167,10 +167,8 @@ export default defineComponent({
       isSpacesProjectsLocation: useActiveLocation(isLocationSpacesActive, 'files-spaces-projects'),
       isSpacesProjectLocation: useActiveLocation(isLocationSpacesActive, 'files-spaces-project'),
       isSpacesShareLocation: useActiveLocation(isLocationSpacesActive, 'files-spaces-share'),
-      ...useAppDefaults({
-        applicationName: 'files'
-      }),
-      hasShareJail: useCapabilityShareJailEnabled()
+      hasShareJail: useCapabilityShareJailEnabled(),
+      ...useRequest()
     }
   },
   data: () => ({

packages/web-app-pdf-viewer/src/App.vue

@@ -25,7 +25,7 @@ export default {
   setup() {
     return {
       ...useAppDefaults({
-        applicationName: 'pdf-viewer'
+        applicationId: 'pdf-viewer'
       })
     }
   },

packages/web-app-preview/src/App.vue

@@ -117,17 +117,18 @@
     </div>
   </main>
 </template>
-<script>
+<script lang="ts">
+import { defineComponent } from '@vue/runtime-core'
 import { mapGetters } from 'vuex'
 import { useAppDefaults } from 'web-pkg/src/composables'
 import Preview from './index'
 
-export default {
+export default defineComponent({
   name: 'Preview',
   setup() {
     return {
       ...useAppDefaults({
-        applicationName: 'media'
+        applicationId: 'preview'
       })
     }
   },
@@ -359,7 +360,7 @@ export default {
       this.updateLocalHistory()
     }
   }
-}
+})
 </script>
 
 <style lang="scss" scoped>

packages/web-app-text-editor/src/App.vue

@@ -77,7 +77,7 @@ export default {
   },
   setup() {
     const defaults = useAppDefaults({
-      applicationName: 'text-editor'
+      applicationId: 'text-editor'
     })
     const { applicationConfig, currentFileContext } = defaults
     const serverContent = ref()

packages/web-container/index.html.ejs

@@ -63,7 +63,7 @@
   </noscript>
   <script>
     var loader = document.getElementById('splash-loading')
-    var loaderTimer = setTimeout(function () {  
+    var loaderTimer = setTimeout(function () {
       loader.classList.remove('splash-loading-hide')
     }, 1000);
 
@@ -90,7 +90,7 @@
         throw e
       })
     }
-    
+
   </script>
 </body>
 </html>

packages/web-pkg/src/composables/appDefaults/types.ts

@@ -7,3 +7,5 @@ export interface FileContext {
   routeParams: MaybeRef<LocationParams>
   routeQuery: MaybeRef<LocationQuery>
 }
+
+export type AppConfigObject = Record<string, any>

packages/web-pkg/src/composables/appDefaults/useAppConfig.ts

@@ -1,27 +1,21 @@
 import { Store } from 'vuex'
-import { computed, Ref } from '@vue/composition-api'
-
+import { computed, Ref, unref } from '@vue/composition-api'
+import { useAppMeta } from './useAppMeta'
+import type { AppConfigObject } from './types'
 interface AppConfigOptions {
   store: Store<any>
-  applicationName: string
+  applicationId: string
 }
 
-type AppConfigObject = Record<string, any>
-
 export interface AppConfigResult {
   applicationConfig: Ref<AppConfigObject>
 }
 
 export function useAppConfig(options: AppConfigOptions): AppConfigResult {
-  const store = options.store
-  const applicationName = options.applicationName
-  const applicationConfig = computed(() => {
-    const editor = store.state.apps.fileEditors.find((e) => e.app === applicationName)
-    if (!editor) {
-      throw new Error(`useAppConfig: could not find config for applicationName: ${applicationName}`)
-    }
-    return editor.config || {}
-  })
+  const applicationMetaResult = useAppMeta(options)
+  const applicationConfig = computed(
+    () => unref(applicationMetaResult.applicationMeta).config || {}
+  )
 
   return {
     applicationConfig

packages/web-pkg/src/composables/appDefaults/useAppDefaults.ts

@@ -1,7 +1,7 @@
 import { computed, unref, Ref } from '@vue/composition-api'
 import { useRouter, useRoute } from '../router'
 import { useStore } from '../store'
-import { ClientService, clientService as defaultClientService } from '../../services'
+import { ClientService } from '../../services'
 import { basename } from 'path'
 
 import { FileContext } from './types'
@@ -14,13 +14,16 @@ import {
 import { useAppConfig, AppConfigResult } from './useAppConfig'
 import { useAppFileHandling, AppFileHandlingResult } from './useAppFileHandling'
 import { useAppFolderHandling, AppFolderHandlingResult } from './useAppFolderHandling'
+import { useAppDocumentTitle } from './useAppDocumentTitle'
+import { usePublicLinkPassword, usePublicLinkContext } from '../authContext'
+import { useClientService } from '../clientService'
 
 // TODO: this file/folder contains file/folder loading logic extracted from preview and drawio extensions
 // Discussion how to progress from here can be found in this issue:
 // https://github.com/owncloud/web/issues/3301
 
 interface AppDefaultsOptions {
-  applicationName: string
+  applicationId: string
   clientService?: ClientService
 }
 
@@ -36,25 +39,11 @@ export function useAppDefaults(options: AppDefaultsOptions): AppDefaultsResult {
   const router = useRouter()
   const store = useStore()
   const currentRoute = useRoute()
-  const clientService = options.clientService || defaultClientService
+  const clientService = options.clientService ?? useClientService()
+  const applicationId = options.applicationId
 
-  const isPublicLinkContext = computed(() => {
-    return unref(currentRoute).query[contextRouteNameKey] === 'files-public-files'
-  })
-
-  const publicLinkPassword = computed(() => {
-    return store.getters['Files/publicLinkPassword']
-  })
-
-  const accessToken = computed(() => {
-    return store.getters.getToken
-  })
-
-  const publicToken = computed(() => {
-    return (unref(currentRoute).params.item || unref(currentRoute).params.filePath || '').split(
-      '/'
-    )[0]
-  })
+  const isPublicLinkContext = usePublicLinkContext({ currentRoute })
+  const publicLinkPassword = usePublicLinkPassword({ store })
 
   const currentFileContext = computed((): FileContext => {
     const queryItemAsString = (queryItem: string | string[]) => {
@@ -65,7 +54,7 @@ export function useAppDefaults(options: AppDefaultsOptions): AppDefaultsResult {
       return queryItem
     }
 
-    const path = `/${unref(currentRoute).params.filePath.split('/').filter(Boolean).join('/')}`
+    const path = `/${unref(currentRoute).params.filePath?.split('/').filter(Boolean).join('/')}`
 
     return {
       path,
@@ -75,19 +64,17 @@ export function useAppDefaults(options: AppDefaultsOptions): AppDefaultsResult {
     }
   })
 
+  useAppDocumentTitle({ store, document, applicationId, currentFileContext })
+
   return {
     isPublicLinkContext,
     currentFileContext,
-
     ...useAppConfig({ store, ...options }),
     ...useAppNavigation({ router, currentFileContext }),
     ...useAppFileHandling({
       clientService,
-      store,
       isPublicLinkContext,
-      publicLinkPassword,
-      accessToken,
-      publicToken
+      publicLinkPassword
     }),
     ...useAppFolderHandling({ clientService, store, isPublicLinkContext, publicLinkPassword })
   }

packages/web-pkg/src/composables/appDefaults/useAppDocumentTitle.ts

@@ -0,0 +1,36 @@
+import { Ref, computed, unref } from '@vue/composition-api'
+import { basename } from 'path'
+import { FileContext } from './types'
+import { useAppMeta } from './useAppMeta'
+import { useDocumentTitle } from './useDocumentTitle'
+import { Store } from 'vuex'
+
+interface AppDocumentTitleOptions {
+  store: Store<any>
+  document: Document
+  applicationId: string
+  currentFileContext: Ref<FileContext>
+}
+
+export function useAppDocumentTitle({
+  store,
+  document,
+  applicationId,
+  currentFileContext
+}: AppDocumentTitleOptions): void {
+  const appMeta = useAppMeta({ applicationId, store })
+
+  const title = computed(() => {
+    const fileName = basename(unref(unref(currentFileContext).fileName))
+    const meta = unref(unref(appMeta).applicationMeta)
+
+    return [fileName, meta.name || meta.id, store.getters.configuration.currentTheme.general.name]
+      .filter(Boolean)
+      .join(' - ')
+  })
+
+  useDocumentTitle({
+    document,
+    title
+  })
+}

packages/web-pkg/src/composables/appDefaults/useAppFileHandling.ts

@@ -1,38 +1,29 @@
-import { Store } from 'vuex'
 import { unref } from '@vue/composition-api'
 import qs from 'qs'
 
 import { Resource } from 'files/src/helpers/resource'
 import { MaybeRef } from '../../utils'
-import { ClientService, clientService as defaultClientService } from '../../services'
+import { ClientService } from '../../services'
 import { DavProperties } from '../../constants'
-
 interface AppFileHandlingOptions {
-  store: Store<any>
-  clientService?: ClientService
+  clientService: ClientService
   isPublicLinkContext: MaybeRef<boolean>
-  accessToken: MaybeRef<string>
   publicLinkPassword: MaybeRef<string>
-  publicToken: MaybeRef<string>
 }
 
 type QueryParameters = Record<string, string>
 export interface AppFileHandlingResult {
   getUrlForResource(r: Resource, query?: QueryParameters): string
-
-  makeRequest(method: string, url: string, extraHeaders: Record<string, any>): Promise<any>
   getFileInfo(filePath: string, davProperties: DavProperties): Promise<any>
   getFileContents(filePath: string, options: Record<string, any>): Promise<any>
   putFileContents(filePath: string, content: string, options: Record<string, any>): Promise<any>
 }
 
-export function useAppFileHandling(options: AppFileHandlingOptions): AppFileHandlingResult {
-  const client = (options.clientService || defaultClientService).owncloudSdk
-  const isPublicLinkContext = options.isPublicLinkContext
-  const publicLinkPassword = options.publicLinkPassword
-  const publicToken = options.publicToken
-  const accessToken = options.accessToken
-
+export function useAppFileHandling({
+  clientService: { owncloudSdk: client },
+  isPublicLinkContext,
+  publicLinkPassword
+}: AppFileHandlingOptions): AppFileHandlingResult {
   const getUrlForResource = (
     { webDavPath, downloadURL }: Resource,
     query: QueryParameters = null
@@ -60,30 +51,6 @@ export function useAppFileHandling(options: AppFileHandlingOptions): AppFileHand
     return [client.files.getFileUrl(webDavPath), queryStr].filter(Boolean).join('?')
   }
 
-  const makeRequest = async (method: string, url: string, extraHeaders: Record<string, any>) => {
-    const plToken = unref(publicToken)
-    const plPassword = unref(publicLinkPassword)
-    const isPlCtx = unref(isPublicLinkContext)
-    const aToken = unref(accessToken)
-
-    const headers = {
-      'X-Requested-With': 'XMLHttpRequest',
-      ...(isPlCtx &&
-        plPassword && {
-          Authorization: 'Basic ' + Buffer.from(['public', plPassword].join(':')).toString('base64')
-        }),
-      ...(isPlCtx && plToken && { 'public-token': plToken }),
-      ...(aToken && { Authorization: 'Bearer ' + aToken })
-    }
-    return fetch(url, {
-      method,
-      headers: {
-        ...headers,
-        ...extraHeaders
-      }
-    })
-  }
-
   const getFileContents = async (filePath: string, options: Record<string, any>) => {
     if (unref(isPublicLinkContext)) {
       const res = await client.publicFiles.download('', filePath, unref(publicLinkPassword))
@@ -139,7 +106,6 @@ export function useAppFileHandling(options: AppFileHandlingOptions): AppFileHand
   }
 
   return {
-    makeRequest,
     getFileContents,
     getUrlForResource,
     getFileInfo,

packages/web-pkg/src/composables/appDefaults/useAppFolderHandling.ts

@@ -2,7 +2,7 @@ import { Store } from 'vuex'
 import { computed, Ref, ref, unref } from '@vue/composition-api'
 import { dirname } from 'path'
 
-import { ClientService, clientService as defaultClientService } from '../../services'
+import { ClientService } from '../../services'
 import { MaybeRef } from '../../utils'
 
 import { DavProperties } from '../../constants'
@@ -25,13 +25,12 @@ export interface AppFolderHandlingResult {
   loadFolderForFileContext(context: MaybeRef<FileContext>): Promise<any>
 }
 
-export function useAppFolderHandling(options: AppFolderHandlingOptions): AppFolderHandlingResult {
-  const client = (options.clientService || defaultClientService).owncloudSdk
-  const store = options.store
-
-  const isPublicLinkContext = options.isPublicLinkContext
-  const publicLinkPassword = options.publicLinkPassword
-
+export function useAppFolderHandling({
+  store,
+  clientService: { owncloudSdk: client },
+  isPublicLinkContext,
+  publicLinkPassword
+}: AppFolderHandlingOptions): AppFolderHandlingResult {
   const isFolderLoading = ref(false)
   const activeFiles = computed(() => {
     return store.getters['Files/activeFiles']