Skip to content

Commit

Permalink
Removed completed code
Browse files Browse the repository at this point in the history
  • Loading branch information
@andrewwestenskow
andrewwestenskow committed May 15, 2020
1 parent 6852b71 commit 531df60
Showing 1 changed file with 65 additions and 90 deletions.
155 changes: 65 additions & 90 deletions src/App.js
View file
Original file line number Diff line number Diff line change
@@ -1,42 +1,36 @@
import React, { Component } from 'react';
import logo from './mainStreetAuto.svg';
import axios from 'axios';
import './App.css';
import React, { Component } from 'react'
import logo from './mainStreetAuto.svg'
import axios from 'axios'
import './App.css'

// Toast notification dependencies
import { ToastContainer, toast } from 'react-toastify';
import { ToastContainer, toast } from 'react-toastify'

class App extends Component {
constructor(props) {
super(props);
super(props)

this.state = {
vehiclesToDisplay: [],
buyersToDisplay: []
};

this.getVehicles = this.getVehicles.bind(this);
this.getPotentialBuyers = this.getPotentialBuyers.bind(this);
this.sellCar = this.sellCar.bind(this);
this.addCar = this.addCar.bind(this);
this.filterByColor = this.filterByColor.bind(this);
this.filterByMake = this.filterByMake.bind(this);
this.addBuyer = this.addBuyer.bind(this);
this.nameSearch = this.nameSearch.bind(this);
this.resetData = this.resetData.bind(this);
this.byYear = this.byYear.bind(this);
this.deleteBuyer = this.deleteBuyer.bind(this);
buyersToDisplay: [],
}

this.getVehicles = this.getVehicles.bind(this)
this.getPotentialBuyers = this.getPotentialBuyers.bind(this)
this.sellCar = this.sellCar.bind(this)
this.addCar = this.addCar.bind(this)
this.filterByColor = this.filterByColor.bind(this)
this.filterByMake = this.filterByMake.bind(this)
this.addBuyer = this.addBuyer.bind(this)
this.nameSearch = this.nameSearch.bind(this)
this.resetData = this.resetData.bind(this)
this.byYear = this.byYear.bind(this)
this.deleteBuyer = this.deleteBuyer.bind(this)
}

getVehicles() {
// axios (GET)
// setState with response -> vehiclesToDisplay
axios.get('https://joes-autos.herokuapp.com/api/vehicles')
.then(response => {
toast.success('Got all vehicles')
this.setState({vehiclesToDisplay: response.data})
})
.catch(() => toast.error('Failed to get vehicles'))
}

getPotentialBuyers() {
Expand All @@ -47,23 +41,17 @@ class App extends Component {
sellCar(id) {
// axios (DELETE)
// setState with response -> vehiclesToDisplay
axios.delete(`https://joes-autos.herokuapp.com/api/vehicles/${id}`)
.then(response => {
toast.success('Sold car')
this.setState({vehiclesToDisplay: response.data.vehicles})
})
.catch(() => toast.error('Failed to sell car'))
}

filterByMake() {
let make = this.selectedMake.value;
let make = this.selectedMake.value

// axios (GET)
// setState with response -> vehiclesToDisplay
}

filterByColor() {
let color = this.selectedColor.value;
let color = this.selectedColor.value

// axios (GET)
// setState with response -> vehiclesToDisplay
Expand All @@ -72,12 +60,6 @@ class App extends Component {
updatePrice(priceChange, id) {
// axios (PUT)
// setState with response -> vehiclesToDisplay
axios.put(`https://joes-autos.herokuapp.com/api/vehicles/${id}/${priceChange}`)
.then(response => {
toast.success('Updated Price')
this.setState({vehiclesToDisplay: response.data.vehicles})
})
.catch(() => toast.error('Failed to update price'))
}

addCar() {
Expand All @@ -86,25 +68,19 @@ class App extends Component {
model: this.model.value,
color: this.color.value,
year: this.year.value,
price: this.price.value
};
price: this.price.value,
}

// axios (POST)
// setState with response -> vehiclesToDisplay
axios.post('https://joes-autos.herokuapp.com/api/vehicles', newCar)
.then(response => {
toast.success('Added car')
this.setState({vehiclesToDisplay: response.data.vehicles})
})
.catch(() => toast.error('Failed to add car'))
}

addBuyer() {
let newBuyer = {
name: this.name.value,
phone: this.phone.value,
address: this.address.value
};
address: this.address.value,
}

//axios (POST)
// setState with response -> buyersToDisplay
Expand All @@ -116,14 +92,13 @@ class App extends Component {
}

nameSearch() {
let searchLetters = this.searchLetters.value;

let searchLetters = this.searchLetters.value
// axios (GET)
// setState with response -> buyersToDisplay
}

byYear() {
let year = this.searchYear.value;
let year = this.searchYear.value

// axios (GET)
// setState with response -> vehiclesToDisplay
Expand All @@ -133,18 +108,18 @@ class App extends Component {
resetData(dataToReset) {
axios
.get('https://joes-autos.herokuapp.com/api/' + dataToReset + '/reset')
.then(res => {
.then((res) => {
if (dataToReset === 'vehicles') {
this.setState({ vehiclesToDisplay: res.data.vehicles });
this.setState({ vehiclesToDisplay: res.data.vehicles })
} else {
this.setState({ buyersToDisplay: res.data.buyers });
this.setState({ buyersToDisplay: res.data.buyers })
}
});
})
}
// Do not edit the code above

render() {
const vehicles = this.state.vehiclesToDisplay.map(v => {
const vehicles = this.state.vehiclesToDisplay.map((v) => {
return (
<div key={v.id}>
<p>Make: {v.make}</p>
Expand Down Expand Up @@ -173,10 +148,10 @@ class App extends Component {

<hr className="hr" />
</div>
);
});
)
})

const buyers = this.state.buyersToDisplay.map(person => {
const buyers = this.state.buyersToDisplay.map((person) => {
return (
<div key={person.id}>
<p>Name: {person.name}</p>
Expand All @@ -186,16 +161,16 @@ class App extends Component {
<button
className="btn"
onClick={() => {
this.deleteBuyer(person.id);
this.deleteBuyer(person.id)
}}
>
No longer interested
</button>

<hr className="hr" />
</div>
);
});
)
})

return (
<div>
Expand Down Expand Up @@ -226,8 +201,8 @@ class App extends Component {

<select
onChange={this.filterByMake}
ref={selectedMake => {
this.selectedMake = selectedMake;
ref={(selectedMake) => {
this.selectedMake = selectedMake
}}
className="btn-sp"
value=""
Expand All @@ -247,8 +222,8 @@ class App extends Component {
</select>

<select
ref={selectedColor => {
this.selectedColor = selectedColor;
ref={(selectedColor) => {
this.selectedColor = selectedColor
}}
onChange={this.filterByColor}
className="btn-sp"
Expand All @@ -269,14 +244,14 @@ class App extends Component {
onChange={this.nameSearch}
placeholder="Search by name"
type="text"
ref={searchLetters => {
this.searchLetters = searchLetters;
ref={(searchLetters) => {
this.searchLetters = searchLetters
}}
/>

<input
ref={searchYear => {
this.searchYear = searchYear;
ref={(searchYear) => {
this.searchYear = searchYear
}}
className="btn-sp"
type="number"
Expand All @@ -298,38 +273,38 @@ class App extends Component {
<input
className="btn-sp"
placeholder="make"
ref={make => {
this.make = make;
ref={(make) => {
this.make = make
}}
/>
<input
className="btn-sp"
placeholder="model"
ref={model => {
this.model = model;
ref={(model) => {
this.model = model
}}
/>
<input
type="number"
className="btn-sp"
placeholder="year"
ref={year => {
this.year = year;
ref={(year) => {
this.year = year
}}
/>
<input
className="btn-sp"
placeholder="color"
ref={color => {
this.color = color;
ref={(color) => {
this.color = color
}}
/>
<input
type="number"
className="btn-sp"
placeholder="price"
ref={price => {
this.price = price;
ref={(price) => {
this.price = price
}}
/>

Expand All @@ -342,22 +317,22 @@ class App extends Component {
<input
className="btn-sp"
placeholder="name"
ref={name => {
this.name = name;
ref={(name) => {
this.name = name
}}
/>
<input
className="btn-sp"
placeholder="phone"
ref={phone => {
this.phone = phone;
ref={(phone) => {
this.phone = phone
}}
/>
<input
className="btn-sp"
placeholder="address"
ref={address => {
this.address = address;
ref={(address) => {
this.address = address
}}
/>

Expand All @@ -380,8 +355,8 @@ class App extends Component {
</section>
</main>
</div>
);
)
}
}

export default App;
export default App

0 comments on commit 531df60

Please sign in to comment.