docs(10): phase 10 planning complete — 3 plans (CRM leads + activity logging + follow-ups)
This commit is contained in:
@@ -219,7 +219,11 @@ Decimal phases appear between their surrounding integers in numeric order.
|
|||||||
7. "Send Quote" button: select/create quote → update lead.status → "Proposal Sent"
|
7. "Send Quote" button: select/create quote → update lead.status → "Proposal Sent"
|
||||||
**Plans**: 3 (lead CRUD + activity logging + follow-up widget)
|
**Plans**: 3 (lead CRUD + activity logging + follow-up widget)
|
||||||
**Durata**: 3–4 giorni
|
**Durata**: 3–4 giorni
|
||||||
**Status**: Pending planning
|
**Plan list**:
|
||||||
|
- [ ] 10-01-PLAN.md — Schema foundation (leads, activities, reminders tables + query layer)
|
||||||
|
- [ ] 10-02-PLAN.md — Lead CRUD UI (/admin/leads list + detail page + forms)
|
||||||
|
- [ ] 10-03-PLAN.md — Activity logging + send quote + follow-up reminders widget
|
||||||
|
**Status**: ✅ Planning complete
|
||||||
|
|
||||||
### Phase 11: Auto-Provisioning on Win
|
### Phase 11: Auto-Provisioning on Win
|
||||||
**Goal**: Lead → quote accept → auto-crea client + progetto (copia fasi) + 1-4 pagamenti; lancia dashboard cliente
|
**Goal**: Lead → quote accept → auto-crea client + progetto (copia fasi) + 1-4 pagamenti; lancia dashboard cliente
|
||||||
@@ -265,7 +269,7 @@ Phases 7 → 8 → 9 → 10 → 11 planned for sequential execution. Research co
|
|||||||
| 7. Unified Service Catalog | 2 | ✅ Planning complete | 3–4 giorni | Foundation |
|
| 7. Unified Service Catalog | 2 | ✅ Planning complete | 3–4 giorni | Foundation |
|
||||||
| 8. Offer Phases & Quote Templates | 1 | ✅ Planning complete | 1–2 giorni | Foundation |
|
| 8. Offer Phases & Quote Templates | 1 | ✅ Planning complete | 1–2 giorni | Foundation |
|
||||||
| 9. Quote Builder & Public Routes | 3 | Pending planning | 4–5 giorni | RHF compat test |
|
| 9. Quote Builder & Public Routes | 3 | Pending planning | 4–5 giorni | RHF compat test |
|
||||||
| 10. CRM Pipeline & Activity Logging | 3 | Pending planning | 3–4 giorni | No |
|
| 10. CRM Pipeline & Activity Logging | 3 | ✅ Planning complete | 3–4 giorni | No |
|
||||||
| 11. Auto-Provisioning on Win | 2 | Pending planning | 2–3 giorni | BullMQ ops (optional) |
|
| 11. Auto-Provisioning on Win | 2 | Pending planning | 2–3 giorni | BullMQ ops (optional) |
|
||||||
| **Total v2.0 MVP** | **11** | Pending | **13–18 giorni** | — |
|
| **Total v2.0 MVP** | **11** | Pending | **13–18 giorni** | — |
|
||||||
|
|
||||||
|
|||||||
@@ -0,0 +1,438 @@
|
|||||||
|
---
|
||||||
|
phase: 10
|
||||||
|
plan: 01
|
||||||
|
type: execute
|
||||||
|
wave: 1
|
||||||
|
depends_on: []
|
||||||
|
files_modified:
|
||||||
|
- src/db/schema.ts
|
||||||
|
- src/lib/lead-validators.ts
|
||||||
|
- src/lib/lead-service.ts
|
||||||
|
autonomous: true
|
||||||
|
requirements:
|
||||||
|
- CRM-01
|
||||||
|
- CRM-02
|
||||||
|
- CRM-03
|
||||||
|
- CRM-04
|
||||||
|
---
|
||||||
|
|
||||||
|
<objective>
|
||||||
|
Expand Phase 10 CRM Foundation: Complete the `leads`, `activities`, and `reminders` tables in the database schema. Establish pipeline stage enums, activity type definitions, and query layer patterns for lead management and activity logging.
|
||||||
|
|
||||||
|
Purpose: Create the schema foundation required by Phase 10 UI (Lead CRUD, pipeline view, activity log, follow-up widget). These tables enable full-featured CRM operations including lead tracking, interaction history, and reminder scheduling.
|
||||||
|
|
||||||
|
Output:
|
||||||
|
- Complete `leads` table with CRM-required fields (name, email, phone, company, status/stage, last_contact_date, next_action)
|
||||||
|
- `activities` table (timestamped records of interactions: calls, emails, meetings, notes)
|
||||||
|
- `reminders` table (follow-up reminders with due dates and completion state)
|
||||||
|
- TypeScript types and query layer (Lead, Activity, Reminder; stage constants)
|
||||||
|
- Database relations wired to leads from quotes (many quotes per lead)
|
||||||
|
</objective>
|
||||||
|
|
||||||
|
<execution_context>
|
||||||
|
@$HOME/.claude/get-shit-done/workflows/execute-plan.md
|
||||||
|
@$HOME/.claude/get-shit-done/templates/summary.md
|
||||||
|
</execution_context>
|
||||||
|
|
||||||
|
<context>
|
||||||
|
@.planning/PROJECT.md
|
||||||
|
@.planning/ROADMAP.md
|
||||||
|
@.planning/STATE.md
|
||||||
|
@.planning/REQUIREMENTS.md
|
||||||
|
</context>
|
||||||
|
|
||||||
|
<tasks>
|
||||||
|
|
||||||
|
<task type="auto">
|
||||||
|
<name>Task 1: Expand leads table and add activities, reminders tables to schema</name>
|
||||||
|
<files>src/db/schema.ts</files>
|
||||||
|
<action>
|
||||||
|
Update the database schema by expanding the `leads` table and adding two new tables for CRM operations.
|
||||||
|
|
||||||
|
**1. Expand `leads` table** (after current definition, line 363):
|
||||||
|
|
||||||
|
Replace the placeholder definition with full CRM fields:
|
||||||
|
```typescript
|
||||||
|
export const leads = pgTable("leads", {
|
||||||
|
id: text("id")
|
||||||
|
.primaryKey()
|
||||||
|
.$defaultFn(() => nanoid()),
|
||||||
|
name: text("name").notNull(),
|
||||||
|
email: text("email"),
|
||||||
|
phone: text("phone"),
|
||||||
|
company: text("company"),
|
||||||
|
status: text("status")
|
||||||
|
.notNull()
|
||||||
|
.default("contacted"), // contacted | qualified | proposal_sent | negotiating | won | lost
|
||||||
|
last_contact_date: timestamp("last_contact_date", { withTimezone: true }),
|
||||||
|
next_action: text("next_action"),
|
||||||
|
next_action_date: timestamp("next_action_date", { withTimezone: true }),
|
||||||
|
notes: text("notes"),
|
||||||
|
created_at: timestamp("created_at", { withTimezone: true })
|
||||||
|
.notNull()
|
||||||
|
.defaultNow(),
|
||||||
|
updated_at: timestamp("updated_at", { withTimezone: true })
|
||||||
|
.notNull()
|
||||||
|
.defaultNow(),
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
**2. Add `activities` table** (after leads table):
|
||||||
|
```typescript
|
||||||
|
export const activities = pgTable("activities", {
|
||||||
|
id: text("id")
|
||||||
|
.primaryKey()
|
||||||
|
.$defaultFn(() => nanoid()),
|
||||||
|
lead_id: text("lead_id")
|
||||||
|
.notNull()
|
||||||
|
.references(() => leads.id, { onDelete: "cascade" }),
|
||||||
|
type: text("type")
|
||||||
|
.notNull(), // call | email | meeting | note
|
||||||
|
duration_minutes: integer("duration_minutes"), // optional, for calls/meetings
|
||||||
|
notes: text("notes").notNull(),
|
||||||
|
activity_date: timestamp("activity_date", { withTimezone: true })
|
||||||
|
.notNull(),
|
||||||
|
created_at: timestamp("created_at", { withTimezone: true })
|
||||||
|
.notNull()
|
||||||
|
.defaultNow(),
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
**3. Add `reminders` table** (after activities table):
|
||||||
|
```typescript
|
||||||
|
export const reminders = pgTable("reminders", {
|
||||||
|
id: text("id")
|
||||||
|
.primaryKey()
|
||||||
|
.$defaultFn(() => nanoid()),
|
||||||
|
lead_id: text("lead_id")
|
||||||
|
.notNull()
|
||||||
|
.references(() => leads.id, { onDelete: "cascade" }),
|
||||||
|
title: text("title").notNull(),
|
||||||
|
description: text("description"),
|
||||||
|
due_date: timestamp("due_date", { withTimezone: true })
|
||||||
|
.notNull(),
|
||||||
|
completed_at: timestamp("completed_at", { withTimezone: true }),
|
||||||
|
created_at: timestamp("created_at", { withTimezone: true })
|
||||||
|
.notNull()
|
||||||
|
.defaultNow(),
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
**4. Update `quotes` table relation to lead** (already exists, verify at line 341):
|
||||||
|
|
||||||
|
Ensure `lead_id` is present and FK to leads.id. The placeholder was already added in Phase 8; just verify it remains.
|
||||||
|
|
||||||
|
**5. Add relations** (after existing relations, before closing exports):
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
export const leadsRelations = relations(leads, ({ many }) => ({
|
||||||
|
quotes: many(quotes),
|
||||||
|
activities: many(activities),
|
||||||
|
reminders: many(reminders),
|
||||||
|
}));
|
||||||
|
|
||||||
|
export const activitiesRelations = relations(activities, ({ one }) => ({
|
||||||
|
lead: one(leads, { fields: [activities.lead_id], references: [leads.id] }),
|
||||||
|
}));
|
||||||
|
|
||||||
|
export const remindersRelations = relations(reminders, ({ one }) => ({
|
||||||
|
lead: one(leads, { fields: [reminders.lead_id], references: [leads.id] }),
|
||||||
|
}));
|
||||||
|
|
||||||
|
export const quotesRelations = relations(quotes, ({ one, many }) => ({
|
||||||
|
lead: one(leads, { fields: [quotes.lead_id], references: [leads.id] }),
|
||||||
|
client: one(clients, { fields: [quotes.client_id], references: [clients.id] }),
|
||||||
|
offerMicro: one(offer_micros, { fields: [quotes.offer_micro_id], references: [offer_micros.id] }),
|
||||||
|
items: many(quote_items),
|
||||||
|
}));
|
||||||
|
```
|
||||||
|
|
||||||
|
**Data Safety:** The placeholder leads table already exists; this task expands it in-place with new columns. No existing data is deleted — backwards compatible.
|
||||||
|
</action>
|
||||||
|
<verify>
|
||||||
|
<automated>npm run build 2>&1 | grep -c "error" | grep -q 0 && echo "TypeScript compile pass"</automated>
|
||||||
|
</verify>
|
||||||
|
<done>Schema file updated with expanded leads table, activities and reminders tables, and all relations properly configured. npm run build passes. No placeholder data lost — fully backward compatible.</done>
|
||||||
|
</task>
|
||||||
|
|
||||||
|
<task type="auto">
|
||||||
|
<name>Task 2: Create Drizzle migration for CRM tables</name>
|
||||||
|
<files>src/db/migrations</files>
|
||||||
|
<action>
|
||||||
|
Run drizzle-kit to auto-generate migration files for the new CRM tables and schema changes:
|
||||||
|
|
||||||
|
```bash
|
||||||
|
npx drizzle-kit generate --name=phase-10-crm-leads-activities-reminders
|
||||||
|
```
|
||||||
|
|
||||||
|
This creates a new migration file in `src/db/migrations/` with SQL for the expanded leads table and new activities/reminders tables. The migration is NOT applied yet (Phase 10 execution will push to DB).
|
||||||
|
|
||||||
|
Validate the generated migration:
|
||||||
|
- Ensure leads table ALTER statement (adding phone, company, status, last_contact_date, etc.) is correct
|
||||||
|
- Ensure activities table has FK to leads with CASCADE delete
|
||||||
|
- Ensure reminders table has FK to leads with CASCADE delete
|
||||||
|
- Ensure quotes table lead_id FK exists (may already be present from Phase 8)
|
||||||
|
- Ensure all NOT NULL constraints match schema
|
||||||
|
|
||||||
|
If migration looks incorrect, manually edit the SQL in `src/db/migrations/{migration_file}.sql` to fix.
|
||||||
|
|
||||||
|
Check for syntax errors:
|
||||||
|
```bash
|
||||||
|
head -50 src/db/migrations/phase-10-crm-leads-activities-reminders.sql
|
||||||
|
```
|
||||||
|
</action>
|
||||||
|
<verify>
|
||||||
|
<automated>ls src/db/migrations/ | grep phase-10 | head -1</automated>
|
||||||
|
</verify>
|
||||||
|
<done>Migration file generated and located in src/db/migrations/. SQL is syntactically valid and includes all table and relation changes.</done>
|
||||||
|
</task>
|
||||||
|
|
||||||
|
<task type="auto">
|
||||||
|
<name>Task 3: Add lead validators (Zod schemas) and activity/reminder query layer</name>
|
||||||
|
<files>src/lib/lead-validators.ts, src/lib/lead-service.ts</files>
|
||||||
|
<action>
|
||||||
|
Create two new library files for lead operations:
|
||||||
|
|
||||||
|
**src/lib/lead-validators.ts** — Zod schemas for CRM operations:
|
||||||
|
```typescript
|
||||||
|
import { z } from "zod";
|
||||||
|
|
||||||
|
// Pipeline stages — enum match database default values
|
||||||
|
export const LEAD_STAGES = ["contacted", "qualified", "proposal_sent", "negotiating", "won", "lost"] as const;
|
||||||
|
export const ACTIVITY_TYPES = ["call", "email", "meeting", "note"] as const;
|
||||||
|
|
||||||
|
// Lead creation (admin)
|
||||||
|
export const createLeadSchema = z.object({
|
||||||
|
name: z.string().min(1, "Nome richiesto").max(100),
|
||||||
|
email: z.string().email("Email valida").optional().or(z.literal("")),
|
||||||
|
phone: z.string().optional().or(z.literal("")),
|
||||||
|
company: z.string().optional().or(z.literal("")),
|
||||||
|
status: z.enum(LEAD_STAGES).default("contacted"),
|
||||||
|
notes: z.string().optional().or(z.literal("")),
|
||||||
|
});
|
||||||
|
|
||||||
|
// Lead update
|
||||||
|
export const updateLeadSchema = createLeadSchema.partial().required({ status: false });
|
||||||
|
|
||||||
|
// Activity logging
|
||||||
|
export const createActivitySchema = z.object({
|
||||||
|
lead_id: z.string().min(1, "Lead richiesto"),
|
||||||
|
type: z.enum(ACTIVITY_TYPES),
|
||||||
|
activity_date: z.date().or(z.string()),
|
||||||
|
duration_minutes: z.number().min(0).optional(),
|
||||||
|
notes: z.string().min(1, "Note richieste").max(1000),
|
||||||
|
});
|
||||||
|
|
||||||
|
// Reminder creation
|
||||||
|
export const createReminderSchema = z.object({
|
||||||
|
lead_id: z.string().min(1, "Lead richiesto"),
|
||||||
|
title: z.string().min(1, "Titolo richiesto").max(200),
|
||||||
|
description: z.string().optional(),
|
||||||
|
due_date: z.date().or(z.string()),
|
||||||
|
});
|
||||||
|
|
||||||
|
// Change lead stage
|
||||||
|
export const updateLeadStageSchema = z.object({
|
||||||
|
lead_id: z.string().min(1),
|
||||||
|
stage: z.enum(LEAD_STAGES),
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
**src/lib/lead-service.ts** — Query layer for leads, activities, and reminders:
|
||||||
|
```typescript
|
||||||
|
import { eq, and, isNull, desc, gte, lte, ilike } from "drizzle-orm";
|
||||||
|
import { db } from "@/db";
|
||||||
|
import { leads, activities, reminders, quotes } from "@/db/schema";
|
||||||
|
|
||||||
|
// Get all leads with counts of quotes and upcoming reminders
|
||||||
|
export async function getAllLeads() {
|
||||||
|
return await db
|
||||||
|
.select()
|
||||||
|
.from(leads)
|
||||||
|
.orderBy(desc(leads.updated_at));
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get lead by ID with related quotes and activity count
|
||||||
|
export async function getLeadById(id: string) {
|
||||||
|
const [lead] = await db
|
||||||
|
.select()
|
||||||
|
.from(leads)
|
||||||
|
.where(eq(leads.id, id));
|
||||||
|
|
||||||
|
return lead;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get leads by stage (for pipeline view)
|
||||||
|
export async function getLeadsByStage(stage: string) {
|
||||||
|
return await db
|
||||||
|
.select()
|
||||||
|
.from(leads)
|
||||||
|
.where(eq(leads.status, stage))
|
||||||
|
.orderBy(desc(leads.last_contact_date));
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get leads that need follow-up (last contact > 7 days ago)
|
||||||
|
export async function getLeadsNeedingFollowUp(daysAgo: number = 7) {
|
||||||
|
const cutoffDate = new Date();
|
||||||
|
cutoffDate.setDate(cutoffDate.getDate() - daysAgo);
|
||||||
|
|
||||||
|
return await db
|
||||||
|
.select()
|
||||||
|
.from(leads)
|
||||||
|
.where(
|
||||||
|
and(
|
||||||
|
isNull(leads.last_contact_date),
|
||||||
|
gte(leads.created_at, cutoffDate)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
.orderBy(leads.created_at);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get activity log for a lead (reverse chronological)
|
||||||
|
export async function getActivityLog(leadId: string) {
|
||||||
|
return await db
|
||||||
|
.select()
|
||||||
|
.from(activities)
|
||||||
|
.where(eq(activities.lead_id, leadId))
|
||||||
|
.orderBy(desc(activities.activity_date));
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get upcoming reminders for a lead
|
||||||
|
export async function getUpcomingReminders(leadId: string) {
|
||||||
|
return await db
|
||||||
|
.select()
|
||||||
|
.from(reminders)
|
||||||
|
.where(
|
||||||
|
and(
|
||||||
|
eq(reminders.lead_id, leadId),
|
||||||
|
isNull(reminders.completed_at)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
.orderBy(reminders.due_date);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Get all overdue reminders (admin widget)
|
||||||
|
export async function getOverdueReminders() {
|
||||||
|
const now = new Date();
|
||||||
|
return await db
|
||||||
|
.select()
|
||||||
|
.from(reminders)
|
||||||
|
.innerJoin(leads, eq(reminders.lead_id, leads.id))
|
||||||
|
.where(
|
||||||
|
and(
|
||||||
|
lte(reminders.due_date, now),
|
||||||
|
isNull(reminders.completed_at)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
.orderBy(reminders.due_date);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Create activity and auto-update lead.last_contact_date
|
||||||
|
export async function createActivity(data: {
|
||||||
|
lead_id: string;
|
||||||
|
type: string;
|
||||||
|
activity_date: Date;
|
||||||
|
duration_minutes?: number;
|
||||||
|
notes: string;
|
||||||
|
}) {
|
||||||
|
const [activity] = await db
|
||||||
|
.insert(activities)
|
||||||
|
.values(data)
|
||||||
|
.returning();
|
||||||
|
|
||||||
|
// Auto-update lead.last_contact_date
|
||||||
|
await db
|
||||||
|
.update(leads)
|
||||||
|
.set({ last_contact_date: data.activity_date, updated_at: new Date() })
|
||||||
|
.where(eq(leads.id, data.lead_id));
|
||||||
|
|
||||||
|
return activity;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Update lead stage
|
||||||
|
export async function updateLeadStage(leadId: string, stage: string) {
|
||||||
|
const [updated] = await db
|
||||||
|
.update(leads)
|
||||||
|
.set({ status: stage, updated_at: new Date() })
|
||||||
|
.where(eq(leads.id, leadId))
|
||||||
|
.returning();
|
||||||
|
|
||||||
|
return updated;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Search leads by name, email, or company
|
||||||
|
export async function searchLeads(query: string) {
|
||||||
|
return await db
|
||||||
|
.select()
|
||||||
|
.from(leads)
|
||||||
|
.where(
|
||||||
|
or(
|
||||||
|
ilike(leads.name, `%${query}%`),
|
||||||
|
ilike(leads.email, `%${query}%`),
|
||||||
|
ilike(leads.company, `%${query}%`)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
.orderBy(desc(leads.updated_at));
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
These skeleton implementations provide the foundation. Phase 10 Tasks 2-3 will flesh out UI integration and form handling.
|
||||||
|
</action>
|
||||||
|
<verify>
|
||||||
|
<automated>npm run build 2>&1 | grep -c "error" | grep -q 0 && echo "Validators compile"</automated>
|
||||||
|
</verify>
|
||||||
|
<done>Lead validators and service layer created. Schemas handle stage/type enums, activity logging, and reminder queries. Query layer is paginated for scalability. npm run build passes.</done>
|
||||||
|
</task>
|
||||||
|
|
||||||
|
</tasks>
|
||||||
|
|
||||||
|
<threat_model>
|
||||||
|
## Trust Boundaries
|
||||||
|
|
||||||
|
| Boundary | Description |
|
||||||
|
|----------|-------------|
|
||||||
|
| Admin → Lead Data | Session-authenticated via Auth.js; admin actions return full lead details and activity history |
|
||||||
|
| Lead ID references | All lead operations (activities, reminders) checked via lead_id FK; cascade delete prevents orphaned records |
|
||||||
|
| Activity date validation | Activity dates must be <= current date (no future backdating); server-side timestamp immutability |
|
||||||
|
|
||||||
|
## STRIDE Threat Register
|
||||||
|
|
||||||
|
| Threat ID | Category | Component | Disposition | Mitigation Plan |
|
||||||
|
|-----------|----------|-----------|-------------|-----------------|
|
||||||
|
| T-10-01 | Tampering | Activity history modification | mitigate | Activity records immutable after creation; no update endpoint; deletion requires admin auth + audit log |
|
||||||
|
| T-10-02 | Spoofing | Lead creation with fake company/contact info | mitigate | Email/phone not validated until win (Phase 11); accept unverified input at lead stage; verify on quote accept |
|
||||||
|
| T-10-03 | Information Disclosure | Leaking lead contact details (email, phone) via API | mitigate | Lead queries require Auth.js session; no public API for leads; admin-only access |
|
||||||
|
| T-10-04 | Denial of Service | Bulk activity creation spam | mitigate | No rate limit in Phase 10 MVP; add rate limiting per admin session if needed (Phase 12) |
|
||||||
|
| T-10-05 | Elevation | Non-admin user updating lead stage | mitigate | All lead mutations require Auth.js session; middleware guards /admin/leads routes |
|
||||||
|
| T-10-06 | Tampering | Backdating activities (future activity_date) | accept | No validation in Phase 10; assume admin is honest; add validation if abuse occurs |
|
||||||
|
|
||||||
|
</threat_model>
|
||||||
|
|
||||||
|
<verification>
|
||||||
|
After Phase 10 Plan 1 execution:
|
||||||
|
|
||||||
|
1. Schema compiles: `npm run build` passes with no TS errors
|
||||||
|
2. Drizzle migration file generated: `src/db/migrations/` contains new migration
|
||||||
|
3. Lead validators import cleanly: `import { createLeadSchema, LEAD_STAGES } from '@/lib/lead-validators'` works
|
||||||
|
4. Query layer exports all functions: `getLeadById`, `getActivityLog`, `createActivity`, `updateLeadStage`, etc.
|
||||||
|
5. Relations updated: leads → activities (cascade), leads → reminders (cascade), quotes → leads (optional FK)
|
||||||
|
|
||||||
|
Data safety check:
|
||||||
|
- Placeholder leads table expanded: NOT deleted, just new columns added
|
||||||
|
- New activities/reminders tables created from scratch: no existing data at risk
|
||||||
|
- quotes table lead_id FK already present from Phase 8: no schema conflict
|
||||||
|
</verification>
|
||||||
|
|
||||||
|
<success_criteria>
|
||||||
|
- `leads`, `activities`, `reminders` tables properly defined with all CRM fields
|
||||||
|
- TypeScript compiles cleanly; Lead/Activity/Reminder types exported
|
||||||
|
- Drizzle migration file generated (not yet applied to DB)
|
||||||
|
- Lead validators (Zod) handle stage enums, activity types, date validation
|
||||||
|
- Query layer provides CRUD + search operations for leads, activities, reminders
|
||||||
|
- Relations properly configured: leads ← activities, leads ← reminders, leads ← quotes
|
||||||
|
- Database schema is ready for Phase 10 UI (pipeline view, activity log, follow-up widget)
|
||||||
|
</success_criteria>
|
||||||
|
|
||||||
|
<output>
|
||||||
|
After execution, create `.planning/phases/10-crm-pipeline-activity-logging/10-01-SUMMARY.md`
|
||||||
|
</output>
|
||||||
@@ -0,0 +1,772 @@
|
|||||||
|
---
|
||||||
|
phase: 10
|
||||||
|
plan: 02
|
||||||
|
type: execute
|
||||||
|
wave: 2
|
||||||
|
depends_on: [10-01]
|
||||||
|
files_modified:
|
||||||
|
- src/app/admin/leads/page.tsx
|
||||||
|
- src/app/admin/leads/[id]/page.tsx
|
||||||
|
- src/components/admin/leads/LeadTable.tsx
|
||||||
|
- src/components/admin/leads/LeadForm.tsx
|
||||||
|
- src/components/admin/leads/PipelineKanban.tsx
|
||||||
|
- src/app/admin/leads/actions.ts
|
||||||
|
autonomous: true
|
||||||
|
requirements:
|
||||||
|
- CRM-01
|
||||||
|
- CRM-02
|
||||||
|
- CRM-03
|
||||||
|
---
|
||||||
|
|
||||||
|
<objective>
|
||||||
|
Phase 10 CRM UI (Part 1): Implement Lead CRUD pages (/admin/leads) and Kanban pipeline view showing leads by stage. Establish form patterns for lead creation/editing and stage transitions via drag-and-drop.
|
||||||
|
|
||||||
|
Purpose: Create the admin-facing lead management interface and pipeline view. Admins can create leads, view full lead details, and transition leads between pipeline stages visually. This enables the core CRM workflow: Contacted → Qualified → Proposal Sent → Negotiating → Won/Lost.
|
||||||
|
|
||||||
|
Output:
|
||||||
|
- `/admin/leads` list page with table (name, email, company, status, last_contact_date, next_action)
|
||||||
|
- `/admin/leads/[id]` detail page with profilo, action menu (log activity, send quote, mark won)
|
||||||
|
- `/admin/leads/kanban` Kanban board view (drag-drop leads between 6 stages)
|
||||||
|
- LeadForm component (create + edit modal)
|
||||||
|
- Server actions for createLead, updateLead, updateLeadStage, deleteLead
|
||||||
|
</objective>
|
||||||
|
|
||||||
|
<execution_context>
|
||||||
|
@$HOME/.claude/get-shit-done/workflows/execute-plan.md
|
||||||
|
@$HOME/.claude/get-shit-done/templates/summary.md
|
||||||
|
</execution_context>
|
||||||
|
|
||||||
|
<context>
|
||||||
|
@.planning/PROJECT.md
|
||||||
|
@.planning/ROADMAP.md
|
||||||
|
@.planning/STATE.md
|
||||||
|
@.planning/REQUIREMENTS.md
|
||||||
|
@.planning/phases/10-crm-pipeline-activity-logging/10-01-SUMMARY.md
|
||||||
|
</context>
|
||||||
|
|
||||||
|
<interfaces>
|
||||||
|
From src/lib/lead-validators.ts (created in Plan 1):
|
||||||
|
```typescript
|
||||||
|
export const LEAD_STAGES = ["contacted", "qualified", "proposal_sent", "negotiating", "won", "lost"] as const;
|
||||||
|
export const ACTIVITY_TYPES = ["call", "email", "meeting", "note"] as const;
|
||||||
|
export const createLeadSchema: ZodType<{ name, email?, phone?, company?, status?, notes? }>;
|
||||||
|
export const updateLeadSchema: ZodType<Partial<CreateLead>>;
|
||||||
|
```
|
||||||
|
|
||||||
|
From src/lib/lead-service.ts (created in Plan 1):
|
||||||
|
```typescript
|
||||||
|
export async function getAllLeads(): Promise<Lead[]>;
|
||||||
|
export async function getLeadById(id: string): Promise<Lead | undefined>;
|
||||||
|
export async function getLeadsByStage(stage: string): Promise<Lead[]>;
|
||||||
|
export async function createActivity(...): Promise<Activity>;
|
||||||
|
export async function updateLeadStage(leadId, stage): Promise<Lead>;
|
||||||
|
```
|
||||||
|
|
||||||
|
From src/db/schema.ts (expanded in Plan 1):
|
||||||
|
```typescript
|
||||||
|
export type Lead = typeof leads.$inferSelect;
|
||||||
|
export type NewLead = typeof leads.$inferInsert;
|
||||||
|
export type Activity = typeof activities.$inferSelect;
|
||||||
|
```
|
||||||
|
</interfaces>
|
||||||
|
|
||||||
|
<tasks>
|
||||||
|
|
||||||
|
<task type="auto">
|
||||||
|
<name>Task 1: Create /admin/leads list page and LeadTable component</name>
|
||||||
|
<files>src/app/admin/leads/page.tsx, src/components/admin/leads/LeadTable.tsx</files>
|
||||||
|
<action>
|
||||||
|
**Step 1: Create `/admin/leads` list page**
|
||||||
|
|
||||||
|
File: `src/app/admin/leads/page.tsx`
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
import { Suspense } from "react";
|
||||||
|
import { getAllLeads } from "@/lib/lead-service";
|
||||||
|
import { LeadTable } from "@/components/admin/leads/LeadTable";
|
||||||
|
import { CreateLeadModal } from "@/components/admin/leads/LeadForm";
|
||||||
|
import { Button } from "@/components/ui/button";
|
||||||
|
|
||||||
|
async function LeadsList() {
|
||||||
|
const leads = await getAllLeads();
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="space-y-6">
|
||||||
|
<div className="flex justify-between items-center">
|
||||||
|
<h1 className="text-3xl font-bold">Lead Pipeline</h1>
|
||||||
|
<CreateLeadModal />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Suspense fallback={<div>Loading...</div>}>
|
||||||
|
<LeadTable leads={leads} />
|
||||||
|
</Suspense>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default function LeadsPage() {
|
||||||
|
return <LeadsList />;
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
**Step 2: Create LeadTable component**
|
||||||
|
|
||||||
|
File: `src/components/admin/leads/LeadTable.tsx`
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
"use client";
|
||||||
|
|
||||||
|
import Link from "next/link";
|
||||||
|
import { Lead } from "@/db/schema";
|
||||||
|
import {
|
||||||
|
Table,
|
||||||
|
TableBody,
|
||||||
|
TableCell,
|
||||||
|
TableHead,
|
||||||
|
TableHeader,
|
||||||
|
TableRow,
|
||||||
|
} from "@/components/ui/table";
|
||||||
|
import { Badge } from "@/components/ui/badge";
|
||||||
|
import { Button } from "@/components/ui/button";
|
||||||
|
import { formatDistanceToNow } from "date-fns";
|
||||||
|
import { LEAD_STAGES } from "@/lib/lead-validators";
|
||||||
|
|
||||||
|
const STAGE_COLOR = {
|
||||||
|
contacted: "bg-blue-100 text-blue-800",
|
||||||
|
qualified: "bg-purple-100 text-purple-800",
|
||||||
|
proposal_sent: "bg-amber-100 text-amber-800",
|
||||||
|
negotiating: "bg-orange-100 text-orange-800",
|
||||||
|
won: "bg-green-100 text-green-800",
|
||||||
|
lost: "bg-red-100 text-red-800",
|
||||||
|
};
|
||||||
|
|
||||||
|
export function LeadTable({ leads }: { leads: Lead[] }) {
|
||||||
|
return (
|
||||||
|
<div className="border rounded-lg">
|
||||||
|
<Table>
|
||||||
|
<TableHeader>
|
||||||
|
<TableRow>
|
||||||
|
<TableHead>Nome</TableHead>
|
||||||
|
<TableHead>Email</TableHead>
|
||||||
|
<TableHead>Azienda</TableHead>
|
||||||
|
<TableHead>Stato</TableHead>
|
||||||
|
<TableHead>Ultimo Contatto</TableHead>
|
||||||
|
<TableHead>Prossima Azione</TableHead>
|
||||||
|
<TableHead></TableHead>
|
||||||
|
</TableRow>
|
||||||
|
</TableHeader>
|
||||||
|
<TableBody>
|
||||||
|
{leads.map((lead) => (
|
||||||
|
<TableRow key={lead.id}>
|
||||||
|
<TableCell className="font-medium">
|
||||||
|
<Link href={`/admin/leads/${lead.id}`} className="hover:underline">
|
||||||
|
{lead.name}
|
||||||
|
</Link>
|
||||||
|
</TableCell>
|
||||||
|
<TableCell>{lead.email || "—"}</TableCell>
|
||||||
|
<TableCell>{lead.company || "—"}</TableCell>
|
||||||
|
<TableCell>
|
||||||
|
<Badge className={STAGE_COLOR[lead.status as keyof typeof STAGE_COLOR]}>
|
||||||
|
{lead.status.replace("_", " ")}
|
||||||
|
</Badge>
|
||||||
|
</TableCell>
|
||||||
|
<TableCell>
|
||||||
|
{lead.last_contact_date
|
||||||
|
? formatDistanceToNow(new Date(lead.last_contact_date), { addSuffix: true })
|
||||||
|
: "—"}
|
||||||
|
</TableCell>
|
||||||
|
<TableCell className="text-sm">{lead.next_action || "—"}</TableCell>
|
||||||
|
<TableCell>
|
||||||
|
<Button variant="ghost" size="sm" asChild>
|
||||||
|
<Link href={`/admin/leads/${lead.id}`}>Dettagli</Link>
|
||||||
|
</Button>
|
||||||
|
</TableCell>
|
||||||
|
</TableRow>
|
||||||
|
))}
|
||||||
|
</TableBody>
|
||||||
|
</Table>
|
||||||
|
{leads.length === 0 && (
|
||||||
|
<div className="text-center py-8 text-gray-500">Nessun lead trovato</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
**Design notes:**
|
||||||
|
- Table shows all required fields per CRM-01 (name, email, company, status, last_contact_date, next_action)
|
||||||
|
- Status badge color-coded by stage (blue=contacted, purple=qualified, amber=proposal_sent, orange=negotiating, green=won, red=lost)
|
||||||
|
- Click row to navigate to lead detail page
|
||||||
|
- "Create Lead" button opens modal form
|
||||||
|
</action>
|
||||||
|
<verify>
|
||||||
|
<automated>npm run build 2>&1 | grep -c "error" | grep -q 0 && echo "Leads list page compiles"</automated>
|
||||||
|
</verify>
|
||||||
|
<done>LeadTable component and /admin/leads page created. Table displays all leads with status badge coloring, last contact date, and navigation links to detail page.</done>
|
||||||
|
</task>
|
||||||
|
|
||||||
|
<task type="auto">
|
||||||
|
<name>Task 2: Create /admin/leads/[id] detail page with activity log and action menu</name>
|
||||||
|
<files>src/app/admin/leads/[id]/page.tsx, src/components/admin/leads/LeadDetail.tsx</files>
|
||||||
|
<action>
|
||||||
|
File: `src/app/admin/leads/[id]/page.tsx`
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
import { notFound } from "next/navigation";
|
||||||
|
import { getLeadById, getActivityLog, getUpcomingReminders } from "@/lib/lead-service";
|
||||||
|
import { LeadDetail } from "@/components/admin/leads/LeadDetail";
|
||||||
|
|
||||||
|
export default async function LeadDetailPage({ params }: { params: { id: string } }) {
|
||||||
|
const lead = await getLeadById(params.id);
|
||||||
|
|
||||||
|
if (!lead) {
|
||||||
|
notFound();
|
||||||
|
}
|
||||||
|
|
||||||
|
const activities = await getActivityLog(params.id);
|
||||||
|
const reminders = await getUpcomingReminders(params.id);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<LeadDetail lead={lead} activities={activities} reminders={reminders} />
|
||||||
|
);
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
File: `src/components/admin/leads/LeadDetail.tsx`
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
"use client";
|
||||||
|
|
||||||
|
import { Lead, Activity, Reminder } from "@/db/schema";
|
||||||
|
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
||||||
|
import { Badge } from "@/components/ui/badge";
|
||||||
|
import { Button } from "@/components/ui/button";
|
||||||
|
import { formatDistanceToNow, format } from "date-fns";
|
||||||
|
import { LogActivityModal } from "./LogActivityModal";
|
||||||
|
import { SendQuoteModal } from "./SendQuoteModal";
|
||||||
|
import { it } from "date-fns/locale";
|
||||||
|
|
||||||
|
const ACTIVITY_ICON = {
|
||||||
|
call: "📞",
|
||||||
|
email: "📧",
|
||||||
|
meeting: "📅",
|
||||||
|
note: "📝",
|
||||||
|
};
|
||||||
|
|
||||||
|
export function LeadDetail({
|
||||||
|
lead,
|
||||||
|
activities,
|
||||||
|
reminders,
|
||||||
|
}: {
|
||||||
|
lead: Lead;
|
||||||
|
activities: Activity[];
|
||||||
|
reminders: Reminder[];
|
||||||
|
}) {
|
||||||
|
return (
|
||||||
|
<div className="space-y-6">
|
||||||
|
{/* Header + Actions */}
|
||||||
|
<div className="flex justify-between items-start">
|
||||||
|
<div>
|
||||||
|
<h1 className="text-3xl font-bold">{lead.name}</h1>
|
||||||
|
<p className="text-gray-600">{lead.company || "Azienda non specificata"}</p>
|
||||||
|
</div>
|
||||||
|
<div className="flex gap-2">
|
||||||
|
<LogActivityModal leadId={lead.id} />
|
||||||
|
<SendQuoteModal leadId={lead.id} />
|
||||||
|
<Button variant="outline">Segna come vinto</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
||||||
|
{/* Lead Profile Card */}
|
||||||
|
<Card>
|
||||||
|
<CardHeader>
|
||||||
|
<CardTitle>Profilo</CardTitle>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent className="space-y-4">
|
||||||
|
<div>
|
||||||
|
<label className="text-sm text-gray-600">Stato</label>
|
||||||
|
<Badge className="mt-1">{lead.status.replace("_", " ")}</Badge>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label className="text-sm text-gray-600">Email</label>
|
||||||
|
<p>{lead.email || "—"}</p>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label className="text-sm text-gray-600">Telefono</label>
|
||||||
|
<p>{lead.phone || "—"}</p>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label className="text-sm text-gray-600">Ultimo contatto</label>
|
||||||
|
<p>
|
||||||
|
{lead.last_contact_date
|
||||||
|
? formatDistanceToNow(new Date(lead.last_contact_date), {
|
||||||
|
addSuffix: true,
|
||||||
|
locale: it,
|
||||||
|
})
|
||||||
|
: "—"}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<label className="text-sm text-gray-600">Prossima azione</label>
|
||||||
|
<p className="font-medium">{lead.next_action || "—"}</p>
|
||||||
|
</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
|
||||||
|
{/* Upcoming Reminders Card */}
|
||||||
|
<Card>
|
||||||
|
<CardHeader>
|
||||||
|
<CardTitle>Prossimi Follow-up</CardTitle>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent>
|
||||||
|
{reminders.length > 0 ? (
|
||||||
|
<ul className="space-y-2">
|
||||||
|
{reminders.map((r) => (
|
||||||
|
<li key={r.id} className="text-sm border-l-2 border-blue-300 pl-2">
|
||||||
|
<p className="font-medium">{r.title}</p>
|
||||||
|
<p className="text-gray-600">
|
||||||
|
{format(new Date(r.due_date), "dd MMM yyyy", { locale: it })}
|
||||||
|
</p>
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
) : (
|
||||||
|
<p className="text-gray-500 text-sm">Nessun reminder</p>
|
||||||
|
)}
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
|
||||||
|
{/* Notes Card */}
|
||||||
|
<Card>
|
||||||
|
<CardHeader>
|
||||||
|
<CardTitle>Note</CardTitle>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent>
|
||||||
|
<p className="text-sm">{lead.notes || "Nessuna nota"}</p>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Activity Log */}
|
||||||
|
<Card>
|
||||||
|
<CardHeader>
|
||||||
|
<CardTitle>Storico Attività</CardTitle>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent>
|
||||||
|
{activities.length > 0 ? (
|
||||||
|
<div className="space-y-4">
|
||||||
|
{activities.map((activity) => (
|
||||||
|
<div
|
||||||
|
key={activity.id}
|
||||||
|
className="border-l-4 border-blue-300 pl-4 pb-4"
|
||||||
|
>
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
<span className="text-xl">
|
||||||
|
{ACTIVITY_ICON[activity.type as keyof typeof ACTIVITY_ICON]}
|
||||||
|
</span>
|
||||||
|
<span className="font-medium capitalize">
|
||||||
|
{activity.type}
|
||||||
|
</span>
|
||||||
|
<span className="text-gray-600 text-sm">
|
||||||
|
{formatDistanceToNow(new Date(activity.activity_date), {
|
||||||
|
addSuffix: true,
|
||||||
|
locale: it,
|
||||||
|
})}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<p className="text-sm mt-2">{activity.notes}</p>
|
||||||
|
{activity.duration_minutes && (
|
||||||
|
<p className="text-xs text-gray-500 mt-1">
|
||||||
|
Durata: {activity.duration_minutes} minuti
|
||||||
|
</p>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<p className="text-gray-500 text-sm">Nessuna attività registrata</p>
|
||||||
|
)}
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
**Design notes:**
|
||||||
|
- Full lead profile on left (name, email, phone, company, status, next_action)
|
||||||
|
- Activity log in reverse chronological order with type icons (📞📧📅📝)
|
||||||
|
- Action buttons for log activity, send quote, mark as won
|
||||||
|
- Upcoming reminders list
|
||||||
|
- Notes section for free-form notes
|
||||||
|
</action>
|
||||||
|
<verify>
|
||||||
|
<automated>npm run build 2>&1 | grep -c "error" | grep -q 0 && echo "Lead detail page compiles"</automated>
|
||||||
|
</verify>
|
||||||
|
<done>Lead detail page and LeadDetail component created. Shows full lead profile, activity log (reverse chronological), upcoming reminders, and action menu (log activity, send quote, mark as won).</done>
|
||||||
|
</task>
|
||||||
|
|
||||||
|
<task type="auto">
|
||||||
|
<name>Task 3: Create LeadForm component (create/edit modal) and server actions</name>
|
||||||
|
<files>src/components/admin/leads/LeadForm.tsx, src/app/admin/leads/actions.ts</files>
|
||||||
|
<action>
|
||||||
|
File: `src/components/admin/leads/LeadForm.tsx`
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
"use client";
|
||||||
|
|
||||||
|
import { useState } from "react";
|
||||||
|
import { useForm } from "react-hook-form";
|
||||||
|
import { zodResolver } from "@hookform/resolvers/zod";
|
||||||
|
import { z } from "zod";
|
||||||
|
import { createLeadSchema, LEAD_STAGES } from "@/lib/lead-validators";
|
||||||
|
import { Lead } from "@/db/schema";
|
||||||
|
import { createLead, updateLead } from "@/app/admin/leads/actions";
|
||||||
|
import {
|
||||||
|
Dialog,
|
||||||
|
DialogContent,
|
||||||
|
DialogHeader,
|
||||||
|
DialogTitle,
|
||||||
|
DialogTrigger,
|
||||||
|
} from "@/components/ui/dialog";
|
||||||
|
import {
|
||||||
|
Form,
|
||||||
|
FormControl,
|
||||||
|
FormField,
|
||||||
|
FormItem,
|
||||||
|
FormLabel,
|
||||||
|
FormMessage,
|
||||||
|
} from "@/components/ui/form";
|
||||||
|
import {
|
||||||
|
Select,
|
||||||
|
SelectContent,
|
||||||
|
SelectItem,
|
||||||
|
SelectTrigger,
|
||||||
|
SelectValue,
|
||||||
|
} from "@/components/ui/select";
|
||||||
|
import { Input } from "@/components/ui/input";
|
||||||
|
import { Textarea } from "@/components/ui/textarea";
|
||||||
|
import { Button } from "@/components/ui/button";
|
||||||
|
|
||||||
|
type CreateLeadInput = z.infer<typeof createLeadSchema>;
|
||||||
|
|
||||||
|
export function CreateLeadModal() {
|
||||||
|
const [open, setOpen] = useState(false);
|
||||||
|
const form = useForm<CreateLeadInput>({
|
||||||
|
resolver: zodResolver(createLeadSchema),
|
||||||
|
defaultValues: { status: "contacted" },
|
||||||
|
});
|
||||||
|
|
||||||
|
async function onSubmit(data: CreateLeadInput) {
|
||||||
|
const result = await createLead(data);
|
||||||
|
if (result.success) {
|
||||||
|
setOpen(false);
|
||||||
|
form.reset();
|
||||||
|
// Toast success
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Dialog open={open} onOpenChange={setOpen}>
|
||||||
|
<DialogTrigger asChild>
|
||||||
|
<Button>+ Nuovo Lead</Button>
|
||||||
|
</DialogTrigger>
|
||||||
|
<DialogContent className="max-w-md">
|
||||||
|
<DialogHeader>
|
||||||
|
<DialogTitle>Nuovo Lead</DialogTitle>
|
||||||
|
</DialogHeader>
|
||||||
|
<Form {...form}>
|
||||||
|
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="name"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem>
|
||||||
|
<FormLabel>Nome</FormLabel>
|
||||||
|
<FormControl>
|
||||||
|
<Input placeholder="Nome lead" {...field} />
|
||||||
|
</FormControl>
|
||||||
|
<FormMessage />
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="email"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem>
|
||||||
|
<FormLabel>Email</FormLabel>
|
||||||
|
<FormControl>
|
||||||
|
<Input type="email" placeholder="email@example.com" {...field} />
|
||||||
|
</FormControl>
|
||||||
|
<FormMessage />
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="phone"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem>
|
||||||
|
<FormLabel>Telefono</FormLabel>
|
||||||
|
<FormControl>
|
||||||
|
<Input placeholder="+39 3XX XXXXXXX" {...field} />
|
||||||
|
</FormControl>
|
||||||
|
<FormMessage />
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="company"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem>
|
||||||
|
<FormLabel>Azienda</FormLabel>
|
||||||
|
<FormControl>
|
||||||
|
<Input placeholder="Nome azienda" {...field} />
|
||||||
|
</FormControl>
|
||||||
|
<FormMessage />
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="status"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem>
|
||||||
|
<FormLabel>Stato</FormLabel>
|
||||||
|
<Select onValueChange={field.onChange} defaultValue={field.value}>
|
||||||
|
<FormControl>
|
||||||
|
<SelectTrigger>
|
||||||
|
<SelectValue />
|
||||||
|
</SelectTrigger>
|
||||||
|
</FormControl>
|
||||||
|
<SelectContent>
|
||||||
|
{LEAD_STAGES.map((stage) => (
|
||||||
|
<SelectItem key={stage} value={stage}>
|
||||||
|
{stage.replace(/_/g, " ")}
|
||||||
|
</SelectItem>
|
||||||
|
))}
|
||||||
|
</SelectContent>
|
||||||
|
</Select>
|
||||||
|
<FormMessage />
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="notes"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem>
|
||||||
|
<FormLabel>Note</FormLabel>
|
||||||
|
<FormControl>
|
||||||
|
<Textarea
|
||||||
|
placeholder="Appunti su questo lead"
|
||||||
|
className="resize-none"
|
||||||
|
{...field}
|
||||||
|
/>
|
||||||
|
</FormControl>
|
||||||
|
<FormMessage />
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<Button type="submit" className="w-full">
|
||||||
|
Crea Lead
|
||||||
|
</Button>
|
||||||
|
</form>
|
||||||
|
</Form>
|
||||||
|
</DialogContent>
|
||||||
|
</Dialog>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function EditLeadModal({ lead }: { lead: Lead }) {
|
||||||
|
const [open, setOpen] = useState(false);
|
||||||
|
const form = useForm<CreateLeadInput>({
|
||||||
|
resolver: zodResolver(createLeadSchema),
|
||||||
|
defaultValues: {
|
||||||
|
name: lead.name,
|
||||||
|
email: lead.email || "",
|
||||||
|
phone: lead.phone || "",
|
||||||
|
company: lead.company || "",
|
||||||
|
status: lead.status as any,
|
||||||
|
notes: lead.notes || "",
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
async function onSubmit(data: CreateLeadInput) {
|
||||||
|
const result = await updateLead(lead.id, data);
|
||||||
|
if (result.success) {
|
||||||
|
setOpen(false);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Dialog open={open} onOpenChange={setOpen}>
|
||||||
|
<DialogTrigger asChild>
|
||||||
|
<Button variant="outline" size="sm">
|
||||||
|
Modifica
|
||||||
|
</Button>
|
||||||
|
</DialogTrigger>
|
||||||
|
<DialogContent className="max-w-md">
|
||||||
|
<DialogHeader>
|
||||||
|
<DialogTitle>Modifica Lead</DialogTitle>
|
||||||
|
</DialogHeader>
|
||||||
|
<Form {...form}>
|
||||||
|
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
|
||||||
|
{/* Same form fields as CreateLeadModal */}
|
||||||
|
<Button type="submit" className="w-full">
|
||||||
|
Salva
|
||||||
|
</Button>
|
||||||
|
</form>
|
||||||
|
</Form>
|
||||||
|
</DialogContent>
|
||||||
|
</Dialog>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
File: `src/app/admin/leads/actions.ts`
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
"use server";
|
||||||
|
|
||||||
|
import { z } from "zod";
|
||||||
|
import { db } from "@/db";
|
||||||
|
import { leads } from "@/db/schema";
|
||||||
|
import { eq } from "drizzle-orm";
|
||||||
|
import { createLeadSchema, updateLeadSchema } from "@/lib/lead-validators";
|
||||||
|
import { revalidatePath } from "next/cache";
|
||||||
|
|
||||||
|
export async function createLead(data: z.infer<typeof createLeadSchema>) {
|
||||||
|
const parsed = createLeadSchema.safeParse(data);
|
||||||
|
|
||||||
|
if (!parsed.success) {
|
||||||
|
return { success: false, error: parsed.error.issues[0].message };
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
const [lead] = await db
|
||||||
|
.insert(leads)
|
||||||
|
.values({
|
||||||
|
name: parsed.data.name,
|
||||||
|
email: parsed.data.email || null,
|
||||||
|
phone: parsed.data.phone || null,
|
||||||
|
company: parsed.data.company || null,
|
||||||
|
status: parsed.data.status || "contacted",
|
||||||
|
notes: parsed.data.notes || null,
|
||||||
|
})
|
||||||
|
.returning();
|
||||||
|
|
||||||
|
revalidatePath("/admin/leads");
|
||||||
|
return { success: true, lead };
|
||||||
|
} catch (error) {
|
||||||
|
console.error("createLead error:", error);
|
||||||
|
return { success: false, error: "Errore nella creazione del lead" };
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function updateLead(
|
||||||
|
id: string,
|
||||||
|
data: z.infer<typeof updateLeadSchema>
|
||||||
|
) {
|
||||||
|
const parsed = updateLeadSchema.safeParse(data);
|
||||||
|
|
||||||
|
if (!parsed.success) {
|
||||||
|
return { success: false, error: parsed.error.issues[0].message };
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
const [updated] = await db
|
||||||
|
.update(leads)
|
||||||
|
.set({
|
||||||
|
...parsed.data,
|
||||||
|
updated_at: new Date(),
|
||||||
|
})
|
||||||
|
.where(eq(leads.id, id))
|
||||||
|
.returning();
|
||||||
|
|
||||||
|
revalidatePath("/admin/leads");
|
||||||
|
revalidatePath(`/admin/leads/${id}`);
|
||||||
|
return { success: true, lead: updated };
|
||||||
|
} catch (error) {
|
||||||
|
console.error("updateLead error:", error);
|
||||||
|
return { success: false, error: "Errore nell'aggiornamento" };
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function deleteLead(id: string) {
|
||||||
|
try {
|
||||||
|
await db.delete(leads).where(eq(leads.id, id));
|
||||||
|
revalidatePath("/admin/leads");
|
||||||
|
return { success: true };
|
||||||
|
} catch (error) {
|
||||||
|
console.error("deleteLead error:", error);
|
||||||
|
return { success: false, error: "Errore nell'eliminazione" };
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
**Design notes:**
|
||||||
|
- LeadForm uses React Hook Form + Zod for validation per existing patterns
|
||||||
|
- Modal dialog for create/edit (reusable component)
|
||||||
|
- Server actions handle DB mutations with error handling
|
||||||
|
- Revalidate paths after mutation to sync UI
|
||||||
|
</action>
|
||||||
|
<verify>
|
||||||
|
<automated>npm run build 2>&1 | grep -c "error" | grep -q 0 && echo "Lead form and actions compile"</automated>
|
||||||
|
</verify>
|
||||||
|
<done>LeadForm component (create/edit modal) and server actions (createLead, updateLead, deleteLead) created. Forms integrate React Hook Form + Zod. Server actions handle validation and DB mutations.</done>
|
||||||
|
</task>
|
||||||
|
|
||||||
|
</tasks>
|
||||||
|
|
||||||
|
<threat_model>
|
||||||
|
## Trust Boundaries
|
||||||
|
|
||||||
|
| Boundary | Description |
|
||||||
|
|----------|-------------|
|
||||||
|
| Admin → Lead Form Input | Server-side validation via Zod; no XSS via textarea notes; sanitize on display |
|
||||||
|
| Lead List Export | No export endpoint in Phase 10; leads data accessible to admin only |
|
||||||
|
|
||||||
|
## STRIDE Threat Register
|
||||||
|
|
||||||
|
| Threat ID | Category | Component | Disposition | Mitigation Plan |
|
||||||
|
|-----------|----------|-----------|-------------|-----------------|
|
||||||
|
| T-10-07 | Injection | XSS via lead notes textarea | mitigate | Notes stored as text; rendered in admin area with React (auto-escaped); no HTML parsing |
|
||||||
|
| T-10-08 | Tampering | Bulk delete leads via API | mitigate | Delete action requires Auth.js session; no bulk-delete in Phase 10 UI |
|
||||||
|
| T-10-09 | Information Disclosure | Lead data exposed via form autocomplete | accept | Browser autocomplete on email/phone fields; acceptable for internal admin |
|
||||||
|
|
||||||
|
</threat_model>
|
||||||
|
|
||||||
|
<verification>
|
||||||
|
After Phase 10 Plan 2 execution:
|
||||||
|
|
||||||
|
1. `/admin/leads` list page loads and displays all leads with status badges
|
||||||
|
2. `/admin/leads/[id]` detail page shows full lead profile, activity log, reminders, and action buttons
|
||||||
|
3. Create Lead modal opens and submits via server action
|
||||||
|
4. Form validation rejects invalid emails, empty names
|
||||||
|
5. Server actions handle DB inserts/updates and revalidate paths
|
||||||
|
6. Lead Table component renders with correct badge colors per stage
|
||||||
|
</verification>
|
||||||
|
|
||||||
|
<success_criteria>
|
||||||
|
- `/admin/leads` list page operational with searchable lead table
|
||||||
|
- `/admin/leads/[id]` detail page shows lead profile, activity log, upcoming reminders
|
||||||
|
- Create Lead modal form with all fields (name, email, phone, company, status, notes)
|
||||||
|
- Edit Lead modal reuses same form schema
|
||||||
|
- Server actions createLead, updateLead, deleteLead working with Zod validation
|
||||||
|
- UI integrates with lead-service query layer
|
||||||
|
- Path revalidation syncs UI after mutations
|
||||||
|
</success_criteria>
|
||||||
|
|
||||||
|
<output>
|
||||||
|
After execution, create `.planning/phases/10-crm-pipeline-activity-logging/10-02-SUMMARY.md`
|
||||||
|
</output>
|
||||||
@@ -0,0 +1,639 @@
|
|||||||
|
---
|
||||||
|
phase: 10
|
||||||
|
plan: 03
|
||||||
|
type: execute
|
||||||
|
wave: 2
|
||||||
|
depends_on: [10-01, 10-02]
|
||||||
|
files_modified:
|
||||||
|
- src/components/admin/leads/LogActivityModal.tsx
|
||||||
|
- src/components/admin/leads/SendQuoteModal.tsx
|
||||||
|
- src/app/admin/leads/actions.ts
|
||||||
|
- src/components/admin/dashboard/FollowUpWidget.tsx
|
||||||
|
- src/app/admin/page.tsx
|
||||||
|
autonomous: true
|
||||||
|
requirements:
|
||||||
|
- CRM-04
|
||||||
|
- CRM-05
|
||||||
|
- CRM-06
|
||||||
|
- CRM-07
|
||||||
|
---
|
||||||
|
|
||||||
|
<objective>
|
||||||
|
Phase 10 CRM UI (Part 2): Implement activity logging modal (<10 sec UX), send quote button with lead status update, and follow-up reminders widget on admin dashboard. Complete the CRM workflow with activity tracking and lead progression.
|
||||||
|
|
||||||
|
Purpose: Enable admins to quickly log interactions (calls, emails, meetings, notes) and transition leads through the pipeline. "Send Quote" button creates/selects quotes and updates lead status to "proposal_sent". Follow-up widget on dashboard highlights leads needing contact (last contact > 7 days ago).
|
||||||
|
|
||||||
|
Output:
|
||||||
|
- LogActivityModal: fast form (type dropdown, date picker, optional duration, notes) with server action
|
||||||
|
- SendQuoteModal: select existing quote or create new, auto-update lead.status → "proposal_sent"
|
||||||
|
- FollowUpWidget: dashboard card showing leads needing follow-up (count + link to /admin/leads)
|
||||||
|
- Server actions: createActivity (auto-updates lead.last_contact_date), updateLeadStageViaQuote
|
||||||
|
- Activity list updates immediately after form submit
|
||||||
|
</objective>
|
||||||
|
|
||||||
|
<execution_context>
|
||||||
|
@$HOME/.claude/get-shit-done/workflows/execute-plan.md
|
||||||
|
@$HOME/.claude/get-shit-done/templates/summary.md
|
||||||
|
</execution_context>
|
||||||
|
|
||||||
|
<context>
|
||||||
|
@.planning/PROJECT.md
|
||||||
|
@.planning/ROADMAP.md
|
||||||
|
@.planning/STATE.md
|
||||||
|
@.planning/REQUIREMENTS.md
|
||||||
|
@.planning/phases/10-crm-pipeline-activity-logging/10-01-SUMMARY.md
|
||||||
|
@.planning/phases/10-crm-pipeline-activity-logging/10-02-SUMMARY.md
|
||||||
|
</context>
|
||||||
|
|
||||||
|
<interfaces>
|
||||||
|
From src/lib/lead-service.ts (created in Plan 1):
|
||||||
|
```typescript
|
||||||
|
export async function createActivity(data: {
|
||||||
|
lead_id: string;
|
||||||
|
type: string;
|
||||||
|
activity_date: Date;
|
||||||
|
duration_minutes?: number;
|
||||||
|
notes: string;
|
||||||
|
}): Promise<Activity>;
|
||||||
|
export async function getLeadsNeedingFollowUp(daysAgo?: number): Promise<Lead[]>;
|
||||||
|
```
|
||||||
|
|
||||||
|
From src/lib/lead-validators.ts (created in Plan 1):
|
||||||
|
```typescript
|
||||||
|
export const ACTIVITY_TYPES = ["call", "email", "meeting", "note"] as const;
|
||||||
|
export const createActivitySchema: ZodType<{ lead_id, type, activity_date, duration_minutes?, notes }>;
|
||||||
|
```
|
||||||
|
|
||||||
|
From existing quote-service.ts (Phase 9):
|
||||||
|
```typescript
|
||||||
|
export async function getQuoteByTokenAdmin(token: string);
|
||||||
|
export async function createQuote(data: any): Promise<Quote>;
|
||||||
|
```
|
||||||
|
</interfaces>
|
||||||
|
|
||||||
|
<tasks>
|
||||||
|
|
||||||
|
<task type="auto">
|
||||||
|
<name>Task 1: Create LogActivityModal component and server action</name>
|
||||||
|
<files>src/components/admin/leads/LogActivityModal.tsx, src/app/admin/leads/actions.ts</files>
|
||||||
|
<action>
|
||||||
|
File: `src/components/admin/leads/LogActivityModal.tsx`
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
"use client";
|
||||||
|
|
||||||
|
import { useState } from "react";
|
||||||
|
import { useForm } from "react-hook-form";
|
||||||
|
import { zodResolver } from "@hookform/resolvers/zod";
|
||||||
|
import { z } from "zod";
|
||||||
|
import { createActivitySchema, ACTIVITY_TYPES } from "@/lib/lead-validators";
|
||||||
|
import { logActivity } from "@/app/admin/leads/actions";
|
||||||
|
import {
|
||||||
|
Dialog,
|
||||||
|
DialogContent,
|
||||||
|
DialogHeader,
|
||||||
|
DialogTitle,
|
||||||
|
DialogTrigger,
|
||||||
|
} from "@/components/ui/dialog";
|
||||||
|
import {
|
||||||
|
Form,
|
||||||
|
FormControl,
|
||||||
|
FormField,
|
||||||
|
FormItem,
|
||||||
|
FormLabel,
|
||||||
|
FormMessage,
|
||||||
|
} from "@/components/ui/form";
|
||||||
|
import {
|
||||||
|
Select,
|
||||||
|
SelectContent,
|
||||||
|
SelectItem,
|
||||||
|
SelectTrigger,
|
||||||
|
SelectValue,
|
||||||
|
} from "@/components/ui/select";
|
||||||
|
import { Input } from "@/components/ui/input";
|
||||||
|
import { Textarea } from "@/components/ui/textarea";
|
||||||
|
import { Button } from "@/components/ui/button";
|
||||||
|
|
||||||
|
type LogActivityInput = z.infer<typeof createActivitySchema>;
|
||||||
|
|
||||||
|
export function LogActivityModal({ leadId }: { leadId: string }) {
|
||||||
|
const [open, setOpen] = useState(false);
|
||||||
|
const form = useForm<LogActivityInput>({
|
||||||
|
resolver: zodResolver(createActivitySchema),
|
||||||
|
defaultValues: {
|
||||||
|
lead_id: leadId,
|
||||||
|
type: "note",
|
||||||
|
activity_date: new Date().toISOString().split("T")[0],
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
async function onSubmit(data: LogActivityInput) {
|
||||||
|
const result = await logActivity(data);
|
||||||
|
if (result.success) {
|
||||||
|
setOpen(false);
|
||||||
|
form.reset({
|
||||||
|
lead_id: leadId,
|
||||||
|
type: "note",
|
||||||
|
activity_date: new Date().toISOString().split("T")[0],
|
||||||
|
});
|
||||||
|
// TODO: Toast success + revalidate parent activity log
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Dialog open={open} onOpenChange={setOpen}>
|
||||||
|
<DialogTrigger asChild>
|
||||||
|
<Button variant="outline" size="sm">
|
||||||
|
Registra Attività
|
||||||
|
</Button>
|
||||||
|
</DialogTrigger>
|
||||||
|
<DialogContent className="max-w-sm">
|
||||||
|
<DialogHeader>
|
||||||
|
<DialogTitle>Registra Attività</DialogTitle>
|
||||||
|
</DialogHeader>
|
||||||
|
<Form {...form}>
|
||||||
|
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="type"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem>
|
||||||
|
<FormLabel>Tipo</FormLabel>
|
||||||
|
<Select onValueChange={field.onChange} defaultValue={field.value}>
|
||||||
|
<FormControl>
|
||||||
|
<SelectTrigger>
|
||||||
|
<SelectValue />
|
||||||
|
</SelectTrigger>
|
||||||
|
</FormControl>
|
||||||
|
<SelectContent>
|
||||||
|
{ACTIVITY_TYPES.map((type) => (
|
||||||
|
<SelectItem key={type} value={type}>
|
||||||
|
{type.charAt(0).toUpperCase() + type.slice(1)}
|
||||||
|
</SelectItem>
|
||||||
|
))}
|
||||||
|
</SelectContent>
|
||||||
|
</Select>
|
||||||
|
<FormMessage />
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="activity_date"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem>
|
||||||
|
<FormLabel>Data</FormLabel>
|
||||||
|
<FormControl>
|
||||||
|
<Input type="date" {...field} />
|
||||||
|
</FormControl>
|
||||||
|
<FormMessage />
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="duration_minutes"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem>
|
||||||
|
<FormLabel>Durata (minuti) - opzionale</FormLabel>
|
||||||
|
<FormControl>
|
||||||
|
<Input
|
||||||
|
type="number"
|
||||||
|
placeholder="30"
|
||||||
|
{...field}
|
||||||
|
value={field.value || ""}
|
||||||
|
/>
|
||||||
|
</FormControl>
|
||||||
|
<FormMessage />
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="notes"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem>
|
||||||
|
<FormLabel>Note</FormLabel>
|
||||||
|
<FormControl>
|
||||||
|
<Textarea
|
||||||
|
placeholder="Descrivi l'interazione..."
|
||||||
|
className="resize-none h-24"
|
||||||
|
{...field}
|
||||||
|
/>
|
||||||
|
</FormControl>
|
||||||
|
<FormMessage />
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<Button type="submit" className="w-full">
|
||||||
|
Registra
|
||||||
|
</Button>
|
||||||
|
</form>
|
||||||
|
</Form>
|
||||||
|
</DialogContent>
|
||||||
|
</Dialog>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
**Update src/app/admin/leads/actions.ts** — add logActivity server action:
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
export async function logActivity(
|
||||||
|
data: z.infer<typeof createActivitySchema>
|
||||||
|
) {
|
||||||
|
const parsed = createActivitySchema.safeParse(data);
|
||||||
|
|
||||||
|
if (!parsed.success) {
|
||||||
|
return { success: false, error: parsed.error.issues[0].message };
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
const activity = await createActivity({
|
||||||
|
lead_id: parsed.data.lead_id,
|
||||||
|
type: parsed.data.type,
|
||||||
|
activity_date: new Date(parsed.data.activity_date),
|
||||||
|
duration_minutes: parsed.data.duration_minutes,
|
||||||
|
notes: parsed.data.notes,
|
||||||
|
});
|
||||||
|
|
||||||
|
revalidatePath(`/admin/leads/${parsed.data.lead_id}`);
|
||||||
|
return { success: true, activity };
|
||||||
|
} catch (error) {
|
||||||
|
console.error("logActivity error:", error);
|
||||||
|
return { success: false, error: "Errore nella registrazione" };
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
**Design notes:**
|
||||||
|
- Fast form: type dropdown, date picker (default today), optional duration, notes textarea
|
||||||
|
- All fields required except duration
|
||||||
|
- Submit calls createActivity server action (which auto-updates lead.last_contact_date)
|
||||||
|
- Modal closes on success, form resets
|
||||||
|
- Target <10 seconds UX per CRM-05
|
||||||
|
</action>
|
||||||
|
<verify>
|
||||||
|
<automated>npm run build 2>&1 | grep -c "error" | grep -q 0 && echo "LogActivity modal compiles"</automated>
|
||||||
|
</verify>
|
||||||
|
<done>LogActivityModal component created with fast form (<10 sec UX). Server action logActivity handles activity creation and auto-updates lead.last_contact_date. Modal closes on success.</done>
|
||||||
|
</task>
|
||||||
|
|
||||||
|
<task type="auto">
|
||||||
|
<name>Task 2: Create SendQuoteModal component and quote assignment logic</name>
|
||||||
|
<files>src/components/admin/leads/SendQuoteModal.tsx, src/app/admin/leads/actions.ts</files>
|
||||||
|
<action>
|
||||||
|
File: `src/components/admin/leads/SendQuoteModal.tsx`
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
"use client";
|
||||||
|
|
||||||
|
import { useState } from "react";
|
||||||
|
import { useForm } from "react-hook-form";
|
||||||
|
import { zodResolver } from "@hookform/resolvers/zod";
|
||||||
|
import { z } from "zod";
|
||||||
|
import { assignQuoteToLead } from "@/app/admin/leads/actions";
|
||||||
|
import {
|
||||||
|
Dialog,
|
||||||
|
DialogContent,
|
||||||
|
DialogHeader,
|
||||||
|
DialogTitle,
|
||||||
|
DialogTrigger,
|
||||||
|
} from "@/components/ui/dialog";
|
||||||
|
import {
|
||||||
|
Form,
|
||||||
|
FormControl,
|
||||||
|
FormField,
|
||||||
|
FormItem,
|
||||||
|
FormLabel,
|
||||||
|
FormMessage,
|
||||||
|
} from "@/components/ui/form";
|
||||||
|
import { Input } from "@/components/ui/input";
|
||||||
|
import { Button } from "@/components/ui/button";
|
||||||
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
|
||||||
|
import { Loader2 } from "lucide-react";
|
||||||
|
|
||||||
|
const assignQuoteSchema = z.object({
|
||||||
|
lead_id: z.string(),
|
||||||
|
quote_token: z.string().optional(),
|
||||||
|
generate_new: z.boolean().default(false),
|
||||||
|
});
|
||||||
|
|
||||||
|
export function SendQuoteModal({ leadId }: { leadId: string }) {
|
||||||
|
const [open, setOpen] = useState(false);
|
||||||
|
const [loading, setLoading] = useState(false);
|
||||||
|
const [tab, setTab] = useState<"existing" | "new">("existing");
|
||||||
|
const form = useForm<z.infer<typeof assignQuoteSchema>>({
|
||||||
|
resolver: zodResolver(assignQuoteSchema),
|
||||||
|
defaultValues: {
|
||||||
|
lead_id: leadId,
|
||||||
|
generate_new: false,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
async function onSubmit(data: z.infer<typeof assignQuoteSchema>) {
|
||||||
|
setLoading(true);
|
||||||
|
try {
|
||||||
|
const result = await assignQuoteToLead({
|
||||||
|
...data,
|
||||||
|
generate_new: tab === "new",
|
||||||
|
});
|
||||||
|
if (result.success) {
|
||||||
|
setOpen(false);
|
||||||
|
form.reset();
|
||||||
|
// TODO: Toast success
|
||||||
|
}
|
||||||
|
} finally {
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Dialog open={open} onOpenChange={setOpen}>
|
||||||
|
<DialogTrigger asChild>
|
||||||
|
<Button variant="outline" size="sm">
|
||||||
|
Invia Preventivo
|
||||||
|
</Button>
|
||||||
|
</DialogTrigger>
|
||||||
|
<DialogContent className="max-w-md">
|
||||||
|
<DialogHeader>
|
||||||
|
<DialogTitle>Invia Preventivo al Lead</DialogTitle>
|
||||||
|
</DialogHeader>
|
||||||
|
<Tabs value={tab} onValueChange={(v) => setTab(v as "existing" | "new")}>
|
||||||
|
<TabsList className="grid w-full grid-cols-2">
|
||||||
|
<TabsTrigger value="existing">Preventivo Esistente</TabsTrigger>
|
||||||
|
<TabsTrigger value="new">Crea Nuovo</TabsTrigger>
|
||||||
|
</TabsList>
|
||||||
|
|
||||||
|
<TabsContent value="existing" className="mt-4">
|
||||||
|
<Form {...form}>
|
||||||
|
<form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
|
||||||
|
<FormField
|
||||||
|
control={form.control}
|
||||||
|
name="quote_token"
|
||||||
|
render={({ field }) => (
|
||||||
|
<FormItem>
|
||||||
|
<FormLabel>Token Preventivo</FormLabel>
|
||||||
|
<FormControl>
|
||||||
|
<Input
|
||||||
|
placeholder="Incolla il token del preventivo"
|
||||||
|
{...field}
|
||||||
|
/>
|
||||||
|
</FormControl>
|
||||||
|
<FormMessage />
|
||||||
|
</FormItem>
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
<p className="text-xs text-gray-600">
|
||||||
|
Copia il token dal preventivo e incollalo qui. Il lead sarà aggiornato a "Proposal Sent".
|
||||||
|
</p>
|
||||||
|
<Button type="submit" disabled={loading} className="w-full">
|
||||||
|
{loading && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
|
||||||
|
Invia
|
||||||
|
</Button>
|
||||||
|
</form>
|
||||||
|
</Form>
|
||||||
|
</TabsContent>
|
||||||
|
|
||||||
|
<TabsContent value="new" className="mt-4">
|
||||||
|
<p className="text-sm text-gray-600 mb-4">
|
||||||
|
Crea un nuovo preventivo per questo lead. Ti reindirizzeremo al builder.
|
||||||
|
</p>
|
||||||
|
<Button
|
||||||
|
className="w-full"
|
||||||
|
onClick={() => {
|
||||||
|
// Redirect to quote builder pre-filled with this lead
|
||||||
|
window.location.href = `/admin/quotes/new?lead_id=${leadId}`;
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Apri Quote Builder
|
||||||
|
</Button>
|
||||||
|
</TabsContent>
|
||||||
|
</Tabs>
|
||||||
|
</DialogContent>
|
||||||
|
</Dialog>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
**Update src/app/admin/leads/actions.ts** — add assignQuoteToLead server action:
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
const assignQuoteSchema = z.object({
|
||||||
|
lead_id: z.string().min(1),
|
||||||
|
quote_token: z.string().optional(),
|
||||||
|
generate_new: z.boolean(),
|
||||||
|
});
|
||||||
|
|
||||||
|
export async function assignQuoteToLead(
|
||||||
|
data: z.infer<typeof assignQuoteSchema>
|
||||||
|
) {
|
||||||
|
const parsed = assignQuoteSchema.safeParse(data);
|
||||||
|
|
||||||
|
if (!parsed.success) {
|
||||||
|
return { success: false, error: parsed.error.issues[0].message };
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
if (parsed.data.generate_new) {
|
||||||
|
// Redirect handled on client; this is a no-op
|
||||||
|
return { success: true };
|
||||||
|
}
|
||||||
|
|
||||||
|
// Link quote to lead and update lead status
|
||||||
|
const token = parsed.data.quote_token;
|
||||||
|
const leadId = parsed.data.lead_id;
|
||||||
|
|
||||||
|
// Find quote by token
|
||||||
|
const [quote] = await db
|
||||||
|
.select()
|
||||||
|
.from(quotes)
|
||||||
|
.where(eq(quotes.token, token))
|
||||||
|
.limit(1);
|
||||||
|
|
||||||
|
if (!quote) {
|
||||||
|
return { success: false, error: "Preventivo non trovato" };
|
||||||
|
}
|
||||||
|
|
||||||
|
// Update quote to link to lead (if not already linked)
|
||||||
|
await db
|
||||||
|
.update(quotes)
|
||||||
|
.set({ lead_id: leadId })
|
||||||
|
.where(eq(quotes.id, quote.id));
|
||||||
|
|
||||||
|
// Update lead status to "proposal_sent"
|
||||||
|
await updateLeadStage(leadId, "proposal_sent");
|
||||||
|
|
||||||
|
revalidatePath(`/admin/leads/${leadId}`);
|
||||||
|
return { success: true };
|
||||||
|
} catch (error) {
|
||||||
|
console.error("assignQuoteToLead error:", error);
|
||||||
|
return { success: false, error: "Errore nell'assegnazione" };
|
||||||
|
}
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
**Design notes:**
|
||||||
|
- Two tabs: existing quote (paste token) or create new (redirect to quote builder)
|
||||||
|
- Existing quote flow: copy token from /admin/quotes page, paste here, submit
|
||||||
|
- New quote flow: opens quote builder pre-filled with lead_id query param
|
||||||
|
- Submit updates lead.status → "proposal_sent" and links quote to lead
|
||||||
|
- CRM-07 requirement satisfied: "Send Quote" button + status update
|
||||||
|
</action>
|
||||||
|
<verify>
|
||||||
|
<automated>npm run build 2>&1 | grep -c "error" | grep -q 0 && echo "SendQuote modal compiles"</automated>
|
||||||
|
</verify>
|
||||||
|
<done>SendQuoteModal component created with two tabs (existing quote / create new). Server action assignQuoteToLead links quote to lead and updates status to "proposal_sent".</done>
|
||||||
|
</task>
|
||||||
|
|
||||||
|
<task type="auto">
|
||||||
|
<name>Task 3: Create FollowUpWidget for admin dashboard</name>
|
||||||
|
<files>src/components/admin/dashboard/FollowUpWidget.tsx, src/app/admin/page.tsx</files>
|
||||||
|
<action>
|
||||||
|
File: `src/components/admin/dashboard/FollowUpWidget.tsx`
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
import { getLeadsNeedingFollowUp } from "@/lib/lead-service";
|
||||||
|
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
||||||
|
import { Button } from "@/components/ui/button";
|
||||||
|
import { AlertCircle } from "lucide-react";
|
||||||
|
import Link from "next/link";
|
||||||
|
|
||||||
|
export async function FollowUpWidget() {
|
||||||
|
const leadsNeedingFollowUp = await getLeadsNeedingFollowUp(7); // 7 days
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Card className="border-orange-200 bg-orange-50">
|
||||||
|
<CardHeader>
|
||||||
|
<CardTitle className="flex items-center gap-2">
|
||||||
|
<AlertCircle className="h-5 w-5 text-orange-600" />
|
||||||
|
Require Follow-up
|
||||||
|
</CardTitle>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent className="space-y-4">
|
||||||
|
{leadsNeedingFollowUp.length > 0 ? (
|
||||||
|
<>
|
||||||
|
<p className="text-lg font-bold text-orange-900">
|
||||||
|
{leadsNeedingFollowUp.length} lead{leadsNeedingFollowUp.length !== 1 ? "s" : ""} to contact
|
||||||
|
</p>
|
||||||
|
<ul className="space-y-2 text-sm">
|
||||||
|
{leadsNeedingFollowUp.slice(0, 3).map((lead) => (
|
||||||
|
<li key={lead.id} className="flex justify-between items-center">
|
||||||
|
<span>{lead.name}</span>
|
||||||
|
<Button variant="ghost" size="sm" asChild>
|
||||||
|
<Link href={`/admin/leads/${lead.id}`}>Contact</Link>
|
||||||
|
</Button>
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
{leadsNeedingFollowUp.length > 3 && (
|
||||||
|
<Button variant="outline" className="w-full" asChild>
|
||||||
|
<Link href="/admin/leads">View All ({leadsNeedingFollowUp.length})</Link>
|
||||||
|
</Button>
|
||||||
|
)}
|
||||||
|
</>
|
||||||
|
) : (
|
||||||
|
<p className="text-gray-600 text-sm">All leads are up to date!</p>
|
||||||
|
)}
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
**Update src/app/admin/page.tsx** — add FollowUpWidget to dashboard:
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
import { Suspense } from "react";
|
||||||
|
import { FollowUpWidget } from "@/components/admin/dashboard/FollowUpWidget";
|
||||||
|
// ... other imports
|
||||||
|
|
||||||
|
export default function AdminDashboard() {
|
||||||
|
return (
|
||||||
|
<div className="space-y-6">
|
||||||
|
<h1 className="text-3xl font-bold">Dashboard</h1>
|
||||||
|
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-4 gap-4">
|
||||||
|
{/* Existing KPI cards */}
|
||||||
|
{/* ... */}
|
||||||
|
|
||||||
|
{/* NEW: Follow-up Widget */}
|
||||||
|
<Suspense fallback={<div className="animate-pulse">Loading...</div>}>
|
||||||
|
<FollowUpWidget />
|
||||||
|
</Suspense>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Other dashboard sections */}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
**Design notes:**
|
||||||
|
- Widget shows count of leads with last_contact_date < 7 days (or null)
|
||||||
|
- Lists top 3 leads with quick "Contact" link to lead detail page
|
||||||
|
- Link to /admin/leads for full list
|
||||||
|
- Orange highlight to grab attention (follow-up needed)
|
||||||
|
- CRM-06 requirement: "Follow up today" widget on dashboard
|
||||||
|
</action>
|
||||||
|
<verify>
|
||||||
|
<automated>npm run build 2>&1 | grep -c "error" | grep -q 0 && echo "Dashboard widget compiles"</automated>
|
||||||
|
</verify>
|
||||||
|
<done>FollowUpWidget component created for admin dashboard. Displays count of leads needing follow-up (last contact > 7 days) and quick-access links to contact them.</done>
|
||||||
|
</task>
|
||||||
|
|
||||||
|
</tasks>
|
||||||
|
|
||||||
|
<threat_model>
|
||||||
|
## Trust Boundaries
|
||||||
|
|
||||||
|
| Boundary | Description |
|
||||||
|
|----------|-------------|
|
||||||
|
| Admin → Activity Form | Server-side validation; no XSS via notes field |
|
||||||
|
| Admin → Quote Linking | Quote token validated against database; no arbitrary token acceptance |
|
||||||
|
|
||||||
|
## STRIDE Threat Register
|
||||||
|
|
||||||
|
| Threat ID | Category | Component | Disposition | Mitigation Plan |
|
||||||
|
|-----------|----------|-----------|-------------|-----------------|
|
||||||
|
| T-10-10 | Tampering | Backdating activity with future date | accept | No validation in Phase 10; assume admin honesty; add validation if abuse occurs |
|
||||||
|
| T-10-11 | Tampering | Linking wrong quote to lead | mitigate | Quote token validated; admin must copy correct token; no fuzzy matching |
|
||||||
|
| T-10-12 | Information Disclosure | Lead names visible in dashboard widget | accept | Widget shown only to authenticated admin; no PII leakage |
|
||||||
|
| T-10-13 | Denial of Service | Spam activity creation | mitigate | Server action validates; no rate limit in Phase 10; add if needed |
|
||||||
|
|
||||||
|
</threat_model>
|
||||||
|
|
||||||
|
<verification>
|
||||||
|
After Phase 10 Plan 3 execution:
|
||||||
|
|
||||||
|
1. LogActivityModal opens from lead detail page
|
||||||
|
2. Activity form submits and closes on success
|
||||||
|
3. Lead.last_contact_date auto-updates after activity logged
|
||||||
|
4. Activity list on lead detail page refreshes
|
||||||
|
5. SendQuoteModal opens with two tabs (existing / new)
|
||||||
|
6. Existing quote: paste token, submit, lead status → "proposal_sent"
|
||||||
|
7. New quote: button redirects to quote builder with lead_id param
|
||||||
|
8. Dashboard FollowUpWidget displays lead count
|
||||||
|
9. Widget links lead to detail page for follow-up contact
|
||||||
|
</verification>
|
||||||
|
|
||||||
|
<success_criteria>
|
||||||
|
- LogActivityModal renders in lead detail page with all fields (type, date, duration, notes)
|
||||||
|
- Activity form validates and submits via server action
|
||||||
|
- Lead.last_contact_date updates automatically after activity logged
|
||||||
|
- Activity list on lead detail page reflects new activity immediately
|
||||||
|
- SendQuoteModal works with existing quote token flow
|
||||||
|
- SendQuoteModal "Create New" redirects to quote builder pre-filled with lead_id
|
||||||
|
- Quote assignment updates lead.status to "proposal_sent"
|
||||||
|
- FollowUpWidget on admin dashboard shows lead count needing follow-up
|
||||||
|
- Widget lists top 3 leads with quick-access links
|
||||||
|
- All forms follow <10 sec UX pattern (CRM-05)
|
||||||
|
</success_criteria>
|
||||||
|
|
||||||
|
<output>
|
||||||
|
After execution, create `.planning/phases/10-crm-pipeline-activity-logging/10-03-SUMMARY.md`
|
||||||
|
</output>
|
||||||
Reference in New Issue
Block a user