Get password auth working.

This commit is contained in:
2026-03-20 17:41:19 -05:00
parent 81e6a5aaa6
commit a8bb610be7
6 changed files with 57 additions and 58 deletions

View File

@@ -252,24 +252,27 @@ const SignIn = () => {
<Tabs
defaultValue={flow}
onValueChange={(value) => setFlow(value as 'signIn' | 'signUp')}
className='items-center'
className='items-center flex-col'
>
<TabsList className='py-6'>
<TabsList>
<TabsTrigger
value='signIn'
className='cursor-pointer p-6 text-2xl font-bold'
className='cursor-pointer py-2 px-6 text-2xl font-bold'
>
Sign In
</TabsTrigger>
<TabsTrigger
value='signUp'
className='cursor-pointer p-6 text-2xl font-bold'
className='cursor-pointer py-2 px-6 text-2xl font-bold'
>
Sign Up
</TabsTrigger>
</TabsList>
<TabsContent value='signIn'>
<Card className='bg-card/50 min-w-xs sm:min-w-sm'>
<TabsContent
value='signIn'
className='min-h-[560px] items-center flex flex-row'
>
<Card className='bg-card/50 min-w-xs sm:min-w-sm py-10'>
<CardContent>
<Form {...signInForm}>
<form

View File

@@ -42,7 +42,7 @@ const RootLayout = ({
domain={env.NEXT_PUBLIC_SITE_URL}
customDomain={env.NEXT_PUBLIC_PLAUSIBLE_URL}
>
<html lang='en'>
<html lang='en' suppressHydrationWarning>
<body
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
>

View File

@@ -53,7 +53,7 @@ export const UserInfoForm = ({
const userProvider = usePreloadedQuery(preloadedProvider);
const providerMap: Record<string, string> = {
unknown: 'Provider',
authentik: 'Gib\'s Auth'
authentik: 'Gib\'s Auth',
};
const [loading, setLoading] = useState(false);
@@ -168,4 +168,3 @@ export const UserInfoForm = ({
</>
);
};

View File

@@ -28,7 +28,7 @@ export default function Header(headerProps: ComponentProps<'header'>) {
alt='Convex Monorepo'
width={50}
height={50}
className='invert dark:invert-0'
className='invert dark:invert-0 w-15'
/>
<span
className={`mb-3 hidden font-extrabold lg:inline lg:text-5xl ${kanitSans.className}`}

View File

@@ -8,7 +8,7 @@ export default function UseSendProvider(config: EmailUserConfig): EmailConfig {
id: 'usesend',
type: 'email',
name: 'UseSend',
from: 'Study Buddy <admin@techtracker.gbrown.org>',
from: 'Convex Monorepo <admin@convexmonorepo.gbrown.org>',
maxAge: 24 * 60 * 60, // 24 hours
async generateVerificationToken() {
@@ -23,7 +23,7 @@ export default function UseSendProvider(config: EmailUserConfig): EmailConfig {
async sendVerificationRequest(params) {
const { identifier: to, provider, url, theme, token } = params;
//const { host } = new URL(url);
const host = 'TechTracker';
const host = 'Convex Monorepo';
const useSend = new UseSend(
process.env.USESEND_API_KEY!,

View File

@@ -1,24 +1,24 @@
'use client';
import type { ComponentProps } from 'react';
import { useEffect, useState } from 'react';
import { Moon, Sun } from 'lucide-react';
import { ThemeProvider as NextThemesProvider, useTheme } from 'next-themes';
import { Button, cn } from '@gib/ui';
import {
Button,
cn,
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
} from '@gib/ui';
const ThemeProvider = ({
children,
...props
}: ComponentProps<typeof NextThemesProvider>) => {
const [mounted, setMounted] = useState(false);
useEffect(() => {
setMounted(true);
}, []);
if (!mounted) return null;
return <NextThemesProvider {...props}>{children}</NextThemesProvider>;
return <NextThemesProvider {...props}>{children}</NextThemesProvider>
};
interface ThemeToggleProps {
@@ -27,44 +27,41 @@ interface ThemeToggleProps {
}
const ThemeToggle = ({ size = 1, buttonProps }: ThemeToggleProps) => {
const { setTheme, resolvedTheme } = useTheme();
const [mounted, setMounted] = useState(false);
useEffect(() => {
setMounted(true);
}, []);
if (!mounted) {
return (
<Button {...buttonProps}>
<span style={{ height: `${size}rem`, width: `${size}rem` }} />
</Button>
);
}
const toggleTheme = () => {
if (resolvedTheme === 'dark') setTheme('light');
else setTheme('dark');
};
const { setTheme } = useTheme();
return (
<Button
variant='outline'
size='icon'
{...buttonProps}
onClick={toggleTheme}
className={cn('cursor-pointer', buttonProps?.className)}
>
<Sun
style={{ height: `${size}rem`, width: `${size}rem` }}
className='scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90'
/>
<Moon
style={{ height: `${size}rem`, width: `${size}rem` }}
className='absolute scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0'
/>
</Button>
);
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button
variant="outline"
size="icon"
{...buttonProps}
className={cn('cursor-pointer', buttonProps?.className)}
>
<Sun
style={{ height: `${size}rem`, width: `${size}rem` }}
className='scale-100 rotate-0 transition-all dark:scale-0 dark:-rotate-90'
/>
<Moon
style={{ height: `${size}rem`, width: `${size}rem` }}
className='absolute scale-0 rotate-90 transition-all dark:scale-100 dark:rotate-0'
/>
<span className="sr-only">Toggle theme</span>
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
<DropdownMenuItem onClick={() => setTheme("light")}>
Light
</DropdownMenuItem>
<DropdownMenuItem onClick={() => setTheme("dark")}>
Dark
</DropdownMenuItem>
<DropdownMenuItem onClick={() => setTheme("system")}>
System
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
)
};
export { ThemeProvider, ThemeToggle, type ThemeToggleProps };