chore(build): use cache to share input/output artifacts

Signed-off-by: Prashant Shahi <prashant@signoz.io>

.github/workflows/build-community.yaml

@@ -0,0 +1,57 @@
+name: build-community
+
+on:
+  push:
+    branches:
+      - main
+    tags:
+      - v*
+
+jobs:
+  prepare:
+    runs-on: ubuntu-latest
+    outputs:
+      docker_providers: ${{ steps.set-docker-providers.outputs.providers }}
+    steps:
+      - name: set-docker-providers
+        id: set-docker-providers
+        run: |
+          if [[ ${{ github.event.ref }} =~ ^refs/tags/v[0-9]+\.[0-9]+\.[0-9]+$ || ${{ github.event.ref }} =~ ^refs/tags/v[0-9]+\.[0-9]+\.[0-9]+-rc.[0-9]+$ ]]; then
+            echo "providers=dockerhub gcp" >> $GITHUB_OUTPUT
+          else
+            echo "providers=gcp" >> $GITHUB_OUTPUT
+          fi
+  js-build:
+    uses: signoz/primus.workflows/.github/workflows/js-build.yaml@feat/new-build
+    needs: prepare
+    secrets: inherit
+    with:
+      PRIMUS_REF: dockerhub
+      JS_SRC: frontend
+      JS_OUTPUT_ARTIFACT_CACHE_KEY: community-jsbuild-${{ github.sha }}
+      JS_OUTPUT_ARTIFACT_PATH: frontend/build
+      DOCKER_BUILD: false
+      DOCKER_MANIFEST: false
+  go-build:
+    uses: signoz/primus.workflows/.github/workflows/go-build.yaml@feat/new-build
+    needs: [prepare, js-build]
+    secrets: inherit
+    with:
+      PRIMUS_REF: dockerhub
+      GO_NAME: signoz-community
+      GO_DOWNLOAD_ARTIFACT_NAME: community-jsbuild-${{ github.sha }}
+      GO_DOWNLOAD_ARTIFACT_PATH: frontend/build
+      GO_BUILD_CONTEXT: ./pkg/query-service
+      GO_BUILD_FLAGS: >-
+        -tags timetzdata
+        -ldflags='-linkmode external -extldflags \"-static\" -s -w
+        -X github.com/signoz/zeus/pkg/version.Version=\$($MAKE info-version)
+        -X github.com/signoz/zeus/pkg/version.variant=community
+        -X github.com/signoz/zeus/pkg/version.hash=\$($MAKE info-commit-short)
+        -X github.com/signoz/zeus/pkg/version.time=\$($MAKE info-timestamp)
+        -X github.com/signoz/zeus/pkg/version.branch=\$($MAKE info-branch)'
+      GO_CGO_ENABLED: 1
+      DOCKER_BASE_IMAGES: '{"alpine": "alpine:3.20.3"}'
+      DOCKER_DOCKERFILE_PATH: ./pkg/query-service/Dockerfile.multi-arch
+      DOCKER_MANIFEST: true
+      DOCKER_PROVIDERS: ${{ needs.prepare.outputs.docker_providers }}

.github/workflows/build-enterprise.yaml

@@ -0,0 +1,80 @@
+name: build-enterprise
+
+on:
+  push:
+    branches:
+      - main
+    tags:
+      - v*
+
+jobs:
+  prepare:
+    runs-on: ubuntu-latest
+    outputs:
+      docker_providers: ${{ steps.set-docker-providers.outputs.providers }}
+    steps:
+      - name: set-docker-providers
+        id: set-docker-providers
+        run: |
+          if [[ ${{ github.event.ref }} =~ ^refs/tags/v[0-9]+\.[0-9]+\.[0-9]+$ || ${{ github.event.ref }} =~ ^refs/tags/v[0-9]+\.[0-9]+\.[0-9]+-rc.[0-9]+$ ]]; then
+            echo "providers=dockerhub gcp" >> $GITHUB_OUTPUT
+          else
+            echo "providers=gcp" >> $GITHUB_OUTPUT
+          fi
+      - name: create-dotenv
+        run: |
+          mkdir -p frontend
+          echo 'CI=1' > frontend/.env
+          echo 'INTERCOM_APP_ID="${{ secrets.INTERCOM_APP_ID }}"' >> frontend/.env
+          echo 'SEGMENT_ID="${{ secrets.SEGMENT_ID }}"' >> frontend/.env
+          echo 'SENTRY_AUTH_TOKEN="${{ secrets.SENTRY_AUTH_TOKEN }}"' >> frontend/.env
+          echo 'SENTRY_ORG="${{ secrets.SENTRY_ORG }}"' >> frontend/.env
+          echo 'SENTRY_PROJECT_ID="${{ secrets.SENTRY_PROJECT_ID }}"' >> frontend/.env
+          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
+          echo 'CUSTOMERIO_ID="${{ secrets.CUSTOMERIO_ID }}"' >> frontend/.env
+          echo 'CUSTOMERIO_SITE_ID="${{ secrets.CUSTOMERIO_SITE_ID }}"' >> frontend/.env
+      - name: cache-dotenv
+        uses: actions/cache@v4
+        with:
+          path: frontend/.env
+          key: enterprise-dotenv-${{ github.sha }}
+  js-build:
+    uses: signoz/primus.workflows/.github/workflows/js-build.yaml@feat/new-build
+    needs: prepare
+    secrets: inherit
+    with:
+      PRIMUS_REF: dockerhub
+      JS_SRC: frontend
+      JS_INPUT_ARTIFACT_CACHE_KEY: enterprise-dotenv-${{ github.sha }}
+      JS_INPUT_ARTIFACT_PATH: frontend/.env
+      JS_OUTPUT_ARTIFACT_CACHE_KEY: enterprise-jsbuild-${{ github.sha }}
+      JS_OUTPUT_ARTIFACT_PATH: frontend/build
+      DOCKER_BUILD: false
+      DOCKER_MANIFEST: false
+  go-build:
+    uses: signoz/primus.workflows/.github/workflows/go-build.yaml@feat/new-build
+    needs: [prepare, js-build]
+    secrets: inherit
+    with:
+      PRIMUS_REF: dockerhub
+      GO_DOWNLOAD_ARTIFACT_NAME: enterprise-jsbuild-${{ github.sha }}
+      GO_DOWNLOAD_ARTIFACT_PATH: frontend/build
+      GO_BUILD_CONTEXT: ./ee/query-service
+      GO_BUILD_FLAGS: >-
+        -tags timetzdata
+        -ldflags='-linkmode external -extldflags \"-static\" -s -w
+        -X github.com/signoz/zeus/pkg/version.Version=\$($MAKE info-version)
+        -X github.com/signoz/zeus/pkg/version.variant=enterprise
+        -X github.com/signoz/zeus/pkg/version.hash=\$($MAKE info-commit-short)
+        -X github.com/signoz/zeus/pkg/version.time=\$($MAKE info-timestamp)
+        -X github.com/signoz/zeus/pkg/version.branch=\$($MAKE info-branch)
+        -X github.com/signoz/zeus/ee/query-service/constants.ZeusURL=https://api.signoz.cloud
+        -X github.com/signoz/zeus/ee/query-service/constants.LicenseSignozIo=https://license.signoz.io/api/v1'
+      GO_CGO_ENABLED: 1
+      DOCKER_BASE_IMAGES: '{"alpine": "alpine:3.20.3"}'
+      DOCKER_DOCKERFILE_PATH: ./ee/query-service/Dockerfile.multi-arch
+      DOCKER_MANIFEST: true
+      DOCKER_PROVIDERS: ${{ needs.prepare.outputs.docker_providers }}

.github/workflows/build.yaml

@@ -1,122 +0,0 @@
-name: build
-
-on:
-  push:
-    branches:
-      - main
-    tags:
-      - v*
-
-jobs:
-  enterprise:
-    runs-on: ubuntu-latest
-    steps:
-      - name: checkout
-        uses: actions/checkout@v4
-      - name: setup
-        uses: actions/setup-go@v5
-        with:
-          go-version: "1.22"
-      - name: setup-qemu
-        uses: docker/setup-qemu-action@v3
-      - name: setup-buildx
-        uses: docker/setup-buildx-action@v3
-        with:
-          version: latest
-      - name: docker-login
-        uses: docker/login-action@v3
-        with:
-          username: ${{ secrets.DOCKERHUB_USERNAME }}
-          password: ${{ secrets.DOCKERHUB_TOKEN }}
-      - name: create-env-file
-        run: |
-          echo 'INTERCOM_APP_ID="${{ secrets.INTERCOM_APP_ID }}"' > frontend/.env
-          echo 'SEGMENT_ID="${{ secrets.SEGMENT_ID }}"' >> frontend/.env
-          echo 'SENTRY_AUTH_TOKEN="${{ secrets.SENTRY_AUTH_TOKEN }}"' >> frontend/.env
-          echo 'SENTRY_ORG="${{ secrets.SENTRY_ORG }}"' >> frontend/.env
-          echo 'SENTRY_PROJECT_ID="${{ secrets.SENTRY_PROJECT_ID }}"' >> frontend/.env
-          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
-          echo 'CUSTOMERIO_ID="${{ secrets.CUSTOMERIO_ID }}"' >> frontend/.env
-          echo 'CUSTOMERIO_SITE_ID="${{ secrets.CUSTOMERIO_SITE_ID }}"' >> frontend/.env
-      - name: github-ref-info
-        shell: bash
-        run: |
-          GH_REF=${{ github.ref }}
-          if [[ "${{ github.ref_type }}" == "tag" ]]; then
-            PREFIX="refs/tags/"
-            echo "GH_IS_TAG=true" >> $GITHUB_ENV
-            echo "GH_TAG=${GH_REF#$PREFIX}" >> $GITHUB_ENV
-          else
-            PREFIX="refs/heads/"
-            echo "GH_IS_TAG=false" >> $GITHUB_ENV
-            echo "GH_BRANCH_NAME=${GH_REF#$PREFIX}" >> $GITHUB_ENV
-          fi
-      - name: set-version
-        run: |
-          if [ '${{ env.GH_IS_TAG }}' == 'true' ]; then
-            echo "VERSION=${{ env.GH_TAG }}" >> $GITHUB_ENV
-          elif [ '${{ env.GH_BRANCH_NAME }}' == 'main' ]; then
-            echo "VERSION=latest" >> $GITHUB_ENV
-          else
-            echo "VERSION=${{ env.GH_BRANCH_NAME }}" >> $GITHUB_ENV
-          fi
-      - name: cross-compilation-tools
-        run: |
-          set -ex
-          sudo apt-get update
-          sudo apt-get install -y gcc-aarch64-linux-gnu musl-tools
-      - name: publish
-        run: make docker-buildx-enterprise
-
-  community:
-    runs-on: ubuntu-latest
-    steps:
-      - name: checkout
-        uses: actions/checkout@v4
-      - name: setup-go
-        uses: actions/setup-go@v5
-        with:
-          go-version: "1.22"
-      - name: setup-qemu
-        uses: docker/setup-qemu-action@v3
-      - name: setup-buildx
-        uses: docker/setup-buildx-action@v3
-        with:
-          version: latest
-      - name: docker-login
-        uses: docker/login-action@v3
-        with:
-          username: ${{ secrets.DOCKERHUB_USERNAME }}
-          password: ${{ secrets.DOCKERHUB_TOKEN }}
-      - name: github-ref-info
-        shell: bash
-        run: |
-          GH_REF=${{ github.ref }}
-          if [[ "${{ github.ref_type }}" == "tag" ]]; then
-            PREFIX="refs/tags/"
-            echo "GH_IS_TAG=true" >> $GITHUB_ENV
-            echo "GH_TAG=${GH_REF#$PREFIX}" >> $GITHUB_ENV
-          else
-            PREFIX="refs/heads/"
-            echo "GH_IS_TAG=false" >> $GITHUB_ENV
-            echo "GH_BRANCH_NAME=${GH_REF#$PREFIX}" >> $GITHUB_ENV
-          fi
-      - name: set-version
-        run: |
-          if [ '${{ env.GH_IS_TAG }}' == 'true' ]; then
-            echo "VERSION=${{ env.GH_TAG }}" >> $GITHUB_ENV
-          elif [ '${{ env.GH_BRANCH_NAME }}' == 'main' ]; then
-            echo "VERSION=latest" >> $GITHUB_ENV
-          else
-            echo "VERSION=${{ env.GH_BRANCH_NAME }}" >> $GITHUB_ENV
-          fi
-      - name: cross-compilation-tools
-        run: |
-          set -ex
-          sudo apt-get update
-          sudo apt-get install -y gcc-aarch64-linux-gnu musl-tools
-      - name: publish
-        run: make docker-buildx-community

.gitignore

@@ -54,6 +54,7 @@ ee/query-service/tests/test-deploy/data/
 bin/
 .local/
 */query-service/queries.active
+ee/query-service/db
 
 # e2e
 

CONTRIBUTING.md

@@ -77,4 +77,4 @@ Need assistance? Join our Slack community:
 ## Where do I go from here?
 
 - Set up your [development environment](docs/contributing/development.md)
-- Deploy and observe [SigNoz in action with OpenTelemetry Demo Application](docs/otel-demo/otel-demo-docs.md)
+- Deploy and observe [SigNoz in action with OpenTelemetry Demo Application](docs/otel-demo-docs.md)

Makefile

@@ -74,6 +74,10 @@ go-run-enterprise: ## Runs the enterprise go backend server
 		--use-logs-new-schema true \
 		--use-trace-new-schema true
 
+.PHONY: go-test
+go-test: ## Runs go unit tests
+	@go test -race ./...
+
 .PHONY: go-run-community
 go-run-community: ## Runs the community go backend server
 	@SIGNOZ_INSTRUMENTATION_LOGS_LEVEL=debug \

conf/example.yaml

@@ -72,7 +72,6 @@ sqlstore:
     # The path to the SQLite database file.
     path: /var/lib/signoz/signoz.db
 
-
 ##################### APIServer #####################
 apiserver:
   timeout:
@@ -91,20 +90,29 @@ apiserver:
       - /api/v1/version
       - /
 
-
 ##################### TelemetryStore #####################
 telemetrystore:
-  # Specifies the telemetrystore provider to use.
-  provider: clickhouse
   # Maximum number of idle connections in the connection pool.
   max_idle_conns: 50
   # Maximum number of open connections to the database.
   max_open_conns: 100
   # Maximum time to wait for a connection to be established.
   dial_timeout: 5s
+  # Specifies the telemetrystore provider to use.
+  provider: clickhouse
   clickhouse:
-    # The DSN to use for ClickHouse.
-    dsn: http://localhost:9000
+    # The DSN to use for clickhouse.
+    dsn: tcp://localhost:9000
+
+##################### Prometheus #####################
+prometheus:
+  active_query_tracker:
+    # Whether to enable the active query tracker.
+    enabled: true
+    # The path to use for the active query tracker.
+    path: ""
+    # The maximum number of concurrent queries.
+    max_concurrent: 20
 
 ##################### Alertmanager #####################
 alertmanager:
@@ -117,7 +125,7 @@ alertmanager:
     # The poll interval for periodically syncing the alertmanager with the config in the store.
     poll_interval: 1m
     # The URL under which Alertmanager is externally reachable (for example, if Alertmanager is served via a reverse proxy). Used for generating relative and absolute links back to Alertmanager itself.
-    external_url: http://localhost:9093
+    external_url: http://localhost:8080
     # The global configuration for the alertmanager. All the exahustive fields can be found in the upstream: https://github.com/prometheus/alertmanager/blob/efa05feffd644ba4accb526e98a8c6545d26a783/config/config.go#L833
     global:
       # ResolveTimeout is the time after which an alert is declared resolved if it has not been updated.

deploy/docker-swarm/docker-compose.ha.yaml

@@ -174,7 +174,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:v0.76.2
+    image: signoz/signoz:v0.77.0
     command:
       - --config=/root/config/prometheus.yml
       - --use-logs-new-schema=true
@@ -208,7 +208,7 @@ services:
       retries: 3
   otel-collector:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:v0.111.34
+    image: signoz/signoz-otel-collector:v0.111.37
     command:
       - --config=/etc/otel-collector-config.yaml
       - --manager-config=/etc/manager-config.yaml
@@ -232,7 +232,7 @@ services:
       - signoz
   schema-migrator:
     !!merge <<: *common
-    image: signoz/signoz-schema-migrator:v0.111.34
+    image: signoz/signoz-schema-migrator:v0.111.37
     deploy:
       restart_policy:
         condition: on-failure

deploy/docker-swarm/docker-compose.yaml

@@ -110,7 +110,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:v0.76.2
+    image: signoz/signoz:v0.77.0
     command:
       - --config=/root/config/prometheus.yml
       - --use-logs-new-schema=true
@@ -143,7 +143,7 @@ services:
       retries: 3
   otel-collector:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:v0.111.34
+    image: signoz/signoz-otel-collector:v0.111.37
     command:
       - --config=/etc/otel-collector-config.yaml
       - --manager-config=/etc/manager-config.yaml
@@ -167,7 +167,7 @@ services:
       - signoz
   schema-migrator:
     !!merge <<: *common
-    image: signoz/signoz-schema-migrator:v0.111.34
+    image: signoz/signoz-schema-migrator:v0.111.37
     deploy:
       restart_policy:
         condition: on-failure

deploy/docker/docker-compose.ha.yaml

@@ -177,7 +177,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:${VERSION:-v0.76.2}
+    image: signoz/signoz:${VERSION:-v0.77.0}
     container_name: signoz
     command:
       - --config=/root/config/prometheus.yml
@@ -212,7 +212,7 @@ services:
   # TODO: support otel-collector multiple replicas. Nginx/Traefik for loadbalancing?
   otel-collector:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.111.34}
+    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.111.37}
     container_name: signoz-otel-collector
     command:
       - --config=/etc/otel-collector-config.yaml
@@ -238,7 +238,7 @@ services:
         condition: service_healthy
   schema-migrator-sync:
     !!merge <<: *common
-    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-v0.111.34}
+    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-v0.111.37}
     container_name: schema-migrator-sync
     command:
       - sync
@@ -249,7 +249,7 @@ services:
         condition: service_healthy
   schema-migrator-async:
     !!merge <<: *db-depend
-    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-v0.111.34}
+    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-v0.111.37}
     container_name: schema-migrator-async
     command:
       - async

deploy/docker/docker-compose.testing.yaml

@@ -110,7 +110,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:${VERSION:-v0.76.2}
+    image: signoz/signoz:${VERSION:-v0.77.0}
     container_name: signoz
     command:
       - --config=/root/config/prometheus.yml
@@ -146,7 +146,7 @@ services:
       retries: 3
   otel-collector:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.111.34}
+    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.111.37}
     container_name: signoz-otel-collector
     command:
       - --config=/etc/otel-collector-config.yaml
@@ -168,7 +168,7 @@ services:
         condition: service_healthy
   schema-migrator-sync:
     !!merge <<: *common
-    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-v0.111.34}
+    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-v0.111.37}
     container_name: schema-migrator-sync
     command:
       - sync
@@ -180,7 +180,7 @@ services:
     restart: on-failure
   schema-migrator-async:
     !!merge <<: *db-depend
-    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-v0.111.34}
+    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-v0.111.37}
     container_name: schema-migrator-async
     command:
       - async

deploy/docker/docker-compose.yaml

@@ -110,7 +110,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:${VERSION:-v0.76.2}
+    image: signoz/signoz:${VERSION:-v0.77.0}
     container_name: signoz
     command:
       - --config=/root/config/prometheus.yml
@@ -144,7 +144,7 @@ services:
       retries: 3
   otel-collector:
     !!merge <<: *db-depend
-    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.111.34}
+    image: signoz/signoz-otel-collector:${OTELCOL_TAG:-v0.111.37}
     container_name: signoz-otel-collector
     command:
       - --config=/etc/otel-collector-config.yaml
@@ -166,7 +166,7 @@ services:
         condition: service_healthy
   schema-migrator-sync:
     !!merge <<: *common
-    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-v0.111.34}
+    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-v0.111.37}
     container_name: schema-migrator-sync
     command:
       - sync
@@ -178,7 +178,7 @@ services:
     restart: on-failure
   schema-migrator-async:
     !!merge <<: *db-depend
-    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-v0.111.34}
+    image: signoz/signoz-schema-migrator:${OTELCOL_TAG:-v0.111.37}
     container_name: schema-migrator-async
     command:
       - async

ee/http/middleware/pat.go

