add cache management page

src/consts/cache.ts

@@ -0,0 +1,5 @@
+export const SW_PRECACHE_CACHE_NAME_PREFIX: string = 'workbox-precache-v2-';
+export const SW_RUNTIME_CACHE_NAME_PREFIX: string = 'workbox-runtime-';
+export const SW_ASSETS_CACHE_NAME: string = 'ezbookkeeping-assets-cache';
+export const SW_CODE_CACHE_NAME: string = 'ezbookkeeping-code-cache';
+export const SW_MAP_CACHE_NAME: string = 'ezbookkeeping-map-cache';

src/core/cache.ts

@@ -0,0 +1,7 @@
+export interface BrowserCacheStatistics {
+    readonly totalCacheSize: number;
+    readonly codeCacheSize: number;
+    readonly assetsCacheSize: number;
+    readonly mapCacheSize: number;
+    readonly othersCacheSize: number;
+}

src/lib/cache.ts

@@ -0,0 +1,156 @@
+import type {
+    BrowserCacheStatistics
+} from '@/core/cache.ts';
+
+import {
+    SW_PRECACHE_CACHE_NAME_PREFIX,
+    SW_RUNTIME_CACHE_NAME_PREFIX,
+    SW_ASSETS_CACHE_NAME,
+    SW_CODE_CACHE_NAME,
+    SW_MAP_CACHE_NAME
+} from '@/consts/cache.ts';
+
+import { isFunction, isObject, isNumber } from './common.ts';
+import logger from './logger.ts';
+
+function findFirstCacheName(prefix: string): Promise<string> {
+    if (!window.caches) {
+        logger.error('caches API is not supported in this browser');
+        return Promise.reject(new Error('caches API is not supported'));
+    }
+
+    return window.caches.keys().then(cacheNames => {
+        for (const cacheName of cacheNames) {
+            if (cacheName.startsWith(prefix)) {
+                return cacheName;
+            }
+        }
+
+        throw new Error(`cache with prefix "${prefix}" not found`);
+    });
+}
+
+async function getCacheTotalSize(cacheName: string): Promise<number> {
+    if (!window.caches) {
+        logger.error('caches API is not supported in this browser');
+        return Promise.reject(new Error('caches API is not supported'));
+    }
+
+    const cache = await window.caches.open(cacheName);
+    const requests = await cache.keys();
+    let totalSize = 0;
+
+    for (const request of requests) {
+        try {
+            const response = await cache.match(request);
+
+            if (response && response.headers) {
+                const contentLength = response.headers.get('content-length');
+
+                if (contentLength) {
+                    const size = parseInt(contentLength, 10);
+
+                    if (Number.isFinite(size)) {
+                        totalSize += size;
+                    }
+                }
+            }
+        } catch (ex) {
+            logger.warn(`failed to get size for request ${request.url} in cache ${cacheName}`, ex);
+        }
+    }
+
+    return totalSize;
+}
+
+export function loadBrowserCacheStatistics(): Promise<BrowserCacheStatistics> {
+    return new Promise((resolve, reject) => {
+        const caches = window.caches;
+
+        if (!caches) {
+            logger.error('caches API is not supported in this browser');
+            reject(new Error('caches API is not supported in this browser'));
+            return;
+        }
+
+        return Promise.all([
+            navigator && navigator.storage && isFunction(navigator.storage.estimate) ? navigator.storage.estimate() : Promise.resolve(undefined),
+            findFirstCacheName(SW_PRECACHE_CACHE_NAME_PREFIX).then(cacheName => getCacheTotalSize(cacheName)).catch(() => 0),
+            findFirstCacheName(SW_RUNTIME_CACHE_NAME_PREFIX).then(cacheName => getCacheTotalSize(cacheName)).catch(() => 0),
+            getCacheTotalSize(SW_CODE_CACHE_NAME),
+            getCacheTotalSize(SW_ASSETS_CACHE_NAME),
+            getCacheTotalSize(SW_MAP_CACHE_NAME)
+        ]).then(([storageEstimate, precacheCacheSize, runtimeCacheSize, codeCacheSize, assetsCacheSize, mapCacheSize]) => {
+            let totalCacheSize: number = 0;
+
+            if (storageEstimate) {
+                const cachesUsage = 'usageDetails' in storageEstimate
+                && isObject(storageEstimate.usageDetails)
+                && 'caches' in storageEstimate.usageDetails
+                    ? storageEstimate.usageDetails.caches : undefined;
+
+                if (isNumber(cachesUsage)) {
+                    totalCacheSize = cachesUsage;
+                } else if (isNumber(storageEstimate.usage)) {
+                    totalCacheSize = storageEstimate.usage;
+                }
+            }
+
+            if (totalCacheSize < 1) {
+                totalCacheSize = precacheCacheSize + runtimeCacheSize + codeCacheSize + assetsCacheSize + mapCacheSize;
+            }
+
+            let othersCacheSize: number = totalCacheSize - precacheCacheSize - runtimeCacheSize - codeCacheSize - assetsCacheSize - mapCacheSize;
+
+            if (othersCacheSize < 0) {
+                othersCacheSize = 0;
+            }
+
+            resolve({
+                totalCacheSize: totalCacheSize,
+                codeCacheSize: codeCacheSize + runtimeCacheSize,
+                assetsCacheSize: assetsCacheSize + precacheCacheSize,
+                mapCacheSize: mapCacheSize,
+                othersCacheSize: othersCacheSize
+            });
+        }).catch(error => {
+            logger.error("failed to clear cache", error);
+            reject(error);
+        });
+    });
+}
+
+export function clearAllBrowserCaches(): Promise<void> {
+    if (!window.caches) {
+        logger.error('caches API is not supported in this browser');
+        return Promise.reject();
+    }
+
+    return new Promise((resolve, reject) => {
+        window.caches.keys().then(cacheNames => {
+            const promises = [];
+
+            for (const cacheName of cacheNames) {
+                promises.push(window.caches.delete(cacheName).then(success => {
+                    if (success) {
+                        logger.info(`cache "${cacheName}" cleared successfully`);
+                        return Promise.resolve(cacheName);
+                    } else {
+                        logger.warn(`failed to clear cache "${cacheName}"`);
+                        return Promise.reject(cacheName);
+                    }
+                }));
+            }
+
+            Promise.all(promises).then(() => {
+                logger.info("all caches cleared successfully");
+                resolve();
+            }).catch(() => {
+                resolve();
+            });
+        }).catch(error => {
+            logger.warn("failed to clear cache", error);
+            reject(error);
+        });
+    });
+}

