RAWR! Stomp through the blockchain jungle like a prehistoric beast! 🦕

A fun, T-rex themed cross-chain bridge enabling swaps between Avalanche L1s and external blockchains using Avlanche's ICM, Avalanche's ICTT and Chainlink's CCIP.

T-rex enables seamless token swapping between different blockchain networks:

• Avalanche L1s (Dispatch, Echo) using ICM/ICTT
• Avalanche C-Chain (Fuji) using both ICM/ICTT and CCIP
• External Chains (Ethereum Sepolia, Polygon Amoy) via CCIP

For a technical overview on how the multi-hop cross-chain swapping is being enabled read the src README.md

• src folder contains the smart contracts that enable to perform the cross-chain swapping
• frontend folder contains all the frontend files
• chainlink_deployedcontracts folder contains chainlink contracts that perfom token and data transfers on the same transactions which are the basis for understanding how to implement ccip logic for the multi-hop cross-chain swapping
• lib folder contains contract's dependencies that came in as handy when we had problems using forge
• t-rex_graveyard folder is a fun place to explore previous ideas we developed and files we just felt attached too to

# Clone and setup
git clone <repository>
cd londonhackathon

# Install frontend dependencies
cd frontend
npm install

# Start development server
npm run dev

• URL: http://localhost:3001 (or next available port)
• Default Route: Dispatch → Polygon Amoy
• Default Tokens: DIS → MATIC

Get test tokens from faucets:

• Dispatch: https://test.core.app/tools/testnet-faucet/?subnet=dispatch&token=dispatch
• Echo: https://test.core.app/tools/testnet-faucet/?subnet=echo&token=echo
• Sepolia: https://faucets.chain.link/sepolia
• Polygon Amoy: https://faucet.polygon.technology/

• T-rex Swap Header with prehistoric branding
• From/To Selectors: "T-rex starts here" → "T-rex destination"
• Feed Input: "🍖 Feed me!" placeholder
• Route Display: Shows Teleporter, CCIP, or Hybrid routes

• Green Theme: Matches jungle aesthetic
• Cave Icon: 🏔️ represents T-rex habitat
• Connect State: Shows wallet address with cave branding

• Cost Breakdown: Gas, Bridge, Protocol fees
• Mock Data Badge: "🦖 Mock" indicator
• Confidence Levels: High/Medium/Low based on trade parameters

• Teleporter: Avalanche L1 ↔ L1 (fastest)
• CCIP: External ↔ External (standard)
• Hybrid Route: L1 → External (multi-hop)
• CCIP + Teleporter: External → L1 (complex)

frontend/
├── pages/
│   ├── index.tsx           # Main T-rex interface
│   └── _app.tsx           # Wallet providers
├── src/
│   ├── components/
│   │   ├── SwapInterface.tsx    # Main swap component
│   │   ├── WalletConnect.tsx    # Cave-themed wallet
│   │   ├── ChainSelector.tsx    # Network selection
│   │   └── TokenSelector.tsx    # Token selection
│   ├── constants/
│   │   ├── chains.ts           # 4 supported networks
│   │   └── tokens.ts           # Token configurations
│   ├── utils/
│   │   ├── contracts.ts        # Mock pricing engine
│   │   └── wallet.ts           # Wallet management
│   └── styles/
│       └── globals.css         # Jungle theme CSS

• Color Palette: Green/Emerald/Teal gradients
• Background: from-green-900 via-emerald-900 to-teal-900
• Components: Green focus states, borders, buttons
• Animations: Jungle-themed pulse and shimmer effects

// Real market prices (January 2025)
const REAL_TOKEN_PRICES = {
  DIS: 0.0075,      // Dispatch token
  ECHO: 0.012,      // Echo token  
  ETH: 2500,        // Ethereum
  MATIC: 0.35,      // Polygon
  AVAX: 22.80,      // Avalanche
  USDC: 1.00,       // Stablecoin
  LINK: 15.30       // Chainlink
};

# Frontend environment (.env.local)
NEXT_PUBLIC_WALLETCONNECT_PROJECT_ID=your_project_id
NEXT_PUBLIC_ENVIRONMENT=development

• From Chain: Dispatch (Avalanche L1)
• To Chain: Polygon Amoy (External)
• Slippage: 0.5% default
• Mock Data: Always enabled for demo

• T-rex Branding: Immediate prehistoric theme
• Jungle Background: Subtle T-rex silhouettes
• Default Setup: Ready to swap Dispatch → Amoy

• Cave Theme: 🏔️ Connect Wallet button
• Green Styling: Matches jungle aesthetic
• Status Display: Shows connected address with cave icon

• Feed the T-rex: Enter amount to "feed" the beast
• Route Calculation: T-rex "thinks" and calculates best path
• Cost Display: "T-rex Feeding Costs" breakdown
• Execution: "🦖 RAWR! Execute Swap" button

• Calculating: "🦖 T-rex is calculating..."
• Processing: "🦖 T-rex is stomping..."
• Thinking: "🦖 T-rex is thinking..."

• T-rex Themed UI with jungle aesthetics
• 4 Testnet Support (Dispatch, Echo, Sepolia, Amoy)
• Realistic Mock Pricing based on real market data
• Dynamic Fee Calculation with proper slippage
• Route Type Detection (Teleporter/CCIP/Hybrid)
• Cave-themed Wallet connection
• Responsive Design for all screen sizes

• Real Price Feeds: Current market values
• Dynamic Slippage: 0.1% - 3% based on conditions
• Realistic Fees: Chain-specific gas costs
• Time Estimates: Route complexity based
• Confidence Scoring: Trade size and route dependent

1. Update frontend/src/constants/chains.ts
2. Add to SUPPORTED_CHAINS object
3. Configure in wagmi providers

1. Modify frontend/src/styles/globals.css
2. Update color variables and animations
3. Add new T-rex themed components

1. Edit frontend/src/utils/contracts.ts
2. Update REAL_TOKEN_PRICES object
3. Modify fee calculation logic

• Background Elements: Subtle T-rex silhouettes
• Loading Messages: Prehistoric themed states
• Error Handling: "T-rex is confused!" messages
• Button Text: "Wake up T-rex!" and "RAWR! Execute"
• Input Placeholders: "🍖 Feed me!" for amounts

• Mobile Optimized: Works on all screen sizes
• Touch Friendly: Large buttons and inputs
• Compact Layout: Efficient use of space
• Jungle Theme: Consistent across devices

1. Start Server: cd frontend && npm run dev
2. Open Browser: Navigate to http://localhost:3001
3. Connect Wallet: Click cave-themed connect button
4. Feed T-rex: Enter amount in "🍖 Feed me!" input
5. Watch Magic: See realistic pricing calculations
6. Execute Swap: Click "🦖 RAWR! Execute Swap"

🦖 Built for London Hackathon 2025 Stomp through the blockchain jungle with prehistoric power! 🌿🦕