diff --git a/src/components/LeftSidebar/LeftSidebar.js b/src/components/LeftSidebar/LeftSidebar.js index 16e08f31..377ade80 100644 --- a/src/components/LeftSidebar/LeftSidebar.js +++ b/src/components/LeftSidebar/LeftSidebar.js @@ -31,7 +31,7 @@ const LeftSidebar = () => { const { state, dispatch } = context; const { data } = state; - const [currentTab, setCurrentTab] = useState('Profile'); + const [currentTab, setCurrentTab] = useState('Education'); const onChange = (key, value) => { dispatch({ type: 'on_input', diff --git a/src/components/LeftSidebar/tabs/Education.js b/src/components/LeftSidebar/tabs/Education.js index 1363ee7f..4cba7ddc 100644 --- a/src/components/LeftSidebar/tabs/Education.js +++ b/src/components/LeftSidebar/tabs/Education.js @@ -1,4 +1,5 @@ import React, { useState, useContext } from 'react'; +import { useTranslation } from 'react-i18next'; import { v4 as uuidv4 } from 'uuid'; import set from 'lodash/set'; @@ -6,10 +7,12 @@ import TextField from '../../../shared/TextField'; import TextArea from '../../../shared/TextArea'; import AppContext from '../../../context/AppContext'; import Checkbox from '../../../shared/Checkbox'; -import { addItem, deleteItem, moveItemUp, moveItemDown } from '../../../utils'; +import { addItem } from '../../../utils'; import ItemActions from '../../../shared/ItemActions'; +import AddItemButton from '../../../shared/AddItemButton'; const EducationTab = ({ data, onChange }) => { + const { t } = useTranslation('app'); const context = useContext(AppContext); const { dispatch } = context; @@ -24,7 +27,7 @@ const EducationTab = ({ data, onChange }) => {
onChange('data.education.heading', v)} /> @@ -45,12 +48,72 @@ const EducationTab = ({ data, onChange }) => { /> ))} - + ); }; -const AddItem = ({ dispatch }) => { +const Form = ({ item, onChange, identifier = '' }) => { + const { t } = useTranslation(['leftSidebar', 'app']); + + return ( +
+ onChange(`${identifier}name`, v)} + /> + + onChange(`${identifier}major`, v)} + /> + + onChange(`${identifier}grade`, v)} + /> + +
+ onChange(`${identifier}start`, v)} + /> + + onChange(`${identifier}end`, v)} + /> +
+ +