fix: update integration test

.claude/skills/authz-configurator/SKILL.md

@@ -1,142 +0,0 @@
----
-name: authz-configurator
-description: Add authorization (authz) to a SigNoz backend feature end-to-end — register kinds/resources, grant managed-role permissions, wire routes with ResourceDefs, backfill tuples for existing orgs, and write the authz integration tests. Use this whenever the user mentions authz, authorization, permissions, access control, managed roles (admin/editor/viewer), OpenFGA, ResourceDef, CheckResources, 403/forbidden behavior on an endpoint, wiring or protecting a new route, registering a new resource/kind, or writing integration tests that assert role-based allow/deny. Also use it when a new API endpoint is being added and its access control hasn't been decided yet — every route needs an authz decision even if the user didn't say the word.
----
-
-# SigNoz Authz Workflow
-
-This skill automates the procedure documented in `docs/contributing/go/authz.md`. Read that doc first — it is the canonical explanation of the concepts (types, verbs, kinds, resources, selectors, tuples, the community/enterprise split). This skill tells you what to do; the doc tells you why it works.
-
-The core model in one paragraph: permissions are never attached to users. They are attached to **roles** as OpenFGA tuples, and users/service accounts are made **assignees** of roles. You declare everything in code registries under `pkg/types/coretypes/`; tuples for new organizations are derived from those registries at org bootstrap. Routes declare what resource+verb they touch via `ResourceDef`s, and middleware turns that into a check that works in both community (role gate) and enterprise (per-resource FGA) editions.
-
-## Before you start
-
-Figure out what shape the work is. Ask the user if unclear:
-
-- **New resource** (new kind + routes) → all steps below.
-- **New route on an existing resource** → step 4 only (maybe step 3 if roles need new verbs).
-- **Changing what a role can do** → steps 3, 5, 6, 7.
-- **Just tests** → steps 6, 7.
-
-Almost every feature resource is a `metaresource` (dashboards, rules, pipelines) or a `telemetryresource` (logs, traces, metrics). If the feature genuinely needs a brand-new FGA **type**, stop and flag it to the user — that requires editing both `pkg/authz/openfgaschema/base.fga` and `ee/authz/openfgaschema/base.fga` together and is almost never the right call. A new **kind** never touches the schema.
-
-## Step 1: Register the kind
-
-Edit `pkg/types/coretypes/registry_kind.go`. Add a var and append it to the `Kinds` slice (both are required — the slice is what gets validated and iterated):
-
-```go
-KindThing = MustNewKind("thing")
-```
-
-Kind names are lowercase, hyphen-separated (`quick-filter`, `trace-funnel`, `notification-channel`).
-
-Also add the kind to `Kind.Enum()` in `pkg/types/coretypes/kind.go` — a second hand-maintained list mirroring `Kinds` that feeds the OpenAPI enum. It is easy to miss because nothing fails at build time without it; the drift only shows up in the generated spec.
-
-## Step 2: Register the resource
-
-Edit `pkg/types/coretypes/registry_resource.go`. Add a var and append it to the `Resources` slice:
-
-```go
-ResourceMetaResourceThing = NewResourceMetaResource(KindThing)
-```
-
-Use `NewResourceTelemetryResource(KindThing)` for telemetry data resources. Pass an explicit verb list only when the resource supports fewer verbs than the type default — see `ResourceMetaResourceFactorAPIKey` in that file for the shape.
-
-## Step 3: Grant permissions to managed roles
-
-Edit `pkg/types/coretypes/registry_managed_role.go`. Add `Transaction` entries to `ManagedRoleToTransactions` for each role that may act on the resource:
-
-```go
-{Verb: VerbCreate, Object: *MustNewObject(ResourceRef{Type: TypeMetaResource, Kind: KindThing}, WildCardSelectorString)},
-```
-
-The convention: **admin** gets everything; **editor** gets full CRUD only on day-to-day observability resources (dashboards, rules, saved views — not access control or org settings); **viewer** gets `read`/`list`; **anonymous** gets nothing (public dashboards are the only exception). Match the file's existing style, including its one-line grouping comment per resource block (e.g. `// thing — editors manage, viewers read`) — that file uses grouping comments as structure; do not add comments anywhere else.
-
-This map is the single source of truth: changing it affects only organizations created afterwards (see step 5 for existing orgs), and the integration suite asserts its contents via a golden file (see step 6).
-
-## Step 4: Wire the route
-
-Register routes in the existing domain file under `pkg/apiserver/signozapiserver/` — do not create new per-sub-resource route files. Each route needs three coordinated pieces:
-
-1. **`provider.authzMiddleware.CheckResources(handlerFn, roles...)`** — the role list is the community-edition fallback gate (which managed roles may call this route when per-resource checks are unavailable).
-2. **`handler.WithResourceDefs(...)`** — declares resource, verb, audit category, ID extractor, and selector.
-3. **`SecuritySchemes: newScopedSecuritySchemes([]string{resource.Scope(verb)})`** — advertises the scope in the OpenAPI spec.
-
-Selector rules (getting these wrong silently over- or under-authorizes):
-
-| Operation | Selector | ID extractor |
-|---|---|---|
-| create | `WildcardSelector` | `ResponseJSONPath("data.id")` (ID exists only after the handler runs; recorded for audit) |
-| list | `WildcardSelector` | none |
-| read/update/delete of one instance | `IDSelector` | `PathParam("id")` or `BodyJSONPath(...)` |
-| request ID ≠ FGA selector (e.g. route has a role UUID, FGA objects use role names) | custom `SelectorFunc` | as appropriate |
-
-Routes that link two resources check **both** sides. Read `references/route-wiring.md` before wiring any create route, linking route (attach/detach, parent-child), or custom selector — it has complete real examples from `serviceaccount.go`.
-
-Prefer `CheckResources` + `ResourceDef` for anything resource-shaped. The legacy gates `ViewAccess`/`EditAccess`/`AdminAccess` are coarse role-only checks — do not use them for new routes. `OpenAccess` means no authorization (authentication still applies); `CheckWithoutClaims` serves anonymous routes.
-
-## Step 5: Backfill existing organizations (only if needed)
-
-New organizations derive their tuples from the registries at creation — no migration needed for them. If **existing** organizations must get the new permissions, add a migration in `pkg/sqlmigration/` that does two things per org:
-
-1. **Insert the FGA tuples** — follow `083_add_role_crud_tuples.go`: one `tuple` row (+ `changelog` row) per role/verb/object, with `ON CONFLICT ... DO NOTHING` so it stays idempotent, handling both the Postgres and SQLite tuple column layouts as that file does.
-2. **Refresh the managed roles' JSON record** — since `099_add_role_transaction_groups.go`, each role row carries a `transaction_groups` JSON column that mirrors its permissions. Tuples and JSON must move together or the stored record drifts from the registry. Follow 099's managed-role loop: marshal `authtypes.NewTransactionGroupsFromTransactions(coretypes.ManagedRoleToTransactions[roleName])` and `UPDATE role SET transaction_groups = ? WHERE org_id = ? AND type = 'managed' AND name = ?`. Serializing from the registry (which already contains your new grants) makes this step self-updating. Custom roles need no changes — only managed roles mirror the registry.
-
-Register the new migration factory in `NewSQLMigrationProviderFactories` in `pkg/signoz/provider.go`, appended after the existing entries. The factory name passed to `factory.MustNewName` must match `^[a-z][a-z0-9_-]{0,30}$` — at most 31 characters, or it panics at startup; prefer a short name like `notification_template_tuples` over `add_notification_template_tuples`.
-
-Ask the user whether backfill is needed rather than assuming — shipping a feature to existing orgs almost always means yes.
-
-## Step 6: Update the golden testdata and regenerate CI-checked artifacts
-
-If you changed `ManagedRoleToTransactions`, update `tests/integration/testdata/role/managed_role_transactions.json` to match — the `role/01_register.py` integration test compares each managed role's verb/type/kind matrix against this file and will fail otherwise.
-
-If you touched the registries or `Kind.Enum()`, regenerate the derived artifacts. The `goci` GitHub workflow reruns each of these and fails the PR on any uncommitted diff:
-
-```bash
-go run cmd/enterprise/*.go generate openapi                    # docs/api/openapi.yml
-go run cmd/enterprise/*.go generate authz                      # frontend/src/lib/authz/hooks/useAuthZ/permissions.type.ts
-go run cmd/enterprise/*.go generate config transaction-groups  # frontend/src/schemas/generated/transactionGroups.schema.json
-```
-
-Commit whatever they change; never hand-edit these generated files.
-
-`generate authz` is allowlist-based: it only emits resources listed in the `allowedResources` map inside `runGenerateAuthz` in `cmd/authz.go`. For the new resource to surface in the UI's permission gating (AuthZButton and friends), add it there —
-
-```go
-coretypes.NewResourceRef(coretypes.ResourceMetaResourceThing).String(): true,
-```
-
-— then rerun `generate authz` and commit the regenerated `permissions.type.ts`. If the resource has no UI surface yet, skip the allowlist entry and the command produces no diff; that is expected.
-
-## Step 7: Write integration tests
-
-Read `references/integration-tests.md` for the suite layout, fixtures, and canonical allow/deny test shapes. The minimum bar for a new authz'd resource: each managed role's expected 200-vs-403 matrix on the new routes, and (if enterprise/FGA behavior matters) per-object scoping with a custom role — granted instance succeeds, non-granted instance gets 403, revoke flips it back to 403.
-
-Python test conventions that are hard rules in this repo: inline `requests.*` calls directly (never wrap single API calls in helpers), always pass `timeout=`, and run `make py-fmt && make py-lint` before finishing.
-
-## Verification
-
-Run these before declaring the work done:
-
-```bash
-make go-build-community
-```
-
-Consistency greps — every one of these must hold:
-
-- the new `Kind` var appears in BOTH the `Kinds` slice (`registry_kind.go`) and `Kind.Enum()` (`kind.go`)
-- the three `generate` commands from step 6 have been run and leave `git diff` clean when re-run
-- if the resource is UI-gated, it appears in `allowedResources` in `cmd/authz.go` and `permissions.type.ts` was regenerated
-- the new `Resource` var appears in the `Resources` slice (`registry_resource.go`)
-- every `ResourceDef` in the route file references the registered resource and one of its allowed verbs
-- every route's `SecuritySchemes` scope matches its `ResourceDef` verb
-- if `ManagedRoleToTransactions` changed, `managed_role_transactions.json` changed with it
-
-Then run the relevant integration suites (`make py-test-setup` from the repo root boots the environment; pytest runs from `tests/`):
-
-```bash
-uv run pytest --basetemp=./tmp/ -vv --reuse integration/tests/role/
-uv run pytest --basetemp=./tmp/ -vv --reuse integration/tests/<your-suite>/
-```
-
-General repo conventions apply throughout: no code comments (the grouping comments in `registry_managed_role.go` are the sole exception), complete descriptive names, and never commit without an explicit ask.

.claude/skills/authz-configurator/references/integration-tests.md

@@ -1,114 +0,0 @@
-# Authz Integration Tests Reference
-
-Existing authz suites to imitate: `integration/tests/role/` (managed roles, custom-role CRUD, FGA scoping), `integration/tests/serviceaccount/` (API-key auth by role, role assignment), `integration/tests/passwordauthn/04_role.py` (user role changes, editor denied on admin endpoints).
-
-## Where a new test goes
-
-- Suite package: `tests/integration/tests/<suite>/` — pick the existing suite matching the feature's domain, or create a new package when the feature is its own domain.
-- File name: two-digit ordered prefix, `NN_<topic>.py` (`03_fga.py`, `04_roles.py`). Files in a suite run in order; setup tests early in the file establish state that later tests use.
-- Golden/testdata JSON: `tests/integration/testdata/<suite>/`, loaded via `fixtures.fs.get_testdata_file_path`.
-- If the change touched `ManagedRoleToTransactions`, update `tests/integration/testdata/role/managed_role_transactions.json` — `role/01_register.py` asserts every managed role's verb/type/kind matrix against it.
-
-## Environment and running
-
-`make` targets run from the repo root; direct `uv run pytest` commands run from `tests/`:
-
-```bash
-make py-test-setup                # repo root — boot the stack once (~4 min), keep it with --reuse
-cd tests
-uv run pytest --basetemp=./tmp/ -vv --reuse integration/tests/<suite>/
-uv run pytest --basetemp=./tmp/ -vv --reuse integration/tests/role/03_fga.py::test_read_scoped_to_granted_role
-make py-test-teardown             # repo root — destroy when done; never mix --reuse and --teardown
-make py-fmt && make py-lint       # repo root — mandatory before finishing
-```
-
-## Fixtures you'll need
-
-From `tests/fixtures/auth.py` (registered via `pytest_plugins` in `tests/conftest.py`):
-
-- `signoz: types.SigNoz` — the running stack; build URLs with `signoz.self.host_configs["8080"].get("/api/v1/...")`.
-- `create_user_admin` — package-scoped; registers the first admin (`USER_ADMIN_EMAIL` / `USER_ADMIN_PASSWORD`). Take it as an unused argument in every test that needs the org to exist.
-- `get_token(email, password) -> str` — bearer token for a user.
-- `add_license(signoz, make_http_mocks, get_token)` — custom roles are enterprise-only; call it in a `test_apply_license` at the top of any suite that creates custom roles.
-- `create_active_user(signoz, admin_token, email=..., role="signoz-viewer", password=..., name=...) -> user_id` — invite + activate. `role` is a managed role name looked up verbatim (e.g. `signoz-viewer`).
-- `change_user_role(signoz, admin_token, user_id, old_role, new_role)` — e.g. `"signoz-viewer"` → your custom role name.
-
-From `tests/fixtures/role.py`:
-
-- `create_role(token, name, transaction_groups=None, description="") -> role_id` (fixture).
-- `find_role_by_name(signoz, token, name) -> role_id` — plain function, import `from fixtures.role import find_role_by_name`.
-- `transaction_group(relation, type_name, kind_name, selectors)` — builds one permission entry, e.g. `transaction_group("read", "metaresource", "thing", ["*"])` or with a specific instance name/ID as selector.
-
-From `tests/fixtures/serviceaccount.py`:
-
-- `create_service_account_with_key(signoz, token, name, role="signoz-admin") -> (sa_id, api_key)`.
-- Service accounts authenticate with the header `SIGNOZ-API-KEY: <key>`; users with `Authorization: Bearer <token>`.
-
-Hard rule: inline `requests.get/post/put/delete` calls directly in tests — do not wrap single API calls in helper functions or fixtures. Always pass `timeout=5`. Include the response text in assertion messages so failures are diagnosable.
-
-## Shape 1: managed-role matrix (community-safe)
-
-For each role, assert the expected status on each new route. Pattern from `serviceaccount/03_auth.py`:
-
-```python
-def test_editor_forbidden_on_admin_endpoint(signoz, create_user_admin, get_token):
-    token = get_token(USER_ADMIN_EMAIL, USER_ADMIN_PASSWORD)
-    _, api_key = create_service_account_with_key(signoz, token, "sa-role-editor", role="signoz-editor")
-
-    resp = requests.get(
-        signoz.self.host_configs["8080"].get("/api/v1/service_accounts"),
-        headers={"SIGNOZ-API-KEY": api_key},
-        timeout=5,
-    )
-    assert resp.status_code == HTTPStatus.FORBIDDEN, f"expected 403, got {resp.status_code}: {resp.text}"
-```
-
-The user-token variant creates an editor/viewer via `create_active_user` and asserts 403 on the route, 200 for admin.
-
-## Shape 2: per-object FGA scoping (enterprise, custom role)
-
-Grant instance verbs on one object only; assert the other stays forbidden. Structure from `role/03_fga.py`:
-
-```python
-def test_apply_license(signoz, create_user_admin, make_http_mocks, get_token):
-    add_license(signoz, make_http_mocks, get_token)
-
-
-def test_setup_actor(signoz, create_user_admin, get_token, create_role):
-    admin_token = get_token(USER_ADMIN_EMAIL, USER_ADMIN_PASSWORD)
-    create_role(
-        admin_token,
-        "thing-fga-actor",
-        [
-            transaction_group("read", "metaresource", "thing", [_TARGET_A_ID]),
-            transaction_group("list", "metaresource", "thing", ["*"]),
-        ],
-    )
-    user_id = create_active_user(signoz, admin_token, email=_ACTOR_EMAIL, role="signoz-viewer", password=_ACTOR_PASSWORD, name="thing fga actor")
-    change_user_role(signoz, admin_token, user_id, "signoz-viewer", "thing-fga-actor")
-
-
-def test_read_scoped_to_grant(signoz, create_user_admin, get_token):
-    token = get_token(_ACTOR_EMAIL, _ACTOR_PASSWORD)
-
-    resp = requests.get(signoz.self.host_configs["8080"].get(f"/api/v1/things/{_TARGET_A_ID}"), headers={"Authorization": f"Bearer {token}"}, timeout=5)
-    assert resp.status_code == HTTPStatus.OK, resp.text
-
-    resp = requests.get(signoz.self.host_configs["8080"].get(f"/api/v1/things/{_TARGET_B_ID}"), headers={"Authorization": f"Bearer {token}"}, timeout=5)
-    assert resp.status_code == HTTPStatus.FORBIDDEN, f"expected 403, got {resp.status_code}: {resp.text}"
-```
-
-Key semantics to test (they mirror the selector rules on the route side):
-
-- `read`/`update`/`delete` granted on a specific selector authorize only that instance; `*` authorizes all.
-- `create` and `list` are collection-scoped — only a `*` grant makes them pass, and `list` on `*` returns every instance including ones the caller can't `read` individually.
-- Revoking the grant (update the role's transaction groups, or `change_user_role` back) flips the previously-allowed call to 403.
-
-Module-level constants for names/emails (see `role/03_fga.py` — `_ACTOR_ROLE_NAME`, `_TARGET_A`) keep the setup test and the assertion tests in sync.
-
-## What "done" looks like
-
-- Every new route appears in at least one allow case and one deny case.
-- Suites that create custom roles start with `test_apply_license`.
-- `make py-fmt && make py-lint` pass.
-- The suite passes against a `--reuse` stack: `uv run pytest --basetemp=./tmp/ -vv --reuse integration/tests/<suite>/`.

.claude/skills/authz-configurator/references/route-wiring.md

@@ -1,155 +0,0 @@
-# Route Wiring Reference
-
-All examples below are real code from `pkg/apiserver/signozapiserver/serviceaccount.go`. Match this style exactly.
-
-## Basic route: create (wildcard selector, response-phase ID)
-
-```go
-if err := router.Handle("/api/v1/service_accounts", handler.New(
-    provider.authzMiddleware.CheckResources(provider.serviceAccountHandler.Create, authtypes.SigNozAdminRoleName),
-    handler.OpenAPIDef{
-        ID:                  "CreateServiceAccount",
-        Tags:                []string{"serviceaccount"},
-        Summary:             "Create service account",
-        Description:         "This endpoint creates a service account",
-        Request:             new(serviceaccounttypes.PostableServiceAccount),
-        Response:            new(types.Identifiable),
-        ResponseContentType: "application/json",
-        SuccessStatusCode:   http.StatusCreated,
-        ErrorStatusCodes:    []int{http.StatusBadRequest, http.StatusConflict},
-        SecuritySchemes:     newScopedSecuritySchemes([]string{coretypes.ResourceServiceAccount.Scope(coretypes.VerbCreate)}),
-    },
-    handler.WithResourceDefs(handler.BasicResourceDef{
-        Resource: coretypes.ResourceServiceAccount,
-        Verb:     coretypes.VerbCreate,
-        Category: coretypes.ActionCategoryAccessControl,
-        ID:       coretypes.ResponseJSONPath("data.id"),
-        Selector: coretypes.WildcardSelector,
-    }),
-)).Methods(http.MethodPost).GetError(); err != nil {
-    return err
-}
-```
-
-Create checks the wildcard (can the caller create *any* instance?) but still records the new instance's ID for audit via `ResponseJSONPath` — the ID only exists after the handler runs.
-
-Instance routes (read/update/delete) differ only in verb, `ID: coretypes.PathParam("id")`, and `Selector: coretypes.IDSelector`. List routes use `WildcardSelector` and omit `ID` entirely.
-
-Pick the `Category` matching the resource's domain — grep `ActionCategory` in `pkg/types/coretypes/` for the registered values (`ActionCategoryAccessControl` is for access-control resources; observability resources use their own categories).
-
-## ID extractors (`pkg/types/coretypes/extractor.go`)
-
-| Extractor | Phase | Use for |
-|---|---|---|
-| `PathParam("id")` | request | ID in the URL path |
-| `BodyJSONPath("data.id")` | request | ID in the request body (gjson path) |
-| `BodyJSONArray("ids")` | request | multiple IDs in a body array |
-| `ResponseJSONPath("data.id")` | response | ID known only after the handler (create) |
-| `NewResourceIDExtractor(phase, fn)` | either | ID needs a lookup (see below) |
-| `OneID(extractor)` | — | lifts a single-ID extractor where a multi-ID one is required (`SourceIDs`/`TargetIDs`/`ChildIDs`) |
-
-Custom extractor example — the route path carries a service-account-role ID but the check needs the underlying role ID, so the extractor resolves it through the module:
-
-```go
-func (provider *provider) roleIDExtractor() coretypes.ResourceIDExtractor {
-    return coretypes.NewResourceIDExtractor(coretypes.PhaseRequest, func(ec coretypes.ExtractorContext) (string, error) {
-        if ec.Request == nil {
-            return "", nil
-        }
-
-        claims, err := authtypes.ClaimsFromContext(ec.Request.Context())
-        if err != nil {
-            return "", err
-        }
-
-        serviceAccountRoleID, err := valuer.NewUUID(mux.Vars(ec.Request)["id"])
-        if err != nil {
-            return "", err
-        }
-
-        serviceAccountRole, err := provider.serviceAccountGetter.GetServiceAccountRole(ec.Request.Context(), valuer.MustNewUUID(claims.OrgID), serviceAccountRoleID)
-        if err != nil {
-            return "", err
-        }
-
-        return serviceAccountRole.RoleID.String(), nil
-    })
-}
-```
-
-## Custom SelectorFunc
-
-Use one when the extracted ID is not what FGA objects use. Roles are the canonical case: routes receive a role UUID, but FGA role objects are keyed by role *name*. Always include the wildcard alongside the specific selector — authorization on `*` implies authorization on every instance:
-
-```go
-func (provider *provider) roleSelector(ctx context.Context, resource coretypes.Resource, id string, orgID valuer.UUID) ([]coretypes.Selector, error) {
-    roleID, err := valuer.NewUUID(id)
-    if err != nil {
-        return nil, err
-    }
-
-    role, err := provider.authzService.Get(ctx, orgID, roleID)
-    if err != nil {
-        return nil, err
-    }
-
-    return []coretypes.Selector{
-        resource.Type().MustSelector(role.Name),
-        resource.Type().MustSelector(coretypes.WildCardSelectorString),
-    }, nil
-}
-```
-
-## Linking routes: siblings (peer-to-peer)
-
-Attaching a role to a service account requires `attach` on **both** resources — the same verb checked on each side. Advertise both scopes:
-
-```go
-SecuritySchemes: newScopedSecuritySchemes([]string{coretypes.ResourceServiceAccount.Scope(coretypes.VerbAttach), coretypes.ResourceRole.Scope(coretypes.VerbAttach)}),
-// ...
-handler.WithResourceDefs(handler.AttachDetachSiblingResourceDef{
-    Verb:           coretypes.VerbAttach,
-    Category:       coretypes.ActionCategoryAccessControl,
-    SourceResource: coretypes.ResourceServiceAccount,
-    SourceIDs:      coretypes.OneID(coretypes.BodyJSONPath("serviceAccountId")),
-    SourceSelector: coretypes.IDSelector,
-    TargetResource: coretypes.ResourceRole,
-    TargetIDs:      coretypes.OneID(coretypes.BodyJSONPath("roleId")),
-    TargetSelector: provider.roleSelector,
-}),
-```
-
-The detach route (`DELETE .../service_account_roles/{id}`) uses `VerbDetach`, and its path `{id}` identifies the **assignment** (the service account role), not the role. Both IDs are resolved from it via lookup-helper extractors — `provider.serviceAccountIDExtractor()` and `provider.roleIDExtractor()` fetch the assignment and return its service account ID and role ID.
-
-## Linking routes: parent-child
-
-Creating an API key *under* a service account checks two different things: `create` on the child resource, and `attach` on the parent. Declare both defs in the same `WithResourceDefs`:
-
-```go
-handler.WithResourceDefs(
-    handler.BasicResourceDef{
-        Resource: coretypes.ResourceMetaResourceFactorAPIKey,
-        Verb:     coretypes.VerbCreate,
-        Category: coretypes.ActionCategoryAccessControl,
-        ID:       coretypes.ResponseJSONPath("data.id"),
-        Selector: coretypes.WildcardSelector,
-    },
-    handler.AttachDetachParentChildResourceDef{
-        Verb:           coretypes.VerbAttach,
-        Category:       coretypes.ActionCategoryAccessControl,
-        ParentResource: coretypes.ResourceServiceAccount,
-        ParentID:       coretypes.PathParam("id"),
-        ParentSelector: coretypes.IDSelector,
-        ChildResource:  coretypes.ResourceMetaResourceFactorAPIKey,
-        ChildIDs:       coretypes.OneID(coretypes.ResponseJSONPath("data.id")),
-    },
-),
-```
-
-Within the parent-child def, the child is only recorded for audit — the authz check on the child comes from its own `BasicResourceDef`. Deletion mirrors this with `VerbDelete` on the child and `VerbDetach` on the parent (see the `/api/v1/service_accounts/{id}/keys/{fid}` DELETE route).
-
-## Legacy gates — do not use for new routes
-
-`ViewAccess`/`EditAccess`/`AdminAccess` only check "does the caller hold one of these roles". They give up per-resource granularity, produce no audit resources, and don't advertise scopes. They exist for old routes; new routes use `CheckResources` + `ResourceDef`. `OpenAccess` performs no authorization at all (authentication still applies — used for `/me`-style routes); `CheckWithoutClaims` is for anonymous routes such as public dashboards.
-
-Full def types live in `pkg/http/handler/resourcedef.go`; middleware behavior in `pkg/http/middleware/authz.go` and `pkg/http/middleware/resource.go`.

frontend/package.json

@@ -163,9 +163,9 @@
     "@commitlint/config-conventional": "20.4.4",
     "@jest/globals": "30.4.1",
     "@jest/types": "30.2.0",
-    "@storybook/addon-a11y": "10.6.3",
-    "@storybook/addon-docs": "10.6.3",
-    "@storybook/react-vite": "10.6.3",
+    "@storybook/addon-a11y": "10.5.9",
+    "@storybook/addon-docs": "10.5.9",
+    "@storybook/react-vite": "10.5.9",
     "@storybook/test-runner": "0.24.5",
     "@testing-library/dom": "8.20.0",
     "@testing-library/jest-dom": "5.16.5",
@@ -213,10 +213,10 @@
     "redux-mock-store": "1.5.4",
     "sass": "1.97.3",
     "sharp": "0.35.4",
-    "storybook": "10.6.3",
+    "storybook": "10.5.9",
     "stylelint": "17.15.0",
     "svgo": "4.1.0",
-    "ts-jest": "29.4.15",
+    "ts-jest": "29.4.9",
     "typescript-plugin-css-modules": "5.2.0",
     "use-sync-external-store": "1.6.0",
     "vite-plugin-checker": "0.12.0",

frontend/pnpm-lock.yaml

@@ -8,9 +8,9 @@ overrides:
   '@babel/core@<=7.29.0': '>=7.29.6 <8'
   '@istanbuljs/load-nyc-config>js-yaml': '>=4.3.2 <5'
   '@xmldom/xmldom@<0.8.15': '>=0.8.15 <0.9'
-  brace-expansion@<1.1.21: '>=1.1.21 <2'
-  brace-expansion@>=2.0.0 <2.1.7: '>=2.1.7 <3'
-  brace-expansion@>=5.0.0 <5.0.12: '>=5.0.12 <6'
+  brace-expansion@<1.1.18: '>=1.1.18 <2'
+  brace-expansion@>=2.0.0 <2.1.4: '>=2.1.4 <3'
+  brace-expansion@>=5.0.0 <5.0.9: '>=5.0.9 <6'
   browserslist@<4.28.7: '>=4.28.7 <5'
   cookie@<0.7.0: '>=0.7.1 <1'
   dompurify@<=3.4.12: '>=3.4.13 <4'
@@ -364,17 +364,17 @@ importers:
         specifier: 30.2.0
         version: 30.2.0
       '@storybook/addon-a11y':
-        specifier: 10.6.3
-        version: 10.6.3(storybook@10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))
+        specifier: 10.5.9
+        version: 10.5.9(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))
       '@storybook/addon-docs':
-        specifier: 10.6.3
-        version: 10.6.3(@types/react-dom@18.0.10)(@types/react@18.0.26)(storybook@10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))
+        specifier: 10.5.9
+        version: 10.5.9(@types/react-dom@18.0.10)(@types/react@18.0.26)(esbuild@0.28.1)(rolldown-vite@7.3.1(@types/node@16.18.25)(esbuild@0.28.1)(jiti@2.6.1)(less@4.9.0)(sass@1.97.3)(stylus@0.62.0)(terser@5.46.2)(yaml@2.9.1))(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))
       '@storybook/react-vite':
-        specifier: 10.6.3
-        version: 10.6.3(@types/react-dom@18.0.10)(@types/react@18.0.26)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(rolldown-vite@7.3.1(@types/node@16.18.25)(esbuild@0.28.1)(jiti@2.6.1)(less@4.9.0)(sass@1.97.3)(stylus@0.62.0)(terser@5.46.2)(yaml@2.9.1))(storybook@10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))(typescript@5.9.3)
+        specifier: 10.5.9
+        version: 10.5.9(@types/react-dom@18.0.10)(@types/react@18.0.26)(esbuild@0.28.1)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(rolldown-vite@7.3.1(@types/node@16.18.25)(esbuild@0.28.1)(jiti@2.6.1)(less@4.9.0)(sass@1.97.3)(stylus@0.62.0)(terser@5.46.2)(yaml@2.9.1))(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))(typescript@5.9.3)
       '@storybook/test-runner':
         specifier: 0.24.5
-        version: 0.24.5(@types/node@16.18.25)(babel-plugin-macros@3.1.0)(storybook@10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))(ts-node@10.9.1(@swc/core@1.16.2)(@types/node@16.18.25)(typescript@5.9.3))
+        version: 0.24.5(@types/node@16.18.25)(babel-plugin-macros@3.1.0)(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))(ts-node@10.9.1(@swc/core@1.16.2)(@types/node@16.18.25)(typescript@5.9.3))
       '@testing-library/dom':
         specifier: 8.20.0
         version: 8.20.0
@@ -514,8 +514,8 @@ importers:
         specifier: 0.35.4
         version: 0.35.4(@types/node@16.18.25)
       storybook:
-        specifier: 10.6.3
-        version: 10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0)
+        specifier: 10.5.9
+        version: 10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0)
       stylelint:
         specifier: 17.15.0
         version: 17.15.0(typescript@5.9.3)
@@ -523,8 +523,8 @@ importers:
         specifier: 4.1.0
         version: 4.1.0
       ts-jest:
-        specifier: 29.4.15
-        version: 29.4.15(@babel/core@7.29.7)(@jest/transform@30.4.1)(@jest/types@30.2.0)(babel-jest@29.6.4(@babel/core@7.29.7))(esbuild@0.28.1)(jest-util@30.4.1)(jest@30.2.0(@types/node@16.18.25)(babel-plugin-macros@3.1.0)(ts-node@10.9.1(@swc/core@1.16.2)(@types/node@16.18.25)(typescript@5.9.3)))(typescript@5.9.3)
+        specifier: 29.4.9
+        version: 29.4.9(@babel/core@7.29.7)(@jest/transform@30.4.1)(@jest/types@30.2.0)(babel-jest@29.6.4(@babel/core@7.29.7))(esbuild@0.28.1)(jest-util@30.4.1)(jest@30.2.0(@types/node@16.18.25)(babel-plugin-macros@3.1.0)(ts-node@10.9.1(@swc/core@1.16.2)(@types/node@16.18.25)(typescript@5.9.3)))(typescript@5.9.3)
       typescript-plugin-css-modules:
         specifier: 5.2.0
         version: 5.2.0(ts-node@10.9.1(@swc/core@1.16.2)(@types/node@16.18.25)(typescript@5.9.3))(typescript@5.9.3)
@@ -1525,8 +1525,8 @@ packages:
     peerDependencies:
       react: '>=16.8.0'
 
-  '@emnapi/core@1.11.0':
-    resolution: {integrity: sha512-l9Oo58x0HOP5znGzVhYW9U3e5wVuA4LAZU2AGezTmkhO1CgQRFDhDg4nneHsu/t3WniXg9QrG2nIXL/ZS8ln8Q==}
+  '@emnapi/core@1.11.2':
+    resolution: {integrity: sha512-TC8MkTuZUtcTSiFeuC0ksCh9QIJ5+F21MvZ4Wn4ORfYaFJ/0dsiudv5tVkejgwZlwQ39jL9WWDe2lz8x0WglOA==}
 
   '@emnapi/core@1.8.1':
     resolution: {integrity: sha512-AvT9QFpxK0Zd8J0jopedNm+w/2fIzvtPKPjqyw9jwvBaReTTqPBk9Hixaz7KbjimP+QNz605/XnjFcDAL2pqBg==}
@@ -1534,8 +1534,8 @@ packages:
   '@emnapi/core@1.9.2':
     resolution: {integrity: sha512-UC+ZhH3XtczQYfOlu3lNEkdW/p4dsJ1r/bP7H8+rhao3TTTMO1ATq/4DdIi23XuGoFY+Cz0JmCbdVl0hz9jZcA==}
 
-  '@emnapi/runtime@1.11.0':
-    resolution: {integrity: sha512-55coeOFKHv1ywEcUXJtWU5f+Jr/W5tZDvZig8DLKSwUN1JpROQ4rk/SNOQiFWmaR/VKF4zuFyW1B8JduOSv6Pg==}
+  '@emnapi/runtime@1.11.2':
+    resolution: {integrity: sha512-kyOl3X0DuTiT1h2ft8r2fYO8JYtU9a9Xis/zBSiGArNaagCOWx90N1k2wxp18czFDH+OgcWGb5ZP/XMt3dcyPA==}
 
   '@emnapi/runtime@1.11.3':
     resolution: {integrity: sha512-Xz4Tpyki7XyrpbUK1jR1AhdAdaXyhhY4lZ3neLodmhpuWfy2PAQN5B46sAiU4liOXGLkHypn/qU+jvfWSCYYLA==}
@@ -2170,9 +2170,6 @@ packages:
   '@jridgewell/sourcemap-codec@1.5.5':
     resolution: {integrity: sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==}
 
-  '@jridgewell/sourcemap-codec@1.6.0':
-    resolution: {integrity: sha512-T7jf+5zgsZHwNJ4lvQ7/aezbyk0nNX+zJVWpmHA7VYsEx7a7qr5Rg5IbtJFqkgze5Y2sruq1RUY8Q837Od7iFw==}
-
   '@jridgewell/trace-mapping@0.3.31':
     resolution: {integrity: sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw==}
 
@@ -2455,106 +2452,106 @@ packages:
   '@oxc-project/types@0.127.0':
     resolution: {integrity: sha512-aIYXQBo4lCbO4z0R3FHeucQHpF46l2LbMdxRvqvuRuW2OxdnSkcng5B8+K12spgLDj93rtN3+J2Vac/TIO+ciQ==}
 
-  '@oxc-resolver/binding-android-arm-eabi@11.21.2':
-    resolution: {integrity: sha512-xQoCRv+gKax9KTdwdaQNnAFOai8neay7g3jExDIORzhbrejwGSJaZNTdOJHR5ziLg2joMxOCMOFMo4zuxza2uQ==}
+  '@oxc-resolver/binding-android-arm-eabi@11.24.2':
+    resolution: {integrity: sha512-y09e0L0SRI2OA2tUIrjBgoV3eH5hvUKXNkJqXmNo5V2WxIjyC7I7aJfRLMEVpA8yi95f90gFDvO0VMgrDw+vwA==}
     cpu: [arm]
     os: [android]
 
-  '@oxc-resolver/binding-android-arm64@11.21.2':
-    resolution: {integrity: sha512-HF5oiE2L05yInPYCFD/4uxSrEZW4SuIfn99Y6L1xnJnzl066JR+MJs2rIdstw8A2MPlAKH+13dpFPNycjqzvGg==}
+  '@oxc-resolver/binding-android-arm64@11.24.2':
+    resolution: {integrity: sha512-cl4icWaZFnLdg8m6qtnh5rBMuGbxc/ptStFHLeCNwr+2cZjkjNwQu/jYRS0CHlnPecOJMpuS5M6/BH+0J/YkEg==}
     cpu: [arm64]
     os: [android]
 
-  '@oxc-resolver/binding-darwin-arm64@11.21.2':
-    resolution: {integrity: sha512-UX4u49CVCAD8QZNELaW8eMGgMAGwFWYEPbvNsh+3r/gs4NX3KfpiACMVwRQT0EuH3uat9hM5Zl+Ppm9pJD8tgg==}
+  '@oxc-resolver/binding-darwin-arm64@11.24.2':
+    resolution: {integrity: sha512-At29QEMF6HajbQvgY8K6OXnHD1x9rad74xBEfmCB6ZqCGsdq75aK7tOYcTbOanMy8qdIBrfL3SMr3p/lfSlb9w==}
     cpu: [arm64]
     os: [darwin]
 
-  '@oxc-resolver/binding-darwin-x64@11.21.2':
-    resolution: {integrity: sha512-J9xPx7YBkrRmJ+xl561ztnMWEc1aOyjEIxBiGX1dVb3u7bGSnfObfcZk+Pd+uM0HZAPNsQ1xvD8j52A/uOSqNQ==}
+  '@oxc-resolver/binding-darwin-x64@11.24.2':
+    resolution: {integrity: sha512-A5Kqr1EUj4oIL5CF4WRssq/o5P0Y11cwoFouMRmQ7YnC/A8V93nv1nb7aSU8HwcgmXropjLNkVTl4MN87cu28Q==}
     cpu: [x64]
     os: [darwin]
 
