import { useSelector } from "react-redux";
import { useAccount } from "wagmi";

import { WarnBar } from "@components/common/WarnBar";
import { useAccounts } from "@hooks/useAccounts";
import { useIsSmartAccount } from "@hooks/useIsSmartAccount";
import type { ReduxStateType } from "@store/types";

export const RecipientWarning = () => {
	const { chainId } = useAccount();
	const { accounts } = useAccounts();
	const address = accounts?.filter((acc) => acc.chainType === "EVM")?.[0]
		?.address;

	const { sender, receiver } = useSelector(
		(state: ReduxStateType) => state.quoteParams,
	);

	const isSmartAccount = useIsSmartAccount(sender || address || "", chainId || 1);
	const isReceiverSame = sender?.toLowerCase() === receiver?.toLowerCase();

	if (isSmartAccount && (isReceiverSame || !receiver)) {
		return (
			<WarnBar
				title="Recommended: Confirm Recipient Address"
				subtitle="You're sending assets to the same smart account you're connected with."
				icon="wallet"
				classNames="bn-rounded-lg bn-mt-2.5"
			/>
		);
	}

	return null;
};
