From 147b4c5b1f09b58a4c8441575543bc853bee92bf Mon Sep 17 00:00:00 2001
From: Patrik Oldsberg <poldsberg@gmail.com>
Date: Wed, 10 Mar 2021 15:47:32 +0100
Subject: [PATCH] user-settings: avoid depending on descriptions from ApiRefs

Co-authored-by: Juan Lulkin <jmaiz@spotify.com>
Signed-off-by: Patrik Oldsberg <poldsberg@gmail.com>
---
 .changeset/fair-students-buy.md                      |  5 +++++
 .../components/AuthProviders/AuthProviders.test.tsx  |  4 +++-
 .../AuthProviders/DefaultProviderSettings.tsx        | 12 ++++++------
 3 files changed, 14 insertions(+), 7 deletions(-)
 create mode 100644 .changeset/fair-students-buy.md

diff --git a/.changeset/fair-students-buy.md b/.changeset/fair-students-buy.md
new file mode 100644
index 0000000000..600c86e6c1
--- /dev/null
+++ b/.changeset/fair-students-buy.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-user-settings': patch
+---
+
+Avoid using `ApiRef` descriptions in the UI.
diff --git a/plugins/user-settings/src/components/AuthProviders/AuthProviders.test.tsx b/plugins/user-settings/src/components/AuthProviders/AuthProviders.test.tsx
index 072c90ddac..e299b30594 100644
--- a/plugins/user-settings/src/components/AuthProviders/AuthProviders.test.tsx
+++ b/plugins/user-settings/src/components/AuthProviders/AuthProviders.test.tsx
@@ -64,7 +64,9 @@ describe('<AuthProviders />', () => {
 
     expect(rendered.getByText('Google')).toBeInTheDocument();
     expect(
-      rendered.getByText(googleAuthApiRef.description),
+      rendered.getByText(
+        'Provides authentication towards Google APIs and identities',
+      ),
     ).toBeInTheDocument();
 
     const button = rendered.getByTitle('Sign in to Google');
diff --git a/plugins/user-settings/src/components/AuthProviders/DefaultProviderSettings.tsx b/plugins/user-settings/src/components/AuthProviders/DefaultProviderSettings.tsx
index 415d1eaad6..b9c7b763b6 100644
--- a/plugins/user-settings/src/components/AuthProviders/DefaultProviderSettings.tsx
+++ b/plugins/user-settings/src/components/AuthProviders/DefaultProviderSettings.tsx
@@ -34,7 +34,7 @@ export const DefaultProviderSettings = ({ configuredProviders }: Props) => (
     {configuredProviders.includes('google') && (
       <ProviderSettingsItem
         title="Google"
-        description={googleAuthApiRef.description}
+        description="Provides authentication towards Google APIs and identities"
         apiRef={googleAuthApiRef}
         icon={Star}
       />
@@ -42,7 +42,7 @@ export const DefaultProviderSettings = ({ configuredProviders }: Props) => (
     {configuredProviders.includes('microsoft') && (
       <ProviderSettingsItem
         title="Microsoft"
-        description={microsoftAuthApiRef.description}
+        description="Provides authentication towards Microsoft APIs and identities"
         apiRef={microsoftAuthApiRef}
         icon={Star}
       />
@@ -50,7 +50,7 @@ export const DefaultProviderSettings = ({ configuredProviders }: Props) => (
     {configuredProviders.includes('github') && (
       <ProviderSettingsItem
         title="GitHub"
-        description={githubAuthApiRef.description}
+        description="Provides authentication towards GitHub APIs"
         apiRef={githubAuthApiRef}
         icon={Star}
       />
@@ -58,7 +58,7 @@ export const DefaultProviderSettings = ({ configuredProviders }: Props) => (
     {configuredProviders.includes('gitlab') && (
       <ProviderSettingsItem
         title="GitLab"
-        description={gitlabAuthApiRef.description}
+        description="Provides authentication towards GitLab APIs"
         apiRef={gitlabAuthApiRef}
         icon={Star}
       />
@@ -66,7 +66,7 @@ export const DefaultProviderSettings = ({ configuredProviders }: Props) => (
     {configuredProviders.includes('okta') && (
       <ProviderSettingsItem
         title="Okta"
-        description={oktaAuthApiRef.description}
+        description="Provides authentication towards Okta APIs"
         apiRef={oktaAuthApiRef}
         icon={Star}
       />
@@ -74,7 +74,7 @@ export const DefaultProviderSettings = ({ configuredProviders }: Props) => (
     {configuredProviders.includes('oauth2') && (
       <ProviderSettingsItem
         title="YourOrg"
-        description={oauth2ApiRef.description}
+        description="Example of how to use oauth2 custom provider"
         apiRef={oauth2ApiRef}
         icon={Star}
       />