diff --git a/front/constants/RouteConstants.js b/front/constants/RouteConstants.js
index 20de61e..abe45a4 100644
--- a/front/constants/RouteConstants.js
+++ b/front/constants/RouteConstants.js
@@ -16,7 +16,21 @@ export default {
   ROUTE_SETTINGS_NEW_TRANSACTION_DEFAULTS: '/settings/user-preferences-new-transaction-defaults',
   ROUTE_SETTINGS_USER_PREFERENCES_UI: '/settings/user-preferences-ui',
   ROUTE_SETTINGS_USER_PREFERENCES_DASHBOARD: '/settings/user-preferences-dashboard',
+
+
+  ROUTE_SETTINGS_SETUP: '/settings/setup',
+  ROUTE_SETTINGS_UI: '/settings/ui',
+  ROUTE_SETTINGS_FORMATTING: '/settings/formatting',
+  ROUTE_SETTINGS_DASHBOARD: '/settings/dashboard',
+  ROUTE_SETTINGS_TRANSACTION: '/settings/transactions',
+  ROUTE_SETTINGS_TRANSACTION_FIELDS_ORDER: '/settings/transactions/fields',
+  ROUTE_SETTINGS_TRANSACTION_DEFAULT_VALUES: '/settings/transactions/defaults',
+  ROUTE_SETTINGS_TRANSACTION_QUICK_AMOUNTS: '/settings/transactions/quick-amounts',
   ROUTE_SETTINGS_ABOUT: '/settings/about',
+
+
+
+
   ROUTE_EXCHANGE_RATES: '/exchange-rates',
 
   ROUTE_TRANSACTION_TEMPLATE_LIST: '/transaction-templates/list',
diff --git a/front/pages/settings/user-preferences-dashboard.vue b/front/pages/settings/dashboard.vue
similarity index 96%
rename from front/pages/settings/user-preferences-dashboard.vue
rename to front/pages/settings/dashboard.vue
index 7884ea6..43bb114 100644
--- a/front/pages/settings/user-preferences-dashboard.vue
+++ b/front/pages/settings/dashboard.vue
@@ -3,9 +3,13 @@
     <app-top-toolbar />
 
     <van-form @submit="onSave" class="">
+
       <van-cell-group inset>
-        <div class="van-cell-group-title mb-0">Config:</div>
         <app-field-link label="Dashboard cards order" @click="onGoToDashboardCardsOrder" />
+      </van-cell-group>
+
+      <van-cell-group inset>
+        <div class="van-cell-group-title mb-0">Config:</div>
         <app-boolean label="Show accounts with 0 amount:" v-model="areEmptyAccountsVisible" />
         <app-boolean label="Show decimal places:" v-model="showDecimal" />
       </van-cell-group>
@@ -57,7 +61,7 @@ const onSave = async () => {
 
 const toolbar = useToolbar()
 toolbar.init({
-  title: 'Dashboard preferences',
+  title: 'Dashboard settings',
   backRoute: RouteConstants.ROUTE_SETTINGS,
 })
 
diff --git a/front/pages/settings/user-preferences-ui.vue b/front/pages/settings/formatting.vue
similarity index 70%
rename from front/pages/settings/user-preferences-ui.vue
rename to front/pages/settings/formatting.vue
index ef74736..c85422b 100644
--- a/front/pages/settings/user-preferences-ui.vue
+++ b/front/pages/settings/formatting.vue
@@ -4,11 +4,7 @@
 
     <van-form @submit="onSave" class="">
       <van-cell-group inset>
-        <app-boolean label="Dark theme:" v-model="darkTheme">
-          <template #icon="{ value }">
-            <app-icon :size="23" :stroke-width="2.0" :icon="value ? TablerIconConstants.darkTheme : TablerIconConstants.whiteTheme" />
-          </template>
-        </app-boolean>
+        <div class="van-cell-group-title">General:</div>
 
         <app-select
           label="Numbers formatting:"
@@ -22,17 +18,36 @@
           required
           :clearable="false"
         />
+
+        <app-select
+          label="Date format"
+          popupTitle="Select a date format"
+          v-model="dateFormat"
+          v-model:showDropdown="isDropdownDateFormatVisible"
+          :list="dateFormatList"
+          :columns="1"
+          :has-search="false"
+        />
+
+        <app-select
+          label="First day of month"
+          popupTitle="Select the first day of month"
+          v-model="firstDayOfMonth"
+          v-model:showDropdown="isDropdownFirstDayVisible"
+          :list="firstDayOfMonthList"
+          :columns="4"
+          :has-search="false"
+        />
       </van-cell-group>
 
       <van-cell-group inset>
-        <!--        <div class="van-cell-group-title">Date settings:</div>-->
+        <div class="van-cell-group-title">Casing:</div>
 
         <app-boolean label="Force transaction description lowercase:" v-model="lowerCaseTransactionDescription" />
         <app-boolean label="Force account name lowercase:" v-model="lowerCaseAccountName" />
         <app-boolean label="Force category name lowercase:" v-model="lowerCaseCategoryName" />
         <app-boolean label="Force tag name lowercase:" v-model="lowerCaseTagName" />
         <app-boolean label="Strip accents:" v-model="stripAccents" />
-
       </van-cell-group>
 
       <app-button-form-save />
@@ -57,7 +72,15 @@ const dataStore = useDataStore()
 const numberFormatList = [NUMBER_FORMAT.eu, NUMBER_FORMAT.international]
 const isDropdownNumberFormatVisible = ref(false)
 
-const darkTheme = ref(false)
+const dateFormat = ref(null)
+const dateFormatList = [DateUtils.FORMAT_ROMANIAN_DATE, DateUtils.FORMAT_ENGLISH_DATE]
+const isDropdownDateFormatVisible = ref(false)
+
+const firstDayOfMonth = ref(null)
+const firstDayOfMonthList = [...Array(27).keys()].map((item) => item + 1)
+const isDropdownFirstDayVisible = ref(false)
+
+
 const numberFormat = ref(null)
 const stripAccents = ref(false)
 const lowerCaseTransactionDescription = ref(false)
@@ -65,8 +88,11 @@ const lowerCaseAccountName = ref(false)
 const lowerCaseCategoryName = ref(false)
 const lowerCaseTagName = ref(false)
 
+
+
 const syncedSettings = [
-  { store: profileStore, path: 'darkTheme', ref: darkTheme },
+  { store: profileStore, path: 'dateFormat', ref: dateFormat },
+  { store: profileStore, path: 'dashboard.firstDayOfMonth', ref: firstDayOfMonth },
   { store: profileStore, path: 'numberFormat', ref: numberFormat },
   { store: profileStore, path: 'stripAccents', ref: stripAccents },
   { store: profileStore, path: 'lowerCaseTransactionDescription', ref: lowerCaseTransactionDescription },
@@ -77,17 +103,15 @@ const syncedSettings = [
 
 watchSettingsStore(syncedSettings)
 
-
-
 const onSave = async () => {
   saveSettingsToStore(syncedSettings)
   await profileStore.writeProfile()
-  UIUtils.showToastSuccess('User preferences saved')
+  UIUtils.showToastSuccess('Formatting')
 }
 
 const toolbar = useToolbar()
 toolbar.init({
-  title: 'UI preferences',
+  title: 'Formatting settings',
   backRoute: RouteConstants.ROUTE_SETTINGS,
 })
 
diff --git a/front/pages/settings/index.vue b/front/pages/settings/index.vue
index bb6c6bb..a311684 100644
--- a/front/pages/settings/index.vue
+++ b/front/pages/settings/index.vue
@@ -3,18 +3,11 @@
     <app-top-toolbar />
 
     <van-cell-group inset style="overflow: auto">
-      <app-field-link label="App config" :icon="TablerIconConstants.settings" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_APP_CONFIG)" />
-
-      <app-field-link label="UI preferences" :icon="TablerIconConstants.settingsUI" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_USER_PREFERENCES_UI)" />
-
-      <app-field-link label="Dashboard preferences" :icon="TablerIconConstants.dashboard" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_USER_PREFERENCES_DASHBOARD)" />
-
-      <app-field-link label="Date preferences" :icon="TablerIconConstants.settingsUserPreferencesDate" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_USER_PREFERENCES_DATE)" />
-
-      <app-field-link label="New transaction defaults" :icon="TablerIconConstants.settingsNewTransactionDefaults" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_NEW_TRANSACTION_DEFAULTS)" />
-
-      <app-field-link label="Transaction config" :icon="TablerIconConstants.settingsUserPreferences" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_USER_PREFERENCES_TRANSACTIONS)" />
-
+      <app-field-link label="Setup" :icon="TablerIconConstants.settings" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_SETUP)" />
+      <app-field-link label="User interface" :icon="TablerIconConstants.settingsUI" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_UI)" />
+      <app-field-link label="Formatting" :icon="TablerIconConstants.settingsUserPreferences" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_FORMATTING)" />
+      <app-field-link label="Dashboard" :icon="TablerIconConstants.dashboard" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_DASHBOARD)" />
+      <app-field-link label="Transactions" :icon="TablerIconConstants.transaction" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_TRANSACTION)" />
       <app-field-link label="About" :icon="TablerIconConstants.settingsAbout" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_ABOUT)" />
     </van-cell-group>
 
