Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ports - Laneia & Margaret #23

Open
wants to merge 40 commits into
base: master
Choose a base branch
from
Open
Changes from 1 commit
Commits
Show all changes
40 commits
Select commit Hold shift + click to select a range
8d0291f
app set up
msfinnan Jun 24, 2019
1aa77d2
created new component files
msfinnan Jun 24, 2019
6383ffc
can show all movies in library in app
msfinnan Jun 24, 2019
d56ee92
added customer and movie components
msfinnan Jun 25, 2019
0271b66
renamed library to MovieList and Customers to CustomerList
msfinnan Jun 25, 2019
04cb166
working on displaying all customers and all movies
msfinnan Jun 25, 2019
5564c98
added get requests for customers and movies to the same componentDidM…
msfinnan Jun 25, 2019
1549d29
added React Router to App
msfinnan Jun 25, 2019
54f3d19
react router working and can show all movies or all customers
msfinnan Jun 25, 2019
bb8fb8a
added functionality to select customer and select movie
msfinnan Jun 25, 2019
bbd69a0
added prop types
msfinnan Jun 25, 2019
8c5549c
shows selected customer id and movie id
msfinnan Jun 25, 2019
b98d3c0
displaying selected customer id and name, selected movie id and title
msfinnan Jun 25, 2019
695c158
can make post request to check out movie to customer
msfinnan Jun 25, 2019
f8ce2b1
trying to get search working
Jun 26, 2019
35e021c
fixed some bugs, not all
Jun 26, 2019
4d9eb38
fixed display movies bug, still working on rental checkout and search
Jun 26, 2019
f9b7fb0
add back in selected customer movie display
Jun 26, 2019
83ff668
explored api things, rolled back changes, fixed bug in checkout
msfinnan Jun 26, 2019
d7237f4
checkout movie is working
msfinnan Jun 26, 2019
8156dff
added error handling for checkout, gives error if no movie or no user…
msfinnan Jun 26, 2019
3738e36
error messages and success message added for movie checkout
msfinnan Jun 26, 2019
aea6904
basic search functionality, cannot select from it
Jun 26, 2019
60b704b
adding in functions to make add to library from search possible, not …
Jun 26, 2019
77a4afc
add movie to db works, but need to handle if movie is already in db
Jun 27, 2019
744ee26
fixed bug in select movie
Jun 27, 2019
4205a08
added movieLookUp method to MovieList.js
Jun 27, 2019
05576d9
moved movie state to app.js
Jun 27, 2019
fbcd021
movie search if already in database displays message instead of butto…
Jun 27, 2019
6b33f2f
search can now load movies independently of clicking movies yay
Jun 27, 2019
e6e5d7d
added back styling to master:
msfinnan Jun 27, 2019
82b5433
fixed styling
msfinnan Jun 27, 2019
391ffae
fixed addMovie bug
Jun 28, 2019
b426b00
removed console logs, made selection card only render if a movie or u…
msfinnan Jun 28, 2019
c28b4b7
added prop types
msfinnan Jun 28, 2019
5abea48
fixed weird image bug
Jun 28, 2019
3bf4f5f
clear state of selected customer and movie after check out
Jun 28, 2019
7bc4ddd
add background color, fonts, minor styling
Jun 28, 2019
c06f6e7
merge conflicts solved and bug for when there is no releae date fixed
msfinnan Jun 28, 2019
6cc8b21
added bootstrap card to search
msfinnan Jun 28, 2019
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
removed console logs, made selection card only render if a movie or u…
…ser was selected
  • Loading branch information
