diff --git a/.changeset/gorgeous-beers-smell.md b/.changeset/gorgeous-beers-smell.md
new file mode 100644
index 00000000..4ee718ff
--- /dev/null
+++ b/.changeset/gorgeous-beers-smell.md
@@ -0,0 +1,5 @@
+---
+'@procore-oss/backstage-plugin-announcements': minor
+---
+
+This release reverts the MUI v5 upgrade. The plugins will stay on version 4.x until there is a better understanding of the impact of the upgrade.
diff --git a/docs/search.md b/docs/search.md
index c16cdebe..d8f554f6 100644
--- a/docs/search.md
+++ b/docs/search.md
@@ -91,7 +91,7 @@ Nicely display announcements search results:
 // packages/app/src/components/search/SearchPage.tsx
 
 import { AnnouncementSearchResultListItem } from '@procore-oss/backstage-plugin-announcements';
-import RecordVoiceOverIcon from '@mui/icons-material/RecordVoiceOver';
+import RecordVoiceOverIcon from '@material-ui/icons/RecordVoiceOver';
 
 // ...
 <SearchType.Accordion
diff --git a/plugins/announcements/dev/index.tsx b/plugins/announcements/dev/index.tsx
index 37bc8b7b..3bf39934 100644
--- a/plugins/announcements/dev/index.tsx
+++ b/plugins/announcements/dev/index.tsx
@@ -19,8 +19,7 @@ import {
 } from '../src/plugin';
 import { AnnouncementsTimeline, AdminPortal } from '../src/components';
 import { signalsPlugin } from '@backstage/plugin-signals';
