From cda08ec0339988d9f478b0c3f598f9c1c5c7309b Mon Sep 17 00:00:00 2001 From: Mohamed Boudra Date: Sun, 15 Mar 2026 14:28:10 +0700 Subject: [PATCH] feat(website): add og:title and og:description via pageMeta helper Extract a DRY pageMeta(title, description) helper that returns both standard and OpenGraph meta tags from a single source of truth. --- packages/website/src/meta.ts | 8 ++++++++ packages/website/src/routes/changelog.tsx | 13 +++++-------- packages/website/src/routes/claude-code.tsx | 13 +++++-------- packages/website/src/routes/codex.tsx | 13 +++++-------- packages/website/src/routes/docs/best-practices.tsx | 12 +++++------- packages/website/src/routes/docs/cli.tsx | 12 +++++------- packages/website/src/routes/docs/configuration.tsx | 12 +++++------- packages/website/src/routes/docs/index.tsx | 12 +++++------- packages/website/src/routes/docs/security.tsx | 13 +++++-------- packages/website/src/routes/docs/updates.tsx | 12 +++++------- packages/website/src/routes/docs/voice.tsx | 12 +++++------- packages/website/src/routes/docs/worktrees.tsx | 12 +++++------- packages/website/src/routes/index.tsx | 13 +++++-------- packages/website/src/routes/opencode.tsx | 13 +++++-------- packages/website/src/routes/privacy.tsx | 13 +++++-------- 15 files changed, 78 insertions(+), 105 deletions(-) create mode 100644 packages/website/src/meta.ts diff --git a/packages/website/src/meta.ts b/packages/website/src/meta.ts new file mode 100644 index 000000000..31aee1f0f --- /dev/null +++ b/packages/website/src/meta.ts @@ -0,0 +1,8 @@ +export function pageMeta(title: string, description: string) { + return [ + { title }, + { name: 'description', content: description }, + { property: 'og:title', content: title }, + { property: 'og:description', content: description }, + ] +} diff --git a/packages/website/src/routes/changelog.tsx b/packages/website/src/routes/changelog.tsx index db25dcda3..ff58a1a63 100644 --- a/packages/website/src/routes/changelog.tsx +++ b/packages/website/src/routes/changelog.tsx @@ -1,18 +1,15 @@ import { Link, createFileRoute } from '@tanstack/react-router' import ReactMarkdown from 'react-markdown' import changelogMarkdown from '../../../../CHANGELOG.md?raw' +import { pageMeta } from '~/meta' import '~/styles.css' export const Route = createFileRoute('/changelog')({ head: () => ({ - meta: [ - { title: 'Changelog - Paseo' }, - { - name: 'description', - content: - 'Product updates, fixes, and improvements shipped in each Paseo release.', - }, - ], + meta: pageMeta( + 'Changelog - Paseo', + 'Product updates, fixes, and improvements shipped in each Paseo release.', + ), }), component: Changelog, }) diff --git a/packages/website/src/routes/claude-code.tsx b/packages/website/src/routes/claude-code.tsx index a04721555..866daf4da 100644 --- a/packages/website/src/routes/claude-code.tsx +++ b/packages/website/src/routes/claude-code.tsx @@ -1,16 +1,13 @@ import { createFileRoute } from '@tanstack/react-router' import { LandingPage } from '~/components/landing-page' +import { pageMeta } from '~/meta' export const Route = createFileRoute('/claude-code')({ head: () => ({ - meta: [ - { title: 'Claude Code Mobile App – Ship from your phone | Paseo' }, - { - name: 'description', - content: - 'Run Claude Code from your phone. Launch agents, check on progress, review diffs, and merge — all from your pocket. Self-hosted, your code stays on your machine.', - }, - ], + meta: pageMeta( + 'Claude Code Mobile App – Ship from your phone | Paseo', + 'Run Claude Code from your phone. Launch agents, check on progress, review diffs, and merge — all from your pocket. Self-hosted, your code stays on your machine.', + ), }), component: ClaudeCodePage, }) diff --git a/packages/website/src/routes/codex.tsx b/packages/website/src/routes/codex.tsx index 0ddb28fb6..b1ec6ce16 100644 --- a/packages/website/src/routes/codex.tsx +++ b/packages/website/src/routes/codex.tsx @@ -1,16 +1,13 @@ import { createFileRoute } from '@tanstack/react-router' import { LandingPage } from '~/components/landing-page' +import { pageMeta } from '~/meta' export const Route = createFileRoute('/codex')({ head: () => ({ - meta: [ - { title: 'Codex Mobile App – Run Codex from anywhere | Paseo' }, - { - name: 'description', - content: - 'Run OpenAI Codex from your phone. Kick off agents, monitor progress, and ship code without being at your desk. Self-hosted, your code never leaves your machine.', - }, - ], + meta: pageMeta( + 'Codex Mobile App – Run Codex from anywhere | Paseo', + 'Run OpenAI Codex from your phone. Kick off agents, monitor progress, and ship code without being at your desk. Self-hosted, your code never leaves your machine.', + ), }), component: CodexPage, }) diff --git a/packages/website/src/routes/docs/best-practices.tsx b/packages/website/src/routes/docs/best-practices.tsx index 2f9c80a8e..cbed1dd42 100644 --- a/packages/website/src/routes/docs/best-practices.tsx +++ b/packages/website/src/routes/docs/best-practices.tsx @@ -1,14 +1,12 @@ import { createFileRoute } from '@tanstack/react-router' +import { pageMeta } from '~/meta' export const Route = createFileRoute('/docs/best-practices')({ head: () => ({ - meta: [ - { title: 'Best Practices - Paseo Docs' }, - { - name: 'description', - content: 'Tips for getting the most out of Paseo and mobile-first agent workflows.', - }, - ], + meta: pageMeta( + 'Best Practices - Paseo Docs', + 'Tips for getting the most out of Paseo and mobile-first agent workflows.', + ), }), component: BestPractices, }) diff --git a/packages/website/src/routes/docs/cli.tsx b/packages/website/src/routes/docs/cli.tsx index f57bc9f5c..25ae6dcb5 100644 --- a/packages/website/src/routes/docs/cli.tsx +++ b/packages/website/src/routes/docs/cli.tsx @@ -1,14 +1,12 @@ import { createFileRoute } from '@tanstack/react-router' +import { pageMeta } from '~/meta' export const Route = createFileRoute('/docs/cli')({ head: () => ({ - meta: [ - { title: 'CLI - Paseo Docs' }, - { - name: 'description', - content: 'Paseo CLI reference: manage agents, daemons, permissions, and worktrees from your terminal.', - }, - ], + meta: pageMeta( + 'CLI - Paseo Docs', + 'Paseo CLI reference: manage agents, daemons, permissions, and worktrees from your terminal.', + ), }), component: CLI, }) diff --git a/packages/website/src/routes/docs/configuration.tsx b/packages/website/src/routes/docs/configuration.tsx index 74711be51..bb1ebc9f0 100644 --- a/packages/website/src/routes/docs/configuration.tsx +++ b/packages/website/src/routes/docs/configuration.tsx @@ -1,14 +1,12 @@ import { createFileRoute } from '@tanstack/react-router' +import { pageMeta } from '~/meta' export const Route = createFileRoute('/docs/configuration')({ head: () => ({ - meta: [ - { title: 'Configuration - Paseo Docs' }, - { - name: 'description', - content: 'Configure Paseo via config.json, environment variables, and CLI overrides.', - }, - ], + meta: pageMeta( + 'Configuration - Paseo Docs', + 'Configure Paseo via config.json, environment variables, and CLI overrides.', + ), }), component: Configuration, }) diff --git a/packages/website/src/routes/docs/index.tsx b/packages/website/src/routes/docs/index.tsx index 447727ba9..435428037 100644 --- a/packages/website/src/routes/docs/index.tsx +++ b/packages/website/src/routes/docs/index.tsx @@ -1,14 +1,12 @@ import { createFileRoute } from '@tanstack/react-router' +import { pageMeta } from '~/meta' export const Route = createFileRoute('/docs/')({ head: () => ({ - meta: [ - { title: 'Getting Started - Paseo Docs' }, - { - name: 'description', - content: 'Learn how to set up and use Paseo to manage your coding agents from anywhere.', - }, - ], + meta: pageMeta( + 'Getting Started - Paseo Docs', + 'Learn how to set up and use Paseo to manage your coding agents from anywhere.', + ), }), component: GettingStarted, }) diff --git a/packages/website/src/routes/docs/security.tsx b/packages/website/src/routes/docs/security.tsx index 7247f97e9..5972b1f82 100644 --- a/packages/website/src/routes/docs/security.tsx +++ b/packages/website/src/routes/docs/security.tsx @@ -1,15 +1,12 @@ import { createFileRoute } from '@tanstack/react-router' +import { pageMeta } from '~/meta' export const Route = createFileRoute('/docs/security')({ head: () => ({ - meta: [ - { title: 'Security - Paseo Docs' }, - { - name: 'description', - content: - 'Security model for Paseo: architecture overview, connection methods, relay encryption, and best practices.', - }, - ], + meta: pageMeta( + 'Security - Paseo Docs', + 'Security model for Paseo: architecture overview, connection methods, relay encryption, and best practices.', + ), }), component: Security, }) diff --git a/packages/website/src/routes/docs/updates.tsx b/packages/website/src/routes/docs/updates.tsx index 1d3b15cdd..701bf8e30 100644 --- a/packages/website/src/routes/docs/updates.tsx +++ b/packages/website/src/routes/docs/updates.tsx @@ -1,14 +1,12 @@ import { createFileRoute } from '@tanstack/react-router' +import { pageMeta } from '~/meta' export const Route = createFileRoute('/docs/updates')({ head: () => ({ - meta: [ - { title: 'Updates - Paseo Docs' }, - { - name: 'description', - content: 'How to update Paseo daemon and apps across web, desktop, and mobile.', - }, - ], + meta: pageMeta( + 'Updates - Paseo Docs', + 'How to update Paseo daemon and apps across web, desktop, and mobile.', + ), }), component: UpdatesDocs, }) diff --git a/packages/website/src/routes/docs/voice.tsx b/packages/website/src/routes/docs/voice.tsx index 024b51f60..3a585a7af 100644 --- a/packages/website/src/routes/docs/voice.tsx +++ b/packages/website/src/routes/docs/voice.tsx @@ -1,14 +1,12 @@ import { createFileRoute } from '@tanstack/react-router' +import { pageMeta } from '~/meta' export const Route = createFileRoute('/docs/voice')({ head: () => ({ - meta: [ - { title: 'Voice - Paseo Docs' }, - { - name: 'description', - content: 'Paseo voice architecture, local-first model execution, and provider configuration.', - }, - ], + meta: pageMeta( + 'Voice - Paseo Docs', + 'Paseo voice architecture, local-first model execution, and provider configuration.', + ), }), component: VoiceDocs, }) diff --git a/packages/website/src/routes/docs/worktrees.tsx b/packages/website/src/routes/docs/worktrees.tsx index 4e94cf85b..f7d1eb68a 100644 --- a/packages/website/src/routes/docs/worktrees.tsx +++ b/packages/website/src/routes/docs/worktrees.tsx @@ -1,14 +1,12 @@ import { createFileRoute } from '@tanstack/react-router' +import { pageMeta } from '~/meta' export const Route = createFileRoute('/docs/worktrees')({ head: () => ({ - meta: [ - { title: 'Git Worktrees - Paseo Docs' }, - { - name: 'description', - content: 'Run agents in isolated git worktrees for parallel feature development.', - }, - ], + meta: pageMeta( + 'Git Worktrees - Paseo Docs', + 'Run agents in isolated git worktrees for parallel feature development.', + ), }), component: Worktrees, }) diff --git a/packages/website/src/routes/index.tsx b/packages/website/src/routes/index.tsx index 87ef24687..058ca885e 100644 --- a/packages/website/src/routes/index.tsx +++ b/packages/website/src/routes/index.tsx @@ -1,16 +1,13 @@ import { createFileRoute } from '@tanstack/react-router' import { LandingPage } from '~/components/landing-page' +import { pageMeta } from '~/meta' export const Route = createFileRoute('/')({ head: () => ({ - meta: [ - { title: 'Paseo – Run Claude Code, Codex, and OpenCode from everywhere' }, - { - name: 'description', - content: - 'A self-hosted daemon for Claude Code, Codex, and OpenCode. Agents run on your machine with your full dev environment. Connect from phone, desktop, or web.', - }, - ], + meta: pageMeta( + 'Paseo – Run Claude Code, Codex, and OpenCode from everywhere', + 'A self-hosted daemon for Claude Code, Codex, and OpenCode. Agents run on your machine with your full dev environment. Connect from phone, desktop, or web.', + ), }), component: Home, }) diff --git a/packages/website/src/routes/opencode.tsx b/packages/website/src/routes/opencode.tsx index e55ce5dcc..a4ccf3ccb 100644 --- a/packages/website/src/routes/opencode.tsx +++ b/packages/website/src/routes/opencode.tsx @@ -1,16 +1,13 @@ import { createFileRoute } from '@tanstack/react-router' import { LandingPage } from '~/components/landing-page' +import { pageMeta } from '~/meta' export const Route = createFileRoute('/opencode')({ head: () => ({ - meta: [ - { title: 'OpenCode Mobile App – Code from anywhere | Paseo' }, - { - name: 'description', - content: - 'Run OpenCode from your phone. Launch agents, watch them work, and ship code from wherever you are. Self-hosted, open source, your code stays local.', - }, - ], + meta: pageMeta( + 'OpenCode Mobile App – Code from anywhere | Paseo', + 'Run OpenCode from your phone. Launch agents, watch them work, and ship code from wherever you are. Self-hosted, open source, your code stays local.', + ), }), component: OpenCodePage, }) diff --git a/packages/website/src/routes/privacy.tsx b/packages/website/src/routes/privacy.tsx index d4fec6a3f..888c190b9 100644 --- a/packages/website/src/routes/privacy.tsx +++ b/packages/website/src/routes/privacy.tsx @@ -1,15 +1,12 @@ import { createFileRoute } from '@tanstack/react-router' +import { pageMeta } from '~/meta' export const Route = createFileRoute('/privacy')({ head: () => ({ - meta: [ - { title: 'Privacy Policy - Paseo' }, - { - name: 'description', - content: - 'Privacy policy for Paseo - a self-hosted agent manager with no tracking or analytics.', - }, - ], + meta: pageMeta( + 'Privacy Policy - Paseo', + 'Privacy policy for Paseo - a self-hosted agent manager with no tracking or analytics.', + ), }), component: Privacy, })