Dashboard

React application with light, dark, and system themes (follows OS settings without reload), fixed sidebar, live data refresh, and a two-column login page (layout like PyOrchestrator, custom background).

Navigation

Sections marked admin are available only to Administrator (manage_users or view_logs in JWT).
Profile — link in the header (/profile). Setup wizard — /setup (on first login or ?restart=1).

Built-in help (v1.1.22, placement v1.1.28)

Breadcrumbs (v1.1.22)

Above page content — menu group → section (same labels as the sidebar).

The group is not a link; intermediate sections (e.g. Posts on post detail) are clickable.

Resources (sidebar)

More about embedded platforms: Embedded services.

Interface language (v1.1.13+)

i18n file layout (v1.1.37+)

Core strings live in dashboard/src/i18n/messages/{en,ru}.ts. Feature-specific catalogs are split out:

See i18n README in the repository.

Notifications (v1.1.14, pagination v1.1.52)

The Notifications page and Overview widget display localized message templates by event type (mqtt_credit, user_login, wash_created, etc.), not the raw text stored when the record was created. Parameters (amount, login, entity name) are parsed from legacy messages. Severity labels and CSV export follow the active UI language.

Full notifications page (/notifications) — v1.1.52

Same server-side pagination pattern as the MQTT log:

Overview widget remains a compact preview (10 rows, separate from the full page).

Software updates & modules (v1.1.34)

Additional event types (EN/RU templates in notifications-features.{en,ru}.ts):

• Software updates — job started, completed, failed (CRM, Dynamic API, PyOrchestrator)
• Modules — install, uninstall, start, stop, update, errors

Configure web and Telegram channels on Overview or Notifications.

Live mode

Operational data refreshes automatically (usePolling). Header shows a live-mode indicator.

On the Current status page, mode time ticks in real time (LiveModeTimer).

Tables (DataTable)

All main CRM tables use the shared DataTable component with unified pagination.

Features

• search across text fields;
• sort by clicking column headers;
• filters (dropdowns);
• visible column selection (table settings icon);
• pagination (see below);
• bulk actions (CSV export, delete — where available).

Pagination (v1.1.5+)

In the footer of each table:

Footer label: N rows · page X of Y · loaded M — when more rows exist in the current dataset.

Changing page size, search, or filters resets to page 1.

Large logs (server-side Load more)

Pages with very large data volumes use server-side pagination (button above the table). DataTable footer pagination (20–100 rows) applies only to already loaded rows — no second «Load more» in the footer on these pages.

Recent notifications widget on Overview — compact preview (10 rows by default).

Sections in detail

Overview (/)

KPI cards before collection: cash / cashless / total revenue / discount total / active errors.

Finance and usage totals — sum of the latest record per post (not all historical rows).

Charts (Recharts): post status, pie charts for "Usage" (clients / service / VIP) and payment shares (cash / cashless / discounts), revenue by date, workload by date (v1.1.15). Recent notifications table.

Car washes (/washes)

Site reference: name, description, address, creation date, cloud, UUID (mapsExternalId) for external maps. "Post count" column.

UUID (mapsExternalId): assigned automatically on create (and by init-seed for existing washes missing the field). The Washes Nearby module sends it to the Washes Nearby site as Owner API external_id, so the platform identifies the wash without CRM Mongo ids or the site’s numeric id.

Posts (/posts)

Posts linked to a car wash: online/offline status, number, name, serial number, MQTT login, site. Cascade delete of related data.

Actions column — ⚙ icon (device settings) → post page. On create/edit — MQTT login and password for the post panel.

Online — if lastMessageAt is not older than 30 seconds (same as Overview).

Post card (/posts/:id)

Anchor #device-settings scrolls to the device settings block.

Current status (/states)

All posts across all sites. Status column (online/offline), status filter.

Interactive chart full width (Recharts): metric switching (mode time / balance / free pause), tooltip with details, brush for many posts, live mode time refresh.