-import Grid from '@mui/material/Grid';
-import Typography from '@mui/material/Typography';
+import { Grid, Typography } from '@material-ui/core';
 
 const mockCatalogApi = {
   getEntityByRef: async (entityRef: string) => {
diff --git a/plugins/announcements/package.json b/plugins/announcements/package.json
index 42b629a1..650f7da8 100644
--- a/plugins/announcements/package.json
+++ b/plugins/announcements/package.json
@@ -64,11 +64,11 @@
     "@backstage/plugin-search-common": "^1.2.15",
     "@backstage/plugin-search-react": "^1.8.3",
     "@backstage/plugin-signals-react": "^0.0.7",
+    "@backstage/theme": "^0.5.7",
+    "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.11.3",
-    "@mui/icons-material": "^6.1.1",
-    "@mui/lab": "5.0.0-alpha.173",
-    "@mui/material": "^5.14.18",
-    "@mui/styles": "^5.14.18",
+    "@material-ui/lab": "4.0.0-alpha.57",
+    "@mui/material": "^5.15.6",
     "@procore-oss/backstage-plugin-announcements-common": "workspace:^",
     "@procore-oss/backstage-plugin-announcements-react": "workspace:^",
     "@uiw/react-md-editor": "^4.0.3",
diff --git a/plugins/announcements/src/alpha/navItems.tsx b/plugins/announcements/src/alpha/navItems.tsx
index 3b3b37e3..4283fe48 100644
--- a/plugins/announcements/src/alpha/navItems.tsx
+++ b/plugins/announcements/src/alpha/navItems.tsx
@@ -1,14 +1,6 @@
 import { NavItemBlueprint } from '@backstage/frontend-plugin-api';
 import { convertLegacyRouteRef } from '@backstage/core-compat-api';
 import { rootRouteRef } from '../routes';
-
-/*
-
-TODO: replace once `NavItemBlueprint.make()` supports mui v5
-      remove @material-ui dep in package.json
-
-*/
-// import NotificationsIcon from '@mui/icons-material/Notifications';
 import NotificationsIcon from '@material-ui/icons/Notifications';
 
 /**
diff --git a/plugins/announcements/src/components/Admin/AdminPortal/AdminPortal.tsx b/plugins/announcements/src/components/Admin/AdminPortal/AdminPortal.tsx
index 4ebb37aa..6e6b246f 100644
--- a/plugins/announcements/src/components/Admin/AdminPortal/AdminPortal.tsx
+++ b/plugins/announcements/src/components/Admin/AdminPortal/AdminPortal.tsx
@@ -1,15 +1,12 @@
 import React, { useState } from 'react';
-import makeStyles from '@mui/styles/makeStyles';
 import { Page, Header, Content } from '@backstage/core-components';
 import { AnnouncementsContent } from '../AnnouncementsContent';
 import { CategoriesContent } from '../CategoriesContent';
-import Tab from '@mui/material/Tab';
-import TabContext from '@mui/lab/TabContext';
-import TabList from '@mui/lab/TabList';
-import TabPanel from '@mui/lab/TabPanel';
 import { RequirePermission } from '@backstage/plugin-permission-react';
 import { announcementCreatePermission } from '@procore-oss/backstage-plugin-announcements-common';
 import { useAnnouncementsTranslation } from '@procore-oss/backstage-plugin-announcements-react';
+import { makeStyles, Tab } from '@material-ui/core';
+import { TabContext, TabList, TabPanel } from '@material-ui/lab';
 
 const useStyles = makeStyles(() => ({
   tabPanel: {
diff --git a/plugins/announcements/src/components/Admin/AnnouncementsContent/AnnouncementsContent.tsx b/plugins/announcements/src/components/Admin/AnnouncementsContent/AnnouncementsContent.tsx
index 9bb2f745..6312b815 100644
--- a/plugins/announcements/src/components/Admin/AnnouncementsContent/AnnouncementsContent.tsx
+++ b/plugins/announcements/src/components/Admin/AnnouncementsContent/AnnouncementsContent.tsx
@@ -6,9 +6,6 @@ import {
   TableColumn,
 } from '@backstage/core-components';
 import { alertApiRef, useApi } from '@backstage/core-plugin-api';
-import EditIcon from '@mui/icons-material/Edit';
-import DeleteIcon from '@mui/icons-material/Delete';
-import PreviewIcon from '@mui/icons-material/Preview';
 import {
   announcementsApiRef,
   CreateAnnouncementRequest,
@@ -26,16 +23,16 @@ import { useAsyncRetry } from 'react-use';
 import { useDeleteAnnouncementDialogState } from '../../AnnouncementsPage/useDeleteAnnouncementDialogState';
 import { DeleteAnnouncementDialog } from '../../AnnouncementsPage/DeleteAnnouncementDialog';
 import { useNavigate } from 'react-router-dom';
-import Button from '@mui/material/Button';
 import { AnnouncementForm } from '../../AnnouncementForm';
 import slugify from 'slugify';
-import Grid from '@mui/material/Grid';
-import Typography from '@mui/material/Typography';
-import IconButton from '@mui/material/IconButton';
 import {
   RequirePermission,
   usePermission,
 } from '@backstage/plugin-permission-react';
+import { Button, Grid, IconButton, Typography } from '@material-ui/core';
+import DeleteIcon from '@material-ui/icons/Delete';
+import EditIcon from '@material-ui/icons/Edit';
+import PreviewIcon from '@material-ui/icons/Visibility';
 
 export const AnnouncementsContent = () => {
   const alertApi = useApi(alertApiRef);
@@ -264,7 +261,7 @@ export const AnnouncementsContent = () => {
             columns={columns}
             data={announcements?.results ?? []}
             emptyContent={
-              <Typography p={2}>
+              <Typography style={{ padding: 2 }}>
                 {t('admin.announecementsContent.noAnnouncementsFound')}
               </Typography>
             }
diff --git a/plugins/announcements/src/components/Admin/CategoriesContent/CategoriesContent.tsx b/plugins/announcements/src/components/Admin/CategoriesContent/CategoriesContent.tsx
index 8ea59e2a..acf5d666 100644
--- a/plugins/announcements/src/components/Admin/CategoriesContent/CategoriesContent.tsx
+++ b/plugins/announcements/src/components/Admin/CategoriesContent/CategoriesContent.tsx
@@ -16,20 +16,17 @@ import {
   announcementDeletePermission,
   Category,
 } from '@procore-oss/backstage-plugin-announcements-common';
-import Button from '@mui/material/Button';
 import { CategoriesForm } from '../../CategoriesForm';
 import { useApi, alertApiRef } from '@backstage/core-plugin-api';
-import Typography from '@mui/material/Typography';
-import Grid from '@mui/material/Grid';
 import {
   RequirePermission,
   usePermission,
 } from '@backstage/plugin-permission-react';
-import IconButton from '@mui/material/IconButton';
-import DeleteIcon from '@mui/icons-material/Delete';
 import { useDeleteCategoryDialogState } from '../../CategoriesPage/useDeleteCategoryDialogState';
 import { ResponseError } from '@backstage/errors';
 import { DeleteCategoryDialog } from '../../CategoriesPage/DeleteCategoryDialog';
+import { Button, Grid, IconButton, Typography } from '@material-ui/core';
+import DeleteIcon from '@material-ui/icons/Delete';
 
 export const CategoriesContent = () => {
   const [showNewCategoryForm, setShowNewCategoryForm] = useState(false);
@@ -130,15 +127,13 @@ export const CategoriesContent = () => {
       ),
       render: rowData => {
         return (
-          <>
-            <IconButton
-              aria-label="delete"
-              disabled={loadingDeletePermission || !canDeleteAnnouncement}
-              onClick={() => openDeleteDialog(rowData)}
-            >
-              <DeleteIcon fontSize="small" data-testid="delete-icon" />
-            </IconButton>
-          </>
+          <IconButton
+            aria-label="delete"
+            disabled={loadingDeletePermission || !canDeleteAnnouncement}
+            onClick={() => openDeleteDialog(rowData)}
+          >
+            <DeleteIcon fontSize="small" data-testid="delete-icon" />
+          </IconButton>
         );
       },
     },
@@ -172,7 +167,7 @@ export const CategoriesContent = () => {
             columns={columns}
             data={categories ?? []}
             emptyContent={
-              <Typography p={2}>
+              <Typography style={{ padding: 2 }}>
                 {t('admin.categoriesContent.table.noCategoriesFound')}
               </Typography>
             }
diff --git a/plugins/announcements/src/components/AnnouncementForm/AnnouncementForm.tsx b/plugins/announcements/src/components/AnnouncementForm/AnnouncementForm.tsx
index aa799d62..388b3140 100644
--- a/plugins/announcements/src/components/AnnouncementForm/AnnouncementForm.tsx
+++ b/plugins/announcements/src/components/AnnouncementForm/AnnouncementForm.tsx
@@ -2,31 +2,28 @@ import React, { useState } from 'react';
 import MDEditor from '@uiw/react-md-editor';
 import { InfoCard } from '@backstage/core-components';
 import { identityApiRef, useApi } from '@backstage/core-plugin-api';
-import makeStyles from '@mui/styles/makeStyles';
 import {
   CreateAnnouncementRequest,
   useAnnouncementsTranslation,
 } from '@procore-oss/backstage-plugin-announcements-react';
 import { Announcement } from '@procore-oss/backstage-plugin-announcements-common';
 import CategoryInput from './CategoryInput';
-import TextField from '@mui/material/TextField';
-import Button from '@mui/material/Button';
-import FormGroup from '@mui/material/FormGroup';
-import FormControlLabel from '@mui/material/FormControlLabel';
-import Switch from '@mui/material/Switch';
-import { useTheme } from '@mui/material/styles';
-
-const useStyles = makeStyles(theme => {
-  const currentTheme = useTheme();
+import {
+  makeStyles,
+  TextField,
+  FormGroup,
+  FormControlLabel,
+  Switch,
+  Button,
+} from '@material-ui/core';
 
-  return {
-    formRoot: {
-      '& > *': {
-        margin: theme.spacing ?? currentTheme.spacing(1) ?? '8px',
-      },
+const useStyles = makeStyles(theme => ({
+  formRoot: {
+    '& > *': {
+      margin: theme.spacing(1) ?? '8px',
     },
-  };
-});
+  },
+}));
 
 type AnnouncementFormProps = {
   initialData: Announcement;
diff --git a/plugins/announcements/src/components/AnnouncementForm/CategoryInput.test.tsx b/plugins/announcements/src/components/AnnouncementForm/CategoryInput.test.tsx
index 7cc0013d..a6680394 100644
--- a/plugins/announcements/src/components/AnnouncementForm/CategoryInput.test.tsx
+++ b/plugins/announcements/src/components/AnnouncementForm/CategoryInput.test.tsx
@@ -1,12 +1,9 @@
 import React from 'react';
-
 import { screen, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
-import { TestApiProvider } from '@backstage/test-utils';
-
+import { TestApiProvider, renderInTestApp } from '@backstage/test-utils';
 import CategoryInput from './CategoryInput';
 import { announcementsApiRef } from '@procore-oss/backstage-plugin-announcements-react';
-import { renderInTestApp } from '@backstage/test-utils';
 
 const categories = [
   { title: 'Hello', slug: 'hello' },
diff --git a/plugins/announcements/src/components/AnnouncementPage/AnnouncementPage.tsx b/plugins/announcements/src/components/AnnouncementPage/AnnouncementPage.tsx
index 16cc1608..87f7e0f7 100644
--- a/plugins/announcements/src/components/AnnouncementPage/AnnouncementPage.tsx
+++ b/plugins/announcements/src/components/AnnouncementPage/AnnouncementPage.tsx
@@ -21,11 +21,11 @@ import {
   EntityPeekAheadPopover,
   entityRouteRef,
 } from '@backstage/plugin-catalog-react';
-import Alert from '@mui/material/Alert';
 import { announcementViewRouteRef, rootRouteRef } from '../../routes';
 import { announcementsApiRef } from '@procore-oss/backstage-plugin-announcements-react';
 import { Announcement } from '@procore-oss/backstage-plugin-announcements-common';
-import Grid from '@mui/material/Grid';
+import { Grid } from '@material-ui/core';
+import { Alert } from '@material-ui/lab';
 
 const AnnouncementDetails = ({
   announcement,
diff --git a/plugins/announcements/src/components/AnnouncementSearchResultListItem/AnnouncementSearchResultListItem.tsx b/plugins/announcements/src/components/AnnouncementSearchResultListItem/AnnouncementSearchResultListItem.tsx
index ba2bacc8..a878fad2 100644
--- a/plugins/announcements/src/components/AnnouncementSearchResultListItem/AnnouncementSearchResultListItem.tsx
+++ b/plugins/announcements/src/components/AnnouncementSearchResultListItem/AnnouncementSearchResultListItem.tsx
@@ -6,13 +6,15 @@ import {
   ResultHighlight,
 } from '@backstage/plugin-search-common';
 import { HighlightedSearchResultText } from '@backstage/plugin-search-react';
-import makeStyles from '@mui/styles/makeStyles';
-import Divider from '@mui/material/Divider';
-import ListItem from '@mui/material/ListItem';
-import ListItemIcon from '@mui/material/ListItemIcon';
-import ListItemText from '@mui/material/ListItemText';
-import RecordVoiceOverIcon from '@mui/icons-material/RecordVoiceOver';
 import { useAnnouncementsTranslation } from '@procore-oss/backstage-plugin-announcements-react';
+import {
+  makeStyles,
+  ListItem,
+  ListItemIcon,
+  ListItemText,
+  Divider,
+} from '@material-ui/core';
+import RecordVoiceOverIcon from '@material-ui/icons/RecordVoiceOver';
 
 const useStyles = makeStyles({
   createdAt: {
diff --git a/plugins/announcements/src/components/AnnouncementsCard/AnnouncementsCard.tsx b/plugins/announcements/src/components/AnnouncementsCard/AnnouncementsCard.tsx
index 94101b3c..9e708a23 100644
--- a/plugins/announcements/src/components/AnnouncementsCard/AnnouncementsCard.tsx
+++ b/plugins/announcements/src/components/AnnouncementsCard/AnnouncementsCard.tsx
@@ -9,8 +9,6 @@ import {
 } from '@backstage/core-components';
 import { useApi, useRouteRef } from '@backstage/core-plugin-api';
 import { announcementEntityPermissions } from '@procore-oss/backstage-plugin-announcements-common';
-import makeStyles from '@mui/styles/makeStyles';
-import NewReleasesIcon from '@mui/icons-material/NewReleases';
 import {
   announcementCreateRouteRef,
   announcementViewRouteRef,
@@ -21,11 +19,15 @@ import {
   useAnnouncements,
   useAnnouncementsTranslation,
 } from '@procore-oss/backstage-plugin-announcements-react';
-import Alert from '@mui/material/Alert';
-import List from '@mui/material/List';
-import ListItem from '@mui/material/ListItem';
-import ListItemIcon from '@mui/material/ListItemIcon';
-import ListItemText from '@mui/material/ListItemText';
+import {
+  makeStyles,
+  List,
+  ListItem,
+  ListItemIcon,
+  ListItemText,
+} from '@material-ui/core';
+import { Alert } from '@material-ui/lab';
+import NewReleasesIcon from '@material-ui/icons/NewReleases';
 
 const useStyles = makeStyles({
   newAnnouncementIcon: {
diff --git a/plugins/announcements/src/components/AnnouncementsPage/AnnouncementsPage.tsx b/plugins/announcements/src/components/AnnouncementsPage/AnnouncementsPage.tsx
index ec58a287..0efbd6a4 100644
--- a/plugins/announcements/src/components/AnnouncementsPage/AnnouncementsPage.tsx
+++ b/plugins/announcements/src/components/AnnouncementsPage/AnnouncementsPage.tsx
@@ -25,11 +25,9 @@ import {
   EntityPeekAheadPopover,
   entityRouteRef,
 } from '@backstage/plugin-catalog-react';
-import Alert from '@mui/material/Alert';
-import DeleteIcon from '@mui/icons-material/Delete';
-import EditIcon from '@mui/icons-material/Edit';
-import MoreVertIcon from '@mui/icons-material/MoreVert';
-import makeStyles from '@mui/styles/makeStyles';
+import DeleteIcon from '@material-ui/icons/Delete';
+import EditIcon from '@material-ui/icons/Edit';
+import MoreVertIcon from '@material-ui/icons/MoreVert';
 import {
   announcementCreateRouteRef,
   announcementEditRouteRef,
@@ -44,32 +42,29 @@ import {
   useAnnouncements,
   useAnnouncementsTranslation,
 } from '@procore-oss/backstage-plugin-announcements-react';
-import Tooltip from '@mui/material/Tooltip';
-import IconButton from '@mui/material/IconButton';
-import Menu from '@mui/material/Menu';
-import MenuItem from '@mui/material/MenuItem';
-import ListItemIcon from '@mui/material/ListItemIcon';
-import Card from '@mui/material/Card';
-import CardHeader from '@mui/material/CardHeader';
-import CardContent from '@mui/material/CardContent';
-import Pagination from '@mui/material/Pagination';
-import { useTheme } from '@mui/material/styles';
+import {
+  Card,
+  CardContent,
+  CardHeader,
+  IconButton,
+  ListItemIcon,
+  makeStyles,
+  Menu,
+  MenuItem,
+  Tooltip,
+} from '@material-ui/core';
+import { Alert, Pagination } from '@material-ui/lab';
 
 const useStyles = makeStyles(theme => {
-  const currentTheme = useTheme();
-
   return {
     cardHeader: {
-      color:
-        theme?.palette?.text?.primary ||
-        currentTheme?.palette?.text?.primary ||
-        '#000',
+      color: theme?.palette?.text?.primary || '#000',
       fontSize: '1.5rem',
     },
     pagination: {
       display: 'flex',
       justifyContent: 'center',
-      marginTop: theme?.spacing?.(4) || currentTheme?.spacing?.(4) || 32,
+      marginTop: theme?.spacing?.(4) || 32,
     },
   };
 });
@@ -168,7 +163,6 @@ const AnnouncementCard = ({
             data-testid="announcement-edit-menu"
             aria-label="more"
             onClick={handleOpenEditMenu}
-            size="large"
           >
             <MoreVertIcon />
           </IconButton>
diff --git a/plugins/announcements/src/components/AnnouncementsPage/ContextMenu.tsx b/plugins/announcements/src/components/AnnouncementsPage/ContextMenu.tsx
index 7fb89f8e..6b031663 100644
--- a/plugins/announcements/src/components/AnnouncementsPage/ContextMenu.tsx
+++ b/plugins/announcements/src/components/AnnouncementsPage/ContextMenu.tsx
@@ -1,21 +1,23 @@
 import React, { useState } from 'react';
 import { useNavigate } from 'react-router-dom';
 import { useRouteRef } from '@backstage/core-plugin-api';
-import IconButton from '@mui/material/IconButton';
-import ListItemIcon from '@mui/material/ListItemIcon';
-import ListItemText from '@mui/material/ListItemText';
-import MenuItem from '@mui/material/MenuItem';
-import MenuList from '@mui/material/MenuList';
-import Popover from '@mui/material/Popover';
-import makeStyles from '@mui/styles/makeStyles';
-import Description from '@mui/icons-material/Description';
-import MoreVert from '@mui/icons-material/MoreVert';
 import {
   announcementAdminRouteRef,
   categoriesListRouteRef,
 } from '../../routes';
-import Box from '@mui/material/Box';
 import { useAnnouncementsTranslation } from '@procore-oss/backstage-plugin-announcements-react';
+import {
+  makeStyles,
+  Box,
+  IconButton,
+  Popover,
+  MenuList,
+  MenuItem,
+  ListItemIcon,
+  ListItemText,
+} from '@material-ui/core';
+import MoreVert from '@material-ui/icons/MoreVert';
+import Description from '@material-ui/icons/Description';
 
 const useStyles = makeStyles({
   button: {
@@ -49,7 +51,6 @@ export function ContextMenu() {
         data-testid="menu-button"
         color="inherit"
         className={classes.button}
-        size="large"
       >
         <MoreVert />
       </IconButton>
diff --git a/plugins/announcements/src/components/AnnouncementsPage/DeleteAnnouncementDialog.tsx b/plugins/announcements/src/components/AnnouncementsPage/DeleteAnnouncementDialog.tsx
index e8e4836f..2184b2e8 100644
--- a/plugins/announcements/src/components/AnnouncementsPage/DeleteAnnouncementDialog.tsx
+++ b/plugins/announcements/src/components/AnnouncementsPage/DeleteAnnouncementDialog.tsx
@@ -1,8 +1,5 @@
 import { usePermission } from '@backstage/plugin-permission-react';
-import Button from '@mui/material/Button';
-import Dialog from '@mui/material/Dialog';
-import DialogActions from '@mui/material/DialogActions';
-import DialogTitle from '@mui/material/DialogTitle';
+import { Button, Dialog, DialogActions, DialogTitle } from '@material-ui/core';
 import { announcementDeletePermission } from '@procore-oss/backstage-plugin-announcements-common';
 import { useAnnouncementsTranslation } from '@procore-oss/backstage-plugin-announcements-react';
 import React from 'react';
diff --git a/plugins/announcements/src/components/AnnouncementsTimeline/AnnouncementsTimeline.tsx b/plugins/announcements/src/components/AnnouncementsTimeline/AnnouncementsTimeline.tsx
index 1ded9b1c..60066b44 100644
--- a/plugins/announcements/src/components/AnnouncementsTimeline/AnnouncementsTimeline.tsx
+++ b/plugins/announcements/src/components/AnnouncementsTimeline/AnnouncementsTimeline.tsx
@@ -1,16 +1,6 @@
 import { useRouteRef } from '@backstage/core-plugin-api';
-import {
-  Timeline,
-  TimelineItem,
-  TimelineContent,
-  TimelineOppositeContent,
-  TimelineConnector,
-  TimelineDot,
-  TimelineSeparator,
-} from '@mui/lab';
 import React from 'react';
 import { Link } from 'react-router-dom';
-import Stack from '@mui/material/Stack';
 import { DateTime } from 'luxon';
 import { announcementViewRouteRef } from '../../routes';
 import {
@@ -18,8 +8,17 @@ import {
   useAnnouncementsTranslation,
 } from '@procore-oss/backstage-plugin-announcements-react';
 import { Progress } from '@backstage/core-components';
-import Box from '@mui/material/Box';
-import Typography from '@mui/material/Typography';
+import {
+  Timeline,
+  TimelineItem,
+  TimelineConnector,
+  TimelineDot,
+  TimelineSeparator,
+  TimelineOppositeContent,
+  TimelineContent,
+} from '@material-ui/lab';
+import { Box, Typography } from '@material-ui/core';
+import Stack from '@mui/material/Stack';
 
 /**
  * Props for the AnnouncementsTimeline component.
@@ -105,7 +104,7 @@ export const AnnouncementsTimeline = ({
       spacing={0}
     >
       <Box sx={{ minWidth: timelineMinWidth }}>
-        <Timeline position={timelineAlignment}>
+        <Timeline align={timelineAlignment}>
           {announcements.results.map(a => (
             <TimelineItem key={`ti-${a.id}`}>
               <TimelineOppositeContent
diff --git a/plugins/announcements/src/components/CategoriesForm/CategoriesForm.tsx b/plugins/announcements/src/components/CategoriesForm/CategoriesForm.tsx
index 2a421c30..62958a80 100644
--- a/plugins/announcements/src/components/CategoriesForm/CategoriesForm.tsx
+++ b/plugins/announcements/src/components/CategoriesForm/CategoriesForm.tsx
@@ -8,19 +8,14 @@ import {
   announcementCreatePermission,
   Category,
 } from '@procore-oss/backstage-plugin-announcements-common';
-import makeStyles from '@mui/styles/makeStyles';
-import TextField from '@mui/material/TextField';
-import Button from '@mui/material/Button';
 import { usePermission } from '@backstage/plugin-permission-react';
-import { useTheme } from '@mui/material/styles';
+import { Button, makeStyles, TextField } from '@material-ui/core';
 
 const useStyles = makeStyles(theme => {
-  const currentTheme = useTheme();
-
   return {
     formRoot: {
       '& > *': {
-        margin: theme?.spacing?.(1) ?? currentTheme.spacing(1) ?? '8px',
+        margin: theme?.spacing?.(1) ?? '8px',
       },
     },
   };
diff --git a/plugins/announcements/src/components/CategoriesPage/CategoriesPage.tsx b/plugins/announcements/src/components/CategoriesPage/CategoriesPage.tsx
index bf42798b..3d3a504e 100644
--- a/plugins/announcements/src/components/CategoriesPage/CategoriesPage.tsx
+++ b/plugins/announcements/src/components/CategoriesPage/CategoriesPage.tsx
@@ -7,21 +7,20 @@ import {
   TableColumn,
   ErrorPanel,
 } from '@backstage/core-components';
-import AddIcon from '@mui/icons-material/Add';
-import DeleteIcon from '@mui/icons-material/Delete';
 import { NewCategoryDialog } from '../NewCategoryDialog';
 import {
   useAnnouncementsTranslation,
   useCategories,
+  announcementsApiRef,
 } from '@procore-oss/backstage-plugin-announcements-react';
 import { Category } from '@procore-oss/backstage-plugin-announcements-common';
 import { useDeleteCategoryDialogState } from './useDeleteCategoryDialogState';
 import { alertApiRef, useApi } from '@backstage/core-plugin-api';
-import { announcementsApiRef } from '@procore-oss/backstage-plugin-announcements-react';
 import { DeleteCategoryDialog } from './DeleteCategoryDialog';
 import { ResponseError } from '@backstage/errors';
-import IconButton from '@mui/material/IconButton';
-import Typography from '@mui/material/Typography';
+import { IconButton, Typography } from '@material-ui/core';
+import AddIcon from '@material-ui/icons/Add';
+import DeleteIcon from '@material-ui/icons/Delete';
 
 const CategoriesTable = () => {
   const [newCategoryDialogOpen, setNewCategoryDialogOpen] = useState(false);
@@ -85,7 +84,7 @@ const CategoriesTable = () => {
       field: 'actions',
       render: category => {
         return (
-          <IconButton onClick={() => openDeleteDialog(category)} size="large">
+          <IconButton onClick={() => openDeleteDialog(category)}>
             <DeleteIcon />
           </IconButton>
         );
@@ -110,7 +109,7 @@ const CategoriesTable = () => {
           },
         ]}
         emptyContent={
-          <Typography p={2}>
+          <Typography style={{ padding: 2 }}>
             {t('categoriesTable.noCategoriesFound')}
           </Typography>
         }
diff --git a/plugins/announcements/src/components/CategoriesPage/DeleteCategoryDialog.tsx b/plugins/announcements/src/components/CategoriesPage/DeleteCategoryDialog.tsx
index c74075ca..e627bbb6 100644
--- a/plugins/announcements/src/components/CategoriesPage/DeleteCategoryDialog.tsx
+++ b/plugins/announcements/src/components/CategoriesPage/DeleteCategoryDialog.tsx
@@ -1,8 +1,5 @@
-import Button from '@mui/material/Button';
-import Dialog from '@mui/material/Dialog';
-import DialogActions from '@mui/material/DialogActions';
-import DialogTitle from '@mui/material/DialogTitle';
 import React from 'react';
+import { Dialog, DialogTitle, DialogActions, Button } from '@material-ui/core';
 
 type DeleteCategoryDialogProps = {
   open: boolean;
diff --git a/plugins/announcements/src/components/EditAnnouncementPage/EditAnnouncementPage.tsx b/plugins/announcements/src/components/EditAnnouncementPage/EditAnnouncementPage.tsx
index 27465c72..1b644180 100644
--- a/plugins/announcements/src/components/EditAnnouncementPage/EditAnnouncementPage.tsx
+++ b/plugins/announcements/src/components/EditAnnouncementPage/EditAnnouncementPage.tsx
@@ -13,7 +13,7 @@ import {
   CreateAnnouncementRequest,
   useAnnouncementsTranslation,
 } from '@procore-oss/backstage-plugin-announcements-react';
-import Alert from '@mui/material/Alert';
+import { Alert } from '@material-ui/lab';
 
 type EditAnnouncementPageProps = {
   themeId: string;
diff --git a/plugins/announcements/src/components/NewAnnouncementBanner/NewAnnouncementBanner.tsx b/plugins/announcements/src/components/NewAnnouncementBanner/NewAnnouncementBanner.tsx
index f9b9bf0b..ecca6199 100644
--- a/plugins/announcements/src/components/NewAnnouncementBanner/NewAnnouncementBanner.tsx
+++ b/plugins/announcements/src/components/NewAnnouncementBanner/NewAnnouncementBanner.tsx
@@ -2,8 +2,6 @@ import React, { useEffect, useState } from 'react';
 import { DateTime } from 'luxon';
 import { Link } from '@backstage/core-components';
 import { useApi, useRouteRef } from '@backstage/core-plugin-api';
-import makeStyles from '@mui/styles/makeStyles';
-import Close from '@mui/icons-material/Close';
 import { announcementViewRouteRef } from '../../routes';
 import {
   announcementsApiRef,
@@ -16,22 +14,23 @@ import {
   SIGNALS_CHANNEL_ANNOUNCEMENTS,
 } from '@procore-oss/backstage-plugin-announcements-common';
 import { useSignal } from '@backstage/plugin-signals-react';
-import Snackbar from '@mui/material/Snackbar';
-import SnackbarContent from '@mui/material/SnackbarContent';
-import IconButton from '@mui/material/IconButton';
-import Alert from '@mui/material/Alert';
-import { useTheme } from '@mui/material/styles';
+import {
+  makeStyles,
+  Snackbar,
+  SnackbarContent,
+  IconButton,
+} from '@material-ui/core';
+import Close from '@material-ui/icons/Close';
+import { Alert } from '@material-ui/lab';
 
 const useStyles = makeStyles(theme => {
-  const currentTheme = useTheme();
-
   return {
     // showing on top, as a block
     blockPositioning: {
-      padding: theme?.spacing?.(0) ?? currentTheme.spacing(0) ?? 0,
+      padding: theme?.spacing?.(0) ?? 0,
       position: 'relative',
-      marginBottom: theme?.spacing?.(4) ?? currentTheme.spacing(4) ?? 32,
-      marginTop: theme?.spacing?.(3) ?? currentTheme.spacing(3) ?? -24,
+      marginBottom: theme?.spacing?.(4) ?? 32,
+      marginTop: theme?.spacing?.(3) ?? -24,
       zIndex: 'unset',
     },
     // showing on top, as a floating alert
@@ -47,21 +46,12 @@ const useStyles = makeStyles(theme => {
       width: '100%',
       maxWidth: 'inherit',
       flexWrap: 'nowrap',
-      backgroundColor:
-        theme?.palette?.banner?.info ??
-        currentTheme.palette?.banner?.info ??
-        '#f0f0f0',
+      backgroundColor: theme?.palette?.banner?.info ?? '#f0f0f0',
       display: 'flex',
       alignItems: 'center',
-      color:
-        theme?.palette?.banner?.text ??
-        currentTheme.palette?.banner?.text ??
-        '#000000',
+      color: theme?.palette?.banner?.text ?? '#000000',
       '& a': {
-        color:
-          theme?.palette?.banner?.link ??
-          currentTheme.palette?.banner?.link ??
-          '#0068c8',
+        color: theme?.palette?.banner?.link ?? '#0068c8',
       },
     },
   };
@@ -117,7 +107,6 @@ const AnnouncementBanner = (props: AnnouncementBannerProps) => {
             title={t('newAnnouncementBanner.markAsSeen')}
             color="inherit"
             onClick={handleClick}
-            size="large"
           >
             <Close className={classes.icon} />
           </IconButton>,
diff --git a/plugins/announcements/src/components/NewCategoryDialog/NewCategoryDialog.tsx b/plugins/announcements/src/components/NewCategoryDialog/NewCategoryDialog.tsx
index f9f4350f..2315e9c7 100644
--- a/plugins/announcements/src/components/NewCategoryDialog/NewCategoryDialog.tsx
+++ b/plugins/announcements/src/components/NewCategoryDialog/NewCategoryDialog.tsx
@@ -4,12 +4,14 @@ import {
   announcementsApiRef,
   useAnnouncementsTranslation,
 } from '@procore-oss/backstage-plugin-announcements-react';
-import Dialog from '@mui/material/Dialog';
-import DialogTitle from '@mui/material/DialogTitle';
-import DialogContent from '@mui/material/DialogContent';
-import TextField from '@mui/material/TextField';
-import DialogActions from '@mui/material/DialogActions';
-import Button from '@mui/material/Button';
+import {
+  Button,
+  Dialog,
+  DialogActions,
+  DialogContent,
+  DialogTitle,
+  TextField,
+} from '@material-ui/core';
 
 type NewCategoryDialogProps = {
   open: boolean;
diff --git a/yarn.lock b/yarn.lock
index 3ab33c63..922bdf4f 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2448,7 +2448,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/runtime@npm:^7.0.0, @babel/runtime@npm:^7.1.2, @babel/runtime@npm:^7.10.1, @babel/runtime@npm:^7.12.5, @babel/runtime@npm:^7.14.6, @babel/runtime@npm:^7.15.4, @babel/runtime@npm:^7.17.2, @babel/runtime@npm:^7.18.3, @babel/runtime@npm:^7.20.6, @babel/runtime@npm:^7.21.0, @babel/runtime@npm:^7.23.9, @babel/runtime@npm:^7.25.6, @babel/runtime@npm:^7.3.1, @babel/runtime@npm:^7.4.4, @babel/runtime@npm:^7.5.5, @babel/runtime@npm:^7.6.0, @babel/runtime@npm:^7.7.6, @babel/runtime@npm:^7.8.3, @babel/runtime@npm:^7.8.4, @babel/runtime@npm:^7.8.7, @babel/runtime@npm:^7.9.2":
+"@babel/runtime@npm:^7.0.0, @babel/runtime@npm:^7.1.2, @babel/runtime@npm:^7.10.1, @babel/runtime@npm:^7.12.5, @babel/runtime@npm:^7.14.6, @babel/runtime@npm:^7.15.4, @babel/runtime@npm:^7.17.2, @babel/runtime@npm:^7.18.3, @babel/runtime@npm:^7.20.6, @babel/runtime@npm:^7.21.0, @babel/runtime@npm:^7.23.9, @babel/runtime@npm:^7.3.1, @babel/runtime@npm:^7.4.4, @babel/runtime@npm:^7.5.5, @babel/runtime@npm:^7.6.0, @babel/runtime@npm:^7.7.6, @babel/runtime@npm:^7.8.3, @babel/runtime@npm:^7.8.4, @babel/runtime@npm:^7.8.7, @babel/runtime@npm:^7.9.2":
   version: 7.25.7
   resolution: "@babel/runtime@npm:7.25.7"
   dependencies:
@@ -4363,6 +4363,22 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@backstage/theme@npm:^0.5.7":
+  version: 0.5.7
+  resolution: "@backstage/theme@npm:0.5.7"
+  dependencies:
+    "@emotion/react": "npm:^11.10.5"
+    "@emotion/styled": "npm:^11.10.5"
+    "@mui/material": "npm:^5.12.2"
+  peerDependencies:
+    "@material-ui/core": ^4.12.2
+    "@types/react": ^16.13.1 || ^17.0.0 || ^18.0.0
+    react: ^16.13.1 || ^17.0.0 || ^18.0.0
+    react-dom: ^16.13.1 || ^17.0.0 || ^18.0.0
+  checksum: 10c0/56956c8e75f5c3eaedbbc1c3fb799477b17e03cbf3c63222a40a7eb519769a6490a221a006471fb5712f58bdd299d4f1a9dbd5e9131173c90089370535f4b937
+  languageName: node
+  linkType: hard
+
 "@backstage/theme@npm:^0.6.2":
   version: 0.6.2
   resolution: "@backstage/theme@npm:0.6.2"
@@ -4758,7 +4774,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@emotion/hash@npm:^0.9.1, @emotion/hash@npm:^0.9.2":
+"@emotion/hash@npm:^0.9.2":
   version: 0.9.2
   resolution: "@emotion/hash@npm:0.9.2"
   checksum: 10c0/0dc254561a3cc0a06a10bbce7f6a997883fd240c8c1928b93713f803a2e9153a257a488537012efe89dbe1246f2abfe2add62cdb3471a13d67137fcb808e81c2
@@ -5250,44 +5266,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@floating-ui/core@npm:^1.6.0":
-  version: 1.6.8
-  resolution: "@floating-ui/core@npm:1.6.8"
-  dependencies:
-    "@floating-ui/utils": "npm:^0.2.8"
-  checksum: 10c0/d6985462aeccae7b55a2d3f40571551c8c42bf820ae0a477fc40ef462e33edc4f3f5b7f11b100de77c9b58ecb581670c5c3f46d0af82b5e30aa185c735257eb9
-  languageName: node
-  linkType: hard
-
-"@floating-ui/dom@npm:^1.0.0":
-  version: 1.6.11
-  resolution: "@floating-ui/dom@npm:1.6.11"
-  dependencies:
-    "@floating-ui/core": "npm:^1.6.0"
-    "@floating-ui/utils": "npm:^0.2.8"
-  checksum: 10c0/02ef34a75a515543c772880338eea7b66724997bd5ec7cd58d26b50325709d46d480a306b84e7d5509d734434411a4bcf23af5680c2e461e6e6a8bf45d751df8
-  languageName: node
-  linkType: hard
-
-"@floating-ui/react-dom@npm:^2.0.8":
-  version: 2.1.2
-  resolution: "@floating-ui/react-dom@npm:2.1.2"
-  dependencies:
-    "@floating-ui/dom": "npm:^1.0.0"
-  peerDependencies:
-    react: ">=16.8.0"
-    react-dom: ">=16.8.0"
-  checksum: 10c0/e855131c74e68cab505f7f44f92cd4e2efab1c125796db3116c54c0859323adae4bf697bf292ee83ac77b9335a41ad67852193d7aeace90aa2e1c4a640cafa60
-  languageName: node
-  linkType: hard
-
-"@floating-ui/utils@npm:^0.2.8":
-  version: 0.2.8
-  resolution: "@floating-ui/utils@npm:0.2.8"
-  checksum: 10c0/a8cee5f17406c900e1c3ef63e3ca89b35e7a2ed645418459a73627b93b7377477fc888081011c6cd177cac45ec2b92a6cab018c14ea140519465498dddd2d3f9
-  languageName: node
-  linkType: hard
-
 "@google-cloud/firestore@npm:^7.0.0":
   version: 7.10.0
   resolution: "@google-cloud/firestore@npm:7.10.0"
@@ -6029,6 +6007,27 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@material-ui/lab@npm:4.0.0-alpha.57":
+  version: 4.0.0-alpha.57
+  resolution: "@material-ui/lab@npm:4.0.0-alpha.57"
+  dependencies:
+    "@babel/runtime": "npm:^7.4.4"
+    "@material-ui/utils": "npm:^4.11.2"
+    clsx: "npm:^1.0.4"
+    prop-types: "npm:^15.7.2"
+    react-is: "npm:^16.8.0 || ^17.0.0"
+  peerDependencies:
+    "@material-ui/core": ^4.9.10
+    "@types/react": ^16.8.6 || ^17.0.0
+    react: ^16.8.0 || ^17.0.0
+    react-dom: ^16.8.0 || ^17.0.0
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/c167d93904b52189e33143b2db738cbe042e6dc266ce6d51ecb74e6cd79105c0c30310a98f215fa4accb3523b798947942ad60539bd3c131247ca59dcc468833
+  languageName: node
+  linkType: hard
+
 "@material-ui/lab@npm:4.0.0-alpha.61, @material-ui/lab@npm:^4.0.0-alpha.61":
   version: 4.0.0-alpha.61
   resolution: "@material-ui/lab@npm:4.0.0-alpha.61"
@@ -6144,7 +6143,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@material-ui/utils@npm:^4.11.3":
+"@material-ui/utils@npm:^4.11.2, @material-ui/utils@npm:^4.11.3":
   version: 4.11.3
   resolution: "@material-ui/utils@npm:4.11.3"
   dependencies:
@@ -6371,25 +6370,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@mui/base@npm:5.0.0-beta.40":
-  version: 5.0.0-beta.40
-  resolution: "@mui/base@npm:5.0.0-beta.40"
-  dependencies:
-    "@babel/runtime": "npm:^7.23.9"
-    "@floating-ui/react-dom": "npm:^2.0.8"
-    "@mui/types": "npm:^7.2.14"
-    "@mui/utils": "npm:^5.15.14"
-    "@popperjs/core": "npm:^2.11.8"
-    clsx: "npm:^2.1.0"
-    prop-types: "npm:^15.8.1"
-  peerDependencies:
-    "@types/react": ^17.0.0 || ^18.0.0
-    react: ^17.0.0 || ^18.0.0
-    react-dom: ^17.0.0 || ^18.0.0
-  peerDependenciesMeta:
-    "@types/react":
-      optional: true
-  checksum: 10c0/631b4ee389e23d82c16c5845c2849af43000f52f1def639b9bb5bf39fd09f4eab93787d32950b715a7de7b689faab53bb7c9a78f6fd12b663876cf8128d45de1
+"@mui/core-downloads-tracker@npm:^5.16.11":
+  version: 5.16.11
+  resolution: "@mui/core-downloads-tracker@npm:5.16.11"
+  checksum: 10c0/a004e13b0ca1856322ca8045c6d88710123702b56c1b66cfb87835f3a729804e3e47b92fefdeadd7a70a0584411781ca987793ad33e36237b35d34b0d1cd38f4
   languageName: node
   linkType: hard
 
@@ -6400,37 +6384,25 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@mui/icons-material@npm:^6.1.1":
-  version: 6.1.2
-  resolution: "@mui/icons-material@npm:6.1.2"
-  dependencies:
-    "@babel/runtime": "npm:^7.25.6"
-  peerDependencies:
-    "@mui/material": ^6.1.2
-    "@types/react": ^17.0.0 || ^18.0.0 || ^19.0.0
-    react: ^17.0.0 || ^18.0.0 || ^19.0.0
-  peerDependenciesMeta:
-    "@types/react":
-      optional: true
-  checksum: 10c0/ae5f1134e3ac45914c2bfef76a31848a8dc655237a9e478959580f778c31d77e6e54a588ec0ec552d8c6a904298f02d7cf482a5d6df294389d9ea9da8109ef94
-  languageName: node
-  linkType: hard
-
-"@mui/lab@npm:5.0.0-alpha.173":
-  version: 5.0.0-alpha.173
-  resolution: "@mui/lab@npm:5.0.0-alpha.173"
+"@mui/material@npm:^5.12.2":
+  version: 5.16.7
+  resolution: "@mui/material@npm:5.16.7"
   dependencies:
     "@babel/runtime": "npm:^7.23.9"
-    "@mui/base": "npm:5.0.0-beta.40"
-    "@mui/system": "npm:^5.16.5"
+    "@mui/core-downloads-tracker": "npm:^5.16.7"
+    "@mui/system": "npm:^5.16.7"
     "@mui/types": "npm:^7.2.15"
-    "@mui/utils": "npm:^5.16.5"
+    "@mui/utils": "npm:^5.16.6"
+    "@popperjs/core": "npm:^2.11.8"
+    "@types/react-transition-group": "npm:^4.4.10"
     clsx: "npm:^2.1.0"
+    csstype: "npm:^3.1.3"
     prop-types: "npm:^15.8.1"
+    react-is: "npm:^18.3.1"
+    react-transition-group: "npm:^4.4.5"
   peerDependencies:
     "@emotion/react": ^11.5.0
     "@emotion/styled": ^11.3.0
-    "@mui/material": ">=5.15.0"
     "@types/react": ^17.0.0 || ^18.0.0
     react: ^17.0.0 || ^18.0.0
     react-dom: ^17.0.0 || ^18.0.0
@@ -6441,19 +6413,19 @@ __metadata:
       optional: true
     "@types/react":
       optional: true
-  checksum: 10c0/2ecd7da650bb5dab84035360621c2657dcd82f397e01044259b4373d54e1ecd12a8c2bc31163d0ce28f62276df208b50a6739ce8537552ec45e1005d24ba8080
+  checksum: 10c0/b11419c1a77835413471f9352586fed65fb5de19c6737e121669da0484c441c7dd9939aa73fdad779482c30efaa694fb9fdcf18dcf418af07881e60eaff92b4f
   languageName: node
   linkType: hard
 
-"@mui/material@npm:^5.12.2, @mui/material@npm:^5.14.18":
-  version: 5.16.7
-  resolution: "@mui/material@npm:5.16.7"
+"@mui/material@npm:^5.15.6":
+  version: 5.16.11
+  resolution: "@mui/material@npm:5.16.11"
   dependencies:
     "@babel/runtime": "npm:^7.23.9"
-    "@mui/core-downloads-tracker": "npm:^5.16.7"
-    "@mui/system": "npm:^5.16.7"
+    "@mui/core-downloads-tracker": "npm:^5.16.11"
+    "@mui/system": "npm:^5.16.8"
     "@mui/types": "npm:^7.2.15"
-    "@mui/utils": "npm:^5.16.6"
+    "@mui/utils": "npm:^5.16.8"
     "@popperjs/core": "npm:^2.11.8"
     "@types/react-transition-group": "npm:^4.4.10"
     clsx: "npm:^2.1.0"
@@ -6464,9 +6436,9 @@ __metadata:
   peerDependencies:
     "@emotion/react": ^11.5.0
     "@emotion/styled": ^11.3.0
-    "@types/react": ^17.0.0 || ^18.0.0
-    react: ^17.0.0 || ^18.0.0
-    react-dom: ^17.0.0 || ^18.0.0
+    "@types/react": ^17.0.0 || ^18.0.0 || ^19.0.0
+    react: ^17.0.0 || ^18.0.0 || ^19.0.0
+    react-dom: ^17.0.0 || ^18.0.0 || ^19.0.0
   peerDependenciesMeta:
     "@emotion/react":
       optional: true
@@ -6474,7 +6446,7 @@ __metadata:
       optional: true
     "@types/react":
       optional: true
-  checksum: 10c0/b11419c1a77835413471f9352586fed65fb5de19c6737e121669da0484c441c7dd9939aa73fdad779482c30efaa694fb9fdcf18dcf418af07881e60eaff92b4f
+  checksum: 10c0/ea83b160547136dd5e0f44556d1db29d35ddd4098e0966b7d713d7ae8211355873d2f07e2edd3d0089e24bbf9aac7eb50ff372077aa88b359f6e560c4601c483
   languageName: node
   linkType: hard
 
@@ -6495,6 +6467,23 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@mui/private-theming@npm:^5.16.8":
+  version: 5.16.8
+  resolution: "@mui/private-theming@npm:5.16.8"
+  dependencies:
+    "@babel/runtime": "npm:^7.23.9"
+    "@mui/utils": "npm:^5.16.8"
+    prop-types: "npm:^15.8.1"
+  peerDependencies:
+    "@types/react": ^17.0.0 || ^18.0.0 || ^19.0.0
+    react: ^17.0.0 || ^18.0.0 || ^19.0.0
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/737e6930be1dbd1dff01702e6583b8a507ca01a4a0ec140d766985b7ebaf8c444d78da52cdada89989728be444d4cd13509ba8950c4397af87c4fc8c8162741b
+  languageName: node
+  linkType: hard
+
 "@mui/styled-engine@npm:^5.16.6":
   version: 5.16.6
   resolution: "@mui/styled-engine@npm:5.16.6"
@@ -6516,38 +6505,28 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@mui/styles@npm:^5.14.18":
-  version: 5.16.7
-  resolution: "@mui/styles@npm:5.16.7"
+"@mui/styled-engine@npm:^5.16.8":
+  version: 5.16.8
+  resolution: "@mui/styled-engine@npm:5.16.8"
   dependencies:
     "@babel/runtime": "npm:^7.23.9"
-    "@emotion/hash": "npm:^0.9.1"
-    "@mui/private-theming": "npm:^5.16.6"
-    "@mui/types": "npm:^7.2.15"
-    "@mui/utils": "npm:^5.16.6"
-    clsx: "npm:^2.1.0"
+    "@emotion/cache": "npm:^11.11.0"
     csstype: "npm:^3.1.3"
-    hoist-non-react-statics: "npm:^3.3.2"
-    jss: "npm:^10.10.0"
-    jss-plugin-camel-case: "npm:^10.10.0"
-    jss-plugin-default-unit: "npm:^10.10.0"
-    jss-plugin-global: "npm:^10.10.0"
-    jss-plugin-nested: "npm:^10.10.0"
-    jss-plugin-props-sort: "npm:^10.10.0"
-    jss-plugin-rule-value-function: "npm:^10.10.0"
-    jss-plugin-vendor-prefixer: "npm:^10.10.0"
     prop-types: "npm:^15.8.1"
   peerDependencies:
-    "@types/react": ^17.0.0 || ^18.0.0
-    react: ^17.0.0
+    "@emotion/react": ^11.4.1
+    "@emotion/styled": ^11.3.0
+    react: ^17.0.0 || ^18.0.0 || ^19.0.0
   peerDependenciesMeta:
-    "@types/react":
+    "@emotion/react":
       optional: true
-  checksum: 10c0/545e96ce5955c1cfee8ba3642e121acd3fcb9af0cd515c2748729d8d36758f26eb44c36d8ab95fe9fb040d29d40fc234c6f402c60f7fbd65d902e85e5154929f
+    "@emotion/styled":
+      optional: true
+  checksum: 10c0/9c1866cf94fed61013324458be623f2de0c0cb6be065730c12441e798172a08389524b4b011c9e5a120bcc50c07cc7a835d365bd75a8b60f9a553d1de9c8af20
   languageName: node
   linkType: hard
 
-"@mui/system@npm:^5.16.5, @mui/system@npm:^5.16.7":
+"@mui/system@npm:^5.16.7":
   version: 5.16.7
   resolution: "@mui/system@npm:5.16.7"
   dependencies:
@@ -6575,7 +6554,35 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@mui/types@npm:^7.2.14, @mui/types@npm:^7.2.15":
+"@mui/system@npm:^5.16.8":
+  version: 5.16.8
+  resolution: "@mui/system@npm:5.16.8"
+  dependencies:
+    "@babel/runtime": "npm:^7.23.9"
+    "@mui/private-theming": "npm:^5.16.8"
+    "@mui/styled-engine": "npm:^5.16.8"
+    "@mui/types": "npm:^7.2.15"
+    "@mui/utils": "npm:^5.16.8"
+    clsx: "npm:^2.1.0"
+    csstype: "npm:^3.1.3"
+    prop-types: "npm:^15.8.1"
+  peerDependencies:
+    "@emotion/react": ^11.5.0
+    "@emotion/styled": ^11.3.0
+    "@types/react": ^17.0.0 || ^18.0.0 || ^19.0.0
+    react: ^17.0.0 || ^18.0.0 || ^19.0.0
+  peerDependenciesMeta:
+    "@emotion/react":
+      optional: true
+    "@emotion/styled":
+      optional: true
+    "@types/react":
+      optional: true
+  checksum: 10c0/9b950b606fb8dd3ca4a737c2d945e0b7b30236d3857977ffc6e0dd9bc0781e00693b3690fcc80d595a6e0ad21a36cab5ed1f64df7a3217e0b033d961d91a7e51
+  languageName: node
+  linkType: hard
+
+"@mui/types@npm:^7.2.15":
   version: 7.2.17
   resolution: "@mui/types@npm:7.2.17"
   peerDependencies:
@@ -6587,7 +6594,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@mui/utils@npm:^5.15.14, @mui/utils@npm:^5.16.5, @mui/utils@npm:^5.16.6":
+"@mui/utils@npm:^5.16.6":
   version: 5.16.6
   resolution: "@mui/utils@npm:5.16.6"
   dependencies:
@@ -6607,6 +6614,26 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@mui/utils@npm:^5.16.8":
+  version: 5.16.8
+  resolution: "@mui/utils@npm:5.16.8"
+  dependencies:
+    "@babel/runtime": "npm:^7.23.9"
+    "@mui/types": "npm:^7.2.15"
+    "@types/prop-types": "npm:^15.7.12"
+    clsx: "npm:^2.1.1"
+    prop-types: "npm:^15.8.1"
+    react-is: "npm:^18.3.1"
+  peerDependencies:
+    "@types/react": ^17.0.0 || ^18.0.0 || ^19.0.0
+    react: ^17.0.0 || ^18.0.0 || ^19.0.0
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/86a1daf249a1dc766c0babe439c6874e092ce8239bdd67a57e81fc349934bdee0c98ee1833b282286847ffc16966edff88d9e2a47ac98577fb1010245191888a
+  languageName: node
+  linkType: hard
+
 "@node-saml/node-saml@npm:^5.0.0":
   version: 5.0.0
   resolution: "@node-saml/node-saml@npm:5.0.0"
@@ -7124,11 +7151,11 @@ __metadata:
     "@backstage/plugin-signals": "npm:^0.0.13"
     "@backstage/plugin-signals-react": "npm:^0.0.7"
     "@backstage/test-utils": "npm:^1.7.2"
+    "@backstage/theme": "npm:^0.5.7"
+    "@material-ui/core": "npm:^4.12.2"
     "@material-ui/icons": "npm:^4.11.3"
-    "@mui/icons-material": "npm:^6.1.1"
-    "@mui/lab": "npm:5.0.0-alpha.173"
-    "@mui/material": "npm:^5.14.18"
-    "@mui/styles": "npm:^5.14.18"
+    "@material-ui/lab": "npm:4.0.0-alpha.57"
+    "@mui/material": "npm:^5.15.6"
     "@procore-oss/backstage-plugin-announcements-common": "workspace:^"
     "@procore-oss/backstage-plugin-announcements-react": "workspace:^"
     "@testing-library/jest-dom": "npm:^6.3.0"
@@ -18861,7 +18888,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"jss-plugin-camel-case@npm:^10.10.0, jss-plugin-camel-case@npm:^10.5.1":
+"jss-plugin-camel-case@npm:^10.5.1":
   version: 10.10.0
   resolution: "jss-plugin-camel-case@npm:10.10.0"
   dependencies:
@@ -18872,7 +18899,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"jss-plugin-default-unit@npm:^10.10.0, jss-plugin-default-unit@npm:^10.5.1":
+"jss-plugin-default-unit@npm:^10.5.1":
   version: 10.10.0
   resolution: "jss-plugin-default-unit@npm:10.10.0"
   dependencies:
@@ -18882,7 +18909,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"jss-plugin-global@npm:^10.10.0, jss-plugin-global@npm:^10.5.1":
+"jss-plugin-global@npm:^10.5.1":
   version: 10.10.0
   resolution: "jss-plugin-global@npm:10.10.0"
   dependencies:
@@ -18892,7 +18919,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"jss-plugin-nested@npm:^10.10.0, jss-plugin-nested@npm:^10.5.1":
+"jss-plugin-nested@npm:^10.5.1":
   version: 10.10.0
   resolution: "jss-plugin-nested@npm:10.10.0"
   dependencies:
@@ -18903,7 +18930,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"jss-plugin-props-sort@npm:^10.10.0, jss-plugin-props-sort@npm:^10.5.1":
+"jss-plugin-props-sort@npm:^10.5.1":
   version: 10.10.0
   resolution: "jss-plugin-props-sort@npm:10.10.0"
   dependencies:
@@ -18913,7 +18940,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"jss-plugin-rule-value-function@npm:^10.10.0, jss-plugin-rule-value-function@npm:^10.5.1":
+"jss-plugin-rule-value-function@npm:^10.5.1":
   version: 10.10.0
   resolution: "jss-plugin-rule-value-function@npm:10.10.0"
   dependencies:
@@ -18924,7 +18951,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"jss-plugin-vendor-prefixer@npm:^10.10.0, jss-plugin-vendor-prefixer@npm:^10.5.1":
+"jss-plugin-vendor-prefixer@npm:^10.5.1":
   version: 10.10.0
   resolution: "jss-plugin-vendor-prefixer@npm:10.10.0"
   dependencies:
@@ -18935,7 +18962,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"jss@npm:10.10.0, jss@npm:^10.10.0, jss@npm:^10.5.1":
+"jss@npm:10.10.0, jss@npm:^10.5.1":
   version: 10.10.0
   resolution: "jss@npm:10.10.0"
   dependencies: