getSilentSwapAuth

The getSilentSwapAuth composable provides utility functions for creating SIWE messages and EIP-712 documents needed for Silent Swap authentication and order signing.

Import

import { getSilentSwapAuth } from '@silentswap/vue';

Basic Usage

<script setup lang="ts">
import { getSilentSwapAuth } from '@silentswap/vue';
 
const {
  createSignInMessage,
  createEip712DocForOrder,
  createEip712DocForWalletGeneration,
} = getSilentSwapAuth();
</script>

API Reference

Return Value

interface GetSilentSwapAuthReturn {
  // Sign-in message creation
  createSignInMessage: (
    address: `0x${string}`,
    nonce: string,
    domain?: string
  ) => string;
 
  // EIP-712 document creation
  createEip712DocForOrder: (
    quoteResponse: QuoteResponse
  ) => ReturnType<typeof createEip712DocForOrder>;
  
  createEip712DocForWalletGeneration: (
    scope: string,
    token: string
  ) => ReturnType<typeof createEip712DocForWalletGeneration>;
}

Creating Sign-In Messages

Use createSignInMessage to create SIWE (Sign-In with Ethereum) messages:

<script setup lang="ts">
import { ref } from 'vue';
import { getSilentSwapAuth, getSilentSwapOrders } from '@silentswap/vue';
import { useAccount, useSignMessage } from 'wagmi';
 
const { address } = useAccount();
const { signMessageAsync } = useSignMessage();
 
const { createSignInMessage } = getSilentSwapAuth();
const { getNonce, authenticate } = getSilentSwapOrders({ client });
 
const handleSignIn = async () => {
  // Get nonce from server
  const nonceResponse = await getNonce(address.value!);
  if (!nonceResponse) return;
 
  // Create SIWE message
  const message = createSignInMessage(
    address.value!,
    nonceResponse.nonce,
    'example.com' // Your domain
  );
 
  // Sign the message with wallet
  const signature = await signMessageAsync({ message });
 
  // Authenticate with server
  const authResult = await authenticate({
    siwe: {
      message,
      signature: signature as `0x${string}`,
    },
  });
 
  if (authResult) {
    console.log('Authenticated:', authResult.address);
  }
};
</script>

Creating EIP-712 Documents for Orders

Use createEip712DocForOrder to create EIP-712 typed data for signing orders:

<script setup lang="ts">
import { getSilentSwapAuth, getSilentSwapOrders } from '@silentswap/vue';
import { useSignTypedData } from 'wagmi';
import type { QuoteResponse } from '@silentswap/sdk';
 
const { createEip712DocForOrder } = getSilentSwapAuth();
const { getQuote, createOrder } = getSilentSwapOrders({ client });
const { signTypedDataAsync } = useSignTypedData();
 
const handleCreateOrder = async () => {
  // Get quote first
  const quote = await getQuote(/* ... */);
  if (!quote) return;
 
  // Create EIP-712 document for order
  const orderDoc = createEip712DocForOrder(quote);
 
  // Sign the document
  const signature = await signTypedDataAsync(orderDoc);
 
  // Create order with signature
  const orderResult = await createOrder({
    quote: quote.quote,
    quoteId: quote.quoteId,
    // ... other order fields
    eip712Domain: orderDoc.domain,
    signature,
  });
};
</script>

Creating EIP-712 Documents for Wallet Generation

Use createEip712DocForWalletGeneration to create EIP-712 typed data for generating facilitator wallet entropy:

<script setup lang="ts">
import { getSilentSwapAuth } from '@silentswap/vue';
import { useSignTypedData } from 'wagmi';
import { hexToBytes } from 'viem';
 
const { createEip712DocForWalletGeneration } = getSilentSwapAuth();
const { signTypedDataAsync } = useSignTypedData();
const { address } = useAccount();
 
const generateWalletEntropy = async (authToken: string) => {
  // Create EIP-712 document for wallet generation
  const walletDoc = createEip712DocForWalletGeneration(
    `eip155:43114:${address.value}`, // Gateway contract scope (Avalanche)
    authToken // Secret token from authentication
  );
 
  // Sign the document
  const signature = await signTypedDataAsync(walletDoc);
 
  // Use signature bytes as entropy
  const entropy = hexToBytes(signature as `0x${string}`);
  
  return entropy;
};
</script>

Complete Authentication Flow

Here's a complete example combining all auth utilities:

<script setup lang="ts">
import { ref } from 'vue';
import { getSilentSwapAuth, getSilentSwapOrders, getSilentSwapClient } from '@silentswap/vue';
import { useAccount, useSignMessage, useSignTypedData } from 'wagmi';
import { ENVIRONMENT } from '@silentswap/sdk';
import { hexToBytes } from 'viem';
 
const { address } = useAccount();
const { signMessageAsync } = useSignMessage();
const { signTypedDataAsync } = useSignTypedData();
 
const { client } = getSilentSwapClient({
  config: {
    environment: ENVIRONMENT.MAINNET,
  },
});
 
const { createSignInMessage, createEip712DocForWalletGeneration } = getSilentSwapAuth();
const { getNonce, authenticate } = getSilentSwapOrders({ client });
 
const authToken = ref<string | null>(null);
const walletEntropy = ref<Uint8Array | null>(null);
 
const handleCompleteAuth = async () => {
  try {
    // Step 1: Get nonce
    const nonceResponse = await getNonce(address.value!);
    if (!nonceResponse) throw new Error('Failed to get nonce');
 
    // Step 2: Create and sign SIWE message
    const message = createSignInMessage(
      address.value!,
      nonceResponse.nonce,
      window.location.host
    );
    const signature = await signMessageAsync({ message });
 
    // Step 3: Authenticate
    const authResult = await authenticate({
      siwe: {
        message,
        signature: signature as `0x${string}`,
      },
    });
 
    if (!authResult) throw new Error('Authentication failed');
    authToken.value = authResult.secretToken;
 
    // Step 4: Generate wallet entropy
    const walletDoc = createEip712DocForWalletGeneration(
      `eip155:43114:${address.value}`,
      authResult.secretToken
    );
    const walletSignature = await signTypedDataAsync(walletDoc);
    walletEntropy.value = hexToBytes(walletSignature as `0x${string}`);
 
    console.log('Authentication complete!');
  } catch (error) {
    console.error('Authentication failed:', error);
  }
};
</script>
 
<template>
  <div>
    <button @click="handleCompleteAuth">Sign In & Generate Wallet</button>
    <div v-if="authToken">Authenticated!</div>
    <div v-if="walletEntropy">Wallet entropy generated!</div>
  </div>
</template>

Best Practices

Domain Consistency - Use the same domain for SIWE messages as your app
Error Handling - Always check return values and handle errors
Type Safety - Use TypeScript types for all parameters
Security - Never expose secret tokens or private keys