import React, { createContext, useContext } from "react";

export type AccountPlan = {
  plan: "free" | "pro";
  canUseAi: boolean;
  canUseProThemes: boolean;
};

// Routed application screens always receive the server-backed value from App.
// The permissive default keeps isolated component previews usable; the API remains authoritative.
const AccountPlanContext = createContext<AccountPlan>({ plan: "pro", canUseAi: true, canUseProThemes: true });

export function AccountPlanProvider({ value, children }: { value: AccountPlan; children: React.ReactNode }) {
  return <AccountPlanContext.Provider value={value}>{children}</AccountPlanContext.Provider>;
}

export function useAccountPlan() {
  return useContext(AccountPlanContext);
}