msfinnan committed Jun 28, 2019
commit b426b00a74690c7cdf61adffa48886a30485fb4c
4 changes: 2 additions & 2 deletions src/App.css
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
.App {
/* .App {
text-align: center;
}

@@ -25,4 +25,4 @@
@keyframes App-logo-spin {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
} */
56 changes: 24 additions & 32 deletions src/App.js
Original file line number Diff line number Diff line change
@@ -7,9 +7,9 @@ import Search from './components/Search';
import Select from './components/Select';
import { BrowserRouter as Router, Route, Link } from "react-router-dom";

const Index = () => {
return (<p></p>);
}
// const Index = () => {
// return (<p></p>);
// }
class App extends Component {
constructor(props) {
super(props)
@@ -22,14 +22,12 @@ class App extends Component {
}

onSelectCustomer = (customer) => {
console.log(customer);
this.setState({
selectedCustomer: customer,
});
}

onSelectMovie = (movie) => {
console.log(movie);
this.setState({
selectedMovie: movie,
});
@@ -62,16 +60,13 @@ class App extends Component {
}

movieLookUp = (movieID) => {
console.log(this.state.movies)
console.log(movieID)
return this.state.movies.find(movie => movie.external_id === movieID)
}

setMovieState = (allMovies) => {
console.log("in setMovieState")
this.setState({
movies: allMovies,
});
});
}

render() {
@@ -96,34 +91,31 @@ class App extends Component {
<Router>
<div>
<nav className="navbar navbar-expand-lg navbar-light bg-light">
<ul className="navbar-nav mr-auto">
<li className="nav-link">
<Link to="/">Home</Link>
</li>
<li className="nav-link">
<Link to="/movies">Movies</Link>
</li>
<li className="nav-link">
<Link to="/customers">Customers</Link>
</li>
<li className="nav-link">
<Link to="/search">Search</Link>
</li>
</ul>
<ul className="navbar-nav mr-auto">
<li className="nav-link">
<Link to="/">Home</Link>
</li>
<li className="nav-link">
<Link to="/movies">Movies</Link>
</li>
<li className="nav-link">
<Link to="/customers">Customers</Link>
</li>
<li className="nav-link">
<Link to="/search">Search</Link>
</li>
</ul>
</nav>

<hr />

<div>
Current Selections:
<Select
{(this.state.selectedMovie || this.state.selectedCustomer) && <Select
movie={this.state.selectedMovie}
customer={this.state.selectedCustomer}
onCheckoutMovie={this.onCheckoutMovie}
/>
/>}
</div>
<Route path="/" exact component={Index} />
<Route path="/home" exact component={Index} />
{/* <Route path="/" exact component={Index} />
<Route path="/home" exact component={Index} /> */}
<Route
path="/movies"
render={(props) => <MovieList {...props} setMovieState={this.setMovieState} movies={this.state.movies} onSelectMovieCallback={this.onSelectMovie} isAuthed={true} />}
@@ -132,8 +124,8 @@ class App extends Component {
path="/customers"
render={(props) => <CustomerList {...props} onSelectCustomer={this.onSelectCustomer} isAuthed={true} />}
/>
<Route path="/search/"
render={(props) => <Search {...props} setMovieState={this.setMovieState} movieLookUp={this.movieLookUp} />}
<Route path="/search/"
render={(props) => <Search {...props} setMovieState={this.setMovieState} movieLookUp={this.movieLookUp} />}
/>
</div>
</Router>
2 changes: 1 addition & 1 deletion src/components/Movie.js
Original file line number Diff line number Diff line change
@@ -19,7 +19,7 @@ class Movie extends Component {
<p className="card-title"><strong>{title}</strong></p>
<p className="card-subtitle mb-2 text-muted">{parseInt(release_date)}</p>
<button
class="btn btn-primary"
className="btn btn-primary"
onClick={this.onClickButton}
>Select Movie
</button>
1 change: 0 additions & 1 deletion src/components/Search.js
Original file line number Diff line number Diff line change
@@ -51,7 +51,6 @@ class Search extends Component {
});

return this.state.queryResults.map((movie) => {
console.log(`${movie.title}: ${this.props.movieLookUp(movie.id)}`)
return (

<div className="card">
1 change: 0 additions & 1 deletion src/components/Select.js
Original file line number Diff line number Diff line change
@@ -8,7 +8,6 @@ const Select = (props) => {
const { onCheckoutMovie, movie, customer} = props;
const onRentalClick = () => {
onCheckoutMovie(customer, movie);
console.log('Rent Movie');
}

return (