Culinary Mesh modular refactor with explore hero and perf optimizations

[spe1020]

Summary

• Refactors monolithic CulinaryMesh.svelte into focused sub-components under src/components/mesh/ and extracts utilities into src/lib/mesh/ modules
• Adds a landing hero overlay with ambient drift animation on the explore page, linking to the full /mesh view
• Optimizes mesh performance: non-blocking simulation settling, viewport culling, LOD image loading, O(1) adjacency lookups, cached DOM refs, single-pass canvas edge rendering
• Cleans up nav by removing Culinary Mesh sidebar link, legend, control panel, metrics display, and Members badges

Test plan

• Verify /explore loads with the mesh hero centered and buttons visible
• Verify /mesh renders the interactive mesh with zoom/pan/drag working smoothly
• Confirm no "Members" badges appear in desktop side nav or user side panel
• Test dark mode and light mode on both pages
• Check mobile responsiveness of the hero overlay
• Profile with DevTools to confirm 60fps during pan/zoom with ~150 nodes

🤖 Generated with Claude Code

[cloudflare-workers-and-pages]

Deploying with    Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status	Name	Latest Commit	Updated (UTC)
❌ Deployment failed View logs	frontend	ecaa4bc	Feb 19 2026, 01:53 AM

[Copilot]

Pull request overview

This PR refactors the Culinary Mesh visualization into a modular architecture with significant performance enhancements, adds a landing hero overlay with animated mesh preview on the explore page, integrates membership belt badges into user profiles, and removes "Members" badges from navigation elements.

Changes:

• Refactored monolithic CulinaryMesh.svelte into focused sub-components (MeshCanvas, MeshNodes, MeshTooltip, etc.) and extracted utilities into dedicated modules (meshTypes, meshStore, meshTheme, meshData, meshLayout, meshViewport)
• Added interactive mesh hero overlay on /explore with ambient drift animation and optimized non-blocking simulation
• Implemented performance optimizations: viewport culling, LOD image loading, O(1) adjacency lookups, layout caching with TTL, cached DOM refs, single-pass canvas rendering
• Added MembershipBeltBadge component displayed inline with usernames on profile pages
• Removed "Members" badges from desktop navigation and user side panel

Reviewed changes

Copilot reviewed 25 out of 26 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
package.json, pnpm-lock.yaml	Added d3-force v3.0.0 and @types/d3-force v3.0.10 dependencies for force-directed graph layout
src/lib/meshUtils.ts	Re-export shim for backward compatibility with existing imports
src/lib/mesh/meshTypes.ts	TypeScript type definitions for mesh nodes, edges, filters, layers, and visual themes
src/lib/mesh/meshStore.ts	Svelte stores for mesh state management (filters, layers, visual theme, selected node)
src/lib/mesh/meshTheme.ts	Color schemes for default and constellation visual themes
src/lib/mesh/meshLayout.ts	Layout caching utilities with localStorage persistence and TTL
src/lib/mesh/meshData.ts	Data fetching and graph building logic extracted from main component
src/lib/mesh/meshViewport.ts	Viewport bounds calculation and culling utilities for performance
src/components/mesh/MeshCanvas.svelte	Canvas-based edge rendering with viewport culling and single-pass drawing
src/components/mesh/MeshNodes.svelte	Node rendering with LOD, viewport culling, and membership badge integration
src/components/mesh/MeshTooltip.svelte	Tooltip component for recipe nodes
src/components/mesh/MeshStarfield.svelte	Pure CSS starfield animation for constellation theme
src/components/mesh/MeshLegend.svelte	Visual legend for mesh node tiers and connection types
src/components/mesh/MeshZoomControls.svelte	Zoom control UI (zoom in/out/reset)
src/components/mesh/MeshDetailDrawer.svelte	Side drawer with node details and touch swipe support
src/components/mesh/MeshHeroOverlay.svelte	Hero section with animated mesh preview using cached DOM refs and batched updates
src/components/mesh/MeshControlPanel.svelte	Control panel for filters and layer toggles (appears unused in current implementation)
src/components/CulinaryMesh.svelte	Refactored main mesh component using extracted sub-components
src/components/MembershipBeltBadge.svelte	SVG-based membership belt badge component with tier-specific colors
src/routes/mesh/+page.ts	SSR disabled for mesh page
src/routes/mesh/+page.svelte	New dedicated mesh page with loading states and zoom controls
src/routes/explore/+page.svelte	Integrated mesh hero overlay with non-blocking async simulation
src/routes/user/[slug]/+page.svelte	Added membership belt badge inline with username
src/components/DesktopSideNav.svelte	Removed "members" badge from Groups navigation item
src/components/UserSidePanel.svelte	Removed "Members" badge from The Pantry button

Files not reviewed (1)

• pnpm-lock.yaml: Language not supported

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.