Table: address, post number, balance, pause, discount, live mode timer, mode name, last message date.

Information (/system) — v1.1.16, v1.1.22

Platform status page in the System group (Information menu item). Not to be confused with Publications under Automation.

Live refresh every 30 s (GET /api/dashboard/system via Dynamic API).

Integrity and repair (/settings) — v1.1.21

Section in Settings (before Software updates). Administrators only (manage_users / manage_api).

DATA_DIR (v1.1.19+): absolute host paths (/mnt/hdd/data, /var/lib/wash-pro-crm) are valid; warning only when DATA_DIR is inside /deploy.

Git (v1.1.21+): /deploy is a project bind mount; check registers git safe.directory (dubious ownership). Without .git on the host, auto-update is unavailable.

API: GET/POST /api/crm/updates/repair (update-bridge).

Software updates (/settings#updates) — v1.1.20

Software updates section in Settings and header banner. Administrators only.

CRM pull step (v1.1.20+): git fetch + git reset --hard origin/main — resets tracked files only; preserves .env, DATA_DIR, docker-compose.override.yml, local/.

Build (v1.1.20+): scripts/compose-files.sh — same -f flags as scripts/start.sh (override, Redis, PyOrchestrator).

v1.1.18+ behavior: page load and job progress polling do not call GitHub — cache only. GITHUB_TOKEN in .env is optional (release notes, API quota).

v1.1.50+: banner no longer spins on a stale queued job when the target version is already installed; update-bridge auto-closes such jobs and runs the next queued update.

v1.1.51+: before starting a new update, update-bridge reconciles a stale active job (same repair logic as integrity check).

State: DATA_DIR/update-bridge/state.json. API: GET /api/crm/updates/status, POST /api/crm/updates/check, POST /api/crm/updates/apply/{component}.

Cards (/cards)

Application log: each NFC event (state/card from post) creates a new row. Active session updates from state/process data (balance, discount).

Discount type — number 1–5 from reference. Statuses: success, rejected. Collection (cardType: collection on device) — CRM notification, no row in the cards section.

Analytics (/usage, /finance, /archive)

• Usage — before/after collection, categories regular/service/unlimited.
• Finances — cash, cashless, discount, revenue.
• Archiving — policies by data group (including MQTT telemetry retention), operation log with Result column, scanned count, clear zero-record display, manual telemetry purge (v1.1.49).

System and automation

Navigation stability (v1.1.12)

• retry loading JS chunks on network failure (lazyPage);
• RouteErrorBoundary instead of gray screen;
• polling timeout 60 s; on Overview — error message instead of endless Loading.

Header toggles (v1.1.14)

• language switcher — single icon with the current locale flag (all screen sizes);
• Live/Static — single icon (radio / pause) on all screen sizes.

Dialogs and feedback (v1.1.44)

• Toast — success/error/info messages (bottom-right), auto-dismiss
• Confirm modal — destructive actions (delete user/group, backup, updates, integrity fixes) use in-app dialog instead of browser confirm

In-app help (v1.1.44)

Help sidebar includes Setup wizard, Welcome, and Profile sections. Link to full documentation on GitHub Pages (locale-aware).

Login page (/login)

Two-column layout (like PyOrchestrator): branding with SVG background (waves/SCADA) on the left, form on the right. Product name and tagline come from Settings → Branding (v1.1.44). Theme switcher in the top-right corner. Auto JWT refresh; on session expiry — redirect to /login.

User roles

User management: Dashboard → Users / Groups & permissions or Dynamic API Panel → Users / Groups.

Dashboard proxy (nginx)

Demo data

./scripts/generate-demo-data.sh
./scripts/generate-demo-cards.sh

Build

cd dashboard && npm install && npm run dev    # :5173
npm run build                                  # dist/ → Docker

Technologies

React 18 · TypeScript · Vite · Tailwind · Lucide · Recharts · usePolling / LiveModeContext