feat: implement logged in organization joining + improvements

This commit is contained in:
swve 2024-06-06 16:45:22 +01:00
parent 25ac82f4ad
commit 693a28721d
19 changed files with 200 additions and 29 deletions

View file

@ -16,6 +16,8 @@ import { validateInviteCode } from '@services/organizations/invites'
import PageLoading from '@components/Objects/Loaders/PageLoading'
import Toast from '@components/StyledElements/Toast/Toast'
import toast from 'react-hot-toast'
import { BarLoader } from 'react-spinners'
import { joinOrg } from '@services/organizations/orgs'
interface SignUpClientProps {
org: any
@ -97,7 +99,7 @@ function SignUpClient(props: SignUpClientProps) {
{joinMethod == 'inviteOnly' &&
(inviteCode ? (
session.status == 'authenticated' ? (
<LoggedInJoinScreen />
<LoggedInJoinScreen inviteCode={inviteCode} />
) : (
<InviteOnlySignUpComponent inviteCode={inviteCode} />
)
@ -112,7 +114,30 @@ function SignUpClient(props: SignUpClientProps) {
const LoggedInJoinScreen = (props: any) => {
const session = useLHSession() as any
const org = useOrg() as any
const invite_code = props.inviteCode
const [isLoading, setIsLoading] = React.useState(true)
const [isSumbitting, setIsSubmitting] = React.useState(false)
const router = useRouter()
const join = async () => {
setIsSubmitting(true)
const res = await joinOrg({ org_id: org.id, user_id: session?.data?.user?.id, invite_code: props.inviteCode }, null, session.data?.tokens?.access_token)
//wait for 1s
if (res.success) {
toast.success(
res.data
)
setTimeout(() => {
router.push(`/`)
}, 2000)
setIsSubmitting(false)
} else {
toast.error(res.data.detail)
setIsLoading(false)
setIsSubmitting(false)
}
}
useEffect(() => {
if (session && org) {
@ -122,6 +147,7 @@ const LoggedInJoinScreen = (props: any) => {
return (
<div className="flex flex-row items-center mx-auto">
<Toast />
<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>
@ -131,9 +157,13 @@ const LoggedInJoinScreen = (props: any) => {
</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 onClick={() => join()} className="flex w-fit h-[35px] space-x-2 bg-black px-6 py-2 text-md rounded-lg font-semibold h-fit text-white items-center shadow-md">
{isSumbitting ? <BarLoader
cssOverride={{ borderRadius: 60 }}
width={60}
color="#ffffff"
/> : <><UserPlus size={18} />
<p>Join </p></>}
</button>
</div>
</div>
@ -154,7 +184,7 @@ const NoTokenScreen = (props: any) => {
const validateCode = async () => {
setIsLoading(true)
let res = await validateInviteCode(org?.id, inviteCode,session?.user?.tokens.access_token)
let res = await validateInviteCode(org?.id, inviteCode, session?.user?.tokens.access_token)
//wait for 1s
if (res.success) {
toast.success(