From d5b14a0ad52bf362904d1af9c36c0ac1b5b68cb4 Mon Sep 17 00:00:00 2001
From: AmbrishRamachandiran <ambrish.r@infosys.com>
Date: Tue, 6 Feb 2024 12:19:15 +0530
Subject: [PATCH] conditionally rendering the user name and email in user
 settings page

Signed-off-by: AmbrishRamachandiran <ambrish.r@infosys.com>
---
 .changeset/shiny-clocks-greet.md              |  5 ++++
 .../AuthProviders/ProviderSettingsItem.tsx    | 24 +++++++++++--------
 2 files changed, 19 insertions(+), 10 deletions(-)
 create mode 100644 .changeset/shiny-clocks-greet.md

diff --git a/.changeset/shiny-clocks-greet.md b/.changeset/shiny-clocks-greet.md
new file mode 100644
index 0000000000..0c112ff81f
--- /dev/null
+++ b/.changeset/shiny-clocks-greet.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-user-settings': patch
+---
+
+conditionally rendering the user name and email in user settings page
diff --git a/plugins/user-settings/src/components/AuthProviders/ProviderSettingsItem.tsx b/plugins/user-settings/src/components/AuthProviders/ProviderSettingsItem.tsx
index e3fb597a15..e9a710036f 100644
--- a/plugins/user-settings/src/components/AuthProviders/ProviderSettingsItem.tsx
+++ b/plugins/user-settings/src/components/AuthProviders/ProviderSettingsItem.tsx
@@ -101,16 +101,20 @@ export const ProviderSettingsItem = (props: {
               <Grid item xs={12} sm container>
                 <Grid item xs container direction="column" spacing={2}>
                   <Grid item xs>
-                    <Typography
-                      variant="subtitle1"
-                      color="textPrimary"
-                      gutterBottom
-                    >
-                      {profile.displayName}
-                    </Typography>
-                    <Typography variant="body2" color="textSecondary">
-                      {profile.email}
-                    </Typography>
+                    {profile.displayName && (
+                      <Typography
+                        variant="subtitle1"
+                        color="textPrimary"
+                        gutterBottom
+                      >
+                        {profile.displayName}
+                      </Typography>
+                    )}
+                    {profile.email && (
+                      <Typography variant="body2" color="textSecondary">
+                        {profile.email}
+                      </Typography>
+                    )}
                     <Typography variant="body2" color="textSecondary">
                       {description}
                     </Typography>