feat: update nav menu and page title

studio/components/layouts/ReportsLayout/ReportsMenu.utils.ts

@@ -18,25 +18,18 @@ export const generateReportsMenu = (project?: Project): ProductMenuGroup[] => {
         },
       ],
     },
-
-    ...(productReports
-      ? [
-          {
-            title: 'API',
-            items: [
-              {
-                name: 'Overview',
-                key: 'api-overview',
-                url: `/project/${ref}/reports/api-overview`,
-                items: [],
-              },
-            ],
-          },
-        ]
-      : []),
-
     {
       items: [
+    ...(productReports
+      ? [
+            {
+              name: 'API',
+              key: 'api-overview',
+              url: `/project/${ref}/reports/api-overview`,
+              items: [],
+            },
+        ]
+          : []),
         {
           name: 'Database',
           key: 'database',

studio/pages/project/[ref]/reports/api-overview.tsx

@@ -39,11 +39,7 @@ export const ApiReport: NextPageWithLayout = () => {
 
   return (
     <div className="flex flex-col gap-4 px-5 py-6 mx-auto 1xl:px-28 lg:px-16 xl:px-24 2xl:px-32">
-      <ReportHeader
-        title="API Performance"
-        isLoading={report.isLoading}
-        onRefresh={report.refresh}
-      />
+      <ReportHeader title="API" isLoading={report.isLoading} onRefresh={report.refresh} />
 
       <ReportFilterBar
         onRemoveFilters={report.removeFilters}