48 lines
1.4 KiB
TypeScript
48 lines
1.4 KiB
TypeScript
import { FunctionComponent, useRef } from 'react'
|
|
import { WebApplication } from '@/Application/WebApplication'
|
|
import { PremiumFeatureModalType } from './PremiumFeatureModalType'
|
|
import { FeatureName } from '@/Controllers/FeatureName'
|
|
import { SuccessPrompt } from './Subviews/SuccessPrompt'
|
|
import { UpgradePrompt } from './Subviews/UpgradePrompt'
|
|
import Modal from '../Modal/Modal'
|
|
|
|
type Props = {
|
|
application: WebApplication
|
|
featureName?: FeatureName | string
|
|
hasSubscription: boolean
|
|
onClose: () => void
|
|
type: PremiumFeatureModalType
|
|
}
|
|
|
|
const PremiumFeaturesModal: FunctionComponent<Props> = ({
|
|
application,
|
|
featureName,
|
|
hasSubscription,
|
|
onClose,
|
|
type = PremiumFeatureModalType.UpgradePrompt,
|
|
}) => {
|
|
const ctaButtonRef = useRef<HTMLButtonElement>(null)
|
|
|
|
return (
|
|
<Modal close={onClose} title="Upgrade" className="px-6 py-5" customHeader={<></>}>
|
|
<div tabIndex={-1} className="sn-component">
|
|
<div tabIndex={0}>
|
|
{type === PremiumFeatureModalType.UpgradePrompt && (
|
|
<UpgradePrompt
|
|
featureName={featureName}
|
|
ctaRef={ctaButtonRef}
|
|
application={application}
|
|
hasSubscription={hasSubscription}
|
|
onClose={onClose}
|
|
/>
|
|
)}
|
|
|
|
{type === PremiumFeatureModalType.UpgradeSuccess && <SuccessPrompt ctaRef={ctaButtonRef} onClose={onClose} />}
|
|
</div>
|
|
</div>
|
|
</Modal>
|
|
)
|
|
}
|
|
|
|
export default PremiumFeaturesModal
|