Files
supabase/apps/studio/components/interfaces/Database/Wrappers/Wrappers.utils.ts
T
590ed362ab feat: Redesign for the integrations pages (#30476)
* Initial commit.

* Minor type fixes.

* Add a integration for Queues. Refactor some of the integration layout.

* Migrate the Cron integration to the new style.

* Add useInstalledIntegrations hook.

* Add an integration entry for vault.

* Add an integration entry for GraphiQL.

* Add supabase webhooks.

* Feat/integrations get layout (#30538)

* scroll based icon

* Update header.tsx

* remove dep from overview

* moar

* more table stuff

* moar

* alt nav put in

* fix MotionNumber issues

* more

* trying both layouts

* Fix bunch of type errors.

---------

Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>

* Migrate Vercel and Github files to their own folders.

* Switch all integrations with the new designs.

* More fixes for links, pages structure and other random stuff.

* Remove unneeded file.

* Another set of fixes. Migrated most of the extension integrations.

* Migrated Vault and webhooks to the new style.

* Various fixes to make the animation work.

* Remove extra code.

* Tiny fixes 😬 i swear its tiny

* Refactor IntegrationOverviewTab

* chore/ update integrations routes (#30585)

* init

* add child support in tabs

* add webhooks

* Update IntegrationPageHandler.tsx

* fix id issues

* use messageId instead

* animation tweaks

* Move the description to the wrappers array.

* The useInstalledIntegrations now provides integrations which could be installed.

* Add static content for the various integrations.

* Move the page handler logic into the integrations definitions.

* Clean up some extra code.

* Add logic to make the overview tab the default tab.

* Don't show the header until the integration id has been checked.

* Add logic to the integration pages to avoid weird loading bugs, deselecting tabs if the integration hasn't been installed etc.

* Fix the webhooks overview tab.

* Fix the buttons for enabling extensions.

* Add padding to all custom tab contents.

* Small fixes

* Prettier lint

* Fix icon color + add empty state for when available integrations are all installed

* Fix ts errors

* Fiox

* Add enable webhooks cta

* Fix key

* Fix all lints

* Fix the queues create sheet.

* Fix the deletion of wrappers.

* Fix the minimum version alert for the wrappers extension.

* Make the queues table fit the whole container.

* Fix an issue which reset the tab when installing an extension.

* Address comments

* Add loading state for installed integrations in side nav

* Fix edit secret not rendering value in input field after subsequent openings

* Fix vault keys auto filling search input with vault

* Fix search input placeholder for cron

* Minor fix in install database extension copy

* Fix a bad redirect when reloading.

* Fix bad url redirects.

* Fix scrolling in create new/edit wrapper sheet.

* Add y padding to the wrappers rows.

* Fix merge errors.

* More merge fixes.

* Fix bad imports during the merge.

---------

Co-authored-by: Jonathan Summers-Muir <MildTomato@users.noreply.github.com>
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2024-11-25 13:26:22 +01:00

134 lines
4.2 KiB
TypeScript

import { FDW, FDWTable } from 'data/fdw/fdws-query'
import { WRAPPERS, WRAPPER_HANDLERS } from './Wrappers.constants'
import type { WrapperMeta } from './Wrappers.types'
export const makeValidateRequired = (options: { name: string; required: boolean }[]) => {
const requiredOptionsSet = new Set(
options.filter((option) => option.required).map((option) => option.name)
)
const requiredArrayOptionsSet = new Set(
Array.from(requiredOptionsSet).filter((option) => option.includes('.'))
)
const requiredArrayOptions = Array.from(requiredArrayOptionsSet)
return (values: any) => {
const errors = Object.fromEntries(
Object.entries(values)
.flatMap(([key, value]) =>
Array.isArray(value)
? [[key, value], ...value.map((v, i) => [`${key}.${i}`, v])]
: [[key, value]]
)
.filter(([_key, value]) => {
const [key, idx] = _key.split('.')
if (
idx !== undefined &&
requiredOptionsSet.has(key) &&
Object.keys(value).some((subKey) => requiredArrayOptionsSet.has(`${key}.${subKey}`))
) {
const arrayOption = requiredArrayOptions.find((option) => option.startsWith(`${key}.`))
if (arrayOption) {
const subKey = arrayOption.split('.')[1]
return !value[subKey]
}
return false
}
return requiredOptionsSet.has(key) && (Array.isArray(value) ? value.length < 1 : !value)
})
.map(([key]) => {
if (key === 'table_name') return [key, 'Please provide a name for your table']
else if (key === 'columns') return [key, 'Please select at least one column']
else return [key, 'This field is required']
})
)
return errors
}
}
interface FormattedWrapperTable {
index: number
columns: { name: string }[]
is_new_schema: boolean
schema: string
schema_name: string
table_name: string
object?: string // From options object for Firebase/Stripe
[key: string]: any // For other dynamic options from table.options
}
export const formatWrapperTables = (
wrapper: { handler: string; tables?: FDWTable[] },
wrapperMeta?: WrapperMeta
): FormattedWrapperTable[] => {
const tables = wrapper?.tables ?? []
return tables.map((table) => {
let index: number = 0
const options = Object.fromEntries(table.options.map((option: string) => option.split('=')))
switch (wrapper.handler) {
case WRAPPER_HANDLERS.STRIPE:
index =
wrapperMeta?.tables.findIndex(
(x) => x.options.find((x) => x.name === 'object')?.defaultValue === options.object
) ?? 0
break
case WRAPPER_HANDLERS.FIREBASE:
if (options.object === 'auth/users') {
index =
wrapperMeta?.tables.findIndex((x) =>
x.options.find((x) => x.defaultValue === 'auth/users')
) ?? 0
} else {
index = wrapperMeta?.tables.findIndex((x) => x.label === 'Firestore Collection') ?? 0
}
break
case WRAPPER_HANDLERS.S3:
case WRAPPER_HANDLERS.AIRTABLE:
case WRAPPER_HANDLERS.LOGFLARE:
case WRAPPER_HANDLERS.BIG_QUERY:
case WRAPPER_HANDLERS.CLICK_HOUSE:
break
}
return {
...options,
index,
id: table.id,
columns: table.columns,
is_new_schema: false,
schema: table.schema,
schema_name: table.schema,
table_name: table.name,
}
})
}
export const convertKVStringArrayToJson = (values: string[]) => {
return Object.fromEntries(values.map((value) => value.split('=')))
}
export function wrapperMetaComparator(
wrapperMeta: Pick<WrapperMeta, 'handlerName' | 'server'>,
wrapper: FDW | undefined
) {
if (wrapperMeta.handlerName === 'wasm_fdw_handler') {
const serverOptions = convertKVStringArrayToJson(wrapper?.server_options ?? [])
return (
wrapperMeta.server.options.find((option) => option.name === 'fdw_package_name')
?.defaultValue === serverOptions['fdw_package_name']
)
}
return wrapperMeta.handlerName === wrapper?.handler
}
export function getWrapperMetaForWrapper(wrapper: FDW | undefined) {
return WRAPPERS.find((w) => wrapperMetaComparator(w, wrapper))
}