import { Head, useForm } from '@inertiajs/react'; import SettingsLayout from '@/layouts/settings/layout'; import AppLayout from '@/layouts/app-layout'; import HeadingSmall from '@/components/heading-small'; import { Button } from '@/components/ui/button'; import { Input } from '@/components/ui/input'; import { Label } from '@/components/ui/label'; import { Switch } from '@/components/ui/switch'; import InputError from '@/components/input-error'; import { type BreadcrumbItem } from '@/types'; const breadcrumbs: BreadcrumbItem[] = [ { title: 'KYC Settings', href: '/admin/kyc/settings', }, ]; interface SettingGroup { [key: string]: Array<{ key: string; value: any; type: string; description: string; }>; } interface Props { settings: SettingGroup; } export default function KycSettings({ settings }: Props) { const flatSettings: Record = {}; // Flatten settings for form Object.values(settings).forEach(group => { group.forEach(setting => { flatSettings[setting.key] = setting.value; }); }); const { data, setData, post, processing, errors } = useForm(flatSettings); const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); const settingsArray = Object.entries(data).map(([key, value]) => ({ key, value, })); post('/admin/kyc/settings', { data: { settings: settingsArray }, preserveScroll: true, }); }; const renderField = (setting: any) => { const { key, type, description } = setting; if (type === 'boolean') { return (
{description && (

{description}

)}
setData(key, checked)} />
); } return (
{description && (

{description}

)} setData(key, type === 'integer' ? parseInt(e.target.value) || null : e.target.value)} placeholder={data[key] === null ? 'Unlimited' : ''} className="w-full" />
); }; const formatLabel = (key: string) => { return key .replace(/^kyc_/, '') .replace(/_/g, ' ') .replace(/\b\w/g, l => l.toUpperCase()); }; return (
{/* KYC Feature Toggle - Prominent at top */} {settings.general && settings.general.find(s => s.key === 'kyc_enabled') && (

KYC Verification

Enable or disable KYC verification requirement for all users. When disabled, users won't see KYC prompts or banners.

setData('kyc_enabled', checked)} className="ml-4" />
)} {/* Other General Settings */} {settings.general && settings.general.filter(s => s.key !== 'kyc_enabled').map((setting) => (
{renderField(setting)}
))} {/* Document Settings */} {settings.documents && settings.documents.map((setting) => (
{renderField(setting)}
))} {/* Automation & Notifications */} {settings.automation && settings.automation.map((setting) => (
{renderField(setting)}
))} {settings.notifications && settings.notifications.map((setting) => (
{renderField(setting)}
))} {/* Save Button */}
); }