migrate settings store to composition API and typescript

src/DesktopApp.vue

@@ -21,7 +21,7 @@ import { register } from 'register-service-worker';
 
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useTokensStore } from '@/stores/token.js';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.js';

src/MobileApp.vue

@@ -10,7 +10,7 @@ import routes from './router/mobile.js';
 
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useTokensStore } from '@/stores/token.js';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.js';

src/components/desktop/AmountInput.vue

@@ -31,7 +31,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 
 import { TRANSACTION_MIN_AMOUNT, TRANSACTION_MAX_AMOUNT } from '@/consts/transaction.ts';

src/components/desktop/PieChart.vue

@@ -7,7 +7,7 @@
 import { useTheme } from 'vuetify';
 
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 
 import { DEFAULT_ICON_COLOR, DEFAULT_CHART_COLORS } from '@/consts/color.ts';

src/components/desktop/TrendsChart.vue

@@ -7,7 +7,7 @@
 import { useTheme } from 'vuetify';
 
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 
 import { DateRangeScene } from '@/core/datetime.ts';

src/components/mobile/PieChart.vue

@@ -78,7 +78,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 
 import { DEFAULT_ICON_COLOR, DEFAULT_CHART_COLORS } from '@/consts/color.ts';

src/components/mobile/TrendsBarChart.vue

@@ -90,7 +90,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 
 import { DateRangeScene } from '@/core/datetime.ts';

src/core/setting.ts

@@ -0,0 +1,92 @@
+import { WeekDay } from './datetime.ts';
+import { TimezoneTypeForStatistics } from './timezone.ts';
+import { CurrencySortingType } from './currency.ts';
+import {
+    CategoricalChartType,
+    TrendChartType,
+    ChartDataType,
+    ChartSortingType,
+    DEFAULT_CATEGORICAL_CHART_DATA_RANGE,
+    DEFAULT_TREND_CHART_DATA_RANGE
+} from './statistics.ts';
+import { DEFAULT_CURRENCY_CODE } from '@/consts/currency.ts';
+
+export type ApplicationSettingKey = string;
+export type ApplicationSettingValue = string | number | boolean | Record<string, ApplicationSettingSubValue>;
+export type ApplicationSettingSubValue = string | number | boolean | Record<string, boolean> | Record<string, number>;
+
+export interface BaseApplicationSetting {
+    [key: ApplicationSettingKey]: ApplicationSettingValue;
+}
+
+export interface ApplicationSettings extends BaseApplicationSetting {
+    theme: string;
+    fontSize: number;
+    timeZone: string;
+    debug: boolean;
+    applicationLock: boolean;
+    applicationLockWebAuthn: boolean;
+    autoUpdateExchangeRatesData: boolean;
+    autoSaveTransactionDraft: string;
+    autoGetCurrentGeoLocation: boolean;
+    showAmountInHomePage: boolean;
+    timezoneUsedForStatisticsInHomePage: number;
+    itemsCountInTransactionListPage: number;
+    showTotalAmountInTransactionListPage: boolean;
+    showTagInTransactionListPage: boolean;
+    showAccountBalance: boolean;
+    currencySortByInExchangeRatesPage: number;
+    statistics: {
+        defaultChartDataType: number;
+        defaultTimezoneType: number;
+        defaultAccountFilter: Record<string, boolean>;
+        defaultTransactionCategoryFilter: Record<string, boolean>;
+        defaultSortingType: number;
+        defaultCategoricalChartType: number;
+        defaultCategoricalChartDataRangeType: number;
+        defaultTrendChartType: number;
+        defaultTrendChartDataRangeType: number;
+    };
+    animate: boolean;
+}
+
+export interface LocaleDefaultSettings {
+    currency: string;
+    firstDayOfWeek: number;
+}
+
+export const DEFAULT_APPLICATION_SETTINGS: ApplicationSettings = {
+    theme: 'auto',
+    fontSize: 1,
+    timeZone: '',
+    debug: false,
+    applicationLock: false,
+    applicationLockWebAuthn: false,
+    autoUpdateExchangeRatesData: true,
+    autoSaveTransactionDraft: 'disabled',
+    autoGetCurrentGeoLocation: false,
+    showAmountInHomePage: true,
+    timezoneUsedForStatisticsInHomePage: TimezoneTypeForStatistics.Default.type,
+    itemsCountInTransactionListPage: 15,
+    showTotalAmountInTransactionListPage: true,
+    showTagInTransactionListPage: true,
+    showAccountBalance: true,
+    currencySortByInExchangeRatesPage: CurrencySortingType.Default.type,
+    statistics: {
+        defaultChartDataType: ChartDataType.Default.type,
+        defaultTimezoneType: TimezoneTypeForStatistics.Default.type,
+        defaultAccountFilter: {},
+        defaultTransactionCategoryFilter: {},
+        defaultSortingType: ChartSortingType.Default.type,
+        defaultCategoricalChartType: CategoricalChartType.Default.type,
+        defaultCategoricalChartDataRangeType: DEFAULT_CATEGORICAL_CHART_DATA_RANGE.type,
+        defaultTrendChartType: TrendChartType.Default.type,
+        defaultTrendChartDataRangeType: DEFAULT_TREND_CHART_DATA_RANGE.type,
+    },
+    animate: true
+};
+
+export const DEFAULT_LOCALE_SETTINGS: LocaleDefaultSettings = {
+    currency: DEFAULT_CURRENCY_CODE,
+    firstDayOfWeek: WeekDay.DefaultFirstDay.type
+};

src/lib/i18n.js

@@ -1508,8 +1508,8 @@ function setLanguage(i18nGlobal, locale, force) {
     }
 
     return {
-        defaultCurrency: defaultCurrency,
-        defaultFirstDayOfWeek: defaultFirstDayOfWeek
+        currency: defaultCurrency,
+        firstDayOfWeek: defaultFirstDayOfWeek
     };
 }
 

src/lib/settings.ts

