Satyam
d3d6af33cc
Light mode — Energetic & Clean (Duolingo/fitness app aesthetic): - GlassPanel rebuilt as function component using useTheme; light mode gets solid colored header banners per panel (gold=Showdown, fire=Hot Streak, cyan=Weekly, blue=Stats/Leaderboard, purple=Rewards/Badges) with white text on color; dark mode keeps existing glass panel + accent glow line - Page background: zinc-100/80 so white cards float visually - Event cards (Showdown, Hot Streak, 12 Appointments) promoted to use GlassPanel title+icon props — each gets its own colored identity banner - OperatorCard: soft shadow + amber ring in light mode; stays dark (sports card aesthetic intentional); harsh rgba(0,0,0,0.6) shadow removed - Live Event Banner: vibrant emerald-600→green-700 gradient in light mode replacing the always-dark green-900; softer shadow and border - Log Action buttons: clean bg-white with shadow-sm, removed dark inset shadow that made them look dirty in light mode - Neon/cyan on white fixed: #AAFF00→green-600, #00E5FF→sky-500/sky-600 - EnergyBar tracks: bg-zinc-200 in light, bg-black/60 in dark - Leaderboard, badge cards, reward nodes: all adapted with dark: variants - XP badge in header: bg-zinc-100/border-zinc-200 in light mode - Import useTheme added to support GlassPanel and OperatorCard hooks Dark mode — unchanged; all existing glass panel aesthetics preserved.
Plano Realty CRM - Geospatial Field Service Platform
The Next Generation of Roofing Sales & Territory Management
Plano Realty CRM is an advanced, data-driven platform designed to revolutionize how roofing professionals in Plano, Texas manage their territories, leads, and customer interactions. By combining geospatial intelligence, AI-driven insights, and intuitive workflows, we bridge the gap between field agents and office operations.
🏛️ PART 1: PRODUCT OVERVIEW
🌟 Value Proposition
In a competitive roofing market, speed and data are everything. Traditional spreadsheets and paper maps leave money on the table. Plano Realty CRM solves this by providing:
- Precision Targeting: Identify "Golden Leads" (older homes with high value) instantly on a map.
- Operational Efficiency: Automate scheduling and follow-ups with our AI Concierge.
- Real-Time Intelligence: Know the storm risk and roof condition of every property before you knock.
🤖 The "Plano AI Concierge" (Upgrade)
Our AI is now a full-fledged Sales & Support Engine:
- For Guests: Acts as a "Seasoned Consultant" to triage emergencies (leaks) vs. sales (inspections). "Hook" logic converts casual visitors into leads.
- For Employees: Answers complex queries like “What is my win rate this month?” or “Show me the average home value in this zip code.”
- For Admins: Provides instant summaries of urgent actions (Unassigned Leads, Pending Signatures) and business health.
- For Customers: Dynamic logic checks warranty status based on build year and offers personalized maintenance tips.
📊 The Data Dashboard
A 360-degree view of your territory's health.
- Admin Action Center: A dedicated command center for managers to assign leads, approve schedules, and track urgent tasks.
- Golden Leads Scatter Plot: Visualizes high-value opportunities (High Value + Older Built Year).
- Risk Index Gauge: A real-time meter combining live wind speed data with the percentage of "Needs Repair" roofs.
- Revenue Potential: Bar charts showing which neighborhoods offer the highest ROI based on renovation needs.
- Roof Health: A visual breakdown of the entire territory's roof conditions (Good, Fair, Needs Repair).
🎨 KEY FEATURES (Latest Updates)
1. "LynkedUp Pro" Branding & UX
- Glassmorphism UI: A premium, dark-mode-first aesthetic with "Spotlight" cards that glow on hover.
- Smooth Animations: Global page transitions (Fade/Slide) and silky-smooth collapsible sidebar.
- System-Wide Dark Mode: Inverted map tiles and high-contrast text for comfortable night viewing.
2. Admin Action Center (NEW)
- Unassigned Leads: Instant visibility into new opportunities that need an owner.
- Hot Leads: Track high-value prospects that haven't been contacted in >7 days.
- Smart Assignment: "One-click" agent assignment with a searchable modal.
- Urgency Counters: visual badges highlighting pending signatures and reschedule requests.
3. Advanced Geospatial Mapping
- Interactive Polygons: Color-coded property footprints (Red=Hot Lead, Blue=Customer).
- Reverse Geocoding: Click anywhere on the map to create a new property record instantly using OpenStreetMap data.
4. Role-Based Access Control (RBAC)
- Field Agents: View assigned territories, update lead status, and request schedule changes.
- Admins: Global view of all agents, approval workflows, and system settings.
- Customers: (Coming Soon) Portal to view project status and request service.
5. Enterprise-Grade Reliability (NEW)
- Resilient AI: Chatbot restores user input on network failure, preventing frustration.
- Global Error Boundaries: Catches unexpected crashes and offers a graceful "Reload" option.
- Visual Feedback: Comprehensive toast notifications for all data actions (Success/Error states).
👥 USER ROLES & DEMO ACCOUNTS
To explore the platform, use these pre-configured accounts. Password for ALL accounts is: password
1. Field Agent (Worker)
The primary user. Can view maps, access detailed property data, and manage leads.
- Username/ID:
FA001(Frank Agent) - Alternates:
FA002,FA003,FA004,FA005
2. Administrator
The manager. Sees all agents, global stats, and the Action Center.
- Username/ID:
ADM01(Adam Admin) - Alternates:
ADM02,ADM03
3. Customer (Homeowner)
The client. Limited view of their own property.
- Username:
alice - Alternates:
bob,charlie
💻 PART 2: DEVELOPER GUIDE
🛠 Tech Stack & Architecture
- Frontend: React 18 (Vite), Tailwind CSS, Glassmorphism UI.
- State:
MockStore(Simulates Backend/DB),AuthContext(Session Management). - AI Engine: Groq SDK (
qwen-32b) injected with dynamic system prompts. - Visuals:
react-leaflet(Maps),recharts(Analytics),lucide-react(Icons). - Reliability:
sonner(Toasts), Error Boundaries, Layout Portals.
🚀 Setup & Contribution
- Clone:
git clone <repo> - Install:
pnpm install - Env: Create
.envwithVITE_GROQ_API_KEYandVITE_OPENWEATHER_API_KEY. - Run:
pnpm run dev
Maintained by Satyam Rastogi