https://www.straitstimes.com/assets/NewsletterSignupPage-Cm6LHr2a.js

1import{A as e,E as t,I as n,T as r,j as i}from"./chunk-KS7C4IRE-DIkipulk.js";import{t as a}from"./jsx-runtime-CsaOnxTR.js";import{l as o}from"./components-JSzoenoU.js";import{$i as s,$r as c,A as l,Aa as u,Ba as d,Bi as f,Bn as p,C as m,D as h,E as g,Fi as _,Gi as v,Ji as y,La as b,M as x,Na as S,Pa as C,Pr as w,Qr as T,Sn as E,T as D,Va as O,Vi as k,Vn as A,Zi as j,aa as M,an as N,ba as P,ci as F,d as ee,da as I,ea as L,ei as R,f as te,gr as z,h as B,ha as V,hr as H,ia as U,j as W,mr as G,p as K,pa as ne,ra as re,ta as q,v as J,w as ie,x as ae,y as oe,zi as Y,zn as X}from"./Elements-BJgAzht_.js";import{n as se,t as Z}from"./ssr-CJ2n4bG3.js";import{t as ce}from"./PageLayout-VSFjvclv.js";import{n as le}from"./MetaTags-DxD1Vn5J.js";import{t as ue}from"./StatusHandler-BAQGTOm7.js";import{r as de,t as fe}from"./adsHelper-D-PUDSBN.js";var Q=n(i(),1);function pe(){let[e,t]=(0,Q.useState)(navigator.onLine);return(0,Q.useEffect)(()=>{if(!o){t(!0);return}let e=()=>{t(!0)},n=()=>{t(!1)};return window.addEventListener(`online`,e),window.addEventListener(`offline`,n),()=>{window.removeEventListener(`online`,e),window.removeEventListener(`offline`,n)}},[]),e}var $=a();function me({selectedNewsletterIDs:e,formAction:t,className:n,isLoading:r,testId:i=`newsletter-signup-form-test-id`}){let a=pe(),[o,s]=(0,Q.useState)(),c=e=>{if(!a){t({email:``,responseType:`NO_INTERNET`});return}if(F(e)){t({email:e,engagements:o,responseType:`VALID`});return}else{t({email:``,responseType:`ERROR`});return}},{userInfo:l}=u(e=>e),f=l?.display_name,p=l?.email_id,{lightbox:h}=A();return(0,Q.useEffect)(()=>{e&&e.length>0&&C({eventCategory:b.NEWSLETTER_SIGN_UP,eventAction:`${e.length} newsletter(s) selected`,eventLabel:J(e)})},[e]),(0,$.jsx)(`div`,{"data-testid":i,className:d(`newsletter-signup-form-container z-1300`,n),children:(0,$.jsxs)(`div`,{className:`newsletter-signup-form w-full items-center text-center flex flex-col gap-16`,children:[I(e)&&(0,$.jsx)(y,{size:L.XXSCURATOR,weight:re.FIFTY,type:j.CONTAINER,className:`text-center text-secondary`,testId:`newsletter-signup-form-selected-item-test-id`,children:`${e.length} newsletter(s) selected`}),f?(0,$.jsxs)($.Fragment,{children:[(0,$.jsxs)(`div`,{className:`flex flex-col gap-08 items-center`,children:[(0,$.jsxs)(`p`,{className:`font-button-sm-regular text-secondary text-left tablet:text-center`,children:[`By signing up, I accept SPH Media’s\xA0`,(0,$.jsx)(U,{type:M.CUSTOM,url:m.tnc,target:`_blank`,className:`inline link-default`,children:`Terms & Conditions`}),` `,`and`,(0,$.jsxs)(U,{type:M.CUSTOM,url:m.privacy,target:`_blank`,className:`inline link-default`,children:[` `,`Personal Data Protection Notice`]}),` `,`as amended from time to time.`]}),(0,$.jsx)(X,{enabled:!S.CONSENT_MULTI_SIGNUP_PAGE,children:I(D)&&(0,$.jsx)(G,{id:`newsletter-signup-engagements`,name:`newsletter-signup-engagements`,items:D,handler:(e=[])=>{let t=I(e)?e:[e];s(t),C({eventCategory:b.NEWSLETTER_SIGN_UP,eventAction:e?`check`:`uncheck`,eventLabel:`t&c and marketing news`})},size:z.SMALL,itemClassName:`justify-center text-secondary !py-00 text-left tablet:text-center`,itemLabelClassName:`font-secondary-label-md-regular`,itemLabelWeightChange:!1})})]}),(0,$.jsx)(R,{type:r?k.ICON_ONLY:k.TEXT_ONLY,icon:{iconName:O.LOADER},fill:Y.PRIMARY,text:`Confirm subscription`,className:`w-fit`,disabled:r,textClassName:d(`flex-none layer-no-hover whitespace-nowrap disabled:layer-disabled`,r&&`icon-placeholder`),handler:()=>{C({eventCategory:b.NEWSLETTER_SIGN_UP,eventAction:`confirm subscription`,eventLabel:e&&e.length>0?J(e):``}),c(p??``)}})]}):(0,$.jsx)(`p`,{className:`font-button-sm-regular text-primary`,children:`Log in or sign up to receive the best of The Straits Times delivered to you.`}),!f&&(0,$.jsx)(R,{className:`w-fit`,text:`Log in / Sign up`,handler:()=>{C({eventCategory:b.NEWSLETTER_SIGN_UP,eventAction:`click`,eventLabel:`login / signup`}),P(h)}})]})})}function he({showSelectAll:e=!1,selectAllTitle:t=`Select your newsletters`,className:n,toastHandler:r,testId:i=`newsletter-signup-list-test-id`}){let{userInfo:a}=A(),{isAuthenticated:l}=p(),[u,m]=(0,Q.useState)(!1),[g,_]=(0,Q.useState)(!1),[y,T]=(0,Q.useState)(!1),[E,D]=(0,Q.useState)([]),[O,j]=(0,Q.useState)([]),[M,N]=(0,Q.useState)(!1),P=()=>{u||C({eventCategory:b.NEWSLETTER_SIGN_UP,eventAction:`click`,eventLabel:`select all`}),m(!u)},F=a?.email;(0,Q.useEffect)(()=>{S.CONSENT_MULTI_SIGNUP_PAGE||(u?(D(Array.from(new Set(Object.values(h).map(e=>e.id)))),_(!0)):(D([]),_(!1)))},[u]),(0,Q.useEffect)(()=>{S.CONSENT_MULTI_SIGNUP_PAGE||(I(E)?_(!0):_(!1))},[E]),(0,Q.useEffect)(()=>{S.CONSENT_MULTI_SIGNUP_PAGE||o&&(g?document.body.classList.toggle(`hide-mobile-ads`,g):document.body.classList.remove(`hide-mobile-ads`))},[g]);let z=e=>{if(!e)return!1;C({eventCategory:b.NEWSLETTER_SIGN_UP,eventAction:`select +`,eventLabel:J([e])}),D(t=>t.includes(e)?t.filter(t=>t!==e):[...t,e])},V=async e=>{let t=!!e.engagements?.includes(`consentemail`);if(E.length>0&&e.responseType===`VALID`)try{let n=E;T(!0),await w(`newsletter/ajax/subscribe`,`POST`,{nl_email:e.email,nl_edition:n,nl_name:oe(n),nl_consentEmail:t},!1).then(e=>{e.code===200?(T(!1),r&&typeof r==`function`&&r(c.SUCCESS),W()):(r&&typeof r==`function`&&r(c.ERROR),W())})}catch{r&&typeof r==`function`&&r(c.ERROR),W()}else r&&typeof r==`function`&&r(e.responseType===`NO_INTERNET`?c.INFORMATION:c.ERROR)},H=async(e,t=!0)=>{try{if(T(!0),(await w(`consent/sync`,`POST`,{email:F,consents:B(e)},!1)).success){let n=B(e);if(Array.isArray(n)){let e=n.map(e=>e.name);j(t=>Array.from(new Set([...t,...e])))}C({eventCategory:b.NEWSLETTER_SIGN_UP,eventAction:t?`select +`:`click`,eventLabel:J(e)}),r&&typeof r==`function`&&r(c.SUCCESS)}else r&&typeof r==`function`&&r(c.ERROR);W()}catch{r&&typeof r==`function`&&r(c.ERROR),W()}},U=async()=>{await w(`consent/fetch`,`POST`,{email:a?.email},!1).then(e=>{e.success?j(ae(e.data.consents)):r&&typeof r==`function`&&r(c.ERROR)})},W=()=>{D([]),T(!1),m(!1)};(0,Q.useEffect)(()=>{S.CONSENT_MULTI_SIGNUP_PAGE&&(l?a&&a.email&&(T(!1),U()):T(!0))},[l,a?.email]);let G=Object.values(h).filter(e=>O.includes(e.consent_name)).length,K=S.CONSENT_MULTI_SIGNUP_PAGE&&G<Object.values(h).length;return(0,$.jsx)($.Fragment,{children:(0,$.jsx)(`div`,{"data-testid":i,className:d(`newsletter-signup-list-container`,n),children:(0,$.jsxs)(X,{enabled:S.CONSENT_MULTI_SIGNUP_PAGE,fallback:(0,$.jsx)(ge,{selectAll:u,showSelectAll:e,selectAllTitle:t,isAuthenticated:l,selectAllHandler:P,showForm:g,isLoading:y,newsletterFormActionHandler:V,selectedNewsletter:E,updateSelectedNewsletter:z}),children:[e&&(0,$.jsxs)(`div`,{className:`flex flex-row content-start justify-between gap-32 w-full items-center mobile:pb-10 tablet:pb-13 desktop:pb-16`,children:[(0,$.jsx)(v,{category:s.TITLE,size:L.SM,style:q.BOLD,testId:`newsletter-signup-into-test-id`,className:`shrink-0 `,children:t}),K&&l&&(0,$.jsx)(R,{type:k.TEXT_ONLY,fill:Y.OUTLINE,size:f.SMALL,className:`shrink-0`,text:`Subscribe all`,textClassName:`font-secondary-label-md-semibold`,handler:()=>{H(Object.values(h).filter(e=>e.id).map(e=>e.id),!1)}})]}),(0,$.jsx)(`div`,{className:`newsletter-grid`,children:x().map(e=>(0,$.jsx)(te,{newsletter:e,button:ee({active:O.includes(e.consent_name),id:e.id,handler:H,isLoading:M,setIsLoading:N}),className:`newsletter-card`},e.id))})]})})})}function ge({selectAll:e,showSelectAll:t,selectAllTitle:n,isAuthenticated:r,selectAllHandler:i,show

1Form:a,isLoading:o,newsletterFormActionHandler:c,selectedNewsletter:l,updateSelectedNewsletter:u}){return(0,$.jsxs)($.Fragment,{children:[t&&(0,$.jsxs)(`div`,{className:`flex flex-row content-start gap-32 w-full items-center mobile:pb-10 tablet:pb-13 desktop:pb-16`,children:[(0,$.jsx)(v,{category:s.TITLE,size:L.SM,style:q.BOLD,testId:`newsletter-signup-into-test-id`,className:`grow `,children:n}),r&&(0,$.jsx)(G,{id:`select-all-newsletter`,name:`select-all-newsletter`,items:[{label:e?`Unselect all`:`Select all`,value:`select-all`}],init:e?`select-all`:``,handler:i,size:z.SMALL,position:H.RIGHT,testId:`select-all-newsletter-test-id`,className:`grow-0 w-auto`})]}),(0,$.jsx)(`div`,{className:`newsletter-grid`,children:x().map(t=>(0,$.jsx)(K,{...t,showButton:!0,handler:u,className:`newsletter-card`,initValue:!!(e||l.includes(t.id))},t.id))}),a&&(0,$.jsx)(me,{selectedNewsletterIDs:l,isLoading:o,...W,formAction:e=>{c(e)}})]})}var _e=!1,ve=e(function(){let{isAuthenticated:e}=p(),{pathname:n}=t(),i=de(N.DEFAULT,V(n)),a=I(i)?i[0]:void 0;_e||=(fe(i),!0);let[u,f]=(0,Q.useState)(`DEFAULT`);(0,Q.useEffect)(()=>{ne(`newsletter-toast`)},[]),(0,Q.useEffect)(()=>{u!==`DEFAULT`&&C({eventCategory:b.NEWSLETTER_SIGN_UP,eventAction:`visible`,eventLabel:u===c.SUCCESS?`you're subscribed`:u===c.ERROR?`sign-up failed`:`no internet connection`})},[u]);let m=r();return m.type===Z.CLIENT_ERROR||m.type===Z.SERVER_ERROR?(0,$.jsx)(ue,{response:m}):(0,$.jsxs)(ce,{lb1Ad:a,children:[(0,$.jsx)(`div`,{className:d(`container sticky top-72 mt-10 right-00 h-00 z-1000`,u===`DEFAULT`?`hidden`:`block`),id:`newsletter-toast`,children:(0,$.jsx)(T,{type:u===c.SUCCESS?c.SUCCESS:u===c.ERROR?c.ERROR:c.INFORMATION,message:u===c.SUCCESS?g.TOAST_SUCCESS:u===c.ERROR?g.TOAST_FAILED:g.TOAST_NO_INTERNET,descriptionMessage:u===c.SUCCESS?g.TOAST_SUCCESS_DESCRIPTION:u===c.ERROR?g.TOAST_FAILED_DESCRIPTION:g.TOAST_NO_INTERNET_DESCRIPTION,duration:3e3,className:`absolute right-00 w-full tablet:w-fit tablet:mt-10`,handler:()=>{f(`DEFAULT`)}})}),(0,$.jsx)(E,{title:`Newsletters`,url:`/newsletter-signup`,navigationItems:e&&S.MANAGE_NEWSLETTER_PAGE?[{title:`Manage newsletters`,url:`/newsletter-manage`}]:[]}),(0,$.jsxs)($.Fragment,{children:[(0,$.jsx)(`div`,{className:`container`,children:(0,$.jsx)(y,{size:L.XXSCURATOR,type:j.CONTAINER,testId:`newsletter-signup-into-test-id`,className:`dynamic-padding-y`,children:l.introContent})}),(0,$.jsx)(he,{className:`container`,showSelectAll:!0,toastHandler:f}),(0,$.jsx)(_,{className:`mx-00`}),(0,$.jsxs)(`div`,{className:`newsletter-signup-list-container container`,children:[(0,$.jsxs)(`div`,{className:`pt-24 pb-16 flex flex-col gap-04`,children:[(0,$.jsx)(v,{category:s.TITLE,size:L.SM,style:q.BOLD,className:`text-secondary`,children:`More newsletters`}),(0,$.jsx)(v,{category:s.LABEL,size:L.SM,style:q.REGULAR,className:`text-tertiary`,children:`Discover newsletters from our journalists on LinkedIn and Substack`})]}),(0,$.jsx)(`div`,{className:`newsletter-grid`,"data-testid":`external-newsletter-test-id`,children:Object.values(ie).map(e=>(0,$.jsx)(K,{id:e.id,title:e.title,thumbnail:e.thumbnail,description:e.description,frequency:e.frequency,titleIcon:e.icon,showButton:!0,className:`newsletter-card`,type:`EXTERNAL`,handler:()=>{o&&window.open(e.target,`_blank`)}},e.id))})]})]})]})}),ye=e=>{let t=e.loaderData;if(t.type===Z.SUCCESS){let e=t.payload.metaData;return le(e)}};async function be(e){let t=await se(e);if(!t.context)return console.error(`Error occured during client-side routing for newsletter, returning server Loader Data`),await e.serverLoader();let n=t.context;return(!n||typeof n!=`object`||!(`payload`in n)||typeof n.payload!=`object`)&&console.error(`Client Loader: fetchContext() returned an invalid payload for newsletter`),n}export{be as clientLoader,ve as default,ye as meta};