@@ -1,57 +1,20 @@
-import { TimezoneTypeForStatistics } from '@/core/timezone.ts';
-import { CurrencySortingType } from '@/core/currency.ts';
+import type {
+    ApplicationSettingKey,
+    ApplicationSettingValue,
+    ApplicationSettingSubValue,
+    BaseApplicationSetting,
+    ApplicationSettings,
+    LocaleDefaultSettings
+} from '@/core/setting.ts';
+
 import {
-    CategoricalChartType,
-    TrendChartType,
-    ChartDataType,
-    ChartSortingType,
-    DEFAULT_CATEGORICAL_CHART_DATA_RANGE,
-    DEFAULT_TREND_CHART_DATA_RANGE
-} from '@/core/statistics.ts';
-import { isObject } from './common.ts';
+    DEFAULT_APPLICATION_SETTINGS,
+    DEFAULT_LOCALE_SETTINGS
+} from '@/core/setting.ts';
 
 const settingsLocalStorageKey: string = 'ebk_app_settings';
 
-export type ApplicationSettingKey = string;
-export type ApplicationSettingValue = string | number | boolean | Record<string, ApplicationSettingSubValue>;
-export type ApplicationSettingSubValue = string | number | boolean | Record<string, boolean> | Record<string, number>;
-
-export interface ApplicationSettings {
-    [key: ApplicationSettingKey]: ApplicationSettingValue;
-}
-
-const defaultSettings: ApplicationSettings = {
-    theme: 'auto',
-    fontSize: 1,
-    timeZone: '',
-    debug: false,
-    applicationLock: false,
-    applicationLockWebAuthn: false,
-    autoUpdateExchangeRatesData: true,
-    autoSaveTransactionDraft: 'disabled',
-    autoGetCurrentGeoLocation: false,
-    showAmountInHomePage: true,
-    timezoneUsedForStatisticsInHomePage: TimezoneTypeForStatistics.Default.type,
-    itemsCountInTransactionListPage: 15,
-    showTotalAmountInTransactionListPage: true,
-    showTagInTransactionListPage: true,
-    showAccountBalance: true,
-    currencySortByInExchangeRatesPage: CurrencySortingType.Default.type,
-    statistics: {
-        defaultChartDataType: ChartDataType.Default.type,
-        defaultTimezoneType: TimezoneTypeForStatistics.Default.type,
-        defaultAccountFilter: {},
-        defaultTransactionCategoryFilter: {},
-        defaultSortingType: ChartSortingType.Default.type,
-        defaultCategoricalChartType: CategoricalChartType.Default.type,
-        defaultCategoricalChartDataRangeType: DEFAULT_CATEGORICAL_CHART_DATA_RANGE.type,
-        defaultTrendChartType: TrendChartType.Default.type,
-        defaultTrendChartDataRangeType: DEFAULT_TREND_CHART_DATA_RANGE.type,
-    },
-    animate: true
-};
-
-function getOriginalSettings(): ApplicationSettings {
+function getStoredApplicationSettings(): BaseApplicationSetting {
     try {
         const storageData = localStorage.getItem(settingsLocalStorageKey) || '{}';
         return JSON.parse(storageData);
@@ -61,62 +24,52 @@ function getOriginalSettings(): ApplicationSettings {
     }
 }
 
-function getFinalSettings(): ApplicationSettings {
-    const originalSettings = getOriginalSettings();
+export function getApplicationSettings(): ApplicationSettings {
+    const storedApplicationSettings = getStoredApplicationSettings();
 
-    for (const key in originalSettings) {
-        if (!Object.prototype.hasOwnProperty.call(originalSettings, key)) {
+    for (const key in storedApplicationSettings) {
+        if (!Object.prototype.hasOwnProperty.call(storedApplicationSettings, key)) {
             continue;
         }
 
-        if (typeof(defaultSettings[key]) === 'object') {
-            originalSettings[key] = Object.assign({}, defaultSettings[key], originalSettings[key]);
+        if (typeof(DEFAULT_APPLICATION_SETTINGS[key]) === 'object') {
+            storedApplicationSettings[key] = Object.assign({}, DEFAULT_APPLICATION_SETTINGS[key], storedApplicationSettings[key]);
         }
     }
 
-    return Object.assign({}, defaultSettings, originalSettings);
+    return Object.assign({}, DEFAULT_APPLICATION_SETTINGS, storedApplicationSettings);
 }
 
-function setSettings(settings: ApplicationSettings): void {
+export function getLocaleDefaultSettings(): LocaleDefaultSettings {
+    return Object.assign({}, DEFAULT_LOCALE_SETTINGS);
+}
+
+function updateApplicationSettings(settings: ApplicationSettings): void {
     const storageData = JSON.stringify(settings);
     return localStorage.setItem(settingsLocalStorageKey, storageData);
 }
 
-function getOption(key: ApplicationSettingKey): ApplicationSettingValue | undefined {
-    return getFinalSettings()[key];
-}
-
-function getSubOption(key: ApplicationSettingKey, subKey: ApplicationSettingKey): ApplicationSettingSubValue | undefined {
-    const options = getFinalSettings()[key];
-
-    if (!isObject(options)) {
-        return undefined;
-    }
-
-    return (options as Record<string, ApplicationSettingSubValue>)[subKey];
-}
-
-function setOption(key: ApplicationSettingKey, value: ApplicationSettingValue): void {
-    if (!Object.prototype.hasOwnProperty.call(defaultSettings, key)) {
+export function updateApplicationSettingsValue(key: ApplicationSettingKey, value: ApplicationSettingValue): void {
+    if (!Object.prototype.hasOwnProperty.call(DEFAULT_APPLICATION_SETTINGS, key)) {
         return;
     }
 
-    const settings = getFinalSettings();
+    const settings = getApplicationSettings();
     settings[key] = value;
 
-    return setSettings(settings);
+    return updateApplicationSettings(settings);
 }
 
-function setSubOption(key: ApplicationSettingKey, subKey: ApplicationSettingKey, value: ApplicationSettingSubValue): void {
-    if (!Object.prototype.hasOwnProperty.call(defaultSettings, key)) {
+export function updateApplicationSettingsSubValue(key: ApplicationSettingKey, subKey: ApplicationSettingKey, value: ApplicationSettingSubValue): void {
+    if (!Object.prototype.hasOwnProperty.call(DEFAULT_APPLICATION_SETTINGS, key)) {
         return;
     }
 
-    if (!Object.prototype.hasOwnProperty.call(defaultSettings[key], subKey)) {
+    if (!Object.prototype.hasOwnProperty.call(DEFAULT_APPLICATION_SETTINGS[key], subKey)) {
         return;
     }
 
-    const settings = getFinalSettings();
+    const settings = getApplicationSettings();
     let options = settings[key];
 
     if (!options) {
@@ -126,211 +79,23 @@ function setSubOption(key: ApplicationSettingKey, subKey: ApplicationSettingKey,
     (options as Record<string, ApplicationSettingSubValue>)[subKey] = value;
     settings[key] = options;
 
-    return setSettings(settings);
+    return updateApplicationSettings(settings);
 }
 
 export function isEnableDebug(): boolean {
-    return getOption('debug') as boolean;
+    return getApplicationSettings().debug;
 }
 
 export function getTheme(): string {
-    return getOption('theme') as string;
-}
-
-export function setTheme(value: string): void {
-    return setOption('theme', value);
-}
-
-export function getFontSize(): number {
-    return getOption('fontSize') as number;
-}
-
-export function setFontSize(value: number): void {
-    return setOption('fontSize', value);
-}
-
-export function getTimeZone(): string {
-    return getOption('timeZone') as string;
-}
-
-export function setTimeZone(value: string): void {
-    return setOption('timeZone', value);
+    return getApplicationSettings().theme;
 }
 
 export function isEnableApplicationLock(): boolean {
-    return getOption('applicationLock') as boolean;
-}
-
-export function setEnableApplicationLock(value: boolean): void {
-    return setOption('applicationLock', value);
-}
-
-export function isEnableApplicationLockWebAuthn(): boolean {
-    return getOption('applicationLockWebAuthn') as boolean;
-}
-
-export function setEnableApplicationLockWebAuthn(value: boolean): void {
-    return setOption('applicationLockWebAuthn', value);
-}
-
-export function isAutoUpdateExchangeRatesData(): boolean {
-    return getOption('autoUpdateExchangeRatesData') as boolean;
-}
-
-export function setAutoUpdateExchangeRatesData(value: boolean): void {
-    setOption('autoUpdateExchangeRatesData', value);
-}
-
-export function getAutoSaveTransactionDraft(): boolean {
-    return getOption('autoSaveTransactionDraft') as boolean;
-}
-
-export function setAutoSaveTransactionDraft(value: boolean): void {
-    setOption('autoSaveTransactionDraft', value);
-}
-
-export function isAutoGetCurrentGeoLocation(): boolean {
-    return getOption('autoGetCurrentGeoLocation') as boolean;
-}
-
-export function setAutoGetCurrentGeoLocation(value: boolean): void {
-    setOption('autoGetCurrentGeoLocation', value);
-}
-
-export function isShowAmountInHomePage(): boolean {
-    return getOption('showAmountInHomePage') as boolean;
-}
-
-export function setShowAmountInHomePage(value: boolean): void {
-    setOption('showAmountInHomePage', value);
-}
-
-export function getTimezoneUsedForStatisticsInHomePage(): number {
-    return getOption('timezoneUsedForStatisticsInHomePage') as number;
-}
-
-export function setTimezoneUsedForStatisticsInHomePage(value: number): void {
-    setOption('timezoneUsedForStatisticsInHomePage', value);
-}
-
-export function getItemsCountInTransactionListPage(): number {
-    return getOption('itemsCountInTransactionListPage') as number;
-}
-
-export function setItemsCountInTransactionListPage(value: number): void {
-    setOption('itemsCountInTransactionListPage', value);
-}
-
-export function isShowTotalAmountInTransactionListPage(): boolean {
-    return getOption('showTotalAmountInTransactionListPage') as boolean;
-}
-
-export function setShowTotalAmountInTransactionListPage(value: boolean): void {
-    setOption('showTotalAmountInTransactionListPage', value);
-}
-
-export function isShowTagInTransactionListPage(): boolean {
-    return getOption('showTagInTransactionListPage') as boolean;
-}
-
-export function setShowTagInTransactionListPage(value: boolean): void {
-    setOption('showTagInTransactionListPage', value);
-}
-
-export function isShowAccountBalance(): boolean {
-    return getOption('showAccountBalance') as boolean;
-}
-
-export function setShowAccountBalance(value: boolean): void {
-    setOption('showAccountBalance', value);
-}
-
-export function getCurrencySortByInExchangeRatesPage(): number {
-    return getOption('currencySortByInExchangeRatesPage') as number;
-}
-
-export function setCurrencySortByInExchangeRatesPage(value: number): void {
-    setOption('currencySortByInExchangeRatesPage', value);
-}
-
-export function getStatisticsDefaultChartDataType(): number {
-    return getSubOption('statistics', 'defaultChartDataType') as number;
-}
-
-export function setStatisticsDefaultChartDataType(value: number): void {
-    setSubOption('statistics', 'defaultChartDataType', value);
-}
-
-export function getStatisticsDefaultTimezoneType(): number {
-    return getSubOption('statistics', 'defaultTimezoneType') as number;
-}
-
-export function setStatisticsDefaultTimezoneType(value: number): void {
-    setSubOption('statistics', 'defaultTimezoneType', value);
-}
-
-export function getStatisticsDefaultAccountFilter(): Record<string, boolean> {
-    return getSubOption('statistics', 'defaultAccountFilter') as Record<string, boolean>;
-}
-
-export function setStatisticsDefaultAccountFilter(value: Record<string, boolean>): void {
-    setSubOption('statistics', 'defaultAccountFilter', value);
-}
-
-export function getStatisticsDefaultTransactionCategoryFilter(): Record<string, boolean> {
-    return getSubOption('statistics', 'defaultTransactionCategoryFilter') as Record<string, boolean>;
-}
-
-export function setStatisticsDefaultTransactionCategoryFilter(value: Record<string, boolean>): void {
-    setSubOption('statistics', 'defaultTransactionCategoryFilter', value);
-}
-
-export function getStatisticsSortingType(): number {
-    return getSubOption('statistics', 'defaultSortingType') as number;
-}
-
-export function setStatisticsSortingType(value: number): void {
-    setSubOption('statistics', 'defaultSortingType', value);
-}
-
-export function getStatisticsDefaultCategoricalChartType(): number {
-    return getSubOption('statistics', 'defaultCategoricalChartType') as number;
-}
-
-export function setStatisticsDefaultCategoricalChartType(value: number): void {
-    setSubOption('statistics', 'defaultCategoricalChartType', value);
-}
-
-export function getStatisticsDefaultCategoricalChartDataRange(): number {
-    return getSubOption('statistics', 'defaultCategoricalChartDataRangeType') as number;
-}
-
-export function setStatisticsDefaultCategoricalChartDataRange(value: number): void {
-    setSubOption('statistics', 'defaultCategoricalChartDataRangeType', value);
-}
-
-export function getStatisticsDefaultTrendChartType(): number {
-    return getSubOption('statistics', 'defaultTrendChartType') as number;
-}
-
-export function setStatisticsDefaultTrendChartType(value: number): void {
-    setSubOption('statistics', 'defaultTrendChartType', value);
-}
-
-export function getStatisticsDefaultTrendChartDataRange(): number {
-    return getSubOption('statistics', 'defaultTrendChartDataRangeType') as number;
-}
-
-export function setStatisticsDefaultTrendChartDataRange(value: number): void {
-    setSubOption('statistics', 'defaultTrendChartDataRangeType', value);
+    return getApplicationSettings().applicationLock;
 }
 
 export function isEnableAnimate(): boolean {
-    return getOption('animate') as boolean;
-}
-
-export function setEnableAnimate(value: boolean) {
-    return setOption('animate', value);
+    return getApplicationSettings().animate;
 }
 
 export function clearSettings(): void {

src/stores/index.js

@@ -1,6 +1,6 @@
 import { defineStore } from 'pinia';
 
-import { useSettingsStore } from './setting.js';
+import { useSettingsStore } from './setting.ts';
 import { useUserStore } from './user.js';
 import { useAccountsStore } from './account.js';
 import { useTransactionCategoriesStore } from './transactionCategory.js';

src/stores/overview.js

@@ -1,6 +1,6 @@
 import { defineStore } from 'pinia';
 
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from './user.js';
 import { useExchangeRatesStore } from './exchangeRates.js';
 

src/stores/setting.js

@@ -1,156 +0,0 @@
-import { defineStore } from 'pinia';
-
-import { WeekDay } from '@/core/datetime.ts';
-import { DEFAULT_CURRENCY_CODE } from '@/consts/currency.ts';
-import * as settings from '@/lib/settings.ts';
-
-export const useSettingsStore = defineStore('settings', {
-    state: () => ({
-        appSettings: {
-            theme: settings.getTheme(),
-            fontSize: settings.getFontSize(),
-            timeZone: settings.getTimeZone(),
-            applicationLock: settings.isEnableApplicationLock(),
-            applicationLockWebAuthn: settings.isEnableApplicationLockWebAuthn(),
-            autoUpdateExchangeRatesData: settings.isAutoUpdateExchangeRatesData(),
-            autoSaveTransactionDraft: settings.getAutoSaveTransactionDraft(),
-            autoGetCurrentGeoLocation: settings.isAutoGetCurrentGeoLocation(),
-            showAmountInHomePage: settings.isShowAmountInHomePage(),
-            timezoneUsedForStatisticsInHomePage: settings.getTimezoneUsedForStatisticsInHomePage(),
-            itemsCountInTransactionListPage: settings.getItemsCountInTransactionListPage(),
-            showTotalAmountInTransactionListPage: settings.isShowTotalAmountInTransactionListPage(),
-            showTagInTransactionListPage: settings.isShowTagInTransactionListPage(),
-            showAccountBalance: settings.isShowAccountBalance(),
-            currencySortByInExchangeRatesPage: settings.getCurrencySortByInExchangeRatesPage(),
-            statistics: {
-                defaultChartDataType: settings.getStatisticsDefaultChartDataType(),
-                defaultTimezoneType: settings.getStatisticsDefaultTimezoneType(),
-                defaultAccountFilter: settings.getStatisticsDefaultAccountFilter(),
-                defaultTransactionCategoryFilter: settings.getStatisticsDefaultTransactionCategoryFilter(),
-                defaultSortingType: settings.getStatisticsSortingType(),
-                defaultCategoricalChartType: settings.getStatisticsDefaultCategoricalChartType(),
-                defaultCategoricalChartDataRangeType: settings.getStatisticsDefaultCategoricalChartDataRange(),
-                defaultTrendChartType: settings.getStatisticsDefaultTrendChartType(),
-                defaultTrendChartDataRangeType: settings.getStatisticsDefaultTrendChartDataRange(),
-            },
-            animate: settings.isEnableAnimate()
-        },
-        localeDefaultSettings: {
-            currency: DEFAULT_CURRENCY_CODE,
-            firstDayOfWeek: WeekDay.DefaultFirstDay.type
-        }
-    }),
-    actions: {
-        setTheme(value) {
-            settings.setTheme(value);
-            this.appSettings.theme = value;
-        },
-        setFontSize(value) {
-            settings.setFontSize(value);
-            this.appSettings.fontSize = value;
-        },
-        setTimeZone(value) {
-            settings.setTimeZone(value);
-            this.appSettings.timeZone = value;
-        },
-        setEnableApplicationLock(value) {
-            settings.setEnableApplicationLock(value);
-            this.appSettings.applicationLock = value;
-        },
-        setEnableApplicationLockWebAuthn(value) {
-            settings.setEnableApplicationLockWebAuthn(value);
-            this.appSettings.applicationLockWebAuthn = value;
-        },
-        setAutoUpdateExchangeRatesData(value) {
-            settings.setAutoUpdateExchangeRatesData(value);
-            this.appSettings.autoUpdateExchangeRatesData = value;
-        },
-        setAutoSaveTransactionDraft(value) {
-            settings.setAutoSaveTransactionDraft(value);
-            this.appSettings.autoSaveTransactionDraft = value;
-        },
-        setAutoGetCurrentGeoLocation(value) {
-            settings.setAutoGetCurrentGeoLocation(value);
-            this.appSettings.autoGetCurrentGeoLocation = value;
-        },
-        setShowAmountInHomePage(value) {
-            settings.setShowAmountInHomePage(value);
-            this.appSettings.showAmountInHomePage = value;
-        },
-        setTimezoneUsedForStatisticsInHomePage(value) {
-            settings.setTimezoneUsedForStatisticsInHomePage(value);
-            this.appSettings.timezoneUsedForStatisticsInHomePage = value;
-        },
-        setItemsCountInTransactionListPage(value) {
-            settings.setItemsCountInTransactionListPage(value);
-            this.appSettings.itemsCountInTransactionListPage = value;
-        },
-        setShowTotalAmountInTransactionListPage(value) {
-            settings.setShowTotalAmountInTransactionListPage(value);
-            this.appSettings.showTotalAmountInTransactionListPage = value;
-        },
-        setShowTagInTransactionListPage(value) {
-            settings.setShowTagInTransactionListPage(value);
-            this.appSettings.showTagInTransactionListPage = value;
-        },
-        setShowAccountBalance(value) {
-            settings.setShowAccountBalance(value);
-            this.appSettings.showAccountBalance = value;
-        },
-        setCurrencySortByInExchangeRatesPage(value) {
-            settings.setCurrencySortByInExchangeRatesPage(value);
-            this.appSettings.currencySortByInExchangeRatesPage = value;
-        },
-        setStatisticsDefaultChartDataType(value) {
-            settings.setStatisticsDefaultChartDataType(value);
-            this.appSettings.statistics.defaultChartDataType = value;
-        },
-        setStatisticsDefaultTimezoneType(value) {
-            settings.setStatisticsDefaultTimezoneType(value);
-            this.appSettings.statistics.defaultTimezoneType = value;
-        },
-        setStatisticsDefaultAccountFilter(value) {
-            settings.setStatisticsDefaultAccountFilter(value);
-            this.appSettings.statistics.defaultAccountFilter = value;
-        },
-        setStatisticsDefaultTransactionCategoryFilter(value) {
-            settings.setStatisticsDefaultTransactionCategoryFilter(value);
-            this.appSettings.statistics.defaultTransactionCategoryFilter = value;
-        },
-        setStatisticsSortingType(value) {
-            settings.setStatisticsSortingType(value);
-            this.appSettings.statistics.defaultSortingType = value;
-        },
-        setStatisticsDefaultCategoricalChartType(value) {
-            settings.setStatisticsDefaultCategoricalChartType(value);
-            this.appSettings.statistics.defaultCategoricalChartType = value;
-        },
-        setStatisticsDefaultCategoricalChartDateRange(value) {
-            settings.setStatisticsDefaultCategoricalChartDataRange(value);
-            this.appSettings.statistics.defaultCategoricalChartDataRangeType = value;
-        },
-        setStatisticsDefaultTrendChartType(value) {
-            settings.setStatisticsDefaultTrendChartType(value);
-            this.appSettings.statistics.defaultTrendChartType = value;
-        },
-        setStatisticsDefaultTrendChartDateRange(value) {
-            settings.setStatisticsDefaultTrendChartDataRange(value);
-            this.appSettings.statistics.defaultTrendChartDataRangeType = value;
-        },
-        setEnableAnimate(value) {
-            settings.setEnableAnimate(value);
-            this.appSettings.animate = value;
-        },
-        clearAppSettings() {
-            settings.clearSettings();
-        },
-        updateLocalizedDefaultSettings(localeDefaultSettings) {
-            if (!localeDefaultSettings) {
-                return;
-            }
-
-            this.localeDefaultSettings.currency = localeDefaultSettings.defaultCurrency;
-            this.localeDefaultSettings.firstDayOfWeek = localeDefaultSettings.defaultFirstDayOfWeek;
-        }
-    }
-});

src/stores/setting.ts

@@ -0,0 +1,187 @@
+import { type Ref, ref } from 'vue';
+import { defineStore } from 'pinia';
+
+import type { ApplicationSettings, LocaleDefaultSettings } from '@/core/setting.ts';
+import {
+    getApplicationSettings,
+    getLocaleDefaultSettings,
+    updateApplicationSettingsValue,
+    updateApplicationSettingsSubValue,
+    clearSettings
+} from '@/lib/settings.ts';
+
+export const useSettingsStore = defineStore('settings', () => {
+    const appSettings: Ref<ApplicationSettings> = ref(getApplicationSettings());
+    const localeDefaultSettings: Ref<LocaleDefaultSettings> = ref(getLocaleDefaultSettings());
+
+    function setTheme(value: string): void {
+        updateApplicationSettingsValue('theme', value);
+        appSettings.value.theme = value;
+    }
+
+    function setFontSize(value: number): void {
+        updateApplicationSettingsValue('fontSize', value);
+        appSettings.value.fontSize = value;
+    }
+
+    function setTimeZone(value: string): void {
+        updateApplicationSettingsValue('timeZone', value);
+        appSettings.value.timeZone = value;
+    }
+
+    function setEnableApplicationLock(value: boolean): void {
+        updateApplicationSettingsValue('applicationLock', value);
+        appSettings.value.applicationLock = value;
+    }
+
+    function setEnableApplicationLockWebAuthn(value: boolean): void {
+        updateApplicationSettingsValue('applicationLockWebAuthn', value);
+        appSettings.value.applicationLockWebAuthn = value;
+    }
+
+    function setAutoUpdateExchangeRatesData(value: boolean): void {
+        updateApplicationSettingsValue('autoUpdateExchangeRatesData', value);
+        appSettings.value.autoUpdateExchangeRatesData = value;
+    }
+
+    function setAutoSaveTransactionDraft(value: string): void {
+        updateApplicationSettingsValue('autoSaveTransactionDraft', value);
+        appSettings.value.autoSaveTransactionDraft = value;
+    }
+
+    function setAutoGetCurrentGeoLocation(value: boolean): void {
+        updateApplicationSettingsValue('autoGetCurrentGeoLocation', value);
+        appSettings.value.autoGetCurrentGeoLocation = value;
+    }
+
+    function setShowAmountInHomePage(value: boolean): void {
+        updateApplicationSettingsValue('showAmountInHomePage', value);
+        appSettings.value.showAmountInHomePage = value;
+    }
+
+    function setTimezoneUsedForStatisticsInHomePage(value: number): void {
+        updateApplicationSettingsValue('timezoneUsedForStatisticsInHomePage', value);
+        appSettings.value.timezoneUsedForStatisticsInHomePage = value;
+    }
+
+    function setItemsCountInTransactionListPage(value: number): void {
+        updateApplicationSettingsValue('itemsCountInTransactionListPage', value);
+        appSettings.value.itemsCountInTransactionListPage = value;
+    }
+
+    function setShowTotalAmountInTransactionListPage(value: boolean): void {
+        updateApplicationSettingsValue('showTotalAmountInTransactionListPage', value);
+        appSettings.value.showTotalAmountInTransactionListPage = value;
+    }
+
+    function setShowTagInTransactionListPage(value: boolean): void {
+        updateApplicationSettingsValue('showTagInTransactionListPage', value);
+        appSettings.value.showTagInTransactionListPage = value;
+    }
+
+    function setShowAccountBalance(value: boolean): void {
+        updateApplicationSettingsValue('showAccountBalance', value);
+        appSettings.value.showAccountBalance = value;
+    }
+
+    function setCurrencySortByInExchangeRatesPage(value: number): void {
+        updateApplicationSettingsValue('currencySortByInExchangeRatesPage', value);
+        appSettings.value.currencySortByInExchangeRatesPage = value;
+    }
+
+    function setStatisticsDefaultChartDataType(value: number): void {
+        updateApplicationSettingsSubValue('statistics', 'defaultChartDataType', value);
+        appSettings.value.statistics.defaultChartDataType = value;
+    }
+
+    function setStatisticsDefaultTimezoneType(value: number): void {
+        updateApplicationSettingsSubValue('statistics', 'defaultTimezoneType', value);
+        appSettings.value.statistics.defaultTimezoneType = value;
+    }
+
+    function setStatisticsDefaultAccountFilter(value: Record<string, boolean>): void {
+        updateApplicationSettingsSubValue('statistics', 'defaultAccountFilter', value);
+        appSettings.value.statistics.defaultAccountFilter = value;
+    }
+
+    function setStatisticsDefaultTransactionCategoryFilter(value: Record<string, boolean>): void {
+        updateApplicationSettingsSubValue('statistics', 'defaultTransactionCategoryFilter', value);
+        appSettings.value.statistics.defaultTransactionCategoryFilter = value;
+    }
+
+    function setStatisticsSortingType(value: number): void {
+        updateApplicationSettingsSubValue('statistics', 'defaultSortingType', value);
+        appSettings.value.statistics.defaultSortingType = value;
+    }
+
+    function setStatisticsDefaultCategoricalChartType(value: number): void {
+        updateApplicationSettingsSubValue('statistics', 'defaultCategoricalChartType', value);
+        appSettings.value.statistics.defaultCategoricalChartType = value;
+    }
+
+    function setStatisticsDefaultCategoricalChartDateRange(value: number): void {
+        updateApplicationSettingsSubValue('statistics', 'defaultCategoricalChartDataRangeType', value);
+        appSettings.value.statistics.defaultCategoricalChartDataRangeType = value;
+    }
+
+    function setStatisticsDefaultTrendChartType(value: number): void {
+        updateApplicationSettingsSubValue('statistics', 'defaultTrendChartType', value);
+        appSettings.value.statistics.defaultTrendChartType = value;
+    }
+
+    function setStatisticsDefaultTrendChartDateRange(value: number): void {
+        updateApplicationSettingsSubValue('statistics', 'defaultTrendChartDataRangeType', value);
+        appSettings.value.statistics.defaultTrendChartDataRangeType = value;
+    }
+
+    function setEnableAnimate(value: boolean): void {
+        updateApplicationSettingsValue('animate', value);
+        appSettings.value.animate = value;
+    }
+
+    function clearAppSettings(): void {
+        clearSettings();
+        appSettings.value = getApplicationSettings();
+    }
+
+    function updateLocalizedDefaultSettings(newLocaleDefaultSettings: LocaleDefaultSettings) {
+        if (!newLocaleDefaultSettings) {
+            return;
+        }
+
+        localeDefaultSettings.value.currency = newLocaleDefaultSettings.currency;
+        localeDefaultSettings.value.firstDayOfWeek = newLocaleDefaultSettings.firstDayOfWeek;
+    }
+
+    return {
+        appSettings,
+        localeDefaultSettings,
+        setTheme,
+        setFontSize,
+        setTimeZone,
+        setEnableApplicationLock,
+        setEnableApplicationLockWebAuthn,
+        setAutoUpdateExchangeRatesData,
+        setAutoSaveTransactionDraft,
+        setAutoGetCurrentGeoLocation,
+        setShowAmountInHomePage,
+        setTimezoneUsedForStatisticsInHomePage,
+        setItemsCountInTransactionListPage,
+        setShowTotalAmountInTransactionListPage,
+        setShowTagInTransactionListPage,
+        setShowAccountBalance,
+        setCurrencySortByInExchangeRatesPage,
+        setStatisticsDefaultChartDataType,
+        setStatisticsDefaultTimezoneType,
+        setStatisticsDefaultAccountFilter,
+        setStatisticsDefaultTransactionCategoryFilter,
+        setStatisticsSortingType,
+        setStatisticsDefaultCategoricalChartType,
+        setStatisticsDefaultCategoricalChartDateRange,
+        setStatisticsDefaultTrendChartType,
+        setStatisticsDefaultTrendChartDateRange,
+        setEnableAnimate,
+        clearAppSettings,
+        updateLocalizedDefaultSettings
+    };
+});

src/stores/statistics.js

@@ -1,6 +1,6 @@
 import { defineStore } from 'pinia';
 
-import { useSettingsStore } from './setting.js';
+import { useSettingsStore } from './setting.ts';
 import { useUserStore } from './user.js';
 import { useAccountsStore } from './account.js';
 import { useTransactionCategoriesStore } from './transactionCategory.js';

src/stores/transaction.js

@@ -1,6 +1,6 @@
 import { defineStore } from 'pinia';
 
-import { useSettingsStore } from './setting.js';
+import { useSettingsStore } from './setting.ts';
 import { useUserStore } from './user.js';
 import { useAccountsStore } from './account.js';
 import { useTransactionCategoriesStore } from './transactionCategory.js';

src/stores/user.js

@@ -1,6 +1,6 @@
 import { defineStore } from 'pinia';
 
-import { useSettingsStore } from './setting.js';
+import { useSettingsStore } from './setting.ts';
 
 import userState from '@/lib/userstate.ts';
 import services from '@/lib/services.ts';

src/views/desktop/ExchangeRatesPage.vue

@@ -137,7 +137,7 @@
 import { useDisplay } from 'vuetify';
 
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.js';
 

src/views/desktop/ForgetPasswordPage.vue

@@ -110,7 +110,7 @@ import { useTheme } from 'vuetify';
 
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 
 import { APPLICATION_LOGO_PATH } from '@/consts/asset.ts';
 import { ThemeType } from '@/core/theme.ts';

src/views/desktop/HomePage.vue

@@ -191,7 +191,7 @@ import IncomeExpenseOverviewCard from './overview/cards/IncomeExpenseOverviewCar
 import MonthlyIncomeAndExpenseCard from './overview/cards/MonthlyIncomeAndExpenseCard.vue';
 
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useAccountsStore } from '@/stores/account.js';
 import { useOverviewStore } from '@/stores/overview.js';

src/views/desktop/LoginPage.vue

@@ -172,7 +172,7 @@ import { useTheme } from 'vuetify';
 
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.js';
 
 import { APPLICATION_LOGO_PATH } from '@/consts/asset.ts';

src/views/desktop/MainLayout.vue

@@ -198,7 +198,7 @@ import { useRoute } from 'vue-router';
 
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 
 import { APPLICATION_LOGO_PATH } from '@/consts/asset.ts';

src/views/desktop/ResetPasswordPage.vue

@@ -135,7 +135,7 @@ import { useTheme } from 'vuetify';
 
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 
 import { APPLICATION_LOGO_PATH } from '@/consts/asset.ts';
 import { ThemeType } from '@/core/theme.ts';

src/views/desktop/SignupPage.vue

@@ -239,7 +239,7 @@ import { useTheme } from 'vuetify';
 
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.js';

src/views/desktop/UnlockPage.vue

@@ -111,7 +111,7 @@ import { useTheme } from 'vuetify';
 
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useTokensStore } from '@/stores/token.js';
 import { useTransactionsStore } from '@/stores/transaction.js';

src/views/desktop/VerifyEmailPage.vue

@@ -114,7 +114,7 @@ import { useTheme } from 'vuetify';
 
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 
 import { APPLICATION_LOGO_PATH } from '@/consts/asset.ts';
 import { ThemeType } from '@/core/theme.ts';

src/views/desktop/accounts/ListPage.vue

@@ -260,7 +260,7 @@ import EditDialog from './list/dialogs/EditDialog.vue';
 import { useDisplay } from 'vuetify';
 
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useAccountsStore } from '@/stores/account.js';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.js';

src/views/desktop/accounts/list/dialogs/EditDialog.vue

@@ -197,7 +197,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useAccountsStore } from '@/stores/account.js';
 
 import { AccountType, AccountCategory } from '@/core/account.ts';

src/views/desktop/app/settings/tabs/AppBasicSettingTab.vue

@@ -207,7 +207,7 @@ import { useTheme } from 'vuetify';
 
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useTransactionsStore } from '@/stores/transaction.js';
 import { useOverviewStore } from '@/stores/overview.js';

src/views/desktop/app/settings/tabs/AppLockSettingTab.vue

@@ -62,7 +62,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useTransactionsStore } from '@/stores/transaction.js';
 

src/views/desktop/app/settings/tabs/AppStatisticsSettingTab.vue

@@ -126,7 +126,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 
 import { DateRangeScene } from '@/core/datetime.ts';
 import { StatisticsAnalysisType } from '@/core/statistics.ts';

src/views/desktop/common/cards/AccountFilterSettingsCard.vue

@@ -147,7 +147,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useAccountsStore } from '@/stores/account.js';
 import { useTransactionsStore } from '@/stores/transaction.js';
 import { useStatisticsStore } from '@/stores/statistics.js';

src/views/desktop/common/cards/CategoryFilterSettingsCard.vue

@@ -144,7 +144,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';
 import { useTransactionsStore } from '@/stores/transaction.js';
 import { useStatisticsStore } from '@/stores/statistics.js';

src/views/desktop/overview/cards/MonthlyIncomeAndExpenseCard.vue

@@ -28,7 +28,7 @@
 import { useTheme } from 'vuetify';
 
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 
 import { TransactionType } from '@/core/transaction.ts';

src/views/desktop/statistics/TransactionPage.vue

@@ -317,7 +317,7 @@
 import { useDisplay, useTheme } from 'vuetify';
 
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useAccountsStore } from '@/stores/account.js';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';

src/views/desktop/transactions/ListPage.vue

@@ -587,7 +587,7 @@ import TransactionTagFilterSettingsCard from '@/views/desktop/common/cards/Trans
 import { useDisplay } from 'vuetify';
 
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useAccountsStore } from '@/stores/account.js';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';

src/views/desktop/transactions/list/dialogs/BatchReplaceDialog.vue

@@ -172,7 +172,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useAccountsStore } from '@/stores/account.js';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';

src/views/desktop/transactions/list/dialogs/EditDialog.vue

@@ -391,7 +391,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useAccountsStore } from '@/stores/account.js';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';

src/views/desktop/transactions/list/dialogs/ImportDialog.vue

@@ -596,7 +596,7 @@
 import BatchReplaceDialog from './BatchReplaceDialog.vue';
 
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useAccountsStore } from '@/stores/account.js';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';

src/views/desktop/user/settings/tabs/UserBasicSettingTab.vue

@@ -332,7 +332,7 @@
 <script>
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useAccountsStore } from '@/stores/account.js';
 import { useOverviewStore } from '@/stores/overview.js';

src/views/desktop/user/settings/tabs/UserDataManagementSettingTab.vue

@@ -159,7 +159,7 @@
 <script>
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 
 import { isEquals } from '@/lib/common.ts';

src/views/desktop/user/settings/tabs/UserSecuritySettingTab.vue

@@ -131,7 +131,7 @@
 <script>
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useTokensStore } from '@/stores/token.js';
 

src/views/mobile/ApplicationLockPage.vue

@@ -37,7 +37,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useTransactionsStore } from '@/stores/transaction.js';
 

