mirror of
https://github.com/overleaf/overleaf.git
synced 2024-12-09 01:34:32 -05:00
d4bf47932e
* [web] Wiring work for `/subscription/invites/:token` BS5 migration * [web] Add SCSS for .enrollment-invite * [web] Update invite_logged_out PUG file for BS5 * [web] Update `GroupInviteViews` (and children) to BS5 * [web] Update `InviteManaged` to BS5 * [web] Update Logout button * [web] Update subtitles This removes the `text-overflow:ellipsis`. I think it's better without it, because it can be an accessibility issue. * [web] Add margin on inner-card * [web] Style action buttons in InviteManaged * [web] Add missing container around Row This was causing the row to overflow the body. Increased the col width to compensate. * [web] Fixup lint * [web] Fix `ManagedUserCannotJoin` title in BS3 (!) I checked all the other `OLNotification`: we don't use `title` anywhere else * [web] Put title in OLNotification content See https://github.com/overleaf/internal/pull/20640#discussion_r1777551257 * [web] Use translations for "aria-label="Email address"" * [web] Handle OLButton `isLoading` in `bs3Props` * [web] Remove duplicated `btn` class * [web] Add margin-bottom to InviteManaged title and fix logout button CSS in BS3 * [web] Adjust col class in Pug file for BS3 and BS5 * [web] Revert migration to OLNotification Revert back to `@/shared/components/notification` * [web] Add note to remove .team-invite-name after BS5 migration * [web] Set `btn-link-logout` in BS3 only * [web] Update OLButton so other classNames automatically get passed to the BS3 implementation * [web] Revert OLButton changes for BS3 classnames Co-authored-by: Rebeka <rebeka.dekany@overleaf.com> * [web] Update services/web/modules/group-settings/frontend/js/components/invite-managed.tsx Co-authored-by: ilkin-overleaf <100852799+ilkin-overleaf@users.noreply.github.com> * [web] Use OLFormGroup `controlId` --------- Co-authored-by: Rebeka <rebeka.dekany@overleaf.com> Co-authored-by: ilkin-overleaf <100852799+ilkin-overleaf@users.noreply.github.com> GitOrigin-RevId: 64b3f79c83002a9c9585bfb8e344e80b2e8eac5c
74 lines
1.9 KiB
TypeScript
74 lines
1.9 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'
|
|
import OLButton from '@/features/ui/components/ol/ol-button'
|
|
|
|
export default function JoinGroup({
|
|
setView,
|
|
}: {
|
|
setView: Dispatch<SetStateAction<InviteViewTypes>>
|
|
}) {
|
|
const { t } = useTranslation()
|
|
const expired = getMeta('ol-expired')
|
|
const inviteToken = getMeta('ol-inviteToken')
|
|
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>
|
|
|
|
<OLButton
|
|
variant="primary"
|
|
onClick={() => joinTeam()}
|
|
disabled={isJoining}
|
|
>
|
|
{t('accept_invitation')}
|
|
</OLButton>
|
|
</p>
|
|
)}
|
|
</div>
|
|
</>
|
|
)
|
|
}
|