@movalib/movalib-commons 1.1.7 → 1.1.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/devIndex.tsx CHANGED
@@ -1,10 +1,10 @@
1
- import React, { Fragment, useEffect, useState } from 'react';
1
+ import React, { CSSProperties, Fragment, useEffect, useState } from 'react';
2
2
  import { createRoot } from 'react-dom/client';
3
3
  // Import des composants de la bibliothèque
4
4
  import MovaLogin from './src/MovaLogin';
5
5
  import { MovaLoginForm } from './src/helpers/Types';
6
6
  import { MovaAppType } from './src/helpers/Enums';
7
- import { ThemeProvider } from '@mui/material/styles';
7
+ import { ThemeProvider, darken } from '@mui/material/styles';
8
8
  import theme from './theme'; // Import du thème personnalisé
9
9
  import MovaSignUp from './src/MovaSignUp';
10
10
  import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
@@ -12,7 +12,7 @@ import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
12
12
  import DatePicker from '@mui/lab/DatePicker';
13
13
  import frLocale from 'date-fns/locale/fr';
14
14
  import QRCode from './src/QRCode';
15
- import { Box } from '@mui/material';
15
+ import { Box, Button, Typography } from '@mui/material';
16
16
  import GarageService from './src/services/GarageService';
17
17
  import AuthenticationService from './src/services/AuthenticationService';
18
18
  import Logger from './src/helpers/Logger';
@@ -20,6 +20,7 @@ import Garage from './src/models/Garage';
20
20
  import ScheduleFields, { DaySchedule } from './src/ScheduleFields';
21
21
  import Schedule from './src/models/Schedule';
22
22
  import { flexCenter } from './src/helpers/Tools';
23
+ import AccountValidation from './src/AccountValidation';
23
24
 
