import React, { Component } from 'react';
import {
  StyleSheet,
  Text,
  View
} from 'react-native';

export default class SearchScreen extends Component {
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.welcome}>
          Welcome to React Native!
        </Text>
        <Text style={styles.instructions}>
          To get started, edit index.js
        </Text>
        <Text style={styles.instructions}>
          Press Cmd+R to reload,{'\n'}
          Cmd+D or shake for dev menu
        </Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
  instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
  },
});


@@ -46,59 +46,54 @@
 ort 
-%7B%0A  StyleSheet,%0A  Text,%0A  View%0A%7D from 'react-native
+RepoSearchBar from './components/RepoSearchBar
 ';%0A%0A
@@ -183,716 +183,35 @@
    %3C
-View style=%7Bstyles.container%7D%3E%0A        %3CText style=%7Bstyles.welcome%7D%3E%0A          Welcome to React Native!%0A        %3C/Text%3E%0A        %3CText style=%7Bstyles.instructions%7D%3E%0A          To get started, edit index.js%0A        %3C/Text%3E%0A        %3CText style=%7Bstyles.instructions%7D%3E%0A          Press Cmd+R to reload,%7B'%5Cn'%7D%0A          Cmd+D or shake for dev menu%0A        %3C/Text%3E%0A      %3C/View%3E%0A    );%0A  %7D%0A%7D%0A%0Aconst styles = StyleSheet.create(%7B%0A  container: %7B%0A    flex: 1,%0A    justifyContent: 'center',%0A    alignItems: 'center',%0A    backgroundColor: '#F5FCFF',%0A  %7D,%0A  welcome: %7B%0A    fontSize: 20,%0A    textAlign: 'center',%0A    margin: 10,%0A  %7D,%0A  instructions: %7B%0A    textAlign: 'center',%0A    color: '#333333',%0A    marginBottom: 5,%0A  %7D,%0A%7D);
+RepoSearchBar /%3E%0A    );%0A  %7D%0A%7D
 %0A%0A

Remove boilerplate and render the search bar