diff --git a/apps/studio/components/interfaces/OrganizationInvite/OrganizationInvite.tsx b/apps/studio/components/interfaces/OrganizationInvite/OrganizationInvite.tsx index c40ea9d4cd3..5c4d67dbc88 100644 --- a/apps/studio/components/interfaces/OrganizationInvite/OrganizationInvite.tsx +++ b/apps/studio/components/interfaces/OrganizationInvite/OrganizationInvite.tsx @@ -5,7 +5,6 @@ import toast from 'react-hot-toast' import { useParams } from 'common' import { useOrganizationAcceptInvitationMutation } from 'data/organization-members/organization-invitation-accept-mutation' -import { useOrganizationDeleteInvitationMutation } from 'data/organization-members/organization-invitation-delete-mutation' import { useOrganizationInvitationTokenQuery } from 'data/organization-members/organization-invitation-token-query' import { useProfile } from 'lib/profile' import { ResponseError } from 'types' @@ -28,40 +27,24 @@ export const OrganizationInvite = () => { isError || (isSuccess && (data.token_does_not_exist || data.expired_token || !data.email_match)) const organizationName = data?.organization_name ?? name ?? 'an organization' - const loginRedirectLink = `/?returnTo=${encodeURIComponent(`/join?token=${token}&slug=${slug}`)}` + const loginRedirectLink = `/sign-in?returnTo=${encodeURIComponent(`/join?token=${token}&slug=${slug}`)}` const { mutate: joinOrganization, isLoading: isJoining } = useOrganizationAcceptInvitationMutation({ onSuccess: () => { - router.push('/') + router.push('/projects') }, onError: (error) => { toast.error(`Failed to join organization: ${error.message}`) }, }) - const { mutate: declineOrganization, isLoading: isDeclining } = - useOrganizationDeleteInvitationMutation({ - onSuccess: () => { - router.push('/') - }, - onError: (error) => { - toast.error(`Failed to decline invitation: ${error.message}`) - }, - }) - async function handleJoinOrganization() { if (!slug) return console.error('Slug is required') if (!token) return console.error('Token is required') joinOrganization({ slug, token }) } - async function handleDeclineJoinOrganization() { - if (!slug) return console.error('Slug is required') - if (!data?.invite_id) return console.error('Invite ID is required') - declineOrganization({ slug, id: data.invite_id }) - } - return (
@@ -96,18 +79,13 @@ export const OrganizationInvite = () => { )} {isSuccess && (
- - -
- )} - - {tokenInfoLoaded && } - - {!profile && ( -
-

- You will need to sign in to accept this invitation -

-
- - -
-
- )} -
- - - ) - - async function handleJoinOrganization() { - if (!slug) return console.error('Slug is required') - if (!token) return console.error('Token is required') - setIsSubmitting(true) - joinOrganization({ slug, token }) - } - - async function handleDeclineJoinOrganization() { - if (!slug) return console.error('Slug is required') - if (!invite_id) return console.error('Invite ID is required') - setIsSubmitting(true) - declineOrganization({ slug, invited_id: invite_id }) - } - - useEffect(() => { - const fetchTokenInfo = async () => { - if (!slug) return console.error('Slug is required') - if (!token) return console.error('Token is required') - - try { - const response = await validateTokenInformation({ slug, token }) - setTokenInfoLoaded(true) - setTokenValidationInfo(response) - } catch (error) { - setError(error) - setTokenInfoLoaded(true) - } - } - - if (!tokenInfoLoaded && token) { - fetchTokenInfo() - } - - /** - * if params are empty then redirect - * user to the homepage of app - */ - // if (!slug && !token) router.push('/') - }, [token, router.asPath]) - - return ( -
- - Supabase - -
- - - -
-
- ) -} diff --git a/apps/studio/data/organization-members/organization-invitation-accept-mutation.ts b/apps/studio/data/organization-members/organization-invitation-accept-mutation.ts index 600858ca3d5..39cc0b22d7d 100644 --- a/apps/studio/data/organization-members/organization-invitation-accept-mutation.ts +++ b/apps/studio/data/organization-members/organization-invitation-accept-mutation.ts @@ -1,7 +1,8 @@ -import { useMutation, UseMutationOptions } from '@tanstack/react-query' +import { useMutation, UseMutationOptions, useQueryClient } from '@tanstack/react-query' import { toast } from 'react-hot-toast' import { handleError, post } from 'data/fetchers' +import { invalidateOrganizationsQuery } from 'data/organizations/organizations-query' import type { ResponseError } from 'types' export type OrganizationAcceptInvitationVariables = { @@ -35,12 +36,16 @@ export const useOrganizationAcceptInvitationMutation = ({ >, 'mutationFn' > = {}) => { + const queryClient = useQueryClient() + return useMutation< OrganizationMemberUpdateData, ResponseError, OrganizationAcceptInvitationVariables >((vars) => acceptOrganizationInvitation(vars), { async onSuccess(data, variables, context) { + await invalidateOrganizationsQuery(queryClient) + await onSuccess?.(data, variables, context) }, async onError(data, variables, context) { diff --git a/apps/studio/pages/join.tsx b/apps/studio/pages/join.tsx index ea9ea00cf71..58f63aa217c 100644 --- a/apps/studio/pages/join.tsx +++ b/apps/studio/pages/join.tsx @@ -1,23 +1,12 @@ import Link from 'next/link' import { useRouter } from 'next/router' -import { useParams } from 'common' import { OrganizationInvite } from 'components/interfaces/OrganizationInvite/OrganizationInvite' -import { OrganizationInviteOld } from 'components/interfaces/OrganizationInvite/OrganizationInviteOld' -import { useIsOptedIntoProjectLevelPermissions } from 'hooks/ui/useFlag' import { NextPageWithLayout } from 'types' import { cn } from 'ui' const JoinOrganizationPage: NextPageWithLayout = () => { const router = useRouter() - const { slug } = useParams() - const isOptedIntoProjectLevelPermissions = useIsOptedIntoProjectLevelPermissions(slug as string) - - // [Joshen] Can remove this once API changes are deployed to production - // To double check whether existing invite flow works with the new endpoints - if (!isOptedIntoProjectLevelPermissions) { - return - } return (