improving general usability and stability
This commit is contained in:
1 parent
643e7acf30
commit
b9159cf61f
17 files changed
+754
-218
No files matched your search
@@ -1,4 +1,6 @@
|
||||
import { Config, Wallpaper } from '../../types';
|
||||
import { Category, Config, Wallpaper } from '../../types';
|
||||
import { DEFAULT_CATEGORIES } from '../../constants';
|
||||
import { baseWallpapers } from '../utils/baseWallpapers';
|
||||
import {
|
||||
addWallpaperToChromeStorageLocal,
|
||||
checkChromeStorageLocalAvailable,
|
||||
@@ -53,21 +55,88 @@ const deepMerge = <T>(base: T, stored: unknown): T => {
|
||||
const result: Record<string, unknown> = { ...(base as Record<string, unknown>) };
|
||||
const storedObj = isPlainObject(stored) ? stored : {};
|
||||
for (const key of Object.keys(result)) {
|
||||
if (Object.prototype.hasOwnProperty.call(storedObj, key)) {
|
||||
result[key] = deepMerge(result[key], storedObj[key]);
|
||||
}
|
||||
result[key] = deepMerge(result[key], Object.prototype.hasOwnProperty.call(storedObj, key) ? storedObj[key] : undefined);
|
||||
}
|
||||
return result as T;
|
||||
}
|
||||
if (Array.isArray(base)) {
|
||||
return (Array.isArray(stored) ? stored : base) as T;
|
||||
return [...(Array.isArray(stored) ? stored : base)] as T;
|
||||
}
|
||||
if (stored === null) return base;
|
||||
return typeof stored === typeof base ? (stored as T) : base;
|
||||
};
|
||||
|
||||
export const normalizeConfig = (stored: unknown): Config =>
|
||||
deepMerge(DEFAULT_CONFIG, stored);
|
||||
const boundedNumber = (value: number, fallback: number, min: number, max: number): number =>
|
||||
Number.isFinite(value) ? Math.min(max, Math.max(min, value)) : fallback;
|
||||
|
||||
const choice = (value: string, values: string[], fallback: string): string =>
|
||||
values.includes(value) ? value : fallback;
|
||||
|
||||
const hasStrings = (value: unknown, keys: string[]): value is Record<string, string> =>
|
||||
isPlainObject(value) && keys.every(key => typeof value[key] === 'string');
|
||||
|
||||
export const normalizeConfig = (stored: unknown): Config => {
|
||||
const config = deepMerge(DEFAULT_CONFIG, stored);
|
||||
config.currentWallpapers = [...new Set(config.currentWallpapers.filter(name => typeof name === 'string' && name.length > 0))];
|
||||
config.wallpaperBlur = boundedNumber(config.wallpaperBlur, DEFAULT_CONFIG.wallpaperBlur, 0, 50);
|
||||
config.wallpaperBrightness = boundedNumber(config.wallpaperBrightness, DEFAULT_CONFIG.wallpaperBrightness, 0, 200);
|
||||
config.wallpaperOpacity = boundedNumber(config.wallpaperOpacity, DEFAULT_CONFIG.wallpaperOpacity, 1, 100);
|
||||
config.titleSize = choice(config.titleSize, ['tiny', 'small', 'medium', 'large'], DEFAULT_CONFIG.titleSize);
|
||||
config.tileSize = choice(config.tileSize || 'medium', ['small', 'medium', 'large'], 'medium');
|
||||
config.alignment = choice(config.alignment, ['top', 'middle', 'bottom'], DEFAULT_CONFIG.alignment);
|
||||
config.horizontalAlignment = choice(config.horizontalAlignment, ['left', 'middle', 'right'], DEFAULT_CONFIG.horizontalAlignment);
|
||||
config.clock.size = choice(config.clock.size, ['tiny', 'small', 'medium', 'large'], DEFAULT_CONFIG.clock.size);
|
||||
config.clock.format = choice(config.clock.format, ['HH:mm', 'h:mm A'], DEFAULT_CONFIG.clock.format);
|
||||
config.serverWidget.pingFrequency = boundedNumber(config.serverWidget.pingFrequency, DEFAULT_CONFIG.serverWidget.pingFrequency, 5, 60);
|
||||
const serverIds = new Set<string>();
|
||||
config.serverWidget.servers = config.serverWidget.servers.filter(server => {
|
||||
if (!hasStrings(server, ['id', 'name', 'address']) || !server.id || serverIds.has(server.id)) return false;
|
||||
serverIds.add(server.id);
|
||||
return true;
|
||||
}).map(server => ({ id: server.id, name: server.name, address: server.address }));
|
||||
return config;
|
||||
};
|
||||
|
||||
export const normalizeCategories = (stored: unknown): Category[] => {
|
||||
if (!Array.isArray(stored)) return normalizeCategories(DEFAULT_CATEGORIES);
|
||||
const categoryIds = new Set<string>();
|
||||
const websiteIds = new Set<string>();
|
||||
return stored.flatMap(category => {
|
||||
if (!hasStrings(category, ['id', 'name']) || !category.id || categoryIds.has(category.id)) return [];
|
||||
categoryIds.add(category.id);
|
||||
const websites = isPlainObject(category) && Array.isArray(category.websites) ? category.websites : [];
|
||||
return [{
|
||||
id: category.id,
|
||||
name: category.name,
|
||||
websites: websites.flatMap(website => {
|
||||
if (!hasStrings(website, ['id', 'name', 'url']) || !website.id || websiteIds.has(website.id)) return [];
|
||||
websiteIds.add(website.id);
|
||||
return [{ id: website.id, name: website.name, url: website.url, icon: typeof website.icon === 'string' ? website.icon : '', categoryId: category.id }];
|
||||
}),
|
||||
}];
|
||||
});
|
||||
};
|
||||
|
||||
export const normalizeUserWallpapers = (stored: unknown): Wallpaper[] => {
|
||||
if (!Array.isArray(stored)) return [];
|
||||
const names = new Set(baseWallpapers.map(wallpaper => wallpaper.name));
|
||||
return stored.flatMap(wallpaper => {
|
||||
if (!hasStrings(wallpaper, ['name']) || !wallpaper.name || names.has(wallpaper.name)) return [];
|
||||
names.add(wallpaper.name);
|
||||
return [{
|
||||
name: wallpaper.name,
|
||||
...(typeof wallpaper.url === 'string' ? { url: wallpaper.url } : {}),
|
||||
...(typeof wallpaper.base64 === 'string' ? { base64: wallpaper.base64 } : {}),
|
||||
}];
|
||||
});
|
||||
};
|
||||
|
||||
const assertWallpaperNameAvailable = (name: string): void => {
|
||||
const names = [...baseWallpapers, ...ConfigurationService.loadUserWallpapers()];
|
||||
if (name.startsWith('vision-start:icon:') || names.some(wallpaper => wallpaper.name === name)) {
|
||||
throw new Error('A wallpaper with this name already exists or the name is reserved. Please choose a different name.');
|
||||
}
|
||||
};
|
||||
|
||||
export const ConfigurationService = {
|
||||
loadConfig(): Config {
|
||||
@@ -80,19 +149,31 @@ export const ConfigurationService = {
|
||||
} catch (error) {
|
||||
console.error('Error parsing config from localStorage', error);
|
||||
}
|
||||
return { ...DEFAULT_CONFIG };
|
||||
return normalizeConfig(null);
|
||||
},
|
||||
|
||||
saveConfig(config: Config): void {
|
||||
localStorage.setItem('config', JSON.stringify(config));
|
||||
try {
|
||||
localStorage.setItem('config', JSON.stringify(config));
|
||||
} catch (error) {
|
||||
console.error('Error saving config to localStorage', error);
|
||||
}
|
||||
},
|
||||
|
||||
loadCategories(): Category[] {
|
||||
try {
|
||||
return normalizeCategories(safeParse(localStorage.getItem('categories')));
|
||||
} catch (error) {
|
||||
console.error('Error reading categories from localStorage', error);
|
||||
return normalizeCategories(null);
|
||||
}
|
||||
},
|
||||
|
||||
loadUserWallpapers(): Wallpaper[] {
|
||||
try {
|
||||
const stored = localStorage.getItem('userWallpapers');
|
||||
if (stored) return JSON.parse(stored);
|
||||
if (stored) return normalizeUserWallpapers(JSON.parse(stored));
|
||||
} catch {
|
||||
// ignore
|
||||
}
|
||||
return [];
|
||||
},
|
||||
@@ -113,10 +194,13 @@ export const ConfigurationService = {
|
||||
throw new Error('Wallpaper URLs must use HTTP or HTTPS.');
|
||||
}
|
||||
const finalName = name.trim() || getFileNameFromUrl(parsedUrl) || 'Wallpaper';
|
||||
assertWallpaperNameAvailable(finalName);
|
||||
return { name: finalName, url: parsedUrl.href };
|
||||
},
|
||||
|
||||
async addWallpaperFile(file: File): Promise<Wallpaper> {
|
||||
if (!file.type.startsWith('image/')) throw new Error('Please choose an image file.');
|
||||
assertWallpaperNameAvailable(file.name.trim());
|
||||
return new Promise((resolve, reject) => {
|
||||
if (file.size > 4 * 1024 * 1024) {
|
||||
reject(new Error('File size exceeds 4MB. Please choose a smaller file.'));
|
||||
@@ -130,6 +214,7 @@ export const ConfigurationService = {
|
||||
return;
|
||||
}
|
||||
try {
|
||||
assertWallpaperNameAvailable(file.name.trim());
|
||||
const finalName = await addWallpaperToChromeStorageLocal(file.name, base64);
|
||||
resolve({ name: finalName });
|
||||
} catch (error) {
|
||||
@@ -172,6 +257,7 @@ export const ConfigurationService = {
|
||||
},
|
||||
|
||||
async importConfig(file: File): Promise<{ config: Config; userWallpapers: Wallpaper[] }> {
|
||||
if (file.size > 10 * 1024 * 1024) throw new Error('Configuration files must be no larger than 10MB.');
|
||||
const fileContent = await file.text();
|
||||
const parsed = JSON.parse(fileContent);
|
||||
const localStorageData =
|
||||
@@ -179,30 +265,47 @@ export const ConfigurationService = {
|
||||
? parsed.localStorage
|
||||
: parsed;
|
||||
|
||||
if (!localStorageData || typeof localStorageData !== 'object') {
|
||||
if (!isPlainObject(localStorageData)) {
|
||||
throw new Error('Invalid import file format.');
|
||||
}
|
||||
|
||||
let importedAny = false;
|
||||
REQUIRED_LOCAL_STORAGE_KEYS.forEach((key) => {
|
||||
const updates = new Map<RequiredLocalStorageKey, string>();
|
||||
for (const key of REQUIRED_LOCAL_STORAGE_KEYS) {
|
||||
if (Object.prototype.hasOwnProperty.call(localStorageData, key)) {
|
||||
const rawValue = (localStorageData as Record<string, unknown>)[key];
|
||||
localStorage.setItem(key, toStorageString(rawValue));
|
||||
importedAny = true;
|
||||
const raw = localStorageData[key];
|
||||
const value = typeof raw === 'string' ? safeParse(raw) : raw;
|
||||
if (value === null) continue;
|
||||
if ((key === 'config' || key === 'wallpaperState') && !isPlainObject(value)) {
|
||||
throw new Error(`Invalid ${key} in import file.`);
|
||||
}
|
||||
if ((key === 'categories' || key === 'userWallpapers') && !Array.isArray(value)) {
|
||||
throw new Error(`Invalid ${key} in import file.`);
|
||||
}
|
||||
const normalized = key === 'config' ? normalizeConfig(value)
|
||||
: key === 'categories' ? normalizeCategories(value)
|
||||
: key === 'userWallpapers' ? normalizeUserWallpapers(value) : value;
|
||||
updates.set(key, toStorageString(normalized));
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (!importedAny) {
|
||||
if (updates.size === 0) {
|
||||
throw new Error(`No required keys found. Expected: ${REQUIRED_LOCAL_STORAGE_KEYS.join(', ')}`);
|
||||
}
|
||||
|
||||
const importedConfig = (localStorageData as Record<string, unknown>).config;
|
||||
const importedUserWallpapers = (localStorageData as Record<string, unknown>)
|
||||
.userWallpapers;
|
||||
const previous = new Map([...updates.keys()].map(key => [key, localStorage.getItem(key)]));
|
||||
try {
|
||||
for (const [key, value] of updates) localStorage.setItem(key, value);
|
||||
} catch (error) {
|
||||
for (const key of updates.keys()) localStorage.removeItem(key);
|
||||
for (const [key, value] of previous) {
|
||||
if (value !== null) localStorage.setItem(key, value);
|
||||
}
|
||||
throw error;
|
||||
}
|
||||
|
||||
return {
|
||||
config: normalizeConfig(importedConfig),
|
||||
userWallpapers: Array.isArray(importedUserWallpapers) ? importedUserWallpapers : [],
|
||||
config: this.loadConfig(),
|
||||
userWallpapers: this.loadUserWallpapers(),
|
||||
};
|
||||
},
|
||||
};
|
||||
Reference in new issue
Block a user