Add technician side to part dispatching.

client/src/components/parts-dispatch-expander/parts-dispatch-expander.component.jsx

@@ -1,10 +1,35 @@
-import { Button, Card, Col, Row, Table } from "antd";
+import { useMutation } from "@apollo/client";
+import { Button, Card, Col, Row, Table, notification } from "antd";
+import moment from "moment-business-days";
 import React from "react";
 import { useTranslation } from "react-i18next";
+import { UPDATE_PARTS_DISPATCH_LINE } from "../../graphql/parts-dispatch.queries";
 import { DateTimeFormatter } from "../../utils/DateFormatter";
 
 export default function PartsDispatchExpander({ dispatch, job }) {
   const { t } = useTranslation();
+  const [updateDispatchLine] = useMutation(UPDATE_PARTS_DISPATCH_LINE);
+
+  const handleAccept = async ({ partsDispatchLineId }) => {
+    const accepted_at = moment();
+    const result = await updateDispatchLine({
+      variables: { id: partsDispatchLineId, line: { accepted_at } },
+      optimisticResponse: {
+        update_parts_dispatch_lines_by_pk: {
+          accepted_at,
+          id: partsDispatchLineId,
+        },
+      },
+    });
+    if (result.errors) {
+      notification.open({
+        type: "error",
+        message: t("parts_dispatch.errors.accepting", {
+          error: JSON.stringify(result.errors),
+        }),
+      });
+    }
+  };
 
   const columns = [
     {
@@ -32,7 +57,11 @@ export default function PartsDispatchExpander({ dispatch, job }) {
         record.accepted_at ? (
           <DateTimeFormatter>{record.accepted_at}</DateTimeFormatter>
         ) : (
-          <Button>{t("parts_dispatch.actions.accept")}</Button>
+          <Button
+            onClick={() => handleAccept({ partsDispatchLineId: record.id })}
+          >
+            {t("parts_dispatch.actions.accept")}
+          </Button>
         ),
     },
   ];