From 02f36a0eb8e5affee21e2be458d73e8c76109c59 Mon Sep 17 00:00:00 2001
From: Ephraim Atta-Duncan <ephraimduncan68@gmail.com>
Date: Fri, 11 Jul 2025 15:31:38 +0000
Subject: [PATCH] fix: open dialog

---
 apps/remix/app/components/general/billing-plans.tsx | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/apps/remix/app/components/general/billing-plans.tsx b/apps/remix/app/components/general/billing-plans.tsx
index fabfbf6b5..e8d593dc9 100644
--- a/apps/remix/app/components/general/billing-plans.tsx
+++ b/apps/remix/app/components/general/billing-plans.tsx
@@ -1,4 +1,4 @@
-import { useMemo, useState } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 
 import { zodResolver } from '@hookform/resolvers/zod';
 import { useLingui } from '@lingui/react/macro';
@@ -97,7 +97,7 @@ export const BillingPlans = ({
         <AnimatePresence mode="wait">
           {pricesToDisplay.map((price) => {
             const planId = price.claim.toLowerCase().replace('claim_', '');
-            const isSelected = selectedPlan && planId === selectedPlan;
+            const isSelected = selectedPlan && planId === selectedPlan?.toLowerCase();
 
             return (
               <MotionCard
@@ -176,7 +176,13 @@ const BillingDialog = ({
   isFromPricingPage?: boolean;
   interval: 'monthlyPrice' | 'yearlyPrice';
 }) => {
-  const [isOpen, setIsOpen] = useState(isSelected && isFromPricingPage);
+  const [isOpen, setIsOpen] = useState(false);
+
+  useEffect(() => {
+    if (isSelected && isFromPricingPage) {
+      setIsOpen(true);
+    }
+  }, [isSelected, isFromPricingPage]);
 
   const { t } = useLingui();
   const { toast } = useToast();