Page Templates & Hubs

PRD §9.1 defines the Landing Page Template as the primary entry point for marketing and onboarding. The Hero Section (9.1.1) uses a cinematic presentation style inspired by Destiny 2, followed by a Feature Grid (9.1.2), Stats Display (9.1.3), CTA Section (9.1.4), and Footer (9.1.5). This template serves unauthenticated visitors and drives conversion.

Neo4j graph entities such as Section and Chunk reference PRD section 9.0.0 via TRD_REFERENCES. The landing layout does not depend on authenticated user state; data can be served from static or CMS-backed chunks. MATCH (s:Section {id: "9.0.0"})-[:CONTAINS_SUBSECTION]->(ss) retrieves the template structure.

PRD §9.2 specifies the Dashboard Template with Top Navigation Bar (9.2.1), Side Panel in Destiny Director style (9.2.2), Main Content Area (9.2.3), Widget Grid (9.2.4), and Quick Actions Bar (9.2.5). TRD-02-001 requires the app shell to provide persistent navigation to People Hub, Build Hub, wallet, profile, and settings across route changes.

The Neo4j graph models TRD-02-001 as N-APP-SHELL linked via ENABLES to N-NAV, which ENABLES N-HUB-PEOPLE, N-HUB-BUILD, N-WALLET-NAV, N-PROFILE-NAV, and N-SETTINGS-NAV. MATCH (r:TRDRequirement {id: "TRD-02-001"})-[:TRD_REFERENCES]->(c:Chunk) returns provenance chunks.

PRD §9.3 defines the Profile Page Template with Profile Header in Guardian Banner style (9.3.1), Stats Overview resembling the Character Screen (9.3.2), Activity Feed (9.3.3), Collection Display (9.3.4), and Achievement Showcase (9.3.5). TRD-03-002 requires creator profiles to display token info, portfolio, tier badges, and linked content with tier-gated visibility.

Neo4j labels Creator, Token, and NFT are linked via ENABLES and RELATES_TO. TRD-03-002 TRD_REALIZES N-CREATOR. The profile page queries creator data via tRPC (TRD-03-005); graph chunks for PRD §4.0.0 (People Hub) are referenced by TRD_REFERENCES.

PRD §9.4 specifies the Marketplace Template with Filter Sidebar (9.4.1), Grid/List Toggle (9.4.2), Item Cards Grid (9.4.3), Pagination or Infinite Scroll (9.4.4), and Sort Controls (9.4.5). TRD-04-001 requires XR object listings to support search, filters (category, status, creator), investment status display, and pagination.

Neo4j N-XR-OBJECT is TRD_REALIZES by TRD-04-001; N-LISTING ENABLES N-XR-OBJECT. MATCH (r:TRDRequirement {id: "TRD-04-001"})-[:TRD_REFERENCES]->(c:Chunk) returns PRD section 5.0.0 chunks. buildHub.listObjects tRPC procedure powers the grid.

PRD §9.5 defines the Detail Page Template with Hero Image or 3D Preview (9.5.1), Info Panel in inspect style (9.5.2), Stats Breakdown (9.5.3), Action Buttons (9.5.4), and Related Items (9.5.5). TRD-04-004 requires 3D/XR asset preview via R3F or WebXR, with rotation/zoom for inspection and loading/error states.

Neo4j N-PREVIEW-3D and N-PREVIEW-WEBXR ENABLE N-XR-OBJECT. TRD-04-004 links to Chunk nodes for PRD 5.0.0. buildHub.getAssetPreviewUrl returns signed CDN URLs (TRD-10-004). AR preview is optional on mobile.

PRD §9.6 specifies the Settings Page Template with Settings Navigation (9.6.1), Form Sections (9.6.2), Toggle Groups (9.6.3), and Save/Cancel Actions (9.6.4). TRD-02-001 AC-6 requires the shell to include navigation to settings. This template is used for user preferences, notifications, privacy, and account management.

Neo4j N-SETTINGS-NAV is ENABLED by N-NAV under the app shell. No dedicated TRD for settings UI; it consumes auth.getSession and layout config. Chunks for settings may live in PRD §3.0.0 (Main Application Structure).

PRD §10.1 defines the People Hub Overview with Director-Style Navigation (10.1.1), Category Planets/Nodes (10.1.2), Featured Creators Carousel (10.1.3), and Activity Feed Widget (10.1.4). TRD-03-001 governs creator discovery; the hub surfaces trending, new, and recommended feeds with faceted filters.

Neo4j N-CREATOR, N-SEARCH, N-FEEDS, N-FILTERS are linked to TRD-03-001. MATCH (n:Creator) or (n:Hub) returns knowledge nodes. TRD_REFERENCES Chunks for PRD §4.0.0. Elasticsearch indexes creators per TRD-03-001 AC-2.

