Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev 7144 Rev 7145
Línea 16... Línea 16...
16 
import ShareOutlinedIcon from '@mui/icons-material/ShareOutlined'
 16 
import ShareOutlinedIcon from '@mui/icons-material/ShareOutlined'
17 
import EmojiEmotionsIcon from '@mui/icons-material/EmojiEmotions'
 17 
import EmojiEmotionsIcon from '@mui/icons-material/EmojiEmotions'
18 
import VolunteerActivismIcon from '@mui/icons-material/VolunteerActivism'
 18 
import VolunteerActivismIcon from '@mui/icons-material/VolunteerActivism'
Línea 19... Línea 19...
19 
 
 19 
 
20 
import InputOption from './InputOption'
 - 
 
21 
import Avatar from '../../UI/AvatarImage'
 20 
import InputOption from './InputOption'
22 
import ConfirmModal from '../../modals/ConfirmModal'
 21 
import ConfirmModal from '../../modals/ConfirmModal'
23 
import FeedCommentSection from '../CommentSection'
 22 
import FeedCommentSection from '../CommentSection'
24 
import withExternalShare from './withExternalShare'
 23 
import withExternalShare from './withExternalShare'
25 
import FeedModal from '../FeedModal'
 24 
import FeedModal from '../FeedModal'
Línea 26... Línea 25...
26 
import SurveyForm from '../../survey-form/SurveyForm'
 25 
import SurveyForm from '../../survey-form/SurveyForm'
27 
 
 26 
 
- 
 
 27 
import './Feed.scss'
- 
 
 28 
import ReactionsButton from '../../UI/buttons/ReactionsButton'
Línea 28... Línea 29...
28 
import './Feed.scss'
 29 
import Options from '../../UI/Option'
29 
import ReactionsButton from '../../UI/buttons/ReactionsButton'
 30 
import { Avatar } from '@mui/material'
30 
 
 31 
 
