https://delivr.to/assets/Templates-DtZmcFkh.js

1import{j as e}from"./query-DmstuUoN.js";import{i as Ve,a as d}from"./vendor-CHI41uxr.js";import{c as re,N as Be,u as qe,B as k,k as Ke,b as z,y as R,E as U,O as $e,z as W,A as X,F as We,H as $,P as Te,J as Y,U as J,Q as Xe,V as Qe,W as Ye,m as Se,n as Pe,o as _e,t as Ae,v as Me,w as De,x as Q}from"./index-CT7kTiav.js";import{I as Je}from"./input-Dvd23oTk.js";import{B as Z}from"./badge-CIRiQWe_.js";import{S as H}from"./FileTypeIcon-C0ONCHbU.js";import{T as Ze,d as es,C as Oe,b as ss,e as oe}from"./table-B-i1Qc_g.js";import{S as ge,a as je,b as ye,c as ve,d as M}from"./select-rx-Gp2-j.js";import{A as ts,a as as,b as ls,c as rs,d as ns,e as is,f as cs,g as os}from"./alert-dialog-DQgxaHUn.js";import{C as ds}from"./checkbox-CcaDavml.js";import{S as ue}from"./switch-Toae-IaB.js";import{L as pe}from"./tabs-CLdUJLBs.js";import{t as ms,p as hs,M as we,a as be,c as xs,d as Fe}from"./QuickSendModal-fc8TmXFK.js";import{a as us,b as Ge,u as ps,c as fs,d as gs,T as js}from"./TemplateFormModal-C6Qftjb3.js";import{u as ys}from"./useDocumentTitle-BOGfSQQj.js";import{P as vs}from"./PayloadDetailModal-d_rZHTmv.js";import{P as Ns}from"./plus-D-Rv8PQG.js";import{S as ws}from"./search-CMCprIi4.js";import{G as Ce,R as bs,A as Cs,X as ks,T as Ts,a as de}from"./AreaChart-BbjuXgQC.js";import{L as Ss}from"./layers-osaYmonJ.js";import{A as Ps}from"./arrow-down-tXZuTgX2.js";import{M as Le}from"./more-horizontal-C_pwGMBH.js";import{T as Re}from"./trash-2-e27I1N9K.js";import{E as Ue}from"./external-link-toS3VXTH.js";import"./ui-WgsiDFN4.js";import"./mail-D42Ko5db.js";import"./trending-up-BJitD4Ir.js";import"./alert-circle-Bk1rTHL-.js";import"./loader-2-DBtHWqj4.js";import"./textarea-Dsn3FwXX.js";import"./usePayloads-Bkjkf-Fq.js";import"./clock-c878Mt3R.js";const _s=re("ArrowUpDown",[["path",{d:"m21 16-4 4-4-4",key:"f6ql7i"}],["path",{d:"M17 20V4",key:"1ejh1v"}],["path",{d:"m3 8 4-4 4 4",key:"11wl7u"}],["path",{d:"M7 4v16",key:"1glfcx"}]]);const As=re("ArrowUp",[["path",{d:"m5 12 7-7 7 7",key:"hav0vg"}],["path",{d:"M12 19V5",key:"x0mq9r"}]]);const Ms=re("LayoutGrid",[["rect",{width:"7",height:"7",x:"3",y:"3",rx:"1",key:"1g98yp"}],["rect",{width:"7",height:"7",x:"14",y:"3",rx:"1",key:"6d4xhi"}],["rect",{width:"7",height:"7",x:"14",y:"14",rx:"1",key:"nxv5o0"}],["rect",{width:"7",height:"7",x:"3",y:"14",rx:"1",key:"1bb6yr"}]]);const Ds=re("List",[["line",{x1:"8",x2:"21",y1:"6",y2:"6",key:"7ey8pc"}],["line",{x1:"8",x2:"21",y1:"12",y2:"12",key:"rjfblc"}],["line",{x1:"8",x2:"21",y1:"18",y2:"18",key:"c3b1m8"}],["line",{x1:"3",x2:"3.01",y1:"6",y2:"6",key:"1g7gq3"}],["line",{x1:"3",x2:"3.01",y1:"12",y2:"12",key:"1pjlvk"}],["line",{x1:"3",x2:"3.01",y1:"18",y2:"18",key:"28t2mc"}]]);const Ee=re("PenSquare",[["path",{d:"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7",key:"1qinfi"}],["path",{d:"M18.5 2.5a2.12 2.12 0 0 1 3 3L12 15l-4 1 1-4Z",key:"w2jsv5"}]]),ke=200,me="calc(100vh - 26rem)";function fe(s){const x=/<a[^>]*href="([^"]*)"[^>]*>([^<]*)<\/a>/gi,r=[];let c=0,n,g=0;for(;(n=x.exec(s))!==null;){n.index>c&&r.push(s.slice(c,n.index));const[,t,i]=n;r.push(e.jsx("a",{href:t,target:"_blank",rel:"noopener noreferrer",className:"text-primary hover:underline",onClick:o=>o.stopPropagation(),children:i},g++)),c=n.index+n[0].length}return c<s.length&&r.push(s.slice(c)),r.length>0?r:[s]}function Os(s){return s.replace(/<[^>]*>/g,"")}function Ie({text:s}){if(!s)return null;const x=Os(s),r=x.length>ke,c=r?s.slice(0,ke+(s.length-x.length))+"...":s;return r?e.jsxs(Se,{children:[e.jsx(Pe,{asChild:!0,children:e.jsx("p",{className:"text-sm text-muted-foreground mt-1 cursor-help line-clamp-4",children:fe(c)})}),e.jsx(_e,{className:"max-w-sm",children:e.jsx("p",{className:"text-sm",children:fe(s)})})]}):e.jsx("p",{className:"text-sm text-muted-foreground mt-1",children:fe(c)})}function Fs({templates:s,isLoading:x}){const r=s.length,c=s.filter(n=>n.deletable===!0).length;return x?e.jsxs("div",{className:"grid grid-cols-2 gap-4",children:[e.jsxs(R,{children:[e.jsx(W,{className:"pb-2",children:e.jsx(X,{className:"text-sm font-medium text-muted-foreground",children:"Total Templates"})}),e.jsx(U,{children:e.jsx(H,{className:"h-8 w-16"})})]}),e.jsxs(R,{children:[e.jsx(W,{className:"pb-2",children:e.jsx(X,{className:"text-sm font-medium text-muted-foreground",children:"Custom Templates"})}),e.jsx(U,{children:e.jsx(H,{className:"h-8 w-16"})})]})]}):e.jsxs("div",{className:"grid grid-cols-2 gap-4",children:[e.jsxs(R,{children:[e.jsx(W,{className:"pb-2",children:e.jsx(X,{className:"text-sm font-medium text-muted-foreground",children:"Total Templates"})}),e.jsx(U,{children:e.jsx("div",{className:"text-3xl font-bold text-primary",children:r})})]}),e.jsxs(R,{children:[e.jsx(W,{className:"pb-2",children:e.jsx(X,{className:"text-sm font-medium text-muted-foreground",children:"Custom Templates"})}),e.jsx(U,{children:e.jsx("div",{className:"text-3xl font-bold text-primary",children:c})})]})]})}function Gs({template:s,isSelected:x,onClick:r,onAction:c,cardRef:n}){const g=Fe(s);return e.jsxs(R,{ref:n,className:z("cursor-pointer transition-all hover:shadow-md",x&&"ring-2 ring-primary"),onClick:r,children:[e.jsxs("div",{className:"relative aspect-video bg-muted",children:[g?e.jsx("img",{src:g,alt:s.template_name,className:"w-full h-full object-cover rounded-t-lg"}):e.jsx("div",{className:"w-full h-full flex items-center justify-center",children:e.jsx("img",{src:"/images/placeholder.svg",alt:"Placeholder",className:"w-16 h-16 opacity-50"})}),c&&e.jsxs(Ae,{children:[e.jsx(Me,{asChild:!0,onClick:t=>t.stopPropagation(),children:e.jsx(k,{variant:"secondary",size:"icon",className:"absolute top-2 right-2 h-8 w-8",children:e.jsx(Le,{className:"h-4 w-4"})})}),e.jsxs(De,{align:"end",children:[e.jsxs(Q,{onClick:t=>{t.stopPropagation(),c("copy")},children:[e.jsx(Oe,{className:"mr-2 h-4 w-4"}),"Create Copy"]}),s.deletable&&e.jsxs(e.Fragment,{children:[e.jsxs(Q,{onClick:t=>{t.stopPropagation(),c("edit")},children:[e.jsx(Ee,{className:"mr-2 h-4 w-4"}),"Edit Template"]}),e.jsxs(Q,{className:"text-destructive focus:text-destructive",onClick:t=>{t.stopPropagation(),c("delete")},children:[e.jsx(Re,{className:"mr-2 h-4 w-4"}),"Delete Template"]})]})]})]})]}),e.jsx(U,{className:"p-4",children:e.jsx("div",{className:"flex items-start justify-between gap-2",children:e.jsxs("div",{className:"flex-1 min-w-0",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("h3",{className:"font-semibold truncate",children:s.template_name}),s.owner&&e.jsx("span",{className:"opacity-40",children:s.ownership==="user"?e.jsx(Y,{className:"h-3.5 w-3.5"}):e.jsx(J,{className:"h-3.5 w-3.5"})})]}),s.tags&&s.tags.length>0&&e.jsxs("div",{className:"flex flex-wrap gap-1 mt-1",children:[s.tags.slice(0,3).map(t=>e.jsx(Z,{variant:"secondary",className:"bg-primary/10 text-primary text-xs",children:t},t)),s.tags.length>3&&e.jsxs(Z,{variant:"secondary",className:"text-xs",children:["+",s.tags.length-3]})]}),e.jsx(Ie,{text:s.template_description})]})})})]})}function Ls({template:s,isSelected:x,onClick:r,onAction:c,rowRef:n}

