### Install Dependencies and Start Development Server

Source: https://github.com/uniswap/interface/blob/main/apps/web/README.md

Installs project dependencies using Bun and starts the local development server.

```bash
bun install
bun web dev
```

--------------------------------

### Install and Run Uniswap Interface

Source: https://github.com/uniswap/interface/blob/main/README.md

Clone the repository, install dependencies, and start the web application. Assumes 'bun' is installed and configured.

```bash
git clone git@github.com:Uniswap/interface.git
bun install
bun lfg
bun web start
```

--------------------------------

### Run All Setup and Run Commands

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/README.md

A single command to execute installation, pod installation, and app running sequentially.

```bash
bun install && bun pod && bun ios
```

--------------------------------

### Install @universe/websocket

Source: https://github.com/uniswap/interface/blob/main/packages/websocket/README.md

Install the package using bun.

```bash
bun add @universe/websocket
```

--------------------------------

### Initial Project Setup

Source: https://github.com/uniswap/interface/blob/main/AGENTS.md

Run these commands for initial project setup. Requires the 1Password CLI.

```bash
# Initial setup (requires 1Password CLI)
bun install
bun local:check
bun lfg  # Sets up mobile and extension
```

--------------------------------

### Shell Profile Setup for Local Development

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/README.md

Example configuration for a shell profile file (e.g., .zshrc) to ensure Homebrew and NVM are correctly loaded, enabling the terminal to run the app locally.

```bash
eval "$(/opt/homebrew/bin/brew shellenv)"

export NVM_DIR="$HOME/.nvm"
[ -s "/opt/homebrew/opt/nvm/nvm.sh" ] && \. "/opt/homebrew/opt/nvm/nvm.sh"  # This loads nvm
[ -s "/opt/homebrew/opt/nvm/etc/bash_completion.d/nvm" ] && \. "/opt/homebrew/opt/nvm/etc/bash_completion.d/nvm"  # This loads nvm bash_completion
```

--------------------------------

### Start Development Servers

Source: https://github.com/uniswap/interface/blob/main/AGENTS.md

Commands to start development servers for different Uniswap interfaces.

```bash
bun web dev        # Web with Vite
bun mobile ios          # iOS app
bun mobile android      # Android app
bun extension start     # Extension
```

--------------------------------

### Install Zulu JDK 17

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/README.md

Installs Zulu JDK version 17 using Homebrew. Also shows how to get the installation path for the JDK.

```bash
brew install --cask zulu@17

# Get path to where cask was installed to double-click installer
brew info --cask zulu@17
```

--------------------------------

### Install Ruby with rbenv

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/README.md

Installs rbenv and ruby-build via Homebrew, initializes rbenv, and then installs and sets a specific Ruby version as the default.

```bash
brew install rbenv ruby-build
```

```bash
rbenv init
```

```bash
rbenv install 3.2.2
rbenv global 3.2.2
```

--------------------------------

### Install Dependencies

Source: https://github.com/uniswap/interface/blob/main/apps/extension/e2e/README.md

Install project dependencies from the repository root.

```bash
bun install
```

--------------------------------

### Install Playwright Browsers

Source: https://github.com/uniswap/interface/blob/main/apps/extension/e2e/README.md

Install the necessary Playwright browsers from the extension directory.

```bash
cd apps/extension
bun playwright install chromium
```

--------------------------------

### Install Bun Package Manager

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/README.md

Installs a specific version of Bun using the official installation script. Verify the installation by checking the version.

```bash
curl -fsSL https://bun.sh/install | bash -s "bun-v1.3.11"
```

```bash
> bun -v
1.3.11
```

--------------------------------

### Start Web App Development Server

Source: https://github.com/uniswap/interface/blob/main/AGENTS.md

Use this command to start the development server for the web application. It runs on http://localhost:3000/.

```bash
bun web dev
```

--------------------------------

### Project and CMake Version Setup

Source: https://github.com/uniswap/interface/blob/main/packages/hashcash-native/android/CMakeLists.txt

Initializes the project and sets the minimum required CMake version.

```cmake
project(NitroHashcashNative)
cmake_minimum_required(VERSION 3.9.0)
```

--------------------------------

### Install iOS Pods

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/README.md

Installs all necessary pods for the iOS project. May require 'pod repo update' if it fails.

```bash
bun mobile pod
```

--------------------------------

### Quick Start: Create and Use WebSocket Client

Source: https://github.com/uniswap/interface/blob/main/packages/websocket/README.md

