Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 3896 | Rev 3898 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 3896 Rev 3897
Línea 1... Línea 1...
1 
/* eslint-disable react/prop-types */
 1 
/* eslint-disable react/prop-types */
2 
import React from "react";
 2 
import React from "react";
3 
import { useEffect, useState } from "react";
 3 
import { useEffect, useState } from "react";
4 
import { axios } from "../../../utils";
 4 
import { axios } from "../../../utils";
Línea 5... Línea 5...
5 
 
 5 
 
Línea 6... Línea 6...
6 
const CompanyFollowersHelper = ({ companyId }) => {
 6 
const CompanyFollowers = ({ companyId }) => {
- 
 
 7 
 
7 
 
 8 
  const [companyFollowers, setCompanyFollowers] = useState([]);
Línea 8... Línea 9...
8 
  const [companyFollowers, setCompanyFollowers] = useState([]);
 9 
  const [showFollowersModal, setShowFollowersModal] = useState(false);
9 
  const [lookMore, setLookMore] = useState(false);
 10 
  const [lookMore, setLookMore] = useState(false);
10 
 
 11 
 
Línea 22... Línea 23...
22 
    }
 23 
    }
23 
    return infoFollows
 24 
    return infoFollows
24 
  }
 25 
  }
Línea 25... Línea 26...
25 
 
 26 
 
- 
 
 27 
  return (
26 
  return (
 28 
    <>
27 
    <div className="peopleYouMayKnow">
 29 
      <div className="peopleYouMayKnow">
28 
      <div className="sd-title d-flex align-items-center justify-content-between">
 30 
        <div className="sd-title d-flex align-items-center justify-content-between">
29 
        <h3>Seguidores:</h3>
 31 
          <h3>Seguidores:</h3>
30 
        <a href="#"
 32 
          <a href="#"
31 
          onClick={(e) => {
 33 
            onClick={(e) => {
32 
            e.preventDefault()
 34 
              e.preventDefault()
33 
            setLookMore(!lookMore)
 35 
              setLookMore(!lookMore)
34 
          }}
 36 
            }}
35 
        >
 37 
          >
- 
 
 38 
            {lookMore ? 'Ver menos' : 'Ver mas'}
- 
 
 39 
          </a>
- 
 
 40 
        </div>
- 
 
 41 
        <div className="suggest-list">
- 
 
 42 
          {companyFollowers.length
- 
 
 43 
            ? getData().map((follower) =>
- 
 
 44 
              <CompanyFollowers.Template
- 
 
 45 
                key={follower.id}
- 
 
 46 
                follower={follower}
- 
 
 47 
              />
- 
 
 48 
            )
- 
 
 49 
            : <div className="view-more">Sin seguidores</div>
- 
 
 50 
          }
- 
 
 51 
        </div>
- 
 
 52 
      </div>
- 
 
 53 
      <button
- 
 
 54 
        onClick={() => setShowFollowersModal(!showFollowersModal)}
- 
 
 55 
        className="btn btn-primary btn-sm w-100 d-md-none"
- 
 
 56 
      >
- 
 
 57 
        Ver seguidores
- 
 
 58 
      </button>
- 
 
 59 
      <CompanyFollowers.Modal
- 
 
 60 
        isShow={showFollowersModal}
- 
 
 61 
        followers={getData()}
- 
 
 62 
        handleClose={() => setShowFollowersModal(false)}
- 
 
 63 
      />
- 
 
 64 
    </>
- 
 
 65 
  );
- 
 
 66 
};
- 
 
 67 
 
- 
 
 68 
const Template = ({ follower }) => {
- 
 
 69 
  const { name, image, profile } = follower
- 
 
 70 
 
- 
 
 71 
  return (
- 
 
 72 
    <div className='user'>
- 
 
 73 
      <div className="w-100 d-flex align-items-center" style={{ gap: '.5rem' }}>
- 
 
 74 
        <a href={profile} target="_blank" rel="noreferrer">
36 
          {lookMore ? 'Ver menos' : 'Ver mas'}
 75 
          <img src={image} alt={`${name} profile image`} />
- 
 
 76 
        </a>
37 
        </a>
 77 
        <h4>{name}</h4>
38 
      </div>
 - 
 
39 
      <div className="suggest-list">
 - 
 
40 
        {companyFollowers.length
 - 
 
41 
          ? getData().map(({ id, name, image, profile }) => (
 - 
 
42 
            <div className='user' key={id}>
 - 
 
43 
              <div className="w-100 d-flex align-items-center" style={{ gap: '.5rem' }}>
 - 
 
44 
                <a href={profile} target="_blank" rel="noreferrer">
 - 
 
45 
                  <img src={image} alt={`${name} profile image`} />
 - 
 
46 
                </a>
 - 
 
47 
                <h4>{name}</h4>
 - 
 
48 
              </div>
 78 
      </div>
49 
              <div className="w-100 d-flex align-items-center justify-content-start" style={{ gap: '.5rem' }}>
 79 
      <div className="w-100 d-flex align-items-center justify-content-start" style={{ gap: '.5rem' }}>
50 
                <a
 80 
        <a
51 
                  href={profile}
 81 
          href={profile}
52 
                  className="btn btn-primary"
 82 
          className="btn btn-primary"
53 
                  target='_blank'
 83 
          target='_blank'
54 
                  rel="noreferrer"
 84 
          rel="noreferrer"
55 
                >
 85 
        >
56 
                  Ver perfil
 - 
 
57 
                </a>
 - 
 
58 
              </div>
 - 
 
59 
            </div>
 86 
          Ver perfil
60 
          ))
 - 
 
61 
          : <div className="view-more">Sin seguidores</div>
 - 
 
62 
        }
 87 
        </a>
63 
      </div>
 88 
      </div>
64 
    </div>
 89 
    </div>
65 
  );
 90 
  )
- 
 
 91 
}
- 
 
 92 
 
- 
 
 93 
const Modal = ({
- 
 
 94 
  isShow = false,
- 
 
 95 
  followers = [],
- 
 
 96 
  handleClose = function () { }
- 
 
 97 
}) => {
- 
 
 98 
  return (
- 
 
 99 
    <Modal show={isShow} onHide={handleClose}>
- 
 
 100 
      <Modal.Header closeButton>
- 
 
 101 
        <h3>Seguidores</h3>
- 
 
 102 
      </Modal.Header>
- 
 
 103 
      <Modal.Body>
- 
 
 104 
        {followers.map((follower) =>
- 
 
 105 
          <CompanyFollowers.Template
- 
 
 106 
            key={follower.id}
- 
 
 107 
            follower={follower}
- 
 
 108 
          />
- 
 
 109 
        )}
- 
 
 110 
      </Modal.Body>
- 
 
 111 
    </Modal>
- 
 
 112 
  )
- 
 
 113 
}
- 
 
 114 
 
- 
 
 115 
CompanyFollowers.Template = Template
Línea 66... Línea 116...
66 
};
 116 
CompanyFollowers.Modal = Modal