Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 1773 | Rev 2248 | 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 {axios} from "../../../utils";
4
 
5
const SuggestedGroupsHelper = (props) => {
6
  // props destructuring
7
  const { groupId } = props;
8
 
9
  // states
10
  const [suggestedGroups, setSuggestedGroups] = useState([]);
1773 steven 11
  const [lookMore, setLookMore] = useState(false);
1 www 12
  useEffect(() => {
13
    axios.get(`/helpers/groups-suggestion/${groupId}`).then((response) => {
14
      const resData = response.data;
15
      if (resData.success) {
16
        setSuggestedGroups(resData.data);
17
      } else {
18
        // alert error
19
      }
20
    });
21
  }, []);
1773 steven 22
 
23
  const getData = () => {
24
    let infoFollows = [...suggestedGroups]
25
    if(!lookMore){
26
      infoFollows = infoFollows.slice(0, 5);
27
    }
28
    return infoFollows
29
  }
1 www 30
  return (
31
    <React.Fragment>
32
      <div
33
        className="widget suggestions full-width"
34
        id="suggestions-similar-groups"
35
        style={{
36
          height: "450px",
37
          overflowY: "auto",
38
        }}
39
      >
40
        <div className="sd-title">
41
          <h3>Grupos Similares</h3>
42
        </div>
43
        {/* <!--sd-title end--> */}
44
        {suggestedGroups.length ? (
1773 steven 45
          getData().map(({ id, name, image, profile }) => (
1 www 46
            <div className="suggestion-usd" key={id}>
47
              <div
48
                className="row"
49
              >
50
                <div
51
                  className="col-md-4 col-sm-12"
52
                >
53
                  <img
54
                    style={{ width: "50px", height: "auto" }}
55
                    src={image}
56
                    alt=""
57
                  />
58
                </div>
59
                <div
60
                  className="col-md-8 col-sm-12 text-left"
61
                >
62
                  <div className="sgt-text">
63
                    <h4
64
                      className="cursor-pointer"
65
                      onClick={() => window.location.href = profile}
66
                    >{name}</h4>
67
                  </div>
68
                </div>
69
              </div>
70
            </div>
71
          ))
72
        ) : (
73
          <div className="view-more">Sin sugerencias</div>
74
        )}
1773 steven 75
        {
1777 steven 76
          suggestedGroups.length >= 5 && (
1773 steven 77
            <div
78
              className="w-100 text-center"
79
            >
80
              <button className="btn btn-primary" onClick={() => setLookMore(!lookMore)}>
81
                {lookMore ? 'Ver menos' : 'Ver mas'}
82
              </button>
83
            </div>
84
          )
85
        }
1 www 86
      </div>
87
    </React.Fragment>
88
  );
89
};
90
 
91
export default SuggestedGroupsHelper;