feat: async fetch hasInteraction

RabbyHub · Dec 18, 2024 · f13f133 · f13f133
1 parent 356ed60
commit f13f133
Show file tree

Hide file tree

Showing 13 changed files with 35 additions and 23 deletions.
diff --git a/package.json b/package.json
@@ -60,7 +60,7 @@
     "@rabby-wallet/eth-watch-keyring": "1.0.0",
     "@rabby-wallet/gnosis-sdk": "1.3.9",
     "@rabby-wallet/page-provider": "0.4.2",
-    "@rabby-wallet/rabby-action": "0.1.8",
+    "@rabby-wallet/rabby-action": "0.2.0-beta.0",
     "@rabby-wallet/rabby-api": "0.9.2",
     "@rabby-wallet/rabby-security-engine": "2.0.7",
     "@rabby-wallet/rabby-swap": "0.0.42",

diff --git a/src/ui/views/Approval/components/Actions/ApproveNFT.tsx b/src/ui/views/Approval/components/Actions/ApproveNFT.tsx
@@ -121,7 +121,7 @@ const ApproveNFT = ({
           <SubCol>
             <SubRow isTitle>{t('page.signTx.interacted')}</SubRow>
             <SubRow>
-              <Values.Boolean value={requireData.hasInteraction} />
+              <Values.Interacted value={requireData.hasInteraction} />
             </SubRow>
           </SubCol>
 

diff --git a/src/ui/views/Approval/components/Actions/ApproveNFTCollection.tsx b/src/ui/views/Approval/components/Actions/ApproveNFTCollection.tsx
@@ -124,7 +124,7 @@ const ApproveNFTCollection = ({
           <SubCol>
             <SubRow isTitle>{t('page.signTx.interacted')}</SubRow>
             <SubRow>
-              <Values.Boolean value={requireData.hasInteraction} />
+              <Values.Interacted value={requireData.hasInteraction} />
             </SubRow>
           </SubCol>
 

diff --git a/src/ui/views/Approval/components/Actions/ContractCall.tsx b/src/ui/views/Approval/components/Actions/ContractCall.tsx
@@ -128,7 +128,7 @@ const ContractCall = ({
           <SubCol>
             <SubRow isTitle>{t('page.signTx.interacted')}</SubRow>
             <SubRow>
-              <Values.Boolean value={requireData.hasInteraction} />
+              <Values.Interacted value={requireData.hasInteraction} />
             </SubRow>
           </SubCol>
           {isInWhitelist && (

diff --git a/src/ui/views/Approval/components/Actions/CrossSwapToken.tsx b/src/ui/views/Approval/components/Actions/CrossSwapToken.tsx
@@ -270,7 +270,7 @@ const CrossSwapToken = ({
           <SubCol>
             <SubRow isTitle>{t('page.signTx.interacted')}</SubRow>
             <SubRow>
-              <Values.Boolean value={requireData.hasInteraction} />
+              <Values.Interacted value={requireData.hasInteraction} />
             </SubRow>
           </SubCol>
           {isInWhitelist && (

diff --git a/src/ui/views/Approval/components/Actions/MultiSwap.tsx b/src/ui/views/Approval/components/Actions/MultiSwap.tsx
@@ -195,7 +195,7 @@ const MultiSwap = ({
           <SubCol>
             <SubRow isTitle>{t('page.signTx.interacted')}</SubRow>
             <SubRow>
-              <Values.Boolean value={requireData.hasInteraction} />
+              <Values.Interacted value={requireData.hasInteraction} />
             </SubRow>
           </SubCol>
 

diff --git a/src/ui/views/Approval/components/Actions/components/TransactionActionList.tsx b/src/ui/views/Approval/components/Actions/components/TransactionActionList.tsx
@@ -61,6 +61,12 @@ export const TransactionActionList: React.FC<{
   raw,
   isTypedData = false,
 }) => {
+  React.useEffect(() => {
+    if (requireData && 'extraState' in requireData) {
+      requireData.extraState.hasInteraction?.();
+    }
+  }, []);
+
   return (
     <>
       {data.swap && (

diff --git a/src/ui/views/Approval/components/Actions/components/Values.tsx b/src/ui/views/Approval/components/Actions/components/Values.tsx
@@ -432,11 +432,17 @@ const DisplayChain = ({ chainServerId }: { chainServerId: string }) => {
   );
 };
 
-const Interacted = ({ value }: { value: boolean }) => {
+const Interacted = ({ value }: { value: boolean | null }) => {
   const { t } = useTranslation();
   return (
     <span className="flex">
-      {value ? <>{t('page.signTx.yes')}</> : <>{t('page.signTx.no')}</>}
+      {value === null ? (
+        'loading'
+      ) : value ? (
+        <>{t('page.signTx.yes')}</>
+      ) : (
+        <>{t('page.signTx.no')}</>
+      )}
     </span>
   );
 };

diff --git a/src/ui/views/Approval/components/Actions/components/ViewMorePopup/ContractPopup.tsx b/src/ui/views/Approval/components/Actions/components/ViewMorePopup/ContractPopup.tsx
@@ -16,7 +16,7 @@ interface ContractData {
   bornAt: number | null;
   rank: number | null;
   title?: string;
-  hasInteraction: boolean;
+  hasInteraction: boolean | null;
 }
 
 export interface Props {
@@ -67,7 +67,7 @@ export const ContractPopup: React.FC<Props> = ({ data }) => {
         <Col>
           <Row>{t('page.signTx.interacted')}</Row>
           <Row>
-            <Values.Boolean value={data.hasInteraction} />
+            <Values.Interacted value={data.hasInteraction} />
           </Row>
         </Col>
         <Col>

diff --git a/src/ui/views/Approval/components/Actions/components/ViewMorePopup/NFTSpenderPopup.tsx b/src/ui/views/Approval/components/Actions/components/ViewMorePopup/NFTSpenderPopup.tsx
@@ -19,7 +19,7 @@ interface NFTSpenderData {
   isEOA: boolean;
   isDanger: boolean | null;
   isRevoke?: boolean;
-  hasInteraction: boolean;
+  hasInteraction: boolean | null;
 }
 
 export interface Props {
@@ -110,7 +110,7 @@ export const NFTSpenderPopup: React.FC<Props> = ({ data }) => {
         <Col>
           <Row>{t('page.signTx.interacted')}</Row>
           <Row>
-            <Values.Boolean value={data.hasInteraction} />
+            <Values.Interacted value={data.hasInteraction} />
           </Row>
         </Col>
         <Col>

diff --git a/src/ui/views/Approval/components/Actions/components/ViewMorePopup/SpenderPopup.tsx b/src/ui/views/Approval/components/Actions/components/ViewMorePopup/SpenderPopup.tsx
@@ -19,7 +19,7 @@ interface SpenderData {
   isEOA: boolean;
   isDanger: boolean | null;
   isRevoke?: boolean;
-  hasInteraction: boolean;
+  hasInteraction: boolean | null;
 }
 
 export interface Props {
@@ -110,7 +110,7 @@ export const SpenderPopup: React.FC<Props> = ({ data }) => {
         <Col>
           <Row>{t('page.signTx.interacted')}</Row>
           <Row>
-            <Values.Boolean value={data.hasInteraction} />
+            <Values.Interacted value={data.hasInteraction} />
           </Row>
         </Col>
         <Col>

diff --git a/src/ui/views/Approval/components/SignTx.tsx b/src/ui/views/Approval/components/SignTx.tsx
@@ -80,11 +80,11 @@ import { GasLessConfig } from './FooterBar/GasLessComponents';
 import { adjustV } from '@/ui/utils/gnosis';
 import { useGasAccountTxsCheck } from '../../GasAccount/hooks/checkTxs';
 import {
-  fetchActionRequiredData,
   parseAction,
   formatSecurityEngineContext,
   ActionRequireData,
   ParsedTransactionActionData,
+  useFetchActionRequiredData,
 } from '@rabby-wallet/rabby-action';
 
 interface BasicCoboArgusInfo {
@@ -389,9 +389,6 @@ const SignTx = ({ params, origin }: SignTxProps) => {
     },
   });
   const [actionData, setActionData] = useState<ParsedTransactionActionData>({});
-  const [actionRequireData, setActionRequireData] = useState<ActionRequireData>(
-    null
-  );
   const { t } = useTranslation();
   const [preprocessSuccess, setPreprocessSuccess] = useState(true);
   const [chainId, setChainId] = useState<number>(
@@ -628,6 +625,10 @@ const SignTx = ({ params, origin }: SignTxProps) => {
   }, [engineResults, currentTx]);
 
   const isGasTopUp = tx.to?.toLowerCase() === GAS_TOP_UP_ADDRESS.toLowerCase();
+  const {
+    fetchActionRequiredData,
+    requiredData: actionRequireData,
+  } = useFetchActionRequiredData();
 
   const gasExplainResponse = useExplainGas({
     gasUsed,
@@ -869,7 +870,6 @@ const SignTx = ({ params, origin }: SignTxProps) => {
           const result = await executeEngine(ctx);
           setEngineResults(result);
           setActionData(parsed);
-          setActionRequireData(requiredData);
           const approval = await getApproval();
 
           approval.signingTxId &&

diff --git a/yarn.lock b/yarn.lock
@@ -4769,10 +4769,10 @@
     sinon-chrome "^3.0.1"
     webextension-polyfill "0.7.0"
 
-"@rabby-wallet/rabby-action@0.1.8":
-  version "0.1.8"
-  resolved "https://registry.yarnpkg.com/@rabby-wallet/rabby-action/-/rabby-action-0.1.8.tgz#05b258b628a224d51dc471e93117d4106024a916"
-  integrity sha512-K0euVX55tW2mbnudm3bHPAbbLYlnDQD5PgAvM1mwPPFHhF/Ve/U5MYdg1XERJPxkoXKqiVti46idFFB+s8sv7A==
+"@rabby-wallet/rabby-action@0.2.0-beta.0":
+  version "0.2.0-beta.0"
+  resolved "https://registry.yarnpkg.com/@rabby-wallet/rabby-action/-/rabby-action-0.2.0-beta.0.tgz#50042266ac53207f5480fa1622fea4ee0f51df7c"
+  integrity sha512-TtQSG+saMZGLzMdYYIp88HFG5P54jjxRgbE+ttuY8nW+P00s+HS4Sas1NEG/0aPaXng6qosNORDXclC2XLHpqw==
 
 "@rabby-wallet/[email protected]":
   version "0.9.2"