@licklist/design 0.44.476-dev.4 → 0.44.476-dev.6
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/dist/iframe/order-process/components/BookingSummary/BookingSummary.d.ts +1 -1
- package/dist/iframe/order-process/components/BookingSummary/BookingSummary.d.ts.map +1 -1
- package/dist/iframe/order-process/components/BookingSummary/BookingSummary.js +1 -1
- package/dist/iframe/order-process/components/BookingSummary/components/SummaryTotal/SummaryTotal.d.ts.map +1 -1
- package/dist/iframe/order-process/components/BookingSummary/components/SummaryTotal/SummaryTotal.js +1 -1
- package/dist/iframe/order-process/components/BookingSummary/types/index.d.ts +2 -1
- package/dist/iframe/order-process/components/BookingSummary/types/index.d.ts.map +1 -1
- package/dist/iframe/order-process/components/BookingSummary/utils/index.d.ts +0 -4
- package/dist/iframe/order-process/components/BookingSummary/utils/index.d.ts.map +1 -1
- package/dist/iframe/order-process/components/BookingSummary/utils/index.js +1 -1
- package/dist/sales/manual-booking/select-menu/SelectMenu.d.ts.map +1 -1
- package/dist/sales/manual-booking/select-menu/SelectMenu.js +1 -1
- package/dist/sales/notes/note-form/NoteForm.d.ts.map +1 -1
- package/dist/sales/notes/note-form/NoteForm.js +1 -1
- package/package.json +1 -1
- package/src/iframe/order-process/OrderProcess.stories.tsx +2 -5
- package/src/iframe/order-process/components/BookingSummary/BookingSummary.stories.tsx +2 -2
- package/src/iframe/order-process/components/BookingSummary/BookingSummary.tsx +6 -13
- package/src/iframe/order-process/components/BookingSummary/components/SummaryTotal/SummaryTotal.tsx +4 -12
- package/src/iframe/order-process/components/BookingSummary/types/index.ts +2 -1
- package/src/iframe/order-process/components/BookingSummary/utils/index.ts +0 -21
- package/src/iframe/order-process/components/CalendarStepsForm/CalendarStepsForm.stories.tsx +9 -1
- package/src/sales/manual-booking/select-menu/SelectMenu.tsx +3 -1
- package/src/sales/notes/note-form/NoteForm.tsx +21 -3
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { BookingSummaryProps } from "./types";
|
|
3
3
|
export declare const BookingSummary: {
|
|
4
|
-
({ date, menuSteps, formValues, isNotShownPeopleAmount, eventName, transactionFee, productsWithErrors, isLoading, hasPeopleInput, }: Omit<BookingSummaryProps, "totallWithDiscount">): JSX.Element;
|
|
4
|
+
({ date, menuSteps, formValues, isNotShownPeopleAmount, eventName, transactionFee, productsWithErrors, isLoading, hasPeopleInput, peopleAmount, }: Omit<BookingSummaryProps, "totallWithDiscount">): JSX.Element;
|
|
5
5
|
SummaryTotal: ({ formValues, totalWithDiscount, transactionFee, isFreePayment, }: Pick<BookingSummaryProps, "formValues" | "totalWithDiscount" | "transactionFee" | "isFreePayment">) => JSX.Element;
|
|
6
6
|
Accordion: ({ children, title, showTitleOnlyOnMobile, hasPeopleInput, }: import("./components/BookingSummaryAccordion").BookingSummaryAccordionProps) => JSX.Element;
|
|
7
7
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BookingSummary.d.ts","sourceRoot":"","sources":["../../../../../src/iframe/order-process/components/BookingSummary/BookingSummary.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"BookingSummary.d.ts","sourceRoot":"","sources":["../../../../../src/iframe/order-process/components/BookingSummary/BookingSummary.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAI9C,eAAO,MAAM,cAAc;uJAWxB,KAAK,mBAAmB,EAAE,oBAAoB,CAAC;;;CAyEjD,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),r=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,a=require("@licklist/core/dist/Config"),n=require("../../../../static/loader/LoaderIndicator.js"),m=require("react-i18next");require("../../../../static/index.js");var o=require("react-intl");require("./components/SummaryTotal/components/SummaryTotalBlock.js");var c=require("./components/ProductsByMenuStep/ProductsByMenuStep.js"),l=require("./components/SummaryTotal/SummaryTotal.js"),s=require("./components/BookingSummaryAccordion/BookingSummaryAccordion.js"),i=function(e){var l=e.date,i=e.menuSteps,u=e.formValues,d=e.isNotShownPeopleAmount,p=e.eventName,y=e.transactionFee,E=void 0===y?0:y,v=e.productsWithErrors,f=e.isLoading,N=e.hasPeopleInput,S=e.peopleAmount,g=m.useTranslation("Design").t,B=o.useIntl().formatNumber,j=t.useMemo((function(){var e=Object.values(u).filter(Boolean);return null==e?void 0:e.filter((function(e){return 0!==(null==e?void 0:e.quantity)}))}),[u]);return f?r.createElement("div",{className:"payment-booking-summary"},r.createElement(n.LoaderIndicator,{isLoaded:!1})):r.createElement("div",{className:"payment-booking-summary"},r.createElement(s.BookingSummaryAccordion,{hasPeopleInput:N},r.createElement("div",{className:"event-info"},r.createElement("p",{className:"m-0 title event-name"},p),r.createElement("p",{className:"m-0"},l)),r.createElement("hr",null),j.length>0?r.createElement("div",null,r.createElement("div",{className:"cart-items"},i.map((function(e){return r.createElement(c.ProductsByMenuStep,{key:e.id,orderProducts:j,step:e,productsWithErrors:v})})),!d&&S>0&&r.createElement(r.Fragment,null,r.createElement("hr",null),r.createElement("div",{className:"d-flex justify-content-between mt-3"},r.createElement("p",{className:"m-0"},g("people"),":"),r.createElement("p",{className:"price"},S))),!!E&&r.createElement(r.Fragment,null,r.createElement("hr",null),r.createElement("div",{className:"d-flex justify-content-between mt-3"},r.createElement("p",{className:"m-0"},g("transactionFee"),":"),r.createElement("p",{className:"price"},B(E,{style:"currency",currency:a.Currency.GBP})))))):r.createElement("div",{className:"cart-items"},r.createElement("p",{className:"empty-cart"},g("emptyBasket")))))};i.SummaryTotal=l.SummaryTotal,i.Accordion=s.BookingSummaryAccordion,exports.BookingSummary=i;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SummaryTotal.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/order-process/components/BookingSummary/components/SummaryTotal/SummaryTotal.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"SummaryTotal.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/order-process/components/BookingSummary/components/SummaryTotal/SummaryTotal.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAIlD,eAAO,MAAM,YAAY,sEAKtB,KACD,mBAAmB,EACnB,YAAY,GAAG,mBAAmB,GAAG,gBAAgB,GAAG,eAAe,CACxE,gBA4BA,CAAC"}
|
package/dist/iframe/order-process/components/BookingSummary/components/SummaryTotal/SummaryTotal.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),r=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,a=require("react-i18next"),l=require("./components/SummaryTotalBlock.js"),n=require("../../utils/index.js");exports.SummaryTotal=function(e){var o=e.formValues,u=e.totalWithDiscount,i=e.transactionFee,c=void 0===i?0:i,s=e.isFreePayment,m=void 0!==s&&s,f=a.useTranslation("Design").t,d=t.useMemo((function(){return Object.values(o).filter(Boolean).filter((function(e){return 0!==(null==e?void 0:e.quantity)}))}),[o]),y=m?0:n.cartSumByOrderProducts(d)+c;return d.length?r.createElement("div",{className:"d-flex flex-column justify-content-between"},r.createElement(l.SummaryTotalBlock,{label:f("total"),amount:y}),!!u&&!m&&r.createElement(l.SummaryTotalBlock,{label:f("totalWithDiscount"),amount:u+c})):null};
|
|
@@ -6,7 +6,7 @@ export declare type BookingSummaryProps = {
|
|
|
6
6
|
date: string;
|
|
7
7
|
menuSteps: MenuStep[];
|
|
8
8
|
formValues: {
|
|
9
|
-
[key: string]: Order
|
|
9
|
+
[key: string]: Order;
|
|
10
10
|
};
|
|
11
11
|
totalWithDiscount?: number;
|
|
12
12
|
isNotShownPeopleAmount?: boolean;
|
|
@@ -16,5 +16,6 @@ export declare type BookingSummaryProps = {
|
|
|
16
16
|
isFreePayment?: boolean;
|
|
17
17
|
productsWithErrors?: ProductQuantityCheckResponse["products"];
|
|
18
18
|
isLoading?: boolean;
|
|
19
|
+
peopleAmount: number;
|
|
19
20
|
};
|
|
20
21
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/order-process/components/BookingSummary/types/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,4BAA4B,EAAE,MAAM,8CAA8C,CAAC;AAC5F,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAEvD,eAAO,MAAM,YAAY,MAAM,CAAC;AAChC,eAAO,MAAM,aAAa,oBAAoB,CAAC;AAE/C,oBAAY,mBAAmB,GAAG;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,QAAQ,EAAE,CAAC;IACtB,UAAU,EAAE;QACV,CAAC,GAAG,EAAE,MAAM,GAAG,KAAK,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/order-process/components/BookingSummary/types/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,4BAA4B,EAAE,MAAM,8CAA8C,CAAC;AAC5F,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAEvD,eAAO,MAAM,YAAY,MAAM,CAAC;AAChC,eAAO,MAAM,aAAa,oBAAoB,CAAC;AAE/C,oBAAY,mBAAmB,GAAG;IAChC,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,QAAQ,EAAE,CAAC;IACtB,UAAU,EAAE;QACV,CAAC,GAAG,EAAE,MAAM,GAAG,KAAK,CAAC;KACtB,CAAC;IACF,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC,SAAS,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,kBAAkB,CAAC,EAAE,4BAA4B,CAAC,UAAU,CAAC,CAAC;IAC9D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;CACtB,CAAC"}
|
|
@@ -1,7 +1,3 @@
|
|
|
1
1
|
import { Order } from "../../../../../types";
|
|
2
|
-
import { BookingSummaryProps } from "../types";
|
|
3
|
-
export declare const sanitizeFormValues: (formValues: BookingSummaryProps["formValues"]) => {
|
|
4
|
-
[key: string]: number | Order;
|
|
5
|
-
};
|
|
6
2
|
export declare const cartSumByOrderProducts: (orderProducts: Order[]) => number;
|
|
7
3
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/order-process/components/BookingSummary/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/iframe/order-process/components/BookingSummary/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAE7C,eAAO,MAAM,sBAAsB,kBAAmB,KAAK,EAAE,WAKtD,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.cartSumByOrderProducts=function(e){return e.reduce((function(e,r){return e+((null==r?void 0:r.deposit)||(null==r?void 0:r.price))*r.quantity}),0)};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectMenu.d.ts","sourceRoot":"","sources":["../../../../src/sales/manual-booking/select-menu/SelectMenu.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,qDAAqD,CAAC;AAItF,oBAAY,eAAe,GAAG;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,eAAe,EAAE,CAAC;IAC1B,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,eAAe,KAAK,IAAI,CAAC;CAChD,CAAC;AAEF,eAAO,MAAM,UAAU,wCAIpB,eAAe,
|
|
1
|
+
{"version":3,"file":"SelectMenu.d.ts","sourceRoot":"","sources":["../../../../src/sales/manual-booking/select-menu/SelectMenu.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,qDAAqD,CAAC;AAItF,oBAAY,eAAe,GAAG;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,eAAe,EAAE,CAAC;IAC1B,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,eAAe,KAAK,IAAI,CAAC;CAChD,CAAC;AAEF,eAAO,MAAM,UAAU,wCAIpB,eAAe,gBA0CjB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),r=(e=t)&&"object"==typeof e&&"default"in e?e.default:e;require("../../../static/loader/LoaderIndicator.js");var a=require("../../../static/loader/BlockLoader.js"),n=require("react-i18next"),l=require("react-bootstrap");require("../../../static/loader/ButtonLoader.js"),require("../../../static/loader/SnippetLoader.js"),require("../../../static/loader/PaymentLoader.js");var o=require("./components/MenuButton.js");exports.SelectMenu=function(e){var t=e.isLoading,u=void 0!==t&&t,s=e.menus,c=e.onSelectMenu,i=n.useTranslation(["App","Sale"]).t;return u?r.createElement("div",null,r.createElement("div",{className:"loader-container"},r.createElement(a.BlockLoader,null))):r.createElement("div",null,s&&s.length||u?r.createElement(r.Fragment,null,!u&&r.createElement(l.Form.Label,{className:"bold-text"},i("App:menus")),r.createElement("div",{className:"menu-list-manual-booking"},null==s?void 0:s.map((function(e){return r.createElement(o.MenuButton,{key:e.id,menu:e,onSelectMenu:c})})))):r.createElement("div",{className:"no-results-content"},r.createElement("span",{className:"no-results-found"},i("App:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),r=(e=t)&&"object"==typeof e&&"default"in e?e.default:e;require("../../../static/loader/LoaderIndicator.js");var a=require("../../../static/loader/BlockLoader.js"),n=require("react-i18next"),l=require("react-bootstrap");require("../../../static/loader/ButtonLoader.js"),require("../../../static/loader/SnippetLoader.js"),require("../../../static/loader/PaymentLoader.js");var o=require("./components/MenuButton.js");exports.SelectMenu=function(e){var t=e.isLoading,u=void 0!==t&&t,s=e.menus,c=e.onSelectMenu,i=n.useTranslation(["App","Sale"]).t;return u?r.createElement("div",null,r.createElement("div",{className:"loader-container"},r.createElement(a.BlockLoader,null))):r.createElement("div",null,s&&s.length||u?r.createElement(r.Fragment,null,!u&&r.createElement(l.Form.Label,{className:"bold-text"},i("App:menus")),r.createElement("div",{className:"menu-list-manual-booking"},null==s?void 0:s.map((function(e){return r.createElement(o.MenuButton,{key:e.id,menu:e,onSelectMenu:c})})))):r.createElement("div",{className:"no-results-content"},r.createElement("span",{className:"no-results-found"},i("App:noResultsFoundForSelectedDate"))))};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NoteForm.d.ts","sourceRoot":"","sources":["../../../../src/sales/notes/note-form/NoteForm.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,IAAI,EAAE,MAAM,qDAAqD,CAAC;AAE3E,oBAAY,aAAa,GAAG;IAC1B,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IACvC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,aAAa,CAAC,EAAE;QACd,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;KACpB,CAAC;CACH,CAAC;AAIF,eAAO,MAAM,QAAQ,0CAIlB,aAAa,
|
|
1
|
+
{"version":3,"file":"NoteForm.d.ts","sourceRoot":"","sources":["../../../../src/sales/notes/note-form/NoteForm.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,IAAI,EAAE,MAAM,qDAAqD,CAAC;AAE3E,oBAAY,aAAa,GAAG;IAC1B,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IACvC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,aAAa,CAAC,EAAE;QACd,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;KACpB,CAAC;CACH,CAAC;AAIF,eAAO,MAAM,QAAQ,0CAIlB,aAAa,gBA0Df,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("tslib"),r=require("react"),o=(e=r)&&"object"==typeof e&&"default"in e?e.default:e,a=require("react-i18next"),n=require("react-bootstrap"),l=require("react-hook-form");exports.NoteForm=function(e){var r=e.onSubmit,s=e.onClose,u=e.defaultValues,m=void 0===u?{note:""}:u,
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("tslib"),r=require("react"),o=(e=r)&&"object"==typeof e&&"default"in e?e.default:e,a=require("react-i18next"),n=require("react-bootstrap"),l=require("react-hook-form");exports.NoteForm=function(e){var r,i=e.onSubmit,s=e.onClose,u=e.defaultValues,m=void 0===u?{note:""}:u,c=l.useForm({mode:"onChange",defaultValues:m}),d=c.register,f=c.handleSubmit,v=c.formState.errors,b=c.setValue,p=a.useTranslation("Design").t;return o.createElement("form",{className:"mt-1 notes-form",onSubmit:f((function(e){var t=e.note;return i(t)}))},o.createElement(n.Form.Group,{controlId:"exampleForm.ControlTextarea1"},o.createElement(n.Form.Label,null,p(m.note?"editNote":"addANote")),o.createElement(n.Form.Control,t.__assign({as:"textarea",rows:5,isInvalid:!!v.note,placeholder:p("writeYourNoteHere")},d("note",{required:{value:!0,message:p("Validation:fieldRequired")}}))),o.createElement(n.Form.Control.Feedback,{type:"invalid"},null===(r=v.note)||void 0===r?void 0:r.message)),o.createElement("footer",{className:"d-flex"},o.createElement(n.Button,{type:"submit"},p("save")),o.createElement(n.Button,{type:"submit",variant:"outline-secondary",className:"ml-auto",onClick:s},p("close")),o.createElement(n.Button,{variant:"danger",className:"ml-2",onClick:function(){return b("note","")}},p("delete"))))};
|
package/package.json
CHANGED
|
@@ -15,7 +15,6 @@ import { StepsForm } from "./components/StepsForm";
|
|
|
15
15
|
import { Page, PageBody, PageHeader } from "../page";
|
|
16
16
|
import { StepsFormRef } from "./components/StepsForm/StepsForm";
|
|
17
17
|
import { BookingSummaryFooter } from "./components/BookingSummaryFooter";
|
|
18
|
-
import { sanitizeFormValues } from "./components/BookingSummary/utils";
|
|
19
18
|
import { Order } from "../../types";
|
|
20
19
|
// eslint-disable-next-line max-len
|
|
21
20
|
import { RenderNumberOfPeopleInputComponent } from "../event/event-details/components/number-of-people-input/component/RenderNumberOfPeopleInputComponent";
|
|
@@ -267,10 +266,7 @@ export function Default() {
|
|
|
267
266
|
};
|
|
268
267
|
|
|
269
268
|
const shouldShowPeopleInput = useMemo(() => {
|
|
270
|
-
const
|
|
271
|
-
sanitizeFormValues(formValues);
|
|
272
|
-
|
|
273
|
-
const values = Object.values(orderProducts).filter(
|
|
269
|
+
const values = Object.values(formValues).filter(
|
|
274
270
|
Boolean
|
|
275
271
|
) as Order[];
|
|
276
272
|
const filteredValues = values.filter(
|
|
@@ -347,6 +343,7 @@ export function Default() {
|
|
|
347
343
|
date="29 Sept 2022 at 09:00"
|
|
348
344
|
menuSteps={menuSteps as any}
|
|
349
345
|
formValues={formValues}
|
|
346
|
+
peopleAmount={peopleAmount}
|
|
350
347
|
totalWithDiscount={5}
|
|
351
348
|
eventName="Glam!"
|
|
352
349
|
/>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React
|
|
1
|
+
import React from "react";
|
|
2
2
|
import { Meta } from "@storybook/react";
|
|
3
3
|
import { BookingSummary } from "./BookingSummary";
|
|
4
4
|
|
|
@@ -139,6 +139,7 @@ export function Default() {
|
|
|
139
139
|
<BookingSummary
|
|
140
140
|
date="29 Sept 2022 at 09:00"
|
|
141
141
|
menuSteps={menuSteps as any}
|
|
142
|
+
peopleAmount={5}
|
|
142
143
|
formValues={{
|
|
143
144
|
"3": {
|
|
144
145
|
id: 3,
|
|
@@ -161,7 +162,6 @@ export function Default() {
|
|
|
161
162
|
price: 1,
|
|
162
163
|
productsCategoryId: 1,
|
|
163
164
|
},
|
|
164
|
-
numberOfPeople: 5,
|
|
165
165
|
}}
|
|
166
166
|
totalWithDiscount={5}
|
|
167
167
|
transactionFee={0.01}
|
|
@@ -6,7 +6,6 @@ import { LoaderIndicator } from "../../../../static";
|
|
|
6
6
|
import { MenuStep, Order } from "../../../../types";
|
|
7
7
|
import { ProductsByMenuStep } from "./components/ProductsByMenuStep";
|
|
8
8
|
import { BookingSummaryProps } from "./types";
|
|
9
|
-
import { sanitizeFormValues } from "./utils";
|
|
10
9
|
import { SummaryTotal } from "./components/SummaryTotal";
|
|
11
10
|
import { BookingSummaryAccordion } from "./components/BookingSummaryAccordion";
|
|
12
11
|
|
|
@@ -20,21 +19,15 @@ export const BookingSummary = ({
|
|
|
20
19
|
productsWithErrors,
|
|
21
20
|
isLoading,
|
|
22
21
|
hasPeopleInput,
|
|
22
|
+
peopleAmount,
|
|
23
23
|
}: Omit<BookingSummaryProps, "totallWithDiscount">) => {
|
|
24
24
|
const { t } = useTranslation("Design");
|
|
25
25
|
const { formatNumber } = useIntl();
|
|
26
26
|
|
|
27
|
-
const
|
|
28
|
-
const
|
|
27
|
+
const orderProducts = useMemo(() => {
|
|
28
|
+
const products = Object.values(formValues).filter(Boolean) as Order[];
|
|
29
29
|
|
|
30
|
-
|
|
31
|
-
(productId) => orderProducts[productId]
|
|
32
|
-
) as Order[];
|
|
33
|
-
|
|
34
|
-
return [
|
|
35
|
-
numberOfPeople as number,
|
|
36
|
-
products.filter((prod) => prod.quantity !== 0),
|
|
37
|
-
];
|
|
30
|
+
return products?.filter((prod) => prod?.quantity !== 0);
|
|
38
31
|
}, [formValues]);
|
|
39
32
|
|
|
40
33
|
if (isLoading) {
|
|
@@ -67,12 +60,12 @@ export const BookingSummary = ({
|
|
|
67
60
|
/>
|
|
68
61
|
);
|
|
69
62
|
})}
|
|
70
|
-
{!isNotShownPeopleAmount &&
|
|
63
|
+
{!isNotShownPeopleAmount && peopleAmount > 0 && (
|
|
71
64
|
<>
|
|
72
65
|
<hr />
|
|
73
66
|
<div className="d-flex justify-content-between mt-3">
|
|
74
67
|
<p className="m-0">{t("people")}:</p>
|
|
75
|
-
<p className="price">{
|
|
68
|
+
<p className="price">{peopleAmount}</p>
|
|
76
69
|
</div>
|
|
77
70
|
</>
|
|
78
71
|
)}
|
package/src/iframe/order-process/components/BookingSummary/components/SummaryTotal/SummaryTotal.tsx
CHANGED
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import React, { useMemo } from "react";
|
|
2
2
|
import { useTranslation } from "react-i18next";
|
|
3
|
-
import { Order } from "../../../../../../types";
|
|
4
3
|
import { BookingSummaryProps } from "../../types";
|
|
5
|
-
import {
|
|
4
|
+
import { cartSumByOrderProducts } from "../../utils";
|
|
6
5
|
import { SummaryTotalBlock } from "./components/SummaryTotalBlock";
|
|
7
6
|
|
|
8
7
|
export const SummaryTotal = ({
|
|
@@ -15,17 +14,10 @@ export const SummaryTotal = ({
|
|
|
15
14
|
"formValues" | "totalWithDiscount" | "transactionFee" | "isFreePayment"
|
|
16
15
|
>) => {
|
|
17
16
|
const { t } = useTranslation("Design");
|
|
18
|
-
const
|
|
19
|
-
const
|
|
17
|
+
const orderProducts = useMemo(() => {
|
|
18
|
+
const products = Object.values(formValues).filter(Boolean);
|
|
20
19
|
|
|
21
|
-
|
|
22
|
-
(productId) => orderProducts[productId]
|
|
23
|
-
) as Order[];
|
|
24
|
-
|
|
25
|
-
return [
|
|
26
|
-
numberOfPeople as number,
|
|
27
|
-
products.filter((prod) => prod.quantity !== 0),
|
|
28
|
-
];
|
|
20
|
+
return products.filter((prod) => prod?.quantity !== 0);
|
|
29
21
|
}, [formValues]);
|
|
30
22
|
|
|
31
23
|
const cartSum = isFreePayment
|
|
@@ -8,7 +8,7 @@ export type BookingSummaryProps = {
|
|
|
8
8
|
date: string;
|
|
9
9
|
menuSteps: MenuStep[];
|
|
10
10
|
formValues: {
|
|
11
|
-
[key: string]: Order
|
|
11
|
+
[key: string]: Order;
|
|
12
12
|
};
|
|
13
13
|
totalWithDiscount?: number;
|
|
14
14
|
isNotShownPeopleAmount?: boolean;
|
|
@@ -18,4 +18,5 @@ export type BookingSummaryProps = {
|
|
|
18
18
|
isFreePayment?: boolean;
|
|
19
19
|
productsWithErrors?: ProductQuantityCheckResponse["products"];
|
|
20
20
|
isLoading?: boolean;
|
|
21
|
+
peopleAmount: number;
|
|
21
22
|
};
|
|
@@ -1,25 +1,4 @@
|
|
|
1
1
|
import { Order } from "../../../../../types";
|
|
2
|
-
import { BookingSummaryProps } from "../types";
|
|
3
|
-
|
|
4
|
-
export const sanitizeFormValues = (
|
|
5
|
-
formValues: BookingSummaryProps["formValues"]
|
|
6
|
-
) =>
|
|
7
|
-
Object.keys(formValues).reduce(
|
|
8
|
-
(
|
|
9
|
-
prevValues: {
|
|
10
|
-
[key: string]: Order | number;
|
|
11
|
-
},
|
|
12
|
-
currentKey: string
|
|
13
|
-
) => {
|
|
14
|
-
const value = formValues[currentKey];
|
|
15
|
-
if (value) {
|
|
16
|
-
return { ...prevValues, [currentKey]: value };
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
return prevValues;
|
|
20
|
-
},
|
|
21
|
-
{}
|
|
22
|
-
);
|
|
23
2
|
|
|
24
3
|
export const cartSumByOrderProducts = (orderProducts: Order[]) =>
|
|
25
4
|
orderProducts.reduce((prevSumValue: number, product) => {
|
|
@@ -174,7 +174,12 @@ const OrderProcessContextProvider: React.FC = ({ children }) => {
|
|
|
174
174
|
|
|
175
175
|
return (
|
|
176
176
|
<OrderProcessContext.Provider
|
|
177
|
-
value={{
|
|
177
|
+
value={{
|
|
178
|
+
orderFormValues,
|
|
179
|
+
setOrderFormValues,
|
|
180
|
+
formValues,
|
|
181
|
+
setFormValues,
|
|
182
|
+
}}
|
|
178
183
|
>
|
|
179
184
|
{children}
|
|
180
185
|
</OrderProcessContext.Provider>
|
|
@@ -403,6 +408,8 @@ const MENU_STEPS = [
|
|
|
403
408
|
|
|
404
409
|
export function Default() {
|
|
405
410
|
const { formValues, setFormValues } = useContext(OrderProcessContext);
|
|
411
|
+
const [peopleAmount] = useState(0);
|
|
412
|
+
|
|
406
413
|
return (
|
|
407
414
|
<div className="snippet">
|
|
408
415
|
<OrderProcessContextProvider>
|
|
@@ -434,6 +441,7 @@ export function Default() {
|
|
|
434
441
|
<BookingSummary
|
|
435
442
|
date="29 Sept 2022 at 09:00"
|
|
436
443
|
menuSteps={menuSteps as any}
|
|
444
|
+
peopleAmount={peopleAmount}
|
|
437
445
|
formValues={formValues}
|
|
438
446
|
totalWithDiscount={5}
|
|
439
447
|
eventName="Glam!"
|
|
@@ -32,7 +32,9 @@ export const SelectMenu = ({
|
|
|
32
32
|
<div>
|
|
33
33
|
{(!menus || !menus.length) && !isLoading ? (
|
|
34
34
|
<div className="no-results-content">
|
|
35
|
-
<span className="no-results-found">
|
|
35
|
+
<span className="no-results-found">
|
|
36
|
+
{t("App:noResultsFoundForSelectedDate")}
|
|
37
|
+
</span>
|
|
36
38
|
</div>
|
|
37
39
|
) : (
|
|
38
40
|
<>
|
|
@@ -19,7 +19,12 @@ export const NoteForm = ({
|
|
|
19
19
|
onClose,
|
|
20
20
|
defaultValues = { note: "" },
|
|
21
21
|
}: NoteFormProps) => {
|
|
22
|
-
const {
|
|
22
|
+
const {
|
|
23
|
+
register,
|
|
24
|
+
handleSubmit,
|
|
25
|
+
formState: { errors },
|
|
26
|
+
setValue,
|
|
27
|
+
} = useForm<FormModel>({
|
|
23
28
|
mode: "onChange",
|
|
24
29
|
defaultValues,
|
|
25
30
|
});
|
|
@@ -37,9 +42,18 @@ export const NoteForm = ({
|
|
|
37
42
|
<Form.Control
|
|
38
43
|
as="textarea"
|
|
39
44
|
rows={5}
|
|
45
|
+
isInvalid={!!errors.note}
|
|
40
46
|
placeholder={t("writeYourNoteHere")}
|
|
41
|
-
{...register("note"
|
|
47
|
+
{...register("note", {
|
|
48
|
+
required: {
|
|
49
|
+
value: true,
|
|
50
|
+
message: t("Validation:fieldRequired"),
|
|
51
|
+
},
|
|
52
|
+
})}
|
|
42
53
|
/>
|
|
54
|
+
<Form.Control.Feedback type="invalid">
|
|
55
|
+
{errors.note?.message}
|
|
56
|
+
</Form.Control.Feedback>
|
|
43
57
|
</Form.Group>
|
|
44
58
|
|
|
45
59
|
<footer className="d-flex">
|
|
@@ -52,7 +66,11 @@ export const NoteForm = ({
|
|
|
52
66
|
>
|
|
53
67
|
{t("close")}
|
|
54
68
|
</Button>
|
|
55
|
-
<Button
|
|
69
|
+
<Button
|
|
70
|
+
variant="danger"
|
|
71
|
+
className="ml-2"
|
|
72
|
+
onClick={() => setValue("note", "")}
|
|
73
|
+
>
|
|
56
74
|
{t("delete")}
|
|
57
75
|
</Button>
|
|
58
76
|
</footer>
|