From 8c3e203d595fc3536346e806c2efbaff6fa5919a Mon Sep 17 00:00:00 2001
From: Ivan Vasilov <vasilov.ivan@gmail.com>
Date: Wed, 11 Sep 2024 11:56:00 +0200
Subject: [PATCH] Fix all links to the table editor to include schemas.

---
 .../formatter/ForeignKeyFormatter.tsx         |  4 +--
 .../PolicyTableRow/PolicyTableRowHeader.tsx   |  2 +-
 .../interfaces/Database/Tables/TableList.tsx  |  4 ++-
 .../Database/Tables/Tables.utils.ts           | 25 +++++++++++++++----
 .../Database/Wrappers/WrapperRow.tsx          |  7 ++++--
 .../ForeignKeysManagement/ForeignKeyRow.tsx   |  6 ++---
 .../TableGridEditor/TableGridEditor.tsx       |  2 +-
 .../TableEditorLayout/EntityListItem.tsx      |  4 +--
 .../pages/project/[ref]/editor/[id].tsx       |  2 +-
 .../pages/project/[ref]/editor/index.tsx      |  2 +-
 10 files changed, 38 insertions(+), 20 deletions(-)

diff --git a/apps/studio/components/grid/components/formatter/ForeignKeyFormatter.tsx b/apps/studio/components/grid/components/formatter/ForeignKeyFormatter.tsx
index 7738c14b7d3a1..604db6416e30f 100644
--- a/apps/studio/components/grid/components/formatter/ForeignKeyFormatter.tsx
+++ b/apps/studio/components/grid/components/formatter/ForeignKeyFormatter.tsx
@@ -6,7 +6,6 @@ import type { RenderCellProps } from 'react-data-grid'
 import { useProjectContext } from 'components/layouts/ProjectLayout/ProjectContext'
 import { useTableQuery } from 'data/tables/table-query'
 import { useTablesQuery } from 'data/tables/tables-query'
-import { useQuerySchemaState } from 'hooks/misc/useSchemaQueryState'
 import { Button, Tooltip_Shadcn_, TooltipContent_Shadcn_, TooltipTrigger_Shadcn_ } from 'ui'
 import type { SupaRow } from '../../types'
 import { NullValue } from '../common/NullValue'
