Fix Chat settings Save button staying in loading state #23040
BackDescription
Includes and extends #23038
Fixes the Save button on Administration > Settings > Chat staying in its loading state after a successful save. The settings were saved and the success toast appeared, but the button never returned to normal.
Cause: the settings page uses OnPush change detection. ChatTabComponent stored loading as a plain field and cleared it inside the HTTP callback. That never marked the view dirty, so the button was not repainted. The toast showed up because it updates on its own.
Chat tab (chat-tab.component.ts / .html)
- Turn
loadinginto a signal that is cleared infinalizeonce the settings update and the application-state refresh have both finished. - Ignore a second submit while a save is still in progress.
- Load settings with
toSignaland builddeleteMessageFormas acomputed, so the form shows the server values under OnPush. Without this, the form could keep its defaults.
Identity settings tabs (console error)
- Return early from the
computedforms in the lockout, password policy, user profile and verification tabs while the store value is still undefined. This removes the console error on the Identity Management settings page. - Update the password-policy template to work with the guarded form.
Preview / local environment
- Add preview app and workspace manifests at the repo root (
*.app.yaml,*.workspace.yaml) for running the Angular dev app against the app-pro HttpApi host. - Add
allowedHoststo thedev-appserve target inproject.jsonfor tunneled preview hosts. - In the app-pro template's
MyProjectNameHttpApiHostModule:- Set the OpenIddict issuer from
AuthServer:Authoritywhen it is configured. - Add an opt-in
App:ForceHttpsSchemesetting that rewrites the request scheme tohttps.
- Set the OpenIddict issuer from
Reviewer note: the MyProjectNameHttpApiHostModule changes ship in the app-pro template. Neither has an effect unless its configuration key is set, but please review them as template changes.
Checklist
- I fully tested it as developer / designer and created unit / integration tests
- I documented it (or no need to document or I will create a separate documentation issue)
- I've assigned reviewer, related labels and set a milestone for this PR
How to test it?
You can use the preview mode that is linked to this PR. You need to select the
volo-angular-test-appDo not forget setting abp framework branch to 10.6 and the lepton branch to 5.6
You need to enable the chat setting if it is not enabled
Open Administration > Settings > Chat.
- The form should show the saved server values, not the defaults.
- Change a value and click Save.
- The success toast should appear.
- The button should leave its loading state once the request finishes.
🤖 Opened from a Volobox coding session