import type { FC } from "react";

import { Stack } from "@mantine/core";
import { StateView } from "@wealthledger/ui";
import { useTranslation } from "react-i18next";

import {
	InvestmentRefreshState,
	type InvestmentRefreshStateProps,
} from "@/features/tbank-connection";

const AccountsPageEmpty: FC<InvestmentRefreshStateProps> = (props) => {
	const { t } = useTranslation();

	return (
		<Stack>
			<InvestmentRefreshState {...props} />

			<StateView
				text={t("accounts.emptyText")}
				title={t("accounts.emptyTitle")}
			/>
		</Stack>
	);
};

export { AccountsPageEmpty };