Files
supabase/apps/studio/data/table-rows/table-rows-query.ts
T
e6006b9653 feat: user impersonation (#18945)
* feat: user impersonation

* refactor

* add anon impersonation

* add user impersonation to graphiql

* thanks Ivan for this one

* add radio buttons

* progress

* working user selector

* adds loading and error states to user selector

* nicer popover button

* default graphiql to use service role key

* styling updates

* fix padding in graphiql

* add service role warning to graphiql

* add user impersonation to realtime inspector

* add feature flag

* use Alert_Shadcn_ instead of old Alert

* Update apps/studio/lib/role-impersonation.ts

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>

* update title

* Update apps/studio/components/interfaces/RoleImpersonationSelector/UserImpersonationSelector.tsx

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>

* Update apps/studio/components/interfaces/RoleImpersonationSelector/Icons.tsx

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>

* Update apps/studio/components/interfaces/RoleImpersonationSelector/Icons.tsx

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>

* Update apps/studio/components/interfaces/RoleImpersonationSelector/Icons.tsx

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>

* Update apps/studio/components/interfaces/RoleImpersonationSelector/Icons.tsx

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>

* Update apps/studio/components/interfaces/RoleImpersonationSelector/Icons.tsx

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>

* Update apps/studio/components/interfaces/RoleImpersonationSelector/UserImpersonationSelector.tsx

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>

* add constant padding at the bottom of user selector

* update graphiql buttons font size

* make rls warning dismissable

* use text-foreground on rls warning title

* fix no results while impersonating a role

* fix error line number when impersonating a role

---------

Co-authored-by: Jonathan Summers-Muir <MildTomato@users.noreply.github.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2023-12-04 04:45:11 +00:00

205 lines
5.3 KiB
TypeScript

import { QueryKey, UseQueryOptions } from '@tanstack/react-query'
import { Filter, Query, Sort, SupaRow, SupaTable } from 'components/grid'
import { ImpersonationRole, wrapWithRoleImpersonation } from 'lib/role-impersonation'
import { useCallback } from 'react'
import {
ExecuteSqlData,
executeSql,
useExecuteSqlPrefetch,
useExecuteSqlQuery,
} from '../sql/execute-sql-query'
import { getPagination } from '../utils/pagination'
import { formatFilterValue } from './utils'
type GetTableRowsArgs = {
table?: SupaTable
filters?: Filter[]
sorts?: Sort[]
limit?: number
page?: number
impersonatedRole?: ImpersonationRole
}
// [Joshen] From components/grid/services/row/SqlRowService.ts, we should remove the logic from SqlRowService eventually
// (currently used in csv export)
export const fetchAllTableRows = async ({
projectRef,
connectionString,
table,
filters = [],
sorts = [],
}: {
projectRef: string
connectionString?: string
table: SupaTable
filters?: Filter[]
sorts?: Sort[]
}) => {
if (!connectionString) {
console.error('Connection string is required')
return []
}
const rows: any[] = []
const query = new Query()
let queryChains = query.from(table.name, table.schema ?? undefined).select()
filters
.filter((filter) => filter.value && filter.value !== '')
.forEach((filter) => {
const value = formatFilterValue(table, filter)
queryChains = queryChains.filter(filter.column, filter.operator, value)
})
sorts.forEach((sort) => {
queryChains = queryChains.order(sort.column, sort.ascending, sort.nullsFirst)
})
// Starting from page 0, fetch 500 records per call
let page = -1
let from = 0
let to = 0
let pageData = []
const rowsPerPage = 500
await (async () => {
do {
page += 1
from = page * rowsPerPage
to = (page + 1) * rowsPerPage - 1
const query = queryChains.range(from, to).toSql()
try {
const { result } = await executeSql({ projectRef, connectionString, sql: query })
rows.push(...result)
pageData = result
} catch (error) {
return { data: { rows: [] } }
}
} while (pageData.length === rowsPerPage)
})()
return rows
}
export const getTableRowsSqlQuery = ({
table,
filters = [],
sorts = [],
page,
limit,
}: GetTableRowsArgs) => {
const query = new Query()
if (!table) {
return ``
}
const enumArrayColumns = table.columns
.filter((column) => {
return (column?.enum ?? []).length > 0 && column.dataType.toLowerCase() === 'array'
})
.map((column) => column.name)
let queryChains =
enumArrayColumns.length > 0
? query
.from(table.name, table.schema ?? undefined)
.select(`*,${enumArrayColumns.map((x) => `"${x}"::text[]`).join(',')}`)
: query.from(table.name, table.schema ?? undefined).select()
filters
.filter((x) => x.value && x.value != '')
.forEach((x) => {
const value = formatFilterValue(table, x)
queryChains = queryChains.filter(x.column, x.operator, value)
})
sorts.forEach((x) => {
queryChains = queryChains.order(x.column, x.ascending, x.nullsFirst)
})
// getPagination is expecting to start from 0
const { from, to } = getPagination((page ?? 1) - 1, limit)
const sql = queryChains.range(from, to).toSql()
return sql
}
export type TableRows = {
rows: SupaRow[]
}
export type TableRowsVariables = GetTableRowsArgs & {
projectRef?: string
connectionString?: string
queryKey?: QueryKey
}
export type TableRowsData = TableRows
export type TableRowsError = unknown
export const useTableRowsQuery = <TData extends TableRowsData = TableRowsData>(
{ projectRef, connectionString, queryKey, table, impersonatedRole, ...args }: TableRowsVariables,
options: UseQueryOptions<ExecuteSqlData, TableRowsError, TData> = {}
) =>
useExecuteSqlQuery(
{
projectRef,
connectionString,
sql: wrapWithRoleImpersonation(getTableRowsSqlQuery({ table, ...args }), {
projectRef: projectRef ?? 'ref',
role: impersonatedRole,
}),
queryKey: [
...(queryKey ?? []),
{
table: { name: table?.name, schema: table?.schema },
impersonatedRole,
...args,
},
],
},
{
select(data) {
const rows = data.result.map((x: any, index: number) => {
return { idx: index, ...x } as SupaRow
})
return {
rows,
} as TData
},
enabled: typeof projectRef !== 'undefined' && typeof table !== 'undefined',
...options,
}
)
/**
* useTableRowsPrefetch is used for prefetching table rows. For example, starting a query loading before a page is navigated to.
*
* @example
* const prefetch = useTableRowsPrefetch({ projectRef })
*
* return (
* <Link onMouseEnter={() => prefetch()}>
* Start loading on hover
* </Link>
* )
*/
export const useTableRowsPrefetch = () => {
const prefetch = useExecuteSqlPrefetch()
return useCallback(
({ projectRef, connectionString, queryKey, table, ...args }: TableRowsVariables) =>
prefetch({
projectRef,
connectionString,
sql: getTableRowsSqlQuery({ table, ...args }),
queryKey: [
...(queryKey ?? []),
{ table: { name: table?.name, schema: table?.schema }, ...args },
],
}),
[prefetch]
)
}