diff --git a/frontend/src/container/FormAlertChannels/Settings/LabelFilter.tsx b/frontend/src/container/FormAlertChannels/Settings/LabelFilter.tsx
index 2d71c520ce..21311e416d 100644
--- a/frontend/src/container/FormAlertChannels/Settings/LabelFilter.tsx
+++ b/frontend/src/container/FormAlertChannels/Settings/LabelFilter.tsx
@@ -1,5 +1,4 @@
-import { Input, Select } from 'antd';
-import FormItem from 'antd/lib/form/FormItem';
+import { Form, Input, Select } from 'antd';
 import { LabelFilterStatement } from 'container/CreateAlertChannels/config';
 import React from 'react';
 
@@ -10,7 +9,7 @@ const { Option } = Select;
 // point
 function LabelFilterForm({ setFilter }: LabelFilterProps): JSX.Element {
 	return (
-		<FormItem name="label_filter" label="Notify When (Optional)">
+		<Form.Item name="label_filter" label="Notify When (Optional)">
 			<Input.Group compact>
 				<Select
 					defaultValue="Severity"
@@ -51,7 +50,7 @@ function LabelFilterForm({ setFilter }: LabelFilterProps): JSX.Element {
 					}}
 				/>
 			</Input.Group>
-		</FormItem>
+		</Form.Item>
 	);
 }
 
diff --git a/frontend/src/container/FormAlertChannels/Settings/Pager.tsx b/frontend/src/container/FormAlertChannels/Settings/Pager.tsx
index 0e36613096..5c0ca2e7c8 100644
--- a/frontend/src/container/FormAlertChannels/Settings/Pager.tsx
+++ b/frontend/src/container/FormAlertChannels/Settings/Pager.tsx
@@ -1,5 +1,4 @@
-import { Input } from 'antd';
-import FormItem from 'antd/lib/form/FormItem';
+import { Form, Input } from 'antd';
 import React from 'react';
 import { useTranslation } from 'react-i18next';
 
@@ -11,7 +10,7 @@ function PagerForm({ setSelectedConfig }: PagerFormProps): JSX.Element {
 	const { t } = useTranslation('channels');
 	return (
 		<>
-			<FormItem name="routing_key" label={t('field_pager_routing_key')} required>
+			<Form.Item name="routing_key" label={t('field_pager_routing_key')} required>
 				<Input
 					onChange={(event): void => {
 						setSelectedConfig((value) => ({
@@ -20,9 +19,9 @@ function PagerForm({ setSelectedConfig }: PagerFormProps): JSX.Element {
 						}));
 					}}
 				/>
-			</FormItem>
+			</Form.Item>
 
-			<FormItem
+			<Form.Item
 				name="description"
 				help={t('help_pager_description')}
 				label={t('field_pager_description')}
@@ -38,9 +37,9 @@ function PagerForm({ setSelectedConfig }: PagerFormProps): JSX.Element {
 					}
 					placeholder={t('placeholder_pager_description')}
 				/>
-			</FormItem>
+			</Form.Item>
 
-			<FormItem
+			<Form.Item
 				name="severity"
 				help={t('help_pager_severity')}
 				label={t('field_pager_severity')}
@@ -53,9 +52,9 @@ function PagerForm({ setSelectedConfig }: PagerFormProps): JSX.Element {
 						}))
 					}
 				/>
-			</FormItem>
+			</Form.Item>
 
-			<FormItem
+			<Form.Item
 				name="details"
 				help={t('help_pager_details')}
 				label={t('field_pager_details')}
@@ -69,9 +68,9 @@ function PagerForm({ setSelectedConfig }: PagerFormProps): JSX.Element {
 						}))
 					}
 				/>
-			</FormItem>
+			</Form.Item>
 
-			<FormItem
+			<Form.Item
 				name="component"
 				help={t('help_pager_component')}
 				label={t('field_pager_component')}
@@ -84,9 +83,9 @@ function PagerForm({ setSelectedConfig }: PagerFormProps): JSX.Element {
 						}))
 					}
 				/>
-			</FormItem>
+			</Form.Item>
 
-			<FormItem
+			<Form.Item
 				name="group"
 				help={t('help_pager_group')}
 				label={t('field_pager_group')}
