🐛 Forward callback url when signing in with sso provider (#1543)

apps/web/src/app/[locale]/(auth)/login/components/login-with-oidc.tsx

@@ -1,24 +1,28 @@
+"use client";
 import { Button } from "@rallly/ui/button";
 import { signIn } from "next-auth/react";
-import { Trans } from "react-i18next/TransWithoutContext";
 
-import { getTranslation } from "@/i18n/server";
+import { Trans } from "@/components/trans";
-
-export async function LoginWithOIDC({ name }: { name: string }) {
-  const { t } = await getTranslation();
 
+export async function LoginWithOIDC({
+  name,
+  callbackUrl,
+}: {
+  name: string;
+  callbackUrl?: string;
+}) {
   return (
     <Button
       onClick={() => {
-        signIn("oidc");
+        signIn("oidc", {
+          callbackUrl,
+        });
       }}
       variant="link"
     >
       <Trans
-        t={t}
         i18nKey="continueWithProvider"
-        ns="app"
+        defaults="Continue with {provider}"
-        defaultValue="Login with {provider}"
         values={{ provider: name }}
       />
     </Button>

apps/web/src/app/[locale]/(auth)/login/components/sso-provider.tsx

@@ -40,9 +40,11 @@ function SSOImage({ provider }: { provider: string }) {
 export function SSOProvider({
   providerId,
   name,
+  callbackUrl,
 }: {
   providerId: string;
   name: string;
+  callbackUrl?: string;
 }) {
   const { t } = useTranslation();
   return (
@@ -55,7 +57,9 @@ export function SSOProvider({
       })}
       key={providerId}
       onClick={() => {
-        signIn(providerId);
+        signIn(providerId, {
+          callbackUrl,
+        });
       }}
     >
       <SSOImage provider={providerId} />

apps/web/src/app/[locale]/(auth)/login/page.tsx

@@ -18,7 +18,13 @@ import { LoginWithOIDC } from "./components/login-with-oidc";
 import { OrDivider } from "./components/or-divider";
 import { SSOProvider } from "./components/sso-provider";
 
-export default async function LoginPage() {
+export default async function LoginPage({
+  searchParams,
+}: {
+  searchParams?: {
+    callbackUrl?: string;
+  };
+}) {
   const { t } = await getTranslation();
   const oAuthProviders = getOAuthProviders();
 
@@ -49,7 +55,12 @@ export default async function LoginPage() {
       <AuthPageContent>
         <LoginWithEmailForm />
         {hasAlternateLoginMethods ? <OrDivider /> : null}
-        {oidcProvider ? <LoginWithOIDC name={oidcProvider.name} /> : null}
+        {oidcProvider ? (
+          <LoginWithOIDC
+            name={oidcProvider.name}
+            callbackUrl={searchParams?.callbackUrl}
+          />
+        ) : null}
         {socialProviders ? (
           <div className="grid gap-4">
             {socialProviders.map((provider) => (
@@ -57,6 +68,7 @@ export default async function LoginPage() {
                 key={provider.id}
                 providerId={provider.id}
                 name={provider.name}
+                callbackUrl={searchParams?.callbackUrl}
               />
             ))}
           </div>