@hed-hog/contact 0.0.274 → 0.0.276

package/README.md

@@ -1,31 +1,32 @@
+```markdown
 # @hed-hog/contact
 
 ## 1. Visão geral do módulo
 
-O módulo `@hed-hog/contact` é responsável pela gestão de informações relacionadas a contatos, documentos, pessoas e seus tipos, além de relações entre pessoas. Ele oferece funcionalidades para criação, leitura, atualização e exclusão (CRUD) de entidades como tipos de contato, tipos de documento, pessoas, e suas relações, com suporte a internacionalização (locales) e paginação.
+O módulo `@hed-hog/contact` gerencia informações relacionadas a contatos, documentos, pessoas e seus tipos, além das relações entre pessoas. Ele oferece funcionalidades completas de CRUD para tipos de contato, tipos de documento, pessoas e suas relações, com suporte a internacionalização (locales), paginação e controle de acesso baseado em roles.
 
 ## 2. Escopo e responsabilidades
 
 - Gerenciar tipos de contato (`contact_type`).
 - Gerenciar tipos de documento (`document_type`).
-- Gerenciar pessoas (`person`), incluindo seus contatos, documentos, endereços e metadados.
-- Gerenciar tipos de relação entre pessoas (`person_relation_type`).
-- Fornecer serviços para criação e atualização de pessoas, incluindo validações específicas de negócio.
-- Suportar autenticação e autorização baseada em roles para acesso aos endpoints.
+- Gerenciar pessoas (`person`), incluindo contatos, documentos, endereços e metadados.
+- Gerenciar tipos de relação entre pessoas (`person_relation_type`), que são fixos e imutáveis via API.
+- Validar regras específicas de negócio, como unicidade de contatos primários e restrições para registro de empresas.
+- Suportar autenticação e autorização baseada em roles (`admin`, `admin-contact`).
 - Suportar internacionalização para mensagens e dados localizados.
-- Integrar com serviços de paginação, banco de dados Prisma, e envio de emails.
+- Integrar com serviços de paginação, banco de dados Prisma e envio de emails.
 
 ## 3. Endpoints
 
 ### Person Contact Type (`/person-contact-type`)
 
-| Método | Path               | Autenticação | Descrição                          |
-|--------|--------------------|--------------|----------------------------------|
-| GET    | `/person-contact-type`       | Autenticado (roles: admin, admin-contact) | Lista tipos de contato com paginação e locale. |
-| GET    | `/person-contact-type/:id`   | Autenticado (roles: admin, admin-contact) | Obtém tipo de contato por ID com locale. |
-| POST   | `/person-contact-type`       | Autenticado (roles: admin, admin-contact) | Cria um novo tipo de contato. |
-| PATCH  | `/person-contact-type/:id`   | Autenticado (roles: admin, admin-contact) | Atualiza um tipo de contato existente. |
-| DELETE | `/person-contact-type`       | Autenticado (roles: admin, admin-contact) | Exclui tipos de contato por IDs. |
+| Método | Path                   | Autenticação                          | Descrição                          |
+|--------|------------------------|-------------------------------------|----------------------------------|
+| GET    | `/person-contact-type` | Autenticado (roles: admin, admin-contact) | Lista tipos de contato com paginação e locale. |
+| GET    | `/person-contact-type/:id` | Autenticado (roles: admin, admin-contact) | Obtém tipo de contato por ID com locale. |
+| POST   | `/person-contact-type` | Autenticado (roles: admin, admin-contact) | Cria um novo tipo de contato. |
+| PATCH  | `/person-contact-type/:id` | Autenticado (roles: admin, admin-contact) | Atualiza um tipo de contato existente. |
+| DELETE | `/person-contact-type` | Autenticado (roles: admin, admin-contact) | Exclui tipos de contato por IDs. |
 
 **Parâmetros e corpo:**
 
@@ -33,24 +34,26 @@ O módulo `@hed-hog/contact` é responsável pela gestão de informações relac
   - `code` (string): código do tipo de contato.
   - `locale` (objeto): nomes localizados, ex: `{ "pt": { "name": "Telefone" }, "en": { "name": "Phone" } }`.
 
-- `UpdateDTO` para atualização: campos parciais de `CreateDTO`.
+- `UpdateDTO` para atualização: campos parciais de `CreateDTO`, `locale` opcional.
 
-**Respostas:**
+**Resposta:**
 
 - Listagem paginada ou objeto do tipo criado/atualizado.
-- Erros: 400 para dados inválidos, 404 para não encontrado.
+- Erros:
+  - 400 Bad Request: dados inválidos, `locale` vazio, IDs para exclusão não informados.
+  - 404 Not Found: tipo de contato não encontrado.
 
 ---
 
 ### Person Document Type (`/person-document-type`)
 
-| Método | Path               | Autenticação | Descrição                          |
-|--------|--------------------|--------------|----------------------------------|
-| GET    | `/person-document-type`       | Autenticado (roles: admin, admin-contact) | Lista tipos de documento com paginação e locale. |
-| GET    | `/person-document-type/:id`   | Autenticado (roles: admin, admin-contact) | Obtém tipo de documento por ID com locale. |
-| POST   | `/person-document-type`       | Autenticado (roles: admin, admin-contact) | Cria um novo tipo de documento. |
-| PATCH  | `/person-document-type/:id`   | Autenticado (roles: admin, admin-contact) | Atualiza um tipo de documento existente. |
-| DELETE | `/person-document-type`       | Autenticado (roles: admin, admin-contact) | Exclui tipos de documento por IDs. |
+| Método | Path                   | Autenticação                          | Descrição                          |
+|--------|------------------------|-------------------------------------|----------------------------------|
+| GET    | `/person-document-type` | Autenticado (roles: admin, admin-contact) | Lista tipos de documento com paginação e locale. |
+| GET    | `/person-document-type/:id` | Autenticado (roles: admin, admin-contact) | Obtém tipo de documento por ID com locale. |
+| POST   | `/person-document-type` | Autenticado (roles: admin, admin-contact) | Cria um novo tipo de documento. |
+| PATCH  | `/person-document-type/:id` | Autenticado (roles: admin, admin-contact) | Atualiza um tipo de documento existente. |
+| DELETE | `/person-document-type` | Autenticado (roles: admin, admin-contact) | Exclui tipos de documento por IDs. |
 
 **Parâmetros e corpo:**
 
@@ -60,26 +63,29 @@ O módulo `@hed-hog/contact` é responsável pela gestão de informações relac
   - `is_unique` (boolean): indica se o documento é único.
   - `locale` (objeto): nomes localizados.
 
-- `UpdateDTO` para atualização: campos parciais de `CreateDTO`.
+- `UpdateDTO` para atualização: campos parciais de `CreateDTO`, `locale` opcional.
 
-**Respostas:**
+**Resposta:**
 
 - Listagem paginada ou objeto do tipo criado/atualizado.
-- Erros: 400 para dados inválidos, 404 para não encontrado.
+- Erros:
+  - 400 Bad Request: dados inválidos, `locale` vazio, IDs para exclusão não informados.
+  - 404 Not Found: tipo de documento não encontrado.
 
 ---
 
 ### Person (`/person`)
 
-| Método | Path               | Autenticação | Descrição                          |
-|--------|--------------------|--------------|----------------------------------|
-| GET    | `/person`          | Autenticado (roles: admin, admin-contact) | Lista pessoas com filtros e paginação. |
-| GET    | `/person/stats`    | Autenticado (roles: admin, admin-contact) | Estatísticas de pessoas. |
-| GET    | `/person/:id`      | Autenticado (roles: admin, admin-contact) | Obtém pessoa por ID com detalhes. |
-| GET    | `/person/avatar/:id` | Pública     | Abre avatar público pelo ID do arquivo. |
-| POST   | `/person`          | Autenticado (roles: admin, admin-contact) | Cria uma nova pessoa. |
-| PATCH  | `/person/:id`      | Autenticado (roles: admin, admin-contact) | Atualiza pessoa existente. |
-| DELETE | `/person`          | Autenticado (roles: admin, admin-contact) | Exclui pessoas por IDs. |
+| Método | Path                   | Autenticação                          | Descrição                          |
+|--------|------------------------|-------------------------------------|----------------------------------|
+| GET    | `/person`              | Autenticado (roles: admin, admin-contact) | Lista pessoas com filtros e paginação. |
+| GET    | `/person/stats`        | Autenticado (roles: admin, admin-contact) | Estatísticas de pessoas. |
+| GET    | `/person/owner-options`| Autenticado (roles: admin, admin-contact) | Lista usuários possíveis para atribuição como responsáveis. |
+| GET    | `/person/:id`          | Autenticado (roles: admin, admin-contact) | Obtém pessoa por ID com detalhes. |
+| GET    | `/person/avatar/:id`   | Pública                             | Abre avatar público pelo ID do arquivo. |
+| POST   | `/person`              | Autenticado (roles: admin, admin-contact) | Cria uma nova pessoa. |
+| PATCH  | `/person/:id`          | Autenticado (roles: admin, admin-contact) | Atualiza pessoa existente. |
+| DELETE | `/person`              | Autenticado (roles: admin, admin-contact) | Exclui pessoas por IDs. |
 
 **Parâmetros e corpo:**
 
@@ -90,28 +96,31 @@ O módulo `@hed-hog/contact` é responsável pela gestão de informações relac
   - Campos opcionais: `avatar_id`, `birth_date`, `gender`, `job_title`, `trade_name`, `foundation_date`, `legal_nature`, `notes`, `employer_company_id`.
 
 - `UpdateAllPersonDTO` para atualização:
-  - Campos do `CreateDTO` e arrays para `contacts`, `addresses`, `documents`.
-  - Cada contato, endereço e documento possui seus próprios campos e validações.
+  - Inclui todos os campos do `CreateDTO`.
+  - Arrays para `contacts`, `addresses`, `documents` com seus respectivos campos e validações.
   - Validação para garantir apenas um contato, endereço ou documento primário por tipo.
+  - Campo opcional `branch_ids` para empresas.
 
-**Respostas:**
+**Resposta:**
 
 - Listagem paginada, objeto da pessoa criada/atualizada, ou estatísticas.
-- Erros: 400 para dados inválidos, 404 para não encontrado, validações específicas para registros de empresa.
+- Erros:
+  - 400 Bad Request: dados inválidos, mais de um primário por tipo, referência inválida, registro de empresa desabilitado, IDs para exclusão não informados.
+  - 404 Not Found: pessoa não encontrada, avatar não encontrado.
 
 ---
 
 ### Person Relation Type (`/person-relation-type`)
 
-| Método | Path               | Autenticação | Descrição                          |
-|--------|--------------------|--------------|----------------------------------|
-| GET    | `/person-relation-type`       | Autenticado (roles: admin, admin-contact) | Lista tipos fixos de relação entre pessoas. |
-| GET    | `/person-relation-type/:id`   | Autenticado (roles: admin, admin-contact) | Obtém tipo de relação por ID. |
-| POST   | `/person-relation-type`       | Autenticado (roles: admin, admin-contact) | **Não suportado** (tipos fixos). |
-| PATCH  | `/person-relation-type/:id`   | Autenticado (roles: admin, admin-contact) | **Não suportado** (tipos fixos). |
-| DELETE | `/person-relation-type`       | Autenticado (roles: admin, admin-contact) | **Não suportado** (tipos fixos). |
+| Método | Path                   | Autenticação                          | Descrição                          |
+|--------|------------------------|-------------------------------------|----------------------------------|
+| GET    | `/person-relation-type` | Autenticado (roles: admin, admin-contact) | Lista tipos fixos de relação entre pessoas. |
+| GET    | `/person-relation-type/:id` | Autenticado (roles: admin, admin-contact) | Obtém tipo de relação por ID. |
+| POST   | `/person-relation-type` | Autenticado (roles: admin, admin-contact) | **Não suportado** (tipos fixos). |
+| PATCH  | `/person-relation-type/:id` | Autenticado (roles: admin, admin-contact) | **Não suportado** (tipos fixos). |
+| DELETE | `/person-relation-type` | Autenticado (roles: admin, admin-contact) | **Não suportado** (tipos fixos). |
 
-**Observação:** Tipos de relação são fixos e não podem ser criados, atualizados ou deletados via API.
+**Observação:** Tipos de relação são fixos e não podem ser criados, atualizados ou deletados via API. Tentativas resultam em erro 400.
 
 ---
 
@@ -350,6 +359,9 @@ Inclui todos os campos do CreateDTO e:
 - Avatar público pode ser acessado via endpoint público, com cache control configurado.
 - Ao criar pessoa sem usuário, é enviado email com link para criação de conta, com token JWT válido por 1 dia.
 - Metadados como `notes` e `employer_company_id` são armazenados separadamente e sincronizados.
+- Empresas não podem ser vinculadas como sua própria matriz (headquarter).
+- Apenas empresas podem ser vinculadas como matriz ou filial.
+- Validações específicas impedem inconsistências nas relações de empresas e indivíduos.
 
 ## 9. Guia rápido de uso (exemplos)
 
@@ -468,3 +480,4 @@ Content-Type: application/json
 ---
 
 Este README documenta as funcionalidades principais do módulo `@hed-hog/contact` com base no código e definições atuais. Para detalhes adicionais, consulte o código fonte e as definições de DTOs.
+```

