docs: update README for Lead Creation all 8 phases complete
Author: Satyam Rastogi
This commit is contained in:
@@ -35,13 +35,17 @@
|
|||||||
- Financial Summary sidebar with adjustable margin slider
|
- Financial Summary sidebar with adjustable margin slider
|
||||||
- Full light/dark theme support
|
- Full light/dark theme support
|
||||||
|
|
||||||
### Lead Creation Page _(Phases 1–4 complete, Phases 5–8 remaining)_
|
### Lead Creation Page _(All 8 phases complete)_
|
||||||
- Quick Capture (essential fields only) for agents at the door; Full Form for the office
|
- Quick Capture (essential fields only) for agents at the door; Full Form for the office
|
||||||
- 5 color-coded accordion sections: Contact (blue), Property (emerald), Job Details (amber), Insurance (purple), Assignment (cyan)
|
- 5 color-coded accordion sections: Contact (blue), Property (emerald), Job Details (amber), Insurance (purple), Assignment (cyan)
|
||||||
- **Custom portaled dropdowns** (`LeadCustomSelect`) — dark zinc-900 panel, fully scrollable, escapes all `overflow:hidden` containers via `ReactDOM.createPortal`; scroll detection uses `e.composedPath()` for reliability across browsers and touch
|
- **Custom portaled dropdowns** (`LeadCustomSelect`) — dark zinc-900 panel, fully scrollable, escapes all `overflow:hidden` containers via `ReactDOM.createPortal`; scroll detection uses `e.composedPath()` for reliability across browsers and touch
|
||||||
- **Fuzzy-search state combobox** (`LeadCombobox`) — type "tex" to find Texas, searches both abbreviation and full state name simultaneously
|
- **Fuzzy-search state combobox** (`LeadCombobox`) — type "tex" to find Texas, searches both abbreviation and full state name simultaneously
|
||||||
- **Flex-wrapper icon pattern** for Phone/MapPin icons — eliminates z-index conflicts, icons are true flex siblings of the input
|
- **Flex-wrapper icon pattern** for Phone/MapPin icons — eliminates z-index conflicts, icons are true flex siblings of the input
|
||||||
- Animated progress bar (GSAP), section completion check marks, spring height animations (Framer Motion)
|
- **Insurance section** — carrier, claim number, claim status, adjuster name/phone, policy number (purple accent)
|
||||||
|
- **Assignment section** — role-aware rep selector (agents: self-assign toggle; admins/owners: full scrollable agent list), priority pill (Low/Medium/High), follow-up date picker (cyan accent)
|
||||||
|
- **Save action** — validates required fields, Sonner toast on success/failure, redirects to Leads list
|
||||||
|
- **Leads list page** (`/emp/fa/leads`) — card list with urgency/status badges, search bar, animated empty state
|
||||||
|
- Animated progress bar (GSAP), section completion checkmarks, spring height animations (Framer Motion)
|
||||||
- Mobile-first: sticky Save footer, responsive City/State/ZIP grid layout, ample bottom padding for footer clearance
|
- Mobile-first: sticky Save footer, responsive City/State/ZIP grid layout, ample bottom padding for footer clearance
|
||||||
|
|
||||||
### LynkDispatch AI _(investor demo — in development)_
|
### LynkDispatch AI _(investor demo — in development)_
|
||||||
@@ -125,29 +129,32 @@ All select fields in the Lead Creation form use custom components rather than na
|
|||||||
```
|
```
|
||||||
src/
|
src/
|
||||||
├── pages/
|
├── pages/
|
||||||
│ ├── CreateLeadPage.jsx # Lead creation orchestrator (form state, sections, progress)
|
│ ├── CreateLeadPage.jsx # Lead creation orchestrator (form state, sections, progress, save)
|
||||||
|
│ ├── LeadsListPage.jsx # Leads list with search, cards, empty state
|
||||||
│ └── ... # Other role pages
|
│ └── ... # Other role pages
|
||||||
├── components/
|
├── components/
|
||||||
│ ├── leads/
|
│ ├── leads/
|
||||||
│ │ ├── LeadSectionWrapper.jsx # Collapsible accordion with spring animation
|
│ │ ├── LeadSectionWrapper.jsx # Collapsible accordion with spring animation
|
||||||
│ │ ├── LeadContactSection.jsx # Name, dynamic phone rows, dynamic email rows
|
│ │ ├── LeadContactSection.jsx # Name, dynamic phone rows, dynamic email rows
|
||||||
│ │ ├── LeadPropertySection.jsx # Address, city/state/zip, property type, site photos
|
│ │ ├── LeadPropertySection.jsx # Address, city/state/zip, property type, site photos
|
||||||
│ │ ├── LeadJobSection.jsx # Lead source, type, work/trade type, urgency, notes
|
│ │ ├── LeadJobSection.jsx # Lead source, type, work/trade type, urgency, notes
|
||||||
│ │ ├── LeadCustomSelect.jsx # Portaled custom dropdown (accent + compact modes)
|
│ │ ├── LeadInsuranceSection.jsx # Carrier, claim #/status, adjuster name/phone, policy #
|
||||||
│ │ ├── LeadCombobox.jsx # Fuzzy-search combobox for state field
|
│ │ ├── LeadAssignmentSection.jsx # Role-aware rep selector, priority pill, follow-up date
|
||||||
│ │ ├── UrgencyPillSelector.jsx # Sliding pill with Framer Motion layoutId
|
│ │ ├── LeadCustomSelect.jsx # Portaled custom dropdown (accent + compact modes)
|
||||||
│ │ ├── PhoneEntryRow.jsx # Phone input with mask, type picker, primary star
|
│ │ ├── LeadCombobox.jsx # Fuzzy-search combobox for state field
|
||||||
│ │ └── EmailEntryRow.jsx # Email input with type picker, primary star
|
│ │ ├── UrgencyPillSelector.jsx # Sliding pill with Framer Motion layoutId
|
||||||
|
│ │ ├── PhoneEntryRow.jsx # Phone input with mask, type picker, primary star
|
||||||
|
│ │ └── EmailEntryRow.jsx # Email input with type picker, primary star
|
||||||
│ ├── estimates/ # EstimateBuilder modals
|
│ ├── estimates/ # EstimateBuilder modals
|
||||||
│ ├── dispatch/ # LynkDispatch AI panels (in development)
|
│ ├── dispatch/ # LynkDispatch AI panels (in development)
|
||||||
│ ├── dashboard/ # Admin dashboard widgets
|
│ ├── dashboard/ # Admin dashboard widgets
|
||||||
│ └── ... # Layout, AnimatedCounter, shared components
|
│ └── ... # Layout, AnimatedCounter, shared components
|
||||||
├── context/ # AuthContext, ThemeContext, GamificationContext
|
├── context/ # AuthContext, ThemeContext, GamificationContext
|
||||||
├── data/
|
├── data/
|
||||||
│ └── mockStore.jsx # Central data layer + LEAD_FORM_OPTIONS
|
│ └── mockStore.jsx # Central data layer + LEAD_FORM_OPTIONS + leads[] + addLead()
|
||||||
└── hooks/ # useGamification, custom hooks
|
└── hooks/ # useGamification, custom hooks
|
||||||
```
|
```
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
**Maintained by Satyam Rastogi | Branch: revamp | Last updated: March 13, 2026**
|
**Maintained by Satyam Rastogi | Branch: revamp | Last updated: March 14, 2026**
|
||||||
|
|||||||
Reference in New Issue
Block a user