antcalatayud / ReactCoin (public) (License: GPLv3) (since 2018-04-24) (hash sha1)
As seen on this course: https://udilia.com/courses/learn-react-by-building-a-web-app
Clone URLs: https://rocketgit.com/user/antcalatayud/ReactCoin ssh://rocketgit@ssh.rocketgit.com/user/antcalatayud/ReactCoin git://git.rocketgit.com/user/antcalatayud/ReactCoin
develop
List of commits:
Subject Hash Author Date (UTC)
Redirect to detail page when dropdown selected 92d174e16c9f3b530d04a35ade4d34279a7fe700 antcalatayud 2018-04-25 14:08:33
Display result of search autocomplete b94423a4634ff836aa6a598fce406fa87763f043 antcalatayud 2018-04-25 13:58:23
Add logic to display loading on search when needed 130e0d0db2ff69907105d8c589de2264c0f4427f antcalatayud 2018-04-25 13:12:17
Add loading to search. Refactor Loading componet 68e60356f9a5daa530d0f1fc24db25e97cfc6cbc antcalatayud 2018-04-25 13:00:21
Start creating Seach component 9f6d5152998e40d7d41b2fa5381cc22684ba814b antcalatayud 2018-04-25 12:48:44
Add home link on logo 1ebc23cd70ddadf4d8518d5087b3a864825f42aa antcalatayud 2018-04-25 09:39:23
Add style to detail component. Refactor renderpercentage 764b2b2006bac9af3311cc22b2ce4c10388483e9 antcalatayud 2018-04-25 09:36:53
Start creating Detail component and add route to ir 01f5ae9c4984f05d2dd01b593ccb58369d9968da antcalatayud 2018-04-25 08:08:47
Add link to home page when page not found eb3c30fc87eff524b43d4197d945da9d026e8502 antcalatayud 2018-04-25 07:53:08
Add routing and not found page 17718006b6c1f4090ae971d0338ea8cd8f4b93c5 antcalatayud 2018-04-24 15:41:27
disable pagination buttons when min/max reached a7459260589206aa9430fd9dba67aed2b175607c antcalatayud 2018-04-24 15:14:06
Manage next/prev pages onclick pagination 104663344877dc34bc9e3df9762bfad335578d99 antcalatayud 2018-04-24 15:09:52
Start pagination component a2600ed30feb02a9394d31215d1218d699371f62 antcalatayud 2018-04-24 14:47:05
Move Table to new component 685659283e5fcfb3391bbd7e0988669a4896546b antcalatayud 2018-04-24 14:23:39
Add eror message 925f3e3199546d80b90276d53bf3ca827313adab antcalatayud 2018-04-24 14:10:51
Add loadin component 54504e3ae117730f625f6c5acf1a10ce912c6146 antcalatayud 2018-04-24 14:05:36
Create currencies table a410655fa61df8653b5943cb9c853b04e48c7287 antcalatayud 2018-04-24 13:34:35
Move some conts outside 00686f6d20dcc806e20a3d7bfb745517c203dd54 antcalatayud 2018-04-24 13:00:43
Add AJAX request to list component 3dd5f784d209cc1cfeb22bbc93aaf2c871e2c69b antcalatayud 2018-04-24 12:29:22
Start creating list componet c8bc3d6bb9b4980e1305d401be2fe67c8933a7f8 antcalatayud 2018-04-24 10:31:23
Commit 92d174e16c9f3b530d04a35ade4d34279a7fe700 - Redirect to detail page when dropdown selected
Author: antcalatayud
Author date (UTC): 2018-04-25 14:08
Committer name: antcalatayud
Committer date (UTC): 2018-04-25 14:08
Parent(s): b94423a4634ff836aa6a598fce406fa87763f043
Signing key:
Tree: 80d7326042bf2b854c7d2c382aed1b83a5a2b34a
File Lines added Lines deleted
src/components/common/Search.js 18 4
File src/components/common/Search.js changed (mode: 100644) (index 36de5bd..97c5cc3)
1 1 import React from 'react'; import React from 'react';
2 import { withRouter } from 'react-router-dom';
2 3 import { API_URL } from '../../config'; import { API_URL } from '../../config';
3 4 import { handleResponse } from'../../helpers'; import { handleResponse } from'../../helpers';
4 5 import Loading from './Loading'; import Loading from './Loading';
 
... ... class Search extends React.Component {
15 16 }; };
16 17
17 18 this.handleChange = this.handleChange.bind(this); this.handleChange = this.handleChange.bind(this);
19 this.handleRedirect = this.handleRedirect.bind(this);
20 }
21
22 handleRedirect(currencyId){
23 this.setState({
24 searchQuery: '',
25 searchResults: []
26 });
27
28 this.props.history.push(`/currency/${currencyId}`);
18 29 } }
19 30
20 31 handleChange(event){ handleChange(event){
 
... ... class Search extends React.Component {
57 68 {searchResults.map(result => ( {searchResults.map(result => (
58 69 <div <div
59 70 key={result.id} key={result.id}
60 className="Search-result">
71 className="Search-result"
72 onClick={() => this.handleRedirect(result.id)}>
61 73 {result.name} ({result.symbol}) {result.name} ({result.symbol})
62 74 </div> </div>
63 75 ))} ))}
 
... ... class Search extends React.Component {
77 89 } }
78 90
79 91 render() { render() {
80 const { loading } = this.state;
92 const { loading, searchQuery } = this.state;
81 93
82 94 return ( return (
83 95 <div className="Search"> <div className="Search">
 
... ... class Search extends React.Component {
85 97 <input className="Search-input" <input className="Search-input"
86 98 onChange={this.handleChange} onChange={this.handleChange}
87 99 type="text" type="text"
88 placeholder = "Currency name"/>
100 placeholder = "Currency name"
101 value={searchQuery}
102 />
89 103
90 104 {loading && {loading &&
91 105 <div className="Search-loading"> <div className="Search-loading">
 
... ... class Search extends React.Component {
102 116 } }
103 117 } }
104 118
105 export default Search;
119 export default withRouter(Search);
Hints:
Before first commit, do not forget to setup your git environment:
git config --global user.name "your_name_here"
git config --global user.email "your@email_here"

Clone this repository using HTTP(S):
git clone https://rocketgit.com/user/antcalatayud/ReactCoin

Clone this repository using ssh (do not forget to upload a key first):
git clone ssh://rocketgit@ssh.rocketgit.com/user/antcalatayud/ReactCoin

Clone this repository using git:
git clone git://git.rocketgit.com/user/antcalatayud/ReactCoin

You are allowed to anonymously push to this repository.
This means that your pushed commits will automatically be transformed into a merge request:
... clone the repository ...
... make some changes and some commits ...
git push origin main