feat: wip: sign 2.5 examples

advanced/dapps/react-dapp-v2/package.json

@@ -20,9 +20,9 @@
     "@polkadot/util-crypto": "^10.1.2",
     "@solana/web3.js": "^1.36.0",
     "@walletconnect/encoding": "^1.0.1",
-    "@walletconnect/sign-client": "2.11.1",
-    "@walletconnect/types": "2.11.1",
-    "@walletconnect/utils": "2.11.1",
+    "@walletconnect/sign-client": "2.12.0-rc-cab3c9c360",
+    "@walletconnect/types": "2.12.0-rc-cab3c9c360",
+    "@walletconnect/utils": "2.12.0-rc-cab3c9c360",
     "@web3modal/standalone": "2.4.3",
     "axios": "^1.0.0",
     "blockies-ts": "^1.0.0",

advanced/dapps/react-dapp-v2/src/components/app/index.tsx

@@ -30,8 +30,8 @@ export const SConnectButton = styled(Button as any)`
   border-radius: 8px;
   font-size: ${fonts.size.medium};
   height: 44px;
-  width: 100%;
-  margin: 12px 0;
+  // width: 100%;
+  margin: 6px 6px;
 `;
 
 export const SAccountsContainer = styled(SLanding as any)`

advanced/dapps/react-dapp-v2/src/contexts/ClientContext.tsx

@@ -36,7 +36,10 @@ import { getPublicKeysFromAccounts } from "../helpers/solana";
 interface IContext {
   client: Client | undefined;
   session: SessionTypes.Struct | undefined;
-  connect: (pairing?: { topic: string }) => Promise<void>;
+  connect: (params?: {
+    pairing?: { topic: string };
+    strategy?: 1 | 2 | 3 | 4;
+  }) => Promise<void>;
   disconnect: () => Promise<void>;
   isInitializing: boolean;
   chains: string[];
@@ -49,6 +52,8 @@ interface IContext {
   setChains: any;
   setRelayerRegion: any;
   origin: string;
+  onlySiwe?: boolean;
+  setOnlySiwe?: any;
 }
 
 /**
@@ -89,6 +94,7 @@ export function ClientContextProvider({
   const [relayerRegion, setRelayerRegion] = useState<string>(
     DEFAULT_RELAY_URL!
   );
+  const [onlySiwe, setOnlySiwe] = useState<boolean>(false);
   const [origin, setOrigin] = useState<string>(getAppMetadata().url);
   const reset = () => {
     setSession(undefined);
@@ -141,11 +147,14 @@ export function ClientContextProvider({
   );
 
   const connect = useCallback(
-    async (pairing: any) => {
+    async (params?: {
+      pairing?: { topic: string };
+      strategy?: 1 | 2 | 3 | 4;
+    }) => {
       if (typeof client === "undefined") {
         throw new Error("WalletConnect is not initialized");
       }
-      console.log("connect, pairing topic is:", pairing?.topic);
+      console.log("connect, pairing topic is:", params?.pairing?.topic);
       try {
         const requiredNamespaces = getRequiredNamespaces(chains);
         console.log(
@@ -157,10 +166,57 @@ export function ClientContextProvider({
           "optionalNamespaces config for connect:",
           optionalNamespaces
         );
-        const { uri, approval } = await client.connect({
-          pairingTopic: pairing?.topic,
-          requiredNamespaces,
-          optionalNamespaces,
+        // const { uri, approval } = await client.connect({
+        //   pairingTopic: pairing?.topic,
+        //   requiredNamespaces,
+        //   optionalNamespaces,
+        // });
+
+        const supportedMethods = [
+          // "eth_sign",
+          "eth_sendTransaction",
+          // "eth_signTransaction",
+          "personal_sign",
+          // "eth_signTypedData_v4",
+        ];
+        console.log("onlySiwe:", onlySiwe);
+
+        let resourcesData = [];
+
+        switch (params?.strategy) {
+          case 1:
+            break;
+          case 2:
+            resourcesData.push(
+              "https://walletconnect.com/eth",
+              "https://walletconnect.com/solana",
+              "https://walletconnect.com/terra"
+            );
+            break;
+          case 3:
+            resourcesData.push(
+              "urn:recap:eyJhdHQiOnsiaHR0cHM6Ly9ub3RpZnkud2FsbGV0Y29ubmVjdC5jb20iOnsibWFuYWdlL2FsbC1hcHBzLW5vdGlmaWNhdGlvbnMiOlt7fV19fX0"
+            );
+            break;
+          case 4:
+            resourcesData.push(
+              "https://walletconnect.com/eth",
+              "https://walletconnect.com/solana",
+              "https://walletconnect.com/terra",
+              "urn:recap:eyJhdHQiOnsiaHR0cHM6Ly9ub3RpZnkud2FsbGV0Y29ubmVjdC5jb20iOnsibWFuYWdlL2FsbC1hcHBzLW5vdGlmaWNhdGlvbnMiOlt7fV19fX0"
+            );
+            break;
+        }
+        console.log("resourcesData:", resourcesData);
+        const { uri, response } = await client.authenticate({
+          chains: chains,
+          domain: "app.web3inbox", //getAppMetadata().url,
+          nonce: "32891756",
+          uri: "https://app.web3inbox.com/login",
+          methods: onlySiwe ? [] : supportedMethods,
+          resources: resourcesData,
+          statement:
+            "I accept the ServiceOrg Terms of Service: https://app.web3inbox.com/tos",
         });
 
         // Open QRCode modal if a URI was returned (i.e. we're not connecting an existing pairing).
@@ -172,9 +228,21 @@ export function ClientContextProvider({
 
           web3Modal.openModal({ uri, standaloneChains });
         }
-
-        const session = await approval();
+        const res = await response();
+        console.log("response from sessionAuthenticate:", res);
+        const session = res.session;
         console.log("Established session:", session);
+
+        if (onlySiwe && res.auths && res.auths.length > 0) {
+          const auth = res.auths[0];
+          toast.success(`Signature received - ${auth.s?.s?.slice(0, 10)}...`, {
+            position: "bottom-left",
+          });
+        }
+
+        if (!session) {
+          return;
+        }
         await onSessionConnected(session);
         // Update known pairings after session is connected.
         setPairings(client.pairing.getAll({ active: true }));
@@ -189,7 +257,7 @@ export function ClientContextProvider({
         web3Modal.closeModal();
       }
     },
-    [chains, client, onSessionConnected]
+    [chains, client, onSessionConnected, onlySiwe]
   );
 
   const disconnect = useCallback(async () => {
@@ -364,6 +432,8 @@ export function ClientContextProvider({
       setChains,
       setRelayerRegion,
       origin,
+      onlySiwe,
+      setOnlySiwe,
     }),
     [
       pairings,
@@ -381,6 +451,8 @@ export function ClientContextProvider({
       setChains,
       setRelayerRegion,
       origin,
+      onlySiwe,
+      setOnlySiwe,
     ]
   );
 

advanced/dapps/react-dapp-v2/src/modals/PairingModal.tsx

@@ -12,26 +12,30 @@ import toast from "react-hot-toast";
 
 interface PairingModalProps {
   pairings: PairingTypes.Struct[];
-  connect: (pairing?: { topic: string }) => Promise<void>;
+  connect: (params?: {
+    pairing?: { topic: string };
+    strategy?: 1 | 2 | 3 | 4;
+  }) => Promise<void>;
+  strategy?: 1 | 2 | 3 | 4;
 }
 
 const PairingModal = (props: PairingModalProps) => {
-  const { pairings, connect } = props;
+  const { pairings, connect, strategy } = props;
   const [pairing, setPairing] = React.useState<PairingTypes.Struct>();
-
+  console.log("pairing", strategy);
   const onConnect = React.useCallback(
     async (pairing: PairingTypes.Struct) => {
       try {
         setPairing(pairing);
-        await connect({ topic: pairing.topic });
+        await connect({ pairing, strategy });
       } catch (error) {
         toast.error((error as Error).message, {
           position: "bottom-left",
         });
         setPairing(undefined);
       }
     },
-    [connect]
+    [connect, strategy]
   );
   return pairing ? (
     <LoaderModal
@@ -50,7 +54,7 @@ const PairingModal = (props: PairingModalProps) => {
           />
         ))}
       </STable>
-      <Button onClick={() => connect()}>{`New Pairing`}</Button>
+      <Button onClick={() => connect({ strategy })}>{`New Pairing`}</Button>
     </SModalContainer>
   );
 };