31 
const Feed = (props) => {
 32 
const Feed = (props) => {
Línea 322... Línea 323...
322 
      {image && <img src={image} className="Entradas" loading="lazy" />}
 323 
      {image && <img src={image} className="Entradas" loading="lazy" />}
323 
      {video && (
 324 
      {video && (
324 
        <video src={video} controls poster={imagePreview} preload="none" />
 325 
        <video src={video} controls poster={imagePreview} preload="none" />
325 
      )}
 326 
      )}
326 
      {document && (
 327 
      {document && (
327 
        <a href={document} download>
 328 
        <a href={document} target="blank" download>
328 
          <img className="pdf" src="/images/extension/pdf.png" alt="pdf" />
 329 
          <img className="pdf" src="/images/extension/pdf.png" alt="pdf" />
329 
        </a>
 330 
        </a>
330 
      )}
 331 
      )}
331 
      {sharedItem.name && (
 332 
      {sharedItem.name && (
332 
        <div className="py-3 px-md-3">
 333 
        <div className="py-3 px-md-3">
Línea 355... Línea 356...
355 
  deleteUrl = '',
 356 
  deleteUrl = '',
356 
  viewUrl = '',
 357 
  viewUrl = '',
357 
  feedUnique = '',
 358 
  feedUnique = '',
358 
}) => {
 359 
}) => {
359 
  const [showConfirmModal, setShowConfirmModal] = useState(false)
 360 
  const [showConfirmModal, setShowConfirmModal] = useState(false)
360 
  const [displayOption, setDisplayOption] = useState(false)
 - 
 
361 
  const deleteButton = useRef()
 - 
 
362 
  const labels = useSelector(({ intl }) => intl.labels)
 361 
  const labels = useSelector(({ intl }) => intl.labels)
- 
 
 362 
  const options = useRef([])
363 
  const dispatch = useDispatch()
 363 
  const dispatch = useDispatch()
Línea -... Línea 364...
- 
 
 364 
 
364 
 
 365 
  const toggleConfirm = () => {
- 
 
 366 
    setShowConfirmModal(!showConfirmModal)
- 
 
 367 
  }
- 
 
 368 
 
- 
 
 369 
  const onDelete = () => {
- 
 
 370 
    axios.post(deleteUrl).then((response) => {
Línea 365... Línea -...
365 
  const handleShowConfirmModal = () => setShowConfirmModal(!showConfirmModal)
 - 
 
366 
 
 - 
 
367 
  const deleteFeedHandler = () => {
 - 
 
368 
    axios.post(deleteUrl).then((res) => {
 371 
      const { data, success } = response.data
369 
      const { data } = res
 372 
 
370 
      if (!data.success) {
 373 
      if (!success) {
371 
        dispatch(addNotification({ style: 'danger', msg: data.data }))
 374 
        dispatch(addNotification({ style: 'danger', msg: data }))
372 
        return
 - 
 
373 
      }
 - 
 
- 
 
 375 
        return
374 
      dispatch(addNotification({ style: 'success', msg: data.data }))
 376 
      }
- 
 
 377 
 
- 
 
 378 
      dispatch(deleteFeed(feedUnique))
375 
      handleShowConfirmModal()
 379 
      toggleConfirm()
376 
      dispatch(deleteFeed(feedUnique))
 380 
      dispatch(addNotification({ style: 'success', msg: data }))
Línea 377... Línea 381...
377 
    })
 381 
    })
378 
  }
 - 
 
379 
 
 - 
 
380 
  useEffect(() => {
 382 
  }
381 
    const handleClickOutside = (event) => {
 383 
 
382 
      if (
 - 
 
383 
        deleteButton.current &&
 384 
  useEffect(() => {
384 
        !deleteButton.current.contains(event.target)
 - 
 
385 
      ) {
 385 
    if (deleteUrl) {
386 
        setDisplayOption(false)
 - 
 
387 
      }
 - 
 
388 
    }
 - 
 
389 
    document.addEventListener('mousedown', handleClickOutside)
 - 
 
390 
 
 - 
 
391 
    return () => {
 386 
      const deleteOption = { action: toggleConfirm, label: labels.delete }
Línea 392... Línea 387...
392 
      document.removeEventListener('mousedown', handleClickOutside)
 387 
      options.current.concat(deleteOption)
393 
    }
 388 
    }
394 
  }, [deleteButton])
 389 
  }, [deleteUrl])
395 
 
 390 
 
396 
  return (
 - 
 
397 
    <div className="feed__header">
 391 
  return (
398 
      <div className="d-inline-flex" style={{ gap: '.5rem' }}>
 392 
    <div className="feed__header">
399 
        <Avatar imageUrl={image} name={name} size="xl" />
 393 
      <div className="d-inline-flex">
400 
 
 394 
        <Avatar src={image} alt={name} sx={{ width: '60px', height: '60px' }} />
401 
        <div className="feed__info">
 395 
        <div className="feed__info">
402 
          <a href={viewUrl}>
 396 
          <a href={viewUrl}>
403 
            <h2>{name}</h2>
 397 
            <h2>{name}</h2>
404 
          </a>
 398 
          </a>
405 
          <div className="time__elapse">
 399 
          <div className="time__elapse">
406 
            <p>{timeElapsed}</p>
 400 
            <p>{timeElapsed}</p>
407 
            <AccessTimeIcon className="time__elapse-icon" />
 - 
 
408 
          </div>
 - 
 
409 
        </div>
 - 
 
410 
      </div>
 - 
 
411 
 
 - 
 
412 
      {deleteUrl && (
 - 
 
413 
        <div className="cursor-pointer d-flex align-items-center position-relative">
 - 
 
414 
          <img
 - 
 
415 
            src="/images/icons/options.png"
 - 
 
416 
            className="cursor-pointer img-icon options"
 - 
 
417 
            onClick={() => setDisplayOption(!displayOption)}
 - 
 
418 
          />
 - 
 
419 
          <div className={`feed-options ${displayOption ? 'active' : ''}`}>
 - 
 
420 
            <ul>
 - 
 
421 
              <li>
 - 
 
422 
                <button
 - 
 
423 
                  className="option-btn"
 - 
 
424 
                  onClick={handleShowConfirmModal}
 - 
 
425 
                  ref={deleteButton}
 401 
            <AccessTimeIcon className="time__elapse-icon" />
426 
                >
 - 
 
427 
                  <i className="fa fa-trash-o mr-1" />
 - 
 
428 
                  {labels.delete}
 - 
 
429 
                </button>
 402 
          </div>
430 
              </li>
 403 
        </div>
431 
            </ul>
 404 
      </div>
432 
          </div>
 405 
      <Options options />
433 
          <ConfirmModal
 - 
 
434 
            show={showConfirmModal}
 - 
 
435 
            onClose={() => handleShowConfirmModal(false)}
 - 
 
436 
            onAccept={deleteFeedHandler}
 406 
      <ConfirmModal
437 
            acceptLabel={labels.accept}
 407 
        show={showConfirmModal}
438 
          />
 408 
        onClose={toggleConfirm}
439 
        </div>
 409 
        onAccept={onDelete}
Línea 440... Línea 410...
440 
      )}
 410 
      />