Merge pull request #414 from arconnectio/development

ArConnect BETA 1.15.0

assets/_locales/en/messages.json

@@ -1127,6 +1127,10 @@
     "message": "Remove token",
     "description": "Remove token button text"
   },
+  "refresh_token": {
+    "message": "Refresh token",
+    "description": "Refresh token button text"
+  },
   "your_balance": {
     "message": "Your balance",
     "description": "Balance label for tokens"
@@ -1514,23 +1518,23 @@
     "description": "Get started title"
   },
   "get_started_description":{    
-    "message": "Explore the endless possibilities on Arweave through ArConnect",
+    "message": "Explore the endless possibilities on Arweave and aoComputer through ArConnect",
     "description": "Get started description"
   },
-  "example_ardrive_description" : {
-    "message": "ArDrive offers never-ending storage of your most valuable files. Pay once and save your memories forever.",
+  "example_astro_description" : {
+    "message": "Astro is a platform that allows users to mint the USDA stablecoin.",
     "description": "placeholder for example get started"
   },
-  "example_ans_description" : {
-    "message": "ans.gg is a popular name service built on top of the Arweave blockchain. Buy your domain once, own forever.",
+  "example_protocolland_description" : {
+    "message": "Protocol.Land is a decentralized, source controlled, code collaboration platform.",
     "description": "placeholder for example get started"
   },
   "example_publish_description" : {
     "message": "A provably neutral publishing platform aimed at dis-intermediating the truth. Publish assertions, and take your position in the Fact Marketplace!",
     "description": "placeholder for example get started"
   },
-  "example_permaswap_description" : {
-    "message": "Permaswap is a cryptocurrency exchange that enables swapping of Arweave assets.",
+  "example_bark_description" : {
+    "message": "Bark is a decentralized exchange to swap assets on the aoComputer network.",
     "description": "placeholder for example get started"
   },
   "connect_with_us_title": {
@@ -1825,9 +1829,17 @@
     "description": "ao degraded title text"
   },
   "ao_degraded_description": {
-    "message": "AO token process will be available when the network issues are resolved.",
+    "message": "AO token process will be available when <br/>the network issues are resolved.",
     "description": "ao degraded description text"
   },
+  "network_issue": {
+    "message": "Network Issue Detected.",
+    "description": "network issue title text"
+  },
+  "network_issue_description": {
+    "message": "Your ISP or VPN is blocking access to AO.<br/> Please use a different connection.",
+    "description": "network issue description text"
+  },
   "import_token": {
     "message": "Import Token",
     "description": "import token button description"
@@ -1997,5 +2009,21 @@
   "recommended":  {
     "message": "Recommended",
     "description": "required"
+  },
+  "add_wallet_error_message": {
+    "message": "Please enter a recovery phrase or key file and enter the password to your ArConnect before continuing.",
+    "description": "Error message if recovery section is left blank"
+  },
+  "empty_password_error_message": {
+    "message": "Please enter the password to your ArConnect. Not the password to the wallet you are importing.",
+    "description": "Error message if password section is left blank"
+  },
+  "missing_recovery_error_message": {
+    "message": "Please enter a recovery phrase or key file before continuing.",
+    "description": "Error message if recovery phrase or key file is left blank"
+  },
+  "incorrect_password_error_message": {
+    "message": "Password incorrect. Please enter the password to your ArConnect and try again. Not the password to the wallet you are importing.",
+    "description": "Error message if password is incorrect"
   }
 }

assets/_locales/zh_CN/messages.json

@@ -1123,6 +1123,10 @@
       "message": "移除代币",
       "description": "Remove token button text"
   },
+  "refresh_token": {
+    "message": "刷新令牌",
+    "description": "Refresh token button text"
+  },
   "your_balance": {
       "message": "您的余额",
       "description": "Balance label for tokens"
@@ -1511,23 +1515,23 @@
       "description": "Get started title"
   },
   "get_started_description": {
-      "message": "通过 ArConnect 探索 Arweave 上的无限可能",
+      "message": "通过 ArConnect 探索 Arweave 和 aoComputer 的无限可能",
       "description": "Get started description"
   },
-  "example_ardrive_description": {
-      "message": "ArDrive 提供永恒存储您的最有价值文件。只需一次付费，永远保存您的记忆。",
+  "example_astro_description": {
+      "message": "Astro 是一个允许用户铸造 USDA 稳定币的平台。",
       "description": "Placeholder for example get started"
   },
-  "example_ans_description": {
-      "message": "ans.gg 是一个基于 Arweave 区块链的流行名称服务。一次购买，永久拥有。",
+  "example_protocolland_description": {
+      "message": "Protocol.Land 是一个去中心化、源代码控制的代码协作平台。",
       "description": "Placeholder for example get started"
   },
   "example_publish_description": {
       "message": "一个旨在去中介化真相的证明中立出版平台。发布声明，并在事实市场中占据您的位置！",
       "description": "Placeholder for example get started"
   },
-  "example_permaswap_description": {
-      "message": "Permaswap 是一个加密货币交易所，允许交换 Arweave 资产。",
+  "example_bark_description": {
+      "message": "Bark 是一个去中心化交易所，用于在 aoComputer 网络上交换资产。",
       "description": "Placeholder for example get started"
   },
   "connect_with_us_title": {
@@ -1826,6 +1830,14 @@
       "message": "网络问题解决后，AO 代币处理将可用。",
       "description": "ao degraded description text"
   },
+  "network_issue": {
+    "message": "检测到网络问题。",
+    "description": "network issue title text"
+  },
+  "network_issue_description": {
+    "message": "您的 ISP 或 VPN 阻止访问 AO。<br/> 请使用其他连接。",
+    "description": "network issue description text"
+  },
   "import_token": {
       "message": "导入代币",
       "description": "Import token button description"
@@ -1991,5 +2003,21 @@
   "recommended": {
     "message": "推荐",
     "description": "recommended"
+  },
+ "add_wallet_error_message": {
+    "message": "请输入恢复短语或密钥文件，并输入 ArConnect 的密码后再继续。",
+    "description": "Error message if recovery section is left blank"
+  },
+  "empty_password_error_message": {
+    "message": "请输入 ArConnect 的密码，而不是您正在导入的钱包密码。",
+    "description": "Error message if password section is left blank"
+  },
+  "missing_recovery_error_message": {
+    "message": "请输入恢复短语或密钥文件后再继续。",
+    "description": "Error message if recovery phrase or key file is left blank"
+  },
+  "incorrect_password_error_message": {
+    "message": "密码错误。请输入 ArConnect 的密码后再试，而不是您正在导入的钱包密码。",
+    "description": "Error message if password is incorrect"
   }
 }

shim.d.ts

@@ -52,6 +52,7 @@ declare module "styled-components" {
     secondaryBtnHover: string;
     inputField: string;
     primary: string;
+    backgroundv2;
     cardBorder: string;
     fail: string;
     secondaryDelete: string;

src/background.ts

@@ -15,6 +15,7 @@ import browser from "webextension-polyfill";
 import { syncLabels } from "~wallets";
 import { trackBalance } from "~utils/analytics";
 import { subscriptionsHandler } from "~subscriptions/api";
+import { aoTokensCacheHandler } from "~tokens/aoTokens/ao";
 
 // watch for API calls
 onMessage("api_call", handleApiCalls);
@@ -37,6 +38,9 @@ browser.alarms.onAlarm.addListener(subscriptionsHandler);
 
 browser.alarms.onAlarm.addListener(trackBalance);
 
+// handle ao tokens info cache update
+browser.alarms.onAlarm.addListener(aoTokensCacheHandler);
+
 // handle alarm for updating gateways
 browser.alarms.onAlarm.addListener(handleGatewayUpdate);
 

src/components/dashboard/Tokens.tsx

@@ -125,14 +125,6 @@ export default function Tokens() {
           values={tokens}
           style={{ display: "flex", flexDirection: "column", gap: "0.4rem" }}
         >
-          {tokens.map((token) => (
-            <TokenListItem
-              token={token}
-              active={activeTokenSetting === token.id}
-              key={token.id}
-            />
-          ))}
-          <Spacer y={2} />
           {enhancedAoTokens.length > 0 && aoSettingsState && (
             <>
               <Label style={{ paddingLeft: "4px", margin: "0" }}>
@@ -150,7 +142,17 @@ export default function Tokens() {
               ))}
             </>
           )}
+          <Spacer y={1} />
+          <Label style={{ paddingLeft: "4px", margin: "0" }}>warp tokens</Label>
+          {tokens.map((token) => (
+            <TokenListItem
+              token={token}
+              active={activeTokenSetting === token.id}
+              key={token.id}
+            />
+          ))}
         </Reorder.Group>
+        <Spacer y={1} />
       </div>
       <ButtonV2 fullWidth onClick={addToken}>
         {browser.i18n.getMessage("import_token")}

src/components/dashboard/subsettings/AddWallet.tsx

@@ -32,6 +32,34 @@ export default function AddWallet() {
   // loading
   const [loading, setLoading] = useState(false);
 
+  // error state for empty provided wallet
+  const [error, setError] = useState(false);
+
+  // password empty error state
+  const [emptyPasswordError, setEmptyPasswordError] = useState(false);
+
+  // missing phrase but has pw
+  const [missingRecoveryError, setMissingRecoveryError] = useState(false);
+
+  // incorrect password
+  const [incorrectPasswordError, setIncorrectPasswordError] = useState(false);
+
+  const getErrorMessage = () => {
+    if (error) {
+      return browser.i18n.getMessage("add_wallet_error_message");
+    }
+    if (emptyPasswordError) {
+      return browser.i18n.getMessage("empty_password_error_message");
+    }
+    if (missingRecoveryError) {
+      return browser.i18n.getMessage("missing_recovery_error_message");
+    }
+    if (incorrectPasswordError) {
+      return browser.i18n.getMessage("incorrect_password_error_message");
+    }
+    return "";
+  };
+
   // seedphrase or jwk loaded from
   // the seedphrase component
   const [providedWallet, setProvidedWallet] = useState<JWKInterface | string>();
@@ -41,7 +69,34 @@ export default function AddWallet() {
 
   // add wallet
   async function loadWallet() {
-    if (!providedWallet) return;
+    setError(false);
+    setEmptyPasswordError(false);
+    setMissingRecoveryError(false);
+    setIncorrectPasswordError(false);
+
+    // validate if recovery phrase or key file is provided
+    if (
+      !providedWallet &&
+      (passwordInput.state === undefined || passwordInput.state === "")
+    ) {
+      setError(true);
+      return;
+    }
+
+    // validate if password is provided
+    if (passwordInput.state === undefined || passwordInput.state === "") {
+      setEmptyPasswordError(true);
+      return;
+    }
+
+    // validate if recovery phrase or key file is not provided but password is provided
+    if (
+      !providedWallet &&
+      (passwordInput.state !== undefined || passwordInput.state !== "")
+    ) {
+      setMissingRecoveryError(true);
+      return;
+    }
     setLoading(true);
 
     // prevent user from closing the window
@@ -92,11 +147,7 @@ export default function AddWallet() {
       setLocation(`/wallets/${await arweave.wallets.jwkToAddress(jwk)}`);
     } catch (e) {
       console.log("Failed to load wallet", e);
-      setToast({
-        type: "error",
-        content: browser.i18n.getMessage("error_adding_wallet"),
-        duration: 2000
-      });
+      setIncorrectPasswordError(true);
     }
 
     finishUp();
@@ -248,6 +299,8 @@ export default function AddWallet() {
           <PlusIcon />
           {browser.i18n.getMessage("add_wallet")}
         </ButtonV2>
+        <Spacer y={0.5} />
+        <Error>{getErrorMessage()}</Error>
         <Spacer y={1.3} />
         <Or>{browser.i18n.getMessage("or").toUpperCase()}</Or>
         <Spacer y={1.3} />
@@ -292,6 +345,10 @@ const Title = styled(Text).attrs({
   font-weight: 600;
 `;
 
+const Error = styled(Text).attrs({ noMargin: true })`
+  color: ${(props) => props.theme.fail};
+`;
+
 const Or = styled(Text).attrs({
   noMargin: true
 })`