@mychoice/mychoice-sdk-modules 2.2.6 → 2.2.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/dist/cjs/index.js CHANGED
@@ -388,12 +388,33 @@ const VehicleOfferCoverages = ({ coverages, nonStandardCoverages, }) => {
388
388
  };
389
389
 
390
390
  const OfferSection = ({ offerCompany, brokerCompany, offerPrice, phoneNumber, isBestOffer, isFirstOffer = true, operationHours = {}, redirectUrl, fulfillmentUrl, coverages, nonStandardCoverages, brokerIntegration, }) => {
391
- const { appConfigState: { appType }, } = mychoiceSdkStore.useStoreAppConfig();
391
+ const { appConfigState: { appType, insuranceType }, } = mychoiceSdkStore.useStoreAppConfig();
392
+ // Get discount states for broker phone
393
+ const { discountState: carDiscountState } = mychoiceSdkStore.useStoreFormCarDiscount();
394
+ const { discountState: homeDiscountState } = mychoiceSdkStore.useStoreFormHomeDiscount();
392
395
  const { postRequestQuoteOnliaUrl } = mychoiceSdkStore.CarQuoteDataHandler();
393
396
  const isTheBig = appType === mychoiceSdkComponents.AppTypes.TheBig;
394
397
  const isMyChoice = mychoiceSdkComponents.isMyChoiceLike(appType);
395
398
  const isBeginInsurance = appType === mychoiceSdkComponents.AppTypes.BeginInsurance;
396
399
  const mychoiceCls = mychoiceSdkComponents.isMyChoiceLike(appType) ? 'mychoice' : '';
400
+ // Get broker phone from discount state
401
+ const getBrokerPhoneFromState = () => {
402
+ if (!isTheBig)
403
+ return undefined;
404
+ let discountState;
405
+ if (insuranceType === 'car') {
406
+ discountState = carDiscountState;
407
+ }
408
+ else if (insuranceType === 'home') {
409
+ discountState = homeDiscountState;
410
+ }
411
+ else if (insuranceType === 'life') {
412
+ discountState = carDiscountState;
413
+ }
414
+ return discountState?.quoterInfo?.brokerInfo?.phone;
415
+ };
416
+ const brokerPhoneFromState = getBrokerPhoneFromState();
417
+ const effectivePhoneNumber = brokerPhoneFromState ? formatPhoneObject(brokerPhoneFromState) : phoneNumber;
397
418
  const { weekdayHours, saturdayHours, sundayHours } = operationHours;
398
419
  const [detailsIsOpen, setDetailsIsOpenIsOpen] = React.useState(isBestOffer ?? false);
399
420
  const handleDropdownClick = () => {
@@ -410,6 +431,7 @@ const OfferSection = ({ offerCompany, brokerCompany, offerPrice, phoneNumber, is
410
431
  postRequestQuoteOnliaUrl(true, redirectUrl);
411
432
  };
412
433
  const isHubIntegration = brokerIntegration?.type === 'hub';
434
+ const isExperiorIntegration = brokerIntegration?.type === 'experior';
413
435
  return (jsxRuntime.jsxs("div", { className: `offer-section ${mychoiceCls}`, children: [shouldShowBrokerInfo && isMyChoice && (isTheBig || !offsiteUrl) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(mychoiceSdkComponents.OfferDetail, { className: isTheBig ? 'thebig-bold' : '', logo: brokerCompany?.logo, name: brokerCompany?.title, companyType: mychoiceSdkComponents.CompanyRoleTypes.Broker, description: brokerCompany?.description, isBestOffer: isBestOffer, isMyChoice: isMyChoice }), jsxRuntime.jsx("hr", { style: {
414
436
  margin: '0',
415
437
  padding: '0',
@@ -422,7 +444,7 @@ const OfferSection = ({ offerCompany, brokerCompany, offerPrice, phoneNumber, is
422
444
  width: '100%',
423
445
  height: '1px',
424
446
  backgroundColor: '$color-background-header-primary',
425
- } })] })), !isHubIntegration && (jsxRuntime.jsx(mychoiceSdkComponents.OfferHeader, { className: isTheBig ? 'thebig-bold' : '', companyName: offerCompany?.name, isBestOffer: isBestOffer, isMyChoice: isMyChoice })), !isHubIntegration && (jsxRuntime.jsx(mychoiceSdkComponents.OfferPrice, { className: isTheBig ? 'thebig' : '', companyLogo: offerCompany?.logo, price: offerPrice })), isHubIntegration && (jsxRuntime.jsx("div", { className: "offer-phone hub-integration", children: jsxRuntime.jsx("div", { className: "hub-message-container", children: jsxRuntime.jsxs("p", { className: "hub-description", children: [jsxRuntime.jsx("span", { children: brokerIntegration?.data?.label }), jsxRuntime.jsx("br", {}), brokerIntegration?.data?.description] }) }) })), brokerIntegration?.type === 'youset' && brokerIntegration?.data?.url && (jsxRuntime.jsxs("div", { className: "offer-phone", children: [jsxRuntime.jsx("h3", { children: brokerIntegration?.data?.description || 'Click below to view your YouSet offer' }), jsxRuntime.jsx(mychoiceSdkComponents.ButtonBase, { className: `offer-phone-number ${mychoiceCls}`, label: brokerIntegration?.data?.label || 'View Offer', type: mychoiceSdkComponents.ButtonTypes.Button, category: mychoiceSdkComponents.CategoryTypes.Filled, color: mychoiceSdkComponents.ColorTypes.Primary, variant: mychoiceSdkComponents.ButtonVariantTypes.Rectangle, size: mychoiceSdkComponents.SizeTypes.Medium, onClick: () => window.open(brokerIntegration.data.url, '_blank') })] })), !brokerIntegration && !isTheBig && offsiteUrl && (jsxRuntime.jsxs("div", { className: "offer-phone", children: [jsxRuntime.jsx("h3", { children: "Click below to get this rate" }), jsxRuntime.jsx(mychoiceSdkComponents.ButtonBase, { className: `offer-phone-number ${mychoiceCls}`, label: "Buy Online", type: mychoiceSdkComponents.ButtonTypes.Button, category: mychoiceSdkComponents.CategoryTypes.Filled, color: mychoiceSdkComponents.ColorTypes.Primary, variant: mychoiceSdkComponents.ButtonVariantTypes.Rectangle, size: mychoiceSdkComponents.SizeTypes.Medium, onClick: handleCTAClick })] })), !brokerIntegration && (isTheBig || !offsiteUrl) && (jsxRuntime.jsxs("div", { className: "offer-phone", children: [jsxRuntime.jsx("h3", { className: isTheBig ? 'thebig-bold' : '', children: "Call now to get this rate" }), jsxRuntime.jsx("a", { target: "_blank", rel: "noreferrer noopener", href: `tel:${phoneNumber?.number}`, children: jsxRuntime.jsx(mychoiceSdkComponents.ButtonBase, { className: `${isTheBig ? 'thebig-bold' : 'mychoice'} offer-phone-number`, label: phoneNumber?.title, type: mychoiceSdkComponents.ButtonTypes.Button, category: mychoiceSdkComponents.CategoryTypes.Filled, color: mychoiceSdkComponents.ColorTypes.Primary, variant: mychoiceSdkComponents.ButtonVariantTypes.Rectangle, size: mychoiceSdkComponents.SizeTypes.Medium }) })] })), jsxRuntime.jsxs("button", { className: "dropdown", onClick: handleDropdownClick, children: [jsxRuntime.jsx("span", { children: detailsIsOpen ? 'Less Info' : 'More Info' }), jsxRuntime.jsx(mychoiceSdkComponents.IconDropdownArrow, { color: "grey", className: detailsIsOpen ? 'rotated' : '' })] }), detailsIsOpen && (jsxRuntime.jsxs("div", { className: "offer-details", children: [!isHubIntegration && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(mychoiceSdkComponents.OfferDetail, { className: isTheBig ? 'thebig-bold' : '', name: offerCompany?.name, companyType: mychoiceSdkComponents.CompanyRoleTypes.Offering, description: offerCompany?.description, isBestOffer: !isMyChoice ? isBestOffer : false, isMyChoice: isMyChoice }), !isMyChoice && jsxRuntime.jsx("hr", {})] })), !isMyChoice && (isTheBig || !offsiteUrl) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(mychoiceSdkComponents.OfferDetail, { className: isTheBig ? 'thebig-bold' : '', logo: brokerCompany?.logo, name: brokerCompany?.title, companyType: mychoiceSdkComponents.CompanyRoleTypes.Broker, description: brokerCompany?.description, isMyChoice: isMyChoice }), jsxRuntime.jsx("hr", {})] })), !isMyChoice && (jsxRuntime.jsx(mychoiceSdkComponents.OfferDetail, { className: isTheBig ? 'thebig-bold' : '', name: "Hours of Operation", isMyChoice: isMyChoice, children: jsxRuntime.jsx(mychoiceSdkComponents.OperationHoursInfo, { weekdayHours: weekdayHours, saturdayHours: saturdayHours, sundayHours: sundayHours }) })), isMyChoice && coverages && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("hr", {}), jsxRuntime.jsx(VehicleOfferCoverages, { coverages: coverages, nonStandardCoverages: nonStandardCoverages })] }))] }))] }));
447
+ } })] })), !isHubIntegration && !isExperiorIntegration && (jsxRuntime.jsx(mychoiceSdkComponents.OfferHeader, { className: isTheBig ? 'thebig-bold' : '', companyName: offerCompany?.name, isBestOffer: isBestOffer, isMyChoice: isMyChoice })), !isHubIntegration && !isExperiorIntegration && (jsxRuntime.jsx(mychoiceSdkComponents.OfferPrice, { className: isTheBig ? 'thebig' : '', companyLogo: offerCompany?.logo, price: offerPrice })), (isHubIntegration || isExperiorIntegration) && (jsxRuntime.jsx("div", { className: "offer-phone noprice-integration", children: jsxRuntime.jsx("div", { className: "noprice-message-container", children: jsxRuntime.jsxs("p", { className: "noprice-description", children: [jsxRuntime.jsx("span", { children: brokerIntegration?.data?.label }), jsxRuntime.jsx("br", {}), brokerIntegration?.data?.description] }) }) })), brokerIntegration?.type === 'youset' && brokerIntegration?.data?.url && (jsxRuntime.jsxs("div", { className: "offer-phone", children: [jsxRuntime.jsx("h3", { children: brokerIntegration?.data?.description || 'Click below to view your YouSet offer' }), jsxRuntime.jsx(mychoiceSdkComponents.ButtonBase, { className: `offer-phone-number ${mychoiceCls}`, label: brokerIntegration?.data?.label || 'View Offer', type: mychoiceSdkComponents.ButtonTypes.Button, category: mychoiceSdkComponents.CategoryTypes.Filled, color: mychoiceSdkComponents.ColorTypes.Primary, variant: mychoiceSdkComponents.ButtonVariantTypes.Rectangle, size: mychoiceSdkComponents.SizeTypes.Medium, onClick: () => window.open(brokerIntegration.data.url, '_blank') })] })), !brokerIntegration && !isTheBig && offsiteUrl && (jsxRuntime.jsxs("div", { className: "offer-phone", children: [jsxRuntime.jsx("h3", { children: "Click below to get this rate" }), jsxRuntime.jsx(mychoiceSdkComponents.ButtonBase, { className: `offer-phone-number ${mychoiceCls}`, label: "Buy Online", type: mychoiceSdkComponents.ButtonTypes.Button, category: mychoiceSdkComponents.CategoryTypes.Filled, color: mychoiceSdkComponents.ColorTypes.Primary, variant: mychoiceSdkComponents.ButtonVariantTypes.Rectangle, size: mychoiceSdkComponents.SizeTypes.Medium, onClick: handleCTAClick })] })), !brokerIntegration && (isTheBig || !offsiteUrl) && (jsxRuntime.jsxs("div", { className: "offer-phone", children: [jsxRuntime.jsx("h3", { className: isTheBig ? 'thebig-bold' : '', children: "Call now to get this rate" }), jsxRuntime.jsx("a", { target: "_blank", rel: "noreferrer noopener", href: `tel:${effectivePhoneNumber?.number}`, children: jsxRuntime.jsx(mychoiceSdkComponents.ButtonBase, { className: `${isTheBig ? 'thebig-bold' : 'mychoice'} offer-phone-number`, label: effectivePhoneNumber?.title, type: mychoiceSdkComponents.ButtonTypes.Button, category: mychoiceSdkComponents.CategoryTypes.Filled, color: mychoiceSdkComponents.ColorTypes.Primary, variant: mychoiceSdkComponents.ButtonVariantTypes.Rectangle, size: mychoiceSdkComponents.SizeTypes.Medium }) })] })), jsxRuntime.jsxs("button", { className: "dropdown", onClick: handleDropdownClick, children: [jsxRuntime.jsx("span", { children: detailsIsOpen ? 'Less Info' : 'More Info' }), jsxRuntime.jsx(mychoiceSdkComponents.IconDropdownArrow, { color: "grey", className: detailsIsOpen ? 'rotated' : '' })] }), detailsIsOpen && (jsxRuntime.jsxs("div", { className: "offer-details", children: [!isHubIntegration && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(mychoiceSdkComponents.OfferDetail, { className: isTheBig ? 'thebig-bold' : '', name: offerCompany?.name, companyType: mychoiceSdkComponents.CompanyRoleTypes.Offering, description: offerCompany?.description, isBestOffer: !isMyChoice ? isBestOffer : false, isMyChoice: isMyChoice }), !isMyChoice && jsxRuntime.jsx("hr", {})] })), !isMyChoice && (isTheBig || !offsiteUrl) && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(mychoiceSdkComponents.OfferDetail, { className: isTheBig ? 'thebig-bold' : '', logo: brokerCompany?.logo, name: brokerCompany?.title, companyType: mychoiceSdkComponents.CompanyRoleTypes.Broker, description: brokerCompany?.description, isMyChoice: isMyChoice }), jsxRuntime.jsx("hr", {})] })), !isMyChoice && (jsxRuntime.jsx(mychoiceSdkComponents.OfferDetail, { className: isTheBig ? 'thebig-bold' : '', name: "Hours of Operation", isMyChoice: isMyChoice, children: jsxRuntime.jsx(mychoiceSdkComponents.OperationHoursInfo, { weekdayHours: weekdayHours, saturdayHours: saturdayHours, sundayHours: sundayHours }) })), isMyChoice && coverages && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("hr", {}), jsxRuntime.jsx(VehicleOfferCoverages, { coverages: coverages, nonStandardCoverages: nonStandardCoverages })] }))] }))] }));
426
448
  };
427
449
  OfferSection.defaultProps = {
428
450
  offerPrice: { monthly: 0, yearly: 0 },