Proyectos de Subversion LeadersLinked - Antes de SPA

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

import React, { useState } from "react";

import LanguagesModal from "./LanguagesModal";

const Languages = ({

  userLanguages,

  languagesOptions,

  userIdEncrypted

}) => {

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

  const [userLanguagesArray, setUserLanguagesArray] = useState(userLanguages);

  return (

    <>

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

        <h3>

          Idiomas

          <a

            href="#"

            title=""

            className="btn-languages-edit"

            onClick={() => setIsModalOpen(true)}

          >

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

          </a>

        </h3>

        <ul>

          {

            userLanguagesArray.length

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

                <li key={name}>

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

                    {name}

                  </a>

                </li>

              )

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

          }

        </ul>

      </div>

      <LanguagesModal

        show={isModalOpen}

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

        userIdEncrypted={userIdEncrypted}

        languagesOptions={languagesOptions}

        userLanguages={userLanguagesArray}

        setLanguages={(newLanguages) => setUserLanguagesArray(newLanguages)}

      />

    </>

  );

};

export default Languages;