package/hedhog/data/menu.yaml

@@ -1,43 +1,163 @@
-- url: /contact/person
-  icon: users
-  name:
-    en: Contact
-    pt: Contatos
-  slug: /contact/person
-  relations:
-    role:
-      - where:
-          slug: admin
-      - where:
-          slug: admin-contact
-- menu_id:
-    where:
-      slug: /core/management
-  url: /contact/contact-type
-  icon: phone
-  name:
-    en: Contact Type
-    pt: Tipos de Contato
-  slug: /contact/contact-type
-  relations:
-    role:
-      - where:
-          slug: admin
-      - where:
-          slug: admin-contact
-- menu_id:
-    where:
-      slug: /core/management
-  url: /contact/document-type
-  icon: file-text
-  name:
-    en: Document Type
-    pt: Tipos de Documento
-  slug: /contact/document-type
-  relations:
-    role:
-      - where:
-          slug: admin
-      - where:
-          slug: admin-contact
-
+- icon: users
+  name:
+    en: CRM
+    pt: CRM
+  slug: /contact
+  order: 40
+  relations:
+    role:
+      - where:
+          slug: admin
+      - where:
+          slug: admin-contact
+
+- menu_id:
+    where:
+      slug: /contact
+  icon: layout-dashboard
+  url: /contact/dashboard
+  name:
+    en: Dashboard
+    pt: Dashboard
+  slug: /contact/dashboard
+  order: 41
+  relations:
+    role:
+      - where:
+          slug: admin
+      - where:
+          slug: admin-contact
+
+- menu_id:
+    where:
+      slug: /contact
+  icon: rows-3
+  url: /contact/pipeline
+  name:
+    en: Pipeline
+    pt: Pipeline
+  slug: /contact/pipeline
+  order: 42
+  relations:
+    role:
+      - where:
+          slug: admin
+      - where:
+          slug: admin-contact
+
+- menu_id:
+    where:
+      slug: /contact
+  icon: users
+  url: /contact/person
+  name:
+    en: Leads and Contacts
+    pt: Leads e Contatos
+  slug: /contact/person
+  order: 43
+  relations:
+    role:
+      - where:
+          slug: admin
+      - where:
+          slug: admin-contact
+
+- menu_id:
+    where:
+      slug: /contact
+  icon: activity
+  url: /contact/activities
+  name:
+    en: Activities
+    pt: Atividades
+  slug: /contact/activities
+  order: 44
+  relations:
+    role:
+      - where:
+          slug: admin
+      - where:
+          slug: admin-contact
+
+- menu_id:
+    where:
+      slug: /contact
+  icon: calendar-clock
+  url: /contact/follow-ups
+  name:
+    en: Follow-ups
+    pt: Follow-ups
+  slug: /contact/follow-ups
+  order: 45
+  relations:
+    role:
+      - where:
+          slug: admin
+      - where:
+          slug: admin-contact
+
+- menu_id:
+    where:
+      slug: /contact
+  icon: building-2
+  url: /contact/accounts
+  name:
+    en: Accounts
+    pt: Contas
+  slug: /contact/accounts
+  order: 46
+  relations:
+    role:
+      - where:
+          slug: admin
+      - where:
+          slug: admin-contact
+
+- menu_id:
+    where:
+      slug: /contact
+  icon: bar-chart-3
+  url: /contact/reports
+  name:
+    en: Reports
+    pt: Relatórios
+  slug: /contact/reports
+  order: 47
+  relations:
+    role:
+      - where:
+          slug: admin
+      - where:
+          slug: admin-contact
+
+- menu_id:
+    where:
+      slug: /core/management
+  url: /contact/contact-type
+  icon: phone
+  name:
+    en: Contact Type
+    pt: Tipos de Contato
+  slug: /contact/contact-type
+  relations:
+    role:
+      - where:
+          slug: admin
+      - where:
+          slug: admin-contact
+
+- menu_id:
+    where:
+      slug: /core/management
+  url: /contact/document-type
+  icon: file-text
+  name:
+    en: Document Type
+    pt: Tipos de Documento
+  slug: /contact/document-type
+  relations:
+    role:
+      - where:
+          slug: admin
+      - where:
+          slug: admin-contact