diff --git a/front/pages/settings/app-config.vue b/front/pages/settings/setup.vue
similarity index 99%
rename from front/pages/settings/app-config.vue
rename to front/pages/settings/setup.vue
index 1c2a525..3c60b7a 100644
--- a/front/pages/settings/app-config.vue
+++ b/front/pages/settings/setup.vue
@@ -91,7 +91,7 @@ const onSave = async () => {
 
 const toolbar = useToolbar()
 toolbar.init({
-  title: 'App settings',
+  title: 'Setup',
   backRoute: RouteConstants.ROUTE_SETTINGS,
 })
 
diff --git a/front/pages/settings/user-preferences-new-transaction-defaults.vue b/front/pages/settings/transactions/defaults.vue
similarity index 97%
rename from front/pages/settings/user-preferences-new-transaction-defaults.vue
rename to front/pages/settings/transactions/defaults.vue
index 7710b75..78834ab 100644
--- a/front/pages/settings/user-preferences-new-transaction-defaults.vue
+++ b/front/pages/settings/transactions/defaults.vue
@@ -57,7 +57,7 @@ const onSave = async () => {
 const toolbar = useToolbar()
 toolbar.init({
   title: 'New transaction defaults',
-  backRoute: RouteConstants.ROUTE_SETTINGS,
+  backRoute: RouteConstants.ROUTE_SETTINGS_TRANSACTION,
 })
 
 onMounted(() => {
diff --git a/front/pages/settings/user-preferences-transaction-fields-order.vue b/front/pages/settings/transactions/fields.vue
similarity index 97%
rename from front/pages/settings/user-preferences-transaction-fields-order.vue
rename to front/pages/settings/transactions/fields.vue
index d7ab4c8..26c5265 100644
--- a/front/pages/settings/user-preferences-transaction-fields-order.vue
+++ b/front/pages/settings/transactions/fields.vue
@@ -68,7 +68,7 @@ const init = () => {
 const toolbar = useToolbar()
 toolbar.init({
   title: 'Transaction fields order',
-  backRoute: RouteConstants.ROUTE_SETTINGS_USER_PREFERENCES_TRANSACTIONS,
+  backRoute: RouteConstants.ROUTE_SETTINGS_TRANSACTION,
 })
 
 onMounted(() => {
diff --git a/front/pages/settings/user-preferences-transactions.vue b/front/pages/settings/transactions/index.vue
similarity index 62%
rename from front/pages/settings/user-preferences-transactions.vue
rename to front/pages/settings/transactions/index.vue
index f3373c9..c02cf2c 100644
--- a/front/pages/settings/user-preferences-transactions.vue
+++ b/front/pages/settings/transactions/index.vue
@@ -4,9 +4,10 @@
 
     <van-form @submit="onSave" class="">
       <van-cell-group inset>
-        <div class="van-cell-group-title mb-0">Config:</div>
-        <app-field-link label="Amount increment buttons" @click="onGoToQuickTransactionAmounts" />
-        <app-field-link label="Transaction fields order" @click="onGoToTransactionFieldsOrder" />
+<!--        <div class="van-cell-group-title mb-0">Config:</div>-->
+        <app-field-link label="Default form values" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_TRANSACTION_DEFAULT_VALUES)" />
+        <app-field-link label="Amount increment buttons" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_TRANSACTION_QUICK_AMOUNTS)" />
+        <app-field-link label="Transaction fields order" @click="navigateTo(RouteConstants.ROUTE_SETTINGS_TRANSACTION_FIELDS_ORDER)" />
       </van-cell-group>
 
       <van-cell-group inset>
@@ -17,27 +18,6 @@
         <app-boolean v-model="copyCategoryToDescription" label="When I select a Category copy it into Description" />
       </van-cell-group>
 
-      <van-cell-group inset>
-        <div class="van-cell-group-title mb-0">List view:</div>
-
-        <app-select
-          popupTitle="Select what Hero Icons to show"
-          v-model="heroIcons"
-          v-model:showDropdown="isHeroIconsDropdownVisible"
-          :list="heroIconsList"
-          :is-multi-select="true"
-          :columns="1"
-          :has-search="false"
-        >
-          <template #label>
-            <div class="flex-center-vertical">
-              <div class="">Hero Icons</div>
-              <span class="info ml-5">(Right side card in the list)</span>
-            </div>
-          </template>
-        </app-select>
-      </van-cell-group>
-
       <app-button-form-save />
     </van-form>
   </div>
@@ -55,16 +35,11 @@ import { saveSettingsToStore, watchSettingsStore } from '~/utils/SettingUtils.js
 
 const profileStore = useProfileStore()
 
-const heroIconsList = HERO_ICONS_LIST
-const isHeroIconsDropdownVisible = ref(false)
-
-const heroIcons = ref([])
 const copyCategoryToDescription = ref(false)
 const copyTagToDescription = ref(false)
 const copyTagToCategory = ref(false)
 
 const syncedSettings = [
-  { store: profileStore, path: 'heroIcons', ref: heroIcons },
   { store: profileStore, path: 'copyCategoryToDescription', ref: copyCategoryToDescription },
   { store: profileStore, path: 'copyTagToDescription', ref: copyTagToDescription },
   { store: profileStore, path: 'copyTagToCategory', ref: copyTagToCategory },
@@ -78,12 +53,10 @@ const onSave = async () => {
   UIUtils.showToastSuccess('User preferences saved')
 }
 
-const onGoToQuickTransactionAmounts = async () => await navigateTo(RouteConstants.ROUTE_SETTINGS_USER_PREFERENCES_QUICK_AMOUNTS)
-const onGoToTransactionFieldsOrder = async () => await navigateTo(RouteConstants.ROUTE_SETTINGS_USER_PREFERENCES_TRANSACTION_FIELDS_ORDER)
 
 const toolbar = useToolbar()
 toolbar.init({
-  title: 'Transaction config',
+  title: 'Transaction settings',
   backRoute: RouteConstants.ROUTE_SETTINGS,
 })
 
diff --git a/front/pages/settings/user-preferences-quick-transaction-amounts.vue b/front/pages/settings/transactions/quick-amounts.vue
similarity index 95%
rename from front/pages/settings/user-preferences-quick-transaction-amounts.vue
rename to front/pages/settings/transactions/quick-amounts.vue
index 361c83a..50bd3c1 100644
--- a/front/pages/settings/user-preferences-quick-transaction-amounts.vue
+++ b/front/pages/settings/transactions/quick-amounts.vue
@@ -57,7 +57,7 @@ const init = () => {
 const toolbar = useToolbar()
 toolbar.init({
   title: 'Quick transaction amounts',
-  backRoute: RouteConstants.ROUTE_SETTINGS_USER_PREFERENCES_TRANSACTIONS,
+  backRoute: RouteConstants.ROUTE_SETTINGS_TRANSACTION,
 })
 
 onMounted(() => {
diff --git a/front/pages/settings/ui.vue b/front/pages/settings/ui.vue
new file mode 100644
index 0000000..408fb76
--- /dev/null
+++ b/front/pages/settings/ui.vue
@@ -0,0 +1,85 @@
+<template>
+  <div class="app-form">
+    <app-top-toolbar />
+
+    <van-form @submit="onSave" class="">
+      <van-cell-group inset>
+        <div class="van-cell-group-title mb-0">Theme:</div>
+
+        <app-boolean :label="themeText" v-model="darkTheme">
+          <template #icon="{ value }">
+            <app-icon :size="23" :stroke-width="2.0" :icon="value ? TablerIconConstants.darkTheme : TablerIconConstants.whiteTheme" />
+          </template>
+        </app-boolean>
+      </van-cell-group>
+
+      <van-cell-group inset>
+        <div class="van-cell-group-title mb-0">Transaction list:</div>
+
+        <app-select
+          popupTitle="Select what Hero Icons to show"
+          v-model="heroIcons"
+          v-model:showDropdown="isHeroIconsDropdownVisible"
+          :list="heroIconsList"
+          :is-multi-select="true"
+          :columns="1"
+          :has-search="false"
+        >
+          <template #label>
+            <div class="flex-center-vertical">
+              <div class="">Hero Icons</div>
+              <span class="info ml-5">(Right side card in the list)</span>
+            </div>
+          </template>
+        </app-select>
+      </van-cell-group>
+
+      <app-button-form-save />
+    </van-form>
+  </div>
+</template>
+
+<script setup>
+import { onMounted, ref } from 'vue'
+import { useProfileStore } from '~/stores/profileStore'
+import { useDataStore } from '~/stores/dataStore'
+import UIUtils from '~/utils/UIUtils'
+import { useToolbar } from '~/composables/useToolbar'
+import RouteConstants from '~/constants/RouteConstants'
+import TablerIconConstants from '~/constants/TablerIconConstants.js'
+import { saveSettingsToStore, watchSettingsStore } from '~/utils/SettingUtils.js'
+import { HERO_ICONS_LIST } from '~/constants/TransactionConstants.js'
+
+const profileStore = useProfileStore()
+const dataStore = useDataStore()
+
+const themeText = computed(() => (darkTheme.value ? 'Dark' : 'Light'))
+const darkTheme = ref(false)
+
+const heroIconsList = HERO_ICONS_LIST
+const isHeroIconsDropdownVisible = ref(false)
+const heroIcons = ref([])
+
+const syncedSettings = [
+  { store: profileStore, path: 'darkTheme', ref: darkTheme },
+  { store: profileStore, path: 'heroIcons', ref: heroIcons },
+]
+
+watchSettingsStore(syncedSettings)
+
+const onSave = async () => {
+  saveSettingsToStore(syncedSettings)
+  await profileStore.writeProfile()
+  UIUtils.showToastSuccess('User preferences saved')
+}
+
+const toolbar = useToolbar()
+toolbar.init({
+  title: 'UI settings',
+  backRoute: RouteConstants.ROUTE_SETTINGS,
+})
+
+onMounted(() => {
+  animateSettings()
+})
+</script>
diff --git a/front/pages/settings/user-preferences-dashboard-cards-order.vue b/front/pages/settings/user-preferences-dashboard-cards-order.vue
deleted file mode 100644
index 78e47f8..0000000
--- a/front/pages/settings/user-preferences-dashboard-cards-order.vue
+++ /dev/null
@@ -1,75 +0,0 @@
-<template>
-  <div class="app-form">
-    <app-top-toolbar />
-
-    <van-form @submit="onSave" class="">
-      <van-cell-group inset class="p-10">
-        <div class="van-cell-fake flex-column">
-          <app-repeater v-model="fieldsList" :is-list-dynamic="false" :empty-item="{ value: '' }">
-            <template #content="{ element, index }">
-              <div class="app-field m-5" @click="onClickIsVisible(element)">
-                <div class="van-field__body flex-center-vertical gap-1 pointer-events-none prevent-select">
-                  <app-icon :icon="element.icon" :size="20" />
-                  <div class="flex-1">{{ element.name }}</div>
-                  <app-icon :icon="getIsVisibleIcon(element)" :size="20" />
-                </div>
-              </div>
-            </template>
-          </app-repeater>
-        </div>
-      </van-cell-group>
-
-      <app-button-form-save />
-    </van-form>
-  </div>
-</template>
-
-<script setup>
-import { onMounted, ref } from 'vue'
-import { useProfileStore } from '~/stores/profileStore'
-import { useDataStore } from '~/stores/dataStore'
-import UIUtils from '~/utils/UIUtils'
-import { useToolbar } from '~/composables/useToolbar'
-import RouteConstants from '~/constants/RouteConstants'
-import TablerIconConstants from '~/constants/TablerIconConstants.js'
-import { DASHBOARD_SECTIONS_LIST } from '~/constants/DashboardConstants.js'
-
-const profileStore = useProfileStore()
-const dataStore = useDataStore()
-
-const fieldsList = ref([])
-
-onMounted(() => {
-  init()
-})
-
-const onSave = async () => {
-  profileStore.dashboardOrderedCardsList = fieldsList.value
-  await profileStore.writeProfile()
-  UIUtils.showToastSuccess('User preferences saved')
-  init()
-}
-
-const getIsVisibleIcon = (element) => {
-  return element.isVisible ? TablerIconConstants.eyeVisible : TablerIconConstants.eyeHidden
-}
-
-const onClickIsVisible = (element) => {
-  element.isVisible = !element.isVisible
-}
-
-const init = () => {
-  let isListOk = profileStore.dashboardOrderedCardsList.length === DASHBOARD_SECTIONS_LIST.length
-  fieldsList.value = isListOk ? profileStore.dashboardOrderedCardsList : DASHBOARD_SECTIONS_LIST
-}
-
-const toolbar = useToolbar()
-toolbar.init({
-  title: 'Dashboard cards order',
-  backRoute: RouteConstants.ROUTE_DASHBOARD,
-})
-
-onMounted(() => {
-  animateSettings()
-})
-</script>
diff --git a/front/pages/settings/user-preferences-date.vue b/front/pages/settings/user-preferences-date.vue
deleted file mode 100644
index 942758e..0000000
--- a/front/pages/settings/user-preferences-date.vue
+++ /dev/null
@@ -1,82 +0,0 @@
-<template>
-  <div class="app-form">
-    <app-top-toolbar />
-
-    <van-form @submit="onSave" class="">
-      <van-cell-group inset>
-        <!--        <div class="van-cell-group-title">Date settings:</div>-->
-
-        <app-select
-          label="Date format"
-          popupTitle="Select a date format"
-          v-model="dateFormat"
-          v-model:showDropdown="isDropdownDateFormatVisible"
-          :list="dateFormatList"
-          :columns="1"
-          :has-search="false"
-        />
-
-        <app-select
-          label="First day of month"
-          popupTitle="Select the first day of month"
-          v-model="firstDayOfMonth"
-          v-model:showDropdown="isDropdownFirstDayVisible"
-          :list="firstDayOfMonthList"
-          :columns="4"
-          :has-search="false"
-        />
-      </van-cell-group>
-
-      <app-button-form-save />
-    </van-form>
-  </div>
-</template>
-
-<script setup>
-import { onMounted, ref } from 'vue'
-import { useProfileStore } from '~/stores/profileStore'
-import { useDataStore } from '~/stores/dataStore'
-import UIUtils from '~/utils/UIUtils'
-import { useToolbar } from '~/composables/useToolbar'
-import RouteConstants from '~/constants/RouteConstants'
-import { saveSettingsToLocal, saveSettingsToStore, watchSettingsStore } from '~/utils/SettingUtils.js'
-
-const profileStore = useProfileStore()
-const dataStore = useDataStore()
-
-// const isDateformatVisible = ref(false)
-
-const dateFormat = ref(null)
-const dateFormatList = [DateUtils.FORMAT_ROMANIAN_DATE, DateUtils.FORMAT_ENGLISH_DATE]
-const isDropdownDateFormatVisible = ref(false)
-
-const firstDayOfMonth = ref(null)
-const firstDayOfMonthList = [...Array(27).keys()].map((item) => item + 1)
-const isDropdownFirstDayVisible = ref(false)
-
-
-const syncedSettings = [
-  { store: profileStore, path: 'dateFormat', ref: dateFormat },
-  { store: profileStore, path: 'dashboard.firstDayOfMonth', ref: firstDayOfMonth },
-]
-
-// This gets the UI reactive to all store changes not just 1 x time via onMount
-watchSettingsStore(syncedSettings)
-
-const onSave = async () => {
-  saveSettingsToStore(syncedSettings)
-  await profileStore.writeProfile()
-  UIUtils.showToastSuccess('User preferences saved')
-}
-
-
-const toolbar = useToolbar()
-toolbar.init({
-  title: 'Date preferences',
-  backRoute: RouteConstants.ROUTE_SETTINGS
-})
-
-onMounted(() => {
-  animateSettings()
-})
-</script>