@streamoid/settings 0.2.3 → 0.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +13 -2
- package/dist/index.d.ts +13 -2
- package/dist/index.js +73 -29
- package/dist/index.mjs +80 -31
- package/package.json +4 -2
package/dist/index.d.mts
CHANGED
|
@@ -88,6 +88,8 @@ interface SettingsWorkspaceCurrent {
|
|
|
88
88
|
/** Optional reactive credit summary if the host tracks it. */
|
|
89
89
|
availableCredits?: number | null;
|
|
90
90
|
totalCredits?: number | null;
|
|
91
|
+
/** ISO country code for the workspace; drives plan currency selection. */
|
|
92
|
+
country?: string;
|
|
91
93
|
}
|
|
92
94
|
interface SettingsWorkspaceListItem {
|
|
93
95
|
_id: string;
|
|
@@ -264,12 +266,18 @@ interface SubscriptionPlan {
|
|
|
264
266
|
name: string;
|
|
265
267
|
amount: number;
|
|
266
268
|
subscriptionEndDate?: string;
|
|
269
|
+
/** Three-letter currency code (lowercase) when known, e.g. "inr" / "usd". */
|
|
270
|
+
currency?: string;
|
|
271
|
+
/** Stripe billing interval, e.g. "month" / "year". */
|
|
272
|
+
interval?: string;
|
|
267
273
|
}
|
|
268
274
|
interface BillingSubscription {
|
|
269
275
|
createdAt: string;
|
|
270
276
|
downgradeScheduled: boolean;
|
|
271
277
|
stripeCustomerId: string;
|
|
272
278
|
plan: SubscriptionPlan;
|
|
279
|
+
/** Stripe product id; used to look up the matching product in fetched plans. */
|
|
280
|
+
stripeProductId?: string;
|
|
273
281
|
}
|
|
274
282
|
interface SubscriptionResponse {
|
|
275
283
|
data: BillingSubscription | null;
|
|
@@ -283,6 +291,8 @@ interface Price {
|
|
|
283
291
|
id: string;
|
|
284
292
|
unit_amount: number;
|
|
285
293
|
metadata: PriceMetadata;
|
|
294
|
+
/** Three-letter currency code (lowercase) when present, e.g. "inr" / "usd". */
|
|
295
|
+
currency?: string;
|
|
286
296
|
}
|
|
287
297
|
interface BillingProduct {
|
|
288
298
|
id: string;
|
|
@@ -573,7 +583,7 @@ type IconProps = Omit<SVGProps<SVGSVGElement>, 'color' | 'strokeWidth' | 'width'
|
|
|
573
583
|
};
|
|
574
584
|
declare const SiconKey: ({ color, strokeWidth, size, ...props }: IconProps) => react_jsx_runtime.JSX.Element;
|
|
575
585
|
|
|
576
|
-
declare function BillingContent({ embedded }?: {
|
|
586
|
+
declare function BillingContent({ embedded, }?: {
|
|
577
587
|
embedded?: boolean;
|
|
578
588
|
}): react_jsx_runtime.JSX.Element;
|
|
579
589
|
|
|
@@ -648,10 +658,11 @@ interface ConfirmDeleteModalProps {
|
|
|
648
658
|
declare function ConfirmDeleteModal({ open, workspaceName, onClose, onConfirm, }: ConfirmDeleteModalProps): react_jsx_runtime.JSX.Element | null;
|
|
649
659
|
|
|
650
660
|
interface BuyCreditsModalProps {
|
|
661
|
+
currencySymbol?: string;
|
|
651
662
|
onClose: () => void;
|
|
652
663
|
onBuy: (credits: number, price: number) => void;
|
|
653
664
|
}
|
|
654
|
-
declare function BuyCreditsModal({ onClose, onBuy }: BuyCreditsModalProps): react_jsx_runtime.JSX.Element;
|
|
665
|
+
declare function BuyCreditsModal({ currencySymbol, onClose, onBuy, }: BuyCreditsModalProps): react_jsx_runtime.JSX.Element;
|
|
655
666
|
|
|
656
667
|
interface UserPermissions {
|
|
657
668
|
artifax: boolean;
|
package/dist/index.d.ts
CHANGED
|
@@ -88,6 +88,8 @@ interface SettingsWorkspaceCurrent {
|
|
|
88
88
|
/** Optional reactive credit summary if the host tracks it. */
|
|
89
89
|
availableCredits?: number | null;
|
|
90
90
|
totalCredits?: number | null;
|
|
91
|
+
/** ISO country code for the workspace; drives plan currency selection. */
|
|
92
|
+
country?: string;
|
|
91
93
|
}
|
|
92
94
|
interface SettingsWorkspaceListItem {
|
|
93
95
|
_id: string;
|
|
@@ -264,12 +266,18 @@ interface SubscriptionPlan {
|
|
|
264
266
|
name: string;
|
|
265
267
|
amount: number;
|
|
266
268
|
subscriptionEndDate?: string;
|
|
269
|
+
/** Three-letter currency code (lowercase) when known, e.g. "inr" / "usd". */
|
|
270
|
+
currency?: string;
|
|
271
|
+
/** Stripe billing interval, e.g. "month" / "year". */
|
|
272
|
+
interval?: string;
|
|
267
273
|
}
|
|
268
274
|
interface BillingSubscription {
|
|
269
275
|
createdAt: string;
|
|
270
276
|
downgradeScheduled: boolean;
|
|
271
277
|
stripeCustomerId: string;
|
|
272
278
|
plan: SubscriptionPlan;
|
|
279
|
+
/** Stripe product id; used to look up the matching product in fetched plans. */
|
|
280
|
+
stripeProductId?: string;
|
|
273
281
|
}
|
|
274
282
|
interface SubscriptionResponse {
|
|
275
283
|
data: BillingSubscription | null;
|
|
@@ -283,6 +291,8 @@ interface Price {
|
|
|
283
291
|
id: string;
|
|
284
292
|
unit_amount: number;
|
|
285
293
|
metadata: PriceMetadata;
|
|
294
|
+
/** Three-letter currency code (lowercase) when present, e.g. "inr" / "usd". */
|
|
295
|
+
currency?: string;
|
|
286
296
|
}
|
|
287
297
|
interface BillingProduct {
|
|
288
298
|
id: string;
|
|
@@ -573,7 +583,7 @@ type IconProps = Omit<SVGProps<SVGSVGElement>, 'color' | 'strokeWidth' | 'width'
|
|
|
573
583
|
};
|
|
574
584
|
declare const SiconKey: ({ color, strokeWidth, size, ...props }: IconProps) => react_jsx_runtime.JSX.Element;
|
|
575
585
|
|
|
576
|
-
declare function BillingContent({ embedded }?: {
|
|
586
|
+
declare function BillingContent({ embedded, }?: {
|
|
577
587
|
embedded?: boolean;
|
|
578
588
|
}): react_jsx_runtime.JSX.Element;
|
|
579
589
|
|
|
@@ -648,10 +658,11 @@ interface ConfirmDeleteModalProps {
|
|
|
648
658
|
declare function ConfirmDeleteModal({ open, workspaceName, onClose, onConfirm, }: ConfirmDeleteModalProps): react_jsx_runtime.JSX.Element | null;
|
|
649
659
|
|
|
650
660
|
interface BuyCreditsModalProps {
|
|
661
|
+
currencySymbol?: string;
|
|
651
662
|
onClose: () => void;
|
|
652
663
|
onBuy: (credits: number, price: number) => void;
|
|
653
664
|
}
|
|
654
|
-
declare function BuyCreditsModal({ onClose, onBuy }: BuyCreditsModalProps): react_jsx_runtime.JSX.Element;
|
|
665
|
+
declare function BuyCreditsModal({ currencySymbol, onClose, onBuy, }: BuyCreditsModalProps): react_jsx_runtime.JSX.Element;
|
|
655
666
|
|
|
656
667
|
interface UserPermissions {
|
|
657
668
|
artifax: boolean;
|
package/dist/index.js
CHANGED
|
@@ -3806,7 +3806,11 @@ var MIN_USD = 40;
|
|
|
3806
3806
|
var MAX_USD = 1e4;
|
|
3807
3807
|
var MIN_CREDITS = Math.round(MIN_USD / PRICE_PER_CREDIT);
|
|
3808
3808
|
var MAX_CREDITS = Math.round(MAX_USD / PRICE_PER_CREDIT);
|
|
3809
|
-
function BuyCreditsModal({
|
|
3809
|
+
function BuyCreditsModal({
|
|
3810
|
+
currencySymbol = "$",
|
|
3811
|
+
onClose,
|
|
3812
|
+
onBuy
|
|
3813
|
+
}) {
|
|
3810
3814
|
const [credits, setCredits] = (0, import_react7.useState)(MIN_CREDITS);
|
|
3811
3815
|
const [creditsInput, setCreditsInput] = (0, import_react7.useState)(String(MIN_CREDITS));
|
|
3812
3816
|
const [priceInput, setPriceInput] = (0, import_react7.useState)(String(MIN_CREDITS * PRICE_PER_CREDIT));
|
|
@@ -4051,7 +4055,7 @@ function BuyCreditsModal({ onClose, onBuy }) {
|
|
|
4051
4055
|
lineHeight: "var(--line-height-line-height-lg)",
|
|
4052
4056
|
color: "var(--alias-text---icons-primary)"
|
|
4053
4057
|
},
|
|
4054
|
-
children:
|
|
4058
|
+
children: currencySymbol
|
|
4055
4059
|
}
|
|
4056
4060
|
),
|
|
4057
4061
|
/* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
|
|
@@ -4071,7 +4075,7 @@ function BuyCreditsModal({ onClose, onBuy }) {
|
|
|
4071
4075
|
onKeyDown: (e) => {
|
|
4072
4076
|
if (e.key === "Enter") e.currentTarget.blur();
|
|
4073
4077
|
},
|
|
4074
|
-
"aria-label": "Price
|
|
4078
|
+
"aria-label": "Price",
|
|
4075
4079
|
style: {
|
|
4076
4080
|
fontFamily: "var(--font-family-font-family-body)",
|
|
4077
4081
|
fontSize: "var(--font-size-font-size-lg)",
|
|
@@ -4195,9 +4199,15 @@ function formatDate(iso) {
|
|
|
4195
4199
|
return iso;
|
|
4196
4200
|
}
|
|
4197
4201
|
}
|
|
4198
|
-
function formatCurrency(cents) {
|
|
4202
|
+
function formatCurrency(cents, currency) {
|
|
4203
|
+
if (currency === "inr") {
|
|
4204
|
+
return `\u20B9${(cents / 100).toFixed(2)}`;
|
|
4205
|
+
}
|
|
4199
4206
|
return `$${(cents / 100).toFixed(2)}`;
|
|
4200
4207
|
}
|
|
4208
|
+
function getCurrencySymbolByCountry(country) {
|
|
4209
|
+
return country?.trim().toUpperCase() === "IN" ? "\u20B9" : "$";
|
|
4210
|
+
}
|
|
4201
4211
|
function formatCredits(n) {
|
|
4202
4212
|
return n.toLocaleString("en-US");
|
|
4203
4213
|
}
|
|
@@ -4759,9 +4769,15 @@ function PlansView({
|
|
|
4759
4769
|
downgradeScheduled,
|
|
4760
4770
|
actionInFlight,
|
|
4761
4771
|
onPlanAction,
|
|
4762
|
-
onCancelDowngrade
|
|
4772
|
+
onCancelDowngrade,
|
|
4773
|
+
workspace,
|
|
4774
|
+
isProPlan
|
|
4763
4775
|
}) {
|
|
4776
|
+
console.log("=============", products);
|
|
4764
4777
|
const { toast } = useSettingsAdapters();
|
|
4778
|
+
const workspaceCurrencySymbol = getCurrencySymbolByCountry(
|
|
4779
|
+
workspace?.country
|
|
4780
|
+
);
|
|
4765
4781
|
const allPlans = (0, import_react8.useMemo)(() => {
|
|
4766
4782
|
if (products.length > 0) {
|
|
4767
4783
|
return products.flatMap(
|
|
@@ -4770,9 +4786,10 @@ function PlansView({
|
|
|
4770
4786
|
productId: product.id,
|
|
4771
4787
|
priceId: price.id,
|
|
4772
4788
|
planName: price.metadata.name,
|
|
4773
|
-
price: price.unit_amount === 0 ? "
|
|
4789
|
+
price: price.unit_amount === 0 ? price.currency === "inr" ? "\u20B90" : `${workspaceCurrencySymbol}0` : `${formatCurrency(price.unit_amount, price.currency ?? "usd")} / month`,
|
|
4774
4790
|
credits: `${Number(price.metadata.credits).toLocaleString()} credits`,
|
|
4775
4791
|
amount: price.unit_amount,
|
|
4792
|
+
currency: price.currency?.toLowerCase(),
|
|
4776
4793
|
isCurrent: price.id === currentPlanId
|
|
4777
4794
|
}))
|
|
4778
4795
|
);
|
|
@@ -4783,18 +4800,12 @@ function PlansView({
|
|
|
4783
4800
|
() => [...allPlans].sort((a, b) => a.amount - b.amount),
|
|
4784
4801
|
[allPlans]
|
|
4785
4802
|
);
|
|
4803
|
+
console.log("All plans:::::::::::::::", workspace, sortedPlans);
|
|
4786
4804
|
const isNotFreePlan = (planName) => {
|
|
4787
|
-
if (planName) {
|
|
4788
|
-
return
|
|
4789
|
-
"Free (DR Test)",
|
|
4790
|
-
"Custom",
|
|
4791
|
-
"custom",
|
|
4792
|
-
"custom_shopify",
|
|
4793
|
-
"custom shopify",
|
|
4794
|
-
"Custom_Shopify"
|
|
4795
|
-
].includes(planName);
|
|
4805
|
+
if (planName.toLowerCase() === "free") {
|
|
4806
|
+
return false;
|
|
4796
4807
|
}
|
|
4797
|
-
return
|
|
4808
|
+
return true;
|
|
4798
4809
|
};
|
|
4799
4810
|
const freePlan = sortedPlans.find(
|
|
4800
4811
|
(plan) => plan.amount === 0 && !isNotFreePlan(plan.planName)
|
|
@@ -4935,7 +4946,7 @@ function PlansView({
|
|
|
4935
4946
|
import_ui5.ScPlanCard,
|
|
4936
4947
|
{
|
|
4937
4948
|
planName: freePlan?.planName || "Free",
|
|
4938
|
-
price: freePlan?.price ||
|
|
4949
|
+
price: freePlan?.price || `${workspaceCurrencySymbol}0`,
|
|
4939
4950
|
credits: freePlan?.credits || "3,000 credits",
|
|
4940
4951
|
type: "free",
|
|
4941
4952
|
features: getPlanFeatures(freePlan?.amount ?? 0),
|
|
@@ -5095,10 +5106,13 @@ function PlansView({
|
|
|
5095
5106
|
UpdateSubscriptionModal,
|
|
5096
5107
|
{
|
|
5097
5108
|
open: showUpgradeConfirmModal,
|
|
5098
|
-
currentPlanName: currentPlan?.planName || "Free",
|
|
5099
|
-
currentPlanAmount: currentPlan ? currentPlan.amount === 0 ?
|
|
5109
|
+
currentPlanName: isProPlan ? "Pro" : currentPlan?.planName || "Free",
|
|
5110
|
+
currentPlanAmount: currentPlan ? currentPlan.amount === 0 ? `${workspaceCurrencySymbol}0` : formatCurrency(currentPlan.amount, currentPlan.currency || "") : `${workspaceCurrencySymbol}0`,
|
|
5100
5111
|
nextPlanName: selectedMiddlePlan?.planName || "Pro",
|
|
5101
|
-
nextPlanAmount: selectedMiddlePlan ? selectedMiddlePlan.amount === 0 ?
|
|
5112
|
+
nextPlanAmount: selectedMiddlePlan ? selectedMiddlePlan.amount === 0 ? `${workspaceCurrencySymbol}0` : formatCurrency(
|
|
5113
|
+
selectedMiddlePlan.amount,
|
|
5114
|
+
selectedMiddlePlan.currency || ""
|
|
5115
|
+
) : `${workspaceCurrencySymbol}0`,
|
|
5102
5116
|
nextBillingDateLabel: formatNextBillingDateLabel(currentPlanEndDate),
|
|
5103
5117
|
loading: isMiddleActionLoading,
|
|
5104
5118
|
onClose: () => setShowUpgradeConfirmModal(false),
|
|
@@ -5161,9 +5175,11 @@ function BillingTabBar({
|
|
|
5161
5175
|
}
|
|
5162
5176
|
function InvoiceHistoryTable({
|
|
5163
5177
|
invoices,
|
|
5164
|
-
loading
|
|
5178
|
+
loading,
|
|
5179
|
+
workspaceCountry
|
|
5165
5180
|
}) {
|
|
5166
5181
|
const { api, toast } = useSettingsAdapters();
|
|
5182
|
+
const currencySymbol = getCurrencySymbolByCountry(workspaceCountry);
|
|
5167
5183
|
const handleDownload = async (item) => {
|
|
5168
5184
|
const orderId = item.transactionId;
|
|
5169
5185
|
if (!orderId) {
|
|
@@ -5277,7 +5293,7 @@ function InvoiceHistoryTable({
|
|
|
5277
5293
|
import_ui5.ScBillingHistoryTableList,
|
|
5278
5294
|
{
|
|
5279
5295
|
invoiceNumber: inv.transactionId ? `# ${inv.transactionId.slice(0, 16).toUpperCase()}` : "# INV-UNKNOWN",
|
|
5280
|
-
amount: inv.amountPaid != null ?
|
|
5296
|
+
amount: inv.amountPaid != null ? `${currencySymbol}${inv.amountPaid.toFixed(2)}` : `${currencySymbol}${(inv.amount / 100).toFixed(2)}`,
|
|
5281
5297
|
date: formatDate(inv.createdAt),
|
|
5282
5298
|
downloadLabel: "Download invoice",
|
|
5283
5299
|
onClick: (e) => handleRowClick(e, inv)
|
|
@@ -5472,7 +5488,9 @@ function UsageLogsTable({
|
|
|
5472
5488
|
}
|
|
5473
5489
|
);
|
|
5474
5490
|
}
|
|
5475
|
-
function BillingContent({
|
|
5491
|
+
function BillingContent({
|
|
5492
|
+
embedded = false
|
|
5493
|
+
} = {}) {
|
|
5476
5494
|
const { auth, workspace, api, toast, navigation } = useSettingsAdapters();
|
|
5477
5495
|
const user = auth.user;
|
|
5478
5496
|
const workspaceId = workspace.current?.id ?? null;
|
|
@@ -5527,6 +5545,7 @@ function BillingContent({ embedded = false } = {}) {
|
|
|
5527
5545
|
const fetchBillingOverview = (0, import_react8.useCallback)(async () => {
|
|
5528
5546
|
setLoadingBilling(true);
|
|
5529
5547
|
try {
|
|
5548
|
+
console.log("calling Billing apis");
|
|
5530
5549
|
const [subRes, creditsRes, productsRes, customRes] = await Promise.all([
|
|
5531
5550
|
api.fetchCurrentPlan().catch(() => null),
|
|
5532
5551
|
api.fetchAvailableCredits().catch(() => null),
|
|
@@ -5536,7 +5555,17 @@ function BillingContent({ embedded = false } = {}) {
|
|
|
5536
5555
|
if (subRes?.data) setSubscription(subRes.data);
|
|
5537
5556
|
if (creditsRes?.availableCredits != null)
|
|
5538
5557
|
setAvailableCredits(creditsRes.availableCredits);
|
|
5539
|
-
if (productsRes?.data)
|
|
5558
|
+
if (productsRes?.data) {
|
|
5559
|
+
const normalizedWorkspaceCountry = workspace.current?.country?.trim().toUpperCase();
|
|
5560
|
+
const targetCurrency = normalizedWorkspaceCountry === "IN" ? "inr" : "usd";
|
|
5561
|
+
const filteredProducts = productsRes.data.map((product) => ({
|
|
5562
|
+
...product,
|
|
5563
|
+
prices: product.prices.filter(
|
|
5564
|
+
(price) => price.currency?.toLowerCase() === targetCurrency
|
|
5565
|
+
)
|
|
5566
|
+
})).filter((product) => product.prices.length > 0);
|
|
5567
|
+
setProducts(filteredProducts);
|
|
5568
|
+
}
|
|
5540
5569
|
if (customRes?.data?.credits != null) {
|
|
5541
5570
|
setCustomPlanCredits(customRes.data.credits);
|
|
5542
5571
|
}
|
|
@@ -5544,7 +5573,7 @@ function BillingContent({ embedded = false } = {}) {
|
|
|
5544
5573
|
} finally {
|
|
5545
5574
|
setLoadingBilling(false);
|
|
5546
5575
|
}
|
|
5547
|
-
}, [api]);
|
|
5576
|
+
}, [api, workspace.current?.country]);
|
|
5548
5577
|
const fetchUserMap = (0, import_react8.useCallback)(async () => {
|
|
5549
5578
|
try {
|
|
5550
5579
|
const members = await api.fetchMembers();
|
|
@@ -5705,9 +5734,14 @@ function BillingContent({ embedded = false } = {}) {
|
|
|
5705
5734
|
if (loadingBilling) return;
|
|
5706
5735
|
setShowInitialLoader(false);
|
|
5707
5736
|
}, [showInitialLoader, initialFetchTriggered, loadingBilling]);
|
|
5708
|
-
|
|
5737
|
+
console.log("subscription", subscription);
|
|
5738
|
+
const isProPlan = products.some(
|
|
5739
|
+
(product) => product.id == subscription?.stripeProductId && product.name == "Paid"
|
|
5740
|
+
);
|
|
5741
|
+
console.log("isProPlan", isProPlan);
|
|
5742
|
+
const planName = isProPlan ? "Pro" : subscription?.plan?.name?.trim() || (subscription?.plan?.amount ? subscription.plan.amount > 0 ? "Pro" : "Free" : "-");
|
|
5709
5743
|
const isFreePlan = subscription?.plan?.amount == null || subscription.plan.amount === 0;
|
|
5710
|
-
const planAmount = subscription?.plan?.amount != null ?
|
|
5744
|
+
const planAmount = subscription?.plan?.amount != null ? `${subscription?.plan?.currency == "inr" ? "\u20B9" : "$"}${(subscription.plan.amount / 100).toFixed(2)} / ${subscription?.plan?.interval}` : `${getCurrencySymbolByCountry(workspace.current?.country)}0`;
|
|
5711
5745
|
const usedCredits = availableCredits != null && totalCredits != null ? Math.max(0, totalCredits - availableCredits) : null;
|
|
5712
5746
|
const progressPct = usedCredits != null && totalCredits != null && totalCredits > 0 ? Math.min(100, Math.round(usedCredits / totalCredits * 100)) : 0;
|
|
5713
5747
|
const remainingPct = 100 - progressPct;
|
|
@@ -5905,7 +5939,9 @@ function BillingContent({ embedded = false } = {}) {
|
|
|
5905
5939
|
downgradeScheduled: Boolean(subscription?.downgradeScheduled),
|
|
5906
5940
|
actionInFlight: planActionInFlight,
|
|
5907
5941
|
onPlanAction: handlePlanAction,
|
|
5908
|
-
onCancelDowngrade: handleCancelDowngrade
|
|
5942
|
+
onCancelDowngrade: handleCancelDowngrade,
|
|
5943
|
+
workspace: workspace.current,
|
|
5944
|
+
isProPlan
|
|
5909
5945
|
}
|
|
5910
5946
|
);
|
|
5911
5947
|
if (embedded) return plansView;
|
|
@@ -5996,7 +6032,14 @@ function BillingContent({ embedded = false } = {}) {
|
|
|
5996
6032
|
}
|
|
5997
6033
|
)
|
|
5998
6034
|
] }),
|
|
5999
|
-
activeTab === "invoice" ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
6035
|
+
activeTab === "invoice" ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
6036
|
+
InvoiceHistoryTable,
|
|
6037
|
+
{
|
|
6038
|
+
invoices,
|
|
6039
|
+
loading: loadingTable,
|
|
6040
|
+
workspaceCountry: workspace.current?.country
|
|
6041
|
+
}
|
|
6042
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
6000
6043
|
UsageLogsTable,
|
|
6001
6044
|
{
|
|
6002
6045
|
logs: usageLogs,
|
|
@@ -6015,6 +6058,7 @@ function BillingContent({ embedded = false } = {}) {
|
|
|
6015
6058
|
showBuyCreditsModal && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
|
|
6016
6059
|
BuyCreditsModal,
|
|
6017
6060
|
{
|
|
6061
|
+
currencySymbol: getCurrencySymbolByCountry(workspace.current?.country),
|
|
6018
6062
|
onClose: () => setShowBuyCreditsModal(false),
|
|
6019
6063
|
onBuy: (credits, price) => {
|
|
6020
6064
|
handleBuyCredits(credits, price);
|
package/dist/index.mjs
CHANGED
|
@@ -3387,7 +3387,13 @@ function TeamsContent({
|
|
|
3387
3387
|
}
|
|
3388
3388
|
|
|
3389
3389
|
// src/billing-content.tsx
|
|
3390
|
-
import {
|
|
3390
|
+
import {
|
|
3391
|
+
useState as useState7,
|
|
3392
|
+
useEffect as useEffect4,
|
|
3393
|
+
useCallback as useCallback3,
|
|
3394
|
+
useMemo as useMemo2,
|
|
3395
|
+
useRef as useRef2
|
|
3396
|
+
} from "react";
|
|
3391
3397
|
import {
|
|
3392
3398
|
ScPlanDetailsCard,
|
|
3393
3399
|
ScCreditsUsageCard,
|
|
@@ -3402,7 +3408,6 @@ import {
|
|
|
3402
3408
|
SiconLeft as SiconLeft2,
|
|
3403
3409
|
SiconDoubleArrow,
|
|
3404
3410
|
SiconClose as SiconClose4,
|
|
3405
|
-
SiconCredits,
|
|
3406
3411
|
SiconArtifacts as SiconArtifacts3,
|
|
3407
3412
|
SiconPhotogenix as SiconPhotogenix3,
|
|
3408
3413
|
SiconCatalogix as SiconCatalogix2
|
|
@@ -3820,7 +3825,11 @@ var MIN_USD = 40;
|
|
|
3820
3825
|
var MAX_USD = 1e4;
|
|
3821
3826
|
var MIN_CREDITS = Math.round(MIN_USD / PRICE_PER_CREDIT);
|
|
3822
3827
|
var MAX_CREDITS = Math.round(MAX_USD / PRICE_PER_CREDIT);
|
|
3823
|
-
function BuyCreditsModal({
|
|
3828
|
+
function BuyCreditsModal({
|
|
3829
|
+
currencySymbol = "$",
|
|
3830
|
+
onClose,
|
|
3831
|
+
onBuy
|
|
3832
|
+
}) {
|
|
3824
3833
|
const [credits, setCredits] = useState6(MIN_CREDITS);
|
|
3825
3834
|
const [creditsInput, setCreditsInput] = useState6(String(MIN_CREDITS));
|
|
3826
3835
|
const [priceInput, setPriceInput] = useState6(String(MIN_CREDITS * PRICE_PER_CREDIT));
|
|
@@ -4065,7 +4074,7 @@ function BuyCreditsModal({ onClose, onBuy }) {
|
|
|
4065
4074
|
lineHeight: "var(--line-height-line-height-lg)",
|
|
4066
4075
|
color: "var(--alias-text---icons-primary)"
|
|
4067
4076
|
},
|
|
4068
|
-
children:
|
|
4077
|
+
children: currencySymbol
|
|
4069
4078
|
}
|
|
4070
4079
|
),
|
|
4071
4080
|
/* @__PURE__ */ jsx10(
|
|
@@ -4085,7 +4094,7 @@ function BuyCreditsModal({ onClose, onBuy }) {
|
|
|
4085
4094
|
onKeyDown: (e) => {
|
|
4086
4095
|
if (e.key === "Enter") e.currentTarget.blur();
|
|
4087
4096
|
},
|
|
4088
|
-
"aria-label": "Price
|
|
4097
|
+
"aria-label": "Price",
|
|
4089
4098
|
style: {
|
|
4090
4099
|
fontFamily: "var(--font-family-font-family-body)",
|
|
4091
4100
|
fontSize: "var(--font-size-font-size-lg)",
|
|
@@ -4209,9 +4218,15 @@ function formatDate(iso) {
|
|
|
4209
4218
|
return iso;
|
|
4210
4219
|
}
|
|
4211
4220
|
}
|
|
4212
|
-
function formatCurrency(cents) {
|
|
4221
|
+
function formatCurrency(cents, currency) {
|
|
4222
|
+
if (currency === "inr") {
|
|
4223
|
+
return `\u20B9${(cents / 100).toFixed(2)}`;
|
|
4224
|
+
}
|
|
4213
4225
|
return `$${(cents / 100).toFixed(2)}`;
|
|
4214
4226
|
}
|
|
4227
|
+
function getCurrencySymbolByCountry(country) {
|
|
4228
|
+
return country?.trim().toUpperCase() === "IN" ? "\u20B9" : "$";
|
|
4229
|
+
}
|
|
4215
4230
|
function formatCredits(n) {
|
|
4216
4231
|
return n.toLocaleString("en-US");
|
|
4217
4232
|
}
|
|
@@ -4773,9 +4788,15 @@ function PlansView({
|
|
|
4773
4788
|
downgradeScheduled,
|
|
4774
4789
|
actionInFlight,
|
|
4775
4790
|
onPlanAction,
|
|
4776
|
-
onCancelDowngrade
|
|
4791
|
+
onCancelDowngrade,
|
|
4792
|
+
workspace,
|
|
4793
|
+
isProPlan
|
|
4777
4794
|
}) {
|
|
4795
|
+
console.log("=============", products);
|
|
4778
4796
|
const { toast } = useSettingsAdapters();
|
|
4797
|
+
const workspaceCurrencySymbol = getCurrencySymbolByCountry(
|
|
4798
|
+
workspace?.country
|
|
4799
|
+
);
|
|
4779
4800
|
const allPlans = useMemo2(() => {
|
|
4780
4801
|
if (products.length > 0) {
|
|
4781
4802
|
return products.flatMap(
|
|
@@ -4784,9 +4805,10 @@ function PlansView({
|
|
|
4784
4805
|
productId: product.id,
|
|
4785
4806
|
priceId: price.id,
|
|
4786
4807
|
planName: price.metadata.name,
|
|
4787
|
-
price: price.unit_amount === 0 ? "
|
|
4808
|
+
price: price.unit_amount === 0 ? price.currency === "inr" ? "\u20B90" : `${workspaceCurrencySymbol}0` : `${formatCurrency(price.unit_amount, price.currency ?? "usd")} / month`,
|
|
4788
4809
|
credits: `${Number(price.metadata.credits).toLocaleString()} credits`,
|
|
4789
4810
|
amount: price.unit_amount,
|
|
4811
|
+
currency: price.currency?.toLowerCase(),
|
|
4790
4812
|
isCurrent: price.id === currentPlanId
|
|
4791
4813
|
}))
|
|
4792
4814
|
);
|
|
@@ -4797,18 +4819,12 @@ function PlansView({
|
|
|
4797
4819
|
() => [...allPlans].sort((a, b) => a.amount - b.amount),
|
|
4798
4820
|
[allPlans]
|
|
4799
4821
|
);
|
|
4822
|
+
console.log("All plans:::::::::::::::", workspace, sortedPlans);
|
|
4800
4823
|
const isNotFreePlan = (planName) => {
|
|
4801
|
-
if (planName) {
|
|
4802
|
-
return
|
|
4803
|
-
"Free (DR Test)",
|
|
4804
|
-
"Custom",
|
|
4805
|
-
"custom",
|
|
4806
|
-
"custom_shopify",
|
|
4807
|
-
"custom shopify",
|
|
4808
|
-
"Custom_Shopify"
|
|
4809
|
-
].includes(planName);
|
|
4824
|
+
if (planName.toLowerCase() === "free") {
|
|
4825
|
+
return false;
|
|
4810
4826
|
}
|
|
4811
|
-
return
|
|
4827
|
+
return true;
|
|
4812
4828
|
};
|
|
4813
4829
|
const freePlan = sortedPlans.find(
|
|
4814
4830
|
(plan) => plan.amount === 0 && !isNotFreePlan(plan.planName)
|
|
@@ -4949,7 +4965,7 @@ function PlansView({
|
|
|
4949
4965
|
ScPlanCard,
|
|
4950
4966
|
{
|
|
4951
4967
|
planName: freePlan?.planName || "Free",
|
|
4952
|
-
price: freePlan?.price ||
|
|
4968
|
+
price: freePlan?.price || `${workspaceCurrencySymbol}0`,
|
|
4953
4969
|
credits: freePlan?.credits || "3,000 credits",
|
|
4954
4970
|
type: "free",
|
|
4955
4971
|
features: getPlanFeatures(freePlan?.amount ?? 0),
|
|
@@ -5109,10 +5125,13 @@ function PlansView({
|
|
|
5109
5125
|
UpdateSubscriptionModal,
|
|
5110
5126
|
{
|
|
5111
5127
|
open: showUpgradeConfirmModal,
|
|
5112
|
-
currentPlanName: currentPlan?.planName || "Free",
|
|
5113
|
-
currentPlanAmount: currentPlan ? currentPlan.amount === 0 ?
|
|
5128
|
+
currentPlanName: isProPlan ? "Pro" : currentPlan?.planName || "Free",
|
|
5129
|
+
currentPlanAmount: currentPlan ? currentPlan.amount === 0 ? `${workspaceCurrencySymbol}0` : formatCurrency(currentPlan.amount, currentPlan.currency || "") : `${workspaceCurrencySymbol}0`,
|
|
5114
5130
|
nextPlanName: selectedMiddlePlan?.planName || "Pro",
|
|
5115
|
-
nextPlanAmount: selectedMiddlePlan ? selectedMiddlePlan.amount === 0 ?
|
|
5131
|
+
nextPlanAmount: selectedMiddlePlan ? selectedMiddlePlan.amount === 0 ? `${workspaceCurrencySymbol}0` : formatCurrency(
|
|
5132
|
+
selectedMiddlePlan.amount,
|
|
5133
|
+
selectedMiddlePlan.currency || ""
|
|
5134
|
+
) : `${workspaceCurrencySymbol}0`,
|
|
5116
5135
|
nextBillingDateLabel: formatNextBillingDateLabel(currentPlanEndDate),
|
|
5117
5136
|
loading: isMiddleActionLoading,
|
|
5118
5137
|
onClose: () => setShowUpgradeConfirmModal(false),
|
|
@@ -5175,9 +5194,11 @@ function BillingTabBar({
|
|
|
5175
5194
|
}
|
|
5176
5195
|
function InvoiceHistoryTable({
|
|
5177
5196
|
invoices,
|
|
5178
|
-
loading
|
|
5197
|
+
loading,
|
|
5198
|
+
workspaceCountry
|
|
5179
5199
|
}) {
|
|
5180
5200
|
const { api, toast } = useSettingsAdapters();
|
|
5201
|
+
const currencySymbol = getCurrencySymbolByCountry(workspaceCountry);
|
|
5181
5202
|
const handleDownload = async (item) => {
|
|
5182
5203
|
const orderId = item.transactionId;
|
|
5183
5204
|
if (!orderId) {
|
|
@@ -5291,7 +5312,7 @@ function InvoiceHistoryTable({
|
|
|
5291
5312
|
ScBillingHistoryTableList,
|
|
5292
5313
|
{
|
|
5293
5314
|
invoiceNumber: inv.transactionId ? `# ${inv.transactionId.slice(0, 16).toUpperCase()}` : "# INV-UNKNOWN",
|
|
5294
|
-
amount: inv.amountPaid != null ?
|
|
5315
|
+
amount: inv.amountPaid != null ? `${currencySymbol}${inv.amountPaid.toFixed(2)}` : `${currencySymbol}${(inv.amount / 100).toFixed(2)}`,
|
|
5295
5316
|
date: formatDate(inv.createdAt),
|
|
5296
5317
|
downloadLabel: "Download invoice",
|
|
5297
5318
|
onClick: (e) => handleRowClick(e, inv)
|
|
@@ -5486,7 +5507,9 @@ function UsageLogsTable({
|
|
|
5486
5507
|
}
|
|
5487
5508
|
);
|
|
5488
5509
|
}
|
|
5489
|
-
function BillingContent({
|
|
5510
|
+
function BillingContent({
|
|
5511
|
+
embedded = false
|
|
5512
|
+
} = {}) {
|
|
5490
5513
|
const { auth, workspace, api, toast, navigation } = useSettingsAdapters();
|
|
5491
5514
|
const user = auth.user;
|
|
5492
5515
|
const workspaceId = workspace.current?.id ?? null;
|
|
@@ -5541,6 +5564,7 @@ function BillingContent({ embedded = false } = {}) {
|
|
|
5541
5564
|
const fetchBillingOverview = useCallback3(async () => {
|
|
5542
5565
|
setLoadingBilling(true);
|
|
5543
5566
|
try {
|
|
5567
|
+
console.log("calling Billing apis");
|
|
5544
5568
|
const [subRes, creditsRes, productsRes, customRes] = await Promise.all([
|
|
5545
5569
|
api.fetchCurrentPlan().catch(() => null),
|
|
5546
5570
|
api.fetchAvailableCredits().catch(() => null),
|
|
@@ -5550,7 +5574,17 @@ function BillingContent({ embedded = false } = {}) {
|
|
|
5550
5574
|
if (subRes?.data) setSubscription(subRes.data);
|
|
5551
5575
|
if (creditsRes?.availableCredits != null)
|
|
5552
5576
|
setAvailableCredits(creditsRes.availableCredits);
|
|
5553
|
-
if (productsRes?.data)
|
|
5577
|
+
if (productsRes?.data) {
|
|
5578
|
+
const normalizedWorkspaceCountry = workspace.current?.country?.trim().toUpperCase();
|
|
5579
|
+
const targetCurrency = normalizedWorkspaceCountry === "IN" ? "inr" : "usd";
|
|
5580
|
+
const filteredProducts = productsRes.data.map((product) => ({
|
|
5581
|
+
...product,
|
|
5582
|
+
prices: product.prices.filter(
|
|
5583
|
+
(price) => price.currency?.toLowerCase() === targetCurrency
|
|
5584
|
+
)
|
|
5585
|
+
})).filter((product) => product.prices.length > 0);
|
|
5586
|
+
setProducts(filteredProducts);
|
|
5587
|
+
}
|
|
5554
5588
|
if (customRes?.data?.credits != null) {
|
|
5555
5589
|
setCustomPlanCredits(customRes.data.credits);
|
|
5556
5590
|
}
|
|
@@ -5558,7 +5592,7 @@ function BillingContent({ embedded = false } = {}) {
|
|
|
5558
5592
|
} finally {
|
|
5559
5593
|
setLoadingBilling(false);
|
|
5560
5594
|
}
|
|
5561
|
-
}, [api]);
|
|
5595
|
+
}, [api, workspace.current?.country]);
|
|
5562
5596
|
const fetchUserMap = useCallback3(async () => {
|
|
5563
5597
|
try {
|
|
5564
5598
|
const members = await api.fetchMembers();
|
|
@@ -5719,9 +5753,14 @@ function BillingContent({ embedded = false } = {}) {
|
|
|
5719
5753
|
if (loadingBilling) return;
|
|
5720
5754
|
setShowInitialLoader(false);
|
|
5721
5755
|
}, [showInitialLoader, initialFetchTriggered, loadingBilling]);
|
|
5722
|
-
|
|
5756
|
+
console.log("subscription", subscription);
|
|
5757
|
+
const isProPlan = products.some(
|
|
5758
|
+
(product) => product.id == subscription?.stripeProductId && product.name == "Paid"
|
|
5759
|
+
);
|
|
5760
|
+
console.log("isProPlan", isProPlan);
|
|
5761
|
+
const planName = isProPlan ? "Pro" : subscription?.plan?.name?.trim() || (subscription?.plan?.amount ? subscription.plan.amount > 0 ? "Pro" : "Free" : "-");
|
|
5723
5762
|
const isFreePlan = subscription?.plan?.amount == null || subscription.plan.amount === 0;
|
|
5724
|
-
const planAmount = subscription?.plan?.amount != null ?
|
|
5763
|
+
const planAmount = subscription?.plan?.amount != null ? `${subscription?.plan?.currency == "inr" ? "\u20B9" : "$"}${(subscription.plan.amount / 100).toFixed(2)} / ${subscription?.plan?.interval}` : `${getCurrencySymbolByCountry(workspace.current?.country)}0`;
|
|
5725
5764
|
const usedCredits = availableCredits != null && totalCredits != null ? Math.max(0, totalCredits - availableCredits) : null;
|
|
5726
5765
|
const progressPct = usedCredits != null && totalCredits != null && totalCredits > 0 ? Math.min(100, Math.round(usedCredits / totalCredits * 100)) : 0;
|
|
5727
5766
|
const remainingPct = 100 - progressPct;
|
|
@@ -5919,7 +5958,9 @@ function BillingContent({ embedded = false } = {}) {
|
|
|
5919
5958
|
downgradeScheduled: Boolean(subscription?.downgradeScheduled),
|
|
5920
5959
|
actionInFlight: planActionInFlight,
|
|
5921
5960
|
onPlanAction: handlePlanAction,
|
|
5922
|
-
onCancelDowngrade: handleCancelDowngrade
|
|
5961
|
+
onCancelDowngrade: handleCancelDowngrade,
|
|
5962
|
+
workspace: workspace.current,
|
|
5963
|
+
isProPlan
|
|
5923
5964
|
}
|
|
5924
5965
|
);
|
|
5925
5966
|
if (embedded) return plansView;
|
|
@@ -6010,7 +6051,14 @@ function BillingContent({ embedded = false } = {}) {
|
|
|
6010
6051
|
}
|
|
6011
6052
|
)
|
|
6012
6053
|
] }),
|
|
6013
|
-
activeTab === "invoice" ? /* @__PURE__ */ jsx11(
|
|
6054
|
+
activeTab === "invoice" ? /* @__PURE__ */ jsx11(
|
|
6055
|
+
InvoiceHistoryTable,
|
|
6056
|
+
{
|
|
6057
|
+
invoices,
|
|
6058
|
+
loading: loadingTable,
|
|
6059
|
+
workspaceCountry: workspace.current?.country
|
|
6060
|
+
}
|
|
6061
|
+
) : /* @__PURE__ */ jsx11(
|
|
6014
6062
|
UsageLogsTable,
|
|
6015
6063
|
{
|
|
6016
6064
|
logs: usageLogs,
|
|
@@ -6029,6 +6077,7 @@ function BillingContent({ embedded = false } = {}) {
|
|
|
6029
6077
|
showBuyCreditsModal && /* @__PURE__ */ jsx11(
|
|
6030
6078
|
BuyCreditsModal,
|
|
6031
6079
|
{
|
|
6080
|
+
currencySymbol: getCurrencySymbolByCountry(workspace.current?.country),
|
|
6032
6081
|
onClose: () => setShowBuyCreditsModal(false),
|
|
6033
6082
|
onBuy: (credits, price) => {
|
|
6034
6083
|
handleBuyCredits(credits, price);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@streamoid/settings",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.3.1",
|
|
4
4
|
"main": "./dist/index.js",
|
|
5
5
|
"module": "./dist/index.mjs",
|
|
6
6
|
"types": "./dist/index.d.ts",
|
|
@@ -15,7 +15,9 @@
|
|
|
15
15
|
"build": "npm run build:js && npm run build:dts",
|
|
16
16
|
"build:js": "esbuild src/index.ts --bundle --loader:.module.css=local-css --external:react --external:react-dom --external:@streamoid/icons --external:@streamoid/ui --outfile=dist/index.js --format=cjs && esbuild src/index.ts --bundle --loader:.module.css=local-css --external:react --external:react-dom --external:@streamoid/icons --external:@streamoid/ui --outfile=dist/index.mjs --format=esm",
|
|
17
17
|
"build:dts": "tsup src/index.ts --dts-only",
|
|
18
|
-
"
|
|
18
|
+
"watch:js": "esbuild src/index.ts --bundle --loader:.module.css=local-css --external:react --external:react-dom --external:@streamoid/icons --external:@streamoid/ui --outfile=dist/index.js --format=cjs --watch=forever & esbuild src/index.ts --bundle --loader:.module.css=local-css --external:react --external:react-dom --external:@streamoid/icons --external:@streamoid/ui --outfile=dist/index.mjs --format=esm --watch=forever & wait",
|
|
19
|
+
"watch:dts": "tsup src/index.ts --dts-only --watch",
|
|
20
|
+
"dev": "sh -c 'npm run watch:js & npm run watch:dts & wait'",
|
|
19
21
|
"lint": "eslint src/",
|
|
20
22
|
"typecheck": "tsc --noEmit"
|
|
21
23
|
},
|