Merge branch 'main' into base-path-config

docs/contributing/onboarding.md

@@ -7,12 +7,12 @@ This guide explains how to add new data sources to the SigNoz onboarding flow. T
 The configuration is located at:
 
 ```
-frontend/src/container/OnboardingV2Container/onboarding-configs/onboarding-config-with-links.ts
+frontend/src/container/OnboardingV2Container/onboarding-configs/onboarding-config-with-links.json
 ```
 
-## Structure Overview
+## JSON Structure Overview
 
-The configuration file exports a TypeScript array (`onboardingConfigWithLinks`) containing data source objects. Each object represents a selectable option in the onboarding flow. SVG logos are imported as ES modules at the top of the file.
+The configuration file is a JSON array containing data source objects. Each object represents a selectable option in the onboarding flow.
 
 ## Data Source Object Keys
 
@@ -24,7 +24,7 @@ The configuration file exports a TypeScript array (`onboardingConfigWithLinks`)
 | `label` | `string` | Display name shown to users (e.g., `"AWS EC2"`) |
 | `tags` | `string[]` | Array of category tags for grouping (e.g., `["AWS"]`, `["database"]`) |
 | `module` | `string` | Destination module after onboarding completion |
-| `imgUrl` | `string` | Imported SVG URL **(SVG required)** (e.g., `import ec2Url from '@/assets/Logos/ec2.svg'`, then use `ec2Url`) |
+| `imgUrl` | `string` | Path to the logo/icon **(SVG required)** (e.g., `"/Logos/ec2.svg"`) |
 
 ### Optional Keys
 
@@ -57,34 +57,36 @@ The `module` key determines where users are redirected after completing onboardi
 
 The `question` object enables multi-step selection flows:
 
-```ts
-question: {
-  desc: 'What would you like to monitor?',
-  type: 'select',
-  helpText: 'Choose the telemetry type you want to collect.',
-  helpLink: '/docs/azure-monitoring/overview/',
-  helpLinkText: 'Read the guide →',
-  options: [
-    {
-      key: 'logging',
-      label: 'Logs',
-      imgUrl: azureVmUrl,
-      link: '/docs/azure-monitoring/app-service/logging/',
-    },
-    {
-      key: 'metrics',
-      label: 'Metrics',
-      imgUrl: azureVmUrl,
-      link: '/docs/azure-monitoring/app-service/metrics/',
-    },
-    {
-      key: 'tracing',
-      label: 'Traces',
-      imgUrl: azureVmUrl,
-      link: '/docs/azure-monitoring/app-service/tracing/',
-    },
-  ],
-},
+```json
+{
+  "question": {
+    "desc": "What would you like to monitor?",
+    "type": "select",
+    "helpText": "Choose the telemetry type you want to collect.",
+    "helpLink": "/docs/azure-monitoring/overview/",
+    "helpLinkText": "Read the guide →",
+    "options": [
+        {
+            "key": "logging",
+            "label": "Logs",
+            "imgUrl": "/Logos/azure-vm.svg",
+            "link": "/docs/azure-monitoring/app-service/logging/"
+        },
+        {
+            "key": "metrics",
+            "label": "Metrics",
+            "imgUrl": "/Logos/azure-vm.svg",
+            "link": "/docs/azure-monitoring/app-service/metrics/"
+        },
+        {
+            "key": "tracing",
+            "label": "Traces",
+            "imgUrl": "/Logos/azure-vm.svg",
+            "link": "/docs/azure-monitoring/app-service/tracing/"
+        }
+    ]
+  }
+}
 ```
 
 ### Question Keys
@@ -104,161 +106,152 @@ Options can be simple (direct link) or nested (with another question):
 
 ### Simple Option (Direct Link)
 
-```ts
+```json
 {
-  key: 'aws-ec2-logs',
-  label: 'Logs',
-  imgUrl: ec2Url,
-  link: '/docs/userguide/collect_logs_from_file/',
-},
+  "key": "aws-ec2-logs",
+  "label": "Logs",
+  "imgUrl": "/Logos/ec2.svg",
+  "link": "/docs/userguide/collect_logs_from_file/"
+}
 ```
 
 ### Option with Internal Redirect
 
