Making WordPress.org


Ignore:
Timestamp:
03/01/2017 06:08:54 PM (8 years ago)
Author:
obenland
Message:

Plugin Directory: Update React client with latest changes.

This is largely a cleanup commit with some WIP around switching to node-wpapi.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-plugins/client/components/search-form/index.jsx

    r4223 r5024  
    1 import React from 'react';
     1/**
     2 * Internal dependencies.
     3 */
     4import React, { Component, PropTypes } from 'react';
     5import { connect } from 'react-redux';
    26import { withRouter } from 'react-router';
    37
     
    59 * Internal dependencies.
    610 */
     11import { getSearchTerm } from 'state/selectors';
    712import SearchForm from './search-form';
    813
    9 const SearchFormContainer = React.createClass( {
    10     getInitialState() {
    11         return {
    12             searchTerm: this.props.searchTerm
    13         };
    14     },
     14export class SearchFormContainer extends Component {
     15    static propTypes = {
     16        router: PropTypes.object,
     17        search: PropTypes.string,
     18    };
    1519
    16     onChange( searchTerm ) {
    17         this.setState( {
    18             searchTerm: searchTerm
    19         } );
    20     },
     20    static defaultProps = {
     21        router: {},
     22        search: '',
     23    };
    2124
    22     componentWillReceiveProps( nextProps ) {
    23         this.setState( {
    24             searchTerm: nextProps.searchTerm
    25         } );
    26     },
     25    onChange = ( search ) => {
     26        this.setState( { search } );
     27    };
    2728
    28     onSubmit( event ) {
    29         var searchTerm = encodeURIComponent( this.state.searchTerm );
     29    onSubmit = ( event ) => {
     30        const search = encodeURIComponent( this.state.search );
    3031        event.preventDefault();
    3132
    32         if ( searchTerm ) {
    33             this.props.router.push( `/search/${ searchTerm }/` );
     33        if ( search ) {
     34            this.props.router.push( `/search/${ search }/` );
    3435        } else {
    3536            this.props.router.push( '/' );
    3637        }
    37     },
     38    };
     39
     40    constructor() {
     41        super( ...arguments );
     42
     43        this.state = {
     44            search: this.props.search,
     45        };
     46    }
     47
     48    componentWillReceiveProps( { search } ) {
     49        this.setState( { search } );
     50    }
    3851
    3952    render() {
    40         return <SearchForm searchTerm={ this.state.searchTerm } onSubmit={ this.onSubmit } onChange={ this.onChange } />;
     53        return <SearchForm onSubmit={ this.onSubmit } onChange={ this.onChange } />;
    4154    }
    42 } );
     55}
    4356
    44 export default withRouter( SearchFormContainer );
     57export default withRouter( connect(
     58    ( state ) => ( {
     59        search: getSearchTerm( state ),
     60    } ),
     61)( SearchFormContainer ) );
Note: See TracChangeset for help on using the changeset viewer.