Include JavaScript inside Material-UI tags

Question

I have this material-ui ListItemText:

<ListItemText primary={<div>
  <Table className={classes.table}>
    <TableRow>
      <TableCell width="40">{item.issue_state}</TableCell>
      <TableCell width="40">{item.issue_number}</TableCell>
      <TableCell width="600">{item.issue_title}</TableCell>
      <TableCell width="600">{item.issue_url}</TableCell>
    </TableRow>
  </Table>
</div>}/>

Rather than displaying the URL, I'd like to have something like this:

if (item.issue_url.includes("github.com") {
  item.issue_url = 'Public'
}
else if (item.issue_url.includes("github.company.com") {
  item.issue_url = 'Private'
}

where the TableCell displays Public of Private rather than the whole URL. Can this be done?

Vamsi Praveen Karanam · Accepted Answer · 2019-03-13 19:53:53Z

1

you could use as below,

<ListItemText primary={<div>
  <Table className={classes.table}>
    <TableRow>
      <TableCell width="40">{item.issue_state}</TableCell>
      <TableCell width="40">{item.issue_number}</TableCell>
      <TableCell width="600">{item.issue_title}</TableCell>
      <TableCell width="600">{
            (item.issue_url.indexOf('github.company.com') >=0)
            ? 'Private' 
            : ((item.issue._url.indexOf('github.com') >=0) 
              ? 'Public'
              : '')
      }</TableCell>
    </TableRow>
  </Table>
</div>}/>

Otherwise, good idea is to create a derived property in item based on issue_url

answered Mar 13, 2019 at 19:53

Vamsi Praveen Karanam

1736 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Katia Wheeler · Accepted Answer · 2019-03-13 19:45:11Z

0

Do something like this:

<ListItemText primary={<div>
  <Table className={classes.table}>
    <TableRow>
      <TableCell width="40">{item.issue_state}</TableCell>
      <TableCell width="40">{item.issue_number}</TableCell>
      <TableCell width="600">{item.issue_title}</TableCell>
      <TableCell width="600">{item.issue_url.includes("github.company.com") ? 'Private' : 'Public' }</TableCell>
    </TableRow>
  </Table>
</div>}/>

answered Mar 13, 2019 at 19:45

Katia Wheeler

5494 silver badges9 bronze badges

Collectives™ on Stack Overflow

Include JavaScript inside Material-UI tags

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related