Feat: Add gRPC to filters

client/src/Components/monitors/ControlsFilter.tsx

@@ -6,7 +6,15 @@ import useMediaQuery from "@mui/material/useMediaQuery";
 import type { MonitorType } from "@/Types/Monitor";
 import { Typography, useTheme } from "@mui/material";
 
-const types = ["http", "ping", "port", "docker", "game"];
+const types = ["http", "ping", "port", "docker", "game", "grpc"];
+const typeDisplayNames: Record<string, string> = {
+	http: "HTTP",
+	ping: "Ping",
+	port: "Port",
+	docker: "Docker",
+	game: "Game",
+	grpc: "gRPC",
+};
 const statuses = ["up", "down"];
 const states = ["active", "paused"];
 
@@ -50,7 +58,7 @@ export const ControlsFilter = ({
 							key={type}
 							value={type}
 						>
-							<Typography textTransform={"capitalize"}>{type}</Typography>
+							<Typography>{typeDisplayNames[type] ?? type}</Typography>
 						</MenuItem>
 					))}
 				</Select>