-```ts
+```json
 {
-  key: 'aws-ec2-metrics-one-click',
-  label: 'One Click AWS',
-  imgUrl: ec2Url,
-  link: '/integrations?integration=aws-integration&service=ec2',
-  internalRedirect: true,
-},
+  "key": "aws-ec2-metrics-one-click",
+  "label": "One Click AWS",
+  "imgUrl": "/Logos/ec2.svg",
+  "link": "/integrations?integration=aws-integration&service=ec2",
+  "internalRedirect": true
+}
 ```
 
 > **Important**: Set `internalRedirect: true` only for internal app routes (like `/integrations?...`). Docs links should NOT have this flag.
 
 ### Nested Option (Multi-step Flow)
 
-```ts
+```json
 {
-  key: 'aws-ec2-metrics',
-  label: 'Metrics',
-  imgUrl: ec2Url,
-  question: {
-    desc: 'How would you like to set up monitoring?',
-    helpText: 'Choose your setup method.',
-    options: [...],
-  },
-},
+  "key": "aws-ec2-metrics",
+  "label": "Metrics",
+  "imgUrl": "/Logos/ec2.svg",
+  "question": {
+    "desc": "How would you like to set up monitoring?",
+    "helpText": "Choose your setup method.",
+    "options": [...]
+  }
+}
 ```
 
 ## Examples
 
 ### Simple Data Source (Direct Link)
 
-```ts
-import elbUrl from '@/assets/Logos/elb.svg';
-
-// inside the onboardingConfigWithLinks array:
+```json
 {
-  dataSource: 'aws-elb',
-  label: 'AWS ELB',
-  tags: ['AWS'],
-  module: 'logs',
-  relatedSearchKeywords: [
-    'aws',
-    'aws elb',
-    'elb logs',
-    'elastic load balancer',
+  "dataSource": "aws-elb",
+  "label": "AWS ELB",
+  "tags": ["AWS"],
+  "module": "logs",
+  "relatedSearchKeywords": [
+    "aws",
+    "aws elb",
+    "elb logs",
+    "elastic load balancer"
   ],
-  imgUrl: elbUrl,
-  link: '/docs/aws-monitoring/elb/',
-},
+  "imgUrl": "/Logos/elb.svg",
+  "link": "/docs/aws-monitoring/elb/"
+}
 ```
 
 ### Data Source with Single Question Level
 
-```ts
-import azureVmUrl from '@/assets/Logos/azure-vm.svg';
-
-// inside the onboardingConfigWithLinks array:
+```json
 {
-  dataSource: 'app-service',
-  label: 'App Service',
-  imgUrl: azureVmUrl,
-  tags: ['Azure'],
-  module: 'apm',
-  relatedSearchKeywords: ['azure', 'app service'],
-  question: {
-    desc: 'What telemetry data do you want to visualise?',
-    type: 'select',
-    options: [
+  "dataSource": "app-service",
+  "label": "App Service",
+  "imgUrl": "/Logos/azure-vm.svg",
+  "tags": ["Azure"],
+  "module": "apm",
+  "relatedSearchKeywords": ["azure", "app service"],
+  "question": {
+    "desc": "What telemetry data do you want to visualise?",
+    "type": "select",
+    "options": [
       {
-        key: 'logging',
-        label: 'Logs',
-        imgUrl: azureVmUrl,
-        link: '/docs/azure-monitoring/app-service/logging/',
+        "key": "logging",
+        "label": "Logs",
+        "imgUrl": "/Logos/azure-vm.svg",
+        "link": "/docs/azure-monitoring/app-service/logging/"
       },
       {
-        key: 'metrics',
-        label: 'Metrics',
-        imgUrl: azureVmUrl,
-        link: '/docs/azure-monitoring/app-service/metrics/',
+        "key": "metrics",
+        "label": "Metrics",
+        "imgUrl": "/Logos/azure-vm.svg",
+        "link": "/docs/azure-monitoring/app-service/metrics/"
       },
       {
-        key: 'tracing',
-        label: 'Traces',
-        imgUrl: azureVmUrl,
-        link: '/docs/azure-monitoring/app-service/tracing/',
-      },
-    ],
-  },
-},
+        "key": "tracing",
+        "label": "Traces",
+        "imgUrl": "/Logos/azure-vm.svg",
+        "link": "/docs/azure-monitoring/app-service/tracing/"
+      }
+    ]
+  }
+}
 ```
 
 ### Data Source with Nested Questions (2-3 Levels)
 
