'use client';

/**
 * Hub tipológico da vertical `software/**` — soft-split piloto (ADR-0111).
 * Orientação + atalhos; não substitui a home do projeto nem a lista ERP `/projetos`.
 *
 * @route /projetos/[id]/software
 */

import {
    Boxes,
    FileText,
    Puzzle,
    Shield,
} from 'lucide-react';
import Link from 'next/link';
import React from 'react';
import { useParams } from 'next/navigation';
import { Alert, Button, Col, Row, Space, Typography } from 'antd';
import { ICON_SIZE_MD } from '@/components/icons';
import ContentCard from '@/components/layouts/ContentCard';
import ProjetoLayout from '@/components/layouts/ProjetoLayout';
import { projetosProjetoCanonical } from '@/lib/routes/projetosProjetoCanonical';

const { Paragraph, Text, Title } = Typography;

type HubLink = {
    key: string;
    title: string;
    description: string;
    href: (projetoId: string) => string;
    cta: string;
    icon: React.ReactNode;
};

const HUB_LINKS: HubLink[] = [
    {
        key: 'escopo',
        title: 'Escopo',
        description: 'Premissas, restrições e termo de escopo do produto.',
        href: projetosProjetoCanonical.softwareEscopo,
        cta: 'Abrir escopo',
        icon: <FileText size={ICON_SIZE_MD} aria-hidden />,
    },
    {
        key: 'funcionalidades',
        title: 'Funcionalidades',
        description: 'Inventário tipológico do que o produto entrega.',
        href: (id) => `/projetos/${id}/software/funcionalidades`,
        cta: 'Abrir funcionalidades',
        icon: <Puzzle size={ICON_SIZE_MD} aria-hidden />,
    },
    {
        key: 'stack',
        title: 'Stack',
        description: 'Tecnologias e stack do catálogo vinculadas ao projeto.',
        href: projetosProjetoCanonical.softwareStack,
        cta: 'Abrir stack',
        icon: <Boxes size={ICON_SIZE_MD} aria-hidden />,
    },
    {
        key: 'seguranca',
        title: 'Segurança tipológica',
        description: 'Controles, inventário LGPD e postura de segurança.',
        href: (id) => `/projetos/${id}/software/seguranca`,
        cta: 'Abrir segurança',
        icon: <Shield size={ICON_SIZE_MD} aria-hidden />,
    },
];

/**
 * Entrada tipológica clara para deep link `/software` sem subcaminho.
 */
export function ProjetoSoftwareHubScreen() {
    const params = useParams();
    const projetoId = String(params?.id ?? '');

    return (
        <ProjetoLayout
            projetoId={projetoId}
            pageTitle="Área tipológica de software"
            titleSection="Área tipológica de software"
        >
            <div data-testid="software-soft-split-hub">
                <Title level={4} style={{ marginTop: 0, marginBottom: 8 }}>
                    Produto de software — área tipológica
                </Title>
                <Paragraph type="secondary" style={{ marginBottom: 12 }}>
                    Documentação e inventário técnico deste projeto (soft-split tipológico). A gestão
                    do projeto (visão geral, Gantt, Kanban e entregas) permanece no menu núcleo.
                </Paragraph>
                <Alert
                    type="info"
                    showIcon
                    style={{ marginBottom: 16 }}
                    message="Área tipológica (soft-split)"
                    description="Documentação técnica deste produto no mesmo Waygest e na mesma sessão. A gestão operacional (Gantt, Kanban, entregas) continua no menu núcleo."
                    action={
                        <Space wrap>
                            <Link href={`/projetos/${projetoId}`}>
                                <Button size="small">Voltar à visão geral</Button>
                            </Link>
                            <Link href={`/projetos/${projetoId}/gestao`}>
                                <Button size="small" type="default">
                                    Abrir gestão
                                </Button>
                            </Link>
                            <Link href={`/projetos/${projetoId}/kanban`}>
                                <Button size="small" type="default">
                                    Abrir Kanban
                                </Button>
                            </Link>
                        </Space>
                    }
                />
            </div>

            <Paragraph type="secondary" style={{ marginTop: 0, marginBottom: 16 }}>
                <Text strong>Próximo passo:</Text> escolha um domínio abaixo ou use o menu tipológico
                à esquerda.
            </Paragraph>

            <Row gutter={[16, 16]}>
                {HUB_LINKS.map((item) => (
                    <Col key={item.key} xs={24} sm={12} xl={6}>
                        <ContentCard
                            title={
                                <Space size="small">
                                    {item.icon}
                                    <span>{item.title}</span>
                                </Space>
                            }
                        >
                            <Paragraph type="secondary" style={{ minHeight: 48 }}>
                                {item.description}
                            </Paragraph>
                            <Link href={item.href(projetoId)}>
                                <Button type="primary" block data-testid={`software-hub-cta-${item.key}`}>
                                    {item.cta}
                                </Button>
                            </Link>
                        </ContentCard>
                    </Col>
                ))}
            </Row>
        </ProjetoLayout>
    );
}