[Feature · V1 · #459] Unified Channel Profile: inline owner view, Materials & Hours tabs, Centre Affiliation & Pro-Bono capacity #548

Header

• Priority: High (Unifies public/internal profile mismatch + integrates [Urgent · V1] Unified account + roles + child sub-profiles + hours ledger #459, [Feature · V1 · #459] Lifelong Academic Records & Education CV #545 & Feature: MatchMax Impact (CSR Ecosystem Integration) #400) — Must NOT block core Stripe checkout or base auth.
• Owner: Ryan Young (locate tutor profile page, tutor card, and Feature: MatchMax Impact (CSR Ecosystem Integration) #400 impact badge components during implementation)
• Parent: #459 Unified base account & hours ledger
• Related (do not merge): #545 Academic Records CV (consumed on Overview & CV tab) · #400 MatchMax Impact / CSR Pro-Bono badge (capacity/slots SoT extends here) · #543 Digital materials checkout (Study Materials tab consumes published listings) · Social Posts → separate V1.1 child under #460
• Must NOT: Expose FPS / phone / private child sub-profiles on the Channel DOM · Add public “Pro-Bono Student” stigma badges · Ship photo feed / likes / comments / @tagging in this issue · Rewrite materials fee SoT ([Feature · V1 · #251] Digital materials: Stripe checkout, 2% fee, R2 download, 72h hold #543) or tutoring 1.5-lesson fee

1. Problem

Currently, MatchMax suffers from a fragmented profile experience:

• Internal vs. Public Mismatch: Tutors edit their data in an internal settings view that looks completely different from their public profile card/page, making it hard to visualize how parents see them.
• Siloed Credentials & Assets: Clicking a user/tutor card only shows basic tutoring fields. It does not act as a unified "YouTube Channel" housing everything they do on MatchMax—their published Study Materials/Notes, Date Joined, Verified Teaching/Learning Hours, Active Student Count, Academic CV ([Feature · V1 · #459] Lifelong Academic Records & Education CV #545), and Centre Affiliations.
• Missing Pro-Bono Capacity & Stigma-Free Matching: While Feature: MatchMax Impact (CSR Ecosystem Integration) #400 introduced the Pro-Bono concept, tutors cannot specify how many concurrent pro-bono/discounted cases they can take or display their active pro-bono slot count publicly, and students have no stigma-free way to signal eligibility for pro-bono/discounted rates when requesting a tutor.

2. Product lock

3. Exact behaviour (how it works)

A. Card-to-Channel Navigation & Owner vs. Public View

1. Universal Click-Through: Clicking any Tutor Card (in search results), Material Seller badge (on /en/materials), or Centre Faculty card navigates to the user's unified Channel Profile.
2. Identical Layout (Owner vs. Visitor):
   • When auth.uid() == profile.user_id, the page renders the exact public Channel Profile layout with a sticky top bar: Viewing your public channel · [ ✎ Edit Mode (ON) ] [ 👁 View as Visitor ].
   • In Edit Mode, each block (Bio, Pro-Bono Banner, Academic CV from [Feature · V1 · #459] Lifelong Academic Records & Education CV #545, Centre Affiliations) displays an inline [ ✎ Edit ] button opening its respective modal.
   • Strict Privacy Separation: Private data (phone number, email, HK FPS payout details, private child sub-profiles, internal admin risk flags) MUST NEVER render on the Channel Profile DOM; they remain strictly inside /en/account/settings or the Admin Drawer.

B. Concentrated Profile Metrics & Centre Affiliations

1. Header Metadata:
   • Display Name / Creator Alias, @handle, Avatar, Cover Banner, Verification Badges (Blue Tick Verified / Community Champion #400).
   • Joined Date: Joined Oct 2026 (於 2026年10月 加入) derived from profiles.created_at.
   • Centre Affiliation Pill:
     • A user can request an affiliation with a registered Partner Centre (centre_id, role_type: 'affiliated_tutor' | 'alumni_student').
     • If role_type == 'affiliated_tutor', status starts as pending until the Centre Admin clicks Approve in their Centre Workspace; once approved, displays 🏛 Affiliated Tutor at [Centre Name] (clickable to the Centre's page) and lists the tutor on the Centre's page.
     • If role_type == 'alumni_student', displays in the user's Academic Timeline (Studied at [Centre Name]).
2. Live Stats Ribbon (Auto-Calculated):
   • Verified Hours: Sum of confirmed teaching hours from the [Urgent · V1] Unified account + roles + child sub-profiles + hours ledger #459 ledger.
   • Active Cases / Students: Count of currently active tutoring cases (shows count only, e.g., 4 Active Students, never exposing student names).
   • Study Materials: Count of published notes/materials in the marketplace.
   • Pro-Bono Impact: Count of active/completed pro-bono cases + pro-bono hours.

C. Pro-Bono & Reduced-Rate Signalling Rules (No Student Stigma)

1. Tutor Supply Settings (Extending Feature: MatchMax Impact (CSR Ecosystem Integration) #400):
   • In Edit Mode, a tutor can configure their Impact & Pro-Bono Preferences:
     • accepts_pro_bono (boolean: $0 Free Tuition for financial-need students)
     • accepts_reduced_rate (boolean: Concessionary / Discounted Rate, with optional reduced_hourly_rate_hkd)
     • pro_bono_max_slots (integer 0–10, e.g., "I can take up to 2 pro-bono students at a time").
2. Public Signalling on Tutor Channel:
   • When accepts_pro_bono == true or accepts_reduced_rate == true, the tutor's card and profile display the Pro-Bono & Impact Card:
     • Shows capacity: e.g., 🌱 Pro-Bono Capacity: 1 of 2 Slots Active (1 Slot Open) (義教名額：進行中 1/2（尚餘 1 個名額）).
     • If active_pro_bono_cases >= pro_bono_max_slots, badge reads: 🌱 Pro-Bono Capacity Full (Currently teaching 2/2 pro-bono students) — giving the tutor public social proof for actively teaching pro-bono while preventing burnout from extra requests.
3. Student / Parent Demand Signalling (Strictly Private to Tutor & Staff):
   • Rule: There MUST NOT be a public "Pro-Bono Student" badge on any student's or child's public profile.
   • Instead, inside the Request / Book Tutor modal (when booking a tutor who has Pro-Bono/Reduced Rate enabled, or submitting a general case), the student/parent can check: [x] Apply for Pro-Bono / Financial Assistance Rate (申請義教或學費減免) and enter a brief private note (e.g., family/financial context or referral by school/NGO).
   • On the Tutor's incoming Case Lead Card, this renders a clear badge: [🌱 Pro-Bono / Access Request] ([🌱 義教／減免申請]) alongside [Parent Account] or [Independent Student].
   • Once the case becomes active at $0 (or concessionary rate), the system automatically increments the tutor's active_pro_bono_cases counter on their public profile.

4. UI / UX (how it looks and where it lives)

A. ASCII Wireframe — Unified Channel Profile (/en/u/[handle])

+-----------------------------------------------------------------------+
| [Owner Bar: Viewing Your Channel]  [✎ Edit Mode: ON] [👁 Public View] |
+-----------------------------------------------------------------------+
| [Cover Banner]                                                        |
| (Avatar)  Hauzton Chan  ✓ Blue Tick  🌱 Community Champion            |
|           @hauzton · Joined Aug 2026 · 🏛 Affiliated: Top Leader Ed    |
|           "HKU BBA · IB 42/45 · Specializing in HL Econ & Business"   |
|                                               [ Request Lesson ]      |
+-----------------------------------------------------------------------+
| 📊 128 Verified Hrs  | 👥 4 Active Students | 📚 3 Study Notes | 🌱 1/2 Pro-Bono |
+-----------------------------------------------------------------------+
| 🌱 Pro-Bono & Access Pledge                                    [✎]    |
| Welcomes Pro-Bono ($0) & Reduced-Rate students (HK$150/hr).           |
| Status: Currently teaching 1 Pro-Bono student · 1 Slot Available.     |
+-----------------------------------------------------------------------+
| Tabs: [ Overview & CV (5) ]  [ Study Materials (3) ]  [ Reviews (12) ]|
+-----------------------------------------------------------------------+
| (Tab 1: Overview & CV)                                                |
| • tutoring subjects, rates, MTR stations                              |
| • Public Academic & Achievement Timeline (from #545)                  |
|                                                                       |
| (Tab 2: Study Materials — Direct Buy Cards)                           |
| • [PDF] IB HL Economics Complete Notes · HK$100 · [Buy & Download]    |
+-----------------------------------------------------------------------+

B. Exact Copy (English + 繁中)

• Joined Date: Joined {month} {year} / 於 {year}年{month}月 加入
• Active Students Stat: {count} Active Students / {count} 位進行中學生
• Pro-Bono Capacity Open: Pro-Bono Welcome ({active}/{max} Slots Active — {open} Available) / 歡迎義教申請（進行中 {active}/{max} — 尚餘 {open} 個名額）
• Pro-Bono Capacity Full: Currently Teaching {active}/{max} Pro-Bono Students (Slots Full) / 現正為 {active}/{max} 位義教學生補習（名額已滿）
• Student Case Modal Checkbox: Request Pro-Bono ($0) or Reduced Rate (Visible only to the tutor & MatchMax staff) / 申請義教（$0）或學費減免（僅導師及平台管理員可見，絕不公開）

5. Logic & edge cases

6. Implementation notes

• Extend profiles / tutor_profiles with:
  • accepts_pro_bono (boolean, default false)
  • accepts_reduced_rate (boolean, default false)
  • reduced_hourly_rate_hkd (integer, nullable)
  • pro_bono_max_slots (integer, default 0)
• Create centre_affiliations table (id, user_id, centre_id, role_type: 'affiliated_tutor' | 'alumni_student', status: 'pending' | 'approved' | 'rejected', created_at).
• On cases, add is_pro_bono_request (boolean, default false) and rate_tier: 'standard' | 'reduced' | 'pro_bono'.
• Refactor the existing tutor profile view so the owner edit view and public visitor view share the exact same React layout component, conditionally rendering [ ✎ Edit ] controls when isOwner && !isPreviewingPublic.
• Verified Hours ribbon reads [Urgent · V1] Unified account + roles + child sub-profiles + hours ledger #459 ledger sum only (no manual edits).
• Study Materials tab lists published rows from [Feature · V1 · #251] Digital materials: Stripe checkout, 2% fee, R2 download, 72h hold #543 marketplace for that seller — do not fork checkout.

7. Acceptance criteria

• Clicking any tutor card or material seller name navigates to the unified Channel Profile showing Date Joined, Verified Hours, Active Students count, Academic CV ([Feature · V1 · #459] Lifelong Academic Records & Education CV #545), and published Study Materials tab.
• Viewing one's own Channel Profile renders the exact same layout as a public visitor, with a toggle to switch between Edit Mode and Public Preview, and exposes zero private settings (FPS, phone, child sub-profiles).
• A tutor can enable Pro-Bono / Reduced-Rate preferences and set a maximum concurrent slot limit (pro_bono_max_slots).
• Having an active pro-bono case publicly displays "Currently teaching X/Y pro-bono students" on the tutor's profile without revealing who the student is.
• A student/parent can privately check Request Pro-Bono / Reduced Rate when requesting a lesson, displaying a [🌱 Pro-Bono / Access Request] badge on the tutor's private case lead card without adding any stigma badge to the student's profile.
• A tutor can link a Centre affiliation (which goes live upon Centre approval).

8. Out of scope

• Public stigma badges on student profiles.
• Social photo feed, likes, comments, and @tagging (covered under [Parked Epic · under #459] Academic LinkedIn × Instagram Profile Overhaul #460 Social Posts child).
• Materials payment rails rewrite ([Feature · V1 · #251] Digital materials: Stripe checkout, 2% fee, R2 download, 72h hold #543 remains SoT).
• Full community global feed ([PARKED] Epic: community public posts — do not build in V1 #218 / Issue C7 — (community feature, stage 2) Feed and tag page, do not build yet #225 stay parked).

9. Test plan

1. Owner vs. Public Parity Test: Log in as Tutor A, open own Channel Profile, edit bio and Pro-Bono capacity inline (max_slots = 1), toggle Preview Public View, and compare with an incognito window—confirm layouts are 100% identical.
2. Pro-Bono Slot & Privacy Test: As Student B, submit a case request to Tutor A with Request Pro-Bono checked. Verify Tutor A sees [🌱 Pro-Bono / Access Request] on the lead card. Accept the case as active; verify Tutor A's public profile now reads 1/1 Pro-Bono Slots Active and Student B's profile has zero public pro-bono indicators.
3. Materials Tab Integration Test: Publish a study note as Tutor A; verify it appears automatically under the Study Materials tab on Tutor A's Channel Profile.

Addendum (2026-10-31): Centre Faculty Tab, Context-Aware Routing, Posts host note, Watermark/SEO

A. Our Tutors & Faculty (導師團隊) Tab

• On any Centre Channel Profile, add tab Our Tutors & Faculty / 導師團隊.
• Query: all users with centre_affiliations.centre_id = current_centre AND status = 'approved' AND role_type = 'affiliated_tutor'.
• Clicking a tutor card opens that tutor's independent Channel Profile (/en/u/[handle]).

B. Context-Aware Case Routing (CEO lock)

Why: tutors can freelance independently while also driving B2B centre business without channel conflict.

C. Posts & Media tab host (#549)

• When [Feature · V1.1 · #460] Social Channel Posts: photos, likes, comments, saves, shares & @tagging #549 ships, Channel tabs include Posts & Media hosting Grid/Feed + pin≤3.
• Overview & CV shows proof thumbnails from posts linked via linked_academic_record_id ([Feature · V1.1 · #460] Social Channel Posts: photos, likes, comments, saves, shares & @tagging #549 ↔ [Feature · V1 · #459] Lifelong Academic Records & Education CV #545).

D. Watermark & SEO (shared with #549 / #543)

• Post photos and material previews: auto-watermark MatchMax logo + @handle bottom-right.
• Overview & CV / non-commercial channel pages: noindex,nofollow by default.
• Settings: Allow search engines to index my public profile — default off Learning Mode; default on Verified Tutors & Centres.

Additional acceptance criteria

• Centre Channel shows Faculty tab listing approved affiliated tutors.
• Request Lesson from independent tutor profile → tutor inbox.
• Request Lesson from Centre Faculty context → centre inbox with Requested Tutor tag.
• SEO toggle + watermark behaviour documented and implemented per locks above (watermark may land with [Feature · V1.1 · #460] Social Channel Posts: photos, likes, comments, saves, shares & @tagging #549/[Feature · V1 · #251] Digital materials: Stripe checkout, 2% fee, R2 download, 72h hold #543 media pipeline).

ADOPTED addendum (2026-10-31 · CEO review enhancements)

Preview tooltip (ship with V1)

• Next to [ 👁 Preview Public View ] / [ 👁 View as Visitor ], show a short tooltip / helper:
  • EN: How parents see this — private settings (phone, FPS, child profiles) stay hidden.
  • 繁中: 家長所見畫面 — 電話、FPS、子女檔案等私密設定不會顯示。
• Purpose: tutors immediately understand Edit Mode vs Public Preview without leaving the channel.

Stats ribbon — public vs owner-only (one-line lock)

Ship order note: #548 first unblocks #549 (Posts tab host) and #551 (availability grid on Overview).

Additional AC

• Preview Public View control has “How parents see this” helper tooltip (EN+繁中).
• Header/stats ribbon documents public vs owner-only stats per table above (eng + UI copy).