@@ -4,6 +4,7 @@ import (
 	"net/http"
 	"time"
 
+	eeTypes "github.com/SigNoz/signoz/ee/types"
 	"github.com/SigNoz/signoz/pkg/sqlstore"
 	"github.com/SigNoz/signoz/pkg/types"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
@@ -24,7 +25,7 @@ func (p *Pat) Wrap(next http.Handler) http.Handler {
 	return http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
 		var values []string
 		var patToken string
-		var pat types.StorablePersonalAccessToken
+		var pat eeTypes.StorablePersonalAccessToken
 
 		for _, header := range p.headers {
 			values = append(values, r.Header.Get(header))

ee/query-service/Dockerfile.multi-arch

@@ -0,0 +1,22 @@
+ARG ALPINE_SHA="pass-a-valid-docker-sha-otherwise-this-will-fail"
+
+FROM alpine@sha256:${ALPINE_SHA}
+LABEL maintainer="signoz"
+WORKDIR /root
+
+ARG OS="linux"
+ARG ARCH
+
+RUN apk update && \
+    apk add ca-certificates && \
+    rm -rf /var/cache/apk/*
+
+COPY ./target/${OS}-${ARCH}/signoz /root/signoz
+COPY ./conf/prometheus.yml /root/config/prometheus.yml
+COPY ./templates/email /root/templates
+COPY frontend/build/ /etc/signoz/web/
+
+RUN chmod 755 /root /root/signoz
+
+ENTRYPOINT ["./signoz"]
+CMD ["-config", "/root/config/prometheus.yml"]

ee/query-service/anomaly/seasonal.go

@@ -313,6 +313,9 @@ func (p *BaseSeasonalProvider) getScore(
 	series, prevSeries, weekSeries, weekPrevSeries, past2SeasonSeries, past3SeasonSeries *v3.Series, value float64, idx int,
 ) float64 {
 	expectedValue := p.getExpectedValue(series, prevSeries, weekSeries, weekPrevSeries, past2SeasonSeries, past3SeasonSeries, idx)
+	if expectedValue < 0 {
+		expectedValue = p.getMovingAvg(prevSeries, movingAvgWindowSize, idx)
+	}
 	return (value - expectedValue) / p.getStdDev(weekSeries)
 }
 

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

@@ -11,6 +11,8 @@ import (
 	"github.com/SigNoz/signoz/ee/query-service/license"
 	"github.com/SigNoz/signoz/ee/query-service/usage"
 	"github.com/SigNoz/signoz/pkg/alertmanager"
+	"github.com/SigNoz/signoz/pkg/modules/preference"
+	preferencecore "github.com/SigNoz/signoz/pkg/modules/preference/core"
 	baseapp "github.com/SigNoz/signoz/pkg/query-service/app"
 	"github.com/SigNoz/signoz/pkg/query-service/app/cloudintegrations"
 	"github.com/SigNoz/signoz/pkg/query-service/app/integrations"
@@ -21,6 +23,7 @@ import (
 	rules "github.com/SigNoz/signoz/pkg/query-service/rules"
 	"github.com/SigNoz/signoz/pkg/signoz"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
+	"github.com/SigNoz/signoz/pkg/types/preferencetypes"
 	"github.com/SigNoz/signoz/pkg/version"
 	"github.com/gorilla/mux"
 )
@@ -54,6 +57,7 @@ type APIHandler struct {
 
 // NewAPIHandler returns an APIHandler
 func NewAPIHandler(opts APIHandlerOptions, signoz *signoz.SigNoz) (*APIHandler, error) {
+	preference := preference.NewAPI(preferencecore.NewPreference(preferencecore.NewStore(signoz.SQLStore), preferencetypes.NewDefaultPreferenceMap()))
 
 	baseHandler, err := baseapp.NewAPIHandler(baseapp.APIHandlerOpts{
 		Reader:                        opts.DataConnector,
@@ -71,6 +75,7 @@ func NewAPIHandler(opts APIHandlerOptions, signoz *signoz.SigNoz) (*APIHandler,
 		UseTraceNewSchema:             opts.UseTraceNewSchema,
 		AlertmanagerAPI:               alertmanager.NewAPI(signoz.Alertmanager),
 		Signoz:                        signoz,
+		Preference:                    preference,
 	})
 
 	if err != nil {
@@ -157,7 +162,6 @@ func (ah *APIHandler) RegisterRoutes(router *mux.Router, am *baseapp.AuthMiddlew
 	router.HandleFunc("/api/v1/invite/{token}", am.OpenAccess(ah.getInvite)).Methods(http.MethodGet)
 	router.HandleFunc("/api/v1/register", am.OpenAccess(ah.registerUser)).Methods(http.MethodPost)
 	router.HandleFunc("/api/v1/login", am.OpenAccess(ah.loginUser)).Methods(http.MethodPost)
-	router.HandleFunc("/api/v1/traces/{traceId}", am.ViewAccess(ah.searchTraces)).Methods(http.MethodGet)
 
 	// PAT APIs
 	router.HandleFunc("/api/v1/pats", am.AdminAccess(ah.createPAT)).Methods(http.MethodPost)

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

@@ -11,7 +11,7 @@ import (
 	"time"
 
 	"github.com/SigNoz/signoz/ee/query-service/constants"
-	"github.com/SigNoz/signoz/ee/query-service/model"
+	eeTypes "github.com/SigNoz/signoz/ee/types"
 	"github.com/SigNoz/signoz/pkg/query-service/auth"
 	baseconstants "github.com/SigNoz/signoz/pkg/query-service/constants"
 	"github.com/SigNoz/signoz/pkg/query-service/dao"
@@ -135,19 +135,12 @@ func (ah *APIHandler) getOrCreateCloudIntegrationPAT(ctx context.Context, orgId
 		zap.String("cloudProvider", cloudProvider),
 	)
 
-	newPAT := model.PAT{
-		StorablePersonalAccessToken: types.StorablePersonalAccessToken{
-			Token:     generatePATToken(),
-			UserID:    integrationUser.ID,
-			Name:      integrationPATName,
-			Role:      baseconstants.ViewerGroup,
-			ExpiresAt: 0,
-			TimeAuditable: types.TimeAuditable{
-				CreatedAt: time.Now(),
-				UpdatedAt: time.Now(),
-			},
-		},
-	}
+	newPAT := eeTypes.NewGettablePAT(
+		integrationPATName,
+		baseconstants.ViewerGroup,
+		integrationUser.ID,
+		0,
+	)
 	integrationPAT, err := ah.AppDao().CreatePAT(ctx, orgId, newPAT)
 	if err != nil {
 		return "", basemodel.InternalError(fmt.Errorf(

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

@@ -2,31 +2,24 @@ package api
 
 import (
 	"context"
-	"crypto/rand"
-	"encoding/base64"
 	"encoding/json"
 	"fmt"
 	"net/http"
 	"time"
 
 	"github.com/SigNoz/signoz/ee/query-service/model"
+	"github.com/SigNoz/signoz/ee/types"
+	eeTypes "github.com/SigNoz/signoz/ee/types"
+	"github.com/SigNoz/signoz/pkg/errors"
+	"github.com/SigNoz/signoz/pkg/http/render"
 	"github.com/SigNoz/signoz/pkg/query-service/auth"
 	baseconstants "github.com/SigNoz/signoz/pkg/query-service/constants"
 	basemodel "github.com/SigNoz/signoz/pkg/query-service/model"
-	"github.com/SigNoz/signoz/pkg/types"
+	"github.com/SigNoz/signoz/pkg/valuer"
 	"github.com/gorilla/mux"
 	"go.uber.org/zap"
 )
 
-func generatePATToken() string {
-	// Generate a 32-byte random token.
-	token := make([]byte, 32)
-	rand.Read(token)
-	// Encode the token in base64.
-	encodedToken := base64.StdEncoding.EncodeToString(token)
-	return encodedToken
-}
-
 func (ah *APIHandler) createPAT(w http.ResponseWriter, r *http.Request) {
 	ctx := context.Background()
 
@@ -43,31 +36,18 @@ func (ah *APIHandler) createPAT(w http.ResponseWriter, r *http.Request) {
 		}, nil)
 		return
 	}
-	pat := model.PAT{
-		StorablePersonalAccessToken: types.StorablePersonalAccessToken{
-			Name:      req.Name,
-			Role:      req.Role,
-			ExpiresAt: req.ExpiresInDays,
-		},
-	}
+	pat := eeTypes.NewGettablePAT(
+		req.Name,
+		req.Role,
+		user.ID,
+		req.ExpiresInDays,
+	)
 	err = validatePATRequest(pat)
 	if err != nil {
 		RespondError(w, model.BadRequest(err), nil)
 		return
 	}
 
-	// All the PATs are associated with the user creating the PAT.
-	pat.UserID = user.ID
-	pat.CreatedAt = time.Now()
-	pat.UpdatedAt = time.Now()
-	pat.LastUsed = 0
-	pat.Token = generatePATToken()
-
-	if pat.ExpiresAt != 0 {
-		// convert expiresAt to unix timestamp from days
-		pat.ExpiresAt = time.Now().Unix() + (pat.ExpiresAt * 24 * 60 * 60)
-	}
-
 	zap.L().Info("Got Create PAT request", zap.Any("pat", pat))
 	var apierr basemodel.BaseApiError
 	if pat, apierr = ah.AppDao().CreatePAT(ctx, user.OrgID, pat); apierr != nil {
@@ -78,7 +58,7 @@ func (ah *APIHandler) createPAT(w http.ResponseWriter, r *http.Request) {
 	ah.Respond(w, &pat)
 }
 
-func validatePATRequest(req model.PAT) error {
+func validatePATRequest(req types.GettablePAT) error {
 	if req.Role == "" || (req.Role != baseconstants.ViewerGroup && req.Role != baseconstants.EditorGroup && req.Role != baseconstants.AdminGroup) {
 		return fmt.Errorf("valid role is required")
 	}
@@ -94,7 +74,7 @@ func validatePATRequest(req model.PAT) error {
 func (ah *APIHandler) updatePAT(w http.ResponseWriter, r *http.Request) {
 	ctx := context.Background()
 
-	req := model.PAT{}
+	req := types.GettablePAT{}
 	if err := json.NewDecoder(r.Body).Decode(&req); err != nil {
 		RespondError(w, model.BadRequest(err), nil)
 		return
@@ -116,7 +96,12 @@ func (ah *APIHandler) updatePAT(w http.ResponseWriter, r *http.Request) {
 	}
 
 	req.UpdatedByUserID = user.ID
-	id := mux.Vars(r)["id"]
+	idStr := mux.Vars(r)["id"]
+	id, err := valuer.NewUUID(idStr)
+	if err != nil {
+		render.Error(w, errors.Newf(errors.TypeInvalidInput, errors.CodeInvalidInput, "id is not a valid uuid-v7"))
+		return
+	}
 	req.UpdatedAt = time.Now()
 	zap.L().Info("Got Update PAT request", zap.Any("pat", req))
 	var apierr basemodel.BaseApiError
@@ -149,7 +134,12 @@ func (ah *APIHandler) getPATs(w http.ResponseWriter, r *http.Request) {
 
 func (ah *APIHandler) revokePAT(w http.ResponseWriter, r *http.Request) {
 	ctx := context.Background()
-	id := mux.Vars(r)["id"]
+	idStr := mux.Vars(r)["id"]
+	id, err := valuer.NewUUID(idStr)
+	if err != nil {
+		render.Error(w, errors.Newf(errors.TypeInvalidInput, errors.CodeInvalidInput, "id is not a valid uuid-v7"))
+		return
+	}
 	user, err := auth.GetUserFromReqContext(r.Context())
 	if err != nil {
 		RespondError(w, &model.ApiError{
@@ -159,7 +149,7 @@ func (ah *APIHandler) revokePAT(w http.ResponseWriter, r *http.Request) {
 		return
 	}
 
-	zap.L().Info("Revoke PAT with id", zap.String("id", id))
+	zap.L().Info("Revoke PAT with id", zap.String("id", id.StringValue()))
 	if apierr := ah.AppDao().RevokePAT(ctx, user.OrgID, id, user.ID); apierr != nil {
 		RespondError(w, apierr, nil)
 		return

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

@@ -1,33 +0,0 @@
-package api
-
-import (
-	"net/http"
-
-	"github.com/SigNoz/signoz/ee/query-service/app/db"
-	"github.com/SigNoz/signoz/ee/query-service/model"
-	baseapp "github.com/SigNoz/signoz/pkg/query-service/app"
-	basemodel "github.com/SigNoz/signoz/pkg/query-service/model"
-	"go.uber.org/zap"
-)
-
-func (ah *APIHandler) searchTraces(w http.ResponseWriter, r *http.Request) {
-
-	if !ah.CheckFeature(basemodel.SmartTraceDetail) {
-		zap.L().Info("SmartTraceDetail feature is not enabled in this plan")
-		ah.APIHandler.SearchTraces(w, r)
-		return
-	}
-	searchTracesParams, err := baseapp.ParseSearchTracesParams(r)
-	if err != nil {
-		RespondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: err}, "Error reading params")
-		return
-	}
-
-	result, err := ah.opts.DataConnector.SearchTraces(r.Context(), searchTracesParams, db.SmartTraceAlgorithm)
-	if ah.HandleError(w, err, http.StatusBadRequest) {
-		return
-	}
-
-	ah.WriteJSON(w, r, result)
-
-}

ee/query-service/app/db/reader.go

@@ -5,38 +5,33 @@ import (
 
 	"github.com/ClickHouse/clickhouse-go/v2"
 
-	"github.com/jmoiron/sqlx"
-
 	"github.com/SigNoz/signoz/pkg/cache"
+	"github.com/SigNoz/signoz/pkg/prometheus"
 	basechr "github.com/SigNoz/signoz/pkg/query-service/app/clickhouseReader"
-	"github.com/SigNoz/signoz/pkg/query-service/interfaces"
+	"github.com/SigNoz/signoz/pkg/sqlstore"
+	"github.com/SigNoz/signoz/pkg/telemetrystore"
 )
 
 type ClickhouseReader struct {
 	conn  clickhouse.Conn
-	appdb *sqlx.DB
+	appdb sqlstore.SQLStore
 	*basechr.ClickHouseReader
 }
 
 func NewDataConnector(
-	localDB *sqlx.DB,
-	ch clickhouse.Conn,
-	promConfigPath string,
-	lm interfaces.FeatureLookup,
+	sqlDB sqlstore.SQLStore,
+	telemetryStore telemetrystore.TelemetryStore,
+	prometheus prometheus.Prometheus,
 	cluster string,
 	useLogsNewSchema bool,
 	useTraceNewSchema bool,
 	fluxIntervalForTraceDetail time.Duration,
 	cache cache.Cache,
 ) *ClickhouseReader {
-	chReader := basechr.NewReader(localDB, ch, promConfigPath, lm, cluster, useLogsNewSchema, useTraceNewSchema, fluxIntervalForTraceDetail, cache)
+	chReader := basechr.NewReader(sqlDB, telemetryStore, prometheus, cluster, useLogsNewSchema, useTraceNewSchema, fluxIntervalForTraceDetail, cache)
 	return &ClickhouseReader{
-		conn:             ch,
-		appdb:            localDB,
+		conn:             telemetryStore.ClickhouseDB(),
+		appdb:            sqlDB,
 		ClickHouseReader: chReader,
 	}
 }
-
-func (r *ClickhouseReader) Start(readerReady chan bool) {
-	r.ClickHouseReader.Start(readerReady)
-}

ee/query-service/app/server.go

@@ -18,13 +18,14 @@ import (
 	"github.com/SigNoz/signoz/ee/query-service/constants"
 	"github.com/SigNoz/signoz/ee/query-service/dao"
 	"github.com/SigNoz/signoz/ee/query-service/integrations/gateway"
-	"github.com/SigNoz/signoz/ee/query-service/interfaces"
 	"github.com/SigNoz/signoz/ee/query-service/rules"
 	"github.com/SigNoz/signoz/pkg/alertmanager"
 	"github.com/SigNoz/signoz/pkg/http/middleware"
+	"github.com/SigNoz/signoz/pkg/prometheus"
 	"github.com/SigNoz/signoz/pkg/query-service/auth"
 	"github.com/SigNoz/signoz/pkg/signoz"
 	"github.com/SigNoz/signoz/pkg/sqlstore"
+	"github.com/SigNoz/signoz/pkg/telemetrystore"
 	"github.com/SigNoz/signoz/pkg/types"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
 	"github.com/SigNoz/signoz/pkg/web"
@@ -43,13 +44,11 @@ import (
 	"github.com/SigNoz/signoz/pkg/query-service/app/logparsingpipeline"
 	"github.com/SigNoz/signoz/pkg/query-service/app/opamp"
 	opAmpModel "github.com/SigNoz/signoz/pkg/query-service/app/opamp/model"
-	"github.com/SigNoz/signoz/pkg/query-service/app/preferences"
 	"github.com/SigNoz/signoz/pkg/query-service/cache"
 	baseconst "github.com/SigNoz/signoz/pkg/query-service/constants"
 	"github.com/SigNoz/signoz/pkg/query-service/healthcheck"
 	baseint "github.com/SigNoz/signoz/pkg/query-service/interfaces"
 	basemodel "github.com/SigNoz/signoz/pkg/query-service/model"
-	pqle "github.com/SigNoz/signoz/pkg/query-service/pqlEngine"
 	baserules "github.com/SigNoz/signoz/pkg/query-service/rules"
 	"github.com/SigNoz/signoz/pkg/query-service/telemetry"
 	"github.com/SigNoz/signoz/pkg/query-service/utils"
@@ -116,10 +115,6 @@ func NewServer(serverOptions *ServerOptions) (*Server, error) {
 		return nil, err
 	}
 
-	if err := preferences.InitDB(serverOptions.SigNoz.SQLStore.SQLxDB()); err != nil {
-		return nil, err
-	}
-
 	if err := dashboards.InitDB(serverOptions.SigNoz.SQLStore); err != nil {
 		return nil, err
 	}
@@ -137,27 +132,22 @@ func NewServer(serverOptions *ServerOptions) (*Server, error) {
 
 	// set license manager as feature flag provider in dao
 	modelDao.SetFlagProvider(lm)
-	readerReady := make(chan bool)
 
 	fluxIntervalForTraceDetail, err := time.ParseDuration(serverOptions.FluxIntervalForTraceDetail)
 	if err != nil {
 		return nil, err
 	}
 
-	var reader interfaces.DataConnector
-	qb := db.NewDataConnector(
-		serverOptions.SigNoz.SQLStore.SQLxDB(),
-		serverOptions.SigNoz.TelemetryStore.ClickHouseDB(),
-		serverOptions.PromConfigPath,
-		lm,
+	reader := db.NewDataConnector(
+		serverOptions.SigNoz.SQLStore,
+		serverOptions.SigNoz.TelemetryStore,
+		serverOptions.SigNoz.Prometheus,
 		serverOptions.Cluster,
 		serverOptions.UseLogsNewSchema,
 		serverOptions.UseTraceNewSchema,
 		fluxIntervalForTraceDetail,
 		serverOptions.SigNoz.Cache,
 	)
-	go qb.Start(readerReady)
-	reader = qb
 
 	skipConfig := &basemodel.SkipConfig{}
 	if serverOptions.SkipTopLvlOpsPath != "" {
@@ -176,9 +166,7 @@ func NewServer(serverOptions *ServerOptions) (*Server, error) {
 		c = cache.NewCache(cacheOpts)
 	}
 
-	<-readerReady
 	rm, err := makeRulesManager(
-		serverOptions.PromConfigPath,
 		serverOptions.RuleRepoURL,
 		serverOptions.SigNoz.SQLStore.SQLxDB(),
 		reader,
@@ -189,6 +177,8 @@ func NewServer(serverOptions *ServerOptions) (*Server, error) {
 		serverOptions.UseTraceNewSchema,
 		serverOptions.SigNoz.Alertmanager,
 		serverOptions.SigNoz.SQLStore,
+		serverOptions.SigNoz.TelemetryStore,
+		serverOptions.SigNoz.Prometheus,
 	)
 
 	if err != nil {
@@ -233,7 +223,7 @@ func NewServer(serverOptions *ServerOptions) (*Server, error) {
 	}
 
 	// start the usagemanager
-	usageManager, err := usage.New(modelDao, lm.GetRepo(), serverOptions.SigNoz.TelemetryStore.ClickHouseDB(), serverOptions.Config.TelemetryStore.ClickHouse.DSN)
+	usageManager, err := usage.New(modelDao, lm.GetRepo(), serverOptions.SigNoz.TelemetryStore.ClickhouseDB(), serverOptions.Config.TelemetryStore.Clickhouse.DSN)
 	if err != nil {
 		return nil, err
 	}
@@ -304,7 +294,7 @@ func NewServer(serverOptions *ServerOptions) (*Server, error) {
 		&opAmpModel.AllAgents, agentConfMgr,
 	)
 
-	errorList := qb.PreloadMetricsMetadata(context.Background())
+	errorList := reader.PreloadMetricsMetadata(context.Background())
 	for _, er := range errorList {
 		zap.L().Error("failed to preload metrics metadata", zap.Error(er))
 	}
@@ -537,7 +527,6 @@ func (s *Server) Stop() error {
 }
 
 func makeRulesManager(
-	promConfigPath,
 	ruleRepoURL string,
 	db *sqlx.DB,
 	ch baseint.Reader,
@@ -548,16 +537,13 @@ func makeRulesManager(
 	useTraceNewSchema bool,
 	alertmanager alertmanager.Alertmanager,
 	sqlstore sqlstore.SQLStore,
+	telemetryStore telemetrystore.TelemetryStore,
+	prometheus prometheus.Prometheus,
 ) (*baserules.Manager, error) {
-	// create engine
-	pqle, err := pqle.FromConfigPath(promConfigPath)
-	if err != nil {
-		return nil, fmt.Errorf("failed to create pql engine : %v", err)
-	}
-
 	// create manager opts
 	managerOpts := &baserules.ManagerOptions{
-		PqlEngine:           pqle,
+		TelemetryStore:      telemetryStore,
+		Prometheus:          prometheus,
 		RepoURL:             ruleRepoURL,
 		DBConn:              db,
 		Context:             context.Background(),

ee/query-service/dao/interface.go

@@ -4,13 +4,13 @@ import (
 	"context"
 	"net/url"
 
-	"github.com/SigNoz/signoz/ee/query-service/model"
 	"github.com/SigNoz/signoz/ee/types"
 	basedao "github.com/SigNoz/signoz/pkg/query-service/dao"
 	baseint "github.com/SigNoz/signoz/pkg/query-service/interfaces"
 	basemodel "github.com/SigNoz/signoz/pkg/query-service/model"
 	ossTypes "github.com/SigNoz/signoz/pkg/types"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
+	"github.com/SigNoz/signoz/pkg/valuer"
 	"github.com/google/uuid"
 	"github.com/uptrace/bun"
 )
@@ -36,11 +36,11 @@ type ModelDao interface {
 	DeleteDomain(ctx context.Context, id uuid.UUID) basemodel.BaseApiError
 	GetDomainByEmail(ctx context.Context, email string) (*types.GettableOrgDomain, basemodel.BaseApiError)
 
-	CreatePAT(ctx context.Context, orgID string, p model.PAT) (model.PAT, basemodel.BaseApiError)
-	UpdatePAT(ctx context.Context, orgID string, p model.PAT, id string) basemodel.BaseApiError
-	GetPAT(ctx context.Context, pat string) (*model.PAT, basemodel.BaseApiError)
-	GetPATByID(ctx context.Context, orgID string, id string) (*model.PAT, basemodel.BaseApiError)
+	CreatePAT(ctx context.Context, orgID string, p types.GettablePAT) (types.GettablePAT, basemodel.BaseApiError)
+	UpdatePAT(ctx context.Context, orgID string, p types.GettablePAT, id valuer.UUID) basemodel.BaseApiError
+	GetPAT(ctx context.Context, pat string) (*types.GettablePAT, basemodel.BaseApiError)
+	GetPATByID(ctx context.Context, orgID string, id valuer.UUID) (*types.GettablePAT, basemodel.BaseApiError)
 	GetUserByPAT(ctx context.Context, orgID string, token string) (*ossTypes.GettableUser, basemodel.BaseApiError)
-	ListPATs(ctx context.Context, orgID string) ([]model.PAT, basemodel.BaseApiError)
-	RevokePAT(ctx context.Context, orgID string, id string, userID string) basemodel.BaseApiError
+	ListPATs(ctx context.Context, orgID string) ([]types.GettablePAT, basemodel.BaseApiError)
+	RevokePAT(ctx context.Context, orgID string, id valuer.UUID, userID string) basemodel.BaseApiError
 }

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

@@ -6,45 +6,53 @@ import (
 	"time"
 
 	"github.com/SigNoz/signoz/ee/query-service/model"
+	"github.com/SigNoz/signoz/ee/types"
 	basemodel "github.com/SigNoz/signoz/pkg/query-service/model"
-	"github.com/SigNoz/signoz/pkg/types"
+	ossTypes "github.com/SigNoz/signoz/pkg/types"
+	"github.com/SigNoz/signoz/pkg/valuer"
+
 	"go.uber.org/zap"
 )
 
-func (m *modelDao) CreatePAT(ctx context.Context, orgID string, p model.PAT) (model.PAT, basemodel.BaseApiError) {
+func (m *modelDao) CreatePAT(ctx context.Context, orgID string, p types.GettablePAT) (types.GettablePAT, basemodel.BaseApiError) {
 	p.StorablePersonalAccessToken.OrgID = orgID
+	p.StorablePersonalAccessToken.ID = valuer.GenerateUUID()
 	_, err := m.DB().NewInsert().
 		Model(&p.StorablePersonalAccessToken).
-		Returning("id").
 		Exec(ctx)
 	if err != nil {
 		zap.L().Error("Failed to insert PAT in db, err: %v", zap.Error(err))
-		return model.PAT{}, model.InternalError(fmt.Errorf("PAT insertion failed"))
+		return types.GettablePAT{}, model.InternalError(fmt.Errorf("PAT insertion failed"))
 	}
 
 	createdByUser, _ := m.GetUser(ctx, p.UserID)
 	if createdByUser == nil {
-		p.CreatedByUser = model.User{
+		p.CreatedByUser = types.PatUser{
 			NotFound: true,
 		}
 	} else {
-		p.CreatedByUser = model.User{
-			Id:                createdByUser.ID,
-			Name:              createdByUser.Name,
-			Email:             createdByUser.Email,
-			CreatedAt:         createdByUser.CreatedAt.Unix(),
-			ProfilePictureURL: createdByUser.ProfilePictureURL,
-			NotFound:          false,
+		p.CreatedByUser = types.PatUser{
+			User: ossTypes.User{
+				ID:    createdByUser.ID,
+				Name:  createdByUser.Name,
+				Email: createdByUser.Email,
+				TimeAuditable: ossTypes.TimeAuditable{
+					CreatedAt: createdByUser.CreatedAt,
+					UpdatedAt: createdByUser.UpdatedAt,
+				},
+				ProfilePictureURL: createdByUser.ProfilePictureURL,
+			},
+			NotFound: false,
 		}
 	}
 	return p, nil
 }
 
-func (m *modelDao) UpdatePAT(ctx context.Context, orgID string, p model.PAT, id string) basemodel.BaseApiError {
+func (m *modelDao) UpdatePAT(ctx context.Context, orgID string, p types.GettablePAT, id valuer.UUID) basemodel.BaseApiError {
 	_, err := m.DB().NewUpdate().
 		Model(&p.StorablePersonalAccessToken).
 		Column("role", "name", "updated_at", "updated_by_user_id").
-		Where("id = ?", id).
+		Where("id = ?", id.StringValue()).
 		Where("org_id = ?", orgID).
 		Where("revoked = false").
 		Exec(ctx)
@@ -55,7 +63,7 @@ func (m *modelDao) UpdatePAT(ctx context.Context, orgID string, p model.PAT, id
 	return nil
 }
 
-func (m *modelDao) ListPATs(ctx context.Context, orgID string) ([]model.PAT, basemodel.BaseApiError) {
+func (m *modelDao) ListPATs(ctx context.Context, orgID string) ([]types.GettablePAT, basemodel.BaseApiError) {
 	pats := []types.StorablePersonalAccessToken{}
 
 	if err := m.DB().NewSelect().
@@ -68,41 +76,51 @@ func (m *modelDao) ListPATs(ctx context.Context, orgID string) ([]model.PAT, bas
 		return nil, model.InternalError(fmt.Errorf("failed to fetch PATs"))
 	}
 
-	patsWithUsers := []model.PAT{}
+	patsWithUsers := []types.GettablePAT{}
 	for i := range pats {
-		patWithUser := model.PAT{
+		patWithUser := types.GettablePAT{
 			StorablePersonalAccessToken: pats[i],
 		}
 
 		createdByUser, _ := m.GetUser(ctx, pats[i].UserID)
 		if createdByUser == nil {
-			patWithUser.CreatedByUser = model.User{
+			patWithUser.CreatedByUser = types.PatUser{
 				NotFound: true,
 			}
 		} else {
-			patWithUser.CreatedByUser = model.User{
-				Id:                createdByUser.ID,
-				Name:              createdByUser.Name,
-				Email:             createdByUser.Email,
-				CreatedAt:         createdByUser.CreatedAt.Unix(),
-				ProfilePictureURL: createdByUser.ProfilePictureURL,
-				NotFound:          false,
+			patWithUser.CreatedByUser = types.PatUser{
+				User: ossTypes.User{
+					ID:    createdByUser.ID,
+					Name:  createdByUser.Name,
+					Email: createdByUser.Email,
+					TimeAuditable: ossTypes.TimeAuditable{
+						CreatedAt: createdByUser.CreatedAt,
+						UpdatedAt: createdByUser.UpdatedAt,
+					},
+					ProfilePictureURL: createdByUser.ProfilePictureURL,
+				},
+				NotFound: false,
 			}
 		}
 
 		updatedByUser, _ := m.GetUser(ctx, pats[i].UpdatedByUserID)
 		if updatedByUser == nil {
-			patWithUser.UpdatedByUser = model.User{
+			patWithUser.UpdatedByUser = types.PatUser{
 				NotFound: true,
 			}
 		} else {
-			patWithUser.UpdatedByUser = model.User{
-				Id:                updatedByUser.ID,
-				Name:              updatedByUser.Name,
-				Email:             updatedByUser.Email,
-				CreatedAt:         updatedByUser.CreatedAt.Unix(),
-				ProfilePictureURL: updatedByUser.ProfilePictureURL,
-				NotFound:          false,
+			patWithUser.UpdatedByUser = types.PatUser{
+				User: ossTypes.User{
+					ID:    updatedByUser.ID,
+					Name:  updatedByUser.Name,
+					Email: updatedByUser.Email,
+					TimeAuditable: ossTypes.TimeAuditable{
+						CreatedAt: updatedByUser.CreatedAt,
+						UpdatedAt: updatedByUser.UpdatedAt,
+					},
+					ProfilePictureURL: updatedByUser.ProfilePictureURL,
+				},
+				NotFound: false,
 			}
 		}
 
@@ -111,14 +129,14 @@ func (m *modelDao) ListPATs(ctx context.Context, orgID string) ([]model.PAT, bas
 	return patsWithUsers, nil
 }
 
-func (m *modelDao) RevokePAT(ctx context.Context, orgID string, id string, userID string) basemodel.BaseApiError {
+func (m *modelDao) RevokePAT(ctx context.Context, orgID string, id valuer.UUID, userID string) basemodel.BaseApiError {
 	updatedAt := time.Now().Unix()
 	_, err := m.DB().NewUpdate().
 		Model(&types.StorablePersonalAccessToken{}).
 		Set("revoked = ?", true).
 		Set("updated_by_user_id = ?", userID).
 		Set("updated_at = ?", updatedAt).
-		Where("id = ?", id).
+		Where("id = ?", id.StringValue()).
 		Where("org_id = ?", orgID).
 		Exec(ctx)
 	if err != nil {
@@ -128,7 +146,7 @@ func (m *modelDao) RevokePAT(ctx context.Context, orgID string, id string, userI
 	return nil
 }
 
-func (m *modelDao) GetPAT(ctx context.Context, token string) (*model.PAT, basemodel.BaseApiError) {
+func (m *modelDao) GetPAT(ctx context.Context, token string) (*types.GettablePAT, basemodel.BaseApiError) {
 	pats := []types.StorablePersonalAccessToken{}
 
 	if err := m.DB().NewSelect().
@@ -146,19 +164,19 @@ func (m *modelDao) GetPAT(ctx context.Context, token string) (*model.PAT, basemo
 		}
 	}
 
-	patWithUser := model.PAT{
+	patWithUser := types.GettablePAT{
 		StorablePersonalAccessToken: pats[0],
 	}
 
 	return &patWithUser, nil
 }
 
-func (m *modelDao) GetPATByID(ctx context.Context, orgID string, id string) (*model.PAT, basemodel.BaseApiError) {
+func (m *modelDao) GetPATByID(ctx context.Context, orgID string, id valuer.UUID) (*types.GettablePAT, basemodel.BaseApiError) {
 	pats := []types.StorablePersonalAccessToken{}
 
 	if err := m.DB().NewSelect().
 		Model(&pats).
-		Where("id = ?", id).
+		Where("id = ?", id.StringValue()).
 		Where("org_id = ?", orgID).
 		Where("revoked = false").
 		Scan(ctx); err != nil {
@@ -172,7 +190,7 @@ func (m *modelDao) GetPATByID(ctx context.Context, orgID string, id string) (*mo
 		}
 	}
 
-	patWithUser := model.PAT{
+	patWithUser := types.GettablePAT{
 		StorablePersonalAccessToken: pats[0],
 	}
 
@@ -180,8 +198,8 @@ func (m *modelDao) GetPATByID(ctx context.Context, orgID string, id string) (*mo
 }
 
 // deprecated
-func (m *modelDao) GetUserByPAT(ctx context.Context, orgID string, token string) (*types.GettableUser, basemodel.BaseApiError) {
-	users := []types.GettableUser{}
+func (m *modelDao) GetUserByPAT(ctx context.Context, orgID string, token string) (*ossTypes.GettableUser, basemodel.BaseApiError) {
+	users := []ossTypes.GettableUser{}
 
 	if err := m.DB().NewSelect().
 		Model(&users).

ee/query-service/interfaces/connector.go

@@ -7,6 +7,5 @@ import (
 // Connector defines methods for interaction
 // with o11y data. for example - clickhouse
 type DataConnector interface {
-	Start(readerReady chan bool)
 	baseint.Reader
 }

ee/query-service/main.go

@@ -7,17 +7,17 @@ import (
 	"time"
 
 	"github.com/SigNoz/signoz/ee/query-service/app"
+	"github.com/SigNoz/signoz/ee/sqlstore/postgressqlstore"
 	"github.com/SigNoz/signoz/pkg/config"
 	"github.com/SigNoz/signoz/pkg/config/envprovider"
 	"github.com/SigNoz/signoz/pkg/config/fileprovider"
 	"github.com/SigNoz/signoz/pkg/query-service/auth"
 	baseconst "github.com/SigNoz/signoz/pkg/query-service/constants"
 	"github.com/SigNoz/signoz/pkg/signoz"
+	"github.com/SigNoz/signoz/pkg/sqlstore/sqlstorehook"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
 	"github.com/SigNoz/signoz/pkg/version"
 
-	prommodel "github.com/prometheus/common/model"
-
 	"go.uber.org/zap"
 	"go.uber.org/zap/zapcore"
 )
@@ -30,10 +30,6 @@ func initZapLog() *zap.Logger {
 	return logger
 }
 
-func init() {
-	prommodel.NameValidationScheme = prommodel.UTF8Validation
-}
-
 func main() {
 	var promConfigPath, skipTopLvlOpsPath string
 
@@ -87,6 +83,7 @@ func main() {
 		MaxIdleConns: maxIdleConns,
 		MaxOpenConns: maxOpenConns,
 		DialTimeout:  dialTimeout,
+		Config:       promConfigPath,
 	})
 	if err != nil {
 		zap.L().Fatal("Failed to create config", zap.Error(err))
@@ -94,16 +91,21 @@ func main() {
 
 	version.Info.PrettyPrint(config.Version)
 
+	sqlStoreFactories := signoz.NewSQLStoreProviderFactories()
+	if err := sqlStoreFactories.Add(postgressqlstore.NewFactory(sqlstorehook.NewLoggingFactory())); err != nil {
+		zap.L().Fatal("Failed to add postgressqlstore factory", zap.Error(err))
+	}
+
 	signoz, err := signoz.New(
 		context.Background(),
 		config,
 		signoz.NewCacheProviderFactories(),
 		signoz.NewWebProviderFactories(),
-		signoz.NewSQLStoreProviderFactories(),
+		sqlStoreFactories,
 		signoz.NewTelemetryStoreProviderFactories(),
 	)
 	if err != nil {
-		zap.L().Fatal("Failed to create signoz struct", zap.Error(err))
+		zap.L().Fatal("Failed to create signoz", zap.Error(err))
 	}
 
 	jwtSecret := os.Getenv("SIGNOZ_JWT_SECRET")

ee/query-service/model/pat.go

@@ -1,25 +1,7 @@
 package model
 
-import "github.com/SigNoz/signoz/pkg/types"
-
-type User struct {
-	Id                string `json:"id" db:"id"`
-	Name              string `json:"name" db:"name"`
-	Email             string `json:"email" db:"email"`
-	CreatedAt         int64  `json:"createdAt" db:"created_at"`
-	ProfilePictureURL string `json:"profilePictureURL" db:"profile_picture_url"`
-	NotFound          bool   `json:"notFound"`
-}
-
 type CreatePATRequestBody struct {
 	Name          string `json:"name"`
 	Role          string `json:"role"`
 	ExpiresInDays int64  `json:"expiresInDays"`
 }
-
-type PAT struct {
-	CreatedByUser User `json:"createdByUser"`
-	UpdatedByUser User `json:"updatedByUser"`
-
-	types.StorablePersonalAccessToken
-}

ee/query-service/model/plans.go

@@ -52,13 +52,6 @@ var BasicPlan = basemodel.FeatureSet{
 		UsageLimit: -1,
 		Route:      "",
 	},
-	basemodel.Feature{
-		Name:       basemodel.SmartTraceDetail,
-		Active:     false,
-		Usage:      0,
-		UsageLimit: -1,
-		Route:      "",
-	},
 	basemodel.Feature{
 		Name:       basemodel.CustomMetricsFunction,
 		Active:     false,
@@ -157,6 +150,13 @@ var BasicPlan = basemodel.FeatureSet{
 		UsageLimit: -1,
 		Route:      "",
 	},
+	basemodel.Feature{
+		Name:       basemodel.TraceFunnels,
+		Active:     false,
+		Usage:      0,
+		UsageLimit: -1,
+		Route:      "",
+	},
 }
 
 var ProPlan = basemodel.FeatureSet{
@@ -174,13 +174,6 @@ var ProPlan = basemodel.FeatureSet{
 		UsageLimit: -1,
 		Route:      "",
 	},
-	basemodel.Feature{
-		Name:       basemodel.SmartTraceDetail,
-		Active:     true,
-		Usage:      0,
-		UsageLimit: -1,
-		Route:      "",
-	},
 	basemodel.Feature{
 		Name:       basemodel.CustomMetricsFunction,
 		Active:     true,
@@ -279,6 +272,13 @@ var ProPlan = basemodel.FeatureSet{
 		UsageLimit: -1,
 		Route:      "",
 	},
+	basemodel.Feature{
+		Name:       basemodel.TraceFunnels,
+		Active:     false,
+		Usage:      0,
+		UsageLimit: -1,
+		Route:      "",
+	},
 }
 
 var EnterprisePlan = basemodel.FeatureSet{
@@ -296,13 +296,6 @@ var EnterprisePlan = basemodel.FeatureSet{
 		UsageLimit: -1,
 		Route:      "",
 	},
-	basemodel.Feature{
-		Name:       basemodel.SmartTraceDetail,
-		Active:     true,
-		Usage:      0,
-		UsageLimit: -1,
-		Route:      "",
-	},
 	basemodel.Feature{
 		Name:       basemodel.CustomMetricsFunction,
 		Active:     true,
@@ -415,4 +408,11 @@ var EnterprisePlan = basemodel.FeatureSet{
 		UsageLimit: -1,
 		Route:      "",
 	},
+	basemodel.Feature{
+		Name:       basemodel.TraceFunnels,
+		Active:     false,
+		Usage:      0,
+		UsageLimit: -1,
+		Route:      "",
+	},
 }

ee/query-service/rules/manager.go

@@ -48,7 +48,7 @@ func PrepareTaskFunc(opts baserules.PrepareTaskOptions) (baserules.Task, error)
 			opts.Rule,
 			opts.Logger,
 			opts.Reader,
-			opts.ManagerOpts.PqlEngine,
+			opts.ManagerOpts.Prometheus,
 			baserules.WithSQLStore(opts.SQLStore),
 		)
 
@@ -145,7 +145,7 @@ func TestNotification(opts baserules.PrepareTestRuleOptions) (int, *basemodel.Ap
 			parsedRule,
 			opts.Logger,
 			opts.Reader,
-			opts.ManagerOpts.PqlEngine,
+			opts.ManagerOpts.Prometheus,
 			baserules.WithSendAlways(),
 			baserules.WithSendUnmatched(),
 			baserules.WithSQLStore(opts.SQLStore),

ee/sqlstore/postgressqlstore/dialect.go

@@ -0,0 +1,366 @@
+package postgressqlstore
+
+import (
+	"context"
+	"fmt"
+	"reflect"
+	"slices"
+
+	"github.com/SigNoz/signoz/pkg/errors"
+	"github.com/uptrace/bun"
+)
+
+var (
+	Identity = "id"
+	Integer  = "bigint"
+	Text     = "text"
+)
+
+var (
+	Org  = "org"
+	User = "user"
+)
+
+var (
+	OrgReference  = `("org_id") REFERENCES "organizations" ("id")`
+	UserReference = `("user_id") REFERENCES "users" ("id") ON DELETE CASCADE ON UPDATE CASCADE`
+)
+
+type dialect struct {
+}
+
+func (dialect *dialect) MigrateIntToTimestamp(ctx context.Context, bun bun.IDB, table string, column string) error {
+	columnType, err := dialect.GetColumnType(ctx, bun, table, column)
+	if err != nil {
+		return err
+	}
+
+	// bigint for postgres and INTEGER for sqlite
+	if columnType != "bigint" {
+		return nil
+	}
+
+	// if the columns is integer then do this
+	if _, err := bun.
+		ExecContext(ctx, `ALTER TABLE `+table+` RENAME COLUMN `+column+` TO `+column+`_old`); err != nil {
+		return err
+	}
+
+	// add new timestamp column
+	if _, err := bun.
+		NewAddColumn().
+		Table(table).
+		ColumnExpr(column + " TIMESTAMP").
+		Exec(ctx); err != nil {
+		return err
+	}
+
+	if _, err := bun.
+		NewUpdate().
+		Table(table).
+		Set(column + " = to_timestamp(cast(" + column + "_old as INTEGER))").
+		Where("1=1").
+		Exec(ctx); err != nil {
+		return err
+	}
+
+	// drop old column
+	if _, err := bun.
+		NewDropColumn().
+		Table(table).
+		Column(column + "_old").
+		Exec(ctx); err != nil {
+		return err
+	}
+
+	return nil
+}
+
+func (dialect *dialect) MigrateIntToBoolean(ctx context.Context, bun bun.IDB, table string, column string) error {
+	columnType, err := dialect.GetColumnType(ctx, bun, table, column)
+	if err != nil {
+		return err
+	}
+
+	if columnType != "bigint" {
+		return nil
+	}
+
+	if _, err := bun.
+		ExecContext(ctx, `ALTER TABLE `+table+` RENAME COLUMN `+column+` TO `+column+`_old`); err != nil {
+		return err
+	}
+
+	// add new boolean column
+	if _, err := bun.
+		NewAddColumn().
+		Table(table).
+		ColumnExpr(column + " BOOLEAN").
+		Exec(ctx); err != nil {
+		return err
+	}
+
+	// copy data from old column to new column, converting from int to boolean
+	if _, err := bun.NewUpdate().
+		Table(table).
+		Set(column + " = CASE WHEN " + column + "_old = 1 THEN true ELSE false END").
+		Where("1=1").
+		Exec(ctx); err != nil {
+		return err
+	}
+
+	// drop old column
+	if _, err := bun.NewDropColumn().Table(table).Column(column + "_old").Exec(ctx); err != nil {
+		return err
+	}
+
+	return nil
+}
+
+func (dialect *dialect) GetColumnType(ctx context.Context, bun bun.IDB, table string, column string) (string, error) {
+	var columnType string
+
+	err := bun.NewSelect().
+		ColumnExpr("data_type").
+		TableExpr("information_schema.columns").
+		Where("table_name = ?", table).
+		Where("column_name = ?", column).
+		Scan(ctx, &columnType)
+	if err != nil {
+		return "", err
+	}
+
+	return columnType, nil
+}
+
+func (dialect *dialect) ColumnExists(ctx context.Context, bun bun.IDB, table string, column string) (bool, error) {
+	var count int
+	err := bun.NewSelect().
+		ColumnExpr("COUNT(*)").
+		TableExpr("information_schema.columns").
+		Where("table_name = ?", table).
+		Where("column_name = ?", column).
+		Scan(ctx, &count)
+
+	if err != nil {
+		return false, err
+	}
+
+	return count > 0, nil
+}
+
+func (dialect *dialect) RenameColumn(ctx context.Context, bun bun.IDB, table string, oldColumnName string, newColumnName string) (bool, error) {
+	oldColumnExists, err := dialect.ColumnExists(ctx, bun, table, oldColumnName)
+	if err != nil {
+		return false, err
+	}
+
+	newColumnExists, err := dialect.ColumnExists(ctx, bun, table, newColumnName)
+	if err != nil {
+		return false, err
+	}
+
+	if !oldColumnExists && newColumnExists {
+		return true, nil
+	}
+
+	_, err = bun.
+		ExecContext(ctx, "ALTER TABLE "+table+" RENAME COLUMN "+oldColumnName+" TO "+newColumnName)
+	if err != nil {
+		return false, err
+	}
+	return true, nil
+}
+
+func (dialect *dialect) TableExists(ctx context.Context, bun bun.IDB, table interface{}) (bool, error) {
+
+	count := 0
+	err := bun.
+		NewSelect().
+		ColumnExpr("count(*)").
+		Table("pg_catalog.pg_tables").
+		Where("tablename = ?", bun.Dialect().Tables().Get(reflect.TypeOf(table)).Name).
+		Scan(ctx, &count)
+
+	if err != nil {
+		return false, err
+	}
+
+	if count == 0 {
+		return false, nil
+	}
+
+	return true, nil
+}
+
+func (dialect *dialect) RenameTableAndModifyModel(ctx context.Context, bun bun.IDB, oldModel interface{}, newModel interface{}, references []string, cb func(context.Context) error) error {
+	if len(references) == 0 {
+		return errors.Newf(errors.TypeInvalidInput, errors.CodeInvalidInput, "cannot run migration without reference")
+	}
+	exists, err := dialect.TableExists(ctx, bun, newModel)
+	if err != nil {
+		return err
+	}
+	if exists {
+		return nil
+	}
+
+	var fkReferences []string
+	for _, reference := range references {
+		if reference == Org && !slices.Contains(fkReferences, OrgReference) {
+			fkReferences = append(fkReferences, OrgReference)
+		} else if reference == User && !slices.Contains(fkReferences, UserReference) {
+			fkReferences = append(fkReferences, UserReference)
+		}
+	}
+
+	createTable := bun.
+		NewCreateTable().
+		IfNotExists().
+		Model(newModel)
+
+	for _, fk := range fkReferences {
+		createTable = createTable.ForeignKey(fk)
+	}
+
+	_, err = createTable.Exec(ctx)
+	if err != nil {
+		return err
+	}
+
+	err = cb(ctx)
+	if err != nil {
+		return err
+	}
+
+	_, err = bun.
+		NewDropTable().
+		IfExists().
+		Model(oldModel).
+		Exec(ctx)
+	if err != nil {
+		return err
+	}
+
+	return nil
+}
+
+func (dialect *dialect) AddNotNullDefaultToColumn(ctx context.Context, bun bun.IDB, table string, column, columnType, defaultValue string) error {
+	query := fmt.Sprintf("ALTER TABLE %s ALTER COLUMN %s SET DEFAULT %s, ALTER COLUMN %s SET NOT NULL", table, column, defaultValue, column)
+	if _, err := bun.ExecContext(ctx, query); err != nil {
+		return err
+	}
+	return nil
+}
+
+func (dialect *dialect) UpdatePrimaryKey(ctx context.Context, bun bun.IDB, oldModel interface{}, newModel interface{}, reference string, cb func(context.Context) error) error {
+	if reference == "" {
+		return errors.Newf(errors.TypeInvalidInput, errors.CodeInvalidInput, "cannot run migration without reference")
+	}
+	oldTableName := bun.Dialect().Tables().Get(reflect.TypeOf(oldModel)).Name
+	newTableName := bun.Dialect().Tables().Get(reflect.TypeOf(newModel)).Name
+
+	columnType, err := dialect.GetColumnType(ctx, bun, oldTableName, Identity)
+	if err != nil {
+		return err
+	}
+	if columnType == Text {
+		return nil
+	}
+
+	fkReference := ""
+	if reference == Org {
+		fkReference = OrgReference
+	} else if reference == User {
+		fkReference = UserReference
+	}
+
+	_, err = bun.
+		NewCreateTable().
+		IfNotExists().
+		Model(newModel).
+		ForeignKey(fkReference).
+		Exec(ctx)
+
+	if err != nil {
+		return err
+	}
+
+	err = cb(ctx)
+	if err != nil {
+		return err
+	}
+
+	_, err = bun.
+		NewDropTable().
+		IfExists().
+		Model(oldModel).
+		Exec(ctx)
+	if err != nil {
+		return err
+	}
+
+	_, err = bun.
+		ExecContext(ctx, fmt.Sprintf("ALTER TABLE %s RENAME TO %s", newTableName, oldTableName))
+	if err != nil {
+		return err
+	}
+
+	return nil
+}
+
+func (dialect *dialect) AddPrimaryKey(ctx context.Context, bun bun.IDB, oldModel interface{}, newModel interface{}, reference string, cb func(context.Context) error) error {
+	if reference == "" {
+		return errors.Newf(errors.TypeInvalidInput, errors.CodeInvalidInput, "cannot run migration without reference")
+	}
+	oldTableName := bun.Dialect().Tables().Get(reflect.TypeOf(oldModel)).Name
+	newTableName := bun.Dialect().Tables().Get(reflect.TypeOf(newModel)).Name
+
+	identityExists, err := dialect.ColumnExists(ctx, bun, oldTableName, Identity)
+	if err != nil {
+		return err
+	}
+	if identityExists {
+		return nil
+	}
+
+	fkReference := ""
+	if reference == Org {
+		fkReference = OrgReference
+	} else if reference == User {
+		fkReference = UserReference
+	}
+
+	_, err = bun.
+		NewCreateTable().
+		IfNotExists().
+		Model(newModel).
+		ForeignKey(fkReference).
+		Exec(ctx)
+
+	if err != nil {
+		return err
+	}
+
+	err = cb(ctx)
+	if err != nil {
+		return err
+	}
+
+	_, err = bun.
+		NewDropTable().
+		IfExists().
+		Model(oldModel).
+		Exec(ctx)
+	if err != nil {
+		return err
+	}
+
+	_, err = bun.
+		ExecContext(ctx, fmt.Sprintf("ALTER TABLE %s RENAME TO %s", newTableName, oldTableName))
+	if err != nil {
+		return err
+	}
+
+	return nil
+}

ee/types/personal_access_token.go

@@ -0,0 +1,76 @@
+package types
+
+import (
+	"crypto/rand"
+	"encoding/base64"
+	"time"
+
+	"github.com/SigNoz/signoz/pkg/types"
+	"github.com/SigNoz/signoz/pkg/valuer"
+	"github.com/uptrace/bun"
+)
+
+type GettablePAT struct {
+	CreatedByUser PatUser `json:"createdByUser"`
+	UpdatedByUser PatUser `json:"updatedByUser"`
+
+	StorablePersonalAccessToken
+}
+
+type PatUser struct {
+	types.User
+	NotFound bool `json:"notFound"`
+}
+
+func NewGettablePAT(name, role, userID string, expiresAt int64) GettablePAT {
+	return GettablePAT{
+		StorablePersonalAccessToken: NewStorablePersonalAccessToken(name, role, userID, expiresAt),
+	}
+}
+
+type StorablePersonalAccessToken struct {
+	bun.BaseModel `bun:"table:personal_access_token"`
+	types.Identifiable
+	types.TimeAuditable
+	OrgID           string `json:"orgId" bun:"org_id,type:text,notnull"`
+	Role            string `json:"role" bun:"role,type:text,notnull,default:'ADMIN'"`
+	UserID          string `json:"userId" bun:"user_id,type:text,notnull"`
+	Token           string `json:"token" bun:"token,type:text,notnull,unique"`
+	Name            string `json:"name" bun:"name,type:text,notnull"`
+	ExpiresAt       int64  `json:"expiresAt" bun:"expires_at,notnull,default:0"`
+	LastUsed        int64  `json:"lastUsed" bun:"last_used,notnull,default:0"`
+	Revoked         bool   `json:"revoked" bun:"revoked,notnull,default:false"`
+	UpdatedByUserID string `json:"updatedByUserId" bun:"updated_by_user_id,type:text,notnull,default:''"`
+}
+
+func NewStorablePersonalAccessToken(name, role, userID string, expiresAt int64) StorablePersonalAccessToken {
+	now := time.Now()
+	if expiresAt != 0 {
+		// convert expiresAt to unix timestamp from days
+		expiresAt = now.Unix() + (expiresAt * 24 * 60 * 60)
+	}
+
+	// Generate a 32-byte random token.
+	token := make([]byte, 32)
+	rand.Read(token)
+	// Encode the token in base64.
+	encodedToken := base64.StdEncoding.EncodeToString(token)
+
+	return StorablePersonalAccessToken{
+		Token:           encodedToken,
+		Name:            name,
+		Role:            role,
+		UserID:          userID,
+		ExpiresAt:       expiresAt,
+		LastUsed:        0,
+		Revoked:         false,
+		UpdatedByUserID: "",
+		TimeAuditable: types.TimeAuditable{
+			CreatedAt: now,
+			UpdatedAt: now,
+		},
+		Identifiable: types.Identifiable{
+			ID: valuer.GenerateUUID(),
+		},
+	}
+}

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

@@ -18,6 +18,13 @@
   "field_send_resolved": "Send resolved alerts",
   "field_channel_type": "Type",
   "field_webhook_url": "Webhook URL",
+  "tooltip_webhook_url": "The URL of the webhook to send alerts to. Learn more about webhook integration in the docs [here](https://signoz.io/docs/alerts-management/notification-channel/webhook/). Integrates with [Incident.io](https://signoz.io/docs/alerts-management/notification-channel/incident-io/), [Rootly](https://signoz.io/docs/alerts-management/notification-channel/rootly/), [Zenduty](https://signoz.io/docs/alerts-management/notification-channel/zenduty/) and [more](https://signoz.io/docs/alerts-management/notification-channel/webhook/#my-incident-management-tool-is-not-listed-can-i-still-integrate).",
+  "tooltip_slack_url": "The URL of the slack [incoming webhook](https://docs.slack.dev/messaging/sending-messages-using-incoming-webhooks/) to send alerts to. Learn more about slack integration in the docs [here](https://signoz.io/docs/alerts-management/notification-channel/slack/).",
+  "tooltip_pager_routing_key": "Learn how to obtain the routing key from your PagerDuty account [here](https://signoz.io/docs/alerts-management/notification-channel/pagerduty/#obtaining-integration-or-routing-key).",
+  "tooltip_opsgenie_api_key": "Learn how to obtain the API key from your OpsGenie account [here](https://support.atlassian.com/opsgenie/docs/integrate-opsgenie-with-prometheus/).",
+  "tooltip_email_to": "Enter email addresses separated by commas.",
+  "tooltip_ms_teams_url": "The URL of the Microsoft Teams [webhook](https://support.microsoft.com/en-us/office/create-incoming-webhooks-with-workflows-for-microsoft-teams-8ae491c7-0394-4861-ba59-055e33f75498) to send alerts to. Learn more about Microsoft Teams integration in the docs [here](https://signoz.io/docs/alerts-management/notification-channel/ms-teams/).",
+
   "field_slack_recipient": "Recipient",
   "field_slack_title": "Title",
   "field_slack_description": "Description",

frontend/public/locales/en/channels.json

@@ -18,6 +18,12 @@
   "field_send_resolved": "Send resolved alerts",
   "field_channel_type": "Type",
   "field_webhook_url": "Webhook URL",
+  "tooltip_webhook_url": "The URL of the webhook to send alerts to. Learn more about webhook integration in the docs [here](https://signoz.io/docs/alerts-management/notification-channel/webhook/). Integrates with [Incident.io](https://signoz.io/docs/alerts-management/notification-channel/incident-io/), [Rootly](https://signoz.io/docs/alerts-management/notification-channel/rootly/), [Zenduty](https://signoz.io/docs/alerts-management/notification-channel/zenduty/) and [more](https://signoz.io/docs/alerts-management/notification-channel/webhook/#my-incident-management-tool-is-not-listed-can-i-still-integrate).",
+  "tooltip_slack_url": "The URL of the slack [incoming webhook](https://docs.slack.dev/messaging/sending-messages-using-incoming-webhooks/) to send alerts to. Learn more about slack integration in the docs [here](https://signoz.io/docs/alerts-management/notification-channel/slack/).",
+  "tooltip_pager_routing_key": "Learn how to obtain the routing key from your PagerDuty account [here](https://signoz.io/docs/alerts-management/notification-channel/pagerduty/#obtaining-integration-or-routing-key).",
+  "tooltip_opsgenie_api_key": "Learn how to obtain the API key from your OpsGenie account [here](https://support.atlassian.com/opsgenie/docs/integrate-opsgenie-with-prometheus/).",
+  "tooltip_email_to": "Enter email addresses separated by commas.",
+  "tooltip_ms_teams_url": "The URL of the Microsoft Teams [webhook](https://support.microsoft.com/en-us/office/create-incoming-webhooks-with-workflows-for-microsoft-teams-8ae491c7-0394-4861-ba59-055e33f75498) to send alerts to. Learn more about Microsoft Teams integration in the docs [here](https://signoz.io/docs/alerts-management/notification-channel/ms-teams/).",
   "field_slack_recipient": "Recipient",
   "field_slack_title": "Title",
   "field_slack_description": "Description",

frontend/public/locales/en/titles.json

@@ -60,10 +60,14 @@
 	"INTEGRATIONS": "SigNoz | Integrations",
 	"ALERT_HISTORY": "SigNoz | Alert Rule History",
 	"ALERT_OVERVIEW": "SigNoz | Alert Rule Overview",
-	"MESSAGING_QUEUES": "SigNoz | Messaging Queues",
+	"MESSAGING_QUEUES_OVERVIEW": "SigNoz | Messaging Queues",
+	"MESSAGING_QUEUES_KAFKA": "SigNoz | Messaging Queues | Kafka",
+	"MESSAGING_QUEUES_KAFKA_DETAIL": "SigNoz | Messaging Queues | Kafka",
+	"MESSAGING_QUEUES_CELERY_TASK": "SigNoz | Messaging Queues | Celery",
 	"INFRASTRUCTURE_MONITORING_HOSTS": "SigNoz | Infra Monitoring",
 	"INFRASTRUCTURE_MONITORING_KUBERNETES": "SigNoz | Infra Monitoring",
 	"METRICS_EXPLORER": "SigNoz | Metrics Explorer",
 	"METRICS_EXPLORER_EXPLORER": "SigNoz | Metrics Explorer",
-	"METRICS_EXPLORER_VIEWS": "SigNoz | Metrics Explorer"
+	"METRICS_EXPLORER_VIEWS": "SigNoz | Metrics Explorer",
+	"API_MONITORING": "SigNoz | API Monitoring"
 }

frontend/src/AppRoutes/index.tsx

@@ -1,3 +1,4 @@
+import * as Sentry from '@sentry/react';
 import { ConfigProvider } from 'antd';
 import getLocalStorageApi from 'api/browser/localstorage/get';
 import setLocalStorageApi from 'api/browser/localstorage/set';
@@ -15,6 +16,7 @@ import { LICENSE_PLAN_KEY } from 'hooks/useLicense';
 import { NotificationProvider } from 'hooks/useNotifications';
 import { ResourceProvider } from 'hooks/useResourceAttribute';
 import history from 'lib/history';
+import ErrorBoundaryFallback from 'pages/ErrorBoundaryFallback/ErrorBoundaryFallback';
 import posthog from 'posthog-js';
 import AlertRuleProvider from 'providers/Alert';
 import { useAppContext } from 'providers/App/App';
@@ -26,6 +28,7 @@ import { Route, Router, Switch } from 'react-router-dom';
 import { CompatRouter } from 'react-router-dom-v5-compat';
 import { extractDomain } from 'utils/app';
 
+import { Home } from './pageComponents';
 import PrivateRoute from './Private';
 import defaultRoutes, {
 	AppRoutes,
@@ -45,7 +48,6 @@ function App(): JSX.Element {
 		activeLicenseV3,
 		isFetchingActiveLicenseV3,
 		userFetchError,
-		licensesFetchError,
 		featureFlagsFetchError,
 		isLoggedIn: isLoggedInState,
 		featureFlags,
@@ -55,10 +57,7 @@ function App(): JSX.Element {
 
 	const { hostname, pathname } = window.location;
 
-	const {
-		isCloudUser: isCloudUserVal,
-		isEECloudUser: isEECloudUserVal,
-	} = useGetTenantLicense();
+	const { isCloudUser, isEnterpriseSelfHostedUser } = useGetTenantLicense();
 
 	const enableAnalytics = useCallback(
 		(user: IUser): void => {
@@ -168,7 +167,7 @@ function App(): JSX.Element {
 
 			let updatedRoutes = defaultRoutes;
 			// if the user is a cloud user
-			if (isCloudUserVal || isEECloudUserVal) {
+			if (isCloudUser || isEnterpriseSelfHostedUser) {
 				// if the user is on basic plan then remove billing
 				if (isOnBasicPlan) {
 					updatedRoutes = updatedRoutes.filter(
@@ -190,10 +189,10 @@ function App(): JSX.Element {
 		isLoggedInState,
 		user,
 		licenses,
-		isCloudUserVal,
+		isCloudUser,
+		isEnterpriseSelfHostedUser,
 		isFetchingLicenses,
 		isFetchingUser,
-		isEECloudUserVal,
 	]);
 
 	useEffect(() => {
@@ -208,6 +207,7 @@ function App(): JSX.Element {
 		}
 	}, [pathname]);
 
+	// eslint-disable-next-line sonarjs/cognitive-complexity
 	useEffect(() => {
 		// feature flag shouldn't be loading and featureFlags or fetchError any one of this should be true indicating that req is complete
 		// licenses should also be present. there is no check for licenses for loading and error as that is mandatory if not present then routing
@@ -233,7 +233,12 @@ function App(): JSX.Element {
 			const showAddCreditCardModal =
 				!isPremiumSupportEnabled && !trialInfo?.trialConvertedToSubscription;
 
-			if (isLoggedInState && isChatSupportEnabled && !showAddCreditCardModal) {
+			if (
+				isLoggedInState &&
+				isChatSupportEnabled &&
+				!showAddCreditCardModal &&
+				(isCloudUser || isEnterpriseSelfHostedUser)
+			) {
 				window.Intercom('boot', {
 					app_id: process.env.INTERCOM_APP_ID,
 					email: user?.email || '',
@@ -252,13 +257,53 @@ function App(): JSX.Element {
 		licenses,
 		activeLicenseV3,
 		trialInfo,
+		isCloudUser,
+		isEnterpriseSelfHostedUser,
 	]);
 
 	useEffect(() => {
-		if (!isFetchingUser && isCloudUserVal && user && user.email) {
+		if (!isFetchingUser && isCloudUser && user && user.email) {
 			enableAnalytics(user);
 		}
-	}, [user, isFetchingUser, isCloudUserVal, enableAnalytics]);
+	}, [user, isFetchingUser, isCloudUser, enableAnalytics]);
+
+	useEffect(() => {
+		if (isCloudUser || isEnterpriseSelfHostedUser) {
+			if (process.env.POSTHOG_KEY) {
+				posthog.init(process.env.POSTHOG_KEY, {
+					api_host: 'https://us.i.posthog.com',
+					person_profiles: 'identified_only', // or 'always' to create profiles for anonymous users as well
+				});
+			}
+
+			Sentry.init({
+				dsn: process.env.SENTRY_DSN,
+				tunnel: process.env.TUNNEL_URL,
+				environment: 'production',
+				integrations: [
+					Sentry.browserTracingIntegration(),
+					Sentry.replayIntegration({
+						maskAllText: false,
+						blockAllMedia: false,
+					}),
+				],
+				// Performance Monitoring
+				tracesSampleRate: 1.0, //  Capture 100% of the transactions
+				// Set 'tracePropagationTargets' to control for which URLs distributed tracing should be enabled
+				tracePropagationTargets: [],
+				// Session Replay
+				replaysSessionSampleRate: 0.1, // This sets the sample rate at 10%. You may want to change it to 100% while in development and then sample at a lower rate in production.
+				replaysOnErrorSampleRate: 1.0, // If you're not already sampling the entire session, change the sample rate to 100% when sampling sessions where errors occur.
+			});
+		} else {
+			posthog.reset();
+			Sentry.close();
+
+			if (window.cioanalytics && typeof window.cioanalytics.reset === 'function') {
+				window.cioanalytics.reset();
+			}
+		}
+	}, [isCloudUser, isEnterpriseSelfHostedUser]);
 
 	// if the user is in logged in state
 	if (isLoggedInState) {
@@ -270,60 +315,55 @@ function App(): JSX.Element {
 		// if the required calls fails then return a something went wrong error
 		// this needs to be on top of data missing error because if there is an error, data will never be loaded and it will
 		// move to indefinitive loading
-		if (
-			(userFetchError || licensesFetchError) &&
-			pathname !== ROUTES.SOMETHING_WENT_WRONG
-		) {
+		if (userFetchError && pathname !== ROUTES.SOMETHING_WENT_WRONG) {
 			history.replace(ROUTES.SOMETHING_WENT_WRONG);
 		}
 
 		// if all of the data is not set then return a spinner, this is required because there is some gap between loading states and data setting
-		if (
-			(!licenses || !user.email || !featureFlags) &&
-			!userFetchError &&
-			!licensesFetchError
-		) {
+		if ((!licenses || !user.email || !featureFlags) && !userFetchError) {
 			return <Spinner tip="Loading..." />;
 		}
 	}
 
 	return (
-		<ConfigProvider theme={themeConfig}>
-			<Router history={history}>
-				<CompatRouter>
-					<NotificationProvider>
-						<PrivateRoute>
-							<ResourceProvider>
-								<QueryBuilderProvider>
-									<DashboardProvider>
-										<KeyboardHotkeysProvider>
-											<AlertRuleProvider>
-												<AppLayout>
-													<Suspense fallback={<Spinner size="large" tip="Loading..." />}>
-														<Switch>
-															{routes.map(({ path, component, exact }) => (
-																<Route
-																	key={`${path}`}
-																	exact={exact}
-																	path={path}
-																	component={component}
-																/>
-															))}
-
-															<Route path="*" component={NotFound} />
-														</Switch>
-													</Suspense>
-												</AppLayout>
-											</AlertRuleProvider>
-										</KeyboardHotkeysProvider>
-									</DashboardProvider>
-								</QueryBuilderProvider>
-							</ResourceProvider>
-						</PrivateRoute>
-					</NotificationProvider>
-				</CompatRouter>
-			</Router>
-		</ConfigProvider>
+		<Sentry.ErrorBoundary fallback={<ErrorBoundaryFallback />}>
+			<ConfigProvider theme={themeConfig}>
+				<Router history={history}>
+					<CompatRouter>
+						<NotificationProvider>
+							<PrivateRoute>
+								<ResourceProvider>
+									<QueryBuilderProvider>
+										<DashboardProvider>
+											<KeyboardHotkeysProvider>
+												<AlertRuleProvider>
+													<AppLayout>
+														<Suspense fallback={<Spinner size="large" tip="Loading..." />}>
+															<Switch>
+																{routes.map(({ path, component, exact }) => (
+																	<Route
+																		key={`${path}`}
+																		exact={exact}
+																		path={path}
+																		component={component}
+																	/>
+																))}
+																<Route exact path="/" component={Home} />
+																<Route path="*" component={NotFound} />
+															</Switch>
+														</Suspense>
+													</AppLayout>
+												</AlertRuleProvider>
+											</KeyboardHotkeysProvider>
+										</DashboardProvider>
+									</QueryBuilderProvider>
+								</ResourceProvider>
+							</PrivateRoute>
+						</NotificationProvider>
+					</CompatRouter>
+				</Router>
+			</ConfigProvider>
+		</Sentry.ErrorBoundary>
 	);
 }
 

frontend/src/components/CeleryOverview/CeleryOverviewTable/CeleryOverviewTable.tsx

@@ -521,7 +521,7 @@ export default function CeleryOverviewTable({
 				locale={{
 					emptyText: isLoading ? null : <Typography.Text>No data</Typography.Text>,
 				}}
-				scroll={{ x: true }}
+				scroll={{ x: 'max-content' }}
 				showSorterTooltip
 				onDragColumn={handleDragColumn}
 				onRow={(record): { onClick: () => void; className: string } => ({

frontend/src/components/Logs/CopyClipboardHOC.tsx

@@ -18,6 +18,7 @@ function CopyClipboardHOC({
 
 			notifications.success({
 				message: notificationMessage,
+				key: notificationMessage,
 			});
 		}
 	}, [value, notifications, entityKey]);

frontend/src/components/ResizeTable/ResizableHeader.tsx

@@ -1,3 +1,5 @@
+import './ResizeTable.styles.scss';
+
 import { SyntheticEvent, useMemo } from 'react';
 import { Resizable, ResizeCallbackData } from 'react-resizable';
 
@@ -10,8 +12,8 @@ function ResizableHeader(props: ResizableHeaderProps): JSX.Element {
 	const handle = useMemo(
 		() => (
 			<SpanStyle
-				className="react-resizable-handle"
 				onClick={(e): void => e.stopPropagation()}
+				className="resize-handle"
 			/>
 		),
 		[],
@@ -19,7 +21,7 @@ function ResizableHeader(props: ResizableHeaderProps): JSX.Element {
 
 	if (!width) {
 		// eslint-disable-next-line react/jsx-props-no-spreading
-		return <th {...restProps} />;
+		return <th {...restProps} className="resizable-header" />;
 	}
 
 	return (
@@ -29,9 +31,10 @@ function ResizableHeader(props: ResizableHeaderProps): JSX.Element {
 			handle={handle}
 			onResize={onResize}
 			draggableOpts={enableUserSelectHack}
+			minConstraints={[150, 0]}
 		>
 			{/* eslint-disable-next-line react/jsx-props-no-spreading */}
-			<th {...restProps} />
+			<th {...restProps} className="resizable-header" />
 		</Resizable>
 	);
 }