24
25
  const App = () => {
25
26
 
@@ -27,6 +28,7 @@ const App = () => {
27
28
 
28
29
  // Chargement de données garage de test
29
30
  const [garage, setGarage] = useState<Garage>();
31
+ const [openAccountValidation, setOpenAccountValidation] = useState<Boolean>(false);
30
32
 
31
33
  useEffect(() => {
32
34
  refreshGarageData();
@@ -67,7 +69,6 @@ const App = () => {
67
69
 
68
70
  const getQRCodeData = ():string => {
69
71
  // On renvoie les données pour le QR Code, l'url change selon l'environnement (variables d'environnement)
70
- return 'https://www.instagram.com/delightnord/';
71
72
  return `https://localhost:3001/#/garage/1?redirect=garage`;
72
73
  }
73
74
 
@@ -99,7 +100,6 @@ const App = () => {
99
100
  }
100
101
  }
101
102
 
102
-
103
103
  return (
104
104
  <div>
105
105
  <LocalizationProvider dateAdapter={AdapterDateFns} adapterLocale={frLocale}>
@@ -133,6 +133,19 @@ const App = () => {
133
133
 
134
134
 
135
135
  </Box>
136
+
137
+ <Box style={flexCenter}>
138
+ <Button onClick={() => setOpenAccountValidation(!openAccountValidation)}>
139
+ Validation de compte
140
+ </Button>
141
+ </Box>
142
+
143
+
144
+ {openAccountValidation && <AccountValidation movaAppType={MovaAppType.GARAGE}
145
+ onSubmit={function (success: boolean, message: string): void {
146
+ throw new Error('Function not implemented.');
147
+ } } /> }
148
+
136
149
  </ThemeProvider>
137
150
  </LocalizationProvider>
138
151
  </div>
package/dist/devIndex.js CHANGED
@@ -57,10 +57,12 @@ var Logger_1 = __importDefault(require("./src/helpers/Logger"));
57
57
  var ScheduleFields_1 = __importDefault(require("./src/ScheduleFields"));
58
58
  var Schedule_1 = __importDefault(require("./src/models/Schedule"));
59
59
  var Tools_1 = require("./src/helpers/Tools");
60
+ var AccountValidation_1 = __importDefault(require("./src/AccountValidation"));
60
61
  var App = function () {
61
62
  Logger_1.default.enableLogging();
62
63
  // Chargement de données garage de test
63
64
  var _a = (0, react_1.useState)(), garage = _a[0], setGarage = _a[1];
65
+ var _b = (0, react_1.useState)(false), openAccountValidation = _b[0], setOpenAccountValidation = _b[1];
64
66
  (0, react_1.useEffect)(function () {
65
67
  refreshGarageData();
66
68
  }, []);
@@ -93,7 +95,6 @@ var App = function () {
93
95
  };
94
96
  var getQRCodeData = function () {
95
97
  // On renvoie les données pour le QR Code, l'url change selon l'environnement (variables d'environnement)
96
- return 'https://www.instagram.com/delightnord/';
97
98
  return "https://localhost:3001/#/garage/1?redirect=garage";
98
99
  };
99
100
  var handleScheduleChange = function (schedule) {
@@ -117,13 +118,15 @@ var App = function () {
117
118
  }
118
119
  }
119
120
  };
120
- return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(LocalizationProvider_1.LocalizationProvider, __assign({ dateAdapter: AdapterDateFns_1.AdapterDateFns, adapterLocale: fr_1.default }, { children: (0, jsx_runtime_1.jsx)(styles_1.ThemeProvider, __assign({ theme: theme_1.default }, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, __assign({ sx: { mb: 4 } }, { children: [(0, jsx_runtime_1.jsx)(MovaLogin_1.default, { movaAppType: Enums_1.MovaAppType.GARAGE, version: "0.1.3", onSubmit: function (form) {
121
- alert('Form Submitted !');
122
- }, onSubmitForgotPassword: function (email) {
123
- throw new Error('Function not implemented.');
124
- } }), (0, jsx_runtime_1.jsx)(MovaSignUp_1.default, { movaAppType: Enums_1.MovaAppType.INDIVIDUAL, onSubmit: function (form) {
125
- alert('Form Submitted !');
126
- } }), (0, jsx_runtime_1.jsx)(QRCode_1.default, { data: getQRCodeData(), showDownload: true }), (0, jsx_runtime_1.jsx)("div", { style: { marginTop: '40px' } }), (0, jsx_runtime_1.jsx)("div", __assign({ style: Tools_1.flexCenter }, { children: (0, jsx_runtime_1.jsx)(ScheduleFields_1.default, { schedules: garage === null || garage === void 0 ? void 0 : garage.schedules, size: "small", timePickerStep: 30, onChange: handleScheduleChange }) }))] })) })) })) }));
121
+ return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(LocalizationProvider_1.LocalizationProvider, __assign({ dateAdapter: AdapterDateFns_1.AdapterDateFns, adapterLocale: fr_1.default }, { children: (0, jsx_runtime_1.jsxs)(styles_1.ThemeProvider, __assign({ theme: theme_1.default }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, __assign({ sx: { mb: 4 } }, { children: [(0, jsx_runtime_1.jsx)(MovaLogin_1.default, { movaAppType: Enums_1.MovaAppType.GARAGE, version: "0.1.3", onSubmit: function (form) {
122
+ alert('Form Submitted !');
123
+ }, onSubmitForgotPassword: function (email) {
124
+ throw new Error('Function not implemented.');
125
+ } }), (0, jsx_runtime_1.jsx)(MovaSignUp_1.default, { movaAppType: Enums_1.MovaAppType.INDIVIDUAL, onSubmit: function (form) {
126
+ alert('Form Submitted !');
127
+ } }), (0, jsx_runtime_1.jsx)(QRCode_1.default, { data: getQRCodeData(), showDownload: true }), (0, jsx_runtime_1.jsx)("div", { style: { marginTop: '40px' } }), (0, jsx_runtime_1.jsx)("div", __assign({ style: Tools_1.flexCenter }, { children: (0, jsx_runtime_1.jsx)(ScheduleFields_1.default, { schedules: garage === null || garage === void 0 ? void 0 : garage.schedules, size: "small", timePickerStep: 30, onChange: handleScheduleChange }) }))] })), (0, jsx_runtime_1.jsx)(material_1.Box, __assign({ style: Tools_1.flexCenter }, { children: (0, jsx_runtime_1.jsx)(material_1.Button, __assign({ onClick: function () { return setOpenAccountValidation(!openAccountValidation); } }, { children: "Validation de compte" })) })), openAccountValidation && (0, jsx_runtime_1.jsx)(AccountValidation_1.default, { movaAppType: Enums_1.MovaAppType.GARAGE, onSubmit: function (success, message) {
128
+ throw new Error('Function not implemented.');
129
+ } })] })) })) }));
127
130
  };
