Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 1979 Rev 2162
Línea 5... Línea 5...
5 
import { addNotification } from '../../redux/notification/notification.actions'
 5 
import { addNotification } from '../../redux/notification/notification.actions'
6 
import { useDispatch, useSelector } from 'react-redux'
 6 
import { useDispatch, useSelector } from 'react-redux'
7 
import { Container, Grid } from '@mui/material'
 7 
import { Container, Grid } from '@mui/material'
8 
import parse from 'html-react-parser'
 8 
import parse from 'html-react-parser'
Línea 9... Línea -...
9 
 
 - 
 
10 
import TungstenIcon from '@mui/icons-material/Tungsten'
 - 
 
11 
import RecommendIcon from '@mui/icons-material/Recommend'
 - 
 
12 
import FavoriteIcon from '@mui/icons-material/FavoriteTwoTone'
 9 
 
13 
import SendOutlinedIcon from '@mui/icons-material/SendOutlined'
 10 
import SendOutlinedIcon from '@mui/icons-material/SendOutlined'
14 
import ChatOutlinedIcon from '@mui/icons-material/ChatOutlined'
 - 
 
15 
import EmojiEmotionsIcon from '@mui/icons-material/EmojiEmotions'
 - 
 
Línea 16... Línea 11...
16 
import VolunteerActivismIcon from '@mui/icons-material/VolunteerActivism'
 11 
import ChatOutlinedIcon from '@mui/icons-material/ChatOutlined'
17 
 
 - 
 
18 
import HomeNews from '../../components/widgets/default/HomeNews'
 12 
 
19 
import InputOption from '../../components/dashboard/linkedin/action-button/InputOption'
 13 
import HomeNews from '../../components/widgets/default/HomeNews'
20 
import withExternalShare from '../../components/dashboard/linkedin/withExternalShare'
 14 
import withExternalShare from '../../components/dashboard/linkedin/withExternalShare'
21 
import Paraphrase from '../../components/UI/Paraphrase'
 15 
import Paraphrase from '../../components/UI/Paraphrase'
22 
import WidgetWrapper from '../../components/widgets/WidgetLayout'
 16 
import WidgetWrapper from '../../components/widgets/WidgetLayout'
23 
import withReactions from '../../hocs/withReaction'
 17 
import withReactions from '../../hocs/withReaction'
24 
import MobileShare from '../../components/dashboard/linkedin/mobile-share/MobileShare'
 18 
import MobileShare from '../../components/dashboard/linkedin/mobile-share/MobileShare'
- 
 
 19 
import CommentForm from '@app/components/dashboard/linkedin/comments/comment-form'
- 
 
 20 
import CommentsList from '@app/components/dashboard/linkedin/comments/comment-list'
Línea 25... Línea 21...
25 
import CommentForm from '@app/components/dashboard/linkedin/comments/comment-form'
 21 
import Button from '@app/components/UI/buttons/Buttons'
26 
import CommentsList from '@app/components/dashboard/linkedin/comments/comment-list'
 22 
import FeedReactions from '@app/components/dashboard/linkedin/feed/FeedReactions'
27 
 
 23 
 
