Skip to content

Commit

Permalink
fixes and improvements
Browse files Browse the repository at this point in the history
  • Loading branch information
Amogh-Bharadwaj committed Jan 5, 2024
1 parent 9ccb46b commit 2f0affd
Show file tree
Hide file tree
Showing 7 changed files with 71 additions and 19 deletions.
10 changes: 4 additions & 6 deletions flow/cmd/mirror_status.go
Original file line number Diff line number Diff line change
Expand Up @@ -125,9 +125,7 @@ func (h *FlowRequestHandler) cloneTableSummary(
FROM
peerdb_stats.qrep_partitions
WHERE
flow_name = $1
GROUP BY
flow_name;
flow_name = $1;
`

var startTime pgtype.Timestamp
Expand Down Expand Up @@ -160,7 +158,7 @@ func (h *FlowRequestHandler) cloneTableSummary(
}

if numRowsSynced.Valid {
res.NumRowsSynced = int64(numRowsSynced.Int64)
res.NumRowsSynced = numRowsSynced.Int64
}

if avgTimePerPartitionMs.Valid {
Expand Down Expand Up @@ -192,8 +190,8 @@ func (h *FlowRequestHandler) getPartitionStatuses(
ctx context.Context,
flowJobName string,
) ([]*protos.PartitionStatus, error) {
q := "SELECT start_time, end_time, rows_in_partition FROM peerdb_stats.qrep_partitions WHERE flow_name = $1"
rows, err := h.pool.Query(ctx, q, flowJobName)
q := "SELECT start_time, end_time, rows_in_partition FROM peerdb_stats.qrep_partitions WHERE flow_name ILIKE $1"
rows, err := h.pool.Query(ctx, q, "clone_"+flowJobName+"_%")
if err != nil {
slog.Error(fmt.Sprintf("unable to query qrep partition - %s: %s", flowJobName, err.Error()))
return nil, fmt.Errorf("unable to query qrep partition - %s: %w", flowJobName, err)
Expand Down
31 changes: 19 additions & 12 deletions ui/app/mirrors/edit/[mirrorId]/cdc.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,13 +10,15 @@ import { Button } from '@/lib/Button';
import { Icon } from '@/lib/Icon';
import { Label } from '@/lib/Label';
import { ProgressBar } from '@/lib/ProgressBar';
import { ProgressCircle } from '@/lib/ProgressCircle';
import { SearchField } from '@/lib/SearchField';
import { Table, TableCell, TableRow } from '@/lib/Table';
import { Tab, TabGroup, TabList, TabPanel, TabPanels } from '@tremor/react';
import moment, { Duration, Moment } from 'moment';
import Link from 'next/link';
import { useEffect, useMemo, useState } from 'react';
import ReactSelect from 'react-select';
import { useLocalStorage } from 'usehooks-ts';
import CdcDetails from './cdcDetails';

class TableCloneSummary {
Expand Down Expand Up @@ -68,8 +70,11 @@ export const SnapshotStatusTable = ({ status }: SnapshotStatusProps) => {
const [searchQuery, setSearchQuery] = useState<string>('');
const [sortDir, setSortDir] = useState<'asc' | 'dsc'>('dsc');
const displayedRows = useMemo(() => {
const shownRows = allRows.filter((row: any) =>
row.tableName.toLowerCase().includes(searchQuery.toLowerCase())
const shownRows = allRows.filter(
(row: TableCloneSummary) =>
row.cloneTableSummary.tableName
?.toLowerCase()
.includes(searchQuery.toLowerCase())
);
shownRows.sort((a, b) => {
const aValue = a[sortField];
Expand Down Expand Up @@ -237,27 +242,29 @@ export function CDCMirror({
createdAt,
syncStatusChild,
}: CDCMirrorStatusProps) {
const [selectedTab, setSelectedTab] = useState(-1);
const LocalStorageTabKey = 'cdctab';

const [selectedTab, setSelectedTab] = useLocalStorage(LocalStorageTabKey, 0);
const [mounted, setMounted] = useState(false);
const handleTab = (index: number) => {
localStorage.setItem(LocalStorageTabKey, index.toString());
setSelectedTab(index);
};

let snapshot = <></>;
if (cdc.snapshotStatus) {
snapshot = <SnapshotStatusTable status={cdc.snapshotStatus} />;
}

useEffect(() => {
if (typeof window !== 'undefined') {
setSelectedTab(
parseInt(localStorage?.getItem(LocalStorageTabKey) ?? '0') | 0
);
}
setMounted(true);
}, []);

if (!mounted) {
return (
<div style={{ marginTop: '1rem' }}>
<Label>
<ProgressCircle variant='determinate_progress_circle' />
</Label>
</div>
);
}
return (
<TabGroup
index={selectedTab}
Expand Down
28 changes: 28 additions & 0 deletions ui/app/mirrors/edit/[mirrorId]/nomirror.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
import { Button } from '@/lib/Button';
import { Label } from '@/lib/Label';
import Link from 'next/link';

const NoMirror = () => {
return (
<div
style={{
display: 'flex',
flexDirection: 'column',
alignItems: 'center',
rowGap: '1rem',
justifyContent: 'center',
}}
>
<Label variant='title2'>Oops! </Label>
<Label as='label' style={{ fontSize: 18 }}>
We were unable to fetch details of this mirror. Please confirm if this
mirror exists.
</Label>
<Link href='/mirrors'>
<Button style={{ padding: '1rem' }}>Back to mirrors page</Button>
</Link>
</div>
);
};

export default NoMirror;
6 changes: 6 additions & 0 deletions ui/app/mirrors/edit/[mirrorId]/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import { LayoutMain } from '@/lib/Layout';
import { GetFlowHttpAddressFromEnv } from '@/rpc/http';
import { redirect } from 'next/navigation';
import { CDCMirror } from './cdc';
import NoMirror from './nomirror';
import SyncStatus from './syncStatus';

export const dynamic = 'force-dynamic';
Expand Down Expand Up @@ -54,6 +55,11 @@ export default async function EditMirror({
},
});

if (mirrorStatus.errorMessage) {
console.log(mirrorStatus.errorMessage);
return <NoMirror />;
}

let syncStatusChild = <></>;
if (mirrorStatus.cdcStatus) {
let rowsSynced = syncs.reduce((acc, sync) => acc + sync.rows_in_batch, 0);
Expand Down
1 change: 1 addition & 0 deletions ui/app/mirrors/edit/[mirrorId]/syncStatus.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@ export default async function SyncStatus({
orderBy: {
start_time: 'desc',
},
distinct: ['batch_id'],
});

const rows = syncs.map((sync) => ({
Expand Down
1 change: 0 additions & 1 deletion ui/app/mirrors/tables.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,6 @@ export function CDCFlows({ cdcFlows }: { cdcFlows: any }) {
}),
[searchQuery, cdcFlows]
);
const [isLoading, setIsLoading] = useState(false);

return (
<>
Expand Down
13 changes: 13 additions & 0 deletions ui/components/TimeComponent.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
'use client';
import { Label } from '@/lib/Label';
import { ProgressCircle } from '@/lib/ProgressCircle';
import moment from 'moment-timezone';
import { useEffect, useState } from 'react';
import { useLocalStorage } from 'usehooks-ts';

const TimeLabel = ({
Expand All @@ -11,6 +13,10 @@ const TimeLabel = ({
fontSize?: number;
}) => {
const [timezone] = useLocalStorage('timezone-ui', 'UTC'); // ['UTC', 'Local', 'Relative']
const [mounted, setMounted] = useState(false);
useEffect(() => {
setMounted(true);
}, []);
const formattedTimestamp = (zone: string) => {
switch (zone) {
case 'Local':
Expand All @@ -23,6 +29,13 @@ const TimeLabel = ({
return moment(timeVal).utc().format('YYYY-MM-DD HH:mm:ss');
}
};
if (!mounted) {
return (
<Label>
<ProgressCircle variant='determinate_progress_circle' />
</Label>
);
}
return (
<Label as='label' style={{ fontSize: fontSize }}>
{formattedTimestamp(timezone)}
Expand Down

0 comments on commit 2f0affd

Please sign in to comment.