fix(dashboard): drop PromQL from scatter plot query types

Panel kinds declare which builder fields to keep equal across queries. A query
added or switched to another signal takes the others' values, since a signal
switch reloads its own.

cmd/authz.go

@@ -104,7 +104,6 @@ func runGenerateAuthz(_ context.Context) error {
 		coretypes.NewResourceRef(coretypes.ResourceTelemetryResourceMetrics).String():      true,
 		coretypes.NewResourceRef(coretypes.ResourceTelemetryResourceMeterMetrics).String(): true,
 		coretypes.NewResourceRef(coretypes.ResourceMetaResourceQuickFilter).String():       true,
-		coretypes.NewResourceRef(coretypes.ResourceMetaResourceSavedView).String():         true,
 	}
 
 	allowedTypes := map[string]bool{}

docs/api/openapi.yml

@@ -3702,6 +3702,13 @@ components:
           nullable: true
           type: number
       type: object
+    DashboardtypesAxisScale:
+      enum:
+      - auto
+      - linear
+      - log
+      - symlog
+      type: string
     DashboardtypesBarChartPanelSpec:
       properties:
         axes:
@@ -4444,6 +4451,7 @@ components:
           signoz/ListPanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesListPanelSpec'
           signoz/NumberPanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesNumberPanelSpec'
           signoz/PieChartPanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesPieChartPanelSpec'
+          signoz/ScatterPlotPanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesScatterPlotPanelSpec'
           signoz/TablePanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTablePanelSpec'
           signoz/TextPanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTextPanelSpec'
           signoz/TimeSeriesPanel: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTimeSeriesPanelSpec'
@@ -4459,6 +4467,7 @@ components:
       - $ref: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesListPanelSpec'
       - $ref: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTextPanelSpec'
       - $ref: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHeatmapPanelSpec'
+      - $ref: '#/components/schemas/DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesScatterPlotPanelSpec'
       type: object
     DashboardtypesPanelPluginKind:
       enum:
@@ -4472,6 +4481,7 @@ components:
       - signoz/ListPanel
       - signoz/TextPanel
       - signoz/HeatmapPanel
+      - signoz/ScatterPlotPanel
       type: string
     DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesAreaChartPanelSpec:
       properties:
@@ -4557,6 +4567,18 @@ components:
       - kind
       - spec
       type: object
+    DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesScatterPlotPanelSpec:
+      properties:
+        kind:
+          enum:
+          - signoz/ScatterPlotPanel
+          type: string
+        spec:
+          $ref: '#/components/schemas/DashboardtypesScatterPlotPanelSpec'
+      required:
+      - kind
+      - spec
+      type: object
     DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTablePanelSpec:
       properties:
         kind:
@@ -4636,6 +4658,16 @@ components:
         visualization:
           $ref: '#/components/schemas/DashboardtypesBasicVisualization'
       type: object
+    DashboardtypesPointDiameter:
+      maximum: 40
+      minimum: 2
+      nullable: true
+      type: integer
+    DashboardtypesPointOpacity:
+      maximum: 1
+      minimum: 0.1
+      nullable: true
+      type: number
     DashboardtypesPostableDashboardV2:
       properties:
         generateName:
@@ -4824,6 +4856,104 @@ components:
       required:
       - queryValue
       type: object
+    DashboardtypesScatterPlotAxes:
+      properties:
+        x:
+          $ref: '#/components/schemas/DashboardtypesScatterPlotAxis'
+        "y":
+          $ref: '#/components/schemas/DashboardtypesScatterPlotAxis'
+      type: object
+    DashboardtypesScatterPlotAxis:
+      properties:
+        label:
+          description: Axis title. Empty draws none.
+          type: string
+        scale:
+          $ref: '#/components/schemas/DashboardtypesAxisScale'
+        softMax:
+          nullable: true
+          type: number
+        softMin:
+          nullable: true
+          type: number
+      type: object
+    DashboardtypesScatterPlotChartAppearance:
+      properties:
+        points:
+          $ref: '#/components/schemas/DashboardtypesScatterPlotPoints'
+      type: object
+    DashboardtypesScatterPlotDimensions:
+      properties:
+        colorBy:
+          description: Group-by label names (e.g. k8s.namespace.name) whose combined
+            values colour dots and drive the legend. Empty colours by every group-by
+            label.
+          items:
+            type: string
+          nullable: true
+          type: array
+        sizeBy:
+          description: Value column key that scales dot size. Empty draws every dot
+            at the default size.
+          type: string
+        x:
+          description: Value column key (queryName, or queryName.expression for a
+            multi-aggregation query) plotted on the x axis. Empty uses the first value
+            column.
+          type: string
+        "y":
+          description: Value column key plotted on the y axis. Empty uses the second
+            value column.
+          type: string
+      type: object
+    DashboardtypesScatterPlotPanelSpec:
+      properties:
+        axes:
+          $ref: '#/components/schemas/DashboardtypesScatterPlotAxes'
+        chartAppearance:
+          $ref: '#/components/schemas/DashboardtypesScatterPlotChartAppearance'
+        dimensions:
+          $ref: '#/components/schemas/DashboardtypesScatterPlotDimensions'
+        formatting:
+          $ref: '#/components/schemas/DashboardtypesTableFormatting'
+        legend:
+          $ref: '#/components/schemas/DashboardtypesLegend'
+        thresholds:
+          items:
+            $ref: '#/components/schemas/DashboardtypesScatterPlotThreshold'
+          nullable: true
+          type: array
+        visualization:
+          $ref: '#/components/schemas/DashboardtypesBasicVisualization'
+      type: object
+    DashboardtypesScatterPlotPoints:
+      properties:
+        maxSize:
+          $ref: '#/components/schemas/DashboardtypesPointDiameter'
+        minSize:
+          $ref: '#/components/schemas/DashboardtypesPointDiameter'
+        opacity:
+          $ref: '#/components/schemas/DashboardtypesPointOpacity'
+        size:
+          $ref: '#/components/schemas/DashboardtypesPointDiameter'
+      type: object
+    DashboardtypesScatterPlotThreshold:
+      properties:
+        axis:
+          $ref: '#/components/schemas/DashboardtypesThresholdAxis'
+        color:
+          type: string
+        label:
+          type: string
+        unit:
+          type: string
+        value:
+          format: double
+          type: number
+      required:
+      - value
+      - color
+      type: object
     DashboardtypesSource:
       enum:
       - user
@@ -4937,6 +5067,11 @@ components:
       - value
       - name
       type: object
+    DashboardtypesThresholdAxis:
+      enum:
+      - x
+      - "y"
+      type: string
     DashboardtypesThresholdFormat:
       enum:
       - text
@@ -8046,31 +8181,6 @@ components:
       - metric
       - value
       type: object
-    PromotetypesIndexMaterializedPathsResult:
-      properties:
-        indexed:
-          items:
-            $ref: '#/components/schemas/PromotetypesPromotePath'
-          nullable: true
-          type: array
-        skipped:
-          items:
-            $ref: '#/components/schemas/PromotetypesPromotePath'
-          nullable: true
-          type: array
-      required:
-      - indexed
-      - skipped
-      type: object
-    PromotetypesPostableIndexMaterializedPaths:
-      properties:
-        dryRun:
-          type: boolean
-        signal:
-          type: string
-      required:
-      - signal
-      type: object
     PromotetypesPromotePath:
       properties:
         context:
@@ -14097,67 +14207,6 @@ paths:
       tags:
       - promote
       x-signoz-stability: alpha
-  /api/v1/promoted_paths/materialized:
-    post:
-      deprecated: false
-      description: This endpoint indexes the JSON sub-columns of materialized paths
-        whose columns are indexed and returns the indexed and skipped paths.
-      operationId: IndexMaterializedPaths
-      requestBody:
-        content:
-          application/json:
-            schema:
-              $ref: '#/components/schemas/PromotetypesPostableIndexMaterializedPaths'
-      responses:
-        "200":
-          content:
-            application/json:
-              schema:
-                properties:
-                  data:
-                    $ref: '#/components/schemas/PromotetypesIndexMaterializedPathsResult'
-                  status:
-                    type: string
-                required:
-                - status
-                - data
-                type: object
-          description: OK
-        "400":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Bad Request
-        "401":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Unauthorized
-        "403":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Forbidden
-        "500":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Internal Server Error
-      security:
-      - api_key:
-        - logs-field:update
-        - traces-field:update
-      - tokenizer:
-        - logs-field:update
-        - traces-field:update
-      summary: Index materialized paths
-      tags:
-      - promote
-      x-signoz-stability: alpha
   /api/v1/roles:
     get:
       deprecated: false
@@ -16150,8 +16199,10 @@ paths:
                 $ref: '#/components/schemas/RenderErrorResponse'
           description: Internal Server Error
       security:
-      - api_key: []
-      - tokenizer: []
+      - api_key:
+        - VIEWER
+      - tokenizer:
+        - VIEWER
       summary: Get stats
       tags:
       - stats
@@ -19000,9 +19051,9 @@ paths:
           description: Internal Server Error
       security:
       - api_key:
-        - metrics:read
+        - VIEWER
       - tokenizer:
-        - metrics:read
+        - VIEWER
       summary: Run Infra Monitoring Setup Checks
       tags:
       - inframonitoring
@@ -19074,9 +19125,9 @@ paths:
           description: Internal Server Error
       security:
       - api_key:
-        - metrics:read
+        - VIEWER
       - tokenizer:
-        - metrics:read
+        - VIEWER
       summary: List Clusters for Infra Monitoring
       tags:
       - inframonitoring
@@ -19158,9 +19209,9 @@ paths:
           description: Internal Server Error
       security:
       - api_key:
-        - metrics:read
+        - VIEWER
       - tokenizer:
-        - metrics:read
+        - VIEWER
       summary: List DaemonSets for Infra Monitoring
       tags:
       - inframonitoring
@@ -19236,9 +19287,9 @@ paths:
           description: Internal Server Error
       security:
       - api_key:
-        - metrics:read
+        - VIEWER
       - tokenizer:
-        - metrics:read
+        - VIEWER
       summary: List Deployments for Infra Monitoring
       tags:
       - inframonitoring
@@ -19304,9 +19355,9 @@ paths:
           description: Internal Server Error
       security:
       - api_key:
-        - metrics:read
+        - VIEWER
       - tokenizer:
-        - metrics:read
+        - VIEWER
       summary: List Hosts for Infra Monitoring
       tags:
       - inframonitoring
@@ -19386,9 +19437,9 @@ paths:
           description: Internal Server Error
       security:
       - api_key:
-        - metrics:read
+        - VIEWER
       - tokenizer:
-        - metrics:read
+        - VIEWER
       summary: List Jobs for Infra Monitoring
       tags:
       - inframonitoring
@@ -19467,9 +19518,9 @@ paths:
           description: Internal Server Error
       security:
       - api_key:
-        - metrics:read
+        - VIEWER
       - tokenizer:
-        - metrics:read
+        - VIEWER
       summary: List Kubernetes Containers for Infra Monitoring
       tags:
       - inframonitoring
@@ -19538,9 +19589,9 @@ paths:
           description: Internal Server Error
       security:
       - api_key:
-        - metrics:read
+        - VIEWER
       - tokenizer:
-        - metrics:read
+        - VIEWER
       summary: List Namespaces for Infra Monitoring
       tags:
       - inframonitoring
@@ -19613,9 +19664,9 @@ paths:
           description: Internal Server Error
       security:
       - api_key:
-        - metrics:read
+        - VIEWER
       - tokenizer:
-        - metrics:read
+        - VIEWER
       summary: List Nodes for Infra Monitoring
       tags:
       - inframonitoring
@@ -19689,9 +19740,9 @@ paths:
           description: Internal Server Error
       security:
       - api_key:
-        - metrics:read
+        - VIEWER
       - tokenizer:
-        - metrics:read
+        - VIEWER
       summary: List Pods for Infra Monitoring
       tags:
       - inframonitoring
@@ -19760,9 +19811,9 @@ paths:
           description: Internal Server Error
       security:
       - api_key:
-        - metrics:read
+        - VIEWER
       - tokenizer:
-        - metrics:read
+        - VIEWER
       summary: List Volumes for Infra Monitoring
       tags:
       - inframonitoring
@@ -19838,9 +19889,9 @@ paths:
           description: Internal Server Error
       security:
       - api_key:
-        - metrics:read
+        - VIEWER
       - tokenizer:
-        - metrics:read
+        - VIEWER
       summary: List StatefulSets for Infra Monitoring
       tags:
       - inframonitoring
@@ -25008,75 +25059,6 @@ paths:
       tags:
       - rules
       x-signoz-stability: alpha
-  /api/v2/rules/{id}/clone:
-    post:
-      deprecated: false
-      description: This endpoint creates a new alert rule from the stored definition
-        of an existing one. The clone keeps every modeled field of the source, including
-        its enabled/disabled state, and gets the source's name suffixed with " - Copy"
-        (or a bumped " - Copy (n)" counter when the source is itself a copy). The
-        clone is owned by the caller.
-      operationId: CloneRuleByID
-      parameters:
-      - in: path
-        name: id
-        required: true
-        schema:
-          type: string
-      responses:
-        "201":
-          content:
-            application/json:
-              schema:
-                properties:
-                  data:
-                    $ref: '#/components/schemas/RuletypesRule'
-                  status:
-                    type: string
-                required:
-                - status
-                - data
-                type: object
-          description: Created
-        "400":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Bad Request
-        "401":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Unauthorized
-        "403":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Forbidden
-        "404":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Not Found
-        "500":
-          content:
-            application/json:
-              schema:
-                $ref: '#/components/schemas/RenderErrorResponse'
-          description: Internal Server Error
-      security:
-      - api_key:
-        - EDITOR
-      - tokenizer:
-        - EDITOR
-      summary: Clone alert rule
-      tags:
-      - rules
-      x-signoz-stability: alpha
   /api/v2/rules/{id}/history/filter_keys:
     get:
       deprecated: false

ee/query-service/rules/anomaly.go

