format

.github/workflows/push.yaml

@@ -158,7 +158,6 @@ jobs:
           echo 'SENTRY_DSN="${{ secrets.SENTRY_DSN }}"' >> frontend/.env
           echo 'TUNNEL_URL="${{ secrets.TUNNEL_URL }}"' >> frontend/.env
           echo 'TUNNEL_DOMAIN="${{ secrets.TUNNEL_DOMAIN }}"' >> frontend/.env
-          echo 'POSTHOG_KEY="${{ secrets.POSTHOG_KEY }}"' >> frontend/.env
       - name: Install dependencies
         working-directory: frontend
         run: yarn install

.github/workflows/staging-deployment.yaml

@@ -30,7 +30,6 @@ jobs:
           GCP_PROJECT: ${{ secrets.GCP_PROJECT }}
           GCP_ZONE: ${{ secrets.GCP_ZONE }}
           GCP_INSTANCE: ${{ secrets.GCP_INSTANCE }}
-          CLOUDSDK_CORE_DISABLE_PROMPTS: 1
         run: |
           read -r -d '' COMMAND <<EOF || true
           echo "GITHUB_BRANCH: ${GITHUB_BRANCH}"
@@ -52,4 +51,4 @@ jobs:
           make build-frontend-amd64
           make run-testing
           EOF
-          gcloud beta compute ssh ${GCP_INSTANCE} --zone ${GCP_ZONE} --ssh-key-expire-after=15m --tunnel-through-iap --project ${GCP_PROJECT} --command "${COMMAND}"
+          gcloud compute ssh ${GCP_INSTANCE} --zone ${GCP_ZONE} --ssh-key-expire-after=15m --tunnel-through-iap --project ${GCP_PROJECT} --command "${COMMAND}"

.github/workflows/testing-deployment.yaml

@@ -30,7 +30,6 @@ jobs:
           GCP_PROJECT: ${{ secrets.GCP_PROJECT }}
           GCP_ZONE: ${{ secrets.GCP_ZONE }}
           GCP_INSTANCE: ${{ secrets.GCP_INSTANCE }}
-          CLOUDSDK_CORE_DISABLE_PROMPTS: 1
         run: |
           read -r -d '' COMMAND <<EOF || true
           echo "GITHUB_BRANCH: ${GITHUB_BRANCH}"
@@ -53,4 +52,4 @@ jobs:
           make build-frontend-amd64
           make run-testing
           EOF
-          gcloud beta compute ssh ${GCP_INSTANCE} --zone ${GCP_ZONE} --ssh-key-expire-after=15m --tunnel-through-iap --project ${GCP_PROJECT} --command "${COMMAND}"
+          gcloud compute ssh ${GCP_INSTANCE} --zone ${GCP_ZONE} --ssh-key-expire-after=15m --tunnel-through-iap --project ${GCP_PROJECT} --command "${COMMAND}"

CONTRIBUTING.md

@@ -347,7 +347,7 @@ curl -sL https://github.com/SigNoz/signoz/raw/develop/sample-apps/hotrod/hotrod-
 ```bash
 kubectl -n sample-application run strzal --image=djbingham/curl \
   --restart='OnFailure' -i --tty --rm --command -- curl -X POST -F \
-  'user_count=6' -F 'spawn_rate=2' http://locust-master:8089/swarm
+  'locust_count=6' -F 'hatch_rate=2' http://locust-master:8089/swarm
 ```
 
 **5.1.3 To stop the load generation:**

Makefile

@@ -188,4 +188,3 @@ test:
 	go test ./pkg/query-service/tests/integration/...
 	go test ./pkg/query-service/rules/...
 	go test ./pkg/query-service/collectorsimulator/...
-	go test ./pkg/query-service/postprocess/...

README.md

