feat(frontend): add dynamic page titles for workspace and session pages

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Signed-off-by: Martin Prpič <mprpic@redhat.com>

Author: mprpic

components/frontend/src/app/integrations/page.tsx

@@ -1,6 +1,11 @@
+import type { Metadata } from 'next'
 import React from 'react'
 import IntegrationsClient from '@/app/integrations/IntegrationsClient'
 
+export const metadata: Metadata = {
+  title: 'Integrations · Ambient Code Platform',
+}
+
 export const dynamic = 'force-dynamic'
 export const revalidate = 0
 

components/frontend/src/app/projects/[name]/layout.tsx

@@ -0,0 +1,7 @@
+export default function WorkspaceLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return children;
+}

components/frontend/src/app/projects/[name]/page.tsx

@@ -99,6 +99,12 @@ export default function ProjectDetailsPage() {
   const initialSection = (searchParams.get('section') as Section) || 'sessions';
   const [activeSection, setActiveSection] = useState<Section>(initialSection);
 
+  // Update page title with display name when available
+  useEffect(() => {
+    const title = project?.displayName || projectName;
+    document.title = `${title} · Ambient Code Platform`;
+  }, [project?.displayName, projectName]);
+
   // Update active section when query parameter changes
   useEffect(() => {
     const sectionParam = searchParams.get('section') as Section;

components/frontend/src/app/projects/[name]/sessions/[sessionName]/layout.tsx

@@ -0,0 +1,7 @@
+export default function SessionLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return children;
+}

components/frontend/src/app/projects/[name]/sessions/[sessionName]/page.tsx

@@ -251,6 +251,14 @@ export default function ProjectSessionDetailPage({
     return undefined;
   }, [capabilities?.framework, runnerTypes]);
 
+  // Update page title with display name when available
+  useEffect(() => {
+    const title = session?.spec?.displayName || sessionName;
+    if (title) {
+      document.title = `${title} · Ambient Code Platform`;
+    }
+  }, [session?.spec?.displayName, sessionName]);
+
   // Track the current Langfuse trace ID for feedback association
   const [langfuseTraceId, setLangfuseTraceId] = useState<string | null>(null);
 

components/frontend/src/app/projects/layout.tsx

@@ -0,0 +1,13 @@
+import type { Metadata } from "next";
+
+export const metadata: Metadata = {
+  title: "Workspaces · Ambient Code Platform",
+};
+
+export default function WorkspacesLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return children;
+}