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

import { WarnBar } from "@components/common/WarnBar";
import { useAccounts } from "@hooks/useAccounts";
import { useSmartAccountType } 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 { isSmartContract, isEIP7702 } = useSmartAccountType(
		sender || address || "",
		chainId || 1,
	);
	const isReceiverSame = sender?.toLowerCase() === receiver?.toLowerCase();

	if (isSmartContract && (isReceiverSame || !receiver) && !isEIP7702) {
		return (
			<WarnBar
				title="Verify recipient address"
				subtitle="Your smart account may not exist on other chains"
				icon="warning"
				classNames="bn-rounded-lg bn-mt-2.5"
			/>
		);
	}

	return null;
};