@@ -423,7 +423,7 @@ func (r *AnomalyRule) Eval(ctx context.Context, ts time.Time) (int, error) {
 func (r *AnomalyRule) String() string {
 
 	ar := ruletypes.PostableRule{
-		AlertName:         valuer.NewDisplayName(r.Name()),
+		AlertName:         r.Name(),
 		RuleCondition:     r.Condition(),
 		EvalWindow:        r.EvalWindow(),
 		Labels:            r.Labels().Map(),

ee/query-service/rules/anomaly_test.go

@@ -46,7 +46,7 @@ func TestAnomalyRule_NoData_AlertOnAbsent(t *testing.T) {
 	target := 500.0
 
 	postableRule := ruletypes.PostableRule{
-		AlertName: valuer.NewDisplayName("Test anomaly no data"),
+		AlertName: "Test anomaly no data",
 		AlertType: ruletypes.AlertTypeMetric,
 		RuleType:  ruletypes.RuleTypeAnomaly,
 		Evaluation: &ruletypes.EvaluationEnvelope{Kind: ruletypes.RollingEvaluation, Spec: ruletypes.RollingWindow{
@@ -149,7 +149,7 @@ func TestAnomalyRule_NoData_AbsentFor(t *testing.T) {
 	target := 500.0
 
 	postableRule := ruletypes.PostableRule{
-		AlertName: valuer.NewDisplayName("Test anomaly no data with AbsentFor"),
+		AlertName: "Test anomaly no data with AbsentFor",
 		AlertType: ruletypes.AlertTypeMetric,
 		RuleType:  ruletypes.RuleTypeAnomaly,
 		Evaluation: &ruletypes.EvaluationEnvelope{Kind: ruletypes.RollingEvaluation, Spec: ruletypes.RollingWindow{

ee/query-service/rules/manager.go

@@ -13,7 +13,6 @@ import (
 	"github.com/SigNoz/signoz/pkg/errors"
 	baserules "github.com/SigNoz/signoz/pkg/query-service/rules"
 	"github.com/SigNoz/signoz/pkg/types/ruletypes"
-	"github.com/SigNoz/signoz/pkg/valuer"
 )
 
 func PrepareTaskFunc(opts baserules.PrepareTaskOptions) (baserules.Task, error) {
@@ -119,7 +118,7 @@ func TestNotification(opts baserules.PrepareTestRuleOptions) (int, error) {
 	}
 
 	parsedRule := opts.Rule
-	var alertname = parsedRule.AlertName.StringValue()
+	var alertname = parsedRule.AlertName
 	if alertname == "" {
 		// alertname is not mandatory for testing, so picking
 		// a random string here
@@ -127,7 +126,7 @@ func TestNotification(opts baserules.PrepareTestRuleOptions) (int, error) {
 	}
 
 	// append name to indicate this is test alert
-	parsedRule.AlertName = valuer.NewDisplayName(fmt.Sprintf("%s%s", alertname, ruletypes.TestAlertPostFix))
+	parsedRule.AlertName = fmt.Sprintf("%s%s", alertname, ruletypes.TestAlertPostFix)
 
 	var rule baserules.Rule
 	var err error

frontend/__mocks__/uplotMock.ts

@@ -57,6 +57,7 @@ const mockPaths = {
 const mockTzDate = jest.fn(
 	(date: Date, _timezone: string) => new Date(date.getTime()),
 );
+const mockOrient = jest.fn();
 
 // Mock uPlot constructor - this needs to be a proper constructor function
 function MockUPlot(
@@ -70,6 +71,7 @@ function MockUPlot(
 // Add static methods to the constructor
 MockUPlot.tzDate = mockTzDate;
 MockUPlot.paths = mockPaths;
+MockUPlot.orient = mockOrient;
 // Pinned so canvas-space maths in draw hooks is deterministic under jsdom.
 MockUPlot.pxRatio = 1;
 

frontend/src/api/__tests__/ErrorResponseHandler.test.ts

@@ -9,14 +9,12 @@ describe('ErrorResponseHandler', () => {
 			.spyOn(console, 'error')
 			.mockImplementation(() => undefined);
 
-		expect(ErrorResponseHandler(new CanceledError() as AxiosError)).toStrictEqual(
-			{
-				statusCode: 500,
-				payload: null,
-				error: 'Something went wrong',
-				message: null,
-			},
-		);
+		expect(ErrorResponseHandler(new CanceledError() as AxiosError)).toEqual({
+			statusCode: 500,
+			payload: null,
+			error: 'Something went wrong',
+			message: null,
+		});
 		expect(consoleError).not.toHaveBeenCalled();
 
 		consoleError.mockRestore();

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

@@ -18,10 +18,8 @@ import type {
 } from 'react-query';
 
 import type {
-	IndexMaterializedPaths200,
 	ListPromotedPaths200,
 	ListPromotedPathsParams,
-	PromotetypesPostableIndexMaterializedPathsDTO,
 	PromotetypesPromotePathDTO,
 	RenderErrorResponseDTO,
 } from '../sigNoz.schemas';
@@ -232,87 +230,3 @@ export const usePromotePaths = <
 > => {
 	return useMutation(getPromotePathsMutationOptions(options));
 };
-/**
- * This endpoint indexes the JSON sub-columns of materialized paths whose columns are indexed and returns the indexed and skipped paths.
- * @summary Index materialized paths
- */
-export const indexMaterializedPaths = (
-	promotetypesPostableIndexMaterializedPathsDTO?: BodyType<PromotetypesPostableIndexMaterializedPathsDTO>,
-	signal?: AbortSignal,
-) => {
-	return GeneratedAPIInstance<IndexMaterializedPaths200>({
-		url: `/api/v1/promoted_paths/materialized`,
-		method: 'POST',
-		headers: { 'Content-Type': 'application/json' },
-		data: promotetypesPostableIndexMaterializedPathsDTO,
-		signal,
-	});
-};
-
-export const getIndexMaterializedPathsMutationOptions = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown,
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof indexMaterializedPaths>>,
-		TError,
-		{ data?: BodyType<PromotetypesPostableIndexMaterializedPathsDTO> },
-		TContext
-	>;
-}): UseMutationOptions<
-	Awaited<ReturnType<typeof indexMaterializedPaths>>,
-	TError,
-	{ data?: BodyType<PromotetypesPostableIndexMaterializedPathsDTO> },
-	TContext
-> => {
-	const mutationKey = ['indexMaterializedPaths'];
-	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 indexMaterializedPaths>>,
-		{ data?: BodyType<PromotetypesPostableIndexMaterializedPathsDTO> }
-	> = (props) => {
-		const { data } = props ?? {};
-
-		return indexMaterializedPaths(data);
-	};
-
-	return { mutationFn, ...mutationOptions };
-};
-
-export type IndexMaterializedPathsMutationResult = NonNullable<
-	Awaited<ReturnType<typeof indexMaterializedPaths>>
->;
-export type IndexMaterializedPathsMutationBody =
-	| BodyType<PromotetypesPostableIndexMaterializedPathsDTO>
-	| undefined;
-export type IndexMaterializedPathsMutationError =
-	ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary Index materialized paths
- */
-export const useIndexMaterializedPaths = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown,
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof indexMaterializedPaths>>,
-		TError,
-		{ data?: BodyType<PromotetypesPostableIndexMaterializedPathsDTO> },
-		TContext
-	>;
-}): UseMutationResult<
-	Awaited<ReturnType<typeof indexMaterializedPaths>>,
-	TError,
-	{ data?: BodyType<PromotetypesPostableIndexMaterializedPathsDTO> },
-	TContext
-> => {
-	return useMutation(getIndexMaterializedPathsMutationOptions(options));
-};

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

@@ -18,8 +18,6 @@ import type {
 } from 'react-query';
 
 import type {
-	CloneRuleByID201,
-	CloneRuleByIDPathParameters,
 	CreateRule201,
 	CreateRuleView201,
 	DeleteRuleByIDPathParameters,
@@ -965,85 +963,6 @@ export const useUpdateRuleByID = <
 > => {
 	return useMutation(getUpdateRuleByIDMutationOptions(options));
 };
-/**
- * This endpoint creates a new alert rule from the stored definition of an existing one. The clone keeps every modeled field of the source, including its enabled/disabled state, and gets the source's name suffixed with " - Copy" (or a bumped " - Copy (n)" counter when the source is itself a copy). The clone is owned by the caller.
- * @summary Clone alert rule
- */
-export const cloneRuleByID = (
-	{ id }: CloneRuleByIDPathParameters,
-	signal?: AbortSignal,
-) => {
-	return GeneratedAPIInstance<CloneRuleByID201>({
-		url: `/api/v2/rules/${id}/clone`,
-		method: 'POST',
-		signal,
-	});
-};
-
-export const getCloneRuleByIDMutationOptions = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown,
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof cloneRuleByID>>,
-		TError,
-		{ pathParams: CloneRuleByIDPathParameters },
-		TContext
-	>;
-}): UseMutationOptions<
-	Awaited<ReturnType<typeof cloneRuleByID>>,
-	TError,
-	{ pathParams: CloneRuleByIDPathParameters },
-	TContext
-> => {
-	const mutationKey = ['cloneRuleByID'];
-	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 cloneRuleByID>>,
-		{ pathParams: CloneRuleByIDPathParameters }
-	> = (props) => {
-		const { pathParams } = props ?? {};
-
-		return cloneRuleByID(pathParams);
-	};
-
-	return { mutationFn, ...mutationOptions };
-};
-
-export type CloneRuleByIDMutationResult = NonNullable<
-	Awaited<ReturnType<typeof cloneRuleByID>>
->;
-
-export type CloneRuleByIDMutationError = ErrorType<RenderErrorResponseDTO>;
-
-/**
- * @summary Clone alert rule
- */
-export const useCloneRuleByID = <
-	TError = ErrorType<RenderErrorResponseDTO>,
-	TContext = unknown,
->(options?: {
-	mutation?: UseMutationOptions<
-		Awaited<ReturnType<typeof cloneRuleByID>>,
-		TError,
-		{ pathParams: CloneRuleByIDPathParameters },
-		TContext
-	>;
-}): UseMutationResult<
-	Awaited<ReturnType<typeof cloneRuleByID>>,
-	TError,
-	{ pathParams: CloneRuleByIDPathParameters },
-	TContext
-> => {
-	return useMutation(getCloneRuleByIDMutationOptions(options));
-};
 /**
  * Returns distinct label keys from rule history entries for the selected range.
  * @summary Get rule history filter keys

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

@@ -4938,6 +4938,12 @@ export interface DashboardtypesAreaChartPanelSpecDTO {
 	visualization?: DashboardtypesAreaChartVisualizationDTO;
 }
 
+export enum DashboardtypesAxisScaleDTO {
+	auto = 'auto',
+	linear = 'linear',
+	log = 'log',
+	symlog = 'symlog',
+}
 export interface DashboardtypesBarChartVisualizationDTO {
 	/**
 	 * @type boolean
@@ -5695,6 +5701,126 @@ export interface DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDa
 	spec: DashboardtypesHeatmapPanelSpecDTO;
 }
 
+export enum DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesScatterPlotPanelSpecDTOKind {
+	'signoz/ScatterPlotPanel' = 'signoz/ScatterPlotPanel',
+}
+export interface DashboardtypesScatterPlotAxisDTO {
+	/**
+	 * @type string
+	 * @description Axis title. Empty draws none.
+	 */
+	label?: string;
+	scale?: DashboardtypesAxisScaleDTO;
+	/**
+	 * @type number,null
+	 */
+	softMax?: number | null;
+	/**
+	 * @type number,null
+	 */
+	softMin?: number | null;
+}
+
+export interface DashboardtypesScatterPlotAxesDTO {
+	x?: DashboardtypesScatterPlotAxisDTO;
+	y?: DashboardtypesScatterPlotAxisDTO;
+}
+
+/**
+ * @minimum 2
+ * @maximum 40
+ * @nullable
+ */
+export type DashboardtypesPointDiameterDTO = number | null;
+
+/**
+ * @minimum 0.1
+ * @maximum 1
+ * @nullable
+ */
+export type DashboardtypesPointOpacityDTO = number | null;
+
+export interface DashboardtypesScatterPlotPointsDTO {
+	maxSize?: DashboardtypesPointDiameterDTO | null;
+	minSize?: DashboardtypesPointDiameterDTO | null;
+	opacity?: DashboardtypesPointOpacityDTO | null;
+	size?: DashboardtypesPointDiameterDTO | null;
+}
+
+export interface DashboardtypesScatterPlotChartAppearanceDTO {
+	points?: DashboardtypesScatterPlotPointsDTO;
+}
+
+export interface DashboardtypesScatterPlotDimensionsDTO {
+	/**
+	 * @type array,null
+	 * @description Group-by label names (e.g. k8s.namespace.name) whose combined values colour dots and drive the legend. Empty colours by every group-by label.
+	 */
+	colorBy?: string[] | null;
+	/**
+	 * @type string
+	 * @description Value column key that scales dot size. Empty draws every dot at the default size.
+	 */
+	sizeBy?: string;
+	/**
+	 * @type string
+	 * @description Value column key (queryName, or queryName.expression for a multi-aggregation query) plotted on the x axis. Empty uses the first value column.
+	 */
+	x?: string;
+	/**
+	 * @type string
+	 * @description Value column key plotted on the y axis. Empty uses the second value column.
+	 */
+	y?: string;
+}
+
+export enum DashboardtypesThresholdAxisDTO {
+	x = 'x',
+	y = 'y',
+}
+export interface DashboardtypesScatterPlotThresholdDTO {
+	axis?: DashboardtypesThresholdAxisDTO;
+	/**
+	 * @type string
+	 */
+	color: string;
+	/**
+	 * @type string
+	 */
+	label?: string;
+	/**
+	 * @type string
+	 */
+	unit?: string;
+	/**
+	 * @type number
+	 * @format double
+	 */
+	value: number;
+}
+
+export interface DashboardtypesScatterPlotPanelSpecDTO {
+	axes?: DashboardtypesScatterPlotAxesDTO;
+	chartAppearance?: DashboardtypesScatterPlotChartAppearanceDTO;
+	dimensions?: DashboardtypesScatterPlotDimensionsDTO;
+	formatting?: DashboardtypesTableFormattingDTO;
+	legend?: DashboardtypesLegendDTO;
+	/**
+	 * @type array,null
+	 */
+	thresholds?: DashboardtypesScatterPlotThresholdDTO[] | null;
+	visualization?: DashboardtypesBasicVisualizationDTO;
+}
+
+export interface DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesScatterPlotPanelSpecDTO {
+	/**
+	 * @enum signoz/ScatterPlotPanel
+	 * @type string
+	 */
+	kind: DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesScatterPlotPanelSpecDTOKind;
+	spec: DashboardtypesScatterPlotPanelSpecDTO;
+}
+
 export type DashboardtypesPanelPluginDTO =
 	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTimeSeriesPanelSpecDTO
 	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesBarChartPanelSpecDTO
@@ -5705,7 +5831,8 @@ export type DashboardtypesPanelPluginDTO =
 	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHistogramPanelSpecDTO
 	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesListPanelSpecDTO
 	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesTextPanelSpecDTO
-	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHeatmapPanelSpecDTO;
+	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesHeatmapPanelSpecDTO
+	| DashboardtypesPanelPluginVariantGithubComSigNozSignozPkgTypesDashboardtypesScatterPlotPanelSpecDTO;
 
 export enum Querybuildertypesv5RequestTypeDTO {
 	scalar = 'scalar',
@@ -6645,6 +6772,7 @@ export enum DashboardtypesPanelPluginKindDTO {
 	'signoz/ListPanel' = 'signoz/ListPanel',
 	'signoz/TextPanel' = 'signoz/TextPanel',
 	'signoz/HeatmapPanel' = 'signoz/HeatmapPanel',
+	'signoz/ScatterPlotPanel' = 'signoz/ScatterPlotPanel',
 }
 /**
  * @nullable
@@ -9878,28 +10006,6 @@ export interface PromotetypesPromotePathDTO {
 	signal: string;
 }
 
-export interface PromotetypesIndexMaterializedPathsResultDTO {
-	/**
-	 * @type array,null
-	 */
-	indexed: PromotetypesPromotePathDTO[] | null;
-	/**
-	 * @type array,null
-	 */
-	skipped: PromotetypesPromotePathDTO[] | null;
-}
-
-export interface PromotetypesPostableIndexMaterializedPathsDTO {
-	/**
-	 * @type boolean
-	 */
-	dryRun?: boolean;
-	/**
-	 * @type string
-	 */
-	signal: string;
-}
-
 export interface Querybuildertypesv5AggregationMetaDTO {
 	/**
 	 * @type array
@@ -13272,14 +13378,6 @@ export type ListPromotedPaths200 = {
 	status: string;
 };
 
-export type IndexMaterializedPaths200 = {
-	data: PromotetypesIndexMaterializedPathsResultDTO;
-	/**
-	 * @type string
-	 */
-	status: string;
-};
-
 export type ListRoles200 = {
 	/**
 	 * @type array
@@ -14612,17 +14710,6 @@ export type PatchRuleByID200 = {
 export type UpdateRuleByIDPathParameters = {
 	id: string;
 };
-export type CloneRuleByIDPathParameters = {
-	id: string;
-};
-export type CloneRuleByID201 = {
-	data: RuletypesRuleDTO;
-	/**
-	 * @type string
-	 */
-	status: string;
-};
-
 export type GetRuleHistoryFilterKeysPathParameters = {
 	id: string;
 };

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

@@ -61,11 +61,7 @@ describe('convertV5ResponseToLegacy', () => {
 							],
 							values: [
 								{ timestamp: 1000, value: 10 } as unknown as TimeSeriesValue,
-								{
-									timestamp: 2000,
-									value: 12,
-									partial: true,
-								} as unknown as TimeSeriesValue,
+								{ timestamp: 2000, value: 12 } as unknown as TimeSeriesValue,
 							],
 						} as unknown as TimeSeries,
 					],
@@ -108,7 +104,7 @@ describe('convertV5ResponseToLegacy', () => {
 				labels: { 'service.name': 'adservice' },
 				values: [
 					{ timestamp: 1000, value: '10' },
-					{ timestamp: 2000, value: '12', partial: true },
+					{ timestamp: 2000, value: '12' },
 				],
 				metaData: expect.objectContaining({
 					alias: '__result_0',

frontend/src/api/v5/queryRange/convertV5Response.ts

@@ -125,7 +125,6 @@ function convertTimeSeriesData(
 				values: series.values.map((value: any) => ({
 					timestamp: value.timestamp,
 					value: String(value.value),
-					...(value.partial ? { partial: true } : {}),
 				})),
 				metaData: {
 					alias,

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

@@ -21,6 +21,7 @@ import { DataSource, ReduceOperators } from 'types/common/queryBuilder';
 
 import {
 	convertBuilderQueriesToV5,
+	mapPanelTypeToRequestType,
 	prepareQueryRangePayloadV5,
 } from './prepareQueryRangePayloadV5';
 
@@ -904,6 +905,12 @@ describe('prepareQueryRangePayloadV5', () => {
 	});
 });
 
+describe('mapPanelTypeToRequestType', () => {
+	it('sends a scatter plot as scalar, like a table', () => {
+		expect(mapPanelTypeToRequestType(PANEL_TYPES.SCATTER)).toBe('scalar');
+	});
+});
+
 describe('convertBuilderQueriesToV5 having normalization', () => {
 	const buildSpec = (having: unknown): MetricBuilderQuery => {
 		const [envelope] = convertBuilderQueriesToV5(

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

@@ -51,6 +51,7 @@ export function mapPanelTypeToRequestType(panelType: PANEL_TYPES): RequestType {
 		case PANEL_TYPES.BAR:
 			return 'time_series';
 		case PANEL_TYPES.TABLE:
+		case PANEL_TYPES.SCATTER:
 		case PANEL_TYPES.PIE:
 		case PANEL_TYPES.VALUE:
 			return 'scalar';
@@ -278,6 +279,7 @@ export function createAggregation(
 		queryData.dataSource === DataSource.METRICS &&
 		panelType &&
 		(panelType === PANEL_TYPES.TABLE ||
+			panelType === PANEL_TYPES.SCATTER ||
 			panelType === PANEL_TYPES.PIE ||
 			panelType === PANEL_TYPES.VALUE);
 

frontend/src/assets/Logos/apache-druid.svg

@@ -1,3 +1,3 @@
 <svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-  <path fill="#0E9AA7" d="M8.932 20.806c-.369 0-.738.007-1.109 0-.35-.007-.587-.206-.623-.5a.587.587 0 0 1 .53-.636c.79-.062 1.582-.063 2.372-.003a.548.548 0 0 1 .522.602c-.024.326-.253.526-.616.54zM1.792 8.345c-.392 0-.782.008-1.173.002-.327-.006-.577-.22-.614-.512-.037-.293.146-.544.499-.615.192-.032.388-.045.583-.039a81.515 81.515 0 0 1 1.597 0c.163 0 .325.019.483.056.288.073.445.318.411.617-.034.298-.214.477-.515.487-.424.014-.848.004-1.272.004zm7.588 8.417H4.292a2.464 2.464 0 0 1-.326-.007c-.294-.04-.48-.209-.508-.506-.029-.298.11-.501.391-.606.179-.065.365-.051.549-.051 3.347 0 6.695.005 10.042-.006 1.174-.004 2.187-.439 2.993-1.3.69-.738 1.053-1.63 1.16-2.635.085-.788-.027-1.513-.516-2.156-.544-.718-1.28-1.078-2.163-1.082-3.163-.013-6.328-.005-9.487-.01-.336 0-.673-.027-1.007-.058-.29-.027-.45-.201-.469-.492-.021-.317.141-.545.429-.6a1.55 1.55 0 0 1 .29-.015h10.177c1.71.004 3.187 1.038 3.726 2.654.383 1.147.246 2.304-.182 3.416-.824 2.135-2.762 3.448-5.055 3.454-1.652.005-3.304 0-4.956 0zm2.906-13.568c1.533 0 3.066-.008 4.598 0 2.935.018 5.629 1.892 6.653 4.626.442 1.181.538 2.403.412 3.657-.185 1.842-.735 3.552-1.776 5.084-1.608 2.365-3.873 3.68-6.679 4.118-.95.148-1.905.13-2.86.13-.397 0-.61-.181-.633-.51-.025-.351.196-.621.587-.645.434-.026.87-.004 1.305-.016 2.641-.072 4.928-.982 6.74-2.935 1.269-1.37 1.912-3.039 2.13-4.878.151-1.275.135-2.544-.37-3.752-.773-1.85-2.159-2.983-4.068-3.509-.74-.204-1.5-.243-2.26-.247-2.837-.017-5.675-.007-8.511-.007-.12 0-.24.004-.359-.006a.57.57 0 0 1-.517-.536.557.557 0 0 1 .456-.557c.13-.018.261-.024.392-.019h4.762Z"/>
+  <path fill="#29F1FB" d="M8.932 20.806c-.369 0-.738.007-1.109 0-.35-.007-.587-.206-.623-.5a.587.587 0 0 1 .53-.636c.79-.062 1.582-.063 2.372-.003a.548.548 0 0 1 .522.602c-.024.326-.253.526-.616.54zM1.792 8.345c-.392 0-.782.008-1.173.002-.327-.006-.577-.22-.614-.512-.037-.293.146-.544.499-.615.192-.032.388-.045.583-.039a81.515 81.515 0 0 1 1.597 0c.163 0 .325.019.483.056.288.073.445.318.411.617-.034.298-.214.477-.515.487-.424.014-.848.004-1.272.004zm7.588 8.417H4.292a2.464 2.464 0 0 1-.326-.007c-.294-.04-.48-.209-.508-.506-.029-.298.11-.501.391-.606.179-.065.365-.051.549-.051 3.347 0 6.695.005 10.042-.006 1.174-.004 2.187-.439 2.993-1.3.69-.738 1.053-1.63 1.16-2.635.085-.788-.027-1.513-.516-2.156-.544-.718-1.28-1.078-2.163-1.082-3.163-.013-6.328-.005-9.487-.01-.336 0-.673-.027-1.007-.058-.29-.027-.45-.201-.469-.492-.021-.317.141-.545.429-.6a1.55 1.55 0 0 1 .29-.015h10.177c1.71.004 3.187 1.038 3.726 2.654.383 1.147.246 2.304-.182 3.416-.824 2.135-2.762 3.448-5.055 3.454-1.652.005-3.304 0-4.956 0zm2.906-13.568c1.533 0 3.066-.008 4.598 0 2.935.018 5.629 1.892 6.653 4.626.442 1.181.538 2.403.412 3.657-.185 1.842-.735 3.552-1.776 5.084-1.608 2.365-3.873 3.68-6.679 4.118-.95.148-1.905.13-2.86.13-.397 0-.61-.181-.633-.51-.025-.351.196-.621.587-.645.434-.026.87-.004 1.305-.016 2.641-.072 4.928-.982 6.74-2.935 1.269-1.37 1.912-3.039 2.13-4.878.151-1.275.135-2.544-.37-3.752-.773-1.85-2.159-2.983-4.068-3.509-.74-.204-1.5-.243-2.26-.247-2.837-.017-5.675-.007-8.511-.007-.12 0-.24.004-.359-.006a.57.57 0 0 1-.517-.536.557.557 0 0 1 .456-.557c.13-.018.261-.024.392-.019h4.762Z"/>
 </svg>

frontend/src/assets/Logos/baseten.svg

@@ -1 +1,3 @@
-<svg role="img" viewBox="-2.625 3 28 28" xmlns="http://www.w3.org/2000/svg"><path fill="#7A8291" d="M.36 8.6h16.7v5.6H6.04c-.2 0-.35.16-.35.35v4.9c0 .2.16.35.35.35h11.02v5.6h-5.33c-.2 0-.35.16-.35.35v4.9c0 .2.16.35.35.35h4.98c.2 0 .35-.15.35-.35V25.4h5.34c.2 0 .35-.16.35-.35v-4.9c0-.2-.16-.35-.35-.35h-5.34v-5.6h5.34c.2 0 .35-.16.35-.35v-4.9c0-.2-.16-.35-.35-.35h-5.34V3.35c0-.2-.16-.35-.35-.35H.36c-.2 0-.36.16-.36.35v4.9c0 .2.16.35.36.35Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" fill="#9CA3AF" height="34" viewBox="0 0 131 34">
+  <path fill="#9CA3AF" d="M.36 8.6h16.7v5.6H6.04c-.2 0-.35.16-.35.35v4.9c0 .2.16.35.35.35h11.02v5.6h-5.33c-.2 0-.35.16-.35.35v4.9c0 .2.16.35.35.35h4.98c.2 0 .35-.15.35-.35V25.4h5.34c.2 0 .35-.16.35-.35v-4.9c0-.2-.16-.35-.35-.35h-5.34v-5.6h5.34c.2 0 .35-.16.35-.35v-4.9c0-.2-.16-.35-.35-.35h-5.34V3.35c0-.2-.16-.35-.35-.35H.36c-.2 0-.36.16-.36.35v4.9c0 .2.16.35.36.35ZM44.41 14.7c-.5-.5-1.1-.9-1.76-1.18a5.62 5.62 0 0 0-4.6.17c-.73.37-1.32.91-1.75 1.62h-.17V8.59H34.1v16.83h2.04v-1.81h.17c.21.36.47.67.77.94.31.25.65.48 1.01.67.37.18.77.31 1.18.39a6.2 6.2 0 0 0 3.39-.24 5.36 5.36 0 0 0 3.02-3.1c.29-.75.44-1.62.44-2.6v-.47c0-.96-.16-1.83-.47-2.58-.3-.75-.7-1.4-1.23-1.9v-.01Zm-5.87.66a3.9 3.9 0 0 1 4.34.84c.36.35.64.8.83 1.3.2.5.3 1.07.3 1.7v.47c0 .64-.1 1.23-.3 1.74a3.75 3.75 0 0 1-2.06 2.15 4.27 4.27 0 0 1-3.12-.03 3.86 3.86 0 0 1-2.09-2.2c-.2-.52-.3-1.11-.3-1.75v-.29c0-.62.1-1.2.3-1.7v-.01c.21-.53.5-.99.84-1.36.36-.37.78-.66 1.26-.86ZM97.04 8.59H95v4.86h-2.94v1.86H95v8.17c0 .56.17 1.03.53 1.4.37.35.84.54 1.4.54h4.18v-1.87h-3.5c-.2 0-.33-.05-.43-.15-.1-.1-.14-.27-.14-.49v-7.6h4.65v-1.86h-4.65V8.59ZM114.61 15a5.48 5.48 0 0 0-1.8-1.33 5.6 5.6 0 0 0-2.57-.56 6.17 6.17 0 0 0-4.26 1.7 5.6 5.6 0 0 0-1.72 4.2v.57c0 .9.15 1.75.44 2.5a5.58 5.58 0 0 0 5.5 3.67c1.55 0 2.8-.35 3.72-1.04a5.35 5.35 0 0 0 1.91-2.73l.03-.07-1.94-.52-.02.07c-.11.33-.27.64-.46.94-.17.27-.4.52-.7.74-.28.22-.63.39-1.04.51-.41.13-.9.19-1.46.19a3.8 3.8 0 0 1-2.84-1.05 4.07 4.07 0 0 1-1.1-2.7h9.68v-1.6c0-.54-.11-1.12-.34-1.75a5.04 5.04 0 0 0-1.03-1.74Zm-8.25 3.21a3.8 3.8 0 0 1 1.22-2.25 4.19 4.19 0 0 1 3.99-.7c.44.16.83.38 1.17.66.34.27.62.62.82 1.02.21.38.34.8.38 1.27h-7.58ZM129.09 14.42a4.47 4.47 0 0 0-3.37-1.3c-.93 0-1.73.2-2.4.59-.64.39-1.15.97-1.52 1.74h-.17v-2h-2.04v11.97h2.04v-6.23c0-1.26.32-2.28.95-3.02a3.31 3.31 0 0 1 2.65-1.14c.94 0 1.7.3 2.24.9.56.6.83 1.52.83 2.74v6.75h2.04v-7.13c0-1.71-.42-3.02-1.25-3.87ZM88.1 15a5.48 5.48 0 0 0-1.78-1.33 5.6 5.6 0 0 0-2.58-.56 6.17 6.17 0 0 0-4.27 1.7 5.59 5.59 0 0 0-1.71 4.2v.56c0 .92.14 1.76.44 2.51a5.6 5.6 0 0 0 5.5 3.67c1.55 0 2.8-.35 3.72-1.04a5.36 5.36 0 0 0 1.91-2.73l.03-.07-1.94-.52-.03.07c-.1.32-.26.64-.45.94-.17.27-.4.52-.7.74-.29.21-.64.39-1.05.51-.4.12-.9.19-1.45.19a3.8 3.8 0 0 1-2.85-1.05 4.07 4.07 0 0 1-1.09-2.7h9.68v-1.61c0-.53-.12-1.12-.34-1.74A5.03 5.03 0 0 0 88.1 15Zm-8.24 3.21a3.83 3.83 0 0 1 1.22-2.25 4.2 4.2 0 0 1 3.99-.7c.44.16.83.38 1.16.66.35.27.62.62.83 1.02.2.38.33.8.37 1.27h-7.57ZM73.65 19.42a6.11 6.11 0 0 0-3.23-1.02 6.63 6.63 0 0 1-2.68-.58c-.47-.3-.7-.7-.7-1.25 0-.27.08-.5.21-.7.14-.2.33-.38.56-.52a4.05 4.05 0 0 1 1.78-.42c.85 0 1.54.21 2.06.63.53.41.83 1 .91 1.73l.01.1 1.95-.47-.01-.07c-.07-.45-.22-.91-.45-1.36a3.46 3.46 0 0 0-.94-1.2 4.6 4.6 0 0 0-1.52-.84 6.05 6.05 0 0 0-2.1-.34c-.58 0-1.13.07-1.65.22-.52.14-1 .36-1.43.65-.41.3-.74.66-.99 1.1a2.9 2.9 0 0 0-.37 1.49v.14c0 1.06.38 1.87 1.14 2.42a6.2 6.2 0 0 0 3.24.97c1.18.08 2.04.26 2.56.54.5.28.75.72.75 1.36 0 .6-.25 1.06-.78 1.4-.52.32-1.22.48-2.1.48a3.68 3.68 0 0 1-2.46-.79 3.13 3.13 0 0 1-1.04-2.14v-.09l-1.93.46h-.02v.07a4.4 4.4 0 0 0 3.1 4c.7.24 1.52.36 2.46.36.7 0 1.35-.09 1.93-.27.6-.16 1.12-.4 1.53-.72A3.38 3.38 0 0 0 74.8 22v-.14c0-1.07-.39-1.9-1.14-2.44ZM60.25 23.4c-.1-.1-.14-.27-.14-.49v-9.46h-2.05v1.85h-.16a3.78 3.78 0 0 0-1.61-1.63 4.62 4.62 0 0 0-2.26-.56c-.77 0-1.5.14-2.19.41a5.27 5.27 0 0 0-3.02 3.12c-.29.75-.44 1.63-.44 2.6v.38c0 .99.15 1.87.44 2.63.3.75.7 1.4 1.2 1.93a5.48 5.48 0 0 0 4.05 1.57c.8 0 1.51-.2 2.2-.58.69-.38 1.24-.97 1.63-1.75h.16v.06c0 .56.18 1.03.53 1.4.37.35.85.54 1.41.54h1.36v-1.87h-.68c-.2 0-.34-.05-.43-.15Zm-4.46.13c-.46.2-.97.3-1.52.3a3.68 3.68 0 0 1-2.75-1.09 4.42 4.42 0 0 1-1.05-3.12v-.38c0-.62.1-1.2.29-1.71a3.65 3.65 0 0 1 5-2.17c.47.2.88.49 1.21.86.35.37.62.83.8 1.36.2.5.3 1.08.3 1.7v.3c0 .63-.1 1.23-.3 1.76-.18.5-.45.96-.78 1.33-.33.37-.73.66-1.2.86Z"/>
+</svg>

frontend/src/assets/Logos/celery.svg

@@ -1 +1 @@
-<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="#37814A" d="M2.303 0A2.298 2.298 0 0 0 0 2.303v19.394A2.298 2.298 0 0 0 2.303 24h19.394A2.298 2.298 0 0 0 24 21.697V2.303A2.298 2.298 0 0 0 21.697 0zm8.177 3.072c4.098 0 7.028 1.438 7.68 1.764l-1.194 2.55c-2.442-1.057-4.993-1.41-5.672-1.41-1.574 0-2.17.922-2.17 1.763v8.494c0 .869.596 1.791 2.17 1.791.679 0 3.23-.38 5.672-1.41l1.194 2.496c-.435.271-3.637 1.818-7.68 1.818-1.112 0-4.64-.244-4.64-4.64V7.713c0-4.397 3.528-4.64 4.64-4.64z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" id="图层_1" x="0" y="0" version="1.1" viewBox="0 0 519.27 214.14"><style>.st2{fill:#a9cc54}</style><path d="M493.54 171.25c-35.63 0-64.52-28.89-64.52-64.52s28.89-64.52 64.52-64.52c3.85 0 7.62.36 11.29 1L493.54 5.45H104.46v.02C49.24 6.51 4.78 51.59 4.78 107.07c0 55.47 44.45 100.56 99.68 101.59v.02h389.07l11.29-38.44c-3.66.65-7.43 1.01-11.28 1.01" style="fill:#b6de64"/><defs><path id="SVGID_1_" d="M493.54 171.25c-35.63 0-64.52-28.89-64.52-64.52s28.89-64.52 64.52-64.52c3.85 0 7.62.36 11.29 1V5.45H104.46v.02C49.24 6.51 4.78 51.59 4.78 107.07c0 55.47 44.45 100.56 99.68 101.59v.02h389.07l11.29-38.44c-3.66.65-7.43 1.01-11.28 1.01"/></defs><clipPath id="SVGID_2_"><use xlink:href="#SVGID_1_" style="overflow:visible"/></clipPath><g style="clip-path:url(#SVGID_2_)"><path d="M-23.16 55.58H428.5v51.1H-23.16zM-23.16 157.59h530.98v72.35H-23.16z" class="st2"/></g><path d="M493.54 184.23c-43.94 0-79.56-33.62-79.56-77.56s35.62-76.56 79.56-76.56" style="fill:none;stroke:#ddf4a4;stroke-width:49;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10"/></svg>

frontend/src/assets/Logos/github.svg

@@ -1,5 +1,5 @@
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
 <g id="lucide/github">
-<path id="Vector" d="M15 22V18C15.1391 16.7473 14.7799 15.4901 14 14.5C17 14.5 20 12.5 20 9C20.08 7.75 19.73 6.52 19 5.5C19.28 4.35 19.28 3.15 19 2C19 2 18 2 16 3.5C13.36 3 10.64 3 8 3.5C6 2 5 2 5 2C4.7 3.15 4.7 4.35 5 5.5C4.27187 6.51588 3.91847 7.75279 4 9C4 12.5 7 14.5 10 14.5C9.61 14.99 9.32 15.55 9.15 16.15C8.98 16.75 8.93 17.38 9 18M9 18V22M9 18C4.49 20 4 16 2 16" stroke="#7A8291" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path id="Vector" d="M15 22V18C15.1391 16.7473 14.7799 15.4901 14 14.5C17 14.5 20 12.5 20 9C20.08 7.75 19.73 6.52 19 5.5C19.28 4.35 19.28 3.15 19 2C19 2 18 2 16 3.5C13.36 3 10.64 3 8 3.5C6 2 5 2 5 2C4.7 3.15 4.7 4.35 5 5.5C4.27187 6.51588 3.91847 7.75279 4 9C4 12.5 7 14.5 10 14.5C9.61 14.99 9.32 15.55 9.15 16.15C8.98 16.75 8.93 17.38 9 18M9 18V22M9 18C4.49 20 4 16 2 16" stroke="#C0C1C3" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
 </g>
 </svg>

frontend/src/assets/Logos/hcp-vault.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#A68400" d="m0 0 11.955 24L24 0zm13.366 4.827h1.393v1.38h-1.393zm-2.77 5.569H9.22V8.993h1.389zm0-2.087H9.22V6.906h1.389zm0-2.086H9.22V4.819h1.389zm2.087 6.263h-1.377V11.08h1.388zm0-2.09h-1.377V8.993h1.388zm0-2.087h-1.377V6.906h1.388zm0-2.086h-1.377V4.819h1.388zm.683.683h1.393v1.389h-1.393zm0 3.475V8.993h1.389v1.388Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#FFEC6E" d="m0 0 11.955 24L24 0zm13.366 4.827h1.393v1.38h-1.393zm-2.77 5.569H9.22V8.993h1.389zm0-2.087H9.22V6.906h1.389zm0-2.086H9.22V4.819h1.389zm2.087 6.263h-1.377V11.08h1.388zm0-2.09h-1.377V8.993h1.388zm0-2.087h-1.377V6.906h1.388zm0-2.086h-1.377V4.819h1.388zm.683.683h1.393v1.389h-1.393zm0 3.475V8.993h1.389v1.388Z"/></svg>

frontend/src/assets/Logos/heroku.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="285" height="285" preserveAspectRatio="xMidYMid" viewBox="-14.5 0 285 285"><path fill="#7C4DD6" d="M230.4 0c13.996 0 25.37 11.232 25.597 25.177l.003.423v233.244c0 13.996-11.235 25.37-25.177 25.597l-.423.003H25.6c-13.996 0-25.37-11.235-25.597-25.176L0 258.844V25.6C0 11.601 11.235.23 25.177.003L25.6 0zm0 14.222H25.6c-6.174 0-11.218 4.948-11.374 11.085l-.004.293v233.244c0 6.174 4.948 11.218 11.085 11.374l.293.004h204.8c6.177 0 11.218-4.947 11.374-11.084l.004-.294V25.6c0-6.272-5.102-11.378-11.378-11.378M64 184.89l32 28.444-32 28.445zM92.444 42.667v80.75c14.201-4.622 34.052-9.64 53.334-9.64 17.582 0 28.106 6.913 33.838 12.712 12.109 12.25 12.397 27.82 12.381 29.897v.058l.003 85.334h-28.444v-84.942c-.14-6.639-3.34-14.614-17.778-14.614-28.632 0-60.714 14.257-61.666 14.683l-.02.009L64 166.016V42.666zm99.556 0c-1.92 16.156-8.47 31.644-21.333 46.222h-28.445c11.179-14.667 18.198-30.101 21.334-46.222Z"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="285" height="285" preserveAspectRatio="xMidYMid" viewBox="-14.5 0 285 285"><path fill="#430098" d="M230.4 0c13.996 0 25.37 11.232 25.597 25.177l.003.423v233.244c0 13.996-11.235 25.37-25.177 25.597l-.423.003H25.6c-13.996 0-25.37-11.235-25.597-25.176L0 258.844V25.6C0 11.601 11.235.23 25.177.003L25.6 0zm0 14.222H25.6c-6.174 0-11.218 4.948-11.374 11.085l-.004.293v233.244c0 6.174 4.948 11.218 11.085 11.374l.293.004h204.8c6.177 0 11.218-4.947 11.374-11.084l.004-.294V25.6c0-6.272-5.102-11.378-11.378-11.378M64 184.89l32 28.444-32 28.445zM92.444 42.667v80.75c14.201-4.622 34.052-9.64 53.334-9.64 17.582 0 28.106 6.913 33.838 12.712 12.109 12.25 12.397 27.82 12.381 29.897v.058l.003 85.334h-28.444v-84.942c-.14-6.639-3.34-14.614-17.778-14.614-28.632 0-60.714 14.257-61.666 14.683l-.02.009L64 166.016V42.666zm99.556 0c-1.92 16.156-8.47 31.644-21.333 46.222h-28.445c11.179-14.667 18.198-30.101 21.334-46.222Z"/></svg>

frontend/src/assets/Logos/livekit.svg

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

frontend/src/assets/Logos/opencode.svg

@@ -1 +1 @@
-<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="#7A8291" d="M22 24H2V0h20zM17 4.8H7v14.4h10z"/></svg>
+<svg width='234' height='42' viewBox='0 0 234 42' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M18 30H6V18H18V30Z' fill='#CFCECD'/><path d='M18 12H6V30H18V12ZM24 36H0V6H24V36Z' fill='#656363'/><path d='M48 30H36V18H48V30Z' fill='#CFCECD'/><path d='M36 30H48V12H36V30ZM54 36H36V42H30V6H54V36Z' fill='#656363'/><path d='M84 24V30H66V24H84Z' fill='#CFCECD'/><path d='M84 24H66V30H84V36H60V6H84V24ZM66 18H78V12H66V18Z' fill='#656363'/><path d='M108 36H96V18H108V36Z' fill='#CFCECD'/><path d='M108 12H96V36H90V6H108V12ZM114 36H108V12H114V36Z' fill='#656363'/><path d='M144 30H126V18H144V30Z' fill='#CFCECD'/><path d='M144 12H126V30H144V36H120V6H144V12Z' fill='#211E1E'/><path d='M168 30H156V18H168V30Z' fill='#CFCECD'/><path d='M168 12H156V30H168V12ZM174 36H150V6H174V36Z' fill='#211E1E'/><path d='M198 30H186V18H198V30Z' fill='#CFCECD'/><path d='M198 12H186V30H198V12ZM204 36H180V6H198V0H204V36Z' fill='#211E1E'/><path d='M234 24V30H216V24H234Z' fill='#CFCECD'/><path d='M216 12V18H228V12H216ZM234 24H216V30H234V36H210V6H234V24Z' fill='#211E1E'/></svg>

frontend/src/assets/Logos/render.svg

@@ -1 +1 @@
-<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill="#7A8291" d="M18.263.007c-3.121-.147-5.744 2.109-6.192 5.082-.018.138-.045.272-.067.405-.696 3.703-3.936 6.507-7.827 6.507-1.388 0-2.691-.356-3.825-.979a.2024.2024 0 0 0-.302.178V24H12v-8.999c0-1.656 1.338-3 2.987-3h2.988c3.382 0 6.103-2.817 5.97-6.244-.12-3.084-2.61-5.603-5.682-5.75"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><title>Render</title><path d="M18.263.007c-3.121-.147-5.744 2.109-6.192 5.082-.018.138-.045.272-.067.405-.696 3.703-3.936 6.507-7.827 6.507a7.9 7.9 0 0 1-3.825-.979.202.202 0 0 0-.302.178V24H12v-8.999c0-1.656 1.338-3 2.987-3h2.988c3.382 0 6.103-2.817 5.97-6.244-.12-3.084-2.61-5.603-5.682-5.75"/></svg>

frontend/src/assets/Logos/vector.svg

@@ -1 +1 @@
-<svg role="img" viewBox="89.7 190 220 220" xmlns="http://www.w3.org/2000/svg"><linearGradient id="a" x1="128.046" x2="313.226" y1="579.207" y2="472.293" gradientTransform="translate(-20.96 -225.764)" gradientUnits="userSpaceOnUse"><stop offset="0" style="stop-color:#10e7ff"/><stop offset=".103" style="stop-color:#33d5ff"/><stop offset=".255" style="stop-color:#60bdff"/><stop offset=".408" style="stop-color:#86aaff"/><stop offset=".56" style="stop-color:#a39aff"/><stop offset=".71" style="stop-color:#b790ff"/><stop offset=".858" style="stop-color:#c489ff"/><stop offset="1" style="stop-color:#c887ff"/></linearGradient><path d="m199.7 408.2-92.2-54.1V245.9l92.2-54.1 92.2 54.1v108.2zm-79.4-61.7 79.1 46.5 79.1-46.5v-92.9l-79-46.5-79.3 46.5c.1-.1.1 92.9.1 92.9" style="fill:url(#a)"/><linearGradient id="b" x1="185.354" x2="277.202" y1="542.013" y2="488.984" gradientTransform="translate(-20.96 -225.764)" gradientUnits="userSpaceOnUse"><stop offset="0" style="stop-color:#10e7ff"/><stop offset=".103" style="stop-color:#33d5ff"/><stop offset=".255" style="stop-color:#60bdff"/><stop offset=".408" style="stop-color:#86aaff"/><stop offset=".56" style="stop-color:#a39aff"/><stop offset=".71" style="stop-color:#b790ff"/><stop offset=".858" style="stop-color:#c489ff"/><stop offset="1" style="stop-color:#c887ff"/></linearGradient><path d="m239.4 270.6-32.3 56.8 10.5 18.5 42.8-75.3zm-36.1 0L171 327.4l10.5 18.5 42.8-75.3zm-64.4 0 42.8 75.3 10.5-18.5-32.3-56.8zm0 0 42.8 75.3 10.5-18.5-32.3-56.8zm64.4 0L171 327.4l10.5 18.5 42.8-75.3z" style="fill:url(#b)"/></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.0" viewBox="0 0 800 600"><path d="M364.7 246.1h16.9L363.2 300h-16.9l-18.5-53.9h17.1l10.2 33h.2zM436 300h-39.4v-53.9h39.2v13.6h-23.6v7.1h20.9V279h-20.9v7.4H436zm41.6-54.8c11.3 0 19.6 5.8 22.1 15.1l-14.7 6.4c-.7-4.2-2.9-7.4-7.6-7.4-5.3 0-9.3 4.4-9.3 14s3.8 14.2 9.3 14.2c4.5 0 6.9-3.4 7.6-7.6l14.7 6.4c-2.5 9.3-10.9 15.1-22.1 15.1-16.2 0-26.1-10.7-26.1-28s9.9-28.2 26.1-28.2m50.3 54.8v-40.3h-16.2v-13.6h48.5v13.6H544V300zm97.7-26.9c0 17.2-10 28-26.1 28-16 0-26.1-10.7-26.1-28s10.2-28 26.1-28c16.1.1 26.1 10.8 26.1 28m-35.4 0c0 8.7 3.3 14.2 9.4 14.2s9.4-5.3 9.4-14.2c0-8.7-3.3-14.2-9.4-14.2s-9.4 5.3-9.4 14.2m84.4 26.9c-1.5-1.8-2-3.4-2.5-6.4l-1.1-6c-.7-3.8-2.5-4.9-5.8-4.9h-6.4V300h-16v-53.9h25.6c12.2 0 20.7 4.7 20.7 16.5 0 7.8-5.3 12.3-11.1 13.4v.2c4.7.7 7.4 3.6 8.5 8.5l2 8.5c.7 2.9 1.6 4.7 3.4 6.7.1.1-17.3.1-17.3.1m-8.2-40.7h-7.8V270h7.8c3.8 0 5.8-1.6 5.8-5.4 0-3.5-1.8-5.3-5.8-5.3m-321.5 81.2c3.3.4 5.6 2.4 5.6 6 0 4.4-2.7 7.3-8.7 7.3h-9.3v-26.1h8.9c5.1 0 8.2 2.4 8.2 6.9 0 3.1-2 5.3-4.7 5.9m-9.1-1.1h5.4c3.3 0 5.1-1.5 5.1-4.5s-1.8-4.5-5.1-4.5h-5.4zm0 11.6h5.8c3.6 0 5.4-1.6 5.4-4.5s-2-4.5-5.4-4.5h-5.8zm28-10.7 7.1-12.7h3.4l-8.9 15.8v10.2h-3.3v-10.2l-9.1-15.8h3.6zm26.7-12.7h7.6c7.3 0 12.7 4 12.7 12.9s-5.4 13.1-12.7 13.1h-7.6zm3.2 23.2h4.4c4.7 0 9.3-2.5 9.3-10.3s-4.5-10.2-9.3-10.2h-4.4zm36.2-4.3H419l-2.5 7.3h-3.3l9.4-26.1h3.6l9.4 26.1h-3.3zm-10-2.9h8.9l-4.4-12.5zm24.1 10.1v-23.2h-8.7v-2.9h20.9v2.9h-8.7v23.2zm28.3-7.2h-10.9l-2.5 7.3h-3.3l9.4-26.1h3.6l9.4 26.1h-3.3zm-9.8-2.9h8.9l-4.4-12.5zm20.7-16h7.6c7.3 0 12.7 4 12.7 12.9s-5.4 13.1-12.7 13.1h-7.6zm3.3 23.2h4.4c4.7 0 9.3-2.5 9.3-10.3s-4.5-10.2-9.3-10.2h-4.4zm44.1-10.1c0 8.4-4.5 13.4-11.3 13.4S508 349 508 340.7c0-8.4 4.5-13.4 11.3-13.4s11.3 5 11.3 13.4m-19 0c0 6.4 2.7 10.7 7.8 10.7s7.8-4.4 7.8-10.7c0-6.4-2.7-10.7-7.8-10.7s-7.8 4.3-7.8 10.7m45-.2v13.1H554l-.5-3.8c-.9 2.7-3.8 4.4-7.3 4.4-6.5 0-11.1-4.9-11.1-13.4 0-8.7 4.9-13.6 11.4-13.6 4.7 0 8 2 9.4 6l-2.9 1.6c-.9-3.1-3.4-4.9-6.7-4.9-5.1 0-8 4-8 10.7 0 6.4 2.5 10.7 8 10.7 3.4 0 6.7-1.8 6.7-6.5V343h-6.4v-2.7h9.8z"/><linearGradient id="a" x1="128.046" x2="313.226" y1="579.207" y2="472.293" gradientTransform="translate(-20.96 -225.764)" gradientUnits="userSpaceOnUse"><stop offset="0" style="stop-color:#10e7ff"/><stop offset=".103" style="stop-color:#33d5ff"/><stop offset=".255" style="stop-color:#60bdff"/><stop offset=".408" style="stop-color:#86aaff"/><stop offset=".56" style="stop-color:#a39aff"/><stop offset=".71" style="stop-color:#b790ff"/><stop offset=".858" style="stop-color:#c489ff"/><stop offset="1" style="stop-color:#c887ff"/></linearGradient><path d="m199.7 408.2-92.2-54.1V245.9l92.2-54.1 92.2 54.1v108.2zm-79.4-61.7 79.1 46.5 79.1-46.5v-92.9l-79-46.5-79.3 46.5c.1-.1.1 92.9.1 92.9" style="fill:url(#a)"/><linearGradient id="b" x1="185.354" x2="277.202" y1="542.013" y2="488.984" gradientTransform="translate(-20.96 -225.764)" gradientUnits="userSpaceOnUse"><stop offset="0" style="stop-color:#10e7ff"/><stop offset=".103" style="stop-color:#33d5ff"/><stop offset=".255" style="stop-color:#60bdff"/><stop offset=".408" style="stop-color:#86aaff"/><stop offset=".56" style="stop-color:#a39aff"/><stop offset=".71" style="stop-color:#b790ff"/><stop offset=".858" style="stop-color:#c489ff"/><stop offset="1" style="stop-color:#c887ff"/></linearGradient><path d="m239.4 270.6-32.3 56.8 10.5 18.5 42.8-75.3zm-36.1 0L171 327.4l10.5 18.5 42.8-75.3zm-64.4 0 42.8 75.3 10.5-18.5-32.3-56.8zm0 0 42.8 75.3 10.5-18.5-32.3-56.8zm64.4 0L171 327.4l10.5 18.5 42.8-75.3z" style="fill:url(#b)"/></svg>

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

@@ -47,7 +47,9 @@ function QueryAggregationOptions({
 
 		if (
 			isNonMetricSource &&
-			(panelType === PANEL_TYPES.TABLE || panelType === PANEL_TYPES.PIE)
+			(panelType === PANEL_TYPES.TABLE ||
+				panelType === PANEL_TYPES.SCATTER ||
+				panelType === PANEL_TYPES.PIE)
 		) {
 			return { hidden: true, disabled: false, pinned: false };
 		}

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

@@ -115,6 +115,7 @@ export const QueryV2 = forwardRef(function QueryV2(
 		() =>
 			dataSource === DataSource.METRICS &&
 			(panelType === PANEL_TYPES.TABLE ||
+				panelType === PANEL_TYPES.SCATTER ||
 				panelType === PANEL_TYPES.PIE ||
 				panelType === PANEL_TYPES.VALUE),
 		[dataSource, panelType],

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

@@ -14,6 +14,17 @@ jest.mock('../QueryV2/QueryAggregation/QueryAggregationSelect', () => ({
 const queryData = initialQueriesMap.traces.builder
 	.queryData[0] as IBuilderQuery;
 
+function renderFor(panelType: PANEL_TYPES, dataSource: DataSource): void {
+	render(
+		<QueryAggregationOptions
+			dataSource={dataSource}
+			panelType={panelType}
+			onAggregationIntervalChange={jest.fn()}
+			queryData={queryData}
+		/>,
+	);
+}
+
 describe('QueryAggregationOptions step interval placeholder', () => {
 	it('shows the configured placeholder', () => {
 		render(
@@ -34,14 +45,27 @@ describe('QueryAggregationOptions step interval placeholder', () => {
 	});
 
 	it('falls back to Auto', () => {
-		render(
-			<QueryAggregationOptions
-				dataSource={DataSource.TRACES}
-				panelType={PANEL_TYPES.TIME_SERIES}
-				onAggregationIntervalChange={jest.fn()}
-				queryData={queryData}
-			/>,
-		);
+		renderFor(PANEL_TYPES.TIME_SERIES, DataSource.TRACES);
 		expect(screen.getByPlaceholderText('Auto')).toBeInTheDocument();
 	});
 });
+
+describe('QueryAggregationOptions step interval', () => {
+	it.each([PANEL_TYPES.TABLE, PANEL_TYPES.SCATTER, PANEL_TYPES.PIE])(
+		'is hidden for a %s panel over traces, which reduces the whole window',
+		(panelType) => {
+			renderFor(panelType, DataSource.TRACES);
+			expect(screen.queryByText('every')).not.toBeInTheDocument();
+		},
+	);
+
+	it('stays for a scatter plot over metrics, where it sets the series step', () => {
+		renderFor(PANEL_TYPES.SCATTER, DataSource.METRICS);
+		expect(screen.getByText('every')).toBeInTheDocument();
+	});
+
+	it('stays for a time series over traces', () => {
+		renderFor(PANEL_TYPES.TIME_SERIES, DataSource.TRACES);
+		expect(screen.getByText('every')).toBeInTheDocument();
+	});
+});

frontend/src/components/QuickFilters/QuickFiltersLayout/__tests__/QuickFiltersLayout.test.tsx

@@ -1,7 +1,7 @@
 import { Button } from '@signozhq/ui/button';
 import { SavedviewtypesSourceDTO } from 'api/generated/services/sigNoz.schemas';
 import { useSavedViewEnabled } from 'hooks/useSavedViewEnabled';
-import { render, screen, userEvent, waitFor } from 'tests/test-utils';
+import { render, screen, userEvent } from 'tests/test-utils';
 
 import { QuickFiltersSource } from '../../types';
 import QuickFiltersLayout from '../QuickFiltersLayout';
@@ -197,11 +197,6 @@ describe('QuickFiltersLayout', () => {
 			expect(screen.queryByTestId('saved-views-panel')).not.toBeInTheDocument();
 			expect(drawer()).not.toHaveClass('isOpen');
 
-			await waitFor(() =>
-				expect(screen.getByTestId('saved-views-open')).not.toHaveAttribute(
-					'aria-busy',
-				),
-			);
 			await user.click(screen.getByTestId('saved-views-open'));
 
 			expect(screen.getByTestId('saved-views-panel')).toBeInTheDocument();
@@ -232,11 +227,6 @@ describe('QuickFiltersLayout', () => {
 				'data-source',
 				SavedviewtypesSourceDTO.traces,
 			);
-			await waitFor(() =>
-				expect(screen.getByTestId('saved-views-open')).not.toHaveAttribute(
-					'aria-busy',
-				),
-			);
 			await userEvent.setup().click(screen.getByTestId('saved-views-open'));
 			expect(screen.getByTestId('saved-views-panel')).toHaveAttribute(
 				'data-source',

frontend/src/constants/panelTypes.ts

@@ -36,6 +36,7 @@ export const getComponentForPanelType = (
 		[PANEL_TYPES.HEATMAP]: null,
 		// Dashboards v2 renders this kind; nothing reaches the V1 chart map for it.
 		[PANEL_TYPES.TEXT]: null,
+		[PANEL_TYPES.SCATTER]: null,
 		[PANEL_TYPES.EMPTY_WIDGET]: null,
 	};
 

frontend/src/constants/queryBuilder.ts

@@ -337,6 +337,7 @@ export enum PANEL_TYPES {
 	TRACE = 'trace',
 	BAR = 'bar',
 	AREA = 'area',
+	SCATTER = 'scatter',
 	PIE = 'pie',
 	HISTOGRAM = 'histogram',
 	HEATMAP = 'heatmap',

frontend/src/container/OnboardingV2Container/onboarding-configs/onboarding-config-with-links.ts

@@ -560,7 +560,7 @@ const onboardingConfigWithLinks = [
 					key: 'springboot',
 					label: 'Spring Boot',
 					imgUrl: springbootUrl,
-					link: '/docs/instrumentation/java/opentelemetry-java/',
+					link: '/docs/instrumentation/opentelemetry-springboot/',
 					question: {
 						desc: 'What is your Environment?',
 						type: 'select',
@@ -570,25 +570,25 @@ const onboardingConfigWithLinks = [
 								key: 'vm',
 								label: 'VM',
 								imgUrl: vmUrl,
-								link: '/docs/instrumentation/java/opentelemetry-java/',
+								link: '/docs/instrumentation/opentelemetry-springboot/',
 							},
 							{
 								key: 'k8s',
 								label: 'Kubernetes',
 								imgUrl: kubernetesUrl,
-								link: '/docs/instrumentation/java/opentelemetry-java/',
+								link: '/docs/instrumentation/opentelemetry-springboot/',
 							},
 							{
 								key: 'docker',
 								label: 'Docker',
 								imgUrl: dockerUrl,
-								link: '/docs/instrumentation/java/opentelemetry-java/',
+								link: '/docs/instrumentation/opentelemetry-springboot/',
 							},
 							{
 								key: 'windows',
 								label: 'Windows',
 								imgUrl: windowsUrl,
-								link: '/docs/instrumentation/java/opentelemetry-java/',
+								link: '/docs/instrumentation/opentelemetry-springboot/',
 							},
 						],
 					},
@@ -597,7 +597,7 @@ const onboardingConfigWithLinks = [
 					key: 'tomcat',
 					label: 'Tomcat',
 					imgUrl: tomcatUrl,
-					link: '/docs/instrumentation/java/opentelemetry-tomcat/',
+					link: '/docs/instrumentation/opentelemetry-tomcat/',
 					question: {
 						desc: 'What is your Environment?',
 						type: 'select',
@@ -607,25 +607,25 @@ const onboardingConfigWithLinks = [
 								key: 'vm',
 								label: 'VM',
 								imgUrl: vmUrl,
-								link: '/docs/instrumentation/java/opentelemetry-tomcat/',
+								link: '/docs/instrumentation/opentelemetry-tomcat/',
 							},
 							{
 								key: 'k8s',
 								label: 'Kubernetes',
 								imgUrl: kubernetesUrl,
-								link: '/docs/instrumentation/java/opentelemetry-tomcat/',
+								link: '/docs/instrumentation/opentelemetry-tomcat/',
 							},
 							{
 								key: 'docker',
 								label: 'Docker',
 								imgUrl: dockerUrl,
-								link: '/docs/instrumentation/java/opentelemetry-tomcat/',
+								link: '/docs/instrumentation/opentelemetry-tomcat/',
 							},
 							{
 								key: 'windows',
 								label: 'Windows',
 								imgUrl: windowsUrl,
-								link: '/docs/instrumentation/java/opentelemetry-tomcat/',
+								link: '/docs/instrumentation/opentelemetry-tomcat/',
 							},
 						],
 					},
@@ -634,7 +634,7 @@ const onboardingConfigWithLinks = [
 					key: 'jboss',
 					label: 'JBoss/WildFly',
 					imgUrl: jbossUrl,
-					link: '/docs/instrumentation/java/opentelemetry-jboss/',
+					link: '/docs/instrumentation/opentelemetry-jboss/',
 					question: {
 						desc: 'What is your Environment?',
 						type: 'select',
@@ -644,25 +644,25 @@ const onboardingConfigWithLinks = [
 								key: 'vm',
 								label: 'VM',
 								imgUrl: vmUrl,
-								link: '/docs/instrumentation/java/opentelemetry-jboss/',
+								link: '/docs/instrumentation/opentelemetry-jboss/',
 							},
 							{
 								key: 'k8s',
 								label: 'Kubernetes',
 								imgUrl: kubernetesUrl,
-								link: '/docs/instrumentation/java/opentelemetry-jboss/',
+								link: '/docs/instrumentation/opentelemetry-jboss/',
 							},
 							{
 								key: 'docker',
 								label: 'Docker',
 								imgUrl: dockerUrl,
-								link: '/docs/instrumentation/java/opentelemetry-jboss/',
+								link: '/docs/instrumentation/opentelemetry-jboss/',
 							},
 							{
 								key: 'windows',
 								label: 'Windows',
 								imgUrl: windowsUrl,
-								link: '/docs/instrumentation/java/opentelemetry-jboss/',
+								link: '/docs/instrumentation/opentelemetry-jboss/',
 							},
 						],
 					},
@@ -671,7 +671,7 @@ const onboardingConfigWithLinks = [
 					key: 'opentelemetry-quarkus',
 					label: 'Quarkus',
 					imgUrl: quarkusUrl,
-					link: '/docs/instrumentation/java/opentelemetry-quarkus/',
+					link: '/docs/instrumentation/opentelemetry-quarkus/',
 					question: {
 						desc: 'What is your Environment?',
 						type: 'select',
@@ -681,25 +681,25 @@ const onboardingConfigWithLinks = [
 								key: 'vm',
 								label: 'VM',
 								imgUrl: vmUrl,
-								link: '/docs/instrumentation/java/opentelemetry-quarkus/',
+								link: '/docs/instrumentation/opentelemetry-quarkus/',
 							},
 							{
 								key: 'k8s',
 								label: 'Kubernetes',
 								imgUrl: kubernetesUrl,
-								link: '/docs/instrumentation/java/opentelemetry-quarkus/',
+								link: '/docs/instrumentation/opentelemetry-quarkus/',
 							},
 							{
 								key: 'docker',
 								label: 'Docker',
 								imgUrl: dockerUrl,
-								link: '/docs/instrumentation/java/opentelemetry-quarkus/',
+								link: '/docs/instrumentation/opentelemetry-quarkus/',
 							},
 							{
 								key: 'windows',
 								label: 'Windows',
 								imgUrl: windowsUrl,
-								link: '/docs/instrumentation/java/opentelemetry-quarkus/',
+								link: '/docs/instrumentation/opentelemetry-quarkus/',
 							},
 						],
 					},
@@ -708,7 +708,7 @@ const onboardingConfigWithLinks = [
 					key: 'Others',
 					label: 'Others',
 					imgUrl: javaOthersUrl,
-					link: '/docs/instrumentation/java/opentelemetry-java/',
+					link: '/docs/instrumentation/opentelemetry-java/',
 					question: {
 						desc: 'What is your Environment?',
 						type: 'select',
@@ -718,25 +718,25 @@ const onboardingConfigWithLinks = [
 								key: 'vm',
 								label: 'VM',
 								imgUrl: vmUrl,
-								link: '/docs/instrumentation/java/opentelemetry-java/',
+								link: '/docs/instrumentation/opentelemetry-java/',
 							},
 							{
 								key: 'k8s',
 								label: 'Kubernetes',
 								imgUrl: kubernetesUrl,
-								link: '/docs/instrumentation/java/opentelemetry-java/',
+								link: '/docs/instrumentation/opentelemetry-java/',
 							},
 							{
 								key: 'docker',
 								label: 'Docker',
 								imgUrl: dockerUrl,
-								link: '/docs/instrumentation/java/opentelemetry-java/',
+								link: '/docs/instrumentation/opentelemetry-java/',
 							},
 							{
 								key: 'windows',
 								label: 'Windows',
 								imgUrl: windowsUrl,
-								link: '/docs/instrumentation/java/opentelemetry-java/',
+								link: '/docs/instrumentation/opentelemetry-java/',
 							},
 						],
 					},
@@ -872,7 +872,7 @@ const onboardingConfigWithLinks = [
 					key: 'nodejs-nestjs',
 					label: 'NodeJs/NestJS',
 					imgUrl: nodejsUrl,
-					link: '/docs/instrumentation/javascript/opentelemetry-nodejs/',
+					link: '/docs/instrumentation/opentelemetry-javascript/',
 					question: {
 						desc: 'What is your Environment?',
 						type: 'select',
@@ -882,25 +882,25 @@ const onboardingConfigWithLinks = [
 								key: 'vm',
 								label: 'VM',
 								imgUrl: vmUrl,
-								link: '/docs/instrumentation/javascript/opentelemetry-nodejs/',
+								link: '/docs/instrumentation/opentelemetry-javascript/',
 							},
 							{
 								key: 'k8s',
 								label: 'Kubernetes',
 								imgUrl: kubernetesUrl,
-								link: '/docs/instrumentation/javascript/opentelemetry-nodejs/',
+								link: '/docs/instrumentation/opentelemetry-javascript/',
 							},
 							{
 								key: 'docker',
 								label: 'Docker',
 								imgUrl: dockerUrl,
-								link: '/docs/instrumentation/javascript/opentelemetry-nodejs/',
+								link: '/docs/instrumentation/opentelemetry-javascript/',
 							},
 							{
 								key: 'windows',
 								label: 'Windows',
 								imgUrl: windowsUrl,
-								link: '/docs/instrumentation/javascript/opentelemetry-nodejs/',
+								link: '/docs/instrumentation/opentelemetry-javascript/',
 							},
 						],
 					},
@@ -909,7 +909,7 @@ const onboardingConfigWithLinks = [
 					key: 'nextjs',
 					label: 'NextJS',
 					imgUrl: nextjsUrl,
-					link: '/docs/instrumentation/javascript/opentelemetry-nextjs/',
+					link: '/docs/instrumentation/opentelemetry-nextjs/',
 					question: {
 						desc: 'What is your Environment?',
 						type: 'select',
@@ -919,25 +919,25 @@ const onboardingConfigWithLinks = [
 								key: 'vm',
 								label: 'VM',
 								imgUrl: vmUrl,
-								link: '/docs/instrumentation/javascript/opentelemetry-nextjs/',
+								link: '/docs/instrumentation/opentelemetry-nextjs/',
 							},
 							{
 								key: 'k8s',
 								label: 'Kubernetes',
 								imgUrl: kubernetesUrl,
-								link: '/docs/instrumentation/javascript/opentelemetry-nextjs/',
+								link: '/docs/instrumentation/opentelemetry-nextjs/',
 							},
 							{
 								key: 'docker',
 								label: 'Docker',
 								imgUrl: dockerUrl,
-								link: '/docs/instrumentation/javascript/opentelemetry-nextjs/',
+								link: '/docs/instrumentation/opentelemetry-nextjs/',
 							},
 							{
 								key: 'windows',
 								label: 'Windows',
 								imgUrl: windowsUrl,
-								link: '/docs/instrumentation/javascript/opentelemetry-nextjs/',
+								link: '/docs/instrumentation/opentelemetry-nextjs/',
 							},
 						],
 					},
@@ -946,7 +946,7 @@ const onboardingConfigWithLinks = [
 					key: 'nuxtjs',
 					label: 'NuxtJS',
 					imgUrl: nuxtjsUrl,
-					link: '/docs/instrumentation/javascript/opentelemetry-nuxtjs/',
+					link: '/docs/instrumentation/opentelemetry-nuxtjs/',
 					question: {
 						desc: 'What is your Environment?',
 						type: 'select',
@@ -956,25 +956,25 @@ const onboardingConfigWithLinks = [
 								key: 'vm',
 								label: 'VM',
 								imgUrl: vmUrl,
-								link: '/docs/instrumentation/javascript/opentelemetry-nuxtjs/',
+								link: '/docs/instrumentation/opentelemetry-nuxtjs/',
 							},
 							{
 								key: 'k8s',
 								label: 'Kubernetes',
 								imgUrl: kubernetesUrl,
-								link: '/docs/instrumentation/javascript/opentelemetry-nuxtjs/',
+								link: '/docs/instrumentation/opentelemetry-nuxtjs/',
 							},
 							{
 								key: 'docker',
 								label: 'Docker',
 								imgUrl: dockerUrl,
-								link: '/docs/instrumentation/javascript/opentelemetry-nuxtjs/',
+								link: '/docs/instrumentation/opentelemetry-nuxtjs/',
 							},
 							{
 								key: 'windows',
 								label: 'Windows',
 								imgUrl: windowsUrl,
-								link: '/docs/instrumentation/javascript/opentelemetry-nuxtjs/',
+								link: '/docs/instrumentation/opentelemetry-nuxtjs/',
 							},
 						],
 					},
@@ -983,7 +983,7 @@ const onboardingConfigWithLinks = [
 					key: 'react-native',
 					label: 'React Native',
 					imgUrl: reactjsUrl,
-					link: '/docs/instrumentation/javascript/opentelemetry-react-native/',
+					link: '/docs/instrumentation/opentelemetry-react-native/',
 				},
 			],
 		},
@@ -1298,7 +1298,7 @@ const onboardingConfigWithLinks = [
 			'resque',
 		],
 		id: 'ruby',
-		link: '/docs/instrumentation/opentelemetry-ruby/',
+		link: '/docs/instrumentation/opentelemetry-ruby-on-rails/',
 		question: {
 			desc: 'What is your Environment?',
 			type: 'select',
@@ -1308,25 +1308,25 @@ const onboardingConfigWithLinks = [
 					key: 'vm',
 					label: 'VM',
 					imgUrl: vmUrl,
-					link: '/docs/instrumentation/opentelemetry-ruby/',
+					link: '/docs/instrumentation/opentelemetry-ruby-on-rails/',
 				},
 				{
 					key: 'k8s',
 					label: 'Kubernetes',
 					imgUrl: kubernetesUrl,
-					link: '/docs/instrumentation/opentelemetry-ruby/',
+					link: '/docs/instrumentation/opentelemetry-ruby-on-rails/',
 				},
 				{
 					key: 'docker',
 					label: 'Docker',
 					imgUrl: dockerUrl,
-					link: '/docs/instrumentation/opentelemetry-ruby/',
+					link: '/docs/instrumentation/opentelemetry-ruby-on-rails/',
 				},
 				{
 					key: 'windows',
 					label: 'Windows',
 					imgUrl: windowsUrl,
-					link: '/docs/instrumentation/opentelemetry-ruby/',
+					link: '/docs/instrumentation/opentelemetry-ruby-on-rails/',
 				},
 			],
 		},
@@ -2292,7 +2292,7 @@ const onboardingConfigWithLinks = [
 			'python structured logging',
 			'python-logs-auto-instrumentation',
 		],
-		link: '/docs/logs-management/send-logs/python-logs/',
+		link: '/docs/userguide/python-logs-auto-instrumentation/',
 	},
 	{
 		dataSource: 'otel-java-sdk',
@@ -2323,7 +2323,7 @@ const onboardingConfigWithLinks = [
 			'Logback',
 			'log4j',
 		],
-		link: '/docs/logs-management/send-logs/java-logs/',
+		link: '/docs/userguide/collecting_application_logs_otel_sdk_java/',
 	},
 	{
 		dataSource: 'nodejs-logs',
@@ -2463,7 +2463,7 @@ const onboardingConfigWithLinks = [
 			'linux',
 		],
 		imgUrl: hostmetricsUrl,
-		link: '/docs/infrastructure-monitoring/user-guides/hostmetrics/',
+		link: '/docs/userguide/hostmetrics/',
 	},
 	{
 		dataSource: 'k8s-metrics',
@@ -2495,7 +2495,7 @@ const onboardingConfigWithLinks = [
 			'telemetry',
 		],
 		imgUrl: kubernetesUrl,
-		link: '/docs/infrastructure-monitoring/user-guides/k8s-metrics/',
+		link: '/docs/userguide/k8s-metrics/',
 	},
 	{
 		dataSource: 'docker-container-metrics',
@@ -2583,7 +2583,7 @@ const onboardingConfigWithLinks = [
 								key: 'aws-ec2-metrics-manual',
 								label: 'Manual Setup',
 								imgUrl: ec2Url,
-								link: '/docs/opentelemetry-collection-agents/vm/install/',
+								link: '/docs/tutorial/opentelemetry-binary-usage-in-virtual-machine/',
 							},
 						],
 					},
@@ -2772,7 +2772,7 @@ const onboardingConfigWithLinks = [
 			'vpc-logs',
 		],
 		imgUrl: vpcUrl,
-		link: '/docs/aws-monitoring/vpc/',
+		link: '/docs/aws-monitoring/vpc-logs/',
 	},
 	{
 		dataSource: 'aws-rds',
@@ -3837,7 +3837,7 @@ const onboardingConfigWithLinks = [
 			'traces',
 			'tracing',
 		],
-		link: '/docs/openai-monitoring/',
+		link: '/docs/llm/opentelemetry-openai-monitoring/',
 	},
 	{
 		dataSource: 'codex-monitoring',
@@ -4779,7 +4779,7 @@ const onboardingConfigWithLinks = [
 		link: '/docs/instrumentation/mobile-instrumentation/opentelemetry-flutter/',
 	},
 	{
-		dataSource: 'ios-swift',
+		dataSource: 'swift',
 		label: 'iOS Swift',
 		imgUrl: swiftMonitoringUrl,
 		tags: ['mobile app monitoring'],
@@ -4808,7 +4808,6 @@ const onboardingConfigWithLinks = [
 			'traces',
 			'tracing',
 		],
-		id: 'ios-swift',
 		link: '/docs/instrumentation/mobile-instrumentation/opentelemetry-swiftui/',
 	},
 	{
@@ -5474,7 +5473,7 @@ const onboardingConfigWithLinks = [
 			'telemetry',
 		],
 		id: 'hasura',
-		link: '/docs/integrations/outposts/hasura/',
+		link: '/docs/integrations/opentelemetry-hasura/',
 	},
 	{
 		dataSource: 'opencode-observability',
@@ -5936,7 +5935,7 @@ const onboardingConfigWithLinks = [
 			'metrics',
 			'monitoring',
 		],
-		link: '/docs/integrations/outposts/flyio/',
+		link: '/docs/integrations/flyio/',
 	},
 	{
 		dataSource: 'envoy',
@@ -6514,7 +6513,7 @@ const onboardingConfigWithLinks = [
 			'tracing',
 		],
 		id: 'openclaw-observability',
-		link: '/docs/openclaw-observability/',
+		link: '/docs/openclaw-monitoring/',
 	},
 	{
 		dataSource: 'claude-agent-monitoring',
@@ -6556,7 +6555,7 @@ const onboardingConfigWithLinks = [
 			'render monitoring',
 		],
 		id: 'render-metrics',
-		link: '/docs/integrations/outposts/render/',
+		link: '/docs/metrics-management/render-metrics/',
 	},
 	{
 		dataSource: 'cert-manager',
@@ -6580,7 +6579,7 @@ const onboardingConfigWithLinks = [
 			'tls',
 		],
 		id: 'cert-manager',
-		link: '/docs/infrastructure-monitoring/user-guides/cert-manager/',
+		link: '/docs/infrastructure-monitoring/cert-manager/',
 	},
 	{
 		dataSource: 'pgbouncer',

frontend/src/container/RolesSettings/hooks/__tests__/useRolePermissions.test.ts

@@ -329,7 +329,7 @@ describe('transformTransactionGroupsToResourcePermissions', () => {
 	it('returns all resources from RESOURCE_ORDER even with empty transaction groups', () => {
 		const result = transformTransactionGroupsToResourcePermissions([]);
 
-		expect(result).toHaveLength(12);
+		expect(result).toHaveLength(11);
 		expect(result.map((r) => r.resourceKind)).toStrictEqual([
 			'factor-api-key',
 			'dashboard',
@@ -339,7 +339,6 @@ describe('transformTransactionGroupsToResourcePermissions', () => {
 			'metrics',
 			'quick-filter',
 			'role',
-			'saved-view',
 			'serviceaccount',
 			'subscription',
 			'traces',
@@ -423,7 +422,7 @@ describe('createEmptyRolePermissions', () => {
 	it('creates permissions for all resources in RESOURCE_ORDER', () => {
 		const result = createEmptyRolePermissions();
 
-		expect(result).toHaveLength(12);
+		expect(result).toHaveLength(11);
 		expect(result.map((r) => r.resourceKind)).toStrictEqual([
 			'factor-api-key',
 			'dashboard',
@@ -433,7 +432,6 @@ describe('createEmptyRolePermissions', () => {
 			'metrics',
 			'quick-filter',
 			'role',
-			'saved-view',
 			'serviceaccount',
 			'subscription',
 			'traces',

frontend/src/container/RolesSettings/permissions.config.ts

@@ -10,7 +10,6 @@ import {
 	Logs,
 	Receipt,
 	Shield,
-	TowerControl,
 } from '@signozhq/icons';
 
 import permissionsType from 'lib/authz/hooks/useAuthZ/permissions.type';
@@ -96,14 +95,6 @@ export const RESOURCE_PANELS: Record<AuthZResource, ResourcePanelConfig> = {
 			'Type quick filter ID, separate multiple with comma or space',
 		docsAnchor: 'quick-filter',
 	},
-	'saved-view': {
-		label: 'Saved Views',
-		description: 'Saved views in the logs, traces, metrics and meter explorers.',
-		icon: TowerControl,
-		selectorPlaceholder:
-			'Type saved view ID, separate multiple with comma or space',
-		docsAnchor: 'saved-view',
-	},
 	logs: {
 		label: 'Logs',
 		description: 'Log data collected across the workspace.',

frontend/src/container/SavedViews/SaveChangesMenu.tsx

@@ -1,50 +1,41 @@
 import { useMemo } from 'react';
 import { Check } from '@signozhq/icons';
-import AuthZDropdown from 'lib/authz/components/AuthZDropdown/AuthZDropdown';
-import type { AuthZDropdownItemType } from 'lib/authz/components/AuthZDropdown/types';
-import {
-	buildSavedViewUpdatePermission,
-	SavedViewCreatePermission,
-} from 'lib/authz/hooks/useAuthZ/permissions/saved-view.permissions';
+import { Dropdown, type DropdownItemType } from '@signozhq/ui/dropdown';
 
 import SavedViewsIconButton from './SavedViewsIconButton';
 import { SaveChangesMenuProps } from './types';
 
 function SaveChangesMenu({
-	viewId,
 	disabled,
 	onSaveAsNew,
 	onUpdate,
 }: SaveChangesMenuProps): JSX.Element {
-	const items = useMemo<AuthZDropdownItemType[]>(
+	const items = useMemo<DropdownItemType[]>(
 		() => [
 			{
 				type: 'item',
 				value: 'save-as-new',
 				label: 'Save as new view',
-				checks: [SavedViewCreatePermission],
 				onClick: onSaveAsNew,
 			},
 			{
 				type: 'item',
 				value: 'update',
 				label: 'Update selected view',
-				checks: [buildSavedViewUpdatePermission(viewId)],
 				onClick: onUpdate,
 			},
 		],
-		[viewId, onSaveAsNew, onUpdate],
+		[onSaveAsNew, onUpdate],
 	);
 
 	return (
-		<AuthZDropdown
+		<Dropdown
 			items={items}
 			nativeButton
 			align="end"
 			side="bottom"
 			disabled={disabled}
 			disabledTooltip="Saving the view"
-			testId="saved-views-save-changes"
 		>
 			<SavedViewsIconButton
 				title="Save changes"
@@ -52,7 +43,7 @@ function SaveChangesMenu({
 				color="warning"
 				testId="saved-views-save-changes"
 			/>
-		</AuthZDropdown>
+		</Dropdown>
 	);
 }
 

frontend/src/container/SavedViews/SavedViewsEmptyState.tsx

@@ -1,8 +1,7 @@
 import { useState } from 'react';
 import { Plus } from '@signozhq/icons';
+import { Button } from '@signozhq/ui/button';
 import { Typography } from '@signozhq/ui/typography';
-import AuthZButton from 'lib/authz/components/AuthZButton/AuthZButton';
-import { SavedViewCreatePermission } from 'lib/authz/hooks/useAuthZ/permissions/saved-view.permissions';
 
 import SaveViewModal from './SaveViewModal';
 import { SavedViewsEmptyStateProps } from './types';
@@ -32,8 +31,7 @@ function SavedViewsEmptyState({
 			<Typography.Text className={styles.stateText}>
 				Save the current view to open it later.
 			</Typography.Text>
-			<AuthZButton
-				checks={[SavedViewCreatePermission]}
+			<Button
 				variant="outlined"
 				color="secondary"
 				size="sm"
@@ -42,7 +40,7 @@ function SavedViewsEmptyState({
 				testId="saved-views-list-create"
 			>
 				Create view
-			</AuthZButton>
+			</Button>
 			{isModalOpen && (
 				<SaveViewModal
 					mode="create"

frontend/src/container/SavedViews/SavedViewsHeader.tsx

@@ -5,17 +5,9 @@ import { Skeleton } from '@signozhq/ui/skeleton';
 import { toast } from '@signozhq/ui/sonner';
 import { Tooltip } from '@signozhq/ui/tooltip';
 import { SavedviewtypesSourceDTO } from 'api/generated/services/sigNoz.schemas';
-import { useGetSavedViewParams } from 'hooks/saveViews/useGetSavedViewParams';
-import AuthZTooltip from 'lib/authz/components/AuthZTooltip/AuthZTooltip';
-import {
-	buildSavedViewReadPermission,
-	SavedViewCreatePermission,
-	SavedViewListPermission,
-} from 'lib/authz/hooks/useAuthZ/permissions/saved-view.permissions';
 
 import {
 	MY_VIEW_NAME,
-	SAVED_VIEW_FORBIDDEN_NAME,
 	SAVED_VIEW_LOAD_FAILED_NAME,
 	SAVED_VIEW_TOAST_POSITION,
 } from './constants';
@@ -39,16 +31,8 @@ function SavedViewsHeader({
 	onOpenViews?: () => void;
 	onCollapse?: () => void;
 }): JSX.Element {
-	const {
-		view,
-		isLoading,
-		isError,
-		isReadDenied,
-		errorMessage,
-		hasUnsavedChanges,
-	} = useActiveSavedView(source);
-	const { viewKey } = useGetSavedViewParams();
-	const readPermission = buildSavedViewReadPermission(viewKey);
+	const { view, isLoading, isError, hasUnsavedChanges } =
+		useActiveSavedView(source);
 	const { revertView, clearView, createView, updateView, isSaving } =
 		useSavedViewActions(source);
 
@@ -65,27 +49,11 @@ function SavedViewsHeader({
 	const openSaveAsNew = useCallback((): void => setModalMode('saveAsNew'), []);
 	const closeModal = useCallback((): void => setModalMode(null), []);
 
-	let name = view?.spec.displayName ?? MY_VIEW_NAME;
-	if (isReadDenied) {
-		name = SAVED_VIEW_FORBIDDEN_NAME;
-	} else if (isError) {
-		name = SAVED_VIEW_LOAD_FAILED_NAME;
-	}
+	const name = isError
+		? SAVED_VIEW_LOAD_FAILED_NAME
+		: (view?.spec.displayName ?? MY_VIEW_NAME);
 	const isDirty = !isError && !!view && hasUnsavedChanges;
 
-	const nameChip = (
-		<span
-			className={cx(styles.name, {
-				[styles.isDirty]: isDirty,
-				[styles.isError]: isError,
-			})}
-			data-testid="saved-views-name"
-		>
-			{isDirty && <span className={styles.dot} />}
-			<span className={styles.nameText}>{name}</span>
-		</span>
-	);
-
 	return (
 		<div
 			className={cx(styles.header, {
@@ -100,7 +68,6 @@ function SavedViewsHeader({
 					<SavedViewsIconButton
 						title="All views"
 						icon={<List size={14} />}
-						checks={[SavedViewListPermission]}
 						onClick={onOpenViews}
 						testId="saved-views-open"
 					/>
@@ -112,10 +79,19 @@ function SavedViewsHeader({
 						className={styles.skeleton}
 						testId="saved-views-loading"
 					/>
-				) : isReadDenied ? (
-					<AuthZTooltip checks={[readPermission]}>{nameChip}</AuthZTooltip>
 				) : (
-					<Tooltip title={errorMessage ?? name}>{nameChip}</Tooltip>
+					<Tooltip title={name}>
+						<span
+							className={cx(styles.name, {
+								[styles.isDirty]: isDirty,
+								[styles.isError]: isError,
+							})}
+							data-testid="saved-views-name"
+						>
+							{isDirty && <span className={styles.dot} />}
+							<span className={styles.nameText}>{name}</span>
+						</span>
+					</Tooltip>
 				)}
 			</div>
 
@@ -126,7 +102,6 @@ function SavedViewsHeader({
 						icon={<Plus size={14} />}
 						disabled={isLoading}
 						disabledTooltip="Loading views"
-						checks={[SavedViewCreatePermission]}
 						onClick={(): void => setModalMode('create')}
 						testId="saved-views-create"
 					/>
@@ -142,7 +117,6 @@ function SavedViewsHeader({
 				{view && isDirty && (
 					<>
 						<SaveChangesMenu
-							viewId={view.id}
 							disabled={isSaving}
 							onSaveAsNew={openSaveAsNew}
 							onUpdate={(): void => {

frontend/src/container/SavedViews/SavedViewsIconButton.tsx

@@ -1,7 +1,6 @@
 import { forwardRef } from 'react';
 import { Button, type VariantColorType } from '@signozhq/ui/button';
 import { Tooltip } from '@signozhq/ui/tooltip';
-import AuthZButton from 'lib/authz/components/AuthZButton/AuthZButton';
 
 import { SavedViewsIconButtonProps } from './types';
 
@@ -26,33 +25,11 @@ const SavedViewsIconButton = forwardRef<
 		color = 'secondary',
 		disabled,
 		disabledTooltip,
-		checks,
 		onClick,
 		...triggerProps
 	},
 	ref,
 ): JSX.Element {
-	if (checks?.length) {
-		return (
-			<Tooltip title={title}>
-				<AuthZButton
-					checks={checks}
-					{...VARIANT_COLORS[color]}
-					size="sm"
-					icon
-					aria-label={title}
-					disabled={disabled}
-					// AuthZButton skips its checks while a block reason is set.
-					disabledTooltip={disabled ? disabledTooltip : undefined}
-					onClick={onClick}
-					testId={testId}
-				>
-					{icon}
-				</AuthZButton>
-			</Tooltip>
-		);
-	}
-
 	return (
 		<Tooltip title={title}>
 			<Button

frontend/src/container/SavedViews/SavedViewsList.module.scss

@@ -41,7 +41,7 @@
 .row {
 	display: flex;
 	align-items: center;
-	gap: var(--spacing-4);
+	gap: var(--spacing-2);
 	height: var(--spacing-16);
 	padding-right: var(--spacing-4);
 	border-radius: var(--radius-2);
@@ -71,7 +71,7 @@
 
 .row:hover .rowMenu,
 .row:focus-within .rowMenu,
-.rowMenu:has([data-popup-open]) {
+.rowMenu:has([data-state='open']) {
 	width: auto;
 	opacity: 1;
 }

frontend/src/container/SavedViews/SavedViewsList.tsx

@@ -40,14 +40,8 @@ function SavedViewsList({
 	const saveNewView = useSaveNewView(createView);
 	const { createdByMe, createdByOthers, isLoading, isError, refetch } =
 		useSavedViewsList(source, search);
-	const {
-		copyViewLink,
-		copyViewId,
-		renameView,
-		deleteView,
-		isRenaming,
-		isDeleting,
-	} = useSavedViewRowActions(source);
+	const { copyViewLink, renameView, deleteView, isRenaming, isDeleting } =
+		useSavedViewRowActions(source);
 	const [pendingAction, setPendingAction] =
 		useState<PendingSavedViewAction | null>(null);
 	const listRef = useRef<HTMLDivElement>(null);
@@ -85,14 +79,10 @@ function SavedViewsList({
 				copyViewLink(view);
 				return;
 			}
-			if (key === 'copyId') {
-				copyViewId(view);
-				return;
-			}
 			closeHoverCard();
 			setPendingAction({ key, view });
 		},
-		[copyViewLink, copyViewId, closeHoverCard],
+		[copyViewLink, closeHoverCard],
 	);
 
 	const closePendingAction = useCallback((): void => setPendingAction(null), []);

frontend/src/container/SavedViews/SavedViewsListRow.tsx

@@ -1,8 +1,6 @@
 import cx from 'classnames';
 import { Undo2 } from '@signozhq/icons';
-import AuthZButton from 'lib/authz/components/AuthZButton/AuthZButton';
-import { buildSavedViewReadPermission } from 'lib/authz/hooks/useAuthZ/permissions/saved-view.permissions';
-import { useAuthZ } from 'lib/authz/hooks/useAuthZ/useAuthZ';
+import { Button } from '@signozhq/ui/button';
 
 import SavedViewsRowButton from './SavedViewsRowButton';
 import SavedViewsRowMenu from './SavedViewsRowMenu';
@@ -19,26 +17,17 @@ function SavedViewsListRow({
 	hover,
 }: SavedViewsListRowProps): JSX.Element {
 	const name = view.spec.displayName;
-	const readPermission = buildSavedViewReadPermission(view.id);
-	// Same cached check as the button; gates the hover card.
-	const { isLoading, deniedPermissions } = useAuthZ([readPermission]);
-	const canRead = !isLoading && deniedPermissions.length === 0;
 
 	return (
 		<div
 			className={cx(styles.row, { [styles.isActive]: isActive })}
 			data-testid="saved-views-row"
 			data-view-id={view.id}
-			onMouseEnter={(event): void => {
-				if (canRead) {
-					hover.onRowEnter(view, event.currentTarget);
-				}
-			}}
+			onMouseEnter={(event): void => hover.onRowEnter(view, event.currentTarget)}
 			onMouseLeave={hover.onRowLeave}
 		>
 			<div className={styles.rowName}>
-				<AuthZButton
-					checks={[readPermission]}
+				<Button
 					size="md"
 					variant="ghost"
 					color="secondary"
@@ -52,7 +41,7 @@ function SavedViewsListRow({
 					testId="saved-views-row-name"
 				>
 					{name}
-				</AuthZButton>
+				</Button>
 			</div>
 			{isActive && (
 				<SavedViewsRowButton
@@ -65,7 +54,6 @@ function SavedViewsListRow({
 			)}
 			<span className={styles.rowMenu}>
 				<SavedViewsRowMenu
-					viewId={view.id}
 					onAction={(key): void => onAction(view, key)}
 					onOpen={hover.onMenuOpen}
 				/>

frontend/src/container/SavedViews/SavedViewsPanel.tsx

@@ -4,9 +4,6 @@ import { Input } from '@signozhq/ui/input';
 import { Typography } from '@signozhq/ui/typography';
 import { SavedviewtypesSourceDTO } from 'api/generated/services/sigNoz.schemas';
 
-import { AuthZGuardContent } from 'lib/authz/components/AuthZGuard/AuthZGuardContent';
-import { SavedViewListPermission } from 'lib/authz/hooks/useAuthZ/permissions/saved-view.permissions';
-
 import SavedViewsIconButton from './SavedViewsIconButton';
 import SavedViewsList from './SavedViewsList';
 
@@ -42,20 +39,16 @@ function SavedViewsPanel({
 					/>
 				</div>
 			)}
-			<AuthZGuardContent checks={[SavedViewListPermission]}>
-				<>
-					<div className={styles.search}>
-						<Input
-							value={search}
-							onChange={(event): void => setSearch(event.target.value)}
-							placeholder="Search..."
-							aria-label="Search views"
-							testId="saved-views-search"
-						/>
-					</div>
-					<SavedViewsList source={source} search={search} />
-				</>
-			</AuthZGuardContent>
+			<div className={styles.search}>
+				<Input
+					value={search}
+					onChange={(event): void => setSearch(event.target.value)}
+					placeholder="Search..."
+					aria-label="Search views"
+					testId="saved-views-search"
+				/>
+			</div>
+			<SavedViewsList source={source} search={search} />
 		</div>
 	);
 }

frontend/src/container/SavedViews/SavedViewsRowMenu.tsx

@@ -1,18 +1,16 @@
 import { useMemo } from 'react';
 import { Ellipsis } from '@signozhq/icons';
-import AuthZDropdown from 'lib/authz/components/AuthZDropdown/AuthZDropdown';
-import type { AuthZDropdownItemType } from 'lib/authz/components/AuthZDropdown/types';
+import { Dropdown, type DropdownItemType } from '@signozhq/ui/dropdown';
 
 import { SAVED_VIEW_ROW_ACTIONS } from './constants';
 import SavedViewsRowButton from './SavedViewsRowButton';
 import { SavedViewsRowMenuProps } from './types';
 
 function SavedViewsRowMenu({
-	viewId,
 	onAction,
 	onOpen,
 }: SavedViewsRowMenuProps): JSX.Element {
-	const items = useMemo<AuthZDropdownItemType[]>(
+	const items = useMemo<DropdownItemType[]>(
 		() =>
 			SAVED_VIEW_ROW_ACTIONS.flatMap(
 				({
@@ -21,8 +19,7 @@ function SavedViewsRowMenu({
 					icon: Icon,
 					danger,
 					hasDividerBefore,
-					buildPermission,
-				}): AuthZDropdownItemType[] => [
+				}): DropdownItemType[] => [
 					...(hasDividerBefore
 						? [{ type: 'separator' as const, value: `separator-${key}` }]
 						: []),
@@ -32,16 +29,15 @@ function SavedViewsRowMenu({
 						label,
 						prefix: <Icon size={14} />,
 						danger,
-						checks: buildPermission ? [buildPermission(viewId)] : undefined,
 						onClick: (): void => onAction(key),
 					},
 				],
 			),
-		[viewId, onAction],
+		[onAction],
 	);
 
 	return (
-		<AuthZDropdown
+		<Dropdown
 			items={items}
 			nativeButton
 			side="right"
@@ -51,7 +47,6 @@ function SavedViewsRowMenu({
 					onOpen();
 				}
 			}}
-			testId="saved-views-row-menu"
 		>
 			<SavedViewsRowButton
 				icon={<Ellipsis size={14} />}
@@ -59,7 +54,7 @@ function SavedViewsRowMenu({
 				tooltip="More options"
 				testId="saved-views-row-menu"
 			/>
-		</AuthZDropdown>
+		</Dropdown>
 	);
 }
 

frontend/src/container/SavedViews/__tests__/SavedViewHoverCard.test.tsx

@@ -1,10 +1,4 @@
-import {
-	act,
-	fireEvent,
-	screen,
-	waitFor,
-	within,
-} from '@testing-library/react';
+import { act, fireEvent, screen, within } from '@testing-library/react';
 import { SavedviewtypesSourceDTO } from 'api/generated/services/sigNoz.schemas';
 import { initialQueriesMap, PANEL_TYPES } from 'constants/queryBuilder';
 import ROUTES from 'constants/routes';
@@ -18,7 +12,6 @@ import {
 import SavedViewsPanel from '../SavedViewsPanel';
 import { mockSavedViewsApi } from './savedViewsApiMock';
 import {
-	expectUsable,
 	explorerUrl,
 	makeView,
 	queryWith,
@@ -117,11 +110,6 @@ async function renderPanel(
 		dataSource,
 	);
 	await screen.findByTestId('saved-views-list');
-	await waitFor(() =>
-		screen
-			.getAllByTestId('saved-views-row-name')
-			.forEach((name) => expectUsable(name)),
-	);
 	jest.useFakeTimers();
 }
 
@@ -152,10 +140,6 @@ describe('SavedViewHoverCard', () => {
 	});
 
 	afterEach(() => {
-		// useAuthZ batches checks on a timer; left pending, it blocks later checks.
-		act(() => {
-			jest.runOnlyPendingTimers();
-		});
 		jest.useRealTimers();
 	});
 

frontend/src/container/SavedViews/__tests__/SavedViews.authz.test.tsx

@@ -1,265 +0,0 @@
-import { fireEvent, screen, waitFor, within } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { SavedviewtypesSourceDTO } from 'api/generated/services/sigNoz.schemas';
-import { PANEL_TYPES } from 'constants/queryBuilder';
-import ROUTES from 'constants/routes';
-import {
-	buildSavedViewDeletePermission,
-	buildSavedViewReadPermission,
-	buildSavedViewUpdatePermission,
-	SavedViewCreatePermission,
-	SavedViewListPermission,
-} from 'lib/authz/hooks/useAuthZ/permissions/saved-view.permissions';
-import {
-	AUTHZ_CHECK_URL,
-	setupAuthzDeny,
-} from 'lib/authz/utils/authz-test-utils';
-import { server } from 'mocks-server/server';
-import { rest } from 'msw';
-import { DataSource } from 'types/common/queryBuilder';
-
-import SavedViewsHeader from '../SavedViewsHeader';
-import SavedViewsPanel from '../SavedViewsPanel';
-import { API, mockSavedViewsApi } from './savedViewsApiMock';
-import {
-	explorerUrl,
-	makeView,
-	MENU_CHECK_TIMEOUT,
-	queryWith,
-	renderWithExplorerProviders,
-	viewUrl,
-} from './savedViewsTestUtils';
-
-const PATH = ROUTES.TRACES_EXPLORER;
-
-const errors = makeView({ id: 'view-1', displayName: 'Errors' });
-const slow = makeView({ id: 'view-2', displayName: 'Slow spans' });
-
-function renderPanel(url = explorerUrl(PATH, {})): void {
-	renderWithExplorerProviders(
-		<SavedViewsPanel
-			source={SavedviewtypesSourceDTO.traces}
-			onClose={jest.fn()}
-		/>,
-		url,
-	);
-}
-
-function renderHeader(
-	url: string,
-): ReturnType<typeof renderWithExplorerProviders> {
-	return renderWithExplorerProviders(
-		<SavedViewsHeader
-			source={SavedviewtypesSourceDTO.traces}
-			onOpenViews={jest.fn()}
-		/>,
-		url,
-	);
-}
-
-const rowNamed = (name: string): HTMLElement =>
-	screen
-		.getAllByTestId('saved-views-row')
-		.find((row) => row.textContent?.includes(name)) as HTMLElement;
-
-async function openRowMenu(name: string): Promise<void> {
-	await screen.findAllByTestId('saved-views-row');
-	fireEvent.click(within(rowNamed(name)).getByTestId('saved-views-row-menu'));
-}
-
-// Resolves once the row's check is back, so its state is final.
-async function settledRow(testId: string): Promise<HTMLElement> {
-	await waitFor(
-		() => expect(screen.getByTestId(testId)).not.toHaveAttribute('data-loading'),
-		MENU_CHECK_TIMEOUT,
-	);
-	return screen.getByTestId(testId);
-}
-
-describe('SavedViews - AuthZ', () => {
-	beforeEach(() => {
-		localStorage.clear();
-	});
-
-	afterEach(() => {
-		server.resetHandlers();
-	});
-
-	it('shows the denied callout instead of the list without list', async () => {
-		mockSavedViewsApi([errors]);
-		server.use(setupAuthzDeny(SavedViewListPermission));
-		renderPanel();
-
-		await expect(
-			screen.findByText(/not authorized/i),
-		).resolves.toBeInTheDocument();
-		expect(screen.queryByTestId('saved-views-list')).toBeNull();
-		expect(screen.queryByTestId('saved-views-search')).toBeNull();
-	});
-
-	it('disables only the views it cannot read', async () => {
-		mockSavedViewsApi([errors, slow]);
-		server.use(setupAuthzDeny(buildSavedViewReadPermission(errors.id)));
-		renderPanel();
-
-		await screen.findAllByTestId('saved-views-row');
-		const nameOf = (view: string): HTMLElement =>
-			within(rowNamed(view)).getByTestId('saved-views-row-name');
-		await waitFor(() =>
-			expect(nameOf('Errors')).toHaveAttribute('aria-disabled', 'true'),
-		);
-		await waitFor(() =>
-			expect(nameOf('Slow spans')).not.toHaveAttribute('aria-busy'),
-		);
-		expect(nameOf('Slow spans')).not.toHaveAttribute('aria-disabled', 'true');
-	});
-
-	it('keeps the row menu on a view it cannot read', async () => {
-		mockSavedViewsApi([errors]);
-		server.use(setupAuthzDeny(buildSavedViewReadPermission(errors.id)));
-		renderPanel();
-
-		await openRowMenu('Errors');
-
-		await expect(
-			settledRow('saved-views-row-menu-item-delete'),
-		).resolves.not.toHaveAttribute('data-disabled');
-		await expect(
-			settledRow('saved-views-row-menu-item-editDetails'),
-		).resolves.not.toHaveAttribute('data-disabled');
-		await expect(
-			settledRow('saved-views-row-menu-item-copyLink'),
-		).resolves.not.toHaveAttribute('data-disabled');
-	});
-
-	it('disables creating without create', async () => {
-		mockSavedViewsApi([]);
-		server.use(setupAuthzDeny(SavedViewCreatePermission));
-		renderPanel();
-		renderHeader(explorerUrl(PATH, {}));
-
-		await waitFor(() =>
-			expect(screen.getByTestId('saved-views-list-create')).toHaveAttribute(
-				'aria-disabled',
-				'true',
-			),
-		);
-		await waitFor(() =>
-			expect(screen.getByTestId('saved-views-create')).toHaveAttribute(
-				'aria-disabled',
-				'true',
-			),
-		);
-	});
-
-	it('keeps create disabled while the check is pending', async () => {
-		mockSavedViewsApi([]);
-		server.use(
-			rest.post(AUTHZ_CHECK_URL, (_req, res, ctx) => res(ctx.delay('infinite'))),
-		);
-		renderHeader(explorerUrl(PATH, {}));
-
-		const create = screen.getByTestId('saved-views-create');
-		expect(create).toHaveAttribute('aria-busy', 'true');
-		await userEvent.click(create);
-		expect(screen.queryByTestId('save-view-name')).toBeNull();
-	});
-
-	it('disables edit details without update and delete without delete', async () => {
-		mockSavedViewsApi([errors]);
-		server.use(
-			setupAuthzDeny(
-				buildSavedViewUpdatePermission(errors.id),
-				buildSavedViewDeletePermission(errors.id),
-			),
-		);
-		renderPanel();
-
-		await openRowMenu('Errors');
-
-		await expect(
-			settledRow('saved-views-row-menu-item-editDetails'),
-		).resolves.toHaveAttribute('data-disabled');
-		await expect(
-			settledRow('saved-views-row-menu-item-delete'),
-		).resolves.toHaveAttribute('data-disabled');
-		await expect(
-			settledRow('saved-views-row-menu-item-copyLink'),
-		).resolves.not.toHaveAttribute('data-disabled');
-	});
-
-	it('disables updating the open view without update, keeping save as new', async () => {
-		mockSavedViewsApi([errors]);
-		server.use(setupAuthzDeny(buildSavedViewUpdatePermission(errors.id)));
-		const { history } = renderHeader(viewUrl(PATH, errors));
-		await waitFor(() =>
-			expect(screen.getByTestId('saved-views-name')).toHaveTextContent('Errors'),
-		);
-
-		history.push(
-			explorerUrl(PATH, {
-				query: queryWith(DataSource.TRACES, 'has_error = false'),
-				panelType: PANEL_TYPES.LIST,
-				viewKey: errors.id,
-			}),
-		);
-		await userEvent.click(await screen.findByTestId('saved-views-save-changes'));
-
-		await expect(
-			settledRow('saved-views-save-changes-item-update'),
-		).resolves.toHaveAttribute('data-disabled');
-		await expect(
-			settledRow('saved-views-save-changes-item-save-as-new'),
-		).resolves.not.toHaveAttribute('data-disabled');
-	});
-
-	it('says no access when the check denies read, even if the server returns the view', async () => {
-		mockSavedViewsApi([errors]);
-		server.use(setupAuthzDeny(buildSavedViewReadPermission(errors.id)));
-		renderHeader(viewUrl(PATH, errors));
-
-		await waitFor(() =>
-			expect(screen.getByTestId('saved-views-name')).toHaveTextContent(
-				'No view access',
-			),
-		);
-		await waitFor(() =>
-			expect(screen.getByTestId('saved-views-name')).toHaveAttribute(
-				'data-denied-permissions',
-			),
-		);
-		await userEvent.setup().hover(screen.getByTestId('saved-views-name'));
-
-		await waitFor(() =>
-			expect(
-				screen.queryAllByText(/is not authorized to perform read:saved-view:view-1/)
-					.length,
-			).toBeGreaterThan(0),
-		);
-	});
-
-	it('treats a 403 the check allowed as a failed load, showing the server message', async () => {
-		const message = 'saved-view:read is missing, ask an admin for it';
-		mockSavedViewsApi([errors]);
-		server.use(
-			rest.get(`${API}/:id`, (_req, res, ctx) =>
-				res(
-					ctx.status(403),
-					ctx.json({ status: 'error', error: { code: 'forbidden', message } }),
-				),
-			),
-		);
-		renderHeader(viewUrl(PATH, errors));
-
-		await waitFor(() =>
-			expect(screen.getByTestId('saved-views-name')).toHaveTextContent(
-				'View failed to load',
-			),
-		);
-		await userEvent.setup().hover(screen.getByTestId('saved-views-name'));
-
-		await waitFor(() =>
-			expect(screen.queryAllByText(message).length).toBeGreaterThan(0),
-		);
-	});
-});

frontend/src/container/SavedViews/__tests__/SavedViewsHeader.columns.test.tsx

@@ -9,9 +9,7 @@ import { usePreferenceContext } from 'providers/preferences/context/PreferenceCo
 import SavedViewsHeader from '../SavedViewsHeader';
 import { mockSavedViewsApi } from './savedViewsApiMock';
 import {
-	expectRowUsable,
 	makeView,
-	MENU_CHECK_TIMEOUT,
 	renderWithExplorerProviders,
 	viewUrl,
 } from './savedViewsTestUtils';
@@ -117,11 +115,9 @@ describe('SavedViewsHeader columns', () => {
 		await userEvent.click(screen.getByTestId('add-column'));
 		await waitFor(() => expect(isDirty()).toBe(true));
 		await userEvent.click(screen.getByTestId('saved-views-save-changes'));
-		const update = await screen.findByTestId(
-			'saved-views-save-changes-item-update',
+		await userEvent.click(
+			await screen.findByRole('menuitem', { name: 'Update selected view' }),
 		);
-		await waitFor(() => expectRowUsable(update), MENU_CHECK_TIMEOUT);
-		await userEvent.click(update);
 		await waitFor(() => expect(isDirty()).toBe(false));
 
 		await userEvent.click(screen.getByTestId('add-column'));

frontend/src/container/SavedViews/__tests__/SavedViewsHeader.save.test.tsx

@@ -9,11 +9,8 @@ import { DataSource } from 'types/common/queryBuilder';
 
 import SavedViewsHeader from '../SavedViewsHeader';
 import {
-	expectRowUsable,
-	expectUsable,
 	explorerUrl,
 	makeView,
-	MENU_CHECK_TIMEOUT,
 	queryWith,
 	renderWithExplorerProviders,
 	urlParam,
@@ -70,21 +67,9 @@ async function openDirtyView(
 	return rendered;
 }
 
-const SAVE_MENU_ITEM_TEST_IDS: Record<string, string> = {
-	'Save as new view': 'saved-views-save-changes-item-save-as-new',
-	'Update selected view': 'saved-views-save-changes-item-update',
-};
-
 async function chooseFromSaveMenu(item: string): Promise<void> {
 	await userEvent.click(screen.getByTestId('saved-views-save-changes'));
-	const menuItem = await screen.findByTestId(SAVE_MENU_ITEM_TEST_IDS[item]);
-	await waitFor(() => expectRowUsable(menuItem), MENU_CHECK_TIMEOUT);
-	await userEvent.click(menuItem);
-}
-
-async function clickCreate(): Promise<void> {
-	await waitFor(() => expectUsable(screen.getByTestId('saved-views-create')));
-	await userEvent.click(screen.getByTestId('saved-views-create'));
+	await userEvent.click(await screen.findByRole('menuitem', { name: item }));
 }
 
 async function submitName(name: string): Promise<void> {
@@ -102,7 +87,7 @@ describe('SavedViewsHeader saving', () => {
 			const requests = mockSavedViewsApi([], { createdId: 'view-new' });
 			const { history } = renderHeader(explorerUrl(PATH, {}));
 
-			await clickCreate();
+			await userEvent.click(screen.getByTestId('saved-views-create'));
 
 			expect(within(modal()).getByText('Create new view')).toBeInTheDocument();
 			expect(screen.getByTestId('save-view-submit')).toHaveAttribute(
@@ -145,7 +130,7 @@ describe('SavedViewsHeader saving', () => {
 			const requests = mockSavedViewsApi([], { createStatus: 500 });
 			const { history } = renderHeader(explorerUrl(PATH, {}));
 
-			await clickCreate();
+			await userEvent.click(screen.getByTestId('saved-views-create'));
 			await submitName('Slow checkout');
 
 			await waitFor(() => expect(toast.error).toHaveBeenCalled());
@@ -160,7 +145,7 @@ describe('SavedViewsHeader saving', () => {
 			const requests = mockSavedViewsApi([]);
 			renderHeader(explorerUrl(PATH, {}));
 
-			await clickCreate();
+			await userEvent.click(screen.getByTestId('saved-views-create'));
 			await userEvent.type(screen.getByTestId('save-view-name'), 'Draft');
 			await userEvent.click(screen.getByTestId('save-view-cancel'));
 

frontend/src/container/SavedViews/__tests__/SavedViewsPanel.list.test.tsx

@@ -8,7 +8,6 @@ import ROUTES from 'constants/routes';
 import SavedViewsPanel from '../SavedViewsPanel';
 import { mockSavedViewsApi } from './savedViewsApiMock';
 import {
-	expectUsable,
 	explorerUrl,
 	makeView,
 	renderWithExplorerProviders,
@@ -85,9 +84,9 @@ describe('SavedViewsPanel list', () => {
 		const { history } = renderPanel();
 
 		await screen.findByTestId('saved-views-list');
-		const name = within(row('Slow spans')).getByTestId('saved-views-row-name');
-		await waitFor(() => expectUsable(name));
-		await userEvent.click(name);
+		await userEvent.click(
+			within(row('Slow spans')).getByTestId('saved-views-row-name'),
+		);
 
 		await waitFor(() =>
 			expect(urlParam(history, QueryParams.viewKey)).toBe(
@@ -162,9 +161,7 @@ describe('SavedViewsPanel list', () => {
 		const requests = mockSavedViewsApi([], { createdId: 'view-new' });
 		const { history } = renderPanel();
 
-		const create = await screen.findByTestId('saved-views-list-create');
-		await waitFor(() => expectUsable(create));
-		await userEvent.click(create);
+		await userEvent.click(await screen.findByTestId('saved-views-list-create'));
 		await userEvent.type(screen.getByTestId('save-view-name'), 'First view');
 		await userEvent.click(screen.getByTestId('save-view-submit'));
 

frontend/src/container/SavedViews/__tests__/SavedViewsPanel.rowMenu.test.tsx

@@ -9,10 +9,8 @@ import SavedViewsHeader from '../SavedViewsHeader';
 import SavedViewsPanel from '../SavedViewsPanel';
 import { mockSavedViewsApi } from './savedViewsApiMock';
 import {
-	expectRowUsable,
 	explorerUrl,
 	makeView,
-	MENU_CHECK_TIMEOUT,
 	renderWithExplorerProviders,
 	urlParam,
 	viewUrl,
@@ -60,22 +58,13 @@ const row = (name: string): HTMLElement =>
 		.getAllByTestId('saved-views-row')
 		.find((element) => element.textContent?.includes(name)) as HTMLElement;
 
-const ROW_MENU_ITEM_TEST_IDS: Record<string, string> = {
-	'Copy link': 'saved-views-row-menu-item-copyLink',
-	'Copy ID': 'saved-views-row-menu-item-copyId',
-	'Edit details': 'saved-views-row-menu-item-editDetails',
-	Delete: 'saved-views-row-menu-item-delete',
-};
-
 async function chooseFromRowMenu(
 	viewName: string,
 	item: string,
 ): Promise<void> {
 	await screen.findByTestId('saved-views-list');
 	fireEvent.click(within(row(viewName)).getByTestId('saved-views-row-menu'));
-	const menuItem = await screen.findByTestId(ROW_MENU_ITEM_TEST_IDS[item]);
-	await waitFor(() => expectRowUsable(menuItem), MENU_CHECK_TIMEOUT);
-	fireEvent.click(menuItem);
+	fireEvent.click(await screen.findByRole('menuitem', { name: item }));
 }
 
 const chip = (): HTMLElement => screen.getByTestId('saved-views-name');
@@ -87,38 +76,21 @@ describe('SavedViewsPanel row menu', () => {
 		jest.mocked(toast.success).mockClear();
 	});
 
-	it('offers copy link, copy id, edit details and delete', async () => {
+	it('offers copy link, edit details and delete', async () => {
 		mockSavedViewsApi([errors]);
 		renderPanelWithHeader();
 		await screen.findByTestId('saved-views-list');
 
 		fireEvent.click(within(row('Errors')).getByTestId('saved-views-row-menu'));
 
-		await screen.findByTestId(ROW_MENU_ITEM_TEST_IDS['Copy link']);
-		const items = Object.values(ROW_MENU_ITEM_TEST_IDS).map(
-			(testId) => screen.getByTestId(testId).textContent,
-		);
-		expect(items).toStrictEqual([
+		const items = await screen.findAllByRole('menuitem');
+		expect(items.map((item) => item.textContent)).toStrictEqual([
 			'Copy link',
-			'Copy ID',
 			'Edit details',
 			'Delete',
 		]);
 	});
 
-	it('copies the view id', async () => {
-		mockSavedViewsApi([errors, slow]);
-		renderPanelWithHeader();
-
-		await chooseFromRowMenu('Slow spans', 'Copy ID');
-
-		expect(mockCopy).toHaveBeenCalledWith(slow.id);
-		expect(toast.success).toHaveBeenCalledWith(
-			'View ID copied',
-			expect.anything(),
-		);
-	});
-
 	it('copies a link that opens the view with its query and tab', async () => {
 		mockSavedViewsApi([errors, slow]);
 		renderPanelWithHeader();

frontend/src/container/SavedViews/__tests__/savedViewsApiMock.ts

@@ -1,5 +1,4 @@
 import { SavedviewtypesSavedViewDTO } from 'api/generated/services/sigNoz.schemas';
-import { setupAuthzAdmin } from 'lib/authz/utils/authz-test-utils';
 import { server } from 'mocks-server/server';
 import { rest } from 'msw';
 
@@ -14,7 +13,6 @@ export interface Requests {
 }
 
 // Mutates `views` on create, update and delete, so a refetch sees the change.
-// Grants every permission; a later server.use overrides it.
 export function mockSavedViewsApi(
 	views: SavedviewtypesSavedViewDTO[],
 	{
@@ -32,7 +30,6 @@ export function mockSavedViewsApi(
 	const requests: Requests = { created: [], updated: [], deleted: [] };
 	let failedLists = 0;
 	server.use(
-		setupAuthzAdmin(),
 		rest.get(API, (req, res, ctx) => {
 			if (failedLists < listFailures) {
 				failedLists += 1;

frontend/src/container/SavedViews/__tests__/savedViewsTestUtils.tsx

@@ -251,20 +251,3 @@ export function renderWithExplorerProviders(
 export function urlParam(history: MemoryHistory, key: string): string | null {
 	return new URLSearchParams(history.location.search).get(key);
 }
-
-// The ui Button marks a pending check with aria-busy and a block with
-// aria-disabled, never the disabled attribute.
-export function expectUsable(element: HTMLElement): void {
-	expect(element).not.toHaveAttribute('aria-busy');
-	expect(element).not.toHaveAttribute('aria-disabled', 'true');
-}
-
-// A menu checks its rows on first open; on a loaded CI runner that outlasts
-// waitFor's 1s default.
-export const MENU_CHECK_TIMEOUT = { timeout: 5000 };
-
-// A menu row waiting on its check is data-loading, not yet data-disabled.
-export function expectRowUsable(row: HTMLElement): void {
-	expect(row).not.toHaveAttribute('data-loading');
-	expect(row).not.toHaveAttribute('data-disabled');
-}

frontend/src/container/SavedViews/constants.ts

@@ -1,13 +1,9 @@
-import { Copy, Link, PenLine, Trash2 } from '@signozhq/icons';
+import { Link, PenLine, Trash2 } from '@signozhq/icons';
 import {
 	SavedviewtypesSchemaVersionDTO,
 	SavedviewtypesSourceDTO,
 } from 'api/generated/services/sigNoz.schemas';
 import { QueryParams } from 'constants/query';
-import {
-	buildSavedViewDeletePermission,
-	buildSavedViewUpdatePermission,
-} from 'lib/authz/hooks/useAuthZ/permissions/saved-view.permissions';
 import { DataSource } from 'types/common/queryBuilder';
 
 import { SavedViewRowActionConfig, SaveViewModalMode } from './types';
@@ -34,8 +30,6 @@ export const MY_VIEW_NAME = 'My view';
 
 export const SAVED_VIEW_LOAD_FAILED_NAME = 'View failed to load';
 
-export const SAVED_VIEW_FORBIDDEN_NAME = 'No view access';
-
 export const SAVED_VIEWS_LIST_LOADING_ROWS = 4;
 
 export const SAVED_VIEW_HOVER_CARD_OPEN_DELAY_MS = 1000;
@@ -53,20 +47,13 @@ export const SAVE_VIEW_MODAL_TITLE: Record<SaveViewModalMode, string> = {
 
 export const SAVED_VIEW_ROW_ACTIONS: SavedViewRowActionConfig[] = [
 	{ key: 'copyLink', label: 'Copy link', icon: Link },
-	{ key: 'copyId', label: 'Copy ID', icon: Copy },
-	{
-		key: 'editDetails',
-		label: 'Edit details',
-		icon: PenLine,
-		buildPermission: buildSavedViewUpdatePermission,
-	},
+	{ key: 'editDetails', label: 'Edit details', icon: PenLine },
 	{
 		key: 'delete',
 		label: 'Delete',
 		icon: Trash2,
 		danger: true,
 		hasDividerBefore: true,
-		buildPermission: buildSavedViewDeletePermission,
 	},
 ];
 

frontend/src/container/SavedViews/hooks/useActiveSavedView.ts

@@ -6,10 +6,7 @@ import useOptionsMenu from 'container/OptionsMenu/useOptionsMenu';
 import { useGetCompositeQueryParam } from 'hooks/queryBuilder/useGetCompositeQueryParam';
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
 import { useGetSavedViewParams } from 'hooks/saveViews/useGetSavedViewParams';
-import { buildSavedViewReadPermission } from 'lib/authz/hooks/useAuthZ/permissions/saved-view.permissions';
-import { useAuthZ } from 'lib/authz/hooks/useAuthZ/useAuthZ';
 import { DataSource } from 'types/common/queryBuilder';
-import { toAPIError } from 'utils/errorUtils';
 
 import { SAVED_VIEW_OPTIONS_DATA_SOURCE } from '../constants';
 import { UseActiveSavedViewResult } from '../types';
@@ -26,19 +23,11 @@ export function useActiveSavedView(
 		dataSource: optionsDataSource ?? DataSource.LOGS,
 	});
 
-	const { isLoading: isCheckingRead, deniedPermissions } = useAuthZ(
-		[buildSavedViewReadPermission(viewKey)],
-		{ enabled: !!viewKey },
-	);
-	const isReadDenied = !!viewKey && deniedPermissions.length > 0;
-
-	const canFetch = !!viewKey && !isCheckingRead && !isReadDenied;
-
-	const { data, isLoading, isError, error } = useGetSavedView(
+	const { data, isLoading, isError } = useGetSavedView(
 		{ id: viewKey },
-		{ query: { enabled: canFetch } },
+		{ query: { enabled: !!viewKey } },
 	);
-	const view = canFetch ? data?.data : undefined;
+	const view = viewKey ? data?.data : undefined;
 
 	// The query builder stages the url query a render later. Until the ids
 	// match, keep the last answer for this view; another view starts clean.
@@ -79,17 +68,10 @@ export function useActiveSavedView(
 		lastResult.current = { viewId: view?.id, hasUnsavedChanges };
 	}, [view?.id, hasUnsavedChanges]);
 
-	const errorMessage =
-		viewKey && isError && error
-			? toAPIError(error, '').getErrorMessage() || undefined
-			: undefined;
-
 	return {
 		view,
-		isLoading: !!viewKey && (isCheckingRead || isLoading),
-		isError: !!viewKey && (isError || isReadDenied),
-		isReadDenied,
-		errorMessage,
+		isLoading: !!viewKey && isLoading,
+		isError: !!viewKey && isError,
 		hasUnsavedChanges,
 	};
 }

frontend/src/container/SavedViews/hooks/useSavedViewRowActions.ts

@@ -59,14 +59,6 @@ export function useSavedViewRowActions(
 		[pathname, copyToClipboard],
 	);
 
-	const copyViewId = useCallback(
-		(view: SavedviewtypesSavedViewDTO): void => {
-			copyToClipboard(view.id);
-			toast.success('View ID copied', { position: SAVED_VIEW_TOAST_POSITION });
-		},
-		[copyToClipboard],
-	);
-
 	const renameView = useCallback(
 		async (
 			view: SavedviewtypesSavedViewDTO,
@@ -109,12 +101,5 @@ export function useSavedViewRowActions(
 		[deleteSavedView, source, queryClient],
 	);
 
-	return {
-		copyViewLink,
-		copyViewId,
-		renameView,
-		deleteView,
-		isRenaming,
-		isDeleting,
-	};
+	return { copyViewLink, renameView, deleteView, isRenaming, isDeleting };
 }

frontend/src/container/SavedViews/stories/SavedViews.stories.mocks.tsx

@@ -1,218 +0,0 @@
-/**
- * AI-owned. Generated and maintained by the `signoz-page-story` skill.
- * Do not hand-edit: regenerate instead.
- */
-
-import { rest, type RequestHandler } from 'msw';
-import remove from 'api/browser/localstorage/remove';
-import {
-	type AuthtypesTransactionDTO,
-	type SavedviewtypesSavedViewDTO,
-	SavedviewtypesSourceDTO,
-	type SavedviewtypesUpdatableSavedViewDTO,
-} from 'api/generated/services/sigNoz.schemas';
-import { LOCALSTORAGE } from 'constants/localStorage';
-import {
-	AUTHZ_CHECK_URL,
-	authzMockResponse,
-} from 'lib/authz/utils/authz-test-utils';
-
-import { accessFor } from '@/storybook/access/access';
-import {
-	choiceControl,
-	countControl,
-	toggleControl,
-} from '@/storybook/controls/controls';
-import { defineStoryMocks } from '@/storybook/controls/defineStoryMocks';
-import type { MockControlValues, StoryMocks } from '@/storybook/controls/types';
-import { authzMocks, type AuthzArgs } from '@/storybook/globals/authzMocks';
-import { respondWith } from '@/storybook/runtime/responseState';
-
-import {
-	createdSavedView,
-	OPEN_VIEW_ERRORS,
-	OPEN_VIEWS,
-	type OpenView,
-	SAVED_VIEW_SOURCES,
-	SAVED_VIEWS_MAX,
-	savedViewById,
-	savedViewResponse,
-	savedViewRoute,
-	savedViewsListResponse,
-	type SavedViewSource,
-	unreadableViewId,
-} from './__story_mockdata__/savedViews';
-
-const API = 'http://localhost/api/v2/saved_views';
-
-const LIST = 'Saved Views · list';
-const VIEW = 'Saved Views · open view';
-
-const controls = {
-	source: choiceControl<SavedViewSource>('Source', {
-		group: VIEW,
-		description: 'Which explorer the views belong to.',
-		options: SAVED_VIEW_SOURCES,
-		value: SavedviewtypesSourceDTO.traces,
-	}),
-	openView: choiceControl<OpenView>('Open view', {
-		group: VIEW,
-		description:
-			'The `viewKey` the explorer url carries. `unsaved-changes` stages a query that differs from the view, which swaps in the ✓ save menu; `forbidden`, `failed` and `not-found` are the 403, 500 and 404 the view fetch answers with; each shows View failed to load.',
-		options: OPEN_VIEWS,
-		value: 'none',
-	}),
-	unreadableView: toggleControl('Unreadable view', {
-		group: VIEW,
-		description:
-			'Denies `read` on the first view created by others alone, on top of the Access controls: its row greys out, and with Open view on `created-by-others` the header shows No view access.',
-		value: false,
-	}),
-	createdByMe: countControl('Created by me', {
-		group: LIST,
-		value: 3,
-		max: SAVED_VIEWS_MAX,
-	}),
-	createdByOthers: countControl('Created by others', {
-		group: LIST,
-		description: 'Both at 0 is the empty state, with its Create view button.',
-		value: 4,
-		max: SAVED_VIEWS_MAX,
-	}),
-};
-
-type SavedViewsValues = MockControlValues<typeof controls>;
-
-type WrittenView = Pick<SavedviewtypesSavedViewDTO, 'spec' | 'source'>;
-
-const viewDenied = (
-	transaction: AuthtypesTransactionDTO,
-	deniedId: string,
-): boolean =>
-	transaction.relation === 'read' &&
-	transaction.object.resource.kind === 'saved-view' &&
-	transaction.object.selector === deniedId;
-
-const definition = defineStoryMocks({
-	controls,
-	handlers: (
-		values: SavedViewsValues & AuthzArgs,
-		response,
-	): RequestHandler[] => {
-		const { source, openView, createdByMe, createdByOthers } = values;
-
-		// What the panel writes stays in this handler set until a control changes.
-		const created: SavedviewtypesSavedViewDTO[] = [];
-		const updated = new Map<string, WrittenView>();
-		const deleted = new Set<string>();
-
-		const current = (
-			view: SavedviewtypesSavedViewDTO,
-		): SavedviewtypesSavedViewDTO => ({ ...view, ...updated.get(view.id) });
-
-		const findView = (id: string): SavedviewtypesSavedViewDTO | undefined => {
-			const view = created.find((item) => item.id === id) ?? savedViewById(id);
-
-			return view && !deleted.has(id) ? current(view) : undefined;
-		};
-
-		const openError = OPEN_VIEW_ERRORS[openView];
-
-		return [
-			rest.post(API, async (req, res, ctx) => {
-				const body = (await req.json()) as SavedviewtypesUpdatableSavedViewDTO;
-				const id = `storybook-${source}-created-${created.length + 1}`;
-
-				created.push(createdSavedView(source, id, body.spec));
-
-				return res(ctx.status(201), ctx.json({ status: 'success', data: { id } }));
-			}),
-
-			rest.get(
-				API,
-				response.json(() => {
-					const list = savedViewsListResponse(source, createdByMe, createdByOthers);
-
-					return {
-						...list,
-						data: [...(list.data ?? []), ...created]
-							.filter((view) => !deleted.has(view.id))
-							.map(current),
-					};
-				}),
-			),
-
-			rest.get(`${API}/:id`, (req, res, ctx) => {
-				if (openError) {
-					return res(ctx.status(openError.status), ctx.json(openError.body));
-				}
-
-				const view = findView(String(req.params.id));
-
-				if (!view) {
-					return res(ctx.status(404), ctx.json(OPEN_VIEW_ERRORS['not-found']?.body));
-				}
-
-				return response.json(() => savedViewResponse(view))(req, res, ctx);
-			}),
-
-			rest.put(`${API}/:id`, async (req, res, ctx) => {
-				const body = (await req.json()) as SavedviewtypesUpdatableSavedViewDTO;
-
-				updated.set(String(req.params.id), {
-					spec: body.spec,
-					source: body.source,
-				});
-
-				return res(ctx.status(204));
-			}),
-
-			rest.delete(`${API}/:id`, (req, res, ctx) => {
-				deleted.add(String(req.params.id));
-
-				return res(ctx.status(204));
-			}),
-
-			...(values.unreadableView
-				? [
-						rest.post(
-							AUTHZ_CHECK_URL,
-							respondWith(values.authzState, async (req) => {
-								const payload = (await req.json()) as AuthtypesTransactionDTO[];
-								const granted = accessFor(
-									values.access,
-									values.permissions,
-									values.revoked,
-								);
-								const deniedId = unreadableViewId(source);
-
-								return authzMockResponse(
-									payload,
-									payload.map(
-										(transaction) =>
-											!viewDenied(transaction, deniedId) && granted.allows(transaction),
-									),
-								);
-							}),
-						),
-					]
-				: []),
-		];
-	},
-	config: ({ source, openView }) => ({
-		route: savedViewRoute(source, openView),
-	}),
-	effect: () => {
-		remove(LOCALSTORAGE.LAST_USED_SAVED_VIEWS);
-	},
-});
-
-/**
- * The per-view read denial answers `authz/check` in place of the global access
- * mocks, so it reads their controls as well as its own to answer every other
- * check the way they would.
- */
-export const savedViewsMocks: StoryMocks<typeof controls> = {
-	...definition,
-	read: (args) => ({ ...authzMocks.read(args), ...definition.read(args) }),
-};

frontend/src/container/SavedViews/stories/SavedViews.stories.tsx

@@ -1,114 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-import { TooltipProvider } from '@signozhq/ui/tooltip';
-import { SIDEBAR_TOOLTIP_DELAY_MS } from 'components/QuickFilters/QuickFiltersLayout/constants';
-import { expect, screen, userEvent, waitFor, within } from 'storybook/test';
-
-import { storyMocks } from '@/storybook/controls/defineStoryMocks';
-import { withCanvas } from '@/storybook/decorators/withCanvas';
-import type { PageStoryArgs } from '@/storybook/runtime/resolveStory';
-
-import SavedViewsHeader from '../SavedViewsHeader';
-import SavedViewsPanel from '../SavedViewsPanel';
-import { savedViewsMocks } from './SavedViews.stories.mocks';
-
-type SavedViewsArgs = PageStoryArgs<typeof savedViewsMocks>;
-
-const componentStory = storyMocks(savedViewsMocks);
-
-/** The panel fetches the list and checks every row's permissions before it settles. */
-const untilLoaded = { timeout: 15_000 };
-
-/**
- * The saved views sidebar of an explorer without quick filters: the header with
- * the open view and its actions, above the list of views created by the user
- * and by others. Every action is gated on the `saved-view` authz permissions
- * (list, create, and read, update and delete per view).
- *
- * Route: the explorer of the Source control, with the Open view control's
- * `viewKey`.
- */
-const meta = {
-	title: 'Components/Saved Views',
-	tags: ['authz', 'play'],
-	component: SavedViewsPanel,
-	decorators: [
-		withCanvas({
-			width: 280,
-			height: 640,
-			padding: 0,
-			display: 'flex',
-			flexDirection: 'column',
-			borderRight: '1px solid var(--l1-border)',
-		}),
-	],
-	render: ({ source }): JSX.Element => (
-		<TooltipProvider delay={SIDEBAR_TOOLTIP_DELAY_MS}>
-			<SavedViewsHeader source={source} />
-			<SavedViewsPanel source={source} />
-		</TooltipProvider>
-	),
-	...componentStory,
-	parameters: { ...componentStory.parameters },
-} satisfies Meta<SavedViewsArgs>;
-
-export default meta;
-
-type Story = StoryObj<SavedViewsArgs>;
-
-/** Traces views created by the user and by others, with no view open. */
-export const Default: Story = {};
-
-/** A workspace with no views yet: the empty state offers Create view. */
-export const Empty: Story = {
-	args: { createdByMe: 0, createdByOthers: 0 },
-};
-
-/**
- * A view open with a query that differs from what it saved: the name carries
- * the unsaved dot, and ✓ and discard replace Clear view.
- */
-export const UnsavedChanges: Story = {
-	args: { openView: 'unsaved-changes' },
-};
-
-/** Without `list` on saved views, the panel shows the permission callout. */
-export const NoAccess: Story = {
-	args: { revoked: ['list:saved-view'] },
-};
-
-/**
- * The first row's menu. Edit details and Delete follow `update` and `delete` on
- * that view, so revoking either disables its item.
- */
-export const RowMenu: Story = {
-	play: async ({ canvasElement }): Promise<void> => {
-		const [row] = await within(canvasElement).findAllByTestId(
-			'saved-views-row',
-			undefined,
-			untilLoaded,
-		);
-
-		await userEvent.click(within(row).getByTestId('saved-views-row-menu'));
-		await screen.findByRole('menu', undefined, untilLoaded);
-	},
-};
-
-/**
- * The ✓ menu on a view with unsaved changes. Save as new view follows `create`
- * and Update selected view follows `update` on the open view.
- */
-export const SaveChangesMenu: Story = {
-	args: { openView: 'unsaved-changes' },
-	play: async ({ canvasElement }): Promise<void> => {
-		const trigger = await waitFor(async () => {
-			const button = within(canvasElement).getByTestId('saved-views-save-changes');
-
-			await expect(button).not.toHaveAttribute('aria-busy');
-
-			return button;
-		}, untilLoaded);
-
-		await userEvent.click(trigger);
-		await screen.findByRole('menu', undefined, untilLoaded);
-	},
-};

frontend/src/container/SavedViews/stories/__story_mockdata__/savedViews.ts

@@ -1,309 +0,0 @@
-/**
- * AI-owned. Generated and maintained by the `signoz-page-story` skill.
- * Do not hand-edit: regenerate instead.
- */
-
-import type {
-	GetSavedView200,
-	ListSavedViews200,
-	RenderErrorResponseDTO,
-	SavedviewtypesSavedViewDTO,
-} from 'api/generated/services/sigNoz.schemas';
-import {
-	SavedviewtypesSchemaVersionDTO,
-	SavedviewtypesSourceDTO,
-} from 'api/generated/services/sigNoz.schemas';
-import { QueryParams } from 'constants/query';
-import {
-	initialQueriesMap,
-	initialQueryMeterWithType,
-	PANEL_TYPES,
-} from 'constants/queryBuilder';
-import ROUTES from 'constants/routes';
-import { getSavedViewQuery } from 'container/SavedViews/utils/getSavedViewQuery';
-import { toSavedViewSpec } from 'container/SavedViews/utils/toSavedViewSpec';
-import { createAppContextMock } from 'tests/fixtures/appContextMock';
-import type { Query } from 'types/api/queryBuilder/queryBuilderData';
-import { USER_ROLES } from 'types/roles';
-
-export const SAVED_VIEW_SOURCES = [
-	SavedviewtypesSourceDTO.traces,
-	SavedviewtypesSourceDTO.logs,
-	SavedviewtypesSourceDTO.metrics,
-	SavedviewtypesSourceDTO.meter,
-] as const;
-
-export type SavedViewSource = (typeof SAVED_VIEW_SOURCES)[number];
-
-export const OPEN_VIEWS = [
-	'none',
-	'created-by-me',
-	'created-by-others',
-	'unsaved-changes',
-	'forbidden',
-	'failed',
-	'not-found',
-] as const;
-
-export type OpenView = (typeof OPEN_VIEWS)[number];
-
-export const SAVED_VIEWS_MAX = 8;
-
-/** The user the story app context signs in as, so "Created by me" follows it. */
-const STORY_USER_EMAIL = createAppContextMock(USER_ROLES.ADMIN).user.email;
-
-const OTHER_AUTHORS = ['priya@signoz.io', 'marco@signoz.io', 'lena@signoz.io'];
-
-const MY_VIEW_NAMES = [
-	'Checkout errors',
-	'Slow payment calls',
-	'Cart service, production',
-	'Auth retries',
-	'Inventory sync',
-	'Search p99 regressions',
-	'Webhook failures',
-	'Cold starts after deploy',
-];
-
-const OTHER_VIEW_NAMES = [
-	'On-call triage',
-	'Frontend 5xx',
-	'Shipping latency by region',
-	'Kafka consumer lag',
-	'Staging smoke tests',
-	'Recommendation timeouts',
-	'Ad service sampling',
-	'Email queue backlog',
-];
-
-const EXPRESSIONS = [
-	"service.name = 'checkout' AND has_error = true",
-	"service.name = 'payments'",
-	"service.name = 'cart' AND deployment.environment = 'production'",
-	"service.name = 'auth'",
-	"service.name IN ('inventory', 'catalog')",
-	"service.name = 'search'",
-	"service.name = 'webhooks' AND has_error = true",
-	"deployment.environment = 'production'",
-];
-
-const BASE_QUERY: Record<SavedViewSource, Query> = {
-	traces: initialQueriesMap.traces,
-	logs: initialQueriesMap.logs,
-	metrics: initialQueriesMap.metrics,
-	meter: initialQueryMeterWithType,
-};
-
-const EXPLORER_ROUTE: Record<SavedViewSource, string> = {
-	traces: ROUTES.TRACES_EXPLORER,
-	logs: ROUTES.LOGS_EXPLORER,
-	metrics: ROUTES.METRICS_EXPLORER_EXPLORER,
-	meter: ROUTES.METER_EXPLORER,
-};
-
-const queryWith = (source: SavedViewSource, expression: string): Query => {
-	const base = BASE_QUERY[source];
-
-	return {
-		...base,
-		builder: {
-			...base.builder,
-			queryData: [
-				{
-					...base.builder.queryData[0],
-					filter: { expression },
-					aggregations: [{ expression: 'count()' }],
-				},
-			],
-		},
-	} as Query;
-};
-
-type Author = 'mine' | 'others';
-
-const viewId = (
-	source: SavedViewSource,
-	author: Author,
-	index: number,
-): string => `storybook-${source}-${author}-${index + 1}`;
-
-/** The view other people made that the per-view read denial applies to. */
-export const unreadableViewId = (source: SavedViewSource): string =>
-	viewId(source, 'others', 0);
-
-const savedView = (
-	source: SavedViewSource,
-	author: Author,
-	index: number,
-): SavedviewtypesSavedViewDTO => {
-	const displayName = (author === 'mine' ? MY_VIEW_NAMES : OTHER_VIEW_NAMES)[
-		index
-	];
-	const createdBy =
-		author === 'mine'
-			? STORY_USER_EMAIL
-			: OTHER_AUTHORS[index % OTHER_AUTHORS.length];
-	const id = viewId(source, author, index);
-
-	return {
-		id,
-		name: id,
-		source,
-		schemaVersion: SavedviewtypesSchemaVersionDTO.v2,
-		createdAt: '2026-09-02T08:30:00Z',
-		createdBy,
-		updatedAt: `2026-10-${String(14 - (index % 10)).padStart(2, '0')}T11:42:00Z`,
-		updatedBy: createdBy,
-		spec: toSavedViewSpec({
-			query: queryWith(
-				source,
-				EXPRESSIONS[(index + (author === 'mine' ? 0 : 3)) % EXPRESSIONS.length],
-			),
-			panelType: PANEL_TYPES.LIST,
-			displayName,
-		}),
-	};
-};
-
-const savedViews = (
-	source: SavedViewSource,
-	author: Author,
-	count: number,
-): SavedviewtypesSavedViewDTO[] =>
-	Array.from({ length: Math.min(count, SAVED_VIEWS_MAX) }, (_, index) =>
-		savedView(source, author, index),
-	);
-
-export const savedViewsListResponse = (
-	source: SavedViewSource,
-	createdByMe: number,
-	createdByOthers: number,
-): ListSavedViews200 => ({
-	status: 'success',
-	data: [
-		...savedViews(source, 'mine', createdByMe),
-		...savedViews(source, 'others', createdByOthers),
-	],
-});
-
-/** Every view the workspace has, whatever the list control trims it to. */
-export const savedViewById = (
-	id: string,
-): SavedviewtypesSavedViewDTO | undefined =>
-	SAVED_VIEW_SOURCES.flatMap((source) => [
-		...savedViews(source, 'mine', SAVED_VIEWS_MAX),
-		...savedViews(source, 'others', SAVED_VIEWS_MAX),
-	]).find((view) => view.id === id);
-
-/** A view the panel itself created, owned by the story user. */
-export const createdSavedView = (
-	source: SavedViewSource,
-	id: string,
-	spec: SavedviewtypesSavedViewDTO['spec'],
-): SavedviewtypesSavedViewDTO => ({
-	...savedView(source, 'mine', 0),
-	id,
-	name: id,
-	createdAt: '2026-10-16T09:00:00Z',
-	updatedAt: '2026-10-16T09:00:00Z',
-	spec,
-});
-
-export const savedViewResponse = (
-	view: SavedviewtypesSavedViewDTO,
-): GetSavedView200 => ({ status: 'success', data: view });
-
-export const OPEN_VIEW_ERRORS: Partial<
-	Record<OpenView, { status: number; body: RenderErrorResponseDTO }>
-> = {
-	forbidden: {
-		status: 403,
-		body: {
-			status: 'error',
-			error: {
-				code: 'forbidden',
-				message: 'You do not have access to this saved view',
-				errors: [],
-				suggestions: [],
-				type: 'forbidden',
-			},
-		},
-	},
-	failed: {
-		status: 500,
-		body: {
-			status: 'error',
-			error: {
-				code: 'internal',
-				message: 'Failed to load the saved view',
-				errors: [],
-				suggestions: [],
-				type: 'internal',
-			},
-		},
-	},
-	'not-found': {
-		status: 404,
-		body: {
-			status: 'error',
-			error: {
-				code: 'not_found',
-				message: 'Saved view not found',
-				errors: [],
-				suggestions: [],
-				type: 'not_found',
-			},
-		},
-	},
-};
-
-const openViewId = (source: SavedViewSource, open: OpenView): string | null => {
-	if (open === 'none') {
-		return null;
-	}
-
-	if (open === 'created-by-others' || open === 'forbidden') {
-		return viewId(source, 'others', 0);
-	}
-
-	if (open === 'not-found') {
-		return `storybook-${source}-deleted`;
-	}
-
-	return viewId(source, 'mine', 0);
-};
-
-/**
- * The explorer url with a view open, its params written the way
- * `redirectWithQueryBuilderData` writes them. `panelTypes` is left out: the
- * query builder seeds its panel type from the raw, JSON-quoted param, which no
- * saved panel type equals, and without it the header compares against `list`.
- */
-export const savedViewRoute = (
-	source: SavedViewSource,
-	open: OpenView,
-): string => {
-	const params = new URLSearchParams({ relativeTime: '15m' });
-	const id = openViewId(source, open);
-
-	if (id) {
-		const view = savedViewById(id);
-		const query = view
-			? getSavedViewQuery(view)
-			: queryWith(source, EXPRESSIONS[0]);
-		const staged =
-			open === 'unsaved-changes'
-				? queryWith(source, `${EXPRESSIONS[0]} AND duration_nano > 500000000`)
-				: query;
-
-		params.set(
-			QueryParams.compositeQuery,
-			encodeURIComponent(
-				JSON.stringify({ ...staged, id: `storybook-staged-${open}` }),
-			),
-		);
-		params.set(QueryParams.viewKey, JSON.stringify(id));
-	}
-
-	return `${EXPLORER_ROUTE[source]}?${params.toString()}`;
-};

frontend/src/container/SavedViews/types.ts

@@ -1,6 +1,5 @@
 import { ReactElement, ReactNode } from 'react';
 import type { Link } from '@signozhq/icons';
-import type { BrandedPermission } from 'lib/authz/hooks/useAuthZ/types';
 import {
 	SavedviewtypesSavedViewDTO,
 	SavedviewtypesSourceDTO,
@@ -42,8 +41,6 @@ export interface UseActiveSavedViewResult {
 	view: SavedviewtypesSavedViewDTO | undefined;
 	isLoading: boolean;
 	isError: boolean;
-	isReadDenied: boolean;
-	errorMessage: string | undefined;
 	hasUnsavedChanges: boolean;
 }
 
@@ -73,7 +70,6 @@ export interface SaveViewModalProps {
 }
 
 export interface SaveChangesMenuProps {
-	viewId: string;
 	disabled: boolean;
 	onSaveAsNew: () => void;
 	onUpdate: () => void;
@@ -86,7 +82,6 @@ export interface SavedViewsIconButtonProps {
 	color?: 'secondary' | 'warning';
 	disabled?: boolean;
 	disabledTooltip?: ReactNode;
-	checks?: BrandedPermission[];
 	onClick?: () => void;
 }
 
@@ -121,11 +116,7 @@ export interface SavedViewsListRowProps {
 	hover: SavedViewsListRowHoverProps;
 }
 
-export type SavedViewRowActionKey =
-	| 'copyLink'
-	| 'copyId'
-	| 'editDetails'
-	| 'delete';
+export type SavedViewRowActionKey = 'copyLink' | 'editDetails' | 'delete';
 
 export interface SavedViewRowActionConfig {
 	key: SavedViewRowActionKey;
@@ -133,11 +124,10 @@ export interface SavedViewRowActionConfig {
 	icon: typeof Link;
 	danger?: boolean;
 	hasDividerBefore?: boolean;
-	buildPermission?: (id: string) => BrandedPermission;
 }
 
 export interface PendingSavedViewAction {
-	key: Exclude<SavedViewRowActionKey, 'copyLink' | 'copyId'>;
+	key: Exclude<SavedViewRowActionKey, 'copyLink'>;
 	view: SavedviewtypesSavedViewDTO;
 }
 
@@ -150,7 +140,6 @@ export interface SavedViewsRowButtonProps {
 }
 
 export interface SavedViewsRowMenuProps {
-	viewId: string;
 	onAction: (key: SavedViewRowActionKey) => void;
 	onOpen: () => void;
 }
@@ -163,7 +152,6 @@ export interface DeleteSavedViewDialogProps {
 
 export interface UseSavedViewRowActionsResult {
 	copyViewLink: (view: SavedviewtypesSavedViewDTO) => void;
-	copyViewId: (view: SavedviewtypesSavedViewDTO) => void;
 	renameView: (
 		view: SavedviewtypesSavedViewDTO,
 		displayName: string,

frontend/src/container/WidgetCard/Card/FullView/contants.ts

@@ -28,6 +28,7 @@ export const PANEL_TYPES_VS_FULL_VIEW_TABLE: PanelTypeAndGraphManagerVisibilityP
 		TRACE: false,
 		BAR: true,
 		AREA: true,
+		SCATTER: false,
 		PIE: false,
 		HISTOGRAM: false,
 		HEATMAP: false,

frontend/src/container/WidgetCard/Panels/BarPanel/__tests__/utils.test.ts

@@ -1,4 +1,3 @@
-import type { ExtendedSeries } from 'lib/uPlotV2/config/types';
 import { Widgets } from 'types/api/widgets/widget';
 import {
 	MetricRangePayloadProps,
@@ -165,27 +164,6 @@ describe('BarPanel utils', () => {
 			expect(config.series).toHaveLength(3);
 		});
 
-		it('passes partial timestamps to the series', () => {
-			const apiResponse = createApiResponse([
-				{
-					metric: {},
-					queryName: 'Q1',
-					values: [
-						[1000, '1'],
-						[1060, '0.2'],
-					],
-					partialTimestamps: [1060],
-				} as MetricRangePayloadProps['data']['result'][0],
-			]);
-
-			const series = prepareBarPanelConfig({
-				...baseParams,
-				apiResponse,
-			}).getConfig().series?.[1] as ExtendedSeries;
-
-			expect(series.partialTimestamps).toStrictEqual(new Set([1060]));
-		});
-
 		it('uses getLegend for label when currentQuery is provided', () => {
 			const apiResponse = createApiResponse([
 				{

frontend/src/container/WidgetCard/Panels/BarPanel/utils.ts

@@ -89,9 +89,6 @@ export function prepareBarPanelConfig({
 			isDarkMode,
 			stepInterval: currentStepInterval,
 			metric: series.metric,
-			partialTimestamps: series.partialTimestamps
-				? new Set(series.partialTimestamps)
-				: undefined,
 		});
 	});
 

frontend/src/container/WidgetCard/Panels/TimeSeriesPanel/__tests__/utils.test.ts

@@ -5,7 +5,6 @@ import {
 } from 'types/api/metrics/getQueryRange';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';
 
-import type { ExtendedSeries } from 'lib/uPlotV2/config/types';
 import { PanelMode } from 'lib/visualization/panels/types';
 import { prepareUPlotConfig } from 'container/WidgetCard/Panels/TimeSeriesPanel/utils';
 import { prepareChartData } from 'lib/uPlotV2/utils/dataUtils';
@@ -186,28 +185,6 @@ describe('TimeSeriesPanel utils', () => {
 			});
 		});
 
-		it('passes partial timestamps to the series', () => {
-			const apiResponse = createApiResponse([
-				{
-					metric: {},
-					queryName: 'Q1',
-					values: [
-						[1000, '1'],
-						[1060, '0.2'],
-					],
-					partialTimestamps: [1060],
-				} as MetricRangePayloadProps['data']['result'][0],
-			]);
-
-			const series = prepareUPlotConfig({
-				...baseParams,
-				apiResponse,
-				currentQuery: null as unknown as Query,
-			}).getConfig().series?.[1] as ExtendedSeries;
-
-			expect(series.partialTimestamps).toStrictEqual(new Set([1060]));
-		});
-
 		it('uses getLegend for label when currentQuery is provided', () => {
 			const apiResponse = createApiResponse([
 				{

frontend/src/container/WidgetCard/Panels/TimeSeriesPanel/utils.ts

@@ -101,9 +101,6 @@ export const prepareUPlotConfig = ({
 			fillMode: widget.fillMode || FillMode.None,
 			isDarkMode,
 			metric: series.metric,
-			partialTimestamps: series.partialTimestamps
-				? new Set(series.partialTimestamps)
-				: undefined,
 		});
 	});
 

frontend/src/container/WidgetCard/Panels/constants.ts

@@ -16,6 +16,7 @@ export const PanelTypeVsPanelWrapper = {
 	[PANEL_TYPES.TRACE]: null,
 	// Dashboards v2 renders this kind; the V1 wrapper map is never asked for it.
 	[PANEL_TYPES.TEXT]: null,
+	[PANEL_TYPES.SCATTER]: null,
 	[PANEL_TYPES.EMPTY_WIDGET]: null,
 	[PANEL_TYPES.PIE]: PiePanelWrapper,
 	[PANEL_TYPES.BAR]: BarPanel,

frontend/src/lib/authz/hooks/useAuthZ/permissions.type.ts

@@ -23,11 +23,6 @@ export default {
 				type: 'metaresource',
 				allowedVerbs: ['list', 'read', 'update'],
 			},
-			{
-				kind: 'saved-view',
-				type: 'metaresource',
-				allowedVerbs: ['create', 'delete', 'list', 'read', 'update'],
-			},
 			{
 				kind: 'subscription',
 				type: 'metaresource',

frontend/src/lib/authz/hooks/useAuthZ/permissions/saved-view.permissions.ts

@@ -1,15 +0,0 @@
-import type { BrandedPermission } from '../types';
-import { buildPermission } from '../utils';
-
-export const SavedViewListPermission = buildPermission('list', 'saved-view:*');
-export const SavedViewCreatePermission = buildPermission(
-	'create',
-	'saved-view:*',
-);
-
-export const buildSavedViewReadPermission = (id: string): BrandedPermission =>
-	buildPermission('read', `saved-view:${id}`);
-export const buildSavedViewUpdatePermission = (id: string): BrandedPermission =>
-	buildPermission('update', `saved-view:${id}`);
-export const buildSavedViewDeletePermission = (id: string): BrandedPermission =>
-	buildPermission('delete', `saved-view:${id}`);

frontend/src/lib/newQueryBuilder/__test__/convertNewDataToOld.test.ts

@@ -1,42 +0,0 @@
-import { MetricRangePayloadV3 } from 'types/api/metrics/getQueryRange';
-
-import { convertNewDataToOld } from '../convertNewDataToOld';
-
-describe('convertNewDataToOld', () => {
-	it('carries partial values as epoch-second partialTimestamps', () => {
-		const payload = {
-			data: {
-				resultType: 'time_series',
-				result: [
-					{
-						queryName: 'A',
-						series: [
-							{
-								labels: {},
-								labelsArray: [],
-								values: [
-									{ timestamp: 1_000_000, value: '1' },
-									{ timestamp: 1_060_000, value: '0.2', partial: true },
-								],
-							},
-							{
-								labels: {},
-								labelsArray: [],
-								values: [{ timestamp: 1_000_000, value: '1' }],
-							},
-						],
-					},
-				],
-			},
-		} as unknown as MetricRangePayloadV3;
-
-		const [partial, complete] = convertNewDataToOld(payload).data.result;
-
-		expect(partial.values).toStrictEqual([
-			[1000, '1'],
-			[1060, '0.2'],
-		]);
-		expect(partial.partialTimestamps).toStrictEqual([1060]);
-		expect(complete).not.toHaveProperty('partialTimestamps');
-	});
-});

frontend/src/lib/newQueryBuilder/convertNewDataToOld.ts

@@ -25,16 +25,11 @@ export const convertNewDataToOld = (
 					return [...acc, renderValues];
 				}, []);
 
-				const partialTimestamps = series.values
-					.filter((value) => value.partial)
-					.map((value) => value.timestamp / 1000);
-
 				const result: QueryData = {
 					metric: series.labels,
 					values,
 					queryName: `${item.queryName}`,
 					metaData: series.metaData,
-					...(partialTimestamps.length ? { partialTimestamps } : {}),
 				};
 
 				oldResult.push(result);

frontend/src/lib/query/panelTypeDataSourceFormValuesMap.ts

@@ -14,6 +14,7 @@ export type PartialPanelTypes = {
 	[PANEL_TYPES.AREA]: 'area';
 	[PANEL_TYPES.VALUE]: 'value';
 	[PANEL_TYPES.PIE]: 'pie';
+	[PANEL_TYPES.SCATTER]: 'scatter';
 	[PANEL_TYPES.HISTOGRAM]: 'histogram';
 	[PANEL_TYPES.HEATMAP]: 'heatmap';
 };
@@ -150,6 +151,7 @@ export const panelTypeDataSourceFormValuesMap: Record<
 	[PANEL_TYPES.HEATMAP]: bySource(HEATMAP, HEATMAP_METRICS),
 	[PANEL_TYPES.TABLE]: bySource(SERIES, SCALAR_METRICS),
 	[PANEL_TYPES.PIE]: bySource(SERIES, SCALAR_METRICS),
+	[PANEL_TYPES.SCATTER]: bySource(SERIES, SCALAR_METRICS),
 	[PANEL_TYPES.VALUE]: bySource(SINGLE_VALUE, SINGLE_VALUE_METRICS),
 	[PANEL_TYPES.LIST]: bySource(RAW_ROWS, RAW_ROWS_METRICS),
 };

frontend/src/lib/uPlotV2/components/Tooltip/ScatterTooltip.module.scss

@@ -0,0 +1,103 @@
+// Sections own the padding so the footer spans edge to edge.
+.container {
+	// Same inset as the heatmap tooltip.
+	--gutter: 14px;
+
+	font-family: 'Inter';
+	font-size: 12px;
+	background: var(--l2-background);
+	-webkit-font-smoothing: antialiased;
+	color: var(--l2-foreground);
+	border-radius: 6px;
+	border: 1px solid var(--l2-border);
+	display: flex;
+	flex-direction: column;
+	min-width: 220px;
+
+	&.pinned {
+		border-color: var(--ring);
+	}
+}
+
+.divider {
+	display: block;
+	width: 100%;
+	height: 1px;
+	background-color: var(--l2-border);
+}
+
+.header {
+	display: flex;
+	align-items: center;
+	gap: var(--spacing-3);
+	padding: var(--spacing-6) var(--gutter);
+}
+
+// Matches the legend row's marker.
+.marker {
+	box-sizing: border-box;
+	width: 12px;
+	height: 12px;
+	border: 1.5px solid;
+	border-radius: var(--radius);
+	flex-shrink: 0;
+}
+
+.title {
+	flex: 1;
+	min-width: 0;
+	font-family: var(--font-mono);
+	font-size: var(--font-size-xs);
+	font-weight: 600;
+	color: var(--text-vanilla-100);
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+
+.status {
+	display: flex;
+	align-items: center;
+	gap: var(--spacing-1);
+	font-size: 11px;
+	color: var(--text-vanilla-400);
+	flex-shrink: 0;
+}
+
+.rows {
+	display: flex;
+	flex-direction: column;
+	gap: var(--spacing-2);
+	padding: var(--spacing-5) var(--gutter);
+}
+
+.row {
+	display: flex;
+	align-items: baseline;
+	justify-content: space-between;
+	gap: var(--spacing-4);
+	font-family: var(--font-mono);
+	font-size: var(--font-size-xs);
+	font-variant-numeric: tabular-nums;
+	color: var(--text-vanilla-100);
+}
+
+.rowMuted {
+	color: var(--text-vanilla-400);
+}
+
+.rowLabel {
+	flex: 1;
+	min-width: 0;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+
+.rowValue {
+	flex: 0 0 auto;
+	max-width: 60%;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}

frontend/src/lib/uPlotV2/components/Tooltip/ScatterTooltip.tsx

@@ -0,0 +1,110 @@
+import { useMemo } from 'react';
+import cx from 'classnames';
+import { Pin } from '@signozhq/icons';
+
+import { ScatterTooltipProps } from '../types';
+import { buildChannelRows, resolveHoveredPoint } from './scatterTooltipContent';
+
+import Styles from './ScatterTooltip.module.scss';
+
+/** Own component: the shared Tooltip lists one row per series at a shared x. */
+export default function ScatterTooltip({
+	uPlotInstance,
+	dataIndexes,
+	seriesIndex,
+	channels,
+	resolvePointLabels,
+	decimalPrecision,
+	isPinned,
+	dismiss,
+	renderTooltipFooter,
+}: ScatterTooltipProps): JSX.Element | null {
+	const point = useMemo(
+		() => resolveHoveredPoint(uPlotInstance, seriesIndex, dataIndexes),
+		[uPlotInstance, seriesIndex, dataIndexes],
+	);
+
+	const rows = useMemo(
+		() => (point ? buildChannelRows(point, channels, decimalPrecision) : []),
+		[point, channels, decimalPrecision],
+	);
+
+	const labels = useMemo(
+		() =>
+			point
+				? (resolvePointLabels?.(point.seriesIndex, point.dataIndex) ?? [])
+				: [],
+		[point, resolvePointLabels],
+	);
+
+	if (!point) {
+		return null;
+	}
+
+	return (
+		<div
+			className={cx(Styles.container, { [Styles.pinned]: isPinned })}
+			data-pinned={isPinned}
+			data-testid="scatter-tooltip"
+		>
+			<div className={Styles.header}>
+				<span
+					className={Styles.marker}
+					style={{ backgroundColor: point.color, borderColor: point.color }}
+				/>
+				<span
+					className={Styles.title}
+					title={point.label}
+					data-testid="scatter-tooltip-title"
+				>
+					{point.label}
+				</span>
+				{isPinned && (
+					<span className={Styles.status} data-testid="scatter-tooltip-status">
+						<Pin size={12} />
+						<span>Pinned</span>
+					</span>
+				)}
+			</div>
+
+			<span className={Styles.divider} />
+
+			<div className={Styles.rows}>
+				{rows.map((row) => (
+					<div
+						key={row.label}
+						className={Styles.row}
+						data-testid="scatter-tooltip-row"
+					>
+						<span className={Styles.rowLabel}>{row.label}</span>
+						<span className={Styles.rowValue}>{row.value}</span>
+					</div>
+				))}
+			</div>
+
+			{labels.length > 0 && (
+				<>
+					<span className={Styles.divider} />
+					<div className={Styles.rows}>
+						{labels.map((label) => (
+							<div
+								key={label.key}
+								className={cx(Styles.row, Styles.rowMuted)}
+								data-testid="scatter-tooltip-label"
+							>
+								<span className={Styles.rowLabel} title={label.key}>
+									{label.key}
+								</span>
+								<span className={Styles.rowValue} title={label.value}>
+									{label.value}
+								</span>
+							</div>
+						))}
+					</div>
+				</>
+			)}
+
+			{renderTooltipFooter?.({ isPinned, dismiss })}
+		</div>
+	);
+}

frontend/src/lib/uPlotV2/components/Tooltip/__tests__/Tooltip.test.tsx

@@ -122,27 +122,6 @@ describe('Tooltip', () => {
 		expect(screen.getByText(expectedTitle)).toBeInTheDocument();
 	});
 
-	it('marks the header partial when a visible series has a partial bucket at the cursor', () => {
-		const withSeries = (series: unknown[]): uPlot =>
-			Object.assign(createUPlotInstance(0), { series });
-		const partial = { show: true, partialTimestamps: new Set([1]) };
-
-		const { unmount } = renderTooltip({
-			uPlotInstance: withSeries([{}, partial]),
-		});
-		expect(screen.getByTestId('uplot-tooltip-header-partial')).toHaveTextContent(
-			'(partial)',
-		);
-		unmount();
-
-		renderTooltip({
-			uPlotInstance: withSeries([{}, { ...partial, show: false }]),
-		});
-		expect(
-			screen.queryByTestId('uplot-tooltip-header-partial'),
-		).not.toBeInTheDocument();
-	});
-
 	it('drops the date from the header title for a point on the current day', () => {
 		const todayTimestamp = dayjs().tz('UTC').startOf('hour').unix();
 		const uPlotInstance = createUPlotInstance(0, todayTimestamp);

frontend/src/lib/uPlotV2/components/Tooltip/__tests__/scatterTooltipContent.test.ts

@@ -0,0 +1,107 @@
+import type uPlot from 'uplot';
+
+import {
+	buildChannelRows,
+	resolveHoveredPoint,
+	ScatterHoveredPoint,
+} from '../scatterTooltipContent';
+
+jest.mock('components/Graph/yAxisConfig', () => ({
+	getToolTipValue: jest.fn((value: number | string, unit?: string) =>
+		`${value} ${unit ?? ''}`.trim(),
+	),
+}));
+
+const plot = {
+	data: [
+		null,
+		[
+			[10, 20],
+			[100, 200],
+			[5, null],
+		],
+		[[30], [300]],
+	],
+	series: [
+		{},
+		{ label: 'cart', stroke: '#ff0000' },
+		{ label: 'checkout', stroke: (): string => '#00ff00' },
+	],
+} as unknown as uPlot;
+
+describe('resolveHoveredPoint', () => {
+	it('reads the focused series at its own data index', () => {
+		expect(resolveHoveredPoint(plot, 1, [null, 1, null])).toStrictEqual({
+			seriesIndex: 1,
+			dataIndex: 1,
+			label: 'cart',
+			color: '#ff0000',
+			x: 20,
+			y: 200,
+			size: null,
+		});
+	});
+
+	it('carries the size column when present and resolves function strokes', () => {
+		expect(resolveHoveredPoint(plot, 1, [null, 0, null])?.size).toBe(5);
+		expect(resolveHoveredPoint(plot, 2, [null, null, 0])).toMatchObject({
+			label: 'checkout',
+			color: '#00ff00',
+			size: null,
+		});
+	});
+
+	it('is null without a focused series or an index for it', () => {
+		expect(resolveHoveredPoint(plot, null, [null, 0, null])).toBeNull();
+		expect(resolveHoveredPoint(plot, 0, [0, 0, null])).toBeNull();
+		expect(resolveHoveredPoint(plot, 1, [null, null, null])).toBeNull();
+	});
+});
+
+describe('buildChannelRows', () => {
+	const point: ScatterHoveredPoint = {
+		seriesIndex: 1,
+		dataIndex: 0,
+		label: 'cart',
+		color: '#f00',
+		x: 12,
+		y: 340,
+		size: 7,
+	};
+
+	it('formats x and y with their own units', () => {
+		const rows = buildChannelRows(point, {
+			x: { label: 'Throughput', unit: 'reqps' },
+			y: { label: 'p99', unit: 'ms' },
+		});
+
+		expect(rows).toStrictEqual([
+			{ label: 'Throughput', value: '12 reqps' },
+			{ label: 'p99', value: '340 ms' },
+		]);
+	});
+
+	it('adds the size row only when the channel is mapped and the point has one', () => {
+		const channels = {
+			x: { label: 'x' },
+			y: { label: 'y' },
+			size: { label: 'Errors' },
+		};
+
+		expect(buildChannelRows(point, channels)).toHaveLength(3);
+		expect(buildChannelRows({ ...point, size: null }, channels)).toHaveLength(2);
+	});
+
+	it('leaves out a size row that repeats the x row', () => {
+		const rows = buildChannelRows(
+			{ ...point, size: point.x },
+			{
+				x: { label: 'A.count()' },
+				y: { label: 'p99' },
+				size: { label: 'A.count()' },
+			},
+		);
+
+		expect(rows.map((row) => row.label)).toStrictEqual(['A.count()', 'p99']);
+	});
+});

frontend/src/lib/uPlotV2/components/Tooltip/components/TooltipHeader/TooltipHeader.module.scss

@@ -13,17 +13,6 @@
 	gap: var(--spacing-2);
 }
 
-.headerEnd {
-	display: flex;
-	align-items: center;
-	gap: var(--spacing-2);
-}
-
-.partialLabel {
-	font-style: italic;
-	opacity: 0.7;
-}
-
 .pinnedItem {
 	padding: var(--spacing-4);
 }

frontend/src/lib/uPlotV2/components/Tooltip/components/TooltipHeader/TooltipHeader.tsx

@@ -5,7 +5,6 @@ import { useTimezone } from 'providers/Timezone';
 import type uPlot from 'uplot';
 import { formatTimestampOmittingTodaysDate } from 'utils/timeUtils';
 
-import type { ExtendedSeries } from '../../../../config/types';
 import { TooltipContentItem } from '../../../types';
 import TooltipItem from '../TooltipItem/TooltipItem';
 import TooltipPinnedBadge from '../TooltipPinnedBadge/TooltipPinnedBadge';
@@ -35,7 +34,7 @@ export default function TooltipHeader({
 	const { timezone: userTimezone } = useTimezone();
 	const resolvedTimezone = timezone?.value ?? userTimezone.value;
 
-	const header = useMemo(() => {
+	const headerTitle = useMemo(() => {
 		if (!showTooltipHeader) {
 			return null;
 		}
@@ -47,21 +46,14 @@ export default function TooltipHeader({
 		if (timestamp == null) {
 			return null;
 		}
-		return {
-			title: formatTimestampOmittingTodaysDate(
-				timestamp * 1000,
-				resolvedTimezone,
-				dateFormat,
-			),
-			isPartial: (uPlotInstance.series ?? []).some(
-				(series: ExtendedSeries) =>
-					series.show && series.partialTimestamps?.has(timestamp),
-			),
-		};
+		return formatTimestampOmittingTodaysDate(
+			timestamp * 1000,
+			resolvedTimezone,
+			dateFormat,
+		);
 	}, [
 		resolvedTimezone,
 		uPlotInstance.data,
-		uPlotInstance.series,
 		uPlotInstance.cursor.idx,
 		showTooltipHeader,
 		dateFormat,
@@ -72,22 +64,10 @@ export default function TooltipHeader({
 			className={Styles.headerContainer}
 			data-testid="uplot-tooltip-header-container"
 		>
-			{showTooltipHeader && header && (
+			{showTooltipHeader && headerTitle && (
 				<div className={cx(Styles.headerRow, headerRowClassName)}>
-					<span>{header.title}</span>
-					{(header.isPartial || isPinned) && (
-						<span className={Styles.headerEnd}>
-							{header.isPartial && (
-								<span
-									className={Styles.partialLabel}
-									data-testid="uplot-tooltip-header-partial"
-								>
-									(partial)
-								</span>
-							)}
-							{isPinned && <TooltipPinnedBadge />}
-						</span>
-					)}
+					<span>{headerTitle}</span>
+					{isPinned && <TooltipPinnedBadge />}
 				</div>
 			)}
 

frontend/src/lib/uPlotV2/components/Tooltip/scatterTooltipContent.ts

@@ -0,0 +1,97 @@
+import { PrecisionOption } from 'components/Graph/types';
+import { getToolTipValue } from 'components/Graph/yAxisConfig';
+import type uPlot from 'uplot';
+
+import type {
+	ScatterChannel,
+	ScatterChannels,
+	ScatterSeriesData,
+} from '../../plugins/ScatterPlugin/types';
+import { resolveSeriesColor } from './utils';
+
+export interface ScatterHoveredPoint {
+	seriesIndex: number;
+	dataIndex: number;
+	label: string;
+	color: string;
+	x: number;
+	y: number;
+	size: number | null;
+}
+
+export interface ScatterTooltipRow {
+	label: string;
+	value: string;
+}
+
+export function resolveHoveredPoint(
+	u: uPlot,
+	seriesIndex: number | null,
+	dataIndexes: Array<number | null>,
+): ScatterHoveredPoint | null {
+	if (seriesIndex == null || seriesIndex < 1) {
+		return null;
+	}
+	const dataIndex = dataIndexes[seriesIndex];
+	const series = u.series[seriesIndex];
+	const columns = u.data[seriesIndex] as unknown as
+		| ScatterSeriesData
+		| undefined;
+	if (dataIndex == null || !series || !columns) {
+		return null;
+	}
+	const x = columns[0][dataIndex];
+	const y = columns[1][dataIndex];
+	if (x == null || y == null) {
+		return null;
+	}
+	return {
+		seriesIndex,
+		dataIndex,
+		label: String(series.label ?? ''),
+		color: resolveSeriesColor(series.stroke, u, seriesIndex),
+		x,
+		y,
+		size: columns[2]?.[dataIndex] ?? null,
+	};
+}
+
+function formatChannel(
+	value: number,
+	channel: ScatterChannel,
+	decimalPrecision?: PrecisionOption,
+): string {
+	return getToolTipValue(value, channel.unit, decimalPrecision);
+}
+
+export function buildChannelRows(
+	point: ScatterHoveredPoint,
+	channels: ScatterChannels,
+	decimalPrecision?: PrecisionOption,
+): ScatterTooltipRow[] {
+	const rows: ScatterTooltipRow[] = [
+		{
+			label: channels.x.label,
+			value: formatChannel(point.x, channels.x, decimalPrecision),
+		},
+		{
+			label: channels.y.label,
+			value: formatChannel(point.y, channels.y, decimalPrecision),
+		},
+	];
+	if (channels.size && point.size != null) {
+		const sizeRow = {
+			label: channels.size.label,
+			value: formatChannel(point.size, channels.size, decimalPrecision),
+		};
+		// Size bound to the X or Y column would only repeat that row.
+		if (
+			!rows.some(
+				(row) => row.label === sizeRow.label && row.value === sizeRow.value,
+			)
+		) {
+			rows.push(sizeRow);
+		}
+	}
+	return rows;
+}

frontend/src/lib/uPlotV2/components/types.ts

@@ -6,6 +6,10 @@ import uPlot from 'uplot';
 import { UPlotConfigBuilder } from '../config/UPlotConfigBuilder';
 import { LegendItem } from '../config/types';
 import { HeatmapSeries, HeatmapYAxis } from '../plugins/HeatmapPlugin/types';
+import type {
+	ScatterChannels,
+	ScatterPointLabel,
+} from '../plugins/ScatterPlugin/types';
 import { SyncTooltipFilterMode } from '../plugins/TooltipPlugin/types';
 
 /**
@@ -119,6 +123,16 @@ export interface HeatmapTooltipProps
 	groupColor: string;
 }
 
+export interface ScatterTooltipProps
+	extends BaseTooltipProps, TooltipRenderArgs {
+	channels: ScatterChannels;
+	/** The group values behind a point, e.g. `service.name` → `cart`. */
+	resolvePointLabels?: (
+		seriesIndex: number,
+		dataIndex: number,
+	) => ScatterPointLabel[];
+}
+
 export type TooltipProps =
 	| TimeSeriesTooltipProps
 	| BarTooltipProps

frontend/src/lib/uPlotV2/config/UPlotAxisBuilder.ts

@@ -39,6 +39,16 @@ export class UPlotAxisBuilder extends ConfigBuilder<AxisProps, Axis> {
 		};
 	}
 
+	/** Styled like the grid. */
+	private buildBorderConfig(
+		grid: uPlot.Axis.Grid | undefined,
+	): uPlot.Axis.Border | undefined {
+		if (this.props.showBorder === false || !grid || grid.show === false) {
+			return undefined;
+		}
+		return { show: true, stroke: grid.stroke, width: grid.width };
+	}
+
 	/**
 	 * Build ticks configuration
 	 */
@@ -57,33 +67,43 @@ export class UPlotAxisBuilder extends ConfigBuilder<AxisProps, Axis> {
 		};
 	}
 
-	/**
-	 * Build values formatter for X-axis (time)
-	 */
+	/** Time ticks, or unit-formatted values when a unit/precision is set. */
 	private buildXAxisValuesFormatter(): uPlot.Axis.Values | undefined {
-		const { isTimeAxis } = this.props;
+		const { isTimeAxis, yAxisUnit, decimalPrecision } = this.props;
 
 		if (isTimeAxis) {
 			return uPlotXAxisValuesFormat as uPlot.Axis.Values;
 		}
 
+		if (yAxisUnit !== undefined || decimalPrecision !== undefined) {
+			return this.buildValueAxisFormatter();
+		}
+
 		return undefined;
 	}
 
-	/**
-	 * Build values formatter for Y-axis (values with units)
-	 */
-	private buildYAxisValuesFormatter(): uPlot.Axis.Values {
-		const { yAxisUnit, decimalPrecision } = this.props;
+	/** Blanks splits outside the scale; uPlot's asinh splits always include ±threshold. */
+	private buildValueAxisFormatter(): uPlot.Axis.Values {
+		const { yAxisUnit, decimalPrecision, scaleKey } = this.props;
 
-		return (_, t): string[] =>
-			t.map((v) => {
-				if (v === null || v === undefined || Number.isNaN(v)) {
+		return (u, t): string[] => {
+			const scale = u?.scales?.[scaleKey];
+			const min = scale?.min ?? -Infinity;
+			const max = scale?.max ?? Infinity;
+			return t.map((v) => {
+				if (
+					v === null ||
+					v === undefined ||
+					Number.isNaN(v) ||
+					v < min ||
+					v > max
+				) {
 					return '';
 				}
 				const value = getToolTipValue(v.toString(), yAxisUnit, decimalPrecision);
 				return `${value}`;
 			});
+		};
 	}
 
 	/**
@@ -101,7 +121,7 @@ export class UPlotAxisBuilder extends ConfigBuilder<AxisProps, Axis> {
 		return scaleKey === 'x'
 			? this.buildXAxisValuesFormatter()
 			: scaleKey === 'y'
-				? this.buildYAxisValuesFormatter()
+				? this.buildValueAxisFormatter()
 				: undefined;
 	}
 
@@ -149,10 +169,12 @@ export class UPlotAxisBuilder extends ConfigBuilder<AxisProps, Axis> {
 			side = 2, // bottom by default
 			space,
 			splits,
+			filter,
 			gap = 5, // default gap is 5
 		} = this.props;
 
 		const grid = this.buildGridConfig();
+		const border = this.buildBorderConfig(grid);
 		const ticks = this.buildTicksConfig();
 		const values = this.buildValuesFormatter();
 		const size = this.buildSizeCalculator();
@@ -177,6 +199,9 @@ export class UPlotAxisBuilder extends ConfigBuilder<AxisProps, Axis> {
 		if (ticks) {
 			axisConfig.ticks = ticks;
 		}
+		if (border) {
+			axisConfig.border = border;
+		}
 		if (values) {
 			axisConfig.values = values;
 		}
@@ -189,6 +214,9 @@ export class UPlotAxisBuilder extends ConfigBuilder<AxisProps, Axis> {
 		if (space !== undefined) {
 			axisConfig.space = space;
 		}
+		if (filter) {
+			axisConfig.filter = filter;
+		}
 		if (size) {
 			axisConfig.size = size;
 		}

frontend/src/lib/uPlotV2/config/UPlotConfigBuilder.ts

@@ -1,6 +1,5 @@
 import { SeriesVisibilityItem } from 'lib/visualization/panels/types';
 import { getStoredSeriesVisibility } from 'lib/visualization/panels/utils/legendVisibilityUtils';
-import { partialPointsDrawHook } from 'lib/uPlotV2/hooks/partialPointsDrawHook';
 import { ThresholdsDrawHookOptions } from 'lib/uPlotV2/hooks/types';
 import { thresholdsDrawHook } from 'lib/uPlotV2/hooks/useThresholdsDrawHook';
 import { resolveSeriesVisibility } from 'lib/uPlotV2/utils/seriesVisibility';
@@ -20,6 +19,7 @@ import {
 	ConfigBuilder,
 	ConfigBuilderProps,
 	LegendItem,
+	PlotMode,
 	SelectionPreferencesSource,
 	StackMode,
 } from './types';
@@ -66,6 +66,8 @@ export class UPlotConfigBuilder extends ConfigBuilder<
 
 	private stackMode: StackMode = StackMode.None;
 
+	private mode: PlotMode = PlotMode.Aligned;
+
 	private cursor: Cursor | undefined;
 
 	private hooks: Hooks.Arrays = {};
@@ -82,8 +84,6 @@ export class UPlotConfigBuilder extends ConfigBuilder<
 
 	private thresholds: Record<string, ThresholdsDrawHookOptions> = {};
 
-	private hasPartialPointsHook = false;
-
 	private tzDate: ((timestamp: number) => Date) | undefined;
 
 	private id: string;
@@ -163,6 +163,10 @@ export class UPlotConfigBuilder extends ConfigBuilder<
 		return this.stackMode;
 	}
 
+	setMode(mode: PlotMode): void {
+		this.mode = mode;
+	}
+
 	/**
 	 * Add or merge a scale configuration
 	 */
@@ -180,10 +184,6 @@ export class UPlotConfigBuilder extends ConfigBuilder<
 	 */
 	addSeries(props: SeriesProps): void {
 		this.series.push(new UPlotSeriesBuilder(props));
-		if (props.partialTimestamps?.size && !this.hasPartialPointsHook) {
-			this.hasPartialPointsHook = true;
-			this.addHook('draw', partialPointsDrawHook);
-		}
 	}
 
 	getSeriesSpanGapsOptions(): SeriesSpanGapsOption[] {
@@ -519,6 +519,10 @@ export class UPlotConfigBuilder extends ConfigBuilder<
 			{} as Record<string, uPlot.Scale>,
 		);
 
+		if (this.mode === PlotMode.Faceted) {
+			config.mode = this.mode as number as uPlot.Mode;
+		}
+
 		config.hooks = this.hooks;
 		config.select = this.select;
 

frontend/src/lib/uPlotV2/config/UPlotScaleBuilder.ts

@@ -40,6 +40,7 @@ export class UPlotScaleBuilder extends ConfigBuilder<
 			range,
 			thresholds,
 			logBase = 10,
+			asinhThreshold,
 			padMinBy = 0,
 			padMaxBy = 0.05,
 		} = this.props;
@@ -99,6 +100,7 @@ export class UPlotScaleBuilder extends ConfigBuilder<
 			time,
 			distr,
 			logBase,
+			asinhThreshold,
 		});
 
 		const { rangeConfig, hardMinOnly, hardMaxOnly, hasFixedRange } =

frontend/src/lib/uPlotV2/config/UPlotSeriesBuilder.ts

@@ -4,7 +4,6 @@ import { calculateWidthBasedOnStepInterval } from 'lib/uPlotV2/utils';
 import uPlot, { Series } from 'uplot';
 
 import { resolveFillOpacity, toAlphaHex } from '../utils/fillOpacity';
-import { reportBarRect } from '../utils/barRect';
 import { generateGradientFill } from '../utils/generateGradientFill';
 import { isolatedPointFilter } from '../utils/seriesPointsFilter';
 import {
@@ -88,6 +87,8 @@ export class UPlotSeriesBuilder extends ConfigBuilder<
 			lineConfig.fill = finalFillColor;
 		} else if (this.props.drawStyle === DrawStyle.Histogram) {
 			lineConfig.fill = `${finalFillColor}40`;
+		} else if (this.props.drawStyle === DrawStyle.Scatter) {
+			lineConfig.fill = `${finalFillColor}${toAlphaHex(resolveFillOpacity(fillOpacity))}`;
 		} else if (fillMode && fillMode !== FillMode.None) {
 			const resolvedOpacity = resolveFillOpacity(fillOpacity);
 			if (fillMode === FillMode.Solid) {
@@ -123,7 +124,7 @@ export class UPlotSeriesBuilder extends ConfigBuilder<
 			return { paths: pathBuilder };
 		}
 
-		if (drawStyle === DrawStyle.Points) {
+		if (drawStyle === DrawStyle.Points || drawStyle === DrawStyle.Scatter) {
 			return { paths: (): null => null };
 		}
 
@@ -195,6 +196,10 @@ export class UPlotSeriesBuilder extends ConfigBuilder<
 		if (drawStyle === DrawStyle.Points) {
 			return true;
 		}
+		// The discs are the series path; uPlot's own points would double-draw them.
+		if (drawStyle === DrawStyle.Scatter) {
+			return false;
+		}
 		return !!showPoints;
 	}
 
@@ -219,14 +224,7 @@ export class UPlotSeriesBuilder extends ConfigBuilder<
 	}
 
 	getConfig(): ExtendedSeries {
-		const {
-			scaleKey,
-			label,
-			spanGaps,
-			show = true,
-			metric,
-			partialTimestamps,
-		} = this.props;
+		const { scaleKey, label, spanGaps, show = true, metric, facets } = this.props;
 
 		const resolvedLineColor = this.getLineColor();
 
@@ -254,7 +252,7 @@ export class UPlotSeriesBuilder extends ConfigBuilder<
 			...pathConfig,
 			points: Object.keys(pointsConfig).length > 0 ? pointsConfig : undefined,
 			metric,
-			...(partialTimestamps?.size ? { partialTimestamps } : {}),
+			...(facets && { facets }),
 		};
 	}
 }
@@ -367,7 +365,6 @@ function getBarPathBuilder({
 				builders[barsCfgKey] = barsPathBuilderFactory({
 					size: [barWidthFactor, effectiveBarMaxWidth],
 					align: barAlignment,
-					each: reportBarRect,
 				});
 			}
 
@@ -382,7 +379,6 @@ function getBarPathBuilder({
 		builders[barsCfgKey] = barsPathBuilderFactory({
 			size: [barWidthFactor, barMaxWidth],
 			align: barAlignment,
-			each: reportBarRect,
 		});
 	}
 

frontend/src/lib/uPlotV2/config/__tests__/UPlotAxisBuilder.test.ts

@@ -120,6 +120,41 @@ describe('UPlotAxisBuilder', () => {
 		});
 	});
 
+	it('draws the axis line by default, styled like the grid', () => {
+		const config = new UPlotAxisBuilder(
+			createAxisProps({ isDarkMode: true, grid: { width: 0.5 } }),
+		).getConfig();
+
+		expect(config.border).toStrictEqual({
+			show: true,
+			stroke: config.grid?.stroke,
+			width: 0.5,
+		});
+	});
+
+	it('leaves the axis line off when showBorder is false', () => {
+		expect(
+			new UPlotAxisBuilder(createAxisProps({ showBorder: false })).getConfig(),
+		).not.toHaveProperty('border');
+	});
+
+	it('leaves the axis line off when the grid is hidden', () => {
+		expect(
+			new UPlotAxisBuilder(createAxisProps({ grid: { show: false } })).getConfig(),
+		).not.toHaveProperty('border');
+	});
+
+	it('passes explicit splits and a label filter through to uPlot', () => {
+		const splits = jest.fn();
+		const filter = jest.fn();
+		const config = new UPlotAxisBuilder(
+			createAxisProps({ splits, filter }),
+		).getConfig();
+
+		expect(config.splits).toBe(splits);
+		expect(config.filter).toBe(filter);
+	});
+
 	it('uses provided ticks config when present and falls back to defaults otherwise', () => {
 		const customTicks = { width: 1, show: false };
 		const withTicks = new UPlotAxisBuilder(
@@ -376,3 +411,51 @@ describe('UPlotAxisBuilder', () => {
 		expect(config.values).toBeDefined();
 	});
 });
+
+describe('UPlotAxisBuilder value x axis', () => {
+	it('formats a non-time x axis with its unit', () => {
+		(getToolTipValue as jest.Mock).mockReturnValue('1.2K req/s');
+		const config = new UPlotAxisBuilder(
+			createAxisProps({ scaleKey: 'x', isTimeAxis: false, yAxisUnit: 'reqps' }),
+		).getConfig();
+
+		const values = (config.values as uPlot.Axis.DynamicValues)(
+			{} as uPlot,
+			[1200],
+			0,
+			0,
+			0,
+		);
+
+		expect(values).toStrictEqual(['1.2K req/s']);
+		expect(getToolTipValue).toHaveBeenCalledWith('1200', 'reqps', undefined);
+	});
+
+	it('leaves a non-time x axis to uPlot when nothing says how to format it', () => {
+		const config = new UPlotAxisBuilder(
+			createAxisProps({ scaleKey: 'x', isTimeAxis: false }),
+		).getConfig();
+
+		expect(config.values).toBeUndefined();
+	});
+});
+
+describe('UPlotAxisBuilder out-of-range splits', () => {
+	it('leaves a split the scale cannot place unlabelled', () => {
+		(getToolTipValue as jest.Mock).mockImplementation((v: string) => `${v} ms`);
+		const config = new UPlotAxisBuilder(
+			createAxisProps({ scaleKey: 'y', yAxisUnit: 'ms' }),
+		).getConfig();
+		const u = { scales: { y: { min: 0, max: 1000 } } } as unknown as uPlot;
+
+		const values = (config.values as uPlot.Axis.DynamicValues)(
+			u,
+			[-10, 0, 500, 5000],
+			0,
+			0,
+			0,
+		);
+
+		expect(values).toStrictEqual(['', '0 ms', '500 ms', '']);
+	});
+});

frontend/src/lib/uPlotV2/config/__tests__/UPlotConfigBuilder.test.ts

@@ -5,7 +5,12 @@ import {
 	STEP_INTERVAL_MULTIPLIER,
 } from '../../constants';
 import type { SeriesProps } from '../types';
-import { DrawStyle, SelectionPreferencesSource, StackMode } from '../types';
+import {
+	DrawStyle,
+	PlotMode,
+	SelectionPreferencesSource,
+	StackMode,
+} from '../types';
 import { UPlotConfigBuilder } from '../UPlotConfigBuilder';
 
 // Mock only the real boundary that hits localStorage
@@ -650,20 +655,15 @@ describe('UPlotConfigBuilder stacking', () => {
 
 		expect(builder.getConfig().bands).toStrictEqual([{ series: [1, 3] }]);
 	});
+});
 
-	it('registers the partial points draw hook once, only for series with partial timestamps', () => {
-		const props: SeriesProps = {
-			scaleKey: 'y',
-			label: 'Requests',
-			colorMapping: {},
-			drawStyle: DrawStyle.Line,
-		};
-		const builder = new UPlotConfigBuilder({ id: 'partial' });
-		builder.addSeries(props);
-		expect(builder.getConfig().hooks?.draw ?? []).toHaveLength(0);
+describe('UPlotConfigBuilder plot mode', () => {
+	it('leaves mode unset for aligned data and emits 2 when faceted', () => {
+		const aligned = new UPlotConfigBuilder({ id: 'aligned' });
+		expect(aligned.getConfig().mode).toBeUndefined();
 
-		builder.addSeries({ ...props, partialTimestamps: new Set([40]) });
-		builder.addSeries({ ...props, partialTimestamps: new Set([40]) });
-		expect(builder.getConfig().hooks?.draw).toHaveLength(1);
+		const faceted = new UPlotConfigBuilder({ id: 'faceted' });
+		faceted.setMode(PlotMode.Faceted);
+		expect(faceted.getConfig().mode).toBe(2);
 	});
 });

frontend/src/lib/uPlotV2/config/__tests__/UPlotSeriesBuilder.test.ts

@@ -1,7 +1,6 @@
 import { themeColors } from 'constants/theme';
 import uPlot from 'uplot';
 
-import { reportBarRect } from '../../utils/barRect';
 import { isolatedPointFilter } from '../../utils/seriesPointsFilter';
 import type { SeriesProps } from '../types';
 import { DrawStyle, FillMode, LineInterpolation, LineStyle } from '../types';
@@ -399,29 +398,40 @@ describe('UPlotSeriesBuilder', () => {
 
 		expect(builder.getConfig().fill).toBeUndefined();
 	});
+});
 
-	it('exposes partial timestamps only when there are some', () => {
-		const partialTimestamps = new Set([40]);
-
-		expect(
-			new UPlotSeriesBuilder(createBaseProps({ partialTimestamps })).getConfig(),
-		).toHaveProperty('partialTimestamps', partialTimestamps);
-		expect(
-			new UPlotSeriesBuilder(
-				createBaseProps({ partialTimestamps: new Set() }),
-			).getConfig(),
-		).not.toHaveProperty('partialTimestamps');
-	});
-
-	it('reports bar rects from bar path builders', () => {
+describe('UPlotSeriesBuilder scatter', () => {
+	it('draws through the given path builder and hides uPlot points', () => {
+		const pathBuilder = jest.fn();
 		const config = new UPlotSeriesBuilder(
-			createBaseProps({ drawStyle: DrawStyle.Bar, barMaxWidth: 321 }),
+			createBaseProps({
+				drawStyle: DrawStyle.Scatter,
+				pathBuilder,
+				facets: [{ scale: 'x' }, { scale: 'y' }],
+				lineColor: '#ff0000',
+				fillOpacity: 0.5,
+				lineWidth: 1,
+				pointSize: 8,
+			}),
 		).getConfig();
 
-		config.paths?.({} as uPlot, 1, 0, 1);
+		expect(config.paths).toBe(pathBuilder);
+		expect(config.facets).toStrictEqual([{ scale: 'x' }, { scale: 'y' }]);
+		expect(config.points?.show).toBe(false);
+		expect(config.points?.size).toBe(8);
+		expect(config.stroke).toBe('#ff0000');
+		expect(config.width).toBe(1);
+		expect(config.fill).toBe('#ff000080');
+	});
 
-		expect(uPlot.paths.bars).toHaveBeenCalledWith(
-			expect.objectContaining({ each: reportBarRect }),
-		);
+	it('draws nothing without a path builder', () => {
+		const config = new UPlotSeriesBuilder(
+			createBaseProps({ drawStyle: DrawStyle.Scatter }),
+		).getConfig();
+
+		expect(
+			(config.paths as uPlot.Series.PathBuilder)({} as uPlot, 1, 0, 0),
+		).toBeNull();
+		expect(config.facets).toBeUndefined();
 	});
 });

frontend/src/lib/uPlotV2/config/types.ts

@@ -78,8 +78,12 @@ export interface AxisProps {
 	};
 	/** Explicit tick formatter, replacing the scale's default (time / unit-formatted). */
 	values?: uPlot.Axis.Values;
-	/** Explicit axis splits, overriding the default tick calculation. */
+	/** Explicit tick positions, replacing uPlot's per-distribution default. */
 	splits?: uPlot.Axis.Splits;
+	/** Which splits get a label, replacing uPlot's per-distribution default. */
+	filter?: uPlot.Axis.Filter;
+	/** Draw the axis line along the plot edge, styled like the grid. Default true. */
+	showBorder?: boolean;
 	/** Pixels between the ticks and their labels; also feeds the y axis width calculation. */
 	gap?: number;
 	/** Explicit axis thickness. Left unset, the y axis sizes itself to its widest label. */
@@ -90,7 +94,7 @@ export interface AxisProps {
 	isDarkMode?: boolean;
 	/** Axis is on a log scale — thins the grid lines to keep dense decades readable. */
 	isLogScale?: boolean;
-	/** Unit the y axis ticks are formatted in (`spec.formatting.unit`). */
+	/** Unit the value ticks are formatted in (`spec.formatting.unit`); a non-time x axis reads it too. */
 	yAxisUnit?: string;
 	/**
 	 * X axis carries timestamps, so its ticks format as dates/times. Declared by the caller
@@ -109,6 +113,14 @@ export interface AxisProps {
 export enum DistributionType {
 	Linear = 'linear',
 	Logarithmic = 'logarithmic',
+	/** arcsinh: linear within ±`asinhThreshold`, log beyond; places zero and negatives. */
+	SymmetricLog = 'symlog',
+}
+
+/** uPlot's data layout: one shared x per chart, or per-series x/y columns. */
+export enum PlotMode {
+	Aligned = 1,
+	Faceted = 2,
 }
 
 export interface ScaleProps {
@@ -125,6 +137,8 @@ export interface ScaleProps {
 	auto?: boolean;
 	logBase?: uPlot.Scale.LogBase;
 	distribution?: DistributionType;
+	/** Half-width of a `SymmetricLog` scale's linear band around zero. Default 1. */
+	asinhThreshold?: number;
 }
 
 export enum DisconnectedValuesMode {
@@ -146,6 +160,8 @@ export enum DrawStyle {
 	Points = 'points',
 	Bar = 'bar',
 	Histogram = 'histogram',
+	/** Mode 2; drawn by the caller's `pathBuilder`. */
+	Scatter = 'scatter',
 }
 
 export enum LineInterpolation {
@@ -201,7 +217,6 @@ export enum FillMode {
 
 export type ExtendedSeries = Series & {
 	metric?: { [key: string]: string };
-	partialTimestamps?: Set<number>;
 };
 
 export interface SeriesProps extends LineConfig, PointsConfig, BarConfig {
@@ -230,8 +245,8 @@ export interface SeriesProps extends LineConfig, PointsConfig, BarConfig {
 	isDarkMode?: boolean;
 	stepInterval?: number;
 	metric?: { [key: string]: string };
-	/** Epoch-second x values whose bucket doesn't cover a full step; marked with a dotted ring. */
-	partialTimestamps?: Set<number>;
+	/** Mode 2 only: the scales the series' own x and y columns are read against. */
+	facets?: Series.Facet[];
 }
 
 export interface LegendItem {

frontend/src/lib/uPlotV2/hooks/__tests__/partialPointsDrawHook.test.ts

@@ -1,77 +0,0 @@
-import uPlot from 'uplot';
-
-import type { ExtendedSeries } from '../../config/types';
-import { reportBarRect } from '../../utils/barRect';
-import { partialPointsDrawHook } from '../partialPointsDrawHook';
-
-function createPlot(
-	series: Partial<ExtendedSeries>,
-	values: (number | null)[] = [1, 2, 3],
-): { u: uPlot; ctx: Record<string, jest.Mock> } {
-	const ctx = {
-		save: jest.fn(),
-		restore: jest.fn(),
-		beginPath: jest.fn(),
-		rect: jest.fn(),
-		clip: jest.fn(),
-		arc: jest.fn(),
-		fill: jest.fn(),
-		stroke: jest.fn(),
-		setLineDash: jest.fn(),
-		strokeRect: jest.fn(),
-	};
-	const xValues = [10, 20, 30];
-	const u = {
-		ctx,
-		bbox: { left: 0, top: 0, width: 100, height: 100 },
-		data: [xValues, values],
-		series: [{}, { show: true, stroke: 'red', points: { size: 4 }, ...series }],
-		valToIdx: (value: number): number => xValues.indexOf(value),
-		valToPos: (value: number): number => value,
-	} as unknown as uPlot;
-	return { u, ctx };
-}
-
-describe('partialPointsDrawHook', () => {
-	it('draws a dot and a dotted ring on each partial point', () => {
-		const { u, ctx } = createPlot({ partialTimestamps: new Set([30]) });
-
-		partialPointsDrawHook(u);
-
-		expect(ctx.arc).toHaveBeenCalledTimes(2);
-		expect(ctx.arc).toHaveBeenCalledWith(30, 3, 2, 0, 2 * Math.PI);
-		expect(ctx.arc).toHaveBeenCalledWith(30, 3, 5, 0, 2 * Math.PI);
-		expect(ctx.setLineDash).toHaveBeenCalledWith([2, 2]);
-		expect(ctx.restore).toHaveBeenCalled();
-	});
-
-	it('skips hidden series, null values and timestamps not in the data', () => {
-		const hidden = createPlot({ show: false, partialTimestamps: new Set([30]) });
-		const missing = createPlot({ partialTimestamps: new Set([30]) }, [
-			1,
-			2,
-			null,
-		]);
-		const unknown = createPlot({ partialTimestamps: new Set([40]) });
-
-		[hidden, missing, unknown].forEach(({ u, ctx }) => {
-			partialPointsDrawHook(u);
-			expect(ctx.arc).not.toHaveBeenCalled();
-		});
-	});
-
-	it('draws a dotted outline around a partial bar', () => {
-		const { u, ctx } = createPlot({
-			partialTimestamps: new Set([30]),
-			paths: (plot, seriesIdx, idx) => {
-				reportBarRect(plot, seriesIdx, idx, 10, 20, 8, 30);
-				return null;
-			},
-		});
-
-		partialPointsDrawHook(u);
-
-		expect(ctx.strokeRect).toHaveBeenCalledWith(7, 17, 14, 36);
-		expect(ctx.arc).not.toHaveBeenCalled();
-	});
-});

frontend/src/lib/uPlotV2/hooks/__tests__/useThresholdsDrawHook.test.ts

@@ -0,0 +1,56 @@
+import type uPlot from 'uplot';
+
+import { thresholdsDrawHook } from '../useThresholdsDrawHook';
+
+function mockPlot(ori: 0 | 1): { plot: uPlot; ctx: Record<string, jest.Mock> } {
+	const ctx = {
+		save: jest.fn(),
+		restore: jest.fn(),
+		setLineDash: jest.fn(),
+		beginPath: jest.fn(),
+		moveTo: jest.fn(),
+		lineTo: jest.fn(),
+		stroke: jest.fn(),
+		fillText: jest.fn(),
+		measureText: jest.fn(() => ({ width: 40 })),
+	};
+	const plot = {
+		ctx: { ...ctx, canvas: { height: 300 } },
+		bbox: { left: 10, top: 20, width: 400, height: 200 },
+		scales: { s: { ori } },
+		valToPos: (): number => 100,
+	} as unknown as uPlot;
+	return { plot, ctx };
+}
+
+const draw = (plot: uPlot): void =>
+	(
+		thresholdsDrawHook({
+			scaleKey: 's',
+			thresholds: [{ thresholdValue: 5, thresholdLabel: 'SLO' }],
+		}) as (u: uPlot) => void
+	)(plot);
+
+describe('thresholdsDrawHook', () => {
+	it('draws a horizontal line across a vertical scale', () => {
+		const { plot, ctx } = mockPlot(1);
+		draw(plot);
+
+		expect(ctx.moveTo).toHaveBeenCalledWith(10, 100);
+		expect(ctx.lineTo).toHaveBeenCalledWith(410, 100);
+		expect(ctx.fillText).toHaveBeenCalledWith('SLO', 350, 85);
+	});
+
+	it('draws a vertical line across a horizontal scale', () => {
+		const { plot, ctx } = mockPlot(0);
+		draw(plot);
+
+		expect(ctx.moveTo).toHaveBeenCalledWith(100, 20);
+		expect(ctx.lineTo).toHaveBeenCalledWith(100, 220);
+		expect(ctx.fillText).toHaveBeenCalledWith(
+			'SLO',
+			expect.any(Number),
+			expect.any(Number),
+		);
+	});
+});

frontend/src/lib/uPlotV2/hooks/partialPointsDrawHook.ts

@@ -1,89 +0,0 @@
-import uPlot from 'uplot';
-
-import { ExtendedSeries } from '../config/types';
-import { BarRect, measureBar } from '../utils/barRect';
-
-const DEFAULT_POINT_SIZE = 5;
-const RING_GAP = 3;
-const RING_WIDTH = 1.5;
-const RING_DASH = [2, 2];
-
-function drawRing(
-	u: uPlot,
-	series: ExtendedSeries,
-	idx: number,
-	value: number,
-): void {
-	const { ctx } = u;
-	const { pxRatio } = uPlot;
-	const cx = u.valToPos(u.data[0][idx], 'x', true);
-	const cy = u.valToPos(value, series.scale ?? 'y', true);
-	const radius = ((series.points?.size ?? DEFAULT_POINT_SIZE) / 2) * pxRatio;
-
-	ctx.beginPath();
-	ctx.arc(cx, cy, radius, 0, 2 * Math.PI);
-	ctx.fill();
-
-	ctx.lineWidth = RING_WIDTH * pxRatio;
-	ctx.setLineDash(RING_DASH.map((segment) => segment * pxRatio));
-	ctx.beginPath();
-	ctx.arc(cx, cy, radius + RING_GAP * pxRatio, 0, 2 * Math.PI);
-	ctx.stroke();
-}
-
-function drawBarOutline(u: uPlot, rect: BarRect): void {
-	const gap = RING_GAP * uPlot.pxRatio;
-	u.ctx.lineWidth = RING_WIDTH * uPlot.pxRatio;
-	u.ctx.setLineDash(RING_DASH.map((segment) => segment * uPlot.pxRatio));
-	u.ctx.strokeRect(
-		rect.left - gap,
-		rect.top - gap,
-		rect.width + 2 * gap,
-		rect.height + 2 * gap,
-	);
-}
-
-/**
- * Marks each series' partial buckets: a dotted outline around bars, a dot and dotted
- * ring on line and point series.
- */
-export function partialPointsDrawHook(u: uPlot): void {
-	const { ctx, bbox } = u;
-	const xValues = u.data[0];
-
-	ctx.save();
-	ctx.beginPath();
-	ctx.rect(bbox.left, bbox.top, bbox.width, bbox.height);
-	ctx.clip();
-
-	for (let seriesIdx = 1; seriesIdx < u.series.length; seriesIdx += 1) {
-		const series = u.series[seriesIdx] as ExtendedSeries;
-		if (!series.show || !series.partialTimestamps) {
-			continue;
-		}
-		const color =
-			typeof series.stroke === 'function'
-				? series.stroke(u, seriesIdx)
-				: (series.stroke ?? '');
-		ctx.fillStyle = color;
-		ctx.strokeStyle = color;
-		ctx.globalAlpha = series.alpha ?? 1;
-
-		series.partialTimestamps.forEach((timestamp) => {
-			const idx = u.valToIdx(timestamp);
-			const value = u.data[seriesIdx][idx];
-			if (xValues[idx] !== timestamp || value == null) {
-				return;
-			}
-			ctx.setLineDash([]);
-			const bar = measureBar(u, seriesIdx, idx);
-			if (bar) {
-				drawBarOutline(u, bar);
-			} else {
-				drawRing(u, series, idx, value);
-			}
-		});
-	}
-
-	ctx.restore();
-}

frontend/src/lib/uPlotV2/hooks/useThresholdsDrawHook.ts

@@ -29,13 +29,42 @@ export function thresholdsDrawHook(
 
 			const scaleVal = u.valToPos(Number(yValue), scaleKey, true);
 
+			ctx.strokeStyle = color;
+
+			// A horizontal scale (e.g. a scatter plot's x) takes a vertical line.
+			if (u.scales[scaleKey]?.ori === 0) {
+				const x = Math.round(scaleVal);
+				const top = Math.round(u.bbox.top);
+
+				ctx.beginPath();
+				ctx.moveTo(x, top);
+				ctx.lineTo(x, Math.round(u.bbox.top + u.bbox.height));
+				ctx.stroke();
+
+				if (threshold.thresholdLabel) {
+					const gap = 6 * uPlot.pxRatio;
+					const textWidth = ctx.measureText(threshold.thresholdLabel).width;
+					const fitsRight = x + gap + textWidth <= u.bbox.left + u.bbox.width;
+					// uPlot leaves the last axis's text alignment on the context.
+					ctx.save();
+					ctx.fillStyle = color;
+					ctx.textAlign = 'left';
+					ctx.textBaseline = 'top';
+					ctx.fillText(
+						threshold.thresholdLabel,
+						fitsRight ? x + gap : x - gap - textWidth,
+						top + gap,
+					);
+					ctx.restore();
+				}
+				continue;
+			}
+
 			const x0 = Math.round(u.bbox.left);
 			const y0 = Math.round(scaleVal);
 			const x1 = Math.round(u.bbox.left + u.bbox.width);
 			const y1 = Math.round(scaleVal);
 
-			ctx.strokeStyle = color;
-
 			ctx.beginPath();
 			ctx.moveTo(x0, y0);
 			ctx.lineTo(x1, y1);

frontend/src/lib/uPlotV2/plugins/ScatterPlugin/__tests__/geometry.test.ts

@@ -0,0 +1,114 @@
+import type uPlot from 'uplot';
+
+import { Quadtree } from '../../../utils/quadtree';
+import {
+	resolveHit,
+	resolvePointDiameter,
+	resolveSizeDomain,
+} from '../geometry';
+import { ScatterHit, ScatterPointSize } from '../types';
+
+const POINT_SIZE: ScatterPointSize = { fixed: 6, min: 4, max: 20 };
+
+const asData = (columns: unknown[]): uPlot.AlignedData =>
+	columns as unknown as uPlot.AlignedData;
+
+describe('resolveSizeDomain', () => {
+	it('spans the size columns of every series, skipping nulls', () => {
+		const data = asData([
+			null,
+			[
+				[1, 2],
+				[1, 2],
+				[10, null],
+			],
+			[[3], [3], [40]],
+		]);
+
+		expect(resolveSizeDomain(data)).toStrictEqual({ min: 10, max: 40 });
+	});
+
+	it('is null when no series carries sizes', () => {
+		expect(resolveSizeDomain(asData([null, [[1], [1]]]))).toBeNull();
+		expect(resolveSizeDomain(asData([null, [[1], [1], [null]]]))).toBeNull();
+	});
+});
+
+describe('resolvePointDiameter', () => {
+	it('uses the fixed diameter without a size or a domain', () => {
+		expect(resolvePointDiameter(null, { min: 0, max: 10 }, POINT_SIZE)).toBe(6);
+		expect(resolvePointDiameter(5, null, POINT_SIZE)).toBe(6);
+	});
+
+	it('maps the domain ends to min and max', () => {
+		const domain = { min: 0, max: 100 };
+		expect(resolvePointDiameter(0, domain, POINT_SIZE)).toBe(4);
+		expect(resolvePointDiameter(100, domain, POINT_SIZE)).toBe(20);
+	});
+
+	it('scales by area, not diameter', () => {
+		const midArea = (4 ** 2 + 20 ** 2) / 2;
+		expect(
+			resolvePointDiameter(50, { min: 0, max: 100 }, POINT_SIZE),
+		).toBeCloseTo(Math.sqrt(midArea));
+	});
+
+	it('clamps values outside the domain', () => {
+		const domain = { min: 10, max: 20 };
+		expect(resolvePointDiameter(-5, domain, POINT_SIZE)).toBe(4);
+		expect(resolvePointDiameter(500, domain, POINT_SIZE)).toBe(20);
+	});
+
+	it('uses the midpoint when every size is the same', () => {
+		expect(resolvePointDiameter(7, { min: 7, max: 7 }, POINT_SIZE)).toBe(12);
+	});
+});
+
+describe('resolveHit', () => {
+	const hit = (
+		seriesIndex: number,
+		dataIndex: number,
+		x: number,
+		y: number,
+		d: number,
+	): ScatterHit => ({ seriesIndex, dataIndex, x, y, w: d, h: d });
+
+	it('returns the disc under the cursor', () => {
+		const tree = new Quadtree<ScatterHit>(0, 0, 100, 100);
+		tree.add(hit(1, 0, 10, 10, 6));
+		tree.add(hit(2, 3, 50, 50, 6));
+
+		expect(resolveHit(tree, 13, 13, 0)).toMatchObject({
+			seriesIndex: 1,
+			dataIndex: 0,
+		});
+		expect(resolveHit(tree, 52, 52, 0)).toMatchObject({
+			seriesIndex: 2,
+			dataIndex: 3,
+		});
+	});
+
+	it('is null when the cursor is off every disc', () => {
+		const tree = new Quadtree<ScatterHit>(0, 0, 100, 100);
+		tree.add(hit(1, 0, 10, 10, 6));
+
+		expect(resolveHit(tree, 30, 30, 0)).toBeNull();
+	});
+
+	it('tolerance widens each disc', () => {
+		const tree = new Quadtree<ScatterHit>(0, 0, 100, 100);
+		tree.add(hit(1, 0, 10, 10, 6));
+
+		expect(resolveHit(tree, 18, 13, 0)).toBeNull();
+		expect(resolveHit(tree, 18, 13, 3)).not.toBeNull();
+	});
+
+	it('prefers the disc whose centre is nearest when they overlap', () => {
+		const tree = new Quadtree<ScatterHit>(0, 0, 100, 100);
+		tree.add(hit(1, 0, 10, 10, 10));
+		tree.add(hit(1, 1, 14, 10, 10));
+
+		expect(resolveHit(tree, 13, 15, 0)?.dataIndex).toBe(0);
+		expect(resolveHit(tree, 21, 15, 0)?.dataIndex).toBe(1);
+	});
+});

frontend/src/lib/uPlotV2/plugins/ScatterPlugin/__tests__/scatterPlugin.test.ts

@@ -0,0 +1,286 @@
+import uPlot from 'uplot';
+
+import { UPlotConfigBuilder } from '../../../config/UPlotConfigBuilder';
+import {
+	applyScatterPlugin,
+	createScatterPlugin,
+	SCATTER_FACETS,
+} from '../scatterPlugin';
+
+jest.mock('lib/visualization/panels/utils/legendVisibilityUtils', () => ({
+	getStoredSeriesVisibility: jest.fn(),
+}));
+
+/** jsdom has no Path2D; the builder only needs something that takes the calls. */
+class FakePath2D {
+	moveTo = jest.fn();
+	arc = jest.fn();
+}
+
+type OrientCallback = Parameters<typeof uPlot.orient>[2];
+
+interface FakePlotArgs {
+	series: Array<{ xs: number[]; ys: number[]; sizes?: Array<number | null> }>;
+	cursor?: { left: number; top: number };
+	scaleX?: { min: number; max: number };
+	scaleY?: { min: number; max: number };
+}
+
+/**
+ * A 100×100 plot at the canvas origin with identity scales: value 10 draws at
+ * pixel 10 on x, and at 100 − 10 on y (uPlot's y grows downward).
+ */
+function createFakePlot({
+	series,
+	cursor = { left: -1, top: -1 },
+	scaleX = { min: 0, max: 100 },
+	scaleY = { min: 0, max: 100 },
+}: FakePlotArgs): uPlot {
+	const data = [
+		null,
+		...series.map((entry) =>
+			entry.sizes ? [entry.xs, entry.ys, entry.sizes] : [entry.xs, entry.ys],
+		),
+	];
+	return {
+		data,
+		series: [{}, ...series.map((_, index) => ({ label: `s${index + 1}` }))],
+		bbox: { left: 0, top: 0, width: 100, height: 100 },
+		cursor,
+		scales: { x: scaleX, y: scaleY },
+	} as unknown as uPlot;
+}
+
+/** Stands in for `uPlot.orient`: identity x, flipped y, an `arc` that records. */
+function orientWithIdentityScales(
+	u: uPlot,
+	seriesIdx: number,
+	cb: OrientCallback,
+): void {
+	const columns = (u.data as unknown as Array<number[][] | null>)[seriesIdx];
+	if (!columns) {
+		return;
+	}
+	const scaleX = (u.scales as unknown as Record<string, uPlot.Scale>).x;
+	const scaleY = (u.scales as unknown as Record<string, uPlot.Scale>).y;
+	const valToPosX = (value: number): number => value;
+	const valToPosY = (value: number): number => 100 - value;
+	// Real uPlot's `arc` helper forwards to the path; the test counts those calls.
+	const arc = (path: FakePath2D, ...args: number[]): void => {
+		path.arc(...args);
+	};
+	cb(
+		u.series[seriesIdx],
+		columns[0],
+		columns[1],
+		scaleX,
+		scaleY,
+		valToPosX as unknown as uPlot.ValToPos,
+		valToPosY as unknown as uPlot.ValToPos,
+		0,
+		0,
+		100,
+		100,
+		jest.fn() as never,
+		jest.fn() as never,
+		jest.fn() as never,
+		arc as never,
+		jest.fn() as never,
+	);
+}
+
+describe('createScatterPlugin', () => {
+	beforeAll(() => {
+		(globalThis as { Path2D?: unknown }).Path2D = FakePath2D;
+	});
+
+	beforeEach(() => {
+		(uPlot.orient as jest.Mock).mockImplementation(orientWithIdentityScales);
+	});
+
+	afterEach(() => {
+		(uPlot.orient as jest.Mock).mockReset();
+	});
+
+	function drawAll(
+		u: uPlot,
+		plugin: ReturnType<typeof createScatterPlugin>,
+	): void {
+		plugin.hooks.drawClear(u);
+		for (let seriesIdx = 1; seriesIdx < u.series.length; seriesIdx++) {
+			const columns = (u.data as unknown as number[][][])[seriesIdx];
+			plugin.pathBuilder(u, seriesIdx, 0, columns[0].length - 1);
+		}
+	}
+
+	/** Runs the cursor scan the way uPlot does: every data series, in order. */
+	function scan(
+		u: uPlot,
+		plugin: ReturnType<typeof createScatterPlugin>,
+	): Array<number | null> {
+		const dataIdx = plugin.cursor.dataIdx as NonNullable<uPlot.Cursor['dataIdx']>;
+		const indexes: Array<number | null> = [null];
+		for (let seriesIdx = 1; seriesIdx < u.series.length; seriesIdx++) {
+			indexes.push(dataIdx(u, seriesIdx, 0, 0));
+		}
+		return indexes;
+	}
+
+	it('returns one path that strokes and fills the same discs', () => {
+		const plugin = createScatterPlugin();
+		const u = createFakePlot({ series: [{ xs: [10, 20], ys: [10, 20] }] });
+		plugin.hooks.drawClear(u);
+
+		const paths = plugin.pathBuilder(u, 1, 0, 1) as uPlot.Series.Paths;
+
+		expect(paths.stroke).toBeInstanceOf(FakePath2D);
+		expect(paths.fill).toBe(paths.stroke);
+		expect((paths.fill as unknown as FakePath2D).arc).toHaveBeenCalledTimes(2);
+	});
+
+	it('resolves the hovered point to its own series and index', () => {
+		const plugin = createScatterPlugin({
+			pointSize: { fixed: 6, min: 4, max: 20 },
+		});
+		const u = createFakePlot({
+			series: [
+				{ xs: [10, 50], ys: [10, 50] },
+				{ xs: [80], ys: [80] },
+			],
+			// Over the second series' only point: x 80, y drawn at 100 − 80.
+			cursor: { left: 80, top: 20 },
+		});
+		drawAll(u, plugin);
+
+		expect(scan(u, plugin)).toStrictEqual([null, null, 0]);
+		expect(plugin.getHit()).toMatchObject({ seriesIndex: 2, dataIndex: 0 });
+	});
+
+	it('returns null for every series when the cursor is off the plot or off any disc', () => {
+		const plugin = createScatterPlugin();
+		const u = createFakePlot({
+			series: [{ xs: [10], ys: [10] }],
+			cursor: { left: -1, top: -1 },
+		});
+		drawAll(u, plugin);
+
+		expect(scan(u, plugin)).toStrictEqual([null, null]);
+
+		(u.cursor as { left: number; top: number }).left = 50;
+		(u.cursor as { left: number; top: number }).top = 50;
+		expect(scan(u, plugin)).toStrictEqual([null, null]);
+	});
+
+	it('skips points outside the visible scale range', () => {
+		const plugin = createScatterPlugin();
+		const u = createFakePlot({
+			series: [{ xs: [10, 500], ys: [10, 10] }],
+			cursor: { left: 10, top: 90 },
+		});
+		drawAll(u, plugin);
+
+		const paths = plugin.pathBuilder(u, 1, 0, 1) as uPlot.Series.Paths;
+		expect((paths.fill as unknown as FakePath2D).arc).toHaveBeenCalledTimes(1);
+		expect(scan(u, plugin)).toStrictEqual([null, 0]);
+	});
+
+	it('rings the hit disc, in CSS pixels, with a gap around it', () => {
+		const plugin = createScatterPlugin({
+			pointSize: { fixed: 8, min: 4, max: 20 },
+		});
+		const u = createFakePlot({
+			series: [{ xs: [10], ys: [10] }],
+			cursor: { left: 10, top: 90 },
+		});
+		drawAll(u, plugin);
+		scan(u, plugin);
+
+		const bbox = plugin.cursor.points?.bbox;
+		// The 8px disc spans 6..14; the ring sits 3px out and is 2px wide.
+		expect(bbox?.(u, 1)).toStrictEqual({
+			left: 1,
+			top: 81,
+			width: 18,
+			height: 18,
+		});
+		expect(bbox?.(u, 2)).toMatchObject({ width: 0, height: 0 });
+	});
+
+	it('snaps the ring to whole pixels without moving its centre', () => {
+		const plugin = createScatterPlugin({
+			pointSize: { fixed: 7, min: 4, max: 20 },
+		});
+		const u = createFakePlot({
+			series: [{ xs: [10], ys: [10] }],
+			cursor: { left: 10, top: 90 },
+		});
+		drawAll(u, plugin);
+		scan(u, plugin);
+
+		// The 7px disc starts at 6.5, so the ring's edge would land on 1.5.
+		const ring = plugin.cursor.points?.bbox?.(u, 1);
+		expect(ring).toMatchObject({ left: 1, width: 18 });
+		expect((ring?.left ?? 0) + (ring?.width ?? 0) / 2).toBe(10);
+	});
+
+	it('draws the hover marker as an outline in the series colour', () => {
+		const plugin = createScatterPlugin();
+		const u = {
+			series: [{}, { stroke: (): string => '#E5484D' }, { stroke: '#30A46C' }],
+		} as unknown as uPlot;
+		const points = plugin.cursor.points as {
+			fill: (u: uPlot, seriesIdx: number) => string;
+			stroke: (u: uPlot, seriesIdx: number) => string;
+			width: (u: uPlot, seriesIdx: number, size: number) => number;
+		};
+
+		expect(points.fill(u, 1)).toBe('transparent');
+		expect(points.stroke(u, 1)).toBe('#E5484D');
+		expect(points.stroke(u, 2)).toBe('#30A46C');
+		expect(points.width(u, 1, 0)).toBe(2);
+	});
+
+	it('drawClear drops cached paths on data series only', () => {
+		const plugin = createScatterPlugin();
+		const u = createFakePlot({ series: [{ xs: [1], ys: [1] }] });
+		const [xSeries, dataSeries] = u.series as Array<{ _paths?: unknown }>;
+		xSeries._paths = 'x';
+		dataSeries._paths = 'cached';
+
+		plugin.hooks.drawClear(u);
+
+		expect(xSeries._paths).toBe('x');
+		expect(dataSeries._paths).toBeNull();
+	});
+
+	it('focus distance is zero, so the hit series wins focus', () => {
+		const plugin = createScatterPlugin();
+		expect(plugin.cursor.focus?.dist?.({} as uPlot, 1, 0, 0, 0)).toBe(0);
+	});
+});
+
+describe('applyScatterPlugin', () => {
+	it('switches the builder to faceted mode and disables drag selection', () => {
+		const builder = new UPlotConfigBuilder({ id: 'scatter' });
+		const plugin = createScatterPlugin();
+
+		applyScatterPlugin(builder, plugin);
+		const config = builder.getConfig();
+
+		expect(config.mode).toBe(2);
+		expect(config.cursor?.drag).toMatchObject({
+			x: false,
+			y: false,
+			setScale: false,
+		});
+		expect(config.hooks?.drawClear).toHaveLength(1);
+		expect(config.hooks?.destroy).toHaveLength(1);
+	});
+
+	it('facets read x and y against the shared scales', () => {
+		expect(SCATTER_FACETS).toStrictEqual([
+			{ scale: 'x', auto: true },
+			{ scale: 'y', auto: true },
+		]);
+	});
+});

frontend/src/lib/uPlotV2/plugins/ScatterPlugin/geometry.ts

@@ -0,0 +1,86 @@
+import type uPlot from 'uplot';
+
+import type { Quadtree } from '../../utils/quadtree';
+import type { ScatterHit, ScatterPointSize, ScatterSeriesData } from './types';
+
+export interface SizeDomain {
+	min: number;
+	max: number;
+}
+
+/** Size extent across all series, so equal values draw equal discs. */
+export function resolveSizeDomain(data: uPlot.AlignedData): SizeDomain | null {
+	let min = Infinity;
+	let max = -Infinity;
+	for (let seriesIndex = 1; seriesIndex < data.length; seriesIndex++) {
+		const sizes = (data[seriesIndex] as unknown as ScatterSeriesData)[2];
+		if (!sizes) {
+			continue;
+		}
+		for (const size of sizes) {
+			if (size == null || !Number.isFinite(size)) {
+				continue;
+			}
+			min = Math.min(min, size);
+			max = Math.max(max, size);
+		}
+	}
+	return min <= max ? { min, max } : null;
+}
+
+/** Area, not diameter, scales with the value. */
+export function resolvePointDiameter(
+	size: number | null | undefined,
+	domain: SizeDomain | null,
+	pointSize: ScatterPointSize,
+): number {
+	if (size == null || domain == null || !Number.isFinite(size)) {
+		return pointSize.fixed;
+	}
+	if (domain.max === domain.min) {
+		return (pointSize.min + pointSize.max) / 2;
+	}
+	const t = Math.min(
+		1,
+		Math.max(0, (size - domain.min) / (domain.max - domain.min)),
+	);
+	const minArea = pointSize.min ** 2;
+	const maxArea = pointSize.max ** 2;
+	return Math.sqrt(minArea + (maxArea - minArea) * t);
+}
+
+/** Disc whose centre is closest, within `tolerance` px; `null` if none. */
+export function resolveHit(
+	tree: Quadtree<ScatterHit>,
+	cx: number,
+	cy: number,
+	tolerance: number,
+): ScatterHit | null {
+	let best: ScatterHit | null = null;
+	let bestDistance = Infinity;
+
+	tree.get(
+		cx - tolerance,
+		cy - tolerance,
+		tolerance * 2,
+		tolerance * 2,
+		(hit) => {
+			const left = hit.x - tolerance;
+			const top = hit.y - tolerance;
+			const right = hit.x + hit.w + tolerance;
+			const bottom = hit.y + hit.h + tolerance;
+			if (cx < left || cx > right || cy < top || cy > bottom) {
+				return;
+			}
+			const dx = cx - (hit.x + hit.w / 2);
+			const dy = cy - (hit.y + hit.h / 2);
+			const distance = dx * dx + dy * dy;
+			if (distance < bestDistance) {
+				best = hit;
+				bestDistance = distance;
+			}
+		},
+	);
+
+	return best;
+}

frontend/src/lib/uPlotV2/plugins/ScatterPlugin/scatterPlugin.ts

@@ -0,0 +1,225 @@
+import uPlot, { Series } from 'uplot';
+
+import { DEFAULT_FOCUS_PROXIMITY_VALUE } from '../../constants';
+import { PlotMode } from '../../config/types';
+import type { UPlotConfigBuilder } from '../../config/UPlotConfigBuilder';
+import { Quadtree } from '../../utils/quadtree';
+import {
+	resolveHit,
+	resolvePointDiameter,
+	resolveSizeDomain,
+	SizeDomain,
+} from './geometry';
+import {
+	DEFAULT_HOVER_TOLERANCE_PX,
+	DEFAULT_SCATTER_POINT_SIZE,
+	ScatterHit,
+	ScatterPluginOptions,
+	ScatterSeriesData,
+} from './types';
+
+export const SCATTER_FACETS: Series.Facet[] = [
+	{ scale: 'x', auto: true },
+	{ scale: 'y', auto: true },
+];
+
+const HIDDEN_BBOX: uPlot.BBox = { left: -10, top: -10, width: 0, height: 0 };
+
+const TWO_PI = 2 * Math.PI;
+
+/** CSS pixels between a hovered disc and the outline ring drawn around it. */
+const HOVER_RING_GAP_PX = 3;
+const HOVER_RING_WIDTH_PX = 2;
+
+/** uPlot ceils a cursor point's left/top but not its size; snap so the ring stays centred. */
+function snapToPixel(start: number, length: number): [number, number] {
+	const snapped = Math.floor(start);
+	return [snapped, length + (start - snapped) * 2];
+}
+
+export function getSeriesStroke(u: uPlot, seriesIdx: number): string {
+	const { stroke } = u.series[seriesIdx];
+	const color = typeof stroke === 'function' ? stroke(u, seriesIdx) : stroke;
+	return typeof color === 'string' ? color : '';
+}
+
+/** uPlot caches built paths on the series; the field is internal to it. */
+type SeriesWithPaths = Series & { _paths?: Series.Paths | null };
+
+export interface ScatterPlugin {
+	pathBuilder: Series.PathBuilder;
+	/** Hover by disc rather than by nearest x: mode 2 has no shared x to scan. */
+	cursor: uPlot.Cursor;
+	hooks: {
+		drawClear: (u: uPlot) => void;
+		destroy: (u: uPlot) => void;
+	};
+	getHit: () => ScatterHit | null;
+}
+
+export function createScatterPlugin({
+	pointSize = DEFAULT_SCATTER_POINT_SIZE,
+	hoverTolerance = DEFAULT_HOVER_TOLERANCE_PX,
+}: ScatterPluginOptions = {}): ScatterPlugin {
+	let tree: Quadtree<ScatterHit> | null = null;
+	let hit: ScatterHit | null = null;
+
+	// Spans every series; cached per dataset.
+	let cachedData: uPlot.AlignedData | null = null;
+	let cachedDomain: SizeDomain | null = null;
+
+	function getSizeDomain(u: uPlot): SizeDomain | null {
+		if (cachedData !== u.data) {
+			cachedDomain = resolveSizeDomain(u.data);
+			cachedData = u.data;
+		}
+		return cachedDomain;
+	}
+
+	const pathBuilder: Series.PathBuilder = (u, seriesIdx, idx0, idx1) => {
+		const path = new Path2D();
+		const sizes = (u.data[seriesIdx] as unknown as ScatterSeriesData)[2];
+		const domain = getSizeDomain(u);
+		const { pxRatio } = uPlot;
+
+		uPlot.orient(
+			u,
+			seriesIdx,
+			(
+				_series,
+				dataX,
+				dataY,
+				scaleX,
+				scaleY,
+				valToPosX,
+				valToPosY,
+				xOff,
+				yOff,
+				xDim,
+				yDim,
+				_moveTo,
+				_lineTo,
+				_rect,
+				arc,
+			) => {
+				const xMin = scaleX.min ?? -Infinity;
+				const xMax = scaleX.max ?? Infinity;
+				const yMin = scaleY.min ?? -Infinity;
+				const yMax = scaleY.max ?? Infinity;
+
+				for (let i = idx0; i <= idx1; i++) {
+					const x = dataX[i];
+					const y = dataY[i];
+					if (
+						x == null ||
+						y == null ||
+						x < xMin ||
+						x > xMax ||
+						y < yMin ||
+						y > yMax
+					) {
+						continue;
+					}
+
+					const diameter =
+						resolvePointDiameter(sizes?.[i], domain, pointSize) * pxRatio;
+					const radius = diameter / 2;
+					const cx = valToPosX(x, scaleX, xDim, xOff);
+					const cy = valToPosY(y, scaleY, yDim, yOff);
+
+					path.moveTo(cx + radius, cy);
+					arc(path, cx, cy, radius, 0, TWO_PI);
+
+					tree?.add({
+						x: cx - radius - u.bbox.left,
+						y: cy - radius - u.bbox.top,
+						w: diameter,
+						h: diameter,
+						seriesIndex: seriesIdx,
+						dataIndex: i,
+					});
+				}
+			},
+		);
+
+		return { stroke: path, fill: path, clip: null };
+	};
+
+	const cursor: uPlot.Cursor = {
+		// Selection would set the dashboard time range; neither axis is time here.
+		drag: { x: false, y: false, setScale: false },
+		dataIdx: (u, seriesIdx): number | null => {
+			// uPlot asks series 1..n in order on every cursor move; resolve once.
+			if (seriesIdx === 1) {
+				const { left = -1, top = -1 } = u.cursor;
+				const { pxRatio } = uPlot;
+				hit =
+					tree && left >= 0 && top >= 0
+						? resolveHit(
+								tree,
+								left * pxRatio,
+								top * pxRatio,
+								hoverTolerance * pxRatio,
+							)
+						: null;
+			}
+			return hit?.seriesIndex === seriesIdx ? hit.dataIndex : null;
+		},
+		points: {
+			bbox: (_u, seriesIdx): uPlot.BBox => {
+				if (hit?.seriesIndex !== seriesIdx) {
+					return HIDDEN_BBOX;
+				}
+				const { pxRatio } = uPlot;
+				const inset = HOVER_RING_GAP_PX + HOVER_RING_WIDTH_PX;
+				const [left, width] = snapToPixel(
+					hit.x / pxRatio - inset,
+					hit.w / pxRatio + inset * 2,
+				);
+				const [top, height] = snapToPixel(
+					hit.y / pxRatio - inset,
+					hit.h / pxRatio + inset * 2,
+				);
+				return { left, top, width, height };
+			},
+			fill: (): string => 'transparent',
+			stroke: getSeriesStroke,
+			width: (): number => HOVER_RING_WIDTH_PX,
+		},
+		// uPlot only measures series that returned a data index, i.e. the hit one.
+		focus: { prox: DEFAULT_FOCUS_PROXIMITY_VALUE, dist: (): number => 0 },
+	};
+
+	return {
+		pathBuilder,
+		cursor,
+		hooks: {
+			drawClear: (u: uPlot): void => {
+				tree = new Quadtree<ScatterHit>(0, 0, u.bbox.width, u.bbox.height);
+				// The tree holds only what the path builder drew, so force a rebuild.
+				u.series.forEach((series, index) => {
+					if (index > 0) {
+						(series as SeriesWithPaths)._paths = null;
+					}
+				});
+			},
+			destroy: (): void => {
+				tree = null;
+				hit = null;
+				cachedData = null;
+				cachedDomain = null;
+			},
+		},
+		getHit: (): ScatterHit | null => hit,
+	};
+}
+
+export function applyScatterPlugin(
+	builder: UPlotConfigBuilder,
+	plugin: ScatterPlugin,
+): void {
+	builder.setMode(PlotMode.Faceted);
+	builder.setCursor(plugin.cursor);
+	builder.addHook('drawClear', plugin.hooks.drawClear);
+	builder.addHook('destroy', plugin.hooks.destroy);
+}

frontend/src/lib/uPlotV2/plugins/ScatterPlugin/types.ts

@@ -0,0 +1,54 @@
+import type { QuadtreeRect } from '../../utils/quadtree';
+
+/** Diameters in CSS pixels. `min`/`max` bound the area scale when a size column is mapped. */
+export interface ScatterPointSize {
+	fixed: number;
+	min: number;
+	max: number;
+}
+
+export const DEFAULT_SCATTER_POINT_SIZE: ScatterPointSize = {
+	fixed: 6,
+	min: 4,
+	max: 24,
+};
+
+/** CSS pixels around a point's disc that still register as a hover. */
+export const DEFAULT_HOVER_TOLERANCE_PX = 3;
+
+export interface ScatterPluginOptions {
+	pointSize?: ScatterPointSize;
+	hoverTolerance?: number;
+}
+
+/** Parallel columns; a `null` size draws at `fixed`. */
+export type ScatterSeriesData = [
+	xs: number[],
+	ys: number[],
+	sizes?: Array<number | null>,
+];
+
+/** Mode-2 data: series 0 is uPlot's x placeholder and carries nothing. */
+export type ScatterChartData = [null, ...ScatterSeriesData[]];
+
+/** A drawn point's disc, in canvas pixels relative to the plot area. */
+export interface ScatterHit extends QuadtreeRect {
+	seriesIndex: number;
+	dataIndex: number;
+}
+
+export interface ScatterChannel {
+	label: string;
+	unit?: string;
+}
+
+export interface ScatterChannels {
+	x: ScatterChannel;
+	y: ScatterChannel;
+	size?: ScatterChannel;
+}
+
+export interface ScatterPointLabel {
+	key: string;
+	value: string;
+}

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

@@ -0,0 +1,52 @@
+import type uPlot from 'uplot';
+
+import { buildClickData } from '../utils';
+
+jest.mock('lib/uPlotLib/plugins/onClickPlugin', () => ({
+	getFocusedSeriesAtPosition: jest.fn(() => ({ seriesIndex: 1 })),
+}));
+
+const event = {
+	offsetX: 10,
+	offsetY: 20,
+	clientX: 110,
+	clientY: 220,
+} as MouseEvent;
+
+describe('buildClickData', () => {
+	it('skips the x-index lookups on a faceted plot, which has no shared x series', () => {
+		const posToIdx = jest.fn(() => {
+			throw new Error('faceted data[0] is null');
+		});
+		const plot = {
+			data: [null],
+			posToVal: (pos: number): number => pos * 2,
+			posToIdx,
+		} as unknown as uPlot;
+
+		expect(buildClickData(event, plot)).toStrictEqual({
+			xValue: 20,
+			yValue: 40,
+			focusedSeries: null,
+			clickedDataTimestamp: 20,
+			mouseX: 10,
+			mouseY: 20,
+			absoluteMouseX: 110,
+			absoluteMouseY: 220,
+		});
+		expect(posToIdx).not.toHaveBeenCalled();
+	});
+
+	it('resolves the focused series and clicked timestamp on an aligned plot', () => {
+		const plot = {
+			data: [[100, 200, 300]],
+			posToVal: (pos: number): number => pos,
+			posToIdx: (): number => 1,
+		} as unknown as uPlot;
+
+		expect(buildClickData(event, plot)).toMatchObject({
+			focusedSeries: { seriesIndex: 1 },
+			clickedDataTimestamp: 200,
+		});
+	});
+});

frontend/src/lib/uPlotV2/plugins/TooltipPlugin/utils.ts

@@ -174,6 +174,24 @@ export function createLayoutObserver(
 export function buildClickData(event: MouseEvent, plot: uPlot): ChartClickData {
 	const xValue = plot.posToVal(event.offsetX, 'x');
 	const yValue = plot.posToVal(event.offsetY, 'y');
+	const pointer = {
+		mouseX: event.offsetX,
+		mouseY: event.offsetY,
+		absoluteMouseX: event.clientX,
+		absoluteMouseY: event.clientY,
+	};
+
+	// Faceted (scatter): no shared x, so `posToIdx` would throw.
+	if (plot.data[0] == null) {
+		return {
+			xValue,
+			yValue,
+			focusedSeries: null,
+			clickedDataTimestamp: xValue,
+			...pointer,
+		};
+	}
+
 	const focusedSeries = getFocusedSeriesAtPosition(event, plot);
 
 	const dataIndex = plot.posToIdx(event.offsetX);
@@ -193,9 +211,6 @@ export function buildClickData(event: MouseEvent, plot: uPlot): ChartClickData {
 		yValue,
 		focusedSeries,
 		clickedDataTimestamp,
-		mouseX: event.offsetX,
-		mouseY: event.offsetY,
-		absoluteMouseX: event.clientX,
-		absoluteMouseY: event.clientY,
+		...pointer,
 	};
 }

frontend/src/lib/uPlotV2/utils/__tests__/barRect.test.ts

@@ -1,30 +0,0 @@
-import type uPlot from 'uplot';
-
-import { measureBar, reportBarRect } from '../barRect';
-
-function plotWithPaths(paths?: uPlot.Series['paths']): uPlot {
-	return { series: [{}, { paths }] } as unknown as uPlot;
-}
-
-describe('measureBar', () => {
-	it('returns the rect the bar paths report for that index', () => {
-		const paths = jest.fn((u: uPlot, seriesIdx: number, idx: number) => {
-			reportBarRect(u, seriesIdx, idx, 10, 20, 8, 30);
-			return null;
-		});
-		const u = plotWithPaths(paths);
-
-		expect(measureBar(u, 1, 4)).toStrictEqual({
-			left: 10,
-			top: 20,
-			width: 8,
-			height: 30,
-		});
-		expect(paths).toHaveBeenCalledWith(u, 1, 4, 4);
-	});
-
-	it('returns null for series whose paths report no bar', () => {
-		expect(measureBar(plotWithPaths(jest.fn(() => null)), 1, 0)).toBeNull();
-		expect(measureBar(plotWithPaths(), 1, 0)).toBeNull();
-	});
-});

frontend/src/lib/uPlotV2/utils/__tests__/logGridSplits.test.ts

@@ -0,0 +1,59 @@
+import type uPlot from 'uplot';
+
+import { logScaleSplits, spacedLogLabels } from '../logGridSplits';
+
+describe('logScaleSplits', () => {
+	const splitsFor = (min: number, max: number): number[] =>
+		(
+			logScaleSplits as (
+				u: uPlot,
+				axisIdx: number,
+				min: number,
+				max: number,
+			) => number[]
+		)({} as uPlot, 0, min, max);
+
+	it('splits at 1, 2 and 5 × 10ⁿ inside an unsnapped range', () => {
+		expect(splitsFor(10.6, 990)).toStrictEqual([20, 50, 100, 200, 500]);
+	});
+
+	it('includes the ends when they fall on a split', () => {
+		expect(splitsFor(0.1, 10)).toStrictEqual([0.1, 0.2, 0.5, 1, 2, 5, 10]);
+	});
+
+	it('is empty for a range a log scale cannot hold', () => {
+		expect(splitsFor(0, 10)).toStrictEqual([]);
+		expect(splitsFor(5, 5)).toStrictEqual([]);
+	});
+});
+
+describe('spacedLogLabels', () => {
+	// 100px per decade.
+	const plot = {
+		axes: [{ scale: 'x' }],
+		valToPos: (value: number): number => Math.log10(value) * 100,
+	} as unknown as uPlot;
+	const label = (splits: number[], space: number): (number | null)[] =>
+		spacedLogLabels(plot, splits, 0, space, 0) as (number | null)[];
+
+	it('always labels the powers of ten', () => {
+		expect(label([10, 20, 50, 100], 200)).toStrictEqual([10, null, null, 100]);
+	});
+
+	it('adds a 2 or 5 that clears the labels already kept', () => {
+		// 20 is 30px from 10; 50 is 70px from 10 and 30px from 100.
+		expect(label([10, 20, 50, 100], 25)).toStrictEqual([10, 20, 50, 100]);
+		expect(label([10, 20, 50, 100], 40)).toStrictEqual([10, null, null, 100]);
+	});
+
+	it('labels both ends of a range spanning under a decade', () => {
+		// 100 sits at 200px; 20 (130px) and 500 (270px) clear it, 50 and 200 do not.
+		expect(label([20, 50, 100, 200, 500], 60)).toStrictEqual([
+			20,
+			null,
+			100,
+			null,
+			500,
+		]);
+	});
+});