diff --git a/src/components/rule/rule-item.tsx b/src/components/rule/rule-item.tsx
index 3c5de094c947b25145b22db64e1d33aeb8215971..3bf2291d3cb562ae33301e240e2faec23587094e 100644
--- a/src/components/rule/rule-item.tsx
+++ b/src/components/rule/rule-item.tsx
@@ -9,11 +9,9 @@ const Item = styled(Box)(({ theme }) => ({
 const COLOR = [
   "primary",
   "secondary",
-  "info",
-  "warning",
-  "error",
-  "success",
-  "text",
+  "info.main",
+  "warning.main",
+  "success.main",
 ];
 
 interface Props {
@@ -22,6 +20,9 @@ interface Props {
 }
 
 const parseColor = (text: string) => {
+  if (text === "REJECT") return "error.main";
+  if (text === "DIRECT") return "text.primary";
+
   let sum = 0;
   for (let i = 0; i < text.length; i++) {
     sum += text.charCodeAt(i);
@@ -42,7 +43,7 @@ const RuleItem = (props: Props) => {
         {index}
       </Typography>
 
-      <Box>
+      <Box sx={{ userSelect: "text" }}>
         <Typography component="h6" variant="subtitle1" color="text.primary">
           {value.payload || "-"}
         </Typography>