@portnet/ui 5.0.28 → 5.0.30

package/dist/api/reclamationApi.js

@@ -37,14 +37,31 @@ const reclamationApi = axiosInstance => ({
       throw (error === null || error === void 0 || (_error$response = error.response) === null || _error$response === void 0 ? void 0 : _error$response.data) || new Error("Impossible de charger les réclamations");
     }
   },
+  getListNatureReclamationApi: async (portailId, serviceCode) => {
+    try {
+      const response = await axiosInstance.get("/reclamation/list-nature", {
+        params: {
+          portailId,
+          service: serviceCode || undefined
+        }
+      });
+      return response.data.body;
+    } catch (error) {
+      var _error$response2;
+      throw (error === null || error === void 0 || (_error$response2 = error.response) === null || _error$response2 === void 0 ? void 0 : _error$response2.data) || new Error("Impossible de charger les natures");
+    }
+  },
   createReclamationApi: async (data, portailId) => {
     try {
+      var _data$nature;
       const formData = new FormData();
       const serviceConcerne = data.service.codigo;
       formData.append("type", data.type);
       formData.append("service", serviceConcerne);
       formData.append("objet", data.objet);
       formData.append("description", data.sujet);
+      formData.append("telephone", data.telephone);
+      formData.append("nature", ((_data$nature = data.nature) === null || _data$nature === void 0 ? void 0 : _data$nature.codigo) || "");
       if (data.files && data.files.length > 0) {
         data.files.forEach(file => {
           formData.append("files", file);
@@ -61,8 +78,8 @@ const reclamationApi = axiosInstance => ({
       });
       return response.data.body;
     } catch (error) {
-      var _error$response2;
-      throw (error === null || error === void 0 || (_error$response2 = error.response) === null || _error$response2 === void 0 ? void 0 : _error$response2.data) || new Error("Impossible de create nouvelle réclamation");
+      var _error$response3;
+      throw (error === null || error === void 0 || (_error$response3 = error.response) === null || _error$response3 === void 0 ? void 0 : _error$response3.data) || new Error("Impossible de créer une nouvelle réclamation");
     }
   },
   downloadDocumentApi: async documentGuid => {
@@ -70,8 +87,8 @@ const reclamationApi = axiosInstance => ({
       const response = await axiosInstance.post("/reclamation/download?guid=".concat(documentGuid));
       return response.data.body;
     } catch (error) {
-      var _error$response3;
-      throw (error === null || error === void 0 || (_error$response3 = error.response) === null || _error$response3 === void 0 ? void 0 : _error$response3.data) || new Error("Impossible de charger les réclamations");
+      var _error$response4;
+      throw (error === null || error === void 0 || (_error$response4 = error.response) === null || _error$response4 === void 0 ? void 0 : _error$response4.data) || new Error("Impossible de charger les réclamations");
     }
   },
   getListServiceReclamationApi: async () => {
@@ -79,8 +96,8 @@ const reclamationApi = axiosInstance => ({
       const response = await axiosInstance.get("/reclamation/list-service");
       return response.data.body;
     } catch (error) {
-      var _error$response4;
-      throw (error === null || error === void 0 || (_error$response4 = error.response) === null || _error$response4 === void 0 ? void 0 : _error$response4.data) || new Error("Impossible de charger les réclamations");
+      var _error$response5;
+      throw (error === null || error === void 0 || (_error$response5 = error.response) === null || _error$response5 === void 0 ? void 0 : _error$response5.data) || new Error("Impossible de charger les réclamations");
     }
   },
   getListServiceReclamationByPortailApi: async portailId => {
@@ -88,8 +105,8 @@ const reclamationApi = axiosInstance => ({
       const response = await axiosInstance.get("/reclamation/list-service/".concat(portailId));
       return response.data.body;
     } catch (error) {
-      var _error$response5;
-      throw (error === null || error === void 0 || (_error$response5 = error.response) === null || _error$response5 === void 0 ? void 0 : _error$response5.data) || new Error("Impossible de charger les réclamations");
+      var _error$response6;
+      throw (error === null || error === void 0 || (_error$response6 = error.response) === null || _error$response6 === void 0 ? void 0 : _error$response6.data) || new Error("Impossible de charger les réclamations");
     }
   },
   cloturerReclamation: id => axiosInstance.patch("/reclamation/".concat(id, "/cloturer")).then(r => r.data),

package/dist/components/widgets/PuiHelpWidget.js

@@ -12,6 +12,7 @@ require("core-js/modules/es.promise.js");
 require("core-js/modules/es.regexp.exec.js");
 require("core-js/modules/es.regexp.test.js");
 require("core-js/modules/es.string.includes.js");
+require("core-js/modules/es.string.replace.js");
 require("core-js/modules/es.string.split.js");
 require("core-js/modules/es.string.trim.js");
 require("core-js/modules/es.typed-array.uint8-array.js");
@@ -53,6 +54,7 @@ function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
 function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 const WIDGET_FONT = "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif";
+const PHONE_RE = /^(0|\+212|0212)[5-7]\d{8}$/;
 const ContentPanel = _ref => {
   let {
     isOpen,
@@ -1253,6 +1255,7 @@ const CustomChatInterface = _ref3 => {
   });
 };
 const ReclamationFormModal = _ref4 => {
+  var _formData$service;
   let {
     open,
     onClose
@@ -1261,8 +1264,10 @@ const ReclamationFormModal = _ref4 => {
   const [formData, setFormData] = (0, _react.useState)({
     type: "",
     service: "",
+    nature: "",
     objet: "",
     sujet: "",
+    telephone: "",
     files: []
   });
   const [submitted, setSubmitted] = (0, _react.useState)(false);
@@ -1275,6 +1280,10 @@ const ReclamationFormModal = _ref4 => {
     data: listServiceReclamation,
     isFetching: isFetchingListServiceReclamation
   } = (0, _useReclamation.useListServiceReclamation)();
+  const {
+    data: listNatureReclamation,
+    isFetching: isFetchingListNatureReclamation
+  } = (0, _useReclamation.useListNatureReclamation)((_formData$service = formData.service) === null || _formData$service === void 0 ? void 0 : _formData$service.codigo);
   const [error, setError] = (0, _react.useState)(null);
   const errorRef = (0, _react.useRef)(null);
   const CustomPopper = props => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Popper, _objectSpread(_objectSpread({}, props), {}, {
@@ -1296,6 +1305,12 @@ const ReclamationFormModal = _ref4 => {
     extensions: ".pdf,.doc,.docx,.xls,.xlsx,.jpg,.jpeg,.png,.gif",
     mimeTypes: ["application/pdf", "application/msword", "application/vnd.openxmlformats-officedocument.wordprocessingml.document", "application/vnd.ms-excel", "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", "image/jpeg", "image/png", "image/gif"]
   };
+  const dialogContentRef = (0, _react.useRef)(null);
+  (0, _react.useEffect)(() => {
+    if (dialogContentRef.current) {
+      dialogContentRef.current.scrollTop = 0;
+    }
+  }, [activeStep]);
   (0, _react.useEffect)(() => {
     if (!open) {
       setTimeout(() => {
@@ -1312,6 +1327,11 @@ const ReclamationFormModal = _ref4 => {
       }, 300);
     }
   }, [open]);
+  (0, _react.useEffect)(() => {
+    setFormData(prev => _objectSpread(_objectSpread({}, prev), {}, {
+      nature: ""
+    }));
+  }, [formData.service]);
   (0, _react.useEffect)(() => {
     if (error && errorRef.current) {
       errorRef.current.scrollIntoView({
@@ -1392,8 +1412,8 @@ const ReclamationFormModal = _ref4 => {
     onClose();
   };
   const canProceedStep1 = formData.type !== "";
-  const canProceedStep2 = formData.service !== "";
-  const canSubmit = formData.objet && formData.sujet;
+  const canProceedStep2 = formData.service !== "" && formData.nature !== "";
+  const canSubmit = formData.objet && formData.sujet && PHONE_RE.test(formData.telephone.replace(/[\s.-]/g, ""));
   const renderStepContent = () => {
     switch (activeStep) {
       case 0:
@@ -1486,34 +1506,72 @@ const ReclamationFormModal = _ref4 => {
               sx: {
                 mt: 3
               }
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Autocomplete, {
-              options: listServiceReclamation || [],
-              loading: isFetchingListServiceReclamation,
-              value: formData.service || "",
-              onChange: handleServiceChange,
-              getOptionLabel: option => (option === null || option === void 0 ? void 0 : option.libelle) || "",
-              renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, _objectSpread(_objectSpread({}, params), {}, {
-                label: "Rechercher un service",
-                placeholder: "Commencez \xE0 taper...",
-                variant: "outlined",
-                fullWidth: true
-              })),
-              renderOption: (props, option) => /*#__PURE__*/(0, _jsxRuntime.jsx)("li", _objectSpread(_objectSpread({}, props), {}, {
-                className: "service-option",
-                children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
-                  display: "flex",
-                  alignItems: "center",
-                  gap: 1,
-                  children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
-                    className: "service-bullet"
-                  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
-                    children: option === null || option === void 0 ? void 0 : option.libelle
-                  })]
-                })
-              })),
-              PopperComponent: CustomPopper,
-              noOptionsText: "Aucun service trouv\xE9",
-              className: "service-autocomplete"
+            }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+              sx: {
+                display: "flex",
+                flexDirection: "column",
+                gap: 3
+              },
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Autocomplete, {
+                options: listServiceReclamation || [],
+                loading: isFetchingListServiceReclamation,
+                value: formData.service || "",
+                onChange: handleServiceChange,
+                getOptionLabel: option => (option === null || option === void 0 ? void 0 : option.libelle) || "",
+                renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, _objectSpread(_objectSpread({}, params), {}, {
+                  label: "Rechercher un service",
+                  placeholder: "Commencez \xE0 taper...",
+                  variant: "outlined",
+                  fullWidth: true
+                })),
+                renderOption: (props, option) => /*#__PURE__*/(0, _jsxRuntime.jsx)("li", _objectSpread(_objectSpread({}, props), {}, {
+                  className: "service-option",
+                  children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: 1,
+                    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+                      className: "service-bullet"
+                    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
+                      children: option === null || option === void 0 ? void 0 : option.libelle
+                    })]
+                  })
+                })),
+                PopperComponent: CustomPopper,
+                noOptionsText: "Aucun service trouv\xE9",
+                className: "service-autocomplete"
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Autocomplete, {
+                options: listNatureReclamation || [],
+                loading: isFetchingListNatureReclamation,
+                value: formData.nature || "",
+                disabled: !formData.service,
+                onChange: (e, value) => setFormData(prev => _objectSpread(_objectSpread({}, prev), {}, {
+                  nature: value
+                })),
+                getOptionLabel: option => (option === null || option === void 0 ? void 0 : option.libelle) || "",
+                renderInput: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, _objectSpread(_objectSpread({}, params), {}, {
+                  label: "Nature de la demande",
+                  placeholder: formData.service ? "Commencez à taper..." : "Sélectionnez d'abord un service",
+                  variant: "outlined",
+                  fullWidth: true
+                })),
+                renderOption: (props, option) => /*#__PURE__*/(0, _jsxRuntime.jsx)("li", _objectSpread(_objectSpread({}, props), {}, {
+                  className: "service-option",
+                  children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: 1,
+                    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+                      className: "service-bullet"
+                    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
+                      children: option === null || option === void 0 ? void 0 : option.libelle
+                    })]
+                  })
+                })),
+                PopperComponent: CustomPopper,
+                noOptionsText: "Aucune nature trouv\xE9e",
+                className: "service-autocomplete"
+              })]
             })]
           })
         });
