Proyectos de Subversion LeadersLinked - SPA

import React from 'react';

import { useSelector } from 'react-redux';

import { Box, Typography } from '@mui/material';

import { useTimeline } from '@microlearning/hooks';

import { InfinityList } from '@shared/components';

import { DetailTag } from '@microlearning/components';

export function TimelinePage() {

  const { items, loading, hasMore, loadMore } = useTimeline();

  const labels = useSelector(({ intl }) => intl.labels);

  return (

    <>

      <Typography variant='h2'>Linea de tiempo</Typography>

      <Box

        display='flex'

        flexDirection='column'

        gap={1}

        width='100%'

        mt={2}

        maxHeight='60vh'

        overflow='auto'

      >

        <InfinityList

          items={items}

          loading={loading}

          emptyMessage={labels.datatable_szerorecords}

          onEnd={loadMore}

          hasMore={hasMore}

          renderItem={({ activity, added_on }, i) => (

            <DetailTag key={i} title={activity} label={added_on} />

          )}

        />

      </Box>

    </>

  );

}