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)
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
Add logo eed8364675e78cfa795550bff03682d49a8ed115 antcalatayud 2018-04-24 10:23:07
Commit b94423a4634ff836aa6a598fce406fa87763f043 - Display result of search autocomplete
Author: antcalatayud
Author date (UTC): 2018-04-25 13:58
Committer name: antcalatayud
Committer date (UTC): 2018-04-25 13:58
Parent(s): 130e0d0db2ff69907105d8c589de2264c0f4427f
Signing key:
Tree: d39ffc19053a13a249a6d5d8321b57449e735074
File Lines added Lines deleted
src/components/common/Search.js 37 4
src/components/list/Table.js 1 1
File src/components/common/Search.js changed (mode: 100644) (index a44045d..36de5bd)
... ... class Search extends React.Component {
10 10 this.state = { this.state = {
11 11 searchQuery: '', searchQuery: '',
12 12 error: null, error: null,
13 loading: false
13 loading: false,
14 searchResults: []
14 15 }; };
15 16
16 17 this.handleChange = this.handleChange.bind(this); this.handleChange = this.handleChange.bind(this);
 
... ... class Search extends React.Component {
31 32
32 33 fetch(`${API_URL}/autocomplete?searchQuery=${searchQuery}`) fetch(`${API_URL}/autocomplete?searchQuery=${searchQuery}`)
33 34 .then(handleResponse) .then(handleResponse)
34 .then((data) => {
35 console.log('Success', data);
35 .then((searchResults) => {
36 36 this.setState({ this.setState({
37 loading: false
37 loading: false,
38 searchResults
38 39 }); });
39 40 }) })
40 41 .catch((error) => { .catch((error) => {
 
... ... class Search extends React.Component {
45 46 }); });
46 47 } }
47 48
49 renderSearchresults(){
50 const { searchResults, searchQuery, loading } = this.state;
51
52 if(!searchQuery) return '';
53
54 if (searchResults.length > 0) {
55 return (
56 <div className="Search-result-container">
57 {searchResults.map(result => (
58 <div
59 key={result.id}
60 className="Search-result">
61 {result.name} ({result.symbol})
62 </div>
63 ))}
64 </div>
65 );
66 }
67
68 if (!loading) {
69 return(
70 <div className="Search-result-container">
71 <div className="Search-no-result">
72 No results found.
73 </div>
74 </div>
75 );
76 }
77 }
78
48 79 render() { render() {
49 80 const { loading } = this.state; const { loading } = this.state;
50 81
 
... ... class Search extends React.Component {
64 95 /> />
65 96 </div> </div>
66 97 } }
98
99 {this.renderSearchresults()}
67 100 </div> </div>
68 101 ); );
69 102 } }
File src/components/list/Table.js changed (mode: 100644) (index 4e0efaa..fb26699)
... ... const Table = (props) => {
16 16 <th>Cryptocurrency</th> <th>Cryptocurrency</th>
17 17 <th>Price</th> <th>Price</th>
18 18 <th>Market Price</th> <th>Market Price</th>
19 <th>2H Change</th>
19 <th>24H Change</th>
20 20 </tr> </tr>
21 21 </thead> </thead>
22 22 <tbody className="Table-body"> <tbody className="Table-body">
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