WebSVN – LeadersLinked - Antes de SPA – Autoría – /react-webpack/company/view/view/View.js

Rev	Autor	Línea Nro.	Línea
1	www	1	`import React, { useEffect, useRef } from "react";`
		2	`import { useState } from "react";`
		3	`import { connect } from "react-redux";`
		4	`import styled from "styled-components";`
1105	stevensc	5	`import { axios } from "../../../utils";`
1	www	6	`import CompanyFollowersHelper from "../../../shared/helpers/company-followers-helper/CompanyFollowers";`
		7	`import parse from "html-react-parser";`
		8	`import { addNotification } from "../../../redux/notification/notification.actions";`
		9	`import Spinner from "../../../shared/loading-spinner/Spinner";`
		10	`import { setTimelineUrl } from "../../../redux/feed/feed.actions";`
		11	`import FeedSection from "../../../dashboard/components/feed-section/FeedSection";`
		12
		13	`const TABS = {`
		14	`FEEDS: "FEEDS",`
		15	`INFO: "INFO",`
		16	`};`
		17
		18	`const View = (props) => {`
		19	`// backendVars destructuring`
		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,`
		35	`timeline,`
		36	`} = props.backendVars;`
		37
		38	`// redux destructuring`
		39	`const { addNotification, setTimelineUrl } = props;`
		40
		41	`// const [isFollower, setIsFollower] = useState(!!+follower);`
		42	`const [authorizedLinks, setAuthorizedLinks] = useState(null);`
		43	`const [loading, setLoading] = useState(false);`
		44	`const [followers, setFollowers] = useState(totalFollowers);`
		45	`const [initialLoading, setInitialLoading] = useState(true);`
1108	stevensc	46	`const [isFollower, setIsFollower] = useState(false);`
1107	stevensc	47	`const [currentTab, setCurrentTab] = useState(TABS.INFO);`
1	www	48	`const [suggestionCompanies, setSuggestionCompanies] = useState([])`
1705	steven	49	`const [lookMore, setLookMore] = useState(false);`
1	www	50	`const shouldSetInitialTab = useRef(true);`
		51
1110	stevensc	52	`useEffect(() => {`
1	www	53	`setTimelineUrl(timeline);`
1110	stevensc	54	`fetchAuthorizedLinks();`
1	www	55	`shouldSetInitialTab.current = false;`
		56	`setInitialLoading(false);`
		57	`getSuggestionCompanies()`
		58	`}, []);`
1108	stevensc	59
1	www	60	`const getSuggestionCompanies = async () => {`
		61	`try {`
		62	`setLoading(true);`
		63	const response = await axios.get(`/helpers/company-suggestion/${companyId}`);
1105	stevensc	64	`if (response.data.success)`
1	www	65	`setSuggestionCompanies(response.data.data)`
		66	`} catch (error) {`
		67	`console.log('>>: error > ', error)`
1105	stevensc	68	`} finally {`
1	www	69	`setLoading(false)`
		70	`}`
		71	`}`
		72
1107	stevensc	73	`useEffect(() => {`
		74	`isFollower`
1108	stevensc	75	`? setCurrentTab(TABS.FEEDS)`
		76	`: setCurrentTab(TABS.INFO)`
1114	stevensc	77	`}, [isFollower]);`
1107	stevensc	78
1	www	79	`const fetchAuthorizedLinks = async () => {`
		80	`setLoading(true);`
		81	const response = await axios.get(`/company/view/${companyId}`);
		82	`const resData = response.data;`
1105	stevensc	83	`(resData);`
1	www	84	`if (resData.success) {`
		85	`setAuthorizedLinks(resData.data);`
		86	`setFollowers(resData.data.total_followers);`
		87	`if (resData.data.link_unfollow) {`
		88	`setIsFollower(true);`
		89	`if (shouldSetInitialTab.current) setCurrentTab(TABS.FEEDS);`
		90	`} else {`
		91	`setIsFollower(false);`
		92	`}`
		93	`}`
		94	`return setLoading(false);`
		95	`};`
		96
		97	`const handleButtonAction = async (link) => {`
		98	`setLoading(true);`
		99	`const response = await axios.post(link);`
		100	`const resData = response.data;`
		101	`if (resData.success) {`
		102	`addNotification({`
		103	`style: "success",`
		104	`msg: resData.data,`
		105	`});`
		106	`fetchAuthorizedLinks();`
		107	`} else {`
		108	`setLoading(false);`
		109	`addNotification({`
		110	`style: "danger",`
		111	`msg: "ha ocurrido un error",`
		112	`});`
		113	`}`
		114	`};`
		115	`const changeCurrentTab = (tab) => {`
		116	`setCurrentTab(tab)`
		117	`}`
