diff --git a/src/assets/demo/data.json b/src/assets/demo/data.json index 8333116f..a54ad066 100644 --- a/src/assets/demo/data.json +++ b/src/assets/demo/data.json @@ -142,18 +142,54 @@ "enable": true, "heading": "Skills", "items": [ - "Customer Service Expertise", - "High-Volume Call Center", - "Team Leader/Problem Solver", - "Call Center Management", - "Teambuilding & Training", - "Continuous Improvement" + { + "id": "2562d78a-3459-4370-8604-c81b00738db1", + "skill": "Customer Service Expertise" + }, + { + "id": "58c31587-9770-4522-a34c-f5ad92fe33e5", + "skill": "High-Volume Call Center" + }, + { + "id": "7aa9a4b1-a2bb-4bcd-8711-b66c0d246971", + "skill": "Team Leader/Problem Solver" + }, + { + "id": "e7fd33e8-5d77-462d-8115-5be57f52832e", + "skill": "Call Center Management" + }, + { + "id": "7bad2af1-c24d-4e01-b68b-be01cfa784ce", + "skill": "Teambuilding & Training" + }, + { + "id": "64fe1710-c2d1-4f53-922e-a5d751eee967", + "skill": "Continuous Improvement" + } ] }, "hobbies": { "enable": true, "heading": "Hobbies", - "items": ["Poetry", "Travelling", "Beatboxing", "Sketching"] + "items": [ + { + "id": "dd2efad7-e900-4384-bdc0-b2ab5f62bb71", + "hobby": "Poetry" + + }, + { + "id": "96023eb7-8c93-4b1d-b581-b8fc4107351a", + "hobby": "Travelling" + }, + { + "id": "7e5a6168-9cbe-4fe6-b9b9-43a47d8bb15a", + "hobby": "Beatboxing" + }, + { + "id": "dd7f4ffd-9c16-4dbf-8968-1165b9e30db8", + "hobby": "Sketching" + } + ] }, "languages": { "enable": true, diff --git a/src/components/LeftSidebar/tabs/Hobbies.js b/src/components/LeftSidebar/tabs/Hobbies.js index 1ba1a614..1c1a0867 100644 --- a/src/components/LeftSidebar/tabs/Hobbies.js +++ b/src/components/LeftSidebar/tabs/Hobbies.js @@ -1,4 +1,5 @@ import React, { useState, useContext } from 'react'; +import { v4 as uuidv4 } from 'uuid'; import AppContext from '../../../context/AppContext'; import Checkbox from '../../../shared/Checkbox'; @@ -44,7 +45,7 @@ const Form = ({ item, onChange }) => { onChange(e.target.value)} type="text" /> @@ -53,14 +54,20 @@ const Form = ({ item, onChange }) => { const AddItem = ({ heading, dispatch }) => { const [isOpen, setOpen] = useState(false); - const [item, setItem] = useState(''); + const [item, setItem] = useState({ + id: uuidv4(), + hobby: '' + }); const add = () => { - if (item === '') return; + if (item.hobby === '') return; addItem(dispatch, 'hobbies', item); - setItem(''); + setItem({ + id: uuidv4(), + hobby: '' + }); }; return ( @@ -70,7 +77,7 @@ const AddItem = ({ heading, dispatch }) => {
-
+ setItem({...item, hobby: v})} />