@movalib/movalib-commons 1.2.12 → 1.2.13

package/dist/src/DialogForgotPassword.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { MovaAppType } from './helpers/Enums';
+declare const DialogForgotPassword: React.FC<{
+    openForgotPassword: boolean;
+    setOpenForgotPassword: React.Dispatch<React.SetStateAction<boolean>>;
+    movaAppType: MovaAppType;
+    form: any;
+    handleInputChange: (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
+    handleSubmitForgotPassword: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+}>;
+export default DialogForgotPassword;

package/dist/src/DialogForgotPassword.js

@@ -0,0 +1,28 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var material_1 = require("@mui/material");
+var Enums_1 = require("./helpers/Enums");
+var Validator_1 = require("./helpers/Validator");
+var DialogForgotPassword = function (_a) {
+    var openForgotPassword = _a.openForgotPassword, setOpenForgotPassword = _a.setOpenForgotPassword, movaAppType = _a.movaAppType, form = _a.form, handleInputChange = _a.handleInputChange, handleSubmitForgotPassword = _a.handleSubmitForgotPassword;
+    var defaultMessage = (0, react_1.useState)("Êtes-vous sûr de vouloir continuer ?")[0];
+    return ((0, jsx_runtime_1.jsxs)(material_1.Dialog, __assign({ open: openForgotPassword, onClose: function () { return setOpenForgotPassword(false); }, "aria-labelledby": "forgot-password-dialog-title", "aria-describedby": "forgot-password-dialog-description" }, { children: [(0, jsx_runtime_1.jsx)(material_1.DialogTitle, __assign({ id: "forgot-password-title" }, { children: "R\u00E9cup\u00E9ration du mot de passe" })), (0, jsx_runtime_1.jsxs)(material_1.DialogContent, { children: [(0, jsx_runtime_1.jsx)(material_1.DialogContentText, __assign({ id: "forgot-password-dialog-description", sx: { mb: 2 } }, { children: movaAppType === Enums_1.MovaAppType.GARAGE ?
+                            "Saisissez votre email pour procéder à la réinitialisation de votre mot de passe."
+                            :
+                                "Saisissez votre n° de téléphone ou votre email pour procéder à la réinitialisation de votre mot de passe." })), (0, jsx_runtime_1.jsx)(material_1.TextField, { margin: "normal", autoFocus: true, required: true, fullWidth: true, id: movaAppType === Enums_1.MovaAppType.GARAGE ? "email" : "phoneNumberEmail", label: movaAppType === Enums_1.MovaAppType.GARAGE ? "Adresse email" : "N° de téléphone ou adresse email", name: movaAppType === Enums_1.MovaAppType.GARAGE ? "email" : "phoneNumberEmail", autoComplete: "email", onChange: function (e) { return handleInputChange(e); }, value: movaAppType === Enums_1.MovaAppType.GARAGE ? form.email.value : form.phoneNumberEmail.value, error: movaAppType === Enums_1.MovaAppType.GARAGE ? !form.email.isValid : !form.phoneNumberEmail.isValid, helperText: movaAppType === Enums_1.MovaAppType.GARAGE ? form.email.error : form.phoneNumberEmail.error })] }), (0, jsx_runtime_1.jsx)(material_1.DialogActions, { children: (0, jsx_runtime_1.jsx)(material_1.Button, __assign({ onClick: function (e) { return handleSubmitForgotPassword(e); }, color: "primary", disabled: movaAppType === Enums_1.MovaAppType.GARAGE ? !(form.email.value && (0, Validator_1.validateEmail)(form.email.value))
+                        : !(form.phoneNumberEmail.value), sx: { ml: 1 } }, { children: "Envoyer ma demande" })) })] })));
+};
+exports.default = DialogForgotPassword;

package/dist/src/MovaLogin.js

@@ -68,6 +68,7 @@ var react_router_dom_1 = require("react-router-dom");
 var InputAdornment_1 = __importDefault(require("@mui/material/InputAdornment"));
 var Visibility_1 = __importDefault(require("@mui/icons-material/Visibility"));
 var VisibilityOff_1 = __importDefault(require("@mui/icons-material/VisibilityOff"));
+var DialogForgotPassword_1 = __importDefault(require("./DialogForgotPassword"));
 // Permet de centrer le contenu de l'application
 var styles = {
     display: 'flex',
@@ -145,19 +146,18 @@ var MovaLogin = function (_a) {
                     movaAppType === Enums_1.MovaAppType.ADMIN ? logo_large_border_png_1.default : logo_large_border_png_1.default;
         }
     };
-    var handleOnClickSignUp = function (e) {
-        e.preventDefault();
+    var handleOnClickSignUp = function () {
+        //e.preventDefault();
         if (history) {
             // On redirige l'utilisateur vers la page par défaut (accueil)
             history.push('/signup');
         }
     };
-    var handleOnClickForgotPassword = function (e) {
-        e.preventDefault();
+    var handleOnClickForgotPassword = function () {
+        //e.preventDefault();
         setOpenForgotPassword(true);
     };
-    var handleSubmitForgotPassword = function (e) {
-        e.preventDefault();
+    var handleSubmitForgotPassword = function () {
         setOpenForgotPassword(false);
         // On appel de callback de soumission de la demande de réinitialisation du mot de passe
         if (onSubmitForgotPassword) {
@@ -170,14 +170,52 @@ var MovaLogin = function (_a) {
     /**
      * Boite de diaogue pour la perte du mot de passe
      */
-    var dialogForgotPassword = function () {
-        var defaultMessage = "Êtes-vous sûr de vouloir continuer ?";
-        return ((0, jsx_runtime_1.jsxs)(material_1.Dialog, __assign({ open: openForgotPassword, onClose: function () { return setOpenForgotPassword(false); }, "aria-labelledby": "forgot-password-dialog-title", "aria-describedby": "forgot-password-dialog-description" }, { children: [(0, jsx_runtime_1.jsx)(material_1.DialogTitle, __assign({ id: "forgot-password-title" }, { children: "R\u00E9cup\u00E9ration du mot de passe" })), (0, jsx_runtime_1.jsxs)(material_1.DialogContent, { children: [(0, jsx_runtime_1.jsx)(material_1.DialogContentText, __assign({ id: "forgot-password-dialog-description", sx: { mb: 2 } }, { children: movaAppType === Enums_1.MovaAppType.GARAGE ?
-                                "Saisissez votre email pour procéder à la réinitialisation de votre mot de passe."
-                                :
-                                    "Saisissez votre n° de téléphone ou votre email pour procéder à la réinitialisation de votre mot de passe." })), (0, jsx_runtime_1.jsx)(material_1.TextField, { margin: "normal", autoFocus: true, required: true, fullWidth: true, id: movaAppType === Enums_1.MovaAppType.GARAGE ? "email" : "phoneNumberEmail", label: movaAppType === Enums_1.MovaAppType.GARAGE ? "Adresse email" : "N° de téléphone ou adresse email", name: movaAppType === Enums_1.MovaAppType.GARAGE ? "email" : "phoneNumberEmail", autoComplete: "email", onChange: function (e) { return handleInputChange(e); }, value: movaAppType === Enums_1.MovaAppType.GARAGE ? form.email.value : form.phoneNumberEmail.value, error: movaAppType === Enums_1.MovaAppType.GARAGE ? !form.email.isValid : !form.phoneNumberEmail.isValid, helperText: movaAppType === Enums_1.MovaAppType.GARAGE ? form.email.error : form.phoneNumberEmail.error })] }), (0, jsx_runtime_1.jsx)(material_1.DialogActions, { children: (0, jsx_runtime_1.jsx)(material_1.Button, __assign({ onClick: function (e) { return handleSubmitForgotPassword(e); }, color: "primary", disabled: movaAppType === Enums_1.MovaAppType.GARAGE ? !(form.email.value && (0, Validator_1.validateEmail)(form.email.value))
-                            : !(form.phoneNumberEmail.value), sx: { ml: 1 } }, { children: "Envoyer ma demande" })) })] })));
-    };
+    /*     const dialogForgotPassword = () => {
+            const defaultMessage = "Êtes-vous sûr de vouloir continuer ?";
+    
+            return (
+              <Dialog
+                open={openForgotPassword}
+                onClose={() => setOpenForgotPassword(false)}
+                aria-labelledby="forgot-password-dialog-title"
+                aria-describedby="forgot-password-dialog-description"
+              >
+                <DialogTitle id="forgot-password-title">Récupération du mot de passe</DialogTitle>
+                <DialogContent>
+                  <DialogContentText id="forgot-password-dialog-description" sx={{ mb: 2 }}>
+                  {movaAppType === MovaAppType.GARAGE ?
+                    "Saisissez votre email pour procéder à la réinitialisation de votre mot de passe."
+                  :
+                    "Saisissez votre n° de téléphone ou votre email pour procéder à la réinitialisation de votre mot de passe."
+                }
+                  </DialogContentText>
+                  <TextField
+                        margin="normal"
+                        autoFocus
+                        required
+                        fullWidth
+                        id={movaAppType === MovaAppType.GARAGE ? "email" : "phoneNumberEmail"}
+                        label={movaAppType === MovaAppType.GARAGE ? "Adresse email" : "N° de téléphone ou adresse email"}
+                        name={movaAppType === MovaAppType.GARAGE ? "email" : "phoneNumberEmail"}
+                        autoComplete="email"
+                        onChange={e => handleInputChange(e)}
+                        value={movaAppType === MovaAppType.GARAGE ? form.email.value : form.phoneNumberEmail.value}
+                        error={movaAppType === MovaAppType.GARAGE ? !form.email.isValid : !form.phoneNumberEmail.isValid}
+                        helperText={movaAppType === MovaAppType.GARAGE ? form.email.error : form.phoneNumberEmail.error}
+                    />
+                </DialogContent>
+                <DialogActions>
+                  <Button onClick={(e) => handleSubmitForgotPassword(e)}
+                    color="primary"
+                    disabled={movaAppType === MovaAppType.GARAGE ?  !(form.email.value && validateEmail(form.email.value))
+                    : !(form.phoneNumberEmail.value)}
+                    sx={{ ml: 1}}>
+                        Envoyer ma demande
+                  </Button>
+                </DialogActions>
+              </Dialog>
+            );
+        } */
     return ((0, jsx_runtime_1.jsxs)("div", __assign({ style: styles }, { children: [(0, jsx_runtime_1.jsx)("img", { src: leaf_green_large_png_1.default, style: { position: 'fixed',
                     float: 'left',
                     width: '250px',
@@ -206,7 +244,8 @@ var MovaLogin = function (_a) {
                                     '& .MuiOutlinedInput-notchedOutline': {
                                         borderColor: darkMode ? 'white' : 'default', // Couleur de la bordure
                                     }
-                                } }), (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { control: (0, jsx_runtime_1.jsx)(material_1.Checkbox, { value: "remember", color: "primary" }), label: "Se souvenir de moi" }), (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, __assign({ loading: loading, type: "submit", fullWidth: true, variant: "contained", sx: { mt: 3, mb: 2, backgroundColor: darkMode ? theme.palette.primary.dark : theme.palette.primary.main } }, { children: (0, jsx_runtime_1.jsx)("span", { children: "Se connecter" }) })), alertMessage && alertSeverity && (0, jsx_runtime_1.jsx)(material_1.Alert, __assign({ severity: alertSeverity, sx: { mb: 2 } }, { children: alertMessage })), (0, jsx_runtime_1.jsxs)(material_1.Grid, __assign({ container: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Link, __assign({ variant: "body2", color: "text.secondary", onClick: function (e) { return handleOnClickForgotPassword(e); }, sx: { cursor: 'pointer' } }, { children: "Mot de passe oubli\u00E9 ?" })) })), movaAppType === Enums_1.MovaAppType.INDIVIDUAL && (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Link, __assign({ variant: "body2", color: "text.secondary", onClick: function (e) { return handleOnClickSignUp(e); }, sx: { cursor: 'pointer' } }, { children: "Cr\u00E9er mon compte" })) }))] }))] })), (0, jsx_runtime_1.jsx)(MovaCopyright_1.default, { sx: { mt: 8, mb: 1 } }), version && (0, jsx_runtime_1.jsx)(material_1.Typography, __assign({ variant: 'body2', color: theme.palette.grey[200], sx: { textAlign: 'center' } }, { children: version })), openForgotPassword && dialogForgotPassword()] })), (0, jsx_runtime_1.jsx)("img", { src: leaf_pink_large_png_1.default, style: { position: 'fixed',
+                                } }), (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { control: (0, jsx_runtime_1.jsx)(material_1.Checkbox, { value: "remember", color: "primary" }), label: "Se souvenir de moi" }), (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, __assign({ loading: loading, type: "submit", fullWidth: true, variant: "contained", sx: { mt: 3, mb: 2, backgroundColor: darkMode ? theme.palette.primary.dark : theme.palette.primary.main } }, { children: (0, jsx_runtime_1.jsx)("span", { children: "Se connecter" }) })), alertMessage && alertSeverity && (0, jsx_runtime_1.jsx)(material_1.Alert, __assign({ severity: alertSeverity, sx: { mb: 2 } }, { children: alertMessage })), (0, jsx_runtime_1.jsxs)(material_1.Grid, __assign({ container: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Link, __assign({ variant: "body2", color: "text.secondary", onClick: function (e) { return handleOnClickForgotPassword(); }, sx: { cursor: 'pointer' } }, { children: "Mot de passe oubli\u00E9 ?" })) })), movaAppType === Enums_1.MovaAppType.INDIVIDUAL && (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(material_1.Link, __assign({ variant: "body2", color: "text.secondary", onClick: function (e) { return handleOnClickSignUp(); }, sx: { cursor: 'pointer' } }, { children: "Cr\u00E9er mon compte" })) }))] }))] })), (0, jsx_runtime_1.jsx)(MovaCopyright_1.default, { sx: { mt: 8, mb: 1 } }), version && (0, jsx_runtime_1.jsx)(material_1.Typography, __assign({ variant: 'body2', color: theme.palette.grey[200], sx: { textAlign: 'center' } }, { children: version })), openForgotPassword &&
+                        (0, jsx_runtime_1.jsx)(DialogForgotPassword_1.default, { openForgotPassword: openForgotPassword, setOpenForgotPassword: setOpenForgotPassword, movaAppType: movaAppType, form: form, handleInputChange: handleInputChange, handleSubmitForgotPassword: handleSubmitForgotPassword })] })), (0, jsx_runtime_1.jsx)("img", { src: leaf_pink_large_png_1.default, style: { position: 'fixed',
                     float: 'right',
                     width: '250px',
                     height: '400px',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@movalib/movalib-commons",
-  "version": "1.2.12",
+  "version": "1.2.13",
   "description": "Bibliothèque d'objets communs à l'ensemble des projets React de Movalib",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/DialogForgotPassword.tsx

@@ -0,0 +1,61 @@
+import React, { useState } from 'react';
+import { Dialog, DialogTitle, DialogContent, DialogContentText, DialogActions, Button, TextField } from '@mui/material';
+import { MovaAppType } from './helpers/Enums';
+import { validateEmail } from './helpers/Validator';
+
+const DialogForgotPassword: React.FC<{ 
+    openForgotPassword: boolean; 
+    setOpenForgotPassword: React.Dispatch<React.SetStateAction<boolean>>; // Ajout de setOpenForgotPassword
+    movaAppType: MovaAppType; 
+    form: any; 
+    handleInputChange: (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void; 
+    handleSubmitForgotPassword: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void; 
+}> = ({ openForgotPassword, setOpenForgotPassword, movaAppType, form, handleInputChange, handleSubmitForgotPassword }) => {
+    
+    const [defaultMessage] = useState("Êtes-vous sûr de vouloir continuer ?");
+
+    return (
+        <Dialog
+            open={openForgotPassword}
+            onClose={() => setOpenForgotPassword(false)}
+            aria-labelledby="forgot-password-dialog-title"
+            aria-describedby="forgot-password-dialog-description"
+        >
+            <DialogTitle id="forgot-password-title">Récupération du mot de passe</DialogTitle>
+            <DialogContent>
+                <DialogContentText id="forgot-password-dialog-description" sx={{ mb: 2 }}>
+                    {movaAppType === MovaAppType.GARAGE ?
+                        "Saisissez votre email pour procéder à la réinitialisation de votre mot de passe."
+                        :
+                        "Saisissez votre n° de téléphone ou votre email pour procéder à la réinitialisation de votre mot de passe."
+                    }
+                </DialogContentText>
+                <TextField
+                    margin="normal"
+                    autoFocus
+                    required
+                    fullWidth
+                    id={movaAppType === MovaAppType.GARAGE ? "email" : "phoneNumberEmail"}
+                    label={movaAppType === MovaAppType.GARAGE ? "Adresse email" : "N° de téléphone ou adresse email"}
+                    name={movaAppType === MovaAppType.GARAGE ? "email" : "phoneNumberEmail"}
+                    autoComplete="email"
+                    onChange={e => handleInputChange(e)}
+                    value={movaAppType === MovaAppType.GARAGE ? form.email.value : form.phoneNumberEmail.value}
+                    error={movaAppType === MovaAppType.GARAGE ? !form.email.isValid : !form.phoneNumberEmail.isValid}
+                    helperText={movaAppType === MovaAppType.GARAGE ? form.email.error : form.phoneNumberEmail.error}
+                />
+            </DialogContent>
+            <DialogActions>
+                <Button onClick={(e) => handleSubmitForgotPassword(e)}
+                    color="primary"
+                    disabled={movaAppType === MovaAppType.GARAGE ? !(form.email.value && validateEmail(form.email.value))
+                        : !(form.phoneNumberEmail.value)}
+                    sx={{ ml: 1 }}>
+                    Envoyer ma demande
+                </Button>
+            </DialogActions>
+        </Dialog>
+    );
+};
+
+export default DialogForgotPassword;

package/src/MovaLogin.tsx

@@ -1,4 +1,4 @@
-import { CSSProperties, FormEvent, FunctionComponent, ReactNode, useState } from "react";
+import { CSSProperties, ChangeEvent, FormEvent, FunctionComponent, MouseEvent, ReactNode, SetStateAction, useState } from "react";
 import { LoadingButton } from '@mui/lab';
 import LogoLarge from './assets/images/logo/logo_large_border.png';
 import LogoProLarge from './assets/images/logo/logo_pro_large_border.png';
@@ -17,6 +17,7 @@ import { useHistory } from "react-router-dom";
 import InputAdornment from '@mui/material/InputAdornment';
 import Visibility from '@mui/icons-material/Visibility';
 import VisibilityOff from '@mui/icons-material/VisibilityOff';
+import DialogForgotPassword from "./DialogForgotPassword";
 
 // Permet de centrer le contenu de l'application
 const styles: CSSProperties = {
@@ -128,21 +129,20 @@ const MovaLogin: FunctionComponent<MovaLoginProps> = ({ loading, movaAppType, on
         }
     }
 
-    const handleOnClickSignUp = (e: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => {
-        e.preventDefault();
+    const handleOnClickSignUp = () => {
+        //e.preventDefault();
         if(history){
             // On redirige l'utilisateur vers la page par défaut (accueil)
             history.push('/signup');
         }
     }
 
-    const handleOnClickForgotPassword = (e: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => {
-        e.preventDefault();
+    const handleOnClickForgotPassword = () => {
+        //e.preventDefault();
         setOpenForgotPassword(true);
     }
 
-    const handleSubmitForgotPassword = (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
-        e.preventDefault();
+    const handleSubmitForgotPassword = () => {
 
         setOpenForgotPassword(false);
         // On appel de callback de soumission de la demande de réinitialisation du mot de passe
@@ -158,7 +158,7 @@ const MovaLogin: FunctionComponent<MovaLoginProps> = ({ loading, movaAppType, on
     /**
      * Boite de diaogue pour la perte du mot de passe
      */
-    const dialogForgotPassword = () => {
+/*     const dialogForgotPassword = () => {
         const defaultMessage = "Êtes-vous sûr de vouloir continuer ?";
 
         return (
@@ -203,7 +203,7 @@ const MovaLogin: FunctionComponent<MovaLoginProps> = ({ loading, movaAppType, on
             </DialogActions>
           </Dialog>
         );
-    }
+    } */
 
     return (
         <div style={styles}>
@@ -324,12 +324,12 @@ const MovaLogin: FunctionComponent<MovaLoginProps> = ({ loading, movaAppType, on
 
                     <Grid container>
                         <Grid item xs>
-                            <Link variant="body2" color="text.secondary" onClick={(e) => handleOnClickForgotPassword(e)} sx={{ cursor:'pointer' }}>
+                            <Link variant="body2" color="text.secondary" onClick={(e) => handleOnClickForgotPassword()} sx={{ cursor:'pointer' }}>
                                 Mot de passe oublié ?
                             </Link>
                         </Grid>
                         {movaAppType === MovaAppType.INDIVIDUAL && <Grid item>
-                            <Link variant="body2" color="text.secondary" onClick={(e) => handleOnClickSignUp(e)} sx={{ cursor:'pointer' }}>
+                            <Link variant="body2" color="text.secondary" onClick={(e) => handleOnClickSignUp()} sx={{ cursor:'pointer' }}>
                                 Créer mon compte
                             </Link>
                         </Grid>}
@@ -341,7 +341,16 @@ const MovaLogin: FunctionComponent<MovaLoginProps> = ({ loading, movaAppType, on
                 {version&& <Typography variant='body2' color={theme.palette.grey[200]} sx={{ textAlign: 'center'}}>
                 {version}</Typography>}
 
-                {openForgotPassword && dialogForgotPassword()}
+                {openForgotPassword && 
+                    <DialogForgotPassword 
+                        openForgotPassword={openForgotPassword} 
+                        setOpenForgotPassword={setOpenForgotPassword}
+                        movaAppType={movaAppType}
+                        form={form} 
+                        handleInputChange={handleInputChange} 
+                        handleSubmitForgotPassword={handleSubmitForgotPassword}                    
+                    />
+                }
 
 
             </Container>