@licklist/design 0.44.485-dev.39 → 0.44.485-dev.40

package/dist/iframe/order-process/components/Timer/utils/index.d.ts

@@ -1,2 +1,2 @@
-export declare const fancyTimeFormat: (duration: number) => string;
+export declare const fancyTimeFormat: (miliseconds: number) => string;
 //# sourceMappingURL=index.d.ts.map

package/dist/iframe/order-process/components/Timer/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/order-process/components/Timer/utils/index.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe,aAAc,MAAM,WAS/C,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/order-process/components/Timer/utils/index.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe,gBAAiB,MAAM,WASlD,CAAC"}

package/dist/iframe/order-process/components/Timer/utils/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.fancyTimeFormat=function(t){var o=Math.floor(t%3600/60),e=Math.floor(t)%60,r="";return r+="".concat(o,":").concat(e<10?"0":""),r+="".concat(e)};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.fancyTimeFormat=function(e){var t=new Date(e),c=t.getMinutes(),n=t.getSeconds(),o="";return o+="".concat(c,":").concat(n<10?"0":""),o+="".concat(n)};

package/dist/iframe/payment/payment-page/PaymentTimer.d.ts

@@ -1,3 +1,4 @@
 /// <reference types="react" />
+export declare const PAYMENT_TIMER_TOTAL_TIME = 600000;
 export declare const PaymentTimer: () => JSX.Element;
 //# sourceMappingURL=PaymentTimer.d.ts.map

package/dist/iframe/payment/payment-page/PaymentTimer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PaymentTimer.d.ts","sourceRoot":"","sources":["../../../../src/iframe/payment/payment-page/PaymentTimer.tsx"],"names":[],"mappings":";AAIA,eAAO,MAAM,YAAY,mBAaxB,CAAC"}
+{"version":3,"file":"PaymentTimer.d.ts","sourceRoot":"","sources":["../../../../src/iframe/payment/payment-page/PaymentTimer.tsx"],"names":[],"mappings":";AAMA,eAAO,MAAM,wBAAwB,SAAS,CAAC;AAE/C,eAAO,MAAM,YAAY,mBAkCxB,CAAC"}

