payments
This commit is contained in:
parent
27968dd087
commit
62068f4f54
|
@ -43,6 +43,7 @@ const fetcher = (url) => fetch(url).then((r) => r.json());
|
|||
const apiPrefix = process.env.NODE_ENV === "development" ? "/api/stubs" : "";
|
||||
const isFreeTier = (tier) => tier === 1;
|
||||
const isPaidTier = (tier) => !isFreeTier(tier);
|
||||
const freePlan = plans.find(({ tier }) => isFreeTier(tier));
|
||||
|
||||
const ActiveBadge = () => {
|
||||
return (
|
||||
|
@ -54,8 +55,8 @@ const ActiveBadge = () => {
|
|||
|
||||
export default function Payments() {
|
||||
const { data: user } = useSWR(`${apiPrefix}/user`, fetcher);
|
||||
const [selectedPlan, setSelectedPlan] = useState(plans[0]);
|
||||
const activePlan = plans.find((plan) => user?.tier === plan?.tier);
|
||||
const [selectedPlan, setSelectedPlan] = useState(freePlan);
|
||||
const activePlan = user ? plans.find(({ tier }) => user.tier === tier) : freePlan;
|
||||
const handleSubscribe = async () => {
|
||||
try {
|
||||
const price = selectedPlan.stripe;
|
||||
|
@ -165,6 +166,7 @@ export default function Payments() {
|
|||
} p-4 flex flex-col md:pl-4 md:pr-6 md:grid md:grid-cols-3`}
|
||||
>
|
||||
<label className="flex items-center text-sm cursor-pointer">
|
||||
{isFreeTier(activePlan.tier) && (
|
||||
<input
|
||||
name="pricing_plan"
|
||||
type="radio"
|
||||
|
@ -173,6 +175,7 @@ export default function Payments() {
|
|||
checked={plan === selectedPlan}
|
||||
onChange={() => console.log(plan.name) || setSelectedPlan(plan)}
|
||||
/>
|
||||
)}
|
||||
<span className="ml-3 font-medium text-gray-900">{plan.name}</span>
|
||||
{activePlan === plan && <ActiveBadge />}
|
||||
</label>
|
||||
|
|
Reference in New Issue