Demonstrates how to create a type-safe WebSocket client, define message types, and handle subscriptions and unsubscriptions. The client connects on the first subscribe call and disconnects when no subscribers remain.

```typescript
import { createWebSocketClient } from '@universe/websocket'

// Define your param and message types
interface PriceParams {
  tokenAddress: string
  chainId: number
}

interface PriceMessage {
  price: number
  timestamp: number
}

// Create the client
const client = createWebSocketClient<PriceParams, PriceMessage>({
  config: {
    url: 'wss://api.example.com/ws',
  },
  subscriptionHandler: {
    subscribe: async (connectionId, params) => {
      await fetch('/api/subscribe', {
        method: 'POST',
        body: JSON.stringify({ connectionId, ...params }),
      })
    },
    unsubscribe: async (connectionId, params) => {
      await fetch('/api/unsubscribe', {
        method: 'POST',
        body: JSON.stringify({ connectionId, ...params }),
      })
    },
    // Optional: batch subscribe/unsubscribe for efficiency
    subscribeBatch: async (connectionId, paramsList) => {
      await fetch('/api/subscribe-batch', {
        method: 'POST',
        body: JSON.stringify({ connectionId, subscriptions: paramsList }),
      })
    },
    unsubscribeBatch: async (connectionId, paramsList) => {
      await fetch('/api/unsubscribe-batch', {
        method: 'POST',
        body: JSON.stringify({ connectionId, subscriptions: paramsList }),
      })
    },
  },
  parseConnectionMessage: (raw) => {
    if (raw && typeof raw === 'object' && 'connectionId' in raw) {
      return { connectionId: raw.connectionId as string }
    }
    return null
  },
  parseMessage: (raw) => {
    if (raw && typeof raw === 'object' && 'channel' in raw && 'data' in raw) {
      const msg = raw as { channel: string; tokenAddress: string; chainId: number; data: PriceMessage }
      return {
        channel: msg.channel,
        key: `${msg.channel}:${msg.tokenAddress}:${msg.chainId}`,
        data: msg.data,
      }
    }
    return null
  },
  createSubscriptionKey: (channel, params) => `${channel}:${params.tokenAddress}:${params.chainId}`,
})

// Subscribe — connection opens automatically on first subscribe
const unsubscribe = client.subscribe({
  channel: 'prices',
  params: { tokenAddress: '0x...', chainId: 1 },
  onMessage: (message) => {
    console.log('Price update:', message.price)
  },
})

// Later: unsubscribe — connection closes automatically when last subscriber leaves
unsubscribe()

```

--------------------------------

### Browse Tokens by Network Examples

Source: https://github.com/uniswap/interface/blob/main/apps/web/src/features/deepLinking/README.md

Examples of URLs for browsing tokens filtered by specific networks or all networks.

```url
https://app.uniswap.org/explore/tokens/ethereum
```

```url
https://app.uniswap.org/explore/tokens/unichain
```

```url
https://app.uniswap.org/explore/tokens
```

--------------------------------

### Run Extension Locally with WXT

Source: https://github.com/uniswap/interface/blob/main/apps/extension/README.md

Start the WXT development server to run the extension locally. WXT automatically opens a browser with the extension loaded.

```bash
bun extension dev
```

--------------------------------

### Install xcodeproj Gem

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/ios/WidgetsCore/MobileSchema/README.md

Install the required 'xcodeproj' Ruby gem. This is a prerequisite for the file update script.

```bash
gem install xcodeproj
```

--------------------------------

### Fingerprint Configuration Example

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/README.md

An example of a fingerprint command configuration within the .vscode/launch.json file for Radon IDE. This hash helps determine build changes.

```json
{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Debug iOS",
      "request": "launch",
      "type": "reactnative",
      "platform": "ios",
      "ios": {
        """
        # This is a placeholder for the actual fingerprint command.
        # Replace with the actual command from getFingerprintForRadonIDE.js
        """
        "targetScripts": [
          "echo 'Calculating fingerprint...'",
          "./scripts/getFingerprintForRadonIDE.js"
        ]
      }
    }
  ]
}
```

--------------------------------

### Specific Pool Page Example

Source: https://github.com/uniswap/interface/blob/main/apps/web/src/features/deepLinking/README.md

Example URL for viewing a specific liquidity pool on the Ethereum network.

```url
https://app.uniswap.org/explore/pools/ethereum/0x88e6A0c2dDD26FEEb64F039a2c41296FcB3f5640
```

--------------------------------

### Specific Token Page Examples

Source: https://github.com/uniswap/interface/blob/main/apps/web/src/features/deepLinking/README.md

Examples of URLs for viewing specific token details on different networks.

```url
https://app.uniswap.org/explore/tokens/ethereum/0x1f9840a85d5aF5bf1D1762F925BDADdC4201F984
```

```url
https://app.uniswap.org/explore/tokens/unichain/NATIVE
```

```url
https://app.uniswap.org/explore/tokens/base/0x833589fCD6eDb6E08f4c7C32D4f71b54bdA02913
```

--------------------------------

### Install Workspace Package

Source: https://github.com/uniswap/interface/blob/main/packages/compliance/README.md

Add the @universe/compliance package to your application's dependencies in the package.json file.

```jsonc
"@universe/compliance": "workspace:^"
```

--------------------------------

### Run WXT with Absolute Paths

Source: https://github.com/uniswap/interface/blob/main/apps/extension/README.md

Start the WXT development server using absolute paths, suitable for Scantastic testing. This command auto-detects the current OS.

```bash
# Auto-detect current OS (Mac / Linux / Windows)
bun extension start:absolute

# Windows
bun extension start:absolute:windows
```

--------------------------------

### Install Mobile Dependencies with Bundler

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/README.md

Installs Ruby gems specified in the Gemfile using Bundler. This command should be run from the 'mobile' directory.

```bash
bundle install
```

--------------------------------

### Install and Use Specific Node.js Version

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/README.md

Installs a specified version of Node.js using nvm and sets it as the active version. Ensure you check the .nvmrc file for the correct version.

```bash
nvm install 22.22.2
nvm use 22.22.2
```

```bash
> node -v
v22.22.2
```

--------------------------------

### Start Metro Bundler Manually

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/README.md

Manually start the Metro bundler if it does not open automatically when running the iOS app.

```bash
bun start
```

--------------------------------

### Configure WXT Browser Behavior

Source: https://github.com/uniswap/interface/blob/main/apps/extension/README.md

Customize how WXT opens the browser by creating a `web-ext.config.ts` file. This example shows how to use a persistent Chrome profile.

```typescript
// web-ext.config.ts
import { defineWebExtConfig } from 'wxt';

export default defineWebExtConfig({
  // Option 1: Connect to already running Chrome (requires Chrome to be started with --remote-debugging-port=9222)
  // chromiumPort: 9222,

  // Option 2: Use your existing Chrome profile (but Chrome must be closed first)
  // chromiumArgs: [
  //   '--user-data-dir=/Users/<username>/Library/Application Support/Google/Chrome',
  //   '--profile-directory=Default'
  // ],

  // Option 3: Create a persistent profile that matches your existing setup (recommended)
  chromiumArgs: [
    '--user-data-dir=./.wxt/chrome-data',
    // Sync with your Google account to get bookmarks, extensions, etc.
    // '--enable-sync',
  ],
});
```

--------------------------------

### Setup ComplianceClientProvider

Source: https://github.com/uniswap/interface/blob/main/packages/compliance/README.md

Mount ComplianceClientProvider once, typically near the React Query root. This is essential for using hooks like useComplianceClient and useTokenComplianceStatus.

```tsx
import { ComplianceClientProvider } from '@universe/compliance'

<ComplianceClientProvider>
  <App />
</ComplianceClientProvider>
```

--------------------------------

### Update CocoaPods Repositories and Install

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/README.md

Fixes CocoaPods compatibility issues by updating local repository definitions and then installing pods. Use '--repo-update' for initial repository sync.

```bash
cd ios && pod install --repo-update
```

--------------------------------

### Configure JAVA_HOME Environment Variable

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/README.md

Sets the JAVA_HOME environment variable to the installed Zulu JDK 17 path. This should be added to your shell's rc file.

```bash
export JAVA_HOME=/Library/Java/JavaVirtualMachines/zulu-17.jdk/Contents/Home
```

--------------------------------

### Notification Chaining Example

Source: https://github.com/uniswap/interface/blob/main/packages/notifications/README.md

Demonstrates how to chain notifications using the POPUP action. The onClickLink property of an OnClickAction triggers the next notification in the sequence.

```typescript
// Step 1: User sees welcome banner
{
  id: 'welcome_step_1',
  content: {
    buttons: [{
      text: 'Learn More',
      onClick: {
        onClick: [OnClickAction.DISMISS, OnClickAction.POPUP],
        onClickLink: 'welcome_step_2'  // ← triggers next notification
      }
    }]
  }
}

// Step 2: Detailed modal (stored as "chained" until triggered)
{
  id: 'welcome_step_2',
  content: { style: ContentStyle.MODAL, /* ... */ }
}
```

