diff --git a/ui/app/mirrors/create/handlers.ts b/ui/app/mirrors/create/handlers.ts
index da1daf4dca..31ff45a66b 100644
--- a/ui/app/mirrors/create/handlers.ts
+++ b/ui/app/mirrors/create/handlers.ts
@@ -135,7 +135,7 @@ export const handleCreateQRep = async (
     query = config.query;
     config.initialCopyOnly = false;
   }
-  console.log('handle Qrep:', config);
+
   if (
     config.writeMode?.writeType == QRepWriteType.QREP_WRITE_MODE_UPSERT &&
     !config.writeMode?.upsertKeyColumns
@@ -210,7 +210,6 @@ export const fetchColumns = async (
   setLoading: Dispatch<SetStateAction<boolean>>
 ) => {
   if (peerName?.length === 0) return [];
-  console.log(peerName, schemaName, tableName);
   setLoading(true);
   const columnsRes: UColumnsResponse = await fetch('/api/peers/columns', {
     method: 'POST',
diff --git a/ui/app/mirrors/create/tablemapping.tsx b/ui/app/mirrors/create/tablemapping.tsx
index ac1a18f79a..6ee40aaf22 100644
--- a/ui/app/mirrors/create/tablemapping.tsx
+++ b/ui/app/mirrors/create/tablemapping.tsx
@@ -116,7 +116,6 @@ const TableMapping = ({
   const [searchQuery, setSearchQuery] = useState('');
 
   useEffect(() => {
-    console.log('peertype and schema in useeffect:', peerType, schema);
     if (peerType != undefined && dBTypeToJSON(peerType) == 'BIGQUERY') {
       setRows((rows) => {
         const newRows = [...rows];
diff --git a/ui/app/mirrors/edit/[mirrorId]/cdc.tsx b/ui/app/mirrors/edit/[mirrorId]/cdc.tsx
index 7ef56f193e..3554e9a9ab 100644
--- a/ui/app/mirrors/edit/[mirrorId]/cdc.tsx
+++ b/ui/app/mirrors/edit/[mirrorId]/cdc.tsx
@@ -2,22 +2,15 @@
 
 import SearchBar from '@/components/Search';
 import TimeLabel from '@/components/TimeComponent';
-import {
-  CDCMirrorStatus,
-  QRepMirrorStatus,
-  SnapshotStatus,
-} from '@/grpc_generated/route';
+import { QRepMirrorStatus, SnapshotStatus } from '@/grpc_generated/route';
 import { Button } from '@/lib/Button';
 import { Icon } from '@/lib/Icon';
 import { Label } from '@/lib/Label';
 import { ProgressBar } from '@/lib/ProgressBar';
 import { Table, TableCell, TableRow } from '@/lib/Table';
-import * as Tabs from '@radix-ui/react-tabs';
 import moment, { Duration, Moment } from 'moment';
-import { useQueryState } from 'next-usequerystate';
 import Link from 'next/link';
 import { useState } from 'react';
-import styled from 'styled-components';
 
 class TableCloneSummary {
   flowJobName: string;
@@ -94,162 +87,92 @@ function summarizeTableClone(clone: QRepMirrorStatus): TableCloneSummary {
 type SnapshotStatusProps = {
   status: SnapshotStatus;
 };
-const SnapshotStatusTable = ({ status }: SnapshotStatusProps) => {
+export const SnapshotStatusTable = ({ status }: SnapshotStatusProps) => {
   const [snapshotRows, setSnapshotRows] = useState(
     status.clones.map(summarizeTableClone)
   );
   return (
-    <Table
-      title={<Label variant='headline'>Initial Copy</Label>}
-      toolbar={{
-        left: (
-          <>
-            <Button variant='normalBorderless'>
-              <Icon name='chevron_left' />
-            </Button>
-            <Button variant='normalBorderless'>
-              <Icon name='chevron_right' />
-            </Button>
-            <Button
-              variant='normalBorderless'
-              onClick={() => window.location.reload()}
-            >
-              <Icon name='refresh' />
-            </Button>
-          </>
-        ),
-        right: (
-          <SearchBar
-            allItems={status.clones.map(summarizeTableClone)}
-            setItems={setSnapshotRows}
-            filterFunction={(query: string) =>
-              status.clones.map(summarizeTableClone).filter((row: any) => {
-                return row.tableName
-                  .toLowerCase()
-                  .includes(query.toLowerCase());
-              })
-            }
-          />
-        ),
-      }}
-      header={
-        <TableRow>
-          <TableCell as='th'>Table Identifier</TableCell>
-          <TableCell as='th'>Start Time</TableCell>
-          <TableCell as='th'>Progress Partitions</TableCell>
-          <TableCell as='th'>Num Rows Synced</TableCell>
-          <TableCell as='th'>Avg Time Per Partition</TableCell>
-        </TableRow>
-      }
-    >
-      {snapshotRows.map((clone, index) => (
-        <TableRow key={index}>
-          <TableCell>
-            <Label>
-              <Link
-                href={`/mirrors/status/qrep/${clone.flowJobName}`}
-                className='underline cursor-pointer'
+    <div style={{ marginTop: '2rem' }}>
+      <Table
+        title={<Label variant='headline'>Initial Copy</Label>}
+        toolbar={{
+          left: (
+            <>
+              <Button variant='normalBorderless'>
+                <Icon name='chevron_left' />
+              </Button>
+              <Button variant='normalBorderless'>
+                <Icon name='chevron_right' />
+              </Button>
+              <Button
+                variant='normalBorderless'
+                onClick={() => window.location.reload()}
               >
-                {clone.tableName}
-              </Link>
-            </Label>
-          </TableCell>
-          <TableCell>
-            <Label>
-              {
-                <TimeLabel
-                  timeVal={
-                    clone.cloneStartTime?.format('YYYY-MM-DD HH:mm:ss') || 'N/A'
-                  }
-                />
+                <Icon name='refresh' />
+              </Button>
+            </>
+          ),
+          right: (
+            <SearchBar
+              allItems={status.clones.map(summarizeTableClone)}
+              setItems={setSnapshotRows}
+              filterFunction={(query: string) =>
+                status.clones.map(summarizeTableClone).filter((row: any) => {
+                  return row.tableName
+                    .toLowerCase()
+                    .includes(query.toLowerCase());
+                })
               }
-            </Label>
-          </TableCell>
-          <TableCell>
-            <ProgressBar progress={clone.getPartitionProgressPercentage()} />
-            {clone.completedNumPartitions} / {clone.totalNumPartitions}
-          </TableCell>
-          <TableCell>{clone.completedNumRows}</TableCell>
-          <TableCell>
-            <Label>
-              {clone.avgTimePerPartition?.humanize({ ss: 1 }) || 'N/A'}
-            </Label>
-          </TableCell>
-        </TableRow>
-      ))}
-    </Table>
+            />
+          ),
+        }}
+        header={
+          <TableRow>
+            <TableCell as='th'>Table Identifier</TableCell>
+            <TableCell as='th'>Start Time</TableCell>
+            <TableCell as='th'>Progress Partitions</TableCell>
+            <TableCell as='th'>Num Rows Synced</TableCell>
+            <TableCell as='th'>Avg Time Per Partition</TableCell>
+          </TableRow>
+        }
+      >
+        {snapshotRows.map((clone, index) => (
+          <TableRow key={index}>
+            <TableCell>
+              <Label>
+                <Link
+                  href={`/mirrors/status/qrep/${clone.flowJobName}`}
+                  className='underline cursor-pointer'
+                >
+                  {clone.tableName}
+                </Link>
+              </Label>
+            </TableCell>
+            <TableCell>
+              <Label>
+                {
+                  <TimeLabel
+                    timeVal={
+                      clone.cloneStartTime?.format('YYYY-MM-DD HH:mm:ss') ||
+                      'N/A'
+                    }
+                  />
+                }
+              </Label>
+            </TableCell>
+            <TableCell>
+              <ProgressBar progress={clone.getPartitionProgressPercentage()} />
+              {clone.completedNumPartitions} / {clone.totalNumPartitions}
+            </TableCell>
+            <TableCell>{clone.completedNumRows}</TableCell>
+            <TableCell>
+              <Label>
+                {clone.avgTimePerPartition?.humanize({ ss: 1 }) || 'N/A'}
+              </Label>
+            </TableCell>
+          </TableRow>
+        ))}
+      </Table>
+    </div>
   );
 };
-
-const Trigger = styled(
-  ({ isActive, ...props }: { isActive?: boolean } & Tabs.TabsTriggerProps) => (
-    <Tabs.Trigger {...props} />
-  )
-)<{ isActive?: boolean }>`
-  background-color: ${({ theme, isActive }) =>
-    isActive ? theme.colors.accent.surface.selected : 'white'};
-
-  font-weight: ${({ isActive }) => (isActive ? 'bold' : 'normal')};
-
-  &:hover {
-    color: ${({ theme }) => theme.colors.accent.text.highContrast};
-  }
-`;
-
-type CDCMirrorStatusProps = {
-  cdc: CDCMirrorStatus;
-  syncStatusChild?: React.ReactNode;
-};
-export function CDCMirror({ cdc, syncStatusChild }: CDCMirrorStatusProps) {
-  const [selectedTab, setSelectedTab] = useQueryState('tab', {
-    history: 'push',
-    defaultValue: 'tab1',
-  });
-
-  let snapshot = <></>;
-  if (cdc.snapshotStatus) {
-    snapshot = <SnapshotStatusTable status={cdc.snapshotStatus} />;
-  }
-
-  return (
-    <Tabs.Root
-      className='flex flex-col w-full'
-      defaultValue={selectedTab}
-      onValueChange={setSelectedTab}
-      style={{ marginTop: '2rem' }}
-    >
-      <Tabs.List className='flex border-b' aria-label='Details'>
-        <Trigger
-          isActive={selectedTab === 'tab1'}
-          className='flex-1 px-5 h-[45px] flex items-center justify-center text-sm focus:shadow-outline focus:outline-none'
-          value='tab1'
-        >
-          Details
-        </Trigger>
-        <Trigger
-          isActive={selectedTab === 'tab2'}
-          className='flex-1 px-5 h-[45px] flex items-center justify-center text-sm focus:shadow-outline focus:outline-none'
-          value='tab2'
-        >
-          Sync Status
-        </Trigger>
-        <Trigger
-          isActive={selectedTab === 'tab3'}
-          className='flex-1 px-5 h-[45px] flex items-center justify-center text-sm focus:shadow-outline focus:outline-none'
-          value='tab3'
-        >
-          Initial Copy
-        </Trigger>
-      </Tabs.List>
-      <Tabs.Content className='p-5 rounded-b-md' value='tab1'>
-        {/* <CDCDetails config={cdc.config} /> */}
-      </Tabs.Content>
-      <Tabs.Content className='p-5 rounded-b-md' value='tab2'>
-        {syncStatusChild}
-      </Tabs.Content>
-      <Tabs.Content className='p-5 rounded-b-md' value='tab3'>
-        {snapshot}
-      </Tabs.Content>
-    </Tabs.Root>
-  );
-}
diff --git a/ui/app/mirrors/edit/[mirrorId]/cdcGraph.tsx b/ui/app/mirrors/edit/[mirrorId]/cdcGraph.tsx
index 8a8901a836..9c490f6549 100644
--- a/ui/app/mirrors/edit/[mirrorId]/cdcGraph.tsx
+++ b/ui/app/mirrors/edit/[mirrorId]/cdcGraph.tsx
@@ -23,17 +23,17 @@ function CdcGraph({ syncs }: { syncs: SyncStatusRow[] }) {
   const initialCount: [string, number][] = [];
   let [counts, setCounts] = useState(initialCount);
 
-  let rows = syncs.map((sync) => ({
-    timestamp: sync.startTime,
-    count: sync.numRows,
-  }));
-
   useEffect(() => {
+    let rows = syncs.map((sync) => ({
+      timestamp: sync.startTime,
+      count: sync.numRows,
+    }));
+
     let counts = aggregateCountsByInterval(rows, aggregateType);
     counts = counts.slice(0, 29);
     counts = counts.reverse();
     setCounts(counts);
-  }, [aggregateType, rows]);
+  }, [aggregateType, syncs]);
 
   return (
     <div>
diff --git a/ui/app/mirrors/edit/[mirrorId]/page.tsx b/ui/app/mirrors/edit/[mirrorId]/page.tsx
index 0bd23dddb0..ccea9bb196 100644
--- a/ui/app/mirrors/edit/[mirrorId]/page.tsx
+++ b/ui/app/mirrors/edit/[mirrorId]/page.tsx
@@ -5,6 +5,7 @@ import { LayoutMain } from '@/lib/Layout';
 import { GetFlowHttpAddressFromEnv } from '@/rpc/http';
 import { redirect } from 'next/navigation';
 import { Suspense } from 'react';
+import { SnapshotStatusTable } from './cdc';
 import CdcDetails from './cdcDetails';
 import SyncStatus from './syncStatus';
 
@@ -69,10 +70,17 @@ export default async function EditMirror({
       <Header variant='title2'>{mirrorId}</Header>
       <Suspense fallback={<Loading />}>
         {mirrorStatus.cdcStatus && (
-          <CdcDetails
-            syncs={rows}
-            mirrorConfig={mirrorStatus.cdcStatus.config}
-          />
+          <>
+            <CdcDetails
+              syncs={rows}
+              mirrorConfig={mirrorStatus.cdcStatus.config}
+            />
+            {mirrorStatus.cdcStatus.snapshotStatus && (
+              <SnapshotStatusTable
+                status={mirrorStatus.cdcStatus.snapshotStatus}
+              />
+            )}
+          </>
         )}
         <div className='mt-10'>{syncStatusChild}</div>
       </Suspense>