fix: opamp collector reconnect send updated config

.github/CODEOWNERS

@@ -200,15 +200,6 @@ go.mod @therealpandey
 /frontend/src/container/ListAlertRules/ @SigNoz/pulse-frontend
 /frontend/src/container/TriggeredAlerts/ @SigNoz/pulse-frontend
 /frontend/src/container/AnomalyAlertEvaluationView/ @SigNoz/pulse-frontend
-/frontend/src/container/RoutingPolicies/ @SigNoz/pulse-frontend
-/frontend/src/components/AlertBreadcrumb/ @SigNoz/pulse-frontend
-/frontend/src/container/EditRules/ @SigNoz/pulse-frontend
-/frontend/src/components/AlertDetailsFilters/ @SigNoz/pulse-frontend
-/frontend/src/components/Alerts/ @SigNoz/pulse-frontend
-/frontend/src/hooks/routingPolicies/ @SigNoz/pulse-frontend
-/frontend/src/types/api/alerts/ @SigNoz/pulse-frontend
-/frontend/src/providers/Alert.tsx @SigNoz/pulse-frontend
-/frontend/src/constants/alerts.ts @SigNoz/pulse-frontend
 
 ## Notification Channels
 /frontend/src/pages/ChannelsEdit/ @SigNoz/pulse-frontend
@@ -216,8 +207,6 @@ go.mod @therealpandey
 /frontend/src/container/AllAlertChannels/ @SigNoz/pulse-frontend
 /frontend/src/container/CreateAlertChannels/ @SigNoz/pulse-frontend
 /frontend/src/container/EditAlertChannels/ @SigNoz/pulse-frontend
-/frontend/src/container/FormAlertChannels/ @SigNoz/pulse-frontend
-/frontend/src/hooks/notificationChannels/ @SigNoz/pulse-frontend
 
 ## OpenAPI Schema - Generated
 /frontend/src/api/generated/services/ @therealpandey @vikrantgupta25 @srikanthccv

.github/workflows/e2eci.yaml

@@ -40,7 +40,6 @@ jobs:
       matrix:
         project:
           - chromium
-        shard: [1, 2, 3, 4]
     if: |
       ((github.event_name == 'pull_request' && ! github.event.pull_request.head.repo.fork && github.event.pull_request.user.login != 'dependabot[bot]' && ! contains(github.event.pull_request.labels.*.name, 'safe-to-test')) ||
       (github.event_name == 'pull_request_target' && contains(github.event.pull_request.labels.*.name, 'safe-to-test'))) && contains(github.event.pull_request.labels.*.name, 'safe-to-e2e')
@@ -63,21 +62,19 @@ jobs:
         uses: pnpm/action-setup@v6
         with:
           version: 10
+      - name: python-install
+        run: |
+          cd tests && uv sync
       - name: pnpm-install
         run: |
           cd tests/e2e && pnpm install --frozen-lockfile
       - name: playwright-browsers
-        id: playwright-browsers
-        background: true
         run: |
           docker create --name pw mcr.microsoft.com/playwright:v1.57.0-noble
           docker cp pw:/ms-playwright "$RUNNER_TEMP/ms-playwright"
           docker rm pw
           echo "PLAYWRIGHT_BROWSERS_PATH=$RUNNER_TEMP/ms-playwright" >> "$GITHUB_ENV"
           cd tests/e2e && pnpm playwright install-deps ${{ matrix.project }}
-      - name: python-install
-        run: |
-          cd tests && uv sync
       # Restore-only: the cacheci workflow owns cache saves. Seeds the
       # BuildKit cache mounts so the in-test image build is incremental.
       - name: restore
@@ -109,12 +106,10 @@ jobs:
             --basetemp=./tmp/ \
             -vv --reuse --with-web \
             e2e/bootstrap/setup.py::test_setup
-      - name: wait-playwright-browsers
-        wait: playwright-browsers
       - name: playwright-test
         run: |
           cd tests/e2e && \
-            pnpm playwright test --project=${{ matrix.project }} --shard=${{ matrix.shard }}/4
+            pnpm playwright test --project=${{ matrix.project }}
       - name: teardown-stack
         if: always()
         run: |
@@ -127,6 +122,6 @@ jobs:
         if: always()
         uses: actions/upload-artifact@v4
         with:
-          name: playwright-artifacts-${{ matrix.project }}-${{ matrix.shard }}
+          name: playwright-artifacts-${{ matrix.project }}
           path: tests/e2e/artifacts/
           retention-days: 5

.github/workflows/goci.yaml

@@ -67,7 +67,7 @@ jobs:
         with:
           go-version: "1.24"
       - name: check-semconv-generated-files
-        run: make semconv-check
+        run: go run ./scripts/semconv -check
   build:
     if: |
       github.event_name == 'merge_group' ||

.github/workflows/integrationci.yaml

@@ -38,6 +38,7 @@ jobs:
       fail-fast: false
       matrix:
         suite:
+          - alerts
           - alertmanager
           - alertmanagerrotation
           - basepath
@@ -63,12 +64,10 @@ jobs:
           - querierauthz
           - role
           - rootuser
-          - ruler
           - savedview
           - semconvfamilies
           - serviceaccount
           - spanmapper
-          - tracedetail
           - querier_json_body
           - querier_skip_resource_fingerprint
           - ttl

Makefile

@@ -262,10 +262,6 @@ py-clean: ## Clear all pycache and pytest cache from tests directory recursively
 semconv-generate: ## Regenerate semantic-convention families for Go and TypeScript
 	@go run ./scripts/semconv
 
-.PHONY: semconv-check
-semconv-check: ## Fail if the generated semantic-convention files are stale
-	@go run ./scripts/semconv -check
-
 .PHONY: gen-mocks
 gen-mocks:
 	@echo ">> Generating mocks"

docs/contributing/go/authz.md

@@ -121,7 +121,7 @@ The pieces:
 - **`ResourceDef`** — declares the resource, verb, audit category, how to extract the instance ID, and how to turn that ID into selectors. ID extractors live in [pkg/types/coretypes/extractor.go](/pkg/types/coretypes/extractor.go): `PathParam("id")`, `BodyJSONPath("data.id")`, `BodyJSONArray("ids")`, and `ResponseJSONPath("data.id")` for IDs only known after the handler runs (e.g. `create`).
 - **`SecuritySchemes`** — advertises the required scope (`resource.Scope(verb)`, e.g. `serviceaccount:create`) in the OpenAPI spec.
 
-For routes that link two resources, use `AttachDetachSiblingResourceDef` (both sides are authz-checked, e.g. attaching a role to a service account requires `attach` on **both** the service account and the role). When a side's ids come from a list extractor (`BodyJSONArray` or a custom `ResourceIDsExtractor`) and that list resolves to nothing at request time, there is nothing to link: the def resolves to no resources, so no check runs and no audit event is emitted (e.g. inviting a user with an empty `userRoles`). A single-id side (`OneID`) always resolves to exactly one id and fails closed when it is empty. For parent-child routes (e.g. creating an API key under a service account), both sides are checked too, but with different verbs: declare a `BasicResourceDef` checking the child with `create`/`delete`, alongside an `AttachDetachParentChildResourceDef` checking the parent with `attach`/`detach` (within that def the child is only recorded for audit) — see the `/api/v1/service_accounts/{id}/keys` route in [pkg/apiserver/signozapiserver/serviceaccount.go](/pkg/apiserver/signozapiserver/serviceaccount.go).
+For routes that link two resources, use `AttachDetachSiblingResourceDef` (both sides are authz-checked, e.g. attaching a role to a service account requires `attach` on **both** the service account and the role). For parent-child routes (e.g. creating an API key under a service account), both sides are checked too, but with different verbs: declare a `BasicResourceDef` checking the child with `create`/`delete`, alongside an `AttachDetachParentChildResourceDef` checking the parent with `attach`/`detach` (within that def the child is only recorded for audit) — see the `/api/v1/service_accounts/{id}/keys` route in [pkg/apiserver/signozapiserver/serviceaccount.go](/pkg/apiserver/signozapiserver/serviceaccount.go).
 
 Prefer `CheckResources` with a `ResourceDef` for anything resource-shaped. The older coarse gates `ViewAccess`/`EditAccess`/`AdminAccess` only check "does the caller hold one of these roles" and give up per-resource granularity; `OpenAccess` performs no authorization (authentication still applies); `CheckWithoutClaims` serves anonymous routes such as public dashboards.
 

docs/contributing/go/handler.md

@@ -179,7 +179,6 @@ The `handler.New` function ties the HTTP handler to OpenAPI metadata via `OpenAP
 - **SuccessStatusCode**: The HTTP status for successful responses (for example, `http.StatusOK`, `http.StatusCreated`, `http.StatusNoContent`).
 - **ErrorStatusCodes**: Additional error status codes beyond the standard ones automatically added by `handler.New`.
 - **SecuritySchemes**: Auth mechanisms and scopes required by the operation.
-- **Stability**: Maturity marker (`handler.StabilityDevelopment`, `handler.StabilityAlpha`, `handler.StabilityBeta`, `handler.StabilityStable`, the OpenTelemetry Collector levels) emitted as the `x-signoz-stability` extension on every operation. Unset is emitted as `alpha`.
 
 The generic handler:
 

docs/contributing/query-range.md

@@ -84,9 +84,9 @@ A storage answers four questions and nothing else:
 | WhenAbsent | Absent row reads | Positive filter | Raw select | Multi-candidate column | Field keys |
 |---|---|---|---|---|---|
 | `AlwaysPresent` | a real value | no guard | no guard | no branch, ends the candidate list | table columns |
-| `AbsentIsSentinel` | `''`, 0, false, and that is not a value | exists guard | exists guard | presence branch | map attributes, cast JSON paths, string families of such members |
+| `AbsentIsSentinel` | `''`, 0, false, and that is not a value | exists guard | exists guard | presence branch | map attributes, cast JSON paths, string families |
 | `AbsentIsNull` | NULL | no guard | no guard | presence branch | multi-era folds, body JSON paths, numeric families |
-| `AbsentIsValue` | `''`, and that is the keyless contract | no guard | no guard | no presence branch | metrics labels, rule state history labels, and families of such members |
+| `AbsentIsValue` | `''`, and that is the keyless contract | no guard | no guard | no presence branch | metrics labels, rule state history labels |
 
 ### The generic layer
 
@@ -109,7 +109,7 @@ The functions, from the outside in:
 | `RejectsBodyFunction(traits, operator)` | Runs before resolution. A storage without body functions (`has`, `hasAny`, `hasAll`, `hasToken`, `search`) errors. The fingerprint side of a split skips the term, because the main query evaluates it. After resolution, `Condition` errors when `has`, `hasAny`, `hasAll`, or `hasToken` lands on a map-backed key (resource, attribute, scope), before the split can drop it. |
 | `SharedCondition(...)` | The `Compile` of every storage without its own condition language: `LogicalRead`, the shared data-type collision cast, `OperatorCondition`, then the guard rule. |
 | `OperatorCondition(...)` | The operator switch over an already cast read. A storage with its own cast policy composes with it. |
-| `LogicalRead(...)` | The only place family expressions are built. A single-member field reads through its member. A family merges the member reads, current member first: `COALESCE(NULLIF(m1, ''), NULLIF(m2, ''), '')` for strings, `multiIf` with a NULL tail for numbers. It ORs the member presence tests. A row without any member reads what the tail of the merge reads. When every member reads its sentinel as a value, so does the family. A member with a value map reads through `TransformRead`. `NOT EXISTS` is the read's `Absence`, the storage's own negated form. |
+| `LogicalRead(...)` | The only place family expressions are built. A single-member field reads through its member. A family merges the member reads, current member first: `COALESCE(NULLIF(m1, ''), NULLIF(m2, ''), '')` for strings, `multiIf` with a NULL tail for numbers. It ORs the member presence tests. A row without any member reads what the tail of the merge reads. A member with a value map reads through `TransformRead`. `NOT EXISTS` is the read's `Absence`, the storage's own negated form. |
 
 ### A resolved key
 

ee/modules/cloudintegration/implcloudintegration/module.go

@@ -183,52 +183,32 @@ func (module *module) AgentCheckIn(ctx context.Context, orgID valuer.UUID, provi
 		return nil, errors.New(errors.TypeAlreadyExists, cloudintegrationtypes.ErrCodeCloudIntegrationAlreadyConnected, errMessage)
 	}
 
-	storableAccount, err := module.store.GetAccountByID(ctx, orgID, req.CloudIntegrationID, provider)
+	account, err := module.store.GetAccountByID(ctx, orgID, req.CloudIntegrationID, provider)
 	if err != nil {
 		return nil, err
 	}
 
-	account, err := cloudintegrationtypes.NewAccountFromStorable(storableAccount)
-	if err != nil {
-		return nil, err
-	}
-
-	syncState := account.NextSyncState(req.SyncedVersion)
-
 	// If account has been removed (disconnected), return a minimal response with empty integration config.
+	// The agent uses this response to clean up resources
 	if account.RemovedAt != nil {
-		// Heartbeat stays frozen after removal, only the sync state is updated.
-		if account.AgentReport != nil && syncState != nil {
-			account.UpdateSyncState(syncState)
-
-			storableAccount, err = cloudintegrationtypes.NewStorableCloudIntegration(account)
-			if err != nil {
-				return nil, err
-			}
-
-			err = module.store.UpdateAgentReport(ctx, storableAccount)
-			if err != nil {
-				return nil, err
-			}
-		}
-
 		return cloudintegrationtypes.NewAgentCheckInResponse(
 			req.ProviderAccountID,
 			account.ID.StringValue(),
 			new(cloudintegrationtypes.ProviderIntegrationConfig),
 			account.RemovedAt,
-			syncState,
 		), nil
 	}
 
-	account.UpdateAgentReport(&req.ProviderAccountID, cloudintegrationtypes.NewAgentReport(req.Data, syncState))
+	// update account with cloud provider account id and agent report (heartbeat)
+	account.Update(&req.ProviderAccountID, cloudintegrationtypes.NewAgentReport(req.Data))
 
-	storableAccount, err = cloudintegrationtypes.NewStorableCloudIntegration(account)
+	err = module.store.UpdateAccount(ctx, account)
 	if err != nil {
 		return nil, err
 	}
 
-	err = module.store.UpdateAgentReport(ctx, storableAccount)
+	// Get account as domain object for config access (enabled regions, etc.)
+	domainAccount, err := cloudintegrationtypes.NewAccountFromStorable(account)
 	if err != nil {
 		return nil, err
 	}
@@ -243,7 +223,8 @@ func (module *module) AgentCheckIn(ctx context.Context, orgID valuer.UUID, provi
 		return nil, err
 	}
 
-	integrationConfig, err := cloudProvider.BuildIntegrationConfig(ctx, account, storedServices)
+	// Delegate integration config building entirely to the provider module
+	integrationConfig, err := cloudProvider.BuildIntegrationConfig(ctx, domainAccount, storedServices)
 	if err != nil {
 		return nil, err
 	}
@@ -253,7 +234,6 @@ func (module *module) AgentCheckIn(ctx context.Context, orgID valuer.UUID, provi
 		account.ID.StringValue(),
 		integrationConfig,
 		account.RemovedAt,
-		syncState,
 	), nil
 }
 

ee/sqlstore/postgressqlstore/formatter.go

@@ -23,15 +23,6 @@ func (f *formatter) JSONExtractString(column, path string) []byte {
 	return append(f.TextToJsonColumn(column), ops...)
 }
 
-func (f *formatter) JSONExtractMapValue(column, mapField, key string) []byte {
-	sql := f.TextToJsonColumn(column)
-	sql = append(sql, "->"...)
-	sql = schema.Append(f.bunf, sql, mapField)
-	sql = append(sql, "->>"...)
-	sql = schema.Append(f.bunf, sql, key)
-	return sql
-}
-
 func (f *formatter) JSONType(column, path string) []byte {
 	var sql []byte
 	sql = append(sql, "jsonb_typeof("...)

ee/sqlstore/postgressqlstore/formatter_test.go

@@ -55,67 +55,6 @@ func TestJSONExtractString(t *testing.T) {
 	}
 }
 
-func TestJSONExtractMapValue(t *testing.T) {
-	tests := []struct {
-		name     string
-		column   string
-		mapField string
-		key      string
-		expected string
-	}{
-		{
-			name:     "PlainKey",
-			column:   "data",
-			mapField: "labels",
-			key:      "team",
-			expected: `"data"::jsonb->'labels'->>'team'`,
-		},
-		{
-			name:     "DottedKey_OneMapEntry",
-			column:   "data",
-			mapField: "labels",
-			key:      "k8s.cluster",
-			expected: `"data"::jsonb->'labels'->>'k8s.cluster'`,
-		},
-		{
-			name:     "SingleQuoteInKey_Doubled",
-			column:   "data",
-			mapField: "labels",
-			key:      "o'brien",
-			expected: `"data"::jsonb->'labels'->>'o''brien'`,
-		},
-		{
-			name:     "BackslashInKey_Literal",
-			column:   "data",
-			mapField: "labels",
-			key:      `a\b`,
-			expected: `"data"::jsonb->'labels'->>'a\b'`,
-		},
-		{
-			name:     "DoubleQuoteInKey_Literal",
-			column:   "data",
-			mapField: "labels",
-			key:      `a"b`,
-			expected: `"data"::jsonb->'labels'->>'a"b'`,
-		},
-		{
-			name:     "QualifiedColumn",
-			column:   "rule.data",
-			mapField: "labels",
-			key:      "severity",
-			expected: `"rule"."data"::jsonb->'labels'->>'severity'`,
-		},
-	}
-
-	for _, tt := range tests {
-		t.Run(tt.name, func(t *testing.T) {
-			f := newFormatter(pgdialect.New())
-			got := string(f.JSONExtractMapValue(tt.column, tt.mapField, tt.key))
-			assert.Equal(t, tt.expected, got)
-		})
-	}
-}
-
 func TestJSONType(t *testing.T) {
 	tests := []struct {
 		name     string

frontend/__mocks__/uplotMock.ts

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

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

@@ -33,6 +33,7 @@
 	"NOT_FOUND": "SigNoz | Page Not Found",
 	"LOGS": "SigNoz | Logs",
 	"LOGS_EXPLORER": "SigNoz | Logs Explorer",
+	"LIVE_LOGS": "SigNoz | Live Logs",
 	"HOME_PAGE": "Open source Observability Platform | SigNoz",
 	"PASSWORD_RESET": "SigNoz | Password Reset",
 	"LIST_LICENSES": "SigNoz | List of Licenses",

frontend/public/locales/en/titles.json

@@ -42,6 +42,7 @@
 	"NOT_FOUND": "SigNoz | Page Not Found",
 	"LOGS": "SigNoz | Logs",
 	"LOGS_EXPLORER": "SigNoz | Logs Explorer",
+	"LIVE_LOGS": "SigNoz | Live Logs",
 	"LOGS_PIPELINES": "SigNoz | Logs Pipelines",
 	"HOME_PAGE": "Open source Observability Platform | SigNoz",
 	"PASSWORD_RESET": "SigNoz | Password Reset",

frontend/scripts/story-shots.mjs

@@ -417,7 +417,7 @@ for (const theme of themes.length ? themes : [null]) {
 						break;
 					}
 
-					height = Math.ceil(needed);
+					height = needed;
 					await page.setViewportSize({ width: Number(opts.width), height });
 					await page.waitForTimeout(Number(opts.settle));
 				}

frontend/src/AppRoutes/__tests__/Private.test.tsx

@@ -300,6 +300,14 @@ describe('PrivateRoute', () => {
 			);
 		});
 
+		it('should redirect /logs-explorer/live to /logs/logs-explorer/live', () => {
+			renderPrivateRoute({ initialRoute: '/logs-explorer/live' });
+
+			expect(screen.getByTestId('location-display')).toHaveTextContent(
+				'/logs/logs-explorer/live',
+			);
+		});
+
 		it('should redirect /logs-save-views to /logs/saved-views', () => {
 			renderPrivateRoute({ initialRoute: '/logs-save-views' });
 
@@ -1588,6 +1596,7 @@ describe('PrivateRoute', () => {
 			// route definition comes last, and both keys are authz-aware either way.
 			LOGS: { path: ROUTES.LOGS, deniedRoles: DENIED_ROLES },
 			LOGS_EXPLORER: { path: ROUTES.LOGS_EXPLORER, deniedRoles: DENIED_ROLES },
+			LIVE_LOGS: { path: ROUTES.LIVE_LOGS, deniedRoles: DENIED_ROLES },
 			METRICS_EXPLORER: {
 				path: ROUTES.METRICS_EXPLORER,
 				deniedRoles: DENIED_ROLES,

frontend/src/AppRoutes/index.tsx

@@ -12,14 +12,13 @@ import { CmdKPalette } from 'components/cmdKPalette/cmdKPalette';
 import NotFound from 'components/NotFound';
 import { ShiftHoldOverlayController } from 'components/ShiftOverlay/ShiftHoldOverlayController';
 import Spinner from 'components/Spinner';
+import { FeatureKeys } from 'constants/features';
 import { LOCALSTORAGE } from 'constants/localStorage';
 import ROUTES from 'constants/routes';
 import AppLayout from 'container/AppLayout';
 import Hex from 'crypto-js/enc-hex';
 import HmacSHA256 from 'crypto-js/hmac-sha256';
 import { useIsAIAssistantEnabled } from 'hooks/useIsAIAssistantEnabled';
-import { useSavedViewEnabled } from 'hooks/useSavedViewEnabled';
-import { ChatSupportState, useChatSupport } from 'hooks/useChatSupport';
 import { useIsDarkMode } from 'hooks/useDarkMode';
 import { useGetTenantLicense } from 'hooks/useGetTenantLicense';
 import { StatusCodes } from 'http-status-codes';
@@ -59,6 +58,7 @@ function App(): JSX.Element {
 		isFetchingActiveLicense,
 		activeLicenseFetchError,
 		userFetchError,
+		featureFlagsFetchError,
 		isLoggedIn: isLoggedInState,
 		featureFlags,
 		org,
@@ -66,8 +66,6 @@ function App(): JSX.Element {
 	} = useAppContext();
 	const [routes, setRoutes] = useState<AppRoutes[]>(defaultRoutes);
 	const isAIAssistantEnabled = useIsAIAssistantEnabled();
-	const isSavedViewEnabled = useSavedViewEnabled();
-	const chatSupport = useChatSupport();
 
 	const { hostname } = window.location;
 	const [pathname, setPathname] = useState(history.location.pathname);
@@ -255,9 +253,7 @@ function App(): JSX.Element {
 	}, [isDarkMode]);
 
 	useEffect(() => {
-		// The bottom strip carries Support, so the floating bubble goes entirely.
 		if (
-			isSavedViewEnabled ||
 			pathname === ROUTES.ONBOARDING ||
 			pathname.startsWith('/public/dashboard/') ||
 			pathname === '/ai-assistant' ||
@@ -267,32 +263,71 @@ function App(): JSX.Element {
 		} else {
 			window.Pylon?.('showChatBubble');
 		}
-	}, [pathname, isSavedViewEnabled]);
+	}, [pathname]);
 
-	// Identity for the Pylon widget. Whether this user gets Pylon at all is
-	// `useChatSupport`'s call — this only fills in who they are.
+	// eslint-disable-next-line sonarjs/cognitive-complexity
 	useEffect(() => {
-		if (chatSupport !== ChatSupportState.Pylon) {
-			return;
+		// feature flag shouldn't be loading and featureFlags or fetchError any one of this should be true indicating that req is complete
+		// licenses should also be present. there is no check for licenses for loading and error as that is mandatory if not present then routing
+		// to something went wrong which would ideally need a reload.
+		if (
+			!isFetchingFeatureFlags &&
+			(featureFlags || featureFlagsFetchError) &&
+			activeLicense &&
+			trialInfo
+		) {
+			let isChatSupportEnabled = false;
+			let isPremiumSupportEnabled = false;
+			if (featureFlags && featureFlags.length > 0) {
+				isChatSupportEnabled =
+					featureFlags.find((flag) => flag.name === FeatureKeys.CHAT_SUPPORT)
+						?.active || false;
+
+				isPremiumSupportEnabled =
+					featureFlags.find((flag) => flag.name === FeatureKeys.PREMIUM_SUPPORT)
+						?.active || false;
+			}
+			const showAddCreditCardModal =
+				!isPremiumSupportEnabled && !trialInfo?.trialConvertedToSubscription;
+
+			if (
+				isLoggedInState &&
+				isChatSupportEnabled &&
+				!showAddCreditCardModal &&
+				(isCloudUser || isEnterpriseSelfHostedUser) &&
+				window.signozBootData?.settings?.pylon?.enabled
+			) {
+				const email = user.email || '';
+				const secret = window.signozBootData?.settings?.pylon?.identitySecret || '';
+				let emailHash = '';
+
+				if (email && secret) {
+					emailHash = HmacSHA256(email, Hex.parse(secret)).toString(Hex);
+				}
+
+				window.pylon = {
+					chat_settings: {
+						app_id: window.signozBootData?.settings?.pylon?.appId,
+						email: user.email,
+						name: user.displayName || user.email,
+						email_hash: emailHash,
+					},
+				};
+			}
 		}
-
-		const email = user.email || '';
-		const secret = window.signozBootData?.settings?.pylon?.identitySecret || '';
-		let emailHash = '';
-
-		if (email && secret) {
-			emailHash = HmacSHA256(email, Hex.parse(secret)).toString(Hex);
-		}
-
-		window.pylon = {
-			chat_settings: {
-				app_id: window.signozBootData?.settings?.pylon?.appId,
-				email: user.email,
-				name: user.displayName || user.email,
-				email_hash: emailHash,
-			},
-		};
-	}, [chatSupport, user]);
+	}, [
+		isLoggedInState,
+		user,
+		pathname,
+		trialInfo?.trialConvertedToSubscription,
+		featureFlags,
+		isFetchingFeatureFlags,
+		featureFlagsFetchError,
+		activeLicense,
+		trialInfo,
+		isCloudUser,
+		isEnterpriseSelfHostedUser,
+	]);
 
 	useEffect(() => {
 		if (!isFetchingUser && isCloudUser && user && user.email) {

frontend/src/AppRoutes/pageComponents.ts

@@ -154,6 +154,10 @@ export const Logs = Loadable(
 	() => import(/* webpackChunkName: "Logs" */ 'pages/LogsModulePage'),
 );
 
+export const LiveLogs = Loadable(
+	() => import(/* webpackChunkName: "Live Logs" */ 'pages/LiveLogs'),
+);
+
 export const PipelinePage = Loadable(
 	() => import(/* webpackChunkName: "Pipelines" */ 'pages/LogsModulePage'),
 );

frontend/src/AppRoutes/routes.ts

@@ -23,6 +23,7 @@ import {
 	LicensePage,
 	ListAllALertsPage,
 	LLMObservabilityPage,
+	LiveLogs,
 	Login,
 	Logs,
 	LogsIndexToFields,
@@ -281,6 +282,13 @@ const routes: AppRoutes[] = [
 		key: 'LOGS',
 		isPrivate: true,
 	},
+	{
+		path: ROUTES.LIVE_LOGS,
+		exact: true,
+		component: LiveLogs,
+		key: 'LIVE_LOGS',
+		isPrivate: true,
+	},
 	{
 		path: ROUTES.LOGS_PIPELINES,
 		exact: true,
@@ -513,6 +521,7 @@ export const LIST_LICENSES: AppRoutes = {
 export const oldNewRoutesMapping: Record<string, string> = {
 	'/pipelines': '/logs/pipelines',
 	'/logs-explorer': '/logs/logs-explorer',
+	'/logs-explorer/live': '/logs/logs-explorer/live',
 	'/logs-save-views': '/logs/saved-views',
 	'/traces-save-views': '/traces/saved-views',
 	'/settings/access-tokens': '/settings/service-accounts',

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

@@ -19,9 +19,7 @@ import type {
 
 import type {
 	CreateRule201,
-	CreateRuleView201,
 	DeleteRuleByIDPathParameters,
-	DeleteRuleViewPathParameters,
 	GetRuleByID200,
 	GetRuleByIDPathParameters,
 	GetRuleHistoryFilterKeys200,
@@ -42,19 +40,13 @@ import type {
 	GetRuleHistoryTopContributors200,
 	GetRuleHistoryTopContributorsParams,
 	GetRuleHistoryTopContributorsPathParameters,
-	ListRuleViews200,
 	ListRules200,
-	ListRulesV3200,
-	ListRulesV3Params,
 	PatchRuleByID200,
 	PatchRuleByIDPathParameters,
 	RenderErrorResponseDTO,
 	RuletypesPostableRuleDTO,
-	RuletypesPostableRuleViewDTO,
 	TestRule200,
 	UpdateRuleByIDPathParameters,
-	UpdateRuleView200,
-	UpdateRuleViewPathParameters,
 } from '../sigNoz.schemas';
 
 import { GeneratedAPIInstance } from '../../../generatedAPIInstance';
@@ -81,353 +73,7 @@ const withQueryKey = <T extends object, K>(
 };
 
 /**
- * Returns every saved view in the calling user's org. Saved views are shared org-wide.
- * @summary List rule saved views
- */
-export const listRuleViews = (signal?: AbortSignal) => {
-	return GeneratedAPIInstance<ListRuleViews200>({
-		url: `/api/v2/rule_views`,
-		method: 'GET',
-		signal,
-	});
-};
-
-export const getListRuleViewsQueryKey = () => {
-	return [`/api/v2/rule_views`] as const;
-};
-
-export const getListRuleViewsQueryOptions = <
-	TData = Awaited<ReturnType<typeof listRuleViews>>,
-	TError = ErrorType<RenderErrorResponseDTO>,
->(options?: {
-	query?: UseQueryOptions<
-		Awaited<ReturnType<typeof listRuleViews>>,
-		TError,
-		TData
-	>;
-}) => {
-	const { query: queryOptions } = options ?? {};
-
-	const queryKey = queryOptions?.queryKey ?? getListRuleViewsQueryKey();
-
-	const queryFn: QueryFunction<Awaited<ReturnType<typeof listRuleViews>>> = ({
-		signal,
-	}) => listRuleViews(signal);
-
-	return { queryKey, queryFn, ...queryOptions } as UseQueryOptions<
-		Awaited<ReturnType<typeof listRuleViews>>,
-		TError,
-		TData
-	> & { queryKey: QueryKey };
-};
-
-export type ListRuleViewsQueryResult = NonNullable<
-	Awaited<ReturnType<typeof listRuleViews>>
->;
-export type ListRuleViewsQueryError = ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary List rule saved views
- */
-
-export function useListRuleViews<
-	TData = Awaited<ReturnType<typeof listRuleViews>>,
-	TError = ErrorType<RenderErrorResponseDTO>,
->(options?: {
-	query?: UseQueryOptions<
-		Awaited<ReturnType<typeof listRuleViews>>,
-		TError,
-		TData
-	>;
-}): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
-	const queryOptions = getListRuleViewsQueryOptions(options);
-
-	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
-		queryKey: QueryKey;
-	};
-
-	return withQueryKey(query, queryOptions.queryKey);
-}
-
-/**
- * @summary List rule saved views
- */
-export const invalidateListRuleViews = async (
-	queryClient: QueryClient,
-	options?: InvalidateOptions,
-): Promise<QueryClient> => {
-	await queryClient.invalidateQueries(
-		{ queryKey: getListRuleViewsQueryKey() },
-		options,
-	);
-
-	return queryClient;
-};
-
-/**
- * Persists the calling user's rule listing state (query, states, sort, order) as a named, reusable view shared across the org.
- * @summary Create rule saved view
- */
-export const createRuleView = (
-	ruletypesPostableRuleViewDTO?: BodyType<RuletypesPostableRuleViewDTO>,
-	signal?: AbortSignal,
-) => {
-	return GeneratedAPIInstance<CreateRuleView201>({
-		url: `/api/v2/rule_views`,
-		method: 'POST',
-		headers: { 'Content-Type': 'application/json' },
-		data: ruletypesPostableRuleViewDTO,
-		signal,
-	});
-};
-
-export const getCreateRuleViewMutationOptions = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown,
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof createRuleView>>,
-		TError,
-		{ data?: BodyType<RuletypesPostableRuleViewDTO> },
-		TContext
-	>;
-}): UseMutationOptions<
-	Awaited<ReturnType<typeof createRuleView>>,
-	TError,
-	{ data?: BodyType<RuletypesPostableRuleViewDTO> },
-	TContext
-> => {
-	const mutationKey = ['createRuleView'];
-	const { mutation: mutationOptions } = options
-		? options.mutation &&
-			'mutationKey' in options.mutation &&
-			options.mutation.mutationKey
-			? options
-			: { ...options, mutation: { ...options.mutation, mutationKey } }
-		: { mutation: { mutationKey } };
-
-	const mutationFn: MutationFunction<
-		Awaited<ReturnType<typeof createRuleView>>,
-		{ data?: BodyType<RuletypesPostableRuleViewDTO> }
-	> = (props) => {
-		const { data } = props ?? {};
-
-		return createRuleView(data);
-	};
-
-	return { mutationFn, ...mutationOptions };
-};
-
-export type CreateRuleViewMutationResult = NonNullable<
-	Awaited<ReturnType<typeof createRuleView>>
->;
-export type CreateRuleViewMutationBody =
-	| BodyType<RuletypesPostableRuleViewDTO>
-	| undefined;
-export type CreateRuleViewMutationError = ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary Create rule saved view
- */
-export const useCreateRuleView = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown,
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof createRuleView>>,
-		TError,
-		{ data?: BodyType<RuletypesPostableRuleViewDTO> },
-		TContext
-	>;
-}): UseMutationResult<
-	Awaited<ReturnType<typeof createRuleView>>,
-	TError,
-	{ data?: BodyType<RuletypesPostableRuleViewDTO> },
-	TContext
-> => {
-	return useMutation(getCreateRuleViewMutationOptions(options));
-};
-/**
- * Removes a saved view. Saved views are shared org-wide. Deleting a non-existent view returns 404.
- * @summary Delete rule saved view
- */
-export const deleteRuleView = (
-	{ id }: DeleteRuleViewPathParameters,
-	signal?: AbortSignal,
-) => {
-	return GeneratedAPIInstance<void>({
-		url: `/api/v2/rule_views/${id}`,
-		method: 'DELETE',
-		signal,
-	});
-};
-
-export const getDeleteRuleViewMutationOptions = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown,
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof deleteRuleView>>,
-		TError,
-		{ pathParams: DeleteRuleViewPathParameters },
-		TContext
-	>;
-}): UseMutationOptions<
-	Awaited<ReturnType<typeof deleteRuleView>>,
-	TError,
-	{ pathParams: DeleteRuleViewPathParameters },
-	TContext
-> => {
-	const mutationKey = ['deleteRuleView'];
-	const { mutation: mutationOptions } = options
-		? options.mutation &&
-			'mutationKey' in options.mutation &&
-			options.mutation.mutationKey
-			? options
-			: { ...options, mutation: { ...options.mutation, mutationKey } }
-		: { mutation: { mutationKey } };
-
-	const mutationFn: MutationFunction<
-		Awaited<ReturnType<typeof deleteRuleView>>,
-		{ pathParams: DeleteRuleViewPathParameters }
-	> = (props) => {
-		const { pathParams } = props ?? {};
-
-		return deleteRuleView(pathParams);
-	};
-
-	return { mutationFn, ...mutationOptions };
-};
-
-export type DeleteRuleViewMutationResult = NonNullable<
-	Awaited<ReturnType<typeof deleteRuleView>>
->;
-
-export type DeleteRuleViewMutationError = ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary Delete rule saved view
- */
-export const useDeleteRuleView = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown,
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof deleteRuleView>>,
-		TError,
-		{ pathParams: DeleteRuleViewPathParameters },
-		TContext
-	>;
-}): UseMutationResult<
-	Awaited<ReturnType<typeof deleteRuleView>>,
-	TError,
-	{ pathParams: DeleteRuleViewPathParameters },
-	TContext
-> => {
-	return useMutation(getDeleteRuleViewMutationOptions(options));
-};
-/**
- * Replaces a saved view's name and data. Saved views are shared org-wide.
- * @summary Update rule saved view
- */
-export const updateRuleView = (
-	{ id }: UpdateRuleViewPathParameters,
-	ruletypesPostableRuleViewDTO?: BodyType<RuletypesPostableRuleViewDTO>,
-	signal?: AbortSignal,
-) => {
-	return GeneratedAPIInstance<UpdateRuleView200>({
-		url: `/api/v2/rule_views/${id}`,
-		method: 'PUT',
-		headers: { 'Content-Type': 'application/json' },
-		data: ruletypesPostableRuleViewDTO,
-		signal,
-	});
-};
-
-export const getUpdateRuleViewMutationOptions = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown,
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof updateRuleView>>,
-		TError,
-		{
-			pathParams: UpdateRuleViewPathParameters;
-			data?: BodyType<RuletypesPostableRuleViewDTO>;
-		},
-		TContext
-	>;
-}): UseMutationOptions<
-	Awaited<ReturnType<typeof updateRuleView>>,
-	TError,
-	{
-		pathParams: UpdateRuleViewPathParameters;
-		data?: BodyType<RuletypesPostableRuleViewDTO>;
-	},
-	TContext
-> => {
-	const mutationKey = ['updateRuleView'];
-	const { mutation: mutationOptions } = options
-		? options.mutation &&
-			'mutationKey' in options.mutation &&
-			options.mutation.mutationKey
-			? options
-			: { ...options, mutation: { ...options.mutation, mutationKey } }
-		: { mutation: { mutationKey } };
-
-	const mutationFn: MutationFunction<
-		Awaited<ReturnType<typeof updateRuleView>>,
-		{
-			pathParams: UpdateRuleViewPathParameters;
-			data?: BodyType<RuletypesPostableRuleViewDTO>;
-		}
-	> = (props) => {
-		const { pathParams, data } = props ?? {};
-
-		return updateRuleView(pathParams, data);
-	};
-
-	return { mutationFn, ...mutationOptions };
-};
-
-export type UpdateRuleViewMutationResult = NonNullable<
-	Awaited<ReturnType<typeof updateRuleView>>
->;
-export type UpdateRuleViewMutationBody =
-	| BodyType<RuletypesPostableRuleViewDTO>
-	| undefined;
-export type UpdateRuleViewMutationError = ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary Update rule saved view
- */
-export const useUpdateRuleView = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown,
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof updateRuleView>>,
-		TError,
-		{
-			pathParams: UpdateRuleViewPathParameters;
-			data?: BodyType<RuletypesPostableRuleViewDTO>;
-		},
-		TContext
-	>;
-}): UseMutationResult<
-	Awaited<ReturnType<typeof updateRuleView>>,
-	TError,
-	{
-		pathParams: UpdateRuleViewPathParameters;
-		data?: BodyType<RuletypesPostableRuleViewDTO>;
-	},
-	TContext
-> => {
-	return useMutation(getUpdateRuleViewMutationOptions(options));
-};
-/**
- * This endpoint lists all alert rules with their current evaluation state. Deprecated: use ListRulesV3, which supports filtering, sorting and pagination.
- * @deprecated
+ * This endpoint lists all alert rules with their current evaluation state
  * @summary List alert rules
  */
 export const listRules = (signal?: AbortSignal) => {
@@ -469,7 +115,6 @@ export type ListRulesQueryResult = NonNullable<
 export type ListRulesQueryError = ErrorType<RenderErrorResponseDTO>;
 
 /**
- * @deprecated
  * @summary List alert rules
  */
 
@@ -489,7 +134,6 @@ export function useListRules<
 }
 
 /**
- * @deprecated
  * @summary List alert rules
  */
 export const invalidateListRules = async (
@@ -1744,97 +1388,3 @@ export const useTestRule = <
 > => {
 	return useMutation(getTestRuleMutationOptions(options));
 };
-/**
- * Returns a page of alert rules with their current evaluation state, trimmed to the fields the list page renders. Supports a filter DSL (`query`), a repeated `states` filter applied after the state overlay, sort (`updated_at`/`created_at`/`name`/`state`/`severity`), order (`asc`/`desc`), and offset-based pagination (`limit`/`offset`). In the filter DSL, a non-reserved key is matched as a rule label directly (`team = infra`); a key that collides with a reserved keyword matches either interpretation (negative operators exclude both), and `labels.<key>` targets only the label. The response also carries the org's label pairs and the reserved filter keys for building filter suggestions.
- * @summary List alert rules (v3)
- */
-export const listRulesV3 = (
-	params?: ListRulesV3Params,
-	signal?: AbortSignal,
-) => {
-	return GeneratedAPIInstance<ListRulesV3200>({
-		url: `/api/v3/rules`,
-		method: 'GET',
-		params,
-		signal,
-	});
-};
-
-export const getListRulesV3QueryKey = (params?: ListRulesV3Params) => {
-	return [`/api/v3/rules`, ...(params ? [params] : [])] as const;
-};
-
-export const getListRulesV3QueryOptions = <
-	TData = Awaited<ReturnType<typeof listRulesV3>>,
-	TError = ErrorType<RenderErrorResponseDTO>,
->(
-	params?: ListRulesV3Params,
-	options?: {
-		query?: UseQueryOptions<
-			Awaited<ReturnType<typeof listRulesV3>>,
-			TError,
-			TData
-		>;
-	},
-) => {
-	const { query: queryOptions } = options ?? {};
-
-	const queryKey = queryOptions?.queryKey ?? getListRulesV3QueryKey(params);
-
-	const queryFn: QueryFunction<Awaited<ReturnType<typeof listRulesV3>>> = ({
-		signal,
-	}) => listRulesV3(params, signal);
-
-	return { queryKey, queryFn, ...queryOptions } as UseQueryOptions<
-		Awaited<ReturnType<typeof listRulesV3>>,
-		TError,
-		TData
-	> & { queryKey: QueryKey };
-};
-
-export type ListRulesV3QueryResult = NonNullable<
-	Awaited<ReturnType<typeof listRulesV3>>
->;
-export type ListRulesV3QueryError = ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary List alert rules (v3)
- */
-
-export function useListRulesV3<
-	TData = Awaited<ReturnType<typeof listRulesV3>>,
-	TError = ErrorType<RenderErrorResponseDTO>,
->(
-	params?: ListRulesV3Params,
-	options?: {
-		query?: UseQueryOptions<
-			Awaited<ReturnType<typeof listRulesV3>>,
-			TError,
-			TData
-		>;
-	},
-): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
-	const queryOptions = getListRulesV3QueryOptions(params, options);
-
-	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
-		queryKey: QueryKey;
-	};
-
-	return withQueryKey(query, queryOptions.queryKey);
-}
-
-/**
- * @summary List alert rules (v3)
- */
-export const invalidateListRulesV3 = async (
-	queryClient: QueryClient,
-	params?: ListRulesV3Params,
-	options?: InvalidateOptions,
-): Promise<QueryClient> => {
-	await queryClient.invalidateQueries(
-		{ queryKey: getListRulesV3QueryKey(params) },
-		options,
-	);
-
-	return queryClient;
-};

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