PRD §10.2 specifies Creator Discovery UI with Search Interface (10.2.1), Filter Panel (10.2.2), Creator Card Grid (10.2.3), and Sort Options (10.2.4). TRD-03-001 AC-1–8 require full-text search over names/bios, Elasticsearch, faceted filters (tier, token price), pagination, and combinable filters.

Neo4j N-ELASTICSEARCH ENABLES N-SEARCH which ENABLES N-CREATOR. creators index fields: id, name, bio, tier. MATCH (r:TRDRequirement {id: "TRD-03-001"})-[:TRD_REFERENCES]->(c:Chunk) for provenance. Search latency SLA <500ms p95.

PRD §10.3 defines Creator Profile UI with Banner & Avatar in Guardian style (10.3.1), Token Price as Power Level (10.3.2), Stats Bar (10.3.3), Content Tabs (10.3.4), NFT Collection Display (10.3.5), and Buy Token Interface (10.3.6). TRD-03-002 and TRD-03-003 govern profile display and token purchases.

Neo4j Creator, Token, NFT labels relate via RELATES_TO and ENABLES. creators.getProfile and creators.updateProfile tRPC procedures. Tier badge from membership NFT. MATCH (n:Creator)-[:RELATES_TO]->(t:Token) models creator–token linkage.

PRD §10.4 defines Live Stream UI with Video Player (10.4.1), Chat Panel (10.4.2), NFT Interaction Buttons (10.4.3), Token Price Overlay (10.4.4), and Viewer Count Display (10.4.5). TRD-03-004 specifies NFT interactions during stream; overlay uses 5s refresh per TRD-06-005 and TRD-13-002.

Neo4j NFT and Token nodes ENABLE stream overlays. TRD-03-004 TRD_REALIZES N-NFT. WebSocket (TRD-12-008) for real-time chat and viewer count. N-PREVIEW-WEBXR optional for in-stream 3D preview.

PRD §10.5 specifies Messages UI with Conversation List (10.5.1), Chat Window (10.5.2), NFT Attachment (10.5.3), and Token Gating Indicator (10.5.4). TRD-03-002 supports tier-gated visibility (e.g. Creator tier for DM). Messages are part of the People Hub social layer.

Neo4j GATES relationship models token gating; Tier and NFT nodes link to access control. TRD-07-003 (NFT gating) and TRD-03-002 govern visibility. Chunks for PRD §4.0.0 People Hub reference message flows.

TRD-03-005 specifies the People Hub API: backend SHALL expose creators, profiles, tokens, and social data via tRPC/REST with auth and rate limiting. Procedures include creators.getProfile, creators.updateProfile, token purchases, and search/list endpoints. Public routes: search, feed, basic profile; authenticated: update profile, gated actions.

Neo4j TRD-03-005 links to N-API and N-PROFILES. MATCH (r:TRDRequirement {id: "TRD-03-005"})-[:TRD_REFERENCES]->(c:Chunk) returns AC and data model chunks. tRPC router consumes Creator, Token, and social tables.

PRD §11.1 defines Build Hub Overview with Marketplace Grid (11.1.1), Pipeline Status Widget (11.1.2), Investment Portfolio Widget (11.1.3), and Quick Create Button (11.1.4). TRD-04-001 and TRD-04-002 govern XR object listing and developer pipeline. The hub surfaces objects in funding, funded, or live status.

Neo4j N-XR-OBJECT, N-LISTING, N-INVESTMENT, N-FUNDING link to TRD-04-001. MATCH (n:Hub) WHERE n.id CONTAINS "BUILD" returns Build Hub nodes. xr_objects table: id, name, status, funding_goal, funded_amount. buildHub.listObjects powers the grid.

PRD §11.2 specifies Build Hub Marketplace with Object Card in Exotic style (11.2.1), Investment Progress Bar (11.2.2), Stakeholder Slots Display (11.2.3), and Filter & Sort (11.2.4). TRD-04-001 and TRD-04-003 require investment status and stakeholder slot availability per listing.

Neo4j N-SLOT TRD_REALIZES TRD-04-003; N-XR-OBJECT relates to funding and slots. MATCH (r:TRDRequirement {id: "TRD-04-003"})-[:TRD_REFERENCES]->(c:Chunk). Filters: category, status, creator. Pagination via buildHub.listObjects page/limit.

PRD §11.3 defines Object Detail UI with 3D Preview (11.3.1), Stakeholder Breakdown (11.3.2), Investment Interface (11.3.3), Timeline/Pipeline View (11.3.4), and Developer Proposals (11.3.5). TRD-04-004 governs 3D/WebXR preview; TRD-04-001 AC-4 and TRD-11-001 cover investment and escrow.

