-
-
Notifications
You must be signed in to change notification settings - Fork 246
Feat/gateway app #556
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Draft
fengtality
wants to merge
107
commits into
development
Choose a base branch
from
feat/gateway-app
base: development
Could not load branches
Branch not found: {{ refName }}
Loading
Could not load tags
Nothing to show
Loading
Are you sure you want to change the base?
Some commits from the old base branch may be removed from the timeline,
and old review comments may become outdated.
Draft
Feat/gateway app #556
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
- Updated all CLMM operations to use PancakeswapSolConfig.config.slippagePct as default - Fixed quote-position schema to show correct default (10) in Swagger UI instead of hardcoded 1 - Operations affected: quote-swap, quote-position, open-position, add-liquidity - Added app-docs with Gateway App plans and UI mockups 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Created full-stack desktop app with Portfolio, Swap, Pools, and Liquidity views - Built with Tauri v2, React 18, TypeScript, Vite, and TailwindCSS v4 - Implemented simple API client (~30 lines) using fetch for Gateway API calls - Created AppContext for global state (wallet, network, chain selection) - Added shadcn/ui components (Button, Card, Tabs, Input, Select) - Portfolio View: displays wallet balances and LP positions - Swap View: supports router-based swaps (Jupiter, 0x, Uniswap) - Pools View: search and save liquidity pools - Liquidity View: manage CLMM/AMM positions - Updated app-docs with revised tab order (Portfolio → Swap → Pools → Liquidity) - Configuration sharing: app reuses conf/ folder from Gateway server - KISS architecture: no complex state libraries, direct schema imports Testing: - Gateway server running on localhost:15888 ✓ - App dev server running on localhost:1420 ✓ - API connectivity verified ✓ - Build succeeded ✓ 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Renamed "Portfolio View" to "Wallet View" in 01-portfolio-view.md - Updated all navigation tabs across docs: Portfolio → Wallet, Config → Configs - Changed sub-tab in Wallet view: Wallet → Tokens - Updated ASCII diagrams to reflect current UI structure - Ensured consistency across all view documentation files 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Frontend (gateway-app/): - Renamed Portfolio → Wallet, Config → Configs, Wallet tab → Tokens - Added theme toggle with light/dark mode support - Implemented ConfigView with namespace sidebar (Server, RPC Providers, Chains, Networks, Connectors) - Added WalletSelector with chain grouping and icons (◎ for Solana, ⟠ for Ethereum) - Added AddWalletModal for adding new wallets - Flattened cache object editing for helius/infura configs - Auto-switch to default network when changing chains - Theme persistence via localStorage Backend (src/): - Added defaultNetwork field to /config/chains endpoint - Changed chain order to return Solana first, then Ethereum - Updated getChains route to include default network from config Dependencies: - Updated gateway-app dependencies (React, TailwindCSS, shadcn/ui) - Configured TailwindCSS for dark mode support 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Resolved conflict in pancakeswap-sol/clmm-routes/quoteSwap.ts - Kept latest slippagePct handling without fallback - Includes wrap/unwrap endpoints for Solana and Ethereum - Test files for wrap/unwrap routes removed (were failing)
- Removed Pools and Liquidity tabs from main navigation - Removed LP Positions tab from Wallet view - Cleaned up unused imports (PoolsView, LiquidityView) - Streamlined PortfolioView to show only Token Balances
…ctionality - Display all tokens from network's token list in Wallet view - Show actual balances for tokens with non-zero amounts, '0' for others - Add 'Add Token' button in Token Balances header - Create AddTokenModal component (similar to AddWalletModal) - Modal allows selecting chain, network, and entering token address - Calls POST /tokens/save to add new tokens to the list - Auto-refreshes token list after adding new token - Fetches available networks from /config/chains API
- Remove Total Holdings card - Remove Value column from balances table - Rename 'Token Balances' to 'Balances' - Show only Asset and Balance columns
- Add tokens from balances response that aren't in token list - Ensures native tokens (ETH, SOL) are displayed even if not in token list - Update handleWalletChange to properly set network when switching chains
- Native token always displayed first with balance from balances endpoint - Token list displayed after native token - Balances endpoint always returns native currency symbol
- Filter out native token from token list to avoid showing it twice - Native token always shown first, then other tokens from list
- Add clickable links to token symbols with addresses - Links open in new tab to solscan.io token page - Native token (no address) displays as plain text
…bot/gateway into feat/gateway-app
- Add delete token functionality with hover-to-show delete button - Add confirmation modal for token deletion - Show token name column in balances table - Integrate Tauri notifications for desktop app - Add react-hot-toast for browser notifications with bottom-center positioning - Include token symbols in success notifications - Fix token save endpoint to use correct route format (POST /tokens/save/:address) - Fix chain-network parameter format (ethereum-mainnet instead of eth-mainnet) - Add CORS configuration to Gateway server with preflight support - Replace all alert() calls with proper notification system 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Redesign ConfigView with table layout matching Balances view - Add inline editing with hover-to-show pencil icon - Show checkmark/X icons for save/cancel actions - Right-align values and edit inputs for better layout - Add toast notifications for config update success/error - Use POST /config/update for single config updates - Dynamically build chain sections from /config/chains API - Show full chain-network names in sidebar and network selector - Remove hardcoded chain lists, use API data instead - Organize sidebar: Server, RPC Providers, Chains (dynamic), Connectors 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Add optional API key authentication to secure Gateway API when running in production mode with remote clients. Gateway changes: - Add apiKeys configuration to server.yml and server-schema.json - Implement API key validation middleware in app.ts - Validate X-API-Key header for all requests when keys configured - Skip authentication in dev mode (--dev flag or GATEWAY_TEST_MODE=dev) - Log warning when running production mode without API keys - Add X-API-Key to CORS allowedHeaders Gateway-app changes: - Make Gateway URL configurable via VITE_GATEWAY_URL env var - Add API key support via VITE_GATEWAY_API_KEY env var - Update api.ts to include X-API-Key header when configured - Create .env.example with configuration template - Add vite-env.d.ts for TypeScript environment variable types Authentication behavior: - Dev mode: No authentication required - Production with apiKeys: Requires valid X-API-Key header - Production without apiKeys: Warning logged, no authentication Testing: - Add comprehensive test suite for API key configuration - Verify dev mode works without API keys - Validate schema accepts empty and populated apiKeys arrays Documentation: - Create API_KEY_AUTHENTICATION.md with complete setup guide - Document key generation, configuration, and testing - Include security best practices and troubleshooting 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
…pport Replace hardcoded mTLS requirement with configurable authentication to support both traditional Hummingbot (client certificates) and browser-based clients (API key). Gateway changes: - Add useCerts config (default: false) to toggle between cert and API key auth - Add allowedOrigins config for CORS support - Add sample API key to default template for easy setup - Disable client cert requirement when useCerts is false - Update HTTPS options to use useCerts configuration - Log appropriate auth method on startup Gateway-app changes: - Install and configure @tauri-apps/plugin-http - Use Tauri's fetch with acceptInvalidCerts for self-signed certificates - Add HTTP plugin scope for localhost Gateway URLs - Update default Gateway URL to HTTPS Configuration structure: - useCerts: false (API key auth, no client certs needed) - useCerts: true (traditional mTLS with client certificates) - apiKeys: list of valid API keys (only used when useCerts is false) - allowedOrigins: CORS origins for browser clients This maintains backward compatibility - existing Hummingbot users can set useCerts: true to continue using client certificates. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Remove apiKeys from server.yml config to prevent exposure through the editable config API. API keys are now managed via GATEWAY_API_KEYS environment variable for better security. Changes: - Remove apiKeys from server.yml template and schema - Read API keys from GATEWAY_API_KEYS env var (comma-separated) - Update documentation to use environment variable - Add usage instructions for multiple keys Usage: export GATEWAY_API_KEYS=key1,key2,key3 GATEWAY_API_KEYS=mykey pnpm start --passphrase=a This prevents API keys from being readable/editable via the /config API while maintaining support for multiple keys per instance. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Remove standalone API_KEY_AUTHENTICATION.md and integrate authentication documentation into main README.md and gateway-app/README.md for better discoverability. Changes: - Remove docs/API_KEY_AUTHENTICATION.md - Add Authentication section to main README.md with both auth methods - Update gateway-app/README.md with setup and auth instructions - Document environment variables and usage for both Gateway and app Authentication methods documented: - API Key (default, useCerts: false): via GATEWAY_API_KEYS env var - Client Certificates (useCerts: true): traditional mTLS for Hummingbot 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
…d certs This commit adds full Tauri HTTP plugin support to enable the desktop app to connect to Gateway's HTTPS server with self-signed certificates. Changes: - Add tauri-plugin-http with dangerous-settings feature to Cargo.toml - Initialize HTTP plugin in Rust code (lib.rs) - Configure HTTP permissions in capabilities files - Create http.json capabilities for localhost:15888 URL scope - Update api.ts to use Tauri fetch with acceptInvalidCerts option - Update app identifier to io.hummingbot.gateway - Add comprehensive dev and production build docs to README The app now works in both dev mode (pnpm tauri dev) and production builds, with API key authentication and automatic SSL certificate acceptance. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Major improvements to the swap interface: - Redesign layout: wider card (max-w-2xl), start at top like other pages - Token selection: dropdowns with all available tokens from network - Balance display: show token balance with Max button to fill amount - Token list: reuse shared getSelectableTokenList utility (native first, no duplicates) - Quote details: display comprehensive swap info (amounts, price, slippage, route hops, quote ID) - Swap direction: clickable arrow button to reverse from/to tokens - Toast notifications: show pending (⏳), success (✅ with txHash), and error states - Auto-fetch balances when wallet/network changes Shared utility: - Create getSelectableTokenList() in utils.ts for consistent token ordering - Works for both Ethereum (ETH not in list) and Solana (SOL in list) - Update PortfolioView to use shared utility 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Move navigation from top tabs to bottom navbar for better mobile UX - Make header responsive with wallet selector positioning - Add responsive ConfigView with mobile dropdown and desktop sidebar - Make config table responsive with horizontal scrolling on small screens - Add responsive text sizes and input widths throughout - Optimize padding and spacing for mobile viewports 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Replace dropdown selectors with icon buttons on mobile (< 640px) - Add globe icon for network selection - Add wallet icon for wallet selection - Create bottom-sheet style modals for network and wallet selection - Keep full dropdowns on desktop for better UX - Change toast position from bottom-center to top-center - Maintain truncated wallet addresses in mobile modal - Add "Add Wallet" option in wallet selection modal 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Move wallet icon before network icon in mobile navbar - Change wallet icon from wallet to key icon for better clarity - Change network icon from globe to satellite icon - Maintain consistent order across mobile and desktop views 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Change network icon from satellite to satellite dish for better clarity - Rename bottom navigation from "Wallet" to "Portfolio" - Improve visual consistency and user understanding 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Create reusable NetworkStatus component - Show green/red dot based on block number status - Display current block number next to status dot - Click status to open modal with detailed chain information - Auto-fetch status when network changes - Show loading state with yellow pulsing dot - Display: chain, network, block number, RPC URL, provider, swap provider - Add refresh button to update status - Position indicator next to Gateway title in navbar 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Backend (Tauri): - Add read_app_config and write_app_config commands - Store config in app config directory (app-config.json) - Return default config if file doesn't exist Frontend: - Create app-config.ts helper library for Tauri integration - Add "app" namespace to config system - Handle "app" namespace specially (local file vs Gateway API) - Rename "Server" section to "Gateway" with "app" and "server" subsections - Update AppContext to load/save theme from app config file - Theme persists across app restarts - Config UI feels identical for both app and server configs Features: - Users can now configure app settings in Config sidebar - Theme preference stored in local JSON file - Foundation for future UI customization (colors, etc.) - Seamless UX - app config looks like server config 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
…bins data
- Change from /trading/clmm/pool-info to /connectors/{connector}/clmm/pool-info
- Meteora endpoint returns full data including bins array for chart visualization
- Add debug logging to track pool info data and bins availability
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Updated PoolBinChart component to use CSS theme variables instead of hardcoded colors, ensuring proper visibility in both light and dark modes. - Active bin: hsl(var(--accent)) - Position range: hsl(var(--primary)) - Normal bins: hsl(var(--muted-foreground)) This ensures the chart bars are visible and properly themed in both light and dark mode. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Changed x-axis from bin ID to price for better readability - Updated liquidity calculation to: price * baseAmount + quoteAmount - Removed debug console logs from pool info fetching - Updated reference line to use price instead of bin ID 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Created pool-urls.ts helper with URL generators for different DEX platforms - Added "View on DEX" button to pool info header with external link icon - Supports Meteora, Raydium, Uniswap, and PancakeSwap pool URLs - Removed debug console.log statements from chart rendering Pool URL formats: - meteora/clmm: https://app.meteora.ag/dlmm/{poolAddress} - raydium/clmm: https://raydium.io/clmm/pool/?pool_id={poolAddress} - raydium/amm: https://raydium.io/liquidity/pool/?pool_id={poolAddress} - uniswap/clmm: https://app.uniswap.org/pool/{poolAddress} - pancakeswap: https://pancakeswap.finance/liquidity/pool/{poolAddress} 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
… metadata - Replaced collapsible Add Liquidity section with shadcn Drawer component - Renamed "Add Liquidity" to "Add Position" for better UX clarity - Moved fee tier from form input to pool metadata section - Fee tier now displays in basis points automatically calculated from pool fee - Removed fee validation from Add Position button (not needed as user input) - Added drawer description showing pool pair being added to UI improvements: - Drawer provides better mobile experience than collapse - Fee tier visible at a glance in pool info - Cleaner form with only essential position parameters 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Replaced drawer component with collapsible to allow users to view the pool bin chart while adding a position. The drawer was blocking the view by fading the background. Changes: - Replaced Drawer with Collapsible component from shadcn/ui - Add Position button now expands vertically within the card - Added chevron icon that rotates when expanded/collapsed - Form stays within the Pool Info card, extending it downward - Users can now reference the bin chart while inputting position parameters UX improvements: - No background fade - chart remains visible - Smooth expand/collapse animation - Icon indicates expand/collapse state - Better integration with existing card layout 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Removed w-full class from Add Position button for better visual appearance. Button now auto-sizes to content with gap spacing between text and chevron. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Created a reusable TokenAmountInput component extracted from SwapView design: - Shows token symbol, amount input, balance, and Max button - Supports both selectable (dropdown) and fixed symbol display - Integrated into both SwapView and PoolsView for consistency Changes: - Created TokenAmountInput.tsx with configurable props - Updated SwapView to use TokenAmountInput for From/To tokens - Updated PoolsView Add Position to use TokenAmountInput - Added balance fetching in PoolsView for pool tokens - Token amounts now show balance with Max button functionality Component features: - label: Display label (e.g., "From", "SOL") - symbol: Token symbol to display - amount: Current amount value - balance: Token balance (optional, shows "Balance: X") - onAmountChange: Callback for amount changes - onSymbolChange: Callback for symbol changes (optional, enables dropdown) - availableTokens: Token list for dropdown (optional) - showMaxButton: Show/hide Max button (default: true) - disabled: Disable input (default: false) This allows for future improvements to be made once to the component and automatically applied to all usage locations. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Added a new chart that shows users how their liquidity will be distributed across bins based on their input amounts and selected price range. Features: - Appears when user enters amounts and both lower/upper prices - Filters pool bins to only show bins within user's price range - Calculates user's liquidity per bin using: price * baseAmount + quoteAmount - Distributes user's total amounts evenly across bins in range - Updates dynamically as user changes amounts or price inputs - Shows detailed tooltip with bin ID, price, and token amounts Chart details: - Smaller height (200px) to fit in Add Position form - Uses primary theme color for user's liquidity bars - Positioned above Add Position button for easy reference - Includes "Your Liquidity Distribution" heading - Tooltips show base/quote token symbols and amounts per bin This allows users to visualize exactly how their position will be structured before committing the transaction. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
…istribution Updated user liquidity chart to properly visualize the difference between base and quote token liquidity based on position relative to current price. Key changes: - Base tokens (left of current price): distributed across bins < current price - Uses primary color (purple/magenta) - Amount per bin = total base amount / number of left bins - Quote tokens (right of current price): distributed across bins >= current price - Uses accent color (cyan/blue) - Amount per bin = total quote amount / number of right bins - Current price: shown as vertical reference line instead of bar color - Dashed line labeled "Current" - Uses foreground color for visibility Liquidity calculation per bin: - Left bins: price * basePerBin + 0 - Right bins: price * 0 + quotePerBin Tooltip improvements: - Only shows base amount when > 0 (left side) - Only shows quote amount when > 0 (right side) - Shows "Current Price" indicator on active bin This accurately represents how CLMM positions work: base tokens are used for prices below current, quote tokens for prices above current. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Corrected the distribution logic: - Below current price: quote tokens (accent color) - Above current price: base tokens (primary color) Distribution: - quotePerBin = userQuoteAmount / number of bins below current price - basePerBin = userBaseAmount / number of bins above current price Liquidity calculation per bin: - Below current: price * 0 + quotePerBin - Above current: price * basePerBin + 0 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Increased top margin in both charts to provide more vertical space for the current price reference line label. Changes: - PoolBinChart: increased top margin from 10px to 20px - UserLiquidityChart: increased top margin from 10px to 20px - PoolBinChart: updated reference line to use foreground color and "Current" label - Changed from chart-2 color to foreground for better visibility - Changed label from "Active" to "Current" for consistency with user chart - Maintains dashed line style Both charts now consistently show the current price as a vertical dashed line labeled "Current" with adequate space above the bars for the label. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Add Collect Fees and Close Position buttons to LiquidityPositionCard - Add confirmation dialogs for all position operations (Add, Collect Fees, Close) - Add Trading API namespace with collectFees and closePosition methods - Replace position card layout with step area chart visualization - Quote liquidity shown in accent color (left of current price) - Base liquidity shown in primary color (right of current price) - Current price marked with vertical reference line - Always display unclaimed fees section (even when 0) - Re-apply PR #555 fix for Meteora InvalidPositionWidth error handling 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Add unified price adjustment buttons (+/- 1%, 10%, 20%, 50%) that adjust both min and max prices - Rename Lower/Upper Price to Min/Max Price for clarity - Add AddPoolModal for adding liquidity pools - Add TokenDetailsModal for viewing token information - Improve TokenAmountInput with combobox for token selection - Add "Hide Zero Balances" checkbox to Portfolio view - Add Pool button to liquidity sidebar - Replace current price label with actual price value in PoolBinChart - Add shadcn/ui components: checkbox, command, popover, alert-dialog - Move Add Token button to bottom of tokens table with Plus icon - Clean up console.error statements - Update ConfirmModal usage across components 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Replace Max button with clickable balance link in TokenAmountInput - Use theme-aligned primary color for clickable balance - Remove showMaxButton prop from TokenAmountInput interface - Update PoolsView and SwapView to remove showMaxButton usage - Rename "Liquidity" tab to "Pools" - Rename "Activity" tab to "Transactions" 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Add URL-based routing with react-router-dom - Routes for /portfolio, /swap, /pools/:address, /transactions/:signature, /config/:namespace - Enable deep linking and shareable URLs - Update bottom navigation to use NavLink with active states - Improve pool view layout - Restructure pool header with badges below title - Move connector info to subtitle - Add zoom in/out controls to liquidity distribution chart - Convert Add Position to collapsible card - Hide "Your Positions" card when no positions exist - Clear form fields when switching pools - Fix rounded borders on hover - Hide y-axis from liquidity charts - Replace "Current" label with actual price in user liquidity chart - Make portfolio token rows fully clickable 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Only show positions that match the currently selected pool's address. This prevents positions from other pools from appearing when viewing a specific pool. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Add position width display below user liquidity chart - Update position width label from "+/-" to "Position Width" - Adjust position width calculation to be halved (total range vs per side) - Match pool chart colors to user chart (accent below, primary above price) - Increase spacing for Price label on x-axis (offset: -10) - Add padding around position width percentage display 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Created THEMES.json with theme definitions (solana-purple, ethereum-blue) - Created config/app.json with chain-to-theme mappings - Updated AppConfig interface to support theme.chains configuration - Implemented automatic theme switching when selectedChain changes - Theme colors apply dynamically via useEffect watching selectedChain - Maintains original color scheme as default themes 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Added 11 distinct themes with vibrant, carefully crafted color palettes - Includes default-slate, solana-purple, ethereum-blue, and 8 more themes - Each theme features complementary primary/accent color pairs - Designed to work beautifully in both light and dark modes 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Hide theme.colors.* fields from config view (managed automatically) - Add Select dropdown for theme.chains.solana and theme.chains.ethereum - Load available themes from THEMES.json dynamically - Display theme names (e.g., "Solana Purple", "Ethereum Blue") in dropdowns - Users can now change which theme applies to each blockchain - Cleaner UX: no manual hex color editing, just theme selection 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- When user changes theme.chains.* dropdown, colors update instantly - Fetch theme colors from THEMES.json and apply via applyTheme() - No page reload needed - immediate visual feedback - Theme persists in app config for future sessions 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Solana: vibrant purple (#9945FF) with cyan accent (#14F195) - Ethereum: cyan blue with purple accent from logo gradient - Colors extracted from official foundation logos - More authentic blockchain branding 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Updated ethereum-blue theme accent colors - Uses green/teal from official Ethereum Foundation logo - Applied to both light mode (accent) and dark mode (accentDark) - HSL values: 162 63% 41% and 162 63% 31% 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Updated default-slate theme accentDark for better visibility (17.5% → 60%) - Fixed all themes with dark accent colors (increased lightness to 50%+): - ethereum-blue: accentDark 31% → 55% - ocean-breeze: primaryDark 29% → 50%, accentDark 46% → 56% - sunset-orange: primaryDark 43% → 53%, accentDark 37% → 57% - forest-green: primaryDark 35% → 55%, accentDark 29% → 55% - royal-purple: primaryDark 41% → 51%, accentDark 32% → 58% - crimson-red: primaryDark 37% → 57% - cyber-teal: primaryDark 30% → 50%, accentDark 40% → 50% - Right-aligned theme Select dropdowns in config table - Only apply theme changes when matching currently selected chain 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Added darkMode as dependency to chain theme effect - Ensures correct theme colors (primary/accent vs primaryDark/accentDark) are applied when toggling between light and dark mode - Theme now properly reflects the current chain's colors in both modes 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
…esolution - Updated LiquidityPositionCard header to show price range prominently - Moved position address link to same line as price range - Improved chart X-axis to show min/max price ticks with proper spacing - Enhanced tooltip to show context-aware labels (Min Price/Max Price) - Fixed tooltip to display actual token amounts with symbols - Added getTokenSymbol helper to handle wrapped native tokens (WSOL) - Updated PortfolioView to use token symbol helper for better resolution - Passed baseSymbol and quoteSymbol props to position cards 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Improved swap card design: - Redesigned TokenAmountInput to place token selector inline with amount input - Increased overall interface sizing (max-w-3xl card, text-2xl input, h-12 components) - Enhanced spacing and visual hierarchy throughout swap interface - Added styled container with background and border for input areas - Moved balance/label to separate row above input for cleaner layout Removed number input spinners: - Added CSS classes to hide up/down arrows on all number inputs - Applied to swap interface amount inputs - Applied to add position min/max price inputs - Uses [appearance:textfield] and webkit pseudo-element selectors 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Changed address link to use normal font weight with hover effect - Shows primary color on hover instead of always displaying it - Added smooth transition-colors effect - Matches styling pattern used in LiquidityPositionCard 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
- Add theme.chains.solana and theme.chains.ethereum to app-config.json - Set default darkMode to false - Add THEMES.json with 5 theme options (Solana Purple, Sunset Orange, Ethereum Blue, Forest Green, Ruby Red) - Copy THEMES.json to public/ directory for app access 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Before submitting this PR, please make sure:
A description of the changes proposed in the pull request:
Tests performed by the developer:
Tips for QA testing: