Added sorting to msgs sub and added some styling for messaging items. BOD-309 BOD-310

client/src/components/chat-affix/chat-affix.container.jsx

@@ -10,11 +10,13 @@ import "./chat-affix.styles.scss";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectBodyshop } from "../../redux/user/user.selectors";
+import { selectChatVisible } from "../../redux/messaging/messaging.selectors";
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
+  chatVisible: selectChatVisible,
 });
 
-export function ChatAffixContainer({ bodyshop }) {
+export function ChatAffixContainer({ bodyshop, chatVisible }) {
   const { loading, error, data } = useSubscription(
     CONVERSATION_LIST_SUBSCRIPTION,
     {
@@ -26,7 +28,7 @@ export function ChatAffixContainer({ bodyshop }) {
   if (error) return <AlertComponent message={error.message} type="error" />;
 
   return (
-    <Affix className="chat-affix">
+    <Affix className={`chat-affix ${chatVisible ? "chat-affix-open" : ""}`}>
       <div>
         {bodyshop && bodyshop.messagingservicesid ? (
           <ChatAffixComponent

client/src/components/chat-affix/chat-affix.styles.scss

@@ -2,3 +2,9 @@
   position: absolute;
   bottom: 2vh;
 }
+
+.chat-affix-open {
+  -webkit-box-shadow: 0px 0px 10px 0px rgba(69, 69, 69, 1);
+  -moz-box-shadow: 0px 0px 10px 0px rgba(69, 69, 69, 1);
+  box-shadow: 0px 0px 10px 0px rgba(69, 69, 69, 1);
+}