ENG-9201: Customer pages update

[carlosabadia]

No description provided.

[linear]

ENG-9201 Update case studies and gallery on Reflex web

[greptile-apps]

Greptile Summary

This PR is a significant visual redesign of the /customers landing page and individual case study (story) pages. It replaces the old landing.py + bento_cards.py + customers_list.py stack with a cleaner architecture: a new customers/__init__.py using the marketing_page template, new view components (hero, companies, customer_cards, book_a_demo), and a fully rewritten storypage.py template with a CaseStudy dataclass, a sticky table of contents, stats cards, and a "more customers" carousel. Quote rendering in flexdown.py is also upgraded with three display variants (small, medium, big) including optional avatars.\n\nKey changes:\n- New customers landing page — sticky left heading + scrollable customer card list + filterable company grid + book-a-demo section.\n- New story page template — CaseStudy dataclass centralises metadata extraction; hero, stats, ToC, carousel, and book-a-demo sections are all composed inside the template.\n- Quote block variants — small (default), medium (slim with optional avatar panel), and big (large pullquote with SVG background).\n- Case study markdown enrichment — card_header, card_description, image, and variant fields added to all four case studies.\n- ClientStateVar filtering — company filter tabs use ClientStateVar (client-side only, no server round-trip), replacing the old rx.State-based CustomersState.\n\nMinor issues flagged: an empty left panel in the medium quote variant when no image: is supplied, an incorrect str type hint on tab_item(), an unused stats export in views/__init__.py, and fragile direct-key access for card_header/card_description.

Confidence Score: 5/5

Safe to merge — no runtime errors or data-integrity issues; all findings are cosmetic or defensive-coding suggestions.

All four flagged items are P2: a potential empty-panel visual glitch in the medium quote variant when no image is provided, a wrong type hint, an unused export, and a missing .get() fallback. None cause a build failure today or break the primary user path. The core architectural changes (CaseStudy dataclass, new page structure, ClientStateVar filtering) are well-implemented and the deletion of old state-based filtering in favour of client-side state is a clear improvement.

pcweb/flexdown.py (medium variant empty panel), pcweb/pages/customers/views/customer_cards.py (direct metadata key access), pcweb/pages/customers/views/companies.py (type hint)

Important Files Changed

Filename	Overview
pcweb/flexdown.py	Refactored QuoteBlock to support three display variants (small, medium, big) with separate avatar/author helpers; medium variant may show empty left panel when no image is provided.
pcweb/templates/storypage.py	Major rewrite — introduced CaseStudy dataclass, hero/stats/TOC/carousel sub-components, and a cleaner storypage() template factory; overall logic is sound.
pcweb/pages/customers/init.py	New customers landing page using marketing_page template with hero, companies, and book_a_demo sections; clean and straightforward.
pcweb/pages/customers/views/companies.py	New filterable company grid using ClientStateVar; tab_item() has an incorrect str type hint where FilterTab is expected (uses .value attribute).
pcweb/pages/customers/views/customer_cards.py	New customer card components built from customer_data; direct [] access for card_header/card_description will KeyError at import time if any future case study omits those fields.
pcweb/pages/customers/data/customers.py	Simplified route registration to use CaseStudy.from_document(); old get_route() helper and commented-out comment removed.
pcweb/pages/customers/views/init.py	New views package init; exports stats but the function is no longer used in the new customers landing page.
pcweb/pages/customers/views/book_a_demo.py	New book-a-demo section component using demo_form(); clean and straightforward.
pcweb/pages/customers/views/hero.py	Updated hero section to embed customer_cards() alongside the heading copy; clean redesign.
pcweb/pages/init.py	Updated import of customers from the deleted landing.py to the new init.py package; correct.
pcweb/views/marketing_navbar.py	Updated customers import path to match new package structure; no functional change.
pcweb/pages/landing/views/companies.py	Removed curly quotes surrounding case study quote text and added leading-tight class; minor cosmetic fix.
case-studies/ansa.md	Added card_header and card_description frontmatter; added variant: medium to existing quotes.
case-studies/autodesk.md	Added card_header and card_description frontmatter; added variant: medium to existing quotes.
case-studies/bayesline.md	Added card_header, card_description, full author names (with last name), image fields, and variant tags to all quotes.
case-studies/sellerx.md	Added card_header and card_description frontmatter; added variant: medium to existing quotes.
pcweb/pages/customers/landing.py	Deleted — replaced by the new pcweb/pages/customers/init.py which uses the marketing_page template.
pcweb/pages/customers/views/bento_cards.py	Deleted — old bento card grid replaced by the new customer_cards.py with a cleaner card layout.
pcweb/pages/customers/views/customers_list.py	Deleted — old filterable list with CustomersState replaced by the new companies.py using ClientStateVar.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A["GET /customers"] --> B["customers/__init__.py\n@marketing_page"]
    B --> C["hero()"]
    B --> D["companies()"]
    B --> E["book_a_demo()"]
    C --> F["customer_cards()\n(built from customer_data)"]
    D --> G["companies_tabs()\nClientStateVar filter_tab_cs"]
    G --> H["company_card x18\n(opacity via is_matching_filter)"]
    F --> I["customer_data.values()\n(ansa, autodesk, bayesline, sellerx)"]
    A2["GET /customers/:company"] --> T["storypage(study)"]
    T --> T1["marketing_navbar()"]
    T --> T2["hero(study)"]
    T --> T3["stats_cards(study)"]
    T --> T4["content (markdown via xd2)"]
    T4 --> QB["QuoteBlock.render()"]
    QB --> QS["_render_small (default)"]
    QB --> QM["_render_medium (variant: medium)"]
    QB --> QBig["_render_big (variant: big)"]
    T --> T5["story_table_of_contents()"]
    T --> T6["more_customers() carousel"]
    T --> T7["book_a_demo()"]
    T --> T8["footer_index()"]

Loading

Comments Outside Diff (2)

1. pcweb/flexdown.py, line 292-303 (link)

   Empty left panel in _render_medium when no image provided

   Several quotes use variant: medium without specifying an image: field (e.g., all quotes in ansa.md, autodesk.md, and sellerx.md). In those cases, _avatar() returns None, and the left-side div still renders with p-4 shrink-0 lg:border-r ... max-lg:border-b — producing a visibly empty bordered panel.

   Consider conditionally rendering the left panel only when an image is available:

2. pcweb/pages/customers/views/__init__.py, line 4-14 (link)

   stats exported but no longer used in the new customers landing page

   The stats function is imported and included in __all__, but it is not used in pcweb/pages/customers/__init__.py (which only calls hero(), companies(), and book_a_demo()). The old landing.py that previously called stats() has been deleted. If stats is intentionally kept for future use, a comment explaining that would help; otherwise this import and __all__ entry should be removed to avoid confusion.

_{Reviews (1): Last reviewed commit: "Merge branch 'main' into carlos/new-cust..." | Re-trigger Greptile}