From b9ade71048b705928a5d7de3fedfd92b728e113c Mon Sep 17 00:00:00 2001
From: Luis Felipe Risch <lfr20@inf.ufpr.br>
Date: Thu, 5 Nov 2020 12:08:41 -0300
Subject: [PATCH] Add a logic to display an icon only when a function is
received by prop
---
src/Admin/Components/Components/Table.js | 41 +++++++++++++-----------
1 file changed, 22 insertions(+), 19 deletions(-)
diff --git a/src/Admin/Components/Components/Table.js b/src/Admin/Components/Components/Table.js
index cebae252..84b0972d 100644
--- a/src/Admin/Components/Components/Table.js
+++ b/src/Admin/Components/Components/Table.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import React from 'react';
// material ui componets
import Table from '@material-ui/core/Table';
import { withStyles, makeStyles } from '@material-ui/core/styles';
@@ -7,7 +7,7 @@ import TableCell from '@material-ui/core/TableCell';
import TableContainer from '@material-ui/core/TableContainer';
import TableHead from '@material-ui/core/TableHead';
import TableRow from '@material-ui/core/TableRow';
-import Paper from '@material-ui/core/Paper';
+import Paper from '@material-ui/core/Paper';
import FilterListRoundedIcon from '@material-ui/icons/FilterListRounded';
import { IconButton } from '@material-ui/core';
@@ -26,8 +26,8 @@ const useStyles = makeStyles({
minWidth: 700,
},
root: {
- minWidth: 275,
- boxShadow : '2px 2px 1px #A9A9A9'
+ minWidth: 275,
+ boxShadow: '2px 2px 1px #A9A9A9'
},
bullet: {
display: 'inline-block',
@@ -35,8 +35,8 @@ const useStyles = makeStyles({
transform: 'scale(0.8)',
},
title: {
- fontSize: 28,
- fontWeight : "500"
+ fontSize: 28,
+ fontWeight: "500"
},
pos: {
marginBottom: 12,
@@ -46,29 +46,32 @@ const useStyles = makeStyles({
const TableData = (props) => {
const classes = useStyles();
+ console.log(props.onIconPressed)
return (
<TableContainer component={Paper}>
<Table className={classes.table} aria-label="customized table">
<TableHead>
<TableRow>
{
- props.top.map((top , index) => (
- index === 0 ?
- <StyledTableCell key={index}>
- <div style={{display : 'flex' , flexDirection : 'row' , alignItems : 'center'}}>
- {top}
- <IconButton onClick={props.onIconPressed} color='primary'>
- <FilterListRoundedIcon style={{color : 'white'}}/>
- </IconButton>
- </div>
- </StyledTableCell>
- :
- <StyledTableCell align="right" key={index}>{top}</StyledTableCell>
+ props.top.map((top, index) => (
+ index === 0 ?
+ <StyledTableCell key={index}>
+ <div style={{ display: 'flex', flexDirection: 'row', alignItems: 'center' }}>
+ {top}
+ {
+ props.onIconPressed === undefined ? <div></div> : <IconButton onClick={props.onIconPressed} color='primary'>
+ <FilterListRoundedIcon style={{ color: 'white' }} />
+ </IconButton>
+ }
+ </div>
+ </StyledTableCell>
+ :
+ <StyledTableCell align="right" key={index}>{top}</StyledTableCell>
))
}
</TableRow>
</TableHead>
- { props.children }
+ {props.children}
</Table>
</TableContainer>
);
--
GitLab