diff --git a/app/now/page.tsx b/app/now/page.tsx
index 7ab9bcb..8d84af1 100644
--- a/app/now/page.tsx
+++ b/app/now/page.tsx
@@ -144,6 +144,12 @@ export default async function NowPage() {
dev && (dev.rhythm || dev.languages.length > 0 || dev.activity.length > 0),
);
+ // Momento em que a página foi gerada — teto real de "atualizado há X" para
+ // as seções sem cache próprio (GitHub, Last.fm): elas buscam ao vivo a
+ // cada regeneração da página (revalidate acima), então "agora" aqui É a
+ // última sincronização.
+ const renderedAt = new Date().toISOString();
+
const recentTracks = computeTrackData(lastfm);
return (
@@ -209,6 +215,7 @@ export default async function NowPage() {
id="code-title"
title="Código"
subtitle={CODE_DESCRIPTION}
+ updatedAt={renderedAt}
/>
@@ -237,6 +244,7 @@ export default async function NowPage() {
}
id="starred-title"
title="Código"
+ updatedAt={renderedAt}
/>
@@ -251,6 +259,7 @@ export default async function NowPage() {
id="listening-title"
title="No repeat do mês"
subtitle={LISTENING_DESCRIPTION}
+ updatedAt={renderedAt}
/>
diff --git a/src/base/components/SectionHeader/SectionHeader.tsx b/src/base/components/SectionHeader/SectionHeader.tsx
index 0f4763b..2622006 100644
--- a/src/base/components/SectionHeader/SectionHeader.tsx
+++ b/src/base/components/SectionHeader/SectionHeader.tsx
@@ -25,9 +25,10 @@ type SectionHeaderProps = {
};
/**
- * Header padrão de seção: selo do ícone à esquerda, título e subtítulo
- * opcional, ação opcional à direita. É o único padrão de seção do site —
- * páginas não devem montar cabeçalhos próprios.
+ * Header padrão de seção: selo do ícone + título numa linha, subtítulo e
+ * selo de atualização abaixo (largura cheia, rente ao ícone — não
+ * indentados sob o título). Ação opcional à direita do título. É o único
+ * padrão de seção do site — páginas não devem montar cabeçalhos próprios.
*/
export const SectionHeader = ({
icon,
@@ -38,38 +39,35 @@ export const SectionHeader = ({
className = '',
updatedAt,
}: SectionHeaderProps) => (
-
- {icon}
-
-
+
+
+
{icon}
{title}
- {subtitle ? (
-
- {subtitle}
-
- ) : null}
- {updatedAt ? (
-
-
- Atualizado{' '}
-
- {formatRelativeTime(updatedAt)}
-
-
- ) : null}
+ {action ?
{action}
: null}
- {action ? {action}
: null}
+ {subtitle ? (
+
+ {subtitle}
+
+ ) : null}
+ {updatedAt ? (
+
+
+ Atualizado{' '}
+
+ {formatRelativeTime(updatedAt)}
+
+
+ ) : null}
);