feat: test

* feat: adding supoprt for virtual machines to azure one click integration

* chore: generating openapi spec

* chore: updating dashboard title

.github/workflows/build-staging.yaml

@@ -64,6 +64,10 @@ jobs:
         run: |
           mkdir -p frontend
           echo 'CI=1' > frontend/.env
+          echo 'VITE_SENTRY_AUTH_TOKEN="${{ secrets.SENTRY_AUTH_TOKEN }}"' >> frontend/.env
+          echo 'VITE_SENTRY_ORG="${{ secrets.SENTRY_ORG }}"' >> frontend/.env
+          echo 'VITE_SENTRY_PROJECT_ID="${{ secrets.SENTRY_PROJECT_ID }}"' >> frontend/.env
+          echo 'VITE_SENTRY_DSN="${{ secrets.SENTRY_DSN }}"' >> frontend/.env
           echo 'VITE_TUNNEL_URL="${{ secrets.NP_TUNNEL_URL }}"' >> frontend/.env
           echo 'VITE_TUNNEL_DOMAIN="${{ secrets.NP_TUNNEL_DOMAIN }}"' >> frontend/.env
           echo 'VITE_PYLON_APP_ID="${{ secrets.NP_PYLON_APP_ID }}"' >> frontend/.env

.github/workflows/integrationci.yaml

@@ -39,10 +39,12 @@ jobs:
       matrix:
         suite:
           - alerts
+          - basepath
           - callbackauthn
           - cloudintegrations
           - dashboard
           - ingestionkeys
+          - inframonitoring
           - logspipelines
           - passwordauthn
           - preference
@@ -83,7 +85,7 @@ jobs:
         run: |
           cd tests && uv sync
       - name: webdriver
-        if: matrix.suite == 'callbackauthn'
+        if: matrix.suite == 'callbackauthn' || matrix.suite == 'basepath'
         run: |
           wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | sudo apt-key add -
           echo "deb http://dl.google.com/linux/chrome/deb/ stable main" | sudo tee -a /etc/apt/sources.list.d/google-chrome.list

cmd/community/server.go