1705	steven	118
		119	`const getData = () => {`
1706	steven	120	`let infoFollows = [...suggestionCompanies]`
1705	steven	121	`if(!lookMore){`
		122	`infoFollows = infoFollows.slice(0, 5);`
		123	`}`
		124	`return infoFollows`
		125	`}`
1	www	126	`return (`
		127	`<React.Fragment>`
		128	`<section className="cover-sec">`
		129	`<img`
		130	`id="user-cover-img"`
1105	stevensc	131	src={`/storage/type/company-cover/code/${companyId}/${cover ? `filename/${cover}` : ""
		132	}`}
1	www	133	`alt="cover-image"`
		134	`/>`
		135	`</section>`
		136	`<main>`
		137	`<div className="main-section">`
		138	`<div className="container">`
		139	`<div className="main-section-data">`
		140	`<div className="row">`
		141	`<div className="col-lg-3">`
		142	`<div className="main-left-sidebar">`
1689	steven	143	`<div className="user_profile border-gray border-radius pb-5">`
1	www	144	`<div className="user-pro-img">`
		145	`<img`
		146	`id="company-img"`
1105	stevensc	147	src={`/storage/type/company/code/${companyId}/${image ? `filename/${image}` : ""
		148	}`}
1	www	149	`alt="profile-image"`
		150	`/>`
		151	`</div>`
		152	`{/* <!--user-pro-img end--> */}`
		153	`<div className="user_pro_status">`
		154	`<h1>{companyName}</h1>`
1701	steven	155	`<div`
		156	`className="row"`
		157	`style={{`
		158	`margin: '-1px'`
		159	`}}`
		160	`>`
		161	`{`
		162	`facebook && (`
		163	`<div`
		164	`className="col col-md col-sm"`
		165	`>`
		166	`<i onClick={() => window.location.href = facebook} className="cursor-pointer fa fa-facebook" style={{ fontSize: '1.4rem' }} />`
		167	`</div>`
		168	`)`
		169	`}`
		170	`{`
		171	`twitter && (`
		172	`<div`
		173	`className="col col-md col-sm"`
		174	`>`
		175	`<i onClick={() => window.location.href = twitter} className="cursor-pointer fa fa-twitter" style={{ fontSize: '1.4rem' }} />`
		176	`</div>`
		177	`)`
		178	`}`
		179	`{`
		180	`instagram && (`
		181	`<div`
		182	`className="col col-md col-sm"`
		183	`>`
		184	`<i onClick={() => window.location.href = instagram} className="fa fa-instagram cursor-pointer" style={{ fontSize: '1.4rem' }} />`
		185	`</div>`
		186	`)`
		187	`}`
		188	`</div>`
1	www	189	`<ul className="flw-status">`
1702	steven	190	`<div`
1712	steven	191	`className="container"`
1702	steven	192	`>`
		193	`<div`
1712	steven	194	`className="row overflow-auto"`
1702	steven	195	`>`
		196	`<div`
1715	steven	197	`className="col"`
1701	steven	198	`>`
1702	steven	199	`<li>`
1712	steven	200	`<span style={{ fontSize: '1rem' }} >Seguidores</span>`
		201	`<b style={{ fontSize: '1rem' }} id="total-followers">{followers}</b>`
1702	steven	202	`</li>`
		203	`</div>`
1712	steven	204	`{authorizedLinks?.link_unfollow && (`
		205	`<div`
1715	steven	206	`className="col"`
1712	steven	207	`>`
		208	`<li>`
		209	`<a`
		210	`href="#"`
1715	steven	211	`className="btn btn-primary ellipsis"`
1712	steven	212	`onClick={(e) => {`
		213	`e.preventDefault();`
		214	`handleButtonAction(authorizedLinks?.link_unfollow);`
		215	`}}`
		216	`>`
