Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 4322 | Rev 4623 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 4322 Rev 4621
Línea 1... Línea 1...
1 
/* eslint-disable react/prop-types */
 1 
/* eslint-disable react/prop-types */
2 
import React, { useState } from 'react'
 2 
import React, { useEffect, useRef, useState } from 'react'
3 
import ThumbUpAltOutlinedIcon from '@mui/icons-material/ThumbUpAltOutlined'
 3 
import ThumbUpAltOutlinedIcon from '@mui/icons-material/ThumbUpAltOutlined'
4 
import ThumbUpAltIcon from '@mui/icons-material/ThumbUpAlt'
 4 
import ThumbUpAltIcon from '@mui/icons-material/ThumbUpAlt'
5 
import ChatOutlinedIcon from '@mui/icons-material/ChatOutlined'
 5 
import ChatOutlinedIcon from '@mui/icons-material/ChatOutlined'
6 
import ShareOutlinedIcon from '@mui/icons-material/ShareOutlined'
 6 
import ShareOutlinedIcon from '@mui/icons-material/ShareOutlined'
7 
import SendOutlinedIcon from '@mui/icons-material/SendOutlined'
 7 
import SendOutlinedIcon from '@mui/icons-material/SendOutlined'
Línea 13... Línea 13...
13 
import { addNotification } from '../../../../redux/notification/notification.actions'
 13 
import { addNotification } from '../../../../redux/notification/notification.actions'
14 
import { openShareModal } from '../../../../redux/share-modal/shareModal.actions'
 14 
import { openShareModal } from '../../../../redux/share-modal/shareModal.actions'
15 
import { shareModalTypes } from '../../../../redux/share-modal/shareModal.types'
 15 
import { shareModalTypes } from '../../../../redux/share-modal/shareModal.types'
16 
import { feedTypes } from '../../../../redux/feed/feed.types'
 16 
import { feedTypes } from '../../../../redux/feed/feed.types'
17 
import FeedCommentSection from '../../../components/feed/feed-comment/FeedCommentSection'
 17 
import FeedCommentSection from '../../../components/feed/feed-comment/FeedCommentSection'
18 
import { connect } from 'react-redux'
 18 
import { connect, useDispatch } from 'react-redux'
19 
import withExternalShare from './withExternalShare'
 19 
import withExternalShare from './withExternalShare'
- 
 
 20 
import ConfirmModal from '../../../../shared/confirm-modal/ConfirmModal'
- 
 
 21 
import { deleteFeed } from '../../../../redux/feed/feed.actions'
Línea 20... Línea 22...
20 
 
 22 
 
