solve some design issues

Author: razat249

src/components/ReposList/ReposList.jsx

@@ -21,21 +21,25 @@ class ReposList extends Component {
     if (repos.data[0]) {
       const self = this;
       var reposList = repos.data.map(function(repo){
-        return <a key={repo.id} href="#" onClick={ e => self.selectRepo(repo.owner.login, repo.name) } className="list-group-item">{repo.name}</a>;
+        return (<a key={repo.id} href="#" onClick={ e => self.selectRepo(repo.owner.login, repo.name) } className="list-group-item">
+                  {repo.name}
+                  <span className="text-color-white badge">{repo.stargazers_count} <Icon name="star"/></span>
+                </a>);
       })
     }
 
-    console.log(this.props)
     return (
       <div className="reposlist-wrapper">
         <div>
           <h4 className="lightslategray-color"><b>Repositories</b></h4>
-          { repos.fetching ? <h4 className="lightslategray-color text-center"><b><Icon spin name="spinner" /> Loading...</b></h4> :
+          { 
+            repos.fetching ? <h4 className="lightslategray-color text-center"><b><Icon spin name="circle-o-notch" /> Loading...</b></h4> :
             repos.fetched ?
               <ul className="list-group">
                 {reposList}
               </ul>:
-              <h6 className="lightslategray-color text-center"><b>Your repos will load here.</b></h6> }
+              <h6 className="lightslategray-color text-center"><b>Your repos will load here.</b></h6> 
+          }
         </div>
       </div>
     );

src/components/SearchSideBar/SearchSideBar.jsx

@@ -46,7 +46,7 @@ class SearchSideBar extends Component {
               {usersList}
             </datalist>
             <h5>
-              {this.props.users.fetching ? <span><Icon spin name="spinner" /> Loading...</span>: ""}
+              {this.props.users.fetching ? <span><Icon spin name="circle-o-notch" /> Loading...</span>: ""}
             </h5>
             <button className="btn btn-primary" onClick={ e => this.handleClick(this.state.value) }>Submit</button>
           </from>

src/components/UserDetailsContainer/UserDetailsContainer.jsx

@@ -45,7 +45,7 @@ class UserDetailsContainer extends Component {
       <div>
         <br/><br/>
         <h2 className="lightslategray-color text-center">
-          <Icon spin name="spinner" />
+          <Icon spin name="circle-o-notch" />
           <b> Loading...</b>
         </h2>
       </div>

src/components/UserEventsList/UserEventsList.jsx

@@ -206,10 +206,10 @@ class UserEventsList extends Component {
                                 <label><input onChange={(e) => this.handleFilterChange('PullRequestEvent', e)} type="checkbox" value="" />PR</label>
                             </div>
                             <div className="checkbox-inline disabled">
-                                <label><input onChange={(e) => this.handleFilterChange('CreateEvent', e)} type="checkbox" value="" />create</label>
+                                <label><input onChange={(e) => this.handleFilterChange('CreateEvent', e)} type="checkbox" value="" />Create</label>
                             </div>
                             <div className="checkbox-inline disabled">
-                                <label><input onChange={(e) => this.handleFilterChange('ForkEvent', e)} type="checkbox" value="" />forks</label>
+                                <label><input onChange={(e) => this.handleFilterChange('ForkEvent', e)} type="checkbox" value="" />Forks</label>
                             </div>
                         </form>
                     </div>

src/components/UserSummary/UserSummary.jsx

@@ -9,7 +9,7 @@ class UserSummary extends Component {
     return (
       <div>
         { 
-          user.fetching ? <h4 className="text-center lightslategray-color"><b>Loading...</b></h4> :
+          user.fetching ? <h4 className="text-center lightslategray-color"><b><Icon spin name="circle-o-notch" /> Loading...</b></h4> :
             user.fetched ?
             <div>
               <div><img src={user.data.avatar_url} className="img-responsive" alt=""/></div>

src/containers/App/App.js

@@ -7,7 +7,6 @@ import UserSummary from '../../components/UserSummary/UserSummary.jsx';
 import ReposList from '../../components/ReposList/ReposList.jsx';
 import UserDetailsContainer from '../../components/UserDetailsContainer/UserDetailsContainer.jsx';
 
-
 class App extends Component {
   render() {
     return (

src/redux/actions/singleUserActions.js

@@ -10,7 +10,7 @@ export function fetchUserSummary(user) {
 export function fetchUserEvents(user) {
     return {
         type: "FETCH_USER_EVENTS",
-        payload: axios.get(`https://api.github.com/users/${user}/events`),
+        payload: axios.get(`https://api.github.com/users/${user}/events?page=1&per_page=50`),
     }
 }