https://myliveroom.com/assets/AdminEmailTemplates-PGCRjY-X.js

1import{r as d,j as t}from"./index-DT98fQox.js";import{A as $}from"./AdminLayout-uaaqYwvj.js";import{b6 as L,b7 as D,b8 as F,b9 as I,ba as O,bb as q,bc as H,bd as P}from"./admin-BijFdg4U.js";import"./markdown-CIel6SH6.js";import"./marked.esm-r2HKmrw_.js";const a={bg:"var(--mlr-bg-card, #16182a)",border:"1px solid var(--mlr-border, rgba(255,255,255,0.1))",text:"var(--mlr-text, #e2e8f0)",sub:"var(--mlr-text-muted, #94a3b8)",cyan:"#00d4ff",green:"#34d399",purple:"#a78bfa"},p={background:"#0d0d23",border:a.border,color:a.text,borderRadius:8,padding:"8px 10px",fontSize:13,width:"100%",boxSizing:"border-box"},z=["verification","password_reset","test","welcome"],Y=()=>{const[T,j]=d.useState([]),[l,m]=d.useState({}),[s,u]=d.useState(null),[f,w]=d.useState({}),[C,_]=d.useState(""),[S,o]=d.useState(null),[b,n]=d.useState(!1),[c,g]=d.useState({key:"",address:"",name:"",password:""}),v=d.useRef(null),k=Object.keys(l),y=d.useCallback(async()=>{const e=await L();j(e?.data?.templates??[]),m(e?.data?.senders??{}),e?.data?.templates?.length&&!s&&u(e.data.templates[0])},[s]);d.useEffect(()=>{y()},[]),d.useEffect(()=>{s&&(v.current&&window.clearTimeout(v.current),v.current=window.setTimeout(async()=>{try{const e=await D({subject:s.subject,body_html:s.body_html});_(e?.data?.html??"")}catch{}},500))},[s?.subject,s?.body_html]);const x=e=>u(r=>r&&{...r,...e}),B=async()=>{if(s){n(!0),o(null);try{await H(s.id,{subject:s.subject,body_html:s.body_html,sender_type:s.sender_type,active:s.active}),o("Template saved ✓"),j(e=>e.map(r=>r.id===s.id?s:r))}catch(e){o(e?.response?.data?.message||"Save failed")}finally{n(!1)}}},R=async()=>{const e=window.prompt('Template name (e.g. "Order confirmation"):',"");if(!e)return;const r=window.prompt("Unique key (lowercase, letters/numbers/underscore — used in code):",e.toLowerCase().replace(/[^a-z0-9]+/g,"_").replace(/^_|_$/g,""));if(r){n(!0),o(null);try{const i=await q({key:r,name:e,subject:e,sender_type:"noreply",body_html:'<h1 style="margin:0 0 14px;font-size:21px;color:#0d0d23;">'+e+`</h1>
2<p style="color:#475569;">Write your email here. Use {{variables}} if needed.</p>`,variables:[]});await y(),i?.data&&u(i.data),o("Template created ✓")}catch(i){o(i?.response?.data?.message||"Create failed (key may be taken).")}finally{n(!1)}}},E=async()=>{if(!(!s||z.includes(s.key))&&window.confirm(`Delete template "${s.name}"? This can't be undone.`)){n(!0),o(null);try{await P(s.id),u(null),await y(),o("Template deleted.")}catch(e){o(e?.response?.data?.message||"Delete failed")}finally{n(!1)}}},W=async()=>{n(!0),o(null);try{const e={};["noreply","support","forum","security"].forEach(i=>{e[i]=l[i]?.address??"",f[i]&&(e[`${i}_password`]=f[i])});const r=await I(e);m(r?.data??l),w({}),o("Sender addresses saved ✓")}catch{o("Failed to save senders")}finally{n(!1)}},A=async()=>{const e=c.key.trim().toLowerCase().replace(/[^a-z0-9_]+/g,"_").replace(/^_|_$/g,"");

2if(!e||!c.address.trim()){o("A key and address are required to add a mailbox.");return}n(!0),o(null);try{const r=await O({key:e,address:c.address.trim(),name:c.name.trim(),password:c.password});m(r?.data??l),g({key:"",address:"",name:"",password:""}),o(`Mailbox “${e}” added ✓`)}catch(r){o(r?.response?.data?.message||"Could not add mailbox (key may be taken).")}finally{n(!1)}},M=async e=>{if(window.confirm(`Remove mailbox “${e}”? Templates using it move back to noreply.`)){n(!0),o(null);try{const r=await F(e);m(r?.data??l),o(r?.message||"Mailbox removed."),await y()}catch(r){o(r?.response?.data?.message||"Could not remove mailbox.")}finally{n(!1)}}};return t.jsx($,{title:"Email Templates",children:t.jsxs("div",{style:{padding:24,color:a.text,fontFamily:"'Space Grotesk', sans-serif"},children:[t.jsx("h1",{style:{fontSize:22,fontWeight:700,margin:0},children:"Email Templates"}),t.jsx("p",{style:{color:a.sub,margin:"4px 0 18px",fontSize:13},children:"Edit the emails your platform sends, set who they come from, and preview live."}),S&&t.jsx("div",{style:{background:"rgba(52,211,153,0.12)",border:"1px solid rgba(52,211,153,0.3)",color:a.green,borderRadius:8,padding:"8px 12px",fontSize:13,marginBottom:14},children:S}),t.jsxs("div",{style:{background:a.bg,border:a.border,borderRadius:12,padding:16,marginBottom:18},children:[t.jsx("div",{style:{fontWeight:700,fontSize:14,marginBottom:4},children:"Sender addresses"}),t.jsxs("div",{style:{color:a.sub,fontSize:12,marginBottom:12},children:["The From identity per email type. ",t.jsx("strong",{children:"Password is optional"}),": leave blank and emails send from your main account with this name + reply-to (works everywhere). Add the mailbox's password to send with a ",t.jsx("em",{children:"true"})," ","distinct From address (needed because your server requires From = the logged-in account)."]}),t.jsx("div",{style:{display:"grid",gridTemplateColumns:"repeat(auto-fit, minmax(280px, 1fr))",gap:14},children:k.map(e=>{const r=l[e]?.built_in!==!1;return t.jsxs("div",{style:{border:a.border,borderRadius:8,padding:12,position:"relative"},children:[t.jsxs("div",{style:{fontSize:12,color:a.text,fontWeight:600,marginBottom:6,display:"flex",alignItems:"center",gap:6},children:[t.jsx("span",{style:{textTransform:"capitalize"},children:e}),!r&&t.jsx("span",{style:{fontSize:10,color:a.cyan,border:"1px solid rgba(0,212,255,0.35)",borderRadius:5,padding:"1px 5px"},children:"added"}),t.jsxs("span",{style:{color:a.sub,fontWeight:400},children:["— ",l[e]?.name]}),!r&&t.jsx("button",{onClick:()=>M(e),title:"Remove mailbox",style:{marginLeft:"auto",background:"transparent",border:"none",color:"#f87171",cursor:"pointer",fontSize:15,lineHeight:1},children:"×"})]}),t.jsx("input",{style:{...p,marginBottom:6},value:l[e]?.address??"",placeholder:`${e}@myliveroom.com`,readOnly:!r,onChange:i=>m(h=>({...h,[e]:{...h[e]||{name:e},address:i.target.value}}))}),t.jsx("input",{style:p,type:"password",value:f[e]??"",placeholder:l[e]?.has_password?"password saved — leave blank to keep":"mailbox password (optional)",onChange:i=>w(h=>({...h,[e]:i.target.value}))})]},e)})}),t.jsx("button",{onClick:W,disabled:b,style:{marginTop:12,background:a.cyan,color:"#04121a",border:"none",borderRadius:8,padding:"8px 16px",fontWeight:700,fontSize:13,cursor:"pointer"},children:"Save senders"}),t.jsxs("div",{style:{borderTop:a.border,marginTop:16,paddingTop:14},children:[t.jsx("div",{style:{fontWeight:700,fontSize:13,marginBottom:4},children:"Add a mailbox"}),t.jsxs("div",{style:{color:a.sub,fontSize:12,marginBottom:10},children:["Create the email account in your mail server first (e.g. ",t.jsx("strong",{children:"[email protected]"}),"), then register it here. Each mailbox has its own daily send quota — spreading emails across boxes is how the send limit never collapses."]}),t.jsxs("div",{style:{display:"grid",gridTemplateColumns:"repeat(auto-fit, minmax(180px, 1fr))",gap:10,alignItems:"end"},children:[t.jsxs("label",{style:{fontSize:11,color:a.sub},children:[t.jsx("div",{style:{marginBottom:4},children:"Key (used in code)"}),t.jsx("input",{style:p,value:c.key,placeholder:"orders",onChange:e=>g(r=>({...r,key:e.target.value}))})]}),t.jsxs("label",{style:{fontSize:11,color:a.sub},children:[t.jsx("div",{style:{marginBottom:4},children:"Address"}),t.jsx("input",{style:p,value:c.address,placeholder:"[email protected]",onChange:e=>g(r=>({...r,address:e.target.value}))})]}),t.jsxs("label",{style:{fontSize:11,color:a.sub},children:[t.jsx("div",{style:{marginBottom:4},children:"Display name"}),t.jsx("input",{style:p,value:c.name,placeholder:"MyLiveRoom Orders",onChange:e=>g(r=>({...r,name:e.target.value}))})]}),t.jsxs("label",{style:{fontSize:11,color:a.sub},children:[t.jsx("div",{style:{marginBottom:4},children:"Mailbox password"}),t.jsx("input",{style:p,type:"password",value:c.password,placeholder:"its SMTP password",onChange:e=>g(r=>({...r,password:e.target.value}))})]}),t.jsx("button",{onClick:A,disabled:b,style:{background:a.green,color:"#04121a",border:"none",borderRadius:8,padding:"9px 16px",fontWeight:700,fontSize:13,cursor:"pointer",height:38},children:"+ Add"})]})]})]}),t.jsxs("div",{style:{display:"grid",gridTemplateColumns:"200px 1fr 1fr",gap:16,alignItems:"start"},children:[t.jsxs("div",{style:{background:a.bg,border:a.border,borderRadius:12,overflow:"hidden"},children:[t.jsx("button",{onClick:R,style:{display:"block",width:"100%",textAlign:"left",background:"transparent",border:"none",borderBottom:"1px solid rgba(255,255,255,0.08)",color:a.green,padding:"11px 14px",fontSize:13,cursor:"pointer",fontWeight:600},children:"+ New Template"}),T.map(e=>t.jsxs("button",{onClick:()=>u(e),style:{display:"block",width:"100%",textAlign:"left",background:s?.id===e.id?"rgba(0,212,255,0.12)":"transparent",border:"none",borderBottom:"1px solid rgba(255,255,255,0.05)",color:s?.id===e.id?a.cyan:a.text,padding:"11px 14px",fontSize:13,cursor:"pointer",fontWeight:s?.id===e.id?600:400},children:[e.name,!e.active&&t.jsx("span",{style:{color:a.sub,fontSize:11},children:" (off)"})]},e.id))]}),s&&t.jsxs("div",{style:{background:a.bg,border:a.border,borderRadius:12,padding:16,display:"flex",flexDirection:"column",gap:12},children:[t.jsxs("div",{children:[t.jsx("div",{style:{fontSize:12,color:a.sub,marginBottom:4},children:"Subject"}),t.jsx("input",{style:p,value:s.subject,onChange:e=>x({subject:e.target.value})})]}),t.jsxs("div",{style:{display:"flex",gap:12,flexWrap:"wrap"},children:[t.jsxs("label",{style:{fontSize:12,color:a.sub,flex:1,minWidth:140},children:[t.jsx("div",{style:{marginBottom:4},children:"Send from"}

2),t.jsx("select",{style:p,value:s.sender_type,onChange:e=>x({sender_type:e.target.value}),children:k.map(e=>t.jsxs("option",{value:e,children:[e," — ",l[e]?.address]},e))})]}),t.jsxs("label",{style:{fontSize:12,color:a.sub,display:"flex",alignItems:"flex-end",gap:6,paddingBottom:8},children:[t.jsx("input",{type:"checkbox",checked:s.active,onChange:e=>x({active:e.target.checked})})," Active"]})]}),s.variables&&s.variables.length>0&&t.jsxs("div",{style:{fontSize:12,color:a.sub},children:["Variables: ",s.variables.map(e=>t.jsx("code",{style:{background:"#0d0d23",color:a.purple,padding:"2px 6px",borderRadius:5,marginRight:6},children:`{{${e}}}`},e))]}),t.jsxs("div",{children:[t.jsx("div",{style:{fontSize:12,color:a.sub,marginBottom:4},children:"Body (HTML)"}),t.jsx("textarea",{style:{...p,minHeight:260,fontFamily:"monospace",lineHeight:1.5},value:s.body_html,onChange:e=>x({body_html:e.target.value})})]}),t.jsxs("div",{style:{display:"flex",gap:10,alignItems:"center"},children:[t.jsx("button",{onClick:B,disabled:b,style:{background:a.cyan,color:"#04121a",border:"none",borderRadius:8,padding:"10px 18px",fontWeight:700,fontSize:14,cursor:"pointer"},children:b?"Saving…":"Save template"}),!z.includes(s.key)&&t.jsx("button",{onClick:E,disabled:b,style:{background:"transparent",border:"1px solid rgba(248,113,113,0.4)",color:"#f87171",borderRadius:8,padding:"10px 16px",fontWeight:600,fontSize:13,cursor:"pointer"},children:"Delete"})]})]}),t.jsxs("div",{style:{background:a.bg,border:a.border,borderRadius:12,padding:12,position:"sticky",top:12},children:[t.jsx("div",{style:{fontSize:12,color:a.sub,marginBottom:8},children:"Live preview (sample data)"}),t.jsx("iframe",{title:"email preview",srcDoc:C,style:{width:"100%",height:520,border:"none",borderRadius:8,background:"#fff"}})]})]})]})})};export{Y as default};