Hey is a decentralized and permissionless social media app built with Lens Protocol 馃尶
1import { SparklesIcon } from "@heroicons/react/24/outline";
2import { memo } from "react";
3import cn from "@/helpers/cn";
4import { useProModalStore } from "@/store/non-persisted/modal/useProModalStore";
5
6interface ProFeatureNoticeProps {
7 feature: string;
8 className?: string;
9}
10
11const ProFeatureNotice = ({ feature, className }: ProFeatureNoticeProps) => {
12 const { setShow: setShowProModal } = useProModalStore();
13
14 return (
15 <div
16 className={cn(
17 "flex items-center gap-x-2 font-semibold text-gray-500 text-sm",
18 className
19 )}
20 >
21 <SparklesIcon className="size-4" />
22 <span>
23 <button
24 className="underline"
25 onClick={() => setShowProModal(true)}
26 type="button"
27 >
28 Upgrade to Pro
29 </button>{" "}
30 to unlock {feature}
31 </span>
32 </div>
33 );
34};
35
36export default memo(ProFeatureNotice);