From 67f378637c7465e22cddc6dc278c414ca4804a3e Mon Sep 17 00:00:00 2001
From: elizavetaRa <svillyfly@mail.ru>
Date: Thu, 16 Feb 2023 17:35:16 +0100
Subject: [PATCH 1/7] Configurable autosave for text editor

---
 .../enhancement-autosave-text-editor-changes  |  5 +++++
 packages/web-app-text-editor/src/App.vue      | 20 ++++++++++++++++++-
 2 files changed, 24 insertions(+), 1 deletion(-)
 create mode 100644 changelog/unreleased/enhancement-autosave-text-editor-changes

diff --git a/changelog/unreleased/enhancement-autosave-text-editor-changes b/changelog/unreleased/enhancement-autosave-text-editor-changes
new file mode 100644
index 00000000000..7e1d0cd0afa
--- /dev/null
+++ b/changelog/unreleased/enhancement-autosave-text-editor-changes
@@ -0,0 +1,5 @@
+Enhancement: Autosave content changes in text editor
+
+We have added the configurable functionality to autosave content changes in text editor.
+
+https://github.com/owncloud/web/pull/8455
diff --git a/packages/web-app-text-editor/src/App.vue b/packages/web-app-text-editor/src/App.vue
index 3caf76a999a..c4650e0b4f7 100644
--- a/packages/web-app-text-editor/src/App.vue
+++ b/packages/web-app-text-editor/src/App.vue
@@ -102,6 +102,7 @@ export default defineComponent({
     const resource: Ref<Resource> = ref()
     const store = useStore()
     const { $gettext, interpolate: $gettextInterpolate } = useGettext()
+    let autosaveInterval = ref(null)
 
     const errorPopup = (error) => {
       store.dispatch('showMessage', {
@@ -111,6 +112,12 @@ export default defineComponent({
       })
     }
 
+    const autosavePopup = () => {
+      store.dispatch('showMessage', {
+        title: $gettext('File autosaved')
+      })
+    }
+
     const loadFileTask = useTask(function* () {
       resource.value = yield getFileInfo(currentFileContext, {
         davProperties: [DavProperty.FileId, DavProperty.Permissions, DavProperty.Name]
@@ -194,7 +201,7 @@ export default defineComponent({
     })
 
     const isLoading = computed(() => {
-      return loadFileTask.isRunning || saveFileTask.isRunning
+      return loadFileTask.isRunning
     })
 
     const showPreview = computed(() => {
@@ -215,11 +222,22 @@ export default defineComponent({
       document.addEventListener('keydown', handleSKey, false)
       // Ensure reload is not possible if there are changes
       window.addEventListener('beforeunload', handleUnload)
+
+      // Autosave
+      const editorOptions = store.getters.configuration?.options?.editor
+      if (editorOptions?.autosaveEnabled && editorOptions?.autosaveInterval) {
+        autosaveInterval.value = setInterval(() => {
+          if (isDirty.value) {
+            save().then((r) => autosavePopup())
+          }
+        }, editorOptions?.autosaveInterval)
+      }
     })
 
     onBeforeUnmount(() => {
       window.removeEventListener('beforeunload', handleUnload)
       document.removeEventListener('keydown', handleSKey, false)
+      clearInterval(autosaveInterval)
     })
 
     const save = async function () {

From 1c956db39b324c8a8d6efac1585ac56407139e61 Mon Sep 17 00:00:00 2001
From: Elizaveta Ragozina <elizaveta.ragozina@cern.ch>
Date: Thu, 16 Feb 2023 17:37:33 +0100
Subject: [PATCH 2/7] Add text editor autosave to getting-started.md

---
 docs/getting-started.md | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/docs/getting-started.md b/docs/getting-started.md
index 2389952febd..f726074b578 100644
--- a/docs/getting-started.md
+++ b/docs/getting-started.md
@@ -65,6 +65,8 @@ hovers the row with his mouse. Defaults to `false`.
 - `option.routing` This accepts an object with the following fields to customize the routing behaviour:
   - `options.routing.idBased` Enable or disable fileIds being added to the URL. Defaults to `true` because otherwise e.g. spaces with name clashes can't be resolved correctly. Only disable this if you can guarantee server side that spaces of the same namespace can't have name clashes.   
 - `options.upload.xhr.timeout` Specifies the timeout for XHR uploads in milliseconds.
+- `options.editor.autosaveEnabled` Specifies if the autosave for the text editor is enabled.
+- `options.editor.autosaveInterval` Specifies the time interval for the file editor autosave in milliseconds.
 
 ### Sentry
 

From 845c2a4a69d76a15b31a6f082167240c7a00df35 Mon Sep 17 00:00:00 2001
From: Pascal Wengerter <pascal@wengerter.info>
Date: Thu, 16 Feb 2023 22:56:19 +0100
Subject: [PATCH 3/7] Add default values for editor.autosave{Enabled,Interval},
 update text-editor implementation

---
 packages/web-app-text-editor/src/App.vue | 13 ++++++-------
 packages/web-runtime/src/store/config.ts |  4 ++++
 2 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/packages/web-app-text-editor/src/App.vue b/packages/web-app-text-editor/src/App.vue
index c4650e0b4f7..89df39a0ad0 100644
--- a/packages/web-app-text-editor/src/App.vue
+++ b/packages/web-app-text-editor/src/App.vue
@@ -102,7 +102,7 @@ export default defineComponent({
     const resource: Ref<Resource> = ref()
     const store = useStore()
     const { $gettext, interpolate: $gettextInterpolate } = useGettext()
-    let autosaveInterval = ref(null)
+    let autosaveIntervalId = null
 
     const errorPopup = (error) => {
       store.dispatch('showMessage', {
@@ -223,21 +223,20 @@ export default defineComponent({
       // Ensure reload is not possible if there are changes
       window.addEventListener('beforeunload', handleUnload)
 
-      // Autosave
-      const editorOptions = store.getters.configuration?.options?.editor
-      if (editorOptions?.autosaveEnabled && editorOptions?.autosaveInterval) {
-        autosaveInterval.value = setInterval(() => {
+      const editorOptions = store.getters.configuration.options.editor
+      if (editorOptions.autosaveEnabled) {
+        autosaveIntervalId = setInterval(() => {
           if (isDirty.value) {
             save().then((r) => autosavePopup())
           }
-        }, editorOptions?.autosaveInterval)
+        }, editorOptions.autosaveInterval)
       }
     })
 
     onBeforeUnmount(() => {
       window.removeEventListener('beforeunload', handleUnload)
       document.removeEventListener('keydown', handleSKey, false)
-      clearInterval(autosaveInterval)
+      clearInterval(autosaveIntervalId)
     })
 
     const save = async function () {
diff --git a/packages/web-runtime/src/store/config.ts b/packages/web-runtime/src/store/config.ts
index a10e5fef248..0e6cba0e7b4 100644
--- a/packages/web-runtime/src/store/config.ts
+++ b/packages/web-runtime/src/store/config.ts
@@ -37,6 +37,10 @@ const state = {
   options: {
     contextHelpers: true,
     defaultExtension: 'files',
+    editor: {
+      autosaveEnabled: false,
+      autosaveInterval: 120000
+    },
     // ugly hack to still have notifications but don't have
     // them blocking UI elements in acceptance/E2E tests
     topCenterNotifications: false,

From 9c0a712ebc087406f0252464b2b230f1443d5d0a Mon Sep 17 00:00:00 2001
From: Pascal Wengerter <pascal@wengerter.info>
Date: Thu, 16 Feb 2023 22:56:54 +0100
Subject: [PATCH 4/7] Reuse editor.autosaveEnabled for DrawIo extension

---
 dev/docker/ocis.web.config.json               |  1 -
 packages/web-app-draw-io/src/App.vue          | 32 ++++++++++---------
 .../src/composables/appDefaults/useAppMeta.ts |  1 -
 .../tests/unit/helpers/config.spec.ts         |  1 -
 4 files changed, 17 insertions(+), 18 deletions(-)

diff --git a/dev/docker/ocis.web.config.json b/dev/docker/ocis.web.config.json
index 42e1c4d8930..005a6038664 100644
--- a/dev/docker/ocis.web.config.json
+++ b/dev/docker/ocis.web.config.json
@@ -41,7 +41,6 @@
       "path": "web-app-draw-io",
       "config": {
         "url": "https://embed.diagrams.net",
-        "autosave": false,
         "theme": "minimal"
       }
     }
diff --git a/packages/web-app-draw-io/src/App.vue b/packages/web-app-draw-io/src/App.vue
index 385324da898..30d0c57c245 100644
--- a/packages/web-app-draw-io/src/App.vue
+++ b/packages/web-app-draw-io/src/App.vue
@@ -14,21 +14,25 @@
   </main>
 </template>
 <script lang="ts">
-import { mapActions } from 'vuex'
-import qs from 'qs'
 import { DateTime } from 'luxon'
-import { DavPermission, DavProperty } from 'web-client/src/webdav/constants'
-import { useAppDefaults } from 'web-pkg/src/composables'
-import { defineComponent } from 'vue'
 import { basename } from 'path'
+import qs from 'qs'
+import { defineComponent } from 'vue'
+import { mapActions } from 'vuex'
+import { DavPermission, DavProperty } from 'web-client/src/webdav/constants'
+import { useAppDefaults, useStore } from 'web-pkg/src/composables'
 
 export default defineComponent({
   name: 'DrawIoEditor',
   setup() {
+    const store = useStore()
+    const isAutoSaveEnabled = store.getters.configuration.options.editor.autosaveEnabled
+
     return {
       ...useAppDefaults({
         applicationId: 'draw-io'
-      })
+      }),
+      isAutoSaveEnabled
     }
   },
   data: () => ({
@@ -40,12 +44,8 @@ export default defineComponent({
   }),
   computed: {
     config() {
-      const {
-        url = 'https://embed.diagrams.net',
-        theme = 'minimal',
-        autosave = false
-      } = this.applicationConfig
-      return { url, theme, autosave: autosave ? 1 : 0 }
+      const { url = 'https://embed.diagrams.net', theme = 'minimal' } = this.applicationConfig
+      return { url, theme }
     },
     urlHost() {
       const url = new URL(this.config.url)
@@ -88,7 +88,9 @@ export default defineComponent({
             this.fileExtension === 'vsdx' ? this.importVisio() : this.load()
             break
           case 'autosave':
-            this.save(payload, true)
+            if (this.isAutoSaveEnabled) {
+              this.save(payload, true)
+            }
             break
           case 'save':
             this.save(payload)
@@ -148,7 +150,7 @@ export default defineComponent({
           JSON.stringify({
             action: 'load',
             xml: response.body,
-            autosave: this.config.autosave
+            autosave: this.isAutoSaveEnabled
           }),
           this.urlHost
         )
@@ -189,7 +191,7 @@ export default defineComponent({
               JSON.stringify({
                 action: 'load',
                 xml: reader.result,
-                autosave: this.config.autosave
+                autosave: this.isAutoSaveEnabled
               }),
               this.urlHost
             )
diff --git a/packages/web-pkg/src/composables/appDefaults/useAppMeta.ts b/packages/web-pkg/src/composables/appDefaults/useAppMeta.ts
index cf8e1a4b9ac..1849c7f1d91 100644
--- a/packages/web-pkg/src/composables/appDefaults/useAppMeta.ts
+++ b/packages/web-pkg/src/composables/appDefaults/useAppMeta.ts
@@ -9,7 +9,6 @@ interface AppMetaOptions {
 
 export interface AppMetaObject {
   config: AppConfigObject
-  autosave: boolean
   theme: string
   url: string
   icon: string
diff --git a/packages/web-runtime/tests/unit/helpers/config.spec.ts b/packages/web-runtime/tests/unit/helpers/config.spec.ts
index 27c10812ca3..2b63220b7f6 100644
--- a/packages/web-runtime/tests/unit/helpers/config.spec.ts
+++ b/packages/web-runtime/tests/unit/helpers/config.spec.ts
@@ -20,7 +20,6 @@ const validConfig = `{
       "path": "web-app-draw-io",
       "config": {
         "url": "https://embed.diagrams.net",
-        "autosave": false,
         "theme": "minimal"
       }
     }

From 376570a733ae1f053350f2bb61ee25239c3aa1f9 Mon Sep 17 00:00:00 2001
From: Pascal Wengerter <pascal@wengerter.info>
Date: Thu, 16 Feb 2023 23:07:36 +0100
Subject: [PATCH 5/7] Change: Globally configurable extension autosave

---
 .../change-configurable-extension-autosave           |  8 ++++++++
 packages/web-app-text-editor/tests/unit/app.spec.ts  |  8 ++++----
 .../src/mocks/store/defaultStoreMockOptions.ts       | 12 +++++++++---
 3 files changed, 21 insertions(+), 7 deletions(-)
 create mode 100644 changelog/unreleased/change-configurable-extension-autosave

diff --git a/changelog/unreleased/change-configurable-extension-autosave b/changelog/unreleased/change-configurable-extension-autosave
new file mode 100644
index 00000000000..78a3779d4f0
--- /dev/null
+++ b/changelog/unreleased/change-configurable-extension-autosave
@@ -0,0 +1,8 @@
+Change: Configurable extension autosave
+
+We have added a global setting in the configuration to enable autosave (and the corresponding timeout) for bundled and external extensions,
+instead of having a per-extension configuration which was limited to external extensions.
+Handling of the provided autosave needs to be taken care of by the extension itself.
+
+https://github.com/owncloud/web/pull/8455
+https://github.com/owncloud/web/pull/8457
diff --git a/packages/web-app-text-editor/tests/unit/app.spec.ts b/packages/web-app-text-editor/tests/unit/app.spec.ts
index b0af89015c5..35903648582 100644
--- a/packages/web-app-text-editor/tests/unit/app.spec.ts
+++ b/packages/web-app-text-editor/tests/unit/app.spec.ts
@@ -1,8 +1,7 @@
-import App from '../../src/App.vue'
-import { useAppDefaultsMock } from 'web-test-helpers/src/mocks/useAppDefaultsMock'
-import { FileContext, useAppDefaults } from 'web-pkg/src/composables/appDefaults'
 import { mock } from 'jest-mock-extended'
 import { ref } from 'vue'
+import { Resource } from 'web-client'
+import { FileContext, useAppDefaults } from 'web-pkg/src/composables/appDefaults'
 import {
   createStore,
   defaultPlugins,
@@ -11,7 +10,8 @@ import {
   defaultComponentMocks,
   defaultStubs
 } from 'web-test-helpers'
-import { Resource } from 'web-client'
+import { useAppDefaultsMock } from 'web-test-helpers/src/mocks/useAppDefaultsMock'
+import App from '../../src/App.vue'
 
 jest.mock('web-pkg/src/composables/appDefaults')
 
diff --git a/packages/web-test-helpers/src/mocks/store/defaultStoreMockOptions.ts b/packages/web-test-helpers/src/mocks/store/defaultStoreMockOptions.ts
index 158e0439c0c..6900f3cb7a8 100644
--- a/packages/web-test-helpers/src/mocks/store/defaultStoreMockOptions.ts
+++ b/packages/web-test-helpers/src/mocks/store/defaultStoreMockOptions.ts
@@ -11,9 +11,15 @@ export const defaultStoreMockOptions = {
     quota: jest.fn(() => ({})),
     capabilities: jest.fn().mockImplementation(() => ({})),
     user: jest.fn().mockImplementation(() => ({})),
-    configuration: jest
-      .fn()
-      .mockImplementation(() => ({ currentTheme: { general: { slogan: '' } } }))
+    configuration: jest.fn().mockImplementation(() => ({
+      currentTheme: { general: { slogan: '' } },
+      options: {
+        editor: {
+          autosaveEnabled: false,
+          autosaveInterval: 120000
+        }
+      }
+    }))
   },
   modules: {
     ...filesModuleMockOptions,

From 2ed582c9e3bb000fb4010c9b0229a7dc25f2f9fc Mon Sep 17 00:00:00 2001
From: Pascal Wengerter <pascal@wengerter.info>
Date: Thu, 16 Feb 2023 23:11:15 +0100
Subject: [PATCH 6/7] Streamline editor autosave documentation

Co-authored-by: Benedikt Kulmann <benedikt@kulmann.biz>
---
 docs/getting-started.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/docs/getting-started.md b/docs/getting-started.md
index f726074b578..04404a639fc 100644
--- a/docs/getting-started.md
+++ b/docs/getting-started.md
@@ -65,8 +65,8 @@ hovers the row with his mouse. Defaults to `false`.
 - `option.routing` This accepts an object with the following fields to customize the routing behaviour:
   - `options.routing.idBased` Enable or disable fileIds being added to the URL. Defaults to `true` because otherwise e.g. spaces with name clashes can't be resolved correctly. Only disable this if you can guarantee server side that spaces of the same namespace can't have name clashes.   
 - `options.upload.xhr.timeout` Specifies the timeout for XHR uploads in milliseconds.
-- `options.editor.autosaveEnabled` Specifies if the autosave for the text editor is enabled.
-- `options.editor.autosaveInterval` Specifies the time interval for the file editor autosave in milliseconds.
+- `options.editor.autosaveEnabled` Specifies if the autosave for the editor apps is enabled.
+- `options.editor.autosaveInterval` Specifies the time interval for the autosave of editor apps in milliseconds.
 
 ### Sentry
 

From dd43ac2b53d57244469ca2ed8631789ad2a72af8 Mon Sep 17 00:00:00 2001
From: Pascal Wengerter <pascal@wengerter.info>
Date: Thu, 16 Feb 2023 23:21:32 +0100
Subject: [PATCH 7/7] Only allow seconds (instead of milliseconds) in editor
 autosaveInterval config

---
 docs/getting-started.md                                         | 2 +-
 packages/web-app-text-editor/src/App.vue                        | 2 +-
 packages/web-runtime/src/store/config.ts                        | 2 +-
 .../web-test-helpers/src/mocks/store/defaultStoreMockOptions.ts | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/docs/getting-started.md b/docs/getting-started.md
index 04404a639fc..3409a284aea 100644
--- a/docs/getting-started.md
+++ b/docs/getting-started.md
@@ -66,7 +66,7 @@ hovers the row with his mouse. Defaults to `false`.
   - `options.routing.idBased` Enable or disable fileIds being added to the URL. Defaults to `true` because otherwise e.g. spaces with name clashes can't be resolved correctly. Only disable this if you can guarantee server side that spaces of the same namespace can't have name clashes.   
 - `options.upload.xhr.timeout` Specifies the timeout for XHR uploads in milliseconds.
 - `options.editor.autosaveEnabled` Specifies if the autosave for the editor apps is enabled.
-- `options.editor.autosaveInterval` Specifies the time interval for the autosave of editor apps in milliseconds.
+- `options.editor.autosaveInterval` Specifies the time interval for the autosave of editor apps in seconds.
 
 ### Sentry
 
diff --git a/packages/web-app-text-editor/src/App.vue b/packages/web-app-text-editor/src/App.vue
index 89df39a0ad0..e48c208891f 100644
--- a/packages/web-app-text-editor/src/App.vue
+++ b/packages/web-app-text-editor/src/App.vue
@@ -229,7 +229,7 @@ export default defineComponent({
           if (isDirty.value) {
             save().then((r) => autosavePopup())
           }
-        }, editorOptions.autosaveInterval)
+        }, editorOptions.autosaveInterval * 1000)
       }
     })
 
diff --git a/packages/web-runtime/src/store/config.ts b/packages/web-runtime/src/store/config.ts
index 0e6cba0e7b4..85c34f3d540 100644
--- a/packages/web-runtime/src/store/config.ts
+++ b/packages/web-runtime/src/store/config.ts
@@ -39,7 +39,7 @@ const state = {
     defaultExtension: 'files',
     editor: {
       autosaveEnabled: false,
-      autosaveInterval: 120000
+      autosaveInterval: 120
     },
     // ugly hack to still have notifications but don't have
     // them blocking UI elements in acceptance/E2E tests
diff --git a/packages/web-test-helpers/src/mocks/store/defaultStoreMockOptions.ts b/packages/web-test-helpers/src/mocks/store/defaultStoreMockOptions.ts
index 6900f3cb7a8..03373270c2c 100644
--- a/packages/web-test-helpers/src/mocks/store/defaultStoreMockOptions.ts
+++ b/packages/web-test-helpers/src/mocks/store/defaultStoreMockOptions.ts
@@ -16,7 +16,7 @@ export const defaultStoreMockOptions = {
       options: {
         editor: {
           autosaveEnabled: false,
-          autosaveInterval: 120000
+          autosaveInterval: 120
         }
       }
     }))