https://assets.allocine.fr/js/website/edit-profile-card-picker-modal.d2ba216b5ecdc7f470a6.js

1"use strict";(self.webpackChunkallocine_js=self.webpackChunkallocine_js||[]).push([[341],{27752:function(e,t,a){a.r(t),a.d(t,{default:function(){return V}});var r=a(46942),n=a.n(r),i=a(96540),l=a(2512),o=a(46652);const d=l.Ay`
2  query GetSocialMediaCategoriesWithImages(
3    $type: SocialMedia!
4    $imagesFirst: Int!
5  ) {
6    socialMediaCategoryList(type: $type) {
7      totalCount
8      edges {
9        cursor
10        node {
11          id
12          internalId
13          name
14          tag
15          sponsored
16          rank
17          images(first: $imagesFirst) {
18            totalCount
19            edges {
20              node {
21                id
22                internalId
23                path
24                endDate
25              }
26            }
27          }
28        }
29      }
30    }
31  }
32`,s=l.Ay`
33  mutation SetUserSocialCustomization($input: UserSocialMediaInput!) {
34    setUserSocialCustomization(input: $input) {
35      id
36      customization {
37        mainAvatar {
38          internalId
39          categoryId
40          path
41        }
42        mainBanner {
43          internalId
44          categoryId
45          path
46        }
47      }
48    }
49  }
50`,c=l.Ay`
51  query GetMeCustomization {
52    me {
53      user {
54        customization {
55          mainAvatar {
56            internalId
57            categoryId
58            path
59          }
60          mainBanner {
61            path
62            internalId
63            categoryId
64          }
65        }
66      }
67    }
68  }
69`;async function m(e,t=100){return(0,o.A)({query:d,variables:{type:e,imagesFirst:t}})}async function u(){return(0,o.A)({query:c})}var g=a(30507),p=a(77992),f=a(25665),h=a(40183),y=a(87261),v=a(71205),b=a(21981),k=a(46971),E=a(92022),N=a(89955),A=a(48192);function I(e,t){const a="avatar"===e?t?.mainAvatar:t?.mainBanner;return Boolean(null!=a&&(null!=a.path||null!=a.internalId))}var D=a(85072),w=a.n(D),M=a(97825),S=a.n(M),_=a(77659),x=a.n(_),j=a(55056),C=a.n(j),T=a(10540),z=a.n(T),R=a(41113),U=a.n(R),B=a(44451),W={};W.styleTagTransform=U(),W.setAttributes=C(),W.insert=x().bind(null,"head"),W.domAPI=S(),W.insertStyleElement=z(),w()(B.A,W);var X=B.A&&B.A.locals?B.A.locals:void 0,F=a(2472),K=({className:e="",offset:t=20,id:a,revalidateKey:r,children:l})=>{(0,i.useEffect)((()=>{F.A.emit(F.$.ROLLER_REVALIDATE)}),[r]);const o=n()("roller-holder js-roller",e);return i.createElement("div",{id:a,className:o,"data-offset":t||20},i.createElement("div",{className:"roller-overflow"},i.createElement("div",{className:"roller-slider"},l)),i.createElement("div",{className:"roller-btn-holder"},i.createElement("button",{type:"button",className:"roller-btn btn-left icon icon-arrow-left disabled"}),i.createElement("button",{type:"button",className:"roller-btn btn-right icon icon-arrow-right"})))};const L=({closeModal:e,onCloseParams:t,params:a})=>{const{categories:r=[],items:l=[],selectedId:d}=a??{},c=a?.mode??"avatar",[p,f]=(0,i.useState)(r),[D,w]=(0,i.useState)(l),[M,S]=(0,i.useState)((()=>0===r.length&&0===l.length)),[_,x]=(0,i.useState)(null),[j,C]=(0,i.useState)(!1),[T,z]=(0,i.useState)(d),[R,U]=(0,i.useState)(r[0]?.id??p[0]?.id),[B,W]=(0,i.useState)(d),[F,L]=(0,i.useState)(!1),V=d??B;(0,i.useEffect)((()=>{if(r.length>0||l.length>0){let e=!1;return u().then((t=>{e||L(I(c,t?.data?.me?.user?.customization))})).catch((()=>{})),()=>{e=!0}}let e=!1;S(!0),x(null);const t="avatar"===c?"AVATAR":"BANNER";return Promise.all([m(t),u()]).then((([t,a])=>{if(e)return;const{categories:r,items:n}=function(e,t){const a=[],r=[],n=t?.data?.socialMediaCategoryList?.edges??[];for(const e of n){const t=e?.node;if(!t?.id)continue;const n=t.id,i=null!=t.internalId?Number(t.internalId):void 0;a.push({id:n,label:t.name??n,internalId:i,sponsored:!0===t.sponsored,rank:t.rank??null});const l=t.images?.edges??[];for(const e of l){const t=e?.node;if(!t?.id)continue;const a=Number(t.internalId??0);if(!a)continue;const i=t.path?(0,k.dN)(t.path):"";r.push({id:t.id,internalId:a,imageUrl:i,categoryId:n,endDate:t.endD

69ate??null})}}return a.sort(((e,t)=>{const a=(t.sponsored?1:0)-(e.sponsored?1:0);return 0!==a?a:(e.rank??Number.MAX_SAFE_INTEGER)-(t.rank??Number.MAX_SAFE_INTEGER)})),{categories:a,items:r}}(0,t);f(r),w(n);const i=a?.data?.me?.user?.customization;L(I(c,i));const l="avatar"===c?i?.mainAvatar:i?.mainBanner,o=null!=l?.categoryId?Number(l.categoryId):void 0,d=null!=l?.internalId?Number(l.internalId):void 0;let s=!1;if(null!=o&&null!=d&&r.length>0&&n.length>0){const e=r.find((e=>null!=e.internalId&&Number(e.internalId)===o)),t=n.find((e=>e.internalId===d));e?.id&&(U(e.id),s=!0),t?.id&&(z(t.id),W(t.id))}!s&&r[0]?.id&&U(r[0].id)})).catch((t=>{e||x(t instanceof Error?t.message:String(t))})).finally((()=>{e||S(!1)})),()=>{e=!0}}),[c,r.length,l.length]);const Y=(0,i.useMemo)((()=>R?D.filter((e=>e.categoryId===R)):D),[D,R]),q=(0,i.useMemo)((()=>D.find((e=>e.id===T))),[D,T]),$=(0,i.useMemo)((()=>p.find((e=>e.id===R))),[p,R]),G=(0,i.useMemo)((()=>p.map((e=>e.id)).join("|")),[p]),H=!0===$?.sponsored&&!M&&!_&&Y.length>0,Q="avatar"===c?(0,E.default)("userprofile.edit-card.picker.title.avatar"):(0,E.default)("userprofile.edit-card.picker.title.background"),O=(0,i.useCallback)((()=>{q&&(C(!0),async function(e){return(0,o.A)({query:s,variables:{input:e}})}("avatar"===c?{id_avatar:q.internalId}:{id_banner:q.internalId}).then((a=>{const r=a?.data?.setUserSocialCustomization?.customization,n="avatar"===c?r?.mainAvatar?.path:r?.mainBanner?.path,i=n&&(0,k.dN)(n)||q.imageUrl;!function(e,t){const a={social_action_type:e,social_action_update_type:t?"edit":"add",site_route:null!=N.a$?String(N.a$):""};(0,A.av)("social_action_click",a)}("avatar"===c?"avatar":"background",F);const l={mode:c,selectedId:q.id,imageUrl:i};t?.(l),e()})).catch((e=>{x(e instanceof Error?e.message:String(e))})).finally((()=>{C(!1)})))}),[c,q,t,e,F]),P="avatar"===c;return i.createElement(h.A,{size:"medium",title:Q,className:P?X.pickerModal:`${X.pickerModal} ${X.pickerModalBackground}`},p.length>0&&i.createElement("nav",{className:X.rollerNav,role:"navigation","aria-label":(0,E.default)("userprofile.edit-card.picker.categories.aria")},i.createElement(K,{className:"roller-arrow-title roller-entity-page-menu",offset:20,revalidateKey:G},p.map((e=>i.createElement("button",{key:e.id,type:"button",className:n()("roller-item",{current:R===e.id}),onClick:()=>U(e.id)},e.label))))),i.createElement("div",{className:n()("gd gd-gap-15",M||_||0===Y.length?"gd-xs-1":P?"gd-xs-3 gd-s-4":"gd-xs-1 gd-s-2",P?X.pickerItems:[X.pickerItems,X.pickerItemsBackground])},M?i.createElement("div",{className:X.empty},(0,E.default)("userspace.edit-card.picker.loading")):_?i.createElement("div",{className:X.empty},_):0===Y.length?i.createElement("div",{className:X.empty},(0,E.default)("userprofile.edit-card.picker.empty")):Y.map((e=>{const t=e.id===V,a=T===e.id,r=function(e){if(!e)return null;const t=e.trim();if(!t)return null;const a=new y.W(t,v.I.DAY);if(Number.isNaN(a.date.getTime()))return null;const r=a.date,n=new Date;return r.getFullYear()===n.getFullYear()&&r.getMonth()===n.getMonth()?(0,b.Ay)(r,{day:"2-digit",month:"2-digit"}):(0,b.Ay)(r,{day:"2-digit",month:"2-digit",year:"2-digit"})}(e.endDate);return i.createElement("button",{key:e.id,type:"button",className:X.itemOuter,onClick:()=>z(e.id)},i.createElement("span",{className:P?`${X.item} ${a?X.selected:""} ${t?X.itemAlreadyChosen:""}`:`${X.item} ${X.itemRectangle} ${a?X.selected:""} ${t?X.itemAlreadyChosen:""}`},i.createElement("img",{src:e.imageUrl,alt:"",className:X.itemImage}

69)),r?i.createElement("span",{className:n()(X.itemEndDate,P?X.itemEndDateAvatar:X.itemEndDateBackground)},(0,E.default)("userspace.edit-card.picker.end-date",{date:r})):null)}))),H?i.createElement("p",{className:X.sponsoredDisclaimer,role:"note"},(0,E.default)("userspace.edit-card.picker.sponsored.disclaimer")):null,i.createElement("div",{className:X.footer},i.createElement(g.Ay,{theme:"default",type:"full",size:"sm",onClick:()=>{e()}},(0,E.default)("generic.cancel")),i.createElement(g.Ay,{theme:"inverse",type:"full",size:"sm",onClick:O,disabled:!q||j},j?(0,E.default)("userprofile.edit-card.picker.saving"):(0,E.default)("userspace.validate"))))};var V=(0,f.A)(p.bq,((e,t,a,r)=>i.createElement(L,{closeModal:t,onCloseParams:r,params:e})))},25665:function(e,t,a){var r=a(5338),n=a(25948);const i=new WeakMap,l=e=>(i.has(e)||i.set(e,(0,r.H)(e)),i.get(e));t.A=(e,t,a=n.A,r=n.A)=>({name:e,render:(e,a,r,n,i)=>{if(e){const o=l(e),d=t(a,r,n,i);o?.render(d)}},remove:e=>{const t=l(e);t?.unmount(),i.delete(e)},onClose:a,onOpen:r})},40183:function(e,t,a){a.d(t,{A:function(){return A}});var r=a(58168),n=a(46942),i=a.n(n),l=a(96540),o=a(62134),d=a(85072),s=a.n(d),c=a(97825),m=a.n(c),u=a(77659),g=a.n(u),p=a(55056),f=a.n(p),h=a(10540),y=a.n(h),v=a(41113),b=a.n(v),k=a(98020),E={};E.styleTagTransform=b(),E.setAttributes=f(),E.insert=g().bind(null,"head"),E.domAPI=m(),E.insertStyleElement=y(),s()(k.A,E);var N=k.A&&k.A.locals?k.A.locals:void 0,A=({className:e,image:t,imageWidth:a,imageHeight:n,title:d,children:s,size:c,preventClose:m,backgroundImage:u,fallback:g,pagination:p,...f})=>{const h=(0,l.createRef)();(0,l.useEffect)((()=>{g&&h.current&&(0,o.A)(h.current).then((e=>{e||g()}))}),[g,h]);const y=i()("modal",{[`modal-${c}`]:!!c,[N.modalWithBackground]:!!u},e),v=l.createElement(l.Fragment,null,l.createElement("header",{className:"modal-header",id:"modal-header"},p,(t||d)&&l.createElement("div",{className:"modal-header-content"},t?l.createElement("img",{src:t,width:a,height:n,className:"modal-header-image"}):null,d?l.createElement("h2",{className:"titlebar-title titlebar-title-sm",dangerouslySetInnerHTML:{__html:d}}):null),!m&&l.createElement("button",{type:"button",className:"modal-close icon icon-cross light js-trigger-overlay-close"},l.createElement("span",{className:"no-icon"},"X"))),l.createElement("div",{className:"modal-content"},s));return l.createElement(l.Fragment,null,l.createElement("div",{className:i()("modal-layer",{"js-trigger-overlay-close":!m})}),l.createElement("div",(0,r.A)({className:y,ref:h},f),u?l.createElement(l.Fragment,null,l.createElement("img",{className:N.modalLeft,src:u}),l.createElement("div",{className:N.modalRight},v)):v))}},44451:function(e,t,a){var r=a(31601),n=a.n(r),i=a(76314),l=a.n(i)()(n());l.push([e.id,".NPv0g1VMaacbPpzybEQR .modal-content{display:flex;flex-direction:column;gap:1.5rem;max-width:100%;margin:0 auto;padding:2.188rem 1.5rem 1.5rem}.ZMUp9p53ir09odH79oUT{margin-bottom:.25rem}.a3RNkiIUb_vY8fN8ikzB{font-size:.6875rem;line-height:1.4;color:var(--color-grey-3, #666);margin:-0.5rem 0 0;padding:0 .5rem;text-align:center}.cPoXd4Ny0os6RCcUb9DL{max-height:18rem;overflow-y:auto;padding-right:.25rem}.wu3z3WBTz3GBdfiDyuSw{justify-items:center}@media(max-width: 31.25rem){.wu3z3WBTz3GBdfiDyuSw{justify-items:stretch}}.F_KNtavZVpmZLtR9jNc0{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:0;margin:0;border:none;background:rgba(0,0,0,0);cursor:pointer;border-radius:0;overflow:visible;height:auto}.e0DSQjrWfKjrt3T_gHO9{position:relative;width:80px;height:80px;border-radius:50%;overflow:hidden;background-color:var(--color-grey-5, #f0f0f0);border:3px solid rgba(0,0,0,0);transition:border-color .15s ease,border-width .15s ease;padding:0;flex-shrink:0}.e0DSQjrWfKjrt3T_gHO9:hover{border-color:var(--color-grey-6, #e5e5e5)}.e0DSQjrWfKjrt3T_gHO9.C0Ef_mCcufxUm5Hwc5VA{border-width:5px;border-color:var(--color-grey-4, #ccc)}.e0DSQjrWfKjrt3T_gHO9.CUKkkRbYMRVQDRB5ldI1{border-width:5px;border-color:var(--color-yellow, #ffc107)}.wu3z3WBTz3GBdfiDyuSw .e0DSQjrWfKjrt3T_gHO9{width:230px;height:88px}.pVUiMlnygMoOV4TjaLi3{font-size:.625rem;line-height:1.2;text-align:center;max-width:5rem;word-break:break-word;border:1px solid;border-radius:20px;background:#b90fad;color:#fff;z-index:1;padding:.125rem .625rem}.HMxKzWx8cUA3XTvoSEUo{margin-top:-1.2rem}.kKrdfaXO05jqpjkrqpMw{margin-top:-0.7rem}.wu3z3WBTz3GBdfiDyuSw .pVUiMlnygMoOV4TjaLi3{max-width:14.375rem}.kS_ZGd2U9vzXS8KR1JTF{border-radius:.5rem}.dLsAcLnq0G4AQWvXJbfJ{width:100%;height:100%;object-fit:cover;display:block;vertical-align:top}.qfoD9cdYW4PI_y8FYN_e{display:flex;justify-content:center;align-items:center;width:100%;gap:1.25rem;padding-top:1.5rem;border-top:1px solid var(--color-grey-6, #e5e5e5);margin-top:.25rem}.twDS3shbnlQ6qFcdsCGF{text-align:center;padding:2rem;color:var(--color-grey-3, #666);font-size:.875rem}@media all and (min-width: 37.625em){.jHb6jEos05KP5_4gCADM{width:35rem}}",""]),l.locals={pickerModal:"NPv0g1VMaacbPpzybEQR",rollerNav:"ZMUp9p53ir09odH79oUT",sponsoredDisclaimer:"a3RNkiIUb_vY8fN8ikzB",pickerItems:"cPoXd4Ny0os6RCcUb9DL",pickerItems

69Background:"wu3z3WBTz3GBdfiDyuSw",itemOuter:"F_KNtavZVpmZLtR9jNc0",item:"e0DSQjrWfKjrt3T_gHO9",itemAlreadyChosen:"C0Ef_mCcufxUm5Hwc5VA",selected:"CUKkkRbYMRVQDRB5ldI1",itemEndDate:"pVUiMlnygMoOV4TjaLi3",itemEndDateAvatar:"HMxKzWx8cUA3XTvoSEUo",itemEndDateBackground:"kKrdfaXO05jqpjkrqpMw",itemRectangle:"kS_ZGd2U9vzXS8KR1JTF",itemImage:"dLsAcLnq0G4AQWvXJbfJ",footer:"qfoD9cdYW4PI_y8FYN_e",empty:"twDS3shbnlQ6qFcdsCGF",pickerModalBackground:"jHb6jEos05KP5_4gCADM"},t.A=l},98020:function(e,t,a){var r=a(31601),n=a.n(r),i=a(76314),l=a.n(i)()(n());l.push([e.id,".xMFhR7TX8akeV_KDDfXk{position:relative;display:flex}.xMFhR7TX8akeV_KDDfXk .modal-header,.xMFhR7TX8akeV_KDDfXk .modal-content{padding-right:1.875rem;padding-left:1.875rem}.xMFhR7TX8akeV_KDDfXk .modal-header{position:relative}.oS36iX8mxDcLYGfk1nU7{display:none;width:auto;height:100%}.jLYdac7WhChWhq6Y49rQ{position:relative;background-color:#fff;width:100%}@media all and (min-width: 37.625em){.oS36iX8mxDcLYGfk1nU7{display:block}.xMFhR7TX8akeV_KDDfXk .modal-header{padding-top:5rem}.jLYdac7WhChWhq6Y49rQ{width:auto}}",""]),l.locals={modalWithBackground:"xMFhR7TX8akeV_KDDfXk",modalLeft:"oS36iX8mxDcLYGfk1nU7",modalRight:"jLYdac7WhChWhq6Y49rQ"},t.A=l}}]);
70//# sourceMappingURL=edit-profile-card-picker-modal.d2ba216b5ecdc7f470a6.js.map