Skip to Content
Introduction

Introduction

Satellite Connect

A universal, React-based solution for seamless multi-chain (EVM & Solana) connector connection and state management.

Satellite Connect, developed by TUWA, is a comprehensive ecosystem for Web3 wallet integrations. It provides a unified React interface (components and hooks) for connecting and managing connectors across different blockchain networks, specifically EVM and Solana.

🏛️ What is Satellite Connect?

Satellite Connect is the complete wallet connection and state management layer for multi-chain React dApps. It is built on top of the Orbit Utils  (TUWA’s framework-agnostic core library), abstracting away the complexities of underlying libraries like wagmi and gill.

Why Satellite Connect?

Building dApps for both EVM and Solana chains requires juggling multiple, disconnected wallet libraries (like wagmi and the Solana Wallet Standard). This results in separate connection flows, different state management logic, and a fragmented user experience.

Satellite Connect solves this by:

  1. Providing a Unified Store: @tuwaio/satellite-core offers a single Zustand-based store to hold the connection state for all chains.
  2. Offering a Single React Provider: @tuwaio/satellite-react gives you one <SatelliteConnectProvider> to wrap your app and abstract away the complexity of WagmiProvider, etc.
  3. Abstracting Connection Logic: Chain-specific adapters (@tuwaio/satellite-evm, @tuwaio/satellite-solana) plug wagmi and gill directly into the central Satellite store.
  4. Integrating SIWE: Includes a dedicated package (@tuwaio/satellite-siwe-next-auth) for secure, server-side “Sign-In with Ethereum” authentication, built to work seamlessly with the connection flow.

✨ Key Features

  • Unified React Hooks & Components: A single set of hooks (useSatelliteStore) and providers for managing all connections.
  • Multi-Connection Support: Manage multiple simultaneous connections (e.g., MetaMask + Phantom) with a unified state.
  • Native EVM & Solana Support: Seamlessly integrates EVM (MetaMask, WalletConnect) and Solana (Phantom, Solflare) wallets.
  • Modern Architecture: Built on top of wagmi / viem for EVM and gill / @wallet-standard for Solana.
  • Secure SIWE Integration: Provides @tuwaio/satellite-siwe-next-auth for easy, secure, server-side “Sign-In with Ethereum” using Next.js App Router.
  • Chain-Agnostic Core: satellite-core provides a universal store (Zustand) and types.
  • SSR-Ready: Designed for modern React frameworks like Next.js (App Router).

🧩 Ecosystem Packages

Satellite Connect is modular, allowing you to install only what you need.

Core Packages

  • @tuwaio/satellite-core: The foundational package. Provides the chain-agnostic Zustand store, universal types, and the core adapter interface.
  • @tuwaio/satellite-react: Provides the main <SatelliteConnectProvider> and React hooks (useSatelliteStore) to interact with the wallet state in your components.

Chain-Specific Adapters

  • @tuwaio/satellite-evm: The adapter for EVM chains. It bridges wagmi and viem into the Satellite Connect store. (Depends on @tuwaio/orbit-evm).
  • @tuwaio/satellite-solana: The adapter for the Solana network. It bridges gill and the Wallet Standard into the Satellite Connect store. (Depends on @tuwaio/orbit-solana).

Authentication

  • @tuwaio/satellite-siwe-next-auth: A complete, secure solution for “Sign-In with Ethereum” (SIWE) built for Next.js App Router, using Iron Session for cookie-based auth.

🚀 Getting Started

Here is a basic example of how to set up the SatelliteConnectProvider in a React application (e.g., in your main layout.tsx or App.tsx).

import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { satelliteEVMAdapter, createDefaultTransports } from '@tuwaio/satellite-evm';
import { SatelliteConnectProvider } from '@tuwaio/satellite-react';
import { EVMConnectorsWatcher } from '@tuwaio/satellite-react/evm';
import { SolanaConnectorsWatcher } from '@tuwaio/satellite-react/solana';
import { satelliteSolanaAdapter } from '@tuwaio/satellite-solana';
import { WagmiProvider } from 'wagmi';
import { ReactNode } from 'react';
import { createConfig } from '@wagmi/core';
import { injected } from '@wagmi/connectors';
import { mainnet, sepolia } from 'viem/chains';
import type { Chain } from 'viem/chains';
 
export const appEVMChains = [
  mainnet,
  sepolia,
] as readonly [Chain, ...Chain[]];
 
export const wagmiConfig = createConfig({
  connectors: [injected()],
  transports: createDefaultTransports(appEVMChains), // Automatically creates http transports
  chains: appEVMChains,
  ssr: true, // Enable SSR support if needed (e.g., in Next.js)
});
 
export const solanaRPCUrls = {
  devnet: 'https://api.devnet.solana.com',
};
 
 
const queryClient = new QueryClient();
 
export function Providers({ children }: { children: ReactNode }) {
  return (
    <WagmiProvider config={wagmiConfig}>
      <QueryClientProvider client={queryClient}>
        <SatelliteConnectProvider
          adapter={[satelliteEVMAdapter(wagmiConfig), satelliteSolanaAdapter({ rpcUrls: solanaRPCUrls })]}
          autoConnect={true}
        >
          <EVMConnectorsWatcher wagmiConfig={wagmiConfig} />
          <SolanaConnectorsWatcher />
          {children}
        </SatelliteConnectProvider>
      </QueryClientProvider>
    </WagmiProvider>
  );
}

📚 Next Steps

Built with ❤️ by the TUWA Team 

Last updated on
@tuwaio/satellite-connect-monorepo