@@ -152,46 +31,23 @@ export default function SignInPage() {
{__("Sign in to your account")}
-
-
-
-
{__("Or")}
-
-
-
-
+ );
+}
diff --git a/apps/console/src/pages/iam/auth/sign-in/_components/OIDCButtons.tsx b/apps/console/src/pages/iam/auth/sign-in/_components/OIDCButtons.tsx
new file mode 100644
index 000000000..9ca5eae2b
--- /dev/null
+++ b/apps/console/src/pages/iam/auth/sign-in/_components/OIDCButtons.tsx
@@ -0,0 +1,51 @@
+import { useTranslate } from "@probo/i18n";
+import { Button, Google, Microsoft } from "@probo/ui";
+import type { ComponentProps } from "react";
+
+const providerIcons: Record<
+ string,
+ (props: ComponentProps<"svg">) => React.ReactNode
+> = {
+ google: Google,
+ microsoft: Microsoft,
+};
+
+export function OIDCButtons({
+ providers,
+ safeContinueUrl,
+}: {
+ providers: ReadonlyArray<{ readonly name: string; readonly loginURL: string }>;
+ safeContinueUrl: URL;
+}) {
+ const { __ } = useTranslate();
+
+ if (providers.length === 0) {
+ return null;
+ }
+
+ return (
+ <>
+ {providers.map((provider) => {
+ const Icon = providerIcons[provider.name];
+ return (
+
+ );
+ })}
+ >
+ );
+}
diff --git a/apps/trust/src/hooks/useSafeContinueUrl.ts b/apps/trust/src/hooks/useSafeContinueUrl.ts
new file mode 100644
index 000000000..34ce2e958
--- /dev/null
+++ b/apps/trust/src/hooks/useSafeContinueUrl.ts
@@ -0,0 +1,36 @@
+import { useMemo } from "react";
+import { useSearchParams } from "react-router";
+
+import { getPathPrefix } from "#/utils/pathPrefix";
+
+export function useSafeContinueUrl(): URL {
+ const [searchParams] = useSearchParams();
+
+ const continueUrlParam = searchParams.get("continue");
+ const prefix = getPathPrefix();
+ const fallback = window.location.origin + (prefix || "/");
+
+ const safeContinueUrl = useMemo(() => {
+ if (continueUrlParam) {
+ let continueUrl: URL;
+ try {
+ continueUrl = new URL(continueUrlParam, window.location.origin);
+ } catch {
+ return new URL(fallback, window.location.origin);
+ }
+ if (
+ continueUrl.origin === window.location.origin
+ && continueUrl.pathname.startsWith(`${prefix}/`)
+ ) {
+ return new URL(
+ continueUrl.pathname + continueUrl.search,
+ window.location.origin,
+ );
+ }
+ return new URL(fallback, window.location.origin);
+ }
+ return new URL(fallback, window.location.origin);
+ }, [continueUrlParam, fallback, prefix]);
+
+ return safeContinueUrl;
+}
diff --git a/apps/trust/src/pages/auth/ConnectPage.tsx b/apps/trust/src/pages/auth/ConnectPage.tsx
index b003dbae5..ccd785329 100644
--- a/apps/trust/src/pages/auth/ConnectPage.tsx
+++ b/apps/trust/src/pages/auth/ConnectPage.tsx
@@ -2,22 +2,20 @@ import type { GraphQLError } from "@probo/helpers";
import { usePageTitle } from "@probo/hooks";
import { useTranslate } from "@probo/i18n";
import { Button, Field, Google, Microsoft, useToast } from "@probo/ui";
-import { type ComponentProps, Suspense, useEffect, useRef, useState } from "react";
+import { type ComponentProps, useEffect, useRef, useState } from "react";
import {
type PreloadedQuery,
- useLazyLoadQuery,
useMutation,
usePreloadedQuery,
} from "react-relay";
-import { useSearchParams } from "react-router";
import { graphql } from "relay-runtime";
import { z } from "zod";
import { useFormWithSchema } from "#/hooks/useFormWithSchema";
+import { useSafeContinueUrl } from "#/hooks/useSafeContinueUrl";
import { getPathPrefix } from "#/utils/pathPrefix";
import type { ConnectPageMutation, SendMagicLinkInput } from "./__generated__/ConnectPageMutation.graphql";
-import type { ConnectPageOIDCQuery } from "./__generated__/ConnectPageOIDCQuery.graphql";
import type { ConnectPageQuery } from "./__generated__/ConnectPageQuery.graphql";
export const connectPageQuery = graphql`
@@ -27,11 +25,6 @@ export const connectPageQuery = graphql`
name
}
}
- }
-`;
-
-const oidcProvidersQuery = graphql`
- query ConnectPageOIDCQuery {
oidcProviders {
name
loginURL
@@ -74,20 +67,22 @@ function Divider({ children }: { children: React.ReactNode }) {
);
}
-function OIDCButtons({ safeContinueUrl }: { safeContinueUrl: string }) {
+function OIDCButtons({
+ providers,
+ safeContinueUrl,
+}: {
+ providers: ReadonlyArray<{ readonly name: string; readonly loginURL: string }>;
+ safeContinueUrl: URL;
+}) {
const { __ } = useTranslate();
- const data = useLazyLoadQuery
(oidcProvidersQuery, {});
-
- if (data.oidcProviders.length === 0) {
+ if (providers.length === 0) {
return null;
}
- const continueUrl = new URL(safeContinueUrl);
-
return (
<>
- {data.oidcProviders.map((provider) => {
+ {providers.map((provider) => {
const Icon = providerIcons[provider.name];
return (