SearchBar.js

import React, {Component, PropTypes, View, TextInput, ActivityIndicatorIOS} from 'react-native';
import {searchStyles} from '../styles';

export default class SearchBar extends Component {
    static propTypes = {
        isLoading: PropTypes.bool.isRequired,
        search:    PropTypes.func.isRequired,
    };

    static defaultProps = {
        isLoading: false,
    };

    /**
     * Execute a search
     *
     * @param {String} query
     */
    search(query: string) {
        this.props.search(query.toLowerCase());
    }

    render() {
        return (
            <View style={searchStyles.searchBar}>
                <TextInput
                    autoCapitalize="none"
                    autoCorrect={false}
                    onChangeText={::this.search}
                    placeholder="Search a repository..."
                    style={searchStyles.searchBarInput}
                />
                {this.props.isLoading && (
                    <ActivityIndicatorIOS
                        animating={this.props.isLoading}
                        style={searchStyles.spinner}
                    />
                )}
            </View>
        );
    }
}