User Profile Features
เจาะลึกทุกกลไกภายในหน้า Profile ของผู้ใช้งาน ตั้งแต่ระบบยืนยันตัวตนแบบไฮบริด ไปจนถึงระบบจัดการข้อพิพาทและศูนย์รายได้จากพันธมิตร (Affiliate)
Insanely Detailed Features
40+ Points of Interest1. Hybrid Authentication Logic
แกนหลักการระบุตัวตนแบบควบคู่ (Web2 + Web3)
Supabase Native
ใช้ supabase.auth.getUser() เพื่อดึงข้อมูลผู้ใช้ที่ล็อกอินด้วยอีเมล/รหัสผ่าน
Wallet Identity
ตรวจสอบ 'user_wallet' จาก localStorage เพื่อระบุตัวตนผู้ใช้ระดับ Web3 (Metamask/Safe)
Profile Lookup
ทำการ Cross-match ระหว่าง Auth ID หรือ Wallet Address กับตาราง 'profiles' ในฐานข้อมูล
Security Guard
ระบบ Redirect อัตโนมัติ: หากไม่พบทั้ง Session และ Wallet จะถูกส่งไปหน้า /login ทันที
2. Visual Membership Hierarchy
ระบบชนชั้นสมาชิกและสิทธิพิเศษเชิงภาพลักษณ์
Tier Styles
6 ระดับ: Bronze (Deer), Silver (Wolf), Gold (Phoenix), Platinum (Unicorn), Rare Earth (Dragon), Bitcoin (Lion)
Dynamic Card UI
ใช้ฟังก์ชัน getTierStyle เพื่อเปลี่ยนสี Gradient, แอนิเมชัน และไอคอนตามระดับสมาชิกแบบ Real-time
Verification Status
Badges แสดงสถานะ: 'Identity Verified (KYC)' สำหรับคนผ่านยืนยันตัวตน และ 'Email Verified' สำหรับคนยืนยันอีเมล
Tier Up Logic
ระดับสมาชิกจะถูกอัปเดตอัตโนมัติจากหลังบ้านตามยอดการสั่งซื้อสะสม (Total Spent)
3. Avatar Customization Engine
ระบบสร้างและจัดการตัวตนเสมือน
DiceBear Integration
เชื่อมต่อกับ api.dicebear.com เพื่อสร้าง SVG Avatar ตามสไตล์ต่างๆ (Avataaars, Bottts, etc.)
Seed Generation
ระบบ Randomize Seed เพื่อให้ผู้ใช้สามารถสุ่มเลือกรูปแบบที่พอใจได้ไม่จำกัด
Custom Upload
รองรับการอัปโหลดไฟล์ภาพจริง (.jpg, .png) จำกัดขนาด 2MB ต่อไฟล์ เก็บในบักเก็ต 'avatars'
Persistence
รูปโปรไฟล์จะถูกบันทึกลงฟิลด์ avatar_url ในโปรไฟล์ เพื่อใช้แสดงผลถาวรทั่วทั้งเว็บไซต์
4. Personal Info & Metadata
การจัดการข้อมูลพื้นฐานและฐานข้อมูลส่วนบุคคล
Full Name Split
ระบะจัดการแยกชื่อ-นามสกุล และรวมเข้าด้วยกันเพื่อเก็บในฟิลด์ full_name อัตโนมัติ
Tax Identification
ฟิลด์ Tax ID สำหรับใช้ในการออกใบกำกับภาษีหรือทำธุรกรรมที่เป็นทางการ
Gender & DOB
เก็บข้อมูลเพศและวันเกิดเพื่อใช้ในการคัดกรองโปรโมชันหรือวิเคราะห์ข้อมูลลูกค้า (Analytic segments)
Bio Summary
พื้นที่สำหรับใส่คำแนะนำตัวสั้นๆ เพื่อแสดงผลในระบบ Community หรือหน้า Profile สาธารณะในอนาคต
5. Smart Address Management
ระบบจัดการที่อยู่จัดส่งอัจฉริยะ
Multiple Entries
ผู้ใช้สามารถเพิ่มที่อยู่บ้าน, ที่ทำงาน หรือที่อยู่เพื่อนได้หลายรายการ (Unlimited entries)
Set as Default
ระบบป้องกันความผิดพลาด: การตั้งค่าที่อยู่หลักจะไปยกเลิก is_default ของที่อยู่อื่นให้อัตโนมัติ
Validation Logic
ฟอร์มบังคับใส่ข้อมูลที่จำเป็นครบถ้วน: ชื่อผู้รับ, เบอร์โทร, รพัสไปรษณีย์ และรายละเอียดที่อยู่
Edit/Delete Flow
ระบบ Modal แก้ไขที่อยู่แบบ In-place ไม่ต้องโหลดหน้าใหม่ (No-reload UI)
6. Order Lifecycle & Fulfillment
ประวัติการสั่งซื้อและสถานะการจัดส่ง
Automated Sync
รัน rpc 'check_order_automations' ทุกครั้งที่โหลดหน้าประวัติเพื่อซิงก์สถานะล่าสุดจาก Gateway
Rich Order Items
ดึงรูปภาพและชื่อสินค้าจาก Metadata ของสินค้าจริงมาแสดงแม้ในประวัติย้อนหลัง
Shipping Linkage
แสดง Tracking Number พร้อมระบุ Shipping Provider (Kerry, Flash, EMS) อย่างชัดเจน
Receipt Confirmation
ปุ่ม 'Confirm Receipt' สำหรับผู้ใช้เพื่อยืนยันการรับของ ซึ่งจะไปกระตุ้นการคำนวณคะแนน/Tier
7. Customer Satisfaction Review
ระบบให้คะแนนสินค้า (Post-Purchase Feedback)
Dynamic Star Rating
ใช้ Interactive Star UI ให้ผู้ใช้เลือก 1-5 ดาว พร้อมคำอธิบายความพึงพอใจ
Variant-base Link
ระบบฉลาดพอที่จะ Clean Product ID (ตัด Variant ออก) เพื่อให้คะแนนรวมไปอยู่ที่สินค้าหลัก
Anti-re-review
เช็คสถานะ hasReviewed ในแต่ละรายการสินค้าเพื่อปิดปุ่มรีวิวหากทำไปแล้ว
Real-time Display
รีวิวที่บันทึกแล้วจะมีผลต่อคะแนนเฉลี่ยหน้าสินค้า (Product Page) ทันที
8. Dispute & Escrow Protection
ศูนย์ช่วยเหลือและแจ้งปัญหาออเดอร์
Guided Dispute
หมวดหมู่ปัญหา: ไม่ได้รับสินค้า (Not Received), สินค้าเสียหาย (Damaged), ได้ไม่ตรงปก (Wrong Item)
Evidence Collection
จุดอัปโหลดไฟล์หลักฐาน (Evidence Images) จำกัด 3 รูป เก็บในบักเก็ต 'chat-images' เพื่อความเป็นส่วนตัว
Resolution Status
ออเดอร์จะถูกล็อกสถานะเป็น 'dispute' ทันที ทำให้แอดมินรู้ว่าห้ามโอนเงินให้ผู้ขาย (Escrow Logic)
Admin Alerts
เมื่อเปิด Dispute ระบบจะส่งสัญญาณเตือนไปยัง Admin Dashboard เพื่อให้เข้ามาดูแลแบบเร่งด่วน
9. Affiliate Revenue & Payouts
ศูนย์สร้างรายได้จากการแนะนำ (Partnership)
Real-time Stats
Dashboard สรุป: จำนวนผู้สมัครผ่านลิงก์ (Referral Count), ยอดขายรวม และรายได้คอมมิชชันสะสม
payout Tiers
แยกยอดเงินคอมมิชชันตามสถานะ: Pending (รอตรวจ), Approved (อนุมัติแล้ว), Paid (จ่ายแล้ว)
Request Withdrawal
ปุ่มถอนเงินสำหรับยอดที่ 'Approved' โดยจะส่งลิงก์พร้อมข้อความอัตโนมัติไปหาแอดมินทาง Telegram
Withdrawal Cooldown
ล็อคการถอนเงิน 24 ชั่วโมงต่อครั้งเพื่อความปลอดภัยและป้องกันการสแปมระบบ
10. Integrated Chat Center
ระบบสื่อสารสดกับฝ่ายสนับสนุน (Concierge)
Persistence Chat
ประวัติการแชทถูกเก็บไว้ใน Database ทำให้สามารถคุยต่อเนื่องได้แม้จะย้ายเครื่อง
File/Image Support
รองรับการส่งรูปหลักฐานและ Attachment ต่างๆ ผ่าน UI แชทที่ทำความสะอาดมาอย่างดี
Order Referencing
สามารถเลือก 'แนบเลขที่ใบสั่งซื้อ' ไปในแชทเพื่อให้แอดมินตรวจสอบข้อมูลได้รวดเร็วขึ้น
Emoji & Stickers
ระบบ Emoji Picker และ Sticker Gallery ที่ช่วยสร้างบรรยากาศที่ดีในการรับบริการ
/ Data Flow & States
State Store
เก็บ User Context ไว้ใน React State เพื่อลดการยิง API ซ้ำซ้อน (Caching mechanism locally)
RLS Policies
ข้อมูลทุกส่วนถูกป้องกันด้วย Row Level Security (RLS) ทำให้ผู้ใช้ดึงได้เฉพาะข้อมูลของตัวเองเท่านั้น
Asset Buckets
จัดสรร 'avatars' และ 'chat-images' แยกออกจากกันชัดเจนเพื่อจัดการนโยบายการเข้าถึงไฟล์ต่างกัน