User Guide Web App

User Guide - Web App

This page explains end-user workflows in the React frontend.

When To Use This Page

Use this page for account, charger, favorites, and anomaly workflows in the UI.

Audience

• Platform users and operators interacting with the web app.

Main Routes

Route	Purpose	Access
/register	Create account	Public
/verify	Email verification	Public
/login	Sign in	Public
/forgot-password	Request password reset	Public
/reset-password	Set new password with token	Public
/	Charger overview dashboard	Authenticated
/details/:chargerId	Telemetry detail for one charger	Authenticated
/monitoring/:chargerId	Start/stop monitoring workloads	Authenticated
/favorites	Favorite chargers list	Authenticated
/anomalies	Recent anomaly events	Authenticated
/account	User profile/account actions	Authenticated

Compatibility note: some historical references may still mention /favourites; use /favorites in current docs.

Authentication Workflow

1. Register with email and password.
2. Verify account via email link.
3. Log in and receive bearer token.
4. Token is attached to API calls by frontend API client.

If verification mail is not visible in local mode, check Mailpit at http://localhost:8025.

Charger and Telemetry Workflow

1. Open / to list chargers.
2. Select charger to open /details/:chargerId.
3. Select telemetry type and time range.
4. UI fetches telemetry and renders charts/tables.

Favorites Workflow

1. Add/remove favorite from charger views.
2. Open /favorites to manage favorite list.
3. Favorites are user-scoped.

Anomaly Workflow

1. Open /anomalies.
2. Filter by charger and telemetry type.
3. Jump from anomaly entries back to charger details/monitoring context.

Expected Errors And Operator Actions

UI Message Pattern	Typical Cause	Action
Login failed / unauthorized	invalid credentials or unverified account	verify email, retry login
No chargers found	no data ingested yet	validate source MQTT or simulator path
Telemetry request failed	API/DB latency or outage	check gateway/TACTIC/DB health
Monitoring start failed	invalid model config or orchestration failure	validate model params, inspect TACTIC logs

Related Pages

• User Guide - Monitoring
• Backend API Guide
• Testing & Debugging