From 9633a0ba85f931050cf2eb62be5368deff91f47a Mon Sep 17 00:00:00 2001
From: Brandon Thomas <echelon@gmail.com>
Date: Fri, 19 Sep 2025 11:38:03 -0400
Subject: [PATCH] temp fix for main poduction builds (zustand state commented
 out) (#832)

---
 .../src/components/signaled/TopBar/TopBar.tsx |  9 +++---
 frontend/apps/editor3d/tsconfig.json          | 30 +++++++++----------
 .../components/pricing-modal/package.json     |  3 --
 .../pricing-modal/src/lib/credits-modal.tsx   | 24 +++++++--------
 .../pricing-modal/src/lib/pricing-modal.tsx   |  8 +++--
 .../src/lib/panes/BillingSettingsPane.tsx     | 29 ++++++++++--------
 frontend/package-lock.json                    |  5 +---
 7 files changed, 55 insertions(+), 53 deletions(-)

diff --git a/frontend/apps/editor3d/app/src/components/signaled/TopBar/TopBar.tsx b/frontend/apps/editor3d/app/src/components/signaled/TopBar/TopBar.tsx
index f703e76ca6..10907d2ebf 100644
--- a/frontend/apps/editor3d/app/src/components/signaled/TopBar/TopBar.tsx
+++ b/frontend/apps/editor3d/app/src/components/signaled/TopBar/TopBar.tsx
@@ -156,12 +156,13 @@ export const TopBar = ({ pageName, loginSignUpPressed }: Props) => {
   const creditsStore = useCreditsState();
   const sumTotalCredits = creditsStore.totalCredits;
 
-  const subscriptionStore = useSubscriptionState();
-  const hasPaidPlan = subscriptionStore.hasPaidPlan();
+  //const subscriptionStore = useSubscriptionState();
+  //const hasPaidPlan = subscriptionStore.hasPaidPlan();
+  const hasPaidPlan = false;
 
   useEffect(() => {
     creditsStore.fetchFromServer();
-    subscriptionStore.fetchFromServer();
+    //subscriptionStore.fetchFromServer();
   }, []);
 
   useCreditsBalanceChangedEvent(async () => {
@@ -169,7 +170,7 @@ export const TopBar = ({ pageName, loginSignUpPressed }: Props) => {
   });
 
   useSubscriptionPlanChangedEvent(async () => {
-    subscriptionStore.fetchFromServer();
+    //subscriptionStore.fetchFromServer();
   });
 
   const disableTabSwitcher = () => {
diff --git a/frontend/apps/editor3d/tsconfig.json b/frontend/apps/editor3d/tsconfig.json
index 21d77afc73..92a5fce868 100644
--- a/frontend/apps/editor3d/tsconfig.json
+++ b/frontend/apps/editor3d/tsconfig.json
@@ -52,9 +52,6 @@
     {
       "path": "../../libs/components/button-dropdown"
     },
-    {
-      "path": "../../libs/components/pricing-modal"
-    },
     {
       "path": "../../libs/components/toaster"
     },
@@ -86,16 +83,25 @@
       "path": "../../libs/model-list"
     },
     {
-      "path": "../../libs/components/popover"
+      "path": "../../libs/common"
     },
     {
-      "path": "../../libs/common"
+      "path": "../../libs/state/subscription"
     },
     {
       "path": "../../libs/state/credits"
     },
     {
-      "path": "../../libs/state/subscription"
+      "path": "../../libs/tauri-events"
+    },
+    {
+      "path": "../../libs/components/pricing-modal"
+    },
+    {
+      "path": "../../libs/components/provider-billing-modal"
+    },
+    {
+      "path": "../../libs/components/provider-setup-modal"
     },
     {
       "path": "../../libs/analytics/google-analytics"
@@ -109,6 +115,9 @@
     {
       "path": "../../libs/components/settings-modal"
     },
+    {
+      "path": "../../libs/components/popover"
+    },
     {
       "path": "../../libs/components/gravatar"
     },
@@ -121,12 +130,6 @@
     {
       "path": "../../libs/components/upload-modal"
     },
-    {
-      "path": "../../libs/components/provider-setup-modal"
-    },
-    {
-      "path": "../../libs/components/provider-billing-modal"
-    },
     {
       "path": "../../libs/components/modal"
     },
@@ -148,9 +151,6 @@
     {
       "path": "../../libs/tauri-utils"
     },
-    {
-      "path": "../../libs/tauri-events"
-    },
     {
       "path": "../../libs/api"
     }
diff --git a/frontend/libs/components/pricing-modal/package.json b/frontend/libs/components/pricing-modal/package.json
index 74dd45d00a..f4f702c199 100644
--- a/frontend/libs/components/pricing-modal/package.json
+++ b/frontend/libs/components/pricing-modal/package.json
@@ -13,8 +13,5 @@
       "import": "./dist/index.js",
       "default": "./dist/index.js"
     }
-  },
-  "dependencies": {
-    "@tauri-apps/api": "^2.4.0"
   }
 }
diff --git a/frontend/libs/components/pricing-modal/src/lib/credits-modal.tsx b/frontend/libs/components/pricing-modal/src/lib/credits-modal.tsx
index ce3b9088c0..c398d635d5 100644
--- a/frontend/libs/components/pricing-modal/src/lib/credits-modal.tsx
+++ b/frontend/libs/components/pricing-modal/src/lib/credits-modal.tsx
@@ -99,23 +99,23 @@ export function CreditsModal({
   };
 
   const cardBase =
-    "relative rounded-xl border p-6 h-full flex flex-col justify-between bg-ui-panel border-ui-panel-border hover:bg-ui-controls/10 transition-all";
+    "relative rounded-xl border p-6 h-full flex flex-col justify-between bg-[#1F1F1F] border-white/10 hover:border-white/20 transition-all";
 
   return (
     <Modal
       isOpen={isOpen}
       onClose={onClose ?? (() => {})}
-      className="rounded-xl bg-ui-panel border border-ui-panel-border max-h-[90vh] max-w-screen-2xl overflow-y-auto flex flex-col"
+      className="rounded-xl bg-[#1A1A1A] max-h-[90vh] max-w-screen-2xl overflow-y-auto flex flex-col"
       allowBackgroundInteraction={false}
       showClose={true}
       closeOnOutsideClick={true}
       resizable={false}
-      backdropClassName=""
+      backdropClassName="bg-black/80"
     >
-      <div className="p-16 py-24 flex-1 overflow-y-auto min-h-0 text-base-fg">
+      <div className="p-16 py-24 flex-1 overflow-y-auto min-h-0">
         <div className="text-center mb-10">
-          <h1 className="text-5xl font-bold text-base-fg mb-4">Buy credits</h1>
-          <p className="text-base-fg/60 text-lg">
+          <h1 className="text-5xl font-bold text-white mb-4">Buy credits</h1>
+          <p className="text-gray-400 text-lg">
             Choose a one-time credits package. No subscription required.
           </p>
         </div>
@@ -124,7 +124,7 @@ export function CreditsModal({
           {creditPacks.map((pack) => (
             <div key={pack.id} className={cardBase}>
               {pack.badge && (
-                <div className="absolute -top-3 right-4 bg-ui-controls text-base-fg border border-ui-controls-border px-3 py-1 rounded-full text-xs font-semibold shadow-xl">
+                <div className="absolute -top-3 right-4 bg-white text-black px-3 py-1 rounded-full text-xs font-semibold shadow-xl">
                   {pack.badge}
                 </div>
               )}
@@ -132,7 +132,7 @@ export function CreditsModal({
               <CoinIcon />
 
               <div>
-                <div className="text-base-fg text-5xl font-bold tracking-tight flex items-center gap-2.5">
+                <div className="text-white text-5xl font-bold tracking-tight flex items-center gap-2.5">
                   <FontAwesomeIcon
                     icon={faCoinFront}
                     className="text-primary text-3xl"
@@ -140,9 +140,9 @@ export function CreditsModal({
                   {pack.total.toLocaleString()}
                 </div>
                 {pack.bonus > 0 && (
-                  <div className="text-base-fg/60 text-sm mt-2">
+                  <div className="text-gray-400 text-sm mt-2">
                     Total: {pack.base.toLocaleString()} {" + "}
-                    <span className="text-primary-300">
+                    <span className="text-[#faca5a]">
                       {pack.bonus.toLocaleString()} Bonus
                     </span>
                   </div>
@@ -150,12 +150,12 @@ export function CreditsModal({
               </div>
 
               <div className="flex items-center justify-between pt-6">
-                <div className="text-base-fg text-xl font-semibold">
+                <div className="text-white text-xl font-semibold">
                   ${pack.priceUsd}
                 </div>
                 <Button
                   onClick={() => handlePurchase(pack)}
-                  className="px-5 h-10 rounded-xl bg-ui-controls text-base-fg border border-ui-controls-border hover:bg-ui-controls/80"
+                  className="bg-white text-black hover:bg-white/90 px-5 h-10 rounded-xl"
                 >
                   Purchase
                 </Button>
diff --git a/frontend/libs/components/pricing-modal/src/lib/pricing-modal.tsx b/frontend/libs/components/pricing-modal/src/lib/pricing-modal.tsx
index db9ce83882..8aab0208e1 100644
--- a/frontend/libs/components/pricing-modal/src/lib/pricing-modal.tsx
+++ b/frontend/libs/components/pricing-modal/src/lib/pricing-modal.tsx
@@ -30,11 +30,13 @@ interface PricingModalProps {}
 export function PricingModal({}: PricingModalProps = {}) {
   const { isOpen, closeModal } = usePricingModalStore();
 
-  const subscriptionStore = useSubscriptionState();
+  //const subscriptionStore = useSubscriptionState();
 
-  const hasActiveSub = subscriptionStore.hasPaidPlan();
+  //const hasActiveSub = subscriptionStore.hasPaidPlan();
+  const hasActiveSub = false;
 
-  const activePlanId = subscriptionStore.subscriptionInfo?.productSlug;
+  //const activePlanId = subscriptionStore.subscriptionInfo?.productSlug;
+  const activePlanId = "free";
 
   const [billingType, setBillingType] = useState("yearly");
   const isYearly = billingType === "yearly";
diff --git a/frontend/libs/components/settings-modal/src/lib/panes/BillingSettingsPane.tsx b/frontend/libs/components/settings-modal/src/lib/panes/BillingSettingsPane.tsx
index 5415612b6c..008ab91d3f 100644
--- a/frontend/libs/components/settings-modal/src/lib/panes/BillingSettingsPane.tsx
+++ b/frontend/libs/components/settings-modal/src/lib/panes/BillingSettingsPane.tsx
@@ -23,31 +23,36 @@ interface BillingSettingsPaneProps {}
 export const BillingSettingsPane = (args: BillingSettingsPaneProps) => {
   const { toggleModal: toggleSubscriptionModal } = usePricingModalStore();
 
-  const creditsStore = useCreditsState();
-  const sumTotalCredits = creditsStore.totalCredits;
+  //const creditsStore = useCreditsState();
+  //const sumTotalCredits = creditsStore.totalCredits;
+  const sumTotalCredits = 100;
 
-  const subscriptionStore = useSubscriptionState();
+  //const subscriptionStore = useSubscriptionState();
 
-  const maybePlanSlug = subscriptionStore.subscriptionInfo?.productSlug;
+  //const maybePlanSlug = subscriptionStore.subscriptionInfo?.productSlug;
+  const maybePlanSlug = "free";
 
   const currentPlanDetails: SubscriptionPlanDetails = maybePlanSlug
     ? SUBSCRIPTION_PLANS_BY_SLUG.get(maybePlanSlug) || FREE_PLAN
     : FREE_PLAN;
 
-  const canCancelPlan = subscriptionStore.canCancelPlan();
+  //const canCancelPlan = subscriptionStore.canCancelPlan();
+  const canCancelPlan = false;
 
-  const nextBillAt =
-    subscriptionStore.subscriptionInfo?.nextBillAt?.toLocaleDateString();
-  const subscriptionEndAt =
-    subscriptionStore.subscriptionInfo?.subscriptionEndAt?.toLocaleDateString();
+  //const nextBillAt =
+  //  subscriptionStore.subscriptionInfo?.nextBillAt?.toLocaleDateString();
+  const nextBillAt = "";
+  //const subscriptionEndAt =
+  //  subscriptionStore.subscriptionInfo?.subscriptionEndAt?.toLocaleDateString();
+  const subscriptionEndAt = "";
 
   const changeOrUpgradePlanButtonLabel = canCancelPlan
     ? "Change plan"
     : "Upgrade plan";
 
   useEffect(() => {
-    creditsStore.fetchFromServer();
-    subscriptionStore.fetchFromServer();
+    //creditsStore.fetchFromServer();
+    //subscriptionStore.fetchFromServer();
   }, []);
 
   return (
@@ -118,7 +123,7 @@ export const BillingSettingsPane = (args: BillingSettingsPaneProps) => {
             </div>
           </div>
 
-          <CreditsTally creditsStore={creditsStore} />
+          {/*<CreditsTally creditsStore={creditsStore} />*/}
         </div>
       </div>
     </>
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index f32446f863..1ee11f3c9c 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -1291,10 +1291,7 @@
     },
     "libs/components/pricing-modal": {
       "name": "@storyteller/ui-pricing-modal",
-      "version": "0.0.1",
-      "dependencies": {
-        "@tauri-apps/api": "^2.4.0"
-      }
+      "version": "0.0.1"
     },
     "libs/components/progress": {
       "name": "@storyteller/ui-progress",