From fef0584603afa21501541bcc8f48b208f6be51c7 Mon Sep 17 00:00:00 2001
From: esikkala <esko.ikkala@aalto.fi>
Date: Wed, 28 Aug 2019 20:56:50 +0300
Subject: [PATCH] Combine facet and result table tooltips
---
src/client/components/facet_bar/FacetBar.js | 6 +++++-
src/client/components/facet_bar/FacetHeader.js | 18 ++++++++++++------
src/client/containers/SemanticPortal.js | 1 +
3 files changed, 18 insertions(+), 7 deletions(-)
diff --git a/src/client/components/facet_bar/FacetBar.js b/src/client/components/facet_bar/FacetBar.js
index 150ae47a..04df1053 100644
--- a/src/client/components/facet_bar/FacetBar.js
+++ b/src/client/components/facet_bar/FacetBar.js
@@ -69,8 +69,9 @@ class FacetBar extends React.Component {
}
renderFacet = (facetID, someFacetIsFetching) => {
- const { classes } = this.props;
+ const { classes, resultTableColumns } = this.props;
const { facetUpdateID, updatedFacet, updatedFilter, facets } = this.props.facetData;
+ let resultTableColumn = resultTableColumns.find(column => column.id === facetID);
const facet = facets[facetID];
let facetComponent = null;
let isActive = this.state.activeFacets.has(facetID);
@@ -153,6 +154,7 @@ class FacetBar extends React.Component {
break;
}
+
return(
<ExpansionPanel
key={facetID}
@@ -176,6 +178,7 @@ class FacetBar extends React.Component {
resultClass={this.props.resultClass}
fetchFacet={this.props.fetchFacet}
updateFacetOption={this.props.updateFacetOption}
+ description={resultTableColumn.desc}
/>
</ExpansionPanelSummary>
<ExpansionPanelDetails
@@ -229,6 +232,7 @@ FacetBar.propTypes = {
fetchResultCount: PropTypes.func.isRequired,
updateFacetOption: PropTypes.func.isRequired,
defaultActiveFacets: PropTypes.instanceOf(Set).isRequired,
+ resultTableColumns: PropTypes.array.isRequired,
};
export default withStyles(styles)(FacetBar);
diff --git a/src/client/components/facet_bar/FacetHeader.js b/src/client/components/facet_bar/FacetHeader.js
index 54a45082..7b19fb16 100644
--- a/src/client/components/facet_bar/FacetHeader.js
+++ b/src/client/components/facet_bar/FacetHeader.js
@@ -7,6 +7,7 @@ import Menu from '@material-ui/core/Menu';
import MenuItem from '@material-ui/core/MenuItem';
import MoreVertIcon from '@material-ui/icons/MoreVert';
import Typography from '@material-ui/core/Typography';
+import InfoIcon from '@material-ui/icons/InfoOutlined';
import history from '../../History';
const styles = theme => ({
@@ -17,12 +18,8 @@ const styles = theme => ({
headingContainer: {
display: 'flex',
alignItems: 'center',
- justifyContent: 'space-between',
+ //justifyContent: 'space-between',
width: '100%'
- //paddingLeft: theme.spacing(1),
- //borderBottomLeftRadius: 0,
- //borderBottomRightRadius: 0,
- //height: 48
},
facetValuesContainerTen: {
height: 345,
@@ -167,12 +164,20 @@ class FacetHeader extends React.Component {
}
render() {
- const { classes, isActive } = this.props;
+ const { classes, isActive, description } = this.props;
const { label, sortButton, spatialFilterButton } = this.props.facet;
let showMenuButton = isActive && (sortButton || spatialFilterButton);
return (
<div className={classes.headingContainer}>
<Typography variant="body1">{label} </Typography>
+ <Tooltip
+ title={description}
+ enterDelay={300}
+ >
+ <IconButton>
+ <InfoIcon />
+ </IconButton>
+ </Tooltip>
{showMenuButton &&
<div className={classes.facetHeaderButtons}>
{this.renderFacetMenu()}
@@ -192,6 +197,7 @@ FacetHeader.propTypes = {
resultClass: PropTypes.string,
fetchFacet: PropTypes.func,
updateFacetOption: PropTypes.func,
+ description: PropTypes.string.isRequired
};
export default withStyles(styles)(FacetHeader);
diff --git a/src/client/containers/SemanticPortal.js b/src/client/containers/SemanticPortal.js
index 78e5b1b3..ffe1210a 100644
--- a/src/client/containers/SemanticPortal.js
+++ b/src/client/containers/SemanticPortal.js
@@ -243,6 +243,7 @@ let SemanticPortal = (props) => {
fetchResultCount={props.fetchResultCount}
updateFacetOption={props.updateFacetOption}
defaultActiveFacets={perspective.defaultActiveFacets}
+ resultTableColumns={props[perspective.id].tableColumns}
/>
</Grid>
<Grid item xs={12} md={9} className={classes.resultsContainer}>
--
GitLab