src/lib/ui/common.ts

@@ -245,38 +245,3 @@ export function compressJpgImage(file: File, maxWidth: number, maxHeight: number
         reader.readAsDataURL(file);
     });
 }
-
-export function clearBrowserCaches(): Promise<void> {
-    if (!window.caches) {
-        logger.error('caches API is not supported in this browser');
-        return Promise.reject();
-    }
-
-    return new Promise((resolve, reject) => {
-        window.caches.keys().then(cacheNames => {
-            const promises = [];
-
-            for (const cacheName of cacheNames) {
-                promises.push(window.caches.delete(cacheName).then(success => {
-                    if (success) {
-                        logger.info(`cache "${cacheName}" cleared successfully`);
-                        return Promise.resolve(cacheName);
-                    } else {
-                        logger.warn(`failed to clear cache "${cacheName}"`);
-                        return Promise.reject(cacheName);
-                    }
-                }));
-            }
-
-            Promise.all(promises).then(() => {
-                logger.info("all caches cleared successfully");
-                resolve();
-            }).catch(() => {
-                resolve();
-            });
-        }).catch(error => {
-            logger.warn("failed to clear cache", error);
-            reject(error);
-        });
-    });
-}

src/locales/de.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "Unable to retrieve user synchronized application settings",
     "Unable to update user synchronized application settings": "Unable to update user synchronized application settings",
     "Unable to disable user synchronized application settings": "Unable to disable user synchronized application settings",
+    "Browser Cache Management": "Browser Cache Management",
+    "File Cache": "File Cache",
+    "Used storage": "Used storage",
+    "Application Code": "Application Code",
+    "Resource Files": "Resource Files",
+    "Map Data": "Map Data",
+    "Others": "Others",
+    "Failed to load browser cache statistics": "Failed to load browser cache statistics",
+    "Clear File Cache": "Clear File Cache",
+    "Are you sure you want to clear file cache?": "Are you sure you want to clear file cache?",
     "Are you sure you want to re-login?": "Sind Sie sicher, dass Sie sich erneut anmelden möchten?",
     "Exchange Rates Data": "Wechselkursdaten",
     "User Custom": "User Custom",

src/locales/en.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "Unable to retrieve user synchronized application settings",
     "Unable to update user synchronized application settings": "Unable to update user synchronized application settings",
     "Unable to disable user synchronized application settings": "Unable to disable user synchronized application settings",
+    "Browser Cache Management": "Browser Cache Management",
+    "File Cache": "File Cache",
+    "Used storage": "Used storage",
+    "Application Code": "Application Code",
+    "Resource Files": "Resource Files",
+    "Map Data": "Map Data",
+    "Others": "Others",
+    "Failed to load browser cache statistics": "Failed to load browser cache statistics",
+    "Clear File Cache": "Clear File Cache",
+    "Are you sure you want to clear file cache?": "Are you sure you want to clear file cache?",
     "Are you sure you want to re-login?": "Are you sure you want to re-login?",
     "Exchange Rates Data": "Exchange Rates Data",
     "User Custom": "User Custom",

src/locales/es.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "Unable to retrieve user synchronized application settings",
     "Unable to update user synchronized application settings": "Unable to update user synchronized application settings",
     "Unable to disable user synchronized application settings": "Unable to disable user synchronized application settings",
+    "Browser Cache Management": "Browser Cache Management",
+    "File Cache": "File Cache",
+    "Used storage": "Used storage",
+    "Application Code": "Application Code",
+    "Resource Files": "Resource Files",
+    "Map Data": "Map Data",
+    "Others": "Others",
+    "Failed to load browser cache statistics": "Failed to load browser cache statistics",
+    "Clear File Cache": "Clear File Cache",
+    "Are you sure you want to clear file cache?": "Are you sure you want to clear file cache?",
     "Are you sure you want to re-login?": "¿Seguro que deseas volver a iniciar sesión?",
     "Exchange Rates Data": "Tipos de Cambio",
     "User Custom": "User Custom",

src/locales/fr.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "Impossible de récupérer les paramètres d'application synchronisés de l'utilisateur",
     "Unable to update user synchronized application settings": "Impossible de mettre à jour les paramètres d'application synchronisés de l'utilisateur",
     "Unable to disable user synchronized application settings": "Impossible de désactiver les paramètres d'application synchronisés de l'utilisateur",
+    "Browser Cache Management": "Browser Cache Management",
+    "File Cache": "File Cache",
+    "Used storage": "Used storage",
+    "Application Code": "Application Code",
+    "Resource Files": "Resource Files",
+    "Map Data": "Map Data",
+    "Others": "Others",
+    "Failed to load browser cache statistics": "Failed to load browser cache statistics",
+    "Clear File Cache": "Clear File Cache",
+    "Are you sure you want to clear file cache?": "Are you sure you want to clear file cache?",
     "Are you sure you want to re-login?": "Êtes-vous sûr de vouloir vous reconnecter ?",
     "Exchange Rates Data": "Données de taux de change",
     "User Custom": "Personnalisé utilisateur",

src/locales/helpers.ts

@@ -2100,6 +2100,31 @@ export function useI18n() {
         return formatPercent(value, precision, lowPrecisionValue, numberFormatOptions);
     }
 
