import React from "react";
import Stack from "react-bootstrap/Stack";

import { IAccount, IEmail, IMailbox } from "./client/types";
import Client from "./client/Client";
import EmailContent from "./EmailContent";
import EmailList from "./EmailList";

type EmailAreaProps = {
	account: IAccount | null;
	client: Client;
	email: IEmail | null;
	emailId: string;
	mailbox: IMailbox | null;
};

const EmailArea: React.FC<EmailAreaProps> = (props) => {
	if (props.emailId === "") {
		return (
			<EmailList
				account={props.account}
				client={props.client}
				mailbox={props.mailbox}
			/>
		);
	} else {
		return (
			<Stack className="text-start">
				<EmailList
					account={props.account}
					client={props.client}
					mailbox={props.mailbox}
				/>
				<EmailContent
					account={props.account}
					client={props.client}
					email={props.email}
					emailId={props.emailId}
				/>
			</Stack>
		);
	}
};
export default EmailArea;