Proyectos de Subversion LeadersLinked - Antes de SPA

import React, { useEffect, useState } from "react";

import { axios } from "../../../utils";

import styles from "./peopleYouMayKnow.module.scss";

const PeopleYouMayKnow = () => {

  // states

  const [peopleYouMayKnow, setPeopleYouMayKnow] = useState([]);

  const [error, setError] = useState("");

  useEffect(() => {

    axios.get(`/helpers/people-you-may-know`).then((response) => {

      const resData = response.data;

      if (resData.success) {

        setPeopleYouMayKnow(resData.data);

      } else {

        // alert error

      }

    });

  }, []);

  return (

    <div className={styles.peopleYouMayKnow} id="suggestions-list-people-you-may-know">

      <div className="sd-title">

        <h3>Personas que puede conocer</h3>

      </div>

      <>

        <div className={styles.suggestionList}>

          {peopleYouMayKnow.length ? (

            <React.Fragment>

              {error ? (

                <div className="suggestion-usd"> Ha ocurrido un error :( </div>

              ) : (

                peopleYouMayKnow.map(({ id, image, link_cancel, link_request, name, profile, relation }) => (

                  <div className={styles.user} key={id}>

                    <a href={profile} target="_blank">

                      <img

                        style={{

                          width: "2.3rem",

                          maxWidth: '2.3rem',

                          height: "auto"

                        }}

                        src={image}

                        alt={`${name} profile image`}

                      />

                    </a>

                    <div className="sgt-text">

                      <a href={profile} target="_blank">

                        <h4>{name}</h4>

                      </a>

                    </div>

                  </div>

                ))

              )}

            </React.Fragment>

          ) : (

            <div className="view-more">Sin sugerencias</div>

          )}

        </div>

        {

          !error && (

            <div className={styles.viewMore}>

              <a href="/connection/people-you-may-know" target="_blank">

                <button

                  className="btn btn-primary"

                  type="button"

                  style={{ padding: '2px 10px' }}

                >

                  Ver más

                </button>

              </a>

            </div>

          )

        }

      </>

    </div>

  );

};

export default PeopleYouMayKnow;