@bikdotai/bik-component-library 0.0.721-beta.31 โ 0.0.721-beta.33
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/components/bik-layout/MockMenus.d.ts +0 -1
- package/dist/cjs/components/feature-announcements/FeatureAnnouncementProvider.js +1 -1
- package/dist/cjs/components/feature-announcements/hooks/useFeatureAnnouncements.d.ts +1 -0
- package/dist/cjs/components/feature-announcements/hooks/useFeatureAnnouncements.js +1 -1
- package/dist/cjs/components/feature-announcements/types/feature.types.d.ts +15 -3
- package/dist/cjs/components/whats-new/WhatsNew.types.d.ts +1 -0
- package/dist/cjs/components/whats-new/WhatsNewProvider.js +1 -1
- package/dist/cjs/components/whats-new/useWhatsNew.d.ts +2 -1
- package/dist/cjs/components/whats-new/useWhatsNew.js +1 -1
- package/dist/esm/components/bik-layout/MockMenus.d.ts +0 -1
- package/dist/esm/components/feature-announcements/FeatureAnnouncementProvider.js +1 -1
- package/dist/esm/components/feature-announcements/hooks/useFeatureAnnouncements.d.ts +1 -0
- package/dist/esm/components/feature-announcements/hooks/useFeatureAnnouncements.js +1 -1
- package/dist/esm/components/feature-announcements/types/feature.types.d.ts +15 -3
- package/dist/esm/components/whats-new/WhatsNew.types.d.ts +1 -0
- package/dist/esm/components/whats-new/WhatsNewProvider.js +1 -1
- package/dist/esm/components/whats-new/useWhatsNew.d.ts +2 -1
- package/dist/esm/components/whats-new/useWhatsNew.js +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("../../node_modules/react/jsx-runtime.js"),o=require("react"),n=require("react-joyride");require("./constants/animations.js");var r=require("./constants/selectors.js"),a=require("./hooks/useFeatureAnnouncements.js"),s=require("./MajorUpdatePopup.js"),i=require("./MinorUpdatePopup.js"),l=require("./VideoModal.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=d(n);exports.default=d=>{let{children:c,fetchVisibleFeatures:p,getStoreFeatureProgress:f,fetchFeatureById:g,markFeatureAsViewedForStore:b,isFeatureApplicableToCurrentPage:h,module:m,router:x}=d;var y;const{majorUpdateFeatures:S,minorUpdateFeatures:C,isLoading:k,markFeatureAsViewed:T}=a.useFeatureAnnouncements({fetchVisibleFeatures:p,getStoreFeatureProgress:f,fetchFeatureById:g,markFeatureAsViewedForStore:b,isFeatureApplicableToCurrentPage:h,module:m,router:x}),[w,v]=o.useState(null),[j,E]=o.useState(null),[F,B]=o.useState(!1),[I,N]=o.useState([]),[q,P]=o.useState(!1),[M,R]=o.useState([]),[O,_]=o.useState(!1),[W,A]=o.useState(!1),[L,U]=o.useState([]),[V,$]=o.useState(!1),[z,H]=o.useState(!1),[J,Z]=o.useState(!1),[D,Q]=o.useState(""),[G,K]=o.useState(!1),[X,Y]=o.useState(!1),[ee,te]=o.useState(!1),[oe,ne]=o.useState(0),[re,ae]=o.useState(0),[se,ie]=o.useState(new Set);o.useEffect((()=>{const e="minor-spotlight-cutout-style";let t=document.getElementById(e);return t||(t=document.createElement("style"),t.id=e,document.head.appendChild(t)),t.textContent="\n\t\t\t.react-joyride__spotlight {\n\t\t\t\ttransition: box-shadow 0.3s ease-in-out !important;\n\t\t\t\twill-change: box-shadow, transform;\n\t\t\t\ttransform: translateZ(0);\n\t\t\t}\n\t\t\t.react-joyride__tooltip {\n\t\t\t\twill-change: transform, opacity;\n\t\t\t\ttransform: translateZ(0);\n\t\t\t}\n\t\t",()=>{const t=document.getElementById(e);t&&t.remove()}}),[]),o.useEffect((()=>{console.log("๐ joyrideSteps changed:",{length:I.length,runJoyride:F})}),[I,F]),o.useEffect((()=>{console.log("๐ฏ currentMinorFeature changed:",{id:(null==j?void 0:j.id)||"null"})}),[j]),o.useEffect((()=>{ne((e=>e+1)),ae((e=>e+1)),Y(!1),te(!1),ie(new Set)}),[null==x?void 0:x.pathname]),o.useEffect((()=>{if(!(S.length>0)||w||k||O||G)0!==S.length||k||H(!0);else{H(!1),$(!1),B(!1),N([]),E(null),U([]);const e=()=>{document.querySelector('[data-testid="whats-new-button"]')?le(S[0]):setTimeout(e,1e3)};e()}}),[S,w,k,O,G]),o.useEffect((()=>{var e;const t=null===(e=null==x?void 0:x.query)||void 0===e?void 0:e.featureId;if(console.log("๐งช Test mode effect triggered:",{featureIdFromQuery:t,isLoading:k,minorUpdateFeaturesCount:C.length}),!t||k||0===C.length)return;const o=C.find((e=>e.id===t));if(!o||!o.featureTag)return;$(!0),A(!0);let n=0;const r=setInterval((()=>{n++;const e=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`;if(document.querySelector(e)){console.log("โจ Test mode: Element found, showing joyride");const e=[o];U(e),he(o,e),clearInterval(r)}else n>=25&&(console.warn(`FeatureAnnouncements: Timed out waiting for element with selector: ${e}`),A(!1),clearInterval(r))}),200);return()=>{clearInterval(r)}}),[C,null===(y=null==x?void 0:x.query)||void 0===y?void 0:y.featureId,k]),o.useEffect((()=>{var e;if(console.log("๐ Main minor effect check:",{minorUpdateFeaturesCount:C.length,isLoading:k,runJoyride:F,isProcessingMinorUpdate:W,currentMinorFeature:(null==j?void 0:j.id)||"null",minorFeaturesSkipped:V,showMinorUpdates:z,blockPopups:G}),C.length>0&&!k&&!F&&!W&&!j&&!V&&z&&!G){let e=null,t=null,o=null,n=!1;const r=()=>{if(n||W||j||V||!z)return;const r=C.filter((e=>{if(!e.featureTag||""===e.featureTag.trim())return!1;if(se.has(e.id))return!1;const t=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`;return null!==document.querySelector(t)}));r.length>0&&(console.log("๐ Found available features:",r.length),U(r),he(r[0],r),e&&(e.disconnect(),e=null),t&&(window.removeEventListener("scroll",t),t=null),o&&(clearTimeout(o),o=null))};return e=new MutationObserver((e=>{let t=!1;for(const o of e){if("childList"===o.type&&o.addedNodes.length>0)for(let e=0;e<o.addedNodes.length;e++){const n=o.addedNodes[e];if(n.nodeType===Node.ELEMENT_NODE){const e=n;if(e.id||e.querySelector("[id]")){t=!0;break}}}if(t)break}F||n||W||j||V||!z||!t||(o&&clearTimeout(o),o=setTimeout((()=>{n||W||j||V||!z||r()}),200))})),t=()=>{F||n||W||j||V||!z||(o&&clearTimeout(o),requestAnimationFrame((()=>{o=setTimeout((()=>{n||W||j||V||!z||r()}),300)})))},e&&e.observe(document.body,{childList:!0,subtree:!0}),t&&window.addEventListener("scroll",t,{passive:!0}),r(),setTimeout((()=>{n||W||j||V||!z||r()}),100),setTimeout((()=>{n||W||j||V||!z||r()}),1e3),setTimeout((()=>{n||W||j||V||!z||r()}),500),()=>{n=!0,e&&e.disconnect(),t&&window.removeEventListener("scroll",t),o&&clearTimeout(o)}}if(0===C.length||k){(null===(e=null==x?void 0:x.query)||void 0===e?void 0:e.featureId)&&j?console.log("๐ซ Skipping joyride clear - test mode with active feature"):(console.log("๐๏ธ Clearing joyride - no features or loading"),B(!1),N([]),E(null),U([]),$(!1))}}),[C,k,F,W,j,V,z,T,G]);const le=e=>{v(e);const o=S.findIndex((t=>t.id===e.id)),n=S.length,a=[{target:r.SELECTORS.WHATS_NEW_BUTTON,content:t.jsxRuntimeExports.jsx(s.default,{feature:e,currentIndex:o,totalFeatures:n,onSkip:()=>de(e),onExplore:()=>ue(e),onPrevious:()=>ce(e),onNext:()=>pe(e),setIsClosing:Y}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];R(a),P(!0)},de=o.useCallback((e=>{(e||w)&&(_(!0),S.forEach((e=>{T(e.id)})),P(!1),v(null),R([]),H(!0),setTimeout((()=>{_(!1)}),500))}),[w,S,T]),ue=o.useCallback((e=>{_(!0),T(e.id),e.productVideo&&(Q(e.productVideo),Z(!0),K(!0)),P(!1),v(null),R([]);S.findIndex((t=>t.id===e.id))===S.length-1&&H(!0),setTimeout((()=>{_(!1)}),500)}),[S,T]),ce=o.useCallback((e=>{const o=e||w;if(!o)return;const n=S.findIndex((e=>e.id===o.id));if(n>0){const e=S[n-1];v(e);const o=n-1,r=S.length,a=[{target:'[data-testid="whats-new-button"]',content:t.jsxRuntimeExports.jsx(s.default,{feature:e,currentIndex:o,totalFeatures:r,onSkip:()=>de(e),onExplore:()=>ue(e),onPrevious:()=>ce(e),onNext:()=>pe(e),setIsClosing:Y}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];R(a)}}),[w,S]),pe=o.useCallback((e=>{const o=e||w;if(!o)return;const n=S.findIndex((e=>e.id===o.id));if(n<S.length-1){const e=S[n+1];v(e);const o=n+1,r=S.length,a=[{target:'[data-testid="whats-new-button"]',content:t.jsxRuntimeExports.jsx(s.default,{feature:e,currentIndex:o,totalFeatures:r,onSkip:()=>de(e),onExplore:()=>ue(e),onPrevious:()=>ce(e),onNext:()=>pe(e),setIsClosing:Y}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];R(a)}else _(!0),T(o.id),P(!1),v(null),R([]),H(!0),setTimeout((()=>{_(!1)}),500)}),[w,S,T]),fe=()=>{if(S.length>0&&!w){document.querySelector('[data-testid="whats-new-button"]')&&le(S[0])}};o.useEffect((()=>(window.showMajorUpdatePopup=fe,()=>{delete window.showMajorUpdatePopup})),[S,w]);const ge=o.useCallback((e=>{const{action:t}=e;t===n.ACTIONS.CLOSE&&(w&&(_(!0),S.forEach((e=>{T(e.id)})),H(!0),setTimeout((()=>{_(!1)}),500)),P(!1),v(null),R([]))}),[w,S,T]),be=o.useCallback((e=>{const{action:t,type:o,status:r,lifecycle:a,index:s}=e;if(console.log("๐ Minor Callback:",{action:t,type:o,status:r,lifecycle:a,index:s,hasSteps:I.length,runJoyride:F}),t===n.ACTIONS.CLOSE){if(console.log("โ CLOSE ACTION - Clearing joyride"),j){A(!0),T(j.id);L.findIndex((e=>e.id===j.id))===L.length-1&&$(!0),setTimeout((()=>{A(!1)}),500)}B(!1),E(null),N([])}}),[j,L,T]),he=(o,n)=>e.__awaiter(void 0,void 0,void 0,(function*(){E(o);const e=n||L,r=e.findIndex((e=>e.id===o.id)),a=e.length,s=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`,l=document.querySelector(s);if(l)try{const{scrollToElementSmooth:e}=yield Promise.resolve().then((function(){return require("./utils/elementHelpers.js")}));yield e(l,120)}catch(e){console.warn("Scroll to element failed:",e)}const d=[{target:s,content:t.jsxRuntimeExports.jsx(i.default,{feature:o,currentIndex:r,totalFeatures:a,onSkip:()=>me(o),onExplore:()=>xe(o),onPrevious:()=>ye(o),onNext:()=>Se(o),setIsClosing:te}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:o,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];console.log("โ
Setting joyride:",{currentIndex:r,totalFeatures:a,hasFeatures:e.length,target:s}),N(d),B(!0)})),me=o.useCallback((e=>{const t=e||j;if(t){A(!0),T(t.id),ie((e=>new Set(e).add(t.id))),B(!1),E(null),N([]);const e=L.find((e=>e.id!==t.id&&!se.has(e.id)));setTimeout((()=>{A(!1),e?he(e,L):$(!0)}),500)}}),[j,L,T,se]),xe=o.useCallback((e=>{A(!0),T(e.id),ie((t=>new Set(t).add(e.id))),e.productVideo&&(Q(e.productVideo),Z(!0),K(!0)),B(!1),E(null),N([]);const t=L.find((t=>t.id!==e.id&&!se.has(t.id)));setTimeout((()=>{A(!1),t&&!e.productVideo?he(t,L):t||$(!0)}),500)}),[L,T,se]),ye=o.useCallback((o=>e.__awaiter(void 0,void 0,void 0,(function*(){const e=o||j;if(!e)return;const n=L.findIndex((t=>t.id===e.id));if(n>0){const e=L[n-1];E(e);const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:e}=yield Promise.resolve().then((function(){return require("./utils/elementHelpers.js")}));yield e(r,120)}catch(e){console.warn("Scroll to previous element failed:",e)}const a=n-1,s=L.length,l=[{target:o,content:t.jsxRuntimeExports.jsx(i.default,{feature:e,currentIndex:a,totalFeatures:s,onSkip:()=>me(e),onExplore:()=>xe(e),onPrevious:()=>ye(e),onNext:()=>Se(e),setIsClosing:te}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];N(l)}}))),[j,L]),Se=o.useCallback((o=>e.__awaiter(void 0,void 0,void 0,(function*(){const e=o||j;if(!e)return;const n=L.findIndex((t=>t.id===e.id));if(n<L.length-1){const e=L[n+1];E(e);const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:e}=yield Promise.resolve().then((function(){return require("./utils/elementHelpers.js")}));yield e(r,120)}catch(e){console.warn("Scroll to next element failed:",e)}const a=n+1,s=L.length,l=[{target:o,content:t.jsxRuntimeExports.jsx(i.default,{feature:e,currentIndex:a,totalFeatures:s,onSkip:()=>me(e),onExplore:()=>xe(e),onPrevious:()=>ye(e),onNext:()=>Se(e),setIsClosing:te}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];N(l)}else A(!0),$(!0),T(e.id),B(!1),E(null),N([]),setTimeout((()=>{A(!1)}),500)}))),[j,L,T]);return t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[c,M.length>0&&t.jsxRuntimeExports.jsx(u.default,{steps:M,run:q,continuous:!1,showProgress:!1,showSkipButton:!1,callback:ge,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!0,spotlightClicks:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:X?"transparent":"#212121"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",border:"none",boxShadow:"none"},tooltip:{borderRadius:"16px",fontSize:"14px",padding:0,backgroundColor:"transparent",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}},locale:{back:"Back",close:"Close",last:"Close",next:"Next",skip:"Skip"}},`major-joyride-${oe}`),I.length>0&&t.jsxRuntimeExports.jsx(u.default,{steps:I,run:F,continuous:!1,showProgress:!1,showSkipButton:!1,callback:be,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!1,scrollToFirstStep:!0,scrollOffset:120,disableScrolling:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:ee?"transparent":"#ffffff"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",borderRadius:"8px",boxShadow:ee?"none":"0 0 0 9999px rgba(0, 0, 0, 0.4), 0 0 0 3px rgba(255, 255, 255, 0.8), 0 0 20px 8px rgba(255, 255, 255, 0.4)"},tooltip:{borderRadius:"4px",fontSize:"14px",padding:0,backgroundColor:"transparent",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonSkip:{display:"none"},buttonClose:{display:"none"}},locale:{back:"Back",close:"Close",last:"Close",next:"Next",skip:"Skip"}},`minor-joyride-${re}`),t.jsxRuntimeExports.jsx(l.VideoModal,{isOpen:J,videoUrl:D,onClose:()=>{Z(!1),Q(""),K(!1);const e=L.find((e=>!se.has(e.id)));e?setTimeout((()=>{he(e,L)}),300):$(!0)}})]})};
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("../../node_modules/react/jsx-runtime.js"),o=require("react"),n=require("react-joyride");require("../whats-new/WhatsNew.styles.js"),require("../../constants/Theme.js"),require("../tooltips/Tooltip.js"),require("date-fns"),require("../button/Button.js");var r=require("./VideoModal.js");require("../input/Input.js"),require("react-dom"),require("../TypographyStyle.js"),require("../side-modal/SideModal.style.js");var a=require("../whats-new/WhatsNewProvider.js");require("./constants/animations.js");var s=require("./constants/selectors.js"),i=require("./hooks/useFeatureAnnouncements.js"),l=require("./MajorUpdatePopup.js"),d=require("./MinorUpdatePopup.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=u(n);exports.default=u=>{let{children:p,fetchVisibleFeatures:f,getStoreFeatureProgress:g,fetchFeatureById:b,markFeatureAsViewedForStore:m,isFeatureApplicableToCurrentPage:h,module:y,router:x}=u;var S;const{majorUpdateFeatures:C,minorUpdateFeatures:T,legacyFeatures:w,isLoading:k,markFeatureAsViewed:v}=i.useFeatureAnnouncements({fetchVisibleFeatures:f,getStoreFeatureProgress:g,fetchFeatureById:b,markFeatureAsViewedForStore:m,isFeatureApplicableToCurrentPage:h,module:y,router:x}),[j,E]=o.useState(null),[F,B]=o.useState(null),[I,q]=o.useState(!1),[N,P]=o.useState([]),[M,W]=o.useState(!1),[A,O]=o.useState([]),[R,_]=o.useState(!1),[V,U]=o.useState(!1),[L,$]=o.useState([]),[z,H]=o.useState(!1),[J,Z]=o.useState(!1),[D,Q]=o.useState(!1),[G,K]=o.useState(""),[X,Y]=o.useState(!1),[ee,te]=o.useState(!1),[oe,ne]=o.useState(!1),[re,ae]=o.useState(0),[se,ie]=o.useState(0),[le,de]=o.useState(new Set),ue=o.useMemo((()=>w.map((e=>({id:e.id,title:e.title,body:e.body,content:e.content,image:e.image,buttonText:e.buttonText,redirectUrl:e.redirectUrl,productVideo:e.productVideo,docId:e.id,createdAt:e.createdAt,module:e.module,visibility:e.visibility})))),[w]),ce=o.useCallback((t=>e.__awaiter(void 0,void 0,void 0,(function*(){yield v(t)}))),[v]);o.useEffect((()=>{const e="minor-spotlight-cutout-style";let t=document.getElementById(e);return t||(t=document.createElement("style"),t.id=e,document.head.appendChild(t)),t.textContent="\n\t\t\t.react-joyride__spotlight {\n\t\t\t\ttransition: box-shadow 0.3s ease-in-out !important;\n\t\t\t\twill-change: box-shadow, transform;\n\t\t\t\ttransform: translateZ(0);\n\t\t\t}\n\t\t\t.react-joyride__tooltip {\n\t\t\t\twill-change: transform, opacity;\n\t\t\t\ttransform: translateZ(0);\n\t\t\t}\n\t\t",()=>{const t=document.getElementById(e);t&&t.remove()}}),[]),o.useEffect((()=>{console.log("๐ joyrideSteps changed:",{length:N.length,runJoyride:I})}),[N,I]),o.useEffect((()=>{console.log("๐ฏ currentMinorFeature changed:",{id:(null==F?void 0:F.id)||"null"})}),[F]),o.useEffect((()=>{ae((e=>e+1)),ie((e=>e+1)),te(!1),ne(!1),de(new Set)}),[null==x?void 0:x.pathname]),o.useEffect((()=>{if(!(C.length>0)||j||k||R||X)0!==C.length||k||Z(!0);else{Z(!1),H(!1),q(!1),P([]),B(null),$([]);const e=()=>{document.querySelector('[data-testid="whats-new-button"]')?pe(C[0]):setTimeout(e,1e3)};e()}}),[C,j,k,R,X]),o.useEffect((()=>{var e;const t=null===(e=null==x?void 0:x.query)||void 0===e?void 0:e.featureId;if(console.log("๐งช Test mode effect triggered:",{featureIdFromQuery:t,isLoading:k,minorUpdateFeaturesCount:T.length}),!t||k||0===T.length)return;const o=T.find((e=>e.id===t));if(!o||!o.updates||!o.featureTag)return void console.warn("FeatureAnnouncements: Test mode feature missing required fields (updates/featureTag)");H(!0),U(!0);let n=0;const r=setInterval((()=>{if(n++,!o.featureTag)return;const e=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`;if(document.querySelector(e)){console.log("โจ Test mode: Element found, showing joyride");const e=[o];$(e),Se(o,e),clearInterval(r)}else n>=25&&(console.warn(`FeatureAnnouncements: Timed out waiting for element with selector: ${e}`),U(!1),clearInterval(r))}),200);return()=>{clearInterval(r)}}),[T,null===(S=null==x?void 0:x.query)||void 0===S?void 0:S.featureId,k]),o.useEffect((()=>{var e;if(console.log("๐ Main minor effect check:",{minorUpdateFeaturesCount:T.length,isLoading:k,runJoyride:I,isProcessingMinorUpdate:V,currentMinorFeature:(null==F?void 0:F.id)||"null",minorFeaturesSkipped:z,showMinorUpdates:J,blockPopups:X}),T.length>0&&!k&&!I&&!V&&!F&&!z&&J&&!X){let e=null,t=null,o=null,n=!1;const r=()=>{if(n||V||F||z||!J)return;const r=T.filter((e=>{if(!e.featureTag||""===e.featureTag.trim())return!1;if(le.has(e.id))return!1;const t=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`;return null!==document.querySelector(t)}));r.length>0&&(console.log("๐ Found available features:",r.length),$(r),Se(r[0],r),e&&(e.disconnect(),e=null),t&&(window.removeEventListener("scroll",t),t=null),o&&(clearTimeout(o),o=null))};return e=new MutationObserver((e=>{let t=!1;for(const o of e){if("childList"===o.type&&o.addedNodes.length>0)for(let e=0;e<o.addedNodes.length;e++){const n=o.addedNodes[e];if(n.nodeType===Node.ELEMENT_NODE){const e=n;if(e.id||e.querySelector("[id]")){t=!0;break}}}if(t)break}I||n||V||F||z||!J||!t||(o&&clearTimeout(o),o=setTimeout((()=>{n||V||F||z||!J||r()}),200))})),t=()=>{I||n||V||F||z||!J||(o&&clearTimeout(o),requestAnimationFrame((()=>{o=setTimeout((()=>{n||V||F||z||!J||r()}),300)})))},e&&e.observe(document.body,{childList:!0,subtree:!0}),t&&window.addEventListener("scroll",t,{passive:!0}),r(),setTimeout((()=>{n||V||F||z||!J||r()}),100),setTimeout((()=>{n||V||F||z||!J||r()}),1e3),setTimeout((()=>{n||V||F||z||!J||r()}),500),()=>{n=!0,e&&e.disconnect(),t&&window.removeEventListener("scroll",t),o&&clearTimeout(o)}}if(0===T.length||k){(null===(e=null==x?void 0:x.query)||void 0===e?void 0:e.featureId)&&F?console.log("๐ซ Skipping joyride clear - test mode with active feature"):(console.log("๐๏ธ Clearing joyride - no features or loading"),q(!1),P([]),B(null),$([]),H(!1))}}),[T,k,I,V,F,z,J,v,X]);const pe=e=>{E(e);const o=C.findIndex((t=>t.id===e.id)),n=C.length,r=[{target:s.SELECTORS.WHATS_NEW_BUTTON,content:t.jsxRuntimeExports.jsx(l.default,{feature:e,currentIndex:o,totalFeatures:n,onSkip:()=>fe(e),onExplore:()=>ge(e),onPrevious:()=>be(e),onNext:()=>me(e),setIsClosing:te}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];O(r),W(!0)},fe=o.useCallback((e=>{(e||j)&&(_(!0),C.forEach((e=>{v(e.id)})),W(!1),E(null),O([]),Z(!0),setTimeout((()=>{_(!1)}),500))}),[j,C,v]),ge=o.useCallback((e=>{_(!0),v(e.id),e.productVideo&&(K(e.productVideo),Q(!0),Y(!0)),W(!1),E(null),O([]);C.findIndex((t=>t.id===e.id))===C.length-1&&Z(!0),setTimeout((()=>{_(!1)}),500)}),[C,v]),be=o.useCallback((e=>{const o=e||j;if(!o)return;const n=C.findIndex((e=>e.id===o.id));if(n>0){const e=C[n-1];E(e);const o=n-1,r=C.length,a=[{target:'[data-testid="whats-new-button"]',content:t.jsxRuntimeExports.jsx(l.default,{feature:e,currentIndex:o,totalFeatures:r,onSkip:()=>fe(e),onExplore:()=>ge(e),onPrevious:()=>be(e),onNext:()=>me(e),setIsClosing:te}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];O(a)}}),[j,C]),me=o.useCallback((e=>{const o=e||j;if(!o)return;const n=C.findIndex((e=>e.id===o.id));if(n<C.length-1){const e=C[n+1];E(e);const o=n+1,r=C.length,a=[{target:'[data-testid="whats-new-button"]',content:t.jsxRuntimeExports.jsx(l.default,{feature:e,currentIndex:o,totalFeatures:r,onSkip:()=>fe(e),onExplore:()=>ge(e),onPrevious:()=>be(e),onNext:()=>me(e),setIsClosing:te}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];O(a)}else _(!0),v(o.id),W(!1),E(null),O([]),Z(!0),setTimeout((()=>{_(!1)}),500)}),[j,C,v]),he=()=>{if(C.length>0&&!j){document.querySelector('[data-testid="whats-new-button"]')&&pe(C[0])}};o.useEffect((()=>(window.showMajorUpdatePopup=he,()=>{delete window.showMajorUpdatePopup})),[C,j]);const ye=o.useCallback((e=>{const{action:t}=e;t===n.ACTIONS.CLOSE&&(j&&(_(!0),C.forEach((e=>{v(e.id)})),Z(!0),setTimeout((()=>{_(!1)}),500)),W(!1),E(null),O([]))}),[j,C,v]),xe=o.useCallback((e=>{const{action:t,type:o,status:r,lifecycle:a,index:s}=e;if(console.log("๐ Minor Callback:",{action:t,type:o,status:r,lifecycle:a,index:s,hasSteps:N.length,runJoyride:I}),t===n.ACTIONS.CLOSE){if(console.log("โ CLOSE ACTION - Clearing joyride"),F){U(!0),v(F.id);L.findIndex((e=>e.id===F.id))===L.length-1&&H(!0),setTimeout((()=>{U(!1)}),500)}q(!1),B(null),P([])}}),[F,L,v]),Se=(o,n)=>e.__awaiter(void 0,void 0,void 0,(function*(){if(B(o),!o.featureTag)return void console.warn("FeatureAnnouncements: Cannot show minor joyride without featureTag");const e=n||L,r=e.findIndex((e=>e.id===o.id)),a=e.length,s=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`,i=document.querySelector(s);if(i)try{const{scrollToElementSmooth:e}=yield Promise.resolve().then((function(){return require("./utils/elementHelpers.js")}));yield e(i,120)}catch(e){console.warn("Scroll to element failed:",e)}const l=[{target:s,content:t.jsxRuntimeExports.jsx(d.default,{feature:o,currentIndex:r,totalFeatures:a,onSkip:()=>Ce(o),onExplore:()=>Te(o),onPrevious:()=>we(o),onNext:()=>ke(o),setIsClosing:ne}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:o,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];console.log("โ
Setting joyride:",{currentIndex:r,totalFeatures:a,hasFeatures:e.length,target:s}),P(l),q(!0)})),Ce=o.useCallback((e=>{const t=e||F;if(t){U(!0),v(t.id),de((e=>new Set(e).add(t.id))),q(!1),B(null),P([]);const e=L.find((e=>e.id!==t.id&&!le.has(e.id)));setTimeout((()=>{U(!1),e?Se(e,L):H(!0)}),500)}}),[F,L,v,le]),Te=o.useCallback((e=>{U(!0),v(e.id),de((t=>new Set(t).add(e.id))),e.productVideo&&(K(e.productVideo),Q(!0),Y(!0)),q(!1),B(null),P([]);const t=L.find((t=>t.id!==e.id&&!le.has(t.id)));setTimeout((()=>{U(!1),t&&!e.productVideo?Se(t,L):t||H(!0)}),500)}),[L,v,le]),we=o.useCallback((o=>e.__awaiter(void 0,void 0,void 0,(function*(){const e=o||F;if(!e)return;const n=L.findIndex((t=>t.id===e.id));if(n>0){const e=L[n-1];if(B(e),!e.featureTag)return void console.warn("FeatureAnnouncements: Previous feature missing featureTag");const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:e}=yield Promise.resolve().then((function(){return require("./utils/elementHelpers.js")}));yield e(r,120)}catch(e){console.warn("Scroll to previous element failed:",e)}const a=n-1,s=L.length,i=[{target:o,content:t.jsxRuntimeExports.jsx(d.default,{feature:e,currentIndex:a,totalFeatures:s,onSkip:()=>Ce(e),onExplore:()=>Te(e),onPrevious:()=>we(e),onNext:()=>ke(e),setIsClosing:ne}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];P(i)}}))),[F,L]),ke=o.useCallback((o=>e.__awaiter(void 0,void 0,void 0,(function*(){const e=o||F;if(!e)return;const n=L.findIndex((t=>t.id===e.id));if(n<L.length-1){const e=L[n+1];if(B(e),!e.featureTag)return void console.warn("FeatureAnnouncements: Next feature missing featureTag");const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:e}=yield Promise.resolve().then((function(){return require("./utils/elementHelpers.js")}));yield e(r,120)}catch(e){console.warn("Scroll to next element failed:",e)}const a=n+1,s=L.length,i=[{target:o,content:t.jsxRuntimeExports.jsx(d.default,{feature:e,currentIndex:a,totalFeatures:s,onSkip:()=>Ce(e),onExplore:()=>Te(e),onPrevious:()=>we(e),onNext:()=>ke(e),setIsClosing:ne}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];P(i)}else U(!0),H(!0),v(e.id),q(!1),B(null),P([]),setTimeout((()=>{U(!1)}),500)}))),[F,L,v]);return t.jsxRuntimeExports.jsxs(a.WhatsNewProvider,Object.assign({fetchWhatsNewContent:f,markContentAsViewed:ce,module:y,legacyFeatures:ue},{children:[p,A.length>0&&t.jsxRuntimeExports.jsx(c.default,{steps:A,run:M,continuous:!1,showProgress:!1,showSkipButton:!1,callback:ye,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!0,spotlightClicks:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:ee?"transparent":"#212121"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",border:"none",boxShadow:"none"},tooltip:{borderRadius:"16px",fontSize:"14px",padding:0,backgroundColor:"transparent",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}},locale:{back:"Back",close:"Close",last:"Close",next:"Next",skip:"Skip"}},`major-joyride-${re}`),N.length>0&&t.jsxRuntimeExports.jsx(c.default,{steps:N,run:I,continuous:!1,showProgress:!1,showSkipButton:!1,callback:xe,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!1,scrollToFirstStep:!0,scrollOffset:120,disableScrolling:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:oe?"transparent":"#ffffff"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",borderRadius:"8px",boxShadow:oe?"none":"0 0 0 9999px rgba(0, 0, 0, 0.4), 0 0 0 3px rgba(255, 255, 255, 0.8), 0 0 20px 8px rgba(255, 255, 255, 0.4)"},tooltip:{borderRadius:"4px",fontSize:"14px",padding:0,backgroundColor:"transparent",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonSkip:{display:"none"},buttonClose:{display:"none"}},locale:{back:"Back",close:"Close",last:"Close",next:"Next",skip:"Skip"}},`minor-joyride-${se}`),t.jsxRuntimeExports.jsx(r.VideoModal,{isOpen:D,videoUrl:G,onClose:()=>{Q(!1),K(""),Y(!1);const e=L.find((e=>!le.has(e.id)));e?setTimeout((()=>{Se(e,L)}),300):H(!0)}})]}))};
|
|
@@ -6,6 +6,7 @@ export declare const useFeatureAnnouncements: ({ fetchVisibleFeatures, getStoreF
|
|
|
6
6
|
features: FeatureAnnouncement[];
|
|
7
7
|
majorUpdateFeatures: FeatureAnnouncement[];
|
|
8
8
|
minorUpdateFeatures: FeatureAnnouncement[];
|
|
9
|
+
legacyFeatures: FeatureAnnouncement[];
|
|
9
10
|
isLoading: boolean;
|
|
10
11
|
error: string | null;
|
|
11
12
|
markFeatureAsViewed: (featureId: string) => Promise<void>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),t=require("react"),r=require("../constants/animations.js"),a=require("../constants/localStorageKeys.js");exports.useFeatureAnnouncements=
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),t=require("react"),r=require("../constants/animations.js"),a=require("../constants/localStorageKeys.js");exports.useFeatureAnnouncements=n=>{let{fetchVisibleFeatures:o,getStoreFeatureProgress:i,fetchFeatureById:l,markFeatureAsViewedForStore:u,isFeatureApplicableToCurrentPage:s,module:c,router:d}=n;var f;const p=(()=>{const[e,r]=t.useState(null);return t.useEffect((()=>{if("undefined"!=typeof window){let e=null;try{if(e=localStorage.getItem(a.LOCAL_STORAGE_KEYS.STORE_ID)||localStorage.getItem(a.LOCAL_STORAGE_KEYS.BIK_STORE_ID)||localStorage.getItem(a.LOCAL_STORAGE_KEYS.CURRENT_STORE)||localStorage.getItem(a.LOCAL_STORAGE_KEYS.STORE),!e){const t=localStorage.getItem(a.LOCAL_STORAGE_KEYS.CURRENT_USER);t&&(e=JSON.parse(t).storeId)}e||(e=new URLSearchParams(window.location.search).get(a.LOCAL_STORAGE_KEYS.QUERY_PARAM))}catch(e){console.error("FeatureAnnouncements: Failed to get store ID",e)}r(e)}}),[]),e})(),[g,A]=t.useState([]),[S,_]=t.useState([]),[m,v]=t.useState([]),[y,E]=t.useState([]),[F,w]=t.useState(!1),[R,h]=t.useState(null),D=t.useCallback((()=>e.__awaiter(void 0,void 0,void 0,(function*(){if(p){w(!0),h(null);try{const[e,t]=yield o(c);if(e||!t)return console.error("FeatureAnnouncements: Failed to fetch features",e),void h("Failed to fetch features");const[a,n]=yield i(p);a&&console.warn("FeatureAnnouncements: Progress fetch failed, treating all features as new",a);const l=new Date,u="undefined"!=typeof window?window.location.pathname:"",d=e=>{if(!e.expirationDate)return!0;let t;return"object"==typeof e.expirationDate&&null!==e.expirationDate&&("seconds"in e.expirationDate||"nanoseconds"in e.expirationDate)?t=new Date(1e3*e.expirationDate.seconds):"string"==typeof e.expirationDate?t=new Date(e.expirationDate):e.expirationDate instanceof Date&&(t=e.expirationDate),!(!t||isNaN(t.getTime()))&&l<t},f=e=>{if("Major"===e.featureUpdateType){let t=[];return Array.isArray(e.pageUrls)?t=e.pageUrls:"object"==typeof e.pageUrls&&null!==e.pageUrls&&"length"in e.pageUrls&&(t=Array.from(e.pageUrls)),t.includes(u)}return!0},g=t.filter((e=>{var t;return!((null===(t=null==n?void 0:n.viewedFeatures)||void 0===t?void 0:t[e.id])||!1)&&s(e)&&d(e)&&f(e)})),S=g.filter((e=>!e.updates)),m=g.filter((e=>e.updates)),y=m.filter((e=>"Major"===e.updates)),F=m.filter((e=>"Minor"===e.updates)),w=F.filter((e=>!e.featureTag));w.length>0&&console.warn("FeatureAnnouncements: Found Minor features without featureTag:",w.map((e=>e.id))),console.info("FeatureAnnouncements: Categorized features:",{legacy:S.length,major:y.length,minor:F.length}),A(m),E(S),_(y),setTimeout((()=>{v(F)}),r.ANIMATION_TIMING.MINOR_POPUP_DELAY)}catch(e){console.error("FeatureAnnouncements: Unexpected error in fetchFeatures",e),h("An unexpected error occurred")}finally{w(!1)}}}))),[p,o,i,s,c]),T=t.useCallback((t=>e.__awaiter(void 0,void 0,void 0,(function*(){w(!0),h(null);try{const[e,r]=yield l(t);if(e||!r)return void h("Failed to fetch feature by ID");r.updates?"Major"===r.updates?(_([r]),A([r])):"Minor"===r.updates&&(v([r]),A([r])):E([r])}catch(e){h("An unexpected error occurred while fetching by ID")}finally{w(!1)}}))),[l]),O=t.useCallback((t=>e.__awaiter(void 0,void 0,void 0,(function*(){if(!p)return;const[e]=yield u(p,t);e?(console.warn("FeatureAnnouncements: Failed to mark feature as viewed, removing from local state anyway",e),A((e=>e.filter((e=>e.id!==t)))),_((e=>e.filter((e=>e.id!==t)))),v((e=>e.filter((e=>e.id!==t))))):(A((e=>e.filter((e=>e.id!==t)))),_((e=>e.filter((e=>e.id!==t)))),v((e=>e.filter((e=>e.id!==t)))))}))),[p,u]);return t.useEffect((()=>{var e;const t=null===(e=null==d?void 0:d.query)||void 0===e?void 0:e[a.QUERY_PARAMS.FEATURE_ID];t&&d?T(t):D()}),[null==d?void 0:d.pathname,null===(f=null==d?void 0:d.query)||void 0===f?void 0:f[a.QUERY_PARAMS.FEATURE_ID],p,D,T,d]),{features:g,majorUpdateFeatures:S,minorUpdateFeatures:m,legacyFeatures:y,isLoading:F,error:R,markFeatureAsViewed:O,refetch:D}};
|
|
@@ -7,6 +7,16 @@ export interface FirestoreTimestamp {
|
|
|
7
7
|
}
|
|
8
8
|
/**
|
|
9
9
|
* Feature announcement data model
|
|
10
|
+
*
|
|
11
|
+
* LEGACY FEATURES (BIK only):
|
|
12
|
+
* - No `updates` field
|
|
13
|
+
* - Displayed in WhatsNew panel with HTML rendering
|
|
14
|
+
* - No popups
|
|
15
|
+
*
|
|
16
|
+
* POPUP FEATURES:
|
|
17
|
+
* - Have `updates: 'Major' | 'Minor'`
|
|
18
|
+
* - Major: No featureTag, anchored to WhatsNew button, requires pageUrls
|
|
19
|
+
* - Minor: Requires featureTag, anchored to UI elements
|
|
10
20
|
*/
|
|
11
21
|
export interface FeatureAnnouncement {
|
|
12
22
|
id: string;
|
|
@@ -15,14 +25,16 @@ export interface FeatureAnnouncement {
|
|
|
15
25
|
content: string;
|
|
16
26
|
buttonText: string;
|
|
17
27
|
displayImage: string;
|
|
18
|
-
|
|
19
|
-
|
|
28
|
+
/** Element selector - required for Minor popups, not used for Major */
|
|
29
|
+
featureTag?: string;
|
|
30
|
+
featureUpdateType?: 'Major' | 'Minor';
|
|
20
31
|
image: string;
|
|
21
32
|
module: string[];
|
|
22
33
|
pageUrls: string[];
|
|
23
34
|
productVideo: string;
|
|
24
35
|
redirectUrl: string;
|
|
25
|
-
|
|
36
|
+
/** Distinguishes popup features ('Major'/'Minor') from legacy features (undefined/empty) */
|
|
37
|
+
updates?: 'Major' | 'Minor';
|
|
26
38
|
visibility: boolean;
|
|
27
39
|
createdAt: FirestoreTimestamp;
|
|
28
40
|
expirationDate?: FirestoreTimestamp | string | Date;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("react"),r=require("./useWhatsNew.js");const s=t.createContext(null);exports.WhatsNewProvider=t=>{let{children:n,fetchWhatsNewContent:o,markContentAsViewed:u,module:a}=t;const
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("react"),r=require("./useWhatsNew.js");const s=t.createContext(null);exports.WhatsNewProvider=t=>{let{children:n,fetchWhatsNewContent:o,markContentAsViewed:u,module:a,legacyFeatures:i=[]}=t;const c=r.useWhatsNew({fetchWhatsNewContent:o,markContentAsViewed:u,module:a,legacyFeatures:i});return e.jsxRuntimeExports.jsx(s.Provider,Object.assign({value:c},{children:n}))},exports.useWhatsNewContext=()=>{const e=t.useContext(s);if(!e)throw new Error("useWhatsNewContext must be used within a WhatsNewProvider");return e};
|
|
@@ -4,6 +4,7 @@ interface UseWhatsNewProps {
|
|
|
4
4
|
markContentAsViewed?: (contentId: string) => Promise<void>;
|
|
5
5
|
module?: string;
|
|
6
6
|
newContentThresholdDays?: number;
|
|
7
|
+
legacyFeatures?: WhatsNewContent[];
|
|
7
8
|
}
|
|
8
|
-
export declare const useWhatsNew: ({ fetchWhatsNewContent, markContentAsViewed, module, newContentThresholdDays, }: UseWhatsNewProps) => WhatsNewHookReturn;
|
|
9
|
+
export declare const useWhatsNew: ({ fetchWhatsNewContent, markContentAsViewed, module, newContentThresholdDays, legacyFeatures, }: UseWhatsNewProps) => WhatsNewHookReturn;
|
|
9
10
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("date-fns"),r=require("react");exports.useWhatsNew=a=>{let{fetchWhatsNewContent:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("date-fns"),r=require("react");exports.useWhatsNew=a=>{let{fetchWhatsNewContent:o,markContentAsViewed:n,module:c,newContentThresholdDays:i=7,legacyFeatures:d=[]}=a;const[s,u]=r.useState([]),[l,f]=r.useState(!0),v=r.useRef(o),w=r.useRef(n);r.useEffect((()=>{v.current=o}),[o]),r.useEffect((()=>{w.current=n}),[n]);const A=r.useCallback((()=>e.__awaiter(void 0,void 0,void 0,(function*(){f(!0);try{const[e,t]=yield v.current();if(e)console.error("Failed to fetch what's new content:",e),u([]);else if(t){let e=t;c&&(e=t.filter((e=>Array.isArray(e.module)?e.module.includes(c):e.module===c))),e.sort(((e,t)=>{var r,a;const o=(null===(r=e.createdAt)||void 0===r?void 0:r.toDate)?e.createdAt.toDate():new Date(e.createdAt);return((null===(a=t.createdAt)||void 0===a?void 0:a.toDate)?t.createdAt.toDate():new Date(t.createdAt)).getTime()-o.getTime()}));const r=[...e,...d];r.sort(((e,t)=>{var r,a;const o=(null===(r=e.createdAt)||void 0===r?void 0:r.toDate)?e.createdAt.toDate():new Date(e.createdAt);return((null===(a=t.createdAt)||void 0===a?void 0:a.toDate)?t.createdAt.toDate():new Date(t.createdAt)).getTime()-o.getTime()})),u(r)}else u([...d])}catch(e){console.error("Failed to fetch what's new content:",e),u([...d])}finally{f(!1)}}))),[c,d]);r.useEffect((()=>{A()}),[A]);const D=r.useCallback((e=>{if(!e.createdAt)return!1;const r=e.createdAt.toDate?e.createdAt.toDate():new Date(e.createdAt);return t.differenceInBusinessDays(new Date,r)<i}),[i]),h=s.reduce(((e,t)=>D(t)?e+1:e),0);return{whatsNewContent:s,isLoading:l,newContentCount:h,markAsViewed:r.useCallback((t=>e.__awaiter(void 0,void 0,void 0,(function*(){if(w.current)try{yield w.current(t)}catch(e){console.warn("Failed to mark content as viewed:",e)}}))),[]),refreshContent:r.useCallback((()=>e.__awaiter(void 0,void 0,void 0,(function*(){yield A()}))),[A])}};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__awaiter as e}from"../../_virtual/_tslib.js";import{j as t}from"../../node_modules/react/jsx-runtime.js";import{useState as o,useEffect as n,useCallback as r}from"react";import a,{ACTIONS as i}from"react-joyride";import"./constants/animations.js";import{SELECTORS as s}from"./constants/selectors.js";import{useFeatureAnnouncements as l}from"./hooks/useFeatureAnnouncements.js";import d from"./MajorUpdatePopup.js";import u from"./MinorUpdatePopup.js";import{VideoModal as c}from"./VideoModal.js";const p=p=>{let{children:f,fetchVisibleFeatures:g,getStoreFeatureProgress:m,fetchFeatureById:h,markFeatureAsViewedForStore:b,isFeatureApplicableToCurrentPage:y,module:x,router:S}=p;var C;const{majorUpdateFeatures:k,minorUpdateFeatures:T,isLoading:w,markFeatureAsViewed:v}=l({fetchVisibleFeatures:g,getStoreFeatureProgress:m,fetchFeatureById:h,markFeatureAsViewedForStore:b,isFeatureApplicableToCurrentPage:y,module:x,router:S}),[j,B]=o(null),[F,I]=o(null),[E,N]=o(!1),[M,P]=o([]),[W,O]=o(!1),[q,L]=o([]),[U,V]=o(!1),[A,_]=o(!1),[R,$]=o([]),[z,H]=o(!1),[J,Z]=o(!1),[D,Q]=o(!1),[G,K]=o(""),[X,Y]=o(!1),[ee,te]=o(!1),[oe,ne]=o(!1),[re,ae]=o(0),[ie,se]=o(0),[le,de]=o(new Set);n((()=>{const e="minor-spotlight-cutout-style";let t=document.getElementById(e);return t||(t=document.createElement("style"),t.id=e,document.head.appendChild(t)),t.textContent="\n\t\t\t.react-joyride__spotlight {\n\t\t\t\ttransition: box-shadow 0.3s ease-in-out !important;\n\t\t\t\twill-change: box-shadow, transform;\n\t\t\t\ttransform: translateZ(0);\n\t\t\t}\n\t\t\t.react-joyride__tooltip {\n\t\t\t\twill-change: transform, opacity;\n\t\t\t\ttransform: translateZ(0);\n\t\t\t}\n\t\t",()=>{const t=document.getElementById(e);t&&t.remove()}}),[]),n((()=>{console.log("๐ joyrideSteps changed:",{length:M.length,runJoyride:E})}),[M,E]),n((()=>{console.log("๐ฏ currentMinorFeature changed:",{id:(null==F?void 0:F.id)||"null"})}),[F]),n((()=>{ae((e=>e+1)),se((e=>e+1)),te(!1),ne(!1),de(new Set)}),[null==S?void 0:S.pathname]),n((()=>{if(!(k.length>0)||j||w||U||X)0!==k.length||w||Z(!0);else{Z(!1),H(!1),N(!1),P([]),I(null),$([]);const e=()=>{document.querySelector('[data-testid="whats-new-button"]')?ue(k[0]):setTimeout(e,1e3)};e()}}),[k,j,w,U,X]),n((()=>{var e;const t=null===(e=null==S?void 0:S.query)||void 0===e?void 0:e.featureId;if(console.log("๐งช Test mode effect triggered:",{featureIdFromQuery:t,isLoading:w,minorUpdateFeaturesCount:T.length}),!t||w||0===T.length)return;const o=T.find((e=>e.id===t));if(!o||!o.featureTag)return;H(!0),_(!0);let n=0;const r=setInterval((()=>{n++;const e=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`;if(document.querySelector(e)){console.log("โจ Test mode: Element found, showing joyride");const e=[o];$(e),ye(o,e),clearInterval(r)}else n>=25&&(console.warn(`FeatureAnnouncements: Timed out waiting for element with selector: ${e}`),_(!1),clearInterval(r))}),200);return()=>{clearInterval(r)}}),[T,null===(C=null==S?void 0:S.query)||void 0===C?void 0:C.featureId,w]),n((()=>{var e;if(console.log("๐ Main minor effect check:",{minorUpdateFeaturesCount:T.length,isLoading:w,runJoyride:E,isProcessingMinorUpdate:A,currentMinorFeature:(null==F?void 0:F.id)||"null",minorFeaturesSkipped:z,showMinorUpdates:J,blockPopups:X}),T.length>0&&!w&&!E&&!A&&!F&&!z&&J&&!X){let e=null,t=null,o=null,n=!1;const r=()=>{if(n||A||F||z||!J)return;const r=T.filter((e=>{if(!e.featureTag||""===e.featureTag.trim())return!1;if(le.has(e.id))return!1;const t=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`;return null!==document.querySelector(t)}));r.length>0&&(console.log("๐ Found available features:",r.length),$(r),ye(r[0],r),e&&(e.disconnect(),e=null),t&&(window.removeEventListener("scroll",t),t=null),o&&(clearTimeout(o),o=null))};return e=new MutationObserver((e=>{let t=!1;for(const o of e){if("childList"===o.type&&o.addedNodes.length>0)for(let e=0;e<o.addedNodes.length;e++){const n=o.addedNodes[e];if(n.nodeType===Node.ELEMENT_NODE){const e=n;if(e.id||e.querySelector("[id]")){t=!0;break}}}if(t)break}E||n||A||F||z||!J||!t||(o&&clearTimeout(o),o=setTimeout((()=>{n||A||F||z||!J||r()}),200))})),t=()=>{E||n||A||F||z||!J||(o&&clearTimeout(o),requestAnimationFrame((()=>{o=setTimeout((()=>{n||A||F||z||!J||r()}),300)})))},e&&e.observe(document.body,{childList:!0,subtree:!0}),t&&window.addEventListener("scroll",t,{passive:!0}),r(),setTimeout((()=>{n||A||F||z||!J||r()}),100),setTimeout((()=>{n||A||F||z||!J||r()}),1e3),setTimeout((()=>{n||A||F||z||!J||r()}),500),()=>{n=!0,e&&e.disconnect(),t&&window.removeEventListener("scroll",t),o&&clearTimeout(o)}}if(0===T.length||w){(null===(e=null==S?void 0:S.query)||void 0===e?void 0:e.featureId)&&F?console.log("๐ซ Skipping joyride clear - test mode with active feature"):(console.log("๐๏ธ Clearing joyride - no features or loading"),N(!1),P([]),I(null),$([]),H(!1))}}),[T,w,E,A,F,z,J,v,X]);const ue=e=>{B(e);const o=k.findIndex((t=>t.id===e.id)),n=k.length,r=[{target:s.WHATS_NEW_BUTTON,content:t.jsx(d,{feature:e,currentIndex:o,totalFeatures:n,onSkip:()=>ce(e),onExplore:()=>pe(e),onPrevious:()=>fe(e),onNext:()=>ge(e),setIsClosing:te}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];L(r),O(!0)},ce=r((e=>{(e||j)&&(V(!0),k.forEach((e=>{v(e.id)})),O(!1),B(null),L([]),Z(!0),setTimeout((()=>{V(!1)}),500))}),[j,k,v]),pe=r((e=>{V(!0),v(e.id),e.productVideo&&(K(e.productVideo),Q(!0),Y(!0)),O(!1),B(null),L([]);k.findIndex((t=>t.id===e.id))===k.length-1&&Z(!0),setTimeout((()=>{V(!1)}),500)}),[k,v]),fe=r((e=>{const o=e||j;if(!o)return;const n=k.findIndex((e=>e.id===o.id));if(n>0){const e=k[n-1];B(e);const o=n-1,r=k.length,a=[{target:'[data-testid="whats-new-button"]',content:t.jsx(d,{feature:e,currentIndex:o,totalFeatures:r,onSkip:()=>ce(e),onExplore:()=>pe(e),onPrevious:()=>fe(e),onNext:()=>ge(e),setIsClosing:te}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];L(a)}}),[j,k]),ge=r((e=>{const o=e||j;if(!o)return;const n=k.findIndex((e=>e.id===o.id));if(n<k.length-1){const e=k[n+1];B(e);const o=n+1,r=k.length,a=[{target:'[data-testid="whats-new-button"]',content:t.jsx(d,{feature:e,currentIndex:o,totalFeatures:r,onSkip:()=>ce(e),onExplore:()=>pe(e),onPrevious:()=>fe(e),onNext:()=>ge(e),setIsClosing:te}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];L(a)}else V(!0),v(o.id),O(!1),B(null),L([]),Z(!0),setTimeout((()=>{V(!1)}),500)}),[j,k,v]),me=()=>{if(k.length>0&&!j){document.querySelector('[data-testid="whats-new-button"]')&&ue(k[0])}};n((()=>(window.showMajorUpdatePopup=me,()=>{delete window.showMajorUpdatePopup})),[k,j]);const he=r((e=>{const{action:t}=e;t===i.CLOSE&&(j&&(V(!0),k.forEach((e=>{v(e.id)})),Z(!0),setTimeout((()=>{V(!1)}),500)),O(!1),B(null),L([]))}),[j,k,v]),be=r((e=>{const{action:t,type:o,status:n,lifecycle:r,index:a}=e;if(console.log("๐ Minor Callback:",{action:t,type:o,status:n,lifecycle:r,index:a,hasSteps:M.length,runJoyride:E}),t===i.CLOSE){if(console.log("โ CLOSE ACTION - Clearing joyride"),F){_(!0),v(F.id);R.findIndex((e=>e.id===F.id))===R.length-1&&H(!0),setTimeout((()=>{_(!1)}),500)}N(!1),I(null),P([])}}),[F,R,v]),ye=(o,n)=>e(void 0,void 0,void 0,(function*(){I(o);const e=n||R,r=e.findIndex((e=>e.id===o.id)),a=e.length,i=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`,s=document.querySelector(i);if(s)try{const{scrollToElementSmooth:e}=yield import("./utils/elementHelpers.js");yield e(s,120)}catch(e){console.warn("Scroll to element failed:",e)}const l=[{target:i,content:t.jsx(u,{feature:o,currentIndex:r,totalFeatures:a,onSkip:()=>xe(o),onExplore:()=>Se(o),onPrevious:()=>Ce(o),onNext:()=>ke(o),setIsClosing:ne}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:o,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];console.log("โ
Setting joyride:",{currentIndex:r,totalFeatures:a,hasFeatures:e.length,target:i}),P(l),N(!0)})),xe=r((e=>{const t=e||F;if(t){_(!0),v(t.id),de((e=>new Set(e).add(t.id))),N(!1),I(null),P([]);const e=R.find((e=>e.id!==t.id&&!le.has(e.id)));setTimeout((()=>{_(!1),e?ye(e,R):H(!0)}),500)}}),[F,R,v,le]),Se=r((e=>{_(!0),v(e.id),de((t=>new Set(t).add(e.id))),e.productVideo&&(K(e.productVideo),Q(!0),Y(!0)),N(!1),I(null),P([]);const t=R.find((t=>t.id!==e.id&&!le.has(t.id)));setTimeout((()=>{_(!1),t&&!e.productVideo?ye(t,R):t||H(!0)}),500)}),[R,v,le]),Ce=r((o=>e(void 0,void 0,void 0,(function*(){const e=o||F;if(!e)return;const n=R.findIndex((t=>t.id===e.id));if(n>0){const e=R[n-1];I(e);const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:e}=yield import("./utils/elementHelpers.js");yield e(r,120)}catch(e){console.warn("Scroll to previous element failed:",e)}const a=n-1,i=R.length,s=[{target:o,content:t.jsx(u,{feature:e,currentIndex:a,totalFeatures:i,onSkip:()=>xe(e),onExplore:()=>Se(e),onPrevious:()=>Ce(e),onNext:()=>ke(e),setIsClosing:ne}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];P(s)}}))),[F,R]),ke=r((o=>e(void 0,void 0,void 0,(function*(){const e=o||F;if(!e)return;const n=R.findIndex((t=>t.id===e.id));if(n<R.length-1){const e=R[n+1];I(e);const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:e}=yield import("./utils/elementHelpers.js");yield e(r,120)}catch(e){console.warn("Scroll to next element failed:",e)}const a=n+1,i=R.length,s=[{target:o,content:t.jsx(u,{feature:e,currentIndex:a,totalFeatures:i,onSkip:()=>xe(e),onExplore:()=>Se(e),onPrevious:()=>Ce(e),onNext:()=>ke(e),setIsClosing:ne}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];P(s)}else _(!0),H(!0),v(e.id),N(!1),I(null),P([]),setTimeout((()=>{_(!1)}),500)}))),[F,R,v]);return t.jsxs(t.Fragment,{children:[f,q.length>0&&t.jsx(a,{steps:q,run:W,continuous:!1,showProgress:!1,showSkipButton:!1,callback:he,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!0,spotlightClicks:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:ee?"transparent":"#212121"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",border:"none",boxShadow:"none"},tooltip:{borderRadius:"16px",fontSize:"14px",padding:0,backgroundColor:"transparent",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}},locale:{back:"Back",close:"Close",last:"Close",next:"Next",skip:"Skip"}},`major-joyride-${re}`),M.length>0&&t.jsx(a,{steps:M,run:E,continuous:!1,showProgress:!1,showSkipButton:!1,callback:be,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!1,scrollToFirstStep:!0,scrollOffset:120,disableScrolling:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:oe?"transparent":"#ffffff"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",borderRadius:"8px",boxShadow:oe?"none":"0 0 0 9999px rgba(0, 0, 0, 0.4), 0 0 0 3px rgba(255, 255, 255, 0.8), 0 0 20px 8px rgba(255, 255, 255, 0.4)"},tooltip:{borderRadius:"4px",fontSize:"14px",padding:0,backgroundColor:"transparent",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonSkip:{display:"none"},buttonClose:{display:"none"}},locale:{back:"Back",close:"Close",last:"Close",next:"Next",skip:"Skip"}},`minor-joyride-${ie}`),t.jsx(c,{isOpen:D,videoUrl:G,onClose:()=>{Q(!1),K(""),Y(!1);const e=R.find((e=>!le.has(e.id)));e?setTimeout((()=>{ye(e,R)}),300):H(!0)}})]})};export{p as default};
|
|
1
|
+
import{__awaiter as e}from"../../_virtual/_tslib.js";import{j as t}from"../../node_modules/react/jsx-runtime.js";import{useState as o,useMemo as n,useCallback as r,useEffect as i}from"react";import a,{ACTIONS as s}from"react-joyride";import"../whats-new/WhatsNew.styles.js";import"../../constants/Theme.js";import"../tooltips/Tooltip.js";import"date-fns";import"../button/Button.js";import{VideoModal as l}from"./VideoModal.js";import"../input/Input.js";import"react-dom";import"../TypographyStyle.js";import"../side-modal/SideModal.style.js";import{WhatsNewProvider as d}from"../whats-new/WhatsNewProvider.js";import"./constants/animations.js";import{SELECTORS as u}from"./constants/selectors.js";import{useFeatureAnnouncements as c}from"./hooks/useFeatureAnnouncements.js";import p from"./MajorUpdatePopup.js";import f from"./MinorUpdatePopup.js";const g=g=>{let{children:m,fetchVisibleFeatures:h,getStoreFeatureProgress:b,fetchFeatureById:y,markFeatureAsViewedForStore:x,isFeatureApplicableToCurrentPage:T,module:w,router:S}=g;var C;const{majorUpdateFeatures:k,minorUpdateFeatures:v,legacyFeatures:j,isLoading:F,markFeatureAsViewed:B}=c({fetchVisibleFeatures:h,getStoreFeatureProgress:b,fetchFeatureById:y,markFeatureAsViewedForStore:x,isFeatureApplicableToCurrentPage:T,module:w,router:S}),[I,N]=o(null),[E,M]=o(null),[P,W]=o(!1),[A,O]=o([]),[U,V]=o(!1),[q,L]=o([]),[_,R]=o(!1),[$,z]=o(!1),[H,J]=o([]),[Z,D]=o(!1),[Q,G]=o(!1),[K,X]=o(!1),[Y,ee]=o(""),[te,oe]=o(!1),[ne,re]=o(!1),[ie,ae]=o(!1),[se,le]=o(0),[de,ue]=o(0),[ce,pe]=o(new Set),fe=n((()=>j.map((e=>({id:e.id,title:e.title,body:e.body,content:e.content,image:e.image,buttonText:e.buttonText,redirectUrl:e.redirectUrl,productVideo:e.productVideo,docId:e.id,createdAt:e.createdAt,module:e.module,visibility:e.visibility})))),[j]),ge=r((t=>e(void 0,void 0,void 0,(function*(){yield B(t)}))),[B]);i((()=>{const e="minor-spotlight-cutout-style";let t=document.getElementById(e);return t||(t=document.createElement("style"),t.id=e,document.head.appendChild(t)),t.textContent="\n\t\t\t.react-joyride__spotlight {\n\t\t\t\ttransition: box-shadow 0.3s ease-in-out !important;\n\t\t\t\twill-change: box-shadow, transform;\n\t\t\t\ttransform: translateZ(0);\n\t\t\t}\n\t\t\t.react-joyride__tooltip {\n\t\t\t\twill-change: transform, opacity;\n\t\t\t\ttransform: translateZ(0);\n\t\t\t}\n\t\t",()=>{const t=document.getElementById(e);t&&t.remove()}}),[]),i((()=>{console.log("๐ joyrideSteps changed:",{length:A.length,runJoyride:P})}),[A,P]),i((()=>{console.log("๐ฏ currentMinorFeature changed:",{id:(null==E?void 0:E.id)||"null"})}),[E]),i((()=>{le((e=>e+1)),ue((e=>e+1)),re(!1),ae(!1),pe(new Set)}),[null==S?void 0:S.pathname]),i((()=>{if(!(k.length>0)||I||F||_||te)0!==k.length||F||G(!0);else{G(!1),D(!1),W(!1),O([]),M(null),J([]);const e=()=>{document.querySelector('[data-testid="whats-new-button"]')?me(k[0]):setTimeout(e,1e3)};e()}}),[k,I,F,_,te]),i((()=>{var e;const t=null===(e=null==S?void 0:S.query)||void 0===e?void 0:e.featureId;if(console.log("๐งช Test mode effect triggered:",{featureIdFromQuery:t,isLoading:F,minorUpdateFeaturesCount:v.length}),!t||F||0===v.length)return;const o=v.find((e=>e.id===t));if(!o||!o.updates||!o.featureTag)return void console.warn("FeatureAnnouncements: Test mode feature missing required fields (updates/featureTag)");D(!0),z(!0);let n=0;const r=setInterval((()=>{if(n++,!o.featureTag)return;const e=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`;if(document.querySelector(e)){console.log("โจ Test mode: Element found, showing joyride");const e=[o];J(e),Ce(o,e),clearInterval(r)}else n>=25&&(console.warn(`FeatureAnnouncements: Timed out waiting for element with selector: ${e}`),z(!1),clearInterval(r))}),200);return()=>{clearInterval(r)}}),[v,null===(C=null==S?void 0:S.query)||void 0===C?void 0:C.featureId,F]),i((()=>{var e;if(console.log("๐ Main minor effect check:",{minorUpdateFeaturesCount:v.length,isLoading:F,runJoyride:P,isProcessingMinorUpdate:$,currentMinorFeature:(null==E?void 0:E.id)||"null",minorFeaturesSkipped:Z,showMinorUpdates:Q,blockPopups:te}),v.length>0&&!F&&!P&&!$&&!E&&!Z&&Q&&!te){let e=null,t=null,o=null,n=!1;const r=()=>{if(n||$||E||Z||!Q)return;const r=v.filter((e=>{if(!e.featureTag||""===e.featureTag.trim())return!1;if(ce.has(e.id))return!1;const t=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`;return null!==document.querySelector(t)}));r.length>0&&(console.log("๐ Found available features:",r.length),J(r),Ce(r[0],r),e&&(e.disconnect(),e=null),t&&(window.removeEventListener("scroll",t),t=null),o&&(clearTimeout(o),o=null))};return e=new MutationObserver((e=>{let t=!1;for(const o of e){if("childList"===o.type&&o.addedNodes.length>0)for(let e=0;e<o.addedNodes.length;e++){const n=o.addedNodes[e];if(n.nodeType===Node.ELEMENT_NODE){const e=n;if(e.id||e.querySelector("[id]")){t=!0;break}}}if(t)break}P||n||$||E||Z||!Q||!t||(o&&clearTimeout(o),o=setTimeout((()=>{n||$||E||Z||!Q||r()}),200))})),t=()=>{P||n||$||E||Z||!Q||(o&&clearTimeout(o),requestAnimationFrame((()=>{o=setTimeout((()=>{n||$||E||Z||!Q||r()}),300)})))},e&&e.observe(document.body,{childList:!0,subtree:!0}),t&&window.addEventListener("scroll",t,{passive:!0}),r(),setTimeout((()=>{n||$||E||Z||!Q||r()}),100),setTimeout((()=>{n||$||E||Z||!Q||r()}),1e3),setTimeout((()=>{n||$||E||Z||!Q||r()}),500),()=>{n=!0,e&&e.disconnect(),t&&window.removeEventListener("scroll",t),o&&clearTimeout(o)}}if(0===v.length||F){(null===(e=null==S?void 0:S.query)||void 0===e?void 0:e.featureId)&&E?console.log("๐ซ Skipping joyride clear - test mode with active feature"):(console.log("๐๏ธ Clearing joyride - no features or loading"),W(!1),O([]),M(null),J([]),D(!1))}}),[v,F,P,$,E,Z,Q,B,te]);const me=e=>{N(e);const o=k.findIndex((t=>t.id===e.id)),n=k.length,r=[{target:u.WHATS_NEW_BUTTON,content:t.jsx(p,{feature:e,currentIndex:o,totalFeatures:n,onSkip:()=>he(e),onExplore:()=>be(e),onPrevious:()=>ye(e),onNext:()=>xe(e),setIsClosing:re}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];L(r),V(!0)},he=r((e=>{(e||I)&&(R(!0),k.forEach((e=>{B(e.id)})),V(!1),N(null),L([]),G(!0),setTimeout((()=>{R(!1)}),500))}),[I,k,B]),be=r((e=>{R(!0),B(e.id),e.productVideo&&(ee(e.productVideo),X(!0),oe(!0)),V(!1),N(null),L([]);k.findIndex((t=>t.id===e.id))===k.length-1&&G(!0),setTimeout((()=>{R(!1)}),500)}),[k,B]),ye=r((e=>{const o=e||I;if(!o)return;const n=k.findIndex((e=>e.id===o.id));if(n>0){const e=k[n-1];N(e);const o=n-1,r=k.length,i=[{target:'[data-testid="whats-new-button"]',content:t.jsx(p,{feature:e,currentIndex:o,totalFeatures:r,onSkip:()=>he(e),onExplore:()=>be(e),onPrevious:()=>ye(e),onNext:()=>xe(e),setIsClosing:re}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];L(i)}}),[I,k]),xe=r((e=>{const o=e||I;if(!o)return;const n=k.findIndex((e=>e.id===o.id));if(n<k.length-1){const e=k[n+1];N(e);const o=n+1,r=k.length,i=[{target:'[data-testid="whats-new-button"]',content:t.jsx(p,{feature:e,currentIndex:o,totalFeatures:r,onSkip:()=>he(e),onExplore:()=>be(e),onPrevious:()=>ye(e),onNext:()=>xe(e),setIsClosing:re}),placement:"bottom-start",placementBeacon:"top-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMajor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"16px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];L(i)}else R(!0),B(o.id),V(!1),N(null),L([]),G(!0),setTimeout((()=>{R(!1)}),500)}),[I,k,B]),Te=()=>{if(k.length>0&&!I){document.querySelector('[data-testid="whats-new-button"]')&&me(k[0])}};i((()=>(window.showMajorUpdatePopup=Te,()=>{delete window.showMajorUpdatePopup})),[k,I]);const we=r((e=>{const{action:t}=e;t===s.CLOSE&&(I&&(R(!0),k.forEach((e=>{B(e.id)})),G(!0),setTimeout((()=>{R(!1)}),500)),V(!1),N(null),L([]))}),[I,k,B]),Se=r((e=>{const{action:t,type:o,status:n,lifecycle:r,index:i}=e;if(console.log("๐ Minor Callback:",{action:t,type:o,status:n,lifecycle:r,index:i,hasSteps:A.length,runJoyride:P}),t===s.CLOSE){if(console.log("โ CLOSE ACTION - Clearing joyride"),E){z(!0),B(E.id);H.findIndex((e=>e.id===E.id))===H.length-1&&D(!0),setTimeout((()=>{z(!1)}),500)}W(!1),M(null),O([])}}),[E,H,B]),Ce=(o,n)=>e(void 0,void 0,void 0,(function*(){if(M(o),!o.featureTag)return void console.warn("FeatureAnnouncements: Cannot show minor joyride without featureTag");const e=n||H,r=e.findIndex((e=>e.id===o.id)),i=e.length,a=o.featureTag.startsWith("#")||o.featureTag.startsWith(".")||o.featureTag.startsWith("[")?o.featureTag:`#${o.featureTag}`,s=document.querySelector(a);if(s)try{const{scrollToElementSmooth:e}=yield import("./utils/elementHelpers.js");yield e(s,120)}catch(e){console.warn("Scroll to element failed:",e)}const l=[{target:a,content:t.jsx(f,{feature:o,currentIndex:r,totalFeatures:i,onSkip:()=>ke(o),onExplore:()=>ve(o),onPrevious:()=>je(o),onNext:()=>Fe(o),setIsClosing:ae}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:o,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];console.log("โ
Setting joyride:",{currentIndex:r,totalFeatures:i,hasFeatures:e.length,target:a}),O(l),W(!0)})),ke=r((e=>{const t=e||E;if(t){z(!0),B(t.id),pe((e=>new Set(e).add(t.id))),W(!1),M(null),O([]);const e=H.find((e=>e.id!==t.id&&!ce.has(e.id)));setTimeout((()=>{z(!1),e?Ce(e,H):D(!0)}),500)}}),[E,H,B,ce]),ve=r((e=>{z(!0),B(e.id),pe((t=>new Set(t).add(e.id))),e.productVideo&&(ee(e.productVideo),X(!0),oe(!0)),W(!1),M(null),O([]);const t=H.find((t=>t.id!==e.id&&!ce.has(t.id)));setTimeout((()=>{z(!1),t&&!e.productVideo?Ce(t,H):t||D(!0)}),500)}),[H,B,ce]),je=r((o=>e(void 0,void 0,void 0,(function*(){const e=o||E;if(!e)return;const n=H.findIndex((t=>t.id===e.id));if(n>0){const e=H[n-1];if(M(e),!e.featureTag)return void console.warn("FeatureAnnouncements: Previous feature missing featureTag");const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:e}=yield import("./utils/elementHelpers.js");yield e(r,120)}catch(e){console.warn("Scroll to previous element failed:",e)}const i=n-1,a=H.length,s=[{target:o,content:t.jsx(f,{feature:e,currentIndex:i,totalFeatures:a,onSkip:()=>ke(e),onExplore:()=>ve(e),onPrevious:()=>je(e),onNext:()=>Fe(e),setIsClosing:ae}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];O(s)}}))),[E,H]),Fe=r((o=>e(void 0,void 0,void 0,(function*(){const e=o||E;if(!e)return;const n=H.findIndex((t=>t.id===e.id));if(n<H.length-1){const e=H[n+1];if(M(e),!e.featureTag)return void console.warn("FeatureAnnouncements: Next feature missing featureTag");const o=e.featureTag.startsWith("#")||e.featureTag.startsWith(".")||e.featureTag.startsWith("[")?e.featureTag:`#${e.featureTag}`,r=document.querySelector(o);if(r)try{const{scrollToElementSmooth:e}=yield import("./utils/elementHelpers.js");yield e(r,120)}catch(e){console.warn("Scroll to next element failed:",e)}const i=n+1,a=H.length,s=[{target:o,content:t.jsx(f,{feature:e,currentIndex:i,totalFeatures:a,onSkip:()=>ke(e),onExplore:()=>ve(e),onPrevious:()=>je(e),onNext:()=>Fe(e),setIsClosing:ae}),placement:"bottom",placementBeacon:"bottom-end",disableBeacon:!0,hideCloseButton:!0,hideSkipButton:!0,hideFooter:!0,offset:0,data:{feature:e,isMinor:!0},styles:{tooltip:{padding:0,backgroundColor:"transparent",borderRadius:"4px",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}}}];O(s)}else z(!0),D(!0),B(e.id),W(!1),M(null),O([]),setTimeout((()=>{z(!1)}),500)}))),[E,H,B]);return t.jsxs(d,Object.assign({fetchWhatsNewContent:h,markContentAsViewed:ge,module:w,legacyFeatures:fe},{children:[m,q.length>0&&t.jsx(a,{steps:q,run:U,continuous:!1,showProgress:!1,showSkipButton:!1,callback:we,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!0,spotlightClicks:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:ne?"transparent":"#212121"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",border:"none",boxShadow:"none"},tooltip:{borderRadius:"16px",fontSize:"14px",padding:0,backgroundColor:"transparent",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonClose:{display:"none"},buttonSkip:{display:"none"}},locale:{back:"Back",close:"Close",last:"Close",next:"Next",skip:"Skip"}},`major-joyride-${se}`),A.length>0&&t.jsx(a,{steps:A,run:P,continuous:!1,showProgress:!1,showSkipButton:!1,callback:Se,disableOverlayClose:!0,disableCloseOnEsc:!1,disableOverlay:!1,scrollToFirstStep:!0,scrollOffset:120,disableScrolling:!1,styles:{options:{primaryColor:"#007bff",zIndex:1e4,width:"auto",arrowColor:ie?"transparent":"#ffffff"},overlay:{backgroundColor:"transparent"},spotlight:{backgroundColor:"transparent",borderRadius:"8px",boxShadow:ie?"none":"0 0 0 9999px rgba(0, 0, 0, 0.4), 0 0 0 3px rgba(255, 255, 255, 0.8), 0 0 20px 8px rgba(255, 255, 255, 0.4)"},tooltip:{borderRadius:"4px",fontSize:"14px",padding:0,backgroundColor:"transparent",border:"none",filter:"none",boxShadow:"none"},tooltipContent:{padding:0},buttonNext:{display:"none"},buttonBack:{display:"none"},buttonSkip:{display:"none"},buttonClose:{display:"none"}},locale:{back:"Back",close:"Close",last:"Close",next:"Next",skip:"Skip"}},`minor-joyride-${de}`),t.jsx(l,{isOpen:K,videoUrl:Y,onClose:()=>{X(!1),ee(""),oe(!1);const e=H.find((e=>!ce.has(e.id)));e?setTimeout((()=>{Ce(e,H)}),300):D(!0)}})]}))};export{g as default};
|
|
@@ -6,6 +6,7 @@ export declare const useFeatureAnnouncements: ({ fetchVisibleFeatures, getStoreF
|
|
|
6
6
|
features: FeatureAnnouncement[];
|
|
7
7
|
majorUpdateFeatures: FeatureAnnouncement[];
|
|
8
8
|
minorUpdateFeatures: FeatureAnnouncement[];
|
|
9
|
+
legacyFeatures: FeatureAnnouncement[];
|
|
9
10
|
isLoading: boolean;
|
|
10
11
|
error: string | null;
|
|
11
12
|
markFeatureAsViewed: (featureId: string) => Promise<void>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__awaiter as e}from"../../../_virtual/_tslib.js";import{useState as t,useCallback as r,useEffect as o}from"react";import{ANIMATION_TIMING as
|
|
1
|
+
import{__awaiter as e}from"../../../_virtual/_tslib.js";import{useState as t,useCallback as r,useEffect as o}from"react";import{ANIMATION_TIMING as n}from"../constants/animations.js";import{QUERY_PARAMS as a,LOCAL_STORAGE_KEYS as i}from"../constants/localStorageKeys.js";const l=l=>{let{fetchVisibleFeatures:s,getStoreFeatureProgress:u,fetchFeatureById:d,markFeatureAsViewedForStore:c,isFeatureApplicableToCurrentPage:f,module:p,router:g}=l;var m;const v=(()=>{const[e,r]=t(null);return o((()=>{if("undefined"!=typeof window){let e=null;try{if(e=localStorage.getItem(i.STORE_ID)||localStorage.getItem(i.BIK_STORE_ID)||localStorage.getItem(i.CURRENT_STORE)||localStorage.getItem(i.STORE),!e){const t=localStorage.getItem(i.CURRENT_USER);t&&(e=JSON.parse(t).storeId)}e||(e=new URLSearchParams(window.location.search).get(i.QUERY_PARAM))}catch(e){console.error("FeatureAnnouncements: Failed to get store ID",e)}r(e)}}),[]),e})(),[y,F]=t([]),[h,w]=t([]),[D,A]=t([]),[U,I]=t([]),[R,S]=t(!1),[x,T]=t(null),E=r((()=>e(void 0,void 0,void 0,(function*(){if(v){S(!0),T(null);try{const[e,t]=yield s(p);if(e||!t)return console.error("FeatureAnnouncements: Failed to fetch features",e),void T("Failed to fetch features");const[r,o]=yield u(v);r&&console.warn("FeatureAnnouncements: Progress fetch failed, treating all features as new",r);const a=new Date,i="undefined"!=typeof window?window.location.pathname:"",l=e=>{if(!e.expirationDate)return!0;let t;return"object"==typeof e.expirationDate&&null!==e.expirationDate&&("seconds"in e.expirationDate||"nanoseconds"in e.expirationDate)?t=new Date(1e3*e.expirationDate.seconds):"string"==typeof e.expirationDate?t=new Date(e.expirationDate):e.expirationDate instanceof Date&&(t=e.expirationDate),!(!t||isNaN(t.getTime()))&&a<t},d=e=>{if("Major"===e.featureUpdateType){let t=[];return Array.isArray(e.pageUrls)?t=e.pageUrls:"object"==typeof e.pageUrls&&null!==e.pageUrls&&"length"in e.pageUrls&&(t=Array.from(e.pageUrls)),t.includes(i)}return!0},c=t.filter((e=>{var t;return!((null===(t=null==o?void 0:o.viewedFeatures)||void 0===t?void 0:t[e.id])||!1)&&f(e)&&l(e)&&d(e)})),g=c.filter((e=>!e.updates)),m=c.filter((e=>e.updates)),y=m.filter((e=>"Major"===e.updates)),h=m.filter((e=>"Minor"===e.updates)),D=h.filter((e=>!e.featureTag));D.length>0&&console.warn("FeatureAnnouncements: Found Minor features without featureTag:",D.map((e=>e.id))),console.info("FeatureAnnouncements: Categorized features:",{legacy:g.length,major:y.length,minor:h.length}),F(m),I(g),w(y),setTimeout((()=>{A(h)}),n.MINOR_POPUP_DELAY)}catch(e){console.error("FeatureAnnouncements: Unexpected error in fetchFeatures",e),T("An unexpected error occurred")}finally{S(!1)}}}))),[v,s,u,f,p]),_=r((t=>e(void 0,void 0,void 0,(function*(){S(!0),T(null);try{const[e,r]=yield d(t);if(e||!r)return void T("Failed to fetch feature by ID");r.updates?"Major"===r.updates?(w([r]),F([r])):"Minor"===r.updates&&(A([r]),F([r])):I([r])}catch(e){T("An unexpected error occurred while fetching by ID")}finally{S(!1)}}))),[d]),j=r((t=>e(void 0,void 0,void 0,(function*(){if(!v)return;const[e]=yield c(v,t);e?(console.warn("FeatureAnnouncements: Failed to mark feature as viewed, removing from local state anyway",e),F((e=>e.filter((e=>e.id!==t)))),w((e=>e.filter((e=>e.id!==t)))),A((e=>e.filter((e=>e.id!==t))))):(F((e=>e.filter((e=>e.id!==t)))),w((e=>e.filter((e=>e.id!==t)))),A((e=>e.filter((e=>e.id!==t)))))}))),[v,c]);return o((()=>{var e;const t=null===(e=null==g?void 0:g.query)||void 0===e?void 0:e[a.FEATURE_ID];t&&g?_(t):E()}),[null==g?void 0:g.pathname,null===(m=null==g?void 0:g.query)||void 0===m?void 0:m[a.FEATURE_ID],v,E,_,g]),{features:y,majorUpdateFeatures:h,minorUpdateFeatures:D,legacyFeatures:U,isLoading:R,error:x,markFeatureAsViewed:j,refetch:E}};export{l as useFeatureAnnouncements};
|
|
@@ -7,6 +7,16 @@ export interface FirestoreTimestamp {
|
|
|
7
7
|
}
|
|
8
8
|
/**
|
|
9
9
|
* Feature announcement data model
|
|
10
|
+
*
|
|
11
|
+
* LEGACY FEATURES (BIK only):
|
|
12
|
+
* - No `updates` field
|
|
13
|
+
* - Displayed in WhatsNew panel with HTML rendering
|
|
14
|
+
* - No popups
|
|
15
|
+
*
|
|
16
|
+
* POPUP FEATURES:
|
|
17
|
+
* - Have `updates: 'Major' | 'Minor'`
|
|
18
|
+
* - Major: No featureTag, anchored to WhatsNew button, requires pageUrls
|
|
19
|
+
* - Minor: Requires featureTag, anchored to UI elements
|
|
10
20
|
*/
|
|
11
21
|
export interface FeatureAnnouncement {
|
|
12
22
|
id: string;
|
|
@@ -15,14 +25,16 @@ export interface FeatureAnnouncement {
|
|
|
15
25
|
content: string;
|
|
16
26
|
buttonText: string;
|
|
17
27
|
displayImage: string;
|
|
18
|
-
|
|
19
|
-
|
|
28
|
+
/** Element selector - required for Minor popups, not used for Major */
|
|
29
|
+
featureTag?: string;
|
|
30
|
+
featureUpdateType?: 'Major' | 'Minor';
|
|
20
31
|
image: string;
|
|
21
32
|
module: string[];
|
|
22
33
|
pageUrls: string[];
|
|
23
34
|
productVideo: string;
|
|
24
35
|
redirectUrl: string;
|
|
25
|
-
|
|
36
|
+
/** Distinguishes popup features ('Major'/'Minor') from legacy features (undefined/empty) */
|
|
37
|
+
updates?: 'Major' | 'Minor';
|
|
26
38
|
visibility: boolean;
|
|
27
39
|
createdAt: FirestoreTimestamp;
|
|
28
40
|
expirationDate?: FirestoreTimestamp | string | Date;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{j as e}from"../../node_modules/react/jsx-runtime.js";import{useContext as t,createContext as r}from"react";import{useWhatsNew as
|
|
1
|
+
import{j as e}from"../../node_modules/react/jsx-runtime.js";import{useContext as t,createContext as r}from"react";import{useWhatsNew as s}from"./useWhatsNew.js";const o=r(null),n=t=>{let{children:r,fetchWhatsNewContent:n,markContentAsViewed:a,module:i,legacyFeatures:u=[]}=t;const m=s({fetchWhatsNewContent:n,markContentAsViewed:a,module:i,legacyFeatures:u});return e.jsx(o.Provider,Object.assign({value:m},{children:r}))},a=()=>{const e=t(o);if(!e)throw new Error("useWhatsNewContext must be used within a WhatsNewProvider");return e};export{n as WhatsNewProvider,a as useWhatsNewContext};
|
|
@@ -4,6 +4,7 @@ interface UseWhatsNewProps {
|
|
|
4
4
|
markContentAsViewed?: (contentId: string) => Promise<void>;
|
|
5
5
|
module?: string;
|
|
6
6
|
newContentThresholdDays?: number;
|
|
7
|
+
legacyFeatures?: WhatsNewContent[];
|
|
7
8
|
}
|
|
8
|
-
export declare const useWhatsNew: ({ fetchWhatsNewContent, markContentAsViewed, module, newContentThresholdDays, }: UseWhatsNewProps) => WhatsNewHookReturn;
|
|
9
|
+
export declare const useWhatsNew: ({ fetchWhatsNewContent, markContentAsViewed, module, newContentThresholdDays, legacyFeatures, }: UseWhatsNewProps) => WhatsNewHookReturn;
|
|
9
10
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{__awaiter as
|
|
1
|
+
import{__awaiter as t}from"../../_virtual/_tslib.js";import{differenceInBusinessDays as e}from"date-fns";import{useState as o,useRef as r,useEffect as n,useCallback as a}from"react";const d=d=>{let{fetchWhatsNewContent:c,markContentAsViewed:i,module:l,newContentThresholdDays:s=7,legacyFeatures:u=[]}=d;const[v,A]=o([]),[w,f]=o(!0),m=r(c),D=r(i);n((()=>{m.current=c}),[c]),n((()=>{D.current=i}),[i]);const h=a((()=>t(void 0,void 0,void 0,(function*(){f(!0);try{const[t,e]=yield m.current();if(t)console.error("Failed to fetch what's new content:",t),A([]);else if(e){let t=e;l&&(t=e.filter((t=>Array.isArray(t.module)?t.module.includes(l):t.module===l))),t.sort(((t,e)=>{var o,r;const n=(null===(o=t.createdAt)||void 0===o?void 0:o.toDate)?t.createdAt.toDate():new Date(t.createdAt);return((null===(r=e.createdAt)||void 0===r?void 0:r.toDate)?e.createdAt.toDate():new Date(e.createdAt)).getTime()-n.getTime()}));const o=[...t,...u];o.sort(((t,e)=>{var o,r;const n=(null===(o=t.createdAt)||void 0===o?void 0:o.toDate)?t.createdAt.toDate():new Date(t.createdAt);return((null===(r=e.createdAt)||void 0===r?void 0:r.toDate)?e.createdAt.toDate():new Date(e.createdAt)).getTime()-n.getTime()})),A(o)}else A([...u])}catch(t){console.error("Failed to fetch what's new content:",t),A([...u])}finally{f(!1)}}))),[l,u]);n((()=>{h()}),[h]);const y=a((t=>{if(!t.createdAt)return!1;const o=t.createdAt.toDate?t.createdAt.toDate():new Date(t.createdAt);return e(new Date,o)<s}),[s]),C=v.reduce(((t,e)=>y(e)?t+1:t),0);return{whatsNewContent:v,isLoading:w,newContentCount:C,markAsViewed:a((e=>t(void 0,void 0,void 0,(function*(){if(D.current)try{yield D.current(e)}catch(t){console.warn("Failed to mark content as viewed:",t)}}))),[]),refreshContent:a((()=>t(void 0,void 0,void 0,(function*(){yield h()}))),[h])}};export{d as useWhatsNew};
|