Merge branch 'main' into feat/qb-dual-mode

Generic hook that raises the browser's native unsaved-changes confirmation on
refresh / tab-close while `enabled` is true. Reusable guard for any surface
holding unsaved in-memory state; in-app navigation is expected to be guarded
separately (e.g. a discard-changes modal).

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

docs/api/openapi.yml

@@ -409,6 +409,10 @@ components:
       properties:
         duration:
           type: string
+        endTime:
+          format: date-time
+          nullable: true
+          type: string
         repeatOn:
           items:
             $ref: '#/components/schemas/AlertmanagertypesRepeatOn'
@@ -416,7 +420,11 @@ components:
           type: array
         repeatType:
           $ref: '#/components/schemas/AlertmanagertypesRepeatType'
+        startTime:
+          format: date-time
+          type: string
       required:
+      - startTime
       - duration
       - repeatType
       type: object
@@ -450,7 +458,6 @@ components:
           type: string
       required:
       - timezone
-      - startTime
       type: object
     AuthtypesAttributeMapping:
       properties:
@@ -2769,16 +2776,9 @@ components:
             type: string
           nullable: true
           type: object
-        mode:
-          $ref: '#/components/schemas/DashboardtypesLegendMode'
         position:
           $ref: '#/components/schemas/DashboardtypesLegendPosition'
       type: object
-    DashboardtypesLegendMode:
-      enum:
-      - list
-      - table
-      type: string
     DashboardtypesLegendPosition:
       enum:
       - bottom
@@ -3328,13 +3328,8 @@ components:
     DashboardtypesSpanGaps:
       properties:
         fillLessThan:
-          description: The maximum gap size to connect when fillOnlyBelow is true.
-            Gaps larger than this duration are left disconnected.
           type: string
         fillOnlyBelow:
-          description: Controls whether lines connect across null values. When false
-            (default), all gaps are connected. When true, only gaps smaller than fillLessThan
-            are connected.
           type: boolean
       type: object
     DashboardtypesStorableDashboardData:
@@ -3401,6 +3396,7 @@ components:
       required:
       - value
       - color
+      - label
       type: object
     DashboardtypesTimePreference:
       enum:

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

