setInitialState: set state only in react-searchkit component

src/demos/cern-videos/App.js

@@ -57,6 +57,14 @@ const resultsPerPageValues = [
   },
 ];
 
+const initialState = {
+  sortBy: 'mostrecent',
+  sortOrder: 'asc',
+  layout: 'list',
+  page: 1,
+  size: 10,
+};
+
 const searchApi = new InvenioSearchApi({
   axios: {
     url: 'https://videos.cern.ch/api/records/',
@@ -148,6 +156,7 @@ export class App extends Component {
       <OverridableContext.Provider value={overriddenComponents}>
         <ReactSearchKit
           searchApi={searchApi}
+          initialQueryState={initialState}
           urlHandlerApi={{ enabled: false }}
         >
           <Container>

src/demos/elasticsearch/App.js

@@ -44,6 +44,12 @@ const searchApi = new ESSearchApi({
   },
 });
 
+const initialState = {
+  layout: 'list',
+  page: 1,
+  size: 10,
+};
+
 const customAggComp = (title, containerCmp) => {
   return containerCmp ? (
     <Menu vertical>
@@ -151,7 +157,7 @@ export class App extends Component {
   render() {
     return (
       <OverridableContext.Provider value={overriddenComponents}>
-        <ReactSearchKit searchApi={searchApi}>
+        <ReactSearchKit searchApi={searchApi} initialQueryState={initialState}>
           <Container>
             <Grid>
               <Grid.Row>

src/demos/zenodo/App.js

@@ -81,6 +81,14 @@ const searchApi = new InvenioSearchApi({
   },
 });
 
+const initialState = {
+  sortBy: 'mostrecent',
+  sortOrder: 'asc',
+  layout: 'list',
+  page: 1,
+  size: 10,
+};
+
 export const ZenodoResultsListItem = ({ result, index }) => {
   const metadata = result.metadata;
   return (
@@ -162,7 +170,7 @@ export class App extends Component {
   render() {
     return (
       <OverridableContext.Provider value={overriddenComponents}>
-        <ReactSearchKit searchApi={searchApi}>
+        <ReactSearchKit searchApi={searchApi} initialQueryState={initialState}>
           <Container>
             <Grid>
               <Grid.Row>

src/lib/components/LayoutSwitcher/LayoutSwitcher.js

@@ -16,17 +16,7 @@ import { buildUID } from '../../util';
 class LayoutSwitcher extends Component {
   constructor(props) {
     super(props);
-    this.defaultValue = this.props.defaultLayout;
     this.updateLayout = props.updateLayout;
-    this.setInitialState = props.setInitialState;
-  }
-
-  componentDidMount() {
-    if (this.props.currentLayout === null) {
-      this.setInitialState({
-        layout: this.defaultValue,
-      });
-    }
   }
 
   onLayoutChange = (layoutName) => {
@@ -50,17 +40,14 @@ class LayoutSwitcher extends Component {
 }
 
 LayoutSwitcher.propTypes = {
-  defaultLayout: PropTypes.oneOf(['list', 'grid']),
   updateLayout: PropTypes.func.isRequired,
-  setInitialState: PropTypes.func.isRequired,
   loading: PropTypes.bool.isRequired,
   currentLayout: PropTypes.string,
   totalResults: PropTypes.number.isRequired,
   overridableId: PropTypes.string,
 };
 
 LayoutSwitcher.defaultProps = {
-  defaultLayout: 'list',
   currentLayout: null,
   overridableId: '',
 };

src/lib/components/LayoutSwitcher/index.js

@@ -7,15 +7,14 @@
  */
 
 import { connect } from '../../store';
-import { updateResultsLayout, setInitialState } from '../../state/actions';
+import { updateResultsLayout } from '../../state/actions';
 import LayoutSwitcherComponent from './LayoutSwitcher';
 
-const mapDispatchToProps = dispatch => ({
-  updateLayout: layout => dispatch(updateResultsLayout(layout)),
-  setInitialState: initialState => dispatch(setInitialState(initialState)),
+const mapDispatchToProps = (dispatch) => ({
+  updateLayout: (layout) => dispatch(updateResultsLayout(layout)),
 });
 export const LayoutSwitcher = connect(
-  state => ({
+  (state) => ({
     loading: state.results.loading,
     currentLayout: state.query.layout,
     totalResults: state.results.data.total,

src/lib/components/Pagination/Pagination.js

@@ -16,17 +16,7 @@ import { buildUID } from '../../util';
 class Pagination extends Component {
   constructor(props) {
     super(props);
-    this.defaultValue = props.defaultValue;
     this.updateQueryPage = props.updateQueryPage;
-    this.setInitialState = props.setInitialState;
-  }
-
-  componentDidMount() {
-    if (this.props.currentPage === -1) {
-      this.setInitialState({
-        page: this.defaultValue,
-      });
-    }
   }
 
   onPageChange = (activePage) => {
@@ -76,7 +66,6 @@ Pagination.propTypes = {
     showPrev: PropTypes.bool,
     showNext: PropTypes.bool,
   }),
-  defaultValue: PropTypes.number,
   overridableId: PropTypes.string,
 };
 
@@ -90,7 +79,6 @@ Pagination.defaultProps = {
     showPrev: true,
     showNext: true,
   },
-  defaultValue: 10,
   overridableId: '',
 };
 

src/lib/components/Pagination/index.js

@@ -7,19 +7,15 @@
  */
 
 import { connect } from '../../store';
-import {
-  updateQueryPaginationPage,
-  setInitialState,
-} from '../../state/actions';
+import { updateQueryPaginationPage } from '../../state/actions';
 import PaginationComponent from './Pagination';
 
-const mapDispatchToProps = dispatch => ({
-  updateQueryPage: page => dispatch(updateQueryPaginationPage(page)),
-  setInitialState: value => dispatch(setInitialState(value)),
+const mapDispatchToProps = (dispatch) => ({
+  updateQueryPage: (page) => dispatch(updateQueryPaginationPage(page)),
 });
 
 export const Pagination = connect(
-  state => ({
+  (state) => ({
     currentPage: state.query.page,
     currentSize: state.query.size,
     loading: state.results.loading,

src/lib/components/ResultsPerPage/ResultsPerPage.js

@@ -17,17 +17,7 @@ class ResultsPerPage extends Component {
   constructor(props) {
     super(props);
     this.options = props.values;
-    this.defaultValue = props.defaultValue;
     this.updateQuerySize = this.props.updateQuerySize;
-    this.setInitialState = props.setInitialState;
-  }
-
-  componentDidMount() {
-    if (this.props.currentSize === -1) {
-      this.setInitialState({
-        size: this.defaultValue,
-      });
-    }
   }
 
   onChange = (value) => {
@@ -65,15 +55,12 @@ ResultsPerPage.propTypes = {
   loading: PropTypes.bool.isRequired,
   totalResults: PropTypes.number.isRequired,
   values: PropTypes.array.isRequired,
-  defaultValue: PropTypes.number,
   updateQuerySize: PropTypes.func.isRequired,
-  setInitialState: PropTypes.func.isRequired,
   label: PropTypes.func,
   overridableId: PropTypes.string,
 };
 
 ResultsPerPage.defaultProps = {
-  defaultValue: 10,
   label: (cmp) => cmp,
   overridableId: '',
 };

src/lib/components/ResultsPerPage/index.js

@@ -7,19 +7,15 @@
  */
 
 import { connect } from '../../store';
-import {
-  updateQueryPaginationSize,
-  setInitialState,
-} from '../../state/actions';
+import { updateQueryPaginationSize } from '../../state/actions';
 import ResultsPerPageComponent from './ResultsPerPage';
 
-const mapDispatchToProps = dispatch => ({
-  updateQuerySize: size => dispatch(updateQueryPaginationSize(size)),
-  setInitialState: value => dispatch(setInitialState(value)),
+const mapDispatchToProps = (dispatch) => ({
+  updateQuerySize: (size) => dispatch(updateQueryPaginationSize(size)),
 });
 
 export const ResultsPerPage = connect(
-  state => ({
+  (state) => ({
     loading: state.results.loading,
     currentSize: state.query.size,
     totalResults: state.results.data.total,

src/lib/components/Sort/Sort.js

@@ -18,49 +18,11 @@ class Sort extends Component {
     super(props);
     this.options = props.values;
     this.updateQuerySorting = props.updateQuerySorting;
-    this.setInitialState = props.setInitialState;
 
     this.options.forEach(
       (option) =>
         (option['value'] = this._computeValue(option.sortBy, option.sortOrder))
     );
-
-    // compute default value for sort field and sort order
-    const defaultValue = this.options.find(
-      (option) => 'default' in option && option.default
-    );
-    this.defaultValue = {
-      sortBy: defaultValue.sortBy || this.options[0].sortBy,
-      sortOrder: defaultValue.sortOrder || this.options[0].sortOrder,
-    };
-
-    const defaultValueOnEmptyString = this.options.find(
-      (option) =>
-        'defaultOnEmptyString' in option && option.defaultOnEmptyString
-    );
-    this.defaultValueOnEmptyString = {
-      sortBy: defaultValueOnEmptyString
-        ? defaultValueOnEmptyString.sortBy
-        : this.options[0].sortBy,
-      sortOrder: defaultValueOnEmptyString
-        ? defaultValueOnEmptyString.sortOrder
-        : this.options[0].sortOrder,
-    };
-  }
-
-  componentDidMount() {
-    if (
-      this.props.currentSortBy === null &&
-      this.props.currentSortOrder === null
-    ) {
-      const defaultValue = this.props.currentQueryString
-        ? this.defaultValue
-        : this.defaultValueOnEmptyString;
-      this.setInitialState({
-        sortBy: defaultValue.sortBy,
-        sortOrder: defaultValue.sortOrder,
-      });
-    }
   }
 
   _computeValue = (sortBy, sortOrder) => {
@@ -117,7 +79,6 @@ Sort.propTypes = {
   loading: PropTypes.bool.isRequired,
   totalResults: PropTypes.number.isRequired,
   updateQuerySorting: PropTypes.func.isRequired,
-  setInitialState: PropTypes.func.isRequired,
   label: PropTypes.func,
   overridableId: PropTypes.string,
 };

src/lib/components/Sort/index.js

@@ -7,17 +7,16 @@
  */
 
 import { connect } from '../../store';
-import { updateQuerySorting, setInitialState } from '../../state/actions';
+import { updateQuerySorting } from '../../state/actions';
 import SortComponent from './Sort';
 
-const mapDispatchToProps = dispatch => ({
+const mapDispatchToProps = (dispatch) => ({
   updateQuerySorting: (sortBy, sortOrder) =>
     dispatch(updateQuerySorting(sortBy, sortOrder)),
-  setInitialState: value => dispatch(setInitialState(value)),
 });
 
 export const Sort = connect(
-  state => ({
+  (state) => ({
     currentQueryString: state.query.queryString,
     currentSortBy: state.query.sortBy,
     currentSortOrder: state.query.sortOrder,

src/lib/components/SortBy/SortBy.js

@@ -17,21 +17,7 @@ class SortBy extends Component {
   constructor(props) {
     super(props);
     this.options = props.values;
-    this.defaultValue = this.props.defaultValue;
-    this.defaultValueOnEmptyString = this.props.defaultValueOnEmptyString;
     this.updateQuerySortBy = props.updateQuerySortBy;
-    this.setInitialState = props.setInitialState;
-  }
-
-  componentDidMount() {
-    if (this.props.currentSortBy === null) {
-      const sortBy = this.props.currentQueryString
-        ? this.defaultValue
-        : this.defaultValueOnEmptyString || this.defaultValue;
-      this.setInitialState({
-        sortBy: sortBy,
-      });
-    }
   }
 
   onChange = (value) => {
@@ -66,20 +52,16 @@ class SortBy extends Component {
 
 SortBy.propTypes = {
   values: PropTypes.array.isRequired,
-  defaultValue: PropTypes.string.isRequired,
-  defaultValueOnEmptyString: PropTypes.string,
   loading: PropTypes.bool.isRequired,
   totalResults: PropTypes.number.isRequired,
   currentSortBy: PropTypes.string,
   currentQueryString: PropTypes.string.isRequired,
   updateQuerySortBy: PropTypes.func.isRequired,
-  setInitialState: PropTypes.func.isRequired,
   label: PropTypes.func,
   overridableId: PropTypes.string,
 };
 
 SortBy.defaultProps = {
-  defaultValueOnEmptyString: null,
   currentSortBy: null,
   label: (cmp) => cmp,
   overridableId: '',

src/lib/components/SortBy/index.js

@@ -7,15 +7,14 @@
  */
 
 import { connect } from '../../store';
-import { updateQuerySortBy, setInitialState } from '../../state/actions';
+import { updateQuerySortBy } from '../../state/actions';
 import SortByComponent from './SortBy';
-const mapDispatchToProps = dispatch => ({
-  updateQuerySortBy: sortByValue => dispatch(updateQuerySortBy(sortByValue)),
-  setInitialState: value => dispatch(setInitialState(value)),
+const mapDispatchToProps = (dispatch) => ({
+  updateQuerySortBy: (sortByValue) => dispatch(updateQuerySortBy(sortByValue)),
 });
 
 export const SortBy = connect(
-  state => ({
+  (state) => ({
     loading: state.results.loading,
     totalResults: state.results.data.total,
     currentSortBy: state.query.sortBy,