frontend/src/components/ResizeTable/ResizeTable.styles.scss

@@ -0,0 +1,53 @@
+.resizable-header {
+	user-select: none;
+	-webkit-user-select: none;
+	-moz-user-select: none;
+	-ms-user-select: none;
+	position: relative;
+
+	.ant-table-column-title {
+		white-space: normal;
+		overflow: hidden;
+		text-overflow: ellipsis;
+	}
+}
+
+.resize-main-table {
+	.ant-table-body {
+		.ant-table-tbody {
+			.ant-table-row {
+				.ant-table-cell {
+					.ant-typography {
+						white-space: unset;
+					}
+				}
+			}
+		}
+	}
+}
+
+.logs-table,
+.traces-table {
+	.resize-table {
+		.resize-handle {
+			position: absolute;
+			top: 0;
+			bottom: 0;
+			inset-inline-end: -5px;
+			width: 10px;
+			cursor: col-resize;
+
+			&::after {
+				content: '';
+				position: absolute;
+				top: 50%;
+				left: 50%;
+				transform: translate(-50%, -50%);
+				width: 1px;
+				height: 1.6em;
+				background-color: var(--bg-slate-200);
+				transition: background-color 0.2s;
+			}
+		}
+	}
+}

frontend/src/components/ResizeTable/ResizeTable.tsx

