# Portal Frontend

The Container Mom portal frontend is a React application that provides the user interface for managing container deployments.

## Key Features

- User authentication via Auth0
- Role-based access control (admin vs regular users)
- Deployment management (create, edit, delete)
- Multiple view modes (card and list views)
- Region selection with admin-only test region
- Environment variable management
- Deployment status monitoring
- Log viewing

## Architecture

### Components

- **Deployments**: Main component handling deployment listing and management
- **DeploymentCard**: Card view for individual deployments
- **NewDeploymentForm**: Form for creating/editing deployments
- **CredentialsForm**: Handles Git/container registry credentials

### State Management

- Uses React hooks for local state management
- Cookies for persisting user preferences
- Auth0 for authentication state

### Authentication

- Integrated with Auth0 for user authentication
- Role-based access using Auth0 roles
- Admin features gated behind role checks

## Configuration

Key configuration is managed through `auth0-config.js`:

```javascript
export const auth0Config = {
  domain: "your-domain.auth0.com",
  clientId: "your-client-id",
  audience: "https://container-mom.com/api",
  scope: "openid profile email",
  useRefreshTokens: true,
  cacheLocation: "localstorage"
};
```

## Admin Features

- Access to test region for deployments
- Admin badge indicating admin status
- Additional deployment capabilities
- Role-based UI adaptations