From fb8111ede95923490ec517b32eeb155bf4ca7e18 Mon Sep 17 00:00:00 2001 From: Konstantin Fandelyuk Date: Fri, 20 Sep 2024 14:24:21 +0300 Subject: [PATCH] updated --- blocks/commerce-search-order/commerce-search-order.js | 3 ++- scripts/__dropins__/storefront-order/containers/OrderSearch.js | 2 +- .../storefront-order/hooks/containers/useOrderSearch.d.ts | 2 +- 3 files changed, 4 insertions(+), 3 deletions(-) diff --git a/blocks/commerce-search-order/commerce-search-order.js b/blocks/commerce-search-order/commerce-search-order.js index 50a3060f2c..88e7c6deba 100644 --- a/blocks/commerce-search-order/commerce-search-order.js +++ b/blocks/commerce-search-order/commerce-search-order.js @@ -28,10 +28,11 @@ export default async function decorate(block) { const isAuthenticated = !!getCookie("auth_dropin_user_token") || false; events.on("order/data", async (order) => { + if (!order) return; + block.innerHTML = ""; await orderRenderer.render(OrderSearch, { - orderSearch: order, isAuth: isAuthenticated, renderSignIn: async ({ render, formValues }) => { if (render) { diff --git a/scripts/__dropins__/storefront-order/containers/OrderSearch.js b/scripts/__dropins__/storefront-order/containers/OrderSearch.js index 5fe3e90add..7d2ba25fa9 100644 --- a/scripts/__dropins__/storefront-order/containers/OrderSearch.js +++ b/scripts/__dropins__/storefront-order/containers/OrderSearch.js @@ -1 +1 @@ -import{jsxs as _,jsx as n}from"@dropins/tools/preact-jsx-runtime.js";import{classes as U}from"@dropins/tools/lib.js";import{Card as C,InLineAlert as x,Icon as V,Button as L}from"@dropins/tools/components.js";import{F as k}from"../chunks/CustomerDetailsContent.js";import{useState as D,useCallback as O,useEffect as g,useMemo as H}from"@dropins/tools/preact-hooks.js";import*as w from"@dropins/tools/preact-compat.js";import{Text as b,useText as P}from"@dropins/tools/i18n.js";import{events as A}from"@dropins/tools/event-bus.js";import{c as I,g as X}from"../chunks/getCustomer.js";import"../chunks/fetch-graphql.js";import"@dropins/tools/fetch-graphql.js";const B=e=>w.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},w.createElement("path",{vectorEffect:"non-scaling-stroke",fillRule:"evenodd",clipRule:"evenodd",d:"M1 20.8953L12.1922 1.5L23.395 20.8953H1ZM13.0278 13.9638L13.25 10.0377V9H11.25V10.0377L11.4722 13.9638H13.0278ZM11.2994 16V17.7509H13.2253V16H11.2994Z",fill:"currentColor"})),j=({onSubmit:e,loading:a,inLineAlert:o,fieldsConfig:r})=>_(C,{variant:"secondary",className:"dropin-order-search-form",children:[n("h2",{className:"dropin-order-search-form__title",children:n(b,{id:"Order.OrderSearchForm.title"})}),n("p",{children:n(b,{id:"Order.OrderSearchForm.description"})}),o.text?n(x,{"data-testid":"orderAlert",className:"dropin-order-search-form__alert",type:o.type,variant:"secondary",heading:o.text,icon:n(V,{source:B})}):null,n(k,{className:"dropin-order-search-form__wrapper",name:"orderSearchForm",loading:a,fieldsConfig:r,onSubmit:e,children:n("div",{className:"dropin-order-search-form__button-container",children:n(L,{className:"dropin-order-search-form__button",size:"medium",variant:"primary",type:"submit",disabled:a,children:n(b,{id:"Order.OrderSearchForm.button"})},"logIn")})})]});var E=(e=>(e.BOOLEAN="BOOLEAN",e.DATE="DATE",e.DATETIME="DATETIME",e.DROPDOWN="DROPDOWN",e.FILE="FILE",e.GALLERY="GALLERY",e.HIDDEN="HIDDEN",e.IMAGE="IMAGE",e.MEDIA_IMAGE="MEDIA_IMAGE",e.MULTILINE="MULTILINE",e.MULTISELECT="MULTISELECT",e.PRICE="PRICE",e.SELECT="SELECT",e.TEXT="TEXT",e.TEXTAREA="TEXTAREA",e.UNDEFINED="UNDEFINED",e.VISUAL="VISUAL",e.WEIGHT="WEIGHT",e.EMPTY="",e))(E||{});const q=e=>{if(!e)return null;const a=new FormData(e);if(e.querySelectorAll('input[type="checkbox"]').forEach(r=>{a.has(r.name)||a.set(r.name,"false"),r.checked&&a.set(r.name,"true")}),a&&typeof a.entries=="function"){const r=a.entries();if(r&&typeof r[Symbol.iterator]=="function")return JSON.parse(JSON.stringify(Object.fromEntries(r)))||{}}return{}},p=(e,a)=>{if(typeof e!="function")return;const o=e();if(!a||Object.keys(a).length===0){window.location.href=o;return}const r=new URLSearchParams;Object.entries(a).forEach(([d,u])=>{r.append(d,String(u))});const c=o.includes("?")?"&":"?";window.location.href=`${o}${c}${r.toString()}`},M=e=>{try{return new URL(window.location.href).searchParams.get(e)}catch{return null}},G=({onError:e,isAuth:a,renderSignIn:o,routeCustomerOrder:r,routeGuestOrder:c,orderSearch:d})=>{const[u,h]=D({text:"",type:"success"}),[y,T]=D(!1),f=P({invalidSearch:"Order.Errors.invalidSearch",email:"Order.OrderSearchForm.email",postcode:"Order.OrderSearchForm.postcode",number:"Order.OrderSearchForm.orderNumber"}),N=O(async t=>{const s=M("orderRef"),i=s&&s.length>20;if(!t&&!s||!(t!=null&&t.number)&&!(t!=null&&t.token)&&!s)return null;if(a){const m=await I();(m==null?void 0:m.email)===t.email?p(r,{orderRef:t==null?void 0:t.number}):i||p(c,{orderRef:t.token})}else i||p(c,{orderRef:t==null?void 0:t.token})},[a,r,c]);g(()=>{const t=A.on("order/data",s=>{N(d??s)},{eager:!0});return()=>{t==null||t.off()}},[N,d]),g(()=>{const t=M("orderRef"),s=t&&t.length>20?t:null;t&&(s?p(c,{orderRef:t}):a?p(r,{orderRef:t}):o==null||o({render:!0,formValues:{number:t}}))},[a,r,c,o]);const v=H(()=>[{entityType:"CUSTOMER_ADDRESS",is_unique:!1,label:f.email,options:[],defaultValue:"",fieldType:E.TEXT,className:"",required:!0,orderNumber:1,name:"email",id:"email",code:"email"},{entityType:"CUSTOMER_ADDRESS",is_unique:!1,label:f.postcode,options:[],defaultValue:"",fieldType:E.TEXT,className:"",required:!0,orderNumber:2,name:"postcode",id:"postcode",code:"postcode"},{entityType:"CUSTOMER_ADDRESS",is_unique:!1,label:f.number,options:[],defaultValue:"",fieldType:E.TEXT,className:"",required:!0,orderNumber:3,name:"number",id:"number",code:"number"}],[f]);return{onSubmit:O(async(t,s)=>{if(!s)return null;T(!0);const i=q(t.target);await X(i).then(l=>{l||h({text:f.invalidSearch,type:"warning"}),A.emit("order/data",l)}).catch(async l=>{var R;let m=!0;e==null||e({error:l.message});const S=a?await I():{email:""};(S==null?void 0:S.email)===(i==null?void 0:i.email)?(m=!1,p(r,{orderRef:i.number})):m=o==null?void 0:o({render:(R=l==null?void 0:l.message)==null?void 0:R.includes("Please login to view the order."),formValues:i}),m&&h({text:l.message,type:"warning"})}).finally(()=>{T(!1)})},[a,e,o,r,f.invalidSearch]),inLineAlert:u,loading:y,normalizeFieldsConfig:v}},re=({orderSearch:e,className:a,isAuth:o,renderSignIn:r,routeCustomerOrder:c,routeGuestOrder:d,onError:u})=>{const{onSubmit:h,loading:y,inLineAlert:T,normalizeFieldsConfig:f}=G({onError:u,isAuth:o,renderSignIn:r,routeCustomerOrder:c,routeGuestOrder:d,orderSearch:e});return n("div",{className:U(["dropin-order-search",a]),children:n(j,{onSubmit:h,loading:y,inLineAlert:T,fieldsConfig:f})})};export{re as OrderSearch,re as default}; +import{jsxs as v,jsx as n}from"@dropins/tools/preact-jsx-runtime.js";import{classes as _}from"@dropins/tools/lib.js";import{Card as U,InLineAlert as C,Icon as x,Button as V}from"@dropins/tools/components.js";import{F as L}from"../chunks/CustomerDetailsContent.js";import{useState as R,useCallback as D,useEffect as O,useMemo as k}from"@dropins/tools/preact-hooks.js";import*as g from"@dropins/tools/preact-compat.js";import{Text as S,useText as H}from"@dropins/tools/i18n.js";import{events as w}from"@dropins/tools/event-bus.js";import{c as A,g as P}from"../chunks/getCustomer.js";import"../chunks/fetch-graphql.js";import"@dropins/tools/fetch-graphql.js";const X=e=>g.createElement("svg",{width:24,height:24,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e},g.createElement("path",{vectorEffect:"non-scaling-stroke",fillRule:"evenodd",clipRule:"evenodd",d:"M1 20.8953L12.1922 1.5L23.395 20.8953H1ZM13.0278 13.9638L13.25 10.0377V9H11.25V10.0377L11.4722 13.9638H13.0278ZM11.2994 16V17.7509H13.2253V16H11.2994Z",fill:"currentColor"})),B=({onSubmit:e,loading:t,inLineAlert:o,fieldsConfig:r})=>v(U,{variant:"secondary",className:"dropin-order-search-form",children:[n("h2",{className:"dropin-order-search-form__title",children:n(S,{id:"Order.OrderSearchForm.title"})}),n("p",{children:n(S,{id:"Order.OrderSearchForm.description"})}),o.text?n(C,{"data-testid":"orderAlert",className:"dropin-order-search-form__alert",type:o.type,variant:"secondary",heading:o.text,icon:n(x,{source:X})}):null,n(L,{className:"dropin-order-search-form__wrapper",name:"orderSearchForm",loading:t,fieldsConfig:r,onSubmit:e,children:n("div",{className:"dropin-order-search-form__button-container",children:n(V,{className:"dropin-order-search-form__button",size:"medium",variant:"primary",type:"submit",disabled:t,children:n(S,{id:"Order.OrderSearchForm.button"})},"logIn")})})]});var T=(e=>(e.BOOLEAN="BOOLEAN",e.DATE="DATE",e.DATETIME="DATETIME",e.DROPDOWN="DROPDOWN",e.FILE="FILE",e.GALLERY="GALLERY",e.HIDDEN="HIDDEN",e.IMAGE="IMAGE",e.MEDIA_IMAGE="MEDIA_IMAGE",e.MULTILINE="MULTILINE",e.MULTISELECT="MULTISELECT",e.PRICE="PRICE",e.SELECT="SELECT",e.TEXT="TEXT",e.TEXTAREA="TEXTAREA",e.UNDEFINED="UNDEFINED",e.VISUAL="VISUAL",e.WEIGHT="WEIGHT",e.EMPTY="",e))(T||{});const j=e=>{if(!e)return null;const t=new FormData(e);if(e.querySelectorAll('input[type="checkbox"]').forEach(r=>{t.has(r.name)||t.set(r.name,"false"),r.checked&&t.set(r.name,"true")}),t&&typeof t.entries=="function"){const r=t.entries();if(r&&typeof r[Symbol.iterator]=="function")return JSON.parse(JSON.stringify(Object.fromEntries(r)))||{}}return{}},p=(e,t)=>{if(typeof e!="function")return;const o=e();if(!t||Object.keys(t).length===0){window.location.href=o;return}const r=new URLSearchParams;Object.entries(t).forEach(([u,d])=>{r.append(u,String(d))});const c=o.includes("?")?"&":"?";window.location.href=`${o}${c}${r.toString()}`},I=e=>{try{return new URL(window.location.href).searchParams.get(e)}catch{return null}},q=({onError:e,isAuth:t,renderSignIn:o,routeCustomerOrder:r,routeGuestOrder:c})=>{const[u,d]=R({text:"",type:"success"}),[E,h]=R(!1),f=H({invalidSearch:"Order.Errors.invalidSearch",email:"Order.OrderSearchForm.email",postcode:"Order.OrderSearchForm.postcode",number:"Order.OrderSearchForm.orderNumber"}),b=D(async a=>{const s=I("orderRef"),i=s&&s.length>20;if(!a&&!s||!(a!=null&&a.number)&&!(a!=null&&a.token)&&!s)return null;if(t){const m=await A();(m==null?void 0:m.email)===a.email?p(r,{orderRef:a==null?void 0:a.number}):i||p(c,{orderRef:a.token})}else i||p(c,{orderRef:a==null?void 0:a.token})},[t,r,c]);O(()=>{const a=w.on("order/data",s=>{b(s)},{eager:!0});return()=>{a==null||a.off()}},[b]),O(()=>{const a=I("orderRef"),s=a&&a.length>20?a:null;a&&(s?p(c,{orderRef:a}):t?p(r,{orderRef:a}):o==null||o({render:!0,formValues:{number:a}}))},[t,r,c,o]);const M=k(()=>[{entityType:"CUSTOMER_ADDRESS",is_unique:!1,label:f.email,options:[],defaultValue:"",fieldType:T.TEXT,className:"",required:!0,orderNumber:1,name:"email",id:"email",code:"email"},{entityType:"CUSTOMER_ADDRESS",is_unique:!1,label:f.postcode,options:[],defaultValue:"",fieldType:T.TEXT,className:"",required:!0,orderNumber:2,name:"postcode",id:"postcode",code:"postcode"},{entityType:"CUSTOMER_ADDRESS",is_unique:!1,label:f.number,options:[],defaultValue:"",fieldType:T.TEXT,className:"",required:!0,orderNumber:3,name:"number",id:"number",code:"number"}],[f]);return{onSubmit:D(async(a,s)=>{if(!s)return null;h(!0);const i=j(a.target);await P(i).then(l=>{l||d({text:f.invalidSearch,type:"warning"}),w.emit("order/data",l)}).catch(async l=>{var N;let m=!0;e==null||e({error:l.message});const y=t?await A():{email:""};(y==null?void 0:y.email)===(i==null?void 0:i.email)?(m=!1,p(r,{orderRef:i.number})):m=o==null?void 0:o({render:(N=l==null?void 0:l.message)==null?void 0:N.includes("Please login to view the order."),formValues:i}),m&&d({text:l.message,type:"warning"})}).finally(()=>{h(!1)})},[t,e,o,r,f.invalidSearch]),inLineAlert:u,loading:E,normalizeFieldsConfig:M}},te=({className:e,isAuth:t,renderSignIn:o,routeCustomerOrder:r,routeGuestOrder:c,onError:u})=>{const{onSubmit:d,loading:E,inLineAlert:h,normalizeFieldsConfig:f}=q({onError:u,isAuth:t,renderSignIn:o,routeCustomerOrder:r,routeGuestOrder:c});return n("div",{className:_(["dropin-order-search",e]),children:n(B,{onSubmit:d,loading:E,inLineAlert:h,fieldsConfig:f})})};export{te as OrderSearch,te as default}; diff --git a/scripts/__dropins__/storefront-order/hooks/containers/useOrderSearch.d.ts b/scripts/__dropins__/storefront-order/hooks/containers/useOrderSearch.d.ts index eafb835aba..e1e6f8b152 100644 --- a/scripts/__dropins__/storefront-order/hooks/containers/useOrderSearch.d.ts +++ b/scripts/__dropins__/storefront-order/hooks/containers/useOrderSearch.d.ts @@ -1,6 +1,6 @@ import { FieldEnumList, inLineAlertProps, useOrderSearchProps } from '../../types'; -export declare const useOrderSearch: ({ onError, isAuth, renderSignIn, routeCustomerOrder, routeGuestOrder, orderSearch, }: useOrderSearchProps) => { +export declare const useOrderSearch: ({ onError, isAuth, renderSignIn, routeCustomerOrder, routeGuestOrder, }: useOrderSearchProps) => { onSubmit: (event: Event, valid: boolean) => Promise; inLineAlert: inLineAlertProps; loading: boolean;