1713	steven	217	`Dejar de seguir`
1712	steven	218	`</a>`
		219	`</li>`
		220	`</div>`
		221	`)}`
		222	`{authorizedLinks?.link_follow && (`
		223	`<div`
1715	steven	224	`className="col"`
1712	steven	225	`>`
		226	`<li>`
		227	`<a`
		228	`href="#"`
1715	steven	229	`className="btn btn-primary ellipsis"`
1712	steven	230	`onClick={(e) => {`
		231	`e.preventDefault();`
		232	`handleButtonAction(authorizedLinks?.link_follow);`
		233	`}}`
		234	`>`
1713	steven	235	`Seguir`
1712	steven	236	`</a>`
		237	`</li>`
		238	`</div>`
		239	`)}`
		240	`{authorizedLinks?.link_request && (`
		241	`<div`
1715	steven	242	`className="col"`
1712	steven	243	`>`
		244	`<li>`
		245	`<a`
		246	`href="#"`
1715	steven	247	`className="btn btn-primary ellipsis"`
1712	steven	248	`onClick={(e) => {`
		249	`e.preventDefault();`
		250	`handleButtonAction(authorizedLinks?.link_request);`
		251	`}}`
		252	`>`
		253	`Trabaja en esta empresa?`
		254	`</a>`
		255	`</li>`
		256	`</div>`
		257	`)}`
		258	`{authorizedLinks?.link_accept && (`
		259	`<div`
1715	steven	260	`className="col"`
1712	steven	261	`>`
		262	`<li>`
		263	`<a`
		264	`href="#"`
1715	steven	265	`className="btn btn-primary ellipsis"`
1712	steven	266	`onClick={(e) => {`
		267	`e.preventDefault();`
		268	`handleButtonAction(authorizedLinks?.link_accept);`
		269	`}}`
		270	`>`
1713	steven	271	`Aceptar`
1712	steven	272	`</a>`
		273	`</li>`
		274	`</div>`
		275	`)}`
		276
		277	`{authorizedLinks?.link_cancel && (`
		278	`<div`
1715	steven	279	`className="col"`
1712	steven	280	`>`
		281	`<li>`
		282	`<a`
		283	`href="#"`
		284	`title=""`
1715	steven	285	`className="btn btn-primary ellipsis"`
1712	steven	286	`onClick={(e) => {`
		287	`e.preventDefault();`
		288	`handleButtonAction(authorizedLinks?.link_cancel);`
		289	`}}`
		290	`>`
1713	steven	291	`Cancelar`
1712	steven	292	`</a>`
		293	`</li>`
		294	`</div>`
		295	`)}`
		296	`{authorizedLinks?.link_reject && (`
		297	`<div`
1715	steven	298	`className="col"`
1712	steven	299	`>`
		300	`<li>`
		301	`<a`
		302	`href="#"`
		303	`title=""`
1715	steven	304	`className="btn btn-primary ellipsis"`
1712	steven	305	`onClick={(e) => {`
		306	`e.preventDefault();`
		307	`handleButtonAction(authorizedLinks?.link_reject);`
		308	`}}`
		309	`>`
1713	steven	310	`Rechazar`
1712	steven	311	`</a>`
		312	`</li>`
		313	`</div>`
		314	`)}`
		315
		316	`{authorizedLinks?.link_leave && (`
		317	`<div`
1715	steven	318	`className="col"`
1712	steven	319	`>`
		320	`<li>`
		321	`<a`
		322	`href="#"`
		323	`data-link="{{>link_leave}}"`
		324	`title=""`
1715	steven	325	`className="btn btn-primary ellipsis"`
1712	steven	326	`onClick={(e) => {`
		327	`e.preventDefault();`
		328	`handleButtonAction(authorizedLinks?.link_leave);`
		329	`}}`
		330	`>`
		331	`Abandonar esta empresa`
		332	`</a>`
		333	`</li>`
		334	`</div>`
		335	`)}`
		336	`{authorizedLinks?.link_contact && (`
		337	`<div`
1715	steven	338	`className="col"`
1712	steven	339	`>`
1704	steven	340
1712	steven	341	`<li>`
		342	`<a`
		343	`href={authorizedLinks?.link_contact}`
		344	`title=""`