src/views/mobile/ExchangeRatesPage.vue

@@ -92,7 +92,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.js';
 

src/views/mobile/HomePage.vue

@@ -202,7 +202,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useTransactionTemplatesStore } from '@/stores/transactionTemplate.js';
 import { useOverviewStore } from '@/stores/overview.js';

src/views/mobile/LoginPage.vue

@@ -184,7 +184,7 @@
 <script>
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.js';
 
 import { APPLICATION_LOGO_PATH } from '@/consts/asset.ts';

src/views/mobile/SettingsPage.vue

@@ -73,7 +73,7 @@
 <script>
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useTransactionsStore } from '@/stores/transaction.js';
 import { useOverviewStore } from '@/stores/overview.js';

src/views/mobile/SignupPage.vue

@@ -177,7 +177,7 @@
 <script>
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.js';

src/views/mobile/UnlockPage.vue

@@ -67,7 +67,7 @@
 <script>
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useTokensStore } from '@/stores/token.js';
 import { useTransactionsStore } from '@/stores/transaction.js';

src/views/mobile/accounts/EditPage.vue

@@ -489,7 +489,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useAccountsStore } from '@/stores/account.js';
 

src/views/mobile/accounts/ListPage.vue

@@ -175,7 +175,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useAccountsStore } from '@/stores/account.js';
 import { useExchangeRatesStore } from '@/stores/exchangeRates.js';

