WebSVN – LeadersLinked - Antes de SPA – Diff – /react-webpack/dashboard/components/feed/FeedTemplate.js

+/* eslint-disable camelcase */
 /* eslint-disable react/prop-types */
-import React, { useEffect, useState, useRef } from "react";
+import React, { useEffect, useState, useRef } from 'react'
-import parse from "html-react-parser"
+import parse from 'html-react-parser'
-import { useDispatch } from "react-redux";
+import { useDispatch } from 'react-redux'
-import { axios } from "../../../utils";
+import { axios } from '../../../utils'
-import { EmailIcon, EmailShareButton, FacebookIcon, FacebookShareButton, RedditIcon, RedditShareButton, TelegramIcon, TelegramShareButton, TwitterIcon, TwitterShareButton, WhatsappIcon, WhatsappShareButton } from "react-share";
+import { EmailIcon, EmailShareButton, FacebookIcon, FacebookShareButton, RedditIcon, RedditShareButton, TelegramIcon, TelegramShareButton, TwitterIcon, TwitterShareButton, WhatsappIcon, WhatsappShareButton } from 'react-share'
 // Redux types
-import { shareModalTypes } from "../../../redux/share-modal/shareModal.types";
+import { shareModalTypes } from '../../../redux/share-modal/shareModal.types'
-import { feedTypes } from "../../../redux/feed/feed.types";
+import { feedTypes } from '../../../redux/feed/feed.types'
 // Redux actions
-import { openShareModal } from "../../../redux/share-modal/shareModal.actions";
-import { addNotification } from "../../../redux/notification/notification.actions";
-import FeedModal from "./FeedModal";
+import { openShareModal } from '../../../redux/share-modal/shareModal.actions'
+import { addNotification } from '../../../redux/notification/notification.actions'
-import FeedHeader from "./FeedHeader";
+// Components
+import FeedModal from './FeedModal'
-import FeedCommentSection from "./feed-comment/FeedCommentSection";
+import FeedHeader from './FeedHeader'
 import FeedCommentSection from './feed-comment/FeedCommentSection'
 const Feed = ({ feed, owner_shared, image }) => {
 const Feed = ({ feed, owner_shared, image }) => {
   // Destructuring feed data
     feed_share_url,
     feed_delete_url,
     comments,
     comment_add_url,
     feed_share_external_url
-  } = feed;
+  } = feed
   const dispatch = useDispatch()
-  const [totalComments, setTotalComments] = useState(comments.length || 0);
+  const [totalComments, setTotalComments] = useState(comments.length || 0)
-  const [feedIsLiked, setFeedIsLiked] = useState(feed_is_liked);
+  const [feedIsLiked, setFeedIsLiked] = useState(feed_is_liked)
-  const [sharedState, setSharedState] = useState(owner_shared);
+  const [sharedState, setSharedState] = useState(owner_shared)
-  const [likesState, setLikesState] = useState(feed_likes);
+  const [likesState, setLikesState] = useState(feed_likes)
-  const [shareUrl, setShareUrl] = useState('');
+  const [shareUrl, setShareUrl] = useState('')
-  const [showComments, setShowComments] = useState(false);
+  const [showComments, setShowComments] = useState(false)
-  const [shareOptions, setShareOptions] = useState(false)
-  const [show, setShow] = useState(false);
+  const [shareOptions, setShareOptions] = useState(false)
   const [show, setShow] = useState(false)
-  const shareContainer = useRef(null);
+  const shareContainer = useRef(null)
-  useEffect(() => setSharedState(owner_shared), [owner_shared]);
+  useEffect(() => setSharedState(owner_shared), [owner_shared])
   useEffect(() => {
     const handleClickOutside = (event) => {
       if (shareContainer.current && !shareContainer.current.contains(event.target)) {
         setShareOptions(false)
       }
+    }
-    document.addEventListener("mousedown", handleClickOutside);
+    document.addEventListener('mousedown', handleClickOutside)
     return () => {
           setShareUrl(data.data)
           return resolve(data.data)
         })
         .catch((err) => reject(err))
+    }
-  });
+  })
   const likeHandler = (likeUrl) => {
     axios.post(likeUrl)
       .then((res) => {
-        const { success, data } = res.data;
+        const { success, data } = res.data
         if (!success) {
-          setFeedIsLiked((previousState) => !previousState);
+          setFeedIsLiked((previousState) => !previousState)
           dispatch(addNotification({
-            style: "danger",
+            style: 'danger',
-            msg: data,
+            msg: data
-          }));
+          }))
         } else {
           setLikesState(data.likes)
-          setFeedIsLiked(!feedIsLiked);
+          setFeedIsLiked(!feedIsLiked)
         }
-      });
+      })
   };
           ownerUrl={owner_url}
           feedDeleteUrl={feed_delete_url}
           feedUnique={feed_unique}
         />
         <div onClick={() =>
-          (owner_file_image || owner_file_video || owner_file_document)
+          (owner_file_image || owner_file_video || owner_file_document) &&
-          && setShow(true)
+          setShow(true)
+        }
+        >
           <Feed.Content
