web/admin: fix state issue after clearIcon/Background is used and for… (#5423)

web/admin: fix state issue after clearIcon/Background is used and form is re-used

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

web/src/admin/applications/ApplicationForm.ts

@@ -27,10 +27,12 @@ import {
 
 @customElement("ak-application-form")
 export class ApplicationForm extends ModelForm<Application, string> {
-    loadInstance(pk: string): Promise<Application> {
+    async loadInstance(pk: string): Promise<Application> {
-        return new CoreApi(DEFAULT_CONFIG).coreApplicationsRetrieve({
+        const app = await new CoreApi(DEFAULT_CONFIG).coreApplicationsRetrieve({
             slug: pk,
         });
+        this.clearIcon = false;
+        return app;
     }
 
     @property({ attribute: false })

web/src/admin/flows/FlowForm.ts

@@ -26,10 +26,12 @@ import {
 
 @customElement("ak-flow-form")
 export class FlowForm extends ModelForm<Flow, string> {
-    loadInstance(pk: string): Promise<Flow> {
+    async loadInstance(pk: string): Promise<Flow> {
-        return new FlowsApi(DEFAULT_CONFIG).flowsInstancesRetrieve({
+        const flow = await new FlowsApi(DEFAULT_CONFIG).flowsInstancesRetrieve({
             slug: pk,
         });
+        this.clearBackground = false;
+        return flow;
     }
 
     getSuccessMessage(): string {

web/src/admin/sources/oauth/OAuthSourceForm.ts

@@ -31,15 +31,13 @@ import {
 
 @customElement("ak-source-oauth-form")
 export class OAuthSourceForm extends ModelForm<OAuthSource, string> {
-    loadInstance(pk: string): Promise<OAuthSource> {
+    async loadInstance(pk: string): Promise<OAuthSource> {
-        return new SourcesApi(DEFAULT_CONFIG)
+        const source = await new SourcesApi(DEFAULT_CONFIG).sourcesOauthRetrieve({
-            .sourcesOauthRetrieve({
+            slug: pk,
-                slug: pk,
+        });
-            })
+        this.providerType = source.type;
-            .then((source) => {
+        this.clearIcon = false;
-                this.providerType = source.type;
+        return source;
-                return source;
-            });
     }
 
     _modelName?: string;

web/src/admin/sources/plex/PlexSourceForm.ts

@@ -28,16 +28,14 @@ import {
 
 @customElement("ak-source-plex-form")
 export class PlexSourceForm extends ModelForm<PlexSource, string> {
-    loadInstance(pk: string): Promise<PlexSource> {
+    async loadInstance(pk: string): Promise<PlexSource> {
-        return new SourcesApi(DEFAULT_CONFIG)
+        const source = await new SourcesApi(DEFAULT_CONFIG).sourcesPlexRetrieve({
-            .sourcesPlexRetrieve({
+            slug: pk,
-                slug: pk,
+        });
-            })
+        this.plexToken = source.plexToken;
-            .then((source) => {
+        this.loadServers();
-                this.plexToken = source.plexToken;
+        this.clearIcon = false;
-                this.loadServers();
+        return source;
-                return source;
-            });
     }
 
     @state()

web/src/admin/sources/saml/SAMLSourceForm.ts

@@ -38,10 +38,12 @@ export class SAMLSourceForm extends ModelForm<SAMLSource, string> {
     @state()
     clearIcon = false;
 
-    loadInstance(pk: string): Promise<SAMLSource> {
+    async loadInstance(pk: string): Promise<SAMLSource> {
-        return new SourcesApi(DEFAULT_CONFIG).sourcesSamlRetrieve({
+        const source = await new SourcesApi(DEFAULT_CONFIG).sourcesSamlRetrieve({
             slug: pk,
         });
+        this.clearIcon = false;
+        return source;
     }
 
     getSuccessMessage(): string {