iec-cli 0.6.6

package/dist/templates/mga/{{name}}-web/src/app/applications/new/page.tsx

@@ -0,0 +1,374 @@
+'use client'
+
+import { useState, type FormEvent } from 'react'
+
+interface FormData {
+  applicantName: string
+  applicantEmail: string
+  companyName: string
+  industry: string
+  employeeCount: string
+  annualRevenue: string
+  currentCoverage: boolean
+  previousClaims: string
+  requestedCoverageLimit: string
+}
+
+interface FormErrors {
+  [key: string]: string
+}
+
+const INDUSTRIES = [
+  'Technology',
+  'Healthcare',
+  'Finance',
+  'Retail',
+  'Manufacturing',
+  'Education',
+  'Other',
+]
+
+const COVERAGE_LIMITS = [
+  { label: '$1,000,000', value: '1000000' },
+  { label: '$2,000,000', value: '2000000' },
+  { label: '$5,000,000', value: '5000000' },
+  { label: '$10,000,000', value: '10000000' },
+]
+
+function validateForm(data: FormData): FormErrors {
+  const errors: FormErrors = {}
+
+  if (!data.applicantName.trim()) {
+    errors.applicantName = 'Applicant name is required'
+  }
+
+  if (!data.applicantEmail.trim()) {
+    errors.applicantEmail = 'Email is required'
+  } else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(data.applicantEmail)) {
+    errors.applicantEmail = 'Invalid email address'
+  }
+
+  if (!data.companyName.trim()) {
+    errors.companyName = 'Company name is required'
+  }
+
+  if (!data.industry) {
+    errors.industry = 'Industry is required'
+  }
+
+  if (!data.employeeCount || Number(data.employeeCount) < 1) {
+    errors.employeeCount = 'Employee count must be at least 1'
+  }
+
+  if (!data.annualRevenue || Number(data.annualRevenue) < 0) {
+    errors.annualRevenue = 'Annual revenue is required'
+  }
+
+  const claims = Number(data.previousClaims)
+  if (data.previousClaims === '' || claims < 0 || claims > 10) {
+    errors.previousClaims = 'Previous claims must be between 0 and 10'
+  }
+
+  if (!data.requestedCoverageLimit) {
+    errors.requestedCoverageLimit = 'Coverage limit is required'
+  }
+
+  return errors
+}
+
+export default function NewApplicationPage() {
+  const [formData, setFormData] = useState<FormData>({
+    applicantName: '',
+    applicantEmail: '',
+    companyName: '',
+    industry: '',
+    employeeCount: '',
+    annualRevenue: '',
+    currentCoverage: false,
+    previousClaims: '0',
+    requestedCoverageLimit: '',
+  })
+
+  const [errors, setErrors] = useState<FormErrors>({})
+  const [submitting, setSubmitting] = useState(false)
+  const [submitError, setSubmitError] = useState('')
+  const [submitSuccess, setSubmitSuccess] = useState(false)
+
+  function updateField(field: keyof FormData, value: string | boolean): void {
+    setFormData((prev) => ({ ...prev, [field]: value }))
+    setErrors((prev) => {
+      const next = { ...prev }
+      delete next[field]
+      return next
+    })
+  }
+
+  async function handleSubmit(e: FormEvent): Promise<void> {
+    e.preventDefault()
+    setSubmitError('')
+
+    const validationErrors = validateForm(formData)
+    if (Object.keys(validationErrors).length > 0) {
+      setErrors(validationErrors)
+      return
+    }
+
+    setSubmitting(true)
+
+    try {
+      const response = await fetch('/api/proxy/applications', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          applicantName: formData.applicantName.trim(),
+          applicantEmail: formData.applicantEmail.trim(),
+          companyName: formData.companyName.trim(),
+          industry: formData.industry,
+          employeeCount: Number(formData.employeeCount),
+          annualRevenue: Number(formData.annualRevenue),
+          currentCoverage: formData.currentCoverage,
+          previousClaims: Number(formData.previousClaims),
+          requestedCoverageLimit: Number(formData.requestedCoverageLimit),
+        }),
+      })
+
+      const json = await response.json()
+
+      if (!response.ok) {
+        setSubmitError(json.error?.message || 'Failed to submit application')
+        return
+      }
+
+      setSubmitSuccess(true)
+      setTimeout(() => {
+        window.location.href = '/applications'
+      }, 2000)
+    } catch (err) {
+      setSubmitError(err instanceof Error ? err.message : 'Network error')
+    } finally {
+      setSubmitting(false)
+    }
+  }
+
+  if (submitSuccess) {
+    return (
+      <div>
+        <div className="page-header">
+          <h1 className="page-title">New Application</h1>
+        </div>
+        <div className="alert alert-success">
+          Application submitted successfully! Redirecting to applications list...
+        </div>
+      </div>
+    )
+  }
+
+  return (
+    <div>
+      <div className="page-header">
+        <h1 className="page-title">New Application</h1>
+      </div>
+
+      {submitError && (
+        <div className="alert alert-error">{submitError}</div>
+      )}
+
+      <div className="card">
+        <form onSubmit={handleSubmit}>
+          <div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: 'var(--space-md)' }}>
+            <div className="form-group">
+              <label className="form-label" htmlFor="applicantName">
+                Applicant Name
+              </label>
+              <input
+                id="applicantName"
+                className="form-input"
+                type="text"
+                value={formData.applicantName}
+                onChange={(e) => updateField('applicantName', e.target.value)}
+              />
+              {errors.applicantName && (
+                <div className="form-error">{errors.applicantName}</div>
+              )}
+            </div>
+
+            <div className="form-group">
+              <label className="form-label" htmlFor="applicantEmail">
+                Applicant Email
+              </label>
+              <input
+                id="applicantEmail"
+                className="form-input"
+                type="email"
+                value={formData.applicantEmail}
+                onChange={(e) => updateField('applicantEmail', e.target.value)}
+              />
+              {errors.applicantEmail && (
+                <div className="form-error">{errors.applicantEmail}</div>
+              )}
+            </div>
+
+            <div className="form-group">
+              <label className="form-label" htmlFor="companyName">
+                Company Name
+              </label>
+              <input
+                id="companyName"
+                className="form-input"
+                type="text"
+                value={formData.companyName}
+                onChange={(e) => updateField('companyName', e.target.value)}
+              />
+              {errors.companyName && (
+                <div className="form-error">{errors.companyName}</div>
+              )}
+            </div>
+
+            <div className="form-group">
+              <label className="form-label" htmlFor="industry">
+                Industry
+              </label>
+              <select
+                id="industry"
+                className="form-select"
+                value={formData.industry}
+                onChange={(e) => updateField('industry', e.target.value)}
+              >
+                <option value="">Select industry...</option>
+                {INDUSTRIES.map((ind) => (
+                  <option key={ind} value={ind}>{ind}</option>
+                ))}
+              </select>
+              {errors.industry && (
+                <div className="form-error">{errors.industry}</div>
+              )}
+            </div>
+
+            <div className="form-group">
+              <label className="form-label" htmlFor="employeeCount">
+                Employee Count
+              </label>
+              <input
+                id="employeeCount"
+                className="form-input"
+                type="number"
+                min="1"
+                value={formData.employeeCount}
+                onChange={(e) => updateField('employeeCount', e.target.value)}
+              />
+              {errors.employeeCount && (
+                <div className="form-error">{errors.employeeCount}</div>
+              )}
+            </div>
+
+            <div className="form-group">
+              <label className="form-label" htmlFor="annualRevenue">
+                Annual Revenue (USD)
+              </label>
+              <input
+                id="annualRevenue"
+                className="form-input"
+                type="number"
+                min="0"
+                value={formData.annualRevenue}
+                onChange={(e) => updateField('annualRevenue', e.target.value)}
+              />
+              {errors.annualRevenue && (
+                <div className="form-error">{errors.annualRevenue}</div>
+              )}
+            </div>
+
+            <div className="form-group">
+              <label className="form-label" htmlFor="currentCoverage">
+                Current Cyber Coverage
+              </label>
+              <div style={{ display: 'flex', alignItems: 'center', gap: 'var(--space-sm)', marginTop: 'var(--space-xs)' }}>
+                <button
+                  type="button"
+                  onClick={() => updateField('currentCoverage', !formData.currentCoverage)}
+                  style={{
+                    width: '48px',
+                    height: '24px',
+                    borderRadius: '12px',
+                    border: 'none',
+                    cursor: 'pointer',
+                    background: formData.currentCoverage
+                      ? 'var(--color-success)'
+                      : 'var(--color-border)',
+                    position: 'relative',
+                    transition: 'background 0.2s',
+                  }}
+                >
+                  <span style={{
+                    position: 'absolute',
+                    top: '2px',
+                    left: formData.currentCoverage ? '26px' : '2px',
+                    width: '20px',
+                    height: '20px',
+                    borderRadius: '50%',
+                    background: '#ffffff',
+                    transition: 'left 0.2s',
+                  }} />
+                </button>
+                <span style={{ fontSize: '0.875rem' }}>
+                  {formData.currentCoverage ? 'Yes' : 'No'}
+                </span>
+              </div>
+            </div>
+
+            <div className="form-group">
+              <label className="form-label" htmlFor="previousClaims">
+                Previous Claims (0-10)
+              </label>
+              <input
+                id="previousClaims"
+                className="form-input"
+                type="number"
+                min="0"
+                max="10"
+                value={formData.previousClaims}
+                onChange={(e) => updateField('previousClaims', e.target.value)}
+              />
+              {errors.previousClaims && (
+                <div className="form-error">{errors.previousClaims}</div>
+              )}
+            </div>
+          </div>
+
+          <div className="form-group" style={{ marginTop: 'var(--space-md)' }}>
+            <label className="form-label" htmlFor="requestedCoverageLimit">
+              Requested Coverage Limit
+            </label>
+            <select
+              id="requestedCoverageLimit"
+              className="form-select"
+              value={formData.requestedCoverageLimit}
+              onChange={(e) => updateField('requestedCoverageLimit', e.target.value)}
+            >
+              <option value="">Select coverage limit...</option>
+              {COVERAGE_LIMITS.map((opt) => (
+                <option key={opt.value} value={opt.value}>{opt.label}</option>
+              ))}
+            </select>
+            {errors.requestedCoverageLimit && (
+              <div className="form-error">{errors.requestedCoverageLimit}</div>
+            )}
+          </div>
+
+          <div style={{ display: 'flex', gap: 'var(--space-sm)', marginTop: 'var(--space-lg)' }}>
+            <button
+              type="submit"
+              className="btn btn-primary"
+              disabled={submitting}
+            >
+              {submitting ? 'Submitting...' : 'Submit Application'}
+            </button>
+            <a href="/applications" className="btn btn-secondary">
+              Cancel
+            </a>
+          </div>
+        </form>
+      </div>
+    </div>
+  )
+}

package/dist/templates/mga/{{name}}-web/src/app/applications/page.tsx

@@ -0,0 +1,109 @@
+import { apiClient } from '@/lib/api'
+
+interface Application {
+  id: string
+  applicantName: string
+  companyName: string
+  industry: string
+  employeeCount: number
+  status: string
+  agentName: string
+  createdAt: string
+}
+
+function formatDate(dateStr: string): string {
+  return new Date(dateStr).toLocaleDateString('en-US', {
+    month: 'short',
+    day: 'numeric',
+    year: 'numeric',
+  })
+}
+
+function badgeClass(status: string): string {
+  const map: Record<string, string> = {
+    submitted: 'badge-submitted',
+    review: 'badge-review',
+    quoted: 'badge-quoted',
+    bound: 'badge-bound',
+    declined: 'badge-declined',
+  }
+  return map[status] || 'badge-pending'
+}
+
+export default async function ApplicationsPage() {
+  const res = await apiClient.get<Application[]>('/api/applications')
+
+  if (!res.success) {
+    return (
+      <div>
+        <div className="page-header">
+          <h1 className="page-title">Applications</h1>
+          <a href="/applications/new" className="btn btn-primary">
+            New Application
+          </a>
+        </div>
+        <div className="alert alert-error">
+          Failed to load applications: {res.error?.message || 'Unknown error'}
+        </div>
+      </div>
+    )
+  }
+
+  const applications = res.data || []
+
+  return (
+    <div>
+      <div className="page-header">
+        <h1 className="page-title">Applications</h1>
+        <a href="/applications/new" className="btn btn-primary">
+          New Application
+        </a>
+      </div>
+
+      {applications.length === 0 ? (
+        <div className="card" style={{ textAlign: 'center', padding: 'var(--space-2xl)' }}>
+          <p style={{ color: 'var(--color-text-muted)', marginBottom: 'var(--space-md)' }}>
+            No applications found
+          </p>
+          <a href="/applications/new" className="btn btn-primary">
+            Create First Application
+          </a>
+        </div>
+      ) : (
+        <div className="table-wrapper">
+          <table>
+            <thead>
+              <tr>
+                <th>Company</th>
+                <th>Industry</th>
+                <th>Employees</th>
+                <th>Status</th>
+                <th>Agent</th>
+                <th>Date</th>
+              </tr>
+            </thead>
+            <tbody>
+              {applications.map((app) => (
+                <tr key={app.id}>
+                  <td>
+                    <strong>{app.companyName}</strong>
+                    <div style={{ fontSize: '0.75rem', color: 'var(--color-text-muted)' }}>
+                      {app.applicantName}
+                    </div>
+                  </td>
+                  <td>{app.industry}</td>
+                  <td>{app.employeeCount.toLocaleString()}</td>
+                  <td>
+                    <span className={`badge ${badgeClass(app.status)}`}>{app.status}</span>
+                  </td>
+                  <td>{app.agentName}</td>
+                  <td>{formatDate(app.createdAt)}</td>
+                </tr>
+              ))}
+            </tbody>
+          </table>
+        </div>
+      )}
+    </div>
+  )
+}

