Browse Source

add sign in to example package

Jordan Sexton 2 years ago
parent
commit
e25f9db7ab

+ 1 - 1
packages/starter/example/package.json

@@ -39,13 +39,13 @@
         "@emotion/styled": "^11.11.0",
         "@mui/icons-material": "^5.11.16",
         "@mui/material": "^5.13.5",
-        "@noble/curves": "^1.1.0",
         "@solana/wallet-adapter-ant-design": "workspace:^",
         "@solana/wallet-adapter-base": "workspace:^",
         "@solana/wallet-adapter-material-ui": "workspace:^",
         "@solana/wallet-adapter-react": "workspace:^",
         "@solana/wallet-adapter-react-ui": "workspace:^",
         "@solana/wallet-adapter-wallets": "workspace:^",
+        "@solana/wallet-standard-util": "1.1.0-alpha.7",
         "@solana/web3.js": "^1.77.3",
         "antd": "^4.24.10",
         "bs58": "^4.0.1",

+ 32 - 0
packages/starter/example/src/components/SignIn.tsx

@@ -0,0 +1,32 @@
+import { Button } from '@mui/material';
+import { useWallet } from '@solana/wallet-adapter-react';
+import { verifySignIn } from '@solana/wallet-standard-util';
+import type { FC } from 'react';
+import React, { useCallback } from 'react';
+import { useNotify } from './notify';
+
+export const SignIn: FC = () => {
+    const { signIn } = useWallet();
+    const notify = useNotify();
+
+    const onClick = useCallback(async () => {
+        try {
+            if (!signIn) throw new Error('Wallet does not support message signing!');
+
+            // FIXME: wrap this for wallet adapter to simplify args
+            const input = {};
+            const output = await signIn(input);
+            if (!verifySignIn(input, output)) throw new Error('Sign in signature invalid!');
+
+            notify('success', `Signed in: ${output.account.address}`);
+        } catch (error: any) {
+            notify('error', `Sign In failed: ${error?.message}`);
+        }
+    }, [signIn, notify]);
+
+    return (
+        <Button variant="contained" color="secondary" onClick={onClick} disabled={!signIn}>
+            Sign In
+        </Button>
+    );
+};

+ 20 - 2
packages/starter/example/src/components/SignMessage.tsx

@@ -1,6 +1,6 @@
 import { Button } from '@mui/material';
-import { ed25519 } from '@noble/curves/ed25519';
 import { useWallet } from '@solana/wallet-adapter-react';
+import { verifySignMessage } from '@solana/wallet-standard-util';
 import bs58 from 'bs58';
 import type { FC } from 'react';
 import React, { useCallback } from 'react';
@@ -17,7 +17,25 @@ export const SignMessage: FC = () => {
 
             const message = new TextEncoder().encode('Hello, world!');
             const signature = await signMessage(message);
-            if (!ed25519.verify(signature, message, publicKey.toBytes())) throw new Error('Message signature invalid!');
+            if (
+                // FIXME: wrap this for wallet adapter to simplify args
+                !verifySignMessage(
+                    {
+                        account: {
+                            address: publicKey.toBase58(),
+                            publicKey: publicKey.toBytes(),
+                            chains: [],
+                            features: [],
+                        },
+                        message,
+                    },
+                    {
+                        signedMessage: message,
+                        signature,
+                    }
+                )
+            )
+                throw new Error('Message signature invalid!');
 
             notify('success', `Message signature: ${bs58.encode(signature)}`);
         } catch (error: any) {

+ 4 - 1
packages/starter/example/src/pages/index.tsx

@@ -70,6 +70,7 @@ const SendV0TransactionDynamic = dynamic(
     async () => (await import('../components/SendV0Transaction')).SendV0Transaction,
     { ssr: false }
 );
+const SignInDynamic = dynamic(async () => (await import('../components/SignIn')).SignIn, { ssr: false });
 const SignMessageDynamic = dynamic(async () => (await import('../components/SignMessage')).SignMessage, { ssr: false });
 const SignTransactionDynamic = dynamic(async () => (await import('../components/SignTransaction')).SignTransaction, {
     ssr: false,
@@ -183,7 +184,9 @@ const Index: NextPage = () => {
                         <TableCell>
                             <SignMessageDynamic />
                         </TableCell>
-                        <TableCell></TableCell>
+                        <TableCell>
+                            <SignInDynamic />
+                        </TableCell>
                     </TableRow>
                     <TableRow>
                         <TableCell></TableCell>