--------------------------------

### Run Vitest Preset Tests

Source: https://github.com/uniswap/interface/blob/main/config/vitest-presets/README.md

Navigate to the `config/vitest-presets` directory and execute the tests using Bun to verify the configuration.

```bash
cd config/vitest-presets
bun run test
```

--------------------------------

### Set Up Local Include Directories

Source: https://github.com/uniswap/interface/blob/main/packages/hashcash-native/android/CMakeLists.txt

Configures the directories where the compiler should look for header files.

```cmake
include_directories(
        "src/main/cpp"
        "../cpp"
)
```

--------------------------------

### Configure Android Environment Variables

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/README.md

Sets ANDROID_HOME and adds emulator and platform-tools to the system's PATH. Add these to your .rc file.

```bash
export ANDROID_HOME=$HOME/Library/Android/sdk
export PATH=$PATH:$ANDROID_HOME/emulator
export PATH=$PATH:$ANDROID_HOME/platform-tools
```

--------------------------------

### Build Project Packages

Source: https://github.com/uniswap/interface/blob/main/AGENTS.md

Commands for building the project packages for various environments and platforms.

```bash
bun g:build                      # Build all packages
bun web build:production    # Web production build
bun mobile ios:bundle            # iOS bundle
bun mobile android:release       # Android release
bun extension build:production   # Extension production
```

--------------------------------

### Run iOS App

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/README.md

Boots up the iOS Simulator and runs the app. The JS bundler (metro) should open automatically.

```bash
bun mobile ios
```

--------------------------------

### Pre-populate Swap Screen (DAI to UNI on Mainnet)

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/src/features/deepLinking/README.md

Routes to the swap screen with pre-filled details for swapping 100 DAI for UNI on Ethereum mainnet.

```url
# Swap 100 Ethereum mainnet DAI for Ethereum mainnet UNI
https://uniswap.org/app?screen=swap&userAddress=0x123...789&inputCurrencyId=1-0x6B175474E89094C44Da98b954EedeAC495271d0F&outputCurrencyId=1-0x1f9840a85d5aF5bf1D1762F925BDADdC4201F984&currencyField=input&amount=100
```

--------------------------------

### Initiate Fiat On-ramp (ETH Purchase)

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/src/features/deepLinking/README.md

Opens the fiat on-ramp interface to buy ETH, with the amount specified in the user's local fiat currency.

```url
# Buy 100 units of user's fiat currency worth of ETH (e.g., $100 if USD, €100 if EUR)
https://uniswap.org/app/buy?value=100&currencyCode=ETH
```

--------------------------------

### Trace Component with Properties

Source: https://github.com/uniswap/interface/blob/main/packages/utilities/src/telemetry/trace/README.md

Pass additional properties to the Trace component, useful for enriching event data. This example shows setting token details.

```typescript
<Trace screen={Screens.TokenDetails} properties={{tokenAddress: address, tokenName: name}}>
  {children}
</Trace>
```

--------------------------------

### Import and Configure Vitest Preset

Source: https://github.com/uniswap/interface/blob/main/config/vitest-presets/README.md

Import the Vitest preset and merge it with your Vitest configuration in `vitest.config.js`. This sets up the project to use the preset's configurations.

```javascript
import { defineConfig } from 'vitest/config'
import vitestPreset from 'config/vitest-presets/vitest/vitest-preset.js'

export default defineConfig({
  ...vitestPreset,
  // Add any additional overrides here
})
```

--------------------------------

### Initiate Fiat On-ramp (ETH Purchase in Token Mode)

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/src/features/deepLinking/README.md

Opens the fiat on-ramp interface to buy exactly 0.5 ETH, specifying the amount directly in token units.

```url
# Buy exactly 0.5 ETH (token input mode)
https://uniswap.org/app/buy?value=0.5&currencyCode=ETH&isTokenInputMode=true
```

--------------------------------

### Set Xcode Path for Pod Installation

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/README.md

Ensures the correct Xcode path is selected for CocoaPods to function properly. Run this command if you encounter issues with 'glog' podspec.

```bash
sudo xcode-select --switch /Applications/Xcode.app
pod install
```

--------------------------------

### Prepare Codegen Files

Source: https://github.com/uniswap/interface/blob/main/AGENTS.md

This script generates necessary codegen files for typechecking and building. It is run as part of the postinstall script.

```bash
nx run-many -t prepare
```

--------------------------------

### Pre-populate Swap Screen (DAI to UNI on Polygon)

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/src/features/deepLinking/README.md

