From 37c08696c10bd01e44d113b15eea6ba58b26e457 Mon Sep 17 00:00:00 2001
From: STEINMETZ THOMAS <thomas.steinmetz2@etu.unistra.fr>
Date: Wed, 17 Nov 2021 13:24:06 +0100
Subject: [PATCH] :sparkles: #7 add privacy page
---
backend/package.json | 2 +-
frontend/src/App.js | 4 +-
frontend/src/containers/Bank.container.js | 15 +-
frontend/src/containers/Login.container.js | 13 +-
frontend/src/containers/Privacy.container.js | 63 +++++++
frontend/src/containers/Profile.container.js | 17 +-
frontend/src/containers/SignUp.container.js | 176 ++++++++++---------
frontend/src/containers/Users.container.js | 12 +-
8 files changed, 210 insertions(+), 92 deletions(-)
create mode 100644 frontend/src/containers/Privacy.container.js
diff --git a/backend/package.json b/backend/package.json
index de6c169..ce207e9 100644
--- a/backend/package.json
+++ b/backend/package.json
@@ -13,7 +13,7 @@
"cookie-parser": "~1.4.4",
"debug": "~2.6.9",
"express": "~4.16.1",
- "http-errors": "~1.6.3",
+ "http-errors": "^1.6.3",
"jsonwebtoken": "^8.5.1",
"moment": "^2.29.1",
"mongoose": "^5.7.5",
diff --git a/frontend/src/App.js b/frontend/src/App.js
index 8ee5b9f..1b71b85 100644
--- a/frontend/src/App.js
+++ b/frontend/src/App.js
@@ -5,6 +5,7 @@ import {BrowserRouter as Router, Route, Link, Redirect} from "react-router-dom";
import Users from './containers/Users.container';
import SignUp from './containers/SignUp.container';
import Login from './containers/Login.container';
+import Privacy from './containers/Privacy.container'
import Profile from './containers/Profile.container';
import Bank from './containers/Bank.container';
import { Navbar, Nav, Modal, Button } from 'react-bootstrap';
@@ -66,7 +67,7 @@ class App extends Component {
</Nav.Link>
}
</Nav>
-
+
{this.props.loginState.loggedIn &&
<Navbar.Collapse className="justify-content-end">
<Navbar.Text>
@@ -103,6 +104,7 @@ class App extends Component {
<Route path="/" exact component={Users} />
<Route path="/signup/" component={SignUp} />
<Route path="/login/" component={Login} />
+ <Route path="/privacy/" component={Privacy} />
<PrivateRoute path="/profile/" component={Profile} />
<PrivateRoute path="/bank/" component={Bank} />
</div>
diff --git a/frontend/src/containers/Bank.container.js b/frontend/src/containers/Bank.container.js
index 349fdfe..fcf6f03 100644
--- a/frontend/src/containers/Bank.container.js
+++ b/frontend/src/containers/Bank.container.js
@@ -3,8 +3,10 @@ import React from 'react';
import logo_trans from '../icons/transaction.png';
import logo_money from '../icons/dollar.png';
import { withRouter } from 'react-router-dom'
-import { Table, Button, Card, Image, Row, Col } from "react-bootstrap";
+import { Table, Button, Card, Image, Row, Col, Nav } from "react-bootstrap";
import * as bankActions from "../actions/Bank.actions";
+import { Link} from "react-router-dom";
+
export class Bank extends React.Component {
@@ -15,7 +17,7 @@ export class Bank extends React.Component {
readOnly: true
};
- this.switchToEditionMode = this.switchToEditionMode.bind(this);
+ this.switchToEditionMode = this.switchToEditionMode.bind(this);
}
componentWillMount(){
@@ -50,6 +52,7 @@ export class Bank extends React.Component {
render() {
return (
+ <div>
<Row style={{ width: '95%', margin: '0 auto', marginTop:'30px' }}>
<Col xs lg="4">
<Card className="block-example border border-dark" style={{ width: '100%', margin: '0 auto', marginTop:'200px', border:'none', textAlign: "center"}}>
@@ -94,6 +97,14 @@ export class Bank extends React.Component {
{this.props.state.updateUserError && <div><br/>{JSON.stringify(this.props.state.updateUserErrorMessage.message)}</div>}
{this.props.state.updateUserSuccess && <div><br/>Success! You can now use your new password.</div>}
</Row>
+ <footer class="footer mt-auto">
+ <div class="container" style={{ textAlign : "center"}}>
+ <Nav.Link as={Link} to="/privacy/">
+ Politique de confidentialité
+ </Nav.Link>
+ </div>
+ </footer>
+ </div>
);
}
}
diff --git a/frontend/src/containers/Login.container.js b/frontend/src/containers/Login.container.js
index 31f6005..331c57e 100644
--- a/frontend/src/containers/Login.container.js
+++ b/frontend/src/containers/Login.container.js
@@ -2,7 +2,9 @@ import { connect } from 'react-redux';
import React from 'react';
import { withRouter } from 'react-router-dom'
import * as loginActions from '../actions/Login.actions';
-import { Form, Button, Card } from "react-bootstrap";
+import { Form, Button, Card, Nav } from "react-bootstrap";
+import { Link} from "react-router-dom";
+
export class Login extends React.Component {
@@ -38,6 +40,7 @@ export class Login extends React.Component {
render() {
return (
+ <div>
<Card style={{ width: '18rem', margin: '0 auto', marginTop:'30px' }}>
<Card.Body>
<Card.Title>Se connecter</Card.Title>
@@ -72,6 +75,14 @@ export class Login extends React.Component {
</Form>
</Card.Body>
</Card>
+ <footer class="footer mt-auto py-3" >
+ <div class="container" style={{ textAlign : "center"}}>
+ <Nav.Link as={Link} to="/privacy/">
+ Politique de confidentialité
+ </Nav.Link>
+ </div>
+ </footer>
+ </div>
);
}
}
diff --git a/frontend/src/containers/Privacy.container.js b/frontend/src/containers/Privacy.container.js
new file mode 100644
index 0000000..0fa7d0c
--- /dev/null
+++ b/frontend/src/containers/Privacy.container.js
@@ -0,0 +1,63 @@
+import React from 'react';
+import { withRouter } from 'react-router-dom'
+
+
+export class Privacy extends React.Component {
+
+ render() {
+ return (
+ <div>
+ <h1>
+ Politique de confidentialité
+ </h1>
+ <p>
+ Date d'entrée en vigueur : 17 novembre 2021
+
+Cette page vous informe de nos politiques concernant la collecte, l'utilisation et la divulgation des données personnelles lorsque vous utilisez notre Service et les choix que vous avez associés à ces données.
+
+Nous utilisons vos données pour fournir et améliorer le Service. En utilisant le Service, vous acceptez la collecte et l'utilisation des informations conformément à cette politique. Sauf indication contraire dans la présente politique de confidentialité, les termes utilisés dans cette politique de confidentialité ont la même signification que dans nos conditions générales.
+
+ </p>
+ <h2>Collecte et utilisation des informations</h2>
+ <p>Nous collectons différents types d'informations à diverses fins pour vous fournir et améliorer notre Service.</p>
+ <h3>Types de données collectées</h3>
+ <h4>Données personnelles</h4>
+ <p>Lors de l'utilisation de notre Service, nous pouvons vous demander de nous fournir certaines informations personnellement identifiables qui peuvent être utilisées pour vous contacter ou vous identifier (« Données personnelles »). Informations personnellement identifiables :
+Adresse e-mail
+Pseudo
+Prénom
+Nom
+Date de naissance
+Numéro étudiant
+Photo
+ </p>
+ <h2>Divulgation de données</h2>
+ <h3>Exigences légales</h3>
+ <p>Jad Joubran BV peut divulguer vos données personnelles en croyant de bonne foi qu'une telle action est nécessaire pour :
+
+Pour se conformer à une obligation légale
+Protéger et défendre les droits ou la propriété de Jad Joubran BV
+Pour prévenir ou enquêter sur d'éventuels actes répréhensibles en rapport avec le Service
+Pour protéger la sécurité personnelle des utilisateurs du Service ou du public
+Pour se protéger contre la responsabilité légale</p>
+
+ <h2>Sécurité des données</h2>
+ <p>La sécurité de vos données est importante pour nous, mais n'oubliez pas qu'aucune méthode de transmission sur Internet ou méthode de stockage électronique n'est sécurisée à 100 %. Bien que nous nous efforcions d'utiliser des moyens commercialement acceptables pour protéger vos données personnelles, nous ne pouvons garantir leur sécurité absolue.</p>
+ <h2>Modifications de cette politique de confidentialité</h2>
+ <p>Nous pouvons mettre à jour notre politique de confidentialité de temps à autre. Nous vous informerons de tout changement en publiant la nouvelle politique de confidentialité sur cette page.
+
+Nous vous informerons par e-mail et/ou par un avis bien visible sur notre Service, avant que le changement ne prenne effet et nous mettrons à jour la « date d'entrée en vigueur » en haut de la présente Politique de confidentialité.
+
+Il vous est conseillé de consulter périodiquement cette politique de confidentialité pour tout changement. Les modifications apportées à cette politique de confidentialité entrent en vigueur lorsqu'elles sont publiées sur cette page.</p>
+
+ <h2>Nous contacter</h2>
+ <p>Si vous avez des questions sur cette politique de confidentialité, veuillez nous contacter :
+
+Par mail : aius@unistra.fr</p>
+ </div>
+ );
+ }
+}
+
+
+export default withRouter((Privacy))
diff --git a/frontend/src/containers/Profile.container.js b/frontend/src/containers/Profile.container.js
index 2a89c19..d21e982 100644
--- a/frontend/src/containers/Profile.container.js
+++ b/frontend/src/containers/Profile.container.js
@@ -1,8 +1,9 @@
import { connect } from 'react-redux';
import React from 'react';
import { withRouter } from 'react-router-dom'
-import { Form, Button, Card, Image, Container, Row, Col } from "react-bootstrap";
+import { Form, Button, Card, Image, Container, Row, Col, Nav } from "react-bootstrap";
import * as profileActions from "../actions/Profile.actions";
+import {Link} from "react-router-dom";
export class Profile extends React.Component {
@@ -13,7 +14,7 @@ export class Profile extends React.Component {
readOnly: true
};
- this.switchToEditionMode = this.switchToEditionMode.bind(this);
+ this.switchToEditionMode = this.switchToEditionMode.bind(this);
}
componentWillMount(){
@@ -48,6 +49,7 @@ export class Profile extends React.Component {
render() {
return (
+ <div>
<Card style={{ width: '18rem', margin: '0 auto', marginTop:'30px' }}>
<Card.Body>
<Card.Title>Profil</Card.Title>
@@ -155,7 +157,7 @@ export class Profile extends React.Component {
Enregistrer
</Button>
}
- { this.state.readOnly &&
+ { this.state.readOnly &&
<Button
block
onClick={this.switchToEditionMode}
@@ -169,6 +171,15 @@ export class Profile extends React.Component {
{this.props.state.updateUserSuccess && <div><br/>Profil modifié avec succès.</div>}
</Card.Body>
</Card>
+
+ <footer class="footer mt-auto py-3">
+ <div class="container" style={{ textAlign : "center"}}>
+ <Nav.Link as={Link} to="/privacy/">
+ Politique de confidentialité
+ </Nav.Link>
+ </div>
+ </footer>
+ </div>
);
}
}
diff --git a/frontend/src/containers/SignUp.container.js b/frontend/src/containers/SignUp.container.js
index 7e30345..dd3d1c2 100644
--- a/frontend/src/containers/SignUp.container.js
+++ b/frontend/src/containers/SignUp.container.js
@@ -2,7 +2,8 @@ import { connect } from 'react-redux';
import React from 'react';
import { withRouter } from 'react-router-dom'
import * as signupActions from '../actions/SignUp.actions';
-import { Form, Button, Card } from "react-bootstrap";
+import { Form, Button, Card, Nav } from "react-bootstrap";
+import { Link, Redirect} from "react-router-dom";
export class SignUp extends React.Component {
@@ -43,88 +44,97 @@ export class SignUp extends React.Component {
render() {
return (
- <Card style={{ width: '18rem', margin: '0 auto', marginTop:'30px' }}>
- <Card.Body>
- <Card.Title>S'inscrire</Card.Title>
- <Form onSubmit={(e) => this.register(e)}>
- <Form.Group controlId="username">
- <Form.Label>Nom d'utilisatuer</Form.Label>
- <Form.Control
- autoFocus
- type="text"
- value={this.state.username}
- onChange={this.handleChange}
- />
- </Form.Group>
- <Form.Group controlId="firstname">
- <Form.Label>Prénom</Form.Label>
- <Form.Control
- autoFocus
- type="text"
- minLength={1}
- value={this.state.firstname}
- onChange={this.handleChange}
- />
- </Form.Group>
- <Form.Group controlId="lastname">
- <Form.Label>Nom</Form.Label>
- <Form.Control
- autoFocus
- type="text"
- minLength={1}
- value={this.state.lastname}
- onChange={this.handleChange}
- />
- </Form.Group>
- <Form.Group controlId="email">
- <Form.Label>E-mail</Form.Label>
- <Form.Control
- value={this.state.email}
- onChange={this.handleChange}
- type="email"
- />
- </Form.Group>
- <Form.Group controlId="password">
- <Form.Label>Mot de passe</Form.Label>
- <Form.Control
- value={this.state.password}
- onChange={this.handleChange}
- type="password"
- minLength={8}
- />
- </Form.Group>
- <Form.Group controlId="date_birth" bsSize="large">
- <Form.Label>Date d'anniversaire</Form.Label>
- <Form.Control
- type="date"
- value={this.state.date_birth}
- onChange={this.handleChange}
- />
- </Form.Group>
- <Form.Group controlId="student_number">
- <Form.Label>Numéro Etudiant</Form.Label>
- <Form.Control
- type="text"
- minLength={8}
- maxLength={8}
- value={this.state.student_number}
- onChange={this.handleChange}
- />
- </Form.Group>
- <Button
- block
- disabled={!this.validateForm()}
- type="submit"
- variant="primary"
- >
- S'inscrire
- </Button>
- {this.props.state.loading && <div><br/>Veuillez patienter...</div>}
- {this.props.state.error && <div><br/>{JSON.stringify(this.props.state.errorMessage.message)}</div>}
- {this.props.state.success && <div><br/>Vous etes inscrit! Vous pouvez vous connecter.</div>}
- </Form>
- </Card.Body>
- </Card>
+ <div>
+ <Card style={{ width: '18rem', margin: '0 auto', marginTop:'30px' }}>
+ <Card.Body>
+ <Card.Title>S'inscrire</Card.Title>
+ <Form onSubmit={(e) => this.register(e)}>
+ <Form.Group controlId="username">
+ <Form.Label>Nom d'utilisateur</Form.Label>
+ <Form.Control
+ autoFocus
+ type="text"
+ value={this.state.username}
+ onChange={this.handleChange}
+ />
+ </Form.Group>
+ <Form.Group controlId="firstname">
+ <Form.Label>Prénom</Form.Label>
+ <Form.Control
+ autoFocus
+ type="text"
+ minLength={1}
+ value={this.state.firstname}
+ onChange={this.handleChange}
+ />
+ </Form.Group>
+ <Form.Group controlId="lastname">
+ <Form.Label>Nom</Form.Label>
+ <Form.Control
+ autoFocus
+ type="text"
+ minLength={1}
+ value={this.state.lastname}
+ onChange={this.handleChange}
+ />
+ </Form.Group>
+ <Form.Group controlId="email">
+ <Form.Label>E-mail</Form.Label>
+ <Form.Control
+ value={this.state.email}
+ onChange={this.handleChange}
+ type="email"
+ />
+ </Form.Group>
+ <Form.Group controlId="password">
+ <Form.Label>Mot de passe</Form.Label>
+ <Form.Control
+ value={this.state.password}
+ onChange={this.handleChange}
+ type="password"
+ minLength={8}
+ />
+ </Form.Group>
+ <Form.Group controlId="date_birth" bsSize="large">
+ <Form.Label>Date d'anniversaire</Form.Label>
+ <Form.Control
+ type="date"
+ value={this.state.date_birth}
+ onChange={this.handleChange}
+ />
+ </Form.Group>
+ <Form.Group controlId="student_number">
+ <Form.Label>Numéro Etudiant</Form.Label>
+ <Form.Control
+ type="text"
+ minLength={8}
+ maxLength={8}
+ value={this.state.student_number}
+ onChange={this.handleChange}
+ />
+ </Form.Group>
+ <Button
+ block
+ disabled={!this.validateForm()}
+ type="submit"
+ variant="primary"
+ >
+ S'inscrire
+ </Button>
+ {this.props.state.loading && <div><br/>Veuillez patienter...</div>}
+ {this.props.state.error && <div><br/>{JSON.stringify(this.props.state.errorMessage.message)}</div>}
+ {this.props.state.success && <Redirect to="/login" />}
+ </Form>
+ </Card.Body>
+ </Card>
+ <footer class="footer mt-auto py-3">
+ <div class="container" style={{ textAlign : "center"}}>
+ <Nav.Link as={Link} to="/privacy/">
+ Politique de confidentialité
+ </Nav.Link>
+ </div>
+ </footer>
+ </div>
);
}
}
diff --git a/frontend/src/containers/Users.container.js b/frontend/src/containers/Users.container.js
index b0d7455..7a740f2 100644
--- a/frontend/src/containers/Users.container.js
+++ b/frontend/src/containers/Users.container.js
@@ -3,7 +3,8 @@ import React from 'react';
import { withRouter } from 'react-router-dom'
import * as userActions from '../actions/Users.actions';
import { User } from '../components/User.component';
-import { Card, Table } from 'react-bootstrap';
+import { Card, Table, Nav } from 'react-bootstrap';
+import { Link} from "react-router-dom";
export class Users extends React.Component {
// constructor(props){
@@ -16,6 +17,7 @@ export class Users extends React.Component {
render() {
return (
+ <div>
<Card style={{ width: '90vw', margin: '0 auto', marginTop:'30px' }}>
<Card.Body>
<Card.Title>Utilisateurs</Card.Title>
@@ -35,6 +37,14 @@ export class Users extends React.Component {
{this.props.state.loading && <div>Chargement...</div>}
</Card.Body>
</Card>
+ <footer class="footer mt-auto py-3">
+ <div class="container" style={{ textAlign : "center"}}>
+ <Nav.Link as={Link} to="/privacy/">
+ Politique de confidentialité
+ </Nav.Link>
+ </div>
+ </footer>
+ </div>
);
}
}
--
GitLab