Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev Autor Línea Nro. Línea
5413 stevensc 1 
/* eslint-disable camelcase */
3552 stevensc 2 
/* eslint-disable react/prop-types */
5411 stevensc 3 
import React, { useEffect, useRef, useState } from 'react'
5414 stevensc 4 
import parse from 'html-react-parser'
5406 stevensc 5 
import { connect } from 'react-redux'
5414 stevensc 6 
import { setIntlLabels } from '../../../redux/intl/intl.action'
7 
import { setTimelineUrl } from '../../../redux/feed/feed.actions'
5406 stevensc 8 
import { addNotification } from '../../../redux/notification/notification.actions'
9 
import FeedSection from '../../../dashboard/components/feed-section/FeedSection'
5411 stevensc 10 
import SuggestWidget from '../../../shared/helpers/my-groups-helper/SuggestWidget'
5414 stevensc 11 
import CompanyFollowersHelper from '../../../shared/helpers/company-followers-helper/CompanyFollowers'
5416 stevensc 12 
import CompanyInfo from '../components/CompanyInfo'
1 www 13 
 
14 
const TABS = {
5406 stevensc 15 
  FEEDS: 'FEEDS',
5566 stevensc 16 
  INFO: 'INFO',
5406 stevensc 17 
}
1 www 18 
 
