https://dashboard.swiftsellai.com/assets/templates_.create.lazy-vhfWvTZo.js

1import{j as e,$ as _,I as T,aB as ee,B as w,f as g,t as I,aV as se,a as k,c as te,b as ae,u as ne,d as re,y as oe,aj as ie,G as le}from"./index-DCno78eK.js";import{t as ce}from"./zod-zriCfOUv.js";import{T as de,h as xe,a as he,L as pe,B as me}from"./language-combobox-rFt1q32h.js";import{i as ue,a as d,b as l,c as m,h as b,d as c,e as p,u as je,F as ye}from"./form-Cp2ZKsv1.js";import{I as z,a as G,b as Q}from"./input-group-Bd_N7Pb6.js";import{R as ge,a as be}from"./radio-group-cW9W9044.js";import{M as Ne}from"./index-BiLbLflF.js";import{X as H}from"./x-eVcCrjma.js";import{P as R}from"./plus-04PLJIDO.js";import{S as W}from"./switch-BAtX2N4c.js";import{A as Y}from"./attribute-combobox-C-PrZ1Pn.js";import{S as j}from"./switch-9QMe_I_n.js";import{u as ve}from"./index-DnZilMaO.js";import{Z as fe}from"./zap-CKVLyR31.js";import{L as S}from"./loader-circle-7V2hf3Ha.js";import{I as we,F as Ce,E as Te}from"./editor-B8Vi-gsr.js";import{V as Ae,W as Ee}from"./whatsapp-account-select-item-Dj1Pc5ug.js";import{a as Ie,t as He}from"./template-mapWdjIP.js";import{T as Re}from"./template-message-C1OOoxvJ.js";import{C as Se}from"./copy-C_Nl1A1W.js";import{S as B,a as P,b as L,c as D,d as F}from"./select-C_5nelqC.js";import{P as Fe}from"./analytics-BdT2qngZ.js";import{E as Me}from"./external-link-CgyAtdr5.js";import"./createLucideIcon-snbBZY7C.js";import"./text-transformer-RujEdDAh.js";import"./chevrons-up-down-BJbZ1e3O.js";import"./check-aBW5AJvc.js";import"./index-CXq35Uog.js";import"./system-attributes-DOYna6cr.js";import"./index-CtIyjDpU.js";import"./iconBase-Cxyh6HoP.js";import"./index-Vcq4gwWv.js";import"./objectWithoutPropertiesLoose-BjXSgPXB.js";import"./index-DywX51Id.js";import"./phone-DIBOhxGV.js";import"./index-DVi-QWee.js";import"./chevron-down-DOLtU-mz.js";function Ve({form:s}){return e.jsx("div",{className:"col-span-2 p-4 space-y-4 rounded-lg border",children:e.jsx(d,{name:"otpButtonText",control:s.control,render:({field:o})=>e.jsxs(l,{children:[e.jsx(m,{children:"Buttons"}),e.jsx(b,{children:"Authentication templates include a Copy Code button. You can customise the button label."}),e.jsx(c,{children:e.jsxs(z,{children:[e.jsx(G,{...o,placeholder:"Copy Code"}),e.jsxs(Q,{align:"inline-end",children:[o.value.length,"/25"]})]})}),e.jsx(p,{})]})})})}function Ue({form:s}){const o=s.watch("buttonType"),r=s.watch("category"),{fields:a,remove:y,append:v,replace:C}=ue({control:s.control,name:"buttons"});return r==="AUTHENTICATION"?e.jsx(Ve,{form:s}):e.jsxs("div",{className:"col-span-2 space-y-6",children:[e.jsx(d,{name:"buttonType",control:s.control,render:({field:i})=>e.jsxs(l,{className:"space-y-3",children:[e.jsx(m,{children:"Buttons (optional)"}),e.jsx(b,{children:"Create buttons that let customers respond to your message or take action."}),e.jsx(c,{children:e.jsx(ge,{onValueChange:h=>{i.onChange(h),C([])},defaultValue:i.value,className:"flex gap-12 mt-4",children:[{label:"No Buttons",value:"none"},{label:"Call to action",value:"cta"},{label:"Quick reply",value:"quickReply"}].map(({label:h,value:t})=>e.jsxs(l,{className:"flex items-center space-x-3 space-y-0",children:[e.jsx(c,{children:e.jsx(be,{value:t})}),e.jsx(m,{className:"font-normal",children:h})]},t))})}),e.jsx(p,{})]})}),a.map((i,h)=>e.jsx(e.Fragment,{children:Ne(i).with({type:"PHONE_NUMBER"},()=>e.jsxs("div",{children:[e.jsx(_,{children:"Call to action (Phone)"}),e.jsxs("div",{className:"flex items-center mt-2 space-x-3",children:[e.jsx(d,{control:s.control,name:`buttons.${h}.text`,render:({field:t})=>e.jsxs(l,{className:"flex-1",children:[e.jsx(c,{children:e.jsx(T,{placeholder:"Button Title",...t})}),e.jsx(p,{})]})}),e.jsx(d,{control:s.control,name:`buttons.${h}.phoneNumber`,render:({field:t})=>e.jsxs(l,{className:"flex-1",children:[e.jsx(c,{children:e.jsx(ee,{defaultCountry:"IN",placeholder:"Enter phone number",value:t.value,onChange:t.onChange})}),e.jsx(p,{})]})}),e.jsx(w,{size:"sm",variant:"ghost",onClick:()=>y(h),className:"self-start p-1 mt-2 h-auto",children:e.jsx(H,{className:"w-4 h-4"})})]})]},i.id)).with({type:"URL"},()=>e.jsxs("div",{children:[e.jsx(_,{children:"Call to action (URL)"}),e.jsxs("div",{className:"flex items-center mt-2 space-x-3",children:[e.jsx(d,{control:s.control,name:`buttons.${h}.text`,render:({field:t})=>e.jsxs(l,{className:"flex-1",children:[e.jsx(c,{children:e.jsx(T,{placeholder:"Button Title",...t})}),e.jsx(p,{})]})}),e.jsx(d,{control:s.control,name:`buttons.${h}.url`,render:({field:t})=>e.jsxs(l,{className:"flex-1",children:[e.jsx(c,{children:e.jsx(T,{placeholder:"Enter URL here",...t})}),e.jsx(p,{})]})}),e.jsx(w,{size:"sm",variant:"ghost",onClick:()=>y(h),className:"self-start p-1 mt-2 h-auto",children:e.jsx(H,{className:"w-4 h-4"})})]})]},i.id)).with({type:"QUICK_REPLY"},()=>e.jsx("div",{children:e.jsxs("div",{className:"flex items-center mt-2 space-x-3",children:[e.jsx(d,{control:s.control,name:`buttons.${h}.text`,render:({field:t})=>e.jsxs(l,{className:"flex-1",children:[e.jsxs("div",{className:"flex flex-1 items-center space-x-3",children:[e.jsxs(m,{className:"flex-none",children:["Quick Reply ",h+1,":"]}),e.jsx(c,{children:e.jsx(T,{placeholder:"Quick Reply Title",...t})})]}),e.jsx(p,{className:"ml-28"})]})}),e.jsx(w,{size:"sm",variant:"ghost",onClick:()=>y(h),className:"self-start p-1 mt-2 h-auto",children:e.jsx(H,{className:"w-4 h-4"})})]})},i.id)).otherwise(()=>null)})),e.jsx(g,{when:o==="cta",children:e.jsxs("div",{className:"flex items-center space-x-3",children:[e.jsx(w,{type:"button",variant:"outline",startIcon:e.jsx(R,{}),disabled:a.some(i=>i.type==="URL"),onClick:()=>v({type:"URL",text:"Visit Website",url:""}),children:"URL Button"}),e.jsx(w,{type:"button",variant:"outline",startIcon:e.jsx(R,{}),disabled:a.some(i=>i.type==="PHONE_NUMBER"),onClick:()=>v({type:"PHONE_NUMBER",text:"Call phone number",phoneNumber:""}),children:"Call Button"})]})}),e.jsx(g,{when:o==="quickReply",children:e.jsx(w,{type:"button",variant:"outline",startIcon:e.jsx(R,{}),onClick:()=>v({type:"QUICK_REPLY",text:"Quick Reply"}),disabled:a.filter(i=>i.type==="QUICK_REPLY").length>

1=3,children:"Quick Reply"})})]})}function Oe({form:s}){const o=s.watch("enableCodeExpiry");return e.jsxs("div",{className:"col-span-2 p-4 space-y-4 rounded-lg border",children:[e.jsx(d,{name:"enableCodeExpiry",control:s.control,render:({field:r})=>e.jsxs(l,{className:"flex flex-row justify-between items-center",children:[e.jsxs("div",{className:"space-y-0.5",children:[e.jsx(m,{children:"Footer (optional)"}),e.jsx(b,{children:"Notify recipients how long the OTP code is valid for."})]}),e.jsx(c,{children:e.jsx(W,{checked:r.value,onCheckedChange:a=>{r.onChange(a),a?s.setValue("codeExpirationMinutes",10):s.setValue("codeExpirationMinutes",void 0)}})})]})}),o&&e.jsx(d,{name:"codeExpirationMinutes",control:s.control,render:({field:r})=>e.jsxs(l,{children:[e.jsxs("div",{className:"space-y-0.5",children:[e.jsx(m,{children:"Expiry Duration"}),e.jsx(b,{children:"Must be between 1 and 90 minutes."})]}),e.jsx(c,{children:e.jsxs(z,{children:[e.jsx(G,{...r,min:1,max:90,placeholder:"e.g. 10",className:"pr-20",value:r.value??""}),e.jsx(Q,{align:"inline-end",children:"minutes"})]})}),e.jsx(p,{})]})})]})}function _e({form:s}){return s.watch("category")==="AUTHENTICATION"?e.jsx(Oe,{form:s}):e.jsx("div",{className:"col-span-2",children:e.jsx(d,{name:"footer",control:s.control,render:({field:r})=>e.jsxs(l,{children:[e.jsx(m,{children:"Footer (optional)"}),e.jsx(b,{children:"Add a short line of text to the bottom of your message template."}),e.jsx(c,{children:e.jsxs("div",{className:"relative",children:[e.jsx(T,{...r,placeholder:"Enter your footer text..."}),e.jsxs("span",{className:"absolute right-2 top-1/2 text-sm -translate-y-1/2 text-muted-foreground",children:[r.value?.length??0,"/60"]})]})}),e.jsx(p,{})]})})})}const ke={none:{maxFiles:0},text:{maxFiles:0},image:{accept:{"image/png":[".png"],"image/jpeg":[".jpeg",".jpg"]},maxFiles:1,maxSize:5*1024*1024},video:{accept:{"video/mp4":[".mp4"],"video/3gp":[".3gp"]},maxFiles:1,maxSize:16*1024*1024},document:{accept:{"application/pdf":[".pdf"],"application/msword":[".doc"],"application/vnd.openxmlformats-officedocument.wordprocessingml.document":[".docx"],"application/vnd.ms-excel":[".xls"],"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet":[".xlsx"],"application/vnd.ms-powerpoint":[".ppt"],"application/vnd.openxmlformats-officedocument.presentationml.presentation":[".pptx"]},maxFiles:1,maxSize:100*1024*1024}},K={image:"image",video:"video",document:"document"};function Be({form:s}){const[o,r,a,y]=s.watch(["category","headerType","mediaHeader","isDynamicHeader"]),v=["image","video","document"].includes(r),{mutate:C,isPending:i}=I.whatsappTemplate.uploadTemplateMedia.useMutation({onSuccess:({body:{assetUrl:n,FBhandle:x}})=>{s.setValue("mediaHeader.preview",n),s.setValue("mediaHeader.header_handle",x)}}),{getRootProps:h,getInputProps:t}=ve({...ke[r],onDrop:n=>{const x=s.getValues("whatsappAccountId");if(!x){k.error("Please select a WhatsApp number before uploading media");return}const u=n[0];s.setValue("mediaHeader",{preview:URL.createObjectURL(u),file_length:u.size,file_type:u.type,file_name:u.name});const N=new FormData;N.append("file",u),N.append("fileName",u.name),N.append("fileType",u.type),N.append("fileLength",u.size.toString()),N.append("whatsappAccountId",x),C({body:N})},onDropRejected:n=>{k.error(n[0].errors[0].message)}});return o==="AUTHENTICATION"?null:e.jsxs("div",{className:"col-span-2 space-y-4",children:[e.jsx(d,{name:"headerType",control:s.control,render:({field:n})=>e.jsxs(l,{className:"space-y-3",children:[e.jsx(m,{children:"Header (optional)"}),e.jsx(b,{children:"Add a title or choose which type of media you'll use for this header."}),e.jsx(c,{children:e.jsx(de,{type:"single",variant:"outline",className:"justify-start space-x-4",value:n.value,onValueChange:x=>{x&&(n.onChange(x),s.setValue("isDynamicHeader",!1),s.setValue("headerVariableKey",void 0),s.setValue("mediaHeader",void 0))},children:xe.map(({label:x,value:u,icon:N})=>e.jsxs(he,{value:u,className:"data-[state=on]:bg-white data-[state=on]:text-primary data-[state=on]:border-primary data-[state=on]:border-2",children:[e.jsx(N,{className:"mr-2 w-4 h-4"}),x]},u))})}),e.jsx(p,{})]})}),e.jsx(j.Match,{when:r==="text",children:e.jsx(d,{name:"header",control:s.control,render:({field:n})=>e.jsxs(l,{children:[e.jsx(c,{children:e.jsxs("div",{className:"relative",children:[e.jsx(T,{placeholder:"Enter your header text...",...n}),e.jsxs("span",{className:"absolute right-2 top-1/2 text-sm -translate-y-1/2 text-muted-foreground",children:[n.value?.length??0,"/60"]})]})}),e.jsx(p,{})]})})}),e.jsxs(g,{when:v,children:[e.jsxs("div",{className:"p-4 space-y-4 rounded-lg border border-amber-200 bg-amber-50/50",children:[e.jsx(d,{name:"isDynamicHeader",control:s.control,render:({field:n})=>e.jsxs(l,{className:"flex flex-row items-start space-x-3 space-y-0",children:[e.jsx(c,{children:e.jsx(se,{checked:n.value,onCheckedChange:x=>{n.onChange(x),x?s.setValue("mediaHeader",void 0):s.setValue("headerVariableKey",void 0)}})}),e.jsxs("div",{className:"space-y-1",children:[e.jsxs(m,{className:"flex gap-2 items-center font-medium cursor-pointer",children:[e.jsx(fe,{className:"w-4 h-4 text-amber-500"}),"Use Dynamic Header"]}),e.jsxs(b,{className:"text-xs leading-relaxed",children:["The ",K[r]," will be personalized for each recipient based on their contact attribute. A default sample will be used for template approval and as a fallback."]})]})]})}),e.jsx(g,{when:y,children:e.jsx(d,{name:"headerVariableKey",control:s.control,render:({field:n})=>e.jsxs(l,{children:[e.jsx(m,{children:"Header Variable Attribute"}),e.jsxs(b,{children:["Select the contact attribute that contains the"," ",K[r]," URL for each recipient"]}),e.jsx(c,{children:e.jsx(Y,{selectedAttribute:n.value,onAttributeSelect:x=>n.onChange(x)})}),e.jsx(p,{})]})})})]}),e.jsx(g,{when:!y,children:e.jsx(d,{name:"mediaHeader",control:s.control,render:()=>e.jsxs(l,{children:[e.jsx(c,{children:e.jsxs(j,{children:[e.jsx(j.Match,{when:r==="image",children:e.jsxs(j,{children:[e.jsx(j.Match,{when:a,children:n=>e.jsxs("div",{className:"flex items-center px-8 space-x-3 h-24 rounded-lg border border-primary",children:[e.jsxs("div",{className:"relative",children:[e.jsx("img",{alt:"header",src:n.preview,className:"object-cover w-12 h-12 rounded-lg"}),e.jsx(g,{when:i,children:e.jsx("div",{className:"flex absolute inset-0 justify-center items-center bg-black/20",children:e.jsx(S,{className:"text-white animate-spin"})})})]}),e.jsx("p",{className:"flex-1 font-medium",children:n.file_name}),e.jsx(w,{variant:"ghost",onClick:()=>{s.setValue("mediaHeader",void 0)},className:"text-destructive hover:text-destructive",children:"Remove"})]})}),e.jsx(j.Match,{when:!a,children:e.jsxs("div",{...h({className:"border-2 border-dashed text-sm flex items-center w-full space-x-3 h-24 px-8 rounded-lg bg-[#FAFAFA] border-slate-300"}),children:[e.jsx("input",{...t()}),e.jsx(we,{}),e.jsx("p",{className:"flex-1 font-medium",children:"Upload your image"}),e.jsx("p",{className:"text-sm text-gray-400",children:".jpg, .png, .jpeg supported only"})]})})]})}),e.jsx(j.Match,{when:r==="document",children:e.jsxs(j,{children:[e.jsx(j.Match,{when:a,children:n=>e.jsxs("div",{className:"flex items-center px-8 space-x-3 h-24 rounded-lg border border-primary",children:[e.jsxs("div",{className:"relative",children:[e.jsx("object",{data:n.preview,className:"object-cover w-12 h-12 rounded-lg"}),e.jsx(g,{when:i,children:e.jsx("div",{className:"flex absolute inset-0 justify-center items-center bg-black/20",children:e.jsx(S,{className:"text-white animate-spin"})})})]}),e.jsx("p",{className:"flex-1 font-medium",children:n.file_name}),e.jsx(w,{variant:"ghost",onClick:()=>{s.setValue("mediaHeader",void 0)},className:"text-destructive hover:text-destructive",children:"Remove"})]})}),e.jsx(j.Match,{when:!a,children:e.jsxs("div",{...h({className:"border-2 border-dashed text-sm flex items-center w-full space-x-3 h-24 px-8 rounded-lg bg-[#FAFAFA] border-slate-300"}),children:[e.jsx("input",{...t()}),e.jsx(Ce,{}),e.jsx("p",{className:"flex-1 font-medium",children:"Upload your document"}),e.jsx("p",{className:"text-sm text-gray-400",children:".pdf, .doc, .docx, .xls, .xlsx, .ppt, .pptx supported only"})]})})]})}),e.jsx(j.Match,{when:r==="video",children:e.jsxs(j,{children:[e.jsx(j.Match,{when:a,children:n=>e.jsxs("div",{className:"flex items-center px-8 space-x-3 h-24 rounded-lg border border-primary",children:[e.jsxs("div",{className:"relative",children:[e.jsx("video",{src:n.preview,className:"object-cover w-12 h-12 rounded-lg",controls:!0}),e.jsx(g,{when:i,children:e.jsx("div",{className:"flex absolute inset-0 justify-center items-center bg-black/20",children:e.jsx(S,{className:"text-white animate-spin"})})})]}),e.jsx("p",{className:"flex-1 font-medium",children:n.file_name}),e.jsx(w,{variant:"ghost",onClick:()=>{s.setValue("mediaHeader",void 0)},className:"text-destructive hover:text-destructive",children:"Remove"})]})}),e.jsx(j.Match,{when:!a,children:e.jsxs("div",{...h({className:"border-2 border-dashed text-sm flex items-center w-full space-x-3 h-24 px-8 rounded-lg bg-[#FAFAFA] border-slate-300"}),children:[e.jsx("input",{...t()}),e.jsx(Ae,{}),e.jsx("p",{className:"flex-1 font-medium",children:"Upload your video"}),e.jsx("p",{className:"text-sm text-gray-400",children:".mp4, .3gp supported only"})]})})]})})]})}),e.jsx(p,{})]})})})]})]})}const Pe=`Use # to add dynamic content to your message. 
2For example, "#name will be replaced with the recipient's name".
3`;function Le({form:s}){return e.jsxs("div",{className:"col-span-2 p-4 space-y-4 rounded-lg border",children:[e.jsx(d,{name:"otpAttributeKey",control:s.control,render:({field:o})=>e.jsxs(l,{children:[e.jsx(m,{children:"Message Body"}),e.jsx(b,{children:"Select the contact attribute that holds the OTP value. This will be used when sending the authentication message via the outbound API."}),e.jsx(c,{children:e.jsx(Y,{selectedAttribute:o.value,onAttributeSelect:o.onChange})}),e.jsx(p,{})]})}),e.jsx(d,{name:"addSecurityRecommendation",control:s.control,render:({field:o})=>e.jsxs(l,{className:"flex flex-row justify-between items-center",children:[e.jsxs("div",{className:"space-y-0.5",children:[e.jsx(m,{children:"Add Security Recommendation"}),e.jsx(b,{children:"Appends “For your security, do not share this code.” to the message body."})]}),e.jsx(c,{children:e.jsx(W,{checked:o.value,onCheckedChange:o.onChange})})]})})]})}function De({form:s}){return s.watch("category")==="AUTHENTICATION"?e.jsx(Le,{form:s}):e.jsx("div",{className:"col-span-2",children:e.jsx(d,{name:"body",control:s.control,render:({field:r})=>e.jsxs(l,{children:[e.jsx(m,{children:"Message Body"}),e.jsx(b,{className:"mb-2 whitespace-break-spaces",children:Pe}),e.jsx(c,{children:e.jsxs("div",{className:"relative",children:[e.jsx(Te,{initialContent:r.value,handleChange:a=>{r.onChange(a)}}),e.jsxs("span",{className:"absolute right-2 bottom-2 text-sm text-muted-foreground",children:[Ie(r.value??""),"/1024"]})]})}),e.jsx(p,{})]})})})}function Ke({form:s}){const[o,r,a,y]=s.watch(["addSecurityRecommendation","enableCodeExpiry","codeExpirationMinutes","otpButtonText"]);return e.jsxs("div",{className:"px-2 pt-2 bg-white rounded-md max-w-64",children:[e.jsx("div",{className:"pb-2 space-y-1 text-xs",children:e.jsxs("p",{className:"",children:["{{OTP}}"," is your verification code.",e.jsx(g,{when:o,children:e.jsx("span",{children:" For your security, do not share this code."})})]})}),e.jsx(g,{when:r,children:e.jsxs("p",{className:"pb-2 text-xs text-gray-500",children:["This code expires in ",a," minutes."]})}),e.jsx("hr",{className:"-mx-2"}),e.jsxs("div",{className:"flex items-center justify-center gap-1.5 py-2 text-primary text-xs",children:[e.jsx(Se,{className:"size-3.5"}),e.jsx("span",{children:y})]})]})}function ze({form:s}){const[o,r,a,y,v,C,i]=s.watch(["header","headerType","mediaHeader","body","footer","buttons","category"]);return e.jsx("div",{className:"hidden justify-center items-center w-2/5 lg:flex bg-slate-50",children:e.jsx("div",{className:"w-full max-w-sm bg-cover h-168 pt-24 pb-20 overflow-hidden bg-whatsapp-preview",children:e.jsxs("div",{className:"overflow-y-auto ml-8 h-full",children:[e.jsx(g,{when:i==="AUTHENTICATION",children:e.jsx(Ke,{form:s})}),e.jsx(g,{when:i!=="AUTHENTICATION"&&!!(o||y||v),children:e.jsx(Re,{body:y,header:o,footer:v,buttons:C,mediaType:r,mediaUrl:a?.preview})})]})})})}

