github/sim
1
1
Fork 0
mirror of https://github.com/simstudioai/sim.git synced 2026-04-06 03:00:16 -04:00
Code Issues Packages Projects Releases Wiki Activity

improvement(signup): modify signup and login pages to not show social sign in when not configured, increase logo size (#1103)

Browse Source
This commit is contained in:
Waleed Latif
2025-08-22 12:15:59 -07:00
committed by GitHub
parent e13adab14f
commit 6c606750f5
4 changed files with 21 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
apps/sim/app/(auth)/components/social-login-buttons.tsx
View File

@@ -3,7 +3,6 @@
import { useEffect, useState } from 'react'
import { GithubIcon, GoogleIcon } from '@/components/icons'
import { Button } from '@/components/ui/button'
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip'
import { client } from '@/lib/auth-client'
interface SocialLoginButtonsProps {
@@ -114,58 +113,16 @@ export function SocialLoginButtons({
</Button>
)
const renderGithubButton = () => {
if (githubAvailable) return githubButton
const hasAnyOAuthProvider = githubAvailable || googleAvailable
return (
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<div>{githubButton}</div>
</TooltipTrigger>
<TooltipContent className='border-neutral-700 bg-neutral-800 text-white'>
<p>
GitHub login requires OAuth credentials to be configured. Add the following
environment variables:
</p>
<ul className='mt-2 space-y-1 text-neutral-300 text-xs'>
<li>• GITHUB_CLIENT_ID</li>
<li>• GITHUB_CLIENT_SECRET</li>
</ul>
</TooltipContent>
</Tooltip>
</TooltipProvider>
)
}
const renderGoogleButton = () => {
if (googleAvailable) return googleButton
return (
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<div>{googleButton}</div>
</TooltipTrigger>
<TooltipContent className='border-neutral-700 bg-neutral-800 text-white'>
<p>
Google login requires OAuth credentials to be configured. Add the following
environment variables:
</p>
<ul className='mt-2 space-y-1 text-neutral-300 text-xs'>
<li>• GOOGLE_CLIENT_ID</li>
<li>• GOOGLE_CLIENT_SECRET</li>
</ul>
</TooltipContent>
</Tooltip>
</TooltipProvider>
)
if (!hasAnyOAuthProvider) {
return null
}
return (
<div className='grid gap-3'>
{renderGithubButton()}
{renderGoogleButton()}
{githubAvailable && githubButton}
{googleAvailable && googleButton}
</div>
)
}

8
apps/sim/app/(auth)/layout.tsx
View File

@@ -28,12 +28,12 @@ export default function AuthLayout({ children }: { children: React.ReactNode })
<img
src={brand.logoUrl}
alt={`${brand.name} Logo`}
width={42}
height={42}
className='h-[42px] w-[42px] object-contain'
width={56}
height={56}
className='h-[56px] w-[56px] object-contain'
/>
) : (
<Image src='/sim.svg' alt={`${brand.name} Logo`} width={42} height={42} />
<Image src='/sim.svg' alt={`${brand.name} Logo`} width={56} height={56} />
)}
</Link>
</div>

10
apps/sim/app/(auth)/login/login-form.tsx
View File

@@ -366,11 +366,13 @@ export default function LoginPage({
callbackURL={callbackUrl}
/>
<div className='relative mt-2 py-4'>
<div className='absolute inset-0 flex items-center'>
<div className='w-full border-neutral-700/50 border-t' />
{(githubAvailable || googleAvailable) && (
<div className='relative mt-2 py-4'>
<div className='absolute inset-0 flex items-center'>
<div className='w-full border-neutral-700/50 border-t' />
</div>
</div>
</div>
)}
<form onSubmit={onSubmit} className='space-y-5'>
<div className='space-y-4'>

10
apps/sim/app/(auth)/signup/signup-form.tsx
View File

@@ -381,11 +381,13 @@ function SignupFormContent({
isProduction={isProduction}
/>
<div className='relative mt-2 py-4'>
<div className='absolute inset-0 flex items-center'>
<div className='w-full border-neutral-700/50 border-t' />
{(githubAvailable || googleAvailable) && (
<div className='relative mt-2 py-4'>
<div className='absolute inset-0 flex items-center'>
<div className='w-full border-neutral-700/50 border-t' />
</div>
</div>
</div>
)}
<form onSubmit={onSubmit} className='space-y-5'>
<div className='space-y-4'>