Routes to the swap screen with pre-filled details for swapping DAI for UNI on Polygon, specifying the amount in the output field.

```url
# Swap Polygon DAI for 100 Polygon UNI
https://uniswap.org/app?screen=swap&userAddress=0x123...789&inputCurrencyId=137-0x6B175474E89094C44Da98b954EedeAC495271d0F&outputCurrencyId=137-0x1f9840a85d5aF5bf1D1762F925BDADdC4201F984&currencyField=output&amount=100
```

--------------------------------

### Using Resolved Query Results for Expectations

Source: https://github.com/uniswap/interface/blob/main/packages/wallet/src/test/README.md

Access the `resolved` property from `queryResolvers` to get the actual query result. This is crucial for creating accurate expected objects, as fixtures may contain extra fields not present in the query response.

```tsx
const { resolvers, resolved } = queryResolvers({
  searchTokens: () => createArray(5, token),
});

const { result } = renderHook(() => useSearchTokens("", null, false), {
  resolvers,
});

await waitFor(async () => {
  expect(result.current.data).toEqual(
    // wait until the resolved value is available and use it to create the expected
    // test result (using the fixture created with createArray(5, token) won't work
    // because of too many fields)
    (await resolved.searchTokens).map(gqlTokenToCurrencyInfo)
  );
});

```

--------------------------------

### Run Web App Tests

Source: https://github.com/uniswap/interface/blob/main/AGENTS.md

Execute tests for the web application using Nx. This command runs approximately 317 test files and takes about 2.5 minutes.

```bash
bunx nx run web:test -- --run
```

--------------------------------

### Swap Links with Pre-filled Parameters

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/src/features/deepLinking/README.md

Opens the swap interface with pre-filled token pairs and amounts. Parameters include input/output currencies, chain, value, and field (INPUT/OUTPUT).

```url
https://app.uniswap.org/swap?inputCurrency=ETH&outputCurrency=0x1f9840a85d5aF5bf1D1762F925BDADdC4201F984&chain=ethereum&value=1&field=INPUT
```

```url
https://app.uniswap.org/swap?inputCurrency=0x3c499c542cEF5E3811e1192ce70d8cC03d5c3359&outputCurrency=NATIVE&chain=polygon&value=100&field=OUTPUT
```

--------------------------------

### Initiate Fiat On-ramp (USDC Purchase with Providers)

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/src/features/deepLinking/README.md

Opens the fiat on-ramp interface to buy USDC on Unichain, with a specified amount and preferred providers.

```url
# Buy 250 units of user's fiat currency worth of USDC on Unichain using specific providers
https://uniswap.org/app/buy?value=250&currencyCode=USDC_UNICHAIN&providers=moonpay,coinbasepay
```

--------------------------------

### Build and Run All Tests

Source: https://github.com/uniswap/interface/blob/main/apps/extension/e2e/README.md

Execute all end-to-end tests after building the project.

```bash
bun run e2e
```

--------------------------------

### Run WebSocket Tests

Source: https://github.com/uniswap/interface/blob/main/packages/websocket/README.md

Execute all tests for the WebSocket package using the bun runtime.

```bash
bun websocket test
```

--------------------------------

### Initialize Utilities with Context

Source: https://github.com/uniswap/interface/blob/main/packages/chains/README.md

Initializes utility functions by importing `createUtilities` and providing a context object. This pattern allows consumers to manage feature flags, such as viem enablement, via callbacks.

```sh
import { createUtilities } from '@universe/chains'
import { FeatureFlags, getFeatureFlag } from '@universe/gating'

const ctx = { getViemEnabled: () => getFeatureFlag(FeatureFlags.ViemEnabled) }

export const { formatUnits, isAddress, namehash, parseUnits, zeroAddress } = createUtilities(ctx)
```

--------------------------------

### Run Interactive iOS Build

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/scripts/ios-build-interactive/README.md

Execute the interactive iOS build script from the apps/mobile directory.

```bash
bun ios:interactive
```

--------------------------------

### Run Tests in Headless Environment with xvfb

Source: https://github.com/uniswap/interface/blob/main/apps/extension/e2e/README.md

Execute tests in a headless environment using xvfb to simulate a display server, often required for Chrome extensions.

```bash
# Install xvfb if needed
sudo apt-get install xvfb
# Run tests with xvfb
xvfb-run -a bun run e2e:smoke
```

--------------------------------

### Buy Links with Fiat On-Ramp Parameters

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/src/features/deepLinking/README.md

Opens the fiat on-ramp interface with pre-filled purchase parameters. Optional parameters include value, currencyCode, isTokenInputMode, and providers.

```url
https://app.uniswap.org/buy?value=100&currencyCode=USDC_UNICHAIN
```

```url
https://app.uniswap.org/buy?value=0.5&currencyCode=ETH&providers=moonpay,coinbasepay&isTokenInputMode=true
```

--------------------------------

### Generate All Icons

Source: https://github.com/uniswap/interface/blob/main/packages/ui/README.md

Use this command to generate all icons from their source files. Ensure icons are placed in the correct asset directories.

```bash
bun ui build:icons
```

--------------------------------

### WalletConnect with Query Parameter

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/src/features/deepLinking/README.md

Initiates a WalletConnect connection using a `uri` query parameter within the `uniswap://wc` path.

```url
uniswap://wc?uri={encodedUri}
```

--------------------------------

### Run Project Tests

Source: https://github.com/uniswap/interface/blob/main/AGENTS.md

Commands to execute tests, including all tests, tests for changed packages, and end-to-end tests.

```bash
bun g:test                      # Run all tests
bun g:test:changed              # Run tests for changed packages
bun web playwright:test         # Web E2E tests
bun mobile e2e                  # Mobile E2E tests
```

--------------------------------

### Swap Interface

Source: https://github.com/uniswap/interface/blob/main/apps/web/src/features/deepLinking/README.md

Opens the swap interface with pre-filled token pairs, amounts, and chain selection.

```APIDOC
## Swap Interface

### Description
Opens the swap interface with pre-filled token pairs, amounts, and chain selection.

### Endpoint
`https://app.uniswap.org/swap`

### Parameters
#### Query Parameters
- **inputCurrency** (string) - Required - Input token address, `ETH`, or `NATIVE`
- **outputCurrency** (string) - Required - Output token address, `ETH`, or `NATIVE`
- **chain** (string) - Required - Network name for input token
- **outputChain** (string) - Optional - Different output network for cross-chain swaps
- **value** (string) - Optional - Amount to swap
- **field** (string) - Optional - Whether the amount refers to `INPUT` or `OUTPUT` token

### Request Example
```url
https://app.uniswap.org/swap?inputCurrency=ETH&outputCurrency=0x1f9840a85d5aF5bf1D1762F925BDADdC4201F984&chain=ethereum
```
```url
https://app.uniswap.org/swap?inputCurrency=0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48&outputCurrency=NATIVE&chain=ethereum&value=100&field=INPUT
```
```url
https://app.uniswap.org/swap?inputCurrency=NATIVE&outputCurrency=0x3c499c542cEF5E3811e1192ce70d8cC03d5c3359&chain=polygon&outputChain=base
```
```

--------------------------------

### Initialize Subscription Manager

Source: https://github.com/uniswap/interface/blob/main/packages/websocket/README.md

Instantiate a SubscriptionManager with a handler, key creation function, and error/subscription count callbacks. Useful for custom WebSocket implementations.

```typescript
import { SubscriptionManager } from '@universe/websocket'

const manager = new SubscriptionManager<MyParams, MyMessage>({
  handler: subscriptionHandler,
  createKey: (channel, params) => `${channel}:${params.id}`,
  onError: (error, operation) => console.error(operation, error),
  onSubscriptionCountChange: (count) => {
    // React to subscription count changes (e.g., lazy connect/disconnect)
  },
})
```

--------------------------------

### Fixture Creation with Custom Options (Token)

Source: https://github.com/uniswap/interface/blob/main/packages/wallet/src/test/README.md

Creates a fixture for a Token object, allowing customization via `sdkToken` options. If `sdkToken` is provided, its values are used; otherwise, `faker` generates them. This allows for creating realistic token fixtures.

```typescript
type TokenOptions = {
  sdkToken: SDKToken | null;
};

export const token = createFixture<Token, TokenOptions>({ sdkToken: null })(({ sdkToken }) => ({
  __typename: "Token",
  id: faker.datatype.uuid(),
  name: sdkToken?.name ?? faker.lorem.word(),
  symbol: sdkToken?.symbol ?? faker.lorem.word(),
  decimals: sdkToken?.decimals ?? faker.datatype.number({ min: 1, max: 18 }),
  chain: (sdkToken ? toGraphQLChain(sdkToken.chainId) : null) ?? randomChoice(GQL_CHAINS),
  address: sdkToken?.address.toLocaleLowerCase() ?? faker.finance.ethereumAddress(),
  market: null,
  project: tokenProjectBase(),
}));
```

--------------------------------

### Buy (Fiat On-Ramp) Interface

Source: https://github.com/uniswap/interface/blob/main/apps/web/src/features/deepLinking/README.md

Opens the fiat on-ramp interface for purchasing crypto with fiat currency.

```APIDOC
## Buy (Fiat On-Ramp) Interface