@@ -198,14 +198,14 @@ Not sure how to get started? Just ping us on `#contributing` in our [slack commu
 
 #### Frontend
 
+- [Palash Gupta](https://github.com/palashgdev)
 - [Yunus M](https://github.com/YounixM)
-- [Vikrant Gupta](https://github.com/vikrantgupta25)
-- [Sagar Rajput](https://github.com/SagarRajput-7)
+- [Rajat Dabade](https://github.com/Rajat-Dabade)
 
 #### DevOps
 
 - [Prashant Shahi](https://github.com/prashant-shahi)
-- [Vibhu Pandey](https://github.com/grandwizard28)
+- [Dhawal Sanghvi](https://github.com/dhawal1248)
 
 <br /><br />
 

deploy/docker-swarm/clickhouse-setup/docker-compose.yaml

@@ -146,7 +146,7 @@ services:
         condition: on-failure
 
   query-service:
-    image: signoz/query-service:0.49.1
+    image: signoz/query-service:0.46.0
     command:
       [
         "-config=/root/config/prometheus.yml",
@@ -186,7 +186,7 @@ services:
     <<: *db-depend
 
   frontend:
-    image: signoz/frontend:0.48.0
+    image: signoz/frontend:0.46.0
     deploy:
       restart_policy:
         condition: on-failure
@@ -199,7 +199,7 @@ services:
       - ../common/nginx-config.conf:/etc/nginx/conf.d/default.conf
 
   otel-collector:
-    image: signoz/signoz-otel-collector:0.102.2
+    image: signoz/signoz-otel-collector:0.88.24
     command:
       [
         "--config=/etc/otel-collector-config.yaml",
@@ -237,7 +237,7 @@ services:
       - query-service
 
   otel-collector-migrator:
-      image: signoz/signoz-schema-migrator:0.102.2
+      image: signoz/signoz-schema-migrator:0.88.24
       deploy:
         restart_policy:
           condition: on-failure

deploy/docker/clickhouse-setup/docker-compose-core.yaml

@@ -66,7 +66,7 @@ services:
       - --storage.path=/data
 
   otel-collector-migrator:
-    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-0.102.2}
+    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-0.88.24}
     container_name: otel-migrator
     command:
       - "--dsn=tcp://clickhouse:9000"
@@ -81,7 +81,7 @@ services:
   # Notes for Maintainers/Contributors who will change Line Numbers of Frontend & Query-Section. Please Update Line Numbers in `./scripts/commentLinesForSetup.sh` & `./CONTRIBUTING.md`
   otel-collector:
     container_name: signoz-otel-collector
-    image: signoz/signoz-otel-collector:0.102.2
+    image: signoz/signoz-otel-collector:0.88.24
     command:
       [
         "--config=/etc/otel-collector-config.yaml",

deploy/docker/clickhouse-setup/docker-compose.testing.yaml

@@ -164,7 +164,7 @@ services:
   # Notes for Maintainers/Contributors who will change Line Numbers of Frontend & Query-Section. Please Update Line Numbers in `./scripts/commentLinesForSetup.sh` & `./CONTRIBUTING.md`
 
   query-service:
-    image: signoz/query-service:${DOCKER_TAG:-0.49.1}
+    image: signoz/query-service:${DOCKER_TAG:-0.46.0}
     container_name: signoz-query-service
     command:
       [
@@ -204,7 +204,7 @@ services:
     <<: *db-depend
 
   frontend:
-    image: signoz/frontend:${DOCKER_TAG:-0.49.1}
+    image: signoz/frontend:${DOCKER_TAG:-0.46.0}
     container_name: signoz-frontend
     restart: on-failure
     depends_on:
@@ -216,7 +216,7 @@ services:
       - ../common/nginx-config.conf:/etc/nginx/conf.d/default.conf
 
   otel-collector-migrator:
-    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-0.102.2}
+    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-0.88.24}
     container_name: otel-migrator
     command:
       - "--dsn=tcp://clickhouse:9000"
@@ -230,7 +230,7 @@ services:
 
 
   otel-collector:
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-0.102.2}
+    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-0.88.24}
     container_name: signoz-otel-collector
     command:
       [

deploy/docker/clickhouse-setup/docker-compose.yaml

@@ -164,7 +164,7 @@ services:
   # Notes for Maintainers/Contributors who will change Line Numbers of Frontend & Query-Section. Please Update Line Numbers in `./scripts/commentLinesForSetup.sh` & `./CONTRIBUTING.md`
 
   query-service:
-    image: signoz/query-service:${DOCKER_TAG:-0.49.1}
+    image: signoz/query-service:${DOCKER_TAG:-0.46.0}
     container_name: signoz-query-service
     command:
       [
@@ -203,7 +203,7 @@ services:
     <<: *db-depend
 
   frontend:
-    image: signoz/frontend:${DOCKER_TAG:-0.49.1}
+    image: signoz/frontend:${DOCKER_TAG:-0.46.0}
     container_name: signoz-frontend
     restart: on-failure
     depends_on:
@@ -215,7 +215,7 @@ services:
       - ../common/nginx-config.conf:/etc/nginx/conf.d/default.conf
 
   otel-collector-migrator:
-    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-0.102.2}
+    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-0.88.24}
     container_name: otel-migrator
     command:
       - "--dsn=tcp://clickhouse:9000"
@@ -229,7 +229,7 @@ services:
 
 
   otel-collector:
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-0.102.2}
+    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-0.88.24}
     container_name: signoz-otel-collector
     command:
       [

deploy/install.sh

@@ -389,7 +389,7 @@ trap bye EXIT
 
 URL="https://api.segment.io/v1/track"
 HEADER_1="Content-Type: application/json"
-HEADER_2="Authorization: Basic OWtScko3b1BDR1BFSkxGNlFqTVBMdDVibGpGaFJRQnI="
+HEADER_2="Authorization: Basic NEdtb2E0aXhKQVVIeDJCcEp4c2p3QTFiRWZud0VlUno6"
 
 send_event() {
     error=""

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

@@ -24,6 +24,7 @@ import (
 type APIHandlerOptions struct {
 	DataConnector                 interfaces.DataConnector
 	SkipConfig                    *basemodel.SkipConfig
+	PreferDelta                   bool
 	PreferSpanMetrics             bool
 	MaxIdleConns                  int
 	MaxOpenConns                  int
@@ -52,6 +53,7 @@ func NewAPIHandler(opts APIHandlerOptions) (*APIHandler, error) {
 	baseHandler, err := baseapp.NewAPIHandler(baseapp.APIHandlerOpts{
 		Reader:                        opts.DataConnector,
 		SkipConfig:                    opts.SkipConfig,
+		PerferDelta:                   opts.PreferDelta,
 		PreferSpanMetrics:             opts.PreferSpanMetrics,
 		MaxIdleConns:                  opts.MaxIdleConns,
 		MaxOpenConns:                  opts.MaxOpenConns,

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

@@ -1,9 +1,7 @@
 package api
 
 import (
-	"errors"
 	"net/http"
-	"strings"
 
 	"github.com/gorilla/mux"
 	"go.signoz.io/signoz/pkg/query-service/app/dashboards"
@@ -31,10 +29,6 @@ func (ah *APIHandler) lockUnlockDashboard(w http.ResponseWriter, r *http.Request
 
 	// Get the dashboard UUID from the request
 	uuid := mux.Vars(r)["uuid"]
-	if strings.HasPrefix(uuid,"integration") {
-		RespondError(w, &model.ApiError{Typ: model.ErrorForbidden, Err: errors.New("dashboards created by integrations cannot be unlocked")}, "You are not authorized to lock/unlock this dashboard")
-		return 
-	}
 	dashboard, err := dashboards.GetDashboard(r.Context(), uuid)
 	if err != nil {
 		RespondError(w, &model.ApiError{Typ: model.ErrorInternal, Err: err}, err.Error())

ee/query-service/app/server.go

@@ -4,11 +4,11 @@ import (
 	"bytes"
 	"context"
 	"encoding/json"
-	"errors"
 	"fmt"
 	"io"
 	"net"
 	"net/http"
+	"net/http/httputil"
 	_ "net/http/pprof" // http profiler
 	"os"
 	"regexp"
@@ -28,7 +28,6 @@ import (
 	"go.signoz.io/signoz/ee/query-service/integrations/gateway"
 	"go.signoz.io/signoz/ee/query-service/interfaces"
 	baseauth "go.signoz.io/signoz/pkg/query-service/auth"
-	"go.signoz.io/signoz/pkg/query-service/model"
 	v3 "go.signoz.io/signoz/pkg/query-service/model/v3"
 
 	licensepkg "go.signoz.io/signoz/ee/query-service/license"
@@ -42,7 +41,6 @@ import (
 	"go.signoz.io/signoz/pkg/query-service/app/logparsingpipeline"
 	"go.signoz.io/signoz/pkg/query-service/app/opamp"
 	opAmpModel "go.signoz.io/signoz/pkg/query-service/app/opamp/model"
-	"go.signoz.io/signoz/pkg/query-service/app/preferences"
 	"go.signoz.io/signoz/pkg/query-service/cache"
 	baseconst "go.signoz.io/signoz/pkg/query-service/constants"
 	"go.signoz.io/signoz/pkg/query-service/healthcheck"
@@ -66,6 +64,7 @@ type ServerOptions struct {
 	// alert specific params
 	DisableRules      bool
 	RuleRepoURL       string
+	PreferDelta       bool
 	PreferSpanMetrics bool
 	MaxIdleConns      int
 	MaxOpenConns      int
@@ -112,10 +111,6 @@ func NewServer(serverOptions *ServerOptions) (*Server, error) {
 
 	baseexplorer.InitWithDSN(baseconst.RELATIONAL_DATASOURCE_PATH)
 
-	if err := preferences.InitDB(baseconst.RELATIONAL_DATASOURCE_PATH); err != nil {
-		return nil, err
-	}
-
 	localDB, err := dashboards.InitDB(baseconst.RELATIONAL_DATASOURCE_PATH)
 
 	if err != nil {
@@ -124,13 +119,33 @@ func NewServer(serverOptions *ServerOptions) (*Server, error) {
 
 	localDB.SetMaxOpenConns(10)
 
-	gatewayProxy, err := gateway.NewProxy(serverOptions.GatewayUrl, gateway.RoutePrefix)
-	if err != nil {
-		return nil, err
+	gatewayFeature := basemodel.Feature{
+		Name:       "GATEWAY",
+		Active:     false,
+		Usage:      0,
+		UsageLimit: -1,
+		Route:      "",
+	}
+
+	//Activate this feature if the url is not empty
+	var gatewayProxy *httputil.ReverseProxy
+	if serverOptions.GatewayUrl == "" {
+		gatewayFeature.Active = false
+		gatewayProxy, err = gateway.NewNoopProxy()
+		if err != nil {
+			return nil, err
+		}
+	} else {
+		zap.L().Info("Enabling gateway feature flag ...")
+		gatewayFeature.Active = true
+		gatewayProxy, err = gateway.NewProxy(serverOptions.GatewayUrl, gateway.RoutePrefix)
+		if err != nil {
+			return nil, err
+		}
 	}
 
 	// initiate license manager
-	lm, err := licensepkg.StartManager("sqlite", localDB)
+	lm, err := licensepkg.StartManager("sqlite", localDB, gatewayFeature)
 	if err != nil {
 		return nil, err
 	}
@@ -241,6 +256,7 @@ func NewServer(serverOptions *ServerOptions) (*Server, error) {
 	apiOpts := api.APIHandlerOptions{
 		DataConnector:                 reader,
 		SkipConfig:                    skipConfig,
+		PreferDelta:                   serverOptions.PreferDelta,
 		PreferSpanMetrics:             serverOptions.PreferSpanMetrics,
 		MaxIdleConns:                  serverOptions.MaxIdleConns,
 		MaxOpenConns:                  serverOptions.MaxOpenConns,
@@ -326,17 +342,7 @@ func (s *Server) createPublicServer(apiHandler *api.APIHandler) (*http.Server, e
 
 	// add auth middleware
 	getUserFromRequest := func(r *http.Request) (*basemodel.UserPayload, error) {
-		user, err := auth.GetUserFromRequest(r, apiHandler)
-
-		if err != nil {
-			return nil, err
-		}
-
-		if user.User.OrgId == "" {
-			return nil, model.UnauthorizedError(errors.New("orgId is missing in the claims"))
-		}
-
-		return user, nil
+		return auth.GetUserFromRequest(r, apiHandler)
 	}
 	am := baseapp.NewAuthMiddleware(getUserFromRequest)
 

ee/query-service/dao/sqlite/auth.go

@@ -20,14 +20,11 @@ import (
 func (m *modelDao) createUserForSAMLRequest(ctx context.Context, email string) (*basemodel.User, basemodel.BaseApiError) {
 	// get auth domain from email domain
 	domain, apierr := m.GetDomainByEmail(ctx, email)
+
 	if apierr != nil {
 		zap.L().Error("failed to get domain from email", zap.Error(apierr))
 		return nil, model.InternalErrorStr("failed to get domain from email")
 	}
-	if domain == nil {
-		zap.L().Error("email domain does not match any authenticated domain", zap.String("email", email))
-		return nil, model.InternalErrorStr("email domain does not match any authenticated domain")
-	}
 
 	hash, err := baseauth.PasswordHash(utils.GeneratePassowrd())
 	if err != nil {

ee/query-service/integrations/gateway/noop.go

@@ -5,5 +5,5 @@ import (
 )
 
 func NewNoopProxy() (*httputil.ReverseProxy, error) {
-	return &httputil.ReverseProxy{}, nil
+	return nil, nil
 }

ee/query-service/main.go

@@ -89,6 +89,7 @@ func main() {
 
 	var cacheConfigPath, fluxInterval string
 	var enableQueryServiceLogOTLPExport bool
+	var preferDelta bool
 	var preferSpanMetrics bool
 
 	var maxIdleConns int
@@ -99,13 +100,14 @@ func main() {
 	flag.StringVar(&promConfigPath, "config", "./config/prometheus.yml", "(prometheus config to read metrics)")
 	flag.StringVar(&skipTopLvlOpsPath, "skip-top-level-ops", "", "(config file to skip top level operations)")
 	flag.BoolVar(&disableRules, "rules.disable", false, "(disable rule evaluation)")
+	flag.BoolVar(&preferDelta, "prefer-delta", false, "(prefer delta over cumulative metrics)")
 	flag.BoolVar(&preferSpanMetrics, "prefer-span-metrics", false, "(prefer span metrics for service level metrics)")
 	flag.IntVar(&maxIdleConns, "max-idle-conns", 50, "(number of connections to maintain in the pool.)")
 	flag.IntVar(&maxOpenConns, "max-open-conns", 100, "(max connections for use at any time.)")
 	flag.DurationVar(&dialTimeout, "dial-timeout", 5*time.Second, "(the maximum time to establish a connection.)")
 	flag.StringVar(&ruleRepoURL, "rules.repo-url", baseconst.AlertHelpPage, "(host address used to build rule link in alert messages)")
 	flag.StringVar(&cacheConfigPath, "experimental.cache-config", "", "(cache config to use)")
-	flag.StringVar(&fluxInterval, "flux-interval", "5m", "(the interval to exclude data from being cached to avoid incorrect cache for data in motion)")
+	flag.StringVar(&fluxInterval, "flux-interval", "5m", "(cache config to use)")
 	flag.BoolVar(&enableQueryServiceLogOTLPExport, "enable.query.service.log.otlp.export", false, "(enable query service log otlp export)")
 	flag.StringVar(&cluster, "cluster", "cluster", "(cluster name - defaults to 'cluster')")
 	flag.StringVar(&gatewayUrl, "gateway-url", "", "(url to the gateway)")
@@ -123,6 +125,7 @@ func main() {
 		HTTPHostPort:      baseconst.HTTPHostPort,
 		PromConfigPath:    promConfigPath,
 		SkipTopLvlOpsPath: skipTopLvlOpsPath,
+		PreferDelta:       preferDelta,
 		PreferSpanMetrics: preferSpanMetrics,
 		PrivateHostPort:   baseconst.PrivateHostPort,
 		DisableRules:      disableRules,

ee/query-service/model/plans.go

@@ -11,7 +11,6 @@ const Enterprise = "ENTERPRISE_PLAN"
 const DisableUpsell = "DISABLE_UPSELL"
 const Onboarding = "ONBOARDING"
 const ChatSupport = "CHAT_SUPPORT"
-const Gateway = "GATEWAY"
 
 var BasicPlan = basemodel.FeatureSet{
 	basemodel.Feature{
@@ -112,13 +111,6 @@ var BasicPlan = basemodel.FeatureSet{
 		UsageLimit: -1,
 		Route:      "",
 	},
-	basemodel.Feature{
-		Name:       Gateway,
-		Active:     false,
-		Usage:      0,
-		UsageLimit: -1,
-		Route:      "",
-	},
 }
 
 var ProPlan = basemodel.FeatureSet{
@@ -213,13 +205,6 @@ var ProPlan = basemodel.FeatureSet{
 		UsageLimit: -1,
 		Route:      "",
 	},
-	basemodel.Feature{
-		Name:       Gateway,
-		Active:     true,
-		Usage:      0,
-		UsageLimit: -1,
-		Route:      "",
-	},
 }
 
 var EnterprisePlan = basemodel.FeatureSet{
@@ -328,11 +313,4 @@ var EnterprisePlan = basemodel.FeatureSet{
 		UsageLimit: -1,
 		Route:      "",
 	},
-	basemodel.Feature{
-		Name:       Gateway,
-		Active:     true,
-		Usage:      0,
-		UsageLimit: -1,
-		Route:      "",
-	},
 }

frontend/jest.config.ts

@@ -9,7 +9,6 @@ const config: Config.InitialOptions = {
 	modulePathIgnorePatterns: ['dist'],
 	moduleNameMapper: {
 		'\\.(css|less|scss)$': '<rootDir>/__mocks__/cssMock.ts',
-		'\\.md$': '<rootDir>/__mocks__/cssMock.ts',
 	},
 	globals: {
 		extensionsToTreatAsEsm: ['.ts'],

frontend/package.json

@@ -34,6 +34,8 @@
 		"@dnd-kit/core": "6.1.0",
 		"@dnd-kit/modifiers": "7.0.0",
 		"@dnd-kit/sortable": "8.0.0",
+		"@dnd-kit/utilities": "3.2.2",
+		"@faker-js/faker": "8.4.1",
 		"@grafana/data": "^9.5.2",
 		"@mdx-js/loader": "2.3.0",
 		"@mdx-js/react": "2.3.0",
@@ -43,6 +45,7 @@
 		"@sentry/react": "7.102.1",
 		"@sentry/webpack-plugin": "2.16.0",
 		"@signozhq/design-tokens": "0.0.8",
+		"@tanstack/react-table": "8.17.3",
 		"@uiw/react-md-editor": "3.23.5",
 		"@visx/group": "3.3.0",
 		"@visx/shape": "3.5.0",
@@ -88,7 +91,6 @@
 		"lucide-react": "0.379.0",
 		"mini-css-extract-plugin": "2.4.5",
 		"papaparse": "5.4.1",
-		"posthog-js": "1.142.1",
 		"rc-tween-one": "3.0.6",
 		"react": "18.2.0",
 		"react-addons-update": "15.6.3",
@@ -110,8 +112,6 @@
 		"react-syntax-highlighter": "15.5.0",
 		"react-use": "^17.3.2",
 		"react-virtuoso": "4.0.3",
-		"overlayscrollbars-react": "^0.5.6",
-		"overlayscrollbars": "^2.8.1",
 		"redux": "^4.0.5",
 		"redux-thunk": "^2.3.0",
 		"rehype-raw": "7.0.0",

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

@@ -1,8 +0,0 @@
-{
-	"invite_user": "Invite your teammates",
-	"invite": "Invite",
-	"skip": "Skip",
-	"invite_user_helper_text": "Not the right person to get started? No worries! Invite someone who can.",
-	"select_use_case": "Select a use-case to get started",
-	"get_started": "Get Started"
-}

frontend/public/locales/en/common.json

@@ -6,6 +6,5 @@
 	"share": "Share",
 	"save": "Save",
 	"edit": "Edit",
-	"logged_in": "Logged In",
-	"pending_data_placeholder": "Just a bit of patience, just a little bit’s enough ⎯ we’re getting your {{dataSource}}!"
+	"logged_in": "Logged In"
 }

frontend/public/locales/en/onboarding.json

@@ -1,8 +0,0 @@
-{
-	"invite_user": "Invite your teammates",
-	"invite": "Invite",
-	"skip": "Skip",
-	"invite_user_helper_text": "Not the right person to get started? No worries! Invite someone who can.",
-	"select_use_case": "Select a use-case to get started",
-	"get_started": "Get Started"
-}

frontend/src/AppRoutes/Private.tsx

@@ -76,8 +76,9 @@ function PrivateRoute({ children }: PrivateRouteProps): JSX.Element {
 				isUserFetching: false,
 			},
 		});
+
 		if (!isLoggedIn) {
-			history.push(ROUTES.LOGIN, { from: pathname });
+			history.push(ROUTES.LOGIN);
 		}
 	};
 

frontend/src/AppRoutes/index.tsx

@@ -1,7 +1,6 @@
 import { ConfigProvider } from 'antd';
 import getLocalStorageApi from 'api/browser/localstorage/get';
 import setLocalStorageApi from 'api/browser/localstorage/set';
-import logEvent from 'api/common/logEvent';
 import NotFound from 'components/NotFound';
 import Spinner from 'components/Spinner';
 import { FeatureKeys } from 'constants/features';
@@ -18,7 +17,6 @@ import { NotificationProvider } from 'hooks/useNotifications';
 import { ResourceProvider } from 'hooks/useResourceAttribute';
 import history from 'lib/history';
 import { identity, pick, pickBy } from 'lodash-es';
-import posthog from 'posthog-js';
 import { DashboardProvider } from 'providers/Dashboard/Dashboard';
 import { QueryBuilderProvider } from 'providers/QueryBuilder';
 import { Suspense, useEffect, useState } from 'react';
@@ -40,7 +38,7 @@ import defaultRoutes, {
 
 function App(): JSX.Element {
 	const themeConfig = useThemeConfig();
-	const { data: licenseData } = useLicense();
+	const { data } = useLicense();
 	const [routes, setRoutes] = useState<AppRoutes[]>(defaultRoutes);
 	const { role, isLoggedIn: isLoggedInState, user, org } = useSelector<
 		AppState,
@@ -49,7 +47,7 @@ function App(): JSX.Element {
 
 	const dispatch = useDispatch<Dispatch<AppActions>>();
 
-	const { trackPageView } = useAnalytics();
+	const { trackPageView, trackEvent } = useAnalytics();
 
 	const { hostname, pathname } = window.location;
 
@@ -94,10 +92,10 @@ function App(): JSX.Element {
 	});
 
 	const isOnBasicPlan =
-		licenseData?.payload?.licenses?.some(
+		data?.payload?.licenses?.some(
 			(license) =>
 				license.isCurrent && license.planKey === LICENSE_PLAN_KEY.BASIC_PLAN,
-		) || licenseData?.payload?.licenses === null;
+		) || data?.payload?.licenses === null;
 
 	const enableAnalytics = (user: User): void => {
 		const orgName =
@@ -114,7 +112,9 @@ function App(): JSX.Element {
 		};
 
 		const sanitizedIdentifyPayload = pickBy(identifyPayload, identity);
+
 		const domain = extractDomain(email);
+
 		const hostNameParts = hostname.split('.');
 
 		const groupTraits = {
@@ -127,30 +127,10 @@ function App(): JSX.Element {
 		};
 
 		window.analytics.identify(email, sanitizedIdentifyPayload);
+
 		window.analytics.group(domain, groupTraits);
+
 		window.clarity('identify', email, name);
-
-		posthog?.identify(email, {
-			email,
-			name,
-			orgName,
-			tenant_id: hostNameParts[0],
-			data_region: hostNameParts[1],
-			tenant_url: hostname,
-			company_domain: domain,
-			source: 'signoz-ui',
-			isPaidUser: !!licenseData?.payload?.trialConvertedToSubscription,
-		});
-
-		posthog?.group('company', domain, {
-			name: orgName,
-			tenant_id: hostNameParts[0],
-			data_region: hostNameParts[1],
-			tenant_url: hostname,
-			company_domain: domain,
-			source: 'signoz-ui',
-			isPaidUser: !!licenseData?.payload?.trialConvertedToSubscription,
-		});
 	};
 
 	useEffect(() => {
@@ -164,6 +144,10 @@ function App(): JSX.Element {
 			!isIdentifiedUser
 		) {
 			setLocalStorageApi(LOCALSTORAGE.IS_IDENTIFIED_USER, 'true');
+
+			if (isCloudUserVal) {
+				enableAnalytics(user);
+			}
 		}
 
 		if (
@@ -200,7 +184,7 @@ function App(): JSX.Element {
 					LOCALSTORAGE.THEME_ANALYTICS_V1,
 				);
 				if (!isThemeAnalyticsSent) {
-					logEvent('Theme Analytics', {
+					trackEvent('Theme Analytics', {
 						theme: isDarkMode ? THEME_MODE.DARK : THEME_MODE.LIGHT,
 						user: pick(user, ['email', 'userId', 'name']),
 						org,
@@ -211,11 +195,6 @@ function App(): JSX.Element {
 				console.error('Failed to parse local storage theme analytics event');
 			}
 		}
-
-		if (isCloudUserVal && user && user.email) {
-			enableAnalytics(user);
-		}
-
 		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [user]);
 

frontend/src/api/apiV1.ts

@@ -3,7 +3,7 @@ const apiV1 = '/api/v1/';
 export const apiV2 = '/api/v2/';
 export const apiV3 = '/api/v3/';
 export const apiV4 = '/api/v4/';
-export const gatewayApiV1 = '/api/gateway/v1/';
-export const apiAlertManager = '/api/alertmanager/';
+export const gatewayApiV1 = '/api/gateway/v1';
+export const apiAlertManager = '/api/alertmanager';
 
 export default apiV1;

frontend/src/api/common/logEvent.ts

@@ -1,4 +1,4 @@
-import { ApiBaseInstance as axios } from 'api';
+import axios from 'api';
 import { ErrorResponseHandler } from 'api/ErrorResponseHandler';
 import { AxiosError } from 'axios';
 import { ErrorResponse, SuccessResponse } from 'types/api';
@@ -21,7 +21,6 @@ const logEvent = async (
 			payload: response.data.data,
 		};
 	} catch (error) {
-		console.error(error);
 		return ErrorResponseHandler(error as AxiosError);
 	}
 };

frontend/src/api/index.ts

@@ -96,10 +96,6 @@ const interceptorRejected = async (
 	}
 };
 
-const interceptorRejectedBase = async (
-	value: AxiosResponse<any>,
-): Promise<AxiosResponse<any>> => Promise.reject(value);
-
 const instance = axios.create({
 	baseURL: `${ENVIRONMENT.baseURL}${apiV1}`,
 });
@@ -144,18 +140,6 @@ ApiV4Instance.interceptors.response.use(
 ApiV4Instance.interceptors.request.use(interceptorsRequestResponse);
 //
 
-// axios Base
-export const ApiBaseInstance = axios.create({
-	baseURL: `${ENVIRONMENT.baseURL}${apiV1}`,
-});
-
-ApiBaseInstance.interceptors.response.use(
-	interceptorsResponse,
-	interceptorRejectedBase,
-);
-ApiBaseInstance.interceptors.request.use(interceptorsRequestResponse);
-//
-
 // gateway Api V1
 export const GatewayApiV1Instance = axios.create({
 	baseURL: `${ENVIRONMENT.baseURL}${gatewayApiV1}`,

frontend/src/api/plannedDowntime/createDowntimeSchedule.ts

@@ -1,7 +1,6 @@
 import axios from 'api';
 import { ErrorResponseHandler } from 'api/ErrorResponseHandler';
 import { AxiosError } from 'axios';
-import { Dayjs } from 'dayjs';
 import { ErrorResponse, SuccessResponse } from 'types/api';
 
 import { Recurrence } from './getAllDowntimeSchedules';
@@ -12,8 +11,8 @@ export interface DowntimeSchedulePayload {
 	alertIds: string[];
 	schedule: {
 		timezone?: string;
-		startTime?: string | Dayjs;
-		endTime?: string | Dayjs;
+		startTime?: string;
+		endTime?: string;
 		recurrence?: Recurrence;
 	};
 }

frontend/src/api/plannedDowntime/getAllDowntimeSchedules.ts

@@ -1,6 +1,6 @@
 import axios from 'api';
 import { AxiosError, AxiosResponse } from 'axios';
-import { Option } from 'container/PlannedDowntime/PlannedDowntimeutils';
+import { Option } from 'container/PlannedDowntime/DropdownWithSubMenu/DropdownWithSubMenu';
 import { useQuery, UseQueryResult } from 'react-query';
 
 export type Recurrence = {
@@ -28,7 +28,6 @@ export interface DowntimeSchedules {
 	createdBy: string | null;
 	updatedAt: string | null;
 	updatedBy: string | null;
-	kind: string | null;
 }
 export type PayloadProps = { data: DowntimeSchedules[] };
 

frontend/src/components/DropDown/DropDown.tsx

@@ -5,13 +5,7 @@ import { Button, Dropdown, MenuProps } from 'antd';
 import { useIsDarkMode } from 'hooks/useDarkMode';
 import { useState } from 'react';
 
-function DropDown({
-	element,
-	onDropDownItemClick,
-}: {
-	element: JSX.Element[];
-	onDropDownItemClick?: MenuProps['onClick'];
-}): JSX.Element {
+function DropDown({ element }: { element: JSX.Element[] }): JSX.Element {
 	const isDarkMode = useIsDarkMode();
 
 	const items: MenuProps['items'] = element.map(
@@ -29,7 +23,6 @@ function DropDown({
 				items,
 				onMouseEnter: (): void => setDdOpen(true),
 				onMouseLeave: (): void => setDdOpen(false),
-				onClick: (item): void => onDropDownItemClick?.(item),
 			}}
 			open={isDdOpen}
 		>
@@ -47,8 +40,4 @@ function DropDown({
 	);
 }
 
-DropDown.defaultProps = {
-	onDropDownItemClick: (): void => {},
-};
-
 export default DropDown;

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

@@ -52,7 +52,7 @@
 
 		.log-body {
 			font-family: 'SF Mono';
-			font-family: 'Geist Mono';
+			font-family: 'Space Mono', monospace;
 
 			font-size: var(--font-size-sm);
 			font-weight: var(--font-weight-normal);

frontend/src/components/Logs/RawLogView/index.tsx

@@ -62,6 +62,8 @@ function RawLogView({
 	const isDarkMode = useIsDarkMode();
 	const isReadOnlyLog = !isLogsExplorerPage || isReadOnly;
 
+	const severityText = data.severity_text ? `${data.severity_text} |` : '';
+
 	const logType = getLogIndicatorType(data);
 
 	const updatedSelecedFields = useMemo(
@@ -86,16 +88,17 @@ function RawLogView({
 		attributesText += ' | ';
 	}
 
-	const text = useMemo(() => {
-		const date =
+	const text = useMemo(
+		() =>
 			typeof data.timestamp === 'string'
-				? dayjs(data.timestamp)
-				: dayjs(data.timestamp / 1e6);
-
-		return `${date.format('YYYY-MM-DD HH:mm:ss.SSS')} | ${attributesText} ${
-			data.body
-		}`;
-	}, [data.timestamp, data.body, attributesText]);
+				? `${dayjs(data.timestamp).format(
+						'YYYY-MM-DD HH:mm:ss.SSS',
+				  )} | ${attributesText} ${severityText} ${data.body}`
+				: `${dayjs(data.timestamp / 1e6).format(
+						'YYYY-MM-DD HH:mm:ss.SSS',
+				  )} | ${attributesText} ${severityText} ${data.body}`,
+		[data.timestamp, data.body, severityText, attributesText],
+	);
 
 	const handleClickExpand = useCallback(() => {
 		if (activeContextLog || isReadOnly) return;

frontend/src/components/Logs/RawLogView/styles.ts

@@ -49,7 +49,7 @@ export const ExpandIconWrapper = styled(Col)`
 export const RawLogContent = styled.div<RawLogContentProps>`
 	margin-bottom: 0;
 	font-family: 'SF Mono', monospace;
-	font-family: 'Geist Mono';
+	font-family: 'Space Mono', monospace;
 	font-size: 13px;
 	font-weight: 400;
 	text-align: left;

frontend/src/components/OverlayScrollbar/OverlayScrollbar.tsx

@@ -1,54 +0,0 @@
-import TypicalOverlayScrollbar from 'components/TypicalOverlayScrollbar/TypicalOverlayScrollbar';
-import VirtuosoOverlayScrollbar from 'components/VirtuosoOverlayScrollbar/VirtuosoOverlayScrollbar';
-import { useIsDarkMode } from 'hooks/useDarkMode';
-import { PartialOptions } from 'overlayscrollbars';
-import { CSSProperties, ReactElement, useMemo } from 'react';
-
-type Props = {
-	children: ReactElement;
-	isVirtuoso?: boolean;
-	style?: CSSProperties;
-	options?: PartialOptions;
-};
-
-function OverlayScrollbar({
-	children,
-	isVirtuoso,
-	style,
-	options: customOptions,
-}: Props): any {
-	const isDarkMode = useIsDarkMode();
-	const options = useMemo(
-		() =>
-			({
-				scrollbars: {
-					autoHide: 'scroll',
-					theme: isDarkMode ? 'os-theme-light' : 'os-theme-dark',
-				},
-				...(customOptions || {}),
-			} as PartialOptions),
-		[customOptions, isDarkMode],
-	);
-
-	if (isVirtuoso) {
-		return (
-			<VirtuosoOverlayScrollbar style={style} options={options}>
-				{children}
-			</VirtuosoOverlayScrollbar>
-		);
-	}
-
-	return (
-		<TypicalOverlayScrollbar style={style} options={options}>
-			{children}
-		</TypicalOverlayScrollbar>
-	);
-}
-
-OverlayScrollbar.defaultProps = {
-	isVirtuoso: false,
-	style: {},
-	options: {},
-};
-
-export default OverlayScrollbar;

frontend/src/components/ResizeTable/DynamicColumnTable.tsx

@@ -2,9 +2,7 @@
 import './DynamicColumnTable.syles.scss';
 
 import { Button, Dropdown, Flex, MenuProps, Switch } from 'antd';
-import { ColumnGroupType, ColumnType } from 'antd/es/table';
 import { ColumnsType } from 'antd/lib/table';
-import logEvent from 'api/common/logEvent';
 import FacingIssueBtn from 'components/facingIssueBtn/FacingIssueBtn';
 import { SlidersHorizontal } from 'lucide-react';
 import { memo, useEffect, useState } from 'react';
@@ -24,7 +22,6 @@ function DynamicColumnTable({
 	dynamicColumns,
 	onDragColumn,
 	facingIssueBtn,
-	shouldSendAlertsLogEvent,
 	...restProps
 }: DynamicColumnTableProps): JSX.Element {
 	const [columnsData, setColumnsData] = useState<ColumnsType | undefined>(
@@ -50,18 +47,11 @@ function DynamicColumnTable({
 		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [columns, dynamicColumns]);
 
-	const onToggleHandler = (
-		index: number,
-		column: ColumnGroupType<any> | ColumnType<any>,
-	) => (checked: boolean, event: React.MouseEvent<HTMLButtonElement>): void => {
+	const onToggleHandler = (index: number) => (
+		checked: boolean,
+		event: React.MouseEvent<HTMLButtonElement>,
+	): void => {
 		event.stopPropagation();
-
-		if (shouldSendAlertsLogEvent) {
-			logEvent('Alert: Column toggled', {
-				column: column?.title,
-				action: checked ? 'Enable' : 'Disable',
-			});
-		}
 		setVisibleColumns({
 			tablesource,
 			dynamicColumns,
@@ -85,7 +75,7 @@ function DynamicColumnTable({
 					<div>{column.title?.toString()}</div>
 					<Switch
 						checked={columnsData?.findIndex((c) => c.key === column.key) !== -1}
-						onChange={onToggleHandler(index, column)}
+						onChange={onToggleHandler(index)}
 					/>
 				</div>
 			),

frontend/src/components/ResizeTable/ResizeTable.tsx

@@ -3,7 +3,6 @@
 import { Table } from 'antd';
 import { ColumnsType } from 'antd/lib/table';
 import { dragColumnParams } from 'hooks/useDragColumns/configs';
-import { set } from 'lodash-es';
 import {
 	SyntheticEvent,
 	useCallback,
@@ -21,7 +20,6 @@ import { ResizeTableProps } from './types';
 function ResizeTable({
 	columns,
 	onDragColumn,
-	pagination,
 	...restProps
 }: ResizeTableProps): JSX.Element {
 	const [columnsData, setColumns] = useState<ColumnsType>([]);
@@ -60,21 +58,14 @@ function ResizeTable({
 		[columnsData, onDragColumn, handleResize],
 	);
 
-	const tableParams = useMemo(() => {
-		const props = {
+	const tableParams = useMemo(
+		() => ({
 			...restProps,
 			components: { header: { cell: ResizableHeader } },
 			columns: mergedColumns,
-		};
-
-		set(
-			props,
-			'pagination',
-			pagination ? { ...pagination, hideOnSinglePage: true } : false,
-		);
-
-		return props;
-	}, [mergedColumns, pagination, restProps]);
+		}),
+		[mergedColumns, restProps],
+	);
 
 	useEffect(() => {
 		if (columns) {

frontend/src/components/ResizeTable/types.ts

@@ -14,7 +14,6 @@ export interface DynamicColumnTableProps extends TableProps<any> {
 	dynamicColumns: TableProps<any>['columns'];
 	onDragColumn?: (fromIndex: number, toIndex: number) => void;
 	facingIssueBtn?: FacingIssueBtnProps;
-	shouldSendAlertsLogEvent?: boolean;
 }
 
 export type GetVisibleColumnsFunction = (

frontend/src/components/Tags/Tags.tsx

@@ -5,6 +5,7 @@ import { Button } from 'antd';
 import { Tag } from 'antd/lib';
 import Input from 'components/Input';
 import { Check, X } from 'lucide-react';
+import { TweenOneGroup } from 'rc-tween-one';
 import React, { Dispatch, SetStateAction, useState } from 'react';
 
 function Tags({ tags, setTags }: AddTagsProps): JSX.Element {
@@ -45,19 +46,41 @@ function Tags({ tags, setTags }: AddTagsProps): JSX.Element {
 		func(value);
 	};
 
+	const forMap = (tag: string): React.ReactElement => (
+		<span key={tag} style={{ display: 'inline-block' }}>
+			<Tag
+				closable
+				onClose={(e): void => {
+					e.preventDefault();
+					handleClose(tag);
+				}}
+			>
+				{tag}
+			</Tag>
+		</span>
+	);
+
+	const tagChild = tags.map(forMap);
+
+	const renderTagsAnimated = (): React.ReactElement => (
+		<TweenOneGroup
+			appear={false}
+			className="tags"
+			enter={{ scale: 0.8, opacity: 0, type: 'from', duration: 100 }}
+			leave={{ opacity: 0, width: 0, scale: 0, duration: 200 }}
+			onEnd={(e): void => {
+				if (e.type === 'appear' || e.type === 'enter') {
+					(e.target as any).style = 'display: inline-block';
+				}
+			}}
+		>
+			{tagChild}
+		</TweenOneGroup>
+	);
+
 	return (
 		<div className="tags-container">
-			{tags.map<React.ReactNode>((tag) => (
-				<Tag
-					key={tag}
-					closable
-					style={{ userSelect: 'none' }}
-					onClose={(): void => handleClose(tag)}
-				>
-					<span>{tag}</span>
-				</Tag>
-			))}
-
+			{renderTagsAnimated()}
 			{inputVisible && (
 				<div className="add-tag-container">
 					<Input

frontend/src/components/TextToolTip/TextToolTip.tsx

@@ -9,6 +9,7 @@ import { Tooltip } from 'antd';
 import { themeColors } from 'constants/theme';
 import { useIsDarkMode } from 'hooks/useDarkMode';
 import { useMemo } from 'react';
+import { popupContainer } from 'utils/selectPopupContainer';
 
 import { style } from './constant';
 
@@ -63,7 +64,7 @@ function TextToolTip({
 	);
 
 	return (
-		<Tooltip overlay={overlay}>
+		<Tooltip getTooltipContainer={popupContainer} overlay={overlay}>
 			{useFilledIcon ? (
 				<QuestionCircleFilled style={iconStyle} />
 			) : (

frontend/src/components/TypicalOverlayScrollbar/TypicalOverlayScrollbar.tsx

@@ -1,31 +0,0 @@
-import './typicalOverlayScrollbar.scss';
-
-import { PartialOptions } from 'overlayscrollbars';
-import { OverlayScrollbarsComponent } from 'overlayscrollbars-react';
-import { CSSProperties, ReactElement } from 'react';
-
-interface Props {
-	children: ReactElement;
-	style?: CSSProperties;
-	options?: PartialOptions;
-}
-
-export default function TypicalOverlayScrollbar({
-	children,
-	style,
-	options,
-}: Props): ReturnType<typeof OverlayScrollbarsComponent> {
-	return (
-		<OverlayScrollbarsComponent
-			defer
-			options={options}
-			style={style}
-			className="overlay-scrollbar"
-			data-overlayscrollbars-initialize
-		>
-			{children}
-		</OverlayScrollbarsComponent>
-	);
-}
-
-TypicalOverlayScrollbar.defaultProps = { style: {}, options: {} };

frontend/src/components/TypicalOverlayScrollbar/typicalOverlayScrollbar.scss

@@ -1,3 +0,0 @@
-.overlay-scrollbar {
-	height: 100%;
-}

frontend/src/components/ValueGraph/index.tsx

@@ -49,10 +49,7 @@ function ValueGraph({
 					}
 				>
 					<Tooltip title={t('this_value_satisfies_multiple_thresholds')}>
-						<ExclamationCircleFilled
-							className="value-graph-icon"
-							data-testid="conflicting-thresholds"
-						/>
+						<ExclamationCircleFilled className="value-graph-icon" />
 					</Tooltip>
 				</div>
 			)}

frontend/src/components/VirtuosoOverlayScrollbar/VirtuosoOverlayScrollbar.tsx

@@ -1,37 +0,0 @@
-import './virtuosoOverlayScrollbar.scss';
-
-import useInitializeOverlayScrollbar from 'hooks/useInitializeOverlayScrollbar/useInitializeOverlayScrollbar';
-import { PartialOptions } from 'overlayscrollbars';
-import React, { CSSProperties, ReactElement } from 'react';
-
-interface VirtuosoOverlayScrollbarProps {
-	children: ReactElement;
-	style?: CSSProperties;
-	options: PartialOptions;
-}
-
-export default function VirtuosoOverlayScrollbar({
-	children,
-	style,
-	options,
-}: VirtuosoOverlayScrollbarProps): JSX.Element {
-	const { rootRef, setScroller } = useInitializeOverlayScrollbar(options);
-
-	const enhancedChild = React.cloneElement(children, {
-		scrollerRef: setScroller,
-		'data-overlayscrollbars-initialize': true,
-	});
-
-	return (
-		<div
-			data-overlayscrollbars-initialize
-			ref={rootRef}
-			className="overlay-scroll-wrapper"
-			style={style}
-		>
-			{enhancedChild}
-		</div>
-	);
-}
-
-VirtuosoOverlayScrollbar.defaultProps = { style: {} };

frontend/src/components/VirtuosoOverlayScrollbar/virtuosoOverlayScrollbar.scss

@@ -1,5 +0,0 @@
-.overlay-scroll-wrapper {
-	height: 100%;
-	width: 100%;
-	overflow: auto;
-}

frontend/src/components/facingIssueBtn/FacingIssueBtn.tsx

@@ -16,7 +16,6 @@ export interface FacingIssueBtnProps {
 	buttonText?: string;
 	className?: string;
 	onHoverText?: string;
-	intercomMessageDisabled?: boolean;
 }
 
 function FacingIssueBtn({
@@ -26,12 +25,11 @@ function FacingIssueBtn({
 	buttonText = '',
 	className = '',
 	onHoverText = '',
-	intercomMessageDisabled = false,
 }: FacingIssueBtnProps): JSX.Element | null {
 	const handleFacingIssuesClick = (): void => {
 		logEvent(eventName, attributes);
 
-		if (window.Intercom && !intercomMessageDisabled) {
+		if (window.Intercom) {
 			window.Intercom('showNewMessage', defaultTo(message, ''));
 		}
 	};
@@ -64,7 +62,6 @@ FacingIssueBtn.defaultProps = {
 	buttonText: '',
 	className: '',
 	onHoverText: '',
-	intercomMessageDisabled: false,
 };
 
 export default FacingIssueBtn;

frontend/src/constants/features.ts

@@ -19,5 +19,6 @@ export enum FeatureKeys {
 	OSS = 'OSS',
 	ONBOARDING = 'ONBOARDING',
 	CHAT_SUPPORT = 'CHAT_SUPPORT',
+	PLANNED_MAINTENANCE = 'PLANNED_MAINTENANCE',
 	GATEWAY = 'GATEWAY',
 }

frontend/src/container/AllAlertChannels/index.tsx

@@ -1,15 +1,13 @@
 import { PlusOutlined } from '@ant-design/icons';
 import { Tooltip, Typography } from 'antd';
 import getAll from 'api/channels/getAll';
-import logEvent from 'api/common/logEvent';
 import Spinner from 'components/Spinner';
 import TextToolTip from 'components/TextToolTip';
 import ROUTES from 'constants/routes';
 import useComponentPermission from 'hooks/useComponentPermission';
 import useFetch from 'hooks/useFetch';
 import history from 'lib/history';
-import { isUndefined } from 'lodash-es';
-import { useCallback, useEffect } from 'react';
+import { useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useSelector } from 'react-redux';
 import { AppState } from 'store/reducers';
@@ -33,14 +31,6 @@ function AlertChannels(): JSX.Element {
 
 	const { loading, payload, error, errorMessage } = useFetch(getAll);
 
-	useEffect(() => {
-		if (!isUndefined(payload)) {
-			logEvent('Alert Channel: Channel list page visited', {
-				number: payload?.length,
-			});
-		}
-	}, [payload]);
-
 	if (error) {
 		return <Typography>{errorMessage}</Typography>;
 	}

frontend/src/container/AllError/index.tsx

@@ -12,7 +12,6 @@ import { ColumnType, TablePaginationConfig } from 'antd/es/table';
 import { FilterValue, SorterResult } from 'antd/es/table/interface';
 import { ColumnsType } from 'antd/lib/table';
 import { FilterConfirmProps } from 'antd/lib/table/interface';
-import logEvent from 'api/common/logEvent';
 import getAll from 'api/errors/getAll';
 import getErrorCounts from 'api/errors/getErrorCounts';
 import { ResizeTable } from 'components/ResizeTable';
@@ -24,8 +23,7 @@ import { convertRawQueriesToTraceSelectedTags } from 'hooks/useResourceAttribute
 import useUrlQuery from 'hooks/useUrlQuery';
 import createQueryParams from 'lib/createQueryParams';
 import history from 'lib/history';
-import { isUndefined } from 'lodash-es';
-import { useCallback, useEffect, useMemo, useRef } from 'react';
+import { useCallback, useEffect, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useQueries } from 'react-query';
 import { useSelector } from 'react-redux';
@@ -412,26 +410,6 @@ function AllErrors(): JSX.Element {
 		[pathname],
 	);
 
-	const logEventCalledRef = useRef(false);
-	useEffect(() => {
-		if (
-			!logEventCalledRef.current &&
-			!isUndefined(errorCountResponse.data?.payload)
-		) {
-			const selectedEnvironments = queries.find(
-				(val) => val.tagKey === 'resource_deployment_environment',
-			)?.tagValue;
-
-			logEvent('Exception: List page visited', {
-				numberOfExceptions: errorCountResponse?.data?.payload,
-				selectedEnvironments,
-				resourceAttributeUsed: !!queries?.length,
-			});
-			logEventCalledRef.current = true;
-		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
-	}, [errorCountResponse.data?.payload]);
-
 	return (
 		<ResizeTable
 			columns={columns}

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

@@ -5,6 +5,7 @@
 
 	.app-content {
 		width: calc(100% - 64px);
+		overflow: auto;
 		z-index: 0;
 
 		.content-container {

frontend/src/container/AppLayout/index.tsx

@@ -6,10 +6,10 @@ import './AppLayout.styles.scss';
 import * as Sentry from '@sentry/react';
 import { Flex } from 'antd';
 import getLocalStorageKey from 'api/browser/localstorage/get';
+import getDynamicConfigs from 'api/dynamicConfigs/getDynamicConfigs';
 import getUserLatestVersion from 'api/user/getLatestVersion';
 import getUserVersion from 'api/user/getVersion';
 import cx from 'classnames';
-import OverlayScrollbar from 'components/OverlayScrollbar/OverlayScrollbar';
 import { IS_SIDEBAR_COLLAPSED } from 'constants/app';
 import ROUTES from 'constants/routes';
 import SideNav from 'container/SideNav';
@@ -38,6 +38,7 @@ import { sideBarCollapse } from 'store/actions';
 import { AppState } from 'store/reducers';
 import AppActions from 'types/actions';
 import {
+	UPDATE_CONFIGS,
 	UPDATE_CURRENT_ERROR,
 	UPDATE_CURRENT_VERSION,
 	UPDATE_LATEST_VERSION,
@@ -65,7 +66,11 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 	const { pathname } = useLocation();
 	const { t } = useTranslation(['titles']);
 
-	const [getUserVersionResponse, getUserLatestVersionResponse] = useQueries([
+	const [
+		getUserVersionResponse,
+		getUserLatestVersionResponse,
+		getDynamicConfigsResponse,
+	] = useQueries([
 		{
 			queryFn: getUserVersion,
 			queryKey: ['getUserVersion', user?.accessJwt],
@@ -76,6 +81,10 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 			queryKey: ['getUserLatestVersion', user?.accessJwt],
 			enabled: isLoggedIn,
 		},
+		{
+			queryFn: getDynamicConfigs,
+			queryKey: ['getDynamicConfigs', user?.accessJwt],
+		},
 	]);
 
 	useEffect(() => {
@@ -86,7 +95,15 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 		if (getUserVersionResponse.status === 'idle' && isLoggedIn) {
 			getUserVersionResponse.refetch();
 		}
-	}, [getUserLatestVersionResponse, getUserVersionResponse, isLoggedIn]);
+		if (getDynamicConfigsResponse.status === 'idle') {
+			getDynamicConfigsResponse.refetch();
+		}
+	}, [
+		getUserLatestVersionResponse,
+		getUserVersionResponse,
+		isLoggedIn,
+		getDynamicConfigsResponse,
+	]);
 
 	const { children } = props;
 
@@ -94,6 +111,7 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 
 	const latestCurrentCounter = useRef(0);
 	const latestVersionCounter = useRef(0);
+	const latestConfigCounter = useRef(0);
 
 	const { notifications } = useNotifications();
 
@@ -171,6 +189,23 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 				},
 			});
 		}
+
+		if (
+			getDynamicConfigsResponse.isFetched &&
+			getDynamicConfigsResponse.isSuccess &&
+			getDynamicConfigsResponse.data &&
+			getDynamicConfigsResponse.data.payload &&
+			latestConfigCounter.current === 0
+		) {
+			latestConfigCounter.current = 1;
+
+			dispatch({
+				type: UPDATE_CONFIGS,
+				payload: {
+					configs: getDynamicConfigsResponse.data.payload,
+				},
+			});
+		}
 	}, [
 		dispatch,
 		isLoggedIn,
@@ -185,6 +220,9 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 		getUserLatestVersionResponse.isFetched,
 		getUserVersionResponse.isFetched,
 		getUserLatestVersionResponse.isSuccess,
+		getDynamicConfigsResponse.data,
+		getDynamicConfigsResponse.isFetched,
+		getDynamicConfigsResponse.isSuccess,
 		notifications,
 	]);
 
@@ -304,29 +342,24 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 						collapsed={collapsed}
 					/>
 				)}
-				<div
-					className={cx('app-content', collapsed ? 'collapsed' : '')}
-					data-overlayscrollbars-initialize
-				>
+				<div className={cx('app-content', collapsed ? 'collapsed' : '')}>
 					<Sentry.ErrorBoundary fallback={<ErrorBoundaryFallback />}>
-						<LayoutContent data-overlayscrollbars-initialize>
-							<OverlayScrollbar>
-								<ChildrenContainer
-									style={{
-										margin:
-											isLogsView() ||
-											isTracesView() ||
-											isDashboardView() ||
-											isDashboardWidgetView() ||
-											isDashboardListView()
-												? 0
-												: '0 1rem',
-									}}
-								>
-									{isToDisplayLayout && !renderFullScreen && <TopNav />}
-									{children}
-								</ChildrenContainer>
-							</OverlayScrollbar>
+						<LayoutContent>
+							<ChildrenContainer
+								style={{
+									margin:
+										isLogsView() ||
+										isTracesView() ||
+										isDashboardView() ||
+										isDashboardWidgetView() ||
+										isDashboardListView()
+											? 0
+											: '0 1rem',
+								}}
+							>
+								{isToDisplayLayout && !renderFullScreen && <TopNav />}
+								{children}
+							</ChildrenContainer>
 						</LayoutContent>
 					</Sentry.ErrorBoundary>
 				</div>

frontend/src/container/AppLayout/styles.ts

@@ -13,6 +13,7 @@ export const Layout = styled(LayoutComponent)`
 `;
 
 export const LayoutContent = styled(LayoutComponent.Content)`
+	overflow-y: auto;
 	height: 100%;
 	&::-webkit-scrollbar {
 		width: 0.1rem;

frontend/src/container/BillingContainer/BillingContainer.tsx

@@ -19,10 +19,10 @@ import { ColumnsType } from 'antd/es/table';
 import updateCreditCardApi from 'api/billing/checkout';
 import getUsage, { UsageResponsePayloadProps } from 'api/billing/getUsage';
 import manageCreditCardApi from 'api/billing/manage';
-import logEvent from 'api/common/logEvent';
 import Spinner from 'components/Spinner';
 import { SOMETHING_WENT_WRONG } from 'constants/api';
 import { REACT_QUERY_KEY } from 'constants/reactQueryKeys';
+import useAnalytics from 'hooks/analytics/useAnalytics';
 import useAxiosError from 'hooks/useAxiosError';
 import useLicense from 'hooks/useLicense';
 import { useNotifications } from 'hooks/useNotifications';
@@ -137,6 +137,8 @@ export default function BillingContainer(): JSX.Element {
 		Partial<UsageResponsePayloadProps>
 	>({});
 
+	const { trackEvent } = useAnalytics();
+
 	const { isFetching, data: licensesData, error: licenseError } = useLicense();
 
 	const { user, org } = useSelector<AppState, AppReducer>((state) => state.app);
@@ -314,7 +316,7 @@ export default function BillingContainer(): JSX.Element {
 
 	const handleBilling = useCallback(async () => {
 		if (isFreeTrial && !licensesData?.payload?.trialConvertedToSubscription) {
-			logEvent('Billing : Upgrade Plan', {
+			trackEvent('Billing : Upgrade Plan', {
 				user: pick(user, ['email', 'userId', 'name']),
 				org,
 			});
@@ -325,7 +327,7 @@ export default function BillingContainer(): JSX.Element {
 				cancelURL: window.location.href,
 			});
 		} else {
-			logEvent('Billing : Manage Billing', {
+			trackEvent('Billing : Manage Billing', {
 				user: pick(user, ['email', 'userId', 'name']),
 				org,
 			});

frontend/src/container/CreateAlertChannels/index.tsx

@@ -11,12 +11,11 @@ import testOpsGenie from 'api/channels/testOpsgenie';
 import testPagerApi from 'api/channels/testPager';
 import testSlackApi from 'api/channels/testSlack';
 import testWebhookApi from 'api/channels/testWebhook';
-import logEvent from 'api/common/logEvent';
 import ROUTES from 'constants/routes';
 import FormAlertChannels from 'container/FormAlertChannels';
 import { useNotifications } from 'hooks/useNotifications';
 import history from 'lib/history';
-import { useCallback, useEffect, useState } from 'react';
+import { useCallback, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 
 import {
@@ -44,10 +43,6 @@ function CreateAlertChannels({
 
 	const [formInstance] = Form.useForm();
 
-	useEffect(() => {
-		logEvent('Alert Channel: Create channel page visited', {});
-	}, []);
-
 	const [selectedConfig, setSelectedConfig] = useState<
 		Partial<
 			SlackChannel &
@@ -144,25 +139,19 @@ function CreateAlertChannels({
 					description: t('channel_creation_done'),
 				});
 				history.replace(ROUTES.ALL_CHANNELS);
-				return { status: 'success', statusMessage: t('channel_creation_done') };
+			} else {
+				notifications.error({
+					message: 'Error',
+					description: response.error || t('channel_creation_failed'),
+				});
 			}
-			notifications.error({
-				message: 'Error',
-				description: response.error || t('channel_creation_failed'),
-			});
-			return {
-				status: 'failed',
-				statusMessage: response.error || t('channel_creation_failed'),
-			};
 		} catch (error) {
 			notifications.error({
 				message: 'Error',
 				description: t('channel_creation_failed'),
 			});
-			return { status: 'failed', statusMessage: t('channel_creation_failed') };
-		} finally {
-			setSavingState(false);
 		}
+		setSavingState(false);
 	}, [prepareSlackRequest, t, notifications]);
 
 	const prepareWebhookRequest = useCallback(() => {
@@ -211,25 +200,19 @@ function CreateAlertChannels({
 					description: t('channel_creation_done'),
 				});
 				history.replace(ROUTES.ALL_CHANNELS);
-				return { status: 'success', statusMessage: t('channel_creation_done') };
+			} else {
+				notifications.error({
+					message: 'Error',
+					description: response.error || t('channel_creation_failed'),
+				});
 			}
-			notifications.error({
-				message: 'Error',
-				description: response.error || t('channel_creation_failed'),
-			});
-			return {
-				status: 'failed',
-				statusMessage: response.error || t('channel_creation_failed'),
-			};
 		} catch (error) {
 			notifications.error({
 				message: 'Error',
 				description: t('channel_creation_failed'),
 			});
-			return { status: 'failed', statusMessage: t('channel_creation_failed') };
-		} finally {
-			setSavingState(false);
 		}
+		setSavingState(false);
 	}, [prepareWebhookRequest, t, notifications]);
 
 	const preparePagerRequest = useCallback(() => {
@@ -262,8 +245,8 @@ function CreateAlertChannels({
 		setSavingState(true);
 		const request = preparePagerRequest();
 
-		try {
-			if (request) {
+		if (request) {
+			try {
 				const response = await createPagerApi(request);
 
 				if (response.statusCode === 200) {
@@ -272,31 +255,20 @@ function CreateAlertChannels({
 						description: t('channel_creation_done'),
 					});
 					history.replace(ROUTES.ALL_CHANNELS);
-					return { status: 'success', statusMessage: t('channel_creation_done') };
+				} else {
+					notifications.error({
+						message: 'Error',
+						description: response.error || t('channel_creation_failed'),
+					});
 				}
+			} catch (e) {
 				notifications.error({
 					message: 'Error',
-					description: response.error || t('channel_creation_failed'),
+					description: t('channel_creation_failed'),
 				});
-				return {
-					status: 'failed',
-					statusMessage: response.error || t('channel_creation_failed'),
-				};
 			}
-			notifications.error({
-				message: 'Error',
-				description: t('channel_creation_failed'),
-			});
-			return { status: 'failed', statusMessage: t('channel_creation_failed') };
-		} catch (error) {
-			notifications.error({
-				message: 'Error',
-				description: t('channel_creation_failed'),
-			});
-			return { status: 'failed', statusMessage: t('channel_creation_failed') };
-		} finally {
-			setSavingState(false);
 		}
+		setSavingState(false);
 	}, [t, notifications, preparePagerRequest]);
 
 	const prepareOpsgenieRequest = useCallback(
@@ -323,25 +295,19 @@ function CreateAlertChannels({
 					description: t('channel_creation_done'),
 				});
 				history.replace(ROUTES.ALL_CHANNELS);
-				return { status: 'success', statusMessage: t('channel_creation_done') };
+			} else {
+				notifications.error({
+					message: 'Error',
+					description: response.error || t('channel_creation_failed'),
+				});
 			}
-			notifications.error({
-				message: 'Error',
-				description: response.error || t('channel_creation_failed'),
-			});
-			return {
-				status: 'failed',
-				statusMessage: response.error || t('channel_creation_failed'),
-			};
 		} catch (error) {
 			notifications.error({
 				message: 'Error',
 				description: t('channel_creation_failed'),
 			});
-			return { status: 'failed', statusMessage: t('channel_creation_failed') };
-		} finally {
-			setSavingState(false);
 		}
+		setSavingState(false);
 	}, [prepareOpsgenieRequest, t, notifications]);
 
 	const prepareEmailRequest = useCallback(
@@ -366,25 +332,19 @@ function CreateAlertChannels({
 					description: t('channel_creation_done'),
 				});
 				history.replace(ROUTES.ALL_CHANNELS);
-				return { status: 'success', statusMessage: t('channel_creation_done') };
+			} else {
+				notifications.error({
+					message: 'Error',
+					description: response.error || t('channel_creation_failed'),
+				});
 			}
-			notifications.error({
-				message: 'Error',
-				description: response.error || t('channel_creation_failed'),
-			});
-			return {
-				status: 'failed',
-				statusMessage: response.error || t('channel_creation_failed'),
-			};
 		} catch (error) {
 			notifications.error({
 				message: 'Error',
 				description: t('channel_creation_failed'),
 			});
-			return { status: 'failed', statusMessage: t('channel_creation_failed') };
-		} finally {
-			setSavingState(false);
 		}
+		setSavingState(false);
 	}, [prepareEmailRequest, t, notifications]);
 
 	const prepareMsTeamsRequest = useCallback(
@@ -410,25 +370,19 @@ function CreateAlertChannels({
 					description: t('channel_creation_done'),
 				});
 				history.replace(ROUTES.ALL_CHANNELS);
-				return { status: 'success', statusMessage: t('channel_creation_done') };
+			} else {
+				notifications.error({
+					message: 'Error',
+					description: response.error || t('channel_creation_failed'),
+				});
 			}
-			notifications.error({
-				message: 'Error',
-				description: response.error || t('channel_creation_failed'),
-			});
-			return {
-				status: 'failed',
-				statusMessage: response.error || t('channel_creation_failed'),
-			};
 		} catch (error) {
 			notifications.error({
 				message: 'Error',
 				description: t('channel_creation_failed'),
 			});
-			return { status: 'failed', statusMessage: t('channel_creation_failed') };
-		} finally {
-			setSavingState(false);
 		}
+		setSavingState(false);
 	}, [prepareMsTeamsRequest, t, notifications]);
 
 	const onSaveHandler = useCallback(
@@ -446,15 +400,7 @@ function CreateAlertChannels({
 				const functionToCall = functionMapper[value as keyof typeof functionMapper];
 
 				if (functionToCall) {
-					const result = await functionToCall();
-					logEvent('Alert Channel: Save channel', {
-						type: value,
-						sendResolvedAlert: selectedConfig?.send_resolved,
-						name: selectedConfig?.name,
-						new: 'true',
-						status: result?.status,
-						statusMessage: result?.statusMessage,
-					});
+					functionToCall();
 				} else {
 					notifications.error({
 						message: 'Error',
@@ -463,7 +409,6 @@ function CreateAlertChannels({
 				}
 			}
 		},
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 		[
 			onSlackHandler,
 			onWebhookHandler,
@@ -527,25 +472,14 @@ function CreateAlertChannels({
 						description: t('channel_test_failed'),
 					});
 				}
-
-				logEvent('Alert Channel: Test notification', {
-					type: channelType,
-					sendResolvedAlert: selectedConfig?.send_resolved,
-					name: selectedConfig?.name,
-					new: 'true',
-					status:
-						response && response.statusCode === 200 ? 'Test success' : 'Test failed',
-				});
 			} catch (error) {
 				notifications.error({
 					message: 'Error',
 					description: t('channel_test_unexpected'),
 				});
 			}
-
 			setTestingState(false);
 		},
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 		[
 			prepareWebhookRequest,
 			t,

frontend/src/container/CreateAlertRule/SelectAlertType/index.tsx

@@ -1,6 +1,4 @@
 import { Row, Typography } from 'antd';
-import logEvent from 'api/common/logEvent';
-import { ALERTS_DATA_SOURCE_MAP } from 'constants/alerts';
 import { useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { AlertTypes } from 'types/api/alerts/alertTypes';
@@ -36,13 +34,6 @@ function SelectAlertType({ onSelect }: SelectAlertTypeProps): JSX.Element {
 			default:
 				break;
 		}
-
-		logEvent('Alert: Sample alert link clicked', {
-			dataSource: ALERTS_DATA_SOURCE_MAP[option],
-			link: url,
-			page: 'New alert data source selection page',
-		});
-
 		window.open(url, '_blank');
 	}
 	const renderOptions = useMemo(

frontend/src/container/CreateAlertRule/index.tsx

@@ -1,5 +1,4 @@
 import { Form, Row } from 'antd';
-import logEvent from 'api/common/logEvent';
 import { ENTITY_VERSION_V4 } from 'constants/app';
 import { QueryParams } from 'constants/query';
 import FormAlertRules from 'container/FormAlertRules';
@@ -69,8 +68,6 @@ function CreateRules(): JSX.Element {
 	useEffect(() => {
 		if (alertType) {
 			onSelectType(alertType);
-		} else {
-			logEvent('Alert: New alert data source selection page visited', {});
 		}
 		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [alertType]);

frontend/src/container/EditAlertChannels/index.tsx

@@ -11,7 +11,6 @@ import testOpsgenie from 'api/channels/testOpsgenie';
 import testPagerApi from 'api/channels/testPager';
 import testSlackApi from 'api/channels/testSlack';
 import testWebhookApi from 'api/channels/testWebhook';
-import logEvent from 'api/common/logEvent';
 import ROUTES from 'constants/routes';
 import {
 	ChannelType,
@@ -90,7 +89,7 @@ function EditAlertChannels({
 				description: t('webhook_url_required'),
 			});
 			setSavingState(false);
-			return { status: 'failed', statusMessage: t('webhook_url_required') };
+			return;
 		}
 
 		const response = await editSlackApi(prepareSlackRequest());
@@ -102,17 +101,13 @@ function EditAlertChannels({
 			});
 
 			history.replace(ROUTES.ALL_CHANNELS);
-			return { status: 'success', statusMessage: t('channel_edit_done') };
+		} else {
+			notifications.error({
+				message: 'Error',
+				description: response.error || t('channel_edit_failed'),
+			});
 		}
-		notifications.error({
-			message: 'Error',
-			description: response.error || t('channel_edit_failed'),
-		});
 		setSavingState(false);
-		return {
-			status: 'failed',
-			statusMessage: response.error || t('channel_edit_failed'),
-		};
 	}, [prepareSlackRequest, t, notifications, selectedConfig]);
 
 	const prepareWebhookRequest = useCallback(() => {
@@ -141,13 +136,13 @@ function EditAlertChannels({
 		if (selectedConfig?.api_url === '') {
 			showError(t('webhook_url_required'));
 			setSavingState(false);
-			return { status: 'failed', statusMessage: t('webhook_url_required') };
+			return;
 		}
 
 		if (username && (!password || password === '')) {
 			showError(t('username_no_password'));
 			setSavingState(false);
-			return { status: 'failed', statusMessage: t('username_no_password') };
+			return;
 		}
 
 		const response = await editWebhookApi(prepareWebhookRequest());
@@ -159,15 +154,10 @@ function EditAlertChannels({
 			});
 
 			history.replace(ROUTES.ALL_CHANNELS);
-			return { status: 'success', statusMessage: t('channel_edit_done') };
+		} else {
+			showError(response.error || t('channel_edit_failed'));
 		}
-		showError(response.error || t('channel_edit_failed'));
-
 		setSavingState(false);
-		return {
-			status: 'failed',
-			statusMessage: response.error || t('channel_edit_failed'),
-		};
 	}, [prepareWebhookRequest, t, notifications, selectedConfig]);
 
 	const prepareEmailRequest = useCallback(
@@ -191,18 +181,13 @@ function EditAlertChannels({
 				description: t('channel_edit_done'),
 			});
 			history.replace(ROUTES.ALL_CHANNELS);
-			return { status: 'success', statusMessage: t('channel_edit_done') };
+		} else {
+			notifications.error({
+				message: 'Error',
+				description: response.error || t('channel_edit_failed'),
+			});
 		}
-		notifications.error({
-			message: 'Error',
-			description: response.error || t('channel_edit_failed'),
-		});
-
 		setSavingState(false);
-		return {
-			status: 'failed',
-			statusMessage: response.error || t('channel_edit_failed'),
-		};
 	}, [prepareEmailRequest, t, notifications]);
 
 	const preparePagerRequest = useCallback(
@@ -233,7 +218,7 @@ function EditAlertChannels({
 				description: validationError,
 			});
 			setSavingState(false);
-			return { status: 'failed', statusMessage: validationError };
+			return;
 		}
 		const response = await editPagerApi(preparePagerRequest());
 
@@ -244,18 +229,13 @@ function EditAlertChannels({
 			});
 
 			history.replace(ROUTES.ALL_CHANNELS);
-			return { status: 'success', statusMessage: t('channel_edit_done') };
+		} else {
+			notifications.error({
+				message: 'Error',
+				description: response.error || t('channel_edit_failed'),
+			});
 		}
-		notifications.error({
-			message: 'Error',
-			description: response.error || t('channel_edit_failed'),
-		});
-
 		setSavingState(false);
-		return {
-			status: 'failed',
-			statusMessage: response.error || t('channel_edit_failed'),
-		};
 	}, [preparePagerRequest, notifications, selectedConfig, t]);
 
 	const prepareOpsgenieRequest = useCallback(
@@ -279,7 +259,7 @@ function EditAlertChannels({
 				description: t('api_key_required'),
 			});
 			setSavingState(false);
-			return { status: 'failed', statusMessage: t('api_key_required') };
+			return;
 		}
 
 		const response = await editOpsgenie(prepareOpsgenieRequest());
@@ -291,18 +271,13 @@ function EditAlertChannels({
 			});
 
 			history.replace(ROUTES.ALL_CHANNELS);
-			return { status: 'success', statusMessage: t('channel_edit_done') };
+		} else {
+			notifications.error({
+				message: 'Error',
+				description: response.error || t('channel_edit_failed'),
+			});
 		}
-		notifications.error({
-			message: 'Error',
-			description: response.error || t('channel_edit_failed'),
-		});
-
 		setSavingState(false);
-		return {
-			status: 'failed',
-			statusMessage: response.error || t('channel_edit_failed'),
-		};
 	}, [prepareOpsgenieRequest, t, notifications, selectedConfig]);
 
 	const prepareMsTeamsRequest = useCallback(
@@ -326,7 +301,7 @@ function EditAlertChannels({
 				description: t('webhook_url_required'),
 			});
 			setSavingState(false);
-			return { status: 'failed', statusMessage: t('webhook_url_required') };
+			return;
 		}
 
 		const response = await editMsTeamsApi(prepareMsTeamsRequest());
@@ -338,46 +313,31 @@ function EditAlertChannels({
 			});
 
 			history.replace(ROUTES.ALL_CHANNELS);
-			return { status: 'success', statusMessage: t('channel_edit_done') };
+		} else {
+			notifications.error({
+				message: 'Error',
+				description: response.error || t('channel_edit_failed'),
+			});
 		}
-		notifications.error({
-			message: 'Error',
-			description: response.error || t('channel_edit_failed'),
-		});
-
 		setSavingState(false);
-		return {
-			status: 'failed',
-			statusMessage: response.error || t('channel_edit_failed'),
-		};
 	}, [prepareMsTeamsRequest, t, notifications, selectedConfig]);
 
 	const onSaveHandler = useCallback(
-		async (value: ChannelType) => {
-			let result;
+		(value: ChannelType) => {
 			if (value === ChannelType.Slack) {
-				result = await onSlackEditHandler();
+				onSlackEditHandler();
 			} else if (value === ChannelType.Webhook) {
-				result = await onWebhookEditHandler();
+				onWebhookEditHandler();
 			} else if (value === ChannelType.Pagerduty) {
-				result = await onPagerEditHandler();
+				onPagerEditHandler();
 			} else if (value === ChannelType.MsTeams) {
-				result = await onMsTeamsEditHandler();
+				onMsTeamsEditHandler();
 			} else if (value === ChannelType.Opsgenie) {
-				result = await onOpsgenieEditHandler();
+				onOpsgenieEditHandler();
 			} else if (value === ChannelType.Email) {
-				result = await onEmailEditHandler();
+				onEmailEditHandler();
 			}
-			logEvent('Alert Channel: Save channel', {
-				type: value,
-				sendResolvedAlert: selectedConfig?.send_resolved,
-				name: selectedConfig?.name,
-				new: 'false',
-				status: result?.status,
-				statusMessage: result?.statusMessage,
-			});
 		},
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 		[
 			onSlackEditHandler,
 			onWebhookEditHandler,
@@ -439,14 +399,6 @@ function EditAlertChannels({
 						description: t('channel_test_failed'),
 					});
 				}
-				logEvent('Alert Channel: Test notification', {
-					type: channelType,
-					sendResolvedAlert: selectedConfig?.send_resolved,
-					name: selectedConfig?.name,
-					new: 'false',
-					status:
-						response && response.statusCode === 200 ? 'Test success' : 'Test failed',
-				});
 			} catch (error) {
 				notifications.error({
 					message: 'Error',
@@ -455,7 +407,6 @@ function EditAlertChannels({
 			}
 			setTestingState(false);
 		},
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 		[
 			t,
 			prepareWebhookRequest,

frontend/src/container/EmptyLogsSearch/EmptyLogsSearch.tsx

@@ -1,34 +1,8 @@
 import './EmptyLogsSearch.styles.scss';
 
 import { Typography } from 'antd';
-import logEvent from 'api/common/logEvent';
-import { useEffect, useRef } from 'react';
-import { DataSource, PanelTypeKeys } from 'types/common/queryBuilder';
-
-export default function EmptyLogsSearch({
-	dataSource,
-	panelType,
-}: {
-	dataSource: DataSource;
-	panelType: PanelTypeKeys;
-}): JSX.Element {
-	const logEventCalledRef = useRef(false);
-	useEffect(() => {
-		if (!logEventCalledRef.current) {
-			if (dataSource === DataSource.TRACES) {
-				logEvent('Traces Explorer: No results', {
-					panelType,
-				});
-			} else if (dataSource === DataSource.LOGS) {
-				logEvent('Logs Explorer: No results', {
-					panelType,
-				});
-			}
-			logEventCalledRef.current = true;
-		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
-	}, []);
 
+export default function EmptyLogsSearch(): JSX.Element {
 	return (
 		<div className="empty-logs-search-container">
 			<div className="empty-logs-search-container-content">

frontend/src/container/ErrorDetails/index.tsx

@@ -1,7 +1,6 @@
 import './styles.scss';
 
 import { Button, Divider, Space, Typography } from 'antd';
-import logEvent from 'api/common/logEvent';
 import getNextPrevId from 'api/errors/getNextPrevId';
 import Editor from 'components/Editor';
 import { ResizeTable } from 'components/ResizeTable';
@@ -10,9 +9,8 @@ import dayjs from 'dayjs';
 import { useNotifications } from 'hooks/useNotifications';
 import createQueryParams from 'lib/createQueryParams';
 import history from 'lib/history';
-import { isUndefined } from 'lodash-es';
 import { urlKey } from 'pages/ErrorDetails/utils';
-import { useEffect, useMemo, useRef, useState } from 'react';
+import { useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useQuery } from 'react-query';
 import { useLocation } from 'react-router-dom';
@@ -113,29 +111,9 @@ function ErrorDetails(props: ErrorDetailsProps): JSX.Element {
 		}));
 
 	const onClickTraceHandler = (): void => {
-		logEvent('Exception: Navigate to trace detail page', {
-			groupId: errorDetail?.groupID,
-			spanId: errorDetail.spanID,
-			traceId: errorDetail.traceID,
-			exceptionId: errorDetail?.errorId,
-		});
 		history.push(`/trace/${errorDetail.traceID}?spanId=${errorDetail.spanID}`);
 	};
 
-	const logEventCalledRef = useRef(false);
-	useEffect(() => {
-		if (!logEventCalledRef.current && !isUndefined(data)) {
-			logEvent('Exception: Detail page visited', {
-				groupId: errorDetail?.groupID,
-				spanId: errorDetail.spanID,
-				traceId: errorDetail.traceID,
-				exceptionId: errorDetail?.errorId,
-			});
-			logEventCalledRef.current = true;
-		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
-	}, [data]);
-
 	return (
 		<>
 			<Typography>{errorDetail.exceptionType}</Typography>

frontend/src/container/ExplorerOptions/ExplorerOptions.styles.scss

@@ -91,7 +91,8 @@
 			box-shadow: none !important;
 
 			&.ant-btn-round {
-				padding: 8px 12px 8px 10px;
+				padding-inline-start: 10px;
+				padding-inline-end: 8px;
 				font-weight: 500;
 			}
 

frontend/src/container/ExplorerOptions/ExplorerOptions.tsx

@@ -14,7 +14,6 @@ import {
 	Tooltip,
 	Typography,
 } from 'antd';
-import logEvent from 'api/common/logEvent';
 import axios from 'axios';
 import cx from 'classnames';
 import { getViewDetailsUsingViewKey } from 'components/ExplorerCard/utils';
@@ -94,23 +93,7 @@ function ExplorerOptions({
 		setIsExport(value);
 	}, []);
 
-	const {
-		currentQuery,
-		panelType,
-		isStagedQueryUpdated,
-		redirectWithQueryBuilderData,
-	} = useQueryBuilder();
-
 	const handleSaveViewModalToggle = (): void => {
-		if (sourcepage === DataSource.TRACES) {
-			logEvent('Traces Explorer: Save view clicked', {
-				panelType,
-			});
-		} else if (sourcepage === DataSource.LOGS) {
-			logEvent('Logs Explorer: Save view clicked', {
-				panelType,
-			});
-		}
 		setIsSaveModalOpen(!isSaveModalOpen);
 	};
 
@@ -121,21 +104,11 @@ function ExplorerOptions({
 	const { role } = useSelector<AppState, AppReducer>((state) => state.app);
 
 	const onCreateAlertsHandler = useCallback(() => {
-		if (sourcepage === DataSource.TRACES) {
-			logEvent('Traces Explorer: Create alert', {
-				panelType,
-			});
-		} else if (sourcepage === DataSource.LOGS) {
-			logEvent('Logs Explorer: Create alert', {
-				panelType,
-			});
-		}
 		history.push(
 			`${ROUTES.ALERTS_NEW}?${QueryParams.compositeQuery}=${encodeURIComponent(
 				JSON.stringify(query),
 			)}`,
 		);
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [history, query]);
 
 	const onCancel = (value: boolean) => (): void => {
@@ -143,15 +116,6 @@ function ExplorerOptions({
 	};
 
 	const onAddToDashboard = (): void => {
-		if (sourcepage === DataSource.TRACES) {
-			logEvent('Traces Explorer: Add to dashboard clicked', {
-				panelType,
-			});
-		} else if (sourcepage === DataSource.LOGS) {
-			logEvent('Logs Explorer: Add to dashboard clicked', {
-				panelType,
-			});
-		}
 		setIsExport(true);
 	};
 
@@ -163,6 +127,13 @@ function ExplorerOptions({
 		refetch: refetchAllView,
 	} = useGetAllViews(sourcepage);
 
+	const {
+		currentQuery,
+		panelType,
+		isStagedQueryUpdated,
+		redirectWithQueryBuilderData,
+	} = useQueryBuilder();
+
 	const compositeQuery = mapCompositeQueryFromQuery(currentQuery, panelType);
 
 	const viewName = useGetSearchQueryParam(QueryParams.viewName) || '';
@@ -253,17 +224,6 @@ function ExplorerOptions({
 		onMenuItemSelectHandler({
 			key: option.key,
 		});
-		if (sourcepage === DataSource.TRACES) {
-			logEvent('Traces Explorer: Select view', {
-				panelType,
-				viewName: option?.value,
-			});
-		} else if (sourcepage === DataSource.LOGS) {
-			logEvent('Logs Explorer: Select view', {
-				panelType,
-				viewName: option?.value,
-			});
-		}
 		if (ref.current) {
 			ref.current.blur();
 		}
@@ -299,17 +259,6 @@ function ExplorerOptions({
 			viewName: newViewName,
 			setNewViewName,
 		});
-		if (sourcepage === DataSource.TRACES) {
-			logEvent('Traces Explorer: Save view successful', {
-				panelType,
-				viewName: newViewName,
-			});
-		} else if (sourcepage === DataSource.LOGS) {
-			logEvent('Logs Explorer: Save view successful', {
-				panelType,
-				viewName: newViewName,
-			});
-		}
 	};
 
 	// TODO: Remove this and move this to scss file
@@ -550,7 +499,7 @@ function ExplorerOptions({
 
 export interface ExplorerOptionsProps {
 	isLoading?: boolean;
-	onExport: (dashboard: Dashboard | null, isNewDashboard?: boolean) => void;
+	onExport: (dashboard: Dashboard | null) => void;
 	query: Query | null;
 	disabled: boolean;
 	sourcepage: DataSource;

frontend/src/container/ExportPanel/ExportPanelContainer.tsx

@@ -1,6 +1,5 @@
 import { Button, Typography } from 'antd';
 import createDashboard from 'api/dashboard/create';
-import { ENTITY_VERSION_V4 } from 'constants/app';
 import { useGetAllDashboard } from 'hooks/dashboard/useGetAllDashboard';
 import useAxiosError from 'hooks/useAxiosError';
 import { useCallback, useMemo, useState } from 'react';
@@ -41,7 +40,7 @@ function ExportPanelContainer({
 	} = useMutation(createDashboard, {
 		onSuccess: (data) => {
 			if (data.payload) {
-				onExport(data?.payload, true);
+				onExport(data?.payload);
 			}
 			refetch();
 		},
@@ -55,7 +54,7 @@ function ExportPanelContainer({
 			({ uuid }) => uuid === selectedDashboardId,
 		);
 
-		onExport(currentSelectedDashboard || null, false);
+		onExport(currentSelectedDashboard || null);
 	}, [data, selectedDashboardId, onExport]);
 
 	const handleSelect = useCallback(
@@ -71,7 +70,6 @@ function ExportPanelContainer({
 				ns: 'dashboard',
 			}),
 			uploadedGrafana: false,
-			version: ENTITY_VERSION_V4,
 		});
 	}, [t, createNewDashboard]);
 

frontend/src/container/ExportPanel/index.tsx

@@ -40,7 +40,7 @@ function ExportPanel({
 
 export interface ExportPanelProps {
 	isLoading?: boolean;
-	onExport: (dashboard: Dashboard | null, isNewDashboard?: boolean) => void;
+	onExport: (dashboard: Dashboard | null) => void;
 	query: Query | null;
 }
 

frontend/src/container/FormAlertRules/BasicInfo.tsx

@@ -3,8 +3,6 @@ import './FormAlertRules.styles.scss';
 import { PlusOutlined } from '@ant-design/icons';
 import { Button, Form, Select, Switch, Tooltip } from 'antd';
 import getChannels from 'api/channels/getAll';
-import logEvent from 'api/common/logEvent';
-import { ALERTS_DATA_SOURCE_MAP } from 'constants/alerts';
 import ROUTES from 'constants/routes';
 import useComponentPermission from 'hooks/useComponentPermission';
 import useFetch from 'hooks/useFetch';
@@ -12,7 +10,6 @@ import { useCallback, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useSelector } from 'react-redux';
 import { AppState } from 'store/reducers';
-import { AlertTypes } from 'types/api/alerts/alertTypes';
 import { AlertDef, Labels } from 'types/api/alerts/def';
 import AppReducer from 'types/reducer/app';
 import { requireErrorMessage } from 'utils/form/requireErrorMessage';
@@ -76,24 +73,9 @@ function BasicInfo({
 
 	const noChannels = channels.payload?.length === 0;
 	const handleCreateNewChannels = useCallback(() => {
-		logEvent('Alert: Create notification channel button clicked', {
-			dataSource: ALERTS_DATA_SOURCE_MAP[alertDef?.alertType as AlertTypes],
-			ruleId: isNewRule ? 0 : alertDef?.id,
-		});
 		window.open(ROUTES.CHANNELS_NEW, '_blank');
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, []);
 
-	useEffect(() => {
-		if (!channels.loading && isNewRule) {
-			logEvent('Alert: New alert creation page visited', {
-				dataSource: ALERTS_DATA_SOURCE_MAP[alertDef?.alertType as AlertTypes],
-				numberOfChannels: channels?.payload?.length,
-			});
-		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
-	}, [channels.payload, channels.loading]);
-
 	return (
 		<>
 			<StepHeading> {t('alert_form_step3')} </StepHeading>

frontend/src/container/FormAlertRules/ChartPreview/index.tsx

@@ -48,7 +48,6 @@ export interface ChartPreviewProps {
 	userQueryKey?: string;
 	allowSelectedIntervalForStepGen?: boolean;
 	yAxisUnit: string;
-	setQueryStatus?: (status: string) => void;
 }
 
 // eslint-disable-next-line sonarjs/cognitive-complexity
@@ -63,7 +62,6 @@ function ChartPreview({
 	allowSelectedIntervalForStepGen = false,
 	alertDef,
 	yAxisUnit,
-	setQueryStatus,
 }: ChartPreviewProps): JSX.Element | null {
 	const { t } = useTranslation('alerts');
 	const dispatch = useDispatch();
@@ -151,10 +149,10 @@ function ChartPreview({
 
 	useEffect((): void => {
 		const { startTime, endTime } = getTimeRange(queryResponse);
-		if (setQueryStatus) setQueryStatus(queryResponse.status);
+
 		setMinTimeScale(startTime);
 		setMaxTimeScale(endTime);
-	}, [maxTime, minTime, globalSelectedInterval, queryResponse, setQueryStatus]);
+	}, [maxTime, minTime, globalSelectedInterval, queryResponse]);
 
 	if (queryResponse.data && graphType === PANEL_TYPES.BAR) {
 		const sortedSeriesData = getSortedSeriesData(
@@ -248,19 +246,17 @@ function ChartPreview({
 	return (
 		<ChartContainer>
 			{headline}
-
-			<div ref={graphRef} style={{ height: '100%' }}>
-				{queryResponse.isLoading && (
-					<Spinner size="large" tip="Loading..." height="100%" />
-				)}
-				{(queryResponse?.isError || queryResponse?.error) && (
-					<FailedMessageContainer color="red" title="Failed to refresh the chart">
-						<InfoCircleOutlined />{' '}
-						{queryResponse.error.message || t('preview_chart_unexpected_error')}
-					</FailedMessageContainer>
-				)}
-
-				{chartData && !queryResponse.isError && (
+			{(queryResponse?.isError || queryResponse?.error) && (
+				<FailedMessageContainer color="red" title="Failed to refresh the chart">
+					<InfoCircleOutlined />{' '}
+					{queryResponse.error.message || t('preview_chart_unexpected_error')}
+				</FailedMessageContainer>
+			)}
+			{chartData && !queryResponse.isError && (
+				<div ref={graphRef} style={{ height: '100%' }}>
+					{queryResponse.isLoading && (
+						<Spinner size="large" tip="Loading..." height="100%" />
+					)}
 					<GridPanelSwitch
 						options={options}
 						panelType={graphType}
@@ -272,8 +268,8 @@ function ChartPreview({
 						query={query || initialQueriesMap.metrics}
 						yAxisUnit={yAxisUnit}
 					/>
-				)}
-			</div>
+				</div>
+			)}
 		</ChartContainer>
 	);
 }
@@ -286,7 +282,6 @@ ChartPreview.defaultProps = {
 	userQueryKey: '',
 	allowSelectedIntervalForStepGen: false,
 	alertDef: undefined,
-	setQueryStatus: (): void => {},
 };
 
 export default ChartPreview;

frontend/src/container/FormAlertRules/QuerySection.tsx

@@ -2,7 +2,6 @@ import './QuerySection.styles.scss';
 
 import { Color } from '@signozhq/design-tokens';
 import { Button, Tabs, Tooltip } from 'antd';
-import logEvent from 'api/common/logEvent';
 import PromQLIcon from 'assets/Dashboard/PromQl';
 import { ALERTS_DATA_SOURCE_MAP } from 'constants/alerts';
 import { ENTITY_VERSION_V4 } from 'constants/app';
@@ -32,7 +31,6 @@ function QuerySection({
 	runQuery,
 	alertDef,
 	panelType,
-	ruleId,
 }: QuerySectionProps): JSX.Element {
 	// init namespace for translations
 	const { t } = useTranslation('alerts');
@@ -160,15 +158,7 @@ function QuerySection({
 								<span style={{ display: 'flex', gap: '1rem', alignItems: 'center' }}>
 									<Button
 										type="primary"
-										onClick={(): void => {
-											runQuery();
-											logEvent('Alert: Stage and run query', {
-												dataSource: ALERTS_DATA_SOURCE_MAP[alertType],
-												isNewRule: !ruleId || ruleId === 0,
-												ruleId,
-												queryType: queryCategory,
-											});
-										}}
+										onClick={runQuery}
 										className="stage-run-query"
 										icon={<Play size={14} />}
 									>
@@ -238,7 +228,6 @@ interface QuerySectionProps {
 	runQuery: VoidFunction;
 	alertDef: AlertDef;
 	panelType: PANEL_TYPES;
-	ruleId: number;
 }
 
 export default QuerySection;

frontend/src/container/FormAlertRules/index.tsx

@@ -12,10 +12,8 @@ import {
 } from 'antd';
 import saveAlertApi from 'api/alerts/save';
 import testAlertApi from 'api/alerts/testAlert';
-import logEvent from 'api/common/logEvent';
 import FacingIssueBtn from 'components/facingIssueBtn/FacingIssueBtn';
 import { alertHelpMessage } from 'components/facingIssueBtn/util';
-import { ALERTS_DATA_SOURCE_MAP } from 'constants/alerts';
 import { FeatureKeys } from 'constants/features';
 import { QueryParams } from 'constants/query';
 import { PANEL_TYPES } from 'constants/queryBuilder';
@@ -101,7 +99,6 @@ function FormAlertRules({
 	const isNewRule = ruleId === 0;
 
 	const [loading, setLoading] = useState(false);
-	const [queryStatus, setQueryStatus] = useState<string>('');
 
 	// alertDef holds the form values to be posted
 	const [alertDef, setAlertDef] = useState<AlertDef>(initialValue);
@@ -341,13 +338,8 @@ function FormAlertRules({
 			return;
 		}
 		const postableAlert = memoizedPreparePostData();
+
 		setLoading(true);
-
-		let logData = {
-			status: 'error',
-			statusMessage: t('unexpected_error'),
-		};
-
 		try {
 			const apiReq =
 				ruleId && ruleId > 0
@@ -357,15 +349,10 @@ function FormAlertRules({
 			const response = await saveAlertApi(apiReq);
 
 			if (response.statusCode === 200) {
-				logData = {
-					status: 'success',
-					statusMessage:
-						!ruleId || ruleId === 0 ? t('rule_created') : t('rule_edited'),
-				};
-
 				notifications.success({
 					message: 'Success',
-					description: logData.statusMessage,
+					description:
+						!ruleId || ruleId === 0 ? t('rule_created') : t('rule_edited'),
 				});
 
 				// invalidate rule in cache
@@ -380,42 +367,18 @@ function FormAlertRules({
 					history.replace(`${ROUTES.LIST_ALL_ALERT}?${urlQuery.toString()}`);
 				}, 2000);
 			} else {
-				logData = {
-					status: 'error',
-					statusMessage: response.error || t('unexpected_error'),
-				};
-
 				notifications.error({
 					message: 'Error',
-					description: logData.statusMessage,
+					description: response.error || t('unexpected_error'),
 				});
 			}
 		} catch (e) {
-			logData = {
-				status: 'error',
-				statusMessage: t('unexpected_error'),
-			};
-
 			notifications.error({
 				message: 'Error',
-				description: logData.statusMessage,
+				description: t('unexpected_error'),
 			});
 		}
-
 		setLoading(false);
-
-		logEvent('Alert: Save alert', {
-			...logData,
-			dataSource: ALERTS_DATA_SOURCE_MAP[postableAlert?.alertType as AlertTypes],
-			channelNames: postableAlert?.preferredChannels,
-			broadcastToAll: postableAlert?.broadcastToAll,
-			isNewRule: !ruleId || ruleId === 0,
-			ruleId,
-			queryType: currentQuery.queryType,
-			alertId: postableAlert?.id,
-			alertName: postableAlert?.alert,
-		});
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [
 		isFormValid,
 		memoizedPreparePostData,
@@ -451,7 +414,6 @@ function FormAlertRules({
 		}
 		const postableAlert = memoizedPreparePostData();
 
-		let statusResponse = { status: 'failed', message: '' };
 		setLoading(true);
 		try {
 			const response = await testAlertApi({ data: postableAlert });
@@ -463,43 +425,25 @@ function FormAlertRules({
 						message: 'Error',
 						description: t('no_alerts_found'),
 					});
-					statusResponse = { status: 'failed', message: t('no_alerts_found') };
 				} else {
 					notifications.success({
 						message: 'Success',
 						description: t('rule_test_fired'),
 					});
-					statusResponse = { status: 'success', message: t('rule_test_fired') };
 				}
 			} else {
 				notifications.error({
 					message: 'Error',
 					description: response.error || t('unexpected_error'),
 				});
-				statusResponse = {
-					status: 'failed',
-					message: response.error || t('unexpected_error'),
-				};
 			}
 		} catch (e) {
 			notifications.error({
 				message: 'Error',
 				description: t('unexpected_error'),
 			});
-			statusResponse = { status: 'failed', message: t('unexpected_error') };
 		}
 		setLoading(false);
-		logEvent('Alert: Test notification', {
-			dataSource: ALERTS_DATA_SOURCE_MAP[alertDef?.alertType as AlertTypes],
-			channelNames: postableAlert?.preferredChannels,
-			broadcastToAll: postableAlert?.broadcastToAll,
-			isNewRule: !ruleId || ruleId === 0,
-			ruleId,
-			queryType: currentQuery.queryType,
-			status: statusResponse.status,
-			statusMessage: statusResponse.message,
-		});
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [t, isFormValid, memoizedPreparePostData, notifications]);
 
 	const renderBasicInfo = (): JSX.Element => (
@@ -524,7 +468,6 @@ function FormAlertRules({
 			alertDef={alertDef}
 			yAxisUnit={yAxisUnit || ''}
 			graphType={panelType || PANEL_TYPES.TIME_SERIES}
-			setQueryStatus={setQueryStatus}
 		/>
 	);
 
@@ -542,7 +485,6 @@ function FormAlertRules({
 			selectedInterval={globalSelectedInterval}
 			yAxisUnit={yAxisUnit || ''}
 			graphType={panelType || PANEL_TYPES.TIME_SERIES}
-			setQueryStatus={setQueryStatus}
 		/>
 	);
 
@@ -571,16 +513,6 @@ function FormAlertRules({
 
 	const isRuleCreated = !ruleId || ruleId === 0;
 
-	useEffect(() => {
-		if (!isRuleCreated) {
-			logEvent('Alert: Edit page visited', {
-				ruleId,
-				dataSource: ALERTS_DATA_SOURCE_MAP[alertType as AlertTypes],
-			});
-		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
-	}, []);
-
 	function handleRedirection(option: AlertTypes): void {
 		let url = '';
 		switch (option) {
@@ -603,13 +535,6 @@ function FormAlertRules({
 			default:
 				break;
 		}
-		logEvent('Alert: Check example alert clicked', {
-			dataSource: ALERTS_DATA_SOURCE_MAP[alertDef?.alertType as AlertTypes],
-			isNewRule: !ruleId || ruleId === 0,
-			ruleId,
-			queryType: currentQuery.queryType,
-			link: url,
-		});
 		window.open(url, '_blank');
 	}
 
@@ -647,7 +572,6 @@ function FormAlertRules({
 							alertDef={alertDef}
 							panelType={panelType || PANEL_TYPES.TIME_SERIES}
 							key={currentQuery.queryType}
-							ruleId={ruleId}
 						/>
 
 						<RuleOptions
@@ -668,8 +592,7 @@ function FormAlertRules({
 									disabled={
 										isAlertNameMissing ||
 										isAlertAvailableToSave ||
-										!isChannelConfigurationValid ||
-										queryStatus === 'error'
+										!isChannelConfigurationValid
 									}
 								>
 									{isNewRule ? t('button_createrule') : t('button_savechanges')}
@@ -678,11 +601,7 @@ function FormAlertRules({
 
 							<ActionButton
 								loading={loading || false}
-								disabled={
-									isAlertNameMissing ||
-									!isChannelConfigurationValid ||
-									queryStatus === 'error'
-								}
+								disabled={isAlertNameMissing || !isChannelConfigurationValid}
 								type="default"
 								onClick={onTestRuleHandler}
 							>

frontend/src/container/GantChart/utils.ts

@@ -124,9 +124,6 @@ const getSpanWithoutChildren = (
 	value: span.value,
 	event: span.event,
 	hasError: span.hasError,
-	spanKind: span.spanKind,
-	statusCodeString: span.statusCodeString,
-	statusMessage: span.statusMessage,
 });
 
 export const isSpanPresentInSearchString = (

frontend/src/container/GridCardLayout/DashboardEmptyState/DashboardEmptyState.tsx

@@ -3,7 +3,6 @@ import './DashboardEmptyState.styles.scss';
 
 import { PlusOutlined } from '@ant-design/icons';
 import { Button, Typography } from 'antd';
-import logEvent from 'api/common/logEvent';
 import SettingsDrawer from 'container/NewDashboard/DashboardDescription/SettingsDrawer';
 import useComponentPermission from 'hooks/useComponentPermission';
 import { useDashboard } from 'providers/Dashboard/Dashboard';
@@ -37,12 +36,6 @@ export default function DashboardEmptyState(): JSX.Element {
 
 	const onEmptyWidgetHandler = useCallback(() => {
 		handleToggleDashboardSlider(true);
-		logEvent('Dashboard Detail: Add new panel clicked', {
-			dashboardId: selectedDashboard?.uuid,
-			dashboardName: selectedDashboard?.data.title,
-			numberOfPanels: selectedDashboard?.data.widgets?.length,
-		});
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [handleToggleDashboardSlider]);
 	return (
 		<section className="dashboard-empty-state">

frontend/src/container/GridCardLayout/GridCard/FullView/index.tsx

@@ -80,8 +80,6 @@ function FullView({
 				query: updatedQuery,
 				globalSelectedInterval: globalSelectedTime,
 				variables: getDashboardVariables(selectedDashboard?.data.variables),
-				fillGaps: widget.fillSpans,
-				formatForWeb: widget.panelTypes === PANEL_TYPES.TABLE,
 			};
 		}
 		updatedQuery.builder.queryData[0].pageSize = 10;

frontend/src/container/GridCardLayout/GridCard/index.tsx

@@ -14,7 +14,6 @@ import { memo, useEffect, useRef, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { UpdateTimeInterval } from 'store/actions';
 import { AppState } from 'store/reducers';
-import { DataSource } from 'types/common/queryBuilder';
 import { GlobalReducer } from 'types/reducer/globalTime';
 import { getGraphType } from 'utils/getGraphType';
 import { getSortedSeriesData } from 'utils/getSortedSeriesData';
@@ -110,11 +109,9 @@ function GridCardGraph({
 				globalSelectedInterval,
 				variables: getDashboardVariables(variables),
 				fillGaps: widget.fillSpans,
-				formatForWeb: widget.panelTypes === PANEL_TYPES.TABLE,
 			};
 		}
 		updatedQuery.builder.queryData[0].pageSize = 10;
-		const initialDataSource = updatedQuery.builder.queryData[0].dataSource;
 		return {
 			query: updatedQuery,
 			graphType: PANEL_TYPES.LIST,
@@ -125,9 +122,6 @@ function GridCardGraph({
 					offset: 0,
 					limit: updatedQuery.builder.queryData[0].limit || 0,
 				},
-				// we do not need select columns in case of logs
-				selectColumns:
-					initialDataSource === DataSource.TRACES && widget.selectedTracesFields,
 			},
 			fillGaps: widget.fillSpans,
 		};

frontend/src/container/GridCardLayout/GridCardLayout.styles.scss

@@ -1,7 +1,6 @@
 .fullscreen-grid-container {
 	overflow: auto;
 	margin: 8px -8px;
-	margin-right: 0;
 
 	.react-grid-layout {
 		border: none !important;
@@ -50,7 +49,7 @@
 	.footer {
 		display: flex;
 		flex-direction: column;
-		position: fixed;
+		position: absolute;
 		bottom: 0;
 		width: -webkit-fill-available;
 

frontend/src/container/GridCardLayout/GridCardLayout.tsx

@@ -3,7 +3,6 @@ import './GridCardLayout.styles.scss';
 import { Color } from '@signozhq/design-tokens';
 import { Button, Form, Input, Modal, Typography } from 'antd';
 import { useForm } from 'antd/es/form/Form';
-import logEvent from 'api/common/logEvent';
 import cx from 'classnames';
 import { SOMETHING_WENT_WRONG } from 'constants/api';
 import { QueryParams } from 'constants/query';
@@ -16,7 +15,7 @@ import { useIsDarkMode } from 'hooks/useDarkMode';
 import { useNotifications } from 'hooks/useNotifications';
 import useUrlQuery from 'hooks/useUrlQuery';
 import history from 'lib/history';
-import { defaultTo, isUndefined } from 'lodash-es';
+import { defaultTo } from 'lodash-es';
 import isEqual from 'lodash-es/isEqual';
 import {
 	Check,
@@ -28,7 +27,7 @@ import {
 } from 'lucide-react';
 import { useDashboard } from 'providers/Dashboard/Dashboard';
 import { sortLayout } from 'providers/Dashboard/util';
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { useCallback, useEffect, useMemo, useState } from 'react';
 import { FullScreen, FullScreenHandle } from 'react-full-screen';
 import { ItemCallback, Layout } from 'react-grid-layout';
 import { useDispatch, useSelector } from 'react-redux';
@@ -127,18 +126,6 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 		setDashboardLayout(sortLayout(layouts));
 	}, [layouts]);
 
-	const logEventCalledRef = useRef(false);
-	useEffect(() => {
-		if (!logEventCalledRef.current && !isUndefined(data)) {
-			logEvent('Dashboard Detail: Opened', {
-				dashboardId: data.uuid,
-				dashboardName: data.title,
-				numberOfPanels: data.widgets?.length,
-				numberOfVariables: Object.keys(data?.variables || {}).length || 0,
-			});
-			logEventCalledRef.current = true;
-		}
-	}, [data]);
 	const onSaveHandler = (): void => {
 		if (!selectedDashboard) return;
 
@@ -441,11 +428,7 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 	return isDashboardEmpty ? (
 		<DashboardEmptyState />
 	) : (
-		<FullScreen
-			handle={handle}
-			className="fullscreen-grid-container"
-			data-overlayscrollbars-initialize
-		>
+		<FullScreen handle={handle} className="fullscreen-grid-container">
 			<ReactGridLayout
 				cols={12}
 				rowHeight={45}

frontend/src/container/GridCardLayout/WidgetHeader/index.tsx

@@ -79,7 +79,7 @@ function WidgetHeader({
 		);
 	}, [widget.id, widget.panelTypes, widget.query]);
 
-	const onCreateAlertsHandler = useCreateAlerts(widget, 'dashboardView');
+	const onCreateAlertsHandler = useCreateAlerts(widget);
 
 	const onDownloadHandler = useCallback((): void => {
 		const csv = unparse(tableProcessedDataRef.current);
@@ -234,7 +234,6 @@ function WidgetHeader({
 				)}
 				<Dropdown menu={menu} trigger={['hover']} placement="bottomRight">
 					<MoreOutlined
-						data-testid="widget-header-options"
 						className={`widget-header-more-options ${
 							parentHover ? 'widget-header-hover' : ''
 						}`}

frontend/src/container/GridTableComponent/__tests__/response.ts

@@ -1,215 +0,0 @@
-export const tableDataMultipleQueriesSuccessResponse = {
-	columns: [
-		{
-			name: 'service_name',
-			queryName: '',
-			isValueColumn: false,
-		},
-		{
-			name: 'A',
-			queryName: 'A',
-			isValueColumn: true,
-		},
-		{
-			name: 'B',
-			queryName: 'B',
-			isValueColumn: true,
-		},
-	],
-	rows: [
-		{
-			data: {
-				A: 4196.71,
-				B: 'n/a',
-				service_name: 'demo-app',
-			},
-		},
-		{
-			data: {
-				A: 500.83,
-				B: 'n/a',
-				service_name: 'customer',
-			},
-		},
-		{
-			data: {
-				A: 499.5,
-				B: 'n/a',
-				service_name: 'mysql',
-			},
-		},
-		{
-			data: {
-				A: 293.22,
-				B: 'n/a',
-				service_name: 'frontend',
-			},
-		},
-		{
-			data: {
-				A: 230.03,
-				B: 'n/a',
-				service_name: 'driver',
-			},
-		},
-		{
-			data: {
-				A: 67.09,
-				B: 'n/a',
-				service_name: 'route',
-			},
-		},
-		{
-			data: {
-				A: 30.96,
-				B: 'n/a',
-				service_name: 'redis',
-			},
-		},
-		{
-			data: {
-				A: 'n/a',
-				B: 112.27,
-				service_name: 'n/a',
-			},
-		},
-	],
-};
-
-export const widgetQueryWithLegend = {
-	clickhouse_sql: [
-		{
-			name: 'A',
-			legend: '',
-			disabled: false,
-			query: '',
-		},
-	],
-	promql: [
-		{
-			name: 'A',
-			query: '',
-			legend: '',
-			disabled: false,
-		},
-	],
-	builder: {
-		queryData: [
-			{
-				dataSource: 'metrics',
-				queryName: 'A',
-				aggregateOperator: 'count',
-				aggregateAttribute: {
-					dataType: 'float64',
-					id: 'signoz_latency--float64--ExponentialHistogram--true',
-					isColumn: true,
-					isJSON: false,
-					key: 'signoz_latency',
-					type: 'ExponentialHistogram',
-				},
-				timeAggregation: '',
-				spaceAggregation: 'p90',
-				functions: [],
-				filters: {
-					items: [],
-					op: 'AND',
-				},
-				expression: 'A',
-				disabled: false,
-				stepInterval: 60,
-				having: [],
-				limit: null,
-				orderBy: [],
-				groupBy: [
-					{
-						dataType: 'string',
-						isColumn: false,
-						isJSON: false,
-						key: 'service_name',
-						type: 'tag',
-						id: 'service_name--string--tag--false',
-					},
-				],
-				legend: 'p99',
-				reduceTo: 'avg',
-			},
-			{
-				dataSource: 'metrics',
-				queryName: 'B',
-				aggregateOperator: 'rate',
-				aggregateAttribute: {
-					dataType: 'float64',
-					id: 'system_disk_operations--float64--Sum--true',
-					isColumn: true,
-					isJSON: false,
-					key: 'system_disk_operations',
-					type: 'Sum',
-				},
-				timeAggregation: 'rate',
-				spaceAggregation: 'sum',
-				functions: [],
-				filters: {
-					items: [],
-					op: 'AND',
-				},
-				expression: 'B',
-				disabled: false,
-				stepInterval: 60,
-				having: [],
-				limit: null,
-				orderBy: [],
-				groupBy: [],
-				legend: '',
-				reduceTo: 'avg',
-			},
-		],
-		queryFormulas: [],
-	},
-	id: '48ad5a67-9a3c-49d4-a886-d7a34f8b875d',
-	queryType: 'builder',
-};
-
-export const expectedOutputWithLegends = {
-	dataSource: [
-		{
-			A: 4196.71,
-			B: 'n/a',
-			service_name: 'demo-app',
-		},
-		{
-			A: 500.83,
-			B: 'n/a',
-			service_name: 'customer',
-		},
-		{
-			A: 499.5,
-			B: 'n/a',
-			service_name: 'mysql',
-		},
-		{
-			A: 293.22,
-			B: 'n/a',
-			service_name: 'frontend',
-		},
-		{
-			A: 230.03,
-			B: 'n/a',
-			service_name: 'driver',
-		},
-		{
-			A: 67.09,
-			B: 'n/a',
-			service_name: 'route',
-		},
-		{
-			A: 30.96,
-			B: 'n/a',
-			service_name: 'redis',
-		},
-		{
-			A: 'n/a',
-			B: 112.27,
-			service_name: 'n/a',
-		},
-	],
-};

frontend/src/container/GridTableComponent/__tests__/utils.test.tsx

@@ -1,130 +0,0 @@
-import { Query } from 'types/api/queryBuilder/queryBuilderData';
-
-import {
-	createColumnsAndDataSource,
-	getQueryLegend,
-	sortFunction,
-} from '../utils';
-import {
-	expectedOutputWithLegends,
-	tableDataMultipleQueriesSuccessResponse,
-	widgetQueryWithLegend,
-} from './response';
-
-describe('Table Panel utils', () => {
-	it('createColumnsAndDataSource function', () => {
-		const data = tableDataMultipleQueriesSuccessResponse;
-		const query = widgetQueryWithLegend as Query;
-
-		const { columns, dataSource } = createColumnsAndDataSource(data, query);
-
-		expect(dataSource).toStrictEqual(expectedOutputWithLegends.dataSource);
-
-		// this makes sure that the columns are rendered in the same order as response
-		expect(columns[0].title).toBe('service_name');
-		// the next specifically makes sure that the legends are properly applied in multiple queries
-		expect(columns[1].title).toBe('p99');
-		// this makes sure that the query without a legend takes the title from the query response
-		expect(columns[2].title).toBe('B');
-
-		// this is to ensure that the rows properly map to the column data indexes as the dataIndex should be equal to name of the columns
-		// returned in the response as the rows will be mapped with them
-		expect((columns[0] as any).dataIndex).toBe('service_name');
-		expect((columns[1] as any).dataIndex).toBe('A');
-		expect((columns[2] as any).dataIndex).toBe('B');
-	});
-
-	it('getQueryLegend function', () => {
-		const query = widgetQueryWithLegend as Query;
-
-		// query A has a legend of p99
-		expect(getQueryLegend(query, 'A')).toBe('p99');
-
-		// should return undefined when legend not present
-		expect(getQueryLegend(query, 'B')).toBe(undefined);
-	});
-
-	it('sorter function for table sorting', () => {
-		let rowA: {
-			A: string | number;
-			timestamp: number;
-			key: string;
-		} = {
-			A: 22.4,
-			timestamp: 111111,
-			key: '1111',
-		};
-		let rowB: {
-			A: string | number;
-			timestamp: number;
-			key: string;
-		} = {
-			A: 'n/a',
-			timestamp: 111112,
-			key: '1112',
-		};
-		const item = {
-			isValueColumn: true,
-			name: 'A',
-			queryName: 'A',
-		};
-		// A has value and value is considered bigger than n/a hence 1
-		expect(sortFunction(rowA, rowB, item)).toBe(1);
-
-		rowA = {
-			A: 'n/a',
-			timestamp: 111111,
-			key: '1111',
-		};
-		rowB = {
-			A: 22.4,
-			timestamp: 111112,
-			key: '1112',
-		};
-
-		// B has value and value is considered bigger than n/a hence -1
-		expect(sortFunction(rowA, rowB, item)).toBe(-1);
-
-		rowA = {
-			A: 11,
-			timestamp: 111111,
-			key: '1111',
-		};
-		rowB = {
-			A: 22,
-			timestamp: 111112,
-			key: '1112',
-		};
-
-		// A and B has value , since B > A hence A-B
-		expect(sortFunction(rowA, rowB, item)).toBe(-11);
-
-		rowA = {
-			A: 'read',
-			timestamp: 111111,
-			key: '1111',
-		};
-		rowB = {
-			A: 'write',
-			timestamp: 111112,
-			key: '1112',
-		};
-
-		// A and B are strings so A is smaller than B because r comes before w hence -1
-		expect(sortFunction(rowA, rowB, item)).toBe(-1);
-
-		rowA = {
-			A: 'n/a',
-			timestamp: 111111,
-			key: '1111',
-		};
-		rowB = {
-			A: 'n/a',
-			timestamp: 111112,
-			key: '1112',
-		};
-
-		// A and B are strings n/a , since both of them are same hence 0
-		expect(sortFunction(rowA, rowB, item)).toBe(0);
-	});
-});

frontend/src/container/GridTableComponent/index.tsx

@@ -3,7 +3,10 @@ import { Space, Tooltip } from 'antd';
 import { getYAxisFormattedValue } from 'components/Graph/yAxisConfig';
 import { Events } from 'constants/events';
 import { QueryTable } from 'container/QueryTable';
-import { RowData } from 'lib/query/createTableColumnsFromQuery';
+import {
+	createTableColumnsFromQuery,
+	RowData,
+} from 'lib/query/createTableColumnsFromQuery';
 import { cloneDeep, get, isEmpty, set } from 'lodash-es';
 import { memo, ReactNode, useCallback, useEffect, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -11,11 +14,7 @@ import { eventEmitter } from 'utils/getEventEmitter';
 
 import { WrapperStyled } from './styles';
 import { GridTableComponentProps } from './types';
-import {
-	createColumnsAndDataSource,
-	findMatchingThreshold,
-	TableData,
-} from './utils';
+import { findMatchingThreshold } from './utils';
 
 function GridTableComponent({
 	data,
@@ -26,26 +25,28 @@ function GridTableComponent({
 	...props
 }: GridTableComponentProps): JSX.Element {
 	const { t } = useTranslation(['valueGraph']);
-
-	// create columns and dataSource in the ui friendly structure
-	// use the query from the widget here to extract the legend information
 	const { columns, dataSource: originalDataSource } = useMemo(
-		() => createColumnsAndDataSource((data as unknown) as TableData, query),
-		[query, data],
+		() =>
+			createTableColumnsFromQuery({
+				query,
+				queryTableData: data,
+			}),
+		[data, query],
 	);
-
 	const createDataInCorrectFormat = useCallback(
 		(dataSource: RowData[]): RowData[] =>
 			dataSource.map((d) => {
 				const finalObject = {};
-
-				// we use the order of the columns here to have similar download as the user view
-				columns.forEach((k) => {
-					set(
-						finalObject,
-						get(k, 'title', '') as string,
-						get(d, get(k, 'dataIndex', ''), 'n/a'),
+				const keys = Object.keys(d);
+				keys.forEach((k) => {
+					const label = get(
+						columns.find((c) => get(c, 'dataIndex', '') === k) || {},
+						'title',
+						'',
 					);
+					if (label) {
+						set(finalObject, label as string, d[k]);
+					}
 				});
 				return finalObject as RowData;
 			}),
@@ -64,11 +65,7 @@ function GridTableComponent({
 					const newValue = { ...val };
 					Object.keys(val).forEach((k) => {
 						if (columnUnits[k]) {
-							// the check below takes care of not adding units for rows that have n/a values
-							newValue[k] =
-								val[k] !== 'n/a'
-									? getYAxisFormattedValue(String(val[k]), columnUnits[k])
-									: val[k];
+							newValue[k] = getYAxisFormattedValue(String(val[k]), columnUnits[k]);
 							newValue[`${k}_without_unit`] = val[k];
 						}
 					});

frontend/src/container/GridTableComponent/utils.ts

@@ -1,12 +1,4 @@
-/* eslint-disable sonarjs/cognitive-complexity */
-import { ColumnsType, ColumnType } from 'antd/es/table';
 import { ThresholdProps } from 'container/NewWidget/RightContainer/Threshold/types';
-import { QUERY_TABLE_CONFIG } from 'container/QueryTable/config';
-import { QueryTableProps } from 'container/QueryTable/QueryTable.intefaces';
-import { RowData } from 'lib/query/createTableColumnsFromQuery';
-import { isEmpty, isNaN } from 'lodash-es';
-import { Query } from 'types/api/queryBuilder/queryBuilderData';
-import { EQueryType } from 'types/common/dashboard';
 
 // Helper function to evaluate the condition based on the operator
 function evaluateCondition(
@@ -64,107 +56,3 @@ export function findMatchingThreshold(
 		hasMultipleMatches,
 	};
 }
-
-export interface TableData {
-	columns: { name: string; queryName: string; isValueColumn: boolean }[];
-	rows: { data: any }[];
-}
-
-export function getQueryLegend(
-	currentQuery: Query,
-	queryName: string,
-): string | undefined {
-	let legend: string | undefined;
-	switch (currentQuery.queryType) {
-		case EQueryType.QUERY_BUILDER:
-			// check if the value is present in the queries
-			legend = currentQuery.builder.queryData.find(
-				(query) => query.queryName === queryName,
-			)?.legend;
-
-			if (!legend) {
-				// check if the value is present in the formula
-				legend = currentQuery.builder.queryFormulas.find(
-					(query) => query.queryName === queryName,
-				)?.legend;
-			}
-			break;
-		case EQueryType.CLICKHOUSE:
-			legend = currentQuery.clickhouse_sql.find(
-				(query) => query.name === queryName,
-			)?.legend;
-			break;
-		case EQueryType.PROM:
-			legend = currentQuery.promql.find((query) => query.name === queryName)
-				?.legend;
-			break;
-		default:
-			legend = undefined;
-			break;
-	}
-
-	return legend;
-}
-
-export function sortFunction(
-	a: RowData,
-	b: RowData,
-	item: {
-		name: string;
-		queryName: string;
-		isValueColumn: boolean;
-	},
-): number {
-	// assumption :- number values is bigger than 'n/a'
-	const valueA = Number(a[`${item.name}_without_unit`] ?? a[item.name]);
-	const valueB = Number(b[`${item.name}_without_unit`] ?? b[item.name]);
-
-	// if both the values are numbers then return the difference here
-	if (!isNaN(valueA) && !isNaN(valueB)) {
-		return valueA - valueB;
-	}
-
-	// if valueB is a number then make it bigger value
-	if (isNaN(valueA) && !isNaN(valueB)) {
-		return -1;
-	}
-
-	// if valueA is number make it the bigger value
-	if (!isNaN(valueA) && isNaN(valueB)) {
-		return 1;
-	}
-
-	// if both of them are strings do the localecompare
-	return ((a[item.name] as string) || '').localeCompare(
-		(b[item.name] as string) || '',
-	);
-}
-export function createColumnsAndDataSource(
-	data: TableData,
-	currentQuery: Query,
-	renderColumnCell?: QueryTableProps['renderColumnCell'],
-): { columns: ColumnsType<RowData>; dataSource: RowData[] } {
-	const columns: ColumnsType<RowData> =
-		data.columns?.reduce<ColumnsType<RowData>>((acc, item) => {
-			// is the column is the value column then we need to check for the available legend
-			const legend = item.isValueColumn
-				? getQueryLegend(currentQuery, item.queryName)
-				: undefined;
-
-			const column: ColumnType<RowData> = {
-				dataIndex: item.name,
-				// if no legend present then rely on the column name value
-				title: !isEmpty(legend) ? legend : item.name,
-				width: QUERY_TABLE_CONFIG.width,
-				render: renderColumnCell && renderColumnCell[item.name],
-				sorter: (a: RowData, b: RowData): number => sortFunction(a, b, item),
-			};
-
-			return [...acc, column];
-		}, []) || [];
-
-	// the rows returned have data encapsulation hence removing the same here
-	const dataSource = data.rows?.map((d) => d.data) || [];
-
-	return { columns, dataSource };
-}

frontend/src/container/Header/index.tsx

@@ -27,7 +27,6 @@ import {
 import { useSelector } from 'react-redux';
 import { NavLink } from 'react-router-dom';
 import { AppState } from 'store/reducers';
-import { License } from 'types/api/licenses/def';
 import AppReducer from 'types/reducer/app';
 import { getFormattedDate, getRemainingDays } from 'utils/timeUtils';
 
@@ -110,13 +109,9 @@ function HeaderContainer(): JSX.Element {
 
 	const { data: licenseData, isFetching, status: licenseStatus } = useLicense();
 
-	const licensesStatus: string =
-		licenseData?.payload?.licenses?.find((e: License) => e.isCurrent)?.status ||
-		'';
-
 	const isLicenseActive =
-		licensesStatus?.toLocaleLowerCase() ===
-		LICENSE_PLAN_STATUS.VALID.toLocaleLowerCase();
+		licenseData?.payload?.licenses?.find((e) => e.isCurrent)?.status ===
+		LICENSE_PLAN_STATUS.VALID;
 
 	useEffect(() => {
 		if (

frontend/src/container/IngestionSettings/IngestionSettings.styles.scss

@@ -940,50 +940,3 @@
 		border-color: var(--bg-vanilla-300) !important;
 	}
 }
-
-.mt-8 {
-	margin-top: 8px;
-}
-
-.mt-12 {
-	margin-top: 12px;
-}
-
-.mt-24 {
-	margin-top: 24px;
-}
-
-.mb-24 {
-	margin-bottom: 24px;
-}
-
-.ingestion-setup-details-links {
-	display: flex;
-	align-items: center;
-	gap: 8px;
-	margin-bottom: 24px;
-	padding: 12px;
-	border-radius: 4px;
-	background: rgba(113, 144, 249, 0.1);
-	color: var(--bg-robin-300, #95acfb);
-
-	.learn-more {
-		display: inline-flex;
-		justify-content: center;
-		align-items: center;
-		text-decoration: underline;
-
-		color: var(--bg-robin-300, #95acfb);
-	}
-}
-
-.lightMode {
-	.ingestion-setup-details-links {
-		background: rgba(113, 144, 249, 0.1);
-		color: var(--bg-robin-500);
-
-		.learn-more {
-			color: var(--bg-robin-500);
-		}
-	}
-}

frontend/src/container/IngestionSettings/MultiIngestionSettings.tsx

@@ -34,14 +34,11 @@ import dayjs, { Dayjs } from 'dayjs';
 import { useGetAllIngestionsKeys } from 'hooks/IngestionKeys/useGetAllIngestionKeys';
 import useDebouncedFn from 'hooks/useDebouncedFunction';
 import { useNotifications } from 'hooks/useNotifications';
-import { isNil } from 'lodash-es';
 import {
-	ArrowUpRight,
 	CalendarClock,
 	Check,
 	Copy,
 	Infinity,
-	Info,
 	Minus,
 	PenLine,
 	Plus,
@@ -606,250 +603,243 @@ function MultiIngestionSettings(): JSX.Element {
 
 									<div className="limits-data">
 										<div className="signals">
-											{SIGNALS.map((signal) => {
-												const hasValidDayLimit = !isNil(limits[signal]?.config?.day?.size);
-												const hasValidSecondLimit = !isNil(
-													limits[signal]?.config?.second?.size,
-												);
-
-												return (
-													<div className="signal" key={signal}>
-														<div className="header">
-															<div className="signal-name">{signal}</div>
-															<div className="actions">
-																{hasLimits(signal) ? (
-																	<>
-																		<Button
-																			className="periscope-btn ghost"
-																			icon={<PenLine size={14} />}
-																			disabled={!!(activeAPIKey?.id === APIKey.id && activeSignal)}
-																			onClick={(e): void => {
-																				e.stopPropagation();
-																				e.preventDefault();
-																				enableEditLimitMode(APIKey, limits[signal]);
-																			}}
-																		/>
-
-																		<Button
-																			className="periscope-btn ghost"
-																			icon={<Trash2 color={Color.BG_CHERRY_500} size={14} />}
-																			disabled={!!(activeAPIKey?.id === APIKey.id && activeSignal)}
-																			onClick={(e): void => {
-																				e.stopPropagation();
-																				e.preventDefault();
-																				showDeleteLimitModal(APIKey, limits[signal]);
-																			}}
-																		/>
-																	</>
-																) : (
+											{SIGNALS.map((signal) => (
+												<div className="signal" key={signal}>
+													<div className="header">
+														<div className="signal-name">{signal}</div>
+														<div className="actions">
+															{hasLimits(signal) ? (
+																<>
 																	<Button
-																		className="periscope-btn"
-																		size="small"
-																		shape="round"
-																		icon={<PlusIcon size={14} />}
+																		className="periscope-btn ghost"
+																		icon={<PenLine size={14} />}
 																		disabled={!!(activeAPIKey?.id === APIKey.id && activeSignal)}
-																		// eslint-disable-next-line sonarjs/no-identical-functions
 																		onClick={(e): void => {
 																			e.stopPropagation();
 																			e.preventDefault();
-
-																			enableEditLimitMode(APIKey, {
-																				id: signal,
-																				signal,
-																				config: {},
-																			});
+																			enableEditLimitMode(APIKey, limits[signal]);
 																		}}
-																	>
-																		Limits
-																	</Button>
-																)}
-															</div>
-														</div>
+																	/>
 
-														<div className="signal-limit-values">
-															{activeAPIKey?.id === APIKey.id &&
-															activeSignal?.signal === signal &&
-															isEditAddLimitOpen ? (
-																<Form
-																	name="edit-ingestion-key-limit-form"
-																	key="addEditLimitForm"
-																	form={addEditLimitForm}
-																	autoComplete="off"
-																	initialValues={{
-																		dailyLimit: bytesToGb(limits[signal]?.config?.day?.size),
-																		secondsLimit: bytesToGb(limits[signal]?.config?.second?.size),
-																	}}
-																	className="edit-ingestion-key-limit-form"
-																>
-																	<div className="signal-limit-edit-mode">
-																		<div className="daily-limit">
-																			<div className="heading">
-																				<div className="title"> Daily limit </div>
-																				<div className="subtitle">
-																					Add a limit for data ingested daily{' '}
-																				</div>
-																			</div>
-
-																			<div className="size">
-																				<Form.Item name="dailyLimit">
-																					<InputNumber
-																						addonAfter={
-																							<Select defaultValue="GiB" disabled>
-																								<Option value="TiB"> TiB</Option>
-																								<Option value="GiB"> GiB</Option>
-																								<Option value="MiB"> MiB </Option>
-																								<Option value="KiB"> KiB </Option>
-																							</Select>
-																						}
-																					/>
-																				</Form.Item>
-																			</div>
-																		</div>
-
-																		<div className="second-limit">
-																			<div className="heading">
-																				<div className="title"> Per Second limit </div>
-																				<div className="subtitle">
-																					{' '}
-																					Add a limit for data ingested every second{' '}
-																				</div>
-																			</div>
-
-																			<div className="size">
-																				<Form.Item name="secondsLimit">
-																					<InputNumber
-																						addonAfter={
-																							<Select defaultValue="GiB" disabled>
-																								<Option value="TiB"> TiB</Option>
-																								<Option value="GiB"> GiB</Option>
-																								<Option value="MiB"> MiB </Option>
-																								<Option value="KiB"> KiB </Option>
-																							</Select>
-																						}
-																					/>
-																				</Form.Item>
-																			</div>
-																		</div>
-																	</div>
-
-																	{activeAPIKey?.id === APIKey.id &&
-																		activeSignal.signal === signal &&
-																		!isLoadingLimitForKey &&
-																		hasCreateLimitForIngestionKeyError &&
-																		createLimitForIngestionKeyError &&
-																		createLimitForIngestionKeyError?.error && (
-																			<div className="error">
-																				{createLimitForIngestionKeyError?.error}
-																			</div>
-																		)}
-
-																	{activeAPIKey?.id === APIKey.id &&
-																		activeSignal.signal === signal &&
-																		!isLoadingLimitForKey &&
-																		hasUpdateLimitForIngestionKeyError &&
-																		updateLimitForIngestionKeyError && (
-																			<div className="error">
-																				{updateLimitForIngestionKeyError?.error}
-																			</div>
-																		)}
-
-																	{activeAPIKey?.id === APIKey.id &&
-																		activeSignal.signal === signal &&
-																		isEditAddLimitOpen && (
-																			<div className="signal-limit-save-discard">
-																				<Button
-																					type="primary"
-																					className="periscope-btn primary"
-																					size="small"
-																					disabled={
-																						isLoadingLimitForKey || isLoadingUpdatedLimitForKey
-																					}
-																					loading={
-																						isLoadingLimitForKey || isLoadingUpdatedLimitForKey
-																					}
-																					onClick={(): void => {
-																						if (!hasLimits(signal)) {
-																							handleAddLimit(APIKey, signal);
-																						} else {
-																							handleUpdateLimit(APIKey, limits[signal]);
-																						}
-																					}}
-																				>
-																					Save
-																				</Button>
-																				<Button
-																					type="default"
-																					className="periscope-btn"
-																					size="small"
-																					disabled={
-																						isLoadingLimitForKey || isLoadingUpdatedLimitForKey
-																					}
-																					onClick={handleDiscardSaveLimit}
-																				>
-																					Discard
-																				</Button>
-																			</div>
-																		)}
-																</Form>
+																	<Button
+																		className="periscope-btn ghost"
+																		icon={<Trash2 color={Color.BG_CHERRY_500} size={14} />}
+																		disabled={!!(activeAPIKey?.id === APIKey.id && activeSignal)}
+																		onClick={(e): void => {
+																			e.stopPropagation();
+																			e.preventDefault();
+																			showDeleteLimitModal(APIKey, limits[signal]);
+																		}}
+																	/>
+																</>
 															) : (
-																<div className="signal-limit-view-mode">
-																	<div className="signal-limit-value">
-																		<div className="limit-type">
-																			Daily <Minus size={16} />{' '}
-																		</div>
+																<Button
+																	className="periscope-btn"
+																	size="small"
+																	shape="round"
+																	icon={<PlusIcon size={14} />}
+																	disabled={!!(activeAPIKey?.id === APIKey.id && activeSignal)}
+																	// eslint-disable-next-line sonarjs/no-identical-functions
+																	onClick={(e): void => {
+																		e.stopPropagation();
+																		e.preventDefault();
 
-																		<div className="limit-value">
-																			{hasValidDayLimit ? (
-																				<>
-																					{getYAxisFormattedValue(
-																						(limits[signal]?.metric?.day?.size || 0).toString(),
-																						'bytes',
-																					)}{' '}
-																					/{' '}
-																					{getYAxisFormattedValue(
-																						(limits[signal]?.config?.day?.size || 0).toString(),
-																						'bytes',
-																					)}
-																				</>
-																			) : (
-																				<>
-																					<Infinity size={16} /> NO LIMIT
-																				</>
-																			)}
-																		</div>
-																	</div>
-
-																	<div className="signal-limit-value">
-																		<div className="limit-type">
-																			Seconds <Minus size={16} />
-																		</div>
-
-																		<div className="limit-value">
-																			{hasValidSecondLimit ? (
-																				<>
-																					{getYAxisFormattedValue(
-																						(limits[signal]?.metric?.second?.size || 0).toString(),
-																						'bytes',
-																					)}{' '}
-																					/{' '}
-																					{getYAxisFormattedValue(
-																						(limits[signal]?.config?.second?.size || 0).toString(),
-																						'bytes',
-																					)}
-																				</>
-																			) : (
-																				<>
-																					<Infinity size={16} /> NO LIMIT
-																				</>
-																			)}
-																		</div>
-																	</div>
-																</div>
+																		enableEditLimitMode(APIKey, {
+																			id: signal,
+																			signal,
+																			config: {},
+																		});
+																	}}
+																>
+																	Limits
+																</Button>
 															)}
 														</div>
 													</div>
-												);
-											})}
+
+													<div className="signal-limit-values">
+														{activeAPIKey?.id === APIKey.id &&
+														activeSignal?.signal === signal &&
+														isEditAddLimitOpen ? (
+															<Form
+																name="edit-ingestion-key-limit-form"
+																key="addEditLimitForm"
+																form={addEditLimitForm}
+																autoComplete="off"
+																initialValues={{
+																	dailyLimit: bytesToGb(limits[signal]?.config?.day?.size),
+																	secondsLimit: bytesToGb(limits[signal]?.config?.second?.size),
+																}}
+																className="edit-ingestion-key-limit-form"
+															>
+																<div className="signal-limit-edit-mode">
+																	<div className="daily-limit">
+																		<div className="heading">
+																			<div className="title"> Daily limit </div>
+																			<div className="subtitle">
+																				Add a limit for data ingested daily{' '}
+																			</div>
+																		</div>
+
+																		<div className="size">
+																			<Form.Item name="dailyLimit">
+																				<InputNumber
+																					addonAfter={
+																						<Select defaultValue="GiB" disabled>
+																							<Option value="TiB"> TiB</Option>
+																							<Option value="GiB"> GiB</Option>
+																							<Option value="MiB"> MiB </Option>
+																							<Option value="KiB"> KiB </Option>
+																						</Select>
+																					}
+																				/>
+																			</Form.Item>
+																		</div>
+																	</div>
+
+																	<div className="second-limit">
+																		<div className="heading">
+																			<div className="title"> Per Second limit </div>
+																			<div className="subtitle">
+																				{' '}
+																				Add a limit for data ingested every second{' '}
+																			</div>
+																		</div>
+
+																		<div className="size">
+																			<Form.Item name="secondsLimit">
+																				<InputNumber
+																					addonAfter={
+																						<Select defaultValue="GiB" disabled>
+																							<Option value="TiB"> TiB</Option>
+																							<Option value="GiB"> GiB</Option>
+																							<Option value="MiB"> MiB </Option>
+																							<Option value="KiB"> KiB </Option>
+																						</Select>
+																					}
+																				/>
+																			</Form.Item>
+																		</div>
+																	</div>
+																</div>
+
+																{activeAPIKey?.id === APIKey.id &&
+																	activeSignal.signal === signal &&
+																	!isLoadingLimitForKey &&
+																	hasCreateLimitForIngestionKeyError &&
+																	createLimitForIngestionKeyError &&
+																	createLimitForIngestionKeyError?.error && (
+																		<div className="error">
+																			{createLimitForIngestionKeyError?.error}
+																		</div>
+																	)}
+
+																{activeAPIKey?.id === APIKey.id &&
+																	activeSignal.signal === signal &&
+																	!isLoadingLimitForKey &&
+																	hasUpdateLimitForIngestionKeyError &&
+																	updateLimitForIngestionKeyError && (
+																		<div className="error">
+																			{updateLimitForIngestionKeyError?.error}
+																		</div>
+																	)}
+
+																{activeAPIKey?.id === APIKey.id &&
+																	activeSignal.signal === signal &&
+																	isEditAddLimitOpen && (
+																		<div className="signal-limit-save-discard">
+																			<Button
+																				type="primary"
+																				className="periscope-btn primary"
+																				size="small"
+																				disabled={
+																					isLoadingLimitForKey || isLoadingUpdatedLimitForKey
+																				}
+																				loading={
+																					isLoadingLimitForKey || isLoadingUpdatedLimitForKey
+																				}
+																				onClick={(): void => {
+																					if (!hasLimits(signal)) {
+																						handleAddLimit(APIKey, signal);
+																					} else {
+																						handleUpdateLimit(APIKey, limits[signal]);
+																					}
+																				}}
+																			>
+																				Save
+																			</Button>
+																			<Button
+																				type="default"
+																				className="periscope-btn"
+																				size="small"
+																				disabled={
+																					isLoadingLimitForKey || isLoadingUpdatedLimitForKey
+																				}
+																				onClick={handleDiscardSaveLimit}
+																			>
+																				Discard
+																			</Button>
+																		</div>
+																	)}
+															</Form>
+														) : (
+															<div className="signal-limit-view-mode">
+																<div className="signal-limit-value">
+																	<div className="limit-type">
+																		Daily <Minus size={16} />{' '}
+																	</div>
+
+																	<div className="limit-value">
+																		{limits[signal]?.config?.day?.size ? (
+																			<>
+																				{getYAxisFormattedValue(
+																					(limits[signal]?.metric?.day?.size || 0).toString(),
+																					'bytes',
+																				)}{' '}
+																				/{' '}
+																				{getYAxisFormattedValue(
+																					(limits[signal]?.config?.day?.size || 0).toString(),
+																					'bytes',
+																				)}
+																			</>
+																		) : (
+																			<>
+																				<Infinity size={16} /> NO LIMIT
+																			</>
+																		)}
+																	</div>
+																</div>
+
+																<div className="signal-limit-value">
+																	<div className="limit-type">
+																		Seconds <Minus size={16} />
+																	</div>
+
+																	<div className="limit-value">
+																		{limits[signal]?.config?.second?.size ? (
+																			<>
+																				{getYAxisFormattedValue(
+																					(limits[signal]?.metric?.second?.size || 0).toString(),
+																					'bytes',
+																				)}{' '}
+																				/{' '}
+																				{getYAxisFormattedValue(
+																					(limits[signal]?.config?.second?.size || 0).toString(),
+																					'bytes',
+																				)}
+																			</>
+																		) : (
+																			<>
+																				<Infinity size={16} /> NO LIMIT
+																			</>
+																		)}
+																	</div>
+																</div>
+															</div>
+														)}
+													</div>
+												</div>
+											))}
 										</div>
 									</div>
 								</div>
@@ -885,35 +875,10 @@ function MultiIngestionSettings(): JSX.Element {
 	return (
 		<div className="ingestion-key-container">
 			<div className="ingestion-key-content">
-				<div className="ingestion-setup-details-links">
-					<Info size={14} />
-
-					<span>
-						Find your ingestion URL and learn more about sending data to SigNoz{' '}
-						<a
-							href="https://signoz.io/docs/ingestion/signoz-cloud/overview/"
-							target="_blank"
-							className="learn-more"
-							rel="noreferrer"
-						>
-							here <ArrowUpRight size={14} />
-						</a>
-					</span>
-				</div>
-
 				<header>
 					<Typography.Title className="title"> Ingestion Keys </Typography.Title>
 					<Typography.Text className="subtitle">
-						Create and manage ingestion keys for the SigNoz Cloud{' '}
-						<a
-							href="https://signoz.io/docs/ingestion/signoz-cloud/keys/"
-							target="_blank"
-							className="learn-more"
-							rel="noreferrer"
-						>
-							{' '}
-							Learn more <ArrowUpRight size={14} />
-						</a>
+						Create and manage ingestion keys for the SigNoz Cloud
 					</Typography.Text>
 				</header>
 

frontend/src/container/IngestionSettings/__tests__/MultiIngestionSettings.test.tsx

@@ -1,45 +0,0 @@
-import { render, screen } from 'tests/test-utils';
-
-import MultiIngestionSettings from '../MultiIngestionSettings';
-
-describe('MultiIngestionSettings Page', () => {
-	beforeEach(() => {
-		render(<MultiIngestionSettings />);
-	});
-
-	afterEach(() => {
-		jest.clearAllMocks();
-	});
-
-	it('renders MultiIngestionSettings page without crashing', () => {
-		expect(
-			screen.getByText(
-				'Find your ingestion URL and learn more about sending data to SigNoz',
-			),
-		).toBeInTheDocument();
-
-		expect(screen.getByText('Ingestion Keys')).toBeInTheDocument();
-
-		expect(
-			screen.getByText('Create and manage ingestion keys for the SigNoz Cloud'),
-		).toBeInTheDocument();
-
-		const overviewLink = screen.getByRole('link', { name: /here/i });
-		expect(overviewLink).toHaveAttribute(
-			'href',
-			'https://signoz.io/docs/ingestion/signoz-cloud/overview/',
-		);
-		expect(overviewLink).toHaveAttribute('target', '_blank');
-		expect(overviewLink).toHaveClass('learn-more');
-		expect(overviewLink).toHaveAttribute('rel', 'noreferrer');
-
-		const aboutKeyslink = screen.getByRole('link', { name: /Learn more/i });
-		expect(aboutKeyslink).toHaveAttribute(
-			'href',
-			'https://signoz.io/docs/ingestion/signoz-cloud/keys/',
-		);
-		expect(aboutKeyslink).toHaveAttribute('target', '_blank');
-		expect(aboutKeyslink).toHaveClass('learn-more');
-		expect(aboutKeyslink).toHaveAttribute('rel', 'noreferrer');
-	});
-});

frontend/src/container/ListAlertRules/AlertsEmptyState/AlertInfoCard.tsx

@@ -7,20 +7,17 @@ interface AlertInfoCardProps {
 	header: string;
 	subheader: string;
 	link: string;
-	onClick: () => void;
 }
 
 function AlertInfoCard({
 	header,
 	subheader,
 	link,
-	onClick,
 }: AlertInfoCardProps): JSX.Element {
 	return (
 		<div
 			className="alert-info-card"
 			onClick={(): void => {
-				onClick();
 				window.open(link, '_blank');
 			}}
 		>

frontend/src/container/ListAlertRules/AlertsEmptyState/AlertsEmptyState.tsx

@@ -2,7 +2,6 @@ import './AlertsEmptyState.styles.scss';
 
 import { PlusOutlined } from '@ant-design/icons';
 import { Button, Divider, Typography } from 'antd';
-import logEvent from 'api/common/logEvent';
 import ROUTES from 'constants/routes';
 import useComponentPermission from 'hooks/useComponentPermission';
 import { useNotifications } from 'hooks/useNotifications';
@@ -11,26 +10,12 @@ import { useCallback, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useSelector } from 'react-redux';
 import { AppState } from 'store/reducers';
-import { DataSource } from 'types/common/queryBuilder';
 import AppReducer from 'types/reducer/app';
 
 import AlertInfoCard from './AlertInfoCard';
 import { ALERT_CARDS, ALERT_INFO_LINKS } from './alertLinks';
 import InfoLinkText from './InfoLinkText';
 
-const alertLogEvents = (
-	title: string,
-	link: string,
-	dataSource?: DataSource,
-): void => {
-	const attributes = {
-		link,
-		page: 'Alert empty state page',
-	};
-
-	logEvent(title, dataSource ? { ...attributes, dataSource } : attributes);
-};
-
 export function AlertsEmptyState(): JSX.Element {
 	const { t } = useTranslation('common');
 	const { role, featureResponse } = useSelector<AppState, AppReducer>(
@@ -106,33 +91,18 @@ export function AlertsEmptyState(): JSX.Element {
 								link="https://youtu.be/xjxNIqiv4_M"
 								leftIconVisible
 								rightIconVisible
-								onClick={(): void =>
-									alertLogEvents(
-										'Alert: Video tutorial link clicked',
-										'https://youtu.be/xjxNIqiv4_M',
-									)
-								}
 							/>
 						</div>
 
-						{ALERT_INFO_LINKS.map((info) => {
-							const logEventTriggered = (): void =>
-								alertLogEvents(
-									'Alert: Tutorial doc link clicked',
-									info.link,
-									info.dataSource,
-								);
-							return (
-								<InfoLinkText
-									key={info.link}
-									infoText={info.infoText}
-									link={info.link}
-									leftIconVisible={info.leftIconVisible}
-									rightIconVisible={info.rightIconVisible}
-									onClick={logEventTriggered}
-								/>
-							);
-						})}
+						{ALERT_INFO_LINKS.map((info) => (
+							<InfoLinkText
+								key={info.link}
+								infoText={info.infoText}
+								link={info.link}
+								leftIconVisible={info.leftIconVisible}
+								rightIconVisible={info.rightIconVisible}
+							/>
+						))}
 					</div>
 				</section>
 				<div className="get-started-text">
@@ -143,23 +113,14 @@ export function AlertsEmptyState(): JSX.Element {
 					</Divider>
 				</div>
 
-				{ALERT_CARDS.map((card) => {
-					const logEventTriggered = (): void =>
-						alertLogEvents(
-							'Alert: Sample alert link clicked',
-							card.link,
-							card.dataSource,
-						);
-					return (
-						<AlertInfoCard
-							key={card.link}
-							header={card.header}
-							subheader={card.subheader}
-							link={card.link}
-							onClick={logEventTriggered}
-						/>
-					);
-				})}
+				{ALERT_CARDS.map((card) => (
+					<AlertInfoCard
+						key={card.link}
+						header={card.header}
+						subheader={card.subheader}
+						link={card.link}
+					/>
+				))}
 			</div>
 		</div>
 	);

frontend/src/container/ListAlertRules/AlertsEmptyState/InfoLinkText.tsx

@@ -6,7 +6,6 @@ interface InfoLinkTextProps {
 	link: string;
 	leftIconVisible: boolean;
 	rightIconVisible: boolean;
-	onClick: () => void;
 }
 
 function InfoLinkText({
@@ -14,12 +13,10 @@ function InfoLinkText({
 	link,
 	leftIconVisible,
 	rightIconVisible,
-	onClick,
 }: InfoLinkTextProps): JSX.Element {
 	return (
 		<Flex
 			onClick={(): void => {
-				onClick();
 				window.open(link, '_blank');
 			}}
 			className="info-link-container"

frontend/src/container/ListAlertRules/AlertsEmptyState/alertLinks.ts

@@ -1,5 +1,3 @@
-import { DataSource } from 'types/common/queryBuilder';
-
 export const ALERT_INFO_LINKS = [
 	{
 		infoText: 'How to create Metrics-based alerts',
@@ -7,7 +5,6 @@ export const ALERT_INFO_LINKS = [
 			'https://signoz.io/docs/alerts-management/metrics-based-alerts/?utm_source=product&utm_medium=alert-empty-page',
 		leftIconVisible: false,
 		rightIconVisible: true,
-		dataSource: DataSource.METRICS,
 	},
 	{
 		infoText: 'How to create Log-based alerts',
@@ -15,7 +12,6 @@ export const ALERT_INFO_LINKS = [
 			'https://signoz.io/docs/alerts-management/log-based-alerts/?utm_source=product&utm_medium=alert-empty-page',
 		leftIconVisible: false,
 		rightIconVisible: true,
-		dataSource: DataSource.LOGS,
 	},
 	{
 		infoText: 'How to create Trace-based alerts',
@@ -23,7 +19,6 @@ export const ALERT_INFO_LINKS = [
 			'https://signoz.io/docs/alerts-management/trace-based-alerts/?utm_source=product&utm_medium=alert-empty-page',
 		leftIconVisible: false,
 		rightIconVisible: true,
-		dataSource: DataSource.TRACES,
 	},
 ];
 
@@ -31,28 +26,24 @@ export const ALERT_CARDS = [
 	{
 		header: 'Alert on high memory usage',
 		subheader: "Monitor your host's memory usage",
-		dataSource: DataSource.METRICS,
 		link:
 			'https://signoz.io/docs/alerts-management/metrics-based-alerts/?utm_source=product&utm_medium=alert-empty-page#1-alert-when-memory-usage-for-host-goes-above-400-mb-or-any-fixed-memory',
 	},
 	{
 		header: 'Alert on slow external API calls',
 		subheader: 'Monitor your external API calls',
-		dataSource: DataSource.TRACES,
 		link:
 			'https://signoz.io/docs/alerts-management/trace-based-alerts/?utm_source=product&utm_medium=alert-empty-page#1-alert-when-external-api-latency-p90-is-over-1-second-for-last-5-mins',
 	},
 	{
 		header: 'Alert on high percentage of timeout errors in logs',
 		subheader: 'Monitor your logs for errors',
-		dataSource: DataSource.LOGS,
 		link:
 			'https://signoz.io/docs/alerts-management/log-based-alerts/?utm_source=product&utm_medium=alert-empty-page#1-alert-when-percentage-of-redis-timeout-error-logs-greater-than-7-in-last-5-mins',
 	},
 	{
 		header: 'Alert on high error percentage of an endpoint',
 		subheader: 'Monitor your API endpoint',
-		dataSource: DataSource.METRICS,
 		link:
 			'https://signoz.io/docs/alerts-management/metrics-based-alerts/?utm_source=product&utm_medium=alert-empty-page#3-alert-when-the-error-percentage-for-an-endpoint-exceeds-5',
 	},

frontend/src/container/ListAlertRules/ListAlert.tsx

@@ -3,7 +3,6 @@ import { PlusOutlined } from '@ant-design/icons';
 import { Input, Typography } from 'antd';
 import type { ColumnsType } from 'antd/es/table/interface';
 import saveAlertApi from 'api/alerts/save';
-import logEvent from 'api/common/logEvent';
 import DropDown from 'components/DropDown/DropDown';
 import { listAlertMessage } from 'components/facingIssueBtn/util';
 import {
@@ -42,7 +41,7 @@ import {
 } from './styles';
 import Status from './TableComponents/Status';
 import ToggleAlertState from './ToggleAlertState';
-import { alertActionLogEvent, filterAlerts } from './utils';
+import { filterAlerts } from './utils';
 
 const { Search } = Input;
 
@@ -108,16 +107,12 @@ function ListAlert({ allAlertRules, refetch }: ListAlertProps): JSX.Element {
 	}, [notificationsApi, t]);
 
 	const onClickNewAlertHandler = useCallback(() => {
-		logEvent('Alert: New alert button clicked', {
-			number: allAlertRules?.length,
-		});
 		featureResponse
 			.refetch()
 			.then(() => {
 				history.push(ROUTES.ALERTS_NEW);
 			})
 			.catch(handleError);
-		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [featureResponse, handleError]);
 
 	const onEditHandler = (record: GettableAlert) => (): void => {
@@ -326,7 +321,6 @@ function ListAlert({ allAlertRules, refetch }: ListAlertProps): JSX.Element {
 			width: 10,
 			render: (id: GettableAlert['id'], record): JSX.Element => (
 				<DropDown
-					onDropDownItemClick={(item): void => alertActionLogEvent(item.key, record)}
 					element={[
 						<ToggleAlertState
 							key="1"
@@ -362,9 +356,6 @@ function ListAlert({ allAlertRules, refetch }: ListAlertProps): JSX.Element {
 		});
 	}
 
-	const paginationConfig = {
-		defaultCurrent: Number(paginationParam) || 1,
-	};
 	return (
 		<>
 			<SearchContainer>
@@ -394,10 +385,11 @@ function ListAlert({ allAlertRules, refetch }: ListAlertProps): JSX.Element {
 				columns={columns}
 				rowKey="id"
 				dataSource={data}
-				shouldSendAlertsLogEvent
 				dynamicColumns={dynamicColumns}
 				onChange={handleChange}
-				pagination={paginationConfig}
+				pagination={{
+					defaultCurrent: Number(paginationParam) || 1,
+				}}
 				facingIssueBtn={{
 					attributes: {
 						screen: 'Alert list page',

frontend/src/container/ListAlertRules/index.tsx

@@ -1,11 +1,9 @@
 import { Space } from 'antd';
 import getAll from 'api/alerts/getAll';
-import logEvent from 'api/common/logEvent';
 import ReleaseNote from 'components/ReleaseNote';
 import Spinner from 'components/Spinner';
 import { useNotifications } from 'hooks/useNotifications';
-import { isUndefined } from 'lodash-es';
-import { useEffect, useRef } from 'react';
+import { useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useQuery } from 'react-query';
 import { useLocation } from 'react-router-dom';
@@ -21,19 +19,8 @@ function ListAlertRules(): JSX.Element {
 		cacheTime: 0,
 	});
 
-	const logEventCalledRef = useRef(false);
-
 	const { notifications } = useNotifications();
 
-	useEffect(() => {
-		if (!logEventCalledRef.current && !isUndefined(data?.payload)) {
-			logEvent('Alert: List page visited', {
-				number: data?.payload?.length,
-			});
-			logEventCalledRef.current = true;
-		}
-	}, [data?.payload]);
-
 	useEffect(() => {
 		if (status === 'error' || (status === 'success' && data.statusCode >= 400)) {
 			notifications.error({

frontend/src/container/ListAlertRules/utils.ts

@@ -1,6 +1,3 @@
-import logEvent from 'api/common/logEvent';
-import { ALERTS_DATA_SOURCE_MAP } from 'constants/alerts';
-import { AlertTypes } from 'types/api/alerts/alertTypes';
 import { GettableAlert } from 'types/api/alerts/get';
 
 export const filterAlerts = (
@@ -26,32 +23,3 @@ export const filterAlerts = (
 		);
 	});
 };
-
-export const alertActionLogEvent = (
-	action: string,
-	record: GettableAlert,
-): void => {
-	let actionValue = '';
-	switch (action) {
-		case '0':
-			actionValue = 'Enable/Disable';
-			break;
-		case '1':
-			actionValue = 'Edit';
-			break;
-		case '2':
-			actionValue = 'Clone';
-			break;
-		case '3':
-			actionValue = 'Delete';
-			break;
-		default:
-			break;
-	}
-	logEvent('Alert: Action', {
-		ruleId: record?.id,
-		dataSource: ALERTS_DATA_SOURCE_MAP[record.alertType as AlertTypes],
-		name: record?.alert,
-		action: actionValue,
-	});
-};

frontend/src/container/ListOfDashboard/DashboardsList.tsx

@@ -21,7 +21,6 @@ import {
 	Typography,
 } from 'antd';
 import { TableProps } from 'antd/lib';
-import logEvent from 'api/common/logEvent';
 import createDashboard from 'api/dashboard/create';
 import { AxiosError } from 'axios';
 import cx from 'classnames';
@@ -35,7 +34,7 @@ import { useGetAllDashboard } from 'hooks/dashboard/useGetAllDashboard';
 import useComponentPermission from 'hooks/useComponentPermission';
 import { useNotifications } from 'hooks/useNotifications';
 import history from 'lib/history';
-import { get, isEmpty, isUndefined } from 'lodash-es';
+import { get, isEmpty } from 'lodash-es';
 import {
 	ArrowDownWideNarrow,
 	ArrowUpRight,
@@ -61,7 +60,6 @@ import {
 	useCallback,
 	useEffect,
 	useMemo,
-	useRef,
 	useState,
 } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -73,6 +71,7 @@ import { Dashboard } from 'types/api/dashboard/getAll';
 import AppReducer from 'types/reducer/app';
 import { isCloudUser } from 'utils/app';
 
+import useUrlQuery from '../../hooks/useUrlQuery';
 import DashboardTemplatesModal from './DashboardTemplates/DashboardTemplatesModal';
 import ImportJSON from './ImportJSON';
 import { DeleteButton } from './TableComponents/DeleteButton';
@@ -85,7 +84,7 @@ import {
 // eslint-disable-next-line sonarjs/cognitive-complexity
 function DashboardsList(): JSX.Element {
 	const {
-		data: dashboardListResponse,
+		data: dashboardListResponse = [],
 		isLoading: isDashboardListLoading,
 		error: dashboardFetchError,
 		refetch: refetchDashboardList,
@@ -98,14 +97,12 @@ function DashboardsList(): JSX.Element {
 		setListSortOrder: setSortOrder,
 	} = useDashboard();
 
-	const [searchString, setSearchString] = useState<string>(
-		sortOrder.search || '',
-	);
 	const [action, createNewDashboard] = useComponentPermission(
 		['action', 'create_new_dashboards'],
 		role,
 	);
 
+	const [searchValue, setSearchValue] = useState<string>('');
 	const [
 		showNewDashboardTemplatesModal,
 		setShowNewDashboardTemplatesModal,
@@ -124,6 +121,10 @@ function DashboardsList(): JSX.Element {
 		false,
 	);
 
+	const params = useUrlQuery();
+	const searchParams = params.get('search');
+	const [searchString, setSearchString] = useState<string>(searchParams || '');
+
 	const getLocalStorageDynamicColumns = (): DashboardDynamicColumns => {
 		const dashboardDynamicColumnsString = localStorage.getItem('dashboard');
 		let dashboardDynamicColumns: DashboardDynamicColumns = {
@@ -185,6 +186,14 @@ function DashboardsList(): JSX.Element {
 		setDashboards(sortedDashboards);
 	};
 
+	useEffect(() => {
+		params.set('columnKey', sortOrder.columnKey as string);
+		params.set('order', sortOrder.order as string);
+		params.set('page', sortOrder.pagination || '1');
+		history.replace({ search: params.toString() });
+		// eslint-disable-next-line react-hooks/exhaustive-deps
+	}, [sortOrder]);
+
 	const sortHandle = (key: string): void => {
 		if (!dashboards) return;
 		if (key === 'createdAt') {
@@ -193,7 +202,6 @@ function DashboardsList(): JSX.Element {
 				columnKey: 'createdAt',
 				order: 'descend',
 				pagination: sortOrder.pagination || '1',
-				search: sortOrder.search || '',
 			});
 		} else if (key === 'updatedAt') {
 			sortDashboardsByUpdatedAt(dashboards);
@@ -201,19 +209,21 @@ function DashboardsList(): JSX.Element {
 				columnKey: 'updatedAt',
 				order: 'descend',
 				pagination: sortOrder.pagination || '1',
-				search: sortOrder.search || '',
 			});
 		}
 	};
 
 	function handlePageSizeUpdate(page: number): void {
-		setSortOrder({ ...sortOrder, pagination: String(page) });
+		setSortOrder((order) => ({
+			...order,
+			pagination: String(page),
+		}));
 	}
 
 	useEffect(() => {
 		const filteredDashboards = filterDashboard(
 			searchString,
-			dashboardListResponse || [],
+			dashboardListResponse,
 		);
 		if (sortOrder.columnKey === 'updatedAt') {
 			sortDashboardsByUpdatedAt(filteredDashboards || []);
@@ -224,7 +234,6 @@ function DashboardsList(): JSX.Element {
 				columnKey: 'updatedAt',
 				order: 'descend',
 				pagination: sortOrder.pagination || '1',
-				search: sortOrder.search || '',
 			});
 			sortDashboardsByUpdatedAt(filteredDashboards || []);
 		}
@@ -234,7 +243,6 @@ function DashboardsList(): JSX.Element {
 		setSortOrder,
 		sortOrder.columnKey,
 		sortOrder.pagination,
-		sortOrder.search,
 	]);
 
 	const [newDashboardState, setNewDashboardState] = useState({
@@ -261,7 +269,6 @@ function DashboardsList(): JSX.Element {
 
 	const onNewDashboardHandler = useCallback(async () => {
 		try {
-			logEvent('Dashboard List: Create dashboard clicked', {});
 			setNewDashboardState({
 				...newDashboardState,
 				loading: true,
@@ -298,23 +305,18 @@ function DashboardsList(): JSX.Element {
 	}, [newDashboardState, t]);
 
 	const onModalHandler = (uploadedGrafana: boolean): void => {
-		logEvent('Dashboard List: Import JSON clicked', {});
-
 		setIsImportJSONModalVisible((state) => !state);
 		setUploadedGrafana(uploadedGrafana);
 	};
 
 	const handleSearch = (event: ChangeEvent<HTMLInputElement>): void => {
 		setIsFilteringDashboards(true);
+		setSearchValue(event.target.value);
 		const searchText = (event as React.BaseSyntheticEvent)?.target?.value || '';
-		const filteredDashboards = filterDashboard(
-			searchText,
-			dashboardListResponse || [],
-		);
+		const filteredDashboards = filterDashboard(searchText, dashboardListResponse);
 		setDashboards(filteredDashboards);
 		setIsFilteringDashboards(false);
 		setSearchString(searchText);
-		setSortOrder({ ...sortOrder, search: searchText });
 	};
 
 	const [state, setCopy] = useCopyToClipboard();
@@ -405,7 +407,7 @@ function DashboardsList(): JSX.Element {
 		{
 			title: 'Dashboards',
 			key: 'dashboard',
-			render: (dashboard: Data, _, index): JSX.Element => {
+			render: (dashboard: Data): JSX.Element => {
 				const timeOptions: Intl.DateTimeFormatOptions = {
 					hour: '2-digit',
 					minute: '2-digit',
@@ -439,10 +441,6 @@ function DashboardsList(): JSX.Element {
 					} else {
 						history.push(getLink());
 					}
-					logEvent('Dashboard List: Clicked on dashboard', {
-						dashboardId: dashboard.id,
-						dashboardName: dashboard.name,
-					});
 				};
 
 				return (
@@ -454,9 +452,7 @@ function DashboardsList(): JSX.Element {
 									style={{ height: '14px', width: '14px' }}
 									alt="dashboard-image"
 								/>
-								<Typography.Text data-testid={`dashboard-title-${index}`}>
-									{dashboard.name}
-								</Typography.Text>
+								<Typography.Text>{dashboard.name}</Typography.Text>
 							</div>
 
 							<div className="tags-with-actions">
@@ -613,31 +609,6 @@ function DashboardsList(): JSX.Element {
 		</>
 	);
 
-	const paginationConfig = data.length > 20 && {
-		pageSize: 20,
-		showTotal: showPaginationItem,
-		showSizeChanger: false,
-		onChange: (page: any): void => handlePageSizeUpdate(page),
-		current: Number(sortOrder.pagination),
-		defaultCurrent: Number(sortOrder.pagination) || 1,
-		hideOnSinglePage: true,
-	};
-
-	const logEventCalledRef = useRef(false);
-	useEffect(() => {
-		if (
-			!logEventCalledRef.current &&
-			!isDashboardListLoading &&
-			!isUndefined(dashboardListResponse)
-		) {
-			logEvent('Dashboard List: Page visited', {
-				number: dashboardListResponse?.length,
-			});
-			logEventCalledRef.current = true;
-		}
-		// eslint-disable-next-line react-hooks/exhaustive-deps
-	}, [isDashboardListLoading]);
-
 	return (
 		<div className="dashboards-list-container">
 			<div className="dashboards-list-view-content">
@@ -653,9 +624,8 @@ function DashboardsList(): JSX.Element {
 							}}
 							eventName="Dashboard: Facing Issues in dashboard"
 							message={dashboardListMessage}
-							buttonText="Need help with dashboards?"
+							buttonText="Facing issues with dashboards?"
 							onHoverText="Click here to get help with dashboards"
-							intercomMessageDisabled
 						/>
 					</Flex>
 				</div>
@@ -697,7 +667,7 @@ function DashboardsList(): JSX.Element {
 							<ArrowUpRight size={16} className="learn-more-arrow" />
 						</section>
 					</div>
-				) : dashboards?.length === 0 && !searchString ? (
+				) : dashboards?.length === 0 && !searchValue ? (
 					<div className="dashboard-empty-state">
 						<img
 							src="/Icons/dashboards.svg"
@@ -725,9 +695,6 @@ function DashboardsList(): JSX.Element {
 										type="text"
 										className="new-dashboard"
 										icon={<Plus size={14} />}
-										onClick={(): void => {
-											logEvent('Dashboard List: New dashboard clicked', {});
-										}}
 									>
 										New Dashboard
 									</Button>
@@ -735,7 +702,6 @@ function DashboardsList(): JSX.Element {
 								<Button
 									type="text"
 									className="learn-more"
-									data-testid="learn-more"
 									onClick={(): void => {
 										window.open(
 											'https://signoz.io/docs/userguide/manage-dashboards?utm_source=product&utm_medium=dashboard-list-empty-state',
@@ -755,7 +721,7 @@ function DashboardsList(): JSX.Element {
 							<Input
 								placeholder="Search by name, description, or tags..."
 								prefix={<Search size={12} color={Color.BG_VANILLA_400} />}
-								value={searchString}
+								value={searchValue}
 								onChange={handleSearch}
 							/>
 							{createNewDashboard && (
@@ -769,9 +735,6 @@ function DashboardsList(): JSX.Element {
 										type="primary"
 										className="periscope-btn primary btn"
 										icon={<Plus size={14} />}
-										onClick={(): void => {
-											logEvent('Dashboard List: New dashboard clicked', {});
-										}}
 									>
 										New dashboard
 									</Button>
@@ -783,7 +746,7 @@ function DashboardsList(): JSX.Element {
 							<div className="no-search">
 								<img src="/Icons/emptyState.svg" alt="img" className="img" />
 								<Typography.Text className="text">
-									No dashboards found for {searchString}. Create a new dashboard?
+									No dashboards found for {searchValue}. Create a new dashboard?
 								</Typography.Text>
 							</div>
 						) : (
@@ -805,7 +768,6 @@ function DashboardsList(): JSX.Element {
 															type="text"
 															className={cx('sort-btns')}
 															onClick={(): void => sortHandle('createdAt')}
-															data-testid="sort-by-last-created"
 														>
 															Last created
 															{sortOrder.columnKey === 'createdAt' && <Check size={14} />}
@@ -814,7 +776,6 @@ function DashboardsList(): JSX.Element {
 															type="text"
 															className={cx('sort-btns')}
 															onClick={(): void => sortHandle('updatedAt')}
-															data-testid="sort-by-last-updated"
 														>
 															Last updated
 															{sortOrder.columnKey === 'updatedAt' && <Check size={14} />}
@@ -825,7 +786,7 @@ function DashboardsList(): JSX.Element {
 												placement="bottomRight"
 												arrow={false}
 											>
-												<ArrowDownWideNarrow size={14} data-testid="sort-by" />
+												<ArrowDownWideNarrow size={14} />
 											</Popover>
 										</Tooltip>
 										<Popover
@@ -861,7 +822,16 @@ function DashboardsList(): JSX.Element {
 									showSorterTooltip
 									loading={isDashboardListLoading || isFilteringDashboards}
 									showHeader={false}
-									pagination={paginationConfig}
+									pagination={
+										data.length > 20 && {
+											pageSize: 20,
+											showTotal: showPaginationItem,
+											showSizeChanger: false,
+											onChange: (page): void => handlePageSizeUpdate(page),
+											current: Number(sortOrder.pagination),
+											defaultCurrent: Number(sortOrder.pagination) || 1,
+										}
+									}
 								/>
 							</>
 						)}

frontend/src/container/ListOfDashboard/ImportJSON/index.tsx

@@ -5,7 +5,6 @@ import { ExclamationCircleTwoTone } from '@ant-design/icons';
 import MEditor, { Monaco } from '@monaco-editor/react';
 import { Color } from '@signozhq/design-tokens';
 import { Button, Modal, Space, Typography, Upload, UploadProps } from 'antd';
-import logEvent from 'api/common/logEvent';
 import createDashboard from 'api/dashboard/create';
 import ROUTES from 'constants/routes';
 import { useIsDarkMode } from 'hooks/useDarkMode';
@@ -68,8 +67,6 @@ function ImportJSON({
 	const onClickLoadJsonHandler = async (): Promise<void> => {
 		try {
 			setDashboardCreating(true);
-			logEvent('Dashboard List: Import and next clicked', {});
-
 			const dashboardData = JSON.parse(editorValue) as DashboardData;
 
 			if (dashboardData?.layout) {
@@ -89,10 +86,6 @@ function ImportJSON({
 						dashboardId: response.payload.uuid,
 					}),
 				);
-				logEvent('Dashboard List: New dashboard imported successfully', {
-					dashboardId: response.payload?.uuid,
-					dashboardName: response.payload?.data?.title,
-				});
 			} else if (response.error === 'feature usage exceeded') {
 				setIsFeatureAlert(true);
 				notifications.error({
@@ -148,6 +141,11 @@ function ImportJSON({
 			colors: {
 				'editor.background': Color.BG_INK_300,
 			},
+			fontFamily: 'Space Mono',
+			fontSize: 20,
+			fontWeight: 'normal',
+			lineHeight: 18,
+			letterSpacing: -0.06,
 		});
 	}
 
@@ -187,9 +185,6 @@ function ImportJSON({
 								type="default"
 								className="periscope-btn"
 								icon={<MonitorDot size={14} />}
-								onClick={(): void => {
-									logEvent('Dashboard List: Upload JSON file clicked', {});
-								}}
 							>
 								{' '}
 								{t('upload_json_file')}
@@ -238,11 +233,6 @@ function ImportJSON({
 						fontFamily: 'Space Mono',
 					}}
 					theme={isDarkMode ? 'my-theme' : 'light'}
-					onMount={(_, monaco): void => {
-						document.fonts.ready.then(() => {
-							monaco.editor.remeasureFonts();
-						});
-					}}
 					// eslint-disable-next-line react/jsx-no-bind
 					beforeMount={setEditorTheme}
 				/>

frontend/src/container/LiveLogs/LiveLogsList/index.tsx

@@ -3,7 +3,6 @@ import LogDetail from 'components/LogDetail';
 import { VIEW_TYPES } from 'components/LogDetail/constants';
 import ListLogView from 'components/Logs/ListLogView';
 import RawLogView from 'components/Logs/RawLogView';
-import OverlayScrollbar from 'components/OverlayScrollbar/OverlayScrollbar';
 import Spinner from 'components/Spinner';
 import { CARD_BODY_STYLE } from 'constants/card';
 import { LOCALSTORAGE } from 'constants/localStorage';
@@ -129,15 +128,13 @@ function LiveLogsList({ logs }: LiveLogsListProps): JSX.Element {
 						/>
 					) : (
 						<Card style={{ width: '100%' }} bodyStyle={CARD_BODY_STYLE}>
-							<OverlayScrollbar isVirtuoso>
-								<Virtuoso
-									ref={ref}
-									initialTopMostItemIndex={activeLogIndex !== -1 ? activeLogIndex : 0}
-									data={logs}
-									totalCount={logs.length}
-									itemContent={getItemContent}
-								/>
-							</OverlayScrollbar>
+							<Virtuoso
+								ref={ref}
+								initialTopMostItemIndex={activeLogIndex !== -1 ? activeLogIndex : 0}
+								data={logs}
+								totalCount={logs.length}
+								itemContent={getItemContent}
+							/>
 						</Card>
 					)}
 				</InfinityWrapperStyled>

frontend/src/container/LogDetailedView/ContextView/ContextLogRenderer.tsx

@@ -2,7 +2,6 @@ import './ContextLogRenderer.styles.scss';
 
 import { Skeleton } from 'antd';
 import RawLogView from 'components/Logs/RawLogView';
-import OverlayScrollbar from 'components/OverlayScrollbar/OverlayScrollbar';
 import ShowButton from 'container/LogsContextList/ShowButton';
 import { ORDERBY_FILTERS } from 'container/QueryBuilder/filters/OrderByFilter/config';
 import { useCallback, useEffect, useState } from 'react';
@@ -95,15 +94,13 @@ function ContextLogRenderer({
 					}}
 				/>
 			)}
-			<OverlayScrollbar isVirtuoso>
-				<Virtuoso
-					className="virtuoso-list"
-					initialTopMostItemIndex={0}
-					data={logs}
-					itemContent={getItemContent}
-					style={{ height: `calc(${logs.length} * 32px)` }}
-				/>
-			</OverlayScrollbar>
+			<Virtuoso
+				className="virtuoso-list"
+				initialTopMostItemIndex={0}
+				data={logs}
+				itemContent={getItemContent}
+				style={{ height: `calc(${logs.length} * 32px)` }}
+			/>
 			{isAfterLogsFetching && (
 				<Skeleton
 					style={{

frontend/src/container/LogDetailedView/FieldRenderer.styles.scss

@@ -8,7 +8,7 @@
 	.label {
 		color: var(--text-robin-400);
 		font-family: SF Mono;
-		font-family: 'Geist Mono';
+		font-family: 'Space Mono', monospace;
 		font-size: 13px;
 		font-weight: var(--font-weight-normal);
 		line-height: 18px;

frontend/src/container/LogDetailedView/JsonView.tsx

@@ -28,7 +28,7 @@ function JSONView({ logData }: JSONViewProps): JSX.Element {
 		},
 		fontWeight: 400,
 		// fontFamily: 'SF Mono',
-		fontFamily: 'Geist Mono',
+		fontFamily: 'Space Mono',
 		fontSize: 13,
 		lineHeight: '18px',
 		colorDecorators: true,

frontend/src/container/LogDetailedView/Overview.tsx

@@ -53,7 +53,8 @@ function Overview({
 			enabled: false,
 		},
 		fontWeight: 400,
-		fontFamily: 'Geist Mono',
+		// fontFamily: 'SF Mono',
+		fontFamily: 'Space Mono',
 		fontSize: 13,
 		lineHeight: '18px',
 		colorDecorators: true,
@@ -79,6 +80,12 @@ function Overview({
 			colors: {
 				'editor.background': Color.BG_INK_400,
 			},
+			// fontFamily: 'SF Mono',
+			fontFamily: 'Space Mono',
+			fontSize: 12,
+			fontWeight: 'normal',
+			lineHeight: 18,
+			letterSpacing: -0.06,
 		});
 	}
 
@@ -117,11 +124,6 @@ function Overview({
 									onChange={(): void => {}}
 									height="20vh"
 									theme={isDarkMode ? 'my-theme' : 'light'}
-									onMount={(_, monaco): void => {
-										document.fonts.ready.then(() => {
-											monaco.editor.remeasureFonts();
-										});
-									}}
 									// eslint-disable-next-line react/jsx-no-bind
 									beforeMount={setEditorTheme}
 								/>

frontend/src/container/LogDetailedView/TableView.styles.scss

@@ -57,8 +57,6 @@
 			background: rgba(22, 25, 34, 0.4);
 
 			.value-field {
-				font-family: 'Geist Mono';
-
 				position: relative;
 			}
 

frontend/src/container/LogDetailedView/TableView.tsx

@@ -289,13 +289,7 @@ function TableView({
 				return (
 					<div className="value-field">
 						<CopyClipboardHOC textToCopy={textToCopy}>
-							<span
-								style={{
-									color: Color.BG_SIENNA_400,
-									whiteSpace: 'pre-wrap',
-									tabSize: 4,
-								}}
-							>
+							<span style={{ color: Color.BG_SIENNA_400 }}>
 								{removeEscapeCharacters(fieldData.value)}
 							</span>
 						</CopyClipboardHOC>

frontend/src/container/Login/index.tsx

@@ -163,15 +163,8 @@ function Login({
 					response.payload.accessJwt,
 					response.payload.refreshJwt,
 				);
-				if (history?.location?.state) {
-					const historyState = history?.location?.state as any;
 
-					if (historyState?.from) {
-						history.push(historyState?.from);
-					} else {
-						history.push(ROUTES.APPLICATION);
-					}
-				}
+				history.push(ROUTES.APPLICATION);
 			} else {
 				notifications.error({
 					message: response.error || t('unexpected_error'),