Skip to content

GitLab

Commit 8d994acd authored by Claire PRUDHOMME's avatar Claire PRUDHOMME
Browse files

Bug react-router react-md

parent 99eaa729
Hide whitespace changes
Inline Side-by-side
Showing with 91 additions and 126 deletions
package-lock.json
View file @ 8d994acd
......@@ -34,11 +34,11 @@
}
},
"@babel/generator": {
"version": "7.3.0",
"resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.3.0.tgz",
"integrity": "sha512-dZTwMvTgWfhmibq4V9X+LMf6Bgl7zAodRn9PvcPdhlzFMbvUutx74dbEv7Atz3ToeEpevYEJtAwfxq/bDCzHWg==",
"version": "7.3.2",
"resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.3.2.tgz",
"integrity": "sha512-f3QCuPppXxtZOEm5GWPra/uYUjmNQlu9pbAD8D/9jze4pTY83rTtB1igTBSwvkeNlC5gR24zFFkz+2WHLFQhqQ==",
"requires": {
"@babel/types": "^7.3.0",
"@babel/types": "^7.3.2",
"jsesc": "^2.5.1",
"lodash": "^4.17.10",
"source-map": "^0.5.0",
......@@ -248,9 +248,9 @@
}
},
"@babel/parser": {
"version": "7.3.1",
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.3.1.tgz",
"integrity": "sha512-ATz6yX/L8LEnC3dtLQnIx4ydcPxhLcoy9Vl6re00zb2w5lG6itY6Vhnr1KFRPq/FHNsgl/gh2mjNN20f9iJTTA=="
"version": "7.3.2",
"resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.3.2.tgz",
"integrity": "sha512-QzNUC2RO1gadg+fs21fi0Uu0OuGNzRKEmgCxoLNzbCdoprLwjfmZwzUrpUNfJPaVRwBpDY47A17yYEGWyRelnQ=="
},
"@babel/plugin-proposal-async-generator-functions": {
"version": "7.2.0",
......@@ -296,9 +296,9 @@
}
},
"@babel/plugin-proposal-object-rest-spread": {
"version": "7.3.1",
"resolved": "https://registry.npmjs.org/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.3.1.tgz",
"integrity": "sha512-Nmmv1+3LqxJu/V5jU9vJmxR/KIRWFk2qLHmbB56yRRRFhlaSuOVXscX3gUmhaKgUhzA3otOHVubbIEVYsZ0eZg==",
"version": "7.3.2",
"resolved": "https://registry.npmjs.org/@babel/plugin-proposal-object-rest-spread/-/plugin-proposal-object-rest-spread-7.3.2.tgz",
"integrity": "sha512-DjeMS+J2+lpANkYLLO+m6GjoTMygYglKmRe6cDTbFv3L9i6mmiE8fe6B8MtCSLZpVXscD5kn7s6SgtHrDoBWoA==",
"requires": {
"@babel/helper-plugin-utils": "^7.0.0",
"@babel/plugin-syntax-object-rest-spread": "^7.2.0"
......@@ -462,9 +462,9 @@
}
},
"@babel/plugin-transform-destructuring": {
"version": "7.2.0",
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.2.0.tgz",
"integrity": "sha512-coVO2Ayv7g0qdDbrNiadE4bU7lvCd9H539m2gMknyVjjMdwF/iCOM7R+E8PkntoqLkltO0rk+3axhpp/0v68VQ==",
"version": "7.3.2",
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-destructuring/-/plugin-transform-destructuring-7.3.2.tgz",
"integrity": "sha512-Lrj/u53Ufqxl/sGxyjsJ2XNtNuEjDyjpqdhMNh5aZ+XFOdThL46KBj27Uem4ggoezSYBxKWAil6Hu8HtwqesYw==",
"requires": {
"@babel/helper-plugin-utils": "^7.0.0"
}
......@@ -709,9 +709,9 @@
}
},
"@babel/plugin-transform-typescript": {
"version": "7.2.0",
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.2.0.tgz",
"integrity": "sha512-EnI7i2/gJ7ZNr2MuyvN2Hu+BHJENlxWte5XygPvfj/MbvtOkWor9zcnHpMMQL2YYaaCcqtIvJUyJ7QVfoGs7ew==",
"version": "7.3.2",
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-typescript/-/plugin-transform-typescript-7.3.2.tgz",
"integrity": "sha512-Pvco0x0ZSCnexJnshMfaibQ5hnK8aUHSvjCQhC1JR8eeg+iBwt0AtCO7gWxJ358zZevuf9wPSO5rv+WJcbHPXQ==",
"requires": {
"@babel/helper-plugin-utils": "^7.0.0",
"@babel/plugin-syntax-typescript": "^7.2.0"
......@@ -840,9 +840,9 @@
}
},
"@babel/types": {
"version": "7.3.0",
"resolved": "https://registry.npmjs.org/@babel/types/-/types-7.3.0.tgz",
"integrity": "sha512-QkFPw68QqWU1/RVPyBe8SO7lXbPfjtqAxRYQKpFpaB8yMq7X2qAqfwK5LKoQufEkSmO5NQ70O6Kc3Afk03RwXw==",
"version": "7.3.2",
"resolved": "https://registry.npmjs.org/@babel/types/-/types-7.3.2.tgz",
"integrity": "sha512-3Y6H8xlUlpbGR+XvawiH0UXehqydTmNmEpozWcXymqwcrwYAl5KMvKtQ+TF6f6E08V6Jur7v/ykdDSF+WDEIXQ==",
"requires": {
"esutils": "^2.0.2",
"lodash": "^4.17.10",
......@@ -1094,9 +1094,9 @@
}
},
"acorn": {
"version": "6.0.7",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-6.0.7.tgz",
"integrity": "sha512-HNJNgE60C9eOTgn974Tlp3dpLZdUr+SoxxDwPaY9J/kDNOLQTkaDgwBUXAF4SSsrAwD9RpdxuHK/EbuF+W9Ahw=="
"version": "6.1.0",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-6.1.0.tgz",
"integrity": "sha512-MW/FjM+IvU9CgBzjO3UIPCE2pyEwUsoFl+VGdczOPEdxfGFjuKny/gN54mOuX7Qxmb9Rg9MCn2oKiSUeW+pjrw=="
},
"acorn-dynamic-import": {
"version": "3.0.0",
......@@ -2727,9 +2727,9 @@
}
},
"caniuse-lite": {
"version": "1.0.30000934",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000934.tgz",
"integrity": "sha512-o7yfZn0R9N+mWAuksDsdLsb1gu9o//XK0QSU0zSSReKNRsXsFc/n/psxi0YSPNiqlKxImp5h4DHnAPdwYJ8nNA=="
"version": "1.0.30000935",
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000935.tgz",
"integrity": "sha512-1Y2uJ5y56qDt3jsDTdBHL1OqiImzjoQcBG6Yl3Qizq8mcc2SgCFpi+ZwLLqkztYnk9l87IYqRlNBnPSOTbFkXQ=="
},
"capture-exit": {
"version": "1.2.0",
......@@ -3221,9 +3221,9 @@
"integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40="
},
"core-js": {
"version": "2.6.3",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.3.tgz",
"integrity": "sha512-l00tmFFZOBHtYhN4Cz7k32VM7vTn3rE2ANjQDxdEN6zmXZ/xq1jQuutnmHvMG1ZJ7xd72+TA5YpUK8wz3rWsfQ=="
"version": "2.6.4",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.4.tgz",
"integrity": "sha512-05qQ5hXShcqGkPZpXEFLIpxayZscVD2kuMBZewxiIPPEagukO4mqgPA9CWhUvFBJfy3ODdK2p9xyHh7FTU9/7A=="
},
"core-util-is": {
"version": "1.0.2",
......@@ -3699,9 +3699,9 @@
}
},
"cssom": {
"version": "0.3.4",
"resolved": "https://registry.npmjs.org/cssom/-/cssom-0.3.4.tgz",
"integrity": "sha512-+7prCSORpXNeR4/fUP3rL+TzqtiFfhMvTd7uEqMdgPvLPt4+uzFUeufx5RHjGTACCargg/DiEt/moMQmvnfkog=="
"version": "0.3.6",
"resolved": "https://registry.npmjs.org/cssom/-/cssom-0.3.6.tgz",
"integrity": "sha512-DtUeseGk9/GBW0hl0vVPpU22iHL6YB5BUX7ml1hB+GMpo0NX5G4voX3kdWiMSEguFtcW3Vh3djqNF4aIe6ne0A=="
},
"cssstyle": {
"version": "1.1.1",
......@@ -4137,26 +4137,14 @@
"integrity": "sha1-rOb/gIwc5mtX0ev5eXessCM0z8E="
},
"duplexify": {
"version": "3.7.0",
"resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.7.0.tgz",
"integrity": "sha512-+PSTXcTZi+Ez+AkJNYzxWvncsmelRzwrAbGF6Y/RNSK9BmnTVEOFVoYSXDHizQUQe3SSerq0YoS3utU7TUfeHg==",
"version": "3.7.1",
"resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.7.1.tgz",
"integrity": "sha512-07z8uv2wMyS51kKhD1KsdXJg5WQ6t93RneqRxUHnskXVtlYYkLqM0gqStQZ3pj073g687jPCHrqNfCzawLYh5g==",
"requires": {
"end-of-stream": "^1.4.1",
"inherits": "^2.0.3",
"readable-stream": "^3.1.1",
"end-of-stream": "^1.0.0",
"inherits": "^2.0.1",
"readable-stream": "^2.0.0",
"stream-shift": "^1.0.0"
},
"dependencies": {
"readable-stream": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.1.1.tgz",
"integrity": "sha512-DkN66hPyqDhnIQ6Jcsvx9bFjhw214O4poMBcIMgPVpQvNy9a0e0Uhg5SqySyDKAmUlwt8LonTBz1ezOnM8pUdA==",
"requires": {
"inherits": "^2.0.3",
"string_decoder": "^1.1.1",
"util-deprecate": "^1.0.1"
}
}
}
},
"ecc-jsbn": {
......@@ -5373,24 +5361,12 @@
"integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I="
},
"flush-write-stream": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/flush-write-stream/-/flush-write-stream-1.1.0.tgz",
"integrity": "sha512-6MHED/cmsyux1G4/Cek2Z776y9t7WCNd3h2h/HW91vFeU7pzMhA8XvAlDhHcanG5IWuIh/xcC7JASY4WQpG6xg==",
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/flush-write-stream/-/flush-write-stream-1.1.1.tgz",
"integrity": "sha512-3Z4XhFZ3992uIq0XOqb9AreonueSYphE6oYbpt5+3u06JWklbsPkNv3ZKkP9Bz/r+1MWCaMoSQ28P85+1Yc77w==",
"requires": {
"inherits": "^2.0.3",
"readable-stream": "^3.1.1"
},
"dependencies": {
"readable-stream": {
"version": "3.1.1",
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.1.1.tgz",
"integrity": "sha512-DkN66hPyqDhnIQ6Jcsvx9bFjhw214O4poMBcIMgPVpQvNy9a0e0Uhg5SqySyDKAmUlwt8LonTBz1ezOnM8pUdA==",
"requires": {
"inherits": "^2.0.3",
"string_decoder": "^1.1.1",
"util-deprecate": "^1.0.1"
}
}
"readable-stream": "^2.3.6"
}
},
"follow-redirects": {
......@@ -6542,9 +6518,9 @@
"integrity": "sha512-d4sze1JNC454Wdo2fkuyzCr6aHcbL6PGGuFAz0Li/NcOm1tCHGnWDRmJP85dh9IhQErTc2svWFEX5xHIOo//kQ=="
},
"handlebars": {
"version": "4.0.12",
"resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.0.12.tgz",
"integrity": "sha512-RhmTekP+FZL+XNhwS1Wf+bTTZpdLougwt5pcgA1tuz6Jcx0fpH/7z0qd71RKnZHBCxIRBHfBOnio4gViPemNzA==",
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.1.0.tgz",
"integrity": "sha512-l2jRuU1NAWK6AW5qqcTATWQJvNPEwkM7NEKSiv/gqOsoSQbVoWyqVEY5GS+XPQ88zLNmqASRpzfdm8d79hJS+w==",
"requires": {
"async": "^2.5.0",
"optimist": "^0.6.1",
......@@ -16666,9 +16642,9 @@
}
},
"terser": {
"version": "3.16.0",
"resolved": "https://registry.npmjs.org/terser/-/terser-3.16.0.tgz",
"integrity": "sha512-Ua8BhyibmsQBFXDZZ3Es7GASB2yFrQJr0jgAlZK1FBLbFarrHoCuMHPCro5MbX4jidcaFGiV+uTc3wxodmGjUg==",
"version": "3.16.1",
"resolved": "https://registry.npmjs.org/terser/-/terser-3.16.1.tgz",
"integrity": "sha512-JDJjgleBROeek2iBcSNzOHLKsB/MdDf+E/BOAJ0Tk9r7p9/fVobfv7LMJ/g/k3v9SXdmjZnIlFd5nfn/Rt0Xow==",
"requires": {
"commander": "~2.17.1",
"source-map": "~0.6.1",
......
src/App.js
View file @ 8d994acd
import React, { Component } from 'react';
import './App.css';
//import './App.css';
import { NavigationDrawer, ListItem } from 'react-md';
import IngredientsContainer from './containers/IngredientsContainer.js'
import { BrowserRouter as Router, Route, Link } from "react-router-dom";
// import IngredientsContainer from './containers/IngredientsContainer.js'
import { BrowserRouter as Router, Route, Link, withRouter, Switch } from "react-router-dom";
const Home = () => (
<div>Bidule</div>
);
const NavItemLink = ({to, label}) => (
<Route path={to} >
{() => {
const IngredientsContainer = () => (
<div>Truc</div>
);
const NavItemLink = ({to, label}) => {
return (
<ListItem
component={Link}
......@@ -19,10 +21,7 @@ const NavItemLink = ({to, label}) => (
primaryText={label}
/>
);
}}
</Route>
)
}
class App extends Component {
......@@ -39,9 +38,10 @@ class App extends Component {
<NavItemLink to = "/ingredients" label = "Ingredients" key = "ingredients"/>
]}
>
<Route exact path="/" component={Home} />
<Route exact path="/ingredients" component={IngredientsContainer} />
<Switch>
<Route exact path="/" component={withRouter(Home)} />
<Route path="/ingredients" component={withRouter(IngredientsContainer)} />
</Switch>
</NavigationDrawer>
</Router>
......
src/components/IngredientLine.js
View file @ 8d994acd
......@@ -13,22 +13,20 @@ class IngredientLine extends Component {
this.state = { edit: false, name: "" };
}
handleEdit(id) {
handleEdit = function(id) {
this.props.handleEdit({"name":this.state.name, "id":id})
this.setState({edit:false})
this.props.refresh()
}
handleDelete(id) {
handleDelete = function(id) {
this.props.handleDelete(id)
this.props.refresh()
}
render() {
let {name, id} = this.props
return <TableRow selectable = {false} key = {name + "row"}>
<TableColumn key = {name}>
<TableColumn key = {id}>
{!this.state.edit && name }
{this.state.edit && <TextField id="Name"
placeholder = {name}
......@@ -43,7 +41,7 @@ class IngredientLine extends Component {
</TableColumn>
<TableColumn key = {name + "icons"}>
<Button icon primary onClick ={ () => {this.setState({edit : !this.state.edit})} }>edit</Button>
<Button icon secondary onClick ={ () => this.handleDelete(id) }>delete</Button>
<Button icon secondary onClick ={ () => {this.handleDelete(id)} }>delete</Button>
</TableColumn>
</TableRow>
}
......
src/components/IngredientList.js
View file @ 8d994acd
......@@ -20,19 +20,10 @@ class IngredientList extends Component {
name: ""
};
};
handleDelete = (id) => {
this.props.handleDelete(id)
}
handleCreate = () => {
this.props.handleCreate(this.state.name)
this.setState({edit:false})
this.props.refresh()
}
handleEdit = (ingredient) => {
this.props.handleEdit(ingredient)
}
render() {
......@@ -56,9 +47,8 @@ class IngredientList extends Component {
return <IngredientLine
name = {t.name}
id = {t.id}
handleDelete = {this.handleDelete}
handleEdit = {this.handleEdit}
refresh = {this.props.refresh}
handleDelete = {this.props.handleDelete}
handleEdit = {this.props.handleEdit}
key={t.id}
/>
})
......
src/containers/IngredientsContainer.js
View file @ 8d994acd
import React, { Component } from 'react';
import { Grid } from 'react-md';
import IngredientList from '../components/IngredientList.js'
import {withRouter} from 'react-router'
class IngredientsContainer extends Component {
constructor() {
......@@ -12,56 +13,57 @@ class IngredientsContainer extends Component {
this.getAllIngredients()
}
incRefresh = () => {
console.log("I'm so fresh")
this.setState(
(prevState, props) => ({ countRefresh: prevState.countRefresh + 1 })
)
}
createIngredient(name) {
return fetch(`http://10.0.1.9:8080/api/v1/ingredients/`,
createIngredient = (name) => {
fetch(`http://10.0.1.9:8080/api/v1/ingredients/`,
{
method: "post",
headers : {"Content-Type" : "application/json"},
body : name
}
)
}
).then(
this.getAllIngredients()
).catch(error => console.log(error))
}
getAllIngredients() {
return fetch(`http://10.0.1.9:8080/api/v1/ingredients`)
.then(result=> {
console.log("Get all")
fetch(`http://10.0.1.9:8080/api/v1/ingredients`)
.then(result => {
result.json()
.then(items =>
{
this.setState((state) => state.items = {items})
this.setState({items : items})
}
)
}
).catch(error => console.log(error))
}
deleteIngredientById(id) {
return fetch(`http://10.0.1.9:8080/api/v1/ingredients/${id}`,
deleteIngredientById = (id) => {
fetch(`http://10.0.1.9:8080/api/v1/ingredients/${id}`,
{
method: "delete",
}
)
).then(() => {
this.getAllIngredients()
}
).catch(error => console.log(error))
}
editIngredient(updatedIngredient) {
return fetch(`http://10.0.1.9:8080/api/v1/ingredients/`,
editIngredient = (updatedIngredient) => {
fetch(`http://10.0.1.9:8080/api/v1/ingredients/`,
{
method: "PATCH",
headers : {"Content-Type" : "application/json"},
body : JSON.stringify(updatedIngredient)
}
)
).then(
this.getAllIngredients()
).catch(error => console.log(error))
}
render() {
console.log("render is triggered")
return (
<div>
......@@ -71,7 +73,6 @@ class IngredientsContainer extends Component {
handleEdit = {this.editIngredient}
handleDelete = {this.deleteIngredientById}
handleCreate = {this.createIngredient}
refresh = {this.incRefresh}
/>
</Grid>
......@@ -81,4 +82,4 @@ class IngredientsContainer extends Component {
}
export default IngredientsContainer;
export default withRouter(IngredientsContainer);
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment