# Calypso Frontend

React + Vite + TypeScript frontend for AtlasOS - Calypso backup appliance.

## Prerequisites

- Node.js 18+ and npm
- Backend API running on `http://localhost:8080`

## Setup

1. Install dependencies:
```bash
npm install
```

2. Start development server:
```bash
npm run dev
```

The frontend will be available at `http://localhost:3000`

## Build

```bash
npm run build
```

The production build will be in the `dist/` directory.

## Project Structure

- `src/api/` - API client and queries
- `src/components/` - Reusable UI components
- `src/pages/` - Page components
- `src/store/` - Zustand state management
- `src/types/` - TypeScript type definitions
- `src/utils/` - Utility functions

## Features

- ✅ React 18 with TypeScript
- ✅ Vite for fast development
- ✅ TailwindCSS for styling
- ✅ TanStack Query for data fetching
- ✅ React Router for navigation
- ✅ Zustand for state management
- ✅ Axios for HTTP requests
- ⏳ WebSocket for real-time events (coming soon)
- ⏳ shadcn/ui components (coming soon)

## Development

The Vite dev server is configured to proxy API requests to the backend:

- `/api/*` → `http://localhost:8080/api/*`
- `/ws/*` → `ws://localhost:8080/ws/*`

## Next Steps

1. Install shadcn/ui components
2. Implement WebSocket client
3. Build out all page components
4. Add charts and visualizations
5. Implement real-time updates