Proyectos de Subversion LeadersLinked - Antes de SPA

/* eslint-disable react/prop-types */

import React from "react";

import { useState } from "react";

import SkillsModal from "./SkillsModal";

const Skills = ({ userSkills, skillsOptions, userIdEncrypted }) => {

  const [isModalOpen, setIsModalOpen] = useState(false);

  const [userSkillsArray, setUserSkillsArray] = useState(userSkills);

  return (

    <>

      <div className="user-profile-ov">

        <h3>

          Habilidades

          <a href="#" title="" className="btn-skills-edit" onClick={() => setIsModalOpen(true)}>

            <i className="fa fa-pencil"></i>

          </a>

        </h3>

        <ul>

          {userSkillsArray.length

            ? userSkillsArray.map(({ name }) =>

              <li key={name}>

                <a href="#" title="">

                  {name}

                </a>

              </li>

            )

            : <li>Sin información</li>

          }

        </ul>

      </div>

      <SkillsModal

        show={isModalOpen}

        closeModal={() => setIsModalOpen(false)}

        userIdEncrypted={userIdEncrypted}

        skillsOptions={skillsOptions}

        userSkillsArray={userSkillsArray}

        setSkills={(newSkills) => setUserSkillsArray(newSkills)}

      />

    </>

  );

};

export default Skills;