fix: signup remaining bugs

This commit is contained in:
swve 2024-01-25 23:49:29 +01:00
parent 0d775a0fe9
commit fdd21c2eda
4 changed files with 57 additions and 51 deletions

View file

@ -240,12 +240,14 @@ async def delete_invite_code(
) )
# Delete invite code # Delete invite code
invite_code = r.delete(f"{invite_code_uuid}:org:{org.org_uuid}:code:*") keys = r.keys(f"{invite_code_uuid}:org:{org.org_uuid}:code:*")
if keys:
r.delete(*keys)
if not invite_code: if not keys:
raise HTTPException( raise HTTPException(
status_code=404, status_code=404,
detail="Invite code not found", detail="Invite code not found",
) )
return invite_code return keys

View file

@ -12,7 +12,7 @@ export async function generateMetadata(
): Promise<Metadata> { ): Promise<Metadata> {
const orgslug = params.orgslug; const orgslug = params.orgslug;
// Get Org context information // Get Org context information
const org = await getOrganizationContextInfo(orgslug, { revalidate: 1800, tags: ['organizations'] }); const org = await getOrganizationContextInfo(orgslug, { revalidate: 0, tags: ['organizations'] });
return { return {
title: 'Login' + `${org.name}`, title: 'Login' + `${org.name}`,
@ -21,7 +21,7 @@ export async function generateMetadata(
const Login = async (params: any) => { const Login = async (params: any) => {
const orgslug = params.params.orgslug; const orgslug = params.params.orgslug;
const org = await getOrganizationContextInfo(orgslug, { revalidate: 1800, tags: ['organizations'] }); const org = await getOrganizationContextInfo(orgslug, { revalidate: 0, tags: ['organizations'] });
return ( return (
<div> <div>

View file

@ -15,7 +15,7 @@ export async function generateMetadata(
): Promise<Metadata> { ): Promise<Metadata> {
const orgslug = params.orgslug; const orgslug = params.orgslug;
// Get Org context information // Get Org context information
const org = await getOrganizationContextInfo(orgslug, { revalidate: 1800, tags: ['organizations'] }); const org = await getOrganizationContextInfo(orgslug, { revalidate: 0, tags: ['organizations'] });
return { return {
title: 'Sign up' + `${org.name}`, title: 'Sign up' + `${org.name}`,
@ -24,7 +24,7 @@ export async function generateMetadata(
const SignUp = async (params: any) => { const SignUp = async (params: any) => {
const orgslug = params.params.orgslug; const orgslug = params.params.orgslug;
const org = await getOrganizationContextInfo(orgslug, { revalidate: 1800, tags: ['organizations'] }); const org = await getOrganizationContextInfo(orgslug, { revalidate: 0, tags: ['organizations'] });
return ( return (
<> <>

View file

@ -19,28 +19,28 @@ import toast from "react-hot-toast";
interface SignUpClientProps { interface SignUpClientProps {
org: any; org: any;
} }
function SignUpClient(props : SignUpClientProps) { function SignUpClient(props: SignUpClientProps) {
const session = useSession() as any; const session = useSession() as any;
const [joinMethod, setJoinMethod] = React.useState('open'); const [joinMethod, setJoinMethod] = React.useState('open');
const [inviteCode , setInviteCode] = React.useState(''); const [inviteCode, setInviteCode] = React.useState('');
const searchParams = useSearchParams() const searchParams = useSearchParams()
const inviteCodeParam = searchParams.get('inviteCode') const inviteCodeParam = searchParams.get('inviteCode')
useEffect(() => { useEffect(() => {
if (props.org.config){ if (props.org.config) {
setJoinMethod(props.org?.config?.config?.GeneralConfig.users.signup_mechanism); setJoinMethod(props.org?.config?.config?.GeneralConfig.users.signup_mechanism);
console.log(props.org?.config?.config?.GeneralConfig.users.signup_mechanism) console.log(props.org?.config?.config?.GeneralConfig.users.signup_mechanism)
} }
if (inviteCodeParam){ if (inviteCodeParam) {
setInviteCode(inviteCodeParam); setInviteCode(inviteCodeParam);
} }
} }
, [props.org,inviteCodeParam]); , [props.org, inviteCodeParam]);
return ( 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="right-login-part" style={{ background: "linear-gradient(041.61deg, #202020 7.15%, #000000 90.96%)" }} >
<div className='login-topbar m-10'> <div className='login-topbar m-10'>
<Link prefetch href={getUriWithOrg(props.org.slug, "/")}> <Link prefetch href={getUriWithOrg(props.org.slug, "/")}>
@ -67,13 +67,17 @@ function SignUpClient(props : SignUpClientProps) {
</div> </div>
</div> </div>
<div className="left-join-part bg-white flex flex-row"> <div className="left-join-part bg-white flex flex-row">
{joinMethod == 'open' && <OpenSignUpComponent />} {joinMethod == 'open' && (
{joinMethod == 'inviteOnly' && inviteCode && session.isAuthenticated && <LoggedInJoinScreen />} session.isAuthenticated ? <LoggedInJoinScreen inviteCode={inviteCode} /> : <OpenSignUpComponent />
{joinMethod == 'inviteOnly' && inviteCode && !session.isAuthenticated && <InviteOnlySignUpComponent inviteCode={inviteCode} />} )}
{joinMethod == 'inviteOnly' && !inviteCode && <NoTokenScreen />} {joinMethod == 'inviteOnly' && (
inviteCode ? (
session.isAuthenticated ? <LoggedInJoinScreen /> : <InviteOnlySignUpComponent inviteCode={inviteCode} />
) : <NoTokenScreen />
)}
</div> </div>
</div> </div>
) )
} }
@ -86,29 +90,29 @@ const LoggedInJoinScreen = (props: any) => {
const [isLoading, setIsLoading] = React.useState(true); const [isLoading, setIsLoading] = React.useState(true);
useEffect(() => { useEffect(() => {
if(session && org){ if (session && org) {
setIsLoading(false); setIsLoading(false);
} }
} }
, [org, session]); , [org, session]);
return ( return (
<div className="flex flex-row items-center mx-auto"> <div className="flex flex-row items-center mx-auto">
<div className="flex space-y-7 flex-col justify-center items-center"> <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'> <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='items-center'>Hi</span>
<span className='capitalize flex space-x-2 items-center'> <span className='capitalize flex space-x-2 items-center'>
<UserAvatar rounded='rounded-xl' border='border-4' width={35} /> <UserAvatar rounded='rounded-xl' border='border-4' width={35} />
<span>{session.user.username},</span> <span>{session.user.username},</span>
</span> </span>
<span>join {org?.name} ?</span> <span>join {org?.name} ?</span>
</p> </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"> <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} /> <UserPlus size={18} />
<p>Join </p> <p>Join </p>
</button> </button>
</div> </div>
</div> </div>
) )
@ -120,7 +124,7 @@ const NoTokenScreen = (props: any) => {
const org = useOrg() as any; const org = useOrg() as any;
const router = useRouter(); const router = useRouter();
const [isLoading, setIsLoading] = React.useState(true); const [isLoading, setIsLoading] = React.useState(true);
const [inviteCode , setInviteCode] = React.useState(''); const [inviteCode, setInviteCode] = React.useState('');
const [messsage, setMessage] = React.useState('bruh'); const [messsage, setMessage] = React.useState('bruh');
const handleInviteCodeChange = (e: any) => { const handleInviteCodeChange = (e: any) => {
@ -129,12 +133,12 @@ const NoTokenScreen = (props: any) => {
const validateCode = async () => { const validateCode = async () => {
setIsLoading(true); setIsLoading(true);
let res = await validateInviteCode(org?.id,inviteCode); let res = await validateInviteCode(org?.id, inviteCode);
//wait for 1s //wait for 1s
if (res.success) { 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(() => { setTimeout(() => {
router.push(`/signup?inviteCode=${inviteCode}`); router.push(`/signup?inviteCode=${inviteCode}`);
}, 2000); }, 2000);
} }
else { else {
@ -146,28 +150,28 @@ const NoTokenScreen = (props: any) => {
useEffect(() => { useEffect(() => {
if(session && org){ if (session && org) {
setIsLoading(false); setIsLoading(false);
} }
} }
, [org, session]); , [org, session]);
return ( return (
<div className="flex flex-row items-center mx-auto"> <div className="flex flex-row items-center mx-auto">
<Toast /> <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"> {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"> <p className="flex space-x-2 text-lg font-medium text-red-800 items-center">
<MailWarning size={18} /> <MailWarning size={18} />
<span>An invite code is required to join {org?.name}</span> <span>An invite code is required to join {org?.name}</span>
</p> </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" /> <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"> <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} /> <Shield size={18} />
<p>Submit </p> <p>Submit </p>
</button> </button>
</div> } </div>}
</div> </div>
) )
} }