BOD-53 added owner popover for tag on detail.

client/src/components/jobs-detail-header/jobs-detail-header.component.jsx

@@ -1,5 +1,16 @@
 import { DownCircleFilled } from "@ant-design/icons";
-import { Avatar, Badge, Button, Checkbox, Descriptions, Dropdown, Menu, notification, PageHeader, Tag } from "antd";
+import {
+  Avatar,
+  Badge,
+  Button,
+  Checkbox,
+  Descriptions,
+  Dropdown,
+  Menu,
+  notification,
+  PageHeader,
+  Tag
+} from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
 import Moment from "react-moment";
@@ -10,6 +21,7 @@ import CarImage from "../../assets/car.svg";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import CurrencyFormatter from "../../utils/CurrencyFormatter";
 import BarcodePopup from "../barcode-popup/barcode-popup.component";
+import OwnerTagPopoverComponent from "../owner-tag-popover/owner-tag-popover.component";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -100,16 +112,7 @@ export default connect(
       tags={
         <span key="job-status">
           {job.status ? <Tag color="blue">{job.status}</Tag> : null}
-          <Tag color="red">
-            {job.owner ? (
-              <Link to={`/manage/owners/${job.owner.id}`}>
-                {`${job.ownr_co_nm || ""}${job.ownr_fn || ""} ${job.ownr_ln ||
-                  ""}`}
-              </Link>
-            ) : (
-              t("jobs.errors.noowner")
-            )}
-          </Tag>
+          <OwnerTagPopoverComponent job={job} />
           <Tag color="green">
             {job.vehicle ? (
               <Link to={`/manage/vehicles/${job.vehicle.id}`}>