@kbve/droid 0.0.6 → 0.1.2

package/src/lib/sw-recovery.spec.ts

@@ -0,0 +1,165 @@
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
+import { swRecovery } from './sw-recovery';
+
+type Reg = {
+	scriptURL: string;
+	unregister: ReturnType<typeof vi.fn>;
+};
+
+function makeReg(scriptURL: string, unregisterReturn = true): Reg {
+	return {
+		scriptURL,
+		unregister: vi.fn().mockResolvedValue(unregisterReturn),
+	};
+}
+
+function installNavigator(regs: Reg[]) {
+	const registrations = regs.map((r) => ({
+		active: { scriptURL: r.scriptURL },
+		installing: null,
+		waiting: null,
+		unregister: r.unregister,
+	})) as unknown as ServiceWorkerRegistration[];
+
+	Object.defineProperty(globalThis, 'navigator', {
+		value: {
+			serviceWorker: {
+				getRegistrations: vi.fn().mockResolvedValue(registrations),
+			},
+		},
+		configurable: true,
+		writable: true,
+	});
+}
+
+function installCaches(keys: string[]) {
+	const cacheStore: Record<string, boolean> = Object.fromEntries(
+		keys.map((k) => [k, true]),
+	);
+	(globalThis as unknown as { caches: CacheStorage }).caches = {
+		keys: vi.fn().mockResolvedValue([...keys]),
+		delete: vi.fn(async (key: string) => {
+			const had = !!cacheStore[key];
+			delete cacheStore[key];
+			return had;
+		}),
+		match: vi.fn(),
+		has: vi.fn(),
+		open: vi.fn(),
+	} as unknown as CacheStorage;
+}
+
+function clearGlobals() {
+	delete (globalThis as unknown as { navigator?: unknown }).navigator;
+	delete (globalThis as unknown as { caches?: unknown }).caches;
+}
+
+beforeEach(() => {
+	clearGlobals();
+	vi.spyOn(console, 'info').mockImplementation(vi.fn());
+	vi.spyOn(console, 'warn').mockImplementation(vi.fn());
+});
+
+afterEach(() => {
+	clearGlobals();
+	vi.restoreAllMocks();
+});
+
+describe('swRecovery', () => {
+	it('returns unsupported when navigator has no serviceWorker', async () => {
+		Object.defineProperty(globalThis, 'navigator', {
+			value: {},
+			configurable: true,
+			writable: true,
+		});
+		const result = await swRecovery();
+		expect(result.supported).toBe(false);
+		expect(result.unregistered).toEqual([]);
+	});
+
+	it('unregisters all SWs when allowedScripts is empty', async () => {
+		const stale = makeReg('https://chat.kbve.com/sw.js');
+		const other = makeReg('https://chat.kbve.com/old-sw.js');
+		installNavigator([stale, other]);
+		installCaches(['a', 'b']);
+
+		const result = await swRecovery();
+		expect(result.supported).toBe(true);
+		expect(result.unregistered).toEqual([
+			'https://chat.kbve.com/sw.js',
+			'https://chat.kbve.com/old-sw.js',
+		]);
+		expect(result.keptScripts).toEqual([]);
+		expect(result.cachesCleared).toEqual(['a', 'b']);
+		expect(stale.unregister).toHaveBeenCalledTimes(1);
+		expect(other.unregister).toHaveBeenCalledTimes(1);
+	});
+
+	it('keeps SWs whose absolute scriptURL is in allowedScripts', async () => {
+		const keep = makeReg('https://chat.kbve.com/sw.js');
+		const drop = makeReg('https://chat.kbve.com/legacy.js');
+		installNavigator([keep, drop]);
+		installCaches([]);
+
+		const result = await swRecovery({
+			allowedScripts: ['https://chat.kbve.com/sw.js'],
+		});
+		expect(result.keptScripts).toEqual(['https://chat.kbve.com/sw.js']);
+		expect(result.unregistered).toEqual([
+			'https://chat.kbve.com/legacy.js',
+		]);
+		expect(keep.unregister).not.toHaveBeenCalled();
+		expect(drop.unregister).toHaveBeenCalledTimes(1);
+	});
+
+	it('keeps SWs whose pathname matches an allowed pathname rule', async () => {
+		const keep = makeReg('https://chat.kbve.com/sw.js');
+		installNavigator([keep]);
+		installCaches([]);
+
+		const result = await swRecovery({
+			allowedScripts: ['/sw.js'],
+		});
+		expect(result.keptScripts).toEqual(['https://chat.kbve.com/sw.js']);
+		expect(keep.unregister).not.toHaveBeenCalled();
+	});
+
+	it('skips cache clearing when clearCaches is false', async () => {
+		installNavigator([makeReg('https://chat.kbve.com/old.js')]);
+		installCaches(['x']);
+
+		const result = await swRecovery({ clearCaches: false });
+		expect(result.cachesCleared).toEqual([]);
+	});
+
+	it('does not reload when nothing was removed', async () => {
+		installNavigator([]);
+		installCaches([]);
+
+		const reload = vi.fn();
+		Object.defineProperty(globalThis, 'window', {
+			value: { location: { reload } },
+			configurable: true,
+			writable: true,
+		});
+
+		const result = await swRecovery({ reloadOnCleanup: true });
+		expect(result.reloaded).toBe(false);
+		expect(reload).not.toHaveBeenCalled();
+	});
+
+	it('continues when an individual unregister rejects', async () => {
+		const ok = makeReg('https://chat.kbve.com/a.js');
+		const bad: Reg = {
+			scriptURL: 'https://chat.kbve.com/b.js',
+			unregister: vi.fn().mockRejectedValue(new Error('boom')),
+		};
+		installNavigator([ok, bad]);
+		installCaches([]);
+
+		const result = await swRecovery();
+		expect(result.unregistered).toEqual(['https://chat.kbve.com/a.js']);
+		expect(ok.unregister).toHaveBeenCalled();
+		expect(bad.unregister).toHaveBeenCalled();
+	});
+});

