tech(active-wallet): use signature and message

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hyperplay/quests-ui",
-  "version": "0.1.9",
+  "version": "0.1.10",
   "description": "",
   "main": "index.js",
   "scripts": {
@@ -56,6 +56,7 @@
     "eslint-plugin-prettier": "^5.2.1",
     "eslint-plugin-react": "^7.35.0",
     "eslint-plugin-storybook": "^0.9.0",
+    "ethers": "^6.13.5",
     "i18next": "^23.12.3",
     "jest": "^29.7.0",
     "mobx": "^6.13.3",
@@ -67,6 +68,7 @@
     "react": "^18.3.1",
     "react-i18next": "^15.0.1",
     "sass-embedded": "^1.77.8",
+    "siwe": "^2.3.2",
     "storybook": "^8.3.4",
     "ts-jest": "^29.2.5",
     "viem": "^2.19.4",

src/components/ActiveWalletSection/index.tsx

@@ -64,8 +64,14 @@ function InputLikeContainer({
 export default function ActiveWalletSection() {
   const queryClient = useQueryClient()
   const { address: connectedWallet } = useAccount()
-  const { getActiveWallet, setActiveWallet, tOverride, openDiscordLink } =
-    useQuestWrapper()
+  const {
+    getActiveWallet,
+    setActiveWallet,
+    tOverride,
+    logError,
+    openDiscordLink,
+    getActiveWalletSignature
+  } = useQuestWrapper()
 
   const { t: tOriginal } = useTranslation()
   const t = tOverride || tOriginal
@@ -86,11 +92,14 @@ export default function ActiveWalletSection() {
       if (!connectedWallet) {
         throw new Error('No address found')
       }
-
-      await setActiveWallet(connectedWallet)
+      const signatureData = await getActiveWalletSignature()
+      await setActiveWallet(signatureData)
       await queryClient.invalidateQueries({
         queryKey: ['activeWallet']
       })
+    },
+    onError: (error) => {
+      logError(`Error setting active wallet: ${error.message}`)
     }
   })
 
@@ -149,7 +158,7 @@ export default function ActiveWalletSection() {
   const hasMatchingWallets =
     Boolean(activeWallet && connectedWallet) && activeWallet === connectedWallet
   const hasDifferentWallets =
-    Boolean(activeWallet && connectedWallet) && activeWallet !== connectedWallet
+    Boolean(activeWallet && connectedWallet) && !hasMatchingWallets
 
   let content = null