Skip to content

Commit

Permalink
chore: add new contracts to signtyped data
Browse files Browse the repository at this point in the history
  • Loading branch information
@jamalavedra
jamalavedra committed Nov 26, 2024
1 parent 330a22a commit f62aea2
Show file tree
Hide file tree
Showing 5 changed files with 50 additions and 27 deletions.
5 changes: 3 additions & 2 deletions examples/apps/auth-sample/src/components/EmbeddedSignerRecovery/AccountRecovery.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import {useState} from 'react';
import {useOpenfort} from '../../hooks/useOpenfort';
import Loading from '../Loading';
import { Button } from '../ui/button';
import { polygonAmoy } from 'viem/chains';

const AccountRecovery: React.FC = () => {
const {handleRecovery} = useOpenfort();
Expand Down Expand Up @@ -33,7 +34,7 @@ const AccountRecovery: React.FC = () => {
) as HTMLInputElement
).value;
setLoadingPwd(true);
await handleRecovery('password', password);
await handleRecovery({method: 'password', password, chainId: polygonAmoy.id});
setLoadingPwd(false);
}}
>
Expand All @@ -56,7 +57,7 @@ const AccountRecovery: React.FC = () => {
className="bg-white text-black p-2.5 border border-gray-200 rounded-lg w-full hover:bg-gray-100"
onClick={async () => {
setLoadingAut(true);
await handleRecovery('automatic');
await handleRecovery({method:'automatic', chainId: polygonAmoy.id});
setLoadingAut(false);
}}
>
Expand Down
20 changes: 12 additions & 8 deletions examples/apps/auth-sample/src/hooks/useOpenfort.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,10 +26,15 @@ import { Chain, createPublicClient, http } from 'viem';
interface ContextType {
state: EmbeddedState;
getEvmProvider: () => Provider;
handleRecovery: (
method: 'password' | 'automatic',
pin?: string
) => Promise<void>;
handleRecovery: ({
method,
password,
chainId
}:{
method: 'password' | 'automatic',
chainId:number
password?: string,
}) => Promise<void>;
auth: (accessToken: string) => Promise<AuthPlayerResponse>;
setWalletRecovery: (
recoveryMethod: RecoveryMethod,
Expand Down Expand Up @@ -211,9 +216,8 @@ export const OpenfortProvider: React.FC<React.PropsWithChildren<unknown>> = ({
);

const handleRecovery = useCallback(
async (method: 'password' | 'automatic', pin?: string) => {
async ({method, password, chainId}:{method: 'password' | 'automatic', password?: string, chainId: number}) => {
try {
const chainId = Number(process.env.NEXT_PUBLIC_CHAIN_ID);
const shieldAuth: ShieldAuthentication = {
auth: ShieldAuthType.OPENFORT,
token: openfort.getAccessToken()!,
Expand All @@ -222,10 +226,10 @@ export const OpenfortProvider: React.FC<React.PropsWithChildren<unknown>> = ({
if (method === 'automatic') {
await openfort.configureEmbeddedSigner(chainId, shieldAuth);
} else if (method === 'password') {
if (!pin || pin.length < 4) {
if (!password || password.length < 4) {
throw new Error('Password recovery must be at least 4 characters');
}
await openfort.configureEmbeddedSigner(chainId, shieldAuth, pin);
await openfort.configureEmbeddedSigner(chainId, shieldAuth, password);
}
} catch (err) {
console.error('Error handling recovery with Openfort:', err);
Expand Down
43 changes: 29 additions & 14 deletions examples/apps/auth-sample/src/pages/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ import { Wallet } from 'lucide-react';
import AccountActions from '@/components/AccountActions/AccountActions';

const HomePage: NextPage = () => {
const {state} = useOpenfort();
const {state, handleRecovery} = useOpenfort();
const [user, setUser] = useState<AuthPlayerResponse | null>(null);
const router = useRouter();
const [message, setMessage] = useState<string>('');
Expand All @@ -48,12 +48,6 @@ const HomePage: NextPage = () => {
if (!user) fetchUser();
}, [openfort]);

useEffect(() => {
if (textareaRef.current) {
textareaRef.current.scrollTop = textareaRef.current.scrollHeight;
}
}, [message]);

const linkedAccount = useMemo(() => {
const linkedAccount = user?.linkedAccounts?.find(
(account: any) => account.provider === 'email'
Expand All @@ -71,7 +65,7 @@ const HomePage: NextPage = () => {
return (
<AuthLayout title="Set up your embedded signer" subtitle={<div></div>}>
<div>
<p className="text-gray-400 mb-2">
<p className="text-gray-400 mb-4">
Welcome, {user?.player?.name ?? user?.id}!
</p>
<div className="absolute top-2 right-2">
Expand All @@ -97,10 +91,22 @@ const HomePage: NextPage = () => {
<>
<header className="sticky top-0 z-50 bg-white border-b">
<div className="flex justify-between items-center p-4">
<Link href="/" aria-label="Home">
<Logo className="h-8 w-auto" />
</Link>
<LogoutButton />
<div className='flex items-center space-x-4'>
<Link href="/" aria-label="Home">
<Logo className="h-8 w-auto md:flex hidden" />
</Link>
<span className='text-gray-300 md:flex hidden'>-</span>
<p className='font-mono text-orange-600 font-medium pt-2'>
Embedded Smart Wallet
</p>
</div>
<a
className='h-9 px-4 py-2 bg-primary text-primary-foreground shadow hover:bg-primary/90 inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50'
target="_blank"
href='https://dashboard.openfort.xyz/auth/register'
>
{'Get started with Openfort ->'}
</a>
</div>
</header>
<main className="h-screen flex">
Expand All @@ -109,14 +115,23 @@ const HomePage: NextPage = () => {
<Wallet className="h-5 w-5" />
<h2 className="font-semibold">Console</h2>
</div>
<div className="block h-full w-full">
<div className="flex-1 w-full">
<textarea
ref={textareaRef}
className="no-scrollbar h-full w-full rounded-lg border-0 bg-gray-100 p-4 font-mono text-xs text-black"
className="no-scrollbar h-full w-full border-0 bg-gray-100 p-4 font-mono text-xs text-black"
value={message}
readOnly
/>
</div>
<div className="p-6 mb-14 border-t bg-white">
<p className="text-sm text-gray-600 mb-4">
Openfort gives you modular components so you can customize your product for your users.
<a href="https://www.openfort.xyz/docs/guides/getting-started/integration" className="text-blue-600 hover:underline">Learn more</a>.
</p>
<div className="flex gap-3">
<LogoutButton/>
</div>
</div>
</div>
<div className="w-full my-4">
<div className="mx-auto flex w-full max-w-2xl flex-col px-4 sm:px-6">
Expand Down
5 changes: 3 additions & 2 deletions examples/apps/auth-sample/src/pages/login.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import {
OAuthProvider,
} from '@openfort/openfort-js';
import { Button } from '@/components/ui/button';
import Loading from '@/components/Loading';

function LoginPage() {
const router = useRouter();
Expand Down Expand Up @@ -147,8 +148,8 @@ function LoginPage() {
</Button>
</div>
</div>
<Button type="submit" className="w-full">
Sign in to account
<Button disabled={status?.type === "loading"} type="submit" className="w-full">
{status?.type === "loading" ? <Loading /> : "Sign in to account"}
</Button>
</form>
<div className="mt-6">
Expand Down
4 changes: 3 additions & 1 deletion sdk/src/openfort.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -192,7 +192,9 @@ export class Openfort {
delete types.EIP712Domain;

const account = Account.fromStorage(this.storage);
if (account && account.type === AccountType.UPGRADEABLE_V5) {
if (account && [AccountType.UPGRADEABLE_V5,
AccountType.UPGRADEABLE_V6,
AccountType.ZKSYNC_UPGRADEABLE_V1].includes(account.type as AccountType)) {
const updatedDomain: TypedDataDomain = {
name: 'Openfort',
version: '0.5',
Expand Down

0 comments on commit f62aea2

Please sign in to comment.