package/src/lib/sw-recovery.ts

@@ -0,0 +1,141 @@
+export interface SwRecoveryOptions {
+	allowedScripts?: readonly string[];
+	clearCaches?: boolean;
+	reloadOnCleanup?: boolean;
+	logPrefix?: string;
+}
+
+export interface SwRecoveryResult {
+	supported: boolean;
+	unregistered: string[];
+	keptScripts: string[];
+	cachesCleared: string[];
+	reloaded: boolean;
+}
+
+const DEFAULT_OPTS: Required<Omit<SwRecoveryOptions, 'allowedScripts'>> & {
+	allowedScripts: readonly string[];
+} = {
+	allowedScripts: [],
+	clearCaches: true,
+	reloadOnCleanup: false,
+	logPrefix: '[sw-recovery]',
+};
+
+function getScriptURL(reg: ServiceWorkerRegistration): string | null {
+	return (
+		reg.active?.scriptURL ??
+		reg.installing?.scriptURL ??
+		reg.waiting?.scriptURL ??
+		null
+	);
+}
+
+function scriptIsAllowed(
+	scriptURL: string | null,
+	allowed: readonly string[],
+): boolean {
+	if (!scriptURL) return false;
+	if (allowed.length === 0) return false;
+	return allowed.some((rule) => {
+		if (rule === scriptURL) return true;
+		try {
+			return new URL(scriptURL).pathname === rule;
+		} catch {
+			return false;
+		}
+	});
+}
+
+export async function swRecovery(
+	opts: SwRecoveryOptions = {},
+): Promise<SwRecoveryResult> {
+	const cfg = { ...DEFAULT_OPTS, ...opts };
+	const result: SwRecoveryResult = {
+		supported: false,
+		unregistered: [],
+		keptScripts: [],
+		cachesCleared: [],
+		reloaded: false,
+	};
+
+	if (
+		typeof navigator === 'undefined' ||
+		!('serviceWorker' in navigator) ||
+		typeof navigator.serviceWorker?.getRegistrations !== 'function'
+	) {
+		return result;
+	}
+
+	result.supported = true;
+
+	let registrations: readonly ServiceWorkerRegistration[] = [];
+	try {
+		registrations = await navigator.serviceWorker.getRegistrations();
+	} catch (err) {
+		console.warn(`${cfg.logPrefix} getRegistrations failed:`, err);
+		return result;
+	}
+
+	for (const reg of registrations) {
+		const scriptURL = getScriptURL(reg);
+		if (scriptIsAllowed(scriptURL, cfg.allowedScripts)) {
+			result.keptScripts.push(scriptURL as string);
+			continue;
+		}
+
+		try {
+			const ok = await reg.unregister();
+			if (ok) {
+				result.unregistered.push(scriptURL ?? '<unknown>');
+			}
+		} catch (err) {
+			console.warn(
+				`${cfg.logPrefix} unregister failed for ${scriptURL}:`,
+				err,
+			);
+		}
+	}
+
+	if (cfg.clearCaches && typeof caches !== 'undefined') {
+		try {
+			const keys = await caches.keys();
+			for (const key of keys) {
+				try {
+					const ok = await caches.delete(key);
+					if (ok) result.cachesCleared.push(key);
+				} catch (err) {
+					console.warn(
+						`${cfg.logPrefix} cache delete failed for ${key}:`,
+						err,
+					);
+				}
+			}
+		} catch (err) {
+			console.warn(`${cfg.logPrefix} caches.keys failed:`, err);
+		}
+	}
+
+	const removedAnything =
+		result.unregistered.length > 0 || result.cachesCleared.length > 0;
+
+	if (removedAnything) {
+		console.info(`${cfg.logPrefix} cleaned`, {
+			unregistered: result.unregistered,
+			kept: result.keptScripts,
+			caches: result.cachesCleared,
+		});
+	}
+
+	if (
+		cfg.reloadOnCleanup &&
+		removedAnything &&
+		typeof window !== 'undefined' &&
+		typeof window.location?.reload === 'function'
+	) {
+		result.reloaded = true;
+		window.location.reload();
+	}
+
+	return result;
+}

