Chart

1. Overview

The interface is divided into two dynamically resizable sections:

Chart Section (Default 70%)

  • Real-time TradingView price chart

  • Professional analysis tools

  • Multiple timeframes and indicators

Data Tables Section (Default 30%)

  • Transactions: Live trade feed with filtering

  • Holders: Top token holders

  • Chat: Community discussion

Drag the divider between sections to customize your layout. Your preferences are automatically saved.


2. Resizable Interface

Drag the Divider

  • Click and drag up or down

  • Adjust chart height from 30% to 85%

  • Real-time percentage indicator shows split

Double-Click to Reset

  • Restores default 70/30 split

Features

  • Touch-enabled for mobile

  • Smooth animations

  • Persistent preferences saved to localStorage


3. Chart Section

TradingView Integration

Timeframes

  • 1m, 5m, 15m, 1h, 4h, 1D

Drawing Tools

  • Trend lines, Fibonacci retracements

  • Support/resistance levels

  • Shapes and annotations

Technical Indicators

  • 100+ built-in indicators (RSI, MACD, Bollinger Bands)

  • Moving averages (SMA, EMA, WMA)

  • Volume indicators

  • Custom combinations

Chart Types

  • Candlestick, Line, Area, Bar, Heikin Ashi

Real-Time Updates

  • Sub-second latency via WebSocket

  • Automatic updates on new trades

Market Information Header

Displays above the chart:

  • Trading pair (e.g., SOL / USDC)

  • Current price with 24h change

  • Market cap, liquidity, volume

  • Network badges (Solana, DEX identifier)


4. Transactions Tab

Real-time trade feed with advanced filtering.

Advanced Filtering

Click any column header with a filter icon (🔍) to open filtering:

USD Amount Filter

  • Set min/max dollar value

  • Example: Filter trades above $10,000

Token Amount Filter

  • Set min/max token quantity

  • Example: Show trades between 100K-1M tokens

Quote Amount Filter

  • Filter by SOL/USDC amount

  • Example: Trades above 100 SOL

Type Filter

  • All, Buy only, or Sell only

  • Visual button selection

Multiple Filters

  • Combine all filters simultaneously

  • Real-time application as trades stream in


5. Holders Tab

Top token holders ranked by wallet holdings.

Features

Manual Refresh Button

  • Updates on-chain data instantly

  • 10-second cooldown between refreshes

  • Animated spinner during loading

Color Coding

  • Unique hue per wallet address

  • Consistent across Holders and Chat tabs

  • 60% saturation default, 100% on hover

Wallet Links

  • Click any address to open on Solscan


6. Chat Tab

Community discussion with social features.

Writing Comments

Comment Button

  • Opens compose dialog

  • Requires wallet connection

Compose Dialog

  • 150 character limit enforced

  • URLs automatically blocked

  • Cryptographic signature required

  • Cancel/Post buttons

Sorting Options

Show Top (Default)

  • Sorts by like count descending

  • Most liked comments first

Show Newest

  • Sorts by timestamp

  • Most recent first

Toggle between modes with button next to "Write a Comment"

Liking Messages

  • Click heart (♥) to like/unlike

  • Red when liked, gray when not

  • Requires wallet connection

  • Real-time updates via WebSocket


7. Bonding Curve Display

Conditional component in the info panel based on token status.

When Bonding Curve Active

Shows when Bonding curve exists:

Display Elements

  • Progress bar with animated gradient

  • Percentage indicator (e.g., "67%")

  • "BONDING CURVE" header

  • Graduation message based on DEX type

Graduation Targets

  • Pump Fun (DEX 1/2): "Graduate to Pump Fun Swap at 100%"

  • Tradersdex (DEX 42): "Graduate to Tradersdex Swap at 100% (~100K MC)"

  • Raydium Launchpad (DEX 10): "Graduate to Raydium Swap at 100%"

Visual Features

  • Gradient progress bar (blue → purple → red)

  • Pulsing glow animation

  • Real-time updates from WebSocket

When No Bonding Curve

Shows affiliates promotion when bonding curve is undefined:

Banner Content

TRADERSDEX AFFILIATES - 20%

Share your Affiliate link and earn up to 
20% of referred users trading fees

Interactive Elements

  • "Affiliate link" text links to /affiliates page

  • Highlighted in blue (#4DC9FF)

  • Same visual styling as bonding curve container


8. Sentiment Voting

Community market sentiment indicator below the info panel.

Interface

Two Buttons Side-by-Side

  • Bullish: Green border/text (#00FFA3)

  • Bearish: Red border/text (#FF4D4F)

  • Vote counts shown in parentheses

Visual Indicators

  • Percentage labels above buttons (e.g., 65% | 35%)

  • Gradient progress bar splits at bullish percentage

  • Active vote shows filled background with inverted text

Voting Process

Requirements

  • Wallet connection required

  • One vote per wallet per pool

  • Can change vote anytime

How to Vote

  1. Click Bullish or Bearish button

  2. System validates wallet signature

  3. Vote recorded on-chain

  4. UI updates immediately

  5. Vote counts and percentages refresh in real-time

Features

  • Cryptographic signature authentication

  • Real-time synchronization across all users

  • Persistent vote tracking per wallet

  • No expiration on votes

The Chart Interface provides professional-grade trading tools with real-time data, community engagement, and customizable layouts, everything you need in one powerful view.

Last updated