64 lines
1.7 KiB
TypeScript
Executable File
64 lines
1.7 KiB
TypeScript
Executable File
import {LockIcon} from '@common/icons/material/Lock';
|
|
import {Trans} from '@common/i18n/trans';
|
|
import {DialogTrigger} from '@common/ui/overlays/dialog/dialog-trigger';
|
|
import {ReactNode} from 'react';
|
|
import {Tooltip} from '@common/ui/tooltip/tooltip';
|
|
import {useSettings} from '@common/core/settings/use-settings';
|
|
import {FeatureLockedDialog} from '@common/billing/upgrade/feature-locked-dialog';
|
|
import clsx from 'clsx';
|
|
import {IconButton} from '@common/ui/buttons/icon-button';
|
|
import {Button} from '@common/ui/buttons/button';
|
|
|
|
interface UpgradeButtonProps {
|
|
message?: ReactNode;
|
|
className?: string;
|
|
iconButton?: boolean;
|
|
}
|
|
export function NoPermissionButton({
|
|
message,
|
|
className,
|
|
iconButton,
|
|
}: UpgradeButtonProps) {
|
|
const {billing} = useSettings();
|
|
|
|
if (!billing.enable) {
|
|
return <GenericButton className={className} />;
|
|
}
|
|
|
|
return (
|
|
<DialogTrigger type="popover" triggerOnHover>
|
|
{iconButton ? (
|
|
<IconButton className={className} color="primary" size="sm">
|
|
<LockIcon />
|
|
</IconButton>
|
|
) : (
|
|
<Button
|
|
variant="flat"
|
|
color="primary"
|
|
size="2xs"
|
|
startIcon={<LockIcon />}
|
|
className={className}
|
|
>
|
|
<Trans message="Upgrade" />
|
|
</Button>
|
|
)}
|
|
<FeatureLockedDialog message={message} />
|
|
</DialogTrigger>
|
|
);
|
|
}
|
|
|
|
interface GenericButtonProps {
|
|
className?: string;
|
|
}
|
|
function GenericButton({className}: GenericButtonProps) {
|
|
return (
|
|
<Tooltip
|
|
label={
|
|
<Trans message="You don't have permissions to access this feature." />
|
|
}
|
|
>
|
|
<LockIcon size="sm" className={clsx('text-muted', className)} />
|
|
</Tooltip>
|
|
);
|
|
}
|