-```ts
-import ec2Url from '@/assets/Logos/ec2.svg';
-
-// inside the onboardingConfigWithLinks array:
+```json
 {
-  dataSource: 'aws-ec2',
-  label: 'AWS EC2',
-  tags: ['AWS'],
-  module: 'logs',
-  relatedSearchKeywords: ['aws', 'aws ec2', 'ec2 logs', 'ec2 metrics'],
-  imgUrl: ec2Url,
-  question: {
-    desc: 'What would you like to monitor for AWS EC2?',
-    type: 'select',
-    helpText: 'Choose the type of telemetry data you want to collect.',
-    options: [
+  "dataSource": "aws-ec2",
+  "label": "AWS EC2",
+  "tags": ["AWS"],
+  "module": "logs",
+  "relatedSearchKeywords": ["aws", "aws ec2", "ec2 logs", "ec2 metrics"],
+  "imgUrl": "/Logos/ec2.svg",
+  "question": {
+    "desc": "What would you like to monitor for AWS EC2?",
+    "type": "select",
+    "helpText": "Choose the type of telemetry data you want to collect.",
+    "options": [
       {
-        key: 'aws-ec2-logs',
-        label: 'Logs',
-        imgUrl: ec2Url,
-        link: '/docs/userguide/collect_logs_from_file/',
+        "key": "aws-ec2-logs",
+        "label": "Logs",
+        "imgUrl": "/Logos/ec2.svg",
+        "link": "/docs/userguide/collect_logs_from_file/"
       },
       {
-        key: 'aws-ec2-metrics',
-        label: 'Metrics',
-        imgUrl: ec2Url,
-        question: {
-          desc: 'How would you like to set up EC2 Metrics monitoring?',
-          helpText: 'One Click uses AWS CloudWatch integration. Manual setup uses OpenTelemetry.',
-          helpLink: '/docs/aws-monitoring/one-click-vs-manual/',
-          helpLinkText: 'Read the comparison guide →',
-          options: [
+        "key": "aws-ec2-metrics",
+        "label": "Metrics",
+        "imgUrl": "/Logos/ec2.svg",
+        "question": {
+          "desc": "How would you like to set up EC2 Metrics monitoring?",
+          "helpText": "One Click uses AWS CloudWatch integration. Manual setup uses OpenTelemetry.",
+          "helpLink": "/docs/aws-monitoring/one-click-vs-manual/",
+          "helpLinkText": "Read the comparison guide →",
+          "options": [
             {
-              key: 'aws-ec2-metrics-one-click',
-              label: 'One Click AWS',
-              imgUrl: ec2Url,
-              link: '/integrations?integration=aws-integration&service=ec2',
-              internalRedirect: true,
+              "key": "aws-ec2-metrics-one-click",
+              "label": "One Click AWS",
+              "imgUrl": "/Logos/ec2.svg",
+              "link": "/integrations?integration=aws-integration&service=ec2",
+              "internalRedirect": true
             },
             {
-              key: 'aws-ec2-metrics-manual',
-              label: 'Manual Setup',
-              imgUrl: ec2Url,
-              link: '/docs/tutorial/opentelemetry-binary-usage-in-virtual-machine/',
-            },
-          ],
-        },
-      },
-    ],
-  },
-},
+              "key": "aws-ec2-metrics-manual",
+              "label": "Manual Setup",
+              "imgUrl": "/Logos/ec2.svg",
+              "link": "/docs/tutorial/opentelemetry-binary-usage-in-virtual-machine/"
+            }
+          ]
+        }
+      }
+    ]
+  }
+}
 ```
 
 ## Best Practices
@@ -277,16 +270,11 @@ import ec2Url from '@/assets/Logos/ec2.svg';
 
 ### 3. Logos
 
-- Place logo files in `src/assets/Logos/`
+- Place logo files in `public/Logos/`
 - Use SVG format
-- Import the SVG at the top of the file and reference the imported variable:
-  ```ts
-  import myServiceUrl from '@/assets/Logos/my-service.svg';
-  // then in the config object:
-  imgUrl: myServiceUrl,
-  ```
+- Reference as `"/Logos/your-logo.svg"`
 - **Fetching Icons**: New icons can be easily fetched from [OpenBrand](https://openbrand.sh/). Use the pattern `https://openbrand.sh/?url=<TARGET_URL>`, where `<TARGET_URL>` is the URL-encoded link to the service's website. For example, to get Render's logo, use [https://openbrand.sh/?url=https%3A%2F%2Frender.com](https://openbrand.sh/?url=https%3A%2F%2Frender.com).
