'use client';

import { useCallback, useState } from 'react';
import { Button, Checkbox, Form, Input, InputNumber, Space, Typography } from 'antd';
import { message } from '@/lib/feedback/message';
import ContentCard from '@/components/layouts/ContentCard';
import { resolvePrecificacaoDrivers } from '../precificacaoDrivers';

const { Text } = Typography;

export type PrecificacaoDriversTipologicosCardProps = {
    categoriaCodigo?: string | null;
    /** Valores iniciais (API futura). */
    initialValues?: Record<string, string | number | boolean | null>;
    onChange?: (values: Record<string, string | number | boolean | null>) => void;
};

/**
 * Drivers tipológicos na precificação (T6) — estado local até a API persistir.
 */
export function PrecificacaoDriversTipologicosCard({
    categoriaCodigo,
    initialValues,
    onChange,
}: PrecificacaoDriversTipologicosCardProps) {
    const drivers = resolvePrecificacaoDrivers(categoriaCodigo);
    const [values, setValues] = useState<Record<string, string | number | boolean | null>>(
        () => initialValues ?? {},
    );

    const update = useCallback(
        (key: string, value: string | number | boolean | null) => {
            setValues((prev) => {
                const next = { ...prev, [key]: value };
                onChange?.(next);
                return next;
            });
        },
        [onChange],
    );

    if (drivers.length === 0) {
        return null;
    }

    return (
        <ContentCard
            title="Drivers tipológicos"
            data-testid="crm-precificacao-drivers"
            style={{ marginBottom: 24 }}
        >
            <Text type="secondary" style={{ display: 'block', marginBottom: 12, fontSize: 13 }}>
                Parâmetros que influenciam esforço e preço para este tipo de projeto. Os valores
                entram no snapshot da proposta no envio.
            </Text>
            <Form layout="vertical">
                <Space direction="vertical" size="small" style={{ width: '100%' }}>
                    {drivers.map((field) => {
                        if (field.input === 'boolean') {
                            return (
                                <Checkbox
                                    key={field.key}
                                    checked={Boolean(values[field.key])}
                                    onChange={(e) => update(field.key, e.target.checked)}
                                    data-testid={`crm-precificacao-driver-${field.key}`}
                                >
                                    {field.label}
                                </Checkbox>
                            );
                        }
                        if (field.input === 'number') {
                            return (
                                <Form.Item key={field.key} label={field.label} style={{ marginBottom: 8 }}>
                                    <InputNumber
                                        style={{ width: '100%', maxWidth: 280 }}
                                        min={0}
                                        placeholder={field.placeholder}
                                        value={
                                            typeof values[field.key] === 'number'
                                                ? (values[field.key] as number)
                                                : undefined
                                        }
                                        onChange={(v) => update(field.key, v ?? null)}
                                        data-testid={`crm-precificacao-driver-${field.key}`}
                                    />
                                </Form.Item>
                            );
                        }
                        return (
                            <Form.Item key={field.key} label={field.label} style={{ marginBottom: 8 }}>
                                <Input
                                    style={{ maxWidth: 400 }}
                                    placeholder={field.placeholder}
                                    value={
                                        typeof values[field.key] === 'string'
                                            ? (values[field.key] as string)
                                            : ''
                                    }
                                    onChange={(e) => update(field.key, e.target.value)}
                                    data-testid={`crm-precificacao-driver-${field.key}`}
                                />
                            </Form.Item>
                        );
                    })}
                </Space>
            </Form>
            <Button
                type="link"
                size="small"
                style={{ paddingInline: 0, marginTop: 8 }}
                onClick={() => {
                    message.info(
                        'Drivers guardados nesta sessão. Persistência na API entra com a bridge de precificação.',
                    );
                }}
                data-testid="crm-precificacao-drivers-lembrar"
            >
                Lembrar nesta sessão
            </Button>
        </ContentCard>
    );
}