enh(AutoSync): Add an explantion in settings

fixes #1832 Signed-off-by: Marcel Klehr <[email protected]>
floccusaddon · Jan 18, 2025 · 1c29f2b · 1c29f2b
1 parent 3d97f82
commit 1c29f2b
Show file tree

Hide file tree

Showing 7 changed files with 61 additions and 40 deletions.
diff --git a/_locales/en/messages.json b/_locales/en/messages.json
@@ -812,5 +812,8 @@
   },
   "DescriptionScheduledforcesync": {
     "message": "Do you really want to force sync? Syncing with two devices at the same time can have unforeseen consequences including corruption of your data. Make sure that no other device is syncing at the moment before confirming."
+  },
+  "DescriptionAutosync": {
+    "message": "Turning on automatic sync, will make sure a sync run is triggered regularly within a certain configurable interval as well as on demand a few seconds after you make changes. If you don't turn on automatic sync you will need to trigger sync runs manually by press the sync button."
   }
 }
diff --git a/src/ui/components/OptionAutoSync.vue b/src/ui/components/OptionAutoSync.vue
@@ -0,0 +1,33 @@
+<template>
+  <div>
+    <div class="text-h6">
+      {{ t('LabelAutosync') }}
+    </div>
+    <div class="caption">
+      {{ t('DescriptionAutosync') }}
+    </div>
+    <v-switch
+      :input-value="value"
+      :aria-label="t('LabelAutosync')"
+      :label="t('LabelAutosync')"
+      dense
+      class="mt-0 pt-0"
+      @change="$emit('input', $event)" />
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'OptionAutoSync',
+  props: {
+    value: {
+      type: Boolean,
+      default: true,
+    }
+  },
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/ui/components/OptionsGit.vue b/src/ui/components/OptionsGit.vue
@@ -93,13 +93,9 @@
         {{ t('LabelOptionsSyncBehavior') }}
       </v-card-title>
       <v-card-text>
-        <v-switch
-          :input-value="enabled"
-          :aria-label="t('LabelAutosync')"
-          :label="t('LabelAutosync')"
-          dense
-          class="mt-0 pt-0"
-          @change="$emit('update:enabled', $event)" />
+        <OptionAutoSync
+          :value="enabled"
+          @input="$emit('update:enabled', $event)" />
         <OptionSyncInterval
           :value="syncInterval"
           @input="$emit('update:syncInterval', $event)" />
@@ -154,10 +150,11 @@ import OptionDownloadLogs from './OptionDownloadLogs'
 import OptionAllowNetwork from './native/OptionAllowNetwork'
 import OptionFileType from './OptionFileType'
 import OptionExportBookmarks from './OptionExportBookmarks.vue'
