overleaf/services/web/frontend/js/features/share-project-modal/components/restricted-link-sharing/view-only-access-modal-content.tsx

56 lines
1.4 KiB
TypeScript
Raw Normal View History

import { Button, Modal } from 'react-bootstrap'
import { useTranslation } from 'react-i18next'
import { sendMB } from '@/infrastructure/event-tracking'
type ViewOnlyAccessModalContentProps = {
handleHide: () => void
}
export default function ViewOnlyAccessModalContent({
handleHide,
}: ViewOnlyAccessModalContentProps) {
const { t } = useTranslation()
return (
<>
<Modal.Header closeButton>
<Modal.Title>{t('view_only_access')}</Modal.Title>
</Modal.Header>
<Modal.Body>
<p>{t('this_project_already_has_maximum_editors')}</p>
<p>{t('please_ask_the_project_owner_to_upgrade_more_editors')}</p>
</Modal.Body>
<Modal.Footer>
<Button
bsStyle={null}
className="btn-secondary"
href="/blog/changes-to-project-sharing"
target="_blank"
rel="noreferrer"
onClick={() => {
sendMB('notification-click', {
name: 'link-sharing-collaborator-limit',
button: 'learn',
})
}}
>
{t('learn_more')}
</Button>
<Button
className="btn-primary"
onClick={() => {
sendMB('notification-click', {
name: 'link-sharing-collaborator-limit',
button: 'ok',
})
handleHide()
}}
>
{t('ok')}
</Button>
</Modal.Footer>
</>
)
}