Neo4j N-PREVIEW-3D, N-PREVIEW-WEBXR ENABLE N-XR-OBJECT. TRD-04-004 links to CDN (TRD-10-004) for asset URLs. MATCH (n:XR-OBJECT)-[:RELATES_TO]->(m) for stakeholder and funding relationships. buildHub.getAssetPreviewUrl returns signed URLs.

PRD §11.4 defines Create Object Wizard with Step Indicator (11.4.1), Form Sections (11.4.2), Preview Panel (11.4.3), and Navigation Buttons (11.4.4). Implemented in components/neo/stepper.tsx. The wizard guides creators through object creation, upload, and submission for review.

Neo4j Step and Flow nodes model the wizard; CONTAINS and PRECEDES relationships define step order. No dedicated TRD for the wizard UI; it integrates with TRD-04-001 (object creation) and TRD-04-002 (developer pipeline). MATCH (f:Flow)-[:PRECEDES]->(s:Step) for step sequence.

PRD §11.5 defines Developer Studio with Project Dashboard (11.5.1), SDK Documentation Viewer (11.5.2), Upload Interface (11.5.3), and Review Status Display (11.5.4). TRD-04-002 (developer pipeline) and TRD-20-001 (SDK) govern developer workflows. Developers upload builds and track review status.

Neo4j N-DEVELOPER TRD_REALIZES TRD-04-002; Technology and Integration nodes link to SDK. MATCH (r:TRDRequirement {id: "TRD-04-002"})-[:TRD_REFERENCES]->(c:Chunk). Unity build paths stored per TRD-10-001. Review status: pending, approved, rejected.

TRD-04-001 AC-4 requires users to invest during funding phases; TRD-11-001 specifies escrow integration. The Investment Flow UI collects amount, stakes during funding, and triggers escrow via tRPC. Investment pool (TRD-11-002) and treasury (TRD-11-004) govern fund flows.

Neo4j N-INVESTMENT ENABLES N-FUNDING; N-XR-OBJECT RELATES_TO N-FUNDING. MATCH (r:TRDRequirement {id: "TRD-11-001"})-[:TRD_REFERENCES]->(c:Chunk). Escrow tables and tRPC procedures power the flow. Investment flow SHALL integrate with TRD-11-001.

PRD §12.1 defines Wallet Overview with Balance Display in Glimmer style (12.1.1), Token Portfolio List (12.1.2), NFT Collection Grid (12.1.3), and Transaction History (12.1.4). TRD-18-001 governs multi-wallet support; users link MetaMask, WalletConnect, Coinbase, Rainbow, Zora.

Neo4j Wallet, Token, NFT, Session labels link via HAS and RELATES_TO. TRD-18-001 N-USER HAS N-WALLET; one primary wallet per user. user_wallets table: user_id, address, chain, is_primary. MATCH (u:User)-[:HAS]->(w:Wallet) for portfolio construction.

PRD §12.2 specifies Token Trading UI with Buy/Sell Toggle (12.2.1), Amount Input (12.2.2), Mini Chart (12.2.3), and Confirmation Modal (12.2.4). TRD-06-002 governs bonding curve trading; thirdweb (wallet) + viem handle transaction signing. Trading flows integrate with TRD-03-003 (token purchases) and TRD-06-005 (price feed).

Neo4j Token and Mechanism nodes model bonding curve; DISTRIBUTES_TO and ALLOCATES for economics. MATCH (r:TRDRequirement {id: "TRD-06-002"})-[:TRD_REFERENCES]->(c:Chunk). Confirmation modal displays gas estimate and slippage. Buy/sell via thirdweb transaction hooks.

PRD §12.3 specifies Token Price Charts with Candlestick (12.3.1), Line (12.3.2), Volume Bars (12.3.3), and Time Range Selector (12.3.4). Implemented with recharts. TRD-06-005 governs token price feed; charts consume price history from TRD-06-005 API or WebSocket.

Neo4j Metric and Token nodes relate to price data. TRD-06-005 defines price feed SLA and refresh intervals. MATCH (t:Token)-[:HAS_METRIC]->(m:Metric) for chart metrics. Time ranges: 1D, 1W, 1M, 1Y.

PRD §12.4 defines NFT Display with Exotic card style, Rarity indicator, Utility badge, and Trade button. TRD-07-003 governs NFT gating; display shows rarity tier and utility (e.g. membership, access). Trade action routes to marketplace or transfer flow.

Neo4j NFT, Card, Tier labels link via GATES and CLAIMS_VIA. TRD-07-003 TRD_REALIZES N-NFT. MATCH (n:NFT)-[:GATES]->(b:Benefit) for utility. Exotic styling from Destiny 2 design system; border-amber for rare items.