src/views/mobile/settings/AccountFilterSettingsPage.vue

@@ -133,7 +133,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useAccountsStore } from '@/stores/account.js';
 import { useTransactionsStore } from '@/stores/transaction.js';
 import { useStatisticsStore } from '@/stores/statistics.js';

src/views/mobile/settings/CategoryFilterSettingsPage.vue

@@ -140,7 +140,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';
 import { useTransactionsStore } from '@/stores/transaction.js';
 import { useStatisticsStore } from '@/stores/statistics.js';

src/views/mobile/settings/PageSettingsPage.vue

@@ -66,7 +66,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useTransactionsStore } from '@/stores/transaction.js';
 import { useOverviewStore } from '@/stores/overview.js';
 

src/views/mobile/settings/TextSizeSettingsPage.vue

@@ -113,7 +113,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 
 import { FontSize } from '@/core/font.ts';

src/views/mobile/statistics/SettingsPage.vue

@@ -79,7 +79,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 
 import { DateRangeScene } from '@/core/datetime.ts';
 import { StatisticsAnalysisType } from '@/core/statistics.ts';

src/views/mobile/statistics/TransactionPage.vue

@@ -325,7 +325,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useAccountsStore } from '@/stores/account.js';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';

src/views/mobile/transactions/AmountFilterPage.vue

@@ -53,7 +53,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useTransactionsStore } from '@/stores/transaction.js';
 

src/views/mobile/transactions/EditPage.vue

@@ -430,7 +430,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useAccountsStore } from '@/stores/account.js';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';

src/views/mobile/transactions/ListPage.vue

@@ -521,7 +521,7 @@
 
 <script>
 import { mapStores } from 'pinia';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useAccountsStore } from '@/stores/account.js';
 import { useTransactionCategoriesStore } from '@/stores/transactionCategory.js';

src/views/mobile/users/DataManagementPage.vue

@@ -76,7 +76,7 @@
 <script>
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 
 import { isDataExportingEnabled } from '@/lib/server_settings.ts';

src/views/mobile/users/UserProfilePage.vue

@@ -334,7 +334,7 @@
 <script>
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/index.js';
-import { useSettingsStore } from '@/stores/setting.js';
+import { useSettingsStore } from '@/stores/setting.ts';
 import { useUserStore } from '@/stores/user.js';
 import { useAccountsStore } from '@/stores/account.js';
 import { useOverviewStore } from '@/stores/overview.js';