- Add .gitignore to exclude node_modules, dist, logs, and system files - Add comprehensive project documentation including README, deployment guide, and development setup - Add .kiro project specifications for amazon-product-bar-extension, appwrite-cloud-storage, appwrite-userid-repair, blacklist-feature, and enhanced-item-management - Add .kiro steering documents for product, structure, styling, and tech guidelines - Add VSCode settings configuration for consistent development environment - Add manifest.json and babel/vite configuration for extension build setup - Add complete source code implementation including AppWrite integration, storage managers, UI components, and services - Add comprehensive test suite with Jest configuration and 30+ test files covering all major modules - Add test HTML files for integration testing and validation - Add coverage reports and build validation scripts - Add AppWrite setup and repair documentation for database schema management - Add migration guides and responsive accessibility implementation documentation - Establish foundation for Amazon product bar extension with full feature set including blacklist management, enhanced item workflows, and real-time synchronization
125 lines
5.3 KiB
Markdown
125 lines
5.3 KiB
Markdown
# 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
|