package/src/lib/types/bento.spec.ts

@@ -0,0 +1,116 @@
+import { describe, it, expect } from 'vitest';
+import {
+	BentoTileSchema,
+	BENTO_VARIANT_CLASS_MAP,
+	BENTO_ANIMATION_CLASS_MAP,
+	BENTO_BADGE_CLASS_MAP,
+} from './bento';
+
+const validTile = {
+	title: 'Test Tile',
+	primaryColor: 'blue-500',
+	secondaryColor: 'red-300',
+};
+
+describe('BentoTileSchema', () => {
+	it('accepts a minimal valid tile', () => {
+		const result = BentoTileSchema.safeParse(validTile);
+		expect(result.success).toBe(true);
+	});
+
+	it('rejects empty title', () => {
+		const result = BentoTileSchema.safeParse({
+			...validTile,
+			title: '',
+		});
+		expect(result.success).toBe(false);
+	});
+
+	it('rejects invalid primary color format', () => {
+		const result = BentoTileSchema.safeParse({
+			...validTile,
+			primaryColor: 'invalid',
+		});
+		expect(result.success).toBe(false);
+	});
+
+	it('accepts valid ULID id', () => {
+		const result = BentoTileSchema.safeParse({
+			...validTile,
+			id: '01ARZ3NDEKTSV4RRFFQ69G5FAV',
+		});
+		expect(result.success).toBe(true);
+	});
+
+	it('rejects invalid ULID id', () => {
+		const result = BentoTileSchema.safeParse({
+			...validTile,
+			id: 'not-a-ulid',
+		});
+		expect(result.success).toBe(false);
+	});
+
+	it('accepts valid span format', () => {
+		const result = BentoTileSchema.safeParse({
+			...validTile,
+			span: 'col-span-2',
+		});
+		expect(result.success).toBe(true);
+	});
+
+	it('requires target when href is provided', () => {
+		const result = BentoTileSchema.safeParse({
+			...validTile,
+			href: 'https://example.com',
+		});
+		expect(result.success).toBe(false);
+	});
+
+	it('accepts href with target', () => {
+		const result = BentoTileSchema.safeParse({
+			...validTile,
+			href: 'https://example.com',
+			target: '_blank',
+		});
+		expect(result.success).toBe(true);
+	});
+
+	it('requires badge text when badgeType is set', () => {
+		const result = BentoTileSchema.safeParse({
+			...validTile,
+			badgeType: 'success',
+		});
+		expect(result.success).toBe(false);
+	});
+
+	it('accepts badge with badgeType', () => {
+		const result = BentoTileSchema.safeParse({
+			...validTile,
+			badge: 'New',
+			badgeType: 'success',
+		});
+		expect(result.success).toBe(true);
+	});
+});
+
+describe('Bento class maps', () => {
+	it('BENTO_VARIANT_CLASS_MAP has all variants', () => {
+		expect(BENTO_VARIANT_CLASS_MAP).toHaveProperty('default');
+		expect(BENTO_VARIANT_CLASS_MAP).toHaveProperty('minimal');
+		expect(BENTO_VARIANT_CLASS_MAP).toHaveProperty('image-heavy');
+	});
+
+	it('BENTO_ANIMATION_CLASS_MAP has all animations', () => {
+		expect(BENTO_ANIMATION_CLASS_MAP).toHaveProperty('fade-in');
+		expect(BENTO_ANIMATION_CLASS_MAP).toHaveProperty('slide-up');
+		expect(BENTO_ANIMATION_CLASS_MAP).toHaveProperty('none');
+		expect(BENTO_ANIMATION_CLASS_MAP['none']).toBe('');
+	});
+
+	it('BENTO_BADGE_CLASS_MAP has all badge types', () => {
+		expect(BENTO_BADGE_CLASS_MAP).toHaveProperty('default');
+		expect(BENTO_BADGE_CLASS_MAP).toHaveProperty('success');
+		expect(BENTO_BADGE_CLASS_MAP).toHaveProperty('warning');
+		expect(BENTO_BADGE_CLASS_MAP).toHaveProperty('error');
+	});
+});

