feat(ui): refactor gamification UI for role awareness and remove floaters
This commit is contained in:
@@ -13,7 +13,7 @@ const LEVEL_THRESHOLDS = [
|
||||
{ level: 10, xp: 100000, title: 'Legend' }
|
||||
];
|
||||
|
||||
export const useGamification = (user) => {
|
||||
export const useGamification = (user, role = 'FIELD_AGENT') => {
|
||||
return useMemo(() => {
|
||||
if (!user) return null;
|
||||
|
||||
@@ -48,32 +48,47 @@ export const useGamification = (user) => {
|
||||
}
|
||||
|
||||
// --- PHASE 3: CHECKPOINTS & STAGES ---
|
||||
const STAGES = [
|
||||
{
|
||||
id: 1,
|
||||
title: "Stage 1: Groundwork",
|
||||
requirement: { type: "doorsKnocked", amount: 20 },
|
||||
reward: { type: "coupon", name: "$25 Uber Eats Card", icon: "uber" },
|
||||
progress: Math.min((user.doorsKnocked || 0), 20),
|
||||
goal: 20
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Stage 2: Connections",
|
||||
requirement: { type: "appointmentsSet", amount: 10 },
|
||||
reward: { type: "giftcard", name: "$50 Amazon Card", icon: "amazon" },
|
||||
progress: Math.min((user.appointmentsSet || 0), 10),
|
||||
goal: 10
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "Stage 3: Rainmaker",
|
||||
requirement: { type: "leadsGained", amount: 25 },
|
||||
reward: { type: "cash", name: "$150 Performance Bonus", icon: "cash" },
|
||||
progress: Math.min((user.leadsGained || 0), 25),
|
||||
goal: 25
|
||||
}
|
||||
];
|
||||
let STAGES = [];
|
||||
if (role === 'OWNER') {
|
||||
STAGES = [
|
||||
{ id: 1, title: "Q1 Launch", requirement: { type: "onboarding", amount: 3 }, reward: { type: "coupon", name: "Territory Expansion", icon: "map" }, progress: 1, goal: 3 },
|
||||
{ id: 2, title: "Market Domination", requirement: { type: "revenue", amount: 100 }, reward: { type: "giftcard", name: "Executive Suite Unlock", icon: "star" }, progress: 85, goal: 100 },
|
||||
{ id: 3, title: "Empire Builder", requirement: { type: "deals", amount: 50 }, reward: { type: "cash", name: "Profit Share Tier 2", icon: "cash" }, progress: 20, goal: 50 }
|
||||
];
|
||||
} else if (role === 'ADMIN') {
|
||||
STAGES = [
|
||||
{ id: 1, title: "Squad Setup", requirement: { type: "recruits", amount: 5 }, reward: { type: "coupon", name: "Team Bonus Unlock", icon: "users" }, progress: 3, goal: 5 },
|
||||
{ id: 2, title: "Territory Control", requirement: { type: "regions", amount: 4 }, reward: { type: "giftcard", name: "Admin Power-Up", icon: "zap" }, progress: 4, goal: 4 },
|
||||
{ id: 3, title: "Regional Manager", requirement: { type: "sales", amount: 20 }, reward: { type: "cash", name: "Override Commission", icon: "cash" }, progress: 12, goal: 20 }
|
||||
];
|
||||
} else {
|
||||
STAGES = [
|
||||
{
|
||||
id: 1,
|
||||
title: "Stage 1: Groundwork",
|
||||
requirement: { type: "doorsKnocked", amount: 20 },
|
||||
reward: { type: "coupon", name: "$25 Uber Eats Card", icon: "uber" },
|
||||
progress: Math.min((user.doorsKnocked || 0), 20),
|
||||
goal: 20
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Stage 2: Connections",
|
||||
requirement: { type: "appointmentsSet", amount: 10 },
|
||||
reward: { type: "giftcard", name: "$50 Amazon Card", icon: "amazon" },
|
||||
progress: Math.min((user.appointmentsSet || 0), 10),
|
||||
goal: 10
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "Stage 3: Rainmaker",
|
||||
requirement: { type: "leadsGained", amount: 25 },
|
||||
reward: { type: "cash", name: "$150 Performance Bonus", icon: "cash" },
|
||||
progress: Math.min((user.leadsGained || 0), 25),
|
||||
goal: 25
|
||||
}
|
||||
];
|
||||
}
|
||||
|
||||
// Determine lock states
|
||||
const stages = STAGES.map((s, idx) => {
|
||||
|
||||
Reference in New Issue
Block a user