chore: reduce main bundle size (#19918)

apps/studio/components/grid/SupabaseGrid.utils.ts

@@ -1,7 +1,8 @@
 import AwesomeDebouncePromise from 'awesome-debounce-promise'
 import { STORAGE_KEY_PREFIX } from './constants'
 import { InitialStateType } from './store/reducers'
-import { Dictionary, Sort, SupabaseGridProps, SupaColumn, SupaTable } from './types'
+import { Sort, SupabaseGridProps, SupaColumn, SupaTable } from './types'
+import type { Dictionary } from 'types'
 import { getGridColumns } from './utils/gridColumns'
 import { FilterOperatorOptions } from './components/header/filter'
 import { Filter } from 'components/grid/types'

apps/studio/components/grid/query/Query.utils.ts

@@ -1,5 +1,6 @@
 import { ident, literal, format } from '@scaleleap/pg-format'
-import { Dictionary, Filter, QueryPagination, QueryTable, Sort } from '../types'
+import { Filter, QueryPagination, QueryTable, Sort } from '../types'
+import type { Dictionary } from 'types'
 
 export function countQuery(
   table: QueryTable,

apps/studio/components/grid/query/QueryAction.ts

@@ -1,4 +1,5 @@
-import { Dictionary, QueryTable } from '../types'
+import { QueryTable } from '../types'
+import type { Dictionary } from 'types'
 import { IQueryFilter, QueryFilter } from './QueryFilter'
 
 export interface IQueryAction {

apps/studio/components/grid/query/QueryFilter.ts

@@ -1,4 +1,5 @@
-import { Dictionary, Filter, FilterOperator, QueryTable, Sort } from '../types'
+import { Filter, FilterOperator, QueryTable, Sort } from '../types'
+import type { Dictionary } from 'types'
 import { IQueryModifier, QueryModifier } from './QueryModifier'
 
 export interface IQueryFilter {

apps/studio/components/grid/query/QueryModifier.ts

@@ -1,4 +1,5 @@
-import { Dictionary, Filter, QueryPagination, QueryTable, Sort } from '../types'
+import type { Dictionary } from 'types'
+import { Filter, QueryPagination, QueryTable, Sort } from '../types'
 import {
   countQuery,
   deleteQuery,

apps/studio/components/grid/store/reducers/row.ts

@@ -1,6 +1,5 @@
-import update from 'immutability-helper'
 import { TOTAL_ROWS_INITIAL, TOTAL_ROWS_RESET } from '../../constants'
-import { Dictionary, SupaRow } from '../../types'
+import { SupaRow } from '../../types'
 import { INIT_ACTIONTYPE } from './base'
 
 export interface RowInitialState {

apps/studio/components/grid/types/base.ts

@@ -1,9 +1,5 @@
 import { CalculatedColumn, RenderHeaderCellProps } from 'react-data-grid'
 
-export interface Dictionary<T> {
-  [Key: string]: T
-}
-
 export interface Sort {
   column: string
   ascending?: boolean

apps/studio/components/grid/types/table.ts

@@ -1,4 +1,5 @@
-import { Dictionary, GridForeignKey } from './base'
+import { GridForeignKey } from './base'
+import type { Dictionary } from 'types'
 
 export interface SupaColumn {
   readonly dataType: string

apps/studio/components/interfaces/Database/Functions/CreateFunction.tsx

@@ -5,7 +5,7 @@ import { FormEvent, createContext, useContext, useEffect, useState } from 'react
 import toast from 'react-hot-toast'
 import { Button, IconPlus, IconTrash, Input, Listbox, Modal, Radio, SidePanel, Toggle } from 'ui'
 
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 import { POSTGRES_DATA_TYPES } from 'components/interfaces/TableGridEditor/SidePanelEditor/SidePanelEditor.constants'
 import { useProjectContext } from 'components/layouts/ProjectLayout/ProjectContext'
 import ConfirmationModal from 'components/ui/ConfirmationModal'

apps/studio/components/interfaces/Database/Functions/Functions.utils.ts

@@ -1,4 +1,4 @@
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 import { isEmpty } from 'lodash'
 
 /**

apps/studio/components/interfaces/Database/Triggers/ChooseFunctionForm.tsx

@@ -6,7 +6,6 @@ import { useRouter } from 'next/router'
 import { useState } from 'react'
 import { Button, IconChevronDown, IconHelpCircle, IconTerminal, SidePanel } from 'ui'
 
-import { Dictionary } from 'components/grid'
 import ProductEmptyState from 'components/to-be-cleaned/ProductEmptyState'
 import InformationBox from 'components/ui/InformationBox'
 import SqlEditor from 'components/ui/SqlEditor'

apps/studio/components/interfaces/Database/Triggers/CreateTrigger.tsx

@@ -6,7 +6,7 @@ import { createContext, useContext, useEffect, useState } from 'react'
 import toast from 'react-hot-toast'
 import SVG from 'react-inlinesvg'
 
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 import { useProjectContext } from 'components/layouts/ProjectLayout/ProjectContext'
 import ConfirmationModal from 'components/ui/ConfirmationModal'
 import FormEmptyBox from 'components/ui/FormBoxEmpty'

apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/ColumnEditor/ColumnEditor.constants.ts

@@ -1,4 +1,4 @@
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 import { Suggestion } from './ColumnEditor.types'
 
 const defaultTimeBasedExpressions: Suggestion[] = [

apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/ColumnEditor/ColumnEditor.tsx

@@ -17,7 +17,7 @@ import {
   Toggle,
 } from 'ui'
 
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 import { useProjectContext } from 'components/layouts/ProjectLayout/ProjectContext'
 import { FormSection, FormSectionContent, FormSectionLabel } from 'components/ui/Forms'
 import { useForeignKeyConstraintsQuery } from 'data/database/foreign-key-constraints-query'

apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/ColumnEditor/ColumnEditor.utils.ts

@@ -1,5 +1,5 @@
 import { find, isUndefined, isEqual, isNull } from 'lodash'
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 import type {
   PostgresColumn,
   PostgresRelationship,

apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/ForeignKeySelector/ForeignKeySelector.tsx

@@ -2,7 +2,7 @@ import type { PostgresColumn, PostgresSchema, PostgresTable } from '@supabase/po
 import { find, get, isEmpty, sortBy } from 'lodash'
 import { useEffect, useState } from 'react'
 
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 import { useProjectContext } from 'components/layouts/ProjectLayout/ProjectContext'
 import InformationBox from 'components/ui/InformationBox'
 import { FOREIGN_KEY_CASCADE_ACTION } from 'data/database/database-query-constants'

apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/RowEditor/JsonEditor/DrilldownViewer/DrilldownPane.tsx

@@ -1,7 +1,7 @@
 import { isNull, noop } from 'lodash'
 import { IconChevronRight } from 'ui'
 
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 
 interface DrilldownPaneProps {
   pane: number

apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/RowEditor/JsonEditor/DrilldownViewer/DrilldownViewer.tsx

@@ -1,7 +1,7 @@
 import { isEmpty, last } from 'lodash'
 import { useState } from 'react'
 
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 import DrilldownBreadCrumbs from './DrilldownBreadCrumbs'
 import DrilldownPane from './DrilldownPane'
 

apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/RowEditor/RowEditor.tsx

@@ -1,5 +1,5 @@
 import type { PostgresTable } from '@supabase/postgres-meta'
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 import { isEmpty, isUndefined, noop, partition } from 'lodash'
 import { useEffect, useMemo, useState } from 'react'
 import { SidePanel } from 'ui'

apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/RowEditor/RowEditor.utils.ts

@@ -1,5 +1,5 @@
 import type { PostgresTable } from '@supabase/postgres-meta'
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 import dayjs from 'dayjs'
 import { compact, find, isEqual, isNull, isString, isUndefined, omitBy } from 'lodash'
 

apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/SidePanelEditor.tsx

@@ -5,7 +5,7 @@ import { useState } from 'react'
 import { toast } from 'react-hot-toast'
 import { Modal } from 'ui'
 
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 import { useProjectContext } from 'components/layouts/ProjectLayout/ProjectContext'
 import ConfirmationModal from 'components/ui/ConfirmationModal'
 import { entityTypeKeys } from 'data/entity-types/keys'

apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/SpreadsheetImport/SpreadsheetImport.types.ts

@@ -1,4 +1,4 @@
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 
 export interface SpreadsheetData {
   headers: string[]

apps/studio/components/interfaces/TableGridEditor/SidePanelEditor/TableEditor/TableEditor.types.ts

@@ -1,4 +1,4 @@
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 import { ColumnField } from '../SidePanelEditor.types'
 
 export interface TableField {

apps/studio/components/interfaces/TableGridEditor/TableGridEditor.tsx

@@ -7,7 +7,8 @@ import { observer } from 'mobx-react-lite'
 import { useRouter } from 'next/router'
 import { useEffect, useState } from 'react'
 
-import { Dictionary, parseSupaTable, SupabaseGrid, SupaTable } from 'components/grid'
+import { parseSupaTable, SupabaseGrid, SupaTable } from 'components/grid'
+import { Dictionary } from 'types'
 import { ERROR_PRIMARY_KEY_NOTFOUND } from 'components/grid/constants'
 import { useProjectContext } from 'components/layouts/ProjectLayout/ProjectContext'
 import Connecting from 'components/ui/Loading/Loading'

apps/studio/components/to-be-cleaned/Charts/ChartHandler.tsx

@@ -1,4 +1,4 @@
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 import { isUndefined } from 'lodash'
 import { useRouter } from 'next/router'
 import { PropsWithChildren, useEffect, useState } from 'react'

apps/studio/components/to-be-cleaned/Integration/Vercel.utils.ts

@@ -1,6 +1,6 @@
 import { post, get } from 'lib/common/fetch'
 import { INTEGRATION_ENVS_ALIAS } from 'lib/vercelConfigs'
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 import { API_URL } from 'lib/constants'
 
 export async function fetchVercelProjects({

apps/studio/data/database-functions/database-functions-create-mutation.ts

@@ -4,7 +4,7 @@ import { toast } from 'react-hot-toast'
 import { post } from 'data/fetchers'
 import { ResponseError } from 'types'
 import { databaseFunctionsKeys } from './keys'
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 
 export type DatabaseFunctionCreateVariables = {
   projectRef: string

apps/studio/data/database-functions/database-functions-update-mutation.ts

@@ -4,7 +4,7 @@ import { toast } from 'react-hot-toast'
 import { patch } from 'data/fetchers'
 import { ResponseError } from 'types'
 import { databaseFunctionsKeys } from './keys'
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 
 export type DatabaseFunctionUpdateVariables = {
   projectRef: string

apps/studio/data/table-rows/utils.ts

@@ -2,7 +2,6 @@ import { Filter, ServiceError, SupaTable } from 'components/grid'
 import { ERROR_PRIMARY_KEY_NOTFOUND } from 'components/grid/constants'
 import { isNumericalColumn } from 'components/grid/utils'
 import { Table } from 'data/tables/table-query'
-import { TableLike } from 'hooks/misc/useTable'
 
 /**
  * temporary fix until we implement a better filter UI

apps/studio/pages/vercel/integrate.tsx

@@ -6,7 +6,7 @@ import { useRouter } from 'next/router'
 import { ChangeEvent, createContext, useContext, useEffect, useState } from 'react'
 import { toast } from 'react-hot-toast'
 
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 import VercelIntegrationLayout from 'components/layouts/VercelIntegrationLayout'
 import {
   createVercelEnv,

apps/studio/pages/vercel/setupProject.tsx

@@ -7,7 +7,7 @@ import { ChangeEvent, createContext, useContext, useEffect, useRef, useState } f
 import { toast } from 'react-hot-toast'
 import { Button, Input, Listbox } from 'ui'
 
-import { Dictionary } from 'components/grid'
+import { Dictionary } from 'types'
 import VercelIntegrationLayout from 'components/layouts/VercelIntegrationLayout'
 import {
   createVercelEnv,

apps/studio/state/table-editor.tsx

@@ -1,5 +1,6 @@
 import { PostgresColumn } from '@supabase/postgres-meta'
-import { Dictionary, SupaRow } from 'components/grid'
+import { SupaRow } from 'components/grid'
+import { Dictionary } from 'types'
 import { ForeignRowSelectorProps } from 'components/interfaces/TableGridEditor/SidePanelEditor/RowEditor/ForeignRowSelector/ForeignRowSelector'
 import { JsonEditValue } from 'components/interfaces/TableGridEditor/SidePanelEditor/RowEditor/RowEditor.types'
 import { PropsWithChildren, createContext, useContext, useRef } from 'react'

apps/studio/stores/project/VaultStore.ts

@@ -1,5 +1,5 @@
 import type { PostgresColumn } from '@supabase/postgres-meta'
-import { Query } from 'components/grid'
+import { Query } from 'components/grid/query/Query'
 import { makeAutoObservable } from 'mobx'
 import { SchemaView, VaultSecret } from 'types'
 import { IRootStore } from '../RootStore'

apps/studio/types/base.ts

@@ -92,3 +92,6 @@ export interface ResponseError {
   message: string
   requestId?: string
 }
+export interface Dictionary<T> {
+  [Key: string]: T
+}