128
131
  var root = (0, client_1.createRoot)(document.getElementById('root'));
129
132
  root.render((0, jsx_runtime_1.jsx)(react_1.default.StrictMode, { children: (0, jsx_runtime_1.jsx)(App, {}) }));
@@ -27,6 +27,8 @@ var lab_1 = require("@mui/lab");
27
27
  var Enums_1 = require("./helpers/Enums");
28
28
  var Tools_1 = require("./helpers/Tools");
29
29
  var MovaDialog_1 = __importDefault(require("./MovaDialog"));
30
+ var logo_large_png_1 = __importDefault(require("./assets/images/logo/logo_large.png"));
31
+ var logo_pro_large_png_1 = __importDefault(require("./assets/images/logo/logo_pro_large.png"));
30
32
  var initialFormState = {
31
33
  password: { value: '', isValid: true },
32
34
  confirmation: { value: '', isValid: true },
@@ -121,10 +123,19 @@ var AccountValidation = function (_a) {
121
123
  fontSize: 30
122
124
  };
123
125
  };
126
+ var getMovaLogo = function () {
127
+ return movaAppType === Enums_1.MovaAppType.GARAGE ? logo_pro_large_png_1.default :
128
+ movaAppType === Enums_1.MovaAppType.INDIVIDUAL ? logo_large_png_1.default :
129
+ movaAppType === Enums_1.MovaAppType.ADMIN ? logo_large_png_1.default : logo_large_png_1.default;
130
+ };
124
131
  return ((0, jsx_runtime_1.jsxs)("div", { children: [emptyPwd &&
125
- (0, jsx_runtime_1.jsx)(MovaDialog_1.default, __assign({ leafImageColor: 'pink', title: movaAppType === Enums_1.MovaAppType.GARAGE ? "Bienvenue sur Movalib PRO !" : "Bienvenue sur Movalib !", titleStyle: getTitleStyle(), fullScreen: isMobile, open: emptyPwd, closable: false, onClose: function () {
132
+ (0, jsx_runtime_1.jsx)(MovaDialog_1.default, __assign({ leafImageColor: 'pink', titleStyle: getTitleStyle(), fullScreen: isMobile, open: emptyPwd, closable: false, onClose: function () {
126
133
  throw new Error('Function not implemented.');
127
- }, actions: (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, __assign({ type: "submit", onClick: handleValidateAccount, fullWidth: true, variant: "contained", sx: { mt: 4, mb: 0 } }, { children: (0, jsx_runtime_1.jsx)("span", { children: "Activer mon compte" }) })) }, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, __assign({ container: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 12 }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, __assign({ sx: { mt: 2, mb: 2 } }, { children: movaAppType === Enums_1.MovaAppType.INDIVIDUAL ?
134
+ }, actions: (0, jsx_runtime_1.jsx)(lab_1.LoadingButton, __assign({ type: "submit", onClick: handleValidateAccount, fullWidth: true, variant: "contained", sx: { mt: 4, mb: 0 } }, { children: (0, jsx_runtime_1.jsx)("span", { children: "Activer mon compte" }) })) }, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, __assign({ container: true }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 12 }, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, __assign({ sx: {
135
+ display: 'flex',
136
+ flexDirection: 'column',
137
+ alignItems: 'center',
138
+ } }, { children: [(0, jsx_runtime_1.jsx)("img", { src: getMovaLogo(), style: { width: '50%' } }), (0, jsx_runtime_1.jsx)("br", {})] })) })), (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 12 }, { children: (0, jsx_runtime_1.jsx)(material_1.Typography, __assign({ sx: { mt: 2, mb: 2 } }, { children: movaAppType === Enums_1.MovaAppType.INDIVIDUAL ?
128
139
  "Pour commencer, définis ton mot de passe et active ton compte 😉"
129
140
  :
130
141
  "Pour commencer, définissez votre mot de passe et activez votre compte 😉" })) })), (0, jsx_runtime_1.jsx)(material_1.Grid, __assign({ item: true, xs: 12 }, { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { margin: "normal", required: true, fullWidth: true, name: "password", label: "Mot de passe", type: showPassword ? 'text' : 'password', id: "password", autoComplete: "current-password", onChange: function (e) { return handleInputChange(e); }, value: passwordForm.password.value, error: !passwordForm.password.isValid, helperText: Boolean(passwordForm.password.error) ? passwordForm.password.error : "10 caractères minimum, 1 majuscule, 1 minuscule", InputProps: {
@@ -60,6 +60,6 @@ var MovaDialog = function (_a) {
60
60
  zIndex: 0,
61
61
  left: 0,
62
62
  opacity: '0.2'
63
- }, alt: 'Feuille Movalib' }), (0, jsx_runtime_1.jsx)(material_1.DialogTitle, __assign({ id: "garage-dialog-title", sx: { textAlign: 'center', p: 0, pt: 1, mt: 0, mb: 0, zIndex: 10 } }, { children: (0, jsx_runtime_1.jsx)(material_1.AppBar, __assign({ sx: { position: 'relative' }, color: "transparent", elevation: 0 }, { children: (0, jsx_runtime_1.jsxs)(material_1.Toolbar, { children: [closable && (0, jsx_runtime_1.jsx)(material_1.IconButton, __assign({ edge: "start", color: "inherit", onClick: handleOnBack, "aria-label": "close" }, { children: (0, jsx_runtime_1.jsx)(ArrowBackIosNewRounded_1.default, {}) })), title && (0, jsx_runtime_1.jsx)(material_1.Typography, __assign({ sx: { textAlign: 'center', fontSize: 20, flexGrow: 1, pl: '20px', pr: '40px' }, style: titleStyle }, { children: title }))] }) })) })), (0, jsx_runtime_1.jsxs)(material_1.DialogContent, __assign({ sx: { zIndex: 20 } }, { children: [children, message && (0, jsx_runtime_1.jsx)(material_1.Alert, __assign({ severity: "error", sx: { mb: 2 } }, { children: message }))] })), (0, jsx_runtime_1.jsx)(material_1.DialogActions, __assign({ sx: { justifyContent: 'center' } }, { children: actions }))] })));
63
+ }, alt: 'Feuille Movalib' }), title && (0, jsx_runtime_1.jsx)(material_1.DialogTitle, __assign({ id: "garage-dialog-title", sx: { textAlign: 'center', p: 0, pt: 1, mt: 0, mb: 0, zIndex: 10 } }, { children: (0, jsx_runtime_1.jsx)(material_1.AppBar, __assign({ sx: { position: 'relative' }, color: "transparent", elevation: 0 }, { children: (0, jsx_runtime_1.jsxs)(material_1.Toolbar, { children: [closable && (0, jsx_runtime_1.jsx)(material_1.IconButton, __assign({ edge: "start", color: "inherit", onClick: handleOnBack, "aria-label": "close" }, { children: (0, jsx_runtime_1.jsx)(ArrowBackIosNewRounded_1.default, {}) })), (0, jsx_runtime_1.jsx)(material_1.Typography, __assign({ sx: { textAlign: 'center', fontSize: 20, flexGrow: 1, pl: '20px', pr: '40px' }, style: titleStyle }, { children: title }))] }) })) })), (0, jsx_runtime_1.jsxs)(material_1.DialogContent, __assign({ sx: { zIndex: 20 } }, { children: [children, message && (0, jsx_runtime_1.jsx)(material_1.Alert, __assign({ severity: "error", sx: { mb: 2 } }, { children: message }))] })), (0, jsx_runtime_1.jsx)(material_1.DialogActions, __assign({ sx: { justifyContent: 'center' } }, { children: actions }))] })));
64
64
  };
