Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
340 changes: 41 additions & 299 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,332 +1,74 @@
# Winbit App (Portal inversores) — winbit-app
# winbit-app (Portal de clientes)

Portal para inversores (React + Vite + Firebase Auth) conectado a la API de `winbit-rails`.
Portal de inversores en React conectado a la API publica de `winbit-rails`.

## Features
- 🔐 Google Sign-In (Firebase Auth)
- 📊 Dashboard (saldo + resultado estrategia YTD e histórico)
- 💰 Depósitos (direcciones)
- 📤 Retiros (solicitudes)
- 🧾 Historial + Operativa (detalle diario de resultados operativos)
- 📱 PWA
## Stack

## Tech Stack
- React 18 + Vite
- Tailwind CSS
- Firebase Auth (Google)
- React Query
- Vitest + React Testing Library

- **Frontend:** React 18 + Vite
- **Styling:** Tailwind CSS
- **Authentication:** Firebase Auth (Google Sign-In)
- **Data Source:** Winbit Rails API (PostgreSQL)
- **Hosting:** Firebase Hosting
- **Email:** EmailJS
- **Testing:** Vitest + React Testing Library
## URLs

## Fórmulas / finanzas
La explicación de balances y retornos vive en:
- `../FORMULAS.md`
- Local: `http://localhost:5173`
- Produccion: `https://winbit-6579c.web.app`
- API backend: `https://winbit-rails-55a941b2fe50.herokuapp.com`

## Language

- Default language: **Español**
- Language switcher: **Header (top-right)** (Spanish / English)
- Language preference: stored in localStorage
- Translation system: `react-i18next`

## Number Format (Argentine Standard)

The app uses Argentine number formatting:

- **Thousands separator:** Point (`.`) - Example: `15.226`
- **Decimal separator:** Comma (`,`) - Example: `15.226,00`
- **Currency format:** `$15.226,00` (no space between $ and number)
- **Percentage format:** `+1,50%` (always show sign for positive values)
- **Return values:** Show `+` sign for positive results (except portfolio value)
- **Zero values:** No sign for zero (`$0,00`, `0,00%`)

### Examples:
- Portfolio value: `$15.226,50` (no sign)
- Positive returns: `+$1.500,75` and `+1,50%`
- Negative returns: `-$500,25` and `-2,30%`
- Zero: `$0,00` and `0,00%`

## Prerequisites

- Node.js 18+ and npm
- Firebase project with Authentication and Hosting enabled
- Winbit Rails backend running (see ../winbit-rails/README.md)
- EmailJS account for email notifications

## Setup

### 1) Install
## Setup local

```bash
git clone <repository-url>
cd winbit-app
npm install
```

### 2. Environment Variables

Create a `.env` file in the root directory:
Crear `.env`:

```bash
# Firebase Configuration (para autenticación con Google)
VITE_FIREBASE_API_KEY=your_firebase_api_key
VITE_FIREBASE_AUTH_DOMAIN=your_project.firebaseapp.com
VITE_FIREBASE_PROJECT_ID=your_project_id
VITE_FIREBASE_STORAGE_BUCKET=your_project.firebasestorage.app
VITE_FIREBASE_MESSAGING_SENDER_ID=your_sender_id
VITE_FIREBASE_APP_ID=your_app_id

# Winbit Rails API URL
# Desarrollo local: http://localhost:3000
# Producción: https://winbit-rails-55a941b2fe50.herokuapp.com
VITE_API_URL=http://localhost:3000

# EmailJS Configuration
VITE_EMAILJS_SERVICE_ID=your_emailjs_service_id
VITE_EMAILJS_TEMPLATE_ID_WITHDRAWAL=your_withdrawal_template_id
VITE_EMAILJS_TEMPLATE_ID_DEPOSIT=your_deposit_template_id
VITE_EMAILJS_PUBLIC_KEY=your_emailjs_public_key
```

### (Removido) Google Sheet
Este portal ya no usa Google Sheets como fuente de datos: consume la API de `winbit-rails`.

### 4. Configure Wallets

Edit `src/config/wallets.js` with your wallet addresses:

```javascript
export const WALLETS = [
{
network: 'USDT (TRC20)',
address: 'your_usdt_trc20_address',
icon: '₮',
},
{
network: 'USDC (TRC20)',
address: 'your_usdc_trc20_address',
icon: '$',
},
// Pending: final list of supported networks + addresses
];
VITE_FIREBASE_API_KEY=...
VITE_FIREBASE_AUTH_DOMAIN=...
VITE_FIREBASE_PROJECT_ID=...
VITE_FIREBASE_STORAGE_BUCKET=...
VITE_FIREBASE_MESSAGING_SENDER_ID=...
VITE_FIREBASE_APP_ID=...
VITE_EMAILJS_SERVICE_ID=...
VITE_EMAILJS_TEMPLATE_ID_WITHDRAWAL=...
VITE_EMAILJS_TEMPLATE_ID_DEPOSIT=...
VITE_EMAILJS_PUBLIC_KEY=...
```

## Development
## Desarrollo

```bash
# Start development server
npm run dev

# Run tests
npm run test

# Run tests with coverage
npm run test:coverage

# Run tests with coverage
npm run test:coverage

# Run tests in watch mode
npm run test:watch

# Build for production
npm run build

# Preview production build
npm run preview
```

## Notas
- El dashboard muestra **resultado estrategia (TWR)** como métrica principal.

## Deployment

### Environment Variables

#### Development (`.env`)

```bash
VITE_API_URL=http://localhost:3000
VITE_FIREBASE_API_KEY=xxx
VITE_FIREBASE_AUTH_DOMAIN=xxx
# ... other Firebase config
```

