fix(trace-details): make back button reliably return to previous in-app page (#11414)

* fix: back button issue

* chore: add unit test

* fix : test cases

---------

Co-authored-by: Gaurav Tewari <tewarig@users.noreply.github.com>

frontend/src/lib/history.ts

@@ -1,4 +1,15 @@
 import { createBrowserHistory } from 'history';
 import { getBasePath } from 'utils/basePath';
 
-export default createBrowserHistory({ basename: getBasePath() });
+const history = createBrowserHistory({ basename: getBasePath() });
+
+let inAppPushCount = 0;
+history.listen((_, action) => {
+	if (action === 'PUSH') {
+		inAppPushCount += 1;
+	}
+});
+
+export const hasInAppHistory = (): boolean => inAppPushCount > 0;
+
+export default history;

frontend/src/pages/TraceDetailsV3/TraceDetailsHeader/TraceDetailsHeader.tsx

@@ -16,7 +16,7 @@ import { LOCALSTORAGE } from 'constants/localStorage';
 import ROUTES from 'constants/routes';
 import { convertTimeToRelevantUnit } from 'container/TraceDetail/utils';
 import dayjs from 'dayjs';
-import history from 'lib/history';
+import history, { hasInAppHistory } from 'lib/history';
 import {
 	ArrowLeft,
 	CalendarClock,
@@ -96,13 +96,7 @@ function TraceDetailsHeader({
 	}, [traceID]);
 
 	const handlePreviousBtnClick = useCallback((): void => {
-		const isSpaNavigate =
-			document.referrer &&
-			// oxlint-disable-next-line signoz/no-raw-absolute-path
-			new URL(document.referrer).origin === window.location.origin;
-		const hasBackHistory = window.history.length > 1;
-
-		if (isSpaNavigate && hasBackHistory) {
+		if (hasInAppHistory()) {
 			history.goBack();
 		} else {
 			history.push(ROUTES.TRACES_EXPLORER);
@@ -130,6 +124,7 @@ function TraceDetailsHeader({
 							size="md"
 							className={styles.backBtn}
 							onClick={handlePreviousBtnClick}
+							aria-label="Back"
 						>
 							<ArrowLeft size={14} />
 						</Button>

frontend/src/pages/TraceDetailsV3/TraceDetailsHeader/__tests__/TraceDetailsHeader.test.tsx

@@ -0,0 +1,60 @@
+import { fireEvent, screen } from '@testing-library/react';
+import ROUTES from 'constants/routes';
+import { render } from 'tests/test-utils';
+
+import TraceDetailsHeader from '../TraceDetailsHeader';
+
+const mockGoBack = jest.fn();
+const mockPush = jest.fn();
+const mockHasInAppHistory = jest.fn();
+
+jest.mock('lib/history', () => ({
+	__esModule: true,
+	default: {
+		goBack: (): void => mockGoBack(),
+		push: (path: string): void => mockPush(path),
+		replace: jest.fn(),
+		location: { pathname: '/', search: '' },
+		listen: (): (() => void) => (): void => undefined,
+	},
+	hasInAppHistory: (): boolean => mockHasInAppHistory(),
+}));
+
+const baseProps = {
+	filterMetadata: {
+		startTime: 0,
+		endTime: 1,
+		traceId: 'trace-123',
+	},
+	onFilteredSpansChange: jest.fn(),
+	isDataLoaded: false,
+};
+
+describe('TraceDetailsHeader – back button', () => {
+	beforeEach(() => {
+		mockGoBack.mockClear();
+		mockPush.mockClear();
+		mockHasInAppHistory.mockReset();
+	});
+
+	it('calls history.goBack() when there is in-app SPA history', () => {
+		mockHasInAppHistory.mockReturnValue(true);
+		render(<TraceDetailsHeader {...baseProps} />);
+
+		fireEvent.click(screen.getByRole('button', { name: /back/i }));
+
+		expect(mockGoBack).toHaveBeenCalledTimes(1);
+		expect(mockPush).not.toHaveBeenCalled();
+	});
+
+	it('pushes to the traces explorer route when there is no in-app SPA history', () => {
+		mockHasInAppHistory.mockReturnValue(false);
+		render(<TraceDetailsHeader {...baseProps} />);
+
+		fireEvent.click(screen.getByRole('button', { name: /back/i }));
+
+		expect(mockPush).toHaveBeenCalledTimes(1);
+		expect(mockPush).toHaveBeenCalledWith(ROUTES.TRACES_EXPLORER);
+		expect(mockGoBack).not.toHaveBeenCalled();
+	});
+});