@@ -99,9 +98,9 @@ function PagerForm({ setSelectedConfig }: PagerFormProps): JSX.Element {
 						}))
 					}
 				/>
-			</FormItem>
+			</Form.Item>
 
-			<FormItem
+			<Form.Item
 				name="class"
 				help={t('help_pager_class')}
 				label={t('field_pager_class')}
@@ -114,8 +113,8 @@ function PagerForm({ setSelectedConfig }: PagerFormProps): JSX.Element {
 						}))
 					}
 				/>
-			</FormItem>
-			<FormItem
+			</Form.Item>
+			<Form.Item
 				name="client"
 				help={t('help_pager_client')}
 				label={t('field_pager_client')}
@@ -128,9 +127,9 @@ function PagerForm({ setSelectedConfig }: PagerFormProps): JSX.Element {
 						}))
 					}
 				/>
-			</FormItem>
+			</Form.Item>
 
-			<FormItem
+			<Form.Item
 				name="client_url"
 				help={t('help_pager_client_url')}
 				label={t('field_pager_client_url')}
@@ -143,7 +142,7 @@ function PagerForm({ setSelectedConfig }: PagerFormProps): JSX.Element {
 						}))
 					}
 				/>
-			</FormItem>
+			</Form.Item>
 		</>
 	);
 }
diff --git a/frontend/src/container/FormAlertChannels/Settings/Slack.tsx b/frontend/src/container/FormAlertChannels/Settings/Slack.tsx
index 89ea3d62f9..9415a500d7 100644
--- a/frontend/src/container/FormAlertChannels/Settings/Slack.tsx
+++ b/frontend/src/container/FormAlertChannels/Settings/Slack.tsx
@@ -1,5 +1,4 @@
-import { Input } from 'antd';
-import FormItem from 'antd/lib/form/FormItem';
+import { Form, Input } from 'antd';
 import React from 'react';
 import { useTranslation } from 'react-i18next';
 
@@ -12,7 +11,7 @@ function Slack({ setSelectedConfig }: SlackProps): JSX.Element {
 
 	return (
 		<>
-			<FormItem name="api_url" label={t('field_webhook_url')}>
+			<Form.Item name="api_url" label={t('field_webhook_url')}>
 				<Input
 					onChange={(event): void => {
 						setSelectedConfig((value) => ({
@@ -21,9 +20,9 @@ function Slack({ setSelectedConfig }: SlackProps): JSX.Element {
 						}));
 					}}
 				/>
-			</FormItem>
+			</Form.Item>
 
-			<FormItem
+			<Form.Item
 				name="channel"
 				help={t('slack_channel_help')}
 				label={t('field_slack_recipient')}
@@ -36,9 +35,9 @@ function Slack({ setSelectedConfig }: SlackProps): JSX.Element {
 						}))
 					}
 				/>
-			</FormItem>
+			</Form.Item>
 
-			<FormItem name="title" label={t('field_slack_title')}>
+			<Form.Item name="title" label={t('field_slack_title')}>
 				<TextArea
 					rows={4}
 					// value={`[{{ .Status | toUpper }}{{ if eq .Status \"firing\" }}:{{ .Alerts.Firing | len }}{{ end }}] {{ .CommonLabels.alertname }} for {{ .CommonLabels.job }}\n{{- if gt (len .CommonLabels) (len .GroupLabels) -}}\n{{\" \"}}(\n{{- with .CommonLabels.Remove .GroupLabels.Names }}\n    {{- range $index, $label := .SortedPairs -}}\n    {{ if $index }}, {{ end }}\n    {{- $label.Name }}=\"{{ $label.Value -}}\"\n    {{- end }}\n{{- end -}}\n)\n{{- end }}`}
@@ -49,9 +48,9 @@ function Slack({ setSelectedConfig }: SlackProps): JSX.Element {
 						}))
 					}
 				/>
-			</FormItem>
+			</Form.Item>
 
