chore: fix copy object issue

Update CopyToClipBoard, if has children render that, otherwise the raw text

src/webui/components/CopyToClipBoard/index.js

@@ -14,7 +14,7 @@ import { ClipBoardCopy, ClipBoardCopyText, CopyIcon } from './styles';
 import { copyToClipBoardUtility } from '../../utils/cli-utils';
 import { TEXT } from '../../utils/constants';
 
-const CopyToClipBoard = ({ text }: IProps): Node => {
+const CopyToClipBoard = ({ text, children }: IProps): Node => {
   const renderToolTipFileCopy = () => (
     <Tooltip disableFocusListener={true} title={TEXT.CLIPBOARD_COPY}>
       <CopyIcon onClick={copyToClipBoardUtility(text)}>
@@ -22,9 +22,17 @@ const CopyToClipBoard = ({ text }: IProps): Node => {
       </CopyIcon>
     </Tooltip>
   );
+
+  const renderText = children => {
+    if (children) {
+      return <ClipBoardCopyText>{children}</ClipBoardCopyText>;
+    }
+
+    return <ClipBoardCopyText>{text}</ClipBoardCopyText>;
+  };
   return (
     <ClipBoardCopy>
-      <ClipBoardCopyText>{text}</ClipBoardCopyText>
+      {renderText(children)}
       {renderToolTipFileCopy()}
     </ClipBoardCopy>
   );

src/webui/components/CopyToClipBoard/types.js

@@ -5,4 +5,5 @@
 
 export interface IProps {
   text: string;
+  children: any;
 }

src/webui/components/DetailSidebar/index.js

@@ -11,7 +11,6 @@ import Developers from '../Developers';
 import Dist from '../Dist';
 import Engine from '../Engines';
 import Install from '../Install';
-import License from '../License';
 import Repository from '../Repository';
 
 
@@ -42,7 +41,6 @@ class DetailSidebar extends Component {
             {this.renderAuthor()}
             {this.renderMaintainers()}
             {this.renderContributors()}
-            {/* {this.renderLicense()} */}
           </CardContent>
         </Card>
       </div>
@@ -74,10 +72,6 @@ class DetailSidebar extends Component {
     return <Developers type={'contributors'} />;
   }
   
-  renderLicense = () => {
-    return <License />;
-  }
-
   renderRepository = () => {
     return <Repository />;
   }

src/webui/components/License/index.js

@@ -1,48 +0,0 @@
-import React, {Component} from 'react';
-
-import List from '@material-ui/core/List';
-import ListItemText from '@material-ui/core/ListItemText';
-import BookIcon from '@material-ui/icons/Book';
-
-import { DetailContextConsumer } from '../../pages/version/index';
-
-import { Heading, LicenseListItem, LicenseAvatar } from './styles';
-
-class License extends Component {
-  render() {
-    return (
-      <DetailContextConsumer>
-        {(context) => {
-          return this.renderLicense(context);
-        }}
-      </DetailContextConsumer>
-    );
-  };
-
-  renderLicense = ({packageMeta}) => {
-    const { license } = packageMeta.latest;
-    if (!license) {
-      return null;
-    }
-
-    return (
-      <List subheader={<Heading variant={"subheading"}>{'License'}</Heading>}>
-        {this.renderListItems(license)}
-      </List>
-    );
-  }
-
-  renderListItems = (license) => {
-    return (
-      <LicenseListItem>
-        <LicenseAvatar>
-          <BookIcon />
-        </LicenseAvatar>
-        <ListItemText primary={license} />
-      </LicenseListItem>
-    );
-  }
-}
-
-
-export default License;

src/webui/components/License/styles.js

@@ -1,31 +0,0 @@
-/**
- * @prettier
- * @flow
- */
-
-import styled from 'react-emotion';
-import Avatar from '@material-ui/core/Avatar/index';
-import ListItem from '@material-ui/core/ListItem/index';
-import Typography from '@material-ui/core/Typography/index';
-
-import colors from '../../utils/styles/colors';
-
-export const Heading = styled(Typography)`
-  && {
-    font-weight: 700;
-    text-transform: capitalize;
-  }
-`;
-
-export const LicenseListItem = styled(ListItem)`
-  && {
-    padding-left: 0;
-  }
-`;
-
-export const LicenseAvatar = styled(Avatar)`
-  && {
-    color: ${colors.greySuperLight};
-    background-color: ${colors.primary};
-  }
-`;

src/webui/components/Repository/index.js

@@ -39,12 +39,20 @@ class Repository extends Component<any, any> {
         <List dense={true} subheader={<Heading variant={"subheading"}>{'Repository'}</Heading>}>
           <RepositoryListItem>
             <Avatar src={git} />
-            <ListItemText primary={(<CopyToClipBoard text={this.renderRepositoryText(url)} />)} />
+            <ListItemText primary={this.renderContent(url)} />
           </RepositoryListItem>
         </List>
       </>
     );
   }
+  
+  renderContent(url) {
+    return (
+      <CopyToClipBoard text={url}>
+        {this.renderRepositoryText(url)}
+      </CopyToClipBoard>
+    );
+  }
 }