Merge remote-tracking branch 'origin/develop' into better-selects

* origin/develop: (76 commits)
  Translated using Weblate (Italian)
  Translated using Weblate (Basque)
  Translated using Weblate (Spanish)
  Translated using Weblate (Chinese (Simplified))
  Translated using Weblate (Italian)
  Translated using Weblate (Chinese (Traditional))
  Translated using Weblate (Russian)
  Translated using Weblate (Italian)
  Translated using Weblate (French)
  Translated using Weblate (Russian)
  Translated using Weblate (Italian)
  Translated using Weblate (French)
  Translated using Weblate (Basque)
  Translated using Weblate (Spanish)
  Translated using Weblate (Chinese (Simplified))
  Translated using Weblate (Japanese)
  Translated using Weblate (Italian)
  Translated using Weblate (Esperanto)
  Translated using Weblate (Chinese (Traditional))
  Translated using Weblate (Norwegian Bokmål)
  ...

1 files changed, 124 insertions, 0 deletions

diff --git a/src/components/settings_modal/settings_modal.js b/src/components/settings_modal/settings_modal.js
index f0d49c91..04043483 100644
--- a/src/components/settings_modal/settings_modal.js
+++ b/src/components/settings_modal/settings_modal.js
@@ -2,10 +2,55 @@ import Modal from 'src/components/modal/modal.vue'
 import PanelLoading from 'src/components/panel_loading/panel_loading.vue'
 import AsyncComponentError from 'src/components/async_component_error/async_component_error.vue'
 import getResettableAsyncComponent from 'src/services/resettable_async_component.js'
+import Popover from '../popover/popover.vue'
+import { library } from '@fortawesome/fontawesome-svg-core'
+import { cloneDeep } from 'lodash'
+import {
+  newImporter,
+  newExporter
+} from 'src/services/export_import/export_import.js'
+import {
+  faTimes,
+  faFileUpload,
+  faFileDownload,
+  faChevronDown
+} from '@fortawesome/free-solid-svg-icons'
+import {
+  faWindowMinimize
+} from '@fortawesome/free-regular-svg-icons'
+
+const PLEROMAFE_SETTINGS_MAJOR_VERSION = 1
+const PLEROMAFE_SETTINGS_MINOR_VERSION = 0
+
+library.add(
+  faTimes,
+  faWindowMinimize,
+  faFileUpload,
+  faFileDownload,
+  faChevronDown
+)
 
 const SettingsModal = {
+  data () {
+    return {
+      dataImporter: newImporter({
+        validator: this.importValidator,
+        onImport: this.onImport,
+        onImportFailure: this.onImportFailure
+      }),
+      dataThemeExporter: newExporter({
+        filename: 'pleromafe_settings.full',
+        getExportedObject: () => this.generateExport(true)
+      }),
+      dataExporter: newExporter({
+        filename: 'pleromafe_settings',
+        getExportedObject: () => this.generateExport()
+      })
+    }
+  },
   components: {
     Modal,
+    Popover,
     SettingsModalContent: getResettableAsyncComponent(
       () => import('./settings_modal_content.vue'),
       {
@@ -21,6 +66,85 @@ const SettingsModal = {
     },
     peekModal () {
       this.$store.dispatch('togglePeekSettingsModal')
+    },
+    importValidator (data) {
+      if (!Array.isArray(data._pleroma_settings_version)) {
+        return {
+          messageKey: 'settings.file_import_export.invalid_file'
+        }
+      }
+
+      const [major, minor] = data._pleroma_settings_version
+
+      if (major > PLEROMAFE_SETTINGS_MAJOR_VERSION) {
+        return {
+          messageKey: 'settings.file_export_import.errors.file_too_new',
+          messageArgs: {
+            fileMajor: major,
+            feMajor: PLEROMAFE_SETTINGS_MAJOR_VERSION
+          }
+        }
+      }
+
+      if (major < PLEROMAFE_SETTINGS_MAJOR_VERSION) {
+        return {
+          messageKey: 'settings.file_export_import.errors.file_too_old',
+          messageArgs: {
+            fileMajor: major,
+            feMajor: PLEROMAFE_SETTINGS_MAJOR_VERSION
+          }
+        }
+      }
+
+      if (minor > PLEROMAFE_SETTINGS_MINOR_VERSION) {
+        this.$store.dispatch('pushGlobalNotice', {
+          level: 'warning',
+          messageKey: 'settings.file_export_import.errors.file_slightly_new'
+        })
+      }
+
+      return true
+    },
+    onImportFailure (result) {
+      if (result.error) {
+        this.$store.dispatch('pushGlobalNotice', { messageKey: 'settings.invalid_settings_imported', level: 'error' })
+      } else {
+        this.$store.dispatch('pushGlobalNotice', { ...result.validationResult, level: 'error' })
+      }
+    },
+    onImport (data) {
+      if (data) { this.$store.dispatch('loadSettings', data) }
+    },
+    restore () {
+      this.dataImporter.importData()
+    },
+    backup () {
+      this.dataExporter.exportData()
+    },
+    backupWithTheme () {
+      this.dataThemeExporter.exportData()
+    },
+    generateExport (theme = false) {
+      const { config } = this.$store.state
+      let sample = config
+      if (!theme) {
+        const ignoreList = new Set([
+          'customTheme',
+          'customThemeSource',
+          'colors'
+        ])
+        sample = Object.fromEntries(
+          Object
+            .entries(sample)
+            .filter(([key]) => !ignoreList.has(key))
+        )
+      }
+      const clone = cloneDeep(sample)
+      clone._pleroma_settings_version = [
+        PLEROMAFE_SETTINGS_MAJOR_VERSION,
+        PLEROMAFE_SETTINGS_MINOR_VERSION
+      ]
+      return clone
     }
   },
   computed: {