Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 3274 Rev 3694
Línea 1... Línea 1...
1 
import React, { useState } from 'react'
 1 
import React, { useState } from 'react';
2 
import { useDispatch, useSelector } from 'react-redux'
 2 
import { useDispatch, useSelector } from 'react-redux';
3 
import { Box, Button, styled, Typography } from '@mui/material'
 3 
import { Box, Button, styled, Typography } from '@mui/material';
- 
 
 4 
import ChatOutlined from '@mui/icons-material/ChatOutlined';
- 
 
 5 
import SendOutlined from '@mui/icons-material/SendOutlined';
4 
import { ChatOutlined, SendOutlined, ShareOutlined } from '@mui/icons-material'
 6 
import ShareOutlined from '@mui/icons-material/ShareOutlined';
5 
 
 7 
 
6 
import { withReactions } from '@hocs'
 8 
import { withReactions } from '@hocs';
7 
import { feedTypes } from '@store/feed/feed.types'
 9 
import { feedTypes } from '@store/feed/feed.types';
8 
import { shareModalTypes } from '@store/share-modal/shareModal.types'
 10 
import { shareModalTypes } from '@store/share-modal/shareModal.types';
9 
import { openShareModal } from '@store/share-modal/shareModal.actions'
 11 
import { openShareModal } from '@store/share-modal/shareModal.actions';
10 
 
 12 
 
11 
import Widget from '@components/UI/Widget'
 13 
import Widget from '@components/UI/Widget';
12 
import Comments from '../linkedin/comments/comments'
 14 
import Comments from '../linkedin/comments/comments';
13 
import Reactions from '../reactions/reactions'
 15 
import Reactions from '../reactions/reactions';
14 
import withExternalShare from '../linkedin/withExternalShare'
 16 
import withExternalShare from '../linkedin/withExternalShare';
Línea 15... Línea 17...
15 
 
 17 
 
16 
const Row = styled(Box)(({ theme }) => ({
 18 
const Row = styled(Box)(({ theme }) => ({
17 
  display: 'flex',
 19 
  display: 'flex',
18 
  padding: theme.spacing(0.5),
 20 
  padding: theme.spacing(0.5),
19 
  justifyContent: 'space-between',
 21 
  justifyContent: 'space-between',
20 
  alignItems: 'center',
 22 
  alignItems: 'center',
21 
  gap: theme.spacing(0.5)
 23 
  gap: theme.spacing(0.5)
Línea 22... Línea 24...
22 
}))
 24 
}));
23 
 
 25 
 
24 
export default function FeedActions({ id }) {
 26 
export default function FeedActions({ id }) {
25 
  const {
 27 
  const {
Línea 36... Línea 38...
36 
    feed_my_reaction: feedMyReaction,
 38 
    feed_my_reaction: feedMyReaction,
37 
    feed_reactions: feedReactions,
 39 
    feed_reactions: feedReactions,
38 
    owner_external_shared: ownerExternalShared,
 40 
    owner_external_shared: ownerExternalShared,
39 
    feed_share_url: feedShareUrl,
 41 
    feed_share_url: feedShareUrl,
40 
    feed_unique: feedUnique
 42 
    feed_unique: feedUnique
41 
  } = useSelector(({ feed }) => feed.feeds.byId[id])
 43 
  } = useSelector(({ feed }) => feed.feeds.byId[id]);
42 
  const labels = useSelector(({ intl }) => intl.labels)
 44 
  const labels = useSelector(({ intl }) => intl.labels);
43 
  const dispatch = useDispatch()
 45 
  const dispatch = useDispatch();
44 
 
 46 
 
45 
  const [totalComments, setTotalComments] = useState(ownerComments)
 47 
  const [totalComments, setTotalComments] = useState(ownerComments);
46 
  const [reaction, setReaction] = useState(feedMyReaction)
 48 
  const [reaction, setReaction] = useState(feedMyReaction);
47 
  const [ownerReactions, setOwnerReactions] = useState(feedReactions)
 49 
  const [ownerReactions, setOwnerReactions] = useState(feedReactions);
48 
  const [externalShare, setExternalShare] = useState(ownerExternalShared)
 50 
  const [externalShare, setExternalShare] = useState(ownerExternalShared);
49 
  const [showComments, setShowComments] = useState(false)
 51 
  const [showComments, setShowComments] = useState(false);
Línea 50... Línea 52...
50 
 
 52 
 
Línea 51... Línea 53...
51 
  const setTotalShares = (value) => setExternalShare(value)
 53 
  const setTotalShares = (value) => setExternalShare(value);
Línea 52... Línea 54...
52 
 
 54 
 
53 
  const toggleComments = () => setShowComments((prev) => !prev)
 55 
  const toggleComments = () => setShowComments((prev) => !prev);
54 
 
 56 
 
55 
  const updateReactions = ({ reactions }, currentReaction) => {
 57 
  const updateReactions = ({ reactions }, currentReaction) => {
Línea 56... Línea 58...
56 
    setOwnerReactions(reactions)
 58 
    setOwnerReactions(reactions);
57 
    setReaction(currentReaction)
 - 
 
58 
  }
 - 
 
59 
 
 - 
 
60 
  const shareFeed = () => {
 59 
    setReaction(currentReaction);
61 
    dispatch(
 - 
 
62 
      openShareModal(
 - 
 
63 
        feedShareUrl,
 - 
 
64 
        shareModalTypes.SHARE,
 - 
 
65 
        feedTypes.DASHBOARD,
 60 
  };
Línea 66... Línea 61...
66 
        feedUnique
 61 
 
67 
      )
 62 
  const shareFeed = () => {
Línea 68... Línea 63...
68 
    )
 63 
    dispatch(openShareModal(feedShareUrl, shareModalTypes.SHARE, feedTypes.DASHBOARD, feedUnique));
69 
  }
 64 
  };
70 
 
 65 
 
71 
  const ExternalShareButton = withExternalShare(Button, shareExternalUrl)
 66 
  const ExternalShareButton = withExternalShare(Button, shareExternalUrl);
Línea 94... Línea 89...
94 
              {`${externalShare} ${labels.sends?.toLowerCase()}`}
 89 
              {`${externalShare} ${labels.sends?.toLowerCase()}`}
95 
            </Typography>
 90 
            </Typography>
96 
          ) : null}
 91 
          ) : null}
