diff --git a/packages/keychain/src/components/connect/CreateSession.tsx b/packages/keychain/src/components/connect/CreateSession.tsx index ac67c4094..c67689698 100644 --- a/packages/keychain/src/components/connect/CreateSession.tsx +++ b/packages/keychain/src/components/connect/CreateSession.tsx @@ -6,12 +6,18 @@ import { useCallback, useEffect, useMemo, useState } from "react"; import { useConnection } from "hooks/connection"; import { ControllerErrorAlert } from "components/ErrorAlert"; import { SessionConsent } from "components/connect"; -import { DEFAULT_SESSION_DURATION, SESSION_EXPIRATION } from "const"; +import { DEFAULT_SESSION_DURATION } from "const"; import { Upgrade } from "./Upgrade"; import { ErrorCode } from "@cartridge/account-wasm"; import { SessionSummary } from "components/SessionSummary"; import { TypedDataPolicy } from "@cartridge/presets"; -import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@cartridge/ui-next"; +import { + Select, + SelectContent, + SelectItem, + SelectTrigger, + SelectValue, +} from "@cartridge/ui-next"; export function CreateSession({ onConnect, @@ -24,9 +30,10 @@ export function CreateSession({ const [isConnecting, setIsConnecting] = useState(false); const [isDisabled, setIsDisabled] = useState(false); const [duration, setDuration] = useState(DEFAULT_SESSION_DURATION); - const expiresAt = useMemo(() => { - return SESSION_EXPIRATION - }, []) + const expiresAt = useMemo( + () => duration + BigInt(Math.floor(Date.now() / 1000)), + [duration], + ); const [maxFee] = useState(); const [error, setError] = useState(); @@ -35,7 +42,7 @@ export function CreateSession({ const normalizedChainId = normalizeChainId(chainId); const violatingPolicy = policies.messages?.find( - (policy) => + (policy: TypedDataPolicy) => "domain" in policy && (!policy.domain.chainId || normalizeChainId(policy.domain.chainId) !== normalizedChainId), @@ -44,9 +51,11 @@ export function CreateSession({ if (violatingPolicy) { setError({ code: ErrorCode.PolicyChainIdMismatch, - message: `Policy for ${(violatingPolicy as TypedDataPolicy).domain.name - }.${(violatingPolicy as TypedDataPolicy).primaryType - } has mismatched chain ID.`, + message: `Policy for ${ + (violatingPolicy as TypedDataPolicy).domain.name + }.${ + (violatingPolicy as TypedDataPolicy).primaryType + } has mismatched chain ID.`, }); setIsDisabled(true); } else { @@ -102,19 +111,28 @@ export function CreateSession({ {!error && (
-
Expires in{" "}
- { + setDuration(BigInt(val)); + }} + > + + 1 HR - 24 HRS - 1 WEEK + + 24 HRS + + + 1 WEEK + NEVER @@ -141,7 +159,7 @@ export function CreateSession({
)} - + ); } diff --git a/packages/ui-next/src/components/primitives/select.tsx b/packages/ui-next/src/components/primitives/select.tsx index a73fa4227..998074c2e 100644 --- a/packages/ui-next/src/components/primitives/select.tsx +++ b/packages/ui-next/src/components/primitives/select.tsx @@ -82,7 +82,7 @@ const SelectContent = React.forwardRef< className={cn( "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", position === "popper" && - "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1", + "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1", className, )} position={position} @@ -93,7 +93,7 @@ const SelectContent = React.forwardRef< className={cn( "p-1", position === "popper" && - "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]", + "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]", )} > {children}