refactor: update test imports and improve dialog handling

* refactor(ruler): add Rule v2 read type and rename storage Rule to StorableRule

* refactor(ruler): map GettableRule to Rule before responding on v2 routes

* docs(openapi): regenerate spec with RuletypesRule on v2 rules routes

* docs(frontend): regenerate API clients with RuletypesRuleDTO

* refactor(ruler): validate uuid-v7 on delete rule handler

cmd/community/server.go

@@ -7,6 +7,7 @@ import (
 	"github.com/spf13/cobra"
 
 	"github.com/SigNoz/signoz/cmd"
+	"github.com/SigNoz/signoz/pkg/alertmanager"
 	"github.com/SigNoz/signoz/pkg/analytics"
 	"github.com/SigNoz/signoz/pkg/auditor"
 	"github.com/SigNoz/signoz/pkg/authn"
@@ -14,6 +15,7 @@ import (
 	"github.com/SigNoz/signoz/pkg/authz/openfgaauthz"
 	"github.com/SigNoz/signoz/pkg/authz/openfgaschema"
 	"github.com/SigNoz/signoz/pkg/authz/openfgaserver"
+	"github.com/SigNoz/signoz/pkg/cache"
 	"github.com/SigNoz/signoz/pkg/errors"
 	"github.com/SigNoz/signoz/pkg/factory"
 	"github.com/SigNoz/signoz/pkg/gateway"
@@ -26,14 +28,20 @@ import (
 	"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/rulestatehistory"
 	"github.com/SigNoz/signoz/pkg/modules/serviceaccount"
+	"github.com/SigNoz/signoz/pkg/prometheus"
 	"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/ruler"
+	"github.com/SigNoz/signoz/pkg/ruler/signozruler"
 	"github.com/SigNoz/signoz/pkg/signoz"
 	"github.com/SigNoz/signoz/pkg/sqlschema"
 	"github.com/SigNoz/signoz/pkg/sqlstore"
+	"github.com/SigNoz/signoz/pkg/telemetrystore"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
+	"github.com/SigNoz/signoz/pkg/types/telemetrytypes"
 	"github.com/SigNoz/signoz/pkg/version"
 	"github.com/SigNoz/signoz/pkg/zeus"
 	"github.com/SigNoz/signoz/pkg/zeus/noopzeus"
@@ -75,7 +83,7 @@ func runServer(ctx context.Context, config signoz.Config, logger *slog.Logger) e
 		},
 		signoz.NewEmailingProviderFactories(),
 		signoz.NewCacheProviderFactories(),
-		signoz.NewWebProviderFactories(),
+		signoz.NewWebProviderFactories(config.Global),
 		func(sqlstore sqlstore.SQLStore) factory.NamedMap[factory.ProviderFactory[sqlschema.SQLSchema, sqlschema.Config]] {
 			return signoz.NewSQLSchemaProviderFactories(sqlstore)
 		},
@@ -107,6 +115,9 @@ func runServer(ctx context.Context, config signoz.Config, logger *slog.Logger) e
 		func(_ sqlstore.SQLStore, _ global.Global, _ zeus.Zeus, _ gateway.Gateway, _ licensing.Licensing, _ serviceaccount.Module, _ cloudintegration.Config) (cloudintegration.Module, error) {
 			return implcloudintegration.NewModule(), nil
 		},
+		func(c cache.Cache, am alertmanager.Alertmanager, ss sqlstore.SQLStore, ts telemetrystore.TelemetryStore, ms telemetrytypes.MetadataStore, p prometheus.Prometheus, og organization.Getter, rsh rulestatehistory.Module, q querier.Querier, qp queryparser.QueryParser) factory.NamedMap[factory.ProviderFactory[ruler.Ruler, ruler.Config]] {
+			return factory.MustNewNamedMap(signozruler.NewFactory(c, am, ss, ts, ms, p, og, rsh, q, qp, nil, nil))
+		},
 	)
 	if err != nil {
 		logger.ErrorContext(ctx, "failed to create signoz", errors.Attr(err))

cmd/enterprise/server.go

@@ -22,14 +22,17 @@ import (
 	"github.com/SigNoz/signoz/ee/modules/dashboard/impldashboard"
 	eequerier "github.com/SigNoz/signoz/ee/querier"
 	enterpriseapp "github.com/SigNoz/signoz/ee/query-service/app"
+	eerules "github.com/SigNoz/signoz/ee/query-service/rules"
 	"github.com/SigNoz/signoz/ee/sqlschema/postgressqlschema"
 	"github.com/SigNoz/signoz/ee/sqlstore/postgressqlstore"
 	enterprisezeus "github.com/SigNoz/signoz/ee/zeus"
 	"github.com/SigNoz/signoz/ee/zeus/httpzeus"
+	"github.com/SigNoz/signoz/pkg/alertmanager"
 	"github.com/SigNoz/signoz/pkg/analytics"
 	"github.com/SigNoz/signoz/pkg/auditor"
 	"github.com/SigNoz/signoz/pkg/authn"
 	"github.com/SigNoz/signoz/pkg/authz"
+	"github.com/SigNoz/signoz/pkg/cache"
 	"github.com/SigNoz/signoz/pkg/errors"
 	"github.com/SigNoz/signoz/pkg/factory"
 	"github.com/SigNoz/signoz/pkg/gateway"
@@ -40,15 +43,21 @@ import (
 	"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/rulestatehistory"
 	"github.com/SigNoz/signoz/pkg/modules/serviceaccount"
+	"github.com/SigNoz/signoz/pkg/prometheus"
 	"github.com/SigNoz/signoz/pkg/querier"
 	"github.com/SigNoz/signoz/pkg/queryparser"
+	"github.com/SigNoz/signoz/pkg/ruler"
+	"github.com/SigNoz/signoz/pkg/ruler/signozruler"
 	"github.com/SigNoz/signoz/pkg/signoz"
 	"github.com/SigNoz/signoz/pkg/sqlschema"
 	"github.com/SigNoz/signoz/pkg/sqlstore"
 	"github.com/SigNoz/signoz/pkg/sqlstore/sqlstorehook"
+	"github.com/SigNoz/signoz/pkg/telemetrystore"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
 	"github.com/SigNoz/signoz/pkg/types/cloudintegrationtypes"
+	"github.com/SigNoz/signoz/pkg/types/telemetrytypes"
 	"github.com/SigNoz/signoz/pkg/version"
 	"github.com/SigNoz/signoz/pkg/zeus"
 )
@@ -96,7 +105,7 @@ func runServer(ctx context.Context, config signoz.Config, logger *slog.Logger) e
 		},
 		signoz.NewEmailingProviderFactories(),
 		signoz.NewCacheProviderFactories(),
-		signoz.NewWebProviderFactories(),
+		signoz.NewWebProviderFactories(config.Global),
 		func(sqlstore sqlstore.SQLStore) factory.NamedMap[factory.ProviderFactory[sqlschema.SQLSchema, sqlschema.Config]] {
 			existingFactories := signoz.NewSQLSchemaProviderFactories(sqlstore)
 			if err := existingFactories.Add(postgressqlschema.NewFactory(sqlstore)); err != nil {
@@ -166,6 +175,9 @@ func runServer(ctx context.Context, config signoz.Config, logger *slog.Logger) e
 
 			return implcloudintegration.NewModule(pkgcloudintegration.NewStore(sqlStore), global, zeus, gateway, licensing, serviceAccount, cloudProvidersMap, config)
 		},
+		func(c cache.Cache, am alertmanager.Alertmanager, ss sqlstore.SQLStore, ts telemetrystore.TelemetryStore, ms telemetrytypes.MetadataStore, p prometheus.Prometheus, og organization.Getter, rsh rulestatehistory.Module, q querier.Querier, qp queryparser.QueryParser) factory.NamedMap[factory.ProviderFactory[ruler.Ruler, ruler.Config]] {
+			return factory.MustNewNamedMap(signozruler.NewFactory(c, am, ss, ts, ms, p, og, rsh, q, qp, eerules.PrepareTaskFunc, eerules.TestNotification))
+		},
 	)
 	if err != nil {
 		logger.ErrorContext(ctx, "failed to create signoz", errors.Attr(err))

conf/example.yaml

@@ -6,6 +6,8 @@
 ##################### Global #####################
 global:
   # the url under which the signoz apiserver is externally reachable.
+  # the path component (e.g. /signoz in https://example.com/signoz) is used
+  # as the base path for all HTTP routes (both API and web frontend).
   external_url: <unset>
   # the url where the SigNoz backend receives telemetry data (traces, metrics, logs) from instrumented applications.
   ingestion_url: <unset>
@@ -50,8 +52,8 @@ pprof:
 web:
   # Whether to enable the web frontend
   enabled: true
-  # The prefix to serve web on
-  prefix: /
+  # The index file to use as the SPA entrypoint.
+  index: index.html
   # The directory containing the static build files.
   directory: /etc/signoz/web
 

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

@@ -14,7 +14,6 @@ import (
 	"github.com/SigNoz/signoz/pkg/query-service/app/logparsingpipeline"
 	"github.com/SigNoz/signoz/pkg/query-service/interfaces"
 	basemodel "github.com/SigNoz/signoz/pkg/query-service/model"
-	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/version"
@@ -23,7 +22,6 @@ import (
 
 type APIHandlerOptions struct {
 	DataConnector                 interfaces.Reader
-	RulesManager                  *rules.Manager
 	UsageManager                  *usage.Manager
 	IntegrationsController        *integrations.Controller
 	CloudIntegrationsController   *cloudintegrations.Controller
@@ -43,7 +41,6 @@ type APIHandler struct {
 func NewAPIHandler(opts APIHandlerOptions, signoz *signoz.SigNoz, config signoz.Config) (*APIHandler, error) {
 	baseHandler, err := baseapp.NewAPIHandler(baseapp.APIHandlerOpts{
 		Reader:                        opts.DataConnector,
-		RuleManager:                   opts.RulesManager,
 		IntegrationsController:        opts.IntegrationsController,
 		CloudIntegrationsController:   opts.CloudIntegrationsController,
 		LogsParsingPipelineController: opts.LogsParsingPipelineController,
@@ -64,10 +61,6 @@ func NewAPIHandler(opts APIHandlerOptions, signoz *signoz.SigNoz, config signoz.
 	return ah, nil
 }
 
-func (ah *APIHandler) RM() *rules.Manager {
-	return ah.opts.RulesManager
-}
-
 func (ah *APIHandler) UM() *usage.Manager {
 	return ah.opts.UsageManager
 }

ee/query-service/app/server.go

@@ -12,10 +12,6 @@ import (
 
 	"github.com/SigNoz/signoz/pkg/cache/memorycache"
 	"github.com/SigNoz/signoz/pkg/errors"
-	"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"
 
 	"github.com/gorilla/handlers"
 
@@ -23,18 +19,10 @@ import (
 	"github.com/soheilhy/cmux"
 
 	"github.com/SigNoz/signoz/ee/query-service/app/api"
-	"github.com/SigNoz/signoz/ee/query-service/rules"
 	"github.com/SigNoz/signoz/ee/query-service/usage"
-	"github.com/SigNoz/signoz/pkg/alertmanager"
 	"github.com/SigNoz/signoz/pkg/cache"
 	"github.com/SigNoz/signoz/pkg/http/middleware"
-	"github.com/SigNoz/signoz/pkg/modules/organization"
-	"github.com/SigNoz/signoz/pkg/modules/rulestatehistory"
-	"github.com/SigNoz/signoz/pkg/prometheus"
-	"github.com/SigNoz/signoz/pkg/querier"
 	"github.com/SigNoz/signoz/pkg/signoz"
-	"github.com/SigNoz/signoz/pkg/sqlstore"
-	"github.com/SigNoz/signoz/pkg/telemetrystore"
 	"github.com/SigNoz/signoz/pkg/web"
 
 	"log/slog"
@@ -49,7 +37,6 @@ import (
 	opAmpModel "github.com/SigNoz/signoz/pkg/query-service/app/opamp/model"
 	baseconst "github.com/SigNoz/signoz/pkg/query-service/constants"
 	"github.com/SigNoz/signoz/pkg/query-service/healthcheck"
-	baserules "github.com/SigNoz/signoz/pkg/query-service/rules"
 	"github.com/SigNoz/signoz/pkg/query-service/utils"
 )
 
@@ -57,7 +44,6 @@ import (
 type Server struct {
 	config      signoz.Config
 	signoz      *signoz.SigNoz
-	ruleManager *baserules.Manager
 
 	// public http router
 	httpConn     net.Listener
@@ -97,24 +83,6 @@ func NewServer(config signoz.Config, signoz *signoz.SigNoz) (*Server, error) {
 		nil,
 	)
 
-	rm, err := makeRulesManager(
-		signoz.Cache,
-		signoz.Alertmanager,
-		signoz.SQLStore,
-		signoz.TelemetryStore,
-		signoz.TelemetryMetadataStore,
-		signoz.Prometheus,
-		signoz.Modules.OrgGetter,
-		signoz.Modules.RuleStateHistory,
-		signoz.Querier,
-		signoz.Instrumentation.ToProviderSettings(),
-		signoz.QueryParser,
-	)
-
-	if err != nil {
-		return nil, err
-	}
-
 	// initiate opamp
 	opAmpModel.Init(signoz.SQLStore, signoz.Instrumentation.Logger(), signoz.Modules.OrgGetter)
 
@@ -163,7 +131,6 @@ func NewServer(config signoz.Config, signoz *signoz.SigNoz) (*Server, error) {
 
 	apiOpts := api.APIHandlerOptions{
 		DataConnector:                 reader,
-		RulesManager:                  rm,
 		UsageManager:                  usageManager,
 		IntegrationsController:        integrationsController,
 		CloudIntegrationsController:   cloudIntegrationsController,
@@ -180,8 +147,7 @@ func NewServer(config signoz.Config, signoz *signoz.SigNoz) (*Server, error) {
 
 	s := &Server{
 		config:             config,
-		signoz:             signoz,
-		ruleManager:        rm,
+		signoz:       signoz,
 		httpHostPort:       baseconst.HTTPHostPort,
 		unavailableChannel: make(chan healthcheck.Status),
 		usageManager:       usageManager,
@@ -262,6 +228,20 @@ func (s *Server) createPublicServer(apiHandler *api.APIHandler, web web.Web) (*h
 		return nil, err
 	}
 
+	routePrefix := s.config.Global.ExternalPath()
+	if routePrefix != "" {
+		prefixed := http.StripPrefix(routePrefix, handler)
+		handler = http.HandlerFunc(func(w http.ResponseWriter, req *http.Request) {
+			switch req.URL.Path {
+			case "/api/v1/health", "/api/v2/healthz", "/api/v2/readyz", "/api/v2/livez":
+				r.ServeHTTP(w, req)
+				return
+			}
+
+			prefixed.ServeHTTP(w, req)
+		})
+	}
+
 	return &http.Server{
 		Handler: handler,
 	}, nil
@@ -288,8 +268,6 @@ func (s *Server) initListeners() error {
 
 // Start listening on http and private http port concurrently
 func (s *Server) Start(ctx context.Context) error {
-	s.ruleManager.Start(ctx)
-
 	err := s.initListeners()
 	if err != nil {
 		return err
@@ -333,47 +311,9 @@ func (s *Server) Stop(ctx context.Context) error {
 
 	s.opampServer.Stop()
 
-	if s.ruleManager != nil {
-		s.ruleManager.Stop(ctx)
-	}
-
 	// stop usage manager
 	s.usageManager.Stop(ctx)
 
 	return nil
 }
 
-func makeRulesManager(cache cache.Cache, alertmanager alertmanager.Alertmanager, sqlstore sqlstore.SQLStore, telemetryStore telemetrystore.TelemetryStore, metadataStore telemetrytypes.MetadataStore, prometheus prometheus.Prometheus, orgGetter organization.Getter, ruleStateHistoryModule rulestatehistory.Module, 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(),
-		Querier:                querier,
-		Logger:                 providerSettings.Logger,
-		Cache:                  cache,
-		EvalDelay:              baseconst.GetEvalDelay(),
-		PrepareTaskFunc:        rules.PrepareTaskFunc,
-		PrepareTestRuleFunc:    rules.TestNotification,
-		Alertmanager:           alertmanager,
-		OrgGetter:              orgGetter,
-		RuleStore:              ruleStore,
-		MaintenanceStore:       maintenanceStore,
-		SQLStore:               sqlstore,
-		QueryParser:            queryParser,
-		RuleStateHistoryModule: ruleStateHistoryModule,
-	}
-
-	// create Manager
-	manager, err := baserules.NewManager(managerOpts)
-	if err != nil {
-		return nil, fmt.Errorf("rule manager error: %v", err)
-	}
-
-	slog.Info("rules manager is ready")
-
-	return manager, nil
-}

frontend/jest.config.ts

@@ -45,7 +45,7 @@ const config: Config.InitialOptions = {
 		'^.+\\.(js|jsx)$': 'babel-jest',
 	},
 	transformIgnorePatterns: [
-		'node_modules/(?!(lodash-es|react-dnd|core-dnd|@react-dnd|dnd-core|react-dnd-html5-backend|axios|@signozhq/design-tokens|@signozhq/table|@signozhq/calendar|@signozhq/input|@signozhq/popover|@signozhq/button|@signozhq/*|date-fns|d3-interpolate|d3-color|api|@codemirror|@lezer|@marijn|@grafana|nuqs)/)',
+		'node_modules/(?!(lodash-es|react-dnd|core-dnd|@react-dnd|dnd-core|react-dnd-html5-backend|axios|@signozhq/design-tokens|@signozhq/table|@signozhq/calendar|@signozhq/input|@signozhq/popover|@signozhq/*|date-fns|d3-interpolate|d3-color|api|@codemirror|@lezer|@marijn|@grafana|nuqs)/)',
 	],
 	setupFilesAfterEnv: ['<rootDir>/jest.setup.ts'],
 	testPathIgnorePatterns: ['/node_modules/', '/public/'],

frontend/jest.setup.ts

@@ -24,6 +24,10 @@ window.matchMedia =
 		};
 	};
 
+if (!HTMLElement.prototype.scrollIntoView) {
+	HTMLElement.prototype.scrollIntoView = function (): void {};
+}
+
 // Patch getComputedStyle to handle CSS parsing errors from @signozhq/* packages.
 // These packages inject CSS at import time via style-inject / vite-plugin-css-injected-by-js.
 // jsdom's nwsapi cannot parse some of the injected selectors (e.g. Tailwind's :animate-in),

frontend/package.json

@@ -48,22 +48,8 @@
     "@radix-ui/react-tooltip": "1.0.7",
     "@sentry/react": "8.41.0",
     "@sentry/vite-plugin": "2.22.6",
-    "@signozhq/button": "0.0.2",
-    "@signozhq/calendar": "0.0.0",
-    "@signozhq/callout": "0.0.2",
-    "@signozhq/checkbox": "0.0.2",
-    "@signozhq/combobox": "0.0.2",
-    "@signozhq/command": "0.0.0",
     "@signozhq/design-tokens": "2.1.4",
-    "@signozhq/dialog": "^0.0.2",
-    "@signozhq/drawer": "0.0.4",
     "@signozhq/icons": "0.1.0",
-    "@signozhq/input": "0.0.2",
-    "@signozhq/popover": "0.0.0",
-    "@signozhq/radio-group": "0.0.2",
-    "@signozhq/resizable": "0.0.0",
-    "@signozhq/table": "0.3.7",
-    "@signozhq/toggle-group": "0.0.1",
     "@signozhq/ui": "0.0.5",
     "@tanstack/react-table": "8.21.3",
     "@tanstack/react-virtual": "3.13.22",

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

@@ -0,0 +1,496 @@
+/**
+ * ! Do not edit manually
+ * * The file has been auto-generated using Orval for SigNoz
+ * * regenerate with 'yarn generate:api'
+ * SigNoz
+ */
+import type {
+	InvalidateOptions,
+	MutationFunction,
+	QueryClient,
+	QueryFunction,
+	QueryKey,
+	UseMutationOptions,
+	UseMutationResult,
+	UseQueryOptions,
+	UseQueryResult,
+} from 'react-query';
+import { useMutation, useQuery } from 'react-query';
+
+import type { BodyType, ErrorType } from '../../../generatedAPIInstance';
+import { GeneratedAPIInstance } from '../../../generatedAPIInstance';
+import type {
+	CreateDowntimeSchedule201,
+	DeleteDowntimeScheduleByIDPathParameters,
+	GetDowntimeScheduleByID200,
+	GetDowntimeScheduleByIDPathParameters,
+	ListDowntimeSchedules200,
+	ListDowntimeSchedulesParams,
+	RenderErrorResponseDTO,
+	RuletypesPostablePlannedMaintenanceDTO,
+	UpdateDowntimeScheduleByIDPathParameters,
+} from '../sigNoz.schemas';
+
+/**
+ * This endpoint lists all planned maintenance / downtime schedules
+ * @summary List downtime schedules
+ */
+export const listDowntimeSchedules = (
+	params?: ListDowntimeSchedulesParams,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<ListDowntimeSchedules200>({
+		url: `/api/v1/downtime_schedules`,
+		method: 'GET',
+		params,
+		signal,
+	});
+};
+
+export const getListDowntimeSchedulesQueryKey = (
+	params?: ListDowntimeSchedulesParams,
+) => {
+	return [`/api/v1/downtime_schedules`, ...(params ? [params] : [])] as const;
+};
+
+export const getListDowntimeSchedulesQueryOptions = <
+	TData = Awaited<ReturnType<typeof listDowntimeSchedules>>,
+	TError = ErrorType<RenderErrorResponseDTO>
+>(
+	params?: ListDowntimeSchedulesParams,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof listDowntimeSchedules>>,
+			TError,
+			TData
+		>;
+	},
+) => {
+	const { query: queryOptions } = options ?? {};
+
+	const queryKey =
+		queryOptions?.queryKey ?? getListDowntimeSchedulesQueryKey(params);
+
+	const queryFn: QueryFunction<
+		Awaited<ReturnType<typeof listDowntimeSchedules>>
+	> = ({ signal }) => listDowntimeSchedules(params, signal);
+
+	return { queryKey, queryFn, ...queryOptions } as UseQueryOptions<
+		Awaited<ReturnType<typeof listDowntimeSchedules>>,
+		TError,
+		TData
+	> & { queryKey: QueryKey };
+};
+
+export type ListDowntimeSchedulesQueryResult = NonNullable<
+	Awaited<ReturnType<typeof listDowntimeSchedules>>
+>;
+export type ListDowntimeSchedulesQueryError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary List downtime schedules
+ */
+
+export function useListDowntimeSchedules<
+	TData = Awaited<ReturnType<typeof listDowntimeSchedules>>,
+	TError = ErrorType<RenderErrorResponseDTO>
+>(
+	params?: ListDowntimeSchedulesParams,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof listDowntimeSchedules>>,
+			TError,
+			TData
+		>;
+	},
+): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
+	const queryOptions = getListDowntimeSchedulesQueryOptions(params, options);
+
+	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
+		queryKey: QueryKey;
+	};
+
+	query.queryKey = queryOptions.queryKey;
+
+	return query;
+}
+
+/**
+ * @summary List downtime schedules
+ */
+export const invalidateListDowntimeSchedules = async (
+	queryClient: QueryClient,
+	params?: ListDowntimeSchedulesParams,
+	options?: InvalidateOptions,
+): Promise<QueryClient> => {
+	await queryClient.invalidateQueries(
+		{ queryKey: getListDowntimeSchedulesQueryKey(params) },
+		options,
+	);
+
+	return queryClient;
+};
+
+/**
+ * This endpoint creates a new planned maintenance / downtime schedule
+ * @summary Create downtime schedule
+ */
+export const createDowntimeSchedule = (
+	ruletypesPostablePlannedMaintenanceDTO: BodyType<RuletypesPostablePlannedMaintenanceDTO>,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<CreateDowntimeSchedule201>({
+		url: `/api/v1/downtime_schedules`,
+		method: 'POST',
+		headers: { 'Content-Type': 'application/json' },
+		data: ruletypesPostablePlannedMaintenanceDTO,
+		signal,
+	});
+};
+
+export const getCreateDowntimeScheduleMutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof createDowntimeSchedule>>,
+		TError,
+		{ data: BodyType<RuletypesPostablePlannedMaintenanceDTO> },
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof createDowntimeSchedule>>,
+	TError,
+	{ data: BodyType<RuletypesPostablePlannedMaintenanceDTO> },
+	TContext
+> => {
+	const mutationKey = ['createDowntimeSchedule'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+		  'mutationKey' in options.mutation &&
+		  options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof createDowntimeSchedule>>,
+		{ data: BodyType<RuletypesPostablePlannedMaintenanceDTO> }
+	> = (props) => {
+		const { data } = props ?? {};
+
+		return createDowntimeSchedule(data);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type CreateDowntimeScheduleMutationResult = NonNullable<
+	Awaited<ReturnType<typeof createDowntimeSchedule>>
+>;
+export type CreateDowntimeScheduleMutationBody = BodyType<RuletypesPostablePlannedMaintenanceDTO>;
+export type CreateDowntimeScheduleMutationError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Create downtime schedule
+ */
+export const useCreateDowntimeSchedule = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof createDowntimeSchedule>>,
+		TError,
+		{ data: BodyType<RuletypesPostablePlannedMaintenanceDTO> },
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof createDowntimeSchedule>>,
+	TError,
+	{ data: BodyType<RuletypesPostablePlannedMaintenanceDTO> },
+	TContext
+> => {
+	const mutationOptions = getCreateDowntimeScheduleMutationOptions(options);
+
+	return useMutation(mutationOptions);
+};
+/**
+ * This endpoint deletes a downtime schedule by ID
+ * @summary Delete downtime schedule
+ */
+export const deleteDowntimeScheduleByID = ({
+	id,
+}: DeleteDowntimeScheduleByIDPathParameters) => {
+	return GeneratedAPIInstance<void>({
+		url: `/api/v1/downtime_schedules/${id}`,
+		method: 'DELETE',
+	});
+};
+
+export const getDeleteDowntimeScheduleByIDMutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof deleteDowntimeScheduleByID>>,
+		TError,
+		{ pathParams: DeleteDowntimeScheduleByIDPathParameters },
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof deleteDowntimeScheduleByID>>,
+	TError,
+	{ pathParams: DeleteDowntimeScheduleByIDPathParameters },
+	TContext
+> => {
+	const mutationKey = ['deleteDowntimeScheduleByID'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+		  'mutationKey' in options.mutation &&
+		  options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof deleteDowntimeScheduleByID>>,
+		{ pathParams: DeleteDowntimeScheduleByIDPathParameters }
+	> = (props) => {
+		const { pathParams } = props ?? {};
+
+		return deleteDowntimeScheduleByID(pathParams);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type DeleteDowntimeScheduleByIDMutationResult = NonNullable<
+	Awaited<ReturnType<typeof deleteDowntimeScheduleByID>>
+>;
+
+export type DeleteDowntimeScheduleByIDMutationError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Delete downtime schedule
+ */
+export const useDeleteDowntimeScheduleByID = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof deleteDowntimeScheduleByID>>,
+		TError,
+		{ pathParams: DeleteDowntimeScheduleByIDPathParameters },
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof deleteDowntimeScheduleByID>>,
+	TError,
+	{ pathParams: DeleteDowntimeScheduleByIDPathParameters },
+	TContext
+> => {
+	const mutationOptions = getDeleteDowntimeScheduleByIDMutationOptions(options);
+
+	return useMutation(mutationOptions);
+};
+/**
+ * This endpoint returns a downtime schedule by ID
+ * @summary Get downtime schedule by ID
+ */
+export const getDowntimeScheduleByID = (
+	{ id }: GetDowntimeScheduleByIDPathParameters,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<GetDowntimeScheduleByID200>({
+		url: `/api/v1/downtime_schedules/${id}`,
+		method: 'GET',
+		signal,
+	});
+};
+
+export const getGetDowntimeScheduleByIDQueryKey = ({
+	id,
+}: GetDowntimeScheduleByIDPathParameters) => {
+	return [`/api/v1/downtime_schedules/${id}`] as const;
+};
+
+export const getGetDowntimeScheduleByIDQueryOptions = <
+	TData = Awaited<ReturnType<typeof getDowntimeScheduleByID>>,
+	TError = ErrorType<RenderErrorResponseDTO>
+>(
+	{ id }: GetDowntimeScheduleByIDPathParameters,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof getDowntimeScheduleByID>>,
+			TError,
+			TData
+		>;
+	},
+) => {
+	const { query: queryOptions } = options ?? {};
+
+	const queryKey =
+		queryOptions?.queryKey ?? getGetDowntimeScheduleByIDQueryKey({ id });
+
+	const queryFn: QueryFunction<
+		Awaited<ReturnType<typeof getDowntimeScheduleByID>>
+	> = ({ signal }) => getDowntimeScheduleByID({ id }, signal);
+
+	return {
+		queryKey,
+		queryFn,
+		enabled: !!id,
+		...queryOptions,
+	} as UseQueryOptions<
+		Awaited<ReturnType<typeof getDowntimeScheduleByID>>,
+		TError,
+		TData
+	> & { queryKey: QueryKey };
+};
+
+export type GetDowntimeScheduleByIDQueryResult = NonNullable<
+	Awaited<ReturnType<typeof getDowntimeScheduleByID>>
+>;
+export type GetDowntimeScheduleByIDQueryError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Get downtime schedule by ID
+ */
+
+export function useGetDowntimeScheduleByID<
+	TData = Awaited<ReturnType<typeof getDowntimeScheduleByID>>,
+	TError = ErrorType<RenderErrorResponseDTO>
+>(
+	{ id }: GetDowntimeScheduleByIDPathParameters,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof getDowntimeScheduleByID>>,
+			TError,
+			TData
+		>;
+	},
+): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
+	const queryOptions = getGetDowntimeScheduleByIDQueryOptions({ id }, options);
+
+	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
+		queryKey: QueryKey;
+	};
+
+	query.queryKey = queryOptions.queryKey;
+
+	return query;
+}
+
+/**
+ * @summary Get downtime schedule by ID
+ */
+export const invalidateGetDowntimeScheduleByID = async (
+	queryClient: QueryClient,
+	{ id }: GetDowntimeScheduleByIDPathParameters,
+	options?: InvalidateOptions,
+): Promise<QueryClient> => {
+	await queryClient.invalidateQueries(
+		{ queryKey: getGetDowntimeScheduleByIDQueryKey({ id }) },
+		options,
+	);
+
+	return queryClient;
+};
+
+/**
+ * This endpoint updates a downtime schedule by ID
+ * @summary Update downtime schedule
+ */
+export const updateDowntimeScheduleByID = (
+	{ id }: UpdateDowntimeScheduleByIDPathParameters,
+	ruletypesPostablePlannedMaintenanceDTO: BodyType<RuletypesPostablePlannedMaintenanceDTO>,
+) => {
+	return GeneratedAPIInstance<void>({
+		url: `/api/v1/downtime_schedules/${id}`,
+		method: 'PUT',
+		headers: { 'Content-Type': 'application/json' },
+		data: ruletypesPostablePlannedMaintenanceDTO,
+	});
+};
+
+export const getUpdateDowntimeScheduleByIDMutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof updateDowntimeScheduleByID>>,
+		TError,
+		{
+			pathParams: UpdateDowntimeScheduleByIDPathParameters;
+			data: BodyType<RuletypesPostablePlannedMaintenanceDTO>;
+		},
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof updateDowntimeScheduleByID>>,
+	TError,
+	{
+		pathParams: UpdateDowntimeScheduleByIDPathParameters;
+		data: BodyType<RuletypesPostablePlannedMaintenanceDTO>;
+	},
+	TContext
+> => {
+	const mutationKey = ['updateDowntimeScheduleByID'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+		  'mutationKey' in options.mutation &&
+		  options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof updateDowntimeScheduleByID>>,
+		{
+			pathParams: UpdateDowntimeScheduleByIDPathParameters;
+			data: BodyType<RuletypesPostablePlannedMaintenanceDTO>;
+		}
+	> = (props) => {
+		const { pathParams, data } = props ?? {};
+
+		return updateDowntimeScheduleByID(pathParams, data);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type UpdateDowntimeScheduleByIDMutationResult = NonNullable<
+	Awaited<ReturnType<typeof updateDowntimeScheduleByID>>
+>;
+export type UpdateDowntimeScheduleByIDMutationBody = BodyType<RuletypesPostablePlannedMaintenanceDTO>;
+export type UpdateDowntimeScheduleByIDMutationError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Update downtime schedule
+ */
+export const useUpdateDowntimeScheduleByID = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof updateDowntimeScheduleByID>>,
+		TError,
+		{
+			pathParams: UpdateDowntimeScheduleByIDPathParameters;
+			data: BodyType<RuletypesPostablePlannedMaintenanceDTO>;
+		},
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof updateDowntimeScheduleByID>>,
+	TError,
+	{
+		pathParams: UpdateDowntimeScheduleByIDPathParameters;
+		data: BodyType<RuletypesPostablePlannedMaintenanceDTO>;
+	},
+	TContext
+> => {
+	const mutationOptions = getUpdateDowntimeScheduleByIDMutationOptions(options);
+
+	return useMutation(mutationOptions);
+};

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

@@ -6,17 +6,24 @@
  */
 import type {
 	InvalidateOptions,
+	MutationFunction,
 	QueryClient,
 	QueryFunction,
 	QueryKey,
+	UseMutationOptions,
+	UseMutationResult,
 	UseQueryOptions,
 	UseQueryResult,
 } from 'react-query';
-import { useQuery } from 'react-query';
+import { useMutation, useQuery } from 'react-query';
 
-import type { ErrorType } from '../../../generatedAPIInstance';
+import type { BodyType, ErrorType } from '../../../generatedAPIInstance';
 import { GeneratedAPIInstance } from '../../../generatedAPIInstance';
 import type {
+	CreateRule201,
+	DeleteRuleByIDPathParameters,
+	GetRuleByID200,
+	GetRuleByIDPathParameters,
 	GetRuleHistoryFilterKeys200,
 	GetRuleHistoryFilterKeysParams,
 	GetRuleHistoryFilterKeysPathParameters,
@@ -35,9 +42,548 @@ import type {
 	GetRuleHistoryTopContributors200,
 	GetRuleHistoryTopContributorsParams,
 	GetRuleHistoryTopContributorsPathParameters,
+	ListRules200,
+	PatchRuleByID200,
+	PatchRuleByIDPathParameters,
 	RenderErrorResponseDTO,
+	RuletypesPostableRuleDTO,
+	TestRule200,
+	UpdateRuleByIDPathParameters,
 } from '../sigNoz.schemas';
 
+/**
+ * This endpoint lists all alert rules with their current evaluation state
+ * @summary List alert rules
+ */
+export const listRules = (signal?: AbortSignal) => {
+	return GeneratedAPIInstance<ListRules200>({
+		url: `/api/v2/rules`,
+		method: 'GET',
+		signal,
+	});
+};
+
+export const getListRulesQueryKey = () => {
+	return [`/api/v2/rules`] as const;
+};
+
+export const getListRulesQueryOptions = <
+	TData = Awaited<ReturnType<typeof listRules>>,
+	TError = ErrorType<RenderErrorResponseDTO>
+>(options?: {
+	query?: UseQueryOptions<Awaited<ReturnType<typeof listRules>>, TError, TData>;
+}) => {
+	const { query: queryOptions } = options ?? {};
+
+	const queryKey = queryOptions?.queryKey ?? getListRulesQueryKey();
+
+	const queryFn: QueryFunction<Awaited<ReturnType<typeof listRules>>> = ({
+		signal,
+	}) => listRules(signal);
+
+	return { queryKey, queryFn, ...queryOptions } as UseQueryOptions<
+		Awaited<ReturnType<typeof listRules>>,
+		TError,
+		TData
+	> & { queryKey: QueryKey };
+};
+
+export type ListRulesQueryResult = NonNullable<
+	Awaited<ReturnType<typeof listRules>>
+>;
+export type ListRulesQueryError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary List alert rules
+ */
+
+export function useListRules<
+	TData = Awaited<ReturnType<typeof listRules>>,
+	TError = ErrorType<RenderErrorResponseDTO>
+>(options?: {
+	query?: UseQueryOptions<Awaited<ReturnType<typeof listRules>>, TError, TData>;
+}): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
+	const queryOptions = getListRulesQueryOptions(options);
+
+	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
+		queryKey: QueryKey;
+	};
+
+	query.queryKey = queryOptions.queryKey;
+
+	return query;
+}
+
+/**
+ * @summary List alert rules
+ */
+export const invalidateListRules = async (
+	queryClient: QueryClient,
+	options?: InvalidateOptions,
+): Promise<QueryClient> => {
+	await queryClient.invalidateQueries(
+		{ queryKey: getListRulesQueryKey() },
+		options,
+	);
+
+	return queryClient;
+};
+
+/**
+ * This endpoint creates a new alert rule
+ * @summary Create alert rule
+ */
+export const createRule = (
+	ruletypesPostableRuleDTO: BodyType<RuletypesPostableRuleDTO>,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<CreateRule201>({
+		url: `/api/v2/rules`,
+		method: 'POST',
+		headers: { 'Content-Type': 'application/json' },
+		data: ruletypesPostableRuleDTO,
+		signal,
+	});
+};
+
+export const getCreateRuleMutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof createRule>>,
+		TError,
+		{ data: BodyType<RuletypesPostableRuleDTO> },
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof createRule>>,
+	TError,
+	{ data: BodyType<RuletypesPostableRuleDTO> },
+	TContext
+> => {
+	const mutationKey = ['createRule'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+		  'mutationKey' in options.mutation &&
+		  options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof createRule>>,
+		{ data: BodyType<RuletypesPostableRuleDTO> }
+	> = (props) => {
+		const { data } = props ?? {};
+
+		return createRule(data);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type CreateRuleMutationResult = NonNullable<
+	Awaited<ReturnType<typeof createRule>>
+>;
+export type CreateRuleMutationBody = BodyType<RuletypesPostableRuleDTO>;
+export type CreateRuleMutationError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Create alert rule
+ */
+export const useCreateRule = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof createRule>>,
+		TError,
+		{ data: BodyType<RuletypesPostableRuleDTO> },
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof createRule>>,
+	TError,
+	{ data: BodyType<RuletypesPostableRuleDTO> },
+	TContext
+> => {
+	const mutationOptions = getCreateRuleMutationOptions(options);
+
+	return useMutation(mutationOptions);
+};
+/**
+ * This endpoint deletes an alert rule by ID
+ * @summary Delete alert rule
+ */
+export const deleteRuleByID = ({ id }: DeleteRuleByIDPathParameters) => {
+	return GeneratedAPIInstance<void>({
+		url: `/api/v2/rules/${id}`,
+		method: 'DELETE',
+	});
+};
+
+export const getDeleteRuleByIDMutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof deleteRuleByID>>,
+		TError,
+		{ pathParams: DeleteRuleByIDPathParameters },
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof deleteRuleByID>>,
+	TError,
+	{ pathParams: DeleteRuleByIDPathParameters },
+	TContext
+> => {
+	const mutationKey = ['deleteRuleByID'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+		  'mutationKey' in options.mutation &&
+		  options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof deleteRuleByID>>,
+		{ pathParams: DeleteRuleByIDPathParameters }
+	> = (props) => {
+		const { pathParams } = props ?? {};
+
+		return deleteRuleByID(pathParams);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type DeleteRuleByIDMutationResult = NonNullable<
+	Awaited<ReturnType<typeof deleteRuleByID>>
+>;
+
+export type DeleteRuleByIDMutationError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Delete alert rule
+ */
+export const useDeleteRuleByID = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof deleteRuleByID>>,
+		TError,
+		{ pathParams: DeleteRuleByIDPathParameters },
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof deleteRuleByID>>,
+	TError,
+	{ pathParams: DeleteRuleByIDPathParameters },
+	TContext
+> => {
+	const mutationOptions = getDeleteRuleByIDMutationOptions(options);
+
+	return useMutation(mutationOptions);
+};
+/**
+ * This endpoint returns an alert rule by ID
+ * @summary Get alert rule by ID
+ */
+export const getRuleByID = (
+	{ id }: GetRuleByIDPathParameters,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<GetRuleByID200>({
+		url: `/api/v2/rules/${id}`,
+		method: 'GET',
+		signal,
+	});
+};
+
+export const getGetRuleByIDQueryKey = ({ id }: GetRuleByIDPathParameters) => {
+	return [`/api/v2/rules/${id}`] as const;
+};
+
+export const getGetRuleByIDQueryOptions = <
+	TData = Awaited<ReturnType<typeof getRuleByID>>,
+	TError = ErrorType<RenderErrorResponseDTO>
+>(
+	{ id }: GetRuleByIDPathParameters,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof getRuleByID>>,
+			TError,
+			TData
+		>;
+	},
+) => {
+	const { query: queryOptions } = options ?? {};
+
+	const queryKey = queryOptions?.queryKey ?? getGetRuleByIDQueryKey({ id });
+
+	const queryFn: QueryFunction<Awaited<ReturnType<typeof getRuleByID>>> = ({
+		signal,
+	}) => getRuleByID({ id }, signal);
+
+	return {
+		queryKey,
+		queryFn,
+		enabled: !!id,
+		...queryOptions,
+	} as UseQueryOptions<
+		Awaited<ReturnType<typeof getRuleByID>>,
+		TError,
+		TData
+	> & { queryKey: QueryKey };
+};
+
+export type GetRuleByIDQueryResult = NonNullable<
+	Awaited<ReturnType<typeof getRuleByID>>
+>;
+export type GetRuleByIDQueryError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Get alert rule by ID
+ */
+
+export function useGetRuleByID<
+	TData = Awaited<ReturnType<typeof getRuleByID>>,
+	TError = ErrorType<RenderErrorResponseDTO>
+>(
+	{ id }: GetRuleByIDPathParameters,
+	options?: {
+		query?: UseQueryOptions<
+			Awaited<ReturnType<typeof getRuleByID>>,
+			TError,
+			TData
+		>;
+	},
+): UseQueryResult<TData, TError> & { queryKey: QueryKey } {
+	const queryOptions = getGetRuleByIDQueryOptions({ id }, options);
+
+	const query = useQuery(queryOptions) as UseQueryResult<TData, TError> & {
+		queryKey: QueryKey;
+	};
+
+	query.queryKey = queryOptions.queryKey;
+
+	return query;
+}
+
+/**
+ * @summary Get alert rule by ID
+ */
+export const invalidateGetRuleByID = async (
+	queryClient: QueryClient,
+	{ id }: GetRuleByIDPathParameters,
+	options?: InvalidateOptions,
+): Promise<QueryClient> => {
+	await queryClient.invalidateQueries(
+		{ queryKey: getGetRuleByIDQueryKey({ id }) },
+		options,
+	);
+
+	return queryClient;
+};
+
+/**
+ * This endpoint applies a partial update to an alert rule by ID
+ * @summary Patch alert rule
+ */
+export const patchRuleByID = (
+	{ id }: PatchRuleByIDPathParameters,
+	ruletypesPostableRuleDTO: BodyType<RuletypesPostableRuleDTO>,
+) => {
+	return GeneratedAPIInstance<PatchRuleByID200>({
+		url: `/api/v2/rules/${id}`,
+		method: 'PATCH',
+		headers: { 'Content-Type': 'application/json' },
+		data: ruletypesPostableRuleDTO,
+	});
+};
+
+export const getPatchRuleByIDMutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof patchRuleByID>>,
+		TError,
+		{
+			pathParams: PatchRuleByIDPathParameters;
+			data: BodyType<RuletypesPostableRuleDTO>;
+		},
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof patchRuleByID>>,
+	TError,
+	{
+		pathParams: PatchRuleByIDPathParameters;
+		data: BodyType<RuletypesPostableRuleDTO>;
+	},
+	TContext
+> => {
+	const mutationKey = ['patchRuleByID'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+		  'mutationKey' in options.mutation &&
+		  options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof patchRuleByID>>,
+		{
+			pathParams: PatchRuleByIDPathParameters;
+			data: BodyType<RuletypesPostableRuleDTO>;
+		}
+	> = (props) => {
+		const { pathParams, data } = props ?? {};
+
+		return patchRuleByID(pathParams, data);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type PatchRuleByIDMutationResult = NonNullable<
+	Awaited<ReturnType<typeof patchRuleByID>>
+>;
+export type PatchRuleByIDMutationBody = BodyType<RuletypesPostableRuleDTO>;
+export type PatchRuleByIDMutationError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Patch alert rule
+ */
+export const usePatchRuleByID = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof patchRuleByID>>,
+		TError,
+		{
+			pathParams: PatchRuleByIDPathParameters;
+			data: BodyType<RuletypesPostableRuleDTO>;
+		},
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof patchRuleByID>>,
+	TError,
+	{
+		pathParams: PatchRuleByIDPathParameters;
+		data: BodyType<RuletypesPostableRuleDTO>;
+	},
+	TContext
+> => {
+	const mutationOptions = getPatchRuleByIDMutationOptions(options);
+
+	return useMutation(mutationOptions);
+};
+/**
+ * This endpoint updates an alert rule by ID
+ * @summary Update alert rule
+ */
+export const updateRuleByID = (
+	{ id }: UpdateRuleByIDPathParameters,
+	ruletypesPostableRuleDTO: BodyType<RuletypesPostableRuleDTO>,
+) => {
+	return GeneratedAPIInstance<void>({
+		url: `/api/v2/rules/${id}`,
+		method: 'PUT',
+		headers: { 'Content-Type': 'application/json' },
+		data: ruletypesPostableRuleDTO,
+	});
+};
+
+export const getUpdateRuleByIDMutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof updateRuleByID>>,
+		TError,
+		{
+			pathParams: UpdateRuleByIDPathParameters;
+			data: BodyType<RuletypesPostableRuleDTO>;
+		},
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof updateRuleByID>>,
+	TError,
+	{
+		pathParams: UpdateRuleByIDPathParameters;
+		data: BodyType<RuletypesPostableRuleDTO>;
+	},
+	TContext
+> => {
+	const mutationKey = ['updateRuleByID'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+		  'mutationKey' in options.mutation &&
+		  options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof updateRuleByID>>,
+		{
+			pathParams: UpdateRuleByIDPathParameters;
+			data: BodyType<RuletypesPostableRuleDTO>;
+		}
+	> = (props) => {
+		const { pathParams, data } = props ?? {};
+
+		return updateRuleByID(pathParams, data);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type UpdateRuleByIDMutationResult = NonNullable<
+	Awaited<ReturnType<typeof updateRuleByID>>
+>;
+export type UpdateRuleByIDMutationBody = BodyType<RuletypesPostableRuleDTO>;
+export type UpdateRuleByIDMutationError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Update alert rule
+ */
+export const useUpdateRuleByID = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof updateRuleByID>>,
+		TError,
+		{
+			pathParams: UpdateRuleByIDPathParameters;
+			data: BodyType<RuletypesPostableRuleDTO>;
+		},
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof updateRuleByID>>,
+	TError,
+	{
+		pathParams: UpdateRuleByIDPathParameters;
+		data: BodyType<RuletypesPostableRuleDTO>;
+	},
+	TContext
+> => {
+	const mutationOptions = getUpdateRuleByIDMutationOptions(options);
+
+	return useMutation(mutationOptions);
+};
 /**
  * Returns distinct label keys from rule history entries for the selected range.
  * @summary Get rule history filter keys
@@ -742,3 +1288,87 @@ export const invalidateGetRuleHistoryTopContributors = async (
 
 	return queryClient;
 };
+
+/**
+ * This endpoint fires a test notification for the given rule definition
+ * @summary Test alert rule
+ */
+export const testRule = (
+	ruletypesPostableRuleDTO: BodyType<RuletypesPostableRuleDTO>,
+	signal?: AbortSignal,
+) => {
+	return GeneratedAPIInstance<TestRule200>({
+		url: `/api/v2/rules/test`,
+		method: 'POST',
+		headers: { 'Content-Type': 'application/json' },
+		data: ruletypesPostableRuleDTO,
+		signal,
+	});
+};
+
+export const getTestRuleMutationOptions = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof testRule>>,
+		TError,
+		{ data: BodyType<RuletypesPostableRuleDTO> },
+		TContext
+	>;
+}): UseMutationOptions<
+	Awaited<ReturnType<typeof testRule>>,
+	TError,
+	{ data: BodyType<RuletypesPostableRuleDTO> },
+	TContext
+> => {
+	const mutationKey = ['testRule'];
+	const { mutation: mutationOptions } = options
+		? options.mutation &&
+		  'mutationKey' in options.mutation &&
+		  options.mutation.mutationKey
+			? options
+			: { ...options, mutation: { ...options.mutation, mutationKey } }
+		: { mutation: { mutationKey } };
+
+	const mutationFn: MutationFunction<
+		Awaited<ReturnType<typeof testRule>>,
+		{ data: BodyType<RuletypesPostableRuleDTO> }
+	> = (props) => {
+		const { data } = props ?? {};
+
+		return testRule(data);
+	};
+
+	return { mutationFn, ...mutationOptions };
+};
+
+export type TestRuleMutationResult = NonNullable<
+	Awaited<ReturnType<typeof testRule>>
+>;
+export type TestRuleMutationBody = BodyType<RuletypesPostableRuleDTO>;
+export type TestRuleMutationError = ErrorType<RenderErrorResponseDTO>;
+
+/**
+ * @summary Test alert rule
+ */
+export const useTestRule = <
+	TError = ErrorType<RenderErrorResponseDTO>,
+	TContext = unknown
+>(options?: {
+	mutation?: UseMutationOptions<
+		Awaited<ReturnType<typeof testRule>>,
+		TError,
+		{ data: BodyType<RuletypesPostableRuleDTO> },
+		TContext
+	>;
+}): UseMutationResult<
+	Awaited<ReturnType<typeof testRule>>,
+	TError,
+	{ data: BodyType<RuletypesPostableRuleDTO> },
+	TContext
+> => {
+	const mutationOptions = getTestRuleMutationOptions(options);
+
+	return useMutation(mutationOptions);
+};

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

@@ -4529,6 +4529,20 @@ export interface RulestatehistorytypesGettableRuleStateWindowDTO {
 	state: RuletypesAlertStateDTO;
 }
 
+export interface RuletypesAlertCompositeQueryDTO {
+	panelType: RuletypesPanelTypeDTO;
+	/**
+	 * @type array
+	 * @nullable true
+	 */
+	queries: Querybuildertypesv5QueryEnvelopeDTO[] | null;
+	queryType: RuletypesQueryTypeDTO;
+	/**
+	 * @type string
+	 */
+	unit?: string;
+}
+
 export enum RuletypesAlertStateDTO {
 	inactive = 'inactive',
 	pending = 'pending',
@@ -4537,6 +4551,513 @@ export enum RuletypesAlertStateDTO {
 	nodata = 'nodata',
 	disabled = 'disabled',
 }
+export enum RuletypesAlertTypeDTO {
+	METRIC_BASED_ALERT = 'METRIC_BASED_ALERT',
+	TRACES_BASED_ALERT = 'TRACES_BASED_ALERT',
+	LOGS_BASED_ALERT = 'LOGS_BASED_ALERT',
+	EXCEPTIONS_BASED_ALERT = 'EXCEPTIONS_BASED_ALERT',
+}
+export interface RuletypesBasicRuleThresholdDTO {
+	/**
+	 * @type array
+	 * @nullable true
+	 */
+	channels?: string[] | null;
+	matchType: RuletypesMatchTypeDTO;
+	/**
+	 * @type string
+	 */
+	name: string;
+	op: RuletypesCompareOperatorDTO;
+	/**
+	 * @type number
+	 * @nullable true
+	 */
+	recoveryTarget?: number | null;
+	/**
+	 * @type number
+	 * @nullable true
+	 */
+	target: number | null;
+	/**
+	 * @type string
+	 */
+	targetUnit?: string;
+}
+
+/**
+ * @nullable
+ */
+export type RuletypesBasicRuleThresholdsDTO =
+	| RuletypesBasicRuleThresholdDTO[]
+	| null;
+
+export enum RuletypesCompareOperatorDTO {
+	above = 'above',
+	below = 'below',
+	equal = 'equal',
+	not_equal = 'not_equal',
+	outside_bounds = 'outside_bounds',
+}
+export interface RuletypesCumulativeScheduleDTO {
+	/**
+	 * @type integer
+	 * @nullable true
+	 */
+	day?: number | null;
+	/**
+	 * @type integer
+	 * @nullable true
+	 */
+	hour?: number | null;
+	/**
+	 * @type integer
+	 * @nullable true
+	 */
+	minute?: number | null;
+	type: RuletypesScheduleTypeDTO;
+	/**
+	 * @type integer
+	 * @nullable true
+	 */
+	weekday?: number | null;
+}
+
+export interface RuletypesCumulativeWindowDTO {
+	/**
+	 * @type string
+	 */
+	frequency: string;
+	schedule: RuletypesCumulativeScheduleDTO;
+	/**
+	 * @type string
+	 */
+	timezone: string;
+}
+
+export interface RuletypesEvaluationCumulativeDTO {
+	kind?: RuletypesEvaluationKindDTO;
+	spec?: RuletypesCumulativeWindowDTO;
+}
+
+export type RuletypesEvaluationEnvelopeDTO =
+	| (RuletypesEvaluationRollingDTO & {
+			kind: RuletypesEvaluationKindDTO;
+			spec: unknown;
+	  })
+	| (RuletypesEvaluationCumulativeDTO & {
+			kind: RuletypesEvaluationKindDTO;
+			spec: unknown;
+	  });
+
+export enum RuletypesEvaluationKindDTO {
+	rolling = 'rolling',
+	cumulative = 'cumulative',
+}
+export interface RuletypesEvaluationRollingDTO {
+	kind?: RuletypesEvaluationKindDTO;
+	spec?: RuletypesRollingWindowDTO;
+}
+
+export interface RuletypesGettableTestRuleDTO {
+	/**
+	 * @type integer
+	 */
+	alertCount?: number;
+	/**
+	 * @type string
+	 */
+	message?: string;
+}
+
+export enum RuletypesMaintenanceKindDTO {
+	fixed = 'fixed',
+	recurring = 'recurring',
+}
+export enum RuletypesMaintenanceStatusDTO {
+	active = 'active',
+	upcoming = 'upcoming',
+	expired = 'expired',
+}
+export enum RuletypesMatchTypeDTO {
+	at_least_once = 'at_least_once',
+	all_the_times = 'all_the_times',
+	on_average = 'on_average',
+	in_total = 'in_total',
+	last = 'last',
+}
+export interface RuletypesNotificationSettingsDTO {
+	/**
+	 * @type array
+	 */
+	groupBy?: string[];
+	/**
+	 * @type string
+	 */
+	newGroupEvalDelay?: string;
+	renotify?: RuletypesRenotifyDTO;
+	/**
+	 * @type boolean
+	 */
+	usePolicy?: boolean;
+}
+
+export enum RuletypesPanelTypeDTO {
+	value = 'value',
+	table = 'table',
+	graph = 'graph',
+}
+export interface RuletypesPlannedMaintenanceDTO {
+	/**
+	 * @type array
+	 * @nullable true
+	 */
+	alertIds?: string[] | null;
+	/**
+	 * @type string
+	 * @format date-time
+	 */
+	createdAt?: Date;
+	/**
+	 * @type string
+	 */
+	createdBy?: string;
+	/**
+	 * @type string
+	 */
+	description?: string;
+	/**
+	 * @type string
+	 */
+	id: string;
+	kind: RuletypesMaintenanceKindDTO;
+	/**
+	 * @type string
+	 */
+	name: string;
+	schedule: RuletypesScheduleDTO;
+	status: RuletypesMaintenanceStatusDTO;
+	/**
+	 * @type string
+	 * @format date-time
+	 */
+	updatedAt?: Date;
+	/**
+	 * @type string
+	 */
+	updatedBy?: string;
+}
+
+export interface RuletypesPostablePlannedMaintenanceDTO {
+	/**
+	 * @type array
+	 * @nullable true
+	 */
+	alertIds?: string[] | null;
+	/**
+	 * @type string
+	 */
+	description?: string;
+	/**
+	 * @type string
+	 */
+	name: string;
+	schedule: RuletypesScheduleDTO;
+}
+
+export type RuletypesPostableRuleDTOAnnotations = { [key: string]: string };
+
+export type RuletypesPostableRuleDTOLabels = { [key: string]: string };
+
+export interface RuletypesPostableRuleDTO {
+	/**
+	 * @type string
+	 */
+	alert: string;
+	alertType?: RuletypesAlertTypeDTO;
+	/**
+	 * @type object
+	 */
+	annotations?: RuletypesPostableRuleDTOAnnotations;
+	condition: RuletypesRuleConditionDTO;
+	/**
+	 * @type string
+	 */
+	description?: string;
+	/**
+	 * @type boolean
+	 */
+	disabled?: boolean;
+	/**
+	 * @type string
+	 */
+	evalWindow?: string;
+	evaluation?: RuletypesEvaluationEnvelopeDTO;
+	/**
+	 * @type string
+	 */
+	frequency?: string;
+	/**
+	 * @type object
+	 */
+	labels?: RuletypesPostableRuleDTOLabels;
+	notificationSettings?: RuletypesNotificationSettingsDTO;
+	/**
+	 * @type array
+	 */
+	preferredChannels?: string[];
+	ruleType: RuletypesRuleTypeDTO;
+	/**
+	 * @type string
+	 */
+	schemaVersion?: string;
+	/**
+	 * @type string
+	 */
+	source?: string;
+	/**
+	 * @type string
+	 */
+	version?: string;
+}
+
+export enum RuletypesQueryTypeDTO {
+	builder = 'builder',
+	clickhouse_sql = 'clickhouse_sql',
+	promql = 'promql',
+}
+export interface RuletypesRecurrenceDTO {
+	/**
+	 * @type string
+	 */
+	duration: string;
+	/**
+	 * @type string
+	 * @format date-time
+	 * @nullable true
+	 */
+	endTime?: Date | null;
+	/**
+	 * @type array
+	 * @nullable true
+	 */
+	repeatOn?: RuletypesRepeatOnDTO[] | null;
+	repeatType: RuletypesRepeatTypeDTO;
+	/**
+	 * @type string
+	 * @format date-time
+	 */
+	startTime: Date;
+}
+
+export interface RuletypesRenotifyDTO {
+	/**
+	 * @type array
+	 */
+	alertStates?: RuletypesAlertStateDTO[];
+	/**
+	 * @type boolean
+	 */
+	enabled?: boolean;
+	/**
+	 * @type string
+	 */
+	interval?: string;
+}
+
+export enum RuletypesRepeatOnDTO {
+	sunday = 'sunday',
+	monday = 'monday',
+	tuesday = 'tuesday',
+	wednesday = 'wednesday',
+	thursday = 'thursday',
+	friday = 'friday',
+	saturday = 'saturday',
+}
+export enum RuletypesRepeatTypeDTO {
+	daily = 'daily',
+	weekly = 'weekly',
+	monthly = 'monthly',
+}
+export interface RuletypesRollingWindowDTO {
+	/**
+	 * @type string
+	 */
+	evalWindow: string;
+	/**
+	 * @type string
+	 */
+	frequency: string;
+}
+
+export type RuletypesRuleDTOAnnotations = { [key: string]: string };
+
+export type RuletypesRuleDTOLabels = { [key: string]: string };
+
+export interface RuletypesRuleDTO {
+	/**
+	 * @type string
+	 */
+	alert: string;
+	alertType?: RuletypesAlertTypeDTO;
+	/**
+	 * @type object
+	 */
+	annotations?: RuletypesRuleDTOAnnotations;
+	condition: RuletypesRuleConditionDTO;
+	/**
+	 * @type string
+	 * @format date-time
+	 */
+	createdAt?: Date;
+	/**
+	 * @type string
+	 */
+	createdBy?: string;
+	/**
+	 * @type string
+	 */
+	description?: string;
+	/**
+	 * @type boolean
+	 */
+	disabled?: boolean;
+	/**
+	 * @type string
+	 */
+	evalWindow?: string;
+	evaluation?: RuletypesEvaluationEnvelopeDTO;
+	/**
+	 * @type string
+	 */
+	frequency?: string;
+	/**
+	 * @type string
+	 */
+	id: string;
+	/**
+	 * @type object
+	 */
+	labels?: RuletypesRuleDTOLabels;
+	notificationSettings?: RuletypesNotificationSettingsDTO;
+	/**
+	 * @type array
+	 */
+	preferredChannels?: string[];
+	ruleType: RuletypesRuleTypeDTO;
+	/**
+	 * @type string
+	 */
+	schemaVersion?: string;
+	/**
+	 * @type string
+	 */
+	source?: string;
+	state: RuletypesAlertStateDTO;
+	/**
+	 * @type string
+	 * @format date-time
+	 */
+	updatedAt?: Date;
+	/**
+	 * @type string
+	 */
+	updatedBy?: string;
+	/**
+	 * @type string
+	 */
+	version?: string;
+}
+
+export interface RuletypesRuleConditionDTO {
+	/**
+	 * @type integer
+	 * @minimum 0
+	 */
+	absentFor?: number;
+	/**
+	 * @type boolean
+	 */
+	alertOnAbsent?: boolean;
+	/**
+	 * @type string
+	 */
+	algorithm?: string;
+	compositeQuery: RuletypesAlertCompositeQueryDTO;
+	matchType: RuletypesMatchTypeDTO;
+	op: RuletypesCompareOperatorDTO;
+	/**
+	 * @type boolean
+	 */
+	requireMinPoints?: boolean;
+	/**
+	 * @type integer
+	 */
+	requiredNumPoints?: number;
+	seasonality?: RuletypesSeasonalityDTO;
+	/**
+	 * @type string
+	 */
+	selectedQueryName?: string;
+	/**
+	 * @type number
+	 * @nullable true
+	 */
+	target?: number | null;
+	/**
+	 * @type string
+	 */
+	targetUnit?: string;
+	thresholds?: RuletypesRuleThresholdDataDTO;
+}
+
+export type RuletypesRuleThresholdDataDTO = RuletypesThresholdBasicDTO & {
+	kind: RuletypesThresholdKindDTO;
+	spec: unknown;
+};
+
+export enum RuletypesRuleTypeDTO {
+	threshold_rule = 'threshold_rule',
+	promql_rule = 'promql_rule',
+	anomaly_rule = 'anomaly_rule',
+}
+export interface RuletypesScheduleDTO {
+	/**
+	 * @type string
+	 * @format date-time
+	 */
+	endTime?: Date;
+	recurrence?: RuletypesRecurrenceDTO;
+	/**
+	 * @type string
+	 * @format date-time
+	 */
+	startTime?: Date;
+	/**
+	 * @type string
+	 */
+	timezone: string;
+}
+
+export enum RuletypesScheduleTypeDTO {
+	hourly = 'hourly',
+	daily = 'daily',
+	weekly = 'weekly',
+	monthly = 'monthly',
+}
+export enum RuletypesSeasonalityDTO {
+	hourly = 'hourly',
+	daily = 'daily',
+	weekly = 'weekly',
+}
+export interface RuletypesThresholdBasicDTO {
+	kind?: RuletypesThresholdKindDTO;
+	spec?: RuletypesBasicRuleThresholdsDTO;
+}
+
+export enum RuletypesThresholdKindDTO {
+	basic = 'basic',
+}
 export interface ServiceaccounttypesGettableFactorAPIKeyDTO {
 	/**
 	 * @type string
@@ -5456,6 +5977,57 @@ export type DeleteAuthDomainPathParameters = {
 export type UpdateAuthDomainPathParameters = {
 	id: string;
 };
+export type ListDowntimeSchedulesParams = {
+	/**
+	 * @type boolean
+	 * @nullable true
+	 * @description undefined
+	 */
+	active?: boolean | null;
+	/**
+	 * @type boolean
+	 * @nullable true
+	 * @description undefined
+	 */
+	recurring?: boolean | null;
+};
+
+export type ListDowntimeSchedules200 = {
+	/**
+	 * @type array
+	 */
+	data: RuletypesPlannedMaintenanceDTO[];
+	/**
+	 * @type string
+	 */
+	status: string;
+};
+
+export type CreateDowntimeSchedule201 = {
+	data: RuletypesPlannedMaintenanceDTO;
+	/**
+	 * @type string
+	 */
+	status: string;
+};
+
+export type DeleteDowntimeScheduleByIDPathParameters = {
+	id: string;
+};
+export type GetDowntimeScheduleByIDPathParameters = {
+	id: string;
+};
+export type GetDowntimeScheduleByID200 = {
+	data: RuletypesPlannedMaintenanceDTO;
+	/**
+	 * @type string
+	 */
+	status: string;
+};
+
+export type UpdateDowntimeScheduleByIDPathParameters = {
+	id: string;
+};
 export type HandleExportRawDataPOSTParams = {
 	/**
 	 * @enum csv,jsonl
@@ -6253,6 +6825,53 @@ export type GetUsersByRoleID200 = {
 	status: string;
 };
 
+export type ListRules200 = {
+	/**
+	 * @type array
+	 */
+	data: RuletypesRuleDTO[];
+	/**
+	 * @type string
+	 */
+	status: string;
+};
+
+export type CreateRule201 = {
+	data: RuletypesRuleDTO;
+	/**
+	 * @type string
+	 */
+	status: string;
+};
+
+export type DeleteRuleByIDPathParameters = {
+	id: string;
+};
+export type GetRuleByIDPathParameters = {
+	id: string;
+};
+export type GetRuleByID200 = {
+	data: RuletypesRuleDTO;
+	/**
+	 * @type string
+	 */
+	status: string;
+};
+
+export type PatchRuleByIDPathParameters = {
+	id: string;
+};
+export type PatchRuleByID200 = {
+	data: RuletypesRuleDTO;
+	/**
+	 * @type string
+	 */
+	status: string;
+};
+
+export type UpdateRuleByIDPathParameters = {
+	id: string;
+};
 export type GetRuleHistoryFilterKeysPathParameters = {
 	id: string;
 };
@@ -6523,6 +7142,14 @@ export type GetRuleHistoryTopContributors200 = {
 	status: string;
 };
 
+export type TestRule200 = {
+	data: RuletypesGettableTestRuleDTO;
+	/**
+	 * @type string
+	 */
+	status: string;
+};
+
 export type GetSessionContext200 = {
 	data: AuthtypesSessionContextDTO;
 	/**

frontend/src/auto-import-registry.d.ts

@@ -10,20 +10,6 @@
 // PR for reference: https://github.com/SigNoz/signoz/pull/9694
 // -------------------------------------------------------------------------
 
-import '@signozhq/button';
-import '@signozhq/calendar';
-import '@signozhq/callout';
-import '@signozhq/checkbox';
-import '@signozhq/combobox';
-import '@signozhq/command';
 import '@signozhq/design-tokens';
-import '@signozhq/dialog';
-import '@signozhq/drawer';
 import '@signozhq/icons';
-import '@signozhq/input';
-import '@signozhq/popover';
-import '@signozhq/radio-group';
-import '@signozhq/resizable';
-import '@signozhq/table';
-import '@signozhq/toggle-group';
 import '@signozhq/ui';

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

@@ -42,6 +42,7 @@
 	height: 32px;
 	padding: 10px 16px;
 	background: var(--l2-background);
+	color: var(--l2-foreground);
 	border: none;
 	border-radius: 2px;
 	cursor: pointer;
@@ -65,10 +66,3 @@
 		opacity: 0.8;
 	}
 }
-
-.lightMode {
-	.auth-header-help-button {
-		background: var(--l2-background);
-		border: 1px solid var(--l1-border);
-	}
-}

frontend/src/components/AuthPageContainer/AuthHeader.tsx

@@ -1,5 +1,5 @@
 import { useCallback } from 'react';
-import { Button } from '@signozhq/button';
+import { Button } from '@signozhq/ui';
 import { LifeBuoy } from 'lucide-react';
 
 import signozBrandLogoUrl from '@/assets/Logos/signoz-brand-logo.svg';
@@ -23,7 +23,7 @@ function AuthHeader(): JSX.Element {
 			</div>
 			<Button
 				className="auth-header-help-button"
-				prefixIcon={<LifeBuoy size={12} />}
+				prefix={<LifeBuoy size={12} />}
 				onClick={handleGetHelp}
 			>
 				Get Help

frontend/src/components/CreateServiceAccountModal/CreateServiceAccountModal.tsx

@@ -1,10 +1,13 @@
 import { Controller, useForm } from 'react-hook-form';
 import { useQueryClient } from 'react-query';
-import { Button } from '@signozhq/button';
-import { DialogFooter, DialogWrapper } from '@signozhq/dialog';
 import { X } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
-import { toast } from '@signozhq/ui';
+import {
+	Button,
+	DialogFooter,
+	DialogWrapper,
+	Input,
+	toast,
+} from '@signozhq/ui';
 import { convertToApiError } from 'api/ErrorResponseHandlerForGeneratedAPIs';
 import {
 	invalidateListServiceAccounts,
@@ -137,6 +140,7 @@ function CreateServiceAccountModal(): JSX.Element {
 
 				<Button
 					type="submit"
+					// @ts-expect-error -- form prop not in @signozhq/ui Button type
 					form="create-sa-form"
 					variant="solid"
 					color="primary"

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

@@ -1,7 +1,13 @@
 import { toast } from '@signozhq/ui';
 import { rest, server } from 'mocks-server/server';
 import { NuqsTestingAdapter } from 'nuqs/adapters/testing';
-import { render, screen, userEvent, waitFor } from 'tests/test-utils';
+import {
+	render,
+	screen,
+	userEvent,
+	waitFor,
+	waitForElementToBeRemoved,
+} from 'tests/test-utils';
 
 import CreateServiceAccountModal from '../CreateServiceAccountModal';
 
@@ -121,12 +127,12 @@ describe('CreateServiceAccountModal', () => {
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
 		renderModal();
 
-		await screen.findByRole('dialog', { name: /New Service Account/i });
+		const dialog = await screen.findByRole('dialog', {
+			name: /New Service Account/i,
+		});
 		await user.click(screen.getByRole('button', { name: /Cancel/i }));
 
-		expect(
-			screen.queryByRole('dialog', { name: /New Service Account/i }),
-		).not.toBeInTheDocument();
+		await waitForElementToBeRemoved(dialog);
 	});
 
 	it('shows "Name is required" after clearing the name field', async () => {

frontend/src/components/CustomTimePicker/CalendarContainer.tsx

@@ -1,4 +1,4 @@
-import { Calendar } from '@signozhq/calendar';
+import { Calendar } from '@signozhq/ui';
 import { Button } from 'antd';
 import { DATE_TIME_FORMATS } from 'constants/dateTimeFormats';
 import dayjs from 'dayjs';

frontend/src/components/CustomTimePicker/CustomTimePicker.tsx

@@ -7,7 +7,7 @@ import {
 	useState,
 } from 'react';
 import { useLocation } from 'react-router-dom';
-import { Button } from '@signozhq/button';
+import { Button } from '@signozhq/ui';
 import { Input, InputRef, Popover, Tooltip } from 'antd';
 import cx from 'classnames';
 import { DATE_TIME_FORMATS } from 'constants/dateTimeFormats';
@@ -661,7 +661,7 @@ function CustomTimePicker({
 						onClick={handleZoomOut}
 						disabled={zoomOutDisabled}
 						data-testid="zoom-out-btn"
-						prefixIcon={<ZoomOut size={14} />}
+						prefix={<ZoomOut size={14} />}
 					/>
 				</Tooltip>
 			)}

frontend/src/components/EditMemberDrawer/DeleteMemberDialog.tsx

@@ -1,6 +1,5 @@
-import { Button } from '@signozhq/button';
-import { DialogFooter, DialogWrapper } from '@signozhq/dialog';
 import { Trash2, X } from '@signozhq/icons';
+import { Button, DialogFooter, DialogWrapper } from '@signozhq/ui';
 import { MemberRow } from 'components/MembersTable/MembersTable';
 
 interface DeleteMemberDialogProps {

frontend/src/components/EditMemberDrawer/EditMemberDrawer.tsx

@@ -1,10 +1,7 @@
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { useCopyToClipboard } from 'react-use';
-import { Button } from '@signozhq/button';
-import { DrawerWrapper } from '@signozhq/drawer';
 import { LockKeyhole, RefreshCw, Trash2, X } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
-import { Badge, toast } from '@signozhq/ui';
+import { Badge, Button, DrawerWrapper, Input, toast } from '@signozhq/ui';
 import { Skeleton, Tooltip } from 'antd';
 import { convertToApiError } from 'api/ErrorResponseHandlerForGeneratedAPIs';
 import type { RenderErrorResponseDTO } from 'api/generated/services/sigNoz.schemas';
@@ -668,14 +665,13 @@ function EditMemberDrawer({
 					}
 				}}
 				direction="right"
-				type="panel"
 				showCloseButton
 				showOverlay={false}
-				allowOutsideClick
-				header={{ title: 'Member Details' }}
-				content={drawerContent}
+				title="Member Details"
 				className="edit-member-drawer"
-			/>
+			>
+				{drawerContent}
+			</DrawerWrapper>
 
 			<ResetLinkDialog
 				open={showResetLinkDialog}

frontend/src/components/EditMemberDrawer/ResetLinkDialog.tsx

@@ -1,6 +1,5 @@
-import { Button } from '@signozhq/button';
-import { DialogWrapper } from '@signozhq/dialog';
 import { Check, Copy } from '@signozhq/icons';
+import { Button, DialogWrapper } from '@signozhq/ui';
 
 interface ResetLinkDialogProps {
 	open: boolean;
@@ -49,7 +48,7 @@ function ResetLinkDialog({
 						color="secondary"
 						size="sm"
 						onClick={onCopy}
-						prefixIcon={hasCopied ? <Check size={12} /> : <Copy size={12} />}
+						prefix={hasCopied ? <Check size={12} /> : <Copy size={12} />}
 						className="reset-link-dialog__copy-btn"
 					>
 						{hasCopied ? 'Copied!' : 'Copy'}

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

@@ -20,17 +20,29 @@ import { render, screen, userEvent, waitFor } from 'tests/test-utils';
 
 import EditMemberDrawer, { EditMemberDrawerProps } from '../EditMemberDrawer';
 
-jest.mock('@signozhq/drawer', () => ({
-	DrawerWrapper: ({
-		content,
-		open,
-	}: {
-		content?: ReactNode;
-		open: boolean;
-	}): JSX.Element | null => (open ? <div>{content}</div> : null),
+jest.mock('api/generated/services/users', () => ({
+	useDeleteUser: jest.fn(),
+	useGetUser: jest.fn(),
+	useUpdateUser: jest.fn(),
+	useUpdateMyUserV2: jest.fn(),
+	useSetRoleByUserID: jest.fn(),
+	useGetResetPasswordToken: jest.fn(),
+	useCreateResetPasswordToken: jest.fn(),
 }));
 
-jest.mock('@signozhq/dialog', () => ({
+jest.mock('api/ErrorResponseHandlerForGeneratedAPIs', () => ({
+	convertToApiError: jest.fn(),
+}));
+
+jest.mock('@signozhq/ui', () => ({
+	...jest.requireActual('@signozhq/ui'),
+	DrawerWrapper: ({
+		children,
+		open,
+	}: {
+		children?: ReactNode;
+		open: boolean;
+	}): JSX.Element | null => (open ? <div>{children}</div> : null),
 	DialogWrapper: ({
 		children,
 		open,
@@ -48,24 +60,6 @@ jest.mock('@signozhq/dialog', () => ({
 	DialogFooter: ({ children }: { children?: ReactNode }): JSX.Element => (
 		<div>{children}</div>
 	),
-}));
-
-jest.mock('api/generated/services/users', () => ({
-	useDeleteUser: jest.fn(),
-	useGetUser: jest.fn(),
-	useUpdateUser: jest.fn(),
-	useUpdateMyUserV2: jest.fn(),
-	useSetRoleByUserID: jest.fn(),
-	useGetResetPasswordToken: jest.fn(),
-	useCreateResetPasswordToken: jest.fn(),
-}));
-
-jest.mock('api/ErrorResponseHandlerForGeneratedAPIs', () => ({
-	convertToApiError: jest.fn(),
-}));
-
-jest.mock('@signozhq/ui', () => ({
-	...jest.requireActual('@signozhq/ui'),
 	toast: {
 		success: jest.fn(),
 		error: jest.fn(),

frontend/src/components/InviteMembersModal/InviteMembersModal.tsx

@@ -1,11 +1,14 @@
 import { useCallback, useEffect, useMemo, useState } from 'react';
-import { Button } from '@signozhq/button';
-import { Callout } from '@signozhq/callout';
 import { Style } from '@signozhq/design-tokens';
-import { DialogFooter, DialogWrapper } from '@signozhq/dialog';
 import { ChevronDown, CircleAlert, Plus, Trash2, X } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
-import { toast } from '@signozhq/ui';
+import {
+	Button,
+	Callout,
+	DialogFooter,
+	DialogWrapper,
+	Input,
+	toast,
+} from '@signozhq/ui';
 import { Select } from 'antd';
 import inviteUsers from 'api/v1/invite/bulk/create';
 import sendInvite from 'api/v1/invite/create';
@@ -295,8 +298,9 @@ function InviteMembersModal({
 						showIcon
 						icon={<CircleAlert size={12} />}
 						className="invite-team-members-error-callout"
-						description={getValidationErrorMessage()}
-					/>
+					>
+						{getValidationErrorMessage()}
+					</Callout>
 				)}
 			</div>
 
@@ -306,7 +310,7 @@ function InviteMembersModal({
 					color="secondary"
 					size="sm"
 					className="add-another-member-button"
-					prefixIcon={<Plus size={12} color={Style.L1_FOREGROUND} />}
+					prefix={<Plus size={12} color={Style.L1_FOREGROUND} />}
 					onClick={addRow}
 				>
 					Add another

frontend/src/components/QuickFilters/QuickFilters.tsx

@@ -11,7 +11,7 @@ import {
 	ComboboxItem,
 	ComboboxList,
 	ComboboxTrigger,
-} from '@signozhq/combobox';
+} from '@signozhq/ui';
 import { Skeleton, Switch, Tooltip, Typography } from 'antd';
 import getLocalStorageKey from 'api/browser/localstorage/get';
 import setLocalStorageKey from 'api/browser/localstorage/set';
@@ -200,7 +200,6 @@ export default function QuickFilters(props: IQuickFiltersProps): JSX.Element {
 												setOpen(false);
 											}}
 											isSelected={validQueryIndex === option.value}
-											showCheck={false}
 										>
 											{option.label}
 										</ComboboxItem>

frontend/src/components/QuickFilters/QuickFiltersSettings/AnnouncementTooltip/AnnouncementTooltip.styles.scss

@@ -46,8 +46,8 @@
 	}
 
 	&__button {
-		background: var(--card);
-		color: var(--accent-primary);
+		background: var(--secondary-background);
+		color: var(--secondary-foreground);
 		border: none;
 		padding: 6px 12px;
 		border-radius: 4px;

frontend/src/components/ServiceAccountDrawer/AddKeyModal/KeyCreatedPhase.tsx

@@ -1,7 +1,5 @@
-import { Button } from '@signozhq/button';
-import { Callout } from '@signozhq/callout';
 import { Check, Copy } from '@signozhq/icons';
-import { Badge } from '@signozhq/ui';
+import { Badge, Button, Callout } from '@signozhq/ui';
 import type { ServiceaccounttypesGettableFactorAPIKeyWithKeyDTO } from 'api/generated/services/sigNoz.schemas';
 
 export interface KeyCreatedPhaseProps {
@@ -43,7 +41,7 @@ function KeyCreatedPhase({
 			<Callout
 				type="info"
 				showIcon
-				message="Store the key securely. This is the only time it will be displayed."
+				title="Store the key securely. This is the only time it will be displayed."
 			/>
 		</div>
 	);

frontend/src/components/ServiceAccountDrawer/AddKeyModal/KeyFormPhase.tsx

@@ -1,8 +1,6 @@
 import type { Control, UseFormRegister } from 'react-hook-form';
 import { Controller } from 'react-hook-form';
-import { Button } from '@signozhq/button';
-import { Input } from '@signozhq/input';
-import { ToggleGroup, ToggleGroupItem } from '@signozhq/toggle-group';
+import { Button, Input, ToggleGroup, ToggleGroupItem } from '@signozhq/ui';
 import { DatePicker } from 'antd';
 import { popupContainer } from 'utils/selectPopupContainer';
 
@@ -56,7 +54,7 @@ function KeyFormPhase({
 							<ToggleGroup
 								type="single"
 								value={field.value}
-								onValueChange={(val): void => {
+								onChange={(val): void => {
 									if (val) {
 										field.onChange(val);
 									}
@@ -112,6 +110,7 @@ function KeyFormPhase({
 					</Button>
 					<Button
 						type="submit"
+						// @ts-expect-error -- form prop not in @signozhq/ui Button type
 						form={FORM_ID}
 						variant="solid"
 						color="primary"

frontend/src/components/ServiceAccountDrawer/AddKeyModal/index.tsx

@@ -2,8 +2,7 @@ import { useCallback, useEffect, useState } from 'react';
 import { useForm } from 'react-hook-form';
 import { useQueryClient } from 'react-query';
 import { useCopyToClipboard } from 'react-use';
-import { DialogWrapper } from '@signozhq/dialog';
-import { toast } from '@signozhq/ui';
+import { DialogWrapper, toast } from '@signozhq/ui';
 import { convertToApiError } from 'api/ErrorResponseHandlerForGeneratedAPIs';
 import {
 	invalidateListServiceAccountKeys,

frontend/src/components/ServiceAccountDrawer/DeleteAccountModal.tsx

@@ -1,8 +1,6 @@
 import { useQueryClient } from 'react-query';
-import { Button } from '@signozhq/button';
-import { DialogFooter, DialogWrapper } from '@signozhq/dialog';
 import { Trash2, X } from '@signozhq/icons';
-import { toast } from '@signozhq/ui';
+import { Button, DialogFooter, DialogWrapper, toast } from '@signozhq/ui';
 import { convertToApiError } from 'api/ErrorResponseHandlerForGeneratedAPIs';
 import {
 	getGetServiceAccountQueryKey,

frontend/src/components/ServiceAccountDrawer/EditKeyModal/EditKeyForm.tsx

@@ -1,10 +1,13 @@
 import type { Control, UseFormRegister } from 'react-hook-form';
 import { Controller } from 'react-hook-form';
-import { Button } from '@signozhq/button';
 import { LockKeyhole, Trash2, X } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
-import { ToggleGroup, ToggleGroupItem } from '@signozhq/toggle-group';
-import { Badge } from '@signozhq/ui';
+import {
+	Badge,
+	Button,
+	Input,
+	ToggleGroup,
+	ToggleGroupItem,
+} from '@signozhq/ui';
 import { DatePicker } from 'antd';
 import type { ServiceaccounttypesGettableFactorAPIKeyDTO } from 'api/generated/services/sigNoz.schemas';
 import { popupContainer } from 'utils/selectPopupContainer';
@@ -72,7 +75,7 @@ function EditKeyForm({
 							<ToggleGroup
 								type="single"
 								value={field.value}
-								onValueChange={(val): void => {
+								onChange={(val): void => {
 									if (val) {
 										field.onChange(val);
 									}
@@ -147,6 +150,7 @@ function EditKeyForm({
 					</Button>
 					<Button
 						type="submit"
+						// @ts-expect-error -- form prop not in @signozhq/ui Button type
 						form={FORM_ID}
 						variant="solid"
 						color="primary"

frontend/src/components/ServiceAccountDrawer/EditKeyModal/index.tsx

@@ -1,8 +1,7 @@
 import { useEffect, useState } from 'react';
 import { useForm } from 'react-hook-form';
 import { useQueryClient } from 'react-query';
-import { DialogWrapper } from '@signozhq/dialog';
-import { toast } from '@signozhq/ui';
+import { DialogWrapper, toast } from '@signozhq/ui';
 import { convertToApiError } from 'api/ErrorResponseHandlerForGeneratedAPIs';
 import {
 	invalidateListServiceAccountKeys,

frontend/src/components/ServiceAccountDrawer/KeysTab.tsx

@@ -1,6 +1,6 @@
 import { useCallback, useMemo } from 'react';
-import { Button } from '@signozhq/button';
 import { KeyRound, X } from '@signozhq/icons';
+import { Button } from '@signozhq/ui';
 import { Skeleton, Table, Tooltip } from 'antd';
 import type { ColumnsType } from 'antd/es/table/interface';
 import type { ServiceaccounttypesGettableFactorAPIKeyDTO } from 'api/generated/services/sigNoz.schemas';
@@ -96,7 +96,7 @@ function buildColumns({
 				<Tooltip title={isDisabled ? 'Service account disabled' : 'Revoke Key'}>
 					<Button
 						variant="ghost"
-						size="xs"
+						size="sm"
 						color="destructive"
 						disabled={isDisabled}
 						onClick={(e): void => {

frontend/src/components/ServiceAccountDrawer/OverviewTab.tsx

@@ -1,7 +1,6 @@
 import { useCallback } from 'react';
 import { LockKeyhole } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
-import { Badge } from '@signozhq/ui';
+import { Badge, Input } from '@signozhq/ui';
 import type { AuthtypesRoleDTO } from 'api/generated/services/sigNoz.schemas';
 import RolesSelect from 'components/RolesSelect';
 import { DATE_TIME_FORMATS } from 'constants/dateTimeFormats';

frontend/src/components/ServiceAccountDrawer/RevokeKeyModal.tsx

@@ -1,8 +1,6 @@
 import { useQueryClient } from 'react-query';
-import { Button } from '@signozhq/button';
-import { DialogFooter, DialogWrapper } from '@signozhq/dialog';
 import { Trash2, X } from '@signozhq/icons';
-import { toast } from '@signozhq/ui';
+import { Button, DialogFooter, DialogWrapper, toast } from '@signozhq/ui';
 import { convertToApiError } from 'api/ErrorResponseHandlerForGeneratedAPIs';
 import {
 	getListServiceAccountKeysQueryKey,

frontend/src/components/ServiceAccountDrawer/SaveErrorItem.tsx

@@ -1,7 +1,7 @@
 import { useState } from 'react';
-import { Button } from '@signozhq/button';
 import { Color } from '@signozhq/design-tokens';
 import { ChevronDown, ChevronUp, CircleAlert, RotateCw } from '@signozhq/icons';
+import { Button } from '@signozhq/ui';
 import ErrorContent from 'components/ErrorModal/components/ErrorContent';
 import APIError from 'types/api/error';
 
@@ -42,7 +42,7 @@ function SaveErrorItem({
 					<Button
 						type="button"
 						aria-label="Retry"
-						size="xs"
+						size="sm"
 						onClick={async (e): Promise<void> => {
 							e.stopPropagation();
 							setIsRetrying(true);

frontend/src/components/ServiceAccountDrawer/ServiceAccountDrawer.tsx

@@ -1,10 +1,13 @@
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { useQueryClient } from 'react-query';
-import { Button } from '@signozhq/button';
-import { DrawerWrapper } from '@signozhq/drawer';
 import { Key, LayoutGrid, Plus, Trash2, X } from '@signozhq/icons';
-import { ToggleGroup, ToggleGroupItem } from '@signozhq/toggle-group';
-import { toast } from '@signozhq/ui';
+import {
+	Button,
+	DrawerWrapper,
+	toast,
+	ToggleGroup,
+	ToggleGroupItem,
+} from '@signozhq/ui';
 import { Pagination, Skeleton } from 'antd';
 import { convertToApiError } from 'api/ErrorResponseHandlerForGeneratedAPIs';
 import {
@@ -379,7 +382,7 @@ function ServiceAccountDrawer({
 				<ToggleGroup
 					type="single"
 					value={activeTab}
-					onValueChange={(val): void => {
+					onChange={(val): void => {
 						if (val) {
 							setActiveTab(val as ServiceAccountDrawerTab);
 							if (val !== ServiceAccountDrawerTab.Keys) {
@@ -547,14 +550,13 @@ function ServiceAccountDrawer({
 					}
 				}}
 				direction="right"
-				type="panel"
 				showCloseButton
 				showOverlay={false}
-				allowOutsideClick
-				header={{ title: 'Service Account Details' }}
-				content={drawerContent}
+				title="Service Account Details"
 				className="sa-drawer"
-			/>
+			>
+				{drawerContent}
+			</DrawerWrapper>
 
 			<DeleteAccountModal />
 

frontend/src/components/ServiceAccountDrawer/__tests__/AddKeyModal.test.tsx

@@ -1,7 +1,13 @@
 import { toast } from '@signozhq/ui';
 import { rest, server } from 'mocks-server/server';
 import { NuqsTestingAdapter } from 'nuqs/adapters/testing';
-import { render, screen, userEvent, waitFor } from 'tests/test-utils';
+import {
+	render,
+	screen,
+	userEvent,
+	waitFor,
+	waitForElementToBeRemoved,
+} from 'tests/test-utils';
 
 import AddKeyModal from '../AddKeyModal';
 
@@ -128,11 +134,9 @@ describe('AddKeyModal', () => {
 		const user = userEvent.setup({ pointerEventsCheck: 0 });
 		renderModal();
 
-		await screen.findByRole('dialog', { name: /Add a New Key/i });
+		const dialog = await screen.findByRole('dialog', { name: /Add a New Key/i });
 		await user.click(screen.getByRole('button', { name: /Cancel/i }));
 
-		expect(
-			screen.queryByRole('dialog', { name: /Add a New Key/i }),
-		).not.toBeInTheDocument();
+		await waitForElementToBeRemoved(dialog);
 	});
 });

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

@@ -6,18 +6,15 @@ import { render, screen, userEvent, waitFor } from 'tests/test-utils';
 
 import ServiceAccountDrawer from '../ServiceAccountDrawer';
 
-jest.mock('@signozhq/drawer', () => ({
-	DrawerWrapper: ({
-		content,
-		open,
-	}: {
-		content?: ReactNode;
-		open: boolean;
-	}): JSX.Element | null => (open ? <div>{content}</div> : null),
-}));
-
 jest.mock('@signozhq/ui', () => ({
 	...jest.requireActual('@signozhq/ui'),
+	DrawerWrapper: ({
+		children,
+		open,
+	}: {
+		children?: ReactNode;
+		open: boolean;
+	}): JSX.Element | null => (open ? <div>{children}</div> : null),
 	toast: { success: jest.fn(), error: jest.fn() },
 }));
 

frontend/src/components/cmdKPalette/cmdKPalette.tsx

@@ -7,7 +7,7 @@ import {
 	CommandItem,
 	CommandList,
 	CommandShortcut,
-} from '@signozhq/command';
+} from '@signozhq/ui';
 import logEvent from 'api/common/logEvent';
 import { useThemeMode } from 'hooks/useDarkMode';
 import history from 'lib/history';

frontend/src/container/CustomDomainSettings/CustomDomainEditModal.tsx

@@ -1,9 +1,7 @@
 import { useEffect, useState } from 'react';
-import { Button } from '@signozhq/button';
 import { Color } from '@signozhq/design-tokens';
-import { DialogWrapper } from '@signozhq/dialog';
 import { CircleAlert, CircleCheck, LoaderCircle } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
+import { Button, DialogWrapper, Input } from '@signozhq/ui';
 import { RenderErrorResponseDTO } from 'api/generated/services/sigNoz.schemas';
 import { AxiosError } from 'axios';
 import LaunchChatSupport from 'components/LaunchChatSupport/LaunchChatSupport';

frontend/src/container/CustomDomainSettings/CustomDomainSettings.tsx

@@ -1,6 +1,4 @@
 import { useEffect, useMemo, useState } from 'react';
-import { Button } from '@signozhq/button';
-import { Callout } from '@signozhq/callout';
 import {
 	Check,
 	ChevronDown,
@@ -11,7 +9,7 @@ import {
 	SolidAlertCircle,
 	X,
 } from '@signozhq/icons';
-import { toast } from '@signozhq/ui';
+import { Button, Callout, toast } from '@signozhq/ui';
 import { Dropdown, Skeleton } from 'antd';
 import {
 	RenderErrorResponseDTO,
@@ -44,9 +42,9 @@ function DomainUpdateToast({
 			<div className="custom-domain-toast-actions">
 				<Button
 					variant="ghost"
-					size="xs"
+					size="sm"
 					className="custom-domain-toast-visit-btn"
-					suffixIcon={<ExternalLink size={12} />}
+					suffix={<ExternalLink size={12} />}
 					onClick={(): void => {
 						window.open(url, '_blank', 'noopener,noreferrer');
 					}}
@@ -61,7 +59,7 @@ function DomainUpdateToast({
 						toast.dismiss(toastId);
 					}}
 					aria-label="Dismiss"
-					prefixIcon={<X size={14} />}
+					prefix={<X size={14} />}
 				/>
 			</div>
 		</div>
@@ -246,7 +244,7 @@ export default function CustomDomainSettings(): JSX.Element {
 						>
 							<Button
 								type="button"
-								size="xs"
+								size="sm"
 								className="workspace-url-trigger"
 								disabled={isFetchingHosts}
 							>
@@ -266,7 +264,7 @@ export default function CustomDomainSettings(): JSX.Element {
 					variant="solid"
 					size="sm"
 					className="custom-domain-edit-button"
-					prefixIcon={<FilePenLine size={12} />}
+					prefix={<FilePenLine size={12} />}
 					disabled={isFetchingHosts || isPollingEnabled}
 					onClick={(): void => setIsEditModalOpen(true)}
 				>
@@ -281,7 +279,7 @@ export default function CustomDomainSettings(): JSX.Element {
 					className="custom-domain-callout"
 					size="small"
 					icon={<SolidAlertCircle size={13} color="primary" />}
-					message={`Updating your URL to ⎯ ${customDomainSubdomain}.${dnsSuffix}. This may take a few mins.`}
+					title={`Updating your URL to ⎯ ${customDomainSubdomain}.${dnsSuffix}. This may take a few mins.`}
 				/>
 			)}
 

frontend/src/container/DashboardContainer/DashboardSettings/PublicDashboard/index.tsx

@@ -1,8 +1,7 @@
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { useMutation } from 'react-query';
 import { useCopyToClipboard } from 'react-use';
-import { Checkbox } from '@signozhq/checkbox';
-import { toast } from '@signozhq/ui';
+import { Checkbox, toast } from '@signozhq/ui';
 import { Button, Select, Typography } from 'antd';
 import createPublicDashboardAPI from 'api/dashboard/public/createPublicDashboard';
 import revokePublicDashboardAccessAPI from 'api/dashboard/public/revokePublicDashboardAccess';
@@ -247,10 +246,11 @@ function PublicDashboardSetting(): JSX.Element {
 				<div className="timerange-enabled-checkbox">
 					<Checkbox
 						id="enable-time-range"
-						checked={timeRangeEnabled}
-						onCheckedChange={handleTimeRangeEnabled}
-						labelName="Enable time range"
-					/>
+						value={timeRangeEnabled}
+						onChange={handleTimeRangeEnabled}
+					>
+						Enable time range
+					</Checkbox>
 				</div>
 
 				<div className="default-time-range-select">

frontend/src/container/ForgotPassword/SuccessScreen.tsx

@@ -1,5 +1,5 @@
-import { Button } from '@signozhq/button';
 import { ArrowLeft, Mail } from '@signozhq/icons';
+import { Button } from '@signozhq/ui';
 
 interface SuccessScreenProps {
 	onBackToLogin: () => void;
@@ -28,7 +28,7 @@ function SuccessScreen({ onBackToLogin }: SuccessScreenProps): JSX.Element {
 						data-testid="back-to-login"
 						className="login-submit-btn"
 						onClick={onBackToLogin}
-						prefixIcon={<ArrowLeft size={12} />}
+						prefix={<ArrowLeft size={12} />}
 					>
 						Back to login
 					</Button>

frontend/src/container/ForgotPassword/index.tsx

@@ -1,7 +1,6 @@
 import { useCallback, useEffect, useMemo } from 'react';
-import { Button } from '@signozhq/button';
 import { ArrowLeft, ArrowRight } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
+import { Button, Input } from '@signozhq/ui';
 import { Form, Select } from 'antd';
 import { ErrorResponseHandlerForGeneratedAPIs } from 'api/ErrorResponseHandlerForGeneratedAPIs';
 import { useForgotPassword } from 'api/generated/services/users';
@@ -191,7 +190,7 @@ function ForgotPassword({
 						data-testid="forgot-password-back"
 						className="forgot-password-back-button"
 						onClick={handleBackToLogin}
-						prefixIcon={<ArrowLeft size={12} />}
+						prefix={<ArrowLeft size={12} />}
 					>
 						Back to login
 					</Button>
@@ -204,7 +203,7 @@ function ForgotPassword({
 						type="submit"
 						data-testid="forgot-password-submit"
 						className="login-submit-btn"
-						suffixIcon={<ArrowRight size={12} />}
+						suffix={<ArrowRight size={12} />}
 					>
 						{isLoading ? 'Sending...' : 'Send reset link'}
 					</Button>

frontend/src/container/GeneralSettings/GeneralSettings.tsx

@@ -3,8 +3,8 @@ import { useTranslation } from 'react-i18next';
 import { UseQueryResult } from 'react-query';
 import { useInterval } from 'react-use';
 import { LoadingOutlined } from '@ant-design/icons';
-import { Button } from '@signozhq/button';
 import { Compass, ScrollText } from '@signozhq/icons';
+import { Button } from '@signozhq/ui';
 import { Modal, Spin } from 'antd';
 import setRetentionApi from 'api/settings/setRetention';
 import setRetentionApiV2 from 'api/settings/setRetentionV2';

frontend/src/container/GeneralSettings/LicenseKeyRow/LicenseKeyRow.tsx

@@ -1,7 +1,6 @@
 import { useCopyToClipboard } from 'react-use';
-import { Button } from '@signozhq/button';
 import { Copy, KeyRound } from '@signozhq/icons';
-import { toast } from '@signozhq/ui';
+import { Button, toast } from '@signozhq/ui';
 import { useAppContext } from 'providers/App/App';
 import { getMaskedKey } from 'utils/maskedKey';
 
@@ -32,7 +31,7 @@ function LicenseKeyRow(): JSX.Element | null {
 				</code>
 				<Button
 					type="button"
-					size="xs"
+					size="sm"
 					aria-label="Copy license key"
 					data-testid="license-key-row-copy-btn"
 					className="license-key-row__copy-btn"

frontend/src/container/GeneralSettings/LicenseKeyRow/LicenseRowDismissibleCallout/LicenseRowDismissibleCallout.tsx

@@ -1,6 +1,6 @@
 import { useState } from 'react';
 import { Link } from 'react-router-dom';
-import { Callout } from '@signozhq/callout';
+import { Callout } from '@signozhq/ui';
 import getLocalStorageApi from 'api/browser/localstorage/get';
 import setLocalStorageApi from 'api/browser/localstorage/set';
 import { FeatureKeys } from 'constants/features';
@@ -44,39 +44,38 @@ function LicenseRowDismissibleCallout(): JSX.Element | null {
 			type="info"
 			size="small"
 			showIcon
-			dismissable
-			onClose={handleDismissCallout}
+			action="dismissible"
+			onClick={handleDismissCallout}
 			className="license-key-callout"
-			description={
-				<div className="license-key-callout__description">
-					This is <strong>NOT</strong> your ingestion or Service account key.
-					{(hasServiceAccountsAccess || hasIngestionAccess) && (
-						<>
-							{' '}
-							Find your{' '}
-							{hasServiceAccountsAccess && (
-								<Link
-									to={ROUTES.SERVICE_ACCOUNTS_SETTINGS}
-									className="license-key-callout__link"
-								>
-									Service account here
-								</Link>
-							)}
-							{hasServiceAccountsAccess && hasIngestionAccess && ' and '}
-							{hasIngestionAccess && (
-								<Link
-									to={ROUTES.INGESTION_SETTINGS}
-									className="license-key-callout__link"
-								>
-									Ingestion key here
-								</Link>
-							)}
-							.
-						</>
-					)}
-				</div>
-			}
-		/>
+		>
+			<div className="license-key-callout__description">
+				This is <strong>NOT</strong> your ingestion or Service account key.
+				{(hasServiceAccountsAccess || hasIngestionAccess) && (
+					<>
+						{' '}
+						Find your{' '}
+						{hasServiceAccountsAccess && (
+							<Link
+								to={ROUTES.SERVICE_ACCOUNTS_SETTINGS}
+								className="license-key-callout__link"
+							>
+								Service account here
+							</Link>
+						)}
+						{hasServiceAccountsAccess && hasIngestionAccess && ' and '}
+						{hasIngestionAccess && (
+							<Link
+								to={ROUTES.INGESTION_SETTINGS}
+								className="license-key-callout__link"
+							>
+								Ingestion key here
+							</Link>
+						)}
+						.
+					</>
+				)}
+			</div>
+		</Callout>
 	) : null;
 }
 

frontend/src/container/GeneralSettings/Retention.tsx

@@ -7,7 +7,7 @@ import {
 	useRef,
 	useState,
 } from 'react';
-import { Input as SignozInput } from '@signozhq/input';
+import { Input as SignozInput } from '@signozhq/ui';
 import { Col, Row, Select } from 'antd';
 import { useGetTenantLicense } from 'hooks/useGetTenantLicense';
 import { find } from 'lodash-es';

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

@@ -1,5 +1,5 @@
 import { useMemo } from 'react';
-import { Button } from '@signozhq/button';
+import { Button } from '@signozhq/ui';
 import { Skeleton } from 'antd';
 import logEvent from 'api/common/logEvent';
 import { useGetHosts } from 'api/generated/services/zeus';
@@ -81,11 +81,12 @@ function DataSourceInfo({
 								color="primary"
 								size="sm"
 								className="periscope-btn primary"
-								prefixIcon={<img src={containerPlusUrl} alt="plus" />}
+								prefix={<img src={containerPlusUrl} alt="plus" />}
 								onClick={handleConnect}
+								// @ts-expect-error -- role/onKeyDown props not in @signozhq/ui Button type
 								role="button"
 								tabIndex={0}
-								onKeyDown={(e): void => {
+								onKeyDown={(e: React.KeyboardEvent): void => {
 									if (e.key === 'Enter') {
 										handleConnect();
 									}

frontend/src/container/LogsExplorerList/ColumnView/ColumnView.tsx

@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { ColumnDef, DataTable, Row } from '@signozhq/table';
+import { ColumnDef, DataTable, Row } from '@signozhq/ui';
 import LogDetail from 'components/LogDetail';
 import { VIEW_TYPES } from 'components/LogDetail/constants';
 import LogStateIndicator from 'components/Logs/LogStateIndicator/LogStateIndicator';

frontend/src/container/LogsExplorerList/TanStackTableView/TanStackHeaderRow.tsx

@@ -6,7 +6,7 @@ import type {
 import { useMemo } from 'react';
 import { CloseOutlined, MoreOutlined } from '@ant-design/icons';
 import { useSortable } from '@dnd-kit/sortable';
-import { Popover, PopoverContent, PopoverTrigger } from '@signozhq/popover';
+import { Popover, PopoverContent, PopoverTrigger } from '@signozhq/ui';
 import { flexRender, Header as TanStackHeader } from '@tanstack/react-table';
 import { GripVertical } from 'lucide-react';
 

frontend/src/container/MembersSettings/MembersSettings.tsx

@@ -1,8 +1,7 @@
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { useHistory } from 'react-router-dom';
-import { Button } from '@signozhq/button';
 import { Check, ChevronDown, Plus } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
+import { Button, Input } from '@signozhq/ui';
 import type { MenuProps } from 'antd';
 import { Dropdown } from 'antd';
 import { useListUsers } from 'api/generated/services/users';
@@ -198,7 +197,6 @@ function MembersSettings(): JSX.Element {
 								setPage(1);
 							}}
 							className="members-search-input"
-							color="secondary"
 							name="members-search"
 						/>
 					</div>

frontend/src/container/MySettings/LicenseSection/LicenseSection.tsx

@@ -1,5 +1,5 @@
 import { useCopyToClipboard } from 'react-use';
-import { Button } from '@signozhq/button';
+import { Button } from '@signozhq/ui';
 import { Typography } from 'antd';
 import { useNotifications } from 'hooks/useNotifications';
 import { Copy } from 'lucide-react';

frontend/src/container/NewWidget/RightContainer/components/DisconnectValuesSelector/DisconnectValuesModeToggle.tsx

@@ -1,4 +1,4 @@
-import { ToggleGroup, ToggleGroupItem } from '@signozhq/toggle-group';
+import { ToggleGroup, ToggleGroupItem } from '@signozhq/ui';
 import { Typography } from 'antd';
 import { DisconnectedValuesMode } from 'lib/uPlotV2/config/types';
 
@@ -16,7 +16,7 @@ export default function DisconnectValuesModeToggle({
 			type="single"
 			value={value}
 			size="lg"
-			onValueChange={(newValue): void => {
+			onChange={(newValue): void => {
 				if (newValue) {
 					onChange(newValue as DisconnectedValuesMode);
 				}

frontend/src/container/NewWidget/RightContainer/components/FillModeSelector/FillModeSelector.tsx

@@ -1,4 +1,4 @@
-import { ToggleGroup, ToggleGroupItem } from '@signozhq/toggle-group';
+import { ToggleGroup, ToggleGroupItem } from '@signozhq/ui';
 import { Typography } from 'antd';
 import { FillMode } from 'lib/uPlotV2/config/types';
 
@@ -19,15 +19,14 @@ export default function FillModeSelector({
 			<ToggleGroup
 				type="single"
 				value={value}
-				variant="outline"
 				size="lg"
-				onValueChange={(newValue): void => {
+				onChange={(newValue): void => {
 					if (newValue) {
 						onChange(newValue as FillMode);
 					}
 				}}
 			>
-				<ToggleGroupItem value={FillMode.None} aria-label="None" title="None">
+				<ToggleGroupItem value={FillMode.None} aria-label="None">
 					<svg
 						className="fill-mode-icon"
 						viewBox="0 0 48 48"
@@ -41,7 +40,7 @@ export default function FillModeSelector({
 					</svg>
 					<Typography.Text className="section-heading-small">None</Typography.Text>
 				</ToggleGroupItem>
-				<ToggleGroupItem value={FillMode.Solid} aria-label="Solid" title="Solid">
+				<ToggleGroupItem value={FillMode.Solid} aria-label="Solid">
 					<svg
 						className="fill-mode-icon"
 						viewBox="0 0 48 48"
@@ -55,11 +54,7 @@ export default function FillModeSelector({
 					</svg>
 					<Typography.Text className="section-heading-small">Solid</Typography.Text>
 				</ToggleGroupItem>
-				<ToggleGroupItem
-					value={FillMode.Gradient}
-					aria-label="Gradient"
-					title="Gradient"
-				>
+				<ToggleGroupItem value={FillMode.Gradient} aria-label="Gradient">
 					<svg
 						className="fill-mode-icon"
 						viewBox="0 0 48 48"

frontend/src/container/NewWidget/RightContainer/components/LineInterpolationSelector/LineInterpolationSelector.tsx

@@ -1,4 +1,4 @@
-import { ToggleGroup, ToggleGroupItem } from '@signozhq/toggle-group';
+import { ToggleGroup, ToggleGroupItem } from '@signozhq/ui';
 import { Typography } from 'antd';
 import { LineInterpolation } from 'lib/uPlotV2/config/types';
 
@@ -21,19 +21,14 @@ export default function LineInterpolationSelector({
 			<ToggleGroup
 				type="single"
 				value={value}
-				variant="outline"
 				size="lg"
-				onValueChange={(newValue): void => {
+				onChange={(newValue): void => {
 					if (newValue) {
 						onChange(newValue as LineInterpolation);
 					}
 				}}
 			>
-				<ToggleGroupItem
-					value={LineInterpolation.Linear}
-					aria-label="Linear"
-					title="Linear"
-				>
+				<ToggleGroupItem value={LineInterpolation.Linear} aria-label="Linear">
 					<svg
 						className="line-interpolation-icon"
 						viewBox="0 0 48 48"

frontend/src/container/NewWidget/RightContainer/components/LineStyleSelector/LineStyleSelector.tsx

@@ -1,4 +1,4 @@
-import { ToggleGroup, ToggleGroupItem } from '@signozhq/toggle-group';
+import { ToggleGroup, ToggleGroupItem } from '@signozhq/ui';
 import { Typography } from 'antd';
 import { LineStyle } from 'lib/uPlotV2/config/types';
 
@@ -19,15 +19,14 @@ export default function LineStyleSelector({
 			<ToggleGroup
 				type="single"
 				value={value}
-				variant="outline"
 				size="lg"
-				onValueChange={(newValue): void => {
+				onChange={(newValue): void => {
 					if (newValue) {
 						onChange(newValue as LineStyle);
 					}
 				}}
 			>
-				<ToggleGroupItem value={LineStyle.Solid} aria-label="Solid" title="Solid">
+				<ToggleGroupItem value={LineStyle.Solid} aria-label="Solid">
 					<svg
 						className="line-style-icon"
 						viewBox="0 0 48 48"
@@ -41,11 +40,7 @@ export default function LineStyleSelector({
 					</svg>
 					<Typography.Text className="section-heading-small">Solid</Typography.Text>
 				</ToggleGroupItem>
-				<ToggleGroupItem
-					value={LineStyle.Dashed}
-					aria-label="Dashed"
-					title="Dashed"
-				>
+				<ToggleGroupItem value={LineStyle.Dashed} aria-label="Dashed">
 					<svg
 						className="line-style-icon"
 						viewBox="0 0 48 48"

frontend/src/container/NewWidget/index.tsx

@@ -7,11 +7,11 @@ import { useSelector } from 'react-redux';
 import { generatePath } from 'react-router-dom';
 import { WarningOutlined } from '@ant-design/icons';
 import {
+	Button,
 	ResizableHandle,
 	ResizablePanel,
 	ResizablePanelGroup,
-} from '@signozhq/resizable';
-import { Button } from '@signozhq/ui';
+} from '@signozhq/ui';
 import { Flex, Modal, Space, Typography } from 'antd';
 import logEvent from 'api/common/logEvent';
 import { PrecisionOption, PrecisionOptionsEnum } from 'components/Graph/types';
@@ -857,9 +857,8 @@ function NewWidget({
 
 			<PanelContainer>
 				<ResizablePanelGroup
-					direction="horizontal"
+					orientation="horizontal"
 					className="widget-resizable-panel-group"
-					autoSaveId="panel-editor"
 				>
 					<ResizablePanel
 						minSize={70}

frontend/src/container/OnboardingQuestionaire/AboutSigNozQuestions/AboutSigNozQuestions.tsx

@@ -1,7 +1,5 @@
 import { useEffect, useState } from 'react';
-import { Button } from '@signozhq/button';
-import { Checkbox } from '@signozhq/checkbox';
-import { Input } from '@signozhq/input';
+import { Button, Checkbox, Input } from '@signozhq/ui';
 import { Input as AntdInput } from 'antd';
 import logEvent from 'api/common/logEvent';
 import { ArrowRight } from 'lucide-react';
@@ -118,20 +116,22 @@ export function AboutSigNozQuestions({
 								<div key={option} className="checkbox-item">
 									<Checkbox
 										id={`checkbox-${option}`}
-										checked={interestInSignoz.includes(option)}
-										onCheckedChange={createInterestChangeHandler(option)}
-										labelName={interestedInOptions[option]}
-									/>
+										value={interestInSignoz.includes(option)}
+										onChange={createInterestChangeHandler(option)}
+									>
+										{interestedInOptions[option]}
+									</Checkbox>
 								</div>
 							))}
 
 							<div className="checkbox-item checkbox-item-others">
 								<Checkbox
 									id="others-checkbox"
-									checked={interestInSignoz.includes('Others')}
-									onCheckedChange={createInterestChangeHandler('Others')}
-									labelName={interestInSignoz.includes('Others') ? '' : 'Others'}
-								/>
+									value={interestInSignoz.includes('Others')}
+									onChange={createInterestChangeHandler('Others')}
+								>
+									{interestInSignoz.includes('Others') ? '' : 'Others'}
+								</Checkbox>
 								{interestInSignoz.includes('Others') && (
 									<Input
 										type="text"
@@ -154,7 +154,7 @@ export function AboutSigNozQuestions({
 						className={`onboarding-next-button ${isNextDisabled ? 'disabled' : ''}`}
 						onClick={handleOnNext}
 						disabled={isNextDisabled}
-						suffixIcon={<ArrowRight size={12} />}
+						suffix={<ArrowRight size={12} />}
 					>
 						Next
 					</Button>

frontend/src/container/OnboardingQuestionaire/InviteTeamMembers/InviteTeamMembers.tsx

@@ -1,8 +1,6 @@
 import { useCallback, useEffect, useState } from 'react';
 import { useMutation } from 'react-query';
-import { Button } from '@signozhq/button';
-import { Callout } from '@signozhq/callout';
-import { Input } from '@signozhq/input';
+import { Button, Callout, Input } from '@signozhq/ui';
 import { Select, Typography } from 'antd';
 import logEvent from 'api/common/logEvent';
 import inviteUsers from 'api/v1/invite/bulk/create';
@@ -335,7 +333,7 @@ function InviteTeamMembers({
 									variant="dashed"
 									color="secondary"
 									className="add-another-member-button"
-									prefixIcon={<Plus size={12} />}
+									prefix={<Plus size={12} />}
 									onClick={handleAddTeamMember}
 								>
 									Add another
@@ -352,8 +350,9 @@ function InviteTeamMembers({
 						showIcon
 						icon={<CircleAlert size={12} />}
 						className="invite-team-members-error-callout"
-						description={getValidationErrorMessage()}
-					/>
+					>
+						{getValidationErrorMessage()}
+					</Callout>
 				)}
 
 				{inviteError && !hasInvalidEmails && !hasInvalidRoles && (
@@ -369,7 +368,7 @@ function InviteTeamMembers({
 						}`}
 						onClick={handleNext}
 						disabled={isInviteButtonDisabled}
-						suffixIcon={
+						suffix={
 							isButtonDisabled ? (
 								<Loader2 className="animate-spin" size={12} />
 							) : (

frontend/src/container/OnboardingQuestionaire/OptimiseSignozNeeds/OptimiseSignozNeeds.tsx

@@ -1,5 +1,5 @@
 import { useEffect, useState } from 'react';
-import { Button } from '@signozhq/button';
+import { Button } from '@signozhq/ui';
 import { Slider, Typography } from 'antd';
 import logEvent from 'api/common/logEvent';
 import { ArrowRight, Loader2, Minus } from 'lucide-react';
@@ -290,7 +290,7 @@ function OptimiseSignozNeeds({
 						}`}
 						onClick={handleOnNext}
 						disabled={isUpdatingProfile || isNextDisabled}
-						suffixIcon={
+						suffix={
 							isUpdatingProfile ? (
 								<Loader2 className="animate-spin" size={12} />
 							) : (

frontend/src/container/OnboardingQuestionaire/OrgQuestions/OrgQuestions.tsx

@@ -1,11 +1,11 @@
 import { useEffect, useState } from 'react';
-import { Button } from '@signozhq/button';
-import { Input } from '@signozhq/input';
 import {
+	Button,
+	Input,
 	RadioGroup,
 	RadioGroupItem,
 	RadioGroupLabel,
-} from '@signozhq/radio-group';
+} from '@signozhq/ui';
 import { Typography } from 'antd';
 import logEvent from 'api/common/logEvent';
 import { ArrowRight } from 'lucide-react';
@@ -146,7 +146,7 @@ function OrgQuestions({ orgDetails, onNext }: OrgQuestionsProps): JSX.Element {
 						</label>
 						<RadioGroup
 							value={observabilityTool || ''}
-							onValueChange={handleObservabilityToolChange}
+							onChange={handleObservabilityToolChange}
 							className="observability-tools-radio-container"
 						>
 							{Object.entries(observabilityTools).map(([tool, label]) => {
@@ -189,7 +189,7 @@ function OrgQuestions({ orgDetails, onNext }: OrgQuestionsProps): JSX.Element {
 							</div>
 							<RadioGroup
 								value={migrationTimeline || ''}
-								onValueChange={setMigrationTimeline}
+								onChange={setMigrationTimeline}
 								className="migration-timeline-radio-container"
 							>
 								{Object.entries(migrationTimelineOptions).map(([key, label]) => (
@@ -208,7 +208,7 @@ function OrgQuestions({ orgDetails, onNext }: OrgQuestionsProps): JSX.Element {
 						<div className="question">Do you already use OpenTelemetry?</div>
 						<RadioGroup
 							value={usesOtel === true ? 'yes' : usesOtel === false ? 'no' : ''}
-							onValueChange={handleOtelChange}
+							onChange={handleOtelChange}
 							className="opentelemetry-radio-container"
 						>
 							<div className="radio-item opentelemetry-radio-item">
@@ -229,7 +229,7 @@ function OrgQuestions({ orgDetails, onNext }: OrgQuestionsProps): JSX.Element {
 					className={`onboarding-next-button ${isNextDisabled ? 'disabled' : ''}`}
 					onClick={handleNext}
 					disabled={isNextDisabled}
-					suffixIcon={<ArrowRight size={12} />}
+					suffix={<ArrowRight size={12} />}
 				>
 					Next
 				</Button>

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

@@ -1,6 +1,5 @@
 import { useCallback, useState } from 'react';
-import { Button } from '@signozhq/button';
-import { toast } from '@signozhq/ui';
+import { Button, toast } from '@signozhq/ui';
 import { Form, Modal } from 'antd';
 import { ErrorResponseHandlerV2 } from 'api/ErrorResponseHandlerV2';
 import {

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

@@ -1,6 +1,4 @@
 import { useCallback, useState } from 'react';
-import { Callout } from '@signozhq/callout';
-import { Checkbox } from '@signozhq/checkbox';
 import { Color, Style } from '@signozhq/design-tokens';
 import {
 	ChevronDown,
@@ -8,7 +6,7 @@ import {
 	CircleHelp,
 	TriangleAlert,
 } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
+import { Callout, Checkbox, Input } from '@signozhq/ui';
 import { Collapse, Form, Input as AntdInput, Tooltip } from 'antd';
 import { useCollapseSectionErrors } from 'hooks/useCollapseSectionErrors';
 
@@ -138,32 +136,30 @@ function ConfigureGoogleAuthAuthnProvider({
 					<div className="authn-provider__checkbox-row">
 						<Form.Item
 							name={['googleAuthConfig', 'insecureSkipEmailVerified']}
-							valuePropName="checked"
+							valuePropName="value"
 							noStyle
 						>
 							<Checkbox
 								id="google-skip-email-verification"
-								labelName="Skip Email Verification"
-								onCheckedChange={(checked: boolean): void => {
+								onChange={(checked: boolean): void => {
 									form.setFieldValue(
 										['googleAuthConfig', 'insecureSkipEmailVerified'],
 										checked,
 									);
 								}}
-							/>
+							>
+								Skip Email Verification
+							</Checkbox>
 						</Form.Item>
 						<Tooltip title='Whether to skip email verification. Defaults to "false"'>
 							<CircleHelp size={14} color={Style.L3_FOREGROUND} cursor="help" />
 						</Tooltip>
 					</div>
 
-					<Callout
-						type="warning"
-						size="small"
-						showIcon
-						description="Google OAuth2 won't be enabled unless you enter all the attributes above"
-						className="callout"
-					/>
+					<Callout type="warning" size="small" showIcon className="callout">
+						Google OAuth2 won&apos;t be enabled unless you enter all the attributes
+						above
+					</Callout>
 				</div>
 
 				{/* Right Column - Google Workspace Groups (Advanced) */}
@@ -215,16 +211,17 @@ function ConfigureGoogleAuthAuthnProvider({
 								<div className="authn-provider__checkbox-row">
 									<Form.Item
 										name={['googleAuthConfig', 'fetchGroups']}
-										valuePropName="checked"
+										valuePropName="value"
 										noStyle
 									>
 										<Checkbox
 											id="google-fetch-groups"
-											labelName="Fetch Groups"
-											onCheckedChange={(checked: boolean): void => {
+											onChange={(checked: boolean): void => {
 												form.setFieldValue(['googleAuthConfig', 'fetchGroups'], checked);
 											}}
-										/>
+										>
+											Fetch Groups
+										</Checkbox>
 									</Form.Item>
 									<Tooltip title="Enable fetching Google Workspace groups for the user. Requires service account configuration.">
 										<CircleHelp size={14} color={Style.L3_FOREGROUND} cursor="help" />
@@ -263,19 +260,20 @@ function ConfigureGoogleAuthAuthnProvider({
 										<div className="authn-provider__checkbox-row">
 											<Form.Item
 												name={['googleAuthConfig', 'fetchTransitiveGroupMembership']}
-												valuePropName="checked"
+												valuePropName="value"
 												noStyle
 											>
 												<Checkbox
 													id="google-transitive-membership"
-													labelName="Fetch Transitive Group Membership"
-													onCheckedChange={(checked: boolean): void => {
+													onChange={(checked: boolean): void => {
 														form.setFieldValue(
 															['googleAuthConfig', 'fetchTransitiveGroupMembership'],
 															checked,
 														);
 													}}
-												/>
+												>
+													Fetch Transitive Group Membership
+												</Checkbox>
 											</Form.Item>
 											<Tooltip title="If enabled, recursively fetch groups that contain other groups (transitive membership).">
 												<CircleHelp size={14} color={Style.L3_FOREGROUND} cursor="help" />

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

@@ -1,9 +1,7 @@
 import { useCallback, useState } from 'react';
-import { Callout } from '@signozhq/callout';
-import { Checkbox } from '@signozhq/checkbox';
 import { Style } from '@signozhq/design-tokens';
 import { CircleHelp } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
+import { Callout, Checkbox, Input } from '@signozhq/ui';
 import { Form, Tooltip } from 'antd';
 
 import ClaimMappingSection from './components/ClaimMappingSection';
@@ -145,19 +143,20 @@ function ConfigureOIDCAuthnProvider({
 					<div className="authn-provider__checkbox-row">
 						<Form.Item
 							name={['oidcConfig', 'insecureSkipEmailVerified']}
-							valuePropName="checked"
+							valuePropName="value"
 							noStyle
 						>
 							<Checkbox
 								id="oidc-skip-email-verification"
-								labelName="Skip Email Verification"
-								onCheckedChange={(checked: boolean): void => {
+								onChange={(checked: boolean): void => {
 									form.setFieldValue(
 										['oidcConfig', 'insecureSkipEmailVerified'],
 										checked,
 									);
 								}}
-							/>
+							>
+								Skip Email Verification
+							</Checkbox>
 						</Form.Item>
 						<Tooltip title='Whether to skip email verification. Defaults to "false"'>
 							<CircleHelp size={14} color={Style.L3_FOREGROUND} cursor="help" />
@@ -167,29 +166,26 @@ function ConfigureOIDCAuthnProvider({
 					<div className="authn-provider__checkbox-row">
 						<Form.Item
 							name={['oidcConfig', 'getUserInfo']}
-							valuePropName="checked"
+							valuePropName="value"
 							noStyle
 						>
 							<Checkbox
 								id="oidc-get-user-info"
-								labelName="Get User Info"
-								onCheckedChange={(checked: boolean): void => {
+								onChange={(checked: boolean): void => {
 									form.setFieldValue(['oidcConfig', 'getUserInfo'], checked);
 								}}
-							/>
+							>
+								Get User Info
+							</Checkbox>
 						</Form.Item>
 						<Tooltip title="Use the userinfo endpoint to get additional claims. Useful when providers return thin ID tokens.">
 							<CircleHelp size={14} color={Style.L3_FOREGROUND} cursor="help" />
 						</Tooltip>
 					</div>
 
-					<Callout
-						type="warning"
-						size="small"
-						showIcon
-						description="OIDC won't be enabled unless you enter all the attributes above"
-						className="callout"
-					/>
+					<Callout type="warning" size="small" showIcon className="callout">
+						OIDC won&apos;t be enabled unless you enter all the attributes above
+					</Callout>
 				</div>
 
 				{/* Right Column - Advanced Settings */}

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

@@ -1,9 +1,7 @@
 import { useCallback, useState } from 'react';
-import { Callout } from '@signozhq/callout';
-import { Checkbox } from '@signozhq/checkbox';
 import { Style } from '@signozhq/design-tokens';
 import { CircleHelp } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
+import { Callout, Checkbox, Input } from '@signozhq/ui';
 import { Form, Input as AntdInput, Tooltip } from 'antd';
 
 import AttributeMappingSection from './components/AttributeMappingSection';
@@ -142,32 +140,29 @@ function ConfigureSAMLAuthnProvider({
 					<div className="authn-provider__checkbox-row">
 						<Form.Item
 							name={['samlConfig', 'insecureSkipAuthNRequestsSigned']}
-							valuePropName="checked"
+							valuePropName="value"
 							noStyle
 						>
 							<Checkbox
 								id="saml-skip-signing"
-								labelName="Skip Signing AuthN Requests"
-								onCheckedChange={(checked: boolean): void => {
+								onChange={(checked: boolean): void => {
 									form.setFieldValue(
 										['samlConfig', 'insecureSkipAuthNRequestsSigned'],
 										checked,
 									);
 								}}
-							/>
+							>
+								Skip Signing AuthN Requests
+							</Checkbox>
 						</Form.Item>
 						<Tooltip title="Whether to skip signing the SAML requests. For providers like JumpCloud, this should be enabled.">
 							<CircleHelp size={14} color={Style.L3_FOREGROUND} cursor="help" />
 						</Tooltip>
 					</div>
 
-					<Callout
-						type="warning"
-						size="small"
-						showIcon
-						description="SAML won't be enabled unless you enter all the attributes above"
-						className="callout"
-					/>
+					<Callout type="warning" size="small" showIcon className="callout">
+						SAML won&apos;t be enabled unless you enter all the attributes above
+					</Callout>
 				</div>
 
 				{/* Right Column - Advanced Settings */}

frontend/src/container/OrganizationSettings/AuthDomain/CreateEdit/Providers/components/AttributeMappingSection.tsx

@@ -6,7 +6,7 @@ import {
 	CircleHelp,
 	TriangleAlert,
 } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
+import { Input } from '@signozhq/ui';
 import { Collapse, Form, Tooltip } from 'antd';
 import { useCollapseSectionErrors } from 'hooks/useCollapseSectionErrors';
 

frontend/src/container/OrganizationSettings/AuthDomain/CreateEdit/Providers/components/ClaimMappingSection.tsx

@@ -6,7 +6,7 @@ import {
 	CircleHelp,
 	TriangleAlert,
 } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
+import { Input } from '@signozhq/ui';
 import { Collapse, Form, Tooltip } from 'antd';
 import { useCollapseSectionErrors } from 'hooks/useCollapseSectionErrors';
 

frontend/src/container/OrganizationSettings/AuthDomain/CreateEdit/Providers/components/DomainMappingList.tsx

@@ -1,6 +1,5 @@
-import { Button } from '@signozhq/button';
 import { Plus, Trash2 } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
+import { Button, Input } from '@signozhq/ui';
 import { Form } from 'antd';
 
 import './DomainMappingList.styles.scss';
@@ -72,7 +71,7 @@ function DomainMappingList({
 						<Button
 							variant="dashed"
 							onClick={(): void => add({ domain: '', adminEmail: '' })}
-							prefixIcon={<Plus size={14} />}
+							prefix={<Plus size={14} />}
 							className="domain-mapping-list__add-btn"
 						>
 							Add Domain Mapping

frontend/src/container/OrganizationSettings/AuthDomain/CreateEdit/Providers/components/RoleMappingSection.tsx

@@ -1,6 +1,4 @@
 import { useCallback, useState } from 'react';
-import { Button } from '@signozhq/button';
-import { Checkbox } from '@signozhq/checkbox';
 import { Color, Style } from '@signozhq/design-tokens';
 import {
 	ChevronDown,
@@ -10,7 +8,7 @@ import {
 	Trash2,
 	TriangleAlert,
 } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
+import { Button, Checkbox, Input } from '@signozhq/ui';
 import { Collapse, Form, Select, Tooltip } from 'antd';
 import { useCollapseSectionErrors } from 'hooks/useCollapseSectionErrors';
 
@@ -128,16 +126,17 @@ function RoleMappingSection({
 						<div className="role-mapping-section__checkbox-row">
 							<Form.Item
 								name={[...fieldNamePrefix, 'useRoleAttribute']}
-								valuePropName="checked"
+								valuePropName="value"
 								noStyle
 							>
 								<Checkbox
 									id="use-role-attribute"
-									labelName="Use Role Attribute Directly"
-									onCheckedChange={(checked: boolean): void => {
+									onChange={(checked: boolean): void => {
 										form.setFieldValue([...fieldNamePrefix, 'useRoleAttribute'], checked);
 									}}
-								/>
+								>
+									Use Role Attribute Directly
+								</Checkbox>
 							</Form.Item>
 							<Tooltip title="If enabled, the role claim/attribute from the IDP will be used directly instead of group mappings. The role value must match a SigNoz role (VIEWER, EDITOR, or ADMIN).">
 								<CircleHelp size={14} color={Style.L3_FOREGROUND} cursor="help" />
@@ -196,7 +195,7 @@ function RoleMappingSection({
 											<Button
 												variant="dashed"
 												onClick={(): void => add({ groupName: '', role: 'VIEWER' })}
-												prefixIcon={<Plus size={14} />}
+												prefix={<Plus size={14} />}
 												className="role-mapping-section__add-btn"
 											>
 												Add Group Mapping

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

@@ -1,8 +1,7 @@
 import { useCallback, useMemo, useState } from 'react';
 import { PlusOutlined } from '@ant-design/icons';
-import { Button } from '@signozhq/button';
 import { Trash2, X } from '@signozhq/icons';
-import { toast } from '@signozhq/ui';
+import { Button, toast } from '@signozhq/ui';
 import { Modal, Table, TableColumnsType as ColumnsType } from 'antd';
 import { ErrorResponseHandlerForGeneratedAPIs } from 'api/ErrorResponseHandlerForGeneratedAPIs';
 import {
@@ -182,7 +181,7 @@ function AuthDomain(): JSX.Element {
 			<section className="auth-domain-header">
 				<h3 className="auth-domain-title">Authenticated Domains</h3>
 				<Button
-					prefixIcon={<PlusOutlined />}
+					prefix={<PlusOutlined />}
 					onClick={(): void => {
 						setAddDomain(true);
 					}}
@@ -230,13 +229,13 @@ function AuthDomain(): JSX.Element {
 						key="cancel"
 						onClick={hideDeleteModal}
 						className="cancel-btn"
-						prefixIcon={<X size={16} />}
+						prefix={<X size={16} />}
 					>
 						Cancel
 					</Button>,
 					<Button
 						key="submit"
-						prefixIcon={<Trash2 size={16} />}
+						prefix={<Trash2 size={16} />}
 						onClick={handleDeleteDomain}
 						className="delete-btn"
 						loading={isLoading}

frontend/src/container/ResetPassword/index.tsx

@@ -1,8 +1,7 @@
 import { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { useLocation } from 'react-use';
-import { Button } from '@signozhq/button';
-import { Callout } from '@signozhq/callout';
+import { Button, Callout } from '@signozhq/ui';
 import { Form, Input as AntdInput, Typography } from 'antd';
 import { Logout } from 'api/utils';
 import resetPasswordApi from 'api/v1/factor_password/resetPassword';
@@ -215,8 +214,9 @@ function ResetPassword({ version }: ResetPasswordProps): JSX.Element {
 							showIcon
 							icon={<CircleAlert size={12} />}
 							className="reset-password-error-callout"
-							description="Passwords don't match. Please try again."
-						/>
+						>
+							Passwords don&apos;t match. Please try again.
+						</Callout>
 					)}
 
 					{errorMessage && !confirmPasswordError && (
@@ -231,7 +231,7 @@ function ResetPassword({ version }: ResetPasswordProps): JSX.Element {
 							data-attr="reset-password"
 							disabled={!isValidPassword || loading}
 							className="reset-password-submit-button"
-							suffixIcon={<ArrowRight size={16} />}
+							suffix={<ArrowRight size={16} />}
 						>
 							Reset Password
 						</Button>

frontend/src/container/RolesSettings/PermissionSidePanel/PermissionSidePanel.tsx

@@ -1,11 +1,11 @@
 import { useCallback, useEffect, useMemo, useState } from 'react';
-import { Button } from '@signozhq/button';
 import { ChevronDown, ChevronRight, X } from '@signozhq/icons';
 import {
+	Button,
 	RadioGroup,
 	RadioGroupItem,
 	RadioGroupLabel,
-} from '@signozhq/radio-group';
+} from '@signozhq/ui';
 import { Select, Skeleton } from 'antd';
 
 import {
@@ -69,17 +69,12 @@ function ResourceRow({
 				<div className="psp-resource__body">
 					<RadioGroup
 						value={config.scope}
-						onValueChange={(val): void =>
-							onScopeChange(resource.id, val as ScopeType)
-						}
+						onChange={(val): void => onScopeChange(resource.id, val as ScopeType)}
+						color="robin"
 						className="psp-resource__radio-group"
 					>
 						<div className="psp-resource__radio-item">
-							<RadioGroupItem
-								value={PermissionScope.ALL}
-								id={`${resource.id}-all`}
-								color="robin"
-							/>
+							<RadioGroupItem value={PermissionScope.ALL} id={`${resource.id}-all`} />
 							<RadioGroupLabel htmlFor={`${resource.id}-all`}>All</RadioGroupLabel>
 						</div>
 
@@ -87,7 +82,6 @@ function ResourceRow({
 							<RadioGroupItem
 								value={PermissionScope.ONLY_SELECTED}
 								id={`${resource.id}-only-selected`}
-								color="robin"
 							/>
 							<RadioGroupLabel htmlFor={`${resource.id}-only-selected`}>
 								Only selected
@@ -267,7 +261,7 @@ function PermissionSidePanel({
 						<Button
 							variant="solid"
 							color="secondary"
-							prefixIcon={<X size={14} />}
+							prefix={<X size={14} />}
 							onClick={unsavedCount > 0 ? handleDiscard : onClose}
 							size="sm"
 							disabled={isSaving}

frontend/src/container/RolesSettings/RoleDetails/RoleDetailsPage.tsx

@@ -1,10 +1,8 @@
 import { useEffect, useMemo, useState } from 'react';
 import { useQueryClient } from 'react-query';
 import { useHistory, useLocation } from 'react-router-dom';
-import { Button } from '@signozhq/button';
 import { Table2, Trash2, Users } from '@signozhq/icons';
-import { ToggleGroup, ToggleGroupItem } from '@signozhq/toggle-group';
-import { toast } from '@signozhq/ui';
+import { Button, toast, ToggleGroup, ToggleGroupItem } from '@signozhq/ui';
 import { Skeleton } from 'antd';
 import { useAuthzResources } from 'api/generated/services/authz';
 import {
@@ -193,7 +191,7 @@ function RoleDetailsPage(): JSX.Element {
 				<ToggleGroup
 					type="single"
 					value={activeTab}
-					onValueChange={(val): void => {
+					onChange={(val): void => {
 						if (val) {
 							setActiveTab(val as TabKey);
 						}

frontend/src/container/RolesSettings/RoleDetails/components/OverviewTab.tsx

@@ -1,4 +1,4 @@
-import { Callout } from '@signozhq/callout';
+import { Callout } from '@signozhq/ui';
 
 import { PermissionType, TimestampBadge } from '../../utils';
 import PermissionItem from './PermissionItem';
@@ -26,7 +26,7 @@ function OverviewTab({
 				<Callout
 					type="warning"
 					showIcon
-					message="This is a managed role. Permissions and settings are view-only and cannot be modified."
+					title="This is a managed role. Permissions and settings are view-only and cannot be modified."
 				/>
 			)}
 

frontend/src/container/RolesSettings/RolesComponents/CreateRoleModal.tsx

@@ -1,10 +1,8 @@
 import { useCallback, useEffect, useRef } from 'react';
 import { useQueryClient } from 'react-query';
 import { generatePath, useHistory } from 'react-router-dom';
-import { Button } from '@signozhq/button';
 import { X } from '@signozhq/icons';
-import { Input, inputVariants } from '@signozhq/input';
-import { toast } from '@signozhq/ui';
+import { Button, Input, toast } from '@signozhq/ui';
 import { Form, Modal } from 'antd';
 import {
 	invalidateGetRole,
@@ -176,7 +174,7 @@ function CreateRoleModal({
 				</Form.Item>
 				<Form.Item name="description" label="Description">
 					<textarea
-						className={inputVariants()}
+						className="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm text-foreground shadow-xs transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50"
 						placeholder="A helpful description of the role"
 					/>
 				</Form.Item>

frontend/src/container/RolesSettings/RolesComponents/DeleteRoleModal.tsx

@@ -1,5 +1,5 @@
-import { Button } from '@signozhq/button';
 import { Trash2, X } from '@signozhq/icons';
+import { Button } from '@signozhq/ui';
 import { Modal } from 'antd';
 
 interface DeleteRoleModalProps {
@@ -27,7 +27,7 @@ function DeleteRoleModal({
 				<Button
 					key="cancel"
 					className="cancel-btn"
-					prefixIcon={<X size={16} />}
+					prefix={<X size={16} />}
 					onClick={onCancel}
 					size="sm"
 					variant="solid"
@@ -38,7 +38,7 @@ function DeleteRoleModal({
 				<Button
 					key="delete"
 					className="delete-btn"
-					prefixIcon={<Trash2 size={16} />}
+					prefix={<Trash2 size={16} />}
 					onClick={onConfirm}
 					loading={isDeleting}
 					size="sm"

frontend/src/container/RolesSettings/RolesSettings.tsx

@@ -1,7 +1,6 @@
 import { useState } from 'react';
-import { Button } from '@signozhq/button';
 import { Plus } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
+import { Button, Input } from '@signozhq/ui';
 
 import { IS_ROLE_DETAILS_AND_CRUD_ENABLED } from './config';
 import CreateRoleModal from './RolesComponents/CreateRoleModal';

frontend/src/container/ServiceAccountsSettings/ServiceAccountsSettings.tsx

@@ -1,7 +1,6 @@
 import { useCallback, useEffect, useMemo } from 'react';
-import { Button } from '@signozhq/button';
 import { Check, ChevronDown, Plus } from '@signozhq/icons';
-import { Input } from '@signozhq/input';
+import { Button, Input } from '@signozhq/ui';
 import type { MenuProps } from 'antd';
 import { Dropdown } from 'antd';
 import { useListServiceAccounts } from 'api/generated/services/serviceaccount';
@@ -237,7 +236,6 @@ function ServiceAccountsSettings(): JSX.Element {
 								setPage(1);
 							}}
 							className="sa-settings-search-input"
-							color="secondary"
 						/>
 					</div>
 

frontend/src/container/ServiceAccountsSettings/__tests__/ServiceAccountsSettings.integration.test.tsx

@@ -11,17 +11,15 @@ const SA_ENDPOINT = '*/api/v1/service_accounts/:id';
 const SA_KEYS_ENDPOINT = '*/api/v1/service_accounts/:id/keys';
 const ROLES_ENDPOINT = '*/api/v1/roles';
 
-jest.mock('@signozhq/drawer', () => ({
+jest.mock('@signozhq/ui', () => ({
+	...jest.requireActual('@signozhq/ui'),
 	DrawerWrapper: ({
-		content,
+		children,
 		open,
 	}: {
-		content?: ReactNode;
+		children?: ReactNode;
 		open: boolean;
-	}): JSX.Element | null => (open ? <div>{content}</div> : null),
-}));
-
-jest.mock('@signozhq/dialog', () => ({
+	}): JSX.Element | null => (open ? <div>{children}</div> : null),
 	DialogWrapper: ({
 		children,
 		open,

frontend/src/container/SpanDetailsDrawer/SpanLogs/SpanLogs.tsx

@@ -1,6 +1,6 @@
 import { useCallback, useMemo } from 'react';
 import { Virtuoso } from 'react-virtuoso';
-import { Button } from '@signozhq/button';
+import { Button } from '@signozhq/ui';
 import { Typography } from 'antd';
 import cx from 'classnames';
 import RawLogView from 'components/Logs/RawLogView';
@@ -245,7 +245,7 @@ function SpanLogs({
 				<Button
 					className="action-btn"
 					variant="action"
-					prefixIcon={<Compass size={14} />}
+					prefix={<Compass size={14} />}
 					onClick={handleExplorerPageRedirect}
 					size="md"
 				>

frontend/src/container/SpanDetailsDrawer/__tests__/SpanDetailsDrawer.test.tsx

@@ -45,12 +45,6 @@ jest.mock('react-router-dom', () => ({
 	}),
 }));
 
-jest.mock('@signozhq/button', () => ({
-	Button: ({ children }: { children: React.ReactNode }): JSX.Element => (
-		<div>{children}</div>
-	),
-}));
-
 jest.mock('hooks/useSafeNavigate', () => ({
 	useSafeNavigate: (): { safeNavigate: jest.MockedFunction<() => void> } => ({
 		safeNavigate: mockSafeNavigate,

frontend/src/pages/SignUp/SignUp.tsx

@@ -1,7 +1,5 @@
 import { useMemo, useState } from 'react';
-import { Button } from '@signozhq/button';
-import { Callout } from '@signozhq/callout';
-import { Input } from '@signozhq/input';
+import { Button, Callout, Input } from '@signozhq/ui';
 import { Form, Input as AntdInput, Typography } from 'antd';
 import logEvent from 'api/common/logEvent';
 import signUpApi from 'api/v1/register/post';
@@ -203,13 +201,10 @@ function SignUp(): JSX.Element {
 						</div>
 					</div>
 
-					<Callout
-						type="info"
-						size="small"
-						showIcon
-						className="signup-info-callout"
-						description="This will create an admin account. If you are not an admin, please ask your admin for an invite link"
-					/>
+					<Callout type="info" size="small" showIcon className="signup-info-callout">
+						This will create an admin account. If you are not an admin, please ask
+						your admin for an invite link
+					</Callout>
 
 					{confirmPasswordError && (
 						<Callout
@@ -218,8 +213,9 @@ function SignUp(): JSX.Element {
 							showIcon
 							icon={<CircleAlert size={12} />}
 							className="signup-error-callout"
-							description="Passwords don't match. Please try again."
-						/>
+						>
+							Passwords don&apos;t match. Please try again.
+						</Callout>
 					)}
 
 					{formError && !confirmPasswordError && <AuthError error={formError} />}
@@ -232,7 +228,7 @@ function SignUp(): JSX.Element {
 							data-attr="signup"
 							disabled={!isValidForm}
 							className="signup-submit-button"
-							suffixIcon={<ArrowRight size={16} />}
+							suffix={<ArrowRight size={16} />}
 						>
 							Access My Workspace
 						</Button>

frontend/src/pages/TraceDetailV2/TraceDetailV2.tsx

@@ -4,7 +4,7 @@ import {
 	ResizableHandle,
 	ResizablePanel,
 	ResizablePanelGroup,
-} from '@signozhq/resizable';
+} from '@signozhq/ui';
 import { Button, Tabs } from 'antd';
 import FlamegraphImg from 'assets/TraceDetail/Flamegraph';
 import cx from 'classnames';
@@ -127,11 +127,7 @@ function TraceDetailsV2(): JSX.Element {
 	];
 
 	return (
-		<ResizablePanelGroup
-			direction="horizontal"
-			autoSaveId="trace-drawer"
-			className="trace-layout"
-		>
+		<ResizablePanelGroup orientation="horizontal" className="trace-layout">
 			<ResizablePanel minSize={20} maxSize={80} className="trace-left-content">
 				<TraceMetadata
 					traceID={traceId}

frontend/yarn.lock

@@ -4377,13 +4377,6 @@
   dependencies:
     cross-spawn "^7.0.6"
 
-"@radix-ui/primitive@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/primitive/-/primitive-1.0.0.tgz#e1d8ef30b10ea10e69c76e896f608d9276352253"
-  integrity sha512-3e7rn8FDMin4CgeL7Z/49smCA3rFYY3Ha2rUQ7HRWFadS5iCRw08ZgVT1LaNTCNqgvrUiyczLflrVrF0SRQtNA==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-
 "@radix-ui/primitive@1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@radix-ui/primitive/-/primitive-1.0.1.tgz#e46f9958b35d10e9f6dc71c497305c22e3e55dbd"
@@ -4446,13 +4439,6 @@
     "@radix-ui/react-primitive" "2.1.3"
     "@radix-ui/react-slot" "1.2.3"
 
-"@radix-ui/react-compose-refs@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-compose-refs/-/react-compose-refs-1.0.0.tgz#37595b1f16ec7f228d698590e78eeed18ff218ae"
-  integrity sha512-0KaSv6sx787/hK3eF53iOkiSLwAGlFMx5lotrqD2pTjB18KbybKoEIgkNZTKC60YECDQTKGTRcDBILwZVqVKvA==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-
 "@radix-ui/react-compose-refs@1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-compose-refs/-/react-compose-refs-1.0.1.tgz#7ed868b66946aa6030e580b1ffca386dd4d21989"
@@ -4465,13 +4451,6 @@
   resolved "https://registry.yarnpkg.com/@radix-ui/react-compose-refs/-/react-compose-refs-1.1.2.tgz#a2c4c47af6337048ee78ff6dc0d090b390d2bb30"
   integrity sha512-z4eqJvfiNnFMHIIvXP3CY57y2WJs5g2v3X0zm9mEJkrkNv4rDxu+sg9Jh8EkXyeqBkB7SOcboo9dMVqhyrACIg==
 
-"@radix-ui/react-context@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-context/-/react-context-1.0.0.tgz#f38e30c5859a9fb5e9aa9a9da452ee3ed9e0aee0"
-  integrity sha512-1pVM9RfOQ+n/N5PJK33kRSKsr1glNxomxONs5c49MliinBY6Yw2Q995qfBUUo0/Mbg05B/sGA0gkgPI7kmSHBg==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-
 "@radix-ui/react-context@1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-context/-/react-context-1.0.1.tgz#fe46e67c96b240de59187dcb7a1a50ce3e2ec00c"
@@ -4484,28 +4463,7 @@
   resolved "https://registry.yarnpkg.com/@radix-ui/react-context/-/react-context-1.1.2.tgz#61628ef269a433382c364f6f1e3788a6dc213a36"
   integrity sha512-jCi/QKUM2r1Ju5a3J64TH2A5SpKAgh0LpknyqdQ4m6DCV0xJ2HG1xARRwNGPQfi1SLdLWZ1OJz6F4OMBBNiGJA==
 
-"@radix-ui/react-dialog@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-dialog/-/react-dialog-1.0.0.tgz#997e97cb183bc90bd888b26b8e23a355ac9fe5f0"
-  integrity sha512-Yn9YU+QlHYLWwV1XfKiqnGVpWYWk6MeBVM6x/bcoyPvxgjQGoeT35482viLPctTMWoMw0PoHgqfSox7Ig+957Q==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/primitive" "1.0.0"
-    "@radix-ui/react-compose-refs" "1.0.0"
-    "@radix-ui/react-context" "1.0.0"
-    "@radix-ui/react-dismissable-layer" "1.0.0"
-    "@radix-ui/react-focus-guards" "1.0.0"
-    "@radix-ui/react-focus-scope" "1.0.0"
-    "@radix-ui/react-id" "1.0.0"
-    "@radix-ui/react-portal" "1.0.0"
-    "@radix-ui/react-presence" "1.0.0"
-    "@radix-ui/react-primitive" "1.0.0"
-    "@radix-ui/react-slot" "1.0.0"
-    "@radix-ui/react-use-controllable-state" "1.0.0"
-    aria-hidden "^1.1.1"
-    react-remove-scroll "2.5.4"
-
-"@radix-ui/react-dialog@^1.1.1", "@radix-ui/react-dialog@^1.1.11", "@radix-ui/react-dialog@^1.1.6":
+"@radix-ui/react-dialog@^1.1.11", "@radix-ui/react-dialog@^1.1.6":
   version "1.1.15"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-dialog/-/react-dialog-1.1.15.tgz#1de3d7a7e9a17a9874d29c07f5940a18a119b632"
   integrity sha512-TCglVRtzlffRNxRMEyR36DGBLJpeusFcgMVD9PZEzAKnUs1lKCgX5u9BmC2Yg+LL9MgZDugFFs1Vl+Jp4t/PGw==
@@ -4537,18 +4495,6 @@
   resolved "https://registry.yarnpkg.com/@radix-ui/react-direction/-/react-direction-1.1.1.tgz#39e5a5769e676c753204b792fbe6cf508e550a14"
   integrity sha512-1UEWRX6jnOA2y4H5WczZ44gOOjTEmlqv1uNW4GAJEO5+bauCBhv8snY65Iw5/VOS/ghKN9gr2KjnLKxrsvoMVw==
 
-"@radix-ui/react-dismissable-layer@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-dismissable-layer/-/react-dismissable-layer-1.0.0.tgz#35b7826fa262fd84370faef310e627161dffa76b"
-  integrity sha512-n7kDRfx+LB1zLueRDvZ1Pd0bxdJWDUZNQ/GWoxDn2prnuJKRdxsjulejX/ePkOsLi2tTm6P24mDqlMSgQpsT6g==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/primitive" "1.0.0"
-    "@radix-ui/react-compose-refs" "1.0.0"
-    "@radix-ui/react-primitive" "1.0.0"
-    "@radix-ui/react-use-callback-ref" "1.0.0"
-    "@radix-ui/react-use-escape-keydown" "1.0.0"
-
 "@radix-ui/react-dismissable-layer@1.0.5":
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-dismissable-layer/-/react-dismissable-layer-1.0.5.tgz#3f98425b82b9068dfbab5db5fff3df6ebf48b9d4"
@@ -4585,28 +4531,11 @@
     "@radix-ui/react-primitive" "2.1.3"
     "@radix-ui/react-use-controllable-state" "1.2.2"
 
-"@radix-ui/react-focus-guards@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-focus-guards/-/react-focus-guards-1.0.0.tgz#339c1c69c41628c1a5e655f15f7020bf11aa01fa"
-  integrity sha512-UagjDk4ijOAnGu4WMUPj9ahi7/zJJqNZ9ZAiGPp7waUWJO0O1aWXi/udPphI0IUjvrhBsZJGSN66dR2dsueLWQ==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-
 "@radix-ui/react-focus-guards@1.1.3":
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-focus-guards/-/react-focus-guards-1.1.3.tgz#2a5669e464ad5fde9f86d22f7fdc17781a4dfa7f"
   integrity sha512-0rFg/Rj2Q62NCm62jZw0QX7a3sz6QCQU0LpZdNrJX8byRGaGVTqbrW9jAoIAHyMQqsNpeZ81YgSizOt5WXq0Pw==
 
-"@radix-ui/react-focus-scope@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-focus-scope/-/react-focus-scope-1.0.0.tgz#95a0c1188276dc8933b1eac5f1cdb6471e01ade5"
-  integrity sha512-C4SWtsULLGf/2L4oGeIHlvWQx7Rf+7cX/vKOAD2dXW0A1b5QXwi3wWeaEgW+wn+SEVrraMUk05vLU9fZZz5HbQ==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-compose-refs" "1.0.0"
-    "@radix-ui/react-primitive" "1.0.0"
-    "@radix-ui/react-use-callback-ref" "1.0.0"
-
 "@radix-ui/react-focus-scope@1.1.7":
   version "1.1.7"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-focus-scope/-/react-focus-scope-1.1.7.tgz#dfe76fc103537d80bf42723a183773fd07bfb58d"
@@ -4621,14 +4550,6 @@
   resolved "https://registry.yarnpkg.com/@radix-ui/react-icons/-/react-icons-1.3.2.tgz#09be63d178262181aeca5fb7f7bc944b10a7f441"
   integrity sha512-fyQIhGDhzfc9pK2kH6Pl9c4BDJGfMkPqkyIgYDthyNYoNg3wVhoJMMh19WS4Up/1KMPFVpNsT2q3WmXn2N1m6g==
 
-"@radix-ui/react-id@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-id/-/react-id-1.0.0.tgz#8d43224910741870a45a8c9d092f25887bb6d11e"
-  integrity sha512-Q6iAB/U7Tq3NTolBBQbHTgclPmGWE3OlktGGqrClPozSw4vkQ1DfQAOtzgRPecKsMdJINE05iaoDUG8tRzCBjw==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-use-layout-effect" "1.0.0"
-
 "@radix-ui/react-id@1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-id/-/react-id-1.0.1.tgz#73cdc181f650e4df24f0b6a5b7aa426b912c88c0"
@@ -4668,7 +4589,7 @@
     aria-hidden "^1.2.4"
     react-remove-scroll "^2.6.3"
 
-"@radix-ui/react-popover@^1.1.15", "@radix-ui/react-popover@^1.1.2":
+"@radix-ui/react-popover@^1.1.15":
   version "1.1.15"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-popover/-/react-popover-1.1.15.tgz#9c852f93990a687ebdc949b2c3de1f37cdc4c5d5"
   integrity sha512-kr0X2+6Yy/vJzLYJUPCZEc8SfQcf+1COFoAqauJm74umQhta9M7lNJHP7QQS3vkvcGLQUbWpMzwrXYwrYztHKA==
@@ -4722,14 +4643,6 @@
     "@radix-ui/react-use-size" "1.1.1"
     "@radix-ui/rect" "1.1.1"
 
-"@radix-ui/react-portal@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-portal/-/react-portal-1.0.0.tgz#7220b66743394fabb50c55cb32381395cc4a276b"
-  integrity sha512-a8qyFO/Xb99d8wQdu4o7qnigNjTPG123uADNecz0eX4usnQEj7o+cG4ZX4zkqq98NYekT7UoEQIjxBNWIFuqTA==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-primitive" "1.0.0"
-
 "@radix-ui/react-portal@1.0.4":
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-portal/-/react-portal-1.0.4.tgz#df4bfd353db3b1e84e639e9c63a5f2565fb00e15"
@@ -4746,15 +4659,6 @@
     "@radix-ui/react-primitive" "2.1.3"
     "@radix-ui/react-use-layout-effect" "1.1.1"
 
-"@radix-ui/react-presence@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-presence/-/react-presence-1.0.0.tgz#814fe46df11f9a468808a6010e3f3ca7e0b2e84a"
-  integrity sha512-A+6XEvN01NfVWiKu38ybawfHsBjWum42MRPnEuqPsBZ4eV7e/7K321B5VgYMPv3Xx5An6o1/l9ZuDBgmcmWK3w==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-compose-refs" "1.0.0"
-    "@radix-ui/react-use-layout-effect" "1.0.0"
-
 "@radix-ui/react-presence@1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-presence/-/react-presence-1.0.1.tgz#491990ba913b8e2a5db1b06b203cb24b5cdef9ba"
@@ -4772,14 +4676,6 @@
     "@radix-ui/react-compose-refs" "1.1.2"
     "@radix-ui/react-use-layout-effect" "1.1.1"
 
-"@radix-ui/react-primitive@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-primitive/-/react-primitive-1.0.0.tgz#376cd72b0fcd5e0e04d252ed33eb1b1f025af2b0"
-  integrity sha512-EyXe6mnRlHZ8b6f4ilTDrXmkLShICIuOTTj0GX4w1rp+wSxf3+TD05u1UOITC8VsJ2a9nwHvdXtOXEOl0Cw/zQ==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-slot" "1.0.0"
-
 "@radix-ui/react-primitive@1.0.3":
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-primitive/-/react-primitive-1.0.3.tgz#d49ea0f3f0b2fe3ab1cb5667eb03e8b843b914d0"
@@ -4849,14 +4745,6 @@
     "@radix-ui/react-use-callback-ref" "1.1.1"
     "@radix-ui/react-use-controllable-state" "1.2.2"
 
-"@radix-ui/react-slot@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-slot/-/react-slot-1.0.0.tgz#7fa805b99891dea1e862d8f8fbe07f4d6d0fd698"
-  integrity sha512-3mrKauI/tWXo1Ll+gN5dHcxDPdm/Df1ufcDLCecn+pnCIVcdWE7CujXo8QaXOWRJyZyQWWbpB8eFwHzWXlv5mQ==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-compose-refs" "1.0.0"
-
 "@radix-ui/react-slot@1.0.2":
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-slot/-/react-slot-1.0.2.tgz#a9ff4423eade67f501ffb32ec22064bc9d3099ab"
@@ -4865,7 +4753,7 @@
     "@babel/runtime" "^7.13.10"
     "@radix-ui/react-compose-refs" "1.0.1"
 
-"@radix-ui/react-slot@1.2.3", "@radix-ui/react-slot@^1.1.0", "@radix-ui/react-slot@^1.2.3":
+"@radix-ui/react-slot@1.2.3", "@radix-ui/react-slot@^1.2.3":
   version "1.2.3"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-slot/-/react-slot-1.2.3.tgz#502d6e354fc847d4169c3bc5f189de777f68cfe1"
   integrity sha512-aeNmHnBxbi2St0au6VBVC7JXFlhLlOnvIIlePNniyUNAClzmtAUEY8/pBiK3iHjufOlwA+c20/8jngo7xcrg8A==
@@ -4980,13 +4868,6 @@
     "@radix-ui/react-use-controllable-state" "1.2.2"
     "@radix-ui/react-visually-hidden" "1.2.3"
 
-"@radix-ui/react-use-callback-ref@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.0.0.tgz#9e7b8b6b4946fe3cbe8f748c82a2cce54e7b6a90"
-  integrity sha512-GZtyzoHz95Rhs6S63D2t/eqvdFCm7I+yHMLVQheKM7nBD8mbZIt+ct1jz4536MDnaOGKIxynJ8eHTkVGVVkoTg==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-
 "@radix-ui/react-use-callback-ref@1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.0.1.tgz#f4bb1f27f2023c984e6534317ebc411fc181107a"
@@ -4999,14 +4880,6 @@
   resolved "https://registry.yarnpkg.com/@radix-ui/react-use-callback-ref/-/react-use-callback-ref-1.1.1.tgz#62a4dba8b3255fdc5cc7787faeac1c6e4cc58d40"
   integrity sha512-FkBMwD+qbGQeMu1cOHnuGB6x4yzPjho8ap5WtbEJ26umhgqVXbhekKUQO+hZEL1vU92a3wHwdp0HAcqAUF5iDg==
 
-"@radix-ui/react-use-controllable-state@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-controllable-state/-/react-use-controllable-state-1.0.0.tgz#a64deaafbbc52d5d407afaa22d493d687c538b7f"
-  integrity sha512-FohDoZvk3mEXh9AWAVyRTYR4Sq7/gavuofglmiXB2g1aKyboUD4YtgWxKj8O5n+Uak52gXQ4wKz5IFST4vtJHg==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-use-callback-ref" "1.0.0"
-
 "@radix-ui/react-use-controllable-state@1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-use-controllable-state/-/react-use-controllable-state-1.0.1.tgz#ecd2ced34e6330caf89a82854aa2f77e07440286"
@@ -5030,14 +4903,6 @@
   dependencies:
     "@radix-ui/react-use-layout-effect" "1.1.1"
 
-"@radix-ui/react-use-escape-keydown@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-escape-keydown/-/react-use-escape-keydown-1.0.0.tgz#aef375db4736b9de38a5a679f6f49b45a060e5d1"
-  integrity sha512-JwfBCUIfhXRxKExgIqGa4CQsiMemo1Xt0W/B4ei3fpzpvPENKpMKQ8mZSB6Acj3ebrAEgi2xiQvcI1PAAodvyg==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-    "@radix-ui/react-use-callback-ref" "1.0.0"
-
 "@radix-ui/react-use-escape-keydown@1.0.3":
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-use-escape-keydown/-/react-use-escape-keydown-1.0.3.tgz#217b840c250541609c66f67ed7bab2b733620755"
@@ -5053,13 +4918,6 @@
   dependencies:
     "@radix-ui/react-use-callback-ref" "1.1.1"
 
-"@radix-ui/react-use-layout-effect@1.0.0":
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-1.0.0.tgz#2fc19e97223a81de64cd3ba1dc42ceffd82374dc"
-  integrity sha512-6Tpkq+R6LOlmQb1R5NNETLG0B4YP0wc+klfXafpUCj6JGyaUc8il7/kUZ7m59rGbXGczE9Bs+iz2qloqsZBduQ==
-  dependencies:
-    "@babel/runtime" "^7.13.10"
-
 "@radix-ui/react-use-layout-effect@1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@radix-ui/react-use-layout-effect/-/react-use-layout-effect-1.0.1.tgz#be8c7bc809b0c8934acf6657b577daf948a75399"
@@ -5503,142 +5361,12 @@
   resolved "https://registry.yarnpkg.com/@shikijs/vscode-textmate/-/vscode-textmate-10.0.2.tgz#a90ab31d0cc1dfb54c66a69e515bf624fa7b2224"
   integrity sha512-83yeghZ2xxin3Nj8z1NMd/NCuca+gsYXswywDy5bHvwlWL8tpTQmzGeUuHd9FC3E/SBEMvzJRwWEOz5gGes9Qg==
 
-"@signozhq/button@0.0.1":
-  version "0.0.1"
-  resolved "https://registry.yarnpkg.com/@signozhq/button/-/button-0.0.1.tgz#7d3204454b0361bd3fdf91fa6604af01a481a9db"
-  integrity sha512-k5WFpckNXzwcTS82jU+65M3V1KdriopBObB1ls7W2OU0RKof6Gf+/9uqDXnuu+Y4Cxn2cPo8+6MfiQbS02LHeg==
-  dependencies:
-    "@radix-ui/react-icons" "^1.3.0"
-    "@radix-ui/react-slot" "^1.1.0"
-    class-variance-authority "^0.7.0"
-    clsx "^2.1.1"
-    lucide-react "^0.445.0"
-    tailwind-merge "^2.5.2"
-    tailwindcss-animate "^1.0.7"
-
-"@signozhq/button@0.0.2", "@signozhq/button@^0.0.2":
-  version "0.0.2"
-  resolved "https://registry.yarnpkg.com/@signozhq/button/-/button-0.0.2.tgz#c13edef1e735134b784a41f874b60a14bc16993f"
-  integrity sha512-434/gbTykC00LrnzFPp7c33QPWZkf9n+8+SToLZFTB0rzcaS/xoB4b7QKhvk+8xLCj4zpw6BxfeRAL+gSoOUJw==
-  dependencies:
-    "@radix-ui/react-icons" "^1.3.0"
-    "@radix-ui/react-slot" "^1.1.0"
-    class-variance-authority "^0.7.0"
-    clsx "^2.1.1"
-    lucide-react "^0.445.0"
-    tailwind-merge "^2.5.2"
-    tailwindcss-animate "^1.0.7"
-
-"@signozhq/calendar@0.0.0":
-  version "0.0.0"
-  resolved "https://registry.yarnpkg.com/@signozhq/calendar/-/calendar-0.0.0.tgz#93b2cec2586efee814df934f88a2193cec95bae9"
-  integrity sha512-lm7tzPEhaHNjrksvi2GPGH4suEe6x2DQJ2dpku+JmKyLGB5rg9saSAosvrZVKhXLoZuSSjlBSkz+oHYEKIdHfA==
-  dependencies:
-    "@radix-ui/react-icons" "^1.3.0"
-    "@radix-ui/react-slot" "^1.2.3"
-    "@signozhq/button" "0.0.1"
-    class-variance-authority "^0.7.0"
-    clsx "^2.1.1"
-    date-fns "^4.1.0"
-    lucide-react "^0.445.0"
-    react-day-picker "^9.8.1"
-    tailwind-merge "^2.5.2"
-    tailwindcss-animate "^1.0.7"
-
-"@signozhq/callout@0.0.2":
-  version "0.0.2"
-  resolved "https://registry.yarnpkg.com/@signozhq/callout/-/callout-0.0.2.tgz#131ca15f89a8ee6729fecc4d322f11359c02e5cf"
-  integrity sha512-tmguHm+/JVRKjMElJOFyG7LJcdqCW1hHnFfp8ZkjQ+Gi7MfFt/r2foLZG2DNdOcfxSvhf2zhzr7D+epgvmbQ1A==
-  dependencies:
-    "@radix-ui/react-icons" "^1.3.0"
-    "@radix-ui/react-slot" "^1.1.0"
-    class-variance-authority "^0.7.0"
-    clsx "^2.1.1"
-    lucide-react "^0.445.0"
-    lucide-solid "^0.510.0"
-    tailwind-merge "^2.5.2"
-    tailwindcss-animate "^1.0.7"
-
-"@signozhq/checkbox@0.0.2":
-  version "0.0.2"
-  resolved "https://registry.yarnpkg.com/@signozhq/checkbox/-/checkbox-0.0.2.tgz#d11fb5eff3927c540937e3bd24351bfc1fdef9ec"
-  integrity sha512-odQdh839GaTy1kqC8yavUKrOYP5tiIppUIV7xGNyxs/KnLGDWLw3ZSdACRV1Z55CLddjQ6OWKiwyVV7t+sxEuw==
-  dependencies:
-    "@radix-ui/react-checkbox" "^1.2.3"
-    "@radix-ui/react-icons" "^1.3.0"
-    "@radix-ui/react-slot" "^1.1.0"
-    class-variance-authority "^0.7.0"
-    clsx "^2.1.1"
-    lucide-react "^0.445.0"
-    tailwind-merge "^2.5.2"
-    tailwindcss-animate "^1.0.7"
-
-"@signozhq/combobox@0.0.2":
-  version "0.0.2"
-  resolved "https://registry.yarnpkg.com/@signozhq/combobox/-/combobox-0.0.2.tgz#019cc6d619e4eb6d1061fdfa00d4bd99d6aa727f"
-  integrity sha512-QnGCNJAHd55Wqblw0CLOEOJoLFx8dgP+q/9hXbN5qil72DjRzxBgb5DAkIkon0owCmlagDQknFiOygYnzVJS8g==
-  dependencies:
-    "@radix-ui/react-icons" "^1.3.0"
-    "@radix-ui/react-popover" "^1.1.2"
-    "@radix-ui/react-slot" "^1.1.0"
-    "@signozhq/icons" "^0.1.0"
-    class-variance-authority "^0.7.0"
-    clsx "^2.1.1"
-    cmdk "^0.2.1"
-    lucide-react "^0.445.0"
-    tailwind-merge "^2.5.2"
-    tailwindcss-animate "^1.0.7"
-
-"@signozhq/command@0.0.0":
-  version "0.0.0"
-  resolved "https://registry.yarnpkg.com/@signozhq/command/-/command-0.0.0.tgz#bd1e1cac7346e862dd61df64b756302e89e1a322"
-  integrity sha512-AwRYxZTi4o8SBOL4hmgcgbhCKXl2Qb/TUSLbSYEMFdiQSl5VYA8XZJv5fSYVMJkAIlOaHzFzR04XNEU7lZcBpw==
-  dependencies:
-    "@radix-ui/react-dialog" "^1.1.11"
-    "@radix-ui/react-icons" "^1.3.0"
-    "@radix-ui/react-slot" "^1.1.0"
-    class-variance-authority "^0.7.0"
-    clsx "^2.1.1"
-    cmdk "^1.1.1"
-    lucide-react "^0.445.0"
-    tailwind-merge "^2.5.2"
-    tailwindcss-animate "^1.0.7"
-
 "@signozhq/design-tokens@2.1.4":
   version "2.1.4"
   resolved "https://registry.yarnpkg.com/@signozhq/design-tokens/-/design-tokens-2.1.4.tgz#f209da6fbd2ac97ab4434b71472f741009306550"
   integrity sha512-Ny7/VA5YGFFmZx58jMh7ATFyu7VePaJ4ySmj/DopP1hilmfdxQsKWnpqKaZJWRXrbNkc0gmq3cR7q7Z8nnN7ZQ==
 
-"@signozhq/dialog@^0.0.2":
-  version "0.0.2"
-  resolved "https://registry.yarnpkg.com/@signozhq/dialog/-/dialog-0.0.2.tgz#55bd8e693f76325fda9aabe3197350e0adc163c4"
-  integrity sha512-YT5t3oZpGkAuWptTqhCgVtLjxsRQrEIrQHFoXpP9elM1+O4TS9WHr+07BLQutOVg6u9n9pCvW3OYf0SCETkDVQ==
-  dependencies:
-    "@radix-ui/react-dialog" "^1.1.11"
-    "@radix-ui/react-icons" "^1.3.0"
-    "@radix-ui/react-slot" "^1.1.0"
-    class-variance-authority "^0.7.0"
-    clsx "^2.1.1"
-    lucide-react "^0.445.0"
-    tailwind-merge "^2.5.2"
-    tailwindcss-animate "^1.0.7"
-
-"@signozhq/drawer@0.0.4":
-  version "0.0.4"
-  resolved "https://registry.yarnpkg.com/@signozhq/drawer/-/drawer-0.0.4.tgz#7c6e6779602113f55df8a55076e68b9cc13c7d79"
-  integrity sha512-m/shStl5yVPjHjrhDAh3EeKqqTtMmZUBVlgJPUGgoNV3sFsuN6JNaaAtEJI8cQBWkbEEiHLWKVkL/vhbQ7YrUg==
-  dependencies:
-    "@radix-ui/react-dialog" "^1.1.11"
-    "@radix-ui/react-icons" "^1.3.0"
-    "@radix-ui/react-slot" "^1.1.0"
-    class-variance-authority "^0.7.0"
-    clsx "^2.1.1"
-    lucide-react "^0.445.0"
-    tailwind-merge "^2.5.2"
-    tailwindcss-animate "^1.0.7"
-    vaul "^1.1.2"
-
-"@signozhq/icons@0.1.0", "@signozhq/icons@^0.1.0":
+"@signozhq/icons@0.1.0":
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/@signozhq/icons/-/icons-0.1.0.tgz#00dfb430dbac423bfff715876f91a7b8a72509e4"
   integrity sha512-kGWDhCpQkFWaNwyWfy88AIbg902wBbgTFTBAtmo6DkHyLGoqWAf0Jcq8BX+7brFqJF9PnLoSJDj1lvCpUsI/Ig==
@@ -5647,109 +5375,6 @@
     "@commitlint/cli" "^17.6.7"
     "@commitlint/config-conventional" "^17.6.7"
 
-"@signozhq/input@0.0.2":
-  version "0.0.2"
-  resolved "https://registry.yarnpkg.com/@signozhq/input/-/input-0.0.2.tgz#b2fea8c0979a53984ebcd5e3c3c50b38082eb1b1"
-  integrity sha512-Iti9GkvexSsULX1pQsN6FT6Gw96YWilts72wITZd5fzgZq1yKqaDtQl98/QNuyoS3I3WEh+hVF4EIeCCe7oRsQ==
-  dependencies:
-    "@radix-ui/react-icons" "^1.3.0"
-    "@radix-ui/react-slot" "^1.1.0"
-    class-variance-authority "^0.7.0"
-    clsx "^2.1.1"
-    lucide-react "^0.445.0"
-    tailwind-merge "^2.5.2"
-    tailwindcss-animate "^1.0.7"
-
-"@signozhq/popover@0.0.0":
-  version "0.0.0"
-  resolved "https://registry.yarnpkg.com/@signozhq/popover/-/popover-0.0.0.tgz#675baf1c18ca0180369b4df0700c24e2c55ad758"
-  integrity sha512-XW0MhzxWzZNQWjVeb+BFjiOIbBbYCT+9MCUOIW8kiL0axFaaimnk0QPi1rk09u136MMGByI6fYuCJ5Qa07l1dA==
-  dependencies:
-    "@radix-ui/react-icons" "^1.3.0"
-    "@radix-ui/react-popover" "^1.1.15"
-    "@radix-ui/react-slot" "^1.1.0"
-    "@signozhq/button" "^0.0.2"
-    class-variance-authority "^0.7.0"
-    clsx "^2.1.1"
-    lucide-react "^0.445.0"
-    tailwind-merge "^2.5.2"
-    tailwindcss-animate "^1.0.7"
-
-"@signozhq/radio-group@0.0.2":
-  version "0.0.2"
-  resolved "https://registry.yarnpkg.com/@signozhq/radio-group/-/radio-group-0.0.2.tgz#4b13567bfee2645226f2cf41f261bbb288e1be4b"
-  integrity sha512-ahykmA5hPujOC964CFveMlQ12tWSyut2CUiFRqT1QxRkOLS2R44Qn2hh2psqJJ18JMX/24ZYCAIh9Bdd5XW+7g==
-  dependencies:
-    "@radix-ui/react-icons" "^1.3.0"
-    "@radix-ui/react-radio-group" "^1.3.4"
-    "@radix-ui/react-slot" "^1.1.0"
-    class-variance-authority "^0.7.0"
-    clsx "^2.1.1"
-    lucide-react "^0.445.0"
-    tailwind-merge "^2.5.2"
-    tailwindcss-animate "^1.0.7"
-
-"@signozhq/resizable@0.0.0":
-  version "0.0.0"
-  resolved "https://registry.yarnpkg.com/@signozhq/resizable/-/resizable-0.0.0.tgz#a517818b9f9bcdaeafc55ae134be86522bc90e9f"
-  integrity sha512-yAkJdMgTkh8kv42ZuabwTZguxalwYqIp4b44YdSrw6jRUSq9tscUBXVllNN79T71lPUtc5AV13uQ4Qm5AcfVbQ==
-  dependencies:
-    "@radix-ui/react-icons" "^1.3.0"
-    "@radix-ui/react-slot" "^1.1.0"
-    class-variance-authority "^0.7.0"
-    clsx "^2.1.1"
-    lucide-react "^0.445.0"
-    react-resizable-panels "^3.0.5"
-    tailwind-merge "^2.5.2"
-    tailwindcss-animate "^1.0.7"
-
-"@signozhq/table@0.3.7":
-  version "0.3.7"
-  resolved "https://registry.yarnpkg.com/@signozhq/table/-/table-0.3.7.tgz#895b710c02af124dfb5117e02bbc6d80ce062063"
-  integrity sha512-XDwRHBTf2q48MOuxkzzr0htWd0/mmvgHoZLl0WAMLk2gddbbNHg9hkCPfVARYOke6mX8Z/4T3e7dzgkRUhDGDg==
-  dependencies:
-    "@radix-ui/react-icons" "^1.3.0"
-    "@radix-ui/react-slot" "^1.1.0"
-    "@signozhq/tooltip" "0.0.2"
-    "@tanstack/react-table" "^8.21.3"
-    "@tanstack/react-virtual" "^3.13.9"
-    "@types/lodash-es" "^4.17.12"
-    class-variance-authority "^0.7.0"
-    clsx "^2.1.1"
-    lodash-es "^4.17.21"
-    lucide-react "^0.445.0"
-    tailwind-merge "^2.5.2"
-    tailwindcss-animate "^1.0.7"
-
-"@signozhq/toggle-group@0.0.1":
-  version "0.0.1"
-  resolved "https://registry.yarnpkg.com/@signozhq/toggle-group/-/toggle-group-0.0.1.tgz#c82ff1da34e77b24da53c2d595ad6b4a0d1b1de4"
-  integrity sha512-871bQayL5MaqsuNOFHKexidu9W2Hlg1y4xmH8C5mGmlfZ4bd0ovJ9OweQrM6Puys3jeMwi69xmJuesYCfKQc1g==
-  dependencies:
-    "@radix-ui/react-icons" "^1.3.0"
-    "@radix-ui/react-slot" "^1.1.0"
-    "@radix-ui/react-toggle" "^1.1.6"
-    "@radix-ui/react-toggle-group" "^1.1.7"
-    class-variance-authority "^0.7.0"
-    clsx "^2.1.1"
-    lucide-react "^0.445.0"
-    tailwind-merge "^2.5.2"
-    tailwindcss-animate "^1.0.7"
-
-"@signozhq/tooltip@0.0.2":
-  version "0.0.2"
-  resolved "https://registry.yarnpkg.com/@signozhq/tooltip/-/tooltip-0.0.2.tgz#bb4e2681868fa2e06db78eff5872ffb2a78b93b6"
-  integrity sha512-itxvrFq0SHr+xTabd7Tf/O9Gfq45kpIyQ5qklDRfhbxr4PIVSBw5XMr2OgzOPbW7P8S9fugCwMu6gPyAZ0SM5A==
-  dependencies:
-    "@radix-ui/react-icons" "^1.3.0"
-    "@radix-ui/react-slot" "^1.1.0"
-    "@radix-ui/react-tooltip" "^1.2.6"
-    class-variance-authority "^0.7.0"
-    clsx "^2.1.1"
-    lucide-react "^0.445.0"
-    tailwind-merge "^2.5.2"
-    tailwindcss-animate "^1.0.7"
-
 "@signozhq/ui@0.0.5":
   version "0.0.5"
   resolved "https://registry.yarnpkg.com/@signozhq/ui/-/ui-0.0.5.tgz#8badef53416b7ace0fe61ff01ff3da679a0e4ba5"
@@ -7644,7 +7269,7 @@ argparse@^2.0.1:
   resolved "https://registry.yarnpkg.com/argparse/-/argparse-2.0.1.tgz#246f50f3ca78a3240f6c997e8a9bd1eac49e4b38"
   integrity sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==
 
-aria-hidden@^1.1.1, aria-hidden@^1.2.4:
+aria-hidden@^1.2.4:
   version "1.2.6"
   resolved "https://registry.yarnpkg.com/aria-hidden/-/aria-hidden-1.2.6.tgz#73051c9b088114c795b1ea414e9c0fff874ffc1a"
   integrity sha512-ik3ZgC9dY/lYVVM++OISsaYDeg1tb0VtP5uL3ouh1koGOaUMDPpbFIei4JkFimWUFPn90sbMNMXQAIVOlnYKJA==
@@ -8906,13 +8531,6 @@ clsx@^2.1.1:
   resolved "https://registry.yarnpkg.com/clsx/-/clsx-2.1.1.tgz#eed397c9fd8bd882bfb18deab7102049a2f32999"
   integrity sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==
 
-cmdk@^0.2.1:
-  version "0.2.1"
-  resolved "https://registry.yarnpkg.com/cmdk/-/cmdk-0.2.1.tgz#aa8e1332bb0b8d8484e793017c82537351188d9a"
-  integrity sha512-U6//9lQ6JvT47+6OF6Gi8BvkxYQ8SCRRSKIJkthIMsFsLZRG0cKvTtuTaefyIKMQb8rvvXy0wGdpTNq/jPtm+g==
-  dependencies:
-    "@radix-ui/react-dialog" "1.0.0"
-
 cmdk@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/cmdk/-/cmdk-1.1.1.tgz#b8524272699ccaa37aaf07f36850b376bf3d58e5"
@@ -17288,7 +16906,7 @@ react-refresh@^0.18.0:
   resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.18.0.tgz#2dce97f4fe932a4d8142fa1630e475c1729c8062"
   integrity sha512-QgT5//D3jfjJb6Gsjxv0Slpj23ip+HtOpnNgnb2S5zU3CB26G/IDPGoy4RJB42wzFE46DRsstbW6tKHoKbhAxw==
 
-react-remove-scroll-bar@^2.3.3, react-remove-scroll-bar@^2.3.7:
+react-remove-scroll-bar@^2.3.7:
   version "2.3.8"
   resolved "https://registry.yarnpkg.com/react-remove-scroll-bar/-/react-remove-scroll-bar-2.3.8.tgz#99c20f908ee467b385b68a3469b4a3e750012223"
   integrity sha512-9r+yi9+mgU33AKcj6IbT9oRCO78WriSj6t/cF8DWBZJ9aOGPOTEDvdUDz1FwKim7QXWwmHqtdHnRJfhAxEG46Q==
@@ -17296,17 +16914,6 @@ react-remove-scroll-bar@^2.3.3, react-remove-scroll-bar@^2.3.7:
     react-style-singleton "^2.2.2"
     tslib "^2.0.0"
 
-react-remove-scroll@2.5.4:
-  version "2.5.4"
-  resolved "https://registry.yarnpkg.com/react-remove-scroll/-/react-remove-scroll-2.5.4.tgz#afe6491acabde26f628f844b67647645488d2ea0"
-  integrity sha512-xGVKJJr0SJGQVirVFAUZ2k1QLyO6m+2fy0l8Qawbp5Jgrv3DeLalrfMNBFSlmz5kriGGzsVBtGVnf4pTKIhhWA==
-  dependencies:
-    react-remove-scroll-bar "^2.3.3"
-    react-style-singleton "^2.2.1"
-    tslib "^2.1.0"
-    use-callback-ref "^1.3.0"
-    use-sidecar "^1.1.2"
-
 react-remove-scroll@^2.6.3:
   version "2.7.1"
   resolved "https://registry.yarnpkg.com/react-remove-scroll/-/react-remove-scroll-2.7.1.tgz#d2101d414f6d81d7d3bf033f3c1cb4785789f753"
@@ -17318,11 +16925,6 @@ react-remove-scroll@^2.6.3:
     use-callback-ref "^1.3.3"
     use-sidecar "^1.1.3"
 
-react-resizable-panels@^3.0.5:
-  version "3.0.5"
-  resolved "https://registry.yarnpkg.com/react-resizable-panels/-/react-resizable-panels-3.0.5.tgz#50a20645263eed02344de4a70d1319bbc0014bbd"
-  integrity sha512-3z1yN25DMTXLg2wfyFrW32r5k4WEcUa3F7cJ2EgtNK07lnOs4mpM8yWLGunCpkhcQRwJX4fqoLcIh/pHPxzlmQ==
-
 react-resizable-panels@^4.7.1:
   version "4.7.3"
   resolved "https://registry.yarnpkg.com/react-resizable-panels/-/react-resizable-panels-4.7.3.tgz#4040aa0f5c5c4cc4bb685cb69973601ccda3b014"
@@ -17388,7 +16990,7 @@ react-router@6.27.0:
   dependencies:
     "@remix-run/router" "1.20.0"
 
-react-style-singleton@^2.2.1, react-style-singleton@^2.2.2, react-style-singleton@^2.2.3:
+react-style-singleton@^2.2.2, react-style-singleton@^2.2.3:
   version "2.2.3"
   resolved "https://registry.yarnpkg.com/react-style-singleton/-/react-style-singleton-2.2.3.tgz#4265608be69a4d70cfe3047f2c6c88b2c3ace388"
   integrity sha512-b6jSvxvVnyptAiLjbkWLE/lOnR4lfTtDAl+eUC7RZy+QQWc6wRzIV2CE6xBuMmDxc2qIihtDCZD5NPOFl7fRBQ==
@@ -19257,21 +18859,11 @@ table@^6.0.9, table@^6.9.0:
     string-width "^4.2.3"
     strip-ansi "^6.0.1"
 
-tailwind-merge@^2.5.2:
-  version "2.6.0"
-  resolved "https://registry.yarnpkg.com/tailwind-merge/-/tailwind-merge-2.6.0.tgz#ac5fb7e227910c038d458f396b7400d93a3142d5"
-  integrity sha512-P+Vu1qXfzediirmHOC3xKGAYeZtPcV9g76X+xg2FD4tYgR71ewMA35Y3sCz3zhiN/dwefRpJX0yBcgwi1fXNQA==
-
 tailwind-merge@^3.5.0:
   version "3.5.0"
   resolved "https://registry.yarnpkg.com/tailwind-merge/-/tailwind-merge-3.5.0.tgz#06502f4496ba15151445d97d916a26564d50d1ca"
   integrity sha512-I8K9wewnVDkL1NTGoqWmVEIlUcB9gFriAEkXkfCjX5ib8ezGxtR3xD7iZIxrfArjEsH7F1CHD4RFUtxefdqV/A==
 
-tailwindcss-animate@^1.0.7:
-  version "1.0.7"
-  resolved "https://registry.yarnpkg.com/tailwindcss-animate/-/tailwindcss-animate-1.0.7.tgz#318b692c4c42676cc9e67b19b78775742388bef4"
-  integrity sha512-bl6mpH3T7I3UFxuvDEXLxy/VuFxBk5bbzplh7tXI68mwMokNYd1t9qPBHlnyTwfa4JGC4zP516I1hYYtQ/vspA==
-
 tapable@^2.2.1:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/tapable/-/tapable-2.3.0.tgz#7e3ea6d5ca31ba8e078b560f0d83ce9a14aa8be6"
@@ -20047,7 +19639,7 @@ url-parse@^1.5.3:
     querystringify "^2.1.1"
     requires-port "^1.0.0"
 
-use-callback-ref@^1.3.0, use-callback-ref@^1.3.3:
+use-callback-ref@^1.3.3:
   version "1.3.3"
   resolved "https://registry.yarnpkg.com/use-callback-ref/-/use-callback-ref-1.3.3.tgz#98d9fab067075841c5b2c6852090d5d0feabe2bf"
   integrity sha512-jQL3lRnocaFtu3V00JToYz/4QkNWswxijDaCVNZRiRTO3HQDLsdu1ZtmIUvV4yPp+rvWm5j0y0TG/S61cuijTg==
@@ -20064,7 +19656,7 @@ use-memo-one@^1.1.1:
   resolved "https://registry.yarnpkg.com/use-memo-one/-/use-memo-one-1.1.3.tgz#2fd2e43a2169eabc7496960ace8c79efef975e99"
   integrity sha512-g66/K7ZQGYrI6dy8GLpVcMsBp4s17xNkYJVSMvTEevGy3nDxHOfE6z8BVE22+5G5x7t3+bhzrlTDB7ObrEE0cQ==
 
-use-sidecar@^1.1.2, use-sidecar@^1.1.3:
+use-sidecar@^1.1.3:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/use-sidecar/-/use-sidecar-1.1.3.tgz#10e7fd897d130b896e2c546c63a5e8233d00efdb"
   integrity sha512-Fedw0aZvkhynoPYlA5WXrMCAMm+nSWdZt6lzJQ7Ok8S6Q+VsHmHpRWndVRJ8Be0ZbkfPc5LRYH+5XrzXcEeLRQ==
@@ -20150,13 +19742,6 @@ value-equal@^1.0.1:
   resolved "https://registry.npmjs.org/value-equal/-/value-equal-1.0.1.tgz"
   integrity sha512-NOJ6JZCAWr0zlxZt+xqCHNTEKOsrks2HQd4MqhP1qy4z1SkbEP467eNx6TgDKXMvUOb+OENfJCZwM+16n7fRfw==
 
-vaul@^1.1.2:
-  version "1.1.2"
-  resolved "https://registry.yarnpkg.com/vaul/-/vaul-1.1.2.tgz#c959f8b9dc2ed4f7d99366caee433fbef91f5ba9"
-  integrity sha512-ZFkClGpWyI2WUQjdLJ/BaGuV6AVQiJ3uELGk3OYtP+B6yCO7Cmn9vPFXVJkRaGkOJu3m8bQMgtyzNHixULceQA==
-  dependencies:
-    "@radix-ui/react-dialog" "^1.1.1"
-
 vfile-location@^4.0.0:
   version "4.1.0"
   resolved "https://registry.yarnpkg.com/vfile-location/-/vfile-location-4.1.0.tgz#69df82fb9ef0a38d0d02b90dd84620e120050dd0"

pkg/alertmanager/alertmanagertemplate/alertmanagertemplate.go

@@ -0,0 +1,360 @@
+package alertmanagertemplate
+
+import (
+	"context"
+	"log/slog"
+	"sort"
+	"strings"
+
+	"github.com/SigNoz/signoz/pkg/errors"
+	"github.com/SigNoz/signoz/pkg/types/alertmanagertypes"
+	"github.com/SigNoz/signoz/pkg/types/ruletypes"
+	"github.com/prometheus/alertmanager/notify"
+	"github.com/prometheus/alertmanager/template"
+	"github.com/prometheus/alertmanager/types"
+	"github.com/prometheus/common/model"
+)
+
+// Templater expands user-authored title and body templates against a group
+// of alerts and returns channel-ready strings along with the aggregate data
+// a caller might reuse (e.g. to render an email layout around the body).
+type Templater interface {
+	Expand(ctx context.Context, req alertmanagertypes.ExpandRequest, alerts []*types.Alert) (*alertmanagertypes.ExpandResult, error)
+}
+
+type templater struct {
+	tmpl   *template.Template
+	logger *slog.Logger
+}
+
+// New returns a Templater bound to the given Prometheus alertmanager
+// template and logger.
+func New(tmpl *template.Template, logger *slog.Logger) Templater {
+	return &templater{tmpl: tmpl, logger: logger}
+}
+
+func (at *templater) Expand(
+	ctx context.Context,
+	req alertmanagertypes.ExpandRequest,
+	alerts []*types.Alert,
+) (*alertmanagertypes.ExpandResult, error) {
+	ntd := at.buildNotificationTemplateData(ctx, alerts)
+	missingVars := make(map[string]bool)
+
+	title, titleMissingVars, err := at.expandTitle(req.TitleTemplate, ntd)
+	if err != nil {
+		return nil, err
+	}
+	// if title template results in empty string, use default template
+	// this happens for rules where custom title annotation was not set
+	if title == "" && req.DefaultTitleTemplate != "" {
+		title, err = at.expandDefaultTemplate(ctx, req.DefaultTitleTemplate, alerts)
+		if err != nil {
+			return nil, err
+		}
+	} else {
+		mergeMissingVars(missingVars, titleMissingVars)
+	}
+
+	isDefaultBody := false
+	body, bodyMissingVars, err := at.expandBody(req.BodyTemplate, ntd)
+	if err != nil {
+		return nil, err
+	}
+	// if body template results in nil, use default template
+	// this happens for rules where custom body annotation was not set
+	if body == nil {
+		isDefaultBody = true
+		defaultBody, err := at.expandDefaultTemplate(ctx, req.DefaultBodyTemplate, alerts)
+		if err != nil {
+			return nil, err
+		}
+		body = []string{defaultBody} // default template combines all alerts message into a single body
+	} else {
+		mergeMissingVars(missingVars, bodyMissingVars)
+	}
+
+	// convert the internal map to a sorted slice for returning missing variables
+	missingVarsList := make([]string, 0, len(missingVars))
+	for k := range missingVars {
+		missingVarsList = append(missingVarsList, k)
+	}
+	sort.Strings(missingVarsList)
+
+	return &alertmanagertypes.ExpandResult{
+		Title:            title,
+		Body:             body,
+		MissingVars:      missingVarsList,
+		IsDefaultBody:    isDefaultBody,
+		NotificationData: ntd,
+	}, nil
+}
+
+// expandDefaultTemplate uses go-template to expand the default template.
+func (at *templater) expandDefaultTemplate(
+	ctx context.Context,
+	tmplStr string,
+	alerts []*types.Alert,
+) (string, error) {
+	// if even the default template is empty, return empty string
+	// this is possible if user added channel with blank template
+	if tmplStr == "" {
+		at.logger.WarnContext(ctx, "default template is empty")
+		return "", nil
+	}
+	data := notify.GetTemplateData(ctx, at.tmpl, alerts, at.logger)
+	result, err := at.tmpl.ExecuteTextString(tmplStr, data)
+	if err != nil {
+		return "", errors.NewInvalidInputf(errors.CodeInvalidInput, "failed to execute default template: %s", err.Error())
+	}
+	return result, nil
+}
+
+// mergeMissingVars adds all keys from src into dst.
+func mergeMissingVars(dst, src map[string]bool) {
+	for k := range src {
+		dst[k] = true
+	}
+}
+
+// expandTitle expands the title template. Returns empty string if the template is empty.
+func (at *templater) expandTitle(
+	titleTemplate string,
+	ntd *alertmanagertypes.NotificationTemplateData,
+) (string, map[string]bool, error) {
+	if titleTemplate == "" {
+		return "", nil, nil
+	}
+	processRes, err := preProcessTemplateAndData(titleTemplate, ntd)
+	if err != nil {
+		return "", nil, err
+	}
+	result, err := at.tmpl.ExecuteTextString(processRes.Template, processRes.Data)
+	if err != nil {
+		return "", nil, errors.NewInvalidInputf(errors.CodeInvalidInput, "failed to execute custom title template: %s", err.Error())
+	}
+	return strings.TrimSpace(result), processRes.UnknownVars, nil
+}
+
+// expandBody expands the body template for each individual alert. Returns nil if the template is empty.
+func (at *templater) expandBody(
+	bodyTemplate string,
+	ntd *alertmanagertypes.NotificationTemplateData,
+) ([]string, map[string]bool, error) {
+	if bodyTemplate == "" {
+		return nil, nil, nil
+	}
+	var sb []string
+	missingVars := make(map[string]bool)
+	for i := range ntd.Alerts {
+		processRes, err := preProcessTemplateAndData(bodyTemplate, &ntd.Alerts[i])
+		if err != nil {
+			return nil, nil, err
+		}
+		part, err := at.tmpl.ExecuteTextString(processRes.Template, processRes.Data)
+		if err != nil {
+			return nil, nil, errors.NewInvalidInputf(errors.CodeInvalidInput, "failed to execute custom body template: %s", err.Error())
+		}
+		// add unknown variables and templated text to the result
+		for k := range processRes.UnknownVars {
+			missingVars[k] = true
+		}
+		if strings.TrimSpace(part) != "" {
+			sb = append(sb, strings.TrimSpace(part))
+		}
+	}
+	return sb, missingVars, nil
+}
+
+// buildNotificationTemplateData creates the NotificationTemplateData using
+// info from context and the raw alerts.
+func (at *templater) buildNotificationTemplateData(
+	ctx context.Context,
+	alerts []*types.Alert,
+) *alertmanagertypes.NotificationTemplateData {
+	// extract the required data from the context
+	receiver, ok := notify.ReceiverName(ctx)
+	if !ok {
+		at.logger.WarnContext(ctx, "missing receiver name in context")
+	}
+
+	groupLabels, ok := notify.GroupLabels(ctx)
+	if !ok {
+		at.logger.WarnContext(ctx, "missing group labels in context")
+	}
+
+	// extract the external URL from the template
+	externalURL := ""
+	if at.tmpl.ExternalURL != nil {
+		externalURL = at.tmpl.ExternalURL.String()
+	}
+
+	commonAnnotations := extractCommonKV(alerts, func(a *types.Alert) model.LabelSet { return a.Annotations })
+	commonLabels := extractCommonKV(alerts, func(a *types.Alert) model.LabelSet { return a.Labels })
+
+	// aggregate labels and annotations from all alerts
+	labels := aggregateKV(alerts, func(a *types.Alert) model.LabelSet { return a.Labels })
+	annotations := aggregateKV(alerts, func(a *types.Alert) model.LabelSet { return a.Annotations })
+
+	// Strip private annotations from surfaces visible to templates or
+	// notifications; the structured fields on AlertInfo/RuleInfo already hold
+	// anything a template needs from them.
+	commonAnnotations = alertmanagertypes.FilterPublicAnnotations(commonAnnotations)
+	annotations = alertmanagertypes.FilterPublicAnnotations(annotations)
+
+	// build the alert data slice
+	alertDataSlice := make([]alertmanagertypes.AlertData, 0, len(alerts))
+	for _, a := range alerts {
+		ad := buildAlertData(a, receiver)
+		alertDataSlice = append(alertDataSlice, ad)
+	}
+
+	// count the number of firing and resolved alerts
+	var firing, resolved int
+	for _, ad := range alertDataSlice {
+		if ad.Alert.IsFiring {
+			firing++
+		} else if ad.Alert.IsResolved {
+			resolved++
+		}
+	}
+
+	// build the group labels
+	gl := make(template.KV, len(groupLabels))
+	for k, v := range groupLabels {
+		gl[string(k)] = string(v)
+	}
+
+	// build the notification template data
+	return &alertmanagertypes.NotificationTemplateData{
+		Alert: alertmanagertypes.NotificationAlert{
+			Receiver:      receiver,
+			Status:        string(types.Alerts(alerts...).Status()),
+			TotalFiring:   firing,
+			TotalResolved: resolved,
+		},
+		Rule:              buildRuleInfo(commonLabels, commonAnnotations),
+		GroupLabels:       gl,
+		CommonLabels:      commonLabels,
+		CommonAnnotations: commonAnnotations,
+		ExternalURL:       externalURL,
+		Labels:            labels,
+		Annotations:       annotations,
+		Alerts:            alertDataSlice,
+	}
+}
+
+// buildAlertData converts a single *types.Alert into an AlertData.
+func buildAlertData(a *types.Alert, receiver string) alertmanagertypes.AlertData {
+	labels := make(template.KV, len(a.Labels))
+	for k, v := range a.Labels {
+		labels[string(k)] = string(v)
+	}
+
+	annotations := make(template.KV, len(a.Annotations))
+	for k, v := range a.Annotations {
+		annotations[string(k)] = string(v)
+	}
+
+	return alertmanagertypes.AlertData{
+		Alert: alertmanagertypes.AlertInfo{
+			Status:        string(a.Status()),
+			Receiver:      receiver,
+			Value:         annotations[ruletypes.AnnotationValue],
+			StartsAt:      a.StartsAt,
+			EndsAt:        a.EndsAt,
+			GeneratorURL:  a.GeneratorURL,
+			Fingerprint:   a.Fingerprint().String(),
+			IsFiring:      a.Status() == model.AlertFiring,
+			IsResolved:    a.Status() == model.AlertResolved,
+			IsMissingData: labels[ruletypes.LabelNoData] == "true",
+			IsRecovering:  labels[ruletypes.LabelIsRecovering] == "true",
+		},
+		Rule:   buildRuleInfo(labels, annotations),
+		Log:    alertmanagertypes.LinkInfo{URL: annotations[ruletypes.AnnotationRelatedLogs]},
+		Trace:  alertmanagertypes.LinkInfo{URL: annotations[ruletypes.AnnotationRelatedTraces]},
+		Labels: labels,
+		// Strip private annotations once the structured fields above have
+		// been populated from the raw map.
+		Annotations: alertmanagertypes.FilterPublicAnnotations(annotations),
+	}
+}
+
+// buildRuleInfo extracts the rule metadata from the well-known labels and
+// annotations that the rule manager attaches to every emitted alert.
+func buildRuleInfo(labels, annotations template.KV) alertmanagertypes.RuleInfo {
+	return alertmanagertypes.RuleInfo{
+		Name:      labels[ruletypes.LabelAlertName],
+		ID:        labels[ruletypes.LabelRuleID],
+		URL:       labels[ruletypes.LabelRuleSource],
+		Severity:  labels[ruletypes.LabelSeverityName],
+		MatchType: annotations[ruletypes.AnnotationMatchType],
+		Threshold: alertmanagertypes.Threshold{
+			Value: annotations[ruletypes.AnnotationThresholdValue],
+			Op:    annotations[ruletypes.AnnotationCompareOp],
+		},
+	}
+}
+
+// maxAggregatedValues caps the number of distinct label/annotation values
+// joined together when summarising across alerts. Beyond this, extras are
+// dropped rather than concatenated.
+const maxAggregatedValues = 5
+
+// aggregateKV merges label or annotation sets from a group of alerts into a
+// single KV. Per key, up to maxAggregatedValues distinct values are kept (in
+// order of first appearance) and joined with ", ". A lossy summary used for
+// grouped-notification display, not a true union.
+func aggregateKV(alerts []*types.Alert, extractFn func(*types.Alert) model.LabelSet) template.KV {
+	valuesPerKey := make(map[string][]string)
+	seenValues := make(map[string]map[string]bool)
+
+	for _, alert := range alerts {
+		for k, v := range extractFn(alert) {
+			key := string(k)
+			value := string(v)
+
+			if seenValues[key] == nil {
+				seenValues[key] = make(map[string]bool)
+			}
+			if !seenValues[key][value] && len(valuesPerKey[key]) < maxAggregatedValues {
+				seenValues[key][value] = true
+				valuesPerKey[key] = append(valuesPerKey[key], value)
+			}
+		}
+	}
+
+	result := make(template.KV, len(valuesPerKey))
+	for key, values := range valuesPerKey {
+		result[key] = strings.Join(values, ", ")
+	}
+	return result
+}
+
+// extractCommonKV returns the intersection of label or annotation pairs
+// across all alerts. A pair is included only if every alert carries the same
+// key with the same value.
+func extractCommonKV(alerts []*types.Alert, extractFn func(*types.Alert) model.LabelSet) template.KV {
+	if len(alerts) == 0 {
+		return template.KV{}
+	}
+
+	common := make(template.KV, len(extractFn(alerts[0])))
+	for k, v := range extractFn(alerts[0]) {
+		common[string(k)] = string(v)
+	}
+
+	for _, a := range alerts[1:] {
+		kv := extractFn(a)
+		for k := range common {
+			if string(kv[model.LabelName(k)]) != common[k] {
+				delete(common, k)
+			}
+		}
+		if len(common) == 0 {
+			break
+		}
+	}
+
+	return common
+}

pkg/alertmanager/alertmanagertemplate/alertmanagertemplate_test.go

@@ -0,0 +1,287 @@
+package alertmanagertemplate
+
+import (
+	"context"
+	"log/slog"
+	"sort"
+	"testing"
+	"time"
+
+	test "github.com/SigNoz/signoz/pkg/alertmanager/alertmanagernotify/alertmanagernotifytest"
+	"github.com/SigNoz/signoz/pkg/types/alertmanagertypes"
+	"github.com/SigNoz/signoz/pkg/types/ruletypes"
+	"github.com/prometheus/common/model"
+	"github.com/stretchr/testify/require"
+
+	"github.com/prometheus/alertmanager/notify"
+	"github.com/prometheus/alertmanager/types"
+)
+
+// testSetup returns an AlertTemplater and a context pre-populated with group key,
+// receiver name, and group labels for use in tests.
+func testSetup(t *testing.T) (Templater, context.Context) {
+	t.Helper()
+	tmpl := test.CreateTmpl(t)
+	ctx := context.Background()
+	ctx = notify.WithGroupKey(ctx, "test-group")
+	ctx = notify.WithReceiverName(ctx, "slack")
+	ctx = notify.WithGroupLabels(ctx, model.LabelSet{"alertname": "TestAlert", "severity": "critical"})
+	logger := slog.New(slog.DiscardHandler)
+	return New(tmpl, logger), ctx
+}
+
+func createAlert(labels, annotations map[string]string, isFiring bool) *types.Alert {
+	ls := model.LabelSet{}
+	for k, v := range labels {
+		ls[model.LabelName(k)] = model.LabelValue(v)
+	}
+	ann := model.LabelSet{}
+	for k, v := range annotations {
+		ann[model.LabelName(k)] = model.LabelValue(v)
+	}
+	startsAt := time.Now()
+	var endsAt time.Time
+	if isFiring {
+		endsAt = startsAt.Add(time.Hour)
+	} else {
+		startsAt = startsAt.Add(-2 * time.Hour)
+		endsAt = startsAt.Add(-time.Hour)
+	}
+	return &types.Alert{Alert: model.Alert{Labels: ls, Annotations: ann, StartsAt: startsAt, EndsAt: endsAt}}
+}
+
+func TestExpandTemplates(t *testing.T) {
+	at, ctx := testSetup(t)
+
+	tests := []struct {
+		name              string
+		alerts            []*types.Alert
+		input             alertmanagertypes.ExpandRequest
+		wantTitle         string
+		wantBody          []string
+		wantMissingVars   []string
+		errorContains     string
+		wantIsDefaultBody bool
+	}{
+		{
+			// High request throughput on a service — service is a custom label.
+			// $labels.service extracts the label value; $annotations.description pulls the annotation.
+			name: "new template: high request throughput for a service",
+			alerts: []*types.Alert{
+				createAlert(
+					map[string]string{
+						ruletypes.LabelAlertName:    "HighRequestThroughput",
+						ruletypes.LabelSeverityName: "warning",
+						"service.name":              "payment-service",
+					},
+					map[string]string{"description": "Request rate exceeded 10k/s"},
+					true,
+				),
+			},
+			input: alertmanagertypes.ExpandRequest{
+				TitleTemplate: "High request throughput for $service.name",
+				BodyTemplate: `The service $service.name is getting high request. Please investigate.
+Severity: $rule.severity
+Status: $alert.status
+Service: $service.name
+Description: $description`,
+			},
+			wantTitle: "High request throughput for payment-service",
+			wantBody: []string{`The service payment-service is getting high request. Please investigate.
+Severity: warning
+Status: firing
+Service: payment-service
+Description: Request rate exceeded 10k/s`},
+			wantIsDefaultBody: false,
+		},
+		{
+			// Disk usage alert using old Go template syntax throughout.
+			// No custom templates — both title and body use the default fallback path.
+			name: "old template: disk usage high on database host",
+			alerts: []*types.Alert{
+				createAlert(
+					map[string]string{ruletypes.LabelAlertName: "DiskUsageHigh",
+						ruletypes.LabelSeverityName: "critical",
+						"instance":                  "db-primary-01",
+					},
+					map[string]string{
+						"summary":        "Disk usage high on database host",
+						"description":    "Disk usage is high on the database host",
+						"related_logs":   "https://logs.example.com/search?q=DiskUsageHigh",
+						"related_traces": "https://traces.example.com/search?q=DiskUsageHigh",
+					},
+					true,
+				),
+			},
+			input: alertmanagertypes.ExpandRequest{
+				DefaultTitleTemplate: `[{{ .Status | toUpper }}{{ if eq .Status "firing" }}:{{ .Alerts.Firing | len }}{{ end }}] {{ .CommonLabels.alertname }} for {{ .CommonLabels.job }}
+     {{- if gt (len .CommonLabels) (len .GroupLabels) -}}
+       {{" "}}(
+       {{- with .CommonLabels.Remove .GroupLabels.Names }}
+         {{- range $index, $label := .SortedPairs -}}
+           {{ if $index }}, {{ end }}
+           {{- $label.Name }}="{{ $label.Value -}}"
+         {{- end }}
+       {{- end -}}
+       )
+     {{- end }}`,
+				DefaultBodyTemplate: `{{ range .Alerts -}}
+     *Alert:* {{ .Labels.alertname }}{{ if .Labels.severity }} - {{ .Labels.severity }}{{ end }}
+
+     *Summary:* {{ .Annotations.summary }}
+     *Description:* {{ .Annotations.description }}
+     *RelatedLogs:* {{ if gt (len .Annotations.related_logs) 0 -}} View in <{{ .Annotations.related_logs }}|logs explorer> {{- end}}
+     *RelatedTraces:* {{ if gt (len .Annotations.related_traces) 0 -}} View in <{{ .Annotations.related_traces }}|traces explorer> {{- end}}
+
+     *Details:*
+       {{ range .Labels.SortedPairs }} • *{{ .Name }}:* {{ .Value }}
+       {{ end }}
+     {{ end }}`,
+			},
+			wantTitle: "[FIRING:1] DiskUsageHigh for  (instance=\"db-primary-01\")",
+			// Written with explicit \n so trailing whitespace inside the body
+			// (emitted by the un-trimmed "{{ end }}" in the default template)
+			// survives format-on-save.
+			wantBody: []string{"*Alert:* DiskUsageHigh - critical\n" +
+				"\n" +
+				"     *Summary:* Disk usage high on database host\n" +
+				"     *Description:* Disk usage is high on the database host\n" +
+				"     *RelatedLogs:* View in <https://logs.example.com/search?q=DiskUsageHigh|logs explorer>\n" +
+				"     *RelatedTraces:* View in <https://traces.example.com/search?q=DiskUsageHigh|traces explorer>\n" +
+				"\n" +
+				"     *Details:*\n" +
+				"        • *alertname:* DiskUsageHigh\n" +
+				"        • *instance:* db-primary-01\n" +
+				"        • *severity:* critical\n" +
+				"       \n" +
+				"     "},
+			wantIsDefaultBody: true,
+		},
+		{
+			// Pod crash loop on multiple pods — body is expanded once per alert
+			// and joined with "\n\n", with the pod name pulled from labels.
+			name: "new template: pod crash loop on multiple pods, body per-alert",
+			alerts: []*types.Alert{
+				createAlert(map[string]string{ruletypes.LabelAlertName: "PodCrashLoop", "pod": "api-worker-1"}, nil, true),
+				createAlert(map[string]string{ruletypes.LabelAlertName: "PodCrashLoop", "pod": "api-worker-2"}, nil, true),
+				createAlert(map[string]string{ruletypes.LabelAlertName: "PodCrashLoop", "pod": "api-worker-3"}, nil, true),
+			},
+			input: alertmanagertypes.ExpandRequest{
+				TitleTemplate: "$rule.name: $alert.total_firing pods affected",
+				BodyTemplate:  "$labels.pod is crash looping",
+			},
+			wantTitle:         "PodCrashLoop: 3 pods affected",
+			wantBody:          []string{"api-worker-1 is crash looping", "api-worker-2 is crash looping", "api-worker-3 is crash looping"},
+			wantIsDefaultBody: false,
+		},
+		{
+			// Incident partially resolved — one service still down, one recovered.
+			// Title shows the aggregate counts; body shows per-service status.
+			name: "new template: service degradation with mixed firing and resolved alerts",
+			alerts: []*types.Alert{
+				createAlert(map[string]string{ruletypes.LabelAlertName: "ServiceDown", "service": "auth-service"}, nil, true),
+				createAlert(map[string]string{ruletypes.LabelAlertName: "ServiceDown", "service": "payment-service"}, nil, false),
+			},
+			input: alertmanagertypes.ExpandRequest{
+				TitleTemplate: "$alert.total_firing firing, $alert.total_resolved resolved",
+				BodyTemplate:  "$labels.service ($alert.status)",
+			},
+			wantTitle:         "1 firing, 1 resolved",
+			wantBody:          []string{"auth-service (firing)", "payment-service (resolved)"},
+			wantIsDefaultBody: false,
+		},
+		{
+			// $environment is not a known AlertData or NotificationTemplateData field,
+			// so it lands in MissingVars and renders as "<no value>" in the output.
+			name: "missing vars: unknown $environment variable in title",
+			alerts: []*types.Alert{
+				createAlert(map[string]string{ruletypes.LabelAlertName: "HighCPU", ruletypes.LabelSeverityName: "critical"}, nil, true),
+			},
+			input: alertmanagertypes.ExpandRequest{
+				TitleTemplate: "[$environment] $rule.name",
+			},
+			wantTitle:         "[<no value>] HighCPU",
+			wantMissingVars:   []string{"environment"},
+			wantIsDefaultBody: true,
+		},
+		{
+			// $runbook_url is not a known field — someone tried to embed a runbook link
+			// directly as a variable instead of via annotations.
+			name: "missing vars: unknown $runbook_url variable in body",
+			alerts: []*types.Alert{
+				createAlert(map[string]string{ruletypes.LabelAlertName: "PodOOMKilled", ruletypes.LabelSeverityName: "warning"}, nil, true),
+			},
+			input: alertmanagertypes.ExpandRequest{
+				BodyTemplate: "$rule.name: see runbook at $runbook_url",
+			},
+			wantBody:        []string{"PodOOMKilled: see runbook at <no value>"},
+			wantMissingVars: []string{"runbook_url"},
+		},
+		{
+			// Both title and body use unknown variables; MissingVars is the union of both.
+			name: "missing vars: unknown variables in both title and body",
+			alerts: []*types.Alert{
+				createAlert(map[string]string{ruletypes.LabelAlertName: "HighMemory", ruletypes.LabelSeverityName: "critical"}, nil, true),
+			},
+			input: alertmanagertypes.ExpandRequest{
+				TitleTemplate: "[$environment] $rule.name and [{{ $service }}]",
+				BodyTemplate:  "$rule.name: see runbook at $runbook_url",
+			},
+			wantTitle:       "[<no value>] HighMemory and [<no value>]",
+			wantBody:        []string{"HighMemory: see runbook at <no value>"},
+			wantMissingVars: []string{"environment", "runbook_url", "service"},
+		},
+		{
+			// Custom title template that expands to only whitespace triggers the fallback,
+			// so the default title template is used instead.
+			name: "fallback: whitespace-only custom title falls back to default",
+			alerts: []*types.Alert{
+				createAlert(map[string]string{ruletypes.LabelAlertName: "HighCPU", ruletypes.LabelSeverityName: "critical"}, nil, false),
+			},
+			input: alertmanagertypes.ExpandRequest{
+				TitleTemplate:        "   ",
+				DefaultTitleTemplate: "{{ .CommonLabels.alertname }} ({{ .Status | toUpper }})",
+				DefaultBodyTemplate:  "Runbook: https://runbook.example.com",
+			},
+			wantTitle:         "HighCPU (RESOLVED)",
+			wantBody:          []string{"Runbook: https://runbook.example.com"},
+			wantIsDefaultBody: true,
+		},
+		{
+			name: "using non-existing function in template",
+			alerts: []*types.Alert{
+				createAlert(map[string]string{ruletypes.LabelAlertName: "HighCPU", ruletypes.LabelSeverityName: "critical"}, nil, true),
+			},
+			input: alertmanagertypes.ExpandRequest{
+				TitleTemplate: "$rule.name ({{$severity | toUpperAndTrim}}) for $alertname",
+			},
+			errorContains: "function \"toUpperAndTrim\" not defined",
+		},
+	}
+
+	for _, tc := range tests {
+		t.Run(tc.name, func(t *testing.T) {
+			got, err := at.Expand(ctx, tc.input, tc.alerts)
+			if tc.errorContains != "" {
+				require.ErrorContains(t, err, tc.errorContains)
+				return
+			}
+			require.NoError(t, err)
+
+			if tc.wantTitle != "" {
+				require.Equal(t, tc.wantTitle, got.Title)
+			}
+			if tc.wantBody != nil {
+				require.Equal(t, tc.wantBody, got.Body)
+			}
+			require.Equal(t, tc.wantIsDefaultBody, got.IsDefaultBody)
+
+			if len(tc.wantMissingVars) == 0 {
+				require.Empty(t, got.MissingVars)
+			} else {
+				sort.Strings(tc.wantMissingVars)
+				require.Equal(t, tc.wantMissingVars, got.MissingVars)
+			}
+		})
+	}
+}

pkg/alertmanager/alertmanagertemplate/annotations.go

@@ -0,0 +1,33 @@
+package alertmanagertemplate
+
+import (
+	"github.com/SigNoz/signoz/pkg/types/ruletypes"
+	"github.com/prometheus/alertmanager/types"
+)
+
+// ExtractTemplatesFromAnnotations pulls the user-authored title and body
+// templates off the well-known annotation keys attached by the rule manager.
+// A template is returned only if every alert in the group carries the same
+// value under that key; otherwise the empty string is returned for that slot
+// (which causes Expand to fall back to the channel default).
+func ExtractTemplatesFromAnnotations(alerts []*types.Alert) (titleTemplate, bodyTemplate string) {
+	if len(alerts) == 0 {
+		return "", ""
+	}
+
+	title := string(alerts[0].Annotations[ruletypes.AnnotationTitleTemplate])
+	body := string(alerts[0].Annotations[ruletypes.AnnotationBodyTemplate])
+
+	for _, a := range alerts[1:] {
+		if title != "" && string(a.Annotations[ruletypes.AnnotationTitleTemplate]) != title {
+			title = ""
+		}
+		if body != "" && string(a.Annotations[ruletypes.AnnotationBodyTemplate]) != body {
+			body = ""
+		}
+		if title == "" && body == "" {
+			break
+		}
+	}
+	return title, body
+}

pkg/alertmanager/alertmanagertemplate/kvaggregate_test.go

@@ -0,0 +1,153 @@
+package alertmanagertemplate
+
+import (
+	"testing"
+
+	"github.com/prometheus/alertmanager/template"
+	"github.com/prometheus/alertmanager/types"
+	"github.com/prometheus/common/model"
+	"github.com/stretchr/testify/require"
+)
+
+func TestAggregateKV(t *testing.T) {
+	extractLabels := func(a *types.Alert) model.LabelSet { return a.Labels }
+
+	testCases := []struct {
+		name      string
+		alerts    []*types.Alert
+		extractFn func(*types.Alert) model.LabelSet
+		expected  template.KV
+	}{
+		{
+			name:      "empty alerts slice",
+			alerts:    []*types.Alert{},
+			extractFn: extractLabels,
+			expected:  template.KV{},
+		},
+		{
+			name: "single alert",
+			alerts: []*types.Alert{
+				{
+					Alert: model.Alert{
+						Labels: model.LabelSet{
+							"env":     "production",
+							"service": "backend",
+						},
+					},
+				},
+			},
+			extractFn: extractLabels,
+			expected: template.KV{
+				"env":     "production",
+				"service": "backend",
+			},
+		},
+		{
+			name: "varying values with duplicates deduped",
+			alerts: []*types.Alert{
+				{Alert: model.Alert{Labels: model.LabelSet{"env": "production", "service": "backend"}}},
+				{Alert: model.Alert{Labels: model.LabelSet{"env": "production", "service": "api"}}},
+				{Alert: model.Alert{Labels: model.LabelSet{"env": "production", "service": "frontend"}}},
+				{Alert: model.Alert{Labels: model.LabelSet{"env": "production", "service": "api"}}},
+			},
+			extractFn: extractLabels,
+			expected: template.KV{
+				"env":     "production",
+				"service": "backend, api, frontend",
+			},
+		},
+		{
+			name: "more than 5 unique values truncates to 5",
+			alerts: []*types.Alert{
+				{Alert: model.Alert{Labels: model.LabelSet{"service": "svc1"}}},
+				{Alert: model.Alert{Labels: model.LabelSet{"service": "svc2"}}},
+				{Alert: model.Alert{Labels: model.LabelSet{"service": "svc3"}}},
+				{Alert: model.Alert{Labels: model.LabelSet{"service": "svc4"}}},
+				{Alert: model.Alert{Labels: model.LabelSet{"service": "svc5"}}},
+				{Alert: model.Alert{Labels: model.LabelSet{"service": "svc6"}}},
+				{Alert: model.Alert{Labels: model.LabelSet{"service": "svc7"}}},
+			},
+			extractFn: extractLabels,
+			expected: template.KV{
+				"service": "svc1, svc2, svc3, svc4, svc5",
+			},
+		},
+	}
+
+	for _, tc := range testCases {
+		t.Run(tc.name, func(t *testing.T) {
+			result := aggregateKV(tc.alerts, tc.extractFn)
+			require.Equal(t, tc.expected, result)
+		})
+	}
+}
+
+func TestExtractCommonKV(t *testing.T) {
+	extractLabels := func(a *types.Alert) model.LabelSet { return a.Labels }
+	extractAnnotations := func(a *types.Alert) model.LabelSet { return a.Annotations }
+
+	testCases := []struct {
+		name      string
+		alerts    []*types.Alert
+		extractFn func(*types.Alert) model.LabelSet
+		expected  template.KV
+	}{
+		{
+			name:      "empty alerts slice",
+			alerts:    []*types.Alert{},
+			extractFn: extractLabels,
+			expected:  template.KV{},
+		},
+		{
+			name: "single alert returns all labels",
+			alerts: []*types.Alert{
+				{Alert: model.Alert{Labels: model.LabelSet{"env": "prod", "service": "api"}}},
+			},
+			extractFn: extractLabels,
+			expected:  template.KV{"env": "prod", "service": "api"},
+		},
+		{
+			name: "multiple alerts with fully common labels",
+			alerts: []*types.Alert{
+				{Alert: model.Alert{Labels: model.LabelSet{"env": "prod", "region": "us-east"}}},
+				{Alert: model.Alert{Labels: model.LabelSet{"env": "prod", "region": "us-east"}}},
+			},
+			extractFn: extractLabels,
+			expected:  template.KV{"env": "prod", "region": "us-east"},
+		},
+		{
+			name: "multiple alerts with partially common labels",
+			alerts: []*types.Alert{
+				{Alert: model.Alert{Labels: model.LabelSet{"env": "prod", "service": "api"}}},
+				{Alert: model.Alert{Labels: model.LabelSet{"env": "prod", "service": "worker"}}},
+			},
+			extractFn: extractLabels,
+			expected:  template.KV{"env": "prod"},
+		},
+		{
+			name: "multiple alerts with no common labels",
+			alerts: []*types.Alert{
+				{Alert: model.Alert{Labels: model.LabelSet{"service": "api"}}},
+				{Alert: model.Alert{Labels: model.LabelSet{"service": "worker"}}},
+			},
+			extractFn: extractLabels,
+			expected:  template.KV{},
+		},
+		{
+			name: "annotations extract common annotations",
+			alerts: []*types.Alert{
+				{Alert: model.Alert{Annotations: model.LabelSet{"summary": "high cpu", "runbook": "http://x"}}},
+				{Alert: model.Alert{Annotations: model.LabelSet{"summary": "high cpu", "runbook": "http://y"}}},
+			},
+			extractFn: extractAnnotations,
+			expected:  template.KV{"summary": "high cpu"},
+		},
+	}
+
+	for _, tc := range testCases {
+		t.Run(tc.name, func(t *testing.T) {
+			result := extractCommonKV(tc.alerts, tc.extractFn)
+			require.Equal(t, tc.expected, result)
+		})
+	}
+}

pkg/alertmanager/alertmanagertemplate/preprocessor.go

@@ -0,0 +1,318 @@
+package alertmanagertemplate
+
+import (
+	"fmt"
+	"reflect"
+	"strings"
+
+	"github.com/SigNoz/signoz/pkg/errors"
+	"github.com/SigNoz/signoz/pkg/types/alertmanagertypes"
+	"github.com/go-viper/mapstructure/v2"
+)
+
+// fieldPath is a dotted mapstructure path into the templating data map,
+// e.g. "alert.is_firing" or "rule.threshold.value".
+type fieldPath string
+
+// extractFieldMappings flattens the struct hierarchy into a list of dotted
+// mapstructure paths that user templates can reference. It emits:
+//   - a leaf for every scalar field
+//   - a leaf for every map field (labels, annotations)
+//   - a mapping for each intermediate sub-struct itself, so {{ $alert := .alert }}
+//     bindings let action blocks write {{ if $alert.is_firing }}
+//
+// Slices and interfaces are not surfaced. Pointer fields are dereferenced.
+func extractFieldMappings(data any) []fieldPath {
+	val := reflect.ValueOf(data)
+	if val.Kind() == reflect.Ptr {
+		if val.IsNil() {
+			return nil
+		}
+		val = val.Elem()
+	}
+	if val.Kind() != reflect.Struct {
+		return nil
+	}
+	return collectFieldMappings(val, "")
+}
+
+func collectFieldMappings(val reflect.Value, prefix string) []fieldPath {
+	typ := val.Type()
+	var paths []fieldPath
+	for i := 0; i < typ.NumField(); i++ {
+		field := typ.Field(i)
+		if !field.IsExported() {
+			continue
+		}
+
+		tag := field.Tag.Get("mapstructure")
+		if tag == "" || tag == "-" {
+			continue
+		}
+		name := strings.Split(tag, ",")[0]
+		if name == "" {
+			continue
+		}
+
+		key := name
+		if prefix != "" {
+			key = prefix + "." + name
+		}
+
+		ft := field.Type
+		if ft.Kind() == reflect.Ptr {
+			ft = ft.Elem()
+		}
+
+		switch ft.Kind() {
+		case reflect.Slice, reflect.Interface:
+			continue
+		}
+
+		// Recurse into sub-structs (time.Time treated as a leaf).
+		if ft.Kind() == reflect.Struct && ft.String() != "time.Time" {
+			paths = append(paths, fieldPath(key))
+			fv := val.Field(i)
+			if fv.Kind() == reflect.Ptr {
+				if fv.IsNil() {
+					continue
+				}
+				fv = fv.Elem()
+			}
+			paths = append(paths, collectFieldMappings(fv, key)...)
+			continue
+		}
+
+		paths = append(paths, fieldPath(key))
+	}
+	return paths
+}
+
+// structRootSet returns the top-level mapstructure tag names whose field
+// type is a nested struct (excluding time.Time and map/slice/interface
+// fields). These are the paths the rewriter walks segment-by-segment; any
+// other dotted $-reference is treated as a flat key on the root map so that
+// flattened OTel-style label keys like "service.name" resolve naturally.
+func structRootSet(data any) map[string]bool {
+	val := reflect.ValueOf(data)
+	if val.Kind() == reflect.Ptr {
+		if val.IsNil() {
+			return nil
+		}
+		val = val.Elem()
+	}
+	if val.Kind() != reflect.Struct {
+		return nil
+	}
+
+	roots := make(map[string]bool)
+	typ := val.Type()
+	for i := 0; i < typ.NumField(); i++ {
+		field := typ.Field(i)
+		if !field.IsExported() {
+			continue
+		}
+		tag := field.Tag.Get("mapstructure")
+		if tag == "" || tag == "-" {
+			continue
+		}
+		name := strings.Split(tag, ",")[0]
+		if name == "" {
+			continue
+		}
+		ft := field.Type
+		if ft.Kind() == reflect.Ptr {
+			ft = ft.Elem()
+		}
+		if ft.Kind() == reflect.Struct && ft.String() != "time.Time" {
+			roots[name] = true
+		}
+	}
+	return roots
+}
+
+// buildDataMap converts the typed data struct to the map[string]any that the
+// template engine indexes into. Each label and annotation is additionally
+// exposed at the root under its raw key, so $service.name resolves a flat
+// OTel-style label as a single-key index on the root. Struct-path keys
+// already present at the root take precedence on collisions.
+func buildDataMap(data any) (map[string]any, error) {
+	var result map[string]any
+	if err := mapstructure.Decode(data, &result); err != nil {
+		return nil, errors.WrapInvalidInputf(err, errors.CodeInvalidInput, "failed to build template data map")
+	}
+
+	flatten := func(labels, annotations map[string]string) {
+		for k, v := range labels {
+			if _, ok := result[k]; !ok {
+				result[k] = v
+			}
+		}
+		for k, v := range annotations {
+			if _, ok := result[k]; !ok {
+				result[k] = v
+			}
+		}
+	}
+
+	switch data := data.(type) {
+	case *alertmanagertypes.NotificationTemplateData:
+		flatten(data.Labels, data.Annotations)
+	case *alertmanagertypes.AlertData:
+		flatten(data.Labels, data.Annotations)
+	}
+	return result, nil
+}
+
+// renderPreamble serialises a map of binding name → RHS expression into
+// `{{ $name := expr }}` declarations. Dotted names are skipped: Go's
+// text/template parser rejects `{{ $a.b := ... }}`; dotted paths are resolved
+// at expansion time by the rewriter.
+func renderPreamble(bindings map[string]string) string {
+	if len(bindings) == 0 {
+		return ""
+	}
+	var sb strings.Builder
+	for name, expr := range bindings {
+		if strings.Contains(name, ".") {
+			continue
+		}
+		fmt.Fprintf(&sb, `{{ $%s := %s }}`, name, expr)
+	}
+	return sb.String()
+}
+
+// buildPreamble constructs the variable-definition preamble prepended to the
+// user template, covering:
+//   - known root-level struct paths ({{ $alert := .alert }})
+//   - "<no value>" stubs for $-refs whose first segment matches nothing, so
+//     action blocks like {{ if $custom_note }} don't error at parse time
+//
+// The set of unmatched names is returned separately so callers (preview API)
+// can surface warnings.
+func buildPreamble(tmpl string, data any) (string, map[string]bool, error) {
+	bindings := make(map[string]string)
+	// knownFirstSegments tracks every valid first segment of a $-ref, since
+	// extractUsedVariables only gives us first segments. A label key like
+	// "service.name" contributes "service" here, so $service.name isn't
+	// flagged as unknown even though "service" has no direct binding.
+	knownFirstSegments := make(map[string]bool)
+
+	for _, p := range extractFieldMappings(data) {
+		bindings[string(p)] = fmt.Sprintf(".%s", p)
+		knownFirstSegments[firstSegment(string(p))] = true
+	}
+	// Labels/annotations are flattened into the root map by buildDataMap, so
+	// a bare-accessible key (no dots) can be bound in the preamble — this is
+	// what makes {{ if $severity }} or {{ $severity | toUpper }} work in
+	// action blocks. Dotted label keys only contribute to knownFirstSegments:
+	// their action-block use would be a syntax error anyway ($a.b is not a
+	// valid Go template identifier).
+	for k := range dataLabelsAndAnnotations(data) {
+		knownFirstSegments[firstSegment(k)] = true
+		if !strings.Contains(k, ".") {
+			if _, ok := bindings[k]; !ok {
+				bindings[k] = fmt.Sprintf(".%s", k)
+			}
+		}
+	}
+
+	used, err := extractUsedVariables(tmpl)
+	if err != nil {
+		return "", nil, err
+	}
+
+	unknown := make(map[string]bool)
+	for name := range used {
+		if !knownFirstSegments[name] {
+			unknown[name] = true
+			bindings[name] = `"<no value>"`
+		}
+	}
+
+	return renderPreamble(bindings), unknown, nil
+}
+
+// firstSegment returns the portion of a dotted path before the first dot,
+// or the whole string if there is no dot.
+func firstSegment(path string) string {
+	if i := strings.IndexByte(path, '.'); i >= 0 {
+		return path[:i]
+	}
+	return path
+}
+
+// dataLabelsAndAnnotations returns the union of label and annotation keys on
+// the given data struct (if it carries them). Used for first-segment
+// recognition of $-refs that point into flat OTel-style label keys.
+func dataLabelsAndAnnotations(data any) map[string]struct{} {
+	keys := make(map[string]struct{})
+	switch d := data.(type) {
+	case *alertmanagertypes.NotificationTemplateData:
+		for k := range d.Labels {
+			keys[k] = struct{}{}
+		}
+		for k := range d.Annotations {
+			keys[k] = struct{}{}
+		}
+	case *alertmanagertypes.AlertData:
+		for k := range d.Labels {
+			keys[k] = struct{}{}
+		}
+		for k := range d.Annotations {
+			keys[k] = struct{}{}
+		}
+	}
+	return keys
+}
+
+// processingResult is the rewritten template and its backing data map,
+// ready to be passed to Go text/template's Execute.
+type processingResult struct {
+	// Template is the input template with $-refs rewritten to Go template
+	// syntax and an identifier preamble prepended.
+	Template string
+	// Data is the flattened map the template indexes into.
+	Data map[string]any
+	// UnknownVars are $-refs in the input that had no matching data path.
+	// They render as "<no value>" at execution; useful for preview warnings.
+	UnknownVars map[string]bool
+}
+
+// preProcessTemplateAndData prepares a user-authored template and its backing
+// struct for Go text/template execution.
+//
+//	Input (with data *AlertData):
+//	    "$rule.name fired with value $alert.value"
+//	Output:
+//	    "{{ $alert := .alert }}{{ $rule := .rule }}..."
+//	    "{{ index . \"rule\" \"name\" }} fired with value {{ index . \"alert\" \"value\" }}"
+func preProcessTemplateAndData(tmpl string, data any) (*processingResult, error) {
+	unknownVars := make(map[string]bool)
+	if tmpl == "" {
+		result, err := buildDataMap(data)
+		if err != nil {
+			return nil, err
+		}
+		return &processingResult{Data: result, UnknownVars: unknownVars}, nil
+	}
+
+	preamble, unknownVars, err := buildPreamble(tmpl, data)
+	if err != nil {
+		return nil, errors.WrapInvalidInputf(err, errors.CodeInvalidInput, "failed to build template preamble")
+	}
+
+	// Prepend the preamble so wrapDollarVariables can parse the AST without
+	// "undefined variable" errors for $-refs inside action blocks.
+	wrapped, err := wrapDollarVariables(preamble+tmpl, structRootSet(data))
+	if err != nil {
+		return nil, errors.WrapInvalidInputf(err, errors.CodeInvalidInput, "failed to rewrite template")
+	}
+
+	result, err := buildDataMap(data)
+	if err != nil {
+		return nil, err
+	}
+
+	return &processingResult{Template: wrapped, Data: result, UnknownVars: unknownVars}, nil
+}

pkg/alertmanager/alertmanagertemplate/preprocessor_test.go

@@ -0,0 +1,380 @@
+package alertmanagertemplate
+
+import (
+	"testing"
+	"time"
+
+	"github.com/SigNoz/signoz/pkg/types/alertmanagertypes"
+	"github.com/prometheus/alertmanager/template"
+	"github.com/stretchr/testify/require"
+)
+
+func TestExtractFieldMappings(t *testing.T) {
+	// Flat struct: mapstructure-tagged leaves only. Slices and interfaces are
+	// dropped; maps (labels/annotations analogues) are kept as top-level leaves.
+	type Flat struct {
+		Name       string            `mapstructure:"name"`
+		Status     string            `mapstructure:"status"`
+		UserCount  int               `mapstructure:"user_count"`
+		IsActive   bool              `mapstructure:"is_active"`
+		CreatedAt  time.Time         `mapstructure:"created_at"`
+		Extra      map[string]string `mapstructure:"extra"`
+		Items      []string          `mapstructure:"items"` // slice skipped
+		unexported string            //nolint:unused // unexported skipped
+		NoTag      string            // no mapstructure tag skipped
+		SkippedTag string            `mapstructure:"-"` // explicit skip
+	}
+
+	// Nested struct: sub-struct paths are flattened into dotted mappings; the
+	// parent path itself is also emitted so templates can bind `$alert := .alert`.
+	type Inner struct {
+		Value string `mapstructure:"value"`
+		Op    string `mapstructure:"op"`
+	}
+	type Outer struct {
+		Alert struct {
+			Status   string `mapstructure:"status"`
+			IsFiring bool   `mapstructure:"is_firing"`
+		} `mapstructure:"alert"`
+		Rule struct {
+			Name      string `mapstructure:"name"`
+			Threshold Inner  `mapstructure:"threshold"`
+		} `mapstructure:"rule"`
+	}
+
+	testCases := []struct {
+		name     string
+		data     any
+		expected []fieldPath
+	}{
+		{
+			name: "flat struct surfaces only mapstructure-tagged scalars",
+			data: Flat{},
+			expected: []fieldPath{
+				"name", "status", "user_count", "is_active", "created_at", "extra",
+			},
+		},
+		{
+			name: "nested struct emits parent and dotted leaf paths",
+			data: Outer{},
+			expected: []fieldPath{
+				"alert",
+				"alert.status",
+				"alert.is_firing",
+				"rule",
+				"rule.name",
+				"rule.threshold",
+				"rule.threshold.value",
+				"rule.threshold.op",
+			},
+		},
+		{
+			name:     "nil data",
+			data:     nil,
+			expected: nil,
+		},
+		{
+			name:     "non-struct type",
+			data:     "string",
+			expected: nil,
+		},
+	}
+
+	for _, tc := range testCases {
+		t.Run(tc.name, func(t *testing.T) {
+			result := extractFieldMappings(tc.data)
+			require.Equal(t, tc.expected, result)
+		})
+	}
+}
+
+func TestBuildVariableDefinitions(t *testing.T) {
+	testCases := []struct {
+		name          string
+		tmpl          string
+		data          any
+		expectedVars  []string // substrings that must appear in result
+		forbiddenVars []string // substrings that must NOT appear (dotted identifiers)
+		expectError   bool
+	}{
+		{
+			name: "empty template still emits struct bindings for title data",
+			tmpl: "",
+			data: &alertmanagertypes.NotificationTemplateData{Alert: alertmanagertypes.NotificationAlert{Receiver: "slack"}},
+			expectedVars: []string{
+				"{{ $alert := .alert }}",
+				"{{ $rule := .rule }}",
+			},
+			// Dotted leaves are NOT emitted as preamble bindings — they're
+			// reached via {{ index . "alert" "status" }} at expansion time.
+			forbiddenVars: []string{
+				"$alert.status",
+				"$rule.threshold.value",
+			},
+		},
+		{
+			name: "mix of known and unknown vars in alert body",
+			tmpl: "$rule.name fired: $custom_label",
+			data: &alertmanagertypes.AlertData{Rule: alertmanagertypes.RuleInfo{Name: "test"}, Alert: alertmanagertypes.AlertInfo{Status: "firing"}},
+			expectedVars: []string{
+				"{{ $alert := .alert }}",
+				"{{ $rule := .rule }}",
+				`{{ $custom_label := "<no value>" }}`,
+			},
+		},
+		{
+			name: "known dotted variables do not get flagged as unknown",
+			tmpl: "$alert.is_firing and $rule.threshold.value",
+			data: &alertmanagertypes.AlertData{},
+			// $alert and $rule (first segments) are in mappings, so no unknown
+			// stubs; the dotted leaves are resolved by WrapDollarVariables.
+			expectedVars: []string{
+				"{{ $alert := .alert }}",
+				"{{ $rule := .rule }}",
+			},
+			forbiddenVars: []string{
+				`"<no value>"`,
+			},
+		},
+		{
+			// Label-derived $-refs aren't stubbed as unknown; their first
+			// segment is marked known so {{ $severity := ... }} stubs don't
+			// appear in the preamble. Resolution happens at expansion via the
+			// root-level flattening performed in buildDataMap.
+			name: "label first-segments suppress unknown-var stubs",
+			tmpl: "$severity for $service $cloud.region.instance",
+			data: &alertmanagertypes.NotificationTemplateData{Labels: template.KV{
+				"severity":              "critical",
+				"service":               "test",
+				"cloud.region.instance": "ap-south-1",
+			}},
+			forbiddenVars: []string{
+				`{{ $severity := "<no value>" }}`,
+				`{{ $service := "<no value>" }}`,
+				`{{ $cloud := "<no value>" }}`,
+			},
+		},
+		{
+			name: "same rule holds for AlertData labels",
+			tmpl: "$severity $service",
+			data: &alertmanagertypes.AlertData{Labels: template.KV{
+				"severity": "critical",
+				"service":  "test",
+			}},
+			forbiddenVars: []string{
+				`{{ $severity := "<no value>" }}`,
+				`{{ $service := "<no value>" }}`,
+			},
+		},
+		{
+			name:        "invalid template syntax returns error",
+			tmpl:        "{{invalid",
+			data:        &alertmanagertypes.NotificationTemplateData{},
+			expectError: true,
+		},
+	}
+
+	for _, tc := range testCases {
+		t.Run(tc.name, func(t *testing.T) {
+			result, _, err := buildPreamble(tc.tmpl, tc.data)
+			if tc.expectError {
+				require.Error(t, err)
+				return
+			}
+			require.NoError(t, err)
+			for _, expected := range tc.expectedVars {
+				require.Contains(t, result, expected, "expected preamble substring missing")
+			}
+			for _, forbidden := range tc.forbiddenVars {
+				require.NotContains(t, result, forbidden, "unexpected preamble substring present")
+			}
+		})
+	}
+}
+
+func TestPreProcessTemplateAndData(t *testing.T) {
+	testCases := []struct {
+		name                     string
+		tmpl                     string
+		data                     any
+		expectedTemplateContains []string
+		expectedData             map[string]any
+		expectedUnknownVars      map[string]bool
+		expectError              bool
+	}{
+		{
+			name: "title template: struct-root walks and flat dotted label keys",
+			tmpl: "[$alert.status] $rule.name (ID: $rule.id) firing=$alert.total_firing severity=$severity method=$http.request.method",
+			data: &alertmanagertypes.NotificationTemplateData{
+				Alert: alertmanagertypes.NotificationAlert{
+					Receiver:    "pagerduty",
+					Status:      "firing",
+					TotalFiring: 3,
+				},
+				Rule: alertmanagertypes.RuleInfo{
+					Name: "HighMemory",
+					ID:   "rule-123",
+				},
+				Labels: template.KV{
+					"severity":            "critical",
+					"http.request.method": "GET",
+				},
+			},
+			expectedTemplateContains: []string{
+				"{{$alert := .alert}}",
+				"{{$rule := .rule}}",
+				`[{{ index . "alert" "status" }}] {{ index . "rule" "name" }} (ID: {{ index . "rule" "id" }})`,
+				`firing={{ index . "alert" "total_firing" }} severity={{ .severity }}`,
+				`method={{ index . "http.request.method" }}`,
+			},
+			expectedData: map[string]any{
+				"alert": map[string]any{
+					"receiver":       "pagerduty",
+					"status":         "firing",
+					"total_firing":   3,
+					"total_resolved": 0,
+				},
+				"severity":            "critical",
+				"http.request.method": "GET",
+			},
+			expectedUnknownVars: map[string]bool{},
+		},
+		{
+			name: "body template with nested threshold access and per-alert annotation",
+			tmpl: "$rule.name: value $alert.value $rule.threshold.op $rule.threshold.value ($alert.status) desc=$description",
+			data: &alertmanagertypes.AlertData{
+				Alert: alertmanagertypes.AlertInfo{
+					Status:   "firing",
+					Value:    "85%",
+					IsFiring: true,
+				},
+				Rule: alertmanagertypes.RuleInfo{
+					Name:      "DiskFull",
+					ID:        "disk-001",
+					Severity:  "warning",
+					Threshold: alertmanagertypes.Threshold{Value: "80%", Op: ">"},
+				},
+				Annotations: template.KV{
+					"description": "Disk full and cannot be written to",
+				},
+			},
+			expectedTemplateContains: []string{
+				"{{$alert := .alert}}",
+				"{{$rule := .rule}}",
+				// "description" is an annotation flattened to root; the preamble
+				// now binds it off the root rather than via .annotations lookup.
+				"{{$description := .description}}",
+				`{{ index . "rule" "name" }}: value {{ index . "alert" "value" }} {{ index . "rule" "threshold" "op" }} {{ index . "rule" "threshold" "value" }}`,
+			},
+			expectedData: map[string]any{
+				"description": "Disk full and cannot be written to",
+			},
+			expectedUnknownVars: map[string]bool{},
+		},
+		{
+			// Struct roots reserve their first-segment namespace: a label
+			// whose key starts with "alert." is shadowed by the Alert sub-map,
+			// and must be accessed via the explicit $labels.* prefix.
+			name: "label colliding with struct root is accessed via $labels.*",
+			tmpl: "$alert.status via $labels.alert.custom",
+			data: &alertmanagertypes.NotificationTemplateData{
+				Alert:  alertmanagertypes.NotificationAlert{Status: "firing"},
+				Labels: template.KV{"alert.custom": "x"},
+			},
+			expectedTemplateContains: []string{
+				`{{ index . "alert" "status" }}`,
+				`{{ index .labels "alert.custom" }}`,
+			},
+		},
+		{
+			// Same shadowing rule applies symmetrically to annotations.
+			name: "annotation colliding with struct root is accessed via $annotations.*",
+			tmpl: "$alert.status via $annotations.alert.meta",
+			data: &alertmanagertypes.NotificationTemplateData{
+				Alert:       alertmanagertypes.NotificationAlert{Status: "firing"},
+				Annotations: template.KV{"alert.meta": "x"},
+			},
+			expectedTemplateContains: []string{
+				`{{ index . "alert" "status" }}`,
+				`{{ index .annotations "alert.meta" }}`,
+			},
+		},
+		{
+			// When a label and an annotation share a key, the label wins at the
+			// root flattening layer. Users who want the annotation must address
+			// it explicitly via $annotations.<key>.
+			name: "label takes precedence over same-named annotation at root",
+			tmpl: "flat=$env labels_only=$labels.env annotations_only=$annotations.env",
+			data: &alertmanagertypes.NotificationTemplateData{
+				Labels:      template.KV{"env": "prod"},
+				Annotations: template.KV{"env": "staging"},
+			},
+			expectedTemplateContains: []string{
+				`flat={{ .env }}`,
+				`labels_only={{ index .labels "env" }}`,
+				`annotations_only={{ index .annotations "env" }}`,
+			},
+			expectedData: map[string]any{
+				"env": "prod",
+			},
+		},
+		{
+			name: "empty template returns flattened data",
+			tmpl: "",
+			data: &alertmanagertypes.NotificationTemplateData{Alert: alertmanagertypes.NotificationAlert{Receiver: "slack"}},
+		},
+		{
+			name:        "invalid template syntax",
+			tmpl:        "{{invalid",
+			data:        &alertmanagertypes.NotificationTemplateData{},
+			expectError: true,
+		},
+		{
+			name: "unknown dollar var in text renders empty",
+			tmpl: "alert $custom_note fired",
+			data: &alertmanagertypes.NotificationTemplateData{Rule: alertmanagertypes.RuleInfo{Name: "HighCPU"}},
+			expectedTemplateContains: []string{
+				`{{$custom_note := "<no value>"}}`,
+				"alert {{ .custom_note }} fired",
+			},
+			expectedUnknownVars: map[string]bool{"custom_note": true},
+		},
+		{
+			name: "unknown dollar var in action block renders empty",
+			tmpl: "alert {{ $custom_note }} fired",
+			data: &alertmanagertypes.NotificationTemplateData{Rule: alertmanagertypes.RuleInfo{Name: "HighCPU"}},
+			expectedTemplateContains: []string{
+				`{{$custom_note := "<no value>"}}`,
+				`alert {{$custom_note}} fired`,
+			},
+			expectedUnknownVars: map[string]bool{"custom_note": true},
+		},
+	}
+
+	for _, tc := range testCases {
+		t.Run(tc.name, func(t *testing.T) {
+			result, err := preProcessTemplateAndData(tc.tmpl, tc.data)
+
+			if tc.expectError {
+				require.Error(t, err)
+				return
+			}
+			require.NoError(t, err)
+
+			if tc.tmpl == "" {
+				require.Equal(t, "", result.Template)
+				return
+			}
+
+			for _, substr := range tc.expectedTemplateContains {
+				require.Contains(t, result.Template, substr)
+			}
+			for k, v := range tc.expectedData {
+				require.Equal(t, v, result.Data[k], "data[%q] mismatch", k)
+			}
+			if tc.expectedUnknownVars != nil {
+				require.Equal(t, tc.expectedUnknownVars, result.UnknownVars)
+			}
+		})
+	}
+}

pkg/alertmanager/alertmanagertemplate/rewrite.go

@@ -0,0 +1,155 @@
+package alertmanagertemplate
+
+import (
+	"fmt"
+	"reflect"
+	"regexp"
+	"strings"
+	"text/template/parse"
+
+	"github.com/SigNoz/signoz/pkg/errors"
+)
+
+// bareVariableRegex matches $-references including dotted paths (e.g. $alert.is_firing).
+var bareVariableRegex = regexp.MustCompile(`\$(\w+(?:\.\w+)*)`)
+
+// bareVariableFirstSegRegex captures only the first segment of a $-reference.
+// $labels.severity yields "$labels"; $alert.is_firing yields "$alert".
+var bareVariableFirstSegRegex = regexp.MustCompile(`\$\w+`)
+
+// wrapDollarVariables rewrites bare $-references in a template's plain-text
+// regions into Go text/template syntax. References inside `{{ ... }}` action
+// blocks are left untouched — they're already template syntax. structRoots
+// is the set of top-level mapstructure names whose values are nested structs
+// (e.g. "alert", "rule"): $-refs whose first segment is in this set are
+// walked segment-by-segment; everything else dotted is treated as a flat key
+// on the root map so flattened OTel-style label keys resolve naturally.
+//
+// Examples (structRoots = {alert, rule}):
+//
+//	"$name is $status"       -> "{{ .name }} is {{ .status }}"
+//	"$labels.severity"       -> `{{ index .labels "severity" }}`
+//	"$labels.http.method"    -> `{{ index .labels "http.method" }}`
+//	"$annotations.summary"   -> `{{ index .annotations "summary" }}`
+//	"$alert.is_firing"       -> `{{ index . "alert" "is_firing" }}`
+//	"$rule.threshold.value"  -> `{{ index . "rule" "threshold" "value" }}`
+//	"$service.name"          -> `{{ index . "service.name" }}`
+//	"$name is {{ .Status }}" -> "{{ .name }} is {{ .Status }}"
+func wrapDollarVariables(src string, structRoots map[string]bool) (string, error) {
+	if src == "" {
+		return src, nil
+	}
+
+	tree := parse.New("template")
+	tree.Mode = parse.SkipFuncCheck
+
+	if _, err := tree.Parse(src, "{{", "}}", make(map[string]*parse.Tree), nil); err != nil {
+		return "", err
+	}
+
+	walkAndWrapTextNodes(tree.Root, structRoots)
+	return tree.Root.String(), nil
+}
+
+// walkAndWrapTextNodes descends the parse tree and rewrites $-references
+// found in TextNodes. If/Range bodies are recursed into. ActionNodes and
+// other `{{...}}` constructs are left alone because they're already template
+// syntax. WithNode is not yet supported — add when the editor grows a "with"
+// block.
+func walkAndWrapTextNodes(node parse.Node, structRoots map[string]bool) {
+	if reflect.ValueOf(node).IsNil() {
+		return
+	}
+
+	switch n := node.(type) {
+	case *parse.ListNode:
+		if n.Nodes != nil {
+			for _, child := range n.Nodes {
+				walkAndWrapTextNodes(child, structRoots)
+			}
+		}
+
+	case *parse.TextNode:
+		n.Text = bareVariableRegex.ReplaceAllFunc(n.Text, func(match []byte) []byte {
+			return rewriteDollarRef(match, structRoots)
+		})
+
+	case *parse.IfNode:
+		walkAndWrapTextNodes(n.List, structRoots)
+		walkAndWrapTextNodes(n.ElseList, structRoots)
+
+	case *parse.RangeNode:
+		walkAndWrapTextNodes(n.List, structRoots)
+		walkAndWrapTextNodes(n.ElseList, structRoots)
+	}
+}
+
+// rewriteDollarRef converts one $-reference (with the leading $) into the
+// corresponding Go template expression.
+//
+//   - labels./annotations. prefixes: treat the remainder as a single map key
+//     (OTel-style keys like "http.request.method" are flat keys, not paths).
+//   - Dotted path with a struct-root first segment: walk via chained index
+//     arguments. `index x a b c` is equivalent to x[a][b][c].
+//   - Other dotted path: treat as a single flat key on the root map, so a
+//     flattened OTel-style label key like "service.name" resolves.
+//   - Simple names: plain dot access on the root map.
+func rewriteDollarRef(match []byte, structRoots map[string]bool) []byte {
+	name := string(match[1:])
+
+	if !strings.Contains(name, ".") {
+		return fmt.Appendf(nil, `{{ .%s }}`, name)
+	}
+
+	if key, ok := strings.CutPrefix(name, "labels."); ok {
+		return fmt.Appendf(nil, `{{ index .labels %q }}`, key)
+	}
+	if key, ok := strings.CutPrefix(name, "annotations."); ok {
+		return fmt.Appendf(nil, `{{ index .annotations %q }}`, key)
+	}
+
+	// If the first segment is a known struct root, walk segments.
+	if dot := strings.IndexByte(name, '.'); dot >= 0 && structRoots[name[:dot]] {
+		parts := strings.Split(name, ".")
+		args := make([]string, len(parts))
+		for i, p := range parts {
+			args[i] = fmt.Sprintf("%q", p)
+		}
+		return fmt.Appendf(nil, `{{ index . %s }}`, strings.Join(args, " "))
+	}
+
+	// Otherwise treat the full dotted path as a single flat root key.
+	return fmt.Appendf(nil, `{{ index . %q }}`, name)
+}
+
+// extractUsedVariables returns the set of every base $-name referenced in the
+// template — text nodes, action blocks, branch conditions, loop declarations.
+// Names are first-segment only: $labels.severity contributes "labels".
+//
+// The template is validated during extraction (a synthesised preamble
+// pre-declares each name so the parser doesn't trip on "undefined variable"
+// for names that genuinely exist in the data), so a parse error here
+// indicates a genuine syntax problem rather than a missing binding.
+func extractUsedVariables(src string) (map[string]bool, error) {
+	if src == "" {
+		return map[string]bool{}, nil
+	}
+
+	used := make(map[string]bool)
+	for _, m := range bareVariableFirstSegRegex.FindAll([]byte(src), -1) {
+		used[string(m[1:])] = true
+	}
+
+	var preamble strings.Builder
+	for name := range used {
+		fmt.Fprintf(&preamble, `{{$%s := ""}}`, name)
+	}
+
+	tree := parse.New("template")
+	tree.Mode = parse.SkipFuncCheck
+	if _, err := tree.Parse(preamble.String()+src, "{{", "}}", make(map[string]*parse.Tree), nil); err != nil {
+		return nil, errors.WrapInvalidInputf(err, errors.CodeInternal, "failed to extract used variables")
+	}
+
+	return used, nil
+}

pkg/alertmanager/alertmanagertemplate/rewrite_test.go

@@ -0,0 +1,213 @@
+package alertmanagertemplate
+
+import (
+	"testing"
+
+	"github.com/stretchr/testify/require"
+)
+
+func TestWrapBareVars(t *testing.T) {
+	testCases := []struct {
+		name        string
+		input       string
+		expected    string
+		expectError bool
+	}{
+		{
+			name:     "mixed variables with actions",
+			input:    "$name is {{.Status}}",
+			expected: "{{ .name }} is {{.Status}}",
+		},
+		{
+			name: "nested variables in range",
+			input: `{{range .items}}
+					$title
+					{{end}}`,
+			expected: `{{range .items}}
+					{{ .title }}
+					{{end}}`,
+		},
+		{
+			name:     "nested variables in if else",
+			input:    "{{if .ok}}$a{{else}}$b{{end}}",
+			expected: "{{if .ok}}{{ .a }}{{else}}{{ .b }}{{end}}",
+		},
+		// Labels prefix: index into .labels map
+		{
+			name:     "labels variables prefix simple",
+			input:    "$labels.service",
+			expected: `{{ index .labels "service" }}`,
+		},
+		{
+			name:     "labels variables prefix nested with multiple dots",
+			input:    "$labels.http.status",
+			expected: `{{ index .labels "http.status" }}`,
+		},
+		{
+			name:     "multiple labels variables simple and nested",
+			input:    "$labels.service and $labels.instance.id",
+			expected: `{{ index .labels "service" }} and {{ index .labels "instance.id" }}`,
+		},
+		// Annotations prefix: index into .annotations map
+		{
+			name:     "annotations variables prefix simple",
+			input:    "$annotations.summary",
+			expected: `{{ index .annotations "summary" }}`,
+		},
+		{
+			name:     "annotations variables prefix nested with multiple dots",
+			input:    "$annotations.alert.url",
+			expected: `{{ index .annotations "alert.url" }}`,
+		},
+		// Struct-root paths: walk segment-by-segment via chained index.
+		{
+			name:     "struct-root dotted path walks via chained index",
+			input:    "$alert.is_firing",
+			expected: `{{ index . "alert" "is_firing" }}`,
+		},
+		{
+			name:     "deeply nested struct-root path",
+			input:    "$rule.threshold.value",
+			expected: `{{ index . "rule" "threshold" "value" }}`,
+		},
+		// Non-struct-root dotted paths: treated as a single flat key on the
+		// root map, so flattened OTel-style label keys resolve naturally.
+		{
+			name:     "non-struct-root dotted path hits flat root key",
+			input:    "$service.name",
+			expected: `{{ index . "service.name" }}`,
+		},
+		// Hybrid: all types combined
+		{
+			name:     "hybrid - all variables types",
+			input:    "Alert: $alert_name Labels: $labels.severity Annotations: $annotations.desc Value: $alert.value Count: $error_count",
+			expected: `Alert: {{ .alert_name }} Labels: {{ index .labels "severity" }} Annotations: {{ index .annotations "desc" }} Value: {{ index . "alert" "value" }} Count: {{ .error_count }}`,
+		},
+		{
+			name:     "already wrapped should not be changed",
+			input:    "{{$status := .status}}{{.name}} is {{$status | toUpper}}",
+			expected: "{{$status := .status}}{{.name}} is {{$status | toUpper}}",
+		},
+		{
+			name:     "no variables should not be changed",
+			input:    "Hello world",
+			expected: "Hello world",
+		},
+		{
+			name:     "empty string",
+			input:    "",
+			expected: "",
+		},
+		{
+			name:     "deeply nested",
+			input:    "{{range .items}}{{if .ok}}$deep{{end}}{{end}}",
+			expected: "{{range .items}}{{if .ok}}{{ .deep }}{{end}}{{end}}",
+		},
+		{
+			name: "complex example",
+			input: `Hello $name, your score is $score.
+					{{if .isAdmin}}
+						Welcome back $name, you have {{.unreadCount}} messages.
+					{{end}}`,
+			expected: `Hello {{ .name }}, your score is {{ .score }}.
+					{{if .isAdmin}}
+						Welcome back {{ .name }}, you have {{.unreadCount}} messages.
+					{{end}}`,
+		},
+		{
+			name:     "with custom function",
+			input:    "$name triggered at {{urlescape .url}}",
+			expected: "{{ .name }} triggered at {{urlescape .url}}",
+		},
+		{
+			name:        "invalid template",
+			input:       "{{invalid",
+			expectError: true,
+		},
+	}
+
+	// structRoots used across the test cases: "alert" and "rule" are walked,
+	// anything else dotted is treated as a flat root-map key.
+	structRoots := map[string]bool{"alert": true, "rule": true}
+
+	for _, tc := range testCases {
+		t.Run(tc.name, func(t *testing.T) {
+			result, err := wrapDollarVariables(tc.input, structRoots)
+
+			if tc.expectError {
+				require.Error(t, err, "should error on invalid template syntax")
+			} else {
+				require.NoError(t, err)
+				require.Equal(t, tc.expected, result)
+			}
+		})
+	}
+}
+
+func TestExtractUsedVariables(t *testing.T) {
+	testCases := []struct {
+		name        string
+		input       string
+		expected    map[string]bool
+		expectError bool
+	}{
+		{
+			name:     "simple usage in text",
+			input:    "$name is $status",
+			expected: map[string]bool{"name": true, "status": true},
+		},
+		{
+			name:     "declared in action block",
+			input:    "{{ $name := .name }}",
+			expected: map[string]bool{"name": true},
+		},
+		{
+			name:     "range loop vars",
+			input:    "{{ range $i, $v := .items }}{{ end }}",
+			expected: map[string]bool{"i": true, "v": true},
+		},
+		{
+			name:     "mixed text and action",
+			input:    "$x and {{ $y }}",
+			expected: map[string]bool{"x": true, "y": true},
+		},
+		{
+			name:     "dotted path in text extracts base only",
+			input:    "$labels.severity",
+			expected: map[string]bool{"labels": true},
+		},
+		{
+			name:     "nested if else",
+			input:    "{{ if .ok }}{{ $a }}{{ else }}{{ $b }}{{ end }}",
+			expected: map[string]bool{"a": true, "b": true},
+		},
+		{
+			name:     "empty string",
+			input:    "",
+			expected: map[string]bool{},
+		},
+		{
+			name:     "no variables",
+			input:    "Hello world",
+			expected: map[string]bool{},
+		},
+		{
+			name:        "invalid template returns error",
+			input:       "{{invalid",
+			expectError: true,
+		},
+	}
+
+	for _, tc := range testCases {
+		t.Run(tc.name, func(t *testing.T) {
+			result, err := extractUsedVariables(tc.input)
+
+			if tc.expectError {
+				require.Error(t, err)
+			} else {
+				require.NoError(t, err)
+				require.Equal(t, tc.expected, result)
+			}
+		})
+	}
+}

pkg/apiserver/signozapiserver/provider.go

@@ -26,6 +26,7 @@ import (
 	"github.com/SigNoz/signoz/pkg/modules/session"
 	"github.com/SigNoz/signoz/pkg/modules/user"
 	"github.com/SigNoz/signoz/pkg/querier"
+	"github.com/SigNoz/signoz/pkg/ruler"
 	"github.com/SigNoz/signoz/pkg/types"
 	"github.com/SigNoz/signoz/pkg/types/authtypes"
 	"github.com/SigNoz/signoz/pkg/zeus"
@@ -59,6 +60,7 @@ type provider struct {
 	cloudIntegrationHandler cloudintegration.Handler
 	ruleStateHistoryHandler rulestatehistory.Handler
 	alertmanagerHandler     alertmanager.Handler
+	rulerHandler            ruler.Handler
 }
 
 func NewFactory(
@@ -86,6 +88,7 @@ func NewFactory(
 	cloudIntegrationHandler cloudintegration.Handler,
 	ruleStateHistoryHandler rulestatehistory.Handler,
 	alertmanagerHandler alertmanager.Handler,
+	rulerHandler ruler.Handler,
 ) factory.ProviderFactory[apiserver.APIServer, apiserver.Config] {
 	return factory.NewProviderFactory(factory.MustNewName("signoz"), func(ctx context.Context, providerSettings factory.ProviderSettings, config apiserver.Config) (apiserver.APIServer, error) {
 		return newProvider(
@@ -116,6 +119,7 @@ func NewFactory(
 			cloudIntegrationHandler,
 			ruleStateHistoryHandler,
 			alertmanagerHandler,
+			rulerHandler,
 		)
 	})
 }
@@ -148,6 +152,7 @@ func newProvider(
 	cloudIntegrationHandler cloudintegration.Handler,
 	ruleStateHistoryHandler rulestatehistory.Handler,
 	alertmanagerHandler alertmanager.Handler,
+	rulerHandler ruler.Handler,
 ) (apiserver.APIServer, error) {
 	settings := factory.NewScopedProviderSettings(providerSettings, "github.com/SigNoz/signoz/pkg/apiserver/signozapiserver")
 	router := mux.NewRouter().UseEncodedPath()
@@ -178,6 +183,7 @@ func newProvider(
 		cloudIntegrationHandler: cloudIntegrationHandler,
 		ruleStateHistoryHandler: ruleStateHistoryHandler,
 		alertmanagerHandler:     alertmanagerHandler,
+		rulerHandler:            rulerHandler,
 	}
 
 	provider.authZ = middleware.NewAuthZ(settings.Logger(), orgGetter, authz)
@@ -282,6 +288,10 @@ func (provider *provider) AddToRouter(router *mux.Router) error {
 		return err
 	}
 
+	if err := provider.addRulerRoutes(router); err != nil {
+		return err
+	}
+
 	return nil
 }
 

pkg/apiserver/signozapiserver/ruler.go

@@ -0,0 +1,185 @@
+package signozapiserver
+
+import (
+	"net/http"
+
+	"github.com/SigNoz/signoz/pkg/http/handler"
+	"github.com/SigNoz/signoz/pkg/types"
+	"github.com/SigNoz/signoz/pkg/types/ruletypes"
+	"github.com/gorilla/mux"
+)
+
+func (provider *provider) addRulerRoutes(router *mux.Router) error {
+	if err := router.Handle("/api/v2/rules", handler.New(provider.authZ.ViewAccess(provider.rulerHandler.ListRules), handler.OpenAPIDef{
+		ID:                  "ListRules",
+		Tags:                []string{"rules"},
+		Summary:             "List alert rules",
+		Description:         "This endpoint lists all alert rules with their current evaluation state",
+		Response:            make([]*ruletypes.Rule, 0),
+		ResponseContentType: "application/json",
+		SuccessStatusCode:   http.StatusOK,
+		SecuritySchemes:     newSecuritySchemes(types.RoleViewer),
+	})).Methods(http.MethodGet).GetError(); err != nil {
+		return err
+	}
+
+	if err := router.Handle("/api/v2/rules/{id}", handler.New(provider.authZ.ViewAccess(provider.rulerHandler.GetRuleByID), handler.OpenAPIDef{
+		ID:                  "GetRuleByID",
+		Tags:                []string{"rules"},
+		Summary:             "Get alert rule by ID",
+		Description:         "This endpoint returns an alert rule by ID",
+		Response:            new(ruletypes.Rule),
+		ResponseContentType: "application/json",
+		SuccessStatusCode:   http.StatusOK,
+		ErrorStatusCodes:    []int{http.StatusNotFound},
+		SecuritySchemes:     newSecuritySchemes(types.RoleViewer),
+	})).Methods(http.MethodGet).GetError(); err != nil {
+		return err
+	}
+
+	if err := router.Handle("/api/v2/rules", handler.New(provider.authZ.EditAccess(provider.rulerHandler.CreateRule), handler.OpenAPIDef{
+		ID:                  "CreateRule",
+		Tags:                []string{"rules"},
+		Summary:             "Create alert rule",
+		Description:         "This endpoint creates a new alert rule",
+		Request:             new(ruletypes.PostableRule),
+		RequestContentType:  "application/json",
+		Response:            new(ruletypes.Rule),
+		ResponseContentType: "application/json",
+		SuccessStatusCode:   http.StatusCreated,
+		ErrorStatusCodes:    []int{http.StatusBadRequest},
+		SecuritySchemes:     newSecuritySchemes(types.RoleEditor),
+	})).Methods(http.MethodPost).GetError(); err != nil {
+		return err
+	}
+
+	if err := router.Handle("/api/v2/rules/{id}", handler.New(provider.authZ.EditAccess(provider.rulerHandler.UpdateRuleByID), handler.OpenAPIDef{
+		ID:                  "UpdateRuleByID",
+		Tags:                []string{"rules"},
+		Summary:             "Update alert rule",
+		Description:         "This endpoint updates an alert rule by ID",
+		Request:             new(ruletypes.PostableRule),
+		RequestContentType:  "application/json",
+		SuccessStatusCode:   http.StatusNoContent,
+		ErrorStatusCodes:    []int{http.StatusBadRequest, http.StatusNotFound},
+		SecuritySchemes:     newSecuritySchemes(types.RoleEditor),
+	})).Methods(http.MethodPut).GetError(); err != nil {
+		return err
+	}
+
+	if err := router.Handle("/api/v2/rules/{id}", handler.New(provider.authZ.EditAccess(provider.rulerHandler.DeleteRuleByID), handler.OpenAPIDef{
+		ID:                  "DeleteRuleByID",
+		Tags:                []string{"rules"},
+		Summary:             "Delete alert rule",
+		Description:         "This endpoint deletes an alert rule by ID",
+		SuccessStatusCode:   http.StatusNoContent,
+		ErrorStatusCodes:    []int{http.StatusNotFound},
+		SecuritySchemes:     newSecuritySchemes(types.RoleEditor),
+	})).Methods(http.MethodDelete).GetError(); err != nil {
+		return err
+	}
+
+	if err := router.Handle("/api/v2/rules/{id}", handler.New(provider.authZ.EditAccess(provider.rulerHandler.PatchRuleByID), handler.OpenAPIDef{
+		ID:                  "PatchRuleByID",
+		Tags:                []string{"rules"},
+		Summary:             "Patch alert rule",
+		Description:         "This endpoint applies a partial update to an alert rule by ID",
+		Request:             new(ruletypes.PostableRule),
+		RequestContentType:  "application/json",
+		Response:            new(ruletypes.Rule),
+		ResponseContentType: "application/json",
+		SuccessStatusCode:   http.StatusOK,
+		ErrorStatusCodes:    []int{http.StatusBadRequest, http.StatusNotFound},
+		SecuritySchemes:     newSecuritySchemes(types.RoleEditor),
+	})).Methods(http.MethodPatch).GetError(); err != nil {
+		return err
+	}
+
+	if err := router.Handle("/api/v2/rules/test", handler.New(provider.authZ.EditAccess(provider.rulerHandler.TestRule), handler.OpenAPIDef{
+		ID:                  "TestRule",
+		Tags:                []string{"rules"},
+		Summary:             "Test alert rule",
+		Description:         "This endpoint fires a test notification for the given rule definition",
+		Request:             new(ruletypes.PostableRule),
+		RequestContentType:  "application/json",
+		Response:            new(ruletypes.GettableTestRule),
+		ResponseContentType: "application/json",
+		SuccessStatusCode:   http.StatusOK,
+		ErrorStatusCodes:    []int{http.StatusBadRequest},
+		SecuritySchemes:     newSecuritySchemes(types.RoleEditor),
+	})).Methods(http.MethodPost).GetError(); err != nil {
+		return err
+	}
+
+	if err := router.Handle("/api/v1/downtime_schedules", handler.New(provider.authZ.ViewAccess(provider.rulerHandler.ListDowntimeSchedules), handler.OpenAPIDef{
+		ID:                  "ListDowntimeSchedules",
+		Tags:                []string{"downtimeschedules"},
+		Summary:             "List downtime schedules",
+		Description:         "This endpoint lists all planned maintenance / downtime schedules",
+		RequestQuery:        new(ruletypes.ListPlannedMaintenanceParams),
+		Response:            make([]*ruletypes.PlannedMaintenance, 0),
+		ResponseContentType: "application/json",
+		SuccessStatusCode:   http.StatusOK,
+		SecuritySchemes:     newSecuritySchemes(types.RoleViewer),
+	})).Methods(http.MethodGet).GetError(); err != nil {
+		return err
+	}
+
+	if err := router.Handle("/api/v1/downtime_schedules/{id}", handler.New(provider.authZ.ViewAccess(provider.rulerHandler.GetDowntimeScheduleByID), handler.OpenAPIDef{
+		ID:                  "GetDowntimeScheduleByID",
+		Tags:                []string{"downtimeschedules"},
+		Summary:             "Get downtime schedule by ID",
+		Description:         "This endpoint returns a downtime schedule by ID",
+		Response:            new(ruletypes.PlannedMaintenance),
+		ResponseContentType: "application/json",
+		SuccessStatusCode:   http.StatusOK,
+		ErrorStatusCodes:    []int{http.StatusNotFound},
+		SecuritySchemes:     newSecuritySchemes(types.RoleViewer),
+	})).Methods(http.MethodGet).GetError(); err != nil {
+		return err
+	}
+
+	if err := router.Handle("/api/v1/downtime_schedules", handler.New(provider.authZ.EditAccess(provider.rulerHandler.CreateDowntimeSchedule), handler.OpenAPIDef{
+		ID:                  "CreateDowntimeSchedule",
+		Tags:                []string{"downtimeschedules"},
+		Summary:             "Create downtime schedule",
+		Description:         "This endpoint creates a new planned maintenance / downtime schedule",
+		Request:             new(ruletypes.PostablePlannedMaintenance),
+		RequestContentType:  "application/json",
+		Response:            new(ruletypes.PlannedMaintenance),
+		ResponseContentType: "application/json",
+		SuccessStatusCode:   http.StatusCreated,
+		ErrorStatusCodes:    []int{http.StatusBadRequest},
+		SecuritySchemes:     newSecuritySchemes(types.RoleEditor),
+	})).Methods(http.MethodPost).GetError(); err != nil {
+		return err
+	}
+
+	if err := router.Handle("/api/v1/downtime_schedules/{id}", handler.New(provider.authZ.EditAccess(provider.rulerHandler.UpdateDowntimeScheduleByID), handler.OpenAPIDef{
+		ID:                  "UpdateDowntimeScheduleByID",
+		Tags:                []string{"downtimeschedules"},
+		Summary:             "Update downtime schedule",
+		Description:         "This endpoint updates a downtime schedule by ID",
+		Request:             new(ruletypes.PostablePlannedMaintenance),
+		RequestContentType:  "application/json",
+		SuccessStatusCode:   http.StatusNoContent,
+		ErrorStatusCodes:    []int{http.StatusBadRequest, http.StatusNotFound},
+		SecuritySchemes:     newSecuritySchemes(types.RoleEditor),
+	})).Methods(http.MethodPut).GetError(); err != nil {
+		return err
+	}
+
+	if err := router.Handle("/api/v1/downtime_schedules/{id}", handler.New(provider.authZ.EditAccess(provider.rulerHandler.DeleteDowntimeScheduleByID), handler.OpenAPIDef{
+		ID:                  "DeleteDowntimeScheduleByID",
+		Tags:                []string{"downtimeschedules"},
+		Summary:             "Delete downtime schedule",
+		Description:         "This endpoint deletes a downtime schedule by ID",
+		SuccessStatusCode:   http.StatusNoContent,
+		ErrorStatusCodes:    []int{http.StatusNotFound},
+		SecuritySchemes:     newSecuritySchemes(types.RoleEditor),
+	})).Methods(http.MethodDelete).GetError(); err != nil {
+		return err
+	}
+
+	return nil
+}

pkg/global/config.go

@@ -2,6 +2,8 @@ package global
 
 import (
 	"net/url"
+	"path"
+	"strings"
 
 	"github.com/SigNoz/signoz/pkg/errors"
 
@@ -37,5 +39,34 @@ func newConfig() factory.Config {
 }
 
 func (c Config) Validate() error {
+	if c.ExternalURL != nil {
+		if c.ExternalURL.Path != "" && c.ExternalURL.Path != "/" {
+			if !strings.HasPrefix(c.ExternalURL.Path, "/") {
+				return errors.NewInvalidInputf(ErrCodeInvalidGlobalConfig, "global::external_url path must start with '/', got %q", c.ExternalURL.Path)
+			}
+		}
+	}
+
 	return nil
 }
+
+func (c Config) ExternalPath() string {
+	if c.ExternalURL == nil || c.ExternalURL.Path == "" || c.ExternalURL.Path == "/" {
+		return ""
+	}
+
+	p := path.Clean("/" + c.ExternalURL.Path)
+	if p == "/" {
+		return ""
+	}
+
+	return p
+}
+
+func (c Config) ExternalPathTrailing() string {
+	if p := c.ExternalPath(); p != "" {
+		return p + "/"
+	}
+
+	return "/"
+}

pkg/global/config_test.go

@@ -0,0 +1,139 @@
+package global
+
+import (
+	"net/url"
+	"testing"
+
+	"github.com/stretchr/testify/assert"
+)
+
+func TestExternalPath(t *testing.T) {
+	testCases := []struct {
+		name     string
+		config   Config
+		expected string
+	}{
+		{
+			name:     "NilURL",
+			config:   Config{ExternalURL: nil},
+			expected: "",
+		},
+		{
+			name:     "EmptyPath",
+			config:   Config{ExternalURL: &url.URL{Scheme: "https", Host: "example.com", Path: ""}},
+			expected: "",
+		},
+		{
+			name:     "RootPath",
+			config:   Config{ExternalURL: &url.URL{Scheme: "https", Host: "example.com", Path: "/"}},
+			expected: "",
+		},
+		{
+			name:     "SingleSegment",
+			config:   Config{ExternalURL: &url.URL{Scheme: "https", Host: "example.com", Path: "/signoz"}},
+			expected: "/signoz",
+		},
+		{
+			name:     "TrailingSlash",
+			config:   Config{ExternalURL: &url.URL{Scheme: "https", Host: "example.com", Path: "/signoz/"}},
+			expected: "/signoz",
+		},
+		{
+			name:     "MultiSegment",
+			config:   Config{ExternalURL: &url.URL{Scheme: "https", Host: "example.com", Path: "/a/b/c"}},
+			expected: "/a/b/c",
+		},
+	}
+
+	for _, tc := range testCases {
+		t.Run(tc.name, func(t *testing.T) {
+			assert.Equal(t, tc.expected, tc.config.ExternalPath())
+		})
+	}
+}
+
+func TestExternalPathTrailing(t *testing.T) {
+	testCases := []struct {
+		name     string
+		config   Config
+		expected string
+	}{
+		{
+			name:     "NilURL",
+			config:   Config{ExternalURL: nil},
+			expected: "/",
+		},
+		{
+			name:     "EmptyPath",
+			config:   Config{ExternalURL: &url.URL{Path: ""}},
+			expected: "/",
+		},
+		{
+			name:     "RootPath",
+			config:   Config{ExternalURL: &url.URL{Path: "/"}},
+			expected: "/",
+		},
+		{
+			name:     "SingleSegment",
+			config:   Config{ExternalURL: &url.URL{Path: "/signoz"}},
+			expected: "/signoz/",
+		},
+		{
+			name:     "MultiSegment",
+			config:   Config{ExternalURL: &url.URL{Path: "/a/b/c"}},
+			expected: "/a/b/c/",
+		},
+	}
+
+	for _, tc := range testCases {
+		t.Run(tc.name, func(t *testing.T) {
+			assert.Equal(t, tc.expected, tc.config.ExternalPathTrailing())
+		})
+	}
+}
+
+func TestValidate(t *testing.T) {
+	testCases := []struct {
+		name   string
+		config Config
+		fail   bool
+	}{
+		{
+			name:   "NilURL",
+			config: Config{ExternalURL: nil},
+			fail:   false,
+		},
+		{
+			name:   "EmptyPath",
+			config: Config{ExternalURL: &url.URL{Path: ""}},
+			fail:   false,
+		},
+		{
+			name:   "RootPath",
+			config: Config{ExternalURL: &url.URL{Path: "/"}},
+			fail:   false,
+		},
+		{
+			name:   "ValidPath",
+			config: Config{ExternalURL: &url.URL{Path: "/signoz"}},
+			fail:   false,
+		},
+		{
+			name:   "NoLeadingSlash",
+			config: Config{ExternalURL: &url.URL{Path: "signoz"}},
+			fail:   true,
+		},
+	}
+
+	for _, tc := range testCases {
+		t.Run(tc.name, func(t *testing.T) {
+			err := tc.config.Validate()
+			if tc.fail {
+				assert.Error(t, err)
+				return
+			}
+
+			assert.NoError(t, err)
+		})
+	}
+}

pkg/query-service/app/clickhouseReader/reader.go

@@ -947,6 +947,7 @@ func (r *ClickHouseReader) GetWaterfallSpansForTraceWithMetadata(ctx context.Con
 			return response, nil
 		}
 		totalSpans = uint64(len(searchScanResponses))
+		processingBeforeCache := time.Now()
 		for _, item := range searchScanResponses {
 			ref := []model.OtelSpanRef{}
 			err := json.Unmarshal([]byte(item.References), &ref)
@@ -1069,9 +1070,23 @@ func (r *ClickHouseReader) GetWaterfallSpansForTraceWithMetadata(ctx context.Con
 
 		serviceNameToTotalDurationMap = tracedetail.CalculateServiceTime(serviceNameIntervalMap)
 
-		// TODO: set the span data (model.GetWaterfallSpansForTraceWithMetadataCache) in cache here
-		// removed existing cache usage since it was not getting used due to this bug https://github.com/SigNoz/engineering-pod/issues/4648
-		// and was causing out of memory issues https://github.com/SigNoz/engineering-pod/issues/4638
+		traceCache := model.GetWaterfallSpansForTraceWithMetadataCache{
+			StartTime:                     startTime,
+			EndTime:                       endTime,
+			DurationNano:                  durationNano,
+			TotalSpans:                    totalSpans,
+			TotalErrorSpans:               totalErrorSpans,
+			SpanIdToSpanNodeMap:           spanIdToSpanNodeMap,
+			ServiceNameToTotalDurationMap: serviceNameToTotalDurationMap,
+			TraceRoots:                    traceRoots,
+			HasMissingSpans:               hasMissingSpans,
+		}
+
+		r.logger.Info("getWaterfallSpansForTraceWithMetadata: processing pre cache", "duration", time.Since(processingBeforeCache), "traceID", traceID)
+		cacheErr := r.cacheForTraceDetail.Set(ctx, orgID, strings.Join([]string{"getWaterfallSpansForTraceWithMetadata", traceID}, "-"), &traceCache, time.Minute*5)
+		if cacheErr != nil {
+			r.logger.Debug("failed to store cache for getWaterfallSpansForTraceWithMetadata", "traceID", traceID, errorsV2.Attr(err))
+		}
 	}
 
 	processingPostCache := time.Now()
@@ -1162,6 +1177,7 @@ func (r *ClickHouseReader) GetFlamegraphSpansForTrace(ctx context.Context, orgID
 			return trace, nil
 		}
 
+		processingBeforeCache := time.Now()
 		for _, item := range searchScanResponses {
 			ref := []model.OtelSpanRef{}
 			err := json.Unmarshal([]byte(item.References), &ref)
@@ -1243,10 +1259,19 @@ func (r *ClickHouseReader) GetFlamegraphSpansForTrace(ctx context.Context, orgID
 		}
 
 		selectedSpans = tracedetail.GetAllSpansForFlamegraph(traceRoots, spanIdToSpanNodeMap)
+		traceCache := model.GetFlamegraphSpansForTraceCache{
+			StartTime:     startTime,
+			EndTime:       endTime,
+			DurationNano:  durationNano,
+			SelectedSpans: selectedSpans,
+			TraceRoots:    traceRoots,
+		}
 
-		// TODO: set the trace data (model.GetFlamegraphSpansForTraceCache) in cache here
-		// removed existing cache usage since it was not getting used due to this bug https://github.com/SigNoz/engineering-pod/issues/4648
-		// and was causing out of memory issues https://github.com/SigNoz/engineering-pod/issues/4638
+		r.logger.Info("getFlamegraphSpansForTrace: processing pre cache", "duration", time.Since(processingBeforeCache), "traceID", traceID)
+		cacheErr := r.cacheForTraceDetail.Set(ctx, orgID, strings.Join([]string{"getFlamegraphSpansForTrace", traceID}, "-"), &traceCache, time.Minute*5)
+		if cacheErr != nil {
+			r.logger.Debug("failed to store cache for getFlamegraphSpansForTrace", "traceID", traceID, errorsV2.Attr(err))
+		}
 	}
 
 	processingPostCache := time.Now()

pkg/query-service/app/http_handler.go

@@ -6,13 +6,13 @@ import (
 	"database/sql"
 	"encoding/json"
 	"fmt"
+	"io"
 
 	"github.com/SigNoz/signoz/pkg/errors"
 	"github.com/SigNoz/signoz/pkg/flagger"
 	"github.com/SigNoz/signoz/pkg/modules/thirdpartyapi"
 	"github.com/SigNoz/signoz/pkg/queryparser"
 
-	"io"
 	"log/slog"
 	"math"
 	"net/http"
@@ -78,7 +78,7 @@ import (
 	"github.com/SigNoz/signoz/pkg/query-service/app/logparsingpipeline"
 	"github.com/SigNoz/signoz/pkg/query-service/interfaces"
 	"github.com/SigNoz/signoz/pkg/query-service/model"
-	"github.com/SigNoz/signoz/pkg/query-service/rules"
+	"github.com/SigNoz/signoz/pkg/ruler"
 	"github.com/SigNoz/signoz/pkg/version"
 )
 
@@ -98,7 +98,7 @@ func NewRouter() *mux.Router {
 type APIHandler struct {
 	logger       *slog.Logger
 	reader       interfaces.Reader
-	ruleManager  *rules.Manager
+	ruleManager  ruler.Ruler
 	querier      interfaces.Querier
 	querierV2    interfaces.Querier
 	queryBuilder *queryBuilder.QueryBuilder
@@ -150,9 +150,6 @@ type APIHandlerOpts struct {
 	// business data reader e.g. clickhouse
 	Reader interfaces.Reader
 
-	// rule manager handles rule crud operations
-	RuleManager *rules.Manager
-
 	// Integrations
 	IntegrationsController *integrations.Controller
 
@@ -208,7 +205,7 @@ func NewAPIHandler(opts APIHandlerOpts, config signoz.Config) (*APIHandler, erro
 		logger:                        slog.Default(),
 		reader:                        opts.Reader,
 		temporalityMap:                make(map[string]map[v3.Temporality]bool),
-		ruleManager:                   opts.RuleManager,
+		ruleManager:                   opts.Signoz.Ruler,
 		IntegrationsController:        opts.IntegrationsController,
 		CloudIntegrationsController:   opts.CloudIntegrationsController,
 		LogsParsingPipelineController: opts.LogsParsingPipelineController,
@@ -508,12 +505,6 @@ func (aH *APIHandler) RegisterRoutes(router *mux.Router, am *middleware.AuthZ) {
 	router.HandleFunc("/api/v1/rules/{id}/history/top_contributors", am.ViewAccess(aH.getRuleStateHistoryTopContributors)).Methods(http.MethodPost)
 	router.HandleFunc("/api/v1/rules/{id}/history/overall_status", am.ViewAccess(aH.getOverallStateTransitions)).Methods(http.MethodPost)
 
-	router.HandleFunc("/api/v1/downtime_schedules", am.ViewAccess(aH.listDowntimeSchedules)).Methods(http.MethodGet)
-	router.HandleFunc("/api/v1/downtime_schedules/{id}", am.ViewAccess(aH.getDowntimeSchedule)).Methods(http.MethodGet)
-	router.HandleFunc("/api/v1/downtime_schedules", am.EditAccess(aH.createDowntimeSchedule)).Methods(http.MethodPost)
-	router.HandleFunc("/api/v1/downtime_schedules/{id}", am.EditAccess(aH.editDowntimeSchedule)).Methods(http.MethodPut)
-	router.HandleFunc("/api/v1/downtime_schedules/{id}", am.EditAccess(aH.deleteDowntimeSchedule)).Methods(http.MethodDelete)
-
 	router.HandleFunc("/api/v1/dashboards", am.ViewAccess(aH.List)).Methods(http.MethodGet)
 	router.HandleFunc("/api/v1/dashboards", am.EditAccess(aH.Signoz.Handlers.Dashboard.Create)).Methods(http.MethodPost)
 	router.HandleFunc("/api/v1/dashboards/{id}", am.ViewAccess(aH.Get)).Methods(http.MethodGet)
@@ -587,7 +578,6 @@ func (aH *APIHandler) RegisterRoutes(router *mux.Router, am *middleware.AuthZ) {
 	router.HandleFunc("/api/v1/query_filter/analyze", am.ViewAccess(aH.QueryParserAPI.AnalyzeQueryFilter)).Methods(http.MethodPost)
 }
 
-
 func Intersection(a, b []int) (c []int) {
 	m := make(map[int]bool)
 
@@ -603,26 +593,6 @@ func Intersection(a, b []int) (c []int) {
 	return
 }
 
-func (aH *APIHandler) getRule(w http.ResponseWriter, r *http.Request) {
-	idStr := mux.Vars(r)["id"]
-	id, err := valuer.NewUUID(idStr)
-	if err != nil {
-		RespondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: err}, nil)
-		return
-	}
-
-	ruleResponse, err := aH.ruleManager.GetRule(r.Context(), id)
-	if err != nil {
-		if errors.Is(err, sql.ErrNoRows) {
-			RespondError(w, &model.ApiError{Typ: model.ErrorNotFound, Err: fmt.Errorf("rule not found")}, nil)
-			return
-		}
-		RespondError(w, &model.ApiError{Typ: model.ErrorInternal, Err: err}, nil)
-		return
-	}
-	aH.Respond(w, ruleResponse)
-}
-
 // populateTemporality adds the temporality to the query if it is not present
 func (aH *APIHandler) PopulateTemporality(ctx context.Context, orgID valuer.UUID, qp *v3.QueryRangeParamsV3) error {
 
@@ -678,127 +648,164 @@ func (aH *APIHandler) PopulateTemporality(ctx context.Context, orgID valuer.UUID
 	return nil
 }
 
-func (aH *APIHandler) listDowntimeSchedules(w http.ResponseWriter, r *http.Request) {
-	claims, errv2 := authtypes.ClaimsFromContext(r.Context())
-	if errv2 != nil {
-		render.Error(w, errv2)
-		return
-	}
+func (aH *APIHandler) listRules(w http.ResponseWriter, r *http.Request) {
 
-	schedules, err := aH.ruleManager.MaintenanceStore().GetAllPlannedMaintenance(r.Context(), claims.OrgID)
+	rules, err := aH.ruleManager.ListRuleStates(r.Context())
 	if err != nil {
-		render.Error(w, err)
+		RespondError(w, &model.ApiError{Typ: model.ErrorInternal, Err: err}, nil)
 		return
 	}
 
-	// The schedules are stored as JSON in the database, so we need to filter them here
-	// Since the number of schedules is expected to be small, this should be fine
+	// todo(amol): need to add sorter
 
-	if r.URL.Query().Get("active") != "" {
-		activeSchedules := make([]*ruletypes.GettablePlannedMaintenance, 0)
-		active, _ := strconv.ParseBool(r.URL.Query().Get("active"))
-		for _, schedule := range schedules {
-			now := time.Now().In(time.FixedZone(schedule.Schedule.Timezone, 0))
-			if schedule.IsActive(now) == active {
-				activeSchedules = append(activeSchedules, schedule)
-			}
-		}
-		schedules = activeSchedules
-	}
-
-	if r.URL.Query().Get("recurring") != "" {
-		recurringSchedules := make([]*ruletypes.GettablePlannedMaintenance, 0)
-		recurring, _ := strconv.ParseBool(r.URL.Query().Get("recurring"))
-		for _, schedule := range schedules {
-			if schedule.IsRecurring() == recurring {
-				recurringSchedules = append(recurringSchedules, schedule)
-			}
-		}
-		schedules = recurringSchedules
-	}
-
-	aH.Respond(w, schedules)
+	aH.Respond(w, rules)
 }
 
-func (aH *APIHandler) getDowntimeSchedule(w http.ResponseWriter, r *http.Request) {
+func (aH *APIHandler) getRule(w http.ResponseWriter, r *http.Request) {
 	idStr := mux.Vars(r)["id"]
 	id, err := valuer.NewUUID(idStr)
-	if err != nil {
-		render.Error(w, errorsV2.New(errorsV2.TypeInvalidInput, errorsV2.CodeInvalidInput, err.Error()))
-		return
-	}
-
-	schedule, err := aH.ruleManager.MaintenanceStore().GetPlannedMaintenanceByID(r.Context(), id)
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-	aH.Respond(w, schedule)
-}
-
-func (aH *APIHandler) createDowntimeSchedule(w http.ResponseWriter, r *http.Request) {
-	var schedule ruletypes.GettablePlannedMaintenance
-	err := json.NewDecoder(r.Body).Decode(&schedule)
 	if err != nil {
 		RespondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: err}, nil)
 		return
 	}
-	if err := schedule.Validate(); err != nil {
-		render.Error(w, err)
-		return
-	}
 
-	_, err = aH.ruleManager.MaintenanceStore().CreatePlannedMaintenance(r.Context(), schedule)
+	ruleResponse, err := aH.ruleManager.GetRule(r.Context(), id)
 	if err != nil {
-		render.Error(w, err)
+		if errors.Is(err, sql.ErrNoRows) {
+			RespondError(w, &model.ApiError{Typ: model.ErrorNotFound, Err: fmt.Errorf("rule not found")}, nil)
+			return
+		}
+		RespondError(w, &model.ApiError{Typ: model.ErrorInternal, Err: err}, nil)
 		return
 	}
-	aH.Respond(w, nil)
+	aH.Respond(w, ruleResponse)
 }
 
-func (aH *APIHandler) editDowntimeSchedule(w http.ResponseWriter, r *http.Request) {
+func (aH *APIHandler) createRule(w http.ResponseWriter, r *http.Request) {
+	defer r.Body.Close()
+	body, err := io.ReadAll(r.Body)
+	if err != nil {
+		aH.logger.ErrorContext(r.Context(), "error reading request body for create rule", errors.Attr(err))
+		RespondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: err}, nil)
+		return
+	}
+
+	rule, err := aH.ruleManager.CreateRule(r.Context(), string(body))
+	if err != nil {
+		RespondError(w, toApiError(err), nil)
+		return
+	}
+
+	aH.Respond(w, rule)
+}
+
+func (aH *APIHandler) editRule(w http.ResponseWriter, r *http.Request) {
 	idStr := mux.Vars(r)["id"]
 	id, err := valuer.NewUUID(idStr)
 	if err != nil {
-		render.Error(w, errorsV2.New(errorsV2.TypeInvalidInput, errorsV2.CodeInvalidInput, err.Error()))
+		RespondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: err}, nil)
 		return
 	}
 
-	var schedule ruletypes.GettablePlannedMaintenance
-	err = json.NewDecoder(r.Body).Decode(&schedule)
+	defer r.Body.Close()
+	body, err := io.ReadAll(r.Body)
 	if err != nil {
-		render.Error(w, err)
-		return
-	}
-	if err := schedule.Validate(); err != nil {
-		render.Error(w, err)
+		aH.logger.ErrorContext(r.Context(), "error reading request body for edit rule", errors.Attr(err))
+		RespondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: err}, nil)
 		return
 	}
 
-	err = aH.ruleManager.MaintenanceStore().EditPlannedMaintenance(r.Context(), schedule, id)
+	err = aH.ruleManager.EditRule(r.Context(), string(body), id)
 	if err != nil {
-		render.Error(w, err)
+		if errors.Is(err, sql.ErrNoRows) {
+			RespondError(w, &model.ApiError{Typ: model.ErrorNotFound, Err: fmt.Errorf("rule not found")}, nil)
+			return
+		}
+		RespondError(w, toApiError(err), nil)
 		return
 	}
 
-	aH.Respond(w, nil)
+	aH.Respond(w, "rule successfully edited")
 }
 
-func (aH *APIHandler) deleteDowntimeSchedule(w http.ResponseWriter, r *http.Request) {
+func (aH *APIHandler) deleteRule(w http.ResponseWriter, r *http.Request) {
+	id := mux.Vars(r)["id"]
+
+	err := aH.ruleManager.DeleteRule(r.Context(), id)
+	if err != nil {
+		if errors.Is(err, sql.ErrNoRows) {
+			RespondError(w, &model.ApiError{Typ: model.ErrorNotFound, Err: fmt.Errorf("rule not found")}, nil)
+			return
+		}
+		RespondError(w, toApiError(err), nil)
+		return
+	}
+
+	aH.Respond(w, "rule successfully deleted")
+}
+
+func (aH *APIHandler) patchRule(w http.ResponseWriter, r *http.Request) {
 	idStr := mux.Vars(r)["id"]
 	id, err := valuer.NewUUID(idStr)
 	if err != nil {
-		render.Error(w, errorsV2.New(errorsV2.TypeInvalidInput, errorsV2.CodeInvalidInput, err.Error()))
+		RespondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: err}, nil)
 		return
 	}
 
-	err = aH.ruleManager.MaintenanceStore().DeletePlannedMaintenance(r.Context(), id)
+	defer r.Body.Close()
+	body, err := io.ReadAll(r.Body)
+	if err != nil {
+		aH.logger.ErrorContext(r.Context(), "error reading request body for patch rule", errors.Attr(err))
+		RespondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: err}, nil)
+		return
+	}
+
+	gettableRule, err := aH.ruleManager.PatchRule(r.Context(), string(body), id)
+	if err != nil {
+		if errors.Is(err, sql.ErrNoRows) {
+			RespondError(w, &model.ApiError{Typ: model.ErrorNotFound, Err: fmt.Errorf("rule not found")}, nil)
+			return
+		}
+		RespondError(w, toApiError(err), nil)
+		return
+	}
+
+	aH.Respond(w, gettableRule)
+}
+
+func (aH *APIHandler) testRule(w http.ResponseWriter, r *http.Request) {
+	claims, err := authtypes.ClaimsFromContext(r.Context())
 	if err != nil {
 		render.Error(w, err)
 		return
 	}
+	orgID, err := valuer.NewUUID(claims.OrgID)
+	if err != nil {
+		render.Error(w, err)
+		return
+	}
+	defer r.Body.Close()
+	body, err := io.ReadAll(r.Body)
+	if err != nil {
+		aH.logger.ErrorContext(r.Context(), "error reading request body for test rule", errors.Attr(err))
+		RespondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: err}, nil)
+		return
+	}
 
-	aH.Respond(w, nil)
+	ctx, cancel := context.WithTimeout(context.Background(), 1*time.Minute)
+	defer cancel()
+
+	alertCount, err := aH.ruleManager.TestNotification(ctx, orgID, string(body))
+	if err != nil {
+		RespondError(w, toApiError(err), nil)
+		return
+	}
+
+	response := map[string]interface{}{
+		"alertCount": alertCount,
+		"message":    "notification sent",
+	}
+	aH.Respond(w, response)
 }
 
 func (aH *APIHandler) getRuleStats(w http.ResponseWriter, r *http.Request) {
@@ -1012,19 +1019,6 @@ func (aH *APIHandler) getRuleStateHistoryTopContributors(w http.ResponseWriter,
 	aH.Respond(w, res)
 }
 
-func (aH *APIHandler) listRules(w http.ResponseWriter, r *http.Request) {
-
-	rules, err := aH.ruleManager.ListRuleStates(r.Context())
-	if err != nil {
-		RespondError(w, &model.ApiError{Typ: model.ErrorInternal, Err: err}, nil)
-		return
-	}
-
-	// todo(amol): need to add sorter
-
-	aH.Respond(w, rules)
-}
-
 func prepareQuery(r *http.Request) (string, error) {
 	var postData *model.DashboardVars
 
@@ -1226,142 +1220,6 @@ func (aH *APIHandler) queryDashboardVarsV2(w http.ResponseWriter, r *http.Reques
 	aH.Respond(w, dashboardVars)
 }
 
-func (aH *APIHandler) testRule(w http.ResponseWriter, r *http.Request) {
-	claims, err := authtypes.ClaimsFromContext(r.Context())
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-	orgID, err := valuer.NewUUID(claims.OrgID)
-	if err != nil {
-		render.Error(w, err)
-		return
-	}
-	defer r.Body.Close()
-	body, err := io.ReadAll(r.Body)
-	if err != nil {
-		aH.logger.ErrorContext(r.Context(), "error reading request body for test rule", errors.Attr(err))
-		RespondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: err}, nil)
-		return
-	}
-
-	ctx, cancel := context.WithTimeout(context.Background(), 1*time.Minute)
-	defer cancel()
-
-	alertCount, err := aH.ruleManager.TestNotification(ctx, orgID, string(body))
-	if err != nil {
-		RespondError(w, toApiError(err), nil)
-		return
-	}
-
-	response := map[string]interface{}{
-		"alertCount": alertCount,
-		"message":    "notification sent",
-	}
-	aH.Respond(w, response)
-}
-
-func (aH *APIHandler) deleteRule(w http.ResponseWriter, r *http.Request) {
-
-	id := mux.Vars(r)["id"]
-
-	err := aH.ruleManager.DeleteRule(r.Context(), id)
-
-	if err != nil {
-		if errors.Is(err, sql.ErrNoRows) {
-			RespondError(w, &model.ApiError{Typ: model.ErrorNotFound, Err: fmt.Errorf("rule not found")}, nil)
-			return
-		}
-		RespondError(w, toApiError(err), nil)
-		return
-	}
-
-	aH.Respond(w, "rule successfully deleted")
-
-}
-
-// patchRule updates only requested changes in the rule
-func (aH *APIHandler) patchRule(w http.ResponseWriter, r *http.Request) {
-	idStr := mux.Vars(r)["id"]
-	id, err := valuer.NewUUID(idStr)
-	if err != nil {
-		RespondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: err}, nil)
-		return
-	}
-
-	defer r.Body.Close()
-	body, err := io.ReadAll(r.Body)
-	if err != nil {
-		aH.logger.ErrorContext(r.Context(), "error reading request body for patch rule", errors.Attr(err))
-		RespondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: err}, nil)
-		return
-	}
-
-	gettableRule, err := aH.ruleManager.PatchRule(r.Context(), string(body), id)
-
-	if err != nil {
-		if errors.Is(err, sql.ErrNoRows) {
-			RespondError(w, &model.ApiError{Typ: model.ErrorNotFound, Err: fmt.Errorf("rule not found")}, nil)
-			return
-		}
-		RespondError(w, toApiError(err), nil)
-		return
-	}
-
-	aH.Respond(w, gettableRule)
-}
-
-func (aH *APIHandler) editRule(w http.ResponseWriter, r *http.Request) {
-	idStr := mux.Vars(r)["id"]
-	id, err := valuer.NewUUID(idStr)
-	if err != nil {
-		RespondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: err}, nil)
-		return
-	}
-
-	defer r.Body.Close()
-	body, err := io.ReadAll(r.Body)
-	if err != nil {
-		aH.logger.ErrorContext(r.Context(), "error reading request body for edit rule", errors.Attr(err))
-		RespondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: err}, nil)
-		return
-	}
-
-	err = aH.ruleManager.EditRule(r.Context(), string(body), id)
-
-	if err != nil {
-		if errors.Is(err, sql.ErrNoRows) {
-			RespondError(w, &model.ApiError{Typ: model.ErrorNotFound, Err: fmt.Errorf("rule not found")}, nil)
-			return
-		}
-		RespondError(w, toApiError(err), nil)
-		return
-	}
-
-	aH.Respond(w, "rule successfully edited")
-
-}
-
-func (aH *APIHandler) createRule(w http.ResponseWriter, r *http.Request) {
-
-	defer r.Body.Close()
-	body, err := io.ReadAll(r.Body)
-	if err != nil {
-		aH.logger.ErrorContext(r.Context(), "error reading request body for create rule", errors.Attr(err))
-		RespondError(w, &model.ApiError{Typ: model.ErrorBadData, Err: err}, nil)
-		return
-	}
-
-	rule, err := aH.ruleManager.CreateRule(r.Context(), string(body))
-	if err != nil {
-		RespondError(w, toApiError(err), nil)
-		return
-	}
-
-	aH.Respond(w, rule)
-
-}
-
 func (aH *APIHandler) queryRangeMetrics(w http.ResponseWriter, r *http.Request) {
 
 	query, apiErrorObj := parseQueryRangeRequest(r)