@@ -1538,6 +1596,18 @@ const ReclamationFormModal = _ref4 => {
             }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
               className: "form-fields",
               children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, {
+                fullWidth: true,
+                required: true,
+                label: "T\xE9l\xE9phone",
+                value: formData.telephone,
+                onChange: e => setFormData(prev => _objectSpread(_objectSpread({}, prev), {}, {
+                  telephone: e.target.value
+                })),
+                error: Boolean(formData.telephone) && !PHONE_RE.test(formData.telephone.replace(/[\s.-]/g, "")),
+                helperText: "Format : 06 61 00 00 00, +212 6 61 00 00 00 ou 0212 6 61 00 00 00.",
+                variant: "outlined",
+                className: "form-field"
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, {
                 fullWidth: true,
                 required: true,
                 label: "Objet",
@@ -1566,6 +1636,9 @@ const ReclamationFormModal = _ref4 => {
                 }
               }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
                 className: "file-upload-section",
+                sx: {
+                  mb: 3
+                },
                 children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
                   type: "file",
                   id: "file-upload",
@@ -1695,7 +1768,7 @@ const ReclamationFormModal = _ref4 => {
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
             variant: "h6",
             className: "header-title",
-            children: "Nouvelle r\xE9clamation"
+            children: "Nouvelle demande d'assistance"
           }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Typography, {
             variant: "caption",
             color: "white",
@@ -1723,6 +1796,7 @@ const ReclamationFormModal = _ref4 => {
         }, label))
       })]
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.DialogContent, {
+      ref: dialogContentRef,
       className: "modal-content",
       style: {
         overflow: activeStep === 1 ? "visible" : "auto"
@@ -1829,16 +1903,18 @@ const ReclamationsList = _ref5 => {
         return "#757575";
     }
   };
-  const isHtml = str => /<\/?[a-z][\s\S]*>/i.test(str);
+  const URL_RE = /(https?:\/\/[^\s)]+)/g;
   const renderTextWithLinks = text => {
     if (!text) return null;
-    const parts = text.split(/(https?:\/\/[^\s)]+)/g);
+    const parts = text.split(URL_RE);
     return parts.map((part, i) => /^https?:\/\//.test(part) ? /*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
       href: part,
       target: "_blank",
       rel: "noopener noreferrer",
       style: {
         color: "var(--primary-color, #222f67)",
+        fontWeight: 600,
+        textDecoration: "underline",
         wordBreak: "break-all"
       },
       children: part
@@ -1846,6 +1922,7 @@ const ReclamationsList = _ref5 => {
       children: part
     }, i));
   };