package/dist/templates/mga/{{name}}-web/src/app/dashboard/admin/page.tsx

@@ -0,0 +1,179 @@
+import { apiClient } from '@/lib/api'
+
+interface ReportSummary {
+  totalPolicies: number
+  totalPremium: number
+  totalApplications: number
+  pipeline: {
+    submitted: number
+    review: number
+    quoted: number
+    bound: number
+    declined: number
+  }
+  recentActivity: Array<{
+    id: string
+    type: string
+    description: string
+    date: string
+  }>
+}
+
+function formatCurrency(value: number): string {
+  return new Intl.NumberFormat('en-US', {
+    style: 'currency',
+    currency: 'USD',
+    minimumFractionDigits: 0,
+    maximumFractionDigits: 0,
+  }).format(value)
+}
+
+function formatDate(dateStr: string): string {
+  return new Date(dateStr).toLocaleDateString('en-US', {
+    month: 'short',
+    day: 'numeric',
+    year: 'numeric',
+  })
+}
+
+export default async function AdminDashboard() {
+  const res = await apiClient.get<ReportSummary>('/api/reports/summary')
+
+  if (!res.success || !res.data) {
+    return (
+      <div>
+        <div className="page-header">
+          <h1 className="page-title">Admin Dashboard</h1>
+        </div>
+        <div className="alert alert-error">
+          Failed to load dashboard data: {res.error?.message || 'Unknown error'}
+        </div>
+      </div>
+    )
+  }
+
+  const data = res.data
+  const pipelineTotal =
+    data.pipeline.submitted +
+    data.pipeline.review +
+    data.pipeline.quoted +
+    data.pipeline.bound +
+    data.pipeline.declined || 1
+
+  return (
+    <div>
+      <div className="page-header">
+        <h1 className="page-title">Admin Dashboard</h1>
+      </div>
+
+      <div className="kpi-grid">
+        <div className="card">
+          <div className="card-title">Total Policies</div>
+          <div className="card-value">{data.totalPolicies.toLocaleString()}</div>
+        </div>
+        <div className="card">
+          <div className="card-title">Total Premium</div>
+          <div className="card-value">{formatCurrency(data.totalPremium)}</div>
+        </div>
+        <div className="card">
+          <div className="card-title">Applications</div>
+          <div className="card-value">{data.totalApplications.toLocaleString()}</div>
+        </div>
+        <div className="card">
+          <div className="card-title">Bound Rate</div>
+          <div className="card-value">
+            {pipelineTotal > 0
+              ? `${Math.round((data.pipeline.bound / pipelineTotal) * 100)}%`
+              : '0%'}
+          </div>
+        </div>
+      </div>
+
+      <div className="card" style={{ marginBottom: 'var(--space-xl)' }}>
+        <div className="card-title">Pipeline Summary</div>
+        <div className="pipeline-bar">
+          <div
+            className="pipeline-segment"
+            style={{
+              flex: data.pipeline.submitted,
+              background: 'var(--color-warning)',
+            }}
+          >
+            {data.pipeline.submitted > 0 ? data.pipeline.submitted : ''}
+          </div>
+          <div
+            className="pipeline-segment"
+            style={{
+              flex: data.pipeline.review,
+              background: 'var(--color-pending)',
+            }}
+          >
+            {data.pipeline.review > 0 ? data.pipeline.review : ''}
+          </div>
+          <div
+            className="pipeline-segment"
+            style={{
+              flex: data.pipeline.quoted,
+              background: 'var(--color-info)',
+            }}
+          >
+            {data.pipeline.quoted > 0 ? data.pipeline.quoted : ''}
+          </div>
+          <div
+            className="pipeline-segment"
+            style={{
+              flex: data.pipeline.bound,
+              background: 'var(--color-success)',
+            }}
+          >
+            {data.pipeline.bound > 0 ? data.pipeline.bound : ''}
+          </div>
+          <div
+            className="pipeline-segment"
+            style={{
+              flex: data.pipeline.declined,
+              background: 'var(--color-danger)',
+            }}
+          >
+            {data.pipeline.declined > 0 ? data.pipeline.declined : ''}
+          </div>
+        </div>
+        <div style={{ display: 'flex', gap: 'var(--space-md)', flexWrap: 'wrap', fontSize: '0.75rem' }}>
+          <span><span style={{ color: 'var(--color-warning)' }}>&#9632;</span> Submitted ({data.pipeline.submitted})</span>
+          <span><span style={{ color: 'var(--color-pending)' }}>&#9632;</span> Review ({data.pipeline.review})</span>
+          <span><span style={{ color: 'var(--color-info)' }}>&#9632;</span> Quoted ({data.pipeline.quoted})</span>
+          <span><span style={{ color: 'var(--color-success)' }}>&#9632;</span> Bound ({data.pipeline.bound})</span>
+          <span><span style={{ color: 'var(--color-danger)' }}>&#9632;</span> Declined ({data.pipeline.declined})</span>
+        </div>
+      </div>
+
+      <div className="card">
+        <div className="card-title">Recent Activity</div>
+        {data.recentActivity.length === 0 ? (
+          <p style={{ color: 'var(--color-text-muted)', fontSize: '0.875rem' }}>No recent activity</p>
+        ) : (
+          <table>
+            <thead>
+              <tr>
+                <th>Type</th>
+                <th>Description</th>
+                <th>Date</th>
+              </tr>
+            </thead>
+            <tbody>
+              {data.recentActivity.map((item) => (
+                <tr key={item.id}>
+                  <td>
+                    <span className={`badge badge-${item.type}`}>{item.type}</span>
+                  </td>
+                  <td>{item.description}</td>
+                  <td>{formatDate(item.date)}</td>
+                </tr>
+              ))}
+            </tbody>
+          </table>
+        )}
+      </div>
+    </div>
+  )
+}