feat: Live cookie banner overlay in SDK — auto-open + FAB reopen button

- CookieBannerOverlay: opens automatically on first visit (localStorage check)
- CookieBannerFAB: shield icon button at right-[10rem] to reopen settings
- 3 consent modes: accept all, reject all (nur notwendige), custom settings
- 4 categories: Notwendig (locked on), Statistik, Marketing, Funktional
- Category toggles with descriptions in settings view
- Datenschutzerklaerung + Impressum links in banner
- Consent persisted to localStorage, custom event fired on change
- Comprehensive Playwright E2E tests (16 tests):
  - First visit auto-open, button visibility, category toggles
  - Accept all / reject all / custom settings persistence
  - FAB reopen behavior, disabled toggle for necessary category

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Benjamin Admin
2026-05-02 19:46:22 +02:00
parent a1f5d883cc
commit 9f1b7ff38b
3 changed files with 541 additions and 3 deletions
+8 -3
View File
@@ -7,6 +7,7 @@ import { SDKSidebar } from '@/components/sdk/Sidebar/SDKSidebar'
import { CommandBar } from '@/components/sdk/CommandBar'
import { SDKPipelineSidebar } from '@/components/sdk/SDKPipelineSidebar'
import { ComplianceAdvisorWidget } from '@/components/sdk/ComplianceAdvisorWidget'
import { CookieBannerOverlay, CookieBannerFAB } from '@/components/sdk/CookieBannerOverlay'
import { useSDK } from '@/lib/sdk'
// =============================================================================
@@ -208,10 +209,14 @@ function SDKInnerLayout({ children }: { children: React.ReactNode }) {
{isCommandBarOpen && <CommandBar onClose={() => setCommandBarOpen(false)} />}
{/* Pipeline Sidebar (FAB on mobile/tablet, fixed on desktop xl+) */}
{projectId && <SDKPipelineSidebar />}
<SDKPipelineSidebar />
{/* Compliance Advisor Widget */}
{projectId && <ComplianceAdvisorWidget currentStep={currentStep} />}
{/* Compliance Advisor Widget — immer sichtbar, auch ohne Projekt */}
<ComplianceAdvisorWidget currentStep={currentStep} />
{/* Cookie Banner — opens on first visit, reopenable via FAB */}
<CookieBannerOverlay />
<CookieBannerFAB />
</div>
)
}