From 6fb6ef4e7a927b6e626fa302537823077e292cf7 Mon Sep 17 00:00:00 2001 From: martmull Date: Thu, 28 May 2026 15:48:57 +0200 Subject: [PATCH] Add darkmode for oAuth screen (#21005) ## after image --- .../twenty-front/src/pages/auth/Authorize.tsx | 16 +++++- .../src/cli/utilities/auth/callback-server.ts | 55 ++++++++++++++----- 2 files changed, 54 insertions(+), 17 deletions(-) diff --git a/packages/twenty-front/src/pages/auth/Authorize.tsx b/packages/twenty-front/src/pages/auth/Authorize.tsx index 092c936356..e6534d3474 100644 --- a/packages/twenty-front/src/pages/auth/Authorize.tsx +++ b/packages/twenty-front/src/pages/auth/Authorize.tsx @@ -134,7 +134,7 @@ const OAUTH_SCOPE_ICONS: { [scope: string]: IconComponent | undefined } = { export const Authorize = () => { const { t } = useLingui(); - const { theme } = useContext(ThemeContext); + const { theme, colorScheme } = useContext(ThemeContext); const navigate = useNavigateApp(); const [searchParam] = useSearchParams(); const { redirect } = useRedirect(); @@ -175,6 +175,18 @@ export const Authorize = () => { } }, [shouldRedirectToNotFound, navigate]); + const appendThemeToUrl = (urlString: string) => { + try { + const url = new URL(urlString); + + url.searchParams.set('theme', colorScheme); + + return url.toString(); + } catch { + return urlString; + } + }; + const handleAuthorize = async () => { if (isDefined(clientId) && isDefined(redirectUrl)) { setIsAuthorizing(true); @@ -188,7 +200,7 @@ export const Authorize = () => { state: state ?? undefined, }, onCompleted: (responseData) => { - redirect(responseData.authorizeApp.redirectUrl); + redirect(appendThemeToUrl(responseData.authorizeApp.redirectUrl)); }, onError: (error) => { setIsAuthorizing(false); diff --git a/packages/twenty-sdk/src/cli/utilities/auth/callback-server.ts b/packages/twenty-sdk/src/cli/utilities/auth/callback-server.ts index baccc54389..d1b3e8402e 100644 --- a/packages/twenty-sdk/src/cli/utilities/auth/callback-server.ts +++ b/packages/twenty-sdk/src/cli/utilities/auth/callback-server.ts @@ -17,12 +17,14 @@ const pageHtml = ({ title, message, isSuccess, + isDarkMode, }: { title: string; message: string; isSuccess: boolean; + isDarkMode: boolean; }) => ` - + @@ -31,20 +33,40 @@ const pageHtml = ({