diff --git a/src/components/ShardsTable/columns.tsx b/src/components/ShardsTable/columns.tsx index dec0cd5fab..f555a0f4b0 100644 --- a/src/components/ShardsTable/columns.tsx +++ b/src/components/ShardsTable/columns.tsx @@ -19,8 +19,12 @@ export const getPathColumn: GetShardsColumn = ({schemaPath = ''}) => { name: TOP_SHARDS_COLUMNS_IDS.Path, header: TOP_SHARDS_COLUMNS_TITLES.Path, render: ({row}) => { - // row.Path - relative schema path - return {row.Path}; + // row.RelativePath - relative schema path + return ( + + {row.RelativePath} + + ); }, width: 300, }; @@ -43,7 +47,12 @@ export const getTabletIdColumn: GetShardsColumn = () => { if (!row.TabletId) { return EMPTY_DATA_PLACEHOLDER; } - return ; + return ( + + ); }, width: 220, }; diff --git a/src/components/TabletNameWrapper/TabletNameWrapper.tsx b/src/components/TabletNameWrapper/TabletNameWrapper.tsx index f3bf697c30..32e88134bc 100644 --- a/src/components/TabletNameWrapper/TabletNameWrapper.tsx +++ b/src/components/TabletNameWrapper/TabletNameWrapper.tsx @@ -11,13 +11,15 @@ import i18n from './i18n'; interface TabletNameWrapperProps { tabletId: string | number; + followerId?: string | number; database?: string; } -export function TabletNameWrapper({tabletId, database}: TabletNameWrapperProps) { +export function TabletNameWrapper({tabletId, followerId, database}: TabletNameWrapperProps) { const isUserAllowedToMakeChanges = useIsUserAllowedToMakeChanges(); - const tabletPath = getTabletPagePath(tabletId, {database}); + const tabletPath = getTabletPagePath(tabletId, {database, followerId: followerId?.toString()}); + const tabletName = `${tabletId}${followerId ? `.${followerId}` : ''}`; return ( (); - const [{database: queryDatabase, clusterName: queryClusterName}] = + const [{database: queryDatabase, clusterName: queryClusterName, followerId: queryFollowerId}] = useQueryParams(tabletPageQueryParams); const [autoRefreshInterval] = useAutoRefreshInterval(); const {currentData, isFetching, error} = tabletApi.useGetTabletQuery( - {id, database: queryDatabase ?? undefined}, + {id, database: queryDatabase ?? undefined, followerId: queryFollowerId ?? undefined}, {pollingInterval: autoRefreshInterval}, ); @@ -131,7 +131,9 @@ function TabletContent({ history: ITabletPreparedHistoryItem[]; }) { const isEmpty = !Object.keys(tablet).length; - const {Overall, HiveId} = tablet; + const {Overall, HiveId, FollowerId} = tablet; + + const tabletName = `${id}${FollowerId ? `.${FollowerId}` : ''}`; return ( diff --git a/src/containers/Tablets/TabletsTable.tsx b/src/containers/Tablets/TabletsTable.tsx index 3552f6375e..c7e92e7abd 100644 --- a/src/containers/Tablets/TabletsTable.tsx +++ b/src/containers/Tablets/TabletsTable.tsx @@ -53,7 +53,13 @@ function getColumns({database}: {database?: string}) { return EMPTY_DATA_PLACEHOLDER; } - return ; + return ( + + ); }, }, { diff --git a/src/routes.ts b/src/routes.ts index 056043b7b6..b28707d187 100644 --- a/src/routes.ts +++ b/src/routes.ts @@ -124,6 +124,7 @@ export const tabletPageQueryParams = { database: StringParam, clusterName: StringParam, activeTab: StringParam, + followerId: StringParam, } as const; type TabletPageQuery = QueryParamsTypeFromQueryObject; diff --git a/src/store/reducers/shardsWorkload/shardsWorkload.ts b/src/store/reducers/shardsWorkload/shardsWorkload.ts index 0f6230037d..9640fe438a 100644 --- a/src/store/reducers/shardsWorkload/shardsWorkload.ts +++ b/src/store/reducers/shardsWorkload/shardsWorkload.ts @@ -70,18 +70,14 @@ LIMIT 20`; } function createShardQueryImmediate(path: string, database: string, sortOrder?: SortOrder[]) { - const pathSelect = `CAST(SUBSTRING(CAST(Path AS String), ${database.length}) AS Utf8) AS Path`; + const pathSelect = `CAST(SUBSTRING(CAST(Path AS String), ${database.length}) AS Utf8) AS RelativePath`; const orderBy = prepareOrderByFromTableSort(sortOrder); return `${QUERY_TECHNICAL_MARK} SELECT ${pathSelect}, - TabletId, - CPUCores, - DataSize, - NodeId, - InFlightTxCount + \`.sys/partition_stats\`.* FROM \`.sys/partition_stats\` WHERE Path='${path}' diff --git a/src/store/reducers/tablet.ts b/src/store/reducers/tablet.ts index 2e8f099be0..b0a332fee8 100644 --- a/src/store/reducers/tablet.ts +++ b/src/store/reducers/tablet.ts @@ -8,7 +8,11 @@ export const tabletApi = api.injectEndpoints({ endpoints: (build) => ({ getTablet: build.query({ queryFn: async ( - {id, database}: {id: string; database?: string; nodeId?: string}, + { + id, + database, + followerId, + }: {id: string; database?: string; nodeId?: string; followerId?: string}, {signal}, ) => { try { @@ -50,8 +54,12 @@ export const tabletApi = api.injectEndpoints({ }, []); const {TabletStateInfo = []} = tabletResponseData; - const [tabletData = {}] = TabletStateInfo; - const {TabletId} = tabletData; + const tabletData = + followerId === undefined + ? TabletStateInfo.find((t) => t.Leader) + : TabletStateInfo.find((t) => t.FollowerId?.toString() === followerId); + + const {TabletId} = tabletData || {}; return {data: {id: TabletId, data: tabletData, history: historyData}}; } catch (error) {