Split selectors.js into individual files

client/components/data/activating-theme/index.js

@@ -8,7 +8,11 @@ import omit from 'lodash/object/omit';
 /**
  * Internal dependencies
  */
-import { isActivating, hasActivated, getCurrentTheme } from 'lib/themes/selectors';
+import {
+	isActivating,
+	hasActivated,
+	getCurrentTheme
+} from 'lib/themes/selectors/current-theme';
 
 /**
  * Passes the activating state of themes to the supplied child component.

client/components/data/current-theme/index.js

@@ -10,7 +10,7 @@ import omit from 'lodash/object/omit';
  * Internal dependencies
  */
 import { fetchCurrentTheme } from 'lib/themes/actions';
-import { getCurrentTheme } from 'lib/themes/selectors';
+import { getCurrentTheme } from 'lib/themes/selectors/current-theme';
 
 /**
  * Fetches the currently active theme of the supplied site

shared/components/data/themes-list-fetcher/index.jsx

@@ -4,6 +4,7 @@
 import React from 'react';
 import omit from 'lodash/object/omit';
 import once from 'lodash/function/once';
+import filter from 'lodash/collection/filter';
 import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 
@@ -12,13 +13,9 @@ import { connect } from 'react-redux';
  */
 import Constants from 'lib/themes/constants';
 import { query, fetchNextPage } from 'lib/themes/actions';
-import {
-	getFilteredThemes,
-	hasSiteChanged,
-	isJetpack,
-	isLastPage,
-	isFetchingNextPage
-} from 'lib/themes/selectors';
+import { hasSiteChanged, isJetpack } from 'lib/themes/selectors/themes-last-query';
+import { isLastPage, isFetchingNextPage, getThemesList } from 'lib/themes/selectors/themes-list';
+import { getThemeById } from 'lib/themes/selectors/themes';
 
 const ThemesListFetcher = React.createClass( {
 	propTypes: {
@@ -118,6 +115,31 @@ const ThemesListFetcher = React.createClass( {
 
 } );
 
+function getFilteredThemes( state, search ) {
+	const allThemes = getThemesList( state )
+		.map( getThemeById.bind( null, state ) );
+
+	if ( ! isJetpack( state ) || ! search ) {
+		return allThemes;
+	}
+
+	return filter( allThemes, theme => matches( theme, search ) );
+}
+
+function matches( theme, rawSearch ) {
+	const search = rawSearch.toLowerCase().trim();
+
+	return [ 'name', 'tags', 'description', 'author' ].some( field => (
+		theme[ field ] && join( theme[ field ] )
+			.toLowerCase().replace( '-', ' ' )
+			.indexOf( search ) >= 0
+	) );
+}
+
+function join( value ) {
+	return Array.isArray( value ) ? value.join( ' ' ) : value;
+}
+
 export default connect(
 	( state, props ) => Object.assign( {},
 		props,

shared/lib/themes/actions.js

@@ -11,12 +11,10 @@ const debug = debugFactory( 'calypso:themes:actions' ); //eslint-disable-line no
  */
 import ThemeConstants from 'lib/themes/constants';
 import ThemeHelpers from './helpers';
-import {
-	getThemeById,
-	getCurrentTheme,
-	getQueryParams,
-	isJetpack
-} from './selectors';
+import { getCurrentTheme } from 'lib/themes/selectors/current-theme';
+import { isJetpack } from 'lib/themes/selectors/themes-last-query';
+import { getQueryParams } from 'lib/themes/selectors/themes-list';
+import { getThemeById } from 'lib/themes/selectors/themes';
 import wpcom from 'lib/wp';
 
 export function fetchThemes( site ) {

shared/lib/themes/selectors/current-theme.js

@@ -0,0 +1,11 @@
+export function getCurrentTheme( state, siteId ) {
+	return state.themes.currentTheme.get( 'currentThemes' ).get( siteId );
+}
+
+export function isActivating( state ) {
+	return state.themes.currentTheme.get( 'isActivating' );
+}
+
+export function hasActivated( state ) {
+	return state.themes.currentTheme.get( 'hasActivated' );
+}

shared/lib/themes/selectors/themes-last-query.js

@@ -0,0 +1,16 @@
+export function isJetpack( state ) {
+	return !! state.themes.themesLastQuery.get( 'isJetpack' );
+}
+
+export function getParams( state ) {
+	return state.themes.themesLastQuery.get( 'lastParams' ) || {};
+}
+
+export function hasSiteChanged( state ) {
+	return state.themes.themesLastQuery.get( 'previousSiteId' ) !==
+		state.themes.themesLastQuery.get( 'currentSiteId' );
+};
+
+export function hasParams( state ) {
+	return !! state.themes.themesLastQuery.get( 'lastParams' );
+}

shared/lib/themes/selectors/themes-list.js

@@ -0,0 +1,15 @@
+export function isFetchingNextPage( state ) {
+	return state.themes.themesList.getIn( [ 'queryState', 'isFetchingNextPage' ] );
+}
+
+export function isLastPage( state ) {
+	return state.themes.themesList.getIn( [ 'queryState', 'isLastPage' ] );
+}
+
+export function getThemesList( state ) {
+	return state.themes.themesList.get( 'list' );
+}
+
+export function getQueryParams( state ) {
+	return state.themes.themesList.get( 'query' ).toObject();
+}

shared/lib/themes/selectors/themes.js

@@ -0,0 +1,8 @@
+export function getThemes( state ) {
+	return state.themes.themes.get( 'themes' ).toJS();
+}
+
+export function getThemeById( state, id ) {
+	const theme = state.themes.themes.getIn( [ 'themes', id ] );
+	return theme ? theme.toJS() : undefined;
+}

shared/my-sites/themes/main.jsx

@@ -27,7 +27,7 @@ var Main = require( 'components/main' ),
 	ThemesSelection = require( './themes-selection' ),
 	ThemeHelpers = require( 'lib/themes/helpers' ),
 	getButtonOptions = require( './theme-options' ),
-	ThemeSelectors = require( 'lib/themes/selectors' );
+	ThemesListSelectors = require( 'lib/themes/selectors/themes-list' );
 
 var Themes = React.createClass( {
 	mixins: [ observe( 'sites' ) ],
@@ -172,8 +172,8 @@ export default connect(
 	( state, props ) => Object.assign( {},
 		props,
 		{
-			queryParams: ThemeSelectors.getQueryParams( state ),
-			themesList: ThemeSelectors.getThemesList( state )
+			queryParams: ThemesListSelectors.getQueryParams( state ),
+			themesList: ThemesListSelectors.getThemesList( state )
 		}
 	)
 )( Themes );