diff --git a/.idea/workspace.xml b/.idea/workspace.xml
index feb7739..c28b36a 100644
--- a/.idea/workspace.xml
+++ b/.idea/workspace.xml
@@ -2,10 +2,7 @@
-
-
-
@@ -106,7 +103,7 @@
1569429914875
-
+
1569512995385
@@ -143,7 +140,14 @@
1569577010198
-
+
+ 1569579204855
+
+
+
+ 1569579204855
+
+
@@ -167,6 +171,7 @@
-
+
+
\ No newline at end of file
diff --git a/src/App.js b/src/App.js
index d3bf8cf..9df86a9 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,19 +1,19 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import Navbar from './components/layout/Navbar';
-import Users from './components/users/Users';
-import Search from './components/users/Search';
-import axios from 'axios';
-import './App.css';
+import React, { Component } from "react";
+import PropTypes from "prop-types";
+import Navbar from "./components/layout/Navbar";
+import Users from "./components/users/Users";
+import Search from "./components/users/Search";
+import axios from "axios";
+import "./App.css";
class App extends Component {
state = {
- 'users': [],
- 'loading': false
+ users: [],
+ loading: false
};
static propTypes = {
- searchUsers:PropTypes.func.isRequired
+ searchUsers: PropTypes.func.isRequired
};
/*async componentDidMount() {
@@ -22,29 +22,36 @@ class App extends Component {
console.log(res.data);
this.setState({ 'users':res.data, 'loading': false });
}*/
- // Search github users
- searchUsers = async (text) => {
- this.setState({ 'loading': true });
- const res = await axios.get(`https://api.github.com/search/users?q=${text}&client_id=${process.env.REACT_APP_GITHUB_CLIENT_ID}&client_secret=${process.env.REACT_APP_GITHUB_CLIENT_SECRET}`);
- console.log(res.data);
- this.setState({ 'users':res.data.items, 'loading': false });
+ // Search github users
+ searchUsers = async text => {
+ this.setState({ loading: true });
+ const res = await axios.get(
+ `https://api.github.com/search/users?q=${text}&client_id=${process.env.REACT_APP_GITHUB_CLIENT_ID}&client_secret=${process.env.REACT_APP_GITHUB_CLIENT_SECRET}`
+ );
+ console.log(res.data);
+ this.setState({ users: res.data.items, loading: false });
+ };
+
+ // Clear Users from State
+
+ clearUsers = () => {
+ this.setState({ users: [], loading: false });
};
render() {
+ const {users, loading} = this.state;
return (
);
}
-
}
export default App;
diff --git a/src/components/users/Search.js b/src/components/users/Search.js
index 4dfdd70..0c51e9f 100644
--- a/src/components/users/Search.js
+++ b/src/components/users/Search.js
@@ -1,5 +1,5 @@
import React, {Component} from 'react';
-// import PropTypes from 'prop-types';
+ import PropTypes from 'prop-types';
class Search extends Component {
@@ -18,17 +18,27 @@ class Search extends Component {
};
render() {
+ const {showClear, clearUsers} = this.props;
return (
+ {showClear &&
+
+
+ }
+
);
}
}
-// Search.propTypes = {};
+Search.propTypes = {
+ searchUsers:PropTypes.func.isRequired,
+ clearUsers: PropTypes.func.isRequired,
+ showClear: PropTypes.bool.isRequired
+};
export default Search;