package/dist/iframe/payment/payment-page/PaymentTimer.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,r=require("react"),o=(e=r)&&"object"==typeof e&&"default"in e?e.default:e;require("../../order-process/components/NavigationFooter/NavigationFooter.js");var t=require("@licklist/plugins/dist/context/payment/PaymentSessionContext");require("../../order-process/components/BookingSummary/BookingSummary.js"),require("../../order-process/components/NavigationSteps/NavigationSteps.js"),require("../../order-process/components/StepsForm/StepsForm.js");var s=require("../../order-process/components/Timer/Timer.js");require("../../order-process/components/PaymentCard/PaymentCard.js"),require("../../order-process/components/BookingSummaryFooter/BookingSummaryFooter.js"),require("../../order-process/components/CalendarStepsForm/CalendarStepsForm.js");exports.PaymentTimer=function(){var e=r.useContext(t.PaymentSessionContext),n=e.timer,i=e.startPaymentSessionTimer,a=e.isTimerStarted,m=e.setTimer;return r.useLayoutEffect((function(){m(600),a||i()}),[]),o.createElement(s.Timer,{timer:n})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,r=require("react"),o=(e=r)&&"object"==typeof e&&"default"in e?e.default:e;require("../../order-process/components/NavigationFooter/NavigationFooter.js");var t=require("@licklist/plugins/dist/context/payment/PaymentSessionContext"),s=require("@licklist/plugins/dist");require("../../order-process/components/BookingSummary/BookingSummary.js"),require("../../order-process/components/NavigationSteps/NavigationSteps.js"),require("../../order-process/components/StepsForm/StepsForm.js");var i=require("../../order-process/components/Timer/Timer.js");require("../../order-process/components/PaymentCard/PaymentCard.js"),require("../../order-process/components/BookingSummaryFooter/BookingSummaryFooter.js"),require("../../order-process/components/CalendarStepsForm/CalendarStepsForm.js");var n=6e5;exports.PAYMENT_TIMER_TOTAL_TIME=n,exports.PaymentTimer=function(){var e=s.useTimer({timerTime:n}),m=e.timer,a=e.startTimer,u=e.isTimerStarted,c=e.resetTimer,p=r.useContext(t.PaymentSessionContext),d=p.setIsPaymentSessionExpired,T=p.isResetTimer;return r.useEffect((function(){T&&c()}),[T]),r.useEffect((function(){m>1e3||(d(!0),c())}),[m]),r.useLayoutEffect((function(){u||a()}),[]),o.createElement(i.Timer,{timer:m})};

package/dist/sales/manual-booking/create-user/CreateUser.js

@@ -1 +1 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("tslib"),a=require("react"),i=e(a),r=require("react-i18next"),l=e(require("@licklist/plugins/dist/context/app/hooks/useNotification")),n=require("react-bootstrap"),s=require("../../../static/Icon.js"),o=require("react-hook-form"),d=e(require("clsx")),u=require("../../../static/manual-date-picker/utils/index.js"),m=require("../../../static/manual-date-picker/ManualDatePicker.js");require("../../../static/index.js");var c=require("../../../static/manual-date-picker/hooks/useManualDatePicker.js"),v=e(require("@licklist/plugins/dist/validation/Rules/lettersRule")),p=require("@licklist/plugins/dist"),h=require("@licklist/core/dist/Config/DefaultUser");exports.CreateUser=function(e){var f,b=e.goToSearchUsers,N=e.providerId,g=r.useTranslation(["Sale","Design","App","Validation"]).t,E=l(),_=p.useDashboardUserApi(N).create,k=o.useFormContext(),y=k.formState,D=y.errors,F=y.isSubmitted,S=k.register,q=k.setValue,x=k.watch,C=k.getValues,I=x("birthdate"),V=x("firstName"),A=t.__read(c.useManualDatePicker({isRequired:!1,isSubmitted:F,fieldName:"birthdate",value:I,fieldErrors:p.HookFormService.getErrors("birthdate",D)}),2),L=A[0],R=A[1],j=R.isChoosedDateValid,U=R.fieldErrors,M=L.day,T=L.year,w=L.month;a.useEffect((function(){M&&w&&T&&j()&&q("birthdate",u.dateToSqlDate(M,w,T),{shouldValidate:!0})}),[M,w,T]);return i.createElement(i.Fragment,null,i.createElement(n.Button,{as:"button",type:"button",onClick:b,variant:"primary",className:"mb-4 mt-4 align-items-center d-flex"},g("Design:search"),i.createElement(s.default,{type:"search",height:"1.4rem",width:"1.4rem",className:"ml-3"})),i.createElement("div",{className:"input-label"},g("Design:firstName"),i.createElement("span",{className:"text-danger"},"*")),i.createElement(n.Form.Control,t.__assign({type:"text",isInvalid:!!(null==D?void 0:D.firstName)},S("firstName",{pattern:v,maxLength:255,required:!0}))),i.createElement(n.Form.Control.Feedback,{type:"invalid"},p.HookFormService.hasError(null==D?void 0:D.firstName,"required")&&g("Validation:fieldRequired",{attribute:g("Design:firstName")}),p.HookFormService.hasError(null==D?void 0:D.firstName,"pattern")&&g("Sale:fieldIsNotValid",{attribute:g("Design:firstName")})),i.createElement("div",{className:"input-label"},g("Design:lastName")),i.createElement(n.Form.Control,t.__assign({type:"text",isInvalid:!!(null==D?void 0:D.lastName)},S("lastName",{pattern:v,maxLength:255}))),i.createElement(n.Form.Control.Feedback,{type:"invalid"},(null==D?void 0:D.lastName)&&g("Sale:fieldIsNotValid",{attribute:g("Design:lastName")})),i.createElement("div",{className:"input-label"},g("Design:email")),i.createElement(n.Form.Control,t.__assign({type:"text",isInvalid:p.HookFormService.isInvalid("email",D)},S("email",{pattern:p.emailRule,maxLength:255}))),i.createElement(n.Form.Control.Feedback,{type:"invalid"},(null==D?void 0:D.email)&&g("Sale:fieldIsNotValid",{attribute:g("Design:email")})),i.createElement("div",{className:"input-label"},g("Design:phone")),i.createElement(n.Form.Control,t.__assign({type:"number"},S("phone",{pattern:p.phoneRule,maxLength:255}),{isInvalid:!!(null==D?void 0:D.phone)})),i.createElement(n.Form.Control.Feedback,{type:"invalid"},(null==D?void 0:D.phone)&&g("Sale:fieldIsNotValid",{attribute:"phone number"})),i.createElement("div",{className:"input-label"},g("Design:dayOfBirthShort")),i.createElement(n.Form.Control,t.__assign({type:"hidden"},S("birthdate",{validate:function(e){return!e||(!!p.checkIsValidBirthday(e)||"".concat(g("Sale:fieldIsNotValid",{attribute:g("App:birthday")})))}}),{isInvalid:!!D.birthdate,className:d("datetime-form-picker",I&&"date-input-with-value")})),i.createElement("div",{className:"d-flex"},i.createElement(m.ManualDatePicker,t.__assign({},L,{isRequred:!1}))),i.createElement(n.Form.Control.Feedback,{type:"invalid"},(null===(f=null==D?void 0:D.birthdate)||void 0===f?void 0:f.message)||U()),i.createElement(n.Button,{as:"button",type:"button",onClick:function(){return t.__awaiter(void 0,void 0,void 0,(function(){var e,a,i,r,l,n,s;return t.__generator(this,(function(o){switch(o.label){case 0:return e=C(),[4,_.execute({first_name:e.firstName,last_name:e.lastName,email:e.email,user_detail:{phone:e.phone,birthday:e.birthdate}})];case 1:return(a=o.sent())?(i={userId:String(a.id),firstName:a.firstName,lastName:a.lastName===h.DEFAULT_USER_LAST_NAME?null:a.lastName,email:a.email===h.DEFAULT_USER_EMAIL?null:a.email,phone:(null==a?void 0:a.userDetail)&&(null===(r=null==a?void 0:a.userDetail)||void 0===r?void 0:r.phone)?String(null===(l=null==a?void 0:a.userDetail)||void 0===l?void 0:l.phone):void 0,birthdate:(null==a?void 0:a.userDetail)&&(null===(n=a.userDetail)||void 0===n?void 0:n.birthday)?null===(s=a.userDetail)||void 0===s?void 0:s.birthday:void 0},Object.entries(i).forEach((function(e){var a=t.__read(e,2),i=a[0],r=a[1];q(i,r)})),E.success({title:g("App:success"),message:g("Notification:customerAddedSuccessfully")}),[2]):[2]}}))}))},variant:"primary",className:"mb-4",disabled:!V||(null==D?void 0:D.firstName)||(null==D?void 0:D.lastName)||(null==D?void 0:D.email)||(null==D?void 0:D.phone)||(null==D?void 0:D.birthday)||_.isLoading},g("Sale:addCustomer")))};
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("tslib"),a=require("react"),i=e(a),r=require("react-i18next"),l=e(require("@licklist/plugins/dist/context/app/hooks/useNotification")),n=require("react-bootstrap"),s=require("../../../static/Icon.js"),o=require("react-hook-form"),d=e(require("clsx")),u=require("../../../static/manual-date-picker/utils/index.js"),m=require("../../../static/manual-date-picker/ManualDatePicker.js");require("../../../static/index.js");var c=require("@licklist/plugins/dist"),v=require("../../../static/manual-date-picker/hooks/useManualDatePicker.js"),p=e(require("@licklist/plugins/dist/validation/Rules/lettersRule")),h=require("@licklist/core/dist/Config/DefaultUser");exports.CreateUser=function(e){var f,b=e.goToSearchUsers,N=e.providerId,g=r.useTranslation(["Sale","Design","App","Validation"]).t,E=l(),_=c.useDashboardUserApi(N).create,k=o.useFormContext(),y=k.formState,D=y.errors,F=y.isSubmitted,S=k.register,q=k.setValue,x=k.watch,C=k.getValues,I=x("birthdate"),V=x("firstName"),A=t.__read(v.useManualDatePicker({isRequired:!1,isSubmitted:F,fieldName:"birthdate",value:I,fieldErrors:c.HookFormService.getErrors("birthdate",D)}),2),L=A[0],R=A[1],j=R.isChoosedDateValid,U=R.fieldErrors,M=L.day,T=L.year,w=L.month;a.useEffect((function(){M&&w&&T&&j()&&q("birthdate",u.dateToSqlDate(M,w,T),{shouldValidate:!0})}),[M,w,T]);return i.createElement(i.Fragment,null,i.createElement(n.Button,{as:"button",type:"button",onClick:b,variant:"primary",className:"mb-4 mt-4 align-items-center d-flex"},g("Design:search"),i.createElement(s.default,{type:"search",height:"1.4rem",width:"1.4rem",className:"ml-3"})),i.createElement("div",{className:"input-label"},g("Design:firstName"),i.createElement("span",{className:"text-danger"},"*")),i.createElement(n.Form.Control,t.__assign({type:"text",isInvalid:!!(null==D?void 0:D.firstName)},S("firstName",{pattern:p,maxLength:255,required:!0}))),i.createElement(n.Form.Control.Feedback,{type:"invalid"},c.HookFormService.hasError(null==D?void 0:D.firstName,"required")&&g("Validation:fieldRequired",{attribute:g("Design:firstName")}),c.HookFormService.hasError(null==D?void 0:D.firstName,"pattern")&&g("Sale:fieldIsNotValid",{attribute:g("Design:firstName")})),i.createElement("div",{className:"input-label"},g("Design:lastName")),i.createElement(n.Form.Control,t.__assign({type:"text",isInvalid:!!(null==D?void 0:D.lastName)},S("lastName",{pattern:p,maxLength:255}))),i.createElement(n.Form.Control.Feedback,{type:"invalid"},(null==D?void 0:D.lastName)&&g("Sale:fieldIsNotValid",{attribute:g("Design:lastName")})),i.createElement("div",{className:"input-label"},g("Design:email")),i.createElement(n.Form.Control,t.__assign({type:"text",isInvalid:c.HookFormService.isInvalid("email",D)},S("email",{pattern:c.emailRule,maxLength:255}))),i.createElement(n.Form.Control.Feedback,{type:"invalid"},(null==D?void 0:D.email)&&g("Sale:fieldIsNotValid",{attribute:g("Design:email")})),i.createElement("div",{className:"input-label"},g("Design:phone")),i.createElement(n.Form.Control,t.__assign({type:"number"},S("phone",{pattern:c.phoneRule,maxLength:255}),{isInvalid:!!(null==D?void 0:D.phone)})),i.createElement(n.Form.Control.Feedback,{type:"invalid"},(null==D?void 0:D.phone)&&g("Sale:fieldIsNotValid",{attribute:"phone number"})),i.createElement("div",{className:"input-label"},g("Design:dayOfBirthShort")),i.createElement(n.Form.Control,t.__assign({type:"hidden"},S("birthdate",{validate:function(e){return!e||(!!c.checkIsValidBirthday(e)||"".concat(g("Sale:fieldIsNotValid",{attribute:g("App:birthday")})))}}),{isInvalid:!!D.birthdate,className:d("datetime-form-picker",I&&"date-input-with-value")})),i.createElement("div",{className:"d-flex"},i.createElement(m.ManualDatePicker,t.__assign({},L,{isRequred:!1}))),i.createElement(n.Form.Control.Feedback,{type:"invalid"},(null===(f=null==D?void 0:D.birthdate)||void 0===f?void 0:f.message)||U()),i.createElement(n.Button,{as:"button",type:"button",onClick:function(){return t.__awaiter(void 0,void 0,void 0,(function(){var e,a,i,r,l,n,s;return t.__generator(this,(function(o){switch(o.label){case 0:return e=C(),[4,_.execute({first_name:e.firstName,last_name:e.lastName,email:e.email,user_detail:{phone:e.phone,birthday:e.birthdate}})];case 1:return(a=o.sent())?(i={userId:String(a.id),firstName:a.firstName,lastName:a.lastName===h.DEFAULT_USER_LAST_NAME?null:a.lastName,email:a.email===h.DEFAULT_USER_EMAIL?null:a.email,phone:(null==a?void 0:a.userDetail)&&(null===(r=null==a?void 0:a.userDetail)||void 0===r?void 0:r.phone)?String(null===(l=null==a?void 0:a.userDetail)||void 0===l?void 0:l.phone):void 0,birthdate:(null==a?void 0:a.userDetail)&&(null===(n=a.userDetail)||void 0===n?void 0:n.birthday)?null===(s=a.userDetail)||void 0===s?void 0:s.birthday:void 0},Object.entries(i).forEach((function(e){var a=t.__read(e,2),i=a[0],r=a[1];q(i,r)})),E.success({title:g("App:success"),message:g("Notification:customerAddedSuccessfully")}),[2]):[2]}}))}))},variant:"primary",className:"mb-4",disabled:!V||(null==D?void 0:D.firstName)||(null==D?void 0:D.lastName)||(null==D?void 0:D.email)||(null==D?void 0:D.phone)||(null==D?void 0:D.birthday)||_.isLoading},g("Sale:addCustomer")))};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@licklist/design",
-  "version": "0.44.485-dev.39",
+  "version": "0.44.485-dev.40",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@bitbucket.org/artelogicsoft/licklist_design.git"

package/src/iframe/order-process/OrderProcess.stories.tsx

@@ -198,14 +198,14 @@ export default {
 } as Meta;
 
 const TimerWrapper = () => {
-  const [timer, setTimer] = useState(60);
+  const [timer, setTimer] = useState(120000);
   const updateTimerState = () => {
     setTimer((prevValue) => {
       if (prevValue <= 0) {
         return 0;
       }
 
-      const nexValue = prevValue - 1;
+      const nexValue = prevValue - 1000;
 
       return nexValue;
     });

package/src/iframe/order-process/components/Timer/Timer.stories.tsx

@@ -11,7 +11,7 @@ export function Default() {
   return (
     <div className="payment-process">
       <div className="col-lg-4">
-        <Timer timer={300} />
+        <Timer timer={120000} />
       </div>
     </div>
   );

package/src/iframe/order-process/components/Timer/utils/index.ts

@@ -1,7 +1,7 @@
-export const fancyTimeFormat = (duration: number) => {
-  const mins = Math.floor((duration % 3600) / 60);
-  const secs = Math.floor(duration) % 60;
-
+export const fancyTimeFormat = (miliseconds: number) => {
+  const date = new Date(miliseconds);
+  const mins = date.getMinutes();
+  const secs = date.getSeconds();
   let timerString = "";
 
   timerString += `${mins}:${secs < 10 ? "0" : ""}`;

package/src/iframe/payment/payment-page/PaymentTimer.tsx

@@ -1,16 +1,41 @@
-import React, { useContext, useLayoutEffect } from "react";
+import React, { useContext, useEffect, useLayoutEffect } from "react";
 import { PaymentSessionContext } from "@licklist/plugins/dist/context/payment/PaymentSessionContext";
+import { useTimer } from "@licklist/plugins/dist";
 import { Timer } from "../../order-process";
 
+// 10 minutes in ms
+export const PAYMENT_TIMER_TOTAL_TIME = 600000;
+
 export const PaymentTimer = () => {
-  const { timer, startPaymentSessionTimer, isTimerStarted, setTimer } =
-    useContext(PaymentSessionContext);
+  const { timer, startTimer, isTimerStarted, resetTimer } = useTimer({
+    timerTime: PAYMENT_TIMER_TOTAL_TIME,
+  });
+
+  const { setIsPaymentSessionExpired, isResetTimer } = useContext(
+    PaymentSessionContext
+  );
+
+  useEffect(() => {
+    if (!isResetTimer) {
+      return;
+    }
+    resetTimer();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [isResetTimer]);
+
+  useEffect(() => {
+    // Sometimes we can get not round time in ms
+    if (timer > 1000) {
+      return;
+    }
+    setIsPaymentSessionExpired(true);
+    resetTimer();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [timer]);
 
   useLayoutEffect(() => {
-    setTimer(600);
     if (isTimerStarted) return;
-
-    startPaymentSessionTimer();
+    startTimer();
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);