Proyectos de Subversion LeadersLinked - Antes de SPA

import React, { useState } from 'react'
import { Col, Modal, Row } from 'react-bootstrap'
import { useSelector } from 'react-redux'
import parse from 'html-react-parser'

import Feed from './linkedin/Feed'

const FeedModal = ({ show, onClose, feed }) => {
  const {
    owner_file_image,
    owner_file_video,
    owner_file_image_preview,
    owner_file_document,
    owner_description,
    shared_name,
    shared_image,
    shared_time_elapse,
    shared_description,
    shared_file_video,
    shared_file_image_preview,
    shared_file_image,
    shared_file_document,
    owner_name,
    owner_image,
    owner_time_elapse,
    owner_url,
    feed_delete_url,
    feed_unique,
    feed_content_type,
    feed_vote_url,
    shared_url,
  } = feed
  const [readMore, setReadMore] = useState(false)
  const labels = useSelector(({ intl }) => intl.labels)

  const onReadMore = () => {
    setReadMore(!readMore)
  }

  const htmlParsedText = (fullStringText = '') => {
    const fullText = parse(fullStringText)
    if (fullStringText.length > 500) {
      const shortenedString = fullStringText.substr(0, 500)
      const shortenedText = parse(`${shortenedString}... `)
      return (
        <>
          {readMore ? fullText : shortenedText}
          <span className="cursor-pointer" onClick={onReadMore}>
            {readMore ? labels.read_less : labels.read_more}
          </span>
        </>
      )
    }
    return <p>{fullText}</p>
  }

  return (
    <Modal show={show} onHide={onClose} dialogClassName="modal-lg">
      <Modal.Header closeButton />
      <Modal.Body>
        <Row>
          <Col md="8">
            <Feed.Content
              description={owner_description}
              image={owner_file_image}
              imagePreview={owner_file_image_preview}
              video={owner_file_video}
              document={owner_file_document}
              sharedItem={{
                name: shared_name,
                image: shared_image,
                time_elapse: shared_time_elapse,
                description: shared_description,
                file_video: shared_file_video,
                file_image_preview: shared_file_image_preview,
                file_image: shared_file_image,
                file_document: shared_file_document,
                shared_url,
              }}
              type={feed_content_type}
              voteUrl={feed_vote_url}
            />
          </Col>
          <Col md="4">
            <Feed.Header
              image={owner_image}
              name={owner_name}
              timeElapsed={owner_time_elapse}
              viewUrl={owner_url}
              deleteUrl={feed_delete_url}
              feedUnique={feed_unique}
            />
            {owner_description && htmlParsedText(owner_description)}
          </Col>
        </Row>
      </Modal.Body>
    </Modal>
  )
}

export default FeedModal