From cfae191dd0a602e04ffa5f59bd1869a3c19937f5 Mon Sep 17 00:00:00 2001 From: philawsophizing Date: Sun, 4 Jun 2017 17:26:35 +0300 Subject: [PATCH 1/5] Replace search bar with search list --- src/components/search_bar.jsx | 12 ------------ src/components/search_list.jsx | 25 +++++++++++++++++++++++++ 2 files changed, 25 insertions(+), 12 deletions(-) delete mode 100644 src/components/search_bar.jsx create mode 100644 src/components/search_list.jsx diff --git a/src/components/search_bar.jsx b/src/components/search_bar.jsx deleted file mode 100644 index cc5bd61..0000000 --- a/src/components/search_bar.jsx +++ /dev/null @@ -1,12 +0,0 @@ -import React from 'react'; -import { Link } from 'react-router-dom'; - -const SearchBar = () => - ( -
- - -
- ); - -export default SearchBar; diff --git a/src/components/search_list.jsx b/src/components/search_list.jsx new file mode 100644 index 0000000..f4ebbc4 --- /dev/null +++ b/src/components/search_list.jsx @@ -0,0 +1,25 @@ +import React from 'react'; + +const SearchList = (props) => { + const handleClick = (guestHouse) => { + props.updateCurrent(guestHouse); + }; + console.log(props); + + return ( +
+ {props.db.map((guestHouses) => { + const boundItemClick = handleClick.bind(this, guestHouses.name); + return ( + + ); + })} +
+ ); +}; + +export default SearchList; From 513a60be97ad0ec7839b4c5ce0f7632ce466fe1f Mon Sep 17 00:00:00 2001 From: philawsophizing Date: Sun, 4 Jun 2017 17:28:30 +0300 Subject: [PATCH 2/5] Set state with data from the database, current guesthouse ref #22 --- src/containers/select_guesthouse.jsx | 23 ++++++++++++++++++++--- 1 file changed, 20 insertions(+), 3 deletions(-) diff --git a/src/containers/select_guesthouse.jsx b/src/containers/select_guesthouse.jsx index e782c28..fe0298f 100644 --- a/src/containers/select_guesthouse.jsx +++ b/src/containers/select_guesthouse.jsx @@ -3,20 +3,35 @@ import axios from 'axios'; import Header from '../components/header.jsx'; import TextBox from '../components/text_box.jsx'; -import SearchBar from '../components/search_bar.jsx'; +import SearchList from '../components/search_list.jsx'; class SelectGuesthouse extends Component { constructor(props) { super(props); this.state = { - db: {}, + db: [], + currentGuestHouse: {}, }; + this.currentGuestHouse = this.currentGuestHouse.bind(this); + } + + currentGuestHouse(guestHouse) { + const current = this.state.db.filter((curr) => { + if (curr.name === guestHouse) { + return curr; + } + return current; + }); + this.setState({ + currentGuestHouse: current, + }); } componentDidMount() { axios.get('/api') .then((res) => { + // console.log(res.data); this.setState({ db: res.data }); }); } @@ -26,7 +41,9 @@ class SelectGuesthouse extends Component {
- +
); } From 16ca391f62e161e608ab1473e17df31e5b59ba19 Mon Sep 17 00:00:00 2001 From: philawsophizing Date: Tue, 6 Jun 2017 11:29:12 +0300 Subject: [PATCH 3/5] Fix var naming, split out button component, ref #22 --- src/components/search_list.jsx | 29 +++++++++++----------------- src/containers/select_guesthouse.jsx | 8 +++++--- 2 files changed, 16 insertions(+), 21 deletions(-) diff --git a/src/components/search_list.jsx b/src/components/search_list.jsx index f4ebbc4..48c251e 100644 --- a/src/components/search_list.jsx +++ b/src/components/search_list.jsx @@ -1,25 +1,18 @@ import React from 'react'; +import SearchButton from './search_button.jsx'; -const SearchList = (props) => { - const handleClick = (guestHouse) => { - props.updateCurrent(guestHouse); - }; - console.log(props); - - return ( +const SearchList = props => + (
- {props.db.map((guestHouses) => { - const boundItemClick = handleClick.bind(this, guestHouses.name); - return ( - - ); - })} + {props.db.map(guestHouses => + // const boundItemClick = handleClick.bind(this, guestHouses.name); + , + )}
); -}; export default SearchList; diff --git a/src/containers/select_guesthouse.jsx b/src/containers/select_guesthouse.jsx index fe0298f..1cb992d 100644 --- a/src/containers/select_guesthouse.jsx +++ b/src/containers/select_guesthouse.jsx @@ -10,6 +10,8 @@ class SelectGuesthouse extends Component { constructor(props) { super(props); this.state = { + title: 'PAS', + tagLine: 'Park & Sleep', db: [], currentGuestHouse: {}, }; @@ -17,9 +19,9 @@ class SelectGuesthouse extends Component { } currentGuestHouse(guestHouse) { - const current = this.state.db.filter((curr) => { - if (curr.name === guestHouse) { - return curr; + const current = this.state.db.filter((GHouse) => { + if (GHouse.name === guestHouse) { + return GHouse; } return current; }); From e42b09d3776c024a284bf5913347df25dc627825 Mon Sep 17 00:00:00 2001 From: philawsophizing Date: Tue, 6 Jun 2017 11:41:15 +0300 Subject: [PATCH 4/5] Add search button component ref #22 --- src/components/search_button.jsx | 12 ++++++++++++ 1 file changed, 12 insertions(+) create mode 100644 src/components/search_button.jsx diff --git a/src/components/search_button.jsx b/src/components/search_button.jsx new file mode 100644 index 0000000..24d7d39 --- /dev/null +++ b/src/components/search_button.jsx @@ -0,0 +1,12 @@ +import React from 'react'; + +const SearchButton = (props) => { + const handle = () => { + props.clickHandler(props.currentGHouse); + }; + + return ( + + ); +}; +export default SearchButton; From 01c2d4f1b46db9ba08affa83011fa46a5e95f20a Mon Sep 17 00:00:00 2001 From: philawsophizing Date: Tue, 6 Jun 2017 12:06:32 +0300 Subject: [PATCH 5/5] Improve naming in state ref #22 --- src/containers/select_guesthouse.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/containers/select_guesthouse.jsx b/src/containers/select_guesthouse.jsx index 1cb992d..8cddb98 100644 --- a/src/containers/select_guesthouse.jsx +++ b/src/containers/select_guesthouse.jsx @@ -12,7 +12,7 @@ class SelectGuesthouse extends Component { this.state = { title: 'PAS', tagLine: 'Park & Sleep', - db: [], + guestHouseList: [], currentGuestHouse: {}, }; this.currentGuestHouse = this.currentGuestHouse.bind(this); @@ -44,7 +44,7 @@ class SelectGuesthouse extends Component {
);