fix(studio): reflect active storage tab in page titles (#43803)

## What kind of change does this PR introduce?

Bug fix.

## What is the current behavior?

The file storage routes under `/project/[ref]/storage/files` all use
`Storage | Project | Org | Supabase` as the browser title, even when the
user is on a more specific tab.

## What is the new behavior?

The browser title now reflects the active file-storage tab:

- `/storage/files` -> `Files | Storage | Project | Org | Supabase`
- `/storage/files/settings` -> `Settings | Storage | Project | Org |
Supabase`
- `/storage/files/policies` -> `Policies | Storage | Project | Org |
Supabase`

Ditto for `analytics` and `vector`

apps/studio/pages/project/[ref]/storage/analytics/index.tsx

@@ -20,7 +20,7 @@ const StorageAnalyticsPage: NextPageWithLayout = () => {
 
 StorageAnalyticsPage.getLayout = (page) => (
   <DefaultLayout>
-    <StorageLayout title="Storage">
+    <StorageLayout title="Analytics">
       <StorageBucketsLayout>{page}</StorageBucketsLayout>
     </StorageLayout>
   </DefaultLayout>

apps/studio/pages/project/[ref]/storage/files/index.tsx

@@ -10,7 +10,7 @@ const StorageFilesPage: NextPageWithLayout = () => {
 
 StorageFilesPage.getLayout = (page) => (
   <DefaultLayout>
-    <StorageLayout title="Storage">
+    <StorageLayout title="Files">
       <StorageBucketsLayout>{page}</StorageBucketsLayout>
     </StorageLayout>
   </DefaultLayout>

apps/studio/pages/project/[ref]/storage/files/policies.tsx

@@ -10,7 +10,7 @@ const FilesPoliciesPage: NextPageWithLayout = () => {
 
 FilesPoliciesPage.getLayout = (page) => (
   <DefaultLayout>
-    <StorageLayout title="Storage">
+    <StorageLayout title="Policies">
       <StorageBucketsLayout>{page}</StorageBucketsLayout>
     </StorageLayout>
   </DefaultLayout>

apps/studio/pages/project/[ref]/storage/files/settings.tsx

@@ -10,7 +10,7 @@ const FilesSettingsPage: NextPageWithLayout = () => {
 
 FilesSettingsPage.getLayout = (page) => (
   <DefaultLayout>
-    <StorageLayout title="Storage">
+    <StorageLayout title="Settings">
       <StorageBucketsLayout>{page}</StorageBucketsLayout>
     </StorageLayout>
   </DefaultLayout>

apps/studio/pages/project/[ref]/storage/vectors/index.tsx

@@ -1,6 +1,3 @@
-import { AlphaNotice } from '@/components/ui/AlphaNotice'
-import { InlineLinkClassName } from '@/components/ui/InlineLink'
-import { useSelectedProjectQuery } from '@/hooks/misc/useSelectedProject'
 import { useParams } from 'common'
 import { BucketsUpgradePlan } from 'components/interfaces/Storage/BucketsUpgradePlan'
 import { VectorsBuckets } from 'components/interfaces/Storage/VectorBuckets'
@@ -19,6 +16,10 @@ import {
   PageSectionContent,
 } from 'ui-patterns'
 
+import { AlphaNotice } from '@/components/ui/AlphaNotice'
+import { InlineLinkClassName } from '@/components/ui/InlineLink'
+import { useSelectedProjectQuery } from '@/hooks/misc/useSelectedProject'
+
 const AVAILABLE_REGIONS = ['us-east-1', 'us-east-2', 'us-west-2', 'eu-central-1', 'ap-southeast-2']
 
 const getRegionNameFromCode = (code: string) =>
@@ -77,7 +78,7 @@ const StorageVectorsPage: NextPageWithLayout = () => {
 
 StorageVectorsPage.getLayout = (page) => (
   <DefaultLayout>
-    <StorageLayout title="Storage">
+    <StorageLayout title="Vectors">
       <StorageBucketsLayout>{page}</StorageBucketsLayout>
     </StorageLayout>
   </DefaultLayout>