Merge branch 'claude/plots-page-retro-branding-emimK'

Renames the catalog URL/page to plots across frontend, backend, and docs.
Retro UI experiment was reverted, only the clean rename was kept.

Author: MarkusNeusinger

api/analytics.py

@@ -148,7 +148,7 @@ def track_og_image(
 
     Args:
         request: FastAPI request for headers
-        page: Page type ('home', 'catalog', 'spec_overview', 'spec_detail')
+        page: Page type ('home', 'plots', 'spec_overview', 'spec_detail')
         spec: Spec ID (optional)
         library: Library ID (optional)
         filters: Query params for filtered home page (e.g., {'lib': 'plotly', 'dom': 'statistics'})
@@ -160,8 +160,8 @@ def track_og_image(
     # Build URL based on page type
     if page == "home":
         url = "https://anyplot.ai/"
-    elif page == "catalog":
-        url = "https://anyplot.ai/catalog"
+    elif page == "plots":
+        url = "https://anyplot.ai/plots"
     elif spec is not None and library:
         url = f"https://anyplot.ai/python/{spec}/{library}"
     elif spec is not None:

api/routers/og_images.py

@@ -50,10 +50,10 @@ async def get_home_og_image(request: Request) -> Response:
     )
 
 
-@router.get("/catalog.png")
-async def get_catalog_og_image(request: Request) -> Response:
-    """OG image for catalog page with tracking."""
-    track_og_image(request, page="catalog")
+@router.get("/plots.png")
+async def get_plots_og_image(request: Request) -> Response:
+    """OG image for plots page with tracking."""
+    track_og_image(request, page="plots")
 
     return Response(
         content=_get_static_og_image(), media_type="image/png", headers={"Cache-Control": "public, max-age=86400"}

api/routers/seo.py

@@ -28,7 +28,8 @@ def _build_sitemap_xml(specs: list) -> str:
         '<?xml version="1.0" encoding="UTF-8"?>',
         '<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">',
         "  <url><loc>https://anyplot.ai/</loc></url>",
-        "  <url><loc>https://anyplot.ai/catalog</loc></url>",
+        "  <url><loc>https://anyplot.ai/plots</loc></url>",
+        "  <url><loc>https://anyplot.ai/specs</loc></url>",
         "  <url><loc>https://anyplot.ai/mcp</loc></url>",
         "  <url><loc>https://anyplot.ai/legal</loc></url>",
         "  <url><loc>https://anyplot.ai/stats</loc></url>",
@@ -83,7 +84,7 @@ async def _refresh_sitemap() -> str:
 
 # Route through API for tracking (was: anyplot.ai/og-image.png)
 DEFAULT_HOME_IMAGE = "https://api.anyplot.ai/og/home.png"
-DEFAULT_CATALOG_IMAGE = "https://api.anyplot.ai/og/catalog.png"
+DEFAULT_PLOTS_IMAGE = "https://api.anyplot.ai/og/plots.png"
 DEFAULT_DESCRIPTION = "library-agnostic, ai-powered plotting."
 
 
@@ -103,7 +104,7 @@ async def get_sitemap(db: AsyncSession | None = Depends(optional_db)):
     """
     Generate dynamic XML sitemap for SEO.
 
-    Includes root, catalog page, and all specs with implementations.
+    Includes root, plots/specs pages, and all specs with implementations.
     """
     if db is None:
         return Response(content=_STATIC_SITEMAP, media_type="application/xml")
@@ -143,15 +144,28 @@ async def seo_home(request: Request):
     )
 
 
-@router.get("/seo-proxy/catalog")
-async def seo_catalog():
-    """Bot-optimized catalog page with correct og:tags."""
+@router.get("/seo-proxy/plots")
+async def seo_plots():
+    """Bot-optimized plots page with correct og:tags."""
     return HTMLResponse(
         BOT_HTML_TEMPLATE.format(
-            title="Catalog | anyplot.ai",
-            description="Browse all Python plotting specifications alphabetically. Find matplotlib, seaborn, plotly, bokeh, altair examples.",
-            image=DEFAULT_CATALOG_IMAGE,
-            url="https://anyplot.ai/catalog",
+            title="plots | anyplot.ai",
+            description="Browse and filter Python visualization examples across 9 libraries: matplotlib, seaborn, plotly, bokeh, altair, plotnine, pygal, highcharts, lets-plot.",
+            image=DEFAULT_PLOTS_IMAGE,
+            url="https://anyplot.ai/plots",
+        )
+    )
+
+
+@router.get("/seo-proxy/specs")
+async def seo_specs():
+    """Bot-optimized specs page with correct og:tags."""
+    return HTMLResponse(
+        BOT_HTML_TEMPLATE.format(
+            title="specs | anyplot.ai",
+            description="Browse all Python plotting specifications alphabetically.",
+            image=DEFAULT_PLOTS_IMAGE,
+            url="https://anyplot.ai/specs",
         )
     )
 

app/src/components/Breadcrumb.test.tsx

@@ -4,28 +4,28 @@ import { Breadcrumb } from './Breadcrumb';
 
 describe('Breadcrumb', () => {
   it('renders breadcrumb items', () => {
-    render(<Breadcrumb items={[{ label: 'anyplot.ai', to: '/' }, { label: 'catalog' }]} />);
+    render(<Breadcrumb items={[{ label: 'anyplot.ai', to: '/' }, { label: 'plots' }]} />);
 
     expect(screen.getByText('anyplot.ai')).toBeInTheDocument();
-    expect(screen.getByText('catalog')).toBeInTheDocument();
+    expect(screen.getByText('plots')).toBeInTheDocument();
   });
 
   it('renders linked items as links', () => {
-    render(<Breadcrumb items={[{ label: 'anyplot.ai', to: '/' }, { label: 'catalog' }]} />);
+    render(<Breadcrumb items={[{ label: 'anyplot.ai', to: '/' }, { label: 'plots' }]} />);
 
     const link = screen.getByText('anyplot.ai');
     expect(link.closest('a')).toHaveAttribute('href', '/');
   });
 
   it('renders current page as plain text', () => {
-    render(<Breadcrumb items={[{ label: 'anyplot.ai', to: '/' }, { label: 'catalog' }]} />);
+    render(<Breadcrumb items={[{ label: 'anyplot.ai', to: '/' }, { label: 'plots' }]} />);
 
-    const current = screen.getByText('catalog');
+    const current = screen.getByText('plots');
     expect(current.closest('a')).toBeNull();
   });
 
   it('renders separator between items', () => {
-    render(<Breadcrumb items={[{ label: 'anyplot.ai', to: '/' }, { label: 'catalog' }]} />);
+    render(<Breadcrumb items={[{ label: 'anyplot.ai', to: '/' }, { label: 'plots' }]} />);
 
     expect(screen.getByText('›')).toBeInTheDocument();
   });

app/src/components/Breadcrumb.tsx

@@ -24,8 +24,8 @@ export interface BreadcrumbProps {
  * Breadcrumb navigation component.
  *
  * @example
- * // Simple: anyplot.ai > catalog
- * <Breadcrumb items={[{ label: 'anyplot.ai', to: '/' }, { label: 'catalog' }]} />
+ * // Simple: anyplot.ai > plots
+ * <Breadcrumb items={[{ label: 'anyplot.ai', to: '/' }, { label: 'plots' }]} />
  *
  * @example
  * // With short labels for mobile

app/src/components/Footer.tsx

@@ -59,11 +59,11 @@ export function Footer({ onTrackEvent, selectedSpec, selectedLibrary }: FooterPr
       <span>·</span>
       <Link
         component={RouterLink}
-        to="/catalog"
-        onClick={() => onTrackEvent?.('internal_link', { destination: 'catalog', spec: selectedSpec, library: selectedLibrary })}
+        to="/plots"
+        onClick={() => onTrackEvent?.('internal_link', { destination: 'plots', spec: selectedSpec, library: selectedLibrary })}
         sx={linkSx}
       >
-        catalog
+        plots
       </Link>
       <span>·</span>
       <Link

app/src/components/HeroSection.tsx

@@ -118,7 +118,7 @@ export function HeroSection({ stats }: HeroSectionProps) {
         <Box sx={{ display: 'flex', gap: 1.5, flexWrap: 'wrap', animation: 'rise 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) 0.3s backwards' }}>
           <Box
             component={RouterLink}
-            to="/catalog"
+            to="/plots"
             sx={{
               textDecoration: 'none',
               boxSizing: 'border-box',

app/src/components/LibrariesSection.tsx

@@ -22,7 +22,7 @@ export function LibrariesSection({ libraries, onLibraryClick }: LibrariesSection
         number="§ 01"
         title={<>The <em>libraries</em></>}
         linkText="view all"
-        linkTo="/catalog"
+        linkTo="/plots"
       />
 
       <Box sx={{

app/src/components/NavBar.tsx

@@ -4,12 +4,12 @@ import Box from '@mui/material/Box';
 import { colors, typography } from '../theme';
 
 interface NavBarProps {
-  /** Ref to FilterBar search input -- when on /catalog, focuses it; otherwise navigates to /catalog */
+  /** Ref to FilterBar search input -- when on /plots, focuses it; otherwise navigates to /plots */
   searchInputRef?: React.RefObject<HTMLInputElement | null>;
 }
 
 const NAV_LINKS = [
-  { label: 'catalog', to: '/catalog' },
+  { label: 'plots', to: '/plots' },
   { label: 'specs', to: '/specs' },
   { label: 'palette', to: '/palette' },
   { label: 'mcp', to: '/mcp' },
@@ -58,10 +58,10 @@ export function NavBar({ searchInputRef }: NavBarProps) {
   const location = useLocation();
 
   const handleSearch = useCallback(() => {
-    if (location.pathname === '/catalog' && searchInputRef?.current) {
+    if (location.pathname === '/plots' && searchInputRef?.current) {
       searchInputRef.current.focus();
     } else {
-      navigate('/catalog');
+      navigate('/plots');
     }
   }, [location.pathname, searchInputRef, navigate]);
 

app/src/components/SpecTabs.tsx

@@ -210,7 +210,7 @@ export function SpecTabs({
     return tagCounts[paramName]?.[value] ?? null;
   }, [tagCounts]);
 
-  // Handle tag click - navigate to filtered catalog (full page navigation)
+  // Handle tag click - navigate to filtered plots page (full page navigation)
   const handleTagClick = useCallback(
     (paramName: string, value: string) => {
       onTrackEvent?.('tag_click', { param: paramName, value, source: 'spec_detail' });