External/signoz
1
0
Fork 0
mirror of https://github.com/SigNoz/signoz.git synced 2025-12-22 01:46:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: disable next page in child spans pagination if nextCursor is empty

Browse Source
This commit is contained in:
ahmadshaheer 2025-09-21 20:07:05 +04:30
parent 47e2687afe
commit c8f3ab667a
2 changed files with 21 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
frontend/src/container/SpanList/SpanTable.tsx
View File

@ -68,7 +68,12 @@ function SpanTable({
const [serviceSpansPagination, setServiceSpansPagination] = useState< const [serviceSpansPagination, setServiceSpansPagination] = useState<
Record< Record<
string, string,
{ currentPage: number; totalCount?: number; hasMorePages?: boolean } {
currentPage: number;
totalCount?: number;
hasMorePages?: boolean;
nextCursor?: string;
}
> >
>({}); >({});
@ -96,7 +101,7 @@ function SpanTable({
try { try {
const currentPage = 1; const currentPage = 1;
const offset = (currentPage - 1) * SERVICE_SPAN_PAGE_SIZE; const offset = (currentPage - 1) * SERVICE_SPAN_PAGE_SIZE;
const serviceSpans = await fetchServiceSpans( const { spans: serviceSpans, nextCursor } = await fetchServiceSpans(
traceId, traceId,
entrySpan.serviceName, entrySpan.serviceName,
SERVICE_SPAN_PAGE_SIZE, SERVICE_SPAN_PAGE_SIZE,
@ -108,12 +113,13 @@ function SpanTable({
isExpanded: true, isExpanded: true,
}; };
// Update hasMorePages based on response length // Update pagination with nextCursor
setServiceSpansPagination((prevPagination) => ({ setServiceSpansPagination((prevPagination) => ({
...prevPagination, ...prevPagination,
[spanId]: { [spanId]: {
...prevPagination[spanId], ...prevPagination[spanId],
hasMorePages: serviceSpans.length === SERVICE_SPAN_PAGE_SIZE, hasMorePages: serviceSpans.length === SERVICE_SPAN_PAGE_SIZE,
nextCursor,
}, },
})); }));
@ -148,20 +154,21 @@ function SpanTable({
try { try {
const offset = (newPage - 1) * SERVICE_SPAN_PAGE_SIZE; const offset = (newPage - 1) * SERVICE_SPAN_PAGE_SIZE;
const serviceSpans = await fetchServiceSpans( const { spans: serviceSpans, nextCursor } = await fetchServiceSpans(
traceId, traceId,
entrySpan.serviceName, entrySpan.serviceName,
SERVICE_SPAN_PAGE_SIZE, SERVICE_SPAN_PAGE_SIZE,
offset, offset,
); );
// Update hasMorePages based on response length // Update pagination with nextCursor
setServiceSpansPagination((prevPagination) => ({ setServiceSpansPagination((prevPagination) => ({
...prevPagination, ...prevPagination,
[entrySpanId]: { [entrySpanId]: {
...prevPagination[entrySpanId], ...prevPagination[entrySpanId],
currentPage: newPage, currentPage: newPage,
hasMorePages: serviceSpans.length === SERVICE_SPAN_PAGE_SIZE, hasMorePages: serviceSpans.length === SERVICE_SPAN_PAGE_SIZE,
nextCursor,
}, },
})); }));
@ -285,6 +292,7 @@ function SpanTable({
} }
handleCountItemsPerPageChange={(): void => {}} // Service spans use fixed page size handleCountItemsPerPageChange={(): void => {}} // Service spans use fixed page size
showSizeChanger={false} // Disable page size changer for service spans showSizeChanger={false} // Disable page size changer for service spans
nextCursor={pagination.nextCursor}
/> />
</div> </div>
); );

11
frontend/src/container/SpanList/utils.ts
View File

@ -41,7 +41,7 @@ export async function fetchServiceSpans(
serviceName: string, serviceName: string,
pageSize = 10, pageSize = 10,
offset = 0, offset = 0,
): Promise<SpanDataRow[]> { ): Promise<{ spans: SpanDataRow[]; nextCursor: string }> {
// Use the same payload structure as in SpanList component but with service-specific filter // Use the same payload structure as in SpanList component but with service-specific filter
const payload = initialQueriesMap.traces; const payload = initialQueriesMap.traces;
@ -121,12 +121,17 @@ export async function fetchServiceSpans(
// Extract spans from the API response using the same path as SpanList component // Extract spans from the API response using the same path as SpanList component
const spans = const spans =
response?.payload?.data?.newResult?.data?.result?.[0]?.list || []; response?.payload?.data?.newResult?.data?.result?.[0]?.list || [];
const nextCursor =
response?.payload?.data?.newResult?.data?.result?.[0]?.nextCursor || '';
// Transform the API response to SpanDataRow format if needed // Transform the API response to SpanDataRow format if needed
// The API should return the correct format for traces, but we'll handle any potential transformation // The API should return the correct format for traces, but we'll handle any potential transformation
return (spans as unknown) as SpanDataRow[]; return {
spans: (spans as unknown) as SpanDataRow[],
nextCursor,
};
} catch (error) { } catch (error) {
console.error('Failed to fetch service spans:', error); console.error('Failed to fetch service spans:', error);
return []; return { spans: [], nextCursor: '' };
} }
} }