Merge remote-tracking branch 'origin/nv/heatmap' into feat/heatmap-panel

A cell holds a count of observations in an `le` band, so the selector
naming that count "Sum" describes the wrong thing — sum reads as summing
the metric's own values. The statement builder forces sum on the
histogram CTE whatever arrives, so this only renames what a cell is.

Also drops the field expectations the query-builder tests carried for the
formula and extra-query controls a Heatmap no longer hides.

Assisted-by: Claude Opus 5

.claude/opencode.json

@@ -1,7 +0,0 @@
-{
-  "$schema": "https://opencode.ai/config.json",
-  "lsp": true,
-  "experimental": {
-    "disable_paste_summary": true
-  }
-}

.claude/rules/comments.md

@@ -7,6 +7,5 @@ Applies to everything in the repo — code, config, workflows.
 - **Rationale goes in prose, not source.** Why a version is pinned, why a job exists, how a subsystem fits together — that belongs in the README or the PR.
 - **Never remove pre-existing comments** when editing code. The bar above applies to comments you write, not comments already there.
 - **Never talk to the reviewer.** No comments about where a change came from, what was changed, or why the change is correct — that belongs in the PR description and is noise the moment it merges.
-- **Less is more.** When writing something intended for human consumption, (comment, commit message, reply to prompt) use as few words as possible. Pick every word meticulously to reduce the volume to a strict minimum. Be down to the point. Less is more.
 
 Language rules build on this one: [`go-comments`](go-comments.md), [`py-comments`](py-comments.md).

.claude/rules/go-contrib.md

@@ -1,16 +0,0 @@
----
-paths:
-  - "**/*.go"
----
-
-# Contribution guidelines
-
-- When making Go changes, always ensure they follow the contributing guildelines in [`docs/contributing/go/`](../../docs/contributing/go/).
-- Look for existing patterns in the codebase for any change before implementing the changes.
-- If any API contract is modified, generate the OpenAPI specs with `make gen-openapi-specs`.
-- Always keep the OpenAPI spec generated in a separate commit, so the whole commit can be dropped in case of conflicts during merge. Do not try to resolve conflict in generated files, instead just generate them again.
-- Avoid breaking function calls unncessarily into multilines for couple of arguments.
-- Try to keep most computational only logic in types package itself related to a domain type, use modules as the orchestraction layer cordinating different layers and all db queries in store layer. Check the serviceaccount modules for inspiration when confused.
-- When defining types, keep the structure of file to have any constants and variables first, then exported types and exported methods and then finally the unexported types and methods.
-- Never import types or other modules in migration files, duplicate the required type or method to keep migration free from changes.
-- Always run the gofmt tool for formating beforing commiting any changes.

.claude/rules/pull-requests.md

@@ -2,10 +2,6 @@
 
 - **Follow the template** (`.github/pull_request_template.md`): fill in its headings (Description / Issues closed by this PR / Screenshots / Additional Information). Don't add sections the template doesn't have.
 - **Keep only the headings that apply.** Delete every heading that has nothing under it, along with its `<!--...-->` placeholder comment. The body must never contain an empty heading — if only Description applies, the body has exactly that one heading.
-- **Keep the description concise and human-readable.** A few non repetitive bullets saying what changed and why, for a reviewer skimming it — not a wall of text, not a restatement of the diff, not generated boilerplate and not the user agent conversation details.
+- **Keep the description concise and human-readable.** A few plain bullets saying what changed and why, for a reviewer skimming it — not a wall of text, not a restatement of the diff, not generated boilerplate.
 - **Reference issues with `Closes #issue-number`** under "Issues closed by this PR" so they auto-close on merge. This goes in the PR description only — never in commit messages.
-- **Breaking changes can be added in additional information section** if any.
 - **AI assistance in commits may optionally be disclosed with an `Assisted-by:` trailer** naming the model (e.g. `Assisted-by: Claude Opus 4.5`) — do NOT use a `Co-authored-by:` trailer for this.
-- **Keep the commit body short and human readable** focused on decision made if any. Commit body must not re-iterate the changes done, skip if title is sufficient in conveying the change.
-- **Use convensional commit format** for commits and PR title.
-- **Do not amend the commits once pushed.** Always create a new commit once changes are pushed to remote.

.gitignore

@@ -232,4 +232,3 @@ pyrightconfig.json
 # dev
 .dev/
 .claude/worktrees/
-.claude/settings.local.json

Makefile

@@ -81,13 +81,10 @@ devenv-clickhouse-clean: ## Clean all ClickHouse data from filesystem
 ##############################################################
 # go commands
 ##############################################################
-SIGNOZ_SQLSTORE_SQLITE_PATH ?= signoz.db
-SIGNOZ_APISERVER_ADDRESS    ?= 0.0.0.0:8080
-
 .PHONY: go-run-enterprise
 go-run-enterprise: ## Runs the enterprise go backend server
 	@SIGNOZ_INSTRUMENTATION_LOGS_LEVEL=debug \
-	SIGNOZ_SQLSTORE_SQLITE_PATH=$(SIGNOZ_SQLSTORE_SQLITE_PATH) \
+	SIGNOZ_SQLSTORE_SQLITE_PATH=signoz.db \
 	SIGNOZ_WEB_ENABLED=false \
 	SIGNOZ_TOKENIZER_JWT_SECRET=secret \
 	SIGNOZ_ALERTMANAGER_PROVIDER=signoz \
@@ -104,7 +101,7 @@ go-test: ## Runs go unit tests
 .PHONY: go-run-community
 go-run-community: ## Runs the community go backend server
 	@SIGNOZ_INSTRUMENTATION_LOGS_LEVEL=debug \
-	SIGNOZ_SQLSTORE_SQLITE_PATH=$(SIGNOZ_SQLSTORE_SQLITE_PATH) \
+	SIGNOZ_SQLSTORE_SQLITE_PATH=signoz.db \
 	SIGNOZ_WEB_ENABLED=false \
 	SIGNOZ_TOKENIZER_JWT_SECRET=secret \
 	SIGNOZ_ALERTMANAGER_PROVIDER=signoz \
@@ -114,28 +111,6 @@ go-run-community: ## Runs the community go backend server
 	go run -race \
 		$(GO_BUILD_CONTEXT_COMMUNITY)/*.go server
 
-.PHONY: go-stop
-go-stop: ## Stops the go backend server listening on SIGNOZ_APISERVER_ADDRESS, waiting for it to release every port it holds
-	@PORT=$(lastword $(subst :, ,$(SIGNOZ_APISERVER_ADDRESS))); \
-	PIDS=$$(lsof -ti tcp:$$PORT); \
-	if [ -z "$$PIDS" ]; then \
-		echo "No signoz server running on port $$PORT."; \
-		echo "If it's running on a different port, rerun as: make go-stop SIGNOZ_APISERVER_ADDRESS=host:port"; \
-		exit 0; \
-	fi; \
-	kill $$PIDS 2>/dev/null; \
-	for i in $$(seq 1 10); do \
-		alive=$$(for p in $$PIDS; do kill -0 $$p 2>/dev/null && echo $$p; done); \
-		[ -z "$$alive" ] && break; \
-		sleep 1; \
-	done; \
-	alive=$$(for p in $$PIDS; do kill -0 $$p 2>/dev/null && echo $$p; done); \
-	if [ -n "$$alive" ]; then \
-		echo "Graceful shutdown did not finish in 10s, sending SIGKILL to $$alive"; \
-		kill -9 $$alive 2>/dev/null; \
-	fi; \
-	echo "Stopped signoz server on port $$PORT (pid $$PIDS)"
-
 .PHONY: go-build-community $(GO_BUILD_ARCHS_COMMUNITY)
 go-build-community: ## Builds the go backend server for community
 go-build-community: $(GO_BUILD_ARCHS_COMMUNITY)
@@ -266,8 +241,3 @@ semconv-generate: ## Regenerate semantic-convention families for Go and TypeScri
 gen-mocks:
 	@echo ">> Generating mocks"
 	@mockery --config .mockery.yml
-
-.PHONY: gen-openapi-specs
-gen-openapi-specs:
-	@go run cmd/enterprise/*.go generate openapi
-	cd frontend && pnpm generate:api && cd -

conf/example.yaml

@@ -138,12 +138,6 @@ sqlstore:
 
 ##################### APIServer #####################
 apiserver:
-  # The TCP address the API server listens on, in the form "host:port".
-  address: 0.0.0.0:8080
-  # Maximum duration for reading an entire request, including the body.
-  read_timeout: 60s
-  # Keep at 0; any value cuts off streaming endpoints (livetail, SSE, export_raw_data).
-  write_timeout: 0
   timeout:
     # Default request timeout.
     default: 60s

docs/api/openapi.yml

@@ -3474,6 +3474,79 @@ components:
       - tags
       - spec
       type: object
+    DashboardtypesHeatmapAxes:
+      properties:
+        yScale:
+          $ref: '#/components/schemas/DashboardtypesHeatmapYScale'
+      type: object
+    DashboardtypesHeatmapChartAppearance:
+      properties:
+        colors:
+          $ref: '#/components/schemas/DashboardtypesHeatmapColors'
+      type: object
+    DashboardtypesHeatmapColorMode:
+      enum:
+      - palette
+      - opacity
+      type: string
+    DashboardtypesHeatmapColorScale:
+      enum:
+      - log
+      - sqrt
+      - linear
+      type: string
+    DashboardtypesHeatmapColors:
+      properties:
+        fill:
+          type: string
+        maxCount:
+          nullable: true
+          type: number
+        minCount:
+          nullable: true
+          type: number
+        mode:
+          $ref: '#/components/schemas/DashboardtypesHeatmapColorMode'
+        palette:
+          $ref: '#/components/schemas/DashboardtypesHeatmapPalette'
+        scale:
+          $ref: '#/components/schemas/DashboardtypesHeatmapColorScale'
+        steps:
+          type: integer
+      type: object
+    DashboardtypesHeatmapPalette:
+      enum:
+      - ice
+      - moss
+      - rust
+      - graphite
+      - ember
+      - lagoon
+      - orchid
+      - verdant
+      - lava
+      - beacon
+      type: string
+    DashboardtypesHeatmapPanelSpec:
+      properties:
+        axes:
+          $ref: '#/components/schemas/DashboardtypesHeatmapAxes'
+        chartAppearance:
+          $ref: '#/components/schemas/DashboardtypesHeatmapChartAppearance'
+        formatting:
+          $ref: '#/components/schemas/DashboardtypesPanelFormatting'
+        legend:
+          $ref: '#/components/schemas/DashboardtypesLegend'
+        visualization:
+          $ref: '#/components/schemas/DashboardtypesBasicVisualization'
+      type: object
+    DashboardtypesHeatmapYScale:
+      enum:
+      - auto
+      - linear
+      - log
+      - symlog
+      type: string
     DashboardtypesHistogramBuckets:
       properties:
         bucketCount:
@@ -3826,6 +3899,7 @@ components:
       discriminator:
         mapping:
           signoz/BarChartPanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesBarChartPanelSpec'
+          signoz/HeatmapPanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHeatmapPanelSpec'
           signoz/HistogramPanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHistogramPanelSpec'
           signoz/ListPanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesListPanelSpec'
           signoz/NumberPanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesNumberPanelSpec'
@@ -3841,6 +3915,7 @@ components:
       - $ref: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTablePanelSpec'
       - $ref: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHistogramPanelSpec'
       - $ref: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesListPanelSpec'
+      - $ref: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHeatmapPanelSpec'
       type: object
     DashboardtypesPanelPluginKind:
       enum:
@@ -3851,6 +3926,7 @@ components:
       - signoz/TablePanel
       - signoz/HistogramPanel
       - signoz/ListPanel
+      - signoz/HeatmapPanel
       type: string
     DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesBarChartPanelSpec:
       properties:
@@ -3864,6 +3940,18 @@ components:
       - kind
       - spec
       type: object
+    DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHeatmapPanelSpec:
+      properties:
+        kind:
+          enum:
+          - signoz/HeatmapPanel
+          type: string
+        spec:
+          $ref: '#/components/schemas/DashboardtypesHeatmapPanelSpec'
+      required:
+      - kind
+      - spec
+      type: object
     DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHistogramPanelSpec:
       properties:
         kind:
@@ -7395,10 +7483,7 @@ components:
             $ref: '#/components/schemas/Querybuildertypesv5TimeSeries'
           type: array
         meta:
-          properties:
-            unit:
-              type: string
-          type: object
+          $ref: '#/components/schemas/Querybuildertypesv5AggregationMeta'
         predictedSeries:
           items:
             $ref: '#/components/schemas/Querybuildertypesv5TimeSeries'
@@ -7413,12 +7498,51 @@ components:
             $ref: '#/components/schemas/Querybuildertypesv5TimeSeries'
           type: array
       type: object
-    Querybuildertypesv5Bucket:
+    Querybuildertypesv5AggregationMeta:
       properties:
-        step:
-          format: double
-          type: number
+        buckets:
+          items:
+            format: double
+            type: number
+          type: array
+        unit:
+          type: string
       type: object
+    Querybuildertypesv5BucketOptions:
+      discriminator:
+        mapping:
+          linear: '#/components/schemas/Querybuildertypesv5BucketOptionsLinear'
+          log: '#/components/schemas/Querybuildertypesv5BucketOptionsLog'
+        propertyName: kind
+      oneOf:
+      - $ref: '#/components/schemas/Querybuildertypesv5BucketOptionsLinear'
+      - $ref: '#/components/schemas/Querybuildertypesv5BucketOptionsLog'
+      type: object
+    Querybuildertypesv5BucketOptionsLinear:
+      properties:
+        kind:
+          $ref: '#/components/schemas/Querybuildertypesv5BucketsKind'
+        spec:
+          $ref: '#/components/schemas/Querybuildertypesv5LinearBucketsSpec'
+      required:
+      - kind
+      - spec
+      type: object
+    Querybuildertypesv5BucketOptionsLog:
+      properties:
+        kind:
+          $ref: '#/components/schemas/Querybuildertypesv5BucketsKind'
+        spec:
+          $ref: '#/components/schemas/Querybuildertypesv5LogBucketsSpec'
+      required:
+      - kind
+      - spec
+      type: object
+    Querybuildertypesv5BucketsKind:
+      enum:
+      - linear
+      - log
+      type: string
     Querybuildertypesv5BuilderQuerySpec:
       discriminator:
         mapping:
@@ -7599,6 +7723,16 @@ components:
         value:
           type: string
       type: object
+    Querybuildertypesv5LinearBucketsSpec:
+      properties:
+        maxValue:
+          format: double
+          type: number
+        numBuckets:
+          type: integer
+      required:
+      - maxValue
+      type: object
     Querybuildertypesv5LogAggregation:
       properties:
         alias:
@@ -7606,6 +7740,12 @@ components:
         expression:
           type: string
       type: object
+    Querybuildertypesv5LogBucketsSpec:
+      properties:
+        scale:
+          nullable: true
+          type: integer
+      type: object
     Querybuildertypesv5MetricAggregation:
       properties:
         comparisonSpaceAggregationParam:
@@ -8064,6 +8204,8 @@ components:
         queries (traces, logs, metrics), formulas, joins, trace operators, PromQL,
         and ClickHouse SQL queries.
       properties:
+        bucketOptions:
+          $ref: '#/components/schemas/Querybuildertypesv5BucketOptions'
         compositeQuery:
           $ref: '#/components/schemas/Querybuildertypesv5CompositeQuery'
         end:
@@ -8163,6 +8305,7 @@ components:
       - raw
       - raw_stream
       - trace
+      - heatmap
       type: string
     Querybuildertypesv5ScalarData:
       properties:
@@ -8237,8 +8380,6 @@ components:
       type: object
     Querybuildertypesv5TimeSeriesValue:
       properties:
-        bucket:
-          $ref: '#/components/schemas/Querybuildertypesv5Bucket'
         partial:
           type: boolean
         timestamp:

docs/contributing/development.md

@@ -83,13 +83,7 @@ This command:
 
    You should see: `{"status":"ok"}`
 
-3. Stop it when you're done:
-   ```bash
-   make go-stop
-   ```
-
-> 💡 **Tip**: The API server runs at `http://localhost:8080/` by default. You can configure this using `apiserver.address` configuration option. See
-> [running more than one instance](#how-do-i-run-more-than-one-instance) if you need that for agentic testing.
+> 💡 **Tip**: The API server runs at `http://localhost:8080/` by default
 
 ### 4. Setting up the Frontend
 
@@ -125,36 +119,6 @@ To verify everything is working correctly:
 3. **Check Backend**: `curl http://localhost:8080/api/v1/health` (should return `{"status":"ok"}`)
 4. **Check Frontend**: Open `http://localhost:3301` in your browser
 
-## How do I run more than one instance?
-
-Handy when you keep several branches checked out as separate git worktrees. Every port
-and path below is read from the environment, so set them on the `make` call:
-
-```bash
-SIGNOZ_APISERVER_ADDRESS=0.0.0.0:8081 \
-SIGNOZ_SQLSTORE_SQLITE_PATH=/path/to/main/sqlite.db \
-SIGNOZ_INSTRUMENTATION_METRICS_READERS_PULL_EXPORTER_PROMETHEUS_PORT=9091 \
-make go-run-community
-```
-
-| Variable | Default | Why you'd change it |
-| --- | --- | --- |
-| `SIGNOZ_APISERVER_ADDRESS` | `0.0.0.0:8080` | Address the API server listens on |
-| `SIGNOZ_SQLSTORE_SQLITE_PATH` | `signoz.db` in worktree | To reuse same database |
-| `SIGNOZ_INSTRUMENTATION_METRICS_READERS_PULL_EXPORTER_PROMETHEUS_PORT` | `9090` | Bound by the Prometheus metrics exporter on startup |
-
-Point the frontend at whichever backend you want, in `frontend/.env`:
-
-```env
-VITE_FRONTEND_API_ENDPOINT=http://localhost:8081
-```
-
-Stop an instance using the address it was started on:
-
-```bash
-make go-stop SIGNOZ_APISERVER_ADDRESS=0.0.0.0:8081
-```
-
 ## How to send test data?
 
 You can now send telemetry data to your local SigNoz instance:

ee/query-service/app/server.go

@@ -3,29 +3,56 @@ package app
 import (
 	"context"
 	"fmt"
+	"net"
+	"net/http"
+	"slices"
+
+	"go.opentelemetry.io/contrib/instrumentation/github.com/gorilla/mux/otelmux"
+	"go.opentelemetry.io/otel/propagation"
+
+	"github.com/SigNoz/signoz/pkg/errors"
+
+	"github.com/gorilla/handlers"
+
+	"github.com/rs/cors"
+	"github.com/soheilhy/cmux"
 
 	"github.com/SigNoz/signoz/ee/query-service/app/api"
 	"github.com/SigNoz/signoz/ee/query-service/usage"
 	"github.com/SigNoz/signoz/pkg/http/middleware"
 	"github.com/SigNoz/signoz/pkg/signoz"
+	"github.com/SigNoz/signoz/pkg/web"
 
 	"log/slog"
 
 	"github.com/SigNoz/signoz/pkg/query-service/agentConf"
+	baseapp "github.com/SigNoz/signoz/pkg/query-service/app"
 	"github.com/SigNoz/signoz/pkg/query-service/app/clickhouseReader"
 	"github.com/SigNoz/signoz/pkg/query-service/app/integrations"
 	"github.com/SigNoz/signoz/pkg/query-service/app/logparsingpipeline"
 	"github.com/SigNoz/signoz/pkg/query-service/app/opamp"
 	opAmpModel "github.com/SigNoz/signoz/pkg/query-service/app/opamp/model"
 	baseconst "github.com/SigNoz/signoz/pkg/query-service/constants"
+	"github.com/SigNoz/signoz/pkg/query-service/healthcheck"
+	"github.com/SigNoz/signoz/pkg/query-service/utils"
 )
 
-// Server runs auxiliary servers (opamp) alongside the signoz apiserver
+// Server runs HTTP, Mux and a grpc server
 type Server struct {
+	config signoz.Config
+	signoz *signoz.SigNoz
+
+	// public http router
+	httpConn     net.Listener
+	httpServer   *http.Server
+	httpHostPort string
+
 	opampServer *opamp.Server
 
 	// Usage manager
 	usageManager *usage.Manager
+
+	unavailableChannel chan healthcheck.Status
 }
 
 // NewServer creates and initializes Server
@@ -100,11 +127,57 @@ func NewServer(config signoz.Config, signoz *signoz.SigNoz) (*Server, error) {
 		return nil, err
 	}
 
-	// Register the legacy query-service routes on the apiserver router. The
-	// apiserver owns the HTTP server and applies the middleware chain at serve
-	// time, so these routes get the same treatment as the apiserver routes.
-	r := signoz.APIServer.Router()
-	am := middleware.NewAuthZ(signoz.Instrumentation.Logger(), signoz.Modules.OrgGetter, signoz.Authz)
+	s := &Server{
+		config:             config,
+		signoz:             signoz,
+		httpHostPort:       baseconst.HTTPHostPort,
+		unavailableChannel: make(chan healthcheck.Status),
+		usageManager:       usageManager,
+	}
+
+	httpServer, err := s.createPublicServer(apiHandler, signoz.Web)
+
+	if err != nil {
+		return nil, err
+	}
+
+	s.httpServer = httpServer
+
+	s.opampServer = opamp.InitializeServer(
+		&opAmpModel.AllAgents, agentConfMgr, signoz.Instrumentation,
+	)
+
+	return s, nil
+}
+
+// HealthCheckStatus returns health check status channel a client can subscribe to
+func (s Server) HealthCheckStatus() chan healthcheck.Status {
+	return s.unavailableChannel
+}
+
+func (s *Server) createPublicServer(apiHandler *api.APIHandler, web web.Web) (*http.Server, error) {
+	r := baseapp.NewRouter()
+	am := middleware.NewAuthZ(s.signoz.Instrumentation.Logger(), s.signoz.Modules.OrgGetter, s.signoz.Authz)
+
+	r.Use(middleware.NewRecovery(s.signoz.Instrumentation.Logger()).Wrap)
+	r.Use(otelmux.Middleware(
+		"apiserver",
+		otelmux.WithMeterProvider(s.signoz.Instrumentation.MeterProvider()),
+		otelmux.WithTracerProvider(s.signoz.Instrumentation.TracerProvider()),
+		otelmux.WithPropagators(propagation.NewCompositeTextMapPropagator(propagation.Baggage{}, propagation.TraceContext{})),
+		otelmux.WithFilter(func(r *http.Request) bool {
+			return !slices.Contains([]string{"/api/v1/health"}, r.URL.Path)
+		}),
+	))
+	r.Use(middleware.NewIdentN(s.signoz.IdentNResolver, s.signoz.Sharder, s.signoz.Instrumentation.Logger()).Wrap)
+	r.Use(middleware.NewTimeout(s.signoz.Instrumentation.Logger(),
+		s.config.APIServer.Timeout.ExcludedRoutes,
+		s.config.APIServer.Timeout.Default,
+		s.config.APIServer.Timeout.Max,
+	).Wrap)
+	r.Use(middleware.NewResource(s.signoz.Instrumentation.Logger()).Wrap)
+	r.Use(middleware.NewAudit(s.signoz.Instrumentation.Logger(), s.config.APIServer.Logging.ExcludedRoutes, s.signoz.Auditor).Wrap)
+	r.Use(middleware.NewComment().Wrap)
 
 	apiHandler.RegisterRoutes(r, am)
 	apiHandler.RegisterLogsRoutes(r, am)
@@ -115,29 +188,107 @@ func NewServer(config signoz.Config, signoz *signoz.SigNoz) (*Server, error) {
 	apiHandler.RegisterThirdPartyApiRoutes(r, am)
 	apiHandler.RegisterTraceFunnelsRoutes(r, am)
 
-	s := &Server{
-		usageManager: usageManager,
+	err := s.signoz.APIServer.AddToRouter(r)
+	if err != nil {
+		return nil, err
 	}
 
-	s.opampServer = opamp.InitializeServer(
-		&opAmpModel.AllAgents, agentConfMgr, signoz.Instrumentation,
-	)
+	c := cors.New(cors.Options{
+		AllowedOrigins: []string{"*"},
+		AllowedMethods: []string{"GET", "DELETE", "POST", "PUT", "PATCH", "OPTIONS"},
+		AllowedHeaders: []string{"Accept", "Authorization", "Content-Type", "cache-control"},
+	})
 
-	return s, nil
+	handler := c.Handler(r)
+
+	handler = handlers.CompressHandler(handler)
+
+	err = web.AddToRouter(r)
+	if err != nil {
+		return nil, err
+	}
+
+	routePrefix := s.config.Global.ExternalPath()
+	if routePrefix != "" {
+		prefixed := http.StripPrefix(routePrefix, handler)
+		handler = http.HandlerFunc(func(w http.ResponseWriter, req *http.Request) {
+			switch req.URL.Path {
+			case "/api/v1/health", "/api/v2/healthz", "/api/v2/readyz", "/api/v2/livez":
+				r.ServeHTTP(w, req)
+				return
+			}
+
+			prefixed.ServeHTTP(w, req)
+		})
+	}
+
+	return &http.Server{
+		Handler: handler,
+	}, nil
 }
 
-// Start starts the opamp websocket server. The HTTP API server is started by
-// the signoz registry.
-func (s *Server) Start(ctx context.Context) error {
-	slog.Info("Starting OpAmp Websocket server", "addr", baseconst.OpAmpWsEndpoint)
-	if err := s.opampServer.Start(baseconst.OpAmpWsEndpoint); err != nil {
+// initListeners initialises listeners of the server
+func (s *Server) initListeners() error {
+	// listen on public port
+	var err error
+	publicHostPort := s.httpHostPort
+	if publicHostPort == "" {
+		return fmt.Errorf("baseconst.HTTPHostPort is required")
+	}
+
+	s.httpConn, err = net.Listen("tcp", publicHostPort)
+	if err != nil {
 		return err
 	}
 
+	slog.Info(fmt.Sprintf("Query server started listening on %s...", s.httpHostPort))
+
+	return nil
+}
+
+// Start listening on http and private http port concurrently
+func (s *Server) Start(ctx context.Context) error {
+	err := s.initListeners()
+	if err != nil {
+		return err
+	}
+
+	var httpPort int
+	if port, err := utils.GetPort(s.httpConn.Addr()); err == nil {
+		httpPort = port
+	}
+
+	go func() {
+		slog.Info("Starting HTTP server", "port", httpPort, "addr", s.httpHostPort)
+
+		switch err := s.httpServer.Serve(s.httpConn); err {
+		case nil, http.ErrServerClosed, cmux.ErrListenerClosed:
+			// normal exit, nothing to do
+		default:
+			slog.Error("Could not start HTTP server", errors.Attr(err))
+		}
+		s.unavailableChannel <- healthcheck.Unavailable
+	}()
+
+	go func() {
+		slog.Info("Starting OpAmp Websocket server", "addr", baseconst.OpAmpWsEndpoint)
+		err := s.opampServer.Start(baseconst.OpAmpWsEndpoint)
+		if err != nil {
+			slog.Error("opamp ws server failed to start", errors.Attr(err))
+			s.unavailableChannel <- healthcheck.Unavailable
+		}
+	}()
+
 	return nil
 }
 
 func (s *Server) Stop(ctx context.Context) error {
+	if s.httpServer != nil {
+		if err := s.httpServer.Shutdown(ctx); err != nil {
+			return err
+		}
+	}
+
 	s.opampServer.Stop()
 
 	// stop usage manager

frontend/__mocks__/uplotMock.ts

@@ -2,6 +2,8 @@
 
 // Mock for uplot library used in tests
 export interface MockUPlotInstance {
+	/** Consumers read `root.parentElement` to detect a re-mounted container. */
+	root: HTMLDivElement;
 	setData: jest.Mock;
 	setSize: jest.Mock;
 	destroy: jest.Mock;
@@ -17,13 +19,20 @@ export interface MockUPlotPaths {
 }
 
 // Create mock instance methods
-const createMockUPlotInstance = (): MockUPlotInstance => ({
-	setData: jest.fn(),
-	setSize: jest.fn(),
-	destroy: jest.fn(),
-	redraw: jest.fn(),
-	setSeries: jest.fn(),
-});
+const createMockUPlotInstance = (target?: HTMLElement): MockUPlotInstance => {
+	const root = document.createElement('div');
+	// Real uPlot mounts its root inside the target; without it a re-render reads
+	// `root.parentElement` off undefined and throws.
+	target?.appendChild(root);
+	return {
+		root,
+		setData: jest.fn(),
+		setSize: jest.fn(),
+		destroy: jest.fn(),
+		redraw: jest.fn(),
+		setSeries: jest.fn(),
+	};
+};
 
 // Path builder: (self, seriesIdx, idx0, idx1) => paths or null
 const createMockPathBuilder = (name: string): jest.Mock =>
@@ -53,14 +62,16 @@ const mockTzDate = jest.fn(
 function MockUPlot(
 	_options: unknown,
 	_data: unknown,
-	_target: HTMLElement,
+	target: HTMLElement,
 ): MockUPlotInstance {
-	return createMockUPlotInstance();
+	return createMockUPlotInstance(target);
 }
 
 // Add static methods to the constructor
 MockUPlot.tzDate = mockTzDate;
 MockUPlot.paths = mockPaths;
+// Pinned so canvas-space maths in draw hooks is deterministic under jsdom.
+MockUPlot.pxRatio = 1;
 
 // Export the constructor as default
 export default MockUPlot;

frontend/src/api/generated/services/sigNoz.schemas.ts

@@ -4914,6 +4914,83 @@ export interface DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDa
 	spec: DashboardtypesListPanelSpecDTO;
 }
 
+export enum DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHeatmapPanelSpecDTOKind {
+	'signoz/HeatmapPanel' = 'signoz/HeatmapPanel',
+}
+export enum DashboardtypesHeatmapYScaleDTO {
+	auto = 'auto',
+	linear = 'linear',
+	log = 'log',
+	symlog = 'symlog',
+}
+export interface DashboardtypesHeatmapAxesDTO {
+	yScale?: DashboardtypesHeatmapYScaleDTO;
+}
+
+export enum DashboardtypesHeatmapColorModeDTO {
+	palette = 'palette',
+	opacity = 'opacity',
+}
+export enum DashboardtypesHeatmapPaletteDTO {
+	ice = 'ice',
+	moss = 'moss',
+	rust = 'rust',
+	graphite = 'graphite',
+	ember = 'ember',
+	lagoon = 'lagoon',
+	orchid = 'orchid',
+	verdant = 'verdant',
+	lava = 'lava',
+	beacon = 'beacon',
+}
+export enum DashboardtypesHeatmapColorScaleDTO {
+	log = 'log',
+	sqrt = 'sqrt',
+	linear = 'linear',
+}
+export interface DashboardtypesHeatmapColorsDTO {
+	/**
+	 * @type string
+	 */
+	fill?: string;
+	/**
+	 * @type number,null
+	 */
+	maxCount?: number | null;
+	/**
+	 * @type number,null
+	 */
+	minCount?: number | null;
+	mode?: DashboardtypesHeatmapColorModeDTO;
+	palette?: DashboardtypesHeatmapPaletteDTO;
+	scale?: DashboardtypesHeatmapColorScaleDTO;
+	/**
+	 * @type integer
+	 */
+	steps?: number;
+}
+
+export interface DashboardtypesHeatmapChartAppearanceDTO {
+	colors?: DashboardtypesHeatmapColorsDTO;
+}
+
+export interface DashboardtypesHeatmapPanelSpecDTO {
+	axes?: DashboardtypesHeatmapAxesDTO;
+	chartAppearance?: DashboardtypesHeatmapChartAppearanceDTO;
+	formatting?: DashboardtypesPanelFormattingDTO;
+	legend?: DashboardtypesLegendDTO;
+	visualization?: DashboardtypesBasicVisualizationDTO;
+}
+
+export interface DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHeatmapPanelSpecDTO {
+	/**
+	 * @enum signoz/HeatmapPanel
+	 * @type string
+	 */
+	kind: DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHeatmapPanelSpecDTOKind;
+	spec: DashboardtypesHeatmapPanelSpecDTO;
+}
+
 export type DashboardtypesPanelPluginDTO =
 	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTimeSeriesPanelSpecDTO
 	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesBarChartPanelSpecDTO
@@ -4921,7 +4998,8 @@ export type DashboardtypesPanelPluginDTO =
 	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesPieChartPanelSpecDTO
 	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTablePanelSpecDTO
 	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHistogramPanelSpecDTO
-	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesListPanelSpecDTO;
+	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesListPanelSpecDTO
+	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHeatmapPanelSpecDTO;
 
 export enum Querybuildertypesv5RequestTypeDTO {
 	scalar = 'scalar',
@@ -4929,6 +5007,7 @@ export enum Querybuildertypesv5RequestTypeDTO {
 	raw = 'raw',
 	raw_stream = 'raw_stream',
 	trace = 'trace',
+	heatmap = 'heatmap',
 }
 export enum DashboardtypesQueryPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesBuilderQuerySpecDTOKind {
 	'signoz/BuilderQuery' = 'signoz/BuilderQuery',
@@ -5843,6 +5922,7 @@ export enum DashboardtypesPanelPluginKindDTO {
 	'signoz/TablePanel' = 'signoz/TablePanel',
 	'signoz/HistogramPanel' = 'signoz/HistogramPanel',
 	'signoz/ListPanel' = 'signoz/ListPanel',
+	'signoz/HeatmapPanel' = 'signoz/HeatmapPanel',
 }
 /**
  * @nullable
@@ -8542,16 +8622,7 @@ export interface Querybuildertypesv5LabelDTO {
 	value?: Querybuildertypesv5LabelDTOValue;
 }
 
-export interface Querybuildertypesv5BucketDTO {
-	/**
-	 * @type number
-	 * @format double
-	 */
-	step?: number;
-}
-
 export interface Querybuildertypesv5TimeSeriesValueDTO {
-	bucket?: Querybuildertypesv5BucketDTO;
 	/**
 	 * @type boolean
 	 */
@@ -9102,12 +9173,16 @@ export interface PromotetypesPromotePathDTO {
 	promote?: boolean;
 }
 
-export type Querybuildertypesv5AggregationBucketDTOMeta = {
+export interface Querybuildertypesv5AggregationMetaDTO {
+	/**
+	 * @type array
+	 */
+	buckets?: number[];
 	/**
 	 * @type string
 	 */
 	unit?: string;
-};
+}
 
 export interface Querybuildertypesv5AggregationBucketDTO {
 	/**
@@ -9126,10 +9201,7 @@ export interface Querybuildertypesv5AggregationBucketDTO {
 	 * @type array
 	 */
 	lowerBoundSeries?: Querybuildertypesv5TimeSeriesDTO[];
-	/**
-	 * @type object
-	 */
-	meta?: Querybuildertypesv5AggregationBucketDTOMeta;
+	meta?: Querybuildertypesv5AggregationMetaDTO;
 	/**
 	 * @type array
 	 */
@@ -9144,6 +9216,57 @@ export interface Querybuildertypesv5AggregationBucketDTO {
 	upperBoundSeries?: Querybuildertypesv5TimeSeriesDTO[];
 }
 
+export enum Querybuildertypesv5BucketOptionsLinearDTOKind {
+	linear = 'linear',
+}
+export interface Querybuildertypesv5LinearBucketsSpecDTO {
+	/**
+	 * @type number
+	 * @format double
+	 */
+	maxValue: number;
+	/**
+	 * @type integer
+	 */
+	numBuckets?: number;
+}
+
+export interface Querybuildertypesv5BucketOptionsLinearDTO {
+	/**
+	 * @type string
+	 * @enum linear
+	 */
+	kind: Querybuildertypesv5BucketOptionsLinearDTOKind;
+	spec: Querybuildertypesv5LinearBucketsSpecDTO;
+}
+
+export enum Querybuildertypesv5BucketOptionsLogDTOKind {
+	log = 'log',
+}
+export interface Querybuildertypesv5LogBucketsSpecDTO {
+	/**
+	 * @type integer,null
+	 */
+	scale?: number | null;
+}
+
+export interface Querybuildertypesv5BucketOptionsLogDTO {
+	/**
+	 * @type string
+	 * @enum log
+	 */
+	kind: Querybuildertypesv5BucketOptionsLogDTOKind;
+	spec: Querybuildertypesv5LogBucketsSpecDTO;
+}
+
+export type Querybuildertypesv5BucketOptionsDTO =
+	| Querybuildertypesv5BucketOptionsLinearDTO
+	| Querybuildertypesv5BucketOptionsLogDTO;
+
+export enum Querybuildertypesv5BucketsKindDTO {
+	linear = 'linear',
+	log = 'log',
+}
 export type Querybuildertypesv5ColumnDescriptorDTOMeta = {
 	/**
 	 * @type string
@@ -9493,6 +9616,7 @@ export type Querybuildertypesv5QueryRangeRequestDTOVariables = {
  * Request body for the v5 query range endpoint. Supports builder queries (traces, logs, metrics), formulas, joins, trace operators, PromQL, and ClickHouse SQL queries.
  */
 export interface Querybuildertypesv5QueryRangeRequestDTO {
+	bucketOptions?: Querybuildertypesv5BucketOptionsDTO;
 	compositeQuery?: Querybuildertypesv5CompositeQueryDTO;
 	/**
 	 * @type integer

frontend/src/components/InputWithLabel/InputWithLabel.tsx

@@ -17,6 +17,7 @@ function InputWithLabel({
 	onChange,
 	className,
 	closeIcon,
+	disabled,
 }: {
 	label: string;
 	initialValue?: string | number | null;
@@ -27,6 +28,7 @@ function InputWithLabel({
 	onChange: (value: string) => void;
 	className?: string;
 	closeIcon?: React.ReactNode;
+	disabled?: boolean;
 }): JSX.Element {
 	const [inputValue, setInputValue] = useState<string>(
 		initialValue ? initialValue.toString() : '',
@@ -53,6 +55,7 @@ function InputWithLabel({
 				type={type}
 				value={inputValue}
 				onChange={handleChange}
+				disabled={disabled}
 				name={label.toLowerCase()}
 				data-testid={`input-${label}`}
 			/>

frontend/src/components/QueryBuilderV2/QueryBuilderV2.tsx

@@ -1,11 +1,18 @@
 import { memo, useCallback, useEffect, useMemo, useRef } from 'react';
-import { OPERATORS, PANEL_TYPES } from 'constants/queryBuilder';
+import { TelemetrytypesSignalDTO } from 'api/generated/services/sigNoz.schemas';
+import { PANEL_TYPES } from 'constants/queryBuilder';
 import { Formula } from 'container/QueryBuilder/components/Formula';
 import { QueryBuilderProps } from 'container/QueryBuilder/QueryBuilder.interfaces';
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
 import { IBuilderTraceOperator } from 'types/api/queryBuilder/queryBuilderData';
 import { DataSource } from 'types/common/queryBuilder';
 
+import { QueryBuilderField } from './queryBuilderFields.types';
+import {
+	mergeQueryBuilderFieldsConfig,
+	RAW_QUERY_FIELDS,
+	resolveQueryBuilderField,
+} from './queryBuilderFields.utils';
 import { QueryBuilderV2Provider } from './QueryBuilderV2Context';
 import { clearPreviousQuery } from './QueryV2/previousQuery.utils';
 import QueryFooter from './QueryV2/QueryFooter/QueryFooter';
@@ -14,12 +21,18 @@ import TraceOperator from './QueryV2/TraceOperator/TraceOperator';
 
 import './QueryBuilderV2.styles.scss';
 
+// Raw rows come from logs or spans; metrics only exist aggregated.
+const RAW_QUERY_SIGNALS = [
+	TelemetrytypesSignalDTO.logs,
+	TelemetrytypesSignalDTO.traces,
+];
+
 export const QueryBuilderV2 = memo(function QueryBuilderV2({
 	config,
 	panelType: newPanelType,
-	filterConfigs = {},
-	queryComponents,
-	isListViewPanel = false,
+	fieldsConfig,
+	allowedDataSources,
+	isRawQuery = false,
 	showOnlyWhereClause = false,
 	showTraceOperator = false,
 	version,
@@ -71,55 +84,48 @@ export const QueryBuilderV2 = memo(function QueryBuilderV2({
 		};
 	}, []);
 
-	const isMultiQueryAllowed = useMemo(
-		() => !isListViewPanel || showTraceOperator,
-		[showTraceOperator, isListViewPanel],
+	const resolvedConfig = useMemo(
+		() =>
+			mergeQueryBuilderFieldsConfig(
+				isRawQuery ? RAW_QUERY_FIELDS : undefined,
+				fieldsConfig,
+			),
+		[isRawQuery, fieldsConfig],
 	);
 
-	const listViewLogFilterConfigs: QueryBuilderProps['filterConfigs'] =
-		useMemo(() => {
-			const config: QueryBuilderProps['filterConfigs'] = {
-				stepInterval: { isHidden: true, isDisabled: true },
-				having: { isHidden: true, isDisabled: true },
-				filters: {
-					customKey: 'body',
-					customOp: OPERATORS.CONTAINS,
-				},
-			};
+	const additionalQueries = useMemo(
+		() =>
+			resolveQueryBuilderField(
+				QueryBuilderField.AdditionalQueries,
+				resolvedConfig,
+			),
+		[resolvedConfig],
+	);
 
-			return config;
-		}, []);
+	const formula = useMemo(
+		() => resolveQueryBuilderField(QueryBuilderField.Formula, resolvedConfig),
+		[resolvedConfig],
+	);
 
-	const listViewTracesFilterConfigs: QueryBuilderProps['filterConfigs'] =
-		useMemo(() => {
-			const config: QueryBuilderProps['filterConfigs'] = {
-				stepInterval: { isHidden: true, isDisabled: true },
-				having: { isHidden: true, isDisabled: true },
-				limit: { isHidden: true, isDisabled: true },
-				filters: {
-					customKey: 'body',
-					customOp: OPERATORS.CONTAINS,
-				},
-			};
+	const isMultiQueryAllowed = useMemo(
+		() => !additionalQueries.hidden && (!isRawQuery || showTraceOperator),
+		[additionalQueries.hidden, showTraceOperator, isRawQuery],
+	);
 
-			return config;
-		}, []);
+	const queryDataSources = useMemo(
+		() => allowedDataSources ?? (isRawQuery ? RAW_QUERY_SIGNALS : undefined),
+		[allowedDataSources, isRawQuery],
+	);
 
-	const queryFilterConfigs = useMemo(() => {
-		if (isListViewPanel) {
-			return currentQuery.builder.queryData[0].dataSource === DataSource.TRACES
-				? listViewTracesFilterConfigs
-				: listViewLogFilterConfigs;
-		}
-
-		return filterConfigs;
-	}, [
-		isListViewPanel,
-		filterConfigs,
-		currentQuery.builder.queryData,
-		listViewLogFilterConfigs,
-		listViewTracesFilterConfigs,
-	]);
+	// What the editor renders. A single-query builder edits the first query alone, so
+	// the query list beside it must not advertise ones there is no way to reach.
+	const renderedQueries = useMemo(
+		() =>
+			isMultiQueryAllowed
+				? currentQuery.builder.queryData
+				: currentQuery.builder.queryData.slice(0, 1),
+		[isMultiQueryAllowed, currentQuery.builder.queryData],
+	);
 
 	const traceOperator = useMemo((): IBuilderTraceOperator | undefined => {
 		if (
@@ -145,31 +151,46 @@ export const QueryBuilderV2 = memo(function QueryBuilderV2({
 		[showTraceOperator, traceOperator, hasAtLeastOneTraceQuery],
 	);
 
-	const shouldShowFooter = useMemo(
-		() =>
-			(!showOnlyWhereClause && !isListViewPanel) ||
-			(currentDataSource === DataSource.TRACES && showTraceOperator),
-		[isListViewPanel, showTraceOperator, showOnlyWhereClause, currentDataSource],
-	);
-
 	const showQueryList = useMemo(
-		() => (!showOnlyWhereClause && !isListViewPanel) || showTraceOperator,
-		[isListViewPanel, showOnlyWhereClause, showTraceOperator],
+		() => (!showOnlyWhereClause && !isRawQuery) || showTraceOperator,
+		[isRawQuery, showOnlyWhereClause, showTraceOperator],
 	);
 
 	const showFormula = useMemo(() => {
+		if (formula.hidden) {
+			return false;
+		}
+
 		if (currentDataSource === DataSource.TRACES) {
-			return !isListViewPanel;
+			return !isRawQuery;
 		}
 
 		return true;
-	}, [isListViewPanel, currentDataSource]);
+	}, [formula.hidden, isRawQuery, currentDataSource]);
 
 	const showAddTraceOperator = useMemo(
 		() => showTraceOperator && !traceOperator && hasAtLeastOneTraceQuery,
 		[showTraceOperator, traceOperator, hasAtLeastOneTraceQuery],
 	);
 
+	// Nothing left to add means no footer at all, rather than an empty bar under the
+	// last query.
+	const shouldShowFooter = useMemo(
+		() =>
+			(!additionalQueries.hidden || showFormula || showAddTraceOperator) &&
+			((!showOnlyWhereClause && !isRawQuery) ||
+				(currentDataSource === DataSource.TRACES && showTraceOperator)),
+		[
+			additionalQueries.hidden,
+			showFormula,
+			showAddTraceOperator,
+			isRawQuery,
+			showTraceOperator,
+			showOnlyWhereClause,
+			currentDataSource,
+		],
+	);
+
 	const handleKeyDown = useCallback(
 		(e: React.KeyboardEvent<HTMLDivElement>): void => {
 			const target = e.target as HTMLElement | null;
@@ -199,8 +220,8 @@ export const QueryBuilderV2 = memo(function QueryBuilderV2({
 							key={currentQuery.builder.queryData[0].queryName}
 							index={0}
 							query={currentQuery.builder.queryData[0]}
-							filterConfigs={queryFilterConfigs}
-							queryComponents={queryComponents}
+							fieldsConfig={fieldsConfig}
+							allowedDataSources={queryDataSources}
 							isMultiQueryAllowed={isMultiQueryAllowed}
 							showTraceOperator={showTraceOperator}
 							hasTraceOperator={hasTraceOperator}
@@ -208,7 +229,7 @@ export const QueryBuilderV2 = memo(function QueryBuilderV2({
 							isAvailableToDisable={false}
 							queryVariant={config?.queryVariant || 'dropdown'}
 							showOnlyWhereClause={showOnlyWhereClause}
-							isListViewPanel={isListViewPanel}
+							isRawQuery={isRawQuery}
 							signalSource={currentQuery.builder.queryData[0].source as 'meter' | ''}
 							onSignalSourceChange={onSignalSourceChange || ((): void => {})}
 							signalSourceChangeEnabled={signalSourceChangeEnabled}
@@ -216,14 +237,14 @@ export const QueryBuilderV2 = memo(function QueryBuilderV2({
 							savePreviousQuery={savePreviousQuery}
 						/>
 					) : (
-						currentQuery.builder.queryData.map((query, index) => (
+						renderedQueries.map((query, index) => (
 							<QueryV2
 								ref={containerRef}
 								key={query.queryName}
 								index={index}
 								query={query}
-								filterConfigs={queryFilterConfigs}
-								queryComponents={queryComponents}
+								fieldsConfig={fieldsConfig}
+								allowedDataSources={queryDataSources}
 								version={version}
 								isMultiQueryAllowed={isMultiQueryAllowed}
 								isAvailableToDisable={false}
@@ -231,7 +252,7 @@ export const QueryBuilderV2 = memo(function QueryBuilderV2({
 								hasTraceOperator={hasTraceOperator}
 								queryVariant={config?.queryVariant || 'dropdown'}
 								showOnlyWhereClause={showOnlyWhereClause}
-								isListViewPanel={isListViewPanel}
+								isRawQuery={isRawQuery}
 								signalSource={query.source as 'meter' | ''}
 								onSignalSourceChange={onSignalSourceChange || ((): void => {})}
 								signalSourceChangeEnabled={signalSourceChangeEnabled}
@@ -251,14 +272,7 @@ export const QueryBuilderV2 = memo(function QueryBuilderV2({
 
 									return (
 										<div key={formula.queryName} className="qb-formula">
-											<Formula
-												filterConfigs={filterConfigs}
-												query={query}
-												formula={formula}
-												index={index}
-												isAdditionalFilterEnable={false}
-												isQBV2
-											/>
+											<Formula query={query} formula={formula} index={index} isQBV2 />
 										</div>
 									);
 								})}
@@ -267,8 +281,13 @@ export const QueryBuilderV2 = memo(function QueryBuilderV2({
 
 					{shouldShowFooter && (
 						<QueryFooter
+							showAddQuery={!additionalQueries.hidden}
 							showAddFormula={showFormula}
+							addFormulaDisabled={formula.disabled}
+							addFormulaDisabledReason={formula.reason}
 							addNewBuilderQuery={addNewBuilderQuery}
+							addQueryDisabled={additionalQueries.disabled}
+							addQueryDisabledReason={additionalQueries.reason}
 							addNewFormula={addNewFormula}
 							addTraceOperator={addTraceOperator}
 							showAddTraceOperator={showAddTraceOperator}
@@ -277,7 +296,8 @@ export const QueryBuilderV2 = memo(function QueryBuilderV2({
 
 					{hasTraceOperator && (
 						<TraceOperator
-							isListViewPanel={isListViewPanel}
+							isRawQuery={isRawQuery}
+							fieldsConfig={resolvedConfig}
 							traceOperator={traceOperator as IBuilderTraceOperator}
 						/>
 					)}
@@ -285,7 +305,7 @@ export const QueryBuilderV2 = memo(function QueryBuilderV2({
 
 				{showQueryList && (
 					<div className="query-names-section">
-						{currentQuery.builder.queryData.map((query) => (
+						{renderedQueries.map((query) => (
 							<div key={query.queryName} className="query-name">
 								{query.queryName}
 							</div>

frontend/src/components/QueryBuilderV2/QueryV2/QueryAddOns/QueryAddOns.styles.scss

@@ -23,6 +23,11 @@
 		align-items: center;
 		justify-content: center;
 		gap: var(--margin-2);
+
+		&--disabled {
+			opacity: 0.45;
+			cursor: not-allowed;
+		}
 	}
 }
 

frontend/src/components/QueryBuilderV2/QueryV2/QueryAddOns/QueryAddOns.tsx

@@ -1,5 +1,6 @@
-import { useCallback, useEffect, useRef, useState } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { Button, Tooltip } from 'antd';
+import cx from 'classnames';
 import { ToggleGroupSimple } from '@signozhq/ui/toggle-group';
 import InputWithLabel from 'components/InputWithLabel/InputWithLabel';
 import { PANEL_TYPES } from 'constants/queryBuilder';
@@ -14,6 +15,16 @@ import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 import { MetricAggregation } from 'types/api/v5/queryRange';
 import { DataSource, ReduceOperators } from 'types/common/queryBuilder';
 
+import {
+	QueryBuilderField,
+	QueryBuilderFieldsConfig,
+} from '../../queryBuilderFields.types';
+import {
+	mergeQueryBuilderFieldsConfig,
+	RAW_QUERY_FIELDS,
+	resolveQueryBuilderFields,
+} from '../../queryBuilderFields.utils';
+
 import HavingFilter from './HavingFilter/HavingFilter';
 import { buildDefaultLegendFromGroupBy } from './utils';
 
@@ -22,34 +33,25 @@ import './QueryAddOns.styles.scss';
 interface AddOn {
 	icon: React.ReactNode;
 	label: string;
-	key: string;
+	key: QueryBuilderField;
 	description?: string;
 	docLink?: string;
 }
 
-const ADD_ONS_KEYS = {
-	GROUP_BY: 'group_by',
-	HAVING: 'having',
-	ORDER_BY: 'order_by',
-	LIMIT: 'limit',
-	LEGEND_FORMAT: 'legend_format',
-	REDUCE_TO: 'reduce_to',
+const ADD_ONS_KEYS_TO_QUERY_PATH: Partial<Record<QueryBuilderField, string>> = {
+	[QueryBuilderField.GroupBy]: 'groupBy',
+	[QueryBuilderField.Having]: 'having.expression',
+	[QueryBuilderField.OrderBy]: 'orderBy',
+	[QueryBuilderField.Limit]: 'limit',
+	[QueryBuilderField.Legend]: 'legend',
+	[QueryBuilderField.ReduceTo]: 'reduceTo',
 };
 
-const ADD_ONS_KEYS_TO_QUERY_PATH = {
-	[ADD_ONS_KEYS.GROUP_BY]: 'groupBy',
-	[ADD_ONS_KEYS.HAVING]: 'having.expression',
-	[ADD_ONS_KEYS.ORDER_BY]: 'orderBy',
-	[ADD_ONS_KEYS.LIMIT]: 'limit',
-	[ADD_ONS_KEYS.LEGEND_FORMAT]: 'legend',
-	[ADD_ONS_KEYS.REDUCE_TO]: 'reduceTo',
-};
-
-const ADD_ONS = [
+const ADD_ONS: AddOn[] = [
 	{
 		icon: <BarChart size={14} />,
 		label: 'Group By',
-		key: ADD_ONS_KEYS.GROUP_BY,
+		key: QueryBuilderField.GroupBy,
 		description:
 			'Break down data by attributes like service name, endpoint, status code, or region. Essential for spotting patterns and comparing performance across different segments.',
 		docLink: 'https://signoz.io/docs/querying/aggregation-grouping/#grouping',
@@ -57,7 +59,7 @@ const ADD_ONS = [
 	{
 		icon: <ScrollText size={14} />,
 		label: 'Having',
-		key: ADD_ONS_KEYS.HAVING,
+		key: QueryBuilderField.Having,
 		description:
 			'Filter grouped results based on aggregate conditions. Show only groups meeting specific criteria, like error rates > 5% or p99 latency > 500',
 		docLink:
@@ -66,7 +68,7 @@ const ADD_ONS = [
 	{
 		icon: <ScrollText size={14} />,
 		label: 'Order By',
-		key: ADD_ONS_KEYS.ORDER_BY,
+		key: QueryBuilderField.OrderBy,
 		description:
 			'Sort results to surface what matters most. Quickly identify slowest operations, most frequent errors, or highest resource consumers.',
 		docLink:
@@ -75,7 +77,7 @@ const ADD_ONS = [
 	{
 		icon: <ScrollText size={14} />,
 		label: 'Limit',
-		key: ADD_ONS_KEYS.LIMIT,
+		key: QueryBuilderField.Limit,
 		description:
 			'Show only the top/bottom N results. Perfect for focusing on outliers, reducing noise, and improving dashboard performance.',
 		docLink:
@@ -84,7 +86,7 @@ const ADD_ONS = [
 	{
 		icon: <ScrollText size={14} />,
 		label: 'Legend format',
-		key: ADD_ONS_KEYS.LEGEND_FORMAT,
+		key: QueryBuilderField.Legend,
 		description:
 			'Customize series labels using variables like {{service.name}}-{{endpoint}}. Makes charts readable at a glance during incident investigation.',
 		docLink:
@@ -92,10 +94,10 @@ const ADD_ONS = [
 	},
 ];
 
-const REDUCE_TO = {
+const REDUCE_TO: AddOn = {
 	icon: <ScrollText size={14} />,
 	label: 'Reduce to',
-	key: ADD_ONS_KEYS.REDUCE_TO,
+	key: QueryBuilderField.ReduceTo,
 	description:
 		'Apply mathematical operations like sum, average, min, max, or percentiles to reduce multiple time series into a single value.',
 	docLink:
@@ -154,26 +156,26 @@ function TooltipContent({
 function QueryAddOns({
 	query,
 	version,
-	isListViewPanel,
+	isRawQuery,
 	showReduceTo,
 	panelType,
 	index,
+	fieldsConfig,
 	isForTraceOperator = false,
 }: {
 	query: IBuilderQuery;
 	version: string;
-	isListViewPanel: boolean;
+	isRawQuery: boolean;
 	showReduceTo: boolean;
 	panelType: PANEL_TYPES | null;
 	index: number;
+	fieldsConfig?: QueryBuilderFieldsConfig;
 	isForTraceOperator?: boolean;
 }): JSX.Element {
-	const [addOns, setAddOns] = useState<AddOn[]>(ADD_ONS);
-
 	const [selectedViews, setSelectedViews] = useState<AddOn[]>([]);
 
 	const initializedRef = useRef(false);
-	const prevAvailableKeysRef = useRef<Set<string> | null>(null);
+	const prevAvailableKeysRef = useRef<Set<QueryBuilderField> | null>(null);
 
 	const { handleChangeQueryData } = useQueryOperations({
 		index,
@@ -184,40 +186,62 @@ function QueryAddOns({
 
 	const { handleSetQueryData } = useQueryBuilder();
 
-	useEffect(() => {
-		if (isListViewPanel) {
-			setAddOns([]);
+	const supportedAddOns = useMemo((): AddOn[] => {
+		let addOns: AddOn[];
 
-			setSelectedViews([
-				ADD_ONS.find((addOn) => addOn.key === ADD_ONS_KEYS.ORDER_BY) as AddOn,
-			]);
-
-			return;
-		}
-
-		let filteredAddOns: AddOn[];
 		if (panelType === PANEL_TYPES.VALUE) {
-			// Filter out all add-ons except legend format
-			filteredAddOns = ADD_ONS.filter(
-				(addOn) => addOn.key === ADD_ONS_KEYS.LEGEND_FORMAT,
-			);
+			addOns = ADD_ONS.filter((addOn) => addOn.key === QueryBuilderField.Legend);
+		} else if (query.dataSource === DataSource.METRICS) {
+			// Group by for metrics is offered by MetricsAggregateSection instead.
+			addOns = ADD_ONS.filter((addOn) => addOn.key !== QueryBuilderField.GroupBy);
 		} else {
-			filteredAddOns = Object.values(ADD_ONS);
-
-			if (query.dataSource === DataSource.METRICS) {
-				// Filter out group_by for metrics data source (handled in MetricsAggregateSection)
-				filteredAddOns = filteredAddOns.filter(
-					(addOn) => addOn.key !== ADD_ONS_KEYS.GROUP_BY,
-				);
-			}
+			addOns = [...ADD_ONS];
 		}
 
-		if (showReduceTo) {
-			filteredAddOns = [...filteredAddOns, REDUCE_TO];
-		}
-		setAddOns(filteredAddOns);
+		return showReduceTo ? [...addOns, REDUCE_TO] : addOns;
+	}, [panelType, query.dataSource, showReduceTo]);
 
-		const availableAddOnKeys = new Set(filteredAddOns.map((a) => a.key));
+	const resolvedFields = useMemo(
+		() =>
+			resolveQueryBuilderFields(
+				supportedAddOns.map((addOn) => addOn.key),
+				mergeQueryBuilderFieldsConfig(
+					isRawQuery ? RAW_QUERY_FIELDS : undefined,
+					fieldsConfig,
+				),
+			),
+		[supportedAddOns, fieldsConfig, isRawQuery],
+	);
+
+	const offeredAddOns = useMemo(
+		() =>
+			supportedAddOns.filter((addOn) => !resolvedFields.get(addOn.key)?.hidden),
+		[supportedAddOns, resolvedFields],
+	);
+
+	const pinnedAddOns = useMemo(
+		() => offeredAddOns.filter((addOn) => resolvedFields.get(addOn.key)?.pinned),
+		[offeredAddOns, resolvedFields],
+	);
+
+	const togglableAddOns = useMemo(
+		() => offeredAddOns.filter((addOn) => !resolvedFields.get(addOn.key)?.pinned),
+		[offeredAddOns, resolvedFields],
+	);
+
+	const isPinned = useCallback(
+		(key: QueryBuilderField): boolean => Boolean(resolvedFields.get(key)?.pinned),
+		[resolvedFields],
+	);
+
+	const isDisabled = useCallback(
+		(key: QueryBuilderField): boolean =>
+			Boolean(resolvedFields.get(key)?.disabled),
+		[resolvedFields],
+	);
+
+	useEffect(() => {
+		const availableAddOnKeys = new Set(offeredAddOns.map((a) => a.key));
 		const previousKeys = prevAvailableKeysRef.current;
 		const hasAvailabilityItemsChanged =
 			previousKeys !== null &&
@@ -231,27 +255,39 @@ function QueryAddOns({
 			const activeAddOnKeys = new Set(
 				Object.entries(ADD_ONS_KEYS_TO_QUERY_PATH)
 					.filter(([, path]) => hasValue(get(query, path)))
-					.map(([key]) => key),
+					.map(([key]) => key as QueryBuilderField),
 			);
 
-			// Initial seeding from query values on mount
+			// Initial seeding from query values on mount. A disabled field never opens.
 			setSelectedViews(
-				filteredAddOns.filter(
-					(addOn) =>
-						activeAddOnKeys.has(addOn.key) && availableAddOnKeys.has(addOn.key),
-				),
+				offeredAddOns.filter((addOn) => {
+					const resolved = resolvedFields.get(addOn.key);
+
+					return (
+						resolved?.pinned ||
+						(activeAddOnKeys.has(addOn.key) && !resolved?.disabled)
+					);
+				}),
 			);
 			return;
 		}
 
-		setSelectedViews((prev) =>
-			prev.filter((view) =>
-				filteredAddOns.some((addOn) => addOn.key === view.key),
-			),
-		);
-	}, [panelType, isListViewPanel, query, showReduceTo]);
+		setSelectedViews((prev) => {
+			const kept = prev.filter((view) => availableAddOnKeys.has(view.key));
+
+			const reopenedPinned = pinnedAddOns.filter(
+				(addOn) => !kept.some((view) => view.key === addOn.key),
+			);
+
+			return [...kept, ...reopenedPinned];
+		});
+	}, [offeredAddOns, pinnedAddOns, query]);
 
 	const handleOptionClick = (clickedAddOn: AddOn): void => {
+		if (isDisabled(clickedAddOn.key)) {
+			return;
+		}
+
 		const isAlreadySelected = selectedViews.some(
 			(view) => view.key === clickedAddOn.key,
 		);
@@ -265,7 +301,7 @@ function QueryAddOns({
 			// and existing group-by keys, prefill the legend using all group-by keys.
 			// This keeps existing custom legends intact and only helps seed a sensible default.
 			if (
-				clickedAddOn.key === ADD_ONS_KEYS.LEGEND_FORMAT &&
+				clickedAddOn.key === QueryBuilderField.Legend &&
 				isEmpty(query?.legend) &&
 				Array.isArray(query.groupBy) &&
 				query.groupBy.length > 0
@@ -310,9 +346,16 @@ function QueryAddOns({
 		[handleSetQueryData, index, query],
 	);
 
-	const handleRemoveView = useCallback((key: string): void => {
-		setSelectedViews((prev) => prev.filter((view) => view.key !== key));
-	}, []);
+	const handleRemoveView = useCallback(
+		(key: QueryBuilderField): void => {
+			if (isPinned(key)) {
+				return;
+			}
+
+			setSelectedViews((prev) => prev.filter((view) => view.key !== key));
+		},
+		[isPinned],
+	);
 
 	const handleChangeQueryLegend = useCallback(
 		(value: string) => {
@@ -341,7 +384,7 @@ function QueryAddOns({
 		<div className="query-add-ons" data-testid="query-add-ons">
 			{selectedViews.length > 0 && (
 				<div className="selected-add-ons-content">
-					{selectedViews.find((view) => view.key === 'group_by') && (
+					{selectedViews.find((view) => view.key === QueryBuilderField.GroupBy) && (
 						<div className="add-on-content" data-testid="group-by-content">
 							<div className="periscope-input-with-label">
 								<Tooltip
@@ -369,15 +412,17 @@ function QueryAddOns({
 										onChange={handleChangeGroupByKeys}
 									/>
 								</div>
-								<Button
-									className="close-btn periscope-btn ghost"
-									icon={<ChevronUp size={16} />}
-									onClick={(): void => handleRemoveView('group_by')}
-								/>
+								{!isPinned(QueryBuilderField.GroupBy) && (
+									<Button
+										className="close-btn periscope-btn ghost"
+										icon={<ChevronUp size={16} />}
+										onClick={(): void => handleRemoveView(QueryBuilderField.GroupBy)}
+									/>
+								)}
 							</div>
 						</div>
 					)}
-					{selectedViews.find((view) => view.key === 'having') && (
+					{selectedViews.find((view) => view.key === QueryBuilderField.Having) && (
 						<div className="add-on-content" data-testid="having-content">
 							<div className="periscope-input-with-label">
 								<Tooltip
@@ -397,11 +442,7 @@ function QueryAddOns({
 								</Tooltip>
 								<div className="input">
 									<HavingFilter
-										onClose={(): void => {
-											setSelectedViews((prev) =>
-												prev.filter((view) => view.key !== 'having'),
-											);
-										}}
+										onClose={(): void => handleRemoveView(QueryBuilderField.Having)}
 										onChange={handleChangeHaving}
 										queryData={query}
 									/>
@@ -409,7 +450,7 @@ function QueryAddOns({
 							</div>
 						</div>
 					)}
-					{selectedViews.find((view) => view.key === 'limit') && (
+					{selectedViews.find((view) => view.key === QueryBuilderField.Limit) && (
 						<div className="add-on-content" data-testid="limit-content">
 							<InputWithLabel
 								label="Limit"
@@ -417,16 +458,12 @@ function QueryAddOns({
 								onChange={handleChangeLimit}
 								initialValue={query?.limit ?? undefined}
 								placeholder="Enter limit"
-								onClose={(): void => {
-									setSelectedViews((prev) =>
-										prev.filter((view) => view.key !== 'limit'),
-									);
-								}}
+								onClose={(): void => handleRemoveView(QueryBuilderField.Limit)}
 								closeIcon={<ChevronUp size={16} />}
 							/>
 						</div>
 					)}
-					{selectedViews.find((view) => view.key === 'order_by') && (
+					{selectedViews.find((view) => view.key === QueryBuilderField.OrderBy) && (
 						<div className="add-on-content" data-testid="order-by-content">
 							<div className="periscope-input-with-label">
 								<Tooltip
@@ -449,22 +486,22 @@ function QueryAddOns({
 										entityVersion={version}
 										query={query}
 										onChange={handleChangeOrderByKeys}
-										isListViewPanel={isListViewPanel}
+										isRawQuery={isRawQuery}
 										isNewQueryV2
 									/>
 								</div>
-								{!isListViewPanel && (
+								{!isPinned(QueryBuilderField.OrderBy) && (
 									<Button
 										className="close-btn periscope-btn ghost"
 										icon={<ChevronUp size={16} />}
-										onClick={(): void => handleRemoveView('order_by')}
+										onClick={(): void => handleRemoveView(QueryBuilderField.OrderBy)}
 									/>
 								)}
 							</div>
 						</div>
 					)}
 
-					{selectedViews.find((view) => view.key === 'reduce_to') &&
+					{selectedViews.find((view) => view.key === QueryBuilderField.ReduceTo) &&
 						showReduceTo && (
 							<div className="add-on-content" data-testid="reduce-to-content">
 								<div className="periscope-input-with-label">
@@ -487,27 +524,25 @@ function QueryAddOns({
 										<ReduceToFilter query={query} onChange={handleChangeReduceToV5} />
 									</div>
 
-									<Button
-										className="close-btn periscope-btn ghost"
-										icon={<ChevronUp size={16} />}
-										onClick={(): void => handleRemoveView('reduce_to')}
-									/>
+									{!isPinned(QueryBuilderField.ReduceTo) && (
+										<Button
+											className="close-btn periscope-btn ghost"
+											icon={<ChevronUp size={16} />}
+											onClick={(): void => handleRemoveView(QueryBuilderField.ReduceTo)}
+										/>
+									)}
 								</div>
 							</div>
 						)}
 
-					{selectedViews.find((view) => view.key === 'legend_format') && (
+					{selectedViews.find((view) => view.key === QueryBuilderField.Legend) && (
 						<div className="add-on-content" data-testid="legend-format-content">
 							<InputWithLabel
 								label="Legend format"
 								placeholder="Write legend format"
 								onChange={handleChangeQueryLegend}
 								initialValue={isEmpty(query?.legend) ? undefined : query?.legend}
-								onClose={(): void => {
-									setSelectedViews((prev) =>
-										prev.filter((view) => view.key !== 'legend_format'),
-									);
-								}}
+								onClose={(): void => handleRemoveView(QueryBuilderField.Legend)}
 								closeIcon={<ChevronUp size={16} />}
 							/>
 						</div>
@@ -520,42 +555,49 @@ function QueryAddOns({
 				className="add-ons-tabs"
 				value={selectedViews.map((view) => view.key)}
 				onChange={(newKeys: string[]): void => {
-					const oldKeys = selectedViews.map((view) => view.key);
+					const oldKeys: string[] = selectedViews.map((view) => view.key);
 					const toggledKey =
-						newKeys.find((k) => !oldKeys.includes(k)) ??
-						oldKeys.find((k) => !newKeys.includes(k));
+						newKeys.find((key) => !oldKeys.includes(key)) ??
+						oldKeys.find((key) => !newKeys.includes(key));
 					if (!toggledKey) {
 						return;
 					}
-					const clickedAddOn = addOns.find((a) => a.key === toggledKey);
+					const clickedAddOn = togglableAddOns.find((a) => a.key === toggledKey);
 					if (clickedAddOn) {
 						handleOptionClick(clickedAddOn);
 					}
 				}}
-				items={addOns.map((addOn) => ({
-					value: addOn.key,
-					label: (
-						<Tooltip
-							title={
-								<TooltipContent
-									label={addOn.label}
-									description={addOn.description}
-									docLink={addOn.docLink}
-								/>
-							}
-							placement="top"
-							mouseEnterDelay={0.5}
-						>
-							<span
-								className="add-on-tab-title"
-								data-testid={`query-add-on-${addOn.key}`}
+				items={togglableAddOns.map((addOn) => {
+					const resolved = resolvedFields.get(addOn.key);
+
+					return {
+						value: addOn.key,
+						label: (
+							<Tooltip
+								title={
+									<TooltipContent
+										label={addOn.label}
+										description={resolved?.reason ?? addOn.description}
+										docLink={resolved?.disabled ? undefined : addOn.docLink}
+									/>
+								}
+								placement="top"
+								mouseEnterDelay={0.5}
 							>
-								{addOn.icon}
-								{addOn.label}
-							</span>
-						</Tooltip>
-					),
-				}))}
+								<span
+									className={cx('add-on-tab-title', {
+										'add-on-tab-title--disabled': resolved?.disabled,
+									})}
+									aria-disabled={resolved?.disabled}
+									data-testid={`query-add-on-${addOn.key}`}
+								>
+									{addOn.icon}
+									{addOn.label}
+								</span>
+							</Tooltip>
+						),
+					};
+				})}
 			/>
 		</div>
 	);

frontend/src/components/QueryBuilderV2/QueryV2/QueryAggregation/QueryAggregation.tsx

@@ -8,6 +8,12 @@ import {
 } from 'types/api/queryBuilder/queryBuilderData';
 import { DataSource } from 'types/common/queryBuilder';
 
+import {
+	QueryBuilderField,
+	QueryBuilderFieldsConfig,
+} from '../../queryBuilderFields.types';
+import { resolveQueryBuilderField } from '../../queryBuilderFields.utils';
+
 import QueryAggregationSelect from './QueryAggregationSelect';
 
 import './QueryAggregation.styles.scss';
@@ -18,24 +24,32 @@ function QueryAggregationOptions({
 	onAggregationIntervalChange,
 	onChange,
 	queryData,
+	fieldsConfig,
 }: {
 	dataSource: DataSource;
 	panelType?: string;
 	onAggregationIntervalChange: (value: number) => void;
 	onChange?: (value: string) => void;
 	queryData: IBuilderQuery | IBuilderTraceOperator;
+	fieldsConfig?: QueryBuilderFieldsConfig;
 }): JSX.Element {
-	const showAggregationInterval = useMemo(() => {
+	const stepInterval = useMemo(() => {
 		if (panelType === PANEL_TYPES.VALUE) {
-			return false;
+			return { hidden: true, disabled: false, reason: undefined };
 		}
 
-		if (dataSource === DataSource.TRACES || dataSource === DataSource.LOGS) {
-			return !(panelType === PANEL_TYPES.TABLE || panelType === PANEL_TYPES.PIE);
+		const isNonMetricSource =
+			dataSource === DataSource.TRACES || dataSource === DataSource.LOGS;
+
+		if (
+			isNonMetricSource &&
+			(panelType === PANEL_TYPES.TABLE || panelType === PANEL_TYPES.PIE)
+		) {
+			return { hidden: true, disabled: false, reason: undefined };
 		}
 
-		return true;
-	}, [dataSource, panelType]);
+		return resolveQueryBuilderField(QueryBuilderField.StepInterval, fieldsConfig);
+	}, [dataSource, panelType, fieldsConfig]);
 
 	const handleAggregationIntervalChange = (value: string): void => {
 		onAggregationIntervalChange(Number(value));
@@ -57,22 +71,24 @@ function QueryAggregationOptions({
 					}
 				/>
 
-				{showAggregationInterval && (
+				{!stepInterval.hidden && (
 					<div className="query-aggregation-interval">
 						<Tooltip
 							title={
-								<div>
-									Set the time interval for aggregation
-									<br />
-									<a
-										href="https://signoz.io/docs/userguide/query-builder-v5/#temporal-aggregation-within-each-time-series"
-										target="_blank"
-										rel="noopener noreferrer"
-										style={{ color: '#1890ff', textDecoration: 'underline' }}
-									>
-										Learn about step intervals
-									</a>
-								</div>
+								stepInterval.reason ?? (
+									<div>
+										Set the time interval for aggregation
+										<br />
+										<a
+											href="https://signoz.io/docs/userguide/query-builder-v5/#temporal-aggregation-within-each-time-series"
+											target="_blank"
+											rel="noopener noreferrer"
+											style={{ color: '#1890ff', textDecoration: 'underline' }}
+										>
+											Learn about step intervals
+										</a>
+									</div>
+								)
 							}
 							placement="top"
 						>
@@ -92,6 +108,7 @@ function QueryAggregationOptions({
 								placeholder="Auto"
 								type="number"
 								onChange={handleAggregationIntervalChange}
+								disabled={stepInterval.disabled}
 								labelAfter
 							/>
 						</div>
@@ -105,6 +122,7 @@ function QueryAggregationOptions({
 QueryAggregationOptions.defaultProps = {
 	panelType: null,
 	onChange: undefined,
+	fieldsConfig: undefined,
 };
 
 export default QueryAggregationOptions;

frontend/src/components/QueryBuilderV2/QueryV2/QueryFooter/QueryFooter.tsx

@@ -17,13 +17,13 @@ function TraceOperatorSection({
 	const { currentQuery, panelType } = useQueryBuilder();
 
 	const showTraceOperatorWarning = useMemo(() => {
-		const isListViewPanel =
+		const isRawQueryPanel =
 			panelType === PANEL_TYPES.LIST || panelType === PANEL_TYPES.TRACE;
 		const hasMultipleQueries = currentQuery.builder.queryData.length > 1;
 		const hasTraceOperator =
 			currentQuery.builder.queryTraceOperator &&
 			currentQuery.builder.queryTraceOperator.length > 0;
-		return isListViewPanel && hasMultipleQueries && !hasTraceOperator;
+		return isRawQueryPanel && hasMultipleQueries && !hasTraceOperator;
 	}, [
 		currentQuery?.builder?.queryData,
 		currentQuery?.builder?.queryTraceOperator,
@@ -77,50 +77,74 @@ export default function QueryFooter({
 	addNewBuilderQuery,
 	addNewFormula,
 	addTraceOperator,
+	showAddQuery = true,
 	showAddFormula = true,
 	showAddTraceOperator = false,
+	addQueryDisabled = false,
+	addQueryDisabledReason,
+	addFormulaDisabled = false,
+	addFormulaDisabledReason,
 }: {
 	addNewBuilderQuery: () => void;
 	addNewFormula: () => void;
 	addTraceOperator?: () => void;
 	showAddTraceOperator: boolean;
+	showAddQuery?: boolean;
 	showAddFormula?: boolean;
+	addQueryDisabled?: boolean;
+	addQueryDisabledReason?: string;
+	addFormulaDisabled?: boolean;
+	addFormulaDisabledReason?: string;
 }): JSX.Element {
 	return (
 		<div className="qb-footer">
 			<div className="qb-footer-container">
-				<div className="qb-add-new-query">
-					<Tooltip title={<div style={{ textAlign: 'center' }}>Add New Query</div>}>
-						<Button
-							className="add-new-query-button periscope-btn "
-							icon={<Plus size={16} />}
-							onClick={addNewBuilderQuery}
-						/>
-					</Tooltip>
-				</div>
+				{showAddQuery && (
+					<div className="qb-add-new-query">
+						<Tooltip
+							title={
+								addQueryDisabledReason ?? (
+									<div style={{ textAlign: 'center' }}>Add New Query</div>
+								)
+							}
+						>
+							<Button
+								className="add-new-query-button periscope-btn "
+								data-testid="add-new-query-button"
+								icon={<Plus size={16} />}
+								onClick={addNewBuilderQuery}
+								disabled={addQueryDisabled}
+							/>
+						</Tooltip>
+					</div>
+				)}
 
 				{showAddFormula && (
 					<div className="qb-add-formula">
 						<Tooltip
 							title={
-								<div style={{ textAlign: 'center' }}>
-									Add New Formula
-									<Typography.Link
-										href="https://signoz.io/docs/querying/multi-query-analysis/#advanced-comparisons"
-										target="_blank"
-										style={{ textDecoration: 'underline' }}
-									>
-										{' '}
-										<br />
-										Learn more
-									</Typography.Link>
-								</div>
+								addFormulaDisabledReason ?? (
+									<div style={{ textAlign: 'center' }}>
+										Add New Formula
+										<Typography.Link
+											href="https://signoz.io/docs/querying/multi-query-analysis/#advanced-comparisons"
+											target="_blank"
+											style={{ textDecoration: 'underline' }}
+										>
+											{' '}
+											<br />
+											Learn more
+										</Typography.Link>
+									</div>
+								)
 							}
 						>
 							<Button
 								className="add-formula-button periscope-btn "
+								data-testid="add-formula-button"
 								icon={<Sigma size={16} />}
 								onClick={addNewFormula}
+								disabled={addFormulaDisabled}
 							>
 								Add Formula
 							</Button>

frontend/src/components/QueryBuilderV2/QueryV2/QueryV2.tsx

@@ -20,6 +20,13 @@ import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 import { HandleChangeQueryDataV5 } from 'types/common/operations.types';
 import { DataSource } from 'types/common/queryBuilder';
 
+import { QueryBuilderField } from '../queryBuilderFields.types';
+import {
+	mergeQueryBuilderFieldsConfig,
+	RAW_QUERY_FIELDS,
+	resolveQueryBuilderField,
+} from '../queryBuilderFields.utils';
+
 import MetricsAggregateSection from './MerticsAggregateSection/MetricsAggregateSection';
 import { MetricsSelect } from './MetricsSelect/MetricsSelect';
 import QueryAddOns from './QueryAddOns/QueryAddOns';
@@ -31,8 +38,7 @@ export const QueryV2 = forwardRef(function QueryV2(
 		index,
 		queryVariant,
 		query,
-		filterConfigs,
-		isListViewPanel = false,
+		isRawQuery = false,
 		showTraceOperator = false,
 		hasTraceOperator = false,
 		version,
@@ -43,6 +49,8 @@ export const QueryV2 = forwardRef(function QueryV2(
 		signalSourceChangeEnabled = false,
 		queriesCount = 1,
 		savePreviousQuery = false,
+		fieldsConfig,
+		allowedDataSources,
 	}: QueryProps & {
 		onSignalSourceChange: (value: string) => void;
 		signalSourceChangeEnabled: boolean;
@@ -53,7 +61,7 @@ export const QueryV2 = forwardRef(function QueryV2(
 ): JSX.Element {
 	const { cloneQuery, panelType } = useQueryBuilder();
 
-	const showFunctions = query?.functions?.length > 0;
+	const hasQueryFunctions = query?.functions?.length > 0;
 	const { dataSource, builderQueryType } = query;
 
 	const [isCollapsed, setIsCollapsed] = useState(false);
@@ -66,8 +74,7 @@ export const QueryV2 = forwardRef(function QueryV2(
 	} = useQueryOperations({
 		index,
 		query,
-		filterConfigs,
-		isListViewPanel,
+		isRawQuery,
 		entityVersion: version,
 		savePreviousQuery,
 	});
@@ -99,14 +106,31 @@ export const QueryV2 = forwardRef(function QueryV2(
 		[dataSource, builderQueryType],
 	);
 
+	const resolvedConfig = useMemo(
+		() =>
+			mergeQueryBuilderFieldsConfig(
+				isRawQuery ? RAW_QUERY_FIELDS : undefined,
+				fieldsConfig,
+			),
+		[isRawQuery, fieldsConfig],
+	);
+
+	const aggregation = useMemo(
+		() => resolveQueryBuilderField(QueryBuilderField.Aggregation, resolvedConfig),
+		[resolvedConfig],
+	);
+
+	const functions = useMemo(
+		() => resolveQueryBuilderField(QueryBuilderField.Functions, resolvedConfig),
+		[resolvedConfig],
+	);
+
 	const showInlineQuerySearch = useMemo(() => {
 		if (!showTraceOperator) {
 			return false;
 		}
-		return (
-			dataSource === DataSource.TRACES && (hasTraceOperator || isListViewPanel)
-		);
-	}, [hasTraceOperator, isListViewPanel, showTraceOperator, dataSource]);
+		return dataSource === DataSource.TRACES && (hasTraceOperator || isRawQuery);
+	}, [hasTraceOperator, isRawQuery, showTraceOperator, dataSource]);
 
 	const handleChangeAggregateEvery = useCallback(
 		(value: IBuilderQuery['stepInterval']) => {
@@ -149,12 +173,15 @@ export const QueryV2 = forwardRef(function QueryV2(
 									hasTraceOperator={hasTraceOperator}
 									isMetricsDataSource={dataSource === DataSource.METRICS}
 									showFunctions={
-										(version && version === ENTITY_VERSION_V4) ||
-										query.dataSource === DataSource.LOGS ||
-										query.dataSource === DataSource.METRICS ||
-										showFunctions ||
-										false
+										!functions.hidden &&
+										((version && version === ENTITY_VERSION_V4) ||
+											query.dataSource === DataSource.LOGS ||
+											query.dataSource === DataSource.METRICS ||
+											hasQueryFunctions ||
+											false)
 									}
+									functionsDisabled={functions.disabled}
+									functionsDisabledReason={functions.reason}
 									isCollapsed={isCollapsed}
 									showTraceOperator={showTraceOperator}
 									entityType="query"
@@ -167,7 +194,8 @@ export const QueryV2 = forwardRef(function QueryV2(
 									onQueryFunctionsUpdates={handleQueryFunctionsUpdates}
 									showDeleteButton={false}
 									showCloneOption={false}
-									isListViewPanel={isListViewPanel}
+									isRawQuery={isRawQuery}
+									allowedDataSources={allowedDataSources}
 									index={index}
 									queryVariant={queryVariant}
 									onChangeDataSource={handleChangeDataSource}
@@ -267,7 +295,7 @@ export const QueryV2 = forwardRef(function QueryV2(
 						</div>
 
 						{!showOnlyWhereClause &&
-							!isListViewPanel &&
+							!aggregation.hidden &&
 							!(hasTraceOperator && dataSource === DataSource.TRACES) &&
 							dataSource !== DataSource.METRICS && (
 								<QueryAggregation
@@ -277,6 +305,7 @@ export const QueryV2 = forwardRef(function QueryV2(
 									onAggregationIntervalChange={handleChangeAggregateEvery}
 									onChange={handleChangeAggregation}
 									queryData={query}
+									fieldsConfig={fieldsConfig}
 								/>
 							)}
 
@@ -297,9 +326,10 @@ export const QueryV2 = forwardRef(function QueryV2(
 									index={index}
 									query={query}
 									version="v3"
-									isListViewPanel={isListViewPanel}
+									isRawQuery={isRawQuery}
 									showReduceTo={showReduceTo}
 									panelType={panelType}
+									fieldsConfig={fieldsConfig}
 								/>
 							)}
 					</div>

frontend/src/components/QueryBuilderV2/QueryV2/TraceOperator/TraceOperator.tsx

@@ -11,6 +11,7 @@ import {
 } from 'types/api/queryBuilder/queryBuilderData';
 import { DataSource } from 'types/common/queryBuilder';
 
+import { QueryBuilderFieldsConfig } from '../../queryBuilderFields.types';
 import QueryAddOns from '../QueryAddOns/QueryAddOns';
 import QueryAggregation from '../QueryAggregation/QueryAggregation';
 import TraceOperatorEditor from './TraceOperatorEditor';
@@ -19,10 +20,12 @@ import './TraceOperator.styles.scss';
 
 export default function TraceOperator({
 	traceOperator,
-	isListViewPanel = false,
+	isRawQuery = false,
+	fieldsConfig,
 }: {
 	traceOperator: IBuilderTraceOperator;
-	isListViewPanel?: boolean;
+	isRawQuery?: boolean;
+	fieldsConfig?: QueryBuilderFieldsConfig;
 }): JSX.Element {
 	const { panelType, removeTraceOperator } = useQueryBuilder();
 	const { handleChangeQueryData } = useQueryOperations({
@@ -58,12 +61,12 @@ export default function TraceOperator({
 	);
 
 	return (
-		<div className={cx('qb-trace-operator', !isListViewPanel && 'non-list-view')}>
+		<div className={cx('qb-trace-operator', !isRawQuery && 'non-list-view')}>
 			<div className="qb-trace-operator-container">
 				<div
 					className={cx(
 						'qb-trace-operator-label-with-input',
-						!isListViewPanel && 'qb-trace-operator-arrow',
+						!isRawQuery && 'qb-trace-operator-arrow',
 					)}
 				>
 					<Typography.Text className="label">Trace Operator</Typography.Text>
@@ -76,9 +79,9 @@ export default function TraceOperator({
 					</div>
 				</div>
 
-				{!isListViewPanel && (
+				{!isRawQuery && (
 					<div className="qb-trace-operator-aggregation-container">
-						<div className={cx(!isListViewPanel && 'qb-trace-operator-arrow')}>
+						<div className={cx(!isRawQuery && 'qb-trace-operator-arrow')}>
 							<QueryAggregation
 								dataSource={DataSource.TRACES}
 								key={`query-search-${traceOperator.queryName}`}
@@ -86,12 +89,13 @@ export default function TraceOperator({
 								onAggregationIntervalChange={handleChangeAggregateEvery}
 								onChange={handleChangeAggregation}
 								queryData={traceOperator}
+								fieldsConfig={fieldsConfig}
 							/>
 						</div>
 						<div
 							className={cx(
 								'qb-trace-operator-add-ons-container',
-								!isListViewPanel && 'qb-trace-operator-arrow',
+								!isRawQuery && 'qb-trace-operator-arrow',
 							)}
 						>
 							<QueryAddOns
@@ -99,9 +103,10 @@ export default function TraceOperator({
 								query={traceOperator}
 								version="v3"
 								isForTraceOperator
-								isListViewPanel={false}
+								isRawQuery={false}
 								showReduceTo={false}
 								panelType={panelType}
+								fieldsConfig={fieldsConfig}
 							/>
 						</div>
 					</div>

frontend/src/components/QueryBuilderV2/QueryV2/__tests__/QueryV2.test.tsx

@@ -142,7 +142,6 @@ describe('QueryBuilderV2 + QueryV2 - base render', () => {
 			isMetricsDataSource: false,
 			operators: [],
 			spaceAggregationOptions: [],
-			listOfAdditionalFilters: [],
 			handleChangeOperator: jest.fn(),
 			handleSpaceAggregationChange: jest.fn(),
 			handleChangeAggregatorAttribute: jest.fn(),
@@ -152,7 +151,6 @@ describe('QueryBuilderV2 + QueryV2 - base render', () => {
 				jest.fn() as unknown as ReturnType<UseQueryOperations>['handleChangeQueryData'],
 			handleChangeFormulaData: jest.fn(),
 			handleQueryFunctionsUpdates: handleQueryFunctionsUpdatesMock,
-			listOfAdditionalFormulaFilters: [],
 		});
 	});
 

frontend/src/components/QueryBuilderV2/__tests__/QueryAddOns.test.tsx

@@ -95,7 +95,7 @@ describe('QueryAddOns', () => {
 			<QueryAddOns
 				query={baseQuery()}
 				version="v5"
-				isListViewPanel={false}
+				isRawQuery={false}
 				showReduceTo
 				panelType={PANEL_TYPES.VALUE}
 				index={0}
@@ -119,7 +119,7 @@ describe('QueryAddOns', () => {
 					groupBy: ['service.name'],
 				})}
 				version="v5"
-				isListViewPanel={false}
+				isRawQuery={false}
 				showReduceTo={false}
 				panelType={PANEL_TYPES.TIME_SERIES}
 				index={0}
@@ -135,7 +135,7 @@ describe('QueryAddOns', () => {
 			<QueryAddOns
 				query={baseQuery()}
 				version="v5"
-				isListViewPanel
+				isRawQuery
 				showReduceTo={false}
 				panelType={PANEL_TYPES.LIST}
 				index={0}
@@ -151,7 +151,7 @@ describe('QueryAddOns', () => {
 			<QueryAddOns
 				query={baseQuery({ limit: 5 })}
 				version="v5"
-				isListViewPanel={false}
+				isRawQuery={false}
 				showReduceTo={false}
 				panelType={PANEL_TYPES.TIME_SERIES}
 				index={0}
@@ -176,7 +176,7 @@ describe('QueryAddOns', () => {
 			<QueryAddOns
 				query={query}
 				version="v5"
-				isListViewPanel={false}
+				isRawQuery={false}
 				showReduceTo={false}
 				panelType={PANEL_TYPES.TIME_SERIES}
 				index={0}
@@ -195,7 +195,7 @@ describe('QueryAddOns', () => {
 			<QueryAddOns
 				query={baseQuery()}
 				version="v5"
-				isListViewPanel={false}
+				isRawQuery={false}
 				showReduceTo
 				panelType={PANEL_TYPES.TIME_SERIES}
 				index={0}
@@ -211,7 +211,7 @@ describe('QueryAddOns', () => {
 			<QueryAddOns
 				query={baseQuery({ reduceTo: ReduceOperators.SUM })}
 				version="v5"
-				isListViewPanel={false}
+				isRawQuery={false}
 				showReduceTo
 				panelType={PANEL_TYPES.TIME_SERIES}
 				index={0}
@@ -234,7 +234,7 @@ describe('QueryAddOns', () => {
 			<QueryAddOns
 				query={query}
 				version="v5"
-				isListViewPanel={false}
+				isRawQuery={false}
 				showReduceTo
 				panelType={PANEL_TYPES.TIME_SERIES}
 				index={0}
@@ -286,7 +286,7 @@ describe('QueryAddOns', () => {
 			<QueryAddOns
 				query={query}
 				version="v5"
-				isListViewPanel={false}
+				isRawQuery={false}
 				showReduceTo={false}
 				panelType={PANEL_TYPES.TIME_SERIES}
 				index={0}
@@ -314,7 +314,7 @@ describe('QueryAddOns', () => {
 			<QueryAddOns
 				query={query}
 				version="v5"
-				isListViewPanel={false}
+				isRawQuery={false}
 				showReduceTo={false}
 				panelType={PANEL_TYPES.TIME_SERIES}
 				index={0}

frontend/src/components/QueryBuilderV2/__tests__/QueryFooter.test.tsx

@@ -0,0 +1,46 @@
+import { render, screen } from 'tests/test-utils';
+
+import QueryFooter from '../QueryV2/QueryFooter/QueryFooter';
+
+jest.mock('hooks/queryBuilder/useQueryBuilder', () => ({
+	useQueryBuilder: (): {
+		currentQuery: { builder: { queryData: unknown[] } };
+		panelType: string;
+	} => ({
+		currentQuery: { builder: { queryData: [] } },
+		panelType: 'time_series',
+	}),
+}));
+
+const noop = (): void => {};
+
+describe('QueryFooter', () => {
+	it('offers both buttons by default', () => {
+		render(
+			<QueryFooter
+				addNewBuilderQuery={noop}
+				addNewFormula={noop}
+				showAddTraceOperator={false}
+			/>,
+		);
+
+		expect(screen.getByTestId('add-new-query-button')).toBeInTheDocument();
+		expect(screen.getByTestId('add-formula-button')).toBeInTheDocument();
+	});
+
+	// A kind whose request takes a single query (Heatmap) hides the button outright
+	// rather than disabling it — a query it adds is one the builder cannot render.
+	it('drops the Add New Query button when the caller withholds it', () => {
+		render(
+			<QueryFooter
+				addNewBuilderQuery={noop}
+				addNewFormula={noop}
+				showAddQuery={false}
+				showAddTraceOperator={false}
+			/>,
+		);
+
+		expect(screen.queryByTestId('add-new-query-button')).not.toBeInTheDocument();
+		expect(screen.getByTestId('add-formula-button')).toBeInTheDocument();
+	});
+});

frontend/src/components/QueryBuilderV2/__tests__/queryBuilderFields.utils.test.ts

@@ -0,0 +1,140 @@
+import { QueryBuilderField } from '../queryBuilderFields.types';
+import {
+	mergeQueryBuilderFieldsConfig,
+	RAW_QUERY_FIELDS,
+	resolveQueryBuilderField,
+	resolveQueryBuilderFields,
+} from '../queryBuilderFields.utils';
+
+const SUPPORTED = [
+	QueryBuilderField.GroupBy,
+	QueryBuilderField.Having,
+	QueryBuilderField.OrderBy,
+	QueryBuilderField.Limit,
+	QueryBuilderField.Legend,
+];
+
+describe('resolveQueryBuilderField', () => {
+	it('leaves an unconfigured field available', () => {
+		expect(resolveQueryBuilderField(QueryBuilderField.Having)).toStrictEqual({
+			hidden: false,
+			disabled: false,
+			pinned: false,
+		});
+	});
+
+	it('hides a field configured hidden', () => {
+		const resolved = resolveQueryBuilderField(QueryBuilderField.Having, {
+			[QueryBuilderField.Having]: { state: 'hidden' },
+		});
+
+		expect(resolved.hidden).toBe(true);
+		expect(resolved.disabled).toBe(false);
+	});
+
+	it('carries the reason through on a disabled field', () => {
+		const resolved = resolveQueryBuilderField(QueryBuilderField.Having, {
+			[QueryBuilderField.Having]: {
+				state: 'disabled',
+				reason: 'Having filters aggregated results.',
+			},
+		});
+
+		expect(resolved).toStrictEqual({
+			hidden: false,
+			disabled: true,
+			reason: 'Having filters aggregated results.',
+			pinned: false,
+		});
+	});
+
+	it('pins a field configured pinned', () => {
+		const resolved = resolveQueryBuilderField(QueryBuilderField.OrderBy, {
+			[QueryBuilderField.OrderBy]: { state: 'pinned' },
+		});
+
+		expect(resolved.pinned).toBe(true);
+		expect(resolved.hidden).toBe(false);
+	});
+
+	it('only ever resolves one state at a time', () => {
+		const resolved = resolveQueryBuilderField(QueryBuilderField.Limit, {
+			[QueryBuilderField.Limit]: { state: 'disabled', reason: 'why' },
+		});
+
+		expect([resolved.hidden, resolved.disabled, resolved.pinned]).toStrictEqual([
+			false,
+			true,
+			false,
+		]);
+	});
+});
+
+describe('resolveQueryBuilderFields', () => {
+	it('resolves every supported field and nothing else', () => {
+		const resolved = resolveQueryBuilderFields(SUPPORTED);
+
+		expect([...resolved.keys()]).toStrictEqual(SUPPORTED);
+	});
+
+	it('cannot widen beyond what the builder supports', () => {
+		const resolved = resolveQueryBuilderFields([QueryBuilderField.Legend], {
+			[QueryBuilderField.ReduceTo]: { state: 'pinned' },
+		});
+
+		expect(resolved.has(QueryBuilderField.ReduceTo)).toBe(false);
+	});
+});
+
+describe('mergeQueryBuilderFieldsConfig', () => {
+	it('returns the override when there is no baseline', () => {
+		const override = { [QueryBuilderField.Limit]: { state: 'hidden' } } as const;
+
+		expect(mergeQueryBuilderFieldsConfig(undefined, override)).toBe(override);
+	});
+
+	it('returns the baseline when there is no override', () => {
+		expect(mergeQueryBuilderFieldsConfig(RAW_QUERY_FIELDS, undefined)).toBe(
+			RAW_QUERY_FIELDS,
+		);
+	});
+
+	it('lets the override win per field, leaving the rest of the baseline intact', () => {
+		const merged = mergeQueryBuilderFieldsConfig(RAW_QUERY_FIELDS, {
+			[QueryBuilderField.Having]: { state: 'disabled', reason: 'no aggregation' },
+		});
+
+		expect(merged?.[QueryBuilderField.Having]).toStrictEqual({
+			state: 'disabled',
+			reason: 'no aggregation',
+		});
+		expect(merged?.[QueryBuilderField.GroupBy]).toStrictEqual({
+			state: 'hidden',
+		});
+		expect(merged?.[QueryBuilderField.OrderBy]).toStrictEqual({
+			state: 'pinned',
+		});
+	});
+});
+
+describe('RAW_QUERY_FIELDS', () => {
+	it('reduces an aggregate surface to a pinned order by', () => {
+		const resolved = resolveQueryBuilderFields(SUPPORTED, RAW_QUERY_FIELDS);
+
+		const visible = [...resolved.entries()]
+			.filter(([, field]) => !field.hidden)
+			.map(([key]) => key);
+
+		expect(visible).toStrictEqual([QueryBuilderField.OrderBy]);
+		expect(resolved.get(QueryBuilderField.OrderBy)?.pinned).toBe(true);
+	});
+
+	it('leaves additional queries alone, so trace matching still allows several', () => {
+		expect(
+			resolveQueryBuilderField(
+				QueryBuilderField.AdditionalQueries,
+				RAW_QUERY_FIELDS,
+			).hidden,
+		).toBe(false);
+	});
+});

frontend/src/components/QueryBuilderV2/queryBuilderFields.types.ts

@@ -0,0 +1,36 @@
+/**
+ * Everything the query builder can surface.
+ *
+ * The per-query values double as the add-on identities the builder renders
+ * (`data-testid="query-add-on-<value>"`), so they are part of the DOM contract and must
+ * not be renamed to match the member names.
+ */
+export enum QueryBuilderField {
+	// Per query
+	Aggregation = 'aggregation',
+	StepInterval = 'step_interval',
+	Functions = 'functions',
+	GroupBy = 'group_by',
+	Having = 'having',
+	OrderBy = 'order_by',
+	Limit = 'limit',
+	Legend = 'legend_format',
+	ReduceTo = 'reduce_to',
+	// Builder level
+	Formula = 'formula',
+	AdditionalQueries = 'additional_queries',
+}
+
+/** `reason` is required on `disabled`: an inert control the user can see has to explain itself. */
+export type QueryBuilderFieldRule =
+	| { state: 'hidden' }
+	| { state: 'disabled'; reason: string }
+	| { state: 'pinned' };
+
+/**
+ * A caller's narrowing of the builder's surface. The builder works out which fields suit
+ * the current data source and panel type first; this can only take away from that set.
+ */
+export type QueryBuilderFieldsConfig = Partial<
+	Record<QueryBuilderField, QueryBuilderFieldRule>
+>;

frontend/src/components/QueryBuilderV2/queryBuilderFields.utils.ts

@@ -0,0 +1,88 @@
+import {
+	QueryBuilderField,
+	QueryBuilderFieldRule,
+	QueryBuilderFieldsConfig,
+} from './queryBuilderFields.types';
+
+export interface ResolvedQueryBuilderField {
+	hidden: boolean;
+	disabled: boolean;
+	reason?: string;
+	/** Rendered open, not dismissable, and kept out of the add-on toggle bar. */
+	pinned: boolean;
+}
+
+const AVAILABLE: ResolvedQueryBuilderField = {
+	hidden: false,
+	disabled: false,
+	pinned: false,
+};
+
+function fromRule(rule: QueryBuilderFieldRule): ResolvedQueryBuilderField {
+	switch (rule.state) {
+		case 'hidden':
+			return { hidden: true, disabled: false, pinned: false };
+		case 'disabled':
+			return {
+				hidden: false,
+				disabled: true,
+				reason: rule.reason,
+				pinned: false,
+			};
+		case 'pinned':
+			return { hidden: false, disabled: false, pinned: true };
+		default:
+			return AVAILABLE;
+	}
+}
+
+export function resolveQueryBuilderField(
+	field: QueryBuilderField,
+	config?: QueryBuilderFieldsConfig,
+): ResolvedQueryBuilderField {
+	const rule = config?.[field];
+
+	return rule ? fromRule(rule) : AVAILABLE;
+}
+
+/**
+ * Fields absent from `supported` are hidden whatever the config says, so a config can
+ * only ever take away.
+ */
+export function resolveQueryBuilderFields(
+	supported: readonly QueryBuilderField[],
+	config?: QueryBuilderFieldsConfig,
+): Map<QueryBuilderField, ResolvedQueryBuilderField> {
+	return new Map(
+		supported.map((field) => [field, resolveQueryBuilderField(field, config)]),
+	);
+}
+
+/**
+ * The surface a raw-row builder starts from, layered under a caller's own config.
+ * `AdditionalQueries` is deliberately absent — a raw trace builder still takes several
+ * queries when trace matching is on.
+ */
+export const RAW_QUERY_FIELDS: QueryBuilderFieldsConfig = {
+	[QueryBuilderField.Aggregation]: { state: 'hidden' },
+	[QueryBuilderField.StepInterval]: { state: 'hidden' },
+	[QueryBuilderField.Functions]: { state: 'hidden' },
+	[QueryBuilderField.GroupBy]: { state: 'hidden' },
+	[QueryBuilderField.Having]: { state: 'hidden' },
+	[QueryBuilderField.Limit]: { state: 'hidden' },
+	[QueryBuilderField.Legend]: { state: 'hidden' },
+	[QueryBuilderField.ReduceTo]: { state: 'hidden' },
+	[QueryBuilderField.Formula]: { state: 'hidden' },
+	[QueryBuilderField.OrderBy]: { state: 'pinned' },
+};
+
+export function mergeQueryBuilderFieldsConfig(
+	baseline: QueryBuilderFieldsConfig | undefined,
+	override: QueryBuilderFieldsConfig | undefined,
+): QueryBuilderFieldsConfig | undefined {
+	if (!baseline) {
+		return override;
+	}
+
+	return override ? { ...baseline, ...override } : baseline;
+}

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/Checkbox.test.tsx

@@ -143,7 +143,7 @@ describe('CheckboxFilter - User Flows', () => {
 		render(
 			<CheckboxFilter
 				filter={mockFilter}
-				pageSource={QuickFiltersSource.LOGS_EXPLORER}
+				source={QuickFiltersSource.LOGS_EXPLORER}
 			/>,
 		);
 
@@ -178,7 +178,7 @@ describe('CheckboxFilter - User Flows', () => {
 		render(
 			<CheckboxFilter
 				filter={mockFilter}
-				pageSource={QuickFiltersSource.LOGS_EXPLORER}
+				source={QuickFiltersSource.LOGS_EXPLORER}
 			/>,
 		);
 
@@ -218,7 +218,7 @@ describe('CheckboxFilter - User Flows', () => {
 		render(
 			<CheckboxFilter
 				filter={mockFilter}
-				pageSource={QuickFiltersSource.LOGS_EXPLORER}
+				source={QuickFiltersSource.LOGS_EXPLORER}
 			/>,
 		);
 
@@ -281,7 +281,7 @@ describe('CheckboxFilter - User Flows', () => {
 		render(
 			<CheckboxFilter
 				filter={mockFilter}
-				pageSource={QuickFiltersSource.LOGS_EXPLORER}
+				source={QuickFiltersSource.LOGS_EXPLORER}
 			/>,
 		);
 
@@ -339,7 +339,7 @@ describe('CheckboxFilter - User Flows', () => {
 		render(
 			<CheckboxFilter
 				filter={mockFilter}
-				pageSource={QuickFiltersSource.LOGS_EXPLORER}
+				source={QuickFiltersSource.LOGS_EXPLORER}
 			/>,
 		);
 
@@ -397,7 +397,7 @@ describe('CheckboxFilter - User Flows', () => {
 		render(
 			<CheckboxFilter
 				filter={mockFilter}
-				pageSource={QuickFiltersSource.LOGS_EXPLORER}
+				source={QuickFiltersSource.LOGS_EXPLORER}
 			/>,
 		);
 
@@ -449,7 +449,7 @@ describe('CheckboxFilter - User Flows', () => {
 		render(
 			<CheckboxFilter
 				filter={mockFilter}
-				pageSource={QuickFiltersSource.LOGS_EXPLORER}
+				source={QuickFiltersSource.LOGS_EXPLORER}
 			/>,
 		);
 

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/Checkbox.tsx

@@ -27,17 +27,17 @@ const SOURCES_WITH_EMPTY_STATE_ENABLED = [QuickFiltersSource.LOGS_EXPLORER];
 
 interface ICheckboxProps {
 	filter: IQuickFiltersConfig;
-	pageSource: QuickFiltersSource;
+	source: QuickFiltersSource;
 	onFilterChange?: (query: Query) => void;
 	onQuickFilterChange?: (data: QuickFilterChangeEventData) => void;
 }
 
 // eslint-disable-next-line sonarjs/cognitive-complexity
 export default function CheckboxFilter(props: ICheckboxProps): JSX.Element {
-	const { pageSource, filter, onFilterChange, onQuickFilterChange } = props;
+	const { source, filter, onFilterChange, onQuickFilterChange } = props;
 	const [searchText, setSearchText] = useState<string>('');
 
-	const activeQueryIndex = useActiveQueryIndex(pageSource);
+	const activeQueryIndex = useActiveQueryIndex(source);
 
 	const {
 		isOpen,
@@ -49,7 +49,7 @@ export default function CheckboxFilter(props: ICheckboxProps): JSX.Element {
 
 	const { attributeValues, isLoading } = useCheckboxFilterValues({
 		filter,
-		pageSource,
+		source,
 		searchText,
 		isOpen,
 	});
@@ -59,7 +59,7 @@ export default function CheckboxFilter(props: ICheckboxProps): JSX.Element {
 
 	const { onChange, onClear } = useCheckboxFilterActions({
 		filter,
-		pageSource,
+		source,
 		attributeValues,
 		activeQueryIndex,
 		onFilterChange,
@@ -88,7 +88,7 @@ export default function CheckboxFilter(props: ICheckboxProps): JSX.Element {
 	);
 
 	const isEmptyStateWithDocsEnabled =
-		SOURCES_WITH_EMPTY_STATE_ENABLED.includes(pageSource) &&
+		SOURCES_WITH_EMPTY_STATE_ENABLED.includes(source) &&
 		!searchText &&
 		!attributeValues.length;
 

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/checkboxFilterQuery.test.ts

@@ -97,7 +97,7 @@ interface ToggleAction {
 	isOnlyOrAllClicked?: boolean;
 	previousState?: CheckedState;
 	sectionType?: SectionType;
-	pageSource?: QuickFiltersSource;
+	source?: QuickFiltersSource;
 	attributeValues?: string[];
 }
 
@@ -117,7 +117,7 @@ function runToggle(c: ToggleCase): { items: SimpleItem[]; expression: string } {
 		currentQuery: buildQuery(initialItems, initialExpression),
 		activeQueryIndex: 0,
 		filter: { attributeKey: { key: KEY, type: 'tag' } } as never,
-		pageSource: c.action.pageSource ?? QuickFiltersSource.LOGS_EXPLORER,
+		source: c.action.source ?? QuickFiltersSource.LOGS_EXPLORER,
 		attributeValues: c.action.attributeValues ?? ['a', 'b', 'c'],
 		value: c.action.value,
 		checked: c.action.checked,
@@ -162,7 +162,7 @@ const TOGGLE_CASES: ToggleCase[] = [
 		action: {
 			value: 'a',
 			checked: false,
-			pageSource: QuickFiltersSource.INFRA_MONITORING,
+			source: QuickFiltersSource.INFRA_MONITORING,
 		},
 		// `nin` is what the source asks for, but re-deriving the expression
 		// normalises it. Nothing observes the difference: both infra pages send
@@ -313,7 +313,7 @@ const TOGGLE_CASES: ToggleCase[] = [
 		action: {
 			value: 'b',
 			checked: false,
-			pageSource: QuickFiltersSource.INFRA_MONITORING,
+			source: QuickFiltersSource.INFRA_MONITORING,
 		},
 		expected: {
 			items: [{ key: KEY, op: 'not in', value: ['a', 'b'] }],

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/checkboxFilterQuery.ts

@@ -47,8 +47,8 @@ const SOURCES_WITH_SHORT_OPERATORS = [QuickFiltersSource.INFRA_MONITORING];
  * Returns the correct NOT_IN operator value based on source.
  * InfraMonitoring backend expects 'nin', others expect 'not in'.
  */
-export function getNotInOperator(pageSource: QuickFiltersSource): string {
-	if (SOURCES_WITH_SHORT_OPERATORS.includes(pageSource)) {
+export function getNotInOperator(source: QuickFiltersSource): string {
+	if (SOURCES_WITH_SHORT_OPERATORS.includes(source)) {
 		return 'nin';
 	}
 	return getOperatorValue('NOT_IN');
@@ -172,7 +172,7 @@ export function applyCheckboxToggle({
 	currentQuery,
 	activeQueryIndex,
 	filter,
-	pageSource,
+	source,
 	attributeValues,
 	value,
 	checked,
@@ -183,7 +183,7 @@ export function applyCheckboxToggle({
 	currentQuery: Query;
 	activeQueryIndex: number;
 	filter: IQuickFiltersConfig;
-	pageSource: QuickFiltersSource;
+	source: QuickFiltersSource;
 	attributeValues: string[];
 	value: string;
 	checked: boolean;
@@ -278,7 +278,7 @@ export function applyCheckboxToggle({
 							if (sectionType === SectionType.RELATED) {
 								const newFilter: TagFilterItem = {
 									id: uuid(),
-									op: getNotInOperator(pageSource),
+									op: getNotInOperator(source),
 									key: filter.attributeKey,
 									value,
 								};
@@ -418,7 +418,7 @@ export function applyCheckboxToggle({
 						if (!checked) {
 							const newFilter = {
 								...currentFilter,
-								op: getNotInOperator(pageSource),
+								op: getNotInOperator(source),
 								value: [currentFilter.value as string, value],
 							};
 							query.filters.items = query.filters.items.map((item) => {
@@ -442,7 +442,7 @@ export function applyCheckboxToggle({
 			// checked=true → user wants to select (IN), checked=false → exclude (NOT IN)
 			const newFilterItem: TagFilterItem = {
 				id: uuid(),
-				op: checked ? getOperatorValue(OPERATORS.IN) : getNotInOperator(pageSource),
+				op: checked ? getOperatorValue(OPERATORS.IN) : getNotInOperator(source),
 				key: filter.attributeKey,
 				value,
 			};

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/useActiveQueryIndex.ts

@@ -10,18 +10,18 @@ import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
  * In ListView most sources use index 0; TRACES_EXPLORER and every non-ListView
  * mode track the last focused query.
  */
-function useActiveQueryIndex(pageSource: QuickFiltersSource): number {
+function useActiveQueryIndex(source: QuickFiltersSource): number {
 	const { lastUsedQuery, panelType } = useQueryBuilder();
 	const isListView = panelType === PANEL_TYPES.LIST;
 
 	return useMemo(() => {
 		if (isListView) {
-			return pageSource === QuickFiltersSource.TRACES_EXPLORER
+			return source === QuickFiltersSource.TRACES_EXPLORER
 				? lastUsedQuery || 0
 				: 0;
 		}
 		return lastUsedQuery || 0;
-	}, [isListView, pageSource, lastUsedQuery]);
+	}, [isListView, source, lastUsedQuery]);
 }
 
 export default useActiveQueryIndex;

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/useCheckboxFilterActions.ts

@@ -16,7 +16,7 @@ import { SectionType } from './v2/itemRules';
 
 interface UseCheckboxFilterActionsProps {
 	filter: IQuickFiltersConfig;
-	pageSource: QuickFiltersSource;
+	source: QuickFiltersSource;
 	attributeValues: string[];
 	activeQueryIndex: number;
 	onFilterChange?: ((query: Query) => void) | null;
@@ -40,7 +40,7 @@ interface UseCheckboxFilterActionsReturn {
  */
 function useCheckboxFilterActions({
 	filter,
-	pageSource,
+	source,
 	attributeValues,
 	activeQueryIndex,
 	onFilterChange,
@@ -67,7 +67,7 @@ function useCheckboxFilterActions({
 			currentQuery,
 			activeQueryIndex,
 			filter,
-			pageSource,
+			source,
 			attributeValues,
 			value,
 			checked,

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/useCheckboxFilterValues.tsx

@@ -11,7 +11,7 @@ import { DataSource } from 'types/common/queryBuilder';
 
 interface UseCheckboxFilterValuesProps {
 	filter: IQuickFiltersConfig;
-	pageSource: QuickFiltersSource;
+	source: QuickFiltersSource;
 	searchText: string;
 	isOpen: boolean;
 }
@@ -23,7 +23,7 @@ interface UseCheckboxFilterValuesReturn {
 
 function useCheckboxFilterValues({
 	filter,
-	pageSource,
+	source,
 	searchText,
 	isOpen,
 }: UseCheckboxFilterValuesProps): UseCheckboxFilterValuesReturn {
@@ -38,7 +38,7 @@ function useCheckboxFilterValues({
 			searchText: searchText ?? '',
 		},
 		{
-			enabled: isOpen && pageSource !== QuickFiltersSource.METER_EXPLORER,
+			enabled: isOpen && source !== QuickFiltersSource.METER_EXPLORER,
 			keepPreviousData: true,
 		},
 	);
@@ -49,7 +49,7 @@ function useCheckboxFilterValues({
 			signal: filter.dataSource || DataSource.LOGS,
 			signalSource: 'meter',
 			options: {
-				enabled: isOpen && pageSource === QuickFiltersSource.METER_EXPLORER,
+				enabled: isOpen && source === QuickFiltersSource.METER_EXPLORER,
 				keepPreviousData: true,
 			},
 		});
@@ -57,7 +57,7 @@ function useCheckboxFilterValues({
 	const attributeValues: string[] = useMemo(() => {
 		const dataType = filter.attributeKey.dataType || DataTypes.String;
 
-		if (pageSource === QuickFiltersSource.METER_EXPLORER && keyValueSuggestions) {
+		if (source === QuickFiltersSource.METER_EXPLORER && keyValueSuggestions) {
 			// Process the response data
 			const responseData = keyValueSuggestions?.data as any;
 			const values = responseData.data?.values || {};
@@ -88,12 +88,7 @@ function useCheckboxFilterValues({
 		return (data?.payload?.[key] || []).filter(
 			(val) => val !== undefined && val !== null,
 		);
-	}, [
-		data?.payload,
-		filter.attributeKey.dataType,
-		keyValueSuggestions,
-		pageSource,
-	]);
+	}, [data?.payload, filter.attributeKey.dataType, keyValueSuggestions, source]);
 
 	return {
 		attributeValues,

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/v2/CheckboxFilterV2.testUtils.tsx

@@ -1,5 +1,4 @@
 import { render, RenderResult } from 'tests/test-utils';
-import { TelemetrytypesSignalDTO } from 'api/generated/services/sigNoz.schemas';
 import { server, rest } from 'mocks-server/server';
 import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { DataSource } from 'types/common/queryBuilder';
@@ -26,7 +25,6 @@ export const DEFAULT_FILTER: IQuickFiltersConfig = {
 };
 
 export const DEFAULT_USE_FIELD_APIS: QuickFilterCheckboxUseFieldApis = {
-	signal: TelemetrytypesSignalDTO.traces,
 	startUnixMilli: 1700000000000,
 	endUnixMilli: 1700003600000,
 	existingQuery: null,
@@ -72,13 +70,6 @@ export function setupServer(): void {
 	afterAll(() => server.close());
 }
 
-// Components read currentQuery for the checkbox state and stagedQuery for the
-// values fetch; in the app both are set by the same URL sync, so tests pass one
-// query as both.
-export function buildQueryBuilderOverrides(query: unknown): never {
-	return { currentQuery: query, stagedQuery: query } as unknown as never;
-}
-
 export interface FilterItemConfig {
 	op: string;
 	value: string | string[];
@@ -101,7 +92,7 @@ export function renderWithFilter(
 	return render(
 		<CheckboxFilterV2
 			filter={DEFAULT_FILTER}
-			pageSource={QuickFiltersSource.TRACES_EXPLORER}
+			source={QuickFiltersSource.TRACES_EXPLORER}
 			useFieldApis={{
 				...DEFAULT_USE_FIELD_APIS,
 				existingQuery: 'service.name = "api"',
@@ -110,16 +101,18 @@ export function renderWithFilter(
 		/>,
 		undefined,
 		{
-			queryBuilderOverrides: buildQueryBuilderOverrides({
-				builder: {
-					queryData: [
-						{
-							filters: { items, op: 'AND' },
-							filter: { expression: 'service.name = "api"' },
-						},
-					],
+			queryBuilderOverrides: {
+				currentQuery: {
+					builder: {
+						queryData: [
+							{
+								filters: { items, op: 'AND' },
+								filter: { expression: 'service.name = "api"' },
+							},
+						],
+					},
 				},
-			}),
+			} as never,
 		},
 	);
 }

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/v2/CheckboxFilterV2.tsx

@@ -32,7 +32,7 @@ import styles from './CheckboxFilterV2.module.scss';
 
 interface CheckboxFilterV2Props {
 	filter: IQuickFiltersConfig;
-	pageSource: QuickFiltersSource;
+	source: QuickFiltersSource;
 	onFilterChange?: (query: Query) => void;
 	onQuickFilterChange?: (data: QuickFilterChangeEventData) => void;
 	useFieldApis: QuickFilterCheckboxUseFieldApis;
@@ -41,18 +41,13 @@ interface CheckboxFilterV2Props {
 export default function CheckboxFilterV2(
 	props: CheckboxFilterV2Props,
 ): JSX.Element {
-	const {
-		pageSource,
-		filter,
-		onFilterChange,
-		onQuickFilterChange,
-		useFieldApis,
-	} = props;
+	const { source, filter, onFilterChange, onQuickFilterChange, useFieldApis } =
+		props;
 	const [searchText, setSearchText] = useState<string>('');
 	const [userToggleState, setUserToggleState] = useState<boolean | null>(null);
 
 	const { currentQuery } = useQueryBuilder();
-	const activeQueryIndex = useActiveQueryIndex(pageSource);
+	const activeQueryIndex = useActiveQueryIndex(source);
 
 	const {
 		isOpen,
@@ -79,8 +74,6 @@ export default function CheckboxFilterV2(
 		searchText,
 		existingQuery,
 		metricNamespace: useFieldApis.metricNamespace,
-		signal: useFieldApis.signal,
-		source: useFieldApis.source,
 		startUnixMilli: useFieldApis.startUnixMilli,
 		endUnixMilli: useFieldApis.endUnixMilli,
 		enabled: isOpen,
@@ -109,7 +102,7 @@ export default function CheckboxFilterV2(
 
 	const { onChange, onClear } = useCheckboxFilterActions({
 		filter,
-		pageSource,
+		source,
 		attributeValues,
 		activeQueryIndex,
 		onFilterChange,
@@ -160,7 +153,6 @@ export default function CheckboxFilterV2(
 		isSomeFilterPresentForCurrentAttribute,
 		isNotInOperator,
 		hasExistingQuery,
-		isRelatedValuesSupported: useFieldApis.existingQuery !== null,
 		visibleItemsCount,
 		relatedExclusions,
 	});

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/v2/__tests__/CheckboxFilterV2.existingQuery.test.tsx

@@ -6,7 +6,6 @@ import { QuickFiltersSource } from '../../../../types';
 
 import CheckboxFilterV2 from '../CheckboxFilterV2';
 import {
-	buildQueryBuilderOverrides,
 	DEFAULT_FILTER,
 	DEFAULT_USE_FIELD_APIS,
 	setupServer,
@@ -50,7 +49,7 @@ describe('CheckboxFilterV2 - existingQuery calculation', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={{
 						...DEFAULT_USE_FIELD_APIS,
 						existingQuery: 'custom.query = "value"',
@@ -58,16 +57,18 @@ describe('CheckboxFilterV2 - existingQuery calculation', () => {
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: { items: [], op: 'AND' },
-									filter: { expression: 'should.be.ignored = "yes"' },
-								},
-							],
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: { items: [], op: 'AND' },
+										filter: { expression: 'should.be.ignored = "yes"' },
+									},
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 
@@ -82,7 +83,7 @@ describe('CheckboxFilterV2 - existingQuery calculation', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={{
 						...DEFAULT_USE_FIELD_APIS,
 						existingQuery: null,
@@ -90,16 +91,18 @@ describe('CheckboxFilterV2 - existingQuery calculation', () => {
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: { items: [], op: 'AND' },
-									filter: { expression: 'should.be.ignored = "yes"' },
-								},
-							],
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: { items: [], op: 'AND' },
+										filter: { expression: 'should.be.ignored = "yes"' },
+									},
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 
@@ -116,30 +119,32 @@ describe('CheckboxFilterV2 - existingQuery calculation', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={USE_FIELD_APIS_AUTO_DERIVE}
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: {
-										items: [
-											{
-												key: { key: 'service.name', dataType: 'string', type: 'tag' },
-												op: '=',
-												value: 'from-v3-items',
-											},
-										],
-										op: 'AND',
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: {
+											items: [
+												{
+													key: { key: 'service.name', dataType: 'string', type: 'tag' },
+													op: '=',
+													value: 'from-v3-items',
+												},
+											],
+											op: 'AND',
+										},
+										filter: { expression: 'v5.expression = "preferred"' },
 									},
-									filter: { expression: 'v5.expression = "preferred"' },
-								},
-							],
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 
@@ -154,21 +159,23 @@ describe('CheckboxFilterV2 - existingQuery calculation', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={USE_FIELD_APIS_AUTO_DERIVE}
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: { items: [], op: 'AND' },
-									filter: { expression: 'only.v5 = "expression"' },
-								},
-							],
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: { items: [], op: 'AND' },
+										filter: { expression: 'only.v5 = "expression"' },
+									},
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 
@@ -185,29 +192,31 @@ describe('CheckboxFilterV2 - existingQuery calculation', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={USE_FIELD_APIS_AUTO_DERIVE}
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: {
-										items: [
-											{
-												key: { key: 'service.name', dataType: 'string', type: 'tag' },
-												op: '=',
-												value: 'api-service',
-											},
-										],
-										op: 'AND',
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: {
+											items: [
+												{
+													key: { key: 'service.name', dataType: 'string', type: 'tag' },
+													op: '=',
+													value: 'api-service',
+												},
+											],
+											op: 'AND',
+										},
 									},
-								},
-							],
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 
@@ -222,34 +231,36 @@ describe('CheckboxFilterV2 - existingQuery calculation', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={USE_FIELD_APIS_AUTO_DERIVE}
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: {
-										items: [
-											{
-												key: { key: 'service.name', dataType: 'string', type: 'tag' },
-												op: '=',
-												value: 'api',
-											},
-											{
-												key: { key: 'env', dataType: 'string', type: 'tag' },
-												op: '=',
-												value: 'prod',
-											},
-										],
-										op: 'AND',
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: {
+											items: [
+												{
+													key: { key: 'service.name', dataType: 'string', type: 'tag' },
+													op: '=',
+													value: 'api',
+												},
+												{
+													key: { key: 'env', dataType: 'string', type: 'tag' },
+													op: '=',
+													value: 'prod',
+												},
+											],
+											op: 'AND',
+										},
 									},
-								},
-							],
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 
@@ -264,20 +275,22 @@ describe('CheckboxFilterV2 - existingQuery calculation', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={USE_FIELD_APIS_AUTO_DERIVE}
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: { items: [], op: 'AND' },
-								},
-							],
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: { items: [], op: 'AND' },
+									},
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/v2/__tests__/CheckboxFilterV2.interactions.test.tsx

@@ -7,7 +7,6 @@ import { QuickFiltersSource } from '../../../../types';
 
 import CheckboxFilterV2 from '../CheckboxFilterV2';
 import {
-	buildQueryBuilderOverrides,
 	DEFAULT_FILTER,
 	DEFAULT_USE_FIELD_APIS,
 	getFilterFromCall,
@@ -52,7 +51,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 			);
@@ -118,7 +117,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={{
 						...DEFAULT_USE_FIELD_APIS,
 						existingQuery: 'service.name = "api"',
@@ -126,16 +125,18 @@ describe('CheckboxFilterV2 - interactions', () => {
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: { items: [], op: 'AND' },
-									filter: { expression: 'service.name = "api"' },
-								},
-							],
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: { items: [], op: 'AND' },
+										filter: { expression: 'service.name = "api"' },
+									},
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 
@@ -182,7 +183,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={{
 						...DEFAULT_USE_FIELD_APIS,
 						existingQuery: 'service.name = "api"',
@@ -229,7 +230,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 			);
@@ -271,7 +272,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={{
 						...DEFAULT_USE_FIELD_APIS,
 						existingQuery: 'service.name = "api"',
@@ -333,7 +334,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={{
 						...DEFAULT_USE_FIELD_APIS,
 						existingQuery: 'service.name = "api"',
@@ -379,7 +380,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 			);
@@ -407,7 +408,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 			render(
 				<CheckboxFilterV2
 					filter={{ ...DEFAULT_FILTER, defaultOpen: false }}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 			);
@@ -433,7 +434,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 			);
@@ -459,7 +460,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 			);
@@ -484,29 +485,31 @@ describe('CheckboxFilterV2 - interactions', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: {
-										items: [
-											{
-												key: { key: 'deployment.environment' },
-												op: 'in',
-												value: ['production'],
-											},
-										],
-										op: 'AND',
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: {
+											items: [
+												{
+													key: { key: 'deployment.environment' },
+													op: 'in',
+													value: ['production'],
+												},
+											],
+											op: 'AND',
+										},
 									},
-								},
-							],
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 
@@ -523,7 +526,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 			);
@@ -546,30 +549,32 @@ describe('CheckboxFilterV2 - interactions', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 					onFilterChange={onFilterChange}
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: {
-										items: [
-											{
-												key: { key: 'deployment.environment' },
-												op: 'in',
-												value: ['production'],
-											},
-										],
-										op: 'AND',
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: {
+											items: [
+												{
+													key: { key: 'deployment.environment' },
+													op: 'in',
+													value: ['production'],
+												},
+											],
+											op: 'AND',
+										},
 									},
-								},
-							],
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 
@@ -593,7 +598,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 					onFilterChange={onFilterChange}
 				/>,
@@ -632,7 +637,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 			expect(filter?.value).toBe('valueA');
 		});
 
-		it('adds to NOT IN when unchecking a non-excluded (other) item', async () => {
+		it('converts NOT IN to IN when toggling unchecked (other) item', async () => {
 			const user = userEvent.setup();
 			const onFilterChange = jest.fn();
 
@@ -641,70 +646,18 @@ describe('CheckboxFilterV2 - interactions', () => {
 				stringValues: ['valueB'],
 			});
 
-			// valueB is not excluded, so under NOT IN [valueA] it is still included
-			// and renders checked. Unchecking it excludes it too → NOT IN [A, B].
+			// Clicking unchecked "Other" item with NOT IN filter should convert to IN [B]
 			renderWithFilter(onFilterChange, { op: 'not in', value: ['valueA'] });
 
 			const rowB = await screen.findByTestId('checkbox-value-row-valueB');
-			expect(rowB).toHaveAttribute('data-state', 'checked');
+			expect(rowB).toHaveAttribute('data-state', 'unchecked');
 
 			await user.click(within(rowB).getByRole('checkbox'));
 
 			expect(onFilterChange).toHaveBeenCalledTimes(1);
 			const filter = getFilterFromCall(onFilterChange);
-			expect(filter?.op).toBe('not in');
-			expect(filter?.value).toStrictEqual(['valueA', 'valueB']);
-		});
-
-		it('adds to NOT IN when unchecking a non-excluded item without related values', async () => {
-			const user = userEvent.setup();
-			const onFilterChange = jest.fn();
-
-			mockFieldsValuesAPI({
-				stringValues: ['valueA', 'valueB'],
-			});
-
-			// Without related values the display follows the clause: valueB is not
-			// excluded, so it renders checked; unchecking it excludes it too.
-			render(
-				<CheckboxFilterV2
-					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
-					useFieldApis={DEFAULT_USE_FIELD_APIS}
-					onFilterChange={onFilterChange}
-				/>,
-				undefined,
-				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: {
-										items: [
-											{
-												key: { key: 'deployment.environment' },
-												op: 'not in',
-												value: ['valueA'],
-											},
-										],
-										op: 'AND',
-									},
-								},
-							],
-						},
-					}),
-				},
-			);
-
-			const rowB = await screen.findByTestId('checkbox-value-row-valueB');
-			expect(rowB).toHaveAttribute('data-state', 'checked');
-
-			await user.click(within(rowB).getByRole('checkbox'));
-
-			expect(onFilterChange).toHaveBeenCalledTimes(1);
-			const filter = getFilterFromCall(onFilterChange);
-			expect(filter?.op).toBe('not in');
-			expect(filter?.value).toStrictEqual(['valueA', 'valueB']);
+			expect(filter?.op).toBe('in');
+			expect(filter?.value).toBe('valueB');
 		});
 
 		it('accumulates both values in IN when toggling checked (related) then unchecked (other)', async () => {
@@ -803,7 +756,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 			render(
 				<CheckboxFilterV2
 					filter={{ ...DEFAULT_FILTER, customRendererForValue: customRenderer }}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 			);

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/v2/__tests__/CheckboxFilterV2.itemRules.test.tsx

@@ -5,7 +5,6 @@ import { QuickFiltersSource } from '../../../../types';
 
 import CheckboxFilterV2 from '../CheckboxFilterV2';
 import {
-	buildQueryBuilderOverrides,
 	DEFAULT_FILTER,
 	DEFAULT_USE_FIELD_APIS,
 	mockFieldsValuesAPI,
@@ -15,88 +14,6 @@ import {
 setupServer();
 
 describe('CheckboxFilterV2 - item rules', () => {
-	describe('related values unsupported (existingQuery: null)', () => {
-		it('renders a single flat section even when the api returns related values', async () => {
-			mockFieldsValuesAPI({
-				relatedValues: ['production'],
-				stringValues: ['staging'],
-			});
-
-			render(
-				<CheckboxFilterV2
-					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
-					useFieldApis={DEFAULT_USE_FIELD_APIS}
-				/>,
-			);
-
-			const productionRow = await screen.findByTestId(
-				'checkbox-value-row-production',
-			);
-			expect(productionRow).toHaveAttribute('data-state', 'checked');
-			expect(screen.getByTestId('checkbox-value-row-staging')).toHaveAttribute(
-				'data-state',
-				'checked',
-			);
-
-			expect(
-				screen.queryByTestId('section-divider-related'),
-			).not.toBeInTheDocument();
-			expect(
-				screen.queryByTestId('section-divider-all-values'),
-			).not.toBeInTheDocument();
-		});
-
-		it('splits clause values and the rest into selected and all values sections', async () => {
-			mockFieldsValuesAPI({
-				stringValues: ['production', 'staging'],
-			});
-
-			render(
-				<CheckboxFilterV2
-					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
-					useFieldApis={DEFAULT_USE_FIELD_APIS}
-				/>,
-				undefined,
-				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: {
-										items: [
-											{
-												key: { key: 'deployment.environment' },
-												op: 'in',
-												value: ['production'],
-											},
-										],
-										op: 'AND',
-									},
-								},
-							],
-						},
-					}),
-				},
-			);
-
-			const productionRow = await screen.findByTestId(
-				'checkbox-value-row-production',
-			);
-			expect(productionRow).toHaveAttribute('data-state', 'checked');
-			expect(screen.getByTestId('checkbox-value-row-staging')).toHaveAttribute(
-				'data-state',
-				'unchecked',
-			);
-
-			expect(screen.getByTestId('section-divider-all-values')).toBeInTheDocument();
-			expect(
-				screen.queryByTestId('section-divider-related'),
-			).not.toBeInTheDocument();
-		});
-	});
-
 	describe('no existing query', () => {
 		it('all values show as checked with no badge when no query exists', async () => {
 			mockFieldsValuesAPI({
@@ -106,7 +23,7 @@ describe('CheckboxFilterV2 - item rules', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 			);
@@ -140,7 +57,7 @@ describe('CheckboxFilterV2 - item rules', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={{
 						...DEFAULT_USE_FIELD_APIS,
 						existingQuery: 'service.name = "api"',
@@ -148,16 +65,18 @@ describe('CheckboxFilterV2 - item rules', () => {
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: { items: [], op: 'AND' },
-									filter: { expression: 'service.name = "api"' },
-								},
-							],
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: { items: [], op: 'AND' },
+										filter: { expression: 'service.name = "api"' },
+									},
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 
@@ -185,7 +104,7 @@ describe('CheckboxFilterV2 - item rules', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={{
 						...DEFAULT_USE_FIELD_APIS,
 						existingQuery: 'service.name = "api"',
@@ -193,16 +112,18 @@ describe('CheckboxFilterV2 - item rules', () => {
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: { items: [], op: 'AND' },
-									filter: { expression: 'service.name = "api"' },
-								},
-							],
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: { items: [], op: 'AND' },
+										filter: { expression: 'service.name = "api"' },
+									},
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 
@@ -221,7 +142,7 @@ describe('CheckboxFilterV2 - item rules', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={{
 						...DEFAULT_USE_FIELD_APIS,
 						existingQuery: 'service.name = "api"',
@@ -229,25 +150,27 @@ describe('CheckboxFilterV2 - item rules', () => {
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: {
-										items: [
-											{
-												key: { key: 'deployment.environment' },
-												op: 'in',
-												value: ['production'],
-											},
-										],
-										op: 'AND',
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: {
+											items: [
+												{
+													key: { key: 'deployment.environment' },
+													op: 'in',
+													value: ['production'],
+												},
+											],
+											op: 'AND',
+										},
+										filter: { expression: 'service.name = "api"' },
 									},
-									filter: { expression: 'service.name = "api"' },
-								},
-							],
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 
@@ -273,29 +196,31 @@ describe('CheckboxFilterV2 - item rules', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: {
-										items: [
-											{
-												key: { key: 'deployment.environment' },
-												op: 'in',
-												value: ['production'],
-											},
-										],
-										op: 'AND',
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: {
+											items: [
+												{
+													key: { key: 'deployment.environment' },
+													op: 'in',
+													value: ['production'],
+												},
+											],
+											op: 'AND',
+										},
 									},
-								},
-							],
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 
@@ -321,33 +246,34 @@ describe('CheckboxFilterV2 - item rules', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: {
-										items: [
-											{
-												key: { key: 'deployment.environment' },
-												op: 'not in',
-												value: ['production'],
-											},
-										],
-										op: 'AND',
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: {
+											items: [
+												{
+													key: { key: 'deployment.environment' },
+													op: 'not in',
+													value: ['production'],
+												},
+											],
+											op: 'AND',
+										},
 									},
-								},
-							],
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 
-			// The excluded value renders unchecked.
 			const productionRow = await screen.findByTestId(
 				'checkbox-value-row-production',
 			);
@@ -356,9 +282,8 @@ describe('CheckboxFilterV2 - item rules', () => {
 				within(productionRow).queryByTestId(/^badge-/),
 			).not.toBeInTheDocument();
 
-			// The non-excluded value is still included by NOT IN, so it stays checked.
 			const stagingRow = screen.getByTestId('checkbox-value-row-staging');
-			expect(stagingRow).toHaveAttribute('data-state', 'checked');
+			expect(stagingRow).toHaveAttribute('data-state', 'unchecked');
 			expect(within(stagingRow).queryByTestId(/^badge-/)).not.toBeInTheDocument();
 		});
 	});
@@ -373,7 +298,7 @@ describe('CheckboxFilterV2 - item rules', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={{
 						...DEFAULT_USE_FIELD_APIS,
 						existingQuery: 'service.name = "api"',
@@ -381,25 +306,27 @@ describe('CheckboxFilterV2 - item rules', () => {
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: {
-										items: [
-											{
-												key: { key: 'deployment.environment' },
-												op: 'in',
-												value: ['selected-value'],
-											},
-										],
-										op: 'AND',
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: {
+											items: [
+												{
+													key: { key: 'deployment.environment' },
+													op: 'in',
+													value: ['selected-value'],
+												},
+											],
+											op: 'AND',
+										},
+										filter: { expression: 'service.name = "api"' },
 									},
-									filter: { expression: 'service.name = "api"' },
-								},
-							],
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 
@@ -424,7 +351,7 @@ describe('CheckboxFilterV2 - item rules', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={{
 						...DEFAULT_USE_FIELD_APIS,
 						existingQuery: 'service.name = "api"',
@@ -432,16 +359,18 @@ describe('CheckboxFilterV2 - item rules', () => {
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: { items: [], op: 'AND' },
-									filter: { expression: 'service.name = "api"' },
-								},
-							],
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: { items: [], op: 'AND' },
+										filter: { expression: 'service.name = "api"' },
+									},
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 
@@ -466,7 +395,7 @@ describe('CheckboxFilterV2 - item rules', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={{
 						...DEFAULT_USE_FIELD_APIS,
 						existingQuery: 'service.name = "api"',
@@ -474,25 +403,27 @@ describe('CheckboxFilterV2 - item rules', () => {
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: {
-										items: [
-											{
-												key: { key: 'deployment.environment' },
-												op: 'in',
-												value: ['selected-env'],
-											},
-										],
-										op: 'AND',
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: {
+											items: [
+												{
+													key: { key: 'deployment.environment' },
+													op: 'in',
+													value: ['selected-env'],
+												},
+											],
+											op: 'AND',
+										},
+										filter: { expression: 'service.name = "api"' },
 									},
-									filter: { expression: 'service.name = "api"' },
-								},
-							],
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 
@@ -521,7 +452,7 @@ describe('CheckboxFilterV2 - item rules', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={{
 						...DEFAULT_USE_FIELD_APIS,
 						existingQuery: 'service.name = "api"',
@@ -529,25 +460,27 @@ describe('CheckboxFilterV2 - item rules', () => {
 				/>,
 				undefined,
 				{
-					queryBuilderOverrides: buildQueryBuilderOverrides({
-						builder: {
-							queryData: [
-								{
-									filters: {
-										items: [
-											{
-												key: { key: 'deployment.environment' },
-												op: 'not in',
-												value: ['excluded-env'],
-											},
-										],
-										op: 'AND',
+					queryBuilderOverrides: {
+						currentQuery: {
+							builder: {
+								queryData: [
+									{
+										filters: {
+											items: [
+												{
+													key: { key: 'deployment.environment' },
+													op: 'not in',
+													value: ['excluded-env'],
+												},
+											],
+											op: 'AND',
+										},
+										filter: { expression: 'service.name = "api"' },
 									},
-									filter: { expression: 'service.name = "api"' },
-								},
-							],
+								],
+							},
 						},
-					}),
+					} as never,
 				},
 			);
 

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/v2/__tests__/CheckboxFilterV2.states.test.tsx

@@ -24,7 +24,7 @@ describe('CheckboxFilterV2 - states', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 			);
@@ -46,7 +46,7 @@ describe('CheckboxFilterV2 - states', () => {
 			render(
 				<CheckboxFilterV2
 					filter={closedFilter}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 			);
@@ -103,7 +103,7 @@ describe('CheckboxFilterV2 - states', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 			);
@@ -132,7 +132,7 @@ describe('CheckboxFilterV2 - states', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 			);
@@ -151,7 +151,7 @@ describe('CheckboxFilterV2 - states', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 			);
@@ -171,7 +171,7 @@ describe('CheckboxFilterV2 - states', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 			);
@@ -194,7 +194,7 @@ describe('CheckboxFilterV2 - states', () => {
 			render(
 				<CheckboxFilterV2
 					filter={DEFAULT_FILTER}
-					pageSource={QuickFiltersSource.TRACES_EXPLORER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
 					useFieldApis={DEFAULT_USE_FIELD_APIS}
 				/>,
 			);

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/v2/__tests__/itemRules.test.ts

@@ -8,7 +8,6 @@ describe('itemRules', () => {
 				isInRelatedValues: true,
 				isNotInOperator: false,
 				hasExistingQuery: false,
-				isRelatedValuesSupported: true,
 				hasFilterForThisKey: false,
 			};
 
@@ -24,7 +23,6 @@ describe('itemRules', () => {
 				isInRelatedValues: true,
 				isNotInOperator: false,
 				hasExistingQuery: true,
-				isRelatedValuesSupported: true,
 				hasFilterForThisKey: true,
 			};
 
@@ -40,7 +38,6 @@ describe('itemRules', () => {
 				isInRelatedValues: false,
 				isNotInOperator: true,
 				hasExistingQuery: true,
-				isRelatedValuesSupported: true,
 				hasFilterForThisKey: true,
 			};
 
@@ -51,46 +48,12 @@ describe('itemRules', () => {
 			expect(result.checkedState).toBe('unchecked');
 		});
 
-		it('NOT IN filter, value not excluded, not related → all_values, checked', () => {
-			const ctx: ItemContext = {
-				isSelectedOnFilter: false,
-				isInRelatedValues: false,
-				isNotInOperator: true,
-				hasExistingQuery: true,
-				isRelatedValuesSupported: true,
-				hasFilterForThisKey: true,
-			};
-
-			const result = deriveItemConfig(ctx);
-
-			expect(result.section).toBe(SectionType.ALL_VALUES);
-			expect(result.badge).toBeNull();
-			expect(result.checkedState).toBe('checked');
-		});
-
-		it('NOT IN filter, value not excluded but related → related wins, checked', () => {
-			const ctx: ItemContext = {
-				isSelectedOnFilter: false,
-				isInRelatedValues: true,
-				isNotInOperator: true,
-				hasExistingQuery: true,
-				isRelatedValuesSupported: true,
-				hasFilterForThisKey: true,
-			};
-
-			const result = deriveItemConfig(ctx);
-
-			expect(result.section).toBe(SectionType.RELATED);
-			expect(result.checkedState).toBe('checked');
-		});
-
 		it('has query, not selected, in related → section related, checked', () => {
 			const ctx: ItemContext = {
 				isSelectedOnFilter: false,
 				isInRelatedValues: true,
 				isNotInOperator: false,
 				hasExistingQuery: true,
-				isRelatedValuesSupported: true,
 				hasFilterForThisKey: false,
 			};
 
@@ -107,7 +70,6 @@ describe('itemRules', () => {
 				isInRelatedValues: true,
 				isNotInOperator: false,
 				hasExistingQuery: true,
-				isRelatedValuesSupported: true,
 				hasFilterForThisKey: true,
 			};
 
@@ -124,7 +86,6 @@ describe('itemRules', () => {
 				isInRelatedValues: false,
 				isNotInOperator: false,
 				hasExistingQuery: true,
-				isRelatedValuesSupported: true,
 				hasFilterForThisKey: false,
 			};
 
@@ -141,7 +102,6 @@ describe('itemRules', () => {
 				isInRelatedValues: false,
 				isNotInOperator: false,
 				hasExistingQuery: true,
-				isRelatedValuesSupported: true,
 				hasFilterForThisKey: true,
 			};
 
@@ -158,7 +118,6 @@ describe('itemRules', () => {
 				isInRelatedValues: false,
 				isNotInOperator: false,
 				hasExistingQuery: false,
-				isRelatedValuesSupported: true,
 				hasFilterForThisKey: true,
 			};
 
@@ -169,70 +128,4 @@ describe('itemRules', () => {
 			expect(result.checkedState).toBe('checked');
 		});
 	});
-
-	describe('deriveItemConfig with related values unsupported', () => {
-		const baseCtx: Omit<ItemContext, 'isSelectedOnFilter' | 'isNotInOperator'> = {
-			isInRelatedValues: false,
-			hasExistingQuery: true,
-			hasFilterForThisKey: true,
-			isRelatedValuesSupported: false,
-		};
-
-		it('no filter on this key → selected, checked, even with an existing query', () => {
-			const result = deriveItemConfig({
-				...baseCtx,
-				hasFilterForThisKey: false,
-				isSelectedOnFilter: false,
-				isNotInOperator: false,
-			});
-
-			expect(result.section).toBe(SectionType.SELECTED);
-			expect(result.checkedState).toBe('checked');
-		});
-
-		it('excluded by NOT IN → selected, unchecked', () => {
-			const result = deriveItemConfig({
-				...baseCtx,
-				isSelectedOnFilter: true,
-				isNotInOperator: true,
-			});
-
-			expect(result.section).toBe(SectionType.SELECTED);
-			expect(result.checkedState).toBe('unchecked');
-		});
-
-		it('selected by IN → selected, checked', () => {
-			const result = deriveItemConfig({
-				...baseCtx,
-				isSelectedOnFilter: true,
-				isNotInOperator: false,
-			});
-
-			expect(result.section).toBe(SectionType.SELECTED);
-			expect(result.checkedState).toBe('checked');
-		});
-
-		it('NOT IN complement → all_values, checked, related values ignored', () => {
-			const result = deriveItemConfig({
-				...baseCtx,
-				isSelectedOnFilter: false,
-				isNotInOperator: true,
-			});
-
-			expect(result.section).toBe(SectionType.ALL_VALUES);
-			expect(result.checkedState).toBe('checked');
-		});
-
-		it('IN complement → all_values, unchecked, never related', () => {
-			const result = deriveItemConfig({
-				...baseCtx,
-				isInRelatedValues: true,
-				isSelectedOnFilter: false,
-				isNotInOperator: false,
-			});
-
-			expect(result.section).toBe(SectionType.ALL_VALUES);
-			expect(result.checkedState).toBe('unchecked');
-		});
-	});
 });

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/v2/__tests__/useSectionedValues.test.ts

@@ -17,7 +17,6 @@ describe('useSectionedValues', () => {
 		isSomeFilterPresentForCurrentAttribute: false,
 		isNotInOperator: false,
 		hasExistingQuery: false,
-		isRelatedValuesSupported: true,
 		visibleItemsCount: 10,
 		relatedExclusions: [] as string[],
 	};
@@ -27,7 +26,6 @@ describe('useSectionedValues', () => {
 			useSectionedValues({
 				...baseInput,
 				hasExistingQuery: false,
-				isRelatedValuesSupported: true,
 				isSomeFilterPresentForCurrentAttribute: false,
 			}),
 		);
@@ -45,7 +43,6 @@ describe('useSectionedValues', () => {
 			useSectionedValues({
 				...baseInput,
 				hasExistingQuery: true,
-				isRelatedValuesSupported: true,
 				isSomeFilterPresentForCurrentAttribute: false,
 			}),
 		);
@@ -74,7 +71,6 @@ describe('useSectionedValues', () => {
 			useSectionedValues({
 				...baseInput,
 				hasExistingQuery: true,
-				isRelatedValuesSupported: true,
 				isSomeFilterPresentForCurrentAttribute: true,
 				currentFilterState: { val1: true, val2: false, val3: false },
 			}),
@@ -92,7 +88,6 @@ describe('useSectionedValues', () => {
 			useSectionedValues({
 				...baseInput,
 				hasExistingQuery: true,
-				isRelatedValuesSupported: true,
 				isSomeFilterPresentForCurrentAttribute: true,
 				isNotInOperator: true,
 				currentFilterState: { val1: false, val2: true, val3: true },
@@ -115,7 +110,6 @@ describe('useSectionedValues', () => {
 				relatedValues: ['zebra', 'apple', 'mango'],
 				allValues: ['zebra', 'apple', 'mango'],
 				hasExistingQuery: false,
-				isRelatedValuesSupported: true,
 				isSomeFilterPresentForCurrentAttribute: false,
 			}),
 		);
@@ -132,7 +126,6 @@ describe('useSectionedValues', () => {
 				useSectionedValues({
 					...baseInput,
 					hasExistingQuery: true,
-					isRelatedValuesSupported: true,
 					isSomeFilterPresentForCurrentAttribute: true,
 					currentFilterState: { val1: true },
 				}),
@@ -150,7 +143,6 @@ describe('useSectionedValues', () => {
 					relatedValues: [],
 					allValues: [],
 					hasExistingQuery: true,
-					isRelatedValuesSupported: true,
 					isSomeFilterPresentForCurrentAttribute: false,
 					currentFilterState: {},
 				}),
@@ -167,7 +159,6 @@ describe('useSectionedValues', () => {
 					relatedValues: [],
 					allValues: ['other1', 'other2', 'other3'],
 					hasExistingQuery: true,
-					isRelatedValuesSupported: true,
 					isSomeFilterPresentForCurrentAttribute: false,
 				}),
 			);
@@ -187,7 +178,6 @@ describe('useSectionedValues', () => {
 					relatedValues: ['pod-a-1', 'pod-b-1', 'pod-c-1'],
 					allValues: ['pod-a-2', 'pod-b-2', 'pod-c-2'],
 					hasExistingQuery: true,
-					isRelatedValuesSupported: true,
 					isSomeFilterPresentForCurrentAttribute: false,
 				}),
 			);
@@ -228,7 +218,6 @@ describe('useSectionedValues', () => {
 					currentFilterState: { newValue: true },
 					isSomeFilterPresentForCurrentAttribute: true,
 					hasExistingQuery: true,
-					isRelatedValuesSupported: true,
 					// stale API data kept via keepPreviousData
 					relatedValues: ['oldSelected', 'otherRelated'],
 					allValues: ['newValue'],
@@ -257,7 +246,6 @@ describe('useSectionedValues', () => {
 					currentFilterState: { newValue: true },
 					isSomeFilterPresentForCurrentAttribute: true,
 					hasExistingQuery: true,
-					isRelatedValuesSupported: true,
 					// oldSelected was just de-selected; the rest are genuinely related
 					relatedValues: ['oldSelected', 'relatedA', 'relatedB', 'relatedC'],
 					allValues: ['newValue'],
@@ -287,7 +275,6 @@ describe('useSectionedValues', () => {
 					currentFilterState: { newValue: true },
 					isSomeFilterPresentForCurrentAttribute: true,
 					hasExistingQuery: true,
-					isRelatedValuesSupported: true,
 					relatedValues: ['oldSelected', 'otherRelated'],
 					allValues: ['newValue'],
 					relatedExclusions: ['oldSelected'],
@@ -306,7 +293,6 @@ describe('useSectionedValues', () => {
 					currentFilterState: { newValue: true },
 					isSomeFilterPresentForCurrentAttribute: true,
 					hasExistingQuery: true,
-					isRelatedValuesSupported: true,
 					relatedValues: ['oldSelected', 'otherRelated'],
 					allValues: ['newValue'],
 					relatedExclusions: [],
@@ -328,7 +314,6 @@ describe('useSectionedValues', () => {
 					relatedValues: ['related1'],
 					allValues: ['all1'],
 					hasExistingQuery: true,
-					isRelatedValuesSupported: true,
 					isSomeFilterPresentForCurrentAttribute: true,
 					currentFilterState: { selected1: true },
 				}),
@@ -352,7 +337,6 @@ describe('useSectionedValues', () => {
 					relatedValues: ['r1', 'r2', 'r3', 'r4', 'r5'],
 					allValues: ['a1', 'a2', 'a3', 'a4', 'a5'],
 					hasExistingQuery: true,
-					isRelatedValuesSupported: true,
 					isSomeFilterPresentForCurrentAttribute: false,
 					visibleItemsCount: 100,
 				}),
@@ -371,7 +355,6 @@ describe('useSectionedValues', () => {
 					relatedValues: ['r1', 'r2', 'r3'],
 					allValues: ['a1', 'a2', 'a3'],
 					hasExistingQuery: true,
-					isRelatedValuesSupported: true,
 					isSomeFilterPresentForCurrentAttribute: false,
 					visibleItemsCount: 4,
 				}),

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/v2/itemRules.ts

@@ -24,7 +24,6 @@ export interface ItemContext {
 	isNotInOperator: boolean;
 	hasExistingQuery: boolean;
 	hasFilterForThisKey: boolean;
-	isRelatedValuesSupported: boolean;
 }
 
 export interface DerivedItem extends ItemConfig {
@@ -36,7 +35,7 @@ interface ItemRule {
 	config: ItemConfig;
 }
 
-const RELATED_SUPPORTED_RULES: ItemRule[] = [
+const ITEM_RULES: ItemRule[] = [
 	// No existing query and no filter → all checked (selected section)
 	{
 		condition: (ctx): boolean =>
@@ -74,16 +73,6 @@ const RELATED_SUPPORTED_RULES: ItemRule[] = [
 			checkedState: 'checked',
 		},
 	},
-	// filterKey present in query with NOT IN and value not in the list → checked
-	{
-		condition: (ctx): boolean =>
-			ctx.hasFilterForThisKey && ctx.isNotInOperator && !ctx.isSelectedOnFilter,
-		config: {
-			section: SectionType.ALL_VALUES,
-			badge: null,
-			checkedState: 'checked',
-		},
-	},
 	// All values (has existing query but not related) → unchecked
 	{
 		condition: (ctx): boolean => ctx.hasExistingQuery,
@@ -95,54 +84,6 @@ const RELATED_SUPPORTED_RULES: ItemRule[] = [
 	},
 ];
 
-const RELATED_UNSUPPORTED_RULES: ItemRule[] = [
-	// No filter on this key → included by default
-	{
-		condition: (ctx): boolean => !ctx.hasFilterForThisKey,
-		config: {
-			section: SectionType.SELECTED,
-			badge: null,
-			checkedState: 'checked',
-		},
-	},
-	// Explicitly excluded by NOT IN
-	{
-		condition: (ctx): boolean => ctx.isSelectedOnFilter && ctx.isNotInOperator,
-		config: {
-			section: SectionType.SELECTED,
-			badge: null,
-			checkedState: 'unchecked',
-		},
-	},
-	// Explicitly selected by IN
-	{
-		condition: (ctx): boolean => ctx.isSelectedOnFilter && !ctx.isNotInOperator,
-		config: {
-			section: SectionType.SELECTED,
-			badge: null,
-			checkedState: 'checked',
-		},
-	},
-	// Not listed in the key's NOT IN clause → not excluded, still in results
-	{
-		condition: (ctx): boolean => ctx.isNotInOperator,
-		config: {
-			section: SectionType.ALL_VALUES,
-			badge: null,
-			checkedState: 'checked',
-		},
-	},
-	// Not listed in the key's IN clause → filtered out of results
-	{
-		condition: (): boolean => true,
-		config: {
-			section: SectionType.ALL_VALUES,
-			badge: null,
-			checkedState: 'unchecked',
-		},
-	},
-];
-
 // Fallback when no rule matches
 const DEFAULT_CONFIG: ItemConfig = {
 	section: SectionType.SELECTED,
@@ -151,10 +92,7 @@ const DEFAULT_CONFIG: ItemConfig = {
 };
 
 export function deriveItemConfig(ctx: ItemContext): ItemConfig {
-	const rules = ctx.isRelatedValuesSupported
-		? RELATED_SUPPORTED_RULES
-		: RELATED_UNSUPPORTED_RULES;
-	for (const rule of rules) {
+	for (const rule of ITEM_RULES) {
 		if (rule.condition(ctx)) {
 			return rule.config;
 		}

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/v2/useExistingQuery.tsx

@@ -17,7 +17,7 @@ export function useExistingQuery({
 	useFieldApis,
 	activeQueryIndex,
 }: UseExistingQueryParams): UseExistingQueryResult {
-	const { stagedQuery } = useQueryBuilder();
+	const { currentQuery } = useQueryBuilder();
 
 	const existingQuery = useMemo(() => {
 		if (useFieldApis.existingQuery === null) {
@@ -28,7 +28,7 @@ export function useExistingQuery({
 			return useFieldApis.existingQuery;
 		}
 
-		const queryData = stagedQuery?.builder.queryData?.[activeQueryIndex];
+		const queryData = currentQuery.builder.queryData?.[activeQueryIndex];
 
 		// Prefer V5 filter.expression
 		if (queryData?.filter?.expression) {
@@ -43,7 +43,7 @@ export function useExistingQuery({
 		return undefined;
 	}, [
 		useFieldApis.existingQuery,
-		stagedQuery?.builder.queryData,
+		currentQuery.builder.queryData,
 		activeQueryIndex,
 	]);
 
@@ -51,11 +51,11 @@ export function useExistingQuery({
 	// This is separate from existingQuery because existingQuery can be explicitly
 	// disabled (null) while filters still exist in the query for UI purposes
 	const hasExistingQuery = useMemo(() => {
-		const queryData = stagedQuery?.builder.queryData?.[activeQueryIndex];
+		const queryData = currentQuery.builder.queryData?.[activeQueryIndex];
 		const hasV3Items = (queryData?.filters?.items?.length ?? 0) > 0;
 		const hasV5Expression = !!queryData?.filter?.expression;
 		return hasV3Items || hasV5Expression || !!existingQuery;
-	}, [stagedQuery?.builder.queryData, activeQueryIndex, existingQuery]);
+	}, [currentQuery.builder.queryData, activeQueryIndex, existingQuery]);
 
 	return { existingQuery, hasExistingQuery };
 }

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/v2/useFieldValues.tsx

@@ -1,10 +1,8 @@
 import { useMemo } from 'react';
 import { useGetFieldsValues } from 'api/generated/services/fields';
-import {
-	TelemetrytypesSignalDTO,
-	TelemetrytypesSourceDTO,
-} from 'api/generated/services/sigNoz.schemas';
+import { TelemetrytypesSignalDTO } from 'api/generated/services/sigNoz.schemas';
 import { IQuickFiltersConfig } from 'components/QuickFilters/types';
+import { DataSource } from 'types/common/queryBuilder';
 import { FIELD_API_CACHE_TIME } from 'constants/queryCacheTime';
 
 interface UseFieldValuesProps {
@@ -12,8 +10,6 @@ interface UseFieldValuesProps {
 	searchText: string;
 	existingQuery?: string;
 	metricNamespace?: string;
-	signal?: TelemetrytypesSignalDTO;
-	source?: TelemetrytypesSourceDTO;
 	startUnixMilli?: number;
 	endUnixMilli?: number;
 	enabled: boolean;
@@ -26,25 +22,33 @@ interface UseFieldValuesReturn {
 	isFetching: boolean;
 }
 
+export const DATA_SOURCE_TO_SIGNAL: Record<
+	DataSource,
+	TelemetrytypesSignalDTO
+> = {
+	[DataSource.METRICS]: TelemetrytypesSignalDTO.metrics,
+	[DataSource.TRACES]: TelemetrytypesSignalDTO.traces,
+	[DataSource.LOGS]: TelemetrytypesSignalDTO.logs,
+};
+
 export function useFieldValues({
 	filter,
 	searchText,
 	existingQuery,
 	metricNamespace,
-	signal,
-	source,
 	startUnixMilli,
 	endUnixMilli,
 	enabled,
 }: UseFieldValuesProps): UseFieldValuesReturn {
 	const { data, isLoading, isFetching } = useGetFieldsValues(
 		{
-			signal,
+			signal: filter.dataSource
+				? DATA_SOURCE_TO_SIGNAL[filter.dataSource]
+				: undefined,
 			name: filter.attributeKey.key,
 			searchText,
 			existingQuery,
 			metricNamespace,
-			source,
 			startUnixMilli,
 			// This field does not affect the backend but I wanted to keep it here
 			// in case we add the support in the future

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/v2/useSectionedValues.ts

@@ -10,7 +10,6 @@ interface SectionedValuesInput {
 	isSomeFilterPresentForCurrentAttribute: boolean;
 	isNotInOperator: boolean;
 	hasExistingQuery: boolean;
-	isRelatedValuesSupported: boolean;
 	visibleItemsCount: number;
 	relatedExclusions: string[];
 }
@@ -66,7 +65,6 @@ export function useSectionedValues({
 	isSomeFilterPresentForCurrentAttribute,
 	isNotInOperator,
 	hasExistingQuery,
-	isRelatedValuesSupported,
 	visibleItemsCount,
 	relatedExclusions,
 }: SectionedValuesInput): SectionedValuesOutput {
@@ -97,7 +95,6 @@ export function useSectionedValues({
 			isNotInOperator,
 			hasExistingQuery,
 			hasFilterForThisKey: isSomeFilterPresentForCurrentAttribute,
-			isRelatedValuesSupported,
 		});
 	}, [
 		relatedValues,
@@ -106,7 +103,6 @@ export function useSectionedValues({
 		isSomeFilterPresentForCurrentAttribute,
 		isNotInOperator,
 		hasExistingQuery,
-		isRelatedValuesSupported,
 		relatedExclusions,
 	]);
 

frontend/src/components/QuickFilters/QuickFilters.tsx

@@ -47,10 +47,10 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 		className,
 		config,
 		handleFilterVisibilityChange,
-		pageSource,
+		source,
 		onFilterChange,
 		onQuickFilterChange,
-		quickFilterSignal,
+		signal,
 		showFilterCollapse = true,
 		showQueryName = true,
 		useFieldApis,
@@ -67,7 +67,7 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 		customFilters,
 		refetchCustomFilters,
 		isCustomFiltersLoading,
-	} = useFilterConfig({ signal: quickFilterSignal, config });
+	} = useFilterConfig({ signal, config });
 
 	const {
 		currentQuery,
@@ -105,7 +105,7 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 
 	// Show dropdown in ListView only for TRACES_EXPLORER source
 	const shouldShowDropdownInListView =
-		isListView && pageSource === QuickFiltersSource.TRACES_EXPLORER;
+		isListView && source === QuickFiltersSource.TRACES_EXPLORER;
 
 	const showAnnouncementTooltip = useMemo(() => {
 		const localStorageValue = getLocalStorageKey(
@@ -119,12 +119,12 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 
 	const activeQueryIndex = useMemo(() => {
 		if (isListView) {
-			return pageSource === QuickFiltersSource.TRACES_EXPLORER
+			return source === QuickFiltersSource.TRACES_EXPLORER
 				? lastUsedQuery || 0
 				: 0;
 		}
 		return lastUsedQuery || 0;
-	}, [isListView, pageSource, lastUsedQuery]);
+	}, [isListView, source, lastUsedQuery]);
 
 	// clear all the filters for the query which is in sync with filters
 	const handleReset = (): void => {
@@ -281,7 +281,7 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 
 	const renderContent = (): JSX.Element => (
 		<>
-			{pageSource === QuickFiltersSource.API_MONITORING && (
+			{source === QuickFiltersSource.API_MONITORING && (
 				<div className="api-quick-filters-header">
 					<Typography.Text>Show IP addresses</Typography.Text>
 					<Switch
@@ -303,7 +303,7 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 							return useFieldApis ? (
 								<CheckboxV2
 									key={filter.attributeKey.key}
-									pageSource={pageSource}
+									source={source}
 									filter={filter}
 									onFilterChange={onFilterChange}
 									onQuickFilterChange={onQuickFilterChange}
@@ -312,7 +312,7 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 							) : (
 								<Checkbox
 									key={filter.attributeKey.key}
-									pageSource={pageSource}
+									source={source}
 									filter={filter}
 									onFilterChange={onFilterChange}
 									onQuickFilterChange={onQuickFilterChange}
@@ -333,7 +333,7 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 							return useFieldApis ? (
 								<CheckboxV2
 									key={filter.attributeKey.key}
-									pageSource={pageSource}
+									source={source}
 									filter={filter}
 									onFilterChange={onFilterChange}
 									onQuickFilterChange={onQuickFilterChange}
@@ -342,7 +342,7 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 							) : (
 								<Checkbox
 									key={filter.attributeKey.key}
-									pageSource={pageSource}
+									source={source}
 									filter={filter}
 									onFilterChange={onFilterChange}
 									onQuickFilterChange={onQuickFilterChange}
@@ -364,7 +364,7 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 	return (
 		<div className="quick-filters-container">
 			<div className="quick-filters">
-				{pageSource !== QuickFiltersSource.INFRA_MONITORING && (
+				{source !== QuickFiltersSource.INFRA_MONITORING && (
 					<section className="header">
 						{renderLeftActions()}
 						{renderRightActions()}
@@ -394,7 +394,7 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 				>
 					{isSettingsOpen && (
 						<QuickFiltersSettings
-							signal={quickFilterSignal}
+							signal={signal}
 							setIsSettingsOpen={setIsSettingsOpen}
 							customFilters={customFilters}
 							refetchCustomFilters={refetchCustomFilters}
@@ -408,7 +408,7 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 
 QuickFilters.defaultProps = {
 	onFilterChange: null,
-	quickFilterSignal: '',
+	signal: '',
 	config: [],
 	showFilterCollapse: true,
 	showQueryName: true,

frontend/src/components/QuickFilters/QuickFiltersSettings/OtherFilters.tsx

@@ -1,11 +1,10 @@
 import { useMemo } from 'react';
 import { Button, Skeleton } from 'antd';
 import { useGetFieldsKeys } from 'api/generated/services/fields';
-import {
-	TelemetrytypesSignalDTO,
-	TelemetrytypesSourceDTO,
-} from 'api/generated/services/sigNoz.schemas';
+import { TelemetrytypesSourceDTO } from 'api/generated/services/sigNoz.schemas';
 import OverlayScrollbar from 'components/OverlayScrollbar/OverlayScrollbar';
+import { DATA_SOURCE_TO_SIGNAL } from 'components/QuickFilters/FilterRenderers/Checkbox/v2/useFieldValues';
+import { SIGNAL_DATA_SOURCE_MAP } from 'components/QuickFilters/QuickFiltersSettings/constants';
 import { SignalType } from 'components/QuickFilters/types';
 import { buildCompositeKey } from 'container/OptionsMenu/utils';
 import {
@@ -14,14 +13,6 @@ import {
 	TelemetryFieldKey,
 } from 'types/api/v5/queryRange';
 
-const SIGNAL_TYPE_TO_SIGNAL: Record<SignalType, TelemetrytypesSignalDTO> = {
-	[SignalType.LOGS]: TelemetrytypesSignalDTO.logs,
-	[SignalType.TRACES]: TelemetrytypesSignalDTO.traces,
-	[SignalType.EXCEPTIONS]: TelemetrytypesSignalDTO.traces,
-	[SignalType.API_MONITORING]: TelemetrytypesSignalDTO.traces,
-	[SignalType.METER_EXPLORER]: TelemetrytypesSignalDTO.metrics,
-};
-
 function OtherFiltersSkeleton(): JSX.Element {
 	return (
 		<>
@@ -54,7 +45,9 @@ function OtherFilters({
 	const { data, isFetching } = useGetFieldsKeys(
 		{
 			searchText: inputValue,
-			signal: signal ? SIGNAL_TYPE_TO_SIGNAL[signal] : undefined,
+			signal: signal
+				? DATA_SOURCE_TO_SIGNAL[SIGNAL_DATA_SOURCE_MAP[signal]]
+				: undefined,
 			source: isMeterDataSource ? TelemetrytypesSourceDTO.meter : undefined,
 		},
 		{ query: { enabled: !!signal } },

frontend/src/components/QuickFilters/hooks/useSignalFieldApis.ts

@@ -1,32 +0,0 @@
-import { useMemo } from 'react';
-// eslint-disable-next-line no-restricted-imports
-import { useSelector } from 'react-redux';
-import {
-	TelemetrytypesSignalDTO,
-	TelemetrytypesSourceDTO,
-} from 'api/generated/services/sigNoz.schemas';
-import { NANO_SECOND_MULTIPLIER } from 'store/globalTime';
-import { AppState } from 'store/reducers';
-import { GlobalReducer } from 'types/reducer/globalTime';
-
-import { QuickFilterCheckboxUseFieldApis } from '../types';
-
-export function useSignalFieldApis(
-	signal: TelemetrytypesSignalDTO,
-	source?: TelemetrytypesSourceDTO,
-): QuickFilterCheckboxUseFieldApis {
-	const { minTime, maxTime } = useSelector<AppState, GlobalReducer>(
-		(state) => state.globalTime,
-	);
-
-	return useMemo(
-		() => ({
-			signal,
-			source,
-			startUnixMilli: Math.floor(minTime / NANO_SECOND_MULTIPLIER),
-			endUnixMilli: Math.floor(maxTime / NANO_SECOND_MULTIPLIER),
-			existingQuery: null,
-		}),
-		[signal, source, minTime, maxTime],
-	);
-}

frontend/src/components/QuickFilters/tests/QuickFilters.test.tsx

@@ -72,46 +72,46 @@ const setupServer = (): void => {
 };
 
 function TestQuickFilters({
-	quickFilterSignal = SignalType.LOGS,
+	signal = SignalType.LOGS,
 	config = QuickFiltersConfig,
 }: {
-	quickFilterSignal?: SignalType;
+	signal?: SignalType;
 	config?: IQuickFiltersConfig[];
 }): JSX.Element {
 	return (
 		<QuickFilters
-			pageSource={QuickFiltersSource.EXCEPTIONS}
+			source={QuickFiltersSource.EXCEPTIONS}
 			config={config}
 			handleFilterVisibilityChange={handleFilterVisibilityChange}
-			quickFilterSignal={quickFilterSignal}
+			signal={signal}
 		/>
 	);
 }
 
 TestQuickFilters.defaultProps = {
-	quickFilterSignal: '',
+	signal: '',
 	config: QuickFiltersConfig,
 };
 
 function TestQuickFiltersApiMonitoring({
-	quickFilterSignal = SignalType.LOGS,
+	signal = SignalType.LOGS,
 	config = QuickFiltersConfig,
 }: {
-	quickFilterSignal?: SignalType;
+	signal?: SignalType;
 	config?: IQuickFiltersConfig[];
 }): JSX.Element {
 	return (
 		<QuickFilters
-			pageSource={QuickFiltersSource.API_MONITORING}
+			source={QuickFiltersSource.API_MONITORING}
 			config={config}
 			handleFilterVisibilityChange={handleFilterVisibilityChange}
-			quickFilterSignal={quickFilterSignal}
+			signal={signal}
 		/>
 	);
 }
 
 TestQuickFiltersApiMonitoring.defaultProps = {
-	quickFilterSignal: '',
+	signal: '',
 	config: QuickFiltersConfig,
 };
 
@@ -310,7 +310,7 @@ describe('Quick Filters with custom filters', () => {
 	it('loads the custom filters correctly', async () => {
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
 
-		render(<TestQuickFilters quickFilterSignal={SIGNAL} />);
+		render(<TestQuickFilters signal={SIGNAL} />);
 
 		expect(screen.getByText('Filters for')).toBeInTheDocument();
 		expect(screen.getByText(QUERY_NAME)).toBeInTheDocument();
@@ -370,7 +370,7 @@ describe('Quick Filters with custom filters', () => {
 			),
 		);
 
-		render(<TestQuickFilters quickFilterSignal={SIGNAL} />);
+		render(<TestQuickFilters signal={SIGNAL} />);
 		await screen.findByText(FILTER_SERVICE_NAME);
 
 		const icon = await screen.findByTestId(SETTINGS_ICON_TEST_ID);
@@ -398,7 +398,7 @@ describe('Quick Filters with custom filters', () => {
 	it('adds a filter from OTHER FILTERS to ADDED FILTERS when clicked', async () => {
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
 
-		render(<TestQuickFilters quickFilterSignal={SIGNAL} />);
+		render(<TestQuickFilters signal={SIGNAL} />);
 		await screen.findByText(FILTER_SERVICE_NAME);
 
 		const icon = await screen.findByTestId(SETTINGS_ICON_TEST_ID);
@@ -419,7 +419,7 @@ describe('Quick Filters with custom filters', () => {
 	it('removes a filter from ADDED FILTERS and moves it to OTHER FILTERS', async () => {
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
 
-		render(<TestQuickFilters quickFilterSignal={SIGNAL} />);
+		render(<TestQuickFilters signal={SIGNAL} />);
 		await screen.findByText(FILTER_SERVICE_NAME);
 
 		const icon = await screen.findByTestId(SETTINGS_ICON_TEST_ID);
@@ -448,7 +448,7 @@ describe('Quick Filters with custom filters', () => {
 	it('restores original filter state on Discard', async () => {
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
 
-		render(<TestQuickFilters quickFilterSignal={SIGNAL} />);
+		render(<TestQuickFilters signal={SIGNAL} />);
 		await screen.findByText(FILTER_SERVICE_NAME);
 
 		const icon = await screen.findByTestId(SETTINGS_ICON_TEST_ID);
@@ -490,7 +490,7 @@ describe('Quick Filters with custom filters', () => {
 	it('saves the updated filters by calling PUT with correct payload', async () => {
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
 
-		render(<TestQuickFilters quickFilterSignal={SIGNAL} />);
+		render(<TestQuickFilters signal={SIGNAL} />);
 		await screen.findByText(FILTER_SERVICE_NAME);
 
 		const icon = await screen.findByTestId(SETTINGS_ICON_TEST_ID);
@@ -527,9 +527,7 @@ describe('Quick Filters with custom filters', () => {
 			pointerEventsCheck: 0,
 		});
 
-		const { getByTestId } = render(
-			<TestQuickFilters quickFilterSignal={SIGNAL} />,
-		);
+		const { getByTestId } = render(<TestQuickFilters signal={SIGNAL} />);
 		await screen.findByText(FILTER_SERVICE_NAME);
 		expect(screen.getByText('Duration')).toBeInTheDocument();
 
@@ -593,14 +591,14 @@ describe('Quick Filters refetch behavior', () => {
 			}),
 		);
 
-		const { unmount } = render(<TestQuickFilters quickFilterSignal={SIGNAL} />);
+		const { unmount } = render(<TestQuickFilters signal={SIGNAL} />);
 		await expect(
 			screen.findByText(FILTER_SERVICE_NAME),
 		).resolves.toBeInTheDocument();
 
 		unmount();
 
-		render(<TestQuickFilters quickFilterSignal={SIGNAL} />);
+		render(<TestQuickFilters signal={SIGNAL} />);
 		await expect(
 			screen.findByText(FILTER_SERVICE_NAME),
 		).resolves.toBeInTheDocument();
@@ -618,7 +616,7 @@ describe('Quick Filters refetch behavior', () => {
 			}),
 		);
 
-		render(<TestQuickFilters quickFilterSignal={undefined} />);
+		render(<TestQuickFilters signal={undefined} />);
 
 		await waitFor(() => expect(getCalls).toBe(0));
 	});
@@ -639,7 +637,7 @@ describe('Quick Filters refetch behavior', () => {
 		);
 
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
-		render(<TestQuickFilters quickFilterSignal={SIGNAL} />);
+		render(<TestQuickFilters signal={SIGNAL} />);
 
 		await expect(
 			screen.findByText(FILTER_SERVICE_NAME),
@@ -691,7 +689,7 @@ describe('Quick Filters refetch behavior', () => {
 		);
 
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
-		render(<TestQuickFilters quickFilterSignal={SIGNAL} />);
+		render(<TestQuickFilters signal={SIGNAL} />);
 
 		await expect(
 			screen.findByText(FILTER_SERVICE_NAME),
@@ -722,7 +720,7 @@ describe('Quick Filters refetch behavior', () => {
 			),
 		);
 
-		render(<TestQuickFilters quickFilterSignal={SIGNAL} config={[]} />);
+		render(<TestQuickFilters signal={SIGNAL} config={[]} />);
 
 		await expect(
 			screen.findByText('No filters found'),

frontend/src/components/QuickFilters/types.ts

@@ -1,7 +1,3 @@
-import {
-	TelemetrytypesSignalDTO,
-	TelemetrytypesSourceDTO,
-} from 'api/generated/services/sigNoz.schemas';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';
 import { DataSource } from 'types/common/queryBuilder';
@@ -55,10 +51,10 @@ export interface QuickFilterChangeEventData {
 export interface IQuickFiltersProps {
 	config: IQuickFiltersConfig[];
 	handleFilterVisibilityChange: () => void;
-	pageSource: QuickFiltersSource;
+	source: QuickFiltersSource;
 	onFilterChange?: (query: Query) => void;
 	onQuickFilterChange?: (data: QuickFilterChangeEventData) => void;
-	quickFilterSignal?: SignalType;
+	signal?: SignalType;
 	className?: string;
 	showFilterCollapse?: boolean;
 	showQueryName?: boolean;
@@ -78,9 +74,6 @@ export enum QuickFiltersSource {
  * Opt-in: fetch values from the /v1/fields/values API instead of /v3/autocomplete/attribute_values
  */
 export type QuickFilterCheckboxUseFieldApis = {
-	/** Telemetry signal and source sent to the fields APIs, declared by the page. */
-	signal?: TelemetrytypesSignalDTO;
-	source?: TelemetrytypesSourceDTO;
 	startUnixMilli: number;
 	endUnixMilli: number;
 	/**

frontend/src/constants/panelTypes.ts

@@ -31,6 +31,8 @@ export const getComponentForPanelType = (
 		[PANEL_TYPES.BAR]: Uplot,
 		[PANEL_TYPES.PIE]: null,
 		[PANEL_TYPES.HISTOGRAM]: Uplot,
+		// V2-only kind; it renders through the V2 panel registry.
+		[PANEL_TYPES.HEATMAP]: null,
 		[PANEL_TYPES.EMPTY_WIDGET]: null,
 	};
 

frontend/src/constants/queryBuilder.ts

@@ -32,7 +32,6 @@ import {
 	MeterAggregateOperator,
 	MetricAggregateOperator,
 	NumberOperators,
-	QueryAdditionalFilter,
 	QueryBuilderData,
 	ReduceOperators,
 	StringOperators,
@@ -104,43 +103,6 @@ export const metricsSpaceAggregationOperatorsByType = {
 	ExponentialHistogram: metricsHistogramSpaceAggregateOperatorOptions,
 };
 
-export const mapOfQueryFilters: Record<DataSource, QueryAdditionalFilter[]> = {
-	metrics: [
-		{ text: 'Aggregation interval', field: 'stepInterval' },
-		{ text: 'Having', field: 'having' },
-	],
-	logs: [
-		{ text: 'Order by', field: 'orderBy' },
-		{ text: 'Limit', field: 'limit' },
-		{ text: 'Having', field: 'having' },
-		{ text: 'Aggregation interval', field: 'stepInterval' },
-	],
-	traces: [
-		{ text: 'Order by', field: 'orderBy' },
-		{ text: 'Limit', field: 'limit' },
-		{ text: 'Having', field: 'having' },
-		{ text: 'Aggregation interval', field: 'stepInterval' },
-	],
-};
-
-const commonFormulaFilters: QueryAdditionalFilter[] = [
-	{
-		text: 'Having',
-		field: 'having',
-	},
-	{ text: 'Order by', field: 'orderBy' },
-	{ text: 'Limit', field: 'limit' },
-];
-
-export const mapOfFormulaToFilters: Record<
-	DataSource,
-	QueryAdditionalFilter[]
-> = {
-	metrics: commonFormulaFilters,
-	logs: commonFormulaFilters,
-	traces: commonFormulaFilters,
-};
-
 export const REDUCE_TO_VALUES: SelectOption<ReduceOperators, string>[] = [
 	{ value: ReduceOperators.LAST, label: 'Latest of values in timeframe' },
 	{ value: ReduceOperators.SUM, label: 'Sum of values in timeframe' },
@@ -376,6 +338,7 @@ export enum PANEL_TYPES {
 	BAR = 'bar',
 	PIE = 'pie',
 	HISTOGRAM = 'histogram',
+	HEATMAP = 'heatmap',
 	EMPTY_WIDGET = 'EMPTY_WIDGET',
 }
 
@@ -623,6 +586,7 @@ export const PANEL_TYPES_INITIAL_QUERY: Record<PANEL_TYPES, Query> = {
 	[PANEL_TYPES.BAR]: initialQueriesMap.metrics,
 	[PANEL_TYPES.PIE]: initialQueriesMap.metrics,
 	[PANEL_TYPES.HISTOGRAM]: initialQueriesMap.metrics,
+	[PANEL_TYPES.HEATMAP]: initialQueriesMap.metrics,
 	[PANEL_TYPES.EMPTY_WIDGET]: initialQueriesMap.metrics,
 };
 

frontend/src/constants/queryBuilderOperators.ts

@@ -527,6 +527,21 @@ export const metricsHistogramSpaceAggregateOperatorOptions: SelectOption<
 	},
 ];
 
+/**
+ * A heatmap's Y axis is the `le` labels themselves, so every percentile draws the grid a
+ * count already draws. Sum is also what the statement builder forces on a histogram
+ * heatmap whatever is asked for, so it is the only honest option to offer.
+ */
+export const metricsHeatmapHistogramSpaceAggregateOperatorOptions: SelectOption<
+	string,
+	string
+>[] = [
+	{
+		value: MetricAggregateOperator.COUNT,
+		label: 'Count',
+	},
+];
+
 export const metricsEmptyTimeAggregateOperatorOptions: SelectOption<
 	string,
 	string

frontend/src/container/ApiMonitoring/Explorer/Explorer.tsx

@@ -3,8 +3,6 @@ import * as Sentry from '@sentry/react';
 import logEvent from 'api/common/logEvent';
 import cx from 'classnames';
 import QuickFilters from 'components/QuickFilters/QuickFilters';
-import { TelemetrytypesSignalDTO } from 'api/generated/services/sigNoz.schemas';
-import { useSignalFieldApis } from 'components/QuickFilters/hooks/useSignalFieldApis';
 import { QuickFiltersSource, SignalType } from 'components/QuickFilters/types';
 import ErrorBoundaryFallback from 'pages/ErrorBoundaryFallback/ErrorBoundaryFallback';
 
@@ -13,10 +11,6 @@ import DomainList from './Domains/DomainList';
 import './Explorer.styles.scss';
 
 function Explorer(): JSX.Element {
-	const quickFilterFieldApis = useSignalFieldApis(
-		TelemetrytypesSignalDTO.traces,
-	);
-
 	useEffect(() => {
 		logEvent('API Monitoring: Landing page visited', {});
 	}, []);
@@ -27,12 +21,11 @@ function Explorer(): JSX.Element {
 				<section className="api-quick-filter-left-section">
 					<QuickFilters
 						className="qf-api-monitoring"
-						pageSource={QuickFiltersSource.API_MONITORING}
-						quickFilterSignal={SignalType.API_MONITORING}
+						source={QuickFiltersSource.API_MONITORING}
+						signal={SignalType.API_MONITORING}
 						showFilterCollapse={false}
 						showQueryName={false}
 						handleFilterVisibilityChange={(): void => {}}
-						useFieldApis={quickFilterFieldApis}
 					/>
 				</section>
 				<DomainList />

frontend/src/container/InfraMonitoringHostsV2/Hosts.tsx

@@ -1,4 +1,3 @@
-import { TelemetrytypesSignalDTO } from 'api/generated/services/sigNoz.schemas';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { Button, Tooltip } from 'antd';
 import { Typography } from '@signozhq/ui/typography';
@@ -244,11 +243,10 @@ function Hosts(): JSX.Element {
 										</Tooltip>
 									</div>
 									<QuickFilters
-										pageSource={QuickFiltersSource.INFRA_MONITORING}
+										source={QuickFiltersSource.INFRA_MONITORING}
 										config={getHostsQuickFiltersConfig()}
 										handleFilterVisibilityChange={handleFilterVisibilityChange}
 										useFieldApis={{
-											signal: TelemetrytypesSignalDTO.metrics,
 											metricNamespace:
 												METRIC_NAMESPACE_BY_ENTITY[InfraMonitoringEntity.HOSTS],
 											startUnixMilli,

frontend/src/container/InfraMonitoringK8sV2/InfraMonitoringK8s.tsx

@@ -1,4 +1,3 @@
-import { TelemetrytypesSignalDTO } from 'api/generated/services/sigNoz.schemas';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import * as Sentry from '@sentry/react';
 import { Button } from '@signozhq/ui/button';
@@ -90,7 +89,6 @@ export default function InfraMonitoringK8s(): JSX.Element {
 
 	const getUseFieldApis = useCallback(
 		(entity: InfraMonitoringEntity): QuickFilterCheckboxUseFieldApis => ({
-			signal: TelemetrytypesSignalDTO.metrics,
 			metricNamespace: METRIC_NAMESPACE_BY_ENTITY[entity],
 			startUnixMilli,
 			endUnixMilli,
@@ -321,7 +319,7 @@ export default function InfraMonitoringK8s(): JSX.Element {
 										</div>
 										{selectedCategoryConfig && (
 											<QuickFilters
-												pageSource={QuickFiltersSource.INFRA_MONITORING}
+												source={QuickFiltersSource.INFRA_MONITORING}
 												config={selectedCategoryConfig}
 												handleFilterVisibilityChange={handleFilterVisibilityChange}
 												useFieldApis={selectedCategoryUseFieldApis}

frontend/src/container/LLMObservability/Explorer/Explorer.tsx

@@ -260,8 +260,8 @@ function Explorer(): JSX.Element {
 				<Card className="filter" hidden={!isOpen}>
 					<QuickFilters
 						className="qf-traces-explorer"
-						pageSource={QuickFiltersSource.TRACES_EXPLORER}
-						quickFilterSignal={SignalType.TRACES}
+						source={QuickFiltersSource.TRACES_EXPLORER}
+						signal={SignalType.TRACES}
 						handleFilterVisibilityChange={(): void => {
 							setOpen(!isOpen);
 						}}

frontend/src/container/LLMObservability/Explorer/QuerySection/QuerySection.tsx

@@ -1,35 +1,23 @@
 import { memo, useMemo } from 'react';
 import { QueryBuilderV2 } from 'components/QueryBuilderV2/QueryBuilderV2';
 import { PANEL_TYPES } from 'constants/queryBuilder';
-import { QueryBuilderProps } from 'container/QueryBuilder/QueryBuilder.interfaces';
 import { useGetPanelTypesQueryParam } from 'hooks/queryBuilder/useGetPanelTypesQueryParam';
 import { DataSource } from 'types/common/queryBuilder';
 
 function QuerySection(): JSX.Element {
 	const panelTypes = useGetPanelTypesQueryParam(PANEL_TYPES.LIST);
 
-	// Only reaches the builder for timeseries/table; list/trace panels use QueryBuilderV2's listViewTracesFilterConfigs.
-	const filterConfigs: QueryBuilderProps['filterConfigs'] = useMemo(
-		() => ({
-			stepInterval: { isHidden: false, isDisabled: false },
-			limit: { isHidden: false, isDisabled: true },
-			having: { isHidden: false, isDisabled: true },
-		}),
-		[],
-	);
-
-	const isListViewPanel = useMemo(
+	const isRawQuery = useMemo(
 		() => panelTypes === PANEL_TYPES.LIST || panelTypes === PANEL_TYPES.TRACE,
 		[panelTypes],
 	);
 
 	return (
 		<QueryBuilderV2
-			isListViewPanel={isListViewPanel}
+			isRawQuery={isRawQuery}
 			config={{ initialDataSource: DataSource.TRACES, queryVariant: 'static' }}
 			panelType={panelTypes}
-			filterConfigs={filterConfigs}
-			showOnlyWhereClause={isListViewPanel}
+			showOnlyWhereClause={isRawQuery}
 			version="v3" // setting this to v3 as we this is rendered in logs explorer
 		/>
 	);

frontend/src/container/LogExplorerQuerySection/index.tsx

@@ -1,13 +1,6 @@
-import { memo, useCallback, useMemo } from 'react';
+import { memo, useMemo } from 'react';
 import { QueryBuilderV2 } from 'components/QueryBuilderV2/QueryBuilderV2';
-import {
-	initialQueriesMap,
-	OPERATORS,
-	PANEL_TYPES,
-} from 'constants/queryBuilder';
-import ExplorerOrderBy from 'container/ExplorerOrderBy';
-import { OrderByFilterProps } from 'container/QueryBuilder/filters/OrderByFilter/OrderByFilter.interfaces';
-import { QueryBuilderProps } from 'container/QueryBuilder/QueryBuilder.interfaces';
+import { initialQueriesMap, PANEL_TYPES } from 'constants/queryBuilder';
 import { useGetPanelTypesQueryParam } from 'hooks/queryBuilder/useGetPanelTypesQueryParam';
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
 import { useShareBuilderUrl } from 'hooks/queryBuilder/useShareBuilderUrl';
@@ -36,42 +29,11 @@ function LogExplorerQuerySection({
 
 	useShareBuilderUrl({ defaultValue });
 
-	const filterConfigs: QueryBuilderProps['filterConfigs'] = useMemo(() => {
-		const isTable = panelTypes === PANEL_TYPES.TABLE;
-		const isList = panelTypes === PANEL_TYPES.LIST;
-		const config: QueryBuilderProps['filterConfigs'] = {
-			stepInterval: { isHidden: isTable, isDisabled: false },
-			having: { isHidden: isList, isDisabled: true },
-			filters: {
-				customKey: 'body',
-				customOp: OPERATORS.CONTAINS,
-			},
-		};
-
-		return config;
-	}, [panelTypes]);
-
-	const renderOrderBy = useCallback(
-		({ query, onChange }: OrderByFilterProps): JSX.Element => (
-			<ExplorerOrderBy query={query} onChange={onChange} />
-		),
-		[],
-	);
-
-	const queryComponents = useMemo(
-		(): QueryBuilderProps['queryComponents'] => ({
-			...(panelTypes === PANEL_TYPES.LIST ? { renderOrderBy } : {}),
-		}),
-		[panelTypes, renderOrderBy],
-	);
-
 	return (
 		<QueryBuilderV2
-			isListViewPanel={panelTypes === PANEL_TYPES.LIST}
+			isRawQuery={panelTypes === PANEL_TYPES.LIST}
 			config={{ initialDataSource: DataSource.LOGS, queryVariant: 'static' }}
 			panelType={panelTypes}
-			filterConfigs={filterConfigs}
-			queryComponents={queryComponents}
 			showOnlyWhereClause={selectedView === ExplorerViews.LIST}
 			version="v3" // setting this to v3 as we this is rendered in logs explorer
 		/>

frontend/src/container/MeterExplorer/Explorer/Explorer.tsx

@@ -6,17 +6,11 @@ import logEvent from 'api/common/logEvent';
 import cx from 'classnames';
 import { QueryBuilderV2 } from 'components/QueryBuilderV2/QueryBuilderV2';
 import QuickFilters from 'components/QuickFilters/QuickFilters';
-import {
-	TelemetrytypesSignalDTO,
-	TelemetrytypesSourceDTO,
-} from 'api/generated/services/sigNoz.schemas';
-import { useSignalFieldApis } from 'components/QuickFilters/hooks/useSignalFieldApis';
 import { QuickFiltersSource, SignalType } from 'components/QuickFilters/types';
 import { initialQueryMeterWithType, PANEL_TYPES } from 'constants/queryBuilder';
 import { REACT_QUERY_KEY } from 'constants/reactQueryKeys';
 import ExplorerOptionWrapper from 'container/ExplorerOptions/ExplorerOptionWrapper';
 import RightToolbarActions from 'container/QueryBuilder/components/ToolbarActions/RightToolbarActions';
-import { QueryBuilderProps } from 'container/QueryBuilder/QueryBuilder.interfaces';
 import DateTimeSelector from 'container/TopNav/DateTimeSelectionV2';
 import { ExportDashboard } from 'hooks/dashboard/useExportDashboards';
 import { useGetExportToDashboardLink } from 'hooks/dashboard/useGetExportToDashboardLink';
@@ -36,10 +30,6 @@ import { splitQueryIntoOneChartPerQuery } from './utils';
 import './Explorer.styles.scss';
 
 function Explorer(): JSX.Element {
-	const quickFilterFieldApis = useSignalFieldApis(
-		TelemetrytypesSignalDTO.metrics,
-		TelemetrytypesSourceDTO.meter,
-	);
 	const {
 		handleRunQuery,
 		stagedQuery,
@@ -127,11 +117,6 @@ function Explorer(): JSX.Element {
 		});
 	}, []);
 
-	const queryComponents = useMemo(
-		(): QueryBuilderProps['queryComponents'] => ({}),
-		[],
-	);
-
 	return (
 		<Sentry.ErrorBoundary fallback={<ErrorBoundaryFallback />}>
 			<div
@@ -146,14 +131,13 @@ function Explorer(): JSX.Element {
 				>
 					<QuickFilters
 						className="qf-meter-explorer"
-						pageSource={QuickFiltersSource.METER_EXPLORER}
-						quickFilterSignal={SignalType.METER_EXPLORER}
+						source={QuickFiltersSource.METER_EXPLORER}
+						signal={SignalType.METER_EXPLORER}
 						showFilterCollapse
 						showQueryName={false}
 						handleFilterVisibilityChange={(): void => {
 							setShowQuickFilters(!showQuickFilters);
 						}}
-						useFieldApis={quickFilterFieldApis}
 					/>
 				</div>
 
@@ -188,7 +172,6 @@ function Explorer(): JSX.Element {
 								signalSource: 'meter',
 							}}
 							panelType={PANEL_TYPES.TIME_SERIES}
-							queryComponents={queryComponents}
 							showFunctions={false}
 							version="v3"
 						/>

frontend/src/container/MetricsExplorer/Explorer/Explorer.tsx

@@ -12,7 +12,6 @@ import { REACT_QUERY_KEY } from 'constants/reactQueryKeys';
 import { usePageActions } from 'container/AIAssistant/pageActions/usePageActions';
 import ExplorerOptionWrapper from 'container/ExplorerOptions/ExplorerOptionWrapper';
 import RightToolbarActions from 'container/QueryBuilder/components/ToolbarActions/RightToolbarActions';
-import { QueryBuilderProps } from 'container/QueryBuilder/QueryBuilder.interfaces';
 import DateTimeSelector from 'container/TopNav/DateTimeSelectionV2';
 import { ExportDashboard } from 'hooks/dashboard/useExportDashboards';
 import { useGetExportToDashboardLink } from 'hooks/dashboard/useGetExportToDashboardLink';
@@ -323,11 +322,6 @@ function Explorer(): JSX.Element {
 		});
 	}, []);
 
-	const queryComponents = useMemo(
-		(): QueryBuilderProps['queryComponents'] => ({}),
-		[],
-	);
-
 	const [warning, setWarning] = useState<Warning | undefined>();
 
 	const oneChartPerQueryDisabledTooltip = useMemo(() => {
@@ -381,7 +375,6 @@ function Explorer(): JSX.Element {
 				<QueryBuilderV2
 					config={{ initialDataSource: DataSource.METRICS, queryVariant: 'static' }}
 					panelType={PANEL_TYPES.TIME_SERIES}
-					queryComponents={queryComponents}
 					showFunctions={false}
 					version="v3"
 				/>

frontend/src/container/QueryBuilder/QueryBuilder.interfaces.ts

@@ -1,22 +1,9 @@
 import { ReactNode } from 'react';
+import { TelemetrytypesSignalDTO } from 'api/generated/services/sigNoz.schemas';
+import { QueryBuilderFieldsConfig } from 'components/QueryBuilderV2/queryBuilderFields.types';
 import { PANEL_TYPES } from 'constants/queryBuilder';
-import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 import { DataSource } from 'types/common/queryBuilder';
 
-import { OrderByFilterProps } from './filters/OrderByFilter/OrderByFilter.interfaces';
-
-export type WhereClauseConfig = {
-	customKey: string;
-	customOp: string;
-};
-
-type FilterConfigs = {
-	[Key in keyof Omit<IBuilderQuery, 'filters'>]: {
-		isHidden: boolean;
-		isDisabled: boolean;
-	};
-} & { filters: WhereClauseConfig };
-
 export type QueryBuilderConfig =
 	| {
 			queryVariant: 'static';
@@ -29,9 +16,16 @@ export type QueryBuilderProps = {
 	config?: QueryBuilderConfig;
 	panelType: PANEL_TYPES;
 	actions?: ReactNode;
-	filterConfigs?: Partial<FilterConfigs>;
-	queryComponents?: { renderOrderBy?: (props: OrderByFilterProps) => ReactNode };
-	isListViewPanel?: boolean;
+	fieldsConfig?: QueryBuilderFieldsConfig;
+	/**
+	 * The builder edits raw rows rather than an aggregation: a single query unless trace
+	 * matching is on, no formulas, data-source switches reset to the raw-query template,
+	 * and order by resolves keys without an aggregate attribute. Supplies the defaults for
+	 * `fieldsConfig` and `allowedDataSources`, which override it per field.
+	 */
+	isRawQuery?: boolean;
+	/** Defaults to every signal. */
+	allowedDataSources?: TelemetrytypesSignalDTO[];
 	showFunctions?: boolean;
 	showOnlyWhereClause?: boolean;
 	showOnlyTraceOperator?: boolean;

frontend/src/container/QueryBuilder/components/AdditionalFiltersToggler/AdditionalFiltersToggler.interfaces.ts

@@ -1,6 +0,0 @@
-import { ReactNode } from 'react';
-
-export type AdditionalFiltersProps = {
-	listOfAdditionalFilter: string[];
-	children: ReactNode;
-};

frontend/src/container/QueryBuilder/components/AdditionalFiltersToggler/AdditionalFiltersToggler.styled.ts

@@ -1,38 +0,0 @@
-import { SquareMinus, SquarePlus } from '@signozhq/icons';
-import { Color } from '@signozhq/design-tokens';
-import { Col } from 'antd';
-import { Typography } from '@signozhq/ui/typography';
-import styled, { css } from 'styled-components';
-
-const IconCss = css`
-	margin-right: 0.6875rem;
-	transition: all 0.2s ease;
-`;
-
-export const StyledIconOpen = styled(SquarePlus)`
-	${IconCss}
-`;
-
-export const StyledIconClose = styled(SquareMinus)`
-	${IconCss}
-`;
-
-export const StyledInner = styled(Col)`
-	width: fit-content;
-	display: flex;
-	align-items: center;
-	gap: 8px;
-	margin-bottom: 0.875rem;
-	min-height: 1.375rem;
-	cursor: pointer;
-	&:hover {
-		${StyledIconOpen}, ${StyledIconClose} {
-			opacity: 0.7;
-		}
-	}
-`;
-
-export const StyledLink = styled(Typography.Link)`
-	pointer-events: none;
-	color: ${Color.BG_ROBIN_400} !important;
-`;

frontend/src/container/QueryBuilder/components/AdditionalFiltersToggler/AdditionalFiltersToggler.styles.scss

@@ -1,15 +0,0 @@
-.filter-toggler {
-	margin-right: 8px;
-}
-
-.additinal-filters-container {
-	.action-btn {
-		background: var(--primary-background);
-		width: 16px;
-		height: 16px;
-		border-radius: 3px;
-		display: flex;
-		justify-content: center;
-		align-items: center;
-	}
-}

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

@@ -1,66 +0,0 @@
-import { Fragment, memo, ReactNode, useState } from 'react';
-import { Color } from '@signozhq/design-tokens';
-import { Col, Row } from 'antd';
-import { Typography } from '@signozhq/ui/typography';
-import { Minus, Plus } from '@signozhq/icons';
-
-// ** Types
-import { AdditionalFiltersProps } from './AdditionalFiltersToggler.interfaces';
-// ** Styles
-import { StyledInner, StyledLink } from './AdditionalFiltersToggler.styled';
-
-import './AdditionalFiltersToggler.styles.scss';
-
-export const AdditionalFiltersToggler = memo(function AdditionalFiltersToggler({
-	children,
-	listOfAdditionalFilter,
-}: AdditionalFiltersProps): JSX.Element {
-	const [isOpenedFilters, setIsOpenedFilters] = useState<boolean>(false);
-
-	const handleToggleOpenFilters = (): void => {
-		setIsOpenedFilters((prevState) => !prevState);
-	};
-
-	const filtersTexts: ReactNode = listOfAdditionalFilter?.map((str, index) => {
-		const isNextLast = index + 1 === listOfAdditionalFilter.length - 1;
-
-		if (index === listOfAdditionalFilter.length - 1) {
-			return (
-				<Fragment key={str}>
-					{listOfAdditionalFilter?.length > 1 && 'and'}{' '}
-					<StyledLink>{str.toUpperCase()}</StyledLink>
-				</Fragment>
-			);
-		}
-
-		return (
-			<span key={str}>
-				<StyledLink>{str.toUpperCase()}</StyledLink>
-				{isNextLast ? ' ' : ', '}
-			</span>
-		);
-	});
-
-	return (
-		<Row className="additinal-filters-container">
-			<Col span={24}>
-				<StyledInner onClick={handleToggleOpenFilters} style={{ marginBottom: 0 }}>
-					{isOpenedFilters ? (
-						<span className="action-btn">
-							<Minus size={14} color={Color.BG_INK_500} />
-						</span>
-					) : (
-						<span className="action-btn">
-							<Plus size={14} color={Color.BG_INK_500} />
-						</span>
-					)}
-
-					{!isOpenedFilters && (
-						<Typography>Add conditions for {filtersTexts}</Typography>
-					)}
-				</StyledInner>
-			</Col>
-			{isOpenedFilters && <Col span={24}>{children}</Col>}
-		</Row>
-	);
-});

frontend/src/container/QueryBuilder/components/AdditionalFiltersToggler/index.ts

@@ -1 +0,0 @@
-export { AdditionalFiltersToggler } from './AdditionalFiltersToggler';

frontend/src/container/QueryBuilder/components/DataSourceDropdown/DataSourceDropdown.interfaces.ts

@@ -1,8 +1,10 @@
 import { SelectProps } from 'antd';
+import { TelemetrytypesSignalDTO } from 'api/generated/services/sigNoz.schemas';
 import { DataSource } from 'types/common/queryBuilder';
 
 export type QueryLabelProps = {
 	onChange: (value: DataSource) => void;
-	isListViewPanel?: boolean;
+	/** Defaults to every signal. */
+	allowedDataSources?: TelemetrytypesSignalDTO[];
 	'data-testid'?: string;
 } & Omit<SelectProps, 'onChange'>;

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

@@ -1,5 +1,6 @@
 import { memo } from 'react';
 import { Select } from 'antd';
+import { TelemetrytypesSignalDTO } from 'api/generated/services/sigNoz.schemas';
 import { DataSource } from 'types/common/queryBuilder';
 import { SelectOption } from 'types/common/select';
 // ** Helpers
@@ -7,25 +8,24 @@ import { transformToUpperCase } from 'utils/transformToUpperCase';
 
 // ** Types
 import { QueryLabelProps } from './DataSourceDropdown.interfaces';
+import { signalsToDataSources } from './DataSourceDropdown.utils';
 
-const dataSourceMap = [DataSource.LOGS, DataSource.METRICS, DataSource.TRACES];
-
-const exploreDataSourceMap = [DataSource.LOGS, DataSource.TRACES];
+const ALL_SIGNALS = [
+	TelemetrytypesSignalDTO.logs,
+	TelemetrytypesSignalDTO.metrics,
+	TelemetrytypesSignalDTO.traces,
+];
 
 export const DataSourceDropdown = memo(function DataSourceDropdown(
 	props: QueryLabelProps,
 ): JSX.Element {
-	const { onChange, value, style, isListViewPanel = false } = props;
+	const { onChange, value, style, allowedDataSources = ALL_SIGNALS } = props;
 
-	const dataSourceOptions: SelectOption<DataSource, string>[] = isListViewPanel
-		? exploreDataSourceMap.map((source) => ({
-				label: transformToUpperCase(source),
-				value: source,
-			}))
-		: dataSourceMap.map((source) => ({
-				label: transformToUpperCase(source),
-				value: source,
-			}));
+	const dataSourceOptions: SelectOption<DataSource, string>[] =
+		signalsToDataSources(allowedDataSources).map((source) => ({
+			label: transformToUpperCase(source),
+			value: source,
+		}));
 
 	return (
 		<Select

frontend/src/container/QueryBuilder/components/DataSourceDropdown/DataSourceDropdown.utils.ts

@@ -0,0 +1,20 @@
+import { TelemetrytypesSignalDTO } from 'api/generated/services/sigNoz.schemas';
+import { DataSource } from 'types/common/queryBuilder';
+
+// Partial because the signal enum also carries an empty "unset" member, which is not a
+// data source a query can be built against.
+const SIGNAL_TO_DATA_SOURCE: Partial<
+	Record<TelemetrytypesSignalDTO, DataSource>
+> = {
+	[TelemetrytypesSignalDTO.logs]: DataSource.LOGS,
+	[TelemetrytypesSignalDTO.metrics]: DataSource.METRICS,
+	[TelemetrytypesSignalDTO.traces]: DataSource.TRACES,
+};
+
+export function signalsToDataSources(
+	signals: readonly TelemetrytypesSignalDTO[],
+): DataSource[] {
+	return signals
+		.map((signal) => SIGNAL_TO_DATA_SOURCE[signal])
+		.filter((dataSource): dataSource is DataSource => Boolean(dataSource));
+}

frontend/src/container/QueryBuilder/components/DataSourceDropdown/__tests__/DataSourceDropdown.test.tsx

@@ -0,0 +1,79 @@
+import { TelemetrytypesSignalDTO } from 'api/generated/services/sigNoz.schemas';
+import { render, screen, userEvent } from 'tests/test-utils';
+import { DataSource } from 'types/common/queryBuilder';
+
+import { DataSourceDropdown } from '../DataSourceDropdown';
+
+const TEST_ID = 'query-data-source-selector';
+
+async function openDropdown(): Promise<void> {
+	const user = userEvent.setup();
+	const trigger = screen.getByTestId(TEST_ID);
+	await user.click(trigger.querySelector('.ant-select-selector') as HTMLElement);
+}
+
+describe('DataSourceDropdown', () => {
+	// antd's virtual list renders only the first couple of options into jsdom, so
+	// each case asserts what the restriction admits and excludes, not the full list.
+	it('offers the signals beyond the current one when nothing restricts it', async () => {
+		render(
+			<DataSourceDropdown
+				data-testid={TEST_ID}
+				value={DataSource.METRICS}
+				onChange={jest.fn()}
+			/>,
+		);
+		await openDropdown();
+
+		await expect(
+			screen.findByRole('option', { name: 'Logs' }),
+		).resolves.toBeInTheDocument();
+		expect(screen.getByRole('option', { name: 'Metrics' })).toBeInTheDocument();
+	});
+
+	it('offers only the signals the caller can visualize', async () => {
+		render(
+			<DataSourceDropdown
+				data-testid={TEST_ID}
+				value={DataSource.METRICS}
+				allowedDataSources={[TelemetrytypesSignalDTO.metrics]}
+				onChange={jest.fn()}
+			/>,
+		);
+		await openDropdown();
+
+		await expect(
+			screen.findByRole('option', { name: 'Metrics' }),
+		).resolves.toBeInTheDocument();
+		expect(
+			screen.queryByRole('option', { name: 'Logs' }),
+		).not.toBeInTheDocument();
+		expect(
+			screen.queryByRole('option', { name: 'Traces' }),
+		).not.toBeInTheDocument();
+	});
+
+	it('drops a signal that is not a data source a query can be built against', async () => {
+		render(
+			<DataSourceDropdown
+				data-testid={TEST_ID}
+				value={DataSource.LOGS}
+				allowedDataSources={[
+					TelemetrytypesSignalDTO.logs,
+					TelemetrytypesSignalDTO.traces,
+					TelemetrytypesSignalDTO[''],
+				]}
+				onChange={jest.fn()}
+			/>,
+		);
+		await openDropdown();
+
+		await expect(
+			screen.findByRole('option', { name: 'Logs' }),
+		).resolves.toBeInTheDocument();
+		expect(screen.getByRole('option', { name: 'Traces' })).toBeInTheDocument();
+		expect(
+			screen.queryByRole('option', { name: 'Metrics' }),
+		).not.toBeInTheDocument();
+	});
+});

frontend/src/container/QueryBuilder/components/FilterLabel/FilterLabel.interfaces.ts

@@ -1,6 +0,0 @@
-import { CSSProperties } from 'react';
-
-export type FilterLabelProps = {
-	label: string;
-	style?: CSSProperties;
-};

frontend/src/container/QueryBuilder/components/FilterLabel/FilterLabel.styled.ts

@@ -1,16 +0,0 @@
-import styled from 'styled-components';
-
-interface Props {
-	isDarkMode: boolean;
-	children?: React.ReactNode;
-}
-
-export const StyledLabel = styled.div<Props>`
-	padding: 0 0.6875rem;
-	min-height: 2rem;
-	min-width: 5.625rem;
-	display: inline-flex;
-	white-space: nowrap;
-	align-items: center;
-	border-radius: 0.125rem;
-`;

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

@@ -1,26 +0,0 @@
-import { memo } from 'react';
-import { Typography } from '@signozhq/ui/typography';
-import { useIsDarkMode } from 'hooks/useDarkMode';
-
-// ** Types
-import { FilterLabelProps } from './FilterLabel.interfaces';
-// ** Styles
-import { StyledLabel } from './FilterLabel.styled';
-
-export const FilterLabel = memo(function FilterLabel({
-	label,
-}: FilterLabelProps): JSX.Element {
-	const isDarkMode = useIsDarkMode();
-
-	return (
-		<StyledLabel isDarkMode={isDarkMode}>
-			<Typography
-				style={{
-					color: 'var(--bg-vanilla-400)',
-				}}
-			>
-				{label}
-			</Typography>
-		</StyledLabel>
-	);
-});

frontend/src/container/QueryBuilder/components/FilterLabel/index.ts

@@ -1 +0,0 @@
-export { FilterLabel } from './FilterLabel';

frontend/src/container/QueryBuilder/components/Formula/Formula.interfaces.ts

@@ -1,4 +1,3 @@
-import { QueryBuilderProps } from 'container/QueryBuilder/QueryBuilder.interfaces';
 import {
 	IBuilderFormula,
 	IBuilderQuery,
@@ -8,7 +7,5 @@ export type FormulaProps = {
 	formula: IBuilderFormula;
 	index: number;
 	query: IBuilderQuery;
-	filterConfigs: Partial<QueryBuilderProps['filterConfigs']>;
-	isAdditionalFilterEnable: boolean;
 	isQBV2?: boolean;
 };

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

@@ -2,11 +2,6 @@ import { ChangeEvent, useCallback, useMemo, useState } from 'react';
 import { Col, Input, Row, Select } from 'antd';
 import InputWithLabel from 'components/InputWithLabel/InputWithLabel';
 import { LEGEND } from 'constants/global';
-// ** Components
-import { FilterLabel } from 'container/QueryBuilder/components';
-import HavingFilter from 'container/QueryBuilder/filters/Formula/Having/HavingFilter';
-import LimitFilter from 'container/QueryBuilder/filters/Formula/Limit/Limit';
-import OrderByFilter from 'container/QueryBuilder/filters/Formula/OrderBy/OrderByFilter';
 // ** Hooks
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
 import { useQueryOperations } from 'hooks/queryBuilder/useQueryBuilderOperations';
@@ -17,7 +12,6 @@ import {
 import { getFormatedLegend } from 'utils/getFormatedLegend';
 import { popupContainer } from 'utils/selectPopupContainer';
 
-import { AdditionalFiltersToggler } from '../AdditionalFiltersToggler';
 import QBEntityOptions from '../QBEntityOptions/QBEntityOptions';
 // ** Types
 import { FormulaProps } from './Formula.interfaces';
@@ -27,22 +21,18 @@ import './Formula.styles.scss';
 export function Formula({
 	index,
 	formula,
-	filterConfigs,
 	query,
-	isAdditionalFilterEnable,
 	isQBV2,
 }: FormulaProps): JSX.Element {
 	const { removeQueryBuilderEntityByIndex, handleSetFormulaData } =
 		useQueryBuilder();
 
-	const { listOfAdditionalFormulaFilters, handleChangeFormulaData } =
-		useQueryOperations({
-			index,
-			query,
-			filterConfigs,
-			formula,
-			entityVersion: '',
-		});
+	const { handleChangeFormulaData } = useQueryOperations({
+		index,
+		query,
+		formula,
+		entityVersion: '',
+	});
 
 	const [isCollapse, setIsCollapsed] = useState(false);
 
@@ -83,20 +73,6 @@ export function Formula({
 		[handleChangeFormulaData],
 	);
 
-	const handleChangeHavingFilter = useCallback(
-		(value: IBuilderFormula['having']) => {
-			handleChangeFormulaData('having', value);
-		},
-		[handleChangeFormulaData],
-	);
-
-	const handleChangeOrderByFilter = useCallback(
-		(value: IBuilderFormula['orderBy']) => {
-			handleChangeFormulaData('orderBy', value);
-		},
-		[handleChangeFormulaData],
-	);
-
 	const handleQBV2OrderByChange = useCallback(
 		(value: string) => {
 			const [columnName, order] = value.split(' ');
@@ -122,54 +98,6 @@ export function Formula({
 		[formula.orderBy],
 	);
 
-	const renderAdditionalFilters = useMemo(
-		() => (
-			<>
-				<Col span={11}>
-					<Row gutter={[11, 5]}>
-						<Col flex="5.93rem">
-							<FilterLabel label="Limit" />
-						</Col>
-						<Col flex="1 1 12.5rem">
-							<LimitFilter formula={formula} onChange={handleChangeLimit} />
-						</Col>
-					</Row>
-				</Col>
-				<Col span={11}>
-					<Row gutter={[11, 5]}>
-						<Col flex="5.93rem">
-							<FilterLabel label="HAVING" />
-						</Col>
-						<Col flex="1 1 12.5rem">
-							<HavingFilter formula={formula} onChange={handleChangeHavingFilter} />
-						</Col>
-					</Row>
-				</Col>
-				<Col span={11}>
-					<Row gutter={[11, 5]}>
-						<Col flex="5.93rem">
-							<FilterLabel label="Order by" />
-						</Col>
-						<Col flex="1 1 12.5rem">
-							<OrderByFilter
-								query={query}
-								formula={formula}
-								onChange={handleChangeOrderByFilter}
-							/>
-						</Col>
-					</Row>
-				</Col>
-			</>
-		),
-		[
-			formula,
-			handleChangeHavingFilter,
-			handleChangeLimit,
-			handleChangeOrderByFilter,
-			query,
-		],
-	);
-
 	return (
 		<Row gutter={[0, 15]}>
 			<QBEntityOptions
@@ -206,17 +134,6 @@ export function Formula({
 							addonBefore="Legend Format"
 						/>
 					</Col>
-					{isAdditionalFilterEnable && (
-						<Col span={24}>
-							<AdditionalFiltersToggler
-								listOfAdditionalFilter={listOfAdditionalFormulaFilters}
-							>
-								<Row gutter={[0, 11]} justify="space-between">
-									{renderAdditionalFilters}
-								</Row>
-							</AdditionalFiltersToggler>
-						</Col>
-					)}
 					{isQBV2 && (
 						<Col span={24}>
 							<div className="formula-qbv2-container">

frontend/src/container/QueryBuilder/components/QBEntityOptions/QBEntityOptions.styles.scss

@@ -84,5 +84,14 @@
 		.options-group {
 			max-width: 100%;
 		}
+
+		.query-functions-container--disabled {
+			opacity: 0.45;
+			cursor: not-allowed;
+
+			> * {
+				pointer-events: none;
+			}
+		}
 	}
 }

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

@@ -1,5 +1,6 @@
 import { useLocation } from 'react-router-dom';
 import { Button, Col, Tooltip } from 'antd';
+import { TelemetrytypesSignalDTO } from 'api/generated/services/sigNoz.schemas';
 import cx from 'classnames';
 import ROUTES from 'constants/routes';
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
@@ -26,6 +27,8 @@ interface QBEntityOptionsProps {
 	query?: IBuilderQuery;
 	isMetricsDataSource?: boolean;
 	showFunctions?: boolean;
+	functionsDisabled?: boolean;
+	functionsDisabledReason?: string;
 	isCollapsed: boolean;
 	entityType: string;
 	entityData: any;
@@ -36,7 +39,8 @@ interface QBEntityOptionsProps {
 	onQueryFunctionsUpdates?: (functions: QueryFunction[]) => void;
 	showDeleteButton?: boolean;
 	showCloneOption?: boolean;
-	isListViewPanel?: boolean;
+	isRawQuery?: boolean;
+	allowedDataSources?: TelemetrytypesSignalDTO[];
 	index?: number;
 	showTraceOperator?: boolean;
 	hasTraceOperator?: boolean;
@@ -50,12 +54,15 @@ export default function QBEntityOptions({
 	isMetricsDataSource,
 	isCollapsed,
 	showFunctions,
+	functionsDisabled,
+	functionsDisabledReason,
 	entityType,
 	entityData,
 	onToggleVisibility,
 	onCollapseEntity,
 	onQueryFunctionsUpdates,
-	isListViewPanel,
+	isRawQuery,
+	allowedDataSources,
 	onDelete,
 	showDeleteButton,
 	showCloneOption,
@@ -100,7 +107,7 @@ export default function QBEntityOptions({
 									value="query-builder"
 									className="periscope-btn visibility-toggle"
 									onClick={onToggleVisibility}
-									disabled={isListViewPanel && !showTraceOperator}
+									disabled={isRawQuery && !showTraceOperator}
 								>
 									{entityData.disabled ? <EyeOff size={16} /> : <Eye size={16} />}
 								</Button>
@@ -119,7 +126,7 @@ export default function QBEntityOptions({
 									'periscope-btn',
 									entityType === 'query' ? 'query-name' : 'formula-name',
 									query?.dataSource === DataSource.TRACES &&
-										(hasTraceOperator || (showTraceOperator && isListViewPanel))
+										(hasTraceOperator || (showTraceOperator && isRawQuery))
 										? 'has-trace-operator'
 										: '',
 									isLogsExplorerPage && lastUsedQuery === index ? 'sync-btn' : '',
@@ -138,24 +145,33 @@ export default function QBEntityOptions({
 										}}
 										data-testid={`query-data-source-selector-${index}`}
 										value={query?.dataSource || DataSource.METRICS}
-										isListViewPanel={isListViewPanel}
+										allowedDataSources={allowedDataSources}
 										className="query-data-source-dropdown"
 									/>
 								</div>
 							)}
 
 							{showFunctions &&
-								!isListViewPanel &&
+								!isRawQuery &&
 								(isMetricsDataSource || isLogsDataSource) &&
 								query &&
 								onQueryFunctionsUpdates && (
-									<QueryFunctions
-										query={query}
-										queryFunctions={query.functions || []}
-										key={query.functions?.toString()}
-										onChange={onQueryFunctionsUpdates}
-										maxFunctions={isLogsDataSource ? 1 : 3}
-									/>
+									<Tooltip title={functionsDisabledReason}>
+										<div
+											className={cx('query-functions-container', {
+												'query-functions-container--disabled': functionsDisabled,
+											})}
+											aria-disabled={functionsDisabled}
+										>
+											<QueryFunctions
+												query={query}
+												queryFunctions={query.functions || []}
+												key={query.functions?.toString()}
+												onChange={onQueryFunctionsUpdates}
+												maxFunctions={isLogsDataSource ? 1 : 3}
+											/>
+										</div>
+									</Tooltip>
 								)}
 						</Button.Group>
 					</div>
@@ -168,7 +184,7 @@ export default function QBEntityOptions({
 					)}
 				</div>
 
-				{showDeleteButton && !isListViewPanel && (
+				{showDeleteButton && !isRawQuery && (
 					<Button className="periscope-btn ghost" onClick={onDelete}>
 						<Trash2 size={14} />
 					</Button>
@@ -179,11 +195,14 @@ export default function QBEntityOptions({
 }
 
 QBEntityOptions.defaultProps = {
-	isListViewPanel: false,
+	isRawQuery: false,
+	allowedDataSources: undefined,
 	query: undefined,
 	isMetricsDataSource: false,
 	onQueryFunctionsUpdates: undefined,
 	showFunctions: false,
+	functionsDisabled: false,
+	functionsDisabledReason: undefined,
 	onCloneQuery: noop,
 	index: 0,
 	onDelete: noop,

frontend/src/container/QueryBuilder/components/index.ts

@@ -1,6 +1,4 @@
-export { AdditionalFiltersToggler } from './AdditionalFiltersToggler';
 export { DataSourceDropdown } from './DataSourceDropdown';
-export { FilterLabel } from './FilterLabel';
 export { Formula } from './Formula';
 export { HavingFilterTag } from './HavingFilterTag';
 export { ListItemWrapper } from './ListItemWrapper';

frontend/src/container/QueryBuilder/filters/Formula/Having/HavingFilter.tsx

@@ -1,198 +0,0 @@
-import { useCallback, useEffect, useMemo, useState } from 'react';
-import { Select } from 'antd';
-import { HAVING_OPERATORS, initialHavingValues } from 'constants/queryBuilder';
-import { HavingFilterTag } from 'container/QueryBuilder/components';
-import { useTagValidation } from 'hooks/queryBuilder/useTagValidation';
-import {
-	transformFromStringToHaving,
-	transformHavingToStringValue,
-} from 'lib/query/transformQueryBuilderData';
-import { Having, HavingForm } from 'types/api/queryBuilder/queryBuilderData';
-import { SelectOption } from 'types/common/select';
-import { useSelectPopupContainer } from 'utils/selectPopupContainer';
-
-import { getHavingObject, isValidHavingValue } from '../../utils';
-import { HavingFilterProps, HavingTagRenderProps } from './types';
-
-function HavingFilter({ formula, onChange }: HavingFilterProps): JSX.Element {
-	const getPopupContainer = useSelectPopupContainer();
-	const { having } = formula;
-	const [searchText, setSearchText] = useState<string>('');
-	const [localValues, setLocalValues] = useState<string[]>([]);
-	const [currentFormValue, setCurrentFormValue] =
-		useState<HavingForm>(initialHavingValues);
-	const [options, setOptions] = useState<SelectOption<string, string>[]>([]);
-
-	const { isMulti } = useTagValidation(
-		currentFormValue.op,
-		currentFormValue.value,
-	);
-
-	const columnName = formula.expression.replace(/ /g, '').toUpperCase();
-
-	const aggregatorOptions: SelectOption<string, string>[] = useMemo(
-		() => [{ label: columnName, value: columnName }],
-		[columnName],
-	);
-
-	const handleUpdateTag = useCallback(
-		(value: string) => {
-			const filteredValues = localValues.filter(
-				(currentValue) => currentValue !== value,
-			);
-			const having: Having[] = filteredValues.map(transformFromStringToHaving);
-
-			onChange(having);
-			setSearchText(value);
-		},
-		[localValues, onChange],
-	);
-
-	const generateOptions = useCallback(
-		(currentString: string) => {
-			const [aggregator = '', op = '', ...restValue] = currentString.split(' ');
-			let newOptions: SelectOption<string, string>[] = [];
-
-			const isAggregatorExist = columnName
-				.toLowerCase()
-				.includes(currentString.toLowerCase());
-
-			const isAggregatorChosen = aggregator === columnName;
-
-			if (isAggregatorExist || aggregator === '') {
-				newOptions = aggregatorOptions;
-			}
-
-			if ((isAggregatorChosen && op === '') || op) {
-				const filteredOperators = HAVING_OPERATORS.filter((num) =>
-					num.toLowerCase().includes(op.toLowerCase()),
-				);
-
-				newOptions = filteredOperators.map((opt) => ({
-					label: `${columnName} ${opt} ${restValue && restValue.join(' ')}`,
-					value: `${columnName} ${opt} ${restValue && restValue.join(' ')}`,
-				}));
-			}
-
-			setOptions(newOptions);
-		},
-		[aggregatorOptions, columnName],
-	);
-
-	const parseSearchText = useCallback(
-		(text: string) => {
-			const { columnName, op, value } = getHavingObject(text);
-			setCurrentFormValue({ columnName, op, value });
-
-			generateOptions(text);
-		},
-		[generateOptions],
-	);
-
-	const tagRender = ({
-		label,
-		value,
-		closable,
-		disabled,
-		onClose,
-	}: HavingTagRenderProps): JSX.Element => {
-		const handleClose = (): void => {
-			onClose();
-			setSearchText('');
-		};
-		return (
-			<HavingFilterTag
-				label={label}
-				value={value}
-				closable={closable}
-				disabled={disabled}
-				onClose={handleClose}
-				onUpdate={handleUpdateTag}
-			/>
-		);
-	};
-
-	const handleSearch = (search: string): void => {
-		const trimmedSearch = search.replace(/\s\s+/g, ' ').trimStart();
-
-		const currentSearch = isMulti
-			? trimmedSearch
-			: trimmedSearch.split(' ').slice(0, 3).join(' ');
-
-		const isValidSearch = isValidHavingValue(currentSearch);
-
-		if (isValidSearch) {
-			setSearchText(currentSearch);
-		}
-	};
-
-	useEffect(() => {
-		setLocalValues(transformHavingToStringValue(having || []));
-	}, [having]);
-
-	useEffect(() => {
-		parseSearchText(searchText);
-	}, [searchText, parseSearchText]);
-
-	const resetChanges = (): void => {
-		setSearchText('');
-		setCurrentFormValue(initialHavingValues);
-		setOptions(aggregatorOptions);
-	};
-
-	const handleDeselect = (value: string): void => {
-		const result = localValues.filter((item) => item !== value);
-		const having: Having[] = result.map(transformFromStringToHaving);
-		onChange(having);
-		resetChanges();
-	};
-
-	const handleSelect = (currentValue: string): void => {
-		const { columnName, op, value } = getHavingObject(currentValue);
-
-		const isCompletedValue = value.every((item) => !!item);
-
-		const isClearSearch = isCompletedValue && columnName && op;
-
-		setSearchText(isClearSearch ? '' : currentValue);
-	};
-
-	const handleChange = (values: string[]): void => {
-		const having: Having[] = values.map(transformFromStringToHaving);
-
-		const isSelectable =
-			currentFormValue.value.length > 0 &&
-			currentFormValue.value.every((value) => !!value);
-
-		if (isSelectable) {
-			onChange(having);
-			resetChanges();
-		}
-	};
-
-	return (
-		<Select
-			getPopupContainer={getPopupContainer}
-			autoClearSearchValue={false}
-			mode="multiple"
-			onSearch={handleSearch}
-			searchValue={searchText}
-			data-testid="havingSelectFormula"
-			placeholder="Count(operation) > 5"
-			style={{ width: '100%' }}
-			tagRender={tagRender}
-			onDeselect={handleDeselect}
-			onSelect={handleSelect}
-			onChange={handleChange}
-			value={localValues}
-		>
-			{options.map((opt) => (
-				<Select.Option key={opt.value} value={opt.value} title="havingOption">
-					{opt.label}
-				</Select.Option>
-			))}
-		</Select>
-	);
-}
-
-export default HavingFilter;

frontend/src/container/QueryBuilder/filters/Formula/Having/types.ts

@@ -1,12 +0,0 @@
-import { HavingFilterTagProps } from 'container/QueryBuilder/components/HavingFilterTag/HavingFilterTag.interfaces';
-import {
-	Having,
-	IBuilderFormula,
-} from 'types/api/queryBuilder/queryBuilderData';
-
-export type HavingFilterProps = {
-	formula: IBuilderFormula;
-	onChange: (having: Having[]) => void;
-};
-
-export type HavingTagRenderProps = Omit<HavingFilterTagProps, 'onUpdate'>;

frontend/src/container/QueryBuilder/filters/Formula/Limit/Limit.tsx

@@ -1,20 +0,0 @@
-import { InputNumber } from 'antd';
-
-import { selectStyle } from '../../QueryBuilderSearchV2/config';
-import { handleKeyDownLimitFilter } from '../../utils';
-import { LimitFilterProps } from './types';
-
-function LimitFilter({ onChange, formula }: LimitFilterProps): JSX.Element {
-	return (
-		<InputNumber
-			min={1}
-			type="number"
-			value={formula.limit}
-			style={selectStyle}
-			onChange={onChange}
-			onKeyDown={handleKeyDownLimitFilter}
-		/>
-	);
-}
-
-export default LimitFilter;

frontend/src/container/QueryBuilder/filters/Formula/Limit/types.ts

@@ -1,6 +0,0 @@
-import { IBuilderFormula } from 'types/api/queryBuilder/queryBuilderData';
-
-export interface LimitFilterProps {
-	onChange: (values: number | null) => void;
-	formula: IBuilderFormula;
-}

frontend/src/container/QueryBuilder/filters/Formula/OrderBy/OrderByFilter.tsx

@@ -1,85 +0,0 @@
-import { useMemo } from 'react';
-import { Select, Spin } from 'antd';
-import { useGetAggregateKeys } from 'hooks/queryBuilder/useGetAggregateKeys';
-import { MetricAggregateOperator } from 'types/common/queryBuilder';
-import { useSelectPopupContainer } from 'utils/selectPopupContainer';
-
-import { selectStyle } from '../../QueryBuilderSearchV2/config';
-import { OrderByProps } from './types';
-import { useOrderByFormulaFilter } from './useOrderByFormulaFilter';
-
-function OrderByFilter({
-	formula,
-	onChange,
-	query,
-}: OrderByProps): JSX.Element {
-	const getPopupContainer = useSelectPopupContainer();
-	const {
-		debouncedSearchText,
-		createOptions,
-		aggregationOptions,
-		handleChange,
-		handleSearchKeys,
-		selectedValue,
-		generateOptions,
-	} = useOrderByFormulaFilter({
-		query,
-		onChange,
-		formula,
-	});
-
-	const { data, isFetching } = useGetAggregateKeys(
-		{
-			aggregateAttribute: query.aggregateAttribute?.key || '',
-			dataSource: query.dataSource,
-			aggregateOperator: query.aggregateOperator || '',
-			searchText: debouncedSearchText,
-		},
-		{
-			enabled: !!query.aggregateAttribute?.key,
-			keepPreviousData: true,
-		},
-	);
-
-	const optionsData = useMemo(() => {
-		const keyOptions = createOptions(data?.payload?.attributeKeys || []);
-		const groupByOptions = createOptions(query.groupBy);
-		const options =
-			query.aggregateOperator === MetricAggregateOperator.NOOP
-				? keyOptions
-				: [...groupByOptions, ...aggregationOptions];
-
-		return generateOptions(options);
-	}, [
-		aggregationOptions,
-		createOptions,
-		data?.payload?.attributeKeys,
-		generateOptions,
-		query.aggregateOperator,
-		query.groupBy,
-	]);
-
-	const isDisabledSelect =
-		!query.aggregateAttribute?.key ||
-		query.aggregateOperator === MetricAggregateOperator.NOOP;
-
-	return (
-		<Select
-			getPopupContainer={getPopupContainer}
-			mode="tags"
-			style={selectStyle}
-			onSearch={handleSearchKeys}
-			showSearch
-			disabled={isDisabledSelect}
-			showArrow={false}
-			value={selectedValue}
-			labelInValue
-			filterOption={false}
-			options={optionsData}
-			notFoundContent={isFetching ? <Spin size="small" /> : null}
-			onChange={handleChange}
-		/>
-	);
-}
-
-export default OrderByFilter;

frontend/src/container/QueryBuilder/filters/Formula/OrderBy/types.ts

@@ -1,12 +0,0 @@
-import {
-	IBuilderFormula,
-	IBuilderQuery,
-} from 'types/api/queryBuilder/queryBuilderData';
-
-export interface OrderByProps {
-	formula: IBuilderFormula;
-	query: IBuilderQuery;
-	onChange: (value: IBuilderFormula['orderBy']) => void;
-}
-
-export type IOrderByFormulaFilterProps = OrderByProps;

frontend/src/container/QueryBuilder/filters/Formula/OrderBy/useOrderByFormulaFilter.tsx

@@ -1,129 +0,0 @@
-import { useMemo, useState } from 'react';
-import { DEBOUNCE_DELAY } from 'constants/queryBuilderFilterConfig';
-import useDebounce from 'hooks/useDebounce';
-import { IOption } from 'hooks/useResourceAttribute/types';
-import isEqual from 'lodash-es/isEqual';
-import uniqWith from 'lodash-es/uniqWith';
-import { parse } from 'papaparse';
-import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
-import { OrderByPayload } from 'types/api/queryBuilder/queryBuilderData';
-
-import { ORDERBY_FILTERS } from '../../OrderByFilter/config';
-import { SIGNOZ_VALUE } from '../../OrderByFilter/constants';
-import { UseOrderByFilterResult } from '../../OrderByFilter/useOrderByFilter';
-import {
-	getLabelFromValue,
-	mapLabelValuePairs,
-	orderByValueDelimiter,
-} from '../../OrderByFilter/utils';
-import { getRemoveOrderFromValue } from '../../QueryBuilderSearchV2/utils';
-import { getUniqueOrderByValues, getValidOrderByResult } from '../../utils';
-import { IOrderByFormulaFilterProps } from './types';
-import { transformToOrderByStringValuesByFormula } from './utils';
-
-export const useOrderByFormulaFilter = ({
-	onChange,
-	formula,
-}: IOrderByFormulaFilterProps): UseOrderByFilterResult => {
-	const [searchText, setSearchText] = useState<string>('');
-
-	const debouncedSearchText = useDebounce(searchText, DEBOUNCE_DELAY);
-
-	const handleSearchKeys = (searchText: string): void =>
-		setSearchText(searchText);
-
-	const handleChange = (values: IOption[]): void => {
-		const validResult = getValidOrderByResult(values);
-		const result = getUniqueOrderByValues(validResult);
-
-		const orderByValues: OrderByPayload[] = result.map((item) => {
-			const match = parse(item.value, { delimiter: orderByValueDelimiter });
-
-			if (!match) {
-				return {
-					columnName: item.value,
-					order: ORDERBY_FILTERS.ASC,
-				};
-			}
-
-			const [columnName, order] = match.data.flat() as string[];
-
-			const columnNameValue =
-				columnName === SIGNOZ_VALUE ? SIGNOZ_VALUE : columnName;
-
-			const orderValue = order ?? ORDERBY_FILTERS.ASC;
-
-			return {
-				columnName: columnNameValue,
-				order: orderValue,
-			};
-		});
-
-		setSearchText('');
-		onChange(orderByValues);
-	};
-
-	const aggregationOptions = [
-		{
-			label: `${formula.expression} ${ORDERBY_FILTERS.ASC}`,
-			value: `${SIGNOZ_VALUE}${orderByValueDelimiter}${ORDERBY_FILTERS.ASC}`,
-		},
-		{
-			label: `${formula.expression} ${ORDERBY_FILTERS.DESC}`,
-			value: `${SIGNOZ_VALUE}${orderByValueDelimiter}${ORDERBY_FILTERS.DESC}`,
-		},
-	];
-
-	const selectedValue = transformToOrderByStringValuesByFormula(formula);
-
-	const createOptions = (data: BaseAutocompleteData[]): IOption[] =>
-		mapLabelValuePairs(data).flat();
-
-	const customValue: IOption[] = useMemo(() => {
-		if (!searchText) {
-			return [];
-		}
-
-		return [
-			{
-				label: `${searchText} ${ORDERBY_FILTERS.ASC}`,
-				value: `${searchText}${orderByValueDelimiter}${ORDERBY_FILTERS.ASC}`,
-			},
-			{
-				label: `${searchText} ${ORDERBY_FILTERS.DESC}`,
-				value: `${searchText}${orderByValueDelimiter}${ORDERBY_FILTERS.DESC}`,
-			},
-		];
-	}, [searchText]);
-
-	const generateOptions = (options: IOption[]): IOption[] => {
-		const currentCustomValue = options.find(
-			(keyOption) =>
-				getRemoveOrderFromValue(keyOption.value) === debouncedSearchText,
-		)
-			? []
-			: customValue;
-
-		const result = [...currentCustomValue, ...options];
-
-		const uniqResult = uniqWith(result, isEqual);
-
-		return uniqResult.filter(
-			(option) =>
-				!getLabelFromValue(selectedValue).includes(
-					getRemoveOrderFromValue(option.value),
-				),
-		);
-	};
-
-	return {
-		searchText,
-		debouncedSearchText,
-		selectedValue,
-		aggregationOptions,
-		createOptions,
-		handleChange,
-		handleSearchKeys,
-		generateOptions,
-	};
-};

frontend/src/container/QueryBuilder/filters/Formula/OrderBy/utils.ts

@@ -1,26 +0,0 @@
-import { IOption } from 'hooks/useResourceAttribute/types';
-import { IBuilderFormula } from 'types/api/queryBuilder/queryBuilderData';
-
-import { SIGNOZ_VALUE } from '../../OrderByFilter/constants';
-import { orderByValueDelimiter } from '../../OrderByFilter/utils';
-
-export const transformToOrderByStringValuesByFormula = (
-	formula: IBuilderFormula,
-): IOption[] => {
-	const prepareSelectedValue: IOption[] =
-		formula?.orderBy?.map((item) => {
-			if (item.columnName === SIGNOZ_VALUE) {
-				return {
-					label: `${formula.expression} ${item.order}`,
-					value: `${item.columnName}${orderByValueDelimiter}${item.order}`,
-				};
-			}
-
-			return {
-				label: `${item.columnName} ${item.order}`,
-				value: `${item.columnName}${orderByValueDelimiter}${item.order}`,
-			};
-		}) || [];
-
-	return prepareSelectedValue;
-};

frontend/src/container/QueryBuilder/filters/OrderByFilter/OrderByFilter.interfaces.ts

@@ -6,7 +6,7 @@ import {
 export type OrderByFilterProps = {
 	query: IBuilderQuery;
 	onChange: (values: OrderByPayload[]) => void;
-	isListViewPanel?: boolean;
+	isRawQuery?: boolean;
 	entityVersion?: string;
 	isNewQueryV2?: boolean;
 };

frontend/src/container/QueryBuilder/filters/OrderByFilter/OrderByFilter.tsx

@@ -12,7 +12,7 @@ import { useOrderByFilter } from './useOrderByFilter';
 export function OrderByFilter({
 	query,
 	onChange,
-	isListViewPanel = false,
+	isRawQuery = false,
 	entityVersion,
 	isNewQueryV2 = false,
 }: OrderByFilterProps): JSX.Element {
@@ -35,7 +35,7 @@ export function OrderByFilter({
 			searchText: debouncedSearchText,
 		},
 		{
-			enabled: !!query.aggregateAttribute?.key || isListViewPanel,
+			enabled: !!query.aggregateAttribute?.key || isRawQuery,
 			keepPreviousData: true,
 		},
 	);

frontend/src/container/QueryBuilder/filters/QueryBuilderSearchV2/QueryBuilderSearchV2.tsx

@@ -19,7 +19,6 @@ import {
 	QUERY_BUILDER_SEARCH_VALUES,
 } from 'constants/queryBuilder';
 import { DEBOUNCE_DELAY } from 'constants/queryBuilderFilterConfig';
-import type { WhereClauseConfig } from 'container/QueryBuilder/QueryBuilder.interfaces';
 import { LogsExplorerShortcuts } from 'constants/shortcuts/logsExplorerShortcuts';
 import { useDynamicVariableSuggestions } from 'hooks/dashboard/useDynamicVariableSuggestions';
 import { useKeyboardHotkeys } from 'hooks/hotkeys/useKeyboardHotkeys';
@@ -88,7 +87,6 @@ interface CustomTagProps {
 interface QueryBuilderSearchV2Props {
 	query: IBuilderQuery;
 	onChange: (value: TagFilter) => void;
-	whereClauseConfig?: WhereClauseConfig;
 	placeholder?: string;
 	className?: string;
 	suffixIcon?: React.ReactNode;
@@ -145,7 +143,6 @@ function QueryBuilderSearchV2(
 		placeholder,
 		className,
 		suffixIcon,
-		whereClauseConfig,
 		hardcodedAttributeKeys,
 		hasPopupContainer,
 		rootClassName,
@@ -477,31 +474,7 @@ function QueryBuilderSearchV2(
 		if (searchValue) {
 			const operatorType =
 				operatorTypeMapper[currentFilterItem?.op || ''] || 'NOT_VALID';
-			// if key is added and operator is not present then convert to body CONTAINS key
 			if (
-				currentFilterItem?.key &&
-				isEmpty(currentFilterItem?.op) &&
-				whereClauseConfig?.customKey === 'body' &&
-				whereClauseConfig?.customOp === OPERATORS.CONTAINS
-			) {
-				// eslint-disable-next-line sonarjs/no-identical-functions
-				setTags((prev) => [
-					...prev,
-					{
-						key: {
-							key: 'body',
-							dataType: DataTypes.String,
-							type: '',
-							id: 'body--string----true',
-						},
-						op: OPERATORS.CONTAINS,
-						value: currentFilterItem?.key?.key,
-					},
-				]);
-				setCurrentFilterItem(undefined);
-				setSearchValue('');
-				setCurrentState(DropdownState.ATTRIBUTE_KEY);
-			} else if (
 				currentFilterItem?.op === OPERATORS.EXISTS ||
 				currentFilterItem?.op === OPERATORS.NOT_EXISTS
 			) {
@@ -543,8 +516,6 @@ function QueryBuilderSearchV2(
 		currentFilterItem?.op,
 		currentFilterItem?.value,
 		searchValue,
-		whereClauseConfig?.customKey,
-		whereClauseConfig?.customOp,
 	]);
 
 	// this useEffect takes care of tokenisation based on the search state
@@ -1085,7 +1056,6 @@ QueryBuilderSearchV2.defaultProps = {
 	placeholder: PLACEHOLDER,
 	className: '',
 	suffixIcon: null,
-	whereClauseConfig: {},
 	hasPopupContainer: true,
 	rootClassName: '',
 	hardcodedAttributeKeys: undefined,

frontend/src/container/QueryBuilder/type.ts

@@ -26,7 +26,7 @@ export type QueryProps = {
 	isAvailableToDisable: boolean;
 	query: IBuilderQuery;
 	queryVariant?: 'static' | 'dropdown';
-	isListViewPanel?: boolean;
+	isRawQuery?: boolean;
 	showFunctions?: boolean;
 	version: string;
 	showSpanScopeSelector?: boolean;
@@ -35,4 +35,4 @@ export type QueryProps = {
 	hasTraceOperator?: boolean;
 	signalSource?: string;
 	isMultiQueryAllowed?: boolean;
-} & Pick<QueryBuilderProps, 'filterConfigs' | 'queryComponents'>;
+} & Pick<QueryBuilderProps, 'fieldsConfig' | 'allowedDataSources'>;

frontend/src/container/TracesExplorer/QuerySection/index.tsx

@@ -1,55 +1,23 @@
-import { memo, useCallback, useMemo } from 'react';
+import { memo, useMemo } from 'react';
 import { QueryBuilderV2 } from 'components/QueryBuilderV2/QueryBuilderV2';
 import { PANEL_TYPES } from 'constants/queryBuilder';
-import ExplorerOrderBy from 'container/ExplorerOrderBy';
-import { OrderByFilterProps } from 'container/QueryBuilder/filters/OrderByFilter/OrderByFilter.interfaces';
-import { QueryBuilderProps } from 'container/QueryBuilder/QueryBuilder.interfaces';
 import { useGetPanelTypesQueryParam } from 'hooks/queryBuilder/useGetPanelTypesQueryParam';
 import { DataSource } from 'types/common/queryBuilder';
 
 function QuerySection(): JSX.Element {
 	const panelTypes = useGetPanelTypesQueryParam(PANEL_TYPES.LIST);
 
-	const filterConfigs: QueryBuilderProps['filterConfigs'] = useMemo(() => {
-		const isList = panelTypes === PANEL_TYPES.LIST;
-		const config: QueryBuilderProps['filterConfigs'] = {
-			stepInterval: { isHidden: false, isDisabled: false },
-			limit: { isHidden: isList, isDisabled: true },
-			having: { isHidden: isList, isDisabled: true },
-		};
-
-		return config;
-	}, [panelTypes]);
-
-	const renderOrderBy = useCallback(
-		({ query, onChange }: OrderByFilterProps) => (
-			<ExplorerOrderBy query={query} onChange={onChange} />
-		),
-		[],
-	);
-
-	const queryComponents = useMemo((): QueryBuilderProps['queryComponents'] => {
-		const shouldRenderCustomOrderBy =
-			panelTypes === PANEL_TYPES.LIST || panelTypes === PANEL_TYPES.TRACE;
-
-		return {
-			...(shouldRenderCustomOrderBy ? { renderOrderBy } : {}),
-		};
-	}, [panelTypes, renderOrderBy]);
-
-	const isListViewPanel = useMemo(
+	const isRawQuery = useMemo(
 		() => panelTypes === PANEL_TYPES.LIST || panelTypes === PANEL_TYPES.TRACE,
 		[panelTypes],
 	);
 
 	return (
 		<QueryBuilderV2
-			isListViewPanel={isListViewPanel}
+			isRawQuery={isRawQuery}
 			showTraceOperator
 			config={{ initialDataSource: DataSource.TRACES, queryVariant: 'static' }}
-			queryComponents={queryComponents}
 			panelType={panelTypes}
-			filterConfigs={filterConfigs}
 			showOnlyWhereClause={
 				panelTypes === PANEL_TYPES.LIST || panelTypes === PANEL_TYPES.TRACE
 			}

frontend/src/container/WidgetCard/Card/FullView/contants.ts

@@ -29,5 +29,6 @@ export const PANEL_TYPES_VS_FULL_VIEW_TABLE: PanelTypeAndGraphManagerVisibilityP
 		BAR: true,
 		PIE: false,
 		HISTOGRAM: false,
+		HEATMAP: false,
 		EMPTY_WIDGET: false,
 	};

frontend/src/container/WidgetCard/Card/FullView/index.tsx

@@ -316,7 +316,7 @@ function FullView({
 								<QueryBuilderV2
 									panelType={selectedPanelType}
 									version="v3"
-									isListViewPanel={selectedPanelType === PANEL_TYPES.LIST}
+									isRawQuery={selectedPanelType === PANEL_TYPES.LIST}
 									signalSourceChangeEnabled
 									// filterConfigs={filterConfigs}
 									// queryComponents={queryComponents}

frontend/src/container/WidgetCard/Panels/constants.ts

@@ -18,4 +18,6 @@ export const PanelTypeVsPanelWrapper = {
 	[PANEL_TYPES.PIE]: PiePanelWrapper,
 	[PANEL_TYPES.BAR]: BarPanel,
 	[PANEL_TYPES.HISTOGRAM]: HistogramPanel,
+	// V2-only kind; it renders through the V2 panel registry.
+	[PANEL_TYPES.HEATMAP]: null,
 };

frontend/src/hooks/queryBuilder/__tests__/useQueryBuilderOperations.test.ts

@@ -62,14 +62,14 @@ describe('useQueryBuilderOperations - Empty Aggregate Attribute Type', () => {
 		legend: '',
 	};
 
-	const setupMockQueryBuilder = (): void => {
+	const setupMockQueryBuilder = (panelType = 'time_series'): void => {
 		(useQueryBuilder as jest.Mock).mockReturnValue({
 			handleSetQueryData: mockHandleSetQueryData,
 			handleSetFormulaData: mockHandleSetFormulaData,
 			removeQueryBuilderEntityByIndex: mockRemoveQueryBuilderEntityByIndex,
 			setLastUsedQuery: mockSetLastUsedQuery,
 			redirectWithQueryBuilderData: mockRedirectWithQueryBuilderData,
-			panelType: 'time_series',
+			panelType,
 			currentQuery: {
 				builder: {
 					queryData: [defaultMockQuery, defaultMockQuery],
@@ -332,4 +332,85 @@ describe('useQueryBuilderOperations - Empty Aggregate Attribute Type', () => {
 			);
 		});
 	});
+
+	describe('spaceAggregationOptions for a histogram metric', () => {
+		const histogramQuery: IBuilderQuery = {
+			...defaultMockQuery,
+			aggregateAttribute: {
+				key: 'signoz_latency',
+				dataType: DataTypes.Float64,
+				type: ATTRIBUTE_TYPES.HISTOGRAM,
+			} as BaseAutocompleteData,
+		};
+
+		it('offers the percentiles on a time series panel', () => {
+			const result = renderHookWithProps({ query: histogramQuery });
+
+			expect(
+				result.current.spaceAggregationOptions.map((o) => o.value),
+			).toStrictEqual([
+				MetricAggregateOperator.P50,
+				MetricAggregateOperator.P75,
+				MetricAggregateOperator.P90,
+				MetricAggregateOperator.P95,
+				MetricAggregateOperator.P99,
+			]);
+		});
+
+		it('offers count alone on a heatmap panel, whose Y axis is the `le` labels', () => {
+			setupMockQueryBuilder('heatmap');
+
+			const result = renderHookWithProps({ query: histogramQuery });
+
+			expect(
+				result.current.spaceAggregationOptions.map((o) => o.value),
+			).toStrictEqual([MetricAggregateOperator.COUNT]);
+		});
+	});
+
+	describe('picking a histogram metric', () => {
+		const histogramAttribute: BaseAutocompleteData = {
+			key: 'http.client.duration.bucket',
+			dataType: DataTypes.Float64,
+			type: ATTRIBUTE_TYPES.HISTOGRAM,
+		};
+
+		it('defaults the spatial aggregation to p90 on a time series panel', () => {
+			const result = renderHookWithProps({ entityVersion: ENTITY_VERSION_V5 });
+			act(() => {
+				result.current.handleChangeAggregatorAttribute(histogramAttribute);
+			});
+
+			expect(mockHandleSetQueryData).toHaveBeenLastCalledWith(
+				0,
+				expect.objectContaining({
+					aggregations: [
+						expect.objectContaining({
+							spaceAggregation: MetricAggregateOperator.P90,
+						}),
+					],
+				}),
+			);
+		});
+
+		it('defaults it to count on a heatmap panel, which offers nothing else', () => {
+			setupMockQueryBuilder('heatmap');
+
+			const result = renderHookWithProps({ entityVersion: ENTITY_VERSION_V5 });
+			act(() => {
+				result.current.handleChangeAggregatorAttribute(histogramAttribute);
+			});
+
+			expect(mockHandleSetQueryData).toHaveBeenLastCalledWith(
+				0,
+				expect.objectContaining({
+					aggregations: [
+						expect.objectContaining({
+							spaceAggregation: MetricAggregateOperator.COUNT,
+						}),
+					],
+				}),
+			);
+		});
+	});
 });

frontend/src/hooks/queryBuilder/useQueryBuilderOperations.ts

@@ -14,12 +14,11 @@ import {
 	initialQueryBuilderFormValuesMap,
 	listViewInitialLogQuery,
 	listViewInitialTraceQuery,
-	mapOfFormulaToFilters,
-	mapOfQueryFilters,
 	PANEL_TYPES,
 } from 'constants/queryBuilder';
 import {
 	metricsGaugeSpaceAggregateOperatorOptions,
+	metricsHeatmapHistogramSpaceAggregateOperatorOptions,
 	metricsHistogramSpaceAggregateOperatorOptions,
 	metricsSumSpaceAggregateOperatorOptions,
 	metricsUnknownSpaceAggregateOperatorOptions,
@@ -59,9 +58,8 @@ import { getFormatedLegend } from 'utils/getFormatedLegend';
 export const useQueryOperations: UseQueryOperations = ({
 	query,
 	index,
-	filterConfigs,
 	formula,
-	isListViewPanel = false,
+	isRawQuery = false,
 	entityVersion,
 	isForTraceOperator = false,
 	savePreviousQuery = false,
@@ -105,46 +103,7 @@ export const useQueryOperations: UseQueryOperations = ({
 		}
 	}, [query]);
 
-	const { dataSource, aggregateOperator } = query;
-
-	const getNewListOfAdditionalFilters = useCallback(
-		(dataSource: DataSource, isQuery: boolean): string[] => {
-			const additionalFiltersKeys: (keyof Pick<
-				IBuilderQuery,
-				'orderBy' | 'limit' | 'having' | 'stepInterval'
-			>)[] = ['having', 'limit', 'orderBy', 'stepInterval'];
-
-			const mapsOfFilters = isQuery ? mapOfQueryFilters : mapOfFormulaToFilters;
-
-			const result: string[] = mapsOfFilters[dataSource]?.reduce<string[]>(
-				(acc, item) => {
-					if (
-						filterConfigs &&
-						filterConfigs[item.field as (typeof additionalFiltersKeys)[number]]
-							?.isHidden
-					) {
-						return acc;
-					}
-
-					acc.push(item.text);
-
-					return acc;
-				},
-				[],
-			);
-
-			return result;
-		},
-
-		[filterConfigs],
-	);
-
-	const [listOfAdditionalFilters, setListOfAdditionalFilters] = useState<
-		string[]
-	>(getNewListOfAdditionalFilters(dataSource, true));
-
-	const [listOfAdditionalFormulaFilters, setListOfAdditionalFormulaFilters] =
-		useState<string[]>(getNewListOfAdditionalFilters(dataSource, false));
+	const { dataSource } = query;
 
 	const handleChangeOperator = useCallback(
 		(value: string): void => {
@@ -218,6 +177,11 @@ export const useQueryOperations: UseQueryOperations = ({
 							(aggregateAttribute?.type as ATTRIBUTE_TYPES) || ATTRIBUTE_TYPES.GAUGE,
 					});
 
+			const histogramSpaceAggregationOptions =
+				panelType === PANEL_TYPES.HEATMAP
+					? metricsHeatmapHistogramSpaceAggregateOperatorOptions
+					: metricsHistogramSpaceAggregateOperatorOptions;
+
 			switch (aggregateAttribute?.type) {
 				case ATTRIBUTE_TYPES.SUM:
 					setSpaceAggregationOptions(metricsSumSpaceAggregateOperatorOptions);
@@ -227,11 +191,11 @@ export const useQueryOperations: UseQueryOperations = ({
 					break;
 
 				case ATTRIBUTE_TYPES.HISTOGRAM:
-					setSpaceAggregationOptions(metricsHistogramSpaceAggregateOperatorOptions);
+					setSpaceAggregationOptions(histogramSpaceAggregationOptions);
 					break;
 
 				case ATTRIBUTE_TYPES.EXPONENTIAL_HISTOGRAM:
-					setSpaceAggregationOptions(metricsHistogramSpaceAggregateOperatorOptions);
+					setSpaceAggregationOptions(histogramSpaceAggregationOptions);
 					break;
 				default:
 					setSpaceAggregationOptions(metricsUnknownSpaceAggregateOperatorOptions);
@@ -340,7 +304,13 @@ export const useQueryOperations: UseQueryOperations = ({
 									timeAggregation: '',
 									metricName: newQuery.aggregateAttribute?.key || '',
 									temporality: '',
-									spaceAggregation: MetricAggregateOperator.P90,
+									// A heatmap cell holds a count of observations per `le` band, which is
+									// the one option the kind offers — a percentile default would sit in the
+									// selector with nothing behind it.
+									spaceAggregation:
+										panelType === PANEL_TYPES.HEATMAP
+											? MetricAggregateOperator.COUNT
+											: MetricAggregateOperator.P90,
 									reduceTo: ReduceOperators.AVG,
 								},
 							];
@@ -430,6 +400,7 @@ export const useQueryOperations: UseQueryOperations = ({
 			index,
 			handleMetricAggregateAtributeTypes,
 			previousMetricInfo,
+			panelType,
 		],
 	);
 
@@ -460,7 +431,7 @@ export const useQueryOperations: UseQueryOperations = ({
 				removeKeyFromPreviousQuery(newKey);
 			}
 
-			if (isListViewPanel) {
+			if (isRawQuery) {
 				let listPanelQuery: Query | null = null;
 
 				if (nextSource === DataSource.LOGS) {
@@ -506,7 +477,7 @@ export const useQueryOperations: UseQueryOperations = ({
 			handleSetQueryData(index, newQueryData);
 		},
 		[
-			isListViewPanel,
+			isRawQuery,
 			panelType,
 			query,
 			handleSetQueryData,
@@ -625,32 +596,18 @@ export const useQueryOperations: UseQueryOperations = ({
 		handleMetricAggregateAtributeTypes,
 	]);
 
-	useEffect(() => {
-		const additionalFilters = getNewListOfAdditionalFilters(dataSource, true);
-
-		setListOfAdditionalFilters(additionalFilters);
-	}, [dataSource, aggregateOperator, getNewListOfAdditionalFilters]);
-
-	useEffect(() => {
-		const additionalFilters = getNewListOfAdditionalFilters(dataSource, false);
-
-		setListOfAdditionalFormulaFilters(additionalFilters);
-	}, [dataSource, aggregateOperator, getNewListOfAdditionalFilters]);
-
 	return {
 		isTracePanelType,
 		isMetricsDataSource,
 		isLogsDataSource,
 		operators,
 		spaceAggregationOptions,
-		listOfAdditionalFilters,
 		handleChangeOperator,
 		handleSpaceAggregationChange,
 		handleChangeAggregatorAttribute,
 		handleChangeDataSource,
 		handleDeleteQuery,
 		handleChangeQueryData,
-		listOfAdditionalFormulaFilters,
 		handleChangeFormulaData,
 		handleQueryFunctionsUpdates,
 	};

frontend/src/hooks/useGetYAxisUnit.test.ts

@@ -222,6 +222,31 @@ describe('useGetYAxisUnit', () => {
 		expect(result.current.isError).toBe(false);
 	});
 
+	it('resolves the unit on the first render, without a settling pass', () => {
+		// The real `useGetMetrics` rebuilds its array on every render; a hook that
+		// stored the unit would need an extra render to settle, and would schedule one
+		// after every render of the panel editor.
+		mockUseGetMetrics.mockImplementation(() => ({
+			isLoading: false,
+			isError: false,
+			metrics: [MOCK_METRIC_1],
+		}));
+
+		let renderCount = 0;
+		const { result, rerender } = renderHook(() => {
+			renderCount += 1;
+			return useGetYAxisUnit();
+		});
+
+		expect(result.current.yAxisUnit).toBe(UniversalYAxisUnit.BYTES);
+		expect(renderCount).toBe(1);
+
+		rerender();
+
+		expect(result.current.yAxisUnit).toBe(UniversalYAxisUnit.BYTES);
+		expect(renderCount).toBe(2);
+	});
+
 	it('should return undefined when metrics have different units', async () => {
 		mockUseGetMetrics.mockReturnValueOnce({
 			isLoading: false,

frontend/src/hooks/useGetYAxisUnit.ts

@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useState } from 'react';
+import { useMemo } from 'react';
 import {
 	getMetricUnits,
 	useGetMetrics,
@@ -46,7 +46,6 @@ function useGetYAxisUnit(
 	},
 ): UseGetYAxisUnitResult {
 	const { stagedQuery } = useQueryBuilder();
-	const [yAxisUnit, setYAxisUnit] = useState<string | undefined>();
 
 	const metricNames: string[] | null = useMemo(() => {
 		// If the query type is not QUERY_BUILDER, return null
@@ -95,27 +94,16 @@ function useGetYAxisUnit(
 		[units],
 	);
 
-	useEffect(() => {
-		// If there are no metrics, set the y-axis unit to undefined
-		if (units.length === 0) {
-			setYAxisUnit(undefined);
-			// If there is one metric and it has a non-empty unit, set the y-axis unit to it
-		} else if (units.length === 1 && units[0] !== '') {
-			setYAxisUnit(units[0]);
-			// If all metrics have the same non-empty unit, set the y-axis unit to it
-		} else if (areAllMetricUnitsSame) {
-			if (units[0] !== '') {
-				setYAxisUnit(units[0]);
-			} else {
-				setYAxisUnit(undefined);
-			}
-			// If there is more than one metric and they have different units, set the y-axis unit to undefined
-		} else if (units.length > 1 && !areAllMetricUnitsSame) {
-			setYAxisUnit(undefined);
-			// If there is one metric and it has an empty unit, set the y-axis unit to undefined
-		} else if (units.length === 1 && units[0] === '') {
-			setYAxisUnit(undefined);
+	// Derived, not stored: `useGetMetrics` rebuilds its array on every render, so a
+	// state-and-effect version schedules an update after every render — the shape
+	// React reports as "Maximum update depth exceeded".
+	const yAxisUnit = useMemo(() => {
+		// A single shared unit is the only thing a single axis can carry; metrics that
+		// disagree, or that carry no unit at all, leave the axis unitless.
+		if (units.length === 0 || !areAllMetricUnitsSame) {
+			return undefined;
 		}
+		return units[0] || undefined;
 	}, [units, areAllMetricUnitsSame]);
 
 	return { yAxisUnit, isLoading, isError };