From 2fce3bdcac74d778e09aca3de74ad26f2fc54190 Mon Sep 17 00:00:00 2001
From: Tert0 <62036464+Tert0@users.noreply.github.com>
Date: Mon, 10 Oct 2022 22:48:13 +0200
Subject: [PATCH] Add priority colors

---
 ui/src/message/Message.tsx  | 21 +++++++++++++++++++--
 ui/src/message/Messages.tsx |  1 +
 2 files changed, 20 insertions(+), 2 deletions(-)

diff --git a/ui/src/message/Message.tsx b/ui/src/message/Message.tsx
index 078b42c..dc1a16e 100644
--- a/ui/src/message/Message.tsx
+++ b/ui/src/message/Message.tsx
@@ -73,11 +73,22 @@ interface IProps {
     image?: string;
     date: string;
     content: string;
+    priority: number;
     fDelete: VoidFunction;
     extras?: IMessageExtras;
     height: (height: number) => void;
 }
 
+const priorityColor = (priority: number) => {
+    if (priority >= 4 && priority <= 7) {
+        return 'rgba(230, 126, 34, 0.7)';
+    } else if (priority > 7) {
+        return '#e74c3c';
+    } else {
+        return 'transparent';
+    }
+};
+
 class Message extends React.PureComponent<IProps & WithStyles<typeof styles>> {
     private node: HTMLDivElement | null = null;
 
@@ -96,11 +107,17 @@ class Message extends React.PureComponent<IProps & WithStyles<typeof styles>> {
     };
 
     public render(): React.ReactNode {
-        const {fDelete, classes, title, date, image} = this.props;
+        const {fDelete, classes, title, date, image, priority} = this.props;
 
         return (
             <div className={`${classes.wrapperPadding} message`} ref={(ref) => (this.node = ref)}>
-                <Container style={{display: 'flex'}}>
+                <Container
+                    style={{
+                        display: 'flex',
+                        borderLeftColor: priorityColor(priority),
+                        borderLeftWidth: 6,
+                        borderLeftStyle: 'solid',
+                    }}>
                     <div className={classes.imageWrapper}>
                         {image !== null ? (
                             <img
diff --git a/ui/src/message/Messages.tsx b/ui/src/message/Messages.tsx
index 7cafdab..bedb695 100644
--- a/ui/src/message/Messages.tsx
+++ b/ui/src/message/Messages.tsx
@@ -149,6 +149,7 @@ class Messages extends Component<IProps & Stores<'messagesStore' | 'appStore'>,
             content={message.message}
             image={message.image}
             extras={message.extras}
+            priority={message.priority}
         />
     );