From f20d77f195174fb630e4e2092270e8ccebbd5b27 Mon Sep 17 00:00:00 2001
From: Michal Murawski <michal.murawski@drivenets.com>
Date: Thu, 2 Apr 2026 12:21:57 +0200
Subject: [PATCH] refactor(design-system): remove deprecated DsSystemStatus
 component [AR-53409]

---
 .../ds-drawer/ds-drawer.stories.tsx           |  7 +-
 .../ds-system-status.module.scss              | 87 -------------------
 .../ds-system-status.stories.ts               | 48 ----------
 .../ds-system-status/ds-system-status.tsx     | 33 -------
 .../ds-system-status.types.ts                 | 37 --------
 .../src/components/ds-system-status/index.ts  | 10 ---
 packages/design-system/src/index.ts           |  1 -
 packages/design-system/vitest.config.ts       |  2 +-
 .../src/__tests__/no-deprecated.test.ts       | 11 ---
 packages/eslint-plugin/src/index.ts           |  6 --
 10 files changed, 4 insertions(+), 238 deletions(-)
 delete mode 100644 packages/design-system/src/components/ds-system-status/ds-system-status.module.scss
 delete mode 100644 packages/design-system/src/components/ds-system-status/ds-system-status.stories.ts
 delete mode 100644 packages/design-system/src/components/ds-system-status/ds-system-status.tsx
 delete mode 100644 packages/design-system/src/components/ds-system-status/ds-system-status.types.ts
 delete mode 100644 packages/design-system/src/components/ds-system-status/index.ts

diff --git a/packages/design-system/src/components/ds-drawer/ds-drawer.stories.tsx b/packages/design-system/src/components/ds-drawer/ds-drawer.stories.tsx
index 2277a16b4..9db75ccd4 100644
--- a/packages/design-system/src/components/ds-drawer/ds-drawer.stories.tsx
+++ b/packages/design-system/src/components/ds-drawer/ds-drawer.stories.tsx
@@ -6,8 +6,7 @@ import DsDrawer from './ds-drawer';
 import { DsButton } from '../ds-button';
 import { DsTextInput } from '../ds-text-input';
 import { DsIcon } from '../ds-icon';
-// TODO: Use DsStatusBadge instead.
-import { DsSystemStatus } from '../ds-system-status';
+import { DsStatusBadge } from '../ds-status-badge';
 import styles from './ds-drawer.stories.module.scss';
 import { DsTypography } from '../ds-typography';
 import type { DsDrawerProps } from './ds-drawer.types';
@@ -82,7 +81,7 @@ export const Default: Story = {
 			<>
 				<DsDrawer.Header>
 					<DsDrawer.Title>
-						Default Drawer <DsSystemStatus status="healthy" label="Active" />
+						Default Drawer <DsStatusBadge status="active" label="Active" />
 					</DsDrawer.Title>
 					<div className={styles.headerActions}>
 						<button className={styles.expand} aria-label="Expand">
@@ -179,7 +178,7 @@ export const WithTabs: Story = {
 			<>
 				<DsDrawer.Header>
 					<DsDrawer.Title>
-						Drawer with Tabs <DsSystemStatus status="healthy" label="Active" />
+						Drawer with Tabs <DsStatusBadge status="active" label="Active" />
 					</DsDrawer.Title>
 					<div className={styles.headerActions}>
 						<button className={styles.expand} aria-label="Expand">
diff --git a/packages/design-system/src/components/ds-system-status/ds-system-status.module.scss b/packages/design-system/src/components/ds-system-status/ds-system-status.module.scss
deleted file mode 100644
index 923cb1882..000000000
--- a/packages/design-system/src/components/ds-system-status/ds-system-status.module.scss
+++ /dev/null
@@ -1,87 +0,0 @@
-@use '../../styles/typography';
-
-.container {
-	@include typography.p-special;
-	@include typography.medium;
-	display: inline-flex;
-	align-items: center;
-	gap: 4px;
-	padding: 4px 8px;
-	border-radius: 4px;
-	width: max-content;
-	text-transform: uppercase;
-}
-
-.dot {
-	width: 10px;
-	height: 10px;
-	border-radius: 50%;
-	border: 1px solid var(--white);
-}
-
-.label {
-	@include typography.p-special;
-}
-
-.healthy {
-	background: var(--utility-ok);
-	color: var(--system-status-ok);
-
-	.dot {
-		background: var(--system-status-ok);
-	}
-}
-
-.neutral {
-	background: var(--utility-info);
-	color: var(--system-status-info);
-
-	.dot {
-		background: var(--system-status-info);
-	}
-}
-
-.error {
-	background: var(--utility-error);
-	color: var(--system-status-error);
-
-	.dot {
-		background: var(--system-status-error);
-	}
-}
-
-.in-progress {
-	background: var(--utility-in-progress);
-	color: var(--system-status-in-progress);
-
-	.dot {
-		background: var(--system-status-in-progress);
-	}
-}
-
-.pending {
-	background: var(--utility-pending);
-	color: var(--system-status-pending);
-
-	.dot {
-		background: var(--system-status-pending);
-	}
-}
-
-.alert {
-	background: var(--utility-alert);
-	color: var(--system-status-alert);
-
-	.dot {
-		background: var(--system-status-alert);
-	}
-}
-
-.disabled {
-	background: var(--utility-disabled);
-	color: var(--neutral-2);
-
-	.dot {
-		background: var(--neutral-2);
-	}
-}
diff --git a/packages/design-system/src/components/ds-system-status/ds-system-status.stories.ts b/packages/design-system/src/components/ds-system-status/ds-system-status.stories.ts
deleted file mode 100644
index 182a35234..000000000
--- a/packages/design-system/src/components/ds-system-status/ds-system-status.stories.ts
+++ /dev/null
@@ -1,48 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react-vite';
-import DsSystemStatus from './ds-system-status';
-import { systemStatuses } from './ds-system-status.types';
-
-/**
- * @deprecated This component is deprecated. Use `DsStatusBadge` instead.
- * @see {@link ../ds-status-badge/ds-status-badge.stories} for examples of the replacement component.
- */
-const meta: Meta<typeof DsSystemStatus> = {
-	title: 'Design System/SystemStatus (Deprecated)',
-	component: DsSystemStatus,
-	parameters: {
-		layout: 'centered',
-		docs: {
-			description: {
-				component:
-					'**Deprecated**: This component is deprecated. Please use `DsStatusBadge` instead. See the StatusBadge stories for the replacement component.',
-			},
-		},
-	},
-	tags: ['deprecated'],
-	argTypes: {
-		status: {
-			control: { type: 'select' },
-			options: systemStatuses,
-		},
-		label: {
-			control: 'text',
-			description: 'Custom label text (optional)',
-		},
-	},
-};
-
-export default meta;
-type Story = StoryObj<typeof DsSystemStatus>;
-
-export const Default: Story = {
-	args: {
-		status: 'healthy',
-	},
-};
-
-export const CustomLabel: Story = {
-	args: {
-		status: 'error',
-		label: 'Critical Error',
-	},
-};
diff --git a/packages/design-system/src/components/ds-system-status/ds-system-status.tsx b/packages/design-system/src/components/ds-system-status/ds-system-status.tsx
deleted file mode 100644
index ec3e1ef40..000000000
--- a/packages/design-system/src/components/ds-system-status/ds-system-status.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import type React from 'react';
-import classNames from 'classnames';
-import styles from './ds-system-status.module.scss';
-import type { DsSystemStatusProps } from './ds-system-status.types';
-
-/**
- * @deprecated This component is deprecated. Use `DsStatusBadge` instead.
- * @see {@link ../ds-status-badge/ds-status-badge} for the replacement component.
- */
-const defaultLabels: Record<DsSystemStatusProps['status'], string> = {
-	healthy: 'HEALTHY',
-	neutral: 'NEUTRAL',
-	error: 'ERROR',
-	'in-progress': 'IN PROGRESS',
-	pending: 'PENDING',
-	alert: 'ALERT',
-	disabled: 'DISABLED',
-};
-
-/**
- * @deprecated This component is deprecated. Use `DsStatusBadge` instead.
- * @see {@link ../ds-status-badge/ds-status-badge} for the replacement component.
- */
-const DsSystemStatus: React.FC<DsSystemStatusProps> = ({ status, label, className }) => {
-	return (
-		<div className={classNames(styles.container, styles[status], className)}>
-			<span className={styles.dot} />
-			<span className={styles.label}>{label || defaultLabels[status]}</span>
-		</div>
-	);
-};
-
-export default DsSystemStatus;
diff --git a/packages/design-system/src/components/ds-system-status/ds-system-status.types.ts b/packages/design-system/src/components/ds-system-status/ds-system-status.types.ts
deleted file mode 100644
index dd6db780b..000000000
--- a/packages/design-system/src/components/ds-system-status/ds-system-status.types.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-/**
- * @deprecated This type is deprecated. Use `DsStatusBadge` and its related types instead.
- * @see {@link ../ds-status-badge/ds-status-badge} for the replacement component.
- */
-export const systemStatuses = [
-	'healthy',
-	'neutral',
-	'error',
-	'in-progress',
-	'pending',
-	'alert',
-	'disabled',
-] as const;
-
-/**
- * @deprecated This type is deprecated. Use `DsStatus` from `ds-status-badge` instead.
- */
-export type SystemStatus = (typeof systemStatuses)[number];
-
-/**
- * @deprecated This interface is deprecated. Use `DsStatusBadgeProps` from `ds-status-badge` instead.
- * @see {@link ../ds-status-badge/ds-status-badge.types} for the replacement interface.
- */
-export interface DsSystemStatusProps {
-	/**
-	 * The status of the system
-	 */
-	status: SystemStatus;
-	/**
-	 * The label to be displayed
-	 */
-	label?: string;
-	/**
-	 * Additional CSS class names
-	 */
-	className?: string;
-}
diff --git a/packages/design-system/src/components/ds-system-status/index.ts b/packages/design-system/src/components/ds-system-status/index.ts
deleted file mode 100644
index ebe6c6671..000000000
--- a/packages/design-system/src/components/ds-system-status/index.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-/**
- * @deprecated DsSystemStatus is deprecated. Use DsStatusBadge instead.
- * @see {@link ../ds-status-badge} for the replacement component.
- */
-export { default as DsSystemStatus } from './ds-system-status';
-/**
- * @deprecated These types are deprecated. Use DsStatusBadge types instead.
- * @see {@link ../ds-status-badge} for the replacement types.
- */
-export * from './ds-system-status.types';
diff --git a/packages/design-system/src/index.ts b/packages/design-system/src/index.ts
index 8c35e2937..01c778513 100644
--- a/packages/design-system/src/index.ts
+++ b/packages/design-system/src/index.ts
@@ -43,7 +43,6 @@ export * from './components/ds-smart-tabs';
 export * from './components/ds-spinner';
 export * from './components/ds-status-badge';
 export * from './components/ds-stepper';
-export * from './components/ds-system-status';
 export * from './components/ds-table';
 export * from './components/ds-tabs';
 export * from './components/ds-tag';
diff --git a/packages/design-system/vitest.config.ts b/packages/design-system/vitest.config.ts
index 825e9cb99..d76caaea6 100644
--- a/packages/design-system/vitest.config.ts
+++ b/packages/design-system/vitest.config.ts
@@ -24,7 +24,7 @@ export default defineConfig({
 				'**/ds-chip/**',
 				'**/ds-chip-group/**',
 				'**/ds-confirmation/**',
-				'**/ds-system-status/**',
+				'**/ds-date-input/**',
 			],
 			thresholds: {
 				lines: 90,
diff --git a/packages/eslint-plugin/src/__tests__/no-deprecated.test.ts b/packages/eslint-plugin/src/__tests__/no-deprecated.test.ts
index 9a051c04a..3a14c4da6 100644
--- a/packages/eslint-plugin/src/__tests__/no-deprecated.test.ts
+++ b/packages/eslint-plugin/src/__tests__/no-deprecated.test.ts
@@ -53,17 +53,6 @@ ruleTester.run('no-deprecated-ds-confirmation', plugin.rules['no-deprecated-ds-c
 	],
 });
 
-ruleTester.run('no-deprecated-ds-system-status', plugin.rules['no-deprecated-ds-system-status'], {
-	valid: ['<DsStatusBadge />'],
-
-	invalid: [
-		{
-			code: '<DsSystemStatus />',
-			errors: [{ message: `DsSystemStatus is deprecated. Use DsStatusBadge instead.` }],
-		},
-	],
-});
-
 ruleTester.run(
 	'no-deprecated-ds-dropdown-menu-legacy',
 	plugin.rules['no-deprecated-ds-dropdown-menu-legacy'],
diff --git a/packages/eslint-plugin/src/index.ts b/packages/eslint-plugin/src/index.ts
index ac9fe3e4c..149dd3376 100644
--- a/packages/eslint-plugin/src/index.ts
+++ b/packages/eslint-plugin/src/index.ts
@@ -24,12 +24,6 @@ const eslintPlugin = createPlugin(
 		message: `DsConfirmation is deprecated. Use DsModal instead.`,
 	},
 
-	{
-		name: 'no-deprecated-ds-system-status',
-		selector: JSXElement('DsSystemStatus'),
-		message: `DsSystemStatus is deprecated. Use DsStatusBadge instead.`,
-	},
-
 	{
 		name: 'no-deprecated-ds-dropdown-menu-legacy',
 		selector: JSXElement('DsDropdownMenuLegacy'),