Add skills component - Front

[mikaelcarrara]

import React, { useState } from 'react';

const SkillsField = ({ onAddSkill  }) => {
  const [skills, setSkill] = useState('');

  const handleInputChange = (e) => {
    setSkill(e.target.value);
  };

  const handleSkillClick = () => {
    if (skills.trim() !== '') {
      onAddSkill(skills);
      setSkill('');
    }
  };

  return (
    <div>
      <input
        type="text"
        placeholder="Skill"
        value={skills}
        onChange={handleInputChange}
        id="skills-input"
        tabIndex={5}
        className={styles["skills-input"]}
        //onChange={(event) => setSkills(event.target.value)}
      />
      <a href="#" onClick={handleSkillClick}>
        <span>add</span>
      </a>
    </div>
  );
};

export default SkillsField;

[mikaelcarrara]

const SkillsList = ({ AllSkills }) => {
  return (
    <ul className={styles["skills-list"]}>
      {AllSkills.map((skills, index) => (
        <div key={index} className="skill-item">
          <span>{skills}</span>
        </div>
      ))}
    </ul>
  );
};

export default SkillsList;

[mikaelcarrara]

.