Proyectos de Subversion LeadersLinked - SPA

import React from 'react'
import { Container, Grid, Typography } from '@mui/material'

import useFetch from '@app/hooks/useFetch'

import Spinner from '@app/components/UI/Spinner'
import ReportList from '@app/components/abuse-report/report-list'
import LoaderContainer from '@app/components/UI/LoaderContainer'

export default function AbuseReportPage() {
  const {
    data: { items },
    isLoading
  } = useFetch('/abuse-report')

  return (
    <Container>
      <Typography variant='h1'>Reportes de abuso</Typography>
      <Grid container spacing={2}>
        <Grid item xs={12} md={4}></Grid>

        <Grid item xs={12} md={8}>
          {isLoading ? (
            <LoaderContainer>
              <Spinner />
            </LoaderContainer>
          ) : (
            <ReportList reports={items} />
          )}
        </Grid>
      </Grid>
    </Container>
  )
}