diff --git a/src/components/common/AlertBanner/AlertBanner.tsx b/src/components/common/AlertBanner/AlertBanner.tsx
index 97bd4fe48b18e1d8e200dd57d3584fdd867600c4..5888dd54add593867f412c151ba32cf5f6e7cf86 100644
--- a/src/components/common/AlertBanner/AlertBanner.tsx
+++ b/src/components/common/AlertBanner/AlertBanner.tsx
@@ -1,17 +1,18 @@
 import { Alert, Button, Grid } from "@mui/material";
-import { oneOf, string } from "prop-types";
+import { useUniqueKeys } from "../../../hooks/useUniqueKeys";
 
-export const AlertBanner = ({ type, message, link }) => {
-  // If alarm type isn't specified, then assume 'info'; otherwise use the alarm type.
-  const determineSeverity = (alarmType) => {
-    return ["error", "warning", "success"].includes(alarmType?.toLowerCase())
-      ? alarmType?.toLowerCase()
-      : "info";
-  };
+type AlertTypes = "ERROR" | "WARNING" | "INFO";
+type LowercaseAlertTypes = Lowercase<AlertTypes>;
+interface AlertBannerProps {
+  type?: AlertTypes;
+  message?: string;
+  link?: string;
+}
 
+export const AlertBanner = ({ type, message, link }: AlertBannerProps) => {
   return (
     <Alert
-      severity={determineSeverity(type)}
+      severity={(type?.toLowerCase() as LowercaseAlertTypes) ?? "info"}
       action={
         link && (
           <Button
@@ -29,37 +30,29 @@ export const AlertBanner = ({ type, message, link }) => {
     </Alert>
   );
 };
-AlertBanner.propTypes = {
-  type: oneOf([
-    "info",
-    "warning",
-    "error",
-    "success",
-    "INFO",
-    "WARNING",
-    "ERROR",
-    "SUCCESS"
-  ]),
-  message: string,
-  link: string
-};
 
-export const AlertBannerList = ({ alerts = [] }) => {
+interface AlertBannerListProps {
+  alerts?: AlertBannerProps[];
+}
+
+export const AlertBannerList = ({ alerts = [] }: AlertBannerListProps) => {
+  const alertKeys = useUniqueKeys(alerts);
   return (
     <Grid
       id="ioc-alerts"
       container
       spacing={1}
     >
-      {alerts.map((alert) => (
-        <Grid
-          item
-          xs={12}
-          key={alert?.message || alert}
-        >
-          <AlertBanner {...alert} />
-        </Grid>
-      ))}
+      {alertKeys &&
+        alerts.map((alert, i) => (
+          <Grid
+            item
+            xs={12}
+            key={alertKeys[i]}
+          >
+            <AlertBanner {...alert} />
+          </Grid>
+        ))}
     </Grid>
   );
 };