+  const isHtml = str => /<\/?[a-z][\s\S]*>/i.test(str);
   const handleReclamationClick = reclamation => {
     setSelectedReclamation(reclamation);
     setDetailsDialogOpen(true);
@@ -1993,7 +2070,7 @@ const ReclamationsList = _ref5 => {
                 margin: 0,
                 lineHeight: "normal"
               },
-              children: "Mes r\xE9clamations"
+              children: "Mes demandes d'assistance"
             }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Typography, {
               component: "div",
               sx: {
@@ -2347,6 +2424,29 @@ const ReclamationsList = _ref5 => {
               },
               children: selectedReclamation === null || selectedReclamation === void 0 ? void 0 : selectedReclamation.service
             })]
+          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
+              component: "div",
+              sx: {
+                fontSize: "11px",
+                color: "#999",
+                fontWeight: "500",
+                marginBottom: "6px",
+                textTransform: "uppercase",
+                letterSpacing: "0.5px",
+                fontFamily: WIDGET_FONT
+              },
+              children: "Nature de la demande"
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
+              component: "div",
+              sx: {
+                fontSize: "14px",
+                color: "#333",
+                fontWeight: "500",
+                fontFamily: WIDGET_FONT
+              },
+              children: selectedReclamation === null || selectedReclamation === void 0 ? void 0 : selectedReclamation.nature
+            })]
           }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
             children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
               component: "div",