### Description
Opens the fiat on-ramp interface for purchasing crypto with fiat currency.

### Endpoint
`https://app.uniswap.org/buy`

### Parameters
#### Query Parameters
- **value** (string) - Optional - Pre-filled purchase amount
- **currencyCode** (string) - Optional - Target crypto currency code. Format: `{TOKEN_SYMBOL}_{CHAIN_NAME}` (e.g., `UNI_UNICHAIN`, `USDC_BASE`) or just `{TOKEN_SYMBOL}` for mainnet (e.g., `ETH`, `UNI`)
- **isTokenInputMode** (boolean) - Optional - `true` for token input mode, `false` for fiat input mode
- **providers** (string) - Optional - Comma-separated list of preferred providers (e.g., `moonpay,coinbasepay`)

### Request Example
```url
https://app.uniswap.org/buy
```
```url
https://app.uniswap.org/buy?value=100&currencyCode=ETH
```
```url
https://app.uniswap.org/buy?value=0.5&currencyCode=UNI_UNICHAIN&providers=moonpay,coinbasepay
```
```url
https://app.uniswap.org/buy?value=1000&currencyCode=USDC_BASE&isTokenInputMode=false
```
```

--------------------------------

### WalletConnect with Uniswap Scheme

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/src/features/deepLinking/README.md

Initiates a WalletConnect connection using the `uniswap://` scheme.

```url
uniswap://wc:{uri}
```

--------------------------------

### Run Unit Tests

Source: https://github.com/uniswap/interface/blob/main/packages/encoding/README.md

Execute the unit tests for the encoding package using the nx command. This ensures the package's functionality and integrity.

```sh
bun nx run encoding:test
```

--------------------------------

### Run WXT without Auto-Browser Launch

Source: https://github.com/uniswap/interface/blob/main/apps/extension/README.md

Build and watch the extension to an absolute path without automatically launching a browser. This allows manual loading into Chrome via `chrome://extensions`.

```bash
bun extension start:absolute:no-browser
```

--------------------------------

### Compile Smart Contract ABI Types

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/README.md

Run this command at the top level to generate types for smart contracts. Re-run if ABIs are changed.

```bash
bun g:prepare
```

--------------------------------

### Download Local Environment Variables

Source: https://github.com/uniswap/interface/blob/main/apps/web/README.md

Downloads default local environment variables for the mobile application.

```bash
bun mobile env:local:download
```

--------------------------------

### Create Reactive Notification Data Source

Source: https://github.com/uniswap/interface/blob/main/packages/notifications/README.md

Set up a reactive data source for instant notifications based on state changes, such as network status. It requires defining conditions and a subscription mechanism.

```typescript
import { createReactiveDataSource, type ReactiveCondition } from '@universe/notifications'

const offlineCondition: ReactiveCondition<{ isConnected: boolean }> = {
  notificationId: 'local:session:offline',
  subscribe: (onStateChange) => {
    return NetInfo.addEventListener((state) => {
      onStateChange({ isConnected: state.isConnected })
    })
  },
  shouldShow: (state) => state.isConnected === false,
  createNotification: () => new Notification({ /* ... */ }),
}

const reactiveDataSource = createReactiveDataSource({
  condition: offlineCondition,
  tracker,
})
```

--------------------------------

### Responsive Component Styling with Breakpoints

Source: https://github.com/uniswap/interface/blob/main/packages/ui/README.md

Components can adapt their styles based on screen size using breakpoint props. Use `$short` for specific breakpoint styles.

```javascript
<Flex
  margin="20"
  $short={{ margin: 10 }}
>
  ...
</Flex>
```

--------------------------------

### Generate Nitro Bindings

Source: https://github.com/uniswap/interface/blob/main/packages/hashcash-native/README.md

Run this command to generate Nitro bindings for the hashcash-native module. Ensure you have Nitro Modules set up.

```bash
# Generate Nitro bindings
bun run specs
```

--------------------------------

### Address/Wallet Links

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/src/features/deepLinking/README.md

Opens a wallet profile page. If the provided address matches an imported wallet, the app will switch to that account; otherwise, it opens the external profile view.

```url
https://app.uniswap.org/portfolio/0x1234567890123456789012345678901234567890
```

--------------------------------

### Create Mock Notification Data Source

