diff --git a/frontend/src/container/ListAlertRules/ListAlert.tsx b/frontend/src/container/ListAlertRules/ListAlert.tsx
index 95c657e8e0..413c15b2b3 100644
--- a/frontend/src/container/ListAlertRules/ListAlert.tsx
+++ b/frontend/src/container/ListAlertRules/ListAlert.tsx
@@ -2,7 +2,9 @@
 import { PlusOutlined } from '@ant-design/icons';
 import { Button, notification, Tag, Typography } from 'antd';
 import Table, { ColumnsType } from 'antd/lib/table';
+import getAll from 'api/alerts/getAll';
 import ROUTES from 'constants/routes';
+import useInterval from 'hooks/useInterval';
 import history from 'lib/history';
 import React, { useCallback, useState } from 'react';
 import { generatePath } from 'react-router';
@@ -15,6 +17,16 @@ import Status from './TableComponents/Status';
 const ListAlert = ({ allAlertRules }: ListAlertProps): JSX.Element => {
 	const [data, setData] = useState<Alerts[]>(allAlertRules || []);
 
+	useInterval(() => {
+		(async (): Promise<void> => {
+			const { payload, statusCode } = await getAll();
+
+			if (statusCode === 200 && payload !== null) {
+				setData(payload);
+			}
+		})();
+	}, 30000);
+
 	const onClickNewAlertHandler = useCallback(() => {
 		history.push(ROUTES.ALERTS_NEW);
 	}, []);
diff --git a/frontend/src/container/TriggeredAlerts/TriggeredAlert.tsx b/frontend/src/container/TriggeredAlerts/TriggeredAlert.tsx
index 1dff31decd..d99cd47360 100644
--- a/frontend/src/container/TriggeredAlerts/TriggeredAlert.tsx
+++ b/frontend/src/container/TriggeredAlerts/TriggeredAlert.tsx
@@ -1,3 +1,5 @@
+import getGroupApi from 'api/alerts/getGroup';
+import useInterval from 'hooks/useInterval';
 import React, { useState } from 'react';
 import { Alerts } from 'types/api/alerts/getAll';
 
@@ -8,7 +10,27 @@ import NoFilterTable from './NoFilterTable';
 import { NoTableContainer } from './styles';
 
 const TriggeredAlerts = ({ allAlerts }: TriggeredAlertsProps): JSX.Element => {
-	const allInitialAlerts = allAlerts || [];
+	const [allInitialAlerts, setInitialAlerts] = useState(allAlerts || []);
+
+	useInterval(() => {
+		(async (): Promise<void> => {
+			const response = await getGroupApi({
+				active: true,
+				inhibited: true,
+				silenced: false,
+			});
+
+			if (response.statusCode === 200 && response.payload !== null) {
+				const initialAlerts: Alerts[] = [];
+
+				const allAlerts: Alerts[] = response.payload.reduce((acc, cur) => {
+					return [...acc, ...cur.alerts];
+				}, initialAlerts);
+
+				setInitialAlerts(allAlerts);
+			}
+		})();
+	}, 30000);
 
 	const [selectedGroup, setSelectedGroup] = useState<Value[]>([]);
 	const [selectedFilter, setSelectedFilter] = useState<Value[]>([]);
diff --git a/frontend/src/hooks/useInterval.ts b/frontend/src/hooks/useInterval.ts
new file mode 100644
index 0000000000..09438509dd
--- /dev/null
+++ b/frontend/src/hooks/useInterval.ts
@@ -0,0 +1,22 @@
+import { useEffect, useRef } from 'react';
+
+function useInterval(callback: () => void, delay: number): void {
+	const savedCallback = useRef<() => void>();
+
+	useEffect(() => {
+		savedCallback.current = callback;
+	});
+
+	useEffect(() => {
+		function tick(): void {
+			if (savedCallback.current) {
+				savedCallback.current();
+			}
+		}
+
+		const id = setInterval(tick, delay);
+		return (): void => clearInterval(id);
+	}, [delay]);
+}
+
+export default useInterval;