delete a user

src/App.js

@@ -54,6 +54,12 @@ class App extends Component {
 		})
 	}
 
+	deleteLogin = (login) => {
+		this.setState({
+			logins: this.state.logins.filter(elem => elem !== login)
+		})
+	}
+
 	render() {
 		const { currentTimeFormatState, messages, logins } = this.state;
 		return (
@@ -85,7 +91,10 @@ class App extends Component {
 								<label for="exampleInputEmail1">Current students:</label>
 							</div>
 							<div class="row">
-								<StudentsList logins={logins} />
+								<StudentsList
+									logins={logins}
+									handleClick={(this.deleteLogin)}
+								/>
 							</div>
 						</div>
 

src/HOC/withFetchData.js

@@ -16,7 +16,7 @@ export default WrappedComponent => {
 
         handleFetchPromises = () => {
             const fetchPromises = this.props.logins.map(login => {
-                return fetch(`https://webapplis.utc.fr/Edt_ent_rest/myedt/result/?login=${login}`)
+                return fetch(`https://corsanywhere.herokuapp.com/https://webapplis.utc.fr/Edt_ent_rest/myedt/result/?login=${login}`)
                     .then(res => res.json())
                     .then(res =>
                         (res.map(elem => ({

src/components/LoginInput.js

@@ -28,8 +28,7 @@ export const LoginInput = (props) => {
                             onClick={(e) => {
                                 e.preventDefault();
                                 props.handleClick(inputValue.value)
-                            }
-                            }
+                            }}
                         >
                             Submit
                         </button>

src/components/StudentsList.js

@@ -7,11 +7,29 @@ export const StudentsList = (props) => {
             <>
                 <ul class="list-group" id="studentList">
                     {
-                        logins.map(login => (<li class="list-group-item" key={login}>
-                            {
-                                login
-                            }
-                        </li>))
+                        logins.map(login => (
+                            <div class="row">
+                                <li
+                                    class="list-group-item"
+                                    key={login}
+                                >
+                                    {
+                                        login
+                                    }
+                                </li>
+                                <button
+                                    type="button"
+                                    class="close"
+                                    aria-label="Close"
+                                    onClick={(e) => {
+                                        e.preventDefault();
+                                        props.handleClick(login)
+                                    }}
+                                >
+                                    <span aria-hidden="true">&times;</span>
+                                </button>
+                            </div>
+                        ))
                     }
                 </ul>
             </>