chore: update to use DropdownMenu

jaaydenh · jaaydenh · commit 17cd758de674 · 2025-05-01T14:58:32.000Z
diff --git a/site/src/pages/DeploymentSettingsPage/AppearanceSettingsPage/AnnouncementBannerItem.tsx b/site/src/pages/DeploymentSettingsPage/AppearanceSettingsPage/AnnouncementBannerItem.tsx
@@ -3,13 +3,9 @@ import Checkbox from "@mui/material/Checkbox";
 import TableCell from "@mui/material/TableCell";
 import TableRow from "@mui/material/TableRow";
 import type { BannerConfig } from "api/typesGenerated";
-import {
-	MoreMenu,
-	MoreMenuContent,
-	MoreMenuItem,
-	MoreMenuTrigger,
-	ThreeDotsButton,
-} from "components/MoreMenu/MoreMenu";
+import { Button } from "components/Button/Button";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "components/DropdownMenu/DropdownMenu";
+import { EllipsisVertical } from "lucide-react";
 import type { FC } from "react";
 
 interface AnnouncementBannerItemProps {
@@ -48,17 +44,31 @@ export const AnnouncementBannerItem: FC<AnnouncementBannerItemProps> = ({
 			</TableCell>
 
 			<TableCell>
-				<MoreMenu>
-					<MoreMenuTrigger>
-						<ThreeDotsButton />
-					</MoreMenuTrigger>
-					<MoreMenuContent>
-						<MoreMenuItem onClick={() => onEdit()}>Edit&hellip;</MoreMenuItem>
-						<MoreMenuItem onClick={() => onDelete()} danger>
+				<DropdownMenu>
+					<DropdownMenuTrigger asChild>
+						<Button
+							size="icon-lg"
+							variant="subtle"
+							aria-label="Open menu"
+						>
+							<EllipsisVertical aria-hidden="true" />
+							<span className="sr-only">Open menu</span>
+						</Button>
+					</DropdownMenuTrigger>
+					<DropdownMenuContent align="end">
+						<DropdownMenuItem
+							onClick={() => onEdit()}
+						>
+							Edit&hellip;
+						</DropdownMenuItem>
+						<DropdownMenuItem
+							className="text-content-destructive focus:text-content-destructive"
+							onClick={() => onDelete()}
+						>
 							Delete&hellip;
-						</MoreMenuItem>
-					</MoreMenuContent>
-				</MoreMenu>
+						</DropdownMenuItem>
+					</DropdownMenuContent>
+				</DropdownMenu>
 			</TableCell>
 		</TableRow>
 	);
