get rid of boilerplate

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

@@ -0,0 +1,16 @@
+<template>
+  <object class="pdf-viewer oc-width-1-1 oc-height-1-1" :data="url" type="application/pdf" />
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue'
+
+export default defineComponent({
+  props: {
+    url: {
+      type: String,
+      required: true
+    }
+  }
+})
+</script>

packages/web-app-pdf-viewer/src/index.ts

@@ -1,5 +1,6 @@
 import translations from '../l10n/translations.json'
-import App from './App.vue'
+import { AppWrapperRoute } from 'web-pkg/src/components/AppTemplates/AppWrapperRoute'
+import PdfViewer from './PdfViewer.vue'
 
 // just a dummy function to trick gettext tools
 function $gettext(msg) {
@@ -9,7 +10,12 @@ function $gettext(msg) {
 const routes = [
   {
     path: '/:driveAliasAndItem(.*)?',
-    component: App,
+    component: AppWrapperRoute(PdfViewer, {
+      applicationId: 'pdf-viewer',
+      urlForResourceOptions: {
+        disposition: 'inline'
+      }
+    }),
     name: 'pdf-viewer',
     meta: {
       authContext: 'hybrid',

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

@@ -1,5 +1,6 @@
-import App from './App.vue'
 import translations from '../l10n/translations.json'
+import TextEditor from './TextEditor.vue'
+import { AppWrapperRoute } from 'web-pkg/src/components/AppTemplates/AppWrapperRoute'
 
 // just a dummy function to trick gettext tools
 function $gettext(msg) {
@@ -11,7 +12,9 @@ const appId = 'text-editor'
 const routes = [
   {
     path: '/:driveAliasAndItem(.*)?',
-    component: App,
+    component: AppWrapperRoute(TextEditor, {
+      applicationId: appId
+    }),
     name: 'text-editor',
     meta: {
       authContext: 'hybrid',

packages/web-pkg/src/components/AppTemplates/AppWrapperRoute.ts

@@ -0,0 +1,25 @@
+import { defineComponent, h } from 'vue'
+import AppWrapper, { AppWrapperSlotArgs } from './AppWrapper.vue'
+import { UrlForResourceOptions } from 'web-pkg/src/composables'
+
+export function AppWrapperRoute(
+  fileEditor: ReturnType<typeof defineComponent>,
+  options: { applicationId: string; urlForResourceOptions?: UrlForResourceOptions }
+) {
+  return defineComponent({
+    render() {
+      return h(AppWrapper, options, {
+        default: (slotArgs: AppWrapperSlotArgs) => {
+          const { currentContent, ...restArgs } = slotArgs
+          return h(fileEditor, {
+            currentContent: currentContent.value,
+            'onUpdate:currentContent': (value) => {
+              currentContent.value = value
+            },
+            ...restArgs
+          })
+        }
+      })
+    }
+  })
+}