chore: branching compute hours copy (#35524)

apps/docs/content/guides/platform/manage-your-usage/branching.mdx

@@ -54,10 +54,10 @@ You can view Branching usage on the [organization's usage page](https://supabase
   zoomable
 />
 
-In the Usage Summary section, you can see how many hours your Preview branches existed during the selected time period. Hover over "Branches Compute Hours" for a detailed breakdown.
+In the Usage Summary section, you can see how many hours your Preview branches existed during the selected time period. Hover over "Branching Compute Hours" for a detailed breakdown.
 
 <Image
-  alt="Usage summary Branches Compute Hours"
+  alt="Usage summary Branching Compute Hours"
   src={{
     light: '/docs/img/guides/platform/usage-summary-branch-hours--light.png',
     dark: '/docs/img/guides/platform/usage-summary-branch-hours--dark.png',

apps/studio/components/interfaces/Organization/BillingSettings/BillingBreakdown/ComputeMetric.tsx

@@ -1,6 +1,6 @@
 import Link from 'next/link'
 
-import { PricingMetric } from 'data/analytics/org-daily-stats-query'
+import { ComputeUsageMetric, PricingMetric } from 'data/analytics/org-daily-stats-query'
 import type { OrgUsageResponse } from 'data/usage/org-usage-query'
 import { formatCurrency } from 'lib/helpers'
 import { useMemo } from 'react'
@@ -62,18 +62,32 @@ const ComputeMetric = ({ slug, metric, usage, relativeToSubscription }: ComputeM
           </p>
 
           <div className="my-2">
-            <p className="text-sm">
-              Every project is a dedicated server and database. For every hour your project is
-              active, it incurs compute costs based on the compute size of your project. Paused
-              projects do not incur compute costs.{' '}
-              <Link
-                href="https://supabase.com/docs/guides/platform/manage-your-usage/compute"
-                target="_blank"
-                className="transition text-brand hover:text-brand-600 underline"
-              >
-                Read more
-              </Link>
-            </p>
+            {usageMeta?.metric === ComputeUsageMetric.COMPUTE_HOURS_BRANCH ? (
+              <p className="text-sm">
+                Each Preview branch is a separate environment with all Supabase services (Database,
+                Auth, Storage, etc.).{' '}
+                <Link
+                  href="https://supabase.com/docs/guides/platform/manage-your-usage/branching"
+                  target="_blank"
+                  className="transition text-brand hover:text-brand-600 underline"
+                >
+                  Read more
+                </Link>
+              </p>
+            ) : (
+              <p className="text-sm">
+                Every project is a dedicated server and database. For every hour your project is
+                active, it incurs compute costs based on the compute size of your project. Paused
+                projects do not incur compute costs.{' '}
+                <Link
+                  href="https://supabase.com/docs/guides/platform/manage-your-usage/compute"
+                  target="_blank"
+                  className="transition text-brand hover:text-brand-600 underline"
+                >
+                  Read more
+                </Link>
+              </p>
+            )}
           </div>
 
           {usageMeta && sortedProjectAllocations.length > 0 && (

apps/studio/data/analytics/org-daily-stats-query.ts

@@ -69,7 +69,7 @@ export enum ComputeUsageMetric {
 export const computeUsageMetricLabel = (computeUsageMetric: ComputeUsageMetric) => {
   switch (computeUsageMetric) {
     case 'COMPUTE_HOURS_BRANCH':
-      return 'Branches'
+      return 'Branching'
     case 'COMPUTE_HOURS_XS':
       return 'Micro'
     case 'COMPUTE_HOURS_SM':