3const Hs=te("/_app/templates_/create")({component:Ge});function Ge(){const s=ae(),{workspaceId:o}=ne(),r=re(),a=je({mode:"onChange",defaultValues:{name:"",language:"en",headerType:"none",isDynamicHeader:!1,headerVariableKey:void 0,whatsappAccountId:void 0,category:void 0,body:"<p>Hello</p>",buttonType:"none",addSecurityRecommendation:!0,enableCodeExpiry:!1,otpButtonText:"Copy Code"},resolver:ce(He)}),y=I.useQueryClient(),{data:v}=I.whatsapp.getWhatsAppAccounts.useQuery({queryKey:["whatsapp-accounts"]}),{mutateAsync:C,isPending:i}=I.whatsappTemplate.createWhatsappTemplate.useMutation({onSuccess:async()=>await y.invalidateQueries({queryKey:["whatsapp-templates"]})});async function h(t){const{header:n,headerType:x,mediaHeader:u,isDynamicHeader:N,headerVariableKey:$,otpAttributeKey:q}=t,{name:X,language:M,category:E,whatsappAccountId:Z,bodyExamples:V}=t;let f;if(E==="AUTHENTICATION"){const{addSecurityRecommendation:U,enableCodeExpiry:O,codeExpirationMinutes:A,otpButtonText:J}=t;f=[{type:"BODY",add_security_recommendation:U}],O&&A&&f.push({type:"FOOTER",code_expiration_minutes:A}),f.push({type:"BUTTONS",buttons:[{type:"OTP",otp_type:"COPY_CODE",text:J}]})}else{if(f=[{type:"BODY",text:t.body,...V?{example:{body_text:[V]}}:{}}],x==="text"&&n&&f.unshift({type:"HEADER",format:"TEXT",text:t.header}),["image","video","document"].includes(x)){const A={image:"IMAGE",video:"VIDEO",document:"DOCUMENT"}[x];N?f.unshift({type:"HEADER",format:A}):u?.header_handle&&f.unshift({type:"HEADER",format:A,example:{header_handle:[u.header_handle]}})}t.footer&&f.push({type:"FOOTER",text:t.footer}),t.buttons.length>0&&f.push({type:"BUTTONS",buttons:t.buttons})}await C({body:{name:X,language:M,category:E,whatsappAccountId:Z,components:f,workspaceId:o,mediaUrl:u?.preview??null,isDynamicHeader:N??!1,headerVariableKey:$??null,otpAttributeKey:E==="AUTHENTICATION"?q??null:null}}),r.capture(Fe.templateSubmitted,{category:E,language:M}),s({to:"/templates"})}return e.jsxs(e.Fragment,{children:[e.jsx(oe,{className:"flex-1",children:e.jsxs("div",{className:ie,children:[e.jsx(le,{title:"Create Template",description:e.jsxs(e.Fragment,{children:["Create a WhatsApp message template to send notifications, updates, or promotions to your customers."," ",e.jsxs("a",{href:"https://docs.swiftsellai.com/campaigns/create-template",target:"_blank",rel:"noreferrer",className:"inline-flex items-center gap-1 font-medium text-primary underline-offset-4 hover:underline",children:[e.jsx("span",{children:"Learn more"}),e.jsx(Me,{className:"size-3.5"})]})]})}),e.jsx(ye,{...a,children:e.jsx("form",{onSubmit:a.handleSubmit(h),children:e.jsxs("div",{className:"grid grid-cols-2 gap-8",children:[e.jsx(d,{name:"name",control:a.control,render:({field:t})=>e.jsxs(l,{className:"col-span-2",children:[e.jsx(m,{children:"Template Name"}),e.jsx(b,{children:"Name can only be in lowercase alphanumeric characters and underscores. Special characters and white-space are not allowed e.g. - app_verification_code"}),e.jsx(c,{children:e.jsx(T,{...t,placeholder:"Template name...",onChange:({target:{value:n}})=>{const x=n.toLowerCase().replace(" ","_");t.onChange(x)}})}),e.jsx(p,{})]})}),e.jsx(d,{name:"whatsappAccountId",control:a.control,render:({field:t})=>e.jsxs(l,{children:[e.jsx(m,{children:"WhatsApp Business Number"}),e.jsxs(B,{onValueChange:t.onChange,defaultValue:t.value,children:[e.jsx(c,{children:e.jsx(P,{children:e.jsx(L,{placeholder:"Select WhatsApp Number"})})}),e.jsx(D,{className:"w-[var(--radix-select-trigger-width)]",children:v?.body.map(n=>e.jsx(Ee,{...n},n.id))})]}),e.jsx(p,{})]})}),e.jsx(pe,{form:a}),e.jsx(d,{name:"category",control:a.control,render:({field:t})=>e.jsxs(l,{children:[e.jsx(m,{children:"Category"}),e.jsxs(B,{onValueChange:t.onChange,defaultValue:t.value,children:[e.jsx(c,{children:e.jsx(P,{children:e.jsx(L,{placeholder:"Select Category"})})}),e.jsxs(D,{children:[e.jsx(F,{value:"UTILITY",children:"Utility"}),e.jsx(F,{value:"MARKETING",children:"Marketing"}),e.jsx(F,{value:"AUTHENTICATION",children:"Authentication"})]})]}),e.jsx(p,{})]})}),e.jsx(Be,{form:a}),e.jsx(De,{form:a}),e.jsx(me,{form:a}),e.jsx(_e,{form:a}),e.jsx(Ue,{form:a}),e.jsx(w,{type:"submit",loading:i,className:"col-span-2",children:"Submit"})]})})})]})}),e.jsx(ze,{form:a})]})}export{Hs as Route};