21 
const Feed = ({
 23 
const Feed = ({
22 
  isShare = false,
 24 
  isShare = false,
23 
  feed_unique,
 25 
  feed_unique,
Línea 85... Línea 87...
85 
        image={owner_image}
 87 
        image={owner_image}
86 
        name={owner_name}
 88 
        name={owner_name}
87 
        timeElapsed={owner_time_elapse}
 89 
        timeElapsed={owner_time_elapse}
88 
        viewUrl={owner_url}
 90 
        viewUrl={owner_url}
89 
        deleteUrl={feed_delete_url}
 91 
        deleteUrl={feed_delete_url}
- 
 
 92 
        feedUnique={feed_unique}
90 
      />
 93 
      />
Línea 91... Línea 94...
91 
 
 94 
 
92 
      <div className='feed__body'>
 95 
      <div className='feed__body'>
93 
        <Feed.Content
 96 
        <Feed.Content
Línea 201... Línea 204...
201 
  image = '',
 204 
  image = '',
202 
  name = '',
 205 
  name = '',
203 
  timeElapsed = '',
 206 
  timeElapsed = '',
204 
  deleteUrl = '',
 207 
  deleteUrl = '',
205 
  viewUrl = '',
 208 
  viewUrl = '',
- 
 
 209 
  feedUnique = ''
206 
}) => {
 210 
}) => {
- 
 
 211 
  const [showConfirmModal, setShowConfirmModal] = useState(false);
- 
 
 212 
  const [displayOption, setDisplayOption] = useState(false)
- 
 
 213 
  const deleteButton = useRef();
- 
 
 214 
  const dispatch = useDispatch()
- 
 
 215 
 
- 
 
 216 
  const handleShowConfirmModal = () => setShowConfirmModal(!showConfirmModal);
- 
 
 217 
 
- 
 
 218 
  const deleteFeedHandler = () => {
- 
 
 219 
    axios.post(deleteUrl)
- 
 
 220 
      .then((res) => {
- 
 
 221 
        const { data } = res
- 
 
 222 
        if (!data.success) {
- 
 
 223 
          dispatch(addNotification({ style: "danger", msg: data.data }))
- 
 
 224 
          return
- 
 
 225 
        }
- 
 
 226 
        dispatch(addNotification({ style: "success", msg: data.data }))
- 
 
 227 
        handleShowConfirmModal()
- 
 
 228 
        dispatch(deleteFeed(feedUnique));
- 
 
 229 
      });
- 
 
 230 
  };
- 
 
 231 
 
- 
 
 232 
  useEffect(() => {
- 
 
 233 
    const handleClickOutside = (event) => {
- 
 
 234 
      if (deleteButton.current && !deleteButton.current.contains(event.target)) {
- 
 
 235 
        setDisplayOption(false)
- 
 
 236 
      }
- 
 
 237 
    }
- 
 
 238 
    document.addEventListener("mousedown", handleClickOutside);
- 
 
 239 
 
- 
 
 240 
    return () => {
- 
 
 241 
      document.removeEventListener("mousedown", handleClickOutside);
- 
 
 242 
    };
- 
 
 243 
  }, [deleteButton]);
- 
 
 244 
 
207 
  return (
 245 
  return (
208 
    <div className='feed__header'>
 246 
    <div className='feed__header'>
209 
      <Avatar
 247 
      <Avatar
210 
        imageUrl={image}
 248 
        imageUrl={image}
211 
        name={name}
 249 
        name={name}
Línea 220... Línea 258...
220 
            {timeElapsed}
 258 
            {timeElapsed}
221 
          </p>
 259 
          </p>
222 
          <AccessTimeIcon className='time__elapse-icon' />
 260 
          <AccessTimeIcon className='time__elapse-icon' />
223 
        </div>
 261 
        </div>
224 
      </div>
 262 
      </div>
- 
 
 263 
      {deleteUrl &&
- 
 
 264 
        <div className="cursor-pointer d-flex align-items-center">
- 
 
 265 
          <img
- 
 
 266 
            src='/images/icons/options.png'
- 
 
 267 
            className='cursor-pointer img-icon options'
- 
 
 268 
            onClick={() => setDisplayOption(!displayOption)}
- 
 
 269 
          />
- 
 
 270 
          <div className={`feed-options ${displayOption ? 'active' : ''}`}>
- 
 
 271 
            <ul>
- 
 
 272 
              <li>
- 
 
 273 
                <button
- 
 
 274 
                  className="option-btn"
- 
 
 275 
                  onClick={handleShowConfirmModal}
- 
 
 276 
                  ref={deleteButton}
- 
 
 277 
                >
- 
 
 278 
                  <i className="fa fa-trash-o mr-1" />
- 
 
 279 
                  Borrar
- 
 
 280 
                </button>
- 
 
 281 
              </li>
- 
 
 282 
            </ul>
- 
 
 283 
          </div>
- 
 
 284 
          <ConfirmModal
- 
 
 285 
            show={showConfirmModal}
- 
 
 286 
            onClose={() => handleShowConfirmModal(false)}
- 
 
 287 
            onAccept={deleteFeedHandler}
- 
 
 288 
            acceptLabel="Aceptar"
- 
 
 289 
          />
- 
 
 290 
        </div>}
225 
    </div>
 291 
    </div>
226 
  )
 292 
  )
227 
}
 293 
}
Línea 228... Línea 294...
228 
 
 294