feat(i18n): localize analytics dashboard and dynamic platform selector

- add translation keys for analytics stats and time units in AR/EN locales
- replace hardcoded time formats in AnalyticsLoader with dynamic i18n values
- implement dynamic translation mapping for the analytics platform dropdown
- update README project structure

Author: YazanAmmar

README.md

@@ -152,34 +152,28 @@ Configure your limits, tracking mode, block condition, block duration, theme, an
 
 ```text
 src/
-├── adapters/                 # Chrome-specific implementations (Composition Layer)
-│   └── chrome/
-│       ├── alarm-manager.ts
-│       ├── connection-manager.ts
-│       ├── message-bus.ts
-│       ├── storage-driver.ts
-│       └── tab-manager.ts
+├── adapters/                 # Environment-specific implementations (Composition Layer)
+│   ├── browser/              # Browser-agnostic web APIs (e.g., IndexedDB)
+│   └── chrome/               # Chrome-specific extension APIs
 ├── app/
 │   └── orchestrator.ts       # Wires core components, owns the content-side block flow
 ├── core/
+│   ├── analytics/            # Continuous tracking, aggregators, formatters, and reports
 │   ├── interfaces/           # Abstract contracts (Ports) - no platform dependencies
-│   │   ├── alarm-manager.ts
-│   │   ├── connection-manager.ts
-│   │   ├── message-bus.ts
-│   │   ├── platform-adapter.ts
-│   │   └── tab-manager.ts
 │   ├── storage/              # Persistence layer - settings, stats, sessions, security
+│   ├── subscription/         # Centralized policy engine (plans, capabilities, limits)
 │   ├── background-orchestrator.ts # Environment-agnostic background logic
 │   ├── limiter.ts            # Pure counting and limit enforcement logic
 │   ├── session.ts            # Heartbeat, activity tracking, and unload handling
 │   ├── tracker.ts            # Delegates URL observation to the active adapter
 │   └── messenger.ts          # Typed message bus wrapper
 ├── platforms/
-│   ├── youtube/index.ts      # YouTube Shorts + Watch adapter (with hot-swap support)
-│   └── generic/index.ts      # Fallback adapter
+│   ├── instagram/            # Instagram specific parsers and enforcers
+│   ├── youtube/              # YouTube specific parsers and enforcers
+│   └── generic/              # Fallback adapter
 ├── ui/
 │   ├── popup/                # Extension popup UI
-│   ├── settings/             # Command Center dashboard
+│   ├── settings/             # Command Center dashboard & analytics
 │   ├── overlay/              # Blocking screen (renderer, controller, persistence)
 │   └── components/           # Reusable UI components (tooltip, modal, custom-select)
 ├── i18n/                     # Internationalization (types, singleton, locale files)

src/i18n/locales/ar.ts

@@ -78,6 +78,12 @@ const ar: LocaleStrings = {
     condAnd: 'مرن (و)',
     descCondOr: 'تفعيل الحظر بمجرد انتهاء أي عداد (الوقت أو الفيديوهات).',
     descCondAnd: 'تفعيل الحظر فقط عند انتهاء كلا العدادين معاً.',
+    analyticsTitle: 'إحصائيات المنصة',
+    statToday: 'استخدام اليوم',
+    statSessions: 'جلسات اليوم',
+    statTrend: 'مقارنة بالأمس',
+    hoursShort: 'س',
+    minutesShort: 'د',
   },
   tones: {
     random: 'عشوائي',

src/i18n/locales/en.ts

@@ -80,6 +80,12 @@ const en: LocaleStrings = {
     condAnd: 'Flexible (AND)',
     descCondOr: 'Block as soon as ANY limit (Time or Videos) is reached.',
     descCondAnd: 'Block ONLY when BOTH limits (Time and Videos) are reached.',
+    analyticsTitle: 'Platform Analytics',
+    statToday: "Today's Usage",
+    statSessions: 'Sessions Today',
+    statTrend: 'Vs Yesterday',
+    hoursShort: 'h',
+    minutesShort: 'm',
   },
   tones: {
     random: 'Random',

src/i18n/types.ts

@@ -77,6 +77,12 @@ export interface LocaleStrings {
     condAnd: string;
     descCondOr: string;
     descCondAnd: string;
+    analyticsTitle: string;
+    statToday: string;
+    statSessions: string;
+    statTrend: string;
+    hoursShort: string;
+    minutesShort: string;
   };
   tones: {
     random: string;

src/ui/settings/analytics-loader.ts

@@ -1,5 +1,6 @@
 import { StorageFacade } from '../../core/storage/index';
 import { PlatformId } from '../../types';
+import { i18n } from '../../i18n/index';
 
 export class AnalyticsLoader {
   constructor(private storage: StorageFacade) {}
@@ -14,7 +15,10 @@ export class AnalyticsLoader {
       return;
     }
 
-    const translations = { hours: 'h', minutes: 'm' };
+    const translations = {
+      hours: i18n.t.dashboard.hoursShort,
+      minutes: i18n.t.dashboard.minutesShort,
+    };
 
     const report = await this.storage.analyticsService.getDashboardReport(platformId, translations);
 

src/ui/settings/index.ts

@@ -94,6 +94,12 @@ function updateUITexts() {
     'desc-dash-reset': t.dashboard.resetDesc,
     'btn-reset-settings': t.dashboard.resetBtn,
 
+    // Analytics
+    'group-analytics-title': t.dashboard.analyticsTitle,
+    'lbl-stat-today': t.dashboard.statToday,
+    'lbl-stat-sessions': t.dashboard.statSessions,
+    'lbl-stat-trend': t.dashboard.statTrend,
+
     // CTA
     'btn-sponsor-text': t.dashboard.btnSponsor,
 
@@ -107,6 +113,24 @@ function updateUITexts() {
     if (el) el.textContent = value;
   });
 
+  const platformMap: Record<string, string> = {
+    youtube_shorts: t.popup.youtubeShorts,
+    youtube_watch: t.popup.youtubeWatch,
+    instagram_reels: t.popup.instagramReels,
+    instagram_feed: t.popup.instagramFeed,
+  };
+
+  const platformSelect = document.getElementById(
+    'analytics-platform-selector',
+  ) as HTMLSelectElement;
+  if (platformSelect) {
+    Array.from(platformSelect.options).forEach((option) => {
+      if (platformMap[option.value]) {
+        option.textContent = platformMap[option.value];
+      }
+    });
+  }
+
   document.body.dir = i18n.language === 'ar' ? 'rtl' : 'ltr';
 }