diff --git a/apps/studio/components/interfaces/Storage/AnalyticsBuckets/AnalyticsBucketDetails/NamespaceWithTables/TableRowComponent.tsx b/apps/studio/components/interfaces/Storage/AnalyticsBuckets/AnalyticsBucketDetails/NamespaceWithTables/TableRowComponent.tsx index 56c4d3baf04..de7afe80426 100644 --- a/apps/studio/components/interfaces/Storage/AnalyticsBuckets/AnalyticsBucketDetails/NamespaceWithTables/TableRowComponent.tsx +++ b/apps/studio/components/interfaces/Storage/AnalyticsBuckets/AnalyticsBucketDetails/NamespaceWithTables/TableRowComponent.tsx @@ -20,6 +20,7 @@ import Link from 'next/link' import { useMemo, useState } from 'react' import { toast } from 'sonner' import { + Badge, Button, DropdownMenu, DropdownMenuContent, @@ -46,6 +47,8 @@ interface TableRowComponentProps { schema: string namespace: string isLoading?: boolean + pollIntervalNamespaceTables?: number + publicationTablesNotSyncedToNamespaceTables?: Array<{ schema: string; name: string }> } export const TableRowComponent = ({ @@ -53,6 +56,8 @@ export const TableRowComponent = ({ schema, namespace, isLoading, + pollIntervalNamespaceTables, + publicationTablesNotSyncedToNamespaceTables, }: TableRowComponentProps) => { const { ref: projectRef, bucketId } = useParams() const { data: project } = useSelectedProjectQuery() @@ -91,6 +96,24 @@ export const TableRowComponent = ({ const isPipelineRunning = pipelineStatus === 'started' const isReplicating = isTableUnderReplicationPublication && isPipelineRunning + // Check if this specific table is being waited on during polling + const isTableBeingWaitedOn = useMemo(() => { + if (!pollIntervalNamespaceTables || pollIntervalNamespaceTables === 0) return false + if (!publicationTablesNotSyncedToNamespaceTables) return false + + return publicationTablesNotSyncedToNamespaceTables.some( + (pubTable) => getNamespaceTableNameFromPostgresTableName(pubTable) === table.name + ) + }, [pollIntervalNamespaceTables, publicationTablesNotSyncedToNamespaceTables, table.name]) + + // Get the Postgres table that this namespace table is waiting for + const waitingForPostgresTable = useMemo(() => { + if (!isTableBeingWaitedOn || !publicationTablesNotSyncedToNamespaceTables) return null + return publicationTablesNotSyncedToNamespaceTables.find( + (pubTable) => getNamespaceTableNameFromPostgresTableName(pubTable) === table.name + ) + }, [isTableBeingWaitedOn, publicationTablesNotSyncedToNamespaceTables, table.name]) + // [Joshen] Considers both the replication pipeline status + if the table is in the replication publication const replicationStatusLabel = useMemo(() => { if (isLoading) return 'Checking' @@ -354,7 +377,28 @@ export const TableRowComponent = ({ ) : ( -

Waiting

+
+ {isTableBeingWaitedOn ? ( + + +
+ +

Connecting

+
+
+ {waitingForPostgresTable && ( + +

+ Waiting for analytics table to be created for:{' '} + {waitingForPostgresTable.schema}.{waitingForPostgresTable.name} +

+
+ )} +
+ ) : ( +

Waiting to be accepted

+ )} +
)} diff --git a/apps/studio/components/interfaces/Storage/AnalyticsBuckets/AnalyticsBucketDetails/NamespaceWithTables/index.tsx b/apps/studio/components/interfaces/Storage/AnalyticsBuckets/AnalyticsBucketDetails/NamespaceWithTables/index.tsx index cd7f4401abe..91265d8b24f 100644 --- a/apps/studio/components/interfaces/Storage/AnalyticsBuckets/AnalyticsBucketDetails/NamespaceWithTables/index.tsx +++ b/apps/studio/components/interfaces/Storage/AnalyticsBuckets/AnalyticsBucketDetails/NamespaceWithTables/index.tsx @@ -1,4 +1,3 @@ -import { Loader2 } from 'lucide-react' import { useEffect, useMemo, useState } from 'react' import { useParams } from 'common' @@ -12,7 +11,6 @@ import { useSelectedProjectQuery } from 'hooks/misc/useSelectedProject' import { Button, Card, - CardFooter, LoadingLine, Table, TableBody, @@ -20,9 +18,6 @@ import { TableHead, TableHeader, TableRow, - Tooltip, - TooltipContent, - TooltipTrigger, } from 'ui' import { Admonition } from 'ui-patterns/admonition' import { getNamespaceTableNameFromPostgresTableName } from '../AnalyticsBucketDetails.utils' @@ -226,39 +221,16 @@ export const NamespaceWithTables = ({ namespace={namespace} schema={displaySchema} isLoading={isImportingForeignSchema || isLoadingNamespaceTables} + pollIntervalNamespaceTables={pollIntervalNamespaceTables} + publicationTablesNotSyncedToNamespaceTables={ + publicationTablesNotSyncedToNamespaceTables + } /> )) )} - {pollIntervalNamespaceTables > 0 && ( - -
- - -
- -

- Connecting {publicationTablesNotSyncedToNamespaceTables.length} table - {publicationTablesNotSyncedToNamespaceTables.length > 1 ? 's' : ''} -

-
-
- -

Waiting for analytics table to be created for:

-
    - {publicationTablesNotSyncedToNamespaceTables.map((x) => { - const value = `${x.schema}.${x.name}` - return
  • {value}
  • - })} -
-
-
-
-
- )} -