Return daily usage metrics

api/types/billing_metronome.go

@@ -101,6 +101,8 @@ type CustomerUsageMetric struct {
 	Value        float64 `json:"value"`
 }
 
+// BillableMetric is defined in Metronome and represents the events that will
+// be ingested
 type BillableMetric struct {
 	ID   uuid.UUID `json:"id"`
 	Name string    `json:"name"`

dashboard/src/lib/billing/types.tsx

@@ -12,25 +12,27 @@ export const PaymentMethodValidator = z.object({
   is_default: z.boolean(),
 });
 
-type Trial = z.infer<typeof Trial>;
-
-const Trial = z.object({
+const TrialValidator = z.object({
   ending_before: z.string(),
 });
 
-export type Plan = z.infer<typeof Plan>;
-export const Plan = z.object({
+export type Plan = z.infer<typeof PlanValidator>;
+export const PlanValidator = z.object({
   id: z.string(),
   plan_name: z.string(),
   plan_description: z.string(),
   starting_on: z.string(),
-  trial_info: Trial,
+  trial_info: TrialValidator,
 });
 
 export type UsageMetric = z.infer<typeof UsageMetricValidator>;
 export const UsageMetricValidator = z.object({
+  // starting_on and ending_before are ISO 8601 date strings
+  // that represent the timeframe where the metric was ingested.
+  // If the granularity is set per day, the starting_on field
+  // represents the dat the metric was ingested.
   starting_on: z.string(),
-  ending_on: z.string(),
+  ending_before: z.string(),
   value: z.number(),
 });
 

dashboard/src/lib/hooks/useStripe.tsx

@@ -6,7 +6,7 @@ import {
   ClientSecretResponse,
   CreditGrantsValidator,
   PaymentMethodValidator,
-  Plan,
+  PlanValidator,
   UsageValidator,
   type CreditGrants,
   type PaymentMethod,
@@ -303,7 +303,7 @@ export const useCustomerPlan = (): TGetPlan => {
           project_id: currentProject?.id,
         }
       );
-      const plan = Plan.parse(res.data);
+      const plan = PlanValidator.parse(res.data);
       return plan;
     }
   );
@@ -313,7 +313,7 @@ export const useCustomerPlan = (): TGetPlan => {
   };
 };
 
-export const useCustomerUsage = (): TGetUsage => {
+export const useCustomerUsage = (windowSize: string, currentPeriod: boolean): TGetUsage => {
   const { currentProject } = useContext(Context);
 
   // Fetch current plan
@@ -326,8 +326,8 @@ export const useCustomerUsage = (): TGetUsage => {
       const res = await api.getCustomerUsage(
         "<token>",
         {
-          window_size: "none",
-          current_period: true,
+          window_size: windowSize,
+          current_period: currentPeriod,
         },
         {
           project_id: currentProject?.id,

dashboard/src/main/home/project-settings/BillingPage.tsx

@@ -44,7 +44,7 @@ function BillingPage(): JSX.Element {
 
   const { refetchPaymentEnabled } = checkIfProjectHasPayment();
 
-  const { usage } = useCustomerUsage();
+  const { usage } = useCustomerUsage("day", true);
 
   const processedData = useMemo(() => {
     const before = usage;
@@ -221,10 +221,10 @@ function BillingPage(): JSX.Element {
               <Spacer inline x={1} />
               <Text size={20}>
                 {creditGrants !== undefined &&
-                creditGrants.remaining_credits > 0
+                  creditGrants.remaining_credits > 0
                   ? `$${formatCredits(
-                      creditGrants.remaining_credits
-                    )}/$${formatCredits(creditGrants.granted_credits)}`
+                    creditGrants.remaining_credits
+                  )}/$${formatCredits(creditGrants.granted_credits)}`
                   : "$ 0.00"}
               </Text>
             </Container>
@@ -250,7 +250,7 @@ function BillingPage(): JSX.Element {
                     </Container>
                     <Container row>
                       {plan.trial_info !== undefined &&
-                      plan.trial_info.ending_before !== "" ? (
+                        plan.trial_info.ending_before !== "" ? (
                         <Text>
                           Free trial ends{" "}
                           {relativeTime(plan.trial_info.ending_before)}
@@ -269,8 +269,8 @@ function BillingPage(): JSX.Element {
                 </Text>
                 <Spacer y={1} />
                 {usage?.length &&
-                usage.length > 0 &&
-                usage[0].usage_metrics.length > 0 ? (
+                  usage.length > 0 &&
+                  usage[0].usage_metrics.length > 0 ? (
                   <Flex>
                     <BarWrapper>
                       <Bars

internal/billing/metronome.go

@@ -258,6 +258,7 @@ func (m MetronomeClient) GetCustomerDashboard(ctx context.Context, customerID uu
 	return result.Data["url"], nil
 }
 
+// ListCustomerUsage will return the aggregated usage for a customer
 func (m MetronomeClient) ListCustomerUsage(ctx context.Context, customerID uuid.UUID, startingOn string, endingBefore string, windowsSize string, currentPeriod bool) (usage []types.Usage, err error) {
 	ctx, span := telemetry.NewSpan(ctx, "list-customer-usage")
 	defer span.End()