28 
const PostViewPage = () => {
 24 
const PostViewPage = () => {
29 
  const [post, setPost] = useState({})
 25 
  const [post, setPost] = useState({})
30 
  const [totalSends, setTotalSends] = useState(0)
 - 
 
31 
  const [reactions, setReactions] = useState([])
 26 
  const [totalSends, setTotalSends] = useState(0)
32 
  const [myReaction, setMyReaction] = useState('')
 27 
  const [reactions, setReactions] = useState([])
33 
  const [totalReactions, setTotalReactions] = useState(0)
 28 
  const [myReaction, setMyReaction] = useState('')
34 
  const [isMobile, setIsMobile] = useState(false)
 29 
  const [isMobile, setIsMobile] = useState(false)
35 
  const [comments, setComments] = useState([])
 30 
  const [comments, setComments] = useState([])
36 
  const [showComments, setShowComments] = useState(false)
 31 
  const [showComments, setShowComments] = useState(false)
Línea 37... Línea -...
37 
  const { pathname } = useLocation()
 - 
 
38 
  const labels = useSelector(({ intl }) => intl.labels)
 - 
 
39 
  const dispatch = useDispatch()
 - 
 
40 
 
 - 
 
41 
  const reactionsOptions = [
 - 
 
42 
    {
 - 
 
43 
      type: 'r',
 - 
 
44 
      icon: <RecommendIcon style={{ color: '#7405f9' }} />
 - 
 
45 
    },
 - 
 
46 
    {
 - 
 
47 
      type: 's',
 - 
 
48 
      icon: <VolunteerActivismIcon style={{ color: '#6495ED' }} />
 - 
 
49 
    },
 - 
 
50 
    {
 - 
 
51 
      type: 'l',
 - 
 
52 
      icon: <FavoriteIcon style={{ color: '#DF704D' }} />
 - 
 
53 
    },
 - 
 
54 
    {
 - 
 
55 
      type: 'i',
 - 
 
56 
      icon: (
 - 
 
57 
        <TungstenIcon
 - 
 
58 
          style={{ color: '#F5BB5C', transform: 'rotate(180deg)' }}
 - 
 
59 
        />
 - 
 
60 
      )
 - 
 
61 
    },
 - 
 
62 
    {
 - 
 
63 
      type: 'f',
 - 
 
64 
      icon: <EmojiEmotionsIcon style={{ color: '#FF7F50' }} />
 32 
  const { pathname } = useLocation()
65 
    }
 33 
  const labels = useSelector(({ intl }) => intl.labels)
66 
  ]
 34 
  const dispatch = useDispatch()
Línea 67... Línea 35...
67 
 
 35 
 
Línea 87... Línea 55...
87 
 
 55 
 
88 
  const handleExternalShare = (value) => {
 56 
  const handleExternalShare = (value) => {
89 
    setTotalSends(value)
 57 
    setTotalSends(value)
Línea 90... Línea 58...
90 
  }
 58 
  }
91 
 
 - 
 
92 
  const ExternalShareButton = withExternalShare(
 - 
 
93 
    InputOption,
 - 
 
Línea 94... Línea 59...
94 
    post.share_external_url
 59 
 
Línea 95... Línea 60...
95 
  )
 60 
  const ExternalShareButton = withExternalShare(Button, post.share_external_url)
96 
 
 61 
 
97 
  const ReactionButton = withReactions(InputOption)
 62 
  const ReactionButton = withReactions(Button)
Línea 164... Línea 129...
164 
      getComments()
 129 
      getComments()
165 
    }
 130 
    }
166 
  }, [showComments])
 131 
  }, [showComments])
Línea 167... Línea 132...
167 
 
 132 
 
168 
  useEffect(() => {
 - 
 
169 
    const feedReactions = reactions.reduce(
 - 
 
170 
      (acc, reaction) => acc + Number(reaction.total),
 - 
 
171 
      0
 - 
 
172 
    )
 - 
 
173 
 
 - 
 
174 
    setTotalReactions(feedReactions)
 - 
 
175 
  }, [reactions])
 - 
 
176 
 
 - 
 
177 
  useEffect(() => {
 133 
  useEffect(() => {
178 
    const ua = navigator.userAgent.toLowerCase()
 134 
    const ua = navigator.userAgent.toLowerCase()
Línea 179... Línea 135...
179 
    const isAndroid = ua.includes('android')
 135 
    const isAndroid = ua.includes('android')
180 
 
 136 
 
Línea 197... Línea 153...
197 
              }}
 153 
              }}
198 
            />
 154 
            />
199 
            <WidgetWrapper.Body>
 155 
            <WidgetWrapper.Body>
200 
              <h2>{post.title}</h2>
 156 
              <h2>{post.title}</h2>
201 
              <Paraphrase>{post.description}</Paraphrase>
 157 
              <Paraphrase>{post.description}</Paraphrase>
