chore: updated comment

* feat: auth revamp base setup

* feat: auth revamp signin changes

* feat: auth revamp signup changes

* feat: auth revamp reset password changes

* feat: auth revamp light mode changes

* feat: clean up and added get help link

* feat: cleanup and addressed comments

* feat: cleanup

* feat: comment addressed

* feat: auth revamp for onboarding flow (#9915)

* feat: auth revamp for onboarding flow

* feat: updated invite team member step

* feat: updated light mode

* feat: comment addressed

* feat: added onboarding flow test cases

* feat: fixed feedbacks

* feat: resolved comments and refactoring

* feat: resolved comments and refactoring

* fix: svg import fix

* feat: added test cases for the new auth flow (#9914)

* feat: added test cases for the new auth flow

* feat: updated test cases

* feat: updated test cases

* fix: updated test cases

* fix: updated test cases

* fix: use error content for auth revamp error

* feat: refactor and cleanup

* feat: refactor and cleanup

* fix: add shake animation and light mode fix

* feat: feedback resolved

* feat: feedback resolved

* feat: updated test cases

* feat: feedback resolved

* feat: shake animation update

.github/CODEOWNERS

@@ -1,10 +1,13 @@
 # CODEOWNERS info: https://help.github.com/en/articles/about-code-owners
+
 # Owners are automatically requested for review for PRs that changes code
+
 # that they own.
 
 /frontend/ @SigNoz/frontend-maintainers
 
 # Onboarding
+
 /frontend/src/container/OnboardingV2Container/onboarding-configs/onboarding-config-with-links.json @makeavish
 /frontend/src/container/OnboardingV2Container/AddDataSource/AddDataSource.tsx @makeavish
 
@@ -12,40 +15,104 @@
 .github @SigNoz/devops
 
 # Scaffold Owners
-/pkg/config/ @therealpandey
-/pkg/errors/ @therealpandey
-/pkg/factory/ @therealpandey
-/pkg/types/ @therealpandey
-/pkg/valuer/ @therealpandey
-/cmd/ @therealpandey
-.golangci.yml @therealpandey
+
+/pkg/config/ @vikrantgupta25
+/pkg/errors/ @vikrantgupta25
+/pkg/factory/ @vikrantgupta25
+/pkg/types/ @vikrantgupta25
+/pkg/valuer/ @vikrantgupta25
+/cmd/ @vikrantgupta25
+.golangci.yml @vikrantgupta25
 
 # Zeus Owners
+
 /pkg/zeus/ @vikrantgupta25
 /ee/zeus/ @vikrantgupta25
 /pkg/licensing/ @vikrantgupta25
 /ee/licensing/ @vikrantgupta25
 
 # SQL Owners
+
 /pkg/sqlmigration/ @vikrantgupta25
 /ee/sqlmigration/ @vikrantgupta25
 /pkg/sqlschema/ @vikrantgupta25
 /ee/sqlschema/ @vikrantgupta25
 
 # Analytics Owners
+
 /pkg/analytics/ @vikrantgupta25
 /pkg/statsreporter/ @vikrantgupta25
 
 # Querier Owners
+
 /pkg/querier/ @srikanthccv
 /pkg/variables/ @srikanthccv
 /pkg/types/querybuildertypes/ @srikanthccv
+/pkg/types/telemetrytypes/ @srikanthccv
 /pkg/querybuilder/ @srikanthccv
 /pkg/telemetrylogs/ @srikanthccv
 /pkg/telemetrymetadata/ @srikanthccv
 /pkg/telemetrymetrics/ @srikanthccv
 /pkg/telemetrytraces/ @srikanthccv
 
-# AuthN / AuthZ Owners 
 
-/pkg/authz/ @vikrantgupta25 @therealpandey
+# Metrics
+
+/pkg/types/metrictypes/ @srikanthccv
+/pkg/types/metricsexplorertypes/ @srikanthccv
+/pkg/modules/metricsexplorer/ @srikanthccv
+/pkg/prometheus/ @srikanthccv
+
+# APM
+
+/pkg/types/servicetypes/ @srikanthccv
+/pkg/types/apdextypes/ @srikanthccv
+/pkg/modules/apdex/ @srikanthccv
+/pkg/modules/services/ @srikanthccv
+
+# Dashboard
+
+/pkg/types/dashboardtypes/ @srikanthccv
+/pkg/modules/dashboard/ @srikanthccv
+
+# Rule/Alertmanager
+
+/pkg/types/ruletypes/ @srikanthccv
+/pkg/types/alertmanagertypes @srikanthccv
+/pkg/alertmanager/ @srikanthccv
+/pkg/ruler/ @srikanthccv
+
+# Correlation-adjacent
+
+/pkg/contextlinks/ @srikanthccv
+/pkg/types/parsertypes/ @srikanthccv
+/pkg/queryparser/ @srikanthccv
+
+# AuthN / AuthZ Owners
+
+/pkg/authz/ @vikrantgupta25
+
+# Integration tests
+
+/tests/integration/ @vikrantgupta25
+
+# Dashboard Owners
+
+/frontend/src/hooks/dashboard/ @SigNoz/pulse-frontend
+
+## Dashboard List
+
+/frontend/src/pages/DashboardsListPage/ @SigNoz/pulse-frontend
+/frontend/src/container/ListOfDashboard/ @SigNoz/pulse-frontend
+
+## Dashboard Page
+
+/frontend/src/pages/DashboardPage/ @SigNoz/pulse-frontend
+/frontend/src/container/DashboardContainer/ @SigNoz/pulse-frontend
+/frontend/src/container/GridCardLayout/ @SigNoz/pulse-frontend
+/frontend/src/container/NewWidget/ @SigNoz/pulse-frontend
+
+## Public Dashboard Page
+
+/frontend/src/pages/PublicDashboard/ @SigNoz/pulse-frontend
+/frontend/src/container/PublicDashboardContainer/ @SigNoz/pulse-frontend

.github/pull_request_template.md

@@ -1,72 +1,76 @@
-## 📄 Summary
-
-<!-- Describe the purpose of the PR in a few sentences. What does it fix/add/update? -->
+## Pull Request
 
 ---
 
-## ✅ Changes
-
-- [ ] Feature: Brief description
-- [ ] Bug fix: Brief description
+### 📄 Summary
+> Why does this change exist?  
+> What problem does it solve, and why is this the right approach?
 
 ---
 
-## 🏷️ Required: Add Relevant Labels
+### ✅ Change Type
+_Select all that apply_
 
-> ⚠️ **Manually add appropriate labels in the PR sidebar**  
-Please select one or more labels (as applicable):
-
-ex:
-
-- `frontend`
-- `backend`
-- `devops`
-- `bug`
-- `enhancement`
-- `ui`
-- `test`
+- [ ] ✨ Feature
+- [ ] 🐛 Bug fix
+- [ ] ♻️ Refactor
+- [ ] 🛠️ Infra / Tooling
+- [ ] 🧪 Test-only
 
 ---
 
-## 👥 Reviewers
+### 🐛 Bug Context
+> Required if this PR fixes a bug
 
-> Tag the relevant teams for review:
+#### Root Cause
+> What caused the issue?  
+> Regression, faulty assumption, edge case, refactor, etc.
 
-- frontend / backend / devops
+#### Fix Strategy
+> How does this PR address the root cause?
 
 ---
 
-## 🧪 How to Test
+### 🧪 Testing Strategy
+> How was this change validated?
 
-<!-- Describe how reviewers can test this PR -->
-1. ...
-2. ...
-3. ...
+- Tests added/updated:
+- Manual verification:
+- Edge cases covered:
 
 ---
 
-## 🔍 Related Issues
+### ⚠️ Risk & Impact Assessment
+> What could break? How do we recover?
 
-<!-- Reference any related issues (e.g. Fixes #123, Closes #456) -->
-Closes #
+- Blast radius:
+- Potential regressions:
+- Rollback plan:
 
 ---
 
-## 📸 Screenshots / Screen Recording (if applicable / mandatory for UI related changes)
+### 📝 Changelog
+> Fill only if this affects users, APIs, UI, or documented behavior  
+> Use **N/A** for internal or non-user-facing changes
 
-<!-- Add screenshots or GIFs to help visualize changes -->
+| Field | Value |
+|------|-------|
+| Deployment Type | Cloud / OSS / Enterprise |
+| Change Type | Feature / Bug Fix / Maintenance |
+| Description | User-facing summary |
 
 ---
 
-## 📋 Checklist
-
-- [ ] Dev Review
-- [ ] Test cases added (Unit/ Integration / E2E)
-- [ ] Manually tested the changes
-
+### 📋 Checklist
+- [ ] Tests added or explicitly not required
+- [ ] Manually tested
+- [ ] Breaking changes documented
+- [ ] Backward compatibility considered
 
 ---
 
 ## 👀 Notes for Reviewers
 
 <!-- Anything reviewers should keep in mind while reviewing -->
+
+---

.github/workflows/integrationci.yaml

@@ -21,11 +21,11 @@ jobs:
         uses: actions/setup-python@v5
         with:
           python-version: 3.13
-      - name: poetry
+      - name: uv
+        uses: astral-sh/setup-uv@v4
+      - name: install
         run: |
-          python -m pip install poetry==2.1.2
-          python -m poetry config virtualenvs.in-project true
-          cd tests/integration && poetry install --no-root
+          cd tests/integration && uv sync
       - name: fmt
         run: |
           make py-fmt
@@ -45,11 +45,13 @@ jobs:
           - querier
           - ttl
           - preference
+          - logspipelines
         sqlstore-provider:
           - postgres
           - sqlite
         clickhouse-version:
           - 25.5.6
+          - 25.10.1
         schema-migrator-version:
           - v0.129.7
         postgres-version:
@@ -65,11 +67,11 @@ jobs:
         uses: actions/setup-python@v5
         with:
           python-version: 3.13
-      - name: poetry
+      - name: uv
+        uses: astral-sh/setup-uv@v4
+      - name: install
         run: |
-          python -m pip install poetry==2.1.2
-          python -m poetry config virtualenvs.in-project true
-          cd tests/integration && poetry install --no-root
+          cd tests/integration && uv sync
       - name: webdriver
         run: |
           wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | sudo apt-key add -
@@ -87,7 +89,7 @@ jobs:
       - name: run
         run: |
           cd tests/integration && \
-            poetry run pytest \
+            uv run pytest \
             --basetemp=./tmp/ \
             src/${{matrix.src}} \
             --sqlstore-provider ${{matrix.sqlstore-provider}} \

.gitignore

@@ -12,7 +12,6 @@ frontend/coverage
 
 # production
 frontend/build
-frontend/.vscode
 frontend/.yarnclean
 frontend/.temp_cache
 frontend/test-results
@@ -31,7 +30,6 @@ frontend/src/constants/env.ts
 
 .idea
 
-**/.vscode
 **/build
 **/storage
 **/locust-scripts/__pycache__/
@@ -222,8 +220,6 @@ cython_debug/
 #.idea/
 
 ### Python Patch ###
-# Poetry local configuration file - https://python-poetry.org/docs/configuration/#local-configuration
-poetry.toml
 
 # ruff
 .ruff_cache/

.mockery.yml

@@ -0,0 +1,10 @@
+# Link to template variables: https://pkg.go.dev/github.com/vektra/mockery/v3/config#TemplateData
+template: testify
+packages:
+  github.com/SigNoz/signoz/pkg/alertmanager:
+    config:
+      all: true
+      dir: '{{.InterfaceDir}}/mocks'
+      filename: "mocks.go"
+      structname: 'Mock{{.InterfaceName}}'
+      pkgname: '{{.SrcPackageName}}mock'

.vscode/settings.json

@@ -0,0 +1,9 @@
+{
+	"eslint.workingDirectories": ["./frontend"],
+	"editor.formatOnSave": true,
+	"editor.defaultFormatter": "esbenp.prettier-vscode",
+	"editor.codeActionsOnSave": {
+		"source.fixAll.eslint": "explicit"
+	},
+	"prettier.requireConfig": true
+}

Makefile

@@ -202,14 +202,31 @@ docker-buildx-enterprise: go-build-enterprise js-build
 ##############################################################
 .PHONY: py-fmt
 py-fmt: ## Run black for integration tests
-	@cd tests/integration && poetry run black .
+	@cd tests/integration && uv run black .
 
 .PHONY: py-lint
 py-lint: ## Run lint for integration tests
-	@cd tests/integration && poetry run isort .
-	@cd tests/integration && poetry run autoflake .
-	@cd tests/integration && poetry run pylint .
+	@cd tests/integration && uv run isort .
+	@cd tests/integration && uv run autoflake .
+	@cd tests/integration && uv run pylint .
+
+.PHONY: py-test-setup
+py-test-setup: ## Runs integration tests
+	@cd tests/integration && uv run pytest --basetemp=./tmp/ -vv --reuse --capture=no src/bootstrap/setup.py::test_setup
+
+.PHONY: py-test-teardown
+py-test-teardown: ## Runs integration tests with teardown
+	@cd tests/integration && uv run pytest --basetemp=./tmp/ -vv --teardown --capture=no  src/bootstrap/setup.py::test_teardown
 
 .PHONY: py-test
 py-test: ## Runs integration tests
-	@cd tests/integration && poetry run pytest --basetemp=./tmp/ -vv --capture=no src/
+	@cd tests/integration && uv run pytest --basetemp=./tmp/ -vv --capture=no src/
+
+.PHONY: py-clean
+py-clean: ## Clear all pycache and pytest cache from tests directory recursively
+	@echo ">> cleaning python cache files from tests directory"
+	@find tests -type d -name __pycache__ -exec rm -rf {} + 2>/dev/null || true
+	@find tests -type d -name .pytest_cache -exec rm -rf {} + 2>/dev/null || true
+	@find tests -type f -name "*.pyc" -delete 2>/dev/null || true
+	@find tests -type f -name "*.pyo" -delete 2>/dev/null || true
+	@echo ">> python cache cleaned"

cmd/community/server.go

@@ -14,8 +14,13 @@ import (
 	"github.com/SigNoz/signoz/pkg/factory"
 	"github.com/SigNoz/signoz/pkg/licensing"
 	"github.com/SigNoz/signoz/pkg/licensing/nooplicensing"
+	"github.com/SigNoz/signoz/pkg/modules/dashboard"
+	"github.com/SigNoz/signoz/pkg/modules/dashboard/impldashboard"
 	"github.com/SigNoz/signoz/pkg/modules/organization"
+	"github.com/SigNoz/signoz/pkg/modules/role"
+	"github.com/SigNoz/signoz/pkg/querier"
 	"github.com/SigNoz/signoz/pkg/query-service/app"
+	"github.com/SigNoz/signoz/pkg/queryparser"
 	"github.com/SigNoz/signoz/pkg/signoz"
 	"github.com/SigNoz/signoz/pkg/sqlschema"
 	"github.com/SigNoz/signoz/pkg/sqlstore"
@@ -82,6 +87,9 @@ func runServer(ctx context.Context, config signoz.Config, logger *slog.Logger) e
 		func(ctx context.Context, sqlstore sqlstore.SQLStore) factory.ProviderFactory[authz.AuthZ, authz.Config] {
 			return openfgaauthz.NewProviderFactory(sqlstore, openfgaschema.NewSchema().Get(ctx))
 		},
+		func(store sqlstore.SQLStore, settings factory.ProviderSettings, analytics analytics.Analytics, orgGetter organization.Getter, _ role.Module, queryParser queryparser.QueryParser, _ querier.Querier, _ licensing.Licensing) dashboard.Module {
+			return impldashboard.NewModule(impldashboard.NewStore(store), settings, analytics, orgGetter, queryParser)
+		},
 	)
 	if err != nil {
 		logger.ErrorContext(ctx, "failed to create signoz", "error", err)

cmd/enterprise/server.go

@@ -12,6 +12,7 @@ import (
 	"github.com/SigNoz/signoz/ee/authz/openfgaschema"
 	enterpriselicensing "github.com/SigNoz/signoz/ee/licensing"
 	"github.com/SigNoz/signoz/ee/licensing/httplicensing"
+	"github.com/SigNoz/signoz/ee/modules/dashboard/impldashboard"
 	enterpriseapp "github.com/SigNoz/signoz/ee/query-service/app"
 	"github.com/SigNoz/signoz/ee/sqlschema/postgressqlschema"
 	"github.com/SigNoz/signoz/ee/sqlstore/postgressqlstore"
@@ -22,7 +23,12 @@ import (
 	"github.com/SigNoz/signoz/pkg/authz"
 	"github.com/SigNoz/signoz/pkg/factory"
 	"github.com/SigNoz/signoz/pkg/licensing"
+	"github.com/SigNoz/signoz/pkg/modules/dashboard"
+	pkgimpldashboard "github.com/SigNoz/signoz/pkg/modules/dashboard/impldashboard"
 	"github.com/SigNoz/signoz/pkg/modules/organization"
+	"github.com/SigNoz/signoz/pkg/modules/role"
+	"github.com/SigNoz/signoz/pkg/querier"
+	"github.com/SigNoz/signoz/pkg/queryparser"
 	"github.com/SigNoz/signoz/pkg/signoz"
 	"github.com/SigNoz/signoz/pkg/sqlschema"
 	"github.com/SigNoz/signoz/pkg/sqlstore"
@@ -111,6 +117,9 @@ func runServer(ctx context.Context, config signoz.Config, logger *slog.Logger) e
 		func(ctx context.Context, sqlstore sqlstore.SQLStore) factory.ProviderFactory[authz.AuthZ, authz.Config] {
 			return openfgaauthz.NewProviderFactory(sqlstore, openfgaschema.NewSchema().Get(ctx))
 		},
+		func(store sqlstore.SQLStore, settings factory.ProviderSettings, analytics analytics.Analytics, orgGetter organization.Getter, role role.Module, queryParser queryparser.QueryParser, querier querier.Querier, licensing licensing.Licensing) dashboard.Module {
+			return impldashboard.NewModule(pkgimpldashboard.NewStore(store), settings, analytics, orgGetter, role, queryParser, querier, licensing)
+		},
 	)
 	if err != nil {
 		logger.ErrorContext(ctx, "failed to create signoz", "error", err)

cmd/zap.go

@@ -1,6 +1,10 @@
 package cmd
 
 import (
+	"context"
+	"time"
+
+	"github.com/SigNoz/signoz/pkg/errors"
 	"go.uber.org/zap"         //nolint:depguard
 	"go.uber.org/zap/zapcore" //nolint:depguard
 )
@@ -10,6 +14,97 @@ func newZapLogger() *zap.Logger {
 	config := zap.NewProductionConfig()
 	config.EncoderConfig.TimeKey = "timestamp"
 	config.EncoderConfig.EncodeTime = zapcore.ISO8601TimeEncoder
+
+	// Extract sampling config before building the logger.
+	// We need to disable sampling in the config and apply it manually later
+	// to ensure correct core ordering. See filteringCore documentation for details.
+	samplerConfig := config.Sampling
+	config.Sampling = nil
+
 	logger, _ := config.Build()
-	return logger
+
+	// Wrap with custom core wrapping to filter certain log entries.
+	// The order of wrapping is important:
+	//   1. First wrap with filteringCore
+	//   2. Then wrap with sampler
+	//
+	// This creates the call chain: sampler -> filteringCore -> ioCore
+	//
+	// During logging:
+	//   - sampler.Check decides whether to sample the log entry
+	//   - If sampled, filteringCore.Check is called
+	//   - filteringCore adds itself to CheckedEntry.cores
+	//   - All cores in CheckedEntry.cores have their Write method called
+	//   - filteringCore.Write can now filter the entry before passing to ioCore
+	//
+	// If we didn't disable the sampler above, filteringCore would have wrapped
+	// sampler. By calling sampler.Check we would have allowed it to call
+	// ioCore.Check that adds itself to CheckedEntry.cores. Then ioCore.Write
+	// would have bypassed our checks, making filtering impossible.
+	return logger.WithOptions(zap.WrapCore(func(core zapcore.Core) zapcore.Core {
+		core = &filteringCore{core}
+		if samplerConfig != nil {
+			core = zapcore.NewSamplerWithOptions(
+				core,
+				time.Second,
+				samplerConfig.Initial,
+				samplerConfig.Thereafter,
+			)
+		}
+		return core
+	}))
+}
+
+// filteringCore wraps a zapcore.Core to filter out log entries based on a
+// custom logic.
+//
+// Note: This core must be positioned before the sampler in the core chain
+// to ensure Write is called. See newZapLogger for ordering details.
+type filteringCore struct {
+	zapcore.Core
+}
+
+// filter determines whether a log entry should be written based on its fields.
+// Returns false if the entry should be suppressed, true otherwise.
+//
+// Current filters:
+//   - context.Canceled: These are expected errors from cancelled operations,
+//     and create noise in logs.
+func (c *filteringCore) filter(fields []zapcore.Field) bool {
+	for _, field := range fields {
+		if field.Type == zapcore.ErrorType {
+			if loggedErr, ok := field.Interface.(error); ok {
+				// Suppress logs containing context.Canceled errors
+				if errors.Is(loggedErr, context.Canceled) {
+					return false
+				}
+			}
+		}
+	}
+	return true
+}
+
+// With implements zapcore.Core.With
+// It returns a new copy with the added context.
+func (c *filteringCore) With(fields []zapcore.Field) zapcore.Core {
+	return &filteringCore{c.Core.With(fields)}
+}
+
+// Check implements zapcore.Core.Check.
+// It adds this core to the CheckedEntry if the log level is enabled,
+// ensuring that Write will be called for this entry.
+func (c *filteringCore) Check(ent zapcore.Entry, ce *zapcore.CheckedEntry) *zapcore.CheckedEntry {
+	if c.Enabled(ent.Level) {
+		return ce.AddCore(ent, c)
+	}
+	return ce
+}
+
+// Write implements zapcore.Core.Write.
+// It filters log entries based on their fields before delegating to the wrapped core.
+func (c *filteringCore) Write(ent zapcore.Entry, fields []zapcore.Field) error {
+	if !c.filter(fields) {
+		return nil
+	}
+	return c.Core.Write(ent, fields)
 }

conf/example.yaml

@@ -278,3 +278,16 @@ tokenizer:
     token:
       # The maximum number of tokens a user can have. This limits the number of concurrent sessions a user can have.
       max_per_user: 5
+
+##################### Flagger #####################
+flagger:
+  # Config are the overrides for the feature flags which come directly from the config file.
+  config:
+    boolean:
+      use_span_metrics: true
+      interpolation_enabled: false
+      kafka_span_eval: false
+    string:
+    float:
+    integer:
+    object:

context7.json

@@ -0,0 +1,4 @@
+{
+  "url": "https://context7.com/signoz/signoz",
+  "public_key": "pk_6g9GfjdkuPEIDuTGAxnol"
+}

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

@@ -176,7 +176,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:v0.105.1
+    image: signoz/signoz:v0.107.0
     command:
       - --config=/root/config/prometheus.yml
     ports:

deploy/docker-swarm/docker-compose.yaml

@@ -117,7 +117,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:v0.105.1
+    image: signoz/signoz:v0.107.0
     command:
       - --config=/root/config/prometheus.yml
     ports:

deploy/docker/docker-compose.ha.yaml

@@ -179,7 +179,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:${VERSION:-v0.105.1}
+    image: signoz/signoz:${VERSION:-v0.107.0}
     container_name: signoz
     command:
       - --config=/root/config/prometheus.yml

deploy/docker/docker-compose.yaml

@@ -111,7 +111,7 @@ services:
       # - ../common/clickhouse/storage.xml:/etc/clickhouse-server/config.d/storage.xml
   signoz:
     !!merge <<: *db-depend
-    image: signoz/signoz:${VERSION:-v0.105.1}
+    image: signoz/signoz:${VERSION:-v0.107.0}
     container_name: signoz
     command:
       - --config=/root/config/prometheus.yml

docs/contributing/go/flagger.md

@@ -0,0 +1,134 @@
+# Flagger
+
+Flagger is SigNoz's feature flagging system built on top of the [OpenFeature](https://openfeature.dev/) standard. It provides a unified interface for evaluating feature flags across the application, allowing features to be enabled, disabled, or configured dynamically without code changes.
+
+> 💡 **Note**: OpenFeature is a CNCF project that provides a vendor-agnostic feature flagging API, making it easy to switch providers without changing application code.
+
+## How does it work?
+
+Flagger consists of three main components:
+
+1. **Registry** (`pkg/flagger/registry.go`) - Contains all available feature flags with their metadata and default values
+2. **Flagger** (`pkg/flagger/flagger.go`) - The consumer-facing interface for evaluating feature flags
+3. **Providers** (`pkg/flagger/<provider>flagger/`) - Implementations that supply feature flag values (e.g., `configflagger` for config-based flags)
+
+The evaluation flow works as follows:
+
+1. The caller requests a feature flag value via the `Flagger` interface
+2. Flagger checks the registry to validate the flag exists and get its default value
+3. Each registered provider is queried for an override value
+4. If a provider returns a value different from the default, that value is returned
+5. Otherwise, the default value from the registry is returned
+
+## How to add a new feature flag?
+
+### 1. Register the flag in the registry
+
+Add your feature flag definition in `pkg/flagger/registry.go`:
+
+```go
+var (
+    // Export the feature name for use in evaluations
+    FeatureMyNewFeature = featuretypes.MustNewName("my_new_feature")
+)
+
+func MustNewRegistry() featuretypes.Registry {
+    registry, err := featuretypes.NewRegistry(
+        // ...existing features...
+        &featuretypes.Feature{
+            Name:           FeatureMyNewFeature,
+            Kind:           featuretypes.KindBoolean, // or KindString, KindFloat, KindInt, KindObject
+            Stage:          featuretypes.StageStable, // or StageAlpha, StageBeta
+            Description:    "Controls whether my new feature is enabled",
+            DefaultVariant: featuretypes.MustNewName("disabled"),
+            Variants:       featuretypes.NewBooleanVariants(),
+        },
+    )
+    // ...
+}
+```
+
+> 💡 **Note**: Feature names must match the regex `^[a-z_]+$` (lowercase letters and underscores only).
+
+### 2. Configure the feature flag value (optional)
+
+To override the default value, add an entry in your configuration file:
+
+```yaml
+flagger:
+  config:
+    boolean:
+      my_new_feature: true
+```
+
+Supported configuration types:
+
+| Type | Config Key | Go Type |
+|------|------------|---------|
+| Boolean | `boolean` | `bool` |
+| String | `string` | `string` |
+| Float | `float` | `float64` |
+| Integer | `integer` | `int64` |
+| Object | `object` | `any` |
+
+## How to evaluate a feature flag?
+
+Use the `Flagger` interface to evaluate feature flags. The interface provides typed methods for each value type:
+
+```go
+import (
+    "github.com/SigNoz/signoz/pkg/flagger"
+    "github.com/SigNoz/signoz/pkg/types/featuretypes"
+)
+
+func DoSomething(ctx context.Context, flagger flagger.Flagger) error {
+    // Create an evaluation context (typically with org ID)
+    evalCtx := featuretypes.NewFlaggerEvaluationContext(orgID)
+    
+    // Evaluate with error handling
+    enabled, err := flagger.Boolean(ctx, flagger.FeatureMyNewFeature, evalCtx)
+    if err != nil {
+        return err
+    }
+    
+    if enabled {
+        // Feature is enabled
+    }
+    
+    return nil
+}
+```
+
+### Empty variants 
+
+For cases where you want to use a default value on error (and log the error), use the `*OrEmpty` methods:
+
+```go
+func DoSomething(ctx context.Context, flagger flagger.Flagger) {
+    evalCtx := featuretypes.NewFlaggerEvaluationContext(orgID)
+    
+    // Returns false on error and logs the error
+    if flagger.BooleanOrEmpty(ctx, flagger.FeatureMyNewFeature, evalCtx) {
+        // Feature is enabled
+    }
+}
+```
+
+### Available evaluation methods
+
+| Method | Return Type | Empty Variant Default |
+|--------|-------------|---------------------|
+| `Boolean()` | `(bool, error)` | `false` |
+| `String()` | `(string, error)` | `""` |
+| `Float()` | `(float64, error)` | `0.0` |
+| `Int()` | `(int64, error)` | `0` |
+| `Object()` | `(any, error)` | `struct{}{}` |
+
+## What should I remember?
+
+- Always define feature flags in the registry (`pkg/flagger/registry.go`) before using them
+- Use descriptive feature names that clearly indicate what the flag controls
+- Prefer `*OrEmpty` methods for non-critical features to avoid error handling overhead
+- Export feature name variables (e.g., `FeatureMyNewFeature`) for type-safe usage across packages
+- Consider the feature's lifecycle stage (`Alpha`, `Beta`, `Stable`) when defining it
+- Providers are evaluated in order; the first non-default value wins

docs/contributing/go/integration.md

@@ -9,7 +9,7 @@ SigNoz uses integration tests to verify that different components work together
 Before running integration tests, ensure you have the following installed:
 
 - Python 3.13+
-- Poetry (for dependency management)
+- [uv](https://docs.astral.sh/uv/getting-started/installation/)
 - Docker (for containerized services)
 
 ### Initial Setup
@@ -19,17 +19,19 @@ Before running integration tests, ensure you have the following installed:
 cd tests/integration
 ```
 
-2. Install dependencies using Poetry:
+2. Install dependencies using uv:
 ```bash
-poetry install --no-root
+uv sync
 ```
 
+> **_NOTE:_**  the build backend could throw an error while installing `psycopg2`, pleae see https://www.psycopg.org/docs/install.html#build-prerequisites
+
 ### Starting the Test Environment
 
 To spin up all the containers necessary for writing integration tests and keep them running:
 
 ```bash
-poetry run pytest --basetemp=./tmp/ -vv --reuse src/bootstrap/setup.py::test_setup
+uv run pytest --basetemp=./tmp/ -vv --reuse src/bootstrap/setup.py::test_setup
 ```
 
 This command will:
@@ -42,7 +44,7 @@ This command will:
 When you're done writing integration tests, clean up the environment:
 
 ```bash
-poetry run pytest --basetemp=./tmp/ -vv --teardown -s src/bootstrap/setup.py::test_teardown
+uv run pytest --basetemp=./tmp/ -vv --teardown -s src/bootstrap/setup.py::test_teardown
 ```
 
 This will destroy the running integration test setup and clean up resources.
@@ -72,20 +74,20 @@ Python and pytest form the foundation of the integration testing framework. Test
 │   ├── sqlite.py
 │   ├── types.py
 │   └── zookeeper.py
-├── poetry.lock
+├── uv.lock
 ├── pyproject.toml
 └── src
     └── bootstrap
         ├── __init__.py
-        ├── a_database.py
-        ├── b_register.py
-        └── c_license.py
+        ├── 01_database.py
+        ├── 02_register.py
+        └── 03_license.py
 ```
 
 Each test suite follows some important principles:
 
 1. **Organization**: Test suites live under `src/` in self-contained packages. Fixtures (a pytest concept) live inside `fixtures/`.
-2. **Execution Order**: Files are prefixed with `a_`, `b_`, `c_` to ensure sequential execution.
+2. **Execution Order**: Files are prefixed with two-digit numbers (`01_`, `02_`, `03_`) to ensure sequential execution.
 3. **Time Constraints**: Each suite should complete in under 10 minutes (setup takes ~4 mins).
 
 ### Test Suite Design
@@ -107,7 +109,7 @@ Other test suites can be **pipelines, auth, querier.**
 
 ## How to write an integration test?
 
-Now start writing an integration test. Create a new file `src/bootstrap/e_version.py` and paste the following:
+Now start writing an integration test. Create a new file `src/bootstrap/05_version.py` and paste the following:
 
 ```python
 import requests
@@ -125,7 +127,7 @@ def test_version(signoz: types.SigNoz) -> None:
 We have written a simple test which calls the `version` endpoint of the container in step 1. In **order to just run this function, run the following command:**
 
 ```bash
-poetry run pytest --basetemp=./tmp/ -vv --reuse src/bootstrap/e_version.py::test_version
+uv run pytest --basetemp=./tmp/ -vv --reuse src/bootstrap/05_version.py::test_version
 ```
 
 > Note: The `--reuse` flag is used to reuse the environment if it is already running. Always use this flag when writing and running integration tests. If you don't use this flag, the environment will be destroyed and recreated every time you run the test.
@@ -153,7 +155,7 @@ def test_user_registration(signoz: types.SigNoz) -> None:
         },
         timeout=2,
     )
-    
+
     assert response.status_code == HTTPStatus.OK
     assert response.json()["setupCompleted"] is True
 ```
@@ -163,27 +165,27 @@ def test_user_registration(signoz: types.SigNoz) -> None:
 ### Running All Tests
 
 ```bash
-poetry run pytest --basetemp=./tmp/ -vv --reuse src/
+uv run pytest --basetemp=./tmp/ -vv --reuse src/
 ```
 
 ### Running Specific Test Categories
 
 ```bash
-poetry run pytest --basetemp=./tmp/ -vv --reuse src/<suite>
+uv run pytest --basetemp=./tmp/ -vv --reuse src/<suite>
 
 # Run querier tests
-poetry run pytest --basetemp=./tmp/ -vv --reuse src/querier/
+uv run pytest --basetemp=./tmp/ -vv --reuse src/querier/
 # Run auth tests
-poetry run pytest --basetemp=./tmp/ -vv --reuse src/auth/
+uv run pytest --basetemp=./tmp/ -vv --reuse src/auth/
 ```
 
 ### Running Individual Tests
 
 ```bash
-poetry run pytest --basetemp=./tmp/ -vv --reuse src/<suite>/<file>.py::test_name
+uv run pytest --basetemp=./tmp/ -vv --reuse src/<suite>/<file>.py::test_name
 
-# Run test_register in file a_register.py in auth suite
-poetry run pytest --basetemp=./tmp/ -vv --reuse src/auth/a_register.py::test_register
+# Run test_register in file 01_register.py in passwordauthn suite
+uv run pytest --basetemp=./tmp/ -vv --reuse src/passwordauthn/01_register.py::test_register
 ```
 
 ## How to configure different options for integration tests?
@@ -197,7 +199,7 @@ Tests can be configured using pytest options:
 
 Example:
 ```bash
-poetry run pytest --basetemp=./tmp/ -vv --reuse --sqlstore-provider=postgres --postgres-version=14 src/auth/
+uv run pytest --basetemp=./tmp/ -vv --reuse --sqlstore-provider=postgres --postgres-version=14 src/auth/
 ```
 
 
@@ -205,7 +207,7 @@ poetry run pytest --basetemp=./tmp/ -vv --reuse --sqlstore-provider=postgres --p
 
 - **Always use the `--reuse` flag** when setting up the environment to keep containers running
 - **Use the `--teardown` flag** when cleaning up to avoid resource leaks
-- **Follow the naming convention** with alphabetical prefixes for test execution order
+- **Follow the naming convention** with two-digit numeric prefixes (`01_`, `02_`) for test execution order
 - **Use proper timeouts** in HTTP requests to avoid hanging tests
 - **Clean up test data** between tests to avoid interference
 - **Use descriptive test names** that clearly indicate what is being tested

docs/contributing/onboarding.md

@@ -0,0 +1,301 @@
+# Onboarding Configuration Guide
+
+This guide explains how to add new data sources to the SigNoz onboarding flow. The onboarding configuration controls the "New Source" / "Get Started" experience in SigNoz Cloud.
+
+## Configuration File Location
+
+The configuration is located at:
+
+```
+frontend/src/container/OnboardingV2Container/onboarding-configs/onboarding-config-with-links.json
+```
+
+## JSON Structure Overview
+
+The configuration file is a JSON array containing data source objects. Each object represents a selectable option in the onboarding flow.
+
+## Data Source Object Keys
+
+### Required Keys
+
+| Key | Type | Description |
+|-----|------|-------------|
+| `dataSource` | `string` | Unique identifier for the data source (kebab-case, e.g., `"aws-ec2"`) |
+| `label` | `string` | Display name shown to users (e.g., `"AWS EC2"`) |
+| `tags` | `string[]` | Array of category tags for grouping (e.g., `["AWS"]`, `["database"]`) |
+| `module` | `string` | Destination module after onboarding completion |
+| `imgUrl` | `string` | Path to the logo/icon (e.g., `"/Logos/ec2.svg"`) |
+
+### Optional Keys
+
+| Key | Type | Description |
+|-----|------|-------------|
+| `link` | `string` | Docs link to redirect to (e.g., `"/docs/aws-monitoring/ec2/"`) |
+| `relatedSearchKeywords` | `string[]` | Array of keywords for search functionality |
+| `question` | `object` | Nested question object for multi-step flows |
+| `internalRedirect` | `boolean` | When `true`, navigates within the app instead of showing docs |
+
+## Module Values
+
+The `module` key determines where users are redirected after completing onboarding:
+
+| Value | Destination |
+|-------|-------------|
+| `apm` | APM / Traces |
+| `logs` | Logs Explorer |
+| `metrics` | Metrics Explorer |
+| `dashboards` | Dashboards |
+| `infra-monitoring-hosts` | Infrastructure Monitoring - Hosts |
+| `infra-monitoring-k8s` | Infrastructure Monitoring - Kubernetes |
+| `messaging-queues-kafka` | Messaging Queues - Kafka |
+| `messaging-queues-celery` | Messaging Queues - Celery |
+| `integrations` | Integrations page |
+| `home` | Home page |
+| `api-monitoring` | API Monitoring |
+
+## Question Object Structure
+
+The `question` object enables multi-step selection flows:
+
+```json
+{
+  "question": {
+    "desc": "What would you like to monitor?",
+    "type": "select",
+    "helpText": "Choose the telemetry type you want to collect.",
+    "helpLink": "/docs/azure-monitoring/overview/",
+    "helpLinkText": "Read the guide →",
+    "options": [
+        {
+            "key": "logging",
+            "label": "Logs",
+            "imgUrl": "/Logos/azure-vm.svg",
+            "link": "/docs/azure-monitoring/app-service/logging/"
+        },
+        {
+            "key": "metrics",
+            "label": "Metrics",
+            "imgUrl": "/Logos/azure-vm.svg",
+            "link": "/docs/azure-monitoring/app-service/metrics/"
+        },
+        {
+            "key": "tracing",
+            "label": "Traces",
+            "imgUrl": "/Logos/azure-vm.svg",
+            "link": "/docs/azure-monitoring/app-service/tracing/"
+        }
+    ]
+  }
+}
+```
+
+### Question Keys
+
+| Key | Type | Description |
+|-----|------|-------------|
+| `desc` | `string` | Question text displayed to the user |
+| `type` | `string` | Currently only `"select"` is supported |
+| `helpText` | `string` | (Optional) Additional help text below the question |
+| `helpLink` | `string` | (Optional) Docs link for the help section |
+| `helpLinkText` | `string` | (Optional) Text for the help link (default: "Learn more →") |
+| `options` | `array` | Array of option objects |
+
+## Option Object Structure
+
+Options can be simple (direct link) or nested (with another question):
+
+### Simple Option (Direct Link)
+
+```json
+{
+  "key": "aws-ec2-logs",
+  "label": "Logs",
+  "imgUrl": "/Logos/ec2.svg",
+  "link": "/docs/userguide/collect_logs_from_file/"
+}
+```
+
+### Option with Internal Redirect
+
+```json
+{
+  "key": "aws-ec2-metrics-one-click",
+  "label": "One Click AWS",
+  "imgUrl": "/Logos/ec2.svg",
+  "link": "/integrations?integration=aws-integration&service=ec2",
+  "internalRedirect": true
+}
+```
+
+> **Important**: Set `internalRedirect: true` only for internal app routes (like `/integrations?...`). Docs links should NOT have this flag.
+
+### Nested Option (Multi-step Flow)
+
+```json
+{
+  "key": "aws-ec2-metrics",
+  "label": "Metrics",
+  "imgUrl": "/Logos/ec2.svg",
+  "question": {
+    "desc": "How would you like to set up monitoring?",
+    "helpText": "Choose your setup method.",
+    "options": [...]
+  }
+}
+```
+
+## Examples
+
+### Simple Data Source (Direct Link)
+
+```json
+{
+  "dataSource": "aws-elb",
+  "label": "AWS ELB",
+  "tags": ["AWS"],
+  "module": "logs",
+  "relatedSearchKeywords": [
+    "aws",
+    "aws elb",
+    "elb logs",
+    "elastic load balancer"
+  ],
+  "imgUrl": "/Logos/elb.svg",
+  "link": "/docs/aws-monitoring/elb/"
+}
+```
+
+### Data Source with Single Question Level
+
+```json
+{
+  "dataSource": "app-service",
+  "label": "App Service",
+  "imgUrl": "/Logos/azure-vm.svg",
+  "tags": ["Azure"],
+  "module": "apm",
+  "relatedSearchKeywords": ["azure", "app service"],
+  "question": {
+    "desc": "What telemetry data do you want to visualise?",
+    "type": "select",
+    "options": [
+      {
+        "key": "logging",
+        "label": "Logs",
+        "imgUrl": "/Logos/azure-vm.svg",
+        "link": "/docs/azure-monitoring/app-service/logging/"
+      },
+      {
+        "key": "metrics",
+        "label": "Metrics",
+        "imgUrl": "/Logos/azure-vm.svg",
+        "link": "/docs/azure-monitoring/app-service/metrics/"
+      },
+      {
+        "key": "tracing",
+        "label": "Traces",
+        "imgUrl": "/Logos/azure-vm.svg",
+        "link": "/docs/azure-monitoring/app-service/tracing/"
+      }
+    ]
+  }
+}
+```
+
+### Data Source with Nested Questions (2-3 Levels)
+
+```json
+{
+  "dataSource": "aws-ec2",
+  "label": "AWS EC2",
+  "tags": ["AWS"],
+  "module": "logs",
+  "relatedSearchKeywords": ["aws", "aws ec2", "ec2 logs", "ec2 metrics"],
+  "imgUrl": "/Logos/ec2.svg",
+  "question": {
+    "desc": "What would you like to monitor for AWS EC2?",
+    "type": "select",
+    "helpText": "Choose the type of telemetry data you want to collect.",
+    "options": [
+      {
+        "key": "aws-ec2-logs",
+        "label": "Logs",
+        "imgUrl": "/Logos/ec2.svg",
+        "link": "/docs/userguide/collect_logs_from_file/"
+      },
+      {
+        "key": "aws-ec2-metrics",
+        "label": "Metrics",
+        "imgUrl": "/Logos/ec2.svg",
+        "question": {
+          "desc": "How would you like to set up EC2 Metrics monitoring?",
+          "helpText": "One Click uses AWS CloudWatch integration. Manual setup uses OpenTelemetry.",
+          "helpLink": "/docs/aws-monitoring/one-click-vs-manual/",
+          "helpLinkText": "Read the comparison guide →",
+          "options": [
+            {
+              "key": "aws-ec2-metrics-one-click",
+              "label": "One Click AWS",
+              "imgUrl": "/Logos/ec2.svg",
+              "link": "/integrations?integration=aws-integration&service=ec2",
+              "internalRedirect": true
+            },
+            {
+              "key": "aws-ec2-metrics-manual",
+              "label": "Manual Setup",
+              "imgUrl": "/Logos/ec2.svg",
+              "link": "/docs/tutorial/opentelemetry-binary-usage-in-virtual-machine/"
+            }
+          ]
+        }
+      }
+    ]
+  }
+}
+```
+
+## Best Practices
+
+### 1. Tags
+
+- Use existing tags when possible: `AWS`, `Azure`, `GCP`, `database`, `logs`, `apm/traces`, `infrastructure monitoring`, `LLM Monitoring`
+- Tags are used for grouping in the sidebar
+- Every data source must have at least one tag
+
+### 2. Search Keywords
+
+- Include variations of the name (e.g., `"aws ec2"`, `"ec2"`, `"ec2 logs"`)
+- Include common misspellings or alternative names
+- Keep keywords lowercase and alphabetically sorted
+
+### 3. Logos
+
+- Place logo files in `public/Logos/`
+- Use SVG format
+- Reference as `"/Logos/your-logo.svg"`
+
+### 4. Links
+
+- Docs links should start with `/docs/` (will be prefixed with DOCS_BASE_URL)
+- Internal app links should start with `/integrations`, `/services`, etc.
+- Only use `internalRedirect: true` for internal app routes
+
+### 5. Keys
+
+- Use kebab-case for `dataSource` and option `key` values
+- Make keys descriptive and unique
+- Follow the pattern: `{service}-{subtype}-{action}` (e.g., `aws-ec2-metrics-one-click`)
+
+## Adding a New Data Source
+
+1. Add your data source object to the JSON array
+2. Ensure the logo exists in `public/Logos/`
+3. Test the flow locally with `yarn dev`
+4. Validation:
+   - Navigate to the [onboarding page](http://localhost:3301/get-started-with-signoz-cloud) on your local machine
+   - Data source appears in the list
+   - Search keywords work correctly
+   - All links redirect to the correct pages
+   - Questions display correct help text and links
+   - Tags are used for grouping in the UI sidebar
+   - Clicking on Configure redirects to the correct page

ee/modules/dashboard/impldashboard/module.go

@@ -0,0 +1,297 @@
+package impldashboard
+
+import (
+	"context"
+	"maps"
+
+	"github.com/SigNoz/signoz/pkg/analytics"
+	"github.com/SigNoz/signoz/pkg/errors"
+	"github.com/SigNoz/signoz/pkg/factory"
+	"github.com/SigNoz/signoz/pkg/licensing"
+	"github.com/SigNoz/signoz/pkg/modules/dashboard"
+	pkgimpldashboard "github.com/SigNoz/signoz/pkg/modules/dashboard/impldashboard"
+	"github.com/SigNoz/signoz/pkg/modules/organization"
+	"github.com/SigNoz/signoz/pkg/modules/role"
+	"github.com/SigNoz/signoz/pkg/querier"
+	"github.com/SigNoz/signoz/pkg/queryparser"
+	"github.com/SigNoz/signoz/pkg/types"
+	"github.com/SigNoz/signoz/pkg/types/authtypes"
+	"github.com/SigNoz/signoz/pkg/types/dashboardtypes"
+	"github.com/SigNoz/signoz/pkg/types/querybuildertypes/querybuildertypesv5"
+	"github.com/SigNoz/signoz/pkg/types/roletypes"
+	"github.com/SigNoz/signoz/pkg/valuer"
+)
+
+type module struct {
+	pkgDashboardModule dashboard.Module
+	store              dashboardtypes.Store
+	settings           factory.ScopedProviderSettings
+	role               role.Module
+	querier            querier.Querier
+	licensing          licensing.Licensing
+}
+
+func NewModule(store dashboardtypes.Store, settings factory.ProviderSettings, analytics analytics.Analytics, orgGetter organization.Getter, role role.Module, queryParser queryparser.QueryParser, querier querier.Querier, licensing licensing.Licensing) dashboard.Module {
+	scopedProviderSettings := factory.NewScopedProviderSettings(settings, "github.com/SigNoz/signoz/ee/modules/dashboard/impldashboard")
+	pkgDashboardModule := pkgimpldashboard.NewModule(store, settings, analytics, orgGetter, queryParser)
+
+	return &module{
+		pkgDashboardModule: pkgDashboardModule,
+		store:              store,
+		settings:           scopedProviderSettings,
+		role:               role,
+		querier:            querier,
+		licensing:          licensing,
+	}
+}
+
+func (module *module) CreatePublic(ctx context.Context, orgID valuer.UUID, publicDashboard *dashboardtypes.PublicDashboard) error {
+	_, err := module.licensing.GetActive(ctx, orgID)
+	if err != nil {
+		return errors.New(errors.TypeLicenseUnavailable, errors.CodeLicenseUnavailable, "a valid license is not available").WithAdditional("this feature requires a valid license").WithAdditional(err.Error())
+	}
+
+	storablePublicDashboard, err := module.store.GetPublic(ctx, publicDashboard.DashboardID.StringValue())
+	if err != nil && !errors.Ast(err, errors.TypeNotFound) {
+		return err
+	}
+	if storablePublicDashboard != nil {
+		return errors.Newf(errors.TypeAlreadyExists, dashboardtypes.ErrCodePublicDashboardAlreadyExists, "dashboard with id %s is already public", storablePublicDashboard.DashboardID)
+	}
+
+	role, err := module.role.GetOrCreate(ctx, roletypes.NewRole(roletypes.AnonymousUserRoleName, roletypes.AnonymousUserRoleDescription, roletypes.RoleTypeManaged.StringValue(), orgID))
+	if err != nil {
+		return err
+	}
+
+	err = module.role.Assign(ctx, role.ID, orgID, authtypes.MustNewSubject(authtypes.TypeableAnonymous, authtypes.AnonymousUser.StringValue(), orgID, nil))
+	if err != nil {
+		return err
+	}
+
+	additionObject := authtypes.MustNewObject(
+		authtypes.Resource{
+			Name: dashboardtypes.TypeableMetaResourcePublicDashboard.Name(),
+			Type: authtypes.TypeMetaResource,
+		},
+		authtypes.MustNewSelector(authtypes.TypeMetaResource, publicDashboard.ID.String()),
+	)
+
+	err = module.role.PatchObjects(ctx, orgID, role.ID, authtypes.RelationRead, []*authtypes.Object{additionObject}, nil)
+	if err != nil {
+		return err
+	}
+
+	err = module.store.CreatePublic(ctx, dashboardtypes.NewStorablePublicDashboardFromPublicDashboard(publicDashboard))
+	if err != nil {
+		return err
+	}
+
+	return nil
+}
+
+func (module *module) GetPublic(ctx context.Context, orgID valuer.UUID, dashboardID valuer.UUID) (*dashboardtypes.PublicDashboard, error) {
+	_, err := module.licensing.GetActive(ctx, orgID)
+	if err != nil {
+		return nil, errors.New(errors.TypeLicenseUnavailable, errors.CodeLicenseUnavailable, "a valid license is not available").WithAdditional("this feature requires a valid license").WithAdditional(err.Error())
+	}
+
+	storablePublicDashboard, err := module.store.GetPublic(ctx, dashboardID.StringValue())
+	if err != nil {
+		return nil, err
+	}
+
+	return dashboardtypes.NewPublicDashboardFromStorablePublicDashboard(storablePublicDashboard), nil
+}
+
+func (module *module) GetDashboardByPublicID(ctx context.Context, id valuer.UUID) (*dashboardtypes.Dashboard, error) {
+	storableDashboard, err := module.store.GetDashboardByPublicID(ctx, id.StringValue())
+	if err != nil {
+		return nil, err
+	}
+
+	return dashboardtypes.NewDashboardFromStorableDashboard(storableDashboard), nil
+}
+
+func (module *module) GetPublicDashboardSelectorsAndOrg(ctx context.Context, id valuer.UUID, orgs []*types.Organization) ([]authtypes.Selector, valuer.UUID, error) {
+	orgIDs := make([]string, len(orgs))
+	for idx, org := range orgs {
+		orgIDs[idx] = org.ID.StringValue()
+	}
+
+	storableDashboard, err := module.store.GetDashboardByOrgsAndPublicID(ctx, orgIDs, id.StringValue())
+	if err != nil {
+		return nil, valuer.UUID{}, err
+	}
+
+	return []authtypes.Selector{
+		authtypes.MustNewSelector(authtypes.TypeMetaResource, id.StringValue()),
+	}, storableDashboard.OrgID, nil
+}
+
+func (module *module) GetPublicWidgetQueryRange(ctx context.Context, id valuer.UUID, widgetIdx, startTime, endTime uint64) (*querybuildertypesv5.QueryRangeResponse, error) {
+	dashboard, err := module.GetDashboardByPublicID(ctx, id)
+	if err != nil {
+		return nil, err
+	}
+
+	query, err := dashboard.GetWidgetQuery(startTime, endTime, widgetIdx, module.settings.Logger())
+	if err != nil {
+		return nil, err
+	}
+
+	return module.querier.QueryRange(ctx, dashboard.OrgID, query)
+}
+
+func (module *module) UpdatePublic(ctx context.Context, orgID valuer.UUID, publicDashboard *dashboardtypes.PublicDashboard) error {
+	_, err := module.licensing.GetActive(ctx, orgID)
+	if err != nil {
+		return errors.New(errors.TypeLicenseUnavailable, errors.CodeLicenseUnavailable, "a valid license is not available").WithAdditional("this feature requires a valid license").WithAdditional(err.Error())
+	}
+
+	return module.store.UpdatePublic(ctx, dashboardtypes.NewStorablePublicDashboardFromPublicDashboard(publicDashboard))
+}
+
+func (module *module) Delete(ctx context.Context, orgID valuer.UUID, id valuer.UUID) error {
+	dashboard, err := module.Get(ctx, orgID, id)
+	if err != nil {
+		return err
+	}
+
+	if dashboard.Locked {
+		return errors.New(errors.TypeInvalidInput, errors.CodeInvalidInput, "dashboard is locked, please unlock the dashboard to be delete it")
+	}
+
+	err = module.store.RunInTx(ctx, func(ctx context.Context) error {
+		err := module.deletePublic(ctx, orgID, id)
+		if err != nil && !errors.Ast(err, errors.TypeNotFound) {
+			return err
+		}
+
+		err = module.store.Delete(ctx, orgID, id)
+		if err != nil {
+			return err
+		}
+
+		return nil
+	})
+	if err != nil {
+		return err
+	}
+
+	return nil
+}
+
+func (module *module) DeletePublic(ctx context.Context, orgID valuer.UUID, dashboardID valuer.UUID) error {
+	_, err := module.licensing.GetActive(ctx, orgID)
+	if err != nil {
+		return errors.New(errors.TypeLicenseUnavailable, errors.CodeLicenseUnavailable, "a valid license is not available").WithAdditional("this feature requires a valid license").WithAdditional(err.Error())
+	}
+
+	publicDashboard, err := module.GetPublic(ctx, orgID, dashboardID)
+	if err != nil {
+		return err
+	}
+
+	role, err := module.role.GetOrCreate(ctx, roletypes.NewRole(roletypes.AnonymousUserRoleName, roletypes.AnonymousUserRoleDescription, roletypes.RoleTypeManaged.StringValue(), orgID))
+	if err != nil {
+		return err
+	}
+
+	deletionObject := authtypes.MustNewObject(
+		authtypes.Resource{
+			Name: dashboardtypes.TypeableMetaResourcePublicDashboard.Name(),
+			Type: authtypes.TypeMetaResource,
+		},
+		authtypes.MustNewSelector(authtypes.TypeMetaResource, publicDashboard.ID.String()),
+	)
+
+	err = module.role.PatchObjects(ctx, orgID, role.ID, authtypes.RelationRead, nil, []*authtypes.Object{deletionObject})
+	if err != nil {
+		return err
+	}
+
+	err = module.store.DeletePublic(ctx, dashboardID.StringValue())
+	if err != nil {
+		return err
+	}
+
+	return nil
+}
+
+func (module *module) Collect(ctx context.Context, orgID valuer.UUID) (map[string]any, error) {
+	dashboards, err := module.store.List(ctx, orgID)
+	if err != nil {
+		return nil, err
+	}
+
+	publicDashboards, err := module.store.ListPublic(ctx, orgID)
+	if err != nil {
+		return nil, err
+	}
+
+	stats := make(map[string]any)
+	maps.Copy(stats, dashboardtypes.NewStatsFromStorableDashboards(dashboards))
+	maps.Copy(stats, dashboardtypes.NewStatsFromStorablePublicDashboards(publicDashboards))
+	return stats, nil
+}
+
+func (module *module) Create(ctx context.Context, orgID valuer.UUID, createdBy string, creator valuer.UUID, data dashboardtypes.PostableDashboard) (*dashboardtypes.Dashboard, error) {
+	return module.pkgDashboardModule.Create(ctx, orgID, createdBy, creator, data)
+}
+
+func (module *module) Get(ctx context.Context, orgID valuer.UUID, id valuer.UUID) (*dashboardtypes.Dashboard, error) {
+	return module.pkgDashboardModule.Get(ctx, orgID, id)
+}
+
+func (module *module) GetByMetricNames(ctx context.Context, orgID valuer.UUID, metricNames []string) (map[string][]map[string]string, error) {
+	return module.pkgDashboardModule.GetByMetricNames(ctx, orgID, metricNames)
+}
+
+func (module *module) MustGetTypeables() []authtypes.Typeable {
+	return module.pkgDashboardModule.MustGetTypeables()
+}
+
+func (module *module) List(ctx context.Context, orgID valuer.UUID) ([]*dashboardtypes.Dashboard, error) {
+	return module.pkgDashboardModule.List(ctx, orgID)
+}
+
+func (module *module) Update(ctx context.Context, orgID valuer.UUID, id valuer.UUID, updatedBy string, data dashboardtypes.UpdatableDashboard, diff int) (*dashboardtypes.Dashboard, error) {
+	return module.pkgDashboardModule.Update(ctx, orgID, id, updatedBy, data, diff)
+}
+
+func (module *module) LockUnlock(ctx context.Context, orgID valuer.UUID, id valuer.UUID, updatedBy string, role types.Role, lock bool) error {
+	return module.pkgDashboardModule.LockUnlock(ctx, orgID, id, updatedBy, role, lock)
+}
+
+func (module *module) deletePublic(ctx context.Context, orgID valuer.UUID, dashboardID valuer.UUID) error {
+	publicDashboard, err := module.store.GetPublic(ctx, dashboardID.String())
+	if err != nil {
+		return err
+	}
+
+	role, err := module.role.GetOrCreate(ctx, roletypes.NewRole(roletypes.AnonymousUserRoleName, roletypes.AnonymousUserRoleDescription, roletypes.RoleTypeManaged.StringValue(), orgID))
+	if err != nil {
+		return err
+	}
+
+	deletionObject := authtypes.MustNewObject(
+		authtypes.Resource{
+			Name: dashboardtypes.TypeableMetaResourcePublicDashboard.Name(),
+			Type: authtypes.TypeMetaResource,
+		},
+		authtypes.MustNewSelector(authtypes.TypeMetaResource, publicDashboard.ID.String()),
+	)
+
+	err = module.role.PatchObjects(ctx, orgID, role.ID, authtypes.RelationRead, nil, []*authtypes.Object{deletionObject})
+	if err != nil {
+		return err
+	}
+
+	err = module.store.DeletePublic(ctx, dashboardID.StringValue())
+	if err != nil {
+		return err
+	}
+
+	return nil
+}

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

@@ -21,10 +21,6 @@ import (
 	rules "github.com/SigNoz/signoz/pkg/query-service/rules"
 	"github.com/SigNoz/signoz/pkg/queryparser"
 	"github.com/SigNoz/signoz/pkg/signoz"
-	"github.com/SigNoz/signoz/pkg/types"
-	"github.com/SigNoz/signoz/pkg/types/authtypes"
-	"github.com/SigNoz/signoz/pkg/types/dashboardtypes"
-	"github.com/SigNoz/signoz/pkg/valuer"
 	"github.com/SigNoz/signoz/pkg/version"
 	"github.com/gorilla/mux"
 )
@@ -101,39 +97,6 @@ func (ah *APIHandler) RegisterRoutes(router *mux.Router, am *middleware.AuthZ) {
 	router.HandleFunc("/api/v1/billing", am.AdminAccess(ah.getBilling)).Methods(http.MethodGet)
 	router.HandleFunc("/api/v1/portal", am.AdminAccess(ah.LicensingAPI.Portal)).Methods(http.MethodPost)
 
-	// dashboards
-	router.HandleFunc("/api/v1/dashboards/{id}/public", am.AdminAccess(ah.Signoz.Handlers.Dashboard.CreatePublic)).Methods(http.MethodPost)
-	router.HandleFunc("/api/v1/dashboards/{id}/public", am.AdminAccess(ah.Signoz.Handlers.Dashboard.GetPublic)).Methods(http.MethodGet)
-	router.HandleFunc("/api/v1/dashboards/{id}/public", am.AdminAccess(ah.Signoz.Handlers.Dashboard.UpdatePublic)).Methods(http.MethodPut)
-	router.HandleFunc("/api/v1/dashboards/{id}/public", am.AdminAccess(ah.Signoz.Handlers.Dashboard.DeletePublic)).Methods(http.MethodDelete)
-
-	// public access for dashboards
-	router.HandleFunc("/api/v1/public/dashboards/{id}", am.CheckWithoutClaims(
-		ah.Signoz.Handlers.Dashboard.GetPublicData,
-		authtypes.RelationRead, authtypes.RelationRead,
-		dashboardtypes.TypeableMetaResourcePublicDashboard,
-		func(req *http.Request, orgs []*types.Organization) ([]authtypes.Selector, valuer.UUID, error) {
-			id, err := valuer.NewUUID(mux.Vars(req)["id"])
-			if err != nil {
-				return nil, valuer.UUID{}, err
-			}
-
-			return ah.Signoz.Modules.Dashboard.GetPublicDashboardOrgAndSelectors(req.Context(), id, orgs)
-		})).Methods(http.MethodGet)
-
-	router.HandleFunc("/api/v1/public/dashboards/{id}/widgets/{index}/query_range", am.CheckWithoutClaims(
-		ah.Signoz.Handlers.Dashboard.GetPublicWidgetQueryRange,
-		authtypes.RelationRead, authtypes.RelationRead,
-		dashboardtypes.TypeableMetaResourcePublicDashboard,
-		func(req *http.Request, orgs []*types.Organization) ([]authtypes.Selector, valuer.UUID, error) {
-			id, err := valuer.NewUUID(mux.Vars(req)["id"])
-			if err != nil {
-				return nil, valuer.UUID{}, err
-			}
-
-			return ah.Signoz.Modules.Dashboard.GetPublicDashboardOrgAndSelectors(req.Context(), id, orgs)
-		})).Methods(http.MethodGet)
-
 	// v3
 	router.HandleFunc("/api/v3/licenses", am.AdminAccess(ah.LicensingAPI.Activate)).Methods(http.MethodPost)
 	router.HandleFunc("/api/v3/licenses", am.AdminAccess(ah.LicensingAPI.Refresh)).Methods(http.MethodPut)

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

@@ -9,9 +9,10 @@ import (
 	"time"
 
 	"github.com/SigNoz/signoz/ee/query-service/constants"
-	pkgError "github.com/SigNoz/signoz/pkg/errors"
+	"github.com/SigNoz/signoz/pkg/flagger"
 	"github.com/SigNoz/signoz/pkg/http/render"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
+	"github.com/SigNoz/signoz/pkg/types/featuretypes"
 	"github.com/SigNoz/signoz/pkg/types/licensetypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
 	"go.uber.org/zap"
@@ -25,11 +26,7 @@ func (ah *APIHandler) getFeatureFlags(w http.ResponseWriter, r *http.Request) {
 		return
 	}
 
-	orgID, err := valuer.NewUUID(claims.OrgID)
-	if err != nil {
-		render.Error(w, pkgError.Newf(pkgError.TypeInvalidInput, pkgError.CodeInvalidInput, "orgId is invalid"))
-		return
-	}
+	orgID := valuer.MustNewUUID(claims.OrgID)
 
 	featureSet, err := ah.Signoz.Licensing.GetFeatureFlags(r.Context(), orgID)
 	if err != nil {
@@ -59,13 +56,16 @@ func (ah *APIHandler) getFeatureFlags(w http.ResponseWriter, r *http.Request) {
 		}
 	}
 
-	if constants.IsPreferSpanMetrics {
-		for idx, feature := range featureSet {
-			if feature.Name == licensetypes.UseSpanMetrics {
-				featureSet[idx].Active = true
-			}
-		}
-	}
+	evalCtx := featuretypes.NewFlaggerEvaluationContext(orgID)
+	useSpanMetrics := ah.Signoz.Flagger.BooleanOrEmpty(ctx, flagger.FeatureUseSpanMetrics, evalCtx)
+
+	featureSet = append(featureSet, &licensetypes.Feature{
+		Name:       valuer.NewString(flagger.FeatureUseSpanMetrics.String()),
+		Active:     useSpanMetrics,
+		Usage:      0,
+		UsageLimit: -1,
+		Route:      "",
+	})
 
 	if constants.IsDotMetricsEnabled {
 		for idx, feature := range featureSet {

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

@@ -257,18 +257,20 @@ func (aH *APIHandler) queryRangeV5(rw http.ResponseWriter, req *http.Request) {
 			results = append(results, item)
 		}
 
+		// Build step intervals from the anomaly query
+		stepIntervals := make(map[string]uint64)
+		if anomalyQuery.StepInterval.Duration > 0 {
+			stepIntervals[anomalyQuery.Name] = uint64(anomalyQuery.StepInterval.Duration.Seconds())
+		}
+
 		finalResp := &qbtypes.QueryRangeResponse{
 			Type: queryRangeRequest.RequestType,
-			Data: struct {
-				Results []any `json:"results"`
-			}{
+			Data: qbtypes.QueryData{
 				Results: results,
 			},
-			Meta: struct {
-				RowsScanned  uint64 `json:"rowsScanned"`
-				BytesScanned uint64 `json:"bytesScanned"`
-				DurationMS   uint64 `json:"durationMs"`
-			}{},
+			Meta: qbtypes.ExecStats{
+				StepIntervals: stepIntervals,
+			},
 		}
 
 		render.Success(rw, http.StatusOK, finalResp)

ee/query-service/app/server.go

@@ -12,6 +12,7 @@ import (
 	"github.com/SigNoz/signoz/pkg/factory"
 	"github.com/SigNoz/signoz/pkg/queryparser"
 	"github.com/SigNoz/signoz/pkg/ruler/rulestore/sqlrulestore"
+	"github.com/SigNoz/signoz/pkg/types/telemetrytypes"
 	"go.opentelemetry.io/contrib/instrumentation/github.com/gorilla/mux/otelmux"
 	"go.opentelemetry.io/otel/propagation"
 
@@ -104,6 +105,7 @@ func NewServer(config signoz.Config, signoz *signoz.SigNoz) (*Server, error) {
 		signoz.Alertmanager,
 		signoz.SQLStore,
 		signoz.TelemetryStore,
+		signoz.TelemetryMetadataStore,
 		signoz.Prometheus,
 		signoz.Modules.OrgGetter,
 		signoz.Querier,
@@ -355,12 +357,13 @@ func (s *Server) Stop(ctx context.Context) error {
 	return nil
 }
 
-func makeRulesManager(ch baseint.Reader, cache cache.Cache, alertmanager alertmanager.Alertmanager, sqlstore sqlstore.SQLStore, telemetryStore telemetrystore.TelemetryStore, prometheus prometheus.Prometheus, orgGetter organization.Getter, querier querier.Querier, providerSettings factory.ProviderSettings, queryParser queryparser.QueryParser) (*baserules.Manager, error) {
+func makeRulesManager(ch baseint.Reader, cache cache.Cache, alertmanager alertmanager.Alertmanager, sqlstore sqlstore.SQLStore, telemetryStore telemetrystore.TelemetryStore, metadataStore telemetrytypes.MetadataStore, prometheus prometheus.Prometheus, orgGetter organization.Getter, querier querier.Querier, providerSettings factory.ProviderSettings, queryParser queryparser.QueryParser) (*baserules.Manager, error) {
 	ruleStore := sqlrulestore.NewRuleStore(sqlstore, queryParser, providerSettings)
 	maintenanceStore := sqlrulestore.NewMaintenanceStore(sqlstore)
 	// create manager opts
 	managerOpts := &baserules.ManagerOptions{
 		TelemetryStore:      telemetryStore,
+		MetadataStore:       metadataStore,
 		Prometheus:          prometheus,
 		Context:             context.Background(),
 		Logger:              zap.L(),
@@ -376,6 +379,7 @@ func makeRulesManager(ch baseint.Reader, cache cache.Cache, alertmanager alertma
 		RuleStore:           ruleStore,
 		MaintenanceStore:    maintenanceStore,
 		SqlStore:            sqlstore,
+		QueryParser:         queryParser,
 	}
 
 	// create Manager

ee/query-service/constants/constants.go

@@ -23,14 +23,9 @@ func GetOrDefaultEnv(key string, fallback string) string {
 const DotMetricsEnabled = "DOT_METRICS_ENABLED"
 
 var IsDotMetricsEnabled = false
-var IsPreferSpanMetrics = false
 
 func init() {
 	if GetOrDefaultEnv(DotMetricsEnabled, "true") == "true" {
 		IsDotMetricsEnabled = true
 	}
-
-	if GetOrDefaultEnv("USE_SPAN_METRICS", "false") == "true" {
-		IsPreferSpanMetrics = true
-	}
 }

ee/query-service/rules/anomaly.go

@@ -247,7 +247,8 @@ func (r *AnomalyRule) buildAndRunQuery(ctx context.Context, orgID valuer.UUID, t
 			}
 		}
 		results, err := r.Threshold.Eval(*series, r.Unit(), ruletypes.EvalData{
-			ActiveAlerts: r.ActiveAlertsLabelFP(),
+			ActiveAlerts:  r.ActiveAlertsLabelFP(),
+			SendUnmatched: r.ShouldSendUnmatched(),
 		})
 		if err != nil {
 			return nil, err
@@ -291,7 +292,19 @@ func (r *AnomalyRule) buildAndRunQueryV5(ctx context.Context, orgID valuer.UUID,
 	scoresJSON, _ := json.Marshal(queryResult.AnomalyScores)
 	r.logger.InfoContext(ctx, "anomaly scores", "scores", string(scoresJSON))
 
-	for _, series := range queryResult.AnomalyScores {
+	// Filter out new series if newGroupEvalDelay is configured
+	seriesToProcess := queryResult.AnomalyScores
+	if r.ShouldSkipNewGroups() {
+		filteredSeries, filterErr := r.BaseRule.FilterNewSeries(ctx, ts, seriesToProcess)
+		// In case of error we log the error and continue with the original series
+		if filterErr != nil {
+			r.logger.ErrorContext(ctx, "Error filtering new series, ", "error", filterErr, "rule_name", r.Name())
+		} else {
+			seriesToProcess = filteredSeries
+		}
+	}
+
+	for _, series := range seriesToProcess {
 		if r.Condition().RequireMinPoints {
 			if len(series.Points) < r.Condition().RequiredNumPoints {
 				r.logger.InfoContext(ctx, "not enough data points to evaluate series, skipping", "ruleid", r.ID(), "numPoints", len(series.Points), "requiredPoints", r.Condition().RequiredNumPoints)
@@ -299,7 +312,8 @@ func (r *AnomalyRule) buildAndRunQueryV5(ctx context.Context, orgID valuer.UUID,
 			}
 		}
 		results, err := r.Threshold.Eval(*series, r.Unit(), ruletypes.EvalData{
-			ActiveAlerts: r.ActiveAlertsLabelFP(),
+			ActiveAlerts:  r.ActiveAlertsLabelFP(),
+			SendUnmatched: r.ShouldSendUnmatched(),
 		})
 		if err != nil {
 			return nil, err

ee/query-service/rules/manager.go

@@ -37,6 +37,8 @@ func PrepareTaskFunc(opts baserules.PrepareTaskOptions) (baserules.Task, error)
 			opts.SLogger,
 			baserules.WithEvalDelay(opts.ManagerOpts.EvalDelay),
 			baserules.WithSQLStore(opts.SQLStore),
+			baserules.WithQueryParser(opts.ManagerOpts.QueryParser),
+			baserules.WithMetadataStore(opts.ManagerOpts.MetadataStore),
 		)
 
 		if err != nil {
@@ -59,6 +61,8 @@ func PrepareTaskFunc(opts baserules.PrepareTaskOptions) (baserules.Task, error)
 			opts.Reader,
 			opts.ManagerOpts.Prometheus,
 			baserules.WithSQLStore(opts.SQLStore),
+			baserules.WithQueryParser(opts.ManagerOpts.QueryParser),
+			baserules.WithMetadataStore(opts.ManagerOpts.MetadataStore),
 		)
 
 		if err != nil {
@@ -82,6 +86,8 @@ func PrepareTaskFunc(opts baserules.PrepareTaskOptions) (baserules.Task, error)
 			opts.Cache,
 			baserules.WithEvalDelay(opts.ManagerOpts.EvalDelay),
 			baserules.WithSQLStore(opts.SQLStore),
+			baserules.WithQueryParser(opts.ManagerOpts.QueryParser),
+			baserules.WithMetadataStore(opts.ManagerOpts.MetadataStore),
 		)
 		if err != nil {
 			return task, err
@@ -140,6 +146,8 @@ func TestNotification(opts baserules.PrepareTestRuleOptions) (int, *basemodel.Ap
 			baserules.WithSendAlways(),
 			baserules.WithSendUnmatched(),
 			baserules.WithSQLStore(opts.SQLStore),
+			baserules.WithQueryParser(opts.ManagerOpts.QueryParser),
+			baserules.WithMetadataStore(opts.ManagerOpts.MetadataStore),
 		)
 
 		if err != nil {
@@ -160,6 +168,8 @@ func TestNotification(opts baserules.PrepareTestRuleOptions) (int, *basemodel.Ap
 			baserules.WithSendAlways(),
 			baserules.WithSendUnmatched(),
 			baserules.WithSQLStore(opts.SQLStore),
+			baserules.WithQueryParser(opts.ManagerOpts.QueryParser),
+			baserules.WithMetadataStore(opts.ManagerOpts.MetadataStore),
 		)
 
 		if err != nil {
@@ -179,6 +189,8 @@ func TestNotification(opts baserules.PrepareTestRuleOptions) (int, *basemodel.Ap
 			baserules.WithSendAlways(),
 			baserules.WithSendUnmatched(),
 			baserules.WithSQLStore(opts.SQLStore),
+			baserules.WithQueryParser(opts.ManagerOpts.QueryParser),
+			baserules.WithMetadataStore(opts.ManagerOpts.MetadataStore),
 		)
 		if err != nil {
 			zap.L().Error("failed to prepare a new anomaly rule for test", zap.String("name", alertname), zap.Error(err))

ee/query-service/rules/manager_test.go

@@ -0,0 +1,283 @@
+package rules
+
+import (
+	"context"
+	"encoding/json"
+	"math"
+	"strconv"
+	"testing"
+	"time"
+
+	"github.com/SigNoz/signoz/pkg/alertmanager"
+	alertmanagermock "github.com/SigNoz/signoz/pkg/alertmanager/mocks"
+	"github.com/SigNoz/signoz/pkg/instrumentation/instrumentationtest"
+	"github.com/SigNoz/signoz/pkg/prometheus"
+	"github.com/SigNoz/signoz/pkg/prometheus/prometheustest"
+	"github.com/SigNoz/signoz/pkg/query-service/rules"
+	"github.com/SigNoz/signoz/pkg/sqlstore"
+	"github.com/SigNoz/signoz/pkg/sqlstore/sqlstoretest"
+	"github.com/SigNoz/signoz/pkg/telemetrystore"
+	"github.com/SigNoz/signoz/pkg/telemetrystore/telemetrystoretest"
+	"github.com/SigNoz/signoz/pkg/types/alertmanagertypes"
+	"github.com/SigNoz/signoz/pkg/types/metrictypes"
+	"github.com/SigNoz/signoz/pkg/valuer"
+	"github.com/stretchr/testify/assert"
+	"github.com/stretchr/testify/mock"
+	"github.com/stretchr/testify/require"
+
+	cmock "github.com/srikanthccv/ClickHouse-go-mock"
+)
+
+func TestManager_TestNotification_SendUnmatched_ThresholdRule(t *testing.T) {
+	target := 10.0
+	recovery := 5.0
+
+	for _, tc := range rules.TcTestNotiSendUnmatchedThresholdRule {
+		t.Run(tc.Name, func(t *testing.T) {
+			rule := rules.ThresholdRuleAtLeastOnceValueAbove(target, &recovery)
+
+			// Marshal rule to JSON as TestNotification expects
+			ruleBytes, err := json.Marshal(rule)
+			require.NoError(t, err)
+
+			orgID := valuer.GenerateUUID()
+
+			// for saving temp alerts that are triggered via TestNotification
+			triggeredTestAlerts := []map[*alertmanagertypes.PostableAlert][]string{}
+
+			// Create manager using test factory with hooks
+			mgr := rules.NewTestManager(t, &rules.TestManagerOptions{
+				AlertmanagerHook: func(am alertmanager.Alertmanager) {
+					fAlert := am.(*alertmanagermock.MockAlertmanager)
+					// mock set notification config
+					fAlert.On("SetNotificationConfig", mock.Anything, mock.Anything, mock.Anything, mock.Anything).Return(nil)
+					// for saving temp alerts that are triggered via TestNotification
+					if tc.ExpectAlerts > 0 {
+						fAlert.On("TestAlert", mock.Anything, mock.Anything, mock.Anything, mock.Anything).Run(func(args mock.Arguments) {
+							triggeredTestAlerts = append(triggeredTestAlerts, args.Get(3).(map[*alertmanagertypes.PostableAlert][]string))
+						}).Return(nil).Times(tc.ExpectAlerts)
+					}
+				},
+				ManagerOptionsHook: func(opts *rules.ManagerOptions) {
+					opts.PrepareTestRuleFunc = TestNotification
+				},
+				SqlStoreHook: func(store sqlstore.SQLStore) {
+					mockStore := store.(*sqlstoretest.Provider)
+					// Mock the organizations query that SendAlerts makes
+					// Bun generates: SELECT id FROM organizations LIMIT 1 (or SELECT "id" FROM "organizations" LIMIT 1)
+					orgRows := mockStore.Mock().NewRows([]string{"id"}).AddRow(orgID.StringValue())
+					// Match bun's generated query pattern - bun may quote identifiers
+					mockStore.Mock().ExpectQuery("SELECT (.+) FROM (.+)organizations(.+) LIMIT (.+)").WillReturnRows(orgRows)
+				},
+				TelemetryStoreHook: func(store telemetrystore.TelemetryStore) {
+					telemetryStore := store.(*telemetrystoretest.Provider)
+					// Set up mock data for telemetry store
+					cols := make([]cmock.ColumnType, 0)
+					cols = append(cols, cmock.ColumnType{Name: "value", Type: "Float64"})
+					cols = append(cols, cmock.ColumnType{Name: "attr", Type: "String"})
+					cols = append(cols, cmock.ColumnType{Name: "ts", Type: "DateTime"})
+
+					alertDataRows := cmock.NewRows(cols, tc.Values)
+
+					mock := telemetryStore.Mock()
+
+					// Generate query arguments for the metric query
+					evalTime := time.Now().UTC()
+					evalWindow := 5 * time.Minute
+					evalDelay := time.Duration(0)
+					queryArgs := rules.GenerateMetricQueryCHArgs(
+						evalTime,
+						evalWindow,
+						evalDelay,
+						"probe_success",
+						metrictypes.Unspecified,
+					)
+
+					mock.ExpectQuery("*WITH __temporal_aggregation_cte*").
+						WithArgs(queryArgs...).
+						WillReturnRows(alertDataRows)
+				},
+			})
+
+			count, apiErr := mgr.TestNotification(context.Background(), orgID, string(ruleBytes))
+			if apiErr != nil {
+				t.Logf("TestNotification error: %v, type: %s", apiErr.Err, apiErr.Typ)
+			}
+			require.Nil(t, apiErr)
+			assert.Equal(t, tc.ExpectAlerts, count)
+
+			if tc.ExpectAlerts > 0 {
+				// check if the alert has been triggered
+				require.Len(t, triggeredTestAlerts, 1)
+				var gotAlerts []*alertmanagertypes.PostableAlert
+				for a := range triggeredTestAlerts[0] {
+					gotAlerts = append(gotAlerts, a)
+				}
+				require.Len(t, gotAlerts, tc.ExpectAlerts)
+				// check if the alert has triggered with correct threshold value
+				if tc.ExpectValue != 0 {
+					assert.Equal(t, strconv.FormatFloat(tc.ExpectValue, 'f', -1, 64), gotAlerts[0].Annotations["value"])
+				}
+			} else {
+				// check if no alerts have been triggered
+				assert.Empty(t, triggeredTestAlerts)
+			}
+		})
+	}
+}
+
+func TestManager_TestNotification_SendUnmatched_PromRule(t *testing.T) {
+	target := 10.0
+
+	for _, tc := range rules.TcTestNotificationSendUnmatchedPromRule {
+		t.Run(tc.Name, func(t *testing.T) {
+			// Capture base time once per test case to ensure consistent timestamps
+			baseTime := time.Now().UTC()
+
+			rule := rules.BuildPromAtLeastOnceValueAbove(target, nil)
+
+			// Marshal rule to JSON as TestNotification expects
+			ruleBytes, err := json.Marshal(rule)
+			require.NoError(t, err)
+
+			orgID := valuer.GenerateUUID()
+
+			// for saving temp alerts that are triggered via TestNotification
+			triggeredTestAlerts := []map[*alertmanagertypes.PostableAlert][]string{}
+
+			// Variable to store promProvider for cleanup
+			var promProvider *prometheustest.Provider
+
+			// Create manager using test factory with hooks
+			mgr := rules.NewTestManager(t, &rules.TestManagerOptions{
+				AlertmanagerHook: func(am alertmanager.Alertmanager) {
+					mockAM := am.(*alertmanagermock.MockAlertmanager)
+					// mock set notification config
+					mockAM.On("SetNotificationConfig", mock.Anything, mock.Anything, mock.Anything, mock.Anything).Return(nil)
+					// for saving temp alerts that are triggered via TestNotification
+					if tc.ExpectAlerts > 0 {
+						mockAM.On("TestAlert", mock.Anything, mock.Anything, mock.Anything, mock.Anything).Run(func(args mock.Arguments) {
+							triggeredTestAlerts = append(triggeredTestAlerts, args.Get(3).(map[*alertmanagertypes.PostableAlert][]string))
+						}).Return(nil).Times(tc.ExpectAlerts)
+					}
+				},
+				SqlStoreHook: func(store sqlstore.SQLStore) {
+					mockStore := store.(*sqlstoretest.Provider)
+					// Mock the organizations query that SendAlerts makes
+					orgRows := mockStore.Mock().NewRows([]string{"id"}).AddRow(orgID.StringValue())
+					mockStore.Mock().ExpectQuery("SELECT (.+) FROM (.+)organizations(.+) LIMIT (.+)").WillReturnRows(orgRows)
+				},
+				TelemetryStoreHook: func(store telemetrystore.TelemetryStore) {
+					mockStore := store.(*telemetrystoretest.Provider)
+
+					// Set up Prometheus-specific mock data
+					// Fingerprint columns for Prometheus queries
+					fingerprintCols := []cmock.ColumnType{
+						{Name: "fingerprint", Type: "UInt64"},
+						{Name: "any(labels)", Type: "String"},
+					}
+
+					// Samples columns for Prometheus queries
+					samplesCols := []cmock.ColumnType{
+						{Name: "metric_name", Type: "String"},
+						{Name: "fingerprint", Type: "UInt64"},
+						{Name: "unix_milli", Type: "Int64"},
+						{Name: "value", Type: "Float64"},
+						{Name: "flags", Type: "UInt32"},
+					}
+
+					// Calculate query time range similar to Prometheus rule tests
+					// TestNotification uses time.Now().UTC() for evaluation
+					// We calculate the query window based on current time to match what the actual evaluation will use
+					evalTime := baseTime
+					evalWindowMs := int64(5 * 60 * 1000) // 5 minutes in ms
+					evalTimeMs := evalTime.UnixMilli()
+					queryStart := ((evalTimeMs-2*evalWindowMs)/60000)*60000 + 1 // truncate to minute + 1ms
+					queryEnd := (evalTimeMs / 60000) * 60000                    // truncate to minute
+
+					// Create fingerprint data
+					fingerprint := uint64(12345)
+					labelsJSON := `{"__name__":"test_metric"}`
+					fingerprintData := [][]interface{}{
+						{fingerprint, labelsJSON},
+					}
+					fingerprintRows := cmock.NewRows(fingerprintCols, fingerprintData)
+
+					// Create samples data from test case values, calculating timestamps relative to baseTime
+					validSamplesData := make([][]interface{}, 0)
+					for _, v := range tc.Values {
+						// Skip NaN and Inf values in the samples data
+						if math.IsNaN(v.Value) || math.IsInf(v.Value, 0) {
+							continue
+						}
+						// Calculate timestamp relative to baseTime
+						sampleTimestamp := baseTime.Add(v.Offset).UnixMilli()
+						validSamplesData = append(validSamplesData, []interface{}{
+							"test_metric",
+							fingerprint,
+							sampleTimestamp,
+							v.Value,
+							uint32(0), // flags - 0 means normal value
+						})
+					}
+					samplesRows := cmock.NewRows(samplesCols, validSamplesData)
+
+					mock := mockStore.Mock()
+
+					// Mock the fingerprint query (for Prometheus label matching)
+					mock.ExpectQuery("SELECT fingerprint, any").
+						WithArgs("test_metric", "__name__", "test_metric").
+						WillReturnRows(fingerprintRows)
+
+					// Mock the samples query (for Prometheus metric data)
+					mock.ExpectQuery("SELECT metric_name, fingerprint, unix_milli").
+						WithArgs(
+							"test_metric",
+							"test_metric",
+							"__name__",
+							"test_metric",
+							queryStart,
+							queryEnd,
+						).
+						WillReturnRows(samplesRows)
+
+					// Create Prometheus provider for this test
+					promProvider = prometheustest.New(context.Background(), instrumentationtest.New().ToProviderSettings(), prometheus.Config{}, store)
+				},
+				ManagerOptionsHook: func(opts *rules.ManagerOptions) {
+					// Set Prometheus provider for PromQL queries
+					if promProvider != nil {
+						opts.Prometheus = promProvider
+					}
+					opts.PrepareTestRuleFunc = TestNotification
+				},
+			})
+
+			count, apiErr := mgr.TestNotification(context.Background(), orgID, string(ruleBytes))
+			if apiErr != nil {
+				t.Logf("TestNotification error: %v, type: %s", apiErr.Err, apiErr.Typ)
+			}
+			require.Nil(t, apiErr)
+			assert.Equal(t, tc.ExpectAlerts, count)
+
+			if tc.ExpectAlerts > 0 {
+				// check if the alert has been triggered
+				require.Len(t, triggeredTestAlerts, 1)
+				var gotAlerts []*alertmanagertypes.PostableAlert
+				for a := range triggeredTestAlerts[0] {
+					gotAlerts = append(gotAlerts, a)
+				}
+				require.Len(t, gotAlerts, tc.ExpectAlerts)
+				// check if the alert has triggered with correct threshold value
+				if tc.ExpectValue != 0 && !math.IsNaN(tc.ExpectValue) && !math.IsInf(tc.ExpectValue, 0) {
+					assert.Equal(t, strconv.FormatFloat(tc.ExpectValue, 'f', -1, 64), gotAlerts[0].Annotations["value"])
+				}
+			} else {
+				// check if no alerts have been triggered
+				assert.Empty(t, triggeredTestAlerts)
+			}
+
+			promProvider.Close()
+		})
+	}
+}

frontend/.eslintrc.js

@@ -7,8 +7,6 @@ module.exports = {
 		'jest/globals': true,
 	},
 	extends: [
-		'airbnb',
-		'airbnb-typescript',
 		'eslint:recommended',
 		'plugin:react/recommended',
 		'plugin:@typescript-eslint/recommended',
@@ -35,6 +33,7 @@ module.exports = {
 		'react-hooks',
 		'prettier',
 		'jest',
+		'jsx-a11y',
 	],
 	settings: {
 		react: {
@@ -72,9 +71,6 @@ module.exports = {
 		'react-hooks/rules-of-hooks': 'error',
 		'react-hooks/exhaustive-deps': 'error',
 
-		// airbnb
-		'no-underscore-dangle': 'off',
-		'no-console': 'off',
 		'import/prefer-default-export': 'off',
 		'import/extensions': [
 			'error',
@@ -87,6 +83,9 @@ module.exports = {
 			},
 		],
 		'import/no-extraneous-dependencies': ['error', { devDependencies: true }],
+		// Disabled because TypeScript already handles this check more accurately,
+		// and the rule has false positives with type-only imports (e.g., TooltipProps from antd)
+		'import/named': 'off',
 		'no-plusplus': 'off',
 		'jsx-a11y/label-has-associated-control': [
 			'error',
@@ -104,7 +103,10 @@ module.exports = {
 				},
 			},
 		],
-		'@typescript-eslint/no-unused-vars': 'error',
+		// Allow empty functions for mocks, default context values, and noop callbacks
+		'@typescript-eslint/no-empty-function': 'off',
+		// Allow underscore prefix for intentionally unused variables (e.g., const { id: _id, ...rest } = props)
+		'@typescript-eslint/no-unused-vars': 'warn',
 		'func-style': ['error', 'declaration', { allowArrowFunctions: true }],
 		'arrow-body-style': ['error', 'as-needed'],
 
@@ -120,5 +122,6 @@ module.exports = {
 				usePrettierrc: true,
 			},
 		],
+		'react/jsx-props-no-spreading': 'off',
 	},
 };

frontend/.prettierrc.json

@@ -4,5 +4,14 @@
 	"tabWidth": 1,
 	"singleQuote": true,
 	"jsxSingleQuote": false,
-	"semi": true
+	"semi": true,
+	"printWidth": 80,
+	"bracketSpacing": true,
+	"bracketSameLine": false,
+	"arrowParens": "always",
+	"endOfLine": "lf",
+	"quoteProps": "as-needed",
+	"proseWrap": "preserve",
+	"htmlWhitespaceSensitivity": "css",
+	"embeddedLanguageFormatting": "auto"
 }

frontend/.vscode/settings.json

@@ -0,0 +1,8 @@
+{
+	"editor.formatOnSave": true,
+	"editor.defaultFormatter": "esbenp.prettier-vscode",
+	"editor.codeActionsOnSave": {
+		"source.fixAll.eslint": "explicit"
+	},
+	"prettier.requireConfig": true
+}

frontend/CONTRIBUTIONS.md

@@ -34,12 +34,18 @@ Embrace the spirit of collaboration and contribute to the success of our open-so
 ### Linting and Setup
 
 - It is crucial to refrain from disabling ESLint and TypeScript errors within the project. If there is a specific rule that needs to be disabled, provide a clear and justified explanation for doing so. Maintaining the integrity of the linting and type-checking processes ensures code quality and consistency throughout the codebase.
-- In our project, we rely on several essential ESLint plugins, namely:
-  - [plugin:@typescript-eslint](https://typescript-eslint.io/rules/)
-  - [airbnb styleguide](https://github.com/airbnb/javascript)
-  - [plugin:sonarjs](https://github.com/SonarSource/eslint-plugin-sonarjs)
+- In our project, we rely on several essential ESLint plugins and configurations:
 
-    To ensure compliance with our coding standards and best practices, we encourage you to refer to the documentation of these plugins. Familiarizing yourself with the ESLint rules they provide will help maintain code quality and consistency throughout the project.
+  - [eslint:recommended](https://eslint.org/docs/latest/rules/) - Core ESLint rules for JavaScript best practices
+  - [plugin:@typescript-eslint](https://typescript-eslint.io/rules/) - TypeScript-specific linting rules
+  - [plugin:react](https://github.com/jsx-eslint/eslint-plugin-react) - React best practices and patterns
+  - [plugin:react-hooks](https://www.npmjs.com/package/eslint-plugin-react-hooks) - Rules of Hooks enforcement
+  - [plugin:sonarjs](https://github.com/SonarSource/eslint-plugin-sonarjs) - Code quality and complexity analysis
+  - [plugin:prettier](https://github.com/prettier/eslint-plugin-prettier) - Code formatting via Prettier
+  - [simple-import-sort](https://github.com/lydell/eslint-plugin-simple-import-sort) - Automatic import organization
+  - [plugin:jsx-a11y](https://github.com/jsx-eslint/eslint-plugin-jsx-a11y) - Accessibility rules for JSX elements
+
+  To ensure compliance with our coding standards and best practices, we encourage you to refer to the documentation of these plugins. Familiarizing yourself with the ESLint rules they provide will help maintain code quality and consistency throughout the project.
 
 ### Naming Conventions
 

frontend/package.json

@@ -219,16 +219,11 @@
 		"compression-webpack-plugin": "9.0.0",
 		"copy-webpack-plugin": "^11.0.0",
 		"eslint": "^7.32.0",
-		"eslint-config-airbnb": "^19.0.4",
-		"eslint-config-airbnb-typescript": "^16.1.4",
 		"eslint-config-prettier": "^8.3.0",
-		"eslint-config-standard": "^16.0.3",
 		"eslint-plugin-import": "^2.28.1",
 		"eslint-plugin-jest": "^26.9.0",
 		"eslint-plugin-jsx-a11y": "^6.5.1",
-		"eslint-plugin-node": "^11.1.0",
 		"eslint-plugin-prettier": "^4.0.0",
-		"eslint-plugin-promise": "^5.1.0",
 		"eslint-plugin-react": "^7.24.0",
 		"eslint-plugin-react-hooks": "^4.3.0",
 		"eslint-plugin-simple-import-sort": "^7.0.0",

frontend/public/Logos/agno.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
+  <image width="100" height="100" href="data:image/webp;base64,UklGRqQEAABXRUJQVlA4IJgEAACQJQCdASrhAOEAPm02mUikIyKhJVZ4CIANiWVu4XPw+dx/zz8Y9kq6J+Kv5T8nN4H6MM2Hod6xffvuy+jnoX8wD9Zekj5gP2S/YDsAegB+ovWUeg9/GfPP/cn4dP2/9JnVbPMU2BWP/6ShYsB/INjyXNw88GLWEjqTk7r3B1Jyd0Q60mjXFTuiHUwvdoU9QiTOwXp8O6KdYSPcXtgV/YIjrUu+9aTZYQwhSBOiHuLpesMKhiEeAz91s6AFmAINNYJeBpyuf9KScX17NiZWEjlmJ+PsBWx4Be/O9Vng220j2g97IwDP4CHt7ScFK+ikuWNp4z1G60XIv5OXis+Sp/e/QkOjbE0qKut3VrL3hQfSVuuLp2XQBvxPw8eyiMbE05kQ6k5O6Ml23DSy92Ix+s9tw0svcgAA/Jba8JQ+0uNQuBewKWqirnyDRkjzUXXOeoNxj0dA3QpklBe8QAAMu8geavhwzfTJ2OUqOrwpg8PXz6sktEQLDnTlNclju/V9f4Ny3CgDYwBvljjNaFA8PR18BGAyzmVuHsa0hgskCkgbT6nZi/Vr9AXTc/UZtUS8Z3pKg4hMjWCXdMx0JCsu6v+8ghZmHf/y0VcGbDiugOy3WH36R3zSOIJh1NjhcNYlKfWilZD5ohEfCaTn/D4u3kgC/kLeLF06X5oe/zKySrWWEPQe965rTf4pcEGBZQGkauwtkLPJWVcHoNzJshb6gdVqs0hye7fI5nFTsbJaZmqz8kXeMSEV4zhApVaDyl3Q2P/ATfChzCP87kOBxeVrhSkNkMWS/e1j58dVzpyTubHOt04Z2NKpTlEjBganrkKIYvtuYWGoJWEmtMVtM9TuzNWa3jKX3kWc9zWmQHHawveaHnJn4HJXQwbTC4ZIlxa5el1b8GgqUXzOeF9LIWA3eb7i34/Q3GXZcbs5DLsukl03KclLo5hW5uf04JjGQR5NXHd8as68c3K9Kze3147QuIn1ytP7uE9us639xDuAiHDPr9JiVn62mv80Q2ErNLD+d6VYdhm6J2PCLY5/9mHTExTnIBzRtNoErP6qmMiCXmSM4sX7s14u3yhaE+dVjX1xtxUWtFjH0GWCN/1JNmjtElHq+FjqPWse7tIMvkKm7xFBgoM8yUJGxY+HviWNkOHipLPh7RJ3KehnEZTPIhR5GHlhlATLx+QUQ61+WwhffiT45KPRiK9v8Cd+1YShd6ZGqFSqsxt4FuMSvpMUB+Rd51pUUPuwXHzpXcyz6BXkWw0Mi3jbfH3kxet2Bsqzu0XWmJ2Oj097qP4ayirQzJewKHo8LS0cFG73Lvox2tmD7ZhuRRVmGjyz62sUMVDSzIUN2BHghed2IdUHVnAkof5DrdZIx+umeHp2XSityHdbTywo7r1+ve5+vPk8hhxhISBjbK+qikfPVnhJ8R/L7KUUqchh3AGKVmRGVgXh09MDaEiW/qqPYzP+MBiKfM5eTcHuGLymyFvT2em/o58zIcp7nKtDr90BsurnuOA0XaH3ZPDpSFAUN3HL9Zj7mpQtcFMfpCaC1VMv0l2UvY8xo/6qYAG6UEbsogAAAAA=" />
+</svg>

frontend/public/Logos/inkeep.svg

@@ -0,0 +1,4 @@
+<svg width="361" height="224" viewBox="0 0 361 224" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M67.3465 4.3208C62.5234 4.3208 58.0667 6.89389 55.6552 11.0708L1.80865 104.336C-0.602889 108.513 -0.602883 113.659 1.80866 117.836L55.6552 211.101C58.0667 215.277 62.5234 217.851 67.3465 217.851H175.039C179.863 217.851 184.319 215.277 186.731 211.101L240.577 117.836C242.989 113.659 242.989 108.513 240.577 104.336L186.731 11.0708C184.319 6.89388 179.863 4.3208 175.039 4.3208L67.3465 4.3208Z" fill="#D5E5FF"/>
+<path d="M287.008 2.29488C319.287 10.6012 315.609 28.9193 328.995 66.1793C337.583 90.084 379.104 119.725 341.16 177.344C329.837 194.54 293.425 214.941 267.079 220.6C209.035 232.875 174.834 205.018 144.494 159.09C121.73 124.349 129.773 74.335 164.299 49.7761C197.018 26.5653 244.576 -9.45146 287.008 2.29488Z" fill="#69A3FF"/>
+</svg>

frontend/public/Logos/livekit.svg

@@ -0,0 +1 @@
+<svg height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>LiveKit</title><path d="M14 10h-4v4h4v-4zM18 6h-4v4.001h4v-4zM18 14h-4v4h4v-4zM22 2h-4v4h4V2zM22 18h-4v4h4v-4z" fill="#1FD5F9"></path><path d="M6 18V2H2v20h12v-4H6z" fill="#fff"></path></svg>

frontend/public/Logos/pipecat.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="280" height="280">
+<path d="M0 0 C92.4 0 184.8 0 280 0 C280 92.4 280 184.8 280 280 C187.6 280 95.2 280 0 280 C0 187.6 0 95.2 0 0 Z " fill="#FEFEFE" transform="translate(0,0)"/>
+<path d="M0 0 C4.32048747 1.62223107 6.55486576 4.28030505 9.52734375 7.72265625 C10.09864014 8.36162842 10.66993652 9.00060059 11.25854492 9.65893555 C12.88271439 11.48112369 14.48833898 13.3180548 16.08984375 15.16015625 C16.78851563 15.9490625 17.4871875 16.73796875 18.20703125 17.55078125 C18.76648438 18.185 19.3259375 18.81921875 19.90234375 19.47265625 C20.40076782 20.02429947 20.89919189 20.57594269 21.41271973 21.14430237 C23.08984375 23.16015625 23.08984375 23.16015625 24.49304199 25.45811462 C27.47252811 29.81453108 29.71272364 31.88015293 34.97558594 32.95022583 C39.9205962 33.32069047 44.85650654 33.17298906 49.80859375 33.0390625 C51.63558812 33.02225785 53.46262328 33.00945545 55.28967285 33.00047302 C60.07802047 32.96625339 64.86387621 32.87797816 69.65124512 32.77813721 C74.54449761 32.68575224 79.43815637 32.64489784 84.33203125 32.59960938 C93.91905835 32.50334235 103.50424315 32.34991947 113.08984375 32.16015625 C113.38173584 31.5460791 113.67362793 30.93200195 113.97436523 30.29931641 C115.36028726 27.64152503 117.11916807 25.73686678 119.15234375 23.53515625 C119.95414063 22.65988281 120.7559375 21.78460938 121.58203125 20.8828125 C122.82339844 19.53509766 122.82339844 19.53509766 124.08984375 18.16015625 C125.6549797 16.43337512 127.21756353 14.70427667 128.77734375 12.97265625 C129.51984375 12.15539062 130.26234375 11.338125 131.02734375 10.49609375 C132.86324628 8.41679505 134.56732791 6.27970771 136.27734375 4.09765625 C138.30731891 1.73122112 139.11199786 1.15156588 142.15234375 -0.02734375 C146.07530165 0.22305782 147.37097322 1.35790253 150.08984375 4.16015625 C150.69111633 7.33660889 150.69111633 7.33660889 150.6574707 11.13183594 C150.6585659 12.17146736 150.6585659 12.17146736 150.65968323 13.23210144 C150.65620792 15.51621591 150.61735535 17.79827448 150.578125 20.08203125 C150.56879653 21.66814052 150.56168057 23.25426423 150.5566864 24.84039307 C150.53761889 29.00990759 150.48852138 33.17854766 150.4331665 37.34771729 C150.381968 41.60408702 150.35917115 45.86059842 150.33398438 50.1171875 C150.28040107 58.46528927 150.19246835 66.81251315 150.08984375 75.16015625 C158.00984375 75.16015625 165.92984375 75.16015625 174.08984375 75.16015625 C174.08984375 80.11015625 174.08984375 85.06015625 174.08984375 90.16015625 C161.54984375 90.16015625 149.00984375 90.16015625 136.08984375 90.16015625 C135.75984375 70.03015625 135.42984375 49.90015625 135.08984375 29.16015625 C126.87476058 37.9752561 126.87476058 37.9752561 119.08984375 47.16015625 C115.79274781 48.80870422 112.12209411 48.32562514 108.49682617 48.3371582 C107.60723709 48.3437294 106.71764801 48.3503006 105.80110168 48.35707092 C102.84917116 48.37682562 99.89729154 48.38847111 96.9453125 48.3984375 C95.43493125 48.40455079 95.43493125 48.40455079 93.89403725 48.41078758 C88.56502105 48.4316572 83.23603067 48.44595528 77.90698242 48.45532227 C72.39874211 48.46639094 66.89090531 48.50079372 61.38280773 48.54049397 C57.15089662 48.56662113 52.91908223 48.57501062 48.68709755 48.57860374 C46.6565001 48.58347949 44.62590725 48.59512145 42.59538841 48.61364174 C39.75361399 48.63795098 36.91289116 48.63708321 34.07104492 48.63012695 C33.23189545 48.64293701 32.39274597 48.65574707 31.52816772 48.66894531 C27.52364757 48.63320802 25.5843855 48.48069887 22.14155579 46.24919128 C20.24828704 44.32148181 18.40141019 42.40710858 16.65234375 40.34765625 C16.11738281 39.72246094 15.58242187 39.09726563 15.03125 38.453125 C14.39058594 37.69644531 13.74992187 36.93976563 13.08984375 36.16015625 C11.10984375 33.85015625 9.12984375 31.54015625 7.08984375 29.16015625 C6.75984375 49.29015625 6.42984375 69.42015625 6.08984375 90.16015625 C-6.45015625 90.16015625 -18.99015625 90.16015625 -31.91015625 90.16015625 C-31.91015625 85.21015625 -31.91015625 80.26015625 -31.91015625 75.16015625 C-23.99015625 75.16015625 -16.07015625 75.16015625 -7.91015625 75.16015625 C-7.93634033 73.03030273 -7.96252441 70.90044922 -7.98950195 68.70605469 C-8.07234699 61.66938098 -8.1275781 54.63268573 -8.16921711 47.59565353 C-8.19531224 43.32896888 -8.23070773 39.06278382 -8.28735352 34.79638672 C-8.34167786 30.67907045 -8.37157742 26.5622347 -8.38454247 22.44458771 C-8.39378174 20.87364384 -8.41182439 19.30272631 -8.43880653 17.731987 C-8.47510571 15.53135855 -8.48010172 13.33271556 -8.4777832 11.13183594 C-8.48888626 9.87941101 -8.49998932 8.62698608 -8.51142883 7.33660889 C-7.91015625 4.16015625 -7.91015625 4.16015625 -5.55656433 1.73443604 C-2.91015625 0.16015625 -2.91015625 0.16015625 0 0 Z " fill="#000000" transform="translate(68.91015625,79.83984375)"/>
+<path d="M0 0 C12.54 0 25.08 0 38 0 C38 4.95 38 9.9 38 15 C25.46 15 12.92 15 0 15 C0 10.05 0 5.1 0 0 Z " fill="#000000" transform="translate(205,185)"/>
+<path d="M0 0 C12.54 0 25.08 0 38 0 C38 4.95 38 9.9 38 15 C25.46 15 12.92 15 0 15 C0 10.05 0 5.1 0 0 Z " fill="#000000" transform="translate(37,185)"/>
+<path d="M0 0 C3.5386994 1.65139305 4.81070153 2.71605229 7 6 C7.34061873 9.0169088 7.57212107 11.09407815 7 14 C4.05423033 17.64345196 1.88105815 19.79099354 -2.8125 20.3125 C-6.7307645 19.92835642 -8.21293267 18.70743683 -11 16 C-12.74330022 12.51339956 -12.5706106 8.80407065 -12 5 C-8.64770496 0.02234979 -5.86333845 -0.83761978 0 0 Z " fill="#050505" transform="translate(109,150)"/>
+<path d="M0 0 C3.09459236 2.57882697 4.55423234 4.12558351 5.4765625 8.00390625 C5.75079474 11.80707441 5.1142302 13.83730851 2.9375 16.9375 C-0.57823396 19.40599406 -2.71383323 20 -7 20 C-10.57387602 18.41161066 -11.81089572 17.28365642 -14 14 C-14.67226891 7.05322129 -14.67226891 7.05322129 -12.125 3.0625 C-8.53966618 -0.41738282 -4.85970455 -0.95707375 0 0 Z " fill="#040404" transform="translate(178,150)"/>
+</svg>

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

@@ -45,6 +45,7 @@
 	"DEFAULT": "Open source Observability Platform | SigNoz",
 	"ALERT_HISTORY": "SigNoz | Alert Rule History",
 	"ALERT_OVERVIEW": "SigNoz | Alert Rule Overview",
+	"ALERT_TYPE_SELECTION": "SigNoz | Select Alert Type",
 	"INFRASTRUCTURE_MONITORING_HOSTS": "SigNoz | Infra Monitoring",
 	"INFRASTRUCTURE_MONITORING_KUBERNETES": "SigNoz | Infra Monitoring",
 	"METER_EXPLORER": "SigNoz | Meter Explorer",

frontend/public/svgs/barber-pool.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="none" viewBox="0 0 32 32"><path fill="#fff" d="m9.05 20.616 13.968-.178-.06-9.283-14.417.178z"/><path fill="#d80d1a" d="m10.165 20.736-1.302-2.253.127-5.209 5.133 7.491z"/><path fill="#1d86fa" d="m16.72 20.616-6.416-9.401 4.298.06 6.536 9.372z"/><path fill="#d80d1a" d="m22.958 19.125-5.58-7.88 4.118.12 2.12 2.956z"/><path fill="#a1d2d6" d="m8.75 11.722 14.208-.09-.098-.86-14.14.114zM8.99 21.214l14.237-.18-.329-.864-14.237.177z"/><path fill="#c8c8c8" d="M22.772 21.163c.122.147.882.175.882.175s.444.825 1.41.707c.865-.106 1.2-.829 1.2-.829s1.463-.338 2.259-1.464c.846-1.2.882-2.383.882-4.076 0-1.836-.143-3.088-1.076-4.076-1.073-1.134-2.186-1.218-2.186-1.218s-.39-.654-1.271-.636c-.883.018-1.218.74-1.218.74s-.704.151-.882.282c-.091.067-.067 2.703-.054 5.294.012 2.5-.042 4.988.054 5.1"/><path fill="#858585" d="M28.541 16.538c.353.018.345-1.851.036-3.229-.354-1.57-1.694-2.082-1.8-1.993s-.071 1.675.017 1.764c.09.09.918.494 1.2 1.182.283.69.278 2.262.547 2.276M25.299 21.99l-.056-12.213s.258.04.509.207c.242.162.389.395.389.395l.127 10.828s-.176.325-.35.465c-.381.309-.62.318-.62.318"/><path fill="#e1e0e0" d="m24.692 22.043-.157-12.255s-.323.04-.565.258c-.204.182-.318.44-.318.44l.107 11.01s.164.223.353.354c.23.157.58.193.58.193"/><path fill="#c8c8c8" d="M9.13 21.32c.158-.142.036-10.216-.053-10.392-.089-.175-.829-1.069-2.01-1-1.167.069-1.536.876-1.536.876s-1.169.155-2.065 1.5c-.635.954-.82 2.19-.806 3.74.015 1.712.12 3.319 1.142 4.341.982.982 1.94 1.022 1.94 1.022s.267.87 1.573.87c1.289.002 1.816-.956 1.816-.956"/><path fill="#858585" d="M7.548 22.274s-.373-1.907-.427-6.158.256-6.186.256-6.186.258-.017.504.067c.276.093.458.24.458.24s-.244 3.656-.227 5.879c.018 2.222.37 5.85.37 5.85s-.265.153-.423.206c-.164.051-.51.102-.51.102"/><path fill="#e1e0e0" d="M6.858 22.234s-.48-2.45-.533-6.032.157-6.163.157-6.163-.422.127-.633.322c-.21.196-.318.44-.318.44s-.122 3.359-.14 5.39c-.02 2.454.351 5.216.351 5.216s.085.296.345.496c.367.285.771.331.771.331"/><path fill="#fff" d="M6.1 16.763c.19 0 .3 1.251.38 2.58.045.744.411 2.058-.08 2.058-.49 0-.584-.476-.617-2.09-.034-1.612.064-2.548.317-2.548M3.173 16.667c.12-.042.35.634.903 1.156.39.369.76.49.855.744.096.254.222 1.613-.062 1.631-.396.023-1.022-.262-1.393-.933-.59-1.062-.525-2.518-.303-2.598"/></svg>

frontend/public/svgs/tv.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="none" viewBox="0 0 32 32"><path fill="#455a64" d="m15.255 10.911-4.82-6.048a.204.204 0 0 1 .025-.278.2.2 0 0 1 .284.018l5.127 5.775a.2.2 0 0 1-.018.284l-.307.271a.2.2 0 0 1-.291-.022M16.494 10.878l-.276-.245a.22.22 0 0 1-.017-.313l5.097-5.746a.22.22 0 0 1 .313-.018c.09.078.1.213.027.307l-4.822 5.99a.227.227 0 0 1-.322.025"/><path fill="#455a64" d="M12.389 11.214c0-.775 1.72-1.406 3.842-1.406s3.842.629 3.842 1.406z"/><path fill="#82aec0" d="M28.353 29.337H3.652c-.544 0-.985-.458-.985-1.02V11.8c0-.564.44-1.02.985-1.02h24.703c.542 0 .985.458.985 1.02v16.516c-.003.562-.443 1.02-.987 1.02"/><path fill="#212121" d="M27.637 28.368H4.438a.79.79 0 0 1-.789-.79V12.456a.79.79 0 0 1 .79-.79h23.198c.436 0 .789.354.789.79v15.124a.79.79 0 0 1-.79.789"/><path fill="#b9e4ea" d="m5.2 25.995-1.068 1.677c-.186.293.014.691.36.694h18.414a.536.536 0 0 0 .478-.77l-.667-1.373z"/><path fill="#455a64" d="M27.312 27.662h-2.53a.464.464 0 0 1-.465-.464V21.92c0-.258.209-.464.464-.464h2.531c.258 0 .465.209.465.464v5.278a.464.464 0 0 1-.465.464M26.048 20.226a1.531 1.531 0 1 0 0-3.062 1.531 1.531 0 0 0 0 3.062"/><path fill="#82aec0" d="M24.966 17.798a.254.254 0 0 0-.009.313l.504.678c.158.21.363.382.6.497l.76.37a.254.254 0 0 0 .316-.38l-.505-.678a1.65 1.65 0 0 0-.6-.498l-.76-.369a.26.26 0 0 0-.306.067"/><path fill="#455a64" d="M26.048 16.268a1.531 1.531 0 1 0 0-3.062 1.531 1.531 0 0 0 0 3.062"/><path fill="#82aec0" d="M26.049 13.33c-.118 0-.22.08-.247.194l-.2.822a1.65 1.65 0 0 0 0 .78l.2.822a.254.254 0 0 0 .493 0l.2-.822a1.65 1.65 0 0 0 0-.78l-.2-.822a.256.256 0 0 0-.247-.194"/><path fill="#2f7889" d="M22.992 25.219c-.17.77-.742 1.366-1.475 1.529-1.205.269-3.45.604-7.148.604-3.883 0-6.487-.369-7.89-.642-.775-.151-1.384-.787-1.536-1.607-.348-1.885-.786-5.652.018-10.357.15-.871.814-1.54 1.643-1.653 1.495-.207 4.167-.483 7.765-.483 3.414 0 5.7.25 6.997.45.797.124 1.435.77 1.598 1.608.962 4.957.43 8.733.028 10.55"/><path fill="#212121" fill-rule="evenodd" d="M14.37 13.055c-3.576 0-6.227.274-7.705.478-.623.085-1.147.593-1.265 1.288-.794 4.64-.361 8.353-.02 10.201.121.653.6 1.138 1.184 1.252 1.375.267 3.951.634 7.805.634 3.672 0 5.884-.334 7.051-.594.553-.122 1.002-.576 1.139-1.192.392-1.772.917-5.485-.032-10.369-.13-.67-.633-1.161-1.23-1.254-1.272-.197-3.536-.444-6.928-.444m-7.827-.403c1.514-.209 4.206-.486 7.826-.486 3.436 0 5.746.25 7.064.454h.001c1 .156 1.771.959 1.966 1.964.976 5.028.439 8.867.027 10.73-.206.928-.9 1.665-1.814 1.868-1.242.277-3.52.615-7.244.615-3.91 0-6.544-.372-7.975-.65-.967-.19-1.705-.976-1.887-1.963m2.036-12.532c-1.035.142-1.84.972-2.02 2.02-.815 4.768-.372 8.59-.016 10.512" clip-rule="evenodd"/><path fill="url(#a)" d="M8.686 14.175c.373-.045 1.08-.013 1.329.744.248.758-.298.963-.591 1.187-.843.642-1.26.887-1.767 1.587-.404.56-1.111.384-1.322.015-.169-.298-.293-1.253.064-1.884.771-1.351 1.914-1.605 2.287-1.649"/><defs><linearGradient id="a" x1="8.303" x2="8.07" y1="9.59" y2="18.014" gradientUnits="userSpaceOnUse"><stop stop-color="#fff"/><stop offset="1" stop-color="#fff" stop-opacity="0"/></linearGradient></defs></svg>

frontend/src/AppRoutes/pageComponents.ts

@@ -93,13 +93,15 @@ export const OnboardingV2 = Loadable(
 	() => import(/* webpackChunkName: "Onboarding V2" */ 'pages/OnboardingPageV2'),
 );
 
-export const DashboardPage = Loadable(
+export const DashboardsListPage = Loadable(
 	() =>
-		import(/* webpackChunkName: "DashboardPage" */ 'pages/DashboardsListPage'),
+		import(
+			/* webpackChunkName: "DashboardsListPage" */ 'pages/DashboardsListPage'
+		),
 );
 
-export const NewDashboardPage = Loadable(
-	() => import(/* webpackChunkName: "New DashboardPage" */ 'pages/NewDashboard'),
+export const DashboardPage = Loadable(
+	() => import(/* webpackChunkName: "DashboardPage" */ 'pages/DashboardPage'),
 );
 
 export const DashboardWidget = Loadable(

frontend/src/AppRoutes/routes.ts

@@ -1,4 +1,5 @@
 import ROUTES from 'constants/routes';
+import AlertTypeSelectionPage from 'pages/AlertTypeSelection';
 import MessagingQueues from 'pages/MessagingQueues';
 import MeterExplorer from 'pages/MeterExplorer';
 import { RouteProps } from 'react-router-dom';
@@ -12,6 +13,7 @@ import {
 	CreateAlertChannelAlerts,
 	CreateNewAlerts,
 	DashboardPage,
+	DashboardsListPage,
 	DashboardWidget,
 	EditRulesPage,
 	ErrorDetails,
@@ -27,7 +29,6 @@ import {
 	LogsIndexToFields,
 	LogsSaveViews,
 	MetricsExplorer,
-	NewDashboardPage,
 	OldLogsExplorer,
 	Onboarding,
 	OnboardingV2,
@@ -159,14 +160,14 @@ const routes: AppRoutes[] = [
 	{
 		path: ROUTES.ALL_DASHBOARD,
 		exact: true,
-		component: DashboardPage,
+		component: DashboardsListPage,
 		isPrivate: true,
 		key: 'ALL_DASHBOARD',
 	},
 	{
 		path: ROUTES.DASHBOARD,
 		exact: true,
-		component: NewDashboardPage,
+		component: DashboardPage,
 		isPrivate: true,
 		key: 'DASHBOARD',
 	},
@@ -198,6 +199,13 @@ const routes: AppRoutes[] = [
 		isPrivate: true,
 		key: 'LIST_ALL_ALERT',
 	},
+	{
+		path: ROUTES.ALERT_TYPE_SELECTION,
+		exact: true,
+		component: AlertTypeSelectionPage,
+		isPrivate: true,
+		key: 'ALERT_TYPE_SELECTION',
+	},
 	{
 		path: ROUTES.ALERTS_NEW,
 		exact: true,

frontend/src/api/globalConfig/getGlobalConfig.ts

@@ -0,0 +1,25 @@
+import axios from 'api';
+import { ErrorResponseHandlerV2 } from 'api/ErrorResponseHandlerV2';
+import { AxiosError } from 'axios';
+import { ErrorV2Resp, SuccessResponseV2 } from 'types/api';
+import {
+	GlobalConfigData,
+	GlobalConfigDataProps,
+} from 'types/api/globalConfig/types';
+
+const getGlobalConfig = async (): Promise<
+	SuccessResponseV2<GlobalConfigData>
+> => {
+	try {
+		const response = await axios.get<GlobalConfigDataProps>(`/global/config`);
+
+		return {
+			httpStatusCode: response.status,
+			data: response.data.data,
+		};
+	} catch (error) {
+		ErrorResponseHandlerV2(error as AxiosError<ErrorV2Resp>);
+	}
+};
+
+export default getGlobalConfig;

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

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

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

@@ -16,7 +16,7 @@ import {
 	QueryRangePayloadV5,
 } from 'types/api/v5/queryRange';
 import { EQueryType } from 'types/common/dashboard';
-import { DataSource } from 'types/common/queryBuilder';
+import { DataSource, ReduceOperators } from 'types/common/queryBuilder';
 import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
 
 import { prepareQueryRangePayloadV5 } from './prepareQueryRangePayloadV5';
@@ -41,7 +41,7 @@ describe('prepareQueryRangePayloadV5', () => {
 				temporality: '',
 				timeAggregation: 'sum',
 				spaceAggregation: 'avg',
-				reduceTo: 'avg',
+				reduceTo: ReduceOperators.AVG,
 			},
 		],
 		timeAggregation: 'sum',
@@ -62,7 +62,7 @@ describe('prepareQueryRangePayloadV5', () => {
 		limit: null,
 		stepInterval: 600,
 		orderBy: [],
-		reduceTo: 'avg',
+		reduceTo: ReduceOperators.AVG,
 		legend: 'Legend A',
 		...overrides,
 	});
@@ -416,7 +416,7 @@ describe('prepareQueryRangePayloadV5', () => {
 											metricName: 'cpu_usage',
 											timeAggregation: 'sum',
 											spaceAggregation: 'avg',
-											reduceTo: 'avg',
+											reduceTo: ReduceOperators.AVG,
 											temporality: undefined,
 										}),
 									],
@@ -569,7 +569,7 @@ describe('prepareQueryRangePayloadV5', () => {
 								},
 							],
 							legend: '{{service.name}}',
-							reduceTo: 'avg',
+							reduceTo: ReduceOperators.AVG,
 							offset: 0,
 							pageSize: 100,
 						},

frontend/src/components/AuthError/AuthError.styles.scss

@@ -0,0 +1,145 @@
+.auth-error-container {
+	margin-top: 24px;
+	width: 100%;
+	animation: horizontal-shaking 300ms ease-out;
+
+	.error-content {
+		background: rgba(229, 72, 77, 0.1);
+		border: 1px solid rgba(229, 72, 77, 0.2);
+		border-radius: 4px;
+
+		&__summary-section {
+			border-bottom: 1px solid rgba(229, 72, 77, 0.2);
+		}
+
+		&__summary {
+			padding: 16px;
+		}
+
+		&__summary-left {
+			gap: 10px;
+		}
+
+		&__icon-wrapper {
+			width: 12px;
+			height: 12px;
+			flex-shrink: 0;
+		}
+
+		&__summary-text {
+			gap: 6px;
+		}
+
+		&__error-code {
+			color: #fadadb;
+			font-size: 13px;
+			font-weight: 500;
+			line-height: 1;
+			letter-spacing: -0.065px;
+		}
+
+		&__error-message {
+			color: #f5b6b8;
+			font-size: 13px;
+			font-weight: 400;
+			line-height: 20px;
+			letter-spacing: -0.065px;
+		}
+
+		&__message-badge {
+			padding: 0px 16px 16px;
+		}
+
+		&__message-badge-label-text {
+			color: #fadadb;
+		}
+
+		&__message-badge-line {
+			background-image: radial-gradient(
+				circle,
+				rgba(229, 72, 77, 0.3) 1px,
+				transparent 2px
+			);
+		}
+
+		&__messages-section {
+			padding: 0;
+		}
+
+		&__message-list {
+			max-height: 200px;
+		}
+
+		&__message-item {
+			color: #f5b6b8;
+			font-size: 13px;
+			font-weight: 400;
+			line-height: 20px;
+			letter-spacing: -0.065px;
+
+			&::before {
+				background: #f5b6b8;
+			}
+		}
+
+		&__scroll-hint {
+			background: rgba(229, 72, 77, 0.2);
+		}
+
+		&__scroll-hint-text {
+			color: #fadadb;
+		}
+	}
+
+	.auth-error-icon {
+		color: var(--bg-cherry-300);
+		padding-top: 1px;
+	}
+}
+
+.lightMode {
+	.auth-error-container {
+		.error-content {
+			background: rgba(229, 72, 77, 0.1);
+			border-color: rgba(229, 72, 77, 0.2);
+
+			&__error-code {
+				color: var(--bg-ink-100);
+			}
+
+			&__error-message {
+				color: var(--bg-ink-400);
+			}
+
+			&__message-item {
+				color: var(--bg-ink-400);
+
+				&::before {
+					background: var(--bg-ink-400);
+				}
+			}
+
+			&__scroll-hint-text {
+				color: var(--bg-ink-100);
+			}
+		}
+	}
+}
+
+@keyframes horizontal-shaking {
+	0% {
+		transform: translateX(0);
+	}
+	25% {
+		transform: translateX(5px);
+	}
+	50% {
+		transform: translateX(-5px);
+	}
+	75% {
+		transform: translateX(5px);
+	}
+	100% {
+		transform: translateX(0);
+	}
+}

frontend/src/components/AuthError/AuthError.tsx

@@ -0,0 +1,22 @@
+import './AuthError.styles.scss';
+
+import ErrorContent from 'components/ErrorModal/components/ErrorContent';
+import { CircleAlert } from 'lucide-react';
+import APIError from 'types/api/error';
+
+interface AuthErrorProps {
+	error: APIError;
+}
+
+function AuthError({ error }: AuthErrorProps): JSX.Element {
+	return (
+		<div className="auth-error-container">
+			<ErrorContent
+				error={error}
+				icon={<CircleAlert size={12} className="auth-error-icon" />}
+			/>
+		</div>
+	);
+}
+
+export default AuthError;

frontend/src/components/AuthPageContainer/AuthFooter.styles.scss

@@ -0,0 +1,115 @@
+@import '@signozhq/design-tokens/dist/style.css';
+
+.auth-footer {
+	width: 100%;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	padding: 24px 0;
+	position: relative;
+	z-index: 10;
+}
+
+.auth-footer-content {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	gap: 16px;
+	padding: 12px;
+	background: var(--bg-ink-400, #121317);
+	border: 1px solid var(--bg-ink-200, #23262e);
+	border-radius: 4px;
+}
+
+.auth-footer-item {
+	display: flex;
+	align-items: center;
+	gap: 6px;
+	height: 12px;
+}
+
+.auth-footer-status-indicator {
+	width: 6px;
+	height: 6px;
+	border-radius: 9999px;
+	background: #25e192;
+	flex-shrink: 0;
+}
+
+.auth-footer-icon {
+	aspect-ratio: 1.93;
+	width: 29px;
+	flex-shrink: 0;
+	object-fit: contain;
+	opacity: 1;
+}
+
+.auth-footer-text {
+	font-family: var(--font-family-inter, Inter, sans-serif);
+	font-size: 11px;
+	font-weight: 400;
+	line-height: 1;
+	color: var(--text-neutral-dark-100, #adb4c2);
+	text-align: center;
+}
+
+.auth-footer-link {
+	display: flex;
+	align-items: center;
+	gap: 6px;
+	text-decoration: none;
+	transition: opacity 0.2s ease;
+
+	&:hover {
+		opacity: 0.8;
+	}
+}
+
+.auth-footer-link-icon {
+	flex-shrink: 0;
+	color: var(--text-neutral-dark-50, #eceef2);
+}
+
+.auth-footer-link-status {
+	.auth-footer-text {
+		color: #25e192;
+	}
+
+	.auth-footer-link-icon {
+		color: #25e192;
+	}
+}
+
+.auth-footer-separator {
+	width: 4px;
+	height: 4px;
+	border-radius: 50%;
+	background: var(--bg-ink-200, #23262e);
+	flex-shrink: 0;
+}
+
+.lightMode {
+	.auth-footer-content {
+		background: var(--bg-base-white, #ffffff);
+		border-color: var(--bg-vanilla-300, #e9e9e9);
+		box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.08);
+	}
+
+	.auth-footer-icon {
+		filter: brightness(0) saturate(100%) invert(25%) sepia(8%) saturate(518%)
+			hue-rotate(192deg) brightness(80%) contrast(95%);
+		opacity: 0.9;
+	}
+
+	.auth-footer-text {
+		color: var(--text-neutral-light-200, #80828d);
+	}
+
+	.auth-footer-link-icon {
+		color: var(--text-neutral-light-100, #62636c);
+	}
+
+	.auth-footer-separator {
+		background: var(--bg-vanilla-300, #e9e9e9);
+	}
+}

frontend/src/components/AuthPageContainer/AuthFooter.tsx

@@ -0,0 +1,75 @@
+import './AuthFooter.styles.scss';
+
+import { ArrowUpRight } from 'lucide-react';
+import React from 'react';
+
+interface FooterItem {
+	icon?: string;
+	text: string;
+	url?: string;
+	statusIndicator?: boolean;
+}
+
+const footerItems: FooterItem[] = [
+	{
+		text: 'All systems operational',
+		url: 'https://status.signoz.io/',
+		statusIndicator: true,
+	},
+	{
+		text: 'Privacy',
+		url: 'https://www.signoz.io/privacy',
+	},
+	{
+		text: 'Security',
+		url: 'https://www.signoz.io/security',
+	},
+];
+
+function AuthFooter(): JSX.Element {
+	return (
+		<footer className="auth-footer">
+			<div className="auth-footer-content">
+				{footerItems.map((item, index) => (
+					<React.Fragment key={item.text}>
+						<div className="auth-footer-item">
+							{item.statusIndicator && (
+								<div className="auth-footer-status-indicator" />
+							)}
+							{item.icon && (
+								<img
+									loading="lazy"
+									src={item.icon}
+									alt=""
+									className="auth-footer-icon"
+								/>
+							)}
+							{item.url ? (
+								<a
+									href={item.url}
+									className={`auth-footer-link ${
+										item.statusIndicator ? 'auth-footer-link-status' : ''
+									}`}
+									target="_blank"
+									rel="noopener noreferrer"
+								>
+									<span className="auth-footer-text">{item.text}</span>
+									{!item.statusIndicator && (
+										<ArrowUpRight size={12} className="auth-footer-link-icon" />
+									)}
+								</a>
+							) : (
+								<span className="auth-footer-text">{item.text}</span>
+							)}
+						</div>
+						{index < footerItems.length - 1 && (
+							<div className="auth-footer-separator" />
+						)}
+					</React.Fragment>
+				))}
+			</div>
+		</footer>
+	);
+}
+
+export default AuthFooter;

frontend/src/components/AuthPageContainer/AuthHeader.styles.scss

@@ -0,0 +1,82 @@
+@import '@signozhq/design-tokens/dist/style.css';
+
+.auth-header {
+	width: 100%;
+	max-width: 1176px;
+	margin: 0 auto;
+	padding: 12px 0;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	position: relative;
+	z-index: 10;
+}
+
+.auth-header-logo {
+	display: flex;
+	align-items: center;
+	gap: 4.9px;
+	text-decoration: none;
+}
+
+.auth-header-logo-icon {
+	width: 17.5px;
+	height: 17.5px;
+	flex-shrink: 0;
+}
+
+.auth-header-logo-text {
+	font-family: Satoshi, var(--font-family-inter, Inter), sans-serif;
+	font-size: 15.4px;
+	font-weight: 500;
+	line-height: 17.5px;
+	color: var(--text-neutral-dark-50, #eceef2);
+	white-space: nowrap;
+}
+
+.auth-header-help-button {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	gap: 8px;
+	height: 32px;
+	padding: 10px 16px;
+	background: var(--bg-ink-400, #121317);
+	border: none;
+	border-radius: 2px;
+	cursor: pointer;
+	transition: opacity 0.2s ease;
+
+	span {
+		font-family: var(--font-family-inter, Inter, sans-serif);
+		font-size: 11px;
+		font-weight: 500;
+		line-height: 1;
+		color: var(--text-neutral-dark-100, #adb4c2);
+		text-align: center;
+	}
+
+	svg {
+		flex-shrink: 0;
+		color: var(--text-neutral-dark-100, #adb4c2);
+	}
+
+	&:hover {
+		opacity: 0.8;
+	}
+}
+
+.lightMode {
+	.auth-header-logo-text {
+		color: var(--text-neutral-light-100, #62636c);
+	}
+
+	.auth-header-help-button {
+		background: var(--bg-vanilla-200, #f5f5f5);
+
+		span,
+		svg {
+			color: var(--text-neutral-light-200, #80828d);
+		}
+	}
+}

frontend/src/components/AuthPageContainer/AuthHeader.tsx

@@ -0,0 +1,33 @@
+import './AuthHeader.styles.scss';
+
+import { Button } from '@signozhq/button';
+import { LifeBuoy } from 'lucide-react';
+import { useCallback } from 'react';
+
+function AuthHeader(): JSX.Element {
+	const handleGetHelp = useCallback((): void => {
+		window.open('https://signoz.io/support/', '_blank');
+	}, []);
+
+	return (
+		<header className="auth-header">
+			<div className="auth-header-logo">
+				<img
+					src="/Logos/signoz-brand-logo.svg"
+					alt="SigNoz"
+					className="auth-header-logo-icon"
+				/>
+				<span className="auth-header-logo-text">SigNoz</span>
+			</div>
+			<Button
+				className="auth-header-help-button"
+				prefixIcon={<LifeBuoy size={12} />}
+				onClick={handleGetHelp}
+			>
+				Get Help
+			</Button>
+		</header>
+	);
+}
+
+export default AuthHeader;

frontend/src/components/AuthPageContainer/AuthPageContainer.styles.scss

@@ -0,0 +1,181 @@
+@import '@signozhq/design-tokens/dist/style.css';
+
+.auth-page-wrapper {
+	position: relative;
+	min-height: 100vh;
+	width: 100%;
+	background: var(--bg-neutral-dark-1000, #0a0c10);
+	display: flex;
+	flex-direction: column;
+}
+
+.auth-page-background {
+	position: fixed;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+	z-index: 0;
+	overflow: hidden;
+}
+
+.auth-page-dots {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100vh;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+}
+
+.bg-dot-pattern {
+	background: radial-gradient(
+		circle,
+		var(--bg-neutral-dark-50, #eceef2) 1px,
+		transparent 1px
+	);
+	background-size: 12px 12px;
+	opacity: 1;
+}
+
+.masked-dots {
+	mask-image: radial-gradient(
+		circle at 50% 0%,
+		rgba(11, 12, 14, 0.1) 0%,
+		rgba(11, 12, 14, 0) 56.77%
+	);
+	-webkit-mask-image: radial-gradient(
+		circle at 50% 0%,
+		rgba(11, 12, 14, 0.1) 0%,
+		rgba(11, 12, 14, 0) 56.77%
+	);
+}
+
+.auth-page-gradient {
+	position: absolute;
+	left: 0;
+	right: 0;
+	top: 0;
+	margin: 0 auto;
+	height: 450px;
+	width: 100%;
+	flex-shrink: 0;
+	border-radius: 956px;
+	background: radial-gradient(
+		ellipse at center -500px,
+		rgba(78, 116, 248, 0.3) 0%,
+		transparent 70%
+	);
+	opacity: 0.3;
+	filter: blur(150px);
+
+	@media (min-width: 768px) {
+		height: 956px;
+		filter: blur(300px);
+	}
+}
+
+.auth-page-line-left,
+.auth-page-line-right {
+	position: absolute;
+	top: 0;
+	width: 1px;
+	height: 100%;
+	background-image: repeating-linear-gradient(
+		to bottom,
+		var(--bg-ink-200, #23262e) 0px,
+		var(--bg-ink-200, #23262e) 4px,
+		transparent 4px,
+		transparent 8px
+	);
+	pointer-events: none;
+
+	@media (max-width: 1440px) {
+		display: none;
+	}
+}
+
+.auth-page-line-left {
+	left: calc(50% - 600px);
+}
+
+.auth-page-line-right {
+	left: calc(50% + 600px);
+}
+
+.auth-page-layout {
+	position: relative;
+	z-index: 1;
+	width: 100%;
+	max-width: 1440px;
+	margin: 0 auto;
+	min-height: 100vh;
+	display: flex;
+	flex-direction: column;
+
+	@media (max-width: 1440px) {
+		padding: 0 24px;
+	}
+}
+
+.auth-page-content {
+	flex: 1;
+	display: flex;
+	align-items: flex-start;
+	justify-content: center;
+	padding-top: 8vh;
+	padding-bottom: 24px;
+	width: 100%;
+	position: relative;
+
+	@media (max-width: 768px) {
+		padding-top: 15vh;
+		align-items: center;
+	}
+
+	&.onboarding-flow {
+		padding-top: 0;
+
+		@media (max-width: 768px) {
+			padding-top: 0;
+		}
+	}
+}
+
+.lightMode {
+	.auth-page-wrapper {
+		background: var(--bg-base-white, #ffffff);
+	}
+
+	.bg-dot-pattern {
+		background: radial-gradient(circle, rgba(35, 38, 46, 1) 1px, transparent 1px);
+		background-size: 12px 12px;
+	}
+
+	.auth-page-gradient {
+		background: radial-gradient(
+			ellipse at center top,
+			rgba(78, 116, 248, 0.12) 0%,
+			transparent 60%
+		);
+		opacity: 0.8;
+		filter: blur(200px);
+
+		@media (min-width: 768px) {
+			filter: blur(300px);
+		}
+	}
+
+	.auth-page-line-left,
+	.auth-page-line-right {
+		background-image: repeating-linear-gradient(
+			to bottom,
+			var(--bg-vanilla-300, #e9e9e9) 0px,
+			var(--bg-vanilla-300, #e9e9e9) 4px,
+			transparent 4px,
+			transparent 8px
+		);
+	}
+}

frontend/src/components/AuthPageContainer/index.tsx

@@ -0,0 +1,41 @@
+import './AuthPageContainer.styles.scss';
+
+import { PropsWithChildren } from 'react';
+
+import AuthFooter from './AuthFooter';
+import AuthHeader from './AuthHeader';
+
+type AuthPageContainerProps = PropsWithChildren<{
+	isOnboarding?: boolean;
+}>;
+
+function AuthPageContainer({
+	children,
+	isOnboarding = false,
+}: AuthPageContainerProps): JSX.Element {
+	return (
+		<div className="auth-page-wrapper">
+			<div className="auth-page-background">
+				<div className="auth-page-dots bg-dot-pattern masked-dots" />
+				<div className="auth-page-gradient" />
+				<div className="auth-page-line-left" />
+				<div className="auth-page-line-right" />
+			</div>
+			<div className="auth-page-layout">
+				<AuthHeader />
+				<main
+					className={`auth-page-content ${isOnboarding ? 'onboarding-flow' : ''}`}
+				>
+					{children}
+				</main>
+				<AuthFooter />
+			</div>
+		</div>
+	);
+}
+
+AuthPageContainer.defaultProps = {
+	isOnboarding: false,
+};
+
+export default AuthPageContainer;

frontend/src/components/CeleryTask/CeleryTaskGraph/CeleryTaskGraphUtils.ts

@@ -4,7 +4,7 @@ import { getWidgetQueryBuilder } from 'container/MetricsApplication/MetricsAppli
 import { getWidgetQuery } from 'pages/MessagingQueues/MQDetails/MetricPage/MetricPageUtil';
 import { Widgets } from 'types/api/dashboard/getAll';
 import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
-import { DataSource } from 'types/common/queryBuilder';
+import { DataSource, ReduceOperators } from 'types/common/queryBuilder';
 import { v4 as uuidv4 } from 'uuid';
 
 // dynamic step interval
@@ -57,7 +57,7 @@ export const celeryAllStateWidgetData = (
 					limit: null,
 					orderBy: [],
 					queryName: 'A',
-					reduceTo: 'avg',
+					reduceTo: ReduceOperators.AVG,
 					spaceAggregation: 'sum',
 					stepInterval: getStepInterval(startTime, endTime),
 					timeAggregation: 'rate',
@@ -121,7 +121,7 @@ export const celeryRetryStateWidgetData = (
 					limit: null,
 					orderBy: [],
 					queryName: 'A',
-					reduceTo: 'avg',
+					reduceTo: ReduceOperators.AVG,
 					spaceAggregation: 'sum',
 					stepInterval: getStepInterval(startTime, endTime),
 					timeAggregation: 'count',
@@ -181,7 +181,7 @@ export const celeryFailedStateWidgetData = (
 					limit: null,
 					orderBy: [],
 					queryName: 'A',
-					reduceTo: 'avg',
+					reduceTo: ReduceOperators.AVG,
 					spaceAggregation: 'sum',
 					stepInterval: getStepInterval(startTime, endTime),
 					timeAggregation: 'rate',
@@ -241,7 +241,7 @@ export const celerySuccessStateWidgetData = (
 					limit: null,
 					orderBy: [],
 					queryName: 'A',
-					reduceTo: 'avg',
+					reduceTo: ReduceOperators.AVG,
 					spaceAggregation: 'sum',
 					stepInterval: getStepInterval(startTime, endTime),
 					timeAggregation: 'rate',
@@ -288,7 +288,7 @@ export const celeryTasksByWorkerWidgetData = (
 					limit: 10,
 					orderBy: [],
 					queryName: 'A',
-					reduceTo: 'avg',
+					reduceTo: ReduceOperators.AVG,
 					spaceAggregation: 'sum',
 					stepInterval: getStepInterval(startTime, endTime),
 					timeAggregation: 'rate',
@@ -351,7 +351,7 @@ export const celeryErrorByWorkerWidgetData = (
 						},
 					],
 					legend: '',
-					reduceTo: 'avg',
+					reduceTo: ReduceOperators.AVG,
 				},
 				{
 					dataSource: 'traces',
@@ -385,7 +385,7 @@ export const celeryErrorByWorkerWidgetData = (
 						},
 					],
 					legend: '',
-					reduceTo: 'avg',
+					reduceTo: ReduceOperators.AVG,
 				},
 				{
 					queryName: 'F1',
@@ -436,7 +436,7 @@ export const celeryLatencyByWorkerWidgetData = (
 					limit: 10,
 					orderBy: [],
 					queryName: 'A',
-					reduceTo: 'avg',
+					reduceTo: ReduceOperators.AVG,
 					spaceAggregation: 'sum',
 					stepInterval: getStepInterval(startTime, endTime),
 					timeAggregation: 'p99',
@@ -485,7 +485,7 @@ export const celeryActiveTasksWidgetData = (
 					limit: null,
 					orderBy: [],
 					queryName: 'A',
-					reduceTo: 'avg',
+					reduceTo: ReduceOperators.AVG,
 					spaceAggregation: 'avg',
 					stepInterval: getStepInterval(startTime, endTime),
 					timeAggregation: 'latest',
@@ -539,7 +539,7 @@ export const celeryTaskLatencyWidgetData = (
 						},
 					],
 					queryName: 'A',
-					reduceTo: 'avg',
+					reduceTo: ReduceOperators.AVG,
 					spaceAggregation: 'sum',
 					stepInterval: getStepInterval(startTime, endTime),
 					timeAggregation: type || 'p99',
@@ -590,7 +590,7 @@ export const celerySlowestTasksTableWidgetData = getWidgetQueryBuilder(
 					},
 				],
 				queryName: 'A',
-				reduceTo: 'avg',
+				reduceTo: ReduceOperators.AVG,
 				spaceAggregation: 'sum',
 				stepInterval: 60,
 				timeAggregation: 'avg',
@@ -652,7 +652,7 @@ export const celeryRetryTasksTableWidgetData = getWidgetQueryBuilder(
 					},
 				],
 				queryName: 'A',
-				reduceTo: 'avg',
+				reduceTo: ReduceOperators.AVG,
 				spaceAggregation: 'sum',
 				stepInterval: 60,
 				timeAggregation: 'avg',
@@ -715,7 +715,7 @@ export const celeryFailedTasksTableWidgetData = getWidgetQueryBuilder(
 					},
 				],
 				queryName: 'A',
-				reduceTo: 'avg',
+				reduceTo: ReduceOperators.AVG,
 				spaceAggregation: 'sum',
 				stepInterval: 60,
 				timeAggregation: 'avg',
@@ -776,7 +776,7 @@ export const celerySuccessTasksTableWidgetData = getWidgetQueryBuilder(
 					},
 				],
 				queryName: 'A',
-				reduceTo: 'avg',
+				reduceTo: ReduceOperators.AVG,
 				spaceAggregation: 'sum',
 				stepInterval: 60,
 				timeAggregation: 'avg',
@@ -838,7 +838,7 @@ export const celeryTimeSeriesTablesWidgetData = (
 					limit: null,
 					orderBy: [],
 					queryName: 'A',
-					reduceTo: 'avg',
+					reduceTo: ReduceOperators.AVG,
 					spaceAggregation: 'sum',
 					stepInterval: 60,
 					timeAggregation: 'avg',
@@ -877,7 +877,7 @@ export const celeryAllStateCountWidgetData = getWidgetQueryBuilder(
 				limit: null,
 				orderBy: [],
 				queryName: 'A',
-				reduceTo: 'last',
+				reduceTo: ReduceOperators.LAST,
 				spaceAggregation: 'sum',
 				stepInterval: 60,
 				timeAggregation: 'count_distinct',
@@ -926,7 +926,7 @@ export const celerySuccessStateCountWidgetData = getWidgetQueryBuilder(
 				limit: null,
 				orderBy: [],
 				queryName: 'A',
-				reduceTo: 'last',
+				reduceTo: ReduceOperators.LAST,
 				spaceAggregation: 'sum',
 				stepInterval: 60,
 				timeAggregation: 'count_distinct',
@@ -975,7 +975,7 @@ export const celeryFailedStateCountWidgetData = getWidgetQueryBuilder(
 				limit: null,
 				orderBy: [],
 				queryName: 'A',
-				reduceTo: 'last',
+				reduceTo: ReduceOperators.LAST,
 				spaceAggregation: 'sum',
 				stepInterval: 60,
 				timeAggregation: 'count_distinct',
@@ -1024,7 +1024,7 @@ export const celeryRetryStateCountWidgetData = getWidgetQueryBuilder(
 				limit: null,
 				orderBy: [],
 				queryName: 'A',
-				reduceTo: 'last',
+				reduceTo: ReduceOperators.LAST,
 				spaceAggregation: 'sum',
 				stepInterval: 60,
 				timeAggregation: 'count_distinct',

frontend/src/components/ChangelogModal/components/ChangelogRenderer.styles.scss

@@ -58,6 +58,7 @@
 		flex-direction: column;
 		gap: 16px;
 		padding-left: 30px;
+		margin-bottom: 1rem;
 
 		li {
 			position: relative;

frontend/src/components/CustomTimePicker/CalendarContainer.tsx

@@ -0,0 +1,102 @@
+import { Calendar } from '@signozhq/calendar';
+import { Button } from 'antd';
+import { DATE_TIME_FORMATS } from 'constants/dateTimeFormats';
+import dayjs from 'dayjs';
+import { CalendarIcon, Check, X } from 'lucide-react';
+import { useTimezone } from 'providers/Timezone';
+
+import { DateRange } from './CustomTimePickerPopoverContent';
+
+function CalendarContainer({
+	dateRange,
+	onSelectDateRange,
+	onCancel,
+	onApply,
+}: {
+	dateRange: DateRange;
+	onSelectDateRange: (dateRange: DateRange) => void;
+	onCancel: () => void;
+	onApply: () => void;
+}): JSX.Element {
+	const { timezone } = useTimezone();
+
+	// this is to override the default behavior of the shadcn calendar component
+	// if a range is already selected, clicking on a date will reset selection and set the new date as the start date
+	const handleSelect = (
+		_selected: DateRange | undefined,
+		clickedDate?: Date,
+	): void => {
+		if (!clickedDate) {
+			return;
+		}
+
+		// No dates selected → start new
+		if (!dateRange?.from) {
+			onSelectDateRange({ from: clickedDate });
+			return;
+		}
+
+		// Only start selected → complete the range
+		if (dateRange.from && !dateRange.to) {
+			if (clickedDate < dateRange.from) {
+				onSelectDateRange({ from: clickedDate, to: dateRange.from });
+			} else {
+				onSelectDateRange({ from: dateRange.from, to: clickedDate });
+			}
+			return;
+		}
+
+		onSelectDateRange({ from: clickedDate, to: undefined });
+	};
+
+	return (
+		<div className="calendar-container">
+			<div className="calendar-container-header">
+				<CalendarIcon size={12} />
+				<div className="calendar-container-header-title">
+					{dayjs(dateRange?.from)
+						.tz(timezone.value)
+						.format(DATE_TIME_FORMATS.MONTH_DATE_SHORT)}{' '}
+					-{' '}
+					{dayjs(dateRange?.to)
+						.tz(timezone.value)
+						.format(DATE_TIME_FORMATS.MONTH_DATE_SHORT)}
+				</div>
+			</div>
+
+			<div className="calendar-container-body">
+				<Calendar
+					mode="range"
+					required
+					defaultMonth={dateRange?.from}
+					selected={dateRange}
+					disabled={{
+						after: dayjs().toDate(),
+					}}
+					onSelect={handleSelect}
+				/>
+
+				<div className="calendar-actions">
+					<Button
+						type="primary"
+						className="periscope-btn secondary cancel-btn"
+						onClick={onCancel}
+						icon={<X size={12} />}
+					>
+						Cancel
+					</Button>
+					<Button
+						type="primary"
+						className="periscope-btn primary apply-btn"
+						onClick={onApply}
+						icon={<Check size={12} />}
+					>
+						Apply
+					</Button>
+				</div>
+			</div>
+		</div>
+	);
+}
+
+export default CalendarContainer;

frontend/src/components/CustomTimePicker/CustomTimePicker.styles.scss

@@ -36,7 +36,6 @@
 }
 
 .time-selection-dropdown-content {
-	min-width: 172px;
 	width: 100%;
 }
 
@@ -48,18 +47,16 @@
 	padding: 4px 8px;
 	padding-left: 0px !important;
 
-	&.custom-time {
-		input:not(:focus) {
-			min-width: 280px;
+	input {
+		width: 280px;
+
+		&::placeholder {
+			color: white;
 		}
-	}
 
-	input::placeholder {
-		color: white;
-	}
-
-	input:focus::placeholder {
-		color: rgba($color: #ffffff, $alpha: 0.4);
+		&:focus::placeholder {
+			color: rgba($color: #ffffff, $alpha: 0.4);
+		}
 	}
 }
 
@@ -175,9 +172,26 @@
 }
 
 .time-input-prefix {
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	padding: 0 4px;
+	border-radius: 3px;
+
+	width: 36px;
+
+	font-size: 11px;
+	color: var(--bg-vanilla-400);
+	background-color: var(--bg-ink-200);
+
+	&.is-live {
+		background-color: transparent;
+		color: var(--bg-forest-500);
+	}
+
 	.live-dot-icon {
-		width: 6px;
-		height: 6px;
+		width: 8px;
+		height: 8px;
 		border-radius: 50%;
 		background-color: var(--bg-forest-500);
 		animation: ripple 1s infinite;
@@ -191,7 +205,7 @@
 	0% {
 		box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.4);
 	}
-	70% {
+	60% {
 		box-shadow: 0 0 0 6px rgba(245, 158, 11, 0);
 	}
 	100% {
@@ -251,6 +265,11 @@
 		background: rgb(179 179 179 / 15%);
 	}
 
+	.time-input-prefix {
+		background-color: var(--bg-vanilla-300);
+		color: var(--bg-ink-400);
+	}
+
 	.time-input-suffix-icon-badge {
 		color: var(--bg-ink-100);
 		background: rgb(179 179 179 / 15%);

frontend/src/components/CustomTimePicker/CustomTimePicker.tsx

@@ -1,8 +1,9 @@
+/* eslint-disable sonarjs/cognitive-complexity */
 /* eslint-disable jsx-a11y/click-events-have-key-events */
 /* eslint-disable jsx-a11y/no-static-element-interactions */
 import './CustomTimePicker.styles.scss';
 
-import { Input, Popover, Tooltip, Typography } from 'antd';
+import { Input, InputRef, Popover, Tooltip } from 'antd';
 import logEvent from 'api/common/logEvent';
 import cx from 'classnames';
 import { DATE_TIME_FORMATS } from 'constants/dateTimeFormats';
@@ -13,10 +14,9 @@ import {
 	RelativeDurationSuggestionOptions,
 } from 'container/TopNav/DateTimeSelectionV2/config';
 import dayjs from 'dayjs';
-import { isValidTimeFormat } from 'lib/getMinMax';
+import { isValidShortHandDateTimeFormat } from 'lib/getMinMax';
 import { defaultTo, isFunction, noop } from 'lodash-es';
-import debounce from 'lodash-es/debounce';
-import { CheckCircle, ChevronDown, Clock } from 'lucide-react';
+import { ChevronDown, ChevronUp } from 'lucide-react';
 import { useTimezone } from 'providers/Timezone';
 import {
 	ChangeEvent,
@@ -25,20 +25,26 @@ import {
 	useCallback,
 	useEffect,
 	useMemo,
+	useRef,
 	useState,
 } from 'react';
-import { useSelector } from 'react-redux';
 import { useLocation } from 'react-router-dom';
-import { AppState } from 'store/reducers';
-import { GlobalReducer } from 'types/reducer/globalTime';
+import { getTimeDifference, validateEpochRange } from 'utils/epochUtils';
 import { popupContainer } from 'utils/selectPopupContainer';
+import { TimeRangeValidationResult, validateTimeRange } from 'utils/timeUtils';
 
 import CustomTimePickerPopoverContent from './CustomTimePickerPopoverContent';
 
-const maxAllowedMinTimeInMonths = 6;
+const maxAllowedMinTimeInMonths = 15;
 type ViewType = 'datetime' | 'timezone';
 const DEFAULT_VIEW: ViewType = 'datetime';
 
+export enum CustomTimePickerInputStatus {
+	SUCCESS = 'success',
+	ERROR = 'error',
+	UNSET = '',
+}
+
 interface CustomTimePickerProps {
 	onSelect: (value: string) => void;
 	onError: (value: boolean) => void;
@@ -64,6 +70,8 @@ interface CustomTimePickerProps {
 	onExitLiveLogs?: () => void;
 	/** When false, hides the "Recently Used" time ranges section */
 	showRecentlyUsed?: boolean;
+	minTime: number;
+	maxTime: number;
 }
 
 function CustomTimePicker({
@@ -84,23 +92,24 @@ function CustomTimePicker({
 	onExitLiveLogs,
 	showLiveLogs,
 	showRecentlyUsed = true,
+	minTime,
+	maxTime,
 }: CustomTimePickerProps): JSX.Element {
 	const [
 		selectedTimePlaceholderValue,
 		setSelectedTimePlaceholderValue,
 	] = useState('Select / Enter Time Range');
 
-	const { maxTime, minTime } = useSelector<AppState, GlobalReducer>(
-		(state) => state.globalTime,
-	);
-
 	const [inputValue, setInputValue] = useState('');
-	const [inputStatus, setInputStatus] = useState<'' | 'error' | 'success'>('');
-	const [inputErrorMessage, setInputErrorMessage] = useState<string | null>(
-		null,
+	const [inputStatus, setInputStatus] = useState<CustomTimePickerInputStatus>(
+		CustomTimePickerInputStatus.UNSET,
 	);
+	const [inputErrorDetails, setInputErrorDetails] = useState<
+		TimeRangeValidationResult['errorDetails'] | null
+	>(null);
 	const location = useLocation();
-	const [isInputFocused, setIsInputFocused] = useState(false);
+
+	const inputRef = useRef<InputRef>(null);
 
 	const [activeView, setActiveView] = useState<ViewType>(DEFAULT_VIEW);
 
@@ -123,12 +132,48 @@ function CustomTimePicker({
 
 	const [isOpenedFromFooter, setIsOpenedFromFooter] = useState(false);
 
+	// function to get selected time in Last 1m, Last 2h, Last 3d, Last 4w format
+	// 1m, 2h, 3d, 4w -> Last 1 minute, Last 2 hours, Last 3 days, Last 4 weeks
+	const getSelectedTimeRangeLabelInRelativeFormat = (
+		selectedTime: string,
+	): string => {
+		if (!selectedTime || selectedTime === 'custom') {
+			return selectedTime || '';
+		}
+
+		// Check if the format matches the relative time format (e.g., 1m, 2h, 3d, 4w)
+		const match = selectedTime.match(/^(\d+)([mhdw])$/);
+		if (!match) {
+			// If it doesn't match the format, return as is
+			return `Last ${selectedTime}`;
+		}
+
+		const value = parseInt(match[1], 10);
+		const unit = match[2];
+
+		// Map unit abbreviations to full words
+		const unitMap: Record<string, { singular: string; plural: string }> = {
+			m: { singular: 'minute', plural: 'minutes' },
+			h: { singular: 'hour', plural: 'hours' },
+			d: { singular: 'day', plural: 'days' },
+			w: { singular: 'week', plural: 'weeks' },
+		};
+
+		const unitLabel = value === 1 ? unitMap[unit].singular : unitMap[unit].plural;
+
+		return `Last ${value} ${unitLabel}`;
+	};
+
 	const getSelectedTimeRangeLabel = (
 		selectedTime: string,
 		selectedTimeValue: string,
 	): string => {
+		if (!selectedTime) {
+			return '';
+		}
+
 		if (selectedTime === 'custom') {
-			// TODO(shaheer): if the user preference is 12 hour format, then convert the date range string to 12-hour format (pick this up while working on 12/24 hour preference feature)
+			// TODO: if the user preference is 12 hour format, then convert the date range string to 12-hour format (pick this up while working on 12/24 hour preference feature)
 			// // Convert the date range string to 12-hour format
 			// const dates = selectedTimeValue.split(' - ');
 			// if (dates.length === 2) {
@@ -164,42 +209,90 @@ function CustomTimePicker({
 			}
 		}
 
-		if (isValidTimeFormat(selectedTime)) {
-			return selectedTime;
+		if (isValidShortHandDateTimeFormat(selectedTime)) {
+			return getSelectedTimeRangeLabelInRelativeFormat(selectedTime);
 		}
 
 		return '';
 	};
 
+	const resetErrorStatus = (): void => {
+		setInputStatus(CustomTimePickerInputStatus.UNSET);
+		onError(false);
+		setInputErrorDetails(null);
+	};
+
 	useEffect(() => {
 		if (showLiveLogs) {
 			setSelectedTimePlaceholderValue('Live');
+			setInputValue('Live');
+			resetErrorStatus();
 		} else {
 			const value = getSelectedTimeRangeLabel(selectedTime, selectedValue);
 			setSelectedTimePlaceholderValue(value);
+			setInputValue(value);
+			resetErrorStatus();
 		}
+		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [selectedTime, selectedValue, showLiveLogs]);
 
 	const hide = (): void => {
 		setOpen(false);
 	};
 
+	const getInputPrefix = (): JSX.Element => {
+		if (showLiveLogs) {
+			return (
+				<span className="time-input-prefix is-live">
+					<span className="live-dot-icon" />
+				</span>
+			);
+		}
+
+		const timeDifference = getTimeDifference(
+			Number(minTime / 1000_000),
+			Number(maxTime / 1000_000),
+		);
+
+		return <span className="time-input-prefix">{timeDifference}</span>;
+	};
+
 	const handleOpenChange = (newOpen: boolean): void => {
 		setOpen(newOpen);
+
 		if (!newOpen) {
 			setCustomDTPickerVisible?.(false);
 			setActiveView('datetime');
+
+			if (showLiveLogs) {
+				setSelectedTimePlaceholderValue('Live');
+				setInputValue('Live');
+				return;
+			}
+
+			// set the input value to a relative format if the selected time is not custom
+			const inputValue = getSelectedTimeRangeLabel(selectedTime, selectedValue);
+			setInputValue(inputValue);
 		}
 	};
 
-	const debouncedHandleInputChange = debounce((inputValue): void => {
-		const isValidFormat = /^(\d+)([mhdw])$/.test(inputValue);
-		if (isValidFormat) {
-			setInputStatus('success');
-			onError(false);
-			setInputErrorMessage(null);
+	const handleInputChange = (event: ChangeEvent<HTMLInputElement>): void => {
+		const inputValue = event.target.value;
+		setInputValue(inputValue);
 
-			const match = inputValue.match(/^(\d+)([mhdw])$/);
+		resetErrorStatus();
+	};
+
+	const handleInputPressEnter = (): void => {
+		// check if the entered time is in the format of 1m, 2h, 3d, 4w
+		const isTimeDurationShortHandFormat = /^(\d+)([mhdw])$/.test(inputValue);
+
+		if (isTimeDurationShortHandFormat) {
+			setInputStatus(CustomTimePickerInputStatus.SUCCESS);
+			onError(false);
+			setInputErrorDetails(null);
+
+			const match = inputValue.match(/^(\d+)([mhdw])$/) as RegExpMatchArray;
 
 			const value = parseInt(match[1], 10);
 			const unit = match[2];
@@ -230,9 +323,13 @@ function CustomTimePicker({
 			}
 
 			if (minTime && (!minTime.isValid() || minTime < maxAllowedMinTime)) {
-				setInputStatus('error');
+				setInputStatus(CustomTimePickerInputStatus.ERROR);
 				onError(true);
-				setInputErrorMessage('Please enter time less than 6 months');
+				setInputErrorDetails({
+					message: `Please enter time less than ${maxAllowedMinTimeInMonths} months`,
+					code: 'TIME_LESS_THAN_MAX_ALLOWED_TIME_IN_MONTHS',
+					description: `Please enter time less than ${maxAllowedMinTimeInMonths} months`,
+				});
 				if (isFunction(onCustomTimeStatusUpdate)) {
 					onCustomTimeStatusUpdate(true);
 				}
@@ -241,44 +338,64 @@ function CustomTimePicker({
 					time: [minTime, currentTime],
 					timeStr: inputValue,
 				});
+
+				setOpen(false);
 			}
-		} else {
-			setInputStatus('error');
-			onError(true);
-			setInputErrorMessage(null);
-			if (isFunction(onCustomTimeStatusUpdate)) {
-				onCustomTimeStatusUpdate(false);
-			}
+
+			return;
 		}
-	}, 300);
 
-	const handleInputChange = (event: ChangeEvent<HTMLInputElement>): void => {
-		const inputValue = event.target.value;
+		// parse the input value to get the start and end time
+		const [startTime, endTime] = inputValue.split(/\s[-–]\s/);
+
+		// check if startTime and endTime are epoch format
+		const { isValid: isValidStartTime, range: epochRange } = validateEpochRange(
+			Number(startTime),
+			Number(endTime),
+		);
+
+		if (isValidStartTime && epochRange?.startTime && epochRange?.endTime) {
+			onCustomDateHandler?.([epochRange?.startTime, epochRange?.endTime]);
 
-		if (inputValue.length > 0) {
 			setOpen(false);
-		} else {
-			setOpen(true);
+
+			return;
 		}
 
-		setInputValue(inputValue);
+		const {
+			isValid: isValidTimeRange,
+			errorDetails,
+			startTimeMs,
+			endTimeMs,
+		} = validateTimeRange(
+			startTime,
+			endTime,
+			DATE_TIME_FORMATS.UK_DATETIME_SECONDS,
+		);
 
-		// Call the debounced function with the input value
-		debouncedHandleInputChange(inputValue);
+		if (!isValidTimeRange) {
+			setInputStatus(CustomTimePickerInputStatus.ERROR);
+			onError(true);
+			setInputErrorDetails(errorDetails || null);
+			return;
+		}
+
+		onCustomDateHandler?.([dayjs(startTimeMs), dayjs(endTimeMs)]);
+
+		setOpen(false);
 	};
 
 	const handleSelect = (label: string, value: string): void => {
-		if (label === 'Custom') {
+		if (value === 'custom') {
 			setCustomDTPickerVisible?.(true);
 			return;
 		}
 
 		onSelect(value);
 		setSelectedTimePlaceholderValue(label);
-		setInputStatus('');
-		onError(false);
-		setInputErrorMessage(null);
+		resetErrorStatus();
 		setInputValue('');
+
 		if (value !== 'custom') {
 			hide();
 		}
@@ -305,20 +422,48 @@ function CustomTimePicker({
 		</div>
 	);
 
-	const handleFocus = (): void => {
-		setIsInputFocused(true);
-		setActiveView('datetime');
+	const handleOpen = (e: React.SyntheticEvent): void => {
+		e.stopPropagation();
+
+		if (showLiveLogs) {
+			setOpen(true);
+			setSelectedTimePlaceholderValue('Live');
+			setInputValue('Live');
+			return;
+		}
+
+		setOpen(true);
+		// reset the input status and error message as we reset the time to previous correct value
+		resetErrorStatus();
+
+		const startTime = dayjs(minTime / 1000_000).format(
+			DATE_TIME_FORMATS.UK_DATETIME_SECONDS,
+		);
+		const endTime = dayjs(maxTime / 1000_000).format(
+			DATE_TIME_FORMATS.UK_DATETIME_SECONDS,
+		);
+
+		setInputValue(`${startTime} - ${endTime}`);
 	};
 
-	const handleBlur = (): void => {
-		setIsInputFocused(false);
+	const handleClose = (e: React.MouseEvent): void => {
+		e.stopPropagation();
+		setOpen(false);
+		setCustomDTPickerVisible?.(false);
+
+		if (showLiveLogs) {
+			setInputValue('Live');
+			return;
+		}
+
+		// set the input value to a relative format if the selected time is not custom
+		const inputValue = getSelectedTimeRangeLabel(selectedTime, selectedValue);
+		setInputValue(inputValue);
 	};
 
 	// this is required as TopNav component wraps the components and we need to clear the state on path change
 	useEffect(() => {
-		setInputStatus('');
-		onError(false);
-		setInputErrorMessage(null);
+		resetErrorStatus();
 		setInputValue('');
 		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [location.pathname]);
@@ -335,6 +480,10 @@ function CustomTimePicker({
 		);
 	};
 
+	const handleInputBlur = (): void => {
+		resetErrorStatus();
+	};
+
 	const getTooltipTitle = (): string => {
 		if (selectedTime === 'custom' && inputValue === '' && !open) {
 			return `${dayjs(minTime / 1000_000)
@@ -349,27 +498,19 @@ function CustomTimePicker({
 		return '';
 	};
 
-	const getInputPrefix = (): JSX.Element => {
-		if (showLiveLogs) {
-			return (
-				<div className="time-input-prefix">
-					<div className="live-dot-icon" />
-				</div>
-			);
+	// Focus and select input text when popover opens
+	useEffect(() => {
+		if (open && inputRef.current) {
+			// Use setTimeout to wait for React to update the DOM and make input editable
+			setTimeout(() => {
+				const inputElement = inputRef.current?.input;
+				if (inputElement) {
+					inputElement.focus();
+					inputElement.select();
+				}
+			}, 0);
 		}
-
-		return (
-			<div className="time-input-prefix">
-				{inputValue && inputStatus === 'success' ? (
-					<CheckCircle size={14} color="#51E7A8" />
-				) : (
-					<Tooltip title="Enter time in format (e.g., 1m, 2h, 3d, 4w)">
-						<Clock size={14} className="cursor-pointer" />
-					</Tooltip>
-				)}
-			</div>
-		);
-	};
+	}, [open]);
 
 	return (
 		<div className="custom-time-picker">
@@ -385,9 +526,10 @@ function CustomTimePicker({
 					content={
 						newPopover ? (
 							<CustomTimePickerPopoverContent
+								isLiveLogsEnabled={!!showLiveLogs}
 								setIsOpen={setOpen}
-								customDateTimeVisible={defaultTo(customDateTimeVisible, false)}
 								setCustomDTPickerVisible={defaultTo(setCustomDTPickerVisible, noop)}
+								customDateTimeVisible={defaultTo(customDateTimeVisible, false)}
 								onCustomDateHandler={defaultTo(onCustomDateHandler, noop)}
 								onSelectHandler={handleSelect}
 								onGoLive={defaultTo(onGoLive, noop)}
@@ -399,6 +541,10 @@ function CustomTimePicker({
 								setIsOpenedFromFooter={setIsOpenedFromFooter}
 								isOpenedFromFooter={isOpenedFromFooter}
 								showRecentlyUsed={showRecentlyUsed}
+								customDateTimeInputStatus={inputStatus}
+								inputErrorDetails={inputErrorDetails}
+								minTime={minTime}
+								maxTime={maxTime}
 							/>
 						) : (
 							content
@@ -407,25 +553,32 @@ function CustomTimePicker({
 					arrow={false}
 					trigger="click"
 					open={open}
+					destroyTooltipOnHide
 					onOpenChange={handleOpenChange}
 					style={{
 						padding: 0,
 					}}
 				>
 					<Input
-						className="timeSelection-input"
+						ref={inputRef}
+						className={cx(
+							'timeSelection-input',
+							inputStatus === CustomTimePickerInputStatus.ERROR ? 'error' : '',
+						)}
 						type="text"
-						status={inputValue && inputStatus === 'error' ? 'error' : ''}
-						placeholder={
-							isInputFocused
-								? 'Time Format (1m or 2h or 3d or 4w)'
-								: selectedTimePlaceholderValue
+						status={
+							inputValue && inputStatus === CustomTimePickerInputStatus.ERROR
+								? 'error'
+								: ''
 						}
+						readOnly={!open || showLiveLogs}
+						placeholder={selectedTimePlaceholderValue}
 						value={inputValue}
-						onFocus={handleFocus}
-						onClick={handleFocus}
-						onBlur={handleBlur}
+						onFocus={handleOpen}
+						onClick={handleOpen}
 						onChange={handleInputChange}
+						onPressEnter={handleInputPressEnter}
+						onBlur={handleInputBlur}
 						data-1p-ignore
 						prefix={getInputPrefix()}
 						suffix={
@@ -435,24 +588,25 @@ function CustomTimePicker({
 										<span>{activeTimezoneOffset}</span>
 									</div>
 								)}
-								<ChevronDown
-									size={14}
-									className="cursor-pointer time-input-suffix-icon-badge"
-									onClick={(e): void => {
-										e.stopPropagation();
-										handleViewChange('datetime');
-									}}
-								/>
+
+								{open ? (
+									<ChevronUp
+										size={14}
+										className="cursor-pointer time-input-suffix-icon-badge"
+										onClick={handleClose}
+									/>
+								) : (
+									<ChevronDown
+										size={14}
+										className="cursor-pointer time-input-suffix-icon-badge"
+										onClick={handleOpen}
+									/>
+								)}
 							</div>
 						}
 					/>
 				</Popover>
 			</Tooltip>
-			{inputStatus === 'error' && inputErrorMessage && (
-				<Typography.Title level={5} className="valid-format-error">
-					{inputErrorMessage}
-				</Typography.Title>
-			)}
 		</div>
 	);
 }

frontend/src/components/CustomTimePicker/CustomTimePickerPopoverContent.tsx

@@ -4,7 +4,6 @@ import { Color } from '@signozhq/design-tokens';
 import { Button } from 'antd';
 import logEvent from 'api/common/logEvent';
 import cx from 'classnames';
-import DatePickerV2 from 'components/DatePickerV2/DatePickerV2';
 import { DATE_TIME_FORMATS } from 'constants/dateTimeFormats';
 import { QueryParams } from 'constants/query';
 import ROUTES from 'constants/routes';
@@ -15,7 +14,7 @@ import {
 	RelativeDurationSuggestionOptions,
 } from 'container/TopNav/DateTimeSelectionV2/config';
 import dayjs from 'dayjs';
-import { Clock, PenLine } from 'lucide-react';
+import { Clock, PenLine, TriangleAlertIcon } from 'lucide-react';
 import { useTimezone } from 'providers/Timezone';
 import {
 	Dispatch,
@@ -27,10 +26,23 @@ import {
 } from 'react';
 import { useLocation } from 'react-router-dom';
 import { getCustomTimeRanges } from 'utils/customTimeRangeUtils';
+import { TimeRangeValidationResult } from 'utils/timeUtils';
 
+import CalendarContainer from './CalendarContainer';
+import { CustomTimePickerInputStatus } from './CustomTimePicker';
 import TimezonePicker from './TimezonePicker';
 
+const TO_MILLISECONDS_FACTOR = 1000_000;
+
+export type DateRange = {
+	from: Date | undefined;
+	to?: Date | undefined;
+};
+
 interface CustomTimePickerPopoverContentProps {
+	isLiveLogsEnabled: boolean;
+	minTime: number;
+	maxTime: number;
 	options: any[];
 	setIsOpen: Dispatch<SetStateAction<boolean>>;
 	customDateTimeVisible: boolean;
@@ -48,6 +60,8 @@ interface CustomTimePickerPopoverContentProps {
 	setIsOpenedFromFooter: Dispatch<SetStateAction<boolean>>;
 	onExitLiveLogs: () => void;
 	showRecentlyUsed: boolean;
+	customDateTimeInputStatus: CustomTimePickerInputStatus;
+	inputErrorDetails: TimeRangeValidationResult['errorDetails'] | null;
 }
 
 interface RecentlyUsedDateTimeRange {
@@ -58,8 +72,29 @@ interface RecentlyUsedDateTimeRange {
 	to: string;
 }
 
+const getDateRange = (
+	minTime: number,
+	maxTime: number,
+	timezone: string,
+): DateRange => {
+	const from = dayjs(minTime / TO_MILLISECONDS_FACTOR)
+		.tz(timezone)
+		.startOf('day')
+		.toDate();
+
+	const to = dayjs(maxTime / TO_MILLISECONDS_FACTOR)
+		.tz(timezone)
+		.endOf('day')
+		.toDate();
+
+	return { from, to };
+};
+
 // eslint-disable-next-line sonarjs/cognitive-complexity
 function CustomTimePickerPopoverContent({
+	isLiveLogsEnabled,
+	minTime,
+	maxTime,
 	options,
 	setIsOpen,
 	customDateTimeVisible,
@@ -74,6 +109,8 @@ function CustomTimePickerPopoverContent({
 	setIsOpenedFromFooter,
 	onExitLiveLogs,
 	showRecentlyUsed = true,
+	customDateTimeInputStatus = CustomTimePickerInputStatus.UNSET,
+	inputErrorDetails,
 }: CustomTimePickerPopoverContentProps): JSX.Element {
 	const { pathname } = useLocation();
 
@@ -83,6 +120,9 @@ function CustomTimePickerPopoverContent({
 
 	const url = new URLSearchParams(window.location.search);
 
+	const { timezone } = useTimezone();
+	const activeTimezoneOffset = timezone.offset;
+
 	let panelTypeFromURL = url.get(QueryParams.panelTypes);
 
 	try {
@@ -94,8 +134,9 @@ function CustomTimePickerPopoverContent({
 	const isLogsListView =
 		panelTypeFromURL !== 'table' && panelTypeFromURL !== 'graph'; // we do not select list view in the url
 
-	const { timezone } = useTimezone();
-	const activeTimezoneOffset = timezone.offset;
+	const [dateRange, setDateRange] = useState<DateRange>(() =>
+		getDateRange(minTime, maxTime, timezone.value),
+	);
 
 	const [recentlyUsedTimeRanges, setRecentlyUsedTimeRanges] = useState<
 		RecentlyUsedDateTimeRange[]
@@ -177,36 +218,66 @@ function CustomTimePickerPopoverContent({
 		setIsOpen(false);
 	};
 
+	const handleSelectDateRange = (dateRange: DateRange): void => {
+		setDateRange(dateRange);
+	};
+
+	const handleCalendarRangeApply = (): void => {
+		if (dateRange) {
+			const from = dayjs(dateRange.from)
+				.tz(timezone.value)
+				.startOf('day')
+				.toDate();
+			const to = dayjs(dateRange.to).tz(timezone.value).endOf('day').toDate();
+
+			onCustomDateHandler([dayjs(from), dayjs(to)]);
+		}
+		setIsOpen(false);
+	};
+
+	const handleCalendarRangeCancel = (): void => {
+		setCustomDTPickerVisible(false);
+	};
+
 	return (
 		<>
 			<div className="date-time-popover">
-				{!customDateTimeVisible && (
-					<div className="date-time-options">
-						{isLogsExplorerPage && isLogsListView && (
-							<Button className="data-time-live" type="text" onClick={handleGoLive}>
-								Live
-							</Button>
-						)}
-						{options.map((option) => (
-							<Button
-								type="text"
-								key={option.label + option.value}
-								onClick={(): void => {
-									handleExitLiveLogs();
-									onSelectHandler(option.label, option.value);
-								}}
-								className={cx(
-									'date-time-options-btn',
-									customDateTimeVisible
-										? option.value === 'custom' && 'active'
-										: selectedTime === option.value && 'active',
-								)}
-							>
-								{option.label}
-							</Button>
-						))}
-					</div>
-				)}
+				<div className="date-time-options">
+					{isLogsExplorerPage && isLogsListView && (
+						<Button
+							className={cx('data-time-live', isLiveLogsEnabled ? 'active' : '')}
+							type="text"
+							onClick={handleGoLive}
+						>
+							Live
+						</Button>
+					)}
+					{options.map((option) => (
+						<Button
+							type="text"
+							key={option.label + option.value}
+							onClick={(e: React.MouseEvent<HTMLButtonElement>): void => {
+								e.stopPropagation();
+								e.preventDefault();
+								handleExitLiveLogs();
+								onSelectHandler(option.label, option.value);
+							}}
+							className={cx(
+								'date-time-options-btn',
+								customDateTimeVisible
+									? option.value === 'custom' && !isLiveLogsEnabled && 'active'
+									: selectedTime === option.value && !isLiveLogsEnabled && 'active',
+							)}
+						>
+							<span className="time-label">{option.label}</span>
+
+							{option.value !== 'custom' && option.value !== '1month' && (
+								<span className="time-value">{option.value}</span>
+							)}
+						</Button>
+					))}
+				</div>
+
 				<div
 					className={cx(
 						'relative-date-time',
@@ -214,19 +285,38 @@ function CustomTimePickerPopoverContent({
 					)}
 				>
 					{customDateTimeVisible ? (
-						<DatePickerV2
-							onSetCustomDTPickerVisible={setCustomDTPickerVisible}
-							setIsOpen={setIsOpen}
-							onCustomDateHandler={onCustomDateHandler}
+						<CalendarContainer
+							dateRange={dateRange}
+							onSelectDateRange={handleSelectDateRange}
+							onCancel={handleCalendarRangeCancel}
+							onApply={handleCalendarRangeApply}
 						/>
 					) : (
 						<div className="time-selector-container">
+							{customDateTimeInputStatus === CustomTimePickerInputStatus.ERROR &&
+								inputErrorDetails && (
+									<div className="input-error-message-container">
+										<div className="input-error-message-title">
+											<TriangleAlertIcon color={Color.BG_CHERRY_400} size={16} />
+											<span className="input-error-message-text">
+												{inputErrorDetails.message}
+											</span>
+										</div>
+
+										{inputErrorDetails.description && (
+											<p className="input-error-message-description">
+												{inputErrorDetails.description}
+											</p>
+										)}
+									</div>
+								)}
+
 							<div className="relative-times-container">
 								<div className="time-heading">RELATIVE TIMES</div>
 								<div>{getTimeChips(RelativeDurationSuggestionOptions)}</div>
 							</div>
 
-							{showRecentlyUsed && (
+							{showRecentlyUsed && recentlyUsedTimeRanges.length > 0 && (
 								<div className="recently-used-container">
 									<div className="time-heading">RECENTLY USED</div>
 									<div className="recently-used-range">

frontend/src/components/DatePickerV2/DatePickerV2.styles.scss

@@ -1,114 +0,0 @@
-.date-picker-v2-container {
-	display: flex;
-	flex-direction: row;
-}
-
-.custom-date-time-picker-v2 {
-	padding: 12px;
-
-	.periscope-calendar {
-		border-radius: 4px;
-		border: none !important;
-		background: none !important;
-		padding: 8px 0 !important;
-	}
-
-	.periscope-calendar-day {
-		background: none !important;
-
-		&.periscope-calendar-today {
-			&.text-accent-foreground {
-				color: var(--bg-vanilla-100) !important;
-			}
-		}
-
-		button {
-			&:hover {
-				background-color: var(--bg-robin-500) !important;
-				color: var(--bg-vanilla-100) !important;
-			}
-		}
-	}
-
-	.custom-time-selector {
-		display: flex;
-		flex-direction: row;
-		gap: 16px;
-		align-items: center;
-		justify-content: space-between;
-
-		.time-input {
-			border-radius: 4px;
-			border: none !important;
-			background: none !important;
-			padding: 8px 4px !important;
-			color: var(--bg-vanilla-100) !important;
-
-			&::-webkit-calendar-picker-indicator {
-				display: none !important;
-				-webkit-appearance: none;
-				appearance: none;
-			}
-
-			&:focus {
-				border: none !important;
-				outline: none !important;
-				box-shadow: none !important;
-			}
-
-			&:focus-visible {
-				border: none !important;
-				outline: none !important;
-				box-shadow: none !important;
-			}
-		}
-	}
-
-	.custom-date-time-picker-footer {
-		display: flex;
-		flex-direction: row;
-		gap: 8px;
-		align-items: center;
-		justify-content: flex-end;
-		margin-top: 16px;
-
-		.next-btn {
-			width: 80px;
-		}
-
-		.clear-btn {
-			width: 80px;
-		}
-	}
-}
-
-.invalid-date-range-tooltip {
-	.ant-tooltip-inner {
-		color: var(--bg-sakura-500) !important;
-	}
-}
-
-.lightMode {
-	.custom-date-time-picker-v2 {
-		.periscope-calendar-day {
-			&.periscope-calendar-today {
-				&.text-accent-foreground {
-					color: var(--bg-ink-500) !important;
-				}
-			}
-
-			button {
-				&:hover {
-					background-color: var(--bg-robin-500) !important;
-					color: var(--bg-ink-500) !important;
-				}
-			}
-		}
-
-		.custom-time-selector {
-			.time-input {
-				color: var(--bg-ink-500) !important;
-			}
-		}
-	}
-}

frontend/src/components/DatePickerV2/DatePickerV2.tsx

@@ -1,311 +0,0 @@
-import './DatePickerV2.styles.scss';
-
-import { Calendar } from '@signozhq/calendar';
-import { Input } from '@signozhq/input';
-import { Button, Tooltip } from 'antd';
-import cx from 'classnames';
-import { DateTimeRangeType } from 'container/TopNav/CustomDateTimeModal';
-import { LexicalContext } from 'container/TopNav/DateTimeSelectionV2/config';
-import dayjs, { Dayjs } from 'dayjs';
-import { CornerUpLeft, MoveRight } from 'lucide-react';
-import { useTimezone } from 'providers/Timezone';
-import { useRef, useState } from 'react';
-import { useSelector } from 'react-redux';
-import { AppState } from 'store/reducers';
-import { GlobalReducer } from 'types/reducer/globalTime';
-import { addCustomTimeRange } from 'utils/customTimeRangeUtils';
-
-function DatePickerV2({
-	onSetCustomDTPickerVisible,
-	setIsOpen,
-	onCustomDateHandler,
-}: {
-	onSetCustomDTPickerVisible: (visible: boolean) => void;
-	setIsOpen: (isOpen: boolean) => void;
-	onCustomDateHandler: (
-		dateTimeRange: DateTimeRangeType,
-		lexicalContext?: LexicalContext,
-	) => void;
-}): JSX.Element {
-	const { maxTime, minTime } = useSelector<AppState, GlobalReducer>(
-		(state) => state.globalTime,
-	);
-
-	const timeInputRef = useRef<HTMLInputElement>(null);
-
-	const { timezone } = useTimezone();
-
-	const [selectedDateTimeFor, setSelectedDateTimeFor] = useState<'to' | 'from'>(
-		'from',
-	);
-
-	const [selectedFromDateTime, setSelectedFromDateTime] = useState<Dayjs | null>(
-		dayjs(minTime / 1000_000).tz(timezone.value),
-	);
-
-	const [selectedToDateTime, setSelectedToDateTime] = useState<Dayjs | null>(
-		dayjs(maxTime / 1000_000).tz(timezone.value),
-	);
-
-	const handleNext = (): void => {
-		if (selectedDateTimeFor === 'to') {
-			onCustomDateHandler([selectedFromDateTime, selectedToDateTime]);
-
-			addCustomTimeRange([selectedFromDateTime, selectedToDateTime]);
-
-			setIsOpen(false);
-			onSetCustomDTPickerVisible(false);
-			setSelectedDateTimeFor('from');
-		} else {
-			setSelectedDateTimeFor('to');
-		}
-	};
-
-	const handleDateChange = (date: Date | undefined): void => {
-		if (!date) {
-			return;
-		}
-
-		if (selectedDateTimeFor === 'from') {
-			const prevFromDateTime = selectedFromDateTime;
-
-			const newDate = dayjs(date);
-
-			const updatedFromDateTime = prevFromDateTime
-				? prevFromDateTime
-						.year(newDate.year())
-						.month(newDate.month())
-						.date(newDate.date())
-				: dayjs(date).tz(timezone.value);
-
-			setSelectedFromDateTime(updatedFromDateTime);
-		} else {
-			// eslint-disable-next-line sonarjs/no-identical-functions
-			setSelectedToDateTime((prev) => {
-				const newDate = dayjs(date);
-
-				// Update only the date part, keeping time from existing state
-				return prev
-					? prev.year(newDate.year()).month(newDate.month()).date(newDate.date())
-					: dayjs(date).tz(timezone.value);
-			});
-		}
-
-		// focus the time input
-		timeInputRef?.current?.focus();
-	};
-
-	const handleTimeChange = (time: string): void => {
-		// time should have format HH:mm:ss
-		if (!/^\d{2}:\d{2}:\d{2}$/.test(time)) {
-			return;
-		}
-
-		if (selectedDateTimeFor === 'from') {
-			setSelectedFromDateTime((prev) => {
-				if (prev) {
-					return prev
-						.set('hour', parseInt(time.split(':')[0], 10))
-						.set('minute', parseInt(time.split(':')[1], 10))
-						.set('second', parseInt(time.split(':')[2], 10));
-				}
-
-				return prev;
-			});
-		}
-		if (selectedDateTimeFor === 'to') {
-			// eslint-disable-next-line sonarjs/no-identical-functions
-			setSelectedToDateTime((prev) => {
-				if (prev) {
-					return prev
-						.set('hour', parseInt(time.split(':')[0], 10))
-						.set('minute', parseInt(time.split(':')[1], 10))
-						.set('second', parseInt(time.split(':')[2], 10));
-				}
-
-				return prev;
-			});
-		}
-	};
-
-	const getDefaultMonth = (): Date => {
-		let defaultDate = null;
-
-		if (selectedDateTimeFor === 'from') {
-			defaultDate = selectedFromDateTime?.toDate();
-		} else if (selectedDateTimeFor === 'to') {
-			defaultDate = selectedToDateTime?.toDate();
-		}
-
-		return defaultDate ?? new Date();
-	};
-
-	const isValidRange = (): boolean => {
-		if (selectedDateTimeFor === 'to') {
-			return selectedToDateTime?.isAfter(selectedFromDateTime) ?? false;
-		}
-
-		return true;
-	};
-
-	const handleBack = (): void => {
-		setSelectedDateTimeFor('from');
-	};
-
-	const handleHideCustomDTPicker = (): void => {
-		onSetCustomDTPickerVisible(false);
-	};
-
-	const handleSelectDateTimeFor = (selectedDateTimeFor: 'to' | 'from'): void => {
-		setSelectedDateTimeFor(selectedDateTimeFor);
-	};
-
-	return (
-		<div className="date-picker-v2-container">
-			<div className="date-time-custom-options-container">
-				<div
-					className="back-btn"
-					onClick={handleHideCustomDTPicker}
-					role="button"
-					tabIndex={0}
-					onKeyDown={(e): void => {
-						if (e.key === 'Enter') {
-							handleHideCustomDTPicker();
-						}
-					}}
-				>
-					<CornerUpLeft size={16} />
-					<span>Back</span>
-				</div>
-
-				<div className="date-time-custom-options">
-					<div
-						role="button"
-						tabIndex={0}
-						onKeyDown={(e): void => {
-							if (e.key === 'Enter') {
-								handleSelectDateTimeFor('from');
-							}
-						}}
-						className={cx(
-							'date-time-custom-option-from',
-							selectedDateTimeFor === 'from' && 'active',
-						)}
-						onClick={(): void => {
-							handleSelectDateTimeFor('from');
-						}}
-					>
-						<div className="date-time-custom-option-from-title">FROM</div>
-						<div className="date-time-custom-option-from-value">
-							{selectedFromDateTime?.format('YYYY-MM-DD HH:mm:ss')}
-						</div>
-					</div>
-					<div
-						role="button"
-						tabIndex={0}
-						onKeyDown={(e): void => {
-							if (e.key === 'Enter') {
-								handleSelectDateTimeFor('to');
-							}
-						}}
-						className={cx(
-							'date-time-custom-option-to',
-							selectedDateTimeFor === 'to' && 'active',
-						)}
-						onClick={(): void => {
-							handleSelectDateTimeFor('to');
-						}}
-					>
-						<div className="date-time-custom-option-to-title">TO</div>
-						<div className="date-time-custom-option-to-value">
-							{selectedToDateTime?.format('YYYY-MM-DD HH:mm:ss')}
-						</div>
-					</div>
-				</div>
-			</div>
-			<div className="custom-date-time-picker-v2">
-				<Calendar
-					mode="single"
-					required
-					selected={
-						selectedDateTimeFor === 'from'
-							? selectedFromDateTime?.toDate()
-							: selectedToDateTime?.toDate()
-					}
-					key={selectedDateTimeFor + selectedDateTimeFor}
-					onSelect={handleDateChange}
-					defaultMonth={getDefaultMonth()}
-					disabled={(current): boolean => {
-						if (selectedDateTimeFor === 'to') {
-							// disable dates after today and before selectedFromDateTime
-							const currentDay = dayjs(current);
-							return currentDay.isAfter(dayjs()) || false;
-						}
-
-						if (selectedDateTimeFor === 'from') {
-							// disable dates after selectedToDateTime
-
-							return dayjs(current).isAfter(dayjs()) || false;
-						}
-
-						return false;
-					}}
-					className="rounded-md border"
-					navLayout="after"
-				/>
-
-				<div className="custom-time-selector">
-					<label className="text-xs font-normal block" htmlFor="time-picker">
-						Timestamp
-					</label>
-
-					<MoveRight size={16} />
-
-					<div className="time-input-container">
-						<Input
-							type="time"
-							ref={timeInputRef}
-							className="time-input"
-							value={
-								selectedDateTimeFor === 'from'
-									? selectedFromDateTime?.format('HH:mm:ss')
-									: selectedToDateTime?.format('HH:mm:ss')
-							}
-							onChange={(e): void => handleTimeChange(e.target.value)}
-							step="1"
-						/>
-					</div>
-				</div>
-
-				<div className="custom-date-time-picker-footer">
-					{selectedDateTimeFor === 'to' && (
-						<Button
-							className="periscope-btn secondary clear-btn"
-							type="default"
-							onClick={handleBack}
-						>
-							Back
-						</Button>
-					)}
-					<Tooltip
-						title={
-							!isValidRange() ? 'Invalid range: TO date should be after FROM date' : ''
-						}
-						overlayClassName="invalid-date-range-tooltip"
-					>
-						<Button
-							className="periscope-btn primary next-btn"
-							type="primary"
-							onClick={handleNext}
-							disabled={!isValidRange()}
-						>
-							{selectedDateTimeFor === 'from' ? 'Next' : 'Apply'}
-						</Button>
-					</Tooltip>
-				</div>
-			</div>
-		</div>
-	);
-}
-
-export default DatePickerV2;

frontend/src/components/ErrorModal/components/ErrorContent.tsx

@@ -6,13 +6,15 @@ import ErrorIcon from 'assets/Error';
 import OverlayScrollbar from 'components/OverlayScrollbar/OverlayScrollbar';
 import { BookOpenText, ChevronsDown } from 'lucide-react';
 import KeyValueLabel from 'periscope/components/KeyValueLabel';
+import { ReactNode } from 'react';
 import APIError from 'types/api/error';
 
 interface ErrorContentProps {
 	error: APIError;
+	icon?: ReactNode;
 }
 
-function ErrorContent({ error }: ErrorContentProps): JSX.Element {
+function ErrorContent({ error, icon }: ErrorContentProps): JSX.Element {
 	const {
 		url: errorUrl,
 		errors: errorMessages,
@@ -25,9 +27,7 @@ function ErrorContent({ error }: ErrorContentProps): JSX.Element {
 			<section className="error-content__summary-section">
 				<header className="error-content__summary">
 					<div className="error-content__summary-left">
-						<div className="error-content__icon-wrapper">
-							<ErrorIcon />
-						</div>
+						<div className="error-content__icon-wrapper">{icon || <ErrorIcon />}</div>
 
 						<div className="error-content__summary-text">
 							<h2 className="error-content__error-code">{errorCode}</h2>
@@ -95,4 +95,8 @@ function ErrorContent({ error }: ErrorContentProps): JSX.Element {
 	);
 }
 
+ErrorContent.defaultProps = {
+	icon: undefined,
+};
+
 export default ErrorContent;

frontend/src/components/ExplorerCard/test/ExplorerCard.test.tsx

@@ -59,7 +59,7 @@ jest.mock('providers/preferences/sync/usePreferenceSync', () => ({
 		preferences: {
 			columns: [],
 			formatting: {
-				maxLines: 2,
+				maxLines: 1,
 				format: 'table',
 				fontSize: 'small',
 				version: 1,

frontend/src/components/Graph/utils.ts

@@ -1,4 +1,5 @@
 import { Chart, ChartConfiguration, ChartData, Color } from 'chart.js';
+// eslint-disable-next-line import/namespace -- side-effect import that registers Chart.js date adapter
 import * as chartjsAdapter from 'chartjs-adapter-date-fns';
 import { Timezone } from 'components/CustomTimePicker/timezoneUtils';
 import { DATE_TIME_FORMATS } from 'constants/dateTimeFormats';

frontend/src/components/HostMetricsDetail/HostMetricTraces/HostMetricTraces.tsx

@@ -176,6 +176,8 @@ function HostMetricTraces({
 						onTimeChange={handleTimeChange}
 						defaultRelativeTime="5m"
 						modalSelectedInterval={selectedInterval}
+						modalInitialStartTime={timeRange.startTime * 1000}
+						modalInitialEndTime={timeRange.endTime * 1000}
 					/>
 				</div>
 			</div>

frontend/src/components/HostMetricsDetail/HostMetricTraces/constants.ts

@@ -6,7 +6,7 @@ import {
 } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 import { EQueryType } from 'types/common/dashboard';
-import { DataSource } from 'types/common/queryBuilder';
+import { DataSource, ReduceOperators } from 'types/common/queryBuilder';
 import { nanoToMilli } from 'utils/timeUtils';
 
 export const columns = [
@@ -121,7 +121,7 @@ export const getHostTracesQueryPayload = (
 					],
 					groupBy: [],
 					legend: '',
-					reduceTo: 'avg',
+					reduceTo: ReduceOperators.AVG,
 				},
 			],
 			queryFormulas: [],

frontend/src/components/HostMetricsDetail/HostMetricsLogs/HostMetricLogsDetailedView.tsx

@@ -87,6 +87,8 @@ function HostMetricLogsDetailedView({
 						onTimeChange={handleTimeChange}
 						defaultRelativeTime="5m"
 						modalSelectedInterval={selectedInterval}
+						modalInitialStartTime={timeRange.startTime * 1000}
+						modalInitialEndTime={timeRange.endTime * 1000}
 					/>
 				</div>
 			</div>

frontend/src/components/HostMetricsDetail/HostMetricsLogs/constants.ts

@@ -3,7 +3,7 @@ import { GetQueryResultsProps } from 'lib/dashboard/getQueryResults';
 import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
 import { EQueryType } from 'types/common/dashboard';
-import { DataSource } from 'types/common/queryBuilder';
+import { DataSource, ReduceOperators } from 'types/common/queryBuilder';
 import { v4 as uuidv4 } from 'uuid';
 
 export const getHostLogsQueryPayload = (
@@ -45,7 +45,7 @@ export const getHostLogsQueryPayload = (
 					],
 					groupBy: [],
 					legend: '',
-					reduceTo: 'avg',
+					reduceTo: ReduceOperators.AVG,
 					offset: 0,
 					pageSize: 100,
 				},

frontend/src/components/HostMetricsDetail/Metrics/Metrics.tsx

@@ -211,6 +211,8 @@ function Metrics({
 						defaultRelativeTime="5m"
 						isModalTimeSelection={isModalTimeSelection}
 						modalSelectedInterval={selectedInterval}
+						modalInitialStartTime={timeRange.startTime * 1000}
+						modalInitialEndTime={timeRange.endTime * 1000}
 					/>
 				</div>
 			</div>

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

@@ -50,6 +50,13 @@
 			color: var(--bg-vanilla-400) !important;
 			font-size: 12px !important;
 		}
+		&[type='number']::-webkit-inner-spin-button,
+		&[type='number']::-webkit-outer-spin-button {
+			-webkit-appearance: none;
+			-moz-appearance: none;
+			appearance: none;
+			margin: 0;
+		}
 	}
 
 	.close-btn {

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

@@ -1,16 +1,16 @@
 import { DrawerProps } from 'antd';
 import { AddToQueryHOCProps } from 'components/Logs/AddToQueryHOC';
+import { ChangeViewFunctionType } from 'container/ExplorerOptions/types';
 import { ActionItemProps } from 'container/LogDetailedView/ActionItem';
 import { IField } from 'types/api/logs/fields';
 import { ILog } from 'types/api/logs/log';
-import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
 
 import { VIEWS } from './constants';
 
 export type LogDetailProps = {
 	log: ILog | null;
 	selectedTab: VIEWS;
-	onGroupByAttribute?: (fieldKey: string, dataType?: DataTypes) => Promise<void>;
+	handleChangeSelectedView?: ChangeViewFunctionType;
 	isListViewPanel?: boolean;
 	listViewPanelSelectedFields?: IField[] | null;
 } & Pick<AddToQueryHOCProps, 'onAddToQuery'> &

frontend/src/components/LogDetail/index.tsx

@@ -55,11 +55,11 @@ function LogDetailInner({
 	log,
 	onClose,
 	onAddToQuery,
-	onGroupByAttribute,
 	onClickActionItem,
 	selectedTab,
 	isListViewPanel = false,
 	listViewPanelSelectedFields,
+	handleChangeSelectedView,
 }: LogDetailInnerProps): JSX.Element {
 	const initialContextQuery = useInitialQuery(log);
 	const [contextQuery, setContextQuery] = useState<Query | undefined>(
@@ -365,10 +365,10 @@ function LogDetailInner({
 					logData={log}
 					onAddToQuery={onAddToQuery}
 					onClickActionItem={onClickActionItem}
-					onGroupByAttribute={onGroupByAttribute}
 					isListViewPanel={isListViewPanel}
 					selectedOptions={options}
 					listViewPanelSelectedFields={listViewPanelSelectedFields}
+					handleChangeSelectedView={handleChangeSelectedView}
 				/>
 			)}
 			{selectedView === VIEW_TYPES.JSON && <JSONView logData={log} />}

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

@@ -6,6 +6,7 @@ import cx from 'classnames';
 import LogDetail from 'components/LogDetail';
 import { VIEW_TYPES } from 'components/LogDetail/constants';
 import { DATE_TIME_FORMATS } from 'constants/dateTimeFormats';
+import { ChangeViewFunctionType } from 'container/ExplorerOptions/types';
 import { getSanitizedLogBody } from 'container/LogDetailedView/utils';
 import { FontSize } from 'container/OptionsMenu/types';
 import { useActiveLog } from 'hooks/logs/useActiveLog';
@@ -14,7 +15,7 @@ import { useIsDarkMode } from 'hooks/useDarkMode';
 // utils
 import { FlatLogData } from 'lib/logs/flatLogData';
 import { useTimezone } from 'providers/Timezone';
-import { useCallback, useMemo, useState } from 'react';
+import { memo, useCallback, useMemo } from 'react';
 // interfaces
 import { IField } from 'types/api/logs/fields';
 import { ILog } from 'types/api/logs/log';
@@ -108,6 +109,7 @@ type ListLogViewProps = {
 	activeLog?: ILog | null;
 	linesPerRow: number;
 	fontSize: FontSize;
+	handleChangeSelectedView?: ChangeViewFunctionType;
 };
 
 function ListLogView({
@@ -118,19 +120,20 @@ function ListLogView({
 	activeLog,
 	linesPerRow,
 	fontSize,
+	handleChangeSelectedView,
 }: ListLogViewProps): JSX.Element {
 	const flattenLogData = useMemo(() => FlatLogData(logData), [logData]);
 
-	const [hasActionButtons, setHasActionButtons] = useState<boolean>(false);
 	const { isHighlighted, isLogsExplorerPage, onLogCopy } = useCopyLogLink(
 		logData.id,
 	);
+	const isReadOnlyLog = !isLogsExplorerPage;
+
 	const {
 		activeLog: activeContextLog,
 		onAddToQuery: handleAddToQuery,
 		onSetActiveLog: handleSetActiveContextLog,
 		onClearActiveLog: handleClearActiveContextLog,
-		onGroupByAttribute,
 	} = useActiveLog();
 
 	const isDarkMode = useIsDarkMode();
@@ -180,14 +183,6 @@ function ListLogView({
 
 	const logType = getLogIndicatorType(logData);
 
-	const handleMouseEnter = (): void => {
-		setHasActionButtons(true);
-	};
-
-	const handleMouseLeave = (): void => {
-		setHasActionButtons(false);
-	};
-
 	return (
 		<>
 			<Container
@@ -198,8 +193,6 @@ function ListLogView({
 				}
 				$isDarkMode={isDarkMode}
 				$logType={logType}
-				onMouseEnter={handleMouseEnter}
-				onMouseLeave={handleMouseLeave}
 				onClick={handleDetailedView}
 				fontSize={fontSize}
 			>
@@ -251,7 +244,7 @@ function ListLogView({
 					</div>
 				</div>
 
-				{hasActionButtons && isLogsExplorerPage && (
+				{!isReadOnlyLog && (
 					<LogLinesActionButtons
 						handleShowContext={handleShowContext}
 						onLogCopy={onLogCopy}
@@ -264,7 +257,7 @@ function ListLogView({
 					onAddToQuery={handleAddToQuery}
 					selectedTab={VIEW_TYPES.CONTEXT}
 					onClose={handlerClearActiveContextLog}
-					onGroupByAttribute={onGroupByAttribute}
+					handleChangeSelectedView={handleChangeSelectedView}
 				/>
 			)}
 		</>
@@ -273,10 +266,11 @@ function ListLogView({
 
 ListLogView.defaultProps = {
 	activeLog: null,
+	handleChangeSelectedView: undefined,
 };
 
 LogGeneralField.defaultProps = {
 	linesPerRow: 1,
 };
 
-export default ListLogView;
+export default memo(ListLogView);

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

@@ -30,6 +30,11 @@ export const Container = styled(Card)<{
 			? `margin-bottom:0.3rem;`
 			: ``}
 	cursor: pointer;
+
+	&:not(:hover) .log-line-action-buttons {
+		display: none;
+	}
+
 	.ant-card-body {
 		padding: 0.3rem 0.6rem;
 

frontend/src/components/Logs/LogLinesActionButtons/LogLinesActionButtons.tsx

@@ -3,14 +3,15 @@ import './LogLinesActionButtons.styles.scss';
 import { LinkOutlined } from '@ant-design/icons';
 import { Button, Tooltip } from 'antd';
 import { TextSelect } from 'lucide-react';
-import { MouseEventHandler } from 'react';
+import { memo, MouseEventHandler } from 'react';
 
 export interface LogLinesActionButtonsProps {
 	handleShowContext: MouseEventHandler<HTMLElement>;
 	onLogCopy: MouseEventHandler<HTMLElement>;
 	customClassName?: string;
 }
-export default function LogLinesActionButtons({
+
+function LogLinesActionButtons({
 	handleShowContext,
 	onLogCopy,
 	customClassName = '',
@@ -40,3 +41,5 @@ export default function LogLinesActionButtons({
 LogLinesActionButtons.defaultProps = {
 	customClassName: '',
 };
+
+export default memo(LogLinesActionButtons);

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

@@ -4,7 +4,6 @@ import LogDetail from 'components/LogDetail';
 import { VIEW_TYPES, VIEWS } from 'components/LogDetail/constants';
 import { DATE_TIME_FORMATS } from 'constants/dateTimeFormats';
 import { getSanitizedLogBody } from 'container/LogDetailedView/utils';
-import LogsExplorerContext from 'container/LogsExplorerContext';
 import { useActiveLog } from 'hooks/logs/useActiveLog';
 import { useCopyLogLink } from 'hooks/logs/useCopyLogLink';
 // hooks
@@ -14,6 +13,7 @@ import { isEmpty, isNumber, isUndefined } from 'lodash-es';
 import { useTimezone } from 'providers/Timezone';
 import {
 	KeyboardEvent,
+	memo,
 	MouseEvent,
 	MouseEventHandler,
 	useCallback,
@@ -39,6 +39,7 @@ function RawLogView({
 	selectedFields = [],
 	fontSize,
 	onLogClick,
+	handleChangeSelectedView,
 }: RawLogViewProps): JSX.Element {
 	const {
 		isHighlighted: isUrlHighlighted,
@@ -47,19 +48,13 @@ function RawLogView({
 	} = useCopyLogLink(data.id);
 	const flattenLogData = useMemo(() => FlatLogData(data), [data]);
 
-	const {
-		activeLog: activeContextLog,
-		onClearActiveLog: handleClearActiveContextLog,
-	} = useActiveLog();
 	const {
 		activeLog,
 		onSetActiveLog,
 		onClearActiveLog,
 		onAddToQuery,
-		onGroupByAttribute,
 	} = useActiveLog();
 
-	const [hasActionButtons, setHasActionButtons] = useState<boolean>(false);
 	const [selectedTab, setSelectedTab] = useState<VIEWS | undefined>();
 
 	const isDarkMode = useIsDarkMode();
@@ -132,7 +127,7 @@ function RawLogView({
 
 	const handleClickExpand = useCallback(
 		(event: MouseEvent) => {
-			if (activeContextLog || isReadOnly) return;
+			if (isReadOnly) return;
 
 			// Use custom click handler if provided, otherwise use default behavior
 			if (onLogClick) {
@@ -142,7 +137,7 @@ function RawLogView({
 				setSelectedTab(VIEW_TYPES.OVERVIEW);
 			}
 		},
-		[activeContextLog, isReadOnly, data, onSetActiveLog, onLogClick],
+		[isReadOnly, data, onSetActiveLog, onLogClick],
 	);
 
 	const handleCloseLogDetail: DrawerProps['onClose'] = useCallback(
@@ -158,18 +153,6 @@ function RawLogView({
 		[onClearActiveLog],
 	);
 
-	const handleMouseEnter = useCallback(() => {
-		if (isReadOnlyLog) return;
-
-		setHasActionButtons(true);
-	}, [isReadOnlyLog]);
-
-	const handleMouseLeave = useCallback(() => {
-		if (isReadOnlyLog) return;
-
-		setHasActionButtons(false);
-	}, [isReadOnlyLog]);
-
 	const handleShowContext: MouseEventHandler<HTMLElement> = useCallback(
 		(event) => {
 			event.preventDefault();
@@ -196,13 +179,9 @@ function RawLogView({
 			$isDarkMode={isDarkMode}
 			$isReadOnly={isReadOnly}
 			$isHightlightedLog={isUrlHighlighted}
-			$isActiveLog={
-				activeLog?.id === data.id || activeContextLog?.id === data.id || isActiveLog
-			}
+			$isActiveLog={activeLog?.id === data.id || isActiveLog}
 			$isCustomHighlighted={isHighlighted}
 			$logType={logType}
-			onMouseEnter={handleMouseEnter}
-			onMouseLeave={handleMouseLeave}
 			fontSize={fontSize}
 		>
 			<LogStateIndicator
@@ -231,19 +210,13 @@ function RawLogView({
 				dangerouslySetInnerHTML={html}
 			/>
 
-			{hasActionButtons && (
+			{!isReadOnlyLog && (
 				<LogLinesActionButtons
 					handleShowContext={handleShowContext}
 					onLogCopy={onLogCopy}
 				/>
 			)}
 
-			{activeContextLog && (
-				<LogsExplorerContext
-					log={activeContextLog}
-					onClose={handleClearActiveContextLog}
-				/>
-			)}
 			{selectedTab && (
 				<LogDetail
 					selectedTab={selectedTab}
@@ -251,13 +224,12 @@ function RawLogView({
 					onClose={handleCloseLogDetail}
 					onAddToQuery={onAddToQuery}
 					onClickActionItem={onAddToQuery}
-					onGroupByAttribute={onGroupByAttribute}
+					handleChangeSelectedView={handleChangeSelectedView}
 				/>
 			)}
 		</RawLogViewContainer>
 	);
 }
-
 RawLogView.defaultProps = {
 	isActiveLog: false,
 	isReadOnly: false,
@@ -265,4 +237,4 @@ RawLogView.defaultProps = {
 	isHighlighted: false,
 };
 
-export default RawLogView;
+export default memo(RawLogView);

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

@@ -30,6 +30,10 @@ export const RawLogViewContainer = styled(Row)<{
 
 	transition: background-color 0.2s ease-in;
 
+	&:not(:hover) .log-line-action-buttons {
+		display: none;
+	}
+
 	.log-state-indicator {
 		margin: 4px 0;
 

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

@@ -1,3 +1,4 @@
+import { ChangeViewFunctionType } from 'container/ExplorerOptions/types';
 import { FontSize } from 'container/OptionsMenu/types';
 import { MouseEvent } from 'react';
 import { IField } from 'types/api/logs/fields';
@@ -14,6 +15,7 @@ export interface RawLogViewProps {
 	fontSize: FontSize;
 	selectedFields?: IField[];
 	onLogClick?: (log: ILog, event: MouseEvent) => void;
+	handleChangeSelectedView?: ChangeViewFunctionType;
 }
 
 export interface RawLogContentProps {

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

@@ -10,7 +10,7 @@ jest.mock('providers/preferences/sync/usePreferenceSync', () => ({
 		preferences: {
 			columns: [],
 			formatting: {
-				maxLines: 2,
+				maxLines: 1,
 				format: 'table',
 				fontSize: 'small',
 				version: 1,
@@ -51,7 +51,7 @@ describe('LogsFormatOptionsMenu (unit)', () => {
 				selectedOptionFormat="table"
 				config={{
 					format: { value: 'table', onChange: formatOnChange },
-					maxLines: { value: 2, onChange: maxLinesOnChange },
+					maxLines: { value: 1, onChange: maxLinesOnChange },
 					fontSize: { value: FontSize.SMALL, onChange: fontSizeOnChange },
 					addColumn: {
 						isFetching: false,

frontend/src/components/NewSelect/__test__/VariableItem.integration.test.tsx

@@ -7,7 +7,7 @@ import { VirtuosoMockContext } from 'react-virtuoso';
 import configureStore from 'redux-mock-store';
 import { IDashboardVariable } from 'types/api/dashboard/getAll';
 
-import VariableItem from '../../../container/NewDashboard/DashboardVariablesSelection/VariableItem';
+import VariableItem from '../../../container/DashboardContainer/DashboardVariablesSelection/VariableItem';
 
 // Mock the dashboard variables query
 jest.mock('api/dashboard/variables/dashboardVariablesQuery', () => ({

frontend/src/components/NewSelect/utils.ts

@@ -1,5 +1,5 @@
 /* eslint-disable sonarjs/cognitive-complexity */
-import { uniqueOptions } from 'container/NewDashboard/DashboardVariablesSelection/util';
+import { uniqueOptions } from 'container/DashboardContainer/DashboardVariablesSelection/util';
 
 import { OptionData } from './types';
 

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

@@ -560,6 +560,10 @@
 					border: 1px solid var(--bg-vanilla-300) !important;
 					background: var(--bg-vanilla-100) !important;
 					box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1) !important;
+
+					.ant-select-selection-item {
+						color: var(--text-ink-400);
+					}
 				}
 			}
 		}
@@ -569,6 +573,10 @@
 				border: 1px solid var(--bg-vanilla-300) !important;
 				background: var(--bg-vanilla-100) !important;
 				box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1) !important;
+
+				.ant-select-selection-item {
+					color: var(--text-ink-400);
+				}
 			}
 
 			.ant-select-arrow {

frontend/src/components/QueryBuilderV2/QueryV2/MerticsAggregateSection/MetricsAggregateSection.styles.scss

@@ -169,6 +169,10 @@
 					.ant-select-selector {
 						border: 1px solid var(--bg-vanilla-300) !important;
 						background: var(--bg-vanilla-100) !important;
+
+						.ant-select-selection-item {
+							color: var(--text-ink-400);
+						}
 					}
 				}
 			}

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

@@ -32,6 +32,7 @@ const ADD_ONS_KEYS = {
 	ORDER_BY: 'order_by',
 	LIMIT: 'limit',
 	LEGEND_FORMAT: 'legend_format',
+	REDUCE_TO: 'reduce_to',
 };
 
 const ADD_ONS_KEYS_TO_QUERY_PATH = {
@@ -40,13 +41,14 @@ const ADD_ONS_KEYS_TO_QUERY_PATH = {
 	[ADD_ONS_KEYS.ORDER_BY]: 'orderBy',
 	[ADD_ONS_KEYS.LIMIT]: 'limit',
 	[ADD_ONS_KEYS.LEGEND_FORMAT]: 'legend',
+	[ADD_ONS_KEYS.REDUCE_TO]: 'reduceTo',
 };
 
 const ADD_ONS = [
 	{
 		icon: <BarChart2 size={14} />,
 		label: 'Group By',
-		key: 'group_by',
+		key: ADD_ONS_KEYS.GROUP_BY,
 		description:
 			'Break down data by attributes like service name, endpoint, status code, or region. Essential for spotting patterns and comparing performance across different segments.',
 		docLink: 'https://signoz.io/docs/userguide/query-builder-v5/#grouping',
@@ -54,7 +56,7 @@ const ADD_ONS = [
 	{
 		icon: <ScrollText size={14} />,
 		label: 'Having',
-		key: 'having',
+		key: ADD_ONS_KEYS.HAVING,
 		description:
 			'Filter grouped results based on aggregate conditions. Show only groups meeting specific criteria, like error rates > 5% or p99 latency > 500',
 		docLink:
@@ -63,7 +65,7 @@ const ADD_ONS = [
 	{
 		icon: <ScrollText size={14} />,
 		label: 'Order By',
-		key: 'order_by',
+		key: ADD_ONS_KEYS.ORDER_BY,
 		description:
 			'Sort results to surface what matters most. Quickly identify slowest operations, most frequent errors, or highest resource consumers.',
 		docLink:
@@ -72,7 +74,7 @@ const ADD_ONS = [
 	{
 		icon: <ScrollText size={14} />,
 		label: 'Limit',
-		key: 'limit',
+		key: ADD_ONS_KEYS.LIMIT,
 		description:
 			'Show only the top/bottom N results. Perfect for focusing on outliers, reducing noise, and improving dashboard performance.',
 		docLink:
@@ -81,7 +83,7 @@ const ADD_ONS = [
 	{
 		icon: <ScrollText size={14} />,
 		label: 'Legend format',
-		key: 'legend_format',
+		key: ADD_ONS_KEYS.LEGEND_FORMAT,
 		description:
 			'Customize series labels using variables like {{service.name}}-{{endpoint}}. Makes charts readable at a glance during incident investigation.',
 		docLink:
@@ -92,7 +94,7 @@ const ADD_ONS = [
 const REDUCE_TO = {
 	icon: <ScrollText size={14} />,
 	label: 'Reduce to',
-	key: 'reduce_to',
+	key: ADD_ONS_KEYS.REDUCE_TO,
 	description:
 		'Apply mathematical operations like sum, average, min, max, or percentiles to reduce multiple time series into a single value.',
 	docLink:
@@ -218,10 +220,9 @@ function QueryAddOns({
 		);
 
 		const availableAddOnKeys = new Set(filteredAddOns.map((addOn) => addOn.key));
-
 		// Filter and set selected views: add-ons that are both active and available
 		setSelectedViews(
-			ADD_ONS.filter(
+			filteredAddOns.filter(
 				(addOn) =>
 					activeAddOnKeys.has(addOn.key) && availableAddOnKeys.has(addOn.key),
 			),
@@ -375,6 +376,7 @@ function QueryAddOns({
 						<div className="add-on-content" data-testid="limit-content">
 							<InputWithLabel
 								label="Limit"
+								type="number"
 								onChange={handleChangeLimit}
 								initialValue={query?.limit ?? undefined}
 								placeholder="Enter limit"

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

@@ -0,0 +1,118 @@
+/* eslint-disable @typescript-eslint/explicit-function-return-type */
+/* eslint-disable react/display-name */
+import '@testing-library/jest-dom';
+
+import { jest } from '@jest/globals';
+import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
+import { useQueryOperations } from 'hooks/queryBuilder/useQueryBuilderOperations';
+import { render, screen } from 'tests/test-utils';
+import { Having, IBuilderQuery } from 'types/api/queryBuilder/queryBuilderData';
+import { UseQueryOperations } from 'types/common/operations.types';
+import { DataSource, QueryBuilderContextType } from 'types/common/queryBuilder';
+
+import { QueryV2 } from '../QueryV2';
+
+// Local mocks for domain-specific heavy child components
+jest.mock(
+	'../QueryAggregation/QueryAggregation',
+	() =>
+		function () {
+			return <div>QueryAggregation</div>;
+		},
+);
+jest.mock(
+	'../MerticsAggregateSection/MetricsAggregateSection',
+	() =>
+		function () {
+			return <div>MetricsAggregateSection</div>;
+		},
+);
+// Mock hooks
+jest.mock('hooks/queryBuilder/useQueryBuilder');
+jest.mock('hooks/queryBuilder/useQueryBuilderOperations');
+
+const mockedUseQueryBuilder = jest.mocked(useQueryBuilder);
+const mockedUseQueryOperations = jest.mocked(
+	useQueryOperations,
+) as jest.MockedFunction<UseQueryOperations>;
+
+describe('QueryV2 - base render', () => {
+	beforeEach(() => {
+		const mockCloneQuery = jest.fn() as jest.MockedFunction<
+			(type: string, q: IBuilderQuery) => void
+		>;
+
+		mockedUseQueryBuilder.mockReturnValue(({
+			// Only fields used by QueryV2
+			cloneQuery: mockCloneQuery,
+			panelType: null,
+		} as unknown) as QueryBuilderContextType);
+
+		mockedUseQueryOperations.mockReturnValue({
+			isTracePanelType: false,
+			isMetricsDataSource: false,
+			operators: [],
+			spaceAggregationOptions: [],
+			listOfAdditionalFilters: [],
+			handleChangeOperator: jest.fn(),
+			handleSpaceAggregationChange: jest.fn(),
+			handleChangeAggregatorAttribute: jest.fn(),
+			handleChangeDataSource: jest.fn(),
+			handleDeleteQuery: jest.fn(),
+			handleChangeQueryData: (jest.fn() as unknown) as ReturnType<UseQueryOperations>['handleChangeQueryData'],
+			handleChangeFormulaData: jest.fn(),
+			handleQueryFunctionsUpdates: jest.fn(),
+			listOfAdditionalFormulaFilters: [],
+		});
+	});
+
+	afterEach(() => {
+		jest.clearAllMocks();
+	});
+
+	it('renders limit input when dataSource is logs', () => {
+		const baseQuery: IBuilderQuery = {
+			queryName: 'A',
+			dataSource: DataSource.LOGS,
+			aggregateOperator: '',
+			aggregations: [],
+			timeAggregation: '',
+			spaceAggregation: '',
+			temporality: '',
+			functions: [],
+			filter: undefined,
+			filters: { items: [], op: 'AND' },
+			groupBy: [],
+			expression: '',
+			disabled: false,
+			having: [] as Having[],
+			limit: 10,
+			stepInterval: null,
+			orderBy: [],
+			legend: 'A',
+		};
+
+		render(
+			<QueryV2
+				index={0}
+				isAvailableToDisable
+				query={baseQuery}
+				version="v4"
+				onSignalSourceChange={jest.fn() as jest.MockedFunction<(v: string) => void>}
+				signalSourceChangeEnabled={false}
+				queriesCount={1}
+				showTraceOperator={false}
+				hasTraceOperator={false}
+			/>,
+		);
+
+		// Ensure the Limit add-on input is present and is of type number
+		const limitInput = screen.getByPlaceholderText(
+			'Enter limit',
+		) as HTMLInputElement;
+		expect(limitInput).toBeInTheDocument();
+		expect(limitInput).toHaveAttribute('type', 'number');
+		expect(limitInput).toHaveAttribute('name', 'limit');
+		expect(limitInput).toHaveAttribute('data-testid', 'input-Limit');
+	});
+});

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

@@ -1,10 +1,16 @@
 /* eslint-disable */
-import { fireEvent, render, screen } from '@testing-library/react';
-import React from 'react';
+import {
+	fireEvent,
+	render,
+	screen,
+	userEvent,
+	waitFor,
+	within,
+} from 'tests/test-utils';
 
 import QueryAddOns from '../QueryV2/QueryAddOns/QueryAddOns';
 import { PANEL_TYPES } from 'constants/queryBuilder';
-import { DataSource } from 'types/common/queryBuilder';
+import { DataSource, ReduceOperators } from 'types/common/queryBuilder';
 
 // Mocks: only what is required for this component to render and for us to assert handler calls
 const mockHandleChangeQueryData = jest.fn();
@@ -55,16 +61,7 @@ jest.mock('../QueryV2/QueryAddOns/HavingFilter/HavingFilter', () => ({
 	),
 }));
 
-jest.mock(
-	'container/QueryBuilder/filters/ReduceToFilter/ReduceToFilter',
-	() => ({
-		ReduceToFilter: ({ onChange }: any) => (
-			<button data-testid="reduce-to" onClick={() => onChange('sum')}>
-				ReduceToFilter
-			</button>
-		),
-	}),
-);
+// ReduceToFilter is not mocked - we test the actual Ant Design Select component
 
 function baseQuery(overrides: Partial<any> = {}): any {
 	return {
@@ -140,7 +137,7 @@ describe('QueryAddOns', () => {
 		expect(screen.getByTestId('order-by-content')).toBeInTheDocument();
 	});
 
-	it('limit input auto-opens when limit is set and changing it calls handler', () => {
+	it('limit input auto-opens when limit is set and changing it calls handler', async () => {
 		render(
 			<QueryAddOns
 				query={baseQuery({ limit: 5 })}
@@ -183,4 +180,90 @@ describe('QueryAddOns', () => {
 		expect(screen.getByTestId('limit-content')).toBeInTheDocument();
 		expect(limitInput.value).toBe('7');
 	});
+
+	it('shows reduce-to add-on when showReduceTo is true', () => {
+		render(
+			<QueryAddOns
+				query={baseQuery()}
+				version="v5"
+				isListViewPanel={false}
+				showReduceTo
+				panelType={PANEL_TYPES.TIME_SERIES}
+				index={0}
+				isForTraceOperator={false}
+			/>,
+		);
+
+		expect(screen.getByTestId('query-add-on-reduce_to')).toBeInTheDocument();
+	});
+
+	it('auto-opens reduce-to content when reduceTo is set', () => {
+		render(
+			<QueryAddOns
+				query={baseQuery({ reduceTo: ReduceOperators.SUM })}
+				version="v5"
+				isListViewPanel={false}
+				showReduceTo
+				panelType={PANEL_TYPES.TIME_SERIES}
+				index={0}
+				isForTraceOperator={false}
+			/>,
+		);
+
+		expect(screen.getByTestId('reduce-to-content')).toBeInTheDocument();
+	});
+
+	it('calls handleSetQueryData when reduce-to value changes', async () => {
+		const user = userEvent.setup({ pointerEventsCheck: 0 });
+		const query = baseQuery({
+			reduceTo: ReduceOperators.AVG,
+			aggregations: [
+				{ id: 'a', operator: 'count', reduceTo: ReduceOperators.AVG },
+			],
+		});
+		render(
+			<QueryAddOns
+				query={query}
+				version="v5"
+				isListViewPanel={false}
+				showReduceTo
+				panelType={PANEL_TYPES.TIME_SERIES}
+				index={0}
+				isForTraceOperator={false}
+			/>,
+		);
+
+		// Wait for the reduce-to content section to be visible (it auto-opens when reduceTo is set)
+		await waitFor(() => {
+			expect(screen.getByTestId('reduce-to-content')).toBeInTheDocument();
+		});
+
+		// Get the Select component by its role (combobox)
+		// The Select is within the reduce-to-content section
+		const reduceToContent = screen.getByTestId('reduce-to-content');
+		const selectCombobox = within(reduceToContent).getByRole('combobox');
+
+		// Open the dropdown by clicking on the combobox
+		await user.click(selectCombobox);
+
+		// Wait for the dropdown listbox to appear
+		await screen.findByRole('listbox');
+
+		// Find and click the "Sum" option
+		const sumOption = await screen.findByText('Sum of values in timeframe');
+		await user.click(sumOption);
+
+		// Verify the handler was called with the correct value
+		await waitFor(() => {
+			expect(mockHandleSetQueryData).toHaveBeenCalledWith(0, {
+				...query,
+				aggregations: [
+					{
+						...(query.aggregations?.[0] as any),
+						reduceTo: ReduceOperators.SUM,
+					},
+				],
+			});
+		});
+	});
 });

frontend/src/components/QueryBuilderV2/__tests__/utils.test.ts

@@ -6,7 +6,7 @@ import {
 	DataTypes,
 } from 'types/api/queryBuilder/queryAutocompleteResponse';
 import { TagFilter } from 'types/api/queryBuilder/queryBuilderData';
-import { DataSource } from 'types/common/queryBuilder';
+import { DataSource, ReduceOperators } from 'types/common/queryBuilder';
 import { extractQueryPairs } from 'utils/queryContextUtils';
 
 import {
@@ -803,7 +803,7 @@ describe('convertAggregationToExpression', () => {
 			timeAggregation: 'avg',
 			spaceAggregation: 'max',
 			alias: 'test_alias',
-			reduceTo: 'sum',
+			reduceTo: ReduceOperators.SUM,
 			temporality: 'delta',
 		});
 
@@ -812,7 +812,7 @@ describe('convertAggregationToExpression', () => {
 				metricName: 'test_metric',
 				timeAggregation: 'avg',
 				spaceAggregation: 'max',
-				reduceTo: 'sum',
+				reduceTo: ReduceOperators.SUM,
 				temporality: 'delta',
 			},
 		]);

frontend/src/components/QuickFilters/FilterRenderers/Checkbox/Checkbox.tsx

@@ -421,11 +421,16 @@ export default function CheckboxFilter(props: ICheckboxProps): JSX.Element {
 										...currentFilter,
 										value: currentFilter.value.filter((val) => val !== value),
 									};
-
 									if (newFilter.value.length === 0) {
 										query.filters.items = query.filters.items.filter(
 											(item) => !isEqual(item.key?.key, filter.attributeKey.key),
 										);
+										if (query.filter?.expression) {
+											query.filter.expression = removeKeysFromExpression(
+												query.filter.expression,
+												[filter.attributeKey.key],
+											);
+										}
 									} else {
 										query.filters.items = query.filters.items.map((item) => {
 											if (isEqual(item.key?.key, filter.attributeKey.key)) {
@@ -435,6 +440,16 @@ export default function CheckboxFilter(props: ICheckboxProps): JSX.Element {
 										});
 									}
 								} else {
+									const newFilter = {
+										...currentFilter,
+										value: currentFilter.value === value ? null : currentFilter.value,
+									};
+									if (newFilter.value === null && query.filter?.expression) {
+										query.filter.expression = removeKeysFromExpression(
+											query.filter.expression,
+											[filter.attributeKey.key],
+										);
+									}
 									query.filters.items = query.filters.items.filter(
 										(item) => !isEqual(item.key?.key, filter.attributeKey.key),
 									);
@@ -612,7 +627,7 @@ export default function CheckboxFilter(props: ICheckboxProps): JSX.Element {
 											) : (
 												<Typography.Text
 													className="value-string"
-													ellipsis={{ tooltip: { placement: 'right' } }}
+													ellipsis={{ tooltip: { placement: 'top' } }}
 												>
 													{String(value)}
 												</Typography.Text>

frontend/src/components/YAxisUnitSelector/YAxisUnitSelector.tsx

@@ -1,11 +1,18 @@
 import './styles.scss';
 
-import { Select } from 'antd';
+import { WarningFilled } from '@ant-design/icons';
+import { Select, Tooltip } from 'antd';
 import { DefaultOptionType } from 'antd/es/select';
+import classNames from 'classnames';
+import { useMemo } from 'react';
 
 import { UniversalYAxisUnitMappings } from './constants';
 import { UniversalYAxisUnit, YAxisUnitSelectorProps } from './types';
-import { getYAxisCategories, mapMetricUnitToUniversalUnit } from './utils';
+import {
+	getUniversalNameFromMetricUnit,
+	getYAxisCategories,
+	mapMetricUnitToUniversalUnit,
+} from './utils';
 
 function YAxisUnitSelector({
 	value,
@@ -14,9 +21,24 @@ function YAxisUnitSelector({
 	loading = false,
 	'data-testid': dataTestId,
 	source,
+	initialValue,
 }: YAxisUnitSelectorProps): JSX.Element {
 	const universalUnit = mapMetricUnitToUniversalUnit(value);
 
+	const incompatibleUnitMessage = useMemo(() => {
+		if (!initialValue || !value || loading) return '';
+		const initialUniversalUnit = mapMetricUnitToUniversalUnit(initialValue);
+		const currentUniversalUnit = mapMetricUnitToUniversalUnit(value);
+		if (initialUniversalUnit !== currentUniversalUnit) {
+			const initialUniversalUnitName = getUniversalNameFromMetricUnit(
+				initialValue,
+			);
+			const currentUniversalUnitName = getUniversalNameFromMetricUnit(value);
+			return `Unit mismatch. The metric was sent with unit ${initialUniversalUnitName}, but ${currentUniversalUnitName} is selected.`;
+		}
+		return '';
+	}, [initialValue, value, loading]);
+
 	const handleSearch = (
 		searchTerm: string,
 		currentOption: DefaultOptionType | undefined,
@@ -49,7 +71,18 @@ function YAxisUnitSelector({
 				placeholder={placeholder}
 				filterOption={(input, option): boolean => handleSearch(input, option)}
 				loading={loading}
+				suffixIcon={
+					incompatibleUnitMessage ? (
+						<Tooltip title={incompatibleUnitMessage}>
+							<WarningFilled />
+						</Tooltip>
+					) : undefined
+				}
+				className={classNames({
+					'warning-state': incompatibleUnitMessage,
+				})}
 				data-testid={dataTestId}
+				allowClear
 			>
 				{categories.map((category) => (
 					<Select.OptGroup key={category.name} label={category.name}>

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

@@ -91,4 +91,36 @@ describe('YAxisUnitSelector', () => {
 		expect(screen.getByText('Bytes (B)')).toBeInTheDocument();
 		expect(screen.getByText('Seconds (s)')).toBeInTheDocument();
 	});
+
+	it('shows warning message when incompatible unit is selected', () => {
+		render(
+			<YAxisUnitSelector
+				source={YAxisSource.ALERTS}
+				value="By"
+				onChange={mockOnChange}
+				initialValue="s"
+			/>,
+		);
+		const warningIcon = screen.getByLabelText('warning');
+		expect(warningIcon).toBeInTheDocument();
+		fireEvent.mouseOver(warningIcon);
+		return screen
+			.findByText(
+				'Unit mismatch. The metric was sent with unit Seconds (s), but Bytes (B) is selected.',
+			)
+			.then((el) => expect(el).toBeInTheDocument());
+	});
+
+	it('does not show warning message when compatible unit is selected', () => {
+		render(
+			<YAxisUnitSelector
+				source={YAxisSource.ALERTS}
+				value="s"
+				onChange={mockOnChange}
+				initialValue="s"
+			/>,
+		);
+		const warningIcon = screen.queryByLabelText('warning');
+		expect(warningIcon).not.toBeInTheDocument();
+	});
 });

frontend/src/components/YAxisUnitSelector/styles.scss

@@ -3,3 +3,17 @@
 		width: 220px;
 	}
 }
+
+.warning-state {
+	.ant-select-selector {
+		border-color: var(--bg-amber-400) !important;
+	}
+
+	.anticon {
+		color: var(--bg-amber-400) !important;
+	}
+
+	.ant-select-clear {
+		right: 28px;
+	}
+}

frontend/src/components/YAxisUnitSelector/types.ts

@@ -6,6 +6,7 @@ export interface YAxisUnitSelectorProps {
 	disabled?: boolean;
 	'data-testid'?: string;
 	source: YAxisSource;
+	initialValue?: string;
 }
 
 export enum UniversalYAxisUnit {

frontend/src/constants/app.ts

@@ -1,5 +1,7 @@
 import ROUTES from './routes';
 
+export const DOCS_BASE_URL = process.env.DOCS_BASE_URL || 'https://signoz.io';
+
 export const WITHOUT_SESSION_PATH = ['/redirect'];
 
 export const AUTH0_REDIRECT_PATH = '/redirect';

frontend/src/constants/query.ts

@@ -51,4 +51,7 @@ export enum QueryParams {
 	thresholds = 'thresholds',
 	selectedExplorerView = 'selectedExplorerView',
 	variables = 'variables',
+	version = 'version',
+	showNewCreateAlertsPage = 'showNewCreateAlertsPage',
+	source = 'source',
 }

frontend/src/constants/queryBuilder.ts

@@ -138,11 +138,11 @@ export const mapOfFormulaToFilters: Record<
 };
 
 export const REDUCE_TO_VALUES: SelectOption<ReduceOperators, string>[] = [
-	{ value: 'last', label: 'Latest of values in timeframe' },
-	{ value: 'sum', label: 'Sum of values in timeframe' },
-	{ value: 'avg', label: 'Average of values in timeframe' },
-	{ value: 'max', label: 'Max of values in timeframe' },
-	{ value: 'min', label: 'Min of values in timeframe' },
+	{ value: ReduceOperators.LAST, label: 'Latest of values in timeframe' },
+	{ value: ReduceOperators.SUM, label: 'Sum of values in timeframe' },
+	{ value: ReduceOperators.AVG, label: 'Average of values in timeframe' },
+	{ value: ReduceOperators.MAX, label: 'Max of values in timeframe' },
+	{ value: ReduceOperators.MIN, label: 'Min of values in timeframe' },
 ];
 
 export const initialHavingValues: HavingForm = {
@@ -180,7 +180,7 @@ export const initialQueryBuilderFormValues: IBuilderQuery = {
 			temporality: '',
 			timeAggregation: MetricAggregateOperator.COUNT,
 			spaceAggregation: MetricAggregateOperator.SUM,
-			reduceTo: 'avg',
+			reduceTo: ReduceOperators.AVG,
 		},
 	],
 	functions: [],
@@ -196,7 +196,7 @@ export const initialQueryBuilderFormValues: IBuilderQuery = {
 	orderBy: [],
 	groupBy: [],
 	legend: '',
-	reduceTo: 'avg',
+	reduceTo: ReduceOperators.AVG,
 	source: '',
 };
 
@@ -228,7 +228,7 @@ export const initialQueryBuilderFormMeterValues: IBuilderQuery = {
 			temporality: '',
 			timeAggregation: MeterAggregateOperator.COUNT,
 			spaceAggregation: MeterAggregateOperator.SUM,
-			reduceTo: 'avg',
+			reduceTo: ReduceOperators.AVG,
 		},
 	],
 	functions: [],
@@ -244,7 +244,7 @@ export const initialQueryBuilderFormMeterValues: IBuilderQuery = {
 	orderBy: [],
 	groupBy: [],
 	legend: '',
-	reduceTo: 'avg',
+	reduceTo: ReduceOperators.AVG,
 };
 
 export const initialQueryBuilderFormValuesMap: Record<
@@ -301,6 +301,7 @@ export const initialQueryState: QueryState = {
 	builder: initialQueryBuilderData,
 	clickhouse_sql: [initialClickHouseData],
 	promql: [initialQueryPromQLData],
+	unit: '',
 };
 
 const initialQueryWithType: Query = {

frontend/src/constants/queryFunctionOptions.ts

@@ -68,8 +68,8 @@ export const metricQueryFunctionOptions: SelectOption<string, string>[] = [
 		label: 'Time Shift',
 	},
 	{
-		value: QueryFunctionsTypes.TIME_SHIFT,
-		label: 'Time Shift',
+		value: QueryFunctionsTypes.FILL_ZERO,
+		label: 'Fill Zero',
 	},
 ];
 
@@ -156,4 +156,7 @@ export const queryFunctionsTypesConfig: QueryFunctionConfigType = {
 		showInput: true,
 		inputType: 'text',
 	},
+	fillZero: {
+		showInput: false,
+	},
 };

frontend/src/constants/reactQueryKeys.ts

@@ -55,6 +55,7 @@ export const REACT_QUERY_KEY = {
 	GET_METRIC_DETAILS: 'GET_METRIC_DETAILS',
 	GET_RELATED_METRICS: 'GET_RELATED_METRICS',
 	GET_INSPECT_METRICS_DETAILS: 'GET_INSPECT_METRICS_DETAILS',
+	GET_METRIC_METADATA: 'GET_METRIC_METADATA',
 
 	// Traces Funnels Query Keys
 	GET_DOMAINS_LIST: 'GET_DOMAINS_LIST',

frontend/src/constants/routes.ts

@@ -27,6 +27,7 @@ const ROUTES = {
 	ALERTS_NEW: '/alerts/new',
 	ALERT_HISTORY: '/alerts/history',
 	ALERT_OVERVIEW: '/alerts/overview',
+	ALERT_TYPE_SELECTION: '/alerts/type-selection',
 	ALL_CHANNELS: '/settings/channels',
 	CHANNELS_NEW: '/settings/channels/new',
 	CHANNELS_EDIT: '/settings/channels/edit/:channelId',