Skip to content

fix: update authentication modal styles and improve success handling #20

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
sirily11 merged 1 commit into from
Feb 9, 2026
Merged

fix: update authentication modal styles and improve success handling #20

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/app/(internal)/(auth)/auth/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ export const metadata: Metadata = {

export default function page() {
return (
<div>
<div className="w-full h-full">
<AuthenticationModal />
</div>
);
Expand Down
25 changes: 13 additions & 12 deletions src/components/pages/auth/AuthenticationModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,20 +42,21 @@ export default function AuthenticationModal() {
variant: "destructive",
});
throw new Error(error);
Copy link

Copilot AI Feb 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In the error branch you toast an error and then throw new Error(error), but the outer catch also toasts, which will likely result in duplicate error toasts for the same failure. Prefer a single error-reporting path (e.g., throw and let the catch toast, or toast and return without throwing).

Suggested change
throw new Error(error);
return;

Copilot uses AI. Check for mistakes.
}

toast({
title: "Success",
description: "Signed in successfully",
variant: "success",
});
if (redirect) {
router.push(redirect);
} else {
toast({
title: "Success",
description: "Signed in successfully",
variant: "success",
});
if (redirect) {
router.push(redirect);
} else {
router.push("/");
}
router.push("/");
Comment on lines +52 to +55
Copy link

Copilot AI Feb 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

redirect comes directly from a query string and is passed to router.push without validation. This can enable open-redirect behavior (e.g., redirect=https://evil.com) depending on how Next handles the value. Consider only allowing relative internal paths (e.g., redirect must start with / and must not start with //), otherwise fall back to /.

Copilot uses AI. Check for mistakes.
}
},
});
// biome-ignore lint/suspicious/noExplicitAny: <explanation>
} catch (error: any) {
toast({
Comment on lines +59 to 61
Copy link

Copilot AI Feb 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The Biome suppression comment contains a placeholder (<explanation>) and the catch (error: any) is being silenced rather than handled. Please replace the placeholder with a real justification, or preferably remove the suppression by typing the catch param as unknown and safely deriving a message for the toast.

Copilot uses AI. Check for mistakes.
title: "Error",
Expand All @@ -66,11 +67,11 @@ export default function AuthenticationModal() {
};

return (
<div className="w-auto mx-auto p-4 h-full flex items-center justify-center">
<div className="w-full h-full flex items-center justify-center p-4">
<div className="md:block hidden">
<DesktopAuthModal sdk={sdk} connect={connect} />
</div>
<div className="md:hidden block">
<div className="md:hidden block w-full">
<MobileAuthModal sdk={sdk} connect={connect} />
</div>
</div>
Expand Down
4 changes: 2 additions & 2 deletions src/components/pages/auth/DesktopAuthModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,8 +33,8 @@ export function DesktopAuthModal({ sdk, connect }: Props) {
}}
className="relative"
>
<Card className="w-full h-full min-h-[500px] flex !shadow-xl rounded-3xl overflow-hidden border-0">
<div className="relative w-full">
<Card className="w-full h-[600px] flex !shadow-xl rounded-3xl overflow-hidden border-0 p-0">
<div className="relative w-full h-full">
{/* Right Panel */}
<motion.div
initial={{ x: "-50%" }}
Expand Down
2 changes: 1 addition & 1 deletion src/components/pages/auth/MobileAuthModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ export function MobileAuthModal({ sdk, connect }: Props) {
}}
className="w-full"
>
<Card className="w-full min-h-[500px] !shadow-none rounded-3xl overflow-hidden border-t border-l border-r md:border-0 mt-96">
<Card className="w-full h-[600px] !shadow-none rounded-3xl overflow-hidden border-t border-l border-r md:border-0 p-0">
Copy link

Copilot AI Feb 9, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

With the Card now having a fixed height (h-[600px]) and overflow-hidden, the wallet provider list can become inaccessible if it exceeds the available vertical space (there’s no overflow-y-auto on the bottom panel like the desktop modal has). Consider adding an internal scroll container for the wallet options area or removing overflow-hidden/fixed height so content can be reached on smaller screens.

Copilot uses AI. Check for mistakes.
<div className="flex flex-col w-full h-full">
{/* Top Panel */}
<motion.div
Expand Down
Loading