5566 stevensc 19 
const View = ({ backendVars, setTimelineUrl, setIntlLabels, labels }) => {
1 www 20 
  const {
21 
    companyId,
22 
    cover,
23 
    image,
24 
    totalFollowers,
25 
    facebook,
26 
    twitter,
27 
    instagram,
28 
    companyName,
29 
    overview,
30 
    locations,
31 
    industry,
32 
    companySize,
33 
    foundationYear,
34 
    website,
5566 stevensc 35 
    timeline,
5414 stevensc 36 
  } = backendVars
5406 stevensc 37 
  const [isFollower, setIsFollower] = useState(false)
38 
  const [currentTab, setCurrentTab] = useState(TABS.INFO)
39 
  const shouldSetInitialTab = useRef(true)
1 www 40 
 
1110 stevensc 41 
  useEffect(() => {
5406 stevensc 42 
    setTimelineUrl(timeline)
43 
    shouldSetInitialTab.current = false
5414 stevensc 44 
    setIntlLabels(labels)
5406 stevensc 45 
  }, [])
1108 stevensc 46 
 
1107 stevensc 47 
  useEffect(() => {
5566 stevensc 48 
    isFollower ? setCurrentTab(TABS.FEEDS) : setCurrentTab(TABS.INFO)
5406 stevensc 49 
  }, [isFollower])
1107 stevensc 50 
 
5416 stevensc 51 
  useEffect(() => {
52 
    if (shouldSetInitialTab.current && isFollower) setCurrentTab(TABS.FEEDS)
53 
  }, [isFollower])
1 www 54 
 
5411 stevensc 55 
  const changeCurrentTab = (tab) => setCurrentTab(tab)
56 
 
5416 stevensc 57 
  const markIsFollower = (val) => setIsFollower(val)
58 
 
1 www 59 
  return (
3930 stevensc 60 
    <>
1 www 61 
      <section className="cover-sec">
5566 stevensc 62 
        <img
63 
          src={`/storage/type/company-cover/code/${companyId}/${
64 
            cover ? `filename/${cover}` : ''
65 
          }`}
66 
          alt="cover-image"
67 
        />
1 www 68 
      </section>
5411 stevensc 69 
      <main className="main-section-data container px-0 mt-3">
70 
        <div className="main-left-sidebar">
5416 stevensc 71 
          <CompanyInfo
72 
            companyId={companyId}
73 
            companyName={companyName}
74 
            image={image}
75 
            facebook={facebook}
76 
            instagram={instagram}
77 
            totalFollowers={totalFollowers}
78 
            twitter={twitter}
79 
            markFollower={markIsFollower}
80 
          />
5411 stevensc 81 
          <div className="d-none d-md-block">
82 
            <CompanyFollowersHelper companyId={companyId} />
83 
          </div>
84 
        </div>
85 
        <div className="main-ws-sec">
86 
          <div className="user-tab-sec rewivew">
5422 stevensc 87 
            <div className="row">
5566 stevensc 88 
              {isFollower && (
5422 stevensc 89 
                <div className="col text-left pl-0">
5411 stevensc 90 
                  <button
91 
                    className="btn btn-link p-0 text-decoration-none"
5422 stevensc 92 
                    onClick={() => changeCurrentTab(TABS.FEEDS)}
5411 stevensc 93 
                    style={{ padding: '0 !important' }}
94 
                  >
5566 stevensc 95 
                    <span className="p-0 default-link font-weight-bold text-dark">
96 
                      Ver Publicaciones
97 
                    </span>
5411 stevensc 98 
                  </button>
3929 stevensc 99 
                </div>
5566 stevensc 100 
              )}
5422 stevensc 101 
              <div className="col text-right pr-0">
102 
                <button
103 
                  className="btn btn-link p-0 text-decoration-none"
104 
                  onClick={() => changeCurrentTab(TABS.INFO)}
105 
                  style={{ padding: '0 !important' }}
106 
                >
5566 stevensc 107 
                  <span className="p-0 default-link font-weight-bold text-dark">
108 
                    Ver Información
109 
                  </span>
5422 stevensc 110 
                </button>
3930 stevensc 111 
              </div>
5422 stevensc 112 
            </div>
3930 stevensc 113 
          </div>
5566 stevensc 114 
          {currentTab === TABS.FEEDS && (
5411 stevensc 115 
            <div
116 
              className="product-feed-tab animated fadeIn"
117 
              id="feed-dd feed"
118 
              style={{ display: 'block' }}
119 
            >
120 
              <div className="posts-section">
121 
                <FeedSection
122 
                  routeTimeline={timeline}
5566 stevensc 123 
                  image={`/storage/type/company/code/${companyId}/${
124 
                    image ? `filename/${image}` : ''
125 
                  }`}
5411 stevensc 126 
                />
3930 stevensc 127 
              </div>
1 www 128 
            </div>
5566 stevensc 129 
          )}
130 
          {currentTab === TABS.INFO && (
131 
            <div
5411 stevensc 132 
              className="product-feed-tab animated fadeIn"
133 
              id="feed-dd info"
134 
              style={{ display: 'block' }}
135 
            >
5566 stevensc 136 
              {overview && (
5411 stevensc 137 
                <div className="user-profile-extended-ov">
138 
                  <h3>Visión general</h3>
139 
                  <span>{parse(overview)}</span>
140 
                </div>
5566 stevensc 141 
              )}
142 
              {locations && (
5411 stevensc 143 
                <div className="user-profile-extended-ov st2">
144 
                  <h3>Ubicación</h3>
145 
                  <span>
5566 stevensc 146 
                    {locations.map(({ formatted_address, is_main }, index) => (
147 
                      <React.Fragment key={index}>
148 
                        {index >= 0 ? <hr /> : ''}
149 
                        <p>
150 
                          {`${formatted_address} ${
151 
                            is_main === 'y' ? '(Principal)' : ''
152 
                          }`}
153 
                        </p>
154 
                      </React.Fragment>
155 
                    ))}
5411 stevensc 156 
                  </span>
157 
                </div>
5566 stevensc 158 
              )}
159 
              {industry && (
5411 stevensc 160 
                <div className="user-profile-ov">
161 
                  <h3>Industria</h3>
162 
                  <span>{industry}</span>
163 
                </div>
5566 stevensc 164 
              )}
165 
              {companySize && (
5411 stevensc 166 
                <div className="user-profile-ov">
167 
                  <h3>Tamaño de la empresa</h3>
168 
                  <span>{companySize}</span>
169 
                </div>
5566 stevensc 170 
              )}
171 
              {foundationYear && (
5411 stevensc 172 
                <div className="user-profile-ov">
173 
                  <h3>Año de fundación</h3>
174 
                  <span>{foundationYear}</span>
175 
                </div>
5566 stevensc 176 
              )}
177 
              {website && (
5411 stevensc 178 
                <div className="user-profile-ov">
179 
                  <h3>Página web</h3>
180 
                  <span>{website}</span>
181 
                </div>
5566 stevensc 182 
              )}
5411 stevensc 183 
            </div>
5566 stevensc 184 
          )}
1 www 185 
        </div>
5411 stevensc 186 
        <div className="right-sidebar">
5566 stevensc 187 
          <SuggestWidget
188 
            title="Empresas similares:"
189 
            url={`/helpers/company-suggestion/${companyId}`}
190 
          />
5411 stevensc 191 
        </div>
192 
      </main>
3930 stevensc 193 
    </>
5406 stevensc 194 
  )
195 
}
1 www 196 
 
197 
const mapDispatchToProps = {
198 
  addNotification: (notification) => addNotification(notification),
5414 stevensc 199 
  setTimelineUrl: (url) => setTimelineUrl(url),
5566 stevensc 200 
  setIntlLabels: (labels) => setIntlLabels(labels),
5406 stevensc 201 
}
1 www 202 
 
5406 stevensc 203 
export default connect(null, mapDispatchToProps)(View)