@@ -413,11 +413,21 @@ export interface AlertmanagertypesRecurrenceDTO {
 	 * @type string
 	 */
 	duration: string;
+	/**
+	 * @type string,null
+	 * @format date-time
+	 */
+	endTime?: string | null;
 	/**
 	 * @type array,null
 	 */
 	repeatOn?: AlertmanagertypesRepeatOnDTO[] | null;
 	repeatType: AlertmanagertypesRepeatTypeDTO;
+	/**
+	 * @type string
+	 * @format date-time
+	 */
+	startTime: string;
 }
 
 export interface AlertmanagertypesScheduleDTO {
@@ -431,7 +441,7 @@ export interface AlertmanagertypesScheduleDTO {
 	 * @type string
 	 * @format date-time
 	 */
-	startTime: string;
+	startTime?: string;
 	/**
 	 * @type string
 	 */
@@ -3208,10 +3218,6 @@ export interface DashboardtypesPanelFormattingDTO {
 	unit?: string;
 }
 
-export enum DashboardtypesLegendModeDTO {
-	list = 'list',
-	table = 'table',
-}
 export enum DashboardtypesLegendPositionDTO {
 	bottom = 'bottom',
 	right = 'right',
@@ -3231,7 +3237,6 @@ export interface DashboardtypesLegendDTO {
 	 * @type object,null
 	 */
 	customColors?: DashboardtypesLegendDTOCustomColors;
-	mode?: DashboardtypesLegendModeDTO;
 	position?: DashboardtypesLegendPositionDTO;
 }
 
@@ -3243,7 +3248,7 @@ export interface DashboardtypesThresholdWithLabelDTO {
 	/**
 	 * @type string
 	 */
-	label?: string;
+	label: string;
 	/**
 	 * @type string
 	 */
@@ -3908,12 +3913,10 @@ export enum DashboardtypesLineStyleDTO {
 export interface DashboardtypesSpanGapsDTO {
 	/**
 	 * @type string
-	 * @description The maximum gap size to connect when fillOnlyBelow is true. Gaps larger than this duration are left disconnected.
 	 */
 	fillLessThan?: string;
 	/**
 	 * @type boolean
-	 * @description Controls whether lines connect across null values. When false (default), all gaps are connected. When true, only gaps smaller than fillLessThan are connected.
 	 */
 	fillOnlyBelow?: boolean;
 }

frontend/src/components/QueryBuilderV2/__tests__/QueryBuilder.PrevQuery.test.tsx

@@ -106,6 +106,8 @@ describe('MetricsSelect - signal source switching (standalone)', () => {
 		};
 
 		(mockedUseQueryBuilder as any).mockReturnValue({
+			mode: 'url',
+			committedQuery: null,
 			currentQuery: currentQueryObj,
 			stagedQuery: null,
 			lastUsedQuery: null,
@@ -263,6 +265,8 @@ describe('DataSource change - Logs to Traces', () => {
 
 		mockedUseQueryBuilder.mockReset();
 		mockedUseQueryBuilder.mockReturnValue({
+			mode: 'url',
+			committedQuery: null,
 			currentQuery: logsCurrentQuery,
 			stagedQuery: null,
 			lastUsedQuery: null,

frontend/src/container/BillingContainer/BillingContainer.module.scss

@@ -1,7 +1,8 @@
 .billingContainer {
+	margin-bottom: var(--spacing-20);
 	padding-top: 36px;
 	width: 90%;
-	margin: 0 auto var(--spacing-20);
+	margin: 0 auto;
 
 	.pageHeader {
 		margin-bottom: var(--spacing-8);

frontend/src/container/GeneralSettings/LicenseKeyRow/LicenseRowDismissibleCallout/LicenseRowDismissible.styles.scss

@@ -1,6 +1,6 @@
 .license-key-callout {
 	margin: var(--spacing-4) var(--spacing-6);
-	width: auto !important;
+	width: auto;
 
 	.license-key-callout__description {
 		display: flex;

frontend/src/container/GeneralSettings/__tests__/index.test.tsx

@@ -1,41 +0,0 @@
-import { useQueries } from 'react-query';
-import { render, screen } from 'tests/test-utils';
-
-import GeneralSettings from '../index';
-
-jest.mock('react-query', () => ({
-	...jest.requireActual('react-query'),
-	useQueries: jest.fn(),
-}));
-
-const baseQueryResult = {
-	isError: false,
-	isLoading: false,
-	isFetching: false,
-	isSuccess: true,
-	data: undefined,
-	error: null,
-	refetch: jest.fn(),
-};
-
-describe('GeneralSettings index', () => {
-	it('renders fallback message when logs query fails with a non-APIError', () => {
-		(useQueries as jest.Mock).mockReturnValue([
-			{ ...baseQueryResult },
-			{ ...baseQueryResult },
-			{
-				...baseQueryResult,
-				isError: true,
-				isSuccess: false,
-				error: new TypeError(
-					"Cannot read properties of undefined (reading 'code')",
-				),
-			},
-			{ ...baseQueryResult },
-		]);
-
-		render(<GeneralSettings />);
-
-		expect(screen.getByText('something_went_wrong')).toBeInTheDocument();
-	});
-});

frontend/src/container/GeneralSettings/index.tsx

@@ -76,9 +76,7 @@ function GeneralSettings(): JSX.Element {
 	if (getRetentionPeriodLogsApiResponse.isError || getDisksResponse.isError) {
 		return (
 			<Typography>
-				{(getRetentionPeriodLogsApiResponse.error instanceof APIError
-					? getRetentionPeriodLogsApiResponse.error.getErrorMessage()
-					: undefined) ||
+				{(getRetentionPeriodLogsApiResponse.error as APIError).getErrorMessage() ||
 					getDisksResponse.data?.error ||
 					t('something_went_wrong')}
 			</Typography>

frontend/src/container/InfraMonitoringK8s/Clusters/constants.ts

@@ -796,7 +796,7 @@ export const getClusterMetricsQueryPayload = (
 								key: k8sDeploymentDesiredKey,
 								type: 'Gauge',
 							},
-							aggregateOperator: 'latest',
+							aggregateOperator: 'avg',
 							dataSource: DataSource.METRICS,
 							disabled: false,
 							expression: 'B',
@@ -839,7 +839,7 @@ export const getClusterMetricsQueryPayload = (
 							reduceTo: ReduceOperators.LAST,
 							spaceAggregation: 'sum',
 							stepInterval: 60,
-							timeAggregation: 'latest',
+							timeAggregation: 'avg',
 						},
 					],
 					queryFormulas: [],

frontend/src/container/InfraMonitoringK8s/EntityDetailsUtils/EntityEvents/EntityEvents.tsx

@@ -40,7 +40,6 @@ import { K8S_ENTITY_EVENTS_EXPRESSION_KEY, useEntityEvents } from './hooks';
 import { getEntityEventsQueryPayload, isEventsKeyNotFoundError } from './utils';
 
 import styles from './EntityEvents.module.scss';
-import { useTimezone } from 'providers/Timezone';
 
 interface EventDataType {
 	key: string;
@@ -168,25 +167,17 @@ function EntityEventsContent({
 		[events],
 	);
 
-	const { formatTimezoneAdjustedTimestamp } = useTimezone();
-	const columns: TableColumnsType<EventDataType> = useMemo(
-		() => [
-			{ title: 'Severity', dataIndex: 'severity', key: 'severity', width: 100 },
-			{
-				title: 'Timestamp',
-				dataIndex: 'timestamp',
-				width: 240,
-				ellipsis: true,
-				key: 'timestamp',
-				render: (value: string | number): string =>
-					formatTimezoneAdjustedTimestamp(
-						typeof value === 'string' ? value : value / 1e6,
-					),
-			},
-			{ title: 'Body', dataIndex: 'body', key: 'body' },
-		],
-		[formatTimezoneAdjustedTimestamp],
-	);
+	const columns: TableColumnsType<EventDataType> = [
+		{ title: 'Severity', dataIndex: 'severity', key: 'severity', width: 100 },
+		{
+			title: 'Timestamp',
+			dataIndex: 'timestamp',
+			width: 240,
+			ellipsis: true,
+			key: 'timestamp',
+		},
+		{ title: 'Body', dataIndex: 'body', key: 'body' },
+	];
 
 	const handleExpandRowIcon = ({
 		expanded,

frontend/src/container/InfraMonitoringK8s/EntityDetailsUtils/EntityTraces/EntityTraces.tsx

@@ -41,7 +41,6 @@ import { getTraceListColumns } from './traceListColumns';
 import { getEntityTracesQueryPayload } from './utils';
 
 import styles from './EntityTraces.module.scss';
-import { useTimezone } from 'providers/Timezone';
 
 interface Props {
 	timeRange: {
@@ -137,11 +136,7 @@ function EntityTracesContent({
 		[timeRange.startTime, timeRange.endTime, userExpression],
 	);
 
-	const { formatTimezoneAdjustedTimestamp } = useTimezone();
-	const traceListColumns = getTraceListColumns(
-		selectedEntityTracesColumns,
-		formatTimezoneAdjustedTimestamp,
-	);
+	const traceListColumns = getTraceListColumns(selectedEntityTracesColumns);
 
 	const isKeyNotFound = isKeyNotFoundError(error);
 	const isDataEmpty =

frontend/src/container/InfraMonitoringK8s/EntityDetailsUtils/EntityTraces/traceListColumns.tsx

@@ -1,14 +1,15 @@
 import { TableColumnsType as ColumnsType } from 'antd';
 import { Badge } from '@signozhq/ui/badge';
 import { Typography } from '@signozhq/ui/typography';
+import { DATE_TIME_FORMATS } from 'constants/dateTimeFormats';
 import { getMs } from 'container/Trace/Filters/Panel/PanelBody/Duration/util';
 import {
 	BlockLink,
 	getTraceLink,
 } from 'container/TracesExplorer/ListView/utils';
+import dayjs from 'dayjs';
 import { RowData } from 'lib/query/createTableColumnsFromQuery';
 import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
-import { FormatTimezoneAdjustedTimestamp } from 'hooks/useTimezoneFormatter/useTimezoneFormatter';
 
 const keyToLabelMap: Record<string, string> = {
 	timestamp: 'Timestamp',
@@ -58,7 +59,6 @@ const getValueForKey = (data: Record<string, any>, key: string): any => {
 
 export const getTraceListColumns = (
 	selectedColumns: BaseAutocompleteData[],
-	formatTimezoneAdjustedTimestamp: FormatTimezoneAdjustedTimestamp,
 ): ColumnsType<RowData> => {
 	const columns: ColumnsType<RowData> =
 		selectedColumns.map(({ dataType, key, type }) => ({
@@ -73,8 +73,8 @@ export const getTraceListColumns = (
 				if (primaryKey === 'timestamp') {
 					const date =
 						typeof value === 'string'
-							? formatTimezoneAdjustedTimestamp(value)
-							: formatTimezoneAdjustedTimestamp(value / 1e6);
+							? dayjs(value).format(DATE_TIME_FORMATS.ISO_DATETIME_MS)
+							: dayjs(value / 1e6).format(DATE_TIME_FORMATS.ISO_DATETIME_MS);
 
 					return (
 						<BlockLink to={getTraceLink(itemData)} openInNewTab>

frontend/src/container/InfraMonitoringK8s/Pods/constants.ts

@@ -1366,7 +1366,7 @@ export const getPodMetricsQueryPayload = (
 							orderBy: [],
 							queryName: 'B',
 							reduceTo: ReduceOperators.AVG,
-							spaceAggregation: 'sum',
+							spaceAggregation: 'avg',
 							stepInterval: 60,
 							timeAggregation: 'avg',
 						},

frontend/src/container/InfraMonitoringK8s/Volumes/table.config.tsx

@@ -86,9 +86,9 @@ export const k8sVolumesColumnsConfig: TableColumnDef<K8sVolumesData>[] = [
 	},
 	{
 		id: 'capacity',
-		header: 'Capacity',
+		header: 'Volume Capacity',
 		accessorFn: (row): number => row.volumeCapacity,
-		width: { min: 140 },
+		width: { min: 220 },
 		enableSort: true,
 		cell: ({ value }): React.ReactNode => {
 			const capacity = value as number;
@@ -105,9 +105,9 @@ export const k8sVolumesColumnsConfig: TableColumnDef<K8sVolumesData>[] = [
 	},
 	{
 		id: 'usage',
-		header: 'Used',
+		header: 'Volume Utilization',
 		accessorFn: (row): number => row.volumeUsage,
-		width: { min: 140 },
+		width: { min: 220 },
 		enableSort: true,
 		cell: ({ value }): React.ReactNode => {
 			const usage = value as number;
@@ -124,9 +124,9 @@ export const k8sVolumesColumnsConfig: TableColumnDef<K8sVolumesData>[] = [
 	},
 	{
 		id: 'available',
-		header: 'Available',
+		header: 'Volume Available',
 		accessorFn: (row): number => row.volumeAvailable,
-		width: { min: 140 },
+		width: { min: 220 },
 		enableSort: true,
 		cell: ({ value }): React.ReactNode => {
 			const available = value as number;
@@ -141,61 +141,4 @@ export const k8sVolumesColumnsConfig: TableColumnDef<K8sVolumesData>[] = [
 			);
 		},
 	},
-	{
-		id: 'inodes',
-		header: 'Inodes',
-		accessorFn: (row): number => row.volumeInodes,
-		width: { min: 140 },
-		enableSort: true,
-		cell: ({ value }): React.ReactNode => {
-			const inodes = value as number;
-			return (
-				<ValidateColumnValueWrapper
-					value={inodes}
-					entity={InfraMonitoringEntity.VOLUMES}
-					attribute="inodes metric"
-				>
-					<TanStackTable.Text>{inodes}</TanStackTable.Text>
-				</ValidateColumnValueWrapper>
-			);
-		},
-	},
-	{
-		id: 'inodesUsed',
-		header: 'Inodes Used',
-		accessorFn: (row): number => row.volumeInodesUsed,
-		width: { min: 160 },
-		enableSort: true,
-		cell: ({ value }): React.ReactNode => {
-			const inodesUsed = value as number;
-			return (
-				<ValidateColumnValueWrapper
-					value={inodesUsed}
-					entity={InfraMonitoringEntity.VOLUMES}
-					attribute="inodes used metric"
-				>
-					<TanStackTable.Text>{inodesUsed}</TanStackTable.Text>
-				</ValidateColumnValueWrapper>
-			);
-		},
-	},
-	{
-		id: 'inodesFree',
-		header: 'Inodes Free',
-		accessorFn: (row): number => row.volumeInodesFree,
-		width: { min: 160 },
-		enableSort: true,
-		cell: ({ value }): React.ReactNode => {
-			const inodesFree = value as number;
-			return (
-				<ValidateColumnValueWrapper
-					value={inodesFree}
-					entity={InfraMonitoringEntity.VOLUMES}
-					attribute="inodes free metric"
-				>
-					<TanStackTable.Text>{inodesFree}</TanStackTable.Text>
-				</ValidateColumnValueWrapper>
-			);
-		},
-	},
 ];

frontend/src/container/LogsExplorerViews/tests/LogsExplorerPagination.test.tsx

@@ -388,6 +388,8 @@ function LogsExplorerWithMockContext({
 
 	const contextValue = React.useMemo(
 		() => ({
+			mode: 'url' as const,
+			committedQuery: stagedQuery,
 			isDefaultQuery: (): boolean => false,
 			currentQuery,
 			stagedQuery,

frontend/src/container/LogsExplorerViews/tests/mock.ts

@@ -61,6 +61,8 @@ export const logsQueryRangeSuccessNewFormatResponse = {
 };
 
 export const mockQueryBuilderContextValue = {
+	mode: 'url' as const,
+	committedQuery: null,
 	isDefaultQuery: (): boolean => false,
 	currentQuery: {
 		...initialQueriesMap.logs,

frontend/src/container/PlannedDowntime/PlannedDowntimeForm.tsx

@@ -151,11 +151,6 @@ export function PlannedDowntimeForm(
 
 	const saveHandler = useCallback(
 		async (values: PlannedDowntimeFormData) => {
-			const { startTime, timezone } = values;
-			if (!startTime || !timezone) {
-				// unreachable: required fields should always be present on submitting.
-				return;
-			}
 			const data: AlertmanagertypesPostablePlannedMaintenanceDTO = {
 				alertIds:
 					values.alertRuleScope === 'all'
@@ -166,9 +161,9 @@ export function PlannedDowntimeForm(
 				name: values.name,
 				scope: values.scope,
 				schedule: {
-					startTime: startTime.format(),
+					startTime: values.startTime?.format(),
 					endTime: values.endTime?.format(),
-					timezone,
+					timezone: values.timezone!,
 					recurrence: values.recurrence,
 				},
 			};
@@ -205,17 +200,25 @@ export function PlannedDowntimeForm(
 		],
 	);
 	const onFinish = async (values: PlannedDowntimeFormData): Promise<void> => {
-		const rec = values.recurrence;
-		const recurrence =
-			rec && rec.repeatType !== recurrenceOptions.doesNotRepeat.value
-				? {
-						duration: `${rec.duration}${durationUnit}`,
-						repeatOn: rec.repeatOn,
-						repeatType: rec.repeatType,
-					}
-				: undefined;
+		const { recurrence } = values;
+		const recurrenceData =
+			!recurrence ||
+			recurrence.repeatType === recurrenceOptions.doesNotRepeat.value
+				? undefined
+				: {
+						duration: recurrence.duration
+							? `${recurrence.duration}${durationUnit}`
+							: '',
+						startTime: values.startTime!.format(),
+						endTime: values.endTime?.format(),
+						repeatOn: recurrence.repeatOn,
+						repeatType: recurrence.repeatType,
+					};
 
-		await saveHandler({ ...values, recurrence });
+		await saveHandler({
+			...values,
+			recurrence: recurrenceData,
+		});
 	};
 
 	const handleFormData = (data: Partial<PlannedDowntimeFormData>): void => {
@@ -272,6 +275,9 @@ export function PlannedDowntimeForm(
 
 	const formattedInitialValues = useMemo((): PlannedDowntimeFormData => {
 		const { schedule } = initialValues;
+		const startTime = schedule?.recurrence?.startTime || schedule?.startTime;
+		const endTime = schedule?.recurrence?.endTime || schedule?.endTime;
+
 		const initialAlertIds = initialValues.alertIds || [];
 
 		return {
@@ -279,12 +285,8 @@ export function PlannedDowntimeForm(
 			alertRuleScope:
 				isEditMode && initialAlertIds.length === 0 ? 'all' : 'specific',
 			alertRules: getAlertOptionsFromIds(initialAlertIds, alertOptions),
-			startTime: schedule?.startTime
-				? dayjs(schedule.startTime).tz(schedule.timezone)
-				: null,
-			endTime: schedule?.endTime
-				? dayjs(schedule.endTime).tz(schedule.timezone)
-				: null,
+			startTime: startTime ? dayjs(startTime).tz(schedule.timezone) : null,
+			endTime: endTime ? dayjs(endTime).tz(schedule.timezone) : null,
 			recurrence: {
 				...schedule?.recurrence,
 				repeatType: !isScheduleRecurring(schedule)
@@ -295,7 +297,7 @@ export function PlannedDowntimeForm(
 			timezone: schedule?.timezone as string,
 			scope: initialValues.scope || '',
 		};
-	}, [initialValues, isEditMode, alertOptions]);
+	}, [initialValues, alertOptions]);
 
 	useEffect(() => {
 		setSelectedTags(formattedInitialValues.alertRules);
@@ -339,7 +341,7 @@ export function PlannedDowntimeForm(
 		const formattedEndTime = endTime.format(TIME_FORMAT);
 		const formattedEndDate = endTime.format(DATE_FORMAT);
 		return `Scheduled to end maintenance on ${formattedEndDate} at ${formattedEndTime}.`;
-	}, [formData]);
+	}, [formData, recurrenceType]);
 
 	return (
 		<Modal

frontend/src/container/PlannedDowntime/PlannedDowntimeList.tsx

@@ -142,6 +142,7 @@ export function CollapseListContent({
 	updated_by_name?: string;
 	alertOptions?: DefaultOptionType[];
 }): JSX.Element {
+	const repeats = schedule?.recurrence;
 	const renderItems = (title: string, value: ReactNode): JSX.Element => (
 		<div className="render-item-collapse-list">
 			<Typography>{title}</Typography>
@@ -192,7 +193,10 @@ export function CollapseListContent({
 				'Timezone',
 				<Typography>{schedule?.timezone || '-'}</Typography>,
 			)}
-			{renderItems('Repeats', <Typography>{recurrenceInfo(schedule)}</Typography>)}
+			{renderItems(
+				'Repeats',
+				<Typography>{recurrenceInfo(repeats, schedule?.timezone)}</Typography>,
+			)}
 			{renderItems(
 				'Alerts silenced',
 				alertOptions?.length ? (

frontend/src/container/PlannedDowntime/PlannedDowntimeutils.ts

@@ -6,7 +6,7 @@ import type {
 	DeleteDowntimeScheduleByIDPathParameters,
 	RenderErrorResponseDTO,
 	AlertmanagertypesPlannedMaintenanceDTO,
-	AlertmanagertypesScheduleDTO,
+	AlertmanagertypesRecurrenceDTO,
 } from 'api/generated/services/sigNoz.schemas';
 import type { ErrorType } from 'api/generatedAPIInstance';
 import { AxiosError } from 'axios';
@@ -66,17 +66,14 @@ export const getAlertOptionsFromIds = (
 	);
 
 export const recurrenceInfo = (
-	schedule?: AlertmanagertypesScheduleDTO | null,
+	recurrence?: AlertmanagertypesRecurrenceDTO | null,
+	timezone?: string,
 ): string => {
-	if (!schedule) {
-		return 'No';
-	}
-	const { startTime, endTime, timezone, recurrence } = schedule;
 	if (!recurrence) {
 		return 'No';
 	}
 
-	const { duration, repeatOn, repeatType } = recurrence;
+	const { startTime, duration, repeatOn, repeatType, endTime } = recurrence;
 
 	const formattedStartTime = startTime
 		? formatDateTime(startTime, timezone)
@@ -98,7 +95,7 @@ export const defaultInitialValues: Partial<AlertmanagertypesPlannedMaintenanceDT
 			timezone: '',
 			endTime: undefined,
 			recurrence: undefined,
-			startTime: '',
+			startTime: undefined,
 		},
 		alertIds: [],
 		createdAt: undefined,

frontend/src/container/PlannedDowntime/__test__/testUtils.ts

@@ -11,7 +11,7 @@ export const buildSchedule = (
 	schedule: Partial<AlertmanagertypesScheduleDTO>,
 ): AlertmanagertypesScheduleDTO => ({
 	timezone: schedule?.timezone ?? '',
-	startTime: schedule?.startTime ?? '',
+	startTime: schedule?.startTime,
 	endTime: schedule?.endTime,
 	recurrence: schedule?.recurrence,
 });

frontend/src/container/SideNav/SideNav.styles.scss

@@ -1135,9 +1135,17 @@
 
 .settings-dropdown,
 .help-support-dropdown {
-	.user-settings-dropdown-logout-section {
-		color: var(--danger-background);
-		pointer-events: auto;
+	.ant-dropdown-menu-item {
+		min-height: 32px;
+
+		.ant-dropdown-menu-title-content {
+			color: var(--l1-foreground) !important;
+		}
+
+		.user-settings-dropdown-logout-section {
+			color: var(--danger-background);
+			pointer-events: auto;
+		}
 	}
 }
 

frontend/src/hooks/__tests__/useBeforeUnloadWarning.test.ts

@@ -0,0 +1,38 @@
+import { renderHook } from '@testing-library/react';
+
+import useBeforeUnloadWarning from '../useBeforeUnloadWarning';
+
+const dispatchBeforeUnload = (): Event => {
+	const event = new Event('beforeunload', { cancelable: true });
+	window.dispatchEvent(event);
+	return event;
+};
+
+describe('useBeforeUnloadWarning', () => {
+	it('prevents unload while enabled', () => {
+		renderHook(() => useBeforeUnloadWarning(true));
+
+		expect(dispatchBeforeUnload().defaultPrevented).toBe(true);
+	});
+
+	it('does not prevent unload while disabled', () => {
+		renderHook(() => useBeforeUnloadWarning(false));
+
+		expect(dispatchBeforeUnload().defaultPrevented).toBe(false);
+	});
+
+	it('tracks enabled changes and cleans up on unmount', () => {
+		const { rerender, unmount } = renderHook(
+			({ enabled }) => useBeforeUnloadWarning(enabled),
+			{ initialProps: { enabled: false } },
+		);
+
+		expect(dispatchBeforeUnload().defaultPrevented).toBe(false);
+
+		rerender({ enabled: true });
+		expect(dispatchBeforeUnload().defaultPrevented).toBe(true);
+
+		unmount();
+		expect(dispatchBeforeUnload().defaultPrevented).toBe(false);
+	});
+});

frontend/src/hooks/queryBuilder/compositeQueryStore/__tests__/useMemoryCompositeQueryStore.test.ts

@@ -0,0 +1,74 @@
+import { act, renderHook } from '@testing-library/react';
+import { initialQueriesMap, PANEL_TYPES } from 'constants/queryBuilder';
+import { Query } from 'types/api/queryBuilder/queryBuilderData';
+
+import { useMemoryCompositeQueryStore } from '../useMemoryCompositeQueryStore';
+
+const legacyLogsQuery: Query = {
+	...initialQueriesMap.logs,
+	builder: {
+		...initialQueriesMap.logs.builder,
+		queryData: [
+			{
+				...initialQueriesMap.logs.builder.queryData[0],
+				having: [{ columnName: 'count()', op: '>', value: 100 }],
+			},
+		],
+	},
+};
+
+describe('useMemoryCompositeQueryStore', () => {
+	it('starts empty when no initialQuery is provided', () => {
+		const { result } = renderHook(() => useMemoryCompositeQueryStore({}));
+
+		expect(result.current.mode).toBe('memory');
+		expect(result.current.query).toBeNull();
+		expect(result.current.panelType).toBeNull();
+	});
+
+	it('seeds query (with legacy-format migration) and panelType', () => {
+		const { result } = renderHook(() =>
+			useMemoryCompositeQueryStore({
+				initialQuery: legacyLogsQuery,
+				initialPanelType: PANEL_TYPES.TABLE,
+			}),
+		);
+
+		expect(result.current.query?.id).toBe(legacyLogsQuery.id);
+		expect(result.current.query?.builder.queryData[0].having).toStrictEqual({
+			expression: 'count() > 100',
+		});
+		expect(result.current.panelType).toBe(PANEL_TYPES.TABLE);
+	});
+
+	it('updates query and notifies onCommit when a query is committed', () => {
+		const onCommit = jest.fn();
+		const { result } = renderHook(() =>
+			useMemoryCompositeQueryStore({ onCommit }),
+		);
+
+		act(() => {
+			result.current.commit(initialQueriesMap.logs);
+		});
+
+		expect(result.current.query).toBe(initialQueriesMap.logs);
+		expect(onCommit).toHaveBeenCalledTimes(1);
+		expect(onCommit).toHaveBeenCalledWith(initialQueriesMap.logs);
+	});
+
+	it('ignores URL-mode commit options but still stores the query', () => {
+		const warnSpy = jest.spyOn(console, 'warn').mockImplementation(() => {});
+		const { result } = renderHook(() => useMemoryCompositeQueryStore({}));
+
+		act(() => {
+			result.current.commit(initialQueriesMap.logs, {
+				redirectingUrl: '/traces-explorer' as never,
+				newTab: true,
+			});
+		});
+
+		expect(result.current.query).toBe(initialQueriesMap.logs);
+		expect(warnSpy).toHaveBeenCalled();
+		warnSpy.mockRestore();
+	});
+});

frontend/src/hooks/queryBuilder/compositeQueryStore/__tests__/useUrlCompositeQueryStore.test.tsx

@@ -0,0 +1,140 @@
+import React from 'react';
+import { MemoryRouter } from 'react-router-dom';
+import { act, renderHook } from '@testing-library/react';
+import { QueryParams } from 'constants/query';
+import { initialQueriesMap, PANEL_TYPES } from 'constants/queryBuilder';
+import ROUTES from 'constants/routes';
+import { serializeCompositeQueryParam } from 'lib/compositeQuery/compositeQuerySerialization';
+
+import { useUrlCompositeQueryStore } from '../useUrlCompositeQueryStore';
+
+const mockSafeNavigate = jest.fn();
+
+jest.mock('hooks/useSafeNavigate', () => ({
+	useSafeNavigate: (): { safeNavigate: jest.Mock } => ({
+		safeNavigate: mockSafeNavigate,
+	}),
+}));
+
+function createWrapper(
+	initialUrl: string,
+): ({ children }: { children: React.ReactNode }) => JSX.Element {
+	return function Wrapper({
+		children,
+	}: {
+		children: React.ReactNode;
+	}): JSX.Element {
+		return React.createElement(
+			MemoryRouter,
+			{ initialEntries: [initialUrl] },
+			children,
+		) as JSX.Element;
+	};
+}
+
+function getNavigatedParams(): URLSearchParams {
+	const [navigatedUrl] = mockSafeNavigate.mock.calls[0];
+	return new URLSearchParams(navigatedUrl.split('?')[1]);
+}
+
+describe('useUrlCompositeQueryStore', () => {
+	beforeEach(() => {
+		mockSafeNavigate.mockClear();
+	});
+
+	it('reads the committed query and panelType from the URL', () => {
+		const initialParams = new URLSearchParams();
+		initialParams.set(
+			QueryParams.compositeQuery,
+			serializeCompositeQueryParam(initialQueriesMap.logs),
+		);
+		initialParams.set(QueryParams.panelTypes, PANEL_TYPES.TIME_SERIES);
+
+		const { result } = renderHook(() => useUrlCompositeQueryStore(), {
+			wrapper: createWrapper(`/logs-explorer?${initialParams.toString()}`),
+		});
+
+		expect(result.current.mode).toBe('url');
+		expect(result.current.query?.id).toBe(initialQueriesMap.logs.id);
+		expect(result.current.panelType).toBe(PANEL_TYPES.TIME_SERIES);
+	});
+
+	it('returns null query and panelType when the params are absent', () => {
+		const { result } = renderHook(() => useUrlCompositeQueryStore(), {
+			wrapper: createWrapper('/logs-explorer'),
+		});
+
+		expect(result.current.query).toBeNull();
+		expect(result.current.panelType).toBeNull();
+	});
+
+	it('commits the query to the URL, resets pagination and drops activeLogId', () => {
+		const initialParams = new URLSearchParams();
+		initialParams.set(
+			QueryParams.pagination,
+			JSON.stringify({ limit: 25, offset: 50 }),
+		);
+		initialParams.set(QueryParams.activeLogId, 'some-log-id');
+
+		const { result } = renderHook(() => useUrlCompositeQueryStore(), {
+			wrapper: createWrapper(`/logs-explorer?${initialParams.toString()}`),
+		});
+
+		act(() => {
+			result.current.commit(initialQueriesMap.logs);
+		});
+
+		expect(mockSafeNavigate).toHaveBeenCalledTimes(1);
+		const [navigatedUrl, navigateOptions] = mockSafeNavigate.mock.calls[0];
+		expect(navigatedUrl.startsWith('/logs-explorer?')).toBe(true);
+		expect(navigateOptions).toStrictEqual({ newTab: undefined });
+
+		const params = getNavigatedParams();
+		expect(params.get(QueryParams.compositeQuery)).toBe(
+			serializeCompositeQueryParam(initialQueriesMap.logs),
+		);
+		expect(
+			JSON.parse(params.get(QueryParams.pagination) as string),
+		).toStrictEqual({ limit: 25, offset: 0 });
+		expect(params.get(QueryParams.activeLogId)).toBeNull();
+	});
+
+	it('honors redirectingUrl, stringified searchParams and newTab', () => {
+		const { result } = renderHook(() => useUrlCompositeQueryStore(), {
+			wrapper: createWrapper('/logs-explorer'),
+		});
+
+		act(() => {
+			result.current.commit(initialQueriesMap.logs, {
+				searchParams: { [QueryParams.panelTypes]: PANEL_TYPES.TIME_SERIES },
+				redirectingUrl: ROUTES.TRACES_EXPLORER,
+				newTab: true,
+			});
+		});
+
+		const [navigatedUrl, navigateOptions] = mockSafeNavigate.mock.calls[0];
+		expect(navigatedUrl.startsWith(`${ROUTES.TRACES_EXPLORER}?`)).toBe(true);
+		expect(navigateOptions).toStrictEqual({ newTab: true });
+
+		const params = getNavigatedParams();
+		expect(params.get(QueryParams.panelTypes)).toBe(
+			JSON.stringify(PANEL_TYPES.TIME_SERIES),
+		);
+	});
+
+	it('passes searchParams through raw when shouldNotStringify is set', () => {
+		const { result } = renderHook(() => useUrlCompositeQueryStore(), {
+			wrapper: createWrapper('/logs-explorer'),
+		});
+
+		act(() => {
+			result.current.commit(initialQueriesMap.logs, {
+				searchParams: { [QueryParams.panelTypes]: PANEL_TYPES.TIME_SERIES },
+				shouldNotStringify: true,
+			});
+		});
+
+		const params = getNavigatedParams();
+		expect(params.get(QueryParams.panelTypes)).toBe(PANEL_TYPES.TIME_SERIES);
+	});
+});

frontend/src/hooks/queryBuilder/compositeQueryStore/types.ts

@@ -0,0 +1,31 @@
+import { PANEL_TYPES } from 'constants/queryBuilder';
+import ROUTES from 'constants/routes';
+import { Query } from 'types/api/queryBuilder/queryBuilderData';
+import { CompositeQueryStoreMode } from 'types/common/queryBuilder';
+
+export interface CommitCompositeQueryOptions {
+	searchParams?: Record<string, unknown>;
+	redirectingUrl?: (typeof ROUTES)[keyof typeof ROUTES];
+	shouldNotStringify?: boolean;
+	newTab?: boolean;
+}
+
+/**
+ * Storage strategy for the staged composite query. The provider edits
+ * `currentQuery` in React state; on stage/run the normalized query is
+ * committed to a store. The `url` store persists it in the
+ * `compositeQuery` URL param (shareable, survives reloads); the `memory`
+ * store keeps it in React state (clean URLs, host-controlled lifetime).
+ */
+export interface CompositeQueryStore {
+	mode: CompositeQueryStoreMode;
+	/** Parsed + migrated committed query, or null when none is committed. */
+	query: Query | null;
+	/** Panel type associated with the committed query, when known. */
+	panelType: PANEL_TYPES | null;
+	/**
+	 * Persists an already-normalized query (see normalizeCompositeQuery).
+	 * Options are url-mode navigation concerns; the memory store ignores them.
+	 */
+	commit: (query: Query, options?: CommitCompositeQueryOptions) => void;
+}

frontend/src/hooks/queryBuilder/compositeQueryStore/useMemoryCompositeQueryStore.ts

@@ -0,0 +1,60 @@
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { PANEL_TYPES } from 'constants/queryBuilder';
+import { migrateCompositeQuery } from 'lib/compositeQuery/migrateCompositeQuery';
+import { Query } from 'types/api/queryBuilder/queryBuilderData';
+
+import { CommitCompositeQueryOptions, CompositeQueryStore } from './types';
+
+export interface UseMemoryCompositeQueryStoreProps {
+	initialQuery?: Query;
+	initialPanelType?: PANEL_TYPES;
+	onCommit?: (query: Query) => void;
+}
+
+/**
+ * CompositeQueryStore backed by React state — the staged query never
+ * touches the URL. The seed query goes through the same legacy-format
+ * migration as URL parsing, so hosts can pass queries loaded from saved
+ * sources (alert rules, dashboard specs) as is. The store lives and dies
+ * with the provider that mounts it.
+ */
+export const useMemoryCompositeQueryStore = ({
+	initialQuery,
+	initialPanelType,
+	onCommit,
+}: UseMemoryCompositeQueryStoreProps): CompositeQueryStore => {
+	const [query, setQuery] = useState<Query | null>(() =>
+		initialQuery ? migrateCompositeQuery(initialQuery) : null,
+	);
+	const [panelType] = useState<PANEL_TYPES | null>(initialPanelType ?? null);
+
+	const onCommitRef = useRef(onCommit);
+	useEffect(() => {
+		onCommitRef.current = onCommit;
+	}, [onCommit]);
+
+	const commit = useCallback(
+		(committedQuery: Query, options?: CommitCompositeQueryOptions): void => {
+			if (
+				process.env.NODE_ENV !== 'production' &&
+				options &&
+				(options.redirectingUrl || options.searchParams || options.newTab)
+			) {
+				// eslint-disable-next-line no-console
+				console.warn(
+					'[QueryBuilder] memory mode ignores URL commit options:',
+					options,
+				);
+			}
+
+			setQuery(committedQuery);
+			onCommitRef.current?.(committedQuery);
+		},
+		[],
+	);
+
+	return useMemo(
+		() => ({ mode: 'memory', query, panelType, commit }),
+		[query, panelType, commit],
+	);
+};

frontend/src/hooks/queryBuilder/compositeQueryStore/useUrlCompositeQueryStore.ts

@@ -0,0 +1,78 @@
+import { useCallback, useMemo } from 'react';
+import { useLocation } from 'react-router-dom';
+import { QueryParams } from 'constants/query';
+import { PANEL_TYPES } from 'constants/queryBuilder';
+import { useGetCompositeQueryParam } from 'hooks/queryBuilder/useGetCompositeQueryParam';
+import { useSafeNavigate } from 'hooks/useSafeNavigate';
+import useUrlQuery from 'hooks/useUrlQuery';
+import { serializeCompositeQueryParam } from 'lib/compositeQuery/compositeQuerySerialization';
+import { Query } from 'types/api/queryBuilder/queryBuilderData';
+
+import { CommitCompositeQueryOptions, CompositeQueryStore } from './types';
+
+/**
+ * CompositeQueryStore backed by the `compositeQuery` URL param — the
+ * default, shareable storage for the staged query.
+ */
+export const useUrlCompositeQueryStore = (): CompositeQueryStore => {
+	const urlQuery = useUrlQuery();
+	const location = useLocation();
+	const query = useGetCompositeQueryParam();
+
+	const { safeNavigate } = useSafeNavigate({
+		preventSameUrlNavigation: false,
+	});
+
+	const panelType = urlQuery.get(QueryParams.panelTypes) as PANEL_TYPES | null;
+
+	const commit = useCallback(
+		(committedQuery: Query, options?: CommitCompositeQueryOptions): void => {
+			const { searchParams, redirectingUrl, shouldNotStringify, newTab } =
+				options || {};
+
+			const pagination = urlQuery.get(QueryParams.pagination);
+
+			if (pagination) {
+				const parsedPagination = JSON.parse(pagination);
+
+				urlQuery.set(
+					QueryParams.pagination,
+					JSON.stringify({
+						limit: parsedPagination.limit,
+						offset: 0,
+					}),
+				);
+			}
+
+			urlQuery.set(
+				QueryParams.compositeQuery,
+				serializeCompositeQueryParam(committedQuery),
+			);
+
+			if (searchParams) {
+				Object.keys(searchParams).forEach((param) =>
+					urlQuery.set(
+						param,
+						shouldNotStringify
+							? (searchParams[param] as string)
+							: JSON.stringify(searchParams[param]),
+					),
+				);
+			}
+			// Remove Hidden Filters from URL query parameters on query change
+			urlQuery.delete(QueryParams.activeLogId);
+
+			const generatedUrl = redirectingUrl
+				? `${redirectingUrl}?${urlQuery}`
+				: `${location.pathname}?${urlQuery}`;
+
+			safeNavigate(generatedUrl, { newTab });
+		},
+		[location.pathname, safeNavigate, urlQuery],
+	);
+
+	return useMemo(
+		() => ({ mode: 'url', query, panelType, commit }),
+		[query, panelType, commit],
+	);
+};

frontend/src/hooks/queryBuilder/useGetCompositeQueryParam.ts

@@ -1,72 +1,14 @@
 import { useMemo } from 'react';
-import {
-	convertAggregationToExpression,
-	convertFiltersToExpressionWithExistingQuery,
-	convertHavingToExpression,
-} from 'components/QueryBuilderV2/utils';
 import { QueryParams } from 'constants/query';
 import useUrlQuery from 'hooks/useUrlQuery';
-import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
+import { parseCompositeQueryParam } from 'lib/compositeQuery/compositeQuerySerialization';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';
 
 export const useGetCompositeQueryParam = (): Query | null => {
 	const urlQuery = useUrlQuery();
 
-	return useMemo(() => {
-		const compositeQuery = urlQuery.get(QueryParams.compositeQuery);
-		let parsedCompositeQuery: Query | null = null;
-
-		try {
-			if (!compositeQuery) {
-				return null;
-			}
-
-			// MDN reference - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/decodeURIComponent#decoding_query_parameters_from_a_url
-			// MDN reference to support + characters using encoding - https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams#preserving_plus_signs add later
-			parsedCompositeQuery = JSON.parse(
-				decodeURIComponent(compositeQuery.replace(/\+/g, ' ')),
-			);
-
-			// Convert old format to new format for each query in builder.queryData
-			if (parsedCompositeQuery?.builder?.queryData) {
-				parsedCompositeQuery.builder.queryData =
-					parsedCompositeQuery.builder.queryData.map((query) => {
-						const existingExpression = query.filter?.expression || '';
-						const convertedQuery = { ...query };
-
-						const convertedFilter = convertFiltersToExpressionWithExistingQuery(
-							query.filters || { items: [], op: 'AND' },
-							existingExpression,
-						);
-						convertedQuery.filter = convertedFilter.filter;
-						convertedQuery.filters = convertedFilter.filters;
-
-						// Convert having if needed
-						if (Array.isArray(query.having)) {
-							const convertedHaving = convertHavingToExpression(query.having);
-							convertedQuery.having = convertedHaving;
-						}
-
-						// Convert aggregation if needed
-						if (!query.aggregations && query.aggregateOperator) {
-							const convertedAggregation = convertAggregationToExpression({
-								aggregateOperator: query.aggregateOperator,
-								aggregateAttribute: query.aggregateAttribute as BaseAutocompleteData,
-								dataSource: query.dataSource,
-								timeAggregation: query.timeAggregation,
-								spaceAggregation: query.spaceAggregation,
-								reduceTo: query.reduceTo,
-								temporality: query.temporality,
-							}) as any; // Type assertion to handle union type
-							convertedQuery.aggregations = convertedAggregation;
-						}
-						return convertedQuery;
-					});
-			}
-		} catch (e) {
-			parsedCompositeQuery = null;
-		}
-
-		return parsedCompositeQuery;
-	}, [urlQuery]);
+	return useMemo(
+		() => parseCompositeQueryParam(urlQuery.get(QueryParams.compositeQuery)),
+		[urlQuery],
+	);
 };

frontend/src/hooks/queryBuilder/useShareBuilderUrl.ts

@@ -1,35 +1,36 @@
 import { useEffect } from 'react';
-import useUrlQuery from 'hooks/useUrlQuery';
 import { Query } from 'types/api/queryBuilder/queryBuilderData';
 
-import { useGetCompositeQueryParam } from './useGetCompositeQueryParam';
 import { useQueryBuilder } from './useQueryBuilder';
 
 export type UseShareBuilderUrlParams = {
 	defaultValue: Query;
-	/** Force reset the query regardless of URL state */
+	/** Force reset the query regardless of the committed query state */
 	forceReset?: boolean;
 };
 
+/**
+ * Seeds the query builder with a default query when nothing is committed
+ * yet. In url mode this writes the `compositeQuery` URL param (preserving
+ * the original "share builder url" behavior); in memory mode it commits to
+ * the in-memory store without touching the URL.
+ */
 export const useShareBuilderUrl = ({
 	defaultValue,
 	forceReset = false,
 }: UseShareBuilderUrlParams): void => {
-	const { resetQuery, redirectWithQueryBuilderData } = useQueryBuilder();
-	const urlQuery = useUrlQuery();
-
-	const compositeQuery = useGetCompositeQueryParam();
+	const { committedQuery, resetQuery, redirectWithQueryBuilderData } =
+		useQueryBuilder();
 
 	useEffect(() => {
-		if (!compositeQuery || forceReset) {
+		if (!committedQuery || forceReset) {
 			resetQuery(defaultValue);
 			redirectWithQueryBuilderData(defaultValue);
 		}
 	}, [
 		defaultValue,
-		urlQuery,
 		redirectWithQueryBuilderData,
-		compositeQuery,
+		committedQuery,
 		resetQuery,
 		forceReset,
 	]);

frontend/src/hooks/useBeforeUnloadWarning.ts

@@ -0,0 +1,26 @@
+import { useEffect } from 'react';
+
+/**
+ * Shows the browser's native "unsaved changes" confirmation when the user
+ * refreshes or closes the tab while `enabled` is true. In-app navigation is
+ * unaffected — guard that separately (e.g. with a discard-changes modal).
+ */
+const useBeforeUnloadWarning = (enabled: boolean): void => {
+	useEffect(() => {
+		if (!enabled) {
+			return undefined;
+		}
+
+		const handleBeforeUnload = (event: BeforeUnloadEvent): void => {
+			event.preventDefault();
+			// Chrome requires returnValue to be set for the dialog to appear
+			event.returnValue = '';
+		};
+
+		window.addEventListener('beforeunload', handleBeforeUnload);
+		return (): void =>
+			window.removeEventListener('beforeunload', handleBeforeUnload);
+	}, [enabled]);
+};
+
+export default useBeforeUnloadWarning;

frontend/src/hooks/useTimezoneFormatter/useTimezoneFormatter.ts

@@ -22,13 +22,11 @@ interface CacheEntry {
 const CACHE_SIZE_LIMIT = 1000;
 const CACHE_CLEANUP_PERCENTAGE = 0.5; // Remove 50% when limit is reached
 
-export type FormatTimezoneAdjustedTimestamp = (
-	input: TimestampInput,
-	format?: string,
-) => string;
-
 function useTimezoneFormatter({ userTimezone }: { userTimezone: Timezone }): {
-	formatTimezoneAdjustedTimestamp: FormatTimezoneAdjustedTimestamp;
+	formatTimezoneAdjustedTimestamp: (
+		input: TimestampInput,
+		format?: string,
+	) => string;
 } {
 	// Initialize cache using useMemo to persist between renders
 	const cache = useMemo(() => new Map<string, CacheEntry>(), []);

frontend/src/lib/compositeQuery/__tests__/compositeQuery.test.ts

@@ -0,0 +1,185 @@
+import { initialQueriesMap, initialQueryState } from 'constants/queryBuilder';
+import { DataTypes } from 'types/api/queryBuilder/queryAutocompleteResponse';
+import { Query } from 'types/api/queryBuilder/queryBuilderData';
+import { EQueryType } from 'types/common/dashboard';
+
+import {
+	parseCompositeQueryParam,
+	serializeCompositeQueryParam,
+} from '../compositeQuerySerialization';
+import { migrateCompositeQuery } from '../migrateCompositeQuery';
+import { normalizeCompositeQuery } from '../normalizeCompositeQuery';
+
+const legacyLogsQuery: Query = {
+	...initialQueriesMap.logs,
+	builder: {
+		...initialQueriesMap.logs.builder,
+		queryData: [
+			{
+				...initialQueriesMap.logs.builder.queryData[0],
+				aggregations: undefined,
+				aggregateOperator: 'count',
+				filter: undefined,
+				filters: {
+					items: [
+						{
+							id: 'service-name-filter',
+							key: {
+								id: 'service.name',
+								key: 'service.name',
+								dataType: DataTypes.String,
+								type: 'tag',
+							},
+							op: '=',
+							value: 'frontend',
+						},
+					],
+					op: 'AND',
+				},
+				having: [{ columnName: 'count()', op: '>', value: 100 }],
+			},
+		],
+	},
+};
+
+describe('migrateCompositeQuery', () => {
+	it('converts legacy filters array to filter expression', () => {
+		const migrated = migrateCompositeQuery(legacyLogsQuery);
+
+		const { filter } = migrated.builder.queryData[0];
+		expect(filter?.expression).toContain('service.name');
+		expect(filter?.expression).toContain('frontend');
+	});
+
+	it('converts legacy having array to having expression', () => {
+		const migrated = migrateCompositeQuery(legacyLogsQuery);
+
+		expect(migrated.builder.queryData[0].having).toStrictEqual({
+			expression: 'count() > 100',
+		});
+	});
+
+	it('converts legacy aggregateOperator to aggregations', () => {
+		const migrated = migrateCompositeQuery(legacyLogsQuery);
+
+		expect(migrated.builder.queryData[0].aggregations).toStrictEqual([
+			{ expression: 'count()' },
+		]);
+	});
+
+	it('keeps existing aggregations and filter expression untouched', () => {
+		const newFormatQuery: Query = {
+			...initialQueriesMap.logs,
+			builder: {
+				...initialQueriesMap.logs.builder,
+				queryData: [
+					{
+						...initialQueriesMap.logs.builder.queryData[0],
+						filter: { expression: "severity_text = 'ERROR'" },
+					},
+				],
+			},
+		};
+
+		const migrated = migrateCompositeQuery(newFormatQuery);
+
+		expect(migrated.builder.queryData[0].aggregations).toStrictEqual(
+			newFormatQuery.builder.queryData[0].aggregations,
+		);
+		expect(migrated.builder.queryData[0].filter?.expression).toBe(
+			"severity_text = 'ERROR'",
+		);
+	});
+
+	it('returns the query as is when builder queryData is missing', () => {
+		const queryWithoutBuilder = {
+			queryType: EQueryType.PROM,
+		} as unknown as Query;
+
+		expect(migrateCompositeQuery(queryWithoutBuilder)).toBe(queryWithoutBuilder);
+	});
+});
+
+describe('parseCompositeQueryParam / serializeCompositeQueryParam', () => {
+	it('round-trips a composite query through serialize and parse', () => {
+		const query: Query = {
+			...initialQueriesMap.logs,
+			builder: {
+				...initialQueriesMap.logs.builder,
+				queryData: [
+					{
+						...initialQueriesMap.logs.builder.queryData[0],
+						filter: { expression: "key1 = 'a+b' AND key2 = 'c d'" },
+					},
+				],
+			},
+		};
+
+		const parsed = parseCompositeQueryParam(serializeCompositeQueryParam(query));
+
+		expect(parsed?.id).toBe(query.id);
+		expect(parsed?.queryType).toBe(query.queryType);
+		expect(parsed?.builder.queryData[0].filter?.expression).toBe(
+			"key1 = 'a+b' AND key2 = 'c d'",
+		);
+	});
+
+	it('treats literal + characters as spaces (legacy URL encoding)', () => {
+		const serialized = serializeCompositeQueryParam(initialQueriesMap.logs);
+		const legacyEncoded = serialized.replace(/%20/g, '+');
+
+		const parsed = parseCompositeQueryParam(legacyEncoded);
+
+		expect(parsed?.id).toBe(initialQueriesMap.logs.id);
+	});
+
+	it('returns null for missing or unparseable values', () => {
+		expect(parseCompositeQueryParam(null)).toBeNull();
+		expect(parseCompositeQueryParam('')).toBeNull();
+		expect(parseCompositeQueryParam('not-a-json')).toBeNull();
+	});
+});
+
+describe('normalizeCompositeQuery', () => {
+	it('fills defaults for an empty partial query', () => {
+		const normalized = normalizeCompositeQuery({});
+
+		expect(normalized.queryType).toBe(EQueryType.QUERY_BUILDER);
+		expect(normalized.builder).toBe(initialQueryState.builder);
+		expect(normalized.promql).toBe(initialQueryState.promql);
+		expect(normalized.clickhouse_sql).toBe(initialQueryState.clickhouse_sql);
+		expect(normalized.unit).toBe(initialQueryState.unit);
+	});
+
+	it('falls back to QUERY_BUILDER for an invalid queryType', () => {
+		const normalized = normalizeCompositeQuery({
+			queryType: 'bogus' as unknown as EQueryType,
+		});
+
+		expect(normalized.queryType).toBe(EQueryType.QUERY_BUILDER);
+	});
+
+	it('falls back to defaults for empty builder, promql and clickhouse queries', () => {
+		const normalized = normalizeCompositeQuery({
+			builder: { queryData: [], queryFormulas: [], queryTraceOperator: [] },
+			promql: [],
+			clickhouse_sql: [],
+		});
+
+		expect(normalized.builder).toBe(initialQueryState.builder);
+		expect(normalized.promql).toBe(initialQueryState.promql);
+		expect(normalized.clickhouse_sql).toBe(initialQueryState.clickhouse_sql);
+	});
+
+	it('preserves provided values and stamps a fresh id on every call', () => {
+		const query = initialQueriesMap.logs;
+
+		const first = normalizeCompositeQuery(query);
+		const second = normalizeCompositeQuery(query);
+
+		expect(first.queryType).toBe(query.queryType);
+		expect(first.builder).toBe(query.builder);
+		expect(first.id).not.toBe(query.id);
+		expect(first.id).not.toBe(second.id);
+	});
+});

frontend/src/lib/compositeQuery/compositeQuerySerialization.ts

@@ -0,0 +1,35 @@
+import { Query } from 'types/api/queryBuilder/queryBuilderData';
+
+import { migrateCompositeQuery } from './migrateCompositeQuery';
+
+/**
+ * Parses a raw `compositeQuery` URL param value into a Query, migrating
+ * old-format queries to the new format. Returns null when the value is
+ * missing or unparseable.
+ */
+export const parseCompositeQueryParam = (
+	compositeQuery: string | null,
+): Query | null => {
+	if (!compositeQuery) {
+		return null;
+	}
+
+	try {
+		// MDN reference - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/decodeURIComponent#decoding_query_parameters_from_a_url
+		// MDN reference to support + characters using encoding - https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams#preserving_plus_signs add later
+		const parsedCompositeQuery: Query = JSON.parse(
+			decodeURIComponent(compositeQuery.replace(/\+/g, ' ')),
+		);
+
+		return migrateCompositeQuery(parsedCompositeQuery);
+	} catch (e) {
+		return null;
+	}
+};
+
+/**
+ * Serializes a Query into the URL-safe string stored in the
+ * `compositeQuery` URL param. Inverse of parseCompositeQueryParam.
+ */
+export const serializeCompositeQueryParam = (query: Query): string =>
+	encodeURIComponent(JSON.stringify(query));

frontend/src/lib/compositeQuery/migrateCompositeQuery.ts

@@ -0,0 +1,60 @@
+import {
+	convertAggregationToExpression,
+	convertFiltersToExpressionWithExistingQuery,
+	convertHavingToExpression,
+} from 'components/QueryBuilderV2/utils';
+import { BaseAutocompleteData } from 'types/api/queryBuilder/queryAutocompleteResponse';
+import { IBuilderQuery, Query } from 'types/api/queryBuilder/queryBuilderData';
+
+/**
+ * Converts a composite query from the old format to the new format for each
+ * query in builder.queryData:
+ * - `filters` array -> `filter.expression`
+ * - `having` array -> `having` expression object
+ * - `aggregateOperator` -> `aggregations` object
+ *
+ * Queries already in the new format pass through unchanged.
+ */
+export const migrateCompositeQuery = (query: Query): Query => {
+	if (!query?.builder?.queryData) {
+		return query;
+	}
+
+	return {
+		...query,
+		builder: {
+			...query.builder,
+			queryData: query.builder.queryData.map((queryData) => {
+				const existingExpression = queryData.filter?.expression || '';
+				const convertedQuery = { ...queryData };
+
+				const convertedFilter = convertFiltersToExpressionWithExistingQuery(
+					queryData.filters || { items: [], op: 'AND' },
+					existingExpression,
+				);
+				convertedQuery.filter = convertedFilter.filter;
+				convertedQuery.filters = convertedFilter.filters;
+
+				// Convert having if needed
+				if (Array.isArray(queryData.having)) {
+					convertedQuery.having = convertHavingToExpression(queryData.having);
+				}
+
+				// Convert aggregation if needed
+				if (!queryData.aggregations && queryData.aggregateOperator) {
+					convertedQuery.aggregations = convertAggregationToExpression({
+						aggregateOperator: queryData.aggregateOperator,
+						aggregateAttribute: queryData.aggregateAttribute as BaseAutocompleteData,
+						dataSource: queryData.dataSource,
+						timeAggregation: queryData.timeAggregation,
+						spaceAggregation: queryData.spaceAggregation,
+						reduceTo: queryData.reduceTo,
+						temporality: queryData.temporality,
+					}) as IBuilderQuery['aggregations']; // Narrow the mixed aggregation array to the union of homogeneous arrays
+				}
+
+				return convertedQuery;
+			}),
+		},
+	};
+};

frontend/src/lib/compositeQuery/normalizeCompositeQuery.ts

@@ -0,0 +1,40 @@
+import { initialQueryState } from 'constants/queryBuilder';
+import { Query } from 'types/api/queryBuilder/queryBuilderData';
+import { EQueryType } from 'types/common/dashboard';
+import { v4 as uuid } from 'uuid';
+
+/**
+ * Fills a partial composite query with defaults from initialQueryState and
+ * stamps a fresh id. This is the normalization applied before a query is
+ * committed (staged) — extracted from redirectWithQueryBuilderData.
+ */
+export const normalizeCompositeQuery = (query: Partial<Query>): Query => {
+	const queryType =
+		!query.queryType || !Object.values(EQueryType).includes(query.queryType)
+			? EQueryType.QUERY_BUILDER
+			: query.queryType;
+
+	const builder =
+		!query.builder || query.builder.queryData?.length === 0
+			? initialQueryState.builder
+			: query.builder;
+
+	const promql =
+		!query.promql || query.promql.length === 0
+			? initialQueryState.promql
+			: query.promql;
+
+	const clickhouseSql =
+		!query.clickhouse_sql || query.clickhouse_sql.length === 0
+			? initialQueryState.clickhouse_sql
+			: query.clickhouse_sql;
+
+	return {
+		queryType,
+		builder,
+		promql,
+		clickhouse_sql: clickhouseSql,
+		id: uuid(),
+		unit: query.unit || initialQueryState.unit,
+	};
+};

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardDescription/DashboardActions/DashboardActions.tsx

@@ -28,40 +28,43 @@ import { USER_ROLES } from 'types/roles';
 import ConfirmDeleteDialog from '../../components/ConfirmDeleteDialog/ConfirmDeleteDialog';
 import DashboardSettings from '../../DashboardSettings';
 import SettingsDrawer from '../SettingsDrawer';
-import styles from './DashboardActions.module.scss';
-import { useDashboardStore } from '../../store/useDashboardStore';
+import styles from '../DashboardDescription.module.scss';
 
 interface DashboardActionsProps {
-	title: string;
 	dashboard: DashboardtypesGettableDashboardV2DTO;
 	handle: FullScreenHandle;
 	isDashboardLocked: boolean;
+	editDashboard: boolean;
 	isAuthor: boolean;
+	addPanelPermission: boolean;
 	onAddPanel: () => void;
 	onLockToggle: () => void;
 	onOpenRename: () => void;
 }
 
 function DashboardActions({
-	title,
 	dashboard,
 	handle,
 	isDashboardLocked,
+	editDashboard,
 	isAuthor,
+	addPanelPermission,
 	onAddPanel,
 	onLockToggle,
 	onOpenRename,
 }: DashboardActionsProps): JSX.Element {
-	const canEdit = useDashboardStore((s) => s.isEditable);
 	const { user } = useAppContext();
 	const { t } = useTranslation(['dashboard', 'common']);
 
+	const id = dashboard.id ?? '';
+	const title = dashboard.spec?.display?.name ?? '';
+
 	const [isSettingsDrawerOpen, setIsSettingsDrawerOpen] =
 		useState<boolean>(false);
 
 	const [state, setCopy] = useCopyToClipboard();
 	const [isDeleteOpen, setIsDeleteOpen] = useState<boolean>(false);
-	const deleteDashboardMutation = useDeleteDashboard(dashboard.id);
+	const deleteDashboardMutation = useDeleteDashboard(id);
 
 	useEffect(() => {
 		if (state.error) {
@@ -100,7 +103,7 @@ function DashboardActions({
 
 	const menuItems = useMemo<MenuItem[]>(() => {
 		const editGroup: MenuItem[] = [];
-		if (canEdit) {
+		if (!isDashboardLocked && editDashboard) {
 			editGroup.push({
 				key: 'rename',
 				label: 'Rename',
@@ -156,6 +159,7 @@ function DashboardActions({
 			);
 	}, [
 		isDashboardLocked,
+		editDashboard,
 		isAuthor,
 		user.role,
 		dashboard.createdBy,
@@ -165,60 +169,58 @@ function DashboardActions({
 		exportJSON,
 		setCopy,
 		dashboardDataJSON,
-		canEdit,
 	]);
 
 	return (
-		<div className={styles.dashboardActionsContainer}>
+		<div className={styles.rightSection}>
 			<DateTimeSelectionV2 showAutoRefresh hideShareModal />
-			<div className={styles.dashboardActionsSecondary}>
-				<DropdownMenuSimple menu={{ items: menuItems }}>
+			<DropdownMenuSimple menu={{ items: menuItems }}>
+				<Button
+					variant="ghost"
+					color="secondary"
+					size="icon"
+					prefix={<Ellipsis size={14} />}
+					className={styles.icons}
+					testId="options"
+				/>
+			</DropdownMenuSimple>
+			{!isDashboardLocked && editDashboard && (
+				<>
 					<Button
 						variant="solid"
 						color="secondary"
-						size="icon"
-						prefix={<Ellipsis size="md" />}
-						testId="options"
-					/>
-				</DropdownMenuSimple>
-				{canEdit && (
-					<>
-						<Button
-							variant="solid"
-							color="secondary"
-							prefix={<Configure size="md" />}
-							testId="show-drawer"
-							onClick={(): void => setIsSettingsDrawerOpen(true)}
-							size="md"
-						>
-							Configure
-						</Button>
-						<SettingsDrawer
-							drawerTitle="Dashboard Configuration"
-							isOpen={isSettingsDrawerOpen}
-							onClose={(): void => setIsSettingsDrawerOpen(false)}
-						>
-							<DashboardSettings dashboard={dashboard} />
-						</SettingsDrawer>
-					</>
-				)}
-				{!isDashboardLocked && (
-					<Button
-						variant="solid"
-						color="primary"
-						onClick={onAddPanel}
-						prefix={<Plus size="md" />}
-						testId="add-panel-header"
+						prefix={<Configure size="md" />}
+						testId="show-drawer"
+						onClick={(): void => setIsSettingsDrawerOpen(true)}
 						size="md"
 					>
-						New Panel
+						Configure
 					</Button>
-				)}
-			</div>
+					<SettingsDrawer
+						drawerTitle="Dashboard Configuration"
+						isOpen={isSettingsDrawerOpen}
+						onClose={(): void => setIsSettingsDrawerOpen(false)}
+					>
+						<DashboardSettings dashboard={dashboard} />
+					</SettingsDrawer>
+				</>
+			)}
+			{!isDashboardLocked && addPanelPermission && (
+				<Button
+					variant="solid"
+					color="primary"
+					onClick={onAddPanel}
+					prefix={<Plus size="md" />}
+					testId="add-panel-header"
+					size="md"
+				>
+					New Panel
+				</Button>
+			)}
 			<ConfirmDeleteDialog
 				open={isDeleteOpen}
-				title={`Delete dashboard"?`}
-				description={`Are you sure you want to delete this dashboard - "${title}"? This action cannot be undone.`}
+				title={`Delete dashboard "${title}"?`}
+				description="This action cannot be undone."
 				isLoading={deleteDashboardMutation.isLoading}
 				onConfirm={handleConfirmDelete}
 				onClose={(): void => setIsDeleteOpen(false)}

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardDescription/DashboardDescription.module.scss

@@ -0,0 +1,210 @@
+.dashboardDescriptionContainer {
+	box-shadow: none;
+	border: none;
+	background: unset;
+	color: var(--l2-foreground);
+
+	:global(.ant-card-body) {
+		padding: 0px;
+	}
+
+	.dashboardDetails {
+		display: flex;
+		justify-content: space-between;
+		gap: 8px;
+		padding: 16px 16px 0px 16px;
+		align-items: flex-start;
+
+		.leftSection {
+			display: flex;
+			align-items: center;
+			gap: 8px;
+			width: 45%;
+			height: 40px;
+
+			.dashboardImg {
+				height: 16px;
+				width: 16px;
+			}
+
+			.dashboardTitle {
+				color: var(--l1-foreground);
+				font-family: Inter;
+				font-size: 16px;
+				font-style: normal;
+				font-weight: 500;
+				line-height: 24px; /* 150% */
+				letter-spacing: -0.08px;
+				max-width: 80%;
+
+				display: -webkit-box;
+				-webkit-line-clamp: 1;
+				-webkit-box-orient: vertical;
+				overflow: hidden;
+			}
+
+			.clickableTitle {
+				cursor: pointer;
+			}
+
+			.titleEdit {
+				display: flex;
+				align-items: center;
+				gap: 4px;
+				width: 100%;
+				min-width: 0;
+			}
+
+			.titleInput {
+				flex: 1;
+				min-width: 0;
+				max-width: 70%;
+			}
+
+			.titleEditActionButton {
+				--button-height: auto;
+				--button-padding: 4px;
+				flex-shrink: 0;
+			}
+
+			.titleSaveActionButton {
+				--button-border-color: var(--text-forest-700);
+				--button-outlined-foreground: var(--text-forest-700);
+			}
+
+			.publicDashboardIcon {
+				margin-right: 4px;
+			}
+		}
+
+		.rightSection {
+			display: flex;
+			width: 55%;
+			justify-content: flex-end;
+			flex-wrap: wrap;
+			align-items: center;
+			gap: 14px;
+			height: 40px;
+
+			.icons {
+				display: flex;
+				align-items: center;
+				width: 32px;
+				height: 34px;
+				padding: 6px;
+				justify-content: center;
+				border-radius: 2px;
+				border: 1px solid var(--l1-border);
+				background: var(--l3-background);
+				color: var(--l2-foreground);
+				font-family: Inter;
+				font-size: 12px;
+				font-style: normal;
+				font-weight: 500;
+				line-height: 10px; /* 83.333% */
+				letter-spacing: 0.12px;
+			}
+
+			.icons:hover {
+				background-color: unset;
+			}
+		}
+	}
+
+	.dashboardTags {
+		display: flex;
+		gap: 6px;
+		padding: 16px 16px 0px 16px;
+		flex-wrap: wrap;
+
+		.tag {
+			display: flex;
+			padding: 4px 8px;
+			justify-content: center;
+			align-items: center;
+			border-radius: 20px;
+			border: 1px solid color-mix(in srgb, var(--bg-sienna-500) 20%, transparent);
+			background: color-mix(in srgb, var(--bg-sienna-500) 10%, transparent);
+			color: var(--bg-sienna-400);
+			text-align: center;
+			font-family: Inter;
+			font-size: 14px;
+			font-style: normal;
+			font-weight: 500;
+			line-height: 20px; /* 142.857% */
+			letter-spacing: -0.07px;
+			margin-inline-end: 0px;
+		}
+	}
+
+	.dashboardDescriptionSection {
+		color: var(--l2-foreground);
+		font-family: Inter;
+		font-size: 14px;
+		font-style: normal;
+		font-weight: 400;
+		line-height: 22px; /* 157.143% */
+		letter-spacing: -0.07px;
+		padding: 20px 16px 0px 16px;
+	}
+}
+
+.dashboardSettings {
+	width: 191px;
+	height: 302px;
+	flex-shrink: 0;
+
+	:global(.ant-popover-inner) {
+		padding: 0px;
+		border-radius: 4px;
+		border: 1px solid var(--l1-border);
+		background: linear-gradient(
+			139deg,
+			color-mix(in srgb, var(--card) 80%, transparent) 0%,
+			color-mix(in srgb, var(--card) 90%, transparent) 98.68%
+		) !important;
+		box-shadow: 4px 10px 16px 2px rgba(0, 0, 0, 0.2);
+		backdrop-filter: blur(20px);
+	}
+
+	.menuContent {
+		display: flex;
+		flex-direction: column;
+
+		section {
+			display: flex;
+			flex-direction: column;
+			align-items: start;
+
+			button {
+				display: flex;
+				width: 100%;
+				height: unset;
+				padding: 8px;
+				align-items: center;
+				gap: 12px;
+				color: var(--l2-foreground);
+				font-family: Inter;
+				font-size: 13px;
+				font-style: normal;
+				font-weight: 400;
+				line-height: normal;
+				letter-spacing: 0.14px;
+				border-top: none;
+			}
+		}
+
+		.section1,
+		.section2 {
+			border-bottom: 1px solid var(--l1-border);
+		}
+
+		.deleteDashboard button {
+			color: var(--bg-cherry-400) !important;
+		}
+	}
+}
+
+.deleteModal :global(.ant-modal-confirm-body) {
+	align-items: center;
+}

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardDescription/DashboardMeta/DashboardMeta.tsx

@@ -0,0 +1,32 @@
+import { Badge } from '@signozhq/ui/badge';
+import { isEmpty } from 'lodash-es';
+
+import styles from '../DashboardDescription.module.scss';
+
+interface DashboardMetaProps {
+	tags: string[];
+	description: string;
+}
+
+function DashboardMeta({ tags, description }: DashboardMetaProps): JSX.Element {
+	return (
+		<>
+			{tags.length > 0 && (
+				<div className={styles.dashboardTags}>
+					{tags.map((tag) => (
+						<Badge key={tag} className={styles.tag}>
+							{tag}
+						</Badge>
+					))}
+				</div>
+			)}
+			{!isEmpty(description) && (
+				<section className={styles.dashboardDescriptionSection}>
+					{description}
+				</section>
+			)}
+		</>
+	);
+}
+
+export default DashboardMeta;

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardDescription/DashboardTitle/DashboardTitle.tsx

@@ -0,0 +1,116 @@
+import { KeyboardEvent } from 'react';
+import { Check, Globe, LockKeyhole, X } from '@signozhq/icons';
+import { Button } from '@signozhq/ui/button';
+import { Input } from '@signozhq/ui/input';
+import { TooltipSimple } from '@signozhq/ui/tooltip';
+import { Typography } from '@signozhq/ui/typography';
+import cx from 'classnames';
+
+import styles from '../DashboardDescription.module.scss';
+
+interface DashboardTitleProps {
+	title: string;
+	image: string;
+	isPublicDashboard: boolean;
+	isDashboardLocked: boolean;
+	isEditable: boolean;
+	isEditing: boolean;
+	draft: string;
+	onDraftChange: (value: string) => void;
+	onStartEdit: () => void;
+	onCommit: () => void;
+	onCancel: () => void;
+}
+
+function DashboardTitle({
+	title,
+	image,
+	isPublicDashboard,
+	isDashboardLocked,
+	isEditable,
+	isEditing,
+	draft,
+	onDraftChange,
+	onStartEdit,
+	onCommit,
+	onCancel,
+}: DashboardTitleProps): JSX.Element {
+	const canEdit = isEditable && !isDashboardLocked;
+
+	const onKeyDown = (event: KeyboardEvent<HTMLInputElement>): void => {
+		if (event.key === 'Enter') {
+			event.preventDefault();
+			onCommit();
+		} else if (event.key === 'Escape') {
+			onCancel();
+		}
+	};
+
+	return (
+		<div className={styles.leftSection}>
+			<img src={image} alt="dashboard-img" className={styles.dashboardImg} />
+			{isEditing ? (
+				<div className={styles.titleEdit}>
+					<Input
+						autoFocus
+						value={draft}
+						testId="dashboard-title-input"
+						maxLength={120}
+						className={styles.titleInput}
+						onChange={(e): void => onDraftChange(e.target.value)}
+						onKeyDown={onKeyDown}
+					/>
+					<Button
+						type="button"
+						variant="outlined"
+						size="icon"
+						className={cx(styles.titleEditActionButton, styles.titleSaveActionButton)}
+						aria-label="Save title"
+						testId="dashboard-title-save"
+						onClick={onCommit}
+					>
+						<Check size={14} />
+					</Button>
+					<Button
+						type="button"
+						variant="outlined"
+						color="destructive"
+						size="icon"
+						className={styles.titleEditActionButton}
+						aria-label="Cancel title edit"
+						testId="dashboard-title-cancel"
+						onClick={onCancel}
+					>
+						<X size={14} />
+					</Button>
+				</div>
+			) : (
+				<TooltipSimple title={title.length > 30 ? title : ''}>
+					<Typography.Text
+						className={cx(styles.dashboardTitle, {
+							[styles.clickableTitle]: canEdit,
+						})}
+						data-testid="dashboard-title"
+						onClick={canEdit ? onStartEdit : undefined}
+					>
+						{title}
+					</Typography.Text>
+				</TooltipSimple>
+			)}
+
+			{isPublicDashboard && (
+				<TooltipSimple title="This dashboard is publicly accessible">
+					<Globe size={14} className={styles.publicDashboardIcon} />
+				</TooltipSimple>
+			)}
+
+			{isDashboardLocked && (
+				<TooltipSimple title="This dashboard is locked">
+					<LockKeyhole size={14} />
+				</TooltipSimple>
+			)}
+		</div>
+	);
+}
+
+export default DashboardTitle;

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardDescription/index.tsx

@@ -1,5 +1,6 @@
 import { useCallback, useMemo } from 'react';
 import { FullScreenHandle } from 'react-full-screen';
+import { Card } from 'antd';
 import { toast } from '@signozhq/ui/sonner';
 import logEvent from 'api/common/logEvent';
 import {
@@ -12,31 +13,34 @@ import type {
 	DashboardtypesJSONPatchOperationDTO,
 } from 'api/generated/services/sigNoz.schemas';
 import { Base64Icons } from 'container/DashboardContainer/DashboardSettings/General/utils';
+import useComponentPermission from 'hooks/useComponentPermission';
 import { useAppContext } from 'providers/App/App';
 import { usePanelTypeSelectionModalStore } from 'providers/Dashboard/helpers/panelTypeSelectionModalHelper';
 import { useErrorModal } from 'providers/ErrorModalProvider';
 import APIError from 'types/api/error';
 
+import DashboardHeader from '../components/DashboardHeader/DashboardHeader';
 import DashboardActions from './DashboardActions/DashboardActions';
-import DashboardInfo from './DashboardInfo/DashboardInfo';
-import { useEditableTitle } from './DashboardInfo/useEditableTitle';
+import DashboardMeta from './DashboardMeta/DashboardMeta';
+import DashboardTitle from './DashboardTitle/DashboardTitle';
+import { useEditableTitle } from './DashboardTitle/useEditableTitle';
 
-import styles from './DashboardPageToolbar.module.scss';
+import styles from './DashboardDescription.module.scss';
 
-interface DashboardPageToolbarProps {
+interface DashboardDescriptionProps {
 	dashboard: DashboardtypesGettableDashboardV2DTO;
 	handle: FullScreenHandle;
 	refetch: () => void;
 }
 
-function DashboardPageToolbar(props: DashboardPageToolbarProps): JSX.Element {
+function DashboardDescription(props: DashboardDescriptionProps): JSX.Element {
 	const { dashboard, handle, refetch } = props;
 
 	const id = dashboard.id;
 	const isDashboardLocked = !!dashboard.locked;
 
-	const title = dashboard.spec.display.name;
-	const description = dashboard.spec.display.description ?? '';
+	const title = dashboard.spec?.display?.name ?? '';
+	const description = dashboard.spec?.display?.description ?? '';
 	const image = dashboard.image || Base64Icons[0];
 	const tags = useMemo(
 		() =>
@@ -47,6 +51,7 @@ function DashboardPageToolbar(props: DashboardPageToolbarProps): JSX.Element {
 	);
 
 	const { user } = useAppContext();
+	const [editDashboard] = useComponentPermission(['edit_dashboard'], user.role);
 	const { showErrorModal } = useErrorModal();
 	const setIsPanelTypeSelectionModalOpen = usePanelTypeSelectionModalStore(
 		(s) => s.setIsPanelTypeSelectionModalOpen,
@@ -54,6 +59,9 @@ function DashboardPageToolbar(props: DashboardPageToolbarProps): JSX.Element {
 
 	const isAuthor =
 		!!user?.email && !!dashboard.createdBy && dashboard.createdBy === user.email;
+	const addPanelPermission = !isDashboardLocked;
+	// V2 public dashboard wiring lives separately; treat as not-public for chrome.
+	const isPublicDashboard = false;
 
 	const handleLockDashboardToggle = useCallback(async (): Promise<void> => {
 		if (!id) {
@@ -102,7 +110,7 @@ function DashboardPageToolbar(props: DashboardPageToolbarProps): JSX.Element {
 			onSave: onNameSave,
 		});
 
-	const onAddPanel = useCallback((): void => {
+	const onEmptyWidgetHandler = useCallback((): void => {
 		void logEvent('Dashboard Detail V2: Add new panel clicked', {
 			dashboardId: id,
 		});
@@ -110,15 +118,15 @@ function DashboardPageToolbar(props: DashboardPageToolbarProps): JSX.Element {
 	}, [id, setIsPanelTypeSelectionModalOpen]);
 
 	return (
-		<section className={styles.dashboardPageToolbarContainer}>
-			<div className={styles.dashboardInfoWithActions}>
-				<DashboardInfo
+		<Card className={styles.dashboardDescriptionContainer}>
+			<DashboardHeader title={title} image={image} />
+			<section className={styles.dashboardDetails}>
+				<DashboardTitle
 					title={title}
 					image={image}
-					tags={tags}
-					description={description}
-					isPublicDashboard={false}
+					isPublicDashboard={isPublicDashboard}
 					isDashboardLocked={isDashboardLocked}
+					isEditable={editDashboard}
 					isEditing={isEditing}
 					draft={draft}
 					onDraftChange={setDraft}
@@ -127,18 +135,20 @@ function DashboardPageToolbar(props: DashboardPageToolbarProps): JSX.Element {
 					onCancel={cancel}
 				/>
 				<DashboardActions
-					title={title}
 					dashboard={dashboard}
 					handle={handle}
 					isDashboardLocked={isDashboardLocked}
+					editDashboard={editDashboard}
 					isAuthor={isAuthor}
-					onAddPanel={onAddPanel}
+					addPanelPermission={addPanelPermission}
+					onAddPanel={onEmptyWidgetHandler}
 					onLockToggle={handleLockDashboardToggle}
 					onOpenRename={startEdit}
 				/>
-			</div>
-		</section>
+			</section>
+			<DashboardMeta tags={tags} description={description} />
+		</Card>
 	);
 }
 
-export default DashboardPageToolbar;
+export default DashboardDescription;

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardPageToolbar/DashboardActions/DashboardActions.module.scss

@@ -1,11 +0,0 @@
-.dashboardActionsContainer {
-	display: flex;
-	flex-wrap: wrap;
-	justify-content: flex-end;
-	gap: 12px;
-}
-
-.dashboardActionsSecondary {
-	display: flex;
-	gap: 12px;
-}

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardPageToolbar/DashboardInfo/DashboardInfo.module.scss

@@ -1,61 +0,0 @@
-.dashboardInfo {
-	display: flex;
-	flex-direction: column;
-	gap: 8px;
-	width: 40%;
-
-	@media (min-width: 1280px) {
-		width: 30%;
-	}
-}
-
-.dashboardTitleContainer {
-	display: flex;
-	align-items: center;
-	gap: 8px;
-	width: 100%;
-}
-
-.dashboardImage {
-	flex-shrink: 0;
-}
-
-.dashboardTitle {
-	flex: 1;
-	min-width: 0;
-	max-width: fit-content;
-	color: var(--l1-foreground);
-	font-size: 18px;
-	font-weight: 500;
-
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-}
-
-.dashboardTitleHover {
-	cursor: text !important;
-}
-
-.dashboardTitleEditor {
-	display: flex;
-	align-items: center;
-	gap: 4px;
-	flex: 1;
-	min-width: 0;
-}
-
-.dashboardTitleInput {
-	flex: 1;
-	min-width: 0;
-}
-
-.dashboardTitleActionButton {
-	flex-shrink: 0;
-}
-
-.dashboardTags {
-	display: flex;
-	flex-wrap: wrap;
-	gap: 8px;
-}

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardPageToolbar/DashboardInfo/DashboardInfo.tsx

@@ -1,141 +0,0 @@
-import { KeyboardEvent } from 'react';
-import { Check, Globe, LockKeyhole, X } from '@signozhq/icons';
-import { Badge } from '@signozhq/ui/badge';
-import { Button } from '@signozhq/ui/button';
-import { Input } from '@signozhq/ui/input';
-import { TooltipSimple } from '@signozhq/ui/tooltip';
-import { Typography } from '@signozhq/ui/typography';
-import cx from 'classnames';
-import { isEmpty } from 'lodash-es';
-
-import styles from './DashboardInfo.module.scss';
-import { useDashboardStore } from '../../store/useDashboardStore';
-
-interface DashboardInfoProps {
-	title: string;
-	image: string;
-	tags: string[];
-	description: string;
-	isPublicDashboard: boolean;
-	isDashboardLocked: boolean;
-	isEditing: boolean;
-	draft: string;
-	onDraftChange: (value: string) => void;
-	onStartEdit: () => void;
-	onCommit: () => void;
-	onCancel: () => void;
-}
-
-function DashboardInfo({
-	title,
-	image,
-	tags,
-	description,
-	isPublicDashboard,
-	isDashboardLocked,
-	isEditing,
-	draft,
-	onDraftChange,
-	onStartEdit,
-	onCommit,
-	onCancel,
-}: DashboardInfoProps): JSX.Element {
-	const canEdit = useDashboardStore((s) => s.isEditable);
-
-	const hasTags = tags.length > 0;
-	const hasDescription = !isEmpty(description);
-
-	const onKeyDown = (event: KeyboardEvent<HTMLInputElement>): void => {
-		if (event.key === 'Enter') {
-			event.preventDefault();
-			onCommit();
-		} else if (event.key === 'Escape') {
-			onCancel();
-		}
-	};
-
-	return (
-		<div className={styles.dashboardInfo}>
-			<div className={styles.dashboardTitleContainer}>
-				<img src={image} alt={title} className={styles.dashboardImage} />
-				{isEditing ? (
-					<div className={styles.dashboardTitleEditor}>
-						<Input
-							autoFocus
-							value={draft}
-							testId="dashboard-title-input"
-							maxLength={120}
-							className={styles.dashboardTitleInput}
-							onChange={(e): void => onDraftChange(e.target.value)}
-							onKeyDown={onKeyDown}
-						/>
-						<Button
-							type="button"
-							variant="outlined"
-							color="primary"
-							size="icon"
-							className={styles.dashboardTitleActionButton}
-							aria-label="Save title"
-							testId="dashboard-title-save"
-							onClick={onCommit}
-						>
-							<Check size={14} />
-						</Button>
-						<Button
-							type="button"
-							variant="outlined"
-							color="secondary"
-							size="icon"
-							className={styles.dashboardTitleActionButton}
-							aria-label="Cancel title edit"
-							testId="dashboard-title-cancel"
-							onClick={onCancel}
-						>
-							<X size={14} />
-						</Button>
-					</div>
-				) : (
-					<TooltipSimple title={title}>
-						<Typography.Text
-							className={cx(styles.dashboardTitle, {
-								[styles.dashboardTitleHover]: canEdit,
-							})}
-							data-testid="dashboard-title"
-							onClick={canEdit ? onStartEdit : undefined}
-						>
-							{title}
-						</Typography.Text>
-					</TooltipSimple>
-				)}
-
-				{isPublicDashboard && (
-					<TooltipSimple title="This dashboard is publicly accessible">
-						<Globe size={14} />
-					</TooltipSimple>
-				)}
-
-				{isDashboardLocked && (
-					<TooltipSimple title="This dashboard is locked">
-						<LockKeyhole size={14} />
-					</TooltipSimple>
-				)}
-			</div>
-
-			{hasTags && (
-				<div className={styles.dashboardTags}>
-					{tags.map((tag) => (
-						<Badge key={tag} color="warning" variant="outline">
-							{tag}
-						</Badge>
-					))}
-				</div>
-			)}
-
-			{hasDescription && (
-				<Typography.Text color="muted">{description}</Typography.Text>
-			)}
-		</div>
-	);
-}
-
-export default DashboardInfo;

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardPageToolbar/DashboardPageToolbar.module.scss

@@ -1,20 +0,0 @@
-.dashboardPageToolbarContainer {
-	position: sticky;
-	top: 0;
-	z-index: 10;
-	color: var(--l2-foreground);
-	background-color: var(--l1-background);
-	padding: 16px;
-	box-shadow: 0 2px 2px 0px var(--l2-border);
-}
-
-.dashboardPageToolbarSubContainer {
-	width: 100%;
-}
-
-.dashboardInfoWithActions {
-	display: flex;
-	align-items: flex-start;
-	justify-content: space-between;
-	width: 100%;
-}

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/DashboardSettings.module.scss

@@ -1,8 +1,3 @@
-.tabsContent {
-	padding-left: 0 !important;
-	padding-right: 0 !important;
-}
-
 .placeholder {
 	padding: 24px;
 }
@@ -14,10 +9,3 @@
 	line-height: 1;
 	padding-top: 4px;
 }
-
-// shared "settings card" wrapper, used by the dashboard-info form and cross-panel sync
-.settingsCard {
-	padding: 24px 16px;
-	border-radius: 3px;
-	border: 1px solid var(--l2-border);
-}

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/General/CrossPanelSync/CrossPanelSync.tsx

@@ -1,5 +1,6 @@
+// eslint-disable-next-line signoz/no-antd-components -- TODO: migrate Radio to @signozhq/ui/radio-group
+import { Col, Radio, Tooltip } from 'antd';
 import { ExternalLink, SolidInfoCircle } from '@signozhq/icons';
-import { TooltipSimple } from '@signozhq/ui/tooltip';
 import { Typography } from '@signozhq/ui/typography';
 import logEvent from 'api/common/logEvent';
 import { Events } from 'constants/events';
@@ -12,9 +13,7 @@ import {
 import { getAbsoluteUrl } from 'utils/basePath';
 import cx from 'classnames';
 
-import SegmentedControl from '../SegmentedControl/SegmentedControl';
-import settingsStyles from '../../DashboardSettings.module.scss';
-import styles from './CrossPanelSync.module.scss';
+import styles from '../GeneralSettings.module.scss';
 
 interface CrossPanelSyncProps {
 	dashboardId: string;
@@ -27,15 +26,12 @@ function CrossPanelSync({ dashboardId }: CrossPanelSyncProps): JSX.Element {
 		useSyncTooltipFilterMode(dashboardId);
 
 	return (
-		<div className={cx(settingsStyles.settingsCard, styles.crossPanelSyncGroup)}>
+		<Col className={cx(styles.overviewSettings, styles.crossPanelSyncGroup)}>
 			<div className={styles.crossPanelSyncSectionHeader}>
-				<Typography.Text className={styles.crossPanelsSyncSectionTitle}>
+				<Typography.Text className={styles.crossPanelSyncSectionTitle}>
 					Cross-Panel Sync
 				</Typography.Text>
-
-				<TooltipSimple
-					side="top"
-					withPortal={false}
+				<Tooltip
 					title={
 						<div className={styles.crossPanelSyncTooltipContent}>
 							<strong className={styles.crossPanelSyncTooltipTitle}>
@@ -44,7 +40,7 @@ function CrossPanelSync({ dashboardId }: CrossPanelSyncProps): JSX.Element {
 							<span className={styles.crossPanelSyncTooltipDescription}>
 								Sync crosshair and tooltip across all the dashboard panels
 							</span>
-							<Typography.Link
+							<a
 								href="https://signoz.io/docs/dashboards/interactivity/#cross-panel-sync"
 								target="_blank"
 								rel="noopener noreferrer"
@@ -52,14 +48,15 @@ function CrossPanelSync({ dashboardId }: CrossPanelSyncProps): JSX.Element {
 							>
 								Learn more
 								<ExternalLink size={12} />
-							</Typography.Link>
+							</a>
 						</div>
 					}
+					placement="top"
+					mouseEnterDelay={0.5}
 				>
 					<SolidInfoCircle size="md" className={styles.crossPanelSyncInfoIcon} />
-				</TooltipSimple>
+				</Tooltip>
 			</div>
-
 			<div className={styles.crossPanelSyncRow}>
 				<div className={styles.crossPanelSyncInfo}>
 					<Typography.Text className={styles.crossPanelSyncTitle}>
@@ -69,18 +66,19 @@ function CrossPanelSync({ dashboardId }: CrossPanelSyncProps): JSX.Element {
 						Sync crosshair and tooltip across all the dashboard panels
 					</Typography.Text>
 				</div>
-				<SegmentedControl
-					testId="cursor-sync-mode"
+				<Radio.Group
 					value={cursorSyncMode}
-					onChange={setCursorSyncMode}
-					options={[
-						{ label: 'No Sync', value: DashboardCursorSync.None },
-						{ label: 'Crosshair', value: DashboardCursorSync.Crosshair },
-						{ label: 'Tooltip', value: DashboardCursorSync.Tooltip },
-					]}
-				/>
+					onChange={(e): void => {
+						setCursorSyncMode(e.target.value as DashboardCursorSync);
+					}}
+				>
+					<Radio.Button value={DashboardCursorSync.None}>No Sync</Radio.Button>
+					<Radio.Button value={DashboardCursorSync.Crosshair}>
+						Crosshair
+					</Radio.Button>
+					<Radio.Button value={DashboardCursorSync.Tooltip}>Tooltip</Radio.Button>
+				</Radio.Group>
 			</div>
-
 			{cursorSyncMode === DashboardCursorSync.Tooltip && (
 				<div className={styles.crossPanelSyncRow}>
 					<div className={styles.crossPanelSyncInfo}>
@@ -92,25 +90,24 @@ function CrossPanelSync({ dashboardId }: CrossPanelSyncProps): JSX.Element {
 							matching ones highlighted
 						</Typography.Text>
 					</div>
-
-					<SegmentedControl
-						testId="sync-tooltip-filter-mode"
+					<Radio.Group
 						value={syncTooltipFilterMode}
-						onChange={(value): void => {
+						onChange={(e): void => {
 							void logEvent(Events.TOOLTIP_SYNC_MODE_CHANGED, {
 								path: getAbsoluteUrl(window.location.pathname),
-								mode: value,
+								mode: e.target.value,
 							});
-							setSyncTooltipFilterMode(value);
+							setSyncTooltipFilterMode(e.target.value as SyncTooltipFilterMode);
 						}}
-						options={[
-							{ label: 'All', value: SyncTooltipFilterMode.All },
-							{ label: 'Filtered', value: SyncTooltipFilterMode.Filtered },
-						]}
-					/>
+					>
+						<Radio.Button value={SyncTooltipFilterMode.All}>All</Radio.Button>
+						<Radio.Button value={SyncTooltipFilterMode.Filtered}>
+							Filtered
+						</Radio.Button>
+					</Radio.Group>
 				</div>
 			)}
-		</div>
+		</Col>
 	);
 }
 

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/General/GeneralForm/GeneralForm.tsx

@@ -0,0 +1,85 @@
+import { Dispatch, SetStateAction } from 'react';
+// eslint-disable-next-line signoz/no-antd-components -- TODO: migrate Select/Input to @signozhq/ui
+import { Col, Input, Select, Space } from 'antd';
+import { Typography } from '@signozhq/ui/typography';
+import AddTags from 'container/DashboardContainer/DashboardSettings/General/AddBadges';
+
+import { Base64Icons } from '../utils';
+import styles from '../GeneralSettings.module.scss';
+
+const { Option } = Select;
+
+interface GeneralFormProps {
+	title: string;
+	description: string;
+	image: string;
+	tags: string[];
+	onTitleChange: (value: string) => void;
+	onDescriptionChange: (value: string) => void;
+	onImageChange: (value: string) => void;
+	onTagsChange: Dispatch<SetStateAction<string[]>>;
+}
+
+function GeneralForm({
+	title,
+	description,
+	image,
+	tags,
+	onTitleChange,
+	onDescriptionChange,
+	onImageChange,
+	onTagsChange,
+}: GeneralFormProps): JSX.Element {
+	return (
+		<Col className={styles.overviewSettings}>
+			<Space direction="vertical" className={styles.formSpace}>
+				<div>
+					<Typography className={styles.dashboardName}>Dashboard Name</Typography>
+					<section className={styles.nameIconInput}>
+						<Select
+							defaultActiveFirstOption
+							data-testid="dashboard-image"
+							suffixIcon={null}
+							rootClassName={styles.dashboardImageInput}
+							value={image}
+							onChange={onImageChange}
+						>
+							{Base64Icons.map((icon) => (
+								<Option value={icon} key={icon}>
+									<img
+										src={icon}
+										alt="dashboard-icon"
+										className={styles.listItemImage}
+									/>
+								</Option>
+							))}
+						</Select>
+						<Input
+							data-testid="dashboard-name"
+							className={styles.dashboardNameInput}
+							value={title}
+							onChange={(e): void => onTitleChange(e.target.value)}
+						/>
+					</section>
+				</div>
+
+				<div>
+					<Typography className={styles.dashboardName}>Description</Typography>
+					<Input.TextArea
+						data-testid="dashboard-desc"
+						rows={6}
+						value={description}
+						className={styles.descriptionTextArea}
+						onChange={(e): void => onDescriptionChange(e.target.value)}
+					/>
+				</div>
+				<div>
+					<Typography className={styles.dashboardName}>Tags</Typography>
+					<AddTags tags={tags} setTags={onTagsChange} />
+				</div>
+			</Space>
+		</Col>
+	);
+}
+
+export default GeneralForm;

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/General/GeneralSettings.module.scss

@@ -0,0 +1,238 @@
+.overviewContent {
+	display: flex;
+	flex-direction: column;
+	gap: 24px;
+	padding: 20px 16px;
+}
+
+.overviewSettings {
+	padding: 16px;
+	border-radius: 3px;
+	border: 1px solid var(--l1-border);
+}
+
+.crossPanelSyncGroup {
+	display: flex;
+	flex-direction: column;
+	gap: 16px;
+}
+
+.formSpace {
+	width: 100%;
+	display: flex;
+	flex-direction: column;
+	gap: 21px;
+}
+
+.crossPanelSyncSectionTitle {
+	color: var(--l1-foreground);
+	font-family: Inter;
+	font-size: 14px;
+	font-weight: 500;
+	line-height: 20px;
+}
+
+.crossPanelSyncSectionHeader {
+	display: flex;
+	align-items: center;
+	gap: 6px;
+	align-self: flex-start;
+}
+
+.crossPanelSyncInfoIcon {
+	cursor: help;
+	color: var(--l3-foreground);
+}
+
+.crossPanelSyncTooltipContent {
+	display: flex;
+	flex-direction: column;
+	gap: 8px;
+	max-width: 300px;
+}
+
+.crossPanelSyncTooltipTitle {
+	font-size: 14px;
+}
+
+.crossPanelSyncTooltipDescription {
+	font-size: 12px;
+	line-height: 1.5;
+}
+
+.crossPanelSyncTooltipDocLink {
+	display: flex;
+	align-items: center;
+	gap: 4px;
+	color: var(--primary-background);
+	font-size: 12px;
+	margin-top: 4px;
+}
+
+.crossPanelSyncRow {
+	display: flex;
+	flex-direction: row;
+	justify-content: space-between;
+	align-items: center;
+	gap: 16px;
+
+	& + & {
+		padding-top: 16px;
+		border-top: 1px solid var(--l1-border);
+	}
+}
+
+.crossPanelSyncInfo {
+	display: flex;
+	flex-direction: column;
+	gap: 4px;
+}
+
+.crossPanelSyncTitle {
+	color: var(--l2-foreground);
+	font-family: Inter;
+	font-size: 14px;
+	font-weight: 400;
+	line-height: 20px;
+}
+
+.crossPanelSyncDescription {
+	color: var(--l3-foreground);
+	font-family: Inter;
+	font-size: 13px;
+	font-weight: 400;
+	line-height: 20px;
+}
+
+.nameIconInput {
+	display: flex;
+}
+
+.dashboardImageInput {
+	:global(.ant-select-selector) {
+		display: flex;
+		width: 32px;
+		height: 32px;
+		padding: 6px;
+		justify-content: center;
+		align-items: center;
+		border-radius: 2px 0px 0px 2px;
+		border: 1px solid var(--l1-border) !important;
+		background: var(--l3-background) !important;
+
+		:global(.ant-select-selection-item) {
+			display: flex;
+			align-items: center;
+		}
+	}
+
+	&:global(.ant-select-dropdown) {
+		padding: 0px !important;
+	}
+
+	:global(.ant-select-item) {
+		padding: 0px;
+		align-items: center;
+		justify-content: center;
+
+		:global(.ant-select-item-option-content) {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+		}
+	}
+}
+
+.listItemImage {
+	height: 16px;
+	width: 16px;
+}
+
+.dashboardNameInput {
+	border-radius: 0px 2px 2px 0px;
+	border: 1px solid var(--l1-border);
+	background: var(--l3-background);
+}
+
+.dashboardName {
+	color: var(--l2-foreground);
+	font-family: Inter;
+	font-size: 14px;
+	font-style: normal;
+	font-weight: 400;
+	line-height: 20px;
+	margin-bottom: 0.5rem;
+}
+
+.descriptionTextArea {
+	padding: 6px 6px 6px 8px;
+	border-radius: 2px;
+	border: 1px solid var(--l1-border);
+	background: var(--l3-background);
+}
+
+.overviewSettingsFooter {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+	width: -webkit-fill-available;
+	padding: 12px 16px 12px 0px;
+	position: fixed;
+	bottom: 0;
+	height: 32px;
+	border-top: 1px solid var(--l1-border);
+	background: var(--l2-background);
+}
+
+.unsaved {
+	display: flex;
+	align-items: center;
+	gap: 8px;
+}
+
+.unsavedDot {
+	width: 6px;
+	height: 6px;
+	border-radius: 50px;
+	background: var(--primary-background);
+	box-shadow: 0px 0px 6px 0px
+		color-mix(in srgb, var(--primary-background) 40%, transparent);
+}
+
+.unsavedChanges {
+	color: var(--bg-robin-400);
+	font-family: Inter;
+	font-size: 14px;
+	font-style: normal;
+	font-weight: 400;
+	line-height: 24px;
+	letter-spacing: -0.07px;
+}
+
+.footerActionBtns {
+	display: flex;
+	gap: 8px;
+}
+
+.discardBtn {
+	display: flex;
+	align-items: center;
+	color: var(--l1-foreground);
+	font-family: Inter;
+	font-size: 12px;
+	font-style: normal;
+	font-weight: 500;
+	line-height: 24px;
+}
+
+.saveBtn {
+	display: flex;
+	align-items: center;
+	margin: 0px !important;
+	color: var(--l1-foreground);
+	font-family: Inter;
+	font-size: 12px;
+	font-style: normal;
+	font-weight: 500;
+	line-height: 24px;
+}

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/General/UnsavedChangesFooter/UnsavedChangesFooter.tsx

@@ -3,7 +3,7 @@ import { Button } from '@signozhq/ui/button';
 import { Check, X } from '@signozhq/icons';
 import { Typography } from '@signozhq/ui/typography';
 
-import styles from './UnsavedChangesFooter.module.scss';
+import styles from '../GeneralSettings.module.scss';
 
 interface UnsavedChangesFooterProps {
 	count: number;
@@ -29,13 +29,13 @@ function UnsavedChangesFooter({
 					{count > 1 && 's'}
 				</Typography.Text>
 			</div>
-			<div className={styles.footerActionButtons}>
+			<div className={styles.footerActionBtns}>
 				<Button
 					variant="ghost"
-					color="secondary"
 					disabled={isSaving}
 					prefix={<X size={14} />}
 					onClick={onDiscard}
+					className={styles.discardBtn}
 				>
 					Discard
 				</Button>
@@ -47,6 +47,7 @@ function UnsavedChangesFooter({
 					prefix={<Check size={14} />}
 					testId="save-dashboard-config"
 					onClick={onSave}
+					className={styles.saveBtn}
 				>
 					{t('save')}
 				</Button>

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/General/index.tsx

@@ -11,22 +11,22 @@ import APIError from 'types/api/error';
 
 import { useDashboardStore } from '../../store/useDashboardStore';
 import CrossPanelSync from './CrossPanelSync/CrossPanelSync';
-import DashboardInfoForm from './DashboardInfoForm/DashboardInfoForm';
+import GeneralForm from './GeneralForm/GeneralForm';
 import UnsavedChangesFooter from './UnsavedChangesFooter/UnsavedChangesFooter';
 import { Base64Icons, stringsToTags, tagsToStrings } from './utils';
-import styles from './Overview.module.scss';
+import styles from './GeneralSettings.module.scss';
 
-interface OverviewProps {
+interface GeneralSettingsProps {
 	dashboard: DashboardtypesGettableDashboardV2DTO;
 }
 
-function Overview({ dashboard }: OverviewProps): JSX.Element {
+function GeneralSettings({ dashboard }: GeneralSettingsProps): JSX.Element {
 	const id = dashboard.id;
 
 	const refetch = useDashboardStore((s) => s.refetch);
 
-	const title = dashboard.spec.display.name;
-	const description = dashboard.spec.display.description ?? '';
+	const title = dashboard.spec?.display?.name ?? '';
+	const description = dashboard.spec?.display?.description ?? '';
 	const image = dashboard.image || Base64Icons[0];
 	const tagsAsStrings = useMemo(
 		() => tagsToStrings(dashboard.tags ?? []),
@@ -64,7 +64,7 @@ function Overview({ dashboard }: OverviewProps): JSX.Element {
 			value,
 		});
 
-		if (updatedTitle !== title && updatedTitle !== '') {
+		if (updatedTitle !== title) {
 			ops.push(replace('/spec/display/name', updatedTitle));
 		}
 		if (updatedDescription !== description) {
@@ -89,6 +89,9 @@ function Overview({ dashboard }: OverviewProps): JSX.Element {
 	]);
 
 	const onSaveHandler = useCallback(async (): Promise<void> => {
+		if (!id) {
+			return;
+		}
 		const ops = buildPatch();
 		if (ops.length === 0) {
 			return;
@@ -107,7 +110,7 @@ function Overview({ dashboard }: OverviewProps): JSX.Element {
 	}, [id, buildPatch, refetch, showErrorModal]);
 
 	useEffect(() => {
-		let numberOfUnsavedChanges = 0;
+		let n = 0;
 		const initialValues = [title, description, tagsAsStrings, image];
 		const updatedValues = [
 			updatedTitle,
@@ -117,10 +120,10 @@ function Overview({ dashboard }: OverviewProps): JSX.Element {
 		];
 		initialValues.forEach((val, index) => {
 			if (!isEqual(val, updatedValues[index])) {
-				numberOfUnsavedChanges += 1;
+				n += 1;
 			}
 		});
-		setNumberOfUnsavedChanges(numberOfUnsavedChanges);
+		setNumberOfUnsavedChanges(n);
 	}, [
 		description,
 		image,
@@ -141,7 +144,7 @@ function Overview({ dashboard }: OverviewProps): JSX.Element {
 
 	return (
 		<div className={styles.overviewContent}>
-			<DashboardInfoForm
+			<GeneralForm
 				title={updatedTitle}
 				description={updatedDescription}
 				image={updatedImage}
@@ -164,4 +167,4 @@ function Overview({ dashboard }: OverviewProps): JSX.Element {
 	);
 }
 
-export default Overview;
+export default GeneralSettings;

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/Overview/CrossPanelSync/CrossPanelSync.module.scss

@@ -1,86 +0,0 @@
-.crossPanelSyncGroup {
-	display: flex;
-	flex-direction: column;
-	gap: 20px;
-}
-
-.crossPanelSyncSectionHeader {
-	display: flex;
-	align-items: center;
-	gap: 6px;
-}
-
-.crossPanelsSyncSectionTitle {
-	color: var(--l1-foreground);
-	font-size: 14px;
-	font-weight: 500;
-}
-
-.crossPanelSyncInfoIcon {
-	cursor: help;
-}
-
-.crossPanelSyncTooltipContent {
-	display: flex;
-	flex-direction: column;
-	gap: 8px;
-	padding: 8px;
-	max-width: 200px;
-}
-
-.crossPanelSyncTooltipTitle {
-	font-size: 14px;
-}
-
-.crossPanelSyncTooltipDescription {
-	font-size: 12px;
-}
-
-.crossPanelSyncTooltipDocLink {
-	color: var(--primary-background);
-	font-size: 12px;
-	margin-top: 16px;
-	vertical-align: middle;
-
-	// typography override
-	--typography-text-display: inline-flex;
-	align-items: center;
-	gap: 5px;
-}
-
-.crossPanelSyncRow {
-	display: flex;
-	flex-wrap: wrap;
-	justify-content: space-between;
-	align-items: center;
-	gap: 16px;
-
-	& + & {
-		padding-top: 16px;
-		border-top: 1px dashed var(--l2-border);
-	}
-}
-
-.crossPanelSyncInfo {
-	display: flex;
-	flex: 1 1 80px;
-	min-width: 0;
-	flex-direction: column;
-	gap: 4px;
-}
-
-.crossPanelSyncTitle {
-	color: var(--l2-foreground);
-	font-family: Inter;
-	font-size: 14px;
-	font-weight: 400;
-	line-height: 20px;
-}
-
-.crossPanelSyncDescription {
-	color: var(--l3-foreground);
-	font-family: Inter;
-	font-size: 13px;
-	font-weight: 400;
-	line-height: 20px;
-}

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/Overview/DashboardInfoForm/DashboardInfoForm.module.scss

@@ -1,80 +0,0 @@
-.formSpace {
-	display: flex;
-	flex-direction: column;
-	gap: 20px;
-}
-
-.infoItemContainer {
-	display: flex;
-	flex-direction: column;
-	gap: 4px;
-}
-
-.infoTitle {
-	color: var(--l2-foreground);
-	font-family: Inter;
-	font-size: 14px;
-}
-
-.nameIconInput {
-	display: flex;
-	gap: 4px;
-
-	[data-radix-popper-content-wrapper] {
-		z-index: 1100 !important;
-	}
-}
-
-.dashboardImageInput {
-	display: flex;
-	width: 32px;
-	min-width: 32px;
-	height: 32px;
-	padding: 6px;
-	justify-content: center;
-	align-items: center;
-	border-radius: 2px 0px 0px 2px;
-	background: var(--l3-background);
-
-	// icon-only trigger: drop the dropdown chevron, keep just the selected icon
-	svg {
-		display: none;
-	}
-}
-
-.dashboardImageOptions {
-	min-width: min-content;
-}
-
-.dashboardImageSelectItem {
-	width: min-content;
-
-	span {
-		vertical-align: middle;
-	}
-}
-
-.listItemImage {
-	height: 16px;
-	width: 16px;
-}
-
-.dashboardNameInput {
-	border-radius: 0px 2px 2px 0px;
-	border: 1px solid var(--l2-border);
-}
-
-.descriptionTextArea {
-	border-radius: 2px;
-	border: 1px solid var(--l2-border);
-}
-
-// the V1 tags input ships borderless; give the field a visible box to match
-.tagsField {
-	display: flex;
-	align-items: center;
-	padding: 6px 8px;
-	border-radius: 2px;
-	border: 1px solid var(--l2-border);
-	// background: var(--l3-background);
-}

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/Overview/DashboardInfoForm/DashboardInfoForm.tsx

@@ -1,101 +0,0 @@
-import { Dispatch, SetStateAction } from 'react';
-import { Input } from '@signozhq/ui/input';
-import {
-	Select,
-	SelectContent,
-	SelectItem,
-	SelectTrigger,
-} from '@signozhq/ui/select';
-import { Typography } from '@signozhq/ui/typography';
-// eslint-disable-next-line signoz/no-antd-components -- multiline TextArea has no @signozhq/ui equivalent yet
-import { Input as AntdInput } from 'antd';
-import AddTags from 'container/DashboardContainer/DashboardSettings/General/AddBadges';
-
-import { Base64Icons } from '../utils';
-import settingsStyles from '../../DashboardSettings.module.scss';
-import styles from './DashboardInfoForm.module.scss';
-
-interface DashboardInfoFormProps {
-	title: string;
-	description: string;
-	image: string;
-	tags: string[];
-	onTitleChange: (value: string) => void;
-	onDescriptionChange: (value: string) => void;
-	onImageChange: (value: string) => void;
-	onTagsChange: Dispatch<SetStateAction<string[]>>;
-}
-
-function DashboardInfoForm({
-	title,
-	description,
-	image,
-	tags,
-	onTitleChange,
-	onDescriptionChange,
-	onImageChange,
-	onTagsChange,
-}: DashboardInfoFormProps): JSX.Element {
-	return (
-		<div className={settingsStyles.settingsCard}>
-			<div className={styles.formSpace}>
-				<div className={styles.infoItemContainer}>
-					<Typography className={styles.infoTitle}>Dashboard Name</Typography>
-					<section className={styles.nameIconInput}>
-						<Select
-							value={image}
-							onChange={(value): void => onImageChange(value as string)}
-						>
-							<SelectTrigger className={styles.dashboardImageInput} />
-							<SelectContent
-								className={styles.dashboardImageOptions}
-								withPortal={false}
-							>
-								{Base64Icons.map((icon) => (
-									<SelectItem
-										key={icon}
-										value={icon}
-										className={styles.dashboardImageSelectItem}
-									>
-										<img
-											src={icon}
-											alt="dashboard-icon"
-											className={styles.listItemImage}
-										/>
-									</SelectItem>
-								))}
-							</SelectContent>
-						</Select>
-
-						<Input
-							testId="dashboard-name"
-							className={styles.dashboardNameInput}
-							value={title}
-							onChange={(e): void => onTitleChange(e.target.value)}
-						/>
-					</section>
-				</div>
-
-				<div className={styles.infoItemContainer}>
-					<Typography className={styles.infoTitle}>Description</Typography>
-					<AntdInput.TextArea
-						data-testid="dashboard-desc"
-						rows={6}
-						value={description}
-						className={styles.descriptionTextArea}
-						onChange={(e): void => onDescriptionChange(e.target.value)}
-					/>
-				</div>
-
-				<div className={styles.infoItemContainer}>
-					<Typography className={styles.infoTitle}>Tags</Typography>
-					<div className={styles.tagsField}>
-						<AddTags tags={tags} setTags={onTagsChange} />
-					</div>
-				</div>
-			</div>
-		</div>
-	);
-}
-
-export default DashboardInfoForm;

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/Overview/Overview.module.scss

@@ -1,5 +0,0 @@
-.overviewContent {
-	display: flex;
-	flex-direction: column;
-	gap: 24px;
-}

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/Overview/SegmentedControl/SegmentedControl.module.scss

@@ -1,61 +0,0 @@
-.segmented {
-	// override RadioGroup's default vertical grid; lay segments out connected
-	display: inline-flex;
-	grid-auto-flow: column;
-	gap: 0;
-	flex-shrink: 0;
-	border: 1px solid var(--l2-border);
-	border-radius: 2px;
-}
-
-.segment {
-	position: relative;
-	display: flex;
-	align-items: center;
-
-	&:not(:last-child) {
-		border-right: 1px solid var(--l2-border);
-	}
-
-	// the visible segment is the radio's label (htmlFor-wired, so clicks register)
-	label {
-		display: flex;
-		align-items: center;
-		min-height: 24px;
-		padding: 6px 14px;
-		font-family: Inter;
-		font-size: 13px;
-		line-height: 20px;
-		color: var(--l2-foreground);
-		white-space: nowrap;
-		cursor: pointer;
-		user-select: none;
-	}
-}
-
-// collapse the radio circle into a transparent full-cell click target
-.segmentInput {
-	position: absolute;
-	inset: 0;
-	width: 100%;
-	height: 100%;
-	margin: 0;
-	padding: 0;
-	border: none;
-	background: transparent;
-	cursor: pointer;
-
-	// hide the default radio dot/indicator
-	* {
-		display: none;
-	}
-}
-
-// highlight the selected segment as a raised, lighter pill (data-state is a
-// stable Radix attribute). --l3-background is the lightest layer, so lift it
-// further with a subtle foreground tint rather than going darker.
-.segmentInput[data-state='checked'] + label {
-	background: var(--l3-background);
-	color: var(--l1-foreground);
-	font-weight: 500;
-}

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/Overview/SegmentedControl/SegmentedControl.tsx

@@ -1,51 +0,0 @@
-import { RadioGroup, RadioGroupItem } from '@signozhq/ui/radio-group';
-
-import styles from './SegmentedControl.module.scss';
-
-export interface SegmentedControlOption<T extends string> {
-	label: string;
-	value: T;
-}
-
-interface SegmentedControlProps<T extends string> {
-	value: T;
-	options: SegmentedControlOption<T>[];
-	onChange: (value: T) => void;
-	testId?: string;
-}
-
-/**
- * Connected pill segmented control composed on top of @signozhq/ui RadioGroup:
- * the radio circle is collapsed into a transparent full-cell click target and
- * the label becomes the visible segment (highlighted via the radio's stable
- * `data-state="checked"`). Keeps radio semantics + keyboard nav.
- */
-function SegmentedControl<T extends string>({
-	value,
-	options,
-	onChange,
-	testId,
-}: SegmentedControlProps<T>): JSX.Element {
-	return (
-		<RadioGroup
-			className={styles.segmented}
-			value={value}
-			onChange={(next): void => onChange(next as T)}
-			testId={testId}
-		>
-			{options.map((option) => (
-				<RadioGroupItem
-					key={option.value}
-					value={option.value}
-					containerClassName={styles.segment}
-					className={styles.segmentInput}
-					testId={testId ? `${testId}-${option.value}` : undefined}
-				>
-					{option.label}
-				</RadioGroupItem>
-			))}
-		</RadioGroup>
-	);
-}
-
-export default SegmentedControl;

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/Overview/UnsavedChangesFooter/UnsavedChangesFooter.module.scss

@@ -1,39 +0,0 @@
-.overviewSettingsFooter {
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	width: -webkit-fill-available;
-	padding: 12px 16px 12px 16px;
-	position: fixed;
-	bottom: 0;
-	background: var(--l2-background);
-}
-
-.unsaved {
-	display: flex;
-	align-items: center;
-	gap: 8px;
-}
-
-.unsavedDot {
-	width: 6px;
-	height: 6px;
-	border-radius: 50px;
-	background: var(--primary-background);
-	box-shadow: 0px 0px 6px 0px
-		color-mix(in srgb, var(--primary-background) 40%, transparent);
-}
-
-.unsavedChanges {
-	color: var(--bg-robin-400);
-	font-family: Inter;
-	font-size: 14px;
-	font-weight: 400;
-	line-height: 24px;
-	letter-spacing: -0.07px;
-}
-
-.footerActionButtons {
-	display: flex;
-	gap: 8px;
-}

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/PublicDashboard/PublicDashboard.module.scss

@@ -1,106 +0,0 @@
-// settings card wrapper — mirrors the V1 public dashboard treatment
-.publicDashboardCard {
-	display: flex;
-	flex-direction: column;
-	gap: 8px;
-	padding: 16px;
-	border-radius: 3px;
-	border: 1px solid var(--l2-border);
-}
-
-.statusTitle {
-	margin-bottom: 16px;
-	color: var(--l1-foreground);
-	font-family: Inter;
-	font-size: 14px;
-	font-weight: 500;
-	line-height: 20px;
-}
-
-.checkbox {
-	margin-bottom: 8px;
-}
-
-.timeRangeSelectGroup {
-	display: flex;
-	flex-direction: column;
-	gap: 4px;
-	margin-bottom: 8px;
-}
-
-.timeRangeSelectLabel {
-	color: var(--l2-foreground);
-	font-family: Inter;
-	font-size: 12px;
-	font-weight: 500;
-	line-height: 18px;
-}
-
-.timeRangeSelect {
-	width: 200px;
-}
-
-.urlGroup {
-	display: flex;
-	flex-direction: column;
-	gap: 4px;
-}
-
-.urlLabel {
-	color: var(--l2-foreground);
-	font-family: Inter;
-	font-size: 12px;
-	font-weight: 500;
-	line-height: 18px;
-}
-
-.urlContainer {
-	display: flex;
-	align-items: center;
-	gap: 8px;
-	padding: 0 4px;
-	border-radius: 4px;
-	border: 1px solid var(--l1-border);
-	background: var(--l3-background);
-}
-
-.urlText {
-	flex: 1;
-	overflow: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-	color: var(--l2-foreground);
-	font-family: Inter;
-	font-size: 13px;
-	line-height: 32px;
-}
-
-.callout {
-	display: flex;
-	align-items: center;
-	gap: 8px;
-	margin-top: 12px;
-	padding: 12px 8px;
-	border-radius: 3px;
-	background: color-mix(in srgb, var(--primary-background) 10%, transparent);
-}
-
-.calloutIcon {
-	flex-shrink: 0;
-	color: var(--text-robin-300);
-}
-
-.calloutText {
-	color: var(--text-robin-300);
-	font-family: Inter;
-	font-size: 11px;
-	font-weight: 400;
-	line-height: 16px;
-}
-
-.actions {
-	display: flex;
-	justify-content: flex-end;
-	gap: 8px;
-	margin-top: 32px;
-}

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/PublicDashboard/PublicDashboardActions.tsx

@@ -1,71 +0,0 @@
-import { Globe, Trash } from '@signozhq/icons';
-import { Button } from '@signozhq/ui/button';
-
-import styles from './PublicDashboard.module.scss';
-
-interface PublicDashboardActionsProps {
-	isPublic: boolean;
-	disabled: boolean;
-	isPublishing: boolean;
-	isUpdating: boolean;
-	isUnpublishing: boolean;
-	onPublish: () => void;
-	onUpdate: () => void;
-	onUnpublish: () => void;
-}
-
-function PublicDashboardActions({
-	isPublic,
-	disabled,
-	isPublishing,
-	isUpdating,
-	isUnpublishing,
-	onPublish,
-	onUpdate,
-	onUnpublish,
-}: PublicDashboardActionsProps): JSX.Element {
-	return (
-		<div className={styles.actions}>
-			{isPublic ? (
-				<>
-					<Button
-						variant="outlined"
-						color="destructive"
-						disabled={disabled}
-						loading={isUnpublishing}
-						prefix={<Trash size={14} />}
-						testId="public-dashboard-unpublish"
-						onClick={onUnpublish}
-					>
-						Unpublish dashboard
-					</Button>
-					<Button
-						variant="solid"
-						color="primary"
-						disabled={disabled}
-						loading={isUpdating}
-						prefix={<Globe size={14} />}
-						testId="public-dashboard-update"
-						onClick={onUpdate}
-					>
-						Update published dashboard
-					</Button>
-				</>
-			) : (
-				<Button
-					variant="solid"
-					color="primary"
-					disabled={disabled}
-					loading={isPublishing}
-					prefix={<Globe size={14} />}
-					testId="public-dashboard-publish"
-					onClick={onPublish}
-				>
-					Publish dashboard
-				</Button>
-			)}
-		</div>
-	);
-}
-
-export default PublicDashboardActions;

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/PublicDashboard/PublicDashboardCallout.tsx

@@ -1,17 +0,0 @@
-import { Info } from '@signozhq/icons';
-import { Typography } from '@signozhq/ui/typography';
-
-import styles from './PublicDashboard.module.scss';
-
-function PublicDashboardCallout(): JSX.Element {
-	return (
-		<div className={styles.callout}>
-			<Info size={12} className={styles.calloutIcon} />
-			<Typography.Text className={styles.calloutText}>
-				Dashboard variables won&apos;t work in public dashboards
-			</Typography.Text>
-		</div>
-	);
-}
-
-export default PublicDashboardCallout;

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/PublicDashboard/PublicDashboardSettingsForm.tsx

@@ -1,54 +0,0 @@
-import { Checkbox } from '@signozhq/ui/checkbox';
-import { SelectSimple } from '@signozhq/ui/select';
-import { Typography } from '@signozhq/ui/typography';
-
-import { TIME_RANGE_PRESETS_OPTIONS } from './constants';
-import styles from './PublicDashboard.module.scss';
-
-interface PublicDashboardSettingsFormProps {
-	timeRangeEnabled: boolean;
-	defaultTimeRange: string;
-	disabled: boolean;
-	onTimeRangeEnabledChange: (value: boolean) => void;
-	onDefaultTimeRangeChange: (value: string) => void;
-}
-
-function PublicDashboardSettingsForm({
-	timeRangeEnabled,
-	defaultTimeRange,
-	disabled,
-	onTimeRangeEnabledChange,
-	onDefaultTimeRangeChange,
-}: PublicDashboardSettingsFormProps): JSX.Element {
-	return (
-		<>
-			<Checkbox
-				id="public-dashboard-enable-time-range"
-				className={styles.checkbox}
-				testId="public-dashboard-time-range-toggle"
-				value={timeRangeEnabled}
-				disabled={disabled}
-				onChange={(checked): void => onTimeRangeEnabledChange(checked === true)}
-			>
-				Enable time range
-			</Checkbox>
-
-			<div className={styles.timeRangeSelectGroup}>
-				<Typography.Text className={styles.timeRangeSelectLabel}>
-					Default time range
-				</Typography.Text>
-				<SelectSimple
-					className={styles.timeRangeSelect}
-					testId="public-dashboard-default-time-range"
-					placeholder="Select default time range"
-					items={TIME_RANGE_PRESETS_OPTIONS}
-					value={defaultTimeRange}
-					disabled={disabled}
-					onChange={(value): void => onDefaultTimeRangeChange(value as string)}
-				/>
-			</div>
-		</>
-	);
-}
-
-export default PublicDashboardSettingsForm;

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/PublicDashboard/PublicDashboardStatus.tsx

@@ -1,21 +0,0 @@
-import { Typography } from '@signozhq/ui/typography';
-
-import styles from './PublicDashboard.module.scss';
-
-interface PublicDashboardStatusProps {
-	isPublic: boolean;
-}
-
-function PublicDashboardStatus({
-	isPublic,
-}: PublicDashboardStatusProps): JSX.Element {
-	return (
-		<Typography.Text className={styles.statusTitle}>
-			{isPublic
-				? 'This dashboard is publicly accessible. Anyone with the link can view it.'
-				: 'This dashboard is private. Publish it to make it accessible to anyone with the link.'}
-		</Typography.Text>
-	);
-}
-
-export default PublicDashboardStatus;

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/PublicDashboard/PublicDashboardUrl.tsx

@@ -1,49 +0,0 @@
-import { Copy, ExternalLink } from '@signozhq/icons';
-import { Button } from '@signozhq/ui/button';
-import { Typography } from '@signozhq/ui/typography';
-
-import styles from './PublicDashboard.module.scss';
-
-interface PublicDashboardUrlProps {
-	url: string;
-	onCopy: () => void;
-	onOpen: () => void;
-}
-
-function PublicDashboardUrl({
-	url,
-	onCopy,
-	onOpen,
-}: PublicDashboardUrlProps): JSX.Element {
-	return (
-		<div className={styles.urlGroup}>
-			<Typography.Text className={styles.urlLabel}>
-				Public dashboard URL
-			</Typography.Text>
-
-			<div className={styles.urlContainer}>
-				<Typography.Text className={styles.urlText}>{url}</Typography.Text>
-				<Button
-					variant="ghost"
-					size="icon"
-					aria-label="Copy public dashboard URL"
-					testId="public-dashboard-copy-url"
-					onClick={onCopy}
-				>
-					<Copy size={14} />
-				</Button>
-				<Button
-					variant="ghost"
-					size="icon"
-					aria-label="Open public dashboard in new tab"
-					testId="public-dashboard-open-url"
-					onClick={onOpen}
-				>
-					<ExternalLink size={14} />
-				</Button>
-			</div>
-		</div>
-	);
-}
-
-export default PublicDashboardUrl;

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/PublicDashboard/constants.ts

@@ -1,14 +0,0 @@
-export interface TimeRangePresetOption {
-	label: string;
-	value: string;
-}
-
-// Default time-range presets offered for the public dashboard viewer.
-export const TIME_RANGE_PRESETS_OPTIONS: TimeRangePresetOption[] = [
-	{ label: 'Last 5 minutes', value: '5m' },
-	{ label: 'Last 15 minutes', value: '15m' },
-	{ label: 'Last 30 minutes', value: '30m' },
-	{ label: 'Last 1 hour', value: '1h' },
-	{ label: 'Last 6 hours', value: '6h' },
-	{ label: 'Last 1 day', value: '24h' },
-];

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/PublicDashboard/index.tsx

@@ -1,71 +0,0 @@
-import type { DashboardtypesGettableDashboardV2DTO } from 'api/generated/services/sigNoz.schemas';
-
-import PublicDashboardActions from './PublicDashboardActions';
-import PublicDashboardCallout from './PublicDashboardCallout';
-import PublicDashboardSettingsForm from './PublicDashboardSettingsForm';
-import PublicDashboardStatus from './PublicDashboardStatus';
-import PublicDashboardUrl from './PublicDashboardUrl';
-import { usePublicDashboard } from './usePublicDashboard';
-import styles from './PublicDashboard.module.scss';
-
-interface PublicDashboardSettingsProps {
-	dashboard: DashboardtypesGettableDashboardV2DTO;
-}
-
-function PublicDashboardSettings({
-	dashboard,
-}: PublicDashboardSettingsProps): JSX.Element {
-	const {
-		isPublic,
-		isAdmin,
-		isLoading,
-		isPublishing,
-		isUpdating,
-		isUnpublishing,
-		timeRangeEnabled,
-		defaultTimeRange,
-		publicUrl,
-		setTimeRangeEnabled,
-		setDefaultTimeRange,
-		onPublish,
-		onUpdate,
-		onUnpublish,
-		onCopyUrl,
-		onOpenUrl,
-	} = usePublicDashboard(dashboard.id);
-
-	const controlsDisabled = isLoading || !isAdmin;
-
-	return (
-		<div className={styles.publicDashboardCard}>
-			<PublicDashboardStatus isPublic={isPublic} />
-
-			<PublicDashboardSettingsForm
-				timeRangeEnabled={timeRangeEnabled}
-				defaultTimeRange={defaultTimeRange}
-				disabled={controlsDisabled}
-				onTimeRangeEnabledChange={setTimeRangeEnabled}
-				onDefaultTimeRangeChange={setDefaultTimeRange}
-			/>
-
-			{isPublic && (
-				<PublicDashboardUrl url={publicUrl} onCopy={onCopyUrl} onOpen={onOpenUrl} />
-			)}
-
-			<PublicDashboardCallout />
-
-			<PublicDashboardActions
-				isPublic={isPublic}
-				disabled={controlsDisabled}
-				isPublishing={isPublishing}
-				isUpdating={isUpdating}
-				isUnpublishing={isUnpublishing}
-				onPublish={onPublish}
-				onUpdate={onUpdate}
-				onUnpublish={onUnpublish}
-			/>
-		</div>
-	);
-}
-
-export default PublicDashboardSettings;

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/PublicDashboard/usePublicDashboard.ts

@@ -1,197 +0,0 @@
-import { useCallback, useEffect, useMemo, useState } from 'react';
-import { useQueryClient } from 'react-query';
-import { useCopyToClipboard } from 'react-use';
-import { toast } from '@signozhq/ui/sonner';
-import {
-	invalidateGetPublicDashboard,
-	useCreatePublicDashboard,
-	useDeletePublicDashboard,
-	useGetPublicDashboard,
-	useUpdatePublicDashboard,
-} from 'api/generated/services/dashboard';
-import { DEFAULT_TIME_RANGE } from 'container/TopNav/DateTimeSelectionV2/constants';
-import { useAppContext } from 'providers/App/App';
-import { useErrorModal } from 'providers/ErrorModalProvider';
-import APIError from 'types/api/error';
-import { USER_ROLES } from 'types/roles';
-import { getAbsoluteUrl } from 'utils/basePath';
-import { openInNewTab } from 'utils/navigation';
-
-export interface UsePublicDashboardReturn {
-	isPublic: boolean;
-	isAdmin: boolean;
-	isLoading: boolean;
-	isPublishing: boolean;
-	isUpdating: boolean;
-	isUnpublishing: boolean;
-	timeRangeEnabled: boolean;
-	defaultTimeRange: string;
-	publicUrl: string;
-	setTimeRangeEnabled: (value: boolean) => void;
-	setDefaultTimeRange: (value: string) => void;
-	onPublish: () => void;
-	onUpdate: () => void;
-	onUnpublish: () => void;
-	onCopyUrl: () => void;
-	onOpenUrl: () => void;
-}
-
-/**
- * Encapsulates the public-dashboard query, the create/update/delete mutations and the
- * local form state for the V2 publish settings section. Targets the same
- * `/dashboards/{id}/public` endpoint as V1 via the generated client.
- */
-export function usePublicDashboard(
-	dashboardId: string,
-): UsePublicDashboardReturn {
-	const queryClient = useQueryClient();
-	const { showErrorModal } = useErrorModal();
-	const { user } = useAppContext();
-	const isAdmin = user?.role === USER_ROLES.ADMIN;
-	const [, copyToClipboard] = useCopyToClipboard();
-
-	const [timeRangeEnabled, setTimeRangeEnabled] = useState<boolean>(true);
-	const [defaultTimeRange, setDefaultTimeRange] =
-		useState<string>(DEFAULT_TIME_RANGE);
-
-	const {
-		data,
-		isLoading: isLoadingMeta,
-		isFetching,
-		error,
-		refetch,
-	} = useGetPublicDashboard(
-		{ id: dashboardId },
-		{ query: { enabled: !!dashboardId, retry: false } },
-	);
-
-	// react-query retains the last successful `data` even after a refetch errors, so
-	// after unpublishing (the refetch 404s) `data` still holds the old publicPath.
-	// Gate on `!error` so the UI flips back to the private state.
-	const publicMeta = error ? undefined : data?.data;
-	const isPublic = !!publicMeta?.publicPath;
-
-	// Seed form state from the server config when published.
-	useEffect(() => {
-		if (publicMeta) {
-			setTimeRangeEnabled(publicMeta.timeRangeEnabled ?? false);
-			setDefaultTimeRange(publicMeta.defaultTimeRange || DEFAULT_TIME_RANGE);
-		}
-	}, [publicMeta]);
-
-	// A 404 (dashboard not published) surfaces as an error — reset to defaults.
-	useEffect(() => {
-		if (error) {
-			setTimeRangeEnabled(true);
-			setDefaultTimeRange(DEFAULT_TIME_RANGE);
-		}
-	}, [error]);
-
-	const publicUrl = useMemo(
-		() => getAbsoluteUrl(publicMeta?.publicPath ?? ''),
-		[publicMeta?.publicPath],
-	);
-
-	const handleError = useCallback(
-		(err: unknown): void => {
-			showErrorModal(err as APIError);
-		},
-		[showErrorModal],
-	);
-
-	const handleSuccess = useCallback(
-		(message: string): void => {
-			toast.success(message);
-			void invalidateGetPublicDashboard(queryClient, { id: dashboardId });
-			void refetch();
-		},
-		[queryClient, dashboardId, refetch],
-	);
-
-	const { mutate: createPublicDashboard, isLoading: isPublishing } =
-		useCreatePublicDashboard({
-			mutation: {
-				onSuccess: () => handleSuccess('Dashboard published successfully'),
-				onError: handleError,
-			},
-		});
-
-	const { mutate: updatePublicDashboard, isLoading: isUpdating } =
-		useUpdatePublicDashboard({
-			mutation: {
-				onSuccess: () => handleSuccess('Public dashboard updated successfully'),
-				onError: handleError,
-			},
-		});
-
-	const { mutate: deletePublicDashboard, isLoading: isUnpublishing } =
-		useDeletePublicDashboard({
-			mutation: {
-				onSuccess: () => handleSuccess('Dashboard unpublished successfully'),
-				onError: handleError,
-			},
-		});
-
-	const onPublish = useCallback((): void => {
-		if (!dashboardId) {
-			return;
-		}
-		createPublicDashboard({
-			pathParams: { id: dashboardId },
-			data: { timeRangeEnabled, defaultTimeRange },
-		});
-	}, [createPublicDashboard, dashboardId, timeRangeEnabled, defaultTimeRange]);
-
-	const onUpdate = useCallback((): void => {
-		if (!dashboardId) {
-			return;
-		}
-		updatePublicDashboard({
-			pathParams: { id: dashboardId },
-			data: { timeRangeEnabled, defaultTimeRange },
-		});
-	}, [updatePublicDashboard, dashboardId, timeRangeEnabled, defaultTimeRange]);
-
-	const onUnpublish = useCallback((): void => {
-		if (!dashboardId) {
-			return;
-		}
-		deletePublicDashboard({ pathParams: { id: dashboardId } });
-	}, [deletePublicDashboard, dashboardId]);
-
-	const onCopyUrl = useCallback((): void => {
-		if (!publicUrl) {
-			return;
-		}
-		copyToClipboard(publicUrl);
-		toast.success('Copied public dashboard URL successfully');
-	}, [copyToClipboard, publicUrl]);
-
-	const onOpenUrl = useCallback((): void => {
-		if (publicUrl) {
-			openInNewTab(publicUrl);
-		}
-	}, [publicUrl]);
-
-	const isLoading =
-		isLoadingMeta || isFetching || isPublishing || isUpdating || isUnpublishing;
-
-	return {
-		isPublic,
-		isAdmin,
-		isLoading,
-		isPublishing,
-		isUpdating,
-		isUnpublishing,
-		timeRangeEnabled,
-		defaultTimeRange,
-		publicUrl,
-		setTimeRangeEnabled,
-		setDefaultTimeRange,
-		onPublish,
-		onUpdate,
-		onUnpublish,
-		onCopyUrl,
-		onOpenUrl,
-	};
-}

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/index.tsx

@@ -1,91 +1,45 @@
 import { useMemo } from 'react';
 
 import { Braces, Globe, Table } from '@signozhq/icons';
-import {
-	TabItemProps,
-	TabsContent,
-	TabsList,
-	TabsRoot,
-	TabsTrigger,
-} from '@signozhq/ui/tabs';
+import { TabItemProps, Tabs } from '@signozhq/ui/tabs';
 import type { DashboardtypesGettableDashboardV2DTO } from 'api/generated/services/sigNoz.schemas';
 
-import Overview from './Overview';
-import PublicDashboardSettings from './PublicDashboard';
+import GeneralSettings from './General';
+import { SettingsTabPlaceholder } from './utils';
 import VariablesSettings from './Variables';
-import { useAppContext } from 'providers/App/App';
-import { useGetTenantLicense } from 'hooks/useGetTenantLicense';
-import { USER_ROLES } from 'types/roles';
-
-import styles from './DashboardSettings.module.scss';
 
 interface DashboardSettingsProps {
 	dashboard: DashboardtypesGettableDashboardV2DTO;
 }
 
-enum TabKeys {
-	OVERVIEW = 'Overview',
-	VARIABLES = 'Variables',
-	PUBLISH = 'Publish',
-}
-
-const prefixIcons: Record<TabKeys, JSX.Element> = {
-	[TabKeys.OVERVIEW]: <Table size={14} />,
-	[TabKeys.VARIABLES]: <Braces size={14} />,
-	[TabKeys.PUBLISH]: <Globe size={14} />,
-};
-
 function DashboardSettings({ dashboard }: DashboardSettingsProps): JSX.Element {
-	const { user } = useAppContext();
-	const { isCloudUser, isEnterpriseSelfHostedUser } = useGetTenantLicense();
-
-	const enablePublicDashboard = isCloudUser || isEnterpriseSelfHostedUser;
-
 	const items: TabItemProps[] = useMemo(
 		() => [
 			{
-				key: TabKeys.OVERVIEW,
-				label: TabKeys.OVERVIEW,
-				children: <Overview dashboard={dashboard} />,
+				key: 'general',
+				label: 'General',
+				children: <GeneralSettings dashboard={dashboard} />,
+				prefixIcon: <Table size={14} />,
 			},
 			{
-				key: TabKeys.VARIABLES,
-				label: TabKeys.VARIABLES,
+				key: 'variables',
+				label: 'Variables',
 				children: <VariablesSettings dashboard={dashboard} />,
 				prefixIcon: <Braces size={14} />,
 			},
-			...(enablePublicDashboard
-				? [
-						{
-							key: TabKeys.PUBLISH,
-							label: TabKeys.PUBLISH,
-							children: <PublicDashboardSettings dashboard={dashboard} />,
-							disabled: user?.role !== USER_ROLES.ADMIN,
-						},
-					]
-				: []),
+			{
+				key: 'public-dashboard',
+				label: 'Publish',
+				children: (
+					<SettingsTabPlaceholder message="V2 public dashboard publishing coming next." />
+				),
+				prefixIcon: <Globe size={14} />,
+			},
 		],
-		[enablePublicDashboard, dashboard, user?.role],
+		[dashboard],
 	);
 
-	return (
-		<TabsRoot defaultValue={TabKeys.OVERVIEW}>
-			<TabsList variant="primary">
-				{Object.values(TabKeys).map((key) => (
-					<TabsTrigger value={key} key={key}>
-						{prefixIcons[key]}
-						{key}
-					</TabsTrigger>
-				))}
-			</TabsList>
-
-			{items.map((item) => (
-				<TabsContent value={item.key} key={item.key} className={styles.tabsContent}>
-					{item.children}
-				</TabsContent>
-			))}
-		</TabsRoot>
-	);
+	return <Tabs defaultValue="general" items={items} />;
 }
 
 export default DashboardSettings;

frontend/src/pages/DashboardPageV2/DashboardContainer/DashboardSettings/utils.tsx

@@ -0,0 +1,23 @@
+import { Empty } from 'antd';
+import { Typography } from '@signozhq/ui/typography';
+
+import styles from './DashboardSettings.module.scss';
+
+/**
+ * TEMPORARY: stand-in for the not-yet-built Variables / Publish settings tabs.
+ * Will be cleaned up later once those tabs ship their real content.
+ */
+export function SettingsTabPlaceholder({
+	message,
+}: {
+	message: string;
+}): JSX.Element {
+	return (
+		<div className={styles.placeholder}>
+			<Empty
+				image={Empty.PRESENTED_IMAGE_SIMPLE}
+				description={<Typography.Text>{message}</Typography.Text>}
+			/>
+		</div>
+	);
+}

frontend/src/pages/DashboardPageV2/DashboardContainer/components/DashboardHeader/DashboardBreadcrumbs.module.scss

@@ -0,0 +1,57 @@
+.dashboardBreadcrumbs {
+	width: 100%;
+	height: 48px;
+	display: flex;
+	gap: 6px;
+	align-items: center;
+	max-width: 80%;
+	padding-left: 8px;
+
+	.linkToPreviousPage {
+		// Collapse the design-system Button's fixed-height/padding box so it hugs
+		// the label like inline text (the breadcrumb is text, not a chunky button).
+		--button-height: auto;
+		--button-padding: 0;
+		--button-gap: 4px;
+		color: var(--l2-foreground);
+		font-family: Inter;
+		font-size: 14px;
+		font-style: normal;
+		font-weight: 400;
+		letter-spacing: -0.07px;
+	}
+
+	.currentPage {
+		display: flex;
+		align-items: center;
+		gap: 4px;
+		padding: 0px 2px;
+		border-radius: 2px;
+		background: color-mix(in srgb, var(--bg-robin-400) 10%, transparent);
+		color: var(--bg-robin-400);
+		font-family: Inter;
+		font-size: 14px;
+		font-style: normal;
+		font-weight: 400;
+		line-height: 20px; /* 142.857% */
+		height: 20px;
+
+		max-width: calc(100% - 120px);
+
+		span {
+			white-space: nowrap;
+			overflow: hidden;
+			text-overflow: ellipsis;
+		}
+	}
+
+	.currentPage:hover {
+		background: color-mix(in srgb, var(--bg-robin-400) 10%, transparent);
+		color: var(--bg-robin-300);
+	}
+
+	.dashboardIconImage {
+		height: 14px;
+		width: 14px;
+	}
+}

frontend/src/pages/DashboardPageV2/DashboardContainer/components/DashboardHeader/DashboardBreadcrumbs.tsx

@@ -0,0 +1,63 @@
+import { useCallback } from 'react';
+import { LayoutGrid } from '@signozhq/icons';
+import { Button } from '@signozhq/ui/button';
+import { Typography } from '@signozhq/ui/typography';
+import getSessionStorageApi from 'api/browser/sessionstorage/get';
+import ROUTES from 'constants/routes';
+import { DASHBOARDS_LIST_QUERY_PARAMS_STORAGE_KEY } from 'hooks/dashboard/useDashboardsListQueryParams';
+import { useSafeNavigate } from 'hooks/useSafeNavigate';
+
+import styles from './DashboardBreadcrumbs.module.scss';
+
+interface DashboardBreadcrumbsProps {
+	title: string;
+	image: string;
+}
+
+function DashboardBreadcrumbs({
+	title,
+	image,
+}: DashboardBreadcrumbsProps): JSX.Element {
+	const { safeNavigate } = useSafeNavigate();
+
+	const goToListPage = useCallback(() => {
+		const dashboardsListQueryParamsString = getSessionStorageApi(
+			DASHBOARDS_LIST_QUERY_PARAMS_STORAGE_KEY,
+		);
+
+		if (dashboardsListQueryParamsString) {
+			safeNavigate({
+				pathname: ROUTES.ALL_DASHBOARD,
+				search: `?${dashboardsListQueryParamsString}`,
+			});
+		} else {
+			safeNavigate(ROUTES.ALL_DASHBOARD);
+		}
+	}, [safeNavigate]);
+
+	return (
+		<div className={styles.dashboardBreadcrumbs}>
+			<Button
+				variant="ghost"
+				color="secondary"
+				prefix={<LayoutGrid size={14} />}
+				onClick={goToListPage}
+				className={styles.linkToPreviousPage}
+				testId="dashboard-breadcrumb-list"
+			>
+				Dashboard
+			</Button>
+			<div>/</div>
+			<div className={styles.currentPage}>
+				<img
+					src={image}
+					alt="dashboard-icon"
+					className={styles.dashboardIconImage}
+				/>
+				<Typography.Text>{title}</Typography.Text>
+			</div>
+		</div>
+	);
+}
+
+export default DashboardBreadcrumbs;

frontend/src/pages/DashboardPageV2/DashboardContainer/components/DashboardHeader/DashboardHeader.module.scss

@@ -0,0 +1,9 @@
+.dashboardHeader {
+	border-bottom: 1px solid var(--l1-border);
+	display: flex;
+	justify-content: space-between;
+	gap: 16px;
+	align-items: center;
+	padding: 0 8px;
+	box-sizing: border-box;
+}

frontend/src/pages/DashboardPageV2/DashboardContainer/components/DashboardHeader/DashboardHeader.tsx

@@ -0,0 +1,22 @@
+import { memo } from 'react';
+import HeaderRightSection from 'components/HeaderRightSection/HeaderRightSection';
+
+import DashboardBreadcrumbs from './DashboardBreadcrumbs';
+
+import styles from './DashboardHeader.module.scss';
+
+interface DashboardHeaderProps {
+	title: string;
+	image: string;
+}
+
+function DashboardHeader({ title, image }: DashboardHeaderProps): JSX.Element {
+	return (
+		<div className={styles.dashboardHeader}>
+			<DashboardBreadcrumbs title={title} image={image} />
+			<HeaderRightSection enableAnnouncements={false} enableShare enableFeedback />
+		</div>
+	);
+}
+
+export default memo(DashboardHeader);

frontend/src/pages/DashboardPageV2/DashboardContainer/components/DashboardPageHeader/DashboardPageBreadcrumbs.tsx

@@ -1,53 +0,0 @@
-import { useMemo } from 'react';
-import { LayoutGrid } from '@signozhq/icons';
-import getSessionStorageApi from 'api/browser/sessionstorage/get';
-import ROUTES from 'constants/routes';
-import { DASHBOARDS_LIST_QUERY_PARAMS_STORAGE_KEY } from 'hooks/dashboard/useDashboardsListQueryParams';
-
-import {
-	Breadcrumb,
-	BreadcrumbItem,
-	BreadcrumbLink,
-	BreadcrumbList,
-	BreadcrumbSeparator,
-} from '@signozhq/ui/breadcrumb';
-
-interface DashboardPageBreadcrumbsProps {
-	title: string;
-	image: string;
-}
-
-function DashboardPageBreadcrumbs({
-	title,
-	image,
-}: DashboardPageBreadcrumbsProps): JSX.Element {
-	const dashboardPageLink = useMemo(() => {
-		const dashboardsListQueryParamsString = getSessionStorageApi(
-			DASHBOARDS_LIST_QUERY_PARAMS_STORAGE_KEY,
-		);
-
-		return dashboardsListQueryParamsString
-			? `${ROUTES.ALL_DASHBOARD}?${dashboardsListQueryParamsString}`
-			: ROUTES.ALL_DASHBOARD;
-	}, []);
-
-	return (
-		<Breadcrumb>
-			<BreadcrumbList>
-				<BreadcrumbItem>
-					<BreadcrumbLink icon={<LayoutGrid size={14} />} href={dashboardPageLink}>
-						Dashboard
-					</BreadcrumbLink>
-				</BreadcrumbItem>
-				<BreadcrumbSeparator>/</BreadcrumbSeparator>
-				<BreadcrumbItem>
-					<BreadcrumbLink icon={<img src={image} alt="dashboard-icon" />}>
-						{title}
-					</BreadcrumbLink>
-				</BreadcrumbItem>
-			</BreadcrumbList>
-		</Breadcrumb>
-	);
-}
-
-export default DashboardPageBreadcrumbs;

frontend/src/pages/DashboardPageV2/DashboardContainer/components/DashboardPageHeader/DashboardPageHeader.module.scss

@@ -1,9 +0,0 @@
-.dashboardPageHeader {
-	border-bottom: 1px solid var(--l2-border);
-	display: flex;
-	justify-content: space-between;
-	align-items: center;
-	padding-left: 14px;
-	height: 48px;
-	width: 100%;
-}

frontend/src/pages/DashboardPageV2/DashboardContainer/components/DashboardPageHeader/DashboardPageHeader.tsx

@@ -1,25 +0,0 @@
-import { memo } from 'react';
-import HeaderRightSection from 'components/HeaderRightSection/HeaderRightSection';
-
-import DashboardPageBreadcrumbs from './DashboardPageBreadcrumbs';
-
-import styles from './DashboardPageHeader.module.scss';
-
-interface DashboardPageHeaderProps {
-	title: string;
-	image: string;
-}
-
-function DashboardPageHeader({
-	title,
-	image,
-}: DashboardPageHeaderProps): JSX.Element {
-	return (
-		<div className={styles.dashboardPageHeader}>
-			<DashboardPageBreadcrumbs title={title} image={image} />
-			<HeaderRightSection enableAnnouncements={false} enableShare enableFeedback />
-		</div>
-	);
-}
-
-export default memo(DashboardPageHeader);

frontend/src/pages/DashboardPageV2/DashboardContainer/index.tsx

@@ -1,4 +1,4 @@
-import { useEffect } from 'react';
+import { useEffect, useMemo } from 'react';
 import { FullScreen, useFullScreenHandle } from 'react-full-screen';
 
 import type { DashboardtypesGettableDashboardV2DTO } from 'api/generated/services/sigNoz.schemas';
@@ -6,12 +6,10 @@ import PanelTypeSelectionModal from 'container/DashboardContainer/PanelTypeSelec
 import useComponentPermission from 'hooks/useComponentPermission';
 import { useAppContext } from 'providers/App/App';
 
-import DashboardPageToolbar from './DashboardPageToolbar';
+import DashboardDescription from './DashboardDescription';
 import PanelsAndSectionsLayout from './PanelsAndSectionsLayout';
 import { useDashboardStore } from './store/useDashboardStore';
 import styles from './DashboardContainer.module.scss';
-import DashboardPageHeader from './components/DashboardPageHeader/DashboardPageHeader';
-import { Base64Icons } from './DashboardSettings/Overview/utils';
 
 interface DashboardContainerProps {
 	dashboard: DashboardtypesGettableDashboardV2DTO;
@@ -22,49 +20,32 @@ function DashboardContainer({
 	dashboard,
 	refetch,
 }: DashboardContainerProps): JSX.Element {
-	useEffect(() => {
-		document.title = dashboard.name;
-	}, [dashboard.name]);
-
 	const fullScreenHandle = useFullScreenHandle();
 
 	const { user } = useAppContext();
-	const [editDashboardPermission] = useComponentPermission(
-		['edit_dashboard'],
-		user.role,
-	);
+	const [editDashboard] = useComponentPermission(['edit_dashboard'], user.role);
+	const isEditable = !dashboard.locked && editDashboard;
 
 	// Publish edit context to the store so hooks/components read it from there
 	// instead of receiving dashboardId/isEditable/refetch as props down the tree.
 	const setEditContext = useDashboardStore((s) => s.setEditContext);
 	useEffect(() => {
-		setEditContext({
-			dashboardId: dashboard.id,
-			isEditable: !dashboard.locked && editDashboardPermission,
-			refetch,
-		});
-	}, [
-		dashboard.id,
-		dashboard.locked,
-		editDashboardPermission,
-		refetch,
-		setEditContext,
-	]);
+		setEditContext({ dashboardId: dashboard.id ?? '', isEditable, refetch });
+	}, [dashboard.id, isEditable, refetch, setEditContext]);
 
-	const spec = dashboard.spec;
-	const image = dashboard.image || Base64Icons[0];
-	const name = spec.display.name;
+	const { spec } = dashboard;
+	const layouts = useMemo(() => spec?.layouts ?? [], [spec?.layouts]);
+	const panels = useMemo(() => spec?.panels ?? {}, [spec?.panels]);
 
 	return (
 		<FullScreen handle={fullScreenHandle}>
 			<div className={styles.container}>
-				<DashboardPageHeader title={name} image={image} />
-				<DashboardPageToolbar
+				<DashboardDescription
 					dashboard={dashboard}
 					handle={fullScreenHandle}
 					refetch={refetch}
 				/>
-				<PanelsAndSectionsLayout layouts={spec.layouts} panels={spec.panels} />
+				<PanelsAndSectionsLayout layouts={layouts} panels={panels} />
 			</div>
 			{/* Shared panel-type picker (V1 component): opened from any "New Panel"
 			    trigger; navigates to the widget editor route on selection. */}

frontend/src/pages/DashboardPageV2/DashboardContainer/patchOps.ts

@@ -13,7 +13,7 @@ import type { GridItem } from './utils';
  * intentionally side-effect-free (no React, no network) so they can be unit
  * tested and reused by the layout hooks. JSON pointers target the postable
  * shape: `/spec/layouts/...`, `/spec/panels/...` (matches the existing V2
- * patches in DashboardSettings/Overview and DashboardDescription).
+ * patches in DashboardSettings/General and DashboardDescription).
  */
 
 const { add, replace, remove } = DashboardtypesPatchOpDTO;

frontend/src/pages/DashboardPageV2/DashboardPageV2.tsx

@@ -1,3 +1,4 @@
+import { useEffect } from 'react';
 import { useParams } from 'react-router-dom';
 
 import { Typography } from '@signozhq/ui/typography';
@@ -15,6 +16,13 @@ function DashboardPageV2(): JSX.Element {
 	});
 
 	const dashboard = data?.data;
+	const name = dashboard?.spec?.display?.name;
+
+	useEffect(() => {
+		if (name) {
+			document.title = name;
+		}
+	}, [name]);
 
 	if (isLoading) {
 		return <Spinner tip="Loading dashboard..." />;

frontend/src/pages/LogsExplorer/__tests__/LogsExplorer.test.tsx

@@ -177,6 +177,8 @@ describe('Logs Explorer Tests', () => {
 			>
 				<QueryBuilderContext.Provider
 					value={{
+						mode: 'url',
+						committedQuery: null,
 						isDefaultQuery: (): boolean => false,
 						currentQuery: {
 							...initialQueriesMap.metrics,

frontend/src/pages/Settings/Settings.styles.scss

@@ -1,12 +1,8 @@
 .settings-page {
-	flex: 1;
-	min-height: 0;
-	display: flex;
-	flex-direction: column;
+	max-height: 100vh;
 	overflow: hidden;
 
 	.settings-page-header {
-		flex-shrink: 0;
 		border-bottom: 1px solid var(--l1-border);
 		background: var(--l1-background);
 		backdrop-filter: blur(20px);
@@ -28,14 +24,13 @@
 	}
 
 	.settings-page-content-container {
-		flex: 1;
-		min-height: 0;
 		display: flex;
 		flex-direction: row;
-		align-items: stretch;
+		align-items: flex-start;
 
 		.settings-page-sidenav {
 			width: 240px;
+			height: calc(100vh - 48px);
 			border-right: 1px solid var(--l1-border);
 			background: var(--l1-background);
 			padding-top: var(--padding-1);
@@ -79,6 +74,7 @@
 
 		.settings-page-content {
 			flex: 1;
+			height: calc(100vh - 48px);
 			background: var(--l1-background);
 			padding: 10px 8px;
 			overflow-y: auto;

frontend/src/providers/QueryBuilder.tsx

@@ -10,7 +10,6 @@ import {
 } from 'react';
 import { useLocation } from 'react-router-dom';
 import { isQueryUpdatedInView } from 'components/ExplorerCard/utils';
-import { QueryParams } from 'constants/query';
 import {
 	alphabet,
 	baseAutoCompleteIdKeysOrder,
@@ -21,7 +20,6 @@ import {
 	initialQueryBuilderFormTraceOperatorValues,
 	initialQueryBuilderFormValuesMap,
 	initialQueryPromQLData,
-	initialQueryState,
 	initialSingleQueryMap,
 	MAX_FORMULAS,
 	MAX_QUERIES,
@@ -34,10 +32,10 @@ import {
 	PartialPanelTypes,
 } from 'container/NewWidget/utils';
 import { OptionsQuery } from 'container/OptionsMenu/types';
-import { useGetCompositeQueryParam } from 'hooks/queryBuilder/useGetCompositeQueryParam';
+import { useMemoryCompositeQueryStore } from 'hooks/queryBuilder/compositeQueryStore/useMemoryCompositeQueryStore';
+import { useUrlCompositeQueryStore } from 'hooks/queryBuilder/compositeQueryStore/useUrlCompositeQueryStore';
 import { updateStepInterval } from 'hooks/queryBuilder/useStepInterval';
-import { useSafeNavigate } from 'hooks/useSafeNavigate';
-import useUrlQuery from 'hooks/useUrlQuery';
+import { normalizeCompositeQuery } from 'lib/compositeQuery/normalizeCompositeQuery';
 import { createIdFromObjectFields } from 'lib/createIdFromObjectFields';
 import { createNewBuilderItemName } from 'lib/newQueryBuilder/createNewBuilderItemName';
 import { getOperatorsBySourceAndPanelType } from 'lib/newQueryBuilder/getOperatorsBySourceAndPanelType';
@@ -65,9 +63,10 @@ import {
 	ReduceOperators,
 } from 'types/common/queryBuilder';
 import { sanitizeOrderByForExplorer } from 'utils/sanitizeOrderBy';
-import { v4 as uuid } from 'uuid';
 
 export const QueryBuilderContext = createContext<QueryBuilderContextType>({
+	mode: 'url',
+	committedQuery: null,
 	currentQuery: initialQueriesMap.metrics,
 	supersetQuery: initialQueriesMap.metrics,
 	lastUsedQuery: null,
@@ -102,10 +101,28 @@ export const QueryBuilderContext = createContext<QueryBuilderContextType>({
 	isDefaultQuery: () => false,
 });
 
-export function QueryBuilderProvider({
-	children,
-}: PropsWithChildren): JSX.Element {
-	const urlQuery = useUrlQuery();
+export type QueryBuilderProviderProps = PropsWithChildren<
+	| {
+			/** Default: the staged query is stored in the `compositeQuery` URL param. */
+			mode?: 'url';
+	  }
+	| {
+			/** The staged query is kept in memory — the URL is never touched. */
+			mode: 'memory';
+			/** Seed for the staged query; runs the same legacy-format migration as URL parsing. */
+			initialQuery?: Query;
+			initialPanelType?: PANEL_TYPES;
+			/** Fired with the normalized query every time it is staged (Stage & Run). */
+			onStagedQueryChange?: (query: Query) => void;
+	  }
+>;
+
+export function QueryBuilderProvider(
+	props: QueryBuilderProviderProps,
+): JSX.Element {
+	const { children } = props;
+	const memoryModeProps = props.mode === 'memory' ? props : null;
+
 	const location = useLocation();
 
 	const currentPathnameRef = useRef<string | null>(location.pathname);
@@ -114,7 +131,18 @@ export function QueryBuilderProvider({
 	const [calledFromHandleRunQuery, setCalledFromHandleRunQuery] =
 		useState<boolean>(false);
 
-	const compositeQueryParam = useGetCompositeQueryParam();
+	// Rules of hooks: both store hooks always run; only the selected one is used.
+	const urlCompositeQueryStore = useUrlCompositeQueryStore();
+	const memoryCompositeQueryStore = useMemoryCompositeQueryStore({
+		initialQuery: memoryModeProps?.initialQuery,
+		initialPanelType: memoryModeProps?.initialPanelType,
+		onCommit: memoryModeProps?.onStagedQueryChange,
+	});
+	const compositeQueryStore = memoryModeProps
+		? memoryCompositeQueryStore
+		: urlCompositeQueryStore;
+
+	const compositeQueryParam = compositeQueryStore.query;
 	const { queryType: queryTypeParam, ...queryState } =
 		compositeQueryParam || initialQueriesMap.metrics;
 
@@ -122,12 +150,8 @@ export function QueryBuilderProvider({
 		null,
 	);
 
-	const panelTypeQueryParams = urlQuery.get(
-		QueryParams.panelTypes,
-	) as PANEL_TYPES | null;
-
 	const [panelType, setPanelType] = useState<PANEL_TYPES | null>(
-		panelTypeQueryParams,
+		compositeQueryStore.panelType,
 	);
 
 	const [currentQuery, setCurrentQuery] = useState<QueryState>(queryState);
@@ -935,9 +959,7 @@ export function QueryBuilderProvider({
 		[panelType, stagedQuery],
 	);
 
-	const { safeNavigate } = useSafeNavigate({
-		preventSameUrlNavigation: false,
-	});
+	const { commit: commitCompositeQuery } = compositeQueryStore;
 
 	const redirectWithQueryBuilderData = useCallback(
 		(
@@ -947,74 +969,14 @@ export function QueryBuilderProvider({
 			shouldNotStringify?: boolean,
 			newTab?: boolean,
 		) => {
-			const queryType =
-				!query.queryType || !Object.values(EQueryType).includes(query.queryType)
-					? EQueryType.QUERY_BUILDER
-					: query.queryType;
-
-			const builder =
-				!query.builder || query.builder.queryData?.length === 0
-					? initialQueryState.builder
-					: query.builder;
-
-			const promql =
-				!query.promql || query.promql.length === 0
-					? initialQueryState.promql
-					: query.promql;
-
-			const clickhouseSql =
-				!query.clickhouse_sql || query.clickhouse_sql.length === 0
-					? initialQueryState.clickhouse_sql
-					: query.clickhouse_sql;
-
-			const currentGeneratedQuery: Query = {
-				queryType,
-				builder,
-				promql,
-				clickhouse_sql: clickhouseSql,
-				id: uuid(),
-				unit: query.unit || initialQueryState.unit,
-			};
-
-			const pagination = urlQuery.get(QueryParams.pagination);
-
-			if (pagination) {
-				const parsedPagination = JSON.parse(pagination);
-
-				urlQuery.set(
-					QueryParams.pagination,
-					JSON.stringify({
-						limit: parsedPagination.limit,
-						offset: 0,
-					}),
-				);
-			}
-
-			urlQuery.set(
-				QueryParams.compositeQuery,
-				encodeURIComponent(JSON.stringify(currentGeneratedQuery)),
-			);
-
-			if (searchParams) {
-				Object.keys(searchParams).forEach((param) =>
-					urlQuery.set(
-						param,
-						shouldNotStringify
-							? (searchParams[param] as string)
-							: JSON.stringify(searchParams[param]),
-					),
-				);
-			}
-			// Remove Hidden Filters from URL query parameters on query change
-			urlQuery.delete(QueryParams.activeLogId);
-
-			const generatedUrl = redirectingUrl
-				? `${redirectingUrl}?${urlQuery}`
-				: `${location.pathname}?${urlQuery}`;
-
-			safeNavigate(generatedUrl, { newTab });
+			commitCompositeQuery(normalizeCompositeQuery(query), {
+				searchParams,
+				redirectingUrl,
+				shouldNotStringify,
+				newTab,
+			});
 		},
-		[location.pathname, safeNavigate, urlQuery],
+		[commitCompositeQuery],
 	);
 
 	const handleSetConfig = useCallback(
@@ -1075,12 +1037,16 @@ export function QueryBuilderProvider({
 		if (location.pathname !== currentPathnameRef.current) {
 			currentPathnameRef.current = location.pathname;
 
-			setStagedQuery(null);
-			// reset the last used query to 0 when navigating away from the page
-			setLastUsedQuery(0);
-			setCalledFromHandleRunQuery(false);
+			// In memory mode the store lives and dies with the provider mount,
+			// so navigation must not clear the staged query.
+			if (compositeQueryStore.mode === 'url') {
+				setStagedQuery(null);
+				// reset the last used query to 0 when navigating away from the page
+				setLastUsedQuery(0);
+				setCalledFromHandleRunQuery(false);
+			}
 		}
-	}, [location.pathname]);
+	}, [location.pathname, compositeQueryStore.mode]);
 
 	// Separate useEffect to handle initQueryBuilderData after pathname changes
 	useEffect(() => {
@@ -1159,6 +1125,8 @@ export function QueryBuilderProvider({
 
 	const contextValues: QueryBuilderContextType = useMemo(
 		() => ({
+			mode: compositeQueryStore.mode,
+			committedQuery: compositeQueryStore.query,
 			currentQuery: query,
 			supersetQuery: superQuery,
 			lastUsedQuery,
@@ -1193,6 +1161,8 @@ export function QueryBuilderProvider({
 			isStagedQueryUpdated,
 		}),
 		[
+			compositeQueryStore.mode,
+			compositeQueryStore.query,
 			query,
 			superQuery,
 			lastUsedQuery,

frontend/src/providers/Timezone.tsx

@@ -19,14 +19,17 @@ import {
 } from 'components/CustomTimePicker/timezoneUtils';
 import { LOCALSTORAGE } from 'constants/localStorage';
 import useTimezoneFormatter, {
-	FormatTimezoneAdjustedTimestamp,
+	TimestampInput,
 } from 'hooks/useTimezoneFormatter/useTimezoneFormatter';
 
 export interface TimezoneContextType {
 	timezone: Timezone;
 	browserTimezone: Timezone;
 	updateTimezone: (timezone: Timezone) => void;
-	formatTimezoneAdjustedTimestamp: FormatTimezoneAdjustedTimestamp;
+	formatTimezoneAdjustedTimestamp: (
+		input: TimestampInput,
+		format?: string,
+	) => string;
 	isAdaptationEnabled: boolean;
 	setIsAdaptationEnabled: Dispatch<SetStateAction<boolean>>;
 }

frontend/src/providers/__tests__/QueryBuilderMemoryMode.test.tsx

@@ -0,0 +1,135 @@
+import React from 'react';
+import { MemoryRouter } from 'react-router-dom';
+import { act, renderHook } from '@testing-library/react';
+import { initialQueriesMap, PANEL_TYPES } from 'constants/queryBuilder';
+import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
+import { useShareBuilderUrl } from 'hooks/queryBuilder/useShareBuilderUrl';
+import { Query } from 'types/api/queryBuilder/queryBuilderData';
+import { QueryBuilderContextType } from 'types/common/queryBuilder';
+
+import { QueryBuilderProvider } from '../QueryBuilder';
+
+const mockSafeNavigate = jest.fn();
+
+jest.mock('hooks/useSafeNavigate', () => ({
+	useSafeNavigate: (): { safeNavigate: jest.Mock } => ({
+		safeNavigate: mockSafeNavigate,
+	}),
+}));
+
+const mockOnStagedQueryChange = jest.fn();
+
+function createMemoryModeWrapper(
+	initialQuery?: Query,
+): ({ children }: { children: React.ReactNode }) => JSX.Element {
+	return function Wrapper({
+		children,
+	}: {
+		children: React.ReactNode;
+	}): JSX.Element {
+		return (
+			<MemoryRouter initialEntries={['/dashboard/test-dashboard']}>
+				<QueryBuilderProvider
+					mode="memory"
+					initialQuery={initialQuery}
+					initialPanelType={PANEL_TYPES.TABLE}
+					onStagedQueryChange={mockOnStagedQueryChange}
+				>
+					{children}
+				</QueryBuilderProvider>
+			</MemoryRouter>
+		);
+	};
+}
+
+describe('QueryBuilderProvider in memory mode', () => {
+	beforeEach(() => {
+		mockSafeNavigate.mockClear();
+		mockOnStagedQueryChange.mockClear();
+	});
+
+	it('exposes memory mode and seeds staged/current query from initialQuery', () => {
+		const { result } = renderHook(() => useQueryBuilder(), {
+			wrapper: createMemoryModeWrapper(initialQueriesMap.logs),
+		});
+
+		expect(result.current.mode).toBe('memory');
+		expect(result.current.panelType).toBe(PANEL_TYPES.TABLE);
+		expect(result.current.stagedQuery?.id).toBe(initialQueriesMap.logs.id);
+		expect(result.current.currentQuery.builder.queryData[0].dataSource).toBe(
+			initialQueriesMap.logs.builder.queryData[0].dataSource,
+		);
+		expect(mockSafeNavigate).not.toHaveBeenCalled();
+		expect(mockOnStagedQueryChange).not.toHaveBeenCalled();
+	});
+
+	it('stages on handleRunQuery without navigating and notifies the host', () => {
+		const { result } = renderHook(() => useQueryBuilder(), {
+			wrapper: createMemoryModeWrapper(initialQueriesMap.logs),
+		});
+
+		const seededStagedQueryId = result.current.stagedQuery?.id;
+
+		act(() => {
+			result.current.handleRunQuery();
+		});
+
+		expect(mockSafeNavigate).not.toHaveBeenCalled();
+		expect(mockOnStagedQueryChange).toHaveBeenCalledTimes(1);
+
+		const stagedByHost = mockOnStagedQueryChange.mock.calls[0][0];
+		expect(stagedByHost.builder.queryData[0].dataSource).toBe(
+			initialQueriesMap.logs.builder.queryData[0].dataSource,
+		);
+
+		expect(result.current.stagedQuery?.id).toBe(stagedByHost.id);
+		expect(result.current.stagedQuery?.id).not.toBe(seededStagedQueryId);
+	});
+
+	it('useShareBuilderUrl seeds the default query in memory without navigating', () => {
+		const { result } = renderHook(
+			(): QueryBuilderContextType => {
+				useShareBuilderUrl({ defaultValue: initialQueriesMap.traces });
+				return useQueryBuilder();
+			},
+			{ wrapper: createMemoryModeWrapper() },
+		);
+
+		expect(mockSafeNavigate).not.toHaveBeenCalled();
+		expect(result.current.committedQuery).not.toBeNull();
+		expect(result.current.stagedQuery?.builder.queryData[0].dataSource).toBe(
+			initialQueriesMap.traces.builder.queryData[0].dataSource,
+		);
+	});
+
+	it('useShareBuilderUrl does not clobber a seeded initialQuery', () => {
+		const { result } = renderHook(
+			(): QueryBuilderContextType => {
+				useShareBuilderUrl({ defaultValue: initialQueriesMap.traces });
+				return useQueryBuilder();
+			},
+			{ wrapper: createMemoryModeWrapper(initialQueriesMap.logs) },
+		);
+
+		expect(mockSafeNavigate).not.toHaveBeenCalled();
+		expect(result.current.stagedQuery?.builder.queryData[0].dataSource).toBe(
+			initialQueriesMap.logs.builder.queryData[0].dataSource,
+		);
+	});
+
+	it('redirectWithQueryBuilderData commits in memory without navigating', () => {
+		const { result } = renderHook(() => useQueryBuilder(), {
+			wrapper: createMemoryModeWrapper(initialQueriesMap.logs),
+		});
+
+		act(() => {
+			result.current.redirectWithQueryBuilderData(initialQueriesMap.traces);
+		});
+
+		expect(mockSafeNavigate).not.toHaveBeenCalled();
+		expect(mockOnStagedQueryChange).toHaveBeenCalledTimes(1);
+		expect(result.current.stagedQuery?.builder.queryData[0].dataSource).toBe(
+			initialQueriesMap.traces.builder.queryData[0].dataSource,
+		);
+	});
+});

frontend/src/types/common/queryBuilder.ts

@@ -233,7 +233,16 @@ export type QueryBuilderData = {
 	queryTraceOperator: IBuilderTraceOperator[];
 };
 
+export type CompositeQueryStoreMode = 'url' | 'memory';
+
 export type QueryBuilderContextType = {
+	/** Where the staged query is persisted: the URL (default) or in memory. */
+	mode: CompositeQueryStoreMode;
+	/**
+	 * The query currently persisted in the store (URL param or memory),
+	 * synchronously available — unlike stagedQuery, which is set by effects.
+	 */
+	committedQuery: Query | null;
 	currentQuery: Query;
 	stagedQuery: Query | null;
 	lastUsedQuery: number | null;

pkg/alertmanager/alertmanagerstore/sqlalertmanagerstore/maintenance.go

@@ -2,7 +2,6 @@ package sqlalertmanagerstore
 
 import (
 	"context"
-	"encoding/json"
 	"log/slog"
 	"time"
 
@@ -40,20 +39,16 @@ func (r *maintenance) ListPlannedMaintenance(ctx context.Context, orgID string)
 		return nil, err
 	}
 
-	plannedMaintenances := make([]*alertmanagertypes.PlannedMaintenance, 0, len(gettableMaintenancesRules))
+	gettablePlannedMaintenance := make([]*alertmanagertypes.PlannedMaintenance, 0)
 	for _, gettableMaintenancesRule := range gettableMaintenancesRules {
-		pm, err := gettableMaintenancesRule.ToPlannedMaintenance()
-		if err != nil {
-			// Don't return an error because we want to process all the valid records.
-			// Log and skip instead.
-			r.logger.WarnContext(ctx, "skipping planned maintenance", slog.String("maintenance_id", gettableMaintenancesRule.ID.StringValue()), errors.Attr(err))
-			continue
+		m := gettableMaintenancesRule.ToPlannedMaintenance()
+		gettablePlannedMaintenance = append(gettablePlannedMaintenance, m)
+		if m.HasScheduleRecurrenceBoundsMismatch() {
+			r.logger.WarnContext(ctx, "planned_downtime_recurrence_schedule_mismatch", slog.String("maintenance_id", m.ID.StringValue()))
 		}
-
-		plannedMaintenances = append(plannedMaintenances, pm)
 	}
 
-	return plannedMaintenances, nil
+	return gettablePlannedMaintenance, nil
 }
 
 func (r *maintenance) GetPlannedMaintenanceByID(ctx context.Context, id valuer.UUID) (*alertmanagertypes.PlannedMaintenance, error) {
@@ -69,7 +64,7 @@ func (r *maintenance) GetPlannedMaintenanceByID(ctx context.Context, id valuer.U
 		return nil, r.sqlstore.WrapNotFoundErrf(err, errors.CodeNotFound, "planned maintenance with ID: %s does not exist", id.StringValue())
 	}
 
-	return storableMaintenanceRule.ToPlannedMaintenance()
+	return storableMaintenanceRule.ToPlannedMaintenance(), nil
 }
 
 func (r *maintenance) CreatePlannedMaintenance(ctx context.Context, maintenance *alertmanagertypes.PostablePlannedMaintenance) (*alertmanagertypes.PlannedMaintenance, error) {
@@ -78,11 +73,6 @@ func (r *maintenance) CreatePlannedMaintenance(ctx context.Context, maintenance
 		return nil, err
 	}
 
-	schedule, err := json.Marshal(maintenance.Schedule)
-	if err != nil {
-		return nil, err
-	}
-
 	storablePlannedMaintenance := alertmanagertypes.StorablePlannedMaintenance{
 		Identifiable: types.Identifiable{
 			ID: valuer.GenerateUUID(),
@@ -97,7 +87,7 @@ func (r *maintenance) CreatePlannedMaintenance(ctx context.Context, maintenance
 		},
 		Name:        maintenance.Name,
 		Description: maintenance.Description,
-		Schedule:    string(schedule),
+		Schedule:    maintenance.Schedule,
 		OrgID:       claims.OrgID,
 		Scope:       maintenance.Scope,
 	}
@@ -145,21 +135,18 @@ func (r *maintenance) CreatePlannedMaintenance(ctx context.Context, maintenance
 		return nil, err
 	}
 
-	pm := &alertmanagertypes.PlannedMaintenance{
+	return &alertmanagertypes.PlannedMaintenance{
 		ID:          storablePlannedMaintenance.ID,
 		Name:        storablePlannedMaintenance.Name,
 		Description: storablePlannedMaintenance.Description,
+		Schedule:    storablePlannedMaintenance.Schedule,
 		RuleIDs:     maintenance.AlertIds,
 		Scope:       maintenance.Scope,
 		CreatedAt:   storablePlannedMaintenance.CreatedAt,
 		CreatedBy:   storablePlannedMaintenance.CreatedBy,
 		UpdatedAt:   storablePlannedMaintenance.UpdatedAt,
 		UpdatedBy:   storablePlannedMaintenance.UpdatedBy,
-	}
-	if err = json.Unmarshal([]byte(storablePlannedMaintenance.Schedule), &pm.Schedule); err != nil {
-		return nil, err
-	}
-	return pm, nil
+	}, nil
 }
 
 func (r *maintenance) DeletePlannedMaintenance(ctx context.Context, id valuer.UUID) error {
@@ -187,11 +174,6 @@ func (r *maintenance) UpdatePlannedMaintenance(ctx context.Context, maintenance
 		return err
 	}
 
-	schedule, err := json.Marshal(maintenance.Schedule)
-	if err != nil {
-		return err
-	}
-
 	storablePlannedMaintenance := alertmanagertypes.StorablePlannedMaintenance{
 		Identifiable: types.Identifiable{
 			ID: id,
@@ -206,7 +188,7 @@ func (r *maintenance) UpdatePlannedMaintenance(ctx context.Context, maintenance
 		},
 		Name:        maintenance.Name,
 		Description: maintenance.Description,
-		Schedule:    string(schedule),
+		Schedule:    maintenance.Schedule,
 		OrgID:       claims.OrgID,
 		Scope:       maintenance.Scope,
 	}

pkg/alertmanager/alertmanagerstore/sqlalertmanagerstore/maintenance_test.go

@@ -1,94 +0,0 @@
-package sqlalertmanagerstore
-
-import (
-	"path/filepath"
-	"testing"
-	"time"
-
-	"github.com/stretchr/testify/assert"
-	"github.com/stretchr/testify/require"
-
-	"github.com/SigNoz/signoz/pkg/factory/factorytest"
-	"github.com/SigNoz/signoz/pkg/sqlstore"
-	"github.com/SigNoz/signoz/pkg/sqlstore/sqlitesqlstore"
-	"github.com/SigNoz/signoz/pkg/types"
-	"github.com/SigNoz/signoz/pkg/types/alertmanagertypes"
-	"github.com/SigNoz/signoz/pkg/valuer"
-)
-
-func newTestStore(t *testing.T) sqlstore.SQLStore {
-	t.Helper()
-	store, err := sqlitesqlstore.New(t.Context(), factorytest.NewSettings(), sqlstore.Config{
-		Provider: "sqlite",
-		Connection: sqlstore.ConnectionConfig{
-			MaxOpenConns:    1,
-			MaxConnLifetime: 0,
-		},
-		Sqlite: sqlstore.SqliteConfig{
-			Path:            filepath.Join(t.TempDir(), "test.db"),
-			Mode:            "wal",
-			BusyTimeout:     5 * time.Second,
-			TransactionMode: "deferred",
-		},
-	})
-	require.NoError(t, err)
-
-	_, err = store.BunDB().NewCreateTable().
-		Model((*alertmanagertypes.StorablePlannedMaintenance)(nil)).
-		IfNotExists().
-		Exec(t.Context())
-	require.NoError(t, err)
-
-	_, err = store.BunDB().NewCreateTable().
-		Model((*alertmanagertypes.StorablePlannedMaintenanceRule)(nil)).
-		IfNotExists().
-		Exec(t.Context())
-	require.NoError(t, err)
-
-	return store
-}
-
-// TestListPlannedMaintenanceSkipsInvalid asserts that a single corrupt record
-// (here, an unloadable timezone) is skipped rather than failing the whole list.
-func TestListPlannedMaintenanceSkipsInvalid(t *testing.T) {
-	store := newTestStore(t)
-	orgID := valuer.GenerateUUID().StringValue()
-	now := time.Now().UTC()
-
-	valid := &alertmanagertypes.StorablePlannedMaintenance{
-		Identifiable:  types.Identifiable{ID: valuer.GenerateUUID()},
-		TimeAuditable: types.TimeAuditable{CreatedAt: now, UpdatedAt: now},
-		Name:          "valid",
-		Schedule:      `{"timezone":"UTC","startTime":"2024-01-01T12:00:00Z","recurrence":{"duration":"2h","repeatType":"daily"}}`,
-		OrgID:         orgID,
-	}
-	result, err := store.BunDB().NewInsert().Model(valid).Exec(t.Context())
-	require.NoError(t, err)
-	rowsAffected, err := result.RowsAffected()
-	require.NoError(t, err)
-	require.Equal(t, int64(1), rowsAffected)
-
-	// A schedule with "zero" startTime
-	invalid := &alertmanagertypes.StorablePlannedMaintenance{
-		Identifiable: types.Identifiable{ID: valuer.GenerateUUID()},
-		TimeAuditable: types.TimeAuditable{
-			CreatedAt: now,
-			UpdatedAt: now,
-		},
-		Name:     "invalid",
-		Schedule: `{"timezone":"UTC","recurrence":{"duration":"2h","repeatType":"daily"}}`,
-		OrgID:    orgID,
-	}
-	result, err = store.BunDB().NewInsert().Model(invalid).Exec(t.Context())
-	require.NoError(t, err)
-	rowsAffected, err = result.RowsAffected()
-	require.NoError(t, err)
-	require.Equal(t, int64(1), rowsAffected)
-
-	maintenanceStore := NewMaintenanceStore(store, factorytest.NewSettings())
-
-	list, err := maintenanceStore.ListPlannedMaintenance(t.Context(), orgID)
-	require.NoError(t, err)
-	require.Len(t, list, 1)
-	assert.Equal(t, valid.ID, list[0].ID)
-}

pkg/alertmanager/config_test.go

@@ -3,8 +3,6 @@ package alertmanager
 import (
 	"context"
 	"net/url"
-	"os"
-	"strings"
 	"testing"
 	"time"
 
@@ -16,23 +14,7 @@ import (
 	"github.com/stretchr/testify/require"
 )
 
-const prefix = "SIGNOZ_"
-
-// clearSignozEnv unsets all existing SIGNOZ_* env vars for the duration of the test.
-func clearSignozEnv(t *testing.T) {
-	t.Helper()
-	for _, kv := range os.Environ() {
-		if strings.HasPrefix(kv, prefix) {
-			key := strings.SplitN(kv, "=", 2)[0]
-			orig, _ := os.LookupEnv(key)
-			_ = os.Unsetenv(key)
-			t.Cleanup(func() { _ = os.Setenv(key, orig) })
-		}
-	}
-}
-
 func TestNewWithEnvProvider(t *testing.T) {
-	clearSignozEnv(t)
 	t.Setenv("SIGNOZ_ALERTMANAGER_PROVIDER", "signoz")
 	t.Setenv("SIGNOZ_ALERTMANAGER_LEGACY_API__URL", "http://localhost:9093/api")
 	t.Setenv("SIGNOZ_ALERTMANAGER_SIGNOZ_ROUTE_REPEAT__INTERVAL", "5m")

pkg/config/envprovider/provider_test.go

@@ -18,8 +18,8 @@ func clearSignozEnv(t *testing.T) {
 		if strings.HasPrefix(kv, prefix) {
 			key := strings.SplitN(kv, "=", 2)[0]
 			orig, _ := os.LookupEnv(key)
-			_ = os.Unsetenv(key)
-			t.Cleanup(func() { _ = os.Setenv(key, orig) })
+			os.Unsetenv(key)
+			t.Cleanup(func() { os.Setenv(key, orig) })
 		}
 	}
 }

pkg/querier/consume.go

@@ -62,7 +62,7 @@ func readAsTimeSeries(rows driver.Rows, queryWindow *qbtypes.TimeRange, step qbt
 	numericColsCount := 0
 	for i, ct := range colTypes {
 		slots[i] = reflect.New(ct.ScanType()).Interface()
-		if isNumericKind(ct.ScanType()) {
+		if numericKind(ct.ScanType().Kind()) {
 			numericColsCount++
 		}
 	}
@@ -270,14 +270,8 @@ func readAsTimeSeries(rows driver.Rows, queryWindow *qbtypes.TimeRange, step qbt
 	}, nil
 }
 
-func isNumericKind(t reflect.Type) bool {
-	if t == nil {
-		return false
-	}
-	for t.Kind() == reflect.Ptr || t.Kind() == reflect.UnsafePointer {
-		t = t.Elem()
-	}
-	switch t.Kind() {
+func numericKind(k reflect.Kind) bool {
+	switch k {
 	case reflect.Float32, reflect.Float64,
 		reflect.Int, reflect.Int8, reflect.Int16, reflect.Int32, reflect.Int64,
 		reflect.Uint, reflect.Uint8, reflect.Uint16, reflect.Uint32, reflect.Uint64:
@@ -296,13 +290,7 @@ func readAsScalar(rows driver.Rows, queryName string) (*qbtypes.ScalarData, erro
 	var aggIndex int64
 	for i, name := range colNames {
 		colType := qbtypes.ColumnTypeGroup
-		// Builder queries aliases aggregation columns as __result_N (always numeric) and wraps group-by keys with toString (always string);
-		// Raw ClickHouse queries may use any aliases.
-		// Handling Builder queries, If name like __result_N -> aggregation, otherwise group-by column
-		// Handling Raw ClickHouse queries, If type is numeric -> aggregation, otherwise group-by column
-		// NOTE: For clickhouse queries, its wrong to assume that numeric columns are always aggregations, user might be grouping by on integer status_code.
-		// However, we are fine with this for now. If need arises, simplest way would be to solve this on the frontend side by asking user a mapping of column names to column types.
-		if aggRe.MatchString(name) || isNumericKind(colTypes[i].ScanType()) {
+		if aggRe.MatchString(name) {
 			colType = qbtypes.ColumnTypeAggregation
 		}
 		cd[i] = &qbtypes.ColumnDescriptor{

pkg/signoz/provider.go

@@ -213,7 +213,6 @@ func NewSQLMigrationProviderFactories(
 		sqlmigration.NewCloudIntegrationRemoveCascadeDeleteFactory(sqlschema),
 		sqlmigration.NewAddUserDashboardPreferenceFactory(sqlstore, sqlschema),
 		sqlmigration.NewRecreateUserDashboardPreferenceFactory(sqlstore, sqlschema),
-		sqlmigration.NewMigrateRecurrenceBoundsFactory(sqlstore),
 	)
 }
 

pkg/sqlmigration/027_update_rules.go

@@ -11,6 +11,7 @@ import (
 	"github.com/SigNoz/signoz/pkg/factory"
 	"github.com/SigNoz/signoz/pkg/sqlstore"
 	"github.com/SigNoz/signoz/pkg/types"
+	"github.com/SigNoz/signoz/pkg/types/alertmanagertypes"
 	"github.com/SigNoz/signoz/pkg/valuer"
 	"github.com/uptrace/bun"
 	"github.com/uptrace/bun/migrate"
@@ -56,15 +57,15 @@ type newRule struct {
 
 type existingMaintenance struct {
 	bun.BaseModel `bun:"table:planned_maintenance"`
-	ID            int       `bun:"id,pk,autoincrement"`
-	Name          string    `bun:"name,type:text,notnull"`
-	Description   string    `bun:"description,type:text"`
-	AlertIDs      *AlertIds `bun:"alert_ids,type:text"`
-	Schedule      *schedule `bun:"schedule,type:text,notnull"`
-	CreatedAt     time.Time `bun:"created_at,type:datetime,notnull"`
-	CreatedBy     string    `bun:"created_by,type:text,notnull"`
-	UpdatedAt     time.Time `bun:"updated_at,type:datetime,notnull"`
-	UpdatedBy     string    `bun:"updated_by,type:text,notnull"`
+	ID            int                 `bun:"id,pk,autoincrement"`
+	Name          string              `bun:"name,type:text,notnull"`
+	Description   string              `bun:"description,type:text"`
+	AlertIDs      *AlertIds           `bun:"alert_ids,type:text"`
+	Schedule      *alertmanagertypes.Schedule `bun:"schedule,type:text,notnull"`
+	CreatedAt     time.Time           `bun:"created_at,type:datetime,notnull"`
+	CreatedBy     string              `bun:"created_by,type:text,notnull"`
+	UpdatedAt     time.Time           `bun:"updated_at,type:datetime,notnull"`
+	UpdatedBy     string              `bun:"updated_by,type:text,notnull"`
 }
 
 type newMaintenance struct {
@@ -72,10 +73,10 @@ type newMaintenance struct {
 	types.Identifiable
 	types.TimeAuditable
 	types.UserAuditable
-	Name        string    `bun:"name,type:text,notnull"`
-	Description string    `bun:"description,type:text"`
-	Schedule    *schedule `bun:"schedule,type:text,notnull"`
-	OrgID       string    `bun:"org_id,type:text"`
+	Name        string              `bun:"name,type:text,notnull"`
+	Description string              `bun:"description,type:text"`
+	Schedule    *alertmanagertypes.Schedule `bun:"schedule,type:text,notnull"`
+	OrgID       string              `bun:"org_id,type:text"`
 }
 
 type storablePlannedMaintenanceRule struct {
@@ -91,21 +92,6 @@ type ruleHistory struct {
 	RuleUUID      valuer.UUID `bun:"rule_uuid"`
 }
 
-type schedule struct {
-	Timezone   string      `json:"timezone"`
-	StartTime  time.Time   `json:"startTime"`
-	EndTime    time.Time   `json:"endTime,omitzero"`
-	Recurrence *recurrence `json:"recurrence"`
-}
-
-type recurrence struct {
-	StartTime  time.Time           `json:"startTime"`
-	EndTime    time.Time           `json:"endTime,omitzero"`
-	Duration   valuer.TextDuration `json:"duration"`
-	RepeatType string              `json:"repeatType"`
-	RepeatOn   []string            `json:"repeatOn"`
-}
-
 func NewUpdateRulesFactory(sqlstore sqlstore.SQLStore) factory.ProviderFactory[SQLMigration, Config] {
 	return factory.NewProviderFactory(factory.MustNewName("update_rules"), func(ctx context.Context, ps factory.ProviderSettings, c Config) (SQLMigration, error) {
 		return newUpdateRules(ctx, ps, c, sqlstore)

pkg/sqlmigration/094_migrate_recurrence_bounds.go

@@ -1,128 +0,0 @@
-package sqlmigration
-
-import (
-	"context"
-	"encoding/json"
-	"log/slog"
-
-	"github.com/SigNoz/signoz/pkg/errors"
-	"github.com/SigNoz/signoz/pkg/factory"
-	"github.com/SigNoz/signoz/pkg/sqlstore"
-	"github.com/uptrace/bun"
-	"github.com/uptrace/bun/migrate"
-)
-
-type migrateRecurrenceBounds struct {
-	sqlstore sqlstore.SQLStore
-	logger   *slog.Logger
-}
-
-type plannedMaintenanceScheduleRow struct {
-	bun.BaseModel `bun:"table:planned_maintenance"`
-
-	ID       string `bun:"id"`
-	Schedule string `bun:"schedule"`
-}
-
-func NewMigrateRecurrenceBoundsFactory(sqlstore sqlstore.SQLStore) factory.ProviderFactory[SQLMigration, Config] {
-	return factory.NewProviderFactory(
-		factory.MustNewName("migrate_recurrence_bounds"),
-		func(ctx context.Context, ps factory.ProviderSettings, c Config) (SQLMigration, error) {
-			return &migrateRecurrenceBounds{sqlstore: sqlstore, logger: ps.Logger}, nil
-		},
-	)
-}
-
-func (migration *migrateRecurrenceBounds) Register(migrations *migrate.Migrations) error {
-	if err := migrations.Register(migration.Up, migration.Down); err != nil {
-		return err
-	}
-	return nil
-}
-
-// Up moves the start/end bounds of a recurring planned maintenance from the
-// nested recurrence object up to the schedule level. Until now both the
-// schedule and its recurrence carried their own startTime/endTime, with the
-// recurrence values taking precedence when a recurrence was present. The
-// recurrence fields are being dropped, so the recurrence bounds (the source of
-// truth for recurring maintenances) are promoted to the schedule before the
-// struct loses those fields.
-//
-// We deliberately operate on the raw JSON instead of the Recurrence struct:
-// that struct loses its StartTime/EndTime fields in the same change set, so it
-// can no longer read the values this migration needs to move.
-func (migration *migrateRecurrenceBounds) Up(ctx context.Context, db *bun.DB) error {
-	tx, err := db.BeginTx(ctx, nil)
-	if err != nil {
-		return err
-	}
-
-	defer func() {
-		_ = tx.Rollback()
-	}()
-
-	rows := make([]*plannedMaintenanceScheduleRow, 0)
-	if err := tx.NewSelect().Model(&rows).Scan(ctx); err != nil {
-		return err
-	}
-
-	for _, row := range rows {
-		schedule := make(map[string]json.RawMessage)
-		if err := json.Unmarshal([]byte(row.Schedule), &schedule); err != nil {
-			// A single corrupt row must not abort the whole migration (which would block startup).
-			migration.logger.WarnContext(ctx, "skipping planned maintenance with unreadable schedule", slog.String("maintenance_id", row.ID), errors.Attr(err))
-			continue
-		}
-
-		recurrenceRaw, ok := schedule["recurrence"]
-		if !ok || string(recurrenceRaw) == "null" {
-			continue
-		}
-
-		recurrence := make(map[string]json.RawMessage)
-		if err := json.Unmarshal(recurrenceRaw, &recurrence); err != nil {
-			migration.logger.WarnContext(ctx, "skipping planned maintenance with unreadable recurrence", slog.String("maintenance_id", row.ID), errors.Attr(err))
-			continue
-		}
-
-		// Promote the recurrence bounds (source of truth) to the schedule
-		// level, then drop them from the recurrence.
-		if startTime, ok := recurrence["startTime"]; ok {
-			schedule["startTime"] = startTime
-			delete(recurrence, "startTime")
-		}
-		if endTime, ok := recurrence["endTime"]; ok && string(endTime) != "null" {
-			schedule["endTime"] = endTime
-		} else {
-			// The recurrence had no end time, so the schedule must not carry
-			// a stale one duplicated by the UI.
-			delete(schedule, "endTime")
-		}
-		delete(recurrence, "endTime")
-
-		newRecurrence, err := json.Marshal(recurrence)
-		if err != nil {
-			return err
-		}
-		schedule["recurrence"] = newRecurrence
-
-		newSchedule, err := json.Marshal(schedule)
-		if err != nil {
-			return err
-		}
-
-		if _, err := tx.NewUpdate().
-			Model((*plannedMaintenanceScheduleRow)(nil)).
-			Set("schedule = ?", string(newSchedule)).
-			Where("id = ?", row.ID).
-			Exec(ctx); err != nil {
-			return err
-		}
-	}
-
-	return tx.Commit()
-}
-
-func (migration *migrateRecurrenceBounds) Down(context.Context, *bun.DB) error {
-	return nil
-}

pkg/types/alertmanagertypes/maintenance.go

@@ -3,7 +3,6 @@ package alertmanagertypes
 import (
 	"context"
 	"encoding/json"
-	"slices"
 	"time"
 
 	"github.com/expr-lang/expr"
@@ -60,11 +59,11 @@ type StorablePlannedMaintenance struct {
 	types.Identifiable
 	types.TimeAuditable
 	types.UserAuditable
-	Name        string `bun:"name,type:text,notnull"`
-	Description string `bun:"description,type:text"`
-	Schedule    string `bun:"schedule,type:text,notnull"`
-	OrgID       string `bun:"org_id,type:text"`
-	Scope       string `bun:"scope,type:text"`
+	Name        string    `bun:"name,type:text,notnull"`
+	Description string    `bun:"description,type:text"`
+	Schedule    *Schedule `bun:"schedule,type:text,notnull"`
+	OrgID       string    `bun:"org_id,type:text"`
+	Scope       string    `bun:"scope,type:text"`
 }
 
 type PlannedMaintenance struct {
@@ -100,9 +99,18 @@ func (p *PostablePlannedMaintenance) Validate() error {
 	if p.Schedule == nil {
 		return errors.Newf(errors.TypeInvalidInput, ErrCodeInvalidPlannedMaintenancePayload, "missing schedule in the payload")
 	}
+	if p.Schedule.Timezone == "" {
+		return errors.Newf(errors.TypeInvalidInput, ErrCodeInvalidPlannedMaintenancePayload, "missing timezone in the payload")
+	}
 
-	if !p.Schedule.EndTime.IsZero() && p.Schedule.StartTime.After(p.Schedule.EndTime) {
-		return errors.Newf(errors.TypeInvalidInput, ErrCodeInvalidPlannedMaintenancePayload, "start time cannot be after end time")
+	if _, err := time.LoadLocation(p.Schedule.Timezone); err != nil {
+		return errors.Newf(errors.TypeInvalidInput, ErrCodeInvalidPlannedMaintenancePayload, "invalid timezone in the payload")
+	}
+
+	if !p.Schedule.StartTime.IsZero() && !p.Schedule.EndTime.IsZero() {
+		if p.Schedule.StartTime.After(p.Schedule.EndTime) {
+			return errors.Newf(errors.TypeInvalidInput, ErrCodeInvalidPlannedMaintenancePayload, "start time cannot be after end time")
+		}
 	}
 
 	if p.Schedule.Recurrence != nil {
@@ -112,6 +120,9 @@ func (p *PostablePlannedMaintenance) Validate() error {
 		if p.Schedule.Recurrence.Duration.IsZero() {
 			return errors.Newf(errors.TypeInvalidInput, ErrCodeInvalidPlannedMaintenancePayload, "missing duration in the payload")
 		}
+		if p.Schedule.Recurrence.EndTime != nil && p.Schedule.Recurrence.EndTime.Before(p.Schedule.Recurrence.StartTime) {
+			return errors.Newf(errors.TypeInvalidInput, ErrCodeInvalidPlannedMaintenancePayload, "end time cannot be before start time")
+		}
 	}
 	if p.Scope != "" {
 		if _, err := expr.Compile(p.Scope, expr.AllowUndefinedVariables(), expr.AsBool()); err != nil {
@@ -137,85 +148,134 @@ type PlannedMaintenanceWithRules struct {
 	Rules                       []*StorablePlannedMaintenanceRule `bun:"rel:has-many,join:id=planned_maintenance_id"`
 }
 
-// AppliesTo reports whether this maintenance applies to the given rule.
-// An empty RuleIDs set means the maintenance applies to all rules.
-func (m *PlannedMaintenance) AppliesTo(ruleID string) bool {
-	return len(m.RuleIDs) == 0 || slices.Contains(m.RuleIDs, ruleID)
+// HasScheduleRecurrenceBoundsMismatch reports whether a recurring maintenance
+// has different start/end bounds in Schedule and Schedule.Recurrence.
+//
+// This is used to detect if there are any entries with recurrence that don't
+// have the same timestamps stored at the schedule-level.
+// UI payloads duplicated those values in both places, but direct API users may
+// have stored bounds that are missing from, or different than, the schedule-level bounds.
+// We need to observe these before we can safely drop Recurrence.StartTime and
+// Recurrence.EndTime.
+func (m *PlannedMaintenance) HasScheduleRecurrenceBoundsMismatch() bool {
+	recurrence := m.Schedule.Recurrence
+	if recurrence == nil {
+		return false
+	}
+
+	return !recurrence.StartTime.Equal(m.Schedule.StartTime) ||
+		(recurrence.EndTime == nil && !m.Schedule.EndTime.IsZero()) ||
+		(recurrence.EndTime != nil && !recurrence.EndTime.Equal(m.Schedule.EndTime))
 }
 
 func (m *PlannedMaintenance) ShouldSkip(ruleID string, now time.Time, lset model.LabelSet) (bool, error) {
-	if !m.AppliesTo(ruleID) || !m.IsActive(now) {
+	// Check if the alert ID is in the maintenance window
+	found := false
+	if len(m.RuleIDs) > 0 {
+		for _, alertID := range m.RuleIDs {
+			if alertID == ruleID {
+				found = true
+				break
+			}
+		}
+	}
+	// If no alert ids, then skip all alerts
+	if len(m.RuleIDs) == 0 {
+		found = true
+	}
+
+	if !found {
+		return false, nil
+	}
+
+	if !m.IsActive(now) {
 		return false, nil
 	}
 
 	if m.Scope != "" {
-		skip, err := EvalScopeExpression(m.Scope, lset)
-		if err != nil || !skip {
+		result, err := EvalScopeExpression(m.Scope, lset)
+		if err != nil {
 			return false, err
 		}
+		if !result {
+			return false, nil
+		}
 	}
 	return true, nil
 }
 
 // IsActive reports whether [now] falls inside the maintenance window's schedule.
 func (m *PlannedMaintenance) IsActive(now time.Time) bool {
-	// Check if maintenance window has not started yet
-	if now.Before(m.Schedule.StartTime) {
-		return false
-	}
-
-	// Check if maintenance window has expired
-	if !m.Schedule.EndTime.IsZero() && now.After(m.Schedule.EndTime) {
-		return false
-	}
-
-	// Fixed schedule
-	if m.Schedule.Recurrence == nil {
-		return true
-	}
-
+	// If alert is found, we check if it should be skipped based on the schedule
 	loc, err := time.LoadLocation(m.Schedule.Timezone)
 	if err != nil {
 		return false
 	}
 
-	switch m.Schedule.Recurrence.RepeatType {
-	case RepeatTypeDaily:
-		return m.checkDaily(now, loc)
-	case RepeatTypeWeekly:
-		return m.checkWeekly(now, loc)
-	case RepeatTypeMonthly:
-		return m.checkMonthly(now, loc)
-	default:
-		return false
+	startTime := m.Schedule.StartTime
+	endTime := m.Schedule.EndTime
+	recurrence := m.Schedule.Recurrence
+
+	// fixed schedule — only when no recurrence is configured.
+	// When recurrence is set, the recurring check below handles everything;
+	// falling through here would cause the window to match the absolute
+	// StartTime–EndTime range instead of the daily/weekly/monthly pattern.
+	if recurrence == nil && !startTime.IsZero() && !endTime.IsZero() {
+		if now.Equal(startTime) || now.Equal(endTime) ||
+			(now.After(startTime) && now.Before(endTime)) {
+			return true
+		}
 	}
+
+	// recurring schedule
+	if recurrence != nil {
+		// Make sure the recurrence has started
+		if now.Before(recurrence.StartTime) {
+			return false
+		}
+
+		// Check if recurrence has expired
+		if recurrence.EndTime != nil {
+			if !recurrence.EndTime.IsZero() && now.After(*recurrence.EndTime) {
+				return false
+			}
+		}
+
+		currentTime := now.In(loc)
+		switch recurrence.RepeatType {
+		case RepeatTypeDaily:
+			return m.checkDaily(currentTime, recurrence, loc)
+		case RepeatTypeWeekly:
+			return m.checkWeekly(currentTime, recurrence, loc)
+		case RepeatTypeMonthly:
+			return m.checkMonthly(currentTime, recurrence, loc)
+		}
+	}
+
+	return false
 }
 
 // checkDaily rebases the recurrence start to today (or yesterday if needed)
 // and returns true if currentTime is within [candidate, candidate+Duration].
-func (m *PlannedMaintenance) checkDaily(currentTime time.Time, loc *time.Location) bool {
-	currentTime = currentTime.In(loc)
+func (m *PlannedMaintenance) checkDaily(currentTime time.Time, rec *Recurrence, loc *time.Location) bool {
 	candidate := time.Date(
 		currentTime.Year(), currentTime.Month(), currentTime.Day(),
-		m.Schedule.StartTime.Hour(), m.Schedule.StartTime.Minute(), 0, 0,
+		rec.StartTime.Hour(), rec.StartTime.Minute(), 0, 0,
 		loc,
 	)
 	if candidate.After(currentTime) {
 		candidate = candidate.AddDate(0, 0, -1)
 	}
-	return currentTime.Sub(candidate) <= m.Schedule.Recurrence.Duration.Duration()
+	return currentTime.Sub(candidate) <= rec.Duration.Duration()
 }
 
 // checkWeekly finds the most recent allowed occurrence by rebasing the recurrence’s
 // time-of-day onto the allowed weekday. It does this for each allowed day and returns true
 // if the current time falls within the candidate window.
-func (m *PlannedMaintenance) checkWeekly(currentTime time.Time, loc *time.Location) bool {
-	currentTime = currentTime.In(loc)
-	rec := m.Schedule.Recurrence
-
+func (m *PlannedMaintenance) checkWeekly(currentTime time.Time, rec *Recurrence, loc *time.Location) bool {
 	// If no days specified, treat as every day (like daily).
 	if len(rec.RepeatOn) == 0 {
-		return m.checkDaily(currentTime, loc)
+		return m.checkDaily(currentTime, rec, loc)
 	}
 
 	for _, day := range rec.RepeatOn {
@@ -228,7 +288,7 @@ func (m *PlannedMaintenance) checkWeekly(currentTime time.Time, loc *time.Locati
 		// Build a candidate occurrence by rebasing today's date to the allowed weekday.
 		candidate := time.Date(
 			currentTime.Year(), currentTime.Month(), currentTime.Day(),
-			m.Schedule.StartTime.Hour(), m.Schedule.StartTime.Minute(), 0, 0,
+			rec.StartTime.Hour(), rec.StartTime.Minute(), 0, 0,
 			loc,
 		).AddDate(0, 0, delta)
 		// If the candidate is in the future, subtract 7 days.
@@ -244,10 +304,8 @@ func (m *PlannedMaintenance) checkWeekly(currentTime time.Time, loc *time.Locati
 
 // checkMonthly rebases the candidate occurrence using the recurrence's day-of-month.
 // If the candidate for the current month is in the future, it uses the previous month.
-func (m *PlannedMaintenance) checkMonthly(currentTime time.Time, loc *time.Location) bool {
-	currentTime = currentTime.In(loc)
-	startTime := m.Schedule.StartTime
-	refDay := startTime.Day()
+func (m *PlannedMaintenance) checkMonthly(currentTime time.Time, rec *Recurrence, loc *time.Location) bool {
+	refDay := rec.StartTime.Day()
 	year, month, _ := currentTime.Date()
 	lastDay := time.Date(year, month+1, 0, 0, 0, 0, 0, loc).Day()
 	day := refDay
@@ -255,7 +313,7 @@ func (m *PlannedMaintenance) checkMonthly(currentTime time.Time, loc *time.Locat
 		day = lastDay
 	}
 	candidate := time.Date(year, month, day,
-		startTime.Hour(), startTime.Minute(), startTime.Second(), startTime.Nanosecond(),
+		rec.StartTime.Hour(), rec.StartTime.Minute(), rec.StartTime.Second(), rec.StartTime.Nanosecond(),
 		loc,
 	)
 	if candidate.After(currentTime) {
@@ -265,30 +323,33 @@ func (m *PlannedMaintenance) checkMonthly(currentTime time.Time, loc *time.Locat
 		lastDayPrev := time.Date(y, m+1, 0, 0, 0, 0, 0, loc).Day()
 		if refDay > lastDayPrev {
 			candidate = time.Date(y, m, lastDayPrev,
-				startTime.Hour(), startTime.Minute(), startTime.Second(), startTime.Nanosecond(),
+				rec.StartTime.Hour(), rec.StartTime.Minute(), rec.StartTime.Second(), rec.StartTime.Nanosecond(),
 				loc,
 			)
 		} else {
 			candidate = time.Date(y, m, refDay,
-				startTime.Hour(), startTime.Minute(), startTime.Second(), startTime.Nanosecond(),
+				rec.StartTime.Hour(), rec.StartTime.Minute(), rec.StartTime.Second(), rec.StartTime.Nanosecond(),
 				loc,
 			)
 		}
 	}
-	return currentTime.Sub(candidate) <= m.Schedule.Recurrence.Duration.Duration()
+	return currentTime.Sub(candidate) <= rec.Duration.Duration()
 }
 
 func (m *PlannedMaintenance) IsUpcoming() bool {
-	now := time.Now()
-
-	if m.IsRecurring() {
-		// Note: this would return true even if the maintenance is active.
-		// This isn't an issue right now because the only usage happens after the `IsActive` check.
-		return m.Schedule.EndTime.IsZero() || now.Before(m.Schedule.EndTime)
+	loc, err := time.LoadLocation(m.Schedule.Timezone)
+	if err != nil {
+		return false
 	}
+	now := time.Now().In(loc)
 
-	// Fixed schedule
-	return now.Before(m.Schedule.StartTime)
+	if !m.Schedule.StartTime.IsZero() && !m.Schedule.EndTime.IsZero() {
+		return now.Before(m.Schedule.StartTime)
+	}
+	if m.Schedule.Recurrence != nil {
+		return now.Before(m.Schedule.Recurrence.StartTime)
+	}
+	return false
 }
 
 func (m *PlannedMaintenance) IsRecurring() bool {
@@ -302,8 +363,19 @@ func (m *PlannedMaintenance) Validate() error {
 	if m.Schedule == nil {
 		return errors.Newf(errors.TypeInvalidInput, ErrCodeInvalidPlannedMaintenancePayload, "missing schedule in the payload")
 	}
-	if !m.Schedule.EndTime.IsZero() && m.Schedule.StartTime.After(m.Schedule.EndTime) {
-		return errors.Newf(errors.TypeInvalidInput, ErrCodeInvalidPlannedMaintenancePayload, "start time cannot be after end time")
+	if m.Schedule.Timezone == "" {
+		return errors.Newf(errors.TypeInvalidInput, ErrCodeInvalidPlannedMaintenancePayload, "missing timezone in the payload")
+	}
+
+	_, err := time.LoadLocation(m.Schedule.Timezone)
+	if err != nil {
+		return errors.Newf(errors.TypeInvalidInput, ErrCodeInvalidPlannedMaintenancePayload, "invalid timezone in the payload")
+	}
+
+	if !m.Schedule.StartTime.IsZero() && !m.Schedule.EndTime.IsZero() {
+		if m.Schedule.StartTime.After(m.Schedule.EndTime) {
+			return errors.Newf(errors.TypeInvalidInput, ErrCodeInvalidPlannedMaintenancePayload, "start time cannot be after end time")
+		}
 	}
 
 	if m.Schedule.Recurrence != nil {
@@ -313,31 +385,28 @@ func (m *PlannedMaintenance) Validate() error {
 		if m.Schedule.Recurrence.Duration.IsZero() {
 			return errors.Newf(errors.TypeInvalidInput, ErrCodeInvalidPlannedMaintenancePayload, "missing duration in the payload")
 		}
-	}
-	if m.Scope != "" {
-		if _, err := expr.Compile(m.Scope, expr.AllowUndefinedVariables(), expr.AsBool()); err != nil {
-			err := errors.Newf(
-				errors.TypeInvalidInput, ErrCodeInvalidPlannedMaintenancePayload,
-				"invalid scope: %s", err.Error(),
-			)
-			return err.WithUrl(scopeDocUrl)
+		if m.Schedule.Recurrence.EndTime != nil && m.Schedule.Recurrence.EndTime.Before(m.Schedule.Recurrence.StartTime) {
+			return errors.Newf(errors.TypeInvalidInput, ErrCodeInvalidPlannedMaintenancePayload, "end time cannot be before start time")
 		}
 	}
 	return nil
 }
 
 func (m PlannedMaintenance) MarshalJSON() ([]byte, error) {
+	now := time.Now().In(time.FixedZone(m.Schedule.Timezone, 0))
 	var status MaintenanceStatus
-	if m.IsActive(time.Now()) {
+	if m.IsActive(now) {
 		status = MaintenanceStatusActive
 	} else if m.IsUpcoming() {
 		status = MaintenanceStatusUpcoming
 	} else {
 		status = MaintenanceStatusExpired
 	}
+	var kind MaintenanceKind
 
-	kind := MaintenanceKindFixed
-	if m.Schedule.Recurrence != nil {
+	if !m.Schedule.StartTime.IsZero() && !m.Schedule.EndTime.IsZero() && m.Schedule.EndTime.After(m.Schedule.StartTime) {
+		kind = MaintenanceKindFixed
+	} else {
 		kind = MaintenanceKindRecurring
 	}
 
@@ -370,29 +439,26 @@ func (m PlannedMaintenance) MarshalJSON() ([]byte, error) {
 	})
 }
 
-func (m *PlannedMaintenanceWithRules) ToPlannedMaintenance() (*PlannedMaintenance, error) {
-	schedule := &Schedule{}
-	if err := json.Unmarshal([]byte(m.Schedule), &schedule); err != nil {
-		return nil, err
-	}
-
-	ruleIDs := make([]string, 0, len(m.Rules))
-	for _, storableMaintenanceRule := range m.Rules {
-		ruleIDs = append(ruleIDs, storableMaintenanceRule.RuleID.StringValue())
+func (m *PlannedMaintenanceWithRules) ToPlannedMaintenance() *PlannedMaintenance {
+	ruleIDs := []string{}
+	if m.Rules != nil {
+		for _, storableMaintenanceRule := range m.Rules {
+			ruleIDs = append(ruleIDs, storableMaintenanceRule.RuleID.StringValue())
+		}
 	}
 
 	return &PlannedMaintenance{
 		ID:          m.ID,
 		Name:        m.Name,
 		Description: m.Description,
-		Schedule:    schedule,
+		Schedule:    m.Schedule,
 		RuleIDs:     ruleIDs,
 		Scope:       m.Scope,
 		CreatedAt:   m.CreatedAt,
 		UpdatedAt:   m.UpdatedAt,
 		CreatedBy:   m.CreatedBy,
 		UpdatedBy:   m.UpdatedBy,
-	}, nil
+	}
 }
 
 type ListPlannedMaintenanceParams struct {

pkg/types/alertmanagertypes/maintenance_test.go

@@ -8,6 +8,11 @@ import (
 	"github.com/prometheus/common/model"
 )
 
+// Helper function to create a time pointer.
+func timePtr(t time.Time) *time.Time {
+	return &t
+}
+
 func TestShouldSkipMaintenance(t *testing.T) {
 	cases := []struct {
 		name        string
@@ -19,9 +24,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "only-on-saturday",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "Europe/London",
-					StartTime: time.Date(2025, 3, 1, 0, 0, 0, 0, time.UTC),
+					Timezone: "Europe/London",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2025, 3, 1, 0, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("24h"),
 						RepeatType: RepeatTypeWeekly,
 						RepeatOn:   []RepeatOn{RepeatOnMonday, RepeatOnTuesday, RepeatOnWednesday, RepeatOnThursday, RepeatOnFriday, RepeatOnSunday},
@@ -36,10 +41,10 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "weekly-across-midnight-previous-day",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 4, 1, 22, 0, 0, 0, time.UTC), // Monday 22:00
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
-						Duration:   valuer.MustParseTextDuration("4h"), // Until Tuesday 02:00
+						StartTime:  time.Date(2024, 4, 1, 22, 0, 0, 0, time.UTC), // Monday 22:00
+						Duration:   valuer.MustParseTextDuration("4h"),           // Until Tuesday 02:00
 						RepeatType: RepeatTypeWeekly,
 						RepeatOn:   []RepeatOn{RepeatOnMonday}, // Only Monday
 					},
@@ -53,10 +58,10 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "weekly-across-midnight-previous-day",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 4, 1, 22, 0, 0, 0, time.UTC), // Monday 22:00
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
-						Duration:   valuer.MustParseTextDuration("4h"), // Until Tuesday 02:00
+						StartTime:  time.Date(2024, 4, 1, 22, 0, 0, 0, time.UTC), // Monday 22:00
+						Duration:   valuer.MustParseTextDuration("4h"),           // Until Tuesday 02:00
 						RepeatType: RepeatTypeWeekly,
 						RepeatOn:   []RepeatOn{RepeatOnMonday}, // Only Monday
 					},
@@ -70,10 +75,10 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "weekly-across-midnight-previous-day",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 4, 1, 22, 0, 0, 0, time.UTC), // Monday 22:00
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
-						Duration:   valuer.MustParseTextDuration("52h"), // Until Thursday 02:00
+						StartTime:  time.Date(2024, 4, 1, 22, 0, 0, 0, time.UTC), // Monday 22:00
+						Duration:   valuer.MustParseTextDuration("52h"),          // Until Thursday 02:00
 						RepeatType: RepeatTypeWeekly,
 						RepeatOn:   []RepeatOn{RepeatOnMonday}, // Only Monday
 					},
@@ -87,10 +92,10 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "weekly-across-midnight-previous-day-not-in-repeaton",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 4, 2, 22, 0, 0, 0, time.UTC), // Tuesday 22:00
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
-						Duration:   valuer.MustParseTextDuration("4h"), // Until Wednesday 02:00
+						StartTime:  time.Date(2024, 4, 2, 22, 0, 0, 0, time.UTC), // Tuesday 22:00
+						Duration:   valuer.MustParseTextDuration("4h"),           // Until Wednesday 02:00
 						RepeatType: RepeatTypeWeekly,
 						RepeatOn:   []RepeatOn{RepeatOnTuesday}, // Only Tuesday
 					},
@@ -104,10 +109,10 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "daily-maintenance-across-midnight",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 1, 23, 0, 0, 0, time.UTC), // 23:00
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
-						Duration:   valuer.MustParseTextDuration("2h"), // Until 01:00 next day
+						StartTime:  time.Date(2024, 1, 1, 23, 0, 0, 0, time.UTC), // 23:00
+						Duration:   valuer.MustParseTextDuration("2h"),           // Until 01:00 next day
 						RepeatType: RepeatTypeDaily,
 					},
 				},
@@ -120,9 +125,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "at-start-time-boundary",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 1, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 1, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeDaily,
 					},
@@ -136,9 +141,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "at-end-time-boundary",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 1, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 1, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeDaily,
 					},
@@ -152,9 +157,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "monthly-multi-day-duration",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 28, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 28, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("72h"), // 3 days
 						RepeatType: RepeatTypeMonthly,
 					},
@@ -168,9 +173,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "weekly-multi-day-duration",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 28, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 28, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("72h"), // 3 days
 						RepeatType: RepeatTypeWeekly,
 						RepeatOn:   []RepeatOn{RepeatOnSunday},
@@ -185,9 +190,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "monthly-crosses-to-next-month",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 30, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 30, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("48h"), // 2 days, crosses to Feb 1
 						RepeatType: RepeatTypeMonthly,
 					},
@@ -201,9 +206,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "timezone-offset-test",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "America/New_York", // UTC-5 or UTC-4 depending on DST
-					StartTime: time.Date(2024, 1, 1, 22, 0, 0, 0, time.FixedZone("America/New_York", -5*3600)),
+					Timezone: "America/New_York", // UTC-5 or UTC-4 depending on DST
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 1, 22, 0, 0, 0, time.FixedZone("America/New_York", -5*3600)),
 						Duration:   valuer.MustParseTextDuration("4h"),
 						RepeatType: RepeatTypeDaily,
 					},
@@ -217,9 +222,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "daily-maintenance-time-outside-window",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 1, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 1, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeDaily,
 					},
@@ -233,10 +238,10 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "recurring-maintenance-with-past-end-date",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 1, 12, 0, 0, 0, time.UTC),
-					EndTime:   time.Date(2024, 1, 10, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 1, 12, 0, 0, 0, time.UTC),
+						EndTime:    timePtr(time.Date(2024, 1, 10, 12, 0, 0, 0, time.UTC)),
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeDaily,
 					},
@@ -250,10 +255,10 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "monthly-maintenance-spans-month-end",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 3, 31, 22, 0, 0, 0, time.UTC), // March 31, 22:00
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
-						Duration:   valuer.MustParseTextDuration("6h"), // Until April 1, 04:00
+						StartTime:  time.Date(2024, 3, 31, 22, 0, 0, 0, time.UTC), // March 31, 22:00
+						Duration:   valuer.MustParseTextDuration("6h"),            // Until April 1, 04:00
 						RepeatType: RepeatTypeMonthly,
 					},
 				},
@@ -266,9 +271,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "weekly-empty-repeaton",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 4, 1, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 4, 1, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeWeekly,
 						RepeatOn:   []RepeatOn{}, // Empty - should apply to all days
@@ -283,9 +288,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "monthly-maintenance-february-fewer-days",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 31, 12, 0, 0, 0, time.UTC), // January 31st
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 31, 12, 0, 0, 0, time.UTC), // January 31st
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeMonthly,
 					},
@@ -298,9 +303,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "daily-maintenance-crosses-midnight",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 1, 23, 30, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 1, 23, 30, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("1h"), // Crosses to 00:30 next day
 						RepeatType: RepeatTypeDaily,
 					},
@@ -313,9 +318,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "monthly-maintenance-crosses-month-end",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 31, 12, 0, 0, 0, time.UTC), // January 31st
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 31, 12, 0, 0, 0, time.UTC), // January 31st
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeMonthly,
 					},
@@ -328,9 +333,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "monthly-maintenance-crosses-month-end-and-duration-is-2-days",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 30, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 30, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("48h"), // 2 days duration
 						RepeatType: RepeatTypeMonthly,
 					},
@@ -343,10 +348,10 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "weekly-maintenance-crosses-midnight",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 4, 1, 23, 0, 0, 0, time.UTC), // Monday 23:00
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
-						Duration:   valuer.MustParseTextDuration("2h"), // Until Tuesday 01:00
+						StartTime:  time.Date(2024, 4, 1, 23, 0, 0, 0, time.UTC), // Monday 23:00
+						Duration:   valuer.MustParseTextDuration("2h"),           // Until Tuesday 01:00
 						RepeatType: RepeatTypeWeekly,
 						RepeatOn:   []RepeatOn{RepeatOnMonday}, // Only Monday
 					},
@@ -359,9 +364,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "monthly-maintenance-crosses-month-end-and-duration-is-2-days",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 31, 12, 0, 0, 0, time.UTC), // January 31st
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 31, 12, 0, 0, 0, time.UTC), // January 31st
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeMonthly,
 					},
@@ -374,9 +379,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "daily-maintenance-crosses-midnight",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 1, 22, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 1, 22, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("4h"), // Until 02:00 next day
 						RepeatType: RepeatTypeDaily,
 					},
@@ -389,9 +394,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "monthly-maintenance-crosses-month-end-and-duration-is-2-hours",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 31, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 31, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeMonthly,
 					},
@@ -440,9 +445,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "recurring maintenance, repeat sunday, saturday, weekly for 24 hours, in Us/Eastern timezone",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "US/Eastern",
-					StartTime: time.Date(2025, 3, 29, 20, 0, 0, 0, time.FixedZone("US/Eastern", -4*3600)),
+					Timezone: "US/Eastern",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2025, 3, 29, 20, 0, 0, 0, time.FixedZone("US/Eastern", -4*3600)),
 						Duration:   valuer.MustParseTextDuration("24h"),
 						RepeatType: RepeatTypeWeekly,
 						RepeatOn:   []RepeatOn{RepeatOnSunday, RepeatOnSaturday},
@@ -453,57 +458,57 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			skip: true,
 		},
 		{
-			name: "recurring maintenance, repeat daily from 12:00 to 14:00, ts < start",
+			name: "recurring maintenance, repeat daily from 12:00 to 14:00",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 1, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 1, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeDaily,
 					},
 				},
 			},
-			ts:   time.Date(2024, 1, 10, 11, 0, 0, 0, time.UTC),
-			skip: false,
-		},
-		{
-			name: "recurring maintenance, repeat daily from 12:00 to 14:00, start <= ts <= end",
-			maintenance: &PlannedMaintenance{
-				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 1, 12, 0, 0, 0, time.UTC),
-					Recurrence: &Recurrence{
-						Duration:   valuer.MustParseTextDuration("2h"),
-						RepeatType: RepeatTypeDaily,
-					},
-				},
-			},
-			ts:   time.Date(2024, 1, 10, 13, 0, 0, 0, time.UTC),
+			ts:   time.Date(2024, 1, 1, 12, 10, 0, 0, time.UTC),
 			skip: true,
 		},
 		{
-			name: "recurring maintenance, repeat daily from 12:00 to 14:00, start > end",
+			name: "recurring maintenance, repeat daily from 12:00 to 14:00",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 1, 1, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 1, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeDaily,
 					},
 				},
 			},
-			ts:   time.Date(2024, 1, 10, 15, 0, 0, 0, time.UTC),
-			skip: false,
+			ts:   time.Date(2024, 1, 1, 14, 0, 0, 0, time.UTC),
+			skip: true,
+		},
+		{
+			name: "recurring maintenance, repeat daily from 12:00 to 14:00",
+			maintenance: &PlannedMaintenance{
+				Schedule: &Schedule{
+					Timezone: "UTC",
+					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 1, 1, 12, 0, 0, 0, time.UTC),
+						Duration:   valuer.MustParseTextDuration("2h"),
+						RepeatType: RepeatTypeDaily,
+					},
+				},
+			},
+			ts:   time.Date(2024, 4, 1, 12, 10, 0, 0, time.UTC),
+			skip: true,
 		},
 		{
 			name: "recurring maintenance, repeat weekly on monday from 12:00 to 14:00",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 4, 1, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 4, 1, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeWeekly,
 						RepeatOn:   []RepeatOn{RepeatOnMonday},
@@ -517,9 +522,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "recurring maintenance, repeat weekly on monday from 12:00 to 14:00",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 4, 1, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 4, 1, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeWeekly,
 						RepeatOn:   []RepeatOn{RepeatOnMonday},
@@ -533,9 +538,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "recurring maintenance, repeat weekly on monday from 12:00 to 14:00",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 4, 1, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 4, 1, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeWeekly,
 						RepeatOn:   []RepeatOn{RepeatOnMonday},
@@ -549,9 +554,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "recurring maintenance, repeat weekly on monday from 12:00 to 14:00",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 4, 1, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 4, 1, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeWeekly,
 						RepeatOn:   []RepeatOn{RepeatOnMonday},
@@ -565,9 +570,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "recurring maintenance, repeat weekly on monday from 12:00 to 14:00",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 4, 1, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 4, 1, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeWeekly,
 						RepeatOn:   []RepeatOn{RepeatOnMonday},
@@ -581,9 +586,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "recurring maintenance, repeat monthly on 4th from 12:00 to 14:00",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 4, 4, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 4, 4, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeMonthly,
 					},
@@ -596,9 +601,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "recurring maintenance, repeat monthly on 4th from 12:00 to 14:00",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 4, 4, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 4, 4, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeMonthly,
 					},
@@ -611,9 +616,9 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			name: "recurring maintenance, repeat monthly on 4th from 12:00 to 14:00",
 			maintenance: &PlannedMaintenance{
 				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: time.Date(2024, 4, 4, 12, 0, 0, 0, time.UTC),
+					Timezone: "UTC",
 					Recurrence: &Recurrence{
+						StartTime:  time.Date(2024, 4, 4, 12, 0, 0, 0, time.UTC),
 						Duration:   valuer.MustParseTextDuration("2h"),
 						RepeatType: RepeatTypeMonthly,
 					},
@@ -622,6 +627,45 @@ func TestShouldSkipMaintenance(t *testing.T) {
 			ts:   time.Date(2024, 5, 4, 12, 10, 0, 0, time.UTC),
 			skip: true,
 		},
+		// The recurrence should govern, when set. Not the fixed range.
+		{
+			name: "recurring-daily-with-fixed-times-outside-daily-window",
+			maintenance: &PlannedMaintenance{
+				Schedule: &Schedule{
+					Timezone: "UTC",
+					// These fixed fields should be ignored when Recurrence is set.
+					StartTime: time.Date(2026, 4, 1, 14, 0, 0, 0, time.UTC),
+					EndTime:   time.Date(2026, 4, 30, 18, 0, 0, 0, time.UTC),
+					Recurrence: &Recurrence{
+						StartTime:  time.Date(2026, 4, 1, 14, 0, 0, 0, time.UTC), // daily at 14:00
+						Duration:   valuer.MustParseTextDuration("2h"),           // until 16:00
+						RepeatType: RepeatTypeDaily,
+					},
+				},
+			},
+			// 2026-04-15 11:00 is inside the fixed range but outside the daily 14:00-16:00 window.
+			ts:   time.Date(2026, 4, 15, 11, 0, 0, 0, time.UTC),
+			skip: false,
+		},
+		{
+			name: "recurring-daily-with-fixed-times-inside-daily-window",
+			maintenance: &PlannedMaintenance{
+				Schedule: &Schedule{
+					Timezone:  "UTC",
+					StartTime: time.Date(2026, 4, 1, 14, 0, 0, 0, time.UTC),
+					EndTime:   time.Date(2026, 4, 30, 18, 0, 0, 0, time.UTC),
+					Recurrence: &Recurrence{
+						StartTime:  time.Date(2026, 4, 1, 14, 0, 0, 0, time.UTC),
+						EndTime:    timePtr(time.Date(2026, 4, 30, 18, 0, 0, 0, time.UTC)),
+						Duration:   valuer.MustParseTextDuration("2h"),
+						RepeatType: RepeatTypeDaily,
+					},
+				},
+			},
+			// 15:00 is inside the daily 14:00-16:00 window. Should skip.
+			ts:   time.Date(2026, 4, 15, 15, 0, 0, 0, time.UTC),
+			skip: true,
+		},
 	}
 
 	for idx, c := range cases {
@@ -635,211 +679,13 @@ func TestShouldSkipMaintenance(t *testing.T) {
 	}
 }
 
-func TestIsActiveFixedSchedule(t *testing.T) {
-	start := time.Date(2024, 1, 1, 12, 0, 0, 0, time.UTC)
-	end := time.Date(2024, 1, 10, 12, 0, 0, 0, time.UTC)
-
-	cases := []struct {
-		name      string
-		startTime time.Time
-		endTime   time.Time
-		now       time.Time
-		active    bool
-	}{
-		{
-			name:      "no end, t < start",
-			startTime: start,
-			now:       start.Add(-time.Hour),
-			active:    false,
-		},
-		{
-			name:      "no end, start == t",
-			startTime: start,
-			now:       start,
-			active:    true,
-		},
-		{
-			// A fixed schedule with no end time stays active indefinitely.
-			name:      "no end, start << t",
-			startTime: start,
-			now:       start.AddDate(10, 0, 0),
-			active:    true,
-		},
-		{
-			name:      "with end, start < t < end",
-			startTime: start,
-			endTime:   end,
-			now:       start.Add(24 * time.Hour),
-			active:    true,
-		},
-		{
-			name:      "with end, t == end",
-			startTime: start,
-			endTime:   end,
-			now:       end,
-			active:    true,
-		},
-		{
-			name:      "with end, end < t",
-			startTime: start,
-			endTime:   end,
-			now:       end.Add(time.Hour),
-			active:    false,
-		},
-	}
-
-	for _, c := range cases {
-		t.Run(c.name, func(t *testing.T) {
-			m := &PlannedMaintenance{
-				Schedule: &Schedule{
-					Timezone:  "UTC",
-					StartTime: c.startTime,
-					EndTime:   c.endTime,
-				},
-			}
-			if got := m.IsActive(c.now); got != c.active {
-				t.Errorf("IsActive() = %v, want %v", got, c.active)
-			}
-		})
-	}
-}
-
-func TestIsActiveRecurringSchedule(t *testing.T) {
-	// Daily window 12:00-14:00, starting 2024-01-01 (a Monday).
-	start := time.Date(2024, 1, 1, 12, 0, 0, 0, time.UTC)
-
-	daily := &Recurrence{
-		Duration:   valuer.MustParseTextDuration("2h"),
-		RepeatType: RepeatTypeDaily,
-	}
-
-	cases := []struct {
-		name       string
-		startTime  time.Time
-		endTime    time.Time
-		recurrence *Recurrence
-		now        time.Time
-		active     bool
-	}{
-		{
-			// The recurrence has not begun yet, even though the time-of-day matches.
-			name:       "daily: t < recurrence start",
-			startTime:  start,
-			recurrence: daily,
-			now:        time.Date(2023, 12, 31, 13, 0, 0, 0, time.UTC),
-			active:     false,
-		},
-		{
-			name:       "daily: no end, within window",
-			startTime:  start,
-			recurrence: daily,
-			now:        time.Date(2024, 6, 15, 13, 0, 0, 0, time.UTC),
-			active:     true,
-		},
-		{
-			name:       "daily: no end, outside window",
-			startTime:  start,
-			recurrence: daily,
-			now:        time.Date(2024, 6, 15, 15, 0, 0, 0, time.UTC),
-			active:     false,
-		},
-		{
-			name:       "daily: at window start boundary",
-			startTime:  start,
-			recurrence: daily,
-			now:        time.Date(2024, 6, 15, 12, 0, 0, 0, time.UTC),
-			active:     true,
-		},
-		{
-			name:       "daily: at window end boundary",
-			startTime:  start,
-			recurrence: daily,
-			now:        time.Date(2024, 6, 15, 14, 0, 0, 0, time.UTC),
-			active:     true,
-		},
-		{
-			// Past the recurrence end, the time-of-day match no longer applies.
-			name:       "daily: t > recurrence end",
-			startTime:  start,
-			endTime:    time.Date(2024, 1, 10, 12, 0, 0, 0, time.UTC),
-			recurrence: daily,
-			now:        time.Date(2024, 1, 15, 13, 0, 0, 0, time.UTC),
-			active:     false,
-		},
-		{
-			name:       "daily: before recurrence end, within window",
-			startTime:  start,
-			endTime:    time.Date(2024, 1, 10, 23, 0, 0, 0, time.UTC),
-			recurrence: daily,
-			now:        time.Date(2024, 1, 10, 13, 0, 0, 0, time.UTC),
-			active:     true,
-		},
-		{
-			name:      "weekly: on allowed day, within window",
-			startTime: start, // Monday
-			recurrence: &Recurrence{
-				Duration:   valuer.MustParseTextDuration("2h"),
-				RepeatType: RepeatTypeWeekly,
-				RepeatOn:   []RepeatOn{RepeatOnMonday},
-			},
-			now:    time.Date(2024, 4, 15, 13, 0, 0, 0, time.UTC), // a Monday
-			active: true,
-		},
-		{
-			name:      "weekly: on non-allowed day",
-			startTime: start,
-			recurrence: &Recurrence{
-				Duration:   valuer.MustParseTextDuration("2h"),
-				RepeatType: RepeatTypeWeekly,
-				RepeatOn:   []RepeatOn{RepeatOnMonday},
-			},
-			now:    time.Date(2024, 4, 16, 13, 0, 0, 0, time.UTC), // a Tuesday
-			active: false,
-		},
-		{
-			name:      "monthly: on day-of-month, within window",
-			startTime: time.Date(2024, 1, 4, 12, 0, 0, 0, time.UTC),
-			recurrence: &Recurrence{
-				Duration:   valuer.MustParseTextDuration("2h"),
-				RepeatType: RepeatTypeMonthly,
-			},
-			now:    time.Date(2024, 5, 4, 13, 0, 0, 0, time.UTC),
-			active: true,
-		},
-		{
-			name:      "monthly: on different day-of-month",
-			startTime: time.Date(2024, 1, 4, 12, 0, 0, 0, time.UTC),
-			recurrence: &Recurrence{
-				Duration:   valuer.MustParseTextDuration("2h"),
-				RepeatType: RepeatTypeMonthly,
-			},
-			now:    time.Date(2024, 5, 5, 13, 0, 0, 0, time.UTC),
-			active: false,
-		},
-	}
-
-	for _, c := range cases {
-		t.Run(c.name, func(t *testing.T) {
-			m := &PlannedMaintenance{
-				Schedule: &Schedule{
-					Timezone:   "UTC",
-					StartTime:  c.startTime,
-					EndTime:    c.endTime,
-					Recurrence: c.recurrence,
-				},
-			}
-			if got := m.IsActive(c.now); got != c.active {
-				t.Errorf("IsActive() = %v, want %v", got, c.active)
-			}
-		})
-	}
-}
-
 func TestShouldSkip_Scope(t *testing.T) {
-	activeSchedule := &Schedule{
-		Timezone:  "UTC",
-		StartTime: time.Now().UTC().Add(-time.Hour),
-		EndTime:   time.Now().UTC().Add(time.Hour),
+	activeSchedule := func() *Schedule {
+		return &Schedule{
+			Timezone:  "UTC",
+			StartTime: time.Now().UTC().Add(-time.Hour),
+			EndTime:   time.Now().UTC().Add(time.Hour),
+		}
 	}
 	now := time.Now().UTC()
 
@@ -853,7 +699,7 @@ func TestShouldSkip_Scope(t *testing.T) {
 	}{
 		{
 			name:        "empty scope - no label filtering applied",
-			maintenance: &PlannedMaintenance{Schedule: activeSchedule},
+			maintenance: &PlannedMaintenance{Schedule: activeSchedule()},
 			ruleID:      "rule-1",
 			ts:          now,
 			lset:        model.LabelSet{"env": "production"},
@@ -861,7 +707,7 @@ func TestShouldSkip_Scope(t *testing.T) {
 		},
 		{
 			name:        "scope matches labels",
-			maintenance: &PlannedMaintenance{Schedule: activeSchedule, Scope: `env = "production"`},
+			maintenance: &PlannedMaintenance{Schedule: activeSchedule(), Scope: `env = "production"`},
 			ruleID:      "rule-1",
 			ts:          now,
 			lset:        model.LabelSet{"env": "production"},
@@ -869,7 +715,7 @@ func TestShouldSkip_Scope(t *testing.T) {
 		},
 		{
 			name:        "scope does not match labels",
-			maintenance: &PlannedMaintenance{Schedule: activeSchedule, Scope: `env = "production"`},
+			maintenance: &PlannedMaintenance{Schedule: activeSchedule(), Scope: `env = "production"`},
 			ruleID:      "rule-1",
 			ts:          now,
 			lset:        model.LabelSet{"env": "staging"},
@@ -877,7 +723,7 @@ func TestShouldSkip_Scope(t *testing.T) {
 		},
 		{
 			name:        "AND expression - both conditions match",
-			maintenance: &PlannedMaintenance{Schedule: activeSchedule, Scope: `env = "production" AND service = "api"`},
+			maintenance: &PlannedMaintenance{Schedule: activeSchedule(), Scope: `env = "production" AND service = "api"`},
 			ruleID:      "rule-1",
 			ts:          now,
 			lset:        model.LabelSet{"env": "production", "service": "api"},
@@ -885,7 +731,7 @@ func TestShouldSkip_Scope(t *testing.T) {
 		},
 		{
 			name:        "AND expression - one condition does not match",
-			maintenance: &PlannedMaintenance{Schedule: activeSchedule, Scope: `env = "production" AND service = "api"`},
+			maintenance: &PlannedMaintenance{Schedule: activeSchedule(), Scope: `env = "production" AND service = "api"`},
 			ruleID:      "rule-1",
 			ts:          now,
 			lset:        model.LabelSet{"env": "production", "service": "worker"},
@@ -893,7 +739,7 @@ func TestShouldSkip_Scope(t *testing.T) {
 		},
 		{
 			name:        "OR expression - first alternative matches",
-			maintenance: &PlannedMaintenance{Schedule: activeSchedule, Scope: `env = "production" OR env = "staging"`},
+			maintenance: &PlannedMaintenance{Schedule: activeSchedule(), Scope: `env = "production" OR env = "staging"`},
 			ruleID:      "rule-1",
 			ts:          now,
 			lset:        model.LabelSet{"env": "production"},
@@ -901,7 +747,7 @@ func TestShouldSkip_Scope(t *testing.T) {
 		},
 		{
 			name:        "OR expression - second alternative matches",
-			maintenance: &PlannedMaintenance{Schedule: activeSchedule, Scope: `env = "production" OR env = "staging"`},
+			maintenance: &PlannedMaintenance{Schedule: activeSchedule(), Scope: `env = "production" OR env = "staging"`},
 			ruleID:      "rule-1",
 			ts:          now,
 			lset:        model.LabelSet{"env": "staging"},
@@ -909,7 +755,7 @@ func TestShouldSkip_Scope(t *testing.T) {
 		},
 		{
 			name:        "OR expression - neither alternative matches",
-			maintenance: &PlannedMaintenance{Schedule: activeSchedule, Scope: `env = "production" OR env = "staging"`},
+			maintenance: &PlannedMaintenance{Schedule: activeSchedule(), Scope: `env = "production" OR env = "staging"`},
 			ruleID:      "rule-1",
 			ts:          now,
 			lset:        model.LabelSet{"env": "development"},
@@ -917,7 +763,7 @@ func TestShouldSkip_Scope(t *testing.T) {
 		},
 		{
 			name:        "scope references label absent from lset",
-			maintenance: &PlannedMaintenance{Schedule: activeSchedule, Scope: `env = "production"`},
+			maintenance: &PlannedMaintenance{Schedule: activeSchedule(), Scope: `env = "production"`},
 			ruleID:      "rule-1",
 			ts:          now,
 			lset:        model.LabelSet{"service": "api"},
@@ -925,7 +771,7 @@ func TestShouldSkip_Scope(t *testing.T) {
 		},
 		{
 			name:        "in expression - value is in list",
-			maintenance: &PlannedMaintenance{Schedule: activeSchedule, Scope: `env in ["production", "staging"]`},
+			maintenance: &PlannedMaintenance{Schedule: activeSchedule(), Scope: `env in ["production", "staging"]`},
 			ruleID:      "rule-1",
 			ts:          now,
 			lset:        model.LabelSet{"env": "staging"},
@@ -933,7 +779,7 @@ func TestShouldSkip_Scope(t *testing.T) {
 		},
 		{
 			name:        "in expression - value not in list",
-			maintenance: &PlannedMaintenance{Schedule: activeSchedule, Scope: `env in ["production", "staging"]`},
+			maintenance: &PlannedMaintenance{Schedule: activeSchedule(), Scope: `env in ["production", "staging"]`},
 			ruleID:      "rule-1",
 			ts:          now,
 			lset:        model.LabelSet{"env": "development"},
@@ -941,7 +787,7 @@ func TestShouldSkip_Scope(t *testing.T) {
 		},
 		{
 			name:        "ruleID in list and scope matches - should skip",
-			maintenance: &PlannedMaintenance{Schedule: activeSchedule, RuleIDs: []string{"rule-1", "rule-2"}, Scope: `env = "production"`},
+			maintenance: &PlannedMaintenance{Schedule: activeSchedule(), RuleIDs: []string{"rule-1", "rule-2"}, Scope: `env = "production"`},
 			ruleID:      "rule-1",
 			ts:          now,
 			lset:        model.LabelSet{"env": "production"},
@@ -949,7 +795,7 @@ func TestShouldSkip_Scope(t *testing.T) {
 		},
 		{
 			name:        "ruleID not in list and scope matches - ruleID gate prevents skip",
-			maintenance: &PlannedMaintenance{Schedule: activeSchedule, RuleIDs: []string{"rule-2"}, Scope: `env = "production"`},
+			maintenance: &PlannedMaintenance{Schedule: activeSchedule(), RuleIDs: []string{"rule-2"}, Scope: `env = "production"`},
 			ruleID:      "rule-1",
 			ts:          now,
 			lset:        model.LabelSet{"env": "production"},
@@ -957,7 +803,7 @@ func TestShouldSkip_Scope(t *testing.T) {
 		},
 		{
 			name:        "ruleID in list but scope does not match - should not skip",
-			maintenance: &PlannedMaintenance{Schedule: activeSchedule, RuleIDs: []string{"rule-1"}, Scope: `env = "production"`},
+			maintenance: &PlannedMaintenance{Schedule: activeSchedule(), RuleIDs: []string{"rule-1"}, Scope: `env = "production"`},
 			ruleID:      "rule-1",
 			ts:          now,
 			lset:        model.LabelSet{"env": "staging"},

pkg/types/alertmanagertypes/recurrence.go

@@ -66,9 +66,9 @@ var RepeatOnAllMap = map[RepeatOn]time.Weekday{
 	RepeatOnSaturday:  time.Saturday,
 }
 
-// Recurrence describes the repeat pattern of a planned maintenance.
-// The window bounds (start/end) live on the enclosing Schedule.
 type Recurrence struct {
+	StartTime  time.Time           `json:"startTime" required:"true"`
+	EndTime    *time.Time          `json:"endTime,omitempty"`
 	Duration   valuer.TextDuration `json:"duration" required:"true"`
 	RepeatType RepeatType          `json:"repeatType" required:"true"`
 	RepeatOn   []RepeatOn          `json:"repeatOn"`

pkg/types/alertmanagertypes/schedule.go

@@ -11,7 +11,7 @@ import (
 
 type Schedule struct {
 	Timezone   string      `json:"timezone" required:"true"`
-	StartTime  time.Time   `json:"startTime" required:"true"`
+	StartTime  time.Time   `json:"startTime,omitempty"`
 	EndTime    time.Time   `json:"endTime,omitzero"`
 	Recurrence *Recurrence `json:"recurrence"`
 }
@@ -39,12 +39,29 @@ func (s Schedule) MarshalJSON() ([]byte, error) {
 		return nil, err
 	}
 
-	// Marshal times in the selected timezone.
-	// This ensures that recurring events are handled correctly when DST is involved.
-	startTime := s.StartTime.In(loc)
-	var endTime time.Time
+	var startTime, endTime time.Time
+	if !s.StartTime.IsZero() {
+		startTime = time.Date(s.StartTime.Year(), s.StartTime.Month(), s.StartTime.Day(), s.StartTime.Hour(), s.StartTime.Minute(), s.StartTime.Second(), s.StartTime.Nanosecond(), loc)
+	}
 	if !s.EndTime.IsZero() {
-		endTime = s.EndTime.In(loc)
+		endTime = time.Date(s.EndTime.Year(), s.EndTime.Month(), s.EndTime.Day(), s.EndTime.Hour(), s.EndTime.Minute(), s.EndTime.Second(), s.EndTime.Nanosecond(), loc)
+	}
+
+	var recurrence *Recurrence
+	if s.Recurrence != nil {
+		recStartTime := time.Date(s.Recurrence.StartTime.Year(), s.Recurrence.StartTime.Month(), s.Recurrence.StartTime.Day(), s.Recurrence.StartTime.Hour(), s.Recurrence.StartTime.Minute(), s.Recurrence.StartTime.Second(), s.Recurrence.StartTime.Nanosecond(), loc)
+		var recEndTime *time.Time
+		if s.Recurrence.EndTime != nil {
+			end := time.Date(s.Recurrence.EndTime.Year(), s.Recurrence.EndTime.Month(), s.Recurrence.EndTime.Day(), s.Recurrence.EndTime.Hour(), s.Recurrence.EndTime.Minute(), s.Recurrence.EndTime.Second(), s.Recurrence.EndTime.Nanosecond(), loc)
+			recEndTime = &end
+		}
+		recurrence = &Recurrence{
+			StartTime:  recStartTime,
+			EndTime:    recEndTime,
+			Duration:   s.Recurrence.Duration,
+			RepeatType: s.Recurrence.RepeatType,
+			RepeatOn:   s.Recurrence.RepeatOn,
+		}
 	}
 
 	return json.Marshal(&struct {
@@ -56,7 +73,7 @@ func (s Schedule) MarshalJSON() ([]byte, error) {
 		Timezone:   s.Timezone,
 		StartTime:  startTime,
 		EndTime:    endTime,
-		Recurrence: s.Recurrence,
+		Recurrence: recurrence,
 	})
 }
 
@@ -71,35 +88,55 @@ func (s *Schedule) UnmarshalJSON(data []byte) error {
 		return err
 	}
 
-	if aux.Timezone == "" {
-		return errors.Newf(errors.TypeInvalidInput, errors.CodeInvalidInput, "missing timezone")
-	}
-
 	loc, err := time.LoadLocation(aux.Timezone)
 	if err != nil {
-		return errors.Newf(errors.TypeInvalidInput, errors.CodeInvalidInput, `invalid timezone "%s"`, aux.Timezone)
+		return err
 	}
 
-	startTime, err := time.Parse(time.RFC3339, aux.StartTime)
-	if err != nil {
-		return errors.Newf(errors.TypeInvalidInput, errors.CodeInvalidInput, `invalid start time "%s"`, aux.StartTime)
+	var startTime time.Time
+	if aux.StartTime != "" {
+		startTime, err = time.Parse(time.RFC3339, aux.StartTime)
+		if err != nil {
+			return err
+		}
+		s.StartTime = time.Date(startTime.Year(), startTime.Month(), startTime.Day(), startTime.Hour(), startTime.Minute(), startTime.Second(), startTime.Nanosecond(), loc)
 	}
-	startTime = startTime.In(loc)
 
 	var endTime time.Time
 	if aux.EndTime != "" {
 		endTime, err = time.Parse(time.RFC3339, aux.EndTime)
 		if err != nil {
-			return errors.Newf(errors.TypeInvalidInput, errors.CodeInvalidInput, `invalid end time "%s"`, aux.EndTime)
-		}
-		if !endTime.IsZero() {
-			endTime = endTime.In(loc)
+			return err
 		}
+		// TODO(jatinderjit): if endTime.IsZero() then we should not set the endTime
+		s.EndTime = time.Date(endTime.Year(), endTime.Month(), endTime.Day(), endTime.Hour(), endTime.Minute(), endTime.Second(), endTime.Nanosecond(), loc)
 	}
 
 	s.Timezone = aux.Timezone
-	s.StartTime = startTime
-	s.EndTime = endTime
-	s.Recurrence = aux.Recurrence
+
+	if aux.Recurrence != nil {
+		recStartTime, err := time.Parse(time.RFC3339, aux.Recurrence.StartTime.Format(time.RFC3339))
+		if err != nil {
+			return err
+		}
+
+		var recEndTime *time.Time
+		if aux.Recurrence.EndTime != nil {
+			end, err := time.Parse(time.RFC3339, aux.Recurrence.EndTime.Format(time.RFC3339))
+			if err != nil {
+				return err
+			}
+			endConverted := time.Date(end.Year(), end.Month(), end.Day(), end.Hour(), end.Minute(), end.Second(), end.Nanosecond(), loc)
+			recEndTime = &endConverted
+		}
+
+		s.Recurrence = &Recurrence{
+			StartTime:  time.Date(recStartTime.Year(), recStartTime.Month(), recStartTime.Day(), recStartTime.Hour(), recStartTime.Minute(), recStartTime.Second(), recStartTime.Nanosecond(), loc),
+			EndTime:    recEndTime,
+			Duration:   aux.Recurrence.Duration,
+			RepeatType: aux.Recurrence.RepeatType,
+			RepeatOn:   aux.Recurrence.RepeatOn,
+		}
+	}
 	return nil
 }

pkg/types/dashboardtypes/perses_dashboard_convertors_test.go

@@ -38,7 +38,7 @@ func newTestDashboardV2(t *testing.T, orgID valuer.UUID, source Source) *Dashboa
 								FillMode:          FillModeSolid,
 								SpanGaps:          SpanGaps{FillLessThan: valuer.MustParseTextDuration("60s")},
 							},
-							Legend: Legend{Position: LegendPositionBottom, Mode: LegendModeList},
+							Legend: Legend{Position: LegendPositionBottom},
 						},
 					},
 					Queries: []Query{