+
+ {atMax && maxValue !== null ? (
+
+ Need more than {maxValue * packSize} extra {unitLabel}?{" "}
+
+ Book a call
+
+
+ ) : null}
);
}
diff --git a/apps/dashboard/src/components/data-table/billing/data-table.tsx b/apps/dashboard/src/components/data-table/billing/data-table.tsx
index 9eb8e43b6..4e2e7fcd2 100644
--- a/apps/dashboard/src/components/data-table/billing/data-table.tsx
+++ b/apps/dashboard/src/components/data-table/billing/data-table.tsx
@@ -1,8 +1,12 @@
"use client";
import type { WorkspacePlan } from "@openstatus/db/src/schema";
-import type { BillingInterval } from "@openstatus/db/src/schema/plan/schema";
+import type {
+ Addons,
+ BillingInterval,
+} from "@openstatus/db/src/schema/plan/schema";
import {
+ getAddonPackSize,
getAddonPriceConfig,
getPriceConfig,
} from "@openstatus/db/src/schema/plan/utils";
@@ -34,6 +38,11 @@ const BASE_URL =
? "https://app.openstatus.dev"
: "http://localhost:3000";
+function getQuantitySuffix(addon: keyof Addons) {
+ const packSize = getAddonPackSize(addon);
+ return packSize > 1 ? `/mo./${packSize}` : "/mo./each";
+}
+
export function DataTable({ restrictTo }: { restrictTo?: WorkspacePlan[] }) {
const [interval, setInterval] = useState
("monthly");
const [currency] = useCookieState("x-currency", "USD");
@@ -219,7 +228,11 @@ export function DataTable({ restrictTo }: { restrictTo?: WorkspacePlan[] }) {
style: "currency",
currency: price.currency,
}).format(price.value)}
- {isNumber ? "/mo./each" : "/mo."}
+ {isNumber
+ ? getQuantitySuffix(
+ value as keyof typeof plan.addons,
+ )
+ : "/mo."}