Conteúdo real: bio, data do episódio 1 e formulário conectado

- Sobre: bio real do Samuelson Brito (fundador do Java Amazonas).
- Episódio 1 marcado como não publicado (estreia adiada para
  23/08/2026 por questão de saúde do convidado) — EpisodeCard agora
  distingue publicado vs. "estreia em breve" e nunca linka/embeda um
  vídeo que ainda não está no ar.
- Registra locale pt-BR (@angular/common/locales/pt) para o DatePipe
  funcionar no prerender; datas formatadas em UTC para não variar por
  fuso horário do visitante.
- Patrocinadores: access key do Web3Forms configurada, formulário
  pronto para receber contatos reais.

Author: samuelsonbrito

.claude/docs/plano-de-desenvolvimento.md

@@ -2,7 +2,9 @@
 
 ## Objetivo
 
-O Descompila volta ao ar em formato de podcast, com o episódio [#01 — "O Desafio dos Professores na Era da Inteligência Artificial"](https://www.youtube.com/watch?v=DunHrDCzHuA) (convidado: Jean Lobo) abrindo a nova fase. O site dá um lar a esse conteúdo fora do YouTube: reforça a marca, apresenta os episódios e, assim que existirem, dá visibilidade a patrocinadores e cursos.
+O Descompila volta ao ar em formato de podcast, com o episódio #01 — "O Desafio dos Professores na Era da Inteligência Artificial" (convidado: Jean Lobo) abrindo a nova fase. O site dá um lar a esse conteúdo fora do YouTube: reforça a marca, apresenta os episódios e, assim que existirem, dá visibilidade a patrocinadores e cursos.
+
+**Nota**: a estreia do episódio 1 foi adiada (problema de saúde do convidado) para **23/08/2026**. O site trata episódios não publicados como "estreia em breve" — sem embed nem link do YouTube — até a data de fato acontecer e o vídeo ficar público. Não usar mais o link `DunHrDCzHuA` como referência de vídeo já publicado em nenhuma comunicação até a estreia real ser confirmada.
 
 Identidade visual detalhada em [`identidade-visual.md`](identidade-visual.md).
 
@@ -25,7 +27,7 @@ Angular direto no GitHub Pages, sem backend — todo o conteúdo é estático ou
 
 - **Angular 22 (standalone, zoneless)**, com `outputMode: "static"` — cada rota é prerenderizada em build time para um `index.html` próprio (sem servidor Node em produção, sem Express). Isso também elimina a necessidade do truque clássico do `404.html`: como cada rota já existe como arquivo estático real, o GitHub Pages serve `/episodios/`, `/sobre/` etc. diretamente, sem redirecionamento client-side.
 - **Hospedagem**: página de organização do GitHub Pages, repositório `descompila.github.io` → servido na raiz (`https://descompila.github.io/`), `base-href` do Angular configurado como `/`. Dá pra apontar domínio próprio depois sem mudar a estrutura.
-- **Conteúdo dos episódios**: lista mantida manualmente como array JSON/TS no repositório (id do vídeo, título, data, convidado, patrocinadores do episódio). Simples de editar a cada episódio novo, sem chave de API exposta no cliente — reavaliar integração com a YouTube Data API quando houver mais episódios.
+- **Conteúdo dos episódios**: lista mantida manualmente em `src/app/core/data/episodios.ts` (número, título, convidado, data, `publicado: boolean`, id do vídeo — `youtubeId` fica `null` enquanto não publicado). O componente `EpisodeCard` usa `publicado` para decidir entre mostrar o player/link do YouTube ou um selo "estreia em breve" com a data prevista, sem nunca linkar um vídeo que ainda não está no ar. Simples de editar a cada episódio novo, sem chave de API exposta no cliente — reavaliar integração com a YouTube Data API quando houver mais episódios.
 - **GitHub Actions** (`.github/workflows/deploy.yml`) builda e publica `dist/descompila/browser` no GitHub Pages a cada push na `main`, via `actions/upload-pages-artifact` + `actions/deploy-pages`.
 
 ## SEO moderno
@@ -50,18 +52,18 @@ Fases pequenas e sequenciais — cada uma entrega algo que já poderia ir ao ar
 
 1. **Fase 0 — Fundação** ✅ concluída: repositório `descompila/descompila.github.io` criado, projeto Angular 22 (standalone, zoneless, `outputMode: static`) com ESLint + Prettier, estrutura de pastas (`pages/`, `shared/layout/`), rotas lazy para as 5 páginas com header/footer navegáveis, favicon/ícones gerados a partir do símbolo da logo, `base-href` `/`.
 2. **Fase 1 — Design system** ✅ concluída: tokens de cor/tipografia (CSS custom properties, com suporte a tema claro/escuro via `prefers-color-scheme`), IBM Plex Sans/Mono self-hosted via `@fontsource`, componentes `Button` e `Card` reutilizáveis, Header/Footer com as logos reais.
-3. **Fase 2 — Páginas principais** (~1–2 semanas): Home, Episódios (com o episódio 1 já publicado), Sobre e Patrocinadores (com formulário de captação já funcional — ver [`patrocinadores.md`](patrocinadores.md)), com conteúdo real desde o início.
+3. **Fase 2 — Páginas principais** ✅ concluída: Home (hero + próximo episódio), Episódios (grid alimentado por `episodios.ts`, trata publicado vs. "estreia em breve"), Sobre (propósito real + bio do apresentador) e Patrocinadores (formulário funcional via Web3Forms, ver [`patrocinadores.md`](patrocinadores.md)) com conteúdo real.
 4. **Fase 3 — SEO e performance** (~3–5 dias): meta tags por rota, JSON-LD, sitemap, checagem de Core Web Vitals.
 5. **Fase 4 — CI/CD e lançamento**: ✅ pipeline no ar (`.github/workflows/deploy.yml`, deploy automático a cada push na `main`); falta apenas testar em produção com conteúdo real (Fase 2) e divulgar no canal.
 6. **Fase 5 — Patrocinadores e cursos** (contínuo): páginas "em breve" evoluem para reais assim que houver patrocinador ou curso confirmado.
 
-**Status atual**: site no ar em <https://descompila.github.io/> com identidade visual aplicada (cores, tipografia, logos, header/footer, botões e cards). Conteúdo das páginas ainda é placeholder — próximo passo é a Fase 2 (páginas principais com conteúdo real).
+**Status atual**: site no ar em <https://descompila.github.io/> com identidade visual aplicada e conteúdo real em todas as páginas principais. Próximo passo é a Fase 3 (SEO técnico: meta tags por rota, JSON-LD, sitemap).
 
 ## Decisões já confirmadas
 
 - **Hospedagem**: página de organização do GitHub Pages, repositório `Descompila/descompila.github.io`, servida em `https://descompila.github.io/`, não domínio próprio por enquanto.
 - **Episódios**: lista mantida manualmente no código, sem integração com a API do YouTube por ora.
-- **Captação de patrocinadores**: formulário via Formspree/Web3Forms (sem backend), leads controlados numa planilha simples — ver [`patrocinadores.md`](patrocinadores.md).
+- **Captação de patrocinadores**: formulário via Web3Forms (sem backend), access key já configurada em `patrocinadores.ts`; leads controlados numa planilha simples — ver [`patrocinadores.md`](patrocinadores.md).
 - **Nome do repositório**: `descompila.github.io`, na organização `descompila` (github.com/descompila) — usado no `base-href` (`/`) e nas URLs. Site publicado em <https://descompila.github.io/>.
 
 ## Referência

src/app/app.config.ts

@@ -1,13 +1,18 @@
-import { ApplicationConfig, provideBrowserGlobalErrorListeners } from '@angular/core';
+import { ApplicationConfig, LOCALE_ID, provideBrowserGlobalErrorListeners } from '@angular/core';
 import { provideRouter } from '@angular/router';
+import { registerLocaleData } from '@angular/common';
+import localePt from '@angular/common/locales/pt';
 
 import { routes } from './app.routes';
 import { provideClientHydration } from '@angular/platform-browser';
 
+registerLocaleData(localePt, 'pt-BR');
+
 export const appConfig: ApplicationConfig = {
   providers: [
     provideBrowserGlobalErrorListeners(),
     provideRouter(routes),
     provideClientHydration(),
+    { provide: LOCALE_ID, useValue: 'pt-BR' },
   ],
 };

src/app/core/data/episodios.ts

@@ -2,9 +2,10 @@ export interface Episodio {
   numero: number;
   titulo: string;
   convidado: string;
-  /** Data de publicação (YYYY-MM-DD). null enquanto não confirmada. */
-  data: string | null;
-  youtubeId: string;
+  /** Data de publicação (se já publicado) ou de estreia prevista (YYYY-MM-DD). */
+  data: string;
+  publicado: boolean;
+  youtubeId: string | null;
   descricao: string;
 }
 
@@ -13,8 +14,9 @@ export const EPISODIOS: Episodio[] = [
     numero: 1,
     titulo: 'O Desafio dos Professores na Era da Inteligência Artificial',
     convidado: 'Jean Lobo',
-    data: null, // TODO: confirmar data exata de publicação
-    youtubeId: 'DunHrDCzHuA',
+    data: '2026-08-23',
+    publicado: false,
+    youtubeId: null,
     descricao:
       'Uma conversa sobre os desafios que professores enfrentam para ensinar tecnologia e se adaptar à era da inteligência artificial.',
   },

src/app/pages/home/home.html

@@ -12,6 +12,6 @@ <h1>Educação de tecnologia, simplificada para todos.</h1>
 </section>
 
 <section class="container">
-  <h2>Episódio mais recente</h2>
+  <h2>{{ ultimoEpisodio.publicado ? 'Episódio mais recente' : 'Próximo episódio' }}</h2>
   <app-episode-card class="episode" [episodio]="ultimoEpisodio" />
 </section>

src/app/pages/patrocinadores/patrocinadores.ts

@@ -2,8 +2,7 @@ import { Component, signal } from '@angular/core';
 import { Button } from '../../shared/ui/button/button';
 import { Card } from '../../shared/ui/card/card';
 
-// TODO: substituir pela access key gerada em https://web3forms.com (ver .claude/docs/patrocinadores.md)
-const WEB3FORMS_ACCESS_KEY = '';
+const WEB3FORMS_ACCESS_KEY = '26565cff-e293-40b4-8dd4-300180fca945';
 
 @Component({
   selector: 'app-patrocinadores',

src/app/pages/sobre/sobre.html

@@ -14,9 +14,20 @@ <h1>Sobre o Descompila</h1>
   </p>
 
   <h2>Quem apresenta</h2>
+  <p class="host-name">Samuelson Brito</p>
   <p>
-    <!-- TODO: bio do Samuelson Brito — aguardando texto -->
-    Samuelson Brito.
+    Desenvolvedor de software com foco em Java e backend, atuando desde 2014 na área de tecnologia.
+    Tem experiência com Java, Spring Boot, microsserviços, APIs e arquitetura de software, além de
+    interesse e atuação em Inteligência Artificial aplicada ao desenvolvimento.
+  </p>
+  <p>
+    Também é fundador do <strong>Java Amazonas</strong>, comunidade que busca fortalecer o
+    ecossistema Java na região, promovendo eventos, palestras, workshops e conexão entre
+    profissionais, estudantes e empresas.
+  </p>
+  <p>
+    Apaixonado por tecnologia, educação e comunidade, gosta de compartilhar conhecimento e
+    incentivar o crescimento da área de desenvolvimento de software na Amazônia.
   </p>
 
   <app-button variant="secondary" [href]="canalUrl">Canal no YouTube</app-button>

src/app/pages/sobre/sobre.scss

@@ -0,0 +1,10 @@
+.lede {
+  font-size: 1.1rem;
+  color: var(--color-ink-soft);
+}
+
+.host-name {
+  font-weight: 700;
+  font-size: 1.05rem;
+  margin-bottom: var(--space-2);
+}

src/app/shared/ui/episode-card/episode-card.html

@@ -1,14 +1,22 @@
 <app-card class="episode-card">
-  <span class="eyebrow">Episódio {{ episodio().numero.toString().padStart(2, '0') }}</span>
+  <span class="eyebrow">
+    @if (episodio().publicado) {
+      Episódio {{ episodio().numero.toString().padStart(2, '0') }}
+    } @else {
+      Episódio {{ episodio().numero.toString().padStart(2, '0') }} · Estreia em breve
+    }
+  </span>
   <h3>{{ episodio().titulo }}</h3>
   <p class="meta">
-    Com {{ episodio().convidado }}
-    @if (episodio().data) {
-      · {{ episodio().data | date: "d 'de' MMMM 'de' y" : undefined : 'pt-BR' }}
+    Com {{ episodio().convidado }} ·
+    @if (episodio().publicado) {
+      {{ episodio().data | date: "d 'de' MMMM 'de' y" : 'UTC' }}
+    } @else {
+      estreia {{ episodio().data | date: "d 'de' MMMM" : 'UTC' }}
     }
   </p>
 
-  @if (showPlayer()) {
+  @if (episodio().publicado && showPlayer()) {
     <div class="player">
       <iframe
         [src]="embedUrl()"
@@ -27,8 +35,10 @@ <h3>{{ episodio().titulo }}</h3>
     </div>
   } @else {
     <p class="descricao">{{ episodio().descricao }}</p>
-    <app-button variant="ghost" [href]="'https://www.youtube.com/watch?v=' + episodio().youtubeId">
-      Assistir no YouTube →
-    </app-button>
+    @if (episodio().publicado && episodio().youtubeId; as videoId) {
+      <app-button variant="ghost" [href]="'https://www.youtube.com/watch?v=' + videoId">
+        Assistir no YouTube →
+      </app-button>
+    }
   }
 </app-card>