Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 1569 | Rev 2384 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
1 www 1 
import React from "react";
2 
import { useEffect, useState } from "react";
3 
import { connect } from "react-redux";
4 
import { useForm } from "react-hook-form";
5 
import styled from "styled-components";
6 
import {axios} from "../../../utils";
7 
import { addNotification } from "../../../redux/notification/notification.actions";
8 
import Spinner from "../../../shared/loading-spinner/Spinner";
9 
import Entity from "./entity/Entity";
1564 steven 10 
import Profile from "../../../components/Profile";
1569 steven 11 
import SearchList from "../../../components/SearchList";
1 www 12 
 
13 
const StyledSpinnerContainer = styled.div`
14 
  position: absolute;
15 
  left: 0;
16 
  top: 0;
17 
  width: 100%;
18 
  height: 100%;
19 
  background: rgba(255, 255, 255, 0.4);
20 
  display: flex;
21 
  justify-content: center;
22 
  align-items: center;
23 
  z-index: 300;
24 
`;
25 
 
26 
const MyConnections = (props) => {
27 
  // states
28 
  const [myConnections, setMyConnections] = useState([]);
29 
  const [loading, setLoading] = useState(true);
1569 steven 30 
 
1 www 31 
  useEffect(() => {
32 
    fetchMyConnections();
33 
  }, []);
34 
 
35 
  const fetchMyConnections = async (searchParam='') => {
36 
    setLoading(true);
37 
    await axios
38 
      .get(
39 
        "/connection/my-connections?search="+searchParam)
40 
      .then((response) => {
41 
        const resData = response.data;
42 
        if (resData.success) {
43 
          setMyConnections(resData.data);
44 
        }
45 
      });
46 
    setLoading(false);
47 
  };
48 
 
49 
  return (
50 
    <section className="companies-info">
51 
      <div className="container">
1569 steven 52 
        <SearchList
53 
          title="Personas con Relación directa, de 1er nivel"
54 
          fetchCallback={fetchMyConnections}
55 
        />
1 www 56 
 
57 
        <div className="companies-list">
58 
          <div
59 
            className="row"
60 
            id="profiles-container"
61 
            style={{
62 
              position: "relative",
63 
              padding: "0 15px",
64 
            }}
65 
          >
66 
            {myConnections.length > 0 ? (
67 
              myConnections.map(
68 
                (
69 
                  {
70 
                    image,
71 
                    name,
72 
                    link_view,
73 
                    link_inmail,
74 
                    link_cancel,
75 
                    link_block,
76 
                  },
77 
                  id
78 
                ) => (
1564 steven 79 
                  <Profile
2113 steven 80 
                    isTopData
1564 steven 81 
                    key={id}
1 www 82 
                    image={image}
83 
                    name={name}
1564 steven 84 
                    link_inmail={link_inmail}
1 www 85 
                    link_view={link_view}
86 
                    link_cancel={link_cancel}
87 
                    link_block={link_block}
1564 steven 88 
                    fetchCallback={fetchMyConnections}
1 www 89 
                  />
90 
                )
91 
              )
92 
            ) : (
93 
              <p>No hay resultados</p>
94 
            )}
95 
            {loading && (
96 
              <StyledSpinnerContainer>
97 
                <Spinner />
98 
              </StyledSpinnerContainer>
99 
            )}
100 
          </div>
101 
          {/* <!--product-feed-tab end--> */}
102 
        </div>
103 
      </div>
104 
    </section>
105 
  );
106 
};
107 
 
108 
// const mapStateToProps = (state) => ({});
109 
 
110 
const mapDispatchToProps = {
111 
  addNotification: (notification) => addNotification(notification),
112 
};
113 
 
114 
export default connect(null, mapDispatchToProps)(MyConnections);