1){const g=Fe(s);return e.jsxs(ss,{ref:n,className:z("cursor-pointer",x&&"bg-accent"),onClick:r,children:[e.jsx(oe,{className:"w-28 p-0 pl-4",children:e.jsx("img",{src:g||"/images/placeholder.svg",alt:"",className:z("w-24 h-24 rounded object-cover",!g&&"opacity-50 p-4 bg-muted")})}),e.jsxs(oe,{children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"font-medium",children:s.template_name}),s.owner&&e.jsx("span",{className:"opacity-40",children:s.ownership==="user"?e.jsx(Y,{className:"h-3.5 w-3.5"}):e.jsx(J,{className:"h-3.5 w-3.5"})})]}),s.tags&&s.tags.length>0&&e.jsxs("div",{className:"flex flex-wrap gap-1 mt-1",children:[s.tags.slice(0,3).map(t=>e.jsx(Z,{variant:"secondary",className:"bg-primary/10 text-primary text-xs",children:t},t)),s.tags.length>3&&e.jsxs(Z,{variant:"secondary",className:"text-xs",children:["+",s.tags.length-3]})]}),e.jsx(Ie,{text:s.template_description})]}),e.jsx(oe,{className:"w-24 text-center",children:e.jsxs("div",{className:"flex items-center justify-center gap-1 text-muted-foreground",children:[e.jsx(Te,{className:"h-3.5 w-3.5"}),e.jsx("span",{className:"text-sm",children:s.payload_count??"—"})]})}),e.jsx(oe,{className:"w-12",children:c&&e.jsxs(Ae,{children:[e.jsx(Me,{asChild:!0,onClick:t=>t.stopPropagation(),children:e.jsx(k,{variant:"ghost",size:"icon",className:"h-8 w-8",children:e.jsx(Le,{className:"h-4 w-4"})})}),e.jsxs(De,{align:"end",children:[e.jsxs(Q,{onClick:t=>{t.stopPropagation(),c("copy")},children:[e.jsx(Oe,{className:"mr-2 h-4 w-4"}),"Create Copy"]}),s.deletable&&e.jsxs(e.Fragment,{children:[e.jsxs(Q,{onClick:t=>{t.stopPropagation(),c("edit")},children:[e.jsx(Ee,{className:"mr-2 h-4 w-4"}),"Edit Template"]}),e.jsxs(Q,{className:"text-destructive focus:text-destructive",onClick:t=>{t.stopPropagation(),c("delete")},children:[e.jsx(Re,{className:"mr-2 h-4 w-4"}),"Delete Template"]})]})]})]})})]})}function Rs({templates:s,viewMode:x,selectedTemplateId:r,onSelectTemplate:c,onAction:n,isLoading:g,selectedRef:t}){return g?e.jsx(We,{className:"min-h-[300px]"}):s.length===0?e.jsx("div",{className:"flex items-center justify-center h-64 text-muted-foreground",children:"No templates found"}):x==="card"?e.jsx("div",{className:"grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4",children:s.map(i=>e.jsx(Gs,{template:i,isSelected:i.template_id===r,onClick:()=>c(i.template_id),onAction:o=>n(i.template_id,o),cardRef:i.template_id===r?t:void 0},i.template_id))}):e.jsx(Ze,{children:e.jsx(es,{children:s.map(i=>e.jsx(Ls,{template:i,isSelected:i.template_id===r,onClick:()=>c(i.template_id),onAction:o=>n(i.template_id,o),rowRef:i.template_id===r?t:void 0},i.template_id))})})}const Us=10,Es=10;function Is({templateId:s,templateName:x,isExpanded:r=!1,onExpandToggle:c}){const{data:n,isLoading:g}=Ge(s),[t,i]=d.useState(null),[o,y]=d.useState(1),[m,b]=d.useState("global"),[f,T]=d.useState("none"),[S,ee]=d.useState(!0),[D,O]=d.useState(!0),[V,he]=d.useState(!0),[_,E]=d.useState(new Set(["global"])),[P,F]=d.useState("average"),[A,se]=d.useState({}),[te,G]=d.useState(new Set),I=d.useRef(new Set),w=d.useRef(new Set),B=r?Es:Us;d.useMemo(()=>{y(1)},[s]);const ae=d.useMemo(()=>{const l=[{key:"global",label:"Global Average",color:N.global,category:"global"}],j=new Set,u=new Set;Object.values(A).forEach(h=>{if(!h?.metrics_history)return;const p=h.metrics_history;"global"in p&&typeof p.global=="object"&&(p.user&&Object.keys(p.user).filter(C=>C!=="average").forEach(C=>j.add(C)),p.team&&Object.keys(p.team).filter(C=>C!=="average").forEach(C=>u.add(C)))});const v=[N.user,"#06b6d4","#3b82f6","#0ea5e9"],a=[N.team,"#22c55e","#10b981","#14b8a6"];return Array.from(j).sort().forEach((h,p)=>{l.push({key:`user:${h}`,label:h,color:v[p%v.length],category:"user"})}),Array.from(u).sort().forEach((h,p)=>{l.push({key:`team:${h}`,label:h,color:a[p%a.length],category:"team"})}),l},[A]),ne=d.useCallback(l=>{E(j=>{const u=new Set(j);return u.has(l)?u.delete(l):u.add(l),u.size===0&&u.add("global"),u})},[]),ie=d.useMemo(()=>ae.filter(l=>l.category===m).map(l=>l.label),[ae,m]),le=l=>{const j=A[l];

1if(!j?.metrics_history)return null;const v=He(j,m,P,m==="overlay"?{showGlobal:S,showUser:D,showTeam:V,selectedSeries:_}:void 0);if(v.length===0)return null;const a=v[v.length-1];return m==="overlay"?a.global??a.user??a.team??a.value:a.value},L=d.useMemo(()=>{if(!n)return[];const l=[...n].sort((j,u)=>(u.added_epoch??0)-(j.added_epoch??0));return r&&f!=="none"&&l.sort((j,u)=>{const v=le(j.recipe_id),a=le(u.recipe_id);return v===null&&a===null?0:v===null?1:a===null?-1:f==="asc"?v-a:a-v}),l},[n,r,f,A,m,P]),q=L.length>0?Math.ceil(L.length/B):0,K=L.slice((o-1)*B,o*B);d.useEffect(()=>{w.current=new Set,I.current=new Set,se({}),G(new Set)},[s]);const ce=d.useCallback(async l=>{const j=l.filter(u=>!w.current.has(u)&&!I.current.has(u));if(j.length!==0){j.forEach(u=>I.current.add(u)),G(u=>new Set([...u,...j]));try{const u=await hs.getBatch(j,{metrics_history:!0});se(v=>{const a={...v};for(const h of j)a[h]=u[h]??null,w.current.add(h);return a})}catch{se(u=>{const v={...u};for(const a of j)v[a]=null,w.current.add(a);return v})}finally{j.forEach(u=>I.current.delete(u)),G(u=>{const v=new Set(u);return j.forEach(a=>v.delete(a)),v})}}},[]);return d.useEffect(()=>{if(!r||!n||n.length===0)return;const j=(f!=="none"?n:K).map(u=>u.recipe_id);ce(j)},[r,n,f,o,ce]),s?e.jsxs(e.Fragment,{children:[e.jsxs(R,{className:"h-full flex flex-col",style:{maxHeight:r?"calc(100vh - 12rem)":me},children:[e.jsxs(W,{className:"pb-2 flex-shrink-0",children:[e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(X,{className:"text-sm font-medium",children:"Payloads in Template"}),n&&n.length>0&&e.jsxs("span",{className:"text-xs text-muted-foreground flex items-center gap-1",children:[e.jsx(Te,{className:"h-3 w-3"}),n.length," payload",n.length!==1?"s":""]})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[r&&e.jsxs(e.Fragment,{children:[e.jsxs(ge,{value:m,onValueChange:l=>{b(l),F("average")},children:[e.jsx(je,{className:"w-[110px] h-8 text-xs",children:e.jsx(ye,{})}),e.jsxs(ve,{children:[e.jsx(M,{value:"global",children:e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(Ce,{className:"h-3 w-3"}),"Global"]})}),e.jsx(M,{value:"user",children:e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(Y,{className:"h-3 w-3"}),"My Metrics"]})}),e.jsx(M,{value:"team",children:e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(J,{className:"h-3 w-3"}),"Team"]})}),e.jsx(M,{value:"overlay",children:e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(Ss,{className:"h-3 w-3"}),"Overlay"]})})]})]}),(m==="user"||m==="team")&&e.jsxs(ge,{value:P,onValueChange:F,children:[e.jsx(je,{className:"w-[140px] h-8 text-xs",children:e.jsx(ye,{placeholder:"Select email"})}),e.jsxs(ve,{children:[e.jsx(M,{value:"average",children:e.jsx("span",{className:"text-muted-foreground",children:"Average"})}),ie.map(l=>e.jsx(M,{value:l,children:e.jsx("span",{className:"truncate max-w-[120px]",children:l})},l))]})]}),m==="overlay"&&e.jsxs(Xe,{children:[e.jsx(Qe,{asChild:!0,children:e.jsx(k,{variant:"ghost",size:"icon",className:"h-8 w-8",children:e.jsx(xs,{className:"h-4 w-4"})})}),e.jsx(Ye,{className:"w-84",align:"end",children:e.jsxs("div",{className:"space-y-4",children:[e.jsx("div",{className:"font-medium text-sm",children:"Overlay Settings"}),e.jsxs("div",{className:"flex flex-wrap items-center gap-x-4 gap-y-2",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(ue,{id:"show-global",checked:S,onCheckedChange:ee}),e.jsxs(pe,{htmlFor:"show-global",className:"text-xs flex items-center gap-1",children:[e.jsx(Ce,{className:"h-3 w-3"})," Global"]})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(ue,{id:"show-user",checked:D,onCheckedChange:O}),e.jsxs(pe,{htmlFor:"show-user",className:"text-xs flex items-center gap-1",children:[e.jsx(Y,{className:"h-3 w-3"})," You"]})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(ue,{id:"show-team",checked:V,onCheckedChange:he}),e.jsxs(pe,{htmlFor:"show-team",className:"text-xs flex items-center gap-1",children:[e.jsx(J,{className:"h-3 w-3"})," Team"]})]})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("p",{className:"text-xs font-medium text-muted-foreground",children:"Select addresses to display:"}),e.jsx("div",{className:"flex flex-col gap-1 max-h-40 overflow-y-auto",children:ae.map(l=>l.category==="global"&&S||l.category==="user"&&D||l.category==="team"&&V?e.jsxs("div",{className:"flex items-center gap-2 py-1 px-2 cursor-pointer hover:bg-muted/50 rounded",onClick:()=>ne(l.key),children:[e.jsx(ds,{checked:_.has(l.key)}),e.jsx("div",{className:"w-2 h-2 rounded-full flex-shrink-0",style:{backgroundColor:l.color}}),e.jsx("span",{className:"text-xs truncate",children:l.category==="global"?"Global":l.label})]},l.key):null)})]})]})})]}),e.jsxs(Se,{children:[e.jsx(Pe,{asChild:!0,children:e.jsx(k,{variant:"ghost",size:"icon",className:"h-8 w-8",onClick:()=>T(l=>l==="none"?"desc":l==="desc"?"asc":"none"),children:f==="none"?e.jsx(_s,{className:"h-4 w-4 opacity-50"}):f==="desc"?e.jsx(Ps,{className:"h-4 w-4 text-primary"}):e.jsx(As,{className:"h-4 w-4 text-primary"})})}),e.jsx(_e,{children:f==="none"?"Sort by deliverability":f==="desc"?"High to low":"Low to high"})]})]}),c&&e.jsx(k,{variant:"ghost",size:"icon",className:"h-8 w-8",onClick:c,children:r?e.jsx(we,{className:"h-4 w-4"}):e.jsx(be,{className:"h-4 w-4"})})]})]}),x&&e.jsx("p",{className:"text-sm text-muted-foreground truncate",children:x})]}),e.jsx(U,{className:"flex-1 overflow-hidden flex flex-col",children:g?e.jsx("div",{className:"space-y-2",children:[...Array(5)].map((l,j)=>e.jsxs("div",{className:"flex items-center gap-3 p-2",children:[e.jsx(H,{className:"w-8 h-8 rounded"}),e.jsx(H,{className:"h-4 flex-1"})]},j))}):K&&K.length>0?e.jsxs(e.Fragment,{children:[e.jsx("div",{className:z("flex-1 overflow-auto",r?"space-y-2":"space-y-1"),children:K.map(l=>r?e.jsx(Vs,{payload:l,payloadDetails:A[l.recipe_id],isLoading:te.has(l.recipe_id),metricSource:m,selectedEmail:P,overlayConfig:m==="overlay"?{showGlobal:S,showUser:D,showTeam:V,selectedSeries:_}:void 0,onClick:()=>i(l.recipe_id)},l.recipe_id):e.jsx(Hs,{payload:l,onClick:()=>i(l.recipe_id)},l.recipe_id))}),q>1&&e.jsxs("div",{className:"flex items-center justify-between pt-4 border-t mt

1-4 flex-shrink-0",children:[e.jsxs("span",{className:"text-xs text-muted-foreground",children:["Page ",o," of ",q]}),e.jsxs("div",{className:"flex items-center gap-1",children:[e.jsx(k,{variant:"outline",size:"sm",onClick:()=>y(l=>Math.max(1,l-1)),disabled:o===1,children:"Previous"}),e.jsx(k,{variant:"outline",size:"sm",onClick:()=>y(l=>Math.min(q,l+1)),disabled:o===q,children:"Next"})]})]})]}):e.jsx("div",{className:"flex items-center justify-center h-32 text-muted-foreground text-sm",children:"No payloads in this template"})})]}),e.jsx(vs,{payloadId:t,open:!!t,onOpenChange:l=>{l||i(null)}})]}):e.jsxs(R,{className:"h-full",style:{maxHeight:r?void 0:me},children:[e.jsx(W,{children:e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsx(X,{className:"text-sm font-medium",children:"Payloads in Template"}),c&&e.jsx(k,{variant:"ghost",size:"icon",className:"h-8 w-8",onClick:c,children:r?e.jsx(we,{className:"h-4 w-4"}):e.jsx(be,{className:"h-4 w-4"})})]})}),e.jsx(U,{children:e.jsx("div",{className:"flex items-center justify-center h-64 text-muted-foreground text-sm",children:"Select a template to view its payloads"})})]})}function Hs({payload:s,onClick:x}){return e.jsxs("div",{className:"flex items-center gap-3 p-2 rounded-md hover:bg-accent cursor-pointer group",onClick:x,children:[e.jsx("div",{className:"w-8 h-8 flex items-center justify-center",children:e.jsx("img",{src:`/images/${s.extension}.png`,alt:s.extension,className:"w-6 h-6",onError:r=>{r.target.src="/images/blank.png"}})}),e.jsx("div",{className:"flex-1 min-w-0",children:e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"text-sm truncate",children:s.name}),s.custom&&s.ownership&&e.jsx("span",{className:"opacity-40",children:s.ownership==="user"?e.jsx(Y,{className:"h-3 w-3"}):e.jsx(J,{className:"h-3 w-3"})})]})}),e.jsx(Ue,{className:"h-4 w-4 opacity-0 group-hover:opacity-50"})]})}const N={global:"hsl(var(--chart-purple))",user:"hsl(var(--primary))",team:"hsl(var(--success))"};function He(s,x,r,c){if(!s?.metrics_history)return[];const n=s.metrics_history;if("global"in n&&typeof n.global=="object"){if(x==="overlay"&&c){const t=new Map;if(c.showGlobal&&c.selectedSeries.has("global")&&n.global?.delivered)for(const[i,o]of n.global.delivered){const y=t.get(i)||{epoch:i,value:0};y.global=o,y.value=o,t.set(i,y)}if(c.showUser&&n.user){const i=n.user;for(const[o,y]of Object.entries(i))if(o!=="average"&&c.selectedSeries.has(`user:${o}`)&&y?.delivered)for(const[m,b]of y.delivered){const f=t.get(m)||{epoch:m,value:0};f.user=b,f.global||(f.value=b),t.set(m,f)}}if(c.showTeam&&n.team){const i=n.team;for(const[o,y]of Object.entries(i))if(o!=="average"&&c.selectedSeries.has(`team:${o}`)&&y?.delivered)for(const[m,b]of y.delivered){const f=t.get(m)||{epoch:m,value:0};f.team=b,!f.global&&!f.user&&(f.value=b),t.set(m,f)}}return Array.from(t.values()).sort((i,o)=>i.epoch-o.epoch)}let g=[];if(x==="global"&&n.global?.delivered)g=n.global.delivered;else if(x==="user"&&n.user){const t=n.user,i=r&&r!=="average"&&t[r]?r:Object.keys(t).find(o=>o==="average")||Object.keys(t)[0];i&&t[i]?.delivered&&(g=t[i].delivered)}else if(x==="team"&&n.team){const t=n.team,i=r&&r!=="average"&&t[r]?r:"average";t[i]?.delivered&&(g=t[i].delivered)}return g.map(([t,i])=>({epoch:t,value:i}))}if("delivered"in n&&Array.isArray(n.delivered)){const g=n.delivered;return g.map((t,i)=>({epoch:Date.now()/1e3-(g.length-i)*86400,value:typeof t=="number"?t:0}))}return[]}function zs({data:s,color:x="hsl(var(--primary))",isOverlay:r=!1}){if(s.length===0)return e.jsx("div",{className:"h-10 flex items-center justify-center text-xs text-muted-foreground",children:"No data"});const c=r&&s.some(t=>t.global!==void 0),n=r&&s.some(t=>t.user!==void 0),g=r&&s.some(t=>t.team!==void 0);return e.jsx(bs,{width:"100%",height:40,children:e.jsxs(Cs,{data:s,margin:{top:2,right:2,bottom:2,left:2},children:[e.jsxs("defs",{children:[e.jsxs("linearGradient",{id:"sparklineGradient",x1:"0",y1:"0",x2:"0",y2:"1",children:[e.jsx("stop",{offset:"5%",stopColor:x,stopOpacity:.3}),e.jsx("stop",{offset:"95%",stopColor:x,stopOpacity:0})]}),e.jsxs("linearGradient",{id:"sparklineGradientGlobal",x1:"0",y1:"0",x2:"0",y2:"1",children:[e.jsx("stop",{offset:"5%",

1stopColor:N.global,stopOpacity:.2}),e.jsx("stop",{offset:"95%",stopColor:N.global,stopOpacity:0})]}),e.jsxs("linearGradient",{id:"sparklineGradientUser",x1:"0",y1:"0",x2:"0",y2:"1",children:[e.jsx("stop",{offset:"5%",stopColor:N.user,stopOpacity:.2}),e.jsx("stop",{offset:"95%",stopColor:N.user,stopOpacity:0})]}),e.jsxs("linearGradient",{id:"sparklineGradientTeam",x1:"0",y1:"0",x2:"0",y2:"1",children:[e.jsx("stop",{offset:"5%",stopColor:N.team,stopOpacity:.2}),e.jsx("stop",{offset:"95%",stopColor:N.team,stopOpacity:0})]})]}),e.jsx(ks,{dataKey:"epoch",hide:!0}),e.jsx(Ts,{content:t=>{const{active:i,payload:o}=t;if(i&&o&&o.length){const y=o[0]?.payload?.epoch,m=y?new Date(y*1e3).toLocaleDateString("en-GB",{day:"2-digit",month:"short",year:"numeric"}):"";if(r)return e.jsxs("div",{className:"bg-popover border rounded px-2 py-1 text-xs shadow-md space-y-0.5",children:[m&&e.jsx("div",{className:"text-muted-foreground border-b pb-0.5 mb-0.5",children:m}),o.map((f,T)=>e.jsxs("div",{className:"flex items-center gap-1",children:[e.jsx("span",{className:"w-2 h-2 rounded-full",style:{backgroundColor:f.color}}),e.jsxs("span",{className:"capitalize",children:[String(f.dataKey),":"]}),e.jsxs("span",{className:"font-medium",children:[Number(f.value).toFixed(0),"%"]})]},T))]});const b=Number(o[0].value);return e.jsxs("div",{className:"bg-popover border rounded px-2 py-1 text-xs shadow-md",children:[m&&e.jsx("div",{className:"text-muted-foreground",children:m}),e.jsxs("div",{children:[b.toFixed(0),"% deliverability"]})]})}return null}}),r?e.jsxs(e.Fragment,{children:[c&&e.jsx(de,{type:"monotone",dataKey:"global",stroke:N.global,strokeWidth:1.5,fill:"url(#sparklineGradientGlobal)",isAnimationActive:!1,connectNulls:!0}),n&&e.jsx(de,{type:"monotone",dataKey:"user",stroke:N.user,strokeWidth:1.5,fill:"url(#sparklineGradientUser)",isAnimationActive:!1,connectNulls:!0}),g&&e.jsx(de,{type:"monotone",dataKey:"team",stroke:N.team,strokeWidth:1.5,fill:"url(#sparklineGradientTeam)",isAnimationActive:!1,connectNulls:!0})]}):e.jsx(de,{type:"monotone",dataKey:"value",stroke:x,strokeWidth:1.5,fill:"url(#sparklineGradient)",isAnimationActive:!1})]})})}function Vs({payload:s,payloadDetails:x,isLoading:r,metricSource:c,selectedEmail:n,overlayConfig:g,onClick:t}){const i=d.useMemo(()=>He(x??null,c,n,g),[x,c,n,g]),o=d.useMemo(()=>{if(i.length===0)return null;const m=i[i.length-1];return c==="overlay"?m.global??m.user??m.team??m.value:m.value},[i,c]),y=c==="global"?N.global:c==="user"?N.user:c==="team"?N.team:N.global;return e.jsxs("div",{className:"flex flex-col sm:flex-row sm:items-center gap-2 sm:gap-4 p-3 rounded-md hover:bg-accent cursor-pointer group border bg-card",onClick:t,children:[e.jsxs("div",{className:"flex items-center gap-3 sm:gap-4 flex-1 min-w-0",children:[e.jsx("div",{className:"w-8 h-8 sm:w-10 sm:h-10 flex items-center justify-center flex-shrink-0",children:e.jsx("img",{src:`/images/${s.extension}.png`,alt:s.extension,className:"w-6 h-6 sm:w-8 sm:h-8",onError:m=>{m.target.src="/images/blank.png"}})}),e.jsxs("div",{className:"flex-1 min-w-0",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"font-medium truncate text-sm sm:text-base",children:s.name}),s.custom&&s.ownership&&e.jsx("span",{className:"opacity-40",children:s.ownership==="user"?e.jsx(Y,{className:"h-3 w-3"}):e.jsx(J,{className:"h-3 w-3"})})]}),s.tags&&s.tags.length>0&&e.jsxs("div",{className:"flex flex-wrap gap-1 mt-1",children:[s.tags.slice(0,3).map(m=>e.jsx(Z,{variant:"secondary",className:"bg-primary/10 text-primary text-xs",children:m},m)),s.tags.length>3&&e.jsxs(Z,{variant:"secondary",className:"text-xs",children:["+",s.tags.length-3]})]})]}),e.jsx("div",{className:"sm:hidden w-12 text-right flex-shrink-0",children:r?e.jsx(H,{className:"h-5 w-10 ml-auto"}):o!==null?e.jsxs("span",{className:z("text-sm font-medium",o>=70?"text-destructive":o>=40?"text-status-blocked":"text-success"),children:[o.toFixed(0),"%"]}):e.jsx("span",{className:"text-xs text-muted-foreground",children:"—"})})]}),e.jsxs("div",{className:"flex items-center gap-2 sm:gap-4 sm:flex-1 sm:min-w-32 sm:max-w-96",children:[e.jsx("div",{className:"flex-1 min-w-0",children:r?e.jsx(H,{className:"h-8 sm:h-10 w-full"}):e.jsx(zs,{data:i,color:y,isOverlay:c==="overlay"})}),e.jsx("div",{className:"hidden sm:block w-16 text-right flex-shrink-0",children:r?e.jsx(H,{className:"h-5 w-12 ml-auto"}):o!==null?e.jsxs("span",{className:z("text-sm font-medium",o>=70?"text-destructive":o>=40?"text-status-blocked":"text-success"),children:[o.toFixed(0),"%"]}):e.jsx("span",{className:"text-xs text-muted-foreground",children:"—"})}),e.jsx(Ue,{className:"h-4 w-4 opacity-0 group-hover:opacity-50 flex-shrink-0 hidden sm:block"})]})]})}function wt(){ys("Templates"),Be();const[s,x]=Ve(),{data:r}=qe(),c=r?.subscription_status==="Enterprise",[n,g]=d.useState("card"),[t,i]=d.use

1State(""),[o,y]=d.useState(!1),m=s.get("custom"),[b,f]=d.useState(m&&["include","only","exclude"].includes(m)?m:"include"),[T,S]=d.useState(s.get("template")),ee=d.useRef(null),D=d.useRef(null),[O,V]=d.useState(!1),[he,_]=d.useState(!1),[E,P]=d.useState(null),[F,A]=d.useState(null),[se,te]=d.useState(!1),[G,I]=d.useState(null),{data:w=[],isLoading:B}=us(),{data:ae}=Ge(E?.template_id??null),ne=ps(),ie=fs(),le=gs(),L=d.useMemo(()=>{let a=[...w];if(a.sort((h,p)=>h.template_name.localeCompare(p.template_name)),b==="only"?a=a.filter(h=>h.deletable===!0):b==="exclude"&&(a=a.filter(h=>h.deletable!==!0)),t.trim()){const h=t.toLowerCase();a=a.filter(p=>p.template_name.toLowerCase().includes(h)||p.template_description?.toLowerCase().includes(h)||p.tags?.some(C=>C.toLowerCase().includes(h)))}return a},[w,b,t]),q=w.find(a=>a.template_id===T);d.useEffect(()=>{const a=s.get("template");a&&w.length>0&&w.some(p=>p.template_id===a)&&S(a)},[s,w]),d.useEffect(()=>{const a=s.get("custom");a&&["only","exclude"].includes(a)?f(a):a||f("include")},[s]),d.useEffect(()=>{if(s.get("template")&&w.length>0){const h=setTimeout(()=>{if(ee.current&&D.current){const p=ee.current,C=D.current,xe=p.getBoundingClientRect().top,ze=C.getBoundingClientRect().top-xe+p.scrollTop-16;p.scrollTo({top:Math.max(0,ze),behavior:"smooth"})}},150);return()=>clearTimeout(h)}},[s,w]),d.useEffect(()=>{!T&&!s.get("template")&&L.length>0&&S(L[0].template_id)},[L,T,s]);const K=a=>{S(a);const h=new URLSearchParams(s);h.set("template",a),x(h,{replace:!0})},ce=a=>{f(a);const h=new URLSearchParams(s);a==="include"?h.delete("custom"):h.set("custom",a),h.delete("template"),S(null),x(h,{replace:!0})},l=async(a,h)=>{const p=w.find(C=>C.template_id===a);if(p){if(h==="edit")P(p),_(!0);else if(h==="delete")I(p),te(!0);else if(h==="copy")try{const xe=(await ms.getPayloads(a)).map(Ne=>Ne.recipe_id);A({name:`${p.template_name} - Copy`,description:p.template_description||"",tags:p.tags||[],payloads:xe}),P(null),_(!0)}catch{$.error("Failed to load template data")}}},j=async a=>{try{E?(await ie.mutateAsync({id:E.template_id,data:{name:a.template_name,description:a.template_description,tags:a.tags,recipe_ids:a.payloads}}),$.success("Template updated successfully")):(await ne.mutateAsync({name:a.template_name,description:a.template_description,tags:a.tags,recipe_ids:a.payloads}),$.success("Template created successfully")),_(!1),P(null)}catch{$.error(E?"Failed to update template":"Failed to create template")}},u=async()=>{if(G)try{await le.mutateAsync(G.template_id),$.success("Template deleted successfully"),T===G.template_id&&(S(null),x({},{replace:!0}))}catch{$.error("Failed to delete template")}finally{te(!1),I(null)}},v=()=>{P(null),A(null),_(!0)};return e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsxs("div",{children:[e.jsx("h1",{className:"text-3xl font-bold tracking-tight",children:"Campaign Templates"}),e.jsx("p",{className:"text-muted-foreground",children:"Browse and manage payload templates for your campaigns"})]}),e.jsxs(k,{onClick:v,children:[e.jsx(Ns,{className:"mr-2 h-4 w-4"}),"New Template"]})]}),e.jsx(Fs,{templates:w,isLoading:B}),e.jsxs("div",{className:"flex flex-col sm:flex-row gap-4",children:[e.jsxs("div",{className:"relative flex-1",children:[e.jsx(ws,{className:"absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground"}),e.jsx(Je,{placeholder:"Filter templates using keywords such as macros, HTML smuggling, evasion etc.",value:t,onChange:a=>i(a.target.value),className:"pl-9"})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[c?e.jsxs(ge,{value:b,onValueChange:ce,children:[e.jsx(je,{className:"w-[180px]",children:e.jsx(ye,{placeholder:"Custom templates"})}),e.jsxs(ve,{children:[e.jsx(M,{value:"include",children:"Include Custom"}),e.jsx(M,{value:"only",children:"Custom Only"}),e.jsx(M,{value:"exclude",children:"Exclude Custom"})]})]}):e.jsxs(k,{variant:"outline",className:"w-[180px] justify-between text-muted-foreground",onClick:()=>y(!0),children:["Include Custom",e.jsx(Ke,{className:"h-3 w-3 text-primary ml-1"})]}),e.jsx("div",{className:"border-l h-6 mx-2"}),e.jsxs("div",{className:"flex items-center gap-1 border rounded-md p-1",children:[e.jsx(k,{variant:n==="c

1ard"?"secondary":"ghost",size:"icon",className:"h-8 w-8",onClick:()=>g("card"),children:e.jsx(Ms,{className:"h-4 w-4"})}),e.jsx(k,{variant:n==="table"?"secondary":"ghost",size:"icon",className:"h-8 w-8",onClick:()=>g("table"),children:e.jsx(Ds,{className:"h-4 w-4"})})]})]})]}),e.jsxs("div",{className:z("grid gap-6",O?"grid-cols-1":"grid-cols-1 lg:grid-cols-3"),children:[!O&&e.jsx("div",{className:"lg:col-span-2",children:e.jsx(R,{children:e.jsx(U,{ref:ee,className:"p-4 overflow-auto",style:{maxHeight:me},children:e.jsx(Rs,{templates:L,viewMode:n,selectedTemplateId:T,onSelectTemplate:K,onAction:l,isLoading:B,selectedRef:D})})})}),e.jsx("div",{className:O?"":"lg:col-span-1",style:{maxHeight:O?void 0:me},children:e.jsx(Is,{templateId:T,templateName:q?.template_name??null,isExpanded:O,onExpandToggle:()=>V(!O)})})]}),e.jsx(js,{open:he,onOpenChange:a=>{_(a),a||(P(null),A(null))},template:E,templatePayloads:ae,onSubmit:j,isSubmitting:ne.isPending||ie.isPending,initialPayloads:F?.payloads,initialValues:F?{name:F.name,description:F.description,tags:F.tags}:void 0}),e.jsx(ts,{open:se,onOpenChange:te,children:e.jsxs(as,{children:[e.jsxs(ls,{children:[e.jsx(rs,{children:"Delete Template"}),e.jsxs(ns,{children:['Are you sure you want to delete "',G?.template_name,'"? This action cannot be undone.']})]}),e.jsxs(is,{children:[e.jsx(cs,{children:"Cancel"}),e.jsx(os,{onClick:u,className:"bg-destructive text-destructive-foreground hover:bg-destructive/90",children:le.isPending?"Deleting...":"Delete"})]})]})}),e.jsx($e,{open:o,onOpenChange:y,feature:"custom templates",requiredTier:"enterprise"})]})}export{wt as Templates};