@@ -91,7 +91,7 @@ func runServer(ctx context.Context, config signoz.Config, logger *slog.Logger) e
 		sqlstoreProviderFactories(),
 		signoz.NewTelemetryStoreProviderFactories(),
 		func(ctx context.Context, providerSettings factory.ProviderSettings, store authtypes.AuthNStore, licensing licensing.Licensing) (map[authtypes.AuthNProvider]authn.AuthN, error) {
-			return signoz.NewAuthNs(ctx, providerSettings, store, licensing)
+			return signoz.NewAuthNs(ctx, providerSettings, store, licensing, config.Global)
 		},
 		func(ctx context.Context, sqlstore sqlstore.SQLStore, config authz.Config, _ licensing.Licensing, _ []authz.OnBeforeRoleDelete) (factory.ProviderFactory[authz.AuthZ, authz.Config], error) {
 			openfgaDataStore, err := openfgaserver.NewSQLStore(sqlstore, config)

cmd/enterprise/server.go

@@ -107,17 +107,17 @@ func runServer(ctx context.Context, config signoz.Config, logger *slog.Logger) e
 		sqlstoreProviderFactories(),
 		signoz.NewTelemetryStoreProviderFactories(),
 		func(ctx context.Context, providerSettings factory.ProviderSettings, store authtypes.AuthNStore, licensing licensing.Licensing) (map[authtypes.AuthNProvider]authn.AuthN, error) {
-			samlCallbackAuthN, err := samlcallbackauthn.New(ctx, store, licensing)
+			samlCallbackAuthN, err := samlcallbackauthn.New(ctx, store, licensing, config.Global)
 			if err != nil {
 				return nil, err
 			}
 
-			oidcCallbackAuthN, err := oidccallbackauthn.New(store, licensing, providerSettings)
+			oidcCallbackAuthN, err := oidccallbackauthn.New(store, licensing, providerSettings, config.Global)
 			if err != nil {
 				return nil, err
 			}
 
-			authNs, err := signoz.NewAuthNs(ctx, providerSettings, store, licensing)
+			authNs, err := signoz.NewAuthNs(ctx, providerSettings, store, licensing, config.Global)
 			if err != nil {
 				return nil, err
 			}

conf/example.yaml

@@ -440,6 +440,17 @@ traces:
     max_depth_to_auto_expand: 5
     # Threshold below which all spans are returned without windowing.
     max_limit_to_select_all_spans: 10000
+  flamegraph:
+    # Maximum number of BFS depth levels included in a windowed response.
+    max_selected_levels: 50
+    # Maximum spans per level before sampling is applied.
+    max_spans_per_level: 100
+    # Number of highest-latency spans always included when sampling a level.
+    sampling_top_latency_count: 5
+    # Number of timestamp buckets used for uniform sampling within a level.
+    sampling_bucket_count: 50
+    # Threshold below which all spans are returned without windowing or sampling.
+    select_all_spans_limit: 100000
 
 ##################### Authz #################################
 authz:

docs/api/openapi.yml

@@ -1360,6 +1360,10 @@ components:
       - sqs
       - storageaccountsblob
       - cdnprofile
+      - virtualmachine
+      - appservice
+      - containerapp
+      - aks
       type: string
     CloudintegrationtypesServiceMetadata:
       properties:
@@ -2432,6 +2436,13 @@ components:
         url:
           type: string
       type: object
+    DashboardPanelDisplay:
+      properties:
+        description:
+          type: string
+        name:
+          type: string
+      type: object
     DashboardTextVariableSpec:
       properties:
         constant:
@@ -2552,12 +2563,13 @@ components:
             $ref: '#/components/schemas/DashboardtypesDatasourceSpec'
           type: object
         display:
-          $ref: '#/components/schemas/DashboardtypesDisplay'
+          $ref: '#/components/schemas/CommonDisplay'
         duration:
           type: string
         layouts:
           items:
             $ref: '#/components/schemas/DashboardtypesLayout'
+          nullable: true
           type: array
         links:
           items:
@@ -2566,6 +2578,7 @@ components:
         panels:
           additionalProperties:
             $ref: '#/components/schemas/DashboardtypesPanel'
+          nullable: true
           type: object
         refreshInterval:
           type: string
@@ -2573,19 +2586,10 @@ components:
           items:
             $ref: '#/components/schemas/DashboardtypesVariable'
           type: array
-      required:
-      - display
-      - variables
-      - panels
-      - layouts
-      - duration
       type: object
     DashboardtypesDatasourcePlugin:
       oneOf:
       - $ref: '#/components/schemas/DashboardtypesDatasourcePluginVariantStruct'
-      required:
-      - kind
-      - spec
     DashboardtypesDatasourcePluginKind:
       enum:
       - signoz/Datasource
@@ -2612,15 +2616,6 @@ components:
         plugin:
           $ref: '#/components/schemas/DashboardtypesDatasourcePlugin'
       type: object
-    DashboardtypesDisplay:
-      properties:
-        description:
-          type: string
-        name:
-          type: string
-      required:
-      - name
-      type: object
     DashboardtypesDynamicVariableSpec:
       properties:
         name:
@@ -2740,9 +2735,6 @@ components:
     DashboardtypesLayout:
       oneOf:
       - $ref: '#/components/schemas/DashboardtypesLayoutEnvelopeGithubComPersesSpecGoDashboardGridLayoutSpec'
-      required:
-      - kind
-      - spec
     DashboardtypesLayoutEnvelopeGithubComPersesSpecGoDashboardGridLayoutSpec:
       properties:
         kind:
@@ -2802,7 +2794,7 @@ components:
         defaultValue:
           $ref: '#/components/schemas/VariableDefaultValue'
         display:
-          $ref: '#/components/schemas/DashboardtypesDisplay'
+          $ref: '#/components/schemas/VariableDisplay'
         name:
           type: string
         plugin:
@@ -2810,8 +2802,6 @@ components:
         sort:
           nullable: true
           type: string
-      required:
-      - display
       type: object
     DashboardtypesNumberPanelSpec:
       properties:
@@ -2831,9 +2821,6 @@ components:
           $ref: '#/components/schemas/DashboardtypesPanelKind'
         spec:
           $ref: '#/components/schemas/DashboardtypesPanelSpec'
-      required:
-      - kind
-      - spec
       type: object
     DashboardtypesPanelFormatting:
       properties:
@@ -2855,9 +2842,6 @@ components:
       - $ref: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTablePanelSpec'
       - $ref: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHistogramPanelSpec'
       - $ref: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesListPanelSpec'
-      required:
-      - kind
-      - spec
     DashboardtypesPanelPluginKind:
       enum:
       - signoz/TimeSeriesPanel
@@ -2955,7 +2939,7 @@ components:
     DashboardtypesPanelSpec:
       properties:
         display:
-          $ref: '#/components/schemas/DashboardtypesDisplay'
+          $ref: '#/components/schemas/DashboardPanelDisplay'
         links:
           items:
             $ref: '#/components/schemas/DashboardLink'
@@ -2965,12 +2949,7 @@ components:
         queries:
           items:
             $ref: '#/components/schemas/DashboardtypesQuery'
-          nullable: true
           type: array
-      required:
-      - display
-      - plugin
-      - queries
       type: object
     DashboardtypesPatchOp:
       enum:
@@ -3039,9 +3018,6 @@ components:
           $ref: '#/components/schemas/Querybuildertypesv5RequestType'
         spec:
           $ref: '#/components/schemas/DashboardtypesQuerySpec'
-      required:
-      - kind
-      - spec
       type: object
     DashboardtypesQueryPlugin:
       oneOf:
@@ -3051,9 +3027,6 @@ components:
       - $ref: '#/components/schemas/DashboardtypesQueryPluginVariantGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5PromQuery'
       - $ref: '#/components/schemas/DashboardtypesQueryPluginVariantGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5ClickHouseQuery'
       - $ref: '#/components/schemas/DashboardtypesQueryPluginVariantGithubComSigNozSignozPkgTypesQuerybuildertypesQuerybuildertypesv5QueryBuilderTraceOperator'
-      required:
-      - kind
-      - spec
     DashboardtypesQueryPluginKind:
       enum:
       - signoz/BuilderQuery
@@ -3141,8 +3114,6 @@ components:
           type: string
         plugin:
           $ref: '#/components/schemas/DashboardtypesQueryPlugin'
-      required:
-      - plugin
       type: object
     DashboardtypesQueryVariableSpec:
       properties:
@@ -3313,9 +3284,6 @@ components:
       oneOf:
       - $ref: '#/components/schemas/DashboardtypesVariableEnvelopeGithubComSigNozSignozPkgTypesDashboardtypesListVariableSpec'
       - $ref: '#/components/schemas/DashboardtypesVariableEnvelopeGithubComPersesSpecGoDashboardTextVariableSpec'
-      required:
-      - kind
-      - spec
     DashboardtypesVariableEnvelopeGithubComPersesSpecGoDashboardTextVariableSpec:
       properties:
         kind:
@@ -3345,9 +3313,6 @@ components:
       - $ref: '#/components/schemas/DashboardtypesVariablePluginVariantGithubComSigNozSignozPkgTypesDashboardtypesDynamicVariableSpec'
       - $ref: '#/components/schemas/DashboardtypesVariablePluginVariantGithubComSigNozSignozPkgTypesDashboardtypesQueryVariableSpec'
       - $ref: '#/components/schemas/DashboardtypesVariablePluginVariantGithubComSigNozSignozPkgTypesDashboardtypesCustomVariableSpec'
-      required:
-      - kind
-      - spec
     DashboardtypesVariablePluginKind:
       enum:
       - signoz/DynamicVariable
@@ -6677,6 +6642,70 @@ components:
       - attribute
       - resource
       type: string
+    SpantypesFlamegraphSpan:
+      properties:
+        attributes:
+          additionalProperties: {}
+          type: object
+        durationNano:
+          minimum: 0
+          type: integer
+        event:
+          items:
+            $ref: '#/components/schemas/SpantypesEvent'
+          type: array
+        hasError:
+          type: boolean
+        level:
+          format: int64
+          type: integer
+        name:
+          type: string
+        parentSpanId:
+          type: string
+        resource:
+          additionalProperties:
+            type: string
+          type: object
+        spanId:
+          type: string
+        timestamp:
+          minimum: 0
+          type: integer
+      required:
+      - spanId
+      - parentSpanId
+      - timestamp
+      - durationNano
+      - hasError
+      - name
+      - level
+      - event
+      - attributes
+      - resource
+      type: object
+    SpantypesGettableFlamegraphTrace:
+      properties:
+        endTimestampMillis:
+          format: int64
+          type: integer
+        hasMore:
+          type: boolean
+        spans:
+          items:
+            items:
+              $ref: '#/components/schemas/SpantypesFlamegraphSpan'
+            type: array
+          type: array
+        startTimestampMillis:
+          format: int64
+          type: integer
+      required:
+      - spans
+      - startTimestampMillis
+      - endTimestampMillis
+      - hasMore
+      type: object
     SpantypesGettableSpanMapperGroups:
       properties:
         items:
@@ -6742,6 +6771,15 @@ components:
         traceId:
           type: string
       type: object
+    SpantypesPostableFlamegraph:
+      properties:
+        selectFields:
+          items:
+            $ref: '#/components/schemas/TelemetrytypesTelemetryFieldKey'
+          type: array
+        selectedSpanId:
+          type: string
+      type: object
     SpantypesPostableSpanMapper:
       properties:
         config:
@@ -20574,6 +20612,75 @@ paths:
       summary: Put profile in Zeus for a deployment.
       tags:
       - zeus
+  /api/v3/traces/{traceID}/flamegraph:
+    post:
+      deprecated: false
+      description: Returns the flamegraph view of spans for a given trace ID.
+      operationId: GetFlamegraph
+      parameters:
+      - in: path
+        name: traceID
+        required: true
+        schema:
+          type: string
+      requestBody:
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/SpantypesPostableFlamegraph'
+      responses:
+        "200":
+          content:
+            application/json:
+              schema:
+                properties:
+                  data:
+                    $ref: '#/components/schemas/SpantypesGettableFlamegraphTrace'
+                  status:
+                    type: string
+                required:
+                - status
+                - data
+                type: object
+          description: OK
+        "400":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Bad Request
+        "401":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Unauthorized
+        "403":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Forbidden
+        "404":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Not Found
+        "500":
+          content:
+            application/json:
+              schema:
+                $ref: '#/components/schemas/RenderErrorResponse'
+          description: Internal Server Error
+      security:
+      - api_key:
+        - VIEWER
+      - tokenizer:
+        - VIEWER
+      summary: Get flamegraph view for a trace
+      tags:
+      - tracedetail
   /api/v3/traces/{traceID}/waterfall:
     post:
       deprecated: false

ee/authn/callbackauthn/oidccallbackauthn/authn.go

@@ -5,10 +5,12 @@ import (
 	"fmt"
 	"log/slog"
 	"net/url"
+	"path"
 
 	"github.com/SigNoz/signoz/pkg/authn"
 	"github.com/SigNoz/signoz/pkg/errors"
 	"github.com/SigNoz/signoz/pkg/factory"
+	"github.com/SigNoz/signoz/pkg/global"
 	"github.com/SigNoz/signoz/pkg/http/client"
 	"github.com/SigNoz/signoz/pkg/licensing"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
@@ -26,13 +28,14 @@ var defaultScopes []string = []string{"email", "profile", oidc.ScopeOpenID}
 var _ authn.CallbackAuthN = (*AuthN)(nil)
 
 type AuthN struct {
-	settings   factory.ScopedProviderSettings
-	store      authtypes.AuthNStore
-	licensing  licensing.Licensing
-	httpClient *client.Client
+	settings     factory.ScopedProviderSettings
+	store        authtypes.AuthNStore
+	licensing    licensing.Licensing
+	httpClient   *client.Client
+	globalConfig global.Config
 }
 
-func New(store authtypes.AuthNStore, licensing licensing.Licensing, providerSettings factory.ProviderSettings) (*AuthN, error) {
+func New(store authtypes.AuthNStore, licensing licensing.Licensing, providerSettings factory.ProviderSettings, globalConfig global.Config) (*AuthN, error) {
 	settings := factory.NewScopedProviderSettings(providerSettings, "github.com/SigNoz/signoz/ee/authn/callbackauthn/oidccallbackauthn")
 
 	httpClient, err := client.New(providerSettings.Logger, providerSettings.TracerProvider, providerSettings.MeterProvider)
@@ -41,10 +44,11 @@ func New(store authtypes.AuthNStore, licensing licensing.Licensing, providerSett
 	}
 
 	return &AuthN{
-		settings:   settings,
-		store:      store,
-		licensing:  licensing,
-		httpClient: httpClient,
+		settings:     settings,
+		store:        store,
+		licensing:    licensing,
+		httpClient:   httpClient,
+		globalConfig: globalConfig,
 	}, nil
 }
 
@@ -197,7 +201,7 @@ func (a *AuthN) oidcProviderAndoauth2Config(ctx context.Context, siteURL *url.UR
 		RedirectURL: (&url.URL{
 			Scheme: siteURL.Scheme,
 			Host:   siteURL.Host,
-			Path:   redirectPath,
+			Path:   path.Join(a.globalConfig.ExternalPath(), redirectPath),
 		}).String(),
 	}, nil
 }

ee/authn/callbackauthn/samlcallbackauthn/authn.go

@@ -6,10 +6,12 @@ import (
 	"encoding/base64"
 	"encoding/pem"
 	"net/url"
+	"path"
 	"strings"
 
 	"github.com/SigNoz/signoz/pkg/authn"
 	"github.com/SigNoz/signoz/pkg/errors"
+	"github.com/SigNoz/signoz/pkg/global"
 	"github.com/SigNoz/signoz/pkg/licensing"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
@@ -24,14 +26,16 @@ const (
 var _ authn.CallbackAuthN = (*AuthN)(nil)
 
 type AuthN struct {
-	store     authtypes.AuthNStore
-	licensing licensing.Licensing
+	store        authtypes.AuthNStore
+	licensing    licensing.Licensing
+	globalConfig global.Config
 }
 
-func New(ctx context.Context, store authtypes.AuthNStore, licensing licensing.Licensing) (*AuthN, error) {
+func New(ctx context.Context, store authtypes.AuthNStore, licensing licensing.Licensing, globalConfig global.Config) (*AuthN, error) {
 	return &AuthN{
-		store:     store,
-		licensing: licensing,
+		store:        store,
+		licensing:    licensing,
+		globalConfig: globalConfig,
 	}, nil
 }
 
@@ -132,7 +136,7 @@ func (a *AuthN) serviceProvider(siteURL *url.URL, authDomain *authtypes.AuthDoma
 		return nil, err
 	}
 
-	acsURL := &url.URL{Scheme: siteURL.Scheme, Host: siteURL.Host, Path: redirectPath}
+	acsURL := &url.URL{Scheme: siteURL.Scheme, Host: siteURL.Host, Path: path.Join(a.globalConfig.ExternalPath(), redirectPath)}
 
 	// Note:
 	// The ServiceProviderIssuer is the client id in case of keycloak. Since we set it to the host here, we need to set the client id == host in keycloak.

frontend/jest.setup.ts

@@ -41,6 +41,15 @@ if (typeof window.IntersectionObserver === 'undefined') {
 	(window as any).IntersectionObserver = IntersectionObserverMock;
 }
 
+if (typeof window.ResizeObserver === 'undefined') {
+	class ResizeObserverMock {
+		observe(): void {}
+		unobserve(): void {}
+		disconnect(): void {}
+	}
+	(window as any).ResizeObserver = ResizeObserverMock;
+}
+
 // Patch getComputedStyle to handle CSS parsing errors from @signozhq/* packages.
 // These packages inject CSS at import time via style-inject / vite-plugin-css-injected-by-js.
 // jsdom's nwsapi cannot parse some of the injected selectors (e.g. Tailwind's :animate-in),

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

@@ -2651,6 +2651,10 @@ export enum CloudintegrationtypesServiceIDDTO {
 	sqs = 'sqs',
 	storageaccountsblob = 'storageaccountsblob',
 	cdnprofile = 'cdnprofile',
+	virtualmachine = 'virtualmachine',
+	appservice = 'appservice',
+	containerapp = 'containerapp',
+	aks = 'aks',
 }
 export type CloudintegrationtypesCloudIntegrationServiceDTOAnyOf = {
 	/**
@@ -3152,6 +3156,17 @@ export interface DashboardLinkDTO {
 	url?: string;
 }
 
+export interface DashboardPanelDisplayDTO {
+	/**
+	 * @type string
+	 */
+	description?: string;
+	/**
+	 * @type string
+	 */
+	name?: string;
+}
+
 export interface VariableDisplayDTO {
 	/**
 	 * @type string
@@ -3856,17 +3871,6 @@ export type DashboardtypesDashboardSpecDTODatasources = {
 export enum DashboardtypesPanelKindDTO {
 	Panel = 'Panel',
 }
-export interface DashboardtypesDisplayDTO {
-	/**
-	 * @type string
-	 */
-	description?: string;
-	/**
-	 * @type string
-	 */
-	name: string;
-}
-
 export enum DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTimeSeriesPanelSpecDTOKind {
 	'signoz/TimeSeriesPanel' = 'signoz/TimeSeriesPanel',
 }
@@ -4415,36 +4419,42 @@ export interface DashboardtypesQuerySpecDTO {
 	 * @type string
 	 */
 	name?: string;
-	plugin: DashboardtypesQueryPluginDTO;
+	plugin?: DashboardtypesQueryPluginDTO;
 }
 
 export interface DashboardtypesQueryDTO {
-	kind: Querybuildertypesv5RequestTypeDTO;
-	spec: DashboardtypesQuerySpecDTO;
+	kind?: Querybuildertypesv5RequestTypeDTO;
+	spec?: DashboardtypesQuerySpecDTO;
 }
 
 export interface DashboardtypesPanelSpecDTO {
-	display: DashboardtypesDisplayDTO;
+	display?: DashboardPanelDisplayDTO;
 	/**
 	 * @type array
 	 */
 	links?: DashboardLinkDTO[];
-	plugin: DashboardtypesPanelPluginDTO;
+	plugin?: DashboardtypesPanelPluginDTO;
 	/**
-	 * @type array,null
+	 * @type array
 	 */
-	queries: DashboardtypesQueryDTO[] | null;
+	queries?: DashboardtypesQueryDTO[];
 }
 
 export interface DashboardtypesPanelDTO {
-	kind: DashboardtypesPanelKindDTO;
-	spec: DashboardtypesPanelSpecDTO;
+	kind?: DashboardtypesPanelKindDTO;
+	spec?: DashboardtypesPanelSpecDTO;
 }
 
-export type DashboardtypesDashboardSpecDTOPanels = {
+export type DashboardtypesDashboardSpecDTOPanelsAnyOf = {
 	[key: string]: DashboardtypesPanelDTO;
 };
 
+/**
+ * @nullable
+ */
+export type DashboardtypesDashboardSpecDTOPanels =
+	DashboardtypesDashboardSpecDTOPanelsAnyOf | null;
+
 export enum DashboardtypesLayoutEnvelopeGithubComPersesSpecGoDashboardGridLayoutSpecDTOKind {
 	Grid = 'Grid',
 }
@@ -4541,7 +4551,7 @@ export interface DashboardtypesListVariableSpecDTO {
 	 */
 	customAllValue?: string;
 	defaultValue?: VariableDefaultValueDTO;
-	display: DashboardtypesDisplayDTO;
+	display?: VariableDisplayDTO;
 	/**
 	 * @type string
 	 */
@@ -4583,23 +4593,23 @@ export interface DashboardtypesDashboardSpecDTO {
 	 * @type object
 	 */
 	datasources?: DashboardtypesDashboardSpecDTODatasources;
-	display: DashboardtypesDisplayDTO;
+	display?: CommonDisplayDTO;
 	/**
 	 * @type string
 	 */
-	duration: string;
+	duration?: string;
 	/**
-	 * @type array
+	 * @type array,null
 	 */
-	layouts: DashboardtypesLayoutDTO[];
+	layouts?: DashboardtypesLayoutDTO[] | null;
 	/**
 	 * @type array
 	 */
 	links?: DashboardLinkDTO[];
 	/**
-	 * @type object
+	 * @type object,null
 	 */
-	panels: DashboardtypesDashboardSpecDTOPanels;
+	panels?: DashboardtypesDashboardSpecDTOPanels;
 	/**
 	 * @type string
 	 */
@@ -4607,7 +4617,7 @@ export interface DashboardtypesDashboardSpecDTO {
 	/**
 	 * @type array
 	 */
-	variables: DashboardtypesVariableDTO[];
+	variables?: DashboardtypesVariableDTO[];
 }
 
 export enum DashboardtypesDatasourcePluginKindDTO {
@@ -7763,6 +7773,77 @@ export enum SpantypesFieldContextDTO {
 	attribute = 'attribute',
 	resource = 'resource',
 }
+export type SpantypesFlamegraphSpanDTOAttributes = { [key: string]: unknown };
+
+export type SpantypesFlamegraphSpanDTOResource = { [key: string]: string };
+
+export interface SpantypesFlamegraphSpanDTO {
+	/**
+	 * @type object
+	 */
+	attributes: SpantypesFlamegraphSpanDTOAttributes;
+	/**
+	 * @type integer
+	 * @minimum 0
+	 */
+	durationNano: number;
+	/**
+	 * @type array
+	 */
+	event: SpantypesEventDTO[];
+	/**
+	 * @type boolean
+	 */
+	hasError: boolean;
+	/**
+	 * @type integer
+	 * @format int64
+	 */
+	level: number;
+	/**
+	 * @type string
+	 */
+	name: string;
+	/**
+	 * @type string
+	 */
+	parentSpanId: string;
+	/**
+	 * @type object
+	 */
+	resource: SpantypesFlamegraphSpanDTOResource;
+	/**
+	 * @type string
+	 */
+	spanId: string;
+	/**
+	 * @type integer
+	 * @minimum 0
+	 */
+	timestamp: number;
+}
+
+export interface SpantypesGettableFlamegraphTraceDTO {
+	/**
+	 * @type integer
+	 * @format int64
+	 */
+	endTimestampMillis: number;
+	/**
+	 * @type boolean
+	 */
+	hasMore: boolean;
+	/**
+	 * @type array
+	 */
+	spans: SpantypesFlamegraphSpanDTO[][];
+	/**
+	 * @type integer
+	 * @format int64
+	 */
+	startTimestampMillis: number;
+}
+
 export type SpantypesSpanMapperGroupConditionDTOAnyOf = {
 	/**
 	 * @type array,null
@@ -8064,6 +8145,17 @@ export interface SpantypesGettableWaterfallTraceDTO {
 	uncollapsedSpans?: string[] | null;
 }
 
+export interface SpantypesPostableFlamegraphDTO {
+	/**
+	 * @type array
+	 */
+	selectFields?: TelemetrytypesTelemetryFieldKeyDTO[];
+	/**
+	 * @type string
+	 */
+	selectedSpanId?: string;
+}
+
 export enum SpantypesSpanMapperOperationDTO {
 	move = 'move',
 	copy = 'copy',
@@ -10418,6 +10510,17 @@ export type GetHosts200 = {
 	status: string;
 };
 
+export type GetFlamegraphPathParameters = {
+	traceID: string;
+};
+export type GetFlamegraph200 = {
+	data: SpantypesGettableFlamegraphTraceDTO;
+	/**
+	 * @type string
+	 */
+	status: string;
+};
+
 export type GetWaterfallPathParameters = {
 	traceID: string;
 };

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

@@ -12,6 +12,8 @@ import type {
 } from 'react-query';
 
 import type {
+	GetFlamegraph200,
+	GetFlamegraphPathParameters,
 	GetTraceAggregations200,
 	GetTraceAggregationsPathParameters,
 	GetWaterfall200,
@@ -19,6 +21,7 @@ import type {
 	GetWaterfallV4200,
 	GetWaterfallV4PathParameters,
 	RenderErrorResponseDTO,
+	SpantypesPostableFlamegraphDTO,
 	SpantypesPostableTraceAggregationsDTO,
 	SpantypesPostableWaterfallDTO,
 } from '../sigNoz.schemas';
@@ -126,6 +129,105 @@ export const useGetTraceAggregations = <
 > => {
 	return useMutation(getGetTraceAggregationsMutationOptions(options));
 };
+/**
+ * Returns the flamegraph view of spans for a given trace ID.
+ * @summary Get flamegraph view for a trace
+ */
+export const getFlamegraph = (
+	{ traceID }: GetFlamegraphPathParameters,
+	spantypesPostableFlamegraphDTO?: BodyType<SpantypesPostableFlamegraphDTO>,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<GetFlamegraph200>({
+		url: `/api/v3/traces/${traceID}/flamegraph`,
+		method: 'POST',
+		headers: { 'Content-Type': 'application/json' },
+		data: spantypesPostableFlamegraphDTO,
+		signal,
+	});
+};
+
+export const getGetFlamegraphMutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof getFlamegraph>>,
+		TError,
+		{
+			pathParams: GetFlamegraphPathParameters;
+			data?: BodyType<SpantypesPostableFlamegraphDTO>;
+		},
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof getFlamegraph>>,
+	TError,
+	{
+		pathParams: GetFlamegraphPathParameters;
+		data?: BodyType<SpantypesPostableFlamegraphDTO>;
+	},
+	TContext
+> => {
+	const mutationKey = ['getFlamegraph'];
+	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 getFlamegraph>>,
+		{
+			pathParams: GetFlamegraphPathParameters;
+			data?: BodyType<SpantypesPostableFlamegraphDTO>;
+		}
+	> = (props) => {
+		const { pathParams, data } = props ?? {};
+
+		return getFlamegraph(pathParams, data);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type GetFlamegraphMutationResult = NonNullable<
+	Awaited<ReturnType<typeof getFlamegraph>>
+>;
+export type GetFlamegraphMutationBody =
+	| BodyType<SpantypesPostableFlamegraphDTO>
+	| undefined;
+export type GetFlamegraphMutationError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Get flamegraph view for a trace
+ */
+export const useGetFlamegraph = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown,
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof getFlamegraph>>,
+		TError,
+		{
+			pathParams: GetFlamegraphPathParameters;
+			data?: BodyType<SpantypesPostableFlamegraphDTO>;
+		},
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof getFlamegraph>>,
+	TError,
+	{
+		pathParams: GetFlamegraphPathParameters;
+		data?: BodyType<SpantypesPostableFlamegraphDTO>;
+	},
+	TContext
+> => {
+	return useMutation(getGetFlamegraphMutationOptions(options));
+};
 /**
  * Returns the waterfall view of spans for a given trace ID with tree structure, metadata, and windowed pagination
  * @summary Get waterfall view for a trace

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

@@ -1,5 +1,11 @@
 // TODO: Improve the styling of the query aggregation container and its components. - @YounixM , @H4ad
 
+$dropdown-base-height: 250px;
+$recents-header-height: 30px;
+$recent-row-height: 36px;
+// how many recents are rendered, this caps how tall the dropdown can grow to fit them.
+$max-recents-shown: 5;
+
 .code-mirror-where-clause {
 	width: 100%;
 	display: flex;
@@ -117,7 +123,23 @@
 				width: 100% !important;
 				max-width: 100% !important;
 				font-family: 'Space Mono', monospace !important;
-				min-height: 200px !important;
+				max-height: $dropdown-base-height !important;
+				overflow-y: auto !important;
+
+				// Recents render at the top of the dropdown ahead of regular suggestions.
+				// At the base max-height, having recents in view would crowd out the
+				// suggestion list below. This loop grows the dropdown by one row's worth
+				// of height for every recent present (up to $max-recents-shown), plus the
+				// section header. `:has(> li:nth-of-type(N) .cm-completionIcon-recent)`
+				// matches when the Nth child of <ul> is a recent — i.e. there are at
+				// least N recents visible.
+				@for $i from 1 through $max-recents-shown {
+					&:has(> li:nth-of-type(#{$i}) .cm-completionIcon-recent) {
+						max-height: $dropdown-base-height +
+							$recents-header-height +
+							($i * $recent-row-height) !important;
+					}
+				}
 
 				&::-webkit-scrollbar {
 					width: 0.3rem;
@@ -133,6 +155,19 @@
 					background: transparent;
 				}
 
+				completion-section {
+					display: block;
+					padding: 10px 12px 6px;
+					font-size: 10px !important;
+					font-weight: 700;
+					letter-spacing: 0.08em;
+					text-transform: uppercase;
+					color: var(--l3-foreground, var(--l2-foreground));
+					opacity: 0.7;
+					border-bottom: 0;
+					background-color: transparent;
+				}
+
 				li {
 					width: 100% !important;
 					max-width: 100% !important;
@@ -159,11 +194,78 @@
 						display: none !important;
 					}
 
+					.cm-completionDetail {
+						margin-left: auto;
+						font-style: normal;
+						font-size: var(--periscope-font-size-small, 11px);
+						font-weight: 600;
+						letter-spacing: 0.06em;
+						text-transform: uppercase;
+						opacity: 0.55;
+					}
+
 					&[aria-selected='true'] {
 						background: var(--l3-background) !important;
 						font-weight: 600 !important;
 					}
 				}
+
+				li:has(.cm-completionIcon-recent) {
+					&:hover .cm-recent-delete,
+					&[aria-selected='true'] .cm-recent-delete {
+						opacity: 1;
+					}
+				}
+
+				li .cm-completionLabel {
+					flex: 1;
+					min-width: 0;
+					white-space: nowrap;
+					overflow: hidden;
+					text-overflow: ellipsis;
+				}
+
+				.cm-recent-delete {
+					margin-left: 8px;
+					display: inline-flex;
+					align-items: center;
+					justify-content: center;
+					width: 20px;
+					height: 20px;
+					padding: 0;
+					border: 0;
+					border-radius: 4px;
+					background: transparent;
+					color: var(--l2-foreground);
+					font-size: 18px;
+					line-height: 1;
+					cursor: pointer;
+					opacity: 0.5;
+					transition:
+						opacity 0.12s ease,
+						background-color 0.12s ease;
+
+					&:hover {
+						opacity: 1;
+						background: color-mix(in srgb, var(--l2-foreground) 18%, transparent);
+					}
+				}
+			}
+
+			&::after {
+				content: '↓↑ to navigate · ↵ to apply · esc to dismiss';
+				display: block;
+				padding: 8px 12px;
+				border-top: 1px solid var(--l1-border);
+				font-family: 'Space Mono', monospace;
+				font-size: 11px;
+				font-weight: 500;
+				letter-spacing: 0.02em;
+				color: var(--l2-foreground);
+				opacity: 0.6;
+				background: color-mix(in srgb, var(--l1-background) 50%, transparent);
+				border-bottom-left-radius: 4px;
+				border-bottom-right-radius: 4px;
 			}
 		}
 

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

@@ -46,8 +46,15 @@ import {
 import { validateQuery } from 'utils/queryValidationUtils';
 import { unquote } from 'utils/stringUtils';
 
-import { queryExamples } from './constants';
-import { combineInitialAndUserExpression } from './utils';
+import { getRecentQueries } from 'lib/recentQueries/getRecentQueries';
+import type { SignalType } from 'types/api/v5/queryRange';
+
+import { queryExamples, SUGGESTIONS_SECTION } from './constants';
+import {
+	combineInitialAndUserExpression,
+	getRecentOptions,
+	renderRecentDeleteButton,
+} from './utils';
 
 import './QuerySearch.styles.scss';
 
@@ -1250,6 +1257,41 @@ function QuerySearch({
 		};
 	}
 
+	const signal = dataSource as SignalType;
+
+	function combinedSuggestions(
+		context: CompletionContext,
+	): CompletionResult | null {
+		const fullDoc = context.state.doc.toString();
+		const recentOptions = getRecentOptions(
+			getRecentQueries(signal, signalSource ?? ''),
+			fullDoc,
+		);
+		const result = autoSuggestions(context);
+
+		const suggestionOptions = (result?.options || []).map((opt) => ({
+			...opt,
+			section: SUGGESTIONS_SECTION,
+		}));
+
+		if (recentOptions.length === 0 && suggestionOptions.length === 0) {
+			return result;
+		}
+
+		if (!result) {
+			return {
+				from: 0,
+				to: fullDoc.length,
+				options: recentOptions,
+			};
+		}
+
+		return {
+			...result,
+			options: [...recentOptions, ...suggestionOptions],
+		};
+	}
+
 	// Effect to handle focus state and trigger suggestions
 	useEffect(() => {
 		const clearTimeout = toggleSuggestions(10);
@@ -1398,11 +1440,12 @@ function QuerySearch({
 					})}
 					extensions={[
 						autocompletion({
-							override: [autoSuggestions],
+							override: [combinedSuggestions],
 							defaultKeymap: true,
 							closeOnBlur: true,
 							activateOnTyping: true,
 							maxRenderedOptions: 50,
+							addToOptions: [{ render: renderRecentDeleteButton, position: 100 }],
 						}),
 						javascript({ jsx: false, typescript: false }),
 						EditorView.lineWrapping,

frontend/src/components/QueryBuilderV2/QueryV2/QuerySearch/constants.ts

@@ -1,3 +1,14 @@
+export const RECENTS_SECTION = { name: 'Recent searches', rank: 1 } as const;
+export const SUGGESTIONS_SECTION = { name: 'Suggestions', rank: 2 } as const;
+
+// Custom CodeMirror Completion.type for recent-query entries. Used to discriminate
+// recents from regular autocomplete completions in renderers and event handlers.
+export const RECENT_COMPLETION_TYPE = 'recent';
+
+// Max number of recents rendered in the autocomplete dropdown.
+//  Do change $max-recents-shown: in QuerySearch.styles.scss if you change this.
+export const RECENTS_DISPLAY_CAP = 5;
+
 export const queryExamples = [
 	{
 		label: 'Basic Query',

frontend/src/components/QueryBuilderV2/QueryV2/QuerySearch/utils.ts

@@ -1,3 +1,19 @@
+import { closeCompletion, startCompletion } from '@codemirror/autocomplete';
+import type { Completion } from '@codemirror/autocomplete';
+import type { EditorView } from '@uiw/react-codemirror';
+import dayjs from 'dayjs';
+import { normalizeFilterExpression } from 'lib/recentQueries/normalize';
+import * as recentQueriesStore from 'lib/recentQueries/recentQueriesStore';
+import type { RecentQueryEntry } from 'lib/recentQueries/types';
+import type { SignalType } from 'types/api/v5/queryRange';
+import 'utils/timeUtils';
+
+import {
+	RECENT_COMPLETION_TYPE,
+	RECENTS_DISPLAY_CAP,
+	RECENTS_SECTION,
+} from './constants';
+
 export function combineInitialAndUserExpression(
 	initial: string,
 	user: string,
@@ -38,3 +54,106 @@ export function getUserExpressionFromCombined(
 	}
 	return c;
 }
+
+// Filters and projects a list of recent-query entries into CodeMirror completions.
+// Entries are supplied by the caller (typically via the useRecents hook) so this
+// function stays pure and React doesn't have to re-subscribe inside CodeMirror's
+// autocomplete callback.
+export function getRecentOptions(
+	entries: RecentQueryEntry[],
+	fullDoc: string,
+): Completion[] {
+	const normalizedDoc = normalizeFilterExpression(fullDoc);
+
+	const matches = entries
+		.filter((e) => {
+			const normalizedRecent = normalizeFilterExpression(e.filter.expression);
+			if (normalizedRecent === normalizedDoc) {
+				return false;
+			}
+			if (normalizedDoc === '') {
+				return true;
+			}
+			return normalizedRecent.includes(normalizedDoc);
+		})
+		.slice(0, RECENTS_DISPLAY_CAP);
+
+	return matches.map((entry, index) => ({
+		label: entry.filter.expression,
+		type: RECENT_COMPLETION_TYPE,
+		// CodeMirror sorts within a section by boost desc, then label asc. The store
+		// returns entries newest-first, so we mirror that by giving the newest entry
+		// the highest boost — otherwise CM falls back to alphabetical order and the
+		// "most recently used" expectation breaks. Stays within the recents section
+		// because section.rank keeps recents above suggestions regardless of boost.
+		boost: matches.length - index,
+		section: RECENTS_SECTION,
+		detail: dayjs(entry.lastUsedAt).fromNow(),
+		recentId: entry.id,
+		recentSignal: entry.signal,
+		recentSource: entry.source,
+		apply: (view: EditorView): void => {
+			view.dispatch({
+				changes: {
+					from: 0,
+					to: view.state.doc.length,
+					insert: entry.filter.expression,
+				},
+				selection: { anchor: entry.filter.expression.length },
+			});
+			closeCompletion(view);
+		},
+	}));
+}
+
+export function renderRecentDeleteButton(
+	completion: Completion,
+	_state: unknown,
+	view: EditorView | null,
+): Node | null {
+	if (completion.type !== RECENT_COMPLETION_TYPE) {
+		return null;
+	}
+
+	const c = completion as Completion & {
+		recentId?: string;
+		recentSignal?: SignalType;
+		recentSource?: string;
+	};
+
+	const btn = document.createElement('button');
+	btn.type = 'button';
+	btn.className = 'cm-recent-delete';
+	btn.setAttribute('aria-label', 'Remove from recent searches');
+	btn.title = 'Remove from recent searches';
+	btn.textContent = '×';
+	queueMicrotask(() => {
+		if (btn.parentElement) {
+			btn.parentElement.title = completion.label;
+		}
+	});
+
+	const stop = (e: Event): void => {
+		e.preventDefault();
+		e.stopPropagation();
+	};
+	// CodeMirror's autocomplete closes the popup on pointerdown / mousedown outside
+	// the editor. The delete button lives inside the popup, so we must stop those
+	// events early — otherwise clicking × would dismiss the dropdown before the
+	// click handler fires and the entry wouldn't actually get removed.
+	btn.addEventListener('pointerdown', stop);
+	btn.addEventListener('mousedown', stop);
+	btn.addEventListener('click', (e) => {
+		stop(e);
+		if (!c.recentId || !c.recentSignal) {
+			return;
+		}
+		recentQueriesStore.remove(c.recentId, c.recentSignal, c.recentSource ?? '');
+		if (view) {
+			view.focus();
+			startCompletion(view);
+		}
+	});
+
+	return btn;
+}

frontend/src/container/AIAssistant/events.ts

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

frontend/src/container/BillingContainer/CancelSubscriptionBanner.module.scss

@@ -67,3 +67,40 @@
 	background: var(--secondary-background);
 	border: 1px solid var(--l1-border);
 }
+
+.fallbackBody {
+	display: flex;
+	flex-direction: column;
+	gap: var(--spacing-4);
+}
+
+.fallbackHint {
+	font-size: var(--paragraph-base-400-font-size);
+	font-weight: var(--paragraph-base-400-font-weight);
+	line-height: var(--paragraph-base-400-line-height);
+	color: var(--l2-foreground);
+	margin: 0;
+}
+
+.fallbackEmail {
+	font-size: var(--paragraph-base-500-font-size);
+	font-weight: var(--paragraph-base-500-font-weight);
+	color: var(--l1-foreground);
+	word-break: break-all;
+}
+
+.fallbackActions {
+	display: flex;
+	gap: var(--spacing-3);
+	flex-wrap: wrap;
+	padding-top: var(--padding-4);
+}
+
+.retryLink {
+	box-sizing: border-box;
+	text-decoration: none;
+
+	&:hover {
+		text-decoration: none;
+	}
+}

frontend/src/container/BillingContainer/CancelSubscriptionBanner.test.tsx

@@ -9,7 +9,37 @@ jest.mock('utils/basePath', () => ({
 	getBaseUrl: (): string => 'https://test.signoz.io',
 }));
 
+function mockMailto(): {
+	mockClick: jest.Mock;
+	appendSpy: jest.SpyInstance;
+	removeSpy: jest.SpyInstance;
+} {
+	const mockClick = jest.fn();
+	const realCreateElement = document.createElement.bind(document);
+
+	// Create a real anchor so JSDOM's appendChild/removeChild accept it.
+	// Override its click() so no navigation occurs.
+	jest
+		.spyOn(document, 'createElement')
+		.mockImplementation((tag: string, options?: ElementCreationOptions) => {
+			if (tag === 'a') {
+				const anchor = realCreateElement('a') as HTMLAnchorElement;
+				anchor.click = mockClick;
+				return anchor;
+			}
+			return realCreateElement(tag, options);
+		});
+
+	const appendSpy = jest.spyOn(document.body, 'appendChild');
+	const removeSpy = jest.spyOn(document.body, 'removeChild');
+	return { mockClick, appendSpy, removeSpy };
+}
+
 describe('CancelSubscriptionBanner', () => {
+	afterEach(() => {
+		jest.restoreAllMocks();
+	});
+
 	it('renders banner with title and subtitle', () => {
 		render(<CancelSubscriptionBanner />);
 		expect(
@@ -35,12 +65,10 @@ describe('CancelSubscriptionBanner', () => {
 			screen.getByText(/Cancelling your subscription would stop your data/i),
 		).toBeInTheDocument();
 		expect(screen.getByText(/Type/i)).toBeInTheDocument();
-		expect(
-			screen.getByPlaceholderText(/Enter the word cancel/i),
-		).toBeInTheDocument();
+		expect(screen.getByTestId('cancel-confirm-input')).toBeInTheDocument();
 		expect(screen.getByRole('button', { name: /go back/i })).toBeInTheDocument();
 		expect(
-			screen.getByRole('button', { name: /cancel subscription/i }),
+			screen.getByTestId('cancel-subscription-confirm-btn'),
 		).toBeInTheDocument();
 	});
 
@@ -52,12 +80,10 @@ describe('CancelSubscriptionBanner', () => {
 			screen.getByRole('button', { name: /cancel subscription/i }),
 		);
 
-		const confirmButton = screen.getByRole('button', {
-			name: /cancel subscription/i,
-		});
+		const confirmButton = screen.getByTestId('cancel-subscription-confirm-btn');
 		expect(confirmButton).toBeDisabled();
 
-		const input = screen.getByPlaceholderText(/Enter the word cancel/i);
+		const input = screen.getByTestId('cancel-confirm-input');
 		await user.type(input, 'canc');
 		expect(confirmButton).toBeDisabled();
 
@@ -73,7 +99,7 @@ describe('CancelSubscriptionBanner', () => {
 			screen.getByRole('button', { name: /cancel subscription/i }),
 		);
 
-		const input = screen.getByPlaceholderText(/Enter the word cancel/i);
+		const input = screen.getByTestId('cancel-confirm-input');
 		await user.type(input, 'cancel');
 
 		await user.click(screen.getByRole('button', { name: /go back/i }));
@@ -84,19 +110,11 @@ describe('CancelSubscriptionBanner', () => {
 		await user.click(
 			screen.getByRole('button', { name: /cancel subscription/i }),
 		);
-		expect(screen.getByPlaceholderText(/Enter the word cancel/i)).toHaveValue('');
+		expect(screen.getByTestId('cancel-confirm-input')).toHaveValue('');
 	});
 
-	it('sends mailto to cloud-support with correct subject after typing "cancel"', async () => {
-		const realCreateElement = document.createElement.bind(document);
-		const mockClick = jest.fn();
-		const mockAnchor = { href: '', click: mockClick };
-		jest.spyOn(document, 'createElement').mockImplementation((tag: string) => {
-			if (tag === 'a') {
-				return mockAnchor as unknown as HTMLAnchorElement;
-			}
-			return realCreateElement(tag);
-		});
+	it('fires mailto via DOM-attached anchor and shows fallback view after confirming', async () => {
+		const { mockClick, appendSpy, removeSpy } = mockMailto();
 
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
 		render(<CancelSubscriptionBanner />);
@@ -104,18 +122,85 @@ describe('CancelSubscriptionBanner', () => {
 		await user.click(
 			screen.getByRole('button', { name: /cancel subscription/i }),
 		);
+		await user.type(screen.getByTestId('cancel-confirm-input'), 'cancel');
+		await user.click(screen.getByTestId('cancel-subscription-confirm-btn'));
 
-		const input = screen.getByPlaceholderText(/Enter the word cancel/i);
-		await user.type(input, 'cancel');
+		const appendedAnchor = appendSpy.mock.calls
+			.map(([node]) => node)
+			.find(
+				(node): node is HTMLAnchorElement =>
+					node instanceof HTMLAnchorElement && node.href.startsWith('mailto:'),
+			);
+		expect(appendedAnchor).toBeDefined();
+		expect(mockClick).toHaveBeenCalledTimes(1);
+		expect(removeSpy.mock.calls.some(([node]) => node === appendedAnchor)).toBe(
+			true,
+		);
+
+		expect(
+			screen.getByText(/An email draft has been opened/i),
+		).toBeInTheDocument();
+		expect(screen.getByText('cloud-support@signoz.io')).toBeInTheDocument();
+		expect(screen.getByTestId('copy-email-template-btn')).toBeInTheDocument();
+		expect(screen.getByTestId('retry-mailto-btn')).toBeInTheDocument();
+	});
+
+	it('copies email template to clipboard when Copy button is clicked', async () => {
+		mockMailto();
+
+		const user = userEvent.setup({ pointerEventsCheck: 0 });
+		render(<CancelSubscriptionBanner />);
 
 		await user.click(
 			screen.getByRole('button', { name: /cancel subscription/i }),
 		);
+		await user.type(screen.getByTestId('cancel-confirm-input'), 'cancel');
+		await user.click(screen.getByTestId('cancel-subscription-confirm-btn'));
 
-		expect(mockAnchor.href).toContain('mailto:cloud-support@signoz.io');
-		expect(mockAnchor.href).toContain('Cancel%20My%20SigNoz%20Subscription');
-		expect(mockClick).toHaveBeenCalledTimes(1);
+		await user.click(screen.getByTestId('copy-email-template-btn'));
 
-		jest.restoreAllMocks();
+		await waitFor(() =>
+			expect(screen.getByTestId('copy-email-template-btn')).toHaveTextContent(
+				'Copied!',
+			),
+		);
+	});
+
+	it('retry link is a native anchor with correct mailto href in fallback view', async () => {
+		mockMailto();
+
+		const user = userEvent.setup({ pointerEventsCheck: 0 });
+		render(<CancelSubscriptionBanner />);
+
+		await user.click(
+			screen.getByRole('button', { name: /cancel subscription/i }),
+		);
+		await user.type(screen.getByTestId('cancel-confirm-input'), 'cancel');
+		await user.click(screen.getByTestId('cancel-subscription-confirm-btn'));
+
+		const retryLink = screen.getByTestId('retry-mailto-btn');
+		expect(retryLink.tagName).toBe('A');
+		expect(retryLink).toHaveAttribute(
+			'href',
+			expect.stringContaining('mailto:cloud-support@signoz.io'),
+		);
+	});
+
+	it('closes fallback view when Close is clicked and resets state', async () => {
+		mockMailto();
+
+		const user = userEvent.setup({ pointerEventsCheck: 0 });
+		render(<CancelSubscriptionBanner />);
+
+		await user.click(
+			screen.getByRole('button', { name: /cancel subscription/i }),
+		);
+		await user.type(screen.getByTestId('cancel-confirm-input'), 'cancel');
+		await user.click(screen.getByTestId('cancel-subscription-confirm-btn'));
+
+		await user.click(screen.getByRole('button', { name: /close/i }));
+		await waitFor(() =>
+			expect(screen.queryByRole('dialog')).not.toBeInTheDocument(),
+		);
 	});
 });

frontend/src/container/BillingContainer/CancelSubscriptionBanner.tsx

@@ -1,27 +1,100 @@
-import { useState } from 'react';
-import { SolidInfoCircle, Undo2, X } from '@signozhq/icons';
+import { useEffect, useRef, useState } from 'react';
+import {
+	CircleCheck,
+	Copy,
+	MailOpen,
+	SolidInfoCircle,
+	Undo2,
+	X,
+} from '@signozhq/icons';
 import { Button } from '@signozhq/ui/button';
 import { DialogWrapper } from '@signozhq/ui/dialog';
 import { Input } from '@signozhq/ui/input';
 import logEvent from 'api/common/logEvent';
 import { pick } from 'lodash-es';
 import { useAppContext } from 'providers/App/App';
+import { useCopyToClipboard } from 'react-use';
 import { getBaseUrl } from 'utils/basePath';
-
-import styles from './CancelSubscriptionBanner.module.scss';
 import { Color } from '@signozhq/design-tokens';
 
+import styles from './CancelSubscriptionBanner.module.scss';
+
+const SUPPORT_EMAIL = 'cloud-support@signoz.io';
+const MAX_MAILTO_URI_LENGTH = 1800;
+
+type DialogView = 'confirm' | 'fallback';
+
+function buildEmailBody(orgName: string, userEmail: string): string {
+	return [
+		'Hi SigNoz Team,',
+		'',
+		'I would like to cancel my SigNoz Cloud subscription.',
+		'Please find my account details below.',
+		'',
+		'Account Details:',
+		`  • SigNoz URL: ${getBaseUrl()}`,
+		...(orgName ? [`  • Organization: ${orgName}`] : []),
+		`  • Account Email: ${userEmail}`,
+		'',
+		'Reason for Cancellation:',
+		'[Please share the reason for cancellation]',
+		'',
+		'Additional feedback (optional):',
+		'[Any other feedback]',
+		'',
+		'Regards,',
+		'[user name or team name]',
+	].join('\n');
+}
+
+function buildMailtoUri(orgName: string, userEmail: string): string {
+	const subject = encodeURIComponent('Cancel My SigNoz Subscription');
+	const body = encodeURIComponent(buildEmailBody(orgName, userEmail));
+	const full = `mailto:${SUPPORT_EMAIL}?subject=${subject}&body=${body}`;
+	if (full.length <= MAX_MAILTO_URI_LENGTH) {
+		return full;
+	}
+	const shortBody = encodeURIComponent(
+		'Hi SigNoz Team,\n\nI would like to cancel my SigNoz Cloud subscription.\nPlease find my account details and reason for cancellation below.\n\n[Your details here]\n\nRegards,',
+	);
+	return `mailto:${SUPPORT_EMAIL}?subject=${subject}&body=${shortBody}`;
+}
+
+function openMailto(uri: string): void {
+	const link = document.createElement('a');
+	link.href = uri;
+	link.style.display = 'none';
+	document.body.appendChild(link);
+	link.click();
+	document.body.removeChild(link);
+}
+
 function CancelSubscriptionBanner(): JSX.Element {
-	const [open, setOpen] = useState(false);
+	const [dialogView, setDialogView] = useState<DialogView | null>(null);
 	const [confirmText, setConfirmText] = useState('');
+	const [copied, setCopied] = useState(false);
+	const [, copyToClipboard] = useCopyToClipboard();
+	const copyTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 	const { user, org } = useAppContext();
 
+	useEffect(
+		() => (): void => {
+			if (copyTimerRef.current) {
+				clearTimeout(copyTimerRef.current);
+			}
+		},
+		[],
+	);
+
+	const orgName = org?.[0]?.displayName ?? '';
+	const userEmail = user?.email ?? '';
+
 	const handleOpenCancelDialog = (): void => {
 		void logEvent('Billing : Cancel Subscription Clicked', {
 			user: pick(user, ['email', 'displayName', 'role', 'organization']),
 			role: user?.role,
 		});
-		setOpen(true);
+		setDialogView('confirm');
 	};
 
 	const handleContactSupport = (): void => {
@@ -29,43 +102,41 @@ function CancelSubscriptionBanner(): JSX.Element {
 			user: pick(user, ['email', 'displayName', 'role', 'organization']),
 			role: user?.role,
 		});
-		const subject = encodeURIComponent('Cancel My SigNoz Subscription');
-		const orgName = org?.[0]?.displayName ?? '';
-		const body = encodeURIComponent(
-			[
-				'Hi SigNoz Team,',
-				'',
-				'I would like to cancel my SigNoz Cloud subscription.',
-				'Please find my account details below.',
-				'',
-				'Account Details:',
-				`  • SigNoz URL: ${getBaseUrl()}`,
-				...(orgName ? [`  • Organization: ${orgName}`] : []),
-				`  • Account Email: ${user?.email ?? ''}`,
-				'',
-				'Reason for Cancellation:',
-				'[Please share the reason for cancellation]',
-				'',
-				'Additional feedback (optional):',
-				'[Any other feedback]',
-				'',
-				'Regards,',
-				'[user name or team name]',
-			].join('\n'),
-		);
-		const link = document.createElement('a');
-		link.href = `mailto:cloud-support@signoz.io?subject=${subject}&body=${body}`;
-		link.click();
-		setOpen(false);
+		openMailto(buildMailtoUri(orgName, userEmail));
 		setConfirmText('');
+		setDialogView('fallback');
+	};
+
+	const handleCopyTemplate = (): void => {
+		void logEvent('Billing : Cancel Subscription Email Template Copied', {
+			user: pick(user, ['email', 'displayName', 'role', 'organization']),
+			role: user?.role,
+		});
+		copyToClipboard(buildEmailBody(orgName, userEmail));
+		setCopied(true);
+		if (copyTimerRef.current) {
+			clearTimeout(copyTimerRef.current);
+		}
+		copyTimerRef.current = setTimeout(() => setCopied(false), 2000);
+	};
+
+	const handleRetryMailto = (): void => {
+		void logEvent('Billing : Cancel Subscription Email Client Reopened', {
+			user: pick(user, ['email', 'displayName', 'role', 'organization']),
+			role: user?.role,
+		});
 	};
 
 	const handleClose = (): void => {
-		setOpen(false);
+		if (copyTimerRef.current) {
+			clearTimeout(copyTimerRef.current);
+		}
+		setDialogView(null);
 		setConfirmText('');
+		setCopied(false);
 	};
 
-	const footer = (
+	const confirmFooter = (
 		<>
 			<Button
 				variant="solid"
@@ -81,12 +152,19 @@ function CancelSubscriptionBanner(): JSX.Element {
 				prefix={<X size={14} />}
 				disabled={confirmText !== 'cancel'}
 				onClick={handleContactSupport}
+				data-testid="cancel-subscription-confirm-btn"
 			>
 				Cancel subscription
 			</Button>
 		</>
 	);
 
+	const fallbackFooter = (
+		<Button variant="solid" color="secondary" onClick={handleClose}>
+			Close
+		</Button>
+	);
+
 	return (
 		<>
 			<div className={styles.banner}>
@@ -111,27 +189,67 @@ function CancelSubscriptionBanner(): JSX.Element {
 				</Button>
 			</div>
 			<DialogWrapper
-				open={open}
+				open={dialogView !== null}
 				onOpenChange={handleClose}
 				title="Cancel your subscription?"
 				width="narrow"
 				showCloseButton={false}
-				footer={footer}
+				footer={dialogView === 'confirm' ? confirmFooter : fallbackFooter}
 			>
-				<div className={styles.dialogBody}>
-					<p className={styles.dialogDescription}>
-						Cancelling your subscription would stop your data from being ingested to
-						SigNoz. All the data that has been already sent will also be deleted.
-					</p>
-					<p className={styles.dialogConfirmLabel}>
-						Type <code>cancel</code> to confirm the cancellation.
-					</p>
-					<Input
-						placeholder="Enter the word cancel..."
-						value={confirmText}
-						onChange={(e): void => setConfirmText(e.target.value)}
-					/>
-				</div>
+				{dialogView === 'confirm' && (
+					<div className={styles.dialogBody}>
+						<p className={styles.dialogDescription}>
+							Cancelling your subscription would stop your data from being ingested to
+							SigNoz. All the data that has been already sent will also be deleted.
+						</p>
+						<p className={styles.dialogConfirmLabel}>
+							Type <code>cancel</code> to confirm the cancellation.
+						</p>
+						<Input
+							placeholder="Enter the word cancel..."
+							value={confirmText}
+							onChange={(e): void => setConfirmText(e.target.value)}
+							data-testid="cancel-confirm-input"
+						/>
+					</div>
+				)}
+				{dialogView === 'fallback' && (
+					<div className={styles.fallbackBody}>
+						<p className={styles.fallbackHint}>
+							An email draft has been opened. If it did not open, send your
+							cancellation request directly to:
+						</p>
+						<span className={styles.fallbackEmail}>{SUPPORT_EMAIL}</span>
+						<div className={styles.fallbackActions}>
+							<Button
+								variant="outlined"
+								color="secondary"
+								prefix={copied ? <CircleCheck size={14} /> : <Copy size={14} />}
+								onClick={handleCopyTemplate}
+								data-testid="copy-email-template-btn"
+							>
+								{copied ? 'Copied!' : 'Copy email template'}
+							</Button>
+							<Button
+								asChild
+								variant="outlined"
+								color="secondary"
+								data-testid="retry-mailto-btn"
+							>
+								<a
+									href={buildMailtoUri(orgName, userEmail)}
+									onClick={handleRetryMailto}
+									className={styles.retryLink}
+									target="_blank"
+									rel="noopener noreferrer"
+								>
+									<MailOpen size={14} />
+									Reopen email client
+								</a>
+							</Button>
+						</div>
+					</div>
+				)}
 			</DialogWrapper>
 		</>
 	);

frontend/src/container/DashboardContainer/visualization/charts/ChartWrapper/ChartWrapper.tsx

@@ -1,6 +1,6 @@
 import { useCallback, useMemo, useRef } from 'react';
 import ChartLayout from 'container/DashboardContainer/visualization/layout/ChartLayout/ChartLayout';
-import Legend from 'lib/uPlotV2/components/Legend/Legend';
+import UPlotLegend from 'lib/uPlotV2/components/Legend/UPlotLegend';
 import {
 	LegendPosition,
 	TooltipRenderArgs,
@@ -47,7 +47,7 @@ export default function ChartWrapper({
 				return null;
 			}
 			return (
-				<Legend
+				<UPlotLegend
 					config={config}
 					position={legendConfig.position}
 					averageLegendWidth={averageLegendWidth}

frontend/src/container/DashboardContainer/visualization/charts/Pie/Pie.module.scss

@@ -0,0 +1,67 @@
+.pieChartWrapper {
+	display: flex;
+	flex-direction: column;
+	height: 100%;
+	width: 100%;
+	overflow: hidden;
+}
+
+.pieChartNoData {
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	width: 100%;
+	height: 100%;
+	font-size: 14px;
+}
+
+// Size is set inline from the computed chart dimensions (mirrors the uPlot
+// chart/legend split); this just centres the donut within that box.
+.pieChartContainer {
+	flex: 0 0 auto;
+	position: relative;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+}
+
+.pieChartTooltip {
+	padding: 8px 12px;
+	border-radius: 4px;
+	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
+	background-color: var(--l2-background) !important;
+	border: 1px solid var(--l2-border) !important;
+	z-index: 9999;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+.pieChartTooltipContent {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	gap: 8px;
+}
+
+.pieChartIndicator {
+	width: 12px;
+	height: 12px;
+	border-radius: 2px;
+	margin-right: 8px;
+	display: inline-block;
+}
+
+.pieChartTooltipValue {
+	font-weight: bold;
+	margin-top: 4px;
+}
+
+// Wraps the shared chart Legend. Its width/height are set inline from the
+// computed chart dimensions, so the VirtuosoGrid inside gets the same bounded
+// box (right column / bottom rows) the uPlot charts use.
+.pieChartLegend {
+	flex: 0 0 auto;
+	min-height: 0;
+	min-width: 0;
+	padding: 8px;
+}

frontend/src/container/DashboardContainer/visualization/charts/Pie/Pie.tsx

@@ -0,0 +1,235 @@
+import { useCallback, useMemo, useRef } from 'react';
+import { Color } from '@signozhq/design-tokens';
+import { Group } from '@visx/group';
+import { Pie as VisxPie } from '@visx/shape';
+import { defaultStyles, useTooltip, useTooltipInPortal } from '@visx/tooltip';
+import { getYAxisFormattedValue } from 'components/Graph/yAxisConfig';
+import { useResizeObserver } from 'hooks/useDimensions';
+import Legend from 'lib/uPlotV2/components/Legend/Legend';
+import { LegendPosition } from 'lib/uPlotV2/components/types';
+
+import { PieChartProps, PieSlice } from '../types';
+import { calculateChartDimensions } from '../utils';
+
+import { usePieInteractions } from '../../hooks/usePieInteractions';
+import PieArc from './PieArc';
+import PieCenterLabel from './PieCenterLabel';
+import styles from './Pie.module.scss';
+import { PieTooltipData } from './types';
+import { getFillColor } from './utils';
+
+/**
+ * Donut chart rendered with @visx. Splits its area into chart + legend with the
+ * same `calculateChartDimensions` logic as the uPlot charts (right column /
+ * up-to-two bottom rows), renders the shared chart Legend, and delegates the
+ * arcs, centre total and interaction state to PieArc / PieCenterLabel /
+ * usePieInteractions. Pure presentation — slices are pre-resolved by the caller.
+ */
+export default function Pie({
+	data,
+	yAxisUnit,
+	decimalPrecision,
+	isDarkMode,
+	position = LegendPosition.BOTTOM,
+	id,
+	onSliceClick,
+	'data-testid': testId,
+}: PieChartProps): JSX.Element {
+	const {
+		active,
+		setActive,
+		visibleData,
+		legendItems,
+		focusedSeriesIndex,
+		onLegendClick,
+		onLegendMouseMove,
+		onLegendMouseLeave,
+	} = usePieInteractions(data, id);
+
+	const {
+		tooltipOpen,
+		tooltipLeft,
+		tooltipTop,
+		tooltipData,
+		hideTooltip,
+		showTooltip,
+	} = useTooltip<PieTooltipData>();
+
+	const { containerRef, TooltipInPortal } = useTooltipInPortal({
+		scroll: true,
+		detectBounds: true,
+	});
+
+	const wrapperRef = useRef<HTMLDivElement>(null);
+	const { width: containerWidth, height: containerHeight } =
+		useResizeObserver(wrapperRef);
+
+	// Reuse the uPlot chart/legend split so the donut + legend get the same area
+	// allocation (right column, or up-to-two bottom rows) as every other panel.
+	const { width, height, legendWidth, legendHeight, averageLegendWidth } =
+		useMemo(
+			() =>
+				calculateChartDimensions({
+					containerWidth,
+					containerHeight,
+					legendConfig: { position },
+					seriesLabels: data.map((slice) => slice.label),
+				}),
+			[containerWidth, containerHeight, position, data],
+		);
+
+	// Donut geometry derived from the allocated chart box.
+	const { size, radius, innerRadius } = useMemo(() => {
+		const nextSize = Math.min(width, height);
+		const nextRadius = nextSize * 0.35;
+		return {
+			size: nextSize,
+			radius: nextRadius,
+			innerRadius: nextRadius * 0.6,
+		};
+	}, [width, height]);
+
+	const totalValue = useMemo(
+		() => visibleData.reduce((sum, slice) => sum + slice.value, 0),
+		[visibleData],
+	);
+
+	const labelColor = isDarkMode ? Color.BG_VANILLA_100 : Color.BG_INK_400;
+	const activeColor = active?.color ?? null;
+
+	const handleSliceEnter = useCallback(
+		(slice: PieSlice, centroidX: number, centroidY: number): void => {
+			showTooltip({
+				tooltipData: {
+					label: slice.label,
+					value: getYAxisFormattedValue(
+						slice.value.toString(),
+						yAxisUnit || 'none',
+						decimalPrecision,
+					),
+					color: slice.color,
+				},
+				tooltipTop: centroidY + height / 2,
+				tooltipLeft: centroidX + width / 2,
+			});
+			setActive(slice);
+		},
+		[showTooltip, setActive, yAxisUnit, decimalPrecision, height, width],
+	);
+
+	const handleSliceLeave = useCallback((): void => {
+		hideTooltip();
+		setActive(null);
+	}, [hideTooltip, setActive]);
+
+	if (!data.length) {
+		return (
+			<div
+				ref={wrapperRef}
+				className={styles.pieChartWrapper}
+				data-testid={testId}
+			>
+				<div className={styles.pieChartNoData}>No data</div>
+			</div>
+		);
+	}
+
+	const isRightLegend = position === LegendPosition.RIGHT;
+
+	return (
+		<div
+			ref={wrapperRef}
+			className={styles.pieChartWrapper}
+			style={{ flexDirection: isRightLegend ? 'row' : 'column' }}
+			data-testid={testId}
+		>
+			<div className={styles.pieChartContainer} style={{ width, height }}>
+				{size > 0 && (
+					<svg width={width} height={height} ref={containerRef}>
+						<Group top={height / 2} left={width / 2}>
+							<VisxPie
+								data={visibleData}
+								pieValue={(slice: PieSlice): number => slice.value}
+								outerRadius={radius}
+								innerRadius={innerRadius}
+								padAngle={0.01}
+								cornerRadius={3}
+								width={size}
+								height={size}
+							>
+								{(pie): JSX.Element[] =>
+									pie.arcs.map((arc) => (
+										<PieArc
+											key={`arc-${arc.data.label}-${arc.data.value}-${arc.startAngle.toFixed(
+												6,
+											)}`}
+											slice={arc.data}
+											arcPath={pie.path(arc) || ''}
+											centroid={pie.path.centroid(arc)}
+											startAngle={arc.startAngle}
+											endAngle={arc.endAngle}
+											radius={radius}
+											totalValue={totalValue}
+											yAxisUnit={yAxisUnit}
+											decimalPrecision={decimalPrecision}
+											labelColor={labelColor}
+											fill={getFillColor(arc.data.color, activeColor)}
+											onEnter={handleSliceEnter}
+											onLeave={handleSliceLeave}
+											onClick={onSliceClick}
+										/>
+									))
+								}
+							</VisxPie>
+							<PieCenterLabel
+								total={totalValue}
+								yAxisUnit={yAxisUnit}
+								decimalPrecision={decimalPrecision}
+								radius={radius}
+								innerRadius={innerRadius}
+								color={labelColor}
+							/>
+						</Group>
+					</svg>
+				)}
+				{tooltipOpen && tooltipData && (
+					<TooltipInPortal
+						top={tooltipTop}
+						left={tooltipLeft}
+						className={styles.pieChartTooltip}
+						style={{
+							...defaultStyles,
+							color: labelColor,
+						}}
+					>
+						<div
+							className={styles.pieChartIndicator}
+							style={{ background: tooltipData.color }}
+						/>
+						<div className={styles.pieChartTooltipContent}>
+							<span>{tooltipData.label}</span>
+							<span className={styles.pieChartTooltipValue}>{tooltipData.value}</span>
+						</div>
+					</TooltipInPortal>
+				)}
+			</div>
+			<div
+				className={styles.pieChartLegend}
+				style={{
+					width: legendWidth,
+					height: legendHeight,
+				}}
+			>
+				<Legend
+					items={legendItems}
+					position={position}
+					averageLegendWidth={averageLegendWidth}
+					focusedSeriesIndex={focusedSeriesIndex}
+					onClick={onLegendClick}
+					onMouseMove={onLegendMouseMove}
+					onMouseLeave={onLegendMouseLeave}
+				/>
+			</div>
+		</div>
+	);
+}

frontend/src/container/DashboardContainer/visualization/charts/Pie/PieArc.tsx

@@ -0,0 +1,123 @@
+import type { PrecisionOption } from 'components/Graph/types';
+import { getYAxisFormattedValue } from 'components/Graph/yAxisConfig';
+
+import { PieSlice } from '../types';
+
+import { getArcGeometry } from './utils';
+
+// Slices below this share of the total don't get a leader label (too cramped).
+const MIN_LABEL_SHARE = 0.03;
+const MAX_LABEL_LENGTH = 15;
+
+interface PieArcProps {
+	slice: PieSlice;
+	/** SVG path `d` for the arc, from the visx pie generator. */
+	arcPath: string;
+	/** Arc centroid `[x, y]`, used to anchor the leader line and tooltip. */
+	centroid: [number, number];
+	startAngle: number;
+	endAngle: number;
+	radius: number;
+	/** Sum of visible slice values — drives the show-label threshold. */
+	totalValue: number;
+	yAxisUnit?: string;
+	decimalPrecision?: PrecisionOption;
+	labelColor: string;
+	/** Resolved fill (already dimmed if another slice is active). */
+	fill: string;
+	onEnter: (slice: PieSlice, centroidX: number, centroidY: number) => void;
+	onLeave: () => void;
+	onClick?: (slice: PieSlice) => void;
+}
+
+/**
+ * A single donut slice: the arc path plus, for non-tiny slices, a leader line
+ * out to an external label + value. Pure presentation — interaction is
+ * delegated to the `onEnter`/`onLeave`/`onClick` callbacks.
+ */
+export default function PieArc({
+	slice,
+	arcPath,
+	centroid,
+	startAngle,
+	endAngle,
+	radius,
+	totalValue,
+	yAxisUnit,
+	decimalPrecision,
+	labelColor,
+	fill,
+	onEnter,
+	onLeave,
+	onClick,
+}: PieArcProps): JSX.Element {
+	const { label, value } = slice;
+	const [centroidX, centroidY] = centroid;
+	const { labelX, labelY, lineEndX, lineEndY, textAnchor } = getArcGeometry(
+		startAngle,
+		endAngle,
+		radius,
+	);
+
+	const displayValue = getYAxisFormattedValue(
+		value.toString(),
+		yAxisUnit || 'none',
+		decimalPrecision,
+	);
+	const shortenedLabel =
+		label.length > MAX_LABEL_LENGTH ? `${label.substring(0, 12)}...` : label;
+	const shouldShowLabel = value / totalValue > MIN_LABEL_SHARE;
+
+	return (
+		<g
+			onMouseEnter={(): void => onEnter(slice, centroidX, centroidY)}
+			onMouseLeave={onLeave}
+			onClick={(): void => onClick?.(slice)}
+		>
+			<path d={arcPath} fill={fill} />
+			{shouldShowLabel && (
+				<>
+					<line
+						x1={centroidX}
+						y1={centroidY}
+						x2={lineEndX}
+						y2={lineEndY}
+						stroke={labelColor}
+						strokeWidth={1}
+					/>
+					<line
+						x1={lineEndX}
+						y1={lineEndY}
+						x2={labelX}
+						y2={labelY}
+						stroke={labelColor}
+						strokeWidth={1}
+					/>
+					<text
+						x={labelX}
+						y={labelY - 8}
+						dy=".33em"
+						fill={labelColor}
+						fontSize={10}
+						textAnchor={textAnchor}
+						pointerEvents="none"
+					>
+						{shortenedLabel}
+					</text>
+					<text
+						x={labelX}
+						y={labelY + 8}
+						dy=".33em"
+						fill={labelColor}
+						fontSize={10}
+						fontWeight="bold"
+						textAnchor={textAnchor}
+						pointerEvents="none"
+					>
+						{displayValue}
+					</text>
+				</>
+			)}
+		</g>
+	);
+}

frontend/src/container/DashboardContainer/visualization/charts/Pie/PieCenterLabel.tsx

@@ -0,0 +1,57 @@
+import type { PrecisionOption } from 'components/Graph/types';
+import { getYAxisFormattedValue } from 'components/Graph/yAxisConfig';
+
+import { getScaledFontSize } from './utils';
+
+interface PieCenterLabelProps {
+	/** Sum of the visible slice values, shown in the donut hole. */
+	total: number;
+	yAxisUnit?: string;
+	decimalPrecision?: PrecisionOption;
+	radius: number;
+	innerRadius: number;
+	color: string;
+}
+
+/**
+ * The total shown in the centre of the donut. Splits the formatted value into
+ * its numeric part and unit so each can be sized independently, and scales the
+ * numeric font down for long values so it never overflows the hole.
+ */
+export default function PieCenterLabel({
+	total,
+	yAxisUnit,
+	decimalPrecision,
+	radius,
+	innerRadius,
+	color,
+}: PieCenterLabelProps): JSX.Element {
+	const formattedTotal = getYAxisFormattedValue(
+		total.toString(),
+		yAxisUnit || 'none',
+		decimalPrecision,
+	);
+	const matches = formattedTotal.match(/([\d.]+[KMB]?)(.*)$/);
+	const numericTotal = matches?.[1] || formattedTotal;
+	const unitTotal = matches?.[2]?.trim() || '';
+
+	const numericFontSize = getScaledFontSize({
+		text: numericTotal,
+		baseSize: radius * 0.3,
+		innerRadius,
+	});
+	const unitFontSize = numericFontSize * 0.5;
+
+	return (
+		<text textAnchor="middle" dominantBaseline="central" fill={color}>
+			<tspan fontSize={numericFontSize} fontWeight="bold">
+				{numericTotal}
+			</tspan>
+			{unitTotal && (
+				<tspan fontSize={unitFontSize} opacity={0.9} dx={2}>
+					{unitTotal}
+				</tspan>
+			)}
+		</text>
+	);
+}

frontend/src/container/DashboardContainer/visualization/charts/Pie/__tests__/Pie.test.tsx

@@ -0,0 +1,116 @@
+import React from 'react';
+import { fireEvent, render, screen, within } from '@testing-library/react';
+import { TooltipProvider } from '@signozhq/ui/tooltip';
+import { LegendPosition } from 'lib/uPlotV2/components/types';
+import { LegendItem } from 'lib/uPlotV2/config/types';
+
+import { PieSlice } from '../../types';
+import Pie from '../Pie';
+
+jest.mock('hooks/useDimensions', () => ({
+	useResizeObserver: jest.fn().mockReturnValue({ width: 400, height: 300 }),
+}));
+
+jest.mock('components/Graph/yAxisConfig', () => ({
+	getYAxisFormattedValue: jest.fn((value: string) => value),
+}));
+
+// VirtuosoGrid only renders a window in jsdom; render every item so we can
+// assert on legend entries.
+jest.mock('react-virtuoso', () => ({
+	VirtuosoGrid: ({
+		data,
+		itemContent,
+	}: {
+		data: LegendItem[];
+		itemContent: (index: number, item: LegendItem) => React.ReactNode;
+	}): JSX.Element => (
+		<div data-testid="virtuoso-grid">
+			{data.map((item, index) => (
+				<div key={item.seriesIndex ?? index}>{itemContent(index, item)}</div>
+			))}
+		</div>
+	),
+}));
+
+const DATA: PieSlice[] = [
+	{ label: 'frontend', value: 100, color: '#aa0000' },
+	{ label: 'cart', value: 60, color: '#00aa00' },
+	{ label: 'checkout', value: 40, color: '#0000aa' },
+];
+
+function renderPie(
+	props: Partial<React.ComponentProps<typeof Pie>> = {},
+): void {
+	render(
+		<TooltipProvider>
+			<Pie data={DATA} isDarkMode={false} data-testid="pie" {...props} />
+		</TooltipProvider>,
+	);
+}
+
+describe('Pie', () => {
+	it('renders the "No data" state for empty data', () => {
+		render(
+			<TooltipProvider>
+				<Pie data={[]} isDarkMode={false} data-testid="pie" />
+			</TooltipProvider>,
+		);
+		expect(screen.getByText('No data')).toBeInTheDocument();
+	});
+
+	it('renders one arc per slice plus the legend entries and centre total', () => {
+		renderPie();
+
+		const svg = screen.getByTestId('pie').querySelector('svg') as SVGElement;
+		expect(svg.querySelectorAll('path')).toHaveLength(DATA.length);
+
+		const legend = screen.getByTestId('virtuoso-grid');
+		expect(within(legend).getByText('frontend')).toBeInTheDocument();
+		expect(within(legend).getByText('cart')).toBeInTheDocument();
+		expect(within(legend).getByText('checkout')).toBeInTheDocument();
+
+		// Centre total = 100 + 60 + 40 (formatter mocked to echo the value).
+		expect(screen.getByText('200')).toBeInTheDocument();
+	});
+
+	it('lays the legend out in a row for the right position and a column for bottom', () => {
+		const { rerender } = render(
+			<TooltipProvider>
+				<Pie
+					data={DATA}
+					isDarkMode={false}
+					position={LegendPosition.RIGHT}
+					data-testid="pie"
+				/>
+			</TooltipProvider>,
+		);
+		expect(screen.getByTestId('pie')).toHaveStyle({ flexDirection: 'row' });
+
+		rerender(
+			<TooltipProvider>
+				<Pie
+					data={DATA}
+					isDarkMode={false}
+					position={LegendPosition.BOTTOM}
+					data-testid="pie"
+				/>
+			</TooltipProvider>,
+		);
+		expect(screen.getByTestId('pie')).toHaveStyle({ flexDirection: 'column' });
+	});
+
+	it('hides a slice when its legend marker is clicked', () => {
+		renderPie();
+		const svg = screen.getByTestId('pie').querySelector('svg') as SVGElement;
+		expect(svg.querySelectorAll('path')).toHaveLength(3);
+
+		const marker = document.querySelector(
+			'[data-legend-item-id="1"] [data-is-legend-marker="true"]',
+		) as HTMLElement;
+		fireEvent.click(marker);
+
+		// One slice hidden → one fewer arc drawn.
+		expect(svg.querySelectorAll('path')).toHaveLength(2);
+	});
+});

frontend/src/container/DashboardContainer/visualization/charts/Pie/__tests__/PieArc.test.tsx

@@ -0,0 +1,85 @@
+import { fireEvent, render, screen } from '@testing-library/react';
+
+import { PieSlice } from '../../types';
+import PieArc from '../PieArc';
+
+jest.mock('components/Graph/yAxisConfig', () => ({
+	// Echo the raw value so assertions are deterministic.
+	getYAxisFormattedValue: jest.fn((value: string) => value),
+}));
+
+const SLICE: PieSlice = { label: 'frontend', value: 50, color: '#f00' };
+
+function renderArc(props: Partial<React.ComponentProps<typeof PieArc>> = {}): {
+	onEnter: jest.Mock;
+	onLeave: jest.Mock;
+	onClick: jest.Mock;
+	container: HTMLElement;
+} {
+	const onEnter = jest.fn();
+	const onLeave = jest.fn();
+	const onClick = jest.fn();
+	const { container } = render(
+		<svg>
+			<PieArc
+				slice={SLICE}
+				arcPath="M0,0L1,1"
+				centroid={[10, 20]}
+				startAngle={0}
+				endAngle={Math.PI}
+				radius={100}
+				totalValue={100}
+				labelColor="#fff"
+				fill="#f00"
+				onEnter={onEnter}
+				onLeave={onLeave}
+				onClick={onClick}
+				{...props}
+			/>
+		</svg>,
+	);
+	return { onEnter, onLeave, onClick, container };
+}
+
+describe('PieArc', () => {
+	it('renders the arc path with the resolved fill', () => {
+		const { container } = renderArc();
+		const path = container.querySelector('path');
+		expect(path).toHaveAttribute('d', 'M0,0L1,1');
+		expect(path).toHaveAttribute('fill', '#f00');
+	});
+
+	it('shows the leader label + value for a slice above the threshold', () => {
+		renderArc(); // 50 / 100 = 0.5
+		expect(screen.getByText('frontend')).toBeInTheDocument();
+		expect(screen.getByText('50')).toBeInTheDocument();
+	});
+
+	it('hides the leader label for a slice below the 3% threshold', () => {
+		renderArc({ totalValue: 10000 }); // 50 / 10000 = 0.005
+		expect(screen.queryByText('frontend')).not.toBeInTheDocument();
+		// the arc path itself still renders
+		expect(screen.queryByText('50')).not.toBeInTheDocument();
+	});
+
+	it('truncates labels longer than 15 chars', () => {
+		renderArc({
+			slice: { label: 'a-really-long-service-name', value: 50, color: '#f00' },
+		});
+		expect(screen.getByText('a-really-lon...')).toBeInTheDocument();
+	});
+
+	it('fires onEnter with the slice + centroid, and onLeave / onClick', () => {
+		const { onEnter, onLeave, onClick, container } = renderArc();
+		const g = container.querySelector('g') as SVGGElement;
+
+		fireEvent.mouseEnter(g);
+		expect(onEnter).toHaveBeenCalledWith(SLICE, 10, 20);
+
+		fireEvent.mouseLeave(g);
+		expect(onLeave).toHaveBeenCalledTimes(1);
+
+		fireEvent.click(g);
+		expect(onClick).toHaveBeenCalledWith(SLICE);
+	});
+});

frontend/src/container/DashboardContainer/visualization/charts/Pie/__tests__/PieCenterLabel.test.tsx

@@ -0,0 +1,45 @@
+import { render, screen } from '@testing-library/react';
+import { getYAxisFormattedValue } from 'components/Graph/yAxisConfig';
+
+import PieCenterLabel from '../PieCenterLabel';
+
+jest.mock('components/Graph/yAxisConfig', () => ({
+	getYAxisFormattedValue: jest.fn(),
+}));
+
+const mockFormat = getYAxisFormattedValue as jest.MockedFunction<
+	typeof getYAxisFormattedValue
+>;
+
+function renderInSvg(node: JSX.Element): ReturnType<typeof render> {
+	// PieCenterLabel returns an SVG <text>, so it needs an <svg> host.
+	return render(<svg>{node}</svg>);
+}
+
+describe('PieCenterLabel', () => {
+	const baseProps = {
+		total: 3700,
+		radius: 100,
+		innerRadius: 60,
+		color: '#fff',
+	};
+
+	it('renders the formatted total (numeric + unit suffix) as one numeric tspan when there is no separate unit', () => {
+		mockFormat.mockReturnValue('3.7K');
+		renderInSvg(<PieCenterLabel {...baseProps} />);
+		expect(screen.getByText('3.7K')).toBeInTheDocument();
+	});
+
+	it('splits the numeric part and the trailing unit into separate tspans', () => {
+		mockFormat.mockReturnValue('1.2 MB');
+		renderInSvg(<PieCenterLabel {...baseProps} />);
+		expect(screen.getByText('1.2')).toBeInTheDocument();
+		expect(screen.getByText('MB')).toBeInTheDocument();
+	});
+
+	it('passes the unit + precision through to the formatter', () => {
+		mockFormat.mockReturnValue('100');
+		renderInSvg(<PieCenterLabel {...baseProps} total={100} yAxisUnit="bytes" />);
+		expect(mockFormat).toHaveBeenCalledWith('100', 'bytes', undefined);
+	});
+});

frontend/src/container/DashboardContainer/visualization/charts/Pie/__tests__/utils.test.ts

@@ -0,0 +1,101 @@
+import {
+	getArcGeometry,
+	getFillColor,
+	getScaledFontSize,
+	lightenColor,
+} from '../utils';
+
+describe('Pie utils', () => {
+	describe('getScaledFontSize', () => {
+		it('returns the base size for empty text', () => {
+			expect(getScaledFontSize({ text: '', baseSize: 30, innerRadius: 100 })).toBe(
+				30,
+			);
+		});
+
+		it('does not scale short text (length <= 3)', () => {
+			// scaleFactor = max(0.3, 1) = 1 → baseSize, capped by innerRadius * 0.9.
+			expect(
+				getScaledFontSize({ text: '3.7', baseSize: 30, innerRadius: 100 }),
+			).toBe(30);
+		});
+
+		it('scales longer text down', () => {
+			// length 8 → scaleFactor = max(0.3, 1 - 5 * 0.09) = 0.55 → 30 * 0.55.
+			expect(
+				getScaledFontSize({ text: '12345678', baseSize: 30, innerRadius: 100 }),
+			).toBeCloseTo(16.5);
+		});
+
+		it('floors the scale factor at 0.3 for very long text', () => {
+			// length 20 → 1 - 17 * 0.09 < 0.3 → floored to 0.3 → 100 * 0.3.
+			expect(
+				getScaledFontSize({
+					text: '12345678901234567890',
+					baseSize: 100,
+					innerRadius: 1000,
+				}),
+			).toBeCloseTo(30);
+		});
+
+		it('caps the size at 90% of the inner radius', () => {
+			expect(
+				getScaledFontSize({ text: '3.7', baseSize: 200, innerRadius: 10 }),
+			).toBeCloseTo(9);
+		});
+	});
+
+	describe('getArcGeometry', () => {
+		it('places the label below for a slice centred at the top (angle 0)', () => {
+			const g = getArcGeometry(0, 0, 100);
+			expect(g.labelX).toBeCloseTo(0);
+			expect(g.labelY).toBeCloseTo(-130);
+			expect(g.lineEndX).toBeCloseTo(0);
+			expect(g.lineEndY).toBeCloseTo(-110);
+			// sin(0) is not > 0 → anchor end.
+			expect(g.textAnchor).toBe('end');
+		});
+
+		it('anchors to the start on the right half (angle pi/2)', () => {
+			const g = getArcGeometry(0, Math.PI, 100);
+			expect(g.labelX).toBeCloseTo(130);
+			expect(g.labelY).toBeCloseTo(0);
+			expect(g.textAnchor).toBe('start');
+		});
+
+		it('anchors to the end on the left half (angle 3pi/2)', () => {
+			const g = getArcGeometry(Math.PI, 2 * Math.PI, 100);
+			expect(g.labelX).toBeCloseTo(-130);
+			expect(g.textAnchor).toBe('end');
+		});
+	});
+
+	describe('lightenColor', () => {
+		it('converts a #rrggbb hex to rgba at the given opacity', () => {
+			expect(lightenColor('#ff0000', 0.4)).toBe('rgba(255, 0, 0, 0.4)');
+		});
+
+		it('accepts hex without a leading #', () => {
+			expect(lightenColor('00ff00', 0.4)).toBe('rgba(0, 255, 0, 0.4)');
+		});
+
+		it('returns the original colour when it is not parseable hex', () => {
+			expect(lightenColor('rgba(0,0,0,1)', 0.4)).toBe('rgba(0,0,0,1)');
+			expect(lightenColor('red', 0.4)).toBe('red');
+		});
+	});
+
+	describe('getFillColor', () => {
+		it('returns the colour unchanged when nothing is active', () => {
+			expect(getFillColor('#ff0000', null)).toBe('#ff0000');
+		});
+
+		it('returns the colour unchanged for the active slice', () => {
+			expect(getFillColor('#ff0000', '#ff0000')).toBe('#ff0000');
+		});
+
+		it('dims non-active slices to 40% opacity', () => {
+			expect(getFillColor('#00ff00', '#ff0000')).toBe('rgba(0, 255, 0, 0.4)');
+		});
+	});
+});

frontend/src/container/DashboardContainer/visualization/charts/Pie/types.ts

@@ -0,0 +1,35 @@
+/**
+ * Pie-local types. Kept out of the component / util files so each stays focused
+ * (per the one-component-per-file + dedicated-types rules). Shared chart types
+ * (PieSlice, PieChartProps) live in the parent charts/types.ts.
+ */
+
+export interface ScaledFontSizeArgs {
+	text: string;
+	baseSize: number;
+	innerRadius: number;
+}
+
+export interface ArcGeometry {
+	/** Outer point where the leader label sits. */
+	labelX: number;
+	labelY: number;
+	/** Elbow point where the leader line bends toward the label. */
+	lineEndX: number;
+	lineEndY: number;
+	/** Anchor the label left/right depending on which half of the circle it's in. */
+	textAnchor: 'start' | 'end';
+}
+
+export interface ParsedRgb {
+	r: number;
+	g: number;
+	b: number;
+}
+
+/** Resolved tooltip payload shown when a slice is hovered. */
+export interface PieTooltipData {
+	label: string;
+	value: string;
+	color: string;
+}

frontend/src/container/DashboardContainer/visualization/charts/Pie/utils.ts

@@ -0,0 +1,89 @@
+/**
+ * Pure presentation helpers for the Pie chart. Kept out of the component file
+ * so the renderer stays declarative (per the one-component-per-file rule).
+ */
+
+import { ArcGeometry, ParsedRgb, ScaledFontSizeArgs } from './types';
+
+/**
+ * Shrinks the centre-total font as the text gets longer so it never overflows
+ * the donut hole. Ported from the V1 PiePanelWrapper.
+ */
+export function getScaledFontSize({
+	text,
+	baseSize,
+	innerRadius,
+}: ScaledFontSizeArgs): number {
+	if (!text) {
+		return baseSize;
+	}
+
+	const { length } = text;
+	// More aggressive scaling for very long numbers.
+	const scaleFactor = Math.max(0.3, 1 - (length - 3) * 0.09);
+	// Don't use more than 90% of the inner radius.
+	const maxSize = innerRadius * 0.9;
+
+	return Math.min(baseSize * scaleFactor, maxSize);
+}
+
+/**
+ * Computes the leader-line / label geometry for one arc from its angular span.
+ * Pulled out of the render prop so the SVG markup stays declarative.
+ */
+export function getArcGeometry(
+	startAngle: number,
+	endAngle: number,
+	radius: number,
+): ArcGeometry {
+	const angle = (startAngle + endAngle) / 2;
+	const labelRadius = radius * 1.3;
+	const lineEndRadius = radius * 1.1;
+	return {
+		labelX: Math.sin(angle) * labelRadius,
+		labelY: -Math.cos(angle) * labelRadius,
+		lineEndX: Math.sin(angle) * lineEndRadius,
+		lineEndY: -Math.cos(angle) * lineEndRadius,
+		textAnchor: Math.sin(angle) > 0 ? 'start' : 'end',
+	};
+}
+
+// Parses `#rrggbb` into its components. Returns null for anything else (e.g. an
+// already-rgba string), letting callers fall back to the original colour.
+function hexToRgb(color: string): ParsedRgb | null {
+	const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(color);
+	return result
+		? {
+				r: parseInt(result[1], 16),
+				g: parseInt(result[2], 16),
+				b: parseInt(result[3], 16),
+			}
+		: null;
+}
+
+/**
+ * Returns an rgba() string for `color` at the given opacity. Used to dim the
+ * non-hovered slices. Falls back to the original colour if it can't be parsed.
+ */
+export function lightenColor(color: string, opacity: number): string {
+	const rgb = hexToRgb(color);
+	if (!rgb) {
+		return color;
+	}
+	return `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${opacity})`;
+}
+
+/**
+ * Resolves the fill for a slice given the currently-hovered slice colour:
+ * everything but the active slice dims to 40% opacity. With nothing hovered
+ * (`activeColor === null`) every slice keeps its full colour.
+ */
+export function getFillColor(
+	color: string,
+	activeColor: string | null,
+): string {
+	if (activeColor === null) {
+		return color;
+	}
+	return activeColor === color ? color : lightenColor(color, 0.4);
+}

frontend/src/container/DashboardContainer/visualization/charts/types.ts

@@ -3,13 +3,14 @@ import { PrecisionOption } from 'components/Graph/types';
 import {
 	IRenderTooltipFooterArgs,
 	LegendConfig,
+	LegendPosition,
 	TooltipRenderArgs,
 } from 'lib/uPlotV2/components/types';
 import { UPlotConfigBuilder } from 'lib/uPlotV2/config/UPlotConfigBuilder';
 import {
 	DashboardCursorSync,
 	SyncTooltipFilterMode,
-	TooltipClickData,
+	ChartClickData,
 } from 'lib/uPlotV2/plugins/TooltipPlugin/types';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
 
@@ -22,10 +23,10 @@ interface BaseChartProps {
 	/** Key that pins the tooltip while hovering. Defaults to DEFAULT_PIN_TOOLTIP_KEY ('l'). */
 	pinKey?: string;
 	/** Called when the user clicks the uPlot overlay. Receives resolved click data. */
-	onClick?: (clickData: TooltipClickData) => void;
+	onClick?: (clickData: ChartClickData) => void;
 	yAxisUnit?: string;
 	decimalPrecision?: PrecisionOption;
-	pinnedTooltipElement?: (clickData: TooltipClickData) => React.ReactNode;
+	pinnedTooltipElement?: (clickData: ChartClickData) => React.ReactNode;
 	renderTooltipFooter?: (args: IRenderTooltipFooterArgs) => React.ReactNode;
 	customTooltip?: (props: TooltipRenderArgs) => React.ReactNode;
 	'data-testid'?: string;
@@ -69,3 +70,36 @@ export type ChartProps =
 	| TimeSeriesChartProps
 	| BarChartProps
 	| HistogramChartProps;
+
+/**
+ * One resolved pie/donut slice: a display label, its (already parsed) positive
+ * numeric value, and the colour used for the arc + legend swatch.
+ */
+export interface PieSlice {
+	label: string;
+	value: number;
+	color: string;
+}
+
+/**
+ * Props for the Pie chart. Unlike the others above, Pie is NOT uPlot-based
+ * (it renders with @visx), so it deliberately does not extend BaseChartProps /
+ * UPlotBasedChartProps — it takes pre-resolved slices and self-measures its
+ * draw area rather than receiving a uPlot config + aligned data.
+ */
+export interface PieChartProps {
+	data: PieSlice[];
+	yAxisUnit?: string;
+	decimalPrecision?: PrecisionOption;
+	isDarkMode: boolean;
+	/** Legend placement. Drives the chart-vs-legend layout. Default BOTTOM. */
+	position?: LegendPosition;
+	/**
+	 * Widget id used to persist per-slice hide/unhide state to localStorage
+	 * (shared GRAPH_VISIBILITY_STATES, keyed by label). Omit to disable persistence.
+	 */
+	id?: string;
+	/** Fired when a slice (or its legend entry) is clicked. */
+	onSliceClick?: (slice: PieSlice) => void;
+	'data-testid'?: string;
+}

frontend/src/container/DashboardContainer/visualization/hooks/__tests__/usePieInteractions.test.tsx

@@ -0,0 +1,147 @@
+import { act, renderHook } from '@testing-library/react';
+import {
+	getStoredSeriesVisibility,
+	updateSeriesVisibilityToLocalStorage,
+} from 'container/DashboardContainer/visualization/panels/utils/legendVisibilityUtils';
+import type { MouseEvent } from 'react';
+
+import { PieSlice } from '../../charts/types';
+import { usePieInteractions } from '../usePieInteractions';
+
+jest.mock(
+	'container/DashboardContainer/visualization/panels/utils/legendVisibilityUtils',
+);
+
+const mockGetStored = getStoredSeriesVisibility as jest.MockedFunction<
+	typeof getStoredSeriesVisibility
+>;
+const mockUpdateStored =
+	updateSeriesVisibilityToLocalStorage as jest.MockedFunction<
+		typeof updateSeriesVisibilityToLocalStorage
+	>;
+
+const DATA: PieSlice[] = [
+	{ label: 'frontend', value: 100, color: '#a' },
+	{ label: 'cart', value: 60, color: '#b' },
+	{ label: 'checkout', value: 40, color: '#c' },
+];
+
+// Builds a fake legend click/move event: `e.target.closest('[data-legend-item-id]')`
+// resolves to the item at `index`, and `e.target.dataset.isLegendMarker` flags marker clicks.
+function legendEvent(
+	index: number | null,
+	isMarker = false,
+): MouseEvent<HTMLDivElement> {
+	const itemEl =
+		index == null ? null : { dataset: { legendItemId: String(index) } };
+	return {
+		target: {
+			closest: (): unknown => itemEl,
+			dataset: { isLegendMarker: isMarker ? 'true' : undefined },
+		},
+	} as unknown as MouseEvent<HTMLDivElement>;
+}
+
+describe('usePieInteractions', () => {
+	beforeEach(() => {
+		mockGetStored.mockReturnValue(null);
+		mockUpdateStored.mockReset();
+	});
+
+	it('starts with everything visible and nothing focused', () => {
+		const { result } = renderHook(() => usePieInteractions(DATA));
+
+		expect(result.current.visibleData).toStrictEqual(DATA);
+		expect(result.current.legendItems.map((i) => i.show)).toStrictEqual([
+			true,
+			true,
+			true,
+		]);
+		expect(result.current.focusedSeriesIndex).toBeNull();
+		expect(result.current.active).toBeNull();
+	});
+
+	describe('marker click (toggle one)', () => {
+		it('hides then unhides the clicked slice', () => {
+			const { result } = renderHook(() => usePieInteractions(DATA, 'panel-1'));
+
+			act(() => result.current.onLegendClick(legendEvent(1, true)));
+
+			expect(result.current.visibleData).toStrictEqual([DATA[0], DATA[2]]);
+			expect(result.current.legendItems[1].show).toBe(false);
+			expect(mockUpdateStored).toHaveBeenLastCalledWith('panel-1', [
+				{ label: 'frontend', show: true },
+				{ label: 'cart', show: false },
+				{ label: 'checkout', show: true },
+			]);
+
+			act(() => result.current.onLegendClick(legendEvent(1, true)));
+
+			expect(result.current.visibleData).toStrictEqual(DATA);
+			expect(result.current.legendItems[1].show).toBe(true);
+		});
+	});
+
+	describe('label click (isolate / reset)', () => {
+		it('isolates the clicked slice, then resets on a second click', () => {
+			const { result } = renderHook(() => usePieInteractions(DATA));
+
+			act(() => result.current.onLegendClick(legendEvent(0, false)));
+
+			expect(result.current.visibleData).toStrictEqual([DATA[0]]);
+			expect(result.current.legendItems.map((i) => i.show)).toStrictEqual([
+				true,
+				false,
+				false,
+			]);
+
+			act(() => result.current.onLegendClick(legendEvent(0, false)));
+
+			expect(result.current.visibleData).toStrictEqual(DATA);
+		});
+	});
+
+	describe('hover', () => {
+		it('focuses the hovered slice and clears on leave', () => {
+			const { result } = renderHook(() => usePieInteractions(DATA));
+
+			act(() => result.current.onLegendMouseMove(legendEvent(2)));
+			expect(result.current.active).toStrictEqual(DATA[2]);
+			expect(result.current.focusedSeriesIndex).toBe(2);
+
+			act(() => result.current.onLegendMouseLeave());
+			expect(result.current.active).toBeNull();
+			expect(result.current.focusedSeriesIndex).toBeNull();
+		});
+
+		it('does not focus a hidden slice', () => {
+			const { result } = renderHook(() => usePieInteractions(DATA));
+
+			act(() => result.current.onLegendClick(legendEvent(1, true))); // hide cart
+			act(() => result.current.onLegendMouseMove(legendEvent(1)));
+
+			expect(result.current.active).toBeNull();
+		});
+	});
+
+	describe('persistence', () => {
+		it('does not write to storage when no id is provided', () => {
+			const { result } = renderHook(() => usePieInteractions(DATA));
+			act(() => result.current.onLegendClick(legendEvent(0, true)));
+			expect(mockUpdateStored).not.toHaveBeenCalled();
+		});
+
+		it('rehydrates hidden slices from storage on mount (matched by label)', () => {
+			mockGetStored.mockReturnValue([
+				{ label: 'frontend', show: true },
+				{ label: 'cart', show: false },
+				{ label: 'checkout', show: true },
+			]);
+
+			const { result } = renderHook(() => usePieInteractions(DATA, 'panel-1'));
+
+			expect(result.current.visibleData).toStrictEqual([DATA[0], DATA[2]]);
+			expect(result.current.legendItems[1].show).toBe(false);
+		});
+	});
+});

frontend/src/container/DashboardContainer/visualization/hooks/usePieInteractions.ts

@@ -0,0 +1,168 @@
+import { LegendItem } from 'lib/uPlotV2/config/types';
+import type { Dispatch, MouseEvent, SetStateAction } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+
+import {
+	getStoredSeriesVisibility,
+	updateSeriesVisibilityToLocalStorage,
+} from '../panels/utils/legendVisibilityUtils';
+import { PieSlice } from '../charts/types';
+
+export interface UsePieInteractionsResult {
+	/** The hovered/focused slice (drives donut dimming + tooltip). */
+	active: PieSlice | null;
+	setActive: Dispatch<SetStateAction<PieSlice | null>>;
+	/** Slices currently shown (hidden ones removed). */
+	visibleData: PieSlice[];
+	/** Legend item per slice (`show` reflects hide state). */
+	legendItems: LegendItem[];
+	/** Index of the active slice for the legend's focus highlight, or null. */
+	focusedSeriesIndex: number | null;
+	onLegendClick: (e: MouseEvent<HTMLDivElement>) => void;
+	onLegendMouseMove: (e: MouseEvent<HTMLDivElement>) => void;
+	onLegendMouseLeave: () => void;
+}
+
+// Reads the slice index off the nearest `[data-legend-item-id]` ancestor of the
+// event target (the shared Legend tags each item with its seriesIndex).
+function getLegendIndex(e: MouseEvent<HTMLDivElement>): number | null {
+	const el = (e.target as HTMLElement | null)?.closest<HTMLElement>(
+		'[data-legend-item-id]',
+	);
+	const id = el?.dataset.legendItemId;
+	return id != null ? Number(id) : null;
+}
+
+/**
+ * Pie interaction + derived state: hover/focus, slice hide/unhide (mirroring the
+ * uPlot legend — marker toggles one, label isolates), and persistence of the
+ * hidden set to localStorage (keyed by `id`, matched by label) so it survives
+ * reloads. Returns the visible slices, legend items, focus index, and the
+ * legend container handlers.
+ */
+export function usePieInteractions(
+	data: PieSlice[],
+	id?: string,
+): UsePieInteractionsResult {
+	const [active, setActive] = useState<PieSlice | null>(null);
+	const [hiddenIndices, setHiddenIndices] = useState<Set<number>>(
+		() => new Set(),
+	);
+	const isolatedIndexRef = useRef<number | null>(null);
+
+	const legendItems = useMemo<LegendItem[]>(
+		() =>
+			data.map((slice, index) => ({
+				seriesIndex: index,
+				label: slice.label,
+				color: slice.color,
+				show: !hiddenIndices.has(index),
+			})),
+		[data, hiddenIndices],
+	);
+
+	// Hidden slices drop out so the remaining arcs + centre total recompute.
+	const visibleData = useMemo(
+		() => data.filter((_, index) => !hiddenIndices.has(index)),
+		[data, hiddenIndices],
+	);
+
+	// Rehydrate hide/unhide from localStorage (matched by label) whenever the
+	// data set changes — including first load and every refetch, since the store
+	// is the source of truth and toggles write back to it.
+	useEffect(() => {
+		if (!id || !data.length) {
+			return;
+		}
+		const stored = getStoredSeriesVisibility(id);
+		if (!stored) {
+			return;
+		}
+		const hidden = new Set<number>();
+		data.forEach((slice, index) => {
+			if (stored.find((s) => s.label === slice.label)?.show === false) {
+				hidden.add(index);
+			}
+		});
+		setHiddenIndices(hidden);
+	}, [id, data]);
+
+	// Apply a new hidden set and persist it (label + show) to localStorage.
+	const applyHidden = useCallback(
+		(hidden: Set<number>): void => {
+			setHiddenIndices(hidden);
+			if (id) {
+				updateSeriesVisibilityToLocalStorage(
+					id,
+					data.map((slice, index) => ({
+						label: slice.label,
+						show: !hidden.has(index),
+					})),
+				);
+			}
+		},
+		[id, data],
+	);
+
+	const onLegendMouseMove = useCallback(
+		(e: MouseEvent<HTMLDivElement>): void => {
+			const index = getLegendIndex(e);
+			// Don't focus/dim for hidden slices — they aren't on the donut.
+			setActive(index != null && !hiddenIndices.has(index) ? data[index] : null);
+		},
+		[data, hiddenIndices],
+	);
+
+	// Marker click toggles just that slice on/off; label click isolates it
+	// (clicking the isolated one again resets to all) — mirrors the uPlot legend.
+	const onLegendClick = useCallback(
+		(e: MouseEvent<HTMLDivElement>): void => {
+			const index = getLegendIndex(e);
+			if (index == null) {
+				return;
+			}
+			const isMarker = (e.target as HTMLElement).dataset.isLegendMarker;
+
+			if (isMarker) {
+				const next = new Set(hiddenIndices);
+				if (next.has(index)) {
+					next.delete(index);
+				} else {
+					next.add(index);
+				}
+				applyHidden(next);
+				return;
+			}
+
+			const isReset = isolatedIndexRef.current === index;
+			isolatedIndexRef.current = isReset ? null : index;
+			if (isReset) {
+				applyHidden(new Set());
+				return;
+			}
+			const next = new Set<number>();
+			data.forEach((_, i) => {
+				if (i !== index) {
+					next.add(i);
+				}
+			});
+			applyHidden(next);
+		},
+		[data, hiddenIndices, applyHidden],
+	);
+
+	const onLegendMouseLeave = useCallback((): void => setActive(null), []);
+
+	const focusedIndex = active ? data.indexOf(active) : -1;
+
+	return {
+		active,
+		setActive,
+		visibleData,
+		legendItems,
+		focusedSeriesIndex: focusedIndex >= 0 ? focusedIndex : null,
+		onLegendClick,
+		onLegendMouseMove,
+		onLegendMouseLeave,
+	};
+}

frontend/src/container/InfraMonitoringK8s/Deployments/constants.ts

@@ -72,7 +72,7 @@ export const deploymentWidgetInfo = [
 		yAxisUnit: '',
 	},
 	{
-		title: 'Memory usage, request, limits)',
+		title: 'Memory usage, request, limits',
 		yAxisUnit: 'bytes',
 	},
 	{

frontend/src/container/InfraMonitoringK8s/Jobs/constants.ts

@@ -69,7 +69,7 @@ export const jobWidgetInfo = [
 		yAxisUnit: '',
 	},
 	{
-		title: 'Memory usage, request, limits',
+		title: 'Memory Usage',
 		yAxisUnit: 'bytes',
 	},
 	{

frontend/src/container/InfraMonitoringK8s/Namespaces/constants.ts

@@ -703,7 +703,7 @@ export const getNamespaceMetricsQueryPayload = (
 							],
 							having: [],
 							legend: `{{${k8sPodNameKey}}}`,
-							limit: 20,
+							limit: 10,
 							orderBy: [],
 							queryName: 'A',
 							reduceTo: ReduceOperators.AVG,
@@ -1014,8 +1014,8 @@ export const getNamespaceMetricsQueryPayload = (
 										id: '5f2a55c5',
 										key: {
 											dataType: DataTypes.String,
-											id: k8sStatefulsetNameKey,
-											key: k8sStatefulsetNameKey,
+											id: k8sNamespaceNameKey,
+											key: k8sNamespaceNameKey,
 											type: 'tag',
 										},
 										op: '=',

frontend/src/container/InfraMonitoringK8s/Volumes/constants.ts

@@ -317,9 +317,9 @@ export const getVolumeMetricsQueryPayload = (
 						{
 							aggregateAttribute: {
 								dataType: DataTypes.Float64,
-								id: 'k8s_volume_inodes_used--float64----true',
+								id: 'k8s_volume_inodes_used--float64--Gauge--true',
 								key: k8sVolumeInodesUsedKey,
-								type: '',
+								type: 'Gauge',
 							},
 							aggregateOperator: 'avg',
 							dataSource: DataSource.METRICS,
@@ -409,9 +409,9 @@ export const getVolumeMetricsQueryPayload = (
 						{
 							aggregateAttribute: {
 								dataType: DataTypes.Float64,
-								id: 'k8s_volume_inodes--float64----true',
+								id: 'k8s_volume_inodes--float64--Gauge--true',
 								key: k8sVolumeInodesKey,
-								type: '',
+								type: 'Gauge',
 							},
 							aggregateOperator: 'avg',
 							dataSource: DataSource.METRICS,
@@ -501,9 +501,9 @@ export const getVolumeMetricsQueryPayload = (
 						{
 							aggregateAttribute: {
 								dataType: DataTypes.Float64,
-								id: 'k8s_volume_inodes_free--float64----true',
+								id: 'k8s_volume_inodes_free--float64--Gauge--true',
 								key: k8sVolumeInodesFreeKey,
-								type: '',
+								type: 'Gauge',
 							},
 							aggregateOperator: 'avg',
 							dataSource: DataSource.METRICS,

frontend/src/container/LogDetailedView/InfraMetrics/constants.ts

@@ -1619,6 +1619,9 @@ export const getHostQueryPayload = (
 	const diskOpTimeKey = dotMetricsEnabled
 		? 'system.disk.operation_time'
 		: 'system_disk_operation_time';
+	const diskOpsKey = dotMetricsEnabled
+		? 'system.disk.operations'
+		: 'system_disk_operations';
 	const diskPendingKey = dotMetricsEnabled
 		? 'system.disk.pending_operations'
 		: 'system_disk_pending_operations';
@@ -2375,9 +2378,24 @@ export const getHostQueryPayload = (
 								op: 'AND',
 							},
 							functions: [],
-							groupBy: [],
+							groupBy: [
+								{
+									dataType: DataTypes.String,
+									id: 'direction--string--tag--false',
+
+									key: 'direction',
+									type: 'tag',
+								},
+								{
+									dataType: DataTypes.String,
+									id: 'device--string--tag--false',
+
+									key: 'device',
+									type: 'tag',
+								},
+							],
 							having: [],
-							legend: 'system disk io',
+							legend: '{{device}}::{{direction}}',
 							limit: null,
 							orderBy: [],
 							queryName: 'A',
@@ -2409,9 +2427,9 @@ export const getHostQueryPayload = (
 						{
 							aggregateAttribute: {
 								dataType: DataTypes.Float64,
-								id: 'system_disk_operation_time--float64--Sum--true',
+								id: 'system_disk_operations--float64--Sum--true',
 
-								key: diskOpTimeKey,
+								key: diskOpsKey,
 								type: 'Sum',
 							},
 							aggregateOperator: 'rate',
@@ -2421,7 +2439,7 @@ export const getHostQueryPayload = (
 							filters: {
 								items: [
 									{
-										id: 'diskop_f1',
+										id: 'diskops_f1',
 										key: {
 											dataType: DataTypes.String,
 											id: 'host_name--string--tag--false',
@@ -2454,7 +2472,7 @@ export const getHostQueryPayload = (
 							],
 							having: [
 								{
-									columnName: `SUM(${diskOpTimeKey})`,
+									columnName: `SUM(${diskOpsKey})`,
 									op: '>',
 									value: 0,
 								},
@@ -2557,6 +2575,88 @@ export const getHostQueryPayload = (
 			start,
 			end,
 		},
+		{
+			selectedTime: 'GLOBAL_TIME',
+			graphType: PANEL_TYPES.TIME_SERIES,
+			query: {
+				builder: {
+					queryData: [
+						{
+							aggregateAttribute: {
+								dataType: DataTypes.Float64,
+								id: 'system_disk_operation_time--float64--Sum--true',
+
+								key: diskOpTimeKey,
+								type: 'Sum',
+							},
+							aggregateOperator: 'rate',
+							dataSource: DataSource.METRICS,
+							disabled: false,
+							expression: 'A',
+							filters: {
+								items: [
+									{
+										id: 'diskoptime_f1',
+										key: {
+											dataType: DataTypes.String,
+											id: 'host_name--string--tag--false',
+
+											key: hostNameKey,
+											type: 'tag',
+										},
+										op: '=',
+										value: hostName,
+									},
+								],
+								op: 'AND',
+							},
+							functions: [],
+							groupBy: [
+								{
+									dataType: DataTypes.String,
+									id: 'device--string--tag--false',
+
+									key: 'device',
+									type: 'tag',
+								},
+								{
+									dataType: DataTypes.String,
+									id: 'direction--string--tag--false',
+
+									key: 'direction',
+									type: 'tag',
+								},
+							],
+							having: [
+								{
+									columnName: `SUM(${diskOpTimeKey})`,
+									op: '>',
+									value: 0,
+								},
+							],
+							legend: '{{device}}::{{direction}}',
+							limit: null,
+							orderBy: [],
+							queryName: 'A',
+							reduceTo: ReduceOperators.AVG,
+							spaceAggregation: 'sum',
+							stepInterval: 60,
+							timeAggregation: 'rate',
+						},
+					],
+					queryFormulas: [],
+					queryTraceOperator: [],
+				},
+				clickhouse_sql: [{ disabled: false, legend: '', name: 'A', query: '' }],
+				id: 'a8b3d2e1-4f5c-4a6b-9c8d-7e2f1a0b3c4f',
+				promql: [{ disabled: false, legend: '', name: 'A', query: '' }],
+				queryType: EQueryType.QUERY_BUILDER,
+			},
+			variables: {},
+			formatForWeb: false,
+			start,
+			end,
+		},
 	];
 };
 
@@ -2631,5 +2731,5 @@ export const hostWidgetInfo = [
 	{ title: 'System disk io (bytes transferred)', yAxisUnit: 'bytes' },
 	{ title: 'System disk operations/s', yAxisUnit: 'short' },
 	{ title: 'Queue size', yAxisUnit: 'short' },
-	{ title: 'Disk operations time', yAxisUnit: 's' },
+	{ title: 'System disk operation time/s', yAxisUnit: 's' },
 ];

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

@@ -62,6 +62,7 @@ function Explorer(): JSX.Element {
 		handleSetQueryData,
 		redirectWithQueryBuilderData,
 	} = useQueryBuilder();
+
 	const { safeNavigate } = useSafeNavigate();
 	const { handleExplorerTabChange } = useHandleExplorerTabChange();
 	const isAIAssistantEnabled = useIsAIAssistantEnabled();

frontend/src/container/OrganizationSettings/AuthDomain/CreateEdit/CreateEdit.tsx

@@ -96,14 +96,28 @@ function CreateOrEdit(props: CreateOrEditProps): JSX.Element {
 			return undefined;
 		}
 
-		const { domainToAdminEmailList, ...rest } = config;
+		const {
+			domainToAdminEmailList,
+			allowedGroups,
+			serviceAccountJson,
+			domainToAdminEmail: _domainToAdminEmail,
+			fetchTransitiveGroupMembership,
+			...rest
+		} = config;
 		const domainToAdminEmail = convertDomainMappingsToRecord(
 			domainToAdminEmailList,
 		);
 
 		return {
 			...rest,
-			domainToAdminEmail: domainToAdminEmail ?? {},
+			...(rest.fetchGroups
+				? {
+						allowedGroups,
+						serviceAccountJson,
+						domainToAdminEmail: domainToAdminEmail ?? {},
+						fetchTransitiveGroupMembership,
+					}
+				: { domainToAdminEmail: {} }),
 		};
 	}, [form]);
 
@@ -129,7 +143,7 @@ function CreateOrEdit(props: CreateOrEditProps): JSX.Element {
 
 		return {
 			...rest,
-			groupMappings: groupMappings ?? {},
+			groupMappings: rest.useRoleAttribute ? undefined : (groupMappings ?? {}),
 		};
 	}, [form]);
 

frontend/src/container/OrganizationSettings/AuthDomain/__tests__/CreateEdit.sanitization.test.tsx

@@ -0,0 +1,195 @@
+import { fireEvent, render, screen, waitFor } from 'tests/test-utils';
+import { rest, server } from 'mocks-server/server';
+import { AuthtypesGettableAuthDomainDTO } from 'api/generated/services/sigNoz.schemas';
+
+import CreateEdit from '../CreateEdit/CreateEdit';
+import {
+	AUTH_DOMAINS_UPDATE_ENDPOINT,
+	mockDomainWithRoleMapping,
+	mockGoogleAuthDomain,
+	mockGoogleAuthWithWorkspaceGroups,
+	mockOidcWithClaimMapping,
+	mockSamlWithAttributeMapping,
+	mockUpdateSuccessResponse,
+} from './mocks';
+
+// @signozhq/ui/button internal effects block form.validateFields() in tests
+jest.mock('@signozhq/ui/button', () => ({
+	...jest.requireActual('@signozhq/ui/button'),
+	Button: ({
+		children,
+		onClick,
+		loading,
+		disabled,
+		'aria-label': ariaLabel,
+		prefix,
+		suffix,
+	}: {
+		children?: React.ReactNode;
+		onClick?: React.MouseEventHandler<HTMLButtonElement>;
+		loading?: boolean;
+		disabled?: boolean;
+		'aria-label'?: string;
+		prefix?: React.ReactNode;
+		suffix?: React.ReactNode;
+	}) => (
+		<button
+			type="button"
+			onClick={onClick}
+			disabled={disabled || loading}
+			aria-label={ariaLabel}
+		>
+			{prefix}
+			{children}
+			{suffix}
+		</button>
+	),
+}));
+
+type SavedPayload = {
+	config: {
+		googleAuthConfig?: Record<string, unknown>;
+		samlConfig?: Record<string, unknown>;
+		oidcConfig?: Record<string, unknown>;
+		roleMapping?: Record<string, unknown>;
+	};
+};
+
+async function submitForm(
+	record: AuthtypesGettableAuthDomainDTO,
+): Promise<SavedPayload> {
+	const requests: SavedPayload[] = [];
+
+	server.use(
+		rest.put(AUTH_DOMAINS_UPDATE_ENDPOINT, async (req, res, ctx) => {
+			requests.push((await req.json()) as SavedPayload);
+			return res(ctx.status(200), ctx.json(mockUpdateSuccessResponse));
+		}),
+	);
+
+	render(<CreateEdit isCreate={false} record={record} onClose={jest.fn()} />);
+	fireEvent.click(screen.getByRole('button', { name: /save changes/i }));
+	await waitFor(() => expect(requests).toHaveLength(1));
+
+	return requests[0];
+}
+
+describe('CreateEdit — payload sanitization', () => {
+	afterEach(() => server.resetHandlers());
+
+	describe('Google Auth', () => {
+		it('sends core fields and omits workspace fields when fetchGroups is not set', async () => {
+			const payload = await submitForm(mockGoogleAuthDomain);
+
+			const g = payload.config.googleAuthConfig;
+			expect(g?.clientId).toBe('test-client-id');
+			expect(g?.clientSecret).toBe('test-client-secret');
+			expect(g?.allowedGroups).toBeUndefined();
+			expect(g?.serviceAccountJson).toBeUndefined();
+			expect(g?.fetchTransitiveGroupMembership).toBeUndefined();
+			expect(g?.domainToAdminEmail).toStrictEqual({});
+		});
+
+		it('strips workspace fields when fetchGroups is false', async () => {
+			const payload = await submitForm({
+				...mockGoogleAuthWithWorkspaceGroups,
+				config: {
+					...mockGoogleAuthWithWorkspaceGroups.config,
+					googleAuthConfig: {
+						...mockGoogleAuthWithWorkspaceGroups.config?.googleAuthConfig,
+						fetchGroups: false,
+					},
+				},
+			});
+
+			const g = payload.config.googleAuthConfig;
+			expect(g?.fetchGroups).toBe(false);
+			expect(g?.allowedGroups).toBeUndefined();
+			expect(g?.serviceAccountJson).toBeUndefined();
+			expect(g?.fetchTransitiveGroupMembership).toBeUndefined();
+			expect(g?.domainToAdminEmail).toStrictEqual({});
+		});
+
+		it('includes all workspace fields when fetchGroups is true', async () => {
+			const payload = await submitForm(mockGoogleAuthWithWorkspaceGroups);
+
+			const g = payload.config.googleAuthConfig;
+			expect(g?.fetchGroups).toBe(true);
+			expect(g?.serviceAccountJson).toBe('{"type": "service_account"}');
+			expect(g?.fetchTransitiveGroupMembership).toBe(true);
+			expect(g?.allowedGroups).toStrictEqual([
+				'allowed-group-1',
+				'allowed-group-2',
+			]);
+			expect(g?.domainToAdminEmail).toStrictEqual({
+				'google-groups.com': 'admin@google-groups.com',
+			});
+		});
+	});
+
+	describe('SAML', () => {
+		it('sends core and attributeMapping fields', async () => {
+			const payload = await submitForm(mockSamlWithAttributeMapping);
+
+			const s = payload.config.samlConfig;
+			expect(s?.samlIdp).toBe('https://idp.saml-attrs.com/sso');
+			expect(s?.samlEntity).toBe('urn:saml-attrs:idp');
+			expect(s?.samlCert).toBe('MOCK_CERTIFICATE_ATTRS');
+			expect(s?.insecureSkipAuthNRequestsSigned).toBe(true);
+
+			const attr = s?.attributeMapping as Record<string, unknown>;
+			expect(attr?.name).toBe('user_display_name');
+			expect(attr?.groups).toBe('member_of');
+			expect(attr?.role).toBe('signoz_role');
+		});
+	});
+
+	describe('OIDC', () => {
+		it('sends all fields including claimMapping', async () => {
+			const payload = await submitForm(mockOidcWithClaimMapping);
+
+			const o = payload.config.oidcConfig;
+			expect(o?.issuer).toBe('https://oidc.claims.com');
+			expect(o?.issuerAlias).toBe('https://alias.claims.com');
+			expect(o?.clientId).toBe('claims-client-id');
+			expect(o?.clientSecret).toBe('claims-client-secret');
+			expect(o?.insecureSkipEmailVerified).toBe(true);
+			expect(o?.getUserInfo).toBe(true);
+
+			const claim = o?.claimMapping as Record<string, unknown>;
+			expect(claim?.email).toBe('user_email');
+			expect(claim?.name).toBe('display_name');
+			expect(claim?.groups).toBe('user_groups');
+			expect(claim?.role).toBe('user_role');
+		});
+	});
+
+	describe('Role Mapping', () => {
+		it('strips groupMappings when useRoleAttribute is true', async () => {
+			const payload = await submitForm({
+				...mockDomainWithRoleMapping,
+				config: {
+					...mockDomainWithRoleMapping.config,
+					roleMapping: {
+						...mockDomainWithRoleMapping.config?.roleMapping,
+						useRoleAttribute: true,
+					},
+				},
+			});
+
+			expect(payload.config.roleMapping?.useRoleAttribute).toBe(true);
+			expect(payload.config.roleMapping?.groupMappings).toBeUndefined();
+		});
+
+		it('sends groupMappings when useRoleAttribute is false', async () => {
+			const payload = await submitForm(mockDomainWithRoleMapping);
+
+			expect(payload.config.roleMapping?.useRoleAttribute).toBe(false);
+			expect(payload.config.roleMapping?.groupMappings).toStrictEqual({
+				'admin-group': 'ADMIN',
+				'dev-team': 'EDITOR',
+				viewers: 'VIEWER',
+			});
+		});
+	});
+});

frontend/src/container/QueryBuilder/filters/QueryBuilderSearch/style.ts

@@ -22,11 +22,12 @@ export const StyledCheckOutlined = styled(Check)`
 	float: right;
 `;
 
-export const TagContainer = styled(Badge)`
+export const TagContainer = styled(Badge).attrs({
+	color: 'secondary',
+	variant: 'outline',
+})`
 	&&& {
 		display: flex;
-		border-radius: 3px;
-		padding: 0.1rem 0.2rem;
 		font-weight: 300;
 		font-size: 0.6rem;
 	}
@@ -38,4 +39,5 @@ export const TagLabel = styled.span`
 
 export const TagValue = styled.span`
 	text-transform: capitalize;
+	font-weight: 400;
 `;

frontend/src/lib/recentQueries/constants.ts

@@ -0,0 +1,5 @@
+export const STORAGE_KEY_PREFIX = 'qb_recent_v1';
+export const STORAGE_VERSION = 1;
+// Maximum entries kept per (signal, source) bucket. Larger than the UI's
+// RECENTS_DISPLAY_CAP so deleting a visible entry surfaces an older one.
+export const MAX_ENTRIES = 10;

frontend/src/lib/recentQueries/getRecentQueries.test.ts

@@ -0,0 +1,51 @@
+import * as store from './recentQueriesStore';
+import { getRecentQueries } from './getRecentQueries';
+
+describe('getRecentQueries', () => {
+	beforeEach(() => {
+		store.useRecentQueriesStore.setState({ buckets: {} });
+		localStorage.clear();
+	});
+
+	it('returns the entries for a (signal, source) bucket', () => {
+		store.save({
+			signal: 'logs',
+			filter: { expression: "severity_text = 'ERROR'" },
+		});
+
+		const entries = getRecentQueries('logs', '');
+		expect(entries).toHaveLength(1);
+		expect(entries[0].filter.expression).toBe("severity_text = 'ERROR'");
+	});
+
+	it('returns an empty array for a bucket with no entries', () => {
+		expect(getRecentQueries('logs', '')).toHaveLength(0);
+	});
+
+	it('reads the latest entries on each call (non-subscribing)', () => {
+		expect(getRecentQueries('logs', '')).toHaveLength(0);
+
+		store.save({
+			signal: 'logs',
+			filter: { expression: "severity_text = 'ERROR'" },
+		});
+
+		expect(getRecentQueries('logs', '')).toHaveLength(1);
+	});
+
+	it('partitions by signal and source', () => {
+		store.save({
+			signal: 'logs',
+			filter: { expression: "severity_text = 'ERROR'" },
+		});
+		store.save({
+			signal: 'metrics',
+			source: 'meter',
+			filter: { expression: 'cpu_usage > 80' },
+		});
+
+		expect(getRecentQueries('logs', '')).toHaveLength(1);
+		expect(getRecentQueries('metrics', 'meter')).toHaveLength(1);
+		expect(getRecentQueries('metrics', '')).toHaveLength(0);
+	});
+});

frontend/src/lib/recentQueries/getRecentQueries.ts

@@ -0,0 +1,14 @@
+import type { SignalType } from 'types/api/v5/queryRange';
+
+import * as store from './recentQueriesStore';
+import type { RecentQueryEntry } from './types';
+
+// Non-subscribing read of recent searches for a (signal, source) bucket.
+// Deliberately not the zustand hook — subscribing would reconfigure CodeMirror
+// and close the open completion popup on every store change.
+export function getRecentQueries(
+	signal: SignalType,
+	source: string,
+): RecentQueryEntry[] {
+	return store.list(signal, source);
+}

frontend/src/lib/recentQueries/normalize.test.ts

@@ -0,0 +1,100 @@
+import { normalizeFilterExpression } from './normalize';
+
+describe('normalizeFilterExpression', () => {
+	it('returns empty string for empty input', () => {
+		expect(normalizeFilterExpression('')).toBe('');
+	});
+
+	it('returns empty string for whitespace-only input', () => {
+		expect(normalizeFilterExpression('   \t  ')).toBe('');
+	});
+
+	it('strips whitespace around operators', () => {
+		expect(normalizeFilterExpression('  a = 1  ')).toBe('a=1');
+		expect(normalizeFilterExpression('a   =    1')).toBe('a=1');
+		expect(normalizeFilterExpression('a=1')).toBe('a=1');
+	});
+
+	it('lowercases AND / OR / NOT outside quotes', () => {
+		expect(normalizeFilterExpression('A AND B OR NOT C')).toBe('AandBornotC');
+	});
+
+	it('lowercases IN / LIKE / ILIKE / CONTAINS', () => {
+		expect(normalizeFilterExpression('host IN [1, 2] AND name LIKE "foo"')).toBe(
+			'hostin[1,2]andnamelike"foo"',
+		);
+	});
+
+	it('lowercases REGEXP', () => {
+		expect(normalizeFilterExpression('path REGEXP "foo"')).toBe(
+			'pathregexp"foo"',
+		);
+		expect(normalizeFilterExpression('path REGEXP "foo"')).toBe(
+			normalizeFilterExpression('path regexp "foo"'),
+		);
+	});
+
+	it('lowercases HAS / HASANY / HASALL / HASTOKEN function names', () => {
+		expect(normalizeFilterExpression('HAS(tags, "x")')).toBe(
+			normalizeFilterExpression('has(tags, "x")'),
+		);
+		expect(normalizeFilterExpression('HASANY(tags, ["a","b"])')).toBe(
+			normalizeFilterExpression('hasAny(tags, ["a","b"])'),
+		);
+		expect(normalizeFilterExpression('HASALL(tags, ["a","b"])')).toBe(
+			normalizeFilterExpression('hasAll(tags, ["a","b"])'),
+		);
+		expect(normalizeFilterExpression('HASTOKEN(msg, "err")')).toBe(
+			normalizeFilterExpression('hasToken(msg, "err")'),
+		);
+	});
+
+	it('lowercases TRUE / FALSE boolean literals', () => {
+		expect(normalizeFilterExpression('active = TRUE')).toBe(
+			normalizeFilterExpression('active = true'),
+		);
+		expect(normalizeFilterExpression('active = FALSE')).toBe(
+			normalizeFilterExpression('active = false'),
+		);
+	});
+
+	it('preserves whitespace and casing inside single-quoted strings', () => {
+		expect(normalizeFilterExpression("a = 'X  Y'")).toBe("a='X  Y'");
+	});
+
+	it('preserves whitespace and casing inside double-quoted strings', () => {
+		expect(normalizeFilterExpression('a   =   "X  Y"')).toBe('a="X  Y"');
+	});
+
+	it('does not lowercase keyword-looking substrings inside quotes', () => {
+		expect(normalizeFilterExpression("msg = 'AND ERROR'")).toBe(
+			"msg='AND ERROR'",
+		);
+	});
+
+	it('handles escaped quotes inside strings', () => {
+		expect(normalizeFilterExpression("msg = 'a\\'b' AND x = 1")).toBe(
+			"msg='a\\'b'andx=1",
+		);
+	});
+
+	it('treats two formattings of the same expression as identical', () => {
+		const a = normalizeFilterExpression(
+			'service.name = "frontend" AND severity = error',
+		);
+		const b = normalizeFilterExpression(
+			'service.name="frontend"   and  severity=error',
+		);
+		expect(a).toBe(b);
+	});
+
+	it('preserves unquoted value casing (treats them as identifiers)', () => {
+		expect(normalizeFilterExpression('status = OK')).toBe('status=OK');
+	});
+
+	it('handles mixed quotes in one expression', () => {
+		expect(normalizeFilterExpression(`a = 'X' AND b = "Y"`)).toBe(
+			`a='X'andb="Y"`,
+		);
+	});
+});

frontend/src/lib/recentQueries/normalize.ts

@@ -0,0 +1,56 @@
+import {
+	OPERATORS,
+	QUERY_BUILDER_FUNCTIONS,
+	TRACE_OPERATOR_OPERATORS,
+} from 'constants/antlrQueryConstants';
+
+// Reserved keywords sourced from the ANTLR grammar constants so this list stays
+// in sync with the parser. `\b` prevents partial matches inside identifiers
+// (e.g. `OR` inside `originator`). `TRUE`/`FALSE` are BOOL literals, included
+// so case variants of boolean values also dedup.
+const WORD_KEYWORDS = [
+	...Object.keys(OPERATORS).filter((k) => /^[A-Z]+$/.test(k)),
+	...Object.keys(TRACE_OPERATOR_OPERATORS).filter((k) => /^[A-Z]+$/.test(k)),
+	...Object.values(QUERY_BUILDER_FUNCTIONS),
+	'TRUE',
+	'FALSE',
+];
+
+const KEYWORDS_RE = new RegExp(`\\b(${WORD_KEYWORDS.join('|')})\\b`, 'gi');
+
+// Matches single- or double-quoted string literals, supporting escaped quotes
+// (e.g. `'it\'s'` or `"a \" b"`). We preserve quoted spans verbatim during
+// normalisation so user-meaningful whitespace and casing inside string values
+// stays intact: `name = "Foo Bar"` must not collapse to `name="foobar"`.
+const QUOTED_RE = /'(?:\\.|[^'\\])*'|"(?:\\.|[^"\\])*"/g;
+
+// Lowercases reserved keywords and strips ALL whitespace from the unquoted regions
+// of the input. Keywords are normalised so casing variants dedup; whitespace is
+// dropped so formatting variants (`a=1` vs `a = 1`) dedup too.
+function processOutsideQuotes(s: string): string {
+	return s.replace(KEYWORDS_RE, (m) => m.toLowerCase()).replace(/\s+/g, '');
+}
+
+// Produces a canonical form of a filter expression suitable for dedup-key derivation.
+// Walks the input alternating between unquoted regions (where we normalise keywords
+// and whitespace) and quoted regions (which we copy verbatim).
+export function normalizeFilterExpression(input: string): string {
+	if (!input) {
+		return '';
+	}
+
+	let result = '';
+	let lastIndex = 0;
+	QUOTED_RE.lastIndex = 0;
+
+	let match = QUOTED_RE.exec(input);
+	while (match !== null) {
+		result += processOutsideQuotes(input.slice(lastIndex, match.index));
+		result += match[0];
+		lastIndex = QUOTED_RE.lastIndex;
+		match = QUOTED_RE.exec(input);
+	}
+	result += processOutsideQuotes(input.slice(lastIndex));
+
+	return result.trim();
+}

frontend/src/lib/recentQueries/recentQueriesStore.test.ts

@@ -0,0 +1,247 @@
+import { MAX_ENTRIES } from './constants';
+import * as store from './recentQueriesStore';
+import type { RecentQueryInput } from './recentQueriesStore';
+import type { RecentQueryEntry } from './types';
+
+const baseInput = (
+	overrides: Partial<RecentQueryInput> = {},
+): RecentQueryInput => ({
+	signal: 'logs',
+	filter: { expression: "service.name = 'frontend'" },
+	...overrides,
+});
+
+function saveOrThrow(input: RecentQueryInput): RecentQueryEntry {
+	const saved = store.save(input);
+	if (!saved) {
+		throw new Error('expected save to return an entry');
+	}
+	return saved;
+}
+
+describe('recentQueries store', () => {
+	beforeEach(() => {
+		store.useRecentQueriesStore.setState({ buckets: {} });
+		localStorage.clear();
+	});
+
+	describe('save + list', () => {
+		it('saves an entry and lists it', () => {
+			store.save(baseInput());
+			const entries = store.list('logs');
+			expect(entries).toHaveLength(1);
+			expect(entries[0].filter.expression).toBe("service.name = 'frontend'");
+			expect(entries[0].id).toBeTruthy();
+			expect(entries[0].lastUsedAt).toBeGreaterThan(0);
+		});
+
+		it('does not save when the filter expression is empty', () => {
+			const result = store.save(baseInput({ filter: { expression: '' } }));
+			expect(result).toBeNull();
+			expect(store.list('logs')).toHaveLength(0);
+		});
+
+		it('does not save when the filter expression is whitespace only', () => {
+			const result = store.save(baseInput({ filter: { expression: '   ' } }));
+			expect(result).toBeNull();
+			expect(store.list('logs')).toHaveLength(0);
+		});
+	});
+
+	describe('LRU ordering', () => {
+		it('places the most recently saved entry at the front', () => {
+			store.save(baseInput({ filter: { expression: "severity_text = 'ERROR'" } }));
+			store.save(baseInput({ filter: { expression: 'http.status_code >= 500' } }));
+			store.save(baseInput({ filter: { expression: 'attempt = 1' } }));
+
+			const entries = store.list('logs');
+			expect(entries.map((e) => e.filter.expression)).toStrictEqual([
+				'attempt = 1',
+				'http.status_code >= 500',
+				"severity_text = 'ERROR'",
+			]);
+		});
+
+		it('re-saving an existing filter bumps it to the front', () => {
+			store.save(baseInput({ filter: { expression: "severity_text = 'ERROR'" } }));
+			store.save(baseInput({ filter: { expression: 'http.status_code >= 500' } }));
+			store.save(baseInput({ filter: { expression: "severity_text = 'ERROR'" } }));
+
+			const entries = store.list('logs');
+			expect(entries).toHaveLength(2);
+			expect(entries.map((e) => e.filter.expression)).toStrictEqual([
+				"severity_text = 'ERROR'",
+				'http.status_code >= 500',
+			]);
+		});
+	});
+
+	describe('dedup', () => {
+		it('treats formatting variations of the same filter as one entry', () => {
+			store.save(
+				baseInput({
+					filter: { expression: "severity_text = 'ERROR' AND attempt = 1" },
+				}),
+			);
+			store.save(
+				baseInput({
+					filter: { expression: "severity_text='ERROR'   and    attempt=1" },
+				}),
+			);
+
+			expect(store.list('logs')).toHaveLength(1);
+		});
+	});
+
+	describe('signal partitioning', () => {
+		it('saves to the right bucket per signal', () => {
+			store.save(
+				baseInput({
+					signal: 'logs',
+					filter: { expression: "severity_text = 'ERROR'" },
+				}),
+			);
+			store.save(
+				baseInput({
+					signal: 'traces',
+					filter: { expression: "service.name = 'orders-api'" },
+				}),
+			);
+			store.save(
+				baseInput({
+					signal: 'metrics',
+					filter: { expression: 'cpu_usage > 80' },
+				}),
+			);
+
+			expect(store.list('logs')).toHaveLength(1);
+			expect(store.list('traces')).toHaveLength(1);
+			expect(store.list('metrics')).toHaveLength(1);
+			expect(store.list('logs')[0].filter.expression).toBe(
+				"severity_text = 'ERROR'",
+			);
+			expect(store.list('traces')[0].filter.expression).toBe(
+				"service.name = 'orders-api'",
+			);
+			expect(store.list('metrics')[0].filter.expression).toBe('cpu_usage > 80');
+		});
+
+		it('does not leak between signals on dedup', () => {
+			store.save(
+				baseInput({
+					signal: 'logs',
+					filter: { expression: "service.name = 'frontend'" },
+				}),
+			);
+			store.save(
+				baseInput({
+					signal: 'traces',
+					filter: { expression: "service.name = 'frontend'" },
+				}),
+			);
+
+			expect(store.list('logs')).toHaveLength(1);
+			expect(store.list('traces')).toHaveLength(1);
+		});
+	});
+
+	describe('LRU cap', () => {
+		it('caps the bucket at MAX_ENTRIES and evicts the oldest', () => {
+			const total = MAX_ENTRIES + 1;
+			for (let i = 0; i < total; i += 1) {
+				store.save(baseInput({ filter: { expression: `attempt = ${i}` } }));
+			}
+
+			const entries = store.list('logs');
+			expect(entries).toHaveLength(MAX_ENTRIES);
+			expect(entries[0].filter.expression).toBe(`attempt = ${total - 1}`);
+			expect(entries.some((e) => e.filter.expression === 'attempt = 0')).toBe(
+				false,
+			);
+		});
+	});
+
+	describe('remove', () => {
+		it('removes an entry by id', () => {
+			store.save(baseInput({ filter: { expression: "severity_text = 'ERROR'" } }));
+			const saved = saveOrThrow(
+				baseInput({ filter: { expression: 'http.status_code >= 500' } }),
+			);
+			store.remove(saved.id, 'logs');
+
+			const entries = store.list('logs');
+			expect(entries).toHaveLength(1);
+			expect(entries[0].filter.expression).toBe("severity_text = 'ERROR'");
+		});
+
+		it('is a no-op when the id does not exist', () => {
+			store.save(baseInput({ filter: { expression: "severity_text = 'ERROR'" } }));
+			store.remove('does-not-exist', 'logs');
+			expect(store.list('logs')).toHaveLength(1);
+		});
+
+		it('does not touch other signals', () => {
+			const logsEntry = saveOrThrow(
+				baseInput({
+					signal: 'logs',
+					filter: { expression: "service.name = 'frontend'" },
+				}),
+			);
+			store.save(
+				baseInput({
+					signal: 'traces',
+					filter: { expression: "service.name = 'frontend'" },
+				}),
+			);
+
+			store.remove(logsEntry.id, 'logs');
+
+			expect(store.list('logs')).toHaveLength(0);
+			expect(store.list('traces')).toHaveLength(1);
+		});
+	});
+
+	describe('persistence', () => {
+		it('reads back the same entries after the in-memory state is reset', () => {
+			store.save(baseInput({ filter: { expression: "severity_text = 'ERROR'" } }));
+			store.save(baseInput({ filter: { expression: 'http.status_code >= 500' } }));
+
+			store.useRecentQueriesStore.setState({ buckets: {} });
+
+			const entries = store.list('logs');
+			expect(entries.map((e) => e.filter.expression)).toStrictEqual([
+				'http.status_code >= 500',
+				"severity_text = 'ERROR'",
+			]);
+		});
+	});
+
+	describe('reactive subscription via zustand', () => {
+		it('notifies zustand subscribers on save', () => {
+			const cb = jest.fn();
+			const unsubscribe = store.useRecentQueriesStore.subscribe(cb);
+			store.save(baseInput({ filter: { expression: "severity_text = 'ERROR'" } }));
+			expect(cb).toHaveBeenCalledTimes(1);
+			unsubscribe();
+		});
+
+		it('notifies zustand subscribers on remove', () => {
+			const saved = saveOrThrow(
+				baseInput({ filter: { expression: "severity_text = 'ERROR'" } }),
+			);
+			const cb = jest.fn();
+			const unsubscribe = store.useRecentQueriesStore.subscribe(cb);
+			store.remove(saved.id, 'logs');
+			expect(cb).toHaveBeenCalledTimes(1);
+			unsubscribe();
+		});
+
+		it('stops notifying after unsubscribe', () => {
+			const cb = jest.fn();
+			const unsubscribe = store.useRecentQueriesStore.subscribe(cb);
+			unsubscribe();
+			store.save(baseInput({ filter: { expression: "severity_text = 'ERROR'" } }));
+			expect(cb).not.toHaveBeenCalled();
+		});
+	});
+});

frontend/src/lib/recentQueries/recentQueriesStore.ts

@@ -0,0 +1,144 @@
+import get from 'api/browser/localstorage/get';
+import set from 'api/browser/localstorage/set';
+import type { SignalType } from 'types/api/v5/queryRange';
+import { create } from 'zustand';
+
+import { MAX_ENTRIES, STORAGE_VERSION } from './constants';
+import { normalizeFilterExpression } from './normalize';
+import type { RecentQueriesStoreShape, RecentQueryEntry } from './types';
+import { bucketKey, makeId, normalizeSource, storageKeyFor } from './utils';
+
+// Mirrors parsed localStorage so equal raw strings return the same array ref —
+// preserves Object.is for zustand selector bail-out.
+const persistedBucketCache = new Map<
+	string,
+	{ raw: string; parsed: RecentQueryEntry[] }
+>();
+
+function loadBucketFromStorage(
+	signal: SignalType,
+	source: string,
+): RecentQueryEntry[] | null {
+	const key = bucketKey(signal, source);
+	try {
+		const raw = get(storageKeyFor(signal, source));
+		if (!raw) {
+			persistedBucketCache.delete(key);
+			return null;
+		}
+		const cached = persistedBucketCache.get(key);
+		if (cached && cached.raw === raw) {
+			return cached.parsed;
+		}
+		const parsedShape = JSON.parse(raw) as RecentQueriesStoreShape;
+		if (
+			parsedShape?.version !== STORAGE_VERSION ||
+			!Array.isArray(parsedShape.entries)
+		) {
+			persistedBucketCache.delete(key);
+			return null;
+		}
+		persistedBucketCache.set(key, { raw, parsed: parsedShape.entries });
+		return parsedShape.entries;
+	} catch {
+		persistedBucketCache.delete(key);
+		return null;
+	}
+}
+
+function saveBucketToStorage(
+	signal: SignalType,
+	source: string,
+	entries: RecentQueryEntry[],
+): void {
+	try {
+		const raw = JSON.stringify({ version: STORAGE_VERSION, entries });
+		if (set(storageKeyFor(signal, source), raw)) {
+			persistedBucketCache.set(bucketKey(signal, source), {
+				raw,
+				parsed: entries,
+			});
+		}
+	} catch {
+		// Ignore storage errors (e.g. quota exceeded, JSON.stringify failure).
+	}
+}
+
+export type RecentQueryInput = Omit<
+	RecentQueryEntry,
+	'id' | 'lastUsedAt' | 'source'
+> & {
+	source?: string;
+};
+
+type RecentQueriesState = {
+	buckets: Record<string, RecentQueryEntry[]>;
+	save: (entry: RecentQueryInput) => RecentQueryEntry | null;
+	remove: (id: string, signal: SignalType, source?: string) => void;
+};
+
+export const useRecentQueriesStore = create<RecentQueriesState>()(
+	(set, get) => ({
+		buckets: {},
+
+		save: (entry): RecentQueryEntry | null => {
+			const normalized = normalizeFilterExpression(entry.filter.expression);
+			if (!normalized) {
+				return null;
+			}
+			const source = normalizeSource(entry.source);
+			const key = bucketKey(entry.signal, source);
+
+			const current =
+				get().buckets[key] ?? loadBucketFromStorage(entry.signal, source) ?? [];
+			const filtered = current.filter(
+				(e) => normalizeFilterExpression(e.filter.expression) !== normalized,
+			);
+
+			const newEntry: RecentQueryEntry = {
+				...entry,
+				source,
+				id: makeId(entry.signal, source, normalized),
+				lastUsedAt: Date.now(),
+			};
+
+			const next = [newEntry, ...filtered].slice(0, MAX_ENTRIES);
+			set({ buckets: { ...get().buckets, [key]: next } });
+			saveBucketToStorage(entry.signal, source, next);
+			return newEntry;
+		},
+
+		remove: (id, signal, source = ''): void => {
+			const key = bucketKey(signal, source);
+			const current = get().buckets[key] ?? loadBucketFromStorage(signal, source);
+			if (!current) {
+				return;
+			}
+			const next = current.filter((e) => e.id !== id);
+			if (next.length === current.length) {
+				return;
+			}
+			set({ buckets: { ...get().buckets, [key]: next } });
+			saveBucketToStorage(signal, source, next);
+		},
+	}),
+);
+
+// Plain-function wrappers for non-React callers — same pattern as useColumnStore.ts.
+export function save(entry: RecentQueryInput): RecentQueryEntry | null {
+	return useRecentQueriesStore.getState().save(entry);
+}
+
+export function remove(id: string, signal: SignalType, source = ''): void {
+	useRecentQueriesStore.getState().remove(id, signal, source);
+}
+
+// Synchronous bucket read with localStorage fallback for non-React callers.
+export function list(signal: SignalType, source = ''): RecentQueryEntry[] {
+	const key = bucketKey(signal, source);
+	const state = useRecentQueriesStore.getState();
+	if (state.buckets[key]) {
+		return state.buckets[key];
+	}
+	return loadBucketFromStorage(signal, source) ?? [];
+}

frontend/src/lib/recentQueries/saveRecentQuery.test.ts

@@ -0,0 +1,126 @@
+import { EQueryType } from 'types/common/dashboard';
+import { DataSource } from 'types/common/queryBuilder';
+import type {
+	IBuilderQuery,
+	Query,
+} from 'types/api/queryBuilder/queryBuilderData';
+import { validateQuery } from 'utils/queryValidationUtils';
+
+import * as store from './recentQueriesStore';
+import { saveRecentQuery } from './saveRecentQuery';
+
+jest.mock('utils/queryValidationUtils', () => ({
+	validateQuery: jest.fn(),
+}));
+
+const mockedValidateQuery = validateQuery as jest.MockedFunction<
+	typeof validateQuery
+>;
+
+const buildQuery = (overrides: Partial<IBuilderQuery>[] = [{}]): Query => ({
+	queryType: EQueryType.QUERY_BUILDER,
+	promql: [],
+	clickhouse_sql: [],
+	id: 'q1',
+	builder: {
+		queryFormulas: [],
+		queryTraceOperator: [],
+		queryData: overrides.map((o, i) => ({
+			queryName: `Q${i}`,
+			dataSource: DataSource.LOGS,
+			aggregateOperator: 'count',
+			aggregateAttribute: undefined as never,
+			functions: [],
+			filter: { expression: 'service.name = "frontend"' },
+			groupBy: [],
+			expression: `Q${i}`,
+			disabled: false,
+			having: [],
+			limit: null,
+			stepInterval: null,
+			orderBy: [],
+			legend: '',
+			...o,
+		})) as IBuilderQuery[],
+	},
+});
+
+describe('saveRecentQuery', () => {
+	beforeEach(() => {
+		store.useRecentQueriesStore.setState({ buckets: {} });
+		localStorage.clear();
+		mockedValidateQuery.mockReturnValue({
+			isValid: true,
+			message: '',
+			errors: [],
+		});
+	});
+
+	it('saves the query when validation passes', () => {
+		saveRecentQuery(buildQuery());
+
+		const entries = store.list('logs');
+		expect(entries).toHaveLength(1);
+		expect(entries[0].filter.expression).toBe('service.name = "frontend"');
+	});
+
+	it('does not save when validateQuery rejects the expression', () => {
+		mockedValidateQuery.mockReturnValue({
+			isValid: false,
+			message: 'bad',
+			errors: [],
+		});
+
+		saveRecentQuery(buildQuery());
+
+		expect(store.list('logs')).toHaveLength(0);
+	});
+
+	it('does not save a builder query with an empty filter expression', () => {
+		saveRecentQuery(buildQuery([{ filter: { expression: '' } }]));
+
+		expect(store.list('logs')).toHaveLength(0);
+	});
+
+	it('saves each builder query in the composite separately', () => {
+		saveRecentQuery(
+			buildQuery([
+				{
+					dataSource: DataSource.LOGS,
+					filter: { expression: "service.name = 'frontend'" },
+				},
+				{
+					dataSource: DataSource.TRACES,
+					filter: { expression: "service.name = 'orders-api'" },
+				},
+			]),
+		);
+
+		expect(store.list('logs')).toHaveLength(1);
+		expect(store.list('traces')).toHaveLength(1);
+	});
+
+	it('keeps a single entry when the same query is run again', () => {
+		saveRecentQuery(buildQuery());
+		saveRecentQuery(buildQuery());
+
+		expect(store.list('logs')).toHaveLength(1);
+	});
+
+	it('adds a second entry when the filter changes', () => {
+		saveRecentQuery(
+			buildQuery([{ filter: { expression: "severity_text = 'ERROR'" } }]),
+		);
+		saveRecentQuery(
+			buildQuery([{ filter: { expression: 'http.status_code >= 500' } }]),
+		);
+
+		expect(store.list('logs')).toHaveLength(2);
+	});
+
+	it('is a no-op when the query is null', () => {
+		saveRecentQuery(null);
+
+		expect(store.list('logs')).toHaveLength(0);
+	});
+});

frontend/src/lib/recentQueries/saveRecentQuery.ts

@@ -0,0 +1,48 @@
+import type {
+	IBuilderQuery,
+	Query,
+	QueryState,
+} from 'types/api/queryBuilder/queryBuilderData';
+import type { SignalType } from 'types/api/v5/queryRange';
+import { validateQuery } from 'utils/queryValidationUtils';
+
+import * as store from './recentQueriesStore';
+
+function toSignal(dataSource: IBuilderQuery['dataSource']): SignalType | null {
+	if (
+		dataSource === 'logs' ||
+		dataSource === 'traces' ||
+		dataSource === 'metrics'
+	) {
+		return dataSource;
+	}
+	return null;
+}
+
+// Persists each builder query's filter expression as a recent search, partitioned
+// by signal (and source). Call this on an explicit Stage & Run — not on staged-query
+// changes — so page loads, navigation, and correlation redirects don't pollute recents.
+// The store dedups by normalized filter, so re-running a query just bumps it to the front.
+export function saveRecentQuery(
+	query: Query | QueryState | null | undefined,
+): void {
+	const queryData = query?.builder?.queryData ?? [];
+	queryData.forEach((q) => {
+		const expression = q.filter?.expression?.trim();
+		if (!expression) {
+			return;
+		}
+		if (!validateQuery(expression).isValid) {
+			return;
+		}
+		const signal = toSignal(q.dataSource);
+		if (!signal) {
+			return;
+		}
+		store.save({
+			signal,
+			source: q.source ?? '',
+			filter: q.filter ?? { expression: '' },
+		});
+	});
+}

frontend/src/lib/recentQueries/types.ts

@@ -0,0 +1,14 @@
+import type { Filter, SignalType } from 'types/api/v5/queryRange';
+
+export interface RecentQueryEntry {
+	id: string;
+	signal: SignalType;
+	source: string;
+	filter: Filter;
+	lastUsedAt: number;
+}
+
+export interface RecentQueriesStoreShape {
+	version: 1;
+	entries: RecentQueryEntry[];
+}

frontend/src/lib/recentQueries/utils.ts

@@ -0,0 +1,24 @@
+import type { SignalType } from 'types/api/v5/queryRange';
+
+import { STORAGE_KEY_PREFIX } from './constants';
+
+export function normalizeSource(source: string | undefined): string {
+	return source ?? '';
+}
+
+export function bucketKey(signal: SignalType, source: string): string {
+	return `${signal}:${source}`;
+}
+
+export function storageKeyFor(signal: SignalType, source: string): string {
+	return `${STORAGE_KEY_PREFIX}:${bucketKey(signal, source)}`;
+}
+
+// Same (signal, source, normalized filter) ⇒ same id ⇒ upsert.
+export function makeId(
+	signal: SignalType,
+	source: string,
+	normalizedFilter: string,
+): string {
+	return `${signal}|${source}|${normalizedFilter}`;
+}

frontend/src/lib/uPlotV2/components/Legend/Legend.styles.scss

@@ -171,17 +171,18 @@
 	}
 
 	.legend-copy-button {
-		display: none;
-		align-items: center;
-		justify-content: center;
+		// Always laid out (space reserved) but transparent, so revealing it on
+		// hover fades the icon in without reflowing the row / shifting the label.
+		// Shrink the shared icon Button (defaults to a 2rem square) to the
+		// compact legend row via its size tokens.
+		--button-height: auto;
+		--button-width: auto;
+		--button-padding: 2px;
+
+		opacity: 0;
 		flex-shrink: 0;
-		padding: 2px;
-		margin: 0;
-		border: none;
 		color: var(--l2-foreground);
-		cursor: pointer;
 		border-radius: 4px;
-		opacity: 1;
 		transition:
 			opacity 0.15s ease,
 			color 0.15s ease;
@@ -192,9 +193,8 @@
 	}
 
 	&:hover {
-		background: color-mix(in srgb, var(--l1-foreground) 5%, transparent);
+		background: var(--l3-background);
 		.legend-copy-button {
-			display: flex;
 			opacity: 1;
 		}
 	}

frontend/src/lib/uPlotV2/components/Legend/Legend.tsx

@@ -1,39 +1,41 @@
 import { useCallback, useMemo, useRef, useState } from 'react';
 import { VirtuosoGrid } from 'react-virtuoso';
-import { Input, Tooltip as AntdTooltip } from 'antd';
+import { Input } from 'antd';
+import { Button } from '@signozhq/ui/button';
+import { TooltipSimple } from '@signozhq/ui/tooltip';
 import cx from 'classnames';
 import { useCopyToClipboard } from 'hooks/useCopyToClipboard';
 import { LegendItem } from 'lib/uPlotV2/config/types';
-import useLegendsSync from 'lib/uPlotV2/hooks/useLegendsSync';
 import { Check, Copy } from '@signozhq/icons';
 
-import { useLegendActions } from '../../hooks/useLegendActions';
 import { LegendPosition, LegendProps } from '../types';
 
 import './Legend.styles.scss';
 
 export const MAX_LEGEND_WIDTH = 240;
 
+/**
+ * Presentational legend. Renders the supplied `items` (markers + labels, an
+ * optional copy button, and a search box for the RIGHT position) and delegates
+ * all interaction to the container handlers. Source-agnostic — the uPlot
+ * charts feed it via UPlotLegend; Pie feeds it directly.
+ */
 export default function Legend({
-	position = LegendPosition.BOTTOM,
-	config,
+	items,
+	position,
 	averageLegendWidth = MAX_LEGEND_WIDTH,
+	focusedSeriesIndex,
+	onClick,
+	onMouseMove,
+	onMouseLeave,
+	showCopy = true,
 }: LegendProps): JSX.Element {
-	const { legendItemsMap, focusedSeriesIndex, setFocusedSeriesIndex } =
-		useLegendsSync({ config });
-	const { onLegendClick, onLegendMouseMove, onLegendMouseLeave } =
-		useLegendActions({
-			setFocusedSeriesIndex,
-			focusedSeriesIndex,
-		});
 	const legendContainerRef = useRef<HTMLDivElement | null>(null);
 	const [legendSearchQuery, setLegendSearchQuery] = useState('');
 	const { copyToClipboard, id: copiedId } = useCopyToClipboard();
 
-	const legendItems = useMemo(
-		() => Object.values(legendItemsMap),
-		[legendItemsMap],
-	);
+	// Search is intrinsic to the right-positioned legend.
+	const searchEnabled = position === LegendPosition.RIGHT;
 
 	const isSingleRow = useMemo(() => {
 		if (!legendContainerRef.current || position !== LegendPosition.BOTTOM) {
@@ -41,21 +43,19 @@ export default function Legend({
 		}
 		const containerWidth = legendContainerRef.current.clientWidth;
 
-		const totalLegendWidth = legendItems.length * (averageLegendWidth + 16);
+		const totalLegendWidth = items.length * (averageLegendWidth + 16);
 		const totalRows = Math.ceil(totalLegendWidth / containerWidth);
 		return totalRows <= 1;
-	}, [averageLegendWidth, legendContainerRef, legendItems.length, position]);
+	}, [averageLegendWidth, items.length, position]);
 
 	const visibleLegendItems = useMemo(() => {
-		if (position !== LegendPosition.RIGHT || !legendSearchQuery.trim()) {
-			return legendItems;
+		if (!searchEnabled || !legendSearchQuery.trim()) {
+			return items;
 		}
 
 		const query = legendSearchQuery.trim().toLowerCase();
-		return legendItems.filter((item) =>
-			item.label?.toLowerCase().includes(query),
-		);
-	}, [position, legendSearchQuery, legendItems]);
+		return items.filter((item) => item.label?.toLowerCase().includes(query));
+	}, [searchEnabled, legendSearchQuery, items]);
 
 	const handleCopyLegendItem = useCallback(
 		(e: React.MouseEvent, seriesIndex: number, label: string): void => {
@@ -68,6 +68,9 @@ export default function Legend({
 	const renderLegendItem = useCallback(
 		(item: LegendItem): JSX.Element => {
 			const isCopied = copiedId === item.seriesIndex;
+			// `color` is uPlot's stroke union (string | fn | gradient); only a string
+			// is a usable CSS colour for the marker.
+			const markerColor = typeof item.color === 'string' ? item.color : undefined;
 			return (
 				<div
 					key={item.seriesIndex}
@@ -77,54 +80,68 @@ export default function Legend({
 						'legend-item-focused': focusedSeriesIndex === item.seriesIndex,
 					})}
 				>
-					<AntdTooltip title={item.label}>
+					<TooltipSimple title={item.label} arrow side="top" disableHoverableContent>
 						<div className="legend-item-label-trigger">
 							<div
 								className="legend-marker"
-								style={{ borderColor: String(item.color) }}
+								style={{ borderColor: markerColor }}
 								data-is-legend-marker={true}
 							/>
 							<span className="legend-label">{item.label}</span>
 						</div>
-					</AntdTooltip>
-					<AntdTooltip title={isCopied ? 'Copied' : 'Copy'}>
-						<button
-							type="button"
-							className="legend-copy-button"
-							onClick={(e): void =>
-								handleCopyLegendItem(e, item.seriesIndex, item.label ?? '')
-							}
-							aria-label={`Copy ${item.label}`}
-							data-testid="legend-copy"
+					</TooltipSimple>
+					{showCopy && (
+						<TooltipSimple
+							title={isCopied ? 'Copied' : 'Copy'}
+							arrow
+							side="top"
+							disableHoverableContent
 						>
-							{isCopied ? <Check size={12} /> : <Copy size={12} />}
-						</button>
-					</AntdTooltip>
+							<Button
+								type="button"
+								size="icon"
+								variant="ghost"
+								color="secondary"
+								className="legend-copy-button"
+								onClick={(e): void =>
+									handleCopyLegendItem(e, item.seriesIndex, item.label ?? '')
+								}
+								aria-label={`Copy ${item.label}`}
+								// data-testid (not testId): TooltipSimple's trigger injects
+								// data-testid:undefined via Radix Slot, and Button spreads
+								// incoming props after its own testId — so set it as a prop
+								// that wins the Slot merge and survives the spread.
+								data-testid="legend-copy"
+							>
+								{isCopied ? <Check size={12} /> : <Copy size={12} />}
+							</Button>
+						</TooltipSimple>
+					)}
 				</div>
 			);
 		},
-		[copiedId, focusedSeriesIndex, handleCopyLegendItem, position],
+		[copiedId, focusedSeriesIndex, handleCopyLegendItem, position, showCopy],
 	);
 
 	const isEmptyState = useMemo(() => {
-		if (position !== LegendPosition.RIGHT || !legendSearchQuery.trim()) {
+		if (!searchEnabled || !legendSearchQuery.trim()) {
 			return false;
 		}
 		return visibleLegendItems.length === 0;
-	}, [position, legendSearchQuery, visibleLegendItems]);
+	}, [searchEnabled, legendSearchQuery, visibleLegendItems]);
 
 	return (
 		<div
 			ref={legendContainerRef}
 			className="legend-container"
-			onClick={onLegendClick}
-			onMouseMove={onLegendMouseMove}
-			onMouseLeave={onLegendMouseLeave}
+			onClick={onClick}
+			onMouseMove={onMouseMove}
+			onMouseLeave={onMouseLeave}
 			style={{
 				['--legend-average-width' as string]: `${averageLegendWidth + 16}px`, // 16px is the marker width
 			}}
 		>
-			{position === LegendPosition.RIGHT && (
+			{searchEnabled && (
 				<div className="legend-search-container">
 					<Input
 						allowClear

frontend/src/lib/uPlotV2/components/Legend/UPlotLegend.tsx

@@ -0,0 +1,41 @@
+import { useMemo } from 'react';
+import useLegendsSync from 'lib/uPlotV2/hooks/useLegendsSync';
+
+import { useLegendActions } from '../../hooks/useLegendActions';
+import { LegendPosition, UPlotLegendProps } from '../types';
+
+import Legend from './Legend';
+
+/**
+ * uPlot legend controller. Derives the legend items + focus/visibility state
+ * from the chart config (useLegendsSync) and the toggle/focus interactions from
+ * the plot context (useLegendActions), then renders the presentational Legend.
+ * Must be rendered inside a PlotContextProvider.
+ */
+export default function UPlotLegend({
+	position = LegendPosition.BOTTOM,
+	config,
+	averageLegendWidth,
+}: UPlotLegendProps): JSX.Element {
+	const { legendItemsMap, focusedSeriesIndex, setFocusedSeriesIndex } =
+		useLegendsSync({ config });
+	const { onLegendClick, onLegendMouseMove, onLegendMouseLeave } =
+		useLegendActions({
+			setFocusedSeriesIndex,
+			focusedSeriesIndex,
+		});
+
+	const items = useMemo(() => Object.values(legendItemsMap), [legendItemsMap]);
+
+	return (
+		<Legend
+			items={items}
+			position={position}
+			averageLegendWidth={averageLegendWidth}
+			focusedSeriesIndex={focusedSeriesIndex}
+			onClick={onLegendClick}
+			onMouseMove={onLegendMouseMove}
+			onMouseLeave={onLegendMouseLeave}
+		/>
+	);
+}

frontend/src/lib/uPlotV2/components/__tests__/UPlotLegend.test.tsx

@@ -7,11 +7,12 @@ import {
 	within,
 } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
+import { TooltipProvider } from '@signozhq/ui/tooltip';
 import { LegendItem } from 'lib/uPlotV2/config/types';
 import useLegendsSync from 'lib/uPlotV2/hooks/useLegendsSync';
 
 import { useLegendActions } from '../../hooks/useLegendActions';
-import Legend from '../Legend/Legend';
+import UPlotLegend from '../Legend/UPlotLegend';
 import { LegendPosition } from '../types';
 
 const mockWriteText = jest.fn().mockResolvedValue(undefined);
@@ -47,7 +48,7 @@ const mockUseLegendActions = useLegendActions as jest.MockedFunction<
 	typeof useLegendActions
 >;
 
-describe('Legend', () => {
+describe('UPlotLegend', () => {
 	beforeAll(() => {
 		// JSDOM does not define navigator.clipboard; add it so we can spy on writeText
 		Object.defineProperty(navigator, 'clipboard', {
@@ -115,11 +116,13 @@ describe('Legend', () => {
 
 	const renderLegend = (position?: LegendPosition): RenderResult =>
 		render(
-			<Legend
-				position={position}
-				// config is not used directly in the component, it's consumed by the mocked hook
-				config={{} as any}
-			/>,
+			<TooltipProvider>
+				<UPlotLegend
+					position={position}
+					// config is consumed by the mocked useLegendsSync hook, not directly
+					config={{} as any}
+				/>
+			</TooltipProvider>,
 		);
 
 	describe('layout and position', () => {

frontend/src/lib/uPlotV2/components/types.ts

@@ -1,9 +1,10 @@
-import { ReactNode } from 'react';
+import { MouseEventHandler, ReactNode } from 'react';
 import { Timezone } from 'components/CustomTimePicker/timezoneUtils';
 import { PrecisionOption } from 'components/Graph/types';
 import uPlot from 'uplot';
 
 import { UPlotConfigBuilder } from '../config/UPlotConfigBuilder';
+import { LegendItem } from '../config/types';
 import { SyncTooltipFilterMode } from '../plugins/TooltipPlugin/types';
 
 /**
@@ -109,7 +110,33 @@ export enum LegendPosition {
 export interface LegendConfig {
 	position: LegendPosition;
 }
+/**
+ * Presentational legend props. Source-agnostic: it renders whatever `items`
+ * it's given and delegates interaction to the container handlers, so it serves
+ * both uPlot charts (via UPlotLegend) and non-uPlot charts (Pie). The search
+ * box is intrinsic to the RIGHT position (derived from `position`, not a flag).
+ */
 export interface LegendProps {
+	items: LegendItem[];
+	/** Legend placement; always supplied by the container. */
+	position: LegendPosition;
+	averageLegendWidth?: number;
+	/** Series index to highlight (hovered/focused). */
+	focusedSeriesIndex: number | null;
+	/**
+	 * Container-delegated handlers. Items carry `data-legend-item-id`, so the
+	 * handler reads the target's id rather than binding per item.
+	 */
+	onClick: MouseEventHandler<HTMLDivElement>;
+	onMouseMove: MouseEventHandler<HTMLDivElement>;
+	onMouseLeave: () => void;
+	/** Show the per-item copy button. Default true. */
+	showCopy?: boolean;
+}
+
+/** Props for the uPlot legend controller, which derives items + interaction
+ * from the chart config and renders the presentational Legend. */
+export interface UPlotLegendProps {
 	position?: LegendPosition;
 	config: UPlotConfigBuilder;
 	averageLegendWidth?: number;

frontend/src/lib/uPlotV2/plugins/TooltipPlugin/types.ts

@@ -37,7 +37,7 @@ export interface TooltipViewState {
 	isHovering: boolean;
 	isPinned: boolean;
 	dismiss: () => void;
-	clickData: TooltipClickData | null;
+	clickData: ChartClickData | null;
 	contents?: ReactNode;
 }
 
@@ -59,17 +59,17 @@ export interface TooltipPluginProps {
 	/** Key that pins the tooltip while hovering. Defaults to DEFAULT_PIN_TOOLTIP_KEY ('l'). */
 	pinKey?: string;
 	/** Called when the user clicks the uPlot overlay. Receives resolved click data. */
-	onClick?: (clickData: TooltipClickData) => void;
+	onClick?: (clickData: ChartClickData) => void;
 	syncMode?: DashboardCursorSync;
 	syncKey?: string;
 	syncMetadata?: TooltipSyncMetadata;
 	render: (args: TooltipRenderArgs) => ReactNode;
-	pinnedTooltipElement?: (clickData: TooltipClickData) => ReactNode;
+	pinnedTooltipElement?: (clickData: ChartClickData) => ReactNode;
 	maxWidth?: number;
 	maxHeight?: number;
 }
 
-export interface TooltipClickData {
+export interface ChartClickData {
 	xValue: number;
 	yValue: number;
 	focusedSeries: {
@@ -101,7 +101,7 @@ export interface TooltipControllerState {
 	hoverActive: boolean;
 	isAnySeriesActive: boolean;
 	pinned: boolean;
-	clickData: TooltipClickData | null;
+	clickData: ChartClickData | null;
 	style: TooltipViewState['style'];
 	horizontalOffset: number;
 	verticalOffset: number;

frontend/src/lib/uPlotV2/plugins/TooltipPlugin/utils.ts

@@ -2,7 +2,7 @@ import { getFocusedSeriesAtPosition } from 'lib/uPlotLib/plugins/onClickPlugin';
 
 import {
 	TOOLTIP_OFFSET,
-	TooltipClickData,
+	ChartClickData,
 	TooltipLayoutInfo,
 	TooltipViewState,
 } from './types';
@@ -167,14 +167,11 @@ export function createLayoutObserver(
 }
 
 /**
- * Resolves a TooltipClickData snapshot from a MouseEvent (real or synthetic)
+ * Resolves a ChartClickData snapshot from a MouseEvent (real or synthetic)
  * and the current uPlot instance. Shared by the overlay click handler and the
  * keyboard-pin handler (which synthesises an event from the cursor position).
  */
-export function buildClickData(
-	event: MouseEvent,
-	plot: uPlot,
-): TooltipClickData {
+export function buildClickData(event: MouseEvent, plot: uPlot): ChartClickData {
 	const xValue = plot.posToVal(event.offsetX, 'x');
 	const yValue = plot.posToVal(event.offsetY, 'y');
 	const focusedSeries = getFocusedSeriesAtPosition(event, plot);

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

@@ -0,0 +1,46 @@
+import { useCallback } from 'react';
+import { useLocation } from 'react-router-dom';
+import { Button } from '@signozhq/ui/button';
+import { TooltipSimple } from '@signozhq/ui/tooltip';
+import logEvent from 'api/common/logEvent';
+import Noz from 'components/Noz/Noz';
+import { NOZ_TOOLTIP_TITLE } from 'components/Noz/Noz.constants';
+import {
+	AIAssistantEvents,
+	AIAssistantOpenSource,
+} from 'container/AIAssistant/events';
+import { normalizePage } from 'container/AIAssistant/hooks/useAIAssistantAnalyticsContext';
+import { openAIAssistant } from 'container/AIAssistant/store/useAIAssistantStore';
+import { useIsAIAssistantEnabled } from 'hooks/useIsAIAssistantEnabled';
+
+export default function NozButton(): JSX.Element | null {
+	const { pathname } = useLocation();
+	const isAIAssistantEnabled = useIsAIAssistantEnabled();
+
+	const handleOpenNoz = useCallback((): void => {
+		void logEvent(AIAssistantEvents.Opened, {
+			source: AIAssistantOpenSource.TraceDetails,
+			currentPage: normalizePage(pathname),
+		});
+		openAIAssistant();
+	}, [pathname]);
+
+	if (!isAIAssistantEnabled) {
+		return null;
+	}
+
+	return (
+		<TooltipSimple title={NOZ_TOOLTIP_TITLE}>
+			<Button
+				variant="ghost"
+				size="icon"
+				color="secondary"
+				className="noz-wave"
+				aria-label="Open Noz"
+				onClick={handleOpenNoz}
+			>
+				<Noz size={16} />
+			</Button>
+		</TooltipSimple>
+	);
+}

frontend/src/pages/TraceDetailsV3/TraceWaterfall/TraceWaterfallStates/Success/Filters/Filters.tsx

@@ -20,6 +20,7 @@ import { DEFAULT_ENTITY_VERSION } from 'constants/app';
 import { initialQueriesMap, PANEL_TYPES } from 'constants/queryBuilder';
 import { useGetQueryRange } from 'hooks/queryBuilder/useGetQueryRange';
 import { uniqBy } from 'lodash-es';
+import NozButton from 'pages/TraceDetailsV3/TraceDetailsHeader/NozButton';
 import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { Query, TagFilter } from 'types/api/queryBuilder/queryBuilderData';
 import {
@@ -426,6 +427,8 @@ function Filters({
 					)}
 				</div>
 
+				<NozButton />
+
 				<div className={styles.highlightControl}>{highlightErrorsToggle}</div>
 			</div>
 		</TooltipProvider>

frontend/src/providers/QueryBuilder.tsx

@@ -39,6 +39,7 @@ import { updateStepInterval } from 'hooks/queryBuilder/useStepInterval';
 import { useSafeNavigate } from 'hooks/useSafeNavigate';
 import useUrlQuery from 'hooks/useUrlQuery';
 import { createIdFromObjectFields } from 'lib/createIdFromObjectFields';
+import { saveRecentQuery } from 'lib/recentQueries/saveRecentQuery';
 import { createNewBuilderItemName } from 'lib/newQueryBuilder/createNewBuilderItemName';
 import { getOperatorsBySourceAndPanelType } from 'lib/newQueryBuilder/getOperatorsBySourceAndPanelType';
 import { replaceIncorrectObjectFields } from 'lib/replaceIncorrectObjectFields';
@@ -1025,6 +1026,11 @@ export function QueryBuilderProvider({
 	);
 
 	const handleRunQuery = useCallback(() => {
+		// Save the run query to recent searches. Tied to the explicit Stage & Run
+		// gesture (not staged-query changes) so navigation and correlation redirects
+		// don't pollute recents.
+		saveRecentQuery(currentQuery);
+
 		const isExplorer =
 			location.pathname === ROUTES.LOGS_EXPLORER ||
 			location.pathname === ROUTES.TRACES_EXPLORER;

frontend/src/utils/timeUtils.ts

@@ -2,6 +2,7 @@ import { DATE_TIME_FORMATS } from 'constants/dateTimeFormats';
 import dayjs from 'dayjs';
 import customParseFormat from 'dayjs/plugin/customParseFormat';
 import duration from 'dayjs/plugin/duration';
+import relativeTime from 'dayjs/plugin/relativeTime';
 import timezone from 'dayjs/plugin/timezone';
 import utc from 'dayjs/plugin/utc';
 
@@ -9,6 +10,7 @@ dayjs.extend(utc);
 dayjs.extend(customParseFormat);
 dayjs.extend(duration);
 dayjs.extend(timezone);
+dayjs.extend(relativeTime);
 
 export function toUTCEpoch(time: number): number {
 	const x = new Date();

frontend/vite.config.ts

@@ -95,7 +95,7 @@ export default defineConfig(({ mode }): UserConfig => {
 				project: env.VITE_SENTRY_PROJECT_ID,
 				// Pin the sourcemap-upload release to the same value injected as
 				// process.env.VERSION so uploaded sourcemaps resolve. Ref: platform-pod#2393
-				release: { name: env.VITE_VERSION },
+				release: { name: env.VITE_VERSION, setCommits: { auto: true } },
 			}),
 		);
 	}

pkg/apiserver/signozapiserver/tracedetail.go

@@ -67,5 +67,24 @@ func (provider *provider) addTraceDetailRoutes(router *mux.Router) error {
 		return err
 	}
 
+	if err := router.Handle("/api/v3/traces/{traceID}/flamegraph", handler.New(
+		provider.authzMiddleware.ViewAccess(provider.traceDetailHandler.GetFlamegraph),
+		handler.OpenAPIDef{
+			ID:                  "GetFlamegraph",
+			Tags:                []string{"tracedetail"},
+			Summary:             "Get flamegraph view for a trace",
+			Description:         "Returns the flamegraph view of spans for a given trace ID.",
+			Request:             new(spantypes.PostableFlamegraph),
+			RequestContentType:  "application/json",
+			Response:            new(spantypes.GettableFlamegraphTrace),
+			ResponseContentType: "application/json",
+			SuccessStatusCode:   http.StatusOK,
+			ErrorStatusCodes:    []int{http.StatusBadRequest, http.StatusNotFound},
+			SecuritySchemes:     newSecuritySchemes(types.RoleViewer),
+		},
+	)).Methods(http.MethodPost).GetError(); err != nil {
+		return err
+	}
+
 	return nil
 }

pkg/authn/callbackauthn/googlecallbackauthn/authn.go

@@ -4,6 +4,7 @@ import (
 	"context"
 	"log/slog"
 	"net/url"
+	"path"
 
 	"github.com/coreos/go-oidc/v3/oidc"
 	"golang.org/x/oauth2"
@@ -14,6 +15,7 @@ import (
 	"github.com/SigNoz/signoz/pkg/authn"
 	"github.com/SigNoz/signoz/pkg/errors"
 	"github.com/SigNoz/signoz/pkg/factory"
+	"github.com/SigNoz/signoz/pkg/global"
 	"github.com/SigNoz/signoz/pkg/http/client"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
@@ -29,12 +31,13 @@ var scopes []string = []string{"email", "profile"}
 var _ authn.CallbackAuthN = (*AuthN)(nil)
 
 type AuthN struct {
-	store      authtypes.AuthNStore
-	settings   factory.ScopedProviderSettings
-	httpClient *client.Client
+	store        authtypes.AuthNStore
+	settings     factory.ScopedProviderSettings
+	httpClient   *client.Client
+	globalConfig global.Config
 }
 
-func New(ctx context.Context, store authtypes.AuthNStore, providerSettings factory.ProviderSettings) (*AuthN, error) {
+func New(ctx context.Context, store authtypes.AuthNStore, providerSettings factory.ProviderSettings, globalConfig global.Config) (*AuthN, error) {
 	settings := factory.NewScopedProviderSettings(providerSettings, "github.com/SigNoz/signoz/pkg/authn/callbackauthn/googlecallbackauthn")
 
 	httpClient, err := client.New(settings.Logger(), providerSettings.TracerProvider, providerSettings.MeterProvider)
@@ -43,9 +46,10 @@ func New(ctx context.Context, store authtypes.AuthNStore, providerSettings facto
 	}
 
 	return &AuthN{
-		store:      store,
-		settings:   settings,
-		httpClient: httpClient,
+		store:        store,
+		settings:     settings,
+		httpClient:   httpClient,
+		globalConfig: globalConfig,
 	}, nil
 }
 
@@ -178,7 +182,7 @@ func (a *AuthN) oauth2Config(siteURL *url.URL, authDomain *authtypes.AuthDomain,
 		RedirectURL: (&url.URL{
 			Scheme: siteURL.Scheme,
 			Host:   siteURL.Host,
-			Path:   redirectPath,
+			Path:   path.Join(a.globalConfig.ExternalPath(), redirectPath),
 		}).String(),
 	}
 }

pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/aks/icon.svg

@@ -0,0 +1 @@
+<svg id="uuid-c6c3f75e-5369-448e-b895-3f99fb11bebe" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><path d="M7.456.608c-.902-.411-1.909-.559-2.898-.417.053.041.086.107.082.179l-.082,1.405c.879-.183,1.827-.043,2.65.469.338.21.639.474.892.781,0,0,.024.027.061.069.091.104.26.299.334.402.006.031-.004.062-.026.084-.001.001-.002.002-.003.004l-.052.048-.765.681c-.039.035-.042.095-.007.134.017.019.04.03.065.031l1.107.065,1.402.082c.072.004.138-.029.179-.083.025-.033.041-.073.044-.117l.147-2.513c.003-.052-.037-.097-.089-.1-.025-.001-.049.007-.068.024l-.764.682v.003c-.106-.164-.22-.319-.34-.467-.516-.636-1.159-1.122-1.869-1.445Z" fill="#0078d4"/><path d="M4.441.147L1.932,0c-.052-.003-.097.037-.1.09-.001.025.007.049.024.068l.681.766h.003c-.159.104-.311.214-.455.331-.629.509-1.111,1.143-1.436,1.842-.424.913-.578,1.937-.434,2.942.041-.053.107-.086.179-.082l1.402.082c-.183-.881-.043-1.83.468-2.655.209-.338.473-.64.78-.893,0,0,.029-.026.072-.064.104-.092.297-.259.399-.332.031-.006.062.004.084.026.001.001.002.002.003.003l.048.052.679.766c.035.039.095.042.134.008.019-.017.03-.04.031-.065l.064-1.109.082-1.405c.004-.072-.029-.138-.082-.179-.033-.025-.073-.041-.117-.044Z" fill="#46a0de"/><path d="M10.411,5.611c.025-.363.013-.73-.039-1.095-.041.053-.107.086-.179.082l-1.402-.082c.038.186.062.374.071.564l1.55.53Z" fill="#155ea1"/><path d="M3.576,9.604l.271-.049,1.845-.343c-.095-.084-.155-.206-.155-.34v-.025c-.733.051-1.487-.119-2.159-.536-.338-.21-.639-.474-.892-.781,0,0-.024-.027-.061-.069-.091-.104-.26-.299-.334-.402-.006-.031.004-.062.026-.084.001-.001.002-.002.003-.004l.052-.048.765-.681c.039-.035.042-.095.007-.134-.017-.019-.04-.03-.065-.031l-1.107-.065-1.402-.082c-.072-.004-.138.029-.179.083-.025.033-.041.073-.044.117L0,8.645c-.003.052.037.097.089.1.025.001.049-.007.068-.024l.764-.682v-.003c.106.164.22.319.34.467.516.636,1.159,1.122,1.869,1.445.026.012.053.021.08.033.029-.188.173-.342.365-.376Z" fill="#8dc8e8"/><g><polygon points="8.241 5.343 5.968 5.765 5.968 8.87 8.241 9.355 10.522 8.44 10.522 6.123 8.241 5.343" fill="#8661c5"/><path d="M8.328,9.307l2.082-.844c.048-.019.084-.061.095-.111v-2.102c-.004-.064-.044-.119-.103-.143l-2.106-.716h-.095l-2.066.382c-.066.017-.114.075-.119.143v2.81c-.002.073.048.136.119.151l2.09.438c.035.004.07.002.103-.008Z" fill="none"/><path d="M5.968,5.765v3.105l2.297.486v-3.98l-2.297.39ZM6.938,8.631l-.644-.127v-2.388l.644-.103v2.619ZM7.939,8.814l-.739-.119v-2.73l.739-.127v2.977Z" fill="#56407f"/><polygon points="13.16 5.383 10.887 5.805 10.887 8.909 13.16 9.395 15.433 8.471 15.433 6.163 13.16 5.383" fill="#8661c5"/><path d="M10.887,5.805v3.105l2.281.486v-3.98l-2.281.39ZM11.849,8.67l-.644-.127v-2.388l.644-.103v2.619ZM12.85,8.854l-.739-.119v-2.73l.739-.135v2.985Z" fill="#56407f"/><polygon points="5.912 9.626 3.639 10.048 3.639 13.152 5.912 13.638 8.193 12.722 8.193 10.406 5.912 9.626" fill="#8661c5"/><path d="M3.632,10.048v3.081l2.297.486v-3.98l-2.297.414ZM4.593,12.921l-.644-.135v-2.388l.644-.111v2.635ZM5.602,13.128l-.739-.119v-2.762l.739-.127v3.009Z" fill="#56407f"/><polygon points="10.816 9.594 8.543 10.016 8.543 13.12 10.816 13.614 13.089 12.69 13.089 10.374 10.816 9.594" fill="#8661c5"/><path d="M8.543,10.016v3.112l2.289.486v-3.98l-2.289.382ZM9.504,12.889l-.644-.135v-2.388l.644-.111v2.635ZM10.506,13.065l-.739-.119v-2.73l.739-.127v2.977Z" fill="#56407f"/><polygon points="15.719 9.634 13.446 10.056 13.446 13.16 15.719 13.646 18 12.73 18 10.414 15.719 9.634" fill="#8661c5"/><path d="M13.446,10.056v3.073l2.297.486v-3.98l-2.297.422ZM14.416,12.929l-.644-.135v-2.388l.644-.111v2.635ZM15.417,13.104l-.739-.119v-2.73l.739-.127v2.977Z" fill="#56407f"/><polygon points="8.185 13.956 5.912 14.37 5.912 17.475 8.185 17.968 10.466 17.045 10.466 14.736 8.185 13.956" fill="#8661c5"/><path d="M8.273,17.904l2.074-.796c.06-.021.099-.08.095-.143v-2.07c.012-.076-.031-.149-.103-.175l-2.098-.716c-.031-.012-.065-.012-.095,0l-2.066.374c-.074.012-.128.076-.127.151v2.818c-.002.073.048.136.119.151l2.09.406c.036.012.075.012.111,0Z" fill="none"/><path d="M5.912,14.37v3.105l2.297.494v-4.044l-2.297.446ZM6.882,17.244l-.644-.135v-2.388l.644-.111v2.635ZM7.883,17.427l-.739-.119v-2.738l.739-.127v2.985Z" fill="#56407f"/><polygon points="13.097 13.988 10.824 14.41 10.824 17.514 13.097 18 15.377 17.085 15.377 14.768 13.097 13.988" fill="#8661c5"/><path d="M10.824,14.41v3.105l2.297.486v-3.98l-2.297.39ZM11.793,17.284l-.644-.135v-2.388l.644-.111v2.635ZM12.795,17.459l-.739-.119v-2.73l.739-.127v2.977Z" fill="#56407f"/></g></svg>

pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/aks/integration.json

@@ -0,0 +1,293 @@
+{
+  "id": "aks",
+  "title": "Azure Kubernetes Service (AKS)",
+  "icon": "file://icon.svg",
+  "overview": "file://overview.md",
+  "supportedSignals": {
+    "metrics": true,
+    "logs": true
+  },
+  "dataCollected": {
+    "metrics": [
+      {
+        "name": "azure_kube_pod_status_ready_average",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_kube_pod_status_ready_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_kube_pod_status_phase_average",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_kube_pod_status_phase_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_kube_node_status_condition_average",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_kube_node_status_condition_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_cpu_usage_millicores_average",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_cpu_usage_millicores_maximum",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_cpu_usage_percentage_average",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_cpu_usage_percentage_maximum",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_disk_usage_bytes_average",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_disk_usage_bytes_maximum",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_disk_usage_percentage_average",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_disk_usage_percentage_maximum",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_memory_rss_bytes_average",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_memory_rss_bytes_maximum",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_memory_rss_percentage_average",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_memory_rss_percentage_maximum",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_memory_working_set_bytes_average",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_memory_working_set_bytes_maximum",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_memory_working_set_percentage_average",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_memory_working_set_percentage_maximum",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_network_in_bytes_average",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_network_in_bytes_maximum",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_network_out_bytes_average",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_node_network_out_bytes_maximum",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_apiserver_current_inflight_requests_average",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_apiserver_current_inflight_requests_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_apiserver_cpu_usage_percentage_average",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_apiserver_cpu_usage_percentage_maximum",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_apiserver_memory_usage_percentage_average",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_apiserver_memory_usage_percentage_maximum",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_etcd_cpu_usage_percentage_average",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_etcd_cpu_usage_percentage_maximum",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_etcd_database_usage_percentage_average",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_etcd_database_usage_percentage_maximum",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_etcd_memory_usage_percentage_average",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_etcd_memory_usage_percentage_maximum",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_kube_node_status_allocatable_cpu_cores_average",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_kube_node_status_allocatable_cpu_cores_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_kube_node_status_allocatable_memory_bytes_average",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_kube_node_status_allocatable_memory_bytes_total",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      }
+    ],
+    "logs": [
+      {
+        "name": "Resource ID",
+        "path": "resources.azure.resource.id",
+        "type": "string"
+      }
+    ]
+  },
+  "telemetryCollectionStrategy": {
+    "azure": {
+      "resourceProvider": "Microsoft.ContainerService",
+      "resourceType": "managedClusters",
+      "metrics": {},
+      "logs": {
+        "categoryGroups": ["allLogs"]
+      }
+    }
+  },
+  "assets": {
+    "dashboards": [
+      {
+        "id": "overview",
+        "title": "Azure Kubernetes Service (AKS) Overview",
+        "description": "Overview of Azure Kubernetes Service (AKS) metrics",
+        "definition": "file://assets/dashboards/overview.json"
+      }
+    ]
+  }
+}

pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/aks/overview.md

@@ -0,0 +1,5 @@
+### Monitor Azure Kubernetes Service (AKS) with SigNoz
+
+Collect key AKS metrics and view them with an out of the box dashboard.
+
+Note: This integration is only for AKS with resource type `Microsoft.ContainerService/managedClusters`.

pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/appservice/icon.svg

@@ -0,0 +1 @@
+<svg id="b70acf0a-34b4-4bdf-9024-7496043ff915" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><defs><radialGradient id="e2cf8746-c9a8-4eee-86c2-4951983c6032" cx="13428.81" cy="3518.86" r="56.67" gradientTransform="translate(-2005.33 -518.83) scale(0.15)" gradientUnits="userSpaceOnUse"><stop offset="0.18" stop-color="#5ea0ef"/><stop offset="1" stop-color="#0078d4"/></radialGradient><linearGradient id="bdd213dd-d313-473c-8ff4-0133fd3a9033" x1="4.4" y1="11.48" x2="4.37" y2="7.53" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ccc"/><stop offset="1" stop-color="#fcfcfc"/></linearGradient><linearGradient id="afcc63c5-3649-4476-a742-bcb53a569f3c" x1="10.13" y1="15.45" x2="10.13" y2="11.9" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ccc"/><stop offset="1" stop-color="#fcfcfc"/></linearGradient><linearGradient id="bd873f0b-9954-4aa5-a3df-9f4c64e8729d" x1="14.18" y1="11.15" x2="14.18" y2="7.38" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#ccc"/><stop offset="1" stop-color="#fcfcfc"/></linearGradient></defs><title>Icon-web-41</title><path id="ee75dd06-1aca-4f76-9d11-d05a284020ad" d="M14.21,15.72A8.5,8.5,0,0,1,3.79,2.28l.09-.06a8.5,8.5,0,0,1,10.33,13.5" fill="url(#e2cf8746-c9a8-4eee-86c2-4951983c6032)"/><path d="M6.69,7.23A13,13,0,0,1,15.6,3.65a8.47,8.47,0,0,0-1.49-1.44,14.34,14.34,0,0,0-4.69,1.1A12.54,12.54,0,0,0,5.34,6.13,2.76,2.76,0,0,1,6.69,7.23Z" fill="#fff" opacity="0.6"/><path d="M2.48,10.65a17.86,17.86,0,0,0-.83,2.62,7.82,7.82,0,0,0,.62.92c.18.23.35.44.55.65A17.94,17.94,0,0,1,3.9,11.37,2.76,2.76,0,0,1,2.48,10.65Z" fill="#fff" opacity="0.6"/><path d="M3.46,6.11a12,12,0,0,1-.69-2.94,8.15,8.15,0,0,0-1.1,1.45A12.69,12.69,0,0,0,2.24,7,2.69,2.69,0,0,1,3.46,6.11Z" fill="#f2f2f2" opacity="0.55"/><circle cx="4.38" cy="8.68" r="2.73" fill="url(#bdd213dd-d313-473c-8ff4-0133fd3a9033)"/><path d="M8.36,13.67A1.77,1.77,0,0,1,8.9,12.4a11.88,11.88,0,0,1-2.53-1.86,2.74,2.74,0,0,1-1.49.83,13.1,13.1,0,0,0,1.45,1.28A12.12,12.12,0,0,0,8.38,13.9,1.79,1.79,0,0,1,8.36,13.67Z" fill="#f2f2f2" opacity="0.55"/><path d="M14.66,13.88a12,12,0,0,1-2.76-.32.41.41,0,0,1,0,.11,1.75,1.75,0,0,1-.51,1.24,13.69,13.69,0,0,0,3.42.24A8.21,8.21,0,0,0,16,13.81,11.5,11.5,0,0,1,14.66,13.88Z" fill="#f2f2f2" opacity="0.55"/><circle cx="10.13" cy="13.67" r="1.78" fill="url(#afcc63c5-3649-4476-a742-bcb53a569f3c)"/><path d="M12.32,8.93a1.83,1.83,0,0,1,.61-1A25.5,25.5,0,0,1,8.47,3.79a16.91,16.91,0,0,1-2-2.92,7.64,7.64,0,0,0-1.09.42A18.14,18.14,0,0,0,7.53,4.47,26.44,26.44,0,0,0,12.32,8.93Z" fill="#f2f2f2" opacity="0.7"/><circle cx="14.18" cy="9.27" r="1.89" fill="url(#bd873f0b-9954-4aa5-a3df-9f4c64e8729d)"/><path d="M17.35,10.54,17,10.37l0,0-.3-.16-.06,0L16.38,10l-.07,0L16,9.8a1.76,1.76,0,0,1-.64.92c.12.08.25.15.38.22l.08.05.35.19,0,0,.86.45h0a8.63,8.63,0,0,0,.29-1.11Z" fill="#f2f2f2" opacity="0.55"/><circle cx="4.38" cy="8.68" r="2.73" fill="url(#bdd213dd-d313-473c-8ff4-0133fd3a9033)"/><circle cx="10.13" cy="13.67" r="1.78" fill="url(#afcc63c5-3649-4476-a742-bcb53a569f3c)"/></svg>

pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/appservice/integration.json

@@ -0,0 +1,272 @@
+{
+  "id": "appservice",
+  "title": "App Services",
+  "icon": "file://icon.svg",
+  "overview": "file://overview.md",
+  "supportedSignals": {
+    "metrics": true,
+    "logs": true
+  },
+  "dataCollected": {
+    "metrics": [
+      {
+        "name": "azure_averagememoryworkingset_average",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_bytesreceived_total",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_bytessent_total",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_backendrequestcount_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_cputime_count",
+        "unit": "Milliseconds",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_cputime_total",
+        "unit": "Milliseconds",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_cputime_minimum",
+        "unit": "Milliseconds",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_cputime_maximum",
+        "unit": "Milliseconds",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_currentassemblies_average",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_filesystemusage_average",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_gen0collections_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_ge10collections_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_gen2collections_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_handles_average",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_healthcheckstatus_average",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_http101_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+
+      {
+        "name": "azure_http2xx_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+
+      {
+        "name": "azure_http3xx_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+
+      {
+        "name": "azure_http401_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+
+      {
+        "name": "azure_http403_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+
+      {
+        "name": "azure_http404_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+
+      {
+        "name": "azure_http406_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+
+      {
+        "name": "azure_http4xx_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+
+      {
+        "name": "azure_http5xx_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+
+      {
+        "name": "azure_httpresponsetime_average",
+        "unit": "Milliseconds",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_iootherbytespersecond_total",
+        "unit": "BytesPerSecond",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_iootheroperationspersecond_total",
+        "unit": "BytesPerSecond",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_ioreadbytespersecond_total",
+        "unit": "BytesPerSecond",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_ioreadoperationspersecond_total",
+        "unit": "BytesPerSecond",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_iowritebytespersecond_total",
+        "unit": "BytesPerSecond",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_iowriteoperationspersecond_total",
+        "unit": "BytesPerSecond",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_privatebytes_average",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_requests_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_requestsinapplicationqueue_average",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_thread_average",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_totalappdomains_average",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_totalappdomainsunloaded_average",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      }
+    ],
+    "logs": [
+      {
+        "name": "Resource ID",
+        "path": "resources.azure.resource.id",
+        "type": "string"
+      }
+    ]
+  },
+  "telemetryCollectionStrategy": {
+    "azure": {
+      "resourceProvider": "Microsoft.Web",
+      "resourceType": "sites",
+      "metrics": {},
+      "logs": {
+        "categoryGroups": ["allLogs"]
+      }
+    }
+  },
+  "assets": {
+    "dashboards": [
+      {
+        "id": "overview",
+        "title": "App Services Overview",
+        "description": "Overview of App Services metrics",
+        "definition": "file://assets/dashboards/overview.json"
+      }
+    ]
+  }
+}

pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/appservice/overview.md

@@ -0,0 +1,5 @@
+### Monitor Azure App Services with SigNoz
+
+Collect key App Services metrics and view them with an out of the box dashboard.
+
+Note: This integration DO NOT collect metrics for any database that was setup with your App Service (if any).

pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/containerapp/icon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><defs><linearGradient id="b27f1ad0-7d11-4247-9da3-91bce6211f32" x1="8.798" y1="8.703" x2="14.683" y2="8.703" gradientUnits="userSpaceOnUse"><stop offset="0.001" stop-color="#773adc"/><stop offset="1" stop-color="#552f99"/></linearGradient><linearGradient id="b2f92112-4ca9-4b17-a019-c9f26c1a4a8f" x1="5.764" y1="3.777" x2="5.764" y2="13.78" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#a67af4"/><stop offset="0.999" stop-color="#773adc"/></linearGradient></defs><g id="b8a0486a-5501-4d92-b540-a766c4b3b548"><g><g><g><path d="M16.932,11.578a8.448,8.448,0,0,1-7.95,5.59,8.15,8.15,0,0,1-2.33-.33,2.133,2.133,0,0,0,.18-.83c.01,0,.03.01.04.01a7.422,7.422,0,0,0,2.11.3,7.646,7.646,0,0,0,6.85-4.28l.01-.01Z" fill="#32bedd"/><path d="M3.582,14.068a2.025,2.025,0,0,0-.64.56,8.6,8.6,0,0,1-1.67-2.44l1.04.23v.26a.6.6,0,0,0,.47.59l.14.03a6.136,6.136,0,0,0,.62.73Z" fill="#32bedd"/><path d="M12.352.958a2.28,2.28,0,0,0-.27.81c-.02-.01-.05-.02-.07-.03a7.479,7.479,0,0,0-3.03-.63,7.643,7.643,0,0,0-5.9,2.8l-.29.06a.6.6,0,0,0-.48.58v.46l-1.02.19A8.454,8.454,0,0,1,8.982.268,8.6,8.6,0,0,1,12.352.958Z" fill="#32bedd"/><path d="M16.872,5.7l-1.09-.38a6.6,6.6,0,0,0-.72-1.16c-.02-.03-.04-.05-.05-.07a2.083,2.083,0,0,0,.72-.45A7.81,7.81,0,0,1,16.872,5.7Z" fill="#32bedd"/><path d="M10.072,11.908l2.54.56L8.672,14.1c-.02,0-.03.01-.05.01a.154.154,0,0,1-.15-.15V3.448a.154.154,0,0,1,.15-.15.09.09,0,0,1,.05.01l4.46,1.56-3.05.57a.565.565,0,0,0-.44.54v5.4A.537.537,0,0,0,10.072,11.908Z" fill="#fff"/><g><g id="e918f286-5032-4942-ad29-ea17e6f1cc90"><path d="M1.1,5.668l1.21-.23v6.55l-1.23-.27-.99-.22a.111.111,0,0,1-.09-.12v-5.4a.12.12,0,0,1,.09-.12Z" fill="#a67af4"/></g><g><g id="a47a99dd-4d47-4c70-8c42-c5ac274ce496"><g><path d="M10.072,11.908l2.54.56L8.672,14.1c-.02,0-.03.01-.05.01a.154.154,0,0,1-.15-.15V3.448a.154.154,0,0,1,.15-.15.09.09,0,0,1,.05.01l4.46,1.56-3.05.57a.565.565,0,0,0-.44.54v5.4A.537.537,0,0,0,10.072,11.908Z" fill="url(#b27f1ad0-7d11-4247-9da3-91bce6211f32)"/><path d="M8.586,3.3,2.878,4.378a.177.177,0,0,0-.14.175V12.68a.177.177,0,0,0,.137.174L8.581,14.1a.176.176,0,0,0,.21-.174V3.478A.175.175,0,0,0,8.619,3.3Z" fill="url(#b2f92112-4ca9-4b17-a019-c9f26c1a4a8f)"/></g></g><polygon points="5.948 4.921 5.948 12.483 7.934 12.814 7.934 4.564 5.948 4.921" fill="#b796f9" opacity="0.5"/><polygon points="3.509 5.329 3.509 11.954 5.238 12.317 5.238 5.031 3.509 5.329" fill="#b796f9" opacity="0.5"/></g></g></g><path d="M16,2.048a1.755,1.755,0,1,1-1.76-1.76A1.756,1.756,0,0,1,16,2.048Z" fill="#32bedd"/><circle cx="4.65" cy="15.973" r="1.759" fill="#32bedd"/></g><path d="M18,6.689v3.844a.222.222,0,0,1-.133.2l-.766.316-3.07,1.268-.011,0a.126.126,0,0,1-.038,0,.1.1,0,0,1-.1-.1V5.234a.1.1,0,0,1,.054-.088l0,0,.019,0a.031.031,0,0,1,.019,0,.055.055,0,0,1,.034.008l.011,0,.012,0L17.05,6.2l.8.282A.213.213,0,0,1,18,6.689Z" fill="#773adc"/><path d="M13.959,5.14l-3.8.715a.118.118,0,0,0-.093.117v5.409a.118.118,0,0,0,.091.116l3.8.831a.115.115,0,0,0,.137-.09.109.109,0,0,0,0-.026V5.256a.117.117,0,0,0-.115-.118A.082.082,0,0,0,13.959,5.14Z" fill="#a67af4"/></g></g></svg>

pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/containerapp/integration.json

@@ -0,0 +1,263 @@
+{
+  "id": "containerapp",
+  "title": "Container App",
+  "icon": "file://icon.svg",
+  "overview": "file://overview.md",
+  "supportedSignals": {
+    "metrics": true,
+    "logs": true
+  },
+  "dataCollected": {
+    "metrics": [
+      {
+        "name": "azure_rxbytes_average",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_rxbytes_maximum",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_rxbytes_minimum",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_rxbytes_total",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_txbytes_average",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_txbytes_maximum",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_txbytes_minimum",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_txbytes_total",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_restartcount_average",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_restartcount_maximum",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_restartcount_minimum",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_restartcount_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_replicas_average",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_replicas_maximum",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_replicas_minimum",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_replicas_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_cpupercentage_average",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_cpupercentage_maximum",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_cpupercentage_minimum",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_cpupercentage_total",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_memorypercentage_average",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_memorypercentage_maximum",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_memorypercentage_minimum",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_memorypercentage_total",
+        "unit": "Percent",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_usagenanocores_average",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_usagenanocores_maximum",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_usagenanocores_minimum",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_usagenanocores_total",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_workingsetbytes_average",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_workingsetbytes_maximum",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_workingsetbytes_minimum",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_workingsetbytes_total",
+        "unit": "Bytes",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_coresquotaused_maximum",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_coresquotaused_minimum",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_totalcoresquotaused_average",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_totalcoresquotaused_maximum",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      },
+      {
+        "name": "azure_totalcoresquotaused_minimum",
+        "unit": "Count",
+        "type": "Gauge",
+        "description": ""
+      }
+    ],
+    "logs": [
+      {
+        "name": "Resource ID",
+        "path": "resources.azure.resource.id",
+        "type": "string"
+      }
+    ]
+  },
+  "telemetryCollectionStrategy": {
+    "azure": {
+      "resourceProvider": "Microsoft.App",
+      "resourceType": "containerApps",
+      "metrics": {},
+      "logs": {
+        "categoryGroups": ["ContainerAppConsoleLogs", "ContainerAppSystemLogs"]
+      }
+    }
+  },
+  "assets": {
+    "dashboards": [
+      {
+        "id": "overview",
+        "title": "Container App Overview",
+        "description": "Overview of Container App metrics",
+        "definition": "file://assets/dashboards/overview.json"
+      }
+    ]
+  }
+}

pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/containerapp/overview.md

@@ -0,0 +1,7 @@
+### Monitor Container Apps with SigNoz
+
+Collect key Container App metrics and view them with an out of the box dashboard.
+
+To collect logs, you need to make sure that you have chosen "Azure Monitor" as the logging option for Container's App Environment.
+
+Note: This integration ingests logs for only "ContainerAppConsoleLogs" and "ContainerAppSystemLogs" diagnostic settings categories.

pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/virtualmachine/icon.svg

@@ -0,0 +1 @@
+<svg id="fd454f1c-5506-44b8-874e-8814b8b2f70b" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18"><defs><linearGradient id="f34d9569-2bd0-4002-8f16-3d01d8106cb5" x1="8.88" y1="12.21" x2="8.88" y2="0.21" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#0078d4"/><stop offset="0.82" stop-color="#5ea0ef"/></linearGradient><linearGradient id="bdb45a0b-eb58-4970-a60a-fb2ce314f866" x1="8.88" y1="16.84" x2="8.88" y2="12.21" gradientUnits="userSpaceOnUse"><stop offset="0.15" stop-color="#ccc"/><stop offset="1" stop-color="#707070"/></linearGradient></defs><title>Icon-compute-21</title><rect x="-0.12" y="0.21" width="18" height="12" rx="0.6" fill="url(#f34d9569-2bd0-4002-8f16-3d01d8106cb5)"/><polygon points="11.88 4.46 11.88 7.95 8.88 9.71 8.88 6.21 11.88 4.46" fill="#50e6ff"/><polygon points="11.88 4.46 8.88 6.22 5.88 4.46 8.88 2.71 11.88 4.46" fill="#c3f1ff"/><polygon points="8.88 6.22 8.88 9.71 5.88 7.95 5.88 4.46 8.88 6.22" fill="#9cebff"/><polygon points="5.88 7.95 8.88 6.21 8.88 9.71 5.88 7.95" fill="#c3f1ff"/><polygon points="11.88 7.95 8.88 6.21 8.88 9.71 11.88 7.95" fill="#9cebff"/><path d="M12.49,15.84c-1.78-.28-1.85-1.56-1.85-3.63H7.11c0,2.07-.06,3.35-1.84,3.63a1,1,0,0,0-.89,1h9A1,1,0,0,0,12.49,15.84Z" fill="url(#bdb45a0b-eb58-4970-a60a-fb2ce314f866)"/></svg>

pkg/modules/cloudintegration/implcloudintegration/fs/definitions/azure/virtualmachine/overview.md

@@ -0,0 +1,3 @@
+### Monitor Azure Virtual Machines with SigNoz
+
+Collect key Virtual Machines metrics and view them with an out of the box dashboard.

pkg/modules/metricsexplorer/implmetricsexplorer/module.go

@@ -219,19 +219,7 @@ func (m *module) GetStats(ctx context.Context, orgID valuer.UUID, req *metricsex
 		return nil, err
 	}
 
-	filterWhereClause, err := m.buildFilterClause(ctx, req.Filter, req.Start, req.End)
-	if err != nil {
-		return nil, err
-	}
-
-	// Single query to get stats with samples, timeseries counts in required sorting order
-	metricStats, total, err := m.fetchMetricsStatsWithSamples(
-		ctx,
-		req,
-		filterWhereClause,
-		false,
-		req.OrderBy,
-	)
+	metricStats, total, err := m.fetchMetricsStatsWithSamples(ctx, req, false)
 	if err != nil {
 		return nil, err
 	}
@@ -268,21 +256,16 @@ func (m *module) GetTreemap(ctx context.Context, orgID valuer.UUID, req *metrics
 		return nil, err
 	}
 
-	filterWhereClause, err := m.buildFilterClause(ctx, req.Filter, req.Start, req.End)
-	if err != nil {
-		return nil, err
-	}
-
 	resp := &metricsexplorertypes.TreemapResponse{}
 	switch req.Mode {
 	case metricsexplorertypes.TreemapModeSamples:
-		entries, err := m.computeSamplesTreemap(ctx, req, filterWhereClause)
+		entries, err := m.computeSamplesTreemap(ctx, req)
 		if err != nil {
 			return nil, err
 		}
 		resp.Samples = entries
 	default: // TreemapModeTimeSeries
-		entries, err := m.computeTimeseriesTreemap(ctx, req, filterWhereClause)
+		entries, err := m.computeTimeseriesTreemap(ctx, req)
 		if err != nil {
 			return nil, err
 		}
@@ -974,15 +957,23 @@ func (m *module) buildFilterClause(ctx context.Context, filter *qbtypes.Filter,
 func (m *module) fetchMetricsStatsWithSamples(
 	ctx context.Context,
 	req *metricsexplorertypes.StatsRequest,
-	filterWhereClause *sqlbuilder.WhereClause,
 	normalized bool,
-	orderBy *qbtypes.OrderBy,
 ) ([]metricsexplorertypes.Stat, uint64, error) {
 	ctx = m.withMetricsExplorerContext(ctx, "fetchMetricsStatsWithSamples")
 
+	hasFilter := req.Filter != nil && strings.TrimSpace(req.Filter.Expression) != ""
+	var filterWhereClause *sqlbuilder.WhereClause
+	if hasFilter {
+		var err error
+		filterWhereClause, err = m.buildFilterClause(ctx, req.Filter, req.Start, req.End)
+		if err != nil {
+			return nil, 0, err
+		}
+	}
+
 	start, end, distributedTsTable, localTsTable := telemetrymetrics.WhichTSTableToUse(uint64(req.Start), uint64(req.End), nil)
-	samplesTable, _ := telemetrymetrics.WhichSamplesTableToUse(uint64(req.Start), uint64(req.End), metrictypes.UnspecifiedType, metrictypes.TimeAggregationUnspecified, nil)
-	countExp := telemetrymetrics.CountExpressionForSamplesTable(samplesTable)
+	distributedSamplesTable, _ := telemetrymetrics.WhichSamplesTableToUse(uint64(req.Start), uint64(req.End), metrictypes.UnspecifiedType, metrictypes.TimeAggregationUnspecified, nil)
+	countExp := telemetrymetrics.CountExpressionForSamplesTable(distributedSamplesTable)
 
 	// Timeseries counts per metric
 	tsSB := sqlbuilder.NewSelectBuilder()
@@ -1005,7 +996,7 @@ func (m *module) fetchMetricsStatsWithSamples(
 		"metric_name",
 		fmt.Sprintf("%s AS samples", countExp),
 	)
-	samplesSB.From(fmt.Sprintf("%s.%s", telemetrymetrics.DBName, samplesTable))
+	samplesSB.From(fmt.Sprintf("%s.%s", telemetrymetrics.DBName, distributedSamplesTable))
 	samplesSB.Where(samplesSB.Between("unix_milli", req.Start, req.End))
 	samplesSB.Where("NOT startsWith(metric_name, 'signoz')")
 
@@ -1013,6 +1004,8 @@ func (m *module) fetchMetricsStatsWithSamples(
 		sqlbuilder.CTEQuery("__time_series_counts").As(tsSB),
 	}
 
+	// Narrow samples scan. With filter: fingerprint IN (per-fingerprint label preds can't fold to metric_name).
+	// No filter (fast path): metric_name IN — aligns with samples table's leading sort key, orders of magnitude cheaper.
 	if filterWhereClause != nil {
 		fingerprintSB := sqlbuilder.NewSelectBuilder()
 		fingerprintSB.Select("fingerprint")
@@ -1025,6 +1018,15 @@ func (m *module) fetchMetricsStatsWithSamples(
 
 		ctes = append(ctes, sqlbuilder.CTEQuery("__filtered_fingerprints").As(fingerprintSB))
 		samplesSB.Where("fingerprint IN (SELECT fingerprint FROM __filtered_fingerprints)")
+	} else {
+		metricNamesSB := sqlbuilder.NewSelectBuilder()
+		metricNamesSB.Select("DISTINCT metric_name")
+		metricNamesSB.From(fmt.Sprintf("%s.%s", telemetrymetrics.DBName, localTsTable))
+		metricNamesSB.Where(metricNamesSB.Between("unix_milli", start, end))
+		metricNamesSB.Where("NOT startsWith(metric_name, 'signoz')")
+		metricNamesSB.Where(metricNamesSB.E("__normalized", normalized))
+
+		samplesSB.Where(fmt.Sprintf("metric_name IN (%s)", samplesSB.Var(metricNamesSB)))
 	}
 	samplesSB.GroupBy("metric_name")
 
@@ -1041,7 +1043,7 @@ func (m *module) fetchMetricsStatsWithSamples(
 	finalSB.JoinWithOption(sqlbuilder.FullOuterJoin, "__sample_counts s", "ts.metric_name = s.metric_name")
 	finalSB.Where("(COALESCE(ts.timeseries, 0) > 0 OR COALESCE(s.samples, 0) > 0)")
 
-	orderByColumn, orderDirection, err := getStatsOrderByColumn(orderBy)
+	orderByColumn, orderDirection, err := getStatsOrderByColumn(req.OrderBy)
 	if err != nil {
 		return nil, 0, err
 	}
@@ -1085,9 +1087,19 @@ func (m *module) fetchMetricsStatsWithSamples(
 	return metricStats, total, nil
 }
 
-func (m *module) computeTimeseriesTreemap(ctx context.Context, req *metricsexplorertypes.TreemapRequest, filterWhereClause *sqlbuilder.WhereClause) ([]metricsexplorertypes.TreemapEntry, error) {
+func (m *module) computeTimeseriesTreemap(ctx context.Context, req *metricsexplorertypes.TreemapRequest) ([]metricsexplorertypes.TreemapEntry, error) {
 	ctx = m.withMetricsExplorerContext(ctx, "computeTimeseriesTreemap")
 
+	hasFilter := req.Filter != nil && strings.TrimSpace(req.Filter.Expression) != ""
+	var filterWhereClause *sqlbuilder.WhereClause
+	if hasFilter {
+		var err error
+		filterWhereClause, err = m.buildFilterClause(ctx, req.Filter, req.Start, req.End)
+		if err != nil {
+			return nil, err
+		}
+	}
+
 	start, end, distributedTsTable, _ := telemetrymetrics.WhichTSTableToUse(uint64(req.Start), uint64(req.End), nil)
 
 	totalTSBuilder := sqlbuilder.NewSelectBuilder()
@@ -1151,12 +1163,22 @@ func (m *module) computeTimeseriesTreemap(ctx context.Context, req *metricsexplo
 	return entries, nil
 }
 
-func (m *module) computeSamplesTreemap(ctx context.Context, req *metricsexplorertypes.TreemapRequest, filterWhereClause *sqlbuilder.WhereClause) ([]metricsexplorertypes.TreemapEntry, error) {
+func (m *module) computeSamplesTreemap(ctx context.Context, req *metricsexplorertypes.TreemapRequest) ([]metricsexplorertypes.TreemapEntry, error) {
 	ctx = m.withMetricsExplorerContext(ctx, "computeSamplesTreemap")
 
+	hasFilter := req.Filter != nil && strings.TrimSpace(req.Filter.Expression) != ""
+	var filterWhereClause *sqlbuilder.WhereClause
+	if hasFilter {
+		var err error
+		filterWhereClause, err = m.buildFilterClause(ctx, req.Filter, req.Start, req.End)
+		if err != nil {
+			return nil, err
+		}
+	}
+
 	start, end, distributedTsTable, localTsTable := telemetrymetrics.WhichTSTableToUse(uint64(req.Start), uint64(req.End), nil)
-	samplesTable, _ := telemetrymetrics.WhichSamplesTableToUse(uint64(req.Start), uint64(req.End), metrictypes.UnspecifiedType, metrictypes.TimeAggregationUnspecified, nil)
-	countExp := telemetrymetrics.CountExpressionForSamplesTable(samplesTable)
+	distributedSamplesTable, _ := telemetrymetrics.WhichSamplesTableToUse(uint64(req.Start), uint64(req.End), metrictypes.UnspecifiedType, metrictypes.TimeAggregationUnspecified, nil)
+	countExp := telemetrymetrics.CountExpressionForSamplesTable(distributedSamplesTable)
 
 	candidateLimit := req.Limit + 50
 
@@ -1179,7 +1201,7 @@ func (m *module) computeSamplesTreemap(ctx context.Context, req *metricsexplorer
 
 	totalSamplesSB := sqlbuilder.NewSelectBuilder()
 	totalSamplesSB.Select(fmt.Sprintf("%s AS total_samples", countExp))
-	totalSamplesSB.From(fmt.Sprintf("%s.%s", telemetrymetrics.DBName, samplesTable))
+	totalSamplesSB.From(fmt.Sprintf("%s.%s", telemetrymetrics.DBName, distributedSamplesTable))
 	totalSamplesSB.Where(totalSamplesSB.Between("unix_milli", req.Start, req.End))
 
 	sampleCountsSB := sqlbuilder.NewSelectBuilder()
@@ -1187,7 +1209,7 @@ func (m *module) computeSamplesTreemap(ctx context.Context, req *metricsexplorer
 		"metric_name",
 		fmt.Sprintf("%s AS samples", countExp),
 	)
-	sampleCountsSB.From(fmt.Sprintf("%s.%s", telemetrymetrics.DBName, samplesTable))
+	sampleCountsSB.From(fmt.Sprintf("%s.%s", telemetrymetrics.DBName, distributedSamplesTable))
 	sampleCountsSB.Where(sampleCountsSB.Between("unix_milli", req.Start, req.End))
 	sampleCountsSB.Where("metric_name GLOBAL IN (SELECT metric_name FROM __metric_candidates)")
 

pkg/modules/metricsexplorer/implmetricsexplorer/module_test.go

@@ -0,0 +1,270 @@
+package implmetricsexplorer_test
+
+import (
+	"context"
+	"regexp"
+	"testing"
+
+	"github.com/DATA-DOG/go-sqlmock"
+	cmock "github.com/SigNoz/clickhouse-go-mock"
+	"github.com/SigNoz/signoz/pkg/cache"
+	"github.com/SigNoz/signoz/pkg/cache/cachetest"
+	"github.com/SigNoz/signoz/pkg/errors"
+	"github.com/SigNoz/signoz/pkg/instrumentation/instrumentationtest"
+	"github.com/SigNoz/signoz/pkg/modules/metricsexplorer"
+	"github.com/SigNoz/signoz/pkg/modules/metricsexplorer/implmetricsexplorer"
+	"github.com/SigNoz/signoz/pkg/telemetrystore"
+	"github.com/SigNoz/signoz/pkg/telemetrystore/telemetrystoretest"
+	"github.com/SigNoz/signoz/pkg/types/metricsexplorertypes"
+	qbtypes "github.com/SigNoz/signoz/pkg/types/querybuildertypes/querybuildertypesv5"
+	"github.com/SigNoz/signoz/pkg/types/telemetrytypes"
+	"github.com/SigNoz/signoz/pkg/types/telemetrytypes/telemetrytypestest"
+	"github.com/SigNoz/signoz/pkg/valuer"
+	"github.com/stretchr/testify/assert"
+)
+
+const (
+	// fixed, deterministic time window (range < 6h so the table selectors resolve
+	// to stable table names that the expected SQL strings can hard-code).
+	testStartMillis                int64 = 1700000000000
+	testEndMillis                  int64 = 1700003600000 // +1h
+	statsNoFilterSQL                     = "WITH __time_series_counts AS (SELECT metric_name, uniq(fingerprint) AS timeseries FROM signoz_metrics.distributed_time_series_v4 WHERE unix_milli BETWEEN ? AND ? AND NOT startsWith(metric_name, 'signoz') AND __normalized = ? GROUP BY metric_name), __sample_counts AS (SELECT metric_name, count(*) AS samples FROM signoz_metrics.distributed_samples_v4 WHERE unix_milli BETWEEN ? AND ? AND NOT startsWith(metric_name, 'signoz') AND metric_name IN (SELECT DISTINCT metric_name FROM signoz_metrics.time_series_v4 WHERE unix_milli BETWEEN ? AND ? AND NOT startsWith(metric_name, 'signoz') AND __normalized = ?) GROUP BY metric_name) SELECT COALESCE(ts.metric_name, s.metric_name) AS metric_name, COALESCE(ts.timeseries, 0) AS timeseries, COALESCE(s.samples, 0) AS samples, COUNT(*) OVER() AS total FROM __time_series_counts ts FULL OUTER JOIN __sample_counts s ON ts.metric_name = s.metric_name WHERE (COALESCE(ts.timeseries, 0) > 0 OR COALESCE(s.samples, 0) > 0) ORDER BY samples DESC, metric_name ASC LIMIT ? OFFSET ?"
+	statsOrderTimeseriesSQL              = "WITH __time_series_counts AS (SELECT metric_name, uniq(fingerprint) AS timeseries FROM signoz_metrics.distributed_time_series_v4 WHERE unix_milli BETWEEN ? AND ? AND NOT startsWith(metric_name, 'signoz') AND __normalized = ? GROUP BY metric_name), __sample_counts AS (SELECT metric_name, count(*) AS samples FROM signoz_metrics.distributed_samples_v4 WHERE unix_milli BETWEEN ? AND ? AND NOT startsWith(metric_name, 'signoz') AND metric_name IN (SELECT DISTINCT metric_name FROM signoz_metrics.time_series_v4 WHERE unix_milli BETWEEN ? AND ? AND NOT startsWith(metric_name, 'signoz') AND __normalized = ?) GROUP BY metric_name) SELECT COALESCE(ts.metric_name, s.metric_name) AS metric_name, COALESCE(ts.timeseries, 0) AS timeseries, COALESCE(s.samples, 0) AS samples, COUNT(*) OVER() AS total FROM __time_series_counts ts FULL OUTER JOIN __sample_counts s ON ts.metric_name = s.metric_name WHERE (COALESCE(ts.timeseries, 0) > 0 OR COALESCE(s.samples, 0) > 0) ORDER BY timeseries ASC, metric_name ASC LIMIT ? OFFSET ?"
+	statsWithFilterSQL                   = "WITH __time_series_counts AS (SELECT metric_name, uniq(fingerprint) AS timeseries FROM signoz_metrics.distributed_time_series_v4 WHERE unix_milli BETWEEN ? AND ? AND NOT startsWith(metric_name, 'signoz') AND __normalized = ? AND JSONExtractString(labels, 'host.name') = ? GROUP BY metric_name), __filtered_fingerprints AS (SELECT fingerprint FROM signoz_metrics.time_series_v4 WHERE unix_milli BETWEEN ? AND ? AND NOT startsWith(metric_name, 'signoz') AND __normalized = ? AND JSONExtractString(labels, 'host.name') = ? GROUP BY fingerprint), __sample_counts AS (SELECT metric_name, count(*) AS samples FROM signoz_metrics.distributed_samples_v4 WHERE unix_milli BETWEEN ? AND ? AND NOT startsWith(metric_name, 'signoz') AND fingerprint IN (SELECT fingerprint FROM __filtered_fingerprints) GROUP BY metric_name) SELECT COALESCE(ts.metric_name, s.metric_name) AS metric_name, COALESCE(ts.timeseries, 0) AS timeseries, COALESCE(s.samples, 0) AS samples, COUNT(*) OVER() AS total FROM __time_series_counts ts FULL OUTER JOIN __sample_counts s ON ts.metric_name = s.metric_name WHERE (COALESCE(ts.timeseries, 0) > 0 OR COALESCE(s.samples, 0) > 0) ORDER BY samples DESC, metric_name ASC LIMIT ? OFFSET ?"
+	treemapTimeseriesNoFilterSQL         = "WITH __total_time_series AS (SELECT uniq(fingerprint) AS total_time_series FROM signoz_metrics.distributed_time_series_v4 WHERE unix_milli BETWEEN ? AND ? AND __normalized = ?), __metric_totals AS (SELECT metric_name, uniq(fingerprint) AS total_value FROM signoz_metrics.distributed_time_series_v4 WHERE unix_milli BETWEEN ? AND ? AND NOT startsWith(metric_name, 'signoz') AND __normalized = ? GROUP BY metric_name) SELECT mt.metric_name, mt.total_value, CASE WHEN tts.total_time_series = 0 THEN 0 ELSE (mt.total_value * 100.0 / tts.total_time_series) END AS percentage FROM __metric_totals mt JOIN __total_time_series tts ON 1=1 ORDER BY percentage DESC LIMIT ?"
+	treemapTimeseriesWithFilterSQL       = "WITH __total_time_series AS (SELECT uniq(fingerprint) AS total_time_series FROM signoz_metrics.distributed_time_series_v4 WHERE unix_milli BETWEEN ? AND ? AND __normalized = ?), __metric_totals AS (SELECT metric_name, uniq(fingerprint) AS total_value FROM signoz_metrics.distributed_time_series_v4 WHERE unix_milli BETWEEN ? AND ? AND NOT startsWith(metric_name, 'signoz') AND __normalized = ? AND JSONExtractString(labels, 'host.name') = ? GROUP BY metric_name) SELECT mt.metric_name, mt.total_value, CASE WHEN tts.total_time_series = 0 THEN 0 ELSE (mt.total_value * 100.0 / tts.total_time_series) END AS percentage FROM __metric_totals mt JOIN __total_time_series tts ON 1=1 ORDER BY percentage DESC LIMIT ?"
+	treemapSamplesNoFilterSQL            = "WITH __metric_candidates AS (SELECT metric_name FROM signoz_metrics.distributed_time_series_v4 WHERE NOT startsWith(metric_name, 'signoz') AND __normalized = ? AND unix_milli BETWEEN ? AND ? GROUP BY metric_name ORDER BY uniq(fingerprint) DESC LIMIT ?), __sample_counts AS (SELECT metric_name, count(*) AS samples FROM signoz_metrics.distributed_samples_v4 WHERE unix_milli BETWEEN ? AND ? AND metric_name GLOBAL IN (SELECT metric_name FROM __metric_candidates) GROUP BY metric_name), __total_samples AS (SELECT count(*) AS total_samples FROM signoz_metrics.distributed_samples_v4 WHERE unix_milli BETWEEN ? AND ?) SELECT mc.metric_name, COALESCE(sc.samples, 0) AS samples, CASE WHEN ts.total_samples = 0 THEN 0 ELSE (COALESCE(sc.samples, 0) * 100.0 / ts.total_samples) END AS percentage FROM __metric_candidates mc LEFT JOIN __sample_counts sc ON mc.metric_name = sc.metric_name JOIN __total_samples ts ON 1=1 ORDER BY percentage DESC LIMIT ?"
+	treemapSamplesWithFilterSQL          = "WITH __metric_candidates AS (SELECT metric_name FROM signoz_metrics.distributed_time_series_v4 WHERE NOT startsWith(metric_name, 'signoz') AND __normalized = ? AND unix_milli BETWEEN ? AND ? AND JSONExtractString(labels, 'host.name') = ? GROUP BY metric_name ORDER BY uniq(fingerprint) DESC LIMIT ?), __filtered_fingerprints AS (SELECT fingerprint FROM signoz_metrics.time_series_v4 WHERE unix_milli BETWEEN ? AND ? AND NOT startsWith(metric_name, 'signoz') AND __normalized = ? AND JSONExtractString(labels, 'host.name') = ? AND metric_name GLOBAL IN (SELECT metric_name FROM __metric_candidates) GROUP BY fingerprint), __sample_counts AS (SELECT metric_name, count(*) AS samples FROM signoz_metrics.distributed_samples_v4 WHERE unix_milli BETWEEN ? AND ? AND metric_name GLOBAL IN (SELECT metric_name FROM __metric_candidates) AND fingerprint IN (SELECT fingerprint FROM __filtered_fingerprints) GROUP BY metric_name), __total_samples AS (SELECT count(*) AS total_samples FROM signoz_metrics.distributed_samples_v4 WHERE unix_milli BETWEEN ? AND ?) SELECT mc.metric_name, COALESCE(sc.samples, 0) AS samples, CASE WHEN ts.total_samples = 0 THEN 0 ELSE (COALESCE(sc.samples, 0) * 100.0 / ts.total_samples) END AS percentage FROM __metric_candidates mc LEFT JOIN __sample_counts sc ON mc.metric_name = sc.metric_name JOIN __total_samples ts ON 1=1 ORDER BY percentage DESC LIMIT ?"
+)
+
+var testOrgID = valuer.GenerateUUID()
+
+type statsOpt func(*metricsexplorertypes.StatsRequest)
+
+type treemapOpt func(*metricsexplorertypes.TreemapRequest)
+
+// newTestModule builds the metricsexplorer module backed by a mocked clickhouse
+// connection, a mock metadata store, and an in-memory cache.
+func newTestModule(t *testing.T, matcher sqlmock.QueryMatcher) (metricsexplorer.Module, cmock.ClickConnMockCommon, *telemetrytypestest.MockMetadataStore) {
+	t.Helper()
+
+	ts := telemetrystoretest.New(telemetrystore.Config{}, matcher)
+	md := telemetrytypestest.NewMockMetadataStore()
+	c, err := cachetest.New(cache.Config{Provider: "memory", Memory: cache.Memory{NumCounters: 1000, MaxCost: 1 << 20}})
+	if err != nil {
+		t.Fatalf("cachetest.New: %v", err)
+	}
+
+	settings := instrumentationtest.New().ToProviderSettings()
+	mod := implmetricsexplorer.NewModule(ts, md, c, nil /*ruleStore*/, nil /*dashboardModule*/, settings, metricsexplorer.Config{})
+
+	return mod, ts.Mock(), md
+}
+
+func statsRequest(opts ...statsOpt) *metricsexplorertypes.StatsRequest {
+	req := &metricsexplorertypes.StatsRequest{
+		Start: testStartMillis,
+		End:   testEndMillis,
+		Limit: 10,
+	}
+	for _, o := range opts {
+		o(req)
+	}
+	return req
+}
+
+func withStatsFilter(expr string) statsOpt {
+	return func(req *metricsexplorertypes.StatsRequest) {
+		req.Filter = &qbtypes.Filter{Expression: expr}
+	}
+}
+
+func withStatsLimit(limit int) statsOpt {
+	return func(req *metricsexplorertypes.StatsRequest) {
+		req.Limit = limit
+	}
+}
+
+func withStatsOrderBy(name string, dir qbtypes.OrderDirection) statsOpt {
+	return func(req *metricsexplorertypes.StatsRequest) {
+		req.OrderBy = &qbtypes.OrderBy{
+			Key:       qbtypes.OrderByKey{TelemetryFieldKey: telemetrytypes.TelemetryFieldKey{Name: name}},
+			Direction: dir,
+		}
+	}
+}
+
+func treemapRequest(mode metricsexplorertypes.TreemapMode, opts ...treemapOpt) *metricsexplorertypes.TreemapRequest {
+	req := &metricsexplorertypes.TreemapRequest{
+		Start: testStartMillis,
+		End:   testEndMillis,
+		Limit: 10,
+		Mode:  mode,
+	}
+	for _, o := range opts {
+		o(req)
+	}
+	return req
+}
+
+func withTreemapFilter(expr string) treemapOpt {
+	return func(req *metricsexplorertypes.TreemapRequest) {
+		req.Filter = &qbtypes.Filter{Expression: expr}
+	}
+}
+
+// seedFilterKey registers a string attribute field so buildFilterClause can
+// resolve it when parsing a filter expression that references it.
+func seedFilterKey(md *telemetrytypestest.MockMetadataStore, name string) {
+	md.KeysMap[name] = []*telemetrytypes.TelemetryFieldKey{
+		{
+			Name:          name,
+			Signal:        telemetrytypes.SignalMetrics,
+			FieldContext:  telemetrytypes.FieldContextAttribute,
+			FieldDataType: telemetrytypes.FieldDataTypeString,
+		},
+	}
+}
+
+// anyArgs returns n nil wildcards. cmock treats a nil expected arg as a match
+// for any actual value, so this asserts only the bound-arg count, not values
+// (the SQL text itself is what we verify). The count must match the query.
+func anyArgs(n int) []any {
+	return make([]any, n)
+}
+
+func treemapEntryRows() *cmock.Rows {
+	return cmock.NewRows(
+		[]cmock.ColumnType{
+			{Name: "metric_name", Type: "String"},
+			{Name: "total_value", Type: "UInt64"},
+			{Name: "percentage", Type: "Float64"},
+		},
+		[][]any{
+			{"metric_a", uint64(50), 50.0},
+			{"metric_b", uint64(30), 30.0},
+		},
+	)
+}
+
+func TestGetStats(t *testing.T) {
+	tests := []struct {
+		name      string
+		opts      []statsOpt
+		seedKey   string
+		queryErr  error
+		expectSQL string
+		argCount  int
+		noQuery   bool // SQL never reaches clickhouse (validation/build error)
+		wantCode  errors.Code
+	}{
+		{name: "NoFilter_FastPathSQL", expectSQL: statsNoFilterSQL, argCount: 10},
+		{name: "WhitespaceFilter_FastPathSQL", opts: []statsOpt{withStatsFilter("   ")}, expectSQL: statsNoFilterSQL, argCount: 10},
+		{name: "WithFilter_FingerprintSQL", opts: []statsOpt{withStatsFilter("host.name = 'foo'")}, seedKey: "host.name", expectSQL: statsWithFilterSQL, argCount: 12},
+		{name: "OrderByTimeseriesAsc", opts: []statsOpt{withStatsOrderBy("timeseries", qbtypes.OrderDirectionAsc)}, expectSQL: statsOrderTimeseriesSQL, argCount: 10},
+		{name: "OrderByInvalid", opts: []statsOpt{withStatsOrderBy("nonsense", qbtypes.OrderDirectionAsc)}, noQuery: true, wantCode: errors.CodeInvalidInput},
+		{name: "QueryError", queryErr: assert.AnError, expectSQL: statsNoFilterSQL, argCount: 10, wantCode: errors.CodeInternal},
+		{name: "InvalidRequest_Limit", opts: []statsOpt{withStatsLimit(0)}, noQuery: true, wantCode: errors.CodeInvalidInput},
+	}
+
+	for _, tc := range tests {
+		t.Run(tc.name, func(t *testing.T) {
+			mod, mock, md := newTestModule(t, sqlmock.QueryMatcherRegexp)
+			if tc.seedKey != "" {
+				seedFilterKey(md, tc.seedKey)
+			}
+
+			if !tc.noQuery {
+				eq := mock.ExpectQuery(regexp.QuoteMeta(tc.expectSQL)).WithArgs(anyArgs(tc.argCount)...)
+				if tc.queryErr != nil {
+					eq.WillReturnError(tc.queryErr)
+				} else {
+					eq.WillReturnRows(cmock.NewRows(nil, nil))
+				}
+			}
+
+			_, err := mod.GetStats(context.Background(), testOrgID, statsRequest(tc.opts...))
+			if tc.wantCode.String() != "" {
+				assert.Error(t, err)
+				assert.Truef(t, errors.Asc(err, tc.wantCode), "want code %s, got %v", tc.wantCode, err)
+				return
+			}
+			assert.NoError(t, err)
+			assert.NoError(t, mock.ExpectationsWereMet())
+		})
+	}
+}
+
+func TestGetTreemap(t *testing.T) {
+	wantEntries := []metricsexplorertypes.TreemapEntry{
+		{MetricName: "metric_a", TotalValue: 50, Percentage: 50.0},
+		{MetricName: "metric_b", TotalValue: 30, Percentage: 30.0},
+	}
+
+	tests := []struct {
+		name        string
+		mode        metricsexplorertypes.TreemapMode
+		opts        []treemapOpt
+		seedKey     string
+		queryErr    error
+		expectSQL   string
+		argCount    int
+		rows        *cmock.Rows
+		wantSamples []metricsexplorertypes.TreemapEntry
+		wantTS      []metricsexplorertypes.TreemapEntry
+		noQuery     bool
+		wantCode    errors.Code
+		wantErr     bool
+	}{
+		{name: "TimeSeries_NoFilter_SQL", mode: metricsexplorertypes.TreemapModeTimeSeries, expectSQL: treemapTimeseriesNoFilterSQL, argCount: 7},
+		{name: "TimeSeries_WithFilter_SQL", mode: metricsexplorertypes.TreemapModeTimeSeries, opts: []treemapOpt{withTreemapFilter("host.name = 'foo'")}, seedKey: "host.name", expectSQL: treemapTimeseriesWithFilterSQL, argCount: 8},
+		{name: "TimeSeries_ScansEntries", mode: metricsexplorertypes.TreemapModeTimeSeries, expectSQL: treemapTimeseriesNoFilterSQL, argCount: 7, rows: treemapEntryRows(), wantTS: wantEntries},
+		{name: "Samples_NoFilter_SQL", mode: metricsexplorertypes.TreemapModeSamples, expectSQL: treemapSamplesNoFilterSQL, argCount: 9},
+		{name: "Samples_WithFilter_SQL", mode: metricsexplorertypes.TreemapModeSamples, opts: []treemapOpt{withTreemapFilter("host.name = 'foo'")}, seedKey: "host.name", expectSQL: treemapSamplesWithFilterSQL, argCount: 14},
+		{name: "Samples_ScansEntries", mode: metricsexplorertypes.TreemapModeSamples, expectSQL: treemapSamplesNoFilterSQL, argCount: 9, rows: treemapEntryRows(), wantSamples: wantEntries},
+		{name: "FilterBuildError", mode: metricsexplorertypes.TreemapModeTimeSeries, opts: []treemapOpt{withTreemapFilter("host.name =")}, noQuery: true, wantErr: true},
+		{name: "QueryError", mode: metricsexplorertypes.TreemapModeTimeSeries, queryErr: assert.AnError, expectSQL: treemapTimeseriesNoFilterSQL, argCount: 7, wantCode: errors.CodeInternal},
+		{name: "InvalidMode", mode: metricsexplorertypes.TreemapMode{}, noQuery: true, wantCode: errors.CodeInvalidInput},
+	}
+
+	for _, tc := range tests {
+		t.Run(tc.name, func(t *testing.T) {
+			mod, mock, md := newTestModule(t, sqlmock.QueryMatcherRegexp)
+			if tc.seedKey != "" {
+				seedFilterKey(md, tc.seedKey)
+			}
+
+			if !tc.noQuery {
+				eq := mock.ExpectQuery(regexp.QuoteMeta(tc.expectSQL)).WithArgs(anyArgs(tc.argCount)...)
+				switch {
+				case tc.queryErr != nil:
+					eq.WillReturnError(tc.queryErr)
+				case tc.rows != nil:
+					eq.WillReturnRows(tc.rows)
+				default:
+					eq.WillReturnRows(cmock.NewRows(nil, nil))
+				}
+			}
+
+			resp, err := mod.GetTreemap(context.Background(), testOrgID, treemapRequest(tc.mode, tc.opts...))
+			switch {
+			case tc.wantCode.String() != "":
+				assert.Error(t, err)
+				assert.Truef(t, errors.Asc(err, tc.wantCode), "want code %s, got %v", tc.wantCode, err)
+				return
+			case tc.wantErr:
+				assert.Error(t, err)
+				return
+			}
+
+			assert.NoError(t, err)
+			assert.NoError(t, mock.ExpectationsWereMet())
+			if tc.wantTS != nil {
+				assert.Equal(t, tc.wantTS, resp.TimeSeries)
+			}
+			if tc.wantSamples != nil {
+				assert.Equal(t, tc.wantSamples, resp.Samples)
+			}
+		})
+	}
+}

pkg/modules/session/implsession/handler.go

@@ -4,9 +4,11 @@ import (
 	"context"
 	"net/http"
 	"net/url"
+	"path"
 	"time"
 
 	"github.com/SigNoz/signoz/pkg/errors"
+	"github.com/SigNoz/signoz/pkg/global"
 	"github.com/SigNoz/signoz/pkg/http/binding"
 	"github.com/SigNoz/signoz/pkg/http/render"
 	"github.com/SigNoz/signoz/pkg/modules/session"
@@ -15,11 +17,12 @@ import (
 )
 
 type handler struct {
-	module session.Module
+	module       session.Module
+	globalConfig global.Config
 }
 
-func NewHandler(module session.Module) session.Handler {
-	return &handler{module: module}
+func NewHandler(module session.Module, globalConfig global.Config) session.Handler {
+	return &handler{module: module, globalConfig: globalConfig}
 }
 
 func (handler *handler) GetSessionContext(rw http.ResponseWriter, req *http.Request) {
@@ -158,13 +161,13 @@ func (handler *handler) DeleteSession(rw http.ResponseWriter, req *http.Request)
 	render.Success(rw, http.StatusNoContent, nil)
 }
 
-func (*handler) getRedirectURLFromErr(err error) string {
+func (handler *handler) getRedirectURLFromErr(err error) string {
 	values := errors.AsURLValues(err)
 	values.Add("callbackauthnerr", "true")
 
 	return (&url.URL{
 		// When UI is being served on a prefix, we need to redirect to the login page on the prefix.
-		Path:     "/login",
+		Path:     path.Join(handler.globalConfig.ExternalPath(), "/login"),
 		RawQuery: values.Encode(),
 	}).String()
 }

pkg/modules/tracedetail/config.go

@@ -6,7 +6,16 @@ import (
 )
 
 type Config struct {
-	Waterfall WaterfallConfig `mapstructure:"waterfall"`
+	Waterfall  WaterfallConfig  `mapstructure:"waterfall"`
+	Flamegraph FlamegraphConfig `mapstructure:"flamegraph"`
+}
+
+type FlamegraphConfig struct {
+	MaxSelectedLevels            int  `mapstructure:"max_selected_levels"`
+	MaxSpansPerLevel             int  `mapstructure:"max_spans_per_level"`
+	SamplingTopLatencySpansCount int  `mapstructure:"sampling_top_latency_count"`
+	SamplingBucketCount          int  `mapstructure:"sampling_bucket_count"`
+	SelectAllSpansLimit          uint `mapstructure:"select_all_spans_limit"`
 }
 
 type WaterfallConfig struct {
@@ -29,6 +38,13 @@ func newConfig() factory.Config {
 			MaxDepthToAutoExpand:     5,
 			MaxLimitToSelectAllSpans: 10_000,
 		},
+		Flamegraph: FlamegraphConfig{
+			MaxSelectedLevels:            50,
+			MaxSpansPerLevel:             100,
+			SamplingTopLatencySpansCount: 5,
+			SamplingBucketCount:          50,
+			SelectAllSpansLimit:          100_000,
+		},
 	}
 }
 
@@ -42,5 +58,20 @@ func (c Config) Validate() error {
 	if c.Waterfall.MaxLimitToSelectAllSpans == 0 {
 		return errors.NewInvalidInputf(errors.CodeInvalidInput, "traces.waterfall.max_limit_to_select_all_spans must be positive")
 	}
+	if c.Flamegraph.MaxSelectedLevels <= 0 {
+		return errors.NewInvalidInputf(errors.CodeInvalidInput, "traces.flamegraph.max_selected_levels must be positive, got %d", c.Flamegraph.MaxSelectedLevels)
+	}
+	if c.Flamegraph.MaxSpansPerLevel <= 0 {
+		return errors.NewInvalidInputf(errors.CodeInvalidInput, "traces.flamegraph.max_spans_per_level must be positive, got %d", c.Flamegraph.MaxSpansPerLevel)
+	}
+	if c.Flamegraph.SamplingTopLatencySpansCount < 0 {
+		return errors.NewInvalidInputf(errors.CodeInvalidInput, "traces.flamegraph.sampling_top_latency_count cannot be negative, got %d", c.Flamegraph.SamplingTopLatencySpansCount)
+	}
+	if c.Flamegraph.SamplingBucketCount <= 0 {
+		return errors.NewInvalidInputf(errors.CodeInvalidInput, "traces.flamegraph.sampling_bucket_count must be positive, got %d", c.Flamegraph.SamplingBucketCount)
+	}
+	if c.Flamegraph.SelectAllSpansLimit == 0 {
+		return errors.NewInvalidInputf(errors.CodeInvalidInput, "traces.flamegraph.select_all_spans_limit must be positive")
+	}
 	return nil
 }

pkg/modules/tracedetail/impltracedetail/handler.go

@@ -80,3 +80,19 @@ func (h *handler) GetTraceAggregations(rw http.ResponseWriter, r *http.Request)
 
 	render.Success(rw, http.StatusOK, result)
 }
+
+func (h *handler) GetFlamegraph(rw http.ResponseWriter, r *http.Request) {
+	req := new(spantypes.PostableFlamegraph)
+	if err := binding.JSON.BindBody(r.Body, req); err != nil {
+		render.Error(rw, err)
+		return
+	}
+
+	result, err := h.module.GetFlamegraph(r.Context(), mux.Vars(r)["traceID"], req.SelectedSpanID, req.SelectFields)
+	if err != nil {
+		render.Error(rw, err)
+		return
+	}
+
+	render.Success(rw, http.StatusOK, result)
+}

pkg/modules/tracedetail/impltracedetail/module.go

@@ -7,6 +7,7 @@ import (
 	"github.com/SigNoz/signoz/pkg/factory"
 	"github.com/SigNoz/signoz/pkg/modules/tracedetail"
 	"github.com/SigNoz/signoz/pkg/types/spantypes"
+	"github.com/SigNoz/signoz/pkg/types/telemetrytypes"
 	"go.opentelemetry.io/otel/metric"
 )
 
@@ -33,6 +34,7 @@ func NewModule(traceStore spantypes.TraceStore, providerSettings factory.Provide
 	}
 
 	m.metrics.waterfallSpanLimit.Record(context.Background(), int64(cfg.Waterfall.MaxLimitToSelectAllSpans), metric.WithAttributes(attrResponseType.String(attrResponseTypeWindowed)))
+	m.metrics.flamegraphSpanLimit.Record(context.Background(), int64(cfg.Flamegraph.SelectAllSpansLimit), metric.WithAttributes(attrResponseType.String(attrResponseTypeSampled)))
 
 	return m
 }
@@ -164,6 +166,18 @@ func (m *module) GetTraceAggregations(ctx context.Context, traceID string, req *
 	return &spantypes.GettableTraceAggregations{Aggregations: results}, nil
 }
 
+func (m *module) GetFlamegraph(ctx context.Context, traceID string, selectedSpanID string, selectFields []telemetrytypes.TelemetryFieldKey) (*spantypes.GettableFlamegraphTrace, error) {
+	summary, err := m.store.GetTraceSummary(ctx, traceID)
+	if err != nil {
+		return nil, err
+	}
+	if summary.NumSpans <= uint64(m.config.Flamegraph.SelectAllSpansLimit) {
+		return m.getFullFlamegraph(ctx, traceID, summary, selectFields)
+	}
+	m.metrics.flamegraphRequestCount.Add(ctx, 1, metric.WithAttributes(attrResponseType.String(attrResponseTypeSampled)))
+	return m.getWindowedFlamegraph(ctx, traceID, selectedSpanID, summary, selectFields)
+}
+
 // getWindowedWaterfall builds the waterfall tree with minimal data and then returns only a window of full spans.
 func (m *module) getWindowedWaterfall(ctx context.Context, traceID, selectedSpanID string, uncollapsedSpans []string, start, end time.Time) (*spantypes.GettableWaterfallTrace, error) {
 	// Step 1: minimal fetch → build full tree → select visible window
@@ -204,3 +218,47 @@ func (m *module) getWindowedWaterfall(ctx context.Context, traceID, selectedSpan
 		waterfallTrace, selectedSpans, uncollapsedSpans, false, nil,
 	), nil
 }
+
+func (m *module) getFullFlamegraph(ctx context.Context, traceID string, summary *spantypes.TraceSummary, selectFields []telemetrytypes.TelemetryFieldKey) (*spantypes.GettableFlamegraphTrace, error) {
+	fullSpans, err := m.store.GetFlamegraphSpans(ctx, traceID, summary.Start, summary.End, nil)
+	if err != nil {
+		return nil, err
+	}
+	if len(fullSpans) == 0 {
+		return nil, spantypes.ErrTraceNotFound
+	}
+	flamegraphTrace := spantypes.NewFlamegraphTraceFromStorable(fullSpans, selectFields)
+	return spantypes.NewGettableFlamegraphTrace(flamegraphTrace.GetAllLevels(), summary.Start.UnixMilli(), summary.End.UnixMilli(), false), nil
+}
+
+// getWindowedFlamegraph returns a window of a max levels and max sampled spans per level around the selected span.
+func (m *module) getWindowedFlamegraph(ctx context.Context, traceID, selectedSpanID string, summary *spantypes.TraceSummary, selectFields []telemetrytypes.TelemetryFieldKey) (*spantypes.GettableFlamegraphTrace, error) {
+	minimalSpans, err := m.store.GetMinimalSpans(ctx, traceID, summary.Start, summary.End)
+	if err != nil {
+		return nil, err
+	}
+	if len(minimalSpans) == 0 {
+		return nil, spantypes.ErrTraceNotFound
+	}
+
+	flamegraphTrace := spantypes.NewFlamegraphTraceFromMinimal(minimalSpans)
+	minimalSpans = nil //nolint:ineffassign,wastedassign // release backing array before further db calls
+
+	cfg := m.config.Flamegraph
+	selectedSpans := flamegraphTrace.GetSelectedLevels(selectedSpanID, cfg.MaxSelectedLevels, cfg.MaxSpansPerLevel, cfg.SamplingTopLatencySpansCount, cfg.SamplingBucketCount)
+	if len(selectedSpans) == 0 {
+		return nil, spantypes.ErrTraceNotFound
+	}
+
+	fullSpans, err := m.store.GetFlamegraphSpans(ctx, traceID, summary.Start, summary.End, spantypes.FlamegraphWindowSpanIDs(selectedSpans))
+	if err != nil {
+		return nil, err
+	}
+
+	return spantypes.NewGettableFlamegraphTrace(
+		flamegraphTrace.EnrichSelectedSpans(selectedSpans, fullSpans, selectFields),
+		summary.Start.UnixMilli(),
+		summary.End.UnixMilli(),
+		true,
+	), nil
+}

pkg/modules/tracedetail/impltracedetail/store.go

@@ -154,6 +154,47 @@ func (s *traceStore) GetTraceSpansByIDs(ctx context.Context, traceID string, sta
 	return spans, nil
 }
 
+func (s *traceStore) GetFlamegraphSpans(ctx context.Context, traceID string, start, end time.Time, spanIDs []string) ([]spantypes.StorableSpan, error) {
+	sb := sqlbuilder.NewSelectBuilder()
+	sb.Select(
+		"span_id",
+		"any(parent_span_id) AS parent_span_id",
+		"any(timestamp) AS timestamp",
+		"any(duration_nano) AS duration_nano",
+		"any(has_error) AS has_error",
+		"any(name) AS name",
+		"any(events) AS events",
+		"any(attributes_string) AS attributes_string",
+		"any(attributes_number) AS attributes_number",
+		"any(attributes_bool) AS attributes_bool",
+		"any(resources_string) AS resources_string",
+	)
+	sb.From(fmt.Sprintf("%s.%s", spantypes.TraceDB, spantypes.TraceTable))
+	conditions := []string{
+		sb.E("trace_id", traceID),
+		sb.GE("ts_bucket_start", start.Unix()-1800),
+		sb.LE("ts_bucket_start", end.Unix()),
+	}
+	if len(spanIDs) > 0 {
+		ids := make([]any, len(spanIDs))
+		for i, id := range spanIDs {
+			ids[i] = id
+		}
+		conditions = append(conditions, sb.In("span_id", ids...))
+	}
+	sb.Where(conditions...)
+	sb.GroupBy("span_id")
+	sb.OrderByAsc("timestamp")
+	sb.OrderByAsc("name")
+	query, args := sb.BuildWithFlavor(sqlbuilder.ClickHouse)
+
+	var spans []spantypes.StorableSpan
+	if err := s.telemetryStore.ClickhouseDB().Select(ctx, &spans, query, args...); err != nil {
+		return nil, errors.WrapInternalf(err, errors.CodeInternal, "error querying flamegraph spans")
+	}
+	return spans, nil
+}
+
 func (s *traceStore) GetSpanCountByField(ctx context.Context, traceID string, summary *spantypes.TraceSummary, fieldKey telemetrytypes.TelemetryFieldKey) (map[string]uint64, error) {
 	fieldExpr, err := buildFieldExpr(fieldKey)
 	if err != nil {

pkg/modules/tracedetail/impltracedetail/store_test.go

@@ -91,6 +91,30 @@ func TestGetSpanCountByField(t *testing.T) {
 	}
 }
 
+func TestGetFlamegraphSpans(t *testing.T) {
+	baseSQL := "SELECT span_id, any(parent_span_id) AS parent_span_id, any(timestamp) AS timestamp, any(duration_nano) AS duration_nano, any(has_error) AS has_error, any(name) AS name, any(events) AS events, any(attributes_string) AS attributes_string, any(attributes_number) AS attributes_number, any(attributes_bool) AS attributes_bool, any(resources_string) AS resources_string FROM signoz_traces.distributed_signoz_index_v3 WHERE trace_id = ? AND ts_bucket_start >= ? AND ts_bucket_start <= ? GROUP BY span_id ORDER BY timestamp ASC, name ASC"
+	withSpanIDsSQL := "SELECT span_id, any(parent_span_id) AS parent_span_id, any(timestamp) AS timestamp, any(duration_nano) AS duration_nano, any(has_error) AS has_error, any(name) AS name, any(events) AS events, any(attributes_string) AS attributes_string, any(attributes_number) AS attributes_number, any(attributes_bool) AS attributes_bool, any(resources_string) AS resources_string FROM signoz_traces.distributed_signoz_index_v3 WHERE trace_id = ? AND ts_bucket_start >= ? AND ts_bucket_start <= ? AND span_id IN (?, ?) GROUP BY span_id ORDER BY timestamp ASC, name ASC"
+
+	tests := []struct {
+		name    string
+		spanIDs []string
+		sql     string
+	}{
+		{name: "NoSpanIDs_GeneratesBaseSQL", spanIDs: nil, sql: baseSQL},
+		{name: "WithSpanIDs_GeneratesInClauseSQL", spanIDs: []string{"span-1", "span-2"}, sql: withSpanIDsSQL},
+	}
+
+	for _, tc := range tests {
+		t.Run(tc.name, func(t *testing.T) {
+			s := newTestStore(sqlmock.QueryMatcherRegexp)
+			s.Mock().ExpectSelect(regexp.QuoteMeta(tc.sql)).
+				WillReturnRows(cmock.NewRows(nil, nil))
+			_, _ = s.Store().GetFlamegraphSpans(context.Background(), testTraceID, testStart, testEnd, tc.spanIDs)
+			assert.NoError(t, s.Mock().ExpectationsWereMet())
+		})
+	}
+}
+
 func TestGetSpanDurationByField(t *testing.T) {
 
 	expectedSQL := "WITH all_spans AS (SELECT DISTINCT ON (span_id) resource.`service.name`::String AS field_value, toUnixTimestamp64Nano(timestamp) AS start_ns, start_ns + duration_nano AS end_ns FROM signoz_traces.distributed_signoz_index_v3 WHERE trace_id = ? AND ts_bucket_start >= ? AND ts_bucket_start <= ? AND notEmpty(field_value) ORDER BY timestamp ASC, name ASC), effective_start AS (SELECT field_value, end_ns, greatest(start_ns, ifNull(max(end_ns) OVER (PARTITION BY field_value ORDER BY start_ns ROWS BETWEEN UNBOUNDED PRECEDING AND 1 PRECEDING), toUInt64(0))) AS effective_start_ns FROM all_spans) SELECT field_value, sum(toUInt64(greatest(end_ns - effective_start_ns, 0))) AS total_ns FROM effective_start GROUP BY field_value"

pkg/modules/tracedetail/impltracedetail/telemetry.go

@@ -9,12 +9,16 @@ import (
 const (
 	attrResponseType         = attribute.Key("response_type")
 	attrResponseTypeWindowed = "windowed"
+	attrResponseTypeSampled  = "sampled"
 )
 
 type moduleMetrics struct {
 	waterfallSpanLimit    metric.Int64Gauge
 	waterfallRequestCount metric.Int64Counter
 	waterfallSpanCount    metric.Int64Counter
+
+	flamegraphSpanLimit    metric.Int64Gauge
+	flamegraphRequestCount metric.Int64Counter
 }
 
 func newModuleMetrics(meter metric.Meter) (*moduleMetrics, error) {
@@ -47,9 +51,30 @@ func newModuleMetrics(meter metric.Meter) (*moduleMetrics, error) {
 		errs = errors.Join(errs, err)
 	}
 
+	flamegraphSpanLimit, err := meter.Int64Gauge(
+		"signoz.traces.flamegraph.span.limit",
+		metric.WithDescription("The span count limit above which sampled flamegraph is returned instead of the full flamegraph."),
+		metric.WithUnit("{span}"),
+	)
+	if err != nil {
+		errs = errors.Join(errs, err)
+	}
+
+	flamegraphRequestCount, err := meter.Int64Counter(
+		"signoz.traces.flamegraph.request.count",
+		metric.WithDescription("Total number of flamegraph requests, by response_type."),
+		metric.WithUnit("{request}"),
+	)
+	if err != nil {
+		errs = errors.Join(errs, err)
+	}
+
 	return &moduleMetrics{
 		waterfallSpanLimit:    spanLimit,
 		waterfallRequestCount: requestCount,
 		waterfallSpanCount:    spanCount,
+
+		flamegraphSpanLimit:    flamegraphSpanLimit,
+		flamegraphRequestCount: flamegraphRequestCount,
 	}, errs
 }

pkg/modules/tracedetail/tracedetail.go

@@ -5,6 +5,7 @@ import (
 	"net/http"
 
 	"github.com/SigNoz/signoz/pkg/types/spantypes"
+	"github.com/SigNoz/signoz/pkg/types/telemetrytypes"
 )
 
 // Handler exposes HTTP handlers for trace detail APIs.
@@ -12,6 +13,7 @@ type Handler interface {
 	GetWaterfall(http.ResponseWriter, *http.Request)
 	GetWaterfallV4(http.ResponseWriter, *http.Request)
 	GetTraceAggregations(http.ResponseWriter, *http.Request)
+	GetFlamegraph(http.ResponseWriter, *http.Request)
 }
 
 // Module defines the business logic for trace detail operations.
@@ -19,4 +21,5 @@ type Module interface {
 	GetWaterfall(ctx context.Context, traceID string, req *spantypes.PostableWaterfall) (*spantypes.GettableWaterfallTrace, error)
 	GetWaterfallV4(ctx context.Context, traceID string, selectedSpanID string, uncollapsedSpans []string, selectAllLimit uint) (*spantypes.GettableWaterfallTrace, error)
 	GetTraceAggregations(ctx context.Context, traceID string, req *spantypes.PostableTraceAggregations) (*spantypes.GettableTraceAggregations, error)
+	GetFlamegraph(ctx context.Context, traceID string, selectedSpanID string, selectFields []telemetrytypes.TelemetryFieldKey) (*spantypes.GettableFlamegraphTrace, error)
 }

pkg/signoz/authn.go

@@ -7,14 +7,15 @@ import (
 	"github.com/SigNoz/signoz/pkg/authn/callbackauthn/googlecallbackauthn"
 	"github.com/SigNoz/signoz/pkg/authn/passwordauthn/emailpasswordauthn"
 	"github.com/SigNoz/signoz/pkg/factory"
+	"github.com/SigNoz/signoz/pkg/global"
 	"github.com/SigNoz/signoz/pkg/licensing"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
 )
 
-func NewAuthNs(ctx context.Context, providerSettings factory.ProviderSettings, store authtypes.AuthNStore, licensing licensing.Licensing) (map[authtypes.AuthNProvider]authn.AuthN, error) {
+func NewAuthNs(ctx context.Context, providerSettings factory.ProviderSettings, store authtypes.AuthNStore, licensing licensing.Licensing, globalConfig global.Config) (map[authtypes.AuthNProvider]authn.AuthN, error) {
 	emailPasswordAuthN := emailpasswordauthn.New(store)
 
-	googleCallbackAuthN, err := googlecallbackauthn.New(ctx, store, providerSettings)
+	googleCallbackAuthN, err := googlecallbackauthn.New(ctx, store, providerSettings, globalConfig)
 	if err != nil {
 		return nil, err
 	}

pkg/signoz/provider.go

@@ -275,14 +275,14 @@ func NewQuerierProviderFactories(telemetryStore telemetrystore.TelemetryStore, p
 	)
 }
 
-func NewAPIServerProviderFactories(orgGetter organization.Getter, authz authz.AuthZ, modules Modules, handlers Handlers) factory.NamedMap[factory.ProviderFactory[apiserver.APIServer, apiserver.Config]] {
+func NewAPIServerProviderFactories(orgGetter organization.Getter, authz authz.AuthZ, modules Modules, handlers Handlers, globalConfig global.Config) factory.NamedMap[factory.ProviderFactory[apiserver.APIServer, apiserver.Config]] {
 	return factory.MustNewNamedMap(
 		signozapiserver.NewFactory(
 			orgGetter,
 			authz,
 			implorganization.NewHandler(modules.OrgGetter, modules.OrgSetter),
 			impluser.NewHandler(modules.UserSetter, modules.UserGetter),
-			implsession.NewHandler(modules.Session),
+			implsession.NewHandler(modules.Session, globalConfig),
 			implauthdomain.NewHandler(modules.AuthDomain),
 			implpreference.NewHandler(modules.Preference),
 			handlers.Global,

pkg/signoz/provider_test.go

@@ -95,6 +95,7 @@ func TestNewProviderFactories(t *testing.T) {
 			nil,
 			Modules{},
 			Handlers{},
+			global.Config{},
 		)
 	})
 }

pkg/signoz/signoz.go

@@ -542,7 +542,7 @@ func New(
 		ctx,
 		providerSettings,
 		config.APIServer,
-		NewAPIServerProviderFactories(orgGetter, authz, modules, handlers),
+		NewAPIServerProviderFactories(orgGetter, authz, modules, handlers, config.Global),
 		"signoz",
 	)
 	if err != nil {

pkg/types/cloudintegrationtypes/serviceid.go

@@ -27,6 +27,10 @@ var (
 	// Azure services.
 	AzureServiceStorageAccountsBlob = ServiceID{valuer.NewString("storageaccountsblob")}
 	AzureServiceCDNProfile          = ServiceID{valuer.NewString("cdnprofile")}
+	AzureServiceVirtualMachine      = ServiceID{valuer.NewString("virtualmachine")}
+	AzureServiceAppService          = ServiceID{valuer.NewString("appservice")}
+	AzureServiceContainerApp        = ServiceID{valuer.NewString("containerapp")}
+	AzureServiceAKS                 = ServiceID{valuer.NewString("aks")}
 )
 
 func (ServiceID) Enum() []any {
@@ -46,6 +50,10 @@ func (ServiceID) Enum() []any {
 		AWSServiceSQS,
 		AzureServiceStorageAccountsBlob,
 		AzureServiceCDNProfile,
+		AzureServiceVirtualMachine,
+		AzureServiceAppService,
+		AzureServiceContainerApp,
+		AzureServiceAKS,
 	}
 }
 
@@ -69,6 +77,10 @@ var SupportedServices = map[CloudProviderType][]ServiceID{
 	CloudProviderTypeAzure: {
 		AzureServiceStorageAccountsBlob,
 		AzureServiceCDNProfile,
+		AzureServiceVirtualMachine,
+		AzureServiceAppService,
+		AzureServiceContainerApp,
+		AzureServiceAKS,
 	},
 }
 

pkg/types/dashboardtypes/perses_dashboard.go

@@ -12,6 +12,7 @@ import (
 	"github.com/SigNoz/signoz/pkg/types/coretypes"
 	"github.com/SigNoz/signoz/pkg/types/tagtypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
+	"github.com/perses/spec/go/common"
 	"k8s.io/apimachinery/pkg/util/validation"
 )
 
@@ -157,6 +158,9 @@ func (p *PostableDashboardV2) UnmarshalJSON(data []byte) error {
 		return errors.WrapInvalidInputf(err, ErrCodeDashboardInvalidInput, "%s", err.Error())
 	}
 	*p = PostableDashboardV2(tmp)
+	if p.Spec.Display == nil {
+		p.Spec.Display = &common.Display{}
+	}
 	if !p.GenerateName && p.Spec.Display.Name == "" {
 		p.Spec.Display.Name = p.Name
 	}
@@ -183,7 +187,7 @@ func (p *PostableDashboardV2) validateName() error {
 	if p.Name != "" {
 		return errors.NewInvalidInputf(ErrCodeDashboardInvalidInput, "name must be empty when generateName is true, got %q", p.Name)
 	}
-	if p.Spec.Display.Name == "" {
+	if p.Spec.Display == nil || p.Spec.Display.Name == "" {
 		return errors.NewInvalidInputf(ErrCodeDashboardInvalidInput, "spec.display.name is required when generateName is true")
 	}
 	return nil
@@ -327,6 +331,9 @@ func (u *UpdatableDashboardV2) UnmarshalJSON(data []byte) error {
 		return errors.WrapInvalidInputf(err, ErrCodeDashboardInvalidInput, "%s", err.Error())
 	}
 	*u = UpdatableDashboardV2(tmp)
+	if u.Spec.Display == nil {
+		u.Spec.Display = &common.Display{}
+	}
 	if u.Spec.Display.Name == "" {
 		u.Spec.Display.Name = u.Name
 	}

pkg/types/dashboardtypes/perses_dashboard_convertors_test.go

@@ -8,9 +8,10 @@ import (
 
 	"github.com/SigNoz/signoz/pkg/types"
 	"github.com/SigNoz/signoz/pkg/types/coretypes"
-	qb "github.com/SigNoz/signoz/pkg/types/querybuildertypes/querybuildertypesv5"
 	"github.com/SigNoz/signoz/pkg/types/tagtypes"
+	qb "github.com/SigNoz/signoz/pkg/types/querybuildertypes/querybuildertypesv5"
 	"github.com/SigNoz/signoz/pkg/valuer"
+	"github.com/perses/spec/go/common"
 	"github.com/stretchr/testify/assert"
 	"github.com/stretchr/testify/require"
 )
@@ -165,7 +166,7 @@ func TestPostableDashboardV2NewDashboardV2(t *testing.T) {
 			DashboardV2MetadataBase: DashboardV2MetadataBase{SchemaVersion: SchemaVersion},
 			GenerateName:            true,
 			Spec: DashboardSpec{
-				Display: Display{Name: "My Dashboard!"},
+				Display: &common.Display{Name: "My Dashboard!"},
 			},
 		}