package/hedhog/data/setting_group.yaml

@@ -1,21 +1,21 @@
-- slug: person-registration
-  icon: users
-  name:
-    en: Person Registration
-    pt: Cadastro de Pessoas
-  description:
-    en: Configure which registration types are allowed in the system.
-    pt: Configure quais tipos de cadastro sao permitidos no sistema.
-  relations:
-    setting:
-      - slug: contact-allow-company-registration
-        type: boolean
-        component: switch
-        name:
-          en: Allow Company Registration
-          pt: Permitir Cadastro de Empresas
-        description:
-          en: Enable company records. Disable to allow only individual records.
-          pt: Habilita cadastros de empresas. Desative para permitir apenas pessoas fisicas.
-        value: true
-        user_override: false
+- slug: person-registration
+  icon: users
+  name:
+    en: Person Registration
+    pt: Cadastro de Pessoas
+  description:
+    en: Configure which registration types are allowed in the system.
+    pt: Configure quais tipos de cadastro sao permitidos no sistema.
+  relations:
+    setting:
+      - slug: contact-allow-company-registration
+        type: boolean
+        component: switch
+        name:
+          en: Allow Company Registration
+          pt: Permitir Cadastro de Empresas
+        description:
+          en: Enable company records. Disable to allow only individual records.
+          pt: Habilita cadastros de empresas. Desative para permitir apenas pessoas fisicas.
+        value: true
+        user_override: false

