🔥 Removed cloud sync button from home, moved to config menu

src/components/Configuration/ConfigContainer.vue

@@ -13,11 +13,11 @@
           <EditIcon class="button-icon"/>
           {{ $t('config.edit-config-button') }}
         </button>
-        <button class="config-button center" @click="() => navigateToTab(3)">
+        <button class="config-button center" @click="() => navigateToTab(4)">
           <CustomCssIcon class="button-icon"/>
           {{ $t('config.edit-css-button') }}
         </button>
-        <button class="config-button center" @click="openCloudSync()">
+        <button class="config-button center" @click="() => navigateToTab(3)">
           <CloudIcon class="button-icon"/>
           {{backupId ? $t('config.edit-cloud-sync-button') : $t('config.cloud-sync-button') }}
         </button>
@@ -67,6 +67,9 @@
     <TabItem :name="$t('config.edit-config-tab')">
       <JsonEditor :config="config" />
     </TabItem>
+    <TabItem :name="$t('cloud-sync.title')">
+      <CloudBackupRestore :config="config" />
+    </TabItem>
     <TabItem :name="$t('config.custom-css-tab')">
       <CustomCssEditor :config="config" />
     </TabItem>
@@ -83,6 +86,7 @@ import { localStorageKeys, modalNames } from '@/utils/defaults';
 import { getUsersLanguage } from '@/utils/ConfigHelpers';
 import JsonEditor from '@/components/Configuration/JsonEditor';
 import CustomCssEditor from '@/components/Configuration/CustomCss';
+import CloudBackupRestore from '@/components/Configuration/CloudBackupRestore';
 import RebuildApp from '@/components/Configuration/RebuildApp';
 import AppVersion from '@/components/Configuration/AppVersion';
 
@@ -119,6 +123,7 @@ export default {
   components: {
     JsonEditor,
     CustomCssEditor,
+    CloudBackupRestore,
     RebuildApp,
     AppVersion,
     DownloadIcon,
@@ -142,9 +147,6 @@ export default {
     openAboutModal() {
       this.$modal.show(modalNames.ABOUT_APP);
     },
-    openCloudSync() {
-      this.$modal.show(modalNames.CLOUD_BACKUP);
-    },
     openLanguageSwitchModal() {
       this.$modal.show(modalNames.LANG_SWITCHER);
     },

src/components/Settings/ConfigLauncher.vue

@@ -5,8 +5,6 @@
     <div class="config-buttons">
       <IconSpanner @click="showEditor()" tabindex="-2"
         v-tooltip="tooltip('Update configuration')" />
-      <IconCloud @click="showCloudModal()" tabindex="-2"
-        v-tooltip="tooltip('Backup / restore cloud config')" />
     </div>
 
     <!-- Modal containing all the configuration options -->
@@ -15,12 +13,6 @@
       <ConfigContainer :config="combineConfig()" />
     </modal>
 
-    <!-- Modal for cloud backup and restore options -->
-    <modal :name="modalNames.CLOUD_BACKUP" :resizable="true" width="65%" height="60%"
-      @closed="$emit('modalChanged', false)" classes="dashy-modal">
-      <CloudBackupRestore :config="combineConfig()" />
-    </modal>
-
     <!-- Modal for manually changing locale -->
     <modal :name="modalNames.LANG_SWITCHER" classes="dashy-modal"
       :resizable="true" width="30%" height="25%">
@@ -33,9 +25,7 @@
 <script>
 
 import IconSpanner from '@/assets/interface-icons/config-editor.svg';
-import IconCloud from '@/assets/interface-icons/cloud-backup-restore.svg';
 import ConfigContainer from '@/components/Configuration/ConfigContainer';
-import CloudBackupRestore from '@/components/Configuration/CloudBackupRestore';
 import LanguageSwitcher from '@/components/Settings/LanguageSwitcher';
 import { topLevelConfKeys, localStorageKeys, modalNames } from '@/utils/defaults';
 
@@ -48,9 +38,7 @@ export default {
   },
   components: {
     IconSpanner,
-    IconCloud,
     ConfigContainer,
-    CloudBackupRestore,
     LanguageSwitcher,
   },
   props: {
@@ -64,10 +52,6 @@ export default {
       this.$modal.show(modalNames.CONF_EDITOR);
       this.$emit('modalChanged', true);
     },
-    showCloudModal: function show() {
-      this.$modal.show(modalNames.CLOUD_BACKUP);
-      this.$emit('modalChanged', true);
-    },
     combineConfig() {
       const conf = {};
       conf[topLevelConfKeys.APP_CONFIG] = this.appConfig;