Working Changes

client/src/components/chat-window/chat-window.component.jsx

@@ -1,5 +1,10 @@
 import React from "react";
-import { Drawer } from "antd";
+
-export default function ChatWindowComponent({ ...drawerProps }) {
+export default function ChatWindowComponent({ toggleChatVisible }) {
-  return <Drawer {...drawerProps}>Chat Windows and more</Drawer>;
+  return (
+    <div style={{ height: "300px" }}>
+      <button onClick={() => toggleChatVisible()}>hide</button> This is a chat
+      window!
+    </div>
+  );
 }

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

@@ -1,4 +1,3 @@
-import { Layout } from "antd";
 import React from "react";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
@@ -18,17 +17,8 @@ export default connect(
   mapStateToProps,
   mapDispatchToProps
 )(function ChatWindowContainer({ chatVisible, toggleChatVisible }) {
-  return (
+  if (chatVisible)
-    <Layout.Sider
+    return <ChatWindowComponent toggleChatVisible={toggleChatVisible} />;
-      collapsible
+
-      defaultCollapsed
+  return <div onClick={() => toggleChatVisible()}>Chat</div>;
-      theme="light"
-      collapsedWidth={0}
-      width={300}
-      collapsed={!chatVisible}
-      onCollapse={(collapsed, type) => toggleChatVisible()}
-    >
-      <ChatWindowComponent mask={false} maskClosable={false} zIndex={0} />
-    </Layout.Sider>
-  );
 });

client/src/components/job-detail-cards/job-detail-cards.damage.component.jsx

@@ -5,12 +5,14 @@ import UnfoldedCar from "../../assets/unfolded_car.svg";
 
 export default function JobDetailCardsDamageComponent({ loading, data }) {
   const { t } = useTranslation();
-
+  console.log("data", data);
+  const { area_of_damage } = data;
+  console.log("area_of_damage", area_of_damage);
   return (
     <CardTemplate loading={loading} title={t("jobs.labels.cards.damage")}>
       {data ? (
         <span>
-          <img src={UnfoldedCar} alt='Damaged Area' width={200} height={200} />
+          <img src={UnfoldedCar} alt="Damaged Area" width={200} height={200} />
         </span>
       ) : null}
     </CardTemplate>

client/src/graphql/jobs.queries.js

@@ -256,6 +256,7 @@ export const QUERY_JOB_CARD_DETAILS = gql`
       est_ct_ln
       clm_no
       status
+      area_of_damage
       ro_number
       scheduled_completion
       scheduled_in

client/src/pages/manage/manage.page.jsx

@@ -56,8 +56,6 @@ export default function Manage({ match }) {
         <HeaderContainer />
       </Header>
       <Layout>
-        <ChatWindowContainer />
-
         <Content
           className="content-container"
           style={{ padding: "0em 4em 4em" }}
@@ -126,6 +124,12 @@ export default function Manage({ match }) {
       </Layout>
       <Footer>
         <FooterComponent />
+        {
+          //  <Affix offsetBottom={20}>
+          //   <ChatWindowContainer />
+          // </Affix>
+        }
+        <ChatWindowContainer />
       </Footer>
       <BackTop />
     </Layout>