Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 3416 Rev 3432
Línea 1... Línea 1...
1 
import React, { useMemo, useState } from "react";
 1 
import React, { useMemo, useState } from 'react'
2 
import { Link } from "react-router-dom";
 2 
import { Link } 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 
  Button,
 6 
  Button,
7 
  List,
 7 
  List,
8 
  ListItem,
 8 
  ListItem,
9 
  ListItemAvatar,
 9 
  ListItemAvatar,
10 
  ListItemButton,
 10 
  ListItemButton,
11 
  ListItemText,
 11 
  ListItemText
12 
} from "@mui/material";
 12 
} from '@mui/material'
Línea 13... Línea 13...
13 
 
 13 
 
14 
import { useFetch } from "@hooks";
 14 
import { useFetch } from '@hooks'
Línea 15... Línea 15...
15 
import colors from "@styles/colors";
 15 
import colors from '@styles/colors'
16 
 
 16 
 
17 
import Widget from "@components/UI/Widget";
 17 
import Widget from '@components/UI/Widget'
Línea 18... Línea 18...
18 
import Spinner from "@components/UI/Spinner";
 18 
import Spinner from '@components/UI/Spinner'
19 
import EmptySection from "@components/UI/EmptySection";
 19 
import EmptySection from '@components/UI/EmptySection'
20 
 
 20 
 
21 
const SuggestWidget = ({ title, url }) => {
 21 
const SuggestWidget = ({ title, url }) => {
Línea 22... Línea 22...
22 
  const { data, loading } = useFetch(url, []);
 22 
  const { data, isLoading } = useFetch(url, [])
23 
  const [lookMore, setLookMore] = useState(false);
 23 
  const [lookMore, setLookMore] = useState(false)
24 
  const labels = useSelector(({ intl }) => intl.labels);
 24 
  const labels = useSelector(({ intl }) => intl.labels)
25 
 
 25 
 
Línea 26... Línea 26...
26 
  const items = useMemo(
 26 
  const items = useMemo(
27 
    () => (lookMore ? data : [...data].slice(0, 3)),
 27 
    () => (lookMore ? data : [...data].slice(0, 3)),
28 
    [lookMore, data]
 28 
    [lookMore, data]
29 
  );
 29 
  )
30 
 
 30 
 
31 
  return (
 31 
  return (
Línea 32... Línea 32...
32 
    <Widget>
 32 
    <Widget>
33 
      <Widget.Header
 33 
      <Widget.Header
34 
        title={title}
 34 
        title={title}
35 
        renderAction={() => {
 35 
        renderAction={() => {
36 
          if (data.length <= 3) return null;
 36 
          if (data.length <= 3) return null
37 
 
 37 
 
38 
          return (
 38 
          return (
39 
            <Button onClick={() => setLookMore(!lookMore)}>
 39 
            <Button onClick={() => setLookMore(!lookMore)}>
40 
              {lookMore ? labels.view_less : labels.view_more}
 40 
              {lookMore ? labels.view_less : labels.view_more}
Línea 41... Línea 41...
41 
            </Button>
 41 
            </Button>
42 
          );
 42 
          )
43 
        }}
 43 
        }}
44 
      />
 44 
      />
45 
      <Widget.Body styles={data.length > 0 && { padding: "0 !important" }}>
 45 
      <Widget.Body styles={data.length > 0 && { padding: '0 !important' }}>
46 
        {loading && <Spinner />}
 46 
        {isLoading && <Spinner />}
47 
 
 47 
 
48 
        {!loading && data.length === 0 ? (
 48 
        {!isLoading && data.length === 0 ? (
49 
          <EmptySection message={labels?.datatable_empty} />
 49 
          <EmptySection message={labels?.datatable_empty} />
Línea 65... Línea 65...
65 
            ))}
 65 
            ))}
66 
          </List>
 66 
          </List>
67 
        )}
 67 
        )}
68 
      </Widget.Body>
 68 
      </Widget.Body>
69 
    </Widget>
 69 
    </Widget>
70 
  );
 70 
  )
71 
};
 71 
}
Línea 72... Línea 72...
72 
 
 72