@@ -2,35 +2,63 @@
 
 import { Table } from 'antd';
 import { ColumnsType } from 'antd/lib/table';
+import cx from 'classnames';
 import { dragColumnParams } from 'hooks/useDragColumns/configs';
-import { set } from 'lodash-es';
+import { RowData } from 'lib/query/createTableColumnsFromQuery';
+import { debounce, set } from 'lodash-es';
+import { useDashboard } from 'providers/Dashboard/Dashboard';
 import {
 	SyntheticEvent,
 	useCallback,
 	useEffect,
 	useMemo,
+	useRef,
 	useState,
 } from 'react';
 import ReactDragListView from 'react-drag-listview';
 import { ResizeCallbackData } from 'react-resizable';
+import { Widgets } from 'types/api/dashboard/getAll';
 
 import ResizableHeader from './ResizableHeader';
 import { DragSpanStyle } from './styles';
 import { ResizeTableProps } from './types';
 
+// eslint-disable-next-line sonarjs/cognitive-complexity
 function ResizeTable({
 	columns,
 	onDragColumn,
 	pagination,
+	widgetId,
+	shouldPersistColumnWidths = false,
 	...restProps
 }: ResizeTableProps): JSX.Element {
 	const [columnsData, setColumns] = useState<ColumnsType>([]);
+	const { setColumnWidths, selectedDashboard } = useDashboard();
+
+	const columnWidths = shouldPersistColumnWidths
+		? (selectedDashboard?.data?.widgets?.find(
+				(widget) => widget.id === widgetId,
+		  ) as Widgets)?.columnWidths
+		: undefined;
+
+	const updateAllColumnWidths = useRef(
+		debounce((widthsConfig: Record<string, number>) => {
+			if (!widgetId || !shouldPersistColumnWidths) return;
+			setColumnWidths?.((prev) => ({
+				...prev,
+				[widgetId]: widthsConfig,
+			}));
+		}, 1000),
+	).current;
 
 	const handleResize = useCallback(
 		(index: number) => (
-			_e: SyntheticEvent<Element>,
+			e: SyntheticEvent<Element>,
 			{ size }: ResizeCallbackData,
 		): void => {
+			e.preventDefault();
+			e.stopPropagation();
+
 			const newColumns = [...columnsData];
 			newColumns[index] = {
 				...newColumns[index],
@@ -65,6 +93,7 @@ function ResizeTable({
 			...restProps,
 			components: { header: { cell: ResizableHeader } },
 			columns: mergedColumns,
+			className: cx('resize-main-table', restProps.className),
 		};
 
 		set(
@@ -78,9 +107,39 @@ function ResizeTable({
 
 	useEffect(() => {
 		if (columns) {
-			setColumns(columns);
+			// Apply stored column widths from widget configuration
+			const columnsWithStoredWidths = columns.map((col) => {
+				const dataIndex = (col as RowData).dataIndex as string;
+				if (dataIndex && columnWidths && columnWidths[dataIndex]) {
+					return {
+						...col,
+						width: columnWidths[dataIndex], // Apply stored width
+					};
+				}
+				return col;
+			});
+
+			setColumns(columnsWithStoredWidths);
 		}
-	}, [columns]);
+	}, [columns, columnWidths]);
+
+	useEffect(() => {
+		if (!shouldPersistColumnWidths) return;
+		// Collect all column widths in a single object
+		const newColumnWidths: Record<string, number> = {};
+
+		mergedColumns.forEach((col) => {
+			if (col.width && (col as RowData).dataIndex) {
+				const dataIndex = (col as RowData).dataIndex as string;
+				newColumnWidths[dataIndex] = col.width as number;
+			}
+		});
+
+		// Only update if there are actual widths to set
+		if (Object.keys(newColumnWidths).length > 0) {
+			updateAllColumnWidths(newColumnWidths);
+		}
+	}, [mergedColumns, updateAllColumnWidths, shouldPersistColumnWidths]);
 
 	return onDragColumn ? (
 		<ReactDragListView.DragColumn {...dragColumnParams} onDragEnd={onDragColumn}>

frontend/src/components/ResizeTable/styles.ts

@@ -8,6 +8,8 @@ export const SpanStyle = styled.span`
 	width: 0.625rem;
 	height: 100%;
 	cursor: col-resize;
+	margin-left: 4px;
+	margin-right: 4px;
 `;
 
 export const DragSpanStyle = styled.span`

frontend/src/components/ResizeTable/types.ts

@@ -9,6 +9,8 @@ import { TableDataSource } from './contants';
 
 export interface ResizeTableProps extends TableProps<any> {
 	onDragColumn?: (fromIndex: number, toIndex: number) => void;
+	widgetId?: string;
+	shouldPersistColumnWidths?: boolean;
 }
 export interface DynamicColumnTableProps extends TableProps<any> {
 	tablesource: typeof TableDataSource[keyof typeof TableDataSource];

frontend/src/constants/features.ts

@@ -10,7 +10,6 @@ export enum FeatureKeys {
 	ALERT_CHANNEL_MSTEAMS = 'ALERT_CHANNEL_MSTEAMS',
 	DurationSort = 'DurationSort',
 	TimestampSort = 'TimestampSort',
-	SMART_TRACE_DETAIL = 'SMART_TRACE_DETAIL',
 	CUSTOM_METRICS_FUNCTION = 'CUSTOM_METRICS_FUNCTION',
 	QUERY_BUILDER_PANELS = 'QUERY_BUILDER_PANELS',
 	QUERY_BUILDER_ALERTS = 'QUERY_BUILDER_ALERTS',
@@ -25,4 +24,6 @@ export enum FeatureKeys {
 	ANOMALY_DETECTION = 'ANOMALY_DETECTION',
 	AWS_INTEGRATION = 'AWS_INTEGRATION',
 	ONBOARDING_V3 = 'ONBOARDING_V3',
+	THIRD_PARTY_API = 'THIRD_PARTY_API',
+	TRACE_FUNNELS = 'TRACE_FUNNELS',
 }

frontend/src/container/AllAlertChannels/__tests__/AlertChannels.test.tsx

@@ -1,3 +1,4 @@
+import ROUTES from 'constants/routes';
 import AlertChannels from 'container/AllAlertChannels';
 import { allAlertChannels } from 'mocks-server/__mockdata__/alerts';
 import { act, fireEvent, render, screen, waitFor } from 'tests/test-utils';
@@ -20,6 +21,13 @@ jest.mock('hooks/useNotifications', () => ({
 	})),
 }));
 
+jest.mock('react-router-dom', () => ({
+	...jest.requireActual('react-router-dom'),
+	useLocation: (): { pathname: string } => ({
+		pathname: `${process.env.FRONTEND_API_ENDPOINT}${ROUTES.ALL_CHANNELS}`,
+	}),
+}));
+
 describe('Alert Channels Settings List page', () => {
 	beforeEach(() => {
 		render(<AlertChannels />);

frontend/src/container/AllAlertChannels/__tests__/AlertChannelsNormalUser.test.tsx

@@ -1,3 +1,4 @@
+import ROUTES from 'constants/routes';
 import AlertChannels from 'container/AllAlertChannels';
 import { allAlertChannels } from 'mocks-server/__mockdata__/alerts';
 import { fireEvent, render, screen, waitFor } from 'tests/test-utils';
@@ -25,6 +26,13 @@ jest.mock('hooks/useComponentPermission', () => ({
 	default: jest.fn().mockImplementation(() => [false]),
 }));
 
+jest.mock('react-router-dom', () => ({
+	...jest.requireActual('react-router-dom'),
+	useLocation: (): { pathname: string } => ({
+		pathname: `${process.env.FRONTEND_API_ENDPOINT}${ROUTES.ALL_CHANNELS}`,
+	}),
+}));
+
 describe('Alert Channels Settings List page (Normal User)', () => {
 	beforeEach(() => {
 		render(<AlertChannels />);

frontend/src/container/AllAlertChannels/__tests__/CreateAlertChannel.test.tsx

@@ -31,6 +31,10 @@ jest.mock('hooks/useNotifications', () => ({
 	})),
 }));
 
+jest.mock('components/MarkdownRenderer/MarkdownRenderer', () => ({
+	MarkdownRenderer: jest.fn(() => <div>Mocked MarkdownRenderer</div>),
+}));
+
 describe('Create Alert Channel', () => {
 	afterEach(() => {
 		jest.clearAllMocks();

frontend/src/container/AllAlertChannels/__tests__/CreateAlertChannelNormalUser.test.tsx

@@ -18,6 +18,10 @@ import { render, screen } from 'tests/test-utils';
 
 import { testLabelInputAndHelpValue } from './testUtils';
 
+jest.mock('components/MarkdownRenderer/MarkdownRenderer', () => ({
+	MarkdownRenderer: jest.fn(() => <div>Mocked MarkdownRenderer</div>),
+}));
+
 describe('Create Alert Channel (Normal User)', () => {
 	afterEach(() => {
 		jest.clearAllMocks();

frontend/src/container/AllAlertChannels/__tests__/EditAlertChannel.test.tsx

@@ -20,6 +20,10 @@ jest.mock('hooks/useNotifications', () => ({
 	})),
 }));
 
+jest.mock('components/MarkdownRenderer/MarkdownRenderer', () => ({
+	MarkdownRenderer: jest.fn(() => <div>Mocked MarkdownRenderer</div>),
+}));
+
 describe('Should check if the edit alert channel is properly displayed ', () => {
 	beforeEach(() => {
 		render(<EditAlertChannels initialValue={editAlertChannelInitialValue} />);

frontend/src/container/ApiMonitoring/Explorer/Domains/DomainDetails/AllEndPoints.tsx

@@ -1,5 +1,6 @@
 import { LoadingOutlined } from '@ant-design/icons';
 import { Select, Spin, Table, Typography } from 'antd';
+import logEvent from 'api/common/logEvent';
 import { ENTITY_VERSION_V4 } from 'constants/app';
 import { REACT_QUERY_KEY } from 'constants/reactQueryKeys';
 import {
@@ -151,6 +152,7 @@ function AllEndPoints({
 		if (groupBy.length === 0) {
 			setSelectedEndPointName(record.endpointName); // this will open up the endpoint details tab
 			setSelectedView(VIEW_TYPES.ENDPOINT_DETAILS);
+			logEvent('API Monitoring: Endpoint name row clicked', {});
 		} else {
 			handleGroupByRowClick(record); // this will prepare the nested query payload
 		}

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

@@ -392,6 +392,39 @@
 	gap: 20px;
 	padding-top: 20px;
 
+	.endpoint-meta-data {
+		display: flex;
+		gap: 8px;
+		.endpoint-meta-data-pill {
+			display: flex;
+			align-items: flex-start;
+			border-radius: 4px;
+			border: 1px solid var(--bg-slate-300);
+			width: fit-content;
+			.endpoint-meta-data-label {
+				display: flex;
+				padding: 6px 8px;
+				align-items: center;
+				gap: 4px;
+				border-right: 1px solid var(--bg-slate-300);
+				color: var(--text-vanilla-100);
+				background: var(--bg-slate-500);
+				height: calc(100% - 12px);
+			}
+
+			.endpoint-meta-data-value {
+				display: flex;
+				padding: 6px 8px;
+				justify-content: center;
+				align-items: center;
+				gap: 10px;
+				color: var(--text-vanilla-400);
+				background: var(--bg-slate-400);
+				height: calc(100% - 12px);
+			}
+		}
+	}
+
 	.endpoint-details-filters-container {
 		display: flex;
 		flex-direction: row;
@@ -405,6 +438,13 @@
 		}
 	}
 
+	.ant-select-item,
+	.ant-select-item-option-content {
+		flex: auto;
+		white-space: normal;
+		overflow-wrap: break-word;
+	}
+
 	.status-code-table-container {
 		border-radius: 3px;
 		border: 1px solid var(--bg-slate-500);
@@ -809,6 +849,13 @@
 			width: 100%;
 		}
 	}
+
+	.ant-select-item,
+	.ant-select-item-option-content {
+		flex: auto;
+		white-space: normal;
+		overflow-wrap: break-word;
+	}
 }
 
 .lightMode {
@@ -917,6 +964,20 @@
 		}
 	}
 
+	.endpoint-meta-data {
+		.endpoint-meta-data-pill {
+			.endpoint-meta-data-label {
+				color: var(--text-ink-300);
+				background: var(--bg-vanilla-100);
+			}
+
+			.endpoint-meta-data-value {
+				color: var(--text-ink-300);
+				background: var(--bg-vanilla-100);
+			}
+		}
+	}
+
 	.status-code-table-container {
 		.ant-table {
 			.ant-table-thead > tr > th {

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

@@ -19,12 +19,14 @@ function DomainDetails({
 	selectedDomainIndex,
 	setSelectedDomainIndex,
 	domainListLength,
+	domainListFilters,
 }: {
 	domainData: any;
 	handleClose: () => void;
 	selectedDomainIndex: number;
 	setSelectedDomainIndex: (index: number) => void;
 	domainListLength: number;
+	domainListFilters: IBuilderQuery['filters'];
 }): JSX.Element {
 	const [selectedView, setSelectedView] = useState<VIEWS>(VIEWS.ALL_ENDPOINTS);
 	const [selectedEndPointName, setSelectedEndPointName] = useState<string>('');
@@ -132,6 +134,7 @@ function DomainDetails({
 							domainName={domainData.domainName}
 							endPointName={selectedEndPointName}
 							setSelectedEndPointName={setSelectedEndPointName}
+							domainListFilters={domainListFilters}
 						/>
 					)}
 				</>

frontend/src/container/ApiMonitoring/Explorer/Domains/DomainDetails/EndPointDetails.tsx

@@ -2,7 +2,10 @@ import { ENTITY_VERSION_V4 } from 'constants/app';
 import { initialQueriesMap } from 'constants/queryBuilder';
 import {
 	END_POINT_DETAILS_QUERY_KEYS_ARRAY,
+	extractPortAndEndpoint,
 	getEndPointDetailsQueryPayload,
+	getLatencyOverTimeWidgetData,
+	getRateOverTimeWidgetData,
 } from 'container/ApiMonitoring/utils';
 import QueryBuilderSearchV2 from 'container/QueryBuilder/filters/QueryBuilderSearchV2/QueryBuilderSearchV2';
 import { GetMetricQueryRange } from 'lib/dashboard/getQueryResults';
@@ -27,10 +30,12 @@ function EndPointDetails({
 	domainName,
 	endPointName,
 	setSelectedEndPointName,
+	domainListFilters,
 }: {
 	domainName: string;
 	endPointName: string;
 	setSelectedEndPointName: (value: string) => void;
+	domainListFilters: IBuilderQuery['filters'];
 }): JSX.Element {
 	const { maxTime, minTime } = useSelector<AppState, GlobalReducer>(
 		(state) => state.globalTime,
@@ -101,8 +106,6 @@ function EndPointDetails({
 	const [
 		endPointMetricsDataQuery,
 		endPointStatusCodeDataQuery,
-		endPointRateOverTimeDataQuery,
-		endPointLatencyOverTimeDataQuery,
 		endPointDropDownDataQuery,
 		endPointDependentServicesDataQuery,
 		endPointStatusCodeBarChartsDataQuery,
@@ -115,12 +118,29 @@ function EndPointDetails({
 			endPointDetailsDataQueries[3],
 			endPointDetailsDataQueries[4],
 			endPointDetailsDataQueries[5],
-			endPointDetailsDataQueries[6],
-			endPointDetailsDataQueries[7],
 		],
 		[endPointDetailsDataQueries],
 	);
 
+	const { endpoint, port } = useMemo(
+		() => extractPortAndEndpoint(endPointName),
+		[endPointName],
+	);
+
+	const [rateOverTimeWidget, latencyOverTimeWidget] = useMemo(
+		() => [
+			getRateOverTimeWidgetData(domainName, endPointName, {
+				items: [...domainListFilters.items, ...filters.items],
+				op: filters.op,
+			}),
+			getLatencyOverTimeWidgetData(domainName, endPointName, {
+				items: [...domainListFilters.items, ...filters.items],
+				op: filters.op,
+			}),
+		],
+		[domainName, endPointName, filters, domainListFilters],
+	);
+
 	return (
 		<div className="endpoint-details-container">
 			<div className="endpoint-details-filters-container">
@@ -129,6 +149,8 @@ function EndPointDetails({
 						selectedEndPointName={endPointName}
 						setSelectedEndPointName={setSelectedEndPointName}
 						endPointDropDownDataQuery={endPointDropDownDataQuery}
+						parentContainerDiv=".endpoint-details-filters-container"
+						dropdownStyle={{ width: 'calc(100% - 36px)' }}
 					/>
 				</div>
 				<div className="endpoint-details-filters-container-search">
@@ -141,6 +163,16 @@ function EndPointDetails({
 					/>
 				</div>
 			</div>
+			<div className="endpoint-meta-data">
+				<div className="endpoint-meta-data-pill">
+					<div className="endpoint-meta-data-label">Endpoint</div>
+					<div className="endpoint-meta-data-value">{endpoint || '-'}</div>
+				</div>
+				<div className="endpoint-meta-data-pill">
+					<div className="endpoint-meta-data-label">Port</div>
+					<div className="endpoint-meta-data-value">{port || '-'}</div>
+				</div>
+			</div>
 			<EndPointMetrics endPointMetricsDataQuery={endPointMetricsDataQuery} />
 			{!isServicesFilterApplied && (
 				<DependentServices
@@ -152,18 +184,14 @@ function EndPointDetails({
 				endPointStatusCodeLatencyBarChartsDataQuery={
 					endPointStatusCodeLatencyBarChartsDataQuery
 				}
+				domainName={domainName}
+				endPointName={endPointName}
+				domainListFilters={domainListFilters}
+				filters={filters}
 			/>
 			<StatusCodeTable endPointStatusCodeDataQuery={endPointStatusCodeDataQuery} />
-			<MetricOverTimeGraph
-				metricOverTimeDataQuery={endPointRateOverTimeDataQuery}
-				widgetInfoIndex={0}
-				endPointName={endPointName}
-			/>
-			<MetricOverTimeGraph
-				metricOverTimeDataQuery={endPointLatencyOverTimeDataQuery}
-				widgetInfoIndex={1}
-				endPointName={endPointName}
-			/>
+			<MetricOverTimeGraph widget={rateOverTimeWidget} />
+			<MetricOverTimeGraph widget={latencyOverTimeWidget} />
 		</div>
 	);
 }

frontend/src/container/ApiMonitoring/Explorer/Domains/DomainDetails/EndPointDetailsWrapper.tsx

@@ -8,6 +8,7 @@ import { useSelector } from 'react-redux';
 import { AppState } from 'store/reducers';
 import { SuccessResponse } from 'types/api';
 import { MetricRangePayloadProps } from 'types/api/metrics/getQueryRange';
+import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
 import EndPointDetailsZeroState from './components/EndPointDetailsZeroState';
@@ -17,10 +18,12 @@ function EndPointDetailsWrapper({
 	domainName,
 	endPointName,
 	setSelectedEndPointName,
+	domainListFilters,
 }: {
 	domainName: string;
 	endPointName: string;
 	setSelectedEndPointName: (value: string) => void;
+	domainListFilters: IBuilderQuery['filters'];
 }): JSX.Element {
 	const { maxTime, minTime } = useSelector<AppState, GlobalReducer>(
 		(state) => state.globalTime,
@@ -69,6 +72,7 @@ function EndPointDetailsWrapper({
 			domainName={domainName}
 			endPointName={endPointName}
 			setSelectedEndPointName={setSelectedEndPointName}
+			domainListFilters={domainListFilters}
 		/>
 	);
 }

frontend/src/container/ApiMonitoring/Explorer/Domains/DomainDetails/components/EndPointDetailsZeroState.tsx

@@ -28,6 +28,8 @@ function EndPointDetailsZeroState({
 					<EndPointsDropDown
 						setSelectedEndPointName={setSelectedEndPointName}
 						endPointDropDownDataQuery={endPointDropDownDataQuery}
+						parentContainerDiv=".end-point-details-zero-state-wrapper"
+						dropdownStyle={{ width: '60%' }}
 					/>
 				</div>
 			</div>

frontend/src/container/ApiMonitoring/Explorer/Domains/DomainDetails/components/EndPointMetrics.tsx

@@ -70,7 +70,7 @@ function EndPointMetrics({
 							<Skeleton.Button active size="small" />
 						) : (
 							<Tooltip title={metricsData?.rate}>
-								<span className="round-metric-tag">{metricsData?.rate}/sec</span>
+								<span className="round-metric-tag">{metricsData?.rate} ops/sec</span>
 							</Tooltip>
 						)}
 					</Typography.Text>

frontend/src/container/ApiMonitoring/Explorer/Domains/DomainDetails/components/EndPointsDropDown.tsx

@@ -8,16 +8,22 @@ interface EndPointsDropDownProps {
 	selectedEndPointName?: string;
 	setSelectedEndPointName: (value: string) => void;
 	endPointDropDownDataQuery: UseQueryResult<SuccessResponse<any>, unknown>;
+	parentContainerDiv?: string;
+	dropdownStyle?: React.CSSProperties;
 }
 
 const defaultProps = {
 	selectedEndPointName: '',
+	parentContainerDiv: '',
+	dropdownStyle: {},
 };
 
 function EndPointsDropDown({
 	selectedEndPointName,
 	setSelectedEndPointName,
 	endPointDropDownDataQuery,
+	parentContainerDiv,
+	dropdownStyle,
 }: EndPointsDropDownProps): JSX.Element {
 	const { data, isLoading, isFetching } = endPointDropDownDataQuery;
 
@@ -39,6 +45,13 @@ function EndPointsDropDown({
 			style={{ width: '100%' }}
 			onChange={handleChange}
 			options={formattedData}
+			getPopupContainer={
+				parentContainerDiv
+					? (): HTMLElement =>
+							document.querySelector(parentContainerDiv) as HTMLElement
+					: (triggerNode): HTMLElement => triggerNode.parentNode as HTMLElement
+			}
+			dropdownStyle={dropdownStyle}
 		/>
 	);
 }

frontend/src/container/ApiMonitoring/Explorer/Domains/DomainDetails/components/ExpandedRow.tsx

@@ -1,6 +1,7 @@
 import { LoadingOutlined } from '@ant-design/icons';
 import { Spin, Table } from 'antd';
 import { ColumnType } from 'antd/lib/table';
+import logEvent from 'api/common/logEvent';
 import { ENTITY_VERSION_V4 } from 'constants/app';
 import { REACT_QUERY_KEY } from 'constants/reactQueryKeys';
 import {
@@ -114,6 +115,7 @@ function ExpandedRow({
 							onClick: (): void => {
 								setSelectedEndPointName(record.endpointName);
 								setSelectedView(VIEW_TYPES.ENDPOINT_DETAILS);
+								logEvent('API Monitoring: Endpoint name row clicked', {});
 							},
 							className: 'expanded-clickable-row',
 						})}

frontend/src/container/ApiMonitoring/Explorer/Domains/DomainDetails/components/MetricOverTimeGraph.tsx

@@ -1,110 +1,18 @@
-import { Card, Skeleton, Typography } from 'antd';
-import cx from 'classnames';
-import Uplot from 'components/Uplot';
-import { PANEL_TYPES } from 'constants/queryBuilder';
-import {
-	apiWidgetInfo,
-	extractPortAndEndpoint,
-	getFormattedChartData,
-} from 'container/ApiMonitoring/utils';
-import { useIsDarkMode } from 'hooks/useDarkMode';
-import { useResizeObserver } from 'hooks/useDimensions';
-import { getUPlotChartOptions } from 'lib/uPlotLib/getUplotChartOptions';
-import { getUPlotChartData } from 'lib/uPlotLib/utils/getUplotChartData';
-import { useCallback, useMemo, useRef } from 'react';
-import { UseQueryResult } from 'react-query';
-import { useSelector } from 'react-redux';
-import { AppState } from 'store/reducers';
-import { SuccessResponse } from 'types/api';
-import { GlobalReducer } from 'types/reducer/globalTime';
-import { Options } from 'uplot';
-
-import ErrorState from './ErrorState';
-
-function MetricOverTimeGraph({
-	metricOverTimeDataQuery,
-	widgetInfoIndex,
-	endPointName,
-}: {
-	metricOverTimeDataQuery: UseQueryResult<SuccessResponse<any>, unknown>;
-	widgetInfoIndex: number;
-	endPointName: string;
-}): JSX.Element {
-	const { data } = metricOverTimeDataQuery;
-
-	const { minTime, maxTime } = useSelector<AppState, GlobalReducer>(
-		(state) => state.globalTime,
-	);
-
-	const graphRef = useRef<HTMLDivElement>(null);
-	const dimensions = useResizeObserver(graphRef);
-
-	const { endpoint } = extractPortAndEndpoint(endPointName);
-
-	const formattedChartData = useMemo(
-		() => getFormattedChartData(data?.payload, [endpoint]),
-		[data?.payload, endpoint],
-	);
-
-	const chartData = useMemo(() => getUPlotChartData(formattedChartData), [
-		formattedChartData,
-	]);
-
-	const isDarkMode = useIsDarkMode();
-
-	const options = useMemo(
-		() =>
-			getUPlotChartOptions({
-				apiResponse: formattedChartData,
-				isDarkMode,
-				dimensions,
-				yAxisUnit: apiWidgetInfo[widgetInfoIndex].yAxisUnit,
-				softMax: null,
-				softMin: null,
-				minTimeScale: Math.floor(minTime / 1e9),
-				maxTimeScale: Math.floor(maxTime / 1e9),
-				panelType: PANEL_TYPES.TIME_SERIES,
-			}),
-		[
-			formattedChartData,
-			minTime,
-			maxTime,
-			widgetInfoIndex,
-			dimensions,
-			isDarkMode,
-		],
-	);
-
-	const renderCardContent = useCallback(
-		(query: UseQueryResult<SuccessResponse<any>, unknown>): JSX.Element => {
-			if (query.isLoading) {
-				return <Skeleton />;
-			}
-
-			if (query.error) {
-				return <ErrorState refetch={query.refetch} />;
-			}
-
-			return (
-				<div
-					className={cx('chart-container', {
-						'no-data-container':
-							!query.isLoading && !query?.data?.payload?.data?.result?.length,
-					})}
-				>
-					<Uplot options={options as Options} data={chartData} />
-				</div>
-			);
-		},
-		[options, chartData],
-	);
+import { Card } from 'antd';
+import GridCard from 'container/GridCardLayout/GridCard';
+import { Widgets } from 'types/api/dashboard/getAll';
 
+function MetricOverTimeGraph({ widget }: { widget: Widgets }): JSX.Element {
 	return (
 		<div>
 			<Card bordered className="endpoint-details-card">
-				<Typography.Text>{apiWidgetInfo[widgetInfoIndex].title}</Typography.Text>
-				<div className="graph-container" ref={graphRef}>
-					{renderCardContent(metricOverTimeDataQuery)}
+				<div className="graph-container">
+					<GridCard
+						widget={widget}
+						isQueryEnabled
+						onDragSelect={(): void => {}}
+						customOnDragSelect={(): void => {}}
+					/>
 				</div>
 			</Card>
 		</div>

frontend/src/container/ApiMonitoring/Explorer/Domains/DomainDetails/components/StatusCodeBarCharts.tsx

@@ -1,13 +1,22 @@
+import { Color } from '@signozhq/design-tokens';
 import { Button, Card, Skeleton, Typography } from 'antd';
 import cx from 'classnames';
+import { useGetGraphCustomSeries } from 'components/CeleryTask/useGetGraphCustomSeries';
+import { useNavigateToExplorer } from 'components/CeleryTask/useNavigateToExplorer';
 import Uplot from 'components/Uplot';
 import { PANEL_TYPES } from 'constants/queryBuilder';
 import {
+	getCustomFiltersForBarChart,
 	getFormattedEndPointStatusCodeChartData,
+	getStatusCodeBarChartWidgetData,
 	statusCodeWidgetInfo,
 } from 'container/ApiMonitoring/utils';
+import { handleGraphClick } from 'container/GridCardLayout/GridCard/utils';
+import { useGraphClickToShowButton } from 'container/GridCardLayout/useGraphClickToShowButton';
+import useNavigateToExplorerPages from 'container/GridCardLayout/useNavigateToExplorerPages';
 import { useIsDarkMode } from 'hooks/useDarkMode';
 import { useResizeObserver } from 'hooks/useDimensions';
+import { useNotifications } from 'hooks/useNotifications';
 import { getUPlotChartOptions } from 'lib/uPlotLib/getUplotChartOptions';
 import { getUPlotChartData } from 'lib/uPlotLib/utils/getUplotChartData';
 import { useCallback, useMemo, useRef, useState } from 'react';
@@ -15,6 +24,8 @@ import { UseQueryResult } from 'react-query';
 import { useSelector } from 'react-redux';
 import { AppState } from 'store/reducers';
 import { SuccessResponse } from 'types/api';
+import { Widgets } from 'types/api/dashboard/getAll';
+import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 import { GlobalReducer } from 'types/reducer/globalTime';
 import { Options } from 'uplot';
 
@@ -23,6 +34,10 @@ import ErrorState from './ErrorState';
 function StatusCodeBarCharts({
 	endPointStatusCodeBarChartsDataQuery,
 	endPointStatusCodeLatencyBarChartsDataQuery,
+	domainName,
+	endPointName,
+	domainListFilters,
+	filters,
 }: {
 	endPointStatusCodeBarChartsDataQuery: UseQueryResult<
 		SuccessResponse<any>,
@@ -32,6 +47,10 @@ function StatusCodeBarCharts({
 		SuccessResponse<any>,
 		unknown
 	>;
+	domainName: string;
+	endPointName: string;
+	domainListFilters: IBuilderQuery['filters'];
+	filters: IBuilderQuery['filters'];
 }): JSX.Element {
 	// 0 : Status Code Count
 	// 1 : Status Code Latency
@@ -85,6 +104,72 @@ function StatusCodeBarCharts({
 
 	const isDarkMode = useIsDarkMode();
 
+	const graphClick = useGraphClickToShowButton({
+		graphRef,
+		isButtonEnabled: true,
+		buttonClassName: 'view-onclick-show-button',
+	});
+
+	const navigateToExplorer = useNavigateToExplorer();
+
+	const navigateToExplorerPages = useNavigateToExplorerPages();
+	const { notifications } = useNotifications();
+
+	const { getCustomSeries } = useGetGraphCustomSeries({
+		isDarkMode,
+		drawStyle: 'bars',
+		colorMapping: {
+			'200-299': Color.BG_FOREST_500,
+			'300-399': Color.BG_AMBER_400,
+			'400-499': Color.BG_CHERRY_500,
+			'500-599': Color.BG_ROBIN_500,
+			Other: Color.BG_SIENNA_500,
+		},
+	});
+
+	const widget = useMemo<Widgets>(
+		() =>
+			getStatusCodeBarChartWidgetData(domainName, endPointName, {
+				items: [...domainListFilters.items, ...filters.items],
+				op: filters.op,
+			}),
+		[domainName, endPointName, domainListFilters, filters],
+	);
+
+	const graphClickHandler = useCallback(
+		(
+			xValue: number,
+			yValue: number,
+			mouseX: number,
+			mouseY: number,
+			metric?: { [key: string]: string },
+			queryData?: { queryName: string; inFocusOrNot: boolean },
+		): void => {
+			const customFilters = getCustomFiltersForBarChart(metric);
+			handleGraphClick({
+				xValue,
+				yValue,
+				mouseX,
+				mouseY,
+				metric,
+				queryData,
+				widget,
+				navigateToExplorerPages,
+				navigateToExplorer,
+				notifications,
+				graphClick,
+				customFilters,
+			});
+		},
+		[
+			widget,
+			navigateToExplorerPages,
+			navigateToExplorer,
+			notifications,
+			graphClick,
+		],
+	);
+
 	const options = useMemo(
 		() =>
 			getUPlotChartOptions({
@@ -100,6 +185,8 @@ function StatusCodeBarCharts({
 				minTimeScale: Math.floor(minTime / 1e9),
 				maxTimeScale: Math.floor(maxTime / 1e9),
 				panelType: PANEL_TYPES.BAR,
+				onClickHandler: graphClickHandler,
+				customSeries: getCustomSeries,
 			}),
 		[
 			minTime,
@@ -109,6 +196,8 @@ function StatusCodeBarCharts({
 			formattedEndPointStatusCodeBarChartsDataPayload,
 			formattedEndPointStatusCodeLatencyBarChartsDataPayload,
 			isDarkMode,
+			graphClickHandler,
+			getCustomSeries,
 		],
 	);
 

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

@@ -3,6 +3,7 @@ import '../Explorer.styles.scss';
 import { LoadingOutlined } from '@ant-design/icons';
 import { Spin, Table, Typography } from 'antd';
 import axios from 'api';
+import logEvent from 'api/common/logEvent';
 import { ErrorResponseHandler } from 'api/ErrorResponseHandler';
 import { AxiosError } from 'axios';
 import cx from 'classnames';
@@ -130,6 +131,7 @@ function DomainList({
 								(item) => item.key === record.key,
 							);
 							setSelectedDomainIndex(dataIndex);
+							logEvent('API Monitoring: Domain name row clicked', {});
 						}
 					},
 					className: 'expanded-clickable-row',
@@ -147,6 +149,7 @@ function DomainList({
 					handleClose={(): void => {
 						setSelectedDomainIndex(-1);
 					}}
+					domainListFilters={query?.filters}
 				/>
 			)}
 		</section>

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

@@ -3,13 +3,14 @@ import './Explorer.styles.scss';
 import { FilterOutlined } from '@ant-design/icons';
 import * as Sentry from '@sentry/react';
 import { Switch, Typography } from 'antd';
+import logEvent from 'api/common/logEvent';
 import cx from 'classnames';
 import QuickFilters from 'components/QuickFilters/QuickFilters';
 import { QuickFiltersSource } from 'components/QuickFilters/types';
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
 import { useQueryOperations } from 'hooks/queryBuilder/useQueryBuilderOperations';
 import ErrorBoundaryFallback from 'pages/ErrorBoundaryFallback/ErrorBoundaryFallback';
-import { useMemo, useState } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';
 import { DataSource } from 'types/common/queryBuilder';
 
@@ -21,6 +22,10 @@ function Explorer(): JSX.Element {
 
 	const { currentQuery } = useQueryBuilder();
 
+	useEffect(() => {
+		logEvent('API Monitoring: Landing page visited', {});
+	}, []);
+
 	const { handleChangeQueryData } = useQueryOperations({
 		index: 0,
 		query: currentQuery.builder.queryData[0],
@@ -64,7 +69,12 @@ function Explorer(): JSX.Element {
 							style={{ marginLeft: 'auto' }}
 							checked={showIP}
 							onClick={(): void => {
-								setShowIP((showIP) => !showIP);
+								setShowIP((showIP): boolean => {
+									logEvent('API Monitoring: Show IP addresses clicked', {
+										showIP: !showIP,
+									});
+									return !showIP;
+								});
 							}}
 						/>
 					</div>

frontend/src/container/ApiMonitoring/utils.tsx

@@ -8,16 +8,23 @@ import {
 } from 'components/QuickFilters/types';
 import { PANEL_TYPES } from 'constants/queryBuilder';
 import { REACT_QUERY_KEY } from 'constants/reactQueryKeys';
+import { GraphClickMetaData } from 'container/GridCardLayout/useNavigateToExplorerPages';
+import { getWidgetQueryBuilder } from 'container/MetricsApplication/MetricsApplication.factory';
 import dayjs from 'dayjs';
 import { GetQueryResultsProps } from 'lib/dashboard/getQueryResults';
 import { cloneDeep } from 'lodash-es';
 import { ArrowUpDown, ChevronDown, ChevronRight } from 'lucide-react';
+import { getWidgetQuery } from 'pages/MessagingQueues/MQDetails/MetricPage/MetricPageUtil';
+import { Widgets } from 'types/api/dashboard/getAll';
 import { MetricRangePayloadProps } from 'types/api/metrics/getQueryRange';
 import {
 	BaseAutocompleteData,
 	DataTypes,
 } from 'types/api/queryBuilder/queryAutocompleteResponse';
-import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
+import {
+	IBuilderQuery,
+	TagFilterItem,
+} from 'types/api/queryBuilder/queryBuilderData';
 import { QueryData } from 'types/api/widgets/getQuery';
 import { EQueryType } from 'types/common/dashboard';
 import { DataSource } from 'types/common/queryBuilder';
@@ -128,12 +135,15 @@ export const columnsConfig: ColumnType<APIDomainsRowData>[] = [
 		sorter: false,
 		align: 'right',
 		className: `column`,
-		render: (lastUsed: number): string => getLastUsedRelativeTime(lastUsed),
+		render: (lastUsed: number | string): string =>
+			lastUsed === 'n/a' || lastUsed === '-'
+				? '-'
+				: getLastUsedRelativeTime(lastUsed as number),
 	},
 	{
 		title: (
 			<div>
-				Rate <span className="round-metric-tag">/s</span>
+				Rate <span className="round-metric-tag">ops/s</span>
 			</div>
 		),
 		dataIndex: 'rate',
@@ -155,21 +165,26 @@ export const columnsConfig: ColumnType<APIDomainsRowData>[] = [
 		sorter: false,
 		align: 'right',
 		className: `column`,
-		render: (errorRate: number): React.ReactNode => (
-			<Progress
-				status="active"
-				percent={Number((errorRate * 100).toFixed(1))}
-				strokeLinecap="butt"
-				size="small"
-				strokeColor={((): string => {
-					const errorRatePercent = Number((errorRate * 100).toFixed(1));
-					if (errorRatePercent >= 90) return Color.BG_SAKURA_500;
-					if (errorRatePercent >= 60) return Color.BG_AMBER_500;
-					return Color.BG_FOREST_500;
-				})()}
-				className="progress-bar error-rate"
-			/>
-		),
+		render: (errorRate: number | string): React.ReactNode => {
+			if (errorRate === 'n/a' || errorRate === '-') {
+				return '-';
+			}
+			return (
+				<Progress
+					status="active"
+					percent={Number(((errorRate as number) * 100).toFixed(1))}
+					strokeLinecap="butt"
+					size="small"
+					strokeColor={((): string => {
+						const errorRatePercent = Number(((errorRate as number) * 100).toFixed(1));
+						if (errorRatePercent >= 90) return Color.BG_SAKURA_500;
+						if (errorRatePercent >= 60) return Color.BG_AMBER_500;
+						return Color.BG_FOREST_500;
+					})()}
+					className="progress-bar error-rate"
+				/>
+			);
+		},
 	},
 	{
 		title: (
@@ -217,9 +232,9 @@ interface APIMonitoringResponseRow {
 	data: {
 		endpoints: number;
 		error_rate: number;
-		lastseen: number;
+		lastseen: number | string;
 		[domainNameKey]: string;
-		p99: number;
+		p99: number | string;
 		rps: number;
 	};
 }
@@ -232,12 +247,12 @@ interface EndPointsResponseRow {
 
 export interface APIDomainsRowData {
 	key: string;
-	domainName: React.ReactNode;
-	endpointCount: React.ReactNode;
-	rate: React.ReactNode;
-	errorRate: React.ReactNode;
-	latency: React.ReactNode;
-	lastUsed: React.ReactNode;
+	domainName: string;
+	endpointCount: number | string;
+	rate: number | string;
+	errorRate: number | string;
+	latency: number | string;
+	lastUsed: string;
 }
 
 // Rename this to a proper name
@@ -246,12 +261,20 @@ export const formatDataForTable = (
 ): APIDomainsRowData[] =>
 	data?.map((domain) => ({
 		key: v4(),
-		domainName: domain.data[domainNameKey] || '',
-		endpointCount: domain.data.endpoints,
-		rate: domain.data.rps,
-		errorRate: domain.data.error_rate,
-		latency: Math.round(domain.data.p99 / 1000000), // Convert from nanoseconds to milliseconds
-		lastUsed: new Date(Math.floor(domain.data.lastseen / 1000000)).toISOString(), // Convert from nanoseconds to milliseconds
+		domainName: domain?.data[domainNameKey] || '-',
+		endpointCount: domain?.data?.endpoints || '-',
+		rate: domain.data.rps || '-',
+		errorRate: domain.data.error_rate || '-',
+		latency:
+			domain.data.p99 === 'n/a'
+				? '-'
+				: Math.round(Number(domain.data.p99) / 1000000), // Convert from nanoseconds to milliseconds
+		lastUsed:
+			domain.data.lastseen === 'n/a'
+				? '-'
+				: new Date(
+						Math.floor(Number(domain.data.lastseen) / 1000000),
+				  ).toISOString(), // Convert from nanoseconds to milliseconds
 	}));
 
 // Rename this to a proper name
@@ -468,7 +491,6 @@ export const extractPortAndEndpoint = (
 	}
 };
 
-// Add icons in the below column headers
 export const getEndPointsColumnsConfig = (
 	isGroupedByAttribute: boolean,
 	expandedRowKeys: React.Key[],
@@ -576,7 +598,7 @@ export const formatEndPointsDataForTable = (
 			);
 			return {
 				key: v4(),
-				endpointName: (endpoint.data['http.url'] as string) || '',
+				endpointName: (endpoint.data['http.url'] as string) || '-',
 				port,
 				callCount: endpoint.data.A || '-',
 				latency:
@@ -593,7 +615,6 @@ export const formatEndPointsDataForTable = (
 
 	const groupedByAttributeData = groupBy.map((attribute) => attribute.key);
 
-	// TODO: Use tags to show the concatenated attribute values
 	return data?.map((endpoint) => {
 		const newEndpointName = groupedByAttributeData
 			.map((attribute) => endpoint.data[attribute])
@@ -639,7 +660,7 @@ export const createFiltersForSelectedRowData = (
 				type: null,
 			},
 			op: '=',
-			value: groupedByMeta[key],
+			value: groupedByMeta[key] || '',
 			id: key,
 		})),
 	);
@@ -649,12 +670,10 @@ export const createFiltersForSelectedRowData = (
 
 // First query payload for endpoint metrics
 // Second query payload for endpoint status code
-// Third query payload for endpoint rate over time graph
-// Fourth query payload for endpoint latency over time graph
-// Fifth query payload for endpoint dropdown selection
-// Sixth query payload for endpoint dependant services
-// Seventh query payload for endpoint response status count bar chart
-// Eighth query payload for endpoint response status code latency bar chart
+// Third query payload for endpoint dropdown selection
+// Fourth query payload for endpoint dependant services
+// Fifth query payload for endpoint response status count bar chart
+// Sixth query payload for endpoint response status code latency bar chart
 export const getEndPointDetailsQueryPayload = (
 	domainName: string,
 	endPointName: string,
@@ -1101,205 +1120,6 @@ export const getEndPointDetailsQueryPayload = (
 		end,
 		step: 60,
 	},
-	{
-		selectedTime: 'GLOBAL_TIME',
-		graphType: PANEL_TYPES.TIME_SERIES,
-		query: {
-			builder: {
-				queryData: [
-					{
-						aggregateAttribute: {
-							dataType: DataTypes.String,
-							id: '------false',
-							isColumn: false,
-							key: '',
-							type: '',
-						},
-						aggregateOperator: 'rate',
-						dataSource: DataSource.TRACES,
-						disabled: false,
-						expression: 'B',
-						filters: {
-							items: [
-								{
-									id: '3c76fe0b',
-									key: {
-										dataType: DataTypes.String,
-										id: 'net.peer.name--string--tag--false',
-										isColumn: false,
-										isJSON: false,
-										key: 'net.peer.name',
-										type: 'tag',
-									},
-									op: '=',
-									value: domainName,
-								},
-								{
-									id: '30710f04',
-									key: {
-										dataType: DataTypes.String,
-										id: 'http.url--string--tag--false',
-										isColumn: false,
-										isJSON: false,
-										key: 'http.url',
-										type: 'tag',
-									},
-									op: '=',
-									value: endPointName,
-								},
-								...filters.items,
-							],
-							op: 'AND',
-						},
-						functions: [],
-						groupBy: [
-							{
-								dataType: DataTypes.String,
-								id: 'http.url--string--tag--false',
-								isColumn: false,
-								isJSON: false,
-								key: 'http.url',
-								type: 'tag',
-							},
-						],
-						having: [],
-						legend: '',
-						limit: null,
-						orderBy: [],
-						queryName: 'B',
-						reduceTo: 'avg',
-						spaceAggregation: 'sum',
-						stepInterval: 60,
-						timeAggregation: 'rate',
-					},
-				],
-				queryFormulas: [],
-			},
-			clickhouse_sql: [
-				{
-					disabled: false,
-					legend: '',
-					name: 'A',
-					query: '',
-				},
-			],
-			id: '315b15fa-ff0c-442f-89f8-2bf4fb1af2f2',
-			promql: [
-				{
-					disabled: false,
-					legend: '',
-					name: 'A',
-					query: '',
-				},
-			],
-			queryType: EQueryType.QUERY_BUILDER,
-		},
-		variables: {},
-		formatForWeb: false,
-		start,
-		end,
-		step: 60,
-	},
-	{
-		selectedTime: 'GLOBAL_TIME',
-		graphType: PANEL_TYPES.TIME_SERIES,
-		query: {
-			builder: {
-				queryData: [
-					{
-						aggregateAttribute: {
-							dataType: DataTypes.Float64,
-							id: 'duration_nano--float64----true',
-							isColumn: true,
-							isJSON: false,
-							key: 'duration_nano',
-							type: '',
-						},
-						aggregateOperator: 'p99',
-						dataSource: DataSource.TRACES,
-						disabled: false,
-						expression: 'B',
-						filters: {
-							items: [
-								{
-									id: '63adb3ff',
-									key: {
-										dataType: DataTypes.String,
-										id: 'net.peer.name--string--tag--false',
-										isColumn: false,
-										isJSON: false,
-										key: 'net.peer.name',
-										type: 'tag',
-									},
-									op: '=',
-									value: domainName,
-								},
-								{
-									id: '50142500',
-									key: {
-										dataType: DataTypes.String,
-										id: 'http.url--string--tag--false',
-										isColumn: false,
-										isJSON: false,
-										key: 'http.url',
-										type: 'tag',
-									},
-									op: '=',
-									value: endPointName,
-								},
-								...filters.items,
-							],
-							op: 'AND',
-						},
-						functions: [],
-						groupBy: [
-							{
-								dataType: DataTypes.String,
-								id: 'http.url--string--tag--false',
-								isColumn: false,
-								isJSON: false,
-								key: 'http.url',
-								type: 'tag',
-							},
-						],
-						having: [],
-						legend: '',
-						limit: null,
-						orderBy: [],
-						queryName: 'B',
-						reduceTo: 'avg',
-						spaceAggregation: 'sum',
-						stepInterval: 60,
-						timeAggregation: 'p99',
-					},
-				],
-				queryFormulas: [],
-			},
-			clickhouse_sql: [
-				{
-					disabled: false,
-					legend: '',
-					name: 'A',
-					query: '',
-				},
-			],
-			id: '315b15fa-ff0c-442f-89f8-2bf4fb1af2f2',
-			promql: [
-				{
-					disabled: false,
-					legend: '',
-					name: 'A',
-					query: '',
-				},
-			],
-			queryType: EQueryType.QUERY_BUILDER,
-		},
-		variables: {},
-		formatForWeb: false,
-		start,
-		end,
-		step: 60,
-	},
 	{
 		selectedTime: 'GLOBAL_TIME',
 		graphType: PANEL_TYPES.TABLE,
@@ -1801,7 +1621,7 @@ interface EndPointMetricsData {
 interface EndPointStatusCodeData {
 	key: string;
 	statusCode: string;
-	count: number;
+	count: number | string;
 	p99Latency: number | string;
 }
 
@@ -1824,8 +1644,8 @@ export const getFormattedEndPointStatusCodeData = (
 ): EndPointStatusCodeData[] =>
 	data?.map((row) => ({
 		key: v4(),
-		statusCode: row.data.response_status_code,
-		count: row.data.A,
+		statusCode: row.data.response_status_code || '-',
+		count: row.data.A || '-',
 		p99Latency:
 			row.data.B === 'n/a' ? '-' : Math.round(Number(row.data.B) / 1000000), // Convert from nanoseconds to milliseconds,
 	}));
@@ -1857,11 +1677,6 @@ export const endPointStatusCodeColumns: ColumnType<EndPointStatusCodeData>[] = [
 	},
 ];
 
-export const apiWidgetInfo = [
-	{ title: 'Rate over time', yAxisUnit: 'ops/s' },
-	{ title: 'Latency over time', yAxisUnit: 'ns' },
-];
-
 export const statusCodeWidgetInfo = [
 	{ yAxisUnit: 'calls' },
 	{ yAxisUnit: 'ns' },
@@ -1885,8 +1700,8 @@ export const getFormattedEndPointDropDownData = (
 ): EndPointDropDownData[] =>
 	data?.map((row) => ({
 		key: v4(),
-		label: row.data['http.url'],
-		value: row.data['http.url'],
+		label: row.data['http.url'] || '-',
+		value: row.data['http.url'] || '-',
 	}));
 
 interface DependentServicesResponseRow {
@@ -1903,6 +1718,7 @@ interface DependentServicesData {
 	percentage: number;
 }
 
+// Discuss once about type safety of this function
 export const getFormattedDependentServicesData = (
 	data: DependentServicesResponseRow[],
 ): DependentServicesData[] => {
@@ -1983,7 +1799,7 @@ export const groupStatusCodes = (
 
 		// Track all timestamps
 		series.values.forEach((value) => {
-			allTimestamps.add(value[0]);
+			allTimestamps.add(Number(value[0]));
 		});
 
 		// Initialize or update the grouped series
@@ -2049,8 +1865,114 @@ export const groupStatusCodes = (
 		});
 	});
 
-	return Object.values(groupedSeries);
+	// Define the order of status code ranges
+	const statusCodeOrder = ['200-299', '300-399', '400-499', '500-599', 'Other'];
+
+	// Return the grouped series in the specified order
+	return statusCodeOrder
+		.filter((code) => groupedSeries[code]) // Only include codes that exist in the data
+		.map((code) => groupedSeries[code]);
 };
+
+export const getStatusCodeBarChartWidgetData = (
+	domainName: string,
+	endPointName: string,
+	filters: IBuilderQuery['filters'],
+): Widgets => ({
+	query: {
+		builder: {
+			queryData: [
+				{
+					aggregateAttribute: {
+						dataType: DataTypes.String,
+						id: '------false',
+						isColumn: false,
+						key: '',
+						type: '',
+					},
+					aggregateOperator: 'count',
+					dataSource: DataSource.TRACES,
+					disabled: false,
+					expression: 'A',
+					filters: {
+						items: [
+							{
+								id: 'c6724407',
+								key: {
+									dataType: DataTypes.String,
+									id: 'net.peer.name--string--tag--false',
+									isColumn: false,
+									isJSON: false,
+									key: 'net.peer.name',
+									type: 'tag',
+								},
+								op: '=',
+								value: domainName,
+							},
+							{
+								id: '8b1be6f0',
+								key: {
+									dataType: DataTypes.String,
+									id: 'http.url--string--tag--false',
+									isColumn: false,
+									isJSON: false,
+									key: 'http.url',
+									type: 'tag',
+								},
+								op: '=',
+								value: endPointName,
+							},
+							...filters.items,
+						],
+						op: 'AND',
+					},
+					functions: [],
+					groupBy: [],
+					having: [],
+					legend: '',
+					limit: null,
+					orderBy: [],
+					queryName: 'A',
+					reduceTo: 'avg',
+					spaceAggregation: 'sum',
+					stepInterval: 60,
+					timeAggregation: 'rate',
+				},
+			],
+			queryFormulas: [],
+		},
+		clickhouse_sql: [
+			{
+				disabled: false,
+				legend: '',
+				name: 'A',
+				query: '',
+			},
+		],
+		id: '315b15fa-ff0c-442f-89f8-2bf4fb1af2f2',
+		promql: [
+			{
+				disabled: false,
+				legend: '',
+				name: 'A',
+				query: '',
+			},
+		],
+		queryType: EQueryType.QUERY_BUILDER,
+	},
+	description: '',
+	id: '315b15fa-ff0c-442f-89f8-2bf4fb1af2f2',
+	isStacked: false,
+	panelTypes: PANEL_TYPES.BAR,
+	title: '',
+	opacity: '',
+	nullZeroValues: '',
+	timePreferance: 'GLOBAL_TIME',
+	softMin: null,
+	softMax: null,
+	selectedLogFields: null,
+	selectedTracesFields: null,
+});
 interface EndPointStatusCodePayloadData {
 	data: {
 		result: QueryData[];
@@ -2085,3 +2007,277 @@ export const END_POINT_DETAILS_QUERY_KEYS_ARRAY = [
 	REACT_QUERY_KEY.GET_ENDPOINT_STATUS_CODE_BAR_CHARTS_DATA,
 	REACT_QUERY_KEY.GET_ENDPOINT_STATUS_CODE_LATENCY_BAR_CHARTS_DATA,
 ];
+
+export const getRateOverTimeWidgetData = (
+	domainName: string,
+	endPointName: string,
+	filters: IBuilderQuery['filters'],
+): Widgets => {
+	const { endpoint, port } = extractPortAndEndpoint(endPointName);
+	const legend = `${
+		port !== '-' && port !== 'n/a' ? `${port}:` : ''
+	}${endpoint}`;
+	return getWidgetQueryBuilder(
+		getWidgetQuery({
+			title: 'Rate Over Time',
+			description: 'Rate over time.',
+			queryData: [
+				{
+					aggregateAttribute: {
+						dataType: DataTypes.String,
+						id: '------false',
+						isColumn: false,
+						key: '',
+						type: '',
+					},
+					aggregateOperator: 'rate',
+					dataSource: DataSource.TRACES,
+					disabled: false,
+					expression: 'A',
+					filters: {
+						items: [
+							{
+								id: '3c76fe0b',
+								key: {
+									dataType: DataTypes.String,
+									id: 'net.peer.name--string--tag--false',
+									isColumn: false,
+									isJSON: false,
+									key: 'net.peer.name',
+									type: 'tag',
+								},
+								op: '=',
+								value: domainName,
+							},
+							{
+								id: '30710f04',
+								key: {
+									dataType: DataTypes.String,
+									id: 'http.url--string--tag--false',
+									isColumn: false,
+									isJSON: false,
+									key: 'http.url',
+									type: 'tag',
+								},
+								op: '=',
+								value: endPointName,
+							},
+							...filters.items,
+						],
+						op: 'AND',
+					},
+					functions: [],
+					groupBy: [
+						{
+							dataType: DataTypes.String,
+							id: 'http.url--string--tag--false',
+							isColumn: false,
+							isJSON: false,
+							key: 'http.url',
+							type: 'tag',
+						},
+					],
+					having: [],
+					legend,
+					limit: null,
+					orderBy: [],
+					queryName: 'A',
+					reduceTo: 'avg',
+					spaceAggregation: 'sum',
+					stepInterval: 60,
+					timeAggregation: 'rate',
+				},
+			],
+			yAxisUnit: 'ops/s',
+		}),
+	);
+};
+
+export const getLatencyOverTimeWidgetData = (
+	domainName: string,
+	endPointName: string,
+	filters: IBuilderQuery['filters'],
+): Widgets => {
+	const { endpoint, port } = extractPortAndEndpoint(endPointName);
+	const legend = `${port}:${endpoint}`;
+	return getWidgetQueryBuilder(
+		getWidgetQuery({
+			title: 'Latency Over Time',
+			description: 'Latency over time.',
+			queryData: [
+				{
+					aggregateAttribute: {
+						dataType: DataTypes.Float64,
+						id: 'duration_nano--float64----true',
+						isColumn: true,
+						isJSON: false,
+						key: 'duration_nano',
+						type: '',
+					},
+					aggregateOperator: 'p99',
+					dataSource: DataSource.TRACES,
+					disabled: false,
+					expression: 'A',
+					filters: {
+						items: [
+							{
+								id: '63adb3ff',
+								key: {
+									dataType: DataTypes.String,
+									id: 'net.peer.name--string--tag--false',
+									isColumn: false,
+									isJSON: false,
+									key: 'net.peer.name',
+									type: 'tag',
+								},
+								op: '=',
+								value: domainName,
+							},
+							{
+								id: '50142500',
+								key: {
+									dataType: DataTypes.String,
+									id: 'http.url--string--tag--false',
+									isColumn: false,
+									isJSON: false,
+									key: 'http.url',
+									type: 'tag',
+								},
+								op: '=',
+								value: endPointName,
+							},
+							...filters.items,
+						],
+						op: 'AND',
+					},
+					functions: [],
+					groupBy: [
+						{
+							dataType: DataTypes.String,
+							id: 'http.url--string--tag--false',
+							isColumn: false,
+							isJSON: false,
+							key: 'http.url',
+							type: 'tag',
+						},
+					],
+					having: [],
+					legend,
+					limit: null,
+					orderBy: [],
+					queryName: 'A',
+					reduceTo: 'avg',
+					spaceAggregation: 'sum',
+					stepInterval: 60,
+					timeAggregation: 'p99',
+				},
+			],
+			yAxisUnit: 'ns',
+		}),
+	);
+};
+
+/**
+ * Helper function to get the start and end status codes from a status code range string
+ * @param value Status code range string (e.g. '200-299') or boolean
+ * @returns Tuple of [startStatusCode, endStatusCode] as strings
+ */
+const getStartAndEndStatusCode = (
+	value: string | boolean,
+): [string, string] => {
+	if (!value) {
+		return ['', ''];
+	}
+
+	switch (value) {
+		case '100-199':
+			return ['100', '199'];
+		case '200-299':
+			return ['200', '299'];
+		case '300-399':
+			return ['300', '399'];
+		case '400-499':
+			return ['400', '499'];
+		case '500-599':
+			return ['500', '599'];
+		default:
+			return ['', ''];
+	}
+};
+
+/**
+ * Creates filter items for bar chart based on group by fields and request data
+ * Used specifically for filtering status code ranges in bar charts
+ * @param groupBy Array of group by fields to create filters for
+ * @param requestData Data from graph click containing values to filter on
+ * @returns Array of TagFilterItems with >= and < operators for status code ranges
+ */
+export const createGroupByFiltersForBarChart = (
+	groupBy: BaseAutocompleteData[],
+	requestData: GraphClickMetaData,
+): TagFilterItem[] =>
+	groupBy
+		.map((gb) => {
+			const value = requestData[gb.key];
+			const [startStatusCode, endStatusCode] = getStartAndEndStatusCode(value);
+			return value
+				? [
+						{
+							id: v4(),
+							key: gb,
+							op: '>=',
+							value: startStatusCode,
+						},
+						{
+							id: v4(),
+							key: gb,
+							op: '<=',
+							value: endStatusCode,
+						},
+				  ]
+				: [];
+		})
+		.flat();
+
+export const getCustomFiltersForBarChart = (
+	metric:
+		| {
+				[key: string]: string;
+		  }
+		| undefined,
+): TagFilterItem[] => {
+	if (!metric?.response_status_code) {
+		return [];
+	}
+	const [startStatusCode, endStatusCode] = getStartAndEndStatusCode(
+		metric.response_status_code,
+	);
+	return [
+		{
+			id: v4(),
+			key: {
+				dataType: DataTypes.String,
+				id: 'response_status_code--string--tag--false',
+				isColumn: false,
+				isJSON: false,
+				key: 'response_status_code',
+				type: 'tag',
+			},
+			op: '>=',
+			value: startStatusCode,
+		},
+		{
+			id: v4(),
+			key: {
+				dataType: DataTypes.String,
+				id: 'response_status_code--string--tag--false',
+				isColumn: false,
+				isJSON: false,
+				key: 'response_status_code',
+				type: 'tag',
+			},
+			op: '<=',
+			value: endStatusCode,
+		},
+	];
+};

frontend/src/container/CustomDomainSettings/CustomDomainSettings.tsx

@@ -61,7 +61,7 @@ export default function CustomDomainSettings(): JSX.Element {
 		isLoading: isLoadingDeploymentsData,
 		isFetching: isFetchingDeploymentsData,
 		refetch: refetchDeploymentsData,
-	} = useGetDeploymentsData();
+	} = useGetDeploymentsData(true);
 
 	const {
 		mutate: updateSubDomain,

frontend/src/container/FormAlertChannels/Settings/MsTeams.tsx

@@ -1,4 +1,5 @@
 import { Form, Input } from 'antd';
+import { MarkdownRenderer } from 'components/MarkdownRenderer/MarkdownRenderer';
 import React from 'react';
 import { useTranslation } from 'react-i18next';
 
@@ -9,7 +10,20 @@ function MsTeams({ setSelectedConfig }: MsTeamsProps): JSX.Element {
 
 	return (
 		<>
-			<Form.Item name="webhook_url" label={t('field_webhook_url')}>
+			<Form.Item
+				name="webhook_url"
+				label={t('field_webhook_url')}
+				tooltip={{
+					title: (
+						<MarkdownRenderer
+							markdownContent={t('tooltip_ms_teams_url')}
+							variables={{}}
+						/>
+					),
+					overlayInnerStyle: { maxWidth: 400 },
+					placement: 'right',
+				}}
+			>
 				<Input
 					onChange={(event): void => {
 						setSelectedConfig((value) => ({

frontend/src/container/FormAlertChannels/Settings/Opsgenie.tsx

@@ -1,4 +1,5 @@
 import { Form, Input } from 'antd';
+import { MarkdownRenderer } from 'components/MarkdownRenderer/MarkdownRenderer';
 import { useTranslation } from 'react-i18next';
 
 import { OpsgenieChannel } from '../../CreateAlertChannels/config';
@@ -19,7 +20,21 @@ function OpsgenieForm({ setSelectedConfig }: OpsgenieFormProps): JSX.Element {
 
 	return (
 		<>
-			<Form.Item name="api_key" label={t('field_opsgenie_api_key')} required>
+			<Form.Item
+				name="api_key"
+				label={t('field_opsgenie_api_key')}
+				tooltip={{
+					title: (
+						<MarkdownRenderer
+							markdownContent={t('tooltip_opsgenie_api_key')}
+							variables={{}}
+						/>
+					),
+					overlayInnerStyle: { maxWidth: 400 },
+					placement: 'right',
+				}}
+				required
+			>
 				<Input
 					onChange={handleInputChange('api_key')}
 					data-testid="opsgenie-api-key-textbox"

frontend/src/container/FormAlertChannels/Settings/Pager.tsx

@@ -1,4 +1,5 @@
 import { Form, Input } from 'antd';
+import { MarkdownRenderer } from 'components/MarkdownRenderer/MarkdownRenderer';
 import { Dispatch, SetStateAction } from 'react';
 import { useTranslation } from 'react-i18next';
 
@@ -10,7 +11,20 @@ function PagerForm({ setSelectedConfig }: PagerFormProps): JSX.Element {
 	const { t } = useTranslation('channels');
 	return (
 		<>
-			<Form.Item name="routing_key" label={t('field_pager_routing_key')} required>
+			<Form.Item
+				name="routing_key"
+				label={t('field_pager_routing_key')}
+				tooltip={{
+					title: (
+						<MarkdownRenderer
+							markdownContent={t('tooltip_pager_routing_key')}
+							variables={{}}
+						/>
+					),
+					overlayInnerStyle: { maxWidth: 400 },
+					placement: 'right',
+				}}
+			>
 				<Input
 					onChange={(event): void => {
 						setSelectedConfig((value) => ({

frontend/src/container/FormAlertChannels/Settings/Slack.tsx

@@ -1,4 +1,5 @@
 import { Form, Input } from 'antd';
+import { MarkdownRenderer } from 'components/MarkdownRenderer/MarkdownRenderer';
 import { Dispatch, SetStateAction } from 'react';
 import { useTranslation } from 'react-i18next';
 
@@ -11,7 +12,20 @@ function Slack({ setSelectedConfig }: SlackProps): JSX.Element {
 
 	return (
 		<>
-			<Form.Item name="api_url" label={t('field_webhook_url')}>
+			<Form.Item
+				name="api_url"
+				label={t('field_webhook_url')}
+				tooltip={{
+					title: (
+						<MarkdownRenderer
+							markdownContent={t('tooltip_slack_url')}
+							variables={{}}
+						/>
+					),
+					overlayInnerStyle: { maxWidth: 400 },
+					placement: 'right',
+				}}
+			>
 				<Input
 					onChange={(event): void => {
 						setSelectedConfig((value) => ({

frontend/src/container/FormAlertChannels/Settings/Webhook.tsx

@@ -1,4 +1,5 @@
 import { Form, Input } from 'antd';
+import { MarkdownRenderer } from 'components/MarkdownRenderer/MarkdownRenderer';
 import { Dispatch, SetStateAction } from 'react';
 import { useTranslation } from 'react-i18next';
 
@@ -9,7 +10,20 @@ function WebhookSettings({ setSelectedConfig }: WebhookProps): JSX.Element {
 
 	return (
 		<>
-			<Form.Item name="api_url" label={t('field_webhook_url')}>
+			<Form.Item
+				name="api_url"
+				label={t('field_webhook_url')}
+				tooltip={{
+					title: (
+						<MarkdownRenderer
+							markdownContent={t('tooltip_webhook_url')}
+							variables={{}}
+						/>
+					),
+					overlayInnerStyle: { maxWidth: 400 },
+					placement: 'right',
+				}}
+			>
 				<Input
 					onChange={(event): void => {
 						setSelectedConfig((value) => ({

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

@@ -49,6 +49,7 @@ function FullView({
 	isDependedDataLoaded = false,
 	onToggleModelHandler,
 	onClickHandler,
+	customOnDragSelect,
 	setCurrentGraphRef,
 }: FullViewProps): JSX.Element {
 	const { safeNavigate } = useSafeNavigate();
@@ -252,7 +253,7 @@ function FullView({
 						onToggleModelHandler={onToggleModelHandler}
 						setGraphVisibility={setGraphsVisibilityStates}
 						graphVisibility={graphsVisibilityStates}
-						onDragSelect={onDragSelect}
+						onDragSelect={customOnDragSelect ?? onDragSelect}
 						tableProcessedDataRef={tableProcessedDataRef}
 						searchTerm={searchTerm}
 						onClickHandler={onClickHandler}

frontend/src/container/GridCardLayout/GridCard/FullView/types.ts

@@ -50,6 +50,7 @@ export interface FullViewProps {
 	widget: Widgets;
 	fullViewOptions?: boolean;
 	onClickHandler?: OnClickPluginOpts['onClick'];
+	customOnDragSelect?: (start: number, end: number) => void;
 	name: string;
 	tableProcessedDataRef: MutableRefObject<RowData[]>;
 	version?: string;

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

@@ -50,6 +50,7 @@ function WidgetGraphComponent({
 	setRequestData,
 	onClickHandler,
 	onDragSelect,
+	customOnDragSelect,
 	customTooltipElement,
 	openTracesButton,
 	onOpenTraceBtnClick,
@@ -327,6 +328,7 @@ function WidgetGraphComponent({
 					onToggleModelHandler={onToggleModelHandler}
 					tableProcessedDataRef={tableProcessedDataRef}
 					onClickHandler={onClickHandler ?? graphClickHandler}
+					customOnDragSelect={customOnDragSelect}
 					setCurrentGraphRef={setCurrentGraphRef}
 				/>
 			</Modal>

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

@@ -36,6 +36,7 @@ function GridCardGraph({
 	version,
 	onClickHandler,
 	onDragSelect,
+	customOnDragSelect,
 	customTooltipElement,
 	dataAvailable,
 	getGraphData,
@@ -272,6 +273,7 @@ function GridCardGraph({
 					setRequestData={setRequestData}
 					onClickHandler={onClickHandler}
 					onDragSelect={onDragSelect}
+					customOnDragSelect={customOnDragSelect}
 					customTooltipElement={customTooltipElement}
 					openTracesButton={openTracesButton}
 					onOpenTraceBtnClick={onOpenTraceBtnClick}

frontend/src/container/GridCardLayout/GridCard/types.ts

@@ -33,6 +33,7 @@ export interface WidgetGraphComponentProps {
 	setRequestData?: Dispatch<SetStateAction<GetQueryResultsProps>>;
 	onClickHandler?: OnClickPluginOpts['onClick'];
 	onDragSelect: (start: number, end: number) => void;
+	customOnDragSelect?: (start: number, end: number) => void;
 	customTooltipElement?: HTMLDivElement;
 	openTracesButton?: boolean;
 	onOpenTraceBtnClick?: (record: RowData) => void;
@@ -49,6 +50,7 @@ export interface GridCardGraphProps {
 	variables?: Dashboard['data']['variables'];
 	version?: string;
 	onDragSelect: (start: number, end: number) => void;
+	customOnDragSelect?: (start: number, end: number) => void;
 	customTooltipElement?: HTMLDivElement;
 	dataAvailable?: (isDataAvailable: boolean) => void;
 	getGraphData?: (graphData?: MetricRangePayloadProps['data']) => void;

frontend/src/container/GridCardLayout/GridCard/utils.ts

@@ -178,6 +178,7 @@ interface HandleGraphClickParams {
 	navigateToExplorer: (props: NavigateToExplorerProps) => void;
 	notifications: NotificationInstance;
 	graphClick: (props: GraphClickProps) => void;
+	customFilters?: TagFilterItem[];
 }
 
 export const handleGraphClick = async ({
@@ -192,6 +193,7 @@ export const handleGraphClick = async ({
 	navigateToExplorer,
 	notifications,
 	graphClick,
+	customFilters,
 }: HandleGraphClickParams): Promise<void> => {
 	const { stepInterval } = widget?.query?.builder?.queryData?.[0] ?? {};
 
@@ -221,7 +223,7 @@ export const handleGraphClick = async ({
 					  }: ${key}`,
 			onClick: (): void =>
 				navigateToExplorer({
-					filters: result[key].filters,
+					filters: [...result[key].filters, ...(customFilters || [])],
 					dataSource: result[key].dataSource as DataSource,
 					startTime: xValue,
 					endTime: xValue + (stepInterval ?? 60),

frontend/src/container/GridCardLayout/GridCardLayout.tsx

@@ -44,7 +44,10 @@ import { EditMenuAction, ViewMenuAction } from './config';
 import DashboardEmptyState from './DashboardEmptyState/DashboardEmptyState';
 import GridCard from './GridCard';
 import { Card, CardContainer, ReactGridLayout } from './styles';
-import { removeUndefinedValuesFromLayout } from './utils';
+import {
+	hasColumnWidthsChanged,
+	removeUndefinedValuesFromLayout,
+} from './utils';
 import { MenuItemKeys } from './WidgetHeader/contants';
 import { WidgetRowHeader } from './WidgetRow';
 
@@ -68,6 +71,7 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 		setDashboardQueryRangeCalled,
 		setSelectedRowWidgetId,
 		isDashboardFetching,
+		columnWidths,
 	} = useDashboard();
 	const { data } = selectedDashboard || {};
 	const { pathname } = useLocation();
@@ -162,6 +166,7 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 			logEventCalledRef.current = true;
 		}
 	}, [data]);
+
 	const onSaveHandler = (): void => {
 		if (!selectedDashboard) return;
 
@@ -171,6 +176,15 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 				...selectedDashboard.data,
 				panelMap: { ...currentPanelMap },
 				layout: dashboardLayout.filter((e) => e.i !== PANEL_TYPES.EMPTY_WIDGET),
+				widgets: selectedDashboard?.data?.widgets?.map((widget) => {
+					if (columnWidths?.[widget.id]) {
+						return {
+							...widget,
+							columnWidths: columnWidths[widget.id],
+						};
+					}
+					return widget;
+				}),
 			},
 			uuid: selectedDashboard.uuid,
 		};
@@ -227,20 +241,31 @@ function GraphLayout(props: GraphLayoutProps): JSX.Element {
 
 	useEffect(() => {
 		if (
+			isDashboardLocked ||
+			!saveLayoutPermission ||
+			updateDashboardMutation.isLoading ||
+			isDashboardFetching
+		) {
+			return;
+		}
+
+		const shouldSaveLayout =
 			dashboardLayout &&
 			Array.isArray(dashboardLayout) &&
 			dashboardLayout.length > 0 &&
-			!isEqual(layouts, dashboardLayout) &&
-			!isDashboardLocked &&
-			saveLayoutPermission &&
-			!updateDashboardMutation.isLoading &&
-			!isDashboardFetching
-		) {
+			!isEqual(layouts, dashboardLayout);
+
+		const shouldSaveColumnWidths =
+			dashboardLayout &&
+			Array.isArray(dashboardLayout) &&
+			dashboardLayout.length > 0 &&
+			hasColumnWidthsChanged(columnWidths, selectedDashboard);
+
+		if (shouldSaveLayout || shouldSaveColumnWidths) {
 			onSaveHandler();
 		}
-
 		// eslint-disable-next-line react-hooks/exhaustive-deps
-	}, [dashboardLayout]);
+	}, [dashboardLayout, columnWidths]);
 
 	const onSettingsModalSubmit = (): void => {
 		const newTitle = form.getFieldValue('title');

frontend/src/container/GridCardLayout/useNavigateToExplorerPages.ts

@@ -12,7 +12,7 @@ import { v4 } from 'uuid';
 
 import { extractQueryNamesFromExpression } from './utils';
 
-type GraphClickMetaData = {
+export type GraphClickMetaData = {
 	[key: string]: string | boolean;
 	queryName: string;
 	inFocusOrNot: boolean;

frontend/src/container/GridCardLayout/utils.ts

@@ -1,5 +1,7 @@
 import { FORMULA_REGEXP } from 'constants/regExp';
+import { isEmpty, isEqual } from 'lodash-es';
 import { Layout } from 'react-grid-layout';
+import { Dashboard, Widgets } from 'types/api/dashboard/getAll';
 
 export const removeUndefinedValuesFromLayout = (layout: Layout[]): Layout[] =>
 	layout.map((obj) =>
@@ -25,3 +27,27 @@ export function extractQueryNamesFromExpression(expression: string): string[] {
 	// Extract matches and deduplicate
 	return [...new Set(expression.match(queryNameRegex) || [])];
 }
+
+export const hasColumnWidthsChanged = (
+	columnWidths: Record<string, Record<string, number>>,
+	selectedDashboard?: Dashboard,
+): boolean => {
+	// If no column widths stored, no changes
+	if (isEmpty(columnWidths) || !selectedDashboard) return false;
+
+	// Check each widget's column widths
+	return Object.keys(columnWidths).some((widgetId) => {
+		const dashboardWidget = selectedDashboard?.data?.widgets?.find(
+			(widget) => widget.id === widgetId,
+		) as Widgets;
+
+		const newWidths = columnWidths[widgetId];
+		const existingWidths = dashboardWidget?.columnWidths;
+
+		// If both are empty/undefined, no change
+		if (isEmpty(newWidths) || isEmpty(existingWidths)) return false;
+
+		// Compare stored column widths with dashboard widget's column widths
+		return !isEqual(newWidths, existingWidths);
+	});
+};

frontend/src/container/GridTableComponent/index.tsx

@@ -43,6 +43,7 @@ function GridTableComponent({
 	sticky,
 	openTracesButton,
 	onOpenTraceBtnClick,
+	widgetId,
 	...props
 }: GridTableComponentProps): JSX.Element {
 	const { t } = useTranslation(['valueGraph']);
@@ -229,6 +230,7 @@ function GridTableComponent({
 				columns={openTracesButton ? columnDataWithOpenTracesButton : newColumnData}
 				dataSource={dataSource}
 				sticky={sticky}
+				widgetId={widgetId}
 				onRow={
 					openTracesButton
 						? (record): React.HTMLAttributes<HTMLElement> => ({

frontend/src/container/GridTableComponent/types.ts

@@ -17,6 +17,7 @@ export type GridTableComponentProps = {
 	searchTerm?: string;
 	openTracesButton?: boolean;
 	onOpenTraceBtnClick?: (record: RowData) => void;
+	widgetId?: string;
 } & Pick<LogsExplorerTableProps, 'data'> &
 	Omit<TableProps<RowData>, 'columns' | 'dataSource'>;
 

frontend/src/container/Home/DataSourceInfo/DataSourceInfo.tsx

@@ -23,10 +23,13 @@ function DataSourceInfo({
 
 	const notSendingData = !dataSentToSigNoz;
 
+	const isEnabled =
+		activeLicenseV3 && activeLicenseV3.platform === LicensePlatform.CLOUD;
+
 	const {
 		data: deploymentsData,
 		isError: isErrorDeploymentsData,
-	} = useGetDeploymentsData();
+	} = useGetDeploymentsData(isEnabled || false);
 
 	const [region, setRegion] = useState<string>('');
 	const [url, setUrl] = useState<string>('');

frontend/src/container/IngestionSettings/MultiIngestionSettings.tsx

@@ -293,7 +293,7 @@ function MultiIngestionSettings(): JSX.Element {
 		isLoading: isLoadingDeploymentsData,
 		isFetching: isFetchingDeploymentsData,
 		isError: isErrorDeploymentsData,
-	} = useGetDeploymentsData();
+	} = useGetDeploymentsData(true);
 
 	const {
 		mutate: createIngestionKey,

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

@@ -10,7 +10,6 @@ import { useGetCompositeQueryParam } from 'hooks/queryBuilder/useGetCompositeQue
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
 import useDebouncedFn from 'hooks/useDebouncedFunction';
 import { useEventSourceEvent } from 'hooks/useEventSourceEvent';
-import { useNotifications } from 'hooks/useNotifications';
 import { prepareQueryRangePayload } from 'lib/dashboard/prepareQueryRangePayload';
 import { useEventSource } from 'providers/EventSource';
 import { useCallback, useEffect, useRef, useState } from 'react';
@@ -38,8 +37,6 @@ function LiveLogsContainer(): JSX.Element {
 
 	const batchedEventsRef = useRef<ILog[]>([]);
 
-	const { notifications } = useNotifications();
-
 	const { selectedTime: globalSelectedTime } = useSelector<
 		AppState,
 		GlobalReducer
@@ -50,6 +47,8 @@ function LiveLogsContainer(): JSX.Element {
 		handleCloseConnection,
 		initialLoading,
 		isConnectionLoading,
+		isConnectionError,
+		reconnectDueToError,
 	} = useEventSource();
 
 	const compositeQuery = useGetCompositeQueryParam();
@@ -86,8 +85,8 @@ function LiveLogsContainer(): JSX.Element {
 	);
 
 	const handleError = useCallback(() => {
-		notifications.error({ message: 'Sorry, something went wrong' });
-	}, [notifications]);
+		console.error('Sorry, something went wrong');
+	}, []);
 
 	useEventSourceEvent('message', handleGetLiveLogs);
 	useEventSourceEvent('error', handleError);
@@ -153,6 +152,23 @@ function LiveLogsContainer(): JSX.Element {
 		handleStartNewConnection,
 	]);
 
+	useEffect((): (() => void) | undefined => {
+		if (isConnectionError && reconnectDueToError && compositeQuery) {
+			// Small delay to prevent immediate reconnection attempts
+			const reconnectTimer = setTimeout(() => {
+				handleStartNewConnection(compositeQuery);
+			}, 1000);
+
+			return (): void => clearTimeout(reconnectTimer);
+		}
+		return undefined;
+	}, [
+		isConnectionError,
+		reconnectDueToError,
+		compositeQuery,
+		handleStartNewConnection,
+	]);
+
 	useEffect(() => {
 		const prefetchedList = queryLocationState?.listQueryPayload[0]?.list;
 

frontend/src/container/LogsPanelTable/LogsPanelComponent.tsx

@@ -1,9 +1,9 @@
 import './LogsPanelComponent.styles.scss';
 
-import { Table } from 'antd';
 import LogDetail from 'components/LogDetail';
 import { VIEW_TYPES } from 'components/LogDetail/constants';
 import OverlayScrollbar from 'components/OverlayScrollbar/OverlayScrollbar';
+import { ResizeTable } from 'components/ResizeTable';
 import { SOMETHING_WENT_WRONG } from 'constants/api';
 import { PANEL_TYPES } from 'constants/queryBuilder';
 import Controls from 'container/Controls';
@@ -79,9 +79,14 @@ function LogsPanelComponent({
 
 	const { formatTimezoneAdjustedTimestamp } = useTimezone();
 
-	const columns = getLogPanelColumnsList(
-		widget.selectedLogFields,
-		formatTimezoneAdjustedTimestamp,
+	const columns = useMemo(
+		() =>
+			getLogPanelColumnsList(
+				widget.selectedLogFields,
+				formatTimezoneAdjustedTimestamp,
+			),
+		// eslint-disable-next-line react-hooks/exhaustive-deps
+		[widget.selectedLogFields],
 	);
 
 	const dataLength =
@@ -216,16 +221,18 @@ function LogsPanelComponent({
 			<div className="logs-table">
 				<div className="resize-table">
 					<OverlayScrollbar>
-						<Table
+						<ResizeTable
 							pagination={false}
 							tableLayout="fixed"
-							scroll={{ x: `calc(50vw - 10px)` }}
+							scroll={{ x: `max-content` }}
 							sticky
 							loading={queryResponse.isFetching}
 							style={tableStyles}
 							dataSource={flattenLogData}
 							columns={columns}
 							onRow={handleRow}
+							widgetId={widget.id}
+							shouldPersistColumnWidths
 						/>
 					</OverlayScrollbar>
 				</div>

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

@@ -0,0 +1,16 @@
+.inspect-metrics-modal {
+	.inspect-metrics-title {
+		display: flex;
+		align-items: center;
+		justify-content: flex-start;
+		gap: 6px;
+
+		.inspect-metrics-button {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			cursor: default;
+			color: var(--text-vanilla-500);
+		}
+	}
+}

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

@@ -0,0 +1,48 @@
+import './Inspect.styles.scss';
+
+import * as Sentry from '@sentry/react';
+import { Color } from '@signozhq/design-tokens';
+import { Button, Drawer, Typography } from 'antd';
+import { useIsDarkMode } from 'hooks/useDarkMode';
+import { Compass } from 'lucide-react';
+import ErrorBoundaryFallback from 'pages/ErrorBoundaryFallback/ErrorBoundaryFallback';
+
+import { InspectProps } from './types';
+
+function Inspect({ metricName, isOpen, onClose }: InspectProps): JSX.Element {
+	const isDarkMode = useIsDarkMode();
+
+	return (
+		<Sentry.ErrorBoundary fallback={<ErrorBoundaryFallback />}>
+			<Drawer
+				width="100%"
+				title={
+					<div className="inspect-metrics-title">
+						<Typography.Text>Metrics Explorer —</Typography.Text>
+						<Button
+							className="inspect-metrics-button"
+							size="small"
+							icon={<Compass size={14} />}
+							disabled
+						>
+							Inspect Metric
+						</Button>
+					</div>
+				}
+				open={isOpen}
+				onClose={onClose}
+				style={{
+					overscrollBehavior: 'contain',
+					background: isDarkMode ? Color.BG_INK_400 : Color.BG_VANILLA_100,
+				}}
+				className="inspect-metrics-modal"
+				destroyOnClose
+			>
+				<div>Inspect</div>
+				<div>{metricName}</div>
+			</Drawer>
+		</Sentry.ErrorBoundary>
+	);
+}
+
+export default Inspect;

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

@@ -0,0 +1 @@
+export const INSPECT_FEATURE_FLAG_KEY = 'metrics-explorer-inspect-feature-flag';

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

@@ -0,0 +1,3 @@
+import Inspect from './Inspect';
+
+export default Inspect;

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

@@ -0,0 +1,5 @@
+export type InspectProps = {
+	metricName: string | null;
+	isOpen: boolean;
+	onClose: () => void;
+};

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

@@ -0,0 +1,11 @@
+import { INSPECT_FEATURE_FLAG_KEY } from './constants';
+
+/**
+ * Check if the inspect feature flag is enabled
+ * returns true if the feature flag is enabled, false otherwise
+ * Show the inspect button in  metrics explorer if the feature flag is enabled
+ */
+export function isInspectEnabled(): boolean {
+	const featureFlag = localStorage.getItem(INSPECT_FEATURE_FLAG_KEY);
+	return featureFlag === 'true';
+}

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

@@ -20,6 +20,12 @@
 			gap: 4px;
 			background-color: var(--bg-slate-300);
 		}
+
+		.inspect-metrics-button {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+		}
 	}
 
 	.metric-details-content {

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

@@ -2,12 +2,21 @@ import './MetricDetails.styles.scss';
 import '../Summary/Summary.styles.scss';
 
 import { Color } from '@signozhq/design-tokens';
-import { Divider, Drawer, Empty, Skeleton, Tooltip, Typography } from 'antd';
+import {
+	Button,
+	Divider,
+	Drawer,
+	Empty,
+	Skeleton,
+	Tooltip,
+	Typography,
+} from 'antd';
 import { useGetMetricDetails } from 'hooks/metricsExplorer/useGetMetricDetails';
 import { useIsDarkMode } from 'hooks/useDarkMode';
-import { X } from 'lucide-react';
+import { Compass, X } from 'lucide-react';
 import { useMemo } from 'react';
 
+import { isInspectEnabled } from '../Inspect/utils';
 import { formatNumberIntoHumanReadableFormat } from '../Summary/utils';
 import AllAttributes from './AllAttributes';
 import DashboardsAndAlertsPopover from './DashboardsAndAlertsPopover';
@@ -22,6 +31,7 @@ function MetricDetails({
 	onClose,
 	isOpen,
 	metricName,
+	openInspectModal,
 }: MetricDetailsProps): JSX.Element {
 	const isDarkMode = useIsDarkMode();
 	// const { safeNavigate } = useSafeNavigate();
@@ -43,6 +53,8 @@ function MetricDetails({
 		return formatTimestampToReadableDate(metric.lastReceived);
 	}, [metric]);
 
+	const showInspectFeature = useMemo(() => isInspectEnabled(), []);
+
 	const isMetricDetailsLoading = isLoading || isFetching;
 
 	const timeSeries = useMemo(() => {
@@ -92,6 +104,19 @@ function MetricDetails({
 					>
 						Open in Explorer
 					</Button> */}
+					{/* Show the based on the feature flag. Will remove before releasing the feature */}
+					{showInspectFeature && (
+						<Button
+							className="inspect-metrics-button"
+							aria-label="Inspect Metric"
+							icon={<Compass size={18} />}
+							onClick={(): void => {
+								if (metric?.name) {
+									openInspectModal(metric.name);
+								}
+							}}
+						/>
+					)}
 				</div>
 			}
 			placement="right"

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

@@ -10,6 +10,7 @@ export interface MetricDetailsProps {
 	isOpen: boolean;
 	metricName: string | null;
 	isModalTimeSelection: boolean;
+	openInspectModal: (metricName: string) => void;
 }
 
 export interface DashboardsAndAlertsPopoverProps {

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

@@ -13,6 +13,7 @@ import { AppState } from 'store/reducers';
 import { TagFilter } from 'types/api/queryBuilder/queryBuilderData';
 import { GlobalReducer } from 'types/reducer/globalTime';
 
+import InspectModal from '../Inspect';
 import MetricDetails from '../MetricDetails';
 import MetricsSearch from './MetricsSearch';
 import MetricsTable from './MetricsTable';
@@ -35,6 +36,7 @@ function Summary(): JSX.Element {
 		TreemapViewType.TIMESERIES,
 	);
 	const [isMetricDetailsOpen, setIsMetricDetailsOpen] = useState(false);
+	const [isInspectModalOpen, setIsInspectModalOpen] = useState(false);
 	const [selectedMetricName, setSelectedMetricName] = useState<string | null>(
 		null,
 	);
@@ -150,6 +152,17 @@ function Summary(): JSX.Element {
 		setIsMetricDetailsOpen(false);
 	};
 
+	const openInspectModal = (metricName: string): void => {
+		setSelectedMetricName(metricName);
+		setIsInspectModalOpen(true);
+		setIsMetricDetailsOpen(false);
+	};
+
+	const closeInspectModal = (): void => {
+		setIsInspectModalOpen(false);
+		setSelectedMetricName(null);
+	};
+
 	return (
 		<Sentry.ErrorBoundary fallback={<ErrorBoundaryFallback />}>
 			<div className="metrics-explorer-summary-tab">
@@ -184,6 +197,14 @@ function Summary(): JSX.Element {
 					onClose={closeMetricDetails}
 					metricName={selectedMetricName}
 					isModalTimeSelection={false}
+					openInspectModal={openInspectModal}
+				/>
+			)}
+			{isInspectModalOpen && (
+				<InspectModal
+					isOpen={isInspectModalOpen}
+					onClose={closeInspectModal}
+					metricName={selectedMetricName}
 				/>
 			)}
 		</Sentry.ErrorBoundary>

frontend/src/container/NewWidget/index.tsx

@@ -74,6 +74,7 @@ function NewWidget({ selectedGraph }: NewWidgetProps): JSX.Element {
 		setToScrollWidgetId,
 		selectedRowWidgetId,
 		setSelectedRowWidgetId,
+		columnWidths,
 	} = useDashboard();
 
 	const { t } = useTranslation(['dashboard']);
@@ -238,8 +239,10 @@ function NewWidget({ selectedGraph }: NewWidgetProps): JSX.Element {
 				selectedLogFields,
 				selectedTracesFields,
 				isLogScale,
+				columnWidths: columnWidths?.[selectedWidget?.id],
 			};
 		});
+		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [
 		columnUnits,
 		currentQuery,
@@ -260,6 +263,7 @@ function NewWidget({ selectedGraph }: NewWidgetProps): JSX.Element {
 		combineHistogram,
 		stackedBarChart,
 		isLogScale,
+		columnWidths,
 	]);
 
 	const closeModal = (): void => {

frontend/src/container/OnboardingV2Container/AddDataSource/AddDataSource.tsx

@@ -15,11 +15,12 @@ import {
 import logEvent from 'api/common/logEvent';
 import LaunchChatSupport from 'components/LaunchChatSupport/LaunchChatSupport';
 import ROUTES from 'constants/routes';
+import useDebouncedFn from 'hooks/useDebouncedFunction';
 import history from 'lib/history';
 import { isEmpty } from 'lodash-es';
-import { ArrowRight, X } from 'lucide-react';
+import { CheckIcon, Goal, UserPlus, X } from 'lucide-react';
 import { useAppContext } from 'providers/App/App';
-import React, { useEffect, useRef, useState } from 'react';
+import React, { useCallback, useEffect, useRef, useState } from 'react';
 
 import OnboardingIngestionDetails from '../IngestionDetails/IngestionDetails';
 import InviteTeamMembers from '../InviteTeamMembers/InviteTeamMembers';
@@ -68,6 +69,7 @@ interface Entity {
 		};
 	};
 	tags: string[];
+	relatedSearchKeywords?: string[];
 	link?: string;
 }
 
@@ -99,8 +101,11 @@ const ONBOARDING_V3_ANALYTICS_EVENTS_MAP = {
 	GET_EXPERT_ASSISTANCE_BUTTON_CLICKED: 'Get expert assistance clicked',
 	INVITE_TEAM_MEMBER_BUTTON_CLICKED: 'Invite team member clicked',
 	CLOSE_ONBOARDING_CLICKED: 'Close onboarding clicked',
+	DATA_SOURCE_REQUESTED: 'Datasource requested',
+	DATA_SOURCE_SEARCHED: 'Searched',
 };
 
+// eslint-disable-next-line sonarjs/cognitive-complexity
 function OnboardingAddDataSource(): JSX.Element {
 	const [groupedDataSources, setGroupedDataSources] = useState<{
 		[tag: string]: Entity[];
@@ -110,6 +115,8 @@ function OnboardingAddDataSource(): JSX.Element {
 
 	const [setupStepItems, setSetupStepItems] = useState(setupStepItemsBase);
 
+	const [searchQuery, setSearchQuery] = useState<string>('');
+
 	const question2Ref = useRef<HTMLDivElement | null>(null);
 	const question3Ref = useRef<HTMLDivElement | null>(null);
 	const configureProdRef = useRef<HTMLDivElement | null>(null);
@@ -120,8 +127,15 @@ function OnboardingAddDataSource(): JSX.Element {
 
 	const [currentStep, setCurrentStep] = useState(1);
 
+	const [dataSourceRequest, setDataSourceRequest] = useState<string>('');
+
 	const [hasMoreQuestions, setHasMoreQuestions] = useState<boolean>(true);
 
+	const [
+		showRequestDataSourceModal,
+		setShowRequestDataSourceModal,
+	] = useState<boolean>(false);
+
 	const [
 		showInviteTeamMembersModal,
 		setShowInviteTeamMembersModal,
@@ -145,6 +159,11 @@ function OnboardingAddDataSource(): JSX.Element {
 
 	const [selectedCategory, setSelectedCategory] = useState<string>('All');
 
+	const [
+		dataSourceRequestSubmitted,
+		setDataSourceRequestSubmitted,
+	] = useState<boolean>(false);
+
 	const handleScrollToStep = (ref: React.RefObject<HTMLDivElement>): void => {
 		setTimeout(() => {
 			ref.current?.scrollIntoView({
@@ -286,8 +305,10 @@ function OnboardingAddDataSource(): JSX.Element {
 		setGroupedDataSources(groupedDataSources);
 	}, []);
 
-	const handleSearch = (e: React.ChangeEvent<HTMLInputElement>): void => {
-		const query = e.target.value.toLowerCase();
+	const debouncedUpdate = useDebouncedFn((query) => {
+		setSearchQuery(query as string);
+
+		setDataSourceRequestSubmitted(false);
 
 		if (query === '') {
 			setGroupedDataSources(
@@ -298,15 +319,35 @@ function OnboardingAddDataSource(): JSX.Element {
 
 		const filteredDataSources = onboardingConfigWithLinks.filter(
 			(dataSource) =>
-				dataSource.label.toLowerCase().includes(query) ||
-				dataSource.tags.some((tag) => tag.toLowerCase().includes(query)),
+				dataSource.label.toLowerCase().includes(query as string) ||
+				dataSource.tags.some((tag) =>
+					tag.toLowerCase().includes(query as string),
+				) ||
+				dataSource.relatedSearchKeywords?.some((keyword) =>
+					keyword?.toLowerCase().includes(query as string),
+				),
 		);
 
 		setGroupedDataSources(
 			groupDataSourcesByTags(filteredDataSources as Entity[]),
 		);
-	};
 
+		logEvent(
+			`${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BASE}: ${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.DATA_SOURCE_SEARCHED}`,
+			{
+				searchedDataSource: query,
+			},
+		);
+	}, 300);
+
+	const handleSearch = useCallback(
+		(e: React.ChangeEvent<HTMLInputElement>): void => {
+			const query = e.target.value.trim().toLowerCase();
+
+			debouncedUpdate(query || '');
+		},
+		[debouncedUpdate],
+	);
 	const handleFilterByCategory = (category: string): void => {
 		setSelectedDataSource(null);
 		setSelectedFramework(null);
@@ -409,6 +450,129 @@ function OnboardingAddDataSource(): JSX.Element {
 		setShowInviteTeamMembersModal(true);
 	};
 
+	const handleSubmitDataSourceRequest = (): void => {
+		logEvent(
+			`${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BASE}: ${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.DATA_SOURCE_REQUESTED}`,
+			{
+				requestedDataSource: dataSourceRequest,
+			},
+		);
+		setShowRequestDataSourceModal(false);
+		setDataSourceRequestSubmitted(true);
+	};
+
+	const handleRequestDataSource = (): void => {
+		setShowRequestDataSourceModal(true);
+	};
+
+	const handleRaiseRequest = (): void => {
+		logEvent(
+			`${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BASE}: ${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.DATA_SOURCE_REQUESTED}`,
+			{
+				requestedDataSource: searchQuery,
+			},
+		);
+
+		setDataSourceRequestSubmitted(true);
+	};
+
+	const renderRequestDataSource = (): JSX.Element => {
+		const isSearchQueryEmpty = searchQuery.length === 0;
+		const isNoResultsFound = Object.keys(groupedDataSources).length === 0;
+
+		return (
+			<div className="request-data-source-container">
+				{!isNoResultsFound && (
+					<>
+						<Typography.Text>Can’t find what you’re looking for?</Typography.Text>
+
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							width="279"
+							height="2"
+							viewBox="0 0 279 2"
+							fill="none"
+						>
+							<path
+								d="M0 1L279 1"
+								stroke="#7190F9"
+								strokeOpacity="0.2"
+								strokeDasharray="4 4"
+							/>
+						</svg>
+
+						{!dataSourceRequestSubmitted && (
+							<Button
+								type="default"
+								className="periscope-btn request-data-source-btn secondary"
+								icon={<Goal size={16} />}
+								onClick={handleRequestDataSource}
+							>
+								Request Data Source
+							</Button>
+						)}
+
+						{dataSourceRequestSubmitted && (
+							<Button
+								type="default"
+								className="periscope-btn request-data-source-btn success"
+								icon={<CheckIcon size={16} />}
+							>
+								Request raised
+							</Button>
+						)}
+					</>
+				)}
+
+				{isNoResultsFound && !isSearchQueryEmpty && (
+					<>
+						<Typography.Text>
+							Our team can help add{' '}
+							<span className="request-data-source-search-query">{searchQuery}</span>{' '}
+							support for you
+						</Typography.Text>
+
+						<svg
+							xmlns="http://www.w3.org/2000/svg"
+							width="279"
+							height="2"
+							viewBox="0 0 279 2"
+							fill="none"
+						>
+							<path
+								d="M0 1L279 1"
+								stroke="#7190F9"
+								strokeOpacity="0.2"
+								strokeDasharray="4 4"
+							/>
+						</svg>
+
+						{!dataSourceRequestSubmitted && (
+							<Button
+								type="default"
+								className="periscope-btn request-data-source-btn secondary"
+								icon={<Goal size={16} />}
+								onClick={handleRaiseRequest}
+							>
+								Raise request
+							</Button>
+						)}
+
+						{dataSourceRequestSubmitted && (
+							<Button
+								type="default"
+								className="periscope-btn request-data-source-btn success"
+								icon={<CheckIcon size={16} />}
+							>
+								Request raised
+							</Button>
+						)}
+					</>
+				)}
+			</div>
+		);
+	};
+
 	return (
 		<div className="onboarding-v2">
 			<Layout>
@@ -433,6 +597,15 @@ function OnboardingAddDataSource(): JSX.Element {
 						</div>
 
 						<div className="header-right-section">
+							<Button
+								type="default"
+								className="periscope-btn invite-teammate-btn outlined"
+								onClick={handleShowInviteTeamMembersModal}
+								icon={<UserPlus size={16} />}
+							>
+								Invite a teammate
+							</Button>
+
 							<LaunchChatSupport
 								attributes={{
 									dataSource: selectedDataSource?.dataSource,
@@ -442,7 +615,7 @@ function OnboardingAddDataSource(): JSX.Element {
 								}}
 								eventName={`${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BASE}: ${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.GET_HELP_BUTTON_CLICKED}`}
 								message=""
-								buttonText="Get Help"
+								buttonText="Contact Support"
 								className="periscope-btn get-help-btn outlined"
 							/>
 						</div>
@@ -461,7 +634,11 @@ function OnboardingAddDataSource(): JSX.Element {
 				</Header>
 
 				<div className="onboarding-product-setup-container">
-					<div className="onboarding-product-setup-container_left-section">
+					<div
+						className={`onboarding-product-setup-container_left-section ${
+							currentStep === 1 ? 'step-id-1' : 'step-id-2'
+						}`}
+					>
 						<div className="perlian-bg" />
 
 						{currentStep === 1 && (
@@ -491,6 +668,7 @@ function OnboardingAddDataSource(): JSX.Element {
 												<div className="onboarding-data-source-search">
 													<Input
 														placeholder="Search"
+														maxLength={20}
 														onChange={handleSearch}
 														addonAfter={<SearchOutlined />}
 													/>
@@ -525,6 +703,14 @@ function OnboardingAddDataSource(): JSX.Element {
 														</div>
 													</div>
 												))}
+
+												{Object.keys(groupedDataSources).length === 0 && (
+													<div className="no-results-found-container">
+														<Typography.Text>No results for {searchQuery} :/</Typography.Text>
+													</div>
+												)}
+
+												{!selectedDataSource && renderRequestDataSource()}
 											</div>
 
 											<div className="data-source-categories-filter-container">
@@ -534,33 +720,66 @@ function OnboardingAddDataSource(): JSX.Element {
 														Filters{' '}
 													</Typography.Title>
 
-													<Typography.Title
-														level={5}
-														className={`onboarding-filters-item-title ${
-															selectedCategory === 'All' ? 'selected' : ''
-														}`}
+													<div
+														key="all"
+														className="onboarding-data-source-category-item"
 														onClick={(): void => handleFilterByCategory('All')}
+														role="button"
+														tabIndex={0}
+														onKeyDown={(e): void => {
+															if (e.key === 'Enter' || e.key === ' ') {
+																handleFilterByCategory('All');
+															}
+														}}
 													>
-														All ({onboardingConfigWithLinks.length})
-													</Typography.Title>
+														<Typography.Title
+															level={5}
+															className={`onboarding-filters-item-title ${
+																selectedCategory === 'All' ? 'selected' : ''
+															}`}
+														>
+															All
+														</Typography.Title>
+
+														<div className="line-divider" />
+
+														<Typography.Text className="onboarding-filters-item-count">
+															{onboardingConfigWithLinks.length}
+														</Typography.Text>
+													</div>
 
 													{Object.keys(groupedDataSources).map((tag) => (
-														<div key={tag} className="onboarding-data-source-category-item">
+														<div
+															key={tag}
+															className="onboarding-data-source-category-item"
+															onClick={(): void => handleFilterByCategory(tag)}
+															role="button"
+															tabIndex={0}
+															onKeyDown={(e): void => {
+																if (e.key === 'Enter' || e.key === ' ') {
+																	handleFilterByCategory(tag);
+																}
+															}}
+														>
 															<Typography.Title
 																level={5}
 																className={`onboarding-filters-item-title ${
 																	selectedCategory === tag ? 'selected' : ''
 																}`}
-																onClick={(): void => handleFilterByCategory(tag)}
 															>
-																{tag} ({groupedDataSources[tag].length})
+																{tag}
 															</Typography.Title>
+
+															<div className="line-divider" />
+
+															<Typography.Text className="onboarding-filters-item-count">
+																{groupedDataSources[tag].length}
+															</Typography.Text>
 														</div>
 													))}
 												</div>
 											</div>
 										</div>
-
 										{selectedDataSource &&
 											selectedDataSource?.question &&
 											!isEmpty(selectedDataSource?.question) && (
@@ -615,7 +834,6 @@ function OnboardingAddDataSource(): JSX.Element {
 													)}
 												</div>
 											)}
-
 										{selectedFramework &&
 											selectedFramework?.question &&
 											!isEmpty(selectedFramework?.question) && (
@@ -659,7 +877,6 @@ function OnboardingAddDataSource(): JSX.Element {
 													)}
 												</div>
 											)}
-
 										{!hasMoreQuestions && showConfigureProduct && (
 											<div className="questionaire-footer" ref={configureProdRef}>
 												<Button
@@ -767,39 +984,6 @@ function OnboardingAddDataSource(): JSX.Element {
 					</div>
 
 					<div className="onboarding-product-setup-container_right-section">
-						{currentStep === 1 && (
-							<div className="invite-user-section-content">
-								<Button
-									type="default"
-									shape="round"
-									className="invite-user-section-content-button"
-									onClick={handleShowInviteTeamMembersModal}
-								>
-									Invite a team member to help with this step
-									<ArrowRight size={14} />
-								</Button>
-								<div className="need-help-section-content-divider">Or</div>
-								<div className="need-help-section-content">
-									<Typography.Text>
-										Need help with setup? Upgrade now and get expert assistance.
-									</Typography.Text>
-
-									<LaunchChatSupport
-										attributes={{
-											dataSource: selectedDataSource?.dataSource,
-											framework: selectedFramework?.label,
-											environment: selectedEnvironment?.label,
-											currentPage: setupStepItems[currentStep]?.title || '',
-										}}
-										eventName={`${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.BASE}: ${ONBOARDING_V3_ANALYTICS_EVENTS_MAP?.GET_EXPERT_ASSISTANCE_BUTTON_CLICKED}`}
-										message=""
-										buttonText="Get Expert Assistance"
-										className="periscope-btn get-help-btn rounded-btn outlined"
-									/>
-								</div>
-							</div>
-						)}
-
 						{currentStep === 2 && <OnboardingIngestionDetails />}
 					</div>
 				</div>
@@ -824,6 +1008,46 @@ function OnboardingAddDataSource(): JSX.Element {
 						/>
 					</div>
 				</Modal>
+
+				<Modal
+					className="request-data-source-modal"
+					title={<span className="title">Request Data Source</span>}
+					open={showRequestDataSourceModal}
+					closable
+					onCancel={(): void => setShowRequestDataSourceModal(false)}
+					width="640px"
+					footer={[
+						<Button
+							type="default"
+							className="periscope-btn outlined"
+							key="back"
+							onClick={(): void => setShowRequestDataSourceModal(false)}
+							icon={<X size={16} />}
+						>
+							Cancel
+						</Button>,
+						<Button
+							key="submit"
+							type="primary"
+							className="periscope-btn primary"
+							disabled={dataSourceRequest.length <= 0}
+							onClick={handleSubmitDataSourceRequest}
+							icon={<CheckIcon size={16} />}
+						>
+							Submit request
+						</Button>,
+					]}
+					destroyOnClose
+				>
+					<div className="request-data-source-modal-content">
+						<Typography.Text>Enter your request</Typography.Text>
+						<Input
+							placeholder="Eg: Kotlin"
+							className="request-data-source-modal-input"
+							onChange={(e): void => setDataSourceRequest(e.target.value)}
+						/>
+					</div>
+				</Modal>
 			</Layout>
 		</div>
 	);

frontend/src/container/OnboardingV2Container/IngestionDetails/IngestionDetails.tsx

@@ -63,7 +63,7 @@ export default function OnboardingIngestionDetails(): JSX.Element {
 		isLoading: isLoadingDeploymentsData,
 		isFetching: isFetchingDeploymentsData,
 		isError: isDeploymentsDataError,
-	} = useGetDeploymentsData();
+	} = useGetDeploymentsData(true);
 
 	const handleCopyKey = (text: string): void => {
 		handleCopyToClipboard(text);

frontend/src/container/OnboardingV2Container/OnboardingV2.styles.scss

@@ -4,14 +4,15 @@
 
 	&__header {
 		background: rgba(11, 12, 14, 0.7);
+		border-bottom: 1px solid var(--bg-slate-500);
 		backdrop-filter: blur(20px);
-		padding: 16px 0px 0px 0px;
+		padding: 12px 0px;
 
 		&--sticky {
 			display: flex;
 			align-items: center;
 			padding: 0px 1rem;
-			// margin-top: 16px;
+			margin-top: 12px;
 
 			background: rgba(11, 12, 14, 0.7);
 			backdrop-filter: blur(20px);
@@ -323,7 +324,8 @@
 		}
 	}
 
-	.get-help-btn {
+	.get-help-btn,
+	.invite-teammate-btn {
 		font-size: 11px;
 		padding: 6px 16px;
 		border: 1px solid var(--bg-slate-400) !important;
@@ -610,15 +612,61 @@
 		display: flex;
 
 		.data-sources-container {
-			flex: 0 0 70%;
-			max-width: 70%;
+			flex: 0 0 80%;
+			max-width: 80%;
 
 			margin-right: 32px;
 		}
 
 		.data-source-categories-filter-container {
-			flex: 0 0 30%;
-			max-width: 30%;
+			flex: 0 0 20%;
+			max-width: 20%;
+
+			.onboarding-data-source-category {
+				.onboarding-data-source-category-item {
+					display: flex;
+					align-items: center;
+					justify-content: space-between;
+
+					margin-bottom: 8px;
+					cursor: pointer;
+				}
+
+				.onboarding-filters-item-title {
+					display: flex;
+					align-items: center;
+					justify-content: space-between;
+
+					margin-bottom: 0px !important;
+				}
+
+				.line-divider {
+					height: 1px;
+					margin: 0 16px;
+					flex-grow: 1;
+					border-top: 2px dotted var(--bg-slate-400);
+				}
+
+				.onboarding-filters-item-count {
+					color: var(--text-vanilla-400);
+					font-family: Inter;
+					font-size: 10px;
+					font-style: normal;
+					font-weight: 400;
+					line-height: 18px; /* 150% */
+
+					background-color: var(--bg-ink-400);
+					border-radius: 4px;
+
+					width: 24px;
+					height: 24px;
+					border-radius: 50%;
+
+					display: flex;
+					align-items: center;
+					justify-content: center;
+				}
+			}
 		}
 	}
 
@@ -643,8 +691,14 @@
 		max-width: 70%;
 
 		display: flex;
+		flex-direction: column;
 		gap: 24px;
 
+		&.step-id-1 {
+			flex: 0 0 90%;
+			max-width: 90%;
+		}
+
 		// border-right: 1px solid var(--Greyscale-Slate-400, #1d212d);
 
 		.perlian-bg {
@@ -678,7 +732,7 @@
 	&_right-section {
 		flex: 1;
 		max-width: 30%;
-		height: calc(100vh - 120px);
+		height: calc(100vh - 130px);
 
 		display: flex;
 		flex-direction: column;
@@ -972,6 +1026,52 @@
 	}
 }
 
+.no-results-found-container {
+	.ant-typography {
+		color: rgba(192, 193, 195, 0.6);
+		font-family: Inter;
+		font-size: 11px;
+		font-style: normal;
+		line-height: 18px; /* 150% */
+		letter-spacing: 0.48px;
+		text-transform: uppercase;
+	}
+}
+
+.request-data-source-container {
+	display: flex;
+	align-items: center;
+	gap: 16px;
+
+	margin: 36px 0;
+
+	display: flex;
+
+	width: fit-content;
+	gap: 24px;
+
+	padding: 12px 12px 12px 16px;
+	border-radius: 6px;
+	background: rgba(171, 189, 255, 0.06);
+
+	.request-data-source-search-query {
+		border-radius: 2px;
+		border: 1px solid rgba(173, 127, 88, 0.1);
+		background: rgba(173, 127, 88, 0.1);
+
+		color: var(--Sienna-400, #bd9979);
+		font-size: 13px;
+		padding: 2px;
+		line-height: 20px; /* 142.857% */
+	}
+
+	.request-data-source-btn {
+		border-radius: 2px;
+		border: 1px solid var(--Slate-200, #2c3140);
+		background: var(--Ink-200, #23262e);
+	}
+}
+
 .onboarding-data-source-category-container {
 	flex: 1;
 	max-width: 30%;
@@ -996,7 +1096,7 @@
 }
 
 .onboarding-configure-container {
-	height: calc(100vh - 120px);
+	height: calc(100vh - 130px);
 	width: 100%;
 	display: flex;
 	flex-direction: column;
@@ -1070,7 +1170,8 @@
 	height: 18px;
 }
 
-.invite-team-member-modal {
+.invite-team-member-modal,
+.request-data-source-modal {
 	.ant-modal-content {
 		background-color: var(--bg-ink-500);
 	}
@@ -1079,9 +1180,26 @@
 		background-color: var(--bg-ink-500);
 	}
 
-	.invite-team-member-modal-content {
+	.invite-team-member-modal-content,
+	.request-data-source-modal-content {
 		background-color: var(--bg-ink-500);
 	}
+
+	.request-data-source-modal-content {
+		padding: 12px 0;
+	}
+
+	.request-data-source-modal-input {
+		margin-top: 8px;
+	}
+}
+
+.request-data-source-modal {
+	.ant-modal-footer {
+		display: flex;
+		justify-content: flex-end;
+		align-items: center;
+	}
 }
 
 .ingestion-setup-details-links {
@@ -1262,7 +1380,8 @@
 	}
 
 	.onboarding-v2 {
-		.get-help-btn {
+		.get-help-btn,
+		.invite-teammate-btn {
 			border: 1px solid var(--bg-vanilla-300) !important;
 			color: var(--bg-ink-300) !important;
 

frontend/src/container/PanelWrapper/TablePanelWrapper.tsx

@@ -26,6 +26,7 @@ function TablePanelWrapper({
 			searchTerm={searchTerm}
 			openTracesButton={openTracesButton}
 			onOpenTraceBtnClick={onOpenTraceBtnClick}
+			widgetId={widget.id}
 			// eslint-disable-next-line react/jsx-props-no-spreading
 			{...GRID_TABLE_CONFIG}
 		/>

frontend/src/container/PanelWrapper/__tests__/__snapshots__/TablePanelWrapper.test.tsx.snap

@@ -9,6 +9,8 @@ exports[`Table panel wrappper tests table should render fine with the query resp
   width: 0.625rem;
   height: 100%;
   cursor: col-resize;
+  margin-left: 4px;
+  margin-right: 4px;
 }
 
 .c0 {
@@ -54,7 +56,7 @@ exports[`Table panel wrappper tests table should render fine with the query resp
       class="query-table"
     >
       <div
-        class="ant-table-wrapper css-dev-only-do-not-override-2i2tap"
+        class="ant-table-wrapper resize-main-table css-dev-only-do-not-override-2i2tap"
       >
         <div
           class="ant-spin-nested-loading css-dev-only-do-not-override-2i2tap"
@@ -82,7 +84,7 @@ exports[`Table panel wrappper tests table should render fine with the query resp
                       <tr>
                         <th
                           aria-label="service_name"
-                          class="ant-table-cell ant-table-column-has-sorters react-resizable"
+                          class="resizable-header react-resizable"
                           scope="col"
                           tabindex="0"
                         >
@@ -143,12 +145,12 @@ exports[`Table panel wrappper tests table should render fine with the query resp
                             </span>
                           </div>
                           <span
-                            class="c1 react-resizable-handle"
+                            class="c1 resize-handle"
                           />
                         </th>
                         <th
                           aria-label="latency-per-service"
-                          class="ant-table-cell ant-table-column-has-sorters react-resizable"
+                          class="resizable-header react-resizable"
                           scope="col"
                           tabindex="0"
                         >
@@ -209,7 +211,7 @@ exports[`Table panel wrappper tests table should render fine with the query resp
                             </span>
                           </div>
                           <span
-                            class="c1 react-resizable-handle"
+                            class="c1 resize-handle"
                           />
                         </th>
                       </tr>
@@ -221,7 +223,7 @@ exports[`Table panel wrappper tests table should render fine with the query resp
                   style="overflow-x: auto; overflow-y: hidden;"
                 >
                   <table
-                    style="width: auto; min-width: 100%; table-layout: fixed;"
+                    style="min-width: 100%; table-layout: fixed;"
                   >
                     <colgroup>
                       <col