diff --git a/packages/keychain/src/Policies.tsx b/packages/keychain/src/Policies.tsx
index 721bcbb19..e4cd3846c 100644
--- a/packages/keychain/src/Policies.tsx
+++ b/packages/keychain/src/Policies.tsx
@@ -9,11 +9,7 @@ import {
AccordionPanel,
Box,
} from "@chakra-ui/react";
-import {
- CodeUtilIcon,
- CopyHash,
- WedgeRightIcon,
-} from "@cartridge/ui";
+import { CodeUtilIcon, CopyHash, WedgeRightIcon } from "@cartridge/ui";
import { Policy } from "@cartridge/controller";
export function Policies({
diff --git a/packages/keychain/src/components/Execute/Call.tsx b/packages/keychain/src/components/Execute/Call.tsx
deleted file mode 100644
index 68cf35e53..000000000
--- a/packages/keychain/src/components/Execute/Call.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import { Policy } from "@cartridge/controller";
-import { CodeUtilIcon } from "@cartridge/ui";
-import { HStack, Spacer, SystemProps, Text } from "@chakra-ui/react";
-
-export function Call({
- policy,
- ...rest
-}: {
- policy: Policy;
-} & SystemProps) {
- return (
-
-
- {policy.method}
-
-
- );
-}
diff --git a/packages/keychain/src/components/Execute/Fees.tsx b/packages/keychain/src/components/Execute/Fees.tsx
index 8f6be53c8..62c4a6240 100644
--- a/packages/keychain/src/components/Execute/Fees.tsx
+++ b/packages/keychain/src/components/Execute/Fees.tsx
@@ -1,16 +1,10 @@
import { useEffect, useState } from "react";
-import {
- Divider,
- HStack,
- Spacer,
- Spinner,
- Text,
- VStack,
-} from "@chakra-ui/react";
+import { HStack, Spacer, Spinner, Text, VStack } from "@chakra-ui/react";
import { constants } from "starknet";
import { formatUnits } from "viem";
import { useChainId } from "hooks/connection";
+import { EthereumIcon } from "@cartridge/ui";
async function fetchEthPrice() {
const res = await fetch(process.env.NEXT_PUBLIC_API_URL, {
@@ -24,12 +18,10 @@ async function fetchEthPrice() {
}
export function Fees({
- error,
fees,
balance,
approved,
}: {
- error: Error;
fees?: { base: bigint; max: bigint };
balance: string;
approved?: string;
@@ -78,48 +70,39 @@ export function Fees({
}, [chainId, fees, balance, approved]);
return (
- <>
-
- {formattedFee || error ? (
- <>
- {approved && (
-
- )}
+
+ {formattedFee ? (
+ <>
+ {approved && }
+
+
+ {approved && (
-
- {approved && (
-
- )}
- >
- ) : (
-
- )}
-
- >
+ )}
+ >
+ ) : (
+
+ )}
+
);
}
function LineItem({
name,
- description,
value,
isLoading = false,
}: {
@@ -130,31 +113,24 @@ function LineItem({
}) {
return (
-
+
{name}
-
- {isLoading ? (
-
- ) : (
- <>
- {description && (
- <>
-
- {description}
-
-
- >
- )}
- {value}
- >
- )}
-
+
+ {isLoading ? (
+
+ ) : (
+
+
+ {value}
+
+ )}
);
}
diff --git a/packages/keychain/src/components/Execute/index.tsx b/packages/keychain/src/components/Execute/index.tsx
index 1849470ea..32b86e8cb 100644
--- a/packages/keychain/src/components/Execute/index.tsx
+++ b/packages/keychain/src/components/Execute/index.tsx
@@ -1,9 +1,8 @@
import { useCallback, useEffect, useMemo, useState } from "react";
-import { Text, VStack, Button } from "@chakra-ui/react";
+import { Button } from "@chakra-ui/react";
import { Call as StarknetCall, InvocationsDetails } from "starknet";
-import { Fees } from "./Fees";
import { formatEther } from "viem";
-import { ExecuteReply, ResponseCodes } from "@cartridge/controller";
+import { ExecuteReply, Policy, ResponseCodes } from "@cartridge/controller";
import {
Container,
Content,
@@ -12,11 +11,12 @@ import {
} from "components/layout";
import { Status } from "utils/account";
import { TransactionDuoIcon } from "@cartridge/ui";
-import { Call } from "./Call";
import { InsufficientFunds } from "./InsufficientFunds";
import { useChainId, useOrigin } from "hooks/connection";
import { useController } from "hooks/controller";
import { ErrorAlert } from "components/ErrorAlert";
+import { Policies } from "Policies";
+import { Fees } from "./Fees";
export const CONTRACT_ETH =
"0x049d36570d4e46f48e99674bd3fcc84644ddd6b96f7c741b1562b82f9e004dc7";
@@ -132,6 +132,12 @@ export function Execute({
});
}, [account, calls, fees, onExecute]);
+ const policies = useMemo(
+ () =>
+ calls.map((c) => ({ target: c.contractAddress, method: c.entrypoint })),
+ [calls],
+ );
+
if (isInsufficient) {
return (
-
-
-
- Transaction Details
-
-
-
-
- {calls.map((call, i) => (
-
- ))}
-
-
-
-
+