From 1a6870f1102ff19bab9886ce16143c32e2faa1ca Mon Sep 17 00:00:00 2001
From: brusher_ru <brusher.designer@gmail.com>
Date: Wed, 20 Nov 2024 15:22:04 -0300
Subject: [PATCH] feat: show hint for account that is not supported on choosen
 network

---
 src/components/AccountActionHints.tsx | 37 ++++++++++++++++++++++++++-
 1 file changed, 36 insertions(+), 1 deletion(-)

diff --git a/src/components/AccountActionHints.tsx b/src/components/AccountActionHints.tsx
index 9ea55b8..3aa9da4 100644
--- a/src/components/AccountActionHints.tsx
+++ b/src/components/AccountActionHints.tsx
@@ -33,7 +33,42 @@ function AccountActionHints(): JSX.Element | null {
   const [account, isSpawned] = data;
   if (isSpawned) return null;
 
+  const getBorderColor = () => {
+    if (!!currentAccount?.isAthena !== network.isAthena) {
+      return 'brand.red';
+    }
+    return 'brand.green';
+  };
   const renderContents = () => {
+    // Is Athena account on Non-Athena network
+    if (!!currentAccount?.isAthena && !network.isAthena) {
+      return (
+        <Box w="100%">
+          <Text fontSize="md" fontWeight="bold" mb={2}>
+            That network does not support Athena accounts
+          </Text>
+          <Text fontSize="sm">
+            Please switch to the original Spacemesh account first.
+          </Text>
+        </Box>
+      );
+    }
+    // Is Athena account on Non-Athena network
+    if (!currentAccount?.isAthena && !!network.isAthena) {
+      return (
+        <Box w="100%">
+          <Text fontSize="md" fontWeight="bold" mb={2}>
+            That network supports only Athena accounts
+          </Text>
+          <Text fontSize="sm">
+            Please switch to the Athena account first.
+            <br />
+            You may need to create it first on the &quot;Keys &amp;
+            Accounts&quot; page.
+          </Text>
+        </Box>
+      );
+    }
     // No balance
     if (
       account.state.current.balance === '0' ||
@@ -128,7 +163,7 @@ function AccountActionHints(): JSX.Element | null {
     <Card
       my={4}
       variant="outline"
-      borderColor="brand.green"
+      borderColor={getBorderColor()}
       maxW={{ base: '100%', md: '600px' }}
     >
       <CardBody>{renderContents()}</CardBody>