mirror of
https://github.com/rzmk/learnhouse.git
synced 2025-12-19 04:19:25 +00:00
fix: signup remaining bugs
This commit is contained in:
swve
parent
0d775a0fe9
commit
fdd21c2eda
4 changed files with 57 additions and 51 deletions
|
|
@ -19,28 +19,28 @@ import toast from "react-hot-toast";
|
|||
|
||||
interface SignUpClientProps {
|
||||
org: any;
|
||||
}
|
||||
}
|
||||
|
||||
function SignUpClient(props : SignUpClientProps) {
|
||||
function SignUpClient(props: SignUpClientProps) {
|
||||
const session = useSession() as any;
|
||||
const [joinMethod, setJoinMethod] = React.useState('open');
|
||||
const [inviteCode , setInviteCode] = React.useState('');
|
||||
const [inviteCode, setInviteCode] = React.useState('');
|
||||
const searchParams = useSearchParams()
|
||||
const inviteCodeParam = searchParams.get('inviteCode')
|
||||
|
||||
useEffect(() => {
|
||||
if (props.org.config){
|
||||
if (props.org.config) {
|
||||
setJoinMethod(props.org?.config?.config?.GeneralConfig.users.signup_mechanism);
|
||||
console.log(props.org?.config?.config?.GeneralConfig.users.signup_mechanism)
|
||||
}
|
||||
if (inviteCodeParam){
|
||||
if (inviteCodeParam) {
|
||||
setInviteCode(inviteCodeParam);
|
||||
}
|
||||
}
|
||||
, [props.org,inviteCodeParam]);
|
||||
, [props.org, inviteCodeParam]);
|
||||
|
||||
return (
|
||||
<div className='grid grid-flow-col justify-stretch h-screen'>
|
||||
<div className='grid grid-flow-col justify-stretch h-screen'>
|
||||
<div className="right-login-part" style={{ background: "linear-gradient(041.61deg, #202020 7.15%, #000000 90.96%)" }} >
|
||||
<div className='login-topbar m-10'>
|
||||
<Link prefetch href={getUriWithOrg(props.org.slug, "/")}>
|
||||
|
|
@ -67,13 +67,17 @@ function SignUpClient(props : SignUpClientProps) {
|
|||
</div>
|
||||
</div>
|
||||
<div className="left-join-part bg-white flex flex-row">
|
||||
{joinMethod == 'open' && <OpenSignUpComponent />}
|
||||
{joinMethod == 'inviteOnly' && inviteCode && session.isAuthenticated && <LoggedInJoinScreen />}
|
||||
{joinMethod == 'inviteOnly' && inviteCode && !session.isAuthenticated && <InviteOnlySignUpComponent inviteCode={inviteCode} />}
|
||||
{joinMethod == 'inviteOnly' && !inviteCode && <NoTokenScreen />}
|
||||
{joinMethod == 'open' && (
|
||||
session.isAuthenticated ? <LoggedInJoinScreen inviteCode={inviteCode} /> : <OpenSignUpComponent />
|
||||
)}
|
||||
{joinMethod == 'inviteOnly' && (
|
||||
inviteCode ? (
|
||||
session.isAuthenticated ? <LoggedInJoinScreen /> : <InviteOnlySignUpComponent inviteCode={inviteCode} />
|
||||
) : <NoTokenScreen />
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -86,29 +90,29 @@ const LoggedInJoinScreen = (props: any) => {
|
|||
const [isLoading, setIsLoading] = React.useState(true);
|
||||
|
||||
useEffect(() => {
|
||||
if(session && org){
|
||||
if (session && org) {
|
||||
setIsLoading(false);
|
||||
}
|
||||
|
||||
}
|
||||
, [org, session]);
|
||||
|
||||
}
|
||||
, [org, session]);
|
||||
|
||||
|
||||
return (
|
||||
<div className="flex flex-row items-center mx-auto">
|
||||
<div className="flex space-y-7 flex-col justify-center items-center">
|
||||
<p className='pt-3 text-2xl font-semibold text-black/70 flex justify-center space-x-2 items-center'>
|
||||
<span className='items-center'>Hi</span>
|
||||
<span className='capitalize flex space-x-2 items-center'>
|
||||
<p className='pt-3 text-2xl font-semibold text-black/70 flex justify-center space-x-2 items-center'>
|
||||
<span className='items-center'>Hi</span>
|
||||
<span className='capitalize flex space-x-2 items-center'>
|
||||
<UserAvatar rounded='rounded-xl' border='border-4' width={35} />
|
||||
<span>{session.user.username},</span>
|
||||
</span>
|
||||
<span>join {org?.name} ?</span>
|
||||
</p>
|
||||
<button className="flex w-fit space-x-2 bg-black px-6 py-2 text-md rounded-lg font-semibold h-fit text-white items-center shadow-md">
|
||||
<span>{session.user.username},</span>
|
||||
</span>
|
||||
<span>join {org?.name} ?</span>
|
||||
</p>
|
||||
<button className="flex w-fit space-x-2 bg-black px-6 py-2 text-md rounded-lg font-semibold h-fit text-white items-center shadow-md">
|
||||
<UserPlus size={18} />
|
||||
<p>Join </p>
|
||||
</button>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
|
@ -120,7 +124,7 @@ const NoTokenScreen = (props: any) => {
|
|||
const org = useOrg() as any;
|
||||
const router = useRouter();
|
||||
const [isLoading, setIsLoading] = React.useState(true);
|
||||
const [inviteCode , setInviteCode] = React.useState('');
|
||||
const [inviteCode, setInviteCode] = React.useState('');
|
||||
const [messsage, setMessage] = React.useState('bruh');
|
||||
|
||||
const handleInviteCodeChange = (e: any) => {
|
||||
|
|
@ -129,12 +133,12 @@ const NoTokenScreen = (props: any) => {
|
|||
|
||||
const validateCode = async () => {
|
||||
setIsLoading(true);
|
||||
let res = await validateInviteCode(org?.id,inviteCode);
|
||||
let res = await validateInviteCode(org?.id, inviteCode);
|
||||
//wait for 1s
|
||||
if (res.success) {
|
||||
toast.success("Invite code is valid, you'll be redirected to the signup page in a few seconds");
|
||||
toast.success("Invite code is valid, you'll be redirected to the signup page in a few seconds");
|
||||
setTimeout(() => {
|
||||
router.push(`/signup?inviteCode=${inviteCode}`);
|
||||
router.push(`/signup?inviteCode=${inviteCode}`);
|
||||
}, 2000);
|
||||
}
|
||||
else {
|
||||
|
|
@ -146,28 +150,28 @@ const NoTokenScreen = (props: any) => {
|
|||
|
||||
|
||||
useEffect(() => {
|
||||
if(session && org){
|
||||
if (session && org) {
|
||||
setIsLoading(false);
|
||||
}
|
||||
|
||||
}
|
||||
, [org, session]);
|
||||
|
||||
}
|
||||
, [org, session]);
|
||||
|
||||
return (
|
||||
<div className="flex flex-row items-center mx-auto">
|
||||
<Toast />
|
||||
{isLoading ? <div className="flex space-y-7 flex-col w-[300px] justify-center items-center"><PageLoading /></div> : <div className="flex space-y-7 flex-col justify-center items-center">
|
||||
|
||||
<p className="flex space-x-2 text-lg font-medium text-red-800 items-center">
|
||||
<MailWarning size={18} />
|
||||
<span>An invite code is required to join {org?.name}</span>
|
||||
</p>
|
||||
<input onChange={handleInviteCodeChange} className="bg-white outline-2 outline outline-gray-200 rounded-lg px-5 w-[300px] h-[50px]" placeholder="Please enter an invite code" type="text" />
|
||||
<button onClick={validateCode} className="flex w-fit space-x-2 bg-black px-6 py-2 text-md rounded-lg font-semibold h-fit text-white items-center shadow-md">
|
||||
<Toast />
|
||||
{isLoading ? <div className="flex space-y-7 flex-col w-[300px] justify-center items-center"><PageLoading /></div> : <div className="flex space-y-7 flex-col justify-center items-center">
|
||||
|
||||
<p className="flex space-x-2 text-lg font-medium text-red-800 items-center">
|
||||
<MailWarning size={18} />
|
||||
<span>An invite code is required to join {org?.name}</span>
|
||||
</p>
|
||||
<input onChange={handleInviteCodeChange} className="bg-white outline-2 outline outline-gray-200 rounded-lg px-5 w-[300px] h-[50px]" placeholder="Please enter an invite code" type="text" />
|
||||
<button onClick={validateCode} className="flex w-fit space-x-2 bg-black px-6 py-2 text-md rounded-lg font-semibold h-fit text-white items-center shadow-md">
|
||||
<Shield size={18} />
|
||||
<p>Submit </p>
|
||||
</button>
|
||||
</div> }
|
||||
</button>
|
||||
</div>}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue