mirror of
https://github.com/langgenius/dify.git
synced 2026-01-26 05:32:12 +08:00
Signed-off-by: -LAN- <laipz8200@outlook.com> Co-authored-by: twwu <twwu@dify.ai> Co-authored-by: crazywoola <100913391+crazywoola@users.noreply.github.com> Co-authored-by: jyong <718720800@qq.com> Co-authored-by: Wu Tianwei <30284043+WTW0313@users.noreply.github.com> Co-authored-by: QuantumGhost <obelisk.reg+git@gmail.com> Co-authored-by: lyzno1 <yuanyouhuilyz@gmail.com> Co-authored-by: quicksand <quicksandzn@gmail.com> Co-authored-by: Jyong <76649700+JohnJyong@users.noreply.github.com> Co-authored-by: lyzno1 <92089059+lyzno1@users.noreply.github.com> Co-authored-by: zxhlyh <jasonapring2015@outlook.com> Co-authored-by: Yongtao Huang <yongtaoh2022@gmail.com> Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com> Co-authored-by: Joel <iamjoel007@gmail.com> Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> Co-authored-by: nite-knite <nkCoding@gmail.com> Co-authored-by: Hanqing Zhao <sherry9277@gmail.com> Co-authored-by: gemini-code-assist[bot] <176961590+gemini-code-assist[bot]@users.noreply.github.com> Co-authored-by: Harry <xh001x@hotmail.com>
54 lines
1.8 KiB
TypeScript
54 lines
1.8 KiB
TypeScript
import React from 'react'
|
|
import type { BasicPlan } from '../../../type'
|
|
import { Plan } from '../../../type'
|
|
import cn from '@/utils/classnames'
|
|
import { RiArrowRightLine } from '@remixicon/react'
|
|
|
|
const BUTTON_CLASSNAME = {
|
|
[Plan.sandbox]: {
|
|
btnClassname: 'bg-components-button-tertiary-bg hover:bg-components-button-tertiary-bg-hover text-text-primary',
|
|
btnDisabledClassname: 'bg-components-button-tertiary-bg-disabled hover:bg-components-button-tertiary-bg-disabled text-text-disabled',
|
|
},
|
|
[Plan.professional]: {
|
|
btnClassname: 'bg-saas-dify-blue-static hover:bg-saas-dify-blue-static-hover text-text-primary-on-surface',
|
|
btnDisabledClassname: 'bg-components-button-tertiary-bg-disabled hover:bg-components-button-tertiary-bg-disabled text-text-disabled',
|
|
},
|
|
[Plan.team]: {
|
|
btnClassname: 'bg-saas-background-inverted hover:bg-saas-background-inverted-hover text-background-default',
|
|
btnDisabledClassname: 'bg-components-button-tertiary-bg-disabled hover:bg-components-button-tertiary-bg-disabled text-text-disabled',
|
|
},
|
|
}
|
|
|
|
type ButtonProps = {
|
|
plan: BasicPlan
|
|
isPlanDisabled: boolean
|
|
btnText: string
|
|
handleGetPayUrl: () => void
|
|
}
|
|
|
|
const Button = ({
|
|
plan,
|
|
isPlanDisabled,
|
|
btnText,
|
|
handleGetPayUrl,
|
|
}: ButtonProps) => {
|
|
return (
|
|
<button
|
|
type='button'
|
|
disabled={isPlanDisabled}
|
|
className={cn(
|
|
'system-xl-semibold flex items-center gap-x-2 py-3 pl-5 pr-4',
|
|
BUTTON_CLASSNAME[plan].btnClassname,
|
|
isPlanDisabled && BUTTON_CLASSNAME[plan].btnDisabledClassname,
|
|
isPlanDisabled && 'cursor-not-allowed',
|
|
)}
|
|
onClick={handleGetPayUrl}
|
|
>
|
|
<span className='grow text-start'>{btnText}</span>
|
|
{!isPlanDisabled && <RiArrowRightLine className='size-5 shrink-0' />}
|
|
</button>
|
|
)
|
|
}
|
|
|
|
export default React.memo(Button)
|