/*! VERSION | 10.78.9 */"use strict";(self.__LOADABLE_LOADED_CHUNKS__=self.__LOADABLE_LOADED_CHUNKS__||[]).push([[2217],{67169:(e,t,i)=>{i.d(t,{Z:()=>l});var a=i(27378),n=i(78983);let s=e=>{let t=new Date;return(0,n.bq)(t,e,"day")?n.TIME_FORMATS.TIME:(0,n.bq)(t,e,"year")?n.TIME_FORMATS.DAY_AND_MONTH:n.TIME_FORMATS.DAY_MONTH_YEAR},l=({className:e="",dateTime:t=null})=>t?a.createElement("span",{className:e},(0,n.mr)(t,s(t))):null},97447:(e,t,i)=>{i.d(t,{ZP:()=>u});var a,n=i(18775),s=i(77397),l=i(37051),r=i(27378),o=i(99748),c=i(12710),d=i(62512);let h={LEFT:"left",RIGHT:"right"},p="transform .200s ease",m=(e=0)=>`translate3d(${e}px, 0, 0)`;class f extends(a=r.Component){componentDidMount(){let e=this.slidableRef.current;e&&((0,d.H0)(this,e,"touchstart",this.touchStartHandler),(0,d.H0)(this,e,"touchmove",this.touchMoveHandler),(0,d.H0)(this,e,"touchend",this.touchEndHandler))}componentWillUnmount(){(0,d.OM)(this)}moveSlider(e){this.slidableRef.current&&(this.slidableRef.current.style.transform=m(e))}moveAppearingContent(e){let t;let{appearingContentLeftWidth:i,appearingContentRightWidth:a}=this.props,n=0,s=0;e<0?n=e>-a?e:-a:s=e<i?e:i,this.leftAppearingRef.current&&((t=s-i)!==this.lastLeftAppearingTransformX&&(this.leftAppearingRef.current.style.transform=m(t)),this.lastLeftAppearingTransformX=t),this.rightAppearingRef.current&&((t=n+a)!==this.lastRightAppearingTransformX&&(this.rightAppearingRef.current.style.transform=m(t)),this.lastRightAppearingTransformX=t)}breakReactMemoization(e){this.lastShiftX=e,this.setState({expandedSide:"",collapsedSide:""})}getSlidableStatefulStyles(){let{appearingContentRightWidth:e,appearingContentLeftWidth:t}=this.props,{expandedSide:i,forceAnimation:a,collapsedSide:n}=this.state,s=null,l=m(this.lastShiftX);return n&&(s=p,l=m(0)),i&&(s=p,l=m(i===h.RIGHT?-e:t)),a&&(s=p),{transition:s,transform:l}}getAppearingStatefulStyles(e){let{appearingContentRightWidth:t,appearingContentLeftWidth:i}=this.props,{expandedSide:a,forceAnimation:n,collapsedSide:s}=this.state,l=e===h.RIGHT,r=l?t:-i,o=null,c=m(this.lastShiftX+r);return e===a&&(o=p,c=m(0)),e===s&&(o=p,c=m(l?t:-i)),n&&(o=p),{transition:o,transform:c}}render(){let{appearingContentLeft:e,appearingContentRight:t,children:i,className:a,onClick:n}=this.props;return r.createElement("div",{onClick:n,className:a},r.cloneElement(i,{className:(0,o.AK)(i.props.className,"slidable"),ref:this.slidableRef,style:this.getSlidableStatefulStyles()}),e&&r.createElement("div",{className:"slidable-appearing-container-left",ref:this.leftAppearingRef,style:this.getAppearingStatefulStyles(h.LEFT)},e),t&&r.createElement("div",{className:"slidable-appearing-container-right",ref:this.rightAppearingRef,style:this.getAppearingStatefulStyles(h.RIGHT)},t))}constructor(e){super(e),(0,n._)(this,"deltaX",0),(0,n._)(this,"deltaY",0),(0,n._)(this,"lastShiftX",0),(0,n._)(this,"leftAppearingRef",(0,r.createRef)()),(0,n._)(this,"rightAppearingRef",(0,r.createRef)()),(0,n._)(this,"shiftX",0),(0,n._)(this,"slidableRef",(0,r.createRef)()),(0,n._)(this,"touchMoveX",0),(0,n._)(this,"touchMoveY",0),(0,n._)(this,"touchStartTime",0),(0,n._)(this,"lastLeftAppearingTransformX",void 0),(0,n._)(this,"lastRightAppearingTransformX",void 0),(0,n._)(this,"velocity",0),(0,n._)(this,"expandedSide",""),(0,n._)(this,"isAppearingExpanded",!1),(0,n._)(this,"touchStartX",0),(0,n._)(this,"touchStartY",0),(0,n._)(this,"isLockedUntilNextSlide",!1),(0,n._)(this,"isSliding",!1),(0,n._)(this,"toggleAppearingContent",(0,s.Z)((e,t,i=!1)=>()=>{this.expandedSide=t?e:"",this.isAppearingExpanded=t,this.lastShiftX=0,t&&(this.lastShiftX=e===h.LEFT?this.props.appearingContentLeftWidth:-this.props.appearingContentRightWidth),this.setState({expandedSide:t?e:"",collapsedSide:t?"":e,forceAnimation:i},()=>{let e=t&&this.state.expandedSide&&!this.state.collapsedSide,i=!t&&!this.state.expandedSide&&this.state.collapsedSide;e&&this.props.onShifted(),i&&this.props.onHidden()}),setTimeout(()=>this.setState({expandedSide:"",collapsedSide:"",forceAnimation:!1}),200)},(...e)=>JSON.stringify(e))),(0,n._)(this,"touchStartHandler",e=>{let{pageX:t,pageY:i}=e.touches[0];this.isAppearingExpanded&&e.preventDefault(),this.touchStartTime=Date.now(),this.deltaX=0,this.deltaY=0,this.touchStartX=t,this.touchStartY=i,this.props.onTouchStart(this.toggleAppearingContent("",!1,!0))}),(0,n._)(this,"touchMoveHandler",e=>{if(this.isLockedUntilNextSlide)return;let{pageX:t,pageY:i}=e.touches[0],{appearingContentLeftWidth:a,appearingContentRightWidth:n}=this.props;this.touchMoveX=t,this.touchMoveY=i,this.deltaX=this.touchMoveX-this.touchStartX,this.shiftX=(0,c.$Y)(c.bN.X,this.deltaX+this.lastShiftX,n,a,1.5),this.deltaY=this.touchStartY-this.touchMoveY;let s=(0,c.q8)(c.bN.X,this.deltaX,this.deltaY,45);!this.isSliding&&s&&this.breakReactMemoization(this.shiftX),this.isSliding||s?(e.preventDefault(),this.velocity=(0,c.JJ)(this.deltaX,this.deltaY,Date.now()-this.touchStartTime),this.isSliding=!0,this.moveSlider(this.shiftX),this.moveAppearingContent(this.shiftX)):this.isLockedUntilNextSlide=!0}),(0,n._)(this,"touchEndHandler",()=>{let{appearingContentLeftWidth:e,appearingContentRightWidth:t,flickThreshold:i}=this.props,a=this.velocity>i,n=0===this.deltaX,s=this.shiftX<0;if(this.velocity=0,this.isLockedUntilNextSlide=!1,this.isSliding=!1,a){this.toggleAppearingContent(s?h.RIGHT:h.LEFT,s?!!t:!!e);return}if(n){this.isAppearingExpanded&&this.toggleAppearingContent(this.expandedSide===h.RIGHT?h.RIGHT:h.LEFT,!1);return}let l=!!(t&&this.shiftX<-t),r=!!(e&&this.shiftX>e);if(r||l){this.toggleAppearingContent(s?h.RIGHT:h.LEFT,s?l:r);return}let o=Math.abs(this.shiftX);(o<t||o<e)&&this.toggleAppearingContent(s?h.RIGHT:h.LEFT,!1)}),this.state={expandedSide:"",collapsedSide:"",forceAnimation:!1}}}(0,n._)(f,"defaultProps",{appearingContentLeft:null,appearingContentLeftWidth:0,appearingContentRight:null,appearingContentRightWidth:0,className:"",flickThreshold:.6,onClick:l.Z,onHidden:l.Z,onShifted:l.Z,onTouchStart:l.Z});let u=f},86206:(e,t,i)=>{i.d(t,{TM:()=>N,ZP:()=>T,kj:()=>E,zx:()=>S});var a=i(64553),n=i(27378),s=i(4289),l=i(67169),r=i(29413),o=i(7288),c=i(97447),d=i(59593),h=i(99748),p=i(94380),m=i(31843),f=i(88051);let{touch:u}=d.BROWSER_CAPABILITIES,g="personal-notification-image",S=72,E=.6*S,A=e=>n.createElement("div",{className:"personal-notification-appearing-trash",onClick:e},n.createElement(r.Z,{img:"trash"})),v=({sender:e,hideDropdown:t,modelData:i})=>e?n.createElement(o.Z,{className:"personal-notification-profile-link",user:e,onClick:t},n.createElement(f.Z,{isFavoriteBadgeVisible:!0,className:g,user:e,isBorderAvatar:!1,modelData:i,showLiveBadge:!0})):null,N=({additionalComment:e=null,additionalCommentLink:t="",image:i=null,body:o=null,className:d="",controls:f=null,hideDropdown:N,isClosable:T=!0,linkTo:b="",onCloseIconClick:_,onNotificationClick:R,sender:C,shouldEllipsisBody:X=!1,createdAt:y})=>{let L=(0,p.T)(),k=u&&T?c.ZP:"div",H=u&&T?{threshold:E,appearingContentRight:A(_),appearingContentRightWidth:S}:{};return n.createElement(k,{...H,onClick:R},n.createElement("div",{className:(0,h.AK)("personal-notification new-notifications-style",d)},n.createElement("div",{className:"personal-notification-body"},n.createElement("div",{className:"personal-notification-body-left"},i?n.cloneElement(i,{className:(0,h.AK)(i.props.className,g)}):n.createElement(v,{sender:C,hideDropdown:N})),n.createElement("div",{className:"personal-notification-body-middle"},n.createElement("div",{className:"personal-notification-body-middle__container"},n.createElement("div",{className:(0,h.AK)("personal-notification-body-middle-body",{ellipsis:X})},n.createElement("span",{className:"personal-notification-body-text pale-text"},o)),e&&n.createElement("div",{className:(0,h.AK)("personal-notification-additional-comment","personal-notification-additional-comment-new-messenger",{"personal-notification-additional-comment-navigable":!!t})},n.createElement("div",{className:"personal-notification-additional-comment-inners"},'"',e,t&&n.createElement(a.Z,{className:"personal-notification-additional-comment-link",onClick:e=>{e.preventDefault(),null==N||N(),C&&L((0,m.WB)(C.username))}}),'"')),y&&n.createElement("div",{className:"personal-notification-body-middle-footer"},n.createElement("span",{className:"personal-notification-description-text"},n.createElement(l.Z,{dateTime:y}))),b&&n.createElement(s.rU,{className:"personal-notification-background-link",to:b})),f&&n.createElement("div",{className:"personal-notification-footer"},f))),T&&!u&&n.createElement("div",{className:"personal-notification-closer",onClick:_,"data-testid":"notification-close-button"},n.createElement(r.Z,{className:"personal-notification-closer-icon",img:"close-5"}))))},T=N},55859:(e,t,i)=>{i.d(t,{F:()=>o});var a=i(27378),n=i(57174),s=i(56509),l=i(94380),r=i(31843);let o=({username:e,onBeforeOpenChat:t})=>{let i=(0,l.T)();return a.createElement(n.ZP,{style:"default-filled",onClick:()=>{null==t||t(),i((0,r.WB)(e))}},(0,s.dW)("fanClub.sayThanks"))}},12217:(e,t,i)=>{i.d(t,{Z:()=>T,e:()=>N});var a=i(27378),n=i(48204),s=i(95366),l=i(68798),r=i(83550),o=i(30486),c=i(99748),d=i(56509),h=i(95654),p=i(63256),m=i(16289),f=i(86206),u=i(87489),g=i(7474),S=i(66483),E=i(32284),A=i(55859);let v={emitButtonEvent:r.d2,deleteNotifications:m.Qi},N=({subscription:e,sender:t,customUsername:i})=>{let n=(0,h.C)(p.KEK);if(!n)return null;let{tier:r,isRecurrent:m,periodMonths:f}=e,u=(0,d.dW)(s.HN4[r]),S=a.createElement(o.Z,{messageId:"fanClub.userJoinedSubscribedNotification.before",parameters:{tier:u},elements:{tier:a.createElement("span",{className:`tier-name ${r}`}),accent:i||a.createElement(g.Z,{hideIcons:!0,user:t,isGenderIconHidden:!0,isLevelLeagueStatusVisible:!1,isUltimateIconVisible:!1,fanClubTier:r})}}),E=a.createElement(o.Z,{messageId:`fanClub.userJoinedSubscribedNotification.${m?"recurring":"oneTime"}`,choiceParameter:"months",className:"accent",parameters:{tokenAmount:(0,l.F1)(n,r,m,f),months:f},elements:{price:a.createElement("strong",null),months:a.createElement("span",{className:(0,c.AK)(1===f&&"hidden")})}});return a.createElement(a.Fragment,null,S," ",E)},T=(0,n.$j)((e,t)=>{var i;let a=null===(i=t.notification.payload)||void 0===i?void 0:i.fanClubSubscription,n=(null==a?void 0:a.userId)?(0,S.GA)(e,null==a?void 0:a.userId):null;return{sender:n,subscription:a}},v)(({subscription:e,notification:t,deleteNotifications:i,keepDropdownOpen:n,sender:s,...l})=>{let r=(0,a.useCallback)(()=>i([t.id]),[i,t]);if(!e||!s)return null;let o=!e.isRecurrent&&a.createElement(A.F,{username:s.username});return a.createElement(f.ZP,{...l,className:"fan-club-user-joined-personal-notification",onNotificationClick:n,onCloseIconClick:r,createdAt:t.createdAt,body:a.createElement(N,{subscription:e,sender:(0,E.T$)(s)}),linkTo:"/model/fan-club",controls:o,sender:(0,E.T$)(s),modelData:(0,u.tA)(s)})})}}]);