-  '@oxc-resolver/binding-freebsd-x64@11.21.2':
-    resolution: {integrity: sha512-fRlt7OvSaQkWj6+EDTVxawVxOlqJB2QSnBfkeCyK4RTvsGctbw3BiH2Tb7DzMs7bikc4BRBpvWP5zF9K8b54Zg==}
+  '@oxc-resolver/binding-freebsd-x64@11.24.2':
+    resolution: {integrity: sha512-R5xkRBRRz7ceH/P5Jrc6G7FmdUdgpLYyESFAUDVTNQ9K0sGPxcp4ljiwEwEqsvNcQ4sYbMRrWcHHBCu7ksAJVw==}
     cpu: [x64]
     os: [freebsd]
 
-  '@oxc-resolver/binding-linux-arm-gnueabihf@11.21.2':
-    resolution: {integrity: sha512-gK+vPUcPQITkGwBKpZGrcDHSlU6eDGl7AQacxS2CEKAZIBHWkOVFeJwLZ4tYnA1acJqRM5lt7yYwPCVqGHIJ7A==}
+  '@oxc-resolver/binding-linux-arm-gnueabihf@11.24.2':
+    resolution: {integrity: sha512-k/RuYL4L/R58IBn3wT5ma3Wh4k62bp1eYCFRWCmMsasUOqL+H6sW0VGFadEzKWXFFlz+2uIMoeMk9ySSZJHgbg==}
     cpu: [arm]
     os: [linux]
 
-  '@oxc-resolver/binding-linux-arm-musleabihf@11.21.2':
-    resolution: {integrity: sha512-L/Rgas7SrOKy/z7IH+HxSFRqVO4PuLDKLEGKvnhoCBBq3UJ0YzGBou3qMzaAGgkJwsIvX2pBF+7ojzfUhLiZxQ==}
+  '@oxc-resolver/binding-linux-arm-musleabihf@11.24.2':
+    resolution: {integrity: sha512-bnHAak3ujYfH5pKk4NieFNbvYvernfoQDgwLddbZ3OtMYrem87/qjlA+u+aKG0oZcqSLGCful/6/CEA+aeAgaA==}
     cpu: [arm]
     os: [linux]
 
-  '@oxc-resolver/binding-linux-arm64-gnu@11.21.2':
-    resolution: {integrity: sha512-CUEYvlX1Fk7E9kUMzuswru1J9HLxMwnpDeQGjQuI4ZH+iNCoa2X9T+pvyzrbsgl7WnIeTFTlNlHsRfVdf5g9/g==}
+  '@oxc-resolver/binding-linux-arm64-gnu@11.24.2':
+    resolution: {integrity: sha512-vDT3KHgzYp47gmtNOqL2VNhCyl5Zv643eyxm//A68J8DeUGXrvD1pZFiaT4jSfe+RInfnn1R2yVHye4enx6RnA==}
     cpu: [arm64]
     os: [linux]
     libc: [glibc]
 
-  '@oxc-resolver/binding-linux-arm64-musl@11.21.2':
-    resolution: {integrity: sha512-ViN1ZibQyxwC67GpoP33oo+S9UyUnkog13vzQb9+v9bCNvrVzJuk0MRdacjtv/9xfRMVF/eqHFyl8YOeykI10Q==}
+  '@oxc-resolver/binding-linux-arm64-musl@11.24.2':
+    resolution: {integrity: sha512-+kMlQvbzfyEYtu5FcjE4p+ttBLpKW4d/AsAsuE69BxV6V4twZJeIQZFfD8gh/wqglY0MkPSezWXQH0jBV13MUw==}
     cpu: [arm64]
     os: [linux]
     libc: [musl]
 
-  '@oxc-resolver/binding-linux-ppc64-gnu@11.21.2':
-    resolution: {integrity: sha512-CU1sCqWnhGqYD5I1HedHk5pujrn7ssDkNB/AEQd/pd3D/EojVSgJUlpbafwIbyhia3PgIfkvdFpRPWSALzVumA==}
+  '@oxc-resolver/binding-linux-ppc64-gnu@11.24.2':
+    resolution: {integrity: sha512-shjfMhmZ3gq9fv/w7bi3PnZlgOPG+2QAOFf0BJF0EgBSIGZ6PMLN2zbGEblTUYB/NKVDRyYhE2ff3dJ1QqNPkA==}
     cpu: [ppc64]
     os: [linux]
     libc: [glibc]
 
-  '@oxc-resolver/binding-linux-riscv64-gnu@11.21.2':
-    resolution: {integrity: sha512-jWVyZtIHca4Gb96x7dag+y69vlei7ffjrsveLkmf2ZhqEAz6ZSBnY1GWvgZUaZlwZP62A3xD092BW97Q5VGc+g==}
+  '@oxc-resolver/binding-linux-riscv64-gnu@11.24.2':
+    resolution: {integrity: sha512-zGelwFR5oRo+b69k8Lrzun86DyUHzfKN6cnjbR9l7Z7NIRznOE/2ZvPa1IUKqAL2PzAXOdwkfVqNvO1H2RlpAw==}
     cpu: [riscv64]
     os: [linux]
     libc: [glibc]
 
-  '@oxc-resolver/binding-linux-riscv64-musl@11.21.2':
-    resolution: {integrity: sha512-LF29obFqNgBUgDX7rmUK7M4D0JQG5LxhYzn3xXmECcHU9aQAdWG7NiY052qybtesEdwHQXKNTWYQ7mTsybNvWg==}
+  '@oxc-resolver/binding-linux-riscv64-musl@11.24.2':
+    resolution: {integrity: sha512-qxZ1SWCXJY0eyhAlP6Lmo9F2Nrtx7EkYj9oCgL8apDPCwXwCEDA2U697bbT81JIc2IrVjxO4KX6WU2N+oN9Z4w==}
     cpu: [riscv64]
     os: [linux]
     libc: [musl]
 
-  '@oxc-resolver/binding-linux-s390x-gnu@11.21.2':
-    resolution: {integrity: sha512-+NYcm+cCHBbtdQQ3A4phQTSuVRYnNHz7wrl9XRAPEovcdoqi0mb1K5ZOl+jN54ZD+q1zz3V0vltbFJmzecJKmw==}
+  '@oxc-resolver/binding-linux-s390x-gnu@11.24.2':
+    resolution: {integrity: sha512-sGCecF3cx2DFlH4t/z7ApnOnXqN48p5p5mlHDEnHTAukQa2P+qMVE4CwyWE9W+q/m3QJ7kKfGrIjax31f44oFQ==}
     cpu: [s390x]
     os: [linux]
     libc: [glibc]
 
-  '@oxc-resolver/binding-linux-x64-gnu@11.21.2':
-    resolution: {integrity: sha512-UQqZDdG2r2HhAOsZEgufkIWHPQ886IUyuJQkoZByvzhW8j51R4UNzGBJFkTiTnLhQnggwJRdJgFWK4uY6ZVIMw==}
+  '@oxc-resolver/binding-linux-x64-gnu@11.24.2':
+    resolution: {integrity: sha512-k/VlMMcSzMlahb3/fENM4rTlsJ0s3fFROA0KXPBmKggqmTSaE383sl8F3KCOXPLmVsYfW6hCitMhXCEtNeZxxg==}
     cpu: [x64]
     os: [linux]
     libc: [glibc]
 
-  '@oxc-resolver/binding-linux-x64-musl@11.21.2':
-    resolution: {integrity: sha512-3Q9PMRjalWkT6NZ4jfujuqTCFwoWErg3y3BnOgb544B8IMw4PktiwWOigMfOHNRLMghZeJ7hpfpZf4CP7rV7Og==}
+  '@oxc-resolver/binding-linux-x64-musl@11.24.2':
+    resolution: {integrity: sha512-8hbnZyNi97b/8wapYaIF9+t9GmZKBW2vunaOc3h9HGJptH7b7XpvZqOTBSm/MpTjr7H497BlgOaSfLUdhmy2bw==}
     cpu: [x64]
     os: [linux]
     libc: [musl]
 
-  '@oxc-resolver/binding-openharmony-arm64@11.21.2':
-    resolution: {integrity: sha512-Eljeq3ndtyKhM+Es8LITi4Zl2htzuRZcrPMF3kMCsrILztvU6AjZ3FuEhHHKobPUB9rMpzLpJP5bDqXI7r+iog==}
+  '@oxc-resolver/binding-openharmony-arm64@11.24.2':
+    resolution: {integrity: sha512-MvyGik3a6pVgZ0t/kWlbmFxFLmXQJwgLsY2eYFHLpy0wGwRbfzeIGgDwQ3kXqE30z+kSXennRkCrT7TUvkptNg==}
     cpu: [arm64]
     os: [openharmony]
 
-  '@oxc-resolver/binding-wasm32-wasi@11.21.2':
-    resolution: {integrity: sha512-HGDbNsIywqc4LxU38+CTJNnB/6BF7rheWOJ259b4eE0aEnelYblC8x+1tEd63bp31fYne63RQz9Jb4yVnC7Yig==}
+  '@oxc-resolver/binding-wasm32-wasi@11.24.2':
+    resolution: {integrity: sha512-vHcssMPwO08RTvj/c0iOBz90attxyG3wQJ0dTcyEQK43LRpcdLWZlV5feBhv6Isn6ahbQIzHbCgfa81+RiML0Q==}
     engines: {node: '>=14.0.0'}
     cpu: [wasm32]
 
-  '@oxc-resolver/binding-win32-arm64-msvc@11.21.2':
-    resolution: {integrity: sha512-iWx25CBEgH49iE9q5coEGI/jb1jl5kkCY9z6U5Og67xCkQ/WFMDc2J5U78+AE91SUxM2NqSLhJC8/PLfWnImww==}
+  '@oxc-resolver/binding-win32-arm64-msvc@11.24.2':
+    resolution: {integrity: sha512-uokJqro2iBqkFvJdKQLP7d8/BUmFwESQFVmIJUQKj1Xn1a/LysJoe1vmeECLF5b3jsV8CAL5sEMJXX6SdK9Nhg==}
     cpu: [arm64]
     os: [win32]
 
-  '@oxc-resolver/binding-win32-x64-msvc@11.21.2':
-    resolution: {integrity: sha512-VPoCAhKvCQTlG7vxqaBXcmuvbh77BfnGXj8g0pbvVXpm1F/R8rDVwqIWcEbMzrI1JvJlm8v7T9uMVQb6UctMRg==}
+  '@oxc-resolver/binding-win32-x64-msvc@11.24.2':
+    resolution: {integrity: sha512-UqGPmo56KDfLlfXFAFIrNflHT8tFxWGEivWg3Zeyp4Uy2NlKN1FGPr6/BxcLGG3+kZ6Wp14g5Uj+n71boqZfiw==}
     cpu: [x64]
     os: [win32]
 
@@ -3663,26 +3660,44 @@ packages:
   '@standard-schema/spec@1.1.0':
     resolution: {integrity: sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==}
 
-  '@storybook/addon-a11y@10.6.3':
-    resolution: {integrity: sha512-nqvjpmu5g+PPtEKwgE0qAi4wfuQ9yngOb/1Gm24pBBZOuRsd3UMEBjKORSuAGrIAz9X3LCFfQi7sCcBFXvFbwg==}
+  '@storybook/addon-a11y@10.5.9':
+    resolution: {integrity: sha512-MvXkoJIVRcZrqhWi+wynYAmFkvTWm5aHdJfYohhgPeEJVDRF91zejtOsN7zPRE/lQvBDY+IiomKxeRN3UhWNVw==}
     peerDependencies:
-      storybook: ^10.6.3
+      storybook: ^10.5.9
 
-  '@storybook/addon-docs@10.6.3':
-    resolution: {integrity: sha512-365f712au4w/xvFqEKY6TIvTeGGAY7FKRB8zP4CFa3VSv9oyxHaq/ublFg4YDbCeRagppwl1PZ6k4+PoUor3+A==}
+  '@storybook/addon-docs@10.5.9':
+    resolution: {integrity: sha512-8sFsMkZYrrdqCLdV+hnwTwDF7RaBsBPRwl4wfc8ve9Q/7Yhi5REe/Xjvd8x1yn6fBPPw9tnID9dx6Agdnr81fw==}
     peerDependencies:
       '@types/react': ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
-      storybook: ^10.6.3
+      storybook: ^10.5.9
     peerDependenciesMeta:
       '@types/react':
         optional: true
 
-  '@storybook/builder-vite@10.6.3':
-    resolution: {integrity: sha512-1+WCZZg/fPxxyHDB5sFKniFt9/4RFUIzoNqMujv+BLRROM+gQeyUHvdvoyZOZ51+P8ee+/PgnNKHjsTupV+nOA==}
+  '@storybook/builder-vite@10.5.9':
+    resolution: {integrity: sha512-Zg4JbGQiHFPGlFJ9HM+XPgzKmU/RFPCymhohVRJhBBYfmgaQgz0flWWzscseCDpl638MNd8/r/H+nwuoBgSYDg==}
     peerDependencies:
-      storybook: ^10.6.3
+      storybook: ^10.5.9
       vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
 
+  '@storybook/csf-plugin@10.5.9':
+    resolution: {integrity: sha512-4H5QIHQVtQYCuL43GCRLGjNQhZpQg9gL03ja0DV80kO2Dn9LEt6ol87bSnSjn4VDgcAXtgTzXFvRLknfVgAAqg==}
+    peerDependencies:
+      esbuild: '>=0.28.1 <0.29.0'
+      rollup: '*'
+      storybook: ^10.5.9
+      vite: '*'
+      webpack: '*'
+    peerDependenciesMeta:
+      esbuild:
+        optional: true
+      rollup:
+        optional: true
+      vite:
+        optional: true
+      webpack:
+        optional: true
+
   '@storybook/global@5.0.0':
     resolution: {integrity: sha512-FcOqPAXACP0I3oJ/ws6/rrPT9WGhu915Cg8D02a9YxLo0DE9zI+a9A5gRGvmQ09fiWPukqI8ZAEoQEdWUKMQdQ==}
 
@@ -3691,40 +3706,40 @@ packages:
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
 
-  '@storybook/react-dom-shim@10.6.3':
-    resolution: {integrity: sha512-cJUuPrieiTl06kzlgaU89iG+CtLAgUTt0Xdvm8qFT9yR2qwafSaswhwYWlZCNX4nWuOu7eK7uzWTwzKqyDBOWQ==}
+  '@storybook/react-dom-shim@10.5.9':
+    resolution: {integrity: sha512-7qZD6CSa64p1m/zX9tG4ALcEHlEk0Bx+5++4RL3MFlRCgCFfAomXsCHTzF0RyF8cI4vl+hS7Y0ryjQchVs6UQA==}
     peerDependencies:
       '@types/react': ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       '@types/react-dom': ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
-      storybook: ^10.6.3
+      storybook: ^10.5.9
     peerDependenciesMeta:
       '@types/react':
         optional: true
       '@types/react-dom':
         optional: true
 
-  '@storybook/react-vite@10.6.3':
-    resolution: {integrity: sha512-geWwLi9JnaRG2t9bYBfz+94skARzzXNT1Toaf0lk7Oog13rtNK7ay2pWNm9SP6/L2S7mEjoWu9+zHLpwxXvfIw==}
+  '@storybook/react-vite@10.5.9':
+    resolution: {integrity: sha512-mDI+UssrOEP8IwgBsefLG+gqW1gZbZEPbpH5PoHK/P1WPi8BfrLEqrFi9H9wmMkal/Vh8SmL1awgOi0ir3XwcQ==}
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
-      storybook: ^10.6.3
+      storybook: ^10.5.9
       typescript: '>= 4.9.x'
       vite: ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0
     peerDependenciesMeta:
       typescript:
         optional: true
 
-  '@storybook/react@10.6.3':
-    resolution: {integrity: sha512-3tfAkZNdUyx3I4IjM8dgbNWg4k0gj89Hi1MPiawfTybRRWhvnX2YqV9Ut4mrud7YzRv0v+U7+ZYEvj+maUPaow==}
+  '@storybook/react@10.5.9':
+    resolution: {integrity: sha512-kApGOuNT26NkpioTsr1iT/Q2c44tA7OIsNUSyFqtT7W8k3fRn/jQWfrDegYxty0WG0wxdNMZq2ndRfOOF8HaHw==}
     peerDependencies:
       '@types/react': ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       '@types/react-dom': ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
       react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
-      storybook: ^10.6.3
+      storybook: ^10.5.9
       typescript: '>= 4.9.x'
     peerDependenciesMeta:
       '@types/react':
@@ -4746,14 +4761,14 @@ packages:
   boolbase@1.0.0:
     resolution: {integrity: sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==}
 
-  brace-expansion@1.1.21:
-    resolution: {integrity: sha512-9zeA+KLZNNzglF2TPKRQEDyx6Yby7daAkuy8MiPzpXPsYDWi/DRM8jmwUDxokQjYqBpv5DgPiwD4h4ZZSy1Ujw==}
+  brace-expansion@1.1.18:
+    resolution: {integrity: sha512-Edep/X9fGqVNmzKBVsDYIOtD+z1tuezV70LBjdCst9Tqu76lsnvRiZ6oTic1n+/BIwX6QDGAO94PN4N2SADvtw==}
 
-  brace-expansion@2.1.7:
-    resolution: {integrity: sha512-uZbew1NqdmPDTMJ8ah1y+b+9QEJrfkXFk3RcTQw3X0jW/xRUvFKsg1CfQdSYGdTbXZWExtU3J3ccxtnfw1Fi0g==}
+  brace-expansion@2.1.4:
+    resolution: {integrity: sha512-hGfVzPxthbf3+2yjg/RBs60cB0FhqBS/zvdV/4wn4/BmN0bNMMHPc4V/BbFieqf1TKAGGAHnY4eSjajCl0f2Xg==}
 
-  brace-expansion@5.0.12:
-    resolution: {integrity: sha512-YovQ3rzhaLMIrDjNDMkNS01tea93qhEhG5xy8f6+R0l+dw3Ki+5sCoIoI942iuLZTHWogWktgwVDhU09iNEimQ==}
+  brace-expansion@5.0.9:
+    resolution: {integrity: sha512-ScQ4IuvIEF1TMlP7Zt+vjJ//9zlPb2SDcxWxM3bk8s6t6GGdJ7KO1dCcTidOPJKePW30LE/2cT7wCyPho9/Wxg==}
     engines: {node: 20 || >=22}
 
   braces@3.0.3:
@@ -6134,8 +6149,8 @@ packages:
     resolution: {integrity: sha512-59LZHPdGZVh695Ud9lRzPBVTtlX9ZCV150Er2W43ro37wVof0ctenSaskPPjN7lVTIN8mSZt8PHUNKZuNQUuxw==}
     engines: {node: ^12.22.0 || ^14.16.0 || ^16.0.0 || >=17.0.0}
 
-  handlebars@4.7.10:
-    resolution: {integrity: sha512-P5VJMVM7qgBn6vjXMw8WG9uVI+ncf2pi72j4de4yz5ZULLj2RGqLYaKOYGsgyrViQ0tePOVlN1tDCCXXtFqXKg==}
+  handlebars@4.7.9:
+    resolution: {integrity: sha512-4E71E0rpOaQuJR2A3xDZ+GM1HyWYv1clR58tC8emQNeQe3RH7MAzSbat+V0wG78LQBo6m6bzSG/L4pBuCsgnUQ==}
     engines: {node: '>=0.4.7'}
     hasBin: true
 
@@ -7192,9 +7207,6 @@ packages:
     resolution: {integrity: sha512-ISQTe55T2ao7XtlAStud6qwYPZjE4GK1S/BeVPus4jrq6JuOnQ00YKQC581RWhR122W7msZV263KzVeLoqidyQ==}
     engines: {node: '>=12'}
 
-  magic-string@1.4.3:
-    resolution: {integrity: sha512-z12OxmaPGE0F4xlpGdjuAUckipLpQlTAuAmyGhNoD7ODpYUzvDfvtxUbjM/jwznyP178oju/KDdyi220wNJ0RQ==}
-
   make-dir@3.1.0:
     resolution: {integrity: sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==}
     engines: {node: '>=8'}
@@ -7770,8 +7782,8 @@ packages:
     resolution: {integrity: sha512-bkgD4qHlN7WxLdX8bLXdaU54TtQtAIg/ZBAfm0aje/mo3MRDo3P0hZSgr4U7O3xfX+fQmR5AP04JS/TGcZLcFA==}
     engines: {node: ^20.19.0 || >=22.12.0}
 
-  oxc-resolver@11.21.2:
-    resolution: {integrity: sha512-w5tLwYN3Zo24w5EeWJjJWZOwhYqTtC8PS2B1tIt7BZUuqTIcU07sQValbDw+rq7+AuAGzOHklgK+ifsy4lpXfw==}
+  oxc-resolver@11.24.2:
+    resolution: {integrity: sha512-FY91FiDBj7ls5MsFS9jN3tjz2o0/zsdSsymlakySaBwVJZorHhkWyICLZMKxlu1R9vYo+sd3z1jwb4J8x7bNDw==}
 
   oxfmt@0.73.0:
     resolution: {integrity: sha512-Ke4xbpuzqIBP4bkd48q815RhqWNJqOBzxVA9199M4qcF0y0LtpUv7UTg1dJ5ea6jw0RBUDZvX3qOUMNmmxfxbw==}
@@ -9163,8 +9175,8 @@ packages:
     resolution: {integrity: sha512-eLoXW/DHyl62zxY4SCaIgnRhuMr6ri4juEYARS8E6sCEqzKpOiE521Ucofdx+KnDZl5xmvGYaaKCk5FEOxJCoQ==}
     engines: {node: '>= 0.4'}
 
-  storybook@10.6.3:
-    resolution: {integrity: sha512-lNBvcZFG44C98KvQHYzfq1O46m+sl94zY1+na5/9E3ihtNMbvpOgYyMFMIcWYUvOMo3OM4q9jzvB73KU20bU8w==}
+  storybook@10.5.9:
+    resolution: {integrity: sha512-UfdMKSjEhIKr8LbqYyIE5r7vT/drL/PxN75YaouJ+UG0FssEy6cf49OdTF3kstAqVMHskc+zEqyRoiQHZXHwgA==}
     hasBin: true
     peerDependencies:
       '@types/react': ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
@@ -9453,8 +9465,8 @@ packages:
   ts-easing@0.2.0:
     resolution: {integrity: sha512-Z86EW+fFFh/IFB1fqQ3/+7Zpf9t2ebOAxNI/V6Wo7r5gqiqtxmgTlQ1qbqQcjLKYeSHPTsEmvlJUDg/EuL0uHQ==}
 
-  ts-jest@29.4.15:
-    resolution: {integrity: sha512-s2qmEUYFRqbjz1wv0EmccNPVOb45HOFpFuhzQJLKShYVisuTbCFPIIAIV2EuK5rIxb4BejLDbH7dnBZfYjybUQ==}
+  ts-jest@29.4.9:
+    resolution: {integrity: sha512-LTb9496gYPMCqjeDLdPrKuXtncudeV1yRZnF4Wo5l3SFi0RYEnYRNgMrFIdg+FHvfzjCyQk1cLncWVqiSX+EvQ==}
     engines: {node: ^14.15.0 || ^16.10.0 || ^18.0.0 || >=20.0.0}
     hasBin: true
     peerDependencies:
@@ -11339,7 +11351,7 @@ snapshots:
       react: 18.2.0
       tslib: 2.8.1
 
-  '@emnapi/core@1.11.0':
+  '@emnapi/core@1.11.2':
     dependencies:
       '@emnapi/wasi-threads': 1.2.2
       tslib: 2.8.1
@@ -11357,7 +11369,7 @@ snapshots:
       tslib: 2.8.1
     optional: true
 
-  '@emnapi/runtime@1.11.0':
+  '@emnapi/runtime@1.11.2':
     dependencies:
       tslib: 2.8.1
     optional: true
@@ -12078,8 +12090,6 @@ snapshots:
 
   '@jridgewell/sourcemap-codec@1.5.5': {}
 
-  '@jridgewell/sourcemap-codec@1.6.0': {}
-
   '@jridgewell/trace-mapping@0.3.31':
     dependencies:
       '@jridgewell/resolve-uri': 3.1.1
@@ -12185,10 +12195,10 @@ snapshots:
       '@tybys/wasm-util': 0.10.1
     optional: true
 
-  '@napi-rs/wasm-runtime@1.2.3(@emnapi/core@1.11.0)(@emnapi/runtime@1.11.0)':
+  '@napi-rs/wasm-runtime@1.2.3(@emnapi/core@1.11.2)(@emnapi/runtime@1.11.2)':
     dependencies:
-      '@emnapi/core': 1.11.0
-      '@emnapi/runtime': 1.11.0
+      '@emnapi/core': 1.11.2
+      '@emnapi/runtime': 1.11.2
       '@tybys/wasm-util': 0.10.3
     optional: true
 
@@ -12401,65 +12411,65 @@ snapshots:
 
   '@oxc-project/types@0.127.0': {}
 
-  '@oxc-resolver/binding-android-arm-eabi@11.21.2':
+  '@oxc-resolver/binding-android-arm-eabi@11.24.2':
     optional: true
 
-  '@oxc-resolver/binding-android-arm64@11.21.2':
+  '@oxc-resolver/binding-android-arm64@11.24.2':
     optional: true
 
-  '@oxc-resolver/binding-darwin-arm64@11.21.2':
+  '@oxc-resolver/binding-darwin-arm64@11.24.2':
     optional: true
 
-  '@oxc-resolver/binding-darwin-x64@11.21.2':
+  '@oxc-resolver/binding-darwin-x64@11.24.2':
     optional: true
 
-  '@oxc-resolver/binding-freebsd-x64@11.21.2':
+  '@oxc-resolver/binding-freebsd-x64@11.24.2':
     optional: true
 
-  '@oxc-resolver/binding-linux-arm-gnueabihf@11.21.2':
+  '@oxc-resolver/binding-linux-arm-gnueabihf@11.24.2':
     optional: true
 
-  '@oxc-resolver/binding-linux-arm-musleabihf@11.21.2':
+  '@oxc-resolver/binding-linux-arm-musleabihf@11.24.2':
     optional: true
 
-  '@oxc-resolver/binding-linux-arm64-gnu@11.21.2':
+  '@oxc-resolver/binding-linux-arm64-gnu@11.24.2':
     optional: true
 
-  '@oxc-resolver/binding-linux-arm64-musl@11.21.2':
+  '@oxc-resolver/binding-linux-arm64-musl@11.24.2':
     optional: true
 
-  '@oxc-resolver/binding-linux-ppc64-gnu@11.21.2':
+  '@oxc-resolver/binding-linux-ppc64-gnu@11.24.2':
     optional: true
 
-  '@oxc-resolver/binding-linux-riscv64-gnu@11.21.2':
+  '@oxc-resolver/binding-linux-riscv64-gnu@11.24.2':
     optional: true
 
-  '@oxc-resolver/binding-linux-riscv64-musl@11.21.2':
+  '@oxc-resolver/binding-linux-riscv64-musl@11.24.2':
     optional: true
 
-  '@oxc-resolver/binding-linux-s390x-gnu@11.21.2':
+  '@oxc-resolver/binding-linux-s390x-gnu@11.24.2':
     optional: true
 
-  '@oxc-resolver/binding-linux-x64-gnu@11.21.2':
+  '@oxc-resolver/binding-linux-x64-gnu@11.24.2':
     optional: true
 
-  '@oxc-resolver/binding-linux-x64-musl@11.21.2':
+  '@oxc-resolver/binding-linux-x64-musl@11.24.2':
     optional: true
 
-  '@oxc-resolver/binding-openharmony-arm64@11.21.2':
+  '@oxc-resolver/binding-openharmony-arm64@11.24.2':
     optional: true
 
-  '@oxc-resolver/binding-wasm32-wasi@11.21.2':
+  '@oxc-resolver/binding-wasm32-wasi@11.24.2':
     dependencies:
-      '@emnapi/core': 1.11.0
-      '@emnapi/runtime': 1.11.0
-      '@napi-rs/wasm-runtime': 1.2.3(@emnapi/core@1.11.0)(@emnapi/runtime@1.11.0)
+      '@emnapi/core': 1.11.2
+      '@emnapi/runtime': 1.11.2
+      '@napi-rs/wasm-runtime': 1.2.3(@emnapi/core@1.11.2)(@emnapi/runtime@1.11.2)
     optional: true
 
-  '@oxc-resolver/binding-win32-arm64-msvc@11.21.2':
+  '@oxc-resolver/binding-win32-arm64-msvc@11.24.2':
     optional: true
 
-  '@oxc-resolver/binding-win32-x64-msvc@11.21.2':
+  '@oxc-resolver/binding-win32-x64-msvc@11.24.2':
     optional: true
 
   '@oxfmt/binding-android-arm-eabi@0.73.0':
@@ -13402,32 +13412,49 @@ snapshots:
 
   '@standard-schema/spec@1.1.0': {}
 
-  '@storybook/addon-a11y@10.6.3(storybook@10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))':
+  '@storybook/addon-a11y@10.5.9(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))':
     dependencies:
       '@storybook/global': 5.0.0
       axe-core: 4.13.0
-      storybook: 10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0)
+      storybook: 10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0)
 
-  '@storybook/addon-docs@10.6.3(@types/react-dom@18.0.10)(@types/react@18.0.26)(storybook@10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))':
+  '@storybook/addon-docs@10.5.9(@types/react-dom@18.0.10)(@types/react@18.0.26)(esbuild@0.28.1)(rolldown-vite@7.3.1(@types/node@16.18.25)(esbuild@0.28.1)(jiti@2.6.1)(less@4.9.0)(sass@1.97.3)(stylus@0.62.0)(terser@5.46.2)(yaml@2.9.1))(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))':
     dependencies:
       '@mdx-js/react': 3.1.1(@types/react@18.0.26)(react@18.2.0)
+      '@storybook/csf-plugin': 10.5.9(esbuild@0.28.1)(rolldown-vite@7.3.1(@types/node@16.18.25)(esbuild@0.28.1)(jiti@2.6.1)(less@4.9.0)(sass@1.97.3)(stylus@0.62.0)(terser@5.46.2)(yaml@2.9.1))(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))
       '@storybook/icons': 2.1.0(react@18.2.0)
-      '@storybook/react-dom-shim': 10.6.3(@types/react-dom@18.0.10)(@types/react@18.0.26)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(storybook@10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))
+      '@storybook/react-dom-shim': 10.5.9(@types/react-dom@18.0.10)(@types/react@18.0.26)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))
       react: 18.2.0
       react-dom: 18.2.0(react@18.2.0)
-      storybook: 10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0)
+      storybook: 10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0)
       ts-dedent: 2.3.0
-      unplugin: 2.3.11
     optionalDependencies:
       '@types/react': 18.0.26
     transitivePeerDependencies:
       - '@types/react-dom'
+      - esbuild
+      - rollup
+      - vite
+      - webpack
 
-  '@storybook/builder-vite@10.6.3(rolldown-vite@7.3.1(@types/node@16.18.25)(esbuild@0.28.1)(jiti@2.6.1)(less@4.9.0)(sass@1.97.3)(stylus@0.62.0)(terser@5.46.2)(yaml@2.9.1))(storybook@10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))':
+  '@storybook/builder-vite@10.5.9(esbuild@0.28.1)(rolldown-vite@7.3.1(@types/node@16.18.25)(esbuild@0.28.1)(jiti@2.6.1)(less@4.9.0)(sass@1.97.3)(stylus@0.62.0)(terser@5.46.2)(yaml@2.9.1))(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))':
     dependencies:
-      storybook: 10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0)
+      '@storybook/csf-plugin': 10.5.9(esbuild@0.28.1)(rolldown-vite@7.3.1(@types/node@16.18.25)(esbuild@0.28.1)(jiti@2.6.1)(less@4.9.0)(sass@1.97.3)(stylus@0.62.0)(terser@5.46.2)(yaml@2.9.1))(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))
+      storybook: 10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0)
       ts-dedent: 2.3.0
       vite: rolldown-vite@7.3.1(@types/node@16.18.25)(esbuild@0.28.1)(jiti@2.6.1)(less@4.9.0)(sass@1.97.3)(stylus@0.62.0)(terser@5.46.2)(yaml@2.9.1)
+    transitivePeerDependencies:
+      - esbuild
+      - rollup
+      - webpack
+
+  '@storybook/csf-plugin@10.5.9(esbuild@0.28.1)(rolldown-vite@7.3.1(@types/node@16.18.25)(esbuild@0.28.1)(jiti@2.6.1)(less@4.9.0)(sass@1.97.3)(stylus@0.62.0)(terser@5.46.2)(yaml@2.9.1))(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))':
+    dependencies:
+      storybook: 10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0)
+      unplugin: 2.3.11
+    optionalDependencies:
+      esbuild: 0.28.1
+      vite: rolldown-vite@7.3.1(@types/node@16.18.25)(esbuild@0.28.1)(jiti@2.6.1)(less@4.9.0)(sass@1.97.3)(stylus@0.62.0)(terser@5.46.2)(yaml@2.9.1)
 
   '@storybook/global@5.0.0': {}
 
@@ -13435,28 +13462,28 @@ snapshots:
     dependencies:
       react: 18.2.0
 
-  '@storybook/react-dom-shim@10.6.3(@types/react-dom@18.0.10)(@types/react@18.0.26)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(storybook@10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))':
+  '@storybook/react-dom-shim@10.5.9(@types/react-dom@18.0.10)(@types/react@18.0.26)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))':
     dependencies:
       react: 18.2.0
       react-dom: 18.2.0(react@18.2.0)
-      storybook: 10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0)
+      storybook: 10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0)
     optionalDependencies:
       '@types/react': 18.0.26
       '@types/react-dom': 18.0.10
 
-  '@storybook/react-vite@10.6.3(@types/react-dom@18.0.10)(@types/react@18.0.26)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(rolldown-vite@7.3.1(@types/node@16.18.25)(esbuild@0.28.1)(jiti@2.6.1)(less@4.9.0)(sass@1.97.3)(stylus@0.62.0)(terser@5.46.2)(yaml@2.9.1))(storybook@10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))(typescript@5.9.3)':
+  '@storybook/react-vite@10.5.9(@types/react-dom@18.0.10)(@types/react@18.0.26)(esbuild@0.28.1)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(rolldown-vite@7.3.1(@types/node@16.18.25)(esbuild@0.28.1)(jiti@2.6.1)(less@4.9.0)(sass@1.97.3)(stylus@0.62.0)(terser@5.46.2)(yaml@2.9.1))(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))(typescript@5.9.3)':
     dependencies:
       '@joshwooding/vite-plugin-react-docgen-typescript': 0.7.0(rolldown-vite@7.3.1(@types/node@16.18.25)(esbuild@0.28.1)(jiti@2.6.1)(less@4.9.0)(sass@1.97.3)(stylus@0.62.0)(terser@5.46.2)(yaml@2.9.1))(typescript@5.9.3)
       '@rollup/pluginutils': 5.4.0
-      '@storybook/builder-vite': 10.6.3(rolldown-vite@7.3.1(@types/node@16.18.25)(esbuild@0.28.1)(jiti@2.6.1)(less@4.9.0)(sass@1.97.3)(stylus@0.62.0)(terser@5.46.2)(yaml@2.9.1))(storybook@10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))
-      '@storybook/react': 10.6.3(@types/react-dom@18.0.10)(@types/react@18.0.26)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(storybook@10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))(typescript@5.9.3)
+      '@storybook/builder-vite': 10.5.9(esbuild@0.28.1)(rolldown-vite@7.3.1(@types/node@16.18.25)(esbuild@0.28.1)(jiti@2.6.1)(less@4.9.0)(sass@1.97.3)(stylus@0.62.0)(terser@5.46.2)(yaml@2.9.1))(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))
+      '@storybook/react': 10.5.9(@types/react-dom@18.0.10)(@types/react@18.0.26)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))(typescript@5.9.3)
       empathic: 2.0.1
-      magic-string: 1.4.3
+      magic-string: 0.30.8
       react: 18.2.0
       react-docgen: 8.0.3
       react-dom: 18.2.0(react@18.2.0)
       resolve: 1.22.11
-      storybook: 10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0)
+      storybook: 10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0)
       tsconfig-paths: 4.2.0
       vite: rolldown-vite@7.3.1(@types/node@16.18.25)(esbuild@0.28.1)(jiti@2.6.1)(less@4.9.0)(sass@1.97.3)(stylus@0.62.0)(terser@5.46.2)(yaml@2.9.1)
     optionalDependencies:
@@ -13464,18 +13491,20 @@ snapshots:
     transitivePeerDependencies:
       - '@types/react'
       - '@types/react-dom'
+      - esbuild
       - rollup
       - supports-color
+      - webpack
 
-  '@storybook/react@10.6.3(@types/react-dom@18.0.10)(@types/react@18.0.26)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(storybook@10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))(typescript@5.9.3)':
+  '@storybook/react@10.5.9(@types/react-dom@18.0.10)(@types/react@18.0.26)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))(typescript@5.9.3)':
     dependencies:
       '@storybook/global': 5.0.0
-      '@storybook/react-dom-shim': 10.6.3(@types/react-dom@18.0.10)(@types/react@18.0.26)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(storybook@10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))
+      '@storybook/react-dom-shim': 10.5.9(@types/react-dom@18.0.10)(@types/react@18.0.26)(react-dom@18.2.0(react@18.2.0))(react@18.2.0)(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))
       react: 18.2.0
       react-docgen: 8.0.3
       react-docgen-typescript: 2.4.0(typescript@5.9.3)
       react-dom: 18.2.0(react@18.2.0)
-      storybook: 10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0)
+      storybook: 10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0)
     optionalDependencies:
       '@types/react': 18.0.26
       '@types/react-dom': 18.0.10