-            isShare={feed.shared_name ? true : false}
+            isShare={!!feed.shared_name}
             ownerFileImage={feed.owner_file_image}
             ownerFileVideo={feed.owner_file_video}
             ownerFileImagePreview={feed.owner_file_image_preview}
             ownerFileDocument={feed.owner_file_document}
             ownerDescription={feed.owner_description}
           <ul className="reactions-list">
             <li>
               <button
                 type="button"
                 id={feedIsLiked ? `btn-unlike-${feed_unique}` : `btn-like-${feed_unique}`}
-                className={feedIsLiked ? "btn-unlike" : "btn-like"}
+                className={feedIsLiked ? 'btn-unlike' : 'btn-like'}
                 onClick={() => likeHandler(feedIsLiked ? feed_unlike_url : feed_like_url)}
+              >
                 {feedIsLiked ? <i className="mr-1 fa fa-heart" /> : <i className="mr-1 fa fa-heart-o" />}
                 {likesState}
               </button>
           addUrl={comment_add_url}
           updateTotalComments={(total) => setTotalComments(total)}
           comments={comments}
           isShow={showComments}
         />
-      </div >
+      </div>
     </>
-  );
+  )
-};
+}
 const Content = ({
   showDescription = true,
   ownerFileImage,
   ownerFileDocument,
   ownerDescription,
   isShare,
   sharedItem
 }) => {
   return (
     <div className="job_descp">
       {showDescription &&
         <Feed.Description ownerDescription={ownerDescription} />
+      }
           preload="none"
         />
+      }
       {ownerFileDocument &&
         <a href={ownerFileDocument} target="_blank" rel="noreferrer">
-          Descargar
+          {LABELS.DOWNLOAD}
         </a>
+      }
       {isShare &&
         <Feed.SharedContent
           name={sharedItem.name}
     </div>
+  )
+}
-const Description = ({ ownerDescription }) => {
+const Description = ({ ownerDescription }) => {
-  const [isReadMoreActive, setIsReadMoreActive] = useState(false);
+  const [isReadMoreActive, setIsReadMoreActive] = useState(false)
   const readMoreHandler = () => setIsReadMoreActive(!isReadMoreActive)
   const htmlParsedText = (fullStringText) => {
     const fullText = parse(fullStringText)
     if (fullStringText.length > 500) {
-      const shortenedString = fullStringText.substr(0, 500);
+      const shortenedString = fullStringText.substr(0, 500)
-      const shortenedText = parse(`${shortenedString}... `);
+      const shortenedText = parse(`${shortenedString}... `)
       return (
         <p>
           {isReadMoreActive ? fullText : shortenedText}
           <span className='cursor-pointer' onClick={readMoreHandler}>
-            {isReadMoreActive ? " Leer menos" : " Leer más"}
+            {isReadMoreActive ? LABELS.READ_LESS : LABELS.READ_MORE}
           </span>
         </p>
-      );
+      )
+    }
     return <p>{fullText}</p>
   };
   timeElapse,
   description,
   fileVideo,
   fileImagePreview,
   fileImage,
-  fileDocument,
+  fileDocument
 }) => {
-  const [isReadMoreActive, setIsReadMoreActive] = useState(false);
+  const [isReadMoreActive, setIsReadMoreActive] = useState(false)
   const readMoreHandler = () => setIsReadMoreActive(!isReadMoreActive)
   const htmlParsedText = (fullStringText) => {
     const fullText = parse(fullStringText)
     if (fullStringText.length > 500) {
-      const shortenedString = fullStringText.substr(0, 500);
+      const shortenedString = fullStringText.substr(0, 500)
-      const shortenedText = parse(`${shortenedString}... `);
+      const shortenedText = parse(`${shortenedString}... `)
       return (
         <p>
           {isReadMoreActive ? fullText : shortenedText}
           <span className='cursor-pointer' onClick={readMoreHandler}>
-            {isReadMoreActive ? " Leer menos" : " Leer más"}
+            {isReadMoreActive ? LABELS.READ_LESS : LABELS.READ_MORE}
           </span>
         </p>
       );
     }
     return <p>{fullText}</p>
   };
   return (
     <div className="shared-post-bar">
       <div className="post-bar">
         <div className="post_topbar">
           <div className="usy-dt">
             <img
               src={image}
               alt=""
-              style={{ width: "50px", height: "auto" }}
+              style={{ width: '50px', height: 'auto' }}
             />
             <div className="usy-name">
               preload="none"
             />
+          }
           {fileDocument &&
             <a href={fileDocument} target="_blank" rel="noreferrer">
-              Descargar
+              {LABELS.DOWNLOAD}
             </a>
+          }
         </div>
       </div>
     </div>
 Feed.SharedContent = SharedContent
 Feed.Description = Description
-Feed.Content = Content
 Feed.Content = Content

Proyectos de Subversion LeadersLinked - Antes de SPA

(root)/react-webpack/dashboard/components/feed/FeedTemplate.js – Rev 4061 → 5115