mukeshs/twenty_crm
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

adapt billing banners according to user's permissions (#12005)

Browse Source 
closes https://github.com/twentyhq/twenty/issues/11951
This commit is contained in:
Etienne
2025-05-13 16:18:57 +02:00
committed by GitHub
parent fb615ed201
commit bed33b00b9
4 changed files with 57 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
packages/twenty-front/src/modules/information-banner/components/billing/InformationBannerBillingSubscriptionPaused.tsx
View File

@ -1,9 +1,14 @@
import { useRedirect } from '@/domain-manager/hooks/useRedirect';
import { InformationBanner } from '@/information-banner/components/InformationBanner';
import { useSettingsPermissionMap } from '@/settings/roles/hooks/useSettingsPermissionMap';
import { SettingsPath } from '@/types/SettingsPath';
import { useBillingPortalSessionQuery } from '~/generated/graphql';
import { getSettingsPath } from '~/utils/navigation/getSettingsPath';
import { t } from '@lingui/core/macro';
import { isDefined } from 'twenty-shared/utils';
import {
SettingPermissionType,
useBillingPortalSessionQuery,
} from '~/generated/graphql';
import { getSettingsPath } from '~/utils/navigation/getSettingsPath';
export const InformationBannerBillingSubscriptionPaused = () => {
const { redirect } = useRedirect();
@ -14,6 +19,10 @@ export const InformationBannerBillingSubscriptionPaused = () => {
},
});
const {
[SettingPermissionType.WORKSPACE]: hasPermissionToUpdateBillingDetails,
} = useSettingsPermissionMap();
const openBillingPortal = () => {
if (isDefined(data) && isDefined(data.billingPortalSession.url)) {
redirect(data.billingPortalSession.url);
@ -23,8 +32,12 @@ export const InformationBannerBillingSubscriptionPaused = () => {
return (
<InformationBanner
variant="danger"
message={'Trial expired. Please update your billing details'}
buttonTitle="Update"
message={
hasPermissionToUpdateBillingDetails
? t`Trial expired. Please update your billing details.`
: t`Trial expired. Please contact your admin`
}
buttonTitle={hasPermissionToUpdateBillingDetails ? t`Update` : undefined}
buttonOnClick={() => openBillingPortal()}
isButtonDisabled={loading || !isDefined(data)}
/>

13
packages/twenty-front/src/modules/information-banner/components/billing/InformationBannerEndTrialPeriod.tsx
View File

@ -1,16 +1,25 @@
import { useEndSubscriptionTrialPeriod } from '@/billing/hooks/useEndSubscriptionTrialPeriod';
import { InformationBanner } from '@/information-banner/components/InformationBanner';
import { useSettingsPermissionMap } from '@/settings/roles/hooks/useSettingsPermissionMap';
import { useLingui } from '@lingui/react/macro';
import { SettingPermissionType } from '~/generated-metadata/graphql';
export const InformationBannerEndTrialPeriod = () => {
const { endTrialPeriod, isLoading } = useEndSubscriptionTrialPeriod();
const { t } = useLingui();
const { [SettingPermissionType.WORKSPACE]: hasPermissionToEndTrialPeriod } =
useSettingsPermissionMap();
return (
<InformationBanner
variant="danger"
message={t`No free workflow executions left. End trial period and activate your billing to continue.`}
buttonTitle={t`Activate`}
message={
hasPermissionToEndTrialPeriod
? t`No free workflow executions left. End trial period and activate your billing to continue.`
: t`No free workflow executions left. Please contact your admin.`
}
buttonTitle={hasPermissionToEndTrialPeriod ? t`Activate` : undefined}
buttonOnClick={async () => await endTrialPeriod()}
isButtonDisabled={isLoading}
/>

21
packages/twenty-front/src/modules/information-banner/components/billing/InformationBannerFailPaymentInfo.tsx
View File

@ -1,9 +1,14 @@
import { useRedirect } from '@/domain-manager/hooks/useRedirect';
import { InformationBanner } from '@/information-banner/components/InformationBanner';
import { useSettingsPermissionMap } from '@/settings/roles/hooks/useSettingsPermissionMap';
import { SettingsPath } from '@/types/SettingsPath';
import { useBillingPortalSessionQuery } from '~/generated/graphql';
import { getSettingsPath } from '~/utils/navigation/getSettingsPath';
import { t } from '@lingui/core/macro';
import { isDefined } from 'twenty-shared/utils';
import {
SettingPermissionType,
useBillingPortalSessionQuery,
} from '~/generated/graphql';
import { getSettingsPath } from '~/utils/navigation/getSettingsPath';
export const InformationBannerFailPaymentInfo = () => {
const { redirect } = useRedirect();
@ -14,6 +19,10 @@ export const InformationBannerFailPaymentInfo = () => {
},
});
const {
[SettingPermissionType.WORKSPACE]: hasPermissionToUpdateBillingDetails,
} = useSettingsPermissionMap();
const openBillingPortal = () => {
if (isDefined(data) && isDefined(data.billingPortalSession.url)) {
redirect(data.billingPortalSession.url);
@ -23,8 +32,12 @@ export const InformationBannerFailPaymentInfo = () => {
return (
<InformationBanner
variant="danger"
message={'Last payment failed. Please update your billing details.'}
buttonTitle="Update"
message={
hasPermissionToUpdateBillingDetails
? t`Last payment failed. Please update your billing details.`
: t`Last payment failed. Please contact your admin.`
}
buttonTitle={hasPermissionToUpdateBillingDetails ? t`Update` : undefined}
buttonOnClick={() => openBillingPortal()}
isButtonDisabled={loading || !isDefined(data)}
/>

14
packages/twenty-front/src/modules/information-banner/components/billing/InformationBannerNoBillingSubscription.tsx
View File

@ -1,6 +1,9 @@
import { BILLING_CHECKOUT_SESSION_DEFAULT_VALUE } from '@/billing/constants/BillingCheckoutSessionDefaultValue';
import { useHandleCheckoutSession } from '@/billing/hooks/useHandleCheckoutSession';
import { InformationBanner } from '@/information-banner/components/InformationBanner';
import { useSettingsPermissionMap } from '@/settings/roles/hooks/useSettingsPermissionMap';
import { t } from '@lingui/core/macro';
import { SettingPermissionType } from '~/generated-metadata/graphql';
export const InformationBannerNoBillingSubscription = () => {
const { handleCheckoutSession, isSubmitting } = useHandleCheckoutSession({
@ -9,11 +12,18 @@ export const InformationBannerNoBillingSubscription = () => {
requirePaymentMethod: true,
});
const { [SettingPermissionType.WORKSPACE]: hasPermissionToSubscribe } =
useSettingsPermissionMap();
return (
<InformationBanner
variant="danger"
message={`Your workspace does not have an active subscription`}
buttonTitle="Subscribe"
message={
hasPermissionToSubscribe
? t`Your workspace doesn't have an active subscription.`
: t`Your workspace doesn't have an active subscription. Please contact your admin.`
}
buttonTitle={hasPermissionToSubscribe ? t`Subscribe` : undefined}
buttonOnClick={() => handleCheckoutSession()}
isButtonDisabled={isSubmitting}
/>