odin-codespace/cv-project/src/App.jsx

71 lines
2.3 KiB
React
Raw Normal View History

import GeneralInfoForm from "./components/generalInfoForm";
import GeneralInfoDisplay from "./components/generalInfoDisplay";
import EducationInfoDisplay from "./components/educationInfoDisplay";
import EducationInfoForm from "./components/educationInfoForm";
import ExperienceForm from "./components/experienceForm";
import ExperienceDisplay from "./components/experienceDisplay";
import "./App.css";
import { useState } from "react";
import Button from "./components/button";
function App() {
const [basicInfo, setBasicInfo] = useState({
fullName: "Marvin Gaye",
phone: "301-240-5555",
email: "mgaye@motown.com",
location: "Detriot, MI",
});
const [educationInfo, setEducationInfo] = useState([]);
const [editEducation, setEditEducation] = useState(null);
const [employmentHistory, setEmploymentHistory] = useState([]);
const [showJobForm, setShowJobForm] = useState(false);
const [educationItemActive, setEducationItemActive] = useState(false);
return (
<div className="container">
<div className="form">
<GeneralInfoForm setBasicInfo={setBasicInfo} basicInfo={basicInfo} />
<div className="btn-group">
<Button
onClick={() => {
setEducationItemActive(!educationItemActive);
}}
text="Add Education"
className="normal-btn"
/>
<Button
onClick={() => setShowJobForm(!showJobForm)}
text="Add Employment"
className="normal-btn"
/>
</div>
<EducationInfoForm
educationInfo={educationInfo}
setEducationInfo={setEducationInfo}
setEditEducation={setEditEducation}
editEducation={editEducation}
educationItemActive={educationItemActive}
/>
<ExperienceForm
employmentHistory={employmentHistory}
setEmploymentHistory={setEmploymentHistory}
showJobForm={showJobForm}
/>
</div>
<div className="resume">
<GeneralInfoDisplay basicInfo={basicInfo} />
<EducationInfoDisplay
educationInfo={educationInfo}
setEditEducation={setEditEducation}
setEducationInfo={setEducationInfo}
/>
<ExperienceDisplay employmentHistory={employmentHistory} />
</div>
</div>
);
}
export default App;