Files
portifolio-evandrodevbr/app/cases/_components/CaseRelatedServices.tsx
T
Evandro Fonseca Junior e80f73d075 feat(cases): mídia no topo, títulos de busca curtos e CreativeWork
Case com mídia ao lado do título e play acessível; problema de cada cliente reescrito com base nos dados; serviços relacionados em 2 cards; FAQ antes do próximo passo e bloco 'Onde já apliquei isso'; Apolo citada em IoT e arquitetura. metaTitle até 43 caracteres e descrições até 155 com teste; JSON-LD CreativeWork; imagens de compartilhamento abaixo de 100 KB; 404 e robots corrigidos; server-only nos módulos com node:.
2026-10-14 14:15:25 -03:00

35 lines
1.3 KiB
TypeScript

import Link from "next/link";
import { textLinkDark } from "@/app/components/button-styles";
import { getRelatedServices } from "@/lib/site-content";
/** Quantos serviços aparecem no fim do case: dois cards bastam para levar a pessoa ao serviço certo sem virar um menu. */
export const MAX_RELATED_SERVICES = 2;
/** Cards dos serviços que citam este case (no máximo dois), sobre fundo escuro. Sem serviço relacionado, não mostra nada. */
export function CaseRelatedServices({ caseId }: { caseId: string }) {
const services = getRelatedServices(caseId).slice(0, MAX_RELATED_SERVICES);
if (services.length === 0) return null;
return (
<div className="mt-sp-10">
<p className="ds-kicker">Serviços ligados a este projeto</p>
<ul className="mt-sp-4 grid gap-sp-4 md:grid-cols-2">
{services.map((service) => (
<li key={service.slug} className="flex">
<article className="ds-card w-full">
<h3 className="ds-card-title !mt-0">{service.navLabel}</h3>
<p className="ds-copy">{service.intro}</p>
<Link
className={`${textLinkDark} mt-sp-4 self-start`}
href={`/servicos/${service.slug}`}
>
Ver o serviço: {service.navLabel}
</Link>
</article>
</li>
))}
</ul>
</div>
);
}