67 lines
2.1 KiB
JavaScript
67 lines
2.1 KiB
JavaScript
import React from "react";
|
|
import { useNavigate } from "react-router-dom";
|
|
import { Button } from "./ui/button.js";
|
|
import EconomicProjections from "./EconomicProjections.js";
|
|
|
|
/* simple pill-style label */
|
|
const Chip = ({ label }) => (
|
|
<span
|
|
className="
|
|
inline-flex items-center text-sm px-3 py-1
|
|
rounded-full bg-gray-100 text-gray-700
|
|
border border-gray-300
|
|
"
|
|
>
|
|
{label}
|
|
<span className="ml-1 text-xs text-green-600">✓ in Career Coach</span>
|
|
</span>
|
|
);
|
|
|
|
export default function EnhancingLanding({ userProfile }) {
|
|
const navigate = useNavigate();
|
|
const socCode = userProfile?.socCode;
|
|
const stateName = userProfile?.state;
|
|
|
|
return (
|
|
<div className="min-h-screen bg-gray-50 py-8 px-4">
|
|
<div className="max-w-4xl mx-auto space-y-10">
|
|
|
|
{/* 📌 Current status */}
|
|
<section className="bg-white shadow rounded-lg p-6">
|
|
<h2 className="text-2xl font-semibold mb-4">
|
|
📌 Your Current Status & Next Steps
|
|
</h2>
|
|
<p className="text-gray-600 mb-4">
|
|
Evaluate where you are in your career and discover upcoming milestones with our AI recommendations.
|
|
</p>
|
|
|
|
<EconomicProjections socCode={socCode} stateName={stateName} />
|
|
|
|
<div className="mt-4">
|
|
<Button onClick={() => navigate("/career-roadmap")}>
|
|
Open Career Coach
|
|
</Button>
|
|
</div>
|
|
</section>
|
|
|
|
{/* 🚀 How do I get there */}
|
|
<section className="bg-white shadow rounded-lg p-6">
|
|
<h2 className="text-2xl font-semibold mb-4">🚀 How Do I Get There?</h2>
|
|
|
|
<div className="flex flex-wrap gap-3">
|
|
<Chip label="Resume Optimizer" />
|
|
<Chip label="Networking" />
|
|
<Chip label="Interview Help" />
|
|
<Chip label="Job Search" />
|
|
</div>
|
|
|
|
<p className="text-sm text-gray-500 mt-3">
|
|
All of these tools live inside the <strong>Career Coach</strong>. Open it any time using the button above.
|
|
</p>
|
|
</section>
|
|
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|