IO-936 Job Costing Sorting

client/src/components/time-ticket-modal/time-ticket-modal.component.jsx

@@ -39,7 +39,7 @@ export function TimeTicketModalComponent({
 
   return (
     <div>
-      <LayoutFormRow grow>
+      <LayoutFormRow grow noDivider>
         <Form.Item shouldUpdate>
           {() => (
             <Form.Item
@@ -201,6 +201,7 @@ export function LaborAllocationContainer({ jobid }) {
         joblines={lineTicketData.joblines}
         timetickets={lineTicketData.timetickets}
       />
+
       <TimeTicketList
         loading={loading}
         timetickets={lineTicketData.timetickets}

client/src/components/time-ticket-modal/time-ticket-modal.container.jsx

@@ -1,5 +1,5 @@
 import { useMutation, useQuery } from "@apollo/client";
-import { Button, Form, Modal, notification } from "antd";
+import { Button, Form, Modal, notification, PageHeader, Space } from "antd";
 import moment from "moment";
 import React, { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
@@ -212,6 +212,29 @@ export function TimeTicketModalContainer({
         }
         onValuesChange={handleFieldsChange}
       >
+        <PageHeader
+          extra={
+            <Space>
+              <Button onClick={handleCancel}>
+                {t("general.actions.cancel")}
+              </Button>
+              <Button onClick={() => form.submit()}>
+                {t("general.actions.save")}
+              </Button>
+              {timeTicketModal.context && timeTicketModal.context.id ? null : (
+                <Button
+                  type="primary"
+                  htmlType="submit"
+                  onClick={() => {
+                    setEnterAgain(true);
+                  }}
+                >
+                  {t("general.actions.saveandnew")}
+                </Button>
+              )}
+            </Space>
+          }
+        />
         <TimeTicketModalComponent
           form={form}
           employeeAutoCompleteOptions={