# Implementation Plan: Blacklist Feature

## Overview

Implementierung der Blacklist-Funktion für die Amazon Product Bar Extension. Die Funktion ermöglicht das Verwalten von Markennamen und zeigt bei geblacklisteten Produkten ein Marken-Logo in der Product_Bar an.

## Tasks

- [-] 1. Blacklist Storage Manager erstellen
  - [x] 1.1 Erstelle `src/BlacklistStorageManager.js` mit CRUD-Operationen
    - Implementiere `addBrand()`, `getBrands()`, `deleteBrand()`, `isBrandBlacklisted()`
    - Case-insensitive Duplikat-Check
    - Whitespace-Trimming vor dem Speichern
    - Event-Emission bei Änderungen
    - _Requirements: 2.2, 2.3, 2.5, 2.6, 4.1, 4.3_
  - [ ]* 1.2 Property Test: Brand Saving Round-Trip
    - **Property 1: Brand Saving Round-Trip**
    - **Validates: Requirements 2.2, 2.3**
  - [ ]* 1.3 Property Test: Case-Insensitive Comparison
    - **Property 2: Case-Insensitive Comparison**
    - **Validates: Requirements 4.1, 4.2**
  - [ ]* 1.4 Property Test: Duplicate Prevention
    - **Property 3: Duplicate Prevention**
    - **Validates: Requirements 2.5, 4.3**
  - [ ]* 1.5 Property Test: Whitespace Trimming
    - **Property 4: Whitespace Trimming**
    - **Validates: Requirements 2.6**
  - [ ]* 1.6 Property Test: Original Case Preservation
    - **Property 5: Original Case Preservation**
    - **Validates: Requirements 4.4**

- [x] 2. Brand Logo Registry erstellen
  - [x] 2.1 Erstelle `src/BrandLogoRegistry.js` mit vordefinierten Logos
    - SVG-Logos für Nike, Adidas, Puma, Apple, Samsung
    - Default "blocked" Icon
    - `getLogo()` und `hasLogo()` Methoden
    - _Requirements: 7.1, 7.2, 7.3, 7.4, 7.5_
  - [ ]* 2.2 Property Test: Logo Selection Consistency
    - **Property 7: Logo Selection Consistency**
    - **Validates: Requirements 3.2, 6.3, 7.3, 7.4**

- [x] 3. Brand Extractor erstellen
  - [x] 3.1 Erstelle `src/BrandExtractor.js` für Markenextraktion
    - Extraktion aus "by [Brand]" Text
    - Extraktion aus Brand-Links
    - Fallback: Erstes Wort aus Produkttitel
    - _Requirements: 5.1, 5.2, 5.3, 5.4_
  - [ ]* 3.2 Property Test: Brand Extraction Determinism
    - **Property 10: Brand Extraction Determinism**
    - **Validates: Requirements 5.1, 5.2, 5.3**

- [x] 4. Checkpoint - Basis-Komponenten testen
  - Sicherstellen, dass alle Tests bestehen
  - Bei Fragen den Nutzer konsultieren

- [-] 5. Brand Icon Manager erstellen
  - [x] 5.1 Erstelle `src/BrandIconManager.js` für Icon-Verwaltung
    - `updateAllBars()` für initiales Laden
    - `addBrandIcon()` und `removeBrandIcon()` für einzelne Bars
    - `addIconForBrand()` und `removeIconForBrand()` für Marken-Updates
    - Integration mit BlacklistStorageManager, BrandExtractor, BrandLogoRegistry
    - _Requirements: 6.1, 6.2, 6.3, 6.4, 6.5_
  - [ ]* 5.2 Property Test: Blacklist Icon Display
    - **Property 12: Blacklist Icon Display**
    - **Validates: Requirements 6.1**
  - [ ]* 5.3 Property Test: No Marking Without Brand
    - **Property 11: No Marking Without Brand**
    - **Validates: Requirements 5.4**

- [-] 6. Blacklist Panel Manager erstellen
  - [x] 6.1 Erstelle `src/BlacklistPanelManager.js` für UI-Verwaltung
    - `createBlacklistContent()` für Panel-Erstellung
    - Input-Feld und Add-Button
    - Brand-Liste mit Logos und Delete-Buttons
    - Feedback-Messages (success/error)
    - _Requirements: 2.1, 2.4, 3.1, 3.2, 3.3, 3.4_
  - [ ]* 6.2 Property Test: Brand List Rendering Completeness
    - **Property 6: Brand List Rendering Completeness**
    - **Validates: Requirements 3.1**
  - [ ]* 6.3 Property Test: Delete Button Presence
    - **Property 8: Delete Button Presence**
    - **Validates: Requirements 3.3**
  - [ ]* 6.4 Property Test: Deletion Completeness
    - **Property 9: Deletion Completeness**
    - **Validates: Requirements 3.4**

- [x] 7. CSS-Styles für Blacklist hinzufügen
  - [x] 7.1 Erweitere `src/StaggeredMenu.css` mit Blacklist-Styles
    - Blacklist Panel Styles (Header, Form, List)
    - Brand Item Styles (Logo, Name, Delete-Button)
    - Message Styles (success/error)
    - Brand Icon Styles für Product_Bar
    - _Requirements: 6.2, 7.5_

- [x] 8. StaggeredMenu Integration
  - [x] 8.1 Erweitere `src/StaggeredMenu.jsx` um Blacklist-Menüpunkt
    - Blacklist-Item nach Items-Item hinzufügen
    - BlacklistPanelManager importieren und initialisieren
    - Content-Panel für Blacklist rendern
    - _Requirements: 1.1, 1.2, 1.3_

- [x] 9. Content Script Integration
  - [x] 9.1 Erweitere `src/content.jsx` für Blacklist-Funktionalität
    - BrandIconManager initialisieren
    - Event-Listener für blacklist:updated
    - Icons bei Seitenlade aktualisieren
    - Real-time Updates bei Blacklist-Änderungen
    - _Requirements: 6.4, 6.5_
  - [ ]* 9.2 Property Test: Real-Time Icon Updates
    - **Property 13: Real-Time Icon Updates**
    - **Validates: Requirements 6.4, 6.5**

- [x] 10. Final Checkpoint
  - Sicherstellen, dass alle Tests bestehen
  - End-to-End Test: Marke hinzufügen → Icon erscheint → Marke löschen → Icon verschwindet
  - Bei Fragen den Nutzer konsultieren

## Notes

- Tasks mit `*` markiert sind optional und können für ein schnelleres MVP übersprungen werden
- Jeder Task referenziert spezifische Requirements für Nachverfolgbarkeit
- Checkpoints stellen inkrementelle Validierung sicher
- Property Tests validieren universelle Korrektheitseigenschaften
- Unit Tests validieren spezifische Beispiele und Edge Cases