feat: rename postgres area

apps/studio/components/layouts/ObservabilityLayout/ObservabilityMenu.tsx

@@ -131,8 +131,8 @@ const ObservabilityMenu = () => {
         ...(postgrestReportEnabled
           ? [
               {
-                name: 'PostgREST',
-                key: 'postgrest',
+                name: 'Data API',
+                key: 'data-api',
                 url: `/project/${ref}/observability/postgrest${preservedQueryParams}`,
               },
             ]

apps/studio/components/layouts/ProjectLayout/NavigationBar/NavigationBar.utils.tsx

@@ -1,4 +1,4 @@
-import { Blocks, FileText, Lightbulb, Glasses, List, Settings } from 'lucide-react'
+import { Blocks, FileText, Lightbulb, List, Settings, Telescope } from 'lucide-react'
 
 import { ICON_SIZE, ICON_STROKE_WIDTH } from 'components/interfaces/Sidebar'
 import { generateAuthMenu } from 'components/layouts/AuthLayout/AuthLayout.utils'
@@ -157,18 +157,18 @@ export const generateOtherRoutes = (
     // },
     ...(IS_PLATFORM && reportsEnabled
       ? [
-          {
-            key: 'observability',
-            label: 'Observability',
-            icon: <Glasses size={ICON_SIZE} strokeWidth={ICON_STROKE_WIDTH} />,
-            link: ref && (isProjectBuilding ? buildingUrl : `/project/${ref}/observability`),
-          },
           {
             key: 'reports',
-            label: 'Custom Reports',
+            label: 'Reports',
             icon: <Reports size={ICON_SIZE} strokeWidth={ICON_STROKE_WIDTH} />,
             link: ref && (isProjectBuilding ? buildingUrl : `/project/${ref}/reports`),
           },
+          {
+            key: 'observability',
+            label: 'Observability',
+            icon: <Telescope size={ICON_SIZE} strokeWidth={ICON_STROKE_WIDTH} />,
+            link: ref && (isProjectBuilding ? buildingUrl : `/project/${ref}/observability`),
+          },
         ]
       : []),
     {

apps/studio/pages/project/[ref]/observability/postgrest.tsx

@@ -33,7 +33,7 @@ const PostgRESTReport: NextPageWithLayout = () => {
 
 PostgRESTReport.getLayout = (page) => (
   <DefaultLayout>
-    <ObservabilityLayout title="PostgREST">{page}</ObservabilityLayout>
+    <ObservabilityLayout title="Data API">{page}</ObservabilityLayout>
   </DefaultLayout>
 )
 
@@ -94,7 +94,7 @@ const PostgrestReport = () => {
 
   return (
     <>
-      <ReportHeader showDatabaseSelector={false} title="PostgREST" />
+      <ReportHeader showDatabaseSelector={false} title="Data API" />
       <ReportStickyNav
         content={
           <div className="flex flex-col gap-2">