feat: recent activity card on Home and Retention card on Settings

web/src/lib/__tests__/activityRetention.spec.ts

@@ -0,0 +1,88 @@
+import { afterEach, beforeEach, describe, expect, it } from 'vitest'
+import { initializeLocale, setLocale } from '@/i18n'
+import type { WorkspaceSettings } from '@/composables/useSettings'
+import { recentWhenLabel } from '../activityTime'
+import {
+	helperCopy,
+	isShorter,
+	lastCleanupLine,
+	nextCleanupLine,
+	shorteningDescription,
+} from '../activityRetention'
+
+const NOW = new Date(2026, 9, 6, 15, 0)
+
+function at(day: number, hour: number, minute: number) {
+	return new Date(2026, 9, day, hour, minute).toISOString()
+}
+
+function settings(overrides: Partial<WorkspaceSettings> = {}): WorkspaceSettings {
+	return {
+		version: 'v2.2.0-beta',
+		activity_retention_days: 90,
+		activity_last_cleanup_at: at(6, 3, 0),
+		activity_last_cleanup_removed: 142,
+		activity_next_cleanup_at: at(7, 3, 0),
+		...overrides,
+	}
+}
+
+beforeEach(() => {
+	localStorage.clear()
+	initializeLocale()
+})
+
+afterEach(() => {
+	localStorage.clear()
+	initializeLocale()
+})
+
+describe('recentWhenLabel follows the day', () => {
+	it.each([
+		[at(6, 14, 58), '2 min ago'],
+		[at(6, 12, 0), '3 h ago'],
+		[at(5, 14, 20), 'Yesterday, 14:20'],
+		[at(3, 14, 20), '3 Oct 2026, 14:20'],
+	])('%s reads %s', (iso, label) => {
+		expect(recentWhenLabel(iso, NOW)).toBe(label)
+	})
+
+	it('reads French labels in French', () => {
+		setLocale('fr')
+
+		expect(recentWhenLabel(at(5, 14, 20), NOW)).toBe('Hier, 14:20')
+		expect(recentWhenLabel(at(3, 14, 20), NOW)).toBe('3 oct. 2026, 14:20')
+	})
+})
+
+describe('retention periods', () => {
+	it('ranks 30 < 90 < 365 < Forever', () => {
+		expect(isShorter(30, 90)).toBe(true)
+		expect(isShorter(365, 0)).toBe(true)
+		expect(isShorter(0, 365)).toBe(false)
+		expect(isShorter(90, 90)).toBe(false)
+	})
+})
+
+describe('retention lines', () => {
+	it('reads the last cleanup with its count', () => {
+		expect(lastCleanupLine(settings())).toBe('6 Oct 2026, 03:00 · 142 events removed')
+		expect(lastCleanupLine(settings({ activity_last_cleanup_removed: 1 }))).toBe(
+			'6 Oct 2026, 03:00 · 1 event removed',
+		)
+	})
+
+	it('reads Never before the first cleanup and Not scheduled for Forever', () => {
+		expect(lastCleanupLine(settings({ activity_last_cleanup_at: null }))).toBe('Never')
+		expect(nextCleanupLine(settings({ activity_next_cleanup_at: null }))).toBe('Not scheduled')
+		expect(nextCleanupLine(settings())).toBe('7 Oct 2026, 03:00')
+	})
+
+	it('words the helper and the warning', () => {
+		expect(helperCopy(90)).toBe('Older events are removed automatically.')
+		expect(helperCopy(0)).toBe('Nothing is removed automatically. The log grows over time.')
+		expect(shorteningDescription(settings())).toBe(
+			"This happens at the next cleanup on 7 Oct 2026, 03:00. It can't be undone.",
+		)
+	})
+})

web/src/lib/activityRetention.ts

@@ -0,0 +1,62 @@
+import { t } from '@/i18n'
+import type { WorkspaceSettings } from '@/composables/useSettings'
+import { localDayTime } from '@/lib/activityTime'
+
+export const FOREVER_DAYS = 0
+export const SAVED_VISIBLE_MS = 2000
+
+const RANKED_PERIODS = [30, 90, 365, FOREVER_DAYS]
+
+export function retentionOptions() {
+	return RANKED_PERIODS.map((value) => ({ value, label: periodLabel(value) }))
+}
+
+export function periodLabel(days: number) {
+	switch (days) {
+		case 30:
+			return t('30 days')
+		case 90:
+			return t('90 days')
+		case 365:
+			return t('365 days')
+		default:
+			return t('Forever')
+	}
+}
+
+export function periodRank(days: number) {
+	return RANKED_PERIODS.indexOf(days)
+}
+
+export function isShorter(candidate: number, saved: number) {
+	return periodRank(candidate) < periodRank(saved)
+}
+
+export function helperCopy(days: number) {
+	return days === FOREVER_DAYS
+		? t('Nothing is removed automatically. The log grows over time.')
+		: t('Older events are removed automatically.')
+}
+
+export function lastCleanupLine(settings: WorkspaceSettings) {
+	if (!settings.activity_last_cleanup_at) {
+		return t('Never')
+	}
+	const removed = settings.activity_last_cleanup_removed
+	const count = t(removed === 1 ? '{0} event removed' : '{0} events removed', [removed])
+	return `${localDayTime(settings.activity_last_cleanup_at)} · ${count}`
+}
+
+export function nextCleanupLine(settings: WorkspaceSettings) {
+	return settings.activity_next_cleanup_at
+		? localDayTime(settings.activity_next_cleanup_at)
+		: t('Not scheduled')
+}
+
+export function shorteningDescription(settings: WorkspaceSettings) {
+	return settings.activity_next_cleanup_at
+		? t("This happens at the next cleanup on {0}. It can't be undone.", [
+				localDayTime(settings.activity_next_cleanup_at),
+			])
+		: t("Older events will be removed at the next cleanup. It can't be undone.")
+}

web/src/lib/activityTime.ts

@@ -64,6 +64,21 @@ export function whenLabel(iso: string, now: Date = new Date()) {
 	return t('{0} h ago', [Math.floor(elapsed / HOUR_MS)])
 }
 
+export function recentWhenLabel(iso: string, now: Date = new Date()) {
+	const date = new Date(iso)
+	const key = localDayKey(date)
+	if (key === localDayKey(now)) return whenLabel(iso, now)
+	const today = startOfDay(now)
+	const yesterday = new Date(today.getFullYear(), today.getMonth(), today.getDate() - 1)
+	if (key === localDayKey(yesterday)) return `${t('Yesterday')}, ${clock(date, false, false)}`
+	return localDayTime(iso)
+}
+
+export function localDayTime(iso: string) {
+	const date = new Date(iso)
+	return `${formatAbsoluteDay(date)}, ${clock(date, false, false)}`
+}
+
 export function fullLocalTime(iso: string) {
 	const date = new Date(iso)
 	return `${formatAbsoluteDay(date)}, ${clock(date, true, false)}`