mirror of
https://github.com/overleaf/overleaf.git
synced 2024-12-09 21:46:35 -05:00
c6b88085d5
[web] Migrate team invite to React GitOrigin-RevId: 32e968c3b512020aef9a396808c73a7b4859e6d1
73 lines
1.8 KiB
TypeScript
73 lines
1.8 KiB
TypeScript
import { Dispatch, SetStateAction, useCallback } from 'react'
|
|
import { useTranslation } from 'react-i18next'
|
|
import { InviteViewTypes } from './group-invite'
|
|
import getMeta from '@/utils/meta'
|
|
import { FetchError, putJSON } from '@/infrastructure/fetch-json'
|
|
import useAsync from '@/shared/hooks/use-async'
|
|
import classNames from 'classnames'
|
|
import { debugConsole } from '@/utils/debugging'
|
|
import Notification from '@/shared/components/notification'
|
|
|
|
export default function JoinGroup({
|
|
setView,
|
|
}: {
|
|
setView: Dispatch<SetStateAction<InviteViewTypes>>
|
|
}) {
|
|
const { t } = useTranslation()
|
|
const expired = getMeta('ol-expired') as boolean
|
|
const inviteToken = getMeta('ol-inviteToken') as string
|
|
const {
|
|
runAsync,
|
|
isLoading: isJoining,
|
|
isError,
|
|
} = useAsync<never, FetchError>()
|
|
|
|
const notNowBtnClasses = classNames(
|
|
'btn',
|
|
'btn-secondary',
|
|
isJoining ? 'disabled' : ''
|
|
)
|
|
|
|
const joinTeam = useCallback(() => {
|
|
runAsync(putJSON(`/subscription/invites/${inviteToken}`))
|
|
.then(() => {
|
|
setView('invite-accepted')
|
|
})
|
|
.catch(debugConsole.error)
|
|
}, [inviteToken, runAsync, setView])
|
|
|
|
if (!inviteToken) {
|
|
return null
|
|
}
|
|
|
|
return (
|
|
<>
|
|
{isError && (
|
|
<Notification
|
|
type="error"
|
|
content={t('generic_something_went_wrong')}
|
|
className="my-3"
|
|
/>
|
|
)}
|
|
|
|
<div className="text-center">
|
|
<p>{t('join_team_explanation')}</p>
|
|
{!expired && (
|
|
<p>
|
|
<a className={notNowBtnClasses} href="/project">
|
|
{t('not_now')}
|
|
</a>
|
|
|
|
<button
|
|
className="btn btn-primary"
|
|
onClick={() => joinTeam()}
|
|
disabled={isJoining}
|
|
>
|
|
{t('accept_invitation')}
|
|
</button>
|
|
</p>
|
|
)}
|
|
</div>
|
|
</>
|
|
)
|
|
}
|