@@ -13483,7 +13512,7 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  '@storybook/test-runner@0.24.5(@types/node@16.18.25)(babel-plugin-macros@3.1.0)(storybook@10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))(ts-node@10.9.1(@swc/core@1.16.2)(@types/node@16.18.25)(typescript@5.9.3))':
+  '@storybook/test-runner@0.24.5(@types/node@16.18.25)(babel-plugin-macros@3.1.0)(storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0))(ts-node@10.9.1(@swc/core@1.16.2)(@types/node@16.18.25)(typescript@5.9.3))':
     dependencies:
       '@babel/core': 7.29.7
       '@babel/generator': 7.29.7
@@ -13505,7 +13534,7 @@ snapshots:
       playwright: 1.57.0
       playwright-core: 1.57.0
       rimraf: 3.0.2
-      storybook: 10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0)
+      storybook: 10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0)
       uuid: 8.3.2
     transitivePeerDependencies:
       - '@swc/helpers'
@@ -13645,7 +13674,7 @@ snapshots:
   '@testing-library/jest-dom@6.9.1':
     dependencies:
       '@adobe/css-tools': 4.5.0
-      aria-query: 5.3.0
+      aria-query: 5.1.3
       css.escape: 1.5.1
       dom-accessibility-api: 0.6.3
       picocolors: 1.1.1
@@ -14633,16 +14662,16 @@ snapshots:
 
   boolbase@1.0.0: {}
 
-  brace-expansion@1.1.21:
+  brace-expansion@1.1.18:
     dependencies:
       balanced-match: 1.0.2
       concat-map: 0.0.1
 
-  brace-expansion@2.1.7:
+  brace-expansion@2.1.4:
     dependencies:
       balanced-match: 1.0.2
 
-  brace-expansion@5.0.12:
+  brace-expansion@5.0.9:
     dependencies:
       balanced-match: 4.0.4
 
@@ -16096,7 +16125,7 @@ snapshots:
 
   graphql@16.8.1: {}
 
-  handlebars@4.7.10:
+  handlebars@4.7.9:
     dependencies:
       minimist: 1.2.8
       neo-async: 2.6.2
@@ -17469,10 +17498,6 @@ snapshots:
     dependencies:
       '@jridgewell/sourcemap-codec': 1.5.5
 
-  magic-string@1.4.3:
-    dependencies:
-      '@jridgewell/sourcemap-codec': 1.6.0
-
   make-dir@3.1.0:
     dependencies:
       semver: 6.3.1
@@ -17883,19 +17908,19 @@ snapshots:
 
   minimatch@10.2.5:
     dependencies:
-      brace-expansion: 5.0.12
+      brace-expansion: 5.0.9
 
   minimatch@3.1.5:
     dependencies:
-      brace-expansion: 1.1.21
+      brace-expansion: 1.1.18
 
   minimatch@5.1.9:
     dependencies:
-      brace-expansion: 2.1.7
+      brace-expansion: 2.1.4
 
   minimatch@9.0.9:
     dependencies:
-      brace-expansion: 2.1.7
+      brace-expansion: 2.1.4
 
   minimist@1.2.8: {}
 
@@ -18279,27 +18304,27 @@ snapshots:
       '@oxc-parser/binding-win32-ia32-msvc': 0.127.0
       '@oxc-parser/binding-win32-x64-msvc': 0.127.0
 
-  oxc-resolver@11.21.2:
+  oxc-resolver@11.24.2:
     optionalDependencies:
-      '@oxc-resolver/binding-android-arm-eabi': 11.21.2
-      '@oxc-resolver/binding-android-arm64': 11.21.2
-      '@oxc-resolver/binding-darwin-arm64': 11.21.2
-      '@oxc-resolver/binding-darwin-x64': 11.21.2
-      '@oxc-resolver/binding-freebsd-x64': 11.21.2
-      '@oxc-resolver/binding-linux-arm-gnueabihf': 11.21.2
-      '@oxc-resolver/binding-linux-arm-musleabihf': 11.21.2
-      '@oxc-resolver/binding-linux-arm64-gnu': 11.21.2
-      '@oxc-resolver/binding-linux-arm64-musl': 11.21.2
-      '@oxc-resolver/binding-linux-ppc64-gnu': 11.21.2
-      '@oxc-resolver/binding-linux-riscv64-gnu': 11.21.2
-      '@oxc-resolver/binding-linux-riscv64-musl': 11.21.2
-      '@oxc-resolver/binding-linux-s390x-gnu': 11.21.2
-      '@oxc-resolver/binding-linux-x64-gnu': 11.21.2
-      '@oxc-resolver/binding-linux-x64-musl': 11.21.2
-      '@oxc-resolver/binding-openharmony-arm64': 11.21.2
-      '@oxc-resolver/binding-wasm32-wasi': 11.21.2
-      '@oxc-resolver/binding-win32-arm64-msvc': 11.21.2
-      '@oxc-resolver/binding-win32-x64-msvc': 11.21.2
+      '@oxc-resolver/binding-android-arm-eabi': 11.24.2
+      '@oxc-resolver/binding-android-arm64': 11.24.2
+      '@oxc-resolver/binding-darwin-arm64': 11.24.2
+      '@oxc-resolver/binding-darwin-x64': 11.24.2
+      '@oxc-resolver/binding-freebsd-x64': 11.24.2
+      '@oxc-resolver/binding-linux-arm-gnueabihf': 11.24.2
+      '@oxc-resolver/binding-linux-arm-musleabihf': 11.24.2
+      '@oxc-resolver/binding-linux-arm64-gnu': 11.24.2
+      '@oxc-resolver/binding-linux-arm64-musl': 11.24.2
+      '@oxc-resolver/binding-linux-ppc64-gnu': 11.24.2
+      '@oxc-resolver/binding-linux-riscv64-gnu': 11.24.2
+      '@oxc-resolver/binding-linux-riscv64-musl': 11.24.2
+      '@oxc-resolver/binding-linux-s390x-gnu': 11.24.2
+      '@oxc-resolver/binding-linux-x64-gnu': 11.24.2
+      '@oxc-resolver/binding-linux-x64-musl': 11.24.2
+      '@oxc-resolver/binding-openharmony-arm64': 11.24.2
+      '@oxc-resolver/binding-wasm32-wasi': 11.24.2
+      '@oxc-resolver/binding-win32-arm64-msvc': 11.24.2
+      '@oxc-resolver/binding-win32-x64-msvc': 11.24.2
 
   oxfmt@0.73.0:
     dependencies:
@@ -19897,7 +19922,7 @@ snapshots:
       es-errors: 1.3.0
       internal-slot: 1.1.0
 
-  storybook@10.6.3(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0):
+  storybook@10.5.9(@types/react@18.0.26)(prettier@3.8.3)(react@18.2.0):
     dependencies:
       '@storybook/global': 5.0.0
       '@storybook/icons': 2.1.0(react@18.2.0)
@@ -19911,7 +19936,7 @@ snapshots:
       jsonc-parser: 3.3.1
       open: 10.2.0
       oxc-parser: 0.127.0
-      oxc-resolver: 11.21.2
+      oxc-resolver: 11.24.2
       recast: 0.23.21
       semver: 7.8.5
       use-sync-external-store: 1.6.0(react@18.2.0)
@@ -20229,11 +20254,11 @@ snapshots:
 
   ts-easing@0.2.0: {}
 
-  ts-jest@29.4.15(@babel/core@7.29.7)(@jest/transform@30.4.1)(@jest/types@30.2.0)(babel-jest@29.6.4(@babel/core@7.29.7))(esbuild@0.28.1)(jest-util@30.4.1)(jest@30.2.0(@types/node@16.18.25)(babel-plugin-macros@3.1.0)(ts-node@10.9.1(@swc/core@1.16.2)(@types/node@16.18.25)(typescript@5.9.3)))(typescript@5.9.3):
+  ts-jest@29.4.9(@babel/core@7.29.7)(@jest/transform@30.4.1)(@jest/types@30.2.0)(babel-jest@29.6.4(@babel/core@7.29.7))(esbuild@0.28.1)(jest-util@30.4.1)(jest@30.2.0(@types/node@16.18.25)(babel-plugin-macros@3.1.0)(ts-node@10.9.1(@swc/core@1.16.2)(@types/node@16.18.25)(typescript@5.9.3)))(typescript@5.9.3):
     dependencies:
       bs-logger: 0.2.6
       fast-json-stable-stringify: 2.1.0
-      handlebars: 4.7.10
+      handlebars: 4.7.9
       jest: 30.2.0(@types/node@16.18.25)(babel-plugin-macros@3.1.0)(ts-node@10.9.1(@swc/core@1.16.2)(@types/node@16.18.25)(typescript@5.9.3))
       json5: 2.2.3
       lodash.memoize: 4.1.2

frontend/pnpm-workspace.yaml

@@ -20,13 +20,13 @@ overrides:
  '@xmldom/xmldom@<0.8.15': '>=0.8.15 <0.9'
  # via: babel-plugin-istanbul > test-exclude@6 > minimatch@3.1.5 (^1.1.7); also glob@7
  # remove: blocked — babel-plugin-istanbul pins test-exclude@6, which pins minimatch@3
- brace-expansion@<1.1.21: '>=1.1.21 <2'
+ brace-expansion@<1.1.18: '>=1.1.18 <2'
  # via: jest > glob@10 > minimatch@9.0.9 (^2.0.1); also minimatch@5.1.9 (^2.0.1)
  # remove: blocked — jest 30 resolves glob@10 > minimatch@9 internally
- 'brace-expansion@>=2.0.0 <2.1.7': '>=2.1.7 <3'
+ 'brace-expansion@>=2.0.0 <2.1.4': '>=2.1.4 <3'
  # via: eslint-plugin-sonarjs@4.0.2 (minimatch ^10.2.4) > minimatch@10.2.5 (^5.0.5)
  # remove: blocked — minimatch@10.2.6 (latest) only widens to ^5.0.8, still vulnerable
- 'brace-expansion@>=5.0.0 <5.0.12': '>=5.0.12 <6'
+ 'brace-expansion@>=5.0.0 <5.0.9': '>=5.0.9 <6'
  # via: direct devDep @babel/core > @babel/helper-compilation-targets (browserslist ^4.24.0)
  # remove: blocked, the range is open so the floor is what pulls the fix.
  # Also lifts baseline-browser-mapping, which browserslist@4.28.7 floors at ^2.11.20

frontend/src/api/querySuggestions/getValueSuggestion.ts

@@ -0,0 +1,29 @@
+import axios from 'api';
+import { AxiosResponse } from 'axios';
+import {
+	QueryKeyValueRequestProps,
+	QueryKeyValueSuggestionsResponseProps,
+} from 'types/api/querySuggestions/types';
+
+/**
+ * @deprecated Use the generated `useGetFieldsValues` hook (or `getFieldsValues` fetcher) from
+ * `api/generated/services/fields` instead. This hand-written client targets the
+ * same endpoint and will be removed once call sites migrate.
+ *
+ * Part of https://github.com/SigNoz/engineering-pod/issues/5289, add a comment or update when removing this method.
+ */
+export const getValueSuggestions = (
+	props: QueryKeyValueRequestProps,
+): Promise<AxiosResponse<QueryKeyValueSuggestionsResponseProps>> => {
+	const { signal, key, searchText, signalSource, metricName } = props;
+
+	const encodedSignal = encodeURIComponent(signal);
+	const encodedKey = encodeURIComponent(key);
+	const encodedMetricName = encodeURIComponent(metricName || '');
+	const encodedSearchText = encodeURIComponent(searchText);
+	const encodedSource = encodeURIComponent(signalSource || '');
+
+	return axios.get(
+		`/fields/values?signal=${encodedSignal}&name=${encodedKey}&searchText=${encodedSearchText}&metricName=${encodedMetricName}&source=${encodedSource}`,
+	);
+};

frontend/src/assets/CustomIcons/EmptyQuickFilterIcon.tsx

@@ -0,0 +1,90 @@
+interface EmptyQuickFilterIconProps {
+	width?: number;
+	height?: number;
+	className?: string;
+}
+
+function EmptyQuickFilterIcon({
+	width = 32,
+	height = 32,
+	className,
+}: EmptyQuickFilterIconProps): JSX.Element {
+	return (
+		<svg
+			width={width}
+			height={height}
+			fill="none"
+			xmlns="http://www.w3.org/2000/svg"
+			className={className}
+		>
+			<path
+				d="M17.948 6.906h-6.62V6.24h6.62v.667ZM17.948 10.293h-6.62v-.667h6.62v.667Z"
+				fill="#616161"
+			/>
+			<path
+				d="M16.175 29.403H13.62V3.442s.238-.554 1.278-.554 1.278.554 1.278.554v25.96h-.002Z"
+				fill="#9E9E9E"
+			/>
+			<path
+				d="M15.52 2.971v20.974H13.62v1.91c.323.001.614.04.876.097a1.3 1.3 0 0 1 1.024 1.269v2.182h.656V3.442c-.002 0-.14-.318-.658-.471Z"
+				fill="#757575"
+			/>
+			<path
+				d="M22.363 2.737a5.382 5.382 0 0 0-5.382 5.402 5.365 5.365 0 0 0 5.382 5.382 5.378 5.378 0 0 0 5.382-5.382c0-2.975-2.407-5.402-5.382-5.402Z"
+				fill="#2196F3"
+			/>
+			<path
+				d="M24.714 4.749c-.338-.085-1.01-.174-2.349-.174-1.337 0-2.01.087-2.348.174-.2.05-.87.328-.87 1.077v4.618c0 .253.205.46.46.46h.17v.51c0 .15.12.27.268.27h.545c.149 0 .269-.12.269-.27v-.51h3.008v.51c0 .15.12.27.27.27h.544c.149 0 .269-.12.269-.27v-.51h.173a.46.46 0 0 0 .46-.46V5.826c0-.717-.669-1.029-.869-1.077Zm-3.802.366c0-.113.091-.204.205-.204h2.493c.113 0 .204.09.204.204v.362a.204.204 0 0 1-.204.205h-2.493a.204.204 0 0 1-.205-.205v-.362Zm.042 4.864a.138.138 0 0 1-.137.138h-.55a.469.469 0 0 1-.468-.469v-.246c0-.076.062-.138.138-.138h.548c.258 0 .47.209.47.469v.246Zm3.973-.33a.469.469 0 0 1-.468.468h-.55a.138.138 0 0 1-.137-.138v-.246c0-.258.209-.47.469-.47h.549c.075 0 .137.063.137.139v.246Zm.125-2.007c0 .297-.645.817-2.689.817-2.046 0-2.689-.482-2.689-.817V6.277c0-.089.09-.31.311-.31h4.791c.223 0 .276.224.276.31v1.365Z"
+				fill="#fff"
+			/>
+			<path
+				d="M18.861 24.652h-7.926a.506.506 0 0 1-.507-.507V14.99c0-.28.227-.507.507-.507h7.924c.28 0 .507.227.507.507v9.155c0 .28-.227.507-.505.507Z"
+				fill="#F5F5F5"
+			/>
+			<path
+				opacity=".8"
+				d="M18.006 23.139H11.79l-.017-7.236h6.217l.016 7.236Z"
+				fill="#82AEC0"
+			/>
+			<path d="M14.66 23.234v-7.33h.444v7.33h-.445Z" fill="#F5F5F5" />
+			<path d="M14.66 15.903h-2.887v.605h2.886v-.605Z" fill="#616161" />
+			<path
+				d="M18.03 21.878h-6.264v-.222h6.264v.223ZM18.03 20.412h-6.264v-.222h6.264v.222ZM17.99 18.945h-6.217v-.222h6.217v.222ZM17.99 17.481h-6.224v-.222h6.224v.222Z"
+				fill="#F5F5F5"
+			/>
+			<path
+				d="M17.988 18.534H15.1v.605h2.887v-.605ZM14.672 19.999h-2.877v.604h2.877V20Z"
+				fill="#616161"
+			/>
+			<path
+				d="M10.935 14.817a.173.173 0 0 0-.173.173v9.155c0 .096.077.174.173.174h7.926a.173.173 0 0 0 .171-.174V14.99a.173.173 0 0 0-.173-.173h-7.924Zm-.84.173a.84.84 0 0 1 .84-.84h7.924a.84.84 0 0 1 .84.84v9.155a.84.84 0 0 1-.838.84h-7.926a.84.84 0 0 1-.84-.84V14.99Z"
+				fill="#9E9E9E"
+			/>
+			<path
+				d="M10.968 24.323c-.344.031-.344-.195-.344-.258V15.1c0-.251.204-.455.455-.455h7.693c.21 0 .305.126.262.384 0 0-.026-.165-.226-.165h-7.726a.237.237 0 0 0-.236.236v8.968c0 .21.122.256.122.256Z"
+				fill="#757575"
+			/>
+			<path d="M12.268 4.933H4.695v6.577h7.573V4.933Z" fill="#FFCA28" />
+			<path
+				d="M11.846 4.933c.233 0 .422.189.422.422v5.733a.422.422 0 0 1-.422.422H5.12a.422.422 0 0 1-.423-.422V5.355c0-.233.19-.422.423-.422h6.726Zm0-.445H5.12a.868.868 0 0 0-.867.867v5.733c0 .478.389.867.867.867h6.726a.868.868 0 0 0 .867-.867V5.355a.866.866 0 0 0-.867-.867Z"
+				fill="#9E9E9E"
+			/>
+			<path
+				d="M12.27 7.308H4.696v-.444h7.575v.444ZM12.27 9.579H4.696v-.444h7.575v.444Z"
+				fill="#FFFDE7"
+			/>
+			<path
+				d="M7.066 5.664H5.162v.502h1.904v-.502ZM6.597 10.27H5.162v.503h1.435v-.502ZM11.648 10.27h-1.435v.503h1.435v-.502ZM11.648 5.664h-1.435v.502h1.435v-.502ZM10.302 7.968h-.827v.502h.827v-.502ZM11.648 7.968h-.826v.502h.826v-.502ZM7.802 7.968h-2.64v.502h2.64v-.502Z"
+				fill="#757575"
+			/>
+		</svg>
+	);
+}
+
+EmptyQuickFilterIcon.defaultProps = {
+	width: 32,
+	height: 32,
+	className: '',
+};
+
+export default EmptyQuickFilterIcon;

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/Checkbox.styles.scss

@@ -0,0 +1,230 @@
+.checkbox-filter {
+	display: flex;
+	flex-direction: column;
+	padding: 12px;
+	gap: 12px;
+	border-bottom: 1px solid var(--l1-border);
+
+	.search {
+		input {
+			--input-background: var(--l2-background);
+			--input-hover-background: var(--l2-background);
+			--input-focus-background: var(--l2-background);
+			&::placeholder {
+				color: var(--l3-foreground);
+			}
+			--input-font-size: 14px;
+			--input-border-color: var(--l1-border);
+			--input-focus-border-color: var(--primary-background);
+			--input-focus-outline-width: 0;
+			--input-focus-outline-offset: 0;
+		}
+	}
+
+	.filter-header-checkbox {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		cursor: pointer;
+
+		.left-action {
+			display: flex;
+			align-items: center;
+			gap: 6px;
+
+			.title {
+				color: var(--l2-foreground);
+				font-family: Inter;
+				font-size: 14px;
+				font-style: normal;
+				font-weight: 400;
+				line-height: 18px;
+				letter-spacing: -0.07px;
+				text-transform: capitalize;
+			}
+		}
+
+		.right-action {
+			display: flex;
+			align-items: center;
+			min-width: 48px;
+
+			.clear-all {
+				font-size: 12px;
+				color: var(--accent-primary);
+				cursor: pointer;
+			}
+		}
+	}
+
+	.values {
+		display: flex;
+		flex-direction: column;
+		gap: 8px;
+
+		.filter-separator {
+			height: 1px;
+			background-color: var(--l1-border);
+			margin: 4px 0;
+		}
+
+		.value {
+			display: flex;
+			align-items: center;
+			gap: 8px;
+			min-height: 24px;
+
+			.checkbox-value-section {
+				display: flex;
+				align-items: center;
+				gap: 4px;
+				width: calc(100% - 24px);
+				cursor: pointer;
+
+				.value-string {
+					width: 100%;
+				}
+
+				&.filter-disabled {
+					cursor: not-allowed;
+
+					.value-string {
+						color: var(--l3-foreground);
+					}
+
+					.only-btn,
+					.toggle-btn {
+						cursor: not-allowed;
+						color: var(--l3-foreground);
+					}
+				}
+
+				// Stack "Only"/"All" and "Toggle" in a single cell so revealing
+				// one swaps in place instead of shifting the row layout.
+				.value-actions {
+					display: grid;
+					align-items: center;
+					justify-items: end;
+
+					> * {
+						grid-area: 1 / 1;
+					}
+				}
+
+				.only-btn,
+				.toggle-btn {
+					display: none;
+					align-items: center;
+					justify-content: center;
+					height: 21px;
+					opacity: 0;
+					transform: translateX(4px);
+					// `display` is animated as a discrete property so the button
+					// stays mounted through its fade-out on exit.
+					transition:
+						opacity 0.16s ease,
+						transform 0.16s ease,
+						display 0.16s allow-discrete;
+
+					&:hover {
+						background-color: unset;
+					}
+				}
+			}
+
+			// Hovering the label/value area reveals the "Only"/"All" action.
+			.checkbox-value-section:hover .only-btn {
+				display: flex;
+				opacity: 1;
+				transform: translateX(0);
+
+				// Entry animation start state (fires on the display switch).
+				@starting-style {
+					opacity: 0;
+					transform: translateX(4px);
+				}
+			}
+
+			// Hovering the checkbox reveals the "Toggle" action.
+			[data-slot='checkbox']:hover ~ .checkbox-value-section .toggle-btn {
+				display: flex;
+				opacity: 1;
+				transform: translateX(0);
+
+				@starting-style {
+					opacity: 0;
+					transform: translateX(4px);
+				}
+			}
+		}
+
+		@media (prefers-reduced-motion: reduce) {
+			.only-btn,
+			.toggle-btn {
+				transition: none;
+			}
+		}
+	}
+
+	.no-data {
+		align-self: center;
+	}
+
+	.show-more {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+
+		.show-more-text {
+			color: var(--accent-primary);
+			cursor: pointer;
+		}
+	}
+	.go-to-docs {
+		display: flex;
+		flex-direction: column;
+		gap: 44px;
+		&__container {
+			display: flex;
+			flex-direction: column;
+			gap: 4px;
+			margin-top: 4px;
+
+			&-message {
+				color: var(--l2-foreground);
+				font-size: 14px;
+				line-height: 20px; /* 142.857% */
+				letter-spacing: -0.07px;
+			}
+		}
+		&__button {
+			display: flex;
+			align-items: center;
+			gap: 4px;
+			cursor: pointer;
+			margin: 0 0 4px;
+			padding: 0;
+			&-text {
+				color: var(--bg-robin-400);
+				font-family: Inter;
+				font-size: 14px;
+				line-height: 20px; /* 142.857% */
+				letter-spacing: -0.07px;
+			}
+		}
+	}
+}
+
+.label-false {
+	width: 2px;
+	height: 11px;
+	border-radius: 2px;
+	background: var(--danger-background);
+}
+
+.label-true {
+	width: 2px;
+	height: 11px;
+	border-radius: 2px;
+	background: var(--bg-forest-500);
+}

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

@@ -0,0 +1,476 @@
+import { UseQueryResult } from 'react-query';
+import userEvent from '@testing-library/user-event';
+import { FiltersType, QuickFiltersSource } from 'components/QuickFilters/types';
+import { useGetAggregateValues } from 'hooks/queryBuilder/useGetAggregateValues';
+import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
+import { useGetQueryKeyValueSuggestions } from 'hooks/querySuggestions/useGetQueryKeyValueSuggestions';
+import { quickFiltersAttributeValuesResponse } from 'mocks-server/__mockdata__/customQuickFilters';
+import { rest, server } from 'mocks-server/server';
+import { render, screen, waitFor } from 'tests/test-utils';
+import { SuccessResponse } from 'types/api';
+import { IAttributeValuesResponse } from 'types/api/queryBuilder/getAttributesValues';
+import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
+import { DataSource } from 'types/common/queryBuilder';
+
+import CheckboxFilter from './Checkbox';
+
+// Mock the query builder hook
+jest.mock('hooks/queryBuilder/useQueryBuilder');
+const mockUseQueryBuilder = jest.mocked(useQueryBuilder);
+
+// Mock the aggregate values hook
+jest.mock('hooks/queryBuilder/useGetAggregateValues');
+
+const mockUseGetAggregateValues = jest.mocked(useGetAggregateValues);
+
+// Mock the key value suggestions hook
+jest.mock('hooks/querySuggestions/useGetQueryKeyValueSuggestions');
+
+const mockUseGetQueryKeyValueSuggestions = jest.mocked(
+	useGetQueryKeyValueSuggestions,
+);
+
+interface MockFilterConfig {
+	title: string;
+	attributeKey: {
+		key: string;
+		dataType: DataTypes;
+		type: string;
+	};
+	dataSource: DataSource;
+	defaultOpen: boolean;
+	type: FiltersType;
+}
+
+const SERVICE_NAME_KEY = 'service.name';
+const OTEL_DEMO = 'otel-demo';
+const SAMPLE_FLASK = 'sample-flask';
+const OTLP_PYTHON = 'otlp-python';
+const MQ_KAFKA = 'mq-kafka';
+
+const MOCK_SERVICE_NAMES = [MQ_KAFKA, OTEL_DEMO, OTLP_PYTHON, SAMPLE_FLASK];
+
+const createMockFilter = (
+	overrides: Partial<MockFilterConfig> = {},
+): MockFilterConfig => ({
+	title: 'Service Name',
+	attributeKey: {
+		key: SERVICE_NAME_KEY,
+		dataType: DataTypes.String,
+		type: 'resource',
+	},
+	dataSource: DataSource.LOGS,
+	defaultOpen: false,
+	type: FiltersType.CHECKBOX,
+	...overrides,
+});
+
+const createMockQueryBuilderData = (hasActiveFilters = false): any => ({
+	lastUsedQuery: 0,
+	currentQuery: {
+		builder: {
+			queryData: [
+				{
+					filters: {
+						items: hasActiveFilters
+							? [
+									{
+										key: {
+											key: SERVICE_NAME_KEY,
+											dataType: DataTypes.String,
+											type: 'resource',
+										},
+										op: 'in',
+										value: [OTEL_DEMO, SAMPLE_FLASK],
+									},
+								]
+							: [],
+					},
+				},
+			],
+		},
+	},
+	redirectWithQueryBuilderData: jest.fn(),
+});
+
+describe('CheckboxFilter - User Flows', () => {
+	beforeEach(() => {
+		// Reset all mocks
+		jest.clearAllMocks();
+
+		// Default mock implementations for useGetAggregateValues
+		mockUseGetAggregateValues.mockReturnValue({
+			data: {
+				payload: {
+					stringAttributeValues: MOCK_SERVICE_NAMES,
+				},
+			},
+			isLoading: false,
+			refetch: jest.fn(),
+		} as unknown as UseQueryResult<SuccessResponse<IAttributeValuesResponse>>);
+
+		// Default mock implementations for useGetQueryKeyValueSuggestions
+		// Returns data in the format expected by the hook
+		mockUseGetQueryKeyValueSuggestions.mockReturnValue({
+			data: {
+				data: {
+					data: {
+						values: {
+							stringValues: MOCK_SERVICE_NAMES,
+							numberValues: [],
+						},
+					},
+				},
+			},
+			isLoading: false,
+			refetch: jest.fn(),
+		} as any);
+
+		// Setup MSW server for API calls
+		server.use(
+			rest.get('*/api/v3/autocomplete/attribute_values', (_req, res, ctx) =>
+				res(ctx.status(200), ctx.json(quickFiltersAttributeValuesResponse)),
+			),
+		);
+	});
+
+	it('should auto-open filter and prioritize checked items with visual separator when user opens page with active filters', async () => {
+		// Mock query builder with active filters
+		mockUseQueryBuilder.mockReturnValue(createMockQueryBuilderData(true) as any);
+
+		const mockFilter = createMockFilter({ defaultOpen: false });
+
+		render(
+			<CheckboxFilter
+				filter={mockFilter}
+				source={QuickFiltersSource.LOGS_EXPLORER}
+			/>,
+		);
+
+		// User should see the filter is automatically opened (not collapsed)
+		expect(screen.getByText('Service Name')).toBeInTheDocument();
+		await waitFor(() => {
+			expect(screen.getByPlaceholderText('Filter values')).toBeInTheDocument();
+		});
+
+		// User should see visual separator between checked and unchecked items
+		expect(screen.getByTestId('filter-separator')).toBeInTheDocument();
+
+		// User should see checked items at the top
+		await waitFor(() => {
+			const checkboxes = screen.getAllByRole('checkbox');
+			expect(checkboxes).toHaveLength(4); // Ensure we have exactly 4 checkboxes
+			expect(checkboxes[0]).toBeChecked(); // otel-demo should be first and checked
+			expect(checkboxes[1]).toBeChecked(); // sample-flask should be second and checked
+			expect(checkboxes[2]).not.toBeChecked(); // mq-kafka should be unchecked
+			expect(checkboxes[3]).not.toBeChecked(); // otlp-python should be unchecked
+		});
+	});
+
+	it('should respect user preference when user manually toggles filter over auto-open behavior', async () => {
+		const user = userEvent.setup({ pointerEventsCheck: 0 });
+
+		// Mock query builder with active filters
+		mockUseQueryBuilder.mockReturnValue(createMockQueryBuilderData(true) as any);
+
+		const mockFilter = createMockFilter({ defaultOpen: false });
+
+		render(
+			<CheckboxFilter
+				filter={mockFilter}
+				source={QuickFiltersSource.LOGS_EXPLORER}
+			/>,
+		);
+
+		// Initially auto-opened due to active filters
+		await waitFor(() => {
+			expect(screen.getByPlaceholderText('Filter values')).toBeInTheDocument();
+		});
+
+		// User manually closes the filter
+		await user.click(screen.getByText('Service Name'));
+
+		// User should see filter is now closed (respecting user preference)
+		expect(
+			screen.queryByPlaceholderText('Filter values'),
+		).not.toBeInTheDocument();
+
+		// User manually opens the filter again
+		await user.click(screen.getByText('Service Name'));
+
+		// User should see filter is now open (respecting user preference)
+		await waitFor(() => {
+			expect(screen.getByPlaceholderText('Filter values')).toBeInTheDocument();
+		});
+	});
+
+	it('should update query filters when a checkbox is clicked', async () => {
+		const redirectWithQueryBuilderData = jest.fn();
+
+		// Start with no active filters so clicking a checkbox creates one
+		mockUseQueryBuilder.mockReturnValue({
+			...createMockQueryBuilderData(false),
+			redirectWithQueryBuilderData,
+		} as any);
+
+		const mockFilter = createMockFilter({ defaultOpen: true });
+
+		render(
+			<CheckboxFilter
+				filter={mockFilter}
+				source={QuickFiltersSource.LOGS_EXPLORER}
+			/>,
+		);
+
+		// Wait for checkboxes to render
+		await waitFor(() => {
+			expect(screen.getAllByRole('checkbox')).toHaveLength(4);
+		});
+
+		const checkboxes = screen.getAllByRole('checkbox');
+
+		// User unchecks the first value (`mq-kafka`)
+		await userEvent.click(checkboxes[0]);
+
+		// Composite query params (query builder data) should be updated via redirectWithQueryBuilderData
+		expect(redirectWithQueryBuilderData).toHaveBeenCalledTimes(1);
+
+		const [updatedQuery] = redirectWithQueryBuilderData.mock.calls[0];
+		const updatedFilters = updatedQuery.builder.queryData[0].filters;
+
+		expect(updatedFilters.items).toHaveLength(1);
+		expect(updatedFilters.items[0].key.key).toBe(SERVICE_NAME_KEY);
+		// When unchecking from an "all selected" state, we use a NOT_IN filter for that value
+		expect(updatedFilters.items[0].op).toBe('not in');
+		expect(updatedFilters.items[0].value).toBe('mq-kafka');
+	});
+
+	it('should set an IN filter with only the clicked value when using Only', async () => {
+		const redirectWithQueryBuilderData = jest.fn();
+
+		// Existing filter: service.name IN ['mq-kafka', 'otel-demo']
+		mockUseQueryBuilder.mockReturnValue({
+			lastUsedQuery: 0,
+			currentQuery: {
+				builder: {
+					queryData: [
+						{
+							filters: {
+								items: [
+									{
+										key: {
+											key: SERVICE_NAME_KEY,
+											dataType: DataTypes.String,
+											type: 'resource',
+										},
+										op: 'in',
+										value: ['mq-kafka', 'otel-demo'],
+									},
+								],
+								op: 'AND',
+							},
+						},
+					],
+				},
+			},
+			redirectWithQueryBuilderData,
+		} as any);
+
+		const mockFilter = createMockFilter({ defaultOpen: true });
+
+		render(
+			<CheckboxFilter
+				filter={mockFilter}
+				source={QuickFiltersSource.LOGS_EXPLORER}
+			/>,
+		);
+
+		// Wait for values to render
+		await waitFor(() => {
+			expect(screen.getByText('mq-kafka')).toBeInTheDocument();
+		});
+
+		// Click on the value label to trigger the "Only" behavior
+		await userEvent.click(screen.getByText('mq-kafka'));
+
+		expect(redirectWithQueryBuilderData).toHaveBeenCalledTimes(1);
+		const [updatedQuery] = redirectWithQueryBuilderData.mock.calls[0];
+		const updatedFilters = updatedQuery.builder.queryData[0].filters;
+
+		expect(updatedFilters.items).toHaveLength(1);
+		expect(updatedFilters.items[0].key.key).toBe(SERVICE_NAME_KEY);
+		expect(updatedFilters.items[0].op).toBe('in');
+		expect(updatedFilters.items[0].value).toBe('mq-kafka');
+	});
+
+	it('should clear filters for the attribute when using All', async () => {
+		const redirectWithQueryBuilderData = jest.fn();
+
+		// Existing filter: service.name IN ['mq-kafka']
+		mockUseQueryBuilder.mockReturnValue({
+			lastUsedQuery: 0,
+			currentQuery: {
+				builder: {
+					queryData: [
+						{
+							filters: {
+								items: [
+									{
+										key: {
+											key: SERVICE_NAME_KEY,
+											dataType: DataTypes.String,
+											type: 'resource',
+										},
+										op: 'in',
+										value: ['mq-kafka'],
+									},
+								],
+								op: 'AND',
+							},
+						},
+					],
+				},
+			},
+			redirectWithQueryBuilderData,
+		} as any);
+
+		const mockFilter = createMockFilter({ defaultOpen: true });
+
+		render(
+			<CheckboxFilter
+				filter={mockFilter}
+				source={QuickFiltersSource.LOGS_EXPLORER}
+			/>,
+		);
+
+		await waitFor(() => {
+			expect(screen.getByText('mq-kafka')).toBeInTheDocument();
+		});
+
+		// Only one value is selected, so clicking it should switch to "All" (no filter for this key)
+		await userEvent.click(screen.getByText('mq-kafka'));
+
+		expect(redirectWithQueryBuilderData).toHaveBeenCalledTimes(1);
+		const [updatedQuery] = redirectWithQueryBuilderData.mock.calls[0];
+		const updatedFilters = updatedQuery.builder.queryData[0].filters;
+
+		const filtersForServiceName = updatedFilters.items.filter(
+			(item: any) => item.key?.key === SERVICE_NAME_KEY,
+		);
+
+		expect(filtersForServiceName).toHaveLength(0);
+	});
+
+	it('should match filter when query uses resource. prefix (resource.service.name matches service.name)', async () => {
+		// Filter config uses unprefixed key (service.name)
+		// Query has filter with resource. prefix (resource.service.name)
+		// Checkbox should recognize the match and show checked state
+		mockUseQueryBuilder.mockReturnValue({
+			lastUsedQuery: 0,
+			currentQuery: {
+				builder: {
+					queryData: [
+						{
+							filters: {
+								items: [
+									{
+										key: {
+											key: 'resource.service.name',
+											dataType: DataTypes.String,
+											type: 'resource',
+										},
+										op: 'in',
+										value: [OTEL_DEMO],
+									},
+								],
+								op: 'AND',
+							},
+						},
+					],
+				},
+			},
+			redirectWithQueryBuilderData: jest.fn(),
+		} as any);
+
+		const mockFilter = createMockFilter({ defaultOpen: false });
+
+		render(
+			<CheckboxFilter
+				filter={mockFilter}
+				source={QuickFiltersSource.LOGS_EXPLORER}
+			/>,
+		);
+
+		// Filter should auto-open because it has active filters (key match via prefix stripping)
+		await waitFor(() => {
+			expect(screen.getByPlaceholderText('Filter values')).toBeInTheDocument();
+		});
+
+		// otel-demo should be checked (filter uses resource.service.name IN [otel-demo])
+		// Checked items are sorted to the top, so otel-demo is first
+		const checkboxes = screen.getAllByRole('checkbox');
+		expect(checkboxes[0]).toBeChecked();
+		expect(screen.getByText(OTEL_DEMO)).toBeInTheDocument();
+	});
+
+	it('should extend an existing IN filter when checking an additional value', async () => {
+		const redirectWithQueryBuilderData = jest.fn();
+
+		// Existing filter: service.name IN 'mq-kafka'
+		mockUseQueryBuilder.mockReturnValue({
+			lastUsedQuery: 0,
+			currentQuery: {
+				builder: {
+					queryData: [
+						{
+							filters: {
+								items: [
+									{
+										key: {
+											key: SERVICE_NAME_KEY,
+											dataType: DataTypes.String,
+											type: 'resource',
+										},
+										op: 'in',
+										value: 'mq-kafka',
+									},
+								],
+								op: 'AND',
+							},
+						},
+					],
+				},
+			},
+			redirectWithQueryBuilderData,
+		} as any);
+
+		const mockFilter = createMockFilter({ defaultOpen: true });
+
+		render(
+			<CheckboxFilter
+				filter={mockFilter}
+				source={QuickFiltersSource.LOGS_EXPLORER}
+			/>,
+		);
+
+		// Wait for checkboxes to render
+		await waitFor(() => {
+			expect(screen.getAllByRole('checkbox')).toHaveLength(4);
+		});
+
+		const checkboxes = screen.getAllByRole('checkbox');
+
+		// First checkbox corresponds to 'mq-kafka' (already selected),
+		// second will be 'otel-demo' which we now select additionally.
+		await userEvent.click(checkboxes[1]);
+
+		expect(redirectWithQueryBuilderData).toHaveBeenCalledTimes(1);
+		const [updatedQuery] = redirectWithQueryBuilderData.mock.calls[0];
+		const updatedFilters = updatedQuery.builder.queryData[0].filters;
+		const [filterForServiceName] = updatedFilters.items;
+
+		expect(filterForServiceName.key.key).toBe(SERVICE_NAME_KEY);
+		expect(filterForServiceName.op).toBe('in');
+		expect(filterForServiceName.value).toStrictEqual(['mq-kafka', 'otel-demo']);
+	});
+});

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

