refactor(shared): rename billing hook and update semantics (#7687)

Co-authored-by: Robert Soriano <sorianorobertc@gmail.com>

Author: jacekradko

.changeset/fiery-carrots-call.md

@@ -0,0 +1,5 @@
+---
+'@clerk/shared': major
+---
+
+Rename internal `useBillingHookEnabled` to `useBillingIsEnabled` with improved semantics for authentication and organization context checks.

packages/shared/src/react/billing/__tests__/useInitializePaymentMethod.spec.tsx

@@ -66,8 +66,9 @@ describe('useInitializePaymentMethod', () => {
     expect(result.current.initializePaymentMethod).toBeInstanceOf(Function);
   });
 
-  it('does not fetch when billing disabled for user', () => {
+  it('does not fetch when billing disabled', () => {
     mockClerk.__internal_environment.commerceSettings.billing.user.enabled = false;
+    mockClerk.__internal_environment.commerceSettings.billing.organization.enabled = false;
 
     const { result } = renderHook(() => useInitializePaymentMethod(), { wrapper });
 

packages/shared/src/react/billing/useInitializePaymentMethod.tsx

@@ -5,7 +5,7 @@ import { defineKeepPreviousDataFn } from '../clerk-rq/keep-previous-data';
 import { useClerkQueryClient } from '../clerk-rq/use-clerk-query-client';
 import { useClerkQuery } from '../clerk-rq/useQuery';
 import { useOrganizationContext, useUserContext } from '../contexts';
-import { useBillingHookEnabled } from '../hooks/useBillingHookEnabled';
+import { useBillingIsEnabled } from '../hooks/useBillingIsEnabled';
 import { useClearQueriesOnSignOut } from '../hooks/useClearQueriesOnSignOut';
 
 type InitializePaymentMethodOptions = {
@@ -27,7 +27,7 @@ function useInitializePaymentMethod(options?: InitializePaymentMethodOptions): U
 
   const resource = forType === 'organization' ? organization : user;
 
-  const billingEnabled = useBillingHookEnabled(options);
+  const billingEnabled = useBillingIsEnabled(options);
 
   const stableKey = 'billing-payment-method-initialize';
   const authenticated = true;

packages/shared/src/react/billing/useStripeLoader.tsx

@@ -3,7 +3,7 @@ import { useMemo } from 'react';
 
 import { defineKeepPreviousDataFn } from '../clerk-rq/keep-previous-data';
 import { useClerkQuery } from '../clerk-rq/useQuery';
-import { useBillingHookEnabled } from '../hooks/useBillingHookEnabled';
+import { useBillingIsEnabled } from '../hooks/useBillingIsEnabled';
 import type { UseStripeClerkLibsResult } from './useStripeClerkLibs';
 
 type StripeLoaderOptions = {
@@ -24,7 +24,7 @@ function useStripeLoader(options: StripeLoaderOptions): UseStripeLoaderResult {
     return ['stripe-sdk', { externalGatewayId, stripePublishableKey }] as const;
   }, [externalGatewayId, stripePublishableKey]);
 
-  const billingEnabled = useBillingHookEnabled({ authenticated: true });
+  const billingEnabled = useBillingIsEnabled({ authenticated: true });
 
   const isEnabled = Boolean(stripeClerkLibs && externalGatewayId && stripePublishableKey) && billingEnabled;
 

packages/shared/src/react/hooks/__tests__/useSubscription.spec.tsx

@@ -57,8 +57,9 @@ describe('useSubscription', () => {
     defaultQueryClient.client.clear();
   });
 
-  it('does not fetch when billing disabled for user', () => {
+  it('does not fetch when billing disabled', () => {
     mockClerk.__internal_environment.commerceSettings.billing.user.enabled = false;
+    mockClerk.__internal_environment.commerceSettings.billing.organization.enabled = false;
 
     const { result } = renderHook(() => useSubscription(), { wrapper });
 

packages/shared/src/react/hooks/createBillingPaginatedHook.tsx

@@ -9,7 +9,7 @@ import {
 import type { ResourceCacheStableKey } from '../stable-keys';
 import type { PagesOrInfiniteOptions, PaginatedHookConfig, PaginatedResources } from '../types';
 import { createCacheKeys } from './createCacheKeys';
-import { useBillingHookEnabled } from './useBillingHookEnabled';
+import { useBillingIsEnabled } from './useBillingIsEnabled';
 import { usePagesOrInfinite, useWithSafeValues } from './usePagesOrInfinite';
 
 /**
@@ -106,7 +106,7 @@ export function createBillingPaginatedHook<TResource extends ClerkResource, TPar
 
     const isForOrganization = safeFor === 'organization';
 
-    const billingEnabled = useBillingHookEnabled({
+    const billingEnabled = useBillingIsEnabled({
       for: safeFor,
       enabled: externalEnabled,
       authenticated: !options?.unauthenticated,

…src/react/hooks/useBillingHookEnabled.ts …d/src/react/hooks/useBillingIsEnabled.tspackages/shared/src/react/hooks/useBillingHookEnabled.ts renamed to packages/shared/src/react/hooks/useBillingIsEnabled.ts packages/shared/src/react/hooks/useBillingHookEnabled.ts renamed to packages/shared/src/react/hooks/useBillingIsEnabled.ts

@@ -4,7 +4,7 @@ import { useClerkInstanceContext, useOrganizationContext, useUserContext } from
 /**
  * @internal
  */
-export function useBillingHookEnabled(params?: { for?: ForPayerType; enabled?: boolean; authenticated?: boolean }) {
+export function useBillingIsEnabled(params?: { for?: ForPayerType; enabled?: boolean; authenticated?: boolean }) {
   const clerk = useClerkInstanceContext();
 
   const enabledFromParam = params?.enabled ?? true;
@@ -15,11 +15,17 @@ export function useBillingHookEnabled(params?: { for?: ForPayerType; enabled?: b
   const user = useUserContext();
   const { organization } = useOrganizationContext();
 
-  const isOrganization = params?.for === 'organization';
-  const billingEnabled = isOrganization
-    ? environment?.commerceSettings.billing.organization.enabled
-    : environment?.commerceSettings.billing.user.enabled;
+  const userBillingEnabled = environment?.commerceSettings.billing.user.enabled;
+  const orgBillingEnabled = environment?.commerceSettings.billing.organization.enabled;
+
+  const billingEnabled =
+    params?.for === 'organization'
+      ? orgBillingEnabled
+      : params?.for === 'user'
+        ? userBillingEnabled
+        : userBillingEnabled || orgBillingEnabled;
 
+  const isOrganization = params?.for === 'organization';
   const requireUserAndOrganizationWhenAuthenticated =
     (params?.authenticated ?? true) ? (isOrganization ? Boolean(organization?.id) : true) && Boolean(user?.id) : true;
 

packages/shared/src/react/hooks/usePaymentAttemptQuery.tsx

@@ -1,7 +1,7 @@
 import { defineKeepPreviousDataFn } from '../clerk-rq/keep-previous-data';
 import { useClerkQuery } from '../clerk-rq/useQuery';
 import { useClerkInstanceContext, useOrganizationContext, useUserContext } from '../contexts';
-import { useBillingHookEnabled } from './useBillingHookEnabled';
+import { useBillingIsEnabled } from './useBillingIsEnabled';
 import { useClearQueriesOnSignOut } from './useClearQueriesOnSignOut';
 import { usePaymentAttemptQueryCacheKeys } from './usePaymentAttemptQuery.shared';
 import type { PaymentAttemptQueryResult, UsePaymentAttemptQueryParams } from './usePaymentAttemptQuery.types';
@@ -25,7 +25,7 @@ function usePaymentAttemptQuery(params: UsePaymentAttemptQueryParams): PaymentAt
     for: forType,
   });
 
-  const billingEnabled = useBillingHookEnabled(params);
+  const billingEnabled = useBillingIsEnabled(params);
 
   const queryEnabled = Boolean(paymentAttemptId) && billingEnabled;
 

packages/shared/src/react/hooks/usePlanDetailsQuery.tsx

@@ -1,7 +1,7 @@
 import { defineKeepPreviousDataFn } from '../clerk-rq/keep-previous-data';
 import { useClerkQuery } from '../clerk-rq/useQuery';
 import { useClerkInstanceContext } from '../contexts';
-import { useBillingHookEnabled } from './useBillingHookEnabled';
+import { useBillingIsEnabled } from './useBillingIsEnabled';
 import { usePlanDetailsQueryCacheKeys } from './usePlanDetailsQuery.shared';
 import type { PlanDetailsQueryResult, UsePlanDetailsQueryParams } from './usePlanDetailsQuery.types';
 
@@ -16,7 +16,7 @@ export function __internal_usePlanDetailsQuery(params: UsePlanDetailsQueryParams
 
   const { queryKey } = usePlanDetailsQueryCacheKeys({ planId: targetPlanId });
 
-  const billingEnabled = useBillingHookEnabled({
+  const billingEnabled = useBillingIsEnabled({
     authenticated: false,
   });
 

packages/shared/src/react/hooks/useStatementQuery.tsx

@@ -1,7 +1,7 @@
 import { defineKeepPreviousDataFn } from '../clerk-rq/keep-previous-data';
 import { useClerkQuery } from '../clerk-rq/useQuery';
 import { useClerkInstanceContext, useOrganizationContext, useUserContext } from '../contexts';
-import { useBillingHookEnabled } from './useBillingHookEnabled';
+import { useBillingIsEnabled } from './useBillingIsEnabled';
 import { useClearQueriesOnSignOut } from './useClearQueriesOnSignOut';
 import { useStatementQueryCacheKeys } from './useStatementQuery.shared';
 import type { StatementQueryResult, UseStatementQueryParams } from './useStatementQuery.types';
@@ -25,7 +25,7 @@ function useStatementQuery(params: UseStatementQueryParams = {}): StatementQuery
     for: forType,
   });
 
-  const billingEnabled = useBillingHookEnabled(params);
+  const billingEnabled = useBillingIsEnabled(params);
 
   const queryEnabled = Boolean(statementId) && billingEnabled;