97 
        </Row>
 92 
        </Row>
98 
      </Row>
 93 
      </Row>
99 
      <Widget.Actions
 - 
 
100 
        styles={{ display: contentType === 'fast-survey' ? 'none' : 'flex' }}
 94 
      <Widget.Actions styles={{ display: contentType === 'fast-survey' ? 'none' : 'flex' }}>
101 
      >
 - 
 
102 
        <ReactionButton
 95 
        <ReactionButton
103 
          currentReactionType={reaction}
 96 
          currentReactionType={reaction}
104 
          saveUrl={saveReactionUrl}
 97 
          saveUrl={saveReactionUrl}
105 
          deleteUrl={deleteReactionUrl}
 98 
          deleteUrl={deleteReactionUrl}
106 
          onReaction={updateReactions}
 99 
          onReaction={updateReactions}
107 
        />
 100 
        />
108 
        <Button onClick={toggleComments}>
 101 
        <Button onClick={toggleComments}>
109 
          <ChatOutlined />
 102 
          <ChatOutlined />
110 
          <Typography
 - 
 
111 
            sx={{ display: { xs: 'none', md: 'inline-flex' } }}
 103 
          <Typography sx={{ display: { xs: 'none', md: 'inline-flex' } }} variant='overline'>
112 
            variant='overline'
 - 
 
113 
          >
 - 
 
114 
            {labels.comment}
 104 
            {labels.comment}
115 
          </Typography>
 105 
          </Typography>
116 
        </Button>
 106 
        </Button>
117 
        <Button onClick={shareFeed}>
 107 
        <Button onClick={shareFeed}>
118 
          <ShareOutlined />
 108 
          <ShareOutlined />
119 
          <Typography
 - 
 
120 
            sx={{ display: { xs: 'none', md: 'inline-flex' } }}
 109 
          <Typography sx={{ display: { xs: 'none', md: 'inline-flex' } }} variant='overline'>
121 
            variant='overline'
 - 
 
122 
          >
 - 
 
123 
            {labels.share}
 110 
            {labels.share}
124 
          </Typography>
 111 
          </Typography>
125 
        </Button>
 112 
        </Button>
126 
        <ExternalShareButton
 - 
 
127 
          shorterUrl={incrementExternalCounterUrl}
 113 
        <ExternalShareButton shorterUrl={incrementExternalCounterUrl} setValue={setTotalShares}>
128 
          setValue={setTotalShares}
 - 
 
129 
        >
 - 
 
130 
          <SendOutlined />
 114 
          <SendOutlined />
131 
          <Typography
 - 
 
132 
            sx={{ display: { xs: 'none', md: 'inline-flex' } }}
 115 
          <Typography sx={{ display: { xs: 'none', md: 'inline-flex' } }} variant='overline'>
133 
            variant='overline'
 - 
 
134 
          >
 - 
 
135 
            {labels.send}
 116 
            {labels.send}
136 
          </Typography>
 117 
          </Typography>
137 
        </ExternalShareButton>
 118 
        </ExternalShareButton>
138 
      </Widget.Actions>
 119 
      </Widget.Actions>
139 
      <Box
 120 
      <Box
Línea 147... Línea 128...
147 
          addUrl={commentAddUrl}
 128 
          addUrl={commentAddUrl}
148 
          onAdd={({ totalComments }) => setTotalComments(totalComments)}
 129 
          onAdd={({ totalComments }) => setTotalComments(totalComments)}
149 
        />
 130 
        />
150 
      </Box>
 131 
      </Box>
151 
    </>
 132 
    </>
152 
  )
 133 
  );
153 
}
 134 
}