chore: address comments

* fix: creating tooltip plugin container only once

* chore: throttled legendcolor change

* fix: fixed tooltip plugin test

docs/api/openapi.yml

@@ -842,6 +842,17 @@ components:
       - temporality
       - isMonotonic
       type: object
+    MetrictypesComparisonSpaceAggregationParam:
+      properties:
+        operator:
+          type: string
+        threshold:
+          format: double
+          type: number
+      required:
+      - operator
+      - threshold
+      type: object
     MetrictypesSpaceAggregation:
       enum:
       - sum
@@ -1138,6 +1149,8 @@ components:
       type: object
     Querybuildertypesv5MetricAggregation:
       properties:
+        comparisonSpaceAggregationParam:
+          $ref: '#/components/schemas/MetrictypesComparisonSpaceAggregationParam'
         metricName:
           type: string
         reduceTo:

ee/modules/cloudintegrations/implawsprovider/provider.go

@@ -1,164 +0,0 @@
-package implawsprovider
-
-import (
-	"context"
-	"slices"
-
-	"github.com/SigNoz/signoz/pkg/modules/cloudintegrations"
-	"github.com/SigNoz/signoz/pkg/types/integrationtypes"
-)
-
-var _ cloudintegrations.CloudProvider = (*AWSProvider)(nil)
-
-type AWSProvider struct {
-	store integrationtypes.Store
-}
-
-func NewAWSProvider(store integrationtypes.Store) *AWSProvider {
-	return &AWSProvider{store: store}
-}
-
-func (a *AWSProvider) AgentCheckIn(ctx context.Context, req *cloudintegrations.PostableAgentCheckInPayload) (any, error) {
-	// if apiErr := validateCloudProviderName(cloudProvider); apiErr != nil {
-	// 	return nil, apiErr
-	// }
-
-	// existingAccount, apiErr := c.accountsRepo.get(ctx, orgId, cloudProvider, req.ID)
-	// if existingAccount != nil && existingAccount.AccountID != nil && *existingAccount.AccountID != req.AccountID {
-	// 	return nil, model.BadRequest(fmt.Errorf(
-	// 		"can't check in with new %s account id %s for account %s with existing %s id %s",
-	// 		cloudProvider, req.AccountID, existingAccount.ID.StringValue(), cloudProvider, *existingAccount.AccountID,
-	// 	))
-	// }
-
-	// existingAccount, apiErr = c.accountsRepo.getConnectedCloudAccount(ctx, orgId, cloudProvider, req.AccountID)
-	// if existingAccount != nil && existingAccount.ID.StringValue() != req.ID {
-	// 	return nil, model.BadRequest(fmt.Errorf(
-	// 		"can't check in to %s account %s with id %s. already connected with id %s",
-	// 		cloudProvider, req.AccountID, req.ID, existingAccount.ID.StringValue(),
-	// 	))
-	// }
-
-	// agentReport := types.AgentReport{
-	// 	TimestampMillis: time.Now().UnixMilli(),
-	// 	Data:            req.Data,
-	// }
-
-	// account, apiErr := c.accountsRepo.upsert(
-	// 	ctx, orgId, cloudProvider, &req.ID, nil, &req.AccountID, &agentReport, nil,
-	// )
-	// if apiErr != nil {
-	// 	return nil, model.WrapApiError(apiErr, "couldn't upsert cloud account")
-	// }
-
-	// // prepare and return integration config to be consumed by agent
-	// compiledStrategy, err := NewCompiledCollectionStrategy(cloudProvider)
-	// if err != nil {
-	// 	return nil, model.InternalError(fmt.Errorf(
-	// 		"couldn't init telemetry collection strategy: %w", err,
-	// 	))
-	// }
-
-	// agentConfig := IntegrationConfigForAgent{
-	// 	EnabledRegions:              []string{},
-	// 	TelemetryCollectionStrategy: compiledStrategy,
-	// }
-
-	// if account.Config != nil && account.Config.EnabledRegions != nil {
-	// 	agentConfig.EnabledRegions = account.Config.EnabledRegions
-	// }
-
-	// services, err := services.Map(cloudProvider)
-	// if err != nil {
-	// 	return nil, err
-	// }
-
-	// svcConfigs, apiErr := c.serviceConfigRepo.getAllForAccount(
-	// 	ctx, orgId, account.ID.StringValue(),
-	// )
-	// if apiErr != nil {
-	// 	return nil, model.WrapApiError(
-	// 		apiErr, "couldn't get service configs for cloud account",
-	// 	)
-	// }
-
-	// // accumulate config in a fixed order to ensure same config generated across runs
-	// configuredServices := maps.Keys(svcConfigs)
-	// slices.Sort(configuredServices)
-
-	// for _, svcType := range configuredServices {
-	// 	definition, ok := services[svcType]
-	// 	if !ok {
-	// 		continue
-	// 	}
-	// 	config := svcConfigs[svcType]
-
-	// 	err := AddServiceStrategy(svcType, compiledStrategy, definition.Strategy, config)
-	// 	if err != nil {
-	// 		return nil, err
-	// 	}
-	// }
-
-	// return &AgentCheckInResponse{
-	// 	AccountId:         account.ID.StringValue(),
-	// 	CloudAccountId:    *account.AccountID,
-	// 	RemovedAt:         account.RemovedAt,
-	// 	IntegrationConfig: agentConfig,
-	// }, nil
-}
-
-func (a *AWSProvider) ListServices(ctx context.Context, orgID string, cloudAccountID *string) (any, error) {
-	svcConfigs := make(map[string]*integrationtypes.AWSServiceConfig)
-	if cloudAccountID != nil {
-		activeAccount, err := a.store.GetConnectedCloudAccount(ctx, orgID, a.GetName().String(), *cloudAccountID)
-		if err != nil {
-			return nil, err
-		}
-
-		serviceConfigs, err := a.ServiceConfigRepo.GetAllForAccount(ctx, orgID, activeAccount.ID.String())
-		if err != nil {
-			return nil, err
-		}
-
-		for svcType, config := range serviceConfigs {
-			serviceConfig := new(integrationtypes.AWSServiceConfig)
-			err = integrationtypes.UnmarshalJSON(config, serviceConfig)
-			if err != nil {
-				return nil, err
-			}
-			svcConfigs[svcType] = serviceConfig
-		}
-	}
-
-	summaries := make([]integrationtypes.AWSServiceSummary, 0)
-
-	definitions, err := a.ServiceDefinitions.ListServiceDefinitions(ctx)
-	if err != nil {
-		return nil, err
-	}
-
-	for _, def := range definitions {
-		summary := integrationtypes.AWSServiceSummary{
-			DefinitionMetadata: def.DefinitionMetadata,
-			Config:             nil,
-		}
-
-		summary.Config = svcConfigs[summary.Id]
-
-		summaries = append(summaries, summary)
-	}
-
-	slices.SortFunc(summaries, func(a, b integrationtypes.AWSServiceSummary) int {
-		if a.DefinitionMetadata.Title < b.DefinitionMetadata.Title {
-			return -1
-		}
-		if a.DefinitionMetadata.Title > b.DefinitionMetadata.Title {
-			return 1
-		}
-		return 0
-	})
-
-	return &integrationtypes.GettableAWSServices{
-		Services: summaries,
-	}, nil
-}

ee/modules/cloudintegrations/implcloudintegrations/module.go

@@ -1,36 +0,0 @@
-package implcloudintegrations
-
-import (
-	"context"
-
-	"github.com/SigNoz/signoz/pkg/errors"
-	"github.com/SigNoz/signoz/pkg/modules/cloudintegrations"
-	"github.com/SigNoz/signoz/pkg/types/integrationtypes"
-)
-
-type module struct {
-	store     integrationtypes.Store
-	providers map[integrationtypes.CloudProviderType]cloudintegrations.CloudProvider
-}
-
-func NewModule(store integrationtypes.Store, providers map[integrationtypes.CloudProviderType]cloudintegrations.CloudProvider) cloudintegrations.Module {
-	return &module{store: store}
-}
-
-func (m *module) ListServices(ctx context.Context, orgID string, cloudProvider string, cloudAccountId *string) (any, error) {
-
-	provider, err := m.getProvider(cloudProvider)
-	if err != nil {
-		return nil, err
-	}
-
-	return provider.ListServices(ctx, orgID, cloudAccountId)
-}
-
-func (m *module) getProvider(cloudProvider integrationtypes.CloudProviderType) (cloudintegrations.CloudProvider, error) {
-	provider, ok := m.providers[cloudProvider]
-	if !ok {
-		return nil, errors.NewInvalidInputf(errors.CodeInvalidInput, "invalid cloud provider: %s", cloudProvider)
-	}
-	return provider, nil
-}

ee/query-service/app/api/api.go

@@ -1,7 +1,6 @@
 package api
 
 import (
-	"log/slog"
 	"net/http"
 	"time"
 
@@ -11,6 +10,7 @@ import (
 	"github.com/SigNoz/signoz/pkg/global"
 	"github.com/SigNoz/signoz/pkg/http/middleware"
 	baseapp "github.com/SigNoz/signoz/pkg/query-service/app"
+	"github.com/SigNoz/signoz/pkg/query-service/app/cloudintegrations"
 	"github.com/SigNoz/signoz/pkg/query-service/app/integrations"
 	"github.com/SigNoz/signoz/pkg/query-service/app/logparsingpipeline"
 	"github.com/SigNoz/signoz/pkg/query-service/interfaces"
@@ -27,12 +27,12 @@ type APIHandlerOptions struct {
 	RulesManager                  *rules.Manager
 	UsageManager                  *usage.Manager
 	IntegrationsController        *integrations.Controller
+	CloudIntegrationsController   *cloudintegrations.Controller
 	LogsParsingPipelineController *logparsingpipeline.LogParsingPipelineController
 	GatewayUrl                    string
 	// Querier Influx Interval
 	FluxInterval time.Duration
 	GlobalConfig global.Config
-	Logger       *slog.Logger // this is present in Signoz.Instrumentation but adding for quick access
 }
 
 type APIHandler struct {
@@ -46,13 +46,13 @@ func NewAPIHandler(opts APIHandlerOptions, signoz *signoz.SigNoz, config signoz.
 		Reader:                        opts.DataConnector,
 		RuleManager:                   opts.RulesManager,
 		IntegrationsController:        opts.IntegrationsController,
+		CloudIntegrationsController:   opts.CloudIntegrationsController,
 		LogsParsingPipelineController: opts.LogsParsingPipelineController,
 		FluxInterval:                  opts.FluxInterval,
 		AlertmanagerAPI:               alertmanager.NewAPI(signoz.Alertmanager),
 		LicensingAPI:                  httplicensing.NewLicensingAPI(signoz.Licensing),
 		Signoz:                        signoz,
 		QueryParserAPI:                queryparser.NewAPI(signoz.Instrumentation.ToProviderSettings(), signoz.QueryParser),
-		Logger:                        opts.Logger,
 	}, config)
 
 	if err != nil {
@@ -101,12 +101,14 @@ func (ah *APIHandler) RegisterRoutes(router *mux.Router, am *middleware.AuthZ) {
 }
 
 func (ah *APIHandler) RegisterCloudIntegrationsRoutes(router *mux.Router, am *middleware.AuthZ) {
+
 	ah.APIHandler.RegisterCloudIntegrationsRoutes(router, am)
 
 	router.HandleFunc(
 		"/api/v1/cloud-integrations/{cloudProvider}/accounts/generate-connection-params",
 		am.EditAccess(ah.CloudIntegrationsGenerateConnectionParams),
 	).Methods(http.MethodGet)
+
 }
 
 func (ah *APIHandler) getVersion(w http.ResponseWriter, r *http.Request) {

ee/query-service/app/api/cloudIntegrations.go

@@ -6,7 +6,6 @@ import (
 	"encoding/json"
 	"fmt"
 	"io"
-	"log/slog"
 	"net/http"
 	"strings"
 	"time"
@@ -14,14 +13,20 @@ import (
 	"github.com/SigNoz/signoz/pkg/errors"
 	"github.com/SigNoz/signoz/pkg/http/render"
 	"github.com/SigNoz/signoz/pkg/modules/user"
+	basemodel "github.com/SigNoz/signoz/pkg/query-service/model"
 	"github.com/SigNoz/signoz/pkg/types"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
-	"github.com/SigNoz/signoz/pkg/types/integrationtypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
 	"github.com/gorilla/mux"
+	"go.uber.org/zap"
 )
 
-// TODO: move this file with other cloud integration related code
+type CloudIntegrationConnectionParamsResponse struct {
+	IngestionUrl string `json:"ingestion_url,omitempty"`
+	IngestionKey string `json:"ingestion_key,omitempty"`
+	SigNozAPIUrl string `json:"signoz_api_url,omitempty"`
+	SigNozAPIKey string `json:"signoz_api_key,omitempty"`
+}
 
 func (ah *APIHandler) CloudIntegrationsGenerateConnectionParams(w http.ResponseWriter, r *http.Request) {
 	claims, err := authtypes.ClaimsFromContext(r.Context())
@@ -36,21 +41,23 @@ func (ah *APIHandler) CloudIntegrationsGenerateConnectionParams(w http.ResponseW
 		return
 	}
 
-	cloudProviderString := mux.Vars(r)["cloudProvider"]
-
-	cloudProvider, err := integrationtypes.NewCloudProvider(cloudProviderString)
-	if err != nil {
-		render.Error(w, err)
+	cloudProvider := mux.Vars(r)["cloudProvider"]
+	if cloudProvider != "aws" {
+		RespondError(w, basemodel.BadRequest(fmt.Errorf(
+			"cloud provider not supported: %s", cloudProvider,
+		)), nil)
 		return
 	}
 
-	apiKey, err := ah.getOrCreateCloudIntegrationPAT(r.Context(), claims.OrgID, cloudProvider)
-	if err != nil {
-		render.Error(w, err)
+	apiKey, apiErr := ah.getOrCreateCloudIntegrationPAT(r.Context(), claims.OrgID, cloudProvider)
+	if apiErr != nil {
+		RespondError(w, basemodel.WrapApiError(
+			apiErr, "couldn't provision PAT for cloud integration:",
+		), nil)
 		return
 	}
 
-	result := integrationtypes.GettableCloudIntegrationConnectionParams{
+	result := CloudIntegrationConnectionParamsResponse{
 		SigNozAPIKey: apiKey,
 	}
 
@@ -64,17 +71,16 @@ func (ah *APIHandler) CloudIntegrationsGenerateConnectionParams(w http.ResponseW
 		// Return the API Key (PAT) even if the rest of the params can not be deduced.
 		// Params not returned from here will be requested from the user via form inputs.
 		// This enables gracefully degraded but working experience even for non-cloud deployments.
-		ah.opts.Logger.InfoContext(
-			r.Context(),
-			"ingestion params and signoz api url can not be deduced since no license was found",
-		)
-		render.Success(w, http.StatusOK, result)
+		zap.L().Info("ingestion params and signoz api url can not be deduced since no license was found")
+		ah.Respond(w, result)
 		return
 	}
 
-	signozApiUrl, err := ah.getIngestionUrlAndSigNozAPIUrl(r.Context(), license.Key)
-	if err != nil {
-		render.Error(w, err)
+	signozApiUrl, apiErr := ah.getIngestionUrlAndSigNozAPIUrl(r.Context(), license.Key)
+	if apiErr != nil {
+		RespondError(w, basemodel.WrapApiError(
+			apiErr, "couldn't deduce ingestion url and signoz api url",
+		), nil)
 		return
 	}
 
@@ -83,41 +89,48 @@ func (ah *APIHandler) CloudIntegrationsGenerateConnectionParams(w http.ResponseW
 
 	gatewayUrl := ah.opts.GatewayUrl
 	if len(gatewayUrl) > 0 {
-		ingestionKeyString, err := ah.getOrCreateCloudProviderIngestionKey(
+
+		ingestionKey, apiErr := getOrCreateCloudProviderIngestionKey(
 			r.Context(), gatewayUrl, license.Key, cloudProvider,
 		)
-		if err != nil {
-			render.Error(w, err)
+		if apiErr != nil {
+			RespondError(w, basemodel.WrapApiError(
+				apiErr, "couldn't get or create ingestion key",
+			), nil)
 			return
 		}
 
-		result.IngestionKey = ingestionKeyString
+		result.IngestionKey = ingestionKey
+
 	} else {
-		ah.opts.Logger.InfoContext(
-			r.Context(),
-			"ingestion key can't be deduced since no gateway url has been configured",
-		)
+		zap.L().Info("ingestion key can't be deduced since no gateway url has been configured")
 	}
 
-	render.Success(w, http.StatusOK, result)
+	ah.Respond(w, result)
 }
 
-func (ah *APIHandler) getOrCreateCloudIntegrationPAT(ctx context.Context, orgId string, cloudProvider valuer.String) (string, error) {
+func (ah *APIHandler) getOrCreateCloudIntegrationPAT(ctx context.Context, orgId string, cloudProvider string) (
+	string, *basemodel.ApiError,
+) {
 	integrationPATName := fmt.Sprintf("%s integration", cloudProvider)
 
-	integrationUser, err := ah.getOrCreateCloudIntegrationUser(ctx, orgId, cloudProvider)
-	if err != nil {
-		return "", err
+	integrationUser, apiErr := ah.getOrCreateCloudIntegrationUser(ctx, orgId, cloudProvider)
+	if apiErr != nil {
+		return "", apiErr
 	}
 
 	orgIdUUID, err := valuer.NewUUID(orgId)
 	if err != nil {
-		return "", err
+		return "", basemodel.InternalError(fmt.Errorf(
+			"couldn't parse orgId: %w", err,
+		))
 	}
 
 	allPats, err := ah.Signoz.Modules.User.ListAPIKeys(ctx, orgIdUUID)
 	if err != nil {
-		return "", err
+		return "", basemodel.InternalError(fmt.Errorf(
+			"couldn't list PATs: %w", err,
+		))
 	}
 	for _, p := range allPats {
 		if p.UserID == integrationUser.ID && p.Name == integrationPATName {
@@ -125,10 +138,9 @@ func (ah *APIHandler) getOrCreateCloudIntegrationPAT(ctx context.Context, orgId
 		}
 	}
 
-	ah.opts.Logger.InfoContext(
-		ctx,
+	zap.L().Info(
 		"no PAT found for cloud integration, creating a new one",
-		slog.String("cloudProvider", cloudProvider.String()),
+		zap.String("cloudProvider", cloudProvider),
 	)
 
 	newPAT, err := types.NewStorableAPIKey(
@@ -138,48 +150,68 @@ func (ah *APIHandler) getOrCreateCloudIntegrationPAT(ctx context.Context, orgId
 		0,
 	)
 	if err != nil {
-		return "", err
+		return "", basemodel.InternalError(fmt.Errorf(
+			"couldn't create cloud integration PAT: %w", err,
+		))
 	}
 
 	err = ah.Signoz.Modules.User.CreateAPIKey(ctx, newPAT)
 	if err != nil {
-		return "", err
+		return "", basemodel.InternalError(fmt.Errorf(
+			"couldn't create cloud integration PAT: %w", err,
+		))
 	}
 	return newPAT.Token, nil
 }
 
-// TODO: move this function out of handler and use proper module structure
-func (ah *APIHandler) getOrCreateCloudIntegrationUser(ctx context.Context, orgId string, cloudProvider valuer.String) (*types.User, error) {
-	cloudIntegrationUserName := fmt.Sprintf("%s-integration", cloudProvider.String())
+func (ah *APIHandler) getOrCreateCloudIntegrationUser(
+	ctx context.Context, orgId string, cloudProvider string,
+) (*types.User, *basemodel.ApiError) {
+	cloudIntegrationUserName := fmt.Sprintf("%s-integration", cloudProvider)
 	email := valuer.MustNewEmail(fmt.Sprintf("%s@signoz.io", cloudIntegrationUserName))
 
 	cloudIntegrationUser, err := types.NewUser(cloudIntegrationUserName, email, types.RoleViewer, valuer.MustNewUUID(orgId))
 	if err != nil {
-		return nil, err
+		return nil, basemodel.InternalError(fmt.Errorf("couldn't create cloud integration user: %w", err))
 	}
 
 	password := types.MustGenerateFactorPassword(cloudIntegrationUser.ID.StringValue())
 
 	cloudIntegrationUser, err = ah.Signoz.Modules.User.GetOrCreateUser(ctx, cloudIntegrationUser, user.WithFactorPassword(password))
 	if err != nil {
-		return nil, err
+		return nil, basemodel.InternalError(fmt.Errorf("couldn't look for integration user: %w", err))
 	}
 
 	return cloudIntegrationUser, nil
 }
 
-// TODO: move this function out of handler and use proper module structure
-func (ah *APIHandler) getIngestionUrlAndSigNozAPIUrl(ctx context.Context, licenseKey string) (string, error) {
-	respBytes, err := ah.Signoz.Zeus.GetDeployment(ctx, licenseKey)
-	if err != nil {
-		return "", errors.WrapInternalf(err, errors.CodeInternal, "couldn't query for deployment info: error")
+func (ah *APIHandler) getIngestionUrlAndSigNozAPIUrl(ctx context.Context, licenseKey string) (
+	string, *basemodel.ApiError,
+) {
+	// TODO: remove this struct from here
+	type deploymentResponse struct {
+		Name        string `json:"name"`
+		ClusterInfo struct {
+			Region struct {
+				DNS string `json:"dns"`
+			} `json:"region"`
+		} `json:"cluster"`
 	}
 
-	resp := new(integrationtypes.GettableDeployment)
+	respBytes, err := ah.Signoz.Zeus.GetDeployment(ctx, licenseKey)
+	if err != nil {
+		return "", basemodel.InternalError(fmt.Errorf(
+			"couldn't query for deployment info: error: %w", err,
+		))
+	}
+
+	resp := new(deploymentResponse)
 
 	err = json.Unmarshal(respBytes, resp)
 	if err != nil {
-		return "", errors.WrapInternalf(err, errors.CodeInternal, "couldn't unmarshal deployment info response")
+		return "", basemodel.InternalError(fmt.Errorf(
+			"couldn't unmarshal deployment info response: error: %w", err,
+		))
 	}
 
 	regionDns := resp.ClusterInfo.Region.DNS
@@ -187,10 +219,9 @@ func (ah *APIHandler) getIngestionUrlAndSigNozAPIUrl(ctx context.Context, licens
 
 	if len(regionDns) < 1 || len(deploymentName) < 1 {
 		// Fail early if actual response structure and expectation here ever diverge
-		return "", errors.NewInternalf(
-			errors.CodeInternal,
+		return "", basemodel.InternalError(fmt.Errorf(
 			"deployment info response not in expected shape. couldn't determine region dns and deployment name",
-		)
+		))
 	}
 
 	signozApiUrl := fmt.Sprintf("https://%s.%s", deploymentName, regionDns)
@@ -198,85 +229,102 @@ func (ah *APIHandler) getIngestionUrlAndSigNozAPIUrl(ctx context.Context, licens
 	return signozApiUrl, nil
 }
 
-func (ah *APIHandler) getOrCreateCloudProviderIngestionKey(
-	ctx context.Context, gatewayUrl string, licenseKey string, cloudProvider valuer.String,
-) (string, error) {
+type ingestionKey struct {
+	Name  string `json:"name"`
+	Value string `json:"value"`
+	// other attributes from gateway response not included here since they are not being used.
+}
+
+type ingestionKeysSearchResponse struct {
+	Status string         `json:"status"`
+	Data   []ingestionKey `json:"data"`
+	Error  string         `json:"error"`
+}
+
+type createIngestionKeyResponse struct {
+	Status string       `json:"status"`
+	Data   ingestionKey `json:"data"`
+	Error  string       `json:"error"`
+}
+
+func getOrCreateCloudProviderIngestionKey(
+	ctx context.Context, gatewayUrl string, licenseKey string, cloudProvider string,
+) (string, *basemodel.ApiError) {
 	cloudProviderKeyName := fmt.Sprintf("%s-integration", cloudProvider)
 
 	// see if the key already exists
-	searchResult, err := requestGateway[integrationtypes.GettableIngestionKeysSearch](
+	searchResult, apiErr := requestGateway[ingestionKeysSearchResponse](
 		ctx,
 		gatewayUrl,
 		licenseKey,
 		fmt.Sprintf("/v1/workspaces/me/keys/search?name=%s", cloudProviderKeyName),
 		nil,
-		ah.opts.Logger,
 	)
-	if err != nil {
-		return "", err
+
+	if apiErr != nil {
+		return "", basemodel.WrapApiError(
+			apiErr, "couldn't search for cloudprovider ingestion key",
+		)
 	}
 
 	if searchResult.Status != "success" {
-		return "", errors.NewInternalf(
-			errors.CodeInternal,
-			"couldn't search for cloud provider ingestion key: status: %s, error: %s",
+		return "", basemodel.InternalError(fmt.Errorf(
+			"couldn't search for cloudprovider ingestion key: status: %s, error: %s",
 			searchResult.Status, searchResult.Error,
-		)
+		))
 	}
 
 	for _, k := range searchResult.Data {
-		if k.Name != cloudProviderKeyName {
-			continue
-		}
+		if k.Name == cloudProviderKeyName {
+			if len(k.Value) < 1 {
+				// Fail early if actual response structure and expectation here ever diverge
+				return "", basemodel.InternalError(fmt.Errorf(
+					"ingestion keys search response not as expected",
+				))
+			}
 
-		if len(k.Value) < 1 {
-			// Fail early if actual response structure and expectation here ever diverge
-			return "", errors.NewInternalf(errors.CodeInternal, "ingestion keys search response not as expected")
+			return k.Value, nil
 		}
-
-		return k.Value, nil
 	}
 
-	ah.opts.Logger.InfoContext(
-		ctx,
+	zap.L().Info(
 		"no existing ingestion key found for cloud integration, creating a new one",
-		slog.String("cloudProvider", cloudProvider.String()),
+		zap.String("cloudProvider", cloudProvider),
 	)
-
-	createKeyResult, err := requestGateway[integrationtypes.GettableCreateIngestionKey](
+	createKeyResult, apiErr := requestGateway[createIngestionKeyResponse](
 		ctx, gatewayUrl, licenseKey, "/v1/workspaces/me/keys",
 		map[string]any{
 			"name": cloudProviderKeyName,
-			"tags": []string{"integration", cloudProvider.String()},
+			"tags": []string{"integration", cloudProvider},
 		},
-		ah.opts.Logger,
 	)
-	if err != nil {
-		return "", err
+	if apiErr != nil {
+		return "", basemodel.WrapApiError(
+			apiErr, "couldn't create cloudprovider ingestion key",
+		)
 	}
 
 	if createKeyResult.Status != "success" {
-		return "", errors.NewInternalf(
-			errors.CodeInternal,
-			"couldn't create cloud provider ingestion key: status: %s, error: %s",
+		return "", basemodel.InternalError(fmt.Errorf(
+			"couldn't create cloudprovider ingestion key: status: %s, error: %s",
 			createKeyResult.Status, createKeyResult.Error,
-		)
+		))
 	}
 
-	ingestionKeyString := createKeyResult.Data.Value
-	if len(ingestionKeyString) < 1 {
+	ingestionKey := createKeyResult.Data.Value
+	if len(ingestionKey) < 1 {
 		// Fail early if actual response structure and expectation here ever diverge
-		return "", errors.NewInternalf(errors.CodeInternal,
+		return "", basemodel.InternalError(fmt.Errorf(
 			"ingestion key creation response not as expected",
-		)
+		))
 	}
 
-	return ingestionKeyString, nil
+	return ingestionKey, nil
 }
 
 func requestGateway[ResponseType any](
-	ctx context.Context, gatewayUrl, licenseKey, path string, payload any, logger *slog.Logger,
-) (*ResponseType, error) {
+	ctx context.Context, gatewayUrl string, licenseKey string, path string, payload any,
+) (*ResponseType, *basemodel.ApiError) {
 
 	baseUrl := strings.TrimSuffix(gatewayUrl, "/")
 	reqUrl := fmt.Sprintf("%s%s", baseUrl, path)
@@ -287,12 +335,13 @@ func requestGateway[ResponseType any](
 		"X-Consumer-Groups":      "ns:default",
 	}
 
-	return requestAndParseResponse[ResponseType](ctx, reqUrl, headers, payload, logger)
+	return requestAndParseResponse[ResponseType](ctx, reqUrl, headers, payload)
 }
 
 func requestAndParseResponse[ResponseType any](
-	ctx context.Context, url string, headers map[string]string, payload any, logger *slog.Logger,
-) (*ResponseType, error) {
+	ctx context.Context, url string, headers map[string]string, payload any,
+) (*ResponseType, *basemodel.ApiError) {
+
 	reqMethod := http.MethodGet
 	var reqBody io.Reader
 	if payload != nil {
@@ -300,14 +349,18 @@ func requestAndParseResponse[ResponseType any](
 
 		bodyJson, err := json.Marshal(payload)
 		if err != nil {
-			return nil, errors.WrapInternalf(err, errors.CodeInternal, "couldn't marshal payload")
+			return nil, basemodel.InternalError(fmt.Errorf(
+				"couldn't serialize request payload to JSON: %w", err,
+			))
 		}
-		reqBody = bytes.NewBuffer(bodyJson)
+		reqBody = bytes.NewBuffer([]byte(bodyJson))
 	}
 
 	req, err := http.NewRequestWithContext(ctx, reqMethod, url, reqBody)
 	if err != nil {
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "couldn't create req")
+		return nil, basemodel.InternalError(fmt.Errorf(
+			"couldn't prepare request: %w", err,
+		))
 	}
 
 	for k, v := range headers {
@@ -320,26 +373,23 @@ func requestAndParseResponse[ResponseType any](
 
 	response, err := client.Do(req)
 	if err != nil {
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "couldn't make req")
+		return nil, basemodel.InternalError(fmt.Errorf("couldn't make request: %w", err))
 	}
 
-	defer func() {
-		err = response.Body.Close()
-		if err != nil {
-			logger.ErrorContext(ctx, "couldn't close response body", "error", err)
-		}
-	}()
+	defer response.Body.Close()
 
 	respBody, err := io.ReadAll(response.Body)
 	if err != nil {
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "couldn't read response body")
+		return nil, basemodel.InternalError(fmt.Errorf("couldn't read response: %w", err))
 	}
 
 	var resp ResponseType
 
 	err = json.Unmarshal(respBody, &resp)
 	if err != nil {
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "couldn't unmarshal response body")
+		return nil, basemodel.InternalError(fmt.Errorf(
+			"couldn't unmarshal gateway response into %T", resp,
+		))
 	}
 
 	return &resp, nil

ee/query-service/app/server.go

@@ -37,6 +37,7 @@ import (
 	"github.com/SigNoz/signoz/pkg/query-service/agentConf"
 	baseapp "github.com/SigNoz/signoz/pkg/query-service/app"
 	"github.com/SigNoz/signoz/pkg/query-service/app/clickhouseReader"
+	"github.com/SigNoz/signoz/pkg/query-service/app/cloudintegrations"
 	"github.com/SigNoz/signoz/pkg/query-service/app/integrations"
 	"github.com/SigNoz/signoz/pkg/query-service/app/logparsingpipeline"
 	"github.com/SigNoz/signoz/pkg/query-service/app/opamp"
@@ -120,6 +121,13 @@ func NewServer(config signoz.Config, signoz *signoz.SigNoz) (*Server, error) {
 		)
 	}
 
+	cloudIntegrationsController, err := cloudintegrations.NewController(signoz.SQLStore)
+	if err != nil {
+		return nil, fmt.Errorf(
+			"couldn't create cloud provider integrations controller: %w", err,
+		)
+	}
+
 	// ingestion pipelines manager
 	logParsingPipelineController, err := logparsingpipeline.NewLogParsingPipelinesController(
 		signoz.SQLStore,
@@ -153,11 +161,11 @@ func NewServer(config signoz.Config, signoz *signoz.SigNoz) (*Server, error) {
 		RulesManager:                  rm,
 		UsageManager:                  usageManager,
 		IntegrationsController:        integrationsController,
+		CloudIntegrationsController:   cloudIntegrationsController,
 		LogsParsingPipelineController: logParsingPipelineController,
 		FluxInterval:                  config.Querier.FluxInterval,
 		GatewayUrl:                    config.Gateway.URL.String(),
 		GlobalConfig:                  config.Global,
-		Logger:                        signoz.Instrumentation.Logger(),
 	}
 
 	apiHandler, err := api.NewAPIHandler(apiOpts, signoz, config)

frontend/package.json

@@ -286,6 +286,5 @@
 		"brace-expansion": "^2.0.2",
 		"on-headers": "^1.1.0",
 		"tmp": "0.2.4"
-	},
-	"packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
+	}
 }

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

@@ -1006,6 +1006,18 @@ export interface MetricsexplorertypesUpdateMetricMetadataRequestDTO {
 	unit: string;
 }
 
+export interface MetrictypesComparisonSpaceAggregationParamDTO {
+	/**
+	 * @type string
+	 */
+	operator: string;
+	/**
+	 * @type number
+	 * @format double
+	 */
+	threshold: number;
+}
+
 export enum MetrictypesSpaceAggregationDTO {
 	sum = 'sum',
 	avg = 'avg',
@@ -1367,6 +1379,7 @@ export interface Querybuildertypesv5LogAggregationDTO {
 }
 
 export interface Querybuildertypesv5MetricAggregationDTO {
+	comparisonSpaceAggregationParam?: MetrictypesComparisonSpaceAggregationParamDTO;
 	/**
 	 * @type string
 	 */

frontend/src/api/metricsExplorer/v2/getMetricMetadata.ts

@@ -1,26 +0,0 @@
-import { ApiV2Instance as axios } from 'api';
-import { ErrorResponseHandlerV2 } from 'api/ErrorResponseHandlerV2';
-import { AxiosError } from 'axios';
-import { ErrorResponseV2, ErrorV2Resp, SuccessResponseV2 } from 'types/api';
-import { MetricMetadataResponse } from 'types/api/metricsExplorer/v2/getMetricMetadata';
-
-export const getMetricMetadata = async (
-	metricName: string,
-	signal?: AbortSignal,
-	headers?: Record<string, string>,
-): Promise<SuccessResponseV2<MetricMetadataResponse> | ErrorResponseV2> => {
-	try {
-		const encodedMetricName = encodeURIComponent(metricName);
-		const response = await axios.get(`/metrics/${encodedMetricName}/metadata`, {
-			signal,
-			headers,
-		});
-
-		return {
-			httpStatusCode: response.status,
-			data: response.data,
-		};
-	} catch (error) {
-		return ErrorResponseHandlerV2(error as AxiosError<ErrorV2Resp>);
-	}
-};

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

@@ -11,7 +11,6 @@ import {
 	startCompletion,
 } from '@codemirror/autocomplete';
 import { javascript } from '@codemirror/lang-javascript';
-import * as Sentry from '@sentry/react';
 import { Color } from '@signozhq/design-tokens';
 import { copilot } from '@uiw/codemirror-theme-copilot';
 import { githubLight } from '@uiw/codemirror-theme-github';
@@ -86,6 +85,7 @@ interface QuerySearchProps {
 	signalSource?: string;
 	hardcodedAttributeKeys?: QueryKeyDataSuggestionsProps[];
 	onRun?: (query: string) => void;
+	showFilterSuggestionsWithoutMetric?: boolean;
 }
 
 function QuerySearch({
@@ -96,6 +96,7 @@ function QuerySearch({
 	onRun,
 	signalSource,
 	hardcodedAttributeKeys,
+	showFilterSuggestionsWithoutMetric,
 }: QuerySearchProps): JSX.Element {
 	const isDarkMode = useIsDarkMode();
 	const [valueSuggestions, setValueSuggestions] = useState<any[]>([]);
@@ -252,7 +253,8 @@ function QuerySearch({
 		async (searchText?: string): Promise<void> => {
 			if (
 				dataSource === DataSource.METRICS &&
-				!queryData.aggregateAttribute?.key
+				!queryData.aggregateAttribute?.key &&
+				!showFilterSuggestionsWithoutMetric
 			) {
 				setKeySuggestions([]);
 				return;
@@ -301,6 +303,7 @@ function QuerySearch({
 			queryData.aggregateAttribute?.key,
 			signalSource,
 			hardcodedAttributeKeys,
+			showFilterSuggestionsWithoutMetric,
 		],
 	);
 
@@ -564,15 +567,7 @@ function QuerySearch({
 		const lastPos = lastPosRef.current;
 
 		if (newPos.line !== lastPos.line || newPos.ch !== lastPos.ch) {
-			setCursorPos((lastPos) => {
-				if (newPos.ch !== lastPos.ch && newPos.ch === 0) {
-					Sentry.captureEvent({
-						message: `Cursor jumped to start of line from ${lastPos.ch} to ${newPos.ch}`,
-						level: 'warning',
-					});
-				}
-				return newPos;
-			});
+			setCursorPos(newPos);
 			lastPosRef.current = newPos;
 
 			if (doc) {
@@ -1565,6 +1560,7 @@ QuerySearch.defaultProps = {
 	hardcodedAttributeKeys: undefined,
 	placeholder:
 		"Enter your filter query (e.g., http.status_code >= 500 AND service.name = 'frontend')",
+	showFilterSuggestionsWithoutMetric: false,
 };
 
 export default QuerySearch;

frontend/src/container/AppLayout/index.tsx

@@ -117,7 +117,7 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 	const [showSlowApiWarning, setShowSlowApiWarning] = useState(false);
 	const [slowApiWarningShown, setSlowApiWarningShown] = useState(false);
 
-	const { latestVersion } = useSelector<AppState, AppReducer>(
+	const { currentVersion } = useSelector<AppState, AppReducer>(
 		(state) => state.app,
 	);
 
@@ -213,9 +213,9 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 		},
 		{
 			queryFn: (): Promise<SuccessResponse<ChangelogSchema> | ErrorResponse> =>
-				getChangelogByVersion(latestVersion, changelogForTenant),
-			queryKey: ['getChangelogByVersion', latestVersion, changelogForTenant],
-			enabled: isLoggedIn && Boolean(latestVersion),
+				getChangelogByVersion(currentVersion, changelogForTenant),
+			queryKey: ['getChangelogByVersion', currentVersion, changelogForTenant],
+			enabled: isLoggedIn && Boolean(currentVersion),
 		},
 	]);
 
@@ -226,7 +226,7 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 			!changelog &&
 			!getChangelogByVersionResponse.isLoading &&
 			isLoggedIn &&
-			Boolean(latestVersion)
+			Boolean(currentVersion)
 		) {
 			getChangelogByVersionResponse.refetch();
 		}
@@ -237,9 +237,9 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 		let timer: ReturnType<typeof setTimeout>;
 		if (
 			isCloudUserVal &&
-			Boolean(latestVersion) &&
+			Boolean(currentVersion) &&
 			seenChangelogVersion != null &&
-			latestVersion !== seenChangelogVersion &&
+			currentVersion !== seenChangelogVersion &&
 			daysSinceAccountCreation > MIN_ACCOUNT_AGE_FOR_CHANGELOG && // Show to only users older than 2 weeks
 			!isWorkspaceAccessRestricted
 		) {
@@ -255,7 +255,7 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [
 		isCloudUserVal,
-		latestVersion,
+		currentVersion,
 		seenChangelogVersion,
 		toggleChangelogModal,
 		isWorkspaceAccessRestricted,

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

@@ -87,7 +87,7 @@ function Explorer(): JSX.Element {
 	const [yAxisUnit, setYAxisUnit] = useState<string | undefined>();
 
 	const unitsLength = useMemo(() => units.length, [units]);
-	const firstUnit = useMemo(() => units?.[0], [units]);
+	const firstUnit = useMemo(() => units[0], [units]);
 
 	useEffect(() => {
 		// Set the y axis unit to the first metric unit if
@@ -349,7 +349,7 @@ function Explorer(): JSX.Element {
 				isOneChartPerQuery={showOneChartPerQuery}
 				splitedQueries={splitedQueries}
 			/>
-			{isMetricDetailsOpen && (
+			{isMetricDetailsOpen && selectedMetricName && (
 				<MetricDetails
 					metricName={selectedMetricName}
 					isOpen={isMetricDetailsOpen}

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

@@ -39,10 +39,7 @@ function RelatedMetricsCard({ metric }: RelatedMetricsCardProps): JSX.Element {
 					dataSource={DataSource.METRICS}
 				/>
 			)}
-			<DashboardsAndAlertsPopover
-				dashboards={metric.dashboards}
-				alerts={metric.alerts}
-			/>
+			<DashboardsAndAlertsPopover metricName={metric.name} />
 		</div>
 	);
 }

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

@@ -1,8 +1,13 @@
 import { useMemo } from 'react';
-import { useQueries } from 'react-query';
+import { useQueries, useQueryClient } from 'react-query';
 import { useSelector } from 'react-redux';
 import { Color } from '@signozhq/design-tokens';
-import { Tooltip, Typography } from 'antd';
+import { toast } from '@signozhq/sonner';
+import { Button, Tooltip, Typography } from 'antd';
+import {
+	invalidateGetMetricMetadata,
+	useUpdateMetricMetadata,
+} from 'api/generated/services/metrics';
 import { isAxiosError } from 'axios';
 import classNames from 'classnames';
 import YAxisUnitSelector from 'components/YAxisUnitSelector';
@@ -23,7 +28,10 @@ import { DataSource } from 'types/common/queryBuilder';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
 import { TimeSeriesProps } from './types';
-import { splitQueryIntoOneChartPerQuery } from './utils';
+import {
+	buildUpdateMetricYAxisUnitPayload,
+	splitQueryIntoOneChartPerQuery,
+} from './utils';
 
 function TimeSeries({
 	showOneChartPerQuery,
@@ -35,6 +43,7 @@ function TimeSeries({
 	yAxisUnit,
 	setYAxisUnit,
 	showYAxisUnitSelector,
+	metrics,
 }: TimeSeriesProps): JSX.Element {
 	const { stagedQuery, currentQuery } = useQueryBuilder();
 
@@ -42,6 +51,7 @@ function TimeSeries({
 		AppState,
 		GlobalReducer
 	>((state) => state.globalTime);
+	const queryClient = useQueryClient();
 
 	const isValidToConvertToMs = useMemo(() => {
 		const isValid: boolean[] = [];
@@ -138,54 +148,51 @@ function TimeSeries({
 		setYAxisUnit(value);
 	};
 
-	// TODO: Enable once we have resolved all related metrics v2 api issues
 	// Show the save unit button if
 	// 1. There is only one metric
 	// 2. The metric has no saved unit
 	// 3. The user has selected a unit
-	// const showSaveUnitButton = useMemo(
-	// 	() =>
-	// 		metricUnits.length === 1 &&
-	// 		Boolean(metrics?.[0]) &&
-	// 		!metricUnits[0] &&
-	// 		yAxisUnit,
-	// 	[metricUnits, metrics, yAxisUnit],
-	// );
+	const showSaveUnitButton = useMemo(
+		() =>
+			metricUnits.length === 1 &&
+			Boolean(metrics[0]) &&
+			!metricUnits[0] &&
+			yAxisUnit,
+		[metricUnits, metrics, yAxisUnit],
+	);
 
-	// const {
-	// 	mutate: updateMetricMetadata,
-	// 	isLoading: isUpdatingMetricMetadata,
-	// } = useUpdateMetricMetadata();
+	const {
+		mutate: updateMetricMetadata,
+		isLoading: isUpdatingMetricMetadata,
+	} = useUpdateMetricMetadata();
 
-	// const handleSaveUnit = (): void => {
-	// 	updateMetricMetadata(
-	// 		{
-	// 			metricName: metricNames[0],
-	// 			payload: {
-	// 				unit: yAxisUnit,
-	// 				description: metrics[0]?.description ?? '',
-	// 				metricType: metrics[0]?.type as MetricType,
-	// 				temporality: metrics[0]?.temporality,
-	// 			},
-	// 		},
-	// 		{
-	// 			onSuccess: () => {
-	// 				notifications.success({
-	// 					message: 'Unit saved successfully',
-	// 				});
-	// 				queryClient.invalidateQueries([
-	// 					REACT_QUERY_KEY.GET_METRIC_DETAILS,
-	// 					metricNames[0],
-	// 				]);
-	// 			},
-	// 			onError: () => {
-	// 				notifications.error({
-	// 					message: 'Failed to save unit',
-	// 				});
-	// 			},
-	// 		},
-	// 	);
-	// };
+	const handleSaveUnit = (): void => {
+		if (metrics[0] && yAxisUnit) {
+			updateMetricMetadata(
+				{
+					pathParams: {
+						metricName: metricNames[0],
+					},
+					data: buildUpdateMetricYAxisUnitPayload(
+						metricNames[0],
+						metrics[0],
+						yAxisUnit,
+					),
+				},
+				{
+					onSuccess: () => {
+						toast.success('Unit saved successfully');
+						invalidateGetMetricMetadata(queryClient, {
+							metricName: metricNames[0],
+						});
+					},
+					onError: () => {
+						toast.error('Failed to save unit');
+					},
+				},
+			);
+		}
+	};
 
 	return (
 		<>
@@ -198,8 +205,7 @@ function TimeSeries({
 							source={YAxisSource.EXPLORER}
 							data-testid="y-axis-unit-selector"
 						/>
-						{/* TODO: Enable once we have resolved all related metrics v2 api issues */}
-						{/* {showSaveUnitButton && (
+						{showSaveUnitButton && (
 							<div className="save-unit-container">
 								<Typography.Text>
 									Save the selected unit for this metric?
@@ -213,7 +219,7 @@ function TimeSeries({
 									<Typography.Paragraph>Yes</Typography.Paragraph>
 								</Button>
 							</div>
-						)} */}
+						)}
 					</>
 				)}
 			</div>

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

@@ -3,8 +3,10 @@ import { Provider } from 'react-redux';
 import { MemoryRouter } from 'react-router-dom';
 import { useSearchParams } from 'react-router-dom-v5-compat';
 import { render, screen } from '@testing-library/react';
-import { Temporality } from 'api/metricsExplorer/getMetricDetails';
-import { MetricType } from 'api/metricsExplorer/getMetricsList';
+import {
+	MetrictypesTemporalityDTO,
+	MetrictypesTypeDTO,
+} from 'api/generated/services/sigNoz.schemas';
 import { initialQueriesMap, PANEL_TYPES } from 'constants/queryBuilder';
 import * as useOptionsMenuHooks from 'container/OptionsMenu';
 import * as useUpdateDashboardHooks from 'hooks/dashboard/useUpdateDashboard';
@@ -14,12 +16,12 @@ import { ErrorModalProvider } from 'providers/ErrorModalProvider';
 import * as timezoneHooks from 'providers/Timezone';
 import store from 'store';
 import { LicenseEvent } from 'types/api/licensesV3/getActive';
-import { MetricMetadata } from 'types/api/metricsExplorer/v2/getMetricMetadata';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { DataSource, QueryBuilderContextType } from 'types/common/queryBuilder';
 
 import Explorer from '../Explorer';
 import * as useGetMetricsHooks from '../utils';
+import { MOCK_METRIC_METADATA } from './testUtils';
 
 const mockSetSearchParams = jest.fn();
 const queryClient = new QueryClient();
@@ -135,14 +137,6 @@ jest.spyOn(useQueryBuilderHooks, 'useQueryBuilder').mockReturnValue({
 
 const Y_AXIS_UNIT_SELECTOR_TEST_ID = 'y-axis-unit-selector';
 
-const mockMetric: MetricMetadata = {
-	type: MetricType.SUM,
-	description: 'metric1 description',
-	unit: 'metric1 unit',
-	temporality: Temporality.CUMULATIVE,
-	isMonotonic: true,
-};
-
 function renderExplorer(): void {
 	render(
 		<QueryClientProvider client={queryClient}>
@@ -190,7 +184,7 @@ describe('Explorer', () => {
 		jest.spyOn(useGetMetricsHooks, 'useGetMetrics').mockReturnValue({
 			isLoading: false,
 			isError: false,
-			metrics: [mockMetric, mockMetric],
+			metrics: [MOCK_METRIC_METADATA, MOCK_METRIC_METADATA],
 		});
 
 		renderExplorer();
@@ -207,7 +201,7 @@ describe('Explorer', () => {
 		jest.spyOn(useGetMetricsHooks, 'useGetMetrics').mockReturnValue({
 			isLoading: false,
 			isError: false,
-			metrics: [mockMetric, mockMetric],
+			metrics: [MOCK_METRIC_METADATA, MOCK_METRIC_METADATA],
 		});
 
 		renderExplorer();
@@ -220,7 +214,7 @@ describe('Explorer', () => {
 		jest.spyOn(useGetMetricsHooks, 'useGetMetrics').mockReturnValue({
 			isLoading: false,
 			isError: false,
-			metrics: [mockMetric],
+			metrics: [MOCK_METRIC_METADATA],
 		});
 
 		renderExplorer();
@@ -237,7 +231,7 @@ describe('Explorer', () => {
 		jest.spyOn(useGetMetricsHooks, 'useGetMetrics').mockReturnValue({
 			isLoading: false,
 			isError: false,
-			metrics: [mockMetric, mockMetric],
+			metrics: [MOCK_METRIC_METADATA, MOCK_METRIC_METADATA],
 		});
 
 		renderExplorer();
@@ -250,7 +244,7 @@ describe('Explorer', () => {
 		jest.spyOn(useGetMetricsHooks, 'useGetMetrics').mockReturnValue({
 			isLoading: false,
 			isError: false,
-			metrics: [mockMetric, mockMetric],
+			metrics: [MOCK_METRIC_METADATA, MOCK_METRIC_METADATA],
 		});
 
 		renderExplorer();
@@ -269,10 +263,10 @@ describe('Explorer', () => {
 			isError: false,
 			metrics: [
 				{
-					type: MetricType.SUM,
+					type: MetrictypesTypeDTO.sum,
 					description: 'metric1 description',
 					unit: '',
-					temporality: Temporality.CUMULATIVE,
+					temporality: MetrictypesTemporalityDTO.cumulative,
 					isMonotonic: true,
 				},
 			],
@@ -289,7 +283,7 @@ describe('Explorer', () => {
 		jest.spyOn(useGetMetricsHooks, 'useGetMetrics').mockReturnValue({
 			isLoading: false,
 			isError: false,
-			metrics: [mockMetric],
+			metrics: [MOCK_METRIC_METADATA],
 		});
 
 		renderExplorer();
@@ -324,7 +318,7 @@ describe('Explorer', () => {
 		jest.spyOn(useGetMetricsHooks, 'useGetMetrics').mockReturnValue({
 			isLoading: false,
 			isError: false,
-			metrics: [mockMetric, mockMetric],
+			metrics: [MOCK_METRIC_METADATA, MOCK_METRIC_METADATA],
 		});
 
 		renderExplorer();

frontend/src/container/MetricsExplorer/Explorer/__tests__/TimeSeries.test.tsx

@@ -1,29 +1,19 @@
-import { UseMutationResult } from 'react-query';
 import { render, RenderResult, screen, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import { Temporality } from 'api/metricsExplorer/getMetricDetails';
-import { MetricType } from 'api/metricsExplorer/getMetricsList';
-import { UpdateMetricMetadataResponse } from 'api/metricsExplorer/updateMetricMetadata';
-import * as useUpdateMetricMetadataHooks from 'hooks/metricsExplorer/useUpdateMetricMetadata';
-import { UseUpdateMetricMetadataProps } from 'hooks/metricsExplorer/useUpdateMetricMetadata';
-import { ErrorResponse, SuccessResponse } from 'types/api';
-import { MetricMetadata } from 'types/api/metricsExplorer/v2/getMetricMetadata';
+import * as metricsExplorerHooks from 'api/generated/services/metrics';
 
 import TimeSeries from '../TimeSeries';
 import { TimeSeriesProps } from '../types';
+import { MOCK_METRIC_METADATA } from './testUtils';
 
-type MockUpdateMetricMetadata = UseMutationResult<
-	SuccessResponse<UpdateMetricMetadataResponse> | ErrorResponse,
-	Error,
-	UseUpdateMetricMetadataProps
->;
 const mockUpdateMetricMetadata = jest.fn();
-jest
-	.spyOn(useUpdateMetricMetadataHooks, 'useUpdateMetricMetadata')
-	.mockReturnValue(({
-		mutate: mockUpdateMetricMetadata,
-		isLoading: false,
-	} as Partial<MockUpdateMetricMetadata>) as MockUpdateMetricMetadata);
+const updateMetricMetadataSpy = jest.spyOn(
+	metricsExplorerHooks,
+	'useUpdateMetricMetadata',
+);
+type UseUpdateMetricMetadataReturnType = ReturnType<
+	typeof metricsExplorerHooks.useUpdateMetricMetadata
+>;
 
 jest.mock('container/TimeSeriesView/TimeSeriesView', () => ({
 	__esModule: true,
@@ -60,14 +50,6 @@ jest.mock('react-redux', () => ({
 	}),
 }));
 
-const mockMetric: MetricMetadata = {
-	type: MetricType.SUM,
-	description: 'metric1 description',
-	unit: 'metric1 unit',
-	temporality: Temporality.CUMULATIVE,
-	isMonotonic: true,
-};
-
 const mockSetWarning = jest.fn();
 const mockSetIsMetricDetailsOpen = jest.fn();
 const mockSetYAxisUnit = jest.fn();
@@ -96,6 +78,13 @@ function renderTimeSeries(
 }
 
 describe('TimeSeries', () => {
+	beforeEach(() => {
+		updateMetricMetadataSpy.mockReturnValue(({
+			mutate: mockUpdateMetricMetadata,
+			isLoading: false,
+		} as Partial<UseUpdateMetricMetadataReturnType>) as UseUpdateMetricMetadataReturnType);
+	});
+
 	it('should render a warning icon when a metric has no unit among multiple metrics', () => {
 		const user = userEvent.setup();
 		const { container } = renderTimeSeries({
@@ -118,7 +107,7 @@ describe('TimeSeries', () => {
 		const { container } = renderTimeSeries({
 			metricUnits: ['', 'count'],
 			metricNames: ['metric1', 'metric2'],
-			metrics: [mockMetric, mockMetric],
+			metrics: [MOCK_METRIC_METADATA, MOCK_METRIC_METADATA],
 			yAxisUnit: 'seconds',
 		});
 
@@ -133,18 +122,17 @@ describe('TimeSeries', () => {
 		);
 	});
 
-	// TODO: Unskip this test once the save unit button is implemented
-	// Tracking at - https://github.com/SigNoz/engineering-pod/issues/3495
-	it.skip('shows Save unit button when metric had no unit but one is selected', () => {
+	it('shows Save unit button when metric had no unit but one is selected', async () => {
 		const { findByText, getByRole } = renderTimeSeries({
 			metricUnits: [undefined],
 			metricNames: ['metric1'],
-			metrics: [mockMetric],
+			metrics: [MOCK_METRIC_METADATA],
 			yAxisUnit: 'seconds',
+			showYAxisUnitSelector: true,
 		});
 
 		expect(
-			findByText('Save the selected unit for this metric?'),
+			await findByText('Save the selected unit for this metric?'),
 		).toBeInTheDocument();
 
 		const yesButton = getByRole('button', { name: 'Yes' });
@@ -152,24 +140,25 @@ describe('TimeSeries', () => {
 		expect(yesButton).toBeEnabled();
 	});
 
-	// TODO: Unskip this test once the save unit button is implemented
-	// Tracking at - https://github.com/SigNoz/engineering-pod/issues/3495
-	it.skip('clicking on save unit button shoould upated metric metadata', () => {
+	it('clicking on save unit button shoould upated metric metadata', async () => {
 		const user = userEvent.setup();
 		const { getByRole } = renderTimeSeries({
 			metricUnits: [''],
 			metricNames: ['metric1'],
-			metrics: [mockMetric],
+			metrics: [MOCK_METRIC_METADATA],
 			yAxisUnit: 'seconds',
+			showYAxisUnitSelector: true,
 		});
 
 		const yesButton = getByRole('button', { name: /Yes/i });
-		user.click(yesButton);
+		await user.click(yesButton);
 
 		expect(mockUpdateMetricMetadata).toHaveBeenCalledWith(
 			{
-				metricName: 'metric1',
-				payload: expect.objectContaining({ unit: 'seconds' }),
+				pathParams: {
+					metricName: 'metric1',
+				},
+				data: expect.objectContaining({ unit: 'seconds' }),
 			},
 			expect.objectContaining({
 				onSuccess: expect.any(Function),

frontend/src/container/MetricsExplorer/Explorer/__tests__/testUtils.ts

@@ -0,0 +1,13 @@
+import {
+	MetricsexplorertypesMetricMetadataDTO,
+	MetrictypesTemporalityDTO,
+	MetrictypesTypeDTO,
+} from 'api/generated/services/sigNoz.schemas';
+
+export const MOCK_METRIC_METADATA: MetricsexplorertypesMetricMetadataDTO = {
+	type: MetrictypesTypeDTO.sum,
+	description: 'metric1 description',
+	unit: 'metric1 unit',
+	temporality: MetrictypesTemporalityDTO.cumulative,
+	isMonotonic: true,
+};

frontend/src/container/MetricsExplorer/Explorer/__tests__/utils.test.tsx

@@ -1,14 +1,8 @@
 import { UseQueryResult } from 'react-query';
 import { renderHook } from '@testing-library/react';
-import { Temporality } from 'api/metricsExplorer/getMetricDetails';
-import { MetricType } from 'api/metricsExplorer/getMetricsList';
+import { GetMetricMetadata200 } from 'api/generated/services/sigNoz.schemas';
 import { initialQueriesMap } from 'constants/queryBuilder';
 import * as useGetMultipleMetricsHook from 'hooks/metricsExplorer/useGetMultipleMetrics';
-import { SuccessResponseV2 } from 'types/api';
-import {
-	MetricMetadata,
-	MetricMetadataResponse,
-} from 'types/api/metricsExplorer/v2/getMetricMetadata';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import {
 	IBuilderFormula,
@@ -22,6 +16,7 @@ import {
 	splitQueryIntoOneChartPerQuery,
 	useGetMetrics,
 } from '../utils';
+import { MOCK_METRIC_METADATA } from './testUtils';
 
 const MOCK_QUERY_DATA_1: IBuilderQuery = {
 	...initialQueriesMap[DataSource.METRICS].builder.queryData[0],
@@ -91,32 +86,19 @@ describe('splitQueryIntoOneChartPerQuery', () => {
 	});
 });
 
-const MOCK_METRIC_METADATA: MetricMetadata = {
-	description: 'Metric 1 description',
-	unit: 'unit1',
-	type: MetricType.GAUGE,
-	temporality: Temporality.DELTA,
-	isMonotonic: true,
-};
-
 describe('useGetMetrics', () => {
 	beforeEach(() => {
 		jest
 			.spyOn(useGetMultipleMetricsHook, 'useGetMultipleMetrics')
 			.mockReturnValue([
-				({
+				{
 					isLoading: false,
 					isError: false,
 					data: {
-						httpStatusCode: 200,
-						data: {
-							status: 'success',
-							data: MOCK_METRIC_METADATA,
-						},
+						data: MOCK_METRIC_METADATA,
+						status: 'success',
 					},
-				} as Partial<
-					UseQueryResult<SuccessResponseV2<MetricMetadataResponse>, Error>
-				>) as UseQueryResult<SuccessResponseV2<MetricMetadataResponse>, Error>,
+				} as UseQueryResult<GetMetricMetadata200, Error>,
 			]);
 	});
 
@@ -133,12 +115,11 @@ describe('useGetMetrics', () => {
 		jest
 			.spyOn(useGetMultipleMetricsHook, 'useGetMultipleMetrics')
 			.mockReturnValue([
-				({
+				{
 					isLoading: true,
 					isError: false,
-				} as Partial<
-					UseQueryResult<SuccessResponseV2<MetricMetadataResponse>, Error>
-				>) as UseQueryResult<SuccessResponseV2<MetricMetadataResponse>, Error>,
+					data: undefined,
+				} as UseQueryResult<GetMetricMetadata200, Error>,
 			]);
 		const { result } = renderHook(() => useGetMetrics(['metric1']));
 		expect(result.current.metrics).toHaveLength(1);

frontend/src/container/MetricsExplorer/Explorer/types.ts

@@ -1,9 +1,9 @@
 import { Dispatch, SetStateAction } from 'react';
 import { UseQueryResult } from 'react-query';
+import { MetricsexplorertypesMetricMetadataDTO } from 'api/generated/services/sigNoz.schemas';
 import { RelatedMetric } from 'api/metricsExplorer/getRelatedMetrics';
 import { SuccessResponse, Warning } from 'types/api';
 import { MetricRangePayloadProps } from 'types/api/metrics/getQueryRange';
-import { MetricMetadata } from 'types/api/metricsExplorer/v2/getMetricMetadata';
 
 export enum ExplorerTabs {
 	TIME_SERIES = 'time-series',
@@ -18,7 +18,7 @@ export interface TimeSeriesProps {
 	isMetricUnitsError: boolean;
 	metricUnits: (string | undefined)[];
 	metricNames: string[];
-	metrics: (MetricMetadata | undefined)[];
+	metrics: (MetricsexplorertypesMetricMetadataDTO | undefined)[];
 	handleOpenMetricDetails: (metricName: string) => void;
 	yAxisUnit: string | undefined;
 	setYAxisUnit: (unit: string) => void;

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

@@ -1,9 +1,12 @@
+import { UpdateMetricMetadataMutationBody } from 'api/generated/services/metrics';
+import { MetricsexplorertypesMetricMetadataDTO } from 'api/generated/services/sigNoz.schemas';
 import { mapMetricUnitToUniversalUnit } from 'components/YAxisUnitSelector/utils';
 import { useGetMultipleMetrics } from 'hooks/metricsExplorer/useGetMultipleMetrics';
-import { MetricMetadata } from 'types/api/metricsExplorer/v2/getMetricMetadata';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';
 import { v4 as uuid } from 'uuid';
 
+import { determineIsMonotonic } from '../MetricDetails/utils';
+
 /**
  * Split a query with multiple queryData to multiple distinct queries, each with a single queryData.
  * @param query - The query to split
@@ -68,16 +71,14 @@ export function useGetMetrics(
 ): {
 	isLoading: boolean;
 	isError: boolean;
-	metrics: (MetricMetadata | undefined)[];
+	metrics: (MetricsexplorertypesMetricMetadataDTO | undefined)[];
 } {
 	const metricsData = useGetMultipleMetrics(metricNames, {
 		enabled: metricNames.length > 0 && isEnabled,
 	});
 	return {
 		isLoading: metricsData.some((metric) => metric.isLoading),
-		metrics: metricsData
-			.map((metric) => metric.data?.data)
-			.map((data) => data?.data),
+		metrics: metricsData.map((metric) => metric.data?.data),
 		isError: metricsData.some((metric) => metric.isError),
 	};
 }
@@ -89,9 +90,24 @@ export function useGetMetrics(
  * @returns The units of the metrics, can be undefined if the metric has no unit
  */
 export function getMetricUnits(
-	metrics: (MetricMetadata | undefined)[],
+	metrics: (MetricsexplorertypesMetricMetadataDTO | undefined)[],
 ): (string | undefined)[] {
 	return metrics
 		.map((metric) => metric?.unit)
 		.map((unit) => mapMetricUnitToUniversalUnit(unit) || undefined);
 }
+
+export function buildUpdateMetricYAxisUnitPayload(
+	metricName: string,
+	metric: MetricsexplorertypesMetricMetadataDTO,
+	yAxisUnit: string,
+): UpdateMetricMetadataMutationBody {
+	return {
+		metricName,
+		type: metric.type,
+		description: metric.description,
+		unit: yAxisUnit || '',
+		temporality: metric.temporality,
+		isMonotonic: determineIsMonotonic(metric?.type, metric?.temporality),
+	};
+}

frontend/src/container/MetricsExplorer/Inspect/ExpandedView.tsx

@@ -33,7 +33,7 @@ function ExpandedView({
 	options,
 	spaceAggregationSeriesMap,
 	step,
-	metricInspectionOptions,
+	metricInspectionAppliedOptions,
 	timeAggregatedSeriesMap,
 }: ExpandedViewProps): JSX.Element {
 	const [
@@ -44,17 +44,17 @@ function ExpandedView({
 	useEffect(() => {
 		logEvent(MetricsExplorerEvents.InspectPointClicked, {
 			[MetricsExplorerEventKeys.Modal]: 'inspect',
-			[MetricsExplorerEventKeys.Filters]: metricInspectionOptions.filters,
+			[MetricsExplorerEventKeys.Filters]: metricInspectionAppliedOptions.filters,
 			[MetricsExplorerEventKeys.TimeAggregationInterval]:
-				metricInspectionOptions.timeAggregationInterval,
+				metricInspectionAppliedOptions.timeAggregationInterval,
 			[MetricsExplorerEventKeys.TimeAggregationOption]:
-				metricInspectionOptions.timeAggregationOption,
+				metricInspectionAppliedOptions.timeAggregationOption,
 			[MetricsExplorerEventKeys.SpaceAggregationOption]:
-				metricInspectionOptions.spaceAggregationOption,
+				metricInspectionAppliedOptions.spaceAggregationOption,
 			[MetricsExplorerEventKeys.SpaceAggregationLabels]:
-				metricInspectionOptions.spaceAggregationLabels,
+				metricInspectionAppliedOptions.spaceAggregationLabels,
 		});
-	}, [metricInspectionOptions]);
+	}, [metricInspectionAppliedOptions]);
 
 	useEffect(() => {
 		if (step !== InspectionStep.COMPLETED) {
@@ -167,7 +167,7 @@ function ExpandedView({
 							<Typography.Text strong>
 								{`${absoluteValue} is the ${
 									SPACE_AGGREGATION_OPTIONS_FOR_EXPANDED_VIEW[
-										metricInspectionOptions.spaceAggregationOption ??
+										metricInspectionAppliedOptions.spaceAggregationOption ??
 											SpaceAggregationOptions.SUM_BY
 									]
 								} of`}
@@ -240,7 +240,7 @@ function ExpandedView({
 											)?.value ?? options?.value
 									  } is the ${
 											TIME_AGGREGATION_OPTIONS[
-												metricInspectionOptions.timeAggregationOption ??
+												metricInspectionAppliedOptions.timeAggregationOption ??
 													TimeAggregationOptions.SUM
 											]
 									  } of`
@@ -299,7 +299,7 @@ function ExpandedView({
 							<Typography.Text strong>
 								{`${absoluteValue} is the ${
 									TIME_AGGREGATION_OPTIONS[
-										metricInspectionOptions.timeAggregationOption ??
+										metricInspectionAppliedOptions.timeAggregationOption ??
 											TimeAggregationOptions.SUM
 									]
 								} of`}

frontend/src/container/MetricsExplorer/Inspect/GraphView.tsx

@@ -13,9 +13,10 @@ import { MetricsExplorerEventKeys, MetricsExplorerEvents } from '../events';
 import { formatNumberIntoHumanReadableFormat } from '../Summary/utils';
 import { METRIC_TYPE_TO_COLOR_MAP, METRIC_TYPE_TO_ICON_MAP } from './constants';
 import GraphPopover from './GraphPopover';
+import HoverPopover from './HoverPopover';
 import TableView from './TableView';
 import { GraphPopoverOptions, GraphViewProps } from './types';
-import { HoverPopover, onGraphClick, onGraphHover } from './utils';
+import { onGraphClick, onGraphHover } from './utils';
 
 function GraphView({
 	inspectMetricsTimeSeries,
@@ -29,7 +30,7 @@ function GraphView({
 	popoverOptions,
 	setShowExpandedView,
 	setExpandedViewOptions,
-	metricInspectionOptions,
+	metricInspectionAppliedOptions,
 	isInspectMetricsRefetching,
 }: GraphViewProps): JSX.Element {
 	const isDarkMode = useIsDarkMode();
@@ -233,7 +234,7 @@ function GraphView({
 						inspectMetricsTimeSeries={inspectMetricsTimeSeries}
 						setShowExpandedView={setShowExpandedView}
 						setExpandedViewOptions={setExpandedViewOptions}
-						metricInspectionOptions={metricInspectionOptions}
+						metricInspectionAppliedOptions={metricInspectionAppliedOptions}
 						isInspectMetricsRefetching={isInspectMetricsRefetching}
 					/>
 				)}
@@ -255,7 +256,7 @@ function GraphView({
 				<HoverPopover
 					options={hoverPopoverOptions}
 					step={inspectionStep}
-					metricInspectionOptions={metricInspectionOptions}
+					metricInspectionAppliedOptions={metricInspectionAppliedOptions}
 				/>
 			)}
 		</div>

frontend/src/container/MetricsExplorer/Inspect/HoverPopover.tsx

@@ -0,0 +1,111 @@
+import { useMemo } from 'react';
+import { Card, Typography } from 'antd';
+
+import {
+	GraphPopoverOptions,
+	InspectionStep,
+	MetricInspectionOptions,
+} from './types';
+import { TimeSeriesLabelProps } from './types';
+import { formatTimestampToFullDateTime } from './utils';
+
+function TimeSeriesLabel({
+	timeSeries,
+	textColor,
+}: TimeSeriesLabelProps): JSX.Element {
+	return (
+		<>
+			{Object.entries(timeSeries?.labels ?? {}).map(([key, value]) => (
+				<span key={key}>
+					<Typography.Text style={{ color: textColor, fontWeight: 600 }}>
+						{key}
+					</Typography.Text>
+					: {value}{' '}
+				</span>
+			))}
+		</>
+	);
+}
+
+function HoverPopover({
+	options,
+	step,
+	metricInspectionAppliedOptions,
+}: {
+	options: GraphPopoverOptions;
+	step: InspectionStep;
+	metricInspectionAppliedOptions: MetricInspectionOptions;
+}): JSX.Element {
+	const closestTimestamp = useMemo(() => {
+		if (!options.timeSeries) {
+			return options.timestamp;
+		}
+		return options.timeSeries?.values.reduce((prev, curr) => {
+			const prevDiff = Math.abs(prev.timestamp - options.timestamp);
+			const currDiff = Math.abs(curr.timestamp - options.timestamp);
+			return prevDiff < currDiff ? prev : curr;
+		}).timestamp;
+	}, [options.timeSeries, options.timestamp]);
+
+	const closestValue = useMemo(() => {
+		if (!options.timeSeries) {
+			return options.value;
+		}
+		const index = options.timeSeries.values.findIndex(
+			(value) => value.timestamp === closestTimestamp,
+		);
+		return index !== undefined && index >= 0
+			? options.timeSeries?.values[index].value
+			: null;
+	}, [options.timeSeries, closestTimestamp, options.value]);
+
+	const title = useMemo(() => {
+		if (
+			step === InspectionStep.COMPLETED &&
+			metricInspectionAppliedOptions.spaceAggregationLabels.length === 0
+		) {
+			return undefined;
+		}
+		if (step === InspectionStep.COMPLETED && options.timeSeries?.title) {
+			return options.timeSeries.title;
+		}
+		if (!options.timeSeries) {
+			return undefined;
+		}
+		return (
+			<TimeSeriesLabel
+				timeSeries={options.timeSeries}
+				textColor={options.timeSeries?.strokeColor}
+			/>
+		);
+	}, [step, options.timeSeries, metricInspectionAppliedOptions]);
+
+	return (
+		<Card
+			className="hover-popover-card"
+			style={{
+				top: options.y + 10,
+				left: options.x + 10,
+			}}
+		>
+			<div className="hover-popover-row">
+				<Typography.Text>
+					{formatTimestampToFullDateTime(closestTimestamp ?? 0)}
+				</Typography.Text>
+				<Typography.Text>{Number(closestValue).toFixed(2)}</Typography.Text>
+			</div>
+			{options.timeSeries && (
+				<Typography.Text
+					style={{
+						color: options.timeSeries?.strokeColor,
+						fontWeight: 200,
+					}}
+				>
+					{title}
+				</Typography.Text>
+			)}
+		</Card>
+	);
+}
+
+export default HoverPopover;

frontend/src/container/MetricsExplorer/Inspect/Inspect.styles.scss

@@ -122,6 +122,10 @@
 				gap: 4px;
 
 				.inspect-metrics-query-builder-header {
+					display: flex;
+					align-items: center;
+					justify-content: space-between;
+
 					.query-builder-button-label {
 						display: flex;
 						align-items: center;
@@ -257,6 +261,21 @@
 
 				.completed-checklist-container {
 					margin-left: 20px;
+
+					.completed-checklist-item,
+					.whats-next-checklist-item {
+						.completed-checklist-item-title,
+						.whats-next-checklist-item-title {
+							display: flex;
+							align-items: center;
+							gap: 4px;
+							.ant-typography {
+								display: flex;
+								align-items: center;
+								gap: 4px;
+							}
+						}
+					}
 				}
 
 				.completed-message-container {

frontend/src/container/MetricsExplorer/Inspect/Inspect.tsx

@@ -9,6 +9,7 @@ import { useQueryOperations } from 'hooks/queryBuilder/useQueryBuilderOperations
 import { useIsDarkMode } from 'hooks/useDarkMode';
 import { Compass } from 'lucide-react';
 import ErrorBoundaryFallback from 'pages/ErrorBoundaryFallback/ErrorBoundaryFallback';
+import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 
 import { MetricsExplorerEventKeys, MetricsExplorerEvents } from '../events';
@@ -31,7 +32,12 @@ function Inspect({
 	onClose,
 }: InspectProps): JSX.Element {
 	const isDarkMode = useIsDarkMode();
-	const [metricName, setMetricName] = useState<string | null>(defaultMetricName);
+	const [currentMetricName, setCurrentMetricName] = useState<string>(
+		defaultMetricName,
+	);
+	const [appliedMetricName, setAppliedMetricName] = useState<string>(
+		defaultMetricName,
+	);
 	const [
 		popoverOptions,
 		setPopoverOptions,
@@ -42,9 +48,12 @@ function Inspect({
 	] = useState<GraphPopoverOptions | null>(null);
 	const [showExpandedView, setShowExpandedView] = useState(false);
 
-	const { data: metricDetailsData } = useGetMetricDetails(metricName ?? '', {
-		enabled: !!metricName,
-	});
+	const { data: metricDetailsData } = useGetMetricDetails(
+		appliedMetricName ?? '',
+		{
+			enabled: !!appliedMetricName,
+		},
+	);
 
 	const { currentQuery } = useQueryBuilder();
 	const { handleChangeQueryData } = useQueryOperations({
@@ -97,25 +106,16 @@ function Inspect({
 		aggregatedTimeSeries,
 		timeAggregatedSeriesMap,
 		reset,
-	} = useInspectMetrics(metricName);
+	} = useInspectMetrics(appliedMetricName);
 
 	const handleDispatchMetricInspectionOptions = useCallback(
 		(action: MetricInspectionAction): void => {
 			dispatchMetricInspectionOptions(action);
 			logEvent(MetricsExplorerEvents.InspectQueryChanged, {
 				[MetricsExplorerEventKeys.Modal]: 'inspect',
-				[MetricsExplorerEventKeys.Filters]: metricInspectionOptions.filters,
-				[MetricsExplorerEventKeys.TimeAggregationInterval]:
-					metricInspectionOptions.timeAggregationInterval,
-				[MetricsExplorerEventKeys.TimeAggregationOption]:
-					metricInspectionOptions.timeAggregationOption,
-				[MetricsExplorerEventKeys.SpaceAggregationOption]:
-					metricInspectionOptions.spaceAggregationOption,
-				[MetricsExplorerEventKeys.SpaceAggregationLabels]:
-					metricInspectionOptions.spaceAggregationLabels,
 			});
 		},
-		[dispatchMetricInspectionOptions, metricInspectionOptions],
+		[dispatchMetricInspectionOptions],
 	);
 
 	const selectedMetricType = useMemo(
@@ -128,18 +128,39 @@ function Inspect({
 		[metricDetailsData],
 	);
 
+	const aggregateAttribute = useMemo(
+		() => ({
+			key: currentMetricName ?? '',
+			dataType: DataTypes.String,
+			type: selectedMetricType as string,
+			isColumn: true,
+			isJSON: false,
+			id: `${currentMetricName}--${DataTypes.String}--${selectedMetricType}--true`,
+		}),
+		[currentMetricName, selectedMetricType],
+	);
+
+	const [currentQueryData, setCurrentQueryData] = useState<IBuilderQuery>({
+		...searchQuery,
+		aggregateAttribute,
+	});
+
+	useEffect(() => {
+		if (searchQuery) {
+			setCurrentQueryData({
+				...searchQuery,
+				aggregateAttribute,
+			});
+		}
+	}, [aggregateAttribute, searchQuery]);
+
 	const resetInspection = useCallback(() => {
 		setShowExpandedView(false);
 		setPopoverOptions(null);
 		setExpandedViewOptions(null);
+		setCurrentQueryData(searchQuery as IBuilderQuery);
 		reset();
-	}, [reset]);
-
-	// Reset inspection when the selected metric changes
-	useEffect(() => {
-		resetInspection();
-		// eslint-disable-next-line react-hooks/exhaustive-deps
-	}, [metricName]);
+	}, [reset, searchQuery]);
 
 	// Hide expanded view whenever inspection step changes
 	useEffect(() => {
@@ -193,7 +214,7 @@ function Inspect({
 						inspectMetricsTimeSeries={aggregatedTimeSeries}
 						formattedInspectMetricsTimeSeries={formattedInspectMetricsTimeSeries}
 						resetInspection={resetInspection}
-						metricName={metricName}
+						metricName={appliedMetricName}
 						metricUnit={selectedMetricUnit}
 						metricType={selectedMetricType}
 						spaceAggregationSeriesMap={spaceAggregationSeriesMap}
@@ -203,19 +224,20 @@ function Inspect({
 						showExpandedView={showExpandedView}
 						setExpandedViewOptions={setExpandedViewOptions}
 						popoverOptions={popoverOptions}
-						metricInspectionOptions={metricInspectionOptions}
+						metricInspectionAppliedOptions={metricInspectionOptions.appliedOptions}
 						isInspectMetricsRefetching={isInspectMetricsRefetching}
 					/>
 					<QueryBuilder
-						metricName={metricName}
-						metricType={selectedMetricType}
-						setMetricName={setMetricName}
+						currentMetricName={currentMetricName}
+						setCurrentMetricName={setCurrentMetricName}
+						setAppliedMetricName={setAppliedMetricName}
 						spaceAggregationLabels={spaceAggregationLabels}
-						metricInspectionOptions={metricInspectionOptions}
+						currentMetricInspectionOptions={metricInspectionOptions.currentOptions}
 						dispatchMetricInspectionOptions={handleDispatchMetricInspectionOptions}
 						inspectionStep={inspectionStep}
 						inspectMetricsTimeSeries={inspectMetricsTimeSeries}
-						searchQuery={searchQuery as IBuilderQuery}
+						currentQuery={currentQueryData}
+						setCurrentQuery={setCurrentQueryData}
 					/>
 				</div>
 				<div className="inspect-metrics-content-second-col">
@@ -228,7 +250,7 @@ function Inspect({
 							options={expandedViewOptions}
 							spaceAggregationSeriesMap={spaceAggregationSeriesMap}
 							step={inspectionStep}
-							metricInspectionOptions={metricInspectionOptions}
+							metricInspectionAppliedOptions={metricInspectionOptions.appliedOptions}
 							timeAggregatedSeriesMap={timeAggregatedSeriesMap}
 						/>
 					)}
@@ -244,17 +266,21 @@ function Inspect({
 		aggregatedTimeSeries,
 		formattedInspectMetricsTimeSeries,
 		resetInspection,
-		metricName,
+		appliedMetricName,
 		selectedMetricUnit,
 		selectedMetricType,
 		spaceAggregationSeriesMap,
 		inspectionStep,
 		showExpandedView,
 		popoverOptions,
-		metricInspectionOptions,
+		metricInspectionOptions.appliedOptions,
+		metricInspectionOptions.currentOptions,
+		currentMetricName,
+		setCurrentMetricName,
+		setAppliedMetricName,
 		spaceAggregationLabels,
 		handleDispatchMetricInspectionOptions,
-		searchQuery,
+		currentQueryData,
 		expandedViewOptions,
 		timeAggregatedSeriesMap,
 	]);

frontend/src/container/MetricsExplorer/Inspect/MetricFilters.tsx

@@ -0,0 +1,57 @@
+import { useCallback } from 'react';
+import { Typography } from 'antd';
+import logEvent from 'api/common/logEvent';
+import QuerySearch from 'components/QueryBuilderV2/QueryV2/QuerySearch/QuerySearch';
+import { convertExpressionToFilters } from 'components/QueryBuilderV2/utils';
+import { DataSource } from 'types/common/queryBuilder';
+
+import { MetricsExplorerEventKeys, MetricsExplorerEvents } from '../events';
+import { MetricFiltersProps } from './types';
+
+function MetricFilters({
+	dispatchMetricInspectionOptions,
+	currentQuery,
+	setCurrentQuery,
+}: MetricFiltersProps): JSX.Element {
+	const handleOnChange = useCallback(
+		(expression: string): void => {
+			logEvent(MetricsExplorerEvents.FilterApplied, {
+				[MetricsExplorerEventKeys.Modal]: 'inspect',
+			});
+			const tagFilter = {
+				items: convertExpressionToFilters(expression),
+				op: 'AND',
+			};
+			setCurrentQuery({
+				...currentQuery,
+				filters: tagFilter,
+				filter: {
+					...currentQuery.filter,
+					expression,
+				},
+				expression,
+			});
+			dispatchMetricInspectionOptions({
+				type: 'SET_FILTERS',
+				payload: tagFilter,
+			});
+		},
+		[currentQuery, dispatchMetricInspectionOptions, setCurrentQuery],
+	);
+
+	return (
+		<div
+			data-testid="metric-filters"
+			className="inspect-metrics-input-group metric-filters"
+		>
+			<Typography.Text>Where</Typography.Text>
+			<QuerySearch
+				queryData={currentQuery}
+				onChange={handleOnChange}
+				dataSource={DataSource.METRICS}
+			/>
+		</div>
+	);
+}
+
+export default MetricFilters;

frontend/src/container/MetricsExplorer/Inspect/MetricNameSearch.tsx

@@ -0,0 +1,40 @@
+import { useState } from 'react';
+import { Typography } from 'antd';
+import { initialQueriesMap } from 'constants/queryBuilder';
+import { AggregatorFilter } from 'container/QueryBuilder/filters';
+import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
+import { DataSource } from 'types/common/queryBuilder';
+
+import { MetricNameSearchProps } from './types';
+
+function MetricNameSearch({
+	currentMetricName,
+	setCurrentMetricName,
+}: MetricNameSearchProps): JSX.Element {
+	const [searchText, setSearchText] = useState(currentMetricName);
+
+	const handleSetMetricName = (value: BaseAutocompleteData): void => {
+		setCurrentMetricName(value.key);
+	};
+
+	const handleChange = (value: BaseAutocompleteData): void => {
+		setSearchText(value.key);
+	};
+
+	return (
+		<div
+			data-testid="metric-name-search"
+			className="inspect-metrics-input-group metric-name-search"
+		>
+			<Typography.Text>From</Typography.Text>
+			<AggregatorFilter
+				defaultValue={searchText ?? ''}
+				query={initialQueriesMap[DataSource.METRICS].builder.queryData[0]}
+				onSelect={handleSetMetricName}
+				onChange={handleChange}
+			/>
+		</div>
+	);
+}
+
+export default MetricNameSearch;

frontend/src/container/MetricsExplorer/Inspect/MetricSpaceAggregation.tsx

@@ -0,0 +1,73 @@
+import { Typography } from 'antd';
+import { Select } from 'antd';
+import classNames from 'classnames';
+
+import { SPACE_AGGREGATION_OPTIONS } from './constants';
+import { InspectionStep } from './types';
+import { MetricSpaceAggregationProps } from './types';
+
+function MetricSpaceAggregation({
+	spaceAggregationLabels,
+	currentMetricInspectionOptions,
+	dispatchMetricInspectionOptions,
+	inspectionStep,
+}: MetricSpaceAggregationProps): JSX.Element {
+	return (
+		<div
+			data-testid="metric-space-aggregation"
+			className="metric-space-aggregation"
+		>
+			<div
+				className={classNames('metric-space-aggregation-header', {
+					'selected-step': inspectionStep === InspectionStep.SPACE_AGGREGATION,
+				})}
+			>
+				<Typography.Text>AGGREGATE BY LABELS</Typography.Text>
+			</div>
+			<div className="metric-space-aggregation-content">
+				<div className="metric-space-aggregation-content-left">
+					<Select
+						value={currentMetricInspectionOptions.spaceAggregationOption}
+						placeholder="Select option"
+						onChange={(value): void => {
+							dispatchMetricInspectionOptions({
+								type: 'SET_SPACE_AGGREGATION_OPTION',
+								payload: value,
+							});
+						}}
+						style={{ width: 130 }}
+						disabled={inspectionStep === InspectionStep.TIME_AGGREGATION}
+					>
+						{/* eslint-disable-next-line sonarjs/no-identical-functions */}
+						{Object.entries(SPACE_AGGREGATION_OPTIONS).map(([key, value]) => (
+							<Select.Option key={key} value={key}>
+								{value}
+							</Select.Option>
+						))}
+					</Select>
+				</div>
+				<Select
+					mode="multiple"
+					style={{ width: '100%' }}
+					placeholder="Search for attributes..."
+					value={currentMetricInspectionOptions.spaceAggregationLabels}
+					onChange={(value): void => {
+						dispatchMetricInspectionOptions({
+							type: 'SET_SPACE_AGGREGATION_LABELS',
+							payload: value,
+						});
+					}}
+					disabled={inspectionStep === InspectionStep.TIME_AGGREGATION}
+				>
+					{spaceAggregationLabels.map((label) => (
+						<Select.Option key={label} value={label}>
+							{label}
+						</Select.Option>
+					))}
+				</Select>
+			</div>
+		</div>
+	);
+}
+
+export default MetricSpaceAggregation;

frontend/src/container/MetricsExplorer/Inspect/MetricTimeAggregation.tsx

@@ -0,0 +1,80 @@
+import { Input, Typography } from 'antd';
+import { Select } from 'antd';
+import classNames from 'classnames';
+
+import { TIME_AGGREGATION_OPTIONS } from './constants';
+import { InspectionStep } from './types';
+import { MetricTimeAggregationProps } from './types';
+import { getDefaultTimeAggregationInterval } from './utils';
+
+function MetricTimeAggregation({
+	currentMetricInspectionOptions,
+	dispatchMetricInspectionOptions,
+	inspectionStep,
+	inspectMetricsTimeSeries,
+}: MetricTimeAggregationProps): JSX.Element {
+	return (
+		<div
+			data-testid="metric-time-aggregation"
+			className="metric-time-aggregation"
+		>
+			<div
+				className={classNames('metric-time-aggregation-header', {
+					'selected-step': inspectionStep === InspectionStep.TIME_AGGREGATION,
+				})}
+			>
+				<Typography.Text>AGGREGATE BY TIME</Typography.Text>
+			</div>
+			<div className="metric-time-aggregation-content">
+				<div className="inspect-metrics-input-group">
+					<Typography.Text>Align with</Typography.Text>
+					<Select
+						value={currentMetricInspectionOptions.timeAggregationOption}
+						onChange={(value): void => {
+							dispatchMetricInspectionOptions({
+								type: 'SET_TIME_AGGREGATION_OPTION',
+								payload: value,
+							});
+							// set the time aggregation interval to the default value if it is not set
+							if (!currentMetricInspectionOptions.timeAggregationInterval) {
+								dispatchMetricInspectionOptions({
+									type: 'SET_TIME_AGGREGATION_INTERVAL',
+									payload: getDefaultTimeAggregationInterval(
+										inspectMetricsTimeSeries[0],
+									),
+								});
+							}
+						}}
+						style={{ width: 130 }}
+						placeholder="Select option"
+					>
+						{Object.entries(TIME_AGGREGATION_OPTIONS).map(([key, value]) => (
+							<Select.Option key={key} value={key}>
+								{value}
+							</Select.Option>
+						))}
+					</Select>
+				</div>
+				<div className="inspect-metrics-input-group">
+					<Typography.Text>aggregated every</Typography.Text>
+					<Input
+						type="number"
+						className="no-arrows-input"
+						value={currentMetricInspectionOptions.timeAggregationInterval}
+						placeholder="Select interval..."
+						suffix="seconds"
+						onChange={(e): void => {
+							dispatchMetricInspectionOptions({
+								type: 'SET_TIME_AGGREGATION_INTERVAL',
+								payload: parseInt(e.target.value, 10),
+							});
+						}}
+						onWheel={(e): void => (e.target as HTMLInputElement).blur()}
+					/>
+				</div>
+			</div>
+		</div>
+	);
+}
+
+export default MetricTimeAggregation;

frontend/src/container/MetricsExplorer/Inspect/QueryBuilder.tsx

@@ -1,25 +1,33 @@
+import { useCallback } from 'react';
 import { Button, Card } from 'antd';
+import RunQueryBtn from 'container/QueryBuilder/components/RunQueryBtn/RunQueryBtn';
 import { Atom } from 'lucide-react';
 
+import MetricFilters from './MetricFilters';
+import MetricNameSearch from './MetricNameSearch';
+import MetricSpaceAggregation from './MetricSpaceAggregation';
+import MetricTimeAggregation from './MetricTimeAggregation';
 import { QueryBuilderProps } from './types';
-import {
-	MetricFilters,
-	MetricNameSearch,
-	MetricSpaceAggregation,
-	MetricTimeAggregation,
-} from './utils';
 
 function QueryBuilder({
-	metricName,
-	setMetricName,
+	currentMetricName,
+	setCurrentMetricName,
+	setAppliedMetricName,
 	spaceAggregationLabels,
-	metricInspectionOptions,
+	currentMetricInspectionOptions,
 	dispatchMetricInspectionOptions,
 	inspectionStep,
 	inspectMetricsTimeSeries,
-	searchQuery,
-	metricType,
+	currentQuery,
+	setCurrentQuery,
 }: QueryBuilderProps): JSX.Element {
+	const applyInspectionOptions = useCallback(() => {
+		setAppliedMetricName(currentMetricName ?? '');
+		dispatchMetricInspectionOptions({
+			type: 'APPLY_METRIC_INSPECTION_OPTIONS',
+		});
+	}, [currentMetricName, setAppliedMetricName, dispatchMetricInspectionOptions]);
+
 	return (
 		<div className="inspect-metrics-query-builder">
 			<div className="inspect-metrics-query-builder-header">
@@ -31,25 +39,28 @@ function QueryBuilder({
 				>
 					Query Builder
 				</Button>
+				<RunQueryBtn onStageRunQuery={applyInspectionOptions} />
 			</div>
 			<Card className="inspect-metrics-query-builder-content">
-				<MetricNameSearch metricName={metricName} setMetricName={setMetricName} />
+				<MetricNameSearch
+					currentMetricName={currentMetricName}
+					setCurrentMetricName={setCurrentMetricName}
+				/>
 				<MetricFilters
 					dispatchMetricInspectionOptions={dispatchMetricInspectionOptions}
-					searchQuery={searchQuery}
-					metricName={metricName}
-					metricType={metricType || null}
+					currentQuery={currentQuery}
+					setCurrentQuery={setCurrentQuery}
 				/>
 				<MetricTimeAggregation
 					inspectionStep={inspectionStep}
-					metricInspectionOptions={metricInspectionOptions}
+					currentMetricInspectionOptions={currentMetricInspectionOptions}
 					dispatchMetricInspectionOptions={dispatchMetricInspectionOptions}
 					inspectMetricsTimeSeries={inspectMetricsTimeSeries}
 				/>
 				<MetricSpaceAggregation
 					inspectionStep={inspectionStep}
 					spaceAggregationLabels={spaceAggregationLabels}
-					metricInspectionOptions={metricInspectionOptions}
+					currentMetricInspectionOptions={currentMetricInspectionOptions}
 					dispatchMetricInspectionOptions={dispatchMetricInspectionOptions}
 				/>
 			</Card>

frontend/src/container/MetricsExplorer/Inspect/TableView.tsx

@@ -11,13 +11,13 @@ function TableView({
 	setShowExpandedView,
 	setExpandedViewOptions,
 	isInspectMetricsRefetching,
-	metricInspectionOptions,
+	metricInspectionAppliedOptions,
 }: TableViewProps): JSX.Element {
 	const isSpaceAggregatedWithoutLabel = useMemo(
 		() =>
-			!!metricInspectionOptions.spaceAggregationOption &&
-			metricInspectionOptions.spaceAggregationLabels.length === 0,
-		[metricInspectionOptions],
+			!!metricInspectionAppliedOptions.spaceAggregationOption &&
+			metricInspectionAppliedOptions.spaceAggregationLabels.length === 0,
+		[metricInspectionAppliedOptions],
 	);
 	const labelKeys = useMemo(() => {
 		if (isSpaceAggregatedWithoutLabel) {

frontend/src/container/MetricsExplorer/Inspect/TimeSeriesLabel.tsx

@@ -0,0 +1,23 @@
+import { Typography } from 'antd';
+
+import { TimeSeriesLabelProps } from './types';
+
+function TimeSeriesLabel({
+	timeSeries,
+	textColor,
+}: TimeSeriesLabelProps): JSX.Element {
+	return (
+		<>
+			{Object.entries(timeSeries?.labels ?? {}).map(([key, value]) => (
+				<span key={key}>
+					<Typography.Text style={{ color: textColor, fontWeight: 600 }}>
+						{key}
+					</Typography.Text>
+					: {value}{' '}
+				</span>
+			))}
+		</>
+	);
+}
+
+export default TimeSeriesLabel;

frontend/src/container/MetricsExplorer/Inspect/__tests__/ExpandedView.test.tsx

@@ -62,7 +62,7 @@ describe('ExpandedView', () => {
 		],
 	]);
 
-	const mockMetricInspectionOptions: MetricInspectionOptions = {
+	const mockMetricInspectionAppliedOptions: MetricInspectionOptions = {
 		timeAggregationOption: TimeAggregationOptions.MAX,
 		timeAggregationInterval: 60,
 		spaceAggregationOption: SpaceAggregationOptions.MAX_BY,
@@ -79,7 +79,7 @@ describe('ExpandedView', () => {
 				options={mockOptions}
 				spaceAggregationSeriesMap={mockSpaceAggregationSeriesMap}
 				step={InspectionStep.TIME_AGGREGATION}
-				metricInspectionOptions={mockMetricInspectionOptions}
+				metricInspectionAppliedOptions={mockMetricInspectionAppliedOptions}
 				timeAggregatedSeriesMap={mockTimeAggregatedSeriesMap}
 			/>,
 		);
@@ -96,8 +96,8 @@ describe('ExpandedView', () => {
 				options={mockOptions}
 				spaceAggregationSeriesMap={mockSpaceAggregationSeriesMap}
 				step={InspectionStep.SPACE_AGGREGATION}
-				metricInspectionOptions={{
-					...mockMetricInspectionOptions,
+				metricInspectionAppliedOptions={{
+					...mockMetricInspectionAppliedOptions,
 					timeAggregationInterval: TIME_AGGREGATION_INTERVAL,
 				}}
 				timeAggregatedSeriesMap={mockTimeAggregatedSeriesMap}
@@ -112,7 +112,7 @@ describe('ExpandedView', () => {
 			screen.getByText(
 				`42.123 is the ${
 					TIME_AGGREGATION_OPTIONS[
-						mockMetricInspectionOptions.timeAggregationOption as TimeAggregationOptions
+						mockMetricInspectionAppliedOptions.timeAggregationOption as TimeAggregationOptions
 					]
 				} of`,
 			),
@@ -127,7 +127,7 @@ describe('ExpandedView', () => {
 				options={mockOptions}
 				spaceAggregationSeriesMap={mockSpaceAggregationSeriesMap}
 				step={InspectionStep.COMPLETED}
-				metricInspectionOptions={mockMetricInspectionOptions}
+				metricInspectionAppliedOptions={mockMetricInspectionAppliedOptions}
 				timeAggregatedSeriesMap={mockTimeAggregatedSeriesMap}
 			/>,
 		);
@@ -139,7 +139,7 @@ describe('ExpandedView', () => {
 			screen.getByText(
 				`42.123 is the ${
 					SPACE_AGGREGATION_OPTIONS_FOR_EXPANDED_VIEW[
-						mockMetricInspectionOptions.spaceAggregationOption as SpaceAggregationOptions
+						mockMetricInspectionAppliedOptions.spaceAggregationOption as SpaceAggregationOptions
 					]
 				} of`,
 			),
@@ -153,7 +153,7 @@ describe('ExpandedView', () => {
 				options={mockOptions}
 				spaceAggregationSeriesMap={mockSpaceAggregationSeriesMap}
 				step={InspectionStep.TIME_AGGREGATION}
-				metricInspectionOptions={mockMetricInspectionOptions}
+				metricInspectionAppliedOptions={mockMetricInspectionAppliedOptions}
 				timeAggregatedSeriesMap={mockTimeAggregatedSeriesMap}
 			/>,
 		);

frontend/src/container/MetricsExplorer/Inspect/__tests__/GraphView.test.tsx

@@ -54,7 +54,7 @@ describe('GraphView', () => {
 		setExpandedViewOptions: jest.fn(),
 		resetInspection: jest.fn(),
 		showExpandedView: false,
-		metricInspectionOptions: {
+		metricInspectionAppliedOptions: {
 			timeAggregationInterval: 60,
 			spaceAggregationOption: SpaceAggregationOptions.MAX_BY,
 			spaceAggregationLabels: ['host_name'],

frontend/src/container/MetricsExplorer/Inspect/__tests__/QueryBuilder.test.tsx

@@ -2,6 +2,7 @@
 import { QueryClient, QueryClientProvider } from 'react-query';
 import { Provider } from 'react-redux';
 import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import { MetricType } from 'api/metricsExplorer/getMetricsList';
 import * as appContextHooks from 'providers/App/App';
 import store from 'store';
@@ -22,6 +23,27 @@ jest.mock('react-router-dom', () => ({
 	}),
 }));
 
+jest.mock('container/QueryBuilder/filters', () => ({
+	AggregatorFilter: ({ onSelect, onChange, defaultValue }: any): JSX.Element => (
+		<div data-testid="mock-aggregator-filter">
+			<input
+				data-testid="metric-name-input"
+				defaultValue={defaultValue}
+				onChange={(e: React.ChangeEvent<HTMLInputElement>): void =>
+					onChange({ key: e.target.value })
+				}
+			/>
+			<button
+				type="button"
+				data-testid="select-metric-button"
+				onClick={(): void => onSelect({ key: 'test_metric_2' })}
+			>
+				Select Metric
+			</button>
+		</div>
+	),
+}));
+
 jest.spyOn(appContextHooks, 'useAppContext').mockReturnValue({
 	user: {
 		role: 'admin',
@@ -48,12 +70,16 @@ jest.spyOn(appContextHooks, 'useAppContext').mockReturnValue({
 
 const queryClient = new QueryClient();
 
+const mockSetCurrentMetricName = jest.fn();
+const mockSetAppliedMetricName = jest.fn();
+
 describe('QueryBuilder', () => {
 	const defaultProps = {
-		metricName: 'test_metric',
-		setMetricName: jest.fn(),
+		currentMetricName: 'test_metric',
+		setCurrentMetricName: mockSetCurrentMetricName,
+		setAppliedMetricName: mockSetAppliedMetricName,
 		spaceAggregationLabels: ['label1', 'label2'],
-		metricInspectionOptions: {
+		currentMetricInspectionOptions: {
 			timeAggregationInterval: 60,
 			timeAggregationOption: TimeAggregationOptions.AVG,
 			spaceAggregationLabels: [],
@@ -67,19 +93,20 @@ describe('QueryBuilder', () => {
 		metricType: MetricType.SUM,
 		inspectionStep: InspectionStep.TIME_AGGREGATION,
 		inspectMetricsTimeSeries: [],
-		searchQuery: {
+		currentQuery: {
 			filters: {
 				items: [],
 				op: 'and',
 			},
 		} as any,
+		setCurrentQuery: jest.fn(),
 	};
 
 	beforeEach(() => {
 		jest.clearAllMocks();
 	});
 
-	it('renders query builder header', () => {
+	it('renders query builder with all components', () => {
 		render(
 			<QueryClientProvider client={queryClient}>
 				<Provider store={store}>
@@ -88,49 +115,53 @@ describe('QueryBuilder', () => {
 			</QueryClientProvider>,
 		);
 		expect(screen.getByText('Query Builder')).toBeInTheDocument();
-	});
-
-	it('renders metric name search component', () => {
-		render(
-			<QueryClientProvider client={queryClient}>
-				<Provider store={store}>
-					<QueryBuilder {...defaultProps} />
-				</Provider>
-			</QueryClientProvider>,
-		);
 		expect(screen.getByTestId('metric-name-search')).toBeInTheDocument();
-	});
-
-	it('renders metric filters component', () => {
-		render(
-			<QueryClientProvider client={queryClient}>
-				<Provider store={store}>
-					<QueryBuilder {...defaultProps} />
-				</Provider>
-			</QueryClientProvider>,
-		);
 		expect(screen.getByTestId('metric-filters')).toBeInTheDocument();
-	});
-
-	it('renders time aggregation component', () => {
-		render(
-			<QueryClientProvider client={queryClient}>
-				<Provider store={store}>
-					<QueryBuilder {...defaultProps} />
-				</Provider>
-			</QueryClientProvider>,
-		);
 		expect(screen.getByTestId('metric-time-aggregation')).toBeInTheDocument();
-	});
-
-	it('renders space aggregation component', () => {
-		render(
-			<QueryClientProvider client={queryClient}>
-				<Provider store={store}>
-					<QueryBuilder {...defaultProps} />
-				</Provider>
-			</QueryClientProvider>,
-		);
 		expect(screen.getByTestId('metric-space-aggregation')).toBeInTheDocument();
 	});
+
+	it('should call setCurrentMetricName when metric name is selected', async () => {
+		const user = userEvent.setup();
+
+		render(
+			<QueryClientProvider client={queryClient}>
+				<Provider store={store}>
+					<QueryBuilder {...defaultProps} />
+				</Provider>
+			</QueryClientProvider>,
+		);
+
+		const metricNameSearch = screen.getByTestId('metric-name-search');
+		expect(metricNameSearch).toBeInTheDocument();
+
+		expect(screen.getByText('From')).toBeInTheDocument();
+
+		const selectButton = screen.getByTestId('select-metric-button');
+		await user.click(selectButton);
+
+		expect(mockSetCurrentMetricName).toHaveBeenCalledWith('test_metric_2');
+	});
+
+	it('should call setAppliedMetricName and apply inspection options when query is applied', async () => {
+		const user = userEvent.setup();
+
+		render(
+			<QueryClientProvider client={queryClient}>
+				<Provider store={store}>
+					<QueryBuilder {...defaultProps} />
+				</Provider>
+			</QueryClientProvider>,
+		);
+
+		const applyQueryButton = screen.getByText('Run Query');
+		await user.click(applyQueryButton);
+
+		expect(mockSetCurrentMetricName).toHaveBeenCalledTimes(0);
+		expect(mockSetAppliedMetricName).toHaveBeenCalledWith('test_metric');
+
+		expect(defaultProps.dispatchMetricInspectionOptions).toHaveBeenCalledWith({
+			type: 'APPLY_METRIC_INSPECTION_OPTIONS',
+		});
+	});
 });

frontend/src/container/MetricsExplorer/Inspect/__tests__/TableView.test.tsx

@@ -49,7 +49,7 @@ describe('TableView', () => {
 		inspectMetricsTimeSeries: mockTimeSeries,
 		setShowExpandedView: jest.fn(),
 		setExpandedViewOptions: jest.fn(),
-		metricInspectionOptions: {
+		metricInspectionAppliedOptions: {
 			timeAggregationInterval: 60,
 			timeAggregationOption: TimeAggregationOptions.MAX,
 			spaceAggregationOption: SpaceAggregationOptions.MAX_BY,

frontend/src/container/MetricsExplorer/Inspect/constants.ts

@@ -11,7 +11,7 @@ import {
 } from 'lucide-react';
 
 import {
-	MetricInspectionOptions,
+	MetricInspectionState,
 	SpaceAggregationOptions,
 	TimeAggregationOptions,
 } from './types';
@@ -71,14 +71,26 @@ export const SPACE_AGGREGATION_OPTIONS_FOR_EXPANDED_VIEW: Record<
 	[SpaceAggregationOptions.AVG_BY]: 'Avg',
 };
 
-export const INITIAL_INSPECT_METRICS_OPTIONS: MetricInspectionOptions = {
-	timeAggregationOption: undefined,
-	timeAggregationInterval: undefined,
-	spaceAggregationOption: undefined,
-	spaceAggregationLabels: [],
-	filters: {
-		items: [],
-		op: 'AND',
+export const INITIAL_INSPECT_METRICS_OPTIONS: MetricInspectionState = {
+	currentOptions: {
+		timeAggregationOption: undefined,
+		timeAggregationInterval: undefined,
+		spaceAggregationOption: undefined,
+		spaceAggregationLabels: [],
+		filters: {
+			items: [],
+			op: 'AND',
+		},
+	},
+	appliedOptions: {
+		timeAggregationOption: undefined,
+		timeAggregationInterval: undefined,
+		spaceAggregationOption: undefined,
+		spaceAggregationLabels: [],
+		filters: {
+			items: [],
+			op: 'AND',
+		},
 	},
 };
 

frontend/src/container/MetricsExplorer/Inspect/types.ts

@@ -7,7 +7,7 @@ import {
 import { AlignedData } from 'uplot';
 
 export type InspectProps = {
-	metricName: string | null;
+	metricName: string;
 	isOpen: boolean;
 	onClose: () => void;
 };
@@ -19,7 +19,7 @@ export interface UseInspectMetricsReturnData {
 	isInspectMetricsError: boolean;
 	formattedInspectMetricsTimeSeries: AlignedData;
 	spaceAggregationLabels: string[];
-	metricInspectionOptions: MetricInspectionOptions;
+	metricInspectionOptions: MetricInspectionState;
 	dispatchMetricInspectionOptions: (action: MetricInspectionAction) => void;
 	inspectionStep: InspectionStep;
 	isInspectMetricsRefetching: boolean;
@@ -43,36 +43,36 @@ export interface GraphViewProps {
 	showExpandedView: boolean;
 	setShowExpandedView: (showExpandedView: boolean) => void;
 	setExpandedViewOptions: (options: GraphPopoverOptions | null) => void;
-	metricInspectionOptions: MetricInspectionOptions;
+	metricInspectionAppliedOptions: MetricInspectionOptions;
 	isInspectMetricsRefetching: boolean;
 }
 
 export interface QueryBuilderProps {
-	metricName: string | null;
-	setMetricName: (metricName: string) => void;
-	metricType: MetricType | undefined;
+	currentMetricName: string | null;
+	setCurrentMetricName: (metricName: string) => void;
+	setAppliedMetricName: (metricName: string) => void;
 	spaceAggregationLabels: string[];
-	metricInspectionOptions: MetricInspectionOptions;
+	currentMetricInspectionOptions: MetricInspectionOptions;
 	dispatchMetricInspectionOptions: (action: MetricInspectionAction) => void;
 	inspectionStep: InspectionStep;
 	inspectMetricsTimeSeries: InspectMetricsSeries[];
-	searchQuery: IBuilderQuery;
+	currentQuery: IBuilderQuery;
+	setCurrentQuery: (query: IBuilderQuery) => void;
 }
 
 export interface MetricNameSearchProps {
-	metricName: string | null;
-	setMetricName: (metricName: string) => void;
+	currentMetricName: string | null;
+	setCurrentMetricName: (metricName: string) => void;
 }
 
 export interface MetricFiltersProps {
-	searchQuery: IBuilderQuery;
 	dispatchMetricInspectionOptions: (action: MetricInspectionAction) => void;
-	metricName: string | null;
-	metricType: MetricType | null;
+	currentQuery: IBuilderQuery;
+	setCurrentQuery: (query: IBuilderQuery) => void;
 }
 
 export interface MetricTimeAggregationProps {
-	metricInspectionOptions: MetricInspectionOptions;
+	currentMetricInspectionOptions: MetricInspectionOptions;
 	dispatchMetricInspectionOptions: (action: MetricInspectionAction) => void;
 	inspectionStep: InspectionStep;
 	inspectMetricsTimeSeries: InspectMetricsSeries[];
@@ -80,7 +80,7 @@ export interface MetricTimeAggregationProps {
 
 export interface MetricSpaceAggregationProps {
 	spaceAggregationLabels: string[];
-	metricInspectionOptions: MetricInspectionOptions;
+	currentMetricInspectionOptions: MetricInspectionOptions;
 	dispatchMetricInspectionOptions: (action: MetricInspectionAction) => void;
 	inspectionStep: InspectionStep;
 }
@@ -109,13 +109,19 @@ export interface MetricInspectionOptions {
 	filters: TagFilter;
 }
 
+export interface MetricInspectionState {
+	currentOptions: MetricInspectionOptions;
+	appliedOptions: MetricInspectionOptions;
+}
+
 export type MetricInspectionAction =
 	| { type: 'SET_TIME_AGGREGATION_OPTION'; payload: TimeAggregationOptions }
 	| { type: 'SET_TIME_AGGREGATION_INTERVAL'; payload: number }
 	| { type: 'SET_SPACE_AGGREGATION_OPTION'; payload: SpaceAggregationOptions }
 	| { type: 'SET_SPACE_AGGREGATION_LABELS'; payload: string[] }
 	| { type: 'SET_FILTERS'; payload: TagFilter }
-	| { type: 'RESET_INSPECTION' };
+	| { type: 'RESET_INSPECTION' }
+	| { type: 'APPLY_METRIC_INSPECTION_OPTIONS' };
 
 export enum InspectionStep {
 	TIME_AGGREGATION = 1,
@@ -156,7 +162,7 @@ export interface ExpandedViewProps {
 	options: GraphPopoverOptions | null;
 	spaceAggregationSeriesMap: Map<string, InspectMetricsSeries[]>;
 	step: InspectionStep;
-	metricInspectionOptions: MetricInspectionOptions;
+	metricInspectionAppliedOptions: MetricInspectionOptions;
 	timeAggregatedSeriesMap: Map<number, GraphPopoverData[]>;
 }
 
@@ -165,7 +171,7 @@ export interface TableViewProps {
 	inspectMetricsTimeSeries: InspectMetricsSeries[];
 	setShowExpandedView: (showExpandedView: boolean) => void;
 	setExpandedViewOptions: (options: GraphPopoverOptions | null) => void;
-	metricInspectionOptions: MetricInspectionOptions;
+	metricInspectionAppliedOptions: MetricInspectionOptions;
 	isInspectMetricsRefetching: boolean;
 }
 
@@ -174,3 +180,8 @@ export interface TableViewDataItem {
 	values: JSX.Element;
 	key: number;
 }
+
+export interface TimeSeriesLabelProps {
+	timeSeries: InspectMetricsSeries | undefined;
+	textColor: string | undefined;
+}

frontend/src/container/MetricsExplorer/Inspect/useInspectMetrics.ts

@@ -10,7 +10,7 @@ import {
 	GraphPopoverData,
 	InspectionStep,
 	MetricInspectionAction,
-	MetricInspectionOptions,
+	MetricInspectionState,
 	UseInspectMetricsReturnData,
 } from './types';
 import {
@@ -20,37 +20,62 @@ import {
 } from './utils';
 
 const metricInspectionReducer = (
-	state: MetricInspectionOptions,
+	state: MetricInspectionState,
 	action: MetricInspectionAction,
-): MetricInspectionOptions => {
+): MetricInspectionState => {
 	switch (action.type) {
 		case 'SET_TIME_AGGREGATION_OPTION':
 			return {
 				...state,
-				timeAggregationOption: action.payload,
+				currentOptions: {
+					...state.currentOptions,
+					timeAggregationOption: action.payload,
+				},
 			};
 		case 'SET_TIME_AGGREGATION_INTERVAL':
 			return {
 				...state,
-				timeAggregationInterval: action.payload,
+				currentOptions: {
+					...state.currentOptions,
+					timeAggregationInterval: action.payload,
+				},
 			};
 		case 'SET_SPACE_AGGREGATION_OPTION':
 			return {
 				...state,
-				spaceAggregationOption: action.payload,
+				currentOptions: {
+					...state.currentOptions,
+					spaceAggregationOption: action.payload,
+				},
 			};
 		case 'SET_SPACE_AGGREGATION_LABELS':
 			return {
 				...state,
-				spaceAggregationLabels: action.payload,
+				currentOptions: {
+					...state.currentOptions,
+					spaceAggregationLabels: action.payload,
+				},
 			};
 		case 'SET_FILTERS':
 			return {
 				...state,
-				filters: action.payload,
+				currentOptions: {
+					...state.currentOptions,
+					filters: action.payload,
+				},
+			};
+		case 'APPLY_METRIC_INSPECTION_OPTIONS':
+			return {
+				...state,
+				appliedOptions: {
+					...state.appliedOptions,
+					...state.currentOptions,
+				},
 			};
 		case 'RESET_INSPECTION':
-			return { ...INITIAL_INSPECT_METRICS_OPTIONS };
+			return {
+				...INITIAL_INSPECT_METRICS_OPTIONS,
+			};
 		default:
 			return state;
 	}
@@ -84,7 +109,7 @@ export function useInspectMetrics(
 			metricName: metricName ?? '',
 			start,
 			end,
-			filters: metricInspectionOptions.filters,
+			filters: metricInspectionOptions.appliedOptions.filters,
 		},
 		{
 			enabled: !!metricName,
@@ -117,13 +142,26 @@ export function useInspectMetrics(
 	);
 
 	// Evaluate inspection step
-	const inspectionStep = useMemo(() => {
-		if (metricInspectionOptions.spaceAggregationOption) {
+	const currentInspectionStep = useMemo(() => {
+		if (metricInspectionOptions.currentOptions.spaceAggregationOption) {
 			return InspectionStep.COMPLETED;
 		}
 		if (
-			metricInspectionOptions.timeAggregationOption &&
-			metricInspectionOptions.timeAggregationInterval
+			metricInspectionOptions.currentOptions.timeAggregationOption &&
+			metricInspectionOptions.currentOptions.timeAggregationInterval
+		) {
+			return InspectionStep.SPACE_AGGREGATION;
+		}
+		return InspectionStep.TIME_AGGREGATION;
+	}, [metricInspectionOptions]);
+
+	const appliedInspectionStep = useMemo(() => {
+		if (metricInspectionOptions.appliedOptions.spaceAggregationOption) {
+			return InspectionStep.COMPLETED;
+		}
+		if (
+			metricInspectionOptions.appliedOptions.timeAggregationOption &&
+			metricInspectionOptions.appliedOptions.timeAggregationInterval
 		) {
 			return InspectionStep.SPACE_AGGREGATION;
 		}
@@ -149,23 +187,26 @@ export function useInspectMetrics(
 
 		// Apply time aggregation once required options are set
 		if (
-			inspectionStep >= InspectionStep.SPACE_AGGREGATION &&
-			metricInspectionOptions.timeAggregationOption &&
-			metricInspectionOptions.timeAggregationInterval
+			appliedInspectionStep >= InspectionStep.SPACE_AGGREGATION &&
+			metricInspectionOptions.appliedOptions.timeAggregationOption &&
+			metricInspectionOptions.appliedOptions.timeAggregationInterval
 		) {
 			const {
 				timeAggregatedSeries,
 				timeAggregatedSeriesMap,
-			} = applyTimeAggregation(inspectMetricsTimeSeries, metricInspectionOptions);
+			} = applyTimeAggregation(
+				inspectMetricsTimeSeries,
+				metricInspectionOptions.appliedOptions,
+			);
 			timeSeries = timeAggregatedSeries;
 			setTimeAggregatedSeriesMap(timeAggregatedSeriesMap);
 			setAggregatedTimeSeries(timeSeries);
 		}
 		// Apply space aggregation
-		if (inspectionStep === InspectionStep.COMPLETED) {
+		if (appliedInspectionStep === InspectionStep.COMPLETED) {
 			const { aggregatedSeries, spaceAggregatedSeriesMap } = applySpaceAggregation(
 				timeSeries,
-				metricInspectionOptions,
+				metricInspectionOptions.appliedOptions,
 			);
 			timeSeries = aggregatedSeries;
 			setSpaceAggregatedSeriesMap(spaceAggregatedSeriesMap);
@@ -186,7 +227,7 @@ export function useInspectMetrics(
 
 		const rawData = [timestamps, ...timeseriesArray];
 		return rawData.map((series) => new Float64Array(series));
-	}, [inspectMetricsTimeSeries, inspectionStep, metricInspectionOptions]);
+	}, [inspectMetricsTimeSeries, appliedInspectionStep, metricInspectionOptions]);
 
 	const spaceAggregationLabels = useMemo(() => {
 		const labels = new Set<string>();
@@ -216,7 +257,7 @@ export function useInspectMetrics(
 		spaceAggregationLabels,
 		metricInspectionOptions,
 		dispatchMetricInspectionOptions,
-		inspectionStep,
+		inspectionStep: currentInspectionStep,
 		isInspectMetricsRefetching,
 		spaceAggregatedSeriesMap,
 		aggregatedTimeSeries,

frontend/src/container/MetricsExplorer/Inspect/utils.ts

@@ -1,36 +1,12 @@
 /* eslint-disable no-nested-ternary */
-import { useMemo, useState } from 'react';
-import { Card, Input, Select, Typography } from 'antd';
-import logEvent from 'api/common/logEvent';
+import { MetrictypesTypeDTO } from 'api/generated/services/sigNoz.schemas';
 import { InspectMetricsSeries } from 'api/metricsExplorer/getInspectMetricsDetails';
-import { MetricType } from 'api/metricsExplorer/getMetricsList';
-import classNames from 'classnames';
-import { initialQueriesMap } from 'constants/queryBuilder';
-import { AggregatorFilter } from 'container/QueryBuilder/filters';
-import QueryBuilderSearch from 'container/QueryBuilder/filters/QueryBuilderSearch';
-import { useQueryOperations } from 'hooks/queryBuilder/useQueryBuilderOperations';
-import { HardHat } from 'lucide-react';
-import {
-	BaseAutocompleteData,
-	DataTypes,
-} from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { TagFilter } from 'types/api/queryBuilder/queryBuilderData';
-import { DataSource } from 'types/common/queryBuilder';
 
-import { MetricsExplorerEventKeys, MetricsExplorerEvents } from '../events';
-import {
-	SPACE_AGGREGATION_OPTIONS,
-	TIME_AGGREGATION_OPTIONS,
-} from './constants';
 import {
 	GraphPopoverData,
 	GraphPopoverOptions,
-	InspectionStep,
-	MetricFiltersProps,
 	MetricInspectionOptions,
-	MetricNameSearchProps,
-	MetricSpaceAggregationProps,
-	MetricTimeAggregationProps,
 	SpaceAggregationOptions,
 	TimeAggregationOptions,
 } from './types';
@@ -40,8 +16,10 @@ import {
  * returns true if the feature flag is enabled, false otherwise
  * Show the inspect button in  metrics explorer if the feature flag is enabled
  */
-export function isInspectEnabled(metricType: MetricType | undefined): boolean {
-	return metricType === MetricType.GAUGE;
+export function isInspectEnabled(
+	metricType: MetrictypesTypeDTO | undefined,
+): boolean {
+	return metricType === MetrictypesTypeDTO.gauge;
 }
 
 export function getAllTimestampsOfMetrics(
@@ -70,220 +48,6 @@ export function getDefaultTimeAggregationInterval(
 	return Math.max(60, reportingInterval);
 }
 
-export function MetricNameSearch({
-	metricName,
-	setMetricName,
-}: MetricNameSearchProps): JSX.Element {
-	const [searchText, setSearchText] = useState(metricName);
-
-	const handleSetMetricName = (value: BaseAutocompleteData): void => {
-		setMetricName(value.key);
-	};
-
-	const handleChange = (value: BaseAutocompleteData): void => {
-		setSearchText(value.key);
-	};
-
-	return (
-		<div
-			data-testid="metric-name-search"
-			className="inspect-metrics-input-group metric-name-search"
-		>
-			<Typography.Text>From</Typography.Text>
-			<AggregatorFilter
-				defaultValue={searchText ?? ''}
-				query={initialQueriesMap[DataSource.METRICS].builder.queryData[0]}
-				onSelect={handleSetMetricName}
-				onChange={handleChange}
-			/>
-		</div>
-	);
-}
-
-export function MetricFilters({
-	dispatchMetricInspectionOptions,
-	searchQuery,
-	metricName,
-	metricType,
-}: MetricFiltersProps): JSX.Element {
-	const { handleChangeQueryData } = useQueryOperations({
-		index: 0,
-		query: searchQuery,
-		entityVersion: '',
-	});
-
-	const aggregateAttribute = useMemo(
-		() => ({
-			key: metricName ?? '',
-			dataType: DataTypes.String,
-			type: metricType,
-			id: `${metricName}--${DataTypes.String}--${metricType}--true`,
-		}),
-		[metricName, metricType],
-	);
-
-	return (
-		<div
-			data-testid="metric-filters"
-			className="inspect-metrics-input-group metric-filters"
-		>
-			<Typography.Text>Where</Typography.Text>
-			<QueryBuilderSearch
-				query={{
-					...searchQuery,
-					aggregateAttribute,
-				}}
-				onChange={(value): void => {
-					handleChangeQueryData('filters', value);
-					logEvent(MetricsExplorerEvents.FilterApplied, {
-						[MetricsExplorerEventKeys.Modal]: 'inspect',
-					});
-					dispatchMetricInspectionOptions({
-						type: 'SET_FILTERS',
-						payload: value,
-					});
-				}}
-				suffixIcon={<HardHat size={16} />}
-				disableNavigationShortcuts
-			/>
-		</div>
-	);
-}
-
-export function MetricTimeAggregation({
-	metricInspectionOptions,
-	dispatchMetricInspectionOptions,
-	inspectionStep,
-	inspectMetricsTimeSeries,
-}: MetricTimeAggregationProps): JSX.Element {
-	return (
-		<div
-			data-testid="metric-time-aggregation"
-			className="metric-time-aggregation"
-		>
-			<div
-				className={classNames('metric-time-aggregation-header', {
-					'selected-step': inspectionStep === InspectionStep.TIME_AGGREGATION,
-				})}
-			>
-				<Typography.Text>AGGREGATE BY TIME</Typography.Text>
-			</div>
-			<div className="metric-time-aggregation-content">
-				<div className="inspect-metrics-input-group">
-					<Typography.Text>Align with</Typography.Text>
-					<Select
-						value={metricInspectionOptions.timeAggregationOption}
-						onChange={(value): void => {
-							dispatchMetricInspectionOptions({
-								type: 'SET_TIME_AGGREGATION_OPTION',
-								payload: value,
-							});
-							// set the time aggregation interval to the default value if it is not set
-							if (!metricInspectionOptions.timeAggregationInterval) {
-								dispatchMetricInspectionOptions({
-									type: 'SET_TIME_AGGREGATION_INTERVAL',
-									payload: getDefaultTimeAggregationInterval(
-										inspectMetricsTimeSeries[0],
-									),
-								});
-							}
-						}}
-						style={{ width: 130 }}
-						placeholder="Select option"
-					>
-						{Object.entries(TIME_AGGREGATION_OPTIONS).map(([key, value]) => (
-							<Select.Option key={key} value={key}>
-								{value}
-							</Select.Option>
-						))}
-					</Select>
-				</div>
-				<div className="inspect-metrics-input-group">
-					<Typography.Text>aggregated every</Typography.Text>
-					<Input
-						type="number"
-						className="no-arrows-input"
-						value={metricInspectionOptions.timeAggregationInterval}
-						placeholder="Select interval..."
-						suffix="seconds"
-						onChange={(e): void => {
-							dispatchMetricInspectionOptions({
-								type: 'SET_TIME_AGGREGATION_INTERVAL',
-								payload: parseInt(e.target.value, 10),
-							});
-						}}
-						onWheel={(e): void => (e.target as HTMLInputElement).blur()}
-					/>
-				</div>
-			</div>
-		</div>
-	);
-}
-
-export function MetricSpaceAggregation({
-	spaceAggregationLabels,
-	metricInspectionOptions,
-	dispatchMetricInspectionOptions,
-	inspectionStep,
-}: MetricSpaceAggregationProps): JSX.Element {
-	return (
-		<div
-			data-testid="metric-space-aggregation"
-			className="metric-space-aggregation"
-		>
-			<div
-				className={classNames('metric-space-aggregation-header', {
-					'selected-step': inspectionStep === InspectionStep.SPACE_AGGREGATION,
-				})}
-			>
-				<Typography.Text>AGGREGATE BY LABELS</Typography.Text>
-			</div>
-			<div className="metric-space-aggregation-content">
-				<div className="metric-space-aggregation-content-left">
-					<Select
-						value={metricInspectionOptions.spaceAggregationOption}
-						placeholder="Select option"
-						onChange={(value): void => {
-							dispatchMetricInspectionOptions({
-								type: 'SET_SPACE_AGGREGATION_OPTION',
-								payload: value,
-							});
-						}}
-						style={{ width: 130 }}
-						disabled={inspectionStep === InspectionStep.TIME_AGGREGATION}
-					>
-						{/* eslint-disable-next-line sonarjs/no-identical-functions */}
-						{Object.entries(SPACE_AGGREGATION_OPTIONS).map(([key, value]) => (
-							<Select.Option key={key} value={key}>
-								{value}
-							</Select.Option>
-						))}
-					</Select>
-				</div>
-				<Select
-					mode="multiple"
-					style={{ width: '100%' }}
-					placeholder="Search for attributes..."
-					value={metricInspectionOptions.spaceAggregationLabels}
-					onChange={(value): void => {
-						dispatchMetricInspectionOptions({
-							type: 'SET_SPACE_AGGREGATION_LABELS',
-							payload: value,
-						});
-					}}
-					disabled={inspectionStep === InspectionStep.TIME_AGGREGATION}
-				>
-					{spaceAggregationLabels.map((label) => (
-						<Select.Option key={label} value={label}>
-							{label}
-						</Select.Option>
-					))}
-				</Select>
-			</div>
-		</div>
-	);
-}
-
 export function applyFilters(
 	inspectMetricsTimeSeries: InspectMetricsSeries[],
 	filters: TagFilter,
@@ -320,7 +84,7 @@ export function applyFilters(
 
 export function applyTimeAggregation(
 	inspectMetricsTimeSeries: InspectMetricsSeries[],
-	metricInspectionOptions: MetricInspectionOptions,
+	metricInspectionAppliedOptions: MetricInspectionOptions,
 ): {
 	timeAggregatedSeries: InspectMetricsSeries[];
 	timeAggregatedSeriesMap: Map<number, GraphPopoverData[]>;
@@ -328,7 +92,7 @@ export function applyTimeAggregation(
 	const {
 		timeAggregationOption,
 		timeAggregationInterval,
-	} = metricInspectionOptions;
+	} = metricInspectionAppliedOptions;
 
 	if (!timeAggregationInterval) {
 		return {
@@ -413,7 +177,7 @@ export function applyTimeAggregation(
 
 export function applySpaceAggregation(
 	inspectMetricsTimeSeries: InspectMetricsSeries[],
-	metricInspectionOptions: MetricInspectionOptions,
+	metricInspectionAppliedOptions: MetricInspectionOptions,
 ): {
 	aggregatedSeries: InspectMetricsSeries[];
 	spaceAggregatedSeriesMap: Map<string, InspectMetricsSeries[]>;
@@ -423,7 +187,7 @@ export function applySpaceAggregation(
 
 	inspectMetricsTimeSeries.forEach((series) => {
 		// Create composite key from selected labels
-		const key = metricInspectionOptions.spaceAggregationLabels
+		const key = metricInspectionAppliedOptions.spaceAggregationLabels
 			.map((label) => `${label}:${series.labels[label]}`)
 			.join(',');
 
@@ -458,7 +222,7 @@ export function applySpaceAggregation(
 			([timestamp, values]) => {
 				let aggregatedValue: number;
 
-				switch (metricInspectionOptions.spaceAggregationOption) {
+				switch (metricInspectionAppliedOptions.spaceAggregationOption) {
 					case SpaceAggregationOptions.SUM_BY:
 						aggregatedValue = values.reduce((sum, val) => sum + val, 0);
 						break;
@@ -693,103 +457,6 @@ export const formatTimestampToFullDateTime = (
 	return `${datePart} ⎯ ${timePart}`;
 };
 
-export function getTimeSeriesLabel(
-	timeSeries: InspectMetricsSeries | null,
-	textColor: string | undefined,
-): JSX.Element {
-	return (
-		<>
-			{Object.entries(timeSeries?.labels ?? {}).map(([key, value]) => (
-				<span key={key}>
-					<Typography.Text style={{ color: textColor, fontWeight: 600 }}>
-						{key}
-					</Typography.Text>
-					: {value}{' '}
-				</span>
-			))}
-		</>
-	);
-}
-
-export function HoverPopover({
-	options,
-	step,
-	metricInspectionOptions,
-}: {
-	options: GraphPopoverOptions;
-	step: InspectionStep;
-	metricInspectionOptions: MetricInspectionOptions;
-}): JSX.Element {
-	const closestTimestamp = useMemo(() => {
-		if (!options.timeSeries) {
-			return options.timestamp;
-		}
-		return options.timeSeries?.values.reduce((prev, curr) => {
-			const prevDiff = Math.abs(prev.timestamp - options.timestamp);
-			const currDiff = Math.abs(curr.timestamp - options.timestamp);
-			return prevDiff < currDiff ? prev : curr;
-		}).timestamp;
-	}, [options.timeSeries, options.timestamp]);
-
-	const closestValue = useMemo(() => {
-		if (!options.timeSeries) {
-			return options.value;
-		}
-		const index = options.timeSeries.values.findIndex(
-			(value) => value.timestamp === closestTimestamp,
-		);
-		return index !== undefined && index >= 0
-			? options.timeSeries?.values[index].value
-			: null;
-	}, [options.timeSeries, closestTimestamp, options.value]);
-
-	const title = useMemo(() => {
-		if (
-			step === InspectionStep.COMPLETED &&
-			metricInspectionOptions.spaceAggregationLabels.length === 0
-		) {
-			return undefined;
-		}
-		if (step === InspectionStep.COMPLETED && options.timeSeries?.title) {
-			return options.timeSeries.title;
-		}
-		if (!options.timeSeries) {
-			return undefined;
-		}
-		return getTimeSeriesLabel(
-			options.timeSeries,
-			options.timeSeries?.strokeColor,
-		);
-	}, [step, options.timeSeries, metricInspectionOptions]);
-
-	return (
-		<Card
-			className="hover-popover-card"
-			style={{
-				top: options.y + 10,
-				left: options.x + 10,
-			}}
-		>
-			<div className="hover-popover-row">
-				<Typography.Text>
-					{formatTimestampToFullDateTime(closestTimestamp ?? 0)}
-				</Typography.Text>
-				<Typography.Text>{Number(closestValue).toFixed(2)}</Typography.Text>
-			</div>
-			{options.timeSeries && (
-				<Typography.Text
-					style={{
-						color: options.timeSeries?.strokeColor,
-						fontWeight: 200,
-					}}
-				>
-					{title}
-				</Typography.Text>
-			)}
-		</Card>
-	);
-}
-
 export function onGraphHover(
 	e: MouseEvent,
 	u: uPlot,

frontend/src/container/MetricsExplorer/MetricDetails/AllAttributes.tsx

@@ -1,8 +1,17 @@
 import { useCallback, useMemo, useState } from 'react';
 import { useCopyToClipboard } from 'react-use';
-import { Button, Collapse, Input, Menu, Popover, Typography } from 'antd';
+import {
+	Button,
+	Collapse,
+	Input,
+	Menu,
+	Popover,
+	Skeleton,
+	Typography,
+} from 'antd';
 import { ColumnsType } from 'antd/es/table';
 import logEvent from 'api/common/logEvent';
+import { useGetMetricAttributes } from 'api/generated/services/metrics';
 import { ResizeTable } from 'components/ResizeTable';
 import { DataType } from 'container/LogDetailedView/TableView';
 import { useNotifications } from 'hooks/useNotifications';
@@ -12,9 +21,33 @@ import { PANEL_TYPES } from '../../../constants/queryBuilder';
 import ROUTES from '../../../constants/routes';
 import { useHandleExplorerTabChange } from '../../../hooks/useHandleExplorerTabChange';
 import { MetricsExplorerEventKeys, MetricsExplorerEvents } from '../events';
-import { AllAttributesProps, AllAttributesValueProps } from './types';
+import MetricDetailsErrorState from './MetricDetailsErrorState';
+import {
+	AllAttributesEmptyTextProps,
+	AllAttributesProps,
+	AllAttributesValueProps,
+} from './types';
 import { getMetricDetailsQuery } from './utils';
 
+const ALL_ATTRIBUTES_KEY = 'all-attributes';
+
+function AllAttributesEmptyText({
+	isErrorAttributes,
+	refetchAttributes,
+}: AllAttributesEmptyTextProps): JSX.Element {
+	if (isErrorAttributes) {
+		return (
+			<div className="all-attributes-error-state">
+				<MetricDetailsErrorState
+					refetch={refetchAttributes}
+					errorMessage="Something went wrong while fetching attributes"
+				/>
+			</div>
+		);
+	}
+	return <Typography.Text>No attributes found</Typography.Text>;
+}
+
 export function AllAttributesValue({
 	filterKey,
 	filterValue,
@@ -110,13 +143,23 @@ export function AllAttributesValue({
 
 function AllAttributes({
 	metricName,
-	attributes,
 	metricType,
 }: AllAttributesProps): JSX.Element {
 	const [searchString, setSearchString] = useState('');
-	const [activeKey, setActiveKey] = useState<string | string[]>(
-		'all-attributes',
-	);
+	const [activeKey, setActiveKey] = useState<string[]>([ALL_ATTRIBUTES_KEY]);
+
+	const {
+		data: attributesData,
+		isLoading: isLoadingAttributes,
+		isError: isErrorAttributes,
+		refetch: refetchAttributes,
+	} = useGetMetricAttributes({
+		metricName,
+	});
+
+	const attributes = useMemo(() => attributesData?.data.attributes ?? [], [
+		attributesData,
+	]);
 
 	const { handleExplorerTabChange } = useHandleExplorerTabChange();
 
@@ -178,7 +221,7 @@ function AllAttributes({
 			attributes.filter(
 				(attribute) =>
 					attribute.key.toLowerCase().includes(searchString.toLowerCase()) ||
-					attribute.value.some((value) =>
+					attribute.values?.some((value) =>
 						value.toLowerCase().includes(searchString.toLowerCase()),
 					),
 			),
@@ -195,7 +238,7 @@ function AllAttributes({
 						},
 						value: {
 							key: attribute.key,
-							value: attribute.value,
+							value: attribute.values,
 						},
 				  }))
 				: [],
@@ -270,6 +313,7 @@ function AllAttributes({
 							onClick={(e): void => {
 								e.stopPropagation();
 							}}
+							disabled={isLoadingAttributes || isErrorAttributes}
 						/>
 					</div>
 				),
@@ -277,25 +321,49 @@ function AllAttributes({
 				children: (
 					<ResizeTable
 						columns={columns}
+						loading={isLoadingAttributes}
 						tableLayout="fixed"
 						dataSource={tableData}
 						pagination={false}
 						showHeader={false}
 						className="metrics-accordion-content all-attributes-content"
 						scroll={{ y: 600 }}
+						locale={{
+							emptyText: (
+								<AllAttributesEmptyText
+									isErrorAttributes={isErrorAttributes}
+									refetchAttributes={refetchAttributes}
+								/>
+							),
+						}}
 					/>
 				),
 			},
 		],
-		[columns, tableData, searchString],
+		[
+			searchString,
+			isLoadingAttributes,
+			isErrorAttributes,
+			columns,
+			tableData,
+			refetchAttributes,
+		],
 	);
 
+	if (isLoadingAttributes) {
+		return (
+			<div className="all-attributes-skeleton-container">
+				<Skeleton active paragraph={{ rows: 8 }} />
+			</div>
+		);
+	}
+
 	return (
 		<Collapse
 			bordered
-			className="metrics-accordion metrics-metadata-accordion"
+			className="metrics-accordion"
 			activeKey={activeKey}
-			onChange={(keys): void => setActiveKey(keys)}
+			onChange={(keys): void => setActiveKey(keys as string[])}
 			items={items}
 		/>
 	);

frontend/src/container/MetricsExplorer/MetricDetails/DashboardsAndAlertsPopover.tsx

@@ -2,36 +2,84 @@ import { useMemo } from 'react';
 import { generatePath } from 'react-router-dom';
 import { Color } from '@signozhq/design-tokens';
 import { Dropdown, Typography } from 'antd';
+import { Skeleton } from 'antd/lib';
+import {
+	useGetMetricAlerts,
+	useGetMetricDashboards,
+} from 'api/generated/services/metrics';
 import { QueryParams } from 'constants/query';
 import ROUTES from 'constants/routes';
 import { useSafeNavigate } from 'hooks/useSafeNavigate';
 import useUrlQuery from 'hooks/useUrlQuery';
 import history from 'lib/history';
 import { Bell, Grid } from 'lucide-react';
+import { pluralize } from 'utils/pluralize';
 
 import { DashboardsAndAlertsPopoverProps } from './types';
 
 function DashboardsAndAlertsPopover({
-	alerts,
-	dashboards,
+	metricName,
 }: DashboardsAndAlertsPopoverProps): JSX.Element | null {
 	const { safeNavigate } = useSafeNavigate();
 	const params = useUrlQuery();
 
+	const {
+		data: alertsData,
+		isLoading: isLoadingAlerts,
+		isError: isErrorAlerts,
+	} = useGetMetricAlerts(
+		{
+			metricName,
+		},
+		{
+			query: {
+				enabled: !!metricName,
+			},
+		},
+	);
+
+	const {
+		data: dashboardsData,
+		isLoading: isLoadingDashboards,
+		isError: isErrorDashboards,
+	} = useGetMetricDashboards(
+		{
+			metricName,
+		},
+		{
+			query: {
+				enabled: !!metricName,
+			},
+		},
+	);
+
+	const alerts = useMemo(() => {
+		return alertsData?.data.alerts ?? [];
+	}, [alertsData]);
+
+	const dashboards = useMemo(() => {
+		const currentDashboards = dashboardsData?.data.dashboards ?? [];
+		// Remove duplicate dashboards
+		return currentDashboards.filter(
+			(dashboard, index, self) =>
+				index === self.findIndex((t) => t.dashboardId === dashboard.dashboardId),
+		);
+	}, [dashboardsData]);
+
 	const alertsPopoverContent = useMemo(() => {
 		if (alerts && alerts.length > 0) {
 			return alerts.map((alert) => ({
-				key: alert.alert_id,
+				key: alert.alertId,
 				label: (
 					<Typography.Link
-						key={alert.alert_id}
+						key={alert.alertId}
 						onClick={(): void => {
-							params.set(QueryParams.ruleId, alert.alert_id);
+							params.set(QueryParams.ruleId, alert.alertId);
 							history.push(`${ROUTES.ALERT_OVERVIEW}?${params.toString()}`);
 						}}
 						className="dashboards-popover-content-item"
 					>
-						{alert.alert_name || alert.alert_id}
+						{alert.alertName || alert.alertId}
 					</Typography.Link>
 				),
 			}));
@@ -39,41 +87,44 @@ function DashboardsAndAlertsPopover({
 		return null;
 	}, [alerts, params]);
 
-	const uniqueDashboards = useMemo(
-		() =>
-			dashboards?.filter(
-				(item, index, self) =>
-					index === self.findIndex((t) => t.dashboard_id === item.dashboard_id),
-			),
-		[dashboards],
-	);
-
 	const dashboardsPopoverContent = useMemo(() => {
-		if (uniqueDashboards && uniqueDashboards.length > 0) {
-			return uniqueDashboards.map((dashboard) => ({
-				key: dashboard.dashboard_id,
+		if (dashboards && dashboards.length > 0) {
+			return dashboards.map((dashboard) => ({
+				key: dashboard.dashboardId,
 				label: (
 					<Typography.Link
-						key={dashboard.dashboard_id}
+						key={dashboard.dashboardId}
 						onClick={(): void => {
 							safeNavigate(
 								generatePath(ROUTES.DASHBOARD, {
-									dashboardId: dashboard.dashboard_id,
+									dashboardId: dashboard.dashboardId,
 								}),
 							);
 						}}
 						className="dashboards-popover-content-item"
 					>
-						{dashboard.dashboard_name || dashboard.dashboard_id}
+						{dashboard.dashboardName || dashboard.dashboardId}
 					</Typography.Link>
 				),
 			}));
 		}
 		return null;
-	}, [uniqueDashboards, safeNavigate]);
+	}, [dashboards, safeNavigate]);
 
-	if (!dashboardsPopoverContent && !alertsPopoverContent) {
-		return null;
+	if (isLoadingAlerts || isLoadingDashboards) {
+		return (
+			<div className="dashboards-and-alerts-popover-container">
+				<Skeleton title={false} paragraph={{ rows: 1 }} active />
+			</div>
+		);
+	}
+
+	// If there are no dashboards or alerts or both have errors, don't show the popover
+	const hidePopover =
+		(!dashboardsPopoverContent && !alertsPopoverContent) ||
+		(isErrorAlerts && isErrorDashboards);
+	if (hidePopover) {
+		return <div className="dashboards-and-alerts-popover-container" />;
 	}
 
 	return (
@@ -92,8 +143,7 @@ function DashboardsAndAlertsPopover({
 					>
 						<Grid size={12} color={Color.BG_SIENNA_500} />
 						<Typography.Text>
-							{uniqueDashboards?.length} dashboard
-							{uniqueDashboards?.length === 1 ? '' : 's'}
+							{pluralize(dashboards.length, 'dashboard')}
 						</Typography.Text>
 					</div>
 				</Dropdown>
@@ -112,7 +162,7 @@ function DashboardsAndAlertsPopover({
 					>
 						<Bell size={12} color={Color.BG_SAKURA_500} />
 						<Typography.Text>
-							{alerts?.length} alert {alerts?.length === 1 ? 'rule' : 'rules'}
+							{pluralize(alerts.length, 'alert rule')}
 						</Typography.Text>
 					</div>
 				</Dropdown>

frontend/src/container/MetricsExplorer/MetricDetails/Highlights.tsx

@@ -0,0 +1,123 @@
+import { Color } from '@signozhq/design-tokens';
+import { Button, Skeleton, Tooltip, Typography } from 'antd';
+import { useGetMetricHighlights } from 'api/generated/services/metrics';
+import { InfoIcon } from 'lucide-react';
+
+import { formatNumberIntoHumanReadableFormat } from '../Summary/utils';
+import { HighlightsProps } from './types';
+import {
+	formatNumberToCompactFormat,
+	formatTimestampToReadableDate,
+} from './utils';
+
+function Highlights({ metricName }: HighlightsProps): JSX.Element {
+	const {
+		data: metricHighlightsData,
+		isLoading: isLoadingMetricHighlights,
+		isError: isErrorMetricHighlights,
+		refetch: refetchMetricHighlights,
+	} = useGetMetricHighlights(
+		{
+			metricName,
+		},
+		{
+			query: {
+				enabled: !!metricName,
+			},
+		},
+	);
+
+	const metricHighlights = metricHighlightsData?.data;
+
+	const timeSeriesActive = formatNumberToCompactFormat(
+		metricHighlights?.activeTimeSeries,
+	);
+	const timeSeriesTotal = formatNumberToCompactFormat(
+		metricHighlights?.totalTimeSeries,
+	);
+	const lastReceivedText = formatTimestampToReadableDate(
+		metricHighlights?.lastReceived,
+	);
+
+	if (isLoadingMetricHighlights) {
+		return (
+			<div
+				className="metric-details-content-grid"
+				data-testid="metric-highlights-loading-state"
+			>
+				<Skeleton title={false} paragraph={{ rows: 2 }} active />
+			</div>
+		);
+	}
+
+	if (isErrorMetricHighlights) {
+		return (
+			<div className="metric-details-content-grid">
+				<div
+					className="metric-highlights-error-state"
+					data-testid="metric-highlights-error-state"
+				>
+					<InfoIcon size={16} color={Color.BG_CHERRY_500} />
+					<Typography.Text>
+						Something went wrong while fetching metric highlights
+					</Typography.Text>
+					<Button
+						type="link"
+						size="large"
+						onClick={(): void => {
+							refetchMetricHighlights();
+						}}
+					>
+						Retry ?
+					</Button>
+				</div>
+			</div>
+		);
+	}
+
+	return (
+		<div className="metric-details-content-grid">
+			<div className="labels-row">
+				<Typography.Text type="secondary" className="metric-details-grid-label">
+					SAMPLES
+				</Typography.Text>
+				<Typography.Text type="secondary" className="metric-details-grid-label">
+					TIME SERIES
+				</Typography.Text>
+				<Typography.Text type="secondary" className="metric-details-grid-label">
+					LAST RECEIVED
+				</Typography.Text>
+			</div>
+			<div className="values-row">
+				<Typography.Text
+					className="metric-details-grid-value"
+					data-testid="metric-highlights-data-points"
+				>
+					<Tooltip title={metricHighlights?.dataPoints?.toLocaleString()}>
+						{formatNumberIntoHumanReadableFormat(metricHighlights?.dataPoints ?? 0)}
+					</Tooltip>
+				</Typography.Text>
+				<Typography.Text
+					className="metric-details-grid-value"
+					data-testid="metric-highlights-time-series-total"
+				>
+					<Tooltip
+						title="Active time series are those that have received data points in the last 1
+					hour."
+						placement="top"
+					>
+						<span>{`${timeSeriesTotal} total ⎯ ${timeSeriesActive} active`}</span>
+					</Tooltip>
+				</Typography.Text>
+				<Typography.Text
+					className="metric-details-grid-value"
+					data-testid="metric-highlights-last-received"
+				>
+					<Tooltip title={lastReceivedText}>{lastReceivedText}</Tooltip>
+				</Typography.Text>
+			</div>
+		</div>
+	);
+}
+
+export default Highlights;

frontend/src/container/MetricsExplorer/MetricDetails/Metadata.tsx

@@ -1,45 +1,58 @@
-import { useCallback, useMemo, useState } from 'react';
+import { useCallback, useEffect, useMemo, useState } from 'react';
 import { useQueryClient } from 'react-query';
-import { Button, Collapse, Input, Select, Typography } from 'antd';
+import { Button, Collapse, Input, Select, Skeleton, Typography } from 'antd';
 import { ColumnsType } from 'antd/es/table';
 import logEvent from 'api/common/logEvent';
-import { Temporality } from 'api/metricsExplorer/getMetricDetails';
-import { MetricType } from 'api/metricsExplorer/getMetricsList';
-import { UpdateMetricMetadataProps } from 'api/metricsExplorer/updateMetricMetadata';
+import {
+	invalidateGetMetricMetadata,
+	invalidateListMetrics,
+	useUpdateMetricMetadata,
+} from 'api/generated/services/metrics';
+import {
+	MetrictypesTemporalityDTO,
+	MetrictypesTypeDTO,
+	RenderErrorResponseDTO,
+} from 'api/generated/services/sigNoz.schemas';
+import { AxiosError } from 'axios';
 import { ResizeTable } from 'components/ResizeTable';
 import YAxisUnitSelector from 'components/YAxisUnitSelector';
 import { YAxisSource } from 'components/YAxisUnitSelector/types';
 import { getUniversalNameFromMetricUnit } from 'components/YAxisUnitSelector/utils';
 import FieldRenderer from 'container/LogDetailedView/FieldRenderer';
 import { DataType } from 'container/LogDetailedView/TableView';
-import { useUpdateMetricMetadata } from 'hooks/metricsExplorer/useUpdateMetricMetadata';
 import { useNotifications } from 'hooks/useNotifications';
 import { Edit2, Save, X } from 'lucide-react';
 
 import { MetricsExplorerEventKeys, MetricsExplorerEvents } from '../events';
+import { MetricTypeViewRenderer } from '../Summary/utils';
 import {
-	METRIC_TYPE_LABEL_MAP,
-	METRIC_TYPE_VALUES_MAP,
-} from '../Summary/constants';
-import { MetricTypeRenderer } from '../Summary/utils';
-import { METRIC_METADATA_KEYS } from './constants';
-import { MetadataProps } from './types';
-import { determineIsMonotonic } from './utils';
+	METRIC_METADATA_KEYS,
+	METRIC_METADATA_TEMPORALITY_OPTIONS,
+	METRIC_METADATA_TYPE_OPTIONS,
+	METRIC_METADATA_UPDATE_ERROR_MESSAGE,
+} from './constants';
+import MetricDetailsErrorState from './MetricDetailsErrorState';
+import { MetadataProps, MetricMetadataFormState, TableFields } from './types';
+import { transformUpdateMetricMetadataRequest } from './utils';
 
 function Metadata({
 	metricName,
 	metadata,
-	refetchMetricDetails,
+	isErrorMetricMetadata,
+	isLoadingMetricMetadata,
+	refetchMetricMetadata,
 }: MetadataProps): JSX.Element {
 	const [isEditing, setIsEditing] = useState(false);
+
 	const [
-		metricMetadata,
-		setMetricMetadata,
-	] = useState<UpdateMetricMetadataProps>({
-		metricType: metadata?.metric_type || MetricType.SUM,
-		description: metadata?.description || '',
-		temporality: metadata?.temporality,
-		unit: metadata?.unit,
+		metricMetadataState,
+		setMetricMetadataState,
+	] = useState<MetricMetadataFormState>({
+		type: MetrictypesTypeDTO.sum,
+		description: '',
+		temporality: MetrictypesTemporalityDTO.unspecified,
+		unit: '',
+		isMonotonic: false,
 	});
 	const { notifications } = useNotifications();
 	const {
@@ -51,110 +64,135 @@ function Metadata({
 	);
 	const queryClient = useQueryClient();
 
+	// Initialize state from metadata api data
+	useEffect(() => {
+		if (metadata) {
+			setMetricMetadataState({
+				type: metadata.type,
+				description: metadata.description,
+				temporality: metadata.temporality,
+				unit: metadata.unit,
+				isMonotonic: metadata.isMonotonic,
+			});
+		}
+	}, [metadata]);
+
 	const tableData = useMemo(
 		() =>
 			metadata
-				? Object.keys({
-						...metadata,
-						temporality: metadata?.temporality,
-				  })
-						// Filter out monotonic as user input is not required
-						.filter((key) => key !== 'monotonic')
-						.map((key) => ({
+				? Object.keys(metadata).map((key) => ({
+						key,
+						value: {
+							value: metadata[key as keyof typeof metadata],
 							key,
-							value: {
-								value: metadata[key as keyof typeof metadata],
-								key,
-							},
-						}))
+						},
+				  }))
 				: [],
 		[metadata],
 	);
 
 	// Render un-editable field value
-	const renderUneditableField = useCallback((key: string, value: string) => {
-		if (key === 'metric_type') {
-			return <MetricTypeRenderer type={value as MetricType} />;
-		}
-		let fieldValue = value;
-		if (key === 'unit') {
-			fieldValue = getUniversalNameFromMetricUnit(value);
-		}
-		return <FieldRenderer field={fieldValue || '-'} />;
-	}, []);
+	const renderUneditableField = useCallback(
+		(key: keyof MetricMetadataFormState, value: string) => {
+			if (isErrorMetricMetadata) {
+				return <FieldRenderer field="-" />;
+			}
+			if (key === TableFields.TYPE) {
+				return <MetricTypeViewRenderer type={value as MetrictypesTypeDTO} />;
+			}
+			if (key === TableFields.IS_MONOTONIC) {
+				return <FieldRenderer field={value ? 'Yes' : 'No'} />;
+			}
+			if (key === TableFields.Temporality) {
+				const temporality = METRIC_METADATA_TEMPORALITY_OPTIONS.find(
+					(option) => option.value === value,
+				);
+				return <FieldRenderer field={temporality?.label || '-'} />;
+			}
+			let fieldValue = value;
+			if (key === TableFields.UNIT) {
+				fieldValue = getUniversalNameFromMetricUnit(value);
+			}
+			return <FieldRenderer field={fieldValue || '-'} />;
+		},
+		[isErrorMetricMetadata],
+	);
 
 	const renderColumnValue = useCallback(
-		(field: { value: string; key: string }): JSX.Element => {
+		(field: {
+			value: string;
+			key: keyof MetricMetadataFormState;
+		}): JSX.Element => {
 			if (!isEditing) {
 				return renderUneditableField(field.key, field.value);
 			}
 
 			// Don't allow editing of unit if it's already set
-			const metricUnitAlreadySet = field.key === 'unit' && Boolean(metadata?.unit);
+			const metricUnitAlreadySet =
+				field.key === TableFields.UNIT && Boolean(metadata?.unit);
 			if (metricUnitAlreadySet) {
 				return renderUneditableField(field.key, field.value);
 			}
 
-			if (field.key === 'metric_type') {
+			// Monotonic is not editable
+			if (field.key === TableFields.IS_MONOTONIC) {
+				return renderUneditableField(field.key, field.value);
+			}
+
+			if (field.key === TableFields.TYPE) {
 				return (
 					<Select
 						data-testid="metric-type-select"
-						options={Object.entries(METRIC_TYPE_VALUES_MAP).map(([key]) => ({
-							value: key,
-							label: METRIC_TYPE_LABEL_MAP[key as MetricType],
-						}))}
-						value={metricMetadata.metricType}
+						options={METRIC_METADATA_TYPE_OPTIONS}
+						value={metricMetadataState.type}
 						onChange={(value): void => {
-							setMetricMetadata((prev) => ({
+							setMetricMetadataState((prev) => ({
 								...prev,
-								metricType: value as MetricType,
+								type: value,
 							}));
 						}}
 					/>
 				);
 			}
-			if (field.key === 'unit') {
+			if (field.key === TableFields.UNIT) {
 				return (
 					<YAxisUnitSelector
-						value={metricMetadata.unit}
+						value={metricMetadataState.unit}
 						onChange={(value): void => {
-							setMetricMetadata((prev) => ({ ...prev, unit: value }));
+							setMetricMetadataState((prev) => ({ ...prev, unit: value }));
 						}}
 						data-testid="unit-select"
 						source={YAxisSource.EXPLORER}
 					/>
 				);
 			}
-			if (field.key === 'temporality') {
+			if (field.key === TableFields.Temporality) {
+				const temporalityValue =
+					metricMetadataState.temporality === MetrictypesTemporalityDTO.unspecified
+						? undefined
+						: metricMetadataState.temporality;
 				return (
 					<Select
 						data-testid="temporality-select"
-						options={Object.values(Temporality).map((key) => ({
-							value: key,
-							label: key,
-						}))}
-						value={metricMetadata.temporality}
+						options={METRIC_METADATA_TEMPORALITY_OPTIONS}
+						value={temporalityValue}
 						onChange={(value): void => {
-							setMetricMetadata((prev) => ({
+							setMetricMetadataState((prev) => ({
 								...prev,
-								temporality: value as Temporality,
+								temporality: value,
 							}));
 						}}
 					/>
 				);
 			}
-			if (field.key === 'description') {
+			if (field.key === TableFields.DESCRIPTION) {
 				return (
 					<Input
 						data-testid="description-input"
 						name={field.key}
-						defaultValue={
-							metricMetadata[
-								field.key as Exclude<keyof UpdateMetricMetadataProps, 'isMonotonic'>
-							]
-						}
+						defaultValue={metricMetadataState.description}
 						onChange={(e): void => {
-							setMetricMetadata((prev) => ({
+							setMetricMetadataState((prev) => ({
 								...prev,
 								[field.key]: e.target.value,
 							}));
@@ -164,7 +202,7 @@ function Metadata({
 			}
 			return <FieldRenderer field="-" />;
 		},
-		[isEditing, metadata?.unit, metricMetadata, renderUneditableField],
+		[isEditing, metadata?.unit, metricMetadataState, renderUneditableField],
 	);
 
 	const columns: ColumnsType<DataType> = useMemo(
@@ -201,52 +239,61 @@ function Metadata({
 	const handleSave = useCallback(() => {
 		updateMetricMetadata(
 			{
-				metricName,
-				payload: {
-					...metricMetadata,
-					isMonotonic: determineIsMonotonic(
-						metricMetadata.metricType,
-						metricMetadata.temporality,
-					),
+				pathParams: {
+					metricName,
 				},
+				data: transformUpdateMetricMetadataRequest(metricName, metricMetadataState),
 			},
 			{
-				onSuccess: (response): void => {
-					if (response?.statusCode === 200) {
-						logEvent(MetricsExplorerEvents.MetricMetadataUpdated, {
-							[MetricsExplorerEventKeys.MetricName]: metricName,
-							[MetricsExplorerEventKeys.Tab]: 'summary',
-							[MetricsExplorerEventKeys.Modal]: 'metric-details',
-						});
-						notifications.success({
-							message: 'Metadata updated successfully',
-						});
-						refetchMetricDetails();
-						setIsEditing(false);
-						queryClient.invalidateQueries(['metricsList']);
-					} else {
-						notifications.error({
-							message:
-								'Failed to update metadata, please try again. If the issue persists, please contact support.',
-						});
-					}
+				onSuccess: (): void => {
+					logEvent(MetricsExplorerEvents.MetricMetadataUpdated, {
+						[MetricsExplorerEventKeys.MetricName]: metricName,
+						[MetricsExplorerEventKeys.Tab]: 'summary',
+						[MetricsExplorerEventKeys.Modal]: 'metric-details',
+					});
+					notifications.success({
+						message: 'Metadata updated successfully',
+					});
+					setIsEditing(false);
+					invalidateListMetrics(queryClient);
+					invalidateGetMetricMetadata(queryClient, {
+						metricName,
+					});
 				},
-				onError: (): void =>
+				onError: (error): void => {
+					const errorMessage = (error as AxiosError<RenderErrorResponseDTO>).response
+						?.data.error?.message;
 					notifications.error({
-						message:
-							'Failed to update metadata, please try again. If the issue persists, please contact support.',
-					}),
+						message: errorMessage || METRIC_METADATA_UPDATE_ERROR_MESSAGE,
+					});
+				},
 			},
 		);
 	}, [
 		updateMetricMetadata,
 		metricName,
-		metricMetadata,
+		metricMetadataState,
 		notifications,
-		refetchMetricDetails,
 		queryClient,
 	]);
 
+	const cancelEdit = useCallback(
+		(e: React.MouseEvent<HTMLElement, MouseEvent>): void => {
+			e.stopPropagation();
+			if (metadata) {
+				setMetricMetadataState({
+					type: metadata.type,
+					description: metadata.description,
+					unit: metadata.unit,
+					temporality: metadata.temporality,
+					isMonotonic: metadata.isMonotonic,
+				});
+			}
+			setIsEditing(false);
+		},
+		[metadata],
+	);
+
 	const actionButton = useMemo(() => {
 		if (isEditing) {
 			return (
@@ -254,10 +301,7 @@ function Metadata({
 					<Button
 						className="action-button"
 						type="text"
-						onClick={(e): void => {
-							e.stopPropagation();
-							setIsEditing(false);
-						}}
+						onClick={cancelEdit}
 						disabled={isUpdatingMetricsMetadata}
 					>
 						<X size={14} />
@@ -278,6 +322,9 @@ function Metadata({
 				</div>
 			);
 		}
+		if (isErrorMetricMetadata) {
+			return null;
+		}
 		return (
 			<div className="action-menu">
 				<Button
@@ -294,7 +341,13 @@ function Metadata({
 				</Button>
 			</div>
 		);
-	}, [handleSave, isEditing, isUpdatingMetricsMetadata]);
+	}, [
+		isEditing,
+		isErrorMetricMetadata,
+		isUpdatingMetricsMetadata,
+		cancelEdit,
+		handleSave,
+	]);
 
 	const items = useMemo(
 		() => [
@@ -306,7 +359,14 @@ function Metadata({
 					</div>
 				),
 				key: 'metric-metadata',
-				children: (
+				children: isErrorMetricMetadata ? (
+					<div className="metric-metadata-error-state">
+						<MetricDetailsErrorState
+							refetch={refetchMetricMetadata}
+							errorMessage="Something went wrong while fetching metric metadata"
+						/>
+					</div>
+				) : (
 					<ResizeTable
 						columns={columns}
 						tableLayout="fixed"
@@ -318,9 +378,23 @@ function Metadata({
 				),
 			},
 		],
-		[actionButton, columns, tableData],
+		[
+			actionButton,
+			columns,
+			isErrorMetricMetadata,
+			refetchMetricMetadata,
+			tableData,
+		],
 	);
 
+	if (isLoadingMetricMetadata) {
+		return (
+			<div className="metrics-metadata-skeleton-container">
+				<Skeleton active paragraph={{ rows: 8 }} />
+			</div>
+		);
+	}
+
 	return (
 		<Collapse
 			bordered

frontend/src/container/MetricsExplorer/MetricDetails/MetricDetails.styles.scss

@@ -38,7 +38,12 @@
 		flex-direction: column;
 		gap: 12px;
 
+		.metrics-metadata-error {
+			padding: 16px !important;
+		}
+
 		.metric-details-content-grid {
+			height: 50px;
 			.labels-row,
 			.values-row {
 				display: grid;
@@ -47,6 +52,18 @@
 				align-items: center;
 			}
 
+			.metric-highlights-error-state {
+				display: flex;
+				gap: 8px;
+				height: 100%;
+				width: 100%;
+				align-items: center;
+
+				.ant-btn {
+					padding: 2px 4px;
+				}
+			}
+
 			.labels-row {
 				margin-bottom: 8px;
 
@@ -72,6 +89,7 @@
 		.dashboards-and-alerts-popover-container {
 			display: flex;
 			gap: 16px;
+			height: 32px;
 
 			.dashboards-and-alerts-popover {
 				border-radius: 20px;
@@ -102,7 +120,19 @@
 			}
 		}
 
+		.metrics-metadata-skeleton-container {
+			height: 330px;
+		}
+
+		.all-attributes-skeleton-container {
+			height: 600px;
+		}
+
 		.metrics-accordion {
+			.all-attributes-error-state {
+				height: 300px;
+			}
+
 			.ant-table-body {
 				&::-webkit-scrollbar {
 					width: 2px;
@@ -148,7 +178,6 @@
 
 				.all-attributes-search-input {
 					width: 300px;
-					border: 1px solid var(--bg-slate-300);
 				}
 			}
 
@@ -161,6 +190,7 @@
 							.ant-typography:first-child {
 								font-family: 'Geist Mono';
 								color: var(--bg-robin-400);
+								background-color: transparent;
 							}
 						}
 						.all-attributes-contribution {
@@ -217,6 +247,10 @@
 
 			.ant-collapse-content-box {
 				padding: 0;
+
+				.metric-metadata-error-state {
+					height: 267px;
+				}
 			}
 
 			.ant-collapse-header {
@@ -237,6 +271,7 @@
 			}
 
 			.metric-metadata-value {
+				height: 67px;
 				background: rgba(22, 25, 34, 0.4);
 				overflow-x: scroll;
 				.field-renderer-container {
@@ -330,18 +365,26 @@
 	.metric-details-content {
 		.metrics-accordion {
 			.metrics-accordion-header {
-				.action-button {
-					.ant-typography {
-						color: var(--bg-slate-400);
+				.action-menu {
+					.action-button {
+						.ant-typography {
+							color: var(--bg-slate-400);
+						}
 					}
 				}
 			}
 
 			.metrics-accordion-content {
 				.metric-metadata-key {
+					.field-renderer-container {
+						.label {
+							color: var(--bg-slate-300);
+						}
+					}
+
 					.all-attributes-key {
 						.ant-typography:last-child {
-							color: var(--bg-slate-400);
+							color: var(--bg-vanilla-200);
 							background-color: var(--bg-robin-300);
 						}
 					}
@@ -395,3 +438,13 @@
 		}
 	}
 }
+
+.metric-details-error-state {
+	display: flex;
+	flex-direction: column;
+	gap: 8px;
+	align-items: center;
+	justify-content: center;
+	height: 100%;
+	width: 100%;
+}

frontend/src/container/MetricsExplorer/MetricDetails/MetricDetails.tsx

@@ -1,16 +1,8 @@
 import { useCallback, useEffect, useMemo } from 'react';
 import { Color } from '@signozhq/design-tokens';
-import {
-	Button,
-	Divider,
-	Drawer,
-	Empty,
-	Skeleton,
-	Tooltip,
-	Typography,
-} from 'antd';
+import { Button, Divider, Drawer, Typography } from 'antd';
 import logEvent from 'api/common/logEvent';
-import { useGetMetricDetails } from 'hooks/metricsExplorer/useGetMetricDetails';
+import { useGetMetricMetadata } from 'api/generated/services/metrics';
 import { useIsDarkMode } from 'hooks/useDarkMode';
 import { Compass, Crosshair, X } from 'lucide-react';
 
@@ -19,16 +11,12 @@ import ROUTES from '../../../constants/routes';
 import { useHandleExplorerTabChange } from '../../../hooks/useHandleExplorerTabChange';
 import { MetricsExplorerEventKeys, MetricsExplorerEvents } from '../events';
 import { isInspectEnabled } from '../Inspect/utils';
-import { formatNumberIntoHumanReadableFormat } from '../Summary/utils';
 import AllAttributes from './AllAttributes';
 import DashboardsAndAlertsPopover from './DashboardsAndAlertsPopover';
+import Highlights from './Highlights';
 import Metadata from './Metadata';
 import { MetricDetailsProps } from './types';
-import {
-	formatNumberToCompactFormat,
-	formatTimestampToReadableDate,
-	getMetricDetailsQuery,
-} from './utils';
+import { getMetricDetailsQuery } from './utils';
 
 import './MetricDetails.styles.scss';
 import '../Summary/Summary.styles.scss';
@@ -43,55 +31,49 @@ function MetricDetails({
 	const { handleExplorerTabChange } = useHandleExplorerTabChange();
 
 	const {
-		data,
-		isLoading,
-		isFetching,
-		error: metricDetailsError,
-		refetch: refetchMetricDetails,
-	} = useGetMetricDetails(metricName ?? '', {
-		enabled: !!metricName,
-	});
-
-	const metric = data?.payload?.data;
-
-	const lastReceived = useMemo(() => {
-		if (!metric) {
-			return null;
-		}
-		return formatTimestampToReadableDate(metric.lastReceived);
-	}, [metric]);
-
-	const showInspectFeature = useMemo(
-		() => isInspectEnabled(metric?.metadata?.metric_type),
-		[metric],
+		data: metricMetadataResponse,
+		isLoading: isLoadingMetricMetadata,
+		isError: isErrorMetricMetadata,
+		refetch: refetchMetricMetadata,
+	} = useGetMetricMetadata(
+		{
+			metricName,
+		},
+		{
+			query: {
+				enabled: !!metricName,
+			},
+		},
 	);
 
-	const isMetricDetailsLoading = isLoading || isFetching;
-
-	const timeSeries = useMemo(() => {
-		if (!metric) {
+	const metadata = useMemo(() => {
+		if (!metricMetadataResponse) {
 			return null;
 		}
-		const timeSeriesActive = formatNumberToCompactFormat(metric.timeSeriesActive);
-		const timeSeriesTotal = formatNumberToCompactFormat(metric.timeSeriesTotal);
+		const {
+			type,
+			description,
+			unit,
+			temporality,
+			isMonotonic,
+		} = metricMetadataResponse.data;
 
-		return (
-			<Tooltip
-				title="Active time series are those that have received data points in the last 1
-					hour."
-				placement="top"
-			>
-				<span>{`${timeSeriesTotal} total ⎯ ${timeSeriesActive} active`}</span>
-			</Tooltip>
-		);
-	}, [metric]);
+		return {
+			type,
+			description,
+			unit,
+			temporality,
+			isMonotonic,
+		};
+	}, [metricMetadataResponse]);
+
+	const showInspectFeature = useMemo(() => isInspectEnabled(metadata?.type), [
+		metadata?.type,
+	]);
 
 	const goToMetricsExplorerwithSelectedMetric = useCallback(() => {
 		if (metricName) {
-			const compositeQuery = getMetricDetailsQuery(
-				metricName,
-				metric?.metadata?.metric_type,
-			);
+			const compositeQuery = getMetricDetailsQuery(metricName, metadata?.type);
 			handleExplorerTabChange(
 				PANEL_TYPES.TIME_SERIES,
 				{
@@ -107,9 +89,7 @@ function MetricDetails({
 				[MetricsExplorerEventKeys.Modal]: 'metric-details',
 			});
 		}
-	}, [metricName, handleExplorerTabChange, metric?.metadata?.metric_type]);
-
-	const isMetricDetailsError = metricDetailsError || !metric;
+	}, [metricName, handleExplorerTabChange, metadata?.type]);
 
 	useEffect(() => {
 		logEvent(MetricsExplorerEvents.ModalOpened, {
@@ -117,6 +97,9 @@ function MetricDetails({
 		});
 	}, []);
 
+	const isActionButtonDisabled =
+		!metricName || isLoadingMetricMetadata || isErrorMetricMetadata;
+
 	return (
 		<Drawer
 			width="60%"
@@ -124,13 +107,13 @@ function MetricDetails({
 				<div className="metric-details-header">
 					<div className="metric-details-title">
 						<Divider type="vertical" />
-						<Typography.Text>{metric?.name}</Typography.Text>
+						<Typography.Text>{metricName}</Typography.Text>
 					</div>
 					<div className="metric-details-header-buttons">
 						<Button
 							onClick={goToMetricsExplorerwithSelectedMetric}
 							icon={<Compass size={16} />}
-							disabled={!metricName}
+							disabled={isActionButtonDisabled}
 							data-testid="open-in-explorer-button"
 						>
 							Open in Explorer
@@ -140,10 +123,11 @@ function MetricDetails({
 							<Button
 								className="inspect-metrics-button"
 								aria-label="Inspect Metric"
+								disabled={isActionButtonDisabled}
 								icon={<Crosshair size={18} />}
 								onClick={(): void => {
-									if (metric?.name) {
-										openInspectModal(metric.name);
+									if (metricName) {
+										openInspectModal(metricName);
 									}
 								}}
 								data-testid="inspect-metric-button"
@@ -163,60 +147,18 @@ function MetricDetails({
 			destroyOnClose
 			closeIcon={<X size={16} />}
 		>
-			{isMetricDetailsLoading && (
-				<div data-testid="metric-details-skeleton">
-					<Skeleton active />
-				</div>
-			)}
-			{isMetricDetailsError && !isMetricDetailsLoading && (
-				<Empty description="Error fetching metric details" />
-			)}
-			{!isMetricDetailsLoading && !isMetricDetailsError && (
-				<div className="metric-details-content">
-					<div className="metric-details-content-grid">
-						<div className="labels-row">
-							<Typography.Text type="secondary" className="metric-details-grid-label">
-								SAMPLES
-							</Typography.Text>
-							<Typography.Text type="secondary" className="metric-details-grid-label">
-								TIME SERIES
-							</Typography.Text>
-							<Typography.Text type="secondary" className="metric-details-grid-label">
-								LAST RECEIVED
-							</Typography.Text>
-						</div>
-						<div className="values-row">
-							<Typography.Text className="metric-details-grid-value">
-								<Tooltip title={metric?.samples.toLocaleString()}>
-									{formatNumberIntoHumanReadableFormat(metric?.samples)}
-								</Tooltip>
-							</Typography.Text>
-							<Typography.Text className="metric-details-grid-value">
-								<Tooltip title={timeSeries}>{timeSeries}</Tooltip>
-							</Typography.Text>
-							<Typography.Text className="metric-details-grid-value">
-								<Tooltip title={lastReceived}>{lastReceived}</Tooltip>
-							</Typography.Text>
-						</div>
-					</div>
-					<DashboardsAndAlertsPopover
-						dashboards={metric.dashboards}
-						alerts={metric.alerts}
-					/>
-					<Metadata
-						metricName={metric?.name}
-						metadata={metric.metadata}
-						refetchMetricDetails={refetchMetricDetails}
-					/>
-					{metric.attributes && (
-						<AllAttributes
-							metricName={metric?.name}
-							attributes={metric.attributes}
-							metricType={metric?.metadata?.metric_type}
-						/>
-					)}
-				</div>
-			)}
+			<div className="metric-details-content">
+				<Highlights metricName={metricName} />
+				<DashboardsAndAlertsPopover metricName={metricName} />
+				<Metadata
+					metricName={metricName}
+					metadata={metadata}
+					isErrorMetricMetadata={isErrorMetricMetadata}
+					isLoadingMetricMetadata={isLoadingMetricMetadata}
+					refetchMetricMetadata={refetchMetricMetadata}
+				/>
+				<AllAttributes metricName={metricName} metricType={metadata?.type} />
+			</div>
 		</Drawer>
 	);
 }

frontend/src/container/MetricsExplorer/MetricDetails/MetricDetailsErrorState.tsx

@@ -0,0 +1,20 @@
+import { Color } from '@signozhq/design-tokens';
+import { Button, Typography } from 'antd';
+import { InfoIcon } from 'lucide-react';
+
+import { MetricDetailsErrorStateProps } from './types';
+
+function MetricDetailsErrorState({
+	refetch,
+	errorMessage,
+}: MetricDetailsErrorStateProps): JSX.Element {
+	return (
+		<div className="metric-details-error-state">
+			<InfoIcon size={20} color={Color.BG_CHERRY_500} />
+			<Typography.Text>{errorMessage}</Typography.Text>
+			{refetch && <Button onClick={refetch}>Retry</Button>}
+		</div>
+	);
+}
+
+export default MetricDetailsErrorState;

frontend/src/container/MetricsExplorer/MetricDetails/__tests__/AllAttributes.test.tsx

@@ -1,11 +1,13 @@
 import * as reactUseHooks from 'react-use';
-import { fireEvent, render, screen } from '@testing-library/react';
-import { MetricType } from 'api/metricsExplorer/getMetricsList';
+import { render, screen } from '@testing-library/react';
+import * as metricsExplorerHooks from 'api/generated/services/metrics';
+import { MetrictypesTypeDTO } from 'api/generated/services/sigNoz.schemas';
 import * as useHandleExplorerTabChange from 'hooks/useHandleExplorerTabChange';
+import { userEvent } from 'tests/test-utils';
 
-import { MetricDetailsAttribute } from '../../../../api/metricsExplorer/getMetricDetails';
 import ROUTES from '../../../../constants/routes';
 import AllAttributes, { AllAttributesValue } from '../AllAttributes';
+import { getMockMetricAttributesData, MOCK_METRIC_NAME } from './testUtlls';
 
 jest.mock('react-router-dom', () => ({
 	...jest.requireActual('react-router-dom'),
@@ -20,33 +22,28 @@ jest
 		handleExplorerTabChange: mockHandleExplorerTabChange,
 	});
 
-const mockMetricName = 'test-metric';
-const mockMetricType = MetricType.GAUGE;
-const mockAttributes: MetricDetailsAttribute[] = [
-	{
-		key: 'attribute1',
-		value: ['value1', 'value2'],
-		valueCount: 2,
-	},
-	{
-		key: 'attribute2',
-		value: ['value3'],
-		valueCount: 1,
-	},
-];
-
 const mockUseCopyToClipboard = jest.fn();
 jest
 	.spyOn(reactUseHooks, 'useCopyToClipboard')
 	.mockReturnValue([{ value: 'value1' }, mockUseCopyToClipboard] as any);
 
+const useGetMetricAttributesMock = jest.spyOn(
+	metricsExplorerHooks,
+	'useGetMetricAttributes',
+);
+
 describe('AllAttributes', () => {
+	beforeEach(() => {
+		useGetMetricAttributesMock.mockReturnValue({
+			...getMockMetricAttributesData(),
+		});
+	});
+
 	it('renders attributes section with title', () => {
 		render(
 			<AllAttributes
-				metricName={mockMetricName}
-				attributes={mockAttributes}
-				metricType={mockMetricType}
+				metricName={MOCK_METRIC_NAME}
+				metricType={MetrictypesTypeDTO.gauge}
 			/>,
 		);
 
@@ -56,9 +53,8 @@ describe('AllAttributes', () => {
 	it('renders all attribute keys and values', () => {
 		render(
 			<AllAttributes
-				metricName={mockMetricName}
-				attributes={mockAttributes}
-				metricType={mockMetricType}
+				metricName={MOCK_METRIC_NAME}
+				metricType={MetrictypesTypeDTO.gauge}
 			/>,
 		);
 
@@ -75,9 +71,8 @@ describe('AllAttributes', () => {
 	it('renders value counts correctly', () => {
 		render(
 			<AllAttributes
-				metricName={mockMetricName}
-				attributes={mockAttributes}
-				metricType={mockMetricType}
+				metricName={MOCK_METRIC_NAME}
+				metricType={MetrictypesTypeDTO.gauge}
 			/>,
 		);
 
@@ -86,41 +81,44 @@ describe('AllAttributes', () => {
 	});
 
 	it('handles empty attributes array', () => {
+		useGetMetricAttributesMock.mockReturnValue({
+			...getMockMetricAttributesData({
+				data: {
+					attributes: [],
+					totalKeys: 0,
+				},
+			}),
+		});
 		render(
 			<AllAttributes
-				metricName={mockMetricName}
-				attributes={[]}
-				metricType={mockMetricType}
+				metricName={MOCK_METRIC_NAME}
+				metricType={MetrictypesTypeDTO.gauge}
 			/>,
 		);
 
 		expect(screen.getByText('All Attributes')).toBeInTheDocument();
-		expect(screen.queryByText('No data')).toBeInTheDocument();
+		expect(screen.getByText('No attributes found')).toBeInTheDocument();
 	});
 
-	it('clicking on an attribute key opens the explorer with the attribute filter applied', () => {
+	it('clicking on an attribute key opens the explorer with the attribute filter applied', async () => {
 		render(
 			<AllAttributes
-				metricName={mockMetricName}
-				attributes={mockAttributes}
-				metricType={mockMetricType}
+				metricName={MOCK_METRIC_NAME}
+				metricType={MetrictypesTypeDTO.gauge}
 			/>,
 		);
-		fireEvent.click(screen.getByText('attribute1'));
+		await userEvent.click(screen.getByText('attribute1'));
 		expect(mockHandleExplorerTabChange).toHaveBeenCalled();
 	});
 
-	it('filters attributes based on search input', () => {
+	it('filters attributes based on search input', async () => {
 		render(
 			<AllAttributes
-				metricName={mockMetricName}
-				attributes={mockAttributes}
-				metricType={mockMetricType}
+				metricName={MOCK_METRIC_NAME}
+				metricType={MetrictypesTypeDTO.gauge}
 			/>,
 		);
-		fireEvent.change(screen.getByPlaceholderText('Search'), {
-			target: { value: 'value1' },
-		});
+		await userEvent.type(screen.getByPlaceholderText('Search'), 'value1');
 
 		expect(screen.getByText('attribute1')).toBeInTheDocument();
 		expect(screen.getByText('value1')).toBeInTheDocument();
@@ -144,7 +142,7 @@ describe('AllAttributesValue', () => {
 		expect(screen.getByText('value2')).toBeInTheDocument();
 	});
 
-	it('loads more attributes when show more button is clicked', () => {
+	it('loads more attributes when show more button is clicked', async () => {
 		render(
 			<AllAttributesValue
 				filterKey="attribute1"
@@ -155,7 +153,7 @@ describe('AllAttributesValue', () => {
 			/>,
 		);
 		expect(screen.queryByText('value6')).not.toBeInTheDocument();
-		fireEvent.click(screen.getByText('Show More'));
+		await userEvent.click(screen.getByText('Show More'));
 		expect(screen.getByText('value6')).toBeInTheDocument();
 	});
 
@@ -172,7 +170,7 @@ describe('AllAttributesValue', () => {
 		expect(screen.queryByText('Show More')).not.toBeInTheDocument();
 	});
 
-	it('copy button should copy the attribute value to the clipboard', () => {
+	it('copy button should copy the attribute value to the clipboard', async () => {
 		render(
 			<AllAttributesValue
 				filterKey="attribute1"
@@ -183,13 +181,13 @@ describe('AllAttributesValue', () => {
 			/>,
 		);
 		expect(screen.getByText('value1')).toBeInTheDocument();
-		fireEvent.click(screen.getByText('value1'));
+		await userEvent.click(screen.getByText('value1'));
 		expect(screen.getByText('Copy Attribute')).toBeInTheDocument();
-		fireEvent.click(screen.getByText('Copy Attribute'));
+		await userEvent.click(screen.getByText('Copy Attribute'));
 		expect(mockUseCopyToClipboard).toHaveBeenCalledWith('value1');
 	});
 
-	it('explorer button should go to metrics explore with the attribute filter applied', () => {
+	it('explorer button should go to metrics explore with the attribute filter applied', async () => {
 		render(
 			<AllAttributesValue
 				filterKey="attribute1"
@@ -200,10 +198,10 @@ describe('AllAttributesValue', () => {
 			/>,
 		);
 		expect(screen.getByText('value1')).toBeInTheDocument();
-		fireEvent.click(screen.getByText('value1'));
+		await userEvent.click(screen.getByText('value1'));
 
 		expect(screen.getByText('Open in Explorer')).toBeInTheDocument();
-		fireEvent.click(screen.getByText('Open in Explorer'));
+		await userEvent.click(screen.getByText('Open in Explorer'));
 		expect(mockGoToMetricsExploreWithAppliedAttribute).toHaveBeenCalledWith(
 			'attribute1',
 			'value1',

frontend/src/container/MetricsExplorer/MetricDetails/__tests__/DashboardsAndAlertsPopover.test.tsx

@@ -1,26 +1,18 @@
-import { fireEvent, render, screen } from '@testing-library/react';
+import { render, screen } from '@testing-library/react';
+import * as metricsExplorerHooks from 'api/generated/services/metrics';
 import { QueryParams } from 'constants/query';
+import { userEvent } from 'tests/test-utils';
 
 import DashboardsAndAlertsPopover from '../DashboardsAndAlertsPopover';
-
-const mockAlert1 = {
-	alert_id: '1',
-	alert_name: 'Alert 1',
-};
-const mockAlert2 = {
-	alert_id: '2',
-	alert_name: 'Alert 2',
-};
-const mockDashboard1 = {
-	dashboard_id: '1',
-	dashboard_name: 'Dashboard 1',
-};
-const mockDashboard2 = {
-	dashboard_id: '2',
-	dashboard_name: 'Dashboard 2',
-};
-const mockAlerts = [mockAlert1, mockAlert2];
-const mockDashboards = [mockDashboard1, mockDashboard2];
+import {
+	getMockAlertsData,
+	getMockDashboardsData,
+	MOCK_ALERT_1,
+	MOCK_ALERT_2,
+	MOCK_DASHBOARD_1,
+	MOCK_DASHBOARD_2,
+	MOCK_METRIC_NAME,
+} from './testUtlls';
 
 const mockSafeNavigate = jest.fn();
 jest.mock('hooks/useSafeNavigate', () => ({
@@ -28,7 +20,6 @@ jest.mock('hooks/useSafeNavigate', () => ({
 		safeNavigate: mockSafeNavigate,
 	}),
 }));
-
 const mockSetQuery = jest.fn();
 const mockUrlQuery = {
 	set: mockSetQuery,
@@ -39,125 +30,156 @@ jest.mock('hooks/useUrlQuery', () => ({
 	default: jest.fn(() => mockUrlQuery),
 }));
 
-describe('DashboardsAndAlertsPopover', () => {
-	it('renders the popover correctly with multiple dashboards and alerts', () => {
-		render(
-			<DashboardsAndAlertsPopover
-				alerts={mockAlerts}
-				dashboards={mockDashboards}
-			/>,
-		);
+const useGetMetricAlertsMock = jest.spyOn(
+	metricsExplorerHooks,
+	'useGetMetricAlerts',
+);
+const useGetMetricDashboardsMock = jest.spyOn(
+	metricsExplorerHooks,
+	'useGetMetricDashboards',
+);
 
-		expect(
-			screen.getByText(`${mockDashboards.length} dashboards`),
-		).toBeInTheDocument();
-		expect(
-			screen.getByText(`${mockAlerts.length} alert rules`),
-		).toBeInTheDocument();
+describe('DashboardsAndAlertsPopover', () => {
+	beforeEach(() => {
+		useGetMetricAlertsMock.mockReturnValue(getMockAlertsData());
+		useGetMetricDashboardsMock.mockReturnValue(getMockDashboardsData());
+	});
+
+	it('renders the popover correctly with multiple dashboards and alerts', () => {
+		render(<DashboardsAndAlertsPopover metricName={MOCK_METRIC_NAME} />);
+
+		expect(screen.getByText(`2 dashboards`)).toBeInTheDocument();
+		expect(screen.getByText(`2 alert rules`)).toBeInTheDocument();
 	});
 
 	it('renders null with no dashboards and alerts', () => {
-		const { container } = render(
-			<DashboardsAndAlertsPopover alerts={[]} dashboards={[]} />,
+		useGetMetricAlertsMock.mockReturnValue(
+			getMockAlertsData({
+				data: {
+					alerts: [],
+				},
+			}),
 		);
-		expect(container).toBeEmptyDOMElement();
+		useGetMetricDashboardsMock.mockReturnValue(
+			getMockDashboardsData({
+				data: {
+					dashboards: [],
+				},
+			}),
+		);
+
+		const { container } = render(
+			<DashboardsAndAlertsPopover metricName={MOCK_METRIC_NAME} />,
+		);
+		expect(
+			container.querySelector('dashboards-and-alerts-popover-container'),
+		).toBeNull();
 	});
 
 	it('renders popover with single dashboard and alert', () => {
-		render(
-			<DashboardsAndAlertsPopover
-				alerts={[mockAlert1]}
-				dashboards={[mockDashboard1]}
-			/>,
+		useGetMetricAlertsMock.mockReturnValue(
+			getMockAlertsData({
+				data: {
+					alerts: [MOCK_ALERT_1],
+				},
+			}),
 		);
+		useGetMetricDashboardsMock.mockReturnValue(
+			getMockDashboardsData({
+				data: {
+					dashboards: [MOCK_DASHBOARD_1],
+				},
+			}),
+		);
+
+		render(<DashboardsAndAlertsPopover metricName={MOCK_METRIC_NAME} />);
+
 		expect(screen.getByText(`1 dashboard`)).toBeInTheDocument();
 		expect(screen.getByText(`1 alert rule`)).toBeInTheDocument();
 	});
 
-	it('renders popover with dashboard id if name is not available', () => {
-		render(
-			<DashboardsAndAlertsPopover
-				alerts={mockAlerts}
-				dashboards={[{ ...mockDashboard1, dashboard_name: undefined } as any]}
-			/>,
+	it('renders popover with dashboard id if name is not available', async () => {
+		useGetMetricDashboardsMock.mockReturnValue(
+			getMockDashboardsData({
+				data: {
+					dashboards: [{ ...MOCK_DASHBOARD_1, dashboardName: '' }],
+				},
+			}),
 		);
 
-		fireEvent.click(screen.getByText(`1 dashboard`));
-		expect(screen.getByText(mockDashboard1.dashboard_id)).toBeInTheDocument();
+		render(<DashboardsAndAlertsPopover metricName={MOCK_METRIC_NAME} />);
+
+		await userEvent.click(screen.getByText(`1 dashboard`));
+		expect(screen.getByText(MOCK_DASHBOARD_1.dashboardId)).toBeInTheDocument();
 	});
 
-	it('renders popover with alert id if name is not available', () => {
-		render(
-			<DashboardsAndAlertsPopover
-				alerts={[{ ...mockAlert1, alert_name: undefined } as any]}
-				dashboards={mockDashboards}
-			/>,
+	it('renders popover with alert id if name is not available', async () => {
+		useGetMetricAlertsMock.mockReturnValue(
+			getMockAlertsData({
+				data: {
+					alerts: [{ ...MOCK_ALERT_1, alertName: '' }],
+				},
+			}),
 		);
 
-		fireEvent.click(screen.getByText(`1 alert rule`));
-		expect(screen.getByText(mockAlert1.alert_id)).toBeInTheDocument();
+		render(<DashboardsAndAlertsPopover metricName={MOCK_METRIC_NAME} />);
+
+		await userEvent.click(screen.getByText(`1 alert rule`));
+		expect(screen.getByText(MOCK_ALERT_1.alertId)).toBeInTheDocument();
 	});
 
-	it('navigates to the dashboard when the dashboard is clicked', () => {
-		render(
-			<DashboardsAndAlertsPopover
-				alerts={mockAlerts}
-				dashboards={mockDashboards}
-			/>,
-		);
+	it('navigates to the dashboard when the dashboard is clicked', async () => {
+		render(<DashboardsAndAlertsPopover metricName={MOCK_METRIC_NAME} />);
 
 		// Click on 2 dashboards button
-		fireEvent.click(screen.getByText(`${mockDashboards.length} dashboards`));
+		await userEvent.click(screen.getByText(`2 dashboards`));
 		// Popover showing list of 2 dashboards should be visible
-		expect(screen.getByText(mockDashboard1.dashboard_name)).toBeInTheDocument();
-		expect(screen.getByText(mockDashboard2.dashboard_name)).toBeInTheDocument();
+		expect(screen.getByText(MOCK_DASHBOARD_1.dashboardName)).toBeInTheDocument();
+		expect(screen.getByText(MOCK_DASHBOARD_2.dashboardName)).toBeInTheDocument();
 
 		// Click on the first dashboard
-		fireEvent.click(screen.getByText(mockDashboard1.dashboard_name));
+		await userEvent.click(screen.getByText(MOCK_DASHBOARD_1.dashboardName));
 
 		// Should navigate to the dashboard
 		expect(mockSafeNavigate).toHaveBeenCalledWith(
-			`/dashboard/${mockDashboard1.dashboard_id}`,
+			`/dashboard/${MOCK_DASHBOARD_1.dashboardId}`,
 		);
 	});
 
-	it('navigates to the alert when the alert is clicked', () => {
-		render(
-			<DashboardsAndAlertsPopover
-				alerts={mockAlerts}
-				dashboards={mockDashboards}
-			/>,
-		);
+	it('navigates to the alert when the alert is clicked', async () => {
+		render(<DashboardsAndAlertsPopover metricName={MOCK_METRIC_NAME} />);
 
 		// Click on 2 alert rules button
-		fireEvent.click(screen.getByText(`${mockAlerts.length} alert rules`));
+		await userEvent.click(screen.getByText(`2 alert rules`));
 		// Popover showing list of 2 alert rules should be visible
-		expect(screen.getByText(mockAlert1.alert_name)).toBeInTheDocument();
-		expect(screen.getByText(mockAlert2.alert_name)).toBeInTheDocument();
+		expect(screen.getByText(MOCK_ALERT_1.alertName)).toBeInTheDocument();
+		expect(screen.getByText(MOCK_ALERT_2.alertName)).toBeInTheDocument();
 
 		// Click on the first alert rule
-		fireEvent.click(screen.getByText(mockAlert1.alert_name));
+		await userEvent.click(screen.getByText(MOCK_ALERT_1.alertName));
 
 		// Should navigate to the alert rule
 		expect(mockSetQuery).toHaveBeenCalledWith(
 			QueryParams.ruleId,
-			mockAlert1.alert_id,
+			MOCK_ALERT_1.alertId,
 		);
 	});
 
-	it('renders unique dashboards even when there are duplicates', () => {
-		render(
-			<DashboardsAndAlertsPopover
-				alerts={mockAlerts}
-				dashboards={[...mockDashboards, mockDashboard1]}
-			/>,
+	it('renders unique dashboards even when there are duplicates', async () => {
+		useGetMetricDashboardsMock.mockReturnValue(
+			getMockDashboardsData({
+				data: {
+					dashboards: [MOCK_DASHBOARD_1, MOCK_DASHBOARD_2, MOCK_DASHBOARD_1],
+				},
+			}),
 		);
-		expect(
-			screen.getByText(`${mockDashboards.length} dashboards`),
-		).toBeInTheDocument();
 
-		fireEvent.click(screen.getByText(`${mockDashboards.length} dashboards`));
-		expect(screen.getByText(mockDashboard1.dashboard_name)).toBeInTheDocument();
-		expect(screen.getByText(mockDashboard2.dashboard_name)).toBeInTheDocument();
+		render(<DashboardsAndAlertsPopover metricName={MOCK_METRIC_NAME} />);
+
+		expect(screen.getByText('2 dashboards')).toBeInTheDocument();
+
+		await userEvent.click(screen.getByText('2 dashboards'));
+		expect(screen.getByText(MOCK_DASHBOARD_1.dashboardName)).toBeInTheDocument();
+		expect(screen.getByText(MOCK_DASHBOARD_2.dashboardName)).toBeInTheDocument();
 	});
 });

frontend/src/container/MetricsExplorer/MetricDetails/__tests__/Highlights.test.tsx

@@ -0,0 +1,67 @@
+import { render, screen } from '@testing-library/react';
+import * as metricsExplorerHooks from 'api/generated/services/metrics';
+
+import Highlights from '../Highlights';
+import { formatTimestampToReadableDate } from '../utils';
+import { getMockMetricHighlightsData, MOCK_METRIC_NAME } from './testUtlls';
+
+const useGetMetricHighlightsMock = jest.spyOn(
+	metricsExplorerHooks,
+	'useGetMetricHighlights',
+);
+
+describe('Highlights', () => {
+	beforeEach(() => {
+		useGetMetricHighlightsMock.mockReturnValue(getMockMetricHighlightsData());
+	});
+
+	it('should render all highlights data correctly', () => {
+		render(<Highlights metricName={MOCK_METRIC_NAME} />);
+
+		const dataPoints = screen.getByTestId('metric-highlights-data-points');
+		const timeSeriesTotal = screen.getByTestId(
+			'metric-highlights-time-series-total',
+		);
+		const lastReceived = screen.getByTestId('metric-highlights-last-received');
+
+		expect(dataPoints.textContent).toBe('1M+');
+		expect(timeSeriesTotal.textContent).toBe('1M total ⎯ 1M active');
+		expect(lastReceived.textContent).toBe(
+			formatTimestampToReadableDate('2026-01-24T00:00:00Z'),
+		);
+	});
+
+	it('should render error state correctly', () => {
+		useGetMetricHighlightsMock.mockReturnValue(
+			getMockMetricHighlightsData(
+				{},
+				{
+					isError: true,
+				},
+			),
+		);
+
+		render(<Highlights metricName={MOCK_METRIC_NAME} />);
+
+		expect(
+			screen.getByTestId('metric-highlights-error-state'),
+		).toBeInTheDocument();
+	});
+
+	it('should render loading state when data is loading', () => {
+		useGetMetricHighlightsMock.mockReturnValue(
+			getMockMetricHighlightsData(
+				{},
+				{
+					isLoading: true,
+				},
+			),
+		);
+
+		render(<Highlights metricName={MOCK_METRIC_NAME} />);
+
+		expect(
+			screen.getByTestId('metric-highlights-loading-state'),
+		).toBeInTheDocument();
+	});
+});

frontend/src/container/MetricsExplorer/MetricDetails/__tests__/Metadata.test.tsx

@@ -1,16 +1,24 @@
 /* eslint-disable sonarjs/no-duplicate-string */
-import { fireEvent, render, screen } from '@testing-library/react';
+import { render, screen } from '@testing-library/react';
+import * as metricsExplorerHooks from 'api/generated/services/metrics';
+import {
+	GetMetricMetadata200,
+	MetrictypesTemporalityDTO,
+	MetrictypesTypeDTO,
+} from 'api/generated/services/sigNoz.schemas';
 import { Temporality } from 'api/metricsExplorer/getMetricDetails';
-import { MetricType } from 'api/metricsExplorer/getMetricsList';
 import {
 	UniversalYAxisUnit,
 	YAxisUnitSelectorProps,
 } from 'components/YAxisUnitSelector/types';
-import * as useUpdateMetricMetadataHooks from 'hooks/metricsExplorer/useUpdateMetricMetadata';
 import * as useNotificationsHooks from 'hooks/useNotifications';
+import { userEvent } from 'tests/test-utils';
 import { SelectOption } from 'types/common/select';
 
 import Metadata from '../Metadata';
+import { MetricMetadata } from '../types';
+import { transformMetricMetadata } from '../utils';
+import { getMockMetricMetadataData, MOCK_METRIC_NAME } from './testUtlls';
 
 // Mock antd select for testing
 jest.mock('antd', () => ({
@@ -72,13 +80,18 @@ jest.mock('react-query', () => ({
 	}),
 }));
 
+const mockUseUpdateMetricMetadataHook = jest.spyOn(
+	metricsExplorerHooks,
+	'useUpdateMetricMetadata',
+);
+type UseUpdateMetricMetadataResult = ReturnType<
+	typeof metricsExplorerHooks.useUpdateMetricMetadata
+>;
 const mockUseUpdateMetricMetadata = jest.fn();
-jest
-	.spyOn(useUpdateMetricMetadataHooks, 'useUpdateMetricMetadata')
-	.mockReturnValue({
-		mutate: mockUseUpdateMetricMetadata,
-		isLoading: false,
-	} as any);
+
+const mockMetricMetadata = transformMetricMetadata(
+	getMockMetricMetadataData().data as GetMetricMetadata200,
+) as MetricMetadata;
 
 const mockErrorNotification = jest.fn();
 const mockSuccessNotification = jest.fn();
@@ -89,47 +102,50 @@ jest.spyOn(useNotificationsHooks, 'useNotifications').mockReturnValue({
 	},
 } as any);
 
-const mockMetricName = 'test_metric';
-const mockMetricMetadata = {
-	metric_type: MetricType.GAUGE,
-	description: 'test_description',
-	unit: 'test_unit',
-	temporality: Temporality.DELTA,
-};
-const mockRefetchMetricDetails = jest.fn();
+const mockRefetchMetricMetadata = jest.fn();
 
 describe('Metadata', () => {
+	beforeEach(() => {
+		mockUseUpdateMetricMetadataHook.mockReturnValue(({
+			mutate: mockUseUpdateMetricMetadata,
+		} as Partial<UseUpdateMetricMetadataResult>) as UseUpdateMetricMetadataResult);
+	});
+
 	it('should render the metadata properly', () => {
 		render(
 			<Metadata
-				metricName={mockMetricName}
+				metricName={MOCK_METRIC_NAME}
 				metadata={mockMetricMetadata}
-				refetchMetricDetails={mockRefetchMetricDetails}
+				isErrorMetricMetadata={false}
+				isLoadingMetricMetadata={false}
+				refetchMetricMetadata={mockRefetchMetricMetadata}
 			/>,
 		);
 
 		expect(screen.getByText('Metric Type')).toBeInTheDocument();
-		expect(screen.getByText(mockMetricMetadata.metric_type)).toBeInTheDocument();
+		expect(screen.getByText('Gauge')).toBeInTheDocument();
 		expect(screen.getByText('Description')).toBeInTheDocument();
 		expect(screen.getByText(mockMetricMetadata.description)).toBeInTheDocument();
 		expect(screen.getByText('Unit')).toBeInTheDocument();
 		expect(screen.getByText(mockMetricMetadata.unit)).toBeInTheDocument();
 		expect(screen.getByText('Temporality')).toBeInTheDocument();
-		expect(screen.getByText(mockMetricMetadata.temporality)).toBeInTheDocument();
+		expect(screen.getByText('Delta')).toBeInTheDocument();
 	});
 
-	it('editing the metadata should show the form inputs', () => {
+	it('editing the metadata should show the form inputs', async () => {
 		render(
 			<Metadata
-				metricName={mockMetricName}
+				metricName={MOCK_METRIC_NAME}
 				metadata={mockMetricMetadata}
-				refetchMetricDetails={mockRefetchMetricDetails}
+				isErrorMetricMetadata={false}
+				isLoadingMetricMetadata={false}
+				refetchMetricMetadata={mockRefetchMetricMetadata}
 			/>,
 		);
 
 		const editButton = screen.getByText('Edit');
 		expect(editButton).toBeInTheDocument();
-		fireEvent.click(editButton);
+		await userEvent.click(editButton);
 
 		expect(screen.getByTestId('metric-type-select')).toBeInTheDocument();
 		expect(screen.getByTestId('temporality-select')).toBeInTheDocument();
@@ -139,57 +155,53 @@ describe('Metadata', () => {
 	it('should update the metadata when the form is submitted', async () => {
 		render(
 			<Metadata
-				metricName={mockMetricName}
+				metricName={MOCK_METRIC_NAME}
 				metadata={{
 					...mockMetricMetadata,
 					unit: '',
 				}}
-				refetchMetricDetails={mockRefetchMetricDetails}
+				isErrorMetricMetadata={false}
+				isLoadingMetricMetadata={false}
+				refetchMetricMetadata={mockRefetchMetricMetadata}
 			/>,
 		);
 
 		const editButton = screen.getByText('Edit');
 		expect(editButton).toBeInTheDocument();
-		fireEvent.click(editButton);
+		await userEvent.click(editButton);
 
 		const metricDescriptionInput = screen.getByTestId('description-input');
 		expect(metricDescriptionInput).toBeInTheDocument();
-		fireEvent.change(metricDescriptionInput, {
-			target: { value: 'Updated description' },
-		});
+		await userEvent.clear(metricDescriptionInput);
+		await userEvent.type(metricDescriptionInput, 'Updated description');
 
 		const metricTypeSelect = screen.getByTestId('metric-type-select');
 		expect(metricTypeSelect).toBeInTheDocument();
-		fireEvent.change(metricTypeSelect, {
-			target: { value: MetricType.SUM },
-		});
+		await userEvent.selectOptions(metricTypeSelect, MetrictypesTypeDTO.sum);
 
 		const temporalitySelect = screen.getByTestId('temporality-select');
 		expect(temporalitySelect).toBeInTheDocument();
-		fireEvent.change(temporalitySelect, {
-			target: { value: Temporality.CUMULATIVE },
-		});
+		await userEvent.selectOptions(temporalitySelect, Temporality.CUMULATIVE);
 
 		const unitSelect = screen.getByTestId('unit-select');
 		expect(unitSelect).toBeInTheDocument();
-		fireEvent.change(unitSelect, {
-			target: { value: 'By' },
-		});
+		await userEvent.selectOptions(unitSelect, 'By');
 
 		const saveButton = screen.getByText('Save');
 		expect(saveButton).toBeInTheDocument();
-		fireEvent.click(saveButton);
+		await userEvent.click(saveButton);
 
 		expect(mockUseUpdateMetricMetadata).toHaveBeenCalledWith(
 			expect.objectContaining({
-				metricName: mockMetricName,
-				payload: expect.objectContaining({
-					description: 'Updated description',
-					metricType: MetricType.SUM,
-					temporality: Temporality.CUMULATIVE,
+				data: expect.objectContaining({
+					type: MetrictypesTypeDTO.sum,
+					temporality: MetrictypesTemporalityDTO.cumulative,
 					unit: 'By',
 					isMonotonic: true,
 				}),
+				pathParams: {
+					metricName: MOCK_METRIC_NAME,
+				},
 			}),
 			expect.objectContaining({
 				onSuccess: expect.any(Function),
@@ -201,56 +213,56 @@ describe('Metadata', () => {
 	it('should show success notification when metadata is updated successfully', async () => {
 		render(
 			<Metadata
-				metricName={mockMetricName}
+				metricName={MOCK_METRIC_NAME}
 				metadata={mockMetricMetadata}
-				refetchMetricDetails={mockRefetchMetricDetails}
+				isErrorMetricMetadata={false}
+				isLoadingMetricMetadata={false}
+				refetchMetricMetadata={mockRefetchMetricMetadata}
 			/>,
 		);
 
 		const editButton = screen.getByText('Edit');
-		fireEvent.click(editButton);
+		await userEvent.click(editButton);
 
 		const metricDescriptionInput = screen.getByTestId('description-input');
-		fireEvent.change(metricDescriptionInput, {
-			target: { value: 'Updated description' },
-		});
+		await userEvent.clear(metricDescriptionInput);
+		await userEvent.type(metricDescriptionInput, 'Updated description');
 
 		const saveButton = screen.getByText('Save');
-		fireEvent.click(saveButton);
+		await userEvent.click(saveButton);
 
 		const onSuccessCallback =
 			mockUseUpdateMetricMetadata.mock.calls[0][1].onSuccess;
-		onSuccessCallback({ statusCode: 200 });
+		onSuccessCallback({ status: 200 });
 
 		expect(mockSuccessNotification).toHaveBeenCalledWith({
 			message: 'Metadata updated successfully',
 		});
-		expect(mockRefetchMetricDetails).toHaveBeenCalled();
 	});
 
 	it('should show error notification when metadata update fails with non-200 response', async () => {
 		render(
 			<Metadata
-				metricName={mockMetricName}
+				metricName={MOCK_METRIC_NAME}
 				metadata={mockMetricMetadata}
-				refetchMetricDetails={mockRefetchMetricDetails}
+				isErrorMetricMetadata={false}
+				isLoadingMetricMetadata={false}
+				refetchMetricMetadata={mockRefetchMetricMetadata}
 			/>,
 		);
 
 		const editButton = screen.getByText('Edit');
-		fireEvent.click(editButton);
+		await userEvent.click(editButton);
 
 		const metricDescriptionInput = screen.getByTestId('description-input');
-		fireEvent.change(metricDescriptionInput, {
-			target: { value: 'Updated description' },
-		});
+		await userEvent.clear(metricDescriptionInput);
+		await userEvent.type(metricDescriptionInput, 'Updated description');
 
 		const saveButton = screen.getByText('Save');
-		fireEvent.click(saveButton);
+		await userEvent.click(saveButton);
 
-		const onSuccessCallback =
-			mockUseUpdateMetricMetadata.mock.calls[0][1].onSuccess;
-		onSuccessCallback({ statusCode: 500 });
+		const onErrorCallback = mockUseUpdateMetricMetadata.mock.calls[0][1].onError;
+		onErrorCallback({ status: 500 });
 
 		expect(mockErrorNotification).toHaveBeenCalledWith({
 			message:
@@ -261,22 +273,23 @@ describe('Metadata', () => {
 	it('should show error notification when metadata update fails', async () => {
 		render(
 			<Metadata
-				metricName={mockMetricName}
+				metricName={MOCK_METRIC_NAME}
 				metadata={mockMetricMetadata}
-				refetchMetricDetails={mockRefetchMetricDetails}
+				isErrorMetricMetadata={false}
+				isLoadingMetricMetadata={false}
+				refetchMetricMetadata={mockRefetchMetricMetadata}
 			/>,
 		);
 
 		const editButton = screen.getByText('Edit');
-		fireEvent.click(editButton);
+		await userEvent.click(editButton);
 
 		const metricDescriptionInput = screen.getByTestId('description-input');
-		fireEvent.change(metricDescriptionInput, {
-			target: { value: 'Updated description' },
-		});
+		await userEvent.clear(metricDescriptionInput);
+		await userEvent.type(metricDescriptionInput, 'Updated description');
 
 		const saveButton = screen.getByText('Save');
-		fireEvent.click(saveButton);
+		await userEvent.click(saveButton);
 
 		const onErrorCallback = mockUseUpdateMetricMetadata.mock.calls[0][1].onError;
 
@@ -289,39 +302,43 @@ describe('Metadata', () => {
 		});
 	});
 
-	it('cancel button should cancel the edit mode', () => {
+	it('cancel button should cancel the edit mode', async () => {
 		render(
 			<Metadata
-				metricName={mockMetricName}
+				metricName={MOCK_METRIC_NAME}
 				metadata={mockMetricMetadata}
-				refetchMetricDetails={mockRefetchMetricDetails}
+				isErrorMetricMetadata={false}
+				isLoadingMetricMetadata={false}
+				refetchMetricMetadata={mockRefetchMetricMetadata}
 			/>,
 		);
 
 		const editButton = screen.getByText('Edit');
 		expect(editButton).toBeInTheDocument();
-		fireEvent.click(editButton);
+		await userEvent.click(editButton);
 
 		const cancelButton = screen.getByText('Cancel');
 		expect(cancelButton).toBeInTheDocument();
-		fireEvent.click(cancelButton);
+		await userEvent.click(cancelButton);
 
 		const editButton2 = screen.getByText('Edit');
 		expect(editButton2).toBeInTheDocument();
 	});
 
-	it('should not allow editing of unit if it is already set', () => {
+	it('should not allow editing of unit if it is already set', async () => {
 		render(
 			<Metadata
-				metricName={mockMetricName}
+				metricName={MOCK_METRIC_NAME}
 				metadata={mockMetricMetadata}
-				refetchMetricDetails={mockRefetchMetricDetails}
+				isErrorMetricMetadata={false}
+				isLoadingMetricMetadata={false}
+				refetchMetricMetadata={mockRefetchMetricMetadata}
 			/>,
 		);
 
 		const editButton = screen.getByText('Edit');
 		expect(editButton).toBeInTheDocument();
-		fireEvent.click(editButton);
+		await userEvent.click(editButton);
 
 		const unitSelect = screen.queryByTestId('unit-select');
 		expect(unitSelect).not.toBeInTheDocument();

frontend/src/container/MetricsExplorer/MetricDetails/__tests__/MetricDetails.test.tsx

@@ -1,68 +1,16 @@
-import { fireEvent, render, screen } from '@testing-library/react';
-import { MetricDetails as MetricDetailsType } from 'api/metricsExplorer/getMetricDetails';
-import { MetricType } from 'api/metricsExplorer/getMetricsList';
-import { getUniversalNameFromMetricUnit } from 'components/YAxisUnitSelector/utils';
+import { render, screen } from '@testing-library/react';
+import * as metricsExplorerHooks from 'api/generated/services/metrics';
 import ROUTES from 'constants/routes';
-import * as useGetMetricDetails from 'hooks/metricsExplorer/useGetMetricDetails';
-import * as useUpdateMetricMetadata from 'hooks/metricsExplorer/useUpdateMetricMetadata';
 import * as useHandleExplorerTabChange from 'hooks/useHandleExplorerTabChange';
+import { userEvent } from 'tests/test-utils';
 
 import MetricDetails from '../MetricDetails';
+import { getMockMetricMetadataData } from './testUtlls';
 
 const mockMetricName = 'test-metric';
-const mockMetricDescription = 'description for a test metric';
-const mockMetricData: MetricDetailsType = {
-	name: mockMetricName,
-	description: mockMetricDescription,
-	unit: 'count',
-	attributes: [
-		{
-			key: 'test-attribute',
-			value: ['test-value'],
-			valueCount: 1,
-		},
-	],
-	alerts: [],
-	dashboards: [],
-	metadata: {
-		metric_type: MetricType.SUM,
-		description: mockMetricDescription,
-		unit: 'count',
-	},
-	type: '',
-	timeseries: 0,
-	samples: 0,
-	timeSeriesTotal: 0,
-	timeSeriesActive: 0,
-	lastReceived: '',
-};
 const mockOpenInspectModal = jest.fn();
 const mockOnClose = jest.fn();
 
-const mockUseGetMetricDetailsData = {
-	data: {
-		payload: {
-			data: mockMetricData,
-		},
-	},
-	isLoading: false,
-	isFetching: false,
-	isError: false,
-	error: null,
-	refetch: jest.fn(),
-};
-
-jest
-	.spyOn(useGetMetricDetails, 'useGetMetricDetails')
-	.mockReturnValue(mockUseGetMetricDetailsData as any);
-
-jest.spyOn(useUpdateMetricMetadata, 'useUpdateMetricMetadata').mockReturnValue({
-	mutate: jest.fn(),
-	isLoading: false,
-	isError: false,
-	error: null,
-} as any);
-
 const mockHandleExplorerTabChange = jest.fn();
 jest
 	.spyOn(useHandleExplorerTabChange, 'useHandleExplorerTabChange')
@@ -88,7 +36,50 @@ jest.mock('react-query', () => ({
 	}),
 }));
 
+jest.mock(
+	'container/MetricsExplorer/MetricDetails/AllAttributes',
+	() =>
+		function MockAllAttributes(): JSX.Element {
+			return <div data-testid="all-attributes">All Attributes</div>;
+		},
+);
+jest.mock(
+	'container/MetricsExplorer/MetricDetails/DashboardsAndAlertsPopover',
+	() =>
+		function MockDashboardsAndAlertsPopover(): JSX.Element {
+			return (
+				<div data-testid="dashboards-and-alerts-popover">
+					Dashboards and Alerts Popover
+				</div>
+			);
+		},
+);
+jest.mock(
+	'container/MetricsExplorer/MetricDetails/Highlights',
+	() =>
+		function MockHighlights(): JSX.Element {
+			return <div data-testid="highlights">Highlights</div>;
+		},
+);
+
+jest.mock(
+	'container/MetricsExplorer/MetricDetails/Metadata',
+	() =>
+		function MockMetadata(): JSX.Element {
+			return <div data-testid="metadata">Metadata</div>;
+		},
+);
+
+const useGetMetricMetadataMock = jest.spyOn(
+	metricsExplorerHooks,
+	'useGetMetricMetadata',
+);
+
 describe('MetricDetails', () => {
+	beforeEach(() => {
+		useGetMetricMetadataMock.mockReturnValue(getMockMetricMetadataData());
+	});
+
 	it('renders metric details correctly', () => {
 		render(
 			<MetricDetails
@@ -101,27 +92,15 @@ describe('MetricDetails', () => {
 		);
 
 		expect(screen.getByText(mockMetricName)).toBeInTheDocument();
-		expect(screen.getByText(mockMetricDescription)).toBeInTheDocument();
+		expect(screen.getByTestId('all-attributes')).toBeInTheDocument();
 		expect(
-			screen.getByText(getUniversalNameFromMetricUnit(mockMetricData.unit)),
+			screen.getByTestId('dashboards-and-alerts-popover'),
 		).toBeInTheDocument();
+		expect(screen.getByTestId('highlights')).toBeInTheDocument();
+		expect(screen.getByTestId('metadata')).toBeInTheDocument();
 	});
 
-	it('renders the "open in explorer" and "inspect" buttons', () => {
-		jest.spyOn(useGetMetricDetails, 'useGetMetricDetails').mockReturnValueOnce({
-			...mockUseGetMetricDetailsData,
-			data: {
-				payload: {
-					data: {
-						...mockMetricData,
-						metadata: {
-							...mockMetricData.metadata,
-							metric_type: MetricType.GAUGE,
-						},
-					},
-				},
-			},
-		} as any);
+	it('renders the "open in explorer" and "inspect" buttons', async () => {
 		render(
 			<MetricDetails
 				onClose={mockOnClose}
@@ -135,93 +114,10 @@ describe('MetricDetails', () => {
 		expect(screen.getByTestId('open-in-explorer-button')).toBeInTheDocument();
 		expect(screen.getByTestId('inspect-metric-button')).toBeInTheDocument();
 
-		fireEvent.click(screen.getByTestId('open-in-explorer-button'));
+		await userEvent.click(screen.getByTestId('open-in-explorer-button'));
 		expect(mockHandleExplorerTabChange).toHaveBeenCalled();
 
-		fireEvent.click(screen.getByTestId('inspect-metric-button'));
+		await userEvent.click(screen.getByTestId('inspect-metric-button'));
 		expect(mockOpenInspectModal).toHaveBeenCalled();
 	});
-
-	it('should render error state when metric details are not found', () => {
-		jest.spyOn(useGetMetricDetails, 'useGetMetricDetails').mockReturnValue({
-			...mockUseGetMetricDetailsData,
-			isError: true,
-			error: {
-				message: 'Error fetching metric details',
-			},
-		} as any);
-
-		render(
-			<MetricDetails
-				onClose={mockOnClose}
-				isOpen
-				metricName={mockMetricName}
-				isModalTimeSelection
-				openInspectModal={mockOpenInspectModal}
-			/>,
-		);
-
-		expect(screen.getByText('Error fetching metric details')).toBeInTheDocument();
-	});
-
-	it('should render loading state when metric details are loading', () => {
-		jest.spyOn(useGetMetricDetails, 'useGetMetricDetails').mockReturnValue({
-			...mockUseGetMetricDetailsData,
-			isLoading: true,
-		} as any);
-
-		render(
-			<MetricDetails
-				onClose={mockOnClose}
-				isOpen
-				metricName={mockMetricName}
-				isModalTimeSelection
-				openInspectModal={mockOpenInspectModal}
-			/>,
-		);
-
-		expect(screen.getByTestId('metric-details-skeleton')).toBeInTheDocument();
-	});
-
-	it('should render all attributes section', () => {
-		jest
-			.spyOn(useGetMetricDetails, 'useGetMetricDetails')
-			.mockReturnValue(mockUseGetMetricDetailsData as any);
-		render(
-			<MetricDetails
-				onClose={mockOnClose}
-				isOpen
-				metricName={mockMetricName}
-				isModalTimeSelection
-				openInspectModal={mockOpenInspectModal}
-			/>,
-		);
-
-		expect(screen.getByText('All Attributes')).toBeInTheDocument();
-	});
-
-	it('should not render all attributes section when relevant data is not present', () => {
-		jest.spyOn(useGetMetricDetails, 'useGetMetricDetails').mockReturnValue({
-			...mockUseGetMetricDetailsData,
-			data: {
-				payload: {
-					data: {
-						...mockMetricData,
-						attributes: null,
-					},
-				},
-			},
-		} as any);
-		render(
-			<MetricDetails
-				onClose={mockOnClose}
-				isOpen
-				metricName={mockMetricName}
-				isModalTimeSelection
-				openInspectModal={mockOpenInspectModal}
-			/>,
-		);
-
-		expect(screen.queryByText('All Attributes')).not.toBeInTheDocument();
-	});
 });

frontend/src/container/MetricsExplorer/MetricDetails/__tests__/testUtlls.ts

@@ -0,0 +1,168 @@
+import * as metricsExplorerHooks from 'api/generated/services/metrics';
+import {
+	GetMetricAlerts200,
+	GetMetricAttributes200,
+	GetMetricDashboards200,
+	GetMetricHighlights200,
+	GetMetricMetadata200,
+	MetrictypesTemporalityDTO,
+	MetrictypesTypeDTO,
+} from 'api/generated/services/sigNoz.schemas';
+
+export const MOCK_METRIC_NAME = 'test-metric';
+
+export function getMockMetricHighlightsData(
+	overrides?: Partial<GetMetricHighlights200>,
+	{
+		isLoading = false,
+		isError = false,
+	}: {
+		isLoading?: boolean;
+		isError?: boolean;
+	} = {},
+): ReturnType<typeof metricsExplorerHooks.useGetMetricHighlights> {
+	return {
+		data: {
+			data: {
+				dataPoints: 1000000,
+				lastReceived: '2026-01-24T00:00:00Z',
+				totalTimeSeries: 1000000,
+				activeTimeSeries: 1000000,
+			},
+			status: 'success',
+			...overrides,
+		},
+		isLoading,
+		isError,
+	} as ReturnType<typeof metricsExplorerHooks.useGetMetricHighlights>;
+}
+
+export const MOCK_DASHBOARD_1 = {
+	dashboardName: 'Dashboard 1',
+	dashboardId: '1',
+	widgetId: '1',
+	widgetName: 'Widget 1',
+};
+export const MOCK_DASHBOARD_2 = {
+	dashboardName: 'Dashboard 2',
+	dashboardId: '2',
+	widgetId: '2',
+	widgetName: 'Widget 2',
+};
+export const MOCK_ALERT_1 = {
+	alertName: 'Alert 1',
+	alertId: '1',
+};
+export const MOCK_ALERT_2 = {
+	alertName: 'Alert 2',
+	alertId: '2',
+};
+
+export function getMockDashboardsData(
+	overrides?: Partial<GetMetricDashboards200>,
+	{
+		isLoading = false,
+		isError = false,
+	}: {
+		isLoading?: boolean;
+		isError?: boolean;
+	} = {},
+): ReturnType<typeof metricsExplorerHooks.useGetMetricDashboards> {
+	return {
+		data: {
+			data: {
+				dashboards: [MOCK_DASHBOARD_1, MOCK_DASHBOARD_2],
+			},
+			status: 'success',
+			...overrides,
+		},
+
+		isLoading,
+		isError,
+	} as ReturnType<typeof metricsExplorerHooks.useGetMetricDashboards>;
+}
+
+export function getMockAlertsData(
+	overrides?: Partial<GetMetricAlerts200>,
+	{
+		isLoading = false,
+		isError = false,
+	}: {
+		isLoading?: boolean;
+		isError?: boolean;
+	} = {},
+): ReturnType<typeof metricsExplorerHooks.useGetMetricAlerts> {
+	return {
+		data: {
+			data: {
+				alerts: [MOCK_ALERT_1, MOCK_ALERT_2],
+			},
+			status: 'success',
+			...overrides,
+		},
+		isLoading,
+		isError,
+	} as ReturnType<typeof metricsExplorerHooks.useGetMetricAlerts>;
+}
+
+export function getMockMetricAttributesData(
+	overrides?: Partial<GetMetricAttributes200>,
+	{
+		isLoading = false,
+		isError = false,
+	}: {
+		isLoading?: boolean;
+		isError?: boolean;
+	} = {},
+): ReturnType<typeof metricsExplorerHooks.useGetMetricAttributes> {
+	return {
+		data: {
+			data: {
+				attributes: [
+					{
+						key: 'attribute1',
+						values: ['value1', 'value2'],
+						valueCount: 2,
+					},
+					{
+						key: 'attribute2',
+						values: ['value3'],
+						valueCount: 1,
+					},
+				],
+				totalKeys: 2,
+			},
+			status: 'success',
+			...overrides,
+		},
+		isLoading,
+		isError,
+	} as ReturnType<typeof metricsExplorerHooks.useGetMetricAttributes>;
+}
+
+export function getMockMetricMetadataData(
+	overrides?: Partial<GetMetricMetadata200>,
+	{
+		isLoading = false,
+		isError = false,
+	}: {
+		isLoading?: boolean;
+		isError?: boolean;
+	} = {},
+): ReturnType<typeof metricsExplorerHooks.useGetMetricMetadata> {
+	return {
+		data: {
+			data: {
+				description: 'test_description',
+				type: MetrictypesTypeDTO.gauge,
+				unit: 'test_unit',
+				temporality: MetrictypesTemporalityDTO.delta,
+				isMonotonic: false,
+			},
+			status: 'success',
+			...overrides,
+		},
+		isLoading,
+		isError,
+	} as ReturnType<typeof metricsExplorerHooks.useGetMetricMetadata>;
+}

frontend/src/container/MetricsExplorer/MetricDetails/__tests__/utils.test.ts

@@ -1,5 +1,7 @@
-import { Temporality } from 'api/metricsExplorer/getMetricDetails';
-import { MetricType } from 'api/metricsExplorer/getMetricsList';
+import {
+	MetrictypesTemporalityDTO,
+	MetrictypesTypeDTO,
+} from 'api/generated/services/sigNoz.schemas';
 
 import {
 	determineIsMonotonic,
@@ -10,35 +12,48 @@ import {
 describe('MetricDetails utils', () => {
 	describe('determineIsMonotonic', () => {
 		it('should return true for histogram metrics', () => {
-			expect(determineIsMonotonic(MetricType.HISTOGRAM)).toBe(true);
+			expect(determineIsMonotonic(MetrictypesTypeDTO.histogram)).toBe(true);
 		});
 
 		it('should return true for exponential histogram metrics', () => {
-			expect(determineIsMonotonic(MetricType.EXPONENTIAL_HISTOGRAM)).toBe(true);
-		});
-
-		it('should return false for gauge metrics', () => {
-			expect(determineIsMonotonic(MetricType.GAUGE)).toBe(false);
-		});
-
-		it('should return false for summary metrics', () => {
-			expect(determineIsMonotonic(MetricType.SUMMARY)).toBe(false);
-		});
-
-		it('should return true for sum metrics with cumulative temporality', () => {
-			expect(determineIsMonotonic(MetricType.SUM, Temporality.CUMULATIVE)).toBe(
+			expect(determineIsMonotonic(MetrictypesTypeDTO.exponentialhistogram)).toBe(
 				true,
 			);
 		});
 
+		it('should return false for gauge metrics', () => {
+			expect(determineIsMonotonic(MetrictypesTypeDTO.gauge)).toBe(false);
+		});
+
+		it('should return false for summary metrics', () => {
+			expect(determineIsMonotonic(MetrictypesTypeDTO.summary)).toBe(false);
+		});
+
+		it('should return true for sum metrics with cumulative temporality', () => {
+			expect(
+				determineIsMonotonic(
+					MetrictypesTypeDTO.sum,
+					MetrictypesTemporalityDTO.cumulative,
+				),
+			).toBe(true);
+		});
+
 		it('should return false for sum metrics with delta temporality', () => {
-			expect(determineIsMonotonic(MetricType.SUM, Temporality.DELTA)).toBe(false);
+			expect(
+				determineIsMonotonic(
+					MetrictypesTypeDTO.sum,
+					MetrictypesTemporalityDTO.delta,
+				),
+			).toBe(false);
 		});
 
 		it('should return false by default', () => {
-			expect(determineIsMonotonic('' as MetricType, '' as Temporality)).toBe(
-				false,
-			);
+			expect(
+				determineIsMonotonic(
+					'' as MetrictypesTypeDTO,
+					'' as MetrictypesTemporalityDTO,
+				),
+			).toBe(false);
 		});
 	});
 
@@ -115,13 +130,16 @@ describe('MetricDetails utils', () => {
 		const API_GATEWAY = 'api-gateway';
 
 		it('should create correct query for SUM metric type', () => {
-			const query = getMetricDetailsQuery(TEST_METRIC_NAME, MetricType.SUM);
+			const query = getMetricDetailsQuery(
+				TEST_METRIC_NAME,
+				MetrictypesTypeDTO.sum,
+			);
 
 			expect(query.builder.queryData[0]?.aggregateAttribute?.key).toBe(
 				TEST_METRIC_NAME,
 			);
 			expect(query.builder.queryData[0]?.aggregateAttribute?.type).toBe(
-				MetricType.SUM,
+				MetrictypesTypeDTO.sum,
 			);
 			expect(query.builder.queryData[0]?.aggregateOperator).toBe('rate');
 			expect(query.builder.queryData[0]?.timeAggregation).toBe('rate');
@@ -129,13 +147,16 @@ describe('MetricDetails utils', () => {
 		});
 
 		it('should create correct query for GAUGE metric type', () => {
-			const query = getMetricDetailsQuery(TEST_METRIC_NAME, MetricType.GAUGE);
+			const query = getMetricDetailsQuery(
+				TEST_METRIC_NAME,
+				MetrictypesTypeDTO.gauge,
+			);
 
 			expect(query.builder.queryData[0]?.aggregateAttribute?.key).toBe(
 				TEST_METRIC_NAME,
 			);
 			expect(query.builder.queryData[0]?.aggregateAttribute?.type).toBe(
-				MetricType.GAUGE,
+				MetrictypesTypeDTO.gauge,
 			);
 			expect(query.builder.queryData[0]?.aggregateOperator).toBe('avg');
 			expect(query.builder.queryData[0]?.timeAggregation).toBe('avg');
@@ -143,13 +164,16 @@ describe('MetricDetails utils', () => {
 		});
 
 		it('should create correct query for SUMMARY metric type', () => {
-			const query = getMetricDetailsQuery(TEST_METRIC_NAME, MetricType.SUMMARY);
+			const query = getMetricDetailsQuery(
+				TEST_METRIC_NAME,
+				MetrictypesTypeDTO.summary,
+			);
 
 			expect(query.builder.queryData[0]?.aggregateAttribute?.key).toBe(
 				TEST_METRIC_NAME,
 			);
 			expect(query.builder.queryData[0]?.aggregateAttribute?.type).toBe(
-				MetricType.SUMMARY,
+				MetrictypesTypeDTO.summary,
 			);
 			expect(query.builder.queryData[0]?.aggregateOperator).toBe('noop');
 			expect(query.builder.queryData[0]?.timeAggregation).toBe('noop');
@@ -157,13 +181,16 @@ describe('MetricDetails utils', () => {
 		});
 
 		it('should create correct query for HISTOGRAM metric type', () => {
-			const query = getMetricDetailsQuery(TEST_METRIC_NAME, MetricType.HISTOGRAM);
+			const query = getMetricDetailsQuery(
+				TEST_METRIC_NAME,
+				MetrictypesTypeDTO.histogram,
+			);
 
 			expect(query.builder.queryData[0]?.aggregateAttribute?.key).toBe(
 				TEST_METRIC_NAME,
 			);
 			expect(query.builder.queryData[0]?.aggregateAttribute?.type).toBe(
-				MetricType.HISTOGRAM,
+				MetrictypesTypeDTO.histogram,
 			);
 			expect(query.builder.queryData[0]?.aggregateOperator).toBe('noop');
 			expect(query.builder.queryData[0]?.timeAggregation).toBe('noop');
@@ -173,14 +200,14 @@ describe('MetricDetails utils', () => {
 		it('should create correct query for EXPONENTIAL_HISTOGRAM metric type', () => {
 			const query = getMetricDetailsQuery(
 				TEST_METRIC_NAME,
-				MetricType.EXPONENTIAL_HISTOGRAM,
+				MetrictypesTypeDTO.exponentialhistogram,
 			);
 
 			expect(query.builder.queryData[0]?.aggregateAttribute?.key).toBe(
 				TEST_METRIC_NAME,
 			);
 			expect(query.builder.queryData[0]?.aggregateAttribute?.type).toBe(
-				MetricType.EXPONENTIAL_HISTOGRAM,
+				MetrictypesTypeDTO.exponentialhistogram,
 			);
 			expect(query.builder.queryData[0]?.aggregateOperator).toBe('noop');
 			expect(query.builder.queryData[0]?.timeAggregation).toBe('noop');
@@ -203,7 +230,7 @@ describe('MetricDetails utils', () => {
 			const filter = { key: 'service', value: API_GATEWAY };
 			const query = getMetricDetailsQuery(
 				TEST_METRIC_NAME,
-				MetricType.SUM,
+				MetrictypesTypeDTO.sum,
 				filter,
 			);
 
@@ -221,7 +248,7 @@ describe('MetricDetails utils', () => {
 			const groupBy = 'service';
 			const query = getMetricDetailsQuery(
 				TEST_METRIC_NAME,
-				MetricType.SUM,
+				MetrictypesTypeDTO.sum,
 				undefined,
 				groupBy,
 			);
@@ -236,7 +263,7 @@ describe('MetricDetails utils', () => {
 			const groupBy = 'endpoint';
 			const query = getMetricDetailsQuery(
 				TEST_METRIC_NAME,
-				MetricType.SUM,
+				MetrictypesTypeDTO.sum,
 				filter,
 				groupBy,
 			);
@@ -250,7 +277,10 @@ describe('MetricDetails utils', () => {
 		});
 
 		it('should not include filters or groupBy when not provided', () => {
-			const query = getMetricDetailsQuery(TEST_METRIC_NAME, MetricType.SUM);
+			const query = getMetricDetailsQuery(
+				TEST_METRIC_NAME,
+				MetrictypesTypeDTO.sum,
+			);
 
 			expect(query.builder.queryData[0]?.filters?.items).toHaveLength(0);
 			expect(query.builder.queryData[0]?.groupBy).toHaveLength(0);

frontend/src/container/MetricsExplorer/MetricDetails/constants.ts

@@ -1,6 +1,55 @@
+import {
+	MetrictypesTemporalityDTO,
+	MetrictypesTypeDTO,
+} from 'api/generated/services/sigNoz.schemas';
+
 export const METRIC_METADATA_KEYS = {
 	description: 'Description',
 	unit: 'Unit',
-	metric_type: 'Metric Type',
+	type: 'Metric Type',
 	temporality: 'Temporality',
+	isMonotonic: 'Monotonic',
 };
+
+export const METRIC_METADATA_TEMPORALITY_OPTIONS: Array<{
+	value: MetrictypesTemporalityDTO;
+	label: string;
+}> = [
+	{
+		value: MetrictypesTemporalityDTO.delta,
+		label: 'Delta',
+	},
+	{
+		value: MetrictypesTemporalityDTO.cumulative,
+		label: 'Cumulative',
+	},
+];
+
+export const METRIC_METADATA_TYPE_OPTIONS: Array<{
+	value: MetrictypesTypeDTO;
+	label: string;
+}> = [
+	{
+		value: MetrictypesTypeDTO.sum,
+		label: 'Sum',
+	},
+	{
+		value: MetrictypesTypeDTO.gauge,
+		label: 'Gauge',
+	},
+	{
+		value: MetrictypesTypeDTO.histogram,
+		label: 'Histogram',
+	},
+	{
+		value: MetrictypesTypeDTO.summary,
+		label: 'Summary',
+	},
+	{
+		value: MetrictypesTypeDTO.exponentialhistogram,
+		label: 'Exponential Histogram',
+	},
+];
+
+export const METRIC_METADATA_UPDATE_ERROR_MESSAGE =
+	'Failed to update metadata, please try again. If the issue persists, please contact support.';

frontend/src/container/MetricsExplorer/MetricDetails/types.ts

@@ -1,34 +1,39 @@
 import {
-	MetricDetails,
-	MetricDetailsAlert,
-	MetricDetailsAttribute,
-	MetricDetailsDashboard,
-} from 'api/metricsExplorer/getMetricDetails';
-import { MetricType } from 'api/metricsExplorer/getMetricsList';
+	MetricsexplorertypesMetricAlertDTO,
+	MetricsexplorertypesMetricAttributeDTO,
+	MetricsexplorertypesMetricDashboardDTO,
+	MetricsexplorertypesMetricHighlightsResponseDTO,
+	MetricsexplorertypesMetricMetadataDTO,
+	MetrictypesTemporalityDTO,
+	MetrictypesTypeDTO,
+} from 'api/generated/services/sigNoz.schemas';
 
 export interface MetricDetailsProps {
 	onClose: () => void;
 	isOpen: boolean;
-	metricName: string | null;
+	metricName: string;
 	isModalTimeSelection: boolean;
 	openInspectModal?: (metricName: string) => void;
 }
 
+export interface HighlightsProps {
+	metricName: string;
+}
 export interface DashboardsAndAlertsPopoverProps {
-	dashboards: MetricDetailsDashboard[] | null;
-	alerts: MetricDetailsAlert[] | null;
+	metricName: string;
 }
 
 export interface MetadataProps {
 	metricName: string;
-	metadata: MetricDetails['metadata'] | undefined;
-	refetchMetricDetails: () => void;
+	metadata: MetricMetadata | null;
+	isErrorMetricMetadata: boolean;
+	isLoadingMetricMetadata: boolean;
+	refetchMetricMetadata: () => void;
 }
 
 export interface AllAttributesProps {
-	attributes: MetricDetailsAttribute[];
 	metricName: string;
-	metricType: MetricType | undefined;
+	metricType: MetrictypesTypeDTO | undefined;
 }
 
 export interface AllAttributesValueProps {
@@ -36,3 +41,38 @@ export interface AllAttributesValueProps {
 	filterValue: string[];
 	goToMetricsExploreWithAppliedAttribute: (key: string, value: string) => void;
 }
+
+export interface AllAttributesEmptyTextProps {
+	isErrorAttributes: boolean;
+	refetchAttributes: () => void;
+}
+
+export type MetricHighlight = MetricsexplorertypesMetricHighlightsResponseDTO;
+
+export type MetricAlert = MetricsexplorertypesMetricAlertDTO;
+
+export type MetricDashboard = MetricsexplorertypesMetricDashboardDTO;
+
+export type MetricMetadata = MetricsexplorertypesMetricMetadataDTO;
+export interface MetricMetadataFormState {
+	type: MetrictypesTypeDTO;
+	description: string;
+	temporality?: MetrictypesTemporalityDTO;
+	unit: string;
+	isMonotonic: boolean;
+}
+
+export type MetricAttribute = MetricsexplorertypesMetricAttributeDTO;
+
+export enum TableFields {
+	DESCRIPTION = 'description',
+	UNIT = 'unit',
+	TYPE = 'type',
+	Temporality = 'temporality',
+	IS_MONOTONIC = 'isMonotonic',
+}
+
+export interface MetricDetailsErrorStateProps {
+	refetch?: () => void;
+	errorMessage: string;
+}

frontend/src/container/MetricsExplorer/MetricDetails/utils.tsx

@@ -1,12 +1,23 @@
-import { Temporality } from 'api/metricsExplorer/getMetricDetails';
-import { MetricType } from 'api/metricsExplorer/getMetricsList';
+import { UpdateMetricMetadataMutationBody } from 'api/generated/services/metrics';
+import {
+	GetMetricMetadata200,
+	MetrictypesTemporalityDTO,
+	MetrictypesTypeDTO,
+} from 'api/generated/services/sigNoz.schemas';
 import { SpaceAggregation, TimeAggregation } from 'api/v5/v5';
 import { initialQueriesMap } from 'constants/queryBuilder';
 import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';
 import { DataSource, ReduceOperators } from 'types/common/queryBuilder';
 
-export function formatTimestampToReadableDate(timestamp: string): string {
+import { MetricMetadata, MetricMetadataFormState } from './types';
+
+export function formatTimestampToReadableDate(
+	timestamp: number | string | undefined,
+): string {
+	if (!timestamp) {
+		return '-';
+	}
 	const date = new Date(timestamp);
 	const now = new Date();
 	const diffInSeconds = Math.floor((now.getTime() - date.getTime()) / 1000);
@@ -39,7 +50,10 @@ export function formatTimestampToReadableDate(timestamp: string): string {
 	return date.toLocaleDateString();
 }
 
-export function formatNumberToCompactFormat(num: number): string {
+export function formatNumberToCompactFormat(num: number | undefined): string {
+	if (!num) {
+		return '-';
+	}
 	return new Intl.NumberFormat('en-US', {
 		notation: 'compact',
 		maximumFractionDigits: 1,
@@ -47,27 +61,30 @@ export function formatNumberToCompactFormat(num: number): string {
 }
 
 export function determineIsMonotonic(
-	metricType: MetricType,
-	temporality?: Temporality,
+	metricType: MetrictypesTypeDTO,
+	temporality?: MetrictypesTemporalityDTO,
 ): boolean {
 	if (
-		metricType === MetricType.HISTOGRAM ||
-		metricType === MetricType.EXPONENTIAL_HISTOGRAM
+		metricType === MetrictypesTypeDTO.histogram ||
+		metricType === MetrictypesTypeDTO.exponentialhistogram
 	) {
 		return true;
 	}
-	if (metricType === MetricType.GAUGE || metricType === MetricType.SUMMARY) {
+	if (
+		metricType === MetrictypesTypeDTO.gauge ||
+		metricType === MetrictypesTypeDTO.summary
+	) {
 		return false;
 	}
-	if (metricType === MetricType.SUM) {
-		return temporality === Temporality.CUMULATIVE;
+	if (metricType === MetrictypesTypeDTO.sum) {
+		return temporality === MetrictypesTemporalityDTO.cumulative;
 	}
 	return false;
 }
 
 export function getMetricDetailsQuery(
 	metricName: string,
-	metricType: MetricType | undefined,
+	metricType: MetrictypesTypeDTO | undefined,
 	filter?: { key: string; value: string },
 	groupBy?: string,
 ): Query {
@@ -75,23 +92,23 @@ export function getMetricDetailsQuery(
 	let spaceAggregation;
 	let aggregateOperator;
 	switch (metricType) {
-		case MetricType.SUM:
+		case MetrictypesTypeDTO.sum:
 			timeAggregation = 'rate';
 			spaceAggregation = 'sum';
 			aggregateOperator = 'rate';
 			break;
-		case MetricType.GAUGE:
+		case MetrictypesTypeDTO.gauge:
 			timeAggregation = 'avg';
 			spaceAggregation = 'avg';
 			aggregateOperator = 'avg';
 			break;
-		case MetricType.SUMMARY:
+		case MetrictypesTypeDTO.summary:
 			timeAggregation = 'noop';
 			spaceAggregation = 'sum';
 			aggregateOperator = 'noop';
 			break;
-		case MetricType.HISTOGRAM:
-		case MetricType.EXPONENTIAL_HISTOGRAM:
+		case MetrictypesTypeDTO.histogram:
+		case MetrictypesTypeDTO.exponentialhistogram:
 			timeAggregation = 'noop';
 			spaceAggregation = 'p90';
 			aggregateOperator = 'noop';
@@ -160,3 +177,38 @@ export function getMetricDetailsQuery(
 		},
 	};
 }
+
+export function transformMetricMetadata(
+	apiData: GetMetricMetadata200 | undefined,
+): MetricMetadata | null {
+	if (!apiData || !apiData.data) {
+		return null;
+	}
+	const { type, description, unit, temporality, isMonotonic } = apiData.data;
+
+	return {
+		type,
+		description,
+		unit,
+		temporality,
+		isMonotonic,
+	};
+}
+
+export function transformUpdateMetricMetadataRequest(
+	metricName: string,
+	metricMetadata: MetricMetadataFormState,
+): UpdateMetricMetadataMutationBody {
+	return {
+		metricName: metricName,
+		type: metricMetadata.type,
+		description: metricMetadata.description,
+		unit: metricMetadata.unit,
+		temporality:
+			metricMetadata.temporality ?? MetrictypesTemporalityDTO.unspecified,
+		isMonotonic: determineIsMonotonic(
+			metricMetadata.type,
+			metricMetadata.temporality,
+		),
+	};
+}

frontend/src/container/MetricsExplorer/Summary/Summary.tsx

@@ -5,6 +5,7 @@ import { useSearchParams } from 'react-router-dom-v5-compat';
 import * as Sentry from '@sentry/react';
 import logEvent from 'api/common/logEvent';
 import { initialQueriesMap } from 'constants/queryBuilder';
+import { REACT_QUERY_KEY } from 'constants/reactQueryKeys';
 import { usePageSize } from 'container/InfraMonitoringK8s/utils';
 import NoLogs from 'container/NoLogs/NoLogs';
 import { useGetMetricsList } from 'hooks/metricsExplorer/useGetMetricsList';
@@ -128,7 +129,7 @@ function Summary(): JSX.Element {
 	} = useGetMetricsList(metricsListQuery, {
 		enabled: !!metricsListQuery && !isInspectModalOpen,
 		queryKey: [
-			'metricsList',
+			REACT_QUERY_KEY.GET_METRICS_LIST,
 			queryFiltersWithoutId,
 			orderBy,
 			pageSize,
@@ -323,7 +324,7 @@ function Summary(): JSX.Element {
 					</>
 				)}
 			</div>
-			{isMetricDetailsOpen && (
+			{isMetricDetailsOpen && selectedMetricName && (
 				<MetricDetails
 					isOpen={isMetricDetailsOpen}
 					onClose={closeMetricDetails}
@@ -332,7 +333,7 @@ function Summary(): JSX.Element {
 					openInspectModal={openInspectModal}
 				/>
 			)}
-			{isInspectModalOpen && (
+			{isInspectModalOpen && selectedMetricName && (
 				<InspectModal
 					isOpen={isInspectModalOpen}
 					onClose={closeInspectModal}

frontend/src/container/MetricsExplorer/Summary/constants.ts

@@ -1,3 +1,4 @@
+import { MetrictypesTypeDTO } from 'api/generated/services/sigNoz.schemas';
 import { MetricType } from 'api/metricsExplorer/getMetricsList';
 
 import { TreemapViewType } from './types';
@@ -25,7 +26,16 @@ export const METRIC_TYPE_LABEL_MAP = {
 	[MetricType.EXPONENTIAL_HISTOGRAM]: 'Exp. Histogram',
 };
 
-export const METRIC_TYPE_VALUES_MAP = {
+export const METRIC_TYPE_VIEW_LABEL_MAP: Record<MetrictypesTypeDTO, string> = {
+	[MetrictypesTypeDTO.sum]: 'Sum',
+	[MetrictypesTypeDTO.gauge]: 'Gauge',
+	[MetrictypesTypeDTO.histogram]: 'Histogram',
+	[MetrictypesTypeDTO.summary]: 'Summary',
+	[MetrictypesTypeDTO.exponentialhistogram]: 'Exp. Histogram',
+};
+
+// TODO(@amlannandy): To remove this once API migration is complete
+export const METRIC_TYPE_VALUES_MAP: Record<MetricType, string> = {
 	[MetricType.SUM]: 'Sum',
 	[MetricType.GAUGE]: 'Gauge',
 	[MetricType.HISTOGRAM]: 'Histogram',
@@ -33,6 +43,14 @@ export const METRIC_TYPE_VALUES_MAP = {
 	[MetricType.EXPONENTIAL_HISTOGRAM]: 'ExponentialHistogram',
 };
 
+export const METRIC_TYPE_VIEW_VALUES_MAP: Record<MetrictypesTypeDTO, string> = {
+	[MetrictypesTypeDTO.sum]: 'Sum',
+	[MetrictypesTypeDTO.gauge]: 'Gauge',
+	[MetrictypesTypeDTO.histogram]: 'Histogram',
+	[MetrictypesTypeDTO.summary]: 'Summary',
+	[MetrictypesTypeDTO.exponentialhistogram]: 'ExponentialHistogram',
+};
+
 export const IS_METRIC_DETAILS_OPEN_KEY = 'isMetricDetailsOpen';
 export const IS_INSPECT_MODAL_OPEN_KEY = 'isInspectModalOpen';
 export const SELECTED_METRIC_NAME_KEY = 'selectedMetricName';

frontend/src/container/MetricsExplorer/Summary/utils.tsx

@@ -2,6 +2,7 @@ import { useMemo } from 'react';
 import { Color } from '@signozhq/design-tokens';
 import { Tooltip, Typography } from 'antd';
 import { ColumnType } from 'antd/es/table';
+import { MetrictypesTypeDTO } from 'api/generated/services/sigNoz.schemas';
 import {
 	MetricsListItemData,
 	MetricsListPayload,
@@ -21,7 +22,7 @@ import {
 } from 'lucide-react';
 import { TagFilter } from 'types/api/queryBuilder/queryBuilderData';
 
-import { METRIC_TYPE_LABEL_MAP } from './constants';
+import { METRIC_TYPE_LABEL_MAP, METRIC_TYPE_VIEW_LABEL_MAP } from './constants';
 import MetricNameSearch from './MetricNameSearch';
 import MetricTypeSearch from './MetricTypeSearch';
 import { MetricsListItemRowData, TreemapTile, TreemapViewType } from './types';
@@ -143,6 +144,66 @@ export function MetricTypeRenderer({
 	);
 }
 
+export function MetricTypeViewRenderer({
+	type,
+}: {
+	type: MetrictypesTypeDTO;
+}): JSX.Element {
+	const [icon, color] = useMemo(() => {
+		switch (type) {
+			case MetrictypesTypeDTO.sum:
+				return [
+					<Diff key={type} size={12} color={Color.BG_ROBIN_500} />,
+					Color.BG_ROBIN_500,
+				];
+			case MetrictypesTypeDTO.gauge:
+				return [
+					<Gauge key={type} size={12} color={Color.BG_SAKURA_500} />,
+					Color.BG_SAKURA_500,
+				];
+			case MetrictypesTypeDTO.histogram:
+				return [
+					<BarChart2 key={type} size={12} color={Color.BG_SIENNA_500} />,
+					Color.BG_SIENNA_500,
+				];
+			case MetrictypesTypeDTO.summary:
+				return [
+					<BarChartHorizontal key={type} size={12} color={Color.BG_FOREST_500} />,
+					Color.BG_FOREST_500,
+				];
+			case MetrictypesTypeDTO.exponentialhistogram:
+				return [
+					<BarChart key={type} size={12} color={Color.BG_AQUA_500} />,
+					Color.BG_AQUA_500,
+				];
+			default:
+				return [null, ''];
+		}
+	}, [type]);
+
+	const metricTypeRendererStyle = useMemo(
+		() => ({
+			backgroundColor: `${color}33`,
+			border: `1px solid ${color}`,
+			color,
+		}),
+		[color],
+	);
+
+	const metricTypeRendererTextStyle = useMemo(() => ({ color, fontSize: 12 }), [
+		color,
+	]);
+
+	return (
+		<div className="metric-type-renderer" style={metricTypeRendererStyle}>
+			{icon}
+			<Typography.Text style={metricTypeRendererTextStyle}>
+				{METRIC_TYPE_VIEW_LABEL_MAP[type]}
+			</Typography.Text>
+		</div>
+	);
+}
+
 function ValidateRowValueWrapper({
 	value,
 	children,
@@ -160,6 +221,9 @@ export const formatNumberIntoHumanReadableFormat = (
 	num: number,
 	addPlusSign = true,
 ): string => {
+	if (!num) {
+		return '-';
+	}
 	function format(num: number, divisor: number, suffix: string): string {
 		const value = num / divisor;
 		return value % 1 === 0

frontend/src/container/NewWidget/RightContainer/LegendColors/LegendColors.test.tsx

@@ -0,0 +1,131 @@
+import { ColorPickerProps } from 'antd';
+import { Color } from 'antd/es/color-picker';
+import { render, screen, userEvent } from 'tests/test-utils';
+
+import LegendColors from './LegendColors';
+
+jest.mock('hooks/queryBuilder/useQueryBuilder', () => ({
+	__esModule: true,
+	useQueryBuilder: (): { currentQuery: unknown } => ({
+		currentQuery: {
+			builder: {
+				queryData: [
+					{
+						queryName: 'A',
+						legend: '{service.name}',
+					},
+				],
+			},
+		},
+	}),
+}));
+
+jest.mock('hooks/useDarkMode', () => ({
+	useIsDarkMode: (): boolean => false,
+}));
+
+jest.mock('antd', () => {
+	const actual = jest.requireActual('antd');
+	return {
+		...actual,
+		ColorPicker: ({ onChange, children }: ColorPickerProps): JSX.Element => (
+			<button
+				type="button"
+				data-testid="legend-color-picker"
+				onClick={(): void =>
+					onChange!({ toHexString: (): string => '#ffffff' } as Color, '#ffffff')
+				}
+			>
+				{children}
+			</button>
+		),
+	};
+});
+
+describe('LegendColors', () => {
+	it('renders legend colors panel and items', async () => {
+		const user = userEvent.setup();
+
+		render(
+			<LegendColors
+				customLegendColors={{}}
+				setCustomLegendColors={jest.fn()}
+				queryResponse={undefined}
+			/>,
+		);
+
+		expect(screen.getByText('Legend Colors')).toBeInTheDocument();
+
+		// Expand the collapse to reveal legend items
+		await user.click(
+			screen.getByRole('tab', {
+				name: /Legend Colors/i,
+			}),
+		);
+
+		expect(screen.getByText('{service.name}')).toBeInTheDocument();
+	});
+
+	it('calls setCustomLegendColors when color is changed', async () => {
+		const user = userEvent.setup();
+		const setCustomLegendColors = jest.fn();
+
+		render(
+			<LegendColors
+				customLegendColors={{}}
+				setCustomLegendColors={setCustomLegendColors}
+				queryResponse={undefined}
+			/>,
+		);
+
+		// Expand to render the mocked ColorPicker button
+		await user.click(
+			screen.getByRole('tab', {
+				name: /Legend Colors/i,
+			}),
+		);
+
+		const colorTrigger = screen.getByTestId('legend-color-picker');
+
+		await user.click(colorTrigger);
+
+		expect(setCustomLegendColors).toHaveBeenCalled();
+	});
+
+	it('throttles rapid color changes', async () => {
+		jest.useFakeTimers();
+		const user = userEvent.setup({ advanceTimers: jest.advanceTimersByTime });
+		const setCustomLegendColors = jest.fn();
+
+		render(
+			<LegendColors
+				customLegendColors={{}}
+				setCustomLegendColors={setCustomLegendColors}
+				queryResponse={undefined}
+			/>,
+		);
+
+		// Expand panel to render the mocked ColorPicker button
+		await user.click(
+			screen.getByRole('tab', {
+				name: /Legend Colors/i,
+			}),
+		);
+
+		const colorTrigger = screen.getByTestId('legend-color-picker');
+
+		// Fire multiple rapid changes
+		await user.click(colorTrigger);
+		await user.click(colorTrigger);
+		await user.click(colorTrigger);
+		await user.click(colorTrigger);
+
+		// Flush pending throttled calls
+		jest.advanceTimersByTime(500);
+
+		// Throttling should ensure we don't invoke the setter once per click
+		expect(setCustomLegendColors).toHaveBeenCalledTimes(2);
+
+		jest.useRealTimers();
+	});
+});

frontend/src/container/NewWidget/RightContainer/LegendColors/LegendColors.tsx

@@ -14,6 +14,7 @@ import { useIsDarkMode } from 'hooks/useDarkMode';
 import { getLegend } from 'lib/dashboard/getQueryResults';
 import getLabelName from 'lib/getLabelName';
 import { generateColor } from 'lib/uPlotLib/utils/generateColor';
+import throttle from 'lodash-es/throttle';
 import { Palette } from 'lucide-react';
 import { SuccessResponse } from 'types/api';
 import { MetricRangePayloadProps } from 'types/api/metrics/getQueryRange';
@@ -95,13 +96,24 @@ function LegendColors({
 		);
 	};
 
-	// Handle color change
-	const handleColorChange = (label: string, color: string): void => {
-		setCustomLegendColors((prev) => ({
-			...prev,
-			[label]: color,
-		}));
-	};
+	// Handle color change (throttled to avoid excessive updates)
+	const handleColorChange = useMemo(
+		() =>
+			throttle((label: string, color: string): void => {
+				setCustomLegendColors((prev) => ({
+					...prev,
+					[label]: color,
+				}));
+			}, 200), // 200ms is a good compromise between responsiveness and performance
+		[setCustomLegendColors],
+	);
+
+	// Clean up throttled handler on unmount
+	useEffect(() => {
+		return (): void => {
+			handleColorChange.cancel();
+		};
+	}, [handleColorChange]);
 
 	// Reset to default color
 	const resetToDefault = (label: string): void => {

frontend/src/hooks/metricsExplorer/useGetMultipleMetrics.ts

@@ -1,32 +1,37 @@
 import { useQueries, UseQueryOptions, UseQueryResult } from 'react-query';
-import { getMetricMetadata } from 'api/metricsExplorer/v2/getMetricMetadata';
-import { REACT_QUERY_KEY } from 'constants/reactQueryKeys';
-import { SuccessResponseV2 } from 'types/api';
-import { MetricMetadataResponse } from 'types/api/metricsExplorer/v2/getMetricMetadata';
+import {
+	getGetMetricMetadataQueryKey,
+	getMetricMetadata,
+} from 'api/generated/services/metrics';
+import { GetMetricMetadata200 } from 'api/generated/services/sigNoz.schemas';
 
-type QueryResult = UseQueryResult<
-	SuccessResponseV2<MetricMetadataResponse>,
-	Error
->;
+type QueryResult = UseQueryResult<GetMetricMetadata200, Error>;
 
 type UseGetMultipleMetrics = (
 	metricNames: string[],
-	options?: UseQueryOptions<SuccessResponseV2<MetricMetadataResponse>, Error>,
+	options?: UseQueryOptions<GetMetricMetadata200, Error>,
 	headers?: Record<string, string>,
 ) => QueryResult[];
 
 export const useGetMultipleMetrics: UseGetMultipleMetrics = (
 	metricNames,
 	options,
-	headers,
 ) =>
 	useQueries(
 		metricNames.map(
 			(metricName) =>
 				({
-					queryKey: [REACT_QUERY_KEY.GET_METRIC_METADATA, metricName],
-					queryFn: ({ signal }) => getMetricMetadata(metricName, signal, headers),
+					queryKey: getGetMetricMetadataQueryKey({
+						metricName,
+					}),
+					queryFn: ({ signal }) =>
+						getMetricMetadata(
+							{
+								metricName,
+							},
+							signal,
+						),
 					...options,
-				} as UseQueryOptions<SuccessResponseV2<MetricMetadataResponse>, Error>),
+				} as UseQueryOptions<GetMetricMetadata200, Error>),
 		),
 	);

frontend/src/hooks/useGetYAxisUnit.test.ts

@@ -1,7 +1,7 @@
 import { renderHook } from '@testing-library/react';
+import { MetricsexplorertypesMetricMetadataDTO } from 'api/generated/services/sigNoz.schemas';
 import { UniversalYAxisUnit } from 'components/YAxisUnitSelector/types';
 import { useGetMetrics } from 'container/MetricsExplorer/Explorer/utils';
-import { MetricMetadata } from 'types/api/metricsExplorer/v2/getMetricMetadata';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';
 import { EQueryType } from 'types/common/dashboard';
 import { DataSource, QueryBuilderContextType } from 'types/common/queryBuilder';
@@ -24,13 +24,13 @@ const mockUseGetMetrics = useGetMetrics as jest.MockedFunction<
 
 const MOCK_METRIC_1 = {
 	unit: UniversalYAxisUnit.BYTES,
-} as MetricMetadata;
+} as MetricsexplorertypesMetricMetadataDTO;
 const MOCK_METRIC_2 = {
 	unit: UniversalYAxisUnit.SECONDS,
-} as MetricMetadata;
+} as MetricsexplorertypesMetricMetadataDTO;
 const MOCK_METRIC_3 = {
 	unit: '',
-} as MetricMetadata;
+} as MetricsexplorertypesMetricMetadataDTO;
 
 function createMockCurrentQuery(
 	queryType: EQueryType,

frontend/src/lib/uPlotV2/plugins/TooltipPlugin/TooltipPlugin.styles.scss

@@ -1,14 +1,22 @@
 .tooltip-plugin-container {
 	top: 0;
 	left: 0;
+	width: 100%;
 	z-index: 1070;
 	white-space: pre;
 	border-radius: 4px;
 	position: fixed;
 	overflow: auto;
 	transform: translate(-1000px, -1000px); // hide the tooltip initially
+	opacity: 0;
+	pointer-events: none;
 
 	&.pinned {
 		box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
 	}
+
+	&.visible {
+		opacity: 1;
+		pointer-events: all;
+	}
 }

frontend/src/lib/uPlotV2/plugins/TooltipPlugin/TooltipPlugin.tsx

@@ -339,8 +339,9 @@ export default function TooltipPlugin({
 			return;
 		}
 		const layout = layoutRef.current;
+		layout.observer.disconnect();
+
 		if (containerRef.current) {
-			layout.observer.disconnect();
 			layout.observer.observe(containerRef.current);
 			const { width, height } = containerRef.current.getBoundingClientRect();
 			layout.width = width;
@@ -351,24 +352,28 @@ export default function TooltipPlugin({
 		}
 	}, [isHovering, plot]);
 
-	if (!plot || !isHovering) {
+	if (!plot) {
 		return null;
 	}
 
 	return createPortal(
 		<div
-			className={cx('tooltip-plugin-container', { pinned: isPinned })}
+			className={cx('tooltip-plugin-container', {
+				pinned: isPinned,
+				visible: isHovering,
+			})}
 			style={{
 				...style,
 				maxWidth: `${maxWidth}px`,
 				maxHeight: `${maxHeight}px`,
-				width: '100%',
 			}}
 			aria-live="polite"
 			aria-atomic="true"
+			aria-hidden={!isHovering}
 			ref={containerRef}
+			data-testid="tooltip-plugin-container"
 		>
-			{contents}
+			{isHovering ? contents : null}
 		</div>,
 		portalRoot.current,
 	);

frontend/src/lib/uPlotV2/plugins/__tests__/TooltipPlugin.test.ts

@@ -187,9 +187,7 @@ describe('TooltipPlugin', () => {
 				canPinTooltip: true,
 			});
 
-			const container = document.querySelector(
-				'.tooltip-plugin-container',
-			) as HTMLElement;
+			const container = screen.getByTestId('tooltip-plugin-container');
 			expect(container.classList.contains('pinned')).toBe(false);
 
 			act(() => {
@@ -197,11 +195,9 @@ describe('TooltipPlugin', () => {
 			});
 
 			return waitFor(() => {
-				const updated = document.querySelector(
-					'.tooltip-plugin-container',
-				) as HTMLElement | null;
-				expect(updated).not.toBeNull();
-				expect(updated?.classList.contains('pinned')).toBe(true);
+				const updated = screen.getByTestId('tooltip-plugin-container');
+				expect(updated).toBeInTheDocument();
+				expect(updated.classList.contains('pinned')).toBe(true);
 			});
 		});
 
@@ -249,7 +245,13 @@ describe('TooltipPlugin', () => {
 			await user.click(button);
 
 			await waitFor(() => {
-				expect(document.querySelector('.tooltip-plugin-container')).toBeNull();
+				const container = screen.getByTestId('tooltip-plugin-container');
+
+				expect(container).toBeInTheDocument();
+				expect(container.getAttribute('aria-hidden')).toBe('true');
+				expect(container.classList.contains('visible')).toBe(false);
+				expect(container.classList.contains('pinned')).toBe(false);
+				expect(container.textContent).toBe('');
 			});
 		});
 
@@ -292,12 +294,16 @@ describe('TooltipPlugin', () => {
 				jest.runAllTimers();
 			});
 
-			expect(document.querySelector('.tooltip-plugin-container')).toBeNull();
+			const container = screen.getByTestId('tooltip-plugin-container');
+			expect(container).toBeInTheDocument();
+			expect(container.getAttribute('aria-hidden')).toBe('true');
+			expect(container.classList.contains('visible')).toBe(false);
+			expect(container.classList.contains('pinned')).toBe(false);
 
 			jest.useRealTimers();
 		});
 
-		it('unpins the tooltip on outside mousedown', () => {
+		it('unpins the tooltip on outside mousedown', async () => {
 			jest.useFakeTimers();
 			const config = createConfigMock();
 
@@ -335,12 +341,19 @@ describe('TooltipPlugin', () => {
 				jest.runAllTimers();
 			});
 
-			expect(document.querySelector('.tooltip-plugin-container')).toBeNull();
+			await waitFor(() => {
+				const container = screen.getByTestId('tooltip-plugin-container');
+
+				expect(container).toBeInTheDocument();
+				expect(container.getAttribute('aria-hidden')).toBe('true');
+				expect(container.classList.contains('visible')).toBe(false);
+				expect(container.classList.contains('pinned')).toBe(false);
+			});
 
 			jest.useRealTimers();
 		});
 
-		it('unpins the tooltip on outside keydown', () => {
+		it('unpins the tooltip on outside keydown', async () => {
 			jest.useFakeTimers();
 			const config = createConfigMock();
 
@@ -380,7 +393,13 @@ describe('TooltipPlugin', () => {
 				jest.runAllTimers();
 			});
 
-			expect(document.querySelector('.tooltip-plugin-container')).toBeNull();
+			await waitFor(() => {
+				const container = screen.getByTestId('tooltip-plugin-container');
+				expect(container).toBeInTheDocument();
+				expect(container.getAttribute('aria-hidden')).toBe('true');
+				expect(container.classList.contains('visible')).toBe(false);
+				expect(container.classList.contains('pinned')).toBe(false);
+			});
 
 			jest.useRealTimers();
 		});

frontend/src/utils/pluralize.ts

@@ -0,0 +1,13 @@
+export function pluralize(
+	count: number,
+	singular: string,
+	plural?: string,
+): string {
+	if (count === 1) {
+		return `${count} ${singular}`;
+	}
+	if (plural) {
+		return `${count} ${plural}`;
+	}
+	return `${count} ${singular}s`;
+}

pkg/http/middleware/recovery.go

@@ -1,44 +0,0 @@
-package middleware
-
-import (
-	"log/slog"
-	"net/http"
-	"runtime/debug"
-
-	"github.com/SigNoz/signoz/pkg/errors"
-	"github.com/SigNoz/signoz/pkg/http/render"
-)
-
-// Recovery is a middleware that recovers from panics, logs the panic,
-// and returns a 500 Internal Server Error.
-type Recovery struct {
-	logger *slog.Logger
-}
-
-// NewRecovery creates a new Recovery middleware.
-func NewRecovery(logger *slog.Logger) Wrapper {
-	return &Recovery{
-		logger: logger.With("pkg", "http-middleware-recovery"),
-	}
-}
-
-// Wrap is the middleware handler.
-func (m *Recovery) Wrap(next http.Handler) http.Handler {
-	return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
-		defer func() {
-			if err := recover(); err != nil {
-				m.logger.ErrorContext(
-					r.Context(),
-					"panic recovered",
-					"err", err, "stack", string(debug.Stack()),
-				)
-
-				render.Error(w, errors.NewInternalf(
-					errors.CodeInternal, "internal server error",
-				))
-			}
-		}()
-
-		next.ServeHTTP(w, r)
-	})
-}

pkg/modules/cloudintegrations/cloudintegrations.go

@@ -1,27 +0,0 @@
-package cloudintegrations
-
-import (
-	"context"
-	"net/http"
-)
-
-// start with moving the agent functions here to get review
-
-// type Module interface {
-// 	AgentCheckIn(http.ResponseWriter, *http.Request)
-// }
-
-type Handler interface {
-	AgentCheckIn(http.ResponseWriter, *http.Request)
-	ListServices(http.ResponseWriter, *http.Request)
-}
-
-type Module interface {
-	AgentCheckIn(ctx context.Context, req *PostableAgentCheckInPayload) (any, error)
-	ListServices(ctx context.Context, orgID string, cloudProvider string, cloudAccountId *string) (any, error)
-}
-
-// store interface will be in the types package
-type CloudProvider interface {
-	ListServices(ctx context.Context, orgID string, cloudAccountId *string) (any, error)
-}

pkg/modules/cloudintegrations/implcloudintergations/handler.go

@@ -1,99 +0,0 @@
-package implcloudintergations
-
-import (
-	"context"
-	"encoding/json"
-	"net/http"
-	"time"
-
-	"github.com/SigNoz/signoz/pkg/errors"
-	"github.com/SigNoz/signoz/pkg/http/render"
-	"github.com/SigNoz/signoz/pkg/modules/cloudintegrations"
-	"github.com/SigNoz/signoz/pkg/types/authtypes"
-	"github.com/SigNoz/signoz/pkg/types/integrationtypes"
-	"github.com/gorilla/mux"
-)
-
-type handler struct {
-	module cloudintegrations.Module
-}
-
-func NewHandler(module cloudintegrations.Module) *handler {
-	return &handler{
-		module: module,
-	}
-}
-
-func (h *handler) CloudIntegrationsAgentCheckIn(rw http.ResponseWriter, r *http.Request) {
-	ctx, cancel := context.WithTimeout(r.Context(), 10*time.Second)
-	defer cancel()
-
-	claims, err := authtypes.ClaimsFromContext(ctx)
-	if err != nil {
-		render.Error(rw, err)
-		return
-	}
-
-	cloudProviderString := mux.Vars(r)["cloudProvider"]
-
-	cloudProvider, err := integrationtypes.NewCloudProvider(cloudProviderString)
-	if err != nil {
-		render.Error(rw, err)
-		return
-	}
-
-	req := new(integrationtypes.PostableAgentCheckInPayload)
-	if err = json.NewDecoder(r.Body).Decode(req); err != nil {
-		render.Error(rw, errors.WrapInvalidInputf(err, errors.CodeInvalidInput, "invalid request body"))
-		return
-	}
-
-	req.OrgID = claims.OrgID
-
-	// we need to get the config
-
-	resp, err := h.cloudIntegrationsRegistry[cloudProvider].AgentCheckIn(r.Context(), req)
-	if err != nil {
-		render.Error(rw, err)
-		return
-	}
-
-	render.Success(rw, http.StatusOK, resp)
-}
-
-func (h *handler) ListServices(rw http.ResponseWriter, r *http.Request) {
-	ctx, cancel := context.WithTimeout(r.Context(), 10*time.Second)
-	defer cancel()
-
-	claims, err := authtypes.ClaimsFromContext(r.Context())
-	if err != nil {
-		render.Error(rw, err)
-		return
-	}
-
-	cloudProviderString := mux.Vars(r)["cloudProvider"]
-
-	cloudProvider, err := integrationtypes.NewCloudProvider(cloudProviderString)
-	if err != nil {
-		render.Error(rw, err)
-		return
-	}
-
-	var cloudAccountId *string
-
-	cloudAccountIdQP := r.URL.Query().Get("cloud_account_id")
-	if len(cloudAccountIdQP) > 0 {
-		cloudAccountId = &cloudAccountIdQP
-	}
-
-	// give me the provider and then use it
-
-	resp, err := h.module.ListServices(ctx, claims.OrgID, cloudProvider, cloudAccountId)
-	if err != nil {
-		render.Error(rw, err)
-		return
-	}
-
-	render.Success(rw, http.StatusOK, resp)
-
-}

pkg/modules/cloudintegrations/implcloudintergations/store.go

@@ -1,175 +0,0 @@
-package implcloudintergations
-
-import (
-	"context"
-	"database/sql"
-	"fmt"
-	"log/slog"
-	"strings"
-	"time"
-
-	"github.com/SigNoz/signoz/pkg/errors"
-	"github.com/SigNoz/signoz/pkg/sqlstore"
-	"github.com/SigNoz/signoz/pkg/types"
-	"github.com/SigNoz/signoz/pkg/types/integrationtypes"
-	"github.com/SigNoz/signoz/pkg/valuer"
-)
-
-type store struct {
-	sqlstore sqlstore.SQLStore
-}
-
-func NewStore(sqlstore sqlstore.SQLStore) integrationtypes.Store {
-	return &store{sqlstore: sqlstore}
-}
-
-func (s *store) ListConnected(
-	ctx context.Context, orgId string, cloudProvider string,
-) ([]integrationtypes.CloudIntegration, error) {
-	accounts := []integrationtypes.CloudIntegration{}
-
-	err := s.sqlstore.BunDB().NewSelect().
-		Model(&accounts).
-		Where("org_id = ?", orgId).
-		Where("provider = ?", cloudProvider).
-		Where("removed_at is NULL").
-		Where("account_id is not NULL").
-		Where("last_agent_report is not NULL").
-		Order("created_at").
-		Scan(ctx)
-
-	if err != nil {
-		slog.ErrorContext(ctx, "error querying connected cloud accounts", "error", err)
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "could not query connected cloud accounts")
-	}
-
-	return accounts, nil
-}
-
-func (s *store) Get(
-	ctx context.Context, orgId string, provider string, id string,
-) (*integrationtypes.CloudIntegration, error) {
-	var result integrationtypes.CloudIntegration
-
-	err := s.sqlstore.BunDB().NewSelect().
-		Model(&result).
-		Where("org_id = ?", orgId).
-		Where("provider = ?", provider).
-		Where("id = ?", id).
-		Scan(ctx)
-
-	if err != nil {
-		if errors.Is(err, sql.ErrNoRows) {
-			return nil, s.sqlstore.WrapNotFoundErrf(
-				err,
-				integrationtypes.ErrCodeCloudIntegrationAccountNotFound,
-				"couldn't find account with Id %s", id,
-			)
-		}
-
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "couldn't query cloud provider account")
-	}
-
-	return &result, nil
-}
-
-func (s *store) GetConnectedCloudAccount(
-	ctx context.Context, orgId string, provider string, accountId string,
-) (*integrationtypes.CloudIntegration, error) {
-	var result integrationtypes.CloudIntegration
-
-	err := s.sqlstore.BunDB().NewSelect().
-		Model(&result).
-		Where("org_id = ?", orgId).
-		Where("provider = ?", provider).
-		Where("account_id = ?", accountId).
-		Where("last_agent_report is not NULL").
-		Where("removed_at is NULL").
-		Scan(ctx)
-
-	if errors.Is(err, sql.ErrNoRows) {
-		return nil, s.sqlstore.WrapNotFoundErrf(err, integrationtypes.ErrCodeCloudIntegrationAccountNotFound, "couldn't find connected cloud account %s", accountId)
-	} else if err != nil {
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "couldn't query cloud provider account")
-	}
-
-	return &result, nil
-}
-
-func (s *store) Upsert(
-	ctx context.Context,
-	orgId string,
-	provider string,
-	id *string,
-	config []byte,
-	accountId *string,
-	agentReport *integrationtypes.AgentReport,
-	removedAt *time.Time,
-) (*integrationtypes.CloudIntegration, error) {
-	if id == nil {
-		temp := valuer.GenerateUUID().StringValue()
-		id = &temp
-	}
-
-	onConflictSetStmts := []string{}
-	setColStatement := func(col string) string {
-		return fmt.Sprintf("%s=excluded.%s", col, col)
-	}
-
-	if config != nil {
-		onConflictSetStmts = append(onConflictSetStmts, setColStatement("config"))
-	}
-
-	if accountId != nil {
-		onConflictSetStmts = append(onConflictSetStmts, setColStatement("account_id"))
-	}
-
-	if agentReport != nil {
-		onConflictSetStmts = append(onConflictSetStmts, setColStatement("last_agent_report"))
-	}
-
-	if removedAt != nil {
-		onConflictSetStmts = append(onConflictSetStmts, setColStatement("removed_at"))
-	}
-
-	onConflictSetStmts = append(onConflictSetStmts, setColStatement("updated_at"))
-
-	onConflictClause := ""
-	if len(onConflictSetStmts) > 0 {
-		onConflictClause = fmt.Sprintf(
-			"conflict(id, provider, org_id) do update SET\n%s",
-			strings.Join(onConflictSetStmts, ",\n"),
-		)
-	}
-
-	integration := integrationtypes.CloudIntegration{
-		OrgID:        orgId,
-		Provider:     provider,
-		Identifiable: types.Identifiable{ID: valuer.MustNewUUID(*id)},
-		TimeAuditable: types.TimeAuditable{
-			CreatedAt: time.Now(),
-			UpdatedAt: time.Now(),
-		},
-		Config:          string(config),
-		AccountID:       accountId,
-		LastAgentReport: agentReport,
-		RemovedAt:       removedAt,
-	}
-
-	_, err := s.sqlstore.BunDB().NewInsert().
-		Model(&integration).
-		On(onConflictClause).
-		Exec(ctx)
-
-	if err != nil {
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "couldn't upsert cloud integration account")
-	}
-
-	upsertedAccount, err := s.Get(ctx, orgId, provider, *id)
-	if err != nil {
-		slog.ErrorContext(ctx, "error upserting cloud integration account", "error", err)
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "couldn't get upserted cloud integration account")
-	}
-
-	return upsertedAccount, nil
-}

pkg/modules/user/impluser/handler.go

@@ -13,7 +13,6 @@ import (
 	root "github.com/SigNoz/signoz/pkg/modules/user"
 	"github.com/SigNoz/signoz/pkg/types"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
-	"github.com/SigNoz/signoz/pkg/types/integrationtypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
 	"github.com/gorilla/mux"
 )
@@ -463,7 +462,7 @@ func (h *handler) UpdateAPIKey(w http.ResponseWriter, r *http.Request) {
 		return
 	}
 
-	if slices.Contains(integrationtypes.CloudIntegrationUserEmails, createdByUser.Email) {
+	if slices.Contains(types.AllIntegrationUserEmails, types.IntegrationUserEmail(createdByUser.Email.String())) {
 		render.Error(w, errors.Newf(errors.TypeInvalidInput, errors.CodeInvalidInput, "API Keys for integration users cannot be revoked"))
 		return
 	}
@@ -508,7 +507,7 @@ func (h *handler) RevokeAPIKey(w http.ResponseWriter, r *http.Request) {
 		return
 	}
 
-	if slices.Contains(integrationtypes.CloudIntegrationUserEmails, createdByUser.Email) {
+	if slices.Contains(types.AllIntegrationUserEmails, types.IntegrationUserEmail(createdByUser.Email.String())) {
 		render.Error(w, errors.Newf(errors.TypeInvalidInput, errors.CodeInvalidInput, "API Keys for integration users cannot be revoked"))
 		return
 	}

pkg/modules/user/impluser/module.go

@@ -19,7 +19,6 @@ import (
 	"github.com/SigNoz/signoz/pkg/types"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
 	"github.com/SigNoz/signoz/pkg/types/emailtypes"
-	"github.com/SigNoz/signoz/pkg/types/integrationtypes"
 	"github.com/SigNoz/signoz/pkg/types/roletypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
 	"github.com/dustin/go-humanize"
@@ -174,7 +173,7 @@ func (m *Module) DeleteInvite(ctx context.Context, orgID string, id valuer.UUID)
 func (module *Module) CreateUser(ctx context.Context, input *types.User, opts ...root.CreateUserOption) error {
 	createUserOpts := root.NewCreateUserOptions(opts...)
 
-	// since assign is idempotent multiple calls to assign won't cause issues in case of retries.
+	// since assign is idempotant multiple calls to assign won't cause issues in case of retries.
 	err := module.authz.Grant(ctx, input.OrgID, roletypes.MustGetSigNozManagedRoleFromExistingRole(input.Role), authtypes.MustNewSubject(authtypes.TypeableUser, input.ID.StringValue(), input.OrgID, nil))
 	if err != nil {
 		return err
@@ -280,7 +279,7 @@ func (module *Module) DeleteUser(ctx context.Context, orgID valuer.UUID, id stri
 		return errors.WithAdditionalf(err, "cannot delete root user")
 	}
 
-	if slices.Contains(integrationtypes.CloudIntegrationUserEmails, user.Email) {
+	if slices.Contains(types.AllIntegrationUserEmails, types.IntegrationUserEmail(user.Email.String())) {
 		return errors.New(errors.TypeForbidden, errors.CodeForbidden, "integration user cannot be deleted")
 	}
 
@@ -294,7 +293,7 @@ func (module *Module) DeleteUser(ctx context.Context, orgID valuer.UUID, id stri
 		return errors.New(errors.TypeForbidden, errors.CodeForbidden, "cannot delete the last admin")
 	}
 
-	// since revoke is idempotent multiple calls to revoke won't cause issues in case of retries
+	// since revoke is idempotant multiple calls to revoke won't cause issues in case of retries
 	err = module.authz.Revoke(ctx, orgID, roletypes.MustGetSigNozManagedRoleFromExistingRole(user.Role), authtypes.MustNewSubject(authtypes.TypeableUser, id, orgID, nil))
 	if err != nil {
 		return err

pkg/querier/builder_query.go

@@ -80,11 +80,16 @@ func (q *builderQuery[T]) Fingerprint() string {
 			case qbtypes.LogAggregation:
 				aggParts = append(aggParts, a.Expression)
 			case qbtypes.MetricAggregation:
-				aggParts = append(aggParts, fmt.Sprintf("%s:%s:%s:%s",
+				var spaceAggParamStr string
+				if a.ComparisonSpaceAggregationParam != nil {
+					spaceAggParamStr = a.ComparisonSpaceAggregationParam.StringValue()
+				}
+				aggParts = append(aggParts, fmt.Sprintf("%s:%s:%s:%s:%s",
 					a.MetricName,
 					a.Temporality.StringValue(),
 					a.TimeAggregation.StringValue(),
 					a.SpaceAggregation.StringValue(),
+					spaceAggParamStr,
 				))
 			}
 		}

pkg/querier/querier.go

@@ -276,15 +276,17 @@ func (q *querier) QueryRange(ctx context.Context, orgID valuer.UUID, req *qbtype
 
 	// Fetch temporality for all metrics at once
 	var metricTemporality map[string]metrictypes.Temporality
+	var metricTypes map[string]metrictypes.Type
 	if len(metricNames) > 0 {
 		var err error
-		metricTemporality, err = q.metadataStore.FetchTemporalityMulti(ctx, req.Start, req.End, metricNames...)
+		metricTemporality, metricTypes, err = q.metadataStore.FetchTemporalityAndTypeMulti(ctx, req.Start, req.End, metricNames...)
 		if err != nil {
 			q.logger.WarnContext(ctx, "failed to fetch metric temporality", "error", err, "metrics", metricNames)
 			// Continue without temporality - statement builder will handle unspecified
 			metricTemporality = make(map[string]metrictypes.Temporality)
+			metricTypes = make(map[string]metrictypes.Type)
 		}
-		q.logger.DebugContext(ctx, "fetched metric temporalities", "metric_temporality", metricTemporality)
+		q.logger.DebugContext(ctx, "fetched metric temporalities and types", "metric_temporality", metricTemporality, "metric_types", metricTypes)
 	}
 
 	queries := make(map[string]qbtypes.Query)
@@ -380,6 +382,12 @@ func (q *querier) QueryRange(ctx context.Context, orgID valuer.UUID, req *qbtype
 					if spec.Aggregations[i].Temporality == metrictypes.Unknown {
 						spec.Aggregations[i].Temporality = metrictypes.Unspecified
 					}
+
+					if spec.Aggregations[i].MetricName != "" && spec.Aggregations[i].Type == metrictypes.UnspecifiedType {
+						if foundMetricType, ok := metricTypes[spec.Aggregations[i].MetricName]; ok && foundMetricType != metrictypes.UnspecifiedType {
+							spec.Aggregations[i].Type = foundMetricType
+						}
+					}
 				}
 				spec.ShiftBy = extractShiftFromBuilderQuery(spec)
 				timeRange := adjustTimeRangeForShift(spec, qbtypes.TimeRange{From: req.Start, To: req.End}, req.RequestType)

pkg/query-service/app/cloudintegrations/accountsRepo.go

@@ -1,57 +1,55 @@
-package store
+package cloudintegrations
 
 import (
 	"context"
 	"database/sql"
 	"fmt"
-	"log/slog"
 	"strings"
 	"time"
 
-	"github.com/SigNoz/signoz/pkg/errors"
+	"github.com/SigNoz/signoz/pkg/query-service/model"
 	"github.com/SigNoz/signoz/pkg/sqlstore"
 	"github.com/SigNoz/signoz/pkg/types"
-	"github.com/SigNoz/signoz/pkg/types/integrationtypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
 )
 
-var (
-	CodeCloudIntegrationAccountNotFound errors.Code = errors.MustNewCode("cloud_integration_account_not_found")
-)
+type cloudProviderAccountsRepository interface {
+	listConnected(ctx context.Context, orgId string, provider string) ([]types.CloudIntegration, *model.ApiError)
 
-type CloudProviderAccountsRepository interface {
-	ListConnected(ctx context.Context, orgId string, provider string) ([]integrationtypes.CloudIntegration, error)
+	get(ctx context.Context, orgId string, provider string, id string) (*types.CloudIntegration, *model.ApiError)
 
-	Get(ctx context.Context, orgId string, provider string, id string) (*integrationtypes.CloudIntegration, error)
-
-	GetConnectedCloudAccount(ctx context.Context, orgId, provider string, accountID string) (*integrationtypes.CloudIntegration, error)
+	getConnectedCloudAccount(ctx context.Context, orgId string, provider string, accountID string) (*types.CloudIntegration, *model.ApiError)
 
 	// Insert an account or update it by (cloudProvider, id)
 	// for specified non-empty fields
-	Upsert(
+	upsert(
 		ctx context.Context,
 		orgId string,
 		provider string,
 		id *string,
-		config []byte,
+		config *types.AccountConfig,
 		accountId *string,
-		agentReport *integrationtypes.AgentReport,
+		agentReport *types.AgentReport,
 		removedAt *time.Time,
-	) (*integrationtypes.CloudIntegration, error)
+	) (*types.CloudIntegration, *model.ApiError)
 }
 
-func NewCloudProviderAccountsRepository(store sqlstore.SQLStore) CloudProviderAccountsRepository {
-	return &cloudProviderAccountsSQLRepository{store: store}
+func newCloudProviderAccountsRepository(store sqlstore.SQLStore) (
+	*cloudProviderAccountsSQLRepository, error,
+) {
+	return &cloudProviderAccountsSQLRepository{
+		store: store,
+	}, nil
 }
 
 type cloudProviderAccountsSQLRepository struct {
 	store sqlstore.SQLStore
 }
 
-func (r *cloudProviderAccountsSQLRepository) ListConnected(
+func (r *cloudProviderAccountsSQLRepository) listConnected(
 	ctx context.Context, orgId string, cloudProvider string,
-) ([]integrationtypes.CloudIntegration, error) {
-	accounts := []integrationtypes.CloudIntegration{}
+) ([]types.CloudIntegration, *model.ApiError) {
+	accounts := []types.CloudIntegration{}
 
 	err := r.store.BunDB().NewSelect().
 		Model(&accounts).
@@ -64,17 +62,18 @@ func (r *cloudProviderAccountsSQLRepository) ListConnected(
 		Scan(ctx)
 
 	if err != nil {
-		slog.ErrorContext(ctx, "error querying connected cloud accounts", "error", err)
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "could not query connected cloud accounts")
+		return nil, model.InternalError(fmt.Errorf(
+			"could not query connected cloud accounts: %w", err,
+		))
 	}
 
 	return accounts, nil
 }
 
-func (r *cloudProviderAccountsSQLRepository) Get(
+func (r *cloudProviderAccountsSQLRepository) get(
 	ctx context.Context, orgId string, provider string, id string,
-) (*integrationtypes.CloudIntegration, error) {
-	var result integrationtypes.CloudIntegration
+) (*types.CloudIntegration, *model.ApiError) {
+	var result types.CloudIntegration
 
 	err := r.store.BunDB().NewSelect().
 		Model(&result).
@@ -83,25 +82,23 @@ func (r *cloudProviderAccountsSQLRepository) Get(
 		Where("id = ?", id).
 		Scan(ctx)
 
-	if err != nil {
-		if errors.Is(err, sql.ErrNoRows) {
-			return nil, errors.WrapNotFoundf(
-				err,
-				CodeCloudIntegrationAccountNotFound,
-				"couldn't find account with Id %s", id,
-			)
-		}
-
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "couldn't query cloud provider account")
+	if err == sql.ErrNoRows {
+		return nil, model.NotFoundError(fmt.Errorf(
+			"couldn't find account with Id %s", id,
+		))
+	} else if err != nil {
+		return nil, model.InternalError(fmt.Errorf(
+			"couldn't query cloud provider accounts: %w", err,
+		))
 	}
 
 	return &result, nil
 }
 
-func (r *cloudProviderAccountsSQLRepository) GetConnectedCloudAccount(
+func (r *cloudProviderAccountsSQLRepository) getConnectedCloudAccount(
 	ctx context.Context, orgId string, provider string, accountId string,
-) (*integrationtypes.CloudIntegration, error) {
-	var result integrationtypes.CloudIntegration
+) (*types.CloudIntegration, *model.ApiError) {
+	var result types.CloudIntegration
 
 	err := r.store.BunDB().NewSelect().
 		Model(&result).
@@ -112,25 +109,29 @@ func (r *cloudProviderAccountsSQLRepository) GetConnectedCloudAccount(
 		Where("removed_at is NULL").
 		Scan(ctx)
 
-	if errors.Is(err, sql.ErrNoRows) {
-		return nil, errors.WrapNotFoundf(err, CodeCloudIntegrationAccountNotFound, "couldn't find connected cloud account %s", accountId)
+	if err == sql.ErrNoRows {
+		return nil, model.NotFoundError(fmt.Errorf(
+			"couldn't find connected cloud account %s", accountId,
+		))
 	} else if err != nil {
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "couldn't query cloud provider account")
+		return nil, model.InternalError(fmt.Errorf(
+			"couldn't query cloud provider accounts: %w", err,
+		))
 	}
 
 	return &result, nil
 }
 
-func (r *cloudProviderAccountsSQLRepository) Upsert(
+func (r *cloudProviderAccountsSQLRepository) upsert(
 	ctx context.Context,
 	orgId string,
 	provider string,
 	id *string,
-	config []byte,
+	config *types.AccountConfig,
 	accountId *string,
-	agentReport *integrationtypes.AgentReport,
+	agentReport *types.AgentReport,
 	removedAt *time.Time,
-) (*integrationtypes.CloudIntegration, error) {
+) (*types.CloudIntegration, *model.ApiError) {
 	// Insert
 	if id == nil {
 		temp := valuer.GenerateUUID().StringValue()
@@ -180,7 +181,7 @@ func (r *cloudProviderAccountsSQLRepository) Upsert(
 		)
 	}
 
-	integration := integrationtypes.CloudIntegration{
+	integration := types.CloudIntegration{
 		OrgID:        orgId,
 		Provider:     provider,
 		Identifiable: types.Identifiable{ID: valuer.MustNewUUID(*id)},
@@ -188,25 +189,28 @@ func (r *cloudProviderAccountsSQLRepository) Upsert(
 			CreatedAt: time.Now(),
 			UpdatedAt: time.Now(),
 		},
-		Config:          string(config),
+		Config:          config,
 		AccountID:       accountId,
 		LastAgentReport: agentReport,
 		RemovedAt:       removedAt,
 	}
 
-	_, err := r.store.BunDB().NewInsert().
+	_, dbErr := r.store.BunDB().NewInsert().
 		Model(&integration).
 		On(onConflictClause).
 		Exec(ctx)
 
-	if err != nil {
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "couldn't upsert cloud integration account")
+	if dbErr != nil {
+		return nil, model.InternalError(fmt.Errorf(
+			"could not upsert cloud account record: %w", dbErr,
+		))
 	}
 
-	upsertedAccount, err := r.Get(ctx, orgId, provider, *id)
-	if err != nil {
-		slog.ErrorContext(ctx, "error upserting cloud integration account", "error", err)
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "couldn't get upserted cloud integration account")
+	upsertedAccount, apiErr := r.get(ctx, orgId, provider, *id)
+	if apiErr != nil {
+		return nil, model.InternalError(fmt.Errorf(
+			"couldn't fetch upserted account by id: %w", apiErr.ToError(),
+		))
 	}
 
 	return upsertedAccount, nil

pkg/query-service/app/cloudintegrations/baseprovider/baseprovider.go

@@ -1,571 +0,0 @@
-package baseprovider
-
-import (
-	"context"
-	"fmt"
-	"log/slog"
-	"sort"
-	"sync"
-	"time"
-
-	"github.com/SigNoz/signoz/pkg/errors"
-	"github.com/SigNoz/signoz/pkg/querier"
-	"github.com/SigNoz/signoz/pkg/query-service/app/cloudintegrations/services"
-	"github.com/SigNoz/signoz/pkg/query-service/app/cloudintegrations/store"
-	"github.com/SigNoz/signoz/pkg/query-service/utils"
-	"github.com/SigNoz/signoz/pkg/types/dashboardtypes"
-	"github.com/SigNoz/signoz/pkg/types/integrationtypes"
-	"github.com/SigNoz/signoz/pkg/types/metrictypes"
-	qbtypes "github.com/SigNoz/signoz/pkg/types/querybuildertypes/querybuildertypesv5"
-	"github.com/SigNoz/signoz/pkg/types/telemetrytypes"
-	"github.com/SigNoz/signoz/pkg/valuer"
-)
-
-var (
-	CodeDashboardNotFound = errors.MustNewCode("dashboard_not_found")
-)
-
-// hasValidTimeSeriesData checks if a query response contains valid time series data
-// with at least one aggregation, series, and value
-func hasValidTimeSeriesData(queryResponse *qbtypes.TimeSeriesData) bool {
-	return queryResponse != nil &&
-		len(queryResponse.Aggregations) > 0 &&
-		len(queryResponse.Aggregations[0].Series) > 0 &&
-		len(queryResponse.Aggregations[0].Series[0].Values) > 0
-}
-
-type BaseCloudProvider[def integrationtypes.Definition, conf integrationtypes.ServiceConfigTyped[def]] struct {
-	Logger             *slog.Logger
-	Querier            querier.Querier
-	AccountsRepo       store.CloudProviderAccountsRepository
-	ServiceConfigRepo  store.ServiceConfigDatabase
-	ServiceDefinitions *services.ServicesProvider[def]
-	ProviderType       integrationtypes.CloudProviderType
-}
-
-func (b *BaseCloudProvider[def, conf]) GetName() integrationtypes.CloudProviderType {
-	return b.ProviderType
-}
-
-// AgentCheckIn is a helper function that handles common agent check-in logic.
-// The getAgentConfigFunc should return the provider-specific agent configuration.
-func AgentCheckIn[def integrationtypes.Definition, conf integrationtypes.ServiceConfigTyped[def], AgentConfigT any](
-	b *BaseCloudProvider[def, conf],
-	ctx context.Context,
-	req *integrationtypes.PostableAgentCheckInPayload,
-	getAgentConfigFunc func(context.Context, *integrationtypes.CloudIntegration) (*AgentConfigT, error),
-) (*integrationtypes.GettableAgentCheckInRes[AgentConfigT], error) {
-	// agent can't check in unless the account is already created
-	existingAccount, err := b.AccountsRepo.Get(ctx, req.OrgID, b.GetName().String(), req.ID)
-	if err != nil {
-		return nil, err
-	}
-
-	if existingAccount != nil && existingAccount.AccountID != nil && *existingAccount.AccountID != req.AccountID {
-		return nil, errors.NewInvalidInputf(errors.CodeInvalidInput,
-			"can't check in with new %s account id %s for account %s with existing %s id %s",
-			b.GetName().String(), req.AccountID, existingAccount.ID.StringValue(), b.GetName().String(),
-			*existingAccount.AccountID,
-		)
-	}
-
-	existingAccount, err = b.AccountsRepo.GetConnectedCloudAccount(ctx, req.OrgID, b.GetName().String(), req.AccountID)
-	if err != nil && !errors.Ast(err, errors.TypeNotFound) {
-		return nil, err
-	}
-	if existingAccount != nil && existingAccount.ID.StringValue() != req.ID {
-		return nil, errors.NewInvalidInputf(errors.CodeInvalidInput,
-			"can't check in to %s account %s with id %s. already connected with id %s",
-			b.GetName().String(), req.AccountID, req.ID, existingAccount.ID.StringValue(),
-		)
-	}
-
-	agentReport := integrationtypes.AgentReport{
-		TimestampMillis: time.Now().UnixMilli(),
-		Data:            req.Data,
-	}
-
-	account, err := b.AccountsRepo.Upsert(
-		ctx, req.OrgID, b.GetName().String(), &req.ID, nil, &req.AccountID, &agentReport, nil,
-	)
-	if err != nil {
-		return nil, err
-	}
-
-	agentConfig, err := getAgentConfigFunc(ctx, account)
-	if err != nil {
-		return nil, err
-	}
-
-	return &integrationtypes.GettableAgentCheckInRes[AgentConfigT]{
-		AccountId:         account.ID.StringValue(),
-		CloudAccountId:    *account.AccountID,
-		RemovedAt:         account.RemovedAt,
-		IntegrationConfig: *agentConfig,
-	}, nil
-}
-
-func (b *BaseCloudProvider[def, conf]) GetAccountStatus(ctx context.Context, orgID, accountID string) (*integrationtypes.GettableAccountStatus, error) {
-	accountRecord, err := b.AccountsRepo.Get(ctx, orgID, b.ProviderType.String(), accountID)
-	if err != nil {
-		return nil, err
-	}
-
-	return &integrationtypes.GettableAccountStatus{
-		Id:             accountRecord.ID.String(),
-		CloudAccountId: accountRecord.AccountID,
-		Status:         accountRecord.Status(),
-	}, nil
-}
-
-func (b *BaseCloudProvider[def, conf]) ListConnectedAccounts(ctx context.Context, orgID string) (*integrationtypes.GettableConnectedAccountsList, error) {
-	accountRecords, err := b.AccountsRepo.ListConnected(ctx, orgID, b.ProviderType.String())
-	if err != nil {
-		return nil, err
-	}
-
-	connectedAccounts := make([]*integrationtypes.Account, 0, len(accountRecords))
-	for _, r := range accountRecords {
-		connectedAccounts = append(connectedAccounts, r.Account(b.ProviderType))
-	}
-
-	return &integrationtypes.GettableConnectedAccountsList{
-		Accounts: connectedAccounts,
-	}, nil
-}
-
-func (b *BaseCloudProvider[def, conf]) DisconnectAccount(ctx context.Context, orgID, accountID string) (*integrationtypes.CloudIntegration, error) {
-	account, err := b.AccountsRepo.Get(ctx, orgID, b.ProviderType.String(), accountID)
-	if err != nil {
-		return nil, err
-	}
-
-	tsNow := time.Now()
-	account, err = b.AccountsRepo.Upsert(
-		ctx, orgID, b.ProviderType.String(), &accountID, nil, nil, nil, &tsNow,
-	)
-	if err != nil {
-		return nil, err
-	}
-
-	return account, nil
-}
-
-func (b *BaseCloudProvider[def, conf]) GetDashboard(ctx context.Context, id string, orgID valuer.UUID) (*dashboardtypes.Dashboard, error) {
-	allDashboards, err := b.GetAvailableDashboards(ctx, orgID)
-	if err != nil {
-		return nil, err
-	}
-
-	for _, d := range allDashboards {
-		if d.ID == id {
-			return d, nil
-		}
-	}
-
-	return nil, errors.NewNotFoundf(CodeDashboardNotFound, "dashboard with id %s not found", id)
-}
-
-func (b *BaseCloudProvider[def, conf]) GetServiceConnectionStatus(
-	ctx context.Context,
-	cloudAccountID string,
-	orgID valuer.UUID,
-	definition def,
-	isMetricsEnabled bool,
-	isLogsEnabled bool,
-) (*integrationtypes.ServiceConnectionStatus, error) {
-	ingestionStatusCheck := definition.GetIngestionStatusCheck()
-	if ingestionStatusCheck == nil {
-		return nil, nil
-	}
-
-	resp := new(integrationtypes.ServiceConnectionStatus)
-
-	wg := sync.WaitGroup{}
-
-	if len(ingestionStatusCheck.Metrics) > 0 && isMetricsEnabled {
-		wg.Add(1)
-		go func() {
-			defer utils.RecoverPanic(func(err interface{}, stack []byte) {
-				b.Logger.ErrorContext(
-					ctx, "panic while getting service metrics connection status",
-					"service", definition.GetId(),
-					"error", err,
-					"stack", string(stack),
-				)
-			})
-			defer wg.Done()
-			status, _ := b.getServiceMetricsConnectionStatus(ctx, cloudAccountID, orgID, definition)
-			resp.Metrics = status
-		}()
-	}
-
-	if len(ingestionStatusCheck.Logs) > 0 && isLogsEnabled {
-		wg.Add(1)
-		go func() {
-			defer utils.RecoverPanic(func(err interface{}, stack []byte) {
-				b.Logger.ErrorContext(
-					ctx, "panic while getting service logs connection status",
-					"service", definition.GetId(),
-					"error", err,
-					"stack", string(stack),
-				)
-			})
-			defer wg.Done()
-			status, _ := b.getServiceLogsConnectionStatus(ctx, cloudAccountID, orgID, definition)
-			resp.Logs = status
-		}()
-	}
-
-	wg.Wait()
-
-	return resp, nil
-}
-
-func (b *BaseCloudProvider[def, conf]) getServiceMetricsConnectionStatus(
-	ctx context.Context,
-	cloudAccountID string,
-	orgID valuer.UUID,
-	definition def,
-) ([]*integrationtypes.SignalConnectionStatus, error) {
-	ingestionStatusCheck := definition.GetIngestionStatusCheck()
-	if ingestionStatusCheck == nil || len(ingestionStatusCheck.Metrics) < 1 {
-		return nil, nil
-	}
-
-	statusResp := make([]*integrationtypes.SignalConnectionStatus, 0)
-
-	for _, metric := range ingestionStatusCheck.Metrics {
-		statusResp = append(statusResp, &integrationtypes.SignalConnectionStatus{
-			CategoryID:          metric.Category,
-			CategoryDisplayName: metric.DisplayName,
-		})
-	}
-
-	for index, category := range ingestionStatusCheck.Metrics {
-		queries := make([]qbtypes.QueryEnvelope, 0)
-
-		for _, check := range category.Checks {
-			// TODO: make sure all the cloud providers send these two attributes
-			// or create map of provider specific filter expression
-			filterExpression := fmt.Sprintf(`cloud.provider="%s" AND cloud.account.id="%s"`, b.ProviderType.String(), cloudAccountID)
-			f := ""
-			for _, attribute := range check.Attributes {
-				f = fmt.Sprintf("%s %s", attribute.Name, attribute.Operator)
-				if attribute.Value != "" {
-					f = fmt.Sprintf("%s '%s'", f, attribute.Value)
-				}
-
-				filterExpression = fmt.Sprintf("%s AND %s", filterExpression, f)
-			}
-
-			queries = append(queries, qbtypes.QueryEnvelope{
-				Type: qbtypes.QueryTypeBuilder,
-				Spec: qbtypes.QueryBuilderQuery[qbtypes.MetricAggregation]{
-					Name:   valuer.GenerateUUID().String(),
-					Signal: telemetrytypes.SignalMetrics,
-					Aggregations: []qbtypes.MetricAggregation{{
-						MetricName:       check.Key,
-						TimeAggregation:  metrictypes.TimeAggregationAvg,
-						SpaceAggregation: metrictypes.SpaceAggregationAvg,
-					}},
-					Filter: &qbtypes.Filter{
-						Expression: filterExpression,
-					},
-				},
-			})
-		}
-
-		resp, err := b.Querier.QueryRange(ctx, orgID, &qbtypes.QueryRangeRequest{
-			SchemaVersion: "v5",
-			Start:         uint64(time.Now().Add(-time.Hour).UnixMilli()),
-			End:           uint64(time.Now().UnixMilli()),
-			RequestType:   qbtypes.RequestTypeScalar,
-			CompositeQuery: qbtypes.CompositeQuery{
-				Queries: queries,
-			},
-		})
-		if err != nil {
-			b.Logger.DebugContext(ctx,
-				"error querying for service metrics connection status",
-				"error", err,
-				"service", definition.GetId(),
-			)
-			continue
-		}
-
-		if resp != nil && len(resp.Data.Results) < 1 {
-			continue
-		}
-
-		queryResponse, ok := resp.Data.Results[0].(*qbtypes.TimeSeriesData)
-		if !ok {
-			b.Logger.ErrorContext(ctx, "unexpected query response type for service metrics connection status",
-				"service", definition.GetId(),
-			)
-			continue
-		}
-
-		if !hasValidTimeSeriesData(queryResponse) {
-			continue
-		}
-
-		statusResp[index] = &integrationtypes.SignalConnectionStatus{
-			CategoryID:           category.Category,
-			CategoryDisplayName:  category.DisplayName,
-			LastReceivedTsMillis: queryResponse.Aggregations[0].Series[0].Values[0].Timestamp,
-			LastReceivedFrom:     fmt.Sprintf("signoz-%s-integration", b.ProviderType.String()),
-		}
-	}
-
-	return statusResp, nil
-}
-
-func (b *BaseCloudProvider[def, conf]) getServiceLogsConnectionStatus(
-	ctx context.Context,
-	cloudAccountID string,
-	orgID valuer.UUID,
-	definition def,
-) ([]*integrationtypes.SignalConnectionStatus, error) {
-	ingestionStatusCheck := definition.GetIngestionStatusCheck()
-	if ingestionStatusCheck == nil || len(ingestionStatusCheck.Logs) < 1 {
-		return nil, nil
-	}
-
-	statusResp := make([]*integrationtypes.SignalConnectionStatus, 0)
-
-	for _, log := range ingestionStatusCheck.Logs {
-		statusResp = append(statusResp, &integrationtypes.SignalConnectionStatus{
-			CategoryID:          log.Category,
-			CategoryDisplayName: log.DisplayName,
-		})
-	}
-
-	for index, category := range ingestionStatusCheck.Logs {
-		queries := make([]qbtypes.QueryEnvelope, 0)
-
-		for _, check := range category.Checks {
-			// TODO: make sure all the cloud providers provide required attributes for logs
-			// or create map of provider specific filter expression
-			filterExpression := fmt.Sprintf(`cloud.account.id="%s"`, cloudAccountID)
-			f := ""
-			for _, attribute := range check.Attributes {
-				f = fmt.Sprintf("%s %s", attribute.Name, attribute.Operator)
-				if attribute.Value != "" {
-					f = fmt.Sprintf("%s '%s'", f, attribute.Value)
-				}
-
-				filterExpression = fmt.Sprintf("%s AND %s", filterExpression, f)
-			}
-
-			queries = append(queries, qbtypes.QueryEnvelope{
-				Type: qbtypes.QueryTypeBuilder,
-				Spec: qbtypes.QueryBuilderQuery[qbtypes.LogAggregation]{
-					Name:   valuer.GenerateUUID().String(),
-					Signal: telemetrytypes.SignalLogs,
-					Aggregations: []qbtypes.LogAggregation{{
-						Expression: "count()",
-					}},
-					Filter: &qbtypes.Filter{
-						Expression: filterExpression,
-					},
-					Limit:  10,
-					Offset: 0,
-				},
-			})
-		}
-
-		resp, err := b.Querier.QueryRange(ctx, orgID, &qbtypes.QueryRangeRequest{
-			SchemaVersion: "v1",
-			Start:         uint64(time.Now().Add(-time.Hour * 1).UnixMilli()),
-			End:           uint64(time.Now().UnixMilli()),
-			RequestType:   qbtypes.RequestTypeTimeSeries,
-			CompositeQuery: qbtypes.CompositeQuery{
-				Queries: queries,
-			},
-		})
-		if err != nil {
-			b.Logger.DebugContext(ctx,
-				"error querying for service logs connection status",
-				"error", err,
-				"service", definition.GetId(),
-			)
-			continue
-		}
-
-		if resp != nil && len(resp.Data.Results) < 1 {
-			continue
-		}
-
-		queryResponse, ok := resp.Data.Results[0].(*qbtypes.TimeSeriesData)
-		if !ok {
-			b.Logger.ErrorContext(ctx, "unexpected query response type for service logs connection status",
-				"service", definition.GetId(),
-			)
-			continue
-		}
-
-		if !hasValidTimeSeriesData(queryResponse) {
-			continue
-		}
-
-		statusResp[index] = &integrationtypes.SignalConnectionStatus{
-			CategoryID:           category.Category,
-			CategoryDisplayName:  category.DisplayName,
-			LastReceivedTsMillis: queryResponse.Aggregations[0].Series[0].Values[0].Timestamp,
-			LastReceivedFrom:     fmt.Sprintf("signoz-%s-integration", b.ProviderType.String()),
-		}
-	}
-
-	return statusResp, nil
-}
-
-func (b *BaseCloudProvider[def, conf]) GetAvailableDashboards(
-	ctx context.Context,
-	orgID valuer.UUID,
-) ([]*dashboardtypes.Dashboard, error) {
-	accountRecords, err := b.AccountsRepo.ListConnected(ctx, orgID.StringValue(), b.ProviderType.String())
-	if err != nil {
-		return nil, err
-	}
-
-	servicesWithAvailableMetrics := map[string]*time.Time{}
-
-	for _, ar := range accountRecords {
-		if ar.AccountID != nil {
-			configsBySvcId, err := b.ServiceConfigRepo.GetAllForAccount(ctx, orgID.StringValue(), ar.ID.StringValue())
-			if err != nil {
-				return nil, err
-			}
-
-			for svcId, config := range configsBySvcId {
-				var serviceConfig conf
-				err = integrationtypes.UnmarshalJSON(config, &serviceConfig)
-				if err != nil {
-					return nil, err
-				}
-
-				if serviceConfig.IsMetricsEnabled() {
-					servicesWithAvailableMetrics[svcId] = &ar.CreatedAt
-				}
-			}
-		}
-	}
-
-	svcDashboards := make([]*dashboardtypes.Dashboard, 0)
-
-	allServices, err := b.ServiceDefinitions.ListServiceDefinitions(ctx)
-	if err != nil {
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "failed to list %s service definitions", b.ProviderType.String())
-	}
-
-	// accumulate definitions in a fixed order to ensure same order of dashboards across runs
-	svcIds := make([]string, 0, len(allServices))
-	for id := range allServices {
-		svcIds = append(svcIds, id)
-	}
-	sort.Strings(svcIds)
-
-	for _, svcId := range svcIds {
-		svc := allServices[svcId]
-		serviceDashboardsCreatedAt, ok := servicesWithAvailableMetrics[svcId]
-		if ok && serviceDashboardsCreatedAt != nil {
-			svcDashboards = append(
-				svcDashboards,
-				integrationtypes.GetDashboardsFromAssets(svc.GetId(), orgID, b.ProviderType, serviceDashboardsCreatedAt, svc.GetAssets())...,
-			)
-			servicesWithAvailableMetrics[svcId] = nil
-		}
-	}
-
-	return svcDashboards, nil
-}
-
-func (b *BaseCloudProvider[def, conf]) GetServiceConfig(
-	ctx context.Context,
-	definition def,
-	orgID valuer.UUID,
-	serviceId,
-	cloudAccountId string,
-) (conf, error) {
-	var zero conf
-
-	activeAccount, err := b.AccountsRepo.GetConnectedCloudAccount(ctx, orgID.String(), b.ProviderType.String(), cloudAccountId)
-	if err != nil {
-		return zero, err
-	}
-
-	config, err := b.ServiceConfigRepo.Get(ctx, orgID.String(), activeAccount.ID.StringValue(), serviceId)
-	if err != nil {
-		if errors.Ast(err, errors.TypeNotFound) {
-			return zero, nil
-		}
-
-		return zero, err
-	}
-
-	var serviceConfig conf
-	err = integrationtypes.UnmarshalJSON(config, &serviceConfig)
-	if err != nil {
-		return zero, err
-	}
-
-	if config != nil && serviceConfig.IsMetricsEnabled() {
-		definition.PopulateDashboardURLs(b.ProviderType, serviceId)
-	}
-
-	return serviceConfig, nil
-}
-
-func (b *BaseCloudProvider[def, conf]) UpdateServiceConfig(ctx context.Context, serviceId string, orgID valuer.UUID, config []byte) (any, error) {
-	definition, err := b.ServiceDefinitions.GetServiceDefinition(ctx, serviceId)
-	if err != nil {
-		return nil, err
-	}
-
-	var updateReq integrationtypes.UpdatableServiceConfig[conf]
-	err = integrationtypes.UnmarshalJSON(config, &updateReq)
-	if err != nil {
-		return nil, err
-	}
-
-	// Check if config is provided (use any type assertion for nil check with generics)
-	if any(updateReq.Config) == nil {
-		return nil, errors.NewInvalidInputf(errors.CodeInvalidInput, "config is required")
-	}
-
-	if err = updateReq.Config.Validate(definition); err != nil {
-		return nil, err
-	}
-
-	// can only update config for a connected cloud account id
-	_, err = b.AccountsRepo.GetConnectedCloudAccount(
-		ctx, orgID.String(), b.GetName().String(), updateReq.CloudAccountId,
-	)
-	if err != nil {
-		return nil, err
-	}
-
-	serviceConfigBytes, err := integrationtypes.MarshalJSON(&updateReq.Config)
-	if err != nil {
-		return nil, err
-	}
-
-	updatedConfigBytes, err := b.ServiceConfigRepo.Upsert(
-		ctx, orgID.String(), b.GetName().String(), updateReq.CloudAccountId, serviceId, serviceConfigBytes,
-	)
-	if err != nil {
-		return nil, err
-	}
-
-	var updatedConfig conf
-	err = integrationtypes.UnmarshalJSON(updatedConfigBytes, &updatedConfig)
-	if err != nil {
-		return nil, err
-	}
-
-	return &integrationtypes.UpdatableServiceConfigRes{
-		ServiceId: serviceId,
-		Config:    updatedConfig,
-	}, nil
-}

pkg/query-service/app/cloudintegrations/constants.go

@@ -0,0 +1,43 @@
+package cloudintegrations
+
+import (
+	"github.com/SigNoz/signoz/pkg/errors"
+)
+
+var (
+	CodeInvalidCloudRegion    = errors.MustNewCode("invalid_cloud_region")
+	CodeMismatchCloudProvider = errors.MustNewCode("cloud_provider_mismatch")
+)
+
+// List of all valid cloud regions on Amazon Web Services
+var ValidAWSRegions = map[string]bool{
+	"af-south-1":     true, // Africa (Cape Town).
+	"ap-east-1":      true, // Asia Pacific (Hong Kong).
+	"ap-northeast-1": true, // Asia Pacific (Tokyo).
+	"ap-northeast-2": true, // Asia Pacific (Seoul).
+	"ap-northeast-3": true, // Asia Pacific (Osaka).
+	"ap-south-1":     true, // Asia Pacific (Mumbai).
+	"ap-south-2":     true, // Asia Pacific (Hyderabad).
+	"ap-southeast-1": true, // Asia Pacific (Singapore).
+	"ap-southeast-2": true, // Asia Pacific (Sydney).
+	"ap-southeast-3": true, // Asia Pacific (Jakarta).
+	"ap-southeast-4": true, // Asia Pacific (Melbourne).
+	"ca-central-1":   true, // Canada (Central).
+	"ca-west-1":      true, // Canada West (Calgary).
+	"eu-central-1":   true, // Europe (Frankfurt).
+	"eu-central-2":   true, // Europe (Zurich).
+	"eu-north-1":     true, // Europe (Stockholm).
+	"eu-south-1":     true, // Europe (Milan).
+	"eu-south-2":     true, // Europe (Spain).
+	"eu-west-1":      true, // Europe (Ireland).
+	"eu-west-2":      true, // Europe (London).
+	"eu-west-3":      true, // Europe (Paris).
+	"il-central-1":   true, // Israel (Tel Aviv).
+	"me-central-1":   true, // Middle East (UAE).
+	"me-south-1":     true, // Middle East (Bahrain).
+	"sa-east-1":      true, // South America (Sao Paulo).
+	"us-east-1":      true, // US East (N. Virginia).
+	"us-east-2":      true, // US East (Ohio).
+	"us-west-1":      true, // US West (N. California).
+	"us-west-2":      true, // US West (Oregon).
+}

pkg/query-service/app/cloudintegrations/controller.go

@@ -0,0 +1,624 @@
+package cloudintegrations
+
+import (
+	"context"
+	"fmt"
+	"net/url"
+	"slices"
+	"strings"
+	"time"
+
+	"github.com/SigNoz/signoz/pkg/errors"
+	"github.com/SigNoz/signoz/pkg/query-service/app/cloudintegrations/services"
+	"github.com/SigNoz/signoz/pkg/query-service/model"
+	"github.com/SigNoz/signoz/pkg/sqlstore"
+	"github.com/SigNoz/signoz/pkg/types"
+	"github.com/SigNoz/signoz/pkg/types/dashboardtypes"
+	"github.com/SigNoz/signoz/pkg/valuer"
+	"golang.org/x/exp/maps"
+)
+
+var SupportedCloudProviders = []string{
+	"aws",
+}
+
+func validateCloudProviderName(name string) *model.ApiError {
+	if !slices.Contains(SupportedCloudProviders, name) {
+		return model.BadRequest(fmt.Errorf("invalid cloud provider: %s", name))
+	}
+	return nil
+}
+
+type Controller struct {
+	accountsRepo      cloudProviderAccountsRepository
+	serviceConfigRepo ServiceConfigDatabase
+}
+
+func NewController(sqlStore sqlstore.SQLStore) (*Controller, error) {
+	accountsRepo, err := newCloudProviderAccountsRepository(sqlStore)
+	if err != nil {
+		return nil, fmt.Errorf("couldn't create cloud provider accounts repo: %w", err)
+	}
+
+	serviceConfigRepo, err := newServiceConfigRepository(sqlStore)
+	if err != nil {
+		return nil, fmt.Errorf("couldn't create cloud provider service config repo: %w", err)
+	}
+
+	return &Controller{
+		accountsRepo:      accountsRepo,
+		serviceConfigRepo: serviceConfigRepo,
+	}, nil
+}
+
+type ConnectedAccountsListResponse struct {
+	Accounts []types.Account `json:"accounts"`
+}
+
+func (c *Controller) ListConnectedAccounts(ctx context.Context, orgId string, cloudProvider string) (
+	*ConnectedAccountsListResponse, *model.ApiError,
+) {
+	if apiErr := validateCloudProviderName(cloudProvider); apiErr != nil {
+		return nil, apiErr
+	}
+
+	accountRecords, apiErr := c.accountsRepo.listConnected(ctx, orgId, cloudProvider)
+	if apiErr != nil {
+		return nil, model.WrapApiError(apiErr, "couldn't list cloud accounts")
+	}
+
+	connectedAccounts := []types.Account{}
+	for _, a := range accountRecords {
+		connectedAccounts = append(connectedAccounts, a.Account())
+	}
+
+	return &ConnectedAccountsListResponse{
+		Accounts: connectedAccounts,
+	}, nil
+}
+
+type GenerateConnectionUrlRequest struct {
+	// Optional. To be specified for updates.
+	AccountId *string `json:"account_id,omitempty"`
+
+	AccountConfig types.AccountConfig `json:"account_config"`
+
+	AgentConfig SigNozAgentConfig `json:"agent_config"`
+}
+
+type SigNozAgentConfig struct {
+	// The region in which SigNoz agent should be installed.
+	Region string `json:"region"`
+
+	IngestionUrl string `json:"ingestion_url"`
+	IngestionKey string `json:"ingestion_key"`
+	SigNozAPIUrl string `json:"signoz_api_url"`
+	SigNozAPIKey string `json:"signoz_api_key"`
+
+	Version string `json:"version,omitempty"`
+}
+
+type GenerateConnectionUrlResponse struct {
+	AccountId     string `json:"account_id"`
+	ConnectionUrl string `json:"connection_url"`
+}
+
+func (c *Controller) GenerateConnectionUrl(ctx context.Context, orgId string, cloudProvider string, req GenerateConnectionUrlRequest) (*GenerateConnectionUrlResponse, *model.ApiError) {
+	// Account connection with a simple connection URL may not be available for all providers.
+	if cloudProvider != "aws" {
+		return nil, model.BadRequest(fmt.Errorf("unsupported cloud provider: %s", cloudProvider))
+	}
+
+	account, apiErr := c.accountsRepo.upsert(
+		ctx, orgId, cloudProvider, req.AccountId, &req.AccountConfig, nil, nil, nil,
+	)
+	if apiErr != nil {
+		return nil, model.WrapApiError(apiErr, "couldn't upsert cloud account")
+	}
+
+	agentVersion := "v0.0.8"
+	if req.AgentConfig.Version != "" {
+		agentVersion = req.AgentConfig.Version
+	}
+
+	connectionUrl := fmt.Sprintf(
+		"https://%s.console.aws.amazon.com/cloudformation/home?region=%s#/stacks/quickcreate?",
+		req.AgentConfig.Region, req.AgentConfig.Region,
+	)
+
+	for qp, value := range map[string]string{
+		"param_SigNozIntegrationAgentVersion": agentVersion,
+		"param_SigNozApiUrl":                  req.AgentConfig.SigNozAPIUrl,
+		"param_SigNozApiKey":                  req.AgentConfig.SigNozAPIKey,
+		"param_SigNozAccountId":               account.ID.StringValue(),
+		"param_IngestionUrl":                  req.AgentConfig.IngestionUrl,
+		"param_IngestionKey":                  req.AgentConfig.IngestionKey,
+		"stackName":                           "signoz-integration",
+		"templateURL": fmt.Sprintf(
+			"https://signoz-integrations.s3.us-east-1.amazonaws.com/aws-quickcreate-template-%s.json",
+			agentVersion,
+		),
+	} {
+		connectionUrl += fmt.Sprintf("&%s=%s", qp, url.QueryEscape(value))
+	}
+
+	return &GenerateConnectionUrlResponse{
+		AccountId:     account.ID.StringValue(),
+		ConnectionUrl: connectionUrl,
+	}, nil
+}
+
+type AccountStatusResponse struct {
+	Id             string              `json:"id"`
+	CloudAccountId *string             `json:"cloud_account_id,omitempty"`
+	Status         types.AccountStatus `json:"status"`
+}
+
+func (c *Controller) GetAccountStatus(ctx context.Context, orgId string, cloudProvider string, accountId string) (
+	*AccountStatusResponse, *model.ApiError,
+) {
+	if apiErr := validateCloudProviderName(cloudProvider); apiErr != nil {
+		return nil, apiErr
+	}
+
+	account, apiErr := c.accountsRepo.get(ctx, orgId, cloudProvider, accountId)
+	if apiErr != nil {
+		return nil, apiErr
+	}
+
+	resp := AccountStatusResponse{
+		Id:             account.ID.StringValue(),
+		CloudAccountId: account.AccountID,
+		Status:         account.Status(),
+	}
+
+	return &resp, nil
+}
+
+type AgentCheckInRequest struct {
+	ID        string `json:"account_id"`
+	AccountID string `json:"cloud_account_id"`
+	// Arbitrary cloud specific Agent data
+	Data map[string]any `json:"data,omitempty"`
+}
+
+type AgentCheckInResponse struct {
+	AccountId      string     `json:"account_id"`
+	CloudAccountId string     `json:"cloud_account_id"`
+	RemovedAt      *time.Time `json:"removed_at"`
+
+	IntegrationConfig IntegrationConfigForAgent `json:"integration_config"`
+}
+
+type IntegrationConfigForAgent struct {
+	EnabledRegions []string `json:"enabled_regions"`
+
+	TelemetryCollectionStrategy *CompiledCollectionStrategy `json:"telemetry,omitempty"`
+}
+
+func (c *Controller) CheckInAsAgent(ctx context.Context, orgId string, cloudProvider string, req AgentCheckInRequest) (*AgentCheckInResponse, error) {
+	if apiErr := validateCloudProviderName(cloudProvider); apiErr != nil {
+		return nil, apiErr
+	}
+
+	existingAccount, apiErr := c.accountsRepo.get(ctx, orgId, cloudProvider, req.ID)
+	if existingAccount != nil && existingAccount.AccountID != nil && *existingAccount.AccountID != req.AccountID {
+		return nil, model.BadRequest(fmt.Errorf(
+			"can't check in with new %s account id %s for account %s with existing %s id %s",
+			cloudProvider, req.AccountID, existingAccount.ID.StringValue(), cloudProvider, *existingAccount.AccountID,
+		))
+	}
+
+	existingAccount, apiErr = c.accountsRepo.getConnectedCloudAccount(ctx, orgId, cloudProvider, req.AccountID)
+	if existingAccount != nil && existingAccount.ID.StringValue() != req.ID {
+		return nil, model.BadRequest(fmt.Errorf(
+			"can't check in to %s account %s with id %s. already connected with id %s",
+			cloudProvider, req.AccountID, req.ID, existingAccount.ID.StringValue(),
+		))
+	}
+
+	agentReport := types.AgentReport{
+		TimestampMillis: time.Now().UnixMilli(),
+		Data:            req.Data,
+	}
+
+	account, apiErr := c.accountsRepo.upsert(
+		ctx, orgId, cloudProvider, &req.ID, nil, &req.AccountID, &agentReport, nil,
+	)
+	if apiErr != nil {
+		return nil, model.WrapApiError(apiErr, "couldn't upsert cloud account")
+	}
+
+	// prepare and return integration config to be consumed by agent
+	compiledStrategy, err := NewCompiledCollectionStrategy(cloudProvider)
+	if err != nil {
+		return nil, model.InternalError(fmt.Errorf(
+			"couldn't init telemetry collection strategy: %w", err,
+		))
+	}
+
+	agentConfig := IntegrationConfigForAgent{
+		EnabledRegions:              []string{},
+		TelemetryCollectionStrategy: compiledStrategy,
+	}
+
+	if account.Config != nil && account.Config.EnabledRegions != nil {
+		agentConfig.EnabledRegions = account.Config.EnabledRegions
+	}
+
+	services, err := services.Map(cloudProvider)
+	if err != nil {
+		return nil, err
+	}
+
+	svcConfigs, apiErr := c.serviceConfigRepo.getAllForAccount(
+		ctx, orgId, account.ID.StringValue(),
+	)
+	if apiErr != nil {
+		return nil, model.WrapApiError(
+			apiErr, "couldn't get service configs for cloud account",
+		)
+	}
+
+	// accumulate config in a fixed order to ensure same config generated across runs
+	configuredServices := maps.Keys(svcConfigs)
+	slices.Sort(configuredServices)
+
+	for _, svcType := range configuredServices {
+		definition, ok := services[svcType]
+		if !ok {
+			continue
+		}
+		config := svcConfigs[svcType]
+
+		err := AddServiceStrategy(svcType, compiledStrategy, definition.Strategy, config)
+		if err != nil {
+			return nil, err
+		}
+	}
+
+	return &AgentCheckInResponse{
+		AccountId:         account.ID.StringValue(),
+		CloudAccountId:    *account.AccountID,
+		RemovedAt:         account.RemovedAt,
+		IntegrationConfig: agentConfig,
+	}, nil
+}
+
+type UpdateAccountConfigRequest struct {
+	Config types.AccountConfig `json:"config"`
+}
+
+func (c *Controller) UpdateAccountConfig(ctx context.Context, orgId string, cloudProvider string, accountId string, req UpdateAccountConfigRequest) (*types.Account, *model.ApiError) {
+	if apiErr := validateCloudProviderName(cloudProvider); apiErr != nil {
+		return nil, apiErr
+	}
+
+	accountRecord, apiErr := c.accountsRepo.upsert(
+		ctx, orgId, cloudProvider, &accountId, &req.Config, nil, nil, nil,
+	)
+	if apiErr != nil {
+		return nil, model.WrapApiError(apiErr, "couldn't upsert cloud account")
+	}
+
+	account := accountRecord.Account()
+
+	return &account, nil
+}
+
+func (c *Controller) DisconnectAccount(ctx context.Context, orgId string, cloudProvider string, accountId string) (*types.CloudIntegration, *model.ApiError) {
+	if apiErr := validateCloudProviderName(cloudProvider); apiErr != nil {
+		return nil, apiErr
+	}
+
+	account, apiErr := c.accountsRepo.get(ctx, orgId, cloudProvider, accountId)
+	if apiErr != nil {
+		return nil, model.WrapApiError(apiErr, "couldn't disconnect account")
+	}
+
+	tsNow := time.Now()
+	account, apiErr = c.accountsRepo.upsert(
+		ctx, orgId, cloudProvider, &accountId, nil, nil, nil, &tsNow,
+	)
+	if apiErr != nil {
+		return nil, model.WrapApiError(apiErr, "couldn't disconnect account")
+	}
+
+	return account, nil
+}
+
+type ListServicesResponse struct {
+	Services []ServiceSummary `json:"services"`
+}
+
+func (c *Controller) ListServices(
+	ctx context.Context,
+	orgID string,
+	cloudProvider string,
+	cloudAccountId *string,
+) (*ListServicesResponse, *model.ApiError) {
+	if apiErr := validateCloudProviderName(cloudProvider); apiErr != nil {
+		return nil, apiErr
+	}
+
+	definitions, apiErr := services.List(cloudProvider)
+	if apiErr != nil {
+		return nil, model.WrapApiError(apiErr, "couldn't list cloud services")
+	}
+
+	svcConfigs := map[string]*types.CloudServiceConfig{}
+	if cloudAccountId != nil {
+		activeAccount, apiErr := c.accountsRepo.getConnectedCloudAccount(
+			ctx, orgID, cloudProvider, *cloudAccountId,
+		)
+		if apiErr != nil {
+			return nil, model.WrapApiError(apiErr, "couldn't get active account")
+		}
+		svcConfigs, apiErr = c.serviceConfigRepo.getAllForAccount(
+			ctx, orgID, activeAccount.ID.StringValue(),
+		)
+		if apiErr != nil {
+			return nil, model.WrapApiError(
+				apiErr, "couldn't get service configs for cloud account",
+			)
+		}
+	}
+
+	summaries := []ServiceSummary{}
+	for _, def := range definitions {
+		summary := ServiceSummary{
+			Metadata: def.Metadata,
+		}
+		summary.Config = svcConfigs[summary.Id]
+
+		summaries = append(summaries, summary)
+	}
+
+	return &ListServicesResponse{
+		Services: summaries,
+	}, nil
+}
+
+func (c *Controller) GetServiceDetails(
+	ctx context.Context,
+	orgID string,
+	cloudProvider string,
+	serviceId string,
+	cloudAccountId *string,
+) (*ServiceDetails, error) {
+	if apiErr := validateCloudProviderName(cloudProvider); apiErr != nil {
+		return nil, apiErr
+	}
+
+	definition, err := services.GetServiceDefinition(cloudProvider, serviceId)
+	if err != nil {
+		return nil, err
+	}
+
+	details := ServiceDetails{
+		Definition: *definition,
+	}
+
+	if cloudAccountId != nil {
+
+		activeAccount, apiErr := c.accountsRepo.getConnectedCloudAccount(
+			ctx, orgID, cloudProvider, *cloudAccountId,
+		)
+		if apiErr != nil {
+			return nil, model.WrapApiError(apiErr, "couldn't get active account")
+		}
+
+		config, apiErr := c.serviceConfigRepo.get(
+			ctx, orgID, activeAccount.ID.StringValue(), serviceId,
+		)
+		if apiErr != nil && apiErr.Type() != model.ErrorNotFound {
+			return nil, model.WrapApiError(apiErr, "couldn't fetch service config")
+		}
+
+		if config != nil {
+			details.Config = config
+
+			enabled := false
+			if config.Metrics != nil && config.Metrics.Enabled {
+				enabled = true
+			}
+
+			// add links to service dashboards, making them clickable.
+			for i, d := range definition.Assets.Dashboards {
+				dashboardUuid := c.dashboardUuid(
+					cloudProvider, serviceId, d.Id,
+				)
+				if enabled {
+					definition.Assets.Dashboards[i].Url = fmt.Sprintf("/dashboard/%s", dashboardUuid)
+				} else {
+					definition.Assets.Dashboards[i].Url = "" // to unset the in-memory URL if enabled once and disabled afterwards
+				}
+			}
+		}
+	}
+
+	return &details, nil
+}
+
+type UpdateServiceConfigRequest struct {
+	CloudAccountId string                   `json:"cloud_account_id"`
+	Config         types.CloudServiceConfig `json:"config"`
+}
+
+func (u *UpdateServiceConfigRequest) Validate(def *services.Definition) error {
+	if def.Id != services.S3Sync && u.Config.Logs != nil && u.Config.Logs.S3Buckets != nil {
+		return errors.NewInvalidInputf(errors.CodeInvalidInput, "s3 buckets can only be added to service-type[%s]", services.S3Sync)
+	} else if def.Id == services.S3Sync && u.Config.Logs != nil && u.Config.Logs.S3Buckets != nil {
+		for region := range u.Config.Logs.S3Buckets {
+			if _, found := ValidAWSRegions[region]; !found {
+				return errors.NewInvalidInputf(CodeInvalidCloudRegion, "invalid cloud region: %s", region)
+			}
+		}
+	}
+
+	return nil
+}
+
+type UpdateServiceConfigResponse struct {
+	Id     string                   `json:"id"`
+	Config types.CloudServiceConfig `json:"config"`
+}
+
+func (c *Controller) UpdateServiceConfig(
+	ctx context.Context,
+	orgID string,
+	cloudProvider string,
+	serviceType string,
+	req *UpdateServiceConfigRequest,
+) (*UpdateServiceConfigResponse, error) {
+	if apiErr := validateCloudProviderName(cloudProvider); apiErr != nil {
+		return nil, apiErr
+	}
+
+	// can only update config for a valid service.
+	definition, err := services.GetServiceDefinition(cloudProvider, serviceType)
+	if err != nil {
+		return nil, err
+	}
+
+	if err := req.Validate(definition); err != nil {
+		return nil, err
+	}
+
+	// can only update config for a connected cloud account id
+	_, apiErr := c.accountsRepo.getConnectedCloudAccount(
+		ctx, orgID, cloudProvider, req.CloudAccountId,
+	)
+	if apiErr != nil {
+		return nil, model.WrapApiError(apiErr, "couldn't find connected cloud account")
+	}
+
+	updatedConfig, apiErr := c.serviceConfigRepo.upsert(
+		ctx, orgID, cloudProvider, req.CloudAccountId, serviceType, req.Config,
+	)
+	if apiErr != nil {
+		return nil, model.WrapApiError(apiErr, "couldn't update service config")
+	}
+
+	return &UpdateServiceConfigResponse{
+		Id:     serviceType,
+		Config: *updatedConfig,
+	}, nil
+}
+
+// All dashboards that are available based on cloud integrations configuration
+// across all cloud providers
+func (c *Controller) AvailableDashboards(ctx context.Context, orgId valuer.UUID) ([]*dashboardtypes.Dashboard, *model.ApiError) {
+	allDashboards := []*dashboardtypes.Dashboard{}
+
+	for _, provider := range []string{"aws"} {
+		providerDashboards, apiErr := c.AvailableDashboardsForCloudProvider(ctx, orgId, provider)
+		if apiErr != nil {
+			return nil, model.WrapApiError(
+				apiErr, fmt.Sprintf("couldn't get available dashboards for %s", provider),
+			)
+		}
+
+		allDashboards = append(allDashboards, providerDashboards...)
+	}
+
+	return allDashboards, nil
+}
+
+func (c *Controller) AvailableDashboardsForCloudProvider(ctx context.Context, orgID valuer.UUID, cloudProvider string) ([]*dashboardtypes.Dashboard, *model.ApiError) {
+	accountRecords, apiErr := c.accountsRepo.listConnected(ctx, orgID.StringValue(), cloudProvider)
+	if apiErr != nil {
+		return nil, model.WrapApiError(apiErr, "couldn't list connected cloud accounts")
+	}
+
+	// for v0, service dashboards are only available when metrics are enabled.
+	servicesWithAvailableMetrics := map[string]*time.Time{}
+
+	for _, ar := range accountRecords {
+		if ar.AccountID != nil {
+			configsBySvcId, apiErr := c.serviceConfigRepo.getAllForAccount(
+				ctx, orgID.StringValue(), ar.ID.StringValue(),
+			)
+			if apiErr != nil {
+				return nil, apiErr
+			}
+
+			for svcId, config := range configsBySvcId {
+				if config.Metrics != nil && config.Metrics.Enabled {
+					servicesWithAvailableMetrics[svcId] = &ar.CreatedAt
+				}
+			}
+		}
+	}
+
+	allServices, apiErr := services.List(cloudProvider)
+	if apiErr != nil {
+		return nil, apiErr
+	}
+
+	svcDashboards := []*dashboardtypes.Dashboard{}
+	for _, svc := range allServices {
+		serviceDashboardsCreatedAt := servicesWithAvailableMetrics[svc.Id]
+		if serviceDashboardsCreatedAt != nil {
+			for _, d := range svc.Assets.Dashboards {
+				author := fmt.Sprintf("%s-integration", cloudProvider)
+				svcDashboards = append(svcDashboards, &dashboardtypes.Dashboard{
+					ID:     c.dashboardUuid(cloudProvider, svc.Id, d.Id),
+					Locked: true,
+					Data:   *d.Definition,
+					TimeAuditable: types.TimeAuditable{
+						CreatedAt: *serviceDashboardsCreatedAt,
+						UpdatedAt: *serviceDashboardsCreatedAt,
+					},
+					UserAuditable: types.UserAuditable{
+						CreatedBy: author,
+						UpdatedBy: author,
+					},
+					OrgID: orgID,
+				})
+			}
+			servicesWithAvailableMetrics[svc.Id] = nil
+		}
+	}
+
+	return svcDashboards, nil
+}
+func (c *Controller) GetDashboardById(ctx context.Context, orgId valuer.UUID, dashboardUuid string) (*dashboardtypes.Dashboard, *model.ApiError) {
+	cloudProvider, _, _, apiErr := c.parseDashboardUuid(dashboardUuid)
+	if apiErr != nil {
+		return nil, apiErr
+	}
+
+	allDashboards, apiErr := c.AvailableDashboardsForCloudProvider(ctx, orgId, cloudProvider)
+	if apiErr != nil {
+		return nil, model.WrapApiError(apiErr, "couldn't list available dashboards")
+	}
+
+	for _, d := range allDashboards {
+		if d.ID == dashboardUuid {
+			return d, nil
+		}
+	}
+
+	return nil, model.NotFoundError(fmt.Errorf("couldn't find dashboard with uuid: %s", dashboardUuid))
+}
+
+func (c *Controller) dashboardUuid(
+	cloudProvider string, svcId string, dashboardId string,
+) string {
+	return fmt.Sprintf("cloud-integration--%s--%s--%s", cloudProvider, svcId, dashboardId)
+}
+
+func (c *Controller) parseDashboardUuid(dashboardUuid string) (cloudProvider string, svcId string, dashboardId string, apiErr *model.ApiError) {
+	parts := strings.SplitN(dashboardUuid, "--", 4)
+	if len(parts) != 4 || parts[0] != "cloud-integration" {
+		return "", "", "", model.BadRequest(fmt.Errorf("invalid cloud integration dashboard id"))
+	}
+
+	return parts[1], parts[2], parts[3], nil
+}
+
+func (c *Controller) IsCloudIntegrationDashboardUuid(dashboardUuid string) bool {
+	_, _, _, apiErr := c.parseDashboardUuid(dashboardUuid)
+	return apiErr == nil
+}

pkg/query-service/app/cloudintegrations/implawsprovider/awsprovider.go

@@ -1,331 +0,0 @@
-package implawsprovider
-
-import (
-	"context"
-	"fmt"
-	"log/slog"
-	"net/url"
-	"slices"
-
-	"golang.org/x/exp/maps"
-
-	"github.com/SigNoz/signoz/pkg/errors"
-	"github.com/SigNoz/signoz/pkg/querier"
-	"github.com/SigNoz/signoz/pkg/query-service/app/cloudintegrations/baseprovider"
-	"github.com/SigNoz/signoz/pkg/query-service/app/cloudintegrations/services"
-	integrationstore "github.com/SigNoz/signoz/pkg/query-service/app/cloudintegrations/store"
-	"github.com/SigNoz/signoz/pkg/types/integrationtypes"
-	"github.com/SigNoz/signoz/pkg/valuer"
-)
-
-var (
-	CodeInvalidAWSRegion = errors.MustNewCode("invalid_aws_region")
-)
-
-type awsProvider struct {
-	baseprovider.BaseCloudProvider[*integrationtypes.AWSDefinition, *integrationtypes.AWSServiceConfig]
-}
-
-func NewAWSCloudProvider(
-	logger *slog.Logger,
-	accountsRepo integrationstore.CloudProviderAccountsRepository,
-	serviceConfigRepo integrationstore.ServiceConfigDatabase,
-	querier querier.Querier,
-) (integrationtypes.CloudProvider, error) {
-	serviceDefinitions, err := services.NewAWSCloudProviderServices()
-	if err != nil {
-		return nil, err
-	}
-
-	return &awsProvider{
-		BaseCloudProvider: baseprovider.BaseCloudProvider[*integrationtypes.AWSDefinition, *integrationtypes.AWSServiceConfig]{
-			Logger:             logger,
-			Querier:            querier,
-			AccountsRepo:       accountsRepo,
-			ServiceConfigRepo:  serviceConfigRepo,
-			ServiceDefinitions: serviceDefinitions,
-			ProviderType:       integrationtypes.CloudProviderAWS,
-		},
-	}, nil
-}
-
-func (a *awsProvider) AgentCheckIn(ctx context.Context, req *integrationtypes.PostableAgentCheckInPayload) (any, error) {
-	return baseprovider.AgentCheckIn(
-		&a.BaseCloudProvider,
-		ctx,
-		req,
-		a.getAWSAgentConfig,
-	)
-}
-
-func (a *awsProvider) getAWSAgentConfig(ctx context.Context, account *integrationtypes.CloudIntegration) (*integrationtypes.AWSAgentIntegrationConfig, error) {
-	// prepare and return integration config to be consumed by agent
-	agentConfig := &integrationtypes.AWSAgentIntegrationConfig{
-		EnabledRegions: []string{},
-		TelemetryCollectionStrategy: &integrationtypes.AWSCollectionStrategy{
-			Metrics:   &integrationtypes.AWSMetricsStrategy{},
-			Logs:      &integrationtypes.AWSLogsStrategy{},
-			S3Buckets: map[string][]string{},
-		},
-	}
-
-	accountConfig := new(integrationtypes.AWSAccountConfig)
-	err := integrationtypes.UnmarshalJSON([]byte(account.Config), accountConfig)
-	if err != nil {
-		return nil, err
-	}
-
-	if accountConfig.EnabledRegions != nil {
-		agentConfig.EnabledRegions = accountConfig.EnabledRegions
-	}
-
-	svcConfigs, err := a.ServiceConfigRepo.GetAllForAccount(
-		ctx, account.OrgID, account.ID.StringValue(),
-	)
-	if err != nil {
-		return nil, err
-	}
-
-	// accumulate config in a fixed order to ensure same config generated across runs
-	configuredServices := maps.Keys(svcConfigs)
-	slices.Sort(configuredServices)
-
-	for _, svcType := range configuredServices {
-		definition, err := a.ServiceDefinitions.GetServiceDefinition(ctx, svcType)
-		if err != nil {
-			continue
-		}
-		config := svcConfigs[svcType]
-
-		serviceConfig := new(integrationtypes.AWSServiceConfig)
-		err = integrationtypes.UnmarshalJSON(config, serviceConfig)
-		if err != nil {
-			continue
-		}
-
-		if serviceConfig.IsLogsEnabled() {
-			if svcType == integrationtypes.S3Sync {
-				// S3 bucket sync; No cloudwatch logs are appended for this service type;
-				// Though definition is populated with a custom cloudwatch group that helps in calculating logs connection status
-				agentConfig.TelemetryCollectionStrategy.S3Buckets = serviceConfig.Logs.S3Buckets
-			} else if definition.Strategy.Logs != nil { // services that includes a logs subscription
-				agentConfig.TelemetryCollectionStrategy.Logs.Subscriptions = append(
-					agentConfig.TelemetryCollectionStrategy.Logs.Subscriptions,
-					definition.Strategy.Logs.Subscriptions...,
-				)
-			}
-		}
-
-		if serviceConfig.IsMetricsEnabled() && definition.Strategy.Metrics != nil {
-			agentConfig.TelemetryCollectionStrategy.Metrics.StreamFilters = append(
-				agentConfig.TelemetryCollectionStrategy.Metrics.StreamFilters,
-				definition.Strategy.Metrics.StreamFilters...,
-			)
-		}
-	}
-
-	return agentConfig, nil
-}
-
-func (a *awsProvider) ListServices(ctx context.Context, orgID string, cloudAccountID *string) (any, error) {
-	svcConfigs := make(map[string]*integrationtypes.AWSServiceConfig)
-	if cloudAccountID != nil {
-		activeAccount, err := a.AccountsRepo.GetConnectedCloudAccount(ctx, orgID, a.GetName().String(), *cloudAccountID)
-		if err != nil {
-			return nil, err
-		}
-
-		serviceConfigs, err := a.ServiceConfigRepo.GetAllForAccount(ctx, orgID, activeAccount.ID.String())
-		if err != nil {
-			return nil, err
-		}
-
-		for svcType, config := range serviceConfigs {
-			serviceConfig := new(integrationtypes.AWSServiceConfig)
-			err = integrationtypes.UnmarshalJSON(config, serviceConfig)
-			if err != nil {
-				return nil, err
-			}
-			svcConfigs[svcType] = serviceConfig
-		}
-	}
-
-	summaries := make([]integrationtypes.AWSServiceSummary, 0)
-
-	definitions, err := a.ServiceDefinitions.ListServiceDefinitions(ctx)
-	if err != nil {
-		return nil, err
-	}
-
-	for _, def := range definitions {
-		summary := integrationtypes.AWSServiceSummary{
-			DefinitionMetadata: def.DefinitionMetadata,
-			Config:             nil,
-		}
-
-		summary.Config = svcConfigs[summary.Id]
-
-		summaries = append(summaries, summary)
-	}
-
-	slices.SortFunc(summaries, func(a, b integrationtypes.AWSServiceSummary) int {
-		if a.DefinitionMetadata.Title < b.DefinitionMetadata.Title {
-			return -1
-		}
-		if a.DefinitionMetadata.Title > b.DefinitionMetadata.Title {
-			return 1
-		}
-		return 0
-	})
-
-	return &integrationtypes.GettableAWSServices{
-		Services: summaries,
-	}, nil
-}
-
-func (a *awsProvider) GetServiceDetails(ctx context.Context, req *integrationtypes.GetServiceDetailsReq) (any, error) {
-	details := new(integrationtypes.GettableAWSServiceDetails)
-
-	awsDefinition, err := a.ServiceDefinitions.GetServiceDefinition(ctx, req.ServiceId)
-	if err != nil {
-		return nil, err
-	}
-
-	details.Definition = *awsDefinition
-	if req.CloudAccountID == nil {
-		return details, nil
-	}
-
-	config, err := a.GetServiceConfig(ctx, awsDefinition, req.OrgID, req.ServiceId, *req.CloudAccountID)
-	if err != nil {
-		return nil, err
-	}
-
-	if config == nil {
-		return details, nil
-	}
-
-	details.Config = config
-
-	isMetricsEnabled := config.IsMetricsEnabled()
-	isLogsEnabled := config.IsLogsEnabled()
-
-	connectionStatus, err := a.GetServiceConnectionStatus(
-		ctx,
-		*req.CloudAccountID,
-		req.OrgID,
-		awsDefinition,
-		isMetricsEnabled,
-		isLogsEnabled,
-	)
-	if err != nil {
-		return nil, err
-	}
-
-	details.ConnectionStatus = connectionStatus
-
-	return details, nil
-}
-
-func (a *awsProvider) GenerateConnectionArtifact(ctx context.Context, req *integrationtypes.PostableConnectionArtifact) (any, error) {
-	connection := new(integrationtypes.PostableAWSConnectionUrl)
-
-	err := integrationtypes.UnmarshalJSON(req.Data, connection)
-	if err != nil {
-		return nil, err
-	}
-
-	if connection.AccountConfig != nil {
-		for _, region := range connection.AccountConfig.EnabledRegions {
-			if integrationtypes.ValidAWSRegions[region] {
-				continue
-			}
-
-			return nil, errors.NewInvalidInputf(CodeInvalidAWSRegion, "invalid aws region: %s", region)
-		}
-	}
-
-	config, err := integrationtypes.MarshalJSON(connection.AccountConfig)
-	if err != nil {
-		return nil, err
-	}
-
-	account, err := a.AccountsRepo.Upsert(
-		ctx, req.OrgID, integrationtypes.CloudProviderAWS.String(), nil, config,
-		nil, nil, nil,
-	)
-	if err != nil {
-		return nil, err
-	}
-
-	agentVersion := "v0.0.8"
-	if connection.AgentConfig.Version != "" {
-		agentVersion = connection.AgentConfig.Version
-	}
-
-	baseURL := fmt.Sprintf("https://%s.console.aws.amazon.com/cloudformation/home",
-		connection.AgentConfig.Region)
-	u, _ := url.Parse(baseURL)
-
-	q := u.Query()
-	q.Set("region", connection.AgentConfig.Region)
-	u.Fragment = "/stacks/quickcreate"
-
-	u.RawQuery = q.Encode()
-
-	q = u.Query()
-	q.Set("stackName", "signoz-integration")
-	q.Set("templateURL", fmt.Sprintf("https://signoz-integrations.s3.us-east-1.amazonaws.com/aws-quickcreate-template-%s.json", agentVersion))
-	q.Set("param_SigNozIntegrationAgentVersion", agentVersion)
-	q.Set("param_SigNozApiUrl", connection.AgentConfig.SigNozAPIUrl)
-	q.Set("param_SigNozApiKey", connection.AgentConfig.SigNozAPIKey)
-	q.Set("param_SigNozAccountId", account.ID.StringValue())
-	q.Set("param_IngestionUrl", connection.AgentConfig.IngestionUrl)
-	q.Set("param_IngestionKey", connection.AgentConfig.IngestionKey)
-
-	return &integrationtypes.GettableAWSConnectionUrl{
-		AccountId:     account.ID.StringValue(),
-		ConnectionUrl: u.String() + "?&" + q.Encode(), // this format is required by AWS
-	}, nil
-}
-
-func (a *awsProvider) UpdateAccountConfig(ctx context.Context, orgId valuer.UUID, accountId string, configBytes []byte) (any, error) {
-	config := new(integrationtypes.UpdatableAWSAccountConfig)
-
-	err := integrationtypes.UnmarshalJSON(configBytes, config)
-	if err != nil {
-		return nil, err
-	}
-
-	if config.Config == nil {
-		return nil, errors.NewInvalidInputf(errors.CodeInvalidInput, "account config can't be null")
-	}
-
-	for _, region := range config.Config.EnabledRegions {
-		if integrationtypes.ValidAWSRegions[region] {
-			continue
-		}
-
-		return nil, errors.NewInvalidInputf(CodeInvalidAWSRegion, "invalid aws region: %s", region)
-	}
-
-	// account must exist to update config, but it doesn't need to be connected
-	_, err = a.AccountsRepo.Get(ctx, orgId.String(), a.GetName().String(), accountId)
-	if err != nil {
-		return nil, err
-	}
-
-	configBytes, err = integrationtypes.MarshalJSON(config.Config)
-	if err != nil {
-		return nil, err
-	}
-
-	accountRecord, err := a.AccountsRepo.Upsert(
-		ctx, orgId.String(), a.GetName().String(), &accountId, configBytes, nil, nil, nil,
-	)
-	if err != nil {
-		return nil, err
-	}
-
-	return accountRecord.Account(a.GetName()), nil
-}

pkg/query-service/app/cloudintegrations/implazureprovider/azureprovider.go

@@ -1,368 +0,0 @@
-package implazureprovider
-
-import (
-	"context"
-	"fmt"
-	"log/slog"
-	"slices"
-	"strings"
-
-	"golang.org/x/exp/maps"
-
-	"github.com/SigNoz/signoz/pkg/errors"
-	"github.com/SigNoz/signoz/pkg/querier"
-	"github.com/SigNoz/signoz/pkg/query-service/app/cloudintegrations/baseprovider"
-	"github.com/SigNoz/signoz/pkg/query-service/app/cloudintegrations/services"
-	"github.com/SigNoz/signoz/pkg/query-service/app/cloudintegrations/store"
-	"github.com/SigNoz/signoz/pkg/types/integrationtypes"
-	"github.com/SigNoz/signoz/pkg/valuer"
-)
-
-var (
-	CodeInvalidAzureRegion = errors.MustNewCode("invalid_azure_region")
-)
-
-type azureProvider struct {
-	baseprovider.BaseCloudProvider[*integrationtypes.AzureDefinition, *integrationtypes.AzureServiceConfig]
-}
-
-func NewAzureCloudProvider(
-	logger *slog.Logger,
-	accountsRepo store.CloudProviderAccountsRepository,
-	serviceConfigRepo store.ServiceConfigDatabase,
-	querier querier.Querier,
-) (integrationtypes.CloudProvider, error) {
-	azureServiceDefinitions, err := services.NewAzureCloudProviderServices()
-	if err != nil {
-		return nil, err
-	}
-
-	return &azureProvider{
-		BaseCloudProvider: baseprovider.BaseCloudProvider[*integrationtypes.AzureDefinition, *integrationtypes.AzureServiceConfig]{
-			Logger:             logger,
-			Querier:            querier,
-			AccountsRepo:       accountsRepo,
-			ServiceConfigRepo:  serviceConfigRepo,
-			ServiceDefinitions: azureServiceDefinitions,
-			ProviderType:       integrationtypes.CloudProviderAzure,
-		},
-	}, nil
-}
-
-func (a *azureProvider) AgentCheckIn(ctx context.Context, req *integrationtypes.PostableAgentCheckInPayload) (any, error) {
-	return baseprovider.AgentCheckIn(
-		&a.BaseCloudProvider,
-		ctx,
-		req,
-		a.getAzureAgentConfig,
-	)
-}
-
-func (a *azureProvider) getAzureAgentConfig(ctx context.Context, account *integrationtypes.CloudIntegration) (*integrationtypes.AzureAgentIntegrationConfig, error) {
-	// prepare and return integration config to be consumed by agent
-	agentConfig := &integrationtypes.AzureAgentIntegrationConfig{
-		TelemetryCollectionStrategy: make(map[string]*integrationtypes.AzureCollectionStrategy),
-	}
-
-	accountConfig := new(integrationtypes.AzureAccountConfig)
-	err := integrationtypes.UnmarshalJSON([]byte(account.Config), accountConfig)
-	if err != nil {
-		return nil, err
-	}
-
-	if account.Config != "" {
-		agentConfig.DeploymentRegion = accountConfig.DeploymentRegion
-		agentConfig.EnabledResourceGroups = accountConfig.EnabledResourceGroups
-	}
-
-	svcConfigs, err := a.ServiceConfigRepo.GetAllForAccount(
-		ctx, account.OrgID, account.ID.StringValue(),
-	)
-	if err != nil {
-		return nil, err
-	}
-
-	// accumulate config in a fixed order to ensure same config generated across runs
-	configuredServices := maps.Keys(svcConfigs)
-	slices.Sort(configuredServices)
-
-	for _, svcType := range configuredServices {
-		definition, err := a.ServiceDefinitions.GetServiceDefinition(ctx, svcType)
-		if err != nil {
-			continue
-		}
-		config := svcConfigs[svcType]
-
-		serviceConfig := new(integrationtypes.AzureServiceConfig)
-		err = integrationtypes.UnmarshalJSON(config, serviceConfig)
-		if err != nil {
-			continue
-		}
-
-		metrics := make([]*integrationtypes.AzureMetricsStrategy, 0)
-		logs := make([]*integrationtypes.AzureLogsStrategy, 0)
-
-		metricsStrategyMap := make(map[string]*integrationtypes.AzureMetricsStrategy)
-		logsStrategyMap := make(map[string]*integrationtypes.AzureLogsStrategy)
-
-		if definition.Strategy != nil && definition.Strategy.Metrics != nil {
-			for _, metric := range definition.Strategy.Metrics {
-				metricsStrategyMap[metric.Name] = metric
-			}
-		}
-
-		if definition.Strategy != nil && definition.Strategy.Logs != nil {
-			for _, log := range definition.Strategy.Logs {
-				logsStrategyMap[log.Name] = log
-			}
-		}
-
-		if serviceConfig.Metrics != nil {
-			for _, metric := range serviceConfig.Metrics {
-				if metric.Enabled {
-					metrics = append(metrics, &integrationtypes.AzureMetricsStrategy{
-						CategoryType: metricsStrategyMap[metric.Name].CategoryType,
-						Name:         metric.Name,
-					})
-				}
-			}
-		}
-
-		if serviceConfig.Logs != nil {
-			for _, log := range serviceConfig.Logs {
-				if log.Enabled {
-					logs = append(logs, &integrationtypes.AzureLogsStrategy{
-						CategoryType: logsStrategyMap[log.Name].CategoryType,
-						Name:         log.Name,
-					})
-				}
-			}
-		}
-
-		strategy := &integrationtypes.AzureCollectionStrategy{
-			Metrics: metrics,
-			Logs:    logs,
-		}
-
-		agentConfig.TelemetryCollectionStrategy[svcType] = strategy
-	}
-
-	return agentConfig, nil
-}
-
-func (a *azureProvider) ListServices(ctx context.Context, orgID string, cloudAccountID *string) (any, error) {
-	svcConfigs := make(map[string]*integrationtypes.AzureServiceConfig)
-	if cloudAccountID != nil {
-		activeAccount, err := a.AccountsRepo.GetConnectedCloudAccount(ctx, orgID, a.GetName().String(), *cloudAccountID)
-		if err != nil {
-			return nil, err
-		}
-
-		serviceConfigs, err := a.ServiceConfigRepo.GetAllForAccount(ctx, orgID, activeAccount.ID.StringValue())
-		if err != nil {
-			return nil, err
-		}
-
-		for svcType, config := range serviceConfigs {
-			serviceConfig := new(integrationtypes.AzureServiceConfig)
-			err = integrationtypes.UnmarshalJSON(config, serviceConfig)
-			if err != nil {
-				return nil, err
-			}
-			svcConfigs[svcType] = serviceConfig
-		}
-	}
-
-	summaries := make([]integrationtypes.AzureServiceSummary, 0)
-
-	definitions, err := a.ServiceDefinitions.ListServiceDefinitions(ctx)
-	if err != nil {
-		return nil, err
-	}
-
-	for _, def := range definitions {
-		summary := integrationtypes.AzureServiceSummary{
-			DefinitionMetadata: def.DefinitionMetadata,
-			Config:             nil,
-		}
-
-		summary.Config = svcConfigs[summary.Id]
-
-		summaries = append(summaries, summary)
-	}
-
-	slices.SortFunc(summaries, func(a, b integrationtypes.AzureServiceSummary) int {
-		if a.DefinitionMetadata.Title < b.DefinitionMetadata.Title {
-			return -1
-		}
-		if a.DefinitionMetadata.Title > b.DefinitionMetadata.Title {
-			return 1
-		}
-		return 0
-	})
-
-	return &integrationtypes.GettableAzureServices{
-		Services: summaries,
-	}, nil
-}
-
-func (a *azureProvider) GetServiceDetails(ctx context.Context, req *integrationtypes.GetServiceDetailsReq) (any, error) {
-	details := new(integrationtypes.GettableAzureServiceDetails)
-
-	azureDefinition, err := a.ServiceDefinitions.GetServiceDefinition(ctx, req.ServiceId)
-	if err != nil {
-		return nil, err
-	}
-
-	details.Definition = *azureDefinition
-	if req.CloudAccountID == nil {
-		return details, nil
-	}
-
-	config, err := a.GetServiceConfig(ctx, azureDefinition, req.OrgID, req.ServiceId, *req.CloudAccountID)
-	if err != nil {
-		return nil, err
-	}
-
-	details.Config = config
-
-	// fill default values for config
-	if details.Config == nil {
-		cfg := new(integrationtypes.AzureServiceConfig)
-
-		logs := make([]*integrationtypes.AzureServiceLogsConfig, 0)
-		if azureDefinition.Strategy != nil && azureDefinition.Strategy.Logs != nil {
-			for _, log := range azureDefinition.Strategy.Logs {
-				logs = append(logs, &integrationtypes.AzureServiceLogsConfig{
-					Enabled: false,
-					Name:    log.Name,
-				})
-			}
-		}
-
-		metrics := make([]*integrationtypes.AzureServiceMetricsConfig, 0)
-		if azureDefinition.Strategy != nil && azureDefinition.Strategy.Metrics != nil {
-			for _, metric := range azureDefinition.Strategy.Metrics {
-				metrics = append(metrics, &integrationtypes.AzureServiceMetricsConfig{
-					Enabled: false,
-					Name:    metric.Name,
-				})
-			}
-		}
-
-		cfg.Logs = logs
-		cfg.Metrics = metrics
-
-		details.Config = cfg
-	}
-
-	isMetricsEnabled := details.Config != nil && details.Config.IsMetricsEnabled()
-	isLogsEnabled := details.Config != nil && details.Config.IsLogsEnabled()
-
-	connectionStatus, err := a.GetServiceConnectionStatus(
-		ctx,
-		*req.CloudAccountID,
-		req.OrgID,
-		azureDefinition,
-		isMetricsEnabled,
-		isLogsEnabled,
-	)
-	if err != nil {
-		return nil, err
-	}
-
-	details.ConnectionStatus = connectionStatus
-	return details, nil
-}
-
-func (a *azureProvider) GenerateConnectionArtifact(ctx context.Context, req *integrationtypes.PostableConnectionArtifact) (any, error) {
-	connection := new(integrationtypes.PostableAzureConnectionCommand)
-
-	err := integrationtypes.UnmarshalJSON(req.Data, connection)
-	if err != nil {
-		return nil, errors.WrapInvalidInputf(err, errors.CodeInvalidInput, "failed unmarshal request data into AWS connection config")
-	}
-
-	// validate connection config
-	if connection.AccountConfig != nil {
-		if !integrationtypes.ValidAzureRegions[connection.AccountConfig.DeploymentRegion] {
-			return nil, errors.NewInvalidInputf(CodeInvalidAzureRegion, "invalid azure region: %s",
-				connection.AccountConfig.DeploymentRegion,
-			)
-		}
-	}
-
-	config, err := integrationtypes.MarshalJSON(connection.AccountConfig)
-	if err != nil {
-		return nil, err
-	}
-
-	account, err := a.AccountsRepo.Upsert(
-		ctx, req.OrgID, a.GetName().String(), nil, config,
-		nil, nil, nil,
-	)
-	if err != nil {
-		return nil, err
-	}
-
-	agentVersion := "v0.0.8"
-
-	if connection.AgentConfig.Version != "" {
-		agentVersion = connection.AgentConfig.Version
-	}
-
-	// TODO: improve the command and set url
-	cliCommand := []string{"az", "stack", "sub", "create", "--name", "SigNozIntegration", "--location",
-		connection.AccountConfig.DeploymentRegion, "--template-uri", fmt.Sprintf("<url>%s", agentVersion),
-		"--action-on-unmanage", "deleteAll", "--deny-settings-mode", "denyDelete", "--parameters", fmt.Sprintf("rgName=%s", "signoz-integration-rg"),
-		fmt.Sprintf("rgLocation=%s", connection.AccountConfig.DeploymentRegion)}
-
-	return &integrationtypes.GettableAzureConnectionCommand{
-		AccountId:                   account.ID.String(),
-		AzureShellConnectionCommand: "az create",
-		AzureCliConnectionCommand:   strings.Join(cliCommand, " "),
-	}, nil
-}
-
-func (a *azureProvider) UpdateAccountConfig(ctx context.Context, orgId valuer.UUID, accountId string, configBytes []byte) (any, error) {
-	config := new(integrationtypes.UpdatableAzureAccountConfig)
-
-	err := integrationtypes.UnmarshalJSON(configBytes, config)
-	if err != nil {
-		return nil, err
-	}
-
-	if len(config.Config.EnabledResourceGroups) < 1 {
-		return nil, errors.NewInvalidInputf(CodeInvalidAzureRegion, "azure region and resource groups must be provided")
-	}
-
-	//for azure, preserve deployment region if already set
-	account, err := a.AccountsRepo.Get(ctx, orgId.String(), a.GetName().String(), accountId)
-	if err != nil {
-		return nil, err
-	}
-
-	storedConfig := new(integrationtypes.AzureAccountConfig)
-	err = integrationtypes.UnmarshalJSON([]byte(account.Config), storedConfig)
-	if err != nil {
-		return nil, err
-	}
-
-	if account.Config != "" {
-		config.Config.DeploymentRegion = storedConfig.DeploymentRegion
-	}
-
-	configBytes, err = integrationtypes.MarshalJSON(config.Config)
-	if err != nil {
-		return nil, err
-	}
-
-	accountRecord, err := a.AccountsRepo.Upsert(
-		ctx, orgId.String(), a.GetName().String(), &accountId, configBytes, nil, nil, nil,
-	)
-	if err != nil {
-		return nil, err
-	}
-
-	return accountRecord.Account(a.GetName()), nil
-}

pkg/query-service/app/cloudintegrations/models.go

@@ -1 +1,94 @@
 package cloudintegrations
+
+import (
+	"github.com/SigNoz/signoz/pkg/errors"
+	"github.com/SigNoz/signoz/pkg/query-service/app/cloudintegrations/services"
+	"github.com/SigNoz/signoz/pkg/types"
+)
+
+type ServiceSummary struct {
+	services.Metadata
+
+	Config *types.CloudServiceConfig `json:"config"`
+}
+
+type ServiceDetails struct {
+	services.Definition
+
+	Config           *types.CloudServiceConfig `json:"config"`
+	ConnectionStatus *ServiceConnectionStatus  `json:"status,omitempty"`
+}
+
+type AccountStatus struct {
+	Integration AccountIntegrationStatus `json:"integration"`
+}
+
+type AccountIntegrationStatus struct {
+	LastHeartbeatTsMillis *int64 `json:"last_heartbeat_ts_ms"`
+}
+
+type LogsConfig struct {
+	Enabled   bool                `json:"enabled"`
+	S3Buckets map[string][]string `json:"s3_buckets,omitempty"`
+}
+
+type MetricsConfig struct {
+	Enabled bool `json:"enabled"`
+}
+
+type ServiceConnectionStatus struct {
+	Logs    *SignalConnectionStatus `json:"logs"`
+	Metrics *SignalConnectionStatus `json:"metrics"`
+}
+
+type SignalConnectionStatus struct {
+	LastReceivedTsMillis int64  `json:"last_received_ts_ms"` // epoch milliseconds
+	LastReceivedFrom     string `json:"last_received_from"`  // resource identifier
+}
+
+type CompiledCollectionStrategy = services.CollectionStrategy
+
+func NewCompiledCollectionStrategy(provider string) (*CompiledCollectionStrategy, error) {
+	if provider == "aws" {
+		return &CompiledCollectionStrategy{
+			Provider:   "aws",
+			AWSMetrics: &services.AWSMetricsStrategy{},
+			AWSLogs:    &services.AWSLogsStrategy{},
+		}, nil
+	}
+	return nil, errors.NewNotFoundf(services.CodeUnsupportedCloudProvider, "unsupported cloud provider: %s", provider)
+}
+
+// Helper for accumulating strategies for enabled services.
+func AddServiceStrategy(serviceType string, cs *CompiledCollectionStrategy,
+	definitionStrat *services.CollectionStrategy, config *types.CloudServiceConfig) error {
+	if definitionStrat.Provider != cs.Provider {
+		return errors.NewInternalf(CodeMismatchCloudProvider, "can't add %s service strategy to compiled strategy for %s",
+			definitionStrat.Provider, cs.Provider)
+	}
+
+	if cs.Provider == "aws" {
+		if config.Logs != nil && config.Logs.Enabled {
+			if serviceType == services.S3Sync {
+				// S3 bucket sync; No cloudwatch logs are appended for this service type;
+				// Though definition is populated with a custom cloudwatch group that helps in calculating logs connection status
+				cs.S3Buckets = config.Logs.S3Buckets
+			} else if definitionStrat.AWSLogs != nil { // services that includes a logs subscription
+				cs.AWSLogs.Subscriptions = append(
+					cs.AWSLogs.Subscriptions,
+					definitionStrat.AWSLogs.Subscriptions...,
+				)
+			}
+		}
+		if config.Metrics != nil && config.Metrics.Enabled && definitionStrat.AWSMetrics != nil {
+			cs.AWSMetrics.StreamFilters = append(
+				cs.AWSMetrics.StreamFilters,
+				definitionStrat.AWSMetrics.StreamFilters...,
+			)
+		}
+
+		return nil
+	}
+
+	return errors.NewNotFoundf(services.CodeUnsupportedCloudProvider, "unsupported cloud provider: %s", cs.Provider)
+}

pkg/query-service/app/cloudintegrations/providerregistry.go

@@ -1,37 +0,0 @@
-package cloudintegrations
-
-import (
-	"log/slog"
-
-	"github.com/SigNoz/signoz/pkg/querier"
-	"github.com/SigNoz/signoz/pkg/query-service/app/cloudintegrations/implawsprovider"
-	"github.com/SigNoz/signoz/pkg/query-service/app/cloudintegrations/implazureprovider"
-	integrationstore "github.com/SigNoz/signoz/pkg/query-service/app/cloudintegrations/store"
-	"github.com/SigNoz/signoz/pkg/sqlstore"
-	"github.com/SigNoz/signoz/pkg/types/integrationtypes"
-)
-
-func NewCloudProviderRegistry(
-	logger *slog.Logger,
-	store sqlstore.SQLStore,
-	querier querier.Querier,
-) (map[integrationtypes.CloudProviderType]integrationtypes.CloudProvider, error) {
-	registry := make(map[integrationtypes.CloudProviderType]integrationtypes.CloudProvider)
-
-	accountsRepo := integrationstore.NewCloudProviderAccountsRepository(store)
-	serviceConfigRepo := integrationstore.NewServiceConfigRepository(store)
-
-	awsProviderImpl, err := implawsprovider.NewAWSCloudProvider(logger, accountsRepo, serviceConfigRepo, querier)
-	if err != nil {
-		return nil, err
-	}
-	registry[integrationtypes.CloudProviderAWS] = awsProviderImpl
-
-	azureProviderImpl, err := implazureprovider.NewAzureCloudProvider(logger, accountsRepo, serviceConfigRepo, querier)
-	if err != nil {
-		return nil, err
-	}
-	registry[integrationtypes.CloudProviderAzure] = azureProviderImpl
-
-	return registry, nil
-}

pkg/query-service/app/cloudintegrations/serviceconfig_db.go

@@ -1,63 +1,64 @@
-package store
+package cloudintegrations
 
 import (
 	"context"
 	"database/sql"
+	"fmt"
 	"time"
 
-	"github.com/SigNoz/signoz/pkg/errors"
+	"github.com/SigNoz/signoz/pkg/query-service/model"
 	"github.com/SigNoz/signoz/pkg/sqlstore"
 	"github.com/SigNoz/signoz/pkg/types"
-	"github.com/SigNoz/signoz/pkg/types/integrationtypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
 )
 
-var (
-	CodeServiceConfigNotFound = errors.MustNewCode("service_config_not_found")
-)
-
 type ServiceConfigDatabase interface {
-	Get(
+	get(
 		ctx context.Context,
 		orgID string,
 		cloudAccountId string,
 		serviceType string,
-	) ([]byte, error)
+	) (*types.CloudServiceConfig, *model.ApiError)
 
-	Upsert(
+	upsert(
 		ctx context.Context,
 		orgID string,
 		cloudProvider string,
 		cloudAccountId string,
 		serviceId string,
-		config []byte,
-	) ([]byte, error)
+		config types.CloudServiceConfig,
+	) (*types.CloudServiceConfig, *model.ApiError)
 
-	GetAllForAccount(
+	getAllForAccount(
 		ctx context.Context,
 		orgID string,
 		cloudAccountId string,
 	) (
-		map[string][]byte,
-		error,
+		configsBySvcId map[string]*types.CloudServiceConfig,
+		apiErr *model.ApiError,
 	)
 }
 
-func NewServiceConfigRepository(store sqlstore.SQLStore) ServiceConfigDatabase {
-	return &serviceConfigSQLRepository{store: store}
+func newServiceConfigRepository(store sqlstore.SQLStore) (
+	*serviceConfigSQLRepository, error,
+) {
+	return &serviceConfigSQLRepository{
+		store: store,
+	}, nil
 }
 
 type serviceConfigSQLRepository struct {
 	store sqlstore.SQLStore
 }
 
-func (r *serviceConfigSQLRepository) Get(
+func (r *serviceConfigSQLRepository) get(
 	ctx context.Context,
 	orgID string,
 	cloudAccountId string,
 	serviceType string,
-) ([]byte, error) {
-	var result integrationtypes.CloudIntegrationService
+) (*types.CloudServiceConfig, *model.ApiError) {
+
+	var result types.CloudIntegrationService
 
 	err := r.store.BunDB().NewSelect().
 		Model(&result).
@@ -66,30 +67,36 @@ func (r *serviceConfigSQLRepository) Get(
 		Where("ci.id = ?", cloudAccountId).
 		Where("cis.type = ?", serviceType).
 		Scan(ctx)
-	if err != nil {
-		if errors.Is(err, sql.ErrNoRows) {
-			return nil, errors.WrapNotFoundf(err, CodeServiceConfigNotFound, "couldn't find config for cloud account %s", cloudAccountId)
-		}
 
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "couldn't query cloud service config")
+	if err == sql.ErrNoRows {
+		return nil, model.NotFoundError(fmt.Errorf(
+			"couldn't find config for cloud account %s",
+			cloudAccountId,
+		))
+	} else if err != nil {
+		return nil, model.InternalError(fmt.Errorf(
+			"couldn't query cloud service config: %w", err,
+		))
 	}
 
-	return []byte(result.Config), nil
+	return &result.Config, nil
+
 }
 
-func (r *serviceConfigSQLRepository) Upsert(
+func (r *serviceConfigSQLRepository) upsert(
 	ctx context.Context,
 	orgID string,
 	cloudProvider string,
 	cloudAccountId string,
 	serviceId string,
-	config []byte,
-) ([]byte, error) {
+	config types.CloudServiceConfig,
+) (*types.CloudServiceConfig, *model.ApiError) {
+
 	// get cloud integration id from account id
 	// if the account is not connected, we don't need to upsert the config
 	var cloudIntegrationId string
 	err := r.store.BunDB().NewSelect().
-		Model((*integrationtypes.CloudIntegration)(nil)).
+		Model((*types.CloudIntegration)(nil)).
 		Column("id").
 		Where("provider = ?", cloudProvider).
 		Where("account_id = ?", cloudAccountId).
@@ -97,24 +104,20 @@ func (r *serviceConfigSQLRepository) Upsert(
 		Where("removed_at is NULL").
 		Where("last_agent_report is not NULL").
 		Scan(ctx, &cloudIntegrationId)
+
 	if err != nil {
-		if errors.Is(err, sql.ErrNoRows) {
-			return nil, errors.WrapNotFoundf(
-				err,
-				CodeCloudIntegrationAccountNotFound,
-				"couldn't find active cloud integration account",
-			)
-		}
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "couldn't query cloud integration id")
+		return nil, model.InternalError(fmt.Errorf(
+			"couldn't query cloud integration id: %w", err,
+		))
 	}
 
-	serviceConfig := integrationtypes.CloudIntegrationService{
+	serviceConfig := types.CloudIntegrationService{
 		Identifiable: types.Identifiable{ID: valuer.GenerateUUID()},
 		TimeAuditable: types.TimeAuditable{
 			CreatedAt: time.Now(),
 			UpdatedAt: time.Now(),
 		},
-		Config:             string(config),
+		Config:             config,
 		Type:               serviceId,
 		CloudIntegrationID: cloudIntegrationId,
 	}
@@ -123,18 +126,21 @@ func (r *serviceConfigSQLRepository) Upsert(
 		On("conflict(cloud_integration_id, type) do update set config=excluded.config, updated_at=excluded.updated_at").
 		Exec(ctx)
 	if err != nil {
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "couldn't upsert cloud service config")
+		return nil, model.InternalError(fmt.Errorf(
+			"could not upsert cloud service config: %w", err,
+		))
 	}
 
-	return config, nil
+	return &serviceConfig.Config, nil
+
 }
 
-func (r *serviceConfigSQLRepository) GetAllForAccount(
+func (r *serviceConfigSQLRepository) getAllForAccount(
 	ctx context.Context,
 	orgID string,
 	cloudAccountId string,
-) (map[string][]byte, error) {
-	var serviceConfigs []integrationtypes.CloudIntegrationService
+) (map[string]*types.CloudServiceConfig, *model.ApiError) {
+	serviceConfigs := []types.CloudIntegrationService{}
 
 	err := r.store.BunDB().NewSelect().
 		Model(&serviceConfigs).
@@ -143,13 +149,15 @@ func (r *serviceConfigSQLRepository) GetAllForAccount(
 		Where("ci.org_id = ?", orgID).
 		Scan(ctx)
 	if err != nil {
-		return nil, errors.WrapInternalf(err, errors.CodeInternal, "couldn't query service configs from db")
+		return nil, model.InternalError(fmt.Errorf(
+			"could not query service configs from db: %w", err,
+		))
 	}
 
-	result := make(map[string][]byte)
+	result := map[string]*types.CloudServiceConfig{}
 
 	for _, r := range serviceConfigs {
-		result[r.Type] = []byte(r.Config)
+		result[r.Type] = &r.Config
 	}
 
 	return result, nil

pkg/query-service/app/cloudintegrations/services/definitions/aws/alb/integration.json

@@ -7,24 +7,6 @@
     "metrics": true,
     "logs": false
   },
-  "ingestion_status_check": {
-    "metrics": [
-      {
-        "category": "$default",
-        "display_name": "Default",
-        "checks": [
-          {
-            "key": "aws_ApplicationELB_ConsumedLCUs_count",
-            "attributes": []
-          },
-          {
-            "key": "aws_ApplicationELB_ProcessedBytes_sum",
-            "attributes": []
-          }
-        ]
-      }
-    ]
-  },
   "data_collected": {
     "metrics": [
       {

pkg/query-service/app/cloudintegrations/services/definitions/aws/api-gateway/integration.json

@@ -7,75 +7,6 @@
     "metrics": true,
     "logs": true
   },
-  "ingestion_status_check": {
-    "metrics": [
-      {
-        "category": "rest_api",
-        "display_name": "REST API Metrics",
-        "checks": [
-          {
-            "key": "aws_ApiGateway_Count_count",
-            "attributes": [
-              {
-                "name": "ApiName",
-                "operator": "EXISTS",
-                "value": ""
-              }
-            ]
-          }
-        ]
-      },
-      {
-        "category": "http_api",
-        "display_name": "HTTP API Metrics",
-        "checks": [
-          {
-            "key": "aws_ApiGateway_Count_count",
-            "attributes": [
-              {
-                "name": "ApiId",
-                "operator": "EXISTS",
-                "value": ""
-              }
-            ]
-          }
-        ]
-      },
-      {
-        "category": "websocket_api",
-        "display_name": "Websocket API Metrics",
-        "checks": [
-          {
-            "key": "aws_ApiGateway_Count_count",
-            "attributes": [
-              {
-                "name": "ApiId",
-                "operator": "EXISTS",
-                "value": ""
-              }
-            ]
-          }
-        ]
-      }
-    ],
-    "logs": [
-      {
-        "category": "$default",
-        "display_name": "Default",
-        "checks": [
-          {
-            "attributes": [
-              {
-                "name": "aws.cloudwatch.log_group_name",
-                "operator": "ILIKE",
-                "value": "API-Gateway%"
-              }
-            ]
-          }
-        ]
-      }
-    ]
-  },
   "data_collected": {
     "metrics": [
       {
@@ -217,146 +148,6 @@
         "name": "aws_ApiGateway_Latency_sum",
         "unit": "Milliseconds",
         "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_4xx_sum",
-        "unit": "Bytes",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_4xx_max",
-        "unit": "Bytes",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_4xx_min",
-        "unit": "Bytes",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_4xx_count",
-        "unit": "Bytes",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_5xx_sum",
-        "unit": "Bytes",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_5xx_max",
-        "unit": "Bytes",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_5xx_min",
-        "unit": "Bytes",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_5xx_count",
-        "unit": "Bytes",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_DataProcessed_sum",
-        "unit": "Bytes",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_DataProcessed_max",
-        "unit": "Bytes",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_DataProcessed_min",
-        "unit": "Bytes",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_DataProcessed_count",
-        "unit": "Bytes",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_ExecutionError_sum",
-        "unit": "Count",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_ExecutionError_max",
-        "unit": "Count",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_ExecutionError_min",
-        "unit": "Count",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_ExecutionError_count",
-        "unit": "Count",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_ClientError_sum",
-        "unit": "Count",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_ClientError_max",
-        "unit": "Count",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_ClientError_min",
-        "unit": "Count",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_ClientError_count",
-        "unit": "Count",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_IntegrationError_sum",
-        "unit": "Count",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_IntegrationError_max",
-        "unit": "Count",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_IntegrationError_min",
-        "unit": "Count",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_IntegrationError_count",
-        "unit": "Count",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_ConnectCount_sum",
-        "unit": "Count",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_ConnectCount_max",
-        "unit": "Count",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_ConnectCount_min",
-        "unit": "Count",
-        "type": "Gauge"
-      },
-      {
-        "name": "aws_ApiGateway_ConnectCount_count",
-        "unit": "Count",
-        "type": "Gauge"
       }
     ],
     "logs": [

pkg/query-service/app/cloudintegrations/services/definitions/aws/dynamodb/integration.json

@@ -7,24 +7,6 @@
     "metrics": true,
     "logs": false
   },
-  "ingestion_status_check": {
-    "metrics": [
-      {
-        "category": "$default",
-        "display_name": "Default",
-        "checks": [
-          {
-            "key": "aws_DynamoDB_AccountMaxReads_max",
-            "attributes": []
-          },
-          {
-            "key": "aws_DynamoDB_AccountProvisionedReadCapacityUtilization_max",
-            "attributes": []
-          }
-        ]
-      }
-    ]
-  },
   "data_collected": {
     "metrics": [
       {
@@ -409,4 +391,4 @@
       }
     ]
   }
-}
+}

pkg/query-service/app/cloudintegrations/services/definitions/aws/ec2/integration.json

@@ -7,24 +7,6 @@
     "metrics": true,
     "logs": false
   },
-  "ingestion_status_check": {
-    "metrics": [
-      {
-        "category": "$default",
-        "display_name": "Default",
-        "checks": [
-          {
-            "key": "aws_EC2_CPUUtilization_max",
-            "attributes": []
-          },
-          {
-            "key": "aws_EC2_NetworkIn_max",
-            "attributes": []
-          }
-        ]
-      }
-    ]
-  },
   "data_collected": {
     "metrics": [
       {
@@ -533,4 +515,4 @@
       }
     ]
   }
-}
+}

pkg/query-service/app/cloudintegrations/services/definitions/aws/ecs/integration.json

@@ -7,81 +7,6 @@
     "metrics": true,
     "logs": true
   },
-  "ingestion_status_check": {
-    "metrics": [
-      {
-        "category": "overview",
-        "display_name": "Overview",
-        "checks": [
-          {
-            "key": "aws_ECS_CPUUtilization_max",
-            "attributes": []
-          },
-          {
-            "key": "aws_ECS_MemoryUtilization_max",
-            "attributes": []
-          }
-        ]
-      },
-      {
-        "category": "containerinsights",
-        "display_name": "Container Insights",
-        "checks": [
-          {
-            "key": "aws_ECS_ContainerInsights_NetworkRxBytes_max",
-            "attributes": []
-          },
-          {
-            "key": "aws_ECS_ContainerInsights_StorageReadBytes_max",
-            "attributes": []
-          }
-        ]
-      },
-      {
-        "category": "enhanced_containerinsights",
-        "display_name": "Enhanced Container Insights",
-        "checks": [
-          {
-            "key": "aws_ECS_ContainerInsights_ContainerCpuUtilization_max",
-            "attributes": [
-              {
-                "name": "TaskId",
-                "operator": "EXISTS",
-                "value": ""
-              }
-            ]
-          },
-          {
-            "key": "aws_ECS_ContainerInsights_TaskMemoryUtilization_max",
-            "attributes": [
-              {
-                "name": "TaskId",
-                "operator": "EXISTS",
-                "value": ""
-              }
-            ]
-          }
-        ]
-      }
-    ],
-    "logs": [
-      {
-        "category": "$default",
-        "display_name": "Default",
-        "checks": [
-          {
-            "attributes": [
-              {
-                "name": "aws.cloudwatch.log_group_name",
-                "operator": "ILIKE",
-                "value": "%/ecs/%"
-              }
-            ]
-          }
-        ]
-      }
-    ]
-  },
   "data_collected": {
     "metrics": [
       {

pkg/query-service/app/cloudintegrations/services/definitions/aws/elasticache/integration.json

@@ -7,20 +7,6 @@
     "metrics": true,
     "logs": false
   },
-  "ingestion_status_check": {
-    "metrics": [
-      {
-        "category": "$default",
-        "display_name": "Default",
-        "checks": [
-          {
-            "key": "aws_ElastiCache_CacheHitRate_max",
-            "attributes": []
-          }
-        ]
-      }
-    ]
-  },
   "data_collected": {
     "metrics":[
       {
@@ -1942,7 +1928,7 @@
         "unit": "Percent",
         "type": "Gauge",
         "description": ""
-      }
+      }                      
     ]
   },
   "telemetry_collection_strategy": {
@@ -1965,4 +1951,4 @@
       }
     ]
   }
-}
+}

pkg/query-service/app/cloudintegrations/services/definitions/aws/lambda/integration.json

@@ -7,37 +7,6 @@
     "metrics": true,
     "logs": true
   },
-  "ingestion_status_check": {
-    "metrics": [
-      {
-        "category": "$default",
-        "display_name": "Default",
-        "checks": [
-          {
-            "key": "aws_Lambda_Invocations_sum",
-            "attributes": []
-          }
-        ]
-      }
-    ],
-    "logs": [
-      {
-        "category": "$default",
-        "display_name": "Default",
-        "checks": [
-          {
-            "attributes": [
-              {
-                "name": "aws.cloudwatch.log_group_name",
-                "operator": "ILIKE",
-                "value": "/aws/lambda%"
-              }
-            ]
-          }
-        ]
-      }
-    ]
-  },
   "data_collected": {
     "metrics": [
       {

pkg/query-service/app/cloudintegrations/services/definitions/aws/msk/integration.json

@@ -7,20 +7,6 @@
       "metrics": true,
       "logs": false
     },
-    "ingestion_status_check": {
-      "metrics": [
-        {
-          "category": "$default",
-          "display_name": "Default",
-          "checks": [
-            {
-              "key": "aws_Kafka_KafkaDataLogsDiskUsed_max",
-              "attributes": []
-            }
-          ]
-        }
-      ]
-    },
     "data_collected": {
       "metrics": [
         {
@@ -1102,3 +1088,4 @@
       ]
     }
   }
+  

pkg/query-service/app/cloudintegrations/services/definitions/aws/rds/integration.json

@@ -7,37 +7,6 @@
     "metrics": true,
     "logs": true
   },
-  "ingestion_status_check": {
-    "metrics": [
-      {
-        "category": "$default",
-        "display_name": "Default",
-        "checks": [
-          {
-            "key": "aws_RDS_CPUUtilization_max",
-            "attributes": []
-          }
-        ]
-      }
-    ],
-    "logs": [
-      {
-        "category": "$default",
-        "display_name": "Default",
-        "checks": [
-          {
-            "attributes": [
-              {
-                "name": "resources.aws.cloudwatch.log_group_name",
-                "operator": "ILIKE",
-                "value": "/aws/rds%"
-              }
-            ]
-          }
-        ]
-      }
-    ]
-  },
   "data_collected": {
     "metrics": [
       {
@@ -831,4 +800,4 @@
       }
     ]
   }
-}
+}

pkg/query-service/app/cloudintegrations/services/definitions/aws/sns/integration.json

@@ -7,20 +7,6 @@
     "metrics": true,
     "logs": false
   },
-  "ingestion_status_check": {
-    "metrics": [
-      {
-        "category": "$default",
-        "display_name": "Default",
-        "checks": [
-          {
-            "key": "aws_SNS_NumberOfMessagesPublished_sum",
-            "attributes": []
-          }
-        ]
-      }
-    ]
-  },
   "data_collected": {
     "metrics": [
       {
@@ -141,4 +127,4 @@
       }
     ]
   }
-}
+}

pkg/query-service/app/cloudintegrations/services/definitions/aws/sqs/integration.json

@@ -7,24 +7,6 @@
     "metrics": true,
     "logs": false
   },
-  "ingestion_status_check": {
-    "metrics": [
-      {
-        "category": "$default",
-        "display_name": "Default",
-        "checks": [
-          {
-            "key": "aws_SQS_SentMessageSize_max",
-            "attributes": []
-          },
-          {
-            "key": "aws_SQS_NumberOfMessagesSent_sum",
-            "attributes": []
-          }
-        ]
-      }
-    ]
-  },
   "data_collected": {
     "metrics": [
       {
@@ -265,4 +247,4 @@
       }
     ]
   }
-}
+}

pkg/query-service/app/cloudintegrations/services/definitions/azure/blobstorage/assets/dashboards/overview.json

@@ -1,3 +0,0 @@
-{
-
-}

pkg/query-service/app/cloudintegrations/services/definitions/azure/blobstorage/assets/dashboards/overview_dot.json

@@ -1,3 +0,0 @@
-{
-
-}

pkg/query-service/app/cloudintegrations/services/definitions/azure/blobstorage/icon.svg

@@ -1 +0,0 @@
-<svg id="f2f04349-8aee-4413-84c9-a9053611b319" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18"><defs><linearGradient id="ad4c4f96-09aa-4f91-ba10-5cb8ad530f74" x1="9" y1="15.83" x2="9" y2="5.79" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#b3b3b3" /><stop offset="0.26" stop-color="#c1c1c1" /><stop offset="1" stop-color="#e6e6e6" /></linearGradient></defs><title>Icon-storage-86</title><path d="M.5,5.79h17a0,0,0,0,1,0,0v9.48a.57.57,0,0,1-.57.57H1.07a.57.57,0,0,1-.57-.57V5.79A0,0,0,0,1,.5,5.79Z" fill="url(#ad4c4f96-09aa-4f91-ba10-5cb8ad530f74)" /><path d="M1.07,2.17H16.93a.57.57,0,0,1,.57.57V5.79a0,0,0,0,1,0,0H.5a0,0,0,0,1,0,0V2.73A.57.57,0,0,1,1.07,2.17Z" fill="#37c2b1" /><path d="M2.81,6.89H15.18a.27.27,0,0,1,.26.27v1.4a.27.27,0,0,1-.26.27H2.81a.27.27,0,0,1-.26-.27V7.16A.27.27,0,0,1,2.81,6.89Z" fill="#fff" /><path d="M2.82,9.68H15.19a.27.27,0,0,1,.26.27v1.41a.27.27,0,0,1-.26.27H2.82a.27.27,0,0,1-.26-.27V10A.27.27,0,0,1,2.82,9.68Z" fill="#37c2b1" /><path d="M2.82,12.5H15.19a.27.27,0,0,1,.26.27v1.41a.27.27,0,0,1-.26.27H2.82a.27.27,0,0,1-.26-.27V12.77A.27.27,0,0,1,2.82,12.5Z" fill="#258277" /></svg>