diff --git a/ui/app/api/mirrors/qrep/route.ts b/ui/app/api/mirrors/qrep/route.ts
index 6f199dc53f..a4c7e2564a 100644
--- a/ui/app/api/mirrors/qrep/route.ts
+++ b/ui/app/api/mirrors/qrep/route.ts
@@ -8,7 +8,6 @@ import { GetFlowHttpAddressFromEnv } from '@/rpc/http';
 export async function POST(request: Request) {
   const body = await request.json();
   const { config } = body;
-  console.log('/qrep/post config:', config);
   const flowServiceAddr = GetFlowHttpAddressFromEnv();
   const req: CreateQRepFlowRequest = {
     qrepConfig: config,
diff --git a/ui/app/api/mirrors/route.ts b/ui/app/api/mirrors/route.ts
index f9ca2f1911..47f4c84990 100644
--- a/ui/app/api/mirrors/route.ts
+++ b/ui/app/api/mirrors/route.ts
@@ -29,5 +29,5 @@ export async function GET(request: Request) {
     };
     return newMirror;
   });
-  return new Response(JSON.stringify(stringifyConfig(flows)));
+  return new Response(JSON.stringify((flows)));
 }
diff --git a/ui/app/api/peers/getTruePeer.ts b/ui/app/api/peers/getTruePeer.ts
index 1af4155dec..3ba61379fb 100644
--- a/ui/app/api/peers/getTruePeer.ts
+++ b/ui/app/api/peers/getTruePeer.ts
@@ -8,6 +8,7 @@ import {
   S3Config,
   SnowflakeConfig,
   SqlServerConfig,
+  ClickhouseConfig,
 } from '@/grpc_generated/peers';
 
 export const getTruePeer = (peer: CatalogPeer) => {
@@ -23,7 +24,8 @@ export const getTruePeer = (peer: CatalogPeer) => {
     | EventHubConfig
     | S3Config
     | SqlServerConfig
-    | EventHubGroupConfig;
+    | EventHubGroupConfig
+    | ClickhouseConfig;
   switch (peer.type) {
     case 0:
       config = BigqueryConfig.decode(options);
@@ -53,6 +55,9 @@ export const getTruePeer = (peer: CatalogPeer) => {
       config = EventHubGroupConfig.decode(options);
       newPeer.eventhubGroupConfig = config;
       break;
+    case 8:
+      config = ClickhouseConfig.decode(options);
+      newPeer.clickhouseConfig = config;
     default:
       return newPeer;
   }
diff --git a/ui/app/mirrors/create/page.tsx b/ui/app/mirrors/create/page.tsx
index a075432bb3..2221ca0a2c 100644
--- a/ui/app/mirrors/create/page.tsx
+++ b/ui/app/mirrors/create/page.tsx
@@ -59,6 +59,7 @@ export default function CreateMirrors() {
   const [config, setConfig] = useState<CDCConfig | QRepConfig>(blankCDCSetting);
   const [peers, setPeers] = useState<Peer[]>([]);
   const [rows, setRows] = useState<TableMapRow[]>([]);
+
   const [qrepQuery, setQrepQuery] =
     useState<string>(`-- Here's a sample template:
     SELECT * FROM <table_name> 
@@ -142,9 +143,10 @@ export default function CreateMirrors() {
                       placeholder={`Select the ${
                         peerEnd === 'src' ? 'source' : 'destination'
                       } peer`}
-                      onChange={(val, action) =>
+                      onChange={(val, action) =>{
                         handlePeer(val, peerEnd as 'src' | 'dst', setConfig)
                       }
+                      }
                       options={
                         (peerEnd === 'src'
                           ? peers.filter((peer) => peer.type == DBType.POSTGRES)
diff --git a/ui/app/peers/create/[peerType]/page.tsx b/ui/app/peers/create/[peerType]/page.tsx
index ca1ecd38e7..5f2d305631 100644
--- a/ui/app/peers/create/[peerType]/page.tsx
+++ b/ui/app/peers/create/[peerType]/page.tsx
@@ -114,9 +114,10 @@ export default function CreateConfig({
           </Button>
           <Button
             style={{ backgroundColor: 'gold' }}
-            onClick={() =>
+            onClick={() =>{
               handleValidate(dbType, config, setFormMessage, setLoading, name)
             }
+            }
           >
             Validate
           </Button>
diff --git a/ui/components/PeerComponent.tsx b/ui/components/PeerComponent.tsx
index 213f82ae28..63e7f1b2c0 100644
--- a/ui/components/PeerComponent.tsx
+++ b/ui/components/PeerComponent.tsx
@@ -16,7 +16,7 @@ export const DBTypeToImageMapping = (peerType: DBType | string) => {
     case 'BIGQUERY':
       return '/svgs/bq.svg';
     case 'CLICKHOUSE':
-      return '/svgs/pg.svg';   
+      return '/svgs/ch.svg';
     case DBType.S3:
     case 'S3':
       return '/svgs/aws.svg';
diff --git a/ui/components/PeerTypeComponent.tsx b/ui/components/PeerTypeComponent.tsx
index 089c41b92d..bafce004de 100644
--- a/ui/components/PeerTypeComponent.tsx
+++ b/ui/components/PeerTypeComponent.tsx
@@ -22,6 +22,8 @@ export const DBTypeToGoodText = (ptype: DBType) => {
       return 'SQL Server';
     case DBType.MONGO:
       return 'MongoDB';
+    case DBType.CLICKHOUSE:
+      return "Clickhouse"
     case DBType.UNRECOGNIZED:
       return 'Unrecognised';
   }
diff --git a/ui/public/svgs/ch.svg b/ui/public/svgs/ch.svg
new file mode 100644
index 0000000000..f2144b5d7e
--- /dev/null
+++ b/ui/public/svgs/ch.svg
@@ -0,0 +1 @@
+<svg height="2222" viewBox="0 0 9 8" width="2500" xmlns="http://www.w3.org/2000/svg"><path d="m0 7h1v1h-1z" fill="#f00"/><path d="m0 0h1v7h-1zm2 0h1v8h-1zm2 0h1v8h-1zm2 0h1v8h-1zm2 3.25h1v1.5h-1z" fill="#fc0"/></svg>
\ No newline at end of file