Files
Dorod-Sky/skyvern-frontend/src/components/Orgwalled.tsx

47 lines
1.0 KiB
TypeScript

import { useIsSkyvernUser } from "@/hooks/useIsSkyvernUser";
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
import { cn } from "@/util/utils";
function OrgWalled({
children,
className,
}: {
children: React.ReactNode;
className?: string;
}) {
const isSkyvernUser = useIsSkyvernUser();
if (!isSkyvernUser) {
return null;
}
// Wrap children with visual indication for org-walled features
return (
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<div
className={cn(
"relative rounded-md border-2 border-dashed border-yellow-400 p-2 transition-all duration-100 ease-linear hover:border-transparent hover:p-0",
className,
)}
>
{children}
</div>
</TooltipTrigger>
<TooltipContent>
<p>This feature is only available to Skyvern organization members</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
);
}
export { OrgWalled };