New: Add support for search through url query params

frontend/src/Search/SearchFooterConnector.js

@@ -3,12 +3,14 @@ import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import { createSelector } from 'reselect';
 import { setSearchDefault } from 'Store/Actions/releaseActions';
+import parseUrl from 'Utilities/String/parseUrl';
 import SearchFooter from './SearchFooter';
 
 function createMapStateToProps() {
   return createSelector(
     (state) => state.releases,
-    (releases) => {
+    (state) => state.router.location,
+    (releases, location) => {
       const {
         searchQuery: defaultSearchQuery,
         searchIndexerIds: defaultIndexerIds,
@@ -18,13 +20,41 @@ function createMapStateToProps() {
         searchOffset: defaultSearchOffset
       } = releases.defaults;
 
+      const { params } = parseUrl(location.search);
+      const defaultSearchQueryParams = {};
+
+      if (params.query && !defaultSearchQuery) {
+        defaultSearchQueryParams.searchQuery = params.query;
+      }
+
+      if (params.indexerIds && !defaultIndexerIds.length) {
+        defaultSearchQueryParams.searchIndexerIds = params.indexerIds.split(',').filter(Boolean).map((id) => Number(id));
+      }
+
+      if (params.categories && !defaultCategories.length) {
+        defaultSearchQueryParams.searchCategories = params.categories.split(',').filter(Boolean).map((id) => Number(id));
+      }
+
+      if (params.type && defaultSearchType === 'search') {
+        defaultSearchQueryParams.searchType = params.type;
+      }
+
+      if (params.limit && defaultSearchLimit === 100 && !isNaN(params.limit)) {
+        defaultSearchQueryParams.searchLimit = Number(params.limit);
+      }
+
+      if (params.offset && !defaultSearchOffset && !isNaN(params.offset)) {
+        defaultSearchQueryParams.searchOffset = Number(params.offset);
+      }
+
       return {
-        defaultSearchQuery,
+        defaultSearchQueryParams,
-        defaultIndexerIds,
+        defaultSearchQuery: defaultSearchQueryParams.searchQuery ?? defaultSearchQuery,
-        defaultCategories,
+        defaultIndexerIds: defaultSearchQueryParams.searchIndexerIds ?? defaultIndexerIds,
-        defaultSearchType,
+        defaultCategories: defaultSearchQueryParams.searchCategories ?? defaultCategories,
-        defaultSearchLimit,
+        defaultSearchType: defaultSearchQueryParams.searchType ?? defaultSearchType,
-        defaultSearchOffset
+        defaultSearchLimit: defaultSearchQueryParams.searchLimit ?? defaultSearchLimit,
+        defaultSearchOffset: defaultSearchQueryParams.searchOffset ?? defaultSearchOffset
       };
     }
   );
@@ -36,6 +66,16 @@ const mapDispatchToProps = {
 
 class SearchFooterConnector extends Component {
 
+  //
+  // Lifecycle
+
+  componentDidMount() {
+    // Set defaults from query parameters
+    Object.entries(this.props.defaultSearchQueryParams).forEach(([name, value]) => {
+      this.onInputChange({ name, value });
+    });
+  }
+
   //
   // Listeners
 
@@ -47,9 +87,14 @@ class SearchFooterConnector extends Component {
   // Render
 
   render() {
+    const {
+      defaultSearchQueryParams,
+      ...otherProps
+    } = this.props;
+
     return (
       <SearchFooter
-        {...this.props}
+        {...otherProps}
         onInputChange={this.onInputChange}
       />
     );
@@ -57,6 +102,7 @@ class SearchFooterConnector extends Component {
 }
 
 SearchFooterConnector.propTypes = {
+  defaultSearchQueryParams: PropTypes.object.isRequired,
   setSearchDefault: PropTypes.func.isRequired
 };