From 57dc1f5e0d8ef1732d55aec3586fd06fccad66c0 Mon Sep 17 00:00:00 2001
From: scme0 <scott.merchant@octopus.com>
Date: Mon, 30 Dec 2024 15:21:57 +0100
Subject: [PATCH] Don't display the "or" divider if there are no OIDC login
 options

---
 front/packages/ui/src/login/oidc.tsx | 17 +++++++----------
 1 file changed, 7 insertions(+), 10 deletions(-)

diff --git a/front/packages/ui/src/login/oidc.tsx b/front/packages/ui/src/login/oidc.tsx
index 1f06ad5a0..1f8ac903b 100644
--- a/front/packages/ui/src/login/oidc.tsx
+++ b/front/packages/ui/src/login/oidc.tsx
@@ -41,12 +41,14 @@ export const OidcLogin = ({ apiUrl }: { apiUrl?: string }) => {
 
 	const btn = css({ width: { xs: percent(100), sm: percent(75) }, marginY: ts(1) });
 
+	const oidcValues = Object.values(data?.oidc ?? {})
+
 	return (
 		<View {...css({ alignItems: "center", marginY: ts(1) })}>
 			{error ? (
 				<ErrorView error={error} />
-			) : data ? (
-				Object.values(data.oidc).map((x) => (
+			) : (
+				oidcValues.map((x) => (
 					<Button
 						as={Link}
 						href={{ pathname: x.link, query: { apiUrl } }}
@@ -63,14 +65,9 @@ export const OidcLogin = ({ apiUrl }: { apiUrl?: string }) => {
 						{...btn}
 					/>
 				))
-			) : (
-				[...Array(3)].map((_, i) => (
-					<Button key={i} {...btn}>
-						<Skeleton {...css({ width: percent(66), marginY: rem(0.5) })} />
-					</Button>
-				))
 			)}
-			<View
+			{ oidcValues.length > 0 &&
+				(<View
 				{...css({
 					marginY: ts(1),
 					flexDirection: "row",
@@ -81,7 +78,7 @@ export const OidcLogin = ({ apiUrl }: { apiUrl?: string }) => {
 				<HR {...css({ flexGrow: 1 })} />
 				<P>{t("misc.or")}</P>
 				<HR {...css({ flexGrow: 1 })} />
-			</View>
+			</View>)}
 		</View>
 	);
 };