From 514e0f62e998defbd0f8f851617f4f8cf0335855 Mon Sep 17 00:00:00 2001
From: Amogh Bharadwaj <amogh@peerdb.io>
Date: Mon, 15 Jul 2024 20:38:37 +0530
Subject: [PATCH] UI: Fix qrep table, remove initial load table click (#1936)

Fix display of partition ID in query replication table

Getting initial load per-table qrep view requires some underlying
architectural changes where we need to store workflow IDs of initial
load jobs in flows table, or split the UI mirrors/mirrorId page into two
+ a new endpoint to get partition info from catalog etc.

In general I think the relevant information (number of partitions of the
table completed) is already displayed and users don't care about the row
graph etc there

Therefore replacing the table identifier link in snapshot table with
just a label
---
 flow/cmd/mirror_status.go                   |  8 ++++++--
 ui/app/mirrors/[mirrorId]/page.tsx          | 14 +++-----------
 ui/app/mirrors/[mirrorId]/snapshotTable.tsx | 10 +---------
 3 files changed, 10 insertions(+), 22 deletions(-)

diff --git a/flow/cmd/mirror_status.go b/flow/cmd/mirror_status.go
index c9087d1484..8fe677b0ae 100644
--- a/flow/cmd/mirror_status.go
+++ b/flow/cmd/mirror_status.go
@@ -350,7 +350,7 @@ func (h *FlowRequestHandler) getPartitionStatuses(
 	ctx context.Context,
 	flowJobName string,
 ) ([]*protos.PartitionStatus, error) {
-	q := "SELECT start_time,end_time,rows_in_partition,rows_synced FROM peerdb_stats.qrep_partitions WHERE flow_name=$1"
+	q := "SELECT partition_uuid,start_time,end_time,rows_in_partition,rows_synced FROM peerdb_stats.qrep_partitions WHERE flow_name=$1"
 	rows, err := h.pool.Query(ctx, q, flowJobName)
 	if err != nil {
 		slog.Error(fmt.Sprintf("unable to query qrep partition - %s: %s", flowJobName, err.Error()))
@@ -360,19 +360,23 @@ func (h *FlowRequestHandler) getPartitionStatuses(
 	defer rows.Close()
 
 	res := []*protos.PartitionStatus{}
+	var partitionId pgtype.Text
 	var startTime pgtype.Timestamp
 	var endTime pgtype.Timestamp
 	var numRowsInPartition pgtype.Int8
 	var numRowsSynced pgtype.Int8
 
 	for rows.Next() {
-		if err := rows.Scan(&startTime, &endTime, &numRowsInPartition, &numRowsSynced); err != nil {
+		if err := rows.Scan(&partitionId, &startTime, &endTime, &numRowsInPartition, &numRowsSynced); err != nil {
 			slog.Error(fmt.Sprintf("unable to scan qrep partition - %s: %s", flowJobName, err.Error()))
 			return nil, fmt.Errorf("unable to scan qrep partition - %s: %w", flowJobName, err)
 		}
 
 		partitionStatus := &protos.PartitionStatus{}
 
+		if partitionId.Valid {
+			partitionStatus.PartitionId = partitionId.String
+		}
 		if startTime.Valid {
 			partitionStatus.StartTime = timestamppb.New(startTime.Time)
 		}
diff --git a/ui/app/mirrors/[mirrorId]/page.tsx b/ui/app/mirrors/[mirrorId]/page.tsx
index 85333aa542..b3637af32c 100644
--- a/ui/app/mirrors/[mirrorId]/page.tsx
+++ b/ui/app/mirrors/[mirrorId]/page.tsx
@@ -19,19 +19,11 @@ import SyncStatus from './syncStatus';
 
 type EditMirrorProps = {
   params: { mirrorId: string };
-  searchParams?: { parentMirrorName: string };
 };
 
-export default function ViewMirror({
-  params: { mirrorId },
-  searchParams,
-}: EditMirrorProps) {
+export default function ViewMirror({ params: { mirrorId } }: EditMirrorProps) {
   const [mirrorState, setMirrorState] = useState<MirrorStatusResponse>();
   const [mounted, setMounted] = useState(false);
-  const parentMirrorName = searchParams?.parentMirrorName;
-  const isCloneJob =
-    mirrorId.startsWith('clone_') && parentMirrorName !== mirrorId;
-  const mirrorName = parentMirrorName ?? mirrorId;
 
   const fetchState = useCallback(async () => {
     const res = await getMirrorState(mirrorId);
@@ -53,7 +45,7 @@ export default function ViewMirror({
   let syncStatusChild = null;
   let actionsDropdown = null;
 
-  if (mirrorState?.cdcStatus && !isCloneJob) {
+  if (mirrorState?.cdcStatus) {
     syncStatusChild = (
       <SyncStatus
         rows={mirrorState.cdcStatus.cdcBatches}
@@ -93,7 +85,7 @@ export default function ViewMirror({
             paddingRight: '2rem',
           }}
         >
-          <Header variant='title2'>{mirrorName}</Header>
+          <Header variant='title2'>{mirrorId}</Header>
           {actionsDropdown}
         </div>
         <CDCMirror
diff --git a/ui/app/mirrors/[mirrorId]/snapshotTable.tsx b/ui/app/mirrors/[mirrorId]/snapshotTable.tsx
index 0d31a3359b..f000efd73f 100644
--- a/ui/app/mirrors/[mirrorId]/snapshotTable.tsx
+++ b/ui/app/mirrors/[mirrorId]/snapshotTable.tsx
@@ -9,7 +9,6 @@ import { Label } from '@/lib/Label';
 import { ProgressBar } from '@/lib/ProgressBar';
 import { SearchField } from '@/lib/SearchField';
 import { Table, TableCell, TableRow } from '@/lib/Table';
-import Link from 'next/link';
 import { useMemo, useState } from 'react';
 import ReactSelect from 'react-select';
 import { TableCloneSummary } from './snapshot';
@@ -198,14 +197,7 @@ const SnapshotTable = ({
       {displayedLoads.map((clone, index) => (
         <TableRow key={index}>
           <TableCell>
-            <Label>
-              <Link
-                href={`/mirrors/${clone.cloneTableSummary.flowJobName}?parentMirrorName=${clone.cloneTableSummary.mirrorName}`}
-                className='underline cursor-pointer'
-              >
-                {clone.cloneTableSummary.tableName}
-              </Link>
-            </Label>
+            <Label>{clone.cloneTableSummary.tableName}</Label>
           </TableCell>
           <TableCell>{getStatus(clone.cloneTableSummary)}</TableCell>
           <TableCell>