From cc8f52b5025976e05ae74d9afbeac8ec9ddc50e9 Mon Sep 17 00:00:00 2001
From: Jens L <jens@goauthentik.io>
Date: Sun, 30 Apr 2023 14:25:18 +0300
Subject: [PATCH] =?UTF-8?q?web/admin:=20fix=20state=20issue=20after=20clea?=
 =?UTF-8?q?rIcon/Background=20is=20used=20and=20for=E2=80=A6=20(#5423)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

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  |  6 ++++--
 web/src/admin/flows/FlowForm.ts                |  6 ++++--
 web/src/admin/sources/oauth/OAuthSourceForm.ts | 16 +++++++---------
 web/src/admin/sources/plex/PlexSourceForm.ts   | 18 ++++++++----------
 web/src/admin/sources/saml/SAMLSourceForm.ts   |  6 ++++--
 5 files changed, 27 insertions(+), 25 deletions(-)

diff --git a/web/src/admin/applications/ApplicationForm.ts b/web/src/admin/applications/ApplicationForm.ts
index 426d618aa2..e10d7d75cf 100644
--- a/web/src/admin/applications/ApplicationForm.ts
+++ b/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> {
-        return new CoreApi(DEFAULT_CONFIG).coreApplicationsRetrieve({
+    async loadInstance(pk: string): Promise<Application> {
+        const app = await new CoreApi(DEFAULT_CONFIG).coreApplicationsRetrieve({
             slug: pk,
         });
+        this.clearIcon = false;
+        return app;
     }
 
     @property({ attribute: false })
diff --git a/web/src/admin/flows/FlowForm.ts b/web/src/admin/flows/FlowForm.ts
index bd56e4fb45..4d626b2b69 100644
--- a/web/src/admin/flows/FlowForm.ts
+++ b/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> {
-        return new FlowsApi(DEFAULT_CONFIG).flowsInstancesRetrieve({
+    async loadInstance(pk: string): Promise<Flow> {
+        const flow = await new FlowsApi(DEFAULT_CONFIG).flowsInstancesRetrieve({
             slug: pk,
         });
+        this.clearBackground = false;
+        return flow;
     }
 
     getSuccessMessage(): string {
diff --git a/web/src/admin/sources/oauth/OAuthSourceForm.ts b/web/src/admin/sources/oauth/OAuthSourceForm.ts
index 4076d4c23a..a7f9c5e02f 100644
--- a/web/src/admin/sources/oauth/OAuthSourceForm.ts
+++ b/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> {
-        return new SourcesApi(DEFAULT_CONFIG)
-            .sourcesOauthRetrieve({
-                slug: pk,
-            })
-            .then((source) => {
-                this.providerType = source.type;
-                return source;
-            });
+    async loadInstance(pk: string): Promise<OAuthSource> {
+        const source = await new SourcesApi(DEFAULT_CONFIG).sourcesOauthRetrieve({
+            slug: pk,
+        });
+        this.providerType = source.type;
+        this.clearIcon = false;
+        return source;
     }
 
     _modelName?: string;
diff --git a/web/src/admin/sources/plex/PlexSourceForm.ts b/web/src/admin/sources/plex/PlexSourceForm.ts
index 9fd26443e4..51c78fb0e1 100644
--- a/web/src/admin/sources/plex/PlexSourceForm.ts
+++ b/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> {
-        return new SourcesApi(DEFAULT_CONFIG)
-            .sourcesPlexRetrieve({
-                slug: pk,
-            })
-            .then((source) => {
-                this.plexToken = source.plexToken;
-                this.loadServers();
-                return source;
-            });
+    async loadInstance(pk: string): Promise<PlexSource> {
+        const source = await new SourcesApi(DEFAULT_CONFIG).sourcesPlexRetrieve({
+            slug: pk,
+        });
+        this.plexToken = source.plexToken;
+        this.loadServers();
+        this.clearIcon = false;
+        return source;
     }
 
     @state()
diff --git a/web/src/admin/sources/saml/SAMLSourceForm.ts b/web/src/admin/sources/saml/SAMLSourceForm.ts
index f4db225966..87a4e20b26 100644
--- a/web/src/admin/sources/saml/SAMLSourceForm.ts
+++ b/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> {
-        return new SourcesApi(DEFAULT_CONFIG).sourcesSamlRetrieve({
+    async loadInstance(pk: string): Promise<SAMLSource> {
+        const source = await new SourcesApi(DEFAULT_CONFIG).sourcesSamlRetrieve({
             slug: pk,
         });
+        this.clearIcon = false;
+        return source;
     }
 
     getSuccessMessage(): string {