Proyectos de Subversion LeadersLinked - SPA

import React, { useState } from 'react';
import { Grid } from '@mui/material';

import { useFetch, usePagination } from '@shared/hooks';

import { Spinner } from '@shared/components';
import { ConversationsList, MessagesList } from '@inmail/components';

export function InmailPage() {
  const [selectedConversation, setSelectedConversation] = useState(null);

  const { data: conversations, loading } = useFetch('/email');

  const {
    items: messages,
    loading: loadingMessages,
    lastElementRef
  } = usePagination(selectedConversation?.messages_url);

  if (loading || !conversations) {
    return <Spinner />;
  }

  return (
    <Grid container spacing={2} sx={{ height: 'calc(100vh - 100px)' }}>
      <Grid item xs={12} md={3}>
        <ConversationsList
          conversations={conversations}
          onSelectConversation={setSelectedConversation}
        />
      </Grid>
      <Grid item xs={12} md={9}>
        <MessagesList
          messages={messages}
          loading={loadingMessages}
          lastElementRef={lastElementRef}
        />
      </Grid>
    </Grid>
  );
}