+    function getFormattedVolume(value: number, precision?: number, unit?: 'KiB' | 'MiB'): string {
+        const numberFormatOptions = getNumberFormatOptions({});
+        let displayUnit = unit || 'B';
+
+        if (unit === 'KiB') {
+            value = value / 1024.0;
+        } else if (unit === 'MiB') {
+            value = value / 1024.0 / 1024.0;
+        } else {
+            displayUnit = 'B';
+
+            if (value >= 1024.0) {
+                value = value / 1024.0;
+                displayUnit = 'KiB';
+            }
+
+            if (value >= 1024.0) {
+                value = value / 1024.0;
+                displayUnit = 'MiB';
+            }
+        }
+
+        return formatNumber(value, numberFormatOptions, precision) + ' ' + displayUnit;
+    }
+
     function getFormattedExchangeRateAmount(value: number, numeralSystem?: NumeralSystem): string {
         const numberFormatOptions = getNumberFormatOptions({ numeralSystem });
         return formatExchangeRateAmount(value, numberFormatOptions);
@@ -2505,6 +2530,7 @@ export function useI18n() {
         formatNumberToWesternArabicNumerals: (value: number, precision?: number) => getFormattedNumber(value, NumeralSystem.WesternArabicNumerals, precision),
         formatPercentToLocalizedNumerals: (value: number, precision: number, lowPrecisionValue: string) => getFormattedPercentValue(value, precision, lowPrecisionValue),
         formatPercentToWesternArabicNumerals: (value: number, precision: number, lowPrecisionValue: string) => getFormattedPercentValue(value, precision, lowPrecisionValue, NumeralSystem.WesternArabicNumerals),
+        formatVolumeToLocalizedNumerals: getFormattedVolume,
         formatExchangeRateAmountToWesternArabicNumerals: (value: number) => getFormattedExchangeRateAmount(value, NumeralSystem.WesternArabicNumerals),
         appendDigitGroupingSymbolAndDecimalSeparator: (value: string) => appendDigitGroupingSymbolAndDecimalSeparator(value, getNumberFormatOptions({})),
         getAdaptiveAmountRate,

src/locales/it.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "Unable to retrieve user synchronized application settings",
     "Unable to update user synchronized application settings": "Unable to update user synchronized application settings",
     "Unable to disable user synchronized application settings": "Unable to disable user synchronized application settings",
+    "Browser Cache Management": "Browser Cache Management",
+    "File Cache": "File Cache",
+    "Used storage": "Used storage",
+    "Application Code": "Application Code",
+    "Resource Files": "Resource Files",
+    "Map Data": "Map Data",
+    "Others": "Others",
+    "Failed to load browser cache statistics": "Failed to load browser cache statistics",
+    "Clear File Cache": "Clear File Cache",
+    "Are you sure you want to clear file cache?": "Are you sure you want to clear file cache?",
     "Are you sure you want to re-login?": "Sei sicuro di voler accedere di nuovo?",
     "Exchange Rates Data": "Dati tassi di cambio",
     "User Custom": "User Custom",

src/locales/ja.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "Unable to retrieve user synchronized application settings",
     "Unable to update user synchronized application settings": "Unable to update user synchronized application settings",
     "Unable to disable user synchronized application settings": "Unable to disable user synchronized application settings",
+    "Browser Cache Management": "Browser Cache Management",
+    "File Cache": "File Cache",
+    "Used storage": "Used storage",
+    "Application Code": "Application Code",
+    "Resource Files": "Resource Files",
+    "Map Data": "Map Data",
+    "Others": "Others",
+    "Failed to load browser cache statistics": "Failed to load browser cache statistics",
+    "Clear File Cache": "Clear File Cache",
+    "Are you sure you want to clear file cache?": "Are you sure you want to clear file cache?",
     "Are you sure you want to re-login?": "再ログインしますか?",
     "Exchange Rates Data": "為替レートデータ",
     "User Custom": "User Custom",

src/locales/kn.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "ಬಳಕೆದಾರರ ಸಿಂಕ್ ಮಾಡಿದ ಅಪ್ಲಿಕೇಶನ್ ಸೆಟ್ಟಿಂಗ್ಸ್ ಪಡೆಯಲು ಸಾಧ್ಯವಾಗಿಲ್ಲ",
     "Unable to update user synchronized application settings": "ಬಳಕೆದಾರರ ಸಿಂಕ್ ಮಾಡಿದ ಅಪ್ಲಿಕೇಶನ್ ಸೆಟ್ಟಿಂಗ್ಸ್ ನವೀಕರಿಸಲು ಸಾಧ್ಯವಾಗಿಲ್ಲ",
     "Unable to disable user synchronized application settings": "ಬಳಕೆದಾರರ ಸಿಂಕ್ ಮಾಡಿದ ಅಪ್ಲಿಕೇಶನ್ ಸೆಟ್ಟಿಂಗ್ಸ್ ನಿಷ್ಕ್ರಿಯಗೊಳಿಸಲು ಸಾಧ್ಯವಾಗಿಲ್ಲ",
+    "Browser Cache Management": "Browser Cache Management",
+    "File Cache": "File Cache",
+    "Used storage": "Used storage",
+    "Application Code": "Application Code",
+    "Resource Files": "Resource Files",
+    "Map Data": "Map Data",
+    "Others": "Others",
+    "Failed to load browser cache statistics": "Failed to load browser cache statistics",
+    "Clear File Cache": "Clear File Cache",
+    "Are you sure you want to clear file cache?": "Are you sure you want to clear file cache?",
     "Are you sure you want to re-login?": "ಮತ್ತೆ ಲಾಗಿನ್ ಮಾಡಲು ನೀವು ಖಚಿತವೇ?",
     "Exchange Rates Data": "ವಿನಿಮಯ ದರ ಡೇಟಾ",
     "User Custom": "ಬಳಕೆದಾರ ಕಸ್ಟಮ್",

src/locales/ko.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "사용자 동기화된 애플리케이션 설정을 검색할 수 없습니다.",
     "Unable to update user synchronized application settings": "사용자 동기화된 애플리케이션 설정을 업데이트할 수 없습니다.",
     "Unable to disable user synchronized application settings": "사용자 동기화된 애플리케이션 설정을 비활성화할 수 없습니다.",
+    "Browser Cache Management": "Browser Cache Management",
+    "File Cache": "File Cache",
+    "Used storage": "Used storage",
+    "Application Code": "Application Code",
+    "Resource Files": "Resource Files",
+    "Map Data": "Map Data",
+    "Others": "Others",
+    "Failed to load browser cache statistics": "Failed to load browser cache statistics",
+    "Clear File Cache": "Clear File Cache",
+    "Are you sure you want to clear file cache?": "Are you sure you want to clear file cache?",
     "Are you sure you want to re-login?": "다시 로그인하시겠습니까?",
     "Exchange Rates Data": "환율 데이터",
     "User Custom": "사용자 정의",

src/locales/nl.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "Kan gesynchroniseerde applicatie-instellingen van gebruiker niet ophalen",
     "Unable to update user synchronized application settings": "Kan gesynchroniseerde applicatie-instellingen van gebruiker niet bijwerken",
     "Unable to disable user synchronized application settings": "Kan gesynchroniseerde applicatie-instellingen van gebruiker niet uitschakelen",
+    "Browser Cache Management": "Browser Cache Management",
+    "File Cache": "File Cache",
+    "Used storage": "Used storage",
+    "Application Code": "Application Code",
+    "Resource Files": "Resource Files",
+    "Map Data": "Map Data",
+    "Others": "Others",
+    "Failed to load browser cache statistics": "Failed to load browser cache statistics",
+    "Clear File Cache": "Clear File Cache",
+    "Are you sure you want to clear file cache?": "Are you sure you want to clear file cache?",
     "Are you sure you want to re-login?": "Weet je zeker dat je opnieuw wilt inloggen?",
     "Exchange Rates Data": "Wisselkoersgegevens",
     "User Custom": "Gebruiker aangepast",

src/locales/pt_BR.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "Unable to retrieve user synchronized application settings",
     "Unable to update user synchronized application settings": "Unable to update user synchronized application settings",
     "Unable to disable user synchronized application settings": "Unable to disable user synchronized application settings",
+    "Browser Cache Management": "Browser Cache Management",
+    "File Cache": "File Cache",
+    "Used storage": "Used storage",
+    "Application Code": "Application Code",
+    "Resource Files": "Resource Files",
+    "Map Data": "Map Data",
+    "Others": "Others",
+    "Failed to load browser cache statistics": "Failed to load browser cache statistics",
+    "Clear File Cache": "Clear File Cache",
+    "Are you sure you want to clear file cache?": "Are you sure you want to clear file cache?",
     "Are you sure you want to re-login?": "Tem certeza de que deseja fazer login novamente?",
     "Exchange Rates Data": "Dados de Taxas de Câmbio",
     "User Custom": "Personalização do Usuário",

src/locales/ru.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "Не удалось получить пользовательские синхронизированные настройки приложения",
     "Unable to update user synchronized application settings": "Не удалось обновить пользовательские настройки приложения",
     "Unable to disable user synchronized application settings": "Не удалось удалить пользовательские настройки приложения",
+    "Browser Cache Management": "Browser Cache Management",
+    "File Cache": "File Cache",
+    "Used storage": "Used storage",
+    "Application Code": "Application Code",
+    "Resource Files": "Resource Files",
+    "Map Data": "Map Data",
+    "Others": "Others",
+    "Failed to load browser cache statistics": "Failed to load browser cache statistics",
+    "Clear File Cache": "Clear File Cache",
+    "Are you sure you want to clear file cache?": "Are you sure you want to clear file cache?",
     "Are you sure you want to re-login?": "Вы уверены, что хотите войти снова?",
     "Exchange Rates Data": "Данные о курсах валют",
     "User Custom": "Пользовательские настройки",

src/locales/sl.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "Sinhroniziranih nastavitev aplikacije ni mogoče pridobiti",
     "Unable to update user synchronized application settings": "Sinhroniziranih nastavitev aplikacije ni mogoče posodobiti",
     "Unable to disable user synchronized application settings": "Sinhronizacije nastavitev aplikacije ni mogoče onemogočiti",
+    "Browser Cache Management": "Browser Cache Management",
+    "File Cache": "File Cache",
+    "Used storage": "Used storage",
+    "Application Code": "Application Code",
+    "Resource Files": "Resource Files",
+    "Map Data": "Map Data",
+    "Others": "Others",
+    "Failed to load browser cache statistics": "Failed to load browser cache statistics",
+    "Clear File Cache": "Clear File Cache",
+    "Are you sure you want to clear file cache?": "Are you sure you want to clear file cache?",
     "Are you sure you want to re-login?": "Ali ste prepričani, da se želite ponovno prijaviti?",
     "Exchange Rates Data": "Podatki o menjalnih tečajih",
     "User Custom": "Uporabniške nastavitve po meri",

src/locales/ta.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "பயனர் ஒத்திசைவு செய் பயன்பாடு அமைப்புகள் பெற முடியவில்லை",
     "Unable to update user synchronized application settings": "பயனர் ஒத்திசைவு செய் பயன்பாடு அமைப்புகள் புதுப்பிக்க முடியவில்லை",
     "Unable to disable user synchronized application settings": "பயனர் ஒத்திசைவு செய் பயன்பாடு அமைப்புகள் செயலற்றப்படுத்த முடியவில்லை",
+    "Browser Cache Management": "Browser Cache Management",
+    "File Cache": "File Cache",
+    "Used storage": "Used storage",
+    "Application Code": "Application Code",
+    "Resource Files": "Resource Files",
+    "Map Data": "Map Data",
+    "Others": "Others",
+    "Failed to load browser cache statistics": "Failed to load browser cache statistics",
+    "Clear File Cache": "Clear File Cache",
+    "Are you sure you want to clear file cache?": "Are you sure you want to clear file cache?",
     "Are you sure you want to re-login?": "மீண்டும் உள்நுழை செய்ய நீங்கள் உறுதியா?",
     "Exchange Rates Data": "மாற்று விகிதம் தரவு",
     "User Custom": "தனிப்பயன்",

src/locales/th.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "ไม่สามารถดึงการตั้งค่าแอปที่ซิงค์ของผู้ใช้ได้",
     "Unable to update user synchronized application settings": "ไม่สามารถอัปเดตการตั้งค่าแอปที่ซิงค์ของผู้ใช้ได้",
     "Unable to disable user synchronized application settings": "ไม่สามารถปิดการซิงค์การตั้งค่าแอปของผู้ใช้ได้",
+    "Browser Cache Management": "Browser Cache Management",
+    "File Cache": "File Cache",
+    "Used storage": "Used storage",
+    "Application Code": "Application Code",
+    "Resource Files": "Resource Files",
+    "Map Data": "Map Data",
+    "Others": "Others",
+    "Failed to load browser cache statistics": "Failed to load browser cache statistics",
+    "Clear File Cache": "Clear File Cache",
+    "Are you sure you want to clear file cache?": "Are you sure you want to clear file cache?",
     "Are you sure you want to re-login?": "คุณแน่ใจหรือว่าต้องการเข้าสู่ระบบอีกครั้ง?",
     "Exchange Rates Data": "ข้อมูลอัตราแลกเปลี่ยน",
     "User Custom": "กำหนดเองโดยผู้ใช้",

src/locales/tr.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "Kullanıcının eşitlenen uygulama ayarları alınamadı",
     "Unable to update user synchronized application settings": "Kullanıcının eşitlenen uygulama ayarları güncellenemedi",
     "Unable to disable user synchronized application settings": "Kullanıcının eşitlenen uygulama ayarları devre dışı bırakılamadı",
+    "Browser Cache Management": "Browser Cache Management",
+    "File Cache": "File Cache",
+    "Used storage": "Used storage",
+    "Application Code": "Application Code",
+    "Resource Files": "Resource Files",
+    "Map Data": "Map Data",
+    "Others": "Others",
+    "Failed to load browser cache statistics": "Failed to load browser cache statistics",
+    "Clear File Cache": "Clear File Cache",
+    "Are you sure you want to clear file cache?": "Are you sure you want to clear file cache?",
     "Are you sure you want to re-login?": "Tekrar giriş yapmak istediğinize emin misiniz?",
     "Exchange Rates Data": "Döviz Kuru Verileri",
     "User Custom": "Kullanıcı Özel",

src/locales/uk.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "Unable to retrieve user synchronized application settings",
     "Unable to update user synchronized application settings": "Unable to update user synchronized application settings",
     "Unable to disable user synchronized application settings": "Unable to disable user synchronized application settings",
+    "Browser Cache Management": "Browser Cache Management",
+    "File Cache": "File Cache",
+    "Used storage": "Used storage",
+    "Application Code": "Application Code",
+    "Resource Files": "Resource Files",
+    "Map Data": "Map Data",
+    "Others": "Others",
+    "Failed to load browser cache statistics": "Failed to load browser cache statistics",
+    "Clear File Cache": "Clear File Cache",
+    "Are you sure you want to clear file cache?": "Are you sure you want to clear file cache?",
     "Are you sure you want to re-login?": "Ви впевнені, що хочете увійти знову?",
     "Exchange Rates Data": "Дані про курси валют",
     "User Custom": "User Custom",

src/locales/vi.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "Unable to retrieve user synchronized application settings",
     "Unable to update user synchronized application settings": "Unable to update user synchronized application settings",
     "Unable to disable user synchronized application settings": "Unable to disable user synchronized application settings",
+    "Browser Cache Management": "Browser Cache Management",
+    "File Cache": "File Cache",
+    "Used storage": "Used storage",
+    "Application Code": "Application Code",
+    "Resource Files": "Resource Files",
+    "Map Data": "Map Data",
+    "Others": "Others",
+    "Failed to load browser cache statistics": "Failed to load browser cache statistics",
+    "Clear File Cache": "Clear File Cache",
+    "Are you sure you want to clear file cache?": "Are you sure you want to clear file cache?",
     "Are you sure you want to re-login?": "Bạn có chắc chắn muốn đăng nhập lại không?",
     "Exchange Rates Data": "Dữ liệu tỷ giá hối đoái",
     "User Custom": "User Custom",

src/locales/zh_Hans.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "无法获取用户同步的应用设置",
     "Unable to update user synchronized application settings": "无法更新用户同步的应用设置",
     "Unable to disable user synchronized application settings": "无法禁用用户同步的应用设置",
+    "Browser Cache Management": "浏览器缓存管理",
+    "File Cache": "文件缓存",
+    "Used storage": "已用存储",
+    "Application Code": "应用代码",
+    "Resource Files": "资源文件",
+    "Map Data": "地图数据",
+    "Others": "其他",
+    "Failed to load browser cache statistics": "加载浏览器缓存统计数据失败",
+    "Clear File Cache": "清除文件缓存",
+    "Are you sure you want to clear file cache?": "您确定要清除文件缓存？",
     "Are you sure you want to re-login?": "您确定要重新登录？",
     "Exchange Rates Data": "汇率数据",
     "User Custom": "用户自定义",

src/locales/zh_Hant.json

@@ -2505,6 +2505,16 @@
     "Unable to retrieve user synchronized application settings": "無法取得使用者同步的應用程式設定",
     "Unable to update user synchronized application settings": "無法更新使用者同步的應用程式設定",
     "Unable to disable user synchronized application settings": "無法停用使用者同步的應用程式設定",
+    "Browser Cache Management": "瀏覽器快取管理",
+    "File Cache": "檔案快取",
+    "Used storage": "已使用的儲存空間",
+    "Application Code": "應用程式程式碼",
+    "Resource Files": "資源檔案",
+    "Map Data": "地圖資料",
+    "Others": "其他",
+    "Failed to load browser cache statistics": "載入瀏覽器快取統計資料失敗",
+    "Clear File Cache": "清除檔案快取",
+    "Are you sure you want to clear file cache?": "您確定要清除檔案快取？",
     "Are you sure you want to re-login?": "您確定要重新登入？",
     "Exchange Rates Data": "匯率資料",
     "User Custom": "使用者自訂",

src/router/mobile.ts

@@ -23,6 +23,7 @@ import TextSizeSettingsPage from '@/views/mobile/settings/TextSizeSettingsPage.v
 import PageSettingsPage from '@/views/mobile/settings/PageSettingsPage.vue';
 import AccountCategoryDisplayOrderSettingsPage from '@/views/mobile/settings/AccountCategoryDisplayOrderSettingsPage.vue';
 import ApplicationCloudSyncSettingsPage from '@/views/mobile/settings/ApplicationCloudSyncSettingsPage.vue';
+import BrowserCacheSettingPage from '@/views/mobile/settings/BrowserCacheSettingPage.vue';
 import AccountFilterSettingsPage from '@/views/mobile/settings/AccountFilterSettingsPage.vue';
 import CategoryFilterSettingsPage from '@/views/mobile/settings/CategoryFilterSettingsPage.vue';
 import TransactionTagFilterSettingsPage from '@/views/mobile/settings/TransactionTagFilterSettingsPage.vue';
@@ -250,6 +251,11 @@ const routes: Router.RouteParameters[] = [
         async: asyncResolve(ApplicationCloudSyncSettingsPage),
         beforeEnter: [checkLogin]
     },
+    {
+        path: '/settings/browser_caches',
+        async: asyncResolve(BrowserCacheSettingPage),
+        beforeEnter: [checkLogin]
+    },
     {
         path: '/settings',
         async: asyncResolve(SettingsPage),

src/stores/exchangeRates.ts

@@ -33,6 +33,10 @@ function getExchangeRatesFromLocalStorage(): LatestExchangeRates {
     return JSON.parse(storageData) as LatestExchangeRates;
 }
 
+function getExchangeRatesRawDataFromLocalStorage(): string | null {
+    return localStorage.getItem(exchangeRatesLocalStorageKey);
+}
+
 function setExchangeRatesToLocalStorage(value: LatestExchangeRates): void {
     const storageData = JSON.stringify(value);
     localStorage.setItem(exchangeRatesLocalStorageKey, storageData);
@@ -121,6 +125,16 @@ export const useExchangeRatesStore = defineStore('exchangeRates', () => {
         }
     }
 
+    function getExchangeRatesCacheSize(): number {
+        const storageData = getExchangeRatesRawDataFromLocalStorage();
+
+        if (!storageData) {
+            return 0;
+        }
+
+        return new Blob([storageData]).size;
+    }
+
     function resetLatestExchangeRates(): void {
         latestExchangeRates.value = {};
         clearExchangeRatesFromLocalStorage();
@@ -283,6 +297,7 @@ export const useExchangeRatesStore = defineStore('exchangeRates', () => {
         exchangeRatesLastUpdateTime,
         latestExchangeRateMap,
         // functions
+        getExchangeRatesCacheSize,
         resetLatestExchangeRates,
         getLatestExchangeRates,
         updateUserCustomExchangeRate,

src/views/base/AboutPageBase.ts

@@ -15,7 +15,7 @@ import { getMapWebsite } from '@/lib/map/index.ts';
 import { getContributors } from '@/lib/contributors.ts';
 import { getLicense, getThirdPartyLicenses } from '@/lib/licenses.ts';
 import { formatDisplayVersion, getClientDisplayVersion, getClientBuildTime } from '@/lib/version.ts';
-import { clearBrowserCaches } from '@/lib/ui/common.ts';
+import { clearAllBrowserCaches } from '@/lib/cache.ts';
 
 export function useAboutPageBase() {
     const { tt, formatDateTimeToLongDateTime } = useI18n();
@@ -61,7 +61,7 @@ export function useAboutPageBase() {
     const thirdPartyLicenses = computed<LicenseInfo[]>(() => getThirdPartyLicenses());
 
     function refreshBrowserCache(): void {
-        clearBrowserCaches().then(() => {
+        clearAllBrowserCaches().then(() => {
             location.reload();
         });
     }

src/views/desktop/app/AppSettingsPage.vue

@@ -17,6 +17,10 @@
                 <v-icon size="20" start :icon="mdiCloudOutline"/>
                 {{ tt('Settings Sync') }}
             </v-tab>
+            <v-tab value="browserCacheSetting" @click="pushRouter('browserCacheSetting')">
+                <v-icon size="20" start :icon="mdiDatabaseClockOutline"/>
+                {{ tt('Browser Cache Management') }}
+            </v-tab>
         </v-tabs>
 
         <v-window class="mt-4 disable-tab-transition" v-model="activeTab">
@@ -35,6 +39,10 @@
             <v-window-item value="cloudSyncSetting">
                 <app-cloud-sync-setting-tab/>
             </v-window-item>
+
+            <v-window-item value="browserCacheSetting">
+                <app-browser-cache-setting-tab/>
+            </v-window-item>
         </v-window>
     </div>
 </template>
@@ -44,6 +52,7 @@ import AppBasicSettingTab from './settings/tabs/AppBasicSettingTab.vue';
 import AppLockSettingTab from './settings/tabs/AppLockSettingTab.vue';
 import AppStatisticsSettingTab from './settings/tabs/AppStatisticsSettingTab.vue';
 import AppCloudSyncSettingTab from './settings/tabs/AppCloudSyncSettingTab.vue';
+import AppBrowserCacheSettingTab from './settings/tabs/AppBrowserCacheSettingTab.vue';
 
 import { ref } from 'vue';
 import { useRouter, onBeforeRouteUpdate } from 'vue-router';
@@ -54,7 +63,8 @@ import {
     mdiCogOutline,
     mdiLockOpenOutline,
     mdiChartPieOutline,
-    mdiCloudOutline
+    mdiCloudOutline,
+    mdiDatabaseClockOutline
 } from '@mdi/js';
 
 const props = defineProps<{
@@ -69,7 +79,8 @@ const ALL_TABS: string[] = [
     'basicSetting',
     'applicationLockSetting',
     'statisticsSetting',
-    'cloudSyncSetting'
+    'cloudSyncSetting',
+    'browserCacheSetting'
 ];
 
 const activeTab = ref<string>((() => {

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

@@ -0,0 +1,161 @@
+<template>
+    <v-row>
+        <v-col cols="12">
+            <v-card :class="{ 'disabled': loadingCacheStatistics }">
+                <template #title>
+                    <div class="d-flex align-center">
+                        <span>{{ tt('File Cache') }}</span>
+                        <v-btn density="compact" color="default" variant="text" size="24"
+                               class="ms-2" :icon="true" :loading="loadingCacheStatistics" @click="reloadCacheStatistics()">
+                            <template #loader>
+                                <v-progress-circular indeterminate size="20"/>
+                            </template>
+                            <v-icon :icon="mdiRefresh" size="24" />
+                            <v-tooltip activator="parent">{{ tt('Refresh') }}</v-tooltip>
+                        </v-btn>
+                    </div>
+                </template>
+
+                <v-card-text class="mt-1" v-if="loadingCacheStatistics">
+                    <span class="text-body-1">{{ tt('Used storage') }}</span>
+                    <v-skeleton-loader class="d-inline-block skeleton-no-margin ml-1 pt-1 pb-1" type="text" style="width: 100px; height: 24px" :loading="true" v-if="loadingCacheStatistics"></v-skeleton-loader>
+                </v-card-text>
+
+                <v-card-text v-else-if="!loadingCacheStatistics">
+                    <span class="text-body-1">{{ tt('Used storage') }}</span>
+                    <span class="text-xl ml-1" v-if="!loadingCacheStatistics">{{ fileCacheStatistics ? formatVolumeToLocalizedNumerals(fileCacheStatistics.totalCacheSize, 2) : '-' }}</span>
+                </v-card-text>
+
+                <v-card-text>
+                    <v-row>
+                        <v-col cols="6" sm="3" :key="idx" v-for="(item, idx) in [
+                            {
+                                title: 'Application Code',
+                                count: fileCacheStatistics ? formatVolumeToLocalizedNumerals(fileCacheStatistics.codeCacheSize, 2) : '-',
+                                icon: mdiFileCodeOutline,
+                                color: 'info-darken-1'
+                            },
+                            {
+                                title: 'Resource Files',
+                                count: fileCacheStatistics ? formatVolumeToLocalizedNumerals(fileCacheStatistics.assetsCacheSize, 2) : '-',
+                                icon: mdiFileImageOutline,
+                                color: 'teal'
+                            },
+                            {
+                                title: 'Map Data',
+                                count: fileCacheStatistics ? formatVolumeToLocalizedNumerals(fileCacheStatistics.mapCacheSize, 2) : '-',
+                                icon: mdiFileImageMarkerOutline,
+                                color: 'warning'
+                            },
+                            {
+                                title: 'Others',
+                                count: fileCacheStatistics ? formatVolumeToLocalizedNumerals(fileCacheStatistics.othersCacheSize, 2) : '-',
+                                icon: mdiFileOutline,
+                                color: 'grey'
+                            }
+                        ]">
+                            <div class="d-flex align-center">
+                                <div class="me-3">
+                                    <v-avatar rounded :color="item.color" size="42" class="elevation-1">
+                                        <v-icon size="24" :icon="item.icon"/>
+                                    </v-avatar>
+                                </div>
+
+                                <div class="d-flex flex-column">
+                                    <span class="text-caption">{{ tt(item.title) }}</span>
+                                    <v-skeleton-loader class="skeleton-no-margin pt-2 pb-2" type="text" style="width: 100px" :loading="true" v-if="loadingCacheStatistics"></v-skeleton-loader>
+                                    <span class="text-xl" v-if="!loadingCacheStatistics">{{ item.count }}</span>
+                                </div>
+                            </div>
+                        </v-col>
+                    </v-row>
+                </v-card-text>
+
+                <v-card-text class="mt-2">
+                    <v-btn color="gray" variant="tonal"
+                           :disabled="loadingCacheStatistics || !fileCacheStatistics"  @click="clearFileCache()">
+                        {{ tt('Clear File Cache') }}
+                    </v-btn>
+                </v-card-text>
+            </v-card>
+        </v-col>
+
+        <v-col cols="12">
+            <v-card>
+                <template #title>
+                    <div class="d-flex align-center">
+                        <span>{{ tt('Exchange Rates Data') }}</span>
+                    </div>
+                </template>
+
+                <v-card-text>
+                    <span class="text-body-1">{{ tt('Used storage') }}</span>
+                    <span class="text-xl ml-1">{{ formatVolumeToLocalizedNumerals(exchangeRatesCacheSize ?? 0, 2) }}</span>
+                </v-card-text>
+            </v-card>
+        </v-col>
+    </v-row>
+
+    <confirm-dialog ref="confirmDialog"/>
+    <snack-bar ref="snackbar" />
+</template>
+
+<script setup lang="ts">
+import ConfirmDialog from '@/components/desktop/ConfirmDialog.vue';
+import SnackBar from '@/components/desktop/SnackBar.vue';
+
+import { ref, useTemplateRef } from 'vue';
+
+import { useI18n } from '@/locales/helpers.ts';
+
+import { useExchangeRatesStore } from '@/stores/exchangeRates.ts';
+
+import { type BrowserCacheStatistics } from '@/core/cache.ts';
+
+import { loadBrowserCacheStatistics, clearAllBrowserCaches } from '@/lib/cache.ts';
+
+import {
+    mdiRefresh,
+    mdiFileCodeOutline,
+    mdiFileImageOutline,
+    mdiFileImageMarkerOutline,
+    mdiFileOutline
+} from '@mdi/js';
+
+type ConfirmDialogType = InstanceType<typeof ConfirmDialog>;
+type SnackBarType = InstanceType<typeof SnackBar>;
+
+const { tt, formatVolumeToLocalizedNumerals } = useI18n();
+
+const exchangeRatesStore = useExchangeRatesStore();
+
+const confirmDialog = useTemplateRef<ConfirmDialogType>('confirmDialog');
+const snackbar = useTemplateRef<SnackBarType>('snackbar');
+
+const loadingCacheStatistics = ref<boolean>(true);
+const fileCacheStatistics = ref<BrowserCacheStatistics | undefined>(undefined);
+const exchangeRatesCacheSize = ref<number | undefined>(undefined);
+
+function reloadCacheStatistics(): void {
+    loadingCacheStatistics.value = true;
+
+    loadBrowserCacheStatistics().then(statistics => {
+        fileCacheStatistics.value = statistics;
+        exchangeRatesCacheSize.value = exchangeRatesStore.getExchangeRatesCacheSize();
+        loadingCacheStatistics.value = false;
+    }).catch(() => {
+        loadingCacheStatistics.value = false;
+        snackbar.value?.showError('Failed to load browser cache statistics');
+    });
+}
+
+function clearFileCache(): void {
+    confirmDialog.value?.open('Are you sure you want to clear file cache?').then(() => {
+        clearAllBrowserCaches().then(() => {
+            location.reload();
+        });
+    });
+}
+
+reloadCacheStatistics();
+</script>

src/views/mobile/SettingsPage.vue

@@ -108,6 +108,7 @@
                 </template>
             </f7-list-item>
 
+            <f7-list-item :title="tt('Browser Cache Management')" link="/settings/browser_caches"></f7-list-item>
             <f7-list-item link="#" no-chevron :title="tt('Switch to Desktop Version')" @click="switchToDesktopVersion"></f7-list-item>
 
             <f7-list-item :title="tt('About')" link="/about" :after="version"></f7-list-item>

src/views/mobile/settings/BrowserCacheSettingPage.vue

@@ -0,0 +1,103 @@
+<template>
+    <f7-page>
+        <f7-navbar>
+            <f7-nav-left :class="{ 'disabled': loading }" :back-link="tt('Back')"></f7-nav-left>
+            <f7-nav-title :title="tt('Browser Cache Management')"></f7-nav-title>
+            <f7-nav-right :class="{ 'disabled': loading }">
+                <f7-link icon-f7="ellipsis" :class="{ 'disabled': loading || !fileCacheStatistics }" @click="showMoreActionSheet = true"></f7-link>
+            </f7-nav-right>
+        </f7-navbar>
+
+        <f7-list strong inset dividers class="margin-vertical skeleton-text" v-if="loading">
+            <f7-list-item group-title :sortable="false">
+                <small>{{ tt('File Cache') }}</small>
+            </f7-list-item>
+            <f7-list-item title="Used storage" after="Count"></f7-list-item>
+            <f7-list-item title="Application Code" after="Count"></f7-list-item>
+            <f7-list-item title="Resource Files" after="Count"></f7-list-item>
+            <f7-list-item title="Map Data" after="Count"></f7-list-item>
+            <f7-list-item title="Others" after="Count"></f7-list-item>
+        </f7-list>
+
+        <f7-list strong inset dividers class="margin-vertical skeleton-text" v-if="loading">
+            <f7-list-item group-title :sortable="false">
+                <small>{{ tt('Exchange Rates Data') }}</small>
+            </f7-list-item>
+            <f7-list-item title="Used storage" after="Count"></f7-list-item>
+        </f7-list>
+
+        <f7-list strong inset dividers class="margin-vertical" v-if="!loading">
+            <f7-list-item group-title :sortable="false">
+                <small>{{ tt('File Cache') }}</small>
+            </f7-list-item>
+            <f7-list-item :title="tt('Used storage')" :after="fileCacheStatistics ? formatVolumeToLocalizedNumerals(fileCacheStatistics.totalCacheSize, 2) : '-'"></f7-list-item>
+            <f7-list-item :title="tt('Application Code')" :after="fileCacheStatistics ? formatVolumeToLocalizedNumerals(fileCacheStatistics.codeCacheSize, 2) : '-'"></f7-list-item>
+            <f7-list-item :title="tt('Resource Files')" :after="fileCacheStatistics ? formatVolumeToLocalizedNumerals(fileCacheStatistics.assetsCacheSize, 2) : '-'"></f7-list-item>
+            <f7-list-item :title="tt('Map Data')" :after="fileCacheStatistics ? formatVolumeToLocalizedNumerals(fileCacheStatistics.mapCacheSize, 2) : '-'"></f7-list-item>
+            <f7-list-item :title="tt('Others')" :after="fileCacheStatistics ? formatVolumeToLocalizedNumerals(fileCacheStatistics.othersCacheSize, 2) : '-'"></f7-list-item>
+        </f7-list>
+
+        <f7-list strong inset dividers class="margin-vertical" v-if="!loading">
+            <f7-list-item group-title :sortable="false">
+                <small>{{ tt('Exchange Rates Data') }}</small>
+            </f7-list-item>
+            <f7-list-item :title="tt('Used storage')" :after="formatVolumeToLocalizedNumerals(exchangeRatesCacheSize ?? 0, 2)"></f7-list-item>
+        </f7-list>
+
+        <f7-actions close-by-outside-click close-on-escape :opened="showMoreActionSheet" @actions:closed="showMoreActionSheet = false">
+            <f7-actions-group>
+                <f7-actions-button :class="{ 'disabled': loading || !fileCacheStatistics }"
+                                   @click="clearFileCache">{{ tt('Clear File Cache') }}</f7-actions-button>
+            </f7-actions-group>
+            <f7-actions-group>
+                <f7-actions-button bold close>{{ tt('Cancel') }}</f7-actions-button>
+            </f7-actions-group>
+        </f7-actions>
+    </f7-page>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue';
+
+import { useI18n } from '@/locales/helpers.ts';
+import { useI18nUIComponents } from '@/lib/ui/mobile.ts';
+
+import { useExchangeRatesStore } from '@/stores/exchangeRates.ts';
+
+import { type BrowserCacheStatistics } from '@/core/cache.ts';
+
+import { loadBrowserCacheStatistics, clearAllBrowserCaches } from '@/lib/cache.ts';
+
+const { tt, formatVolumeToLocalizedNumerals } = useI18n();
+const { showConfirm, showToast } = useI18nUIComponents();
+
+const exchangeRatesStore = useExchangeRatesStore();
+
+const loading = ref<boolean>(true);
+const showMoreActionSheet = ref<boolean>(false);
+const fileCacheStatistics = ref<BrowserCacheStatistics | undefined>(undefined);
+const exchangeRatesCacheSize = ref<number | undefined>(undefined);
+
+function reloadCacheStatistics(): void {
+    loading.value = true;
+
+    loadBrowserCacheStatistics().then(statistics => {
+        fileCacheStatistics.value = statistics;
+        exchangeRatesCacheSize.value = exchangeRatesStore.getExchangeRatesCacheSize();
+        loading.value = false;
+    }).catch(() => {
+        loading.value = false;
+        showToast('Failed to load browser cache statistics');
+    });
+}
+
+function clearFileCache(): void {
+    showConfirm('Are you sure you want to clear file cache?', () => {
+        clearAllBrowserCaches().then(() => {
+            location.reload();
+        });
+    });
+}
+
+reloadCacheStatistics();
+</script>