enable copying of OID to clipboard

kopia · Jun 11, 2023 · abcd6ce · abcd6ce
1 parent 0ff2663
commit abcd6ce
Showing 1 changed file with 14 additions and 13 deletions.
diff --git a/src/DirectoryBreadcrumbs.jsx b/src/DirectoryBreadcrumbs.jsx
@@ -2,6 +2,8 @@ import React from 'react';
 import Breadcrumb from 'react-bootstrap/Breadcrumb';
 import { useHistory, useLocation } from 'react-router-dom';
 import { OverlayTrigger, Tooltip } from "react-bootstrap";
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { faInfoCircle } from "@fortawesome/free-solid-svg-icons";
 
 export function DirectoryBreadcrumbs() {
     const location = useLocation();
@@ -12,26 +14,25 @@ export function DirectoryBreadcrumbs() {
         breadcrumbs.unshift(state)
     }
 
-    // TODO: enable copying of OID to clipboard #####
     return (
         <Breadcrumb>
             {
                 breadcrumbs.map((state, i) => {
                     const index = breadcrumbs.length - i - 1 // revert index
-                    let item = <Breadcrumb.Item key={index} size="sm" variant="outline-secondary"
-                                                onClick={() => {
-                                                    if (index) history.go(-index);
-                                                }}
-                                                active={!index}>
+                    return <Breadcrumb.Item key={index} size="sm" variant="outline-secondary"
+                                            onClick={() => {
+                                                if (index) history.go(-index);
+                                            }}
+                                            active={!index}>
                         {state.label}
+                        {state.oid && !index && <>&nbsp;<OverlayTrigger placement="top"
+                                               trigger="click"
+                                               overlay={<Tooltip
+                                                   className={"wide-tooltip"}>OID: {state.oid}</Tooltip>}
+                        >
+                            <FontAwesomeIcon icon={faInfoCircle} />
+                        </OverlayTrigger></>}
                     </Breadcrumb.Item>;
-                    return (
-                        state.oid
-                            ? <OverlayTrigger key={index} placement="top" overlay={<Tooltip className={"wide-tooltip"}>OID: {state.oid}</Tooltip>}>
-                                {item}
-                            </OverlayTrigger>
-                            : item
-                    );
                 })
             }
         </Breadcrumb>