IO-992 Job Audit Logs

client/src/components/job-audit-trail/job-audit-trail.component.jsx

@@ -0,0 +1,46 @@
+import { useQuery } from "@apollo/client";
+import { Card, Table } from "antd";
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { QUERY_AUDIT_TRAIL } from "../../graphql/audit_trail.queries";
+import { DateTimeFormatter } from "../../utils/DateFormatter";
+
+export default function JobAuditTrail({ jobId }) {
+  const { t } = useTranslation();
+  const { loading, data } = useQuery(QUERY_AUDIT_TRAIL, {
+    variables: { jobid: jobId },
+    skip: !jobId,
+  });
+
+  const columns = [
+    {
+      title: t("audit.fields.created"),
+      dataIndex: "created",
+      key: "created",
+      render: (text, record) => (
+        <DateTimeFormatter>{record.created}</DateTimeFormatter>
+      ),
+    },
+    {
+      title: t("audit.fields.useremail"),
+      dataIndex: "useremail",
+      key: "useremail",
+    },
+    {
+      title: t("audit.fields.operation"),
+      dataIndex: "operation",
+      key: "operation",
+    },
+  ];
+
+  return (
+    <Card title={t("jobs.labels.audit")}>
+      <Table
+        loading={loading}
+        columns={columns}
+        rowKey="id"
+        dataSource={data ? data.audit_trail : []}
+      />
+    </Card>
+  );
+}