Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 2963 | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 2963 Rev 3719
Línea 1... Línea 1...
1 
import React, { useMemo } from 'react'
 1 
import React, { useMemo } from 'react';
2 
import { useNavigate } from 'react-router-dom'
 2 
import { useNavigate } from 'react-router-dom';
3 
import { useSelector } from 'react-redux'
 3 
import { useSelector } from 'react-redux';
4 
import {
 4 
import {
5 
  Avatar,
 5 
  Avatar,
6 
  List,
 6 
  List,
7 
  ListItem,
 7 
  ListItem,
8 
  ListItemAvatar,
 8 
  ListItemAvatar,
9 
  ListItemButton,
 9 
  ListItemButton,
10 
  ListItemText
 10 
  ListItemText
11 
} from '@mui/material'
 11 
} from '@mui/material';
12 
 
 12 
 
13 
import { useFetch } from '@hooks'
 13 
import { useFetch } from '@hooks';
14 
 
 14 
 
15 
import Widget from '@components/UI/Widget'
 15 
import Widget from '@components/UI/Widget';
16 
import EmptySection from '@components/UI/EmptySection'
 16 
import EmptySection from '@components/UI/EmptySection';
17 
 
 17 
 
18 
export default function HomeNews({ currentPost }) {
 18 
export default function HomeNews({ currentPost }) {
19 
  const { data: posts } = useFetch('/helpers/posts', [])
 19 
  const { data: posts } = useFetch('/helpers/posts', []);
20 
  const labels = useSelector(({ intl }) => intl.labels)
 20 
  const labels = useSelector(({ intl }) => intl.labels);
21 
  const navigate = useNavigate()
 21 
  const navigate = useNavigate();
22 
 
 22 
 
23 
  const filterPosts = useMemo(
 23 
  const filterPosts = useMemo(
24 
    () => posts?.filter((post) => !post.link.includes(currentPost)),
 24 
    () => posts?.filter((post) => !post.link.includes(currentPost)),
25 
    [posts, currentPost]
 25 
    [posts, currentPost]
26 
  )
 26 
  );
27 
 
 27 
 
28 
  return (
 28 
  return (
29 
    <Widget>
 29 
    <Widget>
30 
      <Widget.Header title={labels.posts} />
 30 
      <Widget.Header title={labels.posts} />
31 
 
 31 
 
32 
      <Widget.Body>
 32 
      <Widget.Body>
33 
        {filterPosts?.length <= 0 && (
 - 
 
34 
          <EmptySection message={labels.not_available_posts} />
 33 
        {filterPosts?.length <= 0 && <EmptySection message={labels.not_available_posts} />}
35 
        )}
 - 
 
36 
 
 34 
 
37 
        <List sx={{ maxHeight: 285, overflow: 'auto' }}>
 35 
        <List sx={{ maxHeight: 285, overflow: 'auto' }}>
38 
          {filterPosts.map(({ link, title, image, date }) => (
 36 
          {filterPosts.map(({ link, title, image, date }) => (
39 
            <ListItem key={title}>
 37 
            <ListItem key={title}>
40 
              <ListItemButton onClick={() => navigate(link)}>
 38 
              <ListItemButton onClick={() => navigate(link)}>
41 
                <ListItemAvatar>
 39 
                <ListItemAvatar>
42 
                  <Avatar src={image} alt={`${title} post image`} />
 40 
                  <Avatar src={image} alt={`${title} post image`} />
43 
                </ListItemAvatar>
 41 
                </ListItemAvatar>
44 
 
 42 
 
45 
                <ListItemText primary={title} secondary={date} />
 43 
                <ListItemText primary={title} secondary={date} />
46 
              </ListItemButton>
 44 
              </ListItemButton>
47 
            </ListItem>
 45 
            </ListItem>
48 
          ))}
 46 
          ))}
49 
        </List>
 47 
        </List>
50 
      </Widget.Body>
 48 
      </Widget.Body>
51 
    </Widget>
 49 
    </Widget>
52 
  )
 50 
  );
53 
}
 51 
}