@@ -0,0 +1,177 @@
+/* eslint-disable sonarjs/no-identical-functions */
+import { Fragment, useMemo, useState } from 'react';
+import { Input } from '@signozhq/ui/input';
+import { Skeleton } from 'antd';
+import { Typography } from '@signozhq/ui/typography';
+import {
+	IQuickFiltersConfig,
+	QuickFilterChangeEventData,
+	QuickFiltersSource,
+} from 'components/QuickFilters/types';
+import { DEBOUNCE_DELAY } from 'constants/queryBuilderFilterConfig';
+import useDebouncedFn from 'hooks/useDebouncedFunction';
+import { Query } from 'types/api/queryBuilder/queryBuilderData';
+
+import CheckboxFilterHeader from './CheckboxFilterHeader';
+import CheckboxValueRow from './CheckboxValueRow';
+import LogsQuickFilterEmptyState from './LogsQuickFilterEmptyState';
+import useActiveQueryIndex from 'components/QuickFilters/hooks/useActiveQueryIndex';
+import useCheckboxDisclosure from './useCheckboxDisclosure';
+import useCheckboxFilterActions from './useCheckboxFilterActions';
+import useCheckboxFilterState, {
+	FILTER_DISABLED_REASON,
+} from './useCheckboxFilterState';
+import useCheckboxFilterValues from './useCheckboxFilterValues';
+
+import './Checkbox.styles.scss';
+
+const SOURCES_WITH_EMPTY_STATE_ENABLED = [QuickFiltersSource.LOGS_EXPLORER];
+
+interface ICheckboxProps {
+	filter: IQuickFiltersConfig;
+	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 { source, filter, onFilterChange, onQuickFilterChange } = props;
+	const [searchText, setSearchText] = useState<string>('');
+
+	const activeQueryIndex = useActiveQueryIndex(source);
+
+	const {
+		isOpen,
+		isSomeFilterPresentForCurrentAttribute,
+		visibleItemsCount,
+		onToggleOpen,
+		onShowMore,
+	} = useCheckboxDisclosure({ filter, activeQueryIndex });
+
+	const { attributeValues, isLoading } = useCheckboxFilterValues({
+		filter,
+		source,
+		searchText,
+		isOpen,
+	});
+
+	const { currentFilterState, isFilterDisabled, isMultipleValuesTrueForTheKey } =
+		useCheckboxFilterState({ filter, attributeValues, activeQueryIndex });
+
+	const { onChange, onClear } = useCheckboxFilterActions({
+		filter,
+		source,
+		attributeValues,
+		activeQueryIndex,
+		onFilterChange,
+		onQuickFilterChange,
+	});
+
+	const setSearchTextDebounced = useDebouncedFn((...args) => {
+		setSearchText(args[0] as string);
+	}, DEBOUNCE_DELAY);
+
+	// Sort checked items to the top, then unchecked items
+	const currentAttributeKeys = useMemo(() => {
+		const checkedValues = attributeValues.filter(
+			(val) => currentFilterState[val],
+		);
+		const uncheckedValues = attributeValues.filter(
+			(val) => !currentFilterState[val],
+		);
+		return [...checkedValues, ...uncheckedValues].slice(0, visibleItemsCount);
+	}, [attributeValues, currentFilterState, visibleItemsCount]);
+
+	// Count of checked values in the currently visible items
+	const checkedValuesCount = useMemo(
+		() => currentAttributeKeys.filter((val) => currentFilterState[val]).length,
+		[currentAttributeKeys, currentFilterState],
+	);
+
+	const isEmptyStateWithDocsEnabled =
+		SOURCES_WITH_EMPTY_STATE_ENABLED.includes(source) &&
+		!searchText &&
+		!attributeValues.length;
+
+	return (
+		<div className="checkbox-filter">
+			<CheckboxFilterHeader
+				title={filter.title}
+				isOpen={isOpen}
+				showClearAll={!!attributeValues.length}
+				onToggleOpen={onToggleOpen}
+				onClear={onClear}
+			/>
+			{isOpen && isLoading && !attributeValues.length && (
+				<section className="loading">
+					<Skeleton paragraph={{ rows: 4 }} />
+				</section>
+			)}
+			{isOpen && !isLoading && (
+				<>
+					{!isEmptyStateWithDocsEnabled && (
+						<section className="search">
+							<Input
+								placeholder="Filter values"
+								onChange={(e): void => setSearchTextDebounced(e.target.value)}
+								disabled={isFilterDisabled}
+							/>
+						</section>
+					)}
+					{attributeValues.length > 0 ? (
+						<section className="values">
+							{currentAttributeKeys.map((value: string, index: number) => (
+								<Fragment key={value}>
+									{index === checkedValuesCount && checkedValuesCount > 0 && (
+										<div
+											key="separator"
+											className="filter-separator"
+											data-testid="filter-separator"
+										/>
+									)}
+									<CheckboxValueRow
+										value={value}
+										checked={currentFilterState[value]}
+										disabled={isFilterDisabled}
+										disabledTooltip={FILTER_DISABLED_REASON}
+										title={filter.title}
+										onlyButtonLabel={
+											isSomeFilterPresentForCurrentAttribute
+												? currentFilterState[value] && !isMultipleValuesTrueForTheKey
+													? 'All'
+													: 'Only'
+												: 'Only'
+										}
+										customRendererForValue={filter.customRendererForValue}
+										onCheckboxChange={(checked): void => onChange(value, checked, false)}
+										onOnlyOrAllClick={(): void =>
+											onChange(value, currentFilterState[value], true)
+										}
+									/>
+								</Fragment>
+							))}
+						</section>
+					) : isEmptyStateWithDocsEnabled ? (
+						<LogsQuickFilterEmptyState attributeKey={filter.attributeKey.key} />
+					) : (
+						<section className="no-data">
+							<Typography.Text>No values found</Typography.Text>{' '}
+						</section>
+					)}
+					{visibleItemsCount < attributeValues?.length && (
+						<section className="show-more">
+							<Typography.Text className="show-more-text" onClick={onShowMore}>
+								Show More...
+							</Typography.Text>
+						</section>
+					)}
+				</>
+			)}
+		</div>
+	);
+}
+
+CheckboxFilter.defaultProps = {
+	onFilterChange: null,
+};

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

@@ -0,0 +1,47 @@
+import { Typography } from '@signozhq/ui/typography';
+import { ChevronDown, ChevronRight } from '@signozhq/icons';
+
+interface CheckboxFilterHeaderProps {
+	title: string;
+	isOpen: boolean;
+	showClearAll: boolean;
+	onToggleOpen: () => void;
+	onClear: () => void;
+}
+
+function CheckboxFilterHeader({
+	title,
+	isOpen,
+	showClearAll,
+	onToggleOpen,
+	onClear,
+}: CheckboxFilterHeaderProps): JSX.Element {
+	return (
+		<section className="filter-header-checkbox" onClick={onToggleOpen}>
+			<section className="left-action">
+				{isOpen ? (
+					<ChevronDown size={13} cursor="pointer" />
+				) : (
+					<ChevronRight size={13} cursor="pointer" />
+				)}
+				<Typography.Text className="title">{title}</Typography.Text>
+			</section>
+			<section className="right-action">
+				{isOpen && showClearAll && (
+					<Typography.Text
+						className="clear-all"
+						onClick={(e): void => {
+							e.stopPropagation();
+							e.preventDefault();
+							onClear();
+						}}
+					>
+						Clear All
+					</Typography.Text>
+				)}
+			</section>
+		</section>
+	);
+}
+
+export default CheckboxFilterHeader;

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

@@ -0,0 +1,77 @@
+import { Button } from 'antd';
+import { Checkbox } from '@signozhq/ui/checkbox';
+import { Typography } from '@signozhq/ui/typography';
+import cx from 'classnames';
+import { Tooltip } from '@signozhq/ui/tooltip';
+
+interface CheckboxValueRowProps {
+	value: string;
+	checked: boolean;
+	disabled: boolean;
+	disabledTooltip?: string;
+	title: string;
+	onlyButtonLabel: string;
+	customRendererForValue?: (value: string) => JSX.Element;
+	onCheckboxChange: (checked: boolean) => void;
+	onOnlyOrAllClick: () => void;
+}
+
+function CheckboxValueRow({
+	value,
+	checked,
+	disabled,
+	disabledTooltip,
+	title,
+	onlyButtonLabel,
+	customRendererForValue,
+	onCheckboxChange,
+	onOnlyOrAllClick,
+}: CheckboxValueRowProps): JSX.Element {
+	return (
+		<div className="value">
+			<Checkbox
+				color="primary"
+				disabledTooltip={disabledTooltip}
+				onChange={(isChecked): void => onCheckboxChange(isChecked === true)}
+				value={checked}
+				disabled={disabled}
+			/>
+
+			<div
+				className={cx('checkbox-value-section', disabled ? 'filter-disabled' : '')}
+				onClick={(): void => {
+					if (disabled) {
+						return;
+					}
+					onOnlyOrAllClick();
+				}}
+			>
+				<div className={`${title} label-${value}`} />
+				{customRendererForValue ? (
+					customRendererForValue(value)
+				) : (
+					<Tooltip title={String(value)} side="top" align="start">
+						<Typography.Text className="value-string" truncate={1}>
+							{String(value)}
+						</Typography.Text>
+					</Tooltip>
+				)}
+				<div className="value-actions">
+					<Button type="text" className="only-btn">
+						{onlyButtonLabel}
+					</Button>
+					<Button type="text" className="toggle-btn">
+						Toggle
+					</Button>
+				</div>
+			</div>
+		</div>
+	);
+}
+
+CheckboxValueRow.defaultProps = {
+	disabledTooltip: undefined,
+	customRendererForValue: undefined,
+};
+
+export default CheckboxValueRow;

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

@@ -0,0 +1,53 @@
+import { Color } from '@signozhq/design-tokens';
+import { Button } from 'antd';
+import EmptyQuickFilterIcon from 'assets/CustomIcons/EmptyQuickFilterIcon';
+import { ArrowUpRight } from '@signozhq/icons';
+
+const QUICK_FILTER_DOC_PATHS: Record<string, string> = {
+	severity_text: 'severity-text',
+	'deployment.environment': 'environment',
+	'service.name': 'service-name',
+	'host.name': 'hostname',
+	'k8s.cluster.name': 'k8s-cluster-name',
+	'k8s.deployment.name': 'k8s-deployment-name',
+	'k8s.namespace.name': 'k8s-namespace-name',
+	'k8s.pod.name': 'k8s-pod-name',
+};
+
+function LogsQuickFilterEmptyState({
+	attributeKey,
+}: {
+	attributeKey: string;
+}): JSX.Element {
+	const handleLearnMoreClick = (): void => {
+		const section = QUICK_FILTER_DOC_PATHS[attributeKey];
+
+		window.open(
+			`https://signoz.io/docs/logs-management/features/logs-quick-filters#${section}`,
+			'_blank',
+		);
+	};
+	return (
+		<section className="go-to-docs">
+			<div className="go-to-docs__container">
+				<div className="go-to-docs__container-icon">
+					<EmptyQuickFilterIcon />
+				</div>
+				<div className="go-to-docs__container-message">
+					{`You'd need to parse out this attribute to start getting them as a fast
+            filter.`}
+				</div>
+			</div>
+			<Button
+				type="link"
+				className="go-to-docs__button"
+				onClick={handleLearnMoreClick}
+			>
+				<div className="go-to-docs__button-text">Learn more</div>
+				<ArrowUpRight size={14} color={Color.BG_ROBIN_400} />
+			</Button>
+		</section>
+	);
+}
+
+export default LogsQuickFilterEmptyState;

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

@@ -1 +0,0 @@
-export const DEFAULT_VISIBLE_ITEMS_COUNT = 10;

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

@@ -2,9 +2,10 @@ import { useMemo, useState } from 'react';
 import { IQuickFiltersConfig } from 'components/QuickFilters/types';
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
 
-import { DEFAULT_VISIBLE_ITEMS_COUNT } from './constants';
 import { isKeyMatch } from './utils';
 
+const DEFAULT_VISIBLE_ITEMS_COUNT = 10;
+
 interface UseCheckboxDisclosureProps {
 	filter: IQuickFiltersConfig;
 	activeQueryIndex: number;

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

@@ -0,0 +1,99 @@
+import { useMemo } from 'react';
+import {
+	IQuickFiltersConfig,
+	QuickFiltersSource,
+} from 'components/QuickFilters/types';
+import { DATA_TYPE_VS_ATTRIBUTE_VALUES_KEY } from 'constants/queryBuilder';
+import { useGetAggregateValues } from 'hooks/queryBuilder/useGetAggregateValues';
+import { useGetQueryKeyValueSuggestions } from 'hooks/querySuggestions/useGetQueryKeyValueSuggestions';
+import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
+import { DataSource } from 'types/common/queryBuilder';
+
+interface UseCheckboxFilterValuesProps {
+	filter: IQuickFiltersConfig;
+	source: QuickFiltersSource;
+	searchText: string;
+	isOpen: boolean;
+}
+
+interface UseCheckboxFilterValuesReturn {
+	attributeValues: string[];
+	isLoading: boolean;
+}
+
+function useCheckboxFilterValues({
+	filter,
+	source,
+	searchText,
+	isOpen,
+}: UseCheckboxFilterValuesProps): UseCheckboxFilterValuesReturn {
+	const { data, isLoading } = useGetAggregateValues(
+		{
+			aggregateOperator: filter.aggregateOperator || 'noop',
+			dataSource: filter.dataSource || DataSource.LOGS,
+			aggregateAttribute: filter.aggregateAttribute || '',
+			attributeKey: filter.attributeKey.key,
+			filterAttributeKeyDataType: filter.attributeKey.dataType || DataTypes.EMPTY,
+			tagType: filter.attributeKey.type || '',
+			searchText: searchText ?? '',
+		},
+		{
+			enabled: isOpen && source !== QuickFiltersSource.METER_EXPLORER,
+			keepPreviousData: true,
+		},
+	);
+
+	const { data: keyValueSuggestions, isLoading: isLoadingKeyValueSuggestions } =
+		useGetQueryKeyValueSuggestions({
+			key: filter.attributeKey.key,
+			signal: filter.dataSource || DataSource.LOGS,
+			signalSource: 'meter',
+			options: {
+				enabled: isOpen && source === QuickFiltersSource.METER_EXPLORER,
+				keepPreviousData: true,
+			},
+		});
+
+	const attributeValues: string[] = useMemo(() => {
+		const dataType = filter.attributeKey.dataType || DataTypes.String;
+
+		if (source === QuickFiltersSource.METER_EXPLORER && keyValueSuggestions) {
+			// Process the response data
+			const responseData = keyValueSuggestions?.data as any;
+			const values = responseData.data?.values || {};
+			const stringValues = values.stringValues || [];
+			const numberValues = values.numberValues || [];
+
+			// Generate options from string values - explicitly handle empty strings
+			const stringOptions = stringValues
+				// Strict filtering for empty string - we'll handle it as a special case if needed
+				.filter(
+					(value: string | null | undefined): value is string =>
+						value !== null && value !== undefined && value !== '',
+				);
+
+			// Generate options from number values
+			const numberOptions = numberValues
+				.filter(
+					(value: number | null | undefined): value is number =>
+						value !== null && value !== undefined,
+				)
+				.map((value: number) => value.toString());
+
+			// Combine all options and make sure we don't have duplicate labels
+			return [...stringOptions, ...numberOptions];
+		}
+
+		const key = DATA_TYPE_VS_ATTRIBUTE_VALUES_KEY[dataType];
+		return (data?.payload?.[key] || []).filter(
+			(val) => val !== undefined && val !== null,
+		);
+	}, [data?.payload, filter.attributeKey.dataType, keyValueSuggestions, source]);
+
+	return {
+		attributeValues,
+		isLoading: isLoading || isLoadingKeyValueSuggestions,
+	};
+}
+
+export default useCheckboxFilterValues;

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/v2/CheckboxFilterV2.module.scss

@@ -6,6 +6,44 @@
 	border-bottom: 1px solid var(--l1-border);
 }
 
