From a2e183627c8b62997bbb68f15ecf89c953762fbe Mon Sep 17 00:00:00 2001
From: Tom Moor <tom.moor@gmail.com>
Date: Tue, 3 Jan 2023 19:32:16 -0500
Subject: [PATCH] fix: Disabled authentication providers show as enabled in
 settings

---
 app/models/AuthenticationProvider.ts | 7 ++++++-
 app/scenes/Settings/Security.tsx     | 9 +++++++--
 2 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/app/models/AuthenticationProvider.ts b/app/models/AuthenticationProvider.ts
index e144eb94e..f292651a8 100644
--- a/app/models/AuthenticationProvider.ts
+++ b/app/models/AuthenticationProvider.ts
@@ -1,4 +1,4 @@
-import { observable } from "mobx";
+import { computed, observable } from "mobx";
 import BaseModel from "./BaseModel";
 import Field from "./decorators/Field";
 
@@ -14,6 +14,11 @@ class AuthenticationProvider extends BaseModel {
   @Field
   @observable
   isEnabled: boolean;
+
+  @computed
+  get isActive() {
+    return this.isEnabled && this.isConnected;
+  }
 }
 
 export default AuthenticationProvider;
diff --git a/app/scenes/Settings/Security.tsx b/app/scenes/Settings/Security.tsx
index 840822f22..57a870ff2 100644
--- a/app/scenes/Settings/Security.tsx
+++ b/app/scenes/Settings/Security.tsx
@@ -165,8 +165,13 @@ function Security() {
             })}
           >
             <Flex align="center">
-              <CheckboxIcon color={theme.primary} checked />{" "}
-              <Text type="secondary">{t("Connected")}</Text>
+              <CheckboxIcon
+                color={provider.isActive ? theme.primary : undefined}
+                checked={provider.isActive}
+              />{" "}
+              <Text type="secondary">
+                {provider.isActive ? t("Connected") : t("Disabled")}
+              </Text>
             </Flex>
           </SettingRow>
         ))}