This repository has no description
0

Configure Feed

Select the types of activity you want to include in your feed.

semble / src / webapp / app / signup / page.tsx
2.0 kB 81 lines
1'use client'; 2 3import SignUpForm from '@/features/auth/components/signUpForm/SignUpForm'; 4import { Stack, Title, Text, Anchor, Image, Loader } from '@mantine/core'; 5import SembleLogo from '@/assets/semble-logo.svg'; 6import { useAuth } from '@/hooks/useAuth'; 7import { useEffect, useState } from 'react'; 8import { useRouter } from 'next/navigation'; 9 10export default function Page() { 11 const { isAuthenticated, isLoading } = useAuth(); 12 const [isRedirecting, setIsRedirecting] = useState(false); 13 const router = useRouter(); 14 15 useEffect(() => { 16 if (isAuthenticated) { 17 setIsRedirecting(true); 18 19 // redirect after 1 second 20 const id = setTimeout(() => { 21 router.push('/library'); 22 }, 1000); 23 } 24 }, [isAuthenticated, router]); 25 26 if (isLoading) { 27 return ( 28 <Stack align="center"> 29 <Loader type="dots" /> 30 </Stack> 31 ); 32 } 33 34 if (isRedirecting) { 35 return ( 36 <Stack align="center"> 37 <Text fw={500} fz={'xl'}> 38 Already logged in, redirecting you to library 39 </Text> 40 <Loader type="dots" /> 41 </Stack> 42 ); 43 } 44 45 return ( 46 <Stack align="center" gap="xl" maw={450}> 47 <Stack gap={0}> 48 <Stack gap={'xs'}> 49 <Image 50 src={SembleLogo.src} 51 alt="Semble logo" 52 w={48} 53 h={64.5} 54 mx={'auto'} 55 /> 56 <Title order={1} ta="center"> 57 Welcome 58 </Title> 59 </Stack> 60 <Text fz={'h3'} fw={700} ta={'center'} c={'stone'}> 61 Sign up to get started 62 </Text> 63 </Stack> 64 65 <Text fw={500} ta="center" maw={380}> 66 When you sign up today, youll create a Bluesky account. In near future, 67 your account will be seamlessly migrated to our{' '} 68 <Anchor 69 href="https://cosmik.network" 70 target="_blank" 71 fw={500} 72 c={'blue'} 73 > 74 Cosmik Network 75 </Anchor> 76 . 77 </Text> 78 <SignUpForm /> 79 </Stack> 80 ); 81}