-- **Optimize new SVGs**: Run any newly downloaded SVGs through an optimizer like [SVGOMG (svgo)](https://svgomg.net/) or use `npx svgo src/assets/Logos/your-logo.svg` to minimise their size before committing.
+- **Optimize new SVGs**: Run any newly downloaded SVGs through an optimizer like [SVGOMG (svgo)](https://svgomg.net/) or use `npx svgo public/Logos/your-logo.svg` to minimise their size before committing.
 
 ### 4. Links
 
@@ -302,8 +290,8 @@ import ec2Url from '@/assets/Logos/ec2.svg';
 
 ## Adding a New Data Source
 
-1. Add the logo SVG to `src/assets/Logos/` and add a top-level import in the config file (e.g., `import myServiceUrl from '@/assets/Logos/my-service.svg'`)
-2. Add your data source object to the `onboardingConfigWithLinks` array, referencing the imported variable for `imgUrl`
+1. Add your data source object to the JSON array
+2. Ensure the logo exists in `public/Logos/`
 3. Test the flow locally with `yarn dev`
 4. Validation:
    - Navigate to the [onboarding page](http://localhost:3301/get-started-with-signoz-cloud) on your local machine

frontend/.gitignore

@@ -28,4 +28,7 @@ e2e/test-plan/saved-views/
 e2e/test-plan/service-map/
 e2e/test-plan/services/
 e2e/test-plan/traces/
-e2e/test-plan/user-preferences/
+e2e/test-plan/user-preferences/
+
+# Generated by `vite build` — do not commit
+index.html.gotmpl

frontend/index.html

@@ -2,6 +2,7 @@
 <html lang="en">
 	<head>
 		<meta charset="utf-8" />
+		<base href="[[.BasePath]]" />
 		<meta
 			http-equiv="Cache-Control"
 			content="no-cache, no-store, must-revalidate, max-age: 0"
@@ -59,7 +60,7 @@
 		<meta data-react-helmet="true" name="docusaurus_locale" content="en" />
 		<meta data-react-helmet="true" name="docusaurus_tag" content="default" />
 		<meta name="robots" content="noindex" />
-		<link data-react-helmet="true" rel="shortcut icon" href="/favicon.ico" />
+		<link data-react-helmet="true" rel="shortcut icon" href="favicon.ico" />
 	</head>
 	<body data-theme="default">
 		<noscript>You need to enable JavaScript to run this app.</noscript>
@@ -113,7 +114,7 @@
 				})(document, 'script');
 			}
 		</script>
