Ryan/documenso
1
0
Fork 1
mirror of https://github.com/documenso/documenso.git synced 2025-11-14 08:42:12 +10:00
Code Issues Packages Projects Releases Wiki Activity

fix: hide billing if the feature flag hasn't been passed

Browse Source
This commit is contained in:
Mythie
2023-05-21 23:00:54 +10:00
parent b5ec3cc817
commit 1e505088ad
2 changed files with 55 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
apps/web/components/billing-plans.tsx
View File

@ -1,11 +1,11 @@
import { useMemo, useState } from "react";
import { useState } from "react";
import { classNames } from "@documenso/lib";
import { STRIPE_PLANS, fetchCheckoutSession, useSubscription } from "@documenso/lib/stripe";
import { Button } from "@documenso/ui";
import { Switch } from "@headlessui/react";
export const BillingPlans = () => {
const { subscription, hasSubscription, isLoading } = useSubscription();
const { subscription, isLoading } = useSubscription();
const [isAnnual, setIsAnnual] = useState(true);
return (
@ -22,7 +22,7 @@ export const BillingPlans = () => {
onChange={setIsAnnual}
className={classNames(
isAnnual ? "bg-neon-600" : "bg-gray-200",
"relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-neon-600 focus:ring-offset-2"
"focus:ring-neon-600 relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-offset-2"
)}>
<span
aria-hidden="true"

53
apps/web/components/settings.tsx
View File

@ -4,18 +4,12 @@ import Link from "next/link";
import { useRouter } from "next/router";
import { updateUser } from "@documenso/features";
import { getUser } from "@documenso/lib/api";
import {
STRIPE_PLANS,
fetchCheckoutSession,
fetchPortalSession,
isSubscriptionsEnabled,
useSubscription,
} from "@documenso/lib/stripe";
import { SubscriptionStatus } from '@prisma/client'
import { fetchPortalSession, isSubscriptionsEnabled, useSubscription } from "@documenso/lib/stripe";
import { Button } from "@documenso/ui";
import { CreditCardIcon, KeyIcon, UserCircleIcon } from "@heroicons/react/24/outline";
import { useSession } from "next-auth/react";
import { BillingPlans } from "./billing-plans";
import { CreditCardIcon, KeyIcon, UserCircleIcon } from "@heroicons/react/24/outline";
import { SubscriptionStatus } from "@prisma/client";
import { useSession } from "next-auth/react";
const subNavigation = [
{
@ -29,14 +23,17 @@ const subNavigation = [
href: "/settings/password",
icon: KeyIcon,
current: false,
},
{
}
];
if (process.env.NEXT_PUBLIC_ALLOW_SUBSCRIPTIONS === "true") {
subNavigation.push({
name: "Billing",
href: "/settings/billing",
icon: CreditCardIcon,
current: false,
},
];
});
}
function classNames(...classes: any) {
return classes.filter(Boolean).join(" ");
@ -189,9 +186,7 @@ export default function Setttings() {
</div>
<div
hidden={
subNavigation.find((e) => e.current)?.name !== subNavigation?.[2]?.name
}
hidden={!subNavigation.at(2) || subNavigation.find((e) => e.current)?.name !== subNavigation.at(2)?.name}
className="min-h-[251px] divide-y divide-gray-200 lg:col-span-9">
{/* Billing section */}
<div className="py-6 px-4 sm:p-6 lg:pb-8">
@ -204,27 +199,28 @@ export default function Setttings() {
</p>
)}
{isSubscriptionsEnabled() && <>
{isSubscriptionsEnabled() && (
<>
<p className="mt-1 text-sm text-gray-500">
Your subscription is currently{" "}
<strong>{subscription?.status && subscription?.status !== SubscriptionStatus.INACTIVE ? "Active" : "Inactive"}</strong>.
<strong>
{subscription?.status &&
subscription?.status !== SubscriptionStatus.INACTIVE
? "Active"
: "Inactive"}
</strong>
.
</p>
{subscription?.status === SubscriptionStatus.PAST_DUE && (
<p className="mt-1 text-sm text-red-500">
Your subscription is past due. Please update your payment details to continue
using the service without interruption.
Your subscription is past due. Please update your payment details to
continue using the service without interruption.
</p>
)}
<p className="mt-1 text-sm text-gray-500">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Est consectetur magnam
illo aperiam expedita porro eos eum nam sapiente.
</p>
<div className="mt-8">
<div className="grid grid-cols-1 lg:grid-cols-2">
<BillingPlans />
</div>
@ -245,7 +241,8 @@ export default function Setttings() {
</Button>
)}
</div>
</>}
</>
)}
</div>
</div>
</div>