ui: fix add host form state on submit

[shwstppr]

Description

Fixes #11813

Types of changes

• Breaking change (fix or feature that would cause existing functionality to change)
• New feature (non-breaking change which adds functionality)
• Bug fix (non-breaking change which fixes an issue)
• Enhancement (improves an existing feature and functionality)
• Cleanup (Code refactoring and cleanup, that may add test cases)
• Build/CI
• Test (unit or integration test code)

Feature/Enhancement Scale or Bug Severity

Feature/Enhancement Scale

• Major
• Minor

Bug Severity

• BLOCKER
• Critical
• Major
• Minor
• Trivial

Screenshots (if appropriate):

add-host-form-submit-state.mp4

How Has This Been Tested?

How did you try to break this feature and the system with this change?

[shwstppr]

@blueorangutan ui

[blueorangutan]

@shwstppr a Jenkins job has been kicked to build UI QA env. I'll keep you posted as I make progress.

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 17.54%. Comparing base (a6ef24d) to head (96ab375).
⚠️ Report is 4 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff            @@
##               main   #11815   +/-   ##
=========================================
  Coverage     17.54%   17.54%           
- Complexity    15470    15471    +1     
=========================================
  Files          5897     5897           
  Lines        527349   527349           
  Branches      64403    64403           
=========================================
+ Hits          92514    92519    +5     
+ Misses       424437   424433    -4     
+ Partials      10398    10397    -1     

Flag	Coverage Δ
uitests	3.60% <ø> (ø)
unittests	18.60% <ø> (+<0.01%)	⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[blueorangutan]

UI build: ✔️
Live QA URL: https://qa.cloudstack.cloud/simulator/pr/11815 (QA-JID-776)

[DaanHoogland]

clgtm @shwstppr , as I can only see the spin-element as addition, does that mean that the actual call still went through and and only the modality of the dialogue was a problem?

[shwstppr]

@DaanHoogland yes. addHost call was still running. In most cases we close the forms as soon as firing the API but here it is better to wait and show loading animation.

[vishesh92]

lgtm

[pavanaravapalli]

@shwstppr

After submitting the 'addHost' API call, I suggest refreshing the form to immediately display the parent grid ( Host List) recently added host's information in a 'processing' state. This approach is generally preferred because it avoids blocking the UI while waiting for the API response (success or failure), offering a better user experience.

[shwstppr]

@pavanaravapalli thanks I won't be adding that functionality. I wanted to fix this as I may have accidentally broken the loading behaviour while adding some changes in #9752
Also, I'm not sure if showing a host in processing state is even possible with current behaviour of the API. You may raise a new issue/PR

[pavanaravapalli]

@shwstppr I can't raise a PR right now because I lack the necessary testing environment. I'm very interested in this work, though—would you be open to collaborating on it?.