1715	steven	345	`className="btn btn-primary ellipsis"`
1712	steven	346	`>`
1713	steven	347	`Mensaje`
1712	steven	348	`</a>`
		349	`</li>`
		350	`</div>`
		351	`)}`
		352	`</div>`
1702	steven	353	`</div>`
1	www	354	`</ul>`
		355	`</div>`
		356	`{/* <!--user_pro_status end--> */}`
		357	`</div>`
		358	`{/* <!--user_profile end--> */}`
		359
		360	`<CompanyFollowersHelper companyId={companyId} />`
		361	`</div>`
		362	`{/* <!--main-left-sidebar end--> */}`
		363	`</div>`
		364	`<div className="col-lg-6">`
		365	`<div className="main-ws-sec">`
		366	`<div className="user-tab-sec rewivew">`
1108	stevensc	367	`{`
		368	`!initialLoading`
		369	`&&`
1	www	370	`<div`
		371	`className="row"`
		372	`>`
1113	stevensc	373	`{`
		374	`isFollower`
		375	`&&`
		376	`<div`
1708	steven	377	`className="col text-left pl-0"`
1105	stevensc	378	`>`
1113	stevensc	379	`<button`
1709	steven	380	`className="btn btn-link p-0 text-decoration-none"`
1113	stevensc	381	`onClick={() => changeCurrentTab(TABS.FEEDS)}`
		382	`>`
1710	steven	383	`<span className="p-2 default-link font-weight-bold text-dark">Ver Publicaciones</span>`
1113	stevensc	384	`</button>`
		385	`</div>`
		386	`}`
1	www	387	`<div`
1708	steven	388	`className="col text-right pl-0"`
1	www	389	`>`
1105	stevensc	390	`<button`
1709	steven	391	`className="btn btn-link p-0 text-decoration-none"`
1105	stevensc	392	`onClick={() => changeCurrentTab(TABS.INFO)}`
		393	`>`
1710	steven	394	`<span className="p-2 default-link font-weight-bold text-dark">Ver Info</span>`
1105	stevensc	395	`</button>`
1	www	396	`</div>`
		397	`</div>`
1108	stevensc	398	`}`
1	www	399	`{/* <!-- tab-feed end--> */}`
		400	`</div>`
1109	stevensc	401	`{`
1112	stevensc	402	`currentTab === TABS.FEEDS`
1105	stevensc	403	`&&`
1109	stevensc	404	`<div`
		405	`className="product-feed-tab animated fadeIn"`
		406	`id="feed-dd feed"`
1111	stevensc	407	`style={{ display: 'block' }}`
1109	stevensc	408	`>`
		409	`<div className="posts-section">`
		410	`<FeedSection routeTimeline={timeline} />`
		411	`</div>`
		412	`</div>`
		413	`}`
		414	`{`
1113	stevensc	415	`currentTab === TABS.INFO`
1109	stevensc	416	`&&`
		417	`< div`
		418	`className="product-feed-tab animated fadeIn"`
		419	`id="feed-dd info"`
1111	stevensc	420	`style={{ display: 'block' }}`
1109	stevensc	421	`>`
1	www	422	`{`
1109	stevensc	423	`overview`
1105	stevensc	424	`&&`
1109	stevensc	425	`<div className="user-profile-extended-ov">`
		426	`<h3>Visión general</h3>`
		427	`<span>{parse(overview)}</span>`
1105	stevensc	428	`</div>`
		429	`}`
		430	`{`
1109	stevensc	431	`locations`
1105	stevensc	432	`&&`
1109	stevensc	433	`<div className="user-profile-extended-ov st2">`
		434	`<h3>Ubicación</h3>`
		435	`<span>`
		436	`{locations.map(`
		437	`({ formatted_address, is_main }, index) => (`
		438	`<React.Fragment key={index}>`
		439	`{index >= 0 ? <hr /> : ""}`
		440	`<p>`
		441	{`${formatted_address} ${is_main === "y" ? "(Principal)" : ""
		442	}`}
		443	`</p>`
		444	`</React.Fragment>`
		445	`)`
		446	`)}`
		447	`</span>`
