diff --git a/src/components/SampleReport.tsx b/src/components/SampleReport.tsx new file mode 100644 index 0000000..79737b6 --- /dev/null +++ b/src/components/SampleReport.tsx @@ -0,0 +1,238 @@ +import { motion } from "framer-motion"; +import { + Car, + Clock, + Sparkles, + AlertTriangle, + Wrench, + Share2, +} from "lucide-react"; + +const SAMPLE = { + vehicle: "2018 Honda Civic 1.5L Turbo", + mileage: "108,432", + scannedAgo: "2 min ago", + analysisTime: "9.8 sec", + healthScore: 78, + healthGrade: "B+", + healthLabel: "Good", + issues: [ + { + dtc: "P0420", + title: "Catalytic Converter Degradation", + desc: + "Catalyst efficiency is below threshold. Common on 2016–2018 Civics past 80k miles. Not urgent, but worth budgeting for.", + severityLabel: "Plan within 2 weeks", + severityColor: "#F59E0B", + cost: "$400 – $650", + }, + { + dtc: "P0171", + title: "Lean Fuel Condition (Bank 1)", + desc: + "Engine is running lean — likely a vacuum leak or dirty MAF sensor. Cheap to diagnose, cheap to fix.", + severityLabel: "Easy fix", + severityColor: "#10B981", + cost: "$80 – $120", + }, + { + dtc: "P0496", + title: "EVAP Flow During Non-Purge", + desc: + "Likely a stuck purge valve. Often resolved with a $20 part and 30 minutes of labor.", + severityLabel: "Easy fix", + severityColor: "#10B981", + cost: "$40 – $80", + }, + ], + aiSummary: + "Your Civic is in solid shape for 108k miles. The catalytic converter is the only item I'd plan to address in the next two weeks — it's not urgent, but past 80k miles on the 1.5L turbo it's worth budgeting for. The lean condition and EVAP code are quick, cheap fixes you can ask your mechanic to bundle into the same visit.", + totalLow: 520, + totalHigh: 850, +} as const; + +export default function SampleReport() { + return ( +
+ {/* Section header */} + + + SAMPLE REPORT · LIVE PREVIEW + +

+ What you'll actually see. +

+

+ A complete AI repair report — exactly what shows up on your phone + after a 10-second scan. No login. No app install. +

+ + + {/* Report container */} + + {/* Top strip — vehicle + scan timestamp */} +
+
+
+ Vehicle +
+
+ {SAMPLE.vehicle} +
+
+ {SAMPLE.mileage} mi +
+
+
+
+ Scanned +
+
+ {SAMPLE.scannedAgo} +
+
+ analysis time: {SAMPLE.analysisTime} +
+
+
+ + {/* Body grid */} +
+ {/* Health score card */} +
+
+ HEALTH SCORE +
+
+
+
+ {SAMPLE.healthScore} +
+
/100
+
+
+ + {SAMPLE.healthGrade} · {SAMPLE.healthLabel} + +
+
+ {/* Decorative ring */} +
+
+ + {/* AI Summary card */} +
+
+ AI SUMMARY +
+

+ {SAMPLE.aiSummary} +

+
+ + Generated from 706 GB of vehicle-specific repair knowledge +
+
+ + {/* Issues — full width */} +
+
+
+ 3 ISSUES FOUND +
+ + PRIORITY ORDER + +
+
    + {SAMPLE.issues.map((issue) => ( +
  • + + {issue.dtc} + +
    +
    + {issue.title} +
    +

    + {issue.desc} +

    +
    +
    +
    + {issue.cost} +
    +
    + + {issue.severityLabel} +
    +
    +
    • + ))} +
+
+
+ + {/* Bottom strip — total + CTAs */} +
+
+
+ TOTAL ESTIMATED REPAIR COST +
+
+ ${SAMPLE.totalLow}{" "} + – $ + {SAMPLE.totalHigh} +
+
+
+ + + Try with your car + + + + Send to mechanic + +
+
+ +
+ ); +}