@@ -27,6 +27,19 @@ import { useBilling, useBillingData } from "./hooks/use-billing";
2727
2828type AddOnProduct = Product & { is_add_on ?: boolean } ;
2929
30+ function isSSOProduct ( product : Product ) : boolean {
31+ const id = product . id . toLowerCase ( ) ;
32+ if ( id === "sso" || id . includes ( "sso" ) ) {
33+ return true ;
34+ }
35+ const name = product . name . toLowerCase ( ) ;
36+ if ( name . includes ( "single sign-on" ) ) {
37+ return true ;
38+ }
39+ const displayName = product . display ?. name ?. toLowerCase ( ) ?? "" ;
40+ return displayName . includes ( "single sign-on" ) ;
41+ }
42+
3043function getAddOnStatus ( addOn : Product , customerProduct ?: CustomerProduct ) {
3144 const isCancelled =
3245 customerProduct ?. canceled_at &&
@@ -57,10 +70,11 @@ export default function BillingPage() {
5770 getSubscriptionStatusDetails,
5871 } = useBilling ( refetch ) ;
5972
60- const addOns = useMemo (
61- ( ) => products ?. filter ( ( p ) => ( p as AddOnProduct ) . is_add_on ) ?? [ ] ,
62- [ products ]
63- ) ;
73+ const addOns = useMemo ( ( ) => {
74+ const allAddOns =
75+ products ?. filter ( ( p ) => ( p as AddOnProduct ) . is_add_on ) ?? [ ] ;
76+ return allAddOns . filter ( ( p ) => ! isSSOProduct ( p ) ) ;
77+ } , [ products ] ) ;
6478
6579 const { currentPlan, currentProduct, usageStats, statusDetails } =
6680 useMemo ( ( ) => {
@@ -74,7 +88,8 @@ export default function BillingPage() {
7488 const activePlan = activeCustomerProduct
7589 ? products ?. find ( ( p ) => p . id === activeCustomerProduct . id )
7690 : products ?. find (
77- ( p ) => ! p . scenario || ! [ "upgrade" , "downgrade" ] . includes ( p . scenario )
91+ ( p ) =>
92+ ! ( p . scenario && [ "upgrade" , "downgrade" ] . includes ( p . scenario ) )
7893 ) ;
7994
8095 const planStatusDetails = activeCustomerProduct
@@ -91,7 +106,12 @@ export default function BillingPage() {
91106 usageStats : usage ?. features ?? [ ] ,
92107 statusDetails : planStatusDetails ,
93108 } ;
94- } , [ products , usage ?. features , customer ?. products , getSubscriptionStatusDetails ] ) ;
109+ } , [
110+ products ,
111+ usage ?. features ,
112+ customer ?. products ,
113+ getSubscriptionStatusDetails ,
114+ ] ) ;
95115
96116 if ( isLoading ) {
97117 return (
@@ -155,7 +175,9 @@ export default function BillingPage() {
155175 currentProduct ?. status === "scheduled" ? "outline" : "green"
156176 }
157177 >
158- { currentProduct ?. status === "scheduled" ? "Scheduled" : "Active" }
178+ { currentProduct ?. status === "scheduled"
179+ ? "Scheduled"
180+ : "Active" }
159181 </ Badge >
160182 </ div >
161183 < div className = "flex items-center gap-3" >
@@ -289,7 +311,10 @@ export default function BillingPage() {
289311 ) : (
290312 < Button
291313 onClick = { ( ) =>
292- attach ( { productId : addOn . id , dialog : AttachDialog } )
314+ attach ( {
315+ productId : addOn . id ,
316+ dialog : AttachDialog ,
317+ } )
293318 }
294319 size = "sm"
295320 variant = "outline"
0 commit comments