this works - still seems the subscription state is broken

frontend/libs/components/settings-modal/src/lib/panes/BillingSettingsPane.tsx

@@ -26,7 +26,6 @@ export const BillingSettingsPane = (args: BillingSettingsPaneProps) => {
   const creditsStore = useCreditsState();
 
   const sumTotalCredits = creditsStore.totalCredits;
-  //const sumTotalCredits = 100;
 
   //const subscriptionStore = useSubscriptionState();
 

frontend/libs/state/credits/src/lib/state/credits-state.ts

@@ -18,7 +18,7 @@ export interface CreditsState {
   fetchFromServer: () => Promise<void>
 }
 
-export const useCreditsState = create<CreditsState>()((set) => ({
+export const useCreditsState = create<CreditsState>((set) => ({
   freeCredits: 0,
   monthlyCredits: 0,
   bankedCredits: 0,

frontend/libs/state/subscription/src/lib/subscription-state.ts

@@ -4,17 +4,6 @@ import { ArtcraftGetSubscription } from "@storyteller/tauri-api";
 export interface SubscriptionState {
   /// If the user doesn't have a subscription, this will be undefined.
   subscriptionInfo?: SubscriptionInfo,
-
-  // Returns true if the user has a paid plan.
-  // (We do not store "free" as a plan.)
-  hasPaidPlan: () => boolean;
-
-  // Returns true if the user can cancel their plan.
-  // (The user can't cancel an already set to cancel/expire plan again)
-  canCancelPlan: () => boolean;
-
-  // Call to fetch credits from the server
-  fetchFromServer: () => Promise<void>
 }
 
 interface SubscriptionInfo {
@@ -35,7 +24,20 @@ interface SubscriptionInfo {
   subscriptionEndAt?: Date,
 }
 
-export const useSubscriptionState = create<SubscriptionState>()((set, get) => ({
+export type SubscriptionActions = {
+  // Returns true if the user has a paid plan.
+  // (We do not store "free" as a plan.)
+  hasPaidPlan: () => boolean;
+
+  // Returns true if the user can cancel their plan.
+  // (The user can't cancel an already set to cancel/expire plan again)
+  canCancelPlan: () => boolean;
+
+  // Call to fetch credits from the server
+  fetchFromServer: () => Promise<void>
+};
+
+export const useSubscriptionState = create<SubscriptionState & SubscriptionActions>((set, get) => ({
   subscriptionInfo: undefined,
 
   // Returns true if the user has a paid plan.