UI for NethVoice Settings Redesign

[andre8244]

Proposed Feature
Develop a new user interface (UI) for the NethVoice Settings page, implementing a clear separation and modularization of different configuration sections, as outlined in the parent issue. The goal is to enhance usability, maintainability, and alignment with modern NethServer UX standards.

Purpose and Motivation
The current UI for NethVoice Settings is confusing due to unrelated configurations being grouped together, which affects both user experience and future scalability. By modularizing and visually separating configuration sections (e.g., base configuration, advanced modules like NethHotel, and sensitive actions such as password changes), the UI will become easier to use and extend.

Proposed Solution

• Divide the Settings page into distinct menu sections:
  • Integrations
  • Rebranding
  • Hotel
  • Settings
• Apply consistent UI/UX patterns according to NethServer standards and plan for future extensions.

See Also

• Parent feature discussion: NethVoice: Redesign and Modularization of NethVoice Settings Architecture #7703
• UI/UX Mockup: Improve NethVoice application Settings page in NethServer #7660

[andre8244]

Test Case 0: Initial Configuration Wizard

• Open the NethVoice application.
• Dismiss/close the First configuration wizard.
• Verification: Confirm that the content on the Integrations, Rebranding, Hotel, and Settings pages is hidden.
• Verification: Confirm that the Configuration incomplete warning notification is visible.
• Click the Resume button on the notification and complete the First configuration wizard.

Test Case 1: Status Page

• Pre-condition: Complete Test Case 0.
• Navigate to the Status page.
• Verification: Validate that the following cards display accurate information:
  • NethVoice host
  • NethVoice CTI host
  • NethVoice Proxy
  • Account provider
• Verification: Ensure the Failed services section correctly reflects the current system state.
• Verification: Confirm that Application images and Application volumes display data within paginated tables.

Test Case 2: Integrations Page

• Pre-condition: Complete Test Case 0.
• Navigate to the Integrations page.
• Verification: Confirm the Integrations page functions as expected.

Test Case 3: Settings Page

• Pre-condition: Complete Test Case 0.
• Navigate to the Settings page.
• Verification: Confirm the configuration is divided into two distinct cards: General and Change NethVoice admin password.
• General Form Test: Modify the configuration and click the Save button; verify changes persist.
• Password Form Test: Update the password in the Change NethVoice admin password form and click the Change password button; verify the update is successful.

Test Case 4: NethServer Community (No Subscription)

• Pre-condition: Ensure no active subscription exists (Settings > Subscription).
• Open the NethVoice application.
• Navigate to the Hotel page.
  • Verification: Confirm the Hotel form is hidden and the Hotel configuration is disabled info notification is visible.
• Navigate to the Rebranding page.
  • Verification: Confirm the Rebranding form is hidden and the Rebranding not activated yet info notification is visible.

Test Case 5: NethServer Enterprise (Active Subscription)

• Pre-condition: Ensure an active subscription is present (Settings > Subscription).
• Open the NethVoice application.
• Navigate to the Hotel page.
  • Verification: Confirm the Hotel form is visible and functional.
• Navigate to the Rebranding page.
  • Verification: Confirm the Rebranding form is visible and functional.

[andre8244]

Testing release nethesis/ns8-nethvoice 1.5.4-testing.15