diff --git a/ui/app/mirrors/create/cdc/guide.tsx b/ui/app/mirrors/create/cdc/guide.tsx
index 041632e378..d06d615814 100644
--- a/ui/app/mirrors/create/cdc/guide.tsx
+++ b/ui/app/mirrors/create/cdc/guide.tsx
@@ -1,29 +1,39 @@
+import TitleCase from '@/app/utils/titlecase';
import { Label } from '@/lib/Label';
import Link from 'next/link';
const GuideForDestinationSetup = ({
- dstPeerType: peerType,
+ createPeerType: peerType,
}: {
- dstPeerType: string;
+ createPeerType: string;
}) => {
const linkForDst = () => {
- switch (peerType) {
+ console.log(peerType);
+ switch (peerType.toUpperCase().replace(/%20/g, ' ')) {
case 'SNOWFLAKE':
return 'https://docs.peerdb.io/connect/snowflake';
case 'BIGQUERY':
return 'https://docs.peerdb.io/connect/bigquery';
+ case 'RDS POSTGRESQL':
+ case 'POSTGRESQL':
+ return 'https://docs.peerdb.io/connect/rds_postgres';
+ case 'AZURE FLEXIBLE POSTGRESQL':
+ return 'https://docs.peerdb.io/connect/azure_flexible_server_postgres';
+ case 'GOOGLE CLOUD POSTGRESQL':
+ return 'https://docs.peerdb.io/connect/cloudsql_postgres';
default:
- return 'https://docs.peerdb.io/';
+ return '';
}
};
- if (peerType != 'SNOWFLAKE' && peerType != 'BIGQUERY') {
+ if (linkForDst() == '') {
return <>;
}
return (
diff --git a/ui/app/peers/create/[peerType]/page.tsx b/ui/app/peers/create/[peerType]/page.tsx
index b3310f32dd..0f01d59279 100644
--- a/ui/app/peers/create/[peerType]/page.tsx
+++ b/ui/app/peers/create/[peerType]/page.tsx
@@ -7,6 +7,7 @@ import PostgresForm from '@/components/PeerForms/PostgresForm';
import S3Form from '@/components/PeerForms/S3Form';
import SnowflakeForm from '@/components/PeerForms/SnowflakeForm';
+import TitleCase from '@/app/utils/titlecase';
import { Button } from '@/lib/Button';
import { ButtonGroup } from '@/lib/ButtonGroup';
import { Label } from '@/lib/Label';
@@ -45,9 +46,17 @@ export default function CreateConfig({
const [config, setConfig] = useState(blankSetting);
const [loading, setLoading] = useState(false);
const configComponentMap = (dbType: string) => {
+ if (dbType.includes('POSTGRESQL')) {
+ return (
+
+ );
+ }
+
switch (dbType) {
- case 'POSTGRES':
- return ;
case 'SNOWFLAKE':
return ;
case 'BIGQUERY':
@@ -80,11 +89,10 @@ export default function CreateConfig({
>
-
+
{
switch (peerType) {
+ case 'AZURE FLEXIBLE POSTGRESQL':
+ return '/svgs/azurepg.svg';
+ case 'RDS POSTGRESQL':
+ return '/svgs/rds.svg';
+ case 'GOOGLE CLOUD POSTGRESQL':
+ return '/svgs/gcp.svg';
case DBType.POSTGRES:
case 'POSTGRES':
return '/svgs/pg.svg';
diff --git a/ui/components/PeerForms/PostgresForm.tsx b/ui/components/PeerForms/PostgresForm.tsx
index 0c7f5e808d..98bef1aad2 100644
--- a/ui/components/PeerForms/PostgresForm.tsx
+++ b/ui/components/PeerForms/PostgresForm.tsx
@@ -18,12 +18,12 @@ import { InfoPopover } from '../InfoPopover';
interface ConfigProps {
settings: PeerSetting[];
setter: PeerSetter;
+ type: string;
}
-export default function PostgresForm({ settings, setter }: ConfigProps) {
+export default function PostgresForm({ settings, setter, type }: ConfigProps) {
const [showSSH, setShowSSH] = useState(false);
const [sshConfig, setSSHConfig] = useState(blankSSHConfig);
-
const handleFile = (
file: File,
setFile: (value: string, configSetter: sshSetter) => void
diff --git a/ui/components/SelectSource.tsx b/ui/components/SelectSource.tsx
index 4aefe67082..c445ceb21e 100644
--- a/ui/components/SelectSource.tsx
+++ b/ui/components/SelectSource.tsx
@@ -1,5 +1,6 @@
'use client';
import SelectTheme from '@/app/styles/select';
+import TitleCase from '@/app/utils/titlecase';
import { DBType } from '@/grpc_generated/peers';
import Image from 'next/image';
import { Dispatch, SetStateAction } from 'react';
@@ -11,12 +12,12 @@ interface SelectSourceProps {
setPeerType: Dispatch>;
}
-function SourceLabel({ value }: { value: string }) {
- const peerLogo = DBTypeToImageMapping(value);
+function SourceLabel({ value, label }: { value: string; label: string }) {
+ const peerLogo = DBTypeToImageMapping(label);
return (
-
{value}
+
{TitleCase(label)}
);
}
@@ -25,11 +26,11 @@ export default function SelectSource({
peerType,
setPeerType,
}: SelectSourceProps) {
- const dbTypes = Object.values(DBType)
+ let dbTypes = Object.values(DBType)
.filter(
(value): value is string =>
typeof value === 'string' &&
- (value === 'POSTGRES' ||
+ (value === 'POSTGRESQL' ||
value === 'SNOWFLAKE' ||
value === 'BIGQUERY' ||
value === 'S3' ||
@@ -37,13 +38,19 @@ export default function SelectSource({
)
.map((value) => ({ label: value, value }));
+ dbTypes.push(
+ { value: 'POSTGRESQL', label: 'POSTGRESQL' },
+ { value: 'POSTGRESQL', label: 'RDS POSTGRESQL' },
+ { value: 'POSTGRESQL', label: 'GOOGLE CLOUD POSTGRESQL' },
+ { value: 'POSTGRESQL', label: 'AZURE FLEXIBLE POSTGRESQL' }
+ );
return (
opt.value === peerType)}
- onChange={(val, _) => val && setPeerType(val.value)}
+ defaultValue={dbTypes.find((opt) => opt.label === peerType)}
+ onChange={(val, _) => val && setPeerType(val.label)}
formatOptionLabel={SourceLabel}
theme={SelectTheme}
/>
diff --git a/ui/public/svgs/azurepg.svg b/ui/public/svgs/azurepg.svg
new file mode 100644
index 0000000000..811a6c7397
--- /dev/null
+++ b/ui/public/svgs/azurepg.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/ui/public/svgs/gcp.svg b/ui/public/svgs/gcp.svg
new file mode 100644
index 0000000000..81b7d24547
--- /dev/null
+++ b/ui/public/svgs/gcp.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/ui/public/svgs/rds.svg b/ui/public/svgs/rds.svg
new file mode 100644
index 0000000000..f384cdad89
--- /dev/null
+++ b/ui/public/svgs/rds.svg
@@ -0,0 +1,16 @@
+
+
+
\ No newline at end of file