Skip to main content
function useEmailAuth(): {
  user: any;
  account: any;
  isAuthenticated: boolean;
  sessionSecrets: SessionSecrets;
  isExistingUser: any;
  isLoading: any;
  loadingOperation: any;
  error: any;
  errorCode: any;
  sessionStatus: SessionStatus;
  sessionExpiresAt: number;
  ensureValidSession: () => Promise<void>;
  requestOtp: (email, options?) => Promise<void>;
  verifyOtp: (otpCode) => Promise<void>;
  logout: () => void;
  clearError: () => void;
  refreshSessionSecrets: () => Promise<void>;
};
Email authentication hook with automatic signup/login detection Handles both new user signup and existing user login seamlessly.
  • New users: requestOtp → verifyOtp (creates account)
  • Existing users: requestOtp → verifyOtp (login)
Uses sessionStorage for ephemeral session secrets and localStorage for user data. Supports session management with automatic expiry detection and refresh capabilities.

​
Returns

NameTypeDefault valueDescription
useranystoredState.user-
accountanystoredState.account-
isAuthenticatedbooleanstoredState.isAuthenticated-
sessionSecretsSessionSecrets--
isExistingUserany--
isLoadingany--
loadingOperationany--
errorany--
errorCodeany--
sessionStatusSessionStatus--
sessionExpiresAtnumber--
ensureValidSession()() => Promise<void>-Ensure session is valid (auto-refreshes if needed) Use before critical operations like signing transactions.
requestOtp()(email, options?) => Promise<void>-Request OTP code via email (handles new and existing users)
verifyOtp()(otpCode) => Promise<void>-Verify OTP code (creates account for new users, logs in existing users)
logout()() => void-Logout and clear all authentication data Note: Can also use useAccount().disconnect()
clearError()() => void-Clear error state
refreshSessionSecrets()() => Promise<void>-Refresh session secrets using HTTP-only cookie Called automatically when account exists but no active session secrets.

​
Example

import { useEmailAuth } from '@sqds/grid-react';

function AuthFlow() {
  const { requestOtp, verifyOtp, isAuthenticated, account } = useEmailAuth();

  if (isAuthenticated) return <div>Welcome! Address: {account.data.address}</div>;

  return <button onClick={() => requestOtp('user@example.com')}>Send OTP</button>;
}