feat: add billing switch. (#1789)
Co-authored-by: StyleZhang <jasonapring2015@outlook.com>
This commit is contained in:
@@ -10,12 +10,16 @@ import { contactSalesUrl } from '@/app/components/billing/config'
|
||||
|
||||
const CustomPage = () => {
|
||||
const { t } = useTranslation()
|
||||
const { plan } = useProviderContext()
|
||||
const { plan, enableBilling } = useProviderContext()
|
||||
|
||||
const showBillingTip = enableBilling && plan.type === Plan.sandbox
|
||||
const showCustomAppHeaderBrand = enableBilling && plan.type === Plan.sandbox
|
||||
const showContact = enableBilling && (plan.type === Plan.professional || plan.type === Plan.team)
|
||||
|
||||
return (
|
||||
<div className='flex flex-col'>
|
||||
{
|
||||
plan.type === Plan.sandbox && (
|
||||
showBillingTip && (
|
||||
<GridMask canvasClassName='!rounded-xl'>
|
||||
<div className='flex justify-between mb-1 px-6 py-5 h-[88px] shadow-md rounded-xl border-[0.5px] border-gray-200'>
|
||||
<div className={`${s.textGradient} leading-[24px] text-base font-semibold`}>
|
||||
@@ -29,7 +33,7 @@ const CustomPage = () => {
|
||||
}
|
||||
<CustomWebAppBrand />
|
||||
{
|
||||
plan.type === Plan.sandbox && (
|
||||
showCustomAppHeaderBrand && (
|
||||
<>
|
||||
<div className='my-2 h-[0.5px] bg-gray-100'></div>
|
||||
<CustomAppHeaderBrand />
|
||||
@@ -37,7 +41,7 @@ const CustomPage = () => {
|
||||
)
|
||||
}
|
||||
{
|
||||
(plan.type === Plan.professional || plan.type === Plan.team) && (
|
||||
showContact && (
|
||||
<div className='absolute bottom-0 h-[50px] leading-[50px] text-xs text-gray-500'>
|
||||
{t('custom.customize.prefix')}
|
||||
<a className='text-[#155EEF]' href={contactSalesUrl} target='_blank'>{t('custom.customize.contactUs')}</a>
|
||||
|
||||
@@ -24,7 +24,7 @@ const ALLOW_FILE_EXTENSIONS = ['svg', 'png']
|
||||
const CustomWebAppBrand = () => {
|
||||
const { t } = useTranslation()
|
||||
const { notify } = useToastContext()
|
||||
const { plan } = useProviderContext()
|
||||
const { plan, enableBilling } = useProviderContext()
|
||||
const {
|
||||
currentWorkspace,
|
||||
mutateCurrentWorkspace,
|
||||
@@ -32,10 +32,11 @@ const CustomWebAppBrand = () => {
|
||||
} = useAppContext()
|
||||
const [fileId, setFileId] = useState('')
|
||||
const [uploadProgress, setUploadProgress] = useState(0)
|
||||
const isSandbox = plan.type === Plan.sandbox
|
||||
const isSandbox = enableBilling && plan.type === Plan.sandbox
|
||||
const uploading = uploadProgress > 0 && uploadProgress < 100
|
||||
const webappLogo = currentWorkspace.custom_config?.replace_webapp_logo || ''
|
||||
const webappBrandRemoved = currentWorkspace.custom_config?.remove_webapp_brand
|
||||
const uploadDisabled = isSandbox || webappBrandRemoved || !isCurrentWorkspaceManager
|
||||
|
||||
const handleChange = (e: ChangeEvent<HTMLInputElement>) => {
|
||||
const file = e.target.files?.[0]
|
||||
@@ -153,9 +154,9 @@ const CustomWebAppBrand = () => {
|
||||
<Button
|
||||
className={`
|
||||
relative mr-2 !h-8 !px-3 bg-white !text-[13px]
|
||||
${isSandbox ? 'opacity-40' : ''}
|
||||
${uploadDisabled ? 'opacity-40' : ''}
|
||||
`}
|
||||
disabled={isSandbox || webappBrandRemoved || !isCurrentWorkspaceManager}
|
||||
disabled={uploadDisabled}
|
||||
>
|
||||
<ImagePlus className='mr-2 w-4 h-4' />
|
||||
{
|
||||
@@ -166,13 +167,13 @@ const CustomWebAppBrand = () => {
|
||||
<input
|
||||
className={`
|
||||
absolute block inset-0 opacity-0 text-[0] w-full
|
||||
${(isSandbox || webappBrandRemoved) ? 'cursor-not-allowed' : 'cursor-pointer'}
|
||||
${uploadDisabled ? 'cursor-not-allowed' : 'cursor-pointer'}
|
||||
`}
|
||||
onClick={e => (e.target as HTMLInputElement).value = ''}
|
||||
type='file'
|
||||
accept={ALLOW_FILE_EXTENSIONS.map(ext => `.${ext}`).join(',')}
|
||||
onChange={handleChange}
|
||||
disabled={isSandbox || webappBrandRemoved || !isCurrentWorkspaceManager}
|
||||
disabled={uploadDisabled}
|
||||
/>
|
||||
</Button>
|
||||
)
|
||||
@@ -213,9 +214,9 @@ const CustomWebAppBrand = () => {
|
||||
<Button
|
||||
className={`
|
||||
!h-8 !px-3 bg-white !text-[13px]
|
||||
${isSandbox ? 'opacity-40' : ''}
|
||||
${(uploadDisabled || (!webappLogo && !webappBrandRemoved)) ? 'opacity-40' : ''}
|
||||
`}
|
||||
disabled={isSandbox || (!webappLogo && !webappBrandRemoved) || webappBrandRemoved || !isCurrentWorkspaceManager}
|
||||
disabled={uploadDisabled || (!webappLogo && !webappBrandRemoved)}
|
||||
onClick={handleRestore}
|
||||
>
|
||||
{t('custom.restore')}
|
||||
|
||||
Reference in New Issue
Block a user