Files
supabase/apps/studio/components/interfaces/Database/Replication/useIsETLPrivateAlpha.ts
Jordan McQueen fa1e4c4bbf feat(studio): add ClickHouse replication destination (#46870)
Adds ClickHouse as a replication destination type in Studio.

- New ClickHouse option in the destination type selector, gated behind
the
`etlEnableClickHousePrivateAlpha` organization feature flag (off by
default).
- ClickHouse settings form: URL, user, password (optional), database,
and
  - Client-side URL validation requires HTTPS and rejects URLs targeting
    internal addresses (loopback, RFC 1918, link-local, CGNAT, IPv6
    loopback/link-local/ULA, and IPv4-mapped/NAT64 forms). Server-side
    validation remains authoritative.

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

## New Features
- Added **ClickHouse** as a replication destination option (private
alpha), including support in destination selection/panel, replication
diagram rendering, and destination icons.
- Introduced a ClickHouse destination form with fields for URL, user,
optional password (masked toggle), database, and engine selection.
- Added ClickHouse destination config handling for create/update flows,
with normalization and engine support.

## Tests
- Expanded unit tests to cover ClickHouse validation and destination
config building/normalization, including HTTPS-only and blocking
localhost/internal targets.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

---------

Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
2026-07-20 12:09:13 +08:00

61 lines
2.1 KiB
TypeScript

import { useFlag } from 'common'
import { useSelectedOrganizationQuery } from '@/hooks/misc/useSelectedOrganization'
/**
* Organization-level access for Pipelines alpha destinations. The flag names still use
* the original ETL identifiers, but the UI checks whether the org has access to at least one
* destination type.
*/
const useIsCurrentOrgInFlagList = (flag: string) => {
const flagValue = useFlag(flag)
const { data: organization } = useSelectedOrganizationQuery()
const allowedOrgSlugs =
typeof flagValue === 'string'
? (flagValue as string).split(',').map((x: string) => x.trim())
: []
// [Joshen] Override to enable for all organizations by setting the flag value as `all`
if (allowedOrgSlugs.includes('all')) return true
// [Joshen] Otherwise fallback to checking against org slug
return allowedOrgSlugs.includes(organization?.slug ?? '')
}
export const useIsETLBigQueryPrivateAlpha = () => {
return useIsCurrentOrgInFlagList('etlEnableBigQueryPrivateAlpha')
}
export const useIsETLIcebergPrivateAlpha = () => {
return useIsCurrentOrgInFlagList('etlEnableIcebergPrivateAlpha')
}
export const useIsETLDucklakePrivateAlpha = () => {
return useIsCurrentOrgInFlagList('etlEnableDucklakePrivateAlpha')
}
export const useIsETLSnowflakePrivateAlpha = () => {
return useIsCurrentOrgInFlagList('etlEnableSnowflakePrivateAlpha')
}
export const useIsETLClickHousePrivateAlpha = () => {
return useIsCurrentOrgInFlagList('etlEnableClickHousePrivateAlpha')
}
export const useIsETLPrivateAlpha = () => {
const hasAccessToETLBigQuery = useIsCurrentOrgInFlagList('etlEnableBigQueryPrivateAlpha')
const hasAccessToETLIceberg = useIsCurrentOrgInFlagList('etlEnableIcebergPrivateAlpha')
const hasAccessToETLDucklake = useIsCurrentOrgInFlagList('etlEnableDucklakePrivateAlpha')
const hasAccessToETLSnowflake = useIsCurrentOrgInFlagList('etlEnableSnowflakePrivateAlpha')
const hasAccessToETLClickHouse = useIsCurrentOrgInFlagList('etlEnableClickHousePrivateAlpha')
return (
hasAccessToETLBigQuery ||
hasAccessToETLIceberg ||
hasAccessToETLDucklake ||
hasAccessToETLSnowflake ||
hasAccessToETLClickHouse
)
}