https://drheadshot.com/_next/static/chunks/pages/app/funnel/paid/create/outfits-d1cddc3a7561d168.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[6453],{66251:function(e,t,n){(window.__NEXT_P=window.__NEXT_P||[]).push(["/app/funnel/paid/create/outfits",function(){return n(19151)}])},45574:function(e,t,n){"use strict";n.d(t,{Z:function(){return a}});var r=n(85893);n(67294);var s=n(61798);function a(e){let{currentStep:t=1}=e,{t:n}=(0,s.$G)("app"),a=[{id:1,label:n("paidFunnel.steps.start",{defaultValue:"Start"})},{id:2,label:n("paidFunnel.steps.styles",{defaultValue:"Styles"})},{id:3,label:n("paidFunnel.steps.upload",{defaultValue:"Upload"})},{id:4,label:n("paidFunnel.steps.package",{defaultValue:"Package"})}];return(0,r.jsx)("div",{className:"relative mx-auto max-w-lg after:absolute after:inset-x-0 after:top-1/2 after:block after:h-0.5 after:-translate-y-1/2 after:rounded-lg after:bg-gray-200",children:(0,r.jsx)("ol",{className:"relative z-10 flex justify-between text-sm font-medium text-gray-600",children:a.map(e=>{let n=t===e.id,s=t>e.id;return(0,r.jsxs)("li",{className:"flex items-center gap-2 bg-gray-50 p-2 ".concat(s?"text-green-600":n?"text-orange-500":"text-gray-600"),children:[(0,r.jsx)("span",{className:"flex h-8 w-8 items-center justify-center rounded-full font-medium ".concat(n?"bg-orange-500 text-white ring-4 ring-orange-100":s?"bg-green-600 text-white":"bg-gray-100 text-gray-400"),children:s?(0,r.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-5 w-5",viewBox:"0 0 20 20",fill:"currentColor",children:(0,r.jsx)("path",{fillRule:"evenodd",d:"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z",clipRule:"evenodd"})}):e.id}),(0,r.jsx)("span",{className:"hidden sm:block",children:e.label})]},e.id)})})})}},18135:function(e,t,n){"use strict";n.d(t,{CJ:function(){return o},LN:function(){return f},YT:function(){return u},bi:function(){return g},lK:function(){return p},lu:function(){return c},ux:function(){return d}});let r="freeTrialFunnelDraft",s="freeTrialFunnelDraftSession",a="freeTrialFunnelDraftPhotos",l=e=>"string"==typeof(null==e?void 0:e.name)&&e.name.toLowerCase().includes("quota");function o(){return"ft_".concat(Date.now().toString(36),"_").concat(Math.random().toString(36).slice(2,10))}function i(e){try{let t=sessionStorage.getItem(e);if(!t)return null;return JSON.parse(t)}catch(e){return console.error("Failed to read free-trial funnel session data",e),null}}function u(){try{let e=localStorage.getItem(r);if(!e)return i(s);let t=JSON.parse(e);if(!t)return t;if(t.photosStoredInSession){let e=i(a);if(Array.isArray(e))return{...t,photos:e}}return t}catch(e){return console.error("Failed to read free-trial funnel draft",e),i(s)}}function d(){try{localStorage.removeItem(r),sessionStorage.removeItem(s),sessionStorage.removeItem(a)}catch(e){console.error("Failed to clear free-trial funnel draft",e)}}function c(e){let t=u()||{},n={...t,...e};return!function(e){try{localStorage.setItem(r,JSON.stringify(e))}catch(t){if(l(t)){try{sessionStorage.setItem(a,JSON.stringify((null==e?void 0:e.photos)||[]))}catch(e){console.error("Failed to write free-trial funnel photos to session storage",e)}let t={...e,photos:Array.isArray(null==e?void 0:e.photos)?e.photos.map(e=>{let{preview:t,...n}=e;return n}):[],photosStoredInSession:!0};try{localStorage.setItem(r,JSON.stringify(t));return}catch(e){console.error("Failed to persist slim free-trial funnel draft",e)}}console.error("Failed to write free-trial funnel draft",t);try{sessionStorage.setItem(s,JSON.stringify(e))}catch(e){console.error("Failed to write free-trial funnel draft to session storage",e)}}}(n),n}function f(){return"undefined"!=typeof document&&document.cookie.split(";").map(e=>e.trim()).some(e=>e.startsWith("token="))}function g(e){return"funnel/create/processing?trialId=".concat(encodeURIComponent(e))}function p(){return{trialId:o(),name:"",gender:"male",email:"",photos:[],outfits:[],requestSubmitted:!1,createdAt:new Date().toISOString()}}},46718:function(e,t,n){"use strict";n.d(t,{e:function(){return a}});var r=n(29980),s=n(56202);function a(e){let t,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};try{var a;t=null===(a=(0,s.kX)())||void 0===a?void 0:a.trialId}catch(e){}return(0,r.eN)(e,{funnel:"paid",..."string"==typeof t?{funnel_id:t}:{},...n})}},56202:function(e,t,n){"use strict";n.d(t,{Si:function(){return d},WK:function(){return c},kX:function(){return u}});var r=n(18135);let s="paidFunnelDraft",a="paidFunnelDraftSession",l="paidFunnelDraftPhotos",o=e=>"string"==typeof(null==e?void 0:e.name)&&e.name.toLowerCase().includes("quota");function i(e){try{let t=sessionStorage.getItem(e);if(!t)return null;return JSON.parse(t)}catch(e){return console.error("Failed to read paid funnel session data",e),null}}function u(){try{let e=localStorage.getItem(s);if(!e)return i(a);let t=JSON.parse(e);if(!t)return t;if(t.photosStoredInSession){let e=i(l);if(Array.isArray(e))return{...t,photos:e}}return t}catch(e){return console.error("Failed to read paid funnel draft",e),i(a)}}function d(e){let t=u()||{},n={...t,...e};return!function(e){try{localStorage.setItem(s,JSON.stringify(e))}

1catch(t){if(o(t)){try{sessionStorage.setItem(l,JSON.stringify((null==e?void 0:e.photos)||[]))}catch(e){console.error("Failed to write paid funnel photos to session storage",e)}let t={...e,photos:Array.isArray(null==e?void 0:e.photos)?e.photos.map(e=>{let{preview:t,...n}=e;return n}):[],photosStoredInSession:!0};try{localStorage.setItem(s,JSON.stringify(t));return}catch(e){console.error("Failed to persist slim paid funnel draft",e)}}console.error("Failed to write paid funnel draft",t);try{sessionStorage.setItem(a,JSON.stringify(e))}catch(e){console.error("Failed to write paid funnel draft to session storage",e)}}}(n),n}function c(){return{trialId:(0,r.CJ)(),name:"",gender:"male",email:"",photos:[],outfits:[],requestSubmitted:!1,createdAt:new Date().toISOString(),funnel:"paid"}}},19151:function(e,t,n){"use strict";n.r(t),n.d(t,{__N_SSP:function(){return x},default:function(){return y}});var r=n(85893),s=n(9008),a=n.n(s),l=n(25675),o=n.n(l),i=n(67294),u=n(11163),d=n(61798),c=n(30299),f=n(45574),g=n(46718),p=n(18135),m=n(56202);let h=[{id:"business-professional",label:"Business Professional",labelKey:"businessProfessional",descriptionKey:"businessProfessionalDesc",defaultDescription:"Tailored business looks for LinkedIn and CVs.",images:{male:"/imgs/funnel/styles/business-professional.webp",female:"/imgs/funnel/styles/female-business-professional.webp"}},{id:"business-casual",label:"Business Casual",labelKey:"businessCasual",descriptionKey:"businessCasualDesc",defaultDescription:"Smart, approachable office looks.",images:{male:"/imgs/funnel/styles/business-casual.webp",female:"/imgs/funnel/styles/female-business-casual.webp"}},{id:"casual",label:"Casual",labelKey:"casual",descriptionKey:"casualDesc",defaultDescription:"Relaxed everyday looks in natural light.",images:{male:"/imgs/funnel/styles/casual.webp",female:"/imgs/funnel/styles/female-casual.webp"}},{id:"elegant",label:"Elegant",labelKey:"elegant",descriptionKey:"elegantDesc",defaultDescription:"Polished, premium editorial looks.",images:{male:"/imgs/funnel/styles/elegant.webp",female:"/imgs/funnel/styles/female-elegant.webp"}}];var x=!0;function y(){let e=(0,u.useRouter)(),{t}=(0,d.$G)("app"),[n,s]=(0,i.useState)([]),[l,x]=(0,i.useState)(""),[y,b]=(0,i.useState)(!1),[w,v]=(0,i.useState)(null),[S,j]=(0,i.useState)(!1);(0,i.useEffect)(()=>{(0,g.e)("paid_funnel_step_viewed",{step:"outfits"})},[]),(0,i.useEffect)(()=>{b((0,p.LN)());let t=(0,m.kX)();if(!(null==t?void 0:t.trialId)||!(null==t?void 0:t.name)||!(null==t?void 0:t.gender)){e.replace("/app/funnel/paid/create?redirect=outfits");return}v("female"===t.gender?"female":"male");let n=Array.isArray(t.outfits)?t.outfits:[],r=n.map(e=>null==e?void 0:e._id).filter(e=>h.some(t=>t.id===e));s(r),j(!0)},[e]);let N=(0,i.useMemo)(()=>n.length>=1,[n.length]),k=(0,i.useCallback)(e=>{x(""),s(t=>t.includes(e)?t.filter(t=>t!==e):[...t,e])},[]);(0,i.useEffect)(()=>{if(!S)return;let e=n.map(e=>{let t=h.find(t=>t.id===e);return{_id:e,outfit:(null==t?void 0:t.label)||e,styleCategory:!0}});(0,m.Si)({outfits:e,updatedAt:new Date().toISOString()})},[n,S]);let F=()=>{if(!N){x(t("paidFunnel.outfits.errorSelectMinStyles",{defaultValue:"Please select at least 1 style to continue."}));return}(0,m.Si)({requestSubmitted:!1,updatedAt:new Date().toISOString()}),(0,g.e)("paid_funnel_step_completed",{step:"outfits",selected_count:n.length}),e.push("/app/funnel/paid/create/upload")};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsxs)(a(),{children:[(0,r.jsx)("title",{children:t("paidFunnel.outfits.metaTitleStyles",{defaultValue:"Select Styles - Dr. Headshot"})}),(0,r.jsx)("meta",{name:"viewport",content:"width=device-width, initial-scale=1"})]}),(0,r.jsxs)("div",{className:"min-h-screen overflow-x-hidden bg-gray-50",children:[(0,r.jsx)(c.Z,{showBack:!0,backUrl:"/app/funnel/paid/create",isLoggedIn:y,noMargin:!0}),(0,r.jsx)("div",{className:"mx-auto max-w-2xl px-2 pt-2 lg:px-8",children:(0,r.jsx)("div",{className:"mb-4 w-full lg:mb-4",children:(0,r.jsx)(f.Z,{currentStep:2})})}),(0,r.jsx)("div",{className:"mx-auto max-w-3xl px-2 pb-40 lg:px-8 lg:pb-8",children:(0,r.jsxs)("div",{className:"mt-2 flex flex-col overflow-hidden lg:rounded-lg lg:border lg:border-gray-200 lg:bg-white",children:[(0,r.jsxs)("div",{className:"flex flex-col p-4 lg:p-8",children:[(0,r.jsx)("h1",{className:"text-2xl font-bold tracking-tight text-gray-800 sm:text-3xl",children:t("paidFunnel.outfits.titleStyles",{defaultValue:"Choose your styles"})}),(0,r.jsx)("p",{className:"mt-2 text-base font-medium text-gray-600",children:t("paidFunnel.outfits.descriptionStyles",{defaultValue:"Pick the styles you want for your photoshoot. Your headshots will include a mix of these looks."})}),(0,r.jsx)("p",{className:"mt-1 text-sm text-gray-500",children:t("paidFunnel.outfits.selectedCount",{defaultValue:"Selected: {{count}} of {{max}}",count:n.length,max:h.length})}),(0,r.jsx)("div",{className:"mt-6 grid grid-cols-1 gap-3 sm:auto-rows-fr sm:grid-cols-2",children:h.map(e=>{let s=n.includes(e.id);return(0,r.jsxs)("button",{type:"button",onClick:()=>k(e.id),"aria-pressed":s,className:"group relative flex min-h-[126px] items-stretch overflow-hidden rounded-xl border-2 bg-white text-left transition-all hover:border-orange-300 ".concat(s?"border-orange-500 bg-orange-50/40 ring-2 ring-orange-100":"border-gray-200"),children:[(0,r.jsx)("span",{className:"relative w-28 shrink-0 overflow-hidden bg-gray-100 sm:w-32","aria-hidden":!0,

1children:w?(0,r.jsx)(o(),{src:e.images[w],alt:"",fill:!0,quality:90,sizes:"(max-width: 640px) 14rem, 16rem",className:"object-cover object-top transition-transform duration-300 group-hover:scale-[1.03]"}):null}),(0,r.jsxs)("span",{className:"min-w-0 flex-1 px-4 py-4 pr-10",children:[(0,r.jsx)("span",{className:"block text-base font-semibold text-gray-900",children:t("paidFunnel.outfits.styles.".concat(e.labelKey),{defaultValue:e.label})}),(0,r.jsx)("span",{className:"mt-1 block text-sm leading-snug text-gray-600",children:t("paidFunnel.outfits.styles.".concat(e.descriptionKey),{defaultValue:e.defaultDescription})})]}),(0,r.jsx)("span",{className:"absolute right-3 top-3 flex h-6 w-6 items-center justify-center rounded-full transition ".concat(s?"bg-orange-500 text-white":"border border-gray-300 bg-white text-transparent"),"aria-hidden":!0,children:(0,r.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-3.5 w-3.5",viewBox:"0 0 20 20",fill:"currentColor",children:(0,r.jsx)("path",{fillRule:"evenodd",d:"M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z",clipRule:"evenodd"})})})]},e.id)})}),(0,r.jsxs)("div",{className:"mt-5 flex items-start gap-2 rounded-lg bg-gray-50 p-3 text-sm text-gray-600 lg:bg-orange-50/50",children:[(0,r.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",fill:"currentColor",className:"mt-0.5 h-4 w-4 shrink-0 text-orange-500","aria-hidden":!0,children:(0,r.jsx)("path",{fillRule:"evenodd",d:"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a.75.75 0 000 1.5h.253a.25.25 0 01.244.304l-.459 2.066A1.75 1.75 0 0010.748 15H11a.75.75 0 000-1.5h-.253a.25.25 0 01-.244-.304l.459-2.066A1.75 1.75 0 009.253 9H9z",clipRule:"evenodd"})}),(0,r.jsx)("span",{children:t("paidFunnel.outfits.varietyHint",{defaultValue:"Your photoshoot includes a curated variety of looks. You can change outfits at any time and choose from over 400 options."})})]}),l?(0,r.jsx)("p",{className:"mt-4 text-sm text-red-600",children:l}):null]}),(0,r.jsx)("div",{className:"sticky bottom-0 hidden items-center justify-end border-t border-gray-200 bg-white px-6 py-3 lg:flex lg:rounded-b-lg",style:{paddingBottom:"max(1rem, env(safe-area-inset-bottom))"},children:(0,r.jsxs)("button",{type:"button",onClick:F,disabled:!N,className:"inline-flex items-center justify-center gap-2 rounded-full border border-transparent px-5 py-2.5 text-sm font-semibold text-white shadow-md transition-all focus:outline-none focus:ring-2 focus:ring-orange-500 focus:ring-offset-2 disabled:cursor-not-allowed disabled:shadow-none ".concat(N?"bg-orange-500 hover:bg-orange-600":"bg-gray-300 text-gray-500"),children:[t("paidFunnel.outfits.continue",{defaultValue:"Upload Photos"}),(0,r.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-4 w-4 shrink-0",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",strokeWidth:2,children:(0,r.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M9 5l7 7-7 7"})})]})})]})}),(0,r.jsx)("div",{className:"fixed bottom-0 left-0 right-0 z-40 border-t border-gray-200 bg-white p-4 shadow-lg lg:hidden",style:{paddingBottom:"max(1rem, env(safe-area-inset-bottom))"},children:(0,r.jsxs)("button",{type:"button",onClick:F,disabled:!N,className:"inline-flex h-12 w-full items-center justify-center gap-2 rounded-full border border-transparent px-4 text-base font-semibold text-white shadow-md transition-all focus:outline-none focus:ring-2 focus:ring-offset-2 ".concat(N?"bg-orange-500 hover:bg-orange-600 focus:ring-orange-500":"cursor-not-allowed bg-gray-300 text-gray-500 focus:ring-gray-300"),children:[t("paidFunnel.outfits.continue",{defaultValue:"Upload Photos"}),(0,r.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",className:"h-4 w-4 shrink-0",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",strokeWidth:2,children:(0,r.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M9 5l7 7-7 7"})})]})})]})]})}}},function(e){e.O(0,[1664,5675,299,9774,2888,179],function(){return e(e.s=66251)}),_N_E=e.O()}]);