feat: v2 create dashboard API

* feat: enable JSON Path index

* fix: contextual path index usage

* test: fix unit tests

* feat: align negative operators to include other logs

* fix: primitive conditions working

* fix: indexed tests passing

* fix: array type filtering from dynamic arrays

* fix: unit tests

* fix: remove not used paths from testdata

* fix: unit tests

* fix: comment

* fix: indexed unit tests

* fix: array json element comparison

* feat: change filtering of dynamic arrays

* fix: dynamic array tests

* fix: stringified integer value input

* fix: better review for test file

* fix: negative operator check

* ci: lint changes

* chore: import tests from older pr

* fix: better tests

* fix: logs.py

* fix: body tests ready

* fix: better validations

* fix: dynamically change insert stmt for body_v2 availability

* test: with higher migrator version

* fix: type ambiguity

* fix: test

* test: updated validation

* fix: tons of changes

* chore: remove redundent comparison

* ci: tests fixed

* fix: upgraded collector version

* fix: qbtoexpr tests

* fix: go sum

* chore: upgrade collector version v0.144.3-rc.4

* fix: tests

* ci: test fix

* revert: remove db binaries

* test: selectField tests added

* fix: added safeguards in plan generation

* fix: name changed to field_map

* chore: changes based on review

* fix: changes based on review

* fix: remove unused promoted fixture

* test: integration test fix attempt 1

* fix: json access plan remval of AvailableTypes

* fix: invalid index usage on terminal condition

* test: added indexed tests separately

* test: select order by tests added

* fix: update jsontypeexporter

* fix: branches should tell missing array types

* fix: comment removed

* ci: test with updated collector

* fix: issue with FuzzyMatching and API failing

* test: select orderby works

* fix: int64 mapping

* fix: replacing JSONIndex with TelemetryFieldKeyIndex

* chore: update collector to stable release

* chore: update migrator version to stable release

* chore: error fix and unused code

* chore: go mod tidy

* chore: some changes in test to improve quality

* test: enhanced tests to work with backtick required key

* chore: comment removal

* fix: change based on review

* fix: change based on review

* fix: openapi ci

* ci: fix go tests

* fix: index needs body prefix

* fix: tests

* ci: polluted test fix

* fix: shift test files

* refactor(telemetrytypes): replace JSONDataTypeIndex with TelemetryFieldKeySkipIndex

* revert: mcp related changes

* feat: check query log as fixture

* fix: reuse querier fixtures

* chore: rename jsontypeexporter.py

* chore: py-fmt

* fix: minor fix

* fix: py-lint

* fix: changes based on review

* chore: fmt

.github/workflows/integrationci.yaml

@@ -51,6 +51,7 @@ jobs:
           - role
           - rootuser
           - serviceaccount
+          - querier_json_body
           - ttl
         sqlstore-provider:
           - postgres
@@ -61,7 +62,7 @@ jobs:
           - 25.5.6
           - 25.12.5
         schema-migrator-version:
-          - v0.142.0
+          - v0.144.3
         postgres-version:
           - 15
     if: |

.vscode/settings.json

@@ -1,6 +1,8 @@
 {
   "oxc.typeAware": true,
   "oxc.tsConfigPath": "./frontend/tsconfig.json",
+  "oxc.configPath": "./frontend/.oxlintrc.json",
+  "oxc.fmt.configPath": "./frontend/.oxfmtrc.json",
   "editor.formatOnSave": true,
   "editor.defaultFormatter": "oxc.oxc-vscode",
   "editor.codeActionsOnSave": {
@@ -19,4 +21,3 @@
   "python-envs.defaultEnvManager": "ms-python.python:system",
   "python-envs.pythonProjects": []
 }
-

cmd/community/server.go

@@ -27,6 +27,7 @@ import (
 	"github.com/SigNoz/signoz/pkg/modules/cloudintegration/implcloudintegration"
 	"github.com/SigNoz/signoz/pkg/modules/dashboard"
 	"github.com/SigNoz/signoz/pkg/modules/dashboard/impldashboard"
+	"github.com/SigNoz/signoz/pkg/modules/tag"
 	"github.com/SigNoz/signoz/pkg/modules/organization"
 	"github.com/SigNoz/signoz/pkg/modules/rulestatehistory"
 	"github.com/SigNoz/signoz/pkg/modules/serviceaccount"
@@ -100,8 +101,8 @@ func runServer(ctx context.Context, config signoz.Config, logger *slog.Logger) e
 
 			return openfgaauthz.NewProviderFactory(sqlstore, openfgaschema.NewSchema().Get(ctx), openfgaDataStore), nil
 		},
-		func(store sqlstore.SQLStore, settings factory.ProviderSettings, analytics analytics.Analytics, orgGetter organization.Getter, queryParser queryparser.QueryParser, _ querier.Querier, _ licensing.Licensing) dashboard.Module {
-			return impldashboard.NewModule(impldashboard.NewStore(store), settings, analytics, orgGetter, queryParser)
+		func(store sqlstore.SQLStore, settings factory.ProviderSettings, analytics analytics.Analytics, orgGetter organization.Getter, queryParser queryparser.QueryParser, _ querier.Querier, _ licensing.Licensing, tagModule tag.Module) dashboard.Module {
+			return impldashboard.NewModule(impldashboard.NewStore(store), store, settings, analytics, orgGetter, queryParser, tagModule)
 		},
 		func(_ licensing.Licensing) factory.ProviderFactory[gateway.Gateway, gateway.Config] {
 			return noopgateway.NewProviderFactory()

cmd/enterprise/server.go

@@ -42,6 +42,7 @@ import (
 	pkgcloudintegration "github.com/SigNoz/signoz/pkg/modules/cloudintegration/implcloudintegration"
 	"github.com/SigNoz/signoz/pkg/modules/dashboard"
 	pkgimpldashboard "github.com/SigNoz/signoz/pkg/modules/dashboard/impldashboard"
+	"github.com/SigNoz/signoz/pkg/modules/tag"
 	"github.com/SigNoz/signoz/pkg/modules/organization"
 	"github.com/SigNoz/signoz/pkg/modules/rulestatehistory"
 	"github.com/SigNoz/signoz/pkg/modules/serviceaccount"
@@ -144,8 +145,8 @@ func runServer(ctx context.Context, config signoz.Config, logger *slog.Logger) e
 			}
 			return openfgaauthz.NewProviderFactory(sqlstore, openfgaschema.NewSchema().Get(ctx), openfgaDataStore, licensing, onBeforeRoleDelete, dashboardModule), nil
 		},
-		func(store sqlstore.SQLStore, settings factory.ProviderSettings, analytics analytics.Analytics, orgGetter organization.Getter, queryParser queryparser.QueryParser, querier querier.Querier, licensing licensing.Licensing) dashboard.Module {
-			return impldashboard.NewModule(pkgimpldashboard.NewStore(store), settings, analytics, orgGetter, queryParser, querier, licensing)
+		func(store sqlstore.SQLStore, settings factory.ProviderSettings, analytics analytics.Analytics, orgGetter organization.Getter, queryParser queryparser.QueryParser, querier querier.Querier, licensing licensing.Licensing, tagModule tag.Module) dashboard.Module {
+			return impldashboard.NewModule(pkgimpldashboard.NewStore(store), store, settings, analytics, orgGetter, queryParser, querier, licensing, tagModule)
 		},
 		func(licensing licensing.Licensing) factory.ProviderFactory[gateway.Gateway, gateway.Config] {
 			return httpgateway.NewProviderFactory(licensing)
@@ -167,7 +168,7 @@ func runServer(ctx context.Context, config signoz.Config, logger *slog.Logger) e
 			if err != nil {
 				return nil, err
 			}
-			azureCloudProviderModule := implcloudprovider.NewAzureCloudProvider()
+			azureCloudProviderModule := implcloudprovider.NewAzureCloudProvider(defStore)
 			cloudProvidersMap := map[cloudintegrationtypes.CloudProviderType]cloudintegration.CloudProviderModule{
 				cloudintegrationtypes.CloudProviderTypeAWS:   awsCloudProviderModule,
 				cloudintegrationtypes.CloudProviderTypeAzure: azureCloudProviderModule,

conf/example.yaml

@@ -11,6 +11,8 @@ global:
   external_url: <unset>
   # the url where the SigNoz backend receives telemetry data (traces, metrics, logs) from instrumented applications.
   ingestion_url: <unset>
+  # the url of the SigNoz MCP server. when unset, the MCP settings page is hidden in the frontend.
+  # mcp_url: <unset>
 
 ##################### Version #####################
 version:
@@ -408,6 +410,16 @@ cloudintegration:
     # The version of the cloud integration agent.
     version: v0.0.8
 
+##################### Trace Detail #####################
+tracedetail:
+  waterfall:
+    # Number of spans returned per request when the trace is too large to show all at once.
+    span_page_size: 500
+    # Maximum depth of descendents to auto-expand for the selected span.
+    max_depth_to_auto_expand: 5
+    # Threshold below which all spans are returned without windowing.
+    max_limit_to_select_all_spans: 10000
+
 ##################### Authz #################################
 authz:
   # Specifies the authz provider to use.

ee/authz/openfgaauthz/provider.go

@@ -86,6 +86,28 @@ func (provider *provider) BatchCheck(ctx context.Context, tupleReq map[string]*o
 	return provider.openfgaServer.BatchCheck(ctx, tupleReq)
 }
 
+func (provider *provider) CheckTransactions(ctx context.Context, subject string, orgID valuer.UUID, transactions []*authtypes.Transaction) ([]*authtypes.TransactionWithAuthorization, error) {
+	tuples, err := authtypes.NewTuplesFromTransactions(transactions, subject, orgID)
+	if err != nil {
+		return nil, err
+	}
+
+	batchResults, err := provider.openfgaServer.BatchCheck(ctx, tuples)
+	if err != nil {
+		return nil, err
+	}
+
+	results := make([]*authtypes.TransactionWithAuthorization, len(transactions))
+	for i, txn := range transactions {
+		result := batchResults[txn.ID.StringValue()]
+		results[i] = &authtypes.TransactionWithAuthorization{
+			Transaction: txn,
+			Authorized:  result.Authorized,
+		}
+	}
+	return results, nil
+}
+
 func (provider *provider) ListObjects(ctx context.Context, subject string, relation authtypes.Relation, objectType authtypes.Type) ([]*authtypes.Object, error) {
 	return provider.openfgaServer.ListObjects(ctx, subject, relation, objectType)
 }

ee/modules/cloudintegration/implcloudintegration/implcloudprovider/awscloudprovider.go

@@ -18,6 +18,7 @@ func NewAWSCloudProvider(defStore cloudintegrationtypes.ServiceDefinitionStore)
 	return &awscloudprovider{serviceDefinitions: defStore}, nil
 }
 
+// TODO: move URL construction logic to cloudintegrationtypes and add unit tests for it.
 func (provider *awscloudprovider) GetConnectionArtifact(ctx context.Context, account *cloudintegrationtypes.Account, req *cloudintegrationtypes.GetConnectionArtifactRequest) (*cloudintegrationtypes.ConnectionArtifact, error) {
 	baseURL := fmt.Sprintf(cloudintegrationtypes.CloudFormationQuickCreateBaseURL.StringValue(), req.Config.AWS.DeploymentRegion)
 	u, _ := url.Parse(baseURL)

ee/modules/cloudintegration/implcloudintegration/implcloudprovider/azurecloudprovider.go

@@ -2,27 +2,48 @@ package implcloudprovider
 
 import (
 	"context"
+	"sort"
 
 	"github.com/SigNoz/signoz/pkg/modules/cloudintegration"
 	"github.com/SigNoz/signoz/pkg/types/cloudintegrationtypes"
 )
 
-type azurecloudprovider struct{}
+type azurecloudprovider struct {
+	serviceDefinitions cloudintegrationtypes.ServiceDefinitionStore
+}
 
-func NewAzureCloudProvider() cloudintegration.CloudProviderModule {
-	return &azurecloudprovider{}
+func NewAzureCloudProvider(defStore cloudintegrationtypes.ServiceDefinitionStore) cloudintegration.CloudProviderModule {
+	return &azurecloudprovider{
+		serviceDefinitions: defStore,
+	}
 }
 
 func (provider *azurecloudprovider) GetConnectionArtifact(ctx context.Context, account *cloudintegrationtypes.Account, req *cloudintegrationtypes.GetConnectionArtifactRequest) (*cloudintegrationtypes.ConnectionArtifact, error) {
-	panic("implement me")
+	connectionArtifact, err := cloudintegrationtypes.NewAzureConnectionArtifact(account.ID, req.Config.AgentVersion, req.Credentials, req.Config.Azure)
+	if err != nil {
+		return nil, err
+	}
+	return &cloudintegrationtypes.ConnectionArtifact{
+		Azure: connectionArtifact,
+	}, nil
 }
 
 func (provider *azurecloudprovider) ListServiceDefinitions(ctx context.Context) ([]*cloudintegrationtypes.ServiceDefinition, error) {
-	panic("implement me")
+	return provider.serviceDefinitions.List(ctx, cloudintegrationtypes.CloudProviderTypeAzure)
 }
 
 func (provider *azurecloudprovider) GetServiceDefinition(ctx context.Context, serviceID cloudintegrationtypes.ServiceID) (*cloudintegrationtypes.ServiceDefinition, error) {
-	panic("implement me")
+	serviceDef, err := provider.serviceDefinitions.Get(ctx, cloudintegrationtypes.CloudProviderTypeAzure, serviceID)
+	if err != nil {
+		return nil, err
+	}
+
+	// override cloud integration dashboard id.
+	for index, dashboard := range serviceDef.Assets.Dashboards {
+		serviceDef.Assets.Dashboards[index].ID = cloudintegrationtypes.GetCloudIntegrationDashboardID(cloudintegrationtypes.CloudProviderTypeAzure, serviceID.StringValue(), dashboard.ID)
+	}
+
+	return serviceDef, nil
 }
 
 func (provider *azurecloudprovider) BuildIntegrationConfig(
@@ -30,5 +51,56 @@ func (provider *azurecloudprovider) BuildIntegrationConfig(
 	account *cloudintegrationtypes.Account,
 	services []*cloudintegrationtypes.StorableCloudIntegrationService,
 ) (*cloudintegrationtypes.ProviderIntegrationConfig, error) {
-	panic("implement me")
+	sort.Slice(services, func(i, j int) bool {
+		return services[i].Type.StringValue() < services[j].Type.StringValue()
+	})
+
+	var strategies []*cloudintegrationtypes.AzureTelemetryCollectionStrategy
+
+	for _, storedSvc := range services {
+		svcCfg, err := cloudintegrationtypes.NewServiceConfigFromJSON(cloudintegrationtypes.CloudProviderTypeAzure, storedSvc.Config)
+		if err != nil {
+			return nil, err
+		}
+
+		svcDef, err := provider.GetServiceDefinition(ctx, storedSvc.Type)
+		if err != nil {
+			return nil, err
+		}
+
+		strategy := svcDef.TelemetryCollectionStrategy.Azure
+		if strategy == nil {
+			continue
+		}
+
+		logsEnabled := svcCfg.IsLogsEnabled(cloudintegrationtypes.CloudProviderTypeAzure)
+		metricsEnabled := svcCfg.IsMetricsEnabled(cloudintegrationtypes.CloudProviderTypeAzure)
+
+		if !logsEnabled && !metricsEnabled {
+			continue
+		}
+
+		entry := &cloudintegrationtypes.AzureTelemetryCollectionStrategy{
+			ResourceProvider: strategy.ResourceProvider,
+			ResourceType:     strategy.ResourceType,
+		}
+
+		if metricsEnabled && strategy.Metrics != nil {
+			entry.Metrics = strategy.Metrics
+		}
+
+		if logsEnabled && strategy.Logs != nil {
+			entry.Logs = strategy.Logs
+		}
+
+		strategies = append(strategies, entry)
+	}
+
+	return &cloudintegrationtypes.ProviderIntegrationConfig{
+		Azure: cloudintegrationtypes.NewAzureIntegrationConfig(
+			account.Config.Azure.DeploymentRegion,
+			account.Config.Azure.ResourceGroups,
+			strategies,
+		),
+	}, nil
 }

ee/modules/cloudintegration/implcloudintegration/module.go

@@ -429,9 +429,13 @@ func (module *module) Collect(ctx context.Context, orgID valuer.UUID) (map[strin
 		stats["cloudintegration.aws.connectedaccounts.count"] = awsAccountsCount
 	}
 
-	// NOTE: not adding stats for services for now.
+	// get connected accounts for Azure
+	azureAccountsCount, err := module.store.CountConnectedAccounts(ctx, orgID, cloudintegrationtypes.CloudProviderTypeAzure)
+	if err == nil {
+		stats["cloudintegration.azure.connectedaccounts.count"] = azureAccountsCount
+	}
 
-	// TODO: add more cloud providers when supported
+	// NOTE: not adding stats for services for now.
 
 	return stats, nil
 }

ee/modules/dashboard/impldashboard/module.go

@@ -11,12 +11,15 @@ import (
 	"github.com/SigNoz/signoz/pkg/modules/dashboard"
 	pkgimpldashboard "github.com/SigNoz/signoz/pkg/modules/dashboard/impldashboard"
 	"github.com/SigNoz/signoz/pkg/modules/organization"
+	"github.com/SigNoz/signoz/pkg/modules/tag"
 	"github.com/SigNoz/signoz/pkg/querier"
 	"github.com/SigNoz/signoz/pkg/queryparser"
+	"github.com/SigNoz/signoz/pkg/sqlstore"
 	"github.com/SigNoz/signoz/pkg/types"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
 	"github.com/SigNoz/signoz/pkg/types/ctxtypes"
 	"github.com/SigNoz/signoz/pkg/types/dashboardtypes"
+	"github.com/SigNoz/signoz/pkg/types/dashboardtypes/dashboardtypesv2"
 	"github.com/SigNoz/signoz/pkg/types/instrumentationtypes"
 	"github.com/SigNoz/signoz/pkg/types/querybuildertypes/querybuildertypesv5"
 	"github.com/SigNoz/signoz/pkg/valuer"
@@ -30,9 +33,9 @@ type module struct {
 	licensing          licensing.Licensing
 }
 
-func NewModule(store dashboardtypes.Store, settings factory.ProviderSettings, analytics analytics.Analytics, orgGetter organization.Getter, queryParser queryparser.QueryParser, querier querier.Querier, licensing licensing.Licensing) dashboard.Module {
+func NewModule(store dashboardtypes.Store, sqlstore sqlstore.SQLStore, settings factory.ProviderSettings, analytics analytics.Analytics, orgGetter organization.Getter, queryParser queryparser.QueryParser, querier querier.Querier, licensing licensing.Licensing, tagModule tag.Module) dashboard.Module {
 	scopedProviderSettings := factory.NewScopedProviderSettings(settings, "github.com/SigNoz/signoz/ee/modules/dashboard/impldashboard")
-	pkgDashboardModule := pkgimpldashboard.NewModule(store, settings, analytics, orgGetter, queryParser)
+	pkgDashboardModule := pkgimpldashboard.NewModule(store, sqlstore, settings, analytics, orgGetter, queryParser, tagModule)
 
 	return &module{
 		pkgDashboardModule: pkgDashboardModule,
@@ -197,6 +200,10 @@ func (module *module) Create(ctx context.Context, orgID valuer.UUID, createdBy s
 	return module.pkgDashboardModule.Create(ctx, orgID, createdBy, creator, data)
 }
 
+func (module *module) CreateV2(ctx context.Context, orgID valuer.UUID, createdBy string, creator valuer.UUID, postable dashboardtypesv2.PostableDashboard) (*dashboardtypesv2.Dashboard, error) {
+	return module.pkgDashboardModule.CreateV2(ctx, orgID, createdBy, creator, postable)
+}
+
 func (module *module) Get(ctx context.Context, orgID valuer.UUID, id valuer.UUID) (*dashboardtypes.Dashboard, error) {
 	return module.pkgDashboardModule.Get(ctx, orgID, id)
 }

frontend/.oxlintrc.json

@@ -9,7 +9,6 @@
     "react",
     "react-perf",
     "typescript",
-    "unicorn",
     "jsx-a11y",
     "import",
     "jest",
@@ -206,6 +205,8 @@
     "@typescript-eslint/explicit-function-return-type": "error",
     // Requires explicit return types on functions
     "@typescript-eslint/no-var-requires": "error",
+    "@typescript-eslint/no-useless-default-assignment": "off", // provide unsafe fixes in our codebase due to bad typing
+    "@typescript-eslint/no-duplicate-type-constituents": "off", // provide fixes that breaks some assumptions, eg: type A = L, B = L, C = A | B (removes B)
     // Disallows require() in TypeScript (use import instead)
     // Disabled - using TypeScript instead
     "react/jsx-props-no-spreading": "off",
@@ -286,6 +287,20 @@
     // Prevents useStore.getState() - export standalone actions instead
     "signoz/no-navigator-clipboard": "error",
     // Prevents navigator.clipboard - use useCopyToClipboard hook instead (disabled in tests via override)
+    "signoz/no-raw-absolute-path": "error",
+    // Prevents window.open(path), window.location.origin + path, window.location.href = path
+    "no-restricted-globals": [
+      "error",
+      {
+        "name": "localStorage",
+        "message": "Use scoped wrappers from api/browser/localstorage/ instead (ensures keys are prefixed when served under a URL base path)."
+      },
+      {
+        "name": "sessionStorage",
+        "message": "Use scoped wrappers from api/browser/sessionstorage/ instead (ensures keys are prefixed when served under a URL base path)."
+      }
+    ],
+    // Prevents direct localStorage/sessionStorage access — use scoped wrappers
     "no-restricted-imports": [
       "error",
       {
@@ -298,14 +313,6 @@
             "name": "react-redux",
             "message": "[State mgmt] react-redux is deprecated. Migrate to Zustand, nuqs, or react-query."
           },
-          {
-            "name": "xstate",
-            "message": "[State mgmt] xstate is deprecated. Migrate to Zustand or react-query."
-          },
-          {
-            "name": "@xstate/react",
-            "message": "[State mgmt] @xstate/react is deprecated. Migrate to Zustand or react-query."
-          },
           {
             "name": "react",
             "importNames": [
@@ -324,82 +331,6 @@
     "react/no-array-index-key": "warn",
     // TODO: Changed to warn during oxlint migration, should be changed to error,
 
-    "unicorn/error-message": "warn",
-    "unicorn/escape-case": "warn",
-    "unicorn/new-for-builtins": "warn",
-    "unicorn/no-abusive-eslint-disable": "warn",
-    "unicorn/no-console-spaces": "warn",
-    "unicorn/no-instanceof-array": "warn",
-    "unicorn/no-invalid-remove-event-listener": "warn",
-    "unicorn/no-new-array": "warn",
-    "unicorn/no-new-buffer": "warn",
-    "unicorn/no-thenable": "warn",
-    "unicorn/no-unreadable-array-destructuring": "warn",
-    "unicorn/no-useless-fallback-in-spread": "warn",
-    "unicorn/no-useless-length-check": "warn",
-    "unicorn/no-useless-promise-resolve-reject": "warn",
-    "unicorn/no-useless-spread": "warn",
-    "unicorn/no-zero-fractions": "warn",
-    "unicorn/number-literal-case": "warn",
-    "unicorn/prefer-array-find": "warn",
-    "unicorn/prefer-array-flat": "warn",
-    "unicorn/prefer-array-flat-map": "warn",
-    "unicorn/prefer-array-index-of": "warn",
-    "unicorn/prefer-array-some": "warn",
-    "unicorn/prefer-at": "warn",
-    "unicorn/prefer-code-point": "warn",
-    "unicorn/prefer-date-now": "warn",
-    "unicorn/prefer-default-parameters": "warn",
-    "unicorn/prefer-includes": "warn",
-    "unicorn/prefer-modern-math-apis": "warn",
-    "unicorn/prefer-native-coercion-functions": "warn",
-    "unicorn/prefer-node-protocol": "off",
-    "unicorn/prefer-number-properties": "warn",
-    "unicorn/prefer-optional-catch-binding": "warn",
-    "unicorn/prefer-regexp-test": "warn",
-    "unicorn/prefer-set-has": "warn",
-    "unicorn/prefer-string-replace-all": "warn",
-    "unicorn/prefer-string-slice": "warn",
-    "unicorn/prefer-string-starts-ends-with": "warn",
-    "unicorn/prefer-string-trim-start-end": "warn",
-    "unicorn/prefer-type-error": "warn",
-    "unicorn/require-array-join-separator": "warn",
-    "unicorn/require-number-to-fixed-digits-argument": "warn",
-    "unicorn/throw-new-error": "warn",
-    "unicorn/consistent-function-scoping": "warn",
-    "unicorn/explicit-length-check": "warn",
-    "unicorn/filename-case": [
-      "warn",
-      {
-        "case": "kebabCase"
-      }
-    ],
-    "unicorn/no-array-for-each": "warn",
-    "unicorn/no-lonely-if": "warn",
-    "unicorn/no-negated-condition": "warn",
-    "unicorn/no-null": "warn",
-    "unicorn/no-object-as-default-parameter": "warn",
-    "unicorn/no-static-only-class": "warn",
-    "unicorn/no-this-assignment": "warn",
-    "unicorn/no-unreadable-iife": "warn",
-    "unicorn/no-useless-switch-case": "warn",
-    "unicorn/no-useless-undefined": "warn",
-    "unicorn/prefer-add-event-listener": "warn",
-    "unicorn/prefer-dom-node-append": "warn",
-    "unicorn/prefer-dom-node-dataset": "warn",
-    "unicorn/prefer-dom-node-remove": "warn",
-    "unicorn/prefer-dom-node-text-content": "warn",
-    "unicorn/prefer-keyboard-event-key": "warn",
-    "unicorn/prefer-math-trunc": "warn",
-    "unicorn/prefer-modern-dom-apis": "warn",
-    "unicorn/prefer-negative-index": "warn",
-    "unicorn/prefer-prototype-methods": "warn",
-    "unicorn/prefer-query-selector": "warn",
-    "unicorn/prefer-reflect-apply": "warn",
-    "unicorn/prefer-set-size": "warn",
-    "unicorn/prefer-spread": "warn",
-    "unicorn/prefer-ternary": "warn",
-    "unicorn/require-post-message-target-origin": "warn",
     "oxc/bad-array-method-on-arguments": "error",
     "oxc/bad-bitwise-operator": "error",
     "oxc/bad-comparison-sequence": "error",
@@ -524,8 +455,8 @@
     "sonarjs/no-nested-template-literals": "error",
     // Avoids nested template literals
     "sonarjs/no-redundant-boolean": "warn", // TODO: Change to error after migration
-    // Removes redundant boolean literals
-    "sonarjs/no-redundant-jump": "error",
+    // Removes redundant boolean literals - turned off because it clashes with unicorn rules
+    "sonarjs/no-redundant-jump": "off",
     // Removes unnecessary returns/continues
     "sonarjs/no-same-line-conditional": "error",
     // Prevents same-line conditionals
@@ -597,8 +528,12 @@
       "rules": {
         "import/first": "off",
         // Should ignore due to mocks
-        "signoz/no-navigator-clipboard": "off"
-        // Tests can use navigator.clipboard directly
+        "signoz/no-navigator-clipboard": "off",
+        // Tests can use navigator.clipboard directly,
+        "signoz/no-raw-absolute-path":"off",
+        "no-restricted-globals": "off",
+        // Tests need raw localStorage/sessionStorage to seed DOM state for isolation
+        "signoz/no-zustand-getstate-in-hooks": "off"
       }
     },
     {

frontend/.stylelintrc.cjs

@@ -1,3 +1,4 @@
+// oxlint-disable-next-line typescript/no-require-imports
 const path = require('path');
 
 module.exports = {

frontend/index.html

@@ -1,7 +1,8 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
 	<head>
 		<meta charset="utf-8" />
+		<base href="[[.BaseHref]]" />
 		<meta
 			http-equiv="Cache-Control"
 			content="no-cache, no-store, must-revalidate, max-age: 0"
@@ -39,12 +40,12 @@
 		<meta
 			data-react-helmet="true"
 			property="og:image"
-			content="/images/signoz-hero-image.webp"
+			content="[[.BaseHref]]images/signoz-hero-image.webp"
 		/>
 		<meta
 			data-react-helmet="true"
 			name="twitter:image"
-			content="/images/signoz-hero-image.webp"
+			content="[[.BaseHref]]images/signoz-hero-image.webp"
 		/>
 		<meta
 			data-react-helmet="true"
@@ -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">
 		<script>
@@ -67,8 +68,16 @@
 			// Mirrors the logic in ThemeProvider (hooks/useDarkMode/index.tsx).
 			(function () {
 				try {
-					var theme = localStorage.getItem('THEME');
-					var autoSwitch = localStorage.getItem('THEME_AUTO_SWITCH') === 'true';
+					// When served under a URL prefix (e.g. /signoz/), storage keys are scoped
+					// to that prefix by the React app (see utils/storage.ts getScopedKey).
+					// Read the <base> tag — already populated by the Go template — to derive
+					// the same prefix here, before any JS module has loaded.
+					var basePath =
+						(document.querySelector('base') || {}).getAttribute('href') || '/';
+					var prefix = basePath === '/' ? '' : basePath;
+					var theme = localStorage.getItem(prefix + 'THEME');
+					var autoSwitch =
+						localStorage.getItem(prefix + 'THEME_AUTO_SWITCH') === 'true';
 					if (autoSwitch) {
 						theme = window.matchMedia('(prefers-color-scheme: dark)').matches
 							? 'dark'
@@ -136,7 +145,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/jest.setup.ts

@@ -42,13 +42,13 @@ window.getComputedStyle = function (
 	} catch {
 		// Return a minimal CSSStyleDeclaration so callers (testing-library, Radix UI)
 		// see the element as visible and without animations.
-		return ({
+		return {
 			display: '',
 			visibility: '',
 			opacity: '1',
 			animationName: 'none',
 			getPropertyValue: () => '',
-		} as unknown) as CSSStyleDeclaration;
+		} as unknown as CSSStyleDeclaration;
 	}
 };
 

frontend/knip.json

@@ -0,0 +1,5 @@
+{
+  "$schema": "https://unpkg.com/knip@5/schema.json",
+  "project": ["src/**/*.ts", "src/**/*.tsx"],
+  "ignore": ["src/api/generated/**/*.ts"]
+}

frontend/package.json

@@ -9,7 +9,7 @@
     "build": "vite build",
     "preview": "vite preview",
     "prettify": "oxfmt",
-    "fmt": "echo 'Disabled due to migration' || oxfmt --check",
+    "fmt": "oxfmt --check",
     "lint": "oxlint ./src && stylelint \"src/**/*.scss\"",
     "lint:js": "oxlint ./src",
     "lint:generated": "oxlint ./src/api/generated --fix",
@@ -63,7 +63,6 @@
     "@visx/shape": "3.5.0",
     "@visx/tooltip": "3.3.0",
     "@vitejs/plugin-react": "5.1.4",
-    "@xstate/react": "^3.0.0",
     "ansi-to-html": "0.7.2",
     "antd": "5.11.0",
     "antd-table-saveas-excel": "2.2.1",
@@ -146,7 +145,6 @@
     "vite": "npm:rolldown-vite@7.3.1",
     "vite-plugin-html": "3.2.2",
     "web-vitals": "^0.2.4",
-    "xstate": "^4.31.0",
     "zod": "4.3.6",
     "zustand": "5.0.11"
   },
@@ -214,9 +212,9 @@
     "msw": "1.3.2",
     "npm-run-all": "latest",
     "orval": "7.18.0",
-    "oxfmt": "0.41.0",
-    "oxlint": "1.59.0",
-    "oxlint-tsgolint": "0.20.0",
+    "oxfmt": "0.47.0",
+    "oxlint": "1.62.0",
+    "oxlint-tsgolint": "0.22.1",
     "portfinder-sync": "^0.0.2",
     "postcss": "8.5.6",
     "postcss-scss": "4.0.9",
@@ -240,9 +238,12 @@
   },
   "lint-staged": {
     "*.(js|jsx|ts|tsx)": [
-      "echo 'Disabled due to migration' || oxfmt --check",
       "oxlint --fix",
+      "oxfmt --write",
       "sh scripts/typecheck-staged.sh"
+    ],
+    "*.(scss|css)": [
+      "stylelint"
     ]
   },
   "resolutions": {

frontend/plugins/rules/no-raw-absolute-path.mjs

@@ -0,0 +1,174 @@
+/**
+ * Rule: no-raw-absolute-path
+ *
+ * Catches patterns that break at runtime when the app is served from a
+ * sub-path (e.g. /signoz/):
+ *
+ *   1. window.open(path, '_blank')
+ *      → use openInNewTab(path) which calls withBasePath internally
+ *
+ *   2. window.location.origin + path  /  `${window.location.origin}${path}`
+ *      → use getAbsoluteUrl(path)
+ *
+ *   3. frontendBaseUrl: window.location.origin  (bare origin usage)
+ *      → use getBaseUrl() to include the base path
+ *
+ *   4. window.location.href = path
+ *      → use withBasePath(path) or navigate() for internal navigation
+ *
+ * External URLs (first arg starts with "http") are explicitly allowed.
+ */
+
+function isOriginAccess(node) {
+	return (
+		node.type === 'MemberExpression' &&
+		!node.computed &&
+		node.property.name === 'origin' &&
+		node.object.type === 'MemberExpression' &&
+		!node.object.computed &&
+		node.object.property.name === 'location' &&
+		node.object.object.type === 'Identifier' &&
+		node.object.object.name === 'window'
+	);
+}
+
+function isHrefAccess(node) {
+	return (
+		node.type === 'MemberExpression' &&
+		!node.computed &&
+		node.property.name === 'href' &&
+		node.object.type === 'MemberExpression' &&
+		!node.object.computed &&
+		node.object.property.name === 'location' &&
+		node.object.object.type === 'Identifier' &&
+		node.object.object.name === 'window'
+	);
+}
+
+function isExternalUrl(node) {
+	if (node.type === 'Literal' && typeof node.value === 'string') {
+		return node.value.startsWith('http://') || node.value.startsWith('https://');
+	}
+	if (node.type === 'TemplateLiteral' && node.quasis.length > 0) {
+		const raw = node.quasis[0].value.raw;
+		return raw.startsWith('http://') || raw.startsWith('https://');
+	}
+	return false;
+}
+
+// window.open(withBasePath(x)) and window.open(getAbsoluteUrl(x)) are already safe.
+function isSafeHelperCall(node) {
+	return (
+		node.type === 'CallExpression' &&
+		node.callee.type === 'Identifier' &&
+		(node.callee.name === 'withBasePath' || node.callee.name === 'getAbsoluteUrl')
+	);
+}
+
+export default {
+	meta: {
+		type: 'suggestion',
+		docs: {
+			description:
+				'Disallow raw window.open and origin-concatenation patterns that miss the runtime base path',
+			category: 'Base Path Safety',
+		},
+		schema: [],
+		messages: {
+			windowOpen:
+				'Use openInNewTab(path) instead of window.open(path, "_blank") — openInNewTab prepends the base path automatically.',
+			originConcat:
+				'Use getAbsoluteUrl(path) instead of window.location.origin + path — getAbsoluteUrl prepends the base path automatically.',
+			originDirect:
+				'Use getBaseUrl() instead of window.location.origin — getBaseUrl includes the base path.',
+			hrefAssign:
+				'Use withBasePath(path) or navigate() instead of window.location.href = path — ensures the base path is included.',
+		},
+	},
+
+	create(context) {
+		return {
+			// window.open(path, ...) — allow only external first-arg URLs
+			CallExpression(node) {
+				const { callee, arguments: args } = node;
+				if (
+					callee.type !== 'MemberExpression' ||
+					callee.object.type !== 'Identifier' ||
+					callee.object.name !== 'window' ||
+					callee.property.name !== 'open'
+				) {
+					return;
+				}
+				if (args.length === 0) {
+					return;
+				}
+				if (isExternalUrl(args[0])) {
+					return;
+				}
+				if (isSafeHelperCall(args[0])) {
+					return;
+				}
+
+				context.report({ node, messageId: 'windowOpen' });
+			},
+
+			// window.location.origin + path
+			BinaryExpression(node) {
+				if (node.operator !== '+') {
+					return;
+				}
+				if (isOriginAccess(node.left) || isOriginAccess(node.right)) {
+					context.report({ node, messageId: 'originConcat' });
+				}
+			},
+
+			// `${window.location.origin}${path}`
+			TemplateLiteral(node) {
+				if (node.expressions.some(isOriginAccess)) {
+					context.report({ node, messageId: 'originConcat' });
+				}
+			},
+
+			// window.location.origin used directly (not in concatenation)
+			// Catches: frontendBaseUrl: window.location.origin
+			MemberExpression(node) {
+				if (!isOriginAccess(node)) {
+					return;
+				}
+
+				const parent = node.parent;
+				// Skip if parent is BinaryExpression with + (handled by BinaryExpression visitor)
+				if (parent.type === 'BinaryExpression' && parent.operator === '+') {
+					return;
+				}
+				// Skip if inside TemplateLiteral (handled by TemplateLiteral visitor)
+				if (parent.type === 'TemplateLiteral') {
+					return;
+				}
+
+				context.report({ node, messageId: 'originDirect' });
+			},
+
+			// window.location.href = path
+			AssignmentExpression(node) {
+				if (node.operator !== '=') {
+					return;
+				}
+				if (!isHrefAccess(node.left)) {
+					return;
+				}
+
+				// Allow external URLs
+				if (isExternalUrl(node.right)) {
+					return;
+				}
+				// Allow safe helper calls
+				if (isSafeHelperCall(node.right)) {
+					return;
+				}
+
+				context.report({ node, messageId: 'hrefAssign' });
+			},
+		};
+	},
+};

frontend/plugins/signoz.mjs

@@ -8,6 +8,7 @@
 import noZustandGetStateInHooks from './rules/no-zustand-getstate-in-hooks.mjs';
 import noNavigatorClipboard from './rules/no-navigator-clipboard.mjs';
 import noUnsupportedAssetPattern from './rules/no-unsupported-asset-pattern.mjs';
+import noRawAbsolutePath from './rules/no-raw-absolute-path.mjs';
 
 export default {
 	meta: {
@@ -17,5 +18,6 @@ export default {
 		'no-zustand-getstate-in-hooks': noZustandGetStateInHooks,
 		'no-navigator-clipboard': noNavigatorClipboard,
 		'no-unsupported-asset-pattern': noUnsupportedAssetPattern,
+		'no-raw-absolute-path': noRawAbsolutePath,
 	},
 };

frontend/public/locales/en-GB/routes.json

@@ -16,5 +16,6 @@
 	"roles": "Roles",
 	"role_details": "Role Details",
 	"members": "Members",
-	"service_accounts": "Service Accounts"
+	"service_accounts": "Service Accounts",
+	"mcp_server": "MCP Server"
 }

frontend/public/locales/en-GB/titles.json

@@ -53,5 +53,6 @@
 	"METER": "SigNoz | Meter",
 	"ROLES_SETTINGS": "SigNoz | Roles",
 	"MEMBERS_SETTINGS": "SigNoz | Members",
-	"SERVICE_ACCOUNTS_SETTINGS": "SigNoz | Service Accounts"
+	"SERVICE_ACCOUNTS_SETTINGS": "SigNoz | Service Accounts",
+	"MCP_SERVER": "SigNoz | MCP Server"
 }

frontend/public/locales/en/routes.json

@@ -16,5 +16,6 @@
 	"roles": "Roles",
 	"role_details": "Role Details",
 	"members": "Members",
-	"service_accounts": "Service Accounts"
+	"service_accounts": "Service Accounts",
+	"mcp_server": "MCP Server"
 }

frontend/public/locales/en/titles.json

@@ -76,5 +76,6 @@
 	"METER": "SigNoz | Meter",
 	"ROLES_SETTINGS": "SigNoz | Roles",
 	"MEMBERS_SETTINGS": "SigNoz | Members",
-	"SERVICE_ACCOUNTS_SETTINGS": "SigNoz | Service Accounts"
+	"SERVICE_ACCOUNTS_SETTINGS": "SigNoz | Service Accounts",
+	"MCP_SERVER": "SigNoz | MCP Server"
 }

frontend/src/ReactI18/index.tsx

@@ -2,6 +2,7 @@ import { initReactI18next } from 'react-i18next';
 import i18n from 'i18next';
 import LanguageDetector from 'i18next-browser-languagedetector';
 import Backend from 'i18next-http-backend';
+import { getBasePath } from 'utils/basePath';
 
 import cacheBursting from '../../i18n-translations-hash.json';
 
@@ -24,7 +25,7 @@ i18n
 				const ns = namespace[0];
 				const pathkey = `/${language}/${ns}`;
 				const hash = cacheBursting[pathkey as keyof typeof cacheBursting] || '';
-				return `/locales/${language}/${namespace}.json?h=${hash}`;
+				return `${getBasePath()}locales/${language}/${namespace}.json?h=${hash}`;
 			},
 		},
 		react: {

frontend/src/api/browser/localstorage/__tests__/get.test.ts

@@ -0,0 +1,130 @@
+/**
+ * localstorage/get — lazy migration tests.
+ *
+ * basePath is memoized at module init, so each describe block re-imports the
+ * module with a fresh DOM state via jest.isolateModules.
+ */
+
+type GetModule = typeof import('../get');
+
+function loadGetModule(href: string): GetModule {
+	const base = document.createElement('base');
+	base.setAttribute('href', href);
+	document.head.append(base);
+
+	let mod!: GetModule;
+	jest.isolateModules(() => {
+		// oxlint-disable-next-line typescript-eslint/no-require-imports, typescript-eslint/no-var-requires
+		mod = require('../get');
+	});
+	return mod;
+}
+
+afterEach(() => {
+	for (const el of document.head.querySelectorAll('base')) {
+		el.remove();
+	}
+	localStorage.clear();
+});
+
+describe('get — root path "/"', () => {
+	it('reads the bare key', () => {
+		const { default: get } = loadGetModule('/');
+		localStorage.setItem('AUTH_TOKEN', 'tok');
+		expect(get('AUTH_TOKEN')).toBe('tok');
+	});
+
+	it('returns null when key is absent', () => {
+		const { default: get } = loadGetModule('/');
+		expect(get('MISSING')).toBeNull();
+	});
+
+	it('does NOT promote bare keys (no-op at root)', () => {
+		const { default: get } = loadGetModule('/');
+		localStorage.setItem('THEME', 'light');
+		get('THEME');
+		// bare key must still be present — no migration at root
+		expect(localStorage.getItem('THEME')).toBe('light');
+	});
+});
+
+describe('get — prefixed path "/signoz/"', () => {
+	it('reads an already-scoped key directly', () => {
+		const { default: get } = loadGetModule('/signoz/');
+		localStorage.setItem('/signoz/AUTH_TOKEN', 'scoped-tok');
+		expect(get('AUTH_TOKEN')).toBe('scoped-tok');
+	});
+
+	it('returns null when neither scoped nor bare key exists', () => {
+		const { default: get } = loadGetModule('/signoz/');
+		expect(get('MISSING')).toBeNull();
+	});
+
+	it('lazy-migrates bare key to scoped key on first read', () => {
+		const { default: get } = loadGetModule('/signoz/');
+		localStorage.setItem('AUTH_TOKEN', 'old-tok');
+
+		const result = get('AUTH_TOKEN');
+
+		expect(result).toBe('old-tok');
+		expect(localStorage.getItem('/signoz/AUTH_TOKEN')).toBe('old-tok');
+		expect(localStorage.getItem('AUTH_TOKEN')).toBeNull();
+	});
+
+	it('scoped key takes precedence over bare key', () => {
+		const { default: get } = loadGetModule('/signoz/');
+		localStorage.setItem('AUTH_TOKEN', 'bare-tok');
+		localStorage.setItem('/signoz/AUTH_TOKEN', 'scoped-tok');
+
+		expect(get('AUTH_TOKEN')).toBe('scoped-tok');
+		// bare key left untouched — scoped already existed
+		expect(localStorage.getItem('AUTH_TOKEN')).toBe('bare-tok');
+	});
+
+	it('subsequent reads after migration use scoped key (no double-write)', () => {
+		const { default: get } = loadGetModule('/signoz/');
+		localStorage.setItem('THEME', 'dark');
+
+		get('THEME'); // triggers migration
+		localStorage.removeItem('THEME'); // simulate bare key gone
+
+		// second read still finds the scoped key
+		expect(get('THEME')).toBe('dark');
+	});
+});
+
+describe('get — two-prefix isolation', () => {
+	it('/signoz/ and /testing/ do not share migrated values', () => {
+		localStorage.setItem('THEME', 'light');
+
+		const base1 = document.createElement('base');
+		base1.setAttribute('href', '/signoz/');
+		document.head.append(base1);
+		let getSignoz!: GetModule['default'];
+		jest.isolateModules(() => {
+			// oxlint-disable-next-line typescript-eslint/no-require-imports, typescript-eslint/no-var-requires
+			getSignoz = require('../get').default;
+		});
+		base1.remove();
+
+		// migrate bare → /signoz/THEME
+		getSignoz('THEME');
+
+		const base2 = document.createElement('base');
+		base2.setAttribute('href', '/testing/');
+		document.head.append(base2);
+		let getTesting!: GetModule['default'];
+		jest.isolateModules(() => {
+			// oxlint-disable-next-line typescript-eslint/no-require-imports, typescript-eslint/no-var-requires
+			getTesting = require('../get').default;
+		});
+		base2.remove();
+
+		// /testing/ prefix: bare key already gone, scoped key does not exist
+		expect(getTesting('THEME')).toBeNull();
+		expect(localStorage.getItem('/signoz/THEME')).toBe('light');
+		expect(localStorage.getItem('/testing/THEME')).toBeNull();
+	});
+});
+
+export {};

frontend/src/api/browser/localstorage/get.ts

@@ -1,7 +1,26 @@
+/* oxlint-disable no-restricted-globals */
+import { getBasePath } from 'utils/basePath';
+import { getScopedKey } from 'utils/storage';
+
 const get = (key: string): string | null => {
 	try {
-		return localStorage.getItem(key);
-	} catch (e) {
+		const scopedKey = getScopedKey(key);
+		const value = localStorage.getItem(scopedKey);
+
+		// Lazy migration: if running under a URL prefix and the scoped key doesn't
+		// exist yet, fall back to the bare key (written by a previous root deployment).
+		// Promote it to the scoped key and remove the bare key so future reads are fast.
+		if (value === null && getBasePath() !== '/') {
+			const bare = localStorage.getItem(key);
+			if (bare !== null) {
+				localStorage.setItem(scopedKey, bare);
+				localStorage.removeItem(key);
+				return bare;
+			}
+		}
+
+		return value;
+	} catch {
 		return '';
 	}
 };

frontend/src/api/browser/localstorage/remove.ts

@@ -1,8 +1,11 @@
+/* oxlint-disable no-restricted-globals */
+import { getScopedKey } from 'utils/storage';
+
 const remove = (key: string): boolean => {
 	try {
-		window.localStorage.removeItem(key);
+		localStorage.removeItem(getScopedKey(key));
 		return true;
-	} catch (e) {
+	} catch {
 		return false;
 	}
 };

frontend/src/api/browser/localstorage/set.ts

@@ -1,8 +1,11 @@
+/* oxlint-disable no-restricted-globals */
+import { getScopedKey } from 'utils/storage';
+
 const set = (key: string, value: string): boolean => {
 	try {
-		localStorage.setItem(key, value);
+		localStorage.setItem(getScopedKey(key), value);
 		return true;
-	} catch (e) {
+	} catch {
 		return false;
 	}
 };

frontend/src/api/browser/sessionstorage/__tests__/get.test.ts

@@ -0,0 +1,81 @@
+/**
+ * sessionstorage/get — lazy migration tests.
+ * Mirrors the localStorage get tests; same logic, different storage.
+ */
+
+type GetModule = typeof import('../get');
+
+function loadGetModule(href: string): GetModule {
+	const base = document.createElement('base');
+	base.setAttribute('href', href);
+	document.head.append(base);
+
+	let mod!: GetModule;
+	jest.isolateModules(() => {
+		// oxlint-disable-next-line typescript-eslint/no-require-imports, typescript-eslint/no-var-requires
+		mod = require('../get');
+	});
+	return mod;
+}
+
+afterEach(() => {
+	for (const el of document.head.querySelectorAll('base')) {
+		el.remove();
+	}
+	sessionStorage.clear();
+});
+
+describe('get — root path "/"', () => {
+	it('reads the bare key', () => {
+		const { default: get } = loadGetModule('/');
+		sessionStorage.setItem('retry-lazy-refreshed', 'true');
+		expect(get('retry-lazy-refreshed')).toBe('true');
+	});
+
+	it('returns null when key is absent', () => {
+		const { default: get } = loadGetModule('/');
+		expect(get('MISSING')).toBeNull();
+	});
+
+	it('does NOT promote bare keys at root', () => {
+		const { default: get } = loadGetModule('/');
+		sessionStorage.setItem('retry-lazy-refreshed', 'true');
+		get('retry-lazy-refreshed');
+		expect(sessionStorage.getItem('retry-lazy-refreshed')).toBe('true');
+	});
+});
+
+describe('get — prefixed path "/signoz/"', () => {
+	it('reads an already-scoped key directly', () => {
+		const { default: get } = loadGetModule('/signoz/');
+		sessionStorage.setItem('/signoz/retry-lazy-refreshed', 'true');
+		expect(get('retry-lazy-refreshed')).toBe('true');
+	});
+
+	it('returns null when neither scoped nor bare key exists', () => {
+		const { default: get } = loadGetModule('/signoz/');
+		expect(get('MISSING')).toBeNull();
+	});
+
+	it('lazy-migrates bare key to scoped key on first read', () => {
+		const { default: get } = loadGetModule('/signoz/');
+		sessionStorage.setItem('retry-lazy-refreshed', 'true');
+
+		const result = get('retry-lazy-refreshed');
+
+		expect(result).toBe('true');
+		expect(sessionStorage.getItem('/signoz/retry-lazy-refreshed')).toBe('true');
+		expect(sessionStorage.getItem('retry-lazy-refreshed')).toBeNull();
+	});
+
+	it('scoped key takes precedence over bare key', () => {
+		const { default: get } = loadGetModule('/signoz/');
+		sessionStorage.setItem('retry-lazy-refreshed', 'bare');
+		sessionStorage.setItem('/signoz/retry-lazy-refreshed', 'scoped');
+
+		expect(get('retry-lazy-refreshed')).toBe('scoped');
+		expect(sessionStorage.getItem('retry-lazy-refreshed')).toBe('bare');
+	});
+});
+
+export {};

frontend/src/api/browser/sessionstorage/get.ts

@@ -0,0 +1,27 @@
+/* oxlint-disable no-restricted-globals */
+import { getBasePath } from 'utils/basePath';
+import { getScopedKey } from 'utils/storage';
+
+const get = (key: string): string | null => {
+	try {
+		const scopedKey = getScopedKey(key);
+		const value = sessionStorage.getItem(scopedKey);
+
+		// Lazy migration: same pattern as localStorage — promote bare keys written
+		// by a previous root deployment to the scoped key on first read.
+		if (value === null && getBasePath() !== '/') {
+			const bare = sessionStorage.getItem(key);
+			if (bare !== null) {
+				sessionStorage.setItem(scopedKey, bare);
+				sessionStorage.removeItem(key);
+				return bare;
+			}
+		}
+
+		return value;
+	} catch {
+		return '';
+	}
+};
+
+export default get;

frontend/src/api/browser/sessionstorage/remove.ts

@@ -0,0 +1,13 @@
+/* oxlint-disable no-restricted-globals */
+import { getScopedKey } from 'utils/storage';
+
+const remove = (key: string): boolean => {
+	try {
+		sessionStorage.removeItem(getScopedKey(key));
+		return true;
+	} catch {
+		return false;
+	}
+};
+
+export default remove;

frontend/src/api/browser/sessionstorage/set.ts

@@ -0,0 +1,13 @@
+/* oxlint-disable no-restricted-globals */
+import { getScopedKey } from 'utils/storage';
+
+const set = (key: string, value: string): boolean => {
+	try {
+		sessionStorage.setItem(getScopedKey(key), value);
+		return true;
+	} catch {
+		return false;
+	}
+};
+
+export default set;

frontend/src/api/dynamicVariables/__tests__/getFieldKeys.test.ts

@@ -104,7 +104,7 @@ describe('getFieldKeys API', () => {
 		const result = await getFieldKeys('traces');
 
 		// Verify the returned structure matches SuccessResponseV2 format
-		expect(result).toEqual({
+		expect(result).toStrictEqual({
 			httpStatusCode: 200,
 			data: mockSuccessResponse.data.data,
 		});

frontend/src/api/dynamicVariables/__tests__/getFieldValues.test.ts

@@ -199,7 +199,7 @@ describe('getFieldValues API', () => {
 		const result = await getFieldValues('traces', 'service.name');
 
 		// Verify the returned structure matches SuccessResponseV2 format
-		expect(result).toEqual({
+		expect(result).toStrictEqual({
 			httpStatusCode: 200,
 			data: expect.objectContaining({
 				values: expect.any(Object),

frontend/src/api/generated/services/dashboard/index.ts

@@ -18,10 +18,12 @@ import type {
 } from 'react-query';
 
 import type {
+	CreateDashboardV2201,
 	CreatePublicDashboard201,
 	CreatePublicDashboardPathParameters,
 	DashboardtypesPostablePublicDashboardDTO,
 	DashboardtypesUpdatablePublicDashboardDTO,
+	Dashboardtypesv2PostableDashboardDTO,
 	DeletePublicDashboardPathParameters,
 	GetPublicDashboard200,
 	GetPublicDashboardData200,
@@ -634,3 +636,88 @@ export const invalidateGetPublicDashboardWidgetQueryRange = async (
 
 	return queryClient;
 };
+
+/**
+ * This endpoint creates a v2-shape dashboard with structured metadata, a typed data tree, and resolved tags.
+ * @summary Create dashboard (v2)
+ */
+export const createDashboardV2 = (
+	dashboardtypesv2PostableDashboardDTO: BodyType<Dashboardtypesv2PostableDashboardDTO>,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<CreateDashboardV2201>({
+		url: `/api/v2/dashboards`,
+		method: 'POST',
+		headers: { 'Content-Type': 'application/json' },
+		data: dashboardtypesv2PostableDashboardDTO,
+		signal,
+	});
+};
+
+export const getCreateDashboardV2MutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof createDashboardV2>>,
+		TError,
+		{ data: BodyType<Dashboardtypesv2PostableDashboardDTO> },
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof createDashboardV2>>,
+	TError,
+	{ data: BodyType<Dashboardtypesv2PostableDashboardDTO> },
+	TContext
+> => {
+	const mutationKey = ['createDashboardV2'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+			'mutationKey' in options.mutation &&
+			options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof createDashboardV2>>,
+		{ data: BodyType<Dashboardtypesv2PostableDashboardDTO> }
+	> = (props) => {
+		const { data } = props ?? {};
+
+		return createDashboardV2(data);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type CreateDashboardV2MutationResult = NonNullable<
+	Awaited<ReturnType<typeof createDashboardV2>>
+>;
+export type CreateDashboardV2MutationBody =
+	BodyType<Dashboardtypesv2PostableDashboardDTO>;
+export type CreateDashboardV2MutationError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Create dashboard (v2)
+ */
+export const useCreateDashboardV2 = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof createDashboardV2>>,
+		TError,
+		{ data: BodyType<Dashboardtypesv2PostableDashboardDTO> },
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof createDashboardV2>>,
+	TError,
+	{ data: BodyType<Dashboardtypesv2PostableDashboardDTO> },
+	TContext
+> => {
+	const mutationOptions = getCreateDashboardV2MutationOptions(options);
+
+	return useMutation(mutationOptions);
+};

frontend/src/api/generated/services/spanmapper/index.ts

@@ -0,0 +1,787 @@
+/**
+ * ! Do not edit manually
+ * * The file has been auto-generated using Orval for SigNoz
+ * * regenerate with 'yarn generate:api'
+ * SigNoz
+ */
+import { useMutation, useQuery } from 'react-query';
+import type {
+	InvalidateOptions,
+	MutationFunction,
+	QueryClient,
+	QueryFunction,
+	QueryKey,
+	UseMutationOptions,
+	UseMutationResult,
+	UseQueryOptions,
+	UseQueryResult,
+} from 'react-query';
+
+import type {
+	CreateSpanMapper201,
+	CreateSpanMapperGroup201,
+	CreateSpanMapperPathParameters,
+	DeleteSpanMapperGroupPathParameters,
+	DeleteSpanMapperPathParameters,
+	ListSpanMapperGroups200,
+	ListSpanMapperGroupsParams,
+	ListSpanMappers200,
+	ListSpanMappersPathParameters,
+	RenderErrorResponseDTO,
+	SpantypesPostableSpanMapperDTO,
+	SpantypesPostableSpanMapperGroupDTO,
+	SpantypesUpdatableSpanMapperDTO,
+	SpantypesUpdatableSpanMapperGroupDTO,
+	UpdateSpanMapperGroupPathParameters,
+	UpdateSpanMapperPathParameters,
+} from '../sigNoz.schemas';
+
+import { GeneratedAPIInstance } from '../../../generatedAPIInstance';
+import type { ErrorType, BodyType } from '../../../generatedAPIInstance';
+
+/**
+ * Returns all span attribute mapping groups for the authenticated org.
+ * @summary List span attribute mapping groups
+ */
+export const listSpanMapperGroups = (
+	params?: ListSpanMapperGroupsParams,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<ListSpanMapperGroups200>({
+		url: `/api/v1/span_mapper_groups`,
+		method: 'GET',
+		params,
+		signal,
+	});
+};
+
+export const getListSpanMapperGroupsQueryKey = (
+	params?: ListSpanMapperGroupsParams,
+) => {
+	return [`/api/v1/span_mapper_groups`, ...(params ? [params] : [])] as const;
+};
+
+export const getListSpanMapperGroupsQueryOptions = <
+	TData = Awaited<ReturnType<typeof listSpanMapperGroups>>,
+	TError = ErrorType<RenderErrorResponseDTO>,
+>(
+	params?: ListSpanMapperGroupsParams,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof listSpanMapperGroups>>,
+			TError,
+			TData
+		>;
+	},
+) => {
+	const { query: queryOptions } = options ?? {};
+
+	const queryKey =
+		queryOptions?.queryKey ?? getListSpanMapperGroupsQueryKey(params);
+
+	const queryFn: QueryFunction<
+		Awaited<ReturnType<typeof listSpanMapperGroups>>
+	> = ({ signal }) => listSpanMapperGroups(params, signal);
+
+	return { queryKey, queryFn, ...queryOptions } as UseQueryOptions<
+		Awaited<ReturnType<typeof listSpanMapperGroups>>,
+		TError,
+		TData
+	> & { queryKey: QueryKey };
+};
+
+export type ListSpanMapperGroupsQueryResult = NonNullable<
+	Awaited<ReturnType<typeof listSpanMapperGroups>>
+>;
+export type ListSpanMapperGroupsQueryError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary List span attribute mapping groups
+ */
+
+export function useListSpanMapperGroups<
+	TData = Awaited<ReturnType<typeof listSpanMapperGroups>>,
+	TError = ErrorType<RenderErrorResponseDTO>,
+>(
+	params?: ListSpanMapperGroupsParams,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof listSpanMapperGroups>>,
+			TError,
+			TData
+		>;
+	},
+): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
+	const queryOptions = getListSpanMapperGroupsQueryOptions(params, options);
+
+	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
+		queryKey: QueryKey;
+	};
+
+	query.queryKey = queryOptions.queryKey;
+
+	return query;
+}
+
+/**
+ * @summary List span attribute mapping groups
+ */
+export const invalidateListSpanMapperGroups = async (
+	queryClient: QueryClient,
+	params?: ListSpanMapperGroupsParams,
+	options?: InvalidateOptions,
+): Promise<QueryClient> => {
+	await queryClient.invalidateQueries(
+		{ queryKey: getListSpanMapperGroupsQueryKey(params) },
+		options,
+	);
+
+	return queryClient;
+};
+
+/**
+ * Creates a new span attribute mapping group for the org.
+ * @summary Create a span attribute mapping group
+ */
+export const createSpanMapperGroup = (
+	spantypesPostableSpanMapperGroupDTO: BodyType<SpantypesPostableSpanMapperGroupDTO>,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<CreateSpanMapperGroup201>({
+		url: `/api/v1/span_mapper_groups`,
+		method: 'POST',
+		headers: { 'Content-Type': 'application/json' },
+		data: spantypesPostableSpanMapperGroupDTO,
+		signal,
+	});
+};
+
+export const getCreateSpanMapperGroupMutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof createSpanMapperGroup>>,
+		TError,
+		{ data: BodyType<SpantypesPostableSpanMapperGroupDTO> },
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof createSpanMapperGroup>>,
+	TError,
+	{ data: BodyType<SpantypesPostableSpanMapperGroupDTO> },
+	TContext
+> => {
+	const mutationKey = ['createSpanMapperGroup'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+			'mutationKey' in options.mutation &&
+			options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof createSpanMapperGroup>>,
+		{ data: BodyType<SpantypesPostableSpanMapperGroupDTO> }
+	> = (props) => {
+		const { data } = props ?? {};
+
+		return createSpanMapperGroup(data);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type CreateSpanMapperGroupMutationResult = NonNullable<
+	Awaited<ReturnType<typeof createSpanMapperGroup>>
+>;
+export type CreateSpanMapperGroupMutationBody =
+	BodyType<SpantypesPostableSpanMapperGroupDTO>;
+export type CreateSpanMapperGroupMutationError =
+	ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Create a span attribute mapping group
+ */
+export const useCreateSpanMapperGroup = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof createSpanMapperGroup>>,
+		TError,
+		{ data: BodyType<SpantypesPostableSpanMapperGroupDTO> },
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof createSpanMapperGroup>>,
+	TError,
+	{ data: BodyType<SpantypesPostableSpanMapperGroupDTO> },
+	TContext
+> => {
+	const mutationOptions = getCreateSpanMapperGroupMutationOptions(options);
+
+	return useMutation(mutationOptions);
+};
+/**
+ * Hard-deletes a mapping group and cascades to all its mappers.
+ * @summary Delete a span attribute mapping group
+ */
+export const deleteSpanMapperGroup = ({
+	groupId,
+}: DeleteSpanMapperGroupPathParameters) => {
+	return GeneratedAPIInstance<void>({
+		url: `/api/v1/span_mapper_groups/${groupId}`,
+		method: 'DELETE',
+	});
+};
+
+export const getDeleteSpanMapperGroupMutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof deleteSpanMapperGroup>>,
+		TError,
+		{ pathParams: DeleteSpanMapperGroupPathParameters },
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof deleteSpanMapperGroup>>,
+	TError,
+	{ pathParams: DeleteSpanMapperGroupPathParameters },
+	TContext
+> => {
+	const mutationKey = ['deleteSpanMapperGroup'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+			'mutationKey' in options.mutation &&
+			options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof deleteSpanMapperGroup>>,
+		{ pathParams: DeleteSpanMapperGroupPathParameters }
+	> = (props) => {
+		const { pathParams } = props ?? {};
+
+		return deleteSpanMapperGroup(pathParams);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type DeleteSpanMapperGroupMutationResult = NonNullable<
+	Awaited<ReturnType<typeof deleteSpanMapperGroup>>
+>;
+
+export type DeleteSpanMapperGroupMutationError =
+	ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Delete a span attribute mapping group
+ */
+export const useDeleteSpanMapperGroup = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof deleteSpanMapperGroup>>,
+		TError,
+		{ pathParams: DeleteSpanMapperGroupPathParameters },
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof deleteSpanMapperGroup>>,
+	TError,
+	{ pathParams: DeleteSpanMapperGroupPathParameters },
+	TContext
+> => {
+	const mutationOptions = getDeleteSpanMapperGroupMutationOptions(options);
+
+	return useMutation(mutationOptions);
+};
+/**
+ * Partially updates an existing mapping group's name, condition, or enabled state.
+ * @summary Update a span attribute mapping group
+ */
+export const updateSpanMapperGroup = (
+	{ groupId }: UpdateSpanMapperGroupPathParameters,
+	spantypesUpdatableSpanMapperGroupDTO: BodyType<SpantypesUpdatableSpanMapperGroupDTO>,
+) => {
+	return GeneratedAPIInstance<void>({
+		url: `/api/v1/span_mapper_groups/${groupId}`,
+		method: 'PATCH',
+		headers: { 'Content-Type': 'application/json' },
+		data: spantypesUpdatableSpanMapperGroupDTO,
+	});
+};
+
+export const getUpdateSpanMapperGroupMutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof updateSpanMapperGroup>>,
+		TError,
+		{
+			pathParams: UpdateSpanMapperGroupPathParameters;
+			data: BodyType<SpantypesUpdatableSpanMapperGroupDTO>;
+		},
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof updateSpanMapperGroup>>,
+	TError,
+	{
+		pathParams: UpdateSpanMapperGroupPathParameters;
+		data: BodyType<SpantypesUpdatableSpanMapperGroupDTO>;
+	},
+	TContext
+> => {
+	const mutationKey = ['updateSpanMapperGroup'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+			'mutationKey' in options.mutation &&
+			options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof updateSpanMapperGroup>>,
+		{
+			pathParams: UpdateSpanMapperGroupPathParameters;
+			data: BodyType<SpantypesUpdatableSpanMapperGroupDTO>;
+		}
+	> = (props) => {
+		const { pathParams, data } = props ?? {};
+
+		return updateSpanMapperGroup(pathParams, data);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type UpdateSpanMapperGroupMutationResult = NonNullable<
+	Awaited<ReturnType<typeof updateSpanMapperGroup>>
+>;
+export type UpdateSpanMapperGroupMutationBody =
+	BodyType<SpantypesUpdatableSpanMapperGroupDTO>;
+export type UpdateSpanMapperGroupMutationError =
+	ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Update a span attribute mapping group
+ */
+export const useUpdateSpanMapperGroup = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof updateSpanMapperGroup>>,
+		TError,
+		{
+			pathParams: UpdateSpanMapperGroupPathParameters;
+			data: BodyType<SpantypesUpdatableSpanMapperGroupDTO>;
+		},
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof updateSpanMapperGroup>>,
+	TError,
+	{
+		pathParams: UpdateSpanMapperGroupPathParameters;
+		data: BodyType<SpantypesUpdatableSpanMapperGroupDTO>;
+	},
+	TContext
+> => {
+	const mutationOptions = getUpdateSpanMapperGroupMutationOptions(options);
+
+	return useMutation(mutationOptions);
+};
+/**
+ * Returns all mappers belonging to a mapping group.
+ * @summary List span mappers for a group
+ */
+export const listSpanMappers = (
+	{ groupId }: ListSpanMappersPathParameters,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<ListSpanMappers200>({
+		url: `/api/v1/span_mapper_groups/${groupId}/span_mappers`,
+		method: 'GET',
+		signal,
+	});
+};
+
+export const getListSpanMappersQueryKey = ({
+	groupId,
+}: ListSpanMappersPathParameters) => {
+	return [`/api/v1/span_mapper_groups/${groupId}/span_mappers`] as const;
+};
+
+export const getListSpanMappersQueryOptions = <
+	TData = Awaited<ReturnType<typeof listSpanMappers>>,
+	TError = ErrorType<RenderErrorResponseDTO>,
+>(
+	{ groupId }: ListSpanMappersPathParameters,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof listSpanMappers>>,
+			TError,
+			TData
+		>;
+	},
+) => {
+	const { query: queryOptions } = options ?? {};
+
+	const queryKey =
+		queryOptions?.queryKey ?? getListSpanMappersQueryKey({ groupId });
+
+	const queryFn: QueryFunction<Awaited<ReturnType<typeof listSpanMappers>>> = ({
+		signal,
+	}) => listSpanMappers({ groupId }, signal);
+
+	return {
+		queryKey,
+		queryFn,
+		enabled: !!groupId,
+		...queryOptions,
+	} as UseQueryOptions<
+		Awaited<ReturnType<typeof listSpanMappers>>,
+		TError,
+		TData
+	> & { queryKey: QueryKey };
+};
+
+export type ListSpanMappersQueryResult = NonNullable<
+	Awaited<ReturnType<typeof listSpanMappers>>
+>;
+export type ListSpanMappersQueryError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary List span mappers for a group
+ */
+
+export function useListSpanMappers<
+	TData = Awaited<ReturnType<typeof listSpanMappers>>,
+	TError = ErrorType<RenderErrorResponseDTO>,
+>(
+	{ groupId }: ListSpanMappersPathParameters,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof listSpanMappers>>,
+			TError,
+			TData
+		>;
+	},
+): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
+	const queryOptions = getListSpanMappersQueryOptions({ groupId }, options);
+
+	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
+		queryKey: QueryKey;
+	};
+
+	query.queryKey = queryOptions.queryKey;
+
+	return query;
+}
+
+/**
+ * @summary List span mappers for a group
+ */
+export const invalidateListSpanMappers = async (
+	queryClient: QueryClient,
+	{ groupId }: ListSpanMappersPathParameters,
+	options?: InvalidateOptions,
+): Promise<QueryClient> => {
+	await queryClient.invalidateQueries(
+		{ queryKey: getListSpanMappersQueryKey({ groupId }) },
+		options,
+	);
+
+	return queryClient;
+};
+
+/**
+ * Adds a new mapper to the specified mapping group.
+ * @summary Create a span mapper
+ */
+export const createSpanMapper = (
+	{ groupId }: CreateSpanMapperPathParameters,
+	spantypesPostableSpanMapperDTO: BodyType<SpantypesPostableSpanMapperDTO>,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<CreateSpanMapper201>({
+		url: `/api/v1/span_mapper_groups/${groupId}/span_mappers`,
+		method: 'POST',
+		headers: { 'Content-Type': 'application/json' },
+		data: spantypesPostableSpanMapperDTO,
+		signal,
+	});
+};
+
+export const getCreateSpanMapperMutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof createSpanMapper>>,
+		TError,
+		{
+			pathParams: CreateSpanMapperPathParameters;
+			data: BodyType<SpantypesPostableSpanMapperDTO>;
+		},
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof createSpanMapper>>,
+	TError,
+	{
+		pathParams: CreateSpanMapperPathParameters;
+		data: BodyType<SpantypesPostableSpanMapperDTO>;
+	},
+	TContext
+> => {
+	const mutationKey = ['createSpanMapper'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+			'mutationKey' in options.mutation &&
+			options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof createSpanMapper>>,
+		{
+			pathParams: CreateSpanMapperPathParameters;
+			data: BodyType<SpantypesPostableSpanMapperDTO>;
+		}
+	> = (props) => {
+		const { pathParams, data } = props ?? {};
+
+		return createSpanMapper(pathParams, data);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type CreateSpanMapperMutationResult = NonNullable<
+	Awaited<ReturnType<typeof createSpanMapper>>
+>;
+export type CreateSpanMapperMutationBody =
+	BodyType<SpantypesPostableSpanMapperDTO>;
+export type CreateSpanMapperMutationError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Create a span mapper
+ */
+export const useCreateSpanMapper = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof createSpanMapper>>,
+		TError,
+		{
+			pathParams: CreateSpanMapperPathParameters;
+			data: BodyType<SpantypesPostableSpanMapperDTO>;
+		},
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof createSpanMapper>>,
+	TError,
+	{
+		pathParams: CreateSpanMapperPathParameters;
+		data: BodyType<SpantypesPostableSpanMapperDTO>;
+	},
+	TContext
+> => {
+	const mutationOptions = getCreateSpanMapperMutationOptions(options);
+
+	return useMutation(mutationOptions);
+};
+/**
+ * Hard-deletes a mapper from a mapping group.
+ * @summary Delete a span mapper
+ */
+export const deleteSpanMapper = ({
+	groupId,
+	mapperId,
+}: DeleteSpanMapperPathParameters) => {
+	return GeneratedAPIInstance<void>({
+		url: `/api/v1/span_mapper_groups/${groupId}/span_mappers/${mapperId}`,
+		method: 'DELETE',
+	});
+};
+
+export const getDeleteSpanMapperMutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof deleteSpanMapper>>,
+		TError,
+		{ pathParams: DeleteSpanMapperPathParameters },
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof deleteSpanMapper>>,
+	TError,
+	{ pathParams: DeleteSpanMapperPathParameters },
+	TContext
+> => {
+	const mutationKey = ['deleteSpanMapper'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+			'mutationKey' in options.mutation &&
+			options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof deleteSpanMapper>>,
+		{ pathParams: DeleteSpanMapperPathParameters }
+	> = (props) => {
+		const { pathParams } = props ?? {};
+
+		return deleteSpanMapper(pathParams);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type DeleteSpanMapperMutationResult = NonNullable<
+	Awaited<ReturnType<typeof deleteSpanMapper>>
+>;
+
+export type DeleteSpanMapperMutationError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Delete a span mapper
+ */
+export const useDeleteSpanMapper = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof deleteSpanMapper>>,
+		TError,
+		{ pathParams: DeleteSpanMapperPathParameters },
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof deleteSpanMapper>>,
+	TError,
+	{ pathParams: DeleteSpanMapperPathParameters },
+	TContext
+> => {
+	const mutationOptions = getDeleteSpanMapperMutationOptions(options);
+
+	return useMutation(mutationOptions);
+};
+/**
+ * Partially updates an existing mapper's field context, config, or enabled state.
+ * @summary Update a span mapper
+ */
+export const updateSpanMapper = (
+	{ groupId, mapperId }: UpdateSpanMapperPathParameters,
+	spantypesUpdatableSpanMapperDTO: BodyType<SpantypesUpdatableSpanMapperDTO>,
+) => {
+	return GeneratedAPIInstance<void>({
+		url: `/api/v1/span_mapper_groups/${groupId}/span_mappers/${mapperId}`,
+		method: 'PATCH',
+		headers: { 'Content-Type': 'application/json' },
+		data: spantypesUpdatableSpanMapperDTO,
+	});
+};
+
+export const getUpdateSpanMapperMutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof updateSpanMapper>>,
+		TError,
+		{
+			pathParams: UpdateSpanMapperPathParameters;
+			data: BodyType<SpantypesUpdatableSpanMapperDTO>;
+		},
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof updateSpanMapper>>,
+	TError,
+	{
+		pathParams: UpdateSpanMapperPathParameters;
+		data: BodyType<SpantypesUpdatableSpanMapperDTO>;
+	},
+	TContext
+> => {
+	const mutationKey = ['updateSpanMapper'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+			'mutationKey' in options.mutation &&
+			options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof updateSpanMapper>>,
+		{
+			pathParams: UpdateSpanMapperPathParameters;
+			data: BodyType<SpantypesUpdatableSpanMapperDTO>;
+		}
+	> = (props) => {
+		const { pathParams, data } = props ?? {};
+
+		return updateSpanMapper(pathParams, data);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type UpdateSpanMapperMutationResult = NonNullable<
+	Awaited<ReturnType<typeof updateSpanMapper>>
+>;
+export type UpdateSpanMapperMutationBody =
+	BodyType<SpantypesUpdatableSpanMapperDTO>;
+export type UpdateSpanMapperMutationError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Update a span mapper
+ */
+export const useUpdateSpanMapper = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof updateSpanMapper>>,
+		TError,
+		{
+			pathParams: UpdateSpanMapperPathParameters;
+			data: BodyType<SpantypesUpdatableSpanMapperDTO>;
+		},
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof updateSpanMapper>>,
+	TError,
+	{
+		pathParams: UpdateSpanMapperPathParameters;
+		data: BodyType<SpantypesUpdatableSpanMapperDTO>;
+	},
+	TContext
+> => {
+	const mutationOptions = getUpdateSpanMapperMutationOptions(options);
+
+	return useMutation(mutationOptions);
+};

frontend/src/api/generated/services/tracedetail/index.ts

@@ -0,0 +1,123 @@
+/**
+ * ! Do not edit manually
+ * * The file has been auto-generated using Orval for SigNoz
+ * * regenerate with 'yarn generate:api'
+ * SigNoz
+ */
+import { useMutation } from 'react-query';
+import type {
+	MutationFunction,
+	UseMutationOptions,
+	UseMutationResult,
+} from 'react-query';
+
+import type {
+	GetWaterfall200,
+	GetWaterfallPathParameters,
+	RenderErrorResponseDTO,
+	TracedetailtypesPostableWaterfallDTO,
+} from '../sigNoz.schemas';
+
+import { GeneratedAPIInstance } from '../../../generatedAPIInstance';
+import type { ErrorType, BodyType } from '../../../generatedAPIInstance';
+
+/**
+ * Returns the waterfall view of spans for a given trace ID with tree structure, metadata, and windowed pagination
+ * @summary Get waterfall view for a trace
+ */
+export const getWaterfall = (
+	{ traceID }: GetWaterfallPathParameters,
+	tracedetailtypesPostableWaterfallDTO: BodyType<TracedetailtypesPostableWaterfallDTO>,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<GetWaterfall200>({
+		url: `/api/v3/traces/${traceID}/waterfall`,
+		method: 'POST',
+		headers: { 'Content-Type': 'application/json' },
+		data: tracedetailtypesPostableWaterfallDTO,
+		signal,
+	});
+};
+
+export const getGetWaterfallMutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof getWaterfall>>,
+		TError,
+		{
+			pathParams: GetWaterfallPathParameters;
+			data: BodyType<TracedetailtypesPostableWaterfallDTO>;
+		},
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof getWaterfall>>,
+	TError,
+	{
+		pathParams: GetWaterfallPathParameters;
+		data: BodyType<TracedetailtypesPostableWaterfallDTO>;
+	},
+	TContext
+> => {
+	const mutationKey = ['getWaterfall'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+			'mutationKey' in options.mutation &&
+			options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof getWaterfall>>,
+		{
+			pathParams: GetWaterfallPathParameters;
+			data: BodyType<TracedetailtypesPostableWaterfallDTO>;
+		}
+	> = (props) => {
+		const { pathParams, data } = props ?? {};
+
+		return getWaterfall(pathParams, data);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type GetWaterfallMutationResult = NonNullable<
+	Awaited<ReturnType<typeof getWaterfall>>
+>;
+export type GetWaterfallMutationBody =
+	BodyType<TracedetailtypesPostableWaterfallDTO>;
+export type GetWaterfallMutationError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Get waterfall view for a trace
+ */
+export const useGetWaterfall = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof getWaterfall>>,
+		TError,
+		{
+			pathParams: GetWaterfallPathParameters;
+			data: BodyType<TracedetailtypesPostableWaterfallDTO>;
+		},
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof getWaterfall>>,
+	TError,
+	{
+		pathParams: GetWaterfallPathParameters;
+		data: BodyType<TracedetailtypesPostableWaterfallDTO>;
+	},
+	TContext
+> => {
+	const mutationOptions = getGetWaterfallMutationOptions(options);
+
+	return useMutation(mutationOptions);
+};

frontend/src/api/generatedAPIInstance.ts

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

frontend/src/api/globalConfig/getGlobalConfig.ts

@@ -1,25 +0,0 @@
-import axios from 'api';
-import { ErrorResponseHandlerV2 } from 'api/ErrorResponseHandlerV2';
-import { AxiosError } from 'axios';
-import { ErrorV2Resp, SuccessResponseV2 } from 'types/api';
-import {
-	GlobalConfigData,
-	GlobalConfigDataProps,
-} from 'types/api/globalConfig/types';
-
-const getGlobalConfig = async (): Promise<
-	SuccessResponseV2<GlobalConfigData>
-> => {
-	try {
-		const response = await axios.get<GlobalConfigDataProps>(`/global/config`);
-
-		return {
-			httpStatusCode: response.status,
-			data: response.data.data,
-		};
-	} catch (error) {
-		ErrorResponseHandlerV2(error as AxiosError<ErrorV2Resp>);
-	}
-};
-
-export default getGlobalConfig;

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/basePath';
 import { eventEmitter } from 'utils/getEventEmitter';
 
 import apiV1, { apiAlertManager, apiV2, apiV3, apiV4, apiV5 } from './apiV1';
@@ -67,6 +68,39 @@ export const interceptorsRequestResponse = (
 	return value;
 };
 
+// Strips the leading '/' from path and joins with base — idempotent if already prefixed.
+// e.g. prependBase('/signoz/', '/api/v1/') → '/signoz/api/v1/'
+function prependBase(base: string, path: string): string {
+	return path.startsWith(base) ? path : base + path.slice(1);
+}
+
+// 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('/')) {
+		// Production relative baseURL: '/api/v1/' → '/signoz/api/v1/'
+		value.baseURL = prependBase(basePath, value.baseURL);
+	} else if (value.baseURL?.startsWith('http')) {
+		// Dev absolute baseURL (VITE_FRONTEND_API_ENDPOINT): 'https://host/api/v1/' → 'https://host/signoz/api/v1/'
+		const url = new URL(value.baseURL);
+		url.pathname = prependBase(basePath, url.pathname);
+		value.baseURL = url.toString();
+	} else if (!value.baseURL && value.url?.startsWith('/')) {
+		// Orval-generated client (empty baseURL, path in url): '/api/signoz/v1/rules' → '/signoz/api/signoz/v1/rules'
+		value.url = prependBase(basePath, value.url);
+	}
+
+	return value;
+};
+
 export const interceptorRejected = async (
 	value: AxiosResponse<any>,
 ): Promise<AxiosResponse<any>> => {
@@ -133,6 +167,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 +182,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 +194,7 @@ ApiV3Instance.interceptors.response.use(
 	interceptorRejected,
 );
 ApiV3Instance.interceptors.request.use(interceptorsRequestResponse);
+ApiV3Instance.interceptors.request.use(interceptorsRequestBasePath);
 //
 
 // axios V4
@@ -170,6 +207,7 @@ ApiV4Instance.interceptors.response.use(
 	interceptorRejected,
 );
 ApiV4Instance.interceptors.request.use(interceptorsRequestResponse);
+ApiV4Instance.interceptors.request.use(interceptorsRequestBasePath);
 //
 
 // axios V5
@@ -182,6 +220,7 @@ ApiV5Instance.interceptors.response.use(
 	interceptorRejected,
 );
 ApiV5Instance.interceptors.request.use(interceptorsRequestResponse);
+ApiV5Instance.interceptors.request.use(interceptorsRequestBasePath);
 //
 
 // axios Base
@@ -194,6 +233,7 @@ LogEventAxiosInstance.interceptors.response.use(
 	interceptorRejectedBase,
 );
 LogEventAxiosInstance.interceptors.request.use(interceptorsRequestResponse);
+LogEventAxiosInstance.interceptors.request.use(interceptorsRequestBasePath);
 //
 
 AxiosAlertManagerInstance.interceptors.response.use(
@@ -201,6 +241,7 @@ AxiosAlertManagerInstance.interceptors.response.use(
 	interceptorRejected,
 );
 AxiosAlertManagerInstance.interceptors.request.use(interceptorsRequestResponse);
+AxiosAlertManagerInstance.interceptors.request.use(interceptorsRequestBasePath);
 
 export { apiV1 };
 export default instance;

frontend/src/api/interceptors.test.ts

@@ -39,8 +39,8 @@ jest.mock('axios', () => {
 describe('interceptorRejected', () => {
 	beforeEach(() => {
 		jest.clearAllMocks();
-		((axios as unknown) as jest.Mock).mockResolvedValue({ data: 'success' });
-		((axios.isAxiosError as unknown) as jest.Mock).mockReturnValue(true);
+		(axios as unknown as jest.Mock).mockResolvedValue({ data: 'success' });
+		(axios.isAxiosError as unknown as jest.Mock).mockReturnValue(true);
 	});
 
 	it('should preserve array payload structure when retrying a 401 request', async () => {
@@ -49,7 +49,7 @@ describe('interceptorRejected', () => {
 			{ relation: 'assignee', object: { resource: { name: 'editor' } } },
 		];
 
-		const error = ({
+		const error = {
 			response: {
 				status: 401,
 				config: {
@@ -67,7 +67,7 @@ describe('interceptorRejected', () => {
 				headers: new AxiosHeaders(),
 				data: JSON.stringify(arrayPayload),
 			},
-		} as unknown) as AxiosResponse;
+		} as unknown as AxiosResponse;
 
 		try {
 			await interceptorRejected(error);
@@ -75,17 +75,17 @@ describe('interceptorRejected', () => {
 			// Expected to reject after retry
 		}
 
-		const mockAxiosFn = (axios as unknown) as jest.Mock;
-		expect(mockAxiosFn.mock.calls.length).toBe(1);
+		const mockAxiosFn = axios as unknown as jest.Mock;
+		expect(mockAxiosFn.mock.calls).toHaveLength(1);
 		const retryCallConfig = mockAxiosFn.mock.calls[0][0];
 		expect(Array.isArray(JSON.parse(retryCallConfig.data))).toBe(true);
-		expect(JSON.parse(retryCallConfig.data)).toEqual(arrayPayload);
+		expect(JSON.parse(retryCallConfig.data)).toStrictEqual(arrayPayload);
 	});
 
 	it('should preserve object payload structure when retrying a 401 request', async () => {
 		const objectPayload = { key: 'value', nested: { data: 123 } };
 
-		const error = ({
+		const error = {
 			response: {
 				status: 401,
 				config: {
@@ -103,7 +103,7 @@ describe('interceptorRejected', () => {
 				headers: new AxiosHeaders(),
 				data: JSON.stringify(objectPayload),
 			},
-		} as unknown) as AxiosResponse;
+		} as unknown as AxiosResponse;
 
 		try {
 			await interceptorRejected(error);
@@ -111,14 +111,14 @@ describe('interceptorRejected', () => {
 			// Expected to reject after retry
 		}
 
-		const mockAxiosFn = (axios as unknown) as jest.Mock;
-		expect(mockAxiosFn.mock.calls.length).toBe(1);
+		const mockAxiosFn = axios as unknown as jest.Mock;
+		expect(mockAxiosFn.mock.calls).toHaveLength(1);
 		const retryCallConfig = mockAxiosFn.mock.calls[0][0];
-		expect(JSON.parse(retryCallConfig.data)).toEqual(objectPayload);
+		expect(JSON.parse(retryCallConfig.data)).toStrictEqual(objectPayload);
 	});
 
 	it('should handle undefined data gracefully when retrying', async () => {
-		const error = ({
+		const error = {
 			response: {
 				status: 401,
 				config: {
@@ -136,7 +136,7 @@ describe('interceptorRejected', () => {
 				headers: new AxiosHeaders(),
 				data: undefined,
 			},
-		} as unknown) as AxiosResponse;
+		} as unknown as AxiosResponse;
 
 		try {
 			await interceptorRejected(error);
@@ -144,8 +144,8 @@ describe('interceptorRejected', () => {
 			// Expected to reject after retry
 		}
 
-		const mockAxiosFn = (axios as unknown) as jest.Mock;
-		expect(mockAxiosFn.mock.calls.length).toBe(1);
+		const mockAxiosFn = axios as unknown as jest.Mock;
+		expect(mockAxiosFn.mock.calls).toHaveLength(1);
 		const retryCallConfig = mockAxiosFn.mock.calls[0][0];
 		expect(retryCallConfig.data).toBeUndefined();
 	});

frontend/src/api/logs/livetail.ts

@@ -3,13 +3,16 @@ import getLocalStorageKey from 'api/browser/localstorage/get';
 import { ENVIRONMENT } from 'constants/env';
 import { LOCALSTORAGE } from 'constants/localStorage';
 import { EventSourcePolyfill } from 'event-source-polyfill';
+import { withBasePath } from 'utils/basePath';
 
 // 10 min in ms
 const TIMEOUT_IN_MS = 10 * 60 * 1000;
 
 export const LiveTail = (queryParams: string): EventSourcePolyfill =>
 	new EventSourcePolyfill(
-		`${ENVIRONMENT.baseURL}${apiV1}logs/tail?${queryParams}`,
+		ENVIRONMENT.baseURL
+			? `${ENVIRONMENT.baseURL}${apiV1}logs/tail?${queryParams}`
+			: withBasePath(`${apiV1}logs/tail?${queryParams}`),
 		{
 			headers: {
 				Authorization: `Bearer ${getLocalStorageKey(LOCALSTORAGE.AUTH_TOKEN)}`,

frontend/src/api/settings/getRetentionV2.ts

@@ -9,9 +9,8 @@ const getRetentionV2 = async (): Promise<
 	SuccessResponseV2<PayloadProps<'logs'>>
 > => {
 	try {
-		const response = await ApiV2Instance.get<PayloadProps<'logs'>>(
-			`/settings/ttl`,
-		);
+		const response =
+			await ApiV2Instance.get<PayloadProps<'logs'>>(`/settings/ttl`);
 
 		return {
 			httpStatusCode: response.status,

frontend/src/api/v5/queryRange/convertV5Response.test.ts

@@ -52,18 +52,18 @@ describe('convertV5ResponseToLegacy', () => {
 					alias: '__result_0',
 					meta: {},
 					series: [
-						({
+						{
 							labels: [
 								{
-									key: ({ name: 'service.name' } as unknown) as TelemetryFieldKey,
+									key: { name: 'service.name' } as unknown as TelemetryFieldKey,
 									value: 'adservice',
 								},
 							],
 							values: [
-								({ timestamp: 1000, value: 10 } as unknown) as TimeSeriesValue,
-								({ timestamp: 2000, value: 12 } as unknown) as TimeSeriesValue,
+								{ timestamp: 1000, value: 10 } as unknown as TimeSeriesValue,
+								{ timestamp: 2000, value: 12 } as unknown as TimeSeriesValue,
 							],
-						} as unknown) as TimeSeries,
+						} as unknown as TimeSeries,
 					],
 				},
 			],
@@ -88,10 +88,8 @@ describe('convertV5ResponseToLegacy', () => {
 			},
 		]);
 
-		const input: SuccessResponse<
-			MetricRangePayloadV5,
-			QueryRangeRequestV5
-		> = makeBaseSuccess({ data: v5Data }, params);
+		const input: SuccessResponse<MetricRangePayloadV5, QueryRangeRequestV5> =
+			makeBaseSuccess({ data: v5Data }, params);
 
 		const legendMap = { A: '{{service.name}}' };
 		const result = convertV5ResponseToLegacy(input, legendMap, false);
@@ -101,7 +99,7 @@ describe('convertV5ResponseToLegacy', () => {
 		const q = result.payload.data.result[0];
 		expect(q.queryName).toBe('A');
 		expect(q.legend).toBe('{{service.name}}');
-		expect(q.series?.[0]).toEqual(
+		expect(q.series?.[0]).toStrictEqual(
 			expect.objectContaining({
 				labels: { 'service.name': 'adservice' },
 				values: [
@@ -121,33 +119,33 @@ describe('convertV5ResponseToLegacy', () => {
 		const scalar: ScalarData = {
 			columns: [
 				// group column
-				({
+				{
 					name: 'service.name',
 					queryName: 'A',
 					aggregationIndex: 0,
 					columnType: 'group',
-				} as unknown) as ScalarData['columns'][number],
+				} as unknown as ScalarData['columns'][number],
 				// aggregation 0
-				({
+				{
 					name: '__result_0',
 					queryName: 'A',
 					aggregationIndex: 0,
 					columnType: 'aggregation',
-				} as unknown) as ScalarData['columns'][number],
+				} as unknown as ScalarData['columns'][number],
 				// aggregation 1
-				({
+				{
 					name: '__result_1',
 					queryName: 'A',
 					aggregationIndex: 1,
 					columnType: 'aggregation',
-				} as unknown) as ScalarData['columns'][number],
+				} as unknown as ScalarData['columns'][number],
 				// formula F1
-				({
+				{
 					name: '__result',
 					queryName: 'F1',
 					aggregationIndex: 0,
 					columnType: 'aggregation',
-				} as unknown) as ScalarData['columns'][number],
+				} as unknown as ScalarData['columns'][number],
 			],
 			data: [['adservice', 606, 1.452, 151.5]],
 		};
@@ -174,23 +172,21 @@ describe('convertV5ResponseToLegacy', () => {
 			},
 			{
 				type: 'builder_formula',
-				spec: ({
+				spec: {
 					name: 'F1',
 					expression: 'A * 0.25',
-				} as unknown) as QueryBuilderFormula,
+				} as unknown as QueryBuilderFormula,
 			},
 		]);
 
-		const input: SuccessResponse<
-			MetricRangePayloadV5,
-			QueryRangeRequestV5
-		> = makeBaseSuccess({ data: v5Data }, params);
+		const input: SuccessResponse<MetricRangePayloadV5, QueryRangeRequestV5> =
+			makeBaseSuccess({ data: v5Data }, params);
 		const legendMap = { A: '{{service.name}}', F1: '' };
 		const result = convertV5ResponseToLegacy(input, legendMap, false);
 
 		expect(result.payload.data.resultType).toBe('scalar');
 		const [tableEntry] = result.payload.data.result;
-		expect(tableEntry.table?.columns).toEqual([
+		expect(tableEntry.table?.columns).toStrictEqual([
 			{
 				name: 'service.name',
 				queryName: 'A',
@@ -206,7 +202,7 @@ describe('convertV5ResponseToLegacy', () => {
 			},
 			{ name: 'F1', queryName: 'F1', isValueColumn: true, id: 'F1' },
 		]);
-		expect(tableEntry.table?.rows?.[0]).toEqual({
+		expect(tableEntry.table?.rows?.[0]).toStrictEqual({
 			data: {
 				'service.name': 'adservice',
 				'A.count()': 606,
@@ -254,16 +250,14 @@ describe('convertV5ResponseToLegacy', () => {
 			},
 		]);
 
-		const input: SuccessResponse<
-			MetricRangePayloadV5,
-			QueryRangeRequestV5
-		> = makeBaseSuccess({ data: v5Data }, params);
+		const input: SuccessResponse<MetricRangePayloadV5, QueryRangeRequestV5> =
+			makeBaseSuccess({ data: v5Data }, params);
 		const legendMap = { A: '{{service.name}}' };
 		const result = convertV5ResponseToLegacy(input, legendMap, true);
 
 		expect(result.payload.data.resultType).toBe('scalar');
 		const [tableEntry] = result.payload.data.result;
-		expect(tableEntry.table?.columns).toEqual([
+		expect(tableEntry.table?.columns).toStrictEqual([
 			{
 				name: 'service.name',
 				queryName: 'A',
@@ -273,7 +267,7 @@ describe('convertV5ResponseToLegacy', () => {
 			// Single aggregation: name resolves to legend, id resolves to queryName
 			{ name: '{{service.name}}', queryName: 'A', isValueColumn: true, id: 'A' },
 		]);
-		expect(tableEntry.table?.rows?.[0]).toEqual({
+		expect(tableEntry.table?.rows?.[0]).toStrictEqual({
 			data: {
 				'service.name': 'adservice',
 				A: 580,

frontend/src/api/v5/queryRange/convertV5Response.ts

@@ -93,7 +93,7 @@ function convertTimeSeriesData(
 				labels: series.labels
 					? Object.fromEntries(
 							series.labels.map((label: any) => [label.key.name, label.value]),
-					  )
+						)
 					: {},
 				labelsArray: series.labels
 					? series.labels.map((label: any) => ({ [label.key.name]: label.value }))
@@ -358,16 +358,19 @@ export function convertV5ResponseToLegacy(
 	const aggregationPerQuery =
 		(params as QueryRangeRequestV5)?.compositeQuery?.queries
 			?.filter((query) => query.type === 'builder_query')
-			.reduce((acc, query) => {
-				if (
-					query.type === 'builder_query' &&
-					'aggregations' in query.spec &&
-					query.spec.name
-				) {
-					acc[query.spec.name] = query.spec.aggregations;
-				}
-				return acc;
-			}, {} as Record<string, any>) || {};
+			.reduce(
+				(acc, query) => {
+					if (
+						query.type === 'builder_query' &&
+						'aggregations' in query.spec &&
+						query.spec.name
+					) {
+						acc[query.spec.name] = query.spec.aggregations;
+					}
+					return acc;
+				},
+				{} as Record<string, any>,
+			) || {};
 
 	// If formatForWeb is true, return as-is (like existing logic)
 	if (formatForWeb && v5Data?.type === 'scalar') {

frontend/src/api/v5/queryRange/prepareQueryRangePayloadV5.test.ts

@@ -104,7 +104,7 @@ describe('prepareQueryRangePayloadV5', () => {
 
 		const result = prepareQueryRangePayloadV5(props);
 
-		expect(result).toEqual(
+		expect(result).toStrictEqual(
 			expect.objectContaining({
 				legendMap: { A: 'Legend A', F1: 'Formula Legend' },
 				queryPayload: expect.objectContaining({
@@ -154,7 +154,10 @@ describe('prepareQueryRangePayloadV5', () => {
 		);
 
 		// Legend map combines builder and formulas
-		expect(result.legendMap).toEqual({ A: 'Legend A', F1: 'Formula Legend' });
+		expect(result.legendMap).toStrictEqual({
+			A: 'Legend A',
+			F1: 'Formula Legend',
+		});
 
 		const payload: QueryRangePayloadV5 = result.queryPayload;
 
@@ -166,10 +169,10 @@ describe('prepareQueryRangePayloadV5', () => {
 		expect(payload.formatOptions?.fillGaps).toBe(true);
 
 		// Variables mapped as { key: { value } }
-		expect(payload.variables).toEqual({
-			svc: { value: 'api' },
-			count: { value: 5 },
-			flag: { value: true },
+		expect(payload.variables).toStrictEqual({
+			svc: { value: 'api', type: undefined },
+			count: { value: 5, type: undefined },
+			flag: { value: true, type: undefined },
 		});
 
 		// Queries include one builder_query and one builder_formula
@@ -226,7 +229,7 @@ describe('prepareQueryRangePayloadV5', () => {
 
 		const result = prepareQueryRangePayloadV5(props);
 
-		expect(result).toEqual(
+		expect(result).toStrictEqual(
 			expect.objectContaining({
 				legendMap: { A: 'LP' },
 				queryPayload: expect.objectContaining({
@@ -255,7 +258,7 @@ describe('prepareQueryRangePayloadV5', () => {
 			}),
 		);
 
-		expect(result.legendMap).toEqual({ A: 'LP' });
+		expect(result.legendMap).toStrictEqual({ A: 'LP' });
 
 		const payload: QueryRangePayloadV5 = result.queryPayload;
 		expect(payload.requestType).toBe('time_series');
@@ -296,7 +299,7 @@ describe('prepareQueryRangePayloadV5', () => {
 
 		const result = prepareQueryRangePayloadV5(props);
 
-		expect(result).toEqual(
+		expect(result).toStrictEqual(
 			expect.objectContaining({
 				legendMap: { Q: 'LC' },
 				queryPayload: expect.objectContaining({
@@ -324,7 +327,7 @@ describe('prepareQueryRangePayloadV5', () => {
 			}),
 		);
 
-		expect(result.legendMap).toEqual({ Q: 'LC' });
+		expect(result.legendMap).toStrictEqual({ Q: 'LC' });
 
 		const payload: QueryRangePayloadV5 = result.queryPayload;
 		expect(payload.requestType).toBe('scalar');
@@ -353,7 +356,7 @@ describe('prepareQueryRangePayloadV5', () => {
 
 		const result = prepareQueryRangePayloadV5(props);
 
-		expect(result).toEqual(
+		expect(result).toStrictEqual(
 			expect.objectContaining({
 				legendMap: {},
 				queryPayload: expect.objectContaining({
@@ -397,7 +400,7 @@ describe('prepareQueryRangePayloadV5', () => {
 
 		const result = prepareQueryRangePayloadV5(props);
 
-		expect(result).toEqual(
+		expect(result).toStrictEqual(
 			expect.objectContaining({
 				legendMap: { A: 'Legend A' },
 				queryPayload: expect.objectContaining({
@@ -471,7 +474,7 @@ describe('prepareQueryRangePayloadV5', () => {
 
 		const result = prepareQueryRangePayloadV5(props);
 
-		expect(result).toEqual(
+		expect(result).toStrictEqual(
 			expect.objectContaining({
 				legendMap: { A: 'Legend A' },
 				queryPayload: expect.objectContaining({
@@ -585,7 +588,7 @@ describe('prepareQueryRangePayloadV5', () => {
 
 		const result = prepareQueryRangePayloadV5(props);
 
-		expect(result).toEqual(
+		expect(result).toStrictEqual(
 			expect.objectContaining({
 				legendMap: { A: '{{service.name}}' },
 				queryPayload: expect.objectContaining({
@@ -684,7 +687,7 @@ describe('prepareQueryRangePayloadV5', () => {
 
 		const result = prepareQueryRangePayloadV5(props);
 
-		expect(result.legendMap).toEqual({ A: 'Legend A' });
+		expect(result.legendMap).toStrictEqual({ A: 'Legend A' });
 		expect(result.queryPayload.compositeQuery.queries).toHaveLength(1);
 
 		const builderQuery = result.queryPayload.compositeQuery.queries.find(
@@ -694,7 +697,7 @@ describe('prepareQueryRangePayloadV5', () => {
 
 		expect(logSpec.name).toBe('A');
 		expect(logSpec.signal).toBe('logs');
-		expect(logSpec.filter).toEqual({
+		expect(logSpec.filter).toStrictEqual({
 			expression:
 				"service.name = 'payment-service' AND http.status_code >= 400 AND message contains 'error'",
 		});
@@ -713,7 +716,7 @@ describe('prepareQueryRangePayloadV5', () => {
 						baseBuilderQuery({
 							dataSource: DataSource.LOGS,
 							filter: { expression: 'http.status_code >= 500' },
-							filters: (undefined as unknown) as IBuilderQuery['filters'],
+							filters: undefined as unknown as IBuilderQuery['filters'],
 						}),
 					],
 					queryFormulas: [],
@@ -731,7 +734,9 @@ describe('prepareQueryRangePayloadV5', () => {
 			(q) => q.type === 'builder_query',
 		) as QueryEnvelope;
 		const logSpec = builderQuery.spec as LogBuilderQuery;
-		expect(logSpec.filter).toEqual({ expression: 'http.status_code >= 500' });
+		expect(logSpec.filter).toStrictEqual({
+			expression: 'http.status_code >= 500',
+		});
 	});
 
 	it('derives expression from filters when filter is undefined', () => {
@@ -746,7 +751,7 @@ describe('prepareQueryRangePayloadV5', () => {
 					queryData: [
 						baseBuilderQuery({
 							dataSource: DataSource.LOGS,
-							filter: (undefined as unknown) as IBuilderQuery['filter'],
+							filter: undefined as unknown as IBuilderQuery['filter'],
 							filters: {
 								items: [
 									{
@@ -775,7 +780,9 @@ describe('prepareQueryRangePayloadV5', () => {
 			(q) => q.type === 'builder_query',
 		) as QueryEnvelope;
 		const logSpec = builderQuery.spec as LogBuilderQuery;
-		expect(logSpec.filter).toEqual({ expression: "service.name = 'checkout'" });
+		expect(logSpec.filter).toStrictEqual({
+			expression: "service.name = 'checkout'",
+		});
 	});
 
 	it('prefers filter.expression over filters when both are present', () => {
@@ -819,7 +826,9 @@ describe('prepareQueryRangePayloadV5', () => {
 			(q) => q.type === 'builder_query',
 		) as QueryEnvelope;
 		const logSpec = builderQuery.spec as LogBuilderQuery;
-		expect(logSpec.filter).toEqual({ expression: "service.name = 'frontend'" });
+		expect(logSpec.filter).toStrictEqual({
+			expression: "service.name = 'frontend'",
+		});
 	});
 
 	it('returns empty expression when neither filter nor filters provided', () => {
@@ -834,8 +843,8 @@ describe('prepareQueryRangePayloadV5', () => {
 					queryData: [
 						baseBuilderQuery({
 							dataSource: DataSource.LOGS,
-							filter: (undefined as unknown) as IBuilderQuery['filter'],
-							filters: (undefined as unknown) as IBuilderQuery['filters'],
+							filter: undefined as unknown as IBuilderQuery['filter'],
+							filters: undefined as unknown as IBuilderQuery['filters'],
 						}),
 					],
 					queryFormulas: [],
@@ -853,7 +862,7 @@ describe('prepareQueryRangePayloadV5', () => {
 			(q) => q.type === 'builder_query',
 		) as QueryEnvelope;
 		const logSpec = builderQuery.spec as LogBuilderQuery;
-		expect(logSpec.filter).toEqual({ expression: '' });
+		expect(logSpec.filter).toStrictEqual({ expression: '' });
 	});
 
 	it('returns empty expression when filters provided with empty items', () => {
@@ -887,6 +896,6 @@ describe('prepareQueryRangePayloadV5', () => {
 			(q) => q.type === 'builder_query',
 		) as QueryEnvelope;
 		const logSpec = builderQuery.spec as LogBuilderQuery;
-		expect(logSpec.filter).toEqual({ expression: '' });
+		expect(logSpec.filter).toStrictEqual({ expression: '' });
 	});
 });

frontend/src/api/v5/queryRange/prepareQueryRangePayloadV5.ts

@@ -139,10 +139,9 @@ function createBaseSpec(
 	requestType: RequestType,
 	panelType?: PANEL_TYPES,
 ): BaseBuilderQuery {
-	const nonEmptySelectColumns = (queryData.selectColumns as (
-		| BaseAutocompleteData
-		| TelemetryFieldKey
-	)[])?.filter((c) => ('key' in c ? c?.key : c?.name));
+	const nonEmptySelectColumns = (
+		queryData.selectColumns as (BaseAutocompleteData | TelemetryFieldKey)[]
+	)?.filter((c) => ('key' in c ? c?.key : c?.name));
 
 	return {
 		stepInterval: queryData?.stepInterval || null,
@@ -160,7 +159,7 @@ function createBaseSpec(
 							signal: item?.signal,
 							materialized: item?.materialized,
 						}),
-				  )
+					)
 				: undefined,
 		limit:
 			panelType === PANEL_TYPES.TABLE || panelType === PANEL_TYPES.LIST
@@ -179,52 +178,48 @@ function createBaseSpec(
 							},
 							direction: order.order,
 						}),
-				  )
+					)
 				: undefined,
 		legend: isEmpty(queryData.legend) ? undefined : queryData.legend,
 		having: isEmpty(queryData.having) ? undefined : (queryData?.having as Having),
 		functions: isEmpty(queryData.functions)
 			? undefined
-			: queryData.functions.map(
-					(func: QueryFunction): QueryFunction => {
-						// Normalize function name to handle case sensitivity
-						const normalizedName = normalizeFunctionName(func?.name);
-						return {
-							name: normalizedName as FunctionName,
-							args: isEmpty(func.namedArgs)
-								? func.args?.map((arg) => ({
-										value: arg?.value,
-								  }))
-								: Object.entries(func?.namedArgs || {}).map(([name, value]) => ({
-										name,
-										value,
-								  })),
-						};
-					},
-			  ),
+			: queryData.functions.map((func: QueryFunction): QueryFunction => {
+					// Normalize function name to handle case sensitivity
+					const normalizedName = normalizeFunctionName(func?.name);
+					return {
+						name: normalizedName as FunctionName,
+						args: isEmpty(func.namedArgs)
+							? func.args?.map((arg) => ({
+									value: arg?.value,
+								}))
+							: Object.entries(func?.namedArgs || {}).map(([name, value]) => ({
+									name,
+									value,
+								})),
+					};
+				}),
 		selectFields: isEmpty(nonEmptySelectColumns)
 			? undefined
-			: nonEmptySelectColumns?.map(
-					(column: any): TelemetryFieldKey => {
-						const fieldName = column.name ?? column.key;
-						const isDeprecated = isDeprecatedField(fieldName);
+			: nonEmptySelectColumns?.map((column: any): TelemetryFieldKey => {
+					const fieldName = column.name ?? column.key;
+					const isDeprecated = isDeprecatedField(fieldName);
 
-						const fieldObj: TelemetryFieldKey = {
-							name: fieldName,
-							fieldDataType:
-								column?.fieldDataType ?? (column?.dataType as FieldDataType),
-							signal: column?.signal ?? undefined,
-						};
+					const fieldObj: TelemetryFieldKey = {
+						name: fieldName,
+						fieldDataType:
+							column?.fieldDataType ?? (column?.dataType as FieldDataType),
+						signal: column?.signal ?? undefined,
+					};
 
-						// Only add fieldContext if the field is NOT deprecated
-						if (!isDeprecated && fieldName !== 'name') {
-							fieldObj.fieldContext =
-								column?.fieldContext ?? (column?.type as FieldContext);
-						}
+					// Only add fieldContext if the field is NOT deprecated
+					if (!isDeprecated && fieldName !== 'name') {
+						fieldObj.fieldContext =
+							column?.fieldContext ?? (column?.type as FieldContext);
+					}
 
-						return fieldObj;
-					},
-			  ),
+					return fieldObj;
+				}),
 	};
 }
 
@@ -236,7 +231,8 @@ export function parseAggregations(
 	const result: { expression: string; alias?: string }[] = [];
 	// Matches function calls like "count()" or "sum(field)" with optional alias like "as 'alias'"
 	// Handles quoted ('alias'), dash-separated (field-name), and unquoted values after "as" keyword
-	const regex = /([a-zA-Z0-9_]+\([^)]*\))(?:\s*as\s+((?:'[^']*'|"[^"]*"|[a-zA-Z0-9_-]+)))?/g;
+	const regex =
+		/([a-zA-Z0-9_]+\([^)]*\))(?:\s*as\s+((?:'[^']*'|"[^"]*"|[a-zA-Z0-9_-]+)))?/g;
 	let match = regex.exec(expression);
 	while (match !== null) {
 		const expr = match[1];
@@ -365,10 +361,9 @@ function createTraceOperatorBaseSpec(
 	requestType: RequestType,
 	panelType?: PANEL_TYPES,
 ): BaseBuilderQuery {
-	const nonEmptySelectColumns = (queryData.selectColumns as (
-		| BaseAutocompleteData
-		| TelemetryFieldKey
-	)[])?.filter((c) => ('key' in c ? c?.key : c?.name));
+	const nonEmptySelectColumns = (
+		queryData.selectColumns as (BaseAutocompleteData | TelemetryFieldKey)[]
+	)?.filter((c) => ('key' in c ? c?.key : c?.name));
 
 	const {
 		stepInterval,
@@ -395,7 +390,7 @@ function createTraceOperatorBaseSpec(
 							signal: item?.signal,
 							materialized: item?.materialized,
 						}),
-				  )
+					)
 				: undefined,
 		limit:
 			panelType === PANEL_TYPES.TABLE || panelType === PANEL_TYPES.LIST
@@ -411,7 +406,7 @@ function createTraceOperatorBaseSpec(
 							},
 							direction: order.order,
 						}),
-				  )
+					)
 				: undefined,
 		legend: isEmpty(legend) ? undefined : legend,
 		having: isEmpty(having) ? undefined : (having as Having),
@@ -425,7 +420,7 @@ function createTraceOperatorBaseSpec(
 						fieldContext: column?.fieldContext ?? (column?.type as FieldContext),
 						signal: column?.signal ?? undefined,
 					}),
-			  ),
+				),
 	};
 }
 
@@ -507,18 +502,22 @@ export function convertClickHouseQueriesToV5(
 /**
  * Helper function to reduce query arrays to objects
  */
-function reduceQueriesToObject(
-	queryArray: any[],
-): { queries: Record<string, any>; legends: Record<string, string> } {
+function reduceQueriesToObject(queryArray: any[]): {
+	queries: Record<string, any>;
+	legends: Record<string, string>;
+} {
 	const legends: Record<string, string> = {};
-	const queries = queryArray.reduce((acc, queryItem) => {
-		if (!queryItem.query) {
+	const queries = queryArray.reduce(
+		(acc, queryItem) => {
+			if (!queryItem.query) {
+				return acc;
+			}
+			acc[queryItem.name] = queryItem;
+			legends[queryItem.name] = queryItem.legend;
 			return acc;
-		}
-		acc[queryItem.name] = queryItem;
-		legends[queryItem.name] = queryItem.legend;
-		return acc;
-	}, {} as Record<string, any>);
+		},
+		{} as Record<string, any>,
+	);
 
 	return { queries, legends };
 }
@@ -554,7 +553,7 @@ export const prepareQueryRangePayloadV5 = ({
 				queryTraceOperator && queryTraceOperator.length > 0
 					? queryTraceOperator.filter((traceOperator) =>
 							Boolean(traceOperator.expression.trim()),
-					  )
+						)
 					: [];
 
 			const currentTraceOperator = mapQueryDataToApi(
@@ -648,15 +647,18 @@ export const prepareQueryRangePayloadV5 = ({
 					: graphType === PANEL_TYPES.TABLE),
 			fillGaps: fillGaps || false,
 		},
-		variables: Object.entries(variables).reduce((acc, [key, value]) => {
-			acc[key] = {
-				value,
-				type: dynamicVariables
-					?.find((v) => v.name === key)
-					?.type?.toLowerCase() as VariableType,
-			};
-			return acc;
-		}, {} as Record<string, VariableItem>),
+		variables: Object.entries(variables).reduce(
+			(acc, [key, value]) => {
+				acc[key] = {
+					value,
+					type: dynamicVariables
+						?.find((v) => v.name === key)
+						?.type?.toLowerCase() as VariableType,
+				};
+				return acc;
+			},
+			{} as Record<string, VariableItem>,
+		),
 	};
 
 	return { legendMap, queryPayload };

frontend/src/assets/Logos/baseten.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" height="34" viewBox="0 0 131 34">
+  <path fill="currentColor" d="M.36 8.6h16.7v5.6H6.04c-.2 0-.35.16-.35.35v4.9c0 .2.16.35.35.35h11.02v5.6h-5.33c-.2 0-.35.16-.35.35v4.9c0 .2.16.35.35.35h4.98c.2 0 .35-.15.35-.35V25.4h5.34c.2 0 .35-.16.35-.35v-4.9c0-.2-.16-.35-.35-.35h-5.34v-5.6h5.34c.2 0 .35-.16.35-.35v-4.9c0-.2-.16-.35-.35-.35h-5.34V3.35c0-.2-.16-.35-.35-.35H.36c-.2 0-.36.16-.36.35v4.9c0 .2.16.35.36.35ZM44.41 14.7c-.5-.5-1.1-.9-1.76-1.18a5.62 5.62 0 0 0-4.6.17c-.73.37-1.32.91-1.75 1.62h-.17V8.59H34.1v16.83h2.04v-1.81h.17c.21.36.47.67.77.94.31.25.65.48 1.01.67.37.18.77.31 1.18.39a6.2 6.2 0 0 0 3.39-.24 5.36 5.36 0 0 0 3.02-3.1c.29-.75.44-1.62.44-2.6v-.47c0-.96-.16-1.83-.47-2.58-.3-.75-.7-1.4-1.23-1.9v-.01Zm-5.87.66a3.9 3.9 0 0 1 4.34.84c.36.35.64.8.83 1.3.2.5.3 1.07.3 1.7v.47c0 .64-.1 1.23-.3 1.74a3.75 3.75 0 0 1-2.06 2.15 4.27 4.27 0 0 1-3.12-.03 3.86 3.86 0 0 1-2.09-2.2c-.2-.52-.3-1.11-.3-1.75v-.29c0-.62.1-1.2.3-1.7v-.01c.21-.53.5-.99.84-1.36.36-.37.78-.66 1.26-.86ZM97.04 8.59H95v4.86h-2.94v1.86H95v8.17c0 .56.17 1.03.53 1.4.37.35.84.54 1.4.54h4.18v-1.87h-3.5c-.2 0-.33-.05-.43-.15-.1-.1-.14-.27-.14-.49v-7.6h4.65v-1.86h-4.65V8.59ZM114.61 15a5.48 5.48 0 0 0-1.8-1.33 5.6 5.6 0 0 0-2.57-.56 6.17 6.17 0 0 0-4.26 1.7 5.6 5.6 0 0 0-1.72 4.2v.57c0 .9.15 1.75.44 2.5a5.58 5.58 0 0 0 5.5 3.67c1.55 0 2.8-.35 3.72-1.04a5.35 5.35 0 0 0 1.91-2.73l.03-.07-1.94-.52-.02.07c-.11.33-.27.64-.46.94-.17.27-.4.52-.7.74-.28.22-.63.39-1.04.51-.41.13-.9.19-1.46.19a3.8 3.8 0 0 1-2.84-1.05 4.07 4.07 0 0 1-1.1-2.7h9.68v-1.6c0-.54-.11-1.12-.34-1.75a5.04 5.04 0 0 0-1.03-1.74Zm-8.25 3.21a3.8 3.8 0 0 1 1.22-2.25 4.19 4.19 0 0 1 3.99-.7c.44.16.83.38 1.17.66.34.27.62.62.82 1.02.21.38.34.8.38 1.27h-7.58ZM129.09 14.42a4.47 4.47 0 0 0-3.37-1.3c-.93 0-1.73.2-2.4.59-.64.39-1.15.97-1.52 1.74h-.17v-2h-2.04v11.97h2.04v-6.23c0-1.26.32-2.28.95-3.02a3.31 3.31 0 0 1 2.65-1.14c.94 0 1.7.3 2.24.9.56.6.83 1.52.83 2.74v6.75h2.04v-7.13c0-1.71-.42-3.02-1.25-3.87ZM88.1 15a5.48 5.48 0 0 0-1.78-1.33 5.6 5.6 0 0 0-2.58-.56 6.17 6.17 0 0 0-4.27 1.7 5.59 5.59 0 0 0-1.71 4.2v.56c0 .92.14 1.76.44 2.51a5.6 5.6 0 0 0 5.5 3.67c1.55 0 2.8-.35 3.72-1.04a5.36 5.36 0 0 0 1.91-2.73l.03-.07-1.94-.52-.03.07c-.1.32-.26.64-.45.94-.17.27-.4.52-.7.74-.29.21-.64.39-1.05.51-.4.12-.9.19-1.45.19a3.8 3.8 0 0 1-2.85-1.05 4.07 4.07 0 0 1-1.09-2.7h9.68v-1.61c0-.53-.12-1.12-.34-1.74A5.03 5.03 0 0 0 88.1 15Zm-8.24 3.21a3.83 3.83 0 0 1 1.22-2.25 4.2 4.2 0 0 1 3.99-.7c.44.16.83.38 1.16.66.35.27.62.62.83 1.02.2.38.33.8.37 1.27h-7.57ZM73.65 19.42a6.11 6.11 0 0 0-3.23-1.02 6.63 6.63 0 0 1-2.68-.58c-.47-.3-.7-.7-.7-1.25 0-.27.08-.5.21-.7.14-.2.33-.38.56-.52a4.05 4.05 0 0 1 1.78-.42c.85 0 1.54.21 2.06.63.53.41.83 1 .91 1.73l.01.1 1.95-.47-.01-.07c-.07-.45-.22-.91-.45-1.36a3.46 3.46 0 0 0-.94-1.2 4.6 4.6 0 0 0-1.52-.84 6.05 6.05 0 0 0-2.1-.34c-.58 0-1.13.07-1.65.22-.52.14-1 .36-1.43.65-.41.3-.74.66-.99 1.1a2.9 2.9 0 0 0-.37 1.49v.14c0 1.06.38 1.87 1.14 2.42a6.2 6.2 0 0 0 3.24.97c1.18.08 2.04.26 2.56.54.5.28.75.72.75 1.36 0 .6-.25 1.06-.78 1.4-.52.32-1.22.48-2.1.48a3.68 3.68 0 0 1-2.46-.79 3.13 3.13 0 0 1-1.04-2.14v-.09l-1.93.46h-.02v.07a4.4 4.4 0 0 0 3.1 4c.7.24 1.52.36 2.46.36.7 0 1.35-.09 1.93-.27.6-.16 1.12-.4 1.53-.72A3.38 3.38 0 0 0 74.8 22v-.14c0-1.07-.39-1.9-1.14-2.44ZM60.25 23.4c-.1-.1-.14-.27-.14-.49v-9.46h-2.05v1.85h-.16a3.78 3.78 0 0 0-1.61-1.63 4.62 4.62 0 0 0-2.26-.56c-.77 0-1.5.14-2.19.41a5.27 5.27 0 0 0-3.02 3.12c-.29.75-.44 1.63-.44 2.6v.38c0 .99.15 1.87.44 2.63.3.75.7 1.4 1.2 1.93a5.48 5.48 0 0 0 4.05 1.57c.8 0 1.51-.2 2.2-.58.69-.38 1.24-.97 1.63-1.75h.16v.06c0 .56.18 1.03.53 1.4.37.35.85.54 1.41.54h1.36v-1.87h-.68c-.2 0-.34-.05-.43-.15Zm-4.46.13c-.46.2-.97.3-1.52.3a3.68 3.68 0 0 1-2.75-1.09 4.42 4.42 0 0 1-1.05-3.12v-.38c0-.62.1-1.2.29-1.71a3.65 3.65 0 0 1 5-2.17c.47.2.88.49 1.21.86.35.37.62.83.8 1.36.2.5.3 1.08.3 1.7v.3c0 .63-.1 1.23-.3 1.76-.18.5-.45.96-.78 1.33-.33.37-.73.66-1.2.86Z"/>
+</svg>

frontend/src/assets/Logos/dbos.svg

@@ -0,0 +1,13 @@
+<svg width="109" height="24" viewBox="0 0 109 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_125_22125)">
+<path d="M0 -2.08616e-07V24H17.9352C22.9911 24 26.0999 21.0858 26.0999 17.04V6.96C26.0999 2.91432 22.9911 -2.08616e-07 17.9352 -2.08616e-07H0ZM6.76413 5.82864H19.1992V18.1714H6.76413V5.82864Z" fill="currentColor"/>
+<path d="M46.7659 18.6172H35.0824V14.16H46.7659V18.6172ZM46.595 5.38296V9.5658H35.0824V5.38296H46.595ZM50.2846 12.1373V11.5886C52.5734 10.5258 53.7008 8.8458 53.7008 6.13728C53.7008 2.64012 50.9337 0.000116183 45.5361 0.000116183H28.3184V24H45.7752C51.1728 24 53.9399 21.8401 53.9399 18.0685C53.9399 15.0172 52.6418 13.2001 50.2846 12.1373Z" fill="currentColor"/>
+<path d="M62.397 18.1714H74.8319V5.82864H62.397V18.1714ZM63.6609 24C58.6049 24 55.4961 21.0858 55.4961 17.04V6.96012C55.4961 2.91432 58.6049 0.000116183 63.6609 0.000116183H73.568C78.6238 0.000116183 81.7326 2.91432 81.7326 6.96012V17.04C81.7326 21.0858 78.6238 24 73.568 24H63.6609Z" fill="currentColor"/>
+<path d="M101.66 15.12L90.8995 14.3658C85.5361 13.9886 83.418 11.1772 83.418 7.47432V6.96012C83.418 2.91432 86.5266 0.000116183 91.5827 0.000116183H100.157C105.214 0.000116183 108.323 2.91432 108.323 6.96012V7.98864H101.968V5.14284H90.2504V8.43432L100.601 9.18864C105.999 9.56568 108.493 12.8572 108.493 16.5257V17.04C108.493 20.7428 105.384 24 100.328 24H91.5827C86.5266 24 83.418 20.7428 83.418 17.04V16.0115H89.7722V18.8572H101.66V15.12Z" fill="currentColor"/>
+</g>
+<defs>
+<clipPath id="clip0_125_22125">
+<rect width="108.494" height="24" fill="white"/>
+</clipPath>
+</defs>
+</svg>

frontend/src/assets/Logos/grafana.svg

@@ -1,70 +1,70 @@
-<?xml version="1.0" encoding="utf-8"?>
-<!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
-	 viewBox="0 0 142.5 145.6" style="enable-background:new 0 0 142.5 145.6;" xml:space="preserve">
-<style type="text/css">
-	.st0{fill:#565656;}
-	.st1{fill:url(#SVGID_1_);}
-</style>
-<g>
-	<path class="st0" d="M28.7,131.5c-0.3,7.9-6.6,14.1-14.4,14.1C6.1,145.6,0,139,0,130.9s6.6-14.7,14.7-14.7c3.6,0,7.2,1.6,10.2,4.4
-		l-2.3,2.9c-2.3-2-5.1-3.4-7.9-3.4c-5.9,0-10.8,4.8-10.8,10.8c0,6.1,4.6,10.8,10.4,10.8c5.2,0,9.3-3.8,10.2-8.8H12.6v-3.5h16.1
-		V131.5z"/>
-	<path class="st0" d="M42.3,129.5h-2.2c-2.4,0-4.4,2-4.4,4.4v11.4h-3.9v-19.6H35v1.6c1.1-1.1,2.7-1.6,4.6-1.6h4.2L42.3,129.5z"/>
-	<path class="st0" d="M63.7,145.3h-3.4v-2.5c-2.6,2.5-6.6,3.7-10.7,1.9c-3-1.3-5.3-4.1-5.9-7.4c-1.2-6.3,3.7-11.9,9.9-11.9
-		c2.6,0,5,1.1,6.7,2.8v-2.5h3.4V145.3z M59.7,137c0.9-4-2.1-7.6-6-7.6c-3.4,0-6.1,2.8-6.1,6.1c0,3.8,3.3,6.7,7.2,6.1
-		C57.1,141.2,59.1,139.3,59.7,137z"/>
-	<path class="st0" d="M71.5,124.7v1.1h6.2v3.4h-6.2v16.1h-3.8v-20.5c0-4.3,3.1-6.8,7-6.8h4.7l-1.6,3.7h-3.1
-		C72.9,121.6,71.5,123,71.5,124.7z"/>
-	<path class="st0" d="M98.5,145.3h-3.3v-2.5c-2.6,2.5-6.6,3.7-10.7,1.9c-3-1.3-5.3-4.1-5.9-7.4c-1.2-6.3,3.7-11.9,9.9-11.9
-		c2.6,0,5,1.1,6.7,2.8v-2.5h3.4v19.6H98.5z M94.5,137c0.9-4-2.1-7.6-6-7.6c-3.4,0-6.1,2.8-6.1,6.1c0,3.8,3.3,6.7,7.2,6.1
-		C92,141.2,93.9,139.3,94.5,137z"/>
-	<path class="st0" d="M119.4,133.8v11.5h-3.9v-11.6c0-2.4-2-4.4-4.4-4.4c-2.5,0-4.4,2-4.4,4.4v11.6h-3.9v-19.6h3.2v1.7
-		c1.4-1.3,3.3-2,5.2-2C115.8,125.5,119.4,129.2,119.4,133.8z"/>
-	<path class="st0" d="M142.4,145.3h-3.3v-2.5c-2.6,2.5-6.6,3.7-10.7,1.9c-3-1.3-5.3-4.1-5.9-7.4c-1.2-6.3,3.7-11.9,9.9-11.9
-		c2.6,0,5,1.1,6.7,2.8v-2.5h3.4v19.6H142.4z M138.4,137c0.9-4-2.1-7.6-6-7.6c-3.4,0-6.1,2.8-6.1,6.1c0,3.8,3.3,6.7,7.2,6.1
-		C135.9,141.2,137.8,139.3,138.4,137z"/>
-</g>
-<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="71.25" y1="10.4893" x2="71.25" y2="113.3415" gradientTransform="matrix(1 0 0 -1 0 148.6)">
-	<stop  offset="0" style="stop-color:#FCEE1F"/>
-	<stop  offset="1" style="stop-color:#F15B2A"/>
-</linearGradient>
-<path class="st1" d="M122.9,49.9c-0.2-1.9-0.5-4.1-1.1-6.5c-0.6-2.4-1.6-5-2.9-7.8c-1.4-2.7-3.1-5.6-5.4-8.3
-	c-0.9-1.1-1.9-2.1-2.9-3.2c1.6-6.3-1.9-11.8-1.9-11.8c-6.1-0.4-9.9,1.9-11.3,2.9c-0.2-0.1-0.5-0.2-0.7-0.3c-1-0.4-2.1-0.8-3.2-1.2
-	c-1.1-0.3-2.2-0.7-3.3-0.9c-1.1-0.3-2.3-0.5-3.5-0.7c-0.2,0-0.4-0.1-0.6-0.1C83.5,3.6,75.9,0,75.9,0c-8.7,5.6-10.4,13.1-10.4,13.1
-	s0,0.2-0.1,0.4c-0.5,0.1-0.9,0.3-1.4,0.4c-0.6,0.2-1.3,0.4-1.9,0.7c-0.6,0.3-1.3,0.5-1.9,0.8c-1.3,0.6-2.5,1.2-3.8,1.9
-	c-1.2,0.7-2.4,1.4-3.5,2.2c-0.2-0.1-0.3-0.2-0.3-0.2c-11.7-4.5-22.1,0.9-22.1,0.9c-0.9,12.5,4.7,20.3,5.8,21.7
-	c-0.3,0.8-0.5,1.5-0.8,2.3c-0.9,2.8-1.5,5.7-1.9,8.7c-0.1,0.4-0.1,0.9-0.2,1.3c-10.8,5.3-14,16.3-14,16.3c9,10.4,19.6,11,19.6,11
-	l0,0c1.3,2.4,2.9,4.7,4.6,6.8c0.7,0.9,1.5,1.7,2.3,2.6c-3.3,9.4,0.5,17.3,0.5,17.3c10.1,0.4,16.7-4.4,18.1-5.5c1,0.3,2,0.6,3,0.9
-	c3.1,0.8,6.3,1.3,9.4,1.4c0.8,0,1.6,0,2.4,0h0.4H80h0.5H81l0,0c4.7,6.8,13.1,7.7,13.1,7.7c5.9-6.3,6.3-12.4,6.3-13.8l0,0
-	c0,0,0,0,0-0.1s0-0.2,0-0.2l0,0c0-0.1,0-0.2,0-0.3c1.2-0.9,2.4-1.8,3.6-2.8c2.4-2.1,4.4-4.6,6.2-7.2c0.2-0.2,0.3-0.5,0.5-0.7
-	c6.7,0.4,11.4-4.2,11.4-4.2c-1.1-7-5.1-10.4-5.9-11l0,0c0,0,0,0-0.1-0.1l-0.1-0.1l0,0l-0.1-0.1c0-0.4,0.1-0.8,0.1-1.3
-	c0.1-0.8,0.1-1.5,0.1-2.3v-0.6v-0.3v-0.1c0-0.2,0-0.1,0-0.2v-0.5v-0.6c0-0.2,0-0.4,0-0.6s0-0.4-0.1-0.6l-0.1-0.6l-0.1-0.6
-	c-0.1-0.8-0.3-1.5-0.4-2.3c-0.7-3-1.9-5.9-3.4-8.4c-1.6-2.6-3.5-4.8-5.7-6.8c-2.2-1.9-4.6-3.5-7.2-4.6c-2.6-1.2-5.2-1.9-7.9-2.2
-	c-1.3-0.2-2.7-0.2-4-0.2h-0.5h-0.1h-0.2h-0.2h-0.5c-0.2,0-0.4,0-0.5,0c-0.7,0.1-1.4,0.2-2,0.3c-2.7,0.5-5.2,1.5-7.4,2.8
-	c-2.2,1.3-4.1,3-5.7,4.9s-2.8,3.9-3.6,6.1c-0.8,2.1-1.3,4.4-1.4,6.5c0,0.5,0,1.1,0,1.6c0,0.1,0,0.3,0,0.4v0.4c0,0.3,0,0.5,0.1,0.8
-	c0.1,1.1,0.3,2.1,0.6,3.1c0.6,2,1.5,3.8,2.7,5.4s2.5,2.8,4,3.8s3,1.7,4.6,2.2c1.6,0.5,3.1,0.7,4.5,0.6c0.2,0,0.4,0,0.5,0
-	c0.1,0,0.2,0,0.3,0s0.2,0,0.3,0c0.2,0,0.3,0,0.5,0h0.1h0.1c0.1,0,0.2,0,0.3,0c0.2,0,0.4-0.1,0.5-0.1c0.2,0,0.3-0.1,0.5-0.1
-	c0.3-0.1,0.7-0.2,1-0.3c0.6-0.2,1.2-0.5,1.8-0.7c0.6-0.3,1.1-0.6,1.5-0.9c0.1-0.1,0.3-0.2,0.4-0.3c0.5-0.4,0.6-1.1,0.2-1.6
-	c-0.4-0.4-1-0.5-1.5-0.3C88,74,87.9,74,87.7,74.1c-0.4,0.2-0.9,0.4-1.3,0.5c-0.5,0.1-1,0.3-1.5,0.4c-0.3,0-0.5,0.1-0.8,0.1
-	c-0.1,0-0.3,0-0.4,0c-0.1,0-0.3,0-0.4,0s-0.3,0-0.4,0c-0.2,0-0.3,0-0.5,0c0,0-0.1,0,0,0h-0.1h-0.1c-0.1,0-0.1,0-0.2,0
-	s-0.3,0-0.4-0.1c-1.1-0.2-2.3-0.5-3.4-1c-1.1-0.5-2.2-1.2-3.1-2.1c-1-0.9-1.8-1.9-2.5-3.1c-0.7-1.2-1.1-2.5-1.3-3.8
-	c-0.1-0.7-0.2-1.4-0.1-2.1c0-0.2,0-0.4,0-0.6c0,0.1,0,0,0,0v-0.1v-0.1c0-0.1,0-0.2,0-0.3c0-0.4,0.1-0.7,0.2-1.1c0.5-3,2-5.9,4.3-8.1
-	c0.6-0.6,1.2-1.1,1.9-1.5c0.7-0.5,1.4-0.9,2.1-1.2c0.7-0.3,1.5-0.6,2.3-0.8s1.6-0.4,2.4-0.4c0.4,0,0.8-0.1,1.2-0.1
-	c0.1,0,0.2,0,0.3,0h0.3h0.2c0.1,0,0,0,0,0h0.1h0.3c0.9,0.1,1.8,0.2,2.6,0.4c1.7,0.4,3.4,1,5,1.9c3.2,1.8,5.9,4.5,7.5,7.8
-	c0.8,1.6,1.4,3.4,1.7,5.3c0.1,0.5,0.1,0.9,0.2,1.4v0.3V66c0,0.1,0,0.2,0,0.3c0,0.1,0,0.2,0,0.3v0.3v0.3c0,0.2,0,0.6,0,0.8
-	c0,0.5-0.1,1-0.1,1.5c-0.1,0.5-0.1,1-0.2,1.5s-0.2,1-0.3,1.5c-0.2,1-0.6,1.9-0.9,2.9c-0.7,1.9-1.7,3.7-2.9,5.3
-	c-2.4,3.3-5.7,6-9.4,7.7c-1.9,0.8-3.8,1.5-5.8,1.8c-1,0.2-2,0.3-3,0.3H81h-0.2h-0.3H80h-0.3c0.1,0,0,0,0,0h-0.1
-	c-0.5,0-1.1,0-1.6-0.1c-2.2-0.2-4.3-0.6-6.4-1.2c-2.1-0.6-4.1-1.4-6-2.4c-3.8-2-7.2-4.9-9.9-8.2c-1.3-1.7-2.5-3.5-3.5-5.4
-	s-1.7-3.9-2.3-5.9c-0.6-2-0.9-4.1-1-6.2v-0.4v-0.1v-0.1v-0.2V60v-0.1v-0.1v-0.2v-0.5V59l0,0v-0.2c0-0.3,0-0.5,0-0.8
-	c0-1,0.1-2.1,0.3-3.2c0.1-1.1,0.3-2.1,0.5-3.2c0.2-1.1,0.5-2.1,0.8-3.2c0.6-2.1,1.3-4.1,2.2-6c1.8-3.8,4.1-7.2,6.8-9.9
-	c0.7-0.7,1.4-1.3,2.2-1.9c0.3-0.3,1-0.9,1.8-1.4c0.8-0.5,1.6-1,2.5-1.4c0.4-0.2,0.8-0.4,1.3-0.6c0.2-0.1,0.4-0.2,0.7-0.3
-	c0.2-0.1,0.4-0.2,0.7-0.3c0.9-0.4,1.8-0.7,2.7-1c0.2-0.1,0.5-0.1,0.7-0.2c0.2-0.1,0.5-0.1,0.7-0.2c0.5-0.1,0.9-0.2,1.4-0.4
-	c0.2-0.1,0.5-0.1,0.7-0.2c0.2,0,0.5-0.1,0.7-0.1c0.2,0,0.5-0.1,0.7-0.1l0.4-0.1l0.4-0.1c0.2,0,0.5-0.1,0.7-0.1
-	c0.3,0,0.5-0.1,0.8-0.1c0.2,0,0.6-0.1,0.8-0.1c0.2,0,0.3,0,0.5-0.1h0.3h0.2h0.2c0.3,0,0.5,0,0.8-0.1h0.4c0,0,0.1,0,0,0h0.1h0.2
-	c0.2,0,0.5,0,0.7,0c0.9,0,1.8,0,2.7,0c1.8,0.1,3.6,0.3,5.3,0.6c3.4,0.6,6.7,1.7,9.6,3.2c2.9,1.4,5.6,3.2,7.8,5.1
-	c0.1,0.1,0.3,0.2,0.4,0.4c0.1,0.1,0.3,0.2,0.4,0.4c0.3,0.2,0.5,0.5,0.8,0.7c0.3,0.2,0.5,0.5,0.8,0.7c0.2,0.3,0.5,0.5,0.7,0.8
-	c1,1,1.9,2.1,2.7,3.1c1.6,2.1,2.9,4.2,3.9,6.2c0.1,0.1,0.1,0.2,0.2,0.4c0.1,0.1,0.1,0.2,0.2,0.4s0.2,0.5,0.4,0.7
-	c0.1,0.2,0.2,0.5,0.3,0.7c0.1,0.2,0.2,0.5,0.3,0.7c0.4,0.9,0.7,1.8,1,2.7c0.5,1.4,0.8,2.6,1.1,3.6c0.1,0.4,0.5,0.7,0.9,0.7
-	c0.5,0,0.8-0.4,0.8-0.9C123,52.7,123,51.4,122.9,49.9z"/>
-</svg>
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 142.5 145.6" style="enable-background:new 0 0 142.5 145.6;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#565656;}
+	.st1{fill:url(#SVGID_1_);}
+</style>
+<g>
+	<path class="st0" d="M28.7,131.5c-0.3,7.9-6.6,14.1-14.4,14.1C6.1,145.6,0,139,0,130.9s6.6-14.7,14.7-14.7c3.6,0,7.2,1.6,10.2,4.4
+		l-2.3,2.9c-2.3-2-5.1-3.4-7.9-3.4c-5.9,0-10.8,4.8-10.8,10.8c0,6.1,4.6,10.8,10.4,10.8c5.2,0,9.3-3.8,10.2-8.8H12.6v-3.5h16.1
+		V131.5z"/>
+	<path class="st0" d="M42.3,129.5h-2.2c-2.4,0-4.4,2-4.4,4.4v11.4h-3.9v-19.6H35v1.6c1.1-1.1,2.7-1.6,4.6-1.6h4.2L42.3,129.5z"/>
+	<path class="st0" d="M63.7,145.3h-3.4v-2.5c-2.6,2.5-6.6,3.7-10.7,1.9c-3-1.3-5.3-4.1-5.9-7.4c-1.2-6.3,3.7-11.9,9.9-11.9
+		c2.6,0,5,1.1,6.7,2.8v-2.5h3.4V145.3z M59.7,137c0.9-4-2.1-7.6-6-7.6c-3.4,0-6.1,2.8-6.1,6.1c0,3.8,3.3,6.7,7.2,6.1
+		C57.1,141.2,59.1,139.3,59.7,137z"/>
+	<path class="st0" d="M71.5,124.7v1.1h6.2v3.4h-6.2v16.1h-3.8v-20.5c0-4.3,3.1-6.8,7-6.8h4.7l-1.6,3.7h-3.1
+		C72.9,121.6,71.5,123,71.5,124.7z"/>
+	<path class="st0" d="M98.5,145.3h-3.3v-2.5c-2.6,2.5-6.6,3.7-10.7,1.9c-3-1.3-5.3-4.1-5.9-7.4c-1.2-6.3,3.7-11.9,9.9-11.9
+		c2.6,0,5,1.1,6.7,2.8v-2.5h3.4v19.6H98.5z M94.5,137c0.9-4-2.1-7.6-6-7.6c-3.4,0-6.1,2.8-6.1,6.1c0,3.8,3.3,6.7,7.2,6.1
+		C92,141.2,93.9,139.3,94.5,137z"/>
+	<path class="st0" d="M119.4,133.8v11.5h-3.9v-11.6c0-2.4-2-4.4-4.4-4.4c-2.5,0-4.4,2-4.4,4.4v11.6h-3.9v-19.6h3.2v1.7
+		c1.4-1.3,3.3-2,5.2-2C115.8,125.5,119.4,129.2,119.4,133.8z"/>
+	<path class="st0" d="M142.4,145.3h-3.3v-2.5c-2.6,2.5-6.6,3.7-10.7,1.9c-3-1.3-5.3-4.1-5.9-7.4c-1.2-6.3,3.7-11.9,9.9-11.9
+		c2.6,0,5,1.1,6.7,2.8v-2.5h3.4v19.6H142.4z M138.4,137c0.9-4-2.1-7.6-6-7.6c-3.4,0-6.1,2.8-6.1,6.1c0,3.8,3.3,6.7,7.2,6.1
+		C135.9,141.2,137.8,139.3,138.4,137z"/>
+</g>
+<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="71.25" y1="10.4893" x2="71.25" y2="113.3415" gradientTransform="matrix(1 0 0 -1 0 148.6)">
+	<stop  offset="0" style="stop-color:#FCEE1F"/>
+	<stop  offset="1" style="stop-color:#F15B2A"/>
+</linearGradient>
+<path class="st1" d="M122.9,49.9c-0.2-1.9-0.5-4.1-1.1-6.5c-0.6-2.4-1.6-5-2.9-7.8c-1.4-2.7-3.1-5.6-5.4-8.3
+	c-0.9-1.1-1.9-2.1-2.9-3.2c1.6-6.3-1.9-11.8-1.9-11.8c-6.1-0.4-9.9,1.9-11.3,2.9c-0.2-0.1-0.5-0.2-0.7-0.3c-1-0.4-2.1-0.8-3.2-1.2
+	c-1.1-0.3-2.2-0.7-3.3-0.9c-1.1-0.3-2.3-0.5-3.5-0.7c-0.2,0-0.4-0.1-0.6-0.1C83.5,3.6,75.9,0,75.9,0c-8.7,5.6-10.4,13.1-10.4,13.1
+	s0,0.2-0.1,0.4c-0.5,0.1-0.9,0.3-1.4,0.4c-0.6,0.2-1.3,0.4-1.9,0.7c-0.6,0.3-1.3,0.5-1.9,0.8c-1.3,0.6-2.5,1.2-3.8,1.9
+	c-1.2,0.7-2.4,1.4-3.5,2.2c-0.2-0.1-0.3-0.2-0.3-0.2c-11.7-4.5-22.1,0.9-22.1,0.9c-0.9,12.5,4.7,20.3,5.8,21.7
+	c-0.3,0.8-0.5,1.5-0.8,2.3c-0.9,2.8-1.5,5.7-1.9,8.7c-0.1,0.4-0.1,0.9-0.2,1.3c-10.8,5.3-14,16.3-14,16.3c9,10.4,19.6,11,19.6,11
+	l0,0c1.3,2.4,2.9,4.7,4.6,6.8c0.7,0.9,1.5,1.7,2.3,2.6c-3.3,9.4,0.5,17.3,0.5,17.3c10.1,0.4,16.7-4.4,18.1-5.5c1,0.3,2,0.6,3,0.9
+	c3.1,0.8,6.3,1.3,9.4,1.4c0.8,0,1.6,0,2.4,0h0.4H80h0.5H81l0,0c4.7,6.8,13.1,7.7,13.1,7.7c5.9-6.3,6.3-12.4,6.3-13.8l0,0
+	c0,0,0,0,0-0.1s0-0.2,0-0.2l0,0c0-0.1,0-0.2,0-0.3c1.2-0.9,2.4-1.8,3.6-2.8c2.4-2.1,4.4-4.6,6.2-7.2c0.2-0.2,0.3-0.5,0.5-0.7
+	c6.7,0.4,11.4-4.2,11.4-4.2c-1.1-7-5.1-10.4-5.9-11l0,0c0,0,0,0-0.1-0.1l-0.1-0.1l0,0l-0.1-0.1c0-0.4,0.1-0.8,0.1-1.3
+	c0.1-0.8,0.1-1.5,0.1-2.3v-0.6v-0.3v-0.1c0-0.2,0-0.1,0-0.2v-0.5v-0.6c0-0.2,0-0.4,0-0.6s0-0.4-0.1-0.6l-0.1-0.6l-0.1-0.6
+	c-0.1-0.8-0.3-1.5-0.4-2.3c-0.7-3-1.9-5.9-3.4-8.4c-1.6-2.6-3.5-4.8-5.7-6.8c-2.2-1.9-4.6-3.5-7.2-4.6c-2.6-1.2-5.2-1.9-7.9-2.2
+	c-1.3-0.2-2.7-0.2-4-0.2h-0.5h-0.1h-0.2h-0.2h-0.5c-0.2,0-0.4,0-0.5,0c-0.7,0.1-1.4,0.2-2,0.3c-2.7,0.5-5.2,1.5-7.4,2.8
+	c-2.2,1.3-4.1,3-5.7,4.9s-2.8,3.9-3.6,6.1c-0.8,2.1-1.3,4.4-1.4,6.5c0,0.5,0,1.1,0,1.6c0,0.1,0,0.3,0,0.4v0.4c0,0.3,0,0.5,0.1,0.8
+	c0.1,1.1,0.3,2.1,0.6,3.1c0.6,2,1.5,3.8,2.7,5.4s2.5,2.8,4,3.8s3,1.7,4.6,2.2c1.6,0.5,3.1,0.7,4.5,0.6c0.2,0,0.4,0,0.5,0
+	c0.1,0,0.2,0,0.3,0s0.2,0,0.3,0c0.2,0,0.3,0,0.5,0h0.1h0.1c0.1,0,0.2,0,0.3,0c0.2,0,0.4-0.1,0.5-0.1c0.2,0,0.3-0.1,0.5-0.1
+	c0.3-0.1,0.7-0.2,1-0.3c0.6-0.2,1.2-0.5,1.8-0.7c0.6-0.3,1.1-0.6,1.5-0.9c0.1-0.1,0.3-0.2,0.4-0.3c0.5-0.4,0.6-1.1,0.2-1.6
+	c-0.4-0.4-1-0.5-1.5-0.3C88,74,87.9,74,87.7,74.1c-0.4,0.2-0.9,0.4-1.3,0.5c-0.5,0.1-1,0.3-1.5,0.4c-0.3,0-0.5,0.1-0.8,0.1
+	c-0.1,0-0.3,0-0.4,0c-0.1,0-0.3,0-0.4,0s-0.3,0-0.4,0c-0.2,0-0.3,0-0.5,0c0,0-0.1,0,0,0h-0.1h-0.1c-0.1,0-0.1,0-0.2,0
+	s-0.3,0-0.4-0.1c-1.1-0.2-2.3-0.5-3.4-1c-1.1-0.5-2.2-1.2-3.1-2.1c-1-0.9-1.8-1.9-2.5-3.1c-0.7-1.2-1.1-2.5-1.3-3.8
+	c-0.1-0.7-0.2-1.4-0.1-2.1c0-0.2,0-0.4,0-0.6c0,0.1,0,0,0,0v-0.1v-0.1c0-0.1,0-0.2,0-0.3c0-0.4,0.1-0.7,0.2-1.1c0.5-3,2-5.9,4.3-8.1
+	c0.6-0.6,1.2-1.1,1.9-1.5c0.7-0.5,1.4-0.9,2.1-1.2c0.7-0.3,1.5-0.6,2.3-0.8s1.6-0.4,2.4-0.4c0.4,0,0.8-0.1,1.2-0.1
+	c0.1,0,0.2,0,0.3,0h0.3h0.2c0.1,0,0,0,0,0h0.1h0.3c0.9,0.1,1.8,0.2,2.6,0.4c1.7,0.4,3.4,1,5,1.9c3.2,1.8,5.9,4.5,7.5,7.8
+	c0.8,1.6,1.4,3.4,1.7,5.3c0.1,0.5,0.1,0.9,0.2,1.4v0.3V66c0,0.1,0,0.2,0,0.3c0,0.1,0,0.2,0,0.3v0.3v0.3c0,0.2,0,0.6,0,0.8
+	c0,0.5-0.1,1-0.1,1.5c-0.1,0.5-0.1,1-0.2,1.5s-0.2,1-0.3,1.5c-0.2,1-0.6,1.9-0.9,2.9c-0.7,1.9-1.7,3.7-2.9,5.3
+	c-2.4,3.3-5.7,6-9.4,7.7c-1.9,0.8-3.8,1.5-5.8,1.8c-1,0.2-2,0.3-3,0.3H81h-0.2h-0.3H80h-0.3c0.1,0,0,0,0,0h-0.1
+	c-0.5,0-1.1,0-1.6-0.1c-2.2-0.2-4.3-0.6-6.4-1.2c-2.1-0.6-4.1-1.4-6-2.4c-3.8-2-7.2-4.9-9.9-8.2c-1.3-1.7-2.5-3.5-3.5-5.4
+	s-1.7-3.9-2.3-5.9c-0.6-2-0.9-4.1-1-6.2v-0.4v-0.1v-0.1v-0.2V60v-0.1v-0.1v-0.2v-0.5V59l0,0v-0.2c0-0.3,0-0.5,0-0.8
+	c0-1,0.1-2.1,0.3-3.2c0.1-1.1,0.3-2.1,0.5-3.2c0.2-1.1,0.5-2.1,0.8-3.2c0.6-2.1,1.3-4.1,2.2-6c1.8-3.8,4.1-7.2,6.8-9.9
+	c0.7-0.7,1.4-1.3,2.2-1.9c0.3-0.3,1-0.9,1.8-1.4c0.8-0.5,1.6-1,2.5-1.4c0.4-0.2,0.8-0.4,1.3-0.6c0.2-0.1,0.4-0.2,0.7-0.3
+	c0.2-0.1,0.4-0.2,0.7-0.3c0.9-0.4,1.8-0.7,2.7-1c0.2-0.1,0.5-0.1,0.7-0.2c0.2-0.1,0.5-0.1,0.7-0.2c0.5-0.1,0.9-0.2,1.4-0.4
+	c0.2-0.1,0.5-0.1,0.7-0.2c0.2,0,0.5-0.1,0.7-0.1c0.2,0,0.5-0.1,0.7-0.1l0.4-0.1l0.4-0.1c0.2,0,0.5-0.1,0.7-0.1
+	c0.3,0,0.5-0.1,0.8-0.1c0.2,0,0.6-0.1,0.8-0.1c0.2,0,0.3,0,0.5-0.1h0.3h0.2h0.2c0.3,0,0.5,0,0.8-0.1h0.4c0,0,0.1,0,0,0h0.1h0.2
+	c0.2,0,0.5,0,0.7,0c0.9,0,1.8,0,2.7,0c1.8,0.1,3.6,0.3,5.3,0.6c3.4,0.6,6.7,1.7,9.6,3.2c2.9,1.4,5.6,3.2,7.8,5.1
+	c0.1,0.1,0.3,0.2,0.4,0.4c0.1,0.1,0.3,0.2,0.4,0.4c0.3,0.2,0.5,0.5,0.8,0.7c0.3,0.2,0.5,0.5,0.8,0.7c0.2,0.3,0.5,0.5,0.7,0.8
+	c1,1,1.9,2.1,2.7,3.1c1.6,2.1,2.9,4.2,3.9,6.2c0.1,0.1,0.1,0.2,0.2,0.4c0.1,0.1,0.1,0.2,0.2,0.4s0.2,0.5,0.4,0.7
+	c0.1,0.2,0.2,0.5,0.3,0.7c0.1,0.2,0.2,0.5,0.3,0.7c0.4,0.9,0.7,1.8,1,2.7c0.5,1.4,0.8,2.6,1.1,3.6c0.1,0.4,0.5,0.7,0.9,0.7
+	c0.5,0,0.8-0.4,0.8-0.9C123,52.7,123,51.4,122.9,49.9z"/>
+</svg>

frontend/src/assets/Logos/opencode.svg

@@ -0,0 +1 @@
+<svg width='234' height='42' viewBox='0 0 234 42' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M18 30H6V18H18V30Z' fill='#CFCECD'/><path d='M18 12H6V30H18V12ZM24 36H0V6H24V36Z' fill='#656363'/><path d='M48 30H36V18H48V30Z' fill='#CFCECD'/><path d='M36 30H48V12H36V30ZM54 36H36V42H30V6H54V36Z' fill='#656363'/><path d='M84 24V30H66V24H84Z' fill='#CFCECD'/><path d='M84 24H66V30H84V36H60V6H84V24ZM66 18H78V12H66V18Z' fill='#656363'/><path d='M108 36H96V18H108V36Z' fill='#CFCECD'/><path d='M108 12H96V36H90V6H108V12ZM114 36H108V12H114V36Z' fill='#656363'/><path d='M144 30H126V18H144V30Z' fill='#CFCECD'/><path d='M144 12H126V30H144V36H120V6H144V12Z' fill='#211E1E'/><path d='M168 30H156V18H168V30Z' fill='#CFCECD'/><path d='M168 12H156V30H168V12ZM174 36H150V6H174V36Z' fill='#211E1E'/><path d='M198 30H186V18H198V30Z' fill='#CFCECD'/><path d='M198 12H186V30H198V12ZM204 36H180V6H198V0H204V36Z' fill='#211E1E'/><path d='M234 24V30H216V24H234Z' fill='#CFCECD'/><path d='M216 12V18H228V12H216ZM234 24H216V30H234V36H210V6H234V24Z' fill='#211E1E'/></svg>

frontend/src/assets/Logos/quickstart.svg

@@ -1,21 +1,21 @@
-<?xml version="1.0" encoding="iso-8859-1"?>
-<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
-<svg height="800px" width="800px" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
-	 viewBox="0 0 512 512" xml:space="preserve">
-<polygon style="fill:#FFD500;" points="382.395,228.568 291.215,228.568 330.762,10.199 129.603,283.43 220.785,283.43 
-	181.238,501.799 "/>
-<g>
-	<path style="fill:#3D3D3D;" d="M181.234,512c-1.355,0-2.726-0.271-4.033-0.833c-4.357-1.878-6.845-6.514-5.999-11.184
-		l37.371-206.353h-78.969c-3.846,0-7.367-2.164-9.103-5.597c-1.735-3.433-1.391-7.55,0.889-10.648L322.548,4.153
-		c2.814-3.822,7.891-5.196,12.25-3.32c4.357,1.878,6.845,6.514,5.999,11.184L303.427,218.37h78.969c3.846,0,7.367,2.164,9.103,5.597
-		c1.735,3.433,1.391,7.55-0.889,10.648L189.451,507.846C187.481,510.523,184.399,512,181.234,512z M149.777,273.231h71.007
-		c3.023,0,5.89,1.341,7.828,3.662c1.938,2.32,2.747,5.38,2.208,8.355l-31.704,175.065l163.105-221.545h-71.007
-		c-3.023,0-5.89-1.341-7.828-3.661c-1.938-2.32-2.747-5.38-2.208-8.355l31.704-175.065L149.777,273.231z"/>
-	<path style="fill:#3D3D3D;" d="M267.666,171.348c-0.604,0-1.215-0.054-1.829-0.165c-5.543-1.004-9.223-6.31-8.22-11.853l0.923-5.1
-		c1.003-5.543,6.323-9.225,11.852-8.219c5.543,1.004,9.223,6.31,8.22,11.853l-0.923,5.1
-		C276.797,167.892,272.503,171.348,267.666,171.348z"/>
-	<path style="fill:#3D3D3D;" d="M255.455,238.77c-0.604,0-1.215-0.054-1.83-0.165c-5.543-1.004-9.222-6.31-8.218-11.853
-		l7.037-38.864c1.004-5.543,6.317-9.225,11.854-8.219c5.543,1.004,9.222,6.31,8.219,11.853l-7.037,38.864
-		C264.587,235.314,260.293,238.77,255.455,238.77z"/>
-</g>
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg height="800px" width="800px" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
+	 viewBox="0 0 512 512" xml:space="preserve">
+<polygon style="fill:#FFD500;" points="382.395,228.568 291.215,228.568 330.762,10.199 129.603,283.43 220.785,283.43 
+	181.238,501.799 "/>
+<g>
+	<path style="fill:#3D3D3D;" d="M181.234,512c-1.355,0-2.726-0.271-4.033-0.833c-4.357-1.878-6.845-6.514-5.999-11.184
+		l37.371-206.353h-78.969c-3.846,0-7.367-2.164-9.103-5.597c-1.735-3.433-1.391-7.55,0.889-10.648L322.548,4.153
+		c2.814-3.822,7.891-5.196,12.25-3.32c4.357,1.878,6.845,6.514,5.999,11.184L303.427,218.37h78.969c3.846,0,7.367,2.164,9.103,5.597
+		c1.735,3.433,1.391,7.55-0.889,10.648L189.451,507.846C187.481,510.523,184.399,512,181.234,512z M149.777,273.231h71.007
+		c3.023,0,5.89,1.341,7.828,3.662c1.938,2.32,2.747,5.38,2.208,8.355l-31.704,175.065l163.105-221.545h-71.007
+		c-3.023,0-5.89-1.341-7.828-3.661c-1.938-2.32-2.747-5.38-2.208-8.355l31.704-175.065L149.777,273.231z"/>
+	<path style="fill:#3D3D3D;" d="M267.666,171.348c-0.604,0-1.215-0.054-1.829-0.165c-5.543-1.004-9.223-6.31-8.22-11.853l0.923-5.1
+		c1.003-5.543,6.323-9.225,11.852-8.219c5.543,1.004,9.223,6.31,8.22,11.853l-0.923,5.1
+		C276.797,167.892,272.503,171.348,267.666,171.348z"/>
+	<path style="fill:#3D3D3D;" d="M255.455,238.77c-0.604,0-1.215-0.054-1.83-0.165c-5.543-1.004-9.222-6.31-8.218-11.853
+		l7.037-38.864c1.004-5.543,6.317-9.225,11.854-8.219c5.543,1.004,9.222,6.31,8.219,11.853l-7.037,38.864
+		C264.587,235.314,260.293,238.77,255.455,238.77z"/>
+</g>
 </svg>

frontend/src/components/AppLoading/AppLoading.styles.scss

@@ -74,7 +74,7 @@
 	width: 100%;
 	height: 100%;
 
-	background: radial-gradient(circle, #fff 10%, transparent 0);
+	background: radial-gradient(circle, var(--l1-foreground) 10%, transparent 0);
 	background-size: 12px 12px;
 	opacity: 1;
 

frontend/src/components/AppLoading/__tests__/AppLoading.test.tsx

@@ -9,7 +9,7 @@ jest.mock('../../../api/browser/localstorage/get', () => ({
 }));
 
 // Access the mocked function
-const mockGet = (getLocal as unknown) as jest.Mock;
+const mockGet = getLocal as unknown as jest.Mock;
 
 describe('AppLoading', () => {
 	const SIGNOZ_TEXT = 'SigNoz';

frontend/src/components/AuthError/AuthError.styles.scss

@@ -99,36 +99,6 @@
 	}
 }
 
-.lightMode {
-	.auth-error-container {
-		.error-content {
-			&__error-code {
-				color: var(--l2-foreground);
-			}
-
-			&__error-message {
-				color: var(--l1-foreground);
-			}
-
-			&__message-badge-label-text {
-				color: var(--l2-foreground);
-			}
-
-			&__message-item {
-				color: var(--l1-foreground);
-
-				&::before {
-					background: var(--l3-background);
-				}
-			}
-
-			&__scroll-hint-text {
-				color: var(--l2-foreground);
-			}
-		}
-	}
-}
-
 @keyframes horizontal-shaking {
 	0% {
 		transform: translateX(0);

frontend/src/components/AuthPageContainer/AuthFooter.styles.scss

@@ -87,23 +87,3 @@
 	background: var(--l3-background);
 	flex-shrink: 0;
 }
-
-.lightMode {
-	.auth-footer-content {
-		box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.08);
-	}
-
-	.auth-footer-icon {
-		filter: brightness(0) saturate(100%) invert(25%) sepia(8%) saturate(518%)
-			hue-rotate(192deg) brightness(80%) contrast(95%);
-		opacity: 0.9;
-	}
-
-	.auth-footer-text {
-		color: var(--text-neutral-light-200);
-	}
-
-	.auth-footer-link-icon {
-		color: var(--text-neutral-light-100);
-	}
-}

frontend/src/components/AuthPageContainer/AuthPageContainer.styles.scss

@@ -143,28 +143,3 @@
 		}
 	}
 }
-
-.lightMode {
-	.bg-dot-pattern {
-		background: radial-gradient(
-			circle,
-			var(--l3-background) 1px,
-			transparent 1px
-		);
-		background-size: 12px 12px;
-	}
-
-	.auth-page-gradient {
-		background: radial-gradient(
-			ellipse at center top,
-			color-mix(in srgb, var(--primary-background) 12%, transparent) 0%,
-			transparent 60%
-		);
-		opacity: 0.8;
-		filter: blur(200px);
-
-		@media (min-width: 768px) {
-			filter: blur(300px);
-		}
-	}
-}

frontend/src/components/CeleryOverview/CeleryOverviewConfigOptions/CeleryOverviewConfigOptions.tsx

@@ -31,9 +31,8 @@ export function FilterSelect({
 	onChange,
 	isMultiple,
 }: SelectOptionConfig): JSX.Element {
-	const { handleSearch, isFetching, options } = useCeleryFilterOptions(
-		filterType,
-	);
+	const { handleSearch, isFetching, options } =
+		useCeleryFilterOptions(filterType);
 
 	const urlQuery = useUrlQuery();
 	const history = useHistory();

frontend/src/components/CeleryOverview/CeleryOverviewTable/CeleryOverviewTable.tsx

@@ -280,30 +280,28 @@ function getTableData(data: QueueOverviewResponse['data']): RowData[] {
 	];
 
 	const tableData: RowData[] =
-		data?.map(
-			(row, index: number): RowData => {
-				const rowData: Record<string, string | number> = {};
-				columnOrder.forEach((key) => {
-					const value = row.data[key as keyof typeof row.data];
-					if (typeof value === 'string' || typeof value === 'number') {
-						rowData[key] = value;
-					}
-				});
-				Object.entries(row.data).forEach(([key, value]) => {
-					if (
-						!columnOrder.includes(key) &&
-						(typeof value === 'string' || typeof value === 'number')
-					) {
-						rowData[key] = value;
-					}
-				});
+		data?.map((row, index: number): RowData => {
+			const rowData: Record<string, string | number> = {};
+			columnOrder.forEach((key) => {
+				const value = row.data[key as keyof typeof row.data];
+				if (typeof value === 'string' || typeof value === 'number') {
+					rowData[key] = value;
+				}
+			});
+			Object.entries(row.data).forEach(([key, value]) => {
+				if (
+					!columnOrder.includes(key) &&
+					(typeof value === 'string' || typeof value === 'number')
+				) {
+					rowData[key] = value;
+				}
+			});
 
-				return {
-					...rowData,
-					key: index,
-				};
-			},
-		) || [];
+			return {
+				...rowData,
+				key: index,
+			};
+		}) || [];
 
 	return tableData;
 }
@@ -480,10 +478,10 @@ export default function CeleryOverviewTable({
 		[searchText],
 	);
 
-	const filteredData = useMemo(() => getFilteredData(tableData), [
-		getFilteredData,
-		tableData,
-	]);
+	const filteredData = useMemo(
+		() => getFilteredData(tableData),
+		[getFilteredData, tableData],
+	);
 
 	const prevTableDataRef = useRef<string>();
 

frontend/src/components/CeleryTask/CeleryTaskConfigOptions/CeleryTaskConfigOptions.tsx

@@ -13,9 +13,8 @@ import { useCeleryFilterOptions } from '../useCeleryFilterOptions';
 import './CeleryTaskConfigOptions.styles.scss';
 
 function CeleryTaskConfigOptions(): JSX.Element {
-	const { handleSearch, isFetching, options } = useCeleryFilterOptions(
-		'celery.task_name',
-	);
+	const { handleSearch, isFetching, options } =
+		useCeleryFilterOptions('celery.task_name');
 	const history = useHistory();
 	const location = useLocation();
 

frontend/src/components/CeleryTask/CeleryTaskGraph/CeleryTaskGraph.style.scss

@@ -41,7 +41,6 @@
 		justify-content: center;
 		align-items: center;
 		border: 1px solid var(--l1-border);
-		background: linear-gradient(0deg, transparent 0%, transparent 100%), #0b0c0e;
 
 		.ant-card-body {
 			height: 100%;
@@ -238,18 +237,7 @@
 		height: 2px;
 		bottom: 0;
 		left: 0;
-		background-color: var(--l1-foreground);
-	}
-}
-
-.lightMode {
-	.celery-task-graph-grid-container {
-		.celery-task-graph-worker-count {
-			background: unset;
-		}
-	}
-
-	.configure-option-Info {
-		border: 1px dashed var(--bg-robin-400);
+		background-color: var(--l1-background);
+		color: var(--l1-foreground);
 	}
 }

frontend/src/components/CeleryTask/CeleryTaskGraph/CeleryTaskGraphUtils.ts

@@ -469,8 +469,7 @@ export const celeryActiveTasksWidgetData = (
 				{
 					aggregateAttribute: {
 						dataType: DataTypes.Float64,
-						id:
-							'flower_worker_number_of_currently_executing_tasks--float64--Gauge--true',
+						id: 'flower_worker_number_of_currently_executing_tasks--float64--Gauge--true',
 						key: 'flower_worker_number_of_currently_executing_tasks',
 						type: 'Gauge',
 					},

frontend/src/components/CeleryTask/CeleryTaskGraph/CeleryTaskLatencyGraph.tsx

@@ -127,22 +127,17 @@ function CeleryTaskLatencyGraph({
 	const onGraphClickHandler = useGraphClickHandler(handleSetTimeStamp);
 
 	const onGraphClick = useCallback(
-		(type: string): OnClickPluginOpts['onClick'] => (
-			xValue,
-			yValue,
-			mouseX,
-			mouseY,
-			data,
-		): Promise<void> => {
-			const [firstDataPoint] = Object.entries(data || {});
-			const [entity, value] = firstDataPoint;
-			setEntityData({
-				entity,
-				value,
-			});
+		(type: string): OnClickPluginOpts['onClick'] =>
+			(xValue, yValue, mouseX, mouseY, data): Promise<void> => {
+				const [firstDataPoint] = Object.entries(data || {});
+				const [entity, value] = firstDataPoint;
+				setEntityData({
+					entity,
+					value,
+				});
 
-			return onGraphClickHandler(xValue, yValue, mouseX, mouseY, type);
-		},
+				return onGraphClickHandler(xValue, yValue, mouseX, mouseY, type);
+			},
 		// eslint-disable-next-line react-hooks/exhaustive-deps
 		[handleSetTimeStamp],
 	);

frontend/src/components/CeleryTask/CeleryTaskGraph/CeleryTaskStateGraphConfig.tsx

@@ -92,10 +92,10 @@ function CeleryTaskStateGraphConfig({
 							{isLoading
 								? '-'
 								: isError
-								? '-'
-								: Number.isNaN(values[index])
-								? '-'
-								: Math.round(Number(values[index]))}
+									? '-'
+									: Number.isNaN(values[index])
+										? '-'
+										: Math.round(Number(values[index]))}
 						</div>
 					</div>
 					{tab.key === barState && <div className="celery-task-states__indicator" />}

frontend/src/components/CeleryTask/CeleryUtils.ts

@@ -65,7 +65,7 @@ export function applyCeleryFilterOnWidgetData(
 									items: [...(queryItem.filters?.items || []), ...filters],
 									op: queryItem.filters?.op || 'AND',
 								},
-						  }
+							}
 						: queryItem,
 				),
 			},

frontend/src/components/CeleryTask/useGetGraphCustomSeries.ts

@@ -9,7 +9,7 @@ import { paths } from './CeleryUtils';
 
 interface UseGetGraphCustomSeriesProps {
 	isDarkMode: boolean;
-	drawStyle?: typeof drawStyles[keyof typeof drawStyles];
+	drawStyle?: (typeof drawStyles)[keyof typeof drawStyles];
 	colorMapping?: Record<string, string>;
 }
 

frontend/src/components/CeleryTask/useNavigateToExplorer.ts

@@ -12,6 +12,7 @@ import { AppState } from 'store/reducers';
 import { Query, TagFilterItem } from 'types/api/queryBuilder/queryBuilderData';
 import { DataSource, MetricAggregateOperator } from 'types/common/queryBuilder';
 import { GlobalReducer } from 'types/reducer/globalTime';
+import { withBasePath } from 'utils/basePath';
 
 export interface NavigateToExplorerProps {
 	filters: TagFilterItem[];
@@ -133,7 +134,7 @@ export function useNavigateToExplorer(): (
 				QueryParams.compositeQuery
 			}=${JSONCompositeQuery}`;
 
-			window.open(newExplorerPath, sameTab ? '_self' : '_blank');
+			window.open(withBasePath(newExplorerPath), sameTab ? '_self' : '_blank');
 		},
 		[
 			prepareQuery,

frontend/src/components/ChangelogModal/ChangelogModal.tsx

@@ -37,9 +37,8 @@ function ChangelogModal({ changelog, onClose }: Props): JSX.Element {
 			preference.name === USER_PREFERENCES.LAST_SEEN_CHANGELOG_VERSION,
 	)?.value as string;
 
-	const { mutate: updateUserPreferenceMutation } = useMutation(
-		updateUserPreference,
-	);
+	const { mutate: updateUserPreferenceMutation } =
+		useMutation(updateUserPreference);
 
 	useEffect(() => {
 		// Update the seen version
@@ -60,11 +59,8 @@ function ChangelogModal({ changelog, onClose }: Props): JSX.Element {
 
 	const checkScroll = useCallback((): void => {
 		if (changelogContentSectionRef.current) {
-			const {
-				scrollHeight,
-				clientHeight,
-				scrollTop,
-			} = changelogContentSectionRef.current;
+			const { scrollHeight, clientHeight, scrollTop } =
+				changelogContentSectionRef.current;
 			const isAtBottom = scrollHeight - clientHeight - scrollTop <= 8;
 			setHasScroll(scrollHeight > clientHeight + 24 && !isAtBottom); // 24px - buffer height to show show more
 		}

frontend/src/components/ChatSupportGateway/ChatSupportGateway.tsx

@@ -9,13 +9,13 @@ import { CreditCard, MessageSquareText, X } from 'lucide-react';
 import { SuccessResponseV2 } from 'types/api';
 import { CheckoutSuccessPayloadProps } from 'types/api/billing/checkout';
 import APIError from 'types/api/error';
+import { getBaseUrl } from 'utils/basePath';
 
 export default function ChatSupportGateway(): JSX.Element {
 	const { notifications } = useNotifications();
 
-	const [isAddCreditCardModalOpen, setIsAddCreditCardModalOpen] = useState(
-		false,
-	);
+	const [isAddCreditCardModalOpen, setIsAddCreditCardModalOpen] =
+		useState(false);
 
 	const handleBillingOnSuccess = (
 		data: SuccessResponseV2<CheckoutSuccessPayloadProps>,
@@ -54,7 +54,7 @@ export default function ChatSupportGateway(): JSX.Element {
 		});
 
 		updateCreditCard({
-			url: window.location.origin,
+			url: getBaseUrl(),
 		});
 	};
 

frontend/src/components/ClientSideQBSearch/ClientSideQBSearch.tsx

@@ -388,7 +388,7 @@ function ClientSideQBSearch(
 						({
 							label: key.key,
 							value: key,
-						} as Option),
+						}) as Option,
 				) || [],
 			);
 		}
@@ -462,7 +462,7 @@ function ClientSideQBSearch(
 							({
 								label: checkCommaInValue(String(val)),
 								value: val,
-							} as Option),
+							}) as Option,
 					),
 				);
 			} else {
@@ -490,7 +490,7 @@ function ClientSideQBSearch(
 				Array.isArray(tag.value) &&
 				tag.value[tag.value.length - 1] === ''
 					? tag.value?.slice(0, -1)
-					: tag.value ?? '';
+					: (tag.value ?? '');
 			filterTags.items.push({
 				id: tag.id || uuid().slice(0, 8),
 				key: tag.key,

frontend/src/components/CreateServiceAccountModal/CreateServiceAccountModal.tsx

@@ -32,6 +32,7 @@ function CreateServiceAccountModal(): JSX.Element {
 		SA_QUERY_PARAMS.CREATE_SA,
 		parseAsBoolean.withDefault(false),
 	);
+	const [, setSelectedAccountId] = useQueryState(SA_QUERY_PARAMS.ACCOUNT);
 
 	const { showErrorModal, isErrorModalVisible } = useErrorModal();
 
@@ -47,29 +48,28 @@ function CreateServiceAccountModal(): JSX.Element {
 		},
 	});
 
-	const {
-		mutate: createServiceAccount,
-		isLoading: isSubmitting,
-	} = useCreateServiceAccount({
-		mutation: {
-			onSuccess: async () => {
-				toast.success('Service account created successfully');
-				reset();
-				await setIsOpen(null);
-				await invalidateListServiceAccounts(queryClient);
+	const { mutate: createServiceAccount, isLoading: isSubmitting } =
+		useCreateServiceAccount({
+			mutation: {
+				onSuccess: async (response) => {
+					toast.success('Service account created successfully');
+					reset();
+					await setIsOpen(null);
+					await invalidateListServiceAccounts(queryClient);
+					await setSelectedAccountId(response.data.id);
+				},
+				onError: (err) => {
+					const errMessage = convertToApiError(
+						err as AxiosError<RenderErrorResponseDTO, unknown> | null,
+					);
+					showErrorModal(errMessage as APIError);
+				},
 			},
-			onError: (err) => {
-				const errMessage = convertToApiError(
-					err as AxiosError<RenderErrorResponseDTO, unknown> | null,
-				);
-				showErrorModal(errMessage as APIError);
-			},
-		},
-	});
+		});
 
 	function handleClose(): void {
 		reset();
-		setIsOpen(null);
+		void setIsOpen(null);
 	}
 
 	function handleCreate(values: FormValues): void {

frontend/src/components/CustomTimePicker/CustomTimePicker.styles.scss

@@ -77,11 +77,11 @@
 		width: 280px;
 
 		&::placeholder {
-			color: white;
+			color: var(--l1-foreground);
 		}
 
 		&:focus::placeholder {
-			color: rgba($color: #ffffff, $alpha: 0.4);
+			color: rgba($color: var(--l1-foreground), $alpha: 0.4);
 		}
 	}
 }
@@ -113,42 +113,6 @@
 	}
 }
 
-.lightMode {
-	.time-options-container {
-		.time-options-item {
-			&.active {
-				background-color: rgba($color: #ffffff, $alpha: 0.2);
-
-				&:hover {
-					cursor: pointer;
-					background-color: rgba($color: #ffffff, $alpha: 0.3);
-				}
-			}
-
-			&:hover {
-				cursor: pointer;
-				background-color: rgba($color: #ffffff, $alpha: 0.3);
-			}
-		}
-	}
-
-	.timeSelection-input {
-		display: flex;
-		gap: 8px;
-		align-items: center;
-		padding: 4px 8px;
-		padding-left: 0px !important;
-
-		input::placeholder {
-			color: var(---bg-ink-300);
-		}
-
-		input:focus::placeholder {
-			color: rgba($color: #000000, $alpha: 0.4);
-		}
-	}
-}
-
 .date-time-popover__footer {
 	border-top: 1px solid var(--l1-border);
 	padding: 8px 14px;
@@ -300,34 +264,3 @@
 		background: color-mix(in srgb, var(--bg-robin-200) 8%, transparent);
 	}
 }
-
-.lightMode {
-	.timezone-container {
-		.timezone {
-			background: rgb(179 179 179 / 15%);
-			&__icon {
-				stroke: var(--l1-foreground);
-			}
-		}
-	}
-
-	.custom-time-picker {
-		.timeSelection-input {
-			&:hover {
-				border-color: var(--l1-border) !important;
-			}
-		}
-	}
-
-	.timezone-badge {
-		background: rgb(179 179 179 / 15%);
-	}
-
-	.time-input-suffix-icon-badge {
-		background: rgb(179 179 179 / 15%);
-
-		&:hover {
-			background: rgb(179 179 179 / 20%);
-		}
-	}
-}

frontend/src/components/CustomTimePicker/CustomTimePicker.tsx

@@ -96,10 +96,8 @@ function CustomTimePicker({
 	maxTime,
 	isModalTimeSelection = false,
 }: CustomTimePickerProps): JSX.Element {
-	const [
-		selectedTimePlaceholderValue,
-		setSelectedTimePlaceholderValue,
-	] = useState('Select / Enter Time Range');
+	const [selectedTimePlaceholderValue, setSelectedTimePlaceholderValue] =
+		useState('Select / Enter Time Range');
 
 	const [inputValue, setInputValue] = useState('');
 	const [inputStatus, setInputStatus] = useState<CustomTimePickerInputStatus>(

frontend/src/components/CustomTimePicker/CustomTimePickerPopoverContent.tsx

@@ -116,9 +116,10 @@ function CustomTimePickerPopoverContent({
 }: CustomTimePickerPopoverContentProps): JSX.Element {
 	const { pathname } = useLocation();
 
-	const isLogsExplorerPage = useMemo(() => pathname === ROUTES.LOGS_EXPLORER, [
-		pathname,
-	]);
+	const isLogsExplorerPage = useMemo(
+		() => pathname === ROUTES.LOGS_EXPLORER,
+		[pathname],
+	);
 
 	const url = new URLSearchParams(window.location.search);
 
@@ -154,8 +155,8 @@ function CustomTimePickerPopoverContent({
 		if (!customDateTimeVisible) {
 			const customTimeRanges = getCustomTimeRanges();
 
-			const formattedCustomTimeRanges: RecentlyUsedDateTimeRange[] = customTimeRanges.map(
-				(range) => ({
+			const formattedCustomTimeRanges: RecentlyUsedDateTimeRange[] =
+				customTimeRanges.map((range) => ({
 					label: `${dayjs(range.from)
 						.tz(timezone.value)
 						.format(DATE_TIME_FORMATS.DD_MMM_YYYY_HH_MM_SS)} - ${dayjs(range.to)
@@ -165,8 +166,7 @@ function CustomTimePickerPopoverContent({
 					to: range.to,
 					value: range.timestamp,
 					timestamp: range.timestamp,
-				}),
-			);
+				}));
 
 			setRecentlyUsedTimeRanges(formattedCustomTimeRanges);
 		}

frontend/src/components/CustomTimePicker/TimezonePicker.styles.scss

@@ -129,20 +129,3 @@ $item-spacing: 8px;
 		width: 15px;
 	}
 }
-
-.lightMode {
-	.timezone-picker {
-		&__search {
-			.search-icon {
-				stroke: var(--l1-foreground);
-			}
-		}
-	}
-	.timezone-name-wrapper {
-		&__selected-icon {
-			.check-icon {
-				stroke: var(--l1-foreground);
-			}
-		}
-	}
-}

frontend/src/components/CustomTimePicker/timezoneUtils.ts

@@ -19,7 +19,7 @@ const TIMEZONE_TYPES = {
 	STANDARD: 'STANDARD',
 } as const;
 
-type TimezoneType = typeof TIMEZONE_TYPES[keyof typeof TIMEZONE_TYPES];
+type TimezoneType = (typeof TIMEZONE_TYPES)[keyof typeof TIMEZONE_TYPES];
 
 export const UTC_TIMEZONE: Timezone = {
 	name: 'Coordinated Universal Time — UTC, GMT',

frontend/src/components/DownloadOptionsMenu/DownloadOptionsMenu.test.tsx

@@ -213,7 +213,7 @@ describe.each([
 			const callArgs = mockDownloadExportData.mock.calls[0][0];
 			const query = callArgs.body.compositeQuery.queries[0];
 			expect(query.spec.groupBy).toBeUndefined();
-			expect(query.spec.having).toEqual({ expression: '' });
+			expect(query.spec.having).toStrictEqual({ expression: '' });
 		});
 	});
 
@@ -238,7 +238,7 @@ describe.each([
 			expect(mockDownloadExportData).toHaveBeenCalledTimes(1);
 			const callArgs = mockDownloadExportData.mock.calls[0][0];
 			const query = callArgs.body.compositeQuery.queries[0];
-			expect(query.spec.selectFields).toEqual([
+			expect(query.spec.selectFields).toStrictEqual([
 				expect.objectContaining({
 					name: 'http.status',
 					fieldDataType: 'int64',

frontend/src/components/DraggableTableRow/index.tsx

@@ -41,8 +41,7 @@ function DraggableTableRow({
 	);
 }
 
-interface DraggableTableRowProps
-	extends React.HTMLAttributes<HTMLTableRowElement> {
+interface DraggableTableRowProps extends React.HTMLAttributes<HTMLTableRowElement> {
 	index: number;
 	moveRow: (dragIndex: number, hoverIndex: number) => void;
 }

frontend/src/components/DraggableTableRow/tests/utils.test.ts

@@ -6,39 +6,39 @@ jest.mock('react-dnd', () => ({
 }));
 
 describe('Utils testing of DraggableTableRow component', () => {
-	test('Should dropHandler return true', () => {
+	it('Should dropHandler return true', () => {
 		const monitor = {
 			isOver: jest.fn().mockReturnValueOnce(true),
 		} as never;
 		const dropDataTruthy = dropHandler(monitor);
 
-		expect(dropDataTruthy).toEqual({ isOver: true });
+		expect(dropDataTruthy).toStrictEqual({ isOver: true });
 	});
 
-	test('Should dropHandler return false', () => {
+	it('Should dropHandler return false', () => {
 		const monitor = {
 			isOver: jest.fn().mockReturnValueOnce(false),
 		} as never;
 		const dropDataFalsy = dropHandler(monitor);
 
-		expect(dropDataFalsy).toEqual({ isOver: false });
+		expect(dropDataFalsy).toStrictEqual({ isOver: false });
 	});
 
-	test('Should dragHandler return true', () => {
+	it('Should dragHandler return true', () => {
 		const monitor = {
 			isDragging: jest.fn().mockReturnValueOnce(true),
 		} as never;
 		const dragDataTruthy = dragHandler(monitor);
 
-		expect(dragDataTruthy).toEqual({ isDragging: true });
+		expect(dragDataTruthy).toStrictEqual({ isDragging: true });
 	});
 
-	test('Should dragHandler return false', () => {
+	it('Should dragHandler return false', () => {
 		const monitor = {
 			isDragging: jest.fn().mockReturnValueOnce(false),
 		} as never;
 		const dragDataFalsy = dragHandler(monitor);
 
-		expect(dragDataFalsy).toEqual({ isDragging: false });
+		expect(dragDataFalsy).toStrictEqual({ isDragging: false });
 	});
 });

frontend/src/components/DraggableTableRow/utils.ts

@@ -6,9 +6,9 @@ export function dropHandler(monitor: DropTargetMonitor): { isOver: boolean } {
 	};
 }
 
-export function dragHandler(
-	monitor: DragSourceMonitor,
-): { isDragging: boolean } {
+export function dragHandler(monitor: DragSourceMonitor): {
+	isDragging: boolean;
+} {
 	return {
 		isDragging: monitor.isDragging(),
 	};

frontend/src/components/DropDown/DropDown.styles.scss

@@ -1,9 +1,5 @@
 .dropdown-button {
-	color: #fff;
-}
-
-.dropdown-button--dark {
-	color: #000;
+	color: var(--l1-foreground);
 }
 
 .dropdown-icon {

frontend/src/components/DropDown/DropDown.tsx

@@ -1,7 +1,6 @@
 import { useState } from 'react';
 import { EllipsisOutlined } from '@ant-design/icons';
 import { Button, Dropdown, MenuProps } from 'antd';
-import { useIsDarkMode } from 'hooks/useDarkMode';
 
 import './DropDown.styles.scss';
 
@@ -12,8 +11,6 @@ function DropDown({
 	element: JSX.Element[];
 	onDropDownItemClick?: MenuProps['onClick'];
 }): JSX.Element {
-	const isDarkMode = useIsDarkMode();
-
 	const items: MenuProps['items'] = element.map(
 		(e: JSX.Element, index: number) => ({
 			label: e,
@@ -35,7 +32,7 @@ function DropDown({
 		>
 			<Button
 				type="link"
-				className={!isDarkMode ? 'dropdown-button--dark' : 'dropdown-button'}
+				className={`dropdown-button`}
 				onClick={(e): void => {
 					e.preventDefault();
 					setDdOpen(true);

frontend/src/components/EditMemberDrawer/EditMemberDrawer.tsx

@@ -28,6 +28,7 @@ import { useAppContext } from 'providers/App/App';
 import { useErrorModal } from 'providers/ErrorModalProvider';
 import { useTimezone } from 'providers/Timezone';
 import APIError from 'types/api/error';
+import { getAbsoluteUrl } from 'utils/basePath';
 import { toAPIError } from 'utils/errorUtils';
 
 import DeleteMemberDialog from './DeleteMemberDialog';
@@ -157,10 +158,8 @@ function EditMemberDrawer({
 		new Date(String(existingToken.expiresAt)) < new Date();
 
 	// Create/regenerate token mutation
-	const {
-		mutateAsync: createTokenMutation,
-		isLoading: isGeneratingLink,
-	} = useCreateResetPasswordToken();
+	const { mutateAsync: createTokenMutation, isLoading: isGeneratingLink } =
+		useCreateResetPasswordToken();
 
 	const fetchedDisplayName =
 		fetchedUser?.data?.displayName ?? member?.name ?? '';
@@ -220,22 +219,20 @@ function EditMemberDrawer({
 	});
 
 	const makeRoleRetry = useCallback(
-		(
-			context: string,
-			rawRetry: () => Promise<void>,
-		) => async (): Promise<void> => {
-			try {
-				await rawRetry();
-				setSaveErrors((prev) => prev.filter((e) => e.context !== context));
-				refetchUser();
-			} catch (err) {
-				setSaveErrors((prev) =>
-					prev.map((e) =>
-						e.context === context ? { ...e, apiError: toSaveApiError(err) } : e,
-					),
-				);
-			}
-		},
+		(context: string, rawRetry: () => Promise<void>) =>
+			async (): Promise<void> => {
+				try {
+					await rawRetry();
+					setSaveErrors((prev) => prev.filter((e) => e.context !== context));
+					refetchUser();
+				} catch (err) {
+					setSaveErrors((prev) =>
+						prev.map((e) =>
+							e.context === context ? { ...e, apiError: toSaveApiError(err) } : e,
+						),
+					);
+				}
+			},
 		[refetchUser],
 	);
 
@@ -279,7 +276,7 @@ function EditMemberDrawer({
 					: updateUser({
 							pathParams: { id: member.id },
 							data: { displayName: localDisplayName },
-					  })
+						})
 				: Promise.resolve();
 
 			const [nameResult, rolesResult] = await Promise.allSettled([
@@ -381,14 +378,14 @@ function EditMemberDrawer({
 				pathParams: { id: member.id },
 			});
 			if (response?.data?.token) {
-				const link = `${window.location.origin}/password-reset?token=${response.data.token}`;
+				const link = getAbsoluteUrl(`/password-reset?token=${response.data.token}`);
 				setResetLink(link);
 				setResetLinkExpiresAt(
 					response.data.expiresAt
 						? formatTimezoneAdjustedTimestamp(
 								String(response.data.expiresAt),
 								DATE_TIME_FORMATS.DASH_DATETIME,
-						  )
+							)
 						: null,
 				);
 				setHasCopiedResetLink(false);
@@ -497,8 +494,8 @@ function EditMemberDrawer({
 							isRootUser
 								? ROOT_USER_TOOLTIP
 								: isDeleted
-								? undefined
-								: 'You cannot modify your own role'
+									? undefined
+									: 'You cannot modify your own role'
 						}
 					>
 						<div className="edit-member-drawer__input-wrapper edit-member-drawer__input-wrapper--disabled">
@@ -621,13 +618,13 @@ function EditMemberDrawer({
 									{isGeneratingLink
 										? 'Generating...'
 										: isInvited
-										? getInviteButtonLabel(
-												isLoadingTokenStatus,
-												existingToken,
-												isTokenExpired,
-												tokenNotFound,
-										  )
-										: 'Generate Password Reset Link'}
+											? getInviteButtonLabel(
+													isLoadingTokenStatus,
+													existingToken,
+													isTokenExpired,
+													tokenNotFound,
+												)
+											: 'Generate Password Reset Link'}
 								</Button>
 							</span>
 						</Tooltip>

frontend/src/components/EditMemberDrawer/__tests__/EditMemberDrawer.test.tsx

@@ -361,9 +361,9 @@ describe('EditMemberDrawer', () => {
 
 		await user.click(screen.getByRole('button', { name: /delete member/i }));
 
-		expect(
-			await screen.findByText(/are you sure you want to delete/i),
-		).toBeInTheDocument();
+		await expect(
+			screen.findByText(/are you sure you want to delete/i),
+		).resolves.toBeInTheDocument();
 
 		const confirmBtns = screen.getAllByRole('button', { name: /delete member/i });
 		await user.click(confirmBtns[confirmBtns.length - 1]);
@@ -441,9 +441,9 @@ describe('EditMemberDrawer', () => {
 
 		await user.click(screen.getByRole('button', { name: /revoke invite/i }));
 
-		expect(
-			await screen.findByText(/Are you sure you want to revoke the invite/i),
-		).toBeInTheDocument();
+		await expect(
+			screen.findByText(/Are you sure you want to revoke the invite/i),
+		).resolves.toBeInTheDocument();
 
 		const confirmBtns = screen.getAllByRole('button', { name: /revoke invite/i });
 		await user.click(confirmBtns[confirmBtns.length - 1]);

frontend/src/components/ErrorModal/components/ErrorContent.styles.scss

@@ -168,9 +168,12 @@
 		gap: 3px;
 		background: var(--l1-border);
 		border-radius: 20px;
-		box-shadow: 0px 103px 12px 0px rgba(0, 0, 0, 0.01),
-			0px 66px 18px 0px rgba(0, 0, 0, 0.01), 0px 37px 22px 0px rgba(0, 0, 0, 0.03),
-			0px 17px 17px 0px rgba(0, 0, 0, 0.04), 0px 4px 9px 0px rgba(0, 0, 0, 0.04);
+		box-shadow:
+			0px 103px 12px 0px rgba(0, 0, 0, 0.01),
+			0px 66px 18px 0px rgba(0, 0, 0, 0.01),
+			0px 37px 22px 0px rgba(0, 0, 0, 0.03),
+			0px 17px 17px 0px rgba(0, 0, 0, 0.04),
+			0px 4px 9px 0px rgba(0, 0, 0, 0.04);
 	}
 
 	&__scroll-hint-text {

frontend/src/components/ErrorModal/components/ErrorContent.tsx

@@ -25,15 +25,14 @@ function ErrorContent({ error, icon }: ErrorContentProps): JSX.Element {
 		errors: errorMessages,
 		code: errorCode,
 		message: errorMessage,
-	} =
-		error && 'error' in error
-			? error?.error?.error || {}
-			: {
-					url: undefined,
-					errors: [],
-					code: error.code || 500,
-					message: error.message || 'Something went wrong',
-			  };
+	} = error && 'error' in error
+		? error?.error?.error || {}
+		: {
+				url: undefined,
+				errors: [],
+				code: error.code || 500,
+				message: error.message || 'Something went wrong',
+			};
 	return (
 		<section className="error-content">
 			{/* Summary Header */}

frontend/src/components/ExplorerCard/MenuItemGenerator.tsx

@@ -23,11 +23,8 @@ function MenuItemGenerator({
 	refetchAllView,
 	sourcePage,
 }: MenuItemLabelGeneratorProps): JSX.Element {
-	const {
-		panelType,
-		redirectWithQueryBuilderData,
-		updateAllQueriesOperators,
-	} = useQueryBuilder();
+	const { panelType, redirectWithQueryBuilderData, updateAllQueriesOperators } =
+		useQueryBuilder();
 	const { handleExplorerTabChange } = useHandleExplorerTabChange();
 
 	const { notifications } = useNotifications();

frontend/src/components/ExplorerCard/SaveViewWithName.tsx

@@ -17,11 +17,8 @@ function SaveViewWithName({
 }: SaveViewWithNameProps): JSX.Element {
 	const [form] = Form.useForm<SaveViewFormProps>();
 	const { t } = useTranslation(['explorer']);
-	const {
-		currentQuery,
-		panelType,
-		redirectWithQueryBuilderData,
-	} = useQueryBuilder();
+	const { currentQuery, panelType, redirectWithQueryBuilderData } =
+		useQueryBuilder();
 	const { notifications } = useNotifications();
 	const compositeQuery = mapCompositeQueryFromQuery(currentQuery, panelType);
 

frontend/src/components/ExplorerCard/constants.ts

@@ -1,8 +1,7 @@
 import { QueryParams } from 'constants/query';
 
 export const ExploreHeaderToolTip = {
-	url:
-		'https://signoz.io/docs/userguide/query-builder/?utm_source=product&utm_medium=new-query-builder',
+	url: 'https://signoz.io/docs/userguide/query-builder/?utm_source=product&utm_medium=new-query-builder',
 	text: 'More details on how to use query builder',
 };
 

frontend/src/components/Graph/Plugin/DragSelect.ts

@@ -55,9 +55,8 @@ function createMousedownHandler(
 			startDragPositionX = right;
 		}
 
-		const startValuePositionX = chart.scales.x.getValueForPixel(
-			startDragPositionX,
-		);
+		const startValuePositionX =
+			chart.scales.x.getValueForPixel(startDragPositionX);
 
 		dragData.onDragStart(startDragPositionX, startValuePositionX);
 	};
@@ -109,9 +108,8 @@ function createMouseupHandler(
 			endRelativePostionX = right;
 		}
 
-		const endValuePositionX = chart.scales.x.getValueForPixel(
-			endRelativePostionX,
-		);
+		const endValuePositionX =
+			chart.scales.x.getValueForPixel(endRelativePostionX);
 
 		dragData.onDragEnd(endRelativePostionX, endValuePositionX);
 

frontend/src/components/Graph/Plugin/IntersectionCursor.ts

@@ -12,11 +12,12 @@ export type IntersectionCursorPluginOptions = {
 	gapSize?: number;
 };
 
-export const defaultIntersectionCursorPluginOptions: Required<IntersectionCursorPluginOptions> = {
-	color: 'white',
-	dashSize: 3,
-	gapSize: 3,
-};
+export const defaultIntersectionCursorPluginOptions: Required<IntersectionCursorPluginOptions> =
+	{
+		color: 'white',
+		dashSize: 3,
+		gapSize: 3,
+	};
 
 export function createIntersectionCursorPluginOptions(
 	isEnabled: boolean,

frontend/src/components/Graph/Plugin/Legend.ts

@@ -52,7 +52,7 @@ export const legend = (id: string, isLonger: boolean): Plugin<ChartType> => ({
 		])
 			? get(chart, ['options', 'plugins', 'legend', 'labels', 'generateLabels'])(
 					chart,
-			  )
+				)
 			: null;
 
 		items?.forEach((item: Record<any, any>, index: number) => {
@@ -64,7 +64,7 @@ export const legend = (id: string, isLonger: boolean): Plugin<ChartType> => ({
 			// li.style.marginTop = '5px';
 
 			li.onclick = (): void => {
-				// @ts-ignore
+				// @ts-expect-error
 				const { type } = chart.config;
 				if (type === 'pie' || type === 'doughnut') {
 					// Pie and doughnut charts only have a single dataset and visibility is per item

frontend/src/components/Graph/__tests__/xAxisConfig.test.ts

@@ -9,65 +9,65 @@ describe('xAxisConfig for Chart', () => {
 				const start = dayjs();
 				const end = start.add(10, 'millisecond');
 
-				expect(convertTimeRange(start.valueOf(), end.valueOf()).unitName).toEqual(
-					TIME_UNITS.millisecond,
-				);
+				expect(
+					convertTimeRange(start.valueOf(), end.valueOf()).unitName,
+				).toStrictEqual(TIME_UNITS.millisecond);
 			}
 			{
 				const start = dayjs();
 				const end = start.add(10, 'second');
 
-				expect(convertTimeRange(start.valueOf(), end.valueOf()).unitName).toEqual(
-					TIME_UNITS.second,
-				);
+				expect(
+					convertTimeRange(start.valueOf(), end.valueOf()).unitName,
+				).toStrictEqual(TIME_UNITS.second);
 			}
 			{
 				const start = dayjs();
 				const end = start.add(10, 'minute');
 
-				expect(convertTimeRange(start.valueOf(), end.valueOf()).unitName).toEqual(
-					TIME_UNITS.minute,
-				);
+				expect(
+					convertTimeRange(start.valueOf(), end.valueOf()).unitName,
+				).toStrictEqual(TIME_UNITS.minute);
 			}
 			{
 				const start = dayjs();
 				const end = start.add(10, 'hour');
 
-				expect(convertTimeRange(start.valueOf(), end.valueOf()).unitName).toEqual(
-					TIME_UNITS.hour,
-				);
+				expect(
+					convertTimeRange(start.valueOf(), end.valueOf()).unitName,
+				).toStrictEqual(TIME_UNITS.hour);
 			}
 			{
 				const start = dayjs();
 				const end = start.add(10, 'day');
 
-				expect(convertTimeRange(start.valueOf(), end.valueOf()).unitName).toEqual(
-					TIME_UNITS.day,
-				);
+				expect(
+					convertTimeRange(start.valueOf(), end.valueOf()).unitName,
+				).toStrictEqual(TIME_UNITS.day);
 			}
 			{
 				const start = dayjs();
 				const end = start.add(10, 'week');
 
-				expect(convertTimeRange(start.valueOf(), end.valueOf()).unitName).toEqual(
-					TIME_UNITS.week,
-				);
+				expect(
+					convertTimeRange(start.valueOf(), end.valueOf()).unitName,
+				).toStrictEqual(TIME_UNITS.week);
 			}
 			{
 				const start = dayjs();
 				const end = start.add(10, 'month');
 
-				expect(convertTimeRange(start.valueOf(), end.valueOf()).unitName).toEqual(
-					TIME_UNITS.month,
-				);
+				expect(
+					convertTimeRange(start.valueOf(), end.valueOf()).unitName,
+				).toStrictEqual(TIME_UNITS.month);
 			}
 			{
 				const start = dayjs();
 				const end = start.add(10, 'year');
 
-				expect(convertTimeRange(start.valueOf(), end.valueOf()).unitName).toEqual(
-					TIME_UNITS.year,
-				);
+				expect(
+					convertTimeRange(start.valueOf(), end.valueOf()).unitName,
+				).toStrictEqual(TIME_UNITS.year);
 			}
 		});
 	});

frontend/src/components/Graph/__tests__/yAxisConfig.test.ts

@@ -7,7 +7,7 @@ const testFullPrecisionGetYAxisFormattedValue = (
 ): string => getYAxisFormattedValue(value, format, PrecisionOptionsEnum.FULL);
 
 describe('getYAxisFormattedValue - none (full precision legacy assertions)', () => {
-	test('large integers and decimals', () => {
+	it('large integers and decimals', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('250034', 'none')).toBe(
 			'250034',
 		);
@@ -22,7 +22,7 @@ describe('getYAxisFormattedValue - none (full precision legacy assertions)', ()
 		);
 	});
 
-	test('preserves leading zeros after decimal until first non-zero', () => {
+	it('preserves leading zeros after decimal until first non-zero', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('1.0000234', 'none')).toBe(
 			'1.0000234',
 		);
@@ -31,7 +31,7 @@ describe('getYAxisFormattedValue - none (full precision legacy assertions)', ()
 		);
 	});
 
-	test('trims to three significant decimals and removes trailing zeros', () => {
+	it('trims to three significant decimals and removes trailing zeros', () => {
 		expect(
 			testFullPrecisionGetYAxisFormattedValue('0.000000250034', 'none'),
 		).toBe('0.000000250034');
@@ -55,7 +55,7 @@ describe('getYAxisFormattedValue - none (full precision legacy assertions)', ()
 		).toBe('0.00000025');
 	});
 
-	test('whole numbers normalize', () => {
+	it('whole numbers normalize', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('1000', 'none')).toBe('1000');
 		expect(testFullPrecisionGetYAxisFormattedValue('99.5458', 'none')).toBe(
 			'99.5458',
@@ -68,7 +68,7 @@ describe('getYAxisFormattedValue - none (full precision legacy assertions)', ()
 		);
 	});
 
-	test('strip redundant decimal zeros', () => {
+	it('strip redundant decimal zeros', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('1000.000', 'none')).toBe(
 			'1000',
 		);
@@ -78,7 +78,7 @@ describe('getYAxisFormattedValue - none (full precision legacy assertions)', ()
 		expect(testFullPrecisionGetYAxisFormattedValue('1.000', 'none')).toBe('1');
 	});
 
-	test('edge values', () => {
+	it('edge values', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('0', 'none')).toBe('0');
 		expect(testFullPrecisionGetYAxisFormattedValue('-0', 'none')).toBe('0');
 		expect(testFullPrecisionGetYAxisFormattedValue('Infinity', 'none')).toBe('∞');
@@ -92,7 +92,7 @@ describe('getYAxisFormattedValue - none (full precision legacy assertions)', ()
 		expect(testFullPrecisionGetYAxisFormattedValue('abc123', 'none')).toBe('NaN');
 	});
 
-	test('small decimals keep precision as-is', () => {
+	it('small decimals keep precision as-is', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('0.0001', 'none')).toBe(
 			'0.0001',
 		);
@@ -104,7 +104,7 @@ describe('getYAxisFormattedValue - none (full precision legacy assertions)', ()
 		);
 	});
 
-	test('simple decimals preserved', () => {
+	it('simple decimals preserved', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('0.1', 'none')).toBe('0.1');
 		expect(testFullPrecisionGetYAxisFormattedValue('0.2', 'none')).toBe('0.2');
 		expect(testFullPrecisionGetYAxisFormattedValue('0.3', 'none')).toBe('0.3');
@@ -115,7 +115,7 @@ describe('getYAxisFormattedValue - none (full precision legacy assertions)', ()
 });
 
 describe('getYAxisFormattedValue - units (full precision legacy assertions)', () => {
-	test('ms', () => {
+	it('ms', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('1500', 'ms')).toBe('1.5 s');
 		expect(testFullPrecisionGetYAxisFormattedValue('500', 'ms')).toBe('500 ms');
 		expect(testFullPrecisionGetYAxisFormattedValue('60000', 'ms')).toBe('1 min');
@@ -127,19 +127,19 @@ describe('getYAxisFormattedValue - units (full precision legacy assertions)', ()
 		);
 	});
 
-	test('s', () => {
+	it('s', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('90', 's')).toBe('1.5 mins');
 		expect(testFullPrecisionGetYAxisFormattedValue('30', 's')).toBe('30 s');
 		expect(testFullPrecisionGetYAxisFormattedValue('3600', 's')).toBe('1 hour');
 	});
 
-	test('m', () => {
+	it('m', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('90', 'm')).toBe('1.5 hours');
 		expect(testFullPrecisionGetYAxisFormattedValue('30', 'm')).toBe('30 min');
 		expect(testFullPrecisionGetYAxisFormattedValue('1440', 'm')).toBe('1 day');
 	});
 
-	test('bytes', () => {
+	it('bytes', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('1024', 'bytes')).toBe(
 			'1 KiB',
 		);
@@ -149,7 +149,7 @@ describe('getYAxisFormattedValue - units (full precision legacy assertions)', ()
 		);
 	});
 
-	test('mbytes', () => {
+	it('mbytes', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('1024', 'mbytes')).toBe(
 			'1 GiB',
 		);
@@ -161,7 +161,7 @@ describe('getYAxisFormattedValue - units (full precision legacy assertions)', ()
 		);
 	});
 
-	test('kbytes', () => {
+	it('kbytes', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('1024', 'kbytes')).toBe(
 			'1 MiB',
 		);
@@ -173,7 +173,7 @@ describe('getYAxisFormattedValue - units (full precision legacy assertions)', ()
 		);
 	});
 
-	test('short', () => {
+	it('short', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('1000', 'short')).toBe('1 K');
 		expect(testFullPrecisionGetYAxisFormattedValue('1500', 'short')).toBe(
 			'1.5 K',
@@ -201,7 +201,7 @@ describe('getYAxisFormattedValue - units (full precision legacy assertions)', ()
 		);
 	});
 
-	test('percent', () => {
+	it('percent', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('0.15', 'percent')).toBe(
 			'0.15%',
 		);
@@ -235,7 +235,7 @@ describe('getYAxisFormattedValue - units (full precision legacy assertions)', ()
 		).toBe('1.005555555595959%');
 	});
 
-	test('ratio', () => {
+	it('ratio', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('0.5', 'ratio')).toBe(
 			'0.5 ratio',
 		);
@@ -247,7 +247,7 @@ describe('getYAxisFormattedValue - units (full precision legacy assertions)', ()
 		);
 	});
 
-	test('temperature units', () => {
+	it('temperature units', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('25', 'celsius')).toBe(
 			'25 °C',
 		);
@@ -267,13 +267,13 @@ describe('getYAxisFormattedValue - units (full precision legacy assertions)', ()
 		);
 	});
 
-	test('ms edge cases', () => {
+	it('ms edge cases', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('0', 'ms')).toBe('0 ms');
 		expect(testFullPrecisionGetYAxisFormattedValue('-1500', 'ms')).toBe('-1.5 s');
 		expect(testFullPrecisionGetYAxisFormattedValue('Infinity', 'ms')).toBe('∞');
 	});
 
-	test('bytes edge cases', () => {
+	it('bytes edge cases', () => {
 		expect(testFullPrecisionGetYAxisFormattedValue('0', 'bytes')).toBe('0 B');
 		expect(testFullPrecisionGetYAxisFormattedValue('-1024', 'bytes')).toBe(
 			'-1 KiB',
@@ -282,7 +282,7 @@ describe('getYAxisFormattedValue - units (full precision legacy assertions)', ()
 });
 
 describe('getYAxisFormattedValue - precision option tests', () => {
-	test('precision 0 drops decimal part', () => {
+	it('precision 0 drops decimal part', () => {
 		expect(getYAxisFormattedValue('1.2345', 'none', 0)).toBe('1');
 		expect(getYAxisFormattedValue('0.9999', 'none', 0)).toBe('0');
 		expect(getYAxisFormattedValue('12345.6789', 'none', 0)).toBe('12345');
@@ -294,7 +294,7 @@ describe('getYAxisFormattedValue - precision option tests', () => {
 		// with unit
 		expect(getYAxisFormattedValue('4353.81', 'ms', 0)).toBe('4 s');
 	});
-	test('precision 1,2,3,4 decimals', () => {
+	it('precision 1,2,3,4 decimals', () => {
 		expect(getYAxisFormattedValue('1.2345', 'none', 1)).toBe('1.2');
 		expect(getYAxisFormattedValue('1.2345', 'none', 2)).toBe('1.23');
 		expect(getYAxisFormattedValue('1.2345', 'none', 3)).toBe('1.234');
@@ -345,7 +345,7 @@ describe('getYAxisFormattedValue - precision option tests', () => {
 		expect(getYAxisFormattedValue('0.123456', 'percent', 4)).toBe('0.1235%'); // approximation
 	});
 
-	test('precision full uses up to DEFAULT_SIGNIFICANT_DIGITS significant digits', () => {
+	it('precision full uses up to DEFAULT_SIGNIFICANT_DIGITS significant digits', () => {
 		expect(
 			getYAxisFormattedValue(
 				'0.00002625429914148441',

frontend/src/components/Graph/utils.ts

@@ -95,7 +95,7 @@ export const getGraphOptions = (
 							},
 						],
 					},
-			  }
+				}
 			: {}),
 		title: {
 			display: title !== undefined,

frontend/src/components/HeaderRightSection/ShareURLModal.tsx

@@ -13,6 +13,7 @@ import GetMinMax from 'lib/getMinMax';
 import { Check, Info, Link2 } from 'lucide-react';
 import { AppState } from 'store/reducers';
 import { GlobalReducer } from 'types/reducer/globalTime';
+import { getAbsoluteUrl } from 'utils/basePath';
 
 const routesToBeSharedWithTime = [
 	ROUTES.LOGS_EXPLORER,
@@ -80,17 +81,13 @@ function ShareURLModal(): JSX.Element {
 
 				urlQuery.delete(QueryParams.relativeTime);
 
-				currentUrl = `${window.location.origin}${
-					location.pathname
-				}?${urlQuery.toString()}`;
+				currentUrl = getAbsoluteUrl(`${location.pathname}?${urlQuery.toString()}`);
 			} else {
 				urlQuery.delete(QueryParams.startTime);
 				urlQuery.delete(QueryParams.endTime);
 
 				urlQuery.set(QueryParams.relativeTime, selectedTime);
-				currentUrl = `${window.location.origin}${
-					location.pathname
-				}?${urlQuery.toString()}`;
+				currentUrl = getAbsoluteUrl(`${location.pathname}?${urlQuery.toString()}`);
 			}
 		}
 

frontend/src/components/InviteMembersModal/InviteMembersModal.styles.scss

@@ -177,7 +177,9 @@
 	color: var(--destructive);
 	opacity: 0.6;
 	padding: 0;
-	transition: background-color 0.2s, opacity 0.2s;
+	transition:
+		background-color 0.2s,
+		opacity 0.2s;
 	box-shadow: none;
 
 	&:hover {

frontend/src/components/InviteMembersModal/InviteMembersModal.tsx

@@ -17,6 +17,7 @@ import { useErrorModal } from 'providers/ErrorModalProvider';
 import APIError from 'types/api/error';
 import { ROLES } from 'types/roles';
 import { EMAIL_REGEX } from 'utils/app';
+import { getBaseUrl } from 'utils/basePath';
 import { popupContainer } from 'utils/selectPopupContainer';
 import { v4 as uuid } from 'uuid';
 
@@ -191,7 +192,7 @@ function InviteMembersModal({
 					email: row.email.trim(),
 					name: '',
 					role: row.role as ROLES,
-					frontendBaseUrl: window.location.origin,
+					frontendBaseUrl: getBaseUrl(),
 				});
 			} else {
 				await inviteUsers({
@@ -199,7 +200,7 @@ function InviteMembersModal({
 						email: row.email.trim(),
 						name: '',
 						role: row.role,
-						frontendBaseUrl: window.location.origin,
+						frontendBaseUrl: getBaseUrl(),
 					})),
 				});
 			}

frontend/src/components/InviteMembersModal/__tests__/InviteMembersModal.test.tsx

@@ -90,11 +90,11 @@ describe('InviteMembersModal', () => {
 				screen.getByRole('button', { name: /invite team members/i }),
 			);
 
-			expect(
-				await screen.findByText(
+			await expect(
+				screen.findByText(
 					'Please enter valid emails and select roles for team members',
 				),
-			).toBeInTheDocument();
+			).resolves.toBeInTheDocument();
 		});
 
 		it('shows email-only message when email is invalid but role is selected', async () => {
@@ -112,9 +112,9 @@ describe('InviteMembersModal', () => {
 				screen.getByRole('button', { name: /invite team members/i }),
 			);
 
-			expect(
-				await screen.findByText('Please enter valid emails for team members'),
-			).toBeInTheDocument();
+			await expect(
+				screen.findByText('Please enter valid emails for team members'),
+			).resolves.toBeInTheDocument();
 		});
 
 		it('shows role-only message when email is valid but role is missing', async () => {
@@ -130,9 +130,9 @@ describe('InviteMembersModal', () => {
 				screen.getByRole('button', { name: /invite team members/i }),
 			);
 
-			expect(
-				await screen.findByText('Please select roles for team members'),
-			).toBeInTheDocument();
+			await expect(
+				screen.findByText('Please select roles for team members'),
+			).resolves.toBeInTheDocument();
 		});
 	});