Adding new feature to ClickToCopy to provide children to render

client/src/components/util/ClickToCopy.jsx

@@ -32,7 +32,7 @@ const InvisbleTextarea = styled.textarea`
   opacity: 0;
 `
 
-export default ({ text }) => {
+export default ({ text, children }) => {
   const textareaRef = useRef(null);
   const [hovered, setHovered] = useState(false);
   const [copied, setCopied] = useState(false);
@@ -55,7 +55,7 @@ export default ({ text }) => {
   return (
     <Container>
       <UnderlinedSpan onClick={onClick} onMouseOver={onHover} onMouseOut={onUnhover}>
-        {text}
+        {children ? children : text}
       </UnderlinedSpan>
       <ToolTip show={hovered}>
         {copied ? "Copied!" : "Click to Copy"}