use patternfly timout instead of own impl (#361)

src/components/alert/AlertPanel.tsx

@@ -24,6 +24,7 @@ export function AlertPanel({ alerts, onCloseAlert }: AlertPanelProps) {
         <Alert
           key={key}
           isLiveRegion
+          timeout={true}
           variant={AlertVariant[variant]}
           variantLabel=""
           title={message}

src/components/alert/Alerts.tsx

@@ -1,10 +1,4 @@
-import React, {
+import React, { useState, createContext, ReactNode, useContext } from "react";
-  useState,
-  createContext,
-  ReactNode,
-  useContext,
-  useEffect,
-} from "react";
 import { AlertType, AlertPanel } from "./AlertPanel";
 import { AlertVariant } from "@patternfly/react-core";
 
@@ -25,25 +19,11 @@ type TimeOut = {
 
 export const AlertProvider = ({ children }: { children: ReactNode }) => {
   const [alerts, setAlerts] = useState<AlertType[]>([]);
-  const [timers, setTimers] = useState<TimeOut[]>([]);
-
-  useEffect(() => {
-    const timersKeys = timers.map((timer) => timer.key);
-    const timeOuts = alerts
-      .filter((alert) => !timersKeys.includes(alert.key))
-      .map((alert) => {
-        const timeOut = setTimeout(() => hideAlert(alert.key), 8000);
-        return { key: alert.key, timeOut };
-      });
-    setTimers([...timers, ...timeOuts]);
-    return () => timers.forEach((timer) => clearTimeout(timer.timeOut));
-  }, [alerts]);
 
   const createId = () => new Date().getTime();
 
   const hideAlert = (key: number) => {
     setAlerts((alerts) => [...alerts.filter((el) => el.key !== key)]);
-    setTimers((timers) => [...timers.filter((timer) => timer.key === key)]);
   };
 
   const addAlert = (