Removed job status table. Added existing appointments timeline to modal. Refetching on calendar on delete.

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

@@ -18,8 +18,6 @@ import JobDetailCardsPartsComponent from "./job-detail-cards.parts.component";
 import "./job-detail-cards.styles.scss";
 import JobDetailCardsTotalsComponent from "./job-detail-cards.totals.component";
 
-
-
 export default function JobDetailCards({ selectedJob }) {
   const { loading, error, data, refetch } = useQuery(QUERY_JOB_CARD_DETAILS, {
     fetchPolicy: "network-only",
@@ -33,10 +31,10 @@ export default function JobDetailCards({ selectedJob }) {
     return <div>{t("jobs.errors.nojobselected")}</div>;
   }
   if (loading) return <LoadingSpinner />;
-  if (error) return <AlertComponent message={error.message} type='error' />;
+  if (error) return <AlertComponent message={error.message} type="error" />;
 
   return (
-    <div className='job-cards-container'>
+    <div className="job-cards-container">
       <NoteUpsertModal
         jobId={data.jobs_by_pk.id}
         visible={noteModalVisible}
@@ -47,9 +45,9 @@ export default function JobDetailCards({ selectedJob }) {
         ghost={false}
         onBack={() => window.history.back()}
         tags={
-          <span key='job-status'>
-            {data.jobs_by_pk.job_status ? (
-              <Tag color='blue'>{data.jobs_by_pk.job_status.name}</Tag>
+          <span key="job-status">
+            {data.jobs_by_pk.status ? (
+              <Tag color="blue">{data.jobs_by_pk.status}</Tag>
             ) : null}
           </span>
         }
@@ -68,31 +66,34 @@ export default function JobDetailCards({ selectedJob }) {
         }
         extra={[
           <Link
-            key='documents'
-            to={`/manage/jobs/${data.jobs_by_pk.id}#documents`}>
+            key="documents"
+            to={`/manage/jobs/${data.jobs_by_pk.id}#documents`}
+          >
             <Button>
-              <Icon type='file-image' />
+              <Icon type="file-image" />
               {t("jobs.actions.addDocuments")}
             </Button>
           </Link>,
-          <Button key='printing'>
-            <Icon type='printer' />
+          <Button key="printing">
+            <Icon type="printer" />
             {t("jobs.actions.printCenter")}
           </Button>,
           <Button
-            key='notes'
-            actiontype='addNote'
+            key="notes"
+            actiontype="addNote"
             onClick={() => {
               setNoteModalVisible(!noteModalVisible);
-            }}>
-            <Icon type='edit' />
+            }}
+          >
+            <Icon type="edit" />
             {t("jobs.actions.addNote")}
           </Button>,
-          <Button key='postinvoices'>
-            <Icon type='shopping-cart' />
+          <Button key="postinvoices">
+            <Icon type="shopping-cart" />
             {t("jobs.actions.postInvoices")}
           </Button>
-        ]}>
+        ]}
+      >
         {
           //   loading ? (
           //   <LoadingSkeleton />
@@ -113,7 +114,7 @@ export default function JobDetailCards({ selectedJob }) {
           // )
         }
 
-        <section className='job-cards'>
+        <section className="job-cards">
           <JobDetailCardsCustomerComponent
             loading={loading}
             data={data ? data.jobs_by_pk : null}