package/src/lib/types/bento.ts

@@ -5,7 +5,12 @@ export const BENTO_VARIANTS = ['default', 'minimal', 'image-heavy'] as const;
 export const BENTO_ANIMATIONS = ['fade-in', 'slide-up', 'none'] as const;
 export const BENTO_TARGETS = ['_self', '_blank', '_parent', '_top'] as const;
 export const BENTO_ROLES = ['button', 'link', 'region', 'article'] as const;
-export const BENTO_BADGE_TYPES = ['default', 'success', 'warning', 'error'] as const;
+export const BENTO_BADGE_TYPES = [
+	'default',
+	'success',
+	'warning',
+	'error',
+] as const;
 
 // Regex validators
 const tailwindColorRegex = /^[a-z]+-(100|200|300|400|500|600|700|800|900)$/;
@@ -13,68 +18,102 @@ const spanRegex = /^(?:(?:[a-z]+:)?(col|row)-span-\d+\s*)+$/;
 const ulidRegex = /^01[0-9A-HJKMNP-TV-Z]{24}$/;
 
 // Schema
-export const BentoTileSchema = z.object({
-  id: z.string().regex(ulidRegex, 'Invalid ULID format').optional(),
-
-  title: z.string().min(1, 'Title is required'),
-  subtitle: z.string().optional(),
-  description: z.string().optional(),
-  span: z.string().regex(spanRegex, 'Invalid span format (e.g., col-span-2, row-span-1)').optional(),
-
-  primaryColor: z.string().regex(tailwindColorRegex, 'Invalid Tailwind color format (e.g., blue-500)'),
-  secondaryColor: z.string().regex(tailwindColorRegex, 'Invalid Tailwind color format (e.g., blue-500)'),
-
-  icon: z.string().optional(),
-  backgroundImage: z.string().url().optional(),
-
-  onclick: z.string().optional(),
-  href: z.string().url().optional(),
-  target: z.enum(BENTO_TARGETS).optional(),
-
-  ariaLabel: z.string().optional(),
-  role: z.enum(BENTO_ROLES).optional(),
-
-  variant: z.enum(BENTO_VARIANTS).optional(),
-  animation: z.enum(BENTO_ANIMATIONS).optional(),
-
-  badge: z.string().optional(),
-  badgeType: z.enum(BENTO_BADGE_TYPES).optional(),
-
-  priority: z.number().int().min(0).optional(),
-  tooltip: z.string().optional(),
-  disabled: z.boolean().optional(),
-
-  meta: z.record(z.any()).optional(),
-  dataset: z.record(z.string()).optional(),
-  className: z.string().optional(),
-}).refine(
-  (data) => !data.href || (data.href && data.target),
-  { message: 'target is required when href is provided', path: ['target'] }
-).refine(
-  (data) => !data.badgeType || (data.badge && data.badge.length > 0),
-  { message: 'badge must be provided if badgeType is set', path: ['badge'] }
-);
+export const BentoTileSchema = z
+	.object({
+		id: z.string().regex(ulidRegex, 'Invalid ULID format').optional(),
+
+		title: z.string().min(1, 'Title is required'),
+		subtitle: z.string().optional(),
+		description: z.string().optional(),
+		span: z
+			.string()
+			.regex(
+				spanRegex,
+				'Invalid span format (e.g., col-span-2, row-span-1)',
+			)
+			.optional(),
+
+		primaryColor: z
+			.string()
+			.regex(
+				tailwindColorRegex,
+				'Invalid Tailwind color format (e.g., blue-500)',
+			),
+		secondaryColor: z
+			.string()
+			.regex(
+				tailwindColorRegex,
+				'Invalid Tailwind color format (e.g., blue-500)',
+			),
+
+		icon: z.string().optional(),
+		backgroundImage: z.string().url().optional(),
+
+		onclick: z.string().optional(),
+		href: z.string().url().optional(),
+		target: z.enum(BENTO_TARGETS).optional(),
+
+		ariaLabel: z.string().optional(),
+		role: z.enum(BENTO_ROLES).optional(),
+
+		variant: z.enum(BENTO_VARIANTS).optional(),
+		animation: z.enum(BENTO_ANIMATIONS).optional(),
+
+		badge: z.string().optional(),
+		badgeType: z.enum(BENTO_BADGE_TYPES).optional(),
+
+		priority: z.number().int().min(0).optional(),
+		tooltip: z.string().optional(),
+		disabled: z.boolean().optional(),
+
+		meta: z.record(z.string(), z.any()).optional(),
+		dataset: z.record(z.string(), z.string()).optional(),
+		className: z.string().optional(),
+	})
+	.refine((data) => !data.href || (data.href && data.target), {
+		message: 'target is required when href is provided',
+		path: ['target'],
+	})
+	.refine(
+		(data) => !data.badgeType || (data.badge && data.badge.length > 0),
+		{
+			message: 'badge must be provided if badgeType is set',
+			path: ['badge'],
+		},
+	);
 
 // Types
 export type BentoTile = z.infer<typeof BentoTileSchema>;
 export type BentoVariantClass = { base: string; hover?: string };
 
 // Mappings
-export const BENTO_VARIANT_CLASS_MAP: Record<(typeof BENTO_VARIANTS)[number], BentoVariantClass> = {
-  default: { base: 'p-4 flex flex-col justify-between' },
-  minimal: { base: 'p-2 bg-opacity-30 backdrop-blur-sm', hover: 'bg-opacity-50' },
-  'image-heavy': { base: 'p-0 overflow-hidden', hover: 'scale-105' },
+export const BENTO_VARIANT_CLASS_MAP: Record<
+	(typeof BENTO_VARIANTS)[number],
+	BentoVariantClass
+> = {
+	default: { base: 'p-4 flex flex-col justify-between' },
+	minimal: {
+		base: 'p-2 bg-opacity-30 backdrop-blur-sm',
+		hover: 'bg-opacity-50',
+	},
+	'image-heavy': { base: 'p-0 overflow-hidden', hover: 'scale-105' },
 };
 
-export const BENTO_ANIMATION_CLASS_MAP: Record<(typeof BENTO_ANIMATIONS)[number], string> = {
-  'fade-in': 'animate-fade-in',
-  'slide-up': 'animate-slide-up',
-  none: '',
+export const BENTO_ANIMATION_CLASS_MAP: Record<
+	(typeof BENTO_ANIMATIONS)[number],
+	string
+> = {
+	'fade-in': 'animate-fade-in',
+	'slide-up': 'animate-slide-up',
+	none: '',
 };
 
-export const BENTO_BADGE_CLASS_MAP: Record<(typeof BENTO_BADGE_TYPES)[number], string> = {
-  default: 'bg-white/30 text-white',
-  success: 'bg-green-500/80 text-white',
-  warning: 'bg-yellow-500/80 text-black',
-  error: 'bg-red-500/80 text-white',
+export const BENTO_BADGE_CLASS_MAP: Record<
+	(typeof BENTO_BADGE_TYPES)[number],
+	string
+> = {
+	default: 'bg-white/30 text-white',
+	success: 'bg-green-500/80 text-white',
+	warning: 'bg-yellow-500/80 text-black',
+	error: 'bg-red-500/80 text-white',
 };