@@ -104,9 +104,9 @@ export interface AlertmanagertypesChannelSlackFieldDTO {
 
 export interface AlertmanagertypesChannelSlackConfigDTO {
 	/**
-	 * @type array,null
+	 * @type array
 	 */
-	actions?: AlertmanagertypesChannelSlackActionDTO[] | null;
+	actions?: AlertmanagertypesChannelSlackActionDTO[];
 	/**
 	 * @type string
 	 * @format password
@@ -125,9 +125,9 @@ export interface AlertmanagertypesChannelSlackConfigDTO {
 	 */
 	fallback?: string;
 	/**
-	 * @type array,null
+	 * @type array
 	 */
-	fields?: AlertmanagertypesChannelSlackFieldDTO[] | null;
+	fields?: AlertmanagertypesChannelSlackFieldDTO[];
 	/**
 	 * @type string
 	 */
@@ -166,19 +166,13 @@ export interface AlertmanagertypesChannelConfigVariantGithubComSigNozSignozPkgTy
 export enum AlertmanagertypesChannelConfigVariantGithubComSigNozSignozPkgTypesAlertmanagertypesChannelEmailConfigDTOKind {
 	email = 'email',
 }
-export type AlertmanagertypesChannelEmailConfigDTOHeadersAnyOf = {
+export type AlertmanagertypesChannelEmailConfigDTOHeaders = {
 	[key: string]: string;
 };
 
-/**
- * @nullable
- */
-export type AlertmanagertypesChannelEmailConfigDTOHeaders =
-	AlertmanagertypesChannelEmailConfigDTOHeadersAnyOf | null;
-
 export interface AlertmanagertypesChannelEmailConfigDTO {
 	/**
-	 * @type object,null
+	 * @type object
 	 */
 	headers?: AlertmanagertypesChannelEmailConfigDTOHeaders;
 	/**
@@ -245,16 +239,10 @@ export interface AlertmanagertypesChannelConfigVariantGithubComSigNozSignozPkgTy
 export enum AlertmanagertypesChannelConfigVariantGithubComSigNozSignozPkgTypesAlertmanagertypesChannelPagerdutyConfigDTOKind {
 	pagerduty = 'pagerduty',
 }
-export type AlertmanagertypesChannelPagerdutyConfigDTODetailsAnyOf = {
+export type AlertmanagertypesChannelPagerdutyConfigDTODetails = {
 	[key: string]: string;
 };
 
-/**
- * @nullable
- */
-export type AlertmanagertypesChannelPagerdutyConfigDTODetails =
-	AlertmanagertypesChannelPagerdutyConfigDTODetailsAnyOf | null;
-
 export interface AlertmanagertypesChannelPagerdutyConfigDTO {
 	/**
 	 * @type string
@@ -277,7 +265,7 @@ export interface AlertmanagertypesChannelPagerdutyConfigDTO {
 	 */
 	description?: string;
 	/**
-	 * @type object,null
+	 * @type object
 	 */
 	details?: AlertmanagertypesChannelPagerdutyConfigDTODetails;
 	/**
@@ -319,16 +307,10 @@ export interface AlertmanagertypesChannelConfigVariantGithubComSigNozSignozPkgTy
 export enum AlertmanagertypesChannelConfigVariantGithubComSigNozSignozPkgTypesAlertmanagertypesChannelOpsgenieConfigDTOKind {
 	opsgenie = 'opsgenie',
 }
-export type AlertmanagertypesChannelOpsgenieConfigDTODetailsAnyOf = {
+export type AlertmanagertypesChannelOpsgenieConfigDTODetails = {
 	[key: string]: string;
 };
 
-/**
- * @nullable
- */
-export type AlertmanagertypesChannelOpsgenieConfigDTODetails =
-	AlertmanagertypesChannelOpsgenieConfigDTODetailsAnyOf | null;
-
 export interface AlertmanagertypesChannelOpsgenieConfigDTO {
 	/**
 	 * @type string
@@ -344,7 +326,7 @@ export interface AlertmanagertypesChannelOpsgenieConfigDTO {
 	 */
 	description?: string;
 	/**
-	 * @type object,null
+	 * @type object
 	 */
 	details?: AlertmanagertypesChannelOpsgenieConfigDTODetails;
 	/**
@@ -441,16 +423,10 @@ export interface AlertmanagertypesChannelConfigVariantGithubComSigNozSignozPkgTy
 export enum AlertmanagertypesChannelConfigVariantGithubComSigNozSignozPkgTypesAlertmanagertypesChannelJiraConfigDTOKind {
 	jira = 'jira',
 }
-export type AlertmanagertypesChannelJiraConfigDTOCustomFieldsAnyOf = {
+export type AlertmanagertypesChannelJiraConfigDTOCustomFields = {
 	[key: string]: unknown;
 };
 
-/**
- * @nullable
- */
-export type AlertmanagertypesChannelJiraConfigDTOCustomFields =
-	AlertmanagertypesChannelJiraConfigDTOCustomFieldsAnyOf | null;
-
 export interface AlertmanagertypesChannelJiraConfigDTO {
 	/**
 	 * @type string
@@ -458,7 +434,7 @@ export interface AlertmanagertypesChannelJiraConfigDTO {
 	 */
 	apiToken: string;
 	/**
-	 * @type object,null
+	 * @type object
 	 */
 	customFields?: AlertmanagertypesChannelJiraConfigDTOCustomFields;
 	/**
@@ -474,9 +450,9 @@ export interface AlertmanagertypesChannelJiraConfigDTO {
 	 */
 	issueType: string;
 	/**
-	 * @type array,null
+	 * @type array
 	 */
-	labels?: string[] | null;
+	labels?: string[];
 	/**
 	 * @type string
 	 */
@@ -567,23 +543,17 @@ export interface AlertmanagertypesChannelConfigVariantGithubComSigNozSignozPkgTy
 export enum AlertmanagertypesChannelConfigVariantGithubComSigNozSignozPkgTypesAlertmanagertypesChannelIncidentIOConfigDTOKind {
 	incidentio = 'incidentio',
 }
-export type AlertmanagertypesChannelIncidentIOConfigDTOMetadataAnyOf = {
+export type AlertmanagertypesChannelIncidentIOConfigDTOMetadata = {
 	[key: string]: string;
 };
 
-/**
- * @nullable
- */
-export type AlertmanagertypesChannelIncidentIOConfigDTOMetadata =
-	AlertmanagertypesChannelIncidentIOConfigDTOMetadataAnyOf | null;
-
 export interface AlertmanagertypesChannelIncidentIOConfigDTO {
 	/**
 	 * @type string
 	 */
 	description?: string;
 	/**
-	 * @type object,null
+	 * @type object
 	 */
 	metadata?: AlertmanagertypesChannelIncidentIOConfigDTOMetadata;
 	/**
@@ -3396,37 +3366,6 @@ export interface CloudintegrationtypesAWSServiceConfigDTO {
 	metrics?: CloudintegrationtypesAWSServiceMetricsConfigDTO;
 }
 
-export enum CloudintegrationtypesRegionStateDTO {
-	enabled = 'enabled',
-	disabled = 'disabled',
-}
-export interface CloudintegrationtypesRegionSyncStateDTO {
-	state: CloudintegrationtypesRegionStateDTO;
-}
-
-export type CloudintegrationtypesSyncStateDTORegions = {
-	[key: string]: CloudintegrationtypesRegionSyncStateDTO;
-};
-
-/**
- * @nullable
- */
-export type CloudintegrationtypesSyncStateDTO = {
-	/**
-	 * @type boolean
-	 */
-	inSync: boolean;
-	/**
-	 * @type object
-	 */
-	regions: CloudintegrationtypesSyncStateDTORegions;
-	/**
-	 * @type integer
-	 * @format int64
-	 */
-	version: number;
-} | null;
-
 export type CloudintegrationtypesAgentReportDTODataAnyOf = {
 	[key: string]: unknown;
 };
@@ -3445,7 +3384,6 @@ export type CloudintegrationtypesAgentReportDTO = {
 	 * @type object,null
 	 */
 	data: CloudintegrationtypesAgentReportDTOData;
-	syncState: CloudintegrationtypesSyncStateDTO | null;
 	/**
 	 * @type integer
 	 * @format int64
@@ -3874,7 +3812,6 @@ export interface CloudintegrationtypesGettableAgentCheckInDTO {
 	 * @format date-time
 	 */
 	removedAt: string | null;
-	syncState: CloudintegrationtypesSyncStateDTO | null;
 }
 
 export interface CloudintegrationtypesServiceMetadataDTO {
@@ -3945,10 +3882,6 @@ export interface CloudintegrationtypesPostableAgentCheckInDTO {
 	 * @type string
 	 */
 	providerAccountId?: string;
-	/**
-	 * @type integer,null
-	 */
-	syncedVersion?: number | null;
 }
 
 export interface CloudintegrationtypesStorableIntegrationDashboardDTO {
@@ -5291,87 +5224,6 @@ export interface DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDa
 	spec: DashboardtypesTextPanelSpecDTO;
 }
 
-export enum DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHeatmapPanelSpecDTOKind {
-	'signoz/HeatmapPanel' = 'signoz/HeatmapPanel',
-}
-export enum DashboardtypesHeatmapYScaleDTO {
-	auto = 'auto',
-	linear = 'linear',
-	log = 'log',
-	symlog = 'symlog',
-}
-export interface DashboardtypesHeatmapAxisDTO {
-	scale?: DashboardtypesHeatmapYScaleDTO;
-}
-
-export interface DashboardtypesHeatmapAxesDTO {
-	y?: DashboardtypesHeatmapAxisDTO;
-}
-
-export enum DashboardtypesHeatmapColorModeDTO {
-	palette = 'palette',
-	opacity = 'opacity',
-}
-export enum DashboardtypesHeatmapPaletteDTO {
-	ice = 'ice',
-	moss = 'moss',
-	rust = 'rust',
-	graphite = 'graphite',
-	ember = 'ember',
-	lagoon = 'lagoon',
-	orchid = 'orchid',
-	verdant = 'verdant',
-	lava = 'lava',
-	beacon = 'beacon',
-}
-export enum DashboardtypesHeatmapColorScaleDTO {
-	log = 'log',
-	sqrt = 'sqrt',
-	linear = 'linear',
-}
-export interface DashboardtypesHeatmapColorsDTO {
-	/**
-	 * @type string
-	 */
-	fill?: string;
-	/**
-	 * @type number,null
-	 */
-	maxCount?: number | null;
-	/**
-	 * @type number,null
-	 */
-	minCount?: number | null;
-	mode?: DashboardtypesHeatmapColorModeDTO;
-	palette?: DashboardtypesHeatmapPaletteDTO;
-	scale?: DashboardtypesHeatmapColorScaleDTO;
-	/**
-	 * @type integer
-	 */
-	steps?: number;
-}
-
-export interface DashboardtypesHeatmapChartAppearanceDTO {
-	colors?: DashboardtypesHeatmapColorsDTO;
-}
-
-export interface DashboardtypesHeatmapPanelSpecDTO {
-	axes?: DashboardtypesHeatmapAxesDTO;
-	chartAppearance?: DashboardtypesHeatmapChartAppearanceDTO;
-	formatting?: DashboardtypesPanelFormattingDTO;
-	legend?: DashboardtypesLegendDTO;
-	visualization?: DashboardtypesBasicVisualizationDTO;
-}
-
-export interface DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHeatmapPanelSpecDTO {
-	/**
-	 * @enum signoz/HeatmapPanel
-	 * @type string
-	 */
-	kind: DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHeatmapPanelSpecDTOKind;
-	spec: DashboardtypesHeatmapPanelSpecDTO;
-}
-
 export type DashboardtypesPanelPluginDTO =
 	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTimeSeriesPanelSpecDTO
 	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesBarChartPanelSpecDTO
@@ -5381,8 +5233,7 @@ export type DashboardtypesPanelPluginDTO =
 	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTablePanelSpecDTO
 	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHistogramPanelSpecDTO
 	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesListPanelSpecDTO
-	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTextPanelSpecDTO
-	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHeatmapPanelSpecDTO;
+	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTextPanelSpecDTO;
 
 export enum Querybuildertypesv5RequestTypeDTO {
 	scalar = 'scalar',
@@ -6308,7 +6159,6 @@ export enum DashboardtypesPanelPluginKindDTO {
 	'signoz/HistogramPanel' = 'signoz/HistogramPanel',
 	'signoz/ListPanel' = 'signoz/ListPanel',
 	'signoz/TextPanel' = 'signoz/TextPanel',
-	'signoz/HeatmapPanel' = 'signoz/HeatmapPanel',
 }
 /**
  * @nullable
@@ -10338,149 +10188,6 @@ export interface RuletypesGettableTestRuleDTO {
 	message?: string;
 }
 
-export interface RuletypesLabelPairDTO {
-	/**
-	 * @type string
-	 */
-	key: string;
-	/**
-	 * @type string
-	 */
-	value: string;
-}
-
-export enum RuletypesListOrderDTO {
-	asc = 'asc',
-	desc = 'desc',
-}
-export enum RuletypesListSortDTO {
-	updated_at = 'updated_at',
-	created_at = 'created_at',
-	name = 'name',
-	state = 'state',
-	severity = 'severity',
-}
-export type RuletypesListableRuleDTOLabels = { [key: string]: string };
-
-export enum RuletypesRuleTypeDTO {
-	threshold_rule = 'threshold_rule',
-	promql_rule = 'promql_rule',
-	anomaly_rule = 'anomaly_rule',
-}
-export interface RuletypesListableRuleDTO {
-	/**
-	 * @type string
-	 */
-	alert: string;
-	alertType: RuletypesAlertTypeDTO;
-	/**
-	 * @type string
-	 * @format date-time
-	 */
-	createdAt?: string;
-	/**
-	 * @type string
-	 */
-	createdBy?: string;
-	/**
-	 * @type string
-	 */
-	description?: string;
-	/**
-	 * @type boolean
-	 */
-	disabled?: boolean;
-	/**
-	 * @type string
-	 */
-	id: string;
-	/**
-	 * @type object
-	 */
-	labels?: RuletypesListableRuleDTOLabels;
-	ruleType: RuletypesRuleTypeDTO;
-	state: RuletypesAlertStateDTO;
-	/**
-	 * @type string
-	 * @format date-time
-	 */
-	updatedAt?: string;
-	/**
-	 * @type string
-	 */
-	updatedBy?: string;
-}
-
-export interface RuletypesRuleViewDataDTO {
-	order?: RuletypesListOrderDTO;
-	/**
-	 * @type string
-	 */
-	query?: string;
-	sort?: RuletypesListSortDTO;
-	/**
-	 * @type array
-	 */
-	states?: string[];
-	/**
-	 * @type string
-	 */
-	version: string;
-}
-
-export interface RuletypesRuleViewDTO {
-	/**
-	 * @type string
-	 * @format date-time
-	 */
-	createdAt?: string;
-	data: RuletypesRuleViewDataDTO;
-	/**
-	 * @type string
-	 */
-	id: string;
-	/**
-	 * @type string
-	 */
-	name: string;
-	/**
-	 * @type string
-	 */
-	orgId: string;
-	/**
-	 * @type string
-	 * @format date-time
-	 */
-	updatedAt?: string;
-}
-
-export interface RuletypesListableRuleViewsDTO {
-	/**
-	 * @type array
-	 */
-	views: RuletypesRuleViewDTO[];
-}
-
-export interface RuletypesListableRulesDTO {
-	/**
-	 * @type array
-	 */
-	labels: RuletypesLabelPairDTO[];
-	/**
-	 * @type array
-	 */
-	reservedKeywords: string[];
-	/**
-	 * @type array
-	 */
-	rules: RuletypesListableRuleDTO[];
-	/**
-	 * @type integer
-	 * @format int64
-	 */
-	total: number;
-}
-
 export interface RuletypesRenotifyDTO {
 	/**
 	 * @type array,null
@@ -10577,6 +10284,11 @@ export interface RuletypesRuleConditionDTO {
 	thresholds?: RuletypesRuleThresholdDataDTO;
 }
 
+export enum RuletypesRuleTypeDTO {
+	threshold_rule = 'threshold_rule',
+	promql_rule = 'promql_rule',
+	anomaly_rule = 'anomaly_rule',
+}
 export interface RuletypesPostableRuleDTO {
 	/**
 	 * @type string
@@ -10629,14 +10341,6 @@ export interface RuletypesPostableRuleDTO {
 	version?: string;
 }
 
-export interface RuletypesPostableRuleViewDTO {
-	data: RuletypesRuleViewDataDTO;
-	/**
-	 * @type string
-	 */
-	name: string;
-}
-
 export type RuletypesRuleDTOAnnotations = { [key: string]: string };
 
 export type RuletypesRuleDTOLabels = { [key: string]: string };
@@ -11335,82 +11039,6 @@ export interface SpantypesGettableTraceAggregationsDTO {
 	aggregations: SpantypesSpanAggregationResultDTO[];
 }
 
-export interface SpantypesTraceAITokensDTO {
-	/**
-	 * @type integer
-	 * @minimum 0
-	 */
-	cacheRead: number;
-	/**
-	 * @type integer
-	 * @minimum 0
-	 */
-	cacheWrite: number;
-	/**
-	 * @type integer
-	 * @minimum 0
-	 */
-	input: number;
-	/**
-	 * @type integer
-	 * @minimum 0
-	 */
-	output: number;
-	/**
-	 * @type integer
-	 * @minimum 0
-	 */
-	reasoning: number;
-}
-
-export interface SpantypesTraceAISummaryDTO {
-	tokens: SpantypesTraceAITokensDTO;
-	/**
-	 * @type number
-	 */
-	totalCost?: number;
-}
-
-export interface SpantypesGettableTraceSummaryDTO {
-	ai?: SpantypesTraceAISummaryDTO;
-	/**
-	 * @type integer
-	 * @minimum 0
-	 */
-	endTimestampMillis: number;
-	/**
-	 * @type boolean
-	 */
-	hasMissingSpans: boolean;
-	/**
-	 * @type string
-	 */
-	rootServiceEntryPoint: string;
-	/**
-	 * @type string
-	 */
-	rootServiceName: string;
-	/**
-	 * @type string
-	 */
-	rootSpanStatusCode: string;
-	/**
-	 * @type integer
-	 * @minimum 0
-	 */
-	startTimestampMillis: number;
-	/**
-	 * @type integer
-	 * @minimum 0
-	 */
-	totalErrorSpansCount: number;
-	/**
-	 * @type integer
-	 * @minimum 0
-	 */
-	totalSpansCount: number;
-}
-
 export interface SpantypesOtelSpanRefDTO {
 	/**
 	 * @type string
@@ -11426,86 +11054,6 @@ export interface SpantypesOtelSpanRefDTO {
 	traceId?: string;
 }
 
-export type SpantypesThreadSpanDTOAttributes = { [key: string]: unknown };
-
-export type SpantypesThreadSpanDTOResource = { [key: string]: string };
-
-export interface SpantypesThreadSpanDTO {
-	/**
-	 * @type object
-	 */
-	attributes: SpantypesThreadSpanDTOAttributes;
-	/**
-	 * @type integer
-	 * @minimum 0
-	 */
-	duration_nano: number;
-	/**
-	 * @type array
-	 */
-	events: SpantypesEventDTO[];
-	/**
-	 * @type boolean
-	 */
-	has_error: boolean;
-	/**
-	 * @type string
-	 */
-	kind_string: string;
-	/**
-	 * @type string
-	 */
-	name: string;
-	/**
-	 * @type string
-	 */
-	parent_span_id: string;
-	/**
-	 * @type array
-	 */
-	references: SpantypesOtelSpanRefDTO[];
-	/**
-	 * @type object
-	 */
-	resource: SpantypesThreadSpanDTOResource;
-	/**
-	 * @type string
-	 */
-	span_id: string;
-	/**
-	 * @type string
-	 */
-	status_code_string: string;
-	/**
-	 * @type string
-	 */
-	status_message: string;
-	/**
-	 * @type integer
-	 * @minimum 0
-	 */
-	time_unix: number;
-	/**
-	 * @type string
-	 */
-	trace_id: string;
-}
-
-export interface SpantypesGettableTraceThreadDTO {
-	/**
-	 * @type string
-	 */
-	nextCursor?: string;
-	/**
-	 * @type string
-	 */
-	prevCursor?: string;
-	/**
-	 * @type array
-	 */
-	spans: SpantypesThreadSpanDTO[];
-}
-
 export type SpantypesWaterfallSpanDTOAttributesAnyOf = {
 	[key: string]: unknown;
 };
@@ -13179,51 +12727,6 @@ export type GetTraceAggregations200 = {
 	status: string;
 };
 
-export type GetTraceSummaryPathParameters = {
-	traceID: string;
-};
-export type GetTraceSummary200 = {
-	data: SpantypesGettableTraceSummaryDTO;
-	/**
-	 * @type string
-	 */
-	status: string;
-};
-
-export type GetTraceThreadPathParameters = {
-	traceID: string;
-};
-export type GetTraceThreadParams = {
-	/**
-	 * @type integer
-	 * @description Page size, at most 100. 0 means 20.
-	 */
-	limit?: number;
-	/**
-	 * @type string
-	 * @description The nextCursor of a page; returns the spans after it. Set only one of after, before and spanId.
-	 */
-	after?: string;
-	/**
-	 * @type string
-	 * @description The prevCursor of a page; returns the spans before it. Set only one of after, before and spanId.
-	 */
-	before?: string;
-	/**
-	 * @type string
-	 * @description Returns the page around this span. Set only one of after, before and spanId.
-	 */
-	spanId?: string;
-};
-
-export type GetTraceThread200 = {
-	data: SpantypesGettableTraceThreadDTO;
-	/**
-	 * @type string
-	 */
-	status: string;
-};
-
 export type ListUserPreferences200 = {
 	/**
 	 * @type array
@@ -14125,36 +13628,6 @@ export type GetUsersByRoleID200 = {
 	status: string;
 };
 
-export type ListRuleViews200 = {
-	data: RuletypesListableRuleViewsDTO;
-	/**
-	 * @type string
-	 */
-	status: string;
-};
-
-export type CreateRuleView201 = {
-	data: RuletypesRuleViewDTO;
-	/**
-	 * @type string
-	 */
-	status: string;
-};
-
-export type DeleteRuleViewPathParameters = {
-	id: string;
-};
-export type UpdateRuleViewPathParameters = {
-	id: string;
-};
-export type UpdateRuleView200 = {
-	data: RuletypesRuleViewDTO;
-	/**
-	 * @type string
-	 */
-	status: string;
-};
-
 export type ListRules200 = {
 	/**
 	 * @type array
@@ -14716,45 +14189,6 @@ export type GetMetricDashboardsV2200 = {
 	status: string;
 };
 
-export type ListRulesV3Params = {
-	/**
-	 * @type string
-	 * @description undefined
-	 */
-	query?: string;
-	/**
-	 * @type array
-	 * @description undefined
-	 */
-	states?: string[];
-	/**
-	 * @description undefined
-	 */
-	sort?: RuletypesListSortDTO;
-	/**
-	 * @description undefined
-	 */
-	order?: RuletypesListOrderDTO;
-	/**
-	 * @type integer
-	 * @description undefined
-	 */
-	limit?: number;
-	/**
-	 * @type integer
-	 * @description undefined
-	 */
-	offset?: number;
-};
-
-export type ListRulesV3200 = {
-	data: RuletypesListableRulesDTO;
-	/**
-	 * @type string
-	 */
-	status: string;
-};
-
 export type GetFlamegraphPathParameters = {
 	traceID: string;
 };

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

@@ -4,17 +4,11 @@
  * * regenerate with 'pnpm generate:api'
  * SigNoz
  */
-import { useMutation, useQuery } from 'react-query';
+import { useMutation } from 'react-query';
 import type {
-	InvalidateOptions,
 	MutationFunction,
-	QueryClient,
-	QueryFunction,
-	QueryKey,
 	UseMutationOptions,
 	UseMutationResult,
-	UseQueryOptions,
-	UseQueryResult,
 } from 'react-query';
 
 import type {
@@ -22,11 +16,6 @@ import type {
 	GetFlamegraphPathParameters,
 	GetTraceAggregations200,
 	GetTraceAggregationsPathParameters,
-	GetTraceSummary200,
-	GetTraceSummaryPathParameters,
-	GetTraceThread200,
-	GetTraceThreadParams,
-	GetTraceThreadPathParameters,
 	GetWaterfallV4200,
 	GetWaterfallV4PathParameters,
 	RenderErrorResponseDTO,
@@ -38,26 +27,6 @@ import type {
 import { GeneratedAPIInstance } from '../../../generatedAPIInstance';
 import type { ErrorType, BodyType } from '../../../generatedAPIInstance';
 
-const withQueryKey = <T extends object, K>(
-	query: T,
-	queryKey: K,
-): T & { queryKey: K } => {
-	const result = { queryKey } as T & { queryKey: K };
-	for (const key of Object.keys(query)) {
-		// The explicit queryKey always wins, matching the previous
-		// `{ ...query, queryKey }` spread where it was set last.
-		if (key === 'queryKey') {
-			continue;
-		}
-		Object.defineProperty(result, key, {
-			enumerable: true,
-			configurable: true,
-			get: () => (query as Record<string, unknown>)[key],
-		});
-	}
-	return result;
-};
-
 /**
  * Computes span aggregations grouped by requested field.
  * @summary Get aggregations for a trace
@@ -158,223 +127,6 @@ export const useGetTraceAggregations = <
 > => {
 	return useMutation(getGetTraceAggregationsMutationOptions(options));
 };
-/**
- * Returns the trace's time range, root span, span and error counts, and whether any spans are missing. AI traces also include token and cost totals.
- * @summary Get summary for a trace
- */
-export const getTraceSummary = (
-	{ traceID }: GetTraceSummaryPathParameters,
-	signal?: AbortSignal,
-) => {
-	return GeneratedAPIInstance<GetTraceSummary200>({
-		url: `/api/v1/traces/${traceID}/summary`,
-		method: 'GET',
-		signal,
-	});
-};
-
-export const getGetTraceSummaryQueryKey = ({
-	traceID,
-}: GetTraceSummaryPathParameters) => {
-	return [`/api/v1/traces/${traceID}/summary`] as const;
-};
-
-export const getGetTraceSummaryQueryOptions = <
-	TData = Awaited<ReturnType<typeof getTraceSummary>>,
-	TError = ErrorType<RenderErrorResponseDTO>,
->(
-	{ traceID }: GetTraceSummaryPathParameters,
-	options?: {
-		query?: UseQueryOptions<
-			Awaited<ReturnType<typeof getTraceSummary>>,
-			TError,
-			TData
-		>;
-	},
-) => {
-	const { query: queryOptions } = options ?? {};
-
-	const queryKey =
-		queryOptions?.queryKey ?? getGetTraceSummaryQueryKey({ traceID });
-
-	const queryFn: QueryFunction<Awaited<ReturnType<typeof getTraceSummary>>> = ({
-		signal,
-	}) => getTraceSummary({ traceID }, signal);
-
-	return {
-		queryKey,
-		queryFn,
-		enabled: traceID !== null && traceID !== undefined,
-		...queryOptions,
-	} as UseQueryOptions<
-		Awaited<ReturnType<typeof getTraceSummary>>,
-		TError,
-		TData
-	> & { queryKey: QueryKey };
-};
-
-export type GetTraceSummaryQueryResult = NonNullable<
-	Awaited<ReturnType<typeof getTraceSummary>>
->;
-export type GetTraceSummaryQueryError = ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary Get summary for a trace
- */
-
-export function useGetTraceSummary<
-	TData = Awaited<ReturnType<typeof getTraceSummary>>,
-	TError = ErrorType<RenderErrorResponseDTO>,
->(
-	{ traceID }: GetTraceSummaryPathParameters,
-	options?: {
-		query?: UseQueryOptions<
-			Awaited<ReturnType<typeof getTraceSummary>>,
-			TError,
-			TData
-		>;
-	},
-): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
-	const queryOptions = getGetTraceSummaryQueryOptions({ traceID }, options);
-
-	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
-		queryKey: QueryKey;
-	};
-
-	return withQueryKey(query, queryOptions.queryKey);
-}
-
-/**
- * @summary Get summary for a trace
- */
-export const invalidateGetTraceSummary = async (
-	queryClient: QueryClient,
-	{ traceID }: GetTraceSummaryPathParameters,
-	options?: InvalidateOptions,
-): Promise<QueryClient> => {
-	await queryClient.invalidateQueries(
-		{ queryKey: getGetTraceSummaryQueryKey({ traceID }) },
-		options,
-	);
-
-	return queryClient;
-};
-
-/**
- * Returns the spans carrying gen_ai input or output messages in timestamp order. Pass nextCursor as after or prevCursor as before to page, or spanId to open the page around a span.
- * @summary Get thread view for a trace
- */
-export const getTraceThread = (
-	{ traceID }: GetTraceThreadPathParameters,
-	params?: GetTraceThreadParams,
-	signal?: AbortSignal,
-) => {
-	return GeneratedAPIInstance<GetTraceThread200>({
-		url: `/api/v1/traces/${traceID}/thread`,
-		method: 'GET',
-		params,
-		signal,
-	});
-};
-
-export const getGetTraceThreadQueryKey = (
-	{ traceID }: GetTraceThreadPathParameters,
-	params?: GetTraceThreadParams,
-) => {
-	return [
-		`/api/v1/traces/${traceID}/thread`,
-		...(params ? [params] : []),
-	] as const;
-};
-
-export const getGetTraceThreadQueryOptions = <
-	TData = Awaited<ReturnType<typeof getTraceThread>>,
-	TError = ErrorType<RenderErrorResponseDTO>,
->(
-	{ traceID }: GetTraceThreadPathParameters,
-	params?: GetTraceThreadParams,
-	options?: {
-		query?: UseQueryOptions<
-			Awaited<ReturnType<typeof getTraceThread>>,
-			TError,
-			TData
-		>;
-	},
-) => {
-	const { query: queryOptions } = options ?? {};
-
-	const queryKey =
-		queryOptions?.queryKey ?? getGetTraceThreadQueryKey({ traceID }, params);
-
-	const queryFn: QueryFunction<Awaited<ReturnType<typeof getTraceThread>>> = ({
-		signal,
-	}) => getTraceThread({ traceID }, params, signal);
-
-	return {
-		queryKey,
-		queryFn,
-		enabled: traceID !== null && traceID !== undefined,
-		...queryOptions,
-	} as UseQueryOptions<
-		Awaited<ReturnType<typeof getTraceThread>>,
-		TError,
-		TData
-	> & { queryKey: QueryKey };
-};
-
-export type GetTraceThreadQueryResult = NonNullable<
-	Awaited<ReturnType<typeof getTraceThread>>
->;
-export type GetTraceThreadQueryError = ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary Get thread view for a trace
- */
-
-export function useGetTraceThread<
-	TData = Awaited<ReturnType<typeof getTraceThread>>,
-	TError = ErrorType<RenderErrorResponseDTO>,
->(
-	{ traceID }: GetTraceThreadPathParameters,
-	params?: GetTraceThreadParams,
-	options?: {
-		query?: UseQueryOptions<
-			Awaited<ReturnType<typeof getTraceThread>>,
-			TError,
-			TData
-		>;
-	},
-): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
-	const queryOptions = getGetTraceThreadQueryOptions(
-		{ traceID },
-		params,
-		options,
-	);
-
-	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
-		queryKey: QueryKey;
-	};
-
-	return withQueryKey(query, queryOptions.queryKey);
-}
-
-/**
- * @summary Get thread view for a trace
- */
-export const invalidateGetTraceThread = async (
-	queryClient: QueryClient,
-	{ traceID }: GetTraceThreadPathParameters,
-	params?: GetTraceThreadParams,
-	options?: InvalidateOptions,
-): Promise<QueryClient> => {
-	await queryClient.invalidateQueries(
-		{ queryKey: getGetTraceThreadQueryKey({ traceID }, params) },
-		options,
-	);
-
-	return queryClient;
-};
-
 /**
  * Returns the flamegraph view of spans for a given trace ID.
  * @summary Get flamegraph view for a trace

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

@@ -198,7 +198,6 @@ function createBaseSpec(
 				: undefined,
 		legend: isEmpty(queryData.legend) ? undefined : queryData.legend,
 		having: normalizeHaving(queryData.having),
-		bucketOptions: queryData.bucketOptions,
 		functions: isEmpty(queryData.functions)
 			? undefined
 			: queryData.functions.map((func: QueryFunction): QueryFunction => {

frontend/src/components/AddCreditCardModal/AddCreditCardModal.tsx

@@ -1,103 +0,0 @@
-import { useMutation } from 'react-query';
-import { Button, Modal } from 'antd';
-import { Typography } from '@signozhq/ui/typography';
-import { createSubscription } from 'api/generated/services/subscriptions';
-import type { CreateSubscription201 } from 'api/generated/services/sigNoz.schemas';
-import { useNotifications } from 'hooks/useNotifications';
-import AuthZTooltip from 'lib/authz/components/AuthZTooltip/AuthZTooltip';
-import { SubscriptionCreatePermission } from 'lib/authz/hooks/useAuthZ/permissions/subscription.permissions';
-import { CreditCard, X } from '@signozhq/icons';
-import APIError from 'types/api/error';
-import { getBaseUrl } from 'utils/basePath';
-
-interface AddCreditCardModalProps {
-	open: boolean;
-	onClose: () => void;
-	onAddCreditCard?: () => void;
-}
-
-/**
- * Shown to trial users who have not added a card, in place of chat support.
- * Submitting creates the subscription and opens the returned billing URL.
- */
-function AddCreditCardModal({
-	open,
-	onClose,
-	onAddCreditCard,
-}: AddCreditCardModalProps): JSX.Element {
-	const { notifications } = useNotifications();
-
-	const handleBillingOnSuccess = (data: CreateSubscription201): void => {
-		if (data?.data?.redirectURL) {
-			const newTab = document.createElement('a');
-			newTab.href = data.data.redirectURL;
-			newTab.target = '_blank';
-			newTab.rel = 'noopener noreferrer';
-			newTab.click();
-		}
-	};
-
-	const handleBillingOnError = (error: APIError): void => {
-		notifications.error({
-			message: error.getErrorCode(),
-			description: error.getErrorMessage(),
-		});
-	};
-
-	const { mutate: updateCreditCard, isLoading: isLoadingBilling } = useMutation(
-		createSubscription,
-		{ onSuccess: handleBillingOnSuccess, onError: handleBillingOnError },
-	);
-
-	const handleAddCreditCard = (): void => {
-		onAddCreditCard?.();
-		updateCreditCard({ url: getBaseUrl() });
-	};
-
-	return (
-		<Modal
-			className="add-credit-card-modal"
-			title={<span className="title">Add Credit Card for Chat Support</span>}
-			open={open}
-			closable
-			onCancel={onClose}
-			destroyOnClose
-			footer={[
-				<Button
-					key="cancel"
-					onClick={onClose}
-					className="cancel-btn"
-					icon={<X size={16} />}
-				>
-					Cancel
-				</Button>,
-				<AuthZTooltip
-					key="submit"
-					checks={[SubscriptionCreatePermission]}
-					withPortal={false}
-				>
-					<Button
-						type="primary"
-						icon={<CreditCard size={16} />}
-						size="middle"
-						loading={isLoadingBilling}
-						disabled={isLoadingBilling}
-						onClick={handleAddCreditCard}
-						className="add-credit-card-btn"
-					>
-						Add Credit Card
-					</Button>
-				</AuthZTooltip>,
-			]}
-		>
-			<Typography.Text className="add-credit-card-text">
-				You&apos;re currently on <span className="highlight-text">Trial plan</span>.
-				Add a credit card to access SigNoz chat support to your workspace.
-			</Typography.Text>
-		</Modal>
-	);
-}
-
-AddCreditCardModal.defaultProps = { onAddCreditCard: undefined };
-
-export default AddCreditCardModal;

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

@@ -1,9 +0,0 @@
-import { rest } from 'msw';
-
-const SUBSCRIPTIONS = 'http://localhost/api/v1/subscriptions';
-
-export const createSubscriptionHandlers = [
-	rest.post(SUBSCRIPTIONS, (_req, res, ctx) =>
-		res(ctx.status(200), ctx.json({ data: { redirectURL: '' } })),
-	),
-];

frontend/src/components/AddCreditCardModal/stories/AddCreditCardModal.stories.tsx

@@ -1,54 +0,0 @@
-import { useState } from 'react';
-import type { Meta, StoryObj } from '@storybook/react-vite';
-import { Button } from '@signozhq/ui/button';
-import { screen, userEvent, within } from 'storybook/test';
-
-import { withCanvas } from '@/storybook/decorators/withCanvas';
-
-import { createSubscriptionHandlers } from './AddCreditCardModal.stories.mocks';
-
-import AddCreditCardModal from '../AddCreditCardModal';
-
-/** Stands in for the surfaces that open it: the strip's Support button, and
- * `LaunchChatSupport` in the custom domain and onboarding flows. */
-function ModalFixture(): JSX.Element {
-	const [open, setOpen] = useState(false);
-
-	return (
-		<>
-			<Button
-				data-testid="open-add-credit-card"
-				onClick={(): void => setOpen(true)}
-			>
-				Contact support
-			</Button>
-			<AddCreditCardModal open={open} onClose={(): void => setOpen(false)} />
-		</>
-	);
-}
-
-const meta = {
-	title: 'Components/Add Credit Card Modal',
-	component: ModalFixture,
-	tags: ['play'],
-	decorators: [withCanvas({ maxWidth: 400 })],
-	parameters: {
-		msw: { handlers: createSubscriptionHandlers },
-	},
-} satisfies Meta<typeof ModalFixture>;
-
-export default meta;
-
-type Story = StoryObj<typeof meta>;
-
-/** What a trial user without a card sees in place of chat support. */
-export const Default: Story = {
-	play: async ({ canvasElement }): Promise<void> => {
-		await userEvent.click(
-			within(canvasElement).getByTestId('open-add-credit-card'),
-		);
-		await screen.findByRole('dialog', {
-			name: /Add Credit Card for Chat Support/i,
-		});
-	},
-};

frontend/src/components/ChatSupportGateway/ChatSupportGateway.tsx

@@ -1,15 +1,63 @@
 import { useState } from 'react';
+import { useMutation } from 'react-query';
 import { useLocation } from 'react-router-dom';
-import { Button } from 'antd';
-import AddCreditCardModal from 'components/AddCreditCardModal/AddCreditCardModal';
+import { Button, Modal } from 'antd';
+import { Typography } from '@signozhq/ui/typography';
 import logEvent from 'api/common/logEvent';
-import { MessageSquareText } from '@signozhq/icons';
+import { createSubscription } from 'api/generated/services/subscriptions';
+import type { CreateSubscription201 } from 'api/generated/services/sigNoz.schemas';
+import { useNotifications } from 'hooks/useNotifications';
+import AuthZTooltip from 'lib/authz/components/AuthZTooltip/AuthZTooltip';
+import { SubscriptionCreatePermission } from 'lib/authz/hooks/useAuthZ/permissions/subscription.permissions';
+import { CreditCard, MessageSquareText, X } from '@signozhq/icons';
+import APIError from 'types/api/error';
+import { getBaseUrl } from 'utils/basePath';
 
 export default function ChatSupportGateway(): JSX.Element {
+	const { notifications } = useNotifications();
+
 	const [isAddCreditCardModalOpen, setIsAddCreditCardModalOpen] =
 		useState(false);
+
+	const handleBillingOnSuccess = (data: CreateSubscription201): void => {
+		if (data?.data?.redirectURL) {
+			const newTab = document.createElement('a');
+			newTab.href = data.data.redirectURL;
+			newTab.target = '_blank';
+			newTab.rel = 'noopener noreferrer';
+			newTab.click();
+		}
+	};
+
+	const handleBillingOnError = (error: APIError): void => {
+		notifications.error({
+			message: error.getErrorCode(),
+			description: error.getErrorMessage(),
+		});
+	};
+
+	const { mutate: updateCreditCard, isLoading: isLoadingBilling } = useMutation(
+		createSubscription,
+		{
+			onSuccess: (data) => {
+				handleBillingOnSuccess(data);
+			},
+			onError: handleBillingOnError,
+		},
+	);
 	const { pathname } = useLocation();
 
+	const handleAddCreditCard = (): void => {
+		logEvent('Add Credit card modal: Clicked', {
+			source: `chat support icon`,
+			page: pathname,
+		});
+
+		updateCreditCard({
+			url: getBaseUrl(),
+		});
+	};
+
 	return (
 		<>
 			<div className="chat-support-gateway">
@@ -28,16 +76,47 @@ export default function ChatSupportGateway(): JSX.Element {
 				</Button>
 			</div>
 
-			<AddCreditCardModal
+			{/* Add Credit Card Modal */}
+			<Modal
+				className="add-credit-card-modal"
+				title={<span className="title">Add Credit Card for Chat Support</span>}
 				open={isAddCreditCardModalOpen}
-				onClose={(): void => setIsAddCreditCardModalOpen(false)}
-				onAddCreditCard={(): void => {
-					logEvent('Add Credit card modal: Clicked', {
-						source: `chat support icon`,
-						page: pathname,
-					});
-				}}
-			/>
+				closable
+				onCancel={(): void => setIsAddCreditCardModalOpen(false)}
+				destroyOnClose
+				footer={[
+					<Button
+						key="cancel"
+						onClick={(): void => setIsAddCreditCardModalOpen(false)}
+						className="cancel-btn"
+						icon={<X size={16} />}
+					>
+						Cancel
+					</Button>,
+					<AuthZTooltip
+						key="submit"
+						checks={[SubscriptionCreatePermission]}
+						withPortal={false}
+					>
+						<Button
+							type="primary"
+							icon={<CreditCard size={16} />}
+							size="middle"
+							loading={isLoadingBilling}
+							disabled={isLoadingBilling}
+							onClick={handleAddCreditCard}
+							className="add-credit-card-btn"
+						>
+							Add Credit Card
+						</Button>
+					</AuthZTooltip>,
+				]}
+			>
+				<Typography.Text className="add-credit-card-text">
+					You&apos;re currently on <span className="highlight-text">Trial plan</span>
+					. Add a credit card to access SigNoz chat support to your workspace.
+				</Typography.Text>
+			</Modal>
 		</>
 	);
 }

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

@@ -106,7 +106,7 @@ describe.each([
 		renderWithStore(dataSource);
 		const button = screen.getByTestId(testId);
 		expect(button).toBeInTheDocument();
-		expect(button).toHaveAccessibleName('Download');
+		expect(button).toHaveClass('periscope-btn', 'ghost');
 	});
 
 	it('shows popover with export options when download button is clicked', () => {

frontend/src/components/DownloadOptionsMenu/DownloadOptionsMenu.tsx

@@ -1,12 +1,11 @@
 import { useCallback, useMemo, useState } from 'react';
-import { Popover, Tooltip } from 'antd';
-import { Button } from '@signozhq/ui/button';
+import { Button, Popover, Tooltip } from 'antd';
 import { RadioGroup, RadioGroupItem } from '@signozhq/ui/radio-group';
 import { Typography } from '@signozhq/ui/typography';
 import { TelemetryFieldKey } from 'api/v5/v5';
 import { PANEL_TYPES } from 'constants/queryBuilder';
 import { useExportRawData } from 'hooks/useExportData/useServerExport';
-import { Download } from '@signozhq/icons';
+import { Download, LoaderCircle } from '@signozhq/icons';
 import { DataSource } from 'types/common/queryBuilder';
 
 import {
@@ -112,9 +111,8 @@ export default function DownloadOptionsMenu({
 				)}
 
 				<Button
-					variant="solid"
-					color="primary"
-					prefix={<Download size={16} />}
+					type="primary"
+					icon={<Download size={16} />}
 					onClick={handleExport}
 					className="export-button"
 					disabled={isDownloading}
@@ -146,14 +144,16 @@ export default function DownloadOptionsMenu({
 		>
 			<Tooltip title="Download" placement="top">
 				<Button
-					variant="ghost"
-					color="secondary"
-					size="icon"
-					prefix={<Download size={14} />}
-					aria-label="Download"
+					className="periscope-btn ghost"
+					icon={
+						isDownloading ? (
+							<LoaderCircle size={14} className="animate-spin" />
+						) : (
+							<Download size={14} />
+						)
+					}
 					data-testid={`periscope-btn-download-${dataSource}`}
 					disabled={isDownloading}
-					loading={isDownloading}
 				/>
 			</Tooltip>
 		</Popover>

frontend/src/components/InputWithLabel/InputWithLabel.styles.scss

@@ -5,10 +5,6 @@
 	border-radius: 2px 0px 0px 2px;
 
 	.label {
-		// Typography.Text takes its display from this token; at its `inline` default
-		// the label blockifies as a flex item and the text rides the top of the row.
-		--typography-text-display: flex;
-
 		font-size: 12px;
 		font-style: normal;
 		font-weight: 500;

frontend/src/components/LaunchChatSupport/LaunchChatSupport.tsx

@@ -1,14 +1,22 @@
 import { useMemo, useState } from 'react';
+import { useMutation } from 'react-query';
 import { useLocation } from 'react-router-dom';
-import { Button, Tooltip } from 'antd';
-import AddCreditCardModal from 'components/AddCreditCardModal/AddCreditCardModal';
+import { Button, Modal, Tooltip } from 'antd';
+import { Typography } from '@signozhq/ui/typography';
 import logEvent from 'api/common/logEvent';
+import { createSubscription } from 'api/generated/services/subscriptions';
+import type { CreateSubscription201 } from 'api/generated/services/sigNoz.schemas';
 import cx from 'classnames';
 import { FeatureKeys } from 'constants/features';
 import { useGetTenantLicense } from 'hooks/useGetTenantLicense';
+import { useNotifications } from 'hooks/useNotifications';
+import AuthZTooltip from 'lib/authz/components/AuthZTooltip/AuthZTooltip';
+import { SubscriptionCreatePermission } from 'lib/authz/hooks/useAuthZ/permissions/subscription.permissions';
 import { defaultTo } from 'lodash-es';
-import { CircleHelp } from '@signozhq/icons';
+import { CircleHelp, CreditCard, X } from '@signozhq/icons';
 import { useAppContext } from 'providers/App/App';
+import APIError from 'types/api/error';
+import { getBaseUrl } from 'utils/basePath';
 
 import './LaunchChatSupport.styles.scss';
 
@@ -33,6 +41,7 @@ function LaunchChatSupport({
 	chatMessageDisabled = false,
 }: LaunchChatSupportProps): JSX.Element | null {
 	const { isCloudUser: isCloudUserVal } = useGetTenantLicense();
+	const { notifications } = useNotifications();
 	const {
 		trialInfo,
 		featureFlags,
@@ -110,12 +119,43 @@ function LaunchChatSupport({
 		}
 	};
 
+	const handleBillingOnSuccess = (data: CreateSubscription201): void => {
+		if (data?.data?.redirectURL) {
+			const newTab = document.createElement('a');
+			newTab.href = data.data.redirectURL;
+			newTab.target = '_blank';
+			newTab.rel = 'noopener noreferrer';
+			newTab.click();
+		}
+	};
+
+	const handleBillingOnError = (error: APIError): void => {
+		notifications.error({
+			message: error.getErrorCode(),
+			description: error.getErrorMessage(),
+		});
+	};
+
+	const { mutate: updateCreditCard, isLoading: isLoadingBilling } = useMutation(
+		createSubscription,
+		{
+			onSuccess: (data) => {
+				handleBillingOnSuccess(data);
+			},
+			onError: handleBillingOnError,
+		},
+	);
+
 	const handleAddCreditCard = (): void => {
 		logEvent('Add Credit card modal: Clicked', {
 			source: `facing issues button`,
 			page: pathname,
 			...attributes,
 		});
+
+		updateCreditCard({
+			url: getBaseUrl(),
+		});
 	};
 
 	return isCloudUserVal && isChatSupportEnabled ? ( // Note: we would need to move this condition to license based in future
@@ -135,11 +175,47 @@ function LaunchChatSupport({
 				</Button>
 			</Tooltip>
 
-			<AddCreditCardModal
+			{/* Add Credit Card Modal */}
+			<Modal
+				className="add-credit-card-modal"
+				title={<span className="title">Add Credit Card for Chat Support</span>}
 				open={isAddCreditCardModalOpen}
-				onClose={(): void => setIsAddCreditCardModalOpen(false)}
-				onAddCreditCard={handleAddCreditCard}
-			/>
+				closable
+				onCancel={(): void => setIsAddCreditCardModalOpen(false)}
+				destroyOnClose
+				footer={[
+					<Button
+						key="cancel"
+						onClick={(): void => setIsAddCreditCardModalOpen(false)}
+						className="cancel-btn"
+						icon={<X size={16} />}
+					>
+						Cancel
+					</Button>,
+					<AuthZTooltip
+						key="submit"
+						checks={[SubscriptionCreatePermission]}
+						withPortal={false}
+					>
+						<Button
+							type="primary"
+							icon={<CreditCard size={16} />}
+							size="middle"
+							loading={isLoadingBilling}
+							disabled={isLoadingBilling}
+							onClick={handleAddCreditCard}
+							className="add-credit-card-btn"
+						>
+							Add Credit Card
+						</Button>
+					</AuthZTooltip>,
+				]}
+			>
+				<Typography.Text className="add-credit-card-text">
+					You&apos;re currently on <span className="highlight-text">Trial plan</span>
+					. Add a credit card to access SigNoz chat support to your workspace.
+				</Typography.Text>
+			</Modal>
 		</div>
 	) : null;
 }

frontend/src/components/LogDetail/LogDetail.interfaces.ts

@@ -1,7 +1,7 @@
 import { DrawerProps } from 'antd';
-import { ChangeViewFunctionType } from 'container/ExplorerOptions/types';
 import { AddToQueryHOCProps } from 'components/Logs/AddToQueryHOC';
-import { ActionItemProps } from 'container/LogDetailedView/LogDetailedView.types';
+import { ChangeViewFunctionType } from 'container/ExplorerOptions/types';
+import { ActionItemProps } from 'container/LogDetailedView/ActionItem';
 import { IField } from 'types/api/logs/fields';
 import { ILog } from 'types/api/logs/log';
 

frontend/src/components/LogDetail/LogDetails.styles.scss

@@ -42,9 +42,6 @@
 		display: flex;
 		flex-direction: column;
 		padding: 0 16px;
-		// OverlayScrollbar owns the scroll. A native scrollbar here changes the
-		// body width when it toggles and shifts the header grid.
-		overflow: hidden;
 	}
 
 	.title {
@@ -72,7 +69,7 @@
 	}
 
 	.log-detail-drawer__content {
-		min-height: 100%;
+		height: 100%;
 	}
 
 	.log-detail-drawer__log {

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

@@ -19,6 +19,10 @@ jest.mock('periscope/components/DataViewer', () => ({
 }));
 
 // Force v2 for these tests regardless of route.
+jest.mock('../useIsLogDetailsV2', () => ({
+	useIsLogDetailsV2: (): boolean => true,
+}));
+
 const mockLog: ILog = {
 	id: 'log-1',
 	timestamp: '2024-01-15T09:45:30Z',
@@ -54,7 +58,7 @@ function renderDrawer(props: Partial<LogDetailProps> = {}): void {
 	);
 }
 
-describe('LogDetail drawer — header', () => {
+describe('LogDetail drawer — header (isLogDetailsV2)', () => {
 	afterEach(() => {
 		jest.clearAllMocks();
 		localStorage.clear();

frontend/src/components/LogDetail/index.tsx

@@ -1,11 +1,16 @@
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
+// eslint-disable-next-line no-restricted-imports
+import { useCopyToClipboard } from 'react-use';
 import { Color, Spacing } from '@signozhq/design-tokens';
 import { Button } from '@signozhq/ui/button';
 import { Drawer, Tooltip } from 'antd';
 import { ToggleGroupSimple } from '@signozhq/ui/toggle-group';
+import { Divider } from '@signozhq/ui/divider';
 import { Typography } from '@signozhq/ui/typography';
-import LogStateIndicator from 'components/Logs/LogStateIndicator/LogStateIndicator';
-import OverlayScrollbar from 'components/OverlayScrollbar/OverlayScrollbar';
+import cx from 'classnames';
+import LogStateIndicator, {
+	LogType,
+} from 'components/Logs/LogStateIndicator/LogStateIndicator';
 import QuerySearch from 'components/QueryBuilderV2/QueryV2/QuerySearch/QuerySearch';
 import { convertExpressionToFilters } from 'components/QueryBuilderV2/utils';
 import { FeatureKeys } from 'constants/features';
@@ -14,24 +19,33 @@ import ContextView from 'container/LogDetailedView/ContextView/ContextView';
 import InfraMetrics from 'container/LogDetailedView/InfraMetrics/InfraMetrics';
 import Overview from 'container/LogDetailedView/Overview';
 import {
+	aggregateAttributesResourcesToString,
 	getSanitizedLogBody,
 	removeEscapeCharacters,
 } from 'container/LogDetailedView/utils';
 import useInitialQuery from 'container/LogsExplorerContext/useInitialQuery';
 import { useOptionsMenu } from 'container/OptionsMenu';
 import { FontSize } from 'container/OptionsMenu/types';
+import { useCopyLogLink } from 'hooks/logs/useCopyLogLink';
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
 import { useIsDarkMode } from 'hooks/useDarkMode';
+import { useNotifications } from 'hooks/useNotifications';
 import { cloneDeep } from 'lodash-es';
 import {
 	ArrowDown,
 	ArrowUp,
+	Braces,
+	ChevronDown,
+	ChevronUp,
+	Compass,
+	Copy,
 	Filter,
 	Histogram,
 	Table,
 	TextSelect,
 	X,
 } from '@signozhq/icons';
+import { JsonView } from 'periscope/components/JsonView';
 import { useAppContext } from 'providers/App/App';
 import { ILogBody } from 'types/api/logs/log';
 import { Query, TagFilter } from 'types/api/queryBuilder/queryBuilderData';
@@ -42,6 +56,7 @@ import { LogDetailInnerProps, LogDetailProps } from './LogDetail.interfaces';
 import LogDetailsHeader from './LogDetailsHeader/LogDetailsHeader';
 import { useLogNavigation } from './LogDetailsHeader/useLogNavigation';
 import LogHighlights from './LogHighlights/LogHighlights';
+import { useIsLogDetailsV2 } from './useIsLogDetailsV2';
 
 import './LogDetails.styles.scss';
 
@@ -49,8 +64,11 @@ import './LogDetails.styles.scss';
 function LogDetailInner({
 	log,
 	onClose,
+	onAddToQuery,
+	onClickActionItem,
 	selectedTab,
 	isListViewPanel = false,
+	listViewPanelSelectedFields,
 	handleChangeSelectedView,
 	logs,
 	onNavigateLog,
@@ -63,6 +81,7 @@ function LogDetailInner({
 	const [contextQuery, setContextQuery] = useState<Query | undefined>(
 		initialContextQuery,
 	);
+	const [, copyToClipboard] = useCopyToClipboard();
 	const [selectedView, setSelectedView] = useState<VIEWS>(selectedTab);
 
 	const [isFilterVisible, setIsFilterVisible] = useState<boolean>(false);
@@ -75,6 +94,8 @@ function LogDetailInner({
 	const [isEdit, setIsEdit] = useState<boolean>(false);
 	const { stagedQuery } = useQueryBuilder();
 
+	const isLogDetailsV2 = useIsLogDetailsV2();
+
 	// Handle clicks outside to close drawer, except on explicitly ignored regions
 	useEffect(() => {
 		const handleClickOutside = (e: MouseEvent): void => {
@@ -152,6 +173,12 @@ function LogDetailInner({
 
 	const isDarkMode = useIsDarkMode();
 
+	const { notifications } = useNotifications();
+
+	const { onLogCopy } = useCopyLogLink(log?.id);
+
+	const LogJsonData = log ? aggregateAttributesResourcesToString(log) : '';
+
 	const handleModeChange = (value: string): void => {
 		setSelectedView(value as VIEWS);
 		setIsEdit(false);
@@ -193,6 +220,13 @@ function LogDetailInner({
 		[logBody],
 	);
 
+	const handleJSONCopy = (): void => {
+		copyToClipboard(LogJsonData);
+		notifications.success({
+			message: 'Copied to clipboard',
+		});
+	};
+
 	const handleQueryExpressionChange = useCallback(
 		(value: string, queryIndex: number) => {
 			// update the query at the given index
@@ -261,6 +295,8 @@ function LogDetailInner({
 		}
 	};
 
+	const logType = log?.attributes_string?.log_level || LogType.INFO;
+
 	return (
 		<Drawer
 			width="60%"
@@ -268,15 +304,69 @@ function LogDetailInner({
 			maskClosable={false}
 			getContainer={getContainer}
 			title={
-				<LogDetailsHeader
-					log={log}
-					onNavigatePrev={goToPrev}
-					onNavigateNext={goToNext}
-					isPrevDisabled={isPrevDisabled}
-					isNextDisabled={isNextDisabled}
-					showOpenInExplorer={!!handleOpenInExplorer}
-					onOpenInExplorer={handleOpenInExplorer}
-				/>
+				isLogDetailsV2 ? (
+					<LogDetailsHeader
+						log={log}
+						onNavigatePrev={goToPrev}
+						onNavigateNext={goToNext}
+						isPrevDisabled={isPrevDisabled}
+						isNextDisabled={isNextDisabled}
+						showOpenInExplorer={!!handleOpenInExplorer}
+						onOpenInExplorer={handleOpenInExplorer}
+					/>
+				) : (
+					<div className="log-detail-drawer__title" data-log-detail-ignore="true">
+						<div className="log-detail-drawer__title-left">
+							<Divider type="vertical" className={cx('log-type-indicator', LogType)} />
+							<Typography.Text className="title">Log details</Typography.Text>
+						</div>
+						<div className="log-detail-drawer__title-right">
+							<div className="log-arrows">
+								<Tooltip
+									title={isPrevDisabled ? '' : 'Move to previous log'}
+									placement="top"
+									mouseLeaveDelay={0}
+								>
+									<Button
+										variant="outlined"
+										color="secondary"
+										prefix={<ChevronUp size={14} />}
+										className="log-arrow-btn log-arrow-btn-up"
+										disabled={isPrevDisabled}
+										onClick={goToPrev}
+									/>
+								</Tooltip>
+								<Tooltip
+									title={isNextDisabled ? '' : 'Move to next log'}
+									placement="top"
+									mouseLeaveDelay={0}
+								>
+									<Button
+										variant="outlined"
+										color="secondary"
+										prefix={<ChevronDown size={14} />}
+										className="log-arrow-btn log-arrow-btn-down"
+										disabled={isNextDisabled}
+										onClick={goToNext}
+									/>
+								</Tooltip>
+							</div>
+							{handleOpenInExplorer && (
+								<div>
+									<Button
+										variant="outlined"
+										color="secondary"
+										prefix={<Compass size={16} />}
+										className="open-in-explorer-btn"
+										onClick={handleOpenInExplorer}
+									>
+										Open in Explorer
+									</Button>
+								</div>
+							)}
+						</div>
+					</div>
+				)
 			}
 			placement="right"
 			onClose={drawerCloseHandler}
@@ -289,150 +379,195 @@ function LogDetailInner({
 			destroyOnClose
 			closeIcon={<X size={16} style={{ marginTop: Spacing.MARGIN_1 }} />}
 		>
-			<OverlayScrollbar style={{ height: '100%' }}>
-				<div
-					className="log-detail-drawer__content"
-					data-log-detail-ignore="true"
-					data-testid="log-detail-drawer"
-				>
-					<div className="log-detail-drawer__log">
+			<div
+				className="log-detail-drawer__content"
+				data-log-detail-ignore="true"
+				data-testid="log-detail-drawer"
+			>
+				<div className="log-detail-drawer__log">
+					{isLogDetailsV2 ? (
 						<LogStateIndicator
 							severityText={log.severity_text}
 							severityNumber={log.severity_number}
 							fontSize={options?.fontSize ?? FontSize.MEDIUM}
 						/>
-						<Tooltip
-							title={removeEscapeCharacters(logBody)}
-							placement="left"
-							mouseLeaveDelay={0}
-						>
-							<div className="log-body" dangerouslySetInnerHTML={htmlBody} />
-						</Tooltip>
-
-						<div className="log-overflow-shadow">&nbsp;</div>
-					</div>
-
-					<LogHighlights log={log} />
-
-					<div className="log-detail-drawer__section-divider" />
-
-					<div className="tabs-and-search">
-						<ToggleGroupSimple
-							type="single"
-							className="views-tabs"
-							onChange={handleModeChange}
-							value={selectedView}
-							items={[
-								{
-									value: VIEW_TYPES.OVERVIEW,
-									label: (
-										<div className="view-title">
-											<Table size={14} />
-											Overview
-										</div>
-									),
-								},
-								{
-									value: VIEW_TYPES.CONTEXT,
-									label: (
-										<div className="view-title">
-											<TextSelect size={14} />
-											Context
-										</div>
-									),
-								},
-								{
-									value: VIEW_TYPES.INFRAMETRICS,
-									label: (
-										<div className="view-title">
-											<Histogram size="md" />
-											Metrics
-										</div>
-									),
-								},
-							]}
-						/>
-
-						<div className="log-detail-drawer__actions">
-							{selectedView === VIEW_TYPES.CONTEXT && (
-								<Tooltip
-									title="Show Filters"
-									placement="topLeft"
-									aria-label="Show Filters"
-									mouseLeaveDelay={0}
-								>
-									<Button
-										variant="link"
-										color="secondary"
-										size="sm"
-										prefix={<Filter size="lg" />}
-										onClick={handleFilterVisible}
-									/>
-								</Tooltip>
-							)}
-						</div>
-					</div>
-					{isFilterVisible && contextQuery?.builder.queryData[0] && (
-						<div className="log-detail-drawer-query-container">
-							<QuerySearch
-								onChange={(value): void => handleQueryExpressionChange(value, 0)}
-								dataSource={DataSource.LOGS}
-								queryData={contextQuery?.builder.queryData[0]}
-								onRun={handleRunQuery}
-							/>
-						</div>
+					) : (
+						<Divider type="vertical" className={cx('log-type-indicator', logType)} />
 					)}
+					<Tooltip
+						title={removeEscapeCharacters(logBody)}
+						placement="left"
+						mouseLeaveDelay={0}
+					>
+						<div className="log-body" dangerouslySetInnerHTML={htmlBody} />
+					</Tooltip>
 
-					{selectedView === VIEW_TYPES.OVERVIEW && (
-						<Overview
-							logData={log}
-							isListViewPanel={isListViewPanel}
-							handleChangeSelectedView={handleChangeSelectedView}
-							onApplyLogFilter={onApplyLogFilter}
-						/>
-					)}
-					{selectedView === VIEW_TYPES.CONTEXT && (
-						<ContextView
-							log={log}
-							filters={filters}
-							contextQuery={contextQuery}
-							isEdit={isEdit}
-						/>
-					)}
-					{selectedView === VIEW_TYPES.INFRAMETRICS && (
-						<InfraMetrics
-							clusterName={log.resources_string?.[RESOURCE_KEYS.CLUSTER_NAME] || ''}
-							podName={log.resources_string?.[RESOURCE_KEYS.POD_NAME] || ''}
-							nodeName={log.resources_string?.[RESOURCE_KEYS.NODE_NAME] || ''}
-							hostName={log.resources_string?.[RESOURCE_KEYS.HOST_NAME] || ''}
-							timestamp={log.timestamp.toString()}
-							dataSource={DataSource.LOGS}
-						/>
-					)}
-
-					{selectedView === VIEW_TYPES.OVERVIEW && (
-						<div className="log-detail-drawer__footer-hint">
-							<div className="log-detail-drawer__footer-hint-content">
-								<Typography.Text
-									color="muted"
-									className="log-detail-drawer__footer-hint-text"
-								>
-									Use
-								</Typography.Text>
-								<ArrowUp size={14} className="log-detail-drawer__footer-hint-icon" />
-								<span>/</span>
-								<ArrowDown size={14} className="log-detail-drawer__footer-hint-icon" />
-								<Typography.Text
-									color="muted"
-									className="log-detail-drawer__footer-hint-text"
-								>
-									to view previous/next log
-								</Typography.Text>
-							</div>
-						</div>
-					)}
+					<div className="log-overflow-shadow">&nbsp;</div>
 				</div>
-			</OverlayScrollbar>
+
+				{isLogDetailsV2 && <LogHighlights log={log} />}
+
+				{isLogDetailsV2 && <div className="log-detail-drawer__section-divider" />}
+
+				<div className="tabs-and-search">
+					<ToggleGroupSimple
+						type="single"
+						className="views-tabs"
+						onChange={handleModeChange}
+						value={selectedView}
+						items={[
+							{
+								value: VIEW_TYPES.OVERVIEW,
+								label: (
+									<div className="view-title">
+										<Table size={14} />
+										Overview
+									</div>
+								),
+							},
+							// V2's DataViewer has its own Pretty/JSON toggle, so the separate
+							// JSON tab is redundant.
+							...(isLogDetailsV2
+								? []
+								: [
+										{
+											value: VIEW_TYPES.JSON,
+											label: (
+												<div className="view-title">
+													<Braces size={14} />
+													JSON
+												</div>
+											),
+										},
+									]),
+							{
+								value: VIEW_TYPES.CONTEXT,
+								label: (
+									<div className="view-title">
+										<TextSelect size={14} />
+										Context
+									</div>
+								),
+							},
+							{
+								value: VIEW_TYPES.INFRAMETRICS,
+								label: (
+									<div className="view-title">
+										<Histogram size="md" />
+										Metrics
+									</div>
+								),
+							},
+						]}
+					/>
+
+					<div className="log-detail-drawer__actions">
+						{selectedView === VIEW_TYPES.CONTEXT && (
+							<Tooltip
+								title="Show Filters"
+								placement="topLeft"
+								aria-label="Show Filters"
+								mouseLeaveDelay={0}
+							>
+								<Button
+									variant="link"
+									color="secondary"
+									size="sm"
+									prefix={<Filter size="lg" />}
+									onClick={handleFilterVisible}
+								/>
+							</Tooltip>
+						)}
+
+						{/* V2 moves copy actions into the header ⋯ menu */}
+						{!isLogDetailsV2 && (
+							<Tooltip
+								title={selectedView === VIEW_TYPES.JSON ? 'Copy JSON' : 'Copy Log Link'}
+								placement="topLeft"
+								aria-label={
+									selectedView === VIEW_TYPES.JSON ? 'Copy JSON' : 'Copy Log Link'
+								}
+								mouseLeaveDelay={0}
+							>
+								<Button
+									variant="link"
+									color="secondary"
+									size="sm"
+									prefix={<Copy size={12} />}
+									onClick={selectedView === VIEW_TYPES.JSON ? handleJSONCopy : onLogCopy}
+								/>
+							</Tooltip>
+						)}
+					</div>
+				</div>
+				{isFilterVisible && contextQuery?.builder.queryData[0] && (
+					<div className="log-detail-drawer-query-container">
+						<QuerySearch
+							onChange={(value): void => handleQueryExpressionChange(value, 0)}
+							dataSource={DataSource.LOGS}
+							queryData={contextQuery?.builder.queryData[0]}
+							onRun={handleRunQuery}
+						/>
+					</div>
+				)}
+
+				{selectedView === VIEW_TYPES.OVERVIEW && (
+					<Overview
+						logData={log}
+						onAddToQuery={onAddToQuery}
+						onClickActionItem={onClickActionItem}
+						isListViewPanel={isListViewPanel}
+						selectedOptions={options}
+						listViewPanelSelectedFields={listViewPanelSelectedFields}
+						handleChangeSelectedView={handleChangeSelectedView}
+						onApplyLogFilter={onApplyLogFilter}
+					/>
+				)}
+				{!isLogDetailsV2 && selectedView === VIEW_TYPES.JSON && (
+					<JsonView data={LogJsonData} height="68vh" />
+				)}
+
+				{selectedView === VIEW_TYPES.CONTEXT && (
+					<ContextView
+						log={log}
+						filters={filters}
+						contextQuery={contextQuery}
+						isEdit={isEdit}
+					/>
+				)}
+				{selectedView === VIEW_TYPES.INFRAMETRICS && (
+					<InfraMetrics
+						clusterName={log.resources_string?.[RESOURCE_KEYS.CLUSTER_NAME] || ''}
+						podName={log.resources_string?.[RESOURCE_KEYS.POD_NAME] || ''}
+						nodeName={log.resources_string?.[RESOURCE_KEYS.NODE_NAME] || ''}
+						hostName={log.resources_string?.[RESOURCE_KEYS.HOST_NAME] || ''}
+						timestamp={log.timestamp.toString()}
+						dataSource={DataSource.LOGS}
+					/>
+				)}
+
+				{selectedView === VIEW_TYPES.OVERVIEW && (
+					<div className="log-detail-drawer__footer-hint">
+						<div className="log-detail-drawer__footer-hint-content">
+							<Typography.Text
+								color="muted"
+								className="log-detail-drawer__footer-hint-text"
+							>
+								Use
+							</Typography.Text>
+							<ArrowUp size={14} className="log-detail-drawer__footer-hint-icon" />
+							<span>/</span>
+							<ArrowDown size={14} className="log-detail-drawer__footer-hint-icon" />
+							<Typography.Text
+								color="muted"
+								className="log-detail-drawer__footer-hint-text"
+							>
+								to view previous/next log
+							</Typography.Text>
+						</div>
+					</div>
+				)}
+			</div>
 		</Drawer>
 	);
 }

frontend/src/components/LogDetail/useIsLogDetailsV2.ts

@@ -0,0 +1,11 @@
+import ROUTES from 'constants/routes';
+import { useLocation } from 'react-router-dom';
+
+export function useIsLogDetailsV2(): boolean {
+	const { pathname } = useLocation();
+	return (
+		pathname === ROUTES.LOGS_EXPLORER ||
+		pathname.startsWith(ROUTES.INFRASTRUCTURE_MONITORING_BASE) ||
+		pathname.startsWith(`${ROUTES.ALL_DASHBOARD}/`)
+	);
+}

frontend/src/components/Logs/CopyClipboardHOC.tsx

@@ -0,0 +1,54 @@
+import { ReactNode, useCallback, useEffect } from 'react';
+import { useCopyToClipboard } from 'react-use';
+import { Popover } from 'antd';
+import { useNotifications } from 'hooks/useNotifications';
+
+function CopyClipboardHOC({
+	entityKey,
+	textToCopy,
+	tooltipText = 'Copy to clipboard',
+	children,
+}: CopyClipboardHOCProps): JSX.Element {
+	const [value, setCopy] = useCopyToClipboard();
+	const { notifications } = useNotifications();
+	useEffect(() => {
+		if (value.value) {
+			const key = entityKey || '';
+
+			const notificationMessage = `${key} copied to clipboard`;
+
+			notifications.success({
+				message: notificationMessage,
+				key: notificationMessage,
+			});
+		}
+	}, [value, notifications, entityKey]);
+
+	const onClick = useCallback((): void => {
+		setCopy(textToCopy);
+	}, [setCopy, textToCopy]);
+
+	return (
+		<span onClick={onClick} role="presentation" tabIndex={-1}>
+			<Popover
+				placement="top"
+				overlayClassName="drawer-popover"
+				content={<span style={{ fontSize: '0.9rem' }}>{tooltipText}</span>}
+			>
+				{children}
+			</Popover>
+		</span>
+	);
+}
+
+interface CopyClipboardHOCProps {
+	entityKey: string | undefined;
+	textToCopy: string;
+	tooltipText?: string;
+	children: ReactNode;
+}
+
+export default CopyClipboardHOC;
+CopyClipboardHOC.defaultProps = {
+	tooltipText: 'Copy to clipboard',
+};

frontend/src/components/QueryBuilderV2/QueryV2/QueryAddOns/BucketOptions/BucketOptions.module.scss

@@ -1,142 +0,0 @@
-/**
- * Borrows the query builder's control metrics rather than the component defaults the
- * toggle group and number input ship with: 36px tall, 2px radius, and the
- * `--query-builder-v2-*` surface the selects above this row already paint on.
- */
-.bucketOptions {
-	--toggle-group-radius: var(--radius-1);
-	--toggle-group-item-size: 36px;
-	--toggle-group-item-font-size: 13px;
-	--toggle-group-item-padding-left: var(--spacing-6);
-	--toggle-group-item-padding-right: var(--spacing-6);
-
-	// Repeated from `.query-add-ons` rather than inherited: the section also renders on a
-	// formula, which has no add-ons ancestor to pick the toggle palette up from.
-	--toggle-group-secondary-bg: var(
-		--query-builder-v2-toggle-group-background-color,
-		var(--l1-background-hover)
-	);
-	--toggle-group-secondary-border: var(
-		--query-builder-v2-toggle-group-border-color,
-		var(--l2-border)
-	);
-	--toggle-group-secondary-active-bg: var(
-		--query-builder-v2-toggle-group-active-background-color,
-		var(--l1-background)
-	);
-	--toggle-group-secondary-bg-hover: var(
-		--query-builder-v2-toggle-group-background-color-hover,
-		var(--l2-background)
-	);
-
-	--input-height: 36px;
-	--input-font-size: 13px;
-	--input-border-radius: var(--radius-1);
-	--input-border-color: var(--query-builder-v2-border-color, var(--l2-border));
-	--input-background: var(
-		--query-builder-v2-background-color,
-		var(--l2-background)
-	);
-	--input-foreground: var(--query-builder-v2-color, var(--l2-foreground));
-
-	display: flex;
-	flex-direction: column;
-	gap: var(--spacing-6);
-
-	padding: var(--spacing-4);
-	box-sizing: border-box;
-	border: 1px solid var(--query-builder-v2-border-color, var(--l2-border));
-	border-radius: var(--radius-1);
-	background: var(--query-builder-v2-background-color, var(--l2-background));
-}
-
-.controls {
-	display: flex;
-	flex-wrap: wrap;
-	align-items: center;
-	gap: var(--spacing-8);
-}
-
-/** One label paired with its control, at the same 10px rhythm as the aggregate rows. */
-.field {
-	display: flex;
-	align-items: center;
-	gap: var(--spacing-5);
-}
-
-.bounds {
-	display: flex;
-	flex-wrap: wrap;
-	align-items: center;
-	gap: var(--spacing-6);
-}
-
-.label {
-	display: inline-flex;
-	align-items: center;
-	gap: var(--spacing-2);
-
-	color: var(--l3-foreground);
-	font-family: 'Geist Mono';
-	font-size: 12px;
-	font-weight: var(--font-weight-medium);
-	line-height: 18px;
-	letter-spacing: 0.48px;
-	text-transform: uppercase;
-	white-space: nowrap;
-}
-
-/**
- * The toggle group exposes a font-size token but no family, so each item's label carries
- * the query builder's value type itself.
- */
-.toggleLabel {
-	font-family: 'Geist Mono';
-	font-size: 13px;
-	font-weight: var(--font-weight-normal);
-	letter-spacing: -0.07px;
-}
-
-/** Surface and metrics come from the `--input-*` tokens above; only the family has none. */
-.numberInput {
-	width: 104px;
-
-	font-family: 'Geist Mono';
-	letter-spacing: -0.07px;
-}
-
-/** Unfilled: a pill on the same row as the toggles above reads as another control,
- *  and the bounds are derived rather than set here. */
-.bound {
-	padding: var(--spacing-1) 0;
-
-	font-family: 'Geist Mono';
-	font-size: 13px;
-	line-height: 20px;
-	letter-spacing: -0.07px;
-
-	color: var(--query-builder-v2-color, var(--l2-foreground));
-}
-
-.overflowBound {
-	color: var(--l3-foreground);
-}
-
-.muted {
-	font-family: 'Geist Mono';
-	font-size: 13px;
-	line-height: 20px;
-	color: var(--l3-foreground);
-}
-
-.hintIcon {
-	flex: none;
-	cursor: help;
-	color: var(--l3-foreground);
-}
-
-.closeButton {
-	margin-left: auto;
-	width: 24px;
-	height: 24px;
-}

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

@@ -1,279 +0,0 @@
-import { useCallback, useMemo, useState } from 'react';
-import { Tooltip } from 'antd';
-import cx from 'classnames';
-import { Button } from '@signozhq/ui/button';
-import { InputNumber } from '@signozhq/ui/input-number';
-import { ToggleGroupSimple } from '@signozhq/ui/toggle-group';
-import { ChevronUp, Info } from '@signozhq/icons';
-import {
-	Querybuildertypesv5BucketOptionsDTO,
-	Querybuildertypesv5BucketsKindDTO,
-} from 'api/generated/services/sigNoz.schemas';
-
-import {
-	BUCKET_KIND_HINTS,
-	BUCKET_KIND_OPTIONS,
-	DEFAULT_NUM_BUCKETS,
-	LOG_SCALE_OPTIONS,
-	MAX_NUM_BUCKETS,
-} from './constants';
-import {
-	formatUpperBound,
-	hasBoundsBeyondPreview,
-	isLinearBuckets,
-	kindOptionOf,
-	linearBuckets,
-	logBuckets,
-	logScaleOf,
-	previewUpperBounds,
-} from './utils';
-
-import styles from './BucketOptions.module.scss';
-
-function BucketOptions({
-	bucketOptions,
-	unit,
-	onChange,
-	onClose,
-}: {
-	bucketOptions?: Querybuildertypesv5BucketOptionsDTO;
-	/** The panel's y-axis unit, so the previewed bounds read the way the axis will. */
-	unit?: string;
-	onChange: (next: Querybuildertypesv5BucketOptionsDTO | undefined) => void;
-	/** Omitted where the section isn't dismissable, as on a formula. */
-	onClose?: () => void;
-}): JSX.Element {
-	// A linear axis has no bounds to describe until it has a max value, so the picked
-	// kind is held here rather than read back off the emitted options: it has to survive
-	// the gap between choosing Linear and filling the field in.
-	const [kind, setKind] = useState<Querybuildertypesv5BucketsKindDTO>(() =>
-		kindOptionOf(bucketOptions),
-	);
-	const linearSpec =
-		bucketOptions && isLinearBuckets(bucketOptions)
-			? bucketOptions.spec
-			: undefined;
-	const [logScale, setLogScale] = useState<number>(() =>
-		logScaleOf(bucketOptions),
-	);
-	const [maxValue, setMaxValue] = useState<number | null>(
-		linearSpec?.maxValue ?? null,
-	);
-	const [numBuckets, setNumBuckets] = useState<number | null>(
-		linearSpec?.numBuckets ?? null,
-	);
-
-	const emitLinear = useCallback(
-		(nextMaxValue: number | null, nextNumBuckets: number | null): void => {
-			// An incomplete linear axis is sent as no axis at all rather than as a spec the
-			// request would reject.
-			if (nextMaxValue === null || nextMaxValue <= 0) {
-				onChange(undefined);
-				return;
-			}
-
-			onChange(linearBuckets(nextMaxValue, nextNumBuckets));
-		},
-		[onChange],
-	);
-
-	const handleKindChange = useCallback(
-		(value: string): void => {
-			// Radix clears the value when the active item is clicked again; a bucket axis is
-			// always one of the two, so keep the current pick instead.
-			if (!value) {
-				return;
-			}
-
-			const nextKind = value as Querybuildertypesv5BucketsKindDTO;
-			setKind(nextKind);
-
-			if (nextKind === Querybuildertypesv5BucketsKindDTO.log) {
-				onChange(logBuckets(logScale));
-			} else {
-				emitLinear(maxValue, numBuckets);
-			}
-		},
-		[emitLinear, logScale, maxValue, numBuckets, onChange],
-	);
-
-	const handleScaleChange = useCallback(
-		(value: string): void => {
-			if (!value) {
-				return;
-			}
-
-			const nextScale = Number(value);
-			setLogScale(nextScale);
-			onChange(logBuckets(nextScale));
-		},
-		[onChange],
-	);
-
-	const handleMaxValueChange = useCallback(
-		(value: number | string | null): void => {
-			const next = value === null || value === '' ? null : Number(value);
-			setMaxValue(next);
-			emitLinear(next, numBuckets);
-		},
-		[emitLinear, numBuckets],
-	);
-
-	const handleNumBucketsChange = useCallback(
-		(value: number | string | null): void => {
-			const next = value === null || value === '' ? null : Number(value);
-			setNumBuckets(next);
-			emitLinear(maxValue, next);
-		},
-		[emitLinear, maxValue],
-	);
-
-	// The toggle group takes a ReactNode label, which is how each item picks up the
-	// query builder's value type — the component exposes no font-family token.
-	const kindItems = useMemo(
-		() =>
-			BUCKET_KIND_OPTIONS.map(({ value, label }) => ({
-				value,
-				label: <span className={styles.toggleLabel}>{label}</span>,
-				'aria-label': label,
-			})),
-		[],
-	);
-
-	const scaleItems = useMemo(
-		() =>
-			LOG_SCALE_OPTIONS.map(({ value, label }) => ({
-				value,
-				label: <span className={styles.toggleLabel}>{label}</span>,
-				'aria-label': label,
-			})),
-		[],
-	);
-
-	// The kind toggle can be ahead of what has been emitted, so the preview describes
-	// the picked kind rather than the emitted options.
-	const previewedOptions = useMemo(():
-		| Querybuildertypesv5BucketOptionsDTO
-		| undefined => {
-		if (kind === Querybuildertypesv5BucketsKindDTO.log) {
-			return logBuckets(logScale);
-		}
-		if (kind === Querybuildertypesv5BucketsKindDTO.linear && maxValue !== null) {
-			return linearBuckets(maxValue, numBuckets);
-		}
-		return undefined;
-	}, [kind, logScale, maxValue, numBuckets]);
-
-	const bounds = useMemo(
-		() =>
-			kind === Querybuildertypesv5BucketsKindDTO.linear && !previewedOptions
-				? undefined
-				: previewUpperBounds(previewedOptions),
-		[kind, previewedOptions],
-	);
-
-	return (
-		<div className={styles.bucketOptions} data-testid="bucket-options">
-			<div className={styles.controls}>
-				<div className={styles.field}>
-					<span className={styles.label}>Bucket by</span>
-					<ToggleGroupSimple
-						type="single"
-						value={kind}
-						items={kindItems}
-						onChange={handleKindChange}
-						testId="bucket-options-kind"
-					/>
-				</div>
-
-				{kind === Querybuildertypesv5BucketsKindDTO.log && (
-					<div className={styles.field}>
-						<span className={styles.label}>Scale</span>
-						<ToggleGroupSimple
-							type="single"
-							value={String(logScale)}
-							items={scaleItems}
-							onChange={handleScaleChange}
-							testId="bucket-options-scale"
-						/>
-					</div>
-				)}
-
-				{kind === Querybuildertypesv5BucketsKindDTO.linear && (
-					<>
-						<div className={styles.field}>
-							<span className={styles.label}>Max value</span>
-							<InputNumber
-								className={styles.numberInput}
-								min={0}
-								value={maxValue}
-								onChange={handleMaxValueChange}
-								placeholder="Required"
-								status={maxValue !== null && maxValue <= 0 ? 'error' : undefined}
-								data-testid="bucket-options-max-value"
-							/>
-						</div>
-						<div className={styles.field}>
-							<span className={styles.label}>Buckets</span>
-							<InputNumber
-								className={styles.numberInput}
-								min={1}
-								max={MAX_NUM_BUCKETS}
-								precision={0}
-								value={numBuckets}
-								onChange={handleNumBucketsChange}
-								placeholder={`Default ${DEFAULT_NUM_BUCKETS}`}
-								data-testid="bucket-options-num-buckets"
-							/>
-						</div>
-					</>
-				)}
-
-				{onClose && (
-					<Button
-						color="secondary"
-						variant="ghost"
-						size="icon"
-						aria-label="Close bucket options"
-						className={styles.closeButton}
-						prefix={<ChevronUp size={16} />}
-						onClick={onClose}
-						data-testid="bucket-options-close"
-					/>
-				)}
-			</div>
-
-			<div className={styles.bounds} data-testid="bucket-options-bounds">
-				<span className={styles.label}>
-					Bounds
-					<Tooltip title={BUCKET_KIND_HINTS[kind]} placement="top">
-						<Info size={12} className={styles.hintIcon} />
-					</Tooltip>
-				</span>
-				{bounds ? (
-					<>
-						{bounds.map((bound) => (
-							<span className={styles.bound} key={bound}>
-								{formatUpperBound(bound, unit)}
-							</span>
-						))}
-						{hasBoundsBeyondPreview(previewedOptions) && (
-							<span className={styles.muted}>…</span>
-						)}
-						<span className={cx(styles.bound, styles.overflowBound)}>+Inf</span>
-					</>
-				) : (
-					<span className={styles.muted}>Set a max value to see the bounds</span>
-				)}
-			</div>
-		</div>
-	);
-}
-
-BucketOptions.defaultProps = {
-	bucketOptions: undefined,
-	unit: undefined,
-	onClose: undefined,
-};
-
-export default BucketOptions;

frontend/src/components/QueryBuilderV2/QueryV2/QueryAddOns/BucketOptions/__tests__/utils.test.ts

@@ -1,88 +0,0 @@
-import { MAX_LOG_SCALE } from '../constants';
-import {
-	bandsPerDoublingFromScale,
-	formatUpperBound,
-	hasBoundsBeyondPreview,
-	kindOptionOf,
-	linearBuckets,
-	logBuckets,
-	previewUpperBounds,
-} from '../utils';
-
-describe('bucket option scales', () => {
-	it.each([
-		[-2, 0.25],
-		[0, 1],
-		[1, 2],
-		[2, 4],
-		[3, 8],
-		[4, 16],
-	])('scale %i is %i bands per doubling', (scale, bands) => {
-		expect(bandsPerDoublingFromScale(scale)).toBe(bands);
-	});
-});
-
-describe('kindOptionOf', () => {
-	it('reads no options as log, the server default', () => {
-		expect(kindOptionOf(undefined)).toBe('log');
-	});
-
-	it('reads the kind off the options', () => {
-		expect(kindOptionOf(logBuckets(MAX_LOG_SCALE))).toBe('log');
-		expect(kindOptionOf(linearBuckets(10, null))).toBe('linear');
-	});
-});
-
-describe('previewUpperBounds', () => {
-	it('doubles at one band per doubling', () => {
-		expect(previewUpperBounds(logBuckets(0))).toStrictEqual([
-			1, 2, 4, 8, 16, 32, 64, 128,
-		]);
-	});
-
-	it('falls back to the finest log axis when no options are set', () => {
-		const bounds = previewUpperBounds(undefined);
-
-		expect(bounds).toHaveLength(8);
-		// 16 bands per doubling: the eighth bound is 2^(7/16), still short of the first doubling.
-		expect(bounds?.[7]).toBeCloseTo(2 ** (7 / 16));
-	});
-
-	it('spaces a linear axis evenly by bucket width', () => {
-		expect(previewUpperBounds(linearBuckets(100, 10))).toStrictEqual(
-			[10, 20, 30, 40, 50, 60, 70, 80, 90, 100].slice(0, 8),
-		);
-	});
-
-	it('stops at the last bucket when the axis has fewer than the preview shows', () => {
-		expect(previewUpperBounds(linearBuckets(9, 3))).toStrictEqual([3, 6, 9]);
-	});
-
-	it('has no bounds to preview for a linear axis without a usable max value', () => {
-		expect(previewUpperBounds(linearBuckets(0, null))).toBeUndefined();
-		expect(previewUpperBounds(linearBuckets(-1, null))).toBeUndefined();
-	});
-});
-
-describe('hasBoundsBeyondPreview', () => {
-	it('is always true for a log axis, which has no top', () => {
-		expect(hasBoundsBeyondPreview(logBuckets(0))).toBe(true);
-		expect(hasBoundsBeyondPreview(undefined)).toBe(true);
-	});
-
-	it('tracks whether a linear axis runs past the preview', () => {
-		expect(hasBoundsBeyondPreview(linearBuckets(100, 4))).toBe(false);
-		expect(hasBoundsBeyondPreview(linearBuckets(100, 20))).toBe(true);
-	});
-});
-
-describe('formatUpperBound', () => {
-	it('reads a bound in the panel unit when one is set', () => {
-		expect(formatUpperBound(1, 'ms')).toContain('ms');
-	});
-
-	it('keeps three significant digits when unitless', () => {
-		expect(formatUpperBound(128, undefined)).toBe('128');
-		expect(formatUpperBound(2 ** (1 / 16), undefined)).toBe('1.04');
-	});
-});

frontend/src/components/QueryBuilderV2/QueryV2/QueryAddOns/BucketOptions/constants.ts

@@ -1,54 +0,0 @@
-import { Querybuildertypesv5BucketsKindDTO } from 'api/generated/services/sigNoz.schemas';
-
-/**
- * Mirrors the limits `querybuildertypesv5` validates `bucketOptions` against. The
- * builder keeps its own copy so an out-of-range axis is refused before the request
- * rather than after it.
- */
-
-/**
- * A log axis spaces bounds at 2^scale bands per doubling. MaxLogScale is the
- * resolution ClickHouse buckets at, so it is both the finest available and what an
- * absent `bucketOptions` resolves to.
- */
-export const MAX_LOG_SCALE = 4;
-
-/** One band per 16x, the coarsest axis worth rendering. */
-export const MIN_LOG_SCALE = -4;
-
-export const MAX_NUM_BUCKETS = 512;
-
-export const DEFAULT_NUM_BUCKETS = 60;
-
-/** Every scale the request accepts, coarsest first. The bounds strip below says
- *  how coarse a given one is, so the numbers stand alone. */
-export const LOG_SCALES = Array.from(
-	{ length: MAX_LOG_SCALE - MIN_LOG_SCALE + 1 },
-	(_, index) => MIN_LOG_SCALE + index,
-);
-
-/** How many leading upper bounds the bounds strip previews before eliding. */
-export const PREVIEW_BOUND_COUNT = 8;
-
-export const BUCKET_KIND_OPTIONS: {
-	value: Querybuildertypesv5BucketsKindDTO;
-	label: string;
-}[] = [
-	{ value: Querybuildertypesv5BucketsKindDTO.log, label: 'Log' },
-	{ value: Querybuildertypesv5BucketsKindDTO.linear, label: 'Linear' },
-];
-
-export const LOG_SCALE_OPTIONS = LOG_SCALES.map((scale) => ({
-	value: String(scale),
-	label: String(scale),
-}));
-
-export const BUCKET_KIND_HINTS: Record<
-	Querybuildertypesv5BucketsKindDTO,
-	string
-> = {
-	[Querybuildertypesv5BucketsKindDTO.log]:
-		'Bounds are spaced evenly on a log axis, so every band is the same height on screen and the tail stays readable. A lower scale means fewer, coarser bands; scale 4, the finest, is the default.',
-	[Querybuildertypesv5BucketsKindDTO.linear]:
-		'Bounds are spaced evenly from 0 up to the max value, so a band covers the same width wherever it sits. Everything above the max value lands in a single overflow band.',
-};

frontend/src/components/QueryBuilderV2/QueryV2/QueryAddOns/BucketOptions/utils.ts

@@ -1,120 +0,0 @@
-import {
-	Querybuildertypesv5BucketOptionsDTO,
-	Querybuildertypesv5BucketOptionsLinearDTO,
-	Querybuildertypesv5BucketOptionsLinearDTOKind,
-	Querybuildertypesv5BucketOptionsLogDTO,
-	Querybuildertypesv5BucketOptionsLogDTOKind,
-	Querybuildertypesv5BucketsKindDTO,
-} from 'api/generated/services/sigNoz.schemas';
-import { getYAxisFormattedValue } from 'components/Graph/yAxisConfig';
-
-import {
-	DEFAULT_NUM_BUCKETS,
-	MAX_LOG_SCALE,
-	PREVIEW_BOUND_COUNT,
-} from './constants';
-
-export const isLinearBuckets = (
-	bucketOptions: Querybuildertypesv5BucketOptionsDTO,
-): bucketOptions is Querybuildertypesv5BucketOptionsLinearDTO =>
-	bucketOptions.kind === Querybuildertypesv5BucketOptionsLinearDTOKind.linear;
-
-export const linearBuckets = (
-	maxValue: number,
-	numBuckets: number | null,
-): Querybuildertypesv5BucketOptionsLinearDTO => ({
-	kind: Querybuildertypesv5BucketOptionsLinearDTOKind.linear,
-	spec: { maxValue, ...(numBuckets ? { numBuckets } : {}) },
-});
-
-export const logBuckets = (
-	scale: number,
-): Querybuildertypesv5BucketOptionsLogDTO => ({
-	kind: Querybuildertypesv5BucketOptionsLogDTOKind.log,
-	spec: { scale },
-});
-
-/**
- * The log spec's scale, defaulted the way the server defaults it. A linear axis has
- * no scale, so it reads as the default too.
- */
-export const logScaleOf = (
-	bucketOptions: Querybuildertypesv5BucketOptionsDTO | undefined,
-): number =>
-	bucketOptions && !isLinearBuckets(bucketOptions)
-		? (bucketOptions.spec.scale ?? MAX_LOG_SCALE)
-		: MAX_LOG_SCALE;
-
-/** A log axis places `2^scale` bounds per doubling. */
-export const bandsPerDoublingFromScale = (scale: number): number => 2 ** scale;
-
-export const kindOptionOf = (
-	bucketOptions: Querybuildertypesv5BucketOptionsDTO | undefined,
-): Querybuildertypesv5BucketsKindDTO =>
-	bucketOptions && isLinearBuckets(bucketOptions)
-		? Querybuildertypesv5BucketsKindDTO.linear
-		: Querybuildertypesv5BucketsKindDTO.log;
-
-/**
- * The leading upper bounds the axis will carry. A log axis is anchored at 1 — band
- * index 0's boundary — and a linear one at the top of its first band; both continue
- * past what the strip shows, and everything above the last one lands in the overflow
- * band the UI labels separately.
- *
- * `undefined` for a linear axis with no max value yet: without a top there is nothing
- * to divide.
- */
-export function previewUpperBounds(
-	bucketOptions: Querybuildertypesv5BucketOptionsDTO | undefined,
-): number[] | undefined {
-	if (bucketOptions && isLinearBuckets(bucketOptions)) {
-		const { maxValue, numBuckets = DEFAULT_NUM_BUCKETS } = bucketOptions.spec;
-
-		if (!Number.isFinite(maxValue) || maxValue <= 0 || numBuckets <= 0) {
-			return undefined;
-		}
-
-		const width = maxValue / numBuckets;
-
-		return Array.from(
-			{ length: Math.min(numBuckets, PREVIEW_BOUND_COUNT) },
-			(_, index) => (index + 1) * width,
-		);
-	}
-
-	const bands = bandsPerDoublingFromScale(logScaleOf(bucketOptions));
-
-	return Array.from(
-		{ length: PREVIEW_BOUND_COUNT },
-		(_, index) => 2 ** (index / bands),
-	);
-}
-
-/**
- * Whether the strip elides bounds after the ones it shows. A linear axis with no more
- * buckets than the strip holds ends where the strip does.
- */
-export function hasBoundsBeyondPreview(
-	bucketOptions: Querybuildertypesv5BucketOptionsDTO | undefined,
-): boolean {
-	if (!bucketOptions || !isLinearBuckets(bucketOptions)) {
-		return true;
-	}
-
-	return (
-		(bucketOptions.spec.numBuckets ?? DEFAULT_NUM_BUCKETS) > PREVIEW_BOUND_COUNT
-	);
-}
-
-/**
- * A bound is a value on the panel's own axis, so it reads in the panel's unit when one
- * is set. Unitless, three significant digits keep the tightly spaced bounds of a fine
- * log axis distinguishable without printing the float in full.
- */
-export function formatUpperBound(bound: number, unit?: string): string {
-	if (unit) {
-		return getYAxisFormattedValue(String(bound), unit);
-	}
-
-	return Number(bound.toPrecision(3)).toString();
-}

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

@@ -3,21 +3,14 @@ import { Button, Tooltip } from 'antd';
 import cx from 'classnames';
 import { ToggleGroupSimple } from '@signozhq/ui/toggle-group';
 import InputWithLabel from 'components/InputWithLabel/InputWithLabel';
-import { ATTRIBUTE_TYPES, PANEL_TYPES } from 'constants/queryBuilder';
+import { PANEL_TYPES } from 'constants/queryBuilder';
 import { GroupByFilter } from 'container/QueryBuilder/filters/GroupByFilter/GroupByFilter';
 import { OrderByFilter } from 'container/QueryBuilder/filters/OrderByFilter/OrderByFilter';
 import { ReduceToFilter } from 'container/QueryBuilder/filters/ReduceToFilter/ReduceToFilter';
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
 import { useQueryOperations } from 'hooks/queryBuilder/useQueryBuilderOperations';
 import { get, isEmpty } from 'lodash-es';
-import {
-	BarChart,
-	ChevronUp,
-	ExternalLink,
-	Grid3X3,
-	ScrollText,
-} from '@signozhq/icons';
-import { Querybuildertypesv5BucketOptionsDTO } from 'api/generated/services/sigNoz.schemas';
+import { BarChart, ChevronUp, ExternalLink, ScrollText } from '@signozhq/icons';
 import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 import { MetricAggregation } from 'types/api/v5/queryRange';
 import { DataSource, ReduceOperators } from 'types/common/queryBuilder';
@@ -32,7 +25,6 @@ import {
 	resolveQueryBuilderFields,
 } from '../../queryBuilderFields.utils';
 
-import BucketOptions from './BucketOptions/BucketOptions';
 import HavingFilter from './HavingFilter/HavingFilter';
 import { buildDefaultLegendFromGroupBy } from './utils';
 
@@ -65,7 +57,6 @@ const ADD_ONS_KEYS_TO_QUERY_PATH: Omit<
 	[QueryBuilderField.Limit]: 'limit',
 	[QueryBuilderField.Legend]: 'legend',
 	[QueryBuilderField.ReduceTo]: 'reduceTo',
-	[QueryBuilderField.BucketOptions]: 'bucketOptions',
 };
 
 const ADD_ONS: AddOn[] = [
@@ -125,22 +116,6 @@ const REDUCE_TO: AddOn = {
 		'https://signoz.io/docs/userguide/query-builder-v5/#result-manipulation',
 };
 
-// Offered only by a heatmap over metrics: the bucket axis is what a heatmap plots
-// against, and no other panel type sends one. A histogram brings its own buckets.
-const HISTOGRAM_ATTRIBUTE_TYPES = new Set<string>([
-	ATTRIBUTE_TYPES.HISTOGRAM,
-	ATTRIBUTE_TYPES.EXPONENTIAL_HISTOGRAM,
-]);
-
-const BUCKET_OPTIONS: AddOn = {
-	icon: <Grid3X3 size={14} />,
-	label: 'Bucket by',
-	key: QueryBuilderField.BucketOptions,
-	description:
-		'Choose how the bucket axis is spaced — logarithmically, so every band is the same height and the tail stays readable, or linearly up to a max value. Left to Auto, the query picks the finest log axis it can return.',
-	docLink: 'https://signoz.io/docs/userguide/query-builder-v5/',
-};
-
 const hasValue = (value: unknown): boolean =>
 	value != null && value !== '' && !(Array.isArray(value) && value.length === 0);
 
@@ -221,7 +196,7 @@ function QueryAddOns({
 		isForTraceOperator,
 	});
 
-	const { handleSetQueryData, currentQuery } = useQueryBuilder();
+	const { handleSetQueryData } = useQueryBuilder();
 
 	const supportedAddOns = useMemo((): AddOn[] => {
 		let addOns: AddOn[];
@@ -235,25 +210,8 @@ function QueryAddOns({
 			addOns = [...ADD_ONS];
 		}
 
-		if (showReduceTo) {
-			addOns = [...addOns, REDUCE_TO];
-		}
-
-		if (
-			panelType === PANEL_TYPES.HEATMAP &&
-			query.dataSource === DataSource.METRICS &&
-			!HISTOGRAM_ATTRIBUTE_TYPES.has(query.aggregateAttribute?.type ?? '')
-		) {
-			addOns = [...addOns, BUCKET_OPTIONS];
-		}
-
-		return addOns;
-	}, [
-		panelType,
-		query.dataSource,
-		query.aggregateAttribute?.type,
-		showReduceTo,
-	]);
+		return showReduceTo ? [...addOns, REDUCE_TO] : addOns;
+	}, [panelType, query.dataSource, showReduceTo]);
 
 	const resolvedFields = useMemo(
 		() =>
@@ -434,13 +392,6 @@ function QueryAddOns({
 		[handleChangeQueryData],
 	);
 
-	const handleChangeBucketOptions = useCallback(
-		(value: Querybuildertypesv5BucketOptionsDTO | undefined) => {
-			handleChangeQueryData('bucketOptions', value);
-		},
-		[handleChangeQueryData],
-	);
-
 	return (
 		<div className="query-add-ons" data-testid="query-add-ons">
 			{selectedViews.length > 0 && (
@@ -608,19 +559,6 @@ function QueryAddOns({
 							/>
 						</div>
 					)}
-
-					{selectedViews.find(
-						(view) => view.key === QueryBuilderField.BucketOptions,
-					) && (
-						<div className="add-on-content" data-testid="bucket-options-content">
-							<BucketOptions
-								bucketOptions={query.bucketOptions}
-								unit={currentQuery.unit}
-								onChange={handleChangeBucketOptions}
-								onClose={(): void => handleRemoveView(QueryBuilderField.BucketOptions)}
-							/>
-						</div>
-					)}
 				</div>
 			)}
 

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

@@ -1,4 +1,4 @@
-import { ATTRIBUTE_TYPES, PANEL_TYPES } from 'constants/queryBuilder';
+import { PANEL_TYPES } from 'constants/queryBuilder';
 import {
 	fireEvent,
 	render,
@@ -26,10 +26,8 @@ jest.mock('hooks/queryBuilder/useQueryBuilderOperations', () => ({
 jest.mock('hooks/queryBuilder/useQueryBuilder', () => ({
 	useQueryBuilder: (): {
 		handleSetQueryData: typeof mockHandleSetQueryData;
-		currentQuery: { unit: string | undefined };
 	} => ({
 		handleSetQueryData: mockHandleSetQueryData,
-		currentQuery: { unit: undefined },
 	}),
 }));
 
@@ -332,175 +330,4 @@ describe('QueryAddOns', () => {
 			expect.anything(),
 		);
 	});
-	describe('bucket options', () => {
-		function renderHeatmap(overrides: Partial<any> = {}): void {
-			render(
-				<QueryAddOns
-					query={baseQuery({ dataSource: DataSource.METRICS, ...overrides })}
-					version="v5"
-					isRawQuery={false}
-					showReduceTo={false}
-					panelType={PANEL_TYPES.HEATMAP}
-					index={0}
-					isForTraceOperator={false}
-				/>,
-			);
-		}
-
-		it('is offered on a metrics heatmap only', () => {
-			renderHeatmap();
-
-			expect(
-				screen.getByTestId('query-add-on-bucket_options'),
-			).toBeInTheDocument();
-		});
-
-		it('is not offered on other panel types', () => {
-			render(
-				<QueryAddOns
-					query={baseQuery({ dataSource: DataSource.METRICS })}
-					version="v5"
-					isRawQuery={false}
-					showReduceTo={false}
-					panelType={PANEL_TYPES.TIME_SERIES}
-					index={0}
-					isForTraceOperator={false}
-				/>,
-			);
-
-			expect(
-				screen.queryByTestId('query-add-on-bucket_options'),
-			).not.toBeInTheDocument();
-		});
-
-		it('is not offered on a heatmap over another signal', () => {
-			render(
-				<QueryAddOns
-					query={baseQuery({ dataSource: DataSource.LOGS })}
-					version="v5"
-					isRawQuery={false}
-					showReduceTo={false}
-					panelType={PANEL_TYPES.HEATMAP}
-					index={0}
-					isForTraceOperator={false}
-				/>,
-			);
-
-			expect(
-				screen.queryByTestId('query-add-on-bucket_options'),
-			).not.toBeInTheDocument();
-		});
-
-		it.each([ATTRIBUTE_TYPES.HISTOGRAM, ATTRIBUTE_TYPES.EXPONENTIAL_HISTOGRAM])(
-			'is not offered for a %s metric, which carries its own buckets',
-			(type) => {
-				renderHeatmap({
-					aggregateAttribute: { key: 'http_duration_bucket', type },
-				});
-
-				expect(
-					screen.queryByTestId('query-add-on-bucket_options'),
-				).not.toBeInTheDocument();
-			},
-		);
-
-		it("auto-opens on the query's own kind", () => {
-			renderHeatmap({ bucketOptions: { kind: 'log', spec: { scale: 0 } } });
-
-			expect(screen.getByTestId('bucket-options-content')).toBeInTheDocument();
-			expect(screen.getByRole('radio', { name: 'Log' })).toBeChecked();
-			expect(screen.getByRole('radio', { name: '0' })).toBeChecked();
-		});
-
-		it('shows the server default, log at scale 4, without sending it', async () => {
-			const user = userEvent.setup();
-			renderHeatmap();
-
-			await user.click(screen.getByTestId('query-add-on-bucket_options'));
-
-			expect(screen.getByRole('radio', { name: 'Log' })).toBeChecked();
-			expect(screen.getByRole('radio', { name: '4' })).toBeChecked();
-			expect(
-				screen.queryByRole('radio', { name: 'Auto' }),
-			).not.toBeInTheDocument();
-			expect(mockHandleChangeQueryData).not.toHaveBeenCalledWith(
-				'bucketOptions',
-				expect.anything(),
-			);
-		});
-
-		it('sends the picked scale', async () => {
-			const user = userEvent.setup();
-			renderHeatmap({ bucketOptions: { kind: 'log', spec: { scale: 4 } } });
-
-			await user.click(screen.getByRole('radio', { name: '0' }));
-
-			expect(mockHandleChangeQueryData).toHaveBeenCalledWith('bucketOptions', {
-				kind: 'log',
-				spec: { scale: 0 },
-			});
-		});
-
-		it('offers the coarser scales the request accepts below one band per doubling', async () => {
-			const user = userEvent.setup();
-			renderHeatmap({ bucketOptions: { kind: 'log', spec: { scale: 0 } } });
-
-			await user.click(screen.getByRole('radio', { name: '-4' }));
-
-			expect(mockHandleChangeQueryData).toHaveBeenCalledWith('bucketOptions', {
-				kind: 'log',
-				spec: { scale: -4 },
-			});
-		});
-
-		it('previews the bounds the picked axis will carry', () => {
-			renderHeatmap({ bucketOptions: { kind: 'log', spec: { scale: 0 } } });
-
-			const bounds = within(screen.getByTestId('bucket-options-bounds'));
-			['1', '2', '4', '8', '16', '32', '64', '128', '+Inf'].forEach((bound) => {
-				expect(bounds.getByText(bound)).toBeInTheDocument();
-			});
-		});
-
-		it('sends nothing for a linear axis until it has a max value', async () => {
-			const user = userEvent.setup();
-			renderHeatmap({ bucketOptions: { kind: 'log', spec: { scale: 0 } } });
-
-			await user.click(screen.getByRole('radio', { name: 'Linear' }));
-
-			expect(mockHandleChangeQueryData).toHaveBeenLastCalledWith(
-				'bucketOptions',
-				undefined,
-			);
-			expect(
-				screen.getByText('Set a max value to see the bounds'),
-			).toBeInTheDocument();
-		});
-
-		it('sends the linear axis once a max value is filled in', async () => {
-			const user = userEvent.setup();
-			renderHeatmap({ bucketOptions: { kind: 'log', spec: { scale: 0 } } });
-
-			await user.click(screen.getByRole('radio', { name: 'Linear' }));
-			await user.type(screen.getByTestId('bucket-options-max-value'), '500');
-
-			await waitFor(() => {
-				expect(mockHandleChangeQueryData).toHaveBeenLastCalledWith(
-					'bucketOptions',
-					{ kind: 'linear', spec: { maxValue: 500 } },
-				);
-			});
-		});
-
-		it('closes back to the toggle bar', async () => {
-			const user = userEvent.setup();
-			renderHeatmap({ bucketOptions: { kind: 'log', spec: { scale: 0 } } });
-
-			await user.click(screen.getByTestId('bucket-options-close'));
-
-			expect(
-				screen.queryByTestId('bucket-options-content'),
-			).not.toBeInTheDocument();
-		});
-	});
 });

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

@@ -16,7 +16,6 @@ export enum QueryBuilderField {
 	Limit = 'limit',
 	Legend = 'legend_format',
 	ReduceTo = 'reduce_to',
-	BucketOptions = 'bucket_options',
 	// Builder level
 	Formula = 'formula',
 	AdditionalQueries = 'additional_queries',

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

@@ -76,7 +76,6 @@ export const RAW_QUERY_FIELDS: Omit<
 	[QueryBuilderField.Limit]: { state: 'hidden' },
 	[QueryBuilderField.Legend]: { state: 'hidden' },
 	[QueryBuilderField.ReduceTo]: { state: 'hidden' },
-	[QueryBuilderField.BucketOptions]: { state: 'hidden' },
 	[QueryBuilderField.Formula]: { state: 'hidden' },
 	[QueryBuilderField.OrderBy]: { state: 'pinned' },
 };

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

@@ -2,8 +2,6 @@
 	display: flex;
 	flex-direction: row;
 	position: relative;
-	flex: 1;
-	min-height: 0;
 
 	.quick-filters-settings-container {
 		flex: 0 0 0;
@@ -12,7 +10,6 @@
 		overflow: visible;
 		position: relative;
 		align-self: stretch;
-		clip-path: inset(0 -100vw 0 0);
 	}
 }
 

frontend/src/components/QuickFilters/QuickFilters.tsx

@@ -57,7 +57,6 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 		showFilterCollapse = true,
 		showQueryName = true,
 		useFieldApis,
-		savedViewsHeader,
 	} = props;
 	const [isSettingsOpen, setIsSettingsOpen] = useState(false);
 	const [params, setParams] = useApiMonitoringParams();
@@ -380,7 +379,6 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 	return (
 		<div className="quick-filters-container">
 			<div className="quick-filters">
-				{savedViewsHeader}
 				{source !== QuickFiltersSource.INFRA_MONITORING && (
 					<section className="header">
 						{renderLeftActions()}

frontend/src/components/QuickFilters/QuickFiltersLayout/QuickFiltersLayout.module.scss

@@ -1,73 +0,0 @@
-// The one `overflow: hidden` in the chain. Ancestors (RouteTab, AppLayout)
-// only hand height down; each pane below owns its own scroll.
-.layout {
-	display: flex;
-	flex: 1;
-	height: 100%;
-	min-height: 0;
-	overflow: hidden;
-}
-
-.sidebar {
-	width: 280px;
-	flex-shrink: 0;
-	display: flex;
-	flex-direction: column;
-	min-height: 0;
-	position: relative;
-	overflow: visible;
-	z-index: 2;
-}
-
-.savedViews {
-	flex: 1;
-	min-height: 0;
-	display: flex;
-	flex-direction: column;
-	background: var(--l1-background);
-	border-right: 1px solid var(--l1-border);
-}
-
-.quickFilters {
-	position: absolute;
-	inset: 0;
-	display: flex;
-	flex-direction: column;
-	min-height: 0;
-	background: var(--l1-background);
-	transition: transform 0.2s ease-in-out;
-	z-index: 1;
-
-	&.isOpen {
-		transform: translateX(100%);
-	}
-}
-
-// No quick filters: the header sits in flow and the list stays under it
-.isStatic {
-	border-right: 1px solid var(--l1-border);
-
-	.quickFilters {
-		position: static;
-		flex-shrink: 0;
-	}
-
-	.savedViews {
-		border-right: 0;
-	}
-}
-
-// Bounded box for the OverlayScrollbar inside it (`.overlay-scrollbar` is
-// `height: 100%`), which owns the scrolling.
-.content {
-	flex: 1;
-	min-width: 0;
-	min-height: 0;
-	display: flex;
-	flex-direction: column;
-	overflow: hidden;
-}
-
-.contentInner {
-	height: 100%;
-}

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

@@ -1,104 +0,0 @@
-import { ComponentProps, ReactNode, useState } from 'react';
-import cx from 'classnames';
-import OverlayScrollbar from 'components/OverlayScrollbar/OverlayScrollbar';
-import SavedViewsHeader from 'container/SavedViews/SavedViewsHeader';
-import SavedViewsPanel from 'container/SavedViews/SavedViewsPanel';
-import { useSavedViewEnabled } from 'hooks/useSavedViewEnabled';
-
-import QuickFilters from '../QuickFilters';
-
-import styles from './QuickFiltersLayout.module.scss';
-
-// Same optionality as `<QuickFilters />` in JSX (honours its defaultProps).
-type QuickFiltersElementProps = JSX.LibraryManagedAttributes<
-	typeof QuickFilters,
-	ComponentProps<typeof QuickFilters>
->;
-
-// What the page configures; the layout adds the open / close wiring.
-type SavedViewsElementProps = Omit<
-	ComponentProps<typeof SavedViewsPanel>,
-	'onClose'
->;
-
-export interface QuickFiltersLayoutProps {
-	quickFilterProps?: QuickFiltersElementProps;
-	savedViewProps?: SavedViewsElementProps;
-	showFilters: boolean;
-	className?: string;
-	contentClassName?: string;
-	testId?: string;
-	children: ReactNode;
-}
-
-function QuickFiltersLayout({
-	quickFilterProps,
-	savedViewProps,
-	showFilters,
-	className,
-	contentClassName,
-	testId,
-	children,
-}: QuickFiltersLayoutProps): JSX.Element {
-	const [isViewsOpen, setIsViewsOpen] = useState(false);
-	const isSavedViewEnabled = useSavedViewEnabled();
-
-	const hasQuickFilters = !!quickFilterProps;
-	const hasSavedViews = !!savedViewProps && isSavedViewEnabled;
-
-	const showSidebar = showFilters && (hasQuickFilters || hasSavedViews);
-
-	const isPanelPinned = hasSavedViews && !hasQuickFilters;
-
-	const isSliding = hasQuickFilters && isViewsOpen;
-
-	const savedViewsHeader = hasSavedViews ? (
-		<SavedViewsHeader
-			{...savedViewProps}
-			onOpenViews={isPanelPinned ? undefined : (): void => setIsViewsOpen(true)}
-		/>
-	) : undefined;
-
-	return (
-		<div className={cx(styles.layout, className)} data-testid={testId}>
-			{showSidebar && (
-				<aside
-					className={cx(styles.sidebar, { [styles.isStatic]: !hasQuickFilters })}
-					data-testid="quick-filters-layout-filters"
-				>
-					<div
-						className={cx(styles.quickFilters, { [styles.isOpen]: isSliding })}
-						data-testid="quick-filters-layout-drawer"
-					>
-						{hasQuickFilters ? (
-							<QuickFilters
-								{...quickFilterProps}
-								savedViewsHeader={savedViewsHeader}
-							/>
-						) : (
-							savedViewsHeader
-						)}
-					</div>
-					<div className={styles.savedViews}>
-						{hasSavedViews && (isPanelPinned || isViewsOpen) && (
-							<SavedViewsPanel
-								{...savedViewProps}
-								onClose={isPanelPinned ? undefined : (): void => setIsViewsOpen(false)}
-							/>
-						)}
-					</div>
-				</aside>
-			)}
-			<section
-				className={cx(styles.content, contentClassName)}
-				data-testid="quick-filters-layout-content"
-			>
-				<OverlayScrollbar>
-					<div className={styles.contentInner}>{children}</div>
-				</OverlayScrollbar>
-			</section>
-		</div>
-	);
-}
-
-export default QuickFiltersLayout;

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

@@ -1,226 +0,0 @@
-import { SavedviewtypesSourceDTO } from 'api/generated/services/sigNoz.schemas';
-import { useSavedViewEnabled } from 'hooks/useSavedViewEnabled';
-import { render, screen, userEvent } from 'tests/test-utils';
-
-import { QuickFiltersSource } from '../../types';
-import QuickFiltersLayout from '../QuickFiltersLayout';
-
-jest.mock('../QuickFiltersLayout.module.scss', () => ({
-	__esModule: true,
-	default: {
-		layout: 'layout',
-		sidebar: 'sidebar',
-		isStatic: 'isStatic',
-		savedViews: 'savedViews',
-		quickFilters: 'quickFilters',
-		isOpen: 'isOpen',
-		content: 'content',
-		contentInner: 'contentInner',
-	},
-}));
-
-jest.mock('hooks/useSavedViewEnabled', () => ({
-	useSavedViewEnabled: jest.fn(() => true),
-}));
-
-jest.mock('../../QuickFilters', () => ({
-	__esModule: true,
-	default: ({
-		source,
-		savedViewsHeader,
-	}: {
-		source: string;
-		savedViewsHeader?: React.ReactNode;
-	}): JSX.Element => (
-		<div data-testid="quick-filters">
-			{savedViewsHeader}
-			{source}
-		</div>
-	),
-}));
-
-const quickFilterProps = {
-	source: QuickFiltersSource.TRACES_EXPLORER,
-	handleFilterVisibilityChange: jest.fn(),
-};
-const savedViewProps = { source: SavedviewtypesSourceDTO.traces };
-
-const drawer = (): HTMLElement =>
-	screen.getByTestId('quick-filters-layout-drawer');
-
-describe('QuickFiltersLayout', () => {
-	beforeEach(() => {
-		jest.mocked(useSavedViewEnabled).mockReturnValue(true);
-	});
-
-	it('renders QuickFilters with the given props inside the filters pane', () => {
-		render(
-			<QuickFiltersLayout showFilters quickFilterProps={quickFilterProps}>
-				<div>content</div>
-			</QuickFiltersLayout>,
-		);
-
-		const filtersPane = screen.getByTestId('quick-filters-layout-filters');
-		expect(filtersPane).toContainElement(screen.getByTestId('quick-filters'));
-		expect(screen.getByTestId('quick-filters')).toHaveTextContent(
-			QuickFiltersSource.TRACES_EXPLORER,
-		);
-		expect(screen.getByTestId('quick-filters-layout-content')).toHaveTextContent(
-			'content',
-		);
-		expect(screen.queryByTestId('saved-views-header')).not.toBeInTheDocument();
-	});
-
-	it('does not render the filters pane when showFilters is false', () => {
-		render(
-			<QuickFiltersLayout
-				showFilters={false}
-				quickFilterProps={quickFilterProps}
-				savedViewProps={savedViewProps}
-			>
-				<div>content</div>
-			</QuickFiltersLayout>,
-		);
-
-		expect(
-			screen.queryByTestId('quick-filters-layout-filters'),
-		).not.toBeInTheDocument();
-		expect(screen.queryByTestId('quick-filters')).not.toBeInTheDocument();
-		expect(screen.getByText('content')).toBeInTheDocument();
-	});
-
-	it('renders no sidebar at all without quick filters or saved views', () => {
-		render(
-			<QuickFiltersLayout showFilters>
-				<div>content</div>
-			</QuickFiltersLayout>,
-		);
-
-		expect(
-			screen.queryByTestId('quick-filters-layout-filters'),
-		).not.toBeInTheDocument();
-		expect(screen.getByText('content')).toBeInTheDocument();
-	});
-
-	it('merges classNames onto the root and content panes', () => {
-		render(
-			<QuickFiltersLayout
-				showFilters
-				quickFilterProps={quickFilterProps}
-				className="root-extra"
-				contentClassName="content-extra"
-				testId="layout"
-			>
-				<div>content</div>
-			</QuickFiltersLayout>,
-		);
-
-		expect(screen.getByTestId('layout')).toHaveClass('layout', 'root-extra');
-		expect(screen.getByTestId('quick-filters-layout-content')).toHaveClass(
-			'content',
-			'content-extra',
-		);
-	});
-
-	describe('saved views', () => {
-		it('ignores savedViewProps while the flag is off', () => {
-			jest.mocked(useSavedViewEnabled).mockReturnValue(false);
-			const { unmount } = render(
-				<QuickFiltersLayout
-					showFilters
-					quickFilterProps={quickFilterProps}
-					savedViewProps={savedViewProps}
-				>
-					<div>content</div>
-				</QuickFiltersLayout>,
-			);
-
-			expect(screen.getByTestId('quick-filters')).toBeInTheDocument();
-			expect(screen.queryByTestId('saved-views-header')).not.toBeInTheDocument();
-			expect(screen.queryByTestId('saved-views-panel')).not.toBeInTheDocument();
-
-			// Saved views only, so nothing is left to show.
-			unmount();
-			render(
-				<QuickFiltersLayout showFilters savedViewProps={savedViewProps}>
-					<div>content</div>
-				</QuickFiltersLayout>,
-			);
-			expect(
-				screen.queryByTestId('quick-filters-layout-filters'),
-			).not.toBeInTheDocument();
-		});
-
-		it('opens the panel from the header and slides the quick filters drawer, keeping the same QuickFilters node', async () => {
-			render(
-				<QuickFiltersLayout
-					showFilters
-					quickFilterProps={quickFilterProps}
-					savedViewProps={savedViewProps}
-				>
-					<div>content</div>
-				</QuickFiltersLayout>,
-			);
-			const user = userEvent.setup();
-			const quickFilters = screen.getByTestId('quick-filters');
-
-			expect(quickFilters).toContainElement(
-				screen.getByTestId('saved-views-header'),
-			);
-			expect(drawer()).toContainElement(quickFilters);
-			expect(screen.queryByTestId('saved-views-panel')).not.toBeInTheDocument();
-			expect(drawer()).not.toHaveClass('isOpen');
-
-			await user.click(screen.getByTestId('saved-views-open'));
-
-			expect(screen.getByTestId('saved-views-panel')).toBeInTheDocument();
-			expect(drawer()).toHaveClass('isOpen');
-			expect(screen.getByTestId('quick-filters')).toBe(quickFilters);
-
-			await user.click(screen.getByTestId('saved-views-close'));
-
-			expect(screen.queryByTestId('saved-views-panel')).not.toBeInTheDocument();
-			expect(drawer()).not.toHaveClass('isOpen');
-			expect(screen.getByTestId('quick-filters')).toBe(quickFilters);
-		});
-
-		it('hands the source to the header and the panel', async () => {
-			render(
-				<QuickFiltersLayout
-					showFilters
-					quickFilterProps={quickFilterProps}
-					savedViewProps={savedViewProps}
-				>
-					<div>content</div>
-				</QuickFiltersLayout>,
-			);
-
-			expect(screen.getByTestId('saved-views-header')).toHaveAttribute(
-				'data-source',
-				SavedviewtypesSourceDTO.traces,
-			);
-			await userEvent.setup().click(screen.getByTestId('saved-views-open'));
-			expect(screen.getByTestId('saved-views-panel')).toHaveAttribute(
-				'data-source',
-				SavedviewtypesSourceDTO.traces,
-			);
-		});
-
-		it('without quick filters: static sidebar, header on top, list always on screen with no open or close controls', () => {
-			render(
-				<QuickFiltersLayout showFilters savedViewProps={savedViewProps}>
-					<div>content</div>
-				</QuickFiltersLayout>,
-			);
-
-			const sidebar = screen.getByTestId('quick-filters-layout-filters');
-			expect(sidebar).toHaveClass('isStatic');
-			expect(screen.queryByTestId('quick-filters')).not.toBeInTheDocument();
-			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-close')).not.toBeInTheDocument();
-			expect(drawer()).not.toHaveClass('isOpen');
-		});
-	});
-});

frontend/src/components/QuickFilters/QuickFiltersSettings/QuickFiltersSettings.styles.scss

@@ -6,22 +6,29 @@
 	left: 0;
 	z-index: 999;
 	width: 342px;
-	height: 100%;
 	background: var(--l1-background);
-	border-right: 1px solid var(--l1-border);
+	transition: width 0.05s ease-in-out;
 	overflow: hidden;
 	color: var(--l1-foreground);
-	transition:
-		transform 0.2s ease-in-out,
-		visibility 0s;
+
+	&.qf-logs-explorer {
+		height: calc(100vh - 45px);
+	}
+
+	&.qf-exceptions {
+		height: 100vh;
+	}
+
+	&.qf-api-monitoring {
+		height: calc(100vh - 45px);
+	}
+
+	&.qf-traces-explorer {
+		height: calc(100vh - 45px);
+	}
 
 	&.hidden {
-		transform: translateX(-100%);
-		visibility: hidden;
-		pointer-events: none;
-		transition:
-			transform 0.2s ease-in-out,
-			visibility 0s 0.2s;
+		width: 0;
 	}
 	.qf-header {
 		display: flex;

frontend/src/components/QuickFilters/types.ts

@@ -1,4 +1,3 @@
-import { ReactNode } from 'react';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';
 import { DataSource } from 'types/common/queryBuilder';
@@ -62,7 +61,6 @@ export interface IQuickFiltersProps {
 	showFilterCollapse?: boolean;
 	showQueryName?: boolean;
 	useFieldApis?: QuickFilterCheckboxUseFieldApis;
-	savedViewsHeader?: ReactNode;
 }
 
 export enum QuickFiltersSource {

frontend/src/components/RouteTab/RouteTab.module.scss

@@ -1,38 +0,0 @@
-// Hands the parent's height down to the active pane and lets the pane scroll
-// its own content, so TopNav and the tab bar stay put. Child combinators only
-// (nested Tabs must not be caught).
-.routeTab {
-	flex: 1;
-	min-height: 0;
-}
-
-.routeTab > :global(.ant-tabs-content-holder) {
-	display: flex;
-	flex-direction: column;
-}
-
-.routeTab > :global(.ant-tabs-content-holder) > :global(.ant-tabs-content) {
-	flex: 1;
-	min-height: 0;
-	display: flex;
-	flex-direction: column;
-}
-
-.routeTab
-	> :global(.ant-tabs-content-holder)
-	> :global(.ant-tabs-content)
-	> :global(.ant-tabs-tabpane-active) {
-	flex: 1;
-	min-height: 0;
-	display: flex;
-	flex-direction: column;
-}
-
-.routeTab
-	> :global(.ant-tabs-content-holder)
-	> :global(.ant-tabs-content)
-	> :global(.ant-tabs-tabpane-active)
-	> :global(.overlay-scrollbar) {
-	flex: 1;
-	min-height: 0;
-}

frontend/src/components/RouteTab/RouteTab.test.tsx

@@ -5,11 +5,6 @@ import { fireEvent, render, screen } from 'tests/test-utils';
 import RouteTab from './index';
 import { RouteTabProps } from './types';
 
-jest.mock('./RouteTab.module.scss', () => ({
-	__esModule: true,
-	default: { routeTab: 'routeTab' },
-}));
-
 function DummyComponent1(): JSX.Element {
 	return <div>Dummy Component 1</div>;
 }
@@ -79,36 +74,6 @@ describe('RouteTab component', () => {
 		expect(history.location.pathname).toBe('/tab2');
 	});
 
-	it('applies the layout class alongside a custom className', () => {
-		const history = createMemoryHistory();
-		const { container } = render(
-			<Router history={history}>
-				<RouteTab
-					history={history}
-					routes={testRoutes}
-					activeKey="Tab1"
-					className="custom-tabs"
-				/>
-			</Router>,
-		);
-		expect(container.querySelector('.ant-tabs')).toHaveClass(
-			'routeTab',
-			'custom-tabs',
-		);
-	});
-
-	it('renders the active tab content inside an overlay scrollbar', () => {
-		const history = createMemoryHistory();
-		const { container } = render(
-			<Router history={history}>
-				<RouteTab history={history} routes={testRoutes} activeKey="Tab1" />
-			</Router>,
-		);
-		expect(
-			container.querySelector('.ant-tabs-tabpane-active > .overlay-scrollbar'),
-		).toHaveTextContent('Dummy Component 1');
-	});
-
 	it('calls onChangeHandler on tab change', () => {
 		const onChangeHandler = jest.fn();
 		const history = createMemoryHistory();

frontend/src/components/RouteTab/index.tsx

@@ -5,32 +5,20 @@ import {
 	useParams,
 } from 'react-router-dom';
 import { Tabs, TabsProps } from 'antd';
-import cx from 'classnames';
 import HeaderRightSection from 'components/HeaderRightSection/HeaderRightSection';
-import OverlayScrollbar from 'components/OverlayScrollbar/OverlayScrollbar';
 
 import { RouteTabProps } from './types';
 
-import styles from './RouteTab.module.scss';
-
 interface Params {
 	[key: string]: string;
 }
 
-/**
- * Each pane scrolls its own content inside an OverlayScrollbar, so the tab bar
- * stays put. Mounted as the page root the pane is bounded to the viewport; inside
- * a plain block wrapper the scroller is inert and the page scrolls as usual.
- * Pane content that needs a bounded box must size itself with `height: 100%`
- * (the scroller's viewport is block flow, so `flex: 1` has no effect there).
- */
 function RouteTab({
 	routes,
 	activeKey,
 	onChangeHandler,
 	history,
 	showRightSection,
-	className,
 	...rest
 }: RouteTabProps & TabsProps): JSX.Element {
 	const params = useParams<Params>();
@@ -62,16 +50,11 @@ function RouteTab({
 		label: name,
 		key,
 		tabKey: route,
-		children: (
-			<OverlayScrollbar>
-				<Component />
-			</OverlayScrollbar>
-		),
+		children: <Component />,
 	}));
 
 	return (
 		<Tabs
-			className={cx(styles.routeTab, className)}
 			onChange={onChange}
 			destroyInactiveTabPane
 			activeKey={currentRoute?.key || activeKey}

frontend/src/constants/generated/semconvFamilies.gen.ts

@@ -1,82 +1,32 @@
 // Code generated by scripts/semconv. DO NOT EDIT.
 
-// An empty contexts/signals/applyToMetrics array places no constraint on
-// that axis.
-export type SemconvMember = {
-	readonly name: string;
-	readonly contexts: readonly string[];
-	readonly signals: readonly string[];
-	readonly applyToMetrics: readonly string[];
-};
-
 export type SemconvFamily = {
 	readonly current: string;
+	readonly old: readonly string[];
 	readonly kind: 'attribute' | 'metric';
-	readonly members: readonly SemconvMember[];
 	readonly contexts: readonly string[];
 	readonly signals: readonly string[];
+	readonly applyToMetrics: readonly string[];
 	readonly valueMap: Readonly<Record<string, string>>;
 };
 
 export const SEMCONV_FAMILIES: readonly SemconvFamily[] = [
 	{
-		current: 'container.cpu.usage',
-		kind: 'metric',
-		members: [
-			{
-				name: 'container.cpu.utilization',
-				contexts: [],
-				signals: [],
-				applyToMetrics: [],
-			},
-		],
+		current: 'db.system.name',
+		old: ['db.system'],
+		kind: 'attribute',
 		contexts: [],
 		signals: [],
+		applyToMetrics: [],
 		valueMap: {},
 	},
 	{
 		current: 'deployment.environment.name',
+		old: ['deployment.environment'],
 		kind: 'attribute',
-		members: [
-			{
-				name: 'deployment.environment',
-				contexts: [],
-				signals: [],
-				applyToMetrics: [],
-			},
-		],
-		contexts: ['attribute', 'resource'],
-		signals: ['logs', 'metrics', 'traces'],
-		valueMap: {},
-	},
-	{
-		current: 'k8s.node.cpu.usage',
-		kind: 'metric',
-		members: [
-			{
-				name: 'k8s.node.cpu.utilization',
-				contexts: [],
-				signals: [],
-				applyToMetrics: [],
-			},
-		],
-		contexts: [],
-		signals: [],
-		valueMap: {},
-	},
-	{
-		current: 'k8s.pod.cpu.usage',
-		kind: 'metric',
-		members: [
-			{
-				name: 'k8s.pod.cpu.utilization',
-				contexts: [],
-				signals: [],
-				applyToMetrics: [],
-			},
-		],
 		contexts: [],
 		signals: [],
+		applyToMetrics: [],
 		valueMap: {},
 	},
 ] as const;

frontend/src/constants/localStorage.ts

@@ -47,5 +47,4 @@ export enum LOCALSTORAGE {
 	DASHBOARDS_LIST_VIEWS = 'DASHBOARDS_LIST_VIEWS',
 	DASHBOARD_V2_PANEL_COLUMN_WIDTHS = 'DASHBOARD_V2_PANEL_COLUMN_WIDTHS',
 	LLM_ATTRIBUTE_MAPPING_TEST_SPAN = 'LLM_ATTRIBUTE_MAPPING_TEST_SPAN',
-	SAVED_VIEW_ENABLED = 'SAVED_VIEW_ENABLED',
 }

frontend/src/constants/panelTypes.ts

@@ -32,8 +32,6 @@ export const getComponentForPanelType = (
 		[PANEL_TYPES.AREA]: Uplot,
 		[PANEL_TYPES.PIE]: null,
 		[PANEL_TYPES.HISTOGRAM]: Uplot,
-		// V2-only kind; it renders through the V2 panel registry.
-		[PANEL_TYPES.HEATMAP]: null,
 		// Dashboards v2 renders this kind; nothing reaches the V1 chart map for it.
 		[PANEL_TYPES.TEXT]: null,
 		[PANEL_TYPES.EMPTY_WIDGET]: null,

frontend/src/constants/queryBuilder.ts

@@ -339,7 +339,6 @@ export enum PANEL_TYPES {
 	AREA = 'area',
 	PIE = 'pie',
 	HISTOGRAM = 'histogram',
-	HEATMAP = 'heatmap',
 	TEXT = 'text',
 	EMPTY_WIDGET = 'EMPTY_WIDGET',
 }

frontend/src/constants/queryBuilderOperators.ts

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

frontend/src/constants/routes.ts

@@ -38,6 +38,7 @@ const ROUTES = {
 	LOGS_BASE: '/logs',
 	LOGS: '/logs/logs-explorer',
 	LOGS_EXPLORER: '/logs/logs-explorer',
+	LIVE_LOGS: '/logs/logs-explorer/live',
 	LOGS_PIPELINES: '/logs/pipelines',
 	PASSWORD_RESET: '/password-reset',
 	LIST_LICENSES: '/licenses',

frontend/src/constants/theme.ts

@@ -129,10 +129,6 @@ const themeColors = {
 		salmon2: '#FFAB91',
 		salmon3: '#E0876A',
 	},
-	/* Series palette (dark). Hues in the red band are deliberately absent: red is
-	   reserved for thresholds and error states, so an arbitrary series must never
-	   claim it. generateColor indexes by `hash % Object.keys(...).length`, so
-	   adding or removing an entry recolors every existing chart. */
 	chartcolors: {
 		// Blues (3)
 		dodgerBlue: '#2F80ED',
@@ -156,13 +152,13 @@ const themeColors = {
 
 		// Oranges (3)
 		festivalOrange: '#F2994A',
-		amber1: '#E1A155',
+		coralOrange: '#E17055',
 		pumpkin: '#FF7F50',
 
-		// Olives / Greens (3)
-		olive1: '#DFC33A',
-		olive2: '#D5E55D',
-		green7: '#81C220',
+		// Reds (3)
+		radicalRed: '#FF1A66',
+		crimsonRed: '#EB5757',
+		fireRed: '#E10600',
 
 		// Pinks (3)
 		hotPink: '#E84393',
@@ -195,9 +191,9 @@ const themeColors = {
 		orange1: '#D35400',
 		orange2: '#E67E22',
 		orange3: '#F5B041',
-		green8: '#5AC02B',
-		green9: '#48E043',
-		green10: '#68E788',
+		red1: '#C0392B',
+		red2: '#E74C3C',
+		red3: '#EC7063',
 		pink1: '#D81B60',
 		pink2: '#E91E63',
 		pink3: '#F06292',
@@ -216,9 +212,9 @@ const themeColors = {
 		coral1: '#E67E22',
 		coral2: '#F39C12',
 		coral3: '#F5B041',
-		teal7: '#2BC07B',
-		teal8: '#43E0C5',
-		teal9: '#68D9E7',
+		crimson1: '#C0392B',
+		crimson2: '#E74C3C',
+		crimson3: '#EC7063',
 		violet1: '#8E44AD',
 		violet2: '#9B59B6',
 		violet3: '#BB8FCE',
@@ -228,18 +224,18 @@ const themeColors = {
 		forest1: '#27AE60',
 		forest2: '#2ECC71',
 		forest3: '#58D68D',
-		cyan4: '#83C2EB',
+		blush1: '#FF6F91',
 		blush2: '#FF85A2',
 		blush3: '#FFA0B3',
 		lavender1: '#9B59B6',
 		lavender2: '#AF7AC5',
 		lavender3: '#C39BD3',
-		blue7: '#4375E0',
-		blue8: '#686DE7',
-		indigo1: '#A68EED',
-		indigo2: '#B980EA',
-		purple6: '#EE98D9',
-		olive3: '#F2F0AE',
+		tomato1: '#E74C3C',
+		tomato2: '#EC7063',
+		tomato3: '#F1948A',
+		salmon1: '#FF6B6B',
+		salmon2: '#FF8787',
+		salmon3: '#FFA1A1',
 		mustard1: '#F1C40F',
 		mustard2: '#F7DC6F',
 		mustard3: '#F9E79F',
@@ -258,9 +254,9 @@ const themeColors = {
 		blue4: '#2874A6',
 		blue5: '#2E86C1',
 		blue6: '#3498DB',
-		purple4: '#A52BC0',
-		purple5: '#E043D0',
-		magenta4: '#E768B5',
+		red4: '#C0392B',
+		red5: '#E74C3C',
+		red6: '#EC7063',
 		orange4: '#D35400',
 		orange5: '#E67E22',
 		orange6: '#EB984E',
@@ -271,19 +267,18 @@ const themeColors = {
 		gold5: '#F1C40F',
 		gold6: '#F4D03F',
 	},
-	/* Series palette (light). Same red-free constraint as chartcolors above. */
 	lightModeColor: {
-		magenta1: '#D81B60',
+		radicalRed: '#D81B60',
 
 		dodgerBlueDark: '#1E5BD9',
 		steelgrey: '#344B6B',
 		steelpurple: '#5E548E',
 		steelindigo: '#8E4A7C',
 		steelpink: '#B63A6F',
-		amber1: '#E1A14B',
+		steelcoral: '#E14B5A',
 		steelorange: '#E76F2F',
 		steelgold: '#E09B00',
-		olive1: '#C9BD3A',
+		steelrust: '#C93A50',
 		steelgreen: '#2F7D69',
 
 		mediumOrchidDark: '#8E24AA',
@@ -291,17 +286,17 @@ const themeColors = {
 		seaGreen: '#1E7F5A',
 		turquoiseBlueDark: '#007EA7',
 		silverDark: '#5F5F5F',
-		green1: '#ACDB24',
-		green2: '#66CC21',
+		outrageousOrangeDark: '#E64A19',
+		roseBudDark: '#D84315',
 		deepSkyBlueDark: '#0277BD',
 		royalBlue: '#2A4FDB',
 
 		avocadoDark: '#6B6B1E',
 		mintGreenDark: '#2E9E55',
-		green3: '#3F8B3A',
+		chestnut: '#8B3A3A',
 		limaDark: '#5C7F00',
 		olive: '#6E7F00',
-		green4: '#3CC964',
+		beautyBushDark: '#C93C3C',
 
 		danube: '#4F6FB3',
 		oliveDrab: '#4F7F1A',
@@ -309,13 +304,13 @@ const themeColors = {
 		electricLimeDark: '#6B8F00',
 		robin: '#2F4FCC',
 
-		teal1: '#1FBF83',
+		harleyOrange: '#CC2E12',
 		gladeGreen: '#4F7F46',
 		hemlock: '#5C5C45',
 		vidaLoca: '#3D6B00',
 		rust: '#993300',
 
-		teal2: '#28C6C1',
+		red: '#C62828',
 		blue: '#1A237E',
 		green: '#1B7F3A',
 		purple: '#6A1B9A',
@@ -325,7 +320,7 @@ const themeColors = {
 		brown: '#7A3A1E',
 		teal: '#006D6F',
 		limeDark: '#4C8C2B',
-		cyan1: '#1B546D',
+		maroon: '#6D1B1B',
 		navy: '#0D1B5E',
 		gray: '#616161',
 
@@ -333,25 +328,25 @@ const themeColors = {
 		indigo: '#303F9F',
 		slateGray: '#556B7C',
 		chocolate: '#9C4A1A',
-		blue1: '#3B74DF',
+		tomato: '#E53935',
 		steelBlue: '#3A6EA5',
 
 		peruDark: '#B35E00',
 		darkOliveGreen: '#445B1F',
-		blue2: '#4041B0',
+		indianRed: '#B04040',
 		mediumSlateBlue: '#5C6BC0',
-		indigo1: '#6644A9',
+		rosyBrownDark: '#A94444',
 		darkSlateGray: '#2E4A4A',
 
 		fuchsia: '#C511C5',
-		indigo2: '#AD42E0',
-		purple1: '#C83AC5',
+		salmonDark: '#E64A3C',
+		darkSalmonDark: '#C85A3A',
 		paleVioletRedDark: '#C2186A',
 
 		mediumPurple: '#7E57C2',
 		darkOrchid: '#7B1FA2',
 		mediumSeaGreenDark: '#2E8B57',
-		purple2: '#E573BC',
+		lightCoralDark: '#E57373',
 
 		gold: '#D4AF37',
 		sandyBrownDark: '#C76A15',

frontend/src/container/AIAssistant/components/ActionsSection/utils/__tests__/openSavedView.test.ts

@@ -3,22 +3,15 @@ import {
 	MessageActionKindDTO,
 	SavedViewEntityDTO,
 } from 'api/ai-assistant/sigNozAIAssistantAPI.schemas';
-import {
-	getSavedView,
-	listSavedViews,
-} from 'api/generated/services/saved-view';
-import {
-	GetSavedView200,
-	ListSavedViews200,
-	SavedviewtypesPanelTypeDTO,
-	SavedviewtypesSavedViewDTO,
-	SavedviewtypesSchemaVersionDTO,
-	SavedviewtypesSourceDTO,
-} from 'api/generated/services/sigNoz.schemas';
+import { getAllViews } from 'api/saveView/getAllViews';
+import { getViewById } from 'api/saveView/getViewById';
 import ROUTES from 'constants/routes';
 import { QueryParams } from 'constants/query';
 import { PANEL_TYPES } from 'constants/queryBuilder';
+import { ICompositeMetricQuery } from 'types/api/alerts/compositeQuery';
+import { AllViewsProps, ViewProps } from 'types/api/saveViews/types';
 import { DataSource } from 'types/common/queryBuilder';
+import { AxiosResponse } from 'axios';
 import type { History } from 'history';
 
 import {
@@ -38,7 +31,8 @@ import {
 } from '../resolveOpenResource';
 import { resourceRoute, ResourceType } from '../resourceRoute';
 
-jest.mock('api/generated/services/saved-view');
+jest.mock('api/saveView/getAllViews');
+jest.mock('api/saveView/getViewById');
 
 jest.mock(
 	'lib/newQueryBuilder/queryBuilderMappers/mapQueryDataFromApi',
@@ -54,45 +48,43 @@ jest.mock(
 	}),
 );
 
-const mockedListSavedViews = listSavedViews as jest.MockedFunction<
-	typeof listSavedViews
+const mockedGetAllViews = getAllViews as jest.MockedFunction<
+	typeof getAllViews
 >;
-const mockedGetSavedView = getSavedView as jest.MockedFunction<
-	typeof getSavedView
+const mockedGetViewById = getViewById as jest.MockedFunction<
+	typeof getViewById
 >;
 
-function makeView(
-	id: string,
-	source: SavedviewtypesSourceDTO,
-): SavedviewtypesSavedViewDTO {
+function makeView(id: string, sourcePage: DataSource): ViewProps {
 	return {
 		id,
-		name: `view-${id}`,
-		source,
-		schemaVersion: SavedviewtypesSchemaVersionDTO.v2,
+		name: `View ${id}`,
+		category: 'test',
 		createdAt: '2021-07-07T06:31:00.000Z',
 		createdBy: 'user',
 		updatedAt: '2021-07-07T06:33:00.000Z',
 		updatedBy: 'user',
-		spec: {
-			displayName: `View ${id}`,
-			panelType: SavedviewtypesPanelTypeDTO.list,
-			requestType: 'raw',
-			queries: [{ type: 'builder_query', spec: { name: 'A', signal: source } }],
-		},
-	} as unknown as SavedviewtypesSavedViewDTO;
+		sourcePage,
+		tags: [],
+		extraData: '',
+		compositeQuery: {
+			panelType: PANEL_TYPES.LIST,
+		} as ICompositeMetricQuery,
+	};
 }
 
-function mockViewsResponse(
-	views: SavedviewtypesSavedViewDTO[],
-): ListSavedViews200 {
-	return { status: 'success', data: views };
+function mockViewsResponse(views: ViewProps[]): AxiosResponse<AllViewsProps> {
+	return {
+		data: { status: 'success', data: views },
+	} as AxiosResponse<AllViewsProps>;
 }
 
 function mockViewByIdResponse(
-	view: SavedviewtypesSavedViewDTO,
-): GetSavedView200 {
-	return { status: 'success', data: view };
+	view: ViewProps,
+): AxiosResponse<{ status: string; data: ViewProps }> {
+	return {
+		data: { status: 'success', data: view },
+	} as AxiosResponse<{ status: string; data: ViewProps }>;
 }
 
 describe('resourceRoute', () => {
@@ -198,33 +190,18 @@ describe('resolveOpenResource', () => {
 
 describe('findSavedViewInLists', () => {
 	beforeEach(() => {
-		mockedListSavedViews.mockReset();
+		mockedGetAllViews.mockReset();
 	});
 
 	it('loads only the hinted source when entity is provided', async () => {
-		const tracesView = makeView('view-traces', SavedviewtypesSourceDTO.traces);
-		mockedListSavedViews.mockResolvedValueOnce(mockViewsResponse([tracesView]));
+		const tracesView = makeView('view-traces', DataSource.TRACES);
+		mockedGetAllViews.mockResolvedValueOnce(mockViewsResponse([tracesView]));
 
 		const result = await findSavedViewInLists('view-traces', DataSource.TRACES);
 
 		expect(result).toStrictEqual(tracesView);
-		expect(mockedListSavedViews).toHaveBeenCalledTimes(1);
-		expect(mockedListSavedViews).toHaveBeenCalledWith({
-			source: SavedviewtypesSourceDTO.traces,
-		});
-	});
-
-	it('treats a null list as empty and probes the next source', async () => {
-		const metricsView = makeView('view-metrics', SavedviewtypesSourceDTO.metrics);
-		mockedListSavedViews
-			.mockResolvedValueOnce({ status: 'success', data: null })
-			.mockResolvedValueOnce(mockViewsResponse([]))
-			.mockResolvedValueOnce(mockViewsResponse([metricsView]));
-
-		const result = await findSavedViewInLists('view-metrics');
-
-		expect(result).toStrictEqual(metricsView);
-		expect(mockedListSavedViews).toHaveBeenCalledTimes(3);
+		expect(mockedGetAllViews).toHaveBeenCalledTimes(1);
+		expect(mockedGetAllViews).toHaveBeenCalledWith(DataSource.TRACES);
 	});
 });
 
@@ -250,75 +227,52 @@ describe('openSavedView', () => {
 	it('navigates with history.push and view query params', () => {
 		const push = jest.fn();
 		const history = { push } as unknown as History;
-		const view = makeView('view-logs', SavedviewtypesSourceDTO.logs);
+		const view = makeView('view-logs', DataSource.LOGS);
 
 		openSavedView(view, history);
 
 		expect(push).toHaveBeenCalledTimes(1);
 		const pushedUrl = push.mock.calls[0][0] as string;
 		expect(pushedUrl).toContain(ROUTES.LOGS_EXPLORER);
-		const params = new URLSearchParams(pushedUrl.split('?')[1]);
-		expect(params.get(QueryParams.viewKey)).toBe('"view-logs"');
-		expect(params.get(QueryParams.viewName)).toBe('"View view-logs"');
-		expect(params.get(QueryParams.panelTypes)).toBe('"list"');
-	});
-
-	it('throws when the view has no source', () => {
-		const view = makeView('view-logs', SavedviewtypesSourceDTO.logs);
-		delete view.source;
-
-		expect(() =>
-			openSavedView(view, { push: jest.fn() } as unknown as History),
-		).toThrow('Unsupported saved view source');
-	});
-
-	it('throws when the view has no queries', () => {
-		const view = makeView('view-logs', SavedviewtypesSourceDTO.logs);
-		view.spec.queries = [];
-
-		expect(() =>
-			openSavedView(view, { push: jest.fn() } as unknown as History),
-		).toThrow('Saved view is missing query data');
+		expect(pushedUrl).toContain(QueryParams.viewKey);
 	});
 });
 
 describe('openSavedViewByKey', () => {
 	beforeEach(() => {
-		mockedListSavedViews.mockReset();
-		mockedGetSavedView.mockReset();
+		mockedGetAllViews.mockReset();
+		mockedGetViewById.mockReset();
 	});
 
 	it('prefers the direct view lookup endpoint', async () => {
-		const view = makeView('view-logs', SavedviewtypesSourceDTO.logs);
-		mockedGetSavedView.mockResolvedValueOnce(mockViewByIdResponse(view));
+		const view = makeView('view-logs', DataSource.LOGS);
+		mockedGetViewById.mockResolvedValueOnce(mockViewByIdResponse(view));
 		const push = jest.fn();
 		const history = { push } as unknown as History;
 
 		await openSavedViewByKey('view-logs', DataSource.LOGS, history);
 
-		expect(mockedGetSavedView).toHaveBeenCalledWith({ id: 'view-logs' });
-		expect(mockedListSavedViews).not.toHaveBeenCalled();
+		expect(mockedGetViewById).toHaveBeenCalledWith('view-logs');
+		expect(mockedGetAllViews).not.toHaveBeenCalled();
 		expect(push).toHaveBeenCalled();
 	});
 
 	it('falls back to list probing when direct lookup fails', async () => {
-		const view = makeView('view-traces', SavedviewtypesSourceDTO.traces);
-		mockedGetSavedView.mockRejectedValueOnce(new Error('not found'));
-		mockedListSavedViews.mockResolvedValueOnce(mockViewsResponse([view]));
+		const view = makeView('view-traces', DataSource.TRACES);
+		mockedGetViewById.mockRejectedValueOnce(new Error('not found'));
+		mockedGetAllViews.mockResolvedValueOnce(mockViewsResponse([view]));
 		const push = jest.fn();
 		const history = { push } as unknown as History;
 
 		await openSavedViewByKey('view-traces', DataSource.TRACES, history);
 
-		expect(mockedListSavedViews).toHaveBeenCalledWith({
-			source: SavedviewtypesSourceDTO.traces,
-		});
+		expect(mockedGetAllViews).toHaveBeenCalledWith(DataSource.TRACES);
 		expect(push).toHaveBeenCalled();
 	});
 
 	it('throws when the saved view does not exist', async () => {
-		mockedGetSavedView.mockRejectedValueOnce(new Error('not found'));
-		mockedListSavedViews.mockResolvedValue(mockViewsResponse([]));
+		mockedGetViewById.mockRejectedValueOnce(new Error('not found'));
+		mockedGetAllViews.mockResolvedValue(mockViewsResponse([]));
 
 		await expect(
 			openSavedViewByKey('missing', DataSource.LOGS, {

frontend/src/container/AIAssistant/components/ActionsSection/utils/openSavedView.ts

@@ -1,22 +1,15 @@
-import {
-	getSavedView,
-	listSavedViews,
-} from 'api/generated/services/saved-view';
-import { SavedviewtypesSavedViewDTO } from 'api/generated/services/sigNoz.schemas';
+import { getAllViews } from 'api/saveView/getAllViews';
+import { getViewById } from 'api/saveView/getViewById';
 import { QueryParams } from 'constants/query';
 import { PANEL_TYPES } from 'constants/queryBuilder';
-import {
-	findSavedView,
-	getSavedViewQuery,
-	SavedViewSourcePage,
-	toSavedViewSource,
-} from 'container/SavedViews/utils';
+import { mapQueryDataFromApi } from 'lib/newQueryBuilder/queryBuilderMappers/mapQueryDataFromApi';
 import { SOURCEPAGE_VS_ROUTES } from 'pages/SaveView/constants';
+import { ViewProps } from 'types/api/saveViews/types';
 import { DataSource } from 'types/common/queryBuilder';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';
 import { History } from 'history';
 
-type SavedViewSourceHint = SavedViewSourcePage;
+type SavedViewSourceHint = DataSource | 'meter';
 
 const DEFAULT_PROBE_SOURCES: SavedViewSourceHint[] = [
 	DataSource.LOGS,
@@ -27,15 +20,13 @@ const DEFAULT_PROBE_SOURCES: SavedViewSourceHint[] = [
 export async function findSavedViewInLists(
 	viewKey: string,
 	sourceHint?: SavedViewSourceHint | null,
-): Promise<SavedviewtypesSavedViewDTO | null> {
+): Promise<ViewProps | null> {
 	const sources = sourceHint ? [sourceHint] : DEFAULT_PROBE_SOURCES;
 
 	for (const source of sources) {
 		try {
-			const response = await listSavedViews({
-				source: toSavedViewSource(source),
-			});
-			const match = findSavedView(response.data, viewKey);
+			const response = await getAllViews(source);
+			const match = response.data.data.find((view) => view.id === viewKey);
 			if (match) {
 				return match;
 			}
@@ -50,11 +41,11 @@ export async function findSavedViewInLists(
 async function loadSavedView(
 	viewKey: string,
 	sourceHint?: SavedViewSourceHint | null,
-): Promise<SavedviewtypesSavedViewDTO> {
+): Promise<ViewProps> {
 	try {
-		const response = await getSavedView({ id: viewKey });
-		if (response.data) {
-			return response.data;
+		const response = await getViewById(viewKey);
+		if (response.data?.data) {
+			return response.data.data;
 		}
 	} catch {
 		// Fall back to list probing when the direct lookup fails.
@@ -94,23 +85,20 @@ export function buildExplorerNavigationUrl(
 	return `${route}?${params.toString()}`;
 }
 
-export function openSavedView(
-	view: SavedviewtypesSavedViewDTO,
-	history: History,
-): void {
-	const route = view.source ? explorerRouteForSourcePage(view.source) : null;
+export function openSavedView(view: ViewProps, history: History): void {
+	const route = explorerRouteForSourcePage(view.sourcePage);
 	if (!route) {
 		throw new Error('Unsupported saved view source');
 	}
 
-	if (!view.spec.queries?.length) {
+	if (!view.compositeQuery) {
 		throw new Error('Saved view is missing query data');
 	}
 
-	const query = getSavedViewQuery(view);
+	const query = mapQueryDataFromApi(view.compositeQuery);
 	const url = buildExplorerNavigationUrl(route, query, {
-		[QueryParams.panelTypes]: view.spec.panelType as unknown as PANEL_TYPES,
-		[QueryParams.viewName]: view.spec.displayName,
+		[QueryParams.panelTypes]: view.compositeQuery.panelType as PANEL_TYPES,
+		[QueryParams.viewName]: view.name,
 		[QueryParams.viewKey]: view.id,
 	});
 	history.push(url);
@@ -124,3 +112,6 @@ export async function openSavedViewByKey(
 	const view = await loadSavedView(viewKey, sourceHint);
 	openSavedView(view, history);
 }
+
+/** @deprecated Use findSavedViewInLists — kept for tests. */
+export const findSavedView = findSavedViewInLists;

frontend/src/container/AIAssistant/components/MessageBubble/MessageBubble.module.scss

@@ -75,38 +75,6 @@
 	word-break: break-word;
 }
 
-// Error bubble: a subtle error-tinted callout replacing the default
-// assistant background, rendered when a turn fails.
-.bubble.error {
-	.assistant & {
-		background: var(--callout-error-background);
-		border: 1px solid var(--callout-error-border);
-	}
-}
-
-.errorContent {
-	display: flex;
-	align-items: flex-start;
-	gap: 8px;
-}
-
-.errorIcon {
-	flex-shrink: 0;
-	margin-top: 2px;
-	color: var(--destructive);
-}
-
-.errorText {
-	color: var(--callout-error-title);
-	white-space: pre-wrap;
-	word-break: break-word;
-}
-
-.retryButton {
-	margin-top: 6px;
-	align-self: flex-start;
-}
-
 // User-bubble row: pencil button sits to the LEFT of the bubble within
 // the right-aligned message line, so it visually "ends" at the bubble's
 // right edge while keeping the bubble in its original position.

frontend/src/container/AIAssistant/components/MessageBubble/MessageBubble.tsx

@@ -2,10 +2,6 @@ import React, { useMemo } from 'react';
 import cx from 'classnames';
 import ReactMarkdown from 'react-markdown';
 import remarkGfm from 'remark-gfm';
-import { Button } from '@signozhq/ui/button';
-import { RotateCw, TriangleAlert } from '@signozhq/icons';
-
-import { RetryActionDTO } from 'api/ai-assistant/sigNozAIAssistantAPI.schemas';
 
 // Side-effect: registers all built-in block types into the BlockRegistry
 import '../blocks';
@@ -108,23 +104,18 @@ function renderGroup(group: RenderGroup): JSX.Element {
 interface MessageBubbleProps {
 	message: Message;
 	onRegenerate?: () => void;
-	onRetry?: () => void;
 	isLastAssistant?: boolean;
 }
 
 export default function MessageBubble({
 	message,
 	onRegenerate,
-	onRetry,
 	isLastAssistant = false,
 }: MessageBubbleProps): JSX.Element {
 	const variant = useVariant();
 	const isCompact = variant === 'panel';
 	const isUser = message.role === 'user';
-	const isError = !isUser && Boolean(message.isError);
 	const hasBlocks = !isUser && message.blocks && message.blocks.length > 0;
-	const showRetry =
-		isError && message.retryAction === RetryActionDTO.manual && Boolean(onRetry);
 
 	// Recompute groups only when the blocks array identity changes — store
 	// updates that don't touch this message's blocks should not re-render the
@@ -147,7 +138,7 @@ export default function MessageBubble({
 		<div className={messageClass} data-testid={`ai-message-${message.id}`}>
 			<div className={bodyClass}>
 				<div className={styles.bubbleRow}>
-					<div className={cx(styles.bubble, { [styles.error]: isError })}>
+					<div className={styles.bubble}>
 						{message.attachments && message.attachments.length > 0 && (
 							<div className={styles.attachments}>
 								{message.attachments.map((att) => {
@@ -170,11 +161,6 @@ export default function MessageBubble({
 
 						{isUser ? (
 							<p className={styles.text}>{message.content}</p>
-						) : isError ? (
-							<div className={styles.errorContent}>
-								<TriangleAlert size={14} className={styles.errorIcon} />
-								<span className={styles.errorText}>{message.content}</span>
-							</div>
 						) : hasBlocks ? (
 							<MessageContext.Provider value={{ messageId: message.id }}>
 								{groups.map((g) => renderGroup(g))}
@@ -197,21 +183,7 @@ export default function MessageBubble({
 					</div>
 				</div>
 
-				{showRetry && (
-					<Button
-						className={styles.retryButton}
-						size="sm"
-						variant="ghost"
-						color="secondary"
-						onClick={onRetry}
-						testId={`ai-message-retry-${message.id}`}
-					>
-						<RotateCw size={12} />
-						Retry
-					</Button>
-				)}
-
-				{!isUser && !isError && !message.isRateLimitError && (
+				{!isUser && !message.isRateLimitError && (
 					<MessageFeedback
 						message={message}
 						onRegenerate={onRegenerate}

frontend/src/container/AIAssistant/components/MessageBubble/__tests__/MessageBubble.test.tsx

@@ -1,85 +0,0 @@
-import React from 'react';
-import { render, screen, userEvent } from 'tests/test-utils';
-import {
-	ErrorCodeDTO,
-	RetryActionDTO,
-} from 'api/ai-assistant/sigNozAIAssistantAPI.schemas';
-
-import { Message } from '../../../types';
-
-// react-markdown + remark-gfm are ESM-only and pull a large untransformed
-// dependency chain into jest. The error-rendering path under test renders
-// plain text (no markdown), so stub them to keep the import graph loadable.
-jest.mock('react-markdown', () => ({
-	__esModule: true,
-	default: ({ children }: { children?: React.ReactNode }): React.ReactNode =>
-		children,
-}));
-jest.mock('remark-gfm', () => ({
-	__esModule: true,
-	default: (): void => undefined,
-}));
-
-// eslint-disable-next-line import/first
-import MessageBubble from '../MessageBubble';
-
-function errorMessage(overrides: Partial<Message> = {}): Message {
-	return {
-		id: 'err-1',
-		role: 'assistant',
-		content: 'This conversation is still finishing a previous response.',
-		isError: true,
-		errorCode: ErrorCodeDTO.thread_busy,
-		retryAction: RetryActionDTO.manual,
-		createdAt: 0,
-		...overrides,
-	};
-}
-
-const retryButton = (): HTMLElement | null =>
-	screen.queryByRole('button', { name: /retry/i });
-
-describe('MessageBubble — error rendering', () => {
-	it('shows a Retry button for a manual error and invokes onRetry on click', async () => {
-		const onRetry = jest.fn();
-		render(<MessageBubble message={errorMessage()} onRetry={onRetry} />);
-
-		// Error copy is rendered, and the feedback bar is suppressed on errors.
-		expect(
-			screen.getByText(/still finishing a previous response/i),
-		).toBeInTheDocument();
-		expect(
-			screen.queryByRole('button', { name: /copy message/i }),
-		).not.toBeInTheDocument();
-
-		const button = retryButton();
-		expect(button).toBeInTheDocument();
-		await userEvent.click(button as HTMLElement);
-		expect(onRetry).toHaveBeenCalledTimes(1);
-	});
-
-	it('hides the Retry button when retryAction is none', () => {
-		render(
-			<MessageBubble
-				message={errorMessage({ retryAction: RetryActionDTO.none })}
-				onRetry={jest.fn()}
-			/>,
-		);
-		expect(retryButton()).not.toBeInTheDocument();
-	});
-
-	it('hides the Retry button when retryAction is auto', () => {
-		render(
-			<MessageBubble
-				message={errorMessage({ retryAction: RetryActionDTO.auto })}
-				onRetry={jest.fn()}
-			/>,
-		);
-		expect(retryButton()).not.toBeInTheDocument();
-	});
-
-	it('hides the Retry button when no onRetry handler is provided', () => {
-		render(<MessageBubble message={errorMessage()} />);
-		expect(retryButton()).not.toBeInTheDocument();
-	});
-});

frontend/src/container/AIAssistant/components/VirtualizedMessages/VirtualizedMessages.tsx

@@ -37,9 +37,6 @@ export default function VirtualizedMessages({
 	const regenerateAssistantMessage = useAIAssistantStore(
 		(s) => s.regenerateAssistantMessage,
 	);
-	const retryAssistantMessage = useAIAssistantStore(
-		(s) => s.retryAssistantMessage,
-	);
 	const { threadId } = useAIAssistantAnalyticsContext(conversationId);
 	const streamingStatus = useAIAssistantStore(
 		(s) => s.streams[conversationId]?.streamingStatus ?? '',
@@ -88,14 +85,6 @@ export default function VirtualizedMessages({
 		[conversationId, isStreaming, regenerateAssistantMessage, threadId],
 	);
 
-	const handleRetry = useCallback((): void => {
-		if (isStreaming) {
-			return;
-		}
-		void logEvent(AIAssistantEvents.RetryClicked, { threadId });
-		void retryAssistantMessage(conversationId);
-	}, [conversationId, isStreaming, retryAssistantMessage, threadId]);
-
 	// Scroll all the way to the actual bottom — including the 64px of bottom
 	// padding on the scroller — so the last bubble has visible breathing room
 	// above the disclaimer / input bar. Virtuoso's `scrollToIndex(LAST,
@@ -217,11 +206,6 @@ export default function VirtualizedMessages({
 									? (): void => handleRegenerate(msg.id)
 									: undefined
 							}
-							onRetry={
-								msg.isError && isLastAssistant && !showStreamingSlot
-									? handleRetry
-									: undefined
-							}
 							isLastAssistant={isLastAssistant}
 						/>
 					);

frontend/src/container/AIAssistant/events.ts

@@ -90,7 +90,6 @@ export enum AIAssistantEvents {
 	SuggestedPromptClicked = 'AI Assistant: Suggested prompt clicked',
 	CancelClicked = 'AI Assistant: Cancel clicked',
 	RegenerateClicked = 'AI Assistant: Regenerate clicked',
-	RetryClicked = 'AI Assistant: Retry clicked',
 	MessageCopied = 'AI Assistant: Message copied',
 	FeedbackSubmitted = 'AI Assistant: Feedback submitted',
 	ResourceOpened = 'AI Assistant: Resource opened',

frontend/src/container/AIAssistant/store/__tests__/useAIAssistantStore.test.ts

@@ -1,263 +0,0 @@
-import {
-	ErrorCodeDTO,
-	RetryActionDTO,
-} from 'api/ai-assistant/sigNozAIAssistantAPI.schemas';
-import type { SSEEvent } from 'api/ai-assistant/chat';
-
-import { useAIAssistantStore } from '../useAIAssistantStore';
-import type { Message } from '../../types';
-
-// The store talks to the chat API only through these named exports. Mock the
-// whole module so we can drive the SSE stream + REST calls deterministically.
-jest.mock('api/ai-assistant/chat', () => ({
-	__esModule: true,
-	createThread: jest.fn(),
-	sendMessage: jest.fn(),
-	streamEvents: jest.fn(),
-	approveExecution: jest.fn(),
-	clarifyExecution: jest.fn(),
-	regenerateMessage: jest.fn(),
-	rejectExecution: jest.fn(),
-	cancelExecution: jest.fn(),
-	listThreads: jest.fn(),
-	getThreadDetail: jest.fn(),
-	updateThread: jest.fn(),
-	submitFeedback: jest.fn(),
-}));
-
-// eslint-disable-next-line @typescript-eslint/no-var-requires, global-require
-const chat = jest.requireMock('api/ai-assistant/chat') as Record<
-	string,
-	jest.Mock
->;
-
-// Builds a single-use async stream from a fixed list of SSE events.
-async function* eventStream(events: SSEEvent[]): AsyncGenerator<SSEEvent> {
-	for (const event of events) {
-		yield event;
-	}
-}
-
-function errorEvent(
-	executionId: string,
-	code: ErrorCodeDTO,
-	retryAction: RetryActionDTO,
-): SSEEvent {
-	return {
-		type: 'error',
-		executionId,
-		error: { code, message: 'backend message' },
-		retryAction,
-	};
-}
-
-function lastMessage(conversationId: string): Message {
-	const conv = useAIAssistantStore.getState().conversations[conversationId];
-	return conv.messages[conv.messages.length - 1];
-}
-
-describe('useAIAssistantStore — streaming error handling', () => {
-	beforeEach(() => {
-		jest.clearAllMocks();
-		useAIAssistantStore.setState((s) => {
-			s.conversations = {};
-			s.streams = {};
-			s.activeConversationId = null;
-		});
-	});
-
-	it('commits a manually-retryable error bubble with friendly copy and metadata', async () => {
-		chat.createThread.mockResolvedValue('thread-1');
-		chat.sendMessage.mockResolvedValue('exec-1');
-		chat.streamEvents.mockReturnValueOnce(
-			eventStream([
-				errorEvent('exec-1', ErrorCodeDTO.thread_busy, RetryActionDTO.manual),
-			]),
-		);
-
-		useAIAssistantStore.getState().startNewConversation();
-		await useAIAssistantStore.getState().sendMessage('hello');
-
-		const conv = useAIAssistantStore.getState().conversations['thread-1'];
-		expect(conv.messages).toHaveLength(2);
-		expect(conv.messages[0]).toMatchObject({ role: 'user', content: 'hello' });
-		expect(conv.messages[1]).toMatchObject({
-			role: 'assistant',
-			isError: true,
-			errorCode: ErrorCodeDTO.thread_busy,
-			retryAction: RetryActionDTO.manual,
-		});
-		// Code-specific FE copy, not the raw backend message.
-		expect(conv.messages[1].content).toContain(
-			'still finishing a previous response',
-		);
-	});
-
-	it('replays the send on retry without re-pushing the user message', async () => {
-		chat.createThread.mockResolvedValue('thread-1');
-		chat.sendMessage.mockResolvedValue('exec-1');
-		chat.streamEvents.mockReturnValueOnce(
-			eventStream([
-				errorEvent('exec-1', ErrorCodeDTO.thread_busy, RetryActionDTO.manual),
-			]),
-		);
-
-		useAIAssistantStore.getState().startNewConversation();
-		await useAIAssistantStore.getState().sendMessage('hello');
-
-		// The retry succeeds this time.
-		chat.streamEvents.mockReturnValueOnce(
-			eventStream([
-				{
-					type: 'message',
-					executionId: 'exec-1',
-					messageId: 'm1',
-					delta: 'Hi there',
-					done: true,
-				},
-			]),
-		);
-
-		await useAIAssistantStore.getState().retryAssistantMessage('thread-1');
-
-		const conv = useAIAssistantStore.getState().conversations['thread-1'];
-		// Error bubble replaced by the assistant reply; the user message stays.
-		expect(conv.messages).toHaveLength(2);
-		expect(conv.messages[0]).toMatchObject({ role: 'user', content: 'hello' });
-		expect(conv.messages[1]).toMatchObject({
-			role: 'assistant',
-			content: 'Hi there',
-		});
-		expect(conv.messages[1].isError).toBeUndefined();
-		// Thread already existed on retry; the user message was never re-sent as new.
-		expect(chat.createThread).toHaveBeenCalledTimes(1);
-		expect(chat.sendMessage).toHaveBeenCalledTimes(2);
-	});
-
-	it('silently retries auto-flagged errors, then downgrades to manual once spent', async () => {
-		chat.createThread.mockResolvedValue('thread-2');
-		chat.sendMessage.mockResolvedValue('exec');
-		// Always auto-retryable: 1 initial attempt + MAX_AUTO_RETRIES (2) = 3 sends.
-		chat.streamEvents.mockImplementation(() =>
-			eventStream([
-				errorEvent('exec', ErrorCodeDTO.internal_error, RetryActionDTO.auto),
-			]),
-		);
-
-		useAIAssistantStore.getState().startNewConversation();
-		await useAIAssistantStore.getState().sendMessage('hi');
-
-		expect(chat.sendMessage).toHaveBeenCalledTimes(3);
-		expect(lastMessage('thread-2')).toMatchObject({
-			isError: true,
-			errorCode: ErrorCodeDTO.internal_error,
-			// Auto budget exhausted → presented as manual so a Retry button shows.
-			retryAction: RetryActionDTO.manual,
-		});
-	}, 10000);
-
-	it('marks rate-limit errors and offers no retry', async () => {
-		chat.createThread.mockResolvedValue('thread-3');
-		chat.sendMessage.mockResolvedValue('exec');
-		chat.streamEvents.mockReturnValueOnce(
-			eventStream([
-				errorEvent('exec', ErrorCodeDTO.hourly_message_limit, RetryActionDTO.none),
-			]),
-		);
-
-		useAIAssistantStore.getState().startNewConversation();
-		await useAIAssistantStore.getState().sendMessage('hi');
-
-		expect(lastMessage('thread-3')).toMatchObject({
-			isError: true,
-			isRateLimitError: true,
-			retryAction: RetryActionDTO.none,
-		});
-
-		// No retry thunk registered for a non-retryable error — retry is a no-op.
-		const before =
-			useAIAssistantStore.getState().conversations['thread-3'].messages.length;
-		await useAIAssistantStore.getState().retryAssistantMessage('thread-3');
-		expect(
-			useAIAssistantStore.getState().conversations['thread-3'].messages,
-		).toHaveLength(before);
-	});
-
-	it('recovers silently when an auto-flagged error succeeds on retry', async () => {
-		chat.createThread.mockResolvedValue('thread-4');
-		chat.sendMessage.mockResolvedValue('exec');
-		chat.streamEvents
-			.mockReturnValueOnce(
-				eventStream([
-					errorEvent('exec', ErrorCodeDTO.internal_error, RetryActionDTO.auto),
-				]),
-			)
-			.mockReturnValueOnce(
-				eventStream([
-					{
-						type: 'message',
-						executionId: 'exec',
-						messageId: 'm1',
-						delta: 'Recovered',
-						done: true,
-					},
-				]),
-			);
-
-		useAIAssistantStore.getState().startNewConversation();
-		await useAIAssistantStore.getState().sendMessage('hi');
-
-		// 1 initial attempt + 1 silent auto retry, then success — no error bubble.
-		expect(chat.sendMessage).toHaveBeenCalledTimes(2);
-		const conv = useAIAssistantStore.getState().conversations['thread-4'];
-		expect(conv.messages).toHaveLength(2);
-		expect(conv.messages[0]).toMatchObject({ role: 'user', content: 'hi' });
-		expect(conv.messages[1]).toMatchObject({
-			role: 'assistant',
-			content: 'Recovered',
-		});
-		expect(conv.messages.some((m) => m.isError)).toBe(false);
-	}, 10000);
-
-	it('replays the originating action on retry for a non-send error (approve)', async () => {
-		chat.approveExecution.mockResolvedValue('exec-a');
-		chat.streamEvents.mockReturnValueOnce(
-			eventStream([
-				errorEvent('exec-a', ErrorCodeDTO.thread_busy, RetryActionDTO.manual),
-			]),
-		);
-
-		const convId = useAIAssistantStore.getState().startNewConversation();
-		await useAIAssistantStore.getState().approveAction(convId, 'approval-1');
-
-		expect(lastMessage(convId)).toMatchObject({
-			isError: true,
-			retryAction: RetryActionDTO.manual,
-		});
-		expect(chat.approveExecution).toHaveBeenCalledTimes(1);
-
-		// Retry replays the approval (not a send) and succeeds this time.
-		chat.streamEvents.mockReturnValueOnce(
-			eventStream([
-				{
-					type: 'message',
-					executionId: 'exec-a',
-					messageId: 'm1',
-					delta: 'Approved',
-					done: true,
-				},
-			]),
-		);
-		await useAIAssistantStore.getState().retryAssistantMessage(convId);
-
-		const conv = useAIAssistantStore.getState().conversations[convId];
-		expect(conv.messages).toHaveLength(1);
-		expect(conv.messages[0]).toMatchObject({
-			role: 'assistant',
-			content: 'Approved',
-		});
-		expect(conv.messages[0].isError).toBeUndefined();
-		expect(chat.approveExecution).toHaveBeenCalledTimes(2);
-		expect(chat.sendMessage).not.toHaveBeenCalled();
-	});
-});

frontend/src/container/AIAssistant/store/useAIAssistantStore.ts

@@ -8,7 +8,6 @@ import type {
 	MessageActionDTO,
 	MessageSummaryDTOBlocksAnyOfItem,
 } from 'api/ai-assistant/sigNozAIAssistantAPI.schemas';
-import { RetryActionDTO } from 'api/ai-assistant/sigNozAIAssistantAPI.schemas';
 
 import {
 	approveExecution,
@@ -36,10 +35,7 @@ import {
 	MessageBlock,
 	MessageRole,
 } from '../types';
-import {
-	resolveAssistantError,
-	type AssistantErrorResolution,
-} from '../utils/resolveAssistantError';
+import { resolveAssistantErrorMessage } from '../utils/resolveAssistantErrorMessage';
 
 // ---------------------------------------------------------------------------
 // Types used by module-level helpers
@@ -60,15 +56,6 @@ interface SSEStreamCtx {
 
 const streamControllers = new Map<string, AbortController>();
 
-/**
- * Per-conversation retry thunks for the most recent failed turn. Populated by
- * `finalizeStreamingError` when the error is manually retryable; consumed by
- * the `retryAssistantMessage` action when the user clicks Retry. Transient
- * (not persisted) — it shares the in-memory lifetime of the error bubble it
- * backs, so a page reload drops both together.
- */
-const retryRegistry = new Map<string, () => Promise<void>>();
-
 function abortStream(conversationId: string): void {
 	const ctrl = streamControllers.get(conversationId);
 	if (ctrl) {
@@ -210,7 +197,7 @@ function resetStreamingState(
  * Marker thrown by `runStreamingLoop` when an SSE event reports
  * `invalid_token`. Callers that own an originating action (sendMessage /
  * approve / clarify / regenerate) catch this and re-issue that action via
- * `streamWithRetry`; the retry's first REST call will 401, at which point
+ * `streamWithAuthRetry`; the retry's first REST call will 401, at which point
  * the shared axios `interceptorRejected` rotates the access token and replays.
  */
 class AuthExpiredError extends Error {
@@ -220,50 +207,27 @@ class AuthExpiredError extends Error {
 	}
 }
 
-/** Capped silent re-attempts for backend-flagged transient (`auto`) errors. */
-const MAX_AUTO_RETRIES = 2;
-/** Backoff before each auto re-attempt, indexed by prior auto-retry count. */
-const AUTO_RETRY_BACKOFF_MS = [500, 1500];
-
-function delay(ms: number): Promise<void> {
-	return new Promise((resolve) => {
-		setTimeout(resolve, ms);
-	});
-}
-
-/** True when the SSE error carries the backend's `retryAction: 'auto'` flag. */
-function isAutoRetryableError(err: unknown): boolean {
-	return (
-		(err as { retryAction?: unknown } | undefined)?.retryAction ===
-		RetryActionDTO.auto
-	);
-}
-
 /**
  * Runs the originating action (e.g. sendMessage POST) and streams the
- * resulting execution, with two independent retry budgets:
- *
- *   • Auth — on `AuthExpiredError` (SSE `invalid_token`), re-issues `start`
- *     once. The retry's REST call 401s, the shared axios interceptor rotates
- *     the access token + replays, and the new SSE picks up the rotated token.
- *     Backend flags `invalid_token` as `manual`, so only a fresh execution helps.
- *   • Auto — on an SSE error the backend flagged `retryAction: 'auto'`
- *     (transient), silently re-issues `start` up to `MAX_AUTO_RETRIES` times
- *     with backoff. Once exhausted the error propagates so the caller can
- *     surface a manual Retry affordance.
- *
- * Both reset the stream state before re-attempting so a dead execution's
- * partial output isn't concatenated onto the retry.
+ * resulting execution. On `AuthExpiredError`, re-issues `start` once — the
+ * retry's REST call hits 401, the shared axios interceptor rotates the
+ * access token and replays, and the new SSE picks up the rotated token from
+ * localStorage. Backend signals `retryAction: 'manual'` for `invalid_token`,
+ * so the dead execution can't be resumed — only a fresh one helps.
  */
-async function streamWithRetry(
+async function streamWithAuthRetry(
 	conversationId: string,
 	start: () => Promise<string>,
 	set: StoreSetter,
 ): Promise<void> {
-	let authRetried = false;
-	let autoRetries = 0;
-
-	for (;;) {
+	for (let attempt = 0; attempt <= 1; attempt += 1) {
+		if (attempt > 0) {
+			// Drop any partial content/events from the previous attempt so the
+			// retried execution's stream isn't concatenated with the dead one.
+			set((s) => {
+				resetStreamingState(s, conversationId);
+			});
+		}
 		// eslint-disable-next-line no-await-in-loop
 		const executionId = await start();
 		const ctrl = newStreamController(conversationId);
@@ -278,28 +242,10 @@ async function streamWithRetry(
 			return;
 		} catch (err) {
 			streamControllers.delete(conversationId);
-
-			if (err instanceof AuthExpiredError && !authRetried) {
-				authRetried = true;
-			} else if (isAutoRetryableError(err) && autoRetries < MAX_AUTO_RETRIES) {
-				// eslint-disable-next-line no-await-in-loop
-				await delay(AUTO_RETRY_BACKOFF_MS[autoRetries] ?? 1500);
-				autoRetries += 1;
-			} else {
-				if (isAutoRetryableError(err)) {
-					// Auto-retry budget spent — present the failure as manually
-					// retryable so the caller surfaces a Retry button rather than
-					// silently giving up.
-					(err as { retryAction?: RetryActionDTO }).retryAction =
-						RetryActionDTO.manual;
-				}
-				throw err;
+			if (err instanceof AuthExpiredError && attempt < 1) {
+				continue;
 			}
-
-			// Drop partial content/events from the failed attempt before retrying.
-			set((s) => {
-				resetStreamingState(s, conversationId);
-			});
+			throw err;
 		}
 	}
 }
@@ -312,7 +258,7 @@ async function streamWithRetry(
  *
  * On an `invalid_token` error event (e.g. MCP auth expired mid-execution),
  * throws `AuthExpiredError` so the caller can re-issue the originating
- * action via `streamWithRetry`. We don't refresh here ourselves — the
+ * action via `streamWithAuthRetry`. We don't refresh here ourselves — the
  * retry's REST call will 401 and the shared axios `interceptorRejected`
  * handles rotation + replay. Throws on any other `error` event — the
  * caller's catch block handles UI feedback.
@@ -538,37 +484,20 @@ function hasPendingInput(conversationId: string, get: StoreGetter): boolean {
 	return Boolean(stream?.pendingApproval || stream?.pendingClarification);
 }
 
-/**
- * Commits a failed turn as an error message and removes the stream entry.
- * When the failure is manually retryable and a `retry` thunk is supplied, the
- * thunk is stashed in `retryRegistry` so the bubble's Retry button can replay
- * the originating action.
- */
 function finalizeStreamingError(
 	conversationId: string,
-	resolution: AssistantErrorResolution,
+	errorContent: string,
 	set: StoreSetter,
-	retry?: () => Promise<void>,
+	isRateLimit = false,
 ): void {
-	const { message, code, retryAction, isRateLimit } = resolution;
-
-	if (retryAction === RetryActionDTO.manual && retry) {
-		retryRegistry.set(conversationId, retry);
-	} else {
-		retryRegistry.delete(conversationId);
-	}
-
 	set((s) => {
 		const conv = s.conversations[conversationId];
 		if (conv) {
 			conv.messages.push({
 				id: uuidv4(),
 				role: 'assistant',
-				content: message,
+				content: errorContent,
 				createdAt: Date.now(),
-				isError: true,
-				retryAction,
-				...(code ? { errorCode: code } : {}),
 				...(isRateLimit ? { isRateLimitError: true } : {}),
 			});
 			conv.updatedAt = Date.now();
@@ -577,40 +506,6 @@ function finalizeStreamingError(
 	});
 }
 
-/**
- * Shared streaming wrapper for actions that have no pre-stream setup beyond
- * resetting state (approve / clarify / regenerate). Streams the execution,
- * finalizes the message on success, and on failure resolves the error +
- * registers `retry` (the caller's own re-invocation) so the bubble can replay
- * it. `sendMessage` does not use this — it owns thread-creation/re-keying and
- * runs its own equivalent loop.
- */
-async function streamAndFinalize(
-	conversationId: string,
-	start: () => Promise<string>,
-	fallback: string,
-	logLabel: string,
-	set: StoreSetter,
-	get: StoreGetter,
-	retry: () => Promise<void>,
-): Promise<void> {
-	try {
-		await streamWithRetry(conversationId, start, set);
-		if (!hasPendingInput(conversationId, get)) {
-			finalizeStreamingMessage(conversationId, set, get);
-		}
-	} catch (err) {
-		// Abort errors are expected when the user cancels — not a failure.
-		if (err instanceof DOMException && err.name === 'AbortError') {
-			return;
-		}
-		// eslint-disable-next-line no-console
-		console.error(logLabel, err);
-		const resolution = resolveAssistantError(err, fallback);
-		finalizeStreamingError(conversationId, resolution, set, retry);
-	}
-}
-
 // ---------------------------------------------------------------------------
 // Store interface
 // ---------------------------------------------------------------------------
@@ -669,8 +564,6 @@ export interface AIAssistantStore {
 		conversationId: string,
 		messageId: string,
 	) => Promise<void>;
-	/** Replays the originating action for a manually-retryable error bubble. */
-	retryAssistantMessage: (conversationId: string) => Promise<void>;
 	submitMessageFeedback: (
 		messageId: string,
 		rating: FeedbackRating,
@@ -984,7 +877,7 @@ export const useAIAssistantStore = create<AIAssistantStore>()(
 					// there's no "originating action" to redo — reopening the
 					// same dead executionId would just re-emit the failure.
 					// Let the error bubble; the user can send a new message,
-					// which will go through `streamWithRetry`.
+					// which will go through `streamWithAuthRetry`.
 					if (
 						detail.activeExecutionId &&
 						!streamControllers.has(threadId) &&
@@ -1167,7 +1060,7 @@ export const useAIAssistantStore = create<AIAssistantStore>()(
 				attachments?: MessageAttachment[],
 				contexts?: MessageContext[],
 			): Promise<void> => {
-				const convId = get().activeConversationId;
+				let convId = get().activeConversationId;
 				if (!convId || !get().conversations[convId]) {
 					return;
 				}
@@ -1200,75 +1093,63 @@ export const useAIAssistantStore = create<AIAssistantStore>()(
 				};
 
 				set((state) => {
-					const conv = state.conversations[convId];
+					const conv = state.conversations[convId!];
 					conv.messages.push(userMessage);
 					conv.updatedAt = Date.now();
 					if (!conv.title && text.trim()) {
 						conv.title = deriveTitle(text);
 					}
-					resetStreamingState(state, convId);
+					resetStreamingState(state, convId!);
 				});
 
-				// The full send — ensure a backend thread exists (re-keying the
-				// optimistic client UUID on first send), POST the message, and
-				// stream the reply. Defined as a closure so the error bubble's
-				// Retry button can replay it without re-pushing the user message.
-				const runSend = async (cid: string): Promise<void> => {
-					let targetConvId = cid;
-					try {
-						let { threadId } = get().conversations[targetConvId];
-						if (!threadId) {
-							threadId = await createThread();
-							// Re-key the conversation from client UUID to backend threadId
-							// so fetchThreads won't create a duplicate entry later.
-							const oldId = targetConvId;
-							const newId = threadId;
-							set((s) => {
-								const conv = s.conversations[oldId];
-								if (conv) {
-									conv.id = newId;
-									conv.threadId = newId;
-									s.conversations[newId] = conv;
-									delete s.conversations[oldId];
-									if (s.activeConversationId === oldId) {
-										s.activeConversationId = newId;
-									}
-									const stream = s.streams[oldId];
-									if (stream) {
-										s.streams[newId] = stream;
-										delete s.streams[oldId];
-									}
+				try {
+					let { threadId } = get().conversations[convId];
+					if (!threadId) {
+						threadId = await createThread();
+						// Re-key the conversation from client UUID to backend threadId
+						// so fetchThreads won't create a duplicate entry later.
+						const oldId = convId;
+						convId = threadId;
+						set((s) => {
+							const conv = s.conversations[oldId];
+							if (conv) {
+								conv.id = convId!;
+								conv.threadId = convId!;
+								s.conversations[convId!] = conv;
+								delete s.conversations[oldId];
+								if (s.activeConversationId === oldId) {
+									s.activeConversationId = convId!;
 								}
-							});
-							targetConvId = newId;
-						}
-						const tid = threadId;
-						await streamWithRetry(
-							targetConvId,
-							() => sendMessageToThread(tid, text, contexts),
-							set,
-						);
-
-						if (!hasPendingInput(targetConvId, get)) {
-							finalizeStreamingMessage(targetConvId, set, get);
-						}
-					} catch (err) {
-						// Abort errors are expected when the user cancels — not a failure.
-						if (err instanceof DOMException && err.name === 'AbortError') {
-							return;
-						}
-						console.error('[AIAssistant] sendMessage failed:', err);
-						const resolution = resolveAssistantError(
-							err,
-							'Something went wrong while fetching the response. Please try again.',
-						);
-						finalizeStreamingError(targetConvId, resolution, set, () =>
-							runSend(targetConvId),
-						);
+								const stream = s.streams[oldId];
+								if (stream) {
+									s.streams[convId!] = stream;
+									delete s.streams[oldId];
+								}
+							}
+						});
 					}
-				};
+					const tid = threadId;
+					await streamWithAuthRetry(
+						convId,
+						() => sendMessageToThread(tid, text, contexts),
+						set,
+					);
 
-				await runSend(convId);
+					if (!hasPendingInput(convId, get)) {
+						finalizeStreamingMessage(convId, set, get);
+					}
+				} catch (err) {
+					// Abort errors are expected when the user cancels — not a failure
+					if (err instanceof DOMException && err.name === 'AbortError') {
+						return;
+					}
+					console.error('[AIAssistant] sendMessage failed:', err);
+					const { message, isRateLimit } = resolveAssistantErrorMessage(
+						err,
+						'Something went wrong while fetching the response. Please try again.',
+					);
+					finalizeStreamingError(convId, message, set, isRateLimit);
+				}
 			},
 
 			approveAction: async (
@@ -1286,17 +1167,26 @@ export const useAIAssistantStore = create<AIAssistantStore>()(
 					}
 				});
 
-				const run = (): Promise<void> =>
-					streamAndFinalize(
+				try {
+					await streamWithAuthRetry(
 						conversationId,
 						() => approveExecution(approvalId),
-						'Something went wrong while processing the approval. Please try again.',
-						'[AIAssistant] approveAction failed:',
 						set,
-						get,
-						run,
 					);
-				await run();
+					if (!hasPendingInput(conversationId, get)) {
+						finalizeStreamingMessage(conversationId, set, get);
+					}
+				} catch (err) {
+					if (err instanceof DOMException && err.name === 'AbortError') {
+						return;
+					}
+					console.error('[AIAssistant] approveAction failed:', err);
+					const { message, isRateLimit } = resolveAssistantErrorMessage(
+						err,
+						'Something went wrong while processing the approval. Please try again.',
+					);
+					finalizeStreamingError(conversationId, message, set, isRateLimit);
+				}
 			},
 
 			rejectAction: async (
@@ -1356,17 +1246,26 @@ export const useAIAssistantStore = create<AIAssistantStore>()(
 					resetStreamingState(s, conversationId);
 				});
 
-				const run = (): Promise<void> =>
-					streamAndFinalize(
+				try {
+					await streamWithAuthRetry(
 						conversationId,
 						() => regenerateMessage(messageId),
-						'Something went wrong while regenerating the response. Please try again.',
-						'[AIAssistant] regenerateAssistantMessage failed:',
 						set,
-						get,
-						run,
 					);
-				await run();
+					if (!hasPendingInput(conversationId, get)) {
+						finalizeStreamingMessage(conversationId, set, get);
+					}
+				} catch (err) {
+					if (err instanceof DOMException && err.name === 'AbortError') {
+						return;
+					}
+					console.error('[AIAssistant] regenerateAssistantMessage failed:', err);
+					const { message, isRateLimit } = resolveAssistantErrorMessage(
+						err,
+						'Something went wrong while regenerating the response. Please try again.',
+					);
+					finalizeStreamingError(conversationId, message, set, isRateLimit);
+				}
 			},
 
 			submitMessageFeedback: async (
@@ -1413,42 +1312,26 @@ export const useAIAssistantStore = create<AIAssistantStore>()(
 					}
 				});
 
-				const run = (): Promise<void> =>
-					streamAndFinalize(
+				try {
+					await streamWithAuthRetry(
 						conversationId,
 						() => clarifyExecution(clarificationId, answers),
-						'Something went wrong while processing your answers. Please try again.',
-						'[AIAssistant] submitClarification failed:',
 						set,
-						get,
-						run,
 					);
-				await run();
-			},
-
-			retryAssistantMessage: async (conversationId: string): Promise<void> => {
-				const retry = retryRegistry.get(conversationId);
-				if (!retry) {
-					return;
-				}
-				retryRegistry.delete(conversationId);
-
-				// Drop the trailing error bubble we're retrying from and reset the
-				// stream so the in-progress retry renders immediately. The retry
-				// thunk replays the originating action without re-pushing the
-				// user's message.
-				set((s) => {
-					const conv = s.conversations[conversationId];
-					if (conv) {
-						const last = conv.messages[conv.messages.length - 1];
-						if (last?.isError) {
-							conv.messages.pop();
-						}
+					if (!hasPendingInput(conversationId, get)) {
+						finalizeStreamingMessage(conversationId, set, get);
 					}
-					resetStreamingState(s, conversationId);
-				});
-
-				await retry();
+				} catch (err) {
+					if (err instanceof DOMException && err.name === 'AbortError') {
+						return;
+					}
+					console.error('[AIAssistant] submitClarification failed:', err);
+					const { message, isRateLimit } = resolveAssistantErrorMessage(
+						err,
+						'Something went wrong while processing your answers. Please try again.',
+					);
+					finalizeStreamingError(conversationId, message, set, isRateLimit);
+				}
 			},
 		})),
 		{

frontend/src/container/AIAssistant/types.ts

@@ -15,11 +15,9 @@
 import type {
 	ApprovalEventDTO,
 	ClarificationEventDTO,
-	ErrorCodeDTO,
 	FeedbackRatingDTO,
 	MessageActionDTO,
 	MessageActionKindDTO,
-	RetryActionDTO,
 } from 'api/ai-assistant/sigNozAIAssistantAPI.schemas';
 
 /** Client-only file attachment — no API equivalent (uploads happen via data URLs). */
@@ -93,18 +91,6 @@ export interface Message {
 	 * bar (copy/vote/regenerate) is hidden — retrying would just 429 again.
 	 */
 	isRateLimitError?: boolean;
-	/**
-	 * Marks an assistant message that represents a failed turn. Drives the
-	 * error styling and replaces the feedback bar with a retry affordance.
-	 */
-	isError?: boolean;
-	/** Known backend error code for the failure, when recognised. */
-	errorCode?: ErrorCodeDTO;
-	/**
-	 * Retry semantics for a failed turn — `manual` renders an inline Retry
-	 * button on the error bubble; `none`/`auto` render no button.
-	 */
-	retryAction?: RetryActionDTO;
 	createdAt: number;
 }
 

frontend/src/container/AIAssistant/utils/__tests__/resolveAssistantError.test.ts

@@ -1,154 +0,0 @@
-import { AxiosError } from 'axios';
-import {
-	ErrorCodeDTO,
-	RetryActionDTO,
-} from 'api/ai-assistant/sigNozAIAssistantAPI.schemas';
-
-import { resolveAssistantError } from '../resolveAssistantError';
-
-const FALLBACK = 'Something went wrong. Please try again.';
-
-function restError(status: number, code: string, message: string): AxiosError {
-	const err = new AxiosError('Request failed');
-	err.response = {
-		status,
-		data: { error: { code, message } },
-	} as AxiosError['response'];
-	return err;
-}
-
-describe('resolveAssistantError', () => {
-	describe('message resolution', () => {
-		it('prefers code-specific FE copy over the backend message', () => {
-			const err = restError(409, ErrorCodeDTO.thread_busy, 'raw backend phrasing');
-
-			const { message } = resolveAssistantError(err, FALLBACK);
-			expect(message).toBe(
-				'This conversation is still finishing a previous response. Give it a moment and try again.',
-			);
-		});
-
-		it('falls through to the backend message for a known code without FE copy', () => {
-			const err = restError(
-				400,
-				ErrorCodeDTO.message_not_found,
-				'No such message exists.',
-			);
-
-			expect(resolveAssistantError(err, FALLBACK)).toStrictEqual({
-				message: 'No such message exists.',
-				code: ErrorCodeDTO.message_not_found,
-				retryAction: RetryActionDTO.none,
-				isRateLimit: false,
-			});
-		});
-
-		it('falls back when the error code is not in ErrorCodeDTO', () => {
-			const err = restError(400, 'future_unknown_code', 'Backend-only message');
-
-			expect(resolveAssistantError(err, FALLBACK)).toStrictEqual({
-				message: FALLBACK,
-				code: undefined,
-				retryAction: RetryActionDTO.none,
-				isRateLimit: false,
-			});
-		});
-	});
-
-	describe('rate limiting', () => {
-		it('marks HTTP 429 responses as rate limited and non-retryable', () => {
-			const err = restError(
-				429,
-				ErrorCodeDTO.hourly_message_limit,
-				'Hourly limit reached.',
-			);
-
-			expect(resolveAssistantError(err, FALLBACK)).toStrictEqual({
-				message: "You've reached the hourly message limit. Please try again later.",
-				code: ErrorCodeDTO.hourly_message_limit,
-				retryAction: RetryActionDTO.none,
-				isRateLimit: true,
-			});
-		});
-
-		it('treats known SSE rate-limit codes as rate limited', () => {
-			const err = Object.assign(new Error('Daily token limit exceeded.'), {
-				code: ErrorCodeDTO.daily_token_limit,
-			});
-
-			const res = resolveAssistantError(err, FALLBACK);
-			expect(res.isRateLimit).toBe(true);
-			expect(res.retryAction).toBe(RetryActionDTO.none);
-		});
-
-		it('marks 429 as rate limited even when the code is unknown', () => {
-			const err = restError(429, 'future_unknown_code', 'Too many requests');
-
-			expect(resolveAssistantError(err, FALLBACK)).toStrictEqual({
-				message: FALLBACK,
-				code: undefined,
-				retryAction: RetryActionDTO.none,
-				isRateLimit: true,
-			});
-		});
-	});
-
-	describe('retryAction resolution', () => {
-		it('honours an explicit retryAction from an SSE error event', () => {
-			const err = Object.assign(new Error('Transient hiccup'), {
-				code: ErrorCodeDTO.internal_error,
-				retryAction: RetryActionDTO.auto,
-			});
-
-			expect(resolveAssistantError(err, FALLBACK).retryAction).toBe(
-				RetryActionDTO.auto,
-			);
-		});
-
-		it('forces none for non-retryable permission errors', () => {
-			const err = restError(403, ErrorCodeDTO.permission_denied, 'forbidden');
-
-			expect(resolveAssistantError(err, FALLBACK).retryAction).toBe(
-				RetryActionDTO.none,
-			);
-		});
-
-		it('derives manual for 409 conflicts', () => {
-			const err = restError(409, ErrorCodeDTO.thread_has_active_execution, 'busy');
-
-			expect(resolveAssistantError(err, FALLBACK).retryAction).toBe(
-				RetryActionDTO.manual,
-			);
-		});
-
-		it('derives manual for 5xx responses', () => {
-			const err = restError(503, 'future_unknown_code', 'unavailable');
-
-			expect(resolveAssistantError(err, FALLBACK).retryAction).toBe(
-				RetryActionDTO.manual,
-			);
-		});
-
-		it('derives manual for network failures with no response', () => {
-			const err = new AxiosError('Network Error');
-
-			expect(resolveAssistantError(err, FALLBACK).retryAction).toBe(
-				RetryActionDTO.manual,
-			);
-		});
-
-		it('derives none for other 4xx responses', () => {
-			const err = restError(400, 'future_unknown_code', 'bad request');
-
-			expect(resolveAssistantError(err, FALLBACK).retryAction).toBe(
-				RetryActionDTO.none,
-			);
-		});
-
-		it('defaults to manual for non-Axios errors with no code', () => {
-			expect(resolveAssistantError(new Error('boom'), FALLBACK).retryAction).toBe(
-				RetryActionDTO.manual,
-			);
-		});
-	});
-});

frontend/src/container/AIAssistant/utils/__tests__/resolveAssistantErrorMessage.test.ts

@@ -0,0 +1,91 @@
+import { AxiosError } from 'axios';
+import { ErrorCodeDTO } from 'api/ai-assistant/sigNozAIAssistantAPI.schemas';
+
+import { resolveAssistantErrorMessage } from '../resolveAssistantErrorMessage';
+
+const FALLBACK = 'Something went wrong. Please try again.';
+
+describe('resolveAssistantErrorMessage', () => {
+	it('returns backend message for a known error code', () => {
+		const err = new AxiosError('Request failed');
+		err.response = {
+			status: 400,
+			data: {
+				error: {
+					code: ErrorCodeDTO.thread_busy,
+					message: 'This thread is busy. Try again shortly.',
+				},
+			},
+		} as AxiosError['response'];
+
+		expect(resolveAssistantErrorMessage(err, FALLBACK)).toStrictEqual({
+			message: 'This thread is busy. Try again shortly.',
+			isRateLimit: false,
+		});
+	});
+
+	it('falls back when error code is not in ErrorCodeDTO', () => {
+		const err = new AxiosError('Request failed');
+		err.response = {
+			status: 400,
+			data: {
+				error: {
+					code: 'future_unknown_code',
+					message: 'Backend-only message',
+				},
+			},
+		} as AxiosError['response'];
+
+		expect(resolveAssistantErrorMessage(err, FALLBACK)).toStrictEqual({
+			message: FALLBACK,
+			isRateLimit: false,
+		});
+	});
+
+	it('marks HTTP 429 responses as rate limited', () => {
+		const err = new AxiosError('Too many requests');
+		err.response = {
+			status: 429,
+			data: {
+				error: {
+					code: ErrorCodeDTO.hourly_message_limit,
+					message: 'Hourly limit reached.',
+				},
+			},
+		} as AxiosError['response'];
+
+		expect(resolveAssistantErrorMessage(err, FALLBACK)).toStrictEqual({
+			message: 'Hourly limit reached.',
+			isRateLimit: true,
+		});
+	});
+
+	it('uses backend message for known SSE rate-limit error codes', () => {
+		const err = Object.assign(new Error('Daily token limit exceeded.'), {
+			code: ErrorCodeDTO.daily_token_limit,
+		});
+
+		expect(resolveAssistantErrorMessage(err, FALLBACK)).toStrictEqual({
+			message: 'Daily token limit exceeded.',
+			isRateLimit: true,
+		});
+	});
+
+	it('marks 429 as rate limited even when error code is unknown', () => {
+		const err = new AxiosError('Too many requests');
+		err.response = {
+			status: 429,
+			data: {
+				error: {
+					code: 'future_unknown_code',
+					message: 'Too many requests',
+				},
+			},
+		} as AxiosError['response'];
+
+		expect(resolveAssistantErrorMessage(err, FALLBACK)).toStrictEqual({
+			message: FALLBACK,
+			isRateLimit: true,
+		});
+	});
+});

frontend/src/container/AIAssistant/utils/resolveAssistantError.ts

@@ -1,209 +0,0 @@
-import { isAxiosError } from 'axios';
-import {
-	ErrorCodeDTO,
-	RetryActionDTO,
-	type ErrorBodyDTO,
-	type ErrorResponseDTO,
-} from 'api/ai-assistant/sigNozAIAssistantAPI.schemas';
-
-export interface AssistantErrorResolution {
-	/** User-facing copy: code-specific FE copy → backend message → caller fallback. */
-	message: string;
-	/** Known backend error code, when one we recognise was supplied. */
-	code?: ErrorCodeDTO;
-	/**
-	 * Whether/how the failed action may be retried:
-	 *   • `auto`   — transient; the caller may silently re-attempt (capped).
-	 *   • `manual` — surface a Retry affordance to the user.
-	 *   • `none`   — retrying would re-fail deterministically; offer nothing.
-	 */
-	retryAction: RetryActionDTO;
-	/** Quota/limit error — callers hide the retry + feedback bar (retrying just re-limits). */
-	isRateLimit: boolean;
-}
-
-/** Quota/limit codes — surfaced as rate-limit errors (no retry, feedback bar hidden). */
-const RATE_LIMIT_ERROR_CODES = new Set<ErrorCodeDTO>([
-	ErrorCodeDTO.rate_limit_override_exceeds_ceiling,
-	ErrorCodeDTO.thread_message_limit,
-	ErrorCodeDTO.connection_limit_exceeded,
-	ErrorCodeDTO.hourly_message_limit,
-	ErrorCodeDTO.daily_message_limit,
-	ErrorCodeDTO.daily_token_limit,
-	ErrorCodeDTO.daily_cost_limit,
-	ErrorCodeDTO.budget_exceeded,
-]);
-
-/**
- * Codes whose retry would re-fail deterministically — permission/config/validation
- * failures. These force `retryAction: none` regardless of HTTP status.
- */
-const NON_RETRYABLE_CODES = new Set<ErrorCodeDTO>([
-	ErrorCodeDTO.permission_denied,
-	ErrorCodeDTO.user_disabled,
-	ErrorCodeDTO.org_disabled,
-	ErrorCodeDTO.validation_error,
-	ErrorCodeDTO.invalid_content_length,
-	ErrorCodeDTO.invalid_fork_target,
-	ErrorCodeDTO.missing_signoz_url,
-	ErrorCodeDTO.invalid_signoz_url,
-	ErrorCodeDTO.region_not_configured,
-]);
-
-/**
- * Code-specific, user-friendly copy. Takes precedence over the backend's raw
- * `error.message` so the user sees an actionable, consistent sentence rather
- * than internal phrasing. Codes absent here fall through to the backend message.
- */
-const ERROR_CODE_COPY: Partial<Record<ErrorCodeDTO, string>> = {
-	[ErrorCodeDTO.permission_denied]:
-		"You don't have permission to do that. Contact your workspace admin if you think this is a mistake.",
-	[ErrorCodeDTO.user_disabled]:
-		'Your access to the AI assistant has been disabled. Contact your workspace admin to re-enable it.',
-	[ErrorCodeDTO.org_disabled]:
-		'The AI assistant is disabled for your organisation. An admin can enable it in settings.',
-	[ErrorCodeDTO.thread_busy]:
-		'This conversation is still finishing a previous response. Give it a moment and try again.',
-	[ErrorCodeDTO.thread_has_active_execution]:
-		'This conversation is still finishing a previous response. Give it a moment and try again.',
-	[ErrorCodeDTO.hourly_message_limit]:
-		"You've reached the hourly message limit. Please try again later.",
-	[ErrorCodeDTO.daily_message_limit]:
-		"You've reached the daily message limit. Please try again tomorrow.",
-	[ErrorCodeDTO.daily_token_limit]:
-		"You've reached today's usage limit. Please try again tomorrow.",
-	[ErrorCodeDTO.daily_cost_limit]:
-		"You've reached today's usage limit. Please try again tomorrow.",
-	[ErrorCodeDTO.budget_exceeded]:
-		"You've reached your usage budget. Contact your workspace admin to raise it.",
-	[ErrorCodeDTO.thread_message_limit]:
-		'This conversation has reached its length limit. Start a new conversation to continue.',
-	[ErrorCodeDTO.connection_limit_exceeded]:
-		'Too many active conversations right now. Close one and try again.',
-	[ErrorCodeDTO.max_turns_exceeded]:
-		'The assistant reached the maximum number of steps for this request. Try rephrasing or breaking it into smaller asks.',
-	[ErrorCodeDTO.region_unreachable]:
-		"Couldn't reach your region's services. Please try again in a moment.",
-	[ErrorCodeDTO.region_not_configured]:
-		'No region is configured for the AI assistant yet. An admin can set this up in settings.',
-	[ErrorCodeDTO.mcp_unavailable]:
-		'A required service is temporarily unavailable. Please try again shortly.',
-	[ErrorCodeDTO.sandbox_unavailable]:
-		'The execution environment is temporarily unavailable. Please try again shortly.',
-	[ErrorCodeDTO.internal_error]:
-		'Something went wrong on our end. Please try again.',
-};
-
-function isErrorCodeDTO(code: string | undefined): code is ErrorCodeDTO {
-	return (
-		code !== undefined && (Object.values(ErrorCodeDTO) as string[]).includes(code)
-	);
-}
-
-function isRetryActionDTO(value: unknown): value is RetryActionDTO {
-	return (
-		typeof value === 'string' &&
-		(Object.values(RetryActionDTO) as string[]).includes(value)
-	);
-}
-
-/**
- * Pulls the structured error body out of either an Axios REST error or the
- * SSE error the streaming loop throws (a plain `Error` augmented with `code`).
- */
-function getErrorBody(err: unknown): ErrorBodyDTO | null {
-	if (isAxiosError(err)) {
-		return (err.response?.data as ErrorResponseDTO | undefined)?.error ?? null;
-	}
-
-	const code = (err as { code?: string } | undefined)?.code;
-	const message = err instanceof Error ? err.message : undefined;
-	if (!code || !message) {
-		return null;
-	}
-
-	return { code: code as ErrorCodeDTO, message };
-}
-
-function isRateLimit(code: ErrorCodeDTO | undefined, err: unknown): boolean {
-	if (isAxiosError(err) && err.response?.status === 429) {
-		return true;
-	}
-	return code !== undefined && RATE_LIMIT_ERROR_CODES.has(code);
-}
-
-/**
- * Resolves how the failed action may be retried. The backend's explicit signal
- * (SSE `ErrorEventDTO.retryAction`) is authoritative; otherwise we derive it
- * from the rate-limit/non-retryable code sets and the HTTP status.
- */
-function resolveRetryAction(
-	err: unknown,
-	code: ErrorCodeDTO | undefined,
-	rateLimited: boolean,
-): RetryActionDTO {
-	const explicit = (err as { retryAction?: unknown } | undefined)?.retryAction;
-	if (isRetryActionDTO(explicit)) {
-		return explicit;
-	}
-
-	if (rateLimited || (code !== undefined && NON_RETRYABLE_CODES.has(code))) {
-		return RetryActionDTO.none;
-	}
-
-	if (isAxiosError(err)) {
-		const status = err.response?.status;
-		// No response → network/timeout failure; retrying may well succeed.
-		if (status === undefined || status === 408) {
-			return RetryActionDTO.manual;
-		}
-		if (status === 401 || status === 403) {
-			return RetryActionDTO.none;
-		}
-		if (status === 409 || status >= 500) {
-			return RetryActionDTO.manual;
-		}
-		// Other 4xx (validation, bad request) re-fail deterministically.
-		return RetryActionDTO.none;
-	}
-
-	// Non-Axios transport/parse error with no code — let the user retry.
-	return RetryActionDTO.manual;
-}
-
-function resolveMessage(
-	code: ErrorCodeDTO | undefined,
-	body: ErrorBodyDTO | null,
-	fallback: string,
-): string {
-	if (code !== undefined && ERROR_CODE_COPY[code]) {
-		return ERROR_CODE_COPY[code] as string;
-	}
-	// Trust the backend's message only for codes we recognise — never surface
-	// raw text for unknown codes (could be an internal stack trace).
-	if (code !== undefined && body?.message.trim()) {
-		return body.message.trim();
-	}
-	return fallback;
-}
-
-/**
- * Single resolution point for both SSE and REST assistant errors. Maps the
- * error onto user-facing copy plus retry semantics, degrading gracefully for
- * unknown codes (falls back to `fallback` + a `manual` retry where sensible).
- */
-export function resolveAssistantError(
-	err: unknown,
-	fallback: string,
-): AssistantErrorResolution {
-	const body = getErrorBody(err);
-	const code = isErrorCodeDTO(body?.code) ? body?.code : undefined;
-	const rateLimited = isRateLimit(code, err);
-
-	return {
-		message: resolveMessage(code, body, fallback),
-		code,
-		retryAction: resolveRetryAction(err, code, rateLimited),
-		isRateLimit: rateLimited,
-	};
-}

frontend/src/container/AIAssistant/utils/resolveAssistantErrorMessage.ts

@@ -0,0 +1,71 @@
+import { isAxiosError } from 'axios';
+import {
+	ErrorCodeDTO,
+	type ErrorBodyDTO,
+	type ErrorResponseDTO,
+} from 'api/ai-assistant/sigNozAIAssistantAPI.schemas';
+
+export interface AssistantErrorResolution {
+	message: string;
+	isRateLimit: boolean;
+}
+
+function isErrorCodeDTO(code: string | undefined): code is ErrorCodeDTO {
+	return (
+		code !== undefined && (Object.values(ErrorCodeDTO) as string[]).includes(code)
+	);
+}
+
+const RATE_LIMIT_ERROR_CODES = new Set<ErrorCodeDTO>([
+	ErrorCodeDTO.rate_limit_override_exceeds_ceiling,
+	ErrorCodeDTO.thread_message_limit,
+	ErrorCodeDTO.connection_limit_exceeded,
+	ErrorCodeDTO.hourly_message_limit,
+	ErrorCodeDTO.daily_message_limit,
+	ErrorCodeDTO.daily_token_limit,
+	ErrorCodeDTO.daily_cost_limit,
+	ErrorCodeDTO.budget_exceeded,
+]);
+
+function isRateLimitError(code: string | undefined, err: unknown): boolean {
+	if (isAxiosError(err) && err.response?.status === 429) {
+		return true;
+	}
+
+	return isErrorCodeDTO(code) && RATE_LIMIT_ERROR_CODES.has(code);
+}
+
+function getErrorBody(err: unknown): ErrorBodyDTO | null {
+	if (isAxiosError(err)) {
+		return (err.response?.data as ErrorResponseDTO | undefined)?.error ?? null;
+	}
+
+	const code = (err as { code?: string } | undefined)?.code;
+	const message = err instanceof Error ? err.message : undefined;
+	if (!code || !message) {
+		return null;
+	}
+
+	return { code: code as ErrorCodeDTO, message };
+}
+
+/**
+ * Uses `error.message` when `error.code` is a known `ErrorCodeDTO`;
+ * otherwise returns `fallback`.
+ */
+export function resolveAssistantErrorMessage(
+	err: unknown,
+	fallback: string,
+): AssistantErrorResolution {
+	const body = getErrorBody(err);
+	const isRateLimit = isRateLimitError(body?.code, err);
+
+	if (body && isErrorCodeDTO(body.code) && body.message.trim()) {
+		return {
+			message: body.message.trim(),
+			isRateLimit,
+		};
+	}
+
+	return { message: fallback, isRateLimit: Boolean(isRateLimit) };
+}

frontend/src/container/AllError/__tests__/useExceptionsStripInfo.test.tsx

@@ -1,53 +0,0 @@
-import { renderHook } from '@testing-library/react';
-import { useBottomStripStore } from 'container/BottomStrip/store/useBottomStripStore';
-import { StripItemKind } from 'container/BottomStrip/types';
-
-import { useExceptionsStripInfo } from '../useExceptionsStripInfo';
-
-describe('useExceptionsStripInfo', () => {
-	beforeEach(() => {
-		useBottomStripStore.setState({ left: null, ownerId: null });
-	});
-
-	it('shows the rows on the page against the total', () => {
-		renderHook(() => useExceptionsStripInfo({ shownCount: 25, totalCount: 500 }));
-
-		expect(useBottomStripStore.getState().left).toMatchObject([
-			{ kind: StripItemKind.Text, text: '25 of 500 exceptions' },
-		]);
-	});
-
-	it('still says n of m when the whole list fits on one page', () => {
-		renderHook(() => useExceptionsStripInfo({ shownCount: 42, totalCount: 42 }));
-
-		expect(useBottomStripStore.getState().left?.[0]).toMatchObject({
-			text: '42 of 42 exceptions',
-		});
-	});
-
-	it('says exception, not exceptions, when there is one', () => {
-		renderHook(() => useExceptionsStripInfo({ shownCount: 1, totalCount: 1 }));
-
-		expect(useBottomStripStore.getState().left?.[0]).toMatchObject({
-			text: '1 of 1 exception',
-		});
-	});
-
-	it('shows zero before the counts land', () => {
-		renderHook(() => useExceptionsStripInfo({ shownCount: 0, totalCount: 0 }));
-
-		expect(useBottomStripStore.getState().left?.[0]).toMatchObject({
-			text: '0 of 0 exceptions',
-		});
-	});
-
-	it('clears the strip when the page unmounts', () => {
-		const { unmount } = renderHook(() =>
-			useExceptionsStripInfo({ shownCount: 25, totalCount: 500 }),
-		);
-
-		unmount();
-
-		expect(useBottomStripStore.getState().left).toBeNull();
-	});
-});

frontend/src/container/AllError/index.tsx

@@ -38,7 +38,6 @@ import { Exception, PayloadProps } from 'types/api/errors/getAll';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
 import { FilterDropdownExtendsProps } from './types';
-import { useExceptionsStripInfo } from './useExceptionsStripInfo';
 import {
 	extractFilterValues,
 	getDefaultFilterValue,
@@ -161,11 +160,6 @@ function AllErrors(): JSX.Element {
 			},
 		]);
 
-	useExceptionsStripInfo({
-		shownCount: data?.payload?.length ?? 0,
-		totalCount: errorCountResponse.data?.payload ?? 0,
-	});
-
 	const isFetching = isErrorsFetching || errorCountResponse.isFetching;
 	useEffect(() => {
 		setIsFetching(isFetching);

frontend/src/container/AllError/useExceptionsStripInfo.ts

@@ -1,26 +0,0 @@
-import { useMemo } from 'react';
-import { useBottomStrip } from 'container/BottomStrip/useBottomStrip';
-import { type StripItem, StripItemKind } from 'container/BottomStrip/types';
-import { pluralize } from 'utils/pluralize';
-
-interface UseExceptionsStripInfoArgs {
-	shownCount: number;
-	totalCount: number;
-}
-
-export function useExceptionsStripInfo({
-	shownCount,
-	totalCount,
-}: UseExceptionsStripInfoArgs): void {
-	const items = useMemo<StripItem[]>(
-		() => [
-			{
-				kind: StripItemKind.Text,
-				text: `${shownCount} of ${pluralize(totalCount, 'exception')}`,
-			},
-		],
-		[shownCount, totalCount],
-	);
-
-	useBottomStrip(items);
-}

frontend/src/container/ApiMonitoring/Explorer/Explorer.styles.scss

@@ -1,15 +1,23 @@
-.api-monitoring-explorer {
-	.api-quick-filters-header {
-		padding: 12px;
-		border-bottom: 1px solid var(--l1-border);
-		border-right: 1px solid var(--l1-border);
+.api-monitoring-page {
+	display: flex;
+	height: 100%;
 
-		display: flex;
-		align-items: center;
-		gap: 6px;
+	.api-quick-filter-left-section {
+		width: 0%;
+		flex-shrink: 0;
 
-		font-size: 14px;
-		line-height: 18px;
+		.api-quick-filters-header {
+			padding: 12px;
+			border-bottom: 1px solid var(--l1-border);
+			border-right: 1px solid var(--l1-border);
+
+			display: flex;
+			align-items: center;
+			gap: 6px;
+
+			font-size: 14px;
+			line-height: 18px;
+		}
 	}
 
 	.api-module-right-section {
@@ -153,6 +161,16 @@
 			}
 		}
 	}
+
+	&.filter-visible {
+		.api-quick-filter-left-section {
+			width: 260px;
+		}
+
+		.api-module-right-section {
+			width: calc(100% - 260px);
+		}
+	}
 }
 
 .no-filtered-domains-message-container {

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

@@ -1,7 +1,8 @@
 import { useEffect } from 'react';
 import * as Sentry from '@sentry/react';
 import logEvent from 'api/common/logEvent';
-import QuickFiltersLayout from 'components/QuickFilters/QuickFiltersLayout/QuickFiltersLayout';
+import cx from 'classnames';
+import QuickFilters from 'components/QuickFilters/QuickFilters';
 import { useSignalFieldApis } from 'components/QuickFilters/hooks/useSignalFieldApis';
 import { QuickFiltersSource, SignalType } from 'components/QuickFilters/types';
 import ErrorBoundaryFallback from 'pages/ErrorBoundaryFallback/ErrorBoundaryFallback';
@@ -19,21 +20,20 @@ function Explorer(): JSX.Element {
 
 	return (
 		<Sentry.ErrorBoundary fallback={<ErrorBoundaryFallback />}>
-			<QuickFiltersLayout
-				className="api-monitoring-explorer"
-				showFilters
-				quickFilterProps={{
-					className: 'qf-api-monitoring',
-					source: QuickFiltersSource.API_MONITORING,
-					signal: SignalType.API_MONITORING,
-					showFilterCollapse: false,
-					showQueryName: false,
-					handleFilterVisibilityChange: (): void => {},
-					useFieldApis: quickFilterFieldApis,
-				}}
-			>
+			<div className={cx('api-monitoring-page', 'filter-visible')}>
+				<section className="api-quick-filter-left-section">
+					<QuickFilters
+						className="qf-api-monitoring"
+						source={QuickFiltersSource.API_MONITORING}
+						signal={SignalType.API_MONITORING}
+						showFilterCollapse={false}
+						showQueryName={false}
+						handleFilterVisibilityChange={(): void => {}}
+						useFieldApis={quickFilterFieldApis}
+					/>
+				</section>
 				<DomainList />
-			</QuickFiltersLayout>
+			</div>
 		</Sentry.ErrorBoundary>
 	);
 }

frontend/src/container/AppLayout/AppLayout.styles.scss

@@ -53,10 +53,6 @@
 		z-index: 0;
 		background: var(--l1-background);
 
-		// Column so the bottom strip sits under the scrolling content, not inside it.
-		display: flex;
-		flex-direction: column;
-
 		&.full-screen-content {
 			width: 100%;
 		}
@@ -74,9 +70,7 @@
 
 .chat-support-gateway {
 	position: fixed;
-	// Lifted above the bottom strip. Don't extend this pattern — new fixed-bottom
-	// UI belongs in the bounded layout, not in another offset here.
-	bottom: calc(20px + var(--bottom-strip-height, 0px));
+	bottom: 20px;
 	right: 20px;
 	z-index: 1000;
 

frontend/src/container/AppLayout/index.tsx

@@ -35,6 +35,7 @@ import AuthZTooltip from 'lib/authz/components/AuthZTooltip/AuthZTooltip';
 import { SubscriptionManagePermissions } from 'lib/authz/hooks/useAuthZ/permissions/subscription.permissions';
 import { MIN_ACCOUNT_AGE_FOR_CHANGELOG } from 'constants/changelog';
 import { Events } from 'constants/events';
+import { FeatureKeys } from 'constants/features';
 import { LOCALSTORAGE } from 'constants/localStorage';
 import ROUTES from 'constants/routes';
 import { GlobalShortcuts } from 'constants/shortcuts/globalShortcuts';
@@ -42,7 +43,6 @@ import { USER_PREFERENCES } from 'constants/userPreferences';
 import AIAssistantModal from 'container/AIAssistant/AIAssistantModal';
 import AIAssistantPanel from 'container/AIAssistant/AIAssistantPanel';
 import { useAIAssistantStore } from 'container/AIAssistant/store/useAIAssistantStore';
-import BottomStrip from 'container/BottomStrip';
 import SideNav from 'container/SideNav';
 import TopNav from 'container/TopNav';
 import dayjs from 'dayjs';
@@ -51,8 +51,6 @@ import { useIsDarkMode } from 'hooks/useDarkMode';
 import { useGetTenantLicense } from 'hooks/useGetTenantLicense';
 import { useIsAIAssistantEnabled } from 'hooks/useIsAIAssistantEnabled';
 import { useNotifications } from 'hooks/useNotifications';
-import { ChatSupportState, useChatSupport } from 'hooks/useChatSupport';
-import { useSavedViewEnabled } from 'hooks/useSavedViewEnabled';
 import useTabVisibility from 'hooks/useTabFocus';
 import history from 'lib/history';
 import { isNull } from 'lodash-es';
@@ -103,6 +101,9 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 		trialInfo,
 		activeLicense,
 		isFetchingActiveLicense,
+		featureFlags,
+		isFetchingFeatureFlags,
+		featureFlagsFetchError,
 		userPreferences,
 		isFetchingUserPreferences,
 		updateChangelog,
@@ -401,7 +402,6 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 	}, [pathname]);
 
 	const isToDisplayLayout = isLoggedIn;
-	const isSavedViewEnabled = useSavedViewEnabled();
 
 	const routeKey = useMemo(() => getRouteKey(pathname), [pathname]);
 	const pageTitle = t(routeKey);
@@ -489,7 +489,42 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 		}
 	}, [isDarkMode]);
 
-	const chatSupport = useChatSupport();
+	const showAddCreditCardModal = useMemo(() => {
+		if (
+			!isFetchingFeatureFlags &&
+			(featureFlags || featureFlagsFetchError) &&
+			activeLicense &&
+			trialInfo
+		) {
+			let isChatSupportEnabled = false;
+			let isPremiumSupportEnabled = false;
+			if (featureFlags && featureFlags.length > 0) {
+				isChatSupportEnabled =
+					featureFlags.find((flag) => flag.name === FeatureKeys.CHAT_SUPPORT)
+						?.active || false;
+
+				isPremiumSupportEnabled =
+					featureFlags.find((flag) => flag.name === FeatureKeys.PREMIUM_SUPPORT)
+						?.active || false;
+			}
+			return (
+				isLoggedIn &&
+				!isPremiumSupportEnabled &&
+				isChatSupportEnabled &&
+				!trialInfo?.trialConvertedToSubscription &&
+				isCloudUserVal
+			);
+		}
+		return false;
+	}, [
+		featureFlags,
+		featureFlagsFetchError,
+		isCloudUserVal,
+		isFetchingFeatureFlags,
+		isLoggedIn,
+		activeLicense,
+		trialInfo,
+	]);
 
 	// Listen for API warnings
 	const handleWarning = (
@@ -833,10 +868,6 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 								</OverlayScrollbar>
 							</LayoutContent>
 						</Sentry.ErrorBoundary>
-
-						{isSavedViewEnabled && isToDisplayLayout && !renderFullScreen && (
-							<BottomStrip />
-						)}
 					</div>
 
 					{isLoggedIn && isAIAssistantEnabled && (
@@ -847,16 +878,12 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 					)}
 				</Flex>
 
-				{chatSupport === ChatSupportState.NeedsCard && !isSavedViewEnabled && (
-					<ChatSupportGateway />
-				)}
+				{showAddCreditCardModal && <ChatSupportGateway />}
 				{showChangelogModal && changelog && (
 					<ChangelogModal changelog={changelog} onClose={toggleChangelogModal} />
 				)}
 
-				<Toaster
-					offset={{ bottom: 'calc(var(--bottom-strip-height, 0px) + 24px)' }}
-				/>
+				<Toaster />
 			</Layout>
 		</TooltipProvider>
 	);

frontend/src/container/AppLayout/styles.ts

@@ -12,12 +12,8 @@ export const Layout = styled(LayoutComponent)`
 	}
 `;
 
-// Takes the height left in `.app-content` after the bottom strip.
-// `min-height: 0` is not needed right now, overlayscrollbars already sets
-// `overflow: auto` here. Kept so this does not break if that goes away.
 export const LayoutContent = styled(LayoutComponent.Content)`
-	flex: 1;
-	min-height: 0;
+	height: 100%;
 	&::-webkit-scrollbar {
 		width: 0.1rem;
 	}

frontend/src/container/BottomStrip/AskNoz/AskNoz.module.scss

@@ -1,36 +0,0 @@
-.askNoz {
-	display: flex;
-	align-items: center;
-	flex-shrink: 0;
-}
-
-.badge {
-	flex-shrink: 0;
-	display: inline-flex;
-	line-height: 0;
-	color: var(--accent-primary);
-}
-
-.pulseDot {
-	position: relative;
-	display: inline-flex;
-	align-items: center;
-	justify-content: center;
-	line-height: 0;
-	animation: askNozDotPulse 1.5s ease-in-out infinite;
-	transform: scale(0.8);
-	margin-right: -12px;
-}
-
-@keyframes askNozDotPulse {
-	0%,
-	100% {
-		opacity: 1;
-		transform: scale(1);
-	}
-
-	50% {
-		opacity: 0.35;
-		transform: scale(0.82);
-	}
-}

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

@@ -1,76 +0,0 @@
-import { useLocation } from 'react-router-dom';
-import { Button } from '@signozhq/ui/button';
-import { TooltipSimple } from '@signozhq/ui/tooltip';
-import Noz from 'components/Noz/Noz';
-import { NOZ_TOOLTIP_TITLE } from 'components/Noz/Noz.constants';
-import { selectPendingUserInputStreamCount } from 'container/AIAssistant/store/pendingInputSelectors';
-import {
-	openAIAssistant,
-	useAIAssistantStore,
-} from 'container/AIAssistant/store/useAIAssistantStore';
-import { useIsAIAssistantEnabled } from 'hooks/useIsAIAssistantEnabled';
-import ROUTES from 'constants/routes';
-import { Dot } from '@signozhq/icons';
-
-import styles from './AskNoz.module.scss';
-
-/**
- * Opens the Noz drawer, matching the header entry it replaces. Cmd+K opens the
- * modal instead; this is deliberately the drawer.
- *
- * Carries the header's pending badge: when Noz is blocked on the user
- * (`awaiting_approval` / `awaiting_clarification`) a dot pulses. Without it,
- * hiding the header button would remove a notification rather than move it.
- */
-function AskNoz(): JSX.Element | null {
-	const { pathname } = useLocation();
-	const isAIAssistantEnabled = useIsAIAssistantEnabled();
-	const isDrawerOpen = useAIAssistantStore((state) => state.isDrawerOpen);
-	const isModalOpen = useAIAssistantStore((state) => state.isModalOpen);
-	const pendingUserInputCount = useAIAssistantStore(
-		selectPendingUserInputStreamCount,
-	);
-
-	// Noz is already on screen in the modal, so the "needs you" dot would be noise.
-	const showPendingBadge = pendingUserInputCount > 0 && !isModalOpen;
-
-	// The drawer does not render on the Noz full page, so the button would be inert.
-	const isAIAssistantPage = pathname.startsWith(ROUTES.AI_ASSISTANT_BASE);
-
-	if (!isAIAssistantEnabled || isDrawerOpen || isAIAssistantPage) {
-		return null;
-	}
-
-	return (
-		<div className={styles.askNoz} data-testid="bottom-strip-ask-noz">
-			{showPendingBadge && (
-				<span className={styles.badge} aria-hidden>
-					<span className={styles.pulseDot}>
-						<Dot size={36} />
-					</span>
-				</span>
-			)}
-			<TooltipSimple title={NOZ_TOOLTIP_TITLE}>
-				<Button
-					variant="ghost"
-					color="secondary"
-					size="sm"
-					className="noz-wave"
-					prefix={<Noz size={16} />}
-					onClick={(): void => openAIAssistant()}
-					aria-label={
-						showPendingBadge
-							? `Ask Noz, ${pendingUserInputCount} ${
-									pendingUserInputCount === 1 ? 'action needs' : 'actions need'
-								} your response`
-							: 'Ask Noz'
-					}
-				>
-					Ask Noz
-				</Button>
-			</TooltipSimple>
-		</div>
-	);
-}
-
-export default AskNoz;

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

@@ -1,133 +0,0 @@
-import { fireEvent } from '@testing-library/react';
-import { openAIAssistant } from 'container/AIAssistant/store/useAIAssistantStore';
-import { useIsAIAssistantEnabled } from 'hooks/useIsAIAssistantEnabled';
-import { render } from 'tests/test-utils';
-
-import AskNoz from '../AskNoz';
-
-jest.mock('hooks/useIsAIAssistantEnabled');
-jest.mock('container/AIAssistant/store/useAIAssistantStore', () => ({
-	openAIAssistant: jest.fn(),
-	useAIAssistantStore: jest.fn(),
-}));
-
-const mockEnabled = useIsAIAssistantEnabled as jest.MockedFunction<
-	typeof useIsAIAssistantEnabled
->;
-const mockOpen = openAIAssistant as jest.MockedFunction<typeof openAIAssistant>;
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-const { useAIAssistantStore } = jest.requireMock(
-	'container/AIAssistant/store/useAIAssistantStore',
-) as { useAIAssistantStore: jest.Mock };
-
-/** The component reads the store through three separate selector calls. */
-function mockStore({
-	isDrawerOpen = false,
-	isModalOpen = false,
-	pendingCount = 0,
-}: {
-	isDrawerOpen?: boolean;
-	isModalOpen?: boolean;
-	pendingCount?: number;
-} = {}): void {
-	const state = { isDrawerOpen, isModalOpen, streams: {} };
-	useAIAssistantStore.mockImplementation((selector: (s: unknown) => unknown) => {
-		const picked = selector(state);
-		// `selectPendingUserInputStreamCount` walks `streams`, which is empty here,
-		// so stand in the count we want to assert against.
-		return typeof picked === 'number' ? pendingCount : picked;
-	});
-}
-
-// `TooltipSimple` replaces its trigger's props, so the testId lives on the
-// wrapper and the button itself is reached by role — there is only ever one.
-const SLOT = 'bottom-strip-ask-noz';
-
-describe('AskNoz', () => {
-	beforeEach(() => {
-		jest.clearAllMocks();
-		mockEnabled.mockReturnValue(true);
-		mockStore();
-	});
-
-	describe('visibility', () => {
-		it('renders when the assistant is enabled', () => {
-			const { getByRole } = render(<AskNoz />);
-
-			expect(getByRole('button')).toBeInTheDocument();
-		});
-
-		it('renders nothing when the assistant is disabled', () => {
-			mockEnabled.mockReturnValue(false);
-
-			const { queryByTestId } = render(<AskNoz />);
-
-			expect(queryByTestId(SLOT)).not.toBeInTheDocument();
-		});
-
-		it('renders nothing while the drawer is open', () => {
-			mockStore({ isDrawerOpen: true });
-
-			const { queryByTestId } = render(<AskNoz />);
-
-			expect(queryByTestId(SLOT)).not.toBeInTheDocument();
-		});
-
-		it('renders nothing on the Noz full page, where the drawer does not mount', () => {
-			const { queryByTestId } = render(<AskNoz />, undefined, {
-				initialRoute: '/ai-assistant/some-conversation-id',
-			});
-
-			expect(queryByTestId(SLOT)).not.toBeInTheDocument();
-		});
-	});
-
-	describe('what it does', () => {
-		it('opens the drawer on click', () => {
-			const { getByRole } = render(<AskNoz />);
-
-			fireEvent.click(getByRole('button'));
-
-			expect(mockOpen).toHaveBeenCalledTimes(1);
-		});
-	});
-
-	describe('pending badge', () => {
-		it('announces the count when Noz is waiting on the user', () => {
-			mockStore({ pendingCount: 2 });
-
-			const { getByRole } = render(<AskNoz />);
-
-			expect(getByRole('button')).toHaveAttribute(
-				'aria-label',
-				'Ask Noz, 2 actions need your response',
-			);
-		});
-
-		it('uses the singular for one pending action', () => {
-			mockStore({ pendingCount: 1 });
-
-			const { getByRole } = render(<AskNoz />);
-
-			expect(getByRole('button')).toHaveAttribute(
-				'aria-label',
-				'Ask Noz, 1 action needs your response',
-			);
-		});
-
-		it('stays quiet when nothing is pending', () => {
-			const { getByRole } = render(<AskNoz />);
-
-			expect(getByRole('button')).toHaveAttribute('aria-label', 'Ask Noz');
-		});
-
-		it('stays quiet while the modal is open, Noz is already on screen', () => {
-			mockStore({ isModalOpen: true, pendingCount: 3 });
-
-			const { getByRole } = render(<AskNoz />);
-
-			expect(getByRole('button')).toHaveAttribute('aria-label', 'Ask Noz');
-		});
-	});
-});

frontend/src/container/BottomStrip/BottomStrip.module.scss

@@ -1,45 +0,0 @@
-.strip {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	gap: var(--spacing-6);
-
-	flex-shrink: 0;
-	height: var(--bottom-strip-height);
-	padding: 0 var(--spacing-6);
-
-	background: var(--l2-background);
-	border-top: 1px solid var(--l2-border);
-
-	--button-font-size: 12px;
-
-	font-family: var(--font-family-sf-mono, monospace);
-
-	// Above page content, below the body-portalled overlays that are meant to
-	// cover the strip.
-	position: relative;
-	z-index: 1;
-}
-
-.left,
-.right {
-	display: flex;
-	align-items: center;
-	gap: var(--spacing-4);
-	min-width: 0;
-}
-
-.left {
-	cursor: default;
-}
-
-// separator b/w strip entities
-.left > *:not(:last-child)::after,
-.right > *:not(:last-child)::after {
-	content: '';
-	flex-shrink: 0;
-	width: 1px;
-	height: 14px;
-	background: var(--l2-border);
-	margin-left: var(--spacing-4);
-}

frontend/src/container/BottomStrip/LeftSlot/LeftSlot.tsx

@@ -1,53 +0,0 @@
-import * as Sentry from '@sentry/react';
-import { useAppContext } from 'providers/App/App';
-
-import StripKeyValue from '../components/StripKeyValue/StripKeyValue';
-import StripTypography from '../components/StripTypography/StripTypography';
-import { useBottomStripStore } from '../store/useBottomStripStore';
-import { type StripItem, StripItemKind } from '../types';
-
-function renderItem(item: StripItem, index: number): JSX.Element {
-	if (item.kind === StripItemKind.KeyValue) {
-		return (
-			<StripKeyValue
-				key={index}
-				label={item.label}
-				value={item.value}
-				prefix={item.prefix}
-				tone={item.tone}
-			/>
-		);
-	}
-
-	return (
-		// eslint-disable-next-line react/no-array-index-key
-		<StripTypography key={index} prefix={item.prefix}>
-			{item.text}
-		</StripTypography>
-	);
-}
-
-function LeftSlot(): JSX.Element | null {
-	const { versionData } = useAppContext();
-	const left = useBottomStripStore((state) => state.left);
-	const ownerId = useBottomStripStore((state) => state.ownerId);
-
-	const version = versionData?.version?.trim();
-	const versionNode = version ? (
-		<StripTypography>{version}</StripTypography>
-	) : null;
-
-	if (!left?.length) {
-		return versionNode;
-	}
-
-	return (
-		// Keyed so a page whose items throw does not leave the boundary latched on
-		// the fallback for every page after it.
-		<Sentry.ErrorBoundary key={ownerId} fallback={<>{versionNode}</>}>
-			{left.map(renderItem)}
-		</Sentry.ErrorBoundary>
-	);
-}
-
-export default LeftSlot;

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

@@ -1,45 +0,0 @@
-import { useState } from 'react';
-import { Button } from '@signozhq/ui/button';
-import AddCreditCardModal from 'components/AddCreditCardModal/AddCreditCardModal';
-import { ChatSupportState, useChatSupport } from 'hooks/useChatSupport';
-import { MessageSquareText } from '@signozhq/icons';
-
-function SupportButton(): JSX.Element | null {
-	const chatSupport = useChatSupport();
-	const [isAddCreditCardModalOpen, setIsAddCreditCardModalOpen] =
-		useState(false);
-
-	if (chatSupport === ChatSupportState.Unavailable) {
-		return null;
-	}
-
-	const handleClick = (): void => {
-		if (chatSupport === ChatSupportState.NeedsCard) {
-			setIsAddCreditCardModalOpen(true);
-			return;
-		}
-		window.Pylon?.('show');
-	};
-
-	return (
-		<>
-			<Button
-				variant="ghost"
-				color="secondary"
-				size="sm"
-				prefix={<MessageSquareText size={16} />}
-				onClick={handleClick}
-				testId="bottom-strip-support"
-			>
-				Support
-			</Button>
-
-			<AddCreditCardModal
-				open={isAddCreditCardModalOpen}
-				onClose={(): void => setIsAddCreditCardModalOpen(false)}
-			/>
-		</>
-	);
-}
-
-export default SupportButton;

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

@@ -1,81 +0,0 @@
-import { fireEvent } from '@testing-library/react';
-import { ChatSupportState, useChatSupport } from 'hooks/useChatSupport';
-import { render } from 'tests/test-utils';
-
-import SupportButton from '../SupportButton';
-
-jest.mock('hooks/useChatSupport', () => ({
-	...jest.requireActual('hooks/useChatSupport'),
-	useChatSupport: jest.fn(),
-}));
-
-const mockChatSupport = useChatSupport as jest.MockedFunction<
-	typeof useChatSupport
->;
-
-const BUTTON = 'bottom-strip-support';
-const MODAL_TITLE = 'Add Credit Card for Chat Support';
-
-describe('SupportButton', () => {
-	beforeEach(() => {
-		jest.clearAllMocks();
-		window.Pylon = jest.fn() as never;
-	});
-
-	describe('when Pylon is available', () => {
-		beforeEach(() => mockChatSupport.mockReturnValue(ChatSupportState.Pylon));
-
-		it('shows the button', () => {
-			const { getByTestId } = render(<SupportButton />);
-
-			expect(getByTestId(BUTTON)).toBeInTheDocument();
-		});
-
-		it('opens the Pylon widget on click', () => {
-			const { getByTestId } = render(<SupportButton />);
-
-			fireEvent.click(getByTestId(BUTTON));
-
-			expect(window.Pylon).toHaveBeenCalledWith('show');
-		});
-
-		it('does not open the credit card modal', () => {
-			const { getByTestId, queryByText } = render(<SupportButton />);
-
-			fireEvent.click(getByTestId(BUTTON));
-
-			expect(queryByText(MODAL_TITLE)).not.toBeInTheDocument();
-		});
-	});
-
-	describe('when the user needs a card', () => {
-		beforeEach(() => mockChatSupport.mockReturnValue(ChatSupportState.NeedsCard));
-
-		it('shows the same button', () => {
-			const { getByTestId } = render(<SupportButton />);
-
-			expect(getByTestId(BUTTON)).toBeInTheDocument();
-		});
-
-		it('opens the credit card modal on click, not Pylon', () => {
-			const { getByTestId, getByText } = render(<SupportButton />);
-
-			fireEvent.click(getByTestId(BUTTON));
-
-			expect(getByText(MODAL_TITLE)).toBeInTheDocument();
-			expect(window.Pylon).not.toHaveBeenCalled();
-		});
-	});
-
-	describe('when support is unavailable', () => {
-		beforeEach(() =>
-			mockChatSupport.mockReturnValue(ChatSupportState.Unavailable),
-		);
-
-		it('renders nothing at all', () => {
-			const { queryByTestId } = render(<SupportButton />);
-
-			expect(queryByTestId(BUTTON)).not.toBeInTheDocument();
-		});
-	});
-});

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

@@ -1,176 +0,0 @@
-import { useMemo, useState } from 'react';
-import { fireEvent } from '@testing-library/react';
-import { render } from 'tests/test-utils';
-import { Info } from 'types/api/v1/version/get';
-
-import BottomStrip, {
-	BOTTOM_STRIP_HEIGHT,
-	BOTTOM_STRIP_HEIGHT_VAR,
-	BOTTOM_STRIP_ON_CLASS,
-} from '..';
-import { useBottomStripStore } from '../store/useBottomStripStore';
-import { useBottomStrip } from '../useBottomStrip';
-import { StripItemKind } from '../types';
-
-/** Stands in for a page that puts something on the left of the strip. */
-function Page({ text }: { text: string }): null {
-	useBottomStrip(useMemo(() => [{ kind: StripItemKind.Text, text }], [text]));
-	return null;
-}
-
-/**
- * A page whose icon throws when the strip renders it. `prefix` is the one place
- * the config still takes a node, so it is the only way a page can break it.
- */
-function BoomPage(): null {
-	useBottomStrip([{ kind: StripItemKind.Text, text: 'boom', prefix: <Boom /> }]);
-	return null;
-}
-
-/** A page whose value changes without needing `rerender`. */
-function ChangingPage(): JSX.Element {
-	const [count, setCount] = useState(600);
-
-	useBottomStrip(
-		useMemo(
-			() => [{ kind: StripItemKind.Text, text: `${count} traces` }],
-			[count],
-		),
-	);
-
-	return (
-		<button type="button" onClick={(): void => setCount(42)}>
-			change
-		</button>
-	);
-}
-
-/** A page node that blows up while the strip renders it. */
-function Boom(): JSX.Element {
-	throw new Error('bad left node');
-}
-
-const VERSION = 'v0.134.67';
-const versionData: Info = { version: VERSION, ee: 'Y', setupCompleted: true };
-const withVersion = { appContextOverrides: { versionData } };
-
-describe('BottomStrip', () => {
-	// The store is module level, so it outlives each test.
-	beforeEach(() => {
-		useBottomStripStore.setState({ left: null, ownerId: null });
-	});
-
-	it('publishes the body class and height property while mounted', () => {
-		const { unmount } = render(<BottomStrip />);
-
-		expect(document.body.classList.contains(BOTTOM_STRIP_ON_CLASS)).toBe(true);
-		expect(document.body.style.getPropertyValue(BOTTOM_STRIP_HEIGHT_VAR)).toBe(
-			`${BOTTOM_STRIP_HEIGHT}px`,
-		);
-
-		unmount();
-
-		expect(document.body.classList.contains(BOTTOM_STRIP_ON_CLASS)).toBe(false);
-		expect(document.body.style.getPropertyValue(BOTTOM_STRIP_HEIGHT_VAR)).toBe(
-			'',
-		);
-	});
-
-	// The string is whatever the Go build injected, so it is rendered untouched —
-	// same as SideNav. Release tags carry the "v", local builds do not.
-	it.each([['v0.134.67'], ['main-64f1c2a']])(
-		'renders the build version %p exactly as given',
-		(version) => {
-			const { getByText } = render(<BottomStrip />, undefined, {
-				appContextOverrides: {
-					versionData: { version, ee: 'Y', setupCompleted: true },
-				},
-			});
-
-			expect(getByText(version)).toBeInTheDocument();
-		},
-	);
-
-	it('renders the strip without a version when none is available', () => {
-		const { getByTestId } = render(<BottomStrip />, undefined, {
-			appContextOverrides: { versionData: null },
-		});
-
-		const strip = getByTestId('bottom-strip');
-
-		expect(strip).toBeInTheDocument();
-		expect(strip).toHaveTextContent('');
-	});
-
-	// `tests/test-utils` builds its wrapper around the first `ui`, so `rerender`
-	// re-renders the original tree. These drive change through state and through
-	// separate trees instead, which the module-level store lets them share.
-	describe('left slot', () => {
-		it('shows what the page put there instead of the version', () => {
-			render(<Page text="600 traces" />);
-			const { getByText, queryByText } = render(
-				<BottomStrip />,
-				undefined,
-				withVersion,
-			);
-
-			expect(getByText('600 traces')).toBeInTheDocument();
-			expect(queryByText(VERSION)).not.toBeInTheDocument();
-		});
-
-		it('falls back to the version once the page is gone', () => {
-			const page = render(<Page text="600 traces" />);
-			const { getByText } = render(<BottomStrip />, undefined, withVersion);
-
-			page.unmount();
-
-			expect(getByText(VERSION)).toBeInTheDocument();
-		});
-
-		it('updates when the page changes what it shows', () => {
-			render(<ChangingPage />);
-			const { getByText, getByRole } = render(
-				<BottomStrip />,
-				undefined,
-				withVersion,
-			);
-
-			expect(getByText('600 traces')).toBeInTheDocument();
-
-			fireEvent.click(getByRole('button', { name: 'change' }));
-
-			expect(getByText('42 traces')).toBeInTheDocument();
-		});
-
-		it('falls back to the version when the page node throws', () => {
-			// React logs the caught error, which is noise here.
-			const consoleError = jest
-				.spyOn(console, 'error')
-				.mockImplementation(() => {});
-
-			render(<BoomPage />);
-			const { getByTestId, getByText } = render(
-				<BottomStrip />,
-				undefined,
-				withVersion,
-			);
-
-			expect(getByTestId('bottom-strip')).toBeInTheDocument();
-			expect(getByText(VERSION)).toBeInTheDocument();
-
-			consoleError.mockRestore();
-		});
-
-		it('keeps the new page value when the old page unmounts after it', () => {
-			// Navigation order: the next page mounts before the last one unmounts,
-			// so without the owner guard the outgoing page wipes the incoming value.
-			const pageA = render(<Page text="page A" />);
-			render(<Page text="page B" />);
-			const { getByText } = render(<BottomStrip />, undefined, withVersion);
-
-			pageA.unmount();
-
-			expect(getByText('page B')).toBeInTheDocument();
-		});
-	});
-});

frontend/src/container/BottomStrip/components/StripKeyValue/StripKeyValue.module.scss

@@ -1,24 +0,0 @@
-// `:` is spaced like a word, per the Figma, so the gap here is a space width
-// rather than the wider gap between whole items.
-.keyValue {
-	display: inline-flex;
-	align-items: center;
-	gap: var(--spacing-2);
-
-	color: var(--l2-foreground);
-	white-space: nowrap;
-}
-
-.prefix {
-	display: inline-flex;
-	align-items: center;
-	margin-right: var(--spacing-1);
-}
-
-.warning {
-	color: var(--warning);
-}
-
-.error {
-	color: var(--destructive);
-}

frontend/src/container/BottomStrip/components/StripKeyValue/StripKeyValue.tsx

@@ -1,47 +0,0 @@
-import type { ReactNode } from 'react';
-import { Typography } from '@signozhq/ui/typography';
-import cx from 'classnames';
-
-import { StripTone } from '../../types';
-
-import styles from './StripKeyValue.module.scss';
-
-export interface StripKeyValueProps {
-	label: string;
-	value: string | number;
-	/** Leading icon. Same shape as `Button`'s. */
-	prefix?: ReactNode;
-	/** Tints the icon; the text stays neutral at every tone. */
-	tone?: StripTone;
-}
-
-/** A labelled number, rendered `Spans : 31`. */
-function StripKeyValue({
-	label,
-	value,
-	prefix,
-	tone,
-}: StripKeyValueProps): JSX.Element {
-	return (
-		<span className={styles.keyValue}>
-			{prefix && (
-				<span className={cx(styles.prefix, tone && styles[tone])} data-tone={tone}>
-					{prefix}
-				</span>
-			)}
-			<Typography.Text as="span" className={styles.label}>
-				{label}
-			</Typography.Text>
-			<Typography.Text as="span" className={styles.colon}>
-				:
-			</Typography.Text>
-			<Typography.Text as="span" className={styles.value}>
-				{value}
-			</Typography.Text>
-		</span>
-	);
-}
-
-StripKeyValue.defaultProps = { prefix: undefined, tone: StripTone.Default };
-
-export default StripKeyValue;

frontend/src/container/BottomStrip/components/StripKeyValue/__tests__/StripKeyValue.test.tsx

@@ -1,46 +0,0 @@
-import { render } from 'tests/test-utils';
-
-import { StripTone } from '../../../types';
-
-import StripKeyValue from '../StripKeyValue';
-
-describe('StripKeyValue', () => {
-	it('renders the label and the value around a colon it owns', () => {
-		const { getByText, container } = render(
-			<StripKeyValue label="Spans" value={31} />,
-		);
-
-		expect(getByText('Spans')).toBeInTheDocument();
-		expect(getByText('31')).toBeInTheDocument();
-		// The consumer never builds the string, so the spacing cannot drift.
-		expect(container.textContent).toBe('Spans:31');
-	});
-
-	it('tints only the icon when the tone is set', () => {
-		const { container } = render(
-			<StripKeyValue
-				label="Errors"
-				value={4}
-				tone={StripTone.Error}
-				prefix={<svg data-testid="icon" />}
-			/>,
-		);
-
-		// The tone lands on the icon, never on the text.
-		expect(container.querySelector('[data-tone]')).toHaveAttribute(
-			'data-tone',
-			'error',
-		);
-	});
-
-	it('leaves the icon untinted by default', () => {
-		const { container } = render(
-			<StripKeyValue label="Errors" value={0} prefix={<svg />} />,
-		);
-
-		expect(container.querySelector('[data-tone]')).toHaveAttribute(
-			'data-tone',
-			'default',
-		);
-	});
-});

frontend/src/container/BottomStrip/components/StripTypography/StripTypography.module.scss

@@ -1,10 +0,0 @@
-.stripTypography {
-	display: inline-flex;
-	align-items: center;
-	gap: 6px;
-
-	color: var(--l2-foreground);
-	white-space: nowrap;
-	overflow: hidden;
-	text-overflow: ellipsis;
-}

frontend/src/container/BottomStrip/components/StripTypography/StripTypography.tsx

@@ -1,28 +0,0 @@
-import type { ReactNode } from 'react';
-import { Typography } from '@signozhq/ui/typography';
-
-import styles from './StripTypography.module.scss';
-
-interface StripTypographyProps {
-	children: ReactNode;
-	/** Leading icon. Same shape as `Button`'s. */
-	prefix?: ReactNode;
-}
-
-/** A single phrase. A labelled number belongs in `StripKeyValue`. */
-function StripTypography({
-	children,
-	prefix,
-}: StripTypographyProps): JSX.Element {
-	return (
-		<span className={styles.stripTypography}>
-			{prefix}
-			<Typography.Text as="span">{children}</Typography.Text>
-		</span>
-	);
-}
-
-StripTypography.defaultProps = { prefix: undefined };
-
-export type { StripTypographyProps };
-export default StripTypography;

frontend/src/container/BottomStrip/index.tsx

@@ -1,41 +0,0 @@
-import { useLayoutEffect } from 'react';
-
-import AskNoz from './AskNoz/AskNoz';
-import LeftSlot from './LeftSlot/LeftSlot';
-import SupportButton from './SupportButton/SupportButton';
-
-import styles from './BottomStrip.module.scss';
-
-export const BOTTOM_STRIP_HEIGHT = 24;
-
-export const BOTTOM_STRIP_ON_CLASS = 'bottom-strip-on';
-export const BOTTOM_STRIP_HEIGHT_VAR = '--bottom-strip-height';
-
-function BottomStrip(): JSX.Element {
-	useLayoutEffect(() => {
-		document.body.classList.add(BOTTOM_STRIP_ON_CLASS);
-		document.body.style.setProperty(
-			BOTTOM_STRIP_HEIGHT_VAR,
-			`${BOTTOM_STRIP_HEIGHT}px`,
-		);
-
-		return (): void => {
-			document.body.classList.remove(BOTTOM_STRIP_ON_CLASS);
-			document.body.style.removeProperty(BOTTOM_STRIP_HEIGHT_VAR);
-		};
-	}, []);
-
-	return (
-		<div className={styles.strip} data-testid="bottom-strip">
-			<div className={styles.left}>
-				<LeftSlot />
-			</div>
-			<div className={styles.right}>
-				<AskNoz />
-				<SupportButton />
-			</div>
-		</div>
-	);
-}
-
-export default BottomStrip;