Improve NethVoice installation flow

[AmaLuci]

Problem statement

Admins need a way to clearly understand the prerequisites and installation order for NethVoice and Proxy NethVoice, because missing steps (like configuring the account provider first or installing the proxy before NethVoice) lead to confusion, misconfigurations, and an increased number of support tickets.

Problem description

System administrators experience confusion when installing NethVoice because:

• They don’t know they also need to install NethVoice Proxy
• They are unaware that the account provider (one or more) the want to use (or users in a domain) must be set up beforehand

This happens during the application installation and configuration flow and leads to:

• Support tickets that could be avoided
• Longer time-to-configuration
• A frustrating onboarding experience

Goal

• Provide admins with a guided, step-based installation flow for NethVoice that clarifies prerequisites upfront
• Reduce the number of incomplete or misordered installations
• Improve the self-service experience, so admins can succeed without opening a support ticket

Metrics for success

• Reduction in support tickets related to NethVoice installation prerequisites
• Increased completion rate of NethVoice installations without errors (support tickets)

UX / Design spec — NethVoice guided setup

Flow (multi-step modal)

1. Account provider
2. NethVoice Proxy
3. NethVoice Application

Step 1 — Account provider

Options (RadioButtonGroup)

1. Use an existing account provider

   • When selected, show Dropdown Account provider with existing domains (label: domain + type, e.g., mydomain.com (Internal OpenLDAP)).
   • If no providers exist: disable option or other tbd

2. Create an OpenLDAP account provider on node [name]

   • Selecting this option inserts a new sub-step (Step 1B) before Step 2.

Step 1B (conditional) — OpenLDAP setup

Fields:

• Domain (required)
• Administrator username (required)
• OpenLDAP admin password (required)
• Confirm password (required)

On Next: configure the provider, then continue to Step 2.

Validation

• Domain must be a valid FQDN → error: Enter a valid domain (e.g., directory.example.com).
• Passwords must match → error: Passwords do not match.
• Minimum password length 8 chars → error: Use at least 8 characters.

Interstitial (conditional) — Proxy missing on this node

If the selected node does not have a Proxy installed, show an interstitial screen after Step 1:

Empty state

• Title: Proxy missing on this node
• Body: NethVoice App requires a NethVoice Proxy on the same node.
• Primary CTA: Install and continue (starts Proxy install on this node)

After clicking the CTA, show Loading overlay: Installing NethVoice Proxy…
On success, automatically advance to Step 2.

Step 2 — NethVoice Proxy (configure)

Fields:

• Proxy domain (TextInput)
• Network interface (Dropdown)
• Public IP address (TextInput)

Inline notification (InlineNotification, kind info, persistent)

Step 3 — NethVoice Application (configure)

Fields:

• NethVoice base host (TextInput)
• NethVoice CTI base host (TextInput)
• Timezone (Dropdown, default prefilled to UTC)
• Admin password to access user interface (Password Input + Confirm)
• Let’s Encrypt request (Toggle, default ON)

Completion — Status section of NethVoice app

Add the following UI on the Status tab after the wizard completes:

Cards

1. NethVoice Proxy — show Proxy name (domain) and a link to Proxy settings.
2. Account provider — show provider name and type, with link to Users and Domains.

Services card (single card replacing the current layout)

• Empty state (all OK):
  Title: All services running, all good
• Error list (any issue):
  Show a concise list of problematic services, e.g.,
  NethVoice CTI server is not running
  Each row links to the relevant troubleshooting/view if available

Interaction rules & states

• Navigation:

  • Next disabled until the current step is valid.
  • Previous returns to the prior step keeping entered values if possible (cannot uninstall proxy)

• Errors: Inline field errors under the input; step-level errors at top.

• Loading: Use existent Loading animation with gears and loader during provider creation, Proxy installation and app configuration.

[AmaLuci]

Mockups ready in Figma here

Mockup flows
Complete and flawless flow of NethVoice configuration
Resume installation flow
Validation errors and new progress indicator in Modal component
Create a new account provider (in the flow)
Create a new account provider (from empty state)
Create a proxy (in the flow)
Proxy already configured on this node
Status page with and without errors