65
65
  exports.default = MovaDialog;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@movalib/movalib-commons",
3
- "version": "1.1.7",
3
+ "version": "1.1.8",
4
4
  "description": "Bibliothèque d'objets communs à l'ensemble des projets React de Movalib",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
@@ -12,6 +12,9 @@ import { MovaFormField, MovaPasswordForm } from './helpers/Types';
12
12
  import { validateField } from './helpers/Tools';
13
13
  import MovaDialog from './MovaDialog';
14
14
 
15
+ import LogoLarge from './assets/images/logo/logo_large.png';
16
+ import LogoProLarge from './assets/images/logo/logo_pro_large.png';
17
+
15
18
  const initialFormState = {
16
19
  password: { value: '', isValid: true },
17
20
  confirmation: { value: '', isValid: true },
@@ -33,7 +36,7 @@ const AccountValidation: FunctionComponent<AccountValidationProps> = ({ movaAppT
33
36
  const [showPassword, setShowPassword] = useState(false);
34
37
  const isMobile = useMediaQuery(theme.breakpoints.down('sm'));
35
38
 
36
- useEffect(() => {
39
+ useEffect(() => {
37
40
 
38
41
  const params = new URLSearchParams(location.search);
39
42
  const token = params.get('token');
@@ -139,12 +142,18 @@ const AccountValidation: FunctionComponent<AccountValidationProps> = ({ movaAppT
139
142
  }
140
143
  }
141
144
 
145
+ const getMovaLogo = () => {
146
+
147
+ return movaAppType === MovaAppType.GARAGE ? LogoProLarge :
148
+ movaAppType === MovaAppType.INDIVIDUAL ? LogoLarge :
149
+ movaAppType === MovaAppType.ADMIN ? LogoLarge : LogoLarge;
150
+ }
151
+
142
152
  return (
143
153
  <div>
144
154
  {emptyPwd &&
145
155
  <MovaDialog
146
156
  leafImageColor='pink'
147
- title={movaAppType === MovaAppType.GARAGE ? "Bienvenue sur Movalib PRO !" : "Bienvenue sur Movalib !" }
148
157
  titleStyle={getTitleStyle()}
149
158
  fullScreen={isMobile}
150
159
  open={emptyPwd}
@@ -163,6 +172,18 @@ const AccountValidation: FunctionComponent<AccountValidationProps> = ({ movaAppT
163
172
  </LoadingButton>
164
173
  }>
165
174
  <Grid container>
175
+ <Grid item xs={12}>
176
+ <Box
177
+ sx={{
178
+ display: 'flex',
179
+ flexDirection: 'column',
180
+ alignItems: 'center',
181
+ }}
182
+ >
183
+ <img src={getMovaLogo()} style={{width:'50%'}}/>
184
+ <br />
185
+ </Box>
186
+ </Grid>
166
187
  <Grid item xs={12}>
167
188
  <Typography sx={{ mt: 2, mb: 2 }}>
168
189
  {movaAppType === MovaAppType.INDIVIDUAL ?
@@ -86,23 +86,24 @@ const MovaDialog: FC<MovaDialogProps> = ({fullScreen, open, onClose, closable =
86
86
  left: 0,
87
87
  opacity: '0.2'}} alt='Feuille Movalib'></img>
88
88
 
89
- <DialogTitle id="garage-dialog-title" sx={{ textAlign:'center', p: 0, pt: 1, mt: 0, mb: 0, zIndex: 10 }} >
90
- <AppBar sx={{ position: 'relative' }} color="transparent" elevation={0}>
91
- <Toolbar>
92
- {closable && <IconButton
93
- edge="start"
94
- color="inherit"
95
- onClick={handleOnBack}
96
- aria-label="close"
97
- >
98
- <BackIcon />
99
- </IconButton>}
100
- {title && <Typography sx={{ textAlign:'center', fontSize: 20, flexGrow: 1, pl: '20px', pr: '40px' }} style={titleStyle}>
101
- {title}
102
- </Typography>}
103
- </Toolbar>
104
- </AppBar>
105
- </DialogTitle>
89
+ {title && <DialogTitle id="garage-dialog-title" sx={{ textAlign:'center', p: 0, pt: 1, mt: 0, mb: 0, zIndex: 10 }} >
90
+ <AppBar sx={{ position: 'relative' }} color="transparent" elevation={0}>
91
+ <Toolbar>
92
+ {closable && <IconButton
93
+ edge="start"
94
+ color="inherit"
95
+ onClick={handleOnBack}
96
+ aria-label="close"
97
+ >
98
+ <BackIcon />
99
+ </IconButton>}
100
+ <Typography sx={{ textAlign:'center', fontSize: 20, flexGrow: 1, pl: '20px', pr: '40px' }} style={titleStyle}>
101
+ {title}
102
+ </Typography>
103
+ </Toolbar>
104
+ </AppBar>
105
+ </DialogTitle>
106
+ }
106
107
  <DialogContent sx={{ zIndex: 20}}>
107
108
  {children}
108
109
  {message && <Alert severity="error" sx={{ mb: 2 }}>{message}</Alert>}