-		<link rel="stylesheet" href="/css/uPlot.min.css" />
+		<link rel="stylesheet" href="css/uPlot.min.css" />
 		<script type="module" src="./src/index.tsx"></script>
 	</body>
 </html>

frontend/src/api/generatedAPIInstance.ts

@@ -1,5 +1,6 @@
 import {
 	interceptorRejected,
+	interceptorsRequestBasePath,
 	interceptorsRequestResponse,
 	interceptorsResponse,
 } from 'api';
@@ -17,6 +18,7 @@ export const GeneratedAPIInstance = <T>(
 	return generatedAPIAxiosInstance({ ...config }).then(({ data }) => data);
 };
 
+generatedAPIAxiosInstance.interceptors.request.use(interceptorsRequestBasePath);
 generatedAPIAxiosInstance.interceptors.request.use(interceptorsRequestResponse);
 generatedAPIAxiosInstance.interceptors.response.use(
 	interceptorsResponse,

frontend/src/api/index.ts

@@ -11,6 +11,7 @@ import axios, {
 import { ENVIRONMENT } from 'constants/env';
 import { Events } from 'constants/events';
 import { LOCALSTORAGE } from 'constants/localStorage';
+import { getBasePath } from 'utils/getBasePath';
 import { eventEmitter } from 'utils/getEventEmitter';
 
 import apiV1, { apiAlertManager, apiV2, apiV3, apiV4, apiV5 } from './apiV1';
@@ -67,6 +68,28 @@ export const interceptorsRequestResponse = (
 	return value;
 };
 
+// Prepends the runtime base path to outgoing requests so API calls work under
+// a URL prefix (e.g. /signoz/api/v1/…). No-op for root deployments and dev
+// (dev baseURL is a full http:// URL, not an absolute path).
+export const interceptorsRequestBasePath = (
+	value: InternalAxiosRequestConfig,
+): InternalAxiosRequestConfig => {
+	const basePath = getBasePath();
+	if (basePath === '/') {
+		return value;
+	}
+
+	if (value.baseURL?.startsWith('/')) {
+		// Named instances: baseURL='/api/v1/' → '/signoz/api/v1/'
+		value.baseURL = basePath + value.baseURL.slice(1);
+	} else if (!value.baseURL && value.url?.startsWith('/')) {
+		// Generated instance: baseURL is '' in prod, path is in url
+		value.url = basePath + value.url.slice(1);
+	}
+
+	return value;
+};
+
 export const interceptorRejected = async (
 	value: AxiosResponse<any>,
 ): Promise<AxiosResponse<any>> => {
@@ -133,6 +156,7 @@ const instance = axios.create({
 });
 
 instance.interceptors.request.use(interceptorsRequestResponse);
+instance.interceptors.request.use(interceptorsRequestBasePath);
 instance.interceptors.response.use(interceptorsResponse, interceptorRejected);
 
 export const AxiosAlertManagerInstance = axios.create({
@@ -147,6 +171,7 @@ ApiV2Instance.interceptors.response.use(
 	interceptorRejected,
 );
 ApiV2Instance.interceptors.request.use(interceptorsRequestResponse);
+ApiV2Instance.interceptors.request.use(interceptorsRequestBasePath);
 
 // axios V3
 export const ApiV3Instance = axios.create({
@@ -158,6 +183,7 @@ ApiV3Instance.interceptors.response.use(
 	interceptorRejected,
 );
 ApiV3Instance.interceptors.request.use(interceptorsRequestResponse);
+ApiV3Instance.interceptors.request.use(interceptorsRequestBasePath);
 //
 
 // axios V4
@@ -170,6 +196,7 @@ ApiV4Instance.interceptors.response.use(
 	interceptorRejected,
 );
 ApiV4Instance.interceptors.request.use(interceptorsRequestResponse);
+ApiV4Instance.interceptors.request.use(interceptorsRequestBasePath);
 //
 
 // axios V5
@@ -182,6 +209,7 @@ ApiV5Instance.interceptors.response.use(
 	interceptorRejected,
 );
 ApiV5Instance.interceptors.request.use(interceptorsRequestResponse);
+ApiV5Instance.interceptors.request.use(interceptorsRequestBasePath);
 //
 
 // axios Base
@@ -194,6 +222,7 @@ LogEventAxiosInstance.interceptors.response.use(
 	interceptorRejectedBase,
 );
 LogEventAxiosInstance.interceptors.request.use(interceptorsRequestResponse);
+LogEventAxiosInstance.interceptors.request.use(interceptorsRequestBasePath);
 //
 
 AxiosAlertManagerInstance.interceptors.response.use(
@@ -201,6 +230,7 @@ AxiosAlertManagerInstance.interceptors.response.use(
 	interceptorRejected,
 );
 AxiosAlertManagerInstance.interceptors.request.use(interceptorsRequestResponse);
+AxiosAlertManagerInstance.interceptors.request.use(interceptorsRequestBasePath);
 
 export { apiV1 };
 export default instance;

frontend/src/constants/reactQueryKeys.ts

@@ -25,8 +25,7 @@ export const REACT_QUERY_KEY = {
 	ALERT_RULE_TIMELINE_GRAPH: 'ALERT_RULE_TIMELINE_GRAPH',
 	GET_CONSUMER_LAG_DETAILS: 'GET_CONSUMER_LAG_DETAILS',
 	TOGGLE_ALERT_STATE: 'TOGGLE_ALERT_STATE',
-	GET_ALL_ALERTS: 'GET_ALL_ALERTS',
-	ALERT_RULES_CHART_PREVIEW: 'ALERT_RULES_CHART_PREVIEW',
+	GET_ALL_ALLERTS: 'GET_ALL_ALLERTS',
 	REMOVE_ALERT_RULE: 'REMOVE_ALERT_RULE',
 	DUPLICATE_ALERT_RULE: 'DUPLICATE_ALERT_RULE',
 	GET_HOST_LIST: 'GET_HOST_LIST',

frontend/src/container/QueryBuilder/components/RunQueryBtn/RunQueryBtn.tsx

@@ -15,18 +15,15 @@ import './RunQueryBtn.scss';
 interface RunQueryBtnProps {
 	className?: string;
 	label?: string;
-	disabled?: boolean;
 	isLoadingQueries?: boolean;
 	handleCancelQuery?: () => void;
 	onStageRunQuery?: () => void;
-	/** @deprecated Use handleCancelQuery + isLoadingQueries instead */
 	queryRangeKey?: QueryKey;
 }
 
 function RunQueryBtn({
 	className,
 	label,
-	disabled,
 	isLoadingQueries,
 	handleCancelQuery,
 	onStageRunQuery,
@@ -64,7 +61,7 @@ function RunQueryBtn({
 		<Button
 			type="primary"
 			className={cx('run-query-btn periscope-btn primary', className)}
-			disabled={disabled || !onStageRunQuery}
+			disabled={isLoading || !onStageRunQuery}
 			onClick={onStageRunQuery}
 			icon={<Play size={14} />}
 		>

frontend/src/container/QueryBuilder/components/RunQueryBtn/__test__/RunQueryBtn.test.tsx

@@ -71,12 +71,6 @@ describe('RunQueryBtn', () => {
 		expect(screen.getByRole('button', { name: /run query/i })).toBeDisabled();
 	});
 
-	test('disabled when disabled prop is true', () => {
-		const onRun = jest.fn();
-		render(<RunQueryBtn onStageRunQuery={onRun} disabled />);
-		expect(screen.getByRole('button', { name: /run query/i })).toBeDisabled();
-	});
-
 	test('shows cancel state and calls handleCancelQuery', () => {
 		const onCancel = jest.fn();
 		render(<RunQueryBtn isLoadingQueries handleCancelQuery={onCancel} />);

frontend/src/container/QueryBuilder/components/ToolbarActions/RightToolbarActions.tsx

@@ -10,10 +10,7 @@ import './ToolbarActions.styles.scss';
 interface RightToolbarActionsProps {
 	onStageRunQuery: () => void;
 	isLoadingQueries?: boolean;
-	handleCancelQuery?: () => void;
-	/** @deprecated Use handleCancelQuery instead */
 	listQueryKeyRef?: MutableRefObject<any>;
-	/** @deprecated Use handleCancelQuery instead */
 	chartQueryKeyRef?: MutableRefObject<any>;
 	showLiveLogs?: boolean;
 }
@@ -21,7 +18,6 @@ interface RightToolbarActionsProps {
 export default function RightToolbarActions({
 	onStageRunQuery,
 	isLoadingQueries,
-	handleCancelQuery: handleCancelQueryProp,
 	listQueryKeyRef,
 	chartQueryKeyRef,
 	showLiveLogs,
@@ -46,16 +42,12 @@ export default function RightToolbarActions({
 	if (showLiveLogs) {
 		return (
 			<div className="right-toolbar-actions-container">
-				<RunQueryBtn disabled />
+				<RunQueryBtn />
 			</div>
 		);
 	}
 
 	const handleCancelQuery = (): void => {
-		if (handleCancelQueryProp) {
-			handleCancelQueryProp();
-			return;
-		}
 		if (listQueryKeyRef?.current) {
 			queryClient.cancelQueries(listQueryKeyRef.current);
 		}
@@ -77,7 +69,6 @@ export default function RightToolbarActions({
 
 RightToolbarActions.defaultProps = {
 	isLoadingQueries: false,
-	handleCancelQuery: undefined,
 	listQueryKeyRef: null,
 	chartQueryKeyRef: null,
 	showLiveLogs: false,

frontend/src/hooks/queryBuilder/useGetQueryRange.ts

@@ -132,10 +132,6 @@ export const useGetQueryRange: UseGetQueryRange = (
 			return options.retry;
 		}
 		return (failureCount: number, error: Error): boolean => {
-			if (isAxiosError(error) && error.code === 'ERR_CANCELED') {
-				return false;
-			}
-
 			let status: number | undefined;
 
 			if (error instanceof APIError) {

frontend/src/lib/history.ts

@@ -1,3 +1,4 @@
 import { createBrowserHistory } from 'history';
+import { getBasePath } from 'utils/getBasePath';
 
-export default createBrowserHistory();
+export default createBrowserHistory({ basename: getBasePath() });

frontend/src/pages/AlertDetails/hooks.tsx

@@ -431,7 +431,7 @@ export const useAlertRuleDuplicate = ({
 
 	const params = useUrlQuery();
 
-	const { refetch } = useQuery(REACT_QUERY_KEY.GET_ALL_ALERTS, {
+	const { refetch } = useQuery(REACT_QUERY_KEY.GET_ALL_ALLERTS, {
 		queryFn: getAll,
 		cacheTime: 0,
 	});

frontend/src/pages/ErrorBoundaryFallback/ErrorBoundaryFallback.tsx

@@ -2,6 +2,7 @@ import { useCallback } from 'react';
 import { Button } from 'antd';
 import ROUTES from 'constants/routes';
 import { useGetTenantLicense } from 'hooks/useGetTenantLicense';
+import history from 'lib/history';
 import { Home, LifeBuoy } from 'lucide-react';
 import { handleContactSupport } from 'pages/Integrations/utils';
 
@@ -11,8 +12,9 @@ import './ErrorBoundaryFallback.styles.scss';
 
 function ErrorBoundaryFallback(): JSX.Element {
 	const handleReload = (): void => {
-		// Go to home page
-		window.location.href = ROUTES.HOME;
+		// Use history.push so the navigation stays within the base path prefix
+		// (window.location.href would strip any /signoz/ prefix).
+		history.push(ROUTES.HOME);
 	};
 
 	const { isCloudUser: isCloudUserVal } = useGetTenantLicense();

frontend/src/utils/__tests__/getBasePath.test.ts

@@ -0,0 +1,50 @@
+import { getBasePath } from 'utils/getBasePath';
+
+/**
+ * Contract tests for getBasePath().
+ *
+ * These lock down the exact DOM-reading contract so that any future change to
+ * the utility (or to how index.html injects the <base> tag) surfaces
+ * immediately as a test failure.
+ */
+describe('getBasePath', () => {
+	afterEach(() => {
+		// Remove any <base> elements added during the test.
+		document.head.querySelectorAll('base').forEach((el) => el.remove());
+	});
+
+	it('returns the href from the <base> tag when present', () => {
+		const base = document.createElement('base');
+		base.setAttribute('href', '/signoz/');
+		document.head.appendChild(base);
+
+		expect(getBasePath()).toBe('/signoz/');
+	});
+
+	it('returns "/" when no <base> tag exists in the document', () => {
+		expect(getBasePath()).toBe('/');
+	});
+
+	it('returns "/" when the <base> tag has no href attribute', () => {
+		const base = document.createElement('base');
+		document.head.appendChild(base);
+
+		expect(getBasePath()).toBe('/');
+	});
+
+	it('returns the href unchanged when it already has a trailing slash', () => {
+		const base = document.createElement('base');
+		base.setAttribute('href', '/my/nested/path/');
+		document.head.appendChild(base);
+
+		expect(getBasePath()).toBe('/my/nested/path/');
+	});
+
+	it('appends a trailing slash when the href is missing one', () => {
+		const base = document.createElement('base');
+		base.setAttribute('href', '/signoz');
+		document.head.appendChild(base);
+
+		expect(getBasePath()).toBe('/signoz/');
+	});
+});

frontend/src/utils/getBasePath.ts

@@ -0,0 +1,17 @@
+/**
+ * Returns the base path for this SigNoz deployment by reading the
+ * `<base href>` element injected into index.html by the Go backend at
+ * serve time.
+ *
+ * Always returns a string ending with `/` (e.g. `/`, `/signoz/`).
+ * Falls back to `/` when no `<base>` element is present so the app
+ * behaves correctly in local Vite dev and unit-test environments.
+ *
+ * @internal — consume through `src/lib/history` and the axios interceptor;
+ * do not read `<base>` directly anywhere else in the codebase.
+ */
+export function getBasePath(): string {
+	const href = document.querySelector('base')?.getAttribute('href') ?? '/';
+	// Trailing slash is required for relative asset resolution and API prefixing.
+	return href.endsWith('/') ? href : `${href}/`;
+}

frontend/vite.config.ts

@@ -10,6 +10,18 @@ import { createHtmlPlugin } from 'vite-plugin-html';
 import { ViteImageOptimizer } from 'vite-plugin-image-optimizer';
 import tsconfigPaths from 'vite-tsconfig-paths';
 
+// In dev the Go backend is not involved, so replace the [[.BasePath]] placeholder
+// with "/" so relative assets resolve correctly from the Vite dev server.
+function devBasePathPlugin(): Plugin {
+	return {
+		name: 'dev-base-path',
+		apply: 'serve',
+		transformIndexHtml(html): string {
+			return html.replace('[[.BasePath]]', '/');
+		},
+	};
+}
+
 function rawMarkdownPlugin(): Plugin {
 	return {
 		name: 'raw-markdown',
@@ -32,6 +44,7 @@ export default defineConfig(
 		const plugins = [
 			tsconfigPaths(),
 			rawMarkdownPlugin(),
+			devBasePathPlugin(),
 			react(),
 			createHtmlPlugin({
 				inject: {
@@ -124,6 +137,7 @@ export default defineConfig(
 				'process.env.TUNNEL_DOMAIN': JSON.stringify(env.VITE_TUNNEL_DOMAIN),
 				'process.env.DOCS_BASE_URL': JSON.stringify(env.VITE_DOCS_BASE_URL),
 			},
+			base: './',
 			build: {
 				sourcemap: true,
 				outDir: 'build',