202 
              {post.file && (
 158 
              {renderContent({
203 
                <a href={post.file} download>
 159 
                type: post.type,
204 
                  <img src='/images/extension/pdf.png' alt='pdf' />
 - 
 
205 
                </a>
 160 
                file: post.file
206 
              )}
 161 
              })}
207 
            </WidgetWrapper.Body>
 162 
            </WidgetWrapper.Body>
Línea 208... Línea 163...
208 
 
 163 
 
209 
            <div className='d-flex justify-content-between align-items-center px-3'>
 164 
            <div className='d-flex justify-content-between align-items-center px-3'>
210 
              <div className='reactions-counter'>
 165 
              <FeedReactions
211 
                {reactionsOptions
 - 
 
212 
                  .filter((option) =>
 - 
 
213 
                    reactions.find(({ reaction }) => reaction === option.type)
 - 
 
214 
                  )
 166 
                reactions={reactions}
215 
                  .map((reaction) => reaction.icon)}
 - 
 
216 
                <span>{totalReactions} reacciones</span>
 167 
                reactionsUrl={post.reactions_url}
- 
 
 168 
              />
217 
              </div>
 169 
 
218 
              {!!totalSends && (
 170 
              {!!totalSends && (
219 
                <span>{`${totalSends} ${labels.sends?.toLowerCase()}`}</span>
 171 
                <span>{`${totalSends} ${labels.sends?.toLowerCase()}`}</span>
220 
              )}
 172 
              )}
Línea 221... Línea 173...
221 
            </div>
 173 
            </div>
222 
 
 174 
 
223 
            <WidgetWrapper.Actions>
 175 
            <WidgetWrapper.Actions>
224 
              <ReactionButton
 176 
              <ReactionButton
225 
                currentReaction={myReaction}
 177 
                currentReaction={myReaction}
226 
                saveUrl={post.save_reaction_url}
 178 
                saveUrl={post.save_reaction_url}
227 
                deleteUrl={post.delete_reaction_url}
 179 
                deleteUrl={post.delete_reaction_url}
228 
                onReaction={({ reactions, currentReaction }) => {
 180 
                onReaction={({ reactions }, currentReaction) => {
229 
                  setReactions(reactions)
 181 
                  setReactions(reactions)
230 
                  setMyReaction(currentReaction)
 182 
                  setMyReaction(currentReaction)
231 
                }}
 - 
 
- 
 
 183 
                }}
232 
              />
 184 
              />
233 
              <InputOption
 185 
 
234 
                icon={ChatOutlinedIcon}
 186 
              <Button onClick={displayCommentSection}>
235 
                icGridor='gray'
 - 
 
236 
                label={labels.comment}
 187 
                <ChatOutlinedIcon style={{ color: 'gray' }} />
Línea 237... Línea 188...
237 
                onClick={displayCommentSection}
 188 
                {labels.comment}
238 
              />
 189 
              </Button>
239 
 
 190 
 
240 
              {!isMobile ? (
 191 
              {!isMobile ? (
Línea 274... Línea 225...
274 
      </Grid>
 225 
      </Grid>
275 
    </Container>
 226 
    </Container>
276 
  )
 227 
  )
277 
}
 228 
}
Línea -... Línea 229...
- 
 
 229 
 
- 
 
 230 
export const renderContent = ({ type, file }) => {
- 
 
 231 
  switch (type) {
- 
 
 232 
    case 'video': {
- 
 
 233 
      return <video src={file} controls preload='none' />
- 
 
 234 
    }
- 
 
 235 
 
- 
 
 236 
    case 'image': {
- 
 
 237 
      return <img src={file} />
- 
 
 238 
    }
- 
 
 239 
 
- 
 
 240 
    case 'document': {
- 
 
 241 
      return (
- 
 
 242 
        <a href={file} target='_blank' rel='noreferrer'>
- 
 
 243 
          <img className='pdf' src='/images/extension/pdf.png' alt='pdf' />
- 
 
 244 
        </a>
- 
 
 245 
      )
- 
 
 246 
    }
- 
 
 247 
  }
- 
 
 248 
}
278 
 
 249