package/hedhog/frontend/app/_components/crm-coming-soon.tsx.ejs

@@ -0,0 +1,110 @@
+'use client';
+
+import { CrmNav } from './crm-nav';
+import { Page, PageHeader } from '@/components/entity-list';
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from '@/components/ui/card';
+import type { LucideIcon } from 'lucide-react';
+import { ArrowRight, Sparkles } from 'lucide-react';
+import Link from 'next/link';
+import { useTranslations } from 'next-intl';
+
+type CrmComingSoonProps = {
+  currentHref: string;
+  titleKey: string;
+  descriptionKey: string;
+  icon: LucideIcon;
+};
+
+export function CrmComingSoon({
+  currentHref,
+  titleKey,
+  descriptionKey,
+  icon: Icon,
+}: CrmComingSoonProps) {
+  const t = useTranslations('contact.CrmMenu');
+  const common = useTranslations('contact.CrmFuturePage');
+
+  return (
+    <Page>
+      <PageHeader
+        breadcrumbs={[
+          { label: common('breadcrumbs.home'), href: '/' },
+          { label: common('breadcrumbs.crm'), href: '/contact/dashboard' },
+          { label: t(`sections.${titleKey}.title`) },
+        ]}
+        title={t(`sections.${titleKey}.title`)}
+        description={t(`sections.${descriptionKey}.description`)}
+      />
+
+      <div className="min-w-0 space-y-6 overflow-x-hidden">
+        <CrmNav currentHref={currentHref} />
+
+        <Card className="overflow-hidden border-orange-200/70 bg-gradient-to-br from-orange-50 via-background to-amber-50 py-0">
+          <CardContent className="grid gap-6 px-6 py-8 lg:grid-cols-[minmax(0,1.2fr)_minmax(260px,0.8fr)]">
+            <div className="min-w-0 space-y-4">
+              <Badge className="w-fit rounded-full bg-orange-500/10 px-3 py-1 text-orange-700 hover:bg-orange-500/10">
+                <Sparkles className="mr-2 size-3.5" />
+                {common('badge')}
+              </Badge>
+              <div className="space-y-3">
+                <div className="flex items-center gap-3">
+                  <div className="rounded-2xl bg-orange-500/10 p-3 text-orange-700">
+                    <Icon className="size-5" />
+                  </div>
+                  <h2 className="text-3xl font-semibold tracking-tight">
+                    {t(`sections.${titleKey}.title`)}
+                  </h2>
+                </div>
+                <p className="max-w-2xl text-sm leading-6 text-muted-foreground">
+                  {common('description')}
+                </p>
+              </div>
+              <div className="flex flex-wrap gap-3">
+                <Button asChild>
+                  <Link href="/contact/dashboard">
+                    {common('backToDashboard')}
+                  </Link>
+                </Button>
+                <Button asChild variant="outline">
+                  <Link href="/contact/pipeline">{common('seePipeline')}</Link>
+                </Button>
+              </div>
+            </div>
+
+            <Card className="border-white/70 bg-white/80 shadow-sm">
+              <CardHeader>
+                <CardTitle>{common('nextStepTitle')}</CardTitle>
+                <CardDescription>
+                  {common('nextStepDescription')}
+                </CardDescription>
+              </CardHeader>
+              <CardContent className="space-y-3">
+                {['stepOne', 'stepTwo', 'stepThree'].map((step) => (
+                  <div
+                    key={step}
+                    className="flex items-start gap-3 rounded-2xl border border-border/70 bg-background px-4 py-3"
+                  >
+                    <div className="mt-0.5 rounded-full bg-orange-500/10 p-1.5 text-orange-700">
+                      <ArrowRight className="size-3.5" />
+                    </div>
+                    <p className="text-sm text-muted-foreground">
+                      {common(step)}
+                    </p>
+                  </div>
+                ))}
+              </CardContent>
+            </Card>
+          </CardContent>
+        </Card>
+      </div>
+    </Page>
+  );
+}

