drishti/src/EmailList.tsx

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

import Client from "./client/Client";
import { IAccount, IMailbox } from "./client/types";
import EmailSummary from "./EmailSummary";

type EmailListProps = {
	account: IAccount | null;
	client: Client | null;
	mailbox: IMailbox | null;
};

type EmailListState = {};

class EmailList extends React.Component<EmailListProps, EmailListState> {
	componentDidUpdate() {
		if (this.props.account == null) return;
		if (this.props.client == null) return;
		if (this.props.mailbox == null) return;
		this.props.client.ensureEmailList(
			this.props.account.id,
			this.props.mailbox.id,
		);
	}

	render() {
		if (
			this.props.account == null ||
			this.props.client == null ||
			this.props.mailbox == null ||
			this.props.mailbox.emailIds == null
		) {
			return <Stack />;
		} else {
			return (
				<Stack>
					{this.props.mailbox.emailIds.slice(0, 5).map((e) => (
						<EmailSummary
							account={this.props.account}
							client={this.props.client}
							emailId={e}
							email={this.props.client!.email(e)}
							key={e}
						/>
					))}
				</Stack>
			);
		}
	}
}
export default EmailList;