Merge branch 'main' into issue-2977

#### Description

- pages that hardcoded `100vh` minus a guess at what sits above them
came out taller
than the pane they live in, which showed up as scroll that should not be
there. they
  now take what the layout gives them.
- most of the `100vh` in the app turned out to be harmless.. either
flex-shrink absorbs
it or the pane scrolls anyway. those are left alone, only the ones with
a real symptom
  are changed here.
- alert rules and triggered alerts also needed the AlertList tabs chain
to hand height
  down, that page uses antd `Tabs` directly instead of `RouteTab`.
- licenses, status and support pages had `max-height: 100vh` with
`overflow: hidden` and
no inner scroller, so anything past a viewport was clipped with no way
to reach it.
  removed the cap on all three.

#### Issues closed by this PR

Part of https://github.com/SigNoz/engineering-pod/issues/6074


#### Screenshots/ Screen recording

Home page


https://github.com/user-attachments/assets/8ba3e3c9-1959-4393-b503-ddf579e9d139

Without bottom strip


https://github.com/user-attachments/assets/2ee08181-710a-4c34-a4e7-893c4a320453



Status page

<img width="1728" height="1000" alt="status"
src="https://github.com/user-attachments/assets/f44ec7d7-4ee0-4866-9a90-fe25622fe25b"
/>

Without bottom strip

<img width="1728" height="997" alt="status2"
src="https://github.com/user-attachments/assets/be57dce6-65ca-4450-8f0d-0337625a1d64"
/>

Alert rules


https://github.com/user-attachments/assets/7cc25f56-54e4-4489-bdb4-453409151bac

Triggered alerts


https://github.com/user-attachments/assets/2d8e1885-7cad-4659-90f6-59960f4afce8

Without bottom strip



https://github.com/user-attachments/assets/5247f6c0-3675-4910-b1e4-4076bf93c16e



Support
<img width="1728" height="997" alt="support"
src="https://github.com/user-attachments/assets/c2b3c0b2-2abd-4538-bb52-2660e75817b3"
/>

Trace funnel



https://github.com/user-attachments/assets/c4872135-3cb5-4348-b6c6-2d3e4dabdc1b

Without bottom strip


https://github.com/user-attachments/assets/aef94d5d-02e5-4154-995b-76819d55c2d8


Trace details



https://github.com/user-attachments/assets/24d701b0-296f-4fb4-ba9d-615a47b33285

Without bottom strip


https://github.com/user-attachments/assets/23083f20-67bf-4b06-aaec-aba390a6f594



#### Additional Information

- every page here was checked on screen before and after. the ones left
untouched
(infra hosts/k8s, traces + llm explorer list views, llm settings tables,
the k8s logs
  drawer) were checked too and are fine.

docs/api/openapi.yml

@@ -1763,12 +1763,15 @@ components:
           additionalProperties: {}
           nullable: true
           type: object
+        syncState:
+          $ref: '#/components/schemas/CloudintegrationtypesSyncState'
         timestampMillis:
           format: int64
           type: integer
       required:
       - timestampMillis
       - data
+      - syncState
       type: object
     CloudintegrationtypesAzureAccountConfig:
       properties:
@@ -2013,6 +2016,8 @@ components:
           format: date-time
           nullable: true
           type: string
+        syncState:
+          $ref: '#/components/schemas/CloudintegrationtypesSyncState'
       required:
       - account_id
       - cloud_account_id
@@ -2022,6 +2027,7 @@ components:
       - providerAccountId
       - integrationConfig
       - removedAt
+      - syncState
       type: object
     CloudintegrationtypesGettableServicesMetadata:
       properties:
@@ -2121,6 +2127,9 @@ components:
           type: object
         providerAccountId:
           type: string
+        syncedVersion:
+          nullable: true
+          type: integer
       required:
       - data
       type: object
@@ -2133,6 +2142,18 @@ components:
         gcp:
           $ref: '#/components/schemas/CloudintegrationtypesGCPIntegrationConfig'
       type: object
+    CloudintegrationtypesRegionState:
+      enum:
+      - present
+      - removed
+      type: string
+    CloudintegrationtypesRegionSyncState:
+      properties:
+        state:
+          $ref: '#/components/schemas/CloudintegrationtypesRegionState'
+      required:
+      - state
+      type: object
     CloudintegrationtypesService:
       properties:
         assets:
@@ -2274,6 +2295,23 @@ components:
         metrics:
           type: boolean
       type: object
+    CloudintegrationtypesSyncState:
+      nullable: true
+      properties:
+        inSync:
+          type: boolean
+        regions:
+          additionalProperties:
+            $ref: '#/components/schemas/CloudintegrationtypesRegionSyncState'
+          type: object
+        version:
+          format: int64
+          type: integer
+      required:
+      - version
+      - inSync
+      - regions
+      type: object
     CloudintegrationtypesUpdatableAccount:
       properties:
         config:

ee/modules/cloudintegration/implcloudintegration/module.go

@@ -188,27 +188,41 @@ func (module *module) AgentCheckIn(ctx context.Context, orgID valuer.UUID, provi
 		return nil, err
 	}
 
+	// Get account as domain object for config access (enabled regions, etc.)
+	domainAccount, err := cloudintegrationtypes.NewAccountFromStorable(account)
+	if err != nil {
+		return nil, err
+	}
+
+	syncState := domainAccount.NextSyncState(req.SyncedVersion)
+
 	// If account has been removed (disconnected), return a minimal response with empty integration config.
 	// The agent uses this response to clean up resources
 	if account.RemovedAt != nil {
+		// Heartbeat stays frozen after removal, only the sync state is updated.
+		if domainAccount.AgentReport != nil && syncState != nil {
+			domainAccount.AgentReport.SyncState = syncState
+			account.Update(account.AccountID, domainAccount.AgentReport)
+
+			err = module.store.UpdateAgentReport(ctx, account)
+			if err != nil {
+				return nil, err
+			}
+		}
+
 		return cloudintegrationtypes.NewAgentCheckInResponse(
 			req.ProviderAccountID,
 			account.ID.StringValue(),
 			new(cloudintegrationtypes.ProviderIntegrationConfig),
 			account.RemovedAt,
+			syncState,
 		), nil
 	}
 
 	// update account with cloud provider account id and agent report (heartbeat)
-	account.Update(&req.ProviderAccountID, cloudintegrationtypes.NewAgentReport(req.Data))
+	account.Update(&req.ProviderAccountID, cloudintegrationtypes.NewAgentReport(req.Data, syncState))
 
-	err = module.store.UpdateAccount(ctx, account)
-	if err != nil {
-		return nil, err
-	}
-
-	// Get account as domain object for config access (enabled regions, etc.)
-	domainAccount, err := cloudintegrationtypes.NewAccountFromStorable(account)
+	err = module.store.UpdateAgentReport(ctx, account)
 	if err != nil {
 		return nil, err
 	}
@@ -234,6 +248,7 @@ func (module *module) AgentCheckIn(ctx context.Context, orgID valuer.UUID, provi
 		account.ID.StringValue(),
 		integrationConfig,
 		account.RemovedAt,
+		syncState,
 	), nil
 }
 

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

@@ -3366,6 +3366,37 @@ export interface CloudintegrationtypesAWSServiceConfigDTO {
 	metrics?: CloudintegrationtypesAWSServiceMetricsConfigDTO;
 }
 
