fix(usage): show an empty state when a period has no usage

UsageOverTime returned null, so a new organisation, or the project filter
pointed at a project with no traffic, saw a meter and then blank space. The
page this replaces already handled it; the copy is taken from there.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

Author: talissoncosta

frontend/web/components/organisation-settings/usage/UsageOverTime/UsageOverTime.tsx

@@ -1,6 +1,7 @@
 import { FC, useMemo } from 'react'
 import { Res } from 'common/types/responses'
 import { colorSurfaceAction } from 'common/theme/tokens'
+import EmptyState from 'components/EmptyState'
 import BarChart from 'components/charts/BarChart'
 import LineChart from 'components/charts/LineChart'
 import {
@@ -30,10 +31,6 @@ const UsageOverTime: FC<UsageOverTimeProps> = ({
 
   const cumulative = useMemo(() => cumulativeTotals(daily), [daily])
 
-  if (!daily.length) {
-    return null
-  }
-
   const xAxisInterval = xAxisIntervalFor(daily.length)
 
   const chart = isBillingPeriod ? (
@@ -71,7 +68,15 @@ const UsageOverTime: FC<UsageOverTimeProps> = ({
             : 'Per day · rolling window'}
         </span>
       </div>
-      {chart}
+      {daily.length ? (
+        chart
+      ) : (
+        <EmptyState
+          title='No usage recorded'
+          description='No usage data available for the selected period and project.'
+          icon='bar-chart'
+        />
+      )}
     </div>
   )
 }