0449b1d0ea
The page had no visual signal that it configures a third-party channel, so it read like any other Accounted setting. Adds an inline-SVG WhatsApp mark next to the section title and on the button that opens WhatsApp (replacing the generic lucide chat bubble, which was standing in for a logo it is not). Inline SVG rather than a bundled asset: no network request, scales, and survives the CSP. SettingsSectionHeader gains an optional `mark` slot; every other settings tab is untouched and stays mark-less on purpose, so the rail does not turn into a sticker album. The green is the one place brand colour appears in settings, which matches the design rule that colour belongs to actors rather than chrome. Co-authored-by: Jakob Wennberg <311770904+jakobwennberg-oss@users.noreply.github.com> Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
23 lines
653 B
TypeScript
23 lines
653 B
TypeScript
'use client'
|
|
|
|
import { useTranslations } from 'next-intl'
|
|
import { WhatsAppLinkPanel } from '@/components/extensions/general/WhatsAppLinkPanel'
|
|
import { WhatsAppMark } from '@/components/extensions/general/WhatsAppMark'
|
|
import { SettingsSectionHeader } from '@/components/settings/SettingsRows'
|
|
|
|
export function WhatsAppSettingsContent() {
|
|
const tNav = useTranslations('settings_nav')
|
|
const tIntro = useTranslations('settings_intro')
|
|
|
|
return (
|
|
<div>
|
|
<SettingsSectionHeader
|
|
title={tNav('whatsapp')}
|
|
intro={tIntro('whatsapp')}
|
|
mark={<WhatsAppMark size={26} />}
|
|
/>
|
|
<WhatsAppLinkPanel />
|
|
</div>
|
|
)
|
|
}
|