From 11ca1133188a74a4401e52629b7694a4e2fc9c24 Mon Sep 17 00:00:00 2001 From: Benjamin Admin Date: Sun, 3 May 2026 07:47:45 +0200 Subject: [PATCH] cleanup: Remove duplicate cookie-banner route, redirect to /sdk/cookie-banner - Deleted 6 unused components from /sdk/einwilligungen/cookie-banner/_components/ - Replaced page.tsx with Next.js redirect() to /sdk/cookie-banner - Updated EinwilligungenNavTabs link to /sdk/cookie-banner - Updated catalog page link to /sdk/cookie-banner - Single source of truth: /sdk/cookie-banner (Step in "Rechtliche Texte") Co-Authored-By: Claude Opus 4.6 (1M context) --- .../_components/EinwilligungenNavTabs.tsx | 2 +- .../app/sdk/einwilligungen/catalog/page.tsx | 2 +- .../_components/BannerPreview.tsx | 141 ---------------- .../_components/CategoryList.tsx | 95 ----------- .../_components/CookieBannerContent.tsx | 152 ------------------ .../_components/EmbedCodeViewer.tsx | 96 ----------- .../cookie-banner/_components/StylingForm.tsx | 118 -------------- .../cookie-banner/_components/TextsForm.tsx | 53 ------ .../sdk/einwilligungen/cookie-banner/page.tsx | 19 +-- 9 files changed, 5 insertions(+), 673 deletions(-) delete mode 100644 admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/BannerPreview.tsx delete mode 100644 admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/CategoryList.tsx delete mode 100644 admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/CookieBannerContent.tsx delete mode 100644 admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/EmbedCodeViewer.tsx delete mode 100644 admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/StylingForm.tsx delete mode 100644 admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/TextsForm.tsx diff --git a/admin-compliance/app/sdk/einwilligungen/_components/EinwilligungenNavTabs.tsx b/admin-compliance/app/sdk/einwilligungen/_components/EinwilligungenNavTabs.tsx index 02ffc47..7a9b645 100644 --- a/admin-compliance/app/sdk/einwilligungen/_components/EinwilligungenNavTabs.tsx +++ b/admin-compliance/app/sdk/einwilligungen/_components/EinwilligungenNavTabs.tsx @@ -35,7 +35,7 @@ const EINWILLIGUNGEN_TABS = [ { id: 'cookie-banner', label: 'Cookie-Banner', - href: '/sdk/einwilligungen/cookie-banner', + href: '/sdk/cookie-banner', icon: Cookie, description: 'Cookie-Consent konfigurieren', }, diff --git a/admin-compliance/app/sdk/einwilligungen/catalog/page.tsx b/admin-compliance/app/sdk/einwilligungen/catalog/page.tsx index a6f12fd..345f33f 100644 --- a/admin-compliance/app/sdk/einwilligungen/catalog/page.tsx +++ b/admin-compliance/app/sdk/einwilligungen/catalog/page.tsx @@ -130,7 +130,7 @@ function CatalogContent() {
diff --git a/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/BannerPreview.tsx b/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/BannerPreview.tsx deleted file mode 100644 index 7401d51..0000000 --- a/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/BannerPreview.tsx +++ /dev/null @@ -1,141 +0,0 @@ -'use client' - -import { useState } from 'react' -import { CookieBannerConfig, SupportedLanguage } from '@/lib/sdk/einwilligungen/types' - -interface BannerPreviewProps { - config: CookieBannerConfig | null - language: SupportedLanguage - device: 'desktop' | 'tablet' | 'mobile' -} - -export function BannerPreview({ config, language, device }: BannerPreviewProps) { - const [showDetails, setShowDetails] = useState(false) - - if (!config) { - return ( -
-

Konfiguration wird geladen...

-
- ) - } - - const isDark = config.styling.theme === 'DARK' - const bgColor = isDark ? '#1e293b' : config.styling.backgroundColor || '#ffffff' - const textColor = isDark ? '#f1f5f9' : config.styling.textColor || '#1e293b' - - const deviceWidths = { desktop: '100%', tablet: '768px', mobile: '375px' } - - return ( -
-
-
-
-
-
-
- -
-
-
-
-
-
-
-
- -
- -
-
-

{config.texts.title[language]}

-

{config.texts.description[language]}

- -
- - - -
- - {showDetails && ( -
- {config.categories.map((cat) => ( -
-
-
{cat.name[language]}
-
{cat.description[language]}
-
-
-
-
-
- ))} - -
- )} - - - {config.texts.privacyPolicyLink[language]} - -
-
-
-
- ) -} diff --git a/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/CategoryList.tsx b/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/CategoryList.tsx deleted file mode 100644 index e4c38dc..0000000 --- a/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/CategoryList.tsx +++ /dev/null @@ -1,95 +0,0 @@ -'use client' - -import { useState } from 'react' -import { ChevronDown, ChevronRight } from 'lucide-react' -import { CookieBannerConfig, SupportedLanguage } from '@/lib/sdk/einwilligungen/types' - -interface CategoryListProps { - config: CookieBannerConfig | null - language: SupportedLanguage -} - -export function CategoryList({ config, language }: CategoryListProps) { - const [expandedCategories, setExpandedCategories] = useState>(new Set()) - - if (!config) return null - - const toggleCategory = (id: string) => { - setExpandedCategories((prev) => { - const next = new Set(prev) - if (next.has(id)) { - next.delete(id) - } else { - next.add(id) - } - return next - }) - } - - return ( -
- {config.categories.map((cat) => { - const isExpanded = expandedCategories.has(cat.id) - return ( -
- - - {isExpanded && ( -
-

{cat.description[language]}

- {cat.cookies.length > 0 && ( -
-

Cookies

-
- {cat.cookies.map((cookie, idx) => ( -
-
- {cookie.name} - ({cookie.provider}) -
- {cookie.expiry} -
- ))} -
-
- )} -
- )} -
- ) - })} -
- ) -} diff --git a/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/CookieBannerContent.tsx b/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/CookieBannerContent.tsx deleted file mode 100644 index 0a7d7ba..0000000 --- a/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/CookieBannerContent.tsx +++ /dev/null @@ -1,152 +0,0 @@ -'use client' - -import { useState, useMemo } from 'react' -import { useSDK } from '@/lib/sdk' -import { useEinwilligungen } from '@/lib/sdk/einwilligungen/context' -import { - generateCookieBannerConfig, - DEFAULT_COOKIE_BANNER_TEXTS, - DEFAULT_COOKIE_BANNER_STYLING, -} from '@/lib/sdk/einwilligungen/generator/cookie-banner' -import { - CookieBannerStyling, - CookieBannerTexts, - SupportedLanguage, -} from '@/lib/sdk/einwilligungen/types' -import { Cookie, Settings, Palette, Code, Monitor, Smartphone, Tablet } from 'lucide-react' -import Link from 'next/link' -import { ArrowLeft } from 'lucide-react' -import { StylingForm } from './StylingForm' -import { TextsForm } from './TextsForm' -import { BannerPreview } from './BannerPreview' -import { EmbedCodeViewer } from './EmbedCodeViewer' -import { CategoryList } from './CategoryList' - -export function CookieBannerContent() { - const { state } = useSDK() - const { allDataPoints } = useEinwilligungen() - - const [styling, setStyling] = useState(DEFAULT_COOKIE_BANNER_STYLING) - const [texts, setTexts] = useState(DEFAULT_COOKIE_BANNER_TEXTS) - const [language, setLanguage] = useState('de') - const [activeTab, setActiveTab] = useState<'styling' | 'texts' | 'embed' | 'categories'>('styling') - const [device, setDevice] = useState<'desktop' | 'tablet' | 'mobile'>('desktop') - - const config = useMemo(() => { - return generateCookieBannerConfig(state.tenantId || 'demo', allDataPoints, texts, styling) - }, [state.tenantId, allDataPoints, texts, styling]) - - const cookieDataPoints = useMemo( - () => allDataPoints.filter((dp) => dp.cookieCategory !== null), - [allDataPoints] - ) - - return ( -
- - - Zurueck zum Katalog - - -
-
-

Cookie-Banner Konfiguration

-

Konfigurieren Sie Ihren DSGVO-konformen Cookie-Banner.

-
-
- -
-
- -
-
-
Kategorien
-
{config?.categories.length || 0}
-
-
-
Cookie-Datenpunkte
-
{cookieDataPoints.length}
-
-
-
Erforderlich
-
- {config?.categories.filter((c) => c.isRequired).length || 0} -
-
-
-
Optional
-
- {config?.categories.filter((c) => !c.isRequired).length || 0} -
-
-
- -
-
-
- {[ - { id: 'styling', label: 'Design', icon: Palette }, - { id: 'texts', label: 'Texte', icon: Settings }, - { id: 'categories', label: 'Kategorien', icon: Cookie }, - { id: 'embed', label: 'Embed-Code', icon: Code }, - ].map(({ id, label, icon: Icon }) => ( - - ))} -
- -
- {activeTab === 'styling' && } - {activeTab === 'texts' && } - {activeTab === 'categories' && } - {activeTab === 'embed' && } -
-
- -
-
-

Vorschau

-
- {[ - { id: 'desktop', icon: Monitor }, - { id: 'tablet', icon: Tablet }, - { id: 'mobile', icon: Smartphone }, - ].map(({ id, icon: Icon }) => ( - - ))} -
-
- -
-
-
- ) -} diff --git a/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/EmbedCodeViewer.tsx b/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/EmbedCodeViewer.tsx deleted file mode 100644 index 67c37ba..0000000 --- a/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/EmbedCodeViewer.tsx +++ /dev/null @@ -1,96 +0,0 @@ -'use client' - -import { useState, useMemo } from 'react' -import { Copy, Check } from 'lucide-react' -import { CookieBannerConfig } from '@/lib/sdk/einwilligungen/types' -import { generateEmbedCode } from '@/lib/sdk/einwilligungen/generator/cookie-banner' - -interface EmbedCodeViewerProps { - config: CookieBannerConfig | null -} - -export function EmbedCodeViewer({ config }: EmbedCodeViewerProps) { - const [activeTab, setActiveTab] = useState<'script' | 'html' | 'css' | 'js'>('script') - const [copied, setCopied] = useState(false) - - const embedCode = useMemo(() => { - if (!config) return null - return generateEmbedCode(config, '/datenschutz') - }, [config]) - - const copyToClipboard = async (text: string) => { - await navigator.clipboard.writeText(text) - setCopied(true) - setTimeout(() => setCopied(false), 2000) - } - - if (!embedCode) { - return ( -
-

Embed-Code wird generiert...

-
- ) - } - - const tabs = [ - { id: 'script', label: 'Script-Tag', content: embedCode.scriptTag }, - { id: 'html', label: 'HTML', content: embedCode.html }, - { id: 'css', label: 'CSS', content: embedCode.css }, - { id: 'js', label: 'JavaScript', content: embedCode.js }, - ] as const - - const currentContent = tabs.find((t) => t.id === activeTab)?.content || '' - - return ( -
-
- {tabs.map((tab) => ( - - ))} -
- -
- 
-          {currentContent}
-
- -
- - {activeTab === 'script' && ( -
-

- Integration: Fuegen Sie den Script-Tag in den{' '} - <head> oder vor dem - schliessenden{' '} - </body>-Tag ein. -

-
- )} -
- ) -} diff --git a/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/StylingForm.tsx b/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/StylingForm.tsx deleted file mode 100644 index d1dcb1c..0000000 --- a/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/StylingForm.tsx +++ /dev/null @@ -1,118 +0,0 @@ -'use client' - -import { CookieBannerStyling } from '@/lib/sdk/einwilligungen/types' - -interface StylingFormProps { - styling: CookieBannerStyling - onChange: (styling: CookieBannerStyling) => void -} - -export function StylingForm({ styling, onChange }: StylingFormProps) { - const handleChange = (field: keyof CookieBannerStyling, value: string | number) => { - onChange({ ...styling, [field]: value }) - } - - return ( -
-
- -
- {(['BOTTOM', 'TOP', 'CENTER'] as const).map((pos) => ( - - ))} -
-
- -
- -
- {(['LIGHT', 'DARK'] as const).map((theme) => ( - - ))} -
-
- -
-
- -
- handleChange('primaryColor', e.target.value)} - className="w-10 h-10 rounded border border-slate-200 cursor-pointer" - /> - handleChange('primaryColor', e.target.value)} - className="flex-1 px-3 py-2 border border-slate-300 rounded-lg text-sm" - /> -
-
-
- -
- handleChange('secondaryColor', e.target.value)} - className="w-10 h-10 rounded border border-slate-200 cursor-pointer" - /> - handleChange('secondaryColor', e.target.value)} - className="flex-1 px-3 py-2 border border-slate-300 rounded-lg text-sm" - /> -
-
-
- -
-
- - handleChange('borderRadius', parseInt(e.target.value))} - className="w-full px-3 py-2 border border-slate-300 rounded-lg text-sm" - /> -
-
- - handleChange('maxWidth', parseInt(e.target.value))} - className="w-full px-3 py-2 border border-slate-300 rounded-lg text-sm" - /> -
-
-
- ) -} diff --git a/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/TextsForm.tsx b/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/TextsForm.tsx deleted file mode 100644 index f05137b..0000000 --- a/admin-compliance/app/sdk/einwilligungen/cookie-banner/_components/TextsForm.tsx +++ /dev/null @@ -1,53 +0,0 @@ -'use client' - -import { CookieBannerTexts, SupportedLanguage } from '@/lib/sdk/einwilligungen/types' - -interface TextsFormProps { - texts: CookieBannerTexts - language: SupportedLanguage - onChange: (texts: CookieBannerTexts) => void -} - -export function TextsForm({ texts, language, onChange }: TextsFormProps) { - const handleChange = (field: keyof CookieBannerTexts, value: string) => { - onChange({ - ...texts, - [field]: { ...texts[field], [language]: value }, - }) - } - - const fields: { key: keyof CookieBannerTexts; label: string; multiline?: boolean }[] = [ - { key: 'title', label: 'Titel' }, - { key: 'description', label: 'Beschreibung', multiline: true }, - { key: 'acceptAll', label: 'Alle akzeptieren Button' }, - { key: 'rejectAll', label: 'Nur notwendige Button' }, - { key: 'customize', label: 'Einstellungen Button' }, - { key: 'save', label: 'Speichern Button' }, - { key: 'privacyPolicyLink', label: 'Datenschutz-Link Text' }, - ] - - return ( -
- {fields.map(({ key, label, multiline }) => ( -
- - {multiline ? ( -