-			<FormItem name="text" label={t('field_slack_description')}>
+			<Form.Item name="text" label={t('field_slack_description')}>
 				<TextArea
 					onChange={(event): void =>
 						setSelectedConfig((value) => ({
@@ -61,7 +60,7 @@ function Slack({ setSelectedConfig }: SlackProps): JSX.Element {
 					}
 					placeholder={t('placeholder_slack_description')}
 				/>
-			</FormItem>
+			</Form.Item>
 		</>
 	);
 }
diff --git a/frontend/src/container/FormAlertChannels/Settings/Webhook.tsx b/frontend/src/container/FormAlertChannels/Settings/Webhook.tsx
index d8e8c04aff..537d826313 100644
--- a/frontend/src/container/FormAlertChannels/Settings/Webhook.tsx
+++ b/frontend/src/container/FormAlertChannels/Settings/Webhook.tsx
@@ -1,5 +1,4 @@
-import { Input } from 'antd';
-import FormItem from 'antd/lib/form/FormItem';
+import { Form, Input } from 'antd';
 import React from 'react';
 import { useTranslation } from 'react-i18next';
 
@@ -10,7 +9,7 @@ function WebhookSettings({ setSelectedConfig }: WebhookProps): JSX.Element {
 
 	return (
 		<>
-			<FormItem name="api_url" label={t('field_webhook_url')}>
+			<Form.Item name="api_url" label={t('field_webhook_url')}>
 				<Input
 					onChange={(event): void => {
 						setSelectedConfig((value) => ({
@@ -19,8 +18,8 @@ function WebhookSettings({ setSelectedConfig }: WebhookProps): JSX.Element {
 						}));
 					}}
 				/>
-			</FormItem>
-			<FormItem
+			</Form.Item>
+			<Form.Item
 				name="username"
 				label={t('field_webhook_username')}
 				help={t('help_webhook_username')}
@@ -33,8 +32,8 @@ function WebhookSettings({ setSelectedConfig }: WebhookProps): JSX.Element {
 						}));
 					}}
 				/>
-			</FormItem>
-			<FormItem
+			</Form.Item>
+			<Form.Item
 				name="password"
 				label="Password (optional)"
 				help={t('help_webhook_password')}
@@ -48,7 +47,7 @@ function WebhookSettings({ setSelectedConfig }: WebhookProps): JSX.Element {
 						}));
 					}}
 				/>
-			</FormItem>
+			</Form.Item>
 		</>
 	);
 }
diff --git a/frontend/src/container/FormAlertChannels/index.tsx b/frontend/src/container/FormAlertChannels/index.tsx
index 9cbb3a2021..41be8382ac 100644
--- a/frontend/src/container/FormAlertChannels/index.tsx
+++ b/frontend/src/container/FormAlertChannels/index.tsx
@@ -1,5 +1,4 @@
 import { Form, FormInstance, Input, Select, Typography } from 'antd';
-import FormItem from 'antd/lib/form/FormItem';
 import { Store } from 'antd/lib/form/interface';
 import ROUTES from 'constants/routes';
 import {
@@ -59,7 +58,7 @@ function FormAlertChannels({
 			<Title level={3}>{title}</Title>
 
 			<Form initialValues={initialValue} layout="vertical" form={formInstance}>
-				<FormItem label={t('field_channel_name')} labelAlign="left" name="name">
+				<Form.Item label={t('field_channel_name')} labelAlign="left" name="name">
 					<Input
 						disabled={editing}
 						onChange={(event): void => {
@@ -69,9 +68,9 @@ function FormAlertChannels({
 							}));
 						}}
 					/>
-				</FormItem>
+				</Form.Item>
 
-				<FormItem label={t('field_channel_type')} labelAlign="left" name="type">
+				<Form.Item label={t('field_channel_type')} labelAlign="left" name="type">
 					<Select disabled={editing} onChange={onTypeChangeHandler} value={type}>
 						<Option value="slack" key="slack">
 							Slack
@@ -83,11 +82,11 @@ function FormAlertChannels({
 							Pagerduty
 						</Option>
 					</Select>
-				</FormItem>
+				</Form.Item>
 
-				<FormItem>{renderSettings()}</FormItem>
+				<Form.Item>{renderSettings()}</Form.Item>
 
-				<FormItem>
+				<Form.Item>
 					<Button
 						disabled={savingState}
 						loading={savingState}
@@ -110,7 +109,7 @@ function FormAlertChannels({
 					>
 						{t('button_return')}
 					</Button>
-				</FormItem>
+				</Form.Item>
 			</Form>
 		</>
 	);