#### Production (`.env.production`)

> **⚠️ IMPORTANTE**: Este archivo NO está en git. Debes crearlo manualmente.

```bash
# Rails API URL - Heroku production
VITE_API_URL=https://winbit-rails-55a941b2fe50.herokuapp.com

# Firebase config (same as development)
VITE_FIREBASE_API_KEY=xxx
VITE_FIREBASE_AUTH_DOMAIN=xxx
# ... other Firebase config
```

Ver `.env.production.example` para referencia completa.

### Firebase Hosting

**URL de producción:** https://winbit-6579c.web.app

1. Install Firebase CLI (si no lo tienes):
## Tests y calidad

```bash
npm install -g firebase-tools
```

2. Login to Firebase:

```bash
firebase login
```

3. Build y deploy:

```bash
# Asegúrate de tener .env.production configurado
npm run build # Usa .env.production automáticamente
firebase deploy # Deploy a Firebase Hosting
```

### CORS Configuration

El backend Rails debe permitir el origen de Firebase Hosting. Esto ya está configurado en Heroku:

```bash
# Variable de entorno en Heroku
CORS_ORIGINS=http://localhost:5173,https://winbit-6579c.web.app,https://winbit-6579c.firebaseapp.com
npm run lint
npm run format:check
npm run test:ci
npm run build
```

Si necesitas agregar otro dominio:
## Deploy

```bash
heroku config:set CORS_ORIGINS="existing_origins,new_origin" -a winbit-rails
```

## Project Structure

```
src/
├── components/
│ ├── ui/ # Reusable UI components
│ ├── layout/ # Layout components
│ └── features/ # Feature-specific components
│ ├── auth/ # Authentication
│ ├── dashboard/ # Dashboard features
│ ├── wallets/ # Wallet management
│ └── requests/ # Withdrawal/Deposit forms
├── hooks/ # Custom React hooks
├── services/ # API services
├── utils/ # Helper functions
├── pages/ # Page components
├── config/ # Configuration files
├── test/ # Test setup
├── App.jsx
└── main.jsx
npm run build
firebase deploy
```

## Business Rules

### Portfolio Updates

- Portfolio updates are processed once per business day after the operational close
- Historical data available from investor's signup date

### Processing Hours

- Requests are received until **17:00 (GMT-3)** and executed at **18:00 (GMT-3)**.
- Requests submitted after **17:00 (GMT-3)** are processed the next day.

## Pending Definitions (Data / Sheet)

To finish the dashboard and history, we need the Google Sheet to explicitly define where these values come from:

- Dashboard metrics:
- Current portfolio value (USD)
- Total return since inception (USD)
- Total return since inception (%)
- Annual return (USD)
- Annual return (%)
- History table:
- Date, Movement type, Amount, Previous balance, New balance, Status
- Whether history is a single sheet with an `email` column or per-investor tabs
- Status values (e.g. Pending / Completed / Rejected)

### Security

- Only authenticated users with Google Sign-In
- User email must exist in Winbit Rails database as an active investor
- Firebase Auth validates authentication
- Rails API validates investor status before returning data

## Browser Support

- Chrome/Edge (latest)
- Firefox (latest)
- Safari (latest)
- Mobile browsers (iOS Safari, Chrome Mobile)

## PWA Installation

Users can install Winbit as a native app:

1. Visit the app in a supported browser
2. Look for "Install" or "Add to Home Screen" prompt
3. Follow browser-specific installation steps

## Troubleshooting

### User not found error

- Ensure user's email exists in the Winbit Rails database as an investor
- Check that investor status is 'ACTIVE'
- Contact winbit.cfds@gmail.com to register as an investor

### API connection errors

- Verify Rails backend is running at the correct URL
- Check that VITE_API_URL is configured correctly
- Ensure investor exists and is active in the database

### CORS errors in production

If you see `No 'Access-Control-Allow-Origin' header` errors:

1. Verify CORS_ORIGINS is set in Heroku:
```bash
heroku config:get CORS_ORIGINS -a winbit-rails
```
2. Should include: `https://winbit-6579c.web.app,https://winbit-6579c.firebaseapp.com`
3. Update if needed:
```bash
heroku config:set CORS_ORIGINS="http://localhost:5173,https://winbit-6579c.web.app,https://winbit-6579c.firebaseapp.com" -a winbit-rails
```

### Firebase Auth errors (Invalid API Key)

If you see `auth/api-key-not-valid` errors:

1. Verify the API key in `.env.production` matches your Firebase project
2. Check API key restrictions in Google Cloud Console
3. Ensure the key has "Identity Toolkit API" enabled
4. Verify authorized domains in Firebase Console include your hosting domain

### Cross-Origin-Opener-Policy warnings

Warnings like `COOP policy would block the window.closed call` are **normal** and don't affect functionality. These appear due to security headers in `firebase.json` and can be safely ignored.
`npm run build` usa `.env.production`.

### Email notifications not working
## Reglas funcionales

- Verify EmailJS credentials are correct
- Check EmailJS service is active
- Confirm email templates are published
- Formato monetario argentino manual (`$XX.XXX,XX`), no `toLocaleString`.
- Eventos internos en ingles (`DEPOSIT`, `WITHDRAWAL`, etc.), siempre traducidos en UI.
- El usuario debe existir como inversor activo en backend para acceder.

## License
## Documentacion

Private - All rights reserved © 2024 Winbit
- Convenciones del repo: `AGENTS.md`
- Formulas financieras: `../winbit-rails/FORMULAS.md`