Client Pre-Screen

A production-style Angular application for legal intake teams to quickly qualify leads before a consultation.

Client Pre-Screen guides staff through a structured questionnaire, scores responses, flags risk indicators, and produces call-ready summaries with local persistence and optional Firestore sync.

Why This Project Exists

Many intake workflows are still fragmented across calls, notes, and ad hoc forms. This project demonstrates how to convert that process into a focused, repeatable product experience:

• one-question-at-a-time guided flow
• consistent scoring logic with transparent reasoning
• immediate outcome classification (Qualified, Review, Red Flag)
• searchable response history and downloadable lead summaries

What It Does

The app supports two screening modes:

• Essential mode: fast 5-question qualification
• Comprehensive mode: deeper 18-question qualification

Both modes include an initial contact-info step and generate:

• normalized score out of 100
• outcome recommendation
• per-question reasoning breakdown
• lead detail view with PDF export

Product Flow

1. Start a new pre-screen from the landing page.
2. Choose Essential or Comprehensive flow.
3. Complete guided questions (with validation gates).
4. Save results locally and attempt Firestore sync.
5. Review in Results, Leads, Response Detail, and Archived views.

Screenshots

Start Experience (Desktop)

Questionnaire Flow (Desktop)

Results Dashboard (Desktop)

Leads Queue (Desktop)

Mobile Preview

Core Features

• Angular standalone component architecture with route-level lazy loading
• Signal-based state management for quiz progression and answer tracking
• Outcome engine with both score thresholds and forced red/review conditions
• Local-first storage (localStorage) for resilience
• Optional Firestore persistence for centralized records
• Firebase Analytics events for core user interactions
• PDF lead summary export via jspdf
• SEO metadata and indexable content pages for discoverability

Tech Stack

• Angular 20
• TypeScript 5
• Firebase (Firestore + Analytics)
• Playwright (E2E)
• Karma/Jasmine (unit tests)

Local Development

1) Install dependencies

npm install

2) Configure Firebase (local only)

This repository intentionally does not commit src/app/firebase.config.ts.

Create src/app/firebase.config.ts locally:

export const firebaseConfig = {
	apiKey: 'YOUR_PUBLIC_FIREBASE_API_KEY',
	authDomain: 'YOUR_PROJECT.firebaseapp.com',
	projectId: 'YOUR_PROJECT_ID',
	storageBucket: 'YOUR_PROJECT.firebasestorage.app',
	messagingSenderId: 'YOUR_MESSAGING_SENDER_ID',
	appId: 'YOUR_APP_ID',
	measurementId: 'YOUR_MEASUREMENT_ID',
};

Note: Firebase web config is generally public by design. Secure data access should be enforced through Firebase Auth and Firestore Security Rules.

3) Start the app

npm start

Open http://localhost:4200/.

Available Scripts

• npm start - run development server
• npm run build - production build
• npm test - unit tests
• npm run e2e - Playwright end-to-end tests
• npm run e2e:ui - Playwright UI mode
• npm run e2e:report - open Playwright report

Security and Privacy Notes

• No .env files are required by default for local development.
• Firebase config file is excluded from git by .gitignore.
• Responses are stored locally first, then optionally synced.
• Public release hygiene should include periodic secret scanning and rules review.

Roadmap Ideas

• role-based access for intake staff
• webhook/CRM integrations
• richer analytics dashboard
• configurable scoring model per practice area

License

Licensed under the MIT License. See LICENSE.