+export enum CloudintegrationtypesRegionStateDTO {
+	present = 'present',
+	removed = 'removed',
+}
+export interface CloudintegrationtypesRegionSyncStateDTO {
+	state: CloudintegrationtypesRegionStateDTO;
+}
+
+export type CloudintegrationtypesSyncStateDTORegions = {
+	[key: string]: CloudintegrationtypesRegionSyncStateDTO;
+};
+
+/**
+ * @nullable
+ */
+export type CloudintegrationtypesSyncStateDTO = {
+	/**
+	 * @type boolean
+	 */
+	inSync: boolean;
+	/**
+	 * @type object
+	 */
+	regions: CloudintegrationtypesSyncStateDTORegions;
+	/**
+	 * @type integer
+	 * @format int64
+	 */
+	version: number;
+} | null;
+
 export type CloudintegrationtypesAgentReportDTODataAnyOf = {
 	[key: string]: unknown;
 };
@@ -3384,6 +3415,7 @@ export type CloudintegrationtypesAgentReportDTO = {
 	 * @type object,null
 	 */
 	data: CloudintegrationtypesAgentReportDTOData;
+	syncState: CloudintegrationtypesSyncStateDTO | null;
 	/**
 	 * @type integer
 	 * @format int64
@@ -3812,6 +3844,7 @@ export interface CloudintegrationtypesGettableAgentCheckInDTO {
 	 * @format date-time
 	 */
 	removedAt: string | null;
+	syncState: CloudintegrationtypesSyncStateDTO | null;
 }
 
 export interface CloudintegrationtypesServiceMetadataDTO {
@@ -3882,6 +3915,10 @@ export interface CloudintegrationtypesPostableAgentCheckInDTO {
 	 * @type string
 	 */
 	providerAccountId?: string;
+	/**
+	 * @type integer,null
+	 */
+	syncedVersion?: number | null;
 }
 
 export interface CloudintegrationtypesStorableIntegrationDashboardDTO {

frontend/src/constants/localStorage.ts

@@ -47,4 +47,5 @@ export enum LOCALSTORAGE {
 	DASHBOARDS_LIST_VIEWS = 'DASHBOARDS_LIST_VIEWS',
 	DASHBOARD_V2_PANEL_COLUMN_WIDTHS = 'DASHBOARD_V2_PANEL_COLUMN_WIDTHS',
 	LLM_ATTRIBUTE_MAPPING_TEST_SPAN = 'LLM_ATTRIBUTE_MAPPING_TEST_SPAN',
+	SAVED_VIEW_ENABLED = 'SAVED_VIEW_ENABLED',
 }

frontend/src/container/AppLayout/AppLayout.styles.scss

@@ -53,6 +53,10 @@
 		z-index: 0;
 		background: var(--l1-background);
 
+		// Column so the bottom strip sits under the scrolling content, not inside it.
+		display: flex;
+		flex-direction: column;
+
 		&.full-screen-content {
 			width: 100%;
 		}
@@ -70,7 +74,9 @@
 
 .chat-support-gateway {
 	position: fixed;
-	bottom: 20px;
+	// Lifted above the bottom strip. Don't extend this pattern — new fixed-bottom
+	// UI belongs in the bounded layout, not in another offset here.
+	bottom: calc(20px + var(--bottom-strip-height, 0px));
 	right: 20px;
 	z-index: 1000;
 

frontend/src/container/AppLayout/index.tsx

@@ -43,6 +43,7 @@ import { USER_PREFERENCES } from 'constants/userPreferences';
 import AIAssistantModal from 'container/AIAssistant/AIAssistantModal';
 import AIAssistantPanel from 'container/AIAssistant/AIAssistantPanel';
 import { useAIAssistantStore } from 'container/AIAssistant/store/useAIAssistantStore';
+import BottomStrip from 'container/BottomStrip';
 import SideNav from 'container/SideNav';
 import TopNav from 'container/TopNav';
 import dayjs from 'dayjs';
@@ -51,6 +52,7 @@ import { useIsDarkMode } from 'hooks/useDarkMode';
 import { useGetTenantLicense } from 'hooks/useGetTenantLicense';
 import { useIsAIAssistantEnabled } from 'hooks/useIsAIAssistantEnabled';
 import { useNotifications } from 'hooks/useNotifications';
+import { useSavedViewEnabled } from 'hooks/useSavedViewEnabled';
 import useTabVisibility from 'hooks/useTabFocus';
 import history from 'lib/history';
 import { isNull } from 'lodash-es';
@@ -402,6 +404,7 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 	}, [pathname]);
 
 	const isToDisplayLayout = isLoggedIn;
+	const isSavedViewEnabled = useSavedViewEnabled();
 
 	const routeKey = useMemo(() => getRouteKey(pathname), [pathname]);
 	const pageTitle = t(routeKey);
@@ -868,6 +871,10 @@ function AppLayout(props: AppLayoutProps): JSX.Element {
 								</OverlayScrollbar>
 							</LayoutContent>
 						</Sentry.ErrorBoundary>
+
+						{isSavedViewEnabled && isToDisplayLayout && !renderFullScreen && (
+							<BottomStrip />
+						)}
 					</div>
 
 					{isLoggedIn && isAIAssistantEnabled && (

frontend/src/container/AppLayout/styles.ts

@@ -12,8 +12,12 @@ export const Layout = styled(LayoutComponent)`
 	}
 `;
 
+// Takes the height left in `.app-content` after the bottom strip.
+// `min-height: 0` is not needed right now, overlayscrollbars already sets
+// `overflow: auto` here. Kept so this does not break if that goes away.
 export const LayoutContent = styled(LayoutComponent.Content)`
-	height: 100%;
+	flex: 1;
+	min-height: 0;
 	&::-webkit-scrollbar {
 		width: 0.1rem;
 	}

frontend/src/container/BottomStrip/BottomStrip.module.scss

@@ -0,0 +1,36 @@
+.strip {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	gap: var(--spacing-6);
+
+	flex-shrink: 0;
+	height: var(--bottom-strip-height);
+	padding: 0 var(--spacing-6);
+
+	background: var(--l2-background);
+	border-top: 1px solid var(--l2-border);
+
+	font-family: var(--font-family-sf-mono, monospace);
+
+	// Above page content, below the body-portalled overlays that are meant to
+	// cover the strip.
+	position: relative;
+	z-index: 1;
+}
+
+.left,
+.right {
+	display: flex;
+	align-items: center;
+	gap: var(--spacing-6);
+	min-width: 0;
+}
+
+// Temporary placeholder for the left slot. Replaced later.
+.version {
+	color: var(--l2-foreground);
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+}

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

@@ -0,0 +1,49 @@
+import { render } from 'tests/test-utils';
+
+import BottomStrip, {
+	BOTTOM_STRIP_HEIGHT,
+	BOTTOM_STRIP_HEIGHT_VAR,
+	BOTTOM_STRIP_ON_CLASS,
+} from '..';
+
+describe('BottomStrip', () => {
+	it('publishes the body class and height property while mounted', () => {
+		const { unmount } = render(<BottomStrip />);
+
+		expect(document.body.classList.contains(BOTTOM_STRIP_ON_CLASS)).toBe(true);
+		expect(document.body.style.getPropertyValue(BOTTOM_STRIP_HEIGHT_VAR)).toBe(
+			`${BOTTOM_STRIP_HEIGHT}px`,
+		);
+
+		unmount();
+
+		expect(document.body.classList.contains(BOTTOM_STRIP_ON_CLASS)).toBe(false);
+		expect(document.body.style.getPropertyValue(BOTTOM_STRIP_HEIGHT_VAR)).toBe(
+			'',
+		);
+	});
+
+	// The string is whatever the Go build injected, so it is rendered untouched —
+	// same as SideNav. Release tags carry the "v", local builds do not.
+	it.each([['v0.134.67'], ['main-64f1c2a']])(
+		'renders the build version %p exactly as given',
+		(version) => {
+			const { getByTestId } = render(<BottomStrip />, undefined, {
+				appContextOverrides: {
+					versionData: { version, ee: 'Y', setupCompleted: true },
+				},
+			});
+
+			expect(getByTestId('bottom-strip-version')).toHaveTextContent(version);
+		},
+	);
+
+	it('renders the strip without a version when none is available', () => {
+		const { getByTestId, queryByTestId } = render(<BottomStrip />, undefined, {
+			appContextOverrides: { versionData: null },
+		});
+
+		expect(getByTestId('bottom-strip')).toBeInTheDocument();
+		expect(queryByTestId('bottom-strip-version')).not.toBeInTheDocument();
+	});
+});

frontend/src/container/BottomStrip/index.tsx

@@ -0,0 +1,42 @@
+import { useLayoutEffect } from 'react';
+import { useAppContext } from 'providers/App/App';
+
+import styles from './BottomStrip.module.scss';
+
+export const BOTTOM_STRIP_HEIGHT = 24;
+
+export const BOTTOM_STRIP_ON_CLASS = 'bottom-strip-on';
+export const BOTTOM_STRIP_HEIGHT_VAR = '--bottom-strip-height';
+
+function BottomStrip(): JSX.Element {
+	const { versionData } = useAppContext();
+	const version = versionData?.version?.trim();
+
+	useLayoutEffect(() => {
+		document.body.classList.add(BOTTOM_STRIP_ON_CLASS);
+		document.body.style.setProperty(
+			BOTTOM_STRIP_HEIGHT_VAR,
+			`${BOTTOM_STRIP_HEIGHT}px`,
+		);
+
+		return (): void => {
+			document.body.classList.remove(BOTTOM_STRIP_ON_CLASS);
+			document.body.style.removeProperty(BOTTOM_STRIP_HEIGHT_VAR);
+		};
+	}, []);
+
+	return (
+		<div className={styles.strip} data-testid="bottom-strip">
+			<div className={styles.left}>
+				{version && (
+					<span className={styles.version} data-testid="bottom-strip-version">
+						{version}
+					</span>
+				)}
+			</div>
+			<div className={styles.right} />
+		</div>
+	);
+}
+
+export default BottomStrip;

frontend/src/container/CreateAlertV2/Footer/styles.scss

@@ -1,6 +1,8 @@
 .create-alert-v2-footer {
 	position: fixed;
-	bottom: 0;
+	// Lifted above the bottom strip. Don't extend this pattern — new fixed-bottom
+	// UI belongs in the bounded layout, not in another offset here.
+	bottom: var(--bottom-strip-height, 0px);
 	left: 63px;
 	right: 0;
 	background-color: var(--l1-background);

frontend/src/container/ExplorerOptions/ExplorerOptions.styles.scss

@@ -1,6 +1,8 @@
 .explorer-options-container {
 	position: fixed;
-	bottom: 0px;
+	// Lifted above the bottom strip. Don't extend this pattern — new fixed-bottom
+	// UI belongs in the bounded layout, not in another offset here.
+	bottom: var(--bottom-strip-height, 0px);
 	left: calc(50% + 240px);
 	transform: translate(calc(-50% - 120px), 0);
 	transition: left 0.2s linear;

frontend/src/container/ExplorerOptions/ExplorerOptionsHideArea.styles.scss

@@ -1,6 +1,8 @@
 .explorer-option-droppable-container {
 	position: fixed;
-	bottom: 0;
+	// Lifted above the bottom strip. Don't extend this pattern — new fixed-bottom
+	// UI belongs in the bounded layout, not in another offset here.
+	bottom: var(--bottom-strip-height, 0px);
 	width: -webkit-fill-available;
 	height: 24px;
 	display: flex;

frontend/src/container/Home/Home.styles.scss

@@ -1,7 +1,6 @@
 .home-container {
 	display: flex;
 	flex-direction: column;
-	min-height: 100vh;
 	overflow-y: auto;
 	height: 100%;
 	width: 100%;

frontend/src/container/Integrations/CloudIntegration/AmazonWebServices/__tests__/mockData.ts

@@ -24,6 +24,7 @@ const accountsResponse: ListAccounts200 = {
 				agentReport: {
 					timestampMillis: 1747114366214,
 					data: null,
+					syncState: null,
 				},
 				providerAccountId: PROVIDER_ACCOUNT_ID,
 				removedAt: null,

frontend/src/container/Licenses/Licenses.styles.scss

@@ -1,7 +1,4 @@
 .licenses-page {
-	max-height: 100vh;
-	overflow: hidden;
-
 	.licenses-page-header {
 		border-bottom: 1px solid var(--l1-border);
 		background: var(--l1-background);
@@ -32,7 +29,6 @@
 
 		.licenses-page-content {
 			flex: 1;
-			height: calc(100vh - 48px);
 			background: var(--l1-background);
 			padding: 10px 8px;
 			overflow-y: auto;

frontend/src/container/ListAlertRules/ListAlertRules.module.scss

@@ -2,7 +2,7 @@
 	display: flex;
 	flex-direction: column;
 	gap: 1rem;
-	height: calc(100vh - 62px);
+	flex: 1;
 	min-height: 400px;
 }
 

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

@@ -181,7 +181,9 @@
 
 		.ant-pagination {
 			position: fixed;
-			bottom: 0;
+			// Lifted above the bottom strip. Don't extend this pattern — new
+			// fixed-bottom UI belongs in the bounded layout, not in another offset here.
+			bottom: var(--bottom-strip-height, 0px);
 			width: calc(100% - 54px);
 			background: var(--l1-background);
 			padding: 16px;

frontend/src/container/TriggeredAlerts/TriggeredAlerts.module.scss

@@ -2,7 +2,7 @@
 	display: flex;
 	flex-direction: column;
 	gap: 1rem;
-	height: calc(100vh - 62px);
+	flex: 1;
 	min-height: 400px;
 	padding-top: var(--spacing-8);
 }

frontend/src/container/Version/Version.styles.scss

@@ -1,7 +1,4 @@
 .version-container {
-	max-height: 100vh;
-	overflow: hidden;
-
 	.version-page-header {
 		border-bottom: 1px solid var(--l1-border);
 		background: var(--l1-background);

frontend/src/hooks/useSavedViewEnabled.ts

@@ -0,0 +1,11 @@
+import getLocalStorageKey from 'api/browser/localstorage/get';
+import { LOCALSTORAGE } from 'constants/localStorage';
+import { useState } from 'react';
+
+export function useSavedViewEnabled(): boolean {
+	const [isEnabled] = useState(
+		() => getLocalStorageKey(LOCALSTORAGE.SAVED_VIEW_ENABLED) === 'true',
+	);
+
+	return isEnabled;
+}

frontend/src/pages/AlertList/AlertList.styles.scss

@@ -1,4 +1,29 @@
 .alerts-container {
+	// Hands the page height down to the active tab so its content can bound itself
+	// instead of guessing with 100vh. Child combinators only, nested Tabs
+	// (Configuration) must not be caught.
+	flex: 1;
+	min-height: 0;
+
+	> .ant-tabs-content-holder {
+		display: flex;
+		flex-direction: column;
+
+		> .ant-tabs-content {
+			flex: 1;
+			min-height: 0;
+			display: flex;
+			flex-direction: column;
+
+			> .ant-tabs-tabpane-active {
+				flex: 1;
+				min-height: 0;
+				display: flex;
+				flex-direction: column;
+			}
+		}
+	}
+
 	.top-level-tab.periscope-tab {
 		padding: 2px 0;
 	}
@@ -40,5 +65,9 @@
 
 	.alert-rules-container {
 		margin-top: 10px;
+		flex: 1;
+		min-height: 0;
+		display: flex;
+		flex-direction: column;
 	}
 }

frontend/src/pages/DashboardPage/DashboardContainer/PanelEditor/ConfigPane/ConfigPane.tsx

@@ -13,10 +13,10 @@ import type { EQueryType } from 'types/common/dashboard';
 import type { LegendSeries } from 'pages/DashboardPage/DashboardContainer/Panels/utils/legendSeries';
 import type { TableColumnOption } from '../hooks/useTableColumns';
 import ConfigActions from './ConfigActions/ConfigActions';
-import PanelTitleInput from './PanelTitleInput/PanelTitleInput';
 import SectionSlot from './SectionSlot/SectionSlot';
 
 import styles from './ConfigPane.module.scss';
+import { DASHBOARD_NAME_MAX_LENGTH } from '../../constants';
 import { PanelKind } from '../../Panels/types/panelKind';
 
 interface ConfigPaneProps {
@@ -94,9 +94,12 @@ function ConfigPane({
 			<div className={styles.group}>
 				<div className={styles.field}>
 					<Typography.Text>Title</Typography.Text>
-					<PanelTitleInput
+					<Input
+						data-testid="panel-editor-v2-title"
 						value={spec.display.name}
-						onChange={(value): void => setDisplayField('name', value)}
+						placeholder="Panel title"
+						maxLength={DASHBOARD_NAME_MAX_LENGTH}
+						onChange={(e): void => setDisplayField('name', e.target.value)}
 					/>
 				</div>
 

frontend/src/pages/DashboardPage/DashboardContainer/PanelEditor/ConfigPane/PanelTitleInput/PanelTitleInput.module.scss

@@ -1,3 +0,0 @@
-.autoComplete {
-	width: 100%;
-}

frontend/src/pages/DashboardPage/DashboardContainer/PanelEditor/ConfigPane/PanelTitleInput/PanelTitleInput.tsx

@@ -1,107 +0,0 @@
-import { useLayoutEffect, useMemo, useRef, useState } from 'react';
-import type { KeyboardEvent } from 'react';
-import { AutoComplete, Input } from 'antd';
-import type { InputRef } from 'antd';
-import { useDashboardVariableNames } from 'pages/DashboardPage/DashboardContainer/hooks/useDashboardVariableNames';
-
-import { DASHBOARD_NAME_MAX_LENGTH } from '../../../constants';
-import { findVariableToken, insertVariable } from './variableToken';
-
-import styles from './PanelTitleInput.module.scss';
-
-interface PanelTitleInputProps {
-	value: string;
-	onChange: (value: string) => void;
-}
-
-interface VariableOption {
-	/** Whole title after insertion, so antd's change event carries it. */
-	value: string;
-	label: string;
-	cursor: number;
-}
-
-function PanelTitleInput({
-	value,
-	onChange,
-}: PanelTitleInputProps): JSX.Element {
-	const variableNames = useDashboardVariableNames();
-	const inputRef = useRef<InputRef>(null);
-	const pendingCursor = useRef<number | null>(null);
-	const [cursor, setCursor] = useState(0);
-	const [focused, setFocused] = useState(false);
-	const [dismissed, setDismissed] = useState(false);
-
-	const options = useMemo<VariableOption[]>(() => {
-		const token = findVariableToken(value, cursor);
-		if (!token) {
-			return [];
-		}
-		const query = token.query.toLowerCase();
-		return variableNames
-			.filter((name) => name.toLowerCase().startsWith(query))
-			.map((name) => {
-				const next = insertVariable(value, token, name);
-				return { value: next.text, label: name, cursor: next.cursor };
-			});
-	}, [value, cursor, variableNames]);
-
-	useLayoutEffect(() => {
-		if (pendingCursor.current === null) {
-			return;
-		}
-		inputRef.current?.input?.setSelectionRange(
-			pendingCursor.current,
-			pendingCursor.current,
-		);
-		setCursor(pendingCursor.current);
-		pendingCursor.current = null;
-	}, [value]);
-
-	const syncCursor = (): void => {
-		setCursor(inputRef.current?.input?.selectionStart ?? 0);
-	};
-
-	const handleChange = (next: string): void => {
-		const picked = options.find((option) => option.value === next);
-		if (picked) {
-			pendingCursor.current = picked.cursor;
-			setDismissed(true);
-		} else {
-			setDismissed(false);
-			syncCursor();
-		}
-		onChange(next);
-	};
-
-	const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>): void => {
-		if (event.key === 'Escape') {
-			setDismissed(true);
-		}
-	};
-
-	return (
-		<AutoComplete
-			className={styles.autoComplete}
-			value={value}
-			maxLength={DASHBOARD_NAME_MAX_LENGTH}
-			options={options}
-			open={focused && !dismissed && options.length > 0}
-			filterOption={false}
-			onChange={handleChange}
-		>
-			<Input
-				ref={inputRef}
-				data-testid="panel-editor-v2-title"
-				placeholder="Panel title"
-				onKeyDown={handleKeyDown}
-				onKeyUp={syncCursor}
-				onClick={syncCursor}
-				onFocus={(): void => setFocused(true)}
-				onBlur={(): void => setFocused(false)}
-			/>
-		</AutoComplete>
-	);
-}
-
-export default PanelTitleInput;

frontend/src/pages/DashboardPage/DashboardContainer/PanelEditor/ConfigPane/PanelTitleInput/__tests__/PanelTitleInput.test.tsx

@@ -1,51 +0,0 @@
-import { useState } from 'react';
-import { render, screen, userEvent } from 'tests/test-utils';
-
-import PanelTitleInput from '../PanelTitleInput';
-
-jest.mock(
-	'pages/DashboardPage/DashboardContainer/hooks/useDashboardVariableNames',
-	() => ({
-		useDashboardVariableNames: (): string[] => ['service.name', 'env'],
-	}),
-);
-
-function Harness({ initial = '' }: { initial?: string }): JSX.Element {
-	const [value, setValue] = useState(initial);
-	return <PanelTitleInput value={value} onChange={setValue} />;
-}
-
-describe('PanelTitleInput', () => {
-	it('suggests no variables until a `$` is typed', async () => {
-		const user = userEvent.setup();
-		render(<Harness />);
-
-		await user.type(screen.getByTestId('panel-editor-v2-title'), 'Latency');
-
-		expect(screen.queryByText('env')).not.toBeInTheDocument();
-	});
-
-	it('suggests variables matching the text after `$`', async () => {
-		const user = userEvent.setup();
-		render(<Harness />);
-
-		await user.type(
-			screen.getByTestId('panel-editor-v2-title'),
-			'Latency of $se',
-		);
-
-		await expect(screen.findByText('service.name')).resolves.toBeInTheDocument();
-		expect(screen.queryByText('env')).not.toBeInTheDocument();
-	});
-
-	it('inserts the picked variable into the title', async () => {
-		const user = userEvent.setup();
-		render(<Harness />);
-		const input = screen.getByTestId('panel-editor-v2-title');
-
-		await user.type(input, 'Latency of $se');
-		await user.click(await screen.findByText('service.name'));
-
-		expect(input).toHaveValue('Latency of $service.name');
-	});
-});

frontend/src/pages/DashboardPage/DashboardContainer/PanelEditor/ConfigPane/PanelTitleInput/__tests__/variableToken.test.ts

@@ -1,30 +0,0 @@
-import { findVariableToken, insertVariable } from '../variableToken';
-
-describe('findVariableToken', () => {
-	it('finds the token being typed before the cursor', () => {
-		expect(findVariableToken('Latency of $ser', 15)).toStrictEqual({
-			start: 11,
-			query: 'ser',
-		});
-	});
-
-	it('matches a bare `$`', () => {
-		expect(findVariableToken('by $', 4)).toStrictEqual({ start: 3, query: '' });
-	});
-
-	it('ignores a token the cursor has moved past', () => {
-		expect(findVariableToken('$env in prod', 12)).toBeNull();
-	});
-});
-
-describe('insertVariable', () => {
-	it('replaces the whole token, including text after the cursor', () => {
-		const token = { start: 4, query: 'ser' };
-		expect(
-			insertVariable('p99 $service_x for', token, 'service.name'),
-		).toStrictEqual({
-			text: 'p99 $service.name for',
-			cursor: 17,
-		});
-	});
-});

frontend/src/pages/DashboardPage/DashboardContainer/PanelEditor/ConfigPane/PanelTitleInput/variableToken.ts

@@ -1,30 +0,0 @@
-const TOKEN_BEFORE_CURSOR = /\$([\w.]*)$/;
-const IDENTIFIER_PREFIX = /^[\w.]*/;
-
-export interface VariableToken {
-	start: number;
-	query: string;
-}
-
-export function findVariableToken(
-	text: string,
-	cursor: number,
-): VariableToken | null {
-	const match = TOKEN_BEFORE_CURSOR.exec(text.slice(0, cursor));
-	if (!match) {
-		return null;
-	}
-	return { start: match.index, query: match[1] };
-}
-
-/** Also replaces identifier chars after the cursor: `$ser|vice` leaves no `vice`. */
-export function insertVariable(
-	text: string,
-	token: VariableToken,
-	name: string,
-): { text: string; cursor: number } {
-	const before = text.slice(0, token.start);
-	const after = text.slice(token.start + 1).replace(IDENTIFIER_PREFIX, '');
-	const inserted = `${before}$${name}`;
-	return { text: `${inserted}${after}`, cursor: inserted.length };
-}

frontend/src/pages/DashboardPage/DashboardContainer/PanelEditor/ConfigPane/__tests__/ConfigPane.test.tsx

@@ -23,11 +23,6 @@ jest.mock(
 	}),
 );
 
-jest.mock(
-	'pages/DashboardPage/DashboardContainer/hooks/useDashboardVariableNames',
-	() => ({ useDashboardVariableNames: (): string[] => [] }),
-);
-
 function textSpec(): DashboardtypesPanelSpecDTO {
 	return {
 		display: { name: 'Runbook', description: 'steps' },

frontend/src/pages/DashboardPage/DashboardContainer/PanelEditor/ConfigPane/sections/ContextLinksSection/useContextLinkVariables.ts

@@ -1,6 +1,7 @@
 import { useMemo } from 'react';
 import { useQueryBuilder } from 'hooks/queryBuilder/useQueryBuilder';
-import { useDashboardVariableNames } from 'pages/DashboardPage/DashboardContainer/hooks/useDashboardVariableNames';
+import { dtoToFormModel } from 'pages/DashboardPage/DashboardContainer/DashboardSettings/Variables/variableAdapters';
+import { useDashboardFetchRequired } from 'pages/DashboardPage/DashboardContainer/hooks/useDashboardFetchRequired';
 
 import type { VariableItem } from './types';
 
@@ -21,7 +22,15 @@ const GLOBAL_TIMESTAMP_VARIABLES: VariableItem[] = [
 export function useContextLinkVariables(): VariableItem[] {
 	const { currentQuery } = useQueryBuilder();
 
-	const dashboardVariableNames = useDashboardVariableNames();
+	const { variables: variableDtos } = useDashboardFetchRequired();
+
+	const dashboardVariableNames = useMemo(
+		() =>
+			variableDtos
+				.map((dto) => dtoToFormModel(dto).name)
+				.filter((name): name is string => !!name),
+		[variableDtos],
+	);
 
 	// `_`-prefixed to match V1 and avoid colliding with dashboard-variable names.
 	const fieldVariableNames = useMemo(() => {

frontend/src/pages/DashboardPage/DashboardContainer/PanelsAndSectionsLayout/Panel/PanelHeader/PanelHeader.tsx

@@ -12,7 +12,6 @@ import type { PanelQueryData } from 'pages/DashboardPage/DashboardContainer/quer
 import type { PanelActionsConfig } from '../Panel';
 import PanelActionsMenu from '../PanelActionsMenu/PanelActionsMenu';
 import { EMPTY_PANEL_QUERY_DATA } from '../utils/emptyPanelQueryData';
-import { usePanelTitle } from '../hooks/usePanelTitle';
 import PanelHeaderSearch from './PanelHeaderSearch';
 import PanelStatusPopover from '../PanelStatus/PanelStatusPopover';
 import {
@@ -68,7 +67,7 @@ function PanelHeader(props: PanelHeaderProps): JSX.Element {
 	const { panelId, panel, panelActions, hideActions } = props;
 	const query = props.mode === 'query' ? props : null;
 
-	const name = usePanelTitle(panel);
+	const name = panel.spec.display.name;
 	const description = panel.spec.display.description;
 	const errorDetail = useMemo(
 		() => panelStatusFromError(query?.error),

frontend/src/pages/DashboardPage/DashboardContainer/PanelsAndSectionsLayout/Panel/ViewPanelModal/ViewPanelModal.tsx

@@ -5,13 +5,13 @@ import {
 	DialogHeader,
 	DialogTitle,
 } from '@signozhq/ui/dialog';
+import { TooltipSimple } from '@signozhq/ui/tooltip';
 import { Typography } from '@signozhq/ui/typography';
 import { ConfigProvider } from 'antd';
 import type { DashboardtypesPanelDTO } from 'api/generated/services/sigNoz.schemas';
 import { useRef } from 'react';
 
 import ViewPanelModalContent from './ViewPanelModalContent';
-import ViewPanelModalTitle from './ViewPanelModalTitle';
 import styles from './ViewPanelModal.module.scss';
 
 interface ViewPanelModalProps {
@@ -31,6 +31,8 @@ function ViewPanelModal({
 	open,
 	onClose,
 }: ViewPanelModalProps): JSX.Element {
+	const name = panel?.spec.display.name ?? '';
+
 	// Render antd popups into the dialog (not document.body) so they stay inside the
 	// modal's interactive, focus-trapped layer instead of being blocked by Radix.
 	const contentRef = useRef<HTMLDivElement>(null);
@@ -52,11 +54,11 @@ function ViewPanelModal({
 			>
 				<DialogHeader>
 					<DialogTitle>
-						{panel ? (
-							<ViewPanelModalTitle panel={panel} />
-						) : (
-							<Typography.Text className={styles.title}>View mode</Typography.Text>
-						)}
+						<TooltipSimple title={name} arrow>
+							<Typography.Text className={styles.title}>
+								{name ? `${name} - (View mode)` : 'View mode'}
+							</Typography.Text>
+						</TooltipSimple>
 					</DialogTitle>
 				</DialogHeader>
 				<DialogCloseButton />

frontend/src/pages/DashboardPage/DashboardContainer/PanelsAndSectionsLayout/Panel/ViewPanelModal/ViewPanelModalTitle.tsx

@@ -1,24 +0,0 @@
-import { TooltipSimple } from '@signozhq/ui/tooltip';
-import { Typography } from '@signozhq/ui/typography';
-import type { DashboardtypesPanelDTO } from 'api/generated/services/sigNoz.schemas';
-
-import { usePanelTitle } from '../hooks/usePanelTitle';
-import styles from './ViewPanelModal.module.scss';
-
-interface ViewPanelModalTitleProps {
-	panel: DashboardtypesPanelDTO;
-}
-
-function ViewPanelModalTitle({ panel }: ViewPanelModalTitleProps): JSX.Element {
-	const name = usePanelTitle(panel);
-
-	return (
-		<TooltipSimple title={name} arrow>
-			<Typography.Text className={styles.title}>
-				{name ? `${name} - (View mode)` : 'View mode'}
-			</Typography.Text>
-		</TooltipSimple>
-	);
-}
-
-export default ViewPanelModalTitle;

frontend/src/pages/DashboardPage/DashboardContainer/PanelsAndSectionsLayout/Panel/__tests__/PanelHeader.test.tsx

@@ -1,12 +1,8 @@
 import { TooltipProvider } from '@signozhq/ui/tooltip';
 import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import {
-	type DashboardtypesPanelDTO,
-	Querybuildertypesv5VariableTypeDTO,
-} from 'api/generated/services/sigNoz.schemas';
+import type { DashboardtypesPanelDTO } from 'api/generated/services/sigNoz.schemas';
 import type { PanelQueryData } from 'pages/DashboardPage/DashboardContainer/queryV5/types';
-import { useDashboardStore } from 'pages/DashboardPage/DashboardContainer/store/useDashboardStore';
 import type { ReactElement } from 'react';
 import type { Warning } from 'types/api';
 
@@ -104,30 +100,6 @@ describe('PanelHeader title and description', () => {
 		expect(screen.getByText('My panel')).toBeInTheDocument();
 	});
 
-	it('substitutes dashboard variables into the panel name', () => {
-		useDashboardStore.setState({
-			dashboardId: 'dash-1',
-			resolvedVariables: {
-				'dash-1': {
-					service: {
-						type: Querybuildertypesv5VariableTypeDTO.query,
-						value: ['cart', 'api'],
-					},
-				},
-			},
-		});
-		renderWithProvider(
-			<PanelHeader
-				{...baseProps}
-				panel={makePanel({ name: 'Latency of $service ({{missing}})' })}
-			/>,
-		);
-		expect(
-			screen.getByText('Latency of cart, api ({{missing}})'),
-		).toBeInTheDocument();
-		useDashboardStore.setState({ dashboardId: '', resolvedVariables: {} });
-	});
-
 	it('shows the description info icon when a description is provided', () => {
 		renderWithProvider(
 			<PanelHeader

frontend/src/pages/DashboardPage/DashboardContainer/PanelsAndSectionsLayout/Panel/__tests__/useViewPanel.addons.test.tsx

@@ -89,7 +89,7 @@ jest.mock(
 	'pages/DashboardPage/DashboardContainer/store/useDashboardStore',
 	() => ({
 		useDashboardStore: (selector: (s: unknown) => unknown): unknown =>
-			selector({ dashboardId: 'dash-1', resolvedVariables: {} }),
+			selector({ dashboardId: 'dash-1' }),
 	}),
 );
 

frontend/src/pages/DashboardPage/DashboardContainer/PanelsAndSectionsLayout/Panel/__tests__/useViewPanel.promql.test.tsx

@@ -38,7 +38,7 @@ jest.mock(
 	'pages/DashboardPage/DashboardContainer/store/useDashboardStore',
 	() => ({
 		useDashboardStore: (selector: (s: unknown) => unknown): unknown =>
-			selector({ dashboardId: 'dash-1', resolvedVariables: {} }),
+			selector({ dashboardId: 'dash-1' }),
 	}),
 );
 

frontend/src/pages/DashboardPage/DashboardContainer/PanelsAndSectionsLayout/Panel/hooks/useDownloadPanelCsv.ts

@@ -8,8 +8,6 @@ import type { PanelOfKind } from 'pages/DashboardPage/DashboardContainer/Panels/
 import { downloadCsv } from 'pages/DashboardPage/DashboardContainer/Panels/utils/downloadCsv';
 import type { PanelQueryData } from 'pages/DashboardPage/DashboardContainer/queryV5/types';
 
-import { usePanelTitle } from './usePanelTitle';
-
 interface UseDownloadPanelCsvArgs {
 	panel: DashboardtypesPanelDTO;
 	data: PanelQueryData;
@@ -31,7 +29,7 @@ export function useDownloadPanelCsv({
 	data,
 	canDownloadCsv,
 }: UseDownloadPanelCsvArgs): () => void {
-	const fileName = usePanelTitle(panel);
+	const fileName = panel.spec.display.name;
 
 	return useCallback((): void => {
 		if (!canDownloadCsv) {

frontend/src/pages/DashboardPage/DashboardContainer/PanelsAndSectionsLayout/Panel/hooks/useDownloadPanelMenuItem.tsx

@@ -10,7 +10,6 @@ import type { PanelQueryData } from 'pages/DashboardPage/DashboardContainer/quer
 import { buildDownloadMenuItem } from '../utils/buildDownloadMenuItem';
 import { useDownloadPanelCsv } from './useDownloadPanelCsv';
 import { useDownloadPanelImage } from './useDownloadPanelImage';
-import { usePanelTitle } from './usePanelTitle';
 
 interface UseDownloadPanelMenuItemArgs {
 	panelId: string;
@@ -29,7 +28,7 @@ export function useDownloadPanelMenuItem({
 	data,
 	actions,
 }: UseDownloadPanelMenuItemArgs): MenuItem | null {
-	const panelName = usePanelTitle(panel);
+	const panelName = panel.spec.display.name;
 	const downloadPanelCsv = useDownloadPanelCsv({
 		panel,
 		data,

frontend/src/pages/DashboardPage/DashboardContainer/PanelsAndSectionsLayout/Panel/hooks/usePanelTitle.ts

@@ -1,13 +0,0 @@
-import { useMemo } from 'react';
-import type { DashboardtypesPanelDTO } from 'api/generated/services/sigNoz.schemas';
-import { interpolateVariables } from 'pages/DashboardPage/DashboardContainer/Panels/utils/interpolateVariables';
-import { selectResolvedVariables } from 'pages/DashboardPage/DashboardContainer/store/slices/variableSelectionSlice';
-import { useDashboardStore } from 'pages/DashboardPage/DashboardContainer/store/useDashboardStore';
-
-export function usePanelTitle(panel: DashboardtypesPanelDTO): string {
-	const dashboardId = useDashboardStore((s) => s.dashboardId);
-	const variables = useDashboardStore(selectResolvedVariables(dashboardId));
-	const name = panel.spec.display.name;
-
-	return useMemo(() => interpolateVariables(name, variables), [name, variables]);
-}

frontend/src/pages/DashboardPage/DashboardContainer/components/LockedIndicator/LockedIndicator.module.scss

@@ -2,7 +2,9 @@
 	display: flex;
 	flex-direction: column;
 	position: fixed;
-	bottom: 0;
+	// Lifted above the bottom strip. Don't extend this pattern — new fixed-bottom
+	// UI belongs in the bounded layout, not in another offset here.
+	bottom: var(--bottom-strip-height, 0px);
 	left: 0;
 	width: 100%;
 	z-index: 100;

frontend/src/pages/DashboardPage/DashboardContainer/hooks/useDashboardVariableNames.ts

@@ -1,16 +0,0 @@
-import { useMemo } from 'react';
-import { dtoToFormModel } from 'pages/DashboardPage/DashboardContainer/DashboardSettings/Variables/variableAdapters';
-
-import { useDashboardFetchRequired } from './useDashboardFetchRequired';
-
-export function useDashboardVariableNames(): string[] {
-	const { variables } = useDashboardFetchRequired();
-
-	return useMemo(
-		() =>
-			variables
-				.map((dto) => dtoToFormModel(dto).name)
-				.filter((name): name is string => !!name),
-		[variables],
-	);
-}

frontend/src/pages/IntegrationsDetailsPage/CloudIntegration/stories/__story_mockdata__/cloudIntegration.ts

@@ -295,7 +295,11 @@ const account = (
 	provider,
 	providerAccountId: ACCOUNTS[provider][index],
 	config: accountConfig(provider),
-	agentReport: { timestampMillis: Date.now() - 45 * 1000, data: null },
+	agentReport: {
+		timestampMillis: Date.now() - 45 * 1000,
+		data: null,
+		syncState: null,
+	},
 	createdAt: new Date(Date.now() - 21 * 24 * 60 * 60 * 1000).toISOString(),
 	updatedAt: new Date(Date.now() - 60 * 60 * 1000).toISOString(),
 	removedAt: null,

frontend/src/pages/Support/Support.styles.scss

@@ -1,7 +1,4 @@
 .support-page-container {
-	max-height: 100vh;
-	overflow: hidden;
-
 	.support-page-header {
 		border-bottom: 1px solid var(--l1-border);
 		background: var(--l1-background);

frontend/src/pages/TraceDetailsV3/TraceDetailsV3.module.scss

@@ -1,5 +1,6 @@
 .root {
-	height: calc(100vh);
+	flex: 1;
+	min-height: 0;
 	display: flex;
 	flex-direction: column;
 }

frontend/src/pages/TracesFunnelDetails/TracesFunnelDetails.styles.scss

@@ -1,13 +1,24 @@
 .traces-funnel-details {
 	display: flex;
-	// 45px -> height of the tab bar
-	height: calc(100vh - 45px);
+	height: 100%;
 
 	&__steps-config {
 		flex-shrink: 0;
 		width: 600px;
 		border-right: 1px solid var(--l1-border);
+		// Positioning context for the absolute .steps-footer.
 		position: relative;
+		display: flex;
+		flex-direction: column;
+
+		// Scoped here so the modal usage of FunnelConfiguration on trace details
+		// stays in normal flow.
+		.funnel-configuration {
+			flex: 1;
+			min-height: 0;
+			display: flex;
+			flex-direction: column;
+		}
 	}
 	&__steps-results {
 		width: 100%;

frontend/src/pages/TracesFunnelDetails/components/FunnelConfiguration/FunnelConfiguration.styles.scss

@@ -4,14 +4,17 @@
 		flex-direction: column;
 		justify-content: flex-start;
 		&.funnel-details-page {
-			height: calc(
-				100vh - 170px
-			); // 64px bottom bar + 61px configuration header + 45px page navbar
+			flex: 1;
+			min-height: 0;
+			// .steps-footer is absolute against the config column, so its 64px is
+			// reserved rather than laid out.
+			margin-bottom: 64px;
 			overflow: auto;
 		}
 	}
 
 	&__header {
+		flex-shrink: 0;
 		display: flex;
 		align-items: center;
 		justify-content: space-between;

pkg/modules/cloudintegration/implcloudintegration/store.go

@@ -134,6 +134,24 @@ func (store *store) UpdateAccount(ctx context.Context, account *cloudintegration
 		BunDBCtx(ctx).
 		NewUpdate().
 		Model(account).
+		Column("config").
+		Column("updated_at").
+		WherePK().
+		Where("org_id = ?", account.OrgID).
+		Where("provider = ?", account.Provider).
+		Exec(ctx)
+
+	return err
+}
+
+func (store *store) UpdateAgentReport(ctx context.Context, account *cloudintegrationtypes.StorableCloudIntegration) error {
+	_, err := store.
+		store.
+		BunDBCtx(ctx).
+		NewUpdate().
+		Model(account).
+		Column("account_id").
+		Column("last_agent_report").
 		WherePK().
 		Where("org_id = ?", account.OrgID).
 		Where("provider = ?", account.Provider).

pkg/types/cloudintegrationtypes/account.go

@@ -26,6 +26,17 @@ type Account struct {
 type AgentReport struct {
 	TimestampMillis int64          `json:"timestampMillis" required:"true"`
 	Data            map[string]any `json:"data" required:"true" nullable:"true"`
+	SyncState       *SyncState     `json:"syncState" required:"true" nullable:"true"`
+}
+
+type SyncState struct {
+	Version int64                       `json:"version" required:"true"`
+	InSync  bool                        `json:"inSync" required:"true"`
+	Regions map[string]*RegionSyncState `json:"regions" required:"true" nullable:"false"`
+}
+
+type RegionSyncState struct {
+	State RegionState `json:"state" required:"true"`
 }
 
 type AccountConfig struct {
@@ -150,6 +161,7 @@ func NewAccountFromStorable(storableAccount *StorableCloudIntegration) (*Account
 		account.AgentReport = &AgentReport{
 			TimestampMillis: storableAccount.LastAgentReport.TimestampMillis,
 			Data:            storableAccount.LastAgentReport.Data,
+			SyncState:       NewSyncStateFromStorable(storableAccount.LastAgentReport.SyncState),
 		}
 	}
 
@@ -308,10 +320,101 @@ func NewAccountConfigFromUpdatable(provider CloudProviderType, config *Updatable
 	}
 }
 
-func NewAgentReport(data map[string]any) *AgentReport {
+func NewAgentReport(data map[string]any, syncState *SyncState) *AgentReport {
 	return &AgentReport{
 		TimestampMillis: time.Now().UnixMilli(),
 		Data:            data,
+		SyncState:       syncState,
+	}
+}
+
+// NewSyncState returns the sync state after a check-in without mutating previous.
+// The ack is applied before the config diff, so it is checked against the version the agent was last sent.
+func NewSyncState(previous *SyncState, regions []string, removed bool, syncedVersion *int64) *SyncState {
+	next := &SyncState{Version: 1, InSync: true, Regions: make(map[string]*RegionSyncState)}
+
+	// First check-in: seed from the config as in sync. Otherwise start from a copy of previous.
+	if previous == nil {
+		for _, region := range regions {
+			next.Regions[region] = &RegionSyncState{State: RegionStatePresent}
+		}
+	} else {
+		next.Version = previous.Version
+		next.InSync = previous.InSync
+		for region, regionSyncState := range previous.Regions {
+			next.Regions[region] = &RegionSyncState{State: regionSyncState.State}
+		}
+	}
+
+	// The agent synced this version, so its removed regions are cleaned up and can be dropped.
+	if syncedVersion != nil && *syncedVersion == next.Version {
+		next.InSync = true
+		for region, regionSyncState := range next.Regions {
+			if regionSyncState.State == RegionStateRemoved {
+				delete(next.Regions, region)
+			}
+		}
+	}
+
+	changed := false
+
+	if removed {
+		// Integration removed: every present region must be cleaned up.
+		for _, regionSyncState := range next.Regions {
+			if regionSyncState.State != RegionStateRemoved {
+				regionSyncState.State = RegionStateRemoved
+				changed = true
+			}
+		}
+	} else {
+		desiredRegions := make(map[string]struct{}, len(regions))
+		for _, region := range regions {
+			desiredRegions[region] = struct{}{}
+
+			regionSyncState, ok := next.Regions[region]
+			switch {
+			case !ok:
+				// Region added to the config.
+				next.Regions[region] = &RegionSyncState{State: RegionStatePresent}
+				changed = true
+			case regionSyncState.State == RegionStateRemoved:
+				// Region added back before its removal was acked.
+				regionSyncState.State = RegionStatePresent
+				changed = true
+			}
+		}
+
+		for region, regionSyncState := range next.Regions {
+			if _, desired := desiredRegions[region]; !desired && regionSyncState.State == RegionStatePresent {
+				// Region removed from the config.
+				regionSyncState.State = RegionStateRemoved
+				changed = true
+			}
+		}
+	}
+
+	if changed {
+		next.Version++
+		next.InSync = false
+	}
+
+	return next
+}
+
+func NewSyncStateFromStorable(storableSyncState *StorableSyncState) *SyncState {
+	if storableSyncState == nil {
+		return nil
+	}
+
+	regions := make(map[string]*RegionSyncState, len(storableSyncState.Regions))
+	for region, regionSyncState := range storableSyncState.Regions {
+		regions[region] = &RegionSyncState{State: regionSyncState.State}
+	}
+
+	return &SyncState{
+		Version: storableSyncState.Version,
+		InSync:  storableSyncState.InSync,
+		Regions: regions,
 	}
 }
 
@@ -335,6 +438,26 @@ func (account *Account) Update(provider CloudProviderType, config *AccountConfig
 	return nil
 }
 
+// NextSyncState returns the sync state for this check-in, or nil for providers without one.
+func (account *Account) NextSyncState(syncedVersion *int64) *SyncState {
+	if account.Provider != CloudProviderTypeAWS {
+		return nil
+	}
+
+	var previous *SyncState
+	if account.AgentReport != nil {
+		previous = account.AgentReport.SyncState
+	}
+
+	regions := account.Config.AWS.Regions
+	// Removed before the agent ever checked in: no region was sent to it, so there is nothing to clean up.
+	if account.AgentReport == nil && account.RemovedAt != nil {
+		regions = nil
+	}
+
+	return NewSyncState(previous, regions, account.RemovedAt != nil, syncedVersion)
+}
+
 func (postableAccount *PostableAccount) UnmarshalJSON(data []byte) error {
 	type Alias PostableAccount
 

pkg/types/cloudintegrationtypes/checkin.go

@@ -12,7 +12,8 @@ type AgentCheckInRequest struct {
 	ProviderAccountID  string      `json:"providerAccountId" required:"false"`
 	CloudIntegrationID valuer.UUID `json:"cloudIntegrationId" required:"false"`
 
-	Data map[string]any `json:"data" required:"true" nullable:"true"`
+	Data          map[string]any `json:"data" required:"true" nullable:"true"`
+	SyncedVersion *int64         `json:"syncedVersion" required:"false" nullable:"true"`
 }
 
 type PostableAgentCheckIn struct {
@@ -28,6 +29,7 @@ type AgentCheckInResponse struct {
 	ProviderAccountID  string                     `json:"providerAccountId" required:"true"`
 	IntegrationConfig  *ProviderIntegrationConfig `json:"integrationConfig" required:"true"`
 	RemovedAt          *time.Time                 `json:"removedAt" required:"true" nullable:"true"`
+	SyncState          *SyncState                 `json:"syncState" required:"true" nullable:"true"`
 }
 
 type GettableAgentCheckIn struct {
@@ -73,12 +75,13 @@ func NewGettableAgentCheckIn(provider CloudProviderType, resp *AgentCheckInRespo
 	return gettable
 }
 
-func NewAgentCheckInResponse(providerAccountID, cloudIntegrationID string, integrationConfig *ProviderIntegrationConfig, removedAt *time.Time) *AgentCheckInResponse {
+func NewAgentCheckInResponse(providerAccountID, cloudIntegrationID string, integrationConfig *ProviderIntegrationConfig, removedAt *time.Time, syncState *SyncState) *AgentCheckInResponse {
 	return &AgentCheckInResponse{
 		CloudIntegrationID: cloudIntegrationID,
 		ProviderAccountID:  providerAccountID,
 		IntegrationConfig:  integrationConfig,
 		RemovedAt:          removedAt,
+		SyncState:          syncState,
 	}
 }
 

pkg/types/cloudintegrationtypes/cloudintegration.go

@@ -25,6 +25,17 @@ var (
 	ErrCodeServiceDefinitionNotFound            = errors.MustNewCode("service_definition_not_found")
 )
 
+var (
+	RegionStatePresent = RegionState{valuer.NewString("present")}
+	RegionStateRemoved = RegionState{valuer.NewString("removed")}
+)
+
+type RegionState struct{ valuer.String }
+
+func (RegionState) Enum() []any {
+	return []any{RegionStatePresent, RegionStateRemoved}
+}
+
 // StorableCloudIntegration represents a cloud integration stored in the database.
 // This is also referred as "Account" in the context of cloud integrations.
 type StorableCloudIntegration struct {
@@ -43,8 +54,16 @@ type StorableCloudIntegration struct {
 // StorableAgentReport represents the last heartbeat and arbitrary data sent by the agent
 // as of now there is no use case for Data field, but keeping it for backwards compatibility with older structure.
 type StorableAgentReport struct {
-	TimestampMillis int64          `json:"timestamp_millis"` // backward compatibility
-	Data            map[string]any `json:"data"`
+	TimestampMillis int64              `json:"timestamp_millis"` // backward compatibility
+	Data            map[string]any     `json:"data"`
+	SyncState       *StorableSyncState `json:"sync_state,omitempty"`
+}
+
+// StorableSyncState holds every region sent to the agent. A removed region is dropped only after the agent acks Version.
+type StorableSyncState struct {
+	Version int64                       `json:"version"`
+	InSync  bool                        `json:"in_sync"`
+	Regions map[string]*RegionSyncState `json:"regions"`
 }
 
 // StorableCloudIntegrationService is to store service config for a cloud integration, which is a cloud provider specific configuration.
@@ -148,12 +167,30 @@ func NewStorableCloudIntegration(account *Account) (*StorableCloudIntegration, e
 		storableAccount.LastAgentReport = &StorableAgentReport{
 			TimestampMillis: account.AgentReport.TimestampMillis,
 			Data:            account.AgentReport.Data,
+			SyncState:       NewStorableSyncState(account.AgentReport.SyncState),
 		}
 	}
 
 	return storableAccount, nil
 }
 
+func NewStorableSyncState(syncState *SyncState) *StorableSyncState {
+	if syncState == nil {
+		return nil
+	}
+
+	regions := make(map[string]*RegionSyncState, len(syncState.Regions))
+	for region, regionSyncState := range syncState.Regions {
+		regions[region] = &RegionSyncState{State: regionSyncState.State}
+	}
+
+	return &StorableSyncState{
+		Version: syncState.Version,
+		InSync:  syncState.InSync,
+		Regions: regions,
+	}
+}
+
 // NewStorableCloudIntegrationService creates a new StorableCloudIntegrationService with
 // generated ID and timestamps from a CloudIntegrationService and its serialized config JSON.
 func NewStorableCloudIntegrationService(svc *CloudIntegrationService, configJSON string) *StorableCloudIntegrationService {
@@ -172,6 +209,7 @@ func (account *StorableCloudIntegration) Update(providerAccountID *string, agent
 		account.LastAgentReport = &StorableAgentReport{
 			TimestampMillis: agentReport.TimestampMillis,
 			Data:            agentReport.Data,
+			SyncState:       NewStorableSyncState(agentReport.SyncState),
 		}
 	}
 }

pkg/types/cloudintegrationtypes/store.go

@@ -25,9 +25,12 @@ type Store interface {
 	// CreateAccount creates a new cloud integration account
 	CreateAccount(ctx context.Context, account *StorableCloudIntegration) error
 
-	// UpdateAccount updates an existing cloud integration account
+	// UpdateAccount updates the user updatable fields (config) of an existing cloud integration account
 	UpdateAccount(ctx context.Context, account *StorableCloudIntegration) error
 
+	// UpdateAgentReport updates the provider account id and last agent report of an existing cloud integration account
+	UpdateAgentReport(ctx context.Context, account *StorableCloudIntegration) error
+
 	// RemoveAccount marks a cloud integration account as removed by setting the RemovedAt field
 	RemoveAccount(ctx context.Context, orgID, id valuer.UUID, provider CloudProviderType) error