Redesign Team, Support, AI & Rules; solid-orange brand system

- Team Management: crew hero, member gallery + list, role rings, invites
- Support Center: command-center Overview (live status, pulse ribbon, signal)
- AI Assistant: animated orb rings + textured stage
- Rules: rulebook cards (watermark, uniform orange), 3-up responsive grid
- Brand: --grad-brand now solid rgba(253,169,19,.92), white text/icons on
  orange, no orange gradients; dark surfaces (--card-grad/--panel-2) #060608
- Segmented tabs get an on-brand orange active state

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-06-30 14:40:29 +05:30
parent d7eb82f182
commit 0b76c97445
10 changed files with 2045 additions and 758 deletions
+169
View File
@@ -0,0 +1,169 @@
// ============================================================
// LynkedUp Pro — Team Management mock data.
// Members, roles and a permission matrix, modelled the way a
// CRM team module works: every member carries a role, and a
// role is a named bundle of permissions. All client-side so the
// screen is fully interactive without a backend.
// ============================================================
/* ---------------------------------------------------------- */
/* PERMISSIONS — grouped, the building blocks of a role */
/* ---------------------------------------------------------- */
export type Permission = { id: string; label: string; desc: string };
export type PermissionGroup = { id: string; title: string; icon: string; perms: Permission[] };
export const permissionGroups: PermissionGroup[] = [
{
id: "sales",
title: "Sales",
icon: "pipeline",
perms: [
{ id: "leads.manage", label: "Manage leads & contacts", desc: "Create, edit, assign and delete leads" },
{ id: "pipeline.manage", label: "Manage pipeline & deals", desc: "Move deals across stages and edit values" },
{ id: "estimates.create", label: "Create estimates & proposals", desc: "Build and send estimates to owners" },
],
},
{
id: "ops",
title: "Operations",
icon: "dispatch",
perms: [
{ id: "dispatch.manage", label: "Manage dispatch & schedule", desc: "Assign crews and schedule site visits" },
{ id: "billing.view", label: "View billing & invoices", desc: "See invoices, receipts and payment status" },
],
},
{
id: "insights",
title: "Insights",
icon: "leaderboard",
perms: [
{ id: "reports.view", label: "View reports & analytics", desc: "Access dashboards and export reports" },
],
},
{
id: "admin",
title: "Administration",
icon: "settings",
perms: [
{ id: "team.manage", label: "Manage team members", desc: "Invite, edit and deactivate members" },
{ id: "roles.manage", label: "Manage roles & permissions", desc: "Create roles and edit permission sets" },
{ id: "settings.manage", label: "Manage org settings", desc: "Billing plan, branding and integrations" },
],
},
];
export const allPermissionIds: string[] = permissionGroups.flatMap((g) => g.perms.map((p) => p.id));
/* ---------------------------------------------------------- */
/* ROLES — named permission bundles */
/* ---------------------------------------------------------- */
export type Role = {
id: string;
name: string;
color: string; // token, e.g. var(--orange)
description: string;
system: boolean; // system roles can't be deleted
perms: string[]; // granted permission ids
};
export const roles: Role[] = [
{
id: "owner",
name: "Owner",
color: "var(--orange)",
description: "Full, unrestricted access. There is exactly one account owner.",
system: true,
perms: [...allPermissionIds],
},
{
id: "admin",
name: "Admin",
color: "var(--purple)",
description: "Runs the workspace — manages people, roles and settings.",
system: true,
perms: [...allPermissionIds],
},
{
id: "manager",
name: "Sales Manager",
color: "var(--blue)",
description: "Leads the sales floor and oversees the crew's pipeline.",
system: false,
perms: ["leads.manage", "pipeline.manage", "estimates.create", "dispatch.manage", "billing.view", "reports.view", "team.manage"],
},
{
id: "rep",
name: "Sales Rep",
color: "var(--green)",
description: "Works leads and moves deals through the pipeline.",
system: false,
perms: ["leads.manage", "pipeline.manage", "estimates.create"],
},
{
id: "dispatcher",
name: "Dispatcher",
color: "var(--cyan)",
description: "Schedules crews and coordinates site visits.",
system: false,
perms: ["dispatch.manage", "reports.view"],
},
{
id: "estimator",
name: "Estimator",
color: "var(--yellow)",
description: "Prepares estimates and proposals for approved leads.",
system: false,
perms: ["leads.manage", "estimates.create"],
},
{
id: "viewer",
name: "Viewer",
color: "var(--muted)",
description: "Read-only access to reports and billing — no edits.",
system: false,
perms: ["reports.view", "billing.view"],
},
];
/* ---------------------------------------------------------- */
/* MEMBERS */
/* ---------------------------------------------------------- */
export type MemberStatus = "active" | "away" | "offline";
export type Member = {
id: string;
name: string;
initials: string;
email: string;
title: string; // job title, free text
roleId: string;
gradient: string;
status: MemberStatus;
lastActive: string;
deals: number; // open deals owned
joined: string;
};
export const members: Member[] = [
{ id: "u1", name: "James Carter", initials: "JC", email: "james.carter@lynkeduppro.com", title: "Founder & CEO", roleId: "owner", gradient: "linear-gradient(135deg,#fda913,#fd6d13)", status: "active", lastActive: "Active now", deals: 12, joined: "Mar 2021" },
{ id: "u2", name: "Emma Wilson", initials: "EW", email: "emma.wilson@lynkeduppro.com", title: "Head of Sales", roleId: "manager", gradient: "linear-gradient(135deg,#285ef0,#09b9c6)", status: "active", lastActive: "Active now", deals: 21, joined: "Aug 2021" },
{ id: "u3", name: "Liam Foster", initials: "LF", email: "liam.foster@lynkeduppro.com", title: "Senior Sales Rep", roleId: "rep", gradient: "linear-gradient(135deg,#9036e9,#285ef0)", status: "active", lastActive: "5 min ago", deals: 17, joined: "Jan 2022" },
{ id: "u4", name: "Sophie Turner", initials: "ST", email: "sophie.turner@lynkeduppro.com", title: "Account Executive", roleId: "rep", gradient: "linear-gradient(135deg,#14bc83,#09b9c6)", status: "away", lastActive: "32 min ago", deals: 9, joined: "May 2022" },
{ id: "u5", name: "Noah Mitchell", initials: "NM", email: "noah.mitchell@lynkeduppro.com", title: "Dispatch Coordinator", roleId: "dispatcher", gradient: "linear-gradient(135deg,#f0563f,#fda913)", status: "active", lastActive: "Active now", deals: 0, joined: "Sep 2022" },
{ id: "u6", name: "Olivia Bennett", initials: "OB", email: "olivia.bennett@lynkeduppro.com", title: "Operations Lead", roleId: "admin", gradient: "linear-gradient(135deg,#09b9c6,#285ef0)", status: "away", lastActive: "1 hour ago", deals: 3, joined: "Nov 2021" },
{ id: "u7", name: "Ethan Brooks", initials: "EB", email: "ethan.brooks@lynkeduppro.com", title: "Lead Estimator", roleId: "estimator", gradient: "linear-gradient(135deg,#ffd60a,#fda913)", status: "offline", lastActive: "Yesterday", deals: 6, joined: "Feb 2023" },
{ id: "u8", name: "Ava Reynolds", initials: "AR", email: "ava.reynolds@lynkeduppro.com", title: "Finance Analyst", roleId: "viewer", gradient: "linear-gradient(135deg,#9036e9,#f0563f)", status: "offline", lastActive: "2 days ago", deals: 0, joined: "Apr 2023" },
];
/* ---------------------------------------------------------- */
/* PENDING INVITES */
/* ---------------------------------------------------------- */
export type Invite = { id: string; email: string; roleId: string; invitedBy: string; sentAt: string };
export const pendingInvites: Invite[] = [
{ id: "inv1", email: "daniel.hughes@gmail.com", roleId: "rep", invitedBy: "Emma Wilson", sentAt: "2 days ago" },
{ id: "inv2", email: "grace.murphy@outlook.com", roleId: "estimator", invitedBy: "James Carter", sentAt: "5 days ago" },
];