Source: https://github.com/uniswap/interface/blob/main/packages/notifications/README.md

Provides a mock data source for testing notification services. Use this to simulate incoming notifications during tests.

```typescript
function createMockDataSource(): NotificationDataSource & {
  emit: (notifications: InAppNotification[]) => void
} {
  let callback: ((notifications: InAppNotification[], source: string) => void) | null = null

  return {
    start: (onNotifications) => { callback = onNotifications },
    stop: async () => { callback = null },
    emit: (notifications) => callback?.(notifications, 'mock'),
  }
}

// In tests
const mockDataSource = createMockDataSource()
const service = createNotificationService({
  dataSources: [mockDataSource],
  // ...
})

await service.initialize()
mockDataSource.emit([testNotification])
```

--------------------------------

### Initialize Notification Service

Source: https://github.com/uniswap/interface/blob/main/packages/notifications/README.md

Initializes the notification service with various data sources, tracker, processor, renderer, and telemetry. Ensure all necessary dependencies like queryClient, queryOptions, storageAdapter, and analytics are provided.

```typescript
import {
  createNotificationService,
  createPollingNotificationDataSource,
  createBaseNotificationProcessor,
  createNotificationTracker,
  createNotificationRenderer,
  createNotificationTelemetry,
} from '@universe/notifications'

const notificationService = createNotificationService({
  dataSources: [
    createPollingNotificationDataSource({ queryClient, queryOptions }),
    // Add more data sources as needed
  ],
  tracker: createNotificationTracker(storageAdapter),
  processor: createBaseNotificationProcessor(tracker),
  renderer: createNotificationRenderer({ onRender, canRender }),
  telemetry: createNotificationTelemetry({ analytics }),
  onNavigate: (url) => window.open(url, '_blank'),
})

await notificationService.initialize()
```

--------------------------------

### Persist Extension State with Custom Chrome Profile

Source: https://github.com/uniswap/interface/blob/main/apps/extension/README.md

Run the extension with WXT, specifying a custom directory for the Chrome user data to persist the extension's state across reruns.

```bash
WXT_CHROME_USER_DATA_DIR=/var/tmp/uniswap-extension-chrome-data bun extension start:absolute
```

--------------------------------

### Sign in to 1Password

Source: https://github.com/uniswap/interface/blob/main/apps/web/README.md

Authenticates with 1Password to access environment variables and secrets.

```bash
eval $(op signin)
```

--------------------------------

### Force Upgrade Schema

Source: https://github.com/uniswap/interface/blob/main/packages/wallet/src/features/forceUpgrade/README.md

Defines the possible statuses for the force upgrade feature. 'recommended' shows a dismissible dialog, while 'required' shows a fixed dialog blocking app usage until upgraded.

```javascript
force_upgrade: {
  status: 'recommended' | 'required' | 'not_required',
}
```

--------------------------------

### Sell (Fiat Off-Ramp) Interface

Source: https://github.com/uniswap/interface/blob/main/apps/web/src/features/deepLinking/README.md

Opens the fiat off-ramp interface for selling crypto for fiat currency.

```APIDOC
## Sell (Fiat Off-Ramp) Interface

### Description
Opens the fiat off-ramp interface for selling crypto for fiat currency.

### Endpoint
`https://app.uniswap.org/sell`

### Note
Parameters are typically added by the provider when users return from completing a transaction.
```

--------------------------------

### Download Translations

Source: https://github.com/uniswap/interface/blob/main/apps/web/README.md

Downloads translation files for the web application to the specified directory.

```bash
bun web i18n:download
```

--------------------------------

### Configure Node Path for Hermes Engine Build

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/README.md

Addresses 'hermes-engine' build errors by ensuring Node.js is correctly located. Run 'which node' and paste the output into '.xcode.env.local'.

```bash
which node
```

--------------------------------

### Basic Fixture Creation

Source: https://github.com/uniswap/interface/blob/main/packages/wallet/src/test/README.md

Creates a fixture for a network state object. The fixture function ensures that the generated object is not static, preventing potential test false positives.

```typescript
export const networkUnknown = createFixture<NetInfoUnknownState>()(() => ({
  isConnected: null,
  type: NetInfoStateType.unknown,
  isInternetReachable: null,
  details: null,
}));
```

--------------------------------

### Navigate to Activity Screen

Source: https://github.com/uniswap/interface/blob/main/apps/mobile/src/features/deepLinking/README.md

Use this link to route users to the transaction activity screen for a specific address.

```url
https://uniswap.org/app?screen=transaction&userAddress=0x123...789
```