@@ -18,7 +17,6 @@ interface Props extends PropsWithChildren<RenderCellProps<SupaRow, unknown>> {
 
 export const ForeignKeyFormatter = (props: Props) => {
   const { project } = useProjectContext()
-  const { selectedSchema } = useQuerySchemaState()
 
   const { projectRef, tableId, row, column } = props
   const id = tableId ? Number(tableId) : undefined
@@ -63,7 +61,7 @@ export const ForeignKeyFormatter = (props: Props) => {
               style={{ padding: '3px' }}
             >
               <Link
-                href={`/project/${projectRef}/editor/${targetTable?.id}?schema=${selectedSchema}&filter=${relationship?.target_column_name}%3Aeq%3A${value}`}
+                href={`/project/${projectRef}/editor/${targetTable?.id}?schema=${targetTable.schema}&filter=${relationship?.target_column_name}%3Aeq%3A${value}`}
               >
                 <ArrowRight size={14} />
               </Link>
diff --git a/apps/studio/components/interfaces/Auth/Policies/PolicyTableRow/PolicyTableRowHeader.tsx b/apps/studio/components/interfaces/Auth/Policies/PolicyTableRow/PolicyTableRowHeader.tsx
index a257f77b445b4..8e5b7726798e2 100644
--- a/apps/studio/components/interfaces/Auth/Policies/PolicyTableRow/PolicyTableRowHeader.tsx
+++ b/apps/studio/components/interfaces/Auth/Policies/PolicyTableRow/PolicyTableRowHeader.tsx
@@ -36,7 +36,7 @@ const PolicyTableRowHeader = ({
   return (
     <div id={table.id.toString()} className="flex w-full items-center justify-between">
       <div className="flex gap-x-4 text-left">
-        <Link href={`/project/${ref}/editor/${table.id}`}>
+        <Link href={`/project/${ref}/editor/${table.id}?schema=${table.schema}`}>
           <h4 className="m-0">{table.name}</h4>
         </Link>
         <div className="flex items-center gap-x-2">
diff --git a/apps/studio/components/interfaces/Database/Tables/TableList.tsx b/apps/studio/components/interfaces/Database/Tables/TableList.tsx
index 24cecbe3885f0..16182efe1a6a3 100644
--- a/apps/studio/components/interfaces/Database/Tables/TableList.tsx
+++ b/apps/studio/components/interfaces/Database/Tables/TableList.tsx
@@ -471,7 +471,9 @@ const TableList = ({
                                 <DropdownMenuItem
                                   className="flex items-center space-x-2"
                                   onClick={() =>
-                                    router.push(`/project/${project?.ref}/editor/${x.id}`)
+                                    router.push(
+                                      `/project/${project?.ref}/editor/${x.id}?schema=${x.schema}`
+                                    )
                                   }
                                 >
                                   <Eye size={12} />
diff --git a/apps/studio/components/interfaces/Database/Tables/Tables.utils.ts b/apps/studio/components/interfaces/Database/Tables/Tables.utils.ts
index 43f910509e226..4a5991105418d 100644
--- a/apps/studio/components/interfaces/Database/Tables/Tables.utils.ts
+++ b/apps/studio/components/interfaces/Database/Tables/Tables.utils.ts
@@ -2,6 +2,17 @@ import { PostgresMaterializedView, PostgresTable, PostgresView } from '@supabase
 import { PostgresForeignTable } from '@supabase/postgres-meta/dist/lib/types'
 import { ENTITY_TYPE } from 'data/entity-types/entity-type-constants'
 
+type Entity = {
+  type: ENTITY_TYPE
+  id: number
+  name: string
+  comment: string | null
+  rows: number | undefined
+  size: string | undefined
+  columns: unknown[]
+  schema: string
+}
+
 // [Joshen] We just need name, description, rows, size, and the number of columns
 // Just missing partitioned tables as missing pg-meta support
 export const formatAllEntities = ({
@@ -14,17 +25,18 @@ export const formatAllEntities = ({
   views?: PostgresView[]
   materializedViews?: PostgresMaterializedView[]
   foreignTables?: PostgresForeignTable[]
-}) => {
-  const formattedTables = tables.map((x) => {
+}): Entity[] => {
+  const formattedTables: Entity[] = tables.map((x) => {
     return {
       ...x,
       type: ENTITY_TYPE.TABLE,
       rows: x.live_rows_estimate,
       columns: x.columns ?? [],
+      schema: x.schema,
     }
   })
 
-  const formattedViews = views.map((x) => {
+  const formattedViews: Entity[] = views.map((x) => {
     return {
       type: ENTITY_TYPE.VIEW,
       id: x.id,
@@ -33,10 +45,11 @@ export const formatAllEntities = ({
       rows: undefined,
       size: undefined,
       columns: x.columns ?? [],
+      schema: x.schema,
     }
   })
 
-  const formattedMaterializedViews = materializedViews.map((x) => {
+  const formattedMaterializedViews: Entity[] = materializedViews.map((x) => {
     return {
       type: ENTITY_TYPE.MATERIALIZED_VIEW,
       id: x.id,
@@ -45,10 +58,11 @@ export const formatAllEntities = ({
       rows: undefined,
       size: undefined,
       columns: x.columns ?? [],
+      schema: x.schema,
     }
   })
 
-  const formattedForeignTables = foreignTables.map((x) => {
+  const formattedForeignTables: Entity[] = foreignTables.map((x) => {
     return {
       type: ENTITY_TYPE.FOREIGN_TABLE,
       id: x.id,
@@ -57,6 +71,7 @@ export const formatAllEntities = ({
       rows: undefined,
       size: undefined,
       columns: x.columns ?? [],
+      schema: x.schema,
     }
   })
 
diff --git a/apps/studio/components/interfaces/Database/Wrappers/WrapperRow.tsx b/apps/studio/components/interfaces/Database/Wrappers/WrapperRow.tsx
index 21c9fce17f90f..5e5707c7378c4 100644
--- a/apps/studio/components/interfaces/Database/Wrappers/WrapperRow.tsx
+++ b/apps/studio/components/interfaces/Database/Wrappers/WrapperRow.tsx
@@ -118,8 +118,11 @@ const WrapperRow = ({
                       </p>
                       <div className="flex flex-wrap gap-2">
                         {wrapper.tables ? (
-                          wrapper.tables.map((table: any) => (
-                            <Link key={table.id} href={`/project/${ref}/editor/${table.id}`}>
+                          wrapper.tables.map((table) => (
+                            <Link
+                              key={table.id}
+                              href={`/project/${ref}/editor/${table.id}?schema=${table.schema}`}
+                            >
                               <div className="text-sm border rounded px-2 py-1 transition bg-surface-200 hover:bg-overlay-hover">
                                 {table.name}
                               </div>
diff --git a/apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/TableEditor/ForeignKeysManagement/ForeignKeyRow.tsx b/apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/TableEditor/ForeignKeysManagement/ForeignKeyRow.tsx
index 82d0142d26abd..ae0bf03db4cb2 100644
--- a/apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/TableEditor/ForeignKeysManagement/ForeignKeyRow.tsx
+++ b/apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/TableEditor/ForeignKeysManagement/ForeignKeyRow.tsx
@@ -1,11 +1,11 @@
 import clsx from 'clsx'
 import { useParams } from 'common'
+import { ArrowRight } from 'lucide-react'
 import Link from 'next/link'
 import SVG from 'react-inlinesvg'
-import { Badge, Button, cn } from 'ui'
-import { ArrowRight } from 'lucide-react'
 
 import { BASE_PATH } from 'lib/constants'
+import { Badge, Button, cn } from 'ui'
 import type { ForeignKey } from '../../ForeignKeySelector/ForeignKeySelector.types'
 
 interface ForeignKeyProps {
@@ -78,7 +78,7 @@ export const ForeignKeyRow = ({
               }
             >
               <Link
-                href={`/project/${ref}/editor/${foreignKey.tableId}`}
+                href={`/project/${ref}/editor/${foreignKey.tableId}?schema=${foreignKey.schema}`}
                 onClick={() => closePanel()}
               >
                 {foreignKey.schema}.{foreignKey.table}
diff --git a/apps/studio/components/interfaces/TableGridEditor/TableGridEditor.tsx b/apps/studio/components/interfaces/TableGridEditor/TableGridEditor.tsx
index a52ed56fc3e87..973eb3c9e4250 100644
--- a/apps/studio/components/interfaces/TableGridEditor/TableGridEditor.tsx
+++ b/apps/studio/components/interfaces/TableGridEditor/TableGridEditor.tsx
@@ -188,7 +188,7 @@ const TableGridEditor = ({
   const gridKey = `${selectedTable.schema}_${selectedTable.name}`
 
   const onTableCreated = (table: PostgresTable) => {
-    router.push(`/project/${projectRef}/editor/${table.id}`)
+    router.push(`/project/${projectRef}/editor/${table.id}?schema=${table.schema}`)
   }
 
   // columns must be accessed via columnsRef.current as these two functions immediately become
diff --git a/apps/studio/components/layouts/TableEditorLayout/EntityListItem.tsx b/apps/studio/components/layouts/TableEditorLayout/EntityListItem.tsx
index 2a2f463ea130b..aef0773edf020 100644
--- a/apps/studio/components/layouts/TableEditorLayout/EntityListItem.tsx
+++ b/apps/studio/components/layouts/TableEditorLayout/EntityListItem.tsx
@@ -21,6 +21,7 @@ import {
   MAX_EXPORT_ROW_COUNT_MESSAGE,
 } from 'components/grid/components/header/Header'
 import { parseSupaTable } from 'components/grid/SupabaseGrid.utils'
+import { Markdown } from 'components/interfaces/Markdown'
 import {
   formatTableRowsToSQL,
   getEntityLintDetails,
@@ -45,7 +46,6 @@ import {
   DropdownMenuTrigger,
 } from 'ui'
 import { useProjectContext } from '../ProjectLayout/ProjectContext'
-import { Markdown } from 'components/interfaces/Markdown'
 
 export interface EntityListItemProps {
   id: number
@@ -279,7 +279,7 @@ const EntityListItem: ItemRenderer<Entity, EntityListItemProps> = ({
   return (
     <Link
       title={entity.name}
-      href={`/project/${projectRef}/editor/${entity.id}?schema=${selectedSchema}`}
+      href={`/project/${projectRef}/editor/${entity.id}?schema=${entity.schema}`}
       role="button"
       aria-label={`View ${entity.name}`}
       className={cn(
diff --git a/apps/studio/pages/project/[ref]/editor/[id].tsx b/apps/studio/pages/project/[ref]/editor/[id].tsx
index 69240d0890827..bc09d45b22f98 100644
--- a/apps/studio/pages/project/[ref]/editor/[id].tsx
+++ b/apps/studio/pages/project/[ref]/editor/[id].tsx
@@ -29,7 +29,7 @@ const TableEditorPage: NextPageWithLayout = () => {
         onAfterDeleteTable={(tables) => {
           // For simplicity for now, we just open the first table within the same schema
           if (tables.length > 0) {
-            router.push(`/project/${projectRef}/editor/${tables[0].id}`)
+            router.push(`/project/${projectRef}/editor/${tables[0].id}?schema=${tables[0].schema}`)
           } else {
             router.push(`/project/${projectRef}/editor/`)
           }
diff --git a/apps/studio/pages/project/[ref]/editor/index.tsx b/apps/studio/pages/project/[ref]/editor/index.tsx
index 675d67aa7f77d..7d908ab8e1272 100644
--- a/apps/studio/pages/project/[ref]/editor/index.tsx
+++ b/apps/studio/pages/project/[ref]/editor/index.tsx
@@ -14,7 +14,7 @@ const TableEditorPage: NextPageWithLayout = () => {
   const router = useRouter()
 
   const onTableCreated = (table: Table) => {
-    router.push(`/project/${projectRef}/editor/${table.id}`)
+    router.push(`/project/${projectRef}/editor/${table.id}?schema=${table.schema}`)
   }
 
   return (