+import OptionAutoSync from './OptionAutoSync.vue'
 
 export default {
   name: 'OptionsGit',
-  components: { OptionExportBookmarks, OptionAllowNetwork, OptionDownloadLogs, OptionAllowRedirects, OptionClientCert, OptionFailsafe, OptionSyncFolder, OptionDeleteAccount, OptionSyncStrategy, OptionResetCache, OptionSyncInterval, OptionNestedSync, OptionFileType },
+  components: { OptionAutoSync, OptionExportBookmarks, OptionAllowNetwork, OptionDownloadLogs, OptionAllowRedirects, OptionClientCert, OptionFailsafe, OptionSyncFolder, OptionDeleteAccount, OptionSyncStrategy, OptionResetCache, OptionSyncInterval, OptionNestedSync, OptionFileType },
   props: ['url', 'username', 'password', 'branch', 'includeCredentials', 'serverRoot', 'localRoot', 'allowNetwork', 'syncInterval', 'strategy', 'bookmark_file', 'nestedSync', 'failsafe', 'allowRedirects', 'bookmark_file_type', 'enabled', 'label'],
   data() {
     return {

diff --git a/src/ui/components/OptionsGoogleDrive.vue b/src/ui/components/OptionsGoogleDrive.vue
@@ -91,13 +91,9 @@
         {{ t('LabelOptionsSyncBehavior') }}
       </v-card-title>
       <v-card-text>
-        <v-switch
-          :input-value="enabled"
-          :aria-label="t('LabelAutosync')"
-          :label="t('LabelAutosync')"
-          dense
-          class="mt-0 pt-0"
-          @change="$emit('update:enabled', $event)" />
+        <OptionAutoSync
+            :value="enabled"
+            @input="$emit('update:enabled', $event)" />
         <OptionSyncInterval
           :value="syncInterval"
           @input="$emit('update:syncInterval', $event)" />
@@ -142,10 +138,11 @@ import OptionDownloadLogs from './OptionDownloadLogs'
 import OptionAllowNetwork from './native/OptionAllowNetwork'
 import OptionPassphrase from './OptionPassphrase'
 import OptionExportBookmarks from './OptionExportBookmarks.vue'
+import OptionAutoSync from './OptionAutoSync.vue'
 
 export default {
   name: 'OptionsGoogleDrive',
-  components: { OptionExportBookmarks, OptionPassphrase, OptionAllowNetwork, OptionDownloadLogs, OptionFailsafe, OptionSyncFolder, OptionDeleteAccount, OptionSyncStrategy, OptionResetCache, OptionSyncInterval, OptionNestedSync },
+  components: { OptionAutoSync, OptionExportBookmarks, OptionPassphrase, OptionAllowNetwork, OptionDownloadLogs, OptionFailsafe, OptionSyncFolder, OptionDeleteAccount, OptionSyncStrategy, OptionResetCache, OptionSyncInterval, OptionNestedSync },
   props: ['username', 'password', 'refreshToken', 'localRoot', 'allowNetwork', 'syncInterval', 'strategy', 'bookmark_file', 'nestedSync', 'failsafe', 'enabled', 'label'],
   data() {
     return {

diff --git a/src/ui/components/OptionsLinkwarden.vue b/src/ui/components/OptionsLinkwarden.vue
@@ -86,13 +86,9 @@
         {{ t('LabelOptionsSyncBehavior') }}
       </v-card-title>
       <v-card-text>
-        <v-switch
-          :input-value="enabled"
-          :aria-label="t('LabelAutosync')"
-          :label="t('LabelAutosync')"
-          dense
-          class="mt-0 pt-0"
-          @change="$emit('update:enabled', $event)" />
+        <OptionAutoSync
+          :value="enabled"
+          @input="$emit('update:enabled', $event)" />
         <OptionSyncInterval
           :value="syncInterval"
           @input="$emit('update:syncInterval', $event)" />
@@ -146,10 +142,11 @@ import OptionAllowRedirects from './OptionAllowRedirects'
 import OptionDownloadLogs from './OptionDownloadLogs'
 import OptionAllowNetwork from './native/OptionAllowNetwork'
 import OptionExportBookmarks from './OptionExportBookmarks.vue'
+import OptionAutoSync from './OptionAutoSync.vue'
 
 export default {
   name: 'OptionsLinkwarden',
-  components: { OptionExportBookmarks, OptionAllowNetwork, OptionDownloadLogs, OptionAllowRedirects, OptionClientCert, OptionFailsafe, OptionSyncFolder, OptionDeleteAccount, OptionSyncStrategy, OptionResetCache, OptionSyncInterval, OptionNestedSync },
+  components: { OptionAutoSync, OptionExportBookmarks, OptionAllowNetwork, OptionDownloadLogs, OptionAllowRedirects, OptionClientCert, OptionFailsafe, OptionSyncFolder, OptionDeleteAccount, OptionSyncStrategy, OptionResetCache, OptionSyncInterval, OptionNestedSync },
   props: ['url', 'username', 'password', 'serverFolder', 'includeCredentials', 'serverRoot', 'localRoot', 'allowNetwork', 'syncInterval', 'strategy', 'nestedSync', 'failsafe', 'allowRedirects', 'enabled', 'label'],
   data() {
     return {

diff --git a/src/ui/components/OptionsNextcloudBookmarks.vue b/src/ui/components/OptionsNextcloudBookmarks.vue
@@ -82,13 +82,9 @@
         {{ t('LabelOptionsSyncBehavior') }}
       </v-card-title>
       <v-card-text>
-        <v-switch
-          :input-value="enabled"
-          :aria-label="t('LabelAutosync')"
-          :label="t('LabelAutosync')"
-          dense
-          class="mt-0 pt-0"
-          @change="$emit('update:enabled', $event)" />
+        <OptionAutoSync
+          :value="enabled"
+          @input="$emit('update:enabled', $event)" />
         <OptionSyncInterval
           :value="syncInterval"
           @input="$emit('update:syncInterval', $event)" />
@@ -153,10 +149,11 @@ import OptionDownloadLogs from './OptionDownloadLogs'
 import OptionAllowNetwork from './native/OptionAllowNetwork'
 import OptionExportBookmarks from './OptionExportBookmarks.vue'
 import { actions } from '../store/definitions'
+import OptionAutoSync from './OptionAutoSync.vue'
 
 export default {
   name: 'OptionsNextcloudBookmarks',
-  components: { OptionExportBookmarks, OptionAllowNetwork, OptionDownloadLogs, OptionAllowRedirects, OptionClientCert, OptionFailsafe, OptionNestedSync, NextcloudLogin, OptionSyncFolder, OptionDeleteAccount, OptionSyncStrategy, OptionResetCache, OptionSyncInterval },
+  components: { OptionAutoSync, OptionExportBookmarks, OptionAllowNetwork, OptionDownloadLogs, OptionAllowRedirects, OptionClientCert, OptionFailsafe, OptionNestedSync, NextcloudLogin, OptionSyncFolder, OptionDeleteAccount, OptionSyncStrategy, OptionResetCache, OptionSyncInterval },
   props: ['url', 'username', 'password', 'includeCredentials', 'serverRoot', 'localRoot', 'allowNetwork', 'syncInterval', 'strategy', 'nestedSync', 'failsafe', 'allowRedirects', 'enabled', 'label', 'clickCountEnabled'],
   data() {
     return {

diff --git a/src/ui/components/OptionsWebdav.vue b/src/ui/components/OptionsWebdav.vue
@@ -91,13 +91,9 @@
         {{ t('LabelOptionsSyncBehavior') }}
       </v-card-title>
       <v-card-text>
-        <v-switch
-          :input-value="enabled"
-          :aria-label="t('LabelAutosync')"
-          :label="t('LabelAutosync')"
-          dense
-          class="mt-0 pt-0"
-          @change="$emit('update:enabled', $event)" />
+        <OptionAutoSync
+          :value="enabled"
+          @input="$emit('update:enabled', $event)" />
         <OptionSyncInterval
           :value="syncInterval"
           @input="$emit('update:syncInterval', $event)" />
@@ -153,10 +149,11 @@ import OptionAllowNetwork from './native/OptionAllowNetwork'
 import OptionFileType from './OptionFileType'
 import OptionExportBookmarks from './OptionExportBookmarks.vue'
 import OptionPassphrase from './OptionPassphrase.vue'
+import OptionAutoSync from './OptionAutoSync.vue'
 
 export default {
   name: 'OptionsWebdav',
-  components: { OptionExportBookmarks, OptionAllowNetwork, OptionDownloadLogs, OptionAllowRedirects, OptionClientCert, OptionFailsafe, OptionSyncFolder, OptionDeleteAccount, OptionSyncStrategy, OptionResetCache, OptionSyncInterval, OptionNestedSync, OptionFileType, OptionPassphrase },
+  components: { OptionAutoSync, OptionExportBookmarks, OptionAllowNetwork, OptionDownloadLogs, OptionAllowRedirects, OptionClientCert, OptionFailsafe, OptionSyncFolder, OptionDeleteAccount, OptionSyncStrategy, OptionResetCache, OptionSyncInterval, OptionNestedSync, OptionFileType, OptionPassphrase },
   props: ['url', 'username', 'password','passphrase', 'includeCredentials', 'serverRoot', 'localRoot', 'allowNetwork', 'syncInterval', 'strategy', 'bookmark_file', 'nestedSync', 'failsafe', 'allowRedirects', 'bookmark_file_type', 'enabled', 'label'],
   data() {
     return {