From 3f53930b8e3e87ea589cc679547d0f09775def8c Mon Sep 17 00:00:00 2001
From: esikkala <esko.ikkala@aalto.fi>
Date: Wed, 19 Jan 2022 15:17:38 +0200
Subject: [PATCH] Adapt full text search
---
src/client/components/App.js | 43 +++++++++----------
.../facet_results/FacetedSearchPerspective.js | 4 +-
.../facet_results/ReactVirtualizedTable.js | 8 +++-
.../components/facet_results/ResultTable.js | 18 ++++----
.../components/main_layout/FullTextSearch.js | 3 +-
src/client/containers/SemanticPortal.js | 1 +
6 files changed, 41 insertions(+), 36 deletions(-)
diff --git a/src/client/components/App.js b/src/client/components/App.js
index 600109f8..690a5341 100644
--- a/src/client/components/App.js
+++ b/src/client/components/App.js
@@ -69,7 +69,7 @@ const theme = createTheme({
MuiAccordion: {
styleOverrides: {
root: {
- '&.MuiAccordion-root.Mui-expanded': {
+ '&.Mui-expanded': {
marginTop: 8,
marginBottom: 8
}
@@ -81,36 +81,33 @@ const theme = createTheme({
root: {
paddingLeft: 8,
paddingRight: 8,
- '&.MuiAccordionSummary-root.Mui-expanded': {
- minHeight: 48
- }
+ minHeight: 40
},
content: {
- marginTop: 8,
- marginBottom: 8,
- '&.MuiAccordionSummary-content.Mui-expanded': {
+ marginTop: 4,
+ marginBottom: 4,
+ '&.Mui-expanded': {
marginTop: 0,
marginBottom: 0
}
}
- // expandIcon: {
- // '&$expanded': {
- // marginTop: -16
- // }
- // }
+ }
+ },
+ MuiButton: {
+ styleOverrides: {
+ endIcon: {
+ marginLeft: 0
+ }
+ }
+ },
+ MuiTableCell: {
+ styleOverrides: {
+ sizeSmall: {
+ paddingTop: 0,
+ paddingBottom: 0
+ }
}
}
- // MuiButton: {
- // endIcon: {
- // marginLeft: 0
- // }
- // },
- // MuiTableCell: {
- // sizeSmall: {
- // paddingTop: 0,
- // paddingBottom: 0
- // }
- // }
}
})
diff --git a/src/client/components/facet_results/FacetedSearchPerspective.js b/src/client/components/facet_results/FacetedSearchPerspective.js
index 80352dde..086a8fcc 100644
--- a/src/client/components/facet_results/FacetedSearchPerspective.js
+++ b/src/client/components/facet_results/FacetedSearchPerspective.js
@@ -71,7 +71,7 @@ const FacetedSearchPerspective = props => {
[theme.breakpoints.up(layoutConfig.hundredPercentHeightBreakPoint)]: {
height: '100%'
},
- [theme.breakpoints.down('sm')]: {
+ [theme.breakpoints.down('md')]: {
paddingRight: '0px !important'
},
overflow: 'auto',
@@ -121,7 +121,7 @@ const FacetedSearchPerspective = props => {
paddingBottom: '0px !important',
paddingLeft: '4px !important',
paddingRight: '0px !important',
- [theme.breakpoints.down('sm')]: {
+ [theme.breakpoints.down('md')]: {
paddingLeft: '0px !important',
marginBottom: theme.spacing(1),
marginTop: theme.spacing(0.5)
diff --git a/src/client/components/facet_results/ReactVirtualizedTable.js b/src/client/components/facet_results/ReactVirtualizedTable.js
index 519298f8..25931166 100644
--- a/src/client/components/facet_results/ReactVirtualizedTable.js
+++ b/src/client/components/facet_results/ReactVirtualizedTable.js
@@ -81,6 +81,7 @@ class MuiVirtualizedTable extends React.PureComponent {
container='div'
expanded={false}
collapsedMaxWords={collapsedMaxWords}
+ shortenLabel={false}
/>
)
};
@@ -104,7 +105,9 @@ class MuiVirtualizedTable extends React.PureComponent {
>
<TableSortLabel
active={sortBy === dataKey}
- direction={sortDirection}
+ direction={typeof sortDirection === 'string'
+ ? sortDirection
+ : 'asc'}
hideSortIcon
onClick={this.onSortBy(dataKey)}
>
@@ -118,7 +121,7 @@ class MuiVirtualizedTable extends React.PureComponent {
onSortBy = sortBy => () => {
this.props.sortFullTextResults({
- resultClass: 'fullText',
+ resultClass: this.props.resultClass,
sortBy
})
}
@@ -223,6 +226,7 @@ const ReactVirtualizedTable = props => {
sortBy={sortBy}
sortDirection={sortDirection}
sortFullTextResults={props.sortFullTextResults}
+ resultClass={props.resultClass}
/>
</div>
)}
diff --git a/src/client/components/facet_results/ResultTable.js b/src/client/components/facet_results/ResultTable.js
index 4922aedc..5ba30fdf 100644
--- a/src/client/components/facet_results/ResultTable.js
+++ b/src/client/components/facet_results/ResultTable.js
@@ -35,9 +35,9 @@ const styles = theme => ({
// borderTop: '1px solid rgba(224, 224, 224, 1);',
// alignItems: 'center'
// },
- paginationCaption: {
- minWidth: 110
- },
+ // paginationCaption: {
+ // minWidth: 110
+ // },
// paginationToolbar: props => ({
// '& p': { fontSize: '0.75rem' },
// minHeight: props.layoutConfig.paginationToolbarHeight,
@@ -55,9 +55,7 @@ const styles = theme => ({
justifyContent: 'center'
},
expandCell: {
- paddingRight: 0,
- paddingTop: 0,
- paddingBottom: 0
+ paddingRight: '0px !important'
},
expand: {
transform: 'rotate(0deg)',
@@ -291,7 +289,7 @@ class ResultTable extends React.Component {
labelDisplayedRows={resultCount == null
? () => '-'
: ({ from, to, count }) => `${from}-${to} of ${count}`}
- rowsPerPage={pagesize}
+ rowsPerPage={parseInt(pagesize)}
labelRowsPerPage={intl.get('table.rowsPerPage')}
rowsPerPageOptions={[5, 10, 15, 20, 25, 30, 50, 100]}
page={page === -1 || resultCount === 0 ? 0 : page}
@@ -308,7 +306,11 @@ class ResultTable extends React.Component {
borderTop: '1px solid rgba(224, 224, 224, 1);',
alignItems: 'center',
'& .MuiTablePagination-toolbar': {
- '& p': { fontSize: '0.75rem' },
+ '& p': {
+ fontSize: '0.75rem',
+ marginTop: 0,
+ marginBottom: 0
+ },
minHeight: this.props.layoutConfig.paginationToolbarHeight,
[theme.breakpoints.down('sm')]: {
display: 'flex',
diff --git a/src/client/components/main_layout/FullTextSearch.js b/src/client/components/main_layout/FullTextSearch.js
index f3f129ee..937b62bb 100644
--- a/src/client/components/main_layout/FullTextSearch.js
+++ b/src/client/components/main_layout/FullTextSearch.js
@@ -1,7 +1,7 @@
import React from 'react'
import PropTypes from 'prop-types'
import { Route, Redirect } from 'react-router-dom'
-import makeStyles from '@mui/styles/makeStyles';
+import makeStyles from '@mui/styles/makeStyles'
import PerspectiveTabs from './PerspectiveTabs'
import ReactVirtualizedTable from '../facet_results/ReactVirtualizedTable'
import CalendarViewDayIcon from '@mui/icons-material/CalendarViewDay'
@@ -43,6 +43,7 @@ const FullTextSearch = props => {
return (
<ReactVirtualizedTable
fullTextSearch={props.fullTextSearch}
+ resultClass={props.resultClass}
sortFullTextResults={props.sortFullTextResults}
layoutConfig={props.layoutConfig}
/>
diff --git a/src/client/containers/SemanticPortal.js b/src/client/containers/SemanticPortal.js
index 1d7c4677..ebaa937d 100644
--- a/src/client/containers/SemanticPortal.js
+++ b/src/client/containers/SemanticPortal.js
@@ -218,6 +218,7 @@ const SemanticPortal = props => {
render={routeProps =>
<FullTextSearch
fullTextSearch={props.fullTextSearch}
+ resultClass='fullTextSearch'
sortFullTextResults={props.sortFullTextResults}
routeProps={routeProps}
screenSize={screenSize}
--
GitLab