1105	stevensc	448	`</div>`
		449	`}`
1109	stevensc	450	`{`
		451	`industry`
		452	`&&`
		453	`<div className="user-profile-ov">`
		454	`<h3>Industria</h3>`
		455	`<span>{industry}</span>`
		456	`</div>`
		457	`}`
		458	`{`
		459	`companySize`
		460	`&&`
		461	`<div className="user-profile-ov">`
		462	`<h3>Tamaño de la empresa</h3>`
		463	`<span>{companySize}</span>`
		464	`</div>`
		465	`}`
		466	`{`
		467	`foundationYear`
		468	`&&`
		469	`<div className="user-profile-ov">`
		470	`<h3>Año de fundación</h3>`
		471	`<span>{foundationYear}</span>`
		472	`</div>`
		473	`}`
		474	`{`
		475	`website`
		476	`&&`
		477	`<div className="user-profile-ov">`
		478	`<h3>Página web</h3>`
		479	`<span>{website}</span>`
		480	`</div>`
		481	`}`
		482	`</div>`
1105	stevensc	483	`}`
1110	stevensc	484	`{`
		485	`initialLoading`
		486	`&&`
1	www	487	`<div`
		488	`style={{`
		489	`display: "flex",`
		490	`justifyContent: "center",`
		491	`alignItems: "center",`
		492	`}}`
		493	`>`
		494	`<Spinner />`
		495	`</div>`
1110	stevensc	496	`}`
1	www	497	`</div>`
		498	`</div>`
		499	`<div className="col-lg-3">`
		500	`<div className="right-sidebar">`
1701	steven	501	`{loading && (`
		502	`<div className="spinner-container">`
		503	`<Spinner />`
		504	`</div>`
		505	`)}`
1	www	506	`<div`
1105	stevensc	507	`className="widget suggestions full-width d-none d-md-block d-lg-block"`
		508	`style={{`
1707	steven	509	`height: "auto",`
1105	stevensc	510	`overflowY: "auto",`
		511	`}}`
		512	`>`
		513	`<div className="sd-title">`
		514	`<h3>Empresas similares</h3>`
		515	`</div>`
		516	`{/* <!--sd-title end--> */}`
		517	`{suggestionCompanies.length ? (`
1705	steven	518	`getData().map(element => {`
1105	stevensc	519	`return (`
1691	steven	520	`<div className="suggestion-usd d-flex justify-content-start align-items-center " key={element.id}>`
1105	stevensc	521	`<img`
1692	steven	522	`style={{ width: "10%", height: "auto" }}`
1105	stevensc	523	`src={element.image}`
		524	`alt=""`
		525	`/>`
		526	`<div`
		527	`className="sgt-text"`
		528	`>`
		529	`<a href={element.profile} target="_blank">`
		530	`<h4 className="text-dark">{element.name}</h4>`
		531	`</a>`
1	www	532	`</div>`
1105	stevensc	533	`</div>`
		534	`)`
		535	`})`
		536	`) : (`
		537	`<div className="view-more">Sin empresas similares</div>`
		538	`)}`
1705	steven	539	`<div`
		540	`className="w-100 text-center"`
		541	`>`
		542	`<button className="btn btn-primary" onClick={() => setLookMore(!lookMore)}>`
		543	`Ver mas`
		544	`</button>`
		545	`</div>`
1	www	546	`</div>`
		547	`</div>`
		548	`{/* <!--right-sidebar end--> */}`
		549	`</div>`
		550	`</div>`
		551	`</div>`
		552	`{/* <!-- main-section-data end--> */}`
		553	`</div>`
		554	`</div>`
		555	`</main>`
1105	stevensc	556	`</React.Fragment >`
1	www	557	`);`
		558	`};`
		559
		560	`// const mapStateToProps = (state) => ({`
		561
		562	`// })`
		563
		564	`const mapDispatchToProps = {`
		565	`addNotification: (notification) => addNotification(notification),`
		566	`setTimelineUrl: (url) => setTimelineUrl(url),`
		567	`};`
		568
		569	`export default connect(null, mapDispatchToProps)(View);`

Proyectos de Subversion LeadersLinked - Antes de SPA

(root)/react-webpack/company/view/view/View.js – Rev 1715