fix: check connector status before eager connect, fix input error text wrapping

libs/ui-toolkit/src/components/input-error/input-error.tsx

@@ -17,8 +17,8 @@ export const InputError = ({
   ...props
 }: InputErrorProps) => {
   const effectiveClassName = classNames(
-    'text-sm flex items-center first-letter:uppercase',
-    'mt-2',
+    'text-sm block items-center first-letter:capitalize',
+    'mt-2 min-w-0 break-words',
     {
       'border-danger': intent === 'danger',
       'border-warning': intent === 'warning',

libs/wallet-react/src/hooks/use-eager-connect.ts

@@ -1,17 +1,20 @@
-import { useEffect, useState } from 'react';
+import { useEffect } from 'react';
 import { useWallet } from './use-wallet';
 import { useConnect } from './use-connect';
 
 export function useEagerConnect() {
   const current = useWallet((store) => store.current);
+  const status = useWallet((store) => store.status);
   const { connect } = useConnect();
-  const [connecting, setConnecting] = useState(true);
 
   useEffect(() => {
     const attemptConnect = async () => {
       // No stored config, or config was malformed or no risk accepted
       if (!current) {
-        setConnecting(false);
+        return;
+      }
+
+      if (status !== 'disconnected') {
         return;
       }
 
@@ -19,15 +22,13 @@ export function useEagerConnect() {
         await connect(current);
       } catch {
         console.warn(`Failed to connect with connector: ${current}`);
-      } finally {
-        setConnecting(false);
       }
     };
 
     if (typeof window !== 'undefined') {
       attemptConnect();
     }
-  }, [connect, current, connecting]);
+  }, [connect, current]);
 
-  return connecting;
+  return status;
 }

libs/wallet-react/src/hooks/use-simple-transaction.ts

@@ -65,12 +65,12 @@ export const useSimpleTransaction = (opts?: Options) => {
         if (err.code === ConnectorErrors.userRejected.code) {
           setStatus('idle');
         } else {
-          setError(err.message);
+          setError(`${err.message}: ${err.data}`);
           setStatus('idle');
           opts?.onError?.(err.message);
         }
       } else {
-        const msg = t('Wallet rejected transaction');
+        const msg = t('Something went wrong');
         setError(msg);
         setStatus('idle');
         opts?.onError?.(msg);