2021-03-12 05:23:46 -05:00
|
|
|
import EditMember from './edit-member'
|
|
|
|
import LinkSharing from './link-sharing'
|
|
|
|
import Invite from './invite'
|
|
|
|
import SendInvites from './send-invites'
|
|
|
|
import ViewMember from './view-member'
|
|
|
|
import OwnerInfo from './owner-info'
|
|
|
|
import SendInvitesNotice from './send-invites-notice'
|
2022-07-07 09:17:47 -04:00
|
|
|
import { useEditorContext } from '../../../shared/context/editor-context'
|
2021-06-25 04:13:17 -04:00
|
|
|
import { useProjectContext } from '../../../shared/context/project-context'
|
2021-08-19 11:42:49 -04:00
|
|
|
import { useSplitTestContext } from '../../../shared/context/split-test-context'
|
2022-07-15 09:44:47 -04:00
|
|
|
import { useMemo } from 'react'
|
2021-08-19 11:42:49 -04:00
|
|
|
import { Row } from 'react-bootstrap'
|
|
|
|
import PropTypes from 'prop-types'
|
2021-08-19 05:37:18 -04:00
|
|
|
import RecaptchaConditions from '../../../shared/components/recaptcha-conditions'
|
2021-03-12 05:23:46 -05:00
|
|
|
|
|
|
|
export default function ShareModalBody() {
|
2021-08-19 11:42:49 -04:00
|
|
|
const { splitTestVariants } = useSplitTestContext({
|
|
|
|
splitTestVariants: PropTypes.object,
|
|
|
|
})
|
2021-03-12 05:23:46 -05:00
|
|
|
|
2022-07-15 09:44:47 -04:00
|
|
|
const { members, invites, features } = useProjectContext()
|
2022-07-07 09:17:47 -04:00
|
|
|
const { isProjectOwner } = useEditorContext()
|
2022-07-15 09:44:47 -04:00
|
|
|
|
|
|
|
// whether the project has not reached the collaborator limit
|
|
|
|
const canAddCollaborators = useMemo(() => {
|
|
|
|
if (!isProjectOwner || !features) {
|
|
|
|
return false
|
|
|
|
}
|
|
|
|
|
|
|
|
if (features.collaborators === -1) {
|
|
|
|
// infinite collaborators
|
|
|
|
return true
|
|
|
|
}
|
|
|
|
|
|
|
|
return members.length + invites.length < features.collaborators
|
|
|
|
}, [members, invites, features, isProjectOwner])
|
2021-03-12 05:23:46 -05:00
|
|
|
|
2021-08-19 11:42:49 -04:00
|
|
|
switch (splitTestVariants['project-share-modal-paywall']) {
|
|
|
|
case 'new-copy-top':
|
|
|
|
return (
|
|
|
|
<>
|
2022-07-08 01:03:14 -04:00
|
|
|
{isProjectOwner ? (
|
2021-08-19 11:42:49 -04:00
|
|
|
<>
|
2022-07-15 09:44:47 -04:00
|
|
|
<SendInvites canAddCollaborators={canAddCollaborators} />
|
2021-08-19 11:42:49 -04:00
|
|
|
<Row className="public-access-level" />
|
|
|
|
</>
|
|
|
|
) : (
|
|
|
|
<SendInvitesNotice />
|
|
|
|
)}
|
|
|
|
|
|
|
|
<OwnerInfo />
|
|
|
|
|
2022-01-10 10:47:10 -05:00
|
|
|
{members.map(member =>
|
2022-07-08 01:03:14 -04:00
|
|
|
isProjectOwner ? (
|
2021-08-19 11:42:49 -04:00
|
|
|
<EditMember key={member._id} member={member} />
|
|
|
|
) : (
|
|
|
|
<ViewMember key={member._id} member={member} />
|
|
|
|
)
|
|
|
|
)}
|
|
|
|
|
2022-01-10 10:47:10 -05:00
|
|
|
{invites.map(invite => (
|
2022-07-08 01:03:14 -04:00
|
|
|
<Invite
|
|
|
|
key={invite._id}
|
|
|
|
invite={invite}
|
|
|
|
isProjectOwner={isProjectOwner}
|
|
|
|
/>
|
2021-08-19 11:42:49 -04:00
|
|
|
))}
|
|
|
|
|
2022-07-08 01:03:14 -04:00
|
|
|
{isProjectOwner && (
|
2021-08-19 11:42:49 -04:00
|
|
|
<>
|
|
|
|
<br />
|
2022-07-15 09:44:47 -04:00
|
|
|
<LinkSharing canAddCollaborators={canAddCollaborators} />
|
2021-08-19 11:42:49 -04:00
|
|
|
</>
|
|
|
|
)}
|
|
|
|
|
|
|
|
{!window.ExposedSettings.recaptchaDisabled?.invite && (
|
|
|
|
<RecaptchaConditions />
|
|
|
|
)}
|
|
|
|
</>
|
|
|
|
)
|
|
|
|
case 'new-copy-middle':
|
|
|
|
return (
|
|
|
|
<>
|
|
|
|
<OwnerInfo />
|
|
|
|
|
2022-01-10 10:47:10 -05:00
|
|
|
{members.map(member =>
|
2022-07-08 01:03:14 -04:00
|
|
|
isProjectOwner ? (
|
2021-08-19 11:42:49 -04:00
|
|
|
<EditMember key={member._id} member={member} />
|
|
|
|
) : (
|
|
|
|
<ViewMember key={member._id} member={member} />
|
|
|
|
)
|
|
|
|
)}
|
|
|
|
|
2022-01-10 10:47:10 -05:00
|
|
|
{invites.map(invite => (
|
2022-07-08 01:03:14 -04:00
|
|
|
<Invite
|
|
|
|
key={invite._id}
|
|
|
|
invite={invite}
|
|
|
|
isProjectOwner={isProjectOwner}
|
|
|
|
/>
|
2021-08-19 11:42:49 -04:00
|
|
|
))}
|
|
|
|
|
2022-07-15 09:44:47 -04:00
|
|
|
{isProjectOwner ? (
|
|
|
|
<SendInvites canAddCollaborators={canAddCollaborators} />
|
|
|
|
) : (
|
|
|
|
<SendInvitesNotice />
|
|
|
|
)}
|
2021-08-19 11:42:49 -04:00
|
|
|
|
2022-07-08 01:03:14 -04:00
|
|
|
{isProjectOwner && (
|
2021-08-19 11:42:49 -04:00
|
|
|
<>
|
|
|
|
<br />
|
2022-07-15 09:44:47 -04:00
|
|
|
<LinkSharing canAddCollaborators={canAddCollaborators} />
|
2021-08-19 11:42:49 -04:00
|
|
|
</>
|
|
|
|
)}
|
|
|
|
|
|
|
|
{!window.ExposedSettings.recaptchaDisabled?.invite && (
|
|
|
|
<RecaptchaConditions />
|
|
|
|
)}
|
|
|
|
</>
|
|
|
|
)
|
|
|
|
case 'new-copy-bottom':
|
|
|
|
case 'default':
|
|
|
|
default:
|
|
|
|
return (
|
|
|
|
<>
|
2022-07-15 09:44:47 -04:00
|
|
|
{isProjectOwner && (
|
|
|
|
<LinkSharing canAddCollaborators={canAddCollaborators} />
|
|
|
|
)}
|
2021-08-19 11:42:49 -04:00
|
|
|
|
|
|
|
<OwnerInfo />
|
|
|
|
|
2022-01-10 10:47:10 -05:00
|
|
|
{members.map(member =>
|
2022-07-08 01:03:14 -04:00
|
|
|
isProjectOwner ? (
|
2021-08-19 11:42:49 -04:00
|
|
|
<EditMember key={member._id} member={member} />
|
|
|
|
) : (
|
|
|
|
<ViewMember key={member._id} member={member} />
|
|
|
|
)
|
|
|
|
)}
|
|
|
|
|
2022-01-10 10:47:10 -05:00
|
|
|
{invites.map(invite => (
|
2022-07-08 01:03:14 -04:00
|
|
|
<Invite
|
|
|
|
key={invite._id}
|
|
|
|
invite={invite}
|
|
|
|
isProjectOwner={isProjectOwner}
|
|
|
|
/>
|
2021-08-19 11:42:49 -04:00
|
|
|
))}
|
|
|
|
|
2022-07-15 09:44:47 -04:00
|
|
|
{isProjectOwner ? (
|
|
|
|
<SendInvites canAddCollaborators={canAddCollaborators} />
|
|
|
|
) : (
|
|
|
|
<SendInvitesNotice />
|
|
|
|
)}
|
2021-08-19 11:42:49 -04:00
|
|
|
|
|
|
|
{!window.ExposedSettings.recaptchaDisabled?.invite && (
|
|
|
|
<RecaptchaConditions />
|
|
|
|
)}
|
|
|
|
</>
|
|
|
|
)
|
|
|
|
}
|
2021-03-12 05:23:46 -05:00
|
|
|
}
|