Token Price Overlay displays live price with 5s refresh for stream overlay. TRD-06-005 (price feed) and TRD-13-002 (overlay) govern this component. Minimal footprint per TRD-02-002 responsive layout. Used on creator streams and profile pages.

Neo4j Token and Metric nodes feed overlay. TRD-13-002 overlay SHALL support configurable refresh. WebSocket or polling for price updates. MATCH (t:Token) WHERE t.symbol = "$MEVSME" for platform token price.

TRD-18-001 requires wallet connection support for MetaMask, WalletConnect, Coinbase, Rainbow, Zora-native. Chain selector allows switch (L1, Base, Arbitrum, $Zora chain). Users link multiple wallets; one is primary. thirdweb Connect provides the connection UI.

Neo4j N-MULTI-WALLET, N-WALLET, N-USER link via HAS; N-PRIMARY attribute for default wallet. TRD-18-001 AC-1–5: link multiple wallets, designate primary, verify via signature, unlinking requires confirmation, NFT verification across linked wallets. user_wallets table stores linked addresses.

TRD-01-001 AC-1, AC-2: System SHALL accept email (required) for waitlist sign-up and optional social handles (Twitter, Discord, Instagram, TikTok). PRD §2.0.0 governs onboarding. The form persists waitlist entry with timestamp, email, and linked social IDs. No password for social; OAuth only.

Neo4j N-WAITLIST, N-SOCIAL-HANDLE, N-WAITLIST-UI link to TRD-01-001. waitlist_entries table: id, email, position, referred_by_id, created_at. waitlist_social_links for OAuth links. MATCH (w:Waitlist)-[:INTEGRATES]->(s) for social platforms.

TRD-01-001 AC-4, AC-6: System SHALL display current waitlist position and generate unique referral link per entry. Position is computed from boosts (+100 per referral, +50 per platform). referral_links table stores code, waitlist_entry_id, and created_at.

Neo4j N-REFERRAL, N-POSITION-CALC link via IMPROVES_POSITION. TRD-01-001 TRD_REALIZES N-WAITLIST and N-REFERRAL. MATCH (r:Referral)-[:IMPROVES_POSITION]->(w:Waitlist). URL format: mvm.io/waitlist?ref=CODE. Copy button uses Clipboard API.

TRD-01-001 AC-5, AC-7: Position boost +50 per connected platform; OAuth for social handle linking (Twitter, Discord, Instagram, TikTok). No password storage for social. waitlist.linkSocial tRPC links platform_user_id to waitlist entry. Platform linking improves position immediately.

Neo4j N-WAITLIST INTEGRATES N-SOCIAL-HANDLE. OAuth providers return platform_user_id; stored in waitlist_social_links. MATCH (w:Waitlist)-[:INTEGRATES]->(h) WHERE h.platform IN ["twitter","discord","instagram","tiktok"]. Position recalc triggers on link.

TRD-01-001 AC-5: Referral attribution via ?ref=CODE in URL; referred_by_id links signup to referrer; position recalc applies +100 per referral. referral_links table: id, waitlist_entry_id, code, created_at. Incoming signup with ?ref= sets referred_by_id and triggers boost.

Neo4j N-REFERRAL RELATES_TO N-POSITION-CALC; IMPROVES_POSITION relationship. MATCH (e:Waitlist)-[:REFERRED_BY]->(r:Waitlist) for referral graph. Position formula: base_rank + SUM(referrals)*100 + SUM(platforms)*50. waitlist.signUp accepts ref param.

TRD-01-002: Admin invitation flow sends invitation email with access code; code has 72h validity. Invited users claim via access code input. access_codes table: code, expires_at, used_at, invitee_email. Admin creates codes via internal tool or tRPC.

Neo4j AccessCode label (3 nodes) links to ONBOARDING. TRD-01-002 governs invitation; TRD-01-001 waitlist precedes invitation. MATCH (a:AccessCode) WHERE a.expires_at > now(). Claim flow validates code and creates or upgrades user/waitlist entry.

TRD-01-001 AC-8: Waitlist APIs exposed via tRPC. Procedures: waitlist.signUp { email, socialHandles? }, waitlist.getPosition { email | id }, waitlist.linkSocial { waitlistEntryId, platform, oauthToken }. Frontend consumes these for signup form, position display, and OAuth callback.

Neo4j N-WAITLIST-API ENABLES N-WAITLIST-UI. TRD-01-001 links to Chunk nodes for PRD §2.0.0. MATCH (r:TRDRequirement {id: "TRD-01-001"})-[:TRD_REFERENCES]->(c:Chunk). tRPC router uses waitlist_entries, referral_links, waitlist_social_links tables.