chore: added modulewrapper for jests

frontend/jest.config.ts

@@ -11,6 +11,7 @@ const config: Config.InitialOptions = {
 	moduleFileExtensions: ['ts', 'tsx', 'js', 'json'],
 	modulePathIgnorePatterns: ['dist'],
 	moduleNameMapper: {
+		'^@/(.*)$': '<rootDir>/src/$1',
 		'\\.(css|less|scss)$': '<rootDir>/__mocks__/cssMock.ts',
 		'\\.md$': '<rootDir>/__mocks__/cssMock.ts',
 		'^uplot$': '<rootDir>/__mocks__/uplotMock.ts',

frontend/src/api/trace/getTraceV3.tsx

@@ -1,44 +0,0 @@
-import { ApiV3Instance as axios } from 'api';
-import { omit } from 'lodash-es';
-import { ErrorResponse, SuccessResponse } from 'types/api';
-import {
-	GetTraceV3PayloadProps,
-	GetTraceV3SuccessResponse,
-} from 'types/api/trace/getTraceV3';
-
-const getTraceV3 = async (
-	props: GetTraceV3PayloadProps,
-): Promise<SuccessResponse<GetTraceV3SuccessResponse> | ErrorResponse> => {
-	let uncollapsedSpans = [...props.uncollapsedSpans];
-	if (!props.isSelectedSpanIDUnCollapsed) {
-		uncollapsedSpans = uncollapsedSpans.filter(
-			(node) => node !== props.selectedSpanId,
-		);
-	}
-	const postData: GetTraceV3PayloadProps = {
-		...props,
-		uncollapsedSpans,
-	};
-	const response = await axios.post<GetTraceV3SuccessResponse>(
-		`/traces/${props.traceId}/waterfall`,
-		omit(postData, 'traceId'),
-	);
-
-	// V3 API wraps response in { status, data }
-	const rawPayload = (response.data as any).data || response.data;
-
-	// Derive serviceName from resources for backward compatibility
-	const spans = (rawPayload.spans || []).map((span: any) => ({
-		...span,
-		serviceName: span.serviceName || span.resources?.['service.name'] || '',
-	}));
-
-	return {
-		statusCode: 200,
-		error: null,
-		message: 'Success',
-		payload: { ...rawPayload, spans },
-	};
-};
-
-export default getTraceV3;

frontend/src/constants/localStorage.ts

@@ -37,5 +37,4 @@ export enum LOCALSTORAGE {
 	SHOW_FREQUENCY_CHART = 'SHOW_FREQUENCY_CHART',
 	DISSMISSED_COST_METER_INFO = 'DISMISSED_COST_METER_INFO',
 	DISMISSED_API_KEYS_DEPRECATION_BANNER = 'DISMISSED_API_KEYS_DEPRECATION_BANNER',
-	TRACE_DETAILS_SPAN_DETAILS_POSITION = 'TRACE_DETAILS_SPAN_DETAILS_POSITION',
 }

frontend/src/constants/reactQueryKeys.ts

@@ -32,7 +32,6 @@ export const REACT_QUERY_KEY = {
 	UPDATE_ALERT_RULE: 'UPDATE_ALERT_RULE',
 	GET_ACTIVE_LICENSE_V3: 'GET_ACTIVE_LICENSE_V3',
 	GET_TRACE_V2_WATERFALL: 'GET_TRACE_V2_WATERFALL',
-	GET_TRACE_V3_WATERFALL: 'GET_TRACE_V3_WATERFALL',
 	GET_TRACE_V2_FLAMEGRAPH: 'GET_TRACE_V2_FLAMEGRAPH',
 	GET_POD_LIST: 'GET_POD_LIST',
 	GET_NODE_LIST: 'GET_NODE_LIST',

frontend/src/hooks/trace/useCopySpanLink.ts

@@ -1,7 +1,7 @@
 import { MouseEventHandler, useCallback } from 'react';
 import { useLocation } from 'react-router-dom';
 import { useCopyToClipboard } from 'react-use';
-import { toast } from '@signozhq/sonner';
+import { useNotifications } from 'hooks/useNotifications';
 import useUrlQuery from 'hooks/useUrlQuery';
 import { Span } from 'types/api/trace/getTraceV2';
 
@@ -11,6 +11,7 @@ export const useCopySpanLink = (
 	const urlQuery = useUrlQuery();
 	const { pathname } = useLocation();
 	const [, setCopy] = useCopyToClipboard();
+	const { notifications } = useNotifications();
 
 	const onSpanCopy: MouseEventHandler<HTMLElement> = useCallback(
 		(event) => {
@@ -30,12 +31,11 @@ export const useCopySpanLink = (
 			const link = `${window.location.origin}${pathname}?${urlQuery.toString()}`;
 
 			setCopy(link);
-			toast.success('Copied to clipboard', {
-				richColors: true,
-				position: 'top-right',
+			notifications.success({
+				message: 'Copied to clipboard',
 			});
 		},
-		[span, urlQuery, pathname, setCopy],
+		[span, urlQuery, pathname, setCopy, notifications],
 	);
 
 	return {

frontend/src/hooks/trace/useGetTraceV3.tsx

@@ -1,29 +0,0 @@
-import { useQuery, UseQueryResult } from 'react-query';
-import getTraceV3 from 'api/trace/getTraceV3';
-import { REACT_QUERY_KEY } from 'constants/reactQueryKeys';
-import { ErrorResponse, SuccessResponse } from 'types/api';
-import {
-	GetTraceV3PayloadProps,
-	GetTraceV3SuccessResponse,
-} from 'types/api/trace/getTraceV3';
-
-const useGetTraceV3 = (props: GetTraceV3PayloadProps): UseTraceV3 =>
-	useQuery({
-		queryFn: () => getTraceV3(props),
-		queryKey: [
-			REACT_QUERY_KEY.GET_TRACE_V3_WATERFALL,
-			props.traceId,
-			props.selectedSpanId,
-			props.isSelectedSpanIDUnCollapsed,
-		],
-		enabled: !!props.traceId,
-		keepPreviousData: true,
-		refetchOnWindowFocus: false,
-	});
-
-type UseTraceV3 = UseQueryResult<
-	SuccessResponse<GetTraceV3SuccessResponse> | ErrorResponse,
-	unknown
->;
-
-export default useGetTraceV3;

frontend/src/types/api/trace/getTraceFlamegraph.ts

@@ -4,8 +4,7 @@ export interface TraceDetailFlamegraphURLProps {
 
 export interface GetTraceFlamegraphPayloadProps {
 	traceId: string;
-	selectedSpanId?: string;
-	limit?: number;
+	selectedSpanId: string;
 }
 
 export interface Event {

frontend/src/types/api/trace/getTraceV2.ts

@@ -37,23 +37,6 @@ export interface Span {
 	hasSibling: boolean;
 	subTreeNodeCount: number;
 	level: number;
-	// V2 API format fields
-	attributes_string?: Record<string, string>;
-	attributes_number?: Record<string, number>;
-	attributes_bool?: Record<string, boolean>;
-	resources_string?: Record<string, string>;
-	// V3 API format fields
-	attributes?: Record<string, string>;
-	resources?: Record<string, string>;
-	http_method?: string;
-	http_url?: string;
-	http_host?: string;
-	db_name?: string;
-	db_operation?: string;
-	external_http_method?: string;
-	external_http_url?: string;
-	response_status_code?: string;
-	is_remote?: string;
 }
 
 export interface GetTraceV2SuccessResponse {

frontend/src/types/api/trace/getTraceV3.ts

@@ -1,14 +0,0 @@
-export interface GetTraceV3PayloadProps {
-	traceId: string;
-	selectedSpanId: string;
-	uncollapsedSpans: string[];
-	isSelectedSpanIDUnCollapsed: boolean;
-}
-
-// Re-export shared types from V2 until V3 response diverges
-export type {
-	Event,
-	GetTraceV2SuccessResponse as GetTraceV3SuccessResponse,
-	Span,
-	TraceDetailV2URLProps as TraceDetailV3URLProps,
-} from './getTraceV2';

frontend/tsconfig.json

@@ -12,7 +12,11 @@
 		"esModuleInterop": true,
 		"skipLibCheck": true,
 		"forceConsistentCasingInFileNames": true,
-		"lib": ["dom", "dom.iterable", "esnext"],
+		"lib": [
+			"dom",
+			"dom.iterable",
+			"esnext"
+		],
 		"allowSyntheticDefaultImports": true,
 		"noFallthroughCasesInSwitch": true,
 		"moduleResolution": "bundler",
@@ -21,8 +25,15 @@
 		"noEmit": true,
 		"baseUrl": "./src",
 		"paths": {
-			"*": ["./*"],
-			"@constants/*": ["./container/OnboardingContainer/constants/*"]
+			"*": [
+				"./*"
+			],
+			"@constants/*": [
+				"./container/OnboardingContainer/constants/*"
+			],
+			"@/*": [
+				"./*"
+			]
 		},
 		"downlevelIteration": true,
 		"plugins": [
@@ -30,9 +41,18 @@
 				"name": "typescript-plugin-css-modules"
 			}
 		],
-		"types": ["vite/client", "node", "jest"]
+		"types": [
+			"vite/client",
+			"node",
+			"jest"
+		]
 	},
-	"exclude": ["node_modules", "src/parser/*.ts", "src/parser/TraceOperatorParser/*.ts", "orval.config.ts"],
+	"exclude": [
+		"node_modules",
+		"src/parser/*.ts",
+		"src/parser/TraceOperatorParser/*.ts",
+		"orval.config.ts"
+	],
 	"include": [
 		"./src",
 		"./src/**/*.ts",

frontend/vite.config.ts

@@ -83,6 +83,7 @@ export default defineConfig(
 			plugins,
 			resolve: {
 				alias: {
+					'@': resolve(__dirname, './src'),
 					utils: resolve(__dirname, './src/utils'),
 					types: resolve(__dirname, './src/types'),
 					constants: resolve(__dirname, './src/constants'),