adjusted job block in the investigation result page

api_app/serializers/job.py

@@ -455,6 +455,7 @@ class Meta:
             "pivot_config",
             "playbook",
             "status",
+            "received_request_time",
         ]
 
     playbook = rfs.SlugRelatedField(

frontend/src/components/investigations/flow/CustomJobNode.jsx

@@ -2,9 +2,12 @@ import React from "react";
 import PropTypes from "prop-types";
 import { NodeToolbar, Handle, Position } from "reactflow";
 import "reactflow/dist/style.css";
-import { Button } from "reactstrap";
+import { Button, UncontrolledTooltip } from "reactstrap";
 import { AiOutlineLink } from "react-icons/ai";
 import { LuGitBranchPlus } from "react-icons/lu";
+import { MdContentCopy } from "react-icons/md";
+
+import { CopyToClipboardButton, DateHoverable } from "@certego/certego-ui";
 
 import { RemoveJob } from "./investigationActions";
 
@@ -24,16 +27,33 @@ function CustomJobNode({ data }) {
         id={`toolbar-job-${data.id}`}
       >
         <div className="p-1 my-2 d-flex justify-content-start">
+          <CopyToClipboardButton
+            id="investigation-copybtn"
+            text={data.name}
+            className="mx-1 p-2 btn btn-secondary btn-sm"
+            showOnHover
+          >
+            <MdContentCopy /> Copy
+          </CopyToClipboardButton>
           <Button
-            className="ms-2 me-1 p-2"
+            id="investigation-linkbtn"
+            className="mx-1 p-2"
             size="sm"
             href={`/jobs/${data.id}/visualizer`}
             target="_blank"
             rel="noreferrer"
           >
             <AiOutlineLink /> Link
           </Button>
+          <UncontrolledTooltip
+            target="investigation-linkbtn"
+            placement="top"
+            fade={false}
+          >
+            Go to job #{data.id} result page
+          </UncontrolledTooltip>
           <Button
+            id="investigation-pivotbtn"
             className="mx-1 p-2"
             size="sm"
             href={`/scan?parent=${data.id}&observable=${data.name}`}
@@ -42,6 +62,13 @@ function CustomJobNode({ data }) {
           >
             <LuGitBranchPlus /> Pivot
           </Button>
+          <UncontrolledTooltip
+            target="investigation-pivotbtn"
+            placement="top"
+            fade={false}
+          >
+            Analyze the same observable again
+          </UncontrolledTooltip>
           {data.isFirstLevel && <RemoveJob data={data} />}
         </div>
         <div
@@ -60,6 +87,17 @@ function CustomJobNode({ data }) {
             <span className="me-2">Playbook:</span>
             <span className="text-accent">{data?.playbook}</span>
           </div>
+          <div className="d-flex justify-content-between">
+            <span className="me-2">Created:</span>
+            <span className="text-accent">
+              <DateHoverable
+                className="text-accent"
+                ago
+                value={data?.created}
+                format="hh:mm:ss a MMM do, yyyy"
+              />
+            </span>
+          </div>
         </div>
       </NodeToolbar>
       <div

frontend/src/components/investigations/flow/utils.js

@@ -23,6 +23,7 @@ function addJobNode(
       refetchTree,
       refetchInvestigation,
       isFirstLevel: isFirstLevel || false,
+      created: job.received_request_time,
     },
     type: "jobNode",
   });

frontend/tests/components/investigations/flow/InvestigationFlow.test.jsx

@@ -254,13 +254,15 @@ describe("test InvestigationFlow", () => {
                 analyzed_object_name: "test1.com",
                 playbook: "Dns",
                 status: "reported_without_fails",
+                received_request_time: "2024-04-03T13:08:45.417245Z",
                 children: [
                   {
                     pk: 11,
                     analyzed_object_name: "test11.com",
                     playbook: "Dns",
                     status: "reported_without_fails",
                     children: [],
+                    received_request_time: "2024-04-03T13:09:45.417245Z",
                   },
                 ],
               },
@@ -300,6 +302,8 @@ describe("test InvestigationFlow", () => {
     expect(linkFirstJobButton).toBeInTheDocument();
     const firstJobPivotButton = screen.getByRole("link", { name: "Pivot" });
     expect(firstJobPivotButton).toBeInTheDocument();
+    const firstJobCopyButton = screen.getByRole("button", { name: "Copy" });
+    expect(firstJobCopyButton).toBeInTheDocument();
     // link to job page
     expect(linkFirstJobButton.href).toContain("/jobs/10/visualizer");
     // link pivot
@@ -312,6 +316,7 @@ describe("test InvestigationFlow", () => {
     expect(jobInfo.textContent).toContain("Job:#10");
     expect(jobInfo.textContent).toContain("Name:test1.com");
     expect(jobInfo.textContent).toContain("Playbook:Dns");
+    expect(jobInfo.textContent).toContain("Created:");
 
     fireEvent.click(secondJobNode);
     // pivot tollbar
@@ -325,6 +330,8 @@ describe("test InvestigationFlow", () => {
     expect(linkSecondJobButton).toBeInTheDocument();
     const secondJobPivotButton = screen.getByRole("link", { name: "Pivot" });
     expect(secondJobPivotButton).toBeInTheDocument();
+    const secondJobCopyButton = screen.getByRole("button", { name: "Copy" });
+    expect(secondJobCopyButton).toBeInTheDocument();
     // link to job page
     expect(linkSecondJobButton.href).toContain("/jobs/11/visualizer");
     // link pivot
@@ -337,5 +344,6 @@ describe("test InvestigationFlow", () => {
     expect(secondJobInfo.textContent).toContain("Job:#11");
     expect(secondJobInfo.textContent).toContain("Name:test11.com");
     expect(secondJobInfo.textContent).toContain("Playbook:Dns");
+    expect(jobInfo.textContent).toContain("Created:");
   });
 });