@@ -2419,7 +2519,7 @@ const ReclamationsList = _ref5 => {
                 whiteSpace: "pre-line",
                 fontFamily: WIDGET_FONT
               },
-              children: selectedReclamation === null || selectedReclamation === void 0 ? void 0 : selectedReclamation.description
+              children: renderTextWithLinks(selectedReclamation === null || selectedReclamation === void 0 ? void 0 : selectedReclamation.description)
             })]
           }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
             children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Typography, {
@@ -2638,7 +2738,7 @@ const ReclamationsList = _ref5 => {
                             fontFamily: WIDGET_FONT
                           },
                           children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
-                            children: [entry.changedByNom ? entry.changedByNom : "Service Odoo", " \xB7 "]
+                            children: [entry.changedByNom ? entry.changedByNom : "Service Odoo", " ", "\xB7", " "]
                           }), formatDate(entry.dateChangement)]
                         })]
                       })
@@ -2654,7 +2754,7 @@ const ReclamationsList = _ref5 => {
                         border: "1px solid #e0e0e0",
                         whiteSpace: "pre-line"
                       },
-                      children: entry.commentaire
+                      children: renderTextWithLinks(entry.commentaire)
                     }), entry.reponse && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
                       style: {
                         marginTop: "8px",
@@ -2688,7 +2788,7 @@ const ReclamationsList = _ref5 => {
                         style: {
                           whiteSpace: "pre-line"
                         },
-                        children: entry.reponse
+                        children: renderTextWithLinks(entry.reponse)
                       })]
                     }), ((_entry$documents = entry.documents) === null || _entry$documents === void 0 ? void 0 : _entry$documents.length) > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
                       style: {
@@ -3740,7 +3840,7 @@ const PuiHelpWidget = _ref7 => {
     action: handleFaqClick
   }, ...(showReclamation ? [{
     icon: _freeSolidSvgIcons.faClipboardList,
-    title: "Mes réclamations",
+    title: "Mes demandes d'assistance",
     id: "mes-reclamations",
     action: () => {
       queryClient.invalidateQueries("get_list_reclamation");
@@ -3748,7 +3848,7 @@ const PuiHelpWidget = _ref7 => {
     }
   }, {
     icon: _freeSolidSvgIcons.faBullhorn,
-    title: "Nouvelle réclamation",
+    title: "Nouvelle demande d'assistance",
     id: "nouvelle-reclamation",
     action: () => setReclamationModalOpen(true)
   }] : []), {

package/dist/hooks/useReclamation.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useReouvreReclamation = exports.useListServiceReclamation = exports.useListReclamation = exports.useDownloadDocument = exports.useCreateReclamation = exports.useClotureReclamation = void 0;
+exports.useReouvreReclamation = exports.useListServiceReclamation = exports.useListReclamation = exports.useListNatureReclamation = exports.useDownloadDocument = exports.useCreateReclamation = exports.useClotureReclamation = void 0;
 var _reactQuery = require("react-query");
 var _PuiHelpWidgetContext = require("../components/common/PuiHelpWidgetContext");
 const useListReclamation = (page, search) => {
@@ -24,6 +24,22 @@ const useListReclamation = (page, search) => {
   });
 };
 exports.useListReclamation = useListReclamation;
+const useListNatureReclamation = serviceCode => {
+  const {
+    reclamationApi,
+    portailId
+  } = (0, _PuiHelpWidgetContext.useHelpWidget)();
+  return (0, _reactQuery.useQuery)({
+    queryKey: ["get_list_nature_reclamation", portailId, serviceCode],
+    queryFn: () => reclamationApi.getListNatureReclamationApi(portailId, serviceCode),
+    enabled: Boolean(serviceCode),
+    initialData: [],
+    retry: 1,
+    refetchOnWindowFocus: false,
+    refetchOnReconnect: false
+  });
+};
+exports.useListNatureReclamation = useListNatureReclamation;
 const useCreateReclamation = () => {
   const {
     reclamationApi,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@portnet/ui",
-  "version": "5.0.28",
+  "version": "5.0.30",
   "description": "Portnet UI",
   "keywords": [
     "react",
@@ -103,6 +103,7 @@
     "@storybook/testing-library": "^0.2.2",
     "ajv": "^8.17.1",
     "ajv-keywords": "^5.1.0",
+    "axios": "^0.27.2",
     "cross-env": "^7.0.3",
     "husky": "^4.3.8",
     "prop-types": "^15.8.1",
@@ -110,4 +111,4 @@
     "storybook": "^7.6.4",
     "webpack": "^5.75.0"
   }
-}
+}