project done

2022-11-07 17:15:55 +02:00
commit 543d271672
68 changed files with 37051 additions and 0 deletions
@@ -0,0 +1,118 @@
+import React, { useState } from 'react';
+import { Link, useNavigate } from 'react-router-dom';
+import PropTypes from 'prop-types';
+import { connect } from 'react-redux';
+import { addEducation } from '../../actions/profile';
+
+const AddEducation = ({ addEducation }) => {
+  const navigate = useNavigate();
+  const [formData, setFormData] = useState({
+    school: '',
+    degree: '',
+    fieldofstudy: '',
+    from: '',
+    to: '',
+    current: false,
+    description: ''
+  });
+
+  const { school, degree, fieldofstudy, from, to, description, current } =
+    formData;
+
+  const onChange = (e) =>
+    setFormData({ ...formData, [e.target.name]: e.target.value });
+
+  return (
+    <section className="container">
+      <h1 className="large text-primary">Add Your Education</h1>
+      <p className="lead">
+        <i className="fas fa-code-branch" /> Add any school or bootcamp that you
+        have attended
+      </p>
+      <small>* = required field</small>
+      <form
+        className="form"
+        onSubmit={(e) => {
+          e.preventDefault();
+          addEducation(formData, navigate);
+        }}
+      >
+        <div className="form-group">
+          <input
+            type="text"
+            placeholder="* School or Bootcamp"
+            name="school"
+            value={school}
+            onChange={onChange}
+            required
+          />
+        </div>
+        <div className="form-group">
+          <input
+            type="text"
+            placeholder="* Degree or Certificate"
+            name="degree"
+            value={degree}
+            onChange={onChange}
+            required
+          />
+        </div>
+        <div className="form-group">
+          <input
+            type="text"
+            placeholder="Field of Study"
+            name="fieldofstudy"
+            value={fieldofstudy}
+            onChange={onChange}
+          />
+        </div>
+        <div className="form-group">
+          <h4>From Date</h4>
+          <input type="date" name="from" value={from} onChange={onChange} />
+        </div>
+        <div className="form-group">
+          <p>
+            <input
+              type="checkbox"
+              name="current"
+              checked={current}
+              value={current}
+              onChange={() => setFormData({ ...formData, current: !current })}
+            />{' '}
+            Current School
+          </p>
+        </div>
+        <div className="form-group">
+          <h4>To Date</h4>
+          <input
+            type="date"
+            name="to"
+            value={to}
+            onChange={onChange}
+            disabled={current}
+          />
+        </div>
+        <div className="form-group">
+          <textarea
+            name="description"
+            cols="30"
+            rows="5"
+            placeholder="Program Description"
+            value={description}
+            onChange={onChange}
+          />
+        </div>
+        <input type="submit" className="btn btn-primary my-1" />
+        <Link className="btn btn-light my-1" to="/dashboard">
+          Go Back
+        </Link>
+      </form>
+    </section>
+  );
+};
+
+AddEducation.propTypes = {
+  addEducation: PropTypes.func.isRequired
+};
+
+export default connect(null, { addEducation })(AddEducation);