package/hedhog/frontend/app/_components/crm-nav.tsx.ejs

@@ -0,0 +1,73 @@
+'use client';
+
+import { Badge } from '@/components/ui/badge';
+import { cn } from '@/lib/utils';
+import Link from 'next/link';
+import { useTranslations } from 'next-intl';
+import { crmSections } from '../_lib/crm-sections';
+
+type CrmNavProps = {
+  currentHref: string;
+};
+
+export function CrmNav({ currentHref }: CrmNavProps) {
+  const t = useTranslations('contact.CrmMenu');
+
+  return (
+    <div className="min-w-0">
+      <div className="flex gap-2 overflow-x-auto pb-2 md:pb-1 lg:grid lg:grid-cols-2 lg:overflow-visible xl:grid-cols-3 2xl:grid-cols-4">
+        {crmSections.map((section) => {
+          const active = currentHref === section.href;
+          const Icon = section.icon;
+
+          return (
+            <Link
+              key={section.href}
+              href={section.href}
+              className={cn(
+                'group flex w-[280px] max-w-[85vw] shrink-0 snap-start items-start gap-3 rounded-2xl border px-4 py-3 transition-all lg:min-w-0 lg:max-w-none lg:w-full',
+                active
+                  ? 'border-orange-300 bg-orange-50 text-orange-950 shadow-sm'
+                  : 'border-border/70 bg-card hover:-translate-y-0.5 hover:border-orange-200 hover:bg-orange-50/40'
+              )}
+            >
+              <div
+                className={cn(
+                  'mt-0.5 rounded-xl p-2 transition-colors',
+                  active
+                    ? 'bg-orange-500 text-white'
+                    : 'bg-muted text-muted-foreground group-hover:bg-orange-100 group-hover:text-orange-700'
+                )}
+              >
+                <Icon className="size-4" />
+              </div>
+              <div className="min-w-0 space-y-1">
+                <div className="flex min-w-0 items-center gap-2">
+                  <span className="truncate text-sm font-semibold">
+                    {t(`sections.${section.translationKey}.title`)}
+                  </span>
+                  {active ? (
+                    <Badge className="rounded-full bg-orange-500 px-2 py-0 text-[10px] text-white hover:bg-orange-500">
+                      {t('current')}
+                    </Badge>
+                  ) : null}
+                  {!section.implemented ? (
+                    <Badge
+                      variant="outline"
+                      className="rounded-full px-2 py-0 text-[10px]"
+                    >
+                      {t('planned')}
+                    </Badge>
+                  ) : null}
+                </div>
+                <p className="line-clamp-2 text-xs text-muted-foreground">
+                  {t(`sections.${section.translationKey}.description`)}
+                </p>
+              </div>
+            </Link>
+          );
+        })}
+      </div>
+    </div>
+  );
+}