Windsurf setup

# Wallbit API Development Rules

## API Context

Wallbit is a global neobank and the world's first to offer a public API for programmatic account control. We offer US accounts, investments in ETFs, stocks and bonds, and local currency rails.

The Public API enables:
- Account balance queries (checking and investments)
- Transaction history
- Trading (stocks, ETFs, bonds)
- Bank account details (ACH/SEPA)
- Crypto wallet management

Base URL: `https://api.wallbit.io`

## Authentication

All requests require `X-API-Key` header:

```javascript
const headers = { 'X-API-Key': process.env.WALLBIT_API_KEY };
```

## Endpoints Reference

### Balance
- `GET /api/public/v1/balance/checking` - USD/EUR balances
- `GET /api/public/v1/balance/stocks` - Stock portfolio

### Transactions  
- `GET /api/public/v1/transactions` - History with filters
  - Query params: page, limit, status, type, currency, from_date, to_date

### Trades
- `POST /api/public/v1/trades` - Buy/sell stocks
  - Body: symbol, direction, currency, order_type, amount OR shares

### Account
- `GET /api/public/v1/account-details` - Bank details (ACH/SEPA)
- `GET /api/public/v1/wallets` - Crypto addresses

### Assets
- `GET /api/public/v1/assets` - List stocks/ETFs
- `GET /api/public/v1/assets/{symbol}` - Asset info

### Operations
- `POST /api/public/v1/operations/internal` - Transfer between accounts

## Code Standards

- Always use environment variables for API keys
- Implement error handling for all status codes
- Add TypeScript types for API responses
- Use async/await, not callbacks
- Implement rate limit handling (429 responses)

## Example Patterns

### Fetching data
```javascript
async function getBalance() {
  const response = await fetch('https://api.wallbit.io/api/public/v1/balance/checking', {
    headers: { 'X-API-Key': process.env.WALLBIT_API_KEY }
  });
  if (!response.ok) throw new Error(`API Error: ${response.status}`);
  return response.json();
}
```

### Executing trades
```javascript
async function buyStock(symbol, amount) {
  const response = await fetch('https://api.wallbit.io/api/public/v1/trades', {
    method: 'POST',
    headers: {
      'X-API-Key': process.env.WALLBIT_API_KEY,
      'Content-Type': 'application/json'
    },
    body: JSON.stringify({
      symbol,
      direction: 'BUY',
      currency: 'USD',
      order_type: 'MARKET',
      amount
    })
  });
  return response.json();
}
```

## Error Handling

Handle these status codes:
- `401` - Check API key is valid
- `403` - Check API key permissions
- `412` - User needs to complete KYC
- `422` - Validate request parameters
- `429` - Implement backoff and retry

Create a comprehensive React dashboard for Wallbit account management with the following features:

1. Balance Overview:
   - Fetch checking balances (GET /api/public/v1/balance/checking)
   - Display in cards showing currency and amount
   - Auto-refresh every 30 seconds

2. Investment Portfolio:
   - Fetch stock portfolio (GET /api/public/v1/balance/stocks)
   - Show positions table: symbol, shares, current price, value, gain/loss percentage
   - Calculate total portfolio value and day change
   - Visual chart showing asset allocation

3. Transaction Feed:
   - Fetch recent transactions (GET /api/public/v1/transactions)
   - Display with filters: status, type, currency, date range
   - Real-time updates
   - Export to CSV functionality

4. Asset Search:
   - Browse available assets (GET /api/public/v1/assets)
   - Search by symbol or name
   - Click to view details (GET /api/public/v1/assets/{symbol})

5. Trade Interface:
   - Execute trades (POST /api/public/v1/trades)
   - Form with validation
   - Preview order before submission
   - Show execution status

6. Account Details:
   - Display bank account info (GET /api/public/v1/account-details)
   - Show ACH/SEPA details for deposits

Use Wallbit API base: https://api.wallbit.io
Auth header: X-API-Key from WALLBIT_API_KEY env var

Build with Next.js, TypeScript, Tailwind CSS, shadcn/ui. Include error handling, loading states, toast notifications, and responsive design.