fix: Disabled authentication providers show as enabled in settings

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;

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>
         ))}