+.sectionActions {
+	width: 0;
+	overflow: hidden;
+	opacity: 0;
+	transform: translateX(4px);
+	pointer-events: none;
+	transition:
+		opacity 0.16s ease,
+		transform 0.16s ease,
+		width 0s linear 0.16s;
+}
+
+.checkboxFilter:hover .sectionActions,
+.sectionActions.sectionActionsPinned {
+	width: auto;
+	opacity: 1;
+	transform: translateX(0);
+	pointer-events: auto;
+	transition:
+		opacity 0.16s ease,
+		transform 0.16s ease;
+}
+
+.sectionActionsPinned .sectionActionHoverOnly {
+	opacity: 0;
+	transform: translateX(4px);
+	pointer-events: none;
+	transition:
+		opacity 0.16s ease,
+		transform 0.16s ease;
+}
+
+.checkboxFilter:hover .sectionActionsPinned .sectionActionHoverOnly {
+	opacity: 1;
+	transform: translateX(0);
+	pointer-events: auto;
+}
+
 .search {
 	--input-background: var(--l2-background);
 	--input-hover-background: var(--l2-background);

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

@@ -11,7 +11,6 @@ import {
 	QuickFiltersSource,
 } from '../../../types';
 import CheckboxFilterV2 from './CheckboxFilterV2';
-import { DEFAULT_VISIBLE_ITEMS_COUNT } from '../constants';
 
 export const DEFAULT_FILTER: IQuickFiltersConfig = {
 	type: FiltersType.CHECKBOX,
@@ -31,13 +30,6 @@ export const DEFAULT_USE_FIELD_APIS: QuickFilterCheckboxUseFieldApis = {
 	existingQuery: null,
 };
 
-// Enough extra values to push a section past the count that shows its search box.
-// Named to sort last, so a test's own values stay within the first page.
-export const EXTRA_VALUES = Array.from(
-	{ length: DEFAULT_VISIBLE_ITEMS_COUNT },
-	(_, index) => `zz-extra-value-${index + 1}`,
-);
-
 export function mockFieldsValuesAPI(response: {
 	relatedValues?: (string | null)[];
 	stringValues?: (string | null)[];

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

@@ -1,6 +1,7 @@
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { Input } from '@signozhq/ui/input';
 import { Skeleton } from 'antd';
+import classNames from 'classnames';
 import { Typography } from '@signozhq/ui/typography';
 import { LoaderCircle } from '@signozhq/icons';
 import {
@@ -16,7 +17,6 @@ import { Query } from 'types/api/queryBuilder/queryBuilderData';
 
 import { NON_SELECTED_OPERATORS } from '../checkboxFilterQuery';
 import useActiveQueryIndex from 'components/QuickFilters/hooks/useActiveQueryIndex';
-import { DEFAULT_VISIBLE_ITEMS_COUNT } from '../constants';
 import useCheckboxDisclosure from '../useCheckboxDisclosure';
 import useCheckboxFilterActions from '../useCheckboxFilterActions';
 import useCheckboxFilterState from '../useCheckboxFilterState';
@@ -45,8 +45,14 @@ export default function CheckboxFilterV2(
 	const { source, filter, onFilterChange, onQuickFilterChange, useFieldApis } =
 		props;
 	const [searchText, setSearchText] = useState<string>('');
+	const [isSearchOpen, setIsSearchOpen] = useState<boolean>(false);
 	const [userToggleState, setUserToggleState] = useState<boolean | null>(null);
 
+	const handleToggleSearch = (): void => {
+		setIsSearchOpen((prev) => !prev);
+		setSearchText('');
+	};
+
 	const { currentQuery } = useQueryBuilder();
 	const activeQueryIndex = useActiveQueryIndex(source);
 
@@ -115,14 +121,6 @@ export default function CheckboxFilterV2(
 		setSearchText(args[0] as string);
 	}, DEBOUNCE_DELAY);
 
-	const handleToggleOpen = (): void => {
-		if (isOpen) {
-			setSearchTextDebounced.cancel();
-			setSearchText('');
-		}
-		onToggleOpen();
-	};
-
 	const currentFilterOp = useMemo(() => {
 		const filterSync = currentQuery?.builder.queryData?.[
 			activeQueryIndex
@@ -168,22 +166,19 @@ export default function CheckboxFilterV2(
 		relatedExclusions,
 	});
 
-	// Kept while a search is typed, so narrowing the list does not remove the box,
-	// and while a refetch still shows the previous, narrowed results.
-	const wasSearchShown = useRef(false);
-	const isSearchShown =
-		searchText !== '' ||
-		totalCount > DEFAULT_VISIBLE_ITEMS_COUNT ||
-		(isFetching && wasSearchShown.current);
-	wasSearchShown.current = isSearchShown;
-
 	return (
 		<div className={styles.checkboxFilter} data-testid="checkbox-filter-v2">
 			<CheckboxFilterV2Header
 				title={filter.title}
 				isOpen={isOpen}
-				canReset={isSomeFilterPresentForCurrentAttribute}
-				onToggleOpen={handleToggleOpen}
+				actionsClassName={classNames(styles.sectionActions, {
+					[styles.sectionActionsPinned]: isSearchOpen,
+				})}
+				resetActionClassName={
+					isSearchOpen ? styles.sectionActionHoverOnly : undefined
+				}
+				onToggleOpen={onToggleOpen}
+				onToggleSearch={handleToggleSearch}
 				onClear={onClear}
 			/>
 			{isOpen && isLoading && !hasLoadedOnce.current && (
@@ -193,9 +188,10 @@ export default function CheckboxFilterV2(
 			)}
 			{isOpen && (!isLoading || hasLoadedOnce.current) && (
 				<>
-					{isSearchShown && (
+					{isSearchOpen && (
 						<section className={styles.search}>
 							<Input
+								autoFocus
 								placeholder="Filter values"
 								onChange={(e): void => setSearchTextDebounced(e.target.value)}
 								disabled={isFilterDisabled}

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

@@ -1,25 +1,31 @@
 import { useState } from 'react';
 import { Tooltip } from '@signozhq/ui/tooltip';
 import { Typography } from '@signozhq/ui/typography';
-import { ChevronDown, ChevronRight, Undo2 } from '@signozhq/icons';
+import { ChevronDown, ChevronRight, Search, Undo2 } from '@signozhq/icons';
 
 import { SectionActionButton } from '../../shared/SectionActionButton/SectionActionButton';
 
+import classNames from 'classnames';
+
 import styles from './CheckboxFilterV2Header.module.scss';
 
 interface CheckboxFilterHeaderProps {
 	title: string;
 	isOpen: boolean;
-	canReset: boolean;
+	actionsClassName?: string;
+	resetActionClassName?: string;
 	onToggleOpen: () => void;
+	onToggleSearch: () => void;
 	onClear: () => void;
 }
 
 export function CheckboxFilterV2Header({
 	title,
 	isOpen,
-	canReset,
+	actionsClassName,
+	resetActionClassName,
 	onToggleOpen,
+	onToggleSearch,
 	onClear,
 }: CheckboxFilterHeaderProps): JSX.Element {
 	const [isTitleTruncated, setIsTitleTruncated] = useState(false);
@@ -58,14 +64,21 @@ export function CheckboxFilterV2Header({
 				)}
 				<Tooltip title={isTitleTruncated ? title : undefined}>{titleText}</Tooltip>
 			</section>
-			{isOpen && canReset && (
-				<section className={styles.rightAction}>
+			{isOpen && (
+				<section className={classNames(styles.rightAction, actionsClassName)}>
 					<SectionActionButton
 						icon={<Undo2 size={14} />}
+						className={resetActionClassName}
 						tooltip="Reset"
 						onClick={onClear}
 						testId="checkbox-filter-clear-all"
 					/>
+					<SectionActionButton
+						icon={<Search size={14} />}
+						tooltip="Search"
+						onClick={onToggleSearch}
+						testId="checkbox-filter-search-toggle"
+					/>
 				</section>
 			)}
 		</section>

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

@@ -10,7 +10,6 @@ import {
 	buildQueryBuilderOverrides,
 	DEFAULT_FILTER,
 	DEFAULT_USE_FIELD_APIS,
-	EXTRA_VALUES,
 	getFilterFromCall,
 	mockFieldsValuesAPI,
 	renderWithFilter,
@@ -19,25 +18,6 @@ import {
 
 setupServer();
 
-const activeEnvironmentFilter = buildQueryBuilderOverrides({
-	builder: {
-		queryData: [
-			{
-				filters: {
-					items: [
-						{
-							key: { key: 'deployment.environment' },
-							op: 'in',
-							value: ['production'],
-						},
-					],
-					op: 'AND',
-				},
-			},
-		],
-	},
-});
-
 describe('CheckboxFilterV2 - interactions', () => {
 	describe('search functionality', () => {
 		it('filters values based on search text', async () => {
@@ -50,7 +30,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 
 					const values =
 						searchTextReceived === ''
-							? ['production', 'staging', 'development', ...EXTRA_VALUES]
+							? ['production', 'staging', 'development']
 							: ['production'];
 
 					return res(
@@ -80,6 +60,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 			await screen.findByTestId('checkbox-value-row-production');
 			expect(screen.getByTestId('checkbox-value-row-staging')).toBeInTheDocument();
 
+			await user.click(screen.getByTestId('checkbox-filter-search-toggle'));
 			const searchInput = screen.getByTestId('checkbox-filter-search');
 			await user.type(searchInput, 'prod');
 
@@ -92,41 +73,6 @@ describe('CheckboxFilterV2 - interactions', () => {
 					screen.queryByTestId('checkbox-value-row-staging'),
 				).not.toBeInTheDocument();
 			});
-			expect(screen.getByTestId('checkbox-filter-search')).toBeInTheDocument();
-		});
-
-		it('shows no search box when every value fits', async () => {
-			mockFieldsValuesAPI({ stringValues: EXTRA_VALUES });
-
-			render(
-				<CheckboxFilterV2
-					filter={DEFAULT_FILTER}
-					source={QuickFiltersSource.TRACES_EXPLORER}
-					useFieldApis={DEFAULT_USE_FIELD_APIS}
-				/>,
-			);
-
-			await screen.findByTestId(`checkbox-value-row-${EXTRA_VALUES[0]}`);
-
-			expect(
-				screen.queryByTestId('checkbox-filter-search'),
-			).not.toBeInTheDocument();
-		});
-
-		it('shows the search box once there are more values than fit', async () => {
-			mockFieldsValuesAPI({ stringValues: ['production', ...EXTRA_VALUES] });
-
-			render(
-				<CheckboxFilterV2
-					filter={DEFAULT_FILTER}
-					source={QuickFiltersSource.TRACES_EXPLORER}
-					useFieldApis={DEFAULT_USE_FIELD_APIS}
-				/>,
-			);
-
-			await expect(
-				screen.findByTestId('checkbox-filter-search'),
-			).resolves.toBeInTheDocument();
 		});
 
 		it('filters values via search while preserving existingQuery context', async () => {
@@ -146,7 +92,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 								data: {
 									values: {
 										relatedValues: ['production'],
-										stringValues: ['staging', 'development', ...EXTRA_VALUES],
+										stringValues: ['staging', 'development'],
 										numberValues: [],
 									},
 								},
@@ -198,6 +144,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 			// Related values now appear in "Related" section (no badge, uses divider instead)
 			expect(screen.getByTestId('section-divider-related')).toBeInTheDocument();
 
+			await user.click(screen.getByTestId('checkbox-filter-search-toggle'));
 			const searchInput = screen.getByTestId('checkbox-filter-search');
 			await user.type(searchInput, 'prod');
 
@@ -225,10 +172,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 							data: {
 								values: {
 									relatedValues: [],
-									stringValues:
-										searchText === ''
-											? ['prod', 'staging', ...EXTRA_VALUES]
-											: ['prod-match'],
+									stringValues: searchText === '' ? ['prod', 'staging'] : ['prod-match'],
 									numberValues: [],
 								},
 							},
@@ -250,6 +194,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 
 			await screen.findByTestId('checkbox-value-row-prod');
 
+			await user.click(screen.getByTestId('checkbox-filter-search-toggle'));
 			const searchInput = screen.getByTestId('checkbox-filter-search');
 			await user.type(searchInput, 'prod');
 
@@ -275,8 +220,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 							data: {
 								values: {
 									relatedValues: [],
-									stringValues:
-										searchText === '' ? ['prod', 'staging', ...EXTRA_VALUES] : [],
+									stringValues: searchText === '' ? ['prod', 'staging'] : [],
 									numberValues: [],
 								},
 							},
@@ -295,6 +239,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 
 			await screen.findByTestId('checkbox-value-row-prod');
 
+			await user.click(screen.getByTestId('checkbox-filter-search-toggle'));
 			const searchInput = screen.getByTestId('checkbox-filter-search');
 			await user.type(searchInput, 'xyz-no-match');
 
@@ -371,9 +316,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 					const relatedValues =
 						searchText === '' ? ['pod-a-v1', 'pod-b-v1', 'pod-c-v1'] : ['pod-a-v1']; // filtered to match 'pod-a'
 					const stringValues =
-						searchText === ''
-							? ['pod-a-v2', 'pod-b-v2', 'pod-c-v2', ...EXTRA_VALUES]
-							: ['pod-a-v2']; // filtered to match 'pod-a'
+						searchText === '' ? ['pod-a-v2', 'pod-b-v2', 'pod-c-v2'] : ['pod-a-v2']; // filtered to match 'pod-a'
 
 					return res(
 						ctx.status(200),
@@ -404,6 +347,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 
 			await screen.findByTestId('checkbox-value-row-pod-a-v1');
 
+			await user.click(screen.getByTestId('checkbox-filter-search-toggle'));
 			const searchInput = screen.getByTestId('checkbox-filter-search');
 			await user.type(searchInput, 'pod-a');
 
@@ -481,113 +425,6 @@ describe('CheckboxFilterV2 - interactions', () => {
 			expect(header).toHaveAttribute('data-state', 'open');
 			await screen.findByTestId('checkbox-value-row-production');
 		});
-
-		it('opens a closed filter when the query filters on its key', async () => {
-			mockFieldsValuesAPI({
-				stringValues: ['production', 'staging'],
-			});
-
-			render(
-				<CheckboxFilterV2
-					filter={{ ...DEFAULT_FILTER, defaultOpen: false }}
-					source={QuickFiltersSource.TRACES_EXPLORER}
-					useFieldApis={DEFAULT_USE_FIELD_APIS}
-				/>,
-				undefined,
-				{ queryBuilderOverrides: activeEnvironmentFilter },
-			);
-
-			expect(screen.getByTestId('checkbox-filter-header')).toHaveAttribute(
-				'data-state',
-				'open',
-			);
-			await expect(
-				screen.findByTestId('checkbox-value-row-production'),
-			).resolves.toHaveAttribute('data-state', 'checked');
-		});
-
-		it('keeps the user toggle over the auto-open', async () => {
-			const user = userEvent.setup();
-
-			mockFieldsValuesAPI({
-				stringValues: ['production'],
-			});
-
-			render(
-				<CheckboxFilterV2
-					filter={{ ...DEFAULT_FILTER, defaultOpen: false }}
-					source={QuickFiltersSource.TRACES_EXPLORER}
-					useFieldApis={DEFAULT_USE_FIELD_APIS}
-				/>,
-				undefined,
-				{ queryBuilderOverrides: activeEnvironmentFilter },
-			);
-
-			const header = screen.getByTestId('checkbox-filter-header');
-			await screen.findByTestId('checkbox-value-row-production');
-
-			await user.click(header);
-
-			expect(header).toHaveAttribute('data-state', 'closed');
-			expect(
-				screen.queryByTestId('checkbox-value-row-production'),
-			).not.toBeInTheDocument();
-
-			await user.click(header);
-
-			expect(header).toHaveAttribute('data-state', 'open');
-			await screen.findByTestId('checkbox-value-row-production');
-		});
-
-		it('clears the search when the filter is collapsed', async () => {
-			const user = userEvent.setup();
-			const values = Array.from(
-				{ length: 12 },
-				(_, i) => `value-${String(i).padStart(2, '0')}`,
-			);
-
-			server.use(
-				rest.get('http://localhost/api/v1/fields/values', (req, res, ctx) => {
-					const searchText = req.url.searchParams.get('searchText') || '';
-					return res(
-						ctx.status(200),
-						ctx.json({
-							status: 'success',
-							data: {
-								values: {
-									relatedValues: [],
-									stringValues: values.filter((value) => value.includes(searchText)),
-									numberValues: [],
-								},
-							},
-						}),
-					);
-				}),
-			);
-
-			render(
-				<CheckboxFilterV2
-					filter={DEFAULT_FILTER}
-					source={QuickFiltersSource.TRACES_EXPLORER}
-					useFieldApis={DEFAULT_USE_FIELD_APIS}
-				/>,
-			);
-
-			await screen.findByTestId('checkbox-value-row-value-00');
-			await user.type(screen.getByTestId('checkbox-filter-search'), '11');
-			await waitFor(() =>
-				expect(
-					screen.queryByTestId('checkbox-value-row-value-00'),
-				).not.toBeInTheDocument(),
-			);
-
-			const header = screen.getByTestId('checkbox-filter-header');
-			await user.click(header);
-			await user.click(header);
-
-			await screen.findByTestId('checkbox-value-row-value-00');
-			expect(screen.getByTestId('checkbox-filter-search')).toHaveValue('');
-		});
 	});
 
 	describe('show more functionality', () => {
@@ -683,7 +520,7 @@ describe('CheckboxFilterV2 - interactions', () => {
 			expect(screen.getByTestId('checkbox-filter-clear-all')).toBeInTheDocument();
 		});
 
-		it('hides reset when the section has no filter applied', async () => {
+		it('shows the reset action when expanded even with no active filter', async () => {
 			mockFieldsValuesAPI({
 				stringValues: ['production'],
 			});
@@ -698,9 +535,45 @@ describe('CheckboxFilterV2 - interactions', () => {
 
 			await screen.findByTestId('checkbox-value-row-production');
 
-			expect(
-				screen.queryByTestId('checkbox-filter-clear-all'),
-			).not.toBeInTheDocument();
+			// Reset is always available on an expanded section now (hover-gated via
+			// CSS), not conditional on an active filter.
+			expect(screen.getByTestId('checkbox-filter-clear-all')).toBeInTheDocument();
+		});
+
+		it('does not dispatch on clear when the key has no filter', async () => {
+			const user = userEvent.setup();
+			const onFilterChange = jest.fn();
+
+			mockFieldsValuesAPI({
+				stringValues: ['production'],
+			});
+
+			render(
+				<CheckboxFilterV2
+					filter={DEFAULT_FILTER}
+					source={QuickFiltersSource.TRACES_EXPLORER}
+					useFieldApis={DEFAULT_USE_FIELD_APIS}
+					onFilterChange={onFilterChange}
+				/>,
+				undefined,
+				{
+					queryBuilderOverrides: buildQueryBuilderOverrides({
+						builder: {
+							queryData: [
+								{
+									filters: { items: [], op: 'AND' },
+									filter: { expression: '' },
+								},
+							],
+						},
+					}),
+				},
+			);
+
+			await screen.findByTestId('checkbox-value-row-production');
+			await user.click(screen.getByTestId('checkbox-filter-clear-all'));
+
+			expect(onFilterChange).not.toHaveBeenCalled();
 		});
 
 		it('calls onFilterChange when clear clicked', async () => {

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

@@ -9,7 +9,6 @@ import CheckboxFilterV2 from '../CheckboxFilterV2';
 import {
 	DEFAULT_FILTER,
 	DEFAULT_USE_FIELD_APIS,
-	EXTRA_VALUES,
 	mockFieldsValuesAPI,
 	mockFieldsValuesAPILoading,
 	setupServer,
@@ -90,7 +89,7 @@ describe('CheckboxFilterV2 - states', () => {
 								data: {
 									values: {
 										relatedValues: [],
-										stringValues: ['production', 'staging', ...EXTRA_VALUES],
+										stringValues: ['production', 'staging'],
 										numberValues: [],
 									},
 								},
@@ -111,6 +110,7 @@ describe('CheckboxFilterV2 - states', () => {
 
 			await screen.findByTestId('checkbox-value-row-production');
 
+			await user.click(screen.getByTestId('checkbox-filter-search-toggle'));
 			const searchInput = screen.getByTestId('checkbox-filter-search');
 			await user.type(searchInput, 'prod');
 

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

@@ -7,8 +7,8 @@ describe('CheckboxFilterV2Header', () => {
 	const defaultProps = {
 		title: 'Environment',
 		isOpen: false,
-		canReset: true,
 		onToggleOpen: jest.fn(),
+		onToggleSearch: jest.fn(),
 		onClear: jest.fn(),
 	};
 
@@ -30,9 +30,12 @@ describe('CheckboxFilterV2Header', () => {
 			expect(header).toHaveAttribute('data-state', 'closed');
 		});
 
-		it('does not render reset when collapsed', () => {
+		it('does not render the section actions when collapsed', () => {
 			render(<CheckboxFilterV2Header {...defaultProps} isOpen={false} />);
 
+			expect(
+				screen.queryByTestId('checkbox-filter-search-toggle'),
+			).not.toBeInTheDocument();
 			expect(
 				screen.queryByTestId('checkbox-filter-clear-all'),
 			).not.toBeInTheDocument();
@@ -47,18 +50,13 @@ describe('CheckboxFilterV2Header', () => {
 			expect(header).toHaveAttribute('data-state', 'open');
 		});
 
-		it('renders reset when the section has a filter applied', () => {
+		it('renders both search and reset actions when expanded', () => {
 			render(<CheckboxFilterV2Header {...defaultProps} isOpen />);
 
-			expect(screen.getByTestId('checkbox-filter-clear-all')).toBeInTheDocument();
-		});
-
-		it('hides reset when there is nothing to reset', () => {
-			render(<CheckboxFilterV2Header {...defaultProps} isOpen canReset={false} />);
-
 			expect(
-				screen.queryByTestId('checkbox-filter-clear-all'),
-			).not.toBeInTheDocument();
+				screen.getByTestId('checkbox-filter-search-toggle'),
+			).toBeInTheDocument();
+			expect(screen.getByTestId('checkbox-filter-clear-all')).toBeInTheDocument();
 		});
 	});
 
@@ -101,6 +99,25 @@ describe('CheckboxFilterV2Header', () => {
 			expect(onToggleOpen).toHaveBeenCalledTimes(1);
 		});
 
+		it('calls onToggleSearch on search click without toggling open', async () => {
+			const user = userEvent.setup();
+			const onToggleSearch = jest.fn();
+			const onToggleOpen = jest.fn();
+			render(
+				<CheckboxFilterV2Header
+					{...defaultProps}
+					isOpen
+					onToggleSearch={onToggleSearch}
+					onToggleOpen={onToggleOpen}
+				/>,
+			);
+
+			await user.click(screen.getByTestId('checkbox-filter-search-toggle'));
+
+			expect(onToggleSearch).toHaveBeenCalledTimes(1);
+			expect(onToggleOpen).not.toHaveBeenCalled();
+		});
+
 		it('calls onClear on reset click without toggling open', async () => {
 			const user = userEvent.setup();
 			const onClear = jest.fn();

frontend/src/components/QuickFilters/QuickFilters.tsx

@@ -34,6 +34,7 @@ import {
 import { isFunction } from 'lodash-es';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';
 
+import Checkbox from './FilterRenderers/Checkbox/Checkbox';
 import useActiveQueryIndex from './hooks/useActiveQueryIndex';
 import CheckboxV2 from './FilterRenderers/Checkbox/v2/CheckboxFilterV2';
 import Duration from './FilterRenderers/Duration/Duration';
@@ -309,6 +310,25 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 			<section className="filters">
 				{filterConfig.map((filter) => {
 					switch (filter.type) {
+						case FiltersType.CHECKBOX:
+							return useFieldApis ? (
+								<CheckboxV2
+									key={filter.attributeKey.key}
+									source={source}
+									filter={filter}
+									onFilterChange={onFilterChange}
+									onQuickFilterChange={onQuickFilterChange}
+									useFieldApis={useFieldApis}
+								/>
+							) : (
+								<Checkbox
+									key={filter.attributeKey.key}
+									source={source}
+									filter={filter}
+									onFilterChange={onFilterChange}
+									onQuickFilterChange={onQuickFilterChange}
+								/>
+							);
 						case FiltersType.DURATION:
 							return (
 								<Duration
@@ -320,8 +340,9 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 							);
 						case FiltersType.SLIDER:
 							return <Slider key={filter.attributeKey.key} />;
+						// eslint-disable-next-line sonarjs/no-duplicated-branches
 						default:
-							return (
+							return useFieldApis ? (
 								<CheckboxV2
 									key={filter.attributeKey.key}
 									source={source}
@@ -330,6 +351,14 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 									onQuickFilterChange={onQuickFilterChange}
 									useFieldApis={useFieldApis}
 								/>
+							) : (
+								<Checkbox
+									key={filter.attributeKey.key}
+									source={source}
+									filter={filter}
+									onFilterChange={onFilterChange}
+									onQuickFilterChange={onQuickFilterChange}
+								/>
 							);
 					}
 				})}
@@ -411,4 +440,5 @@ QuickFilters.defaultProps = {
 	config: [],
 	showFilterCollapse: true,
 	showQueryName: true,
+	useFieldApis: undefined,
 };

frontend/src/components/QuickFilters/QuickFiltersLayout/QuickFiltersLayout.tsx

@@ -9,7 +9,6 @@ import { useSavedViewEnabled } from 'hooks/useSavedViewEnabled';
 
 import QuickFilters from '../QuickFilters';
 import { SIDEBAR_TOOLTIP_DELAY_MS } from './constants';
-import { useCloseOnOutsidePress } from './useCloseOnOutsidePress';
 
 import styles from './QuickFiltersLayout.module.scss';
 
@@ -62,20 +61,12 @@ function QuickFiltersLayout({
 
 	const isSliding = hasQuickFilters && isViewsListOpen;
 
-	const openViews = (): void => setIsViewsListOpen(true);
-	const toggleViews = (): void => setIsViewsListOpen((isOpen) => !isOpen);
-	const closeViews = (): void => setIsViewsListOpen(false);
-	const markSidebarPress = useCloseOnOutsidePress(
-		showSidebar && isSliding,
-		closeViews,
-	);
-
 	const savedViewsHeader = hasSavedViews ? (
 		<SavedViewsHeader
 			{...savedViewProps}
-			onOpenViews={isViewsListVisible ? undefined : openViews}
-			isViewsOpen={isViewsListOpen}
-			onToggleViews={isViewsListPinned ? undefined : toggleViews}
+			onOpenViews={
+				isViewsListVisible ? undefined : (): void => setIsViewsListOpen(true)
+			}
 			onCollapse={hasQuickFilters ? undefined : onToggleFilters}
 		/>
 	) : undefined;
@@ -86,7 +77,6 @@ function QuickFiltersLayout({
 			{showSidebar && (
 				<aside
 					className={cx(styles.sidebar, { [styles.isStatic]: !hasQuickFilters })}
-					onPointerDownCapture={markSidebarPress}
 					data-testid="quick-filters-layout-filters"
 				>
 					<TooltipProvider delay={SIDEBAR_TOOLTIP_DELAY_MS}>
@@ -108,7 +98,9 @@ function QuickFiltersLayout({
 							{hasSavedViews && isViewsListVisible && (
 								<SavedViewsPanel
 									{...savedViewProps}
-									onClose={isViewsListPinned ? undefined : closeViews}
+									onClose={
+										isViewsListPinned ? undefined : (): void => setIsViewsListOpen(false)
+									}
 								/>
 							)}
 						</div>

frontend/src/components/QuickFilters/QuickFiltersLayout/__tests__/QuickFiltersLayout.test.tsx

@@ -63,7 +63,6 @@ jest.mock('../../QuickFilters', () => ({
 
 const quickFilterProps = {
 	source: QuickFiltersSource.TRACES_EXPLORER,
-	useFieldApis: { startUnixMilli: 0, endUnixMilli: 0 },
 };
 const savedViewProps = { source: SavedviewtypesSourceDTO.traces };
 
@@ -218,62 +217,6 @@ describe('QuickFiltersLayout', () => {
 			expect(screen.getByTestId('saved-views-open')).toBeInTheDocument();
 		});
 
-		it('opens and closes the panel from the view name', async () => {
-			render(
-				<QuickFiltersLayout
-					showFilters
-					quickFilterProps={quickFilterProps}
-					savedViewProps={savedViewProps}
-				>
-					<div>content</div>
-				</QuickFiltersLayout>,
-			);
-			const user = userEvent.setup();
-			const toggle = await screen.findByTestId('saved-views-name-toggle');
-
-			expect(toggle).toHaveAttribute('aria-expanded', 'false');
-			await user.click(toggle);
-
-			expect(screen.getByTestId('saved-views-panel')).toBeInTheDocument();
-			expect(drawer()).toHaveClass('isOpen');
-			expect(toggle).toHaveAttribute('aria-expanded', 'true');
-
-			await user.click(toggle);
-
-			expect(screen.queryByTestId('saved-views-panel')).not.toBeInTheDocument();
-			expect(drawer()).not.toHaveClass('isOpen');
-		});
-
-		it('closes the panel on a click outside the sidebar, not inside it', async () => {
-			render(
-				<>
-					<button type="button" data-testid="page-tab">
-						Pipelines
-					</button>
-					<QuickFiltersLayout
-						showFilters
-						quickFilterProps={quickFilterProps}
-						savedViewProps={savedViewProps}
-					>
-						<div data-testid="page-content">content</div>
-					</QuickFiltersLayout>
-				</>,
-			);
-			const user = userEvent.setup();
-
-			await user.click(await screen.findByTestId('saved-views-name-toggle'));
-			await user.click(screen.getByTestId('saved-views-panel-header'));
-			expect(screen.getByTestId('saved-views-panel')).toBeInTheDocument();
-
-			await user.click(screen.getByTestId('page-tab'));
-			expect(screen.queryByTestId('saved-views-panel')).not.toBeInTheDocument();
-			expect(drawer()).not.toHaveClass('isOpen');
-
-			await user.click(await screen.findByTestId('saved-views-name-toggle'));
-			await user.click(screen.getByTestId('page-content'));
-			expect(screen.queryByTestId('saved-views-panel')).not.toBeInTheDocument();
-		});
-
 		it('hands the source to the header and the panel', async () => {
 			render(
 				<QuickFiltersLayout
@@ -314,9 +257,6 @@ describe('QuickFiltersLayout', () => {
 			expect(screen.getByTestId('saved-views-header')).toBeInTheDocument();
 			expect(screen.getByTestId('saved-views-panel')).toBeInTheDocument();
 			expect(screen.queryByTestId('saved-views-open')).not.toBeInTheDocument();
-			expect(
-				screen.queryByTestId('saved-views-name-toggle'),
-			).not.toBeInTheDocument();
 			expect(
 				screen.queryByTestId('saved-views-panel-header'),
 			).not.toBeInTheDocument();

frontend/src/components/QuickFilters/QuickFiltersLayout/__tests__/useCloseOnOutsidePress.test.tsx

@@ -1,63 +0,0 @@
-import { createPortal } from 'react-dom';
-import { render, screen, userEvent } from 'tests/test-utils';
-
-import { useCloseOnOutsidePress } from '../useCloseOnOutsidePress';
-
-function Harness({
-	enabled,
-	onClose,
-}: {
-	enabled: boolean;
-	onClose: () => void;
-}): JSX.Element {
-	const markInside = useCloseOnOutsidePress(enabled, onClose);
-
-	return (
-		<>
-			<div onPointerDownCapture={markInside}>
-				<button type="button" data-testid="inside">
-					inside
-				</button>
-				{createPortal(
-					<button type="button" data-testid="portal">
-						menu item
-					</button>,
-					document.body,
-				)}
-			</div>
-			<button type="button" data-testid="outside">
-				outside
-			</button>
-		</>
-	);
-}
-
-describe('useCloseOnOutsidePress', () => {
-	it('closes on a press outside', async () => {
-		const onClose: jest.MockedFunction<() => void> = jest.fn();
-		render(<Harness enabled onClose={onClose} />);
-
-		await userEvent.click(screen.getByTestId('outside'));
-
-		expect(onClose).toHaveBeenCalledTimes(1);
-	});
-
-	it('stays open on a press inside, including a portal rendered from inside', async () => {
-		const onClose: jest.MockedFunction<() => void> = jest.fn();
-		render(<Harness enabled onClose={onClose} />);
-
-		await userEvent.click(screen.getByTestId('inside'));
-		await userEvent.click(screen.getByTestId('portal'));
-
-		expect(onClose).not.toHaveBeenCalled();
-	});
-
-	it('does nothing while disabled', async () => {
-		const onClose: jest.MockedFunction<() => void> = jest.fn();
-		render(<Harness enabled={false} onClose={onClose} />);
-
-		await userEvent.click(screen.getByTestId('outside'));
-
-		expect(onClose).not.toHaveBeenCalled();
-	});
-});

frontend/src/components/QuickFilters/QuickFiltersLayout/useCloseOnOutsidePress.ts

@@ -1,39 +0,0 @@
-import { useCallback, useEffect, useRef } from 'react';
-
-/**
- * Calls `onClose` on any press outside the element given the returned handler as
- * `onPointerDownCapture`. Menus and dialogs rendered in portals still count as
- * inside: React events follow the component tree, so their presses reach the
- * handler before the document listener runs.
- */
-export function useCloseOnOutsidePress(
-	enabled: boolean,
-	onClose: () => void,
-): () => void {
-	const isPressInside = useRef(false);
-	const onCloseRef = useRef(onClose);
-	onCloseRef.current = onClose;
-
-	useEffect(() => {
-		if (!enabled) {
-			return undefined;
-		}
-		isPressInside.current = false;
-
-		const handlePointerDown = (): void => {
-			if (isPressInside.current) {
-				isPressInside.current = false;
-				return;
-			}
-			onCloseRef.current();
-		};
-
-		document.addEventListener('pointerdown', handlePointerDown);
-		return (): void =>
-			document.removeEventListener('pointerdown', handlePointerDown);
-	}, [enabled]);
-
-	return useCallback((): void => {
-		isPressInside.current = true;
-	}, []);
-}

frontend/src/components/QuickFilters/stories/QuickFilters.stories.mocks.tsx

@@ -11,13 +11,11 @@ import {
 import { rest, type RequestHandler } from 'msw';
 import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
 
-import {
-	fieldKeysResponse,
-	fieldValuesResponse,
-} from '@/storybook/msw/__story_mockdata__/fields';
+import { attributeValuesResponse } from '@/storybook/msw/__story_mockdata__/attributes';
+import { fieldKeysResponse } from '@/storybook/msw/__story_mockdata__/fields';
 import { quickFiltersResponse } from '@/storybook/msw/__story_mockdata__/quickFilters';
 
-import { FiltersType, QuickFilterCheckboxUseFieldApis } from '../types';
+import { FiltersType } from '../types';
 
 const customFilters = [
 	{
@@ -63,15 +61,13 @@ export const checkboxConfig = [
 	},
 ];
 
-export const fieldApis: QuickFilterCheckboxUseFieldApis = {
-	startUnixMilli: 1700000000000,
-	endUnixMilli: 1700003600000,
-	existingQuery: null,
-};
-
-export const fieldValuesHandler = (values: readonly string[]): RequestHandler =>
-	rest.get('http://localhost/api/v1/fields/values', (_req, res, ctx) =>
-		res(ctx.status(200), ctx.json(fieldValuesResponse(values))),
+export const attributeValuesHandler = (
+	values: readonly string[],
+): RequestHandler =>
+	rest.get(
+		'http://localhost/api/v3/autocomplete/attribute_values',
+		(_req, res, ctx) =>
+			res(ctx.status(200), ctx.json(attributeValuesResponse(values))),
 	);
 
 export const handlers = [
@@ -86,7 +82,7 @@ export const handlers = [
 	rest.get('http://localhost/api/v1/fields/keys', (_req, res, ctx) =>
 		res(ctx.status(200), ctx.json(fieldKeysResponse(['k8s.namespace.name']))),
 	),
-	fieldValuesHandler(['checkout', 'frontend', 'payments']),
+	attributeValuesHandler(['checkout', 'frontend', 'payments']),
 ];
 
 export const loadingFiltersHandlers = [

frontend/src/components/QuickFilters/stories/QuickFilters.stories.tsx

@@ -7,9 +7,8 @@ import type { GlobalMockArgs } from '@/storybook/globals';
 
 import QuickFilters from '../QuickFilters';
 import {
+	attributeValuesHandler,
 	checkboxConfig,
-	fieldApis,
-	fieldValuesHandler,
 	handlers,
 	LONG_FILTER_VALUES,
 	loadingFiltersHandlers,
@@ -35,7 +34,6 @@ const meta = {
 		handleFilterVisibilityChange: (): void => undefined,
 		signal: SignalType.LOGS,
 		source: QuickFiltersSource.LOGS_EXPLORER,
-		useFieldApis: fieldApis,
 	},
 	parameters: {
 		msw: { handlers },
@@ -116,7 +114,7 @@ export const SelectedExpandedCheckbox: Story = {
 export const Tooltips: TooltipsStory = {
 	args: { signal: undefined, tooltipsOpen: true },
 	parameters: {
-		msw: { handlers: [fieldValuesHandler(LONG_FILTER_VALUES), ...handlers] },
+		msw: { handlers: [attributeValuesHandler(LONG_FILTER_VALUES), ...handlers] },
 	},
 };
 

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

@@ -16,7 +16,7 @@ import {
 } from 'lib/authz/utils/authz-test-utils';
 import {
 	otherFiltersResponse,
-	quickFiltersFieldValuesResponse,
+	quickFiltersAttributeValuesResponse,
 	quickFiltersListResponse,
 } from 'mocks-server/__mockdata__/customQuickFilters';
 import { server } from 'mocks-server/server';
@@ -25,7 +25,7 @@ import { render, screen, userEvent, waitFor } from 'tests/test-utils';
 
 import QuickFilters from '../QuickFilters';
 import { QuickFiltersSource, SignalType } from '../types';
-import { QuickFiltersConfig, QuickFiltersFieldApis } from './constants';
+import { QuickFiltersConfig } from './constants';
 
 jest.mock('hooks/queryBuilder/useQueryBuilder', () => ({
 	useQueryBuilder: jest.fn(),
@@ -38,6 +38,7 @@ const BASE_URL = ENVIRONMENT.baseURL;
 const SIGNAL = SignalType.LOGS;
 const quickFiltersListURL = `${BASE_URL}/api/v2/quick_filters/${SIGNAL}`;
 const fieldsKeysURL = `${BASE_URL}/api/v1/fields/keys`;
+const attributeValuesURL = `${BASE_URL}/api/v3/autocomplete/attribute_values`;
 const fieldsValuesURL = `${BASE_URL}/api/v1/fields/values`;
 
 const NOT_AUTHORIZED_TEXT = /is not authorized to perform/i;
@@ -70,8 +71,11 @@ beforeEach(() => {
 		rest.get(fieldsKeysURL, (_req, res, ctx) =>
 			res(ctx.status(200), ctx.json(otherFiltersResponse)),
 		),
+		rest.get(attributeValuesURL, (_req, res, ctx) =>
+			res(ctx.status(200), ctx.json(quickFiltersAttributeValuesResponse)),
+		),
 		rest.get(fieldsValuesURL, (_req, res, ctx) =>
-			res(ctx.status(200), ctx.json(quickFiltersFieldValuesResponse)),
+			res(ctx.status(200), ctx.json(quickFiltersAttributeValuesResponse)),
 		),
 	);
 });
@@ -87,7 +91,6 @@ function renderWithSignal(): void {
 			source={QuickFiltersSource.LOGS_EXPLORER}
 			signal={SIGNAL}
 			handleFilterVisibilityChange={jest.fn()}
-			useFieldApis={QuickFiltersFieldApis}
 		/>,
 	);
 }
@@ -98,7 +101,6 @@ function renderStaticConfig(): void {
 			source={QuickFiltersSource.EXCEPTIONS}
 			config={QuickFiltersConfig}
 			handleFilterVisibilityChange={jest.fn()}
-			useFieldApis={QuickFiltersFieldApis}
 		/>,
 	);
 }

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

@@ -6,7 +6,7 @@ import {
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
 import {
 	otherFiltersResponse,
-	quickFiltersFieldValuesResponse,
+	quickFiltersAttributeValuesResponse,
 	quickFiltersListResponse,
 } from 'mocks-server/__mockdata__/customQuickFilters';
 import { server } from 'mocks-server/server';
@@ -17,7 +17,7 @@ import '@testing-library/jest-dom';
 
 import QuickFilters from '../QuickFilters';
 import { IQuickFiltersConfig, QuickFiltersSource, SignalType } from '../types';
-import { QuickFiltersConfig, QuickFiltersFieldApis } from './constants';
+import { QuickFiltersConfig } from './constants';
 
 jest.mock('hooks/queryBuilder/useQueryBuilder', () => ({
 	useQueryBuilder: jest.fn(),
@@ -37,6 +37,7 @@ const SIGNAL = SignalType.LOGS;
 const quickFiltersListURL = `${BASE_URL}/api/v2/quick_filters/${SIGNAL}`;
 const saveQuickFiltersURL = `${BASE_URL}/api/v2/quick_filters/${SIGNAL}`;
 const quickFiltersSuggestionsURL = `${BASE_URL}/api/v1/fields/keys`;
+const quickFiltersAttributeValuesURL = `${BASE_URL}/api/v3/autocomplete/attribute_values`;
 const fieldsValuesURL = `${BASE_URL}/api/v1/fields/values`;
 
 const FILTER_OS_DESCRIPTION = 'os.description';
@@ -61,8 +62,11 @@ const setupServer = (): void => {
 			putHandler(await req.json());
 			return res(ctx.status(200), ctx.json({}));
 		}),
+		rest.get(quickFiltersAttributeValuesURL, (_req, res, ctx) =>
+			res(ctx.status(200), ctx.json(quickFiltersAttributeValuesResponse)),
+		),
 		rest.get(fieldsValuesURL, (_req, res, ctx) =>
-			res(ctx.status(200), ctx.json(quickFiltersFieldValuesResponse)),
+			res(ctx.status(200), ctx.json(quickFiltersAttributeValuesResponse)),
 		),
 	);
 };
@@ -79,7 +83,6 @@ function TestQuickFilters({
 			source={QuickFiltersSource.EXCEPTIONS}
 			config={config}
 			handleFilterVisibilityChange={handleFilterVisibilityChange}
-			useFieldApis={QuickFiltersFieldApis}
 			signal={signal}
 		/>
 	);
@@ -102,7 +105,6 @@ function TestQuickFiltersApiMonitoring({
 			source={QuickFiltersSource.API_MONITORING}
 			config={config}
 			handleFilterVisibilityChange={handleFilterVisibilityChange}
-			useFieldApis={QuickFiltersFieldApis}
 			signal={signal}
 		/>
 	);

frontend/src/components/QuickFilters/tests/constants.ts

@@ -1,6 +1,6 @@
 import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
 
-import { FiltersType, QuickFilterCheckboxUseFieldApis } from '../types';
+import { FiltersType } from '../types';
 
 export const QuickFiltersConfig = [
 	{
@@ -24,9 +24,3 @@ export const QuickFiltersConfig = [
 		defaultOpen: false,
 	},
 ];
-
-export const QuickFiltersFieldApis: QuickFilterCheckboxUseFieldApis = {
-	startUnixMilli: 1700000000000,
-	endUnixMilli: 1700003600000,
-	existingQuery: null,
-};

frontend/src/components/QuickFilters/types.ts

@@ -61,7 +61,7 @@ export interface IQuickFiltersProps {
 	className?: string;
 	showFilterCollapse?: boolean;
 	showQueryName?: boolean;
-	useFieldApis: QuickFilterCheckboxUseFieldApis;
+	useFieldApis?: QuickFilterCheckboxUseFieldApis;
 	savedViewsHeader?: ReactNode;
 }
 
@@ -75,6 +75,9 @@ export enum QuickFiltersSource {
 	AI_OBSERVABILITY = 'ai-observability',
 }
 
+/**
+ * Opt-in: fetch values from the /v1/fields/values API instead of /v3/autocomplete/attribute_values
+ */
 export type QuickFilterCheckboxUseFieldApis = {
 	startUnixMilli: number;
 	endUnixMilli: number;

frontend/src/container/AIAssistant/events.ts

@@ -71,7 +71,6 @@ export const AIAssistantOpenSource = {
 	Shortcut: 'shortcut',
 	Cmdk: 'cmdk',
 	TraceDetails: 'trace_details',
-	BottomStrip: 'bottom_strip',
 } as const;
 export type AIAssistantOpenSource =
 	(typeof AIAssistantOpenSource)[keyof typeof AIAssistantOpenSource];

frontend/src/container/BottomStrip/AskNoz/AskNoz.tsx

@@ -1,15 +1,8 @@
-import { useCallback } from 'react';
 import { useLocation } from 'react-router-dom';
 import { Button } from '@signozhq/ui/button';
 import { Tooltip } from '@signozhq/ui/tooltip';
-import logEvent from 'api/common/logEvent';
 import Noz from 'components/Noz/Noz';
 import { NOZ_TOOLTIP_TITLE } from 'components/Noz/Noz.constants';
-import {
-	AIAssistantEvents,
-	AIAssistantOpenSource,
-} from 'container/AIAssistant/events';
-import { normalizePage } from 'container/AIAssistant/hooks/useAIAssistantAnalyticsContext';
 import { selectPendingUserInputStreamCount } from 'container/AIAssistant/store/pendingInputSelectors';
 import {
 	openAIAssistant,
@@ -44,14 +37,6 @@ function AskNoz(): JSX.Element | null {
 	// The drawer does not render on the Noz full page, so the button would be inert.
 	const isAIAssistantPage = pathname.startsWith(ROUTES.AI_ASSISTANT_BASE);
 
-	const handleOpen = useCallback((): void => {
-		void logEvent(AIAssistantEvents.Opened, {
-			source: AIAssistantOpenSource.BottomStrip,
-			currentPage: normalizePage(pathname),
-		});
-		openAIAssistant();
-	}, [pathname]);
-
 	if (!isAIAssistantEnabled || isDrawerOpen || isAIAssistantPage) {
 		return null;
 	}
@@ -72,7 +57,7 @@ function AskNoz(): JSX.Element | null {
 						color="secondary"
 						size="sm"
 						prefix={<Noz size={16} />}
-						onClick={handleOpen}
+						onClick={(): void => openAIAssistant()}
 						aria-label={
 							showPendingBadge
 								? `Ask Noz, ${pendingUserInputCount} ${

frontend/src/container/BottomStrip/AskNoz/__tests__/AskNoz.test.tsx

@@ -1,9 +1,4 @@
 import { fireEvent } from '@testing-library/react';
-import logEvent from 'api/common/logEvent';
-import {
-	AIAssistantEvents,
-	AIAssistantOpenSource,
-} from 'container/AIAssistant/events';
 import { openAIAssistant } from 'container/AIAssistant/store/useAIAssistantStore';
 import { useIsAIAssistantEnabled } from 'hooks/useIsAIAssistantEnabled';
 import { render } from 'tests/test-utils';
@@ -11,10 +6,6 @@ import { render } from 'tests/test-utils';
 import AskNoz from '../AskNoz';
 
 jest.mock('hooks/useIsAIAssistantEnabled');
-jest.mock('api/common/logEvent', () => ({
-	__esModule: true,
-	default: jest.fn(),
-}));
 jest.mock('container/AIAssistant/store/useAIAssistantStore', () => ({
 	openAIAssistant: jest.fn(),
 	useAIAssistantStore: jest.fn(),
@@ -100,17 +91,6 @@ describe('AskNoz', () => {
 
 			expect(mockOpen).toHaveBeenCalledTimes(1);
 		});
-
-		it('reports the open as coming from the strip', () => {
-			const { getByRole } = render(<AskNoz />);
-
-			fireEvent.click(getByRole('button'));
-
-			expect(logEvent).toHaveBeenCalledWith(
-				AIAssistantEvents.Opened,
-				expect.objectContaining({ source: AIAssistantOpenSource.BottomStrip }),
-			);
-		});
 	});
 
 	describe('pending badge', () => {

frontend/src/container/BottomStrip/SupportButton/SupportButton.tsx

@@ -1,16 +1,9 @@
 import { useState } from 'react';
 import { Button } from '@signozhq/ui/button';
-import logEvent from 'api/common/logEvent';
 import AddCreditCardModal from 'components/AddCreditCardModal/AddCreditCardModal';
 import { ChatSupportState, useChatSupport } from 'hooks/useChatSupport';
 import { MessageSquareText } from '@signozhq/icons';
 
-import {
-	BottomStripEventKeys,
-	BottomStripEvents,
-	BottomStripSupportType,
-} from '../events';
-
 function SupportButton(): JSX.Element | null {
 	const chatSupport = useChatSupport();
 	const [isAddCreditCardModalOpen, setIsAddCreditCardModalOpen] =
@@ -21,13 +14,7 @@ function SupportButton(): JSX.Element | null {
 	}
 
 	const handleClick = (): void => {
-		const needsCard = chatSupport === ChatSupportState.NeedsCard;
-		void logEvent(BottomStripEvents.SupportClicked, {
-			[BottomStripEventKeys.Type]: needsCard
-				? BottomStripSupportType.AddCard
-				: BottomStripSupportType.Pylon,
-		});
-		if (needsCard) {
+		if (chatSupport === ChatSupportState.NeedsCard) {
 			setIsAddCreditCardModalOpen(true);
 			return;
 		}

frontend/src/container/BottomStrip/SupportButton/__tests__/SupportButton.test.tsx

@@ -1,16 +1,9 @@
 import { fireEvent } from '@testing-library/react';
-import logEvent from 'api/common/logEvent';
 import { ChatSupportState, useChatSupport } from 'hooks/useChatSupport';
 import { render } from 'tests/test-utils';
 
-import { BottomStripEvents, BottomStripSupportType } from '../../events';
 import SupportButton from '../SupportButton';
 
-jest.mock('api/common/logEvent', () => ({
-	__esModule: true,
-	default: jest.fn(),
-}));
-
 jest.mock('hooks/useChatSupport', () => ({
 	...jest.requireActual('hooks/useChatSupport'),
 	useChatSupport: jest.fn(),
@@ -44,9 +37,6 @@ describe('SupportButton', () => {
 			fireEvent.click(getByTestId(BUTTON));
 
 			expect(window.Pylon).toHaveBeenCalledWith('show');
-			expect(logEvent).toHaveBeenCalledWith(BottomStripEvents.SupportClicked, {
-				type: BottomStripSupportType.Pylon,
-			});
 		});
 
 		it('does not open the credit card modal', () => {
@@ -74,9 +64,6 @@ describe('SupportButton', () => {
 
 			expect(getByText(MODAL_TITLE)).toBeInTheDocument();
 			expect(window.Pylon).not.toHaveBeenCalled();
-			expect(logEvent).toHaveBeenCalledWith(BottomStripEvents.SupportClicked, {
-				type: BottomStripSupportType.AddCard,
-			});
 		});
 	});
 

frontend/src/container/BottomStrip/events.ts

@@ -1,12 +0,0 @@
-export enum BottomStripEvents {
-	SupportClicked = 'Bottom Strip: Support clicked',
-}
-
-export enum BottomStripEventKeys {
-	Type = 'type',
-}
-
-export enum BottomStripSupportType {
-	Pylon = 'pylon',
-	AddCard = 'add_card',
-}

frontend/src/container/InfraMonitoringHostsV2/InfraMonitoringHosts.module.scss

@@ -57,6 +57,10 @@
 	:global(.ant-collapse-content-box) {
 		padding: 0 !important;
 		padding-block: 0 !important;
+
+		:global(.quick-filters .checkbox-filter) {
+			padding-left: 18px;
+		}
 	}
 }
 

frontend/src/container/SavedViews/SavedViewsHeader.tsx

@@ -12,7 +12,6 @@ import {
 	SavedViewCreatePermission,
 	SavedViewListPermission,
 } from 'lib/authz/hooks/useAuthZ/permissions/saved-view.permissions';
-import { useAuthZ } from 'lib/authz/hooks/useAuthZ/useAuthZ';
 
 import {
 	MY_VIEW_NAME,
@@ -20,13 +19,11 @@ import {
 	SAVED_VIEW_LOAD_FAILED_NAME,
 	SAVED_VIEW_TOAST_POSITION,
 } from './constants';
-import { SavedViewCreatedFrom } from './events';
 import { useActiveSavedView } from './hooks/useActiveSavedView';
 import { useSaveNewView } from './hooks/useSaveNewView';
 import { useSavedViewActions } from './hooks/useSavedViewActions';
 import SaveChangesMenu from './SaveChangesMenu';
 import SavedViewsIconButton from './SavedViewsIconButton';
-import SavedViewsNameToggle from './SavedViewsNameToggle';
 import SaveViewModal from './SaveViewModal';
 import { SaveViewModalMode } from './types';
 
@@ -35,16 +32,11 @@ import styles from './SavedViewsHeader.module.scss';
 function SavedViewsHeader({
 	source,
 	onOpenViews,
-	isViewsOpen = false,
-	onToggleViews,
 	onCollapse,
 }: {
 	source: SavedviewtypesSourceDTO;
 	// Absent while the list is on screen.
 	onOpenViews?: () => void;
-	isViewsOpen?: boolean;
-	// Absent while the list is pinned open.
-	onToggleViews?: () => void;
 	onCollapse?: () => void;
 }): JSX.Element {
 	const {
@@ -57,27 +49,12 @@ function SavedViewsHeader({
 	} = useActiveSavedView(source);
 	const { viewKey } = useGetSavedViewParams();
 	const readPermission = buildSavedViewReadPermission(viewKey);
-	const { isLoading: isCheckingList, deniedPermissions: deniedList } = useAuthZ(
-		[SavedViewListPermission],
-		{ enabled: !!onToggleViews },
-	);
-	const canListViews = !isCheckingList && deniedList.length === 0;
 	const { revertView, clearView, createView, updateView, isSaving } =
 		useSavedViewActions(source);
 
 	const [modalMode, setModalMode] = useState<SaveViewModalMode | null>(null);
 
-	const saveNewView = useSaveNewView(createView);
-	const handleSave = useCallback(
-		(displayName: string): Promise<boolean> =>
-			saveNewView(
-				displayName,
-				modalMode === 'saveAsNew'
-					? SavedViewCreatedFrom.SaveAsNew
-					: SavedViewCreatedFrom.Header,
-			),
-		[saveNewView, modalMode],
-	);
+	const handleSave = useSaveNewView(createView);
 
 	const handleUpdate = useCallback(async (): Promise<void> => {
 		if (view && (await updateView(view))) {
@@ -95,9 +72,6 @@ function SavedViewsHeader({
 		name = SAVED_VIEW_LOAD_FAILED_NAME;
 	}
 	const isDirty = !isError && !!view && hasUnsavedChanges;
-	// Same gates as the All views button; an open panel can always be closed.
-	const canToggleViews =
-		isViewsOpen || (canListViews && !isDirty && !isReadDenied);
 
 	const nameChip = (
 		<span
@@ -138,17 +112,10 @@ function SavedViewsHeader({
 						className={styles.skeleton}
 						testId="saved-views-loading"
 					/>
+				) : isReadDenied ? (
+					<AuthZTooltip checks={[readPermission]}>{nameChip}</AuthZTooltip>
 				) : (
-					<SavedViewsNameToggle
-						isOpen={isViewsOpen}
-						onToggle={canToggleViews ? onToggleViews : undefined}
-					>
-						{isReadDenied ? (
-							<AuthZTooltip checks={[readPermission]}>{nameChip}</AuthZTooltip>
-						) : (
-							<Tooltip title={errorMessage ?? name}>{nameChip}</Tooltip>
-						)}
-					</SavedViewsNameToggle>
+					<Tooltip title={errorMessage ?? name}>{nameChip}</Tooltip>
 				)}
 			</div>
 

frontend/src/container/SavedViews/SavedViewsList.tsx

@@ -10,7 +10,6 @@ import { useGetSavedViewParams } from 'hooks/saveViews/useGetSavedViewParams';
 
 import { SAVED_VIEWS_LIST_LOADING_ROWS } from './constants';
 import DeleteSavedViewDialog from './DeleteSavedViewDialog';
-import { SavedViewCreatedFrom } from './events';
 import { useSavedViewActions } from './hooks/useSavedViewActions';
 import { useSavedViewHoverCard } from './hooks/useSavedViewHoverCard';
 import { useSavedViewRowActions } from './hooks/useSavedViewRowActions';
@@ -36,7 +35,7 @@ function SavedViewsList({
 	search: string;
 }): JSX.Element {
 	const { viewKey } = useGetSavedViewParams();
-	const { selectView, clearView, resetView, createView, isSaving } =
+	const { selectView, clearView, createView, isSaving } =
 		useSavedViewActions(source);
 	const saveNewView = useSaveNewView(createView);
 	const { createdByMe, createdByOthers, isLoading, isError, refetch } =
@@ -103,10 +102,10 @@ function SavedViewsList({
 			return;
 		}
 		if (pendingAction.view.id === viewKey) {
-			resetView();
+			clearView();
 		}
 		setPendingAction(null);
-	}, [pendingAction, deleteView, viewKey, resetView]);
+	}, [pendingAction, deleteView, viewKey, clearView]);
 
 	if (isLoading) {
 		return (
@@ -142,9 +141,7 @@ function SavedViewsList({
 			<SavedViewsEmptyState
 				isSearching={search.trim().length > 0}
 				isSaving={isSaving}
-				onSave={(displayName): Promise<boolean> =>
-					saveNewView(displayName, SavedViewCreatedFrom.EmptyState)
-				}
+				onSave={saveNewView}
 			/>
 		);
 	}

frontend/src/container/SavedViews/SavedViewsNameToggle.module.scss

@@ -1,14 +0,0 @@
-.toggle {
-	display: flex;
-	min-width: 0;
-	--button-height: auto;
-	// A flex label lets the chip shrink and use its own ellipsis.
-	--button-label-display: flex;
-}
-
-// The chip inherits its type from the button; doubled to outrank the button's
-// size rule so the chip reads the same as when it is not a toggle.
-.toggle.toggle > button {
-	font: inherit;
-	letter-spacing: inherit;
-}

frontend/src/container/SavedViews/SavedViewsNameToggle.tsx

@@ -1,36 +0,0 @@
-import { ReactElement } from 'react';
-import { Button } from '@signozhq/ui/button';
-
-import styles from './SavedViewsNameToggle.module.scss';
-
-function SavedViewsNameToggle({
-	isOpen,
-	onToggle,
-	children,
-}: {
-	isOpen: boolean;
-	onToggle?: () => void;
-	children: ReactElement;
-}): JSX.Element {
-	if (!onToggle) {
-		return children;
-	}
-
-	return (
-		<span className={styles.toggle}>
-			<Button
-				variant="link"
-				color="secondary"
-				size="sm"
-				textOverflow="hidden"
-				onClick={onToggle}
-				aria-expanded={isOpen}
-				testId="saved-views-name-toggle"
-			>
-				{children}
-			</Button>
-		</span>
-	);
-}
-
-export default SavedViewsNameToggle;

frontend/src/container/SavedViews/__tests__/SavedViews.analytics.test.tsx

@@ -1,322 +0,0 @@
-import {
-	act,
-	fireEvent,
-	screen,
-	waitFor,
-	within,
-} from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { toast } from '@signozhq/ui/sonner';
-import { SavedviewtypesSourceDTO } from 'api/generated/services/sigNoz.schemas';
-import { PANEL_TYPES } from 'constants/queryBuilder';
-import ROUTES from 'constants/routes';
-import { DataSource } from 'types/common/queryBuilder';
-
-import { SavedViewCreatedFrom, SavedViewEvents } from '../events';
-import SavedViewsHeader from '../SavedViewsHeader';
-import SavedViewsPanel from '../SavedViewsPanel';
-import { mockSavedViewsApi } from './savedViewsApiMock';
-import {
-	expectRowUsable,
-	expectUsable,
-	explorerUrl,
-	makeView,
-	MENU_CHECK_TIMEOUT,
-	queryWith,
-	renderWithExplorerProviders,
-	viewUrl,
-} from './savedViewsTestUtils';
-
-const logEventMock = jest.fn();
-jest.mock('api/common/logEvent', () => ({
-	__esModule: true,
-	default: (...args: unknown[]): void => logEventMock(...args),
-}));
-
-jest.mock('@signozhq/ui/sonner', () => ({
-	...jest.requireActual('@signozhq/ui/sonner'),
-	toast: { success: jest.fn(), error: jest.fn() },
-}));
-
-// copy-to-clipboard falls back to window.prompt in jsdom.
-jest.mock('react-use', () => ({
-	...jest.requireActual('react-use'),
-	useCopyToClipboard: (): [unknown, jest.Mock] => [null, jest.fn()],
-}));
-
-const PATH = ROUTES.TRACES_EXPLORER;
-const source = SavedviewtypesSourceDTO.traces;
-
-const errors = makeView({ id: 'view-1', displayName: 'Errors' });
-
-function renderAll(
-	url = explorerUrl(PATH, {}),
-): ReturnType<typeof renderWithExplorerProviders> {
-	return renderWithExplorerProviders(
-		<>
-			<SavedViewsHeader source={source} onOpenViews={jest.fn()} />
-			<SavedViewsPanel source={source} onClose={jest.fn()} />
-		</>,
-		url,
-	);
-}
-
-const row = (name: string): HTMLElement =>
-	screen
-		.getAllByTestId('saved-views-row')
-		.find((element) => element.textContent?.includes(name)) as HTMLElement;
-
-// Buttons and menu rows ignore clicks until their permission check settles.
-async function clickWhenUsable(testId: string): Promise<void> {
-	await waitFor(() => expectUsable(screen.getByTestId(testId)));
-	await userEvent.click(screen.getByTestId(testId));
-}
-
-async function chooseMenuItem(testId: string): Promise<void> {
-	const item = await screen.findByTestId(testId);
-	await waitFor(() => expectRowUsable(item), MENU_CHECK_TIMEOUT);
-	fireEvent.click(item);
-}
-
-async function chooseFromRowMenu(viewName: string, key: string): Promise<void> {
-	await screen.findByTestId('saved-views-list');
-	fireEvent.click(within(row(viewName)).getByTestId('saved-views-row-menu'));
-	await chooseMenuItem(`saved-views-row-menu-item-${key}`);
-}
-
-async function chooseFromSaveMenu(key: string): Promise<void> {
-	await userEvent.click(screen.getByTestId('saved-views-save-changes'));
-	await chooseMenuItem(`saved-views-save-changes-item-${key}`);
-}
-
-async function submitName(name: string): Promise<void> {
-	await userEvent.type(screen.getByTestId('save-view-name'), name);
-	await userEvent.click(screen.getByTestId('save-view-submit'));
-}
-
-async function waitForView(name: string): Promise<void> {
-	await waitFor(() =>
-		expect(screen.getByTestId('saved-views-name')).toHaveTextContent(name),
-	);
-	await waitFor(() =>
-		expect(screen.getByTestId('saved-views-clear')).toBeInTheDocument(),
-	);
-}
-
-const callsOf = (event: SavedViewEvents): unknown[][] =>
-	logEventMock.mock.calls.filter(([name]) => name === event);
-
-describe('SavedViews analytics', () => {
-	beforeEach(() => {
-		localStorage.clear();
-		logEventMock.mockClear();
-		jest.mocked(toast.error).mockClear();
-	});
-
-	it('logs a view created from the header', async () => {
-		mockSavedViewsApi([errors], { createdId: 'view-new' });
-		renderAll();
-
-		await clickWhenUsable('saved-views-create');
-		await submitName('Slow checkout');
-
-		await waitFor(() =>
-			expect(logEventMock).toHaveBeenCalledWith(SavedViewEvents.ViewCreated, {
-				source,
-				viewId: 'view-new',
-				from: SavedViewCreatedFrom.Header,
-			}),
-		);
-	});
-
-	it('logs a view created from the empty state', async () => {
-		mockSavedViewsApi([], { createdId: 'view-new' });
-		renderAll();
-
-		await screen.findByTestId('saved-views-list-create');
-		await clickWhenUsable('saved-views-list-create');
-		await submitName('Slow checkout');
-
-		await waitFor(() =>
-			expect(logEventMock).toHaveBeenCalledWith(SavedViewEvents.ViewCreated, {
-				source,
-				viewId: 'view-new',
-				from: SavedViewCreatedFrom.EmptyState,
-			}),
-		);
-	});
-
-	it('does not log a create that fails', async () => {
-		mockSavedViewsApi([errors], { createStatus: 500 });
-		renderAll();
-
-		await clickWhenUsable('saved-views-create');
-		await submitName('Slow checkout');
-
-		await waitFor(() => expect(toast.error).toHaveBeenCalled());
-		expect(callsOf(SavedViewEvents.ViewCreated)).toHaveLength(0);
-	});
-
-	describe('on a changed view', () => {
-		async function openDirtyView(): Promise<void> {
-			const { history } = renderAll(viewUrl(PATH, errors));
-			await waitForView('Errors');
-			act(() => {
-				history.push(
-					explorerUrl(PATH, {
-						query: queryWith(DataSource.TRACES, 'has_error = false'),
-						panelType: PANEL_TYPES.LIST,
-						viewKey: errors.id,
-					}),
-				);
-			});
-			await screen.findByTestId('saved-views-discard');
-		}
-
-		it('does not log an update that fails', async () => {
-			mockSavedViewsApi([errors], { updateStatus: 500 });
-			await openDirtyView();
-
-			await chooseFromSaveMenu('update');
-
-			await waitFor(() => expect(toast.error).toHaveBeenCalled());
-			expect(callsOf(SavedViewEvents.ViewUpdated)).toHaveLength(0);
-		});
-
-		it('logs an update', async () => {
-			mockSavedViewsApi([errors]);
-			await openDirtyView();
-
-			await chooseFromSaveMenu('update');
-			await waitFor(() =>
-				expect(logEventMock).toHaveBeenCalledWith(SavedViewEvents.ViewUpdated, {
-					source,
-					viewId: errors.id,
-				}),
-			);
-		});
-
-		it('logs a view created with save as new', async () => {
-			mockSavedViewsApi([errors], { createdId: 'view-copy' });
-			await openDirtyView();
-
-			await chooseFromSaveMenu('save-as-new');
-			await submitName('Errors copy');
-			await waitFor(() =>
-				expect(logEventMock).toHaveBeenCalledWith(SavedViewEvents.ViewCreated, {
-					source,
-					viewId: 'view-copy',
-					from: SavedViewCreatedFrom.SaveAsNew,
-				}),
-			);
-		});
-
-		it('logs discarded changes', async () => {
-			mockSavedViewsApi([errors]);
-			await openDirtyView();
-			logEventMock.mockClear();
-
-			await userEvent.click(screen.getByTestId('saved-views-discard'));
-
-			expect(logEventMock).toHaveBeenCalledWith(SavedViewEvents.ChangesDiscarded, {
-				source,
-				viewId: errors.id,
-			});
-		});
-	});
-
-	it('logs a cleared view', async () => {
-		mockSavedViewsApi([errors]);
-		renderAll(viewUrl(PATH, errors));
-		await waitForView('Errors');
-
-		await userEvent.click(screen.getByTestId('saved-views-clear'));
-
-		expect(logEventMock).toHaveBeenCalledWith(SavedViewEvents.ViewCleared, {
-			source,
-			viewId: errors.id,
-		});
-	});
-
-	it('logs a view cleared from its row', async () => {
-		mockSavedViewsApi([errors]);
-		renderAll(viewUrl(PATH, errors));
-		await waitForView('Errors');
-
-		await userEvent.click(await screen.findByTestId('saved-views-row-clear'));
-
-		expect(logEventMock).toHaveBeenCalledWith(SavedViewEvents.ViewCleared, {
-			source,
-			viewId: errors.id,
-		});
-	});
-
-	it('logs only the delete when the open view is deleted', async () => {
-		mockSavedViewsApi([errors]);
-		renderAll(viewUrl(PATH, errors));
-		await waitForView('Errors');
-
-		await chooseFromRowMenu('Errors', 'delete');
-		await userEvent.click(screen.getByTestId('delete-saved-view-confirm'));
-
-		await waitFor(() =>
-			expect(logEventMock).toHaveBeenCalledWith(SavedViewEvents.ViewDeleted, {
-				source,
-				viewId: errors.id,
-			}),
-		);
-		await waitFor(() =>
-			expect(screen.getByTestId('saved-views-name')).toHaveTextContent('My view'),
-		);
-		expect(callsOf(SavedViewEvents.ViewCleared)).toHaveLength(0);
-	});
-
-	it('logs a copied link', async () => {
-		mockSavedViewsApi([errors]);
-		renderAll();
-
-		await chooseFromRowMenu('Errors', 'copyLink');
-
-		expect(logEventMock).toHaveBeenCalledWith(SavedViewEvents.LinkCopied, {
-			source,
-			viewId: errors.id,
-		});
-	});
-
-	it('logs edited view details', async () => {
-		mockSavedViewsApi([errors]);
-		renderAll();
-
-		await chooseFromRowMenu('Errors', 'editDetails');
-		await submitName(' renamed');
-
-		await waitFor(() =>
-			expect(logEventMock).toHaveBeenCalledWith(
-				SavedViewEvents.ViewDetailsEdited,
-				{ source, viewId: errors.id },
-			),
-		);
-	});
-
-	it('does not log edited view details that fail to save', async () => {
-		mockSavedViewsApi([errors], { updateStatus: 500 });
-		renderAll();
-
-		await chooseFromRowMenu('Errors', 'editDetails');
-		await submitName(' renamed');
-
-		await waitFor(() => expect(toast.error).toHaveBeenCalled());
-		expect(callsOf(SavedViewEvents.ViewDetailsEdited)).toHaveLength(0);
-	});
-
-	it('does not log a delete that fails', async () => {
-		mockSavedViewsApi([errors], { deleteStatus: 500 });
-		renderAll();
-
-		await chooseFromRowMenu('Errors', 'delete');
-		await userEvent.click(screen.getByTestId('delete-saved-view-confirm'));
-
-		await waitFor(() => expect(toast.error).toHaveBeenCalled());
-		expect(callsOf(SavedViewEvents.ViewDeleted)).toHaveLength(0);
-	});
-});

frontend/src/container/SavedViews/__tests__/SavedViews.authz.test.tsx

@@ -52,7 +52,6 @@ function renderHeader(
 		<SavedViewsHeader
 			source={SavedviewtypesSourceDTO.traces}
 			onOpenViews={jest.fn()}
-			onToggleViews={jest.fn()}
 		/>,
 		url,
 	);
@@ -263,46 +262,4 @@ describe('SavedViews - AuthZ', () => {
 			expect(screen.queryAllByText(message).length).toBeGreaterThan(0),
 		);
 	});
-
-	describe('view name toggle', () => {
-		it('toggles the views from the name when list is allowed', async () => {
-			mockSavedViewsApi([]);
-			renderHeader(explorerUrl(PATH, {}));
-
-			await expect(
-				screen.findByTestId('saved-views-name-toggle'),
-			).resolves.toBeInTheDocument();
-		});
-
-		it('leaves the name plain without list, the All views button says why', async () => {
-			mockSavedViewsApi([]);
-			server.use(setupAuthzDeny(SavedViewListPermission));
-			renderHeader(explorerUrl(PATH, {}));
-
-			await waitFor(() =>
-				expect(screen.getByTestId('saved-views-open')).toHaveAttribute(
-					'aria-disabled',
-					'true',
-				),
-			);
-			expect(
-				screen.queryByTestId('saved-views-name-toggle'),
-			).not.toBeInTheDocument();
-		});
-
-		it('leaves the name plain on a view it cannot read', async () => {
-			mockSavedViewsApi([errors]);
-			server.use(setupAuthzDeny(buildSavedViewReadPermission(errors.id)));
-			renderHeader(viewUrl(PATH, errors));
-
-			await waitFor(() =>
-				expect(screen.getByTestId('saved-views-name')).toHaveTextContent(
-					'No view access',
-				),
-			);
-			expect(
-				screen.queryByTestId('saved-views-name-toggle'),
-			).not.toBeInTheDocument();
-		});
-	});
 });

frontend/src/container/SavedViews/__tests__/SavedViewsHeader.save.test.tsx

@@ -30,14 +30,11 @@ const PATH = ROUTES.TRACES_EXPLORER;
 
 function renderHeader(
 	url: string,
-	isViewsOpen = false,
 ): ReturnType<typeof renderWithExplorerProviders> {
 	return renderWithExplorerProviders(
 		<SavedViewsHeader
 			source={SavedviewtypesSourceDTO.traces}
 			onOpenViews={jest.fn()}
-			isViewsOpen={isViewsOpen}
-			onToggleViews={jest.fn()}
 		/>,
 		url,
 	);
@@ -48,9 +45,8 @@ const isModalOpen = (): boolean => !!screen.queryByTestId('save-view-modal');
 
 async function openDirtyView(
 	view: ReturnType<typeof makeView>,
-	isViewsOpen = false,
 ): Promise<ReturnType<typeof renderWithExplorerProviders>> {
-	const rendered = renderHeader(viewUrl(PATH, view), isViewsOpen);
+	const rendered = renderHeader(viewUrl(PATH, view));
 	await waitFor(() =>
 		expect(screen.getByTestId('saved-views-name')).toHaveTextContent(
 			view.spec.displayName,
@@ -230,36 +226,4 @@ describe('SavedViewsHeader saving', () => {
 		);
 		expect(requests.created).toHaveLength(0);
 	});
-
-	describe('view name toggle with unsaved changes', () => {
-		const errors = makeView({ id: 'view-1', displayName: 'Errors' });
-
-		it('stops opening the views from the name once the view changes', async () => {
-			mockSavedViewsApi([errors]);
-			const { history } = renderHeader(viewUrl(PATH, errors));
-			await screen.findByTestId('saved-views-name-toggle');
-
-			act(() => {
-				history.push(
-					explorerUrl(PATH, {
-						query: queryWith(DataSource.TRACES, 'has_error = false'),
-						panelType: PANEL_TYPES.LIST,
-						viewKey: errors.id,
-					}),
-				);
-			});
-			await screen.findByTestId('saved-views-discard');
-
-			expect(
-				screen.queryByTestId('saved-views-name-toggle'),
-			).not.toBeInTheDocument();
-		});
-
-		it('still closes open views from the name', async () => {
-			mockSavedViewsApi([errors]);
-			await openDirtyView(errors, true);
-
-			expect(screen.getByTestId('saved-views-name-toggle')).toBeInTheDocument();
-		});
-	});
 });

frontend/src/container/SavedViews/__tests__/savedViewsApiMock.ts

@@ -19,15 +19,11 @@ export function mockSavedViewsApi(
 	views: SavedviewtypesSavedViewDTO[],
 	{
 		createStatus = 201,
-		updateStatus = 204,
-		deleteStatus = 204,
 		createdId = 'view-new',
 		getDelay = 0,
 		listFailures = 0,
 	}: {
 		createStatus?: number;
-		updateStatus?: number;
-		deleteStatus?: number;
 		createdId?: string;
 		getDelay?: number;
 		listFailures?: number;
@@ -89,38 +85,20 @@ export function mockSavedViewsApi(
 			const body = await req.json();
 			const id = String(req.params.id);
 			requests.updated.push({ id, body });
-			if (updateStatus >= 400) {
-				return res(
-					ctx.status(updateStatus),
-					ctx.json({
-						status: 'error',
-						error: { code: 'internal', message: 'boom' },
-					}),
-				);
-			}
 			const index = views.findIndex((v) => v.id === id);
 			if (index >= 0) {
 				views[index] = { ...views[index], spec: body.spec };
 			}
-			return res(ctx.status(updateStatus));
+			return res(ctx.status(204));
 		}),
 		rest.delete(`${API}/:id`, (req, res, ctx) => {
 			const id = String(req.params.id);
 			requests.deleted.push(id);
-			if (deleteStatus >= 400) {
-				return res(
-					ctx.status(deleteStatus),
-					ctx.json({
-						status: 'error',
-						error: { code: 'internal', message: 'boom' },
-					}),
-				);
-			}
 			const index = views.findIndex((v) => v.id === id);
 			if (index >= 0) {
 				views.splice(index, 1);
 			}
-			return res(ctx.status(deleteStatus));
+			return res(ctx.status(204));
 		}),
 	);
 	return requests;

frontend/src/container/SavedViews/events.ts

@@ -1,23 +0,0 @@
-export enum SavedViewEvents {
-	ViewCreated = 'Saved Views: View created',
-	ViewUpdated = 'Saved Views: View updated',
-	ViewDetailsEdited = 'Saved Views: View details edited',
-	ViewDeleted = 'Saved Views: View deleted',
-	LinkCopied = 'Saved Views: Link copied',
-	ViewCleared = 'Saved Views: View cleared',
-	ChangesDiscarded = 'Saved Views: Changes discarded',
-}
-
-export enum SavedViewEventKeys {
-	// Injected on every event by useSavedViewLogEvent
-	Source = 'source',
-
-	ViewId = 'viewId',
-	From = 'from',
-}
-
-export enum SavedViewCreatedFrom {
-	Header = 'header',
-	SaveAsNew = 'save_as_new',
-	EmptyState = 'empty_state',
-}

frontend/src/container/SavedViews/hooks/useSaveNewView.ts

@@ -2,15 +2,14 @@ import { useCallback } from 'react';
 import { toast } from '@signozhq/ui/sonner';
 
 import { SAVED_VIEW_TOAST_POSITION } from '../constants';
-import { SavedViewCreatedFrom } from '../events';
 import { UseSavedViewActionsResult } from '../types';
 
 export function useSaveNewView(
 	createView: UseSavedViewActionsResult['createView'],
-): (displayName: string, from: SavedViewCreatedFrom) => Promise<boolean> {
+): (displayName: string) => Promise<boolean> {
 	return useCallback(
-		async (displayName: string, from: SavedViewCreatedFrom): Promise<boolean> => {
-			if (!(await createView(displayName, from))) {
+		async (displayName: string): Promise<boolean> => {
+			if (!(await createView(displayName))) {
 				return false;
 			}
 			toast.success('View created', {

frontend/src/container/SavedViews/hooks/useSavedViewActions.ts

@@ -17,7 +17,6 @@ import { QueryParams } from 'constants/query';
 import { PANEL_TYPES } from 'constants/queryBuilder';
 import useOptionsMenu from 'container/OptionsMenu/useOptionsMenu';
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
-import { useGetSavedViewParams } from 'hooks/saveViews/useGetSavedViewParams';
 import { useHandleExplorerTabChange } from 'hooks/useHandleExplorerTabChange';
 import { useSafeNavigate } from 'hooks/useSafeNavigate';
 import { usePreferenceContext } from 'providers/preferences/context/PreferenceContextProvider';
@@ -31,18 +30,12 @@ import {
 	SAVED_VIEW_TOAST_POSITION,
 	SAVED_VIEW_URL_PARAMS,
 } from '../constants';
-import {
-	SavedViewCreatedFrom,
-	SavedViewEventKeys,
-	SavedViewEvents,
-} from '../events';
 import { UseSavedViewActionsResult } from '../types';
 import { getSavedViewQuery } from '../utils/getSavedViewQuery';
 import { getViewColumnsAndFormatting } from '../utils/getViewColumnsAndFormatting';
 import { invalidateSavedViews } from '../utils/invalidateSavedViews';
 import { toSavedViewSpec } from '../utils/toSavedViewSpec';
 import { useLastUsedView } from './useLastUsedView';
-import { useSavedViewLogEvent } from './useSavedViewLogEvent';
 
 // Columns and formatting need no handling here: with a viewKey in the url the
 // preference provider reads them from the view, and without one it falls back
@@ -57,8 +50,6 @@ export function useSavedViewActions(
 		useQueryBuilder();
 	const { handleExplorerTabChange } = useHandleExplorerTabChange();
 	const { setLastUsedView, clearLastUsedView } = useLastUsedView(source);
-	const { viewKey } = useGetSavedViewParams();
-	const logSavedViewEvent = useSavedViewLogEvent(source);
 
 	const optionsDataSource = SAVED_VIEW_OPTIONS_DATA_SOURCE[source];
 	const { options } = useOptionsMenu({
@@ -116,16 +107,13 @@ export function useSavedViewActions(
 				}
 			}
 			selectView(view);
-			logSavedViewEvent(SavedViewEvents.ChangesDiscarded, {
-				[SavedViewEventKeys.ViewId]: view.id,
-			});
 		},
-		[optionsDataSource, preferencesSlice, selectView, logSavedViewEvent],
+		[optionsDataSource, preferencesSlice, selectView],
 	);
 
 	// The query builder redirects only ever add params, so the url is rebuilt
 	// here; the time range and everything else a view does not set stays.
-	const resetView = useCallback((): void => {
+	const clearView = useCallback((): void => {
 		clearLastUsedView();
 
 		const params = getUnstableCurrentSearchParams();
@@ -133,18 +121,8 @@ export function useSavedViewActions(
 		safeNavigate(`${pathname}?${params.toString()}`);
 	}, [clearLastUsedView, pathname, safeNavigate]);
 
-	const clearView = useCallback((): void => {
-		resetView();
-		logSavedViewEvent(SavedViewEvents.ViewCleared, {
-			[SavedViewEventKeys.ViewId]: viewKey,
-		});
-	}, [resetView, logSavedViewEvent, viewKey]);
-
 	const createView = useCallback(
-		async (
-			displayName: string,
-			from: SavedViewCreatedFrom,
-		): Promise<string | undefined> => {
+		async (displayName: string): Promise<string | undefined> => {
 			try {
 				const { data } = await createSavedView({
 					data: {
@@ -159,10 +137,6 @@ export function useSavedViewActions(
 					[QueryParams.viewKey]: data.id,
 				});
 				setLastUsedView(data.id, displayName);
-				logSavedViewEvent(SavedViewEvents.ViewCreated, {
-					[SavedViewEventKeys.ViewId]: data.id,
-					[SavedViewEventKeys.From]: from,
-				});
 				return data.id;
 			} catch (error) {
 				toast.error(
@@ -184,7 +158,6 @@ export function useSavedViewActions(
 			stagedQuery,
 			currentQuery,
 			setLastUsedView,
-			logSavedViewEvent,
 		],
 	);
 
@@ -200,9 +173,6 @@ export function useSavedViewActions(
 					},
 				});
 				await invalidateViews(view.id);
-				logSavedViewEvent(SavedViewEvents.ViewUpdated, {
-					[SavedViewEventKeys.ViewId]: view.id,
-				});
 				return true;
 			} catch (error) {
 				toast.error(
@@ -215,14 +185,13 @@ export function useSavedViewActions(
 				return false;
 			}
 		},
-		[updateSavedView, source, toCurrentSpec, invalidateViews, logSavedViewEvent],
+		[updateSavedView, source, toCurrentSpec, invalidateViews],
 	);
 
 	return {
 		selectView,
 		revertView,
 		clearView,
-		resetView,
 		createView,
 		updateView,
 		isSaving: isCreating || isUpdating,

frontend/src/container/SavedViews/hooks/useSavedViewLogEvent.ts

@@ -1,24 +0,0 @@
-import { useCallback } from 'react';
-import logEvent from 'api/common/logEvent';
-import { SavedviewtypesSourceDTO } from 'api/generated/services/sigNoz.schemas';
-
-import { SavedViewEventKeys, SavedViewEvents } from '../events';
-
-export type SavedViewLogEvent = (
-	event: SavedViewEvents,
-	attributes?: Record<string, unknown>,
-) => void;
-
-export function useSavedViewLogEvent(
-	source: SavedviewtypesSourceDTO,
-): SavedViewLogEvent {
-	return useCallback(
-		(event: SavedViewEvents, attributes: Record<string, unknown> = {}): void => {
-			void logEvent(event, {
-				[SavedViewEventKeys.Source]: source,
-				...attributes,
-			});
-		},
-		[source],
-	);
-}

frontend/src/container/SavedViews/hooks/useSavedViewRowActions.ts

@@ -22,11 +22,9 @@ import {
 	SAVED_VIEW_SCHEMA_VERSION,
 	SAVED_VIEW_TOAST_POSITION,
 } from '../constants';
-import { SavedViewEventKeys, SavedViewEvents } from '../events';
 import { UseSavedViewRowActionsResult } from '../types';
 import { getSavedViewQuery } from '../utils/getSavedViewQuery';
 import { invalidateSavedViews } from '../utils/invalidateSavedViews';
-import { useSavedViewLogEvent } from './useSavedViewLogEvent';
 
 function showErrorToast(error: unknown, fallback: string): void {
 	toast.error(
@@ -44,7 +42,6 @@ export function useSavedViewRowActions(
 	const queryClient = useQueryClient();
 	const { pathname } = useLocation();
 	const [, copyToClipboard] = useCopyToClipboard();
-	const logSavedViewEvent = useSavedViewLogEvent(source);
 	const { mutateAsync: updateSavedView, isLoading: isRenaming } =
 		useUpdateSavedView();
 	const { mutateAsync: deleteSavedView, isLoading: isDeleting } =
@@ -58,11 +55,8 @@ export function useSavedViewRowActions(
 			});
 			copyToClipboard(getAbsoluteUrl(path));
 			toast.success('Link copied', { position: SAVED_VIEW_TOAST_POSITION });
-			logSavedViewEvent(SavedViewEvents.LinkCopied, {
-				[SavedViewEventKeys.ViewId]: view.id,
-			});
 		},
-		[pathname, copyToClipboard, logSavedViewEvent],
+		[pathname, copyToClipboard],
 	);
 
 	const copyViewId = useCallback(
@@ -89,16 +83,13 @@ export function useSavedViewRowActions(
 				});
 				await invalidateSavedViews(queryClient, source, view.id);
 				toast.success('View updated', { position: SAVED_VIEW_TOAST_POSITION });
-				logSavedViewEvent(SavedViewEvents.ViewDetailsEdited, {
-					[SavedViewEventKeys.ViewId]: view.id,
-				});
 				return true;
 			} catch (error) {
 				showErrorToast(error, 'Could not update the view');
 				return false;
 			}
 		},
-		[updateSavedView, source, queryClient, logSavedViewEvent],
+		[updateSavedView, source, queryClient],
 	);
 
 	// The deleted view's own query is left alone: refetching it would fail
@@ -109,16 +100,13 @@ export function useSavedViewRowActions(
 				await deleteSavedView({ pathParams: { id: view.id } });
 				await invalidateSavedViews(queryClient, source);
 				toast.success('View deleted', { position: SAVED_VIEW_TOAST_POSITION });
-				logSavedViewEvent(SavedViewEvents.ViewDeleted, {
-					[SavedViewEventKeys.ViewId]: view.id,
-				});
 				return true;
 			} catch (error) {
 				showErrorToast(error, 'Could not delete the view');
 				return false;
 			}
 		},
-		[deleteSavedView, source, queryClient, logSavedViewEvent],
+		[deleteSavedView, source, queryClient],
 	);
 
 	return {

frontend/src/container/SavedViews/types.ts

@@ -10,8 +10,6 @@ import { OptionsQuery } from 'container/OptionsMenu/types';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';
 import { DataSource } from 'types/common/queryBuilder';
 
-import { SavedViewCreatedFrom } from './events';
-
 export type SavedViewSourcePage = DataSource | 'meter';
 
 export type SavedViewOptions = Pick<
@@ -53,12 +51,7 @@ export interface UseSavedViewActionsResult {
 	selectView: (view: SavedviewtypesSavedViewDTO) => void;
 	revertView: (view: SavedviewtypesSavedViewDTO) => void;
 	clearView: () => void;
-	/** Clears the open view without logging it, for flows that are not a clear. */
-	resetView: () => void;
-	createView: (
-		displayName: string,
-		from: SavedViewCreatedFrom,
-	) => Promise<string | undefined>;
+	createView: (displayName: string) => Promise<string | undefined>;
 	updateView: (view: SavedviewtypesSavedViewDTO) => Promise<boolean>;
 	isSaving: boolean;
 }

frontend/src/hooks/querySuggestions/useGetQueryKeyValueSuggestions.ts

@@ -0,0 +1,45 @@
+import { useQuery, UseQueryOptions, UseQueryResult } from 'react-query';
+import { getValueSuggestions } from 'api/querySuggestions/getValueSuggestion';
+import { AxiosError, AxiosResponse } from 'axios';
+import { QueryKeyValueSuggestionsResponseProps } from 'types/api/querySuggestions/types';
+
+export const useGetQueryKeyValueSuggestions = ({
+	key,
+	signal,
+	searchText,
+	signalSource,
+	metricName,
+	options,
+}: {
+	key: string;
+	signal: 'traces' | 'logs' | 'metrics';
+	searchText?: string;
+	signalSource?: 'meter' | '';
+	options?: UseQueryOptions<
+		AxiosResponse<QueryKeyValueSuggestionsResponseProps>,
+		AxiosError
+	>;
+	metricName?: string;
+}): UseQueryResult<
+	AxiosResponse<QueryKeyValueSuggestionsResponseProps>,
+	AxiosError
+> =>
+	useQuery<AxiosResponse<QueryKeyValueSuggestionsResponseProps>, AxiosError>({
+		queryKey: [
+			'queryKeyValueSuggestions',
+			key,
+			signal,
+			searchText,
+			signalSource,
+			metricName,
+		],
+		queryFn: () =>
+			getValueSuggestions({
+				signal,
+				key,
+				searchText: searchText || '',
+				signalSource: signalSource as 'meter' | '',
+				metricName: metricName || '',
+			}),
+		...options,
+	});

frontend/src/mocks-server/__mockdata__/customQuickFilters.ts

@@ -86,12 +86,16 @@ export const otherFiltersResponse = {
 	},
 };
 
-export const quickFiltersFieldValuesResponse = {
+export const quickFiltersAttributeValuesResponse = {
 	status: 'success',
 	data: {
-		complete: true,
-		values: {
-			stringValues: ['mq-kafka', 'otel-demo', 'otlp-python', 'sample-flask'],
-		},
+		stringAttributeValues: [
+			'mq-kafka',
+			'otel-demo',
+			'otlp-python',
+			'sample-flask',
+		],
+		numberAttributeValues: null,
+		boolAttributeValues: null,
 	},
 };

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/SpanAIMessages/MessagesAccordion.module.scss

@@ -25,6 +25,9 @@
 		.ant-collapse-item > .ant-collapse-content > .ant-collapse-content-box
 	) {
 		@include custom-scrollbar;
+
+		max-height: 150px;
+		overflow-y: auto;
 		padding: var(--spacing-4) !important;
 	}
 }

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/SpanAIMessages/MessagesAccordion.tsx

@@ -5,6 +5,7 @@ import { Collapse } from 'antd';
 import { AIThreadMessageProps } from '../../AIThreadMessage/AIThreadMessage';
 import { ThreadMessage } from '../../AIThreadMessage/types';
 import MessagesSection from '../../SpanMessages/MessagesSection';
+import { RawMessagesValue } from '../../utils/spanMessages';
 import { ThreadView } from '../../TraceDetailsThread/types';
 import ThreadViewToggle from '../../TraceDetailsThread/ThreadViewToggle';
 
@@ -19,6 +20,7 @@ interface MessagesAccordionProps extends Pick<
 	icon: ReactNode;
 	title: string;
 	messages: ThreadMessage[];
+	raw?: RawMessagesValue;
 	testId: string;
 }
 
@@ -26,6 +28,7 @@ function MessagesAccordion({
 	icon,
 	title,
 	messages,
+	raw,
 	testId,
 	messageType,
 	canLinkToToolCall,
@@ -33,8 +36,10 @@ function MessagesAccordion({
 }: MessagesAccordionProps): JSX.Element | null {
 	const [isOpen, setIsOpen] = useState(false);
 	const [view, setView] = useState(ThreadView.Formatted);
+	const canFormat = messages.length > 0;
+	const effectiveView = canFormat ? view : ThreadView.Json;
 
-	if (messages.length === 0) {
+	if (!canFormat && !raw) {
 		return null;
 	}
 
@@ -61,12 +66,12 @@ function MessagesAccordion({
 								{title}
 							</span>
 						),
-						extra: isOpen && (
+						extra: isOpen && canFormat && (
 							// The view toggle lives in the header; its clicks must not fold the panel.
 							// eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
 							<span onClick={stopToggle}>
 								<ThreadViewToggle
-									value={view}
+									value={effectiveView}
 									onChange={setView}
 									testId={`${testId}-view-toggle`}
 								/>
@@ -74,8 +79,9 @@ function MessagesAccordion({
 						),
 						children: (
 							<MessagesSection
-								view={view}
+								view={effectiveView}
 								messages={messages}
+								raw={raw}
 								testId={`${testId}-body`}
 								messageType={messageType}
 								canLinkToToolCall={canLinkToToolCall}
@@ -89,4 +95,8 @@ function MessagesAccordion({
 	);
 }
 
+MessagesAccordion.defaultProps = {
+	raw: undefined,
+};
+
 export default MessagesAccordion;

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/SpanAIMessages/SpanAIMessages.tsx

@@ -3,10 +3,7 @@ import { ArrowDownRight, ArrowUpRight } from '@signozhq/icons';
 
 import { MessageType } from '../../AIThreadMessage/types';
 import { useToolCallLinks } from '../../AIThreadMessage/useToolCallLinks';
-import {
-	getSpanMessages,
-	hasFormattedMessages,
-} from '../../utils/spanMessages';
+import { getSpanMessages, hasAnyMessages } from '../../utils/spanMessages';
 import { ThreadSpan } from '../../TraceDetailsThread/types';
 import { buildToolCallIndex } from '../../TraceDetailsThread/utils';
 import MessagesAccordion from './MessagesAccordion';
@@ -28,7 +25,7 @@ function SpanAIMessages({ span }: SpanAIMessagesProps): JSX.Element | null {
 		toolCallKeys,
 	);
 
-	if (!hasFormattedMessages(data)) {
+	if (!hasAnyMessages(data)) {
 		return null;
 	}
 
@@ -38,6 +35,7 @@ function SpanAIMessages({ span }: SpanAIMessagesProps): JSX.Element | null {
 				icon={<ArrowUpRight size={14} />}
 				title="Input"
 				messages={data.formattedInput}
+				raw={data.rawInput}
 				messageType={MessageType.Input}
 				testId="span-ai-messages-input"
 				canLinkToToolCall={canLinkToToolCall}
@@ -47,6 +45,7 @@ function SpanAIMessages({ span }: SpanAIMessagesProps): JSX.Element | null {
 				icon={<ArrowDownRight size={14} />}
 				title="Output"
 				messages={data.formattedOutput}
+				raw={data.rawOutput}
 				messageType={MessageType.Output}
 				testId="span-ai-messages-output"
 				canLinkToToolCall={canLinkToToolCall}

frontend/src/pages/TraceDetailsV3/SpanDetailsPanel/SpanSummary.module.scss

@@ -47,7 +47,6 @@
 	border-radius: 50%;
 	background: var(--accent-forest);
 	flex-shrink: 0;
-	margin-right: 4px;
 }
 
 // Truncating text inside a badge (service name, status message).

frontend/src/pages/TraceDetailsV3/SpanMessages/MessagesSection.tsx

@@ -3,7 +3,8 @@ import AIThreadMessage, {
 } from '../AIThreadMessage/AIThreadMessage';
 import { ThreadMessage } from '../AIThreadMessage/types';
 import { ThreadView } from '../TraceDetailsThread/types';
-import JsonBlock from '../AIThreadMessage/JsonBlock';
+import RawMessages from './RawMessages';
+import { RawMessagesValue } from '../utils/spanMessages';
 
 import styles from './SpanMessages.module.scss';
 
@@ -16,6 +17,7 @@ interface MessagesSectionProps extends MessageProps {
 	title?: string;
 	view: ThreadView;
 	messages: ThreadMessage[];
+	raw?: RawMessagesValue;
 	testId: string;
 }
 
@@ -23,19 +25,21 @@ function MessagesSection({
 	title,
 	view,
 	messages,
+	raw,
 	testId,
 	messageType,
 	canLinkToToolCall,
 	onToolLinkClick,
 }: MessagesSectionProps): JSX.Element | null {
-	if (messages.length === 0) {
+	const isFormatted = view === ThreadView.Formatted;
+	if (isFormatted ? messages.length === 0 : !raw) {
 		return null;
 	}
 
 	return (
 		<section className={styles.section} data-testid={testId}>
 			{title && <div className={styles.sectionTitle}>{title}</div>}
-			{view === ThreadView.Formatted ? (
+			{isFormatted ? (
 				<div className={styles.messages}>
 					{messages.map((message, index) => (
 						<AIThreadMessage
@@ -50,7 +54,7 @@ function MessagesSection({
 					))}
 				</div>
 			) : (
-				<JsonBlock data={messages} />
+				<RawMessages value={raw as RawMessagesValue} />
 			)}
 		</section>
 	);
@@ -58,6 +62,7 @@ function MessagesSection({
 
 MessagesSection.defaultProps = {
 	title: undefined,
+	raw: undefined,
 };
 
 export default MessagesSection;

frontend/src/pages/TraceDetailsV3/SpanMessages/RawMessages.tsx

@@ -0,0 +1,21 @@
+import JsonBlock from '../AIThreadMessage/JsonBlock';
+import { RawMessagesValue } from '../utils/spanMessages';
+
+import styles from './SpanMessages.module.scss';
+
+interface RawMessagesProps {
+	value: RawMessagesValue;
+}
+
+function RawMessages({ value }: RawMessagesProps): JSX.Element {
+	if (typeof value === 'object') {
+		return <JsonBlock data={value} />;
+	}
+	return (
+		<span className={styles.rawUnavailable} data-testid="span-raw-messages">
+			Unable to render messages
+		</span>
+	);
+}
+
+export default RawMessages;

frontend/src/pages/TraceDetailsV3/SpanMessages/SpanMessages.module.scss

@@ -28,6 +28,12 @@
 	min-width: 0;
 }
 
+.rawUnavailable {
+	font-size: var(--periscope-font-size-base);
+	font-style: italic;
+	color: var(--l2-foreground);
+}
+
 .missing {
 	padding: var(--spacing-10) var(--spacing-6);
 	border-radius: var(--radius-2);

frontend/src/pages/TraceDetailsV3/SpanMessages/SpanMessages.tsx

@@ -6,7 +6,11 @@ import { ThreadSpan, ThreadView } from '../TraceDetailsThread/types';
 import JsonBlock from '../AIThreadMessage/JsonBlock';
 import { MessageType } from '../AIThreadMessage/types';
 import MessagesSection from './MessagesSection';
-import { getSpanMessages, hasFormattedMessages } from '../utils/spanMessages';
+import {
+	getSpanMessages,
+	hasFormattedMessages,
+	hasRawMessages,
+} from '../utils/spanMessages';
 
 import styles from './SpanMessages.module.scss';
 
@@ -28,8 +32,9 @@ function SpanMessages({
 	onToolLinkClick,
 }: SpanMessagesProps): JSX.Element {
 	const data = useMemo(() => getSpanMessages(span), [span]);
+	const isFormatted = view === ThreadView.Formatted;
 
-	if (!hasFormattedMessages(data)) {
+	if (isFormatted ? !hasFormattedMessages(data) : !hasRawMessages(data)) {
 		return (
 			<div
 				className={cx(styles.missing, className)}
@@ -40,11 +45,11 @@ function SpanMessages({
 		);
 	}
 
-	if (view === ThreadView.Json) {
+	if (!isFormatted) {
 		return (
 			<div className={cx(styles.root, className)} data-testid="span-messages-json">
 				<JsonBlock
-					data={{ input: data.formattedInput, output: data.formattedOutput }}
+					data={{ input: data.rawInput ?? [], output: data.rawOutput ?? [] }}
 				/>
 			</div>
 		);
@@ -55,6 +60,7 @@ function SpanMessages({
 			<MessagesSection
 				view={view}
 				messages={data.formattedInput}
+				raw={data.rawInput}
 				messageType={MessageType.Input}
 				testId="span-messages-input"
 				canLinkToToolCall={canLinkToToolCall}
@@ -63,6 +69,7 @@ function SpanMessages({
 			<MessagesSection
 				view={view}
 				messages={data.formattedOutput}
+				raw={data.rawOutput}
 				messageType={MessageType.Output}
 				testId="span-messages-output"
 				canLinkToToolCall={canLinkToToolCall}

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

@@ -48,36 +48,41 @@ describe('SpanMessages', () => {
 		).toBeInTheDocument();
 	});
 
-	it('shows the empty state in JSON view when there are no formatted messages', () => {
-		const span = makeSpan({
-			attributes: { [GEN_AI_KEYS.inputMessages]: '[{"role":"user"}]' },
-		});
-
-		render(<SpanMessages span={span} view={ThreadView.Json} />);
+	it('shows the empty state in JSON view when there are no raw messages', () => {
+		render(<SpanMessages span={makeSpan({})} view={ThreadView.Json} />);
 
 		expect(screen.getByTestId('span-messages-empty')).toBeInTheDocument();
 	});
 
-	it('renders formatted messages in JSON view, ignoring the raw attribute', () => {
+	it('renders raw messages in JSON view', () => {
 		const span = makeSpan({
-			formattedInput: [
-				{ role: 'user', parts: [{ type: 'text', content: 'formatted-text' }] },
-			],
-			attributes: {
-				[GEN_AI_KEYS.inputMessages]: '[{"role":"user","content":"raw-text"}]',
-			},
+			attributes: { [GEN_AI_KEYS.outputMessages]: '[{"role":"assistant"}]' },
 		});
 
 		render(<SpanMessages span={span} view={ThreadView.Json} />);
 
 		expect(screen.getByTestId('span-messages-json')).toBeInTheDocument();
-		expect(screen.getByText(/formatted-text/)).toBeInTheDocument();
-		expect(screen.queryByText(/raw-text/)).not.toBeInTheDocument();
+	});
+
+	it('opens every key in JSON view', () => {
+		const span = makeSpan({
+			attributes: {
+				[GEN_AI_KEYS.inputMessages]: '[{"role":"user","content":"visible-text"}]',
+			},
+		});
+
+		render(<SpanMessages span={span} view={ThreadView.Json} />);
+
+		expect(screen.getByText(/visible-text/)).toBeInTheDocument();
 	});
 
 	it('collapses tall JSON behind Show more in JSON view', () => {
 		const span = makeSpan({
-			formattedInput: [{ role: 'user', parts: [{ type: 'text', content: 'hi' }] }],
+			attributes: {
+				[GEN_AI_KEYS.inputMessages]: JSON.stringify([
+					{ role: 'user', content: 'hi' },
+				]),
+			},
 		});
 
 		render(<SpanMessages span={span} view={ThreadView.Json} />);

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

@@ -99,12 +99,10 @@ function TraceDetailsHeader({
 	const handlePreviousBtnClick = useCallback((): void => {
 		if (hasInAppHistory()) {
 			history.goBack();
-		} else if (!isOverview) {
-			history.push(ROUTES.AI_OBSERVABILITY_EXPLORER);
 		} else {
 			history.push(ROUTES.TRACES_EXPLORER);
 		}
-	}, [isOverview]);
+	}, []);
 
 	const handleToggleTraceDetails = useCallback((): void => {
 		setShowTraceDetails((prev) => !prev);

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

@@ -22,8 +22,7 @@ function TraceDetailsTabs(): JSX.Element {
 	const [tab, setTab] = useTraceDetailsTab();
 
 	const handleChange = (value: string): void => {
-		// Pushed so the thread's "Go back" returns to the previous tab, not the previous page.
-		void setTab(value as TraceDetailsTab, { history: 'push' });
+		void setTab(value as TraceDetailsTab);
 	};
 
 	return (

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

@@ -1,8 +1,10 @@
+import { fireEvent, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import { getYAxisFormattedValue } from 'components/Graph/yAxisConfig';
 import type { SpantypesGettableTraceSummaryDTO } from 'api/generated/services/sigNoz.schemas';
 import { NuqsTestingAdapter } from 'nuqs/adapters/testing';
 import ROUTES from 'constants/routes';
-import { fireEvent, render, screen, userEvent } from 'tests/test-utils';
+import { render } from 'tests/test-utils';
 
 import TraceDetailsHeader from '../TraceDetailsHeader';
 import { useTraceSummary } from '../useTraceSummary';
@@ -98,22 +100,6 @@ describe('TraceDetailsHeader – back button', () => {
 		expect(mockPush).toHaveBeenCalledWith(ROUTES.TRACES_EXPLORER);
 		expect(mockGoBack).not.toHaveBeenCalled();
 	});
-
-	it('pushes to the AI observability explorer when opened directly on another tab', async () => {
-		mockHasInAppHistory.mockReturnValue(false);
-		const user = userEvent.setup({ delay: null });
-		render(
-			<NuqsTestingAdapter searchParams="?tab=thread">
-				<TraceDetailsHeader {...baseProps} />
-			</NuqsTestingAdapter>,
-		);
-
-		await user.click(screen.getByRole('button', { name: /back/i }));
-
-		expect(mockPush).toHaveBeenCalledTimes(1);
-		expect(mockPush).toHaveBeenCalledWith(ROUTES.AI_OBSERVABILITY_EXPLORER);
-		expect(mockGoBack).not.toHaveBeenCalled();
-	});
 });
 
 describe('TraceDetailsHeader – action cluster', () => {

frontend/src/pages/TraceDetailsV3/TraceDetailsThread/ThreadNoAiSpans.module.scss

@@ -1,31 +1,29 @@
 .root {
-	flex: 1;
 	display: flex;
 	flex-direction: column;
-	align-items: center;
-	justify-content: center;
+	align-items: flex-start;
+	gap: var(--spacing-12);
+	padding: var(--spacing-20) var(--spacing-24);
+}
+
+.message {
+	display: flex;
+	flex-direction: column;
 	gap: var(--spacing-4);
-	padding: var(--spacing-16);
-	text-align: center;
+	max-width: 428px;
 }
 
-.noDataImg {
-	height: 32px;
-	width: 32px;
+.emoji {
+	font-size: 32px;
+	line-height: 1;
 }
 
-.title {
-	font-size: var(--periscope-font-size-medium);
-	font-weight: var(--font-weight-medium);
+.paragraphs {
+	display: flex;
+	flex-direction: column;
+	gap: var(--paragraph-base-500-line-height);
+}
+
+.highlight {
 	color: var(--l1-foreground);
 }
-
-.description {
-	max-width: 420px;
-	font-size: var(--periscope-font-size-base);
-	color: var(--l2-foreground);
-}
-
-.actions {
-	margin-top: var(--spacing-4);
-}

frontend/src/pages/TraceDetailsV3/TraceDetailsThread/ThreadNoAiSpans.tsx

@@ -1,9 +1,8 @@
 import { ArrowRight } from '@signozhq/icons';
 import { Button } from '@signozhq/ui/button';
+import { Typography } from '@signozhq/ui/typography';
 import { openInNewTab } from 'utils/navigation';
 
-import noDataUrl from '@/assets/Icons/no-data.svg';
-
 import { LLM_OBSERVABILITY_DOCS_URL } from '../constants';
 
 import styles from './ThreadNoAiSpans.module.scss';
@@ -11,28 +10,32 @@ import styles from './ThreadNoAiSpans.module.scss';
 function ThreadNoAiSpans(): JSX.Element {
 	return (
 		<div className={styles.root} data-testid="thread-empty">
-			<img src={noDataUrl} alt="" className={styles.noDataImg} />
-			<span className={styles.title}>
-				This trace has no spans from AI-related actions
-			</span>
-			<span className={styles.description}>
-				Thread view summarising your entire AI-journey history will appear here when
-				the spans have the necessary datapoints.
-			</span>
-			<div className={styles.actions}>
-				<Button
-					variant="solid"
-					color="secondary"
-					size="md"
-					suffix={<ArrowRight size={12} />}
-					onClick={(): void => {
-						openInNewTab(LLM_OBSERVABILITY_DOCS_URL);
-					}}
-					testId="thread-empty-learn-more"
-				>
-					Learn more
-				</Button>
+			<div className={styles.message}>
+				<span className={styles.emoji} aria-hidden>
+					🚏
+				</span>
+				<div className={styles.paragraphs}>
+					<Typography size="base" weight="medium" color="muted">
+						Looks like this trace does not have any spans from AI-related actions.
+					</Typography>
+					<Typography size="base" weight="medium" className={styles.highlight}>
+						Thread view summarising your entire AI-journey history will appear here
+						when the spans have the necessary datapoints.
+					</Typography>
+				</div>
 			</div>
+			<Button
+				variant="solid"
+				color="secondary"
+				size="md"
+				suffix={<ArrowRight size={12} />}
+				onClick={(): void => {
+					openInNewTab(LLM_OBSERVABILITY_DOCS_URL);
+				}}
+				testId="thread-empty-learn-more"
+			>
+				Learn more
+			</Button>
 		</div>
 	);
 }

frontend/src/pages/TraceDetailsV3/TraceDetailsThread/TraceDetailsThread.tsx

@@ -40,7 +40,6 @@ function TraceDetailsThread(): JSX.Element {
 		spansAboveFirstPage,
 		isLoading,
 		isError,
-		isNotFound,
 		hasNextPage,
 		hasPreviousPage,
 		isFetchingNextPage,
@@ -53,7 +52,6 @@ function TraceDetailsThread(): JSX.Element {
 		interestedSpanId,
 		spans,
 		isLoading,
-		isNotFound,
 	);
 	const interestedSpanIndex = spans.findIndex(
 		(span) => span.span_id === interestedSpanId,

frontend/src/pages/TraceDetailsV3/TraceDetailsThread/hooks/__tests__/useTraceThread.test.tsx

@@ -1,7 +1,7 @@
 import { ReactNode } from 'react';
 import { QueryClient, QueryClientProvider } from 'react-query';
+import { act, renderHook, waitFor } from '@testing-library/react';
 import { getTraceThread } from 'api/generated/services/tracedetail';
-import { act, renderHook, waitFor } from 'tests/test-utils';
 
 import { useTraceThread } from '../useTraceThread';
 
@@ -154,7 +154,6 @@ describe('useTraceThread', () => {
 
 		await waitFor(() => expect(result.current.isError).toBe(true));
 		expect(mockGetTraceThread).toHaveBeenCalledTimes(1);
-		expect(result.current.isNotFound).toBe(true);
 	});
 
 	it('retries other errors', async () => {
@@ -163,6 +162,5 @@ describe('useTraceThread', () => {
 
 		await waitFor(() => expect(result.current.isError).toBe(true));
 		expect(mockGetTraceThread).toHaveBeenCalledTimes(4);
-		expect(result.current.isNotFound).toBe(false);
 	});
 });

frontend/src/pages/TraceDetailsV3/TraceDetailsThread/hooks/useTraceThread.ts

@@ -25,8 +25,6 @@ interface UseTraceThreadResult {
 	spansAboveFirstPage: number;
 	isLoading: boolean;
 	isError: boolean;
-	/** The interested span (or trace) doesn't exist; an empty thread is not this. */
-	isNotFound: boolean;
 	hasNextPage: boolean;
 	hasPreviousPage: boolean;
 	isFetchingNextPage: boolean;
@@ -101,7 +99,6 @@ export function useTraceThread({
 		spansAboveFirstPage,
 		isLoading: query.isLoading,
 		isError: query.isError,
-		isNotFound: isNotFoundError(query.error),
 		hasNextPage: !!query.hasNextPage,
 		hasPreviousPage: !!query.hasPreviousPage,
 		isFetchingNextPage: query.isFetchingNextPage,

frontend/src/pages/TraceDetailsV3/TraceDetailsThread/utils.ts

@@ -28,7 +28,6 @@ export function getInterestedSpanStatus(
 	interestedSpanId: string | undefined,
 	spans: ThreadSpan[],
 	isLoading: boolean,
-	isNotFound: boolean,
 ): InterestedSpanStatus {
 	if (!interestedSpanId) {
 		return InterestedSpanStatus.None;
@@ -36,12 +35,8 @@ export function getInterestedSpanStatus(
 	if (isLoading) {
 		return InterestedSpanStatus.Loading;
 	}
-	if (isNotFound) {
-		return InterestedSpanStatus.NotFound;
-	}
-	// The span exists but the thread is empty, so the no-AI-spans state applies.
 	if (spans.length === 0) {
-		return InterestedSpanStatus.None;
+		return InterestedSpanStatus.NotFound;
 	}
 	return spans.some((span) => span.span_id === interestedSpanId)
 		? InterestedSpanStatus.Found

frontend/src/pages/TraceDetailsV3/constants.ts

@@ -60,4 +60,4 @@ export enum TraceDetailsTab {
 }
 
 export const LLM_OBSERVABILITY_DOCS_URL =
-	'https://signoz.io/docs/ai-observability/';
+	'https://signoz.io/docs/llm-observability/';

frontend/src/pages/TraceDetailsV3/utils/spanMessages.ts

@@ -1,19 +1,49 @@
+import { parseJsonObject } from '../AIThreadMessage/utils';
 import { ThreadMessage } from '../AIThreadMessage/types';
 import { ThreadSpan } from '../TraceDetailsThread/types';
+import { GEN_AI_KEYS } from './aiTraceUtils';
+
+/** Parsed JSON, or the original string when it isn't JSON. */
+export type RawMessagesValue = object | string;
 
 export interface SpanMessagesData {
 	formattedInput: ThreadMessage[];
 	formattedOutput: ThreadMessage[];
+	rawInput?: RawMessagesValue;
+	rawOutput?: RawMessagesValue;
+}
+
+function toRawValue(value: unknown): RawMessagesValue | undefined {
+	if (value === undefined || value === null || value === '') {
+		return undefined;
+	}
+	if (typeof value === 'string') {
+		return parseJsonObject(value) ?? value;
+	}
+	return typeof value === 'object' ? value : JSON.stringify(value);
 }
 
 export function getSpanMessages(span: ThreadSpan): SpanMessagesData {
+	const rawInput = toRawValue(span.attributes?.[GEN_AI_KEYS.inputMessages]);
+	const rawOutput = toRawValue(span.attributes?.[GEN_AI_KEYS.outputMessages]);
+
 	// Spans from before the JSON column have no formatted messages.
 	return {
 		formattedInput: span.formattedInput ?? [],
 		formattedOutput: span.formattedOutput ?? [],
+		rawInput,
+		rawOutput,
 	};
 }
 
 export function hasFormattedMessages(data: SpanMessagesData): boolean {
 	return data.formattedInput.length > 0 || data.formattedOutput.length > 0;
 }
+
+export function hasRawMessages(data: SpanMessagesData): boolean {
+	return !!data.rawInput || !!data.rawOutput;
+}
+
+export function hasAnyMessages(data: SpanMessagesData): boolean {
+	return hasFormattedMessages(data) || hasRawMessages(data);
+}

frontend/src/schemas/generated/transactionGroups.schema.json

@@ -74,7 +74,8 @@
         "meter-metrics",
         "logs-field",
         "traces-field",
-        "metrics-field"
+        "metrics-field",
+        "llm-pricing-rule"
       ],
       "type": "string"
     },

frontend/src/types/api/querySuggestions/types.ts

@@ -37,4 +37,22 @@ export interface QueryKeyRequestProps {
 	signalSource?: 'meter' | '';
 }
 
+export interface QueryKeyValueSuggestionsProps {
+	id: string;
+	name: string;
+}
+
+export interface QueryKeyValueSuggestionsResponseProps {
+	status: string;
+	data: QueryKeyValueSuggestionsProps[];
+}
+
+export interface QueryKeyValueRequestProps {
+	signal: 'traces' | 'logs' | 'metrics';
+	key: string;
+	searchText: string;
+	signalSource?: 'meter' | '';
+	metricName?: string;
+}
+
 export type SignalType = 'traces' | 'logs' | 'metrics';

pkg/apiserver/signozapiserver/alertmanager.go

@@ -140,7 +140,6 @@ func (provider *provider) addAlertmanagerRoutes(router *mux.Router) error {
 			Description:         "This endpoint creates a notification channel",
 			Request:             new(alertmanagertypes.PostableNotificationChannel),
 			RequestContentType:  "application/json",
-			RequestExamples:     createNotificationChannelExamples(),
 			Response:            new(alertmanagertypes.GettableNotificationChannel),
 			ResponseContentType: "application/json",
 			SuccessStatusCode:   http.StatusCreated,
@@ -225,7 +224,6 @@ func (provider *provider) addAlertmanagerRoutes(router *mux.Router) error {
 			Description:         "This endpoint replaces a notification channel's configuration in full. Neither name is part of the request body: both are immutable. The kind may change, which replaces the channel's notifier configuration.",
 			Request:             new(alertmanagertypes.UpdatableNotificationChannel),
 			RequestContentType:  "application/json",
-			RequestExamples:     updateNotificationChannelExamples(),
 			Response:            new(alertmanagertypes.GettableNotificationChannel),
 			ResponseContentType: "application/json",
 			SuccessStatusCode:   http.StatusOK,
@@ -311,7 +309,6 @@ func (provider *provider) addAlertmanagerRoutes(router *mux.Router) error {
 			Description:         "This endpoint sends a test notification for the configuration in the request body. The channel need not exist and nothing is persisted, so the body carries a configuration only.",
 			Request:             new(alertmanagertypes.TestableNotificationChannel),
 			RequestContentType:  "application/json",
-			RequestExamples:     testNotificationChannelExamples(),
 			Response:            nil,
 			ResponseContentType: "",
 			SuccessStatusCode:   http.StatusNoContent,

pkg/apiserver/signozapiserver/alertmanager_examples.go

@@ -1,201 +0,0 @@
-package signozapiserver
-
-import "github.com/SigNoz/signoz/pkg/http/handler"
-
-// channelConfig wraps one provider spec in the {kind, spec} envelope every
-// channel write carries.
-func channelConfig(kind string, spec map[string]any) map[string]any {
-	return map[string]any{"kind": kind, "spec": spec}
-}
-
-func slackChannelSpec() map[string]any {
-	return map[string]any{
-		"apiUrl":       "https://hooks.slack.com/services/T000/B000/XXXXXXXX",
-		"channel":      "#alerts-platform",
-		"sendResolved": true,
-	}
-}
-
-func pagerdutyChannelSpec() map[string]any {
-	return map[string]any{
-		"routingKey": "R0000000000000000000000000000000",
-		"severity":   "critical",
-	}
-}
-
-func webhookChannelSpec() map[string]any {
-	return map[string]any{
-		"url":         "https://alerts.example.com/signoz",
-		"bearerToken": "00000000-0000-0000-0000-000000000000",
-	}
-}
-
-// createNotificationChannelExamples returns one create payload per channel
-// kind. Each carries the kind's required fields plus one or two optional ones
-// that show a default being overridden.
-func createNotificationChannelExamples() []handler.OpenAPIExample {
-	return []handler.OpenAPIExample{
-		{
-			Name:        "slack",
-			Summary:     "Slack incoming webhook",
-			Description: "Posts to a Slack channel through an incoming webhook. `sendResolved` is off by default for Slack, so it is turned on here.",
-			Value: map[string]any{
-				"name":        "slack-platform",
-				"displayName": "Slack platform",
-				"config":      channelConfig("slack", slackChannelSpec()),
-			},
-		},
-		{
-			Name:        "email",
-			Summary:     "Email recipients",
-			Description: "Sends to a comma-separated recipient list. SMTP transport comes from the deployment's global config, so only recipients and body are configurable.",
-			Value: map[string]any{
-				"name":        "email-oncall",
-				"displayName": "Email on-call",
-				"config": channelConfig("email", map[string]any{
-					"to":      "oncall@example.com, platform@example.com",
-					"headers": map[string]any{"Subject": "[SigNoz] {{ .CommonLabels.alertname }}"},
-				}),
-			},
-		},
-		{
-			Name:        "webhook_bearer",
-			Summary:     "Webhook with a bearer token",
-			Description: "Delivers the Alertmanager webhook payload to an HTTP endpoint. Use either `bearerToken` or `username`/`password`, never both.",
-			Value: map[string]any{
-				"name":        "webhook-incident-bot",
-				"displayName": "Incident bot webhook",
-				"config":      channelConfig("webhook", webhookChannelSpec()),
-			},
-		},
-		{
-			Name:        "pagerduty",
-			Summary:     "PagerDuty Events API v2",
-			Description: "Creates PagerDuty incidents through an Events API v2 integration key.",
-			Value: map[string]any{
-				"name":        "pagerduty-oncall",
-				"displayName": "PagerDuty on-call",
-				"config":      channelConfig("pagerduty", pagerdutyChannelSpec()),
-			},
-		},
-		{
-			Name:        "opsgenie",
-			Summary:     "Opsgenie API integration",
-			Description: "Creates Opsgenie alerts through an API integration key, pinned to priority P2.",
-			Value: map[string]any{
-				"name":        "opsgenie-sre",
-				"displayName": "Opsgenie SRE",
-				"config": channelConfig("opsgenie", map[string]any{
-					"apiKey":   "00000000-0000-0000-0000-000000000000",
-					"priority": "P2",
-				}),
-			},
-		},
-		{
-			Name:        "msteams",
-			Summary:     "Microsoft Teams incoming webhook",
-			Description: "Posts an adaptive card to a Teams channel through an incoming webhook.",
-			Value: map[string]any{
-				"name":        "msteams-platform",
-				"displayName": "Teams platform",
-				"config": channelConfig("msteams", map[string]any{
-					"webhookUrl": "https://example.webhook.office.com/webhookb2/00000000-0000-0000-0000-000000000000",
-				}),
-			},
-		},
-		{
-			Name:        "googlechat",
-			Summary:     "Google Chat space webhook",
-			Description: "Posts to a Google Chat space through its webhook URL.",
-			Value: map[string]any{
-				"name":        "googlechat-platform",
-				"displayName": "Google Chat platform",
-				"config": channelConfig("googlechat", map[string]any{
-					"webhookUrl": "https://chat.googleapis.com/v1/spaces/AAAA0000000/messages?key=XXXX&token=XXXX",
-				}),
-			},
-		},
-		{
-			Name:        "jira",
-			Summary:     "Jira Cloud issues",
-			Description: "Creates one Jira Cloud issue per alert group and reopens it if the alert fires again within `reopenDuration`. Authenticates with an Atlassian account email and API token.",
-			Value: map[string]any{
-				"name":        "jira-platform",
-				"displayName": "Jira platform",
-				"config": channelConfig("jira", map[string]any{
-					"site":           "https://example.atlassian.net",
-					"project":        "OPS",
-					"issueType":      "Bug",
-					"email":          "oncall@example.com",
-					"apiToken":       "XXXXXXXXXXXXXXXXXXXXXXXX",
-					"labels":         []any{"signoz", "alert"},
-					"reopenDuration": "3d",
-				}),
-			},
-		},
-		{
-			Name:        "jsmops",
-			Summary:     "Jira Service Management Ops",
-			Description: "Creates JSM Ops alerts through an integration API key. JSM Ops speaks the Opsgenie alert API, so `priority` takes P1 to P5.",
-			Value: map[string]any{
-				"name":        "jsmops-oncall",
-				"displayName": "JSM Ops on-call",
-				"config": channelConfig("jsmops", map[string]any{
-					"apiKey":   "00000000-0000-0000-0000-000000000000",
-					"priority": "P1",
-					"tags":     "signoz,platform",
-				}),
-			},
-		},
-		{
-			Name:        "incidentio",
-			Summary:     "incident.io HTTP alert source",
-			Description: "Sends alert events to an incident.io HTTP alert source. `url` and `token` are copied from the source's setup page; the token goes without the Bearer prefix.",
-			Value: map[string]any{
-				"name":        "incidentio-platform",
-				"displayName": "incident.io platform",
-				"config": channelConfig("incidentio", map[string]any{
-					"url":      "https://api.incident.io/v2/alert_events/http/00000000-0000-0000-0000-000000000000",
-					"token":    "XXXXXXXXXXXXXXXXXXXXXXXX",
-					"metadata": map[string]any{"team": "platform"},
-				}),
-			},
-		},
-	}
-}
-
-// updateNotificationChannelExamples shows that an update carries only config:
-// name and displayName are immutable, and the kind may change.
-func updateNotificationChannelExamples() []handler.OpenAPIExample {
-	return []handler.OpenAPIExample{
-		{
-			Name:        "slack_rotate_webhook",
-			Summary:     "Replace a Slack webhook URL",
-			Description: "Replaces the stored configuration in full; every field not sent falls back to its default.",
-			Value:       map[string]any{"config": channelConfig("slack", slackChannelSpec())},
-		},
-		{
-			Name:        "switch_to_pagerduty",
-			Summary:     "Change the kind to PagerDuty",
-			Description: "The kind may change on update, replacing the channel's notifier configuration while its name and references stay.",
-			Value:       map[string]any{"config": channelConfig("pagerduty", pagerdutyChannelSpec())},
-		},
-	}
-}
-
-// testNotificationChannelExamples sends one test notification; the body is a
-// configuration only because nothing is persisted.
-func testNotificationChannelExamples() []handler.OpenAPIExample {
-	return []handler.OpenAPIExample{
-		{
-			Name:    "slack",
-			Summary: "Test a Slack webhook",
-			Value:   map[string]any{"config": channelConfig("slack", slackChannelSpec())},
-		},
-		{
-			Name:    "webhook",
-			Summary: "Test a webhook endpoint",
-			Value:   map[string]any{"config": channelConfig("webhook", webhookChannelSpec())},
-		},
-	}
-}

pkg/apiserver/signozapiserver/alertmanager_examples_test.go

@@ -1,39 +0,0 @@
-package signozapiserver
-
-import (
-	"encoding/json"
-	"testing"
-
-	"github.com/SigNoz/signoz/pkg/types/alertmanagertypes"
-	"github.com/stretchr/testify/require"
-)
-
-func TestNotificationChannelExamplesAreValidPayloads(t *testing.T) {
-	for _, ex := range createNotificationChannelExamples() {
-		t.Run("create/"+ex.Name, func(t *testing.T) {
-			raw, err := json.Marshal(ex.Value)
-			require.NoError(t, err)
-			var postable alertmanagertypes.PostableNotificationChannel
-			require.NoError(t, json.Unmarshal(raw, &postable))
-			require.NoError(t, postable.Validate())
-		})
-	}
-	for _, ex := range updateNotificationChannelExamples() {
-		t.Run("update/"+ex.Name, func(t *testing.T) {
-			raw, err := json.Marshal(ex.Value)
-			require.NoError(t, err)
-			var updatable alertmanagertypes.UpdatableNotificationChannel
-			require.NoError(t, json.Unmarshal(raw, &updatable))
-			require.NoError(t, updatable.Validate())
-		})
-	}
-	for _, ex := range testNotificationChannelExamples() {
-		t.Run("test/"+ex.Name, func(t *testing.T) {
-			raw, err := json.Marshal(ex.Value)
-			require.NoError(t, err)
-			var testable alertmanagertypes.TestableNotificationChannel
-			require.NoError(t, json.Unmarshal(raw, &testable))
-			require.NoError(t, testable.Validate())
-		})
-	}
-}

pkg/apiserver/signozapiserver/dashboard.go

@@ -77,7 +77,6 @@ func (provider *provider) addDashboardRoutes(router *mux.Router) error {
 			Description:         "This endpoint creates a dashboard in the v2 format that follows Perses spec.",
 			Request:             new(dashboardtypes.PostableDashboardV2),
 			RequestContentType:  "application/json",
-			RequestExamples:     createDashboardExamples(),
 			Response:            new(dashboardtypes.GettableDashboardV2),
 			ResponseContentType: "application/json",
 			SuccessStatusCode:   http.StatusCreated,
@@ -201,7 +200,6 @@ func (provider *provider) addDashboardRoutes(router *mux.Router) error {
 			Description:         "This endpoint updates a v2-shape dashboard's metadata, data, and tag set. Locked dashboards are rejected.",
 			Request:             new(dashboardtypes.UpdatableDashboardV2),
 			RequestContentType:  "application/json",
-			RequestExamples:     updateDashboardExamples(),
 			Response:            new(dashboardtypes.GettableDashboardV2),
 			ResponseContentType: "application/json",
 			SuccessStatusCode:   http.StatusOK,
@@ -235,7 +233,6 @@ func (provider *provider) addDashboardRoutes(router *mux.Router) error {
 			// the array-of-ops schema visible to spec consumers; the runtime decoder
 			// parses JSON regardless of the request's actual Content-Type header.
 			RequestContentType:  "application/json",
-			RequestExamples:     patchDashboardExamples(),
 			Response:            new(dashboardtypes.GettableDashboardV2),
 			ResponseContentType: "application/json",
 			SuccessStatusCode:   http.StatusOK,

pkg/apiserver/signozapiserver/dashboard_examples.go

@@ -1,268 +0,0 @@
-package signozapiserver
-
-import "github.com/SigNoz/signoz/pkg/http/handler"
-
-// gridItem places a panel on the 12-column grid of a Grid layout.
-func gridItem(panelID string, x, y, width, height int) map[string]any {
-	return map[string]any{
-		"x": x, "y": y, "width": width, "height": height,
-		"content": map[string]any{"$ref": "#/spec/panels/" + panelID},
-	}
-}
-
-func gridLayout(items ...map[string]any) map[string]any {
-	list := make([]any, 0, len(items))
-	for _, item := range items {
-		list = append(list, item)
-	}
-	return map[string]any{"kind": "Grid", "spec": map[string]any{"items": list}}
-}
-
-// builderQuery wraps a builder query spec in the panel query envelope.
-// requestType is the result shape the panel renders: time_series, scalar or raw.
-func builderQuery(requestType string, spec map[string]any) map[string]any {
-	return map[string]any{
-		"kind": requestType,
-		"spec": map[string]any{
-			"name":   spec["name"],
-			"plugin": map[string]any{"kind": "signoz/BuilderQuery", "spec": spec},
-		},
-	}
-}
-
-func panel(name, description string, plugin map[string]any, queries ...map[string]any) map[string]any {
-	list := make([]any, 0, len(queries))
-	for _, q := range queries {
-		list = append(list, q)
-	}
-	return map[string]any{
-		"kind": "Panel",
-		"spec": map[string]any{
-			"display": map[string]any{"name": name, "description": description},
-			"links":   []any{},
-			"plugin":  plugin,
-			"queries": list,
-		},
-	}
-}
-
-func serviceNameGroupBy() []any {
-	return []any{map[string]any{"name": "service.name", "fieldContext": "resource", "fieldDataType": "string"}}
-}
-
-// createDashboardExamples returns example payloads for the dashboard create
-// endpoint. They cover a variable-driven service overview and a logs dashboard
-// that pairs a query-less text panel with a table.
-func createDashboardExamples() []handler.OpenAPIExample {
-	return []handler.OpenAPIExample{
-		{
-			Name:        "service_overview",
-			Summary:     "Service overview with a variable, a time series panel and a number panel",
-			Description: "A `$service` list variable fed by the observed `service.name` values filters both panels. The time series panel counts spans per service; the number panel renders a single scalar and turns red above 100 errors. `generateName` lets the server derive the name from the display name.",
-			Value: map[string]any{
-				"schemaVersion": "v6",
-				"generateName":  true,
-				"tags":          []any{map[string]any{"key": "team", "value": "platform"}},
-				"spec": map[string]any{
-					"display": map[string]any{"name": "Service Overview", "description": "Request rate and errors per service"},
-					"variables": []any{
-						map[string]any{
-							"kind": "ListVariable",
-							"spec": map[string]any{
-								"name":          "service",
-								"display":       map[string]any{"name": "Service"},
-								"allowMultiple": true,
-								"allowAllValue": true,
-								"sort":          "alphabetical-asc",
-								"plugin": map[string]any{
-									"kind": "signoz/DynamicVariable",
-									"spec": map[string]any{"name": "service.name", "signal": "traces"},
-								},
-							},
-						},
-					},
-					"panels": map[string]any{
-						"request-rate": panel("Requests", "Spans per service",
-							map[string]any{
-								"kind": "signoz/TimeSeriesPanel",
-								"spec": map[string]any{
-									"formatting": map[string]any{"decimalPrecision": "0"},
-									"legend":     map[string]any{"position": "bottom"},
-								},
-							},
-							builderQuery("time_series", map[string]any{
-								"name":         "A",
-								"signal":       "traces",
-								"aggregations": []any{map[string]any{"expression": "count()", "alias": "requests"}},
-								"filter":       map[string]any{"expression": "service.name IN $service"},
-								"groupBy":      serviceNameGroupBy(),
-								"legend":       "{{service.name}}",
-							}),
-						),
-						"error-count": panel("Errors", "Spans with an error status",
-							map[string]any{
-								"kind": "signoz/NumberPanel",
-								"spec": map[string]any{
-									"thresholds": []any{
-										map[string]any{"value": 100, "operator": "above", "color": "#F1575F", "format": "background"},
-									},
-								},
-							},
-							builderQuery("scalar", map[string]any{
-								"name":         "A",
-								"signal":       "traces",
-								"aggregations": []any{map[string]any{"expression": "count()", "alias": "errors"}},
-								"filter":       map[string]any{"expression": "has_error = true AND service.name IN $service"},
-							}),
-						),
-					},
-					"layouts": []any{gridLayout(
-						gridItem("request-rate", 0, 0, 8, 6),
-						gridItem("error-count", 8, 0, 4, 6),
-					)},
-					"duration": "1h",
-					"links":    []any{},
-				},
-			},
-		},
-		{
-			Name:        "logs_table_with_runbook",
-			Summary:     "Logs dashboard with a text panel and a table panel",
-			Description: "A `signoz/TextPanel` renders markdown and must send `queries: []`. The table counts error logs per service as a scalar result, orders by the `errors` alias and colors cells above 1000 errors; the threshold names the column by its key `A` (the query name), not by the alias.",
-			Value: map[string]any{
-				"schemaVersion": "v6",
-				"name":          "error-logs-by-service",
-				"tags":          []any{},
-				"spec": map[string]any{
-					"display":   map[string]any{"name": "Error Logs by Service", "description": ""},
-					"variables": []any{},
-					"panels": map[string]any{
-						"runbook": panel("Runbook", "What to do when errors spike",
-							map[string]any{
-								"kind": "signoz/TextPanel",
-								"spec": map[string]any{
-									"mode":          "markdown",
-									"text":          "## Error logs\n\n1. Find the service with the most errors in the table.\n2. Open its logs and group by `code.function`.",
-									"presentation":  map[string]any{"textAlign": "left", "verticalAlign": "top"},
-									"headerOptions": map[string]any{"hide": false},
-								},
-							},
-						),
-						"errors-by-service": panel("Error logs per service", "",
-							map[string]any{
-								"kind": "signoz/TablePanel",
-								"spec": map[string]any{
-									"formatting": map[string]any{"decimalPrecision": "0"},
-									"thresholds": []any{
-										map[string]any{"columnName": "A", "value": 1000, "operator": "above", "color": "#F1575F", "format": "background"},
-									},
-								},
-							},
-							builderQuery("scalar", map[string]any{
-								"name":         "A",
-								"signal":       "logs",
-								"aggregations": []any{map[string]any{"expression": "count()", "alias": "errors"}},
-								"filter":       map[string]any{"expression": "severity_text = 'ERROR'"},
-								"groupBy":      serviceNameGroupBy(),
-								"order":        []any{map[string]any{"key": map[string]any{"name": "errors"}, "direction": "desc"}},
-								"limit":        20,
-							}),
-						),
-					},
-					"layouts": []any{gridLayout(
-						gridItem("runbook", 0, 0, 4, 6),
-						gridItem("errors-by-service", 4, 0, 8, 6),
-					)},
-					"links": []any{},
-				},
-			},
-		},
-	}
-}
-
-// updateDashboardExamples returns the example payload for the dashboard update
-// endpoint: the full replacement shape, including the immutable name.
-func updateDashboardExamples() []handler.OpenAPIExample {
-	return []handler.OpenAPIExample{
-		{
-			Name:        "replace_dashboard",
-			Summary:     "Replace a dashboard with a single CPU time series panel",
-			Description: "Update is a full replacement: every field is written as sent, so fetch the dashboard first and resend the unchanged parts. `name` must equal the dashboard's current name.",
-			Value: map[string]any{
-				"schemaVersion": "v6",
-				"name":          "host-cpu",
-				"tags":          []any{map[string]any{"key": "team", "value": "infra"}},
-				"spec": map[string]any{
-					"display":   map[string]any{"name": "Host CPU", "description": "CPU time by state"},
-					"variables": []any{},
-					"panels": map[string]any{
-						"cpu-time": panel("CPU time", "Rate of system.cpu.time by state",
-							map[string]any{
-								"kind": "signoz/TimeSeriesPanel",
-								"spec": map[string]any{
-									"chartAppearance": map[string]any{"fillMode": "gradient"},
-									"legend":          map[string]any{"position": "right"},
-								},
-							},
-							builderQuery("time_series", map[string]any{
-								"name":   "A",
-								"signal": "metrics",
-								"aggregations": []any{map[string]any{
-									"metricName":       "system.cpu.time",
-									"timeAggregation":  "rate",
-									"spaceAggregation": "sum",
-								}},
-								"groupBy": []any{map[string]any{"name": "state", "fieldContext": "attribute", "fieldDataType": "string"}},
-								"legend":  "{{state}}",
-							}),
-						),
-					},
-					"layouts":         []any{gridLayout(gridItem("cpu-time", 0, 0, 12, 7))},
-					"duration":        "3h",
-					"refreshInterval": "30s",
-					"links":           []any{},
-				},
-			},
-		},
-	}
-}
-
-// patchDashboardExamples returns example payloads for the dashboard patch
-// endpoint. The request body is the RFC 6902 operation array itself.
-func patchDashboardExamples() []handler.OpenAPIExample {
-	return []handler.OpenAPIExample{
-		{
-			Name:        "rename",
-			Summary:     "Rename a dashboard",
-			Description: "Replaces the display name without resending anything else.",
-			Value: []any{
-				map[string]any{"op": "replace", "path": "/spec/display/name", "value": "Service Overview (production)"},
-			},
-		},
-		{
-			Name:        "add_panel",
-			Summary:     "Add a panel and place it",
-			Description: "Adding a panel takes two operations: one adds the panel under `/spec/panels/<id>`, the other appends a grid item that references it to the first layout. A panel that no layout places is accepted but not shown.",
-			Value: []any{
-				map[string]any{
-					"op":   "add",
-					"path": "/spec/panels/error-rate",
-					"value": panel("Error count", "Errored spans per time bucket",
-						map[string]any{"kind": "signoz/TimeSeriesPanel", "spec": map[string]any{}},
-						builderQuery("time_series", map[string]any{
-							"name":         "A",
-							"signal":       "traces",
-							"aggregations": []any{map[string]any{"expression": "count()"}},
-							"filter":       map[string]any{"expression": "has_error = true"},
-						}),
-					),
-				},
-				map[string]any{
-					"op":    "add",
-					"path":  "/spec/layouts/0/spec/items/-",
-					"value": gridItem("error-rate", 0, 7, 12, 6),
-				},
-			},
-		},
-	}
-}

pkg/apiserver/signozapiserver/dashboard_examples_test.go

@@ -1,49 +0,0 @@
-package signozapiserver
-
-import (
-	"encoding/json"
-	"testing"
-
-	"github.com/SigNoz/signoz/pkg/types"
-	"github.com/SigNoz/signoz/pkg/types/dashboardtypes"
-	"github.com/SigNoz/signoz/pkg/valuer"
-	"github.com/stretchr/testify/require"
-)
-
-func TestDashboardExamplesAreValidPayloads(t *testing.T) {
-	for _, ex := range createDashboardExamples() {
-		t.Run("create/"+ex.Name, func(t *testing.T) {
-			raw, err := json.Marshal(ex.Value)
-			require.NoError(t, err)
-			var postable dashboardtypes.PostableDashboardV2
-			require.NoError(t, json.Unmarshal(raw, &postable))
-		})
-	}
-
-	var base dashboardtypes.UpdatableDashboardV2
-	for _, ex := range updateDashboardExamples() {
-		t.Run("update/"+ex.Name, func(t *testing.T) {
-			raw, err := json.Marshal(ex.Value)
-			require.NoError(t, err)
-			require.NoError(t, json.Unmarshal(raw, &base))
-		})
-	}
-
-	existing := &dashboardtypes.DashboardV2{
-		Identifiable:            types.Identifiable{ID: valuer.GenerateUUID()},
-		Source:                  dashboardtypes.SourceUser,
-		DashboardV2MetadataBase: base.DashboardV2MetadataBase,
-		Name:                    base.Name,
-		Spec:                    base.Spec,
-	}
-	for _, ex := range patchDashboardExamples() {
-		t.Run("patch/"+ex.Name, func(t *testing.T) {
-			raw, err := json.Marshal(ex.Value)
-			require.NoError(t, err)
-			var patch dashboardtypes.PatchableDashboardV2
-			require.NoError(t, json.Unmarshal(raw, &patch))
-			_, err = patch.Apply(existing)
-			require.NoError(t, err)
-		})
-	}
-}

pkg/apiserver/signozapiserver/llmpricingrule.go

@@ -4,14 +4,15 @@ import (
 	"net/http"
 
 	"github.com/SigNoz/signoz/pkg/http/handler"
-	"github.com/SigNoz/signoz/pkg/types"
+	"github.com/SigNoz/signoz/pkg/types/authtypes"
+	"github.com/SigNoz/signoz/pkg/types/coretypes"
 	"github.com/SigNoz/signoz/pkg/types/llmpricingruletypes"
 	"github.com/gorilla/mux"
 )
 
 func (provider *provider) addLLMPricingRuleRoutes(router *mux.Router) error {
 	if err := router.Handle("/api/v1/llm_pricing_rules", handler.New(
-		provider.authzMiddleware.ViewAccess(provider.llmPricingRuleHandler.List),
+		provider.authzMiddleware.CheckResources(provider.llmPricingRuleHandler.List, authtypes.SigNozAdminRoleName, authtypes.SigNozEditorRoleName, authtypes.SigNozViewerRoleName),
 		handler.OpenAPIDef{
 			ID:                  "ListLLMPricingRules",
 			Tags:                []string{"llmpricingrules"},
@@ -25,14 +26,20 @@ func (provider *provider) addLLMPricingRuleRoutes(router *mux.Router) error {
 			SuccessStatusCode:   http.StatusOK,
 			ErrorStatusCodes:    []int{http.StatusBadRequest},
 			Deprecated:          false,
-			SecuritySchemes:     newSecuritySchemes(types.RoleViewer),
+			SecuritySchemes:     newScopedSecuritySchemes([]string{coretypes.ResourceMetaResourceLLMPricingRule.Scope(coretypes.VerbList)}),
 		},
+		handler.WithResourceDefs(handler.BasicResourceDef{
+			Resource: coretypes.ResourceMetaResourceLLMPricingRule,
+			Verb:     coretypes.VerbList,
+			Category: coretypes.ActionCategoryDataAccess,
+			Selector: coretypes.WildcardSelector,
+		}),
 	)).Methods(http.MethodGet).GetError(); err != nil {
 		return err
 	}
 
 	if err := router.Handle("/api/v1/llm_pricing_rules", handler.New(
-		provider.authzMiddleware.AdminAccess(provider.llmPricingRuleHandler.CreateOrUpdate),
+		provider.authzMiddleware.CheckResources(provider.llmPricingRuleHandler.CreateOrUpdate, authtypes.SigNozAdminRoleName),
 		handler.OpenAPIDef{
 			ID:                 "CreateOrUpdateLLMPricingRules",
 			Tags:               []string{"llmpricingrules"},
@@ -43,14 +50,20 @@ func (provider *provider) addLLMPricingRuleRoutes(router *mux.Router) error {
 			SuccessStatusCode:  http.StatusNoContent,
 			ErrorStatusCodes:   []int{http.StatusBadRequest},
 			Deprecated:         false,
-			SecuritySchemes:    newSecuritySchemes(types.RoleAdmin),
+			SecuritySchemes:    newScopedSecuritySchemes([]string{coretypes.ResourceMetaResourceLLMPricingRule.Scope(coretypes.VerbUpdate)}),
 		},
+		handler.WithResourceDefs(handler.TelemetryResourceDef{
+			Verb:      coretypes.VerbUpdate,
+			Category:  coretypes.ActionCategoryConfigurationChange,
+			Selector:  llmpricingruletypes.RuleSelector,
+			Resources: llmpricingruletypes.UpdatableRulesResources,
+		}),
 	)).Methods(http.MethodPut).GetError(); err != nil {
 		return err
 	}
 
 	if err := router.Handle("/api/v1/llm_pricing_rules/unmapped_models", handler.New(
-		provider.authzMiddleware.ViewAccess(provider.llmPricingRuleHandler.ListUnmappedModels),
+		provider.authzMiddleware.CheckResources(provider.llmPricingRuleHandler.ListUnmappedModels, authtypes.SigNozAdminRoleName, authtypes.SigNozEditorRoleName, authtypes.SigNozViewerRoleName),
 		handler.OpenAPIDef{
 			ID:                  "ListUnmappedLLMModels",
 			Tags:                []string{"llmpricingrules"},
@@ -63,14 +76,20 @@ func (provider *provider) addLLMPricingRuleRoutes(router *mux.Router) error {
 			SuccessStatusCode:   http.StatusOK,
 			ErrorStatusCodes:    []int{http.StatusBadRequest},
 			Deprecated:          false,
-			SecuritySchemes:     newSecuritySchemes(types.RoleViewer),
+			SecuritySchemes:     newScopedSecuritySchemes([]string{coretypes.ResourceMetaResourceLLMPricingRule.Scope(coretypes.VerbList)}),
 		},
+		handler.WithResourceDefs(handler.BasicResourceDef{
+			Resource: coretypes.ResourceMetaResourceLLMPricingRule,
+			Verb:     coretypes.VerbList,
+			Category: coretypes.ActionCategoryDataAccess,
+			Selector: coretypes.WildcardSelector,
+		}),
 	)).Methods(http.MethodGet).GetError(); err != nil {
 		return err
 	}
 
 	if err := router.Handle("/api/v1/llm_pricing_rules/{id}", handler.New(
-		provider.authzMiddleware.ViewAccess(provider.llmPricingRuleHandler.Get),
+		provider.authzMiddleware.CheckResources(provider.llmPricingRuleHandler.Get, authtypes.SigNozAdminRoleName, authtypes.SigNozEditorRoleName, authtypes.SigNozViewerRoleName),
 		handler.OpenAPIDef{
 			ID:                  "GetLLMPricingRule",
 			Tags:                []string{"llmpricingrules"},
@@ -83,14 +102,21 @@ func (provider *provider) addLLMPricingRuleRoutes(router *mux.Router) error {
 			SuccessStatusCode:   http.StatusOK,
 			ErrorStatusCodes:    []int{http.StatusNotFound},
 			Deprecated:          false,
-			SecuritySchemes:     newSecuritySchemes(types.RoleViewer),
+			SecuritySchemes:     newScopedSecuritySchemes([]string{coretypes.ResourceMetaResourceLLMPricingRule.Scope(coretypes.VerbRead)}),
 		},
+		handler.WithResourceDefs(handler.BasicResourceDef{
+			Resource: coretypes.ResourceMetaResourceLLMPricingRule,
+			Verb:     coretypes.VerbRead,
+			Category: coretypes.ActionCategoryDataAccess,
+			ID:       coretypes.PathParam("id"),
+			Selector: coretypes.IDSelector,
+		}),
 	)).Methods(http.MethodGet).GetError(); err != nil {
 		return err
 	}
 
 	if err := router.Handle("/api/v1/llm_pricing_rules/{id}", handler.New(
-		provider.authzMiddleware.AdminAccess(provider.llmPricingRuleHandler.Delete),
+		provider.authzMiddleware.CheckResources(provider.llmPricingRuleHandler.Delete, authtypes.SigNozAdminRoleName),
 		handler.OpenAPIDef{
 			ID:                  "DeleteLLMPricingRule",
 			Tags:                []string{"llmpricingrules"},
@@ -103,8 +129,15 @@ func (provider *provider) addLLMPricingRuleRoutes(router *mux.Router) error {
 			SuccessStatusCode:   http.StatusNoContent,
 			ErrorStatusCodes:    []int{http.StatusNotFound},
 			Deprecated:          false,
-			SecuritySchemes:     newSecuritySchemes(types.RoleAdmin),
+			SecuritySchemes:     newScopedSecuritySchemes([]string{coretypes.ResourceMetaResourceLLMPricingRule.Scope(coretypes.VerbDelete)}),
 		},
+		handler.WithResourceDefs(handler.BasicResourceDef{
+			Resource: coretypes.ResourceMetaResourceLLMPricingRule,
+			Verb:     coretypes.VerbDelete,
+			Category: coretypes.ActionCategoryConfigurationChange,
+			ID:       coretypes.PathParam("id"),
+			Selector: coretypes.IDSelector,
+		}),
 	)).Methods(http.MethodDelete).GetError(); err != nil {
 		return err
 	}

pkg/apiserver/signozapiserver/metricsexplorer.go

@@ -70,7 +70,6 @@ func (provider *provider) addMetricsExplorerRoutes(router *mux.Router) error {
 			Description:         "This endpoint returns a treemap visualization showing the proportional distribution of metrics by sample count or time series count",
 			Request:             new(metricsexplorertypes.TreemapRequest),
 			RequestContentType:  "application/json",
-			RequestExamples:     treemapRequestExamples(),
 			Response:            new(metricsexplorertypes.TreemapResponse),
 			ResponseContentType: "application/json",
 			SuccessStatusCode:   http.StatusOK,

pkg/apiserver/signozapiserver/metricsexplorer_examples.go

@@ -1,33 +0,0 @@
-package signozapiserver
-
-import "github.com/SigNoz/signoz/pkg/http/handler"
-
-// treemapRequestExamples returns example payloads for the metrics treemap
-// endpoint, one per mode.
-func treemapRequestExamples() []handler.OpenAPIExample {
-	return []handler.OpenAPIExample{
-		{
-			Name:        "treemap_timeseries",
-			Summary:     "Top metrics by time series count",
-			Description: "Sizes each metric by the number of distinct time series it produced in the time range, limited to the 50 largest. Only the `timeseries` array of the response is populated.",
-			Value: map[string]any{
-				"start": 1640995200000,
-				"end":   1640998800000,
-				"limit": 50,
-				"mode":  "timeseries",
-			},
-		},
-		{
-			Name:        "treemap_samples_filtered",
-			Summary:     "Top metrics by sample count for one host",
-			Description: "Sizes each metric by the number of samples ingested, restricted with a query builder filter on a metric attribute. Only the `samples` array of the response is populated.",
-			Value: map[string]any{
-				"start":  1640995200000,
-				"end":    1640998800000,
-				"limit":  20,
-				"mode":   "samples",
-				"filter": map[string]any{"expression": "host.name = 'web-1'"},
-			},
-		},
-	}
-}

pkg/apiserver/signozapiserver/metricsexplorer_examples_test.go

@@ -1,21 +0,0 @@
-package signozapiserver
-
-import (
-	"encoding/json"
-	"testing"
-
-	"github.com/SigNoz/signoz/pkg/types/metricsexplorertypes"
-	"github.com/stretchr/testify/require"
-)
-
-func TestTreemapExamplesAreValidPayloads(t *testing.T) {
-	for _, ex := range treemapRequestExamples() {
-		t.Run(ex.Name, func(t *testing.T) {
-			raw, err := json.Marshal(ex.Value)
-			require.NoError(t, err)
-			var req metricsexplorertypes.TreemapRequest
-			require.NoError(t, json.Unmarshal(raw, &req))
-			require.NoError(t, req.Validate())
-		})
-	}
-}

pkg/apiserver/signozapiserver/savedview.go

@@ -48,7 +48,6 @@ func (provider *provider) addSavedViewRoutes(router *mux.Router) error {
 			Description:         "Persists a saved view for the explore page. Returns the id of the created view.",
 			Request:             new(savedviewtypes.PostableSavedView),
 			RequestContentType:  "application/json",
-			RequestExamples:     postableSavedViewExamples(),
 			Response:            new(types.Identifiable),
 			ResponseContentType: "application/json",
 			SuccessStatusCode:   http.StatusCreated,
@@ -103,7 +102,6 @@ func (provider *provider) addSavedViewRoutes(router *mux.Router) error {
 			Description:         "Replaces a saved view's name and query.",
 			Request:             new(savedviewtypes.UpdatableSavedView),
 			RequestContentType:  "application/json",
-			RequestExamples:     updatableSavedViewExamples(),
 			Response:            nil,
 			ResponseContentType: "application/json",
 			SuccessStatusCode:   http.StatusNoContent,

pkg/apiserver/signozapiserver/savedview_examples.go

@@ -1,176 +0,0 @@
-package signozapiserver
-
-import "github.com/SigNoz/signoz/pkg/http/handler"
-
-// postableSavedViewExamples returns example payloads attached to the saved view
-// create endpoint. They cover each explorer source and both list and graph panels.
-func postableSavedViewExamples() []handler.OpenAPIExample {
-	return []handler.OpenAPIExample{
-		{
-			Name:        "traces_list",
-			Summary:     "Traces list view with filter and columns",
-			Description: "A list panel over spans slower than 500ms in one service, ordered newest first, with three explorer columns.",
-			Value: map[string]any{
-				"name":          "slow-checkout-traces",
-				"source":        "traces",
-				"schemaVersion": "v2",
-				"spec": map[string]any{
-					"displayName": "Slow checkout traces",
-					"panelType":   "list",
-					"requestType": "raw",
-					"queries": []any{
-						map[string]any{
-							"type": "builder_query",
-							"spec": map[string]any{
-								"name":   "A",
-								"signal": "traces",
-								"filter": map[string]any{"expression": "service.name = 'checkoutservice' AND duration_nano > 500000000"},
-								"order":  []any{map[string]any{"key": map[string]any{"name": "timestamp"}, "direction": "desc"}},
-								"limit":  100,
-							},
-						},
-					},
-					"selectedFields": []any{
-						map[string]any{"name": "service.name", "signal": "traces", "fieldContext": "resource", "fieldDataType": "string"},
-						map[string]any{"name": "name", "signal": "traces", "fieldContext": "span", "fieldDataType": "string"},
-						map[string]any{"name": "duration_nano", "signal": "traces", "fieldContext": "span", "fieldDataType": "float64"},
-					},
-				},
-			},
-		},
-		{
-			Name:        "logs_list_generated_name",
-			Summary:     "Logs list view with a generated name",
-			Description: "A list panel over error logs of one service. generateName lets the server derive the machine name from displayName; the display preferences set the row format and font size.",
-			Value: map[string]any{
-				"generateName":  true,
-				"source":        "logs",
-				"schemaVersion": "v2",
-				"spec": map[string]any{
-					"displayName": "Payment errors",
-					"panelType":   "list",
-					"requestType": "raw",
-					"queries": []any{
-						map[string]any{
-							"type": "builder_query",
-							"spec": map[string]any{
-								"name":   "A",
-								"signal": "logs",
-								"filter": map[string]any{"expression": "service.name = 'paymentservice' AND severity_text = 'ERROR'"},
-								"order": []any{
-									map[string]any{"key": map[string]any{"name": "timestamp"}, "direction": "desc"},
-									map[string]any{"key": map[string]any{"name": "id"}, "direction": "desc"},
-								},
-								"limit": 100,
-							},
-						},
-					},
-					"selectedFields": []any{
-						map[string]any{"name": "service.name", "signal": "logs", "fieldContext": "resource", "fieldDataType": "string"},
-						map[string]any{"name": "severity_text", "signal": "logs", "fieldContext": "log", "fieldDataType": "string"},
-					},
-					"display": map[string]any{
-						"format":   "list",
-						"fontSize": "small",
-						"maxLines": 2,
-					},
-				},
-			},
-		},
-		{
-			Name:        "metrics_time_series",
-			Summary:     "Metrics graph view",
-			Description: "A graph panel plotting the per-second request rate of a counter, summed across series at one minute resolution.",
-			Value: map[string]any{
-				"name":          "http-request-rate",
-				"source":        "metrics",
-				"schemaVersion": "v2",
-				"spec": map[string]any{
-					"displayName": "HTTP request rate",
-					"panelType":   "graph",
-					"requestType": "time_series",
-					"queries": []any{
-						map[string]any{
-							"type": "builder_query",
-							"spec": map[string]any{
-								"name":         "A",
-								"signal":       "metrics",
-								"stepInterval": 60,
-								"aggregations": []any{map[string]any{"metricName": "http_requests_total", "timeAggregation": "rate", "spaceAggregation": "sum"}},
-								"groupBy":      []any{map[string]any{"name": "service.name", "fieldContext": "resource", "fieldDataType": "string"}},
-							},
-						},
-					},
-					"selectedFields": []any{},
-				},
-			},
-		},
-		{
-			Name:        "meter_time_series",
-			Summary:     "Cost meter graph view",
-			Description: "A graph panel on the meter explorer. Meter views are queried as metrics with the builder spec source set to meter; the meter rolls up hourly, so the step is 3600 seconds.",
-			Value: map[string]any{
-				"name":          "log-ingestion-volume",
-				"source":        "meter",
-				"schemaVersion": "v2",
-				"spec": map[string]any{
-					"displayName": "Log ingestion volume",
-					"panelType":   "graph",
-					"requestType": "time_series",
-					"queries": []any{
-						map[string]any{
-							"type": "builder_query",
-							"spec": map[string]any{
-								"name":         "A",
-								"signal":       "metrics",
-								"source":       "meter",
-								"stepInterval": 3600,
-								"aggregations": []any{map[string]any{"metricName": "signoz.meter.log.size", "timeAggregation": "increase", "spaceAggregation": "sum"}},
-							},
-						},
-					},
-					"selectedFields": []any{},
-				},
-			},
-		},
-	}
-}
-
-// updatableSavedViewExamples returns example payloads attached to the saved view
-// update endpoint. The update replaces the whole spec; the machine name is immutable.
-func updatableSavedViewExamples() []handler.OpenAPIExample {
-	return []handler.OpenAPIExample{
-		{
-			Name:        "traces_list_widen_filter",
-			Summary:     "Replace a traces list view",
-			Description: "Replaces the spec of an existing traces list view with a wider latency filter and one more column. Every field of spec must be sent again; the machine name stays as created.",
-			Value: map[string]any{
-				"source":        "traces",
-				"schemaVersion": "v2",
-				"spec": map[string]any{
-					"displayName": "Slow checkout traces (over 250ms)",
-					"panelType":   "list",
-					"requestType": "raw",
-					"queries": []any{
-						map[string]any{
-							"type": "builder_query",
-							"spec": map[string]any{
-								"name":   "A",
-								"signal": "traces",
-								"filter": map[string]any{"expression": "service.name = 'checkoutservice' AND duration_nano > 250000000"},
-								"order":  []any{map[string]any{"key": map[string]any{"name": "timestamp"}, "direction": "desc"}},
-								"limit":  100,
-							},
-						},
-					},
-					"selectedFields": []any{
-						map[string]any{"name": "service.name", "signal": "traces", "fieldContext": "resource", "fieldDataType": "string"},
-						map[string]any{"name": "name", "signal": "traces", "fieldContext": "span", "fieldDataType": "string"},
-						map[string]any{"name": "duration_nano", "signal": "traces", "fieldContext": "span", "fieldDataType": "float64"},
-						map[string]any{"name": "http.status_code", "signal": "traces", "fieldContext": "attribute", "fieldDataType": "string"},
-					},
-				},
-			},
-		},
-	}
-}

pkg/apiserver/signozapiserver/savedview_examples_test.go

@@ -1,30 +0,0 @@
-package signozapiserver
-
-import (
-	"encoding/json"
-	"testing"
-
-	"github.com/SigNoz/signoz/pkg/types/savedviewtypes"
-	"github.com/stretchr/testify/require"
-)
-
-func TestSavedViewExamplesAreValidPayloads(t *testing.T) {
-	for _, ex := range postableSavedViewExamples() {
-		t.Run("create/"+ex.Name, func(t *testing.T) {
-			raw, err := json.Marshal(ex.Value)
-			require.NoError(t, err)
-			var postable savedviewtypes.PostableSavedView
-			require.NoError(t, json.Unmarshal(raw, &postable))
-			require.NoError(t, postable.Validate())
-		})
-	}
-	for _, ex := range updatableSavedViewExamples() {
-		t.Run("update/"+ex.Name, func(t *testing.T) {
-			raw, err := json.Marshal(ex.Value)
-			require.NoError(t, err)
-			var updatable savedviewtypes.UpdatableSavedView
-			require.NoError(t, json.Unmarshal(raw, &updatable))
-			require.NoError(t, updatable.Validate())
-		})
-	}
-}

pkg/modules/serviceaccount/implserviceaccount/module.go

@@ -176,11 +176,7 @@ func (module *module) Delete(ctx context.Context, orgID valuer.UUID, id valuer.U
 			return err
 		}
 
-		err = module.store.DeleteServiceAccountRolesByServiceAccountID(ctx, id)
-		if err != nil {
-			return err
-		}
-
+		// update the status but do not delete the role mappings as we will use them for audits
 		err = module.store.Update(ctx, orgID, serviceAccount.ServiceAccount)
 		if err != nil {
 			return err

pkg/modules/serviceaccount/implserviceaccount/store.go

@@ -243,21 +243,6 @@ func (store *store) DeleteServiceAccountRole(ctx context.Context, serviceAccount
 	return nil
 }
 
-func (store *store) DeleteServiceAccountRolesByServiceAccountID(ctx context.Context, serviceAccountID valuer.UUID) error {
-	_, err := store.
-		sqlstore.
-		BunDBCtx(ctx).
-		NewDelete().
-		Model(new(serviceaccounttypes.ServiceAccountRole)).
-		Where("service_account_id = ?", serviceAccountID).
-		Exec(ctx)
-	if err != nil {
-		return err
-	}
-
-	return nil
-}
-
 func (store *store) CreateFactorAPIKey(ctx context.Context, storable *serviceaccounttypes.FactorAPIKey) error {
 	_, err := store.
 		sqlstore.

pkg/querier/bucket_cache.go

@@ -11,7 +11,6 @@ import (
 	"github.com/SigNoz/signoz/pkg/cache"
 	"github.com/SigNoz/signoz/pkg/errors"
 	"github.com/SigNoz/signoz/pkg/factory"
-	"github.com/SigNoz/signoz/pkg/types/metrictypes"
 	qbtypes "github.com/SigNoz/signoz/pkg/types/querybuildertypes/querybuildertypesv5"
 	"github.com/SigNoz/signoz/pkg/valuer"
 )
@@ -90,15 +89,14 @@ func (bc *bucketCache) GetMissRanges(
 	// Extract relevant buckets and merge them
 	relevantBuckets := bc.filterRelevantBuckets(data.Buckets, startMs, endMs)
 	if len(relevantBuckets) == 0 {
-		// nothing cached overlaps the window, so all of it has to be fetched.
-		return nil, []*qbtypes.TimeRange{{From: startMs, To: endMs}}
+		return nil, missing
 	}
 
 	// Merge buckets into a single result
 	mergedResult := bc.mergeBuckets(ctx, relevantBuckets, data.Warnings)
 
 	// Filter the merged result to only include values within the requested time range
-	mergedResult = bc.filterResultToTimeRange(mergedResult, q, startMs, endMs, stepMs)
+	mergedResult = bc.filterResultToTimeRange(mergedResult, startMs, endMs)
 
 	return mergedResult, missing
 }
@@ -210,8 +208,8 @@ func (bc *bucketCache) generateCacheKey(q qbtypes.Query) string {
 
 // findMissingRangesWithStep identifies time ranges not covered by cached buckets with step alignment.
 func (bc *bucketCache) findMissingRangesWithStep(buckets []*qbtypes.CachedBucket, startMs, endMs uint64, stepMs uint64) []*qbtypes.TimeRange {
-	// When step is 0, use simple algorithm
-	if stepMs == 0 {
+	// When step is 0 or window is too small to be cached, use simple algorithm
+	if stepMs == 0 || (startMs+stepMs) > endMs {
 		return bc.findMissingRangesBasic(buckets, startMs, endMs)
 	}
 
@@ -306,8 +304,7 @@ func (bc *bucketCache) findMissingRangesWithStep(buckets []*qbtypes.CachedBucket
 		// Update current position to the end of this bucket
 		// But ensure it's aligned to step boundary
 		bucketEnd := min(bucket.EndMs, endMs)
-		// The step the window ends inside is missing however far the bucket runs.
-		if bucketEnd%stepMs != 0 {
+		if bucketEnd%stepMs != 0 && bucketEnd < endMs {
 			// Round down to step boundary
 			bucketEnd = bucketEnd - (bucketEnd % stepMs)
 		}
@@ -794,26 +791,12 @@ func max(a, b uint64) uint64 {
 	return b
 }
 
-// filterResultToTimeRange narrows the cached result to the requested window, both
-// the values in it and the heatmap axis under them.
-func (bc *bucketCache) filterResultToTimeRange(result *qbtypes.Result, q qbtypes.Query, startMs, endMs, stepMs uint64) *qbtypes.Result {
+// filterResultToTimeRange filters the result to only include values within the requested time range.
+func (bc *bucketCache) filterResultToTimeRange(result *qbtypes.Result, startMs, endMs uint64) *qbtypes.Result {
 	if result == nil || result.Value == nil {
 		return result
 	}
 
-	_, isPromQL := q.(*promqlQuery)
-	maxTimestampMs := endMs
-	// A promql value at T is the query evaluated at T, so T == endMs is inside the
-	// requested range. For every other query type the value at T aggregates
-	// [T, T+stepMs), which the requested range contains only when T <= endMs-stepMs.
-	if !isPromQL {
-		if stepMs > 0 {
-			maxTimestampMs = endMs - stepMs
-		} else {
-			maxTimestampMs = endMs - 1
-		}
-	}
-
 	switch result.Type {
 	case qbtypes.RequestTypeTimeSeries, qbtypes.RequestTypeHeatmap:
 		if tsData, ok := result.Value.(*qbtypes.TimeSeriesData); ok {
@@ -838,7 +821,7 @@ func (bc *bucketCache) filterResultToTimeRange(result *qbtypes.Result, q qbtypes
 					// Filter values to only include those within the requested time range
 					for _, value := range series.Values {
 						timestampMs := uint64(value.Timestamp)
-						if timestampMs >= startMs && timestampMs <= maxTimestampMs {
+						if timestampMs >= startMs && timestampMs < endMs {
 							filteredSeries.Values = append(filteredSeries.Values, value)
 						}
 					}
@@ -853,8 +836,6 @@ func (bc *bucketCache) filterResultToTimeRange(result *qbtypes.Result, q qbtypes
 				}
 			}
 
-			bc.trimHeatmapAxisToTheWindow(q, filteredData)
-
 			// Create a new result with the filtered data
 			return &qbtypes.Result{
 				Type:     result.Type,
@@ -868,25 +849,3 @@ func (bc *bucketCache) filterResultToTimeRange(result *qbtypes.Result, q qbtypes
 	// For non-time series data, return as is
 	return result
 }
-
-// A cache entry can hold a longer time range than the one now requested, and its
-// bucket axis spans every sample value seen across that longer range. Once the
-// points outside the requested range are dropped, the axis may still list
-// buckets that only those dropped points counted into. Left there, they render
-// as empty rows that the same request never has when it bypasses the cache.
-//
-// PromQL and ClickHouse queries name their own buckets, and a histogram's are
-// its `le` labels, so only a gauge, sum or summary axis is cut.
-func (bc *bucketCache) trimHeatmapAxisToTheWindow(q qbtypes.Query, tsData *qbtypes.TimeSeriesData) {
-	metricQuery, isMetricQuery := q.(*builderQuery[qbtypes.MetricAggregation])
-	if !isMetricQuery {
-		return
-	}
-	if metricQuery.spec.Aggregations[0].Type == metrictypes.HistogramType {
-		return
-	}
-
-	for _, aggBucket := range tsData.Aggregations {
-		aggBucket.TrimAxisToCountedBuckets()
-	}
-}

pkg/querier/bucket_cache_bench_test.go

@@ -327,7 +327,7 @@ func BenchmarkBucketCache_FilterResultToTimeRange(b *testing.B) {
 			b.ReportAllocs()
 
 			for i := 0; i < b.N; i++ {
-				filtered := bc.filterResultToTimeRange(result, &promqlQuery{}, startMs, endMs, 0)
+				filtered := bc.filterResultToTimeRange(result, startMs, endMs)
 				_ = filtered
 			}
 		})

pkg/querier/bucket_cache_test.go

@@ -3,7 +3,6 @@ package querier
 import (
 	"context"
 	"fmt"
-	"log/slog"
 	"testing"
 	"time"
 
@@ -1070,11 +1069,8 @@ func TestBucketCache_FilteredCachedResults(t *testing.T) {
 	// Get cached data - should be filtered to requested range
 	cached, missing := bc.GetMissRanges(ctx, orgID, query2, qbtypes.Step{Duration: 1000 * time.Millisecond})
 
-	// The value at 3000 stands for the whole step to 4000, which reaches past the
-	// window, so it is left to be recomputed as a partial rather than served.
-	require.Len(t, missing, 1)
-	assert.Equal(t, uint64(3000), missing[0].From)
-	assert.Equal(t, uint64(3500), missing[0].To)
+	// Should have no missing ranges
+	assert.Len(t, missing, 0)
 	assert.NotNil(t, cached)
 
 	// Verify the cached result only contains values within the requested range
@@ -1084,65 +1080,18 @@ func TestBucketCache_FilteredCachedResults(t *testing.T) {
 	require.Len(t, tsData.Aggregations[0].Series, 1)
 
 	series := tsData.Aggregations[0].Series[0]
-	require.Len(t, series.Values, 1)
+	assert.Len(t, series.Values, 2) // Only values at 2000 and 3000 should be included
 
 	// Verify the exact values
 	assert.Equal(t, int64(2000), series.Values[0].Timestamp)
 	assert.Equal(t, float64(20), series.Values[0].Value)
+	assert.Equal(t, int64(3000), series.Values[1].Timestamp)
+	assert.Equal(t, float64(30), series.Values[1].Value)
 
 	// Value at 1000 should not be included (before requested range)
 	// Value at 4000 should not be included (after requested range)
 }
 
-// A promql value is the query evaluated at a single moment rather than over a
-// span, so the one at the window's end belongs to it and has to survive caching.
-func TestBucketCache_PromQLKeepsTheValueAtTheWindowEnd(t *testing.T) {
-	bc := createTestBucketCache(t)
-	ctx := context.Background()
-	orgID := valuer.UUID{}
-	step := qbtypes.Step{Duration: time.Minute}
-
-	query := &promqlQuery{
-		logger:      slog.Default(),
-		query:       qbtypes.PromQuery{Query: "up", Step: step},
-		tr:          qbtypes.TimeRange{From: 600_000, To: 780_000},
-		requestType: qbtypes.RequestTypeTimeSeries,
-	}
-
-	bc.Put(ctx, orgID, query, step, &qbtypes.Result{
-		Type: qbtypes.RequestTypeTimeSeries,
-		Value: &qbtypes.TimeSeriesData{
-			QueryName: "A",
-			Aggregations: []*qbtypes.AggregationBucket{{
-				Series: []*qbtypes.TimeSeries{{
-					Values: []*qbtypes.TimeSeriesValue{
-						{Timestamp: 600_000, Value: 1},
-						{Timestamp: 660_000, Value: 2},
-						{Timestamp: 720_000, Value: 3},
-						{Timestamp: 780_000, Value: 4},
-					},
-				}},
-			}},
-		},
-	})
-	time.Sleep(10 * time.Millisecond)
-
-	cached, missing := bc.GetMissRanges(ctx, orgID, query, step)
-	assert.Empty(t, missing)
-	require.NotNil(t, cached)
-
-	tsData, ok := cached.Value.(*qbtypes.TimeSeriesData)
-	require.True(t, ok)
-	require.Len(t, tsData.Aggregations, 1)
-	require.Len(t, tsData.Aggregations[0].Series, 1)
-
-	timestamps := []int64{}
-	for _, value := range tsData.Aggregations[0].Series[0].Values {
-		timestamps = append(timestamps, value.Timestamp)
-	}
-	assert.Equal(t, []int64{600_000, 660_000, 720_000, 780_000}, timestamps)
-}
-
 func TestBucketCache_FindMissingRangesWithStep(t *testing.T) {
 	bc := createTestBucketCache(t)
 
@@ -1201,20 +1150,7 @@ func TestBucketCache_FindMissingRangesWithStep(t *testing.T) {
 			expectedMiss: []*qbtypes.TimeRange{
 				{From: 1000, To: 1500},
 			},
-			description: "Window smaller than step is fetched whole",
-		},
-		{
-			name: "small_window_less_than_step_inside_a_bucket",
-			buckets: []*qbtypes.CachedBucket{
-				{StartMs: 0, EndMs: 3000},
-			},
-			startMs: 1000,
-			endMs:   1500,
-			stepMs:  1000,
-			expectedMiss: []*qbtypes.TimeRange{
-				{From: 1000, To: 1500},
-			},
-			description: "A cached point spans its whole step, so it cannot answer a window shorter than the step",
+			description: "Window smaller than step should use basic algorithm",
 		},
 		{
 			name:    "zero_step_uses_basic_algorithm",