1const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/AgentTestModal-CYtHbKkO.js","assets/index-CSw4DCa8.js","assets/vendor-BqU_0qqy.js","assets/firebase-DXQ-0c-F.js","assets/antd-D2UTkISd.js","assets/index-C29nUf_y.css","assets/AgentTestModal-TQlL9AsZ.css"])))=>i.map(i=>d[i]); 2import{m as tt,b as Ea,az as st,j as e,_ as ze,I as E,a4 as f,aC as lt,e as rt,D as ya,a1 as nt,R as Ra,J as Se,K as ot,G as We,M as V,ae as it,q as ct,W as Be,C as ka,X as wa,Q as Ke,P as dt,a2 as Fa,V as La,am as pt,aD as mt,i as vt}from"./index-CSw4DCa8.js";import{r,u as ut,R as Ie,L as ht}from"./vendor-BqU_0qqy.js";import{c as gt,s as _t,a as ja,i as ft,d as xt,C as bt}from"./callOutcome-DU_TuZ9Y.js";import{M as yt,D as Ca}from"./antd-D2UTkISd.js";import{R as kt}from"./rotate-ccw-CtXfTm0I.js";import{C as wt}from"./ConversationThread.desktop-M4rv9y3j.js";import{i as jt}from"./smsFeatureFlag-11rnqAy2.js";import{C as Ct,a as Nt}from"./ConversationTranscript-DKzYcuA4.js";import{C as St,M as zt}from"./CallerWorkingMemory-CFd1lvXU.js";import{C as It,B as Tt,H as Dt}from"./heart-CEgRyxTF.js";import{B as Mt}from"./ban-DiW-atK_.js";import{D as Na}from"./download-C3EUmv5E.js";import{A as $t}from"./arrow-left-akqGyW7-.js";import{P as Sa}from"./pencil-CZkAsZ0I.js";import{C as At}from"./circle-check-big-6fGhNf_A.js";import{L as Et}from"./link-2-CHxH-yo7.js";import"./firebase-DXQ-0c-F.js";import"./play-DD4mISL9.js";import"./useSmsComposer-DkIhxO10.js";import"./sticky-note-CMjYtKfr.js";/** 3 * @license lucide-react v0.546.0 - ISC 4 * 5 * This source code is licensed under the ISC license. 6 * See the LICENSE file in the root directory of this source tree. 7 */const Rt=[["path",{d:"M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z",key:"oel41y"}],["path",{d:"m4.243 5.21 14.39 12.472",key:"1c9a7c"}]],qe=tt("shield-ban",Rt);function Ft(t){if(!t)return"";const o=new Date(t);return Number.isNaN(o.getTime())?"":o.toLocaleDateString(void 0,{month:"short",day:"numeric"})+" · "+o.toLocaleTimeString(void 0,{hour:"numeric",minute:"2-digit"})}function Lt(t){if(!t)return"";const o=new Date(t).getTime();if(!Number.isFinite(o))return"";const c=Math.max(0,Math.round((Date.now()-o)/1e3));if(c<60)return"just now";const m=Math.round(c/60);if(m<60)return`${m}m ago`;const x=Math.round(m/60);return x<24?`${x}h ago`:`${Math.round(x/24)}d ago`}function Ot(t){const o=Number(t||0);return!o||o<1?"":`${Math.floor(o/60)}:${String(Math.floor(o%60)).padStart(2,"0")}`}function Pt(t){const o=String(t.caller||"").trim();return!o||/^unknown caller$/i.test(o)||/^\+?\d/.test(o)?t.from_number||t.From||"Unknown caller":o}function Bt({open:t,onClose:o,onRestored:c}){const m=Ea(),x=st(t),[b,P]=r.useState(null),[L,w]=r.useState(new Set),ae=async C=>{P(C);try{await E.restoreCall(C),w(z=>new Set(z).add(C)),m.invalidateQueries({queryKey:["calls"]}),c?.(C),f.success("Call restored")}catch{f.error("Failed to restore call")}finally{P(null)}},I=(x.data??[]).filter(C=>!L.has(String(C.id)));return e.jsxs(yt,{open:t,onCancel:o,footer:null,title:e.jsxs("span",{style:{display:"inline-flex",alignItems:"center",gap:8},children:[e.jsx(ze,{size:16,"aria-hidden":"true"})," Recently deleted"]}),width:560,children:[e.jsx("p",{style:{marginTop:0,color:"var(--sv-text-muted, #6b7280)",fontSize:13},children:"Calls you removed from your list. Restoring one puts it back â your minutes and billing are unaffected either way."}),x.isLoading?e.jsx("div",{style:{padding:"28px 0",textAlign:"center",color:"var(--sv-text-muted, #6b7280)"},children:"Loadingâ¦"}):I.length===0?e.jsx("div",{style:{padding:"28px 0",textAlign:"center",color:"var(--sv-text-muted, #6b7280)"},children:"Nothing here â deleted calls will show up so you can restore them."}):e.jsx("div",{style:{display:"flex",flexDirection:"column",gap:8,maxHeight:"52vh",overflowY:"auto"},children:I.map(C=>{const z=String(C.id),te=String(C.call_insights?.summary_paragraph||C.call_insights?.summary||C.summary||""),D=Ot(C.duration);return e.jsxs("div",{style:{display:"flex",alignItems:"flex-start",ga
7p:12,padding:"10px 12px",border:"1px solid var(--sv-hairline, #eee)",borderRadius:10,background:"var(--sv-cream, #fff)"},children:[e.jsxs("div",{style:{flex:1,minWidth:0},children:[e.jsx("div",{style:{fontWeight:600,fontSize:14,color:"var(--sv-ink, #111)"},children:Pt(C)}),e.jsxs("div",{style:{fontSize:12,color:"var(--sv-text-muted, #6b7280)",marginTop:2},children:[Ft(C.created_at||C.timestamp),D?` · ${D}`:"",C.deleted_at?` · deleted ${Lt(C.deleted_at)}`:""]}),te&&e.jsx("div",{style:{fontSize:12.5,color:"var(--sv-ink, #333)",marginTop:4,overflow:"hidden",display:"-webkit-box",WebkitLineClamp:2,WebkitBoxOrient:"vertical"},children:te})]}),e.jsxs("button",{type:"button",onClick:()=>{ae(z)},disabled:b===z,style:{flexShrink:0,display:"inline-flex",alignItems:"center",gap:6,border:"1px solid var(--sv-hairline, #ddd)",borderRadius:8,background:"#fff",color:"var(--sv-ink, #111)",cursor:"pointer",padding:"6px 12px",fontSize:13,fontWeight:600,opacity:b===z?.6:1},children:[e.jsx(kt,{size:13,"aria-hidden":"true"}),b===z?"Restoringâ¦":"Restore"]})]},z)})})]})}const qt=Ie.lazy(()=>mt(()=>import("./AgentTestModal-CYtHbKkO.js"),__vite__mapDeps([0,1,2,3,4,5,6])).then(t=>({default:t.AgentTestModal})));function $(t){if(!t)return"";const o=t.trim(),c=o.startsWith("+"),m=o.replace(/\D+/g,"");return m?c?`+${m}`:m:""}const Ue=100,H={unknown:{label:"Unclassified",color:"var(--sv-text-muted)",bg:"var(--sv-cream-2)",Icon:ya},prospect:{label:"Prospect",color:"oklch(0.45 0.15 240)",bg:"oklch(0.95 0.04 240)",Icon:Ra},existing_customer:{label:"Customer",color:"var(--sv-money-ink)",bg:"var(--sv-money-bg)",Icon:nt},personal:{label:"Personal",color:"oklch(0.42 0.16 290)",bg:"oklch(0.95 0.05 290)",Icon:Dt},vendor:{label:"Vendor",color:"oklch(0.45 0.16 50)",bg:"oklch(0.95 0.05 50)",Icon:Tt},spam:{label:"Spam",color:"oklch(0.45 0.18 25)",bg:"oklch(0.95 0.05 25)",Icon:Mt},support_inquiry:{label:"Support",color:"oklch(0.45 0.15 85)",bg:"oklch(0.95 0.05 85)",Icon:ya},other:{label:"Other",color:"var(--sv-ink-2)",bg:"var(--sv-cream-2)",Icon:It}},za={email:{Icon:Ke},sms:{Icon:V},transfer:{Icon:Fa},document:{Icon:La},url:{Icon:Et},web_search:{Icon:We},booking:{Icon:Ct},message:{Icon:zt}},Ia=["prospect","existing_customer","personal","vendor","support_inquiry","spam","other","unknown"];function ee(t){return xt({status:t.status,durationSeconds:t.duration,callbackStatus:t.callback_status})}function Ta(t){return bt[t]}function Qe(t){return!t||/unknown|caller|^\+?\d/.test(t.trim())?"?":t.trim().split(/\s+/).filter(Boolean).slice(0,2).map(c=>c[0]?.toUpperCase()||"").join("")||"?"}const Ut={today:"Today",yesterday:"Yesterday","this-week":"Earlier this week",earlier:"Earlier"};function Qt(t){const o=new Date,c=new Date(o.getFullYear(),o.getMonth(),o.getDate()).getTime(),m=t.getTime(),x=864e5;return m>=c?"today":m>=c-x?"yesterday":m>=c-7*x?"this-week":"earlier"}function Wt(t){if(!t||Number.isNaN(t.getTime()))return"";const o=new Date,c=new Date(o.getFullYear(),o.getMonth(),o.getDate()).getTime();return t.getTime()>=c?t.toLocaleTimeString([],{hour:"numeric",minute:"2-digit"}):t.toLocaleDateString([],{month:"short",day:"numeric"})}function Kt(t){return`${t?`Hi ${t}, `:"Hi, "}thanks for calling! Following up on your call â let me know how I can help and I'll get right back to you.`}const Ht=({inbox:t,isOutbound:o,agentId:c,agent:m})=>{const x=ut(),b=Ea(),[P,L]=r.useState(!1),[w,ae]=r.useState("all"),[I,C]=r.useState("all"),[z,te]=r.useState(""),[D,G]=r.useState(new Set),[F,ce]=r.useState(null),[se,B]=r.useState("summary"),de=jt(),Y=lt(void 0,de),pe=r.useMemo(()=>{const a=new Map;for(const l of Y.data??[])a.set(l.contact_phone_id,l);return a},[Y.data]),[q,ge]=r.useState(""),[g,k]=r.useState(!1),[N,T]=r.useState(!1),[le,d]=r.useState(!1),[S,re]=r.useState(Ue),[_e,J]=r.useState(!1),[Te,He]=r.useState(""),[fe,Ye]=r.useState(!1),[Oa,xe]=r.useState(!1),[De,Ve]=r.useState(""),[be,Ge]=r.useState(!1),Je=rt(),[Xe,ye]=r.useState({}),j=r.useMemo(()=>{const a=Je.data??[],l={};return a.forEach(s=>{const n=$(s.phone);if(!n)return;const p=(s.first_name||"").trim(),y=(s.last_name||"").trim(),h=`${p} ${y}`.trim()||(s.name||"").trim()||"";l[n]={id:s.id,caller_type:s.caller_type||"unknown",...s.caller_type_source?{caller_type_source:s.caller_type_source}:{},...h?{display_name:h}:{},...s.email?{email:s.email}:{},blocked:s.relationship_status==="blocked"}}),{...l,...Xe}},[Je.data,Xe]),Ze=r.useCallback(async(a,l)=>{const s=$(a);if(s)try{const n={caller_type:l};c&&(n.agent_id=c);const p=await E.updateCustomer(s,n);ye(y=>{const _=y[s]||j[s];return{...y,[s]:{id:p?.id||y[s]?.id||j[s]?.id||s,caller_type:p?.caller_type||l,caller_type_source:"user",..._?.display_name?{display_name:_.display_name}:{},...p?.email||_?.email?{email:p?.email||_?.email}:{},blocked:p?.relationship_status==="blocked"||l==="spam"||_?.blocked||!1}}}),l==="spam"?f.success("Marked as spam â this agent will no longer answer them"):f.success(`Marked caller as ${H[l].label}`)}catch(n){f.error(n?.response?.data?.error||n?.message||"Failed to update")}},[c]),ea=r.useCallback(async(a,l)=>{const s=$(a);if(!s)return;const n=l.trim(),p=n?n.split(/\s+/):[],y=p[0]||"",_=p.slice(1).join(" ")||"";Ye(!0);try{const h={first_name:y,last_name:_,name:n};c&&(h.agent_id=c);const O=await E.updateCustomer(s,h),W=`${y} ${_}`.trim();ye(oe=>{const K=oe[s]||j[s];return{...oe,[s]:{id:O?.id||K?.id||s,caller_type:O?.caller_type||K?.caller_type||"unknown",...K?.caller_type_source?{caller_type_source:K.caller_type_source}:{},...W?{display_name:W}:{},...O?.email||K?.email?{email:O?.email||K?.email}:{}}}}),b.invalidateQueries({queryKey:Se.customers()}),b.invalidateQueries({queryKey:["customers"]}),O?.id&&b.invalidateQueries({queryKey:Se.customer(O.id)}),f.success(W?`Contact name updated to "${W}"`:"Cleared contact name"),J(!1)}catch(h){f.error(h?.response?.data?.error||h?.message||"Failed to update contact name")}finally{Ye(!1)}},[c,j,b]),aa=r.useCallback(async(a,l)=>{const s=$(a);if(!s)return;const n=l.trim();if(n&&!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(n)){f.error("Please enter a valid email address.");return}Ge(!0);try{const p={email:n};c&&(p.agent_id=c);const y=await E.updateCustomer(s,p);ye(_=>{const h=_[s]||j[s];return{..._,[s]:{id:y?.id||h?.id||s,caller_type:h?.caller_type||"unknown",...h?.caller_type_source?{caller_type_source:h.caller_type_source}:{},...h?.display_name?{display_name:h.display_name}:{},...n?{email:n}:{}}}}),b.invalidateQueries({queryKey:Se.customers()}),b.invalidateQueries({queryKey:["customers"]}),y?.id&&b.invalidateQueries({queryKey:Se.customer(y.id)}),f.success(n?"Email updated":"Cleared email"),xe(!1)}catch(p){f.error(p?.response?.data?.error||p?.message||"Failed to update email")}finally{Ge(!1)}},[c,j,b]),ke=r.useCallback(a=>{const l=$(a);if(!l)return;const s=j[l];x(`/contacts/${encodeURIComponent(s?.id||l)}`)},[j,x]),Me=r.useCallback(a=>gt({outcome:ee(a),callbackStatus:a.callback_status,hasUnansweredQuestion:Array.isArray(a.call_insights?.unanswered_questions)&&a.call_insights.unanswered_questions.length>0}),[]),U=r.useMemo(()=>{const a=t.allItems??[],l=z.trim().toLowerCase();return a.filter(s=>{if(w==="callback"){if(!Me(s))return!1}else if(w==="handled"){if(ee(s)!=="handled")return!1}else if(w==="short"){if(ee(s)!=="short")return!1}else if(w==="failed"){if(s.status!=="failed")return!1}else if(w==="week"){const p=new Date;if(p.setDate(p.getDate()-7),s.timestamp<p)return!1}return l?`${s.caller} ${s.from_number||""} ${s.summary||""} ${s.notes||""}`.toLowerCase().includes(l):!0})},[t.allItems,w,z]),ta=r.useMemo(()=>{const a=new Map;for(const l of t.allItems??[]){const s=$(l.from_number);if(!s)continue;const n=a.get(s);(!n||l.timestamp.getTime()>n.timestamp.getTime())&&a.set(s,l)}return a},[t.allItems]),$e=r.useMemo(()=>
7{if(I==="calls")return[];if(w!=="all"&&w!=="week"&&I!=="texts")return[];const l=z.trim().toLowerCase(),s=Date.now()-7*864e5,n=[];for(const p of Y.data??[]){const y=p.last_message_at_ms||0;w==="week"&&y<s||l&&!`${j[$(p.contact_phone)]?.display_name||""} ${p.contact_phone} ${p.last_message_preview||""}`.toLowerCase().includes(l)||n.push({kind:"sms",sortMs:y,at:new Date(y),thread:p})}return n},[Y.data,de,I,w,z,j]),Pa=r.useMemo(()=>{const l=[...I==="texts"?[]:U.map(n=>({kind:"call",sortMs:n.timestamp.getTime(),at:n.timestamp,call:n})),...$e].sort((n,p)=>p.sortMs-n.sortMs).slice(0,S),s=[{key:"today",items:[]},{key:"yesterday",items:[]},{key:"this-week",items:[]},{key:"earlier",items:[]}];for(const n of l)s.find(p=>p.key===Qt(n.at)).items.push(n);return s.filter(n=>n.items.length>0)},[U,$e,I,S]),me=(I==="texts"?0:U.length)+$e.length,sa=r.useMemo(()=>(Y.data??[]).reduce((a,l)=>a+(l.unread_count??0),0),[Y.data]),la=r.useCallback(a=>{ce(null),t.setSelectedItemId(a),B("summary")},[t]),ra=r.useCallback(a=>{ce(a.contact_phone_id);const l=ta.get($(a.contact_phone));t.setSelectedItemId(l?l.id:null),B("texts")},[t,ta]),Ba=r.useCallback(()=>{ce(null),t.setSelectedItemId(null)},[t]),na=r.useMemo(()=>(t.allItems??[]).filter(a=>ee(a)==="handled").length,[t.allItems]),oa=r.useMemo(()=>(t.allItems??[]).filter(a=>ee(a)==="short").length,[t.allItems]),ia=r.useMemo(()=>(t.allItems??[]).filter(a=>a.status==="failed").length,[t.allItems]),ca=r.useMemo(()=>(t.allItems??[]).filter(a=>Me(a)).length,[t.allItems,Me]);r.useEffect(()=>{t.selectedItem&&ge(t.selectedItem.notes||"")},[t.selectedItemId]);const[we,da]=r.useState(!1),qa=r.useCallback(async()=>{if(!(!t.selectedItem||we)){da(!0);try{const a=await E.initiateCallback(t.selectedItem.id);a.success?f.success("Calling you now â pick up and weâll connect you to the caller."):a.code==="no_callback_number"?f.error(a.error||"Add a callback number in this agent's Essentials tab first."):a.code==="feature_disabled"?f.error("Call back isnât enabled yet."):f.error(a.error||"Could not start the callback.")}catch{f.error("Could not start the callback.")}finally{da(!1)}}},[t,we]),Ua=r.useCallback(async()=>{if(!t.selectedItem)return;const a=t.selectedItem,l=a.callback_status==="called_back"?"none":"called_back";try{await E.patchCall(a.id,{callback_status:l}),t.updateItem(a.id,{callback_status:l,callback_at:l==="called_back"?new Date:void 0}),f.success(l==="called_back"?"Marked as called back":"Callback status cleared")}catch{f.error("Failed to update callback status")}},[t]),Qa=r.useCallback(async()=>{if(t.selectedItem){k(!0);try{await E.patchCall(t.selectedItem.id,{notes:q}),t.updateItem(t.selectedItem.id,{notes:q});const a=$(t.selectedItem.from_number),l=a?j[a]:void 0;if(l?.id&&q.trim())try{await E.addCustomerNote(l.id,q.trim())}catch{}f.success("Notes saved")}catch{f.error("Failed to save notes")}finally{k(!1)}}},[t,q,j]),pa=r.useCallback(async a=>{try{await E.deleteCall(a),t.removeItem(a),_t("Call deleted",()=>{(async()=>{try{await E.restoreCall(a),await t.refresh()}catch{f.error("Couldn't restore the call")}})()})}catch{f.error("Failed to delete call")}},[t]),je=r.useCallback((a,l,s)=>{ye(n=>{const p=n[a]||j[a];return{...n,[a]:{...p||{id:l,caller_type:"unknown"},id:l,blocked:s}}})},[j]),Wa=r.useCallback(async()=>{const a=t.selectedItem;if(!a?.from_number)return;const l=$(a.from_number),s=l?j[l]:void 0;if(!s?.id){f.info("Categorize this caller first (that saves a contact), then block them.");return}const n=s.display_name||a.caller||"this caller",p=a.agent_id||c||void 0;if(window.confirm(`Block ${n}? This agent will no longer answer their calls.`))try{await E.blockCustomer(s.id,"Blocked from call detail",p),je(l,s.id,!0),f.success("Caller blocked â this agent will no longer answer them")}catch{f.error("Failed to block caller")}},[t,j,c,je]),Ka=r.useCallback(async()=>{const a=t.selectedItem;if(!a?.from_number)return;const l=$(a.from_number),s=l?j[l]:void 0;if(!s?.id)return;const n=a.agent_id||c||void 0;try{await E.unblockCustomer(s.id,n),je(l,s.id,!1),f.success("Caller unblocked")}catch{f.error("Failed to unblock caller")}},[t,j,c,je]),Ha=r.useCallback(()=>{const a=U.filter(h=>D.has(h.id));if(a.length===0)return;const l=["Caller","Date/Time","Duration","Status","Callback Status","Notes","Summary"],s=a.map(h=>
7[h.caller,h.timestamp.toLocaleString(),h.durationFormatted,h.status,h.callback_status||"none",(h.notes||"").replace(/"/g,'""'),(h.summary||"").replace(/"/g,'""')]),n=[l.join(","),...s.map(h=>h.map(O=>`"${O}"`).join(","))].join(` 8`),p=new Blob([n],{type:"text/csv;charset=utf-8;"}),y=URL.createObjectURL(p),_=document.createElement("a");_.href=y,_.download=`calls-${new Date().toISOString().slice(0,10)}.csv`,_.click(),URL.revokeObjectURL(y),T(!1),G(new Set)},[U,D]),i=t.selectedItem,A=i?ee(i):null,ne=!!F,ve=ne?pe.get(F):void 0,Ae=!!i||ne&&!!ve,v=i?.from_number||ve?.contact_phone||"";r.useEffect(()=>{t.selectedItemId&&!F&&B("summary")},[t.selectedItemId,F]);const Ee=$(v),Q=Ee?j[Ee]:void 0,ma=ot(Q?.id),va=ma.data||void 0,Ce=(i?.caller||"").trim(),Ya=!Ce||/^unknown caller$/i.test(Ce)||/^\+?\d/.test(Ce),X=Q?.display_name||(Ya?"":Ce),Va=Qe(X||i?.caller||v||"?"),Re=!X,Ga=(X||"").trim().split(/\s+/)[0]||"",Ne=Q?.email||"",Fe=i?.call_insights||{},ua=(Fe.caller_intent||"").trim(),Le=A?ft(A):!1,ha=Q?.caller_type==="spam"||!!Q?.blocked,ga=(Array.isArray(Fe.unanswered_questions)?Fe.unanswered_questions:[]).filter(a=>typeof a=="string"&&a.trim().length>0);v&&`${v.replace(/[^\d+]/g,"")}${encodeURIComponent(Kt(Ga))}`;const ue=ne?F:Q?.id||Ee,_a=ne?ve:ue?pe.get(ue):void 0,Oe=!!v;let M=se;M==="texts"&&!Oe&&(M="summary"),(M==="summary"||M==="transcript")&&!i&&ne&&(M="texts");const fa=r.useMemo(()=>{const a=[];if(!i||ha)return a;const l=(i.call_insights?.recommended_callback_action||"").trim();l&&a.push(l),A==="short"?a.push("Call them back â they hung up before the conversation got going"):A==="failed"&&a.push("Call them back â the call didnât connect"),i.callback_status!=="called_back"&&a.push("Text a quick follow-up to re-engage");const s=i.call_insights?.questions_and_answers??[];return Array.isArray(s)&&s.some(n=>!n.response||/don.?t know|not sure|unsure|couldn.?t/i.test(String(n.response)))&&a.push("Answer a question the agent couldnât"),a.length||a.push("Send a quick thank-you / follow-up text"),a},[i,A,ha]),Ja=[{key:"all",lbl:"All"},{key:"callback",lbl:"Needs callback",...ca>0?{ct:ca}:{}},{key:"handled",lbl:"Conversations",...na>0?{ct:na}:{}},{key:"short",lbl:"No conversation",...oa>0?{ct:oa}:{}},{key:"failed",lbl:"Didn't connect",...ia>0?{ct:ia}:{}},{key:"week",lbl:"This week"}];return e.jsxs("div",{className:"sv2-calls-shell",children:[e.jsxs("div",{className:`sv2-calls-list${Ae?" sv2-calls-list--hidden-mobile":""}`,children:[e.jsxs("div",{className:"sv2-calls-sticky",children:[e.jsxs("div",{className:"sv2-calls-bar",children:[e.jsxs("div",{className:"sv2-calls-search",children:[e.jsx(We,{size:14,"aria-hidden":"true"}),e.jsx("input",{type:"text",value:z,onChange:a=>te(a.target.value),placeholder:"Search calls & textsâ¦"})]}),!N&&U.length>0&&e.jsxs("button",{type:"button",className:"sv2-calls-btn",onClick:()=>T(!0),children:[e.jsx(Na,{size:13,"aria-hidden":"true"})," Export"]}),!N&&e.jsxs("button",{type:"button",className:"sv2-calls-btn",onClick:()=>d(!0),title:"View and restore recently deleted calls",children:[e.jsx(ze,{size:13,"aria-hidden":"true"})," Recently deleted"]})]}),e.jsx("div",{className:"sv2-calls-channel",role:"tablist","aria-label":"Filter by channel",children:[{key:"all",lbl:"All"},{key:"calls",lbl:"Calls"},{key:"texts",lbl:"Texts"}].map(a=>e.jsxs("button",{type:"button",role:"tab","aria-selected":I===a.key,className:`sv2-calls-channel__btn${I===a.key?" sv2-calls-channel__btn--on":""}`,onClick:()=>C(a.key),children:[a.key==="texts"&&e.jsx(V,{size:12,"aria-hidden":"true"}),a.lbl,a.key==="texts"&&sa>0&&e.jsx("span",{className:"sv2-calls-channel__ct",children:sa})]},a.key))}),I!=="texts"&&e.jsx("div",{className:"sv2-calls-chips",children:Ja.map(a=>e.jsxs("button",{type:"button",className:`sv2-calls-chip${w===a.key?" sv2-calls-chip--on":""}`,onClick:()=>ae(a.key),children:[a.lbl,a.ct!==void 0&&e.jsx("span",{className:"sv2-calls-chip__ct",children:a.ct})]},a.key))}),N&&e.jsxs("div",{className:"sv2-calls-csv-bar",children:[e.jsx("input",{type:"checkbox",checked:U.length>0&&D.size===U.length,onChange:a=>{a.target.checked?G(new Set(U.map(l=>l.id))):G(new Set)},"aria-label":"Select all"}),e.jsx("span",{children:D.size>0?`${D.size} selected`:"Select all"}),e.jsx("div",{style:{flex:1}}),D.size>0&&e.jsxs("button",{type:"button",className:"sv2-calls-btn sv2-calls-btn--primary",onClick:Ha,children:[e.jsx(Na,{size:13,"aria-hidden":"true"})," Download spreadsheet"]}),e.jsx("button",{type:"button",className:"sv2-calls-btn",onClick:()=>{T(!1),G(new Set)},children:"Cancel"})]})]}),t.loading&&(t.allItems?.length??0)===0?e.jsx("div",{className:"sv2-calls-empty",children:"Loadingâ¦"}):t.error&&(t.allItems?.length??0)===0?e.jsxs("div",{className:"sv2-calls-empty",children:[e.jsx("h3",{className:"sv2-calls-empty__h",children:"Couldn't load your calls"}),e.jsx("p",{className:"sv2-calls-empty__sub",children:"Something went wrong on our end. Refresh to try again."}),e.jsx("div",{className:"sv2-calls-empty__actions",children:e.jsx("button",{type:"button",className:"sv2-calls-btn sv2-calls-btn--primary",onClick:()=>{t.refresh()},children:"Refresh"})})]}):me===0?I==="texts"?e.jsxs("div",{className:"sv2-calls-empty",children:[e.jsx("h3",{className:"sv2-calls-empty__h",children:"No text conversations yet"}),e.jsx("p",{className:"sv2-calls-empty__sub",children:"When a caller texts your agentâs number, the conversation shows up here â reply right from this page."})]}):w==="all"&&!z.trim()?e.jsxs("div",{className:"sv2-calls-empty sv2-calls-empty--activate",children:[e.jsx("h3",{className:"sv2-calls-empty__h",children:"No calls yet â try it yourself"}),m?.phoneNumber?e.jsxs(e.Fragment,{children:[e.jsx("p",{className:"sv2-calls-empty__sub",children:"Call it from your cell right now:"}),e.jsxs("div",{className:"sv2-calls-empty__num",children:[e.jsx("a",{href:`tel:${m.phoneNumber.replace(/[^\d+]/g,"")}`,children:m.phoneNumber}),e.jsx("button",{type:"button",className:"sv2-calls-empty__copy",title:"Copy number",onClick:()=>{navigator.clipboard?.writeText(m.phoneNumber||"").then(()=>f.success("Number copied"),()=>{})},children:e.jsx(it,{size:14,"aria-hidden":"true"})})]})]}):e.jsx("p",{className:"sv2-calls-empty__sub",children:"Give this agent a number, then forward your line â calls will show up here."}),e.jsx("div",{className:"sv2-calls-empty__actions",children:m?.id&&e.jsxs("button",{type:"button",className:"sv2-calls-btn sv2-calls-btn--primary",onClick:()=>L(!0),children:[e.jsx(ct,{size:13,"aria-hidden":"true"})," Test in your browser"]})}),e.jsx("p",{className:"sv2-calls-empty__hint",children:"The in-browser test is free and doesnât use your plan minutes."})]}):e.jsx("div",{className:"sv2-calls-empty",children:"No calls or texts match this filter."}):e.jsxs("div",{className:"sv2-calls-table",children:[Pa.map(a=>e.jsxs("div",{className:"sv2-call-group",children:[e.jsxs("div",{className:"sv2-call-group-hd",children:[e.jsx("span",{children:Ut[a.key]}),e.jsx("span",{className:"sv2-call-group-hd__ct",children:a.items.length})]}
8),a.items.map(l=>{if(l.kind==="sms"){const u=l.thread,R=j[$(u.contact_phone)]?.display_name||"",Pe=!R,ie=u.unread_count??0,et=u.last_message_direction==="outbound",ba=(u.last_message_preview||"").trim(),at=F===u.contact_phone_id;return e.jsxs("div",{role:"button",tabIndex:0,className:`sv2-call-row sv2-call-row--sms${at?" sv2-call-row--on":""}${ie>0?" sv2-call-row--needs-action":""}`,onClick:()=>ra(u),onKeyDown:he=>{(he.key==="Enter"||he.key===" ")&&(he.preventDefault(),ra(u))},children:[e.jsx("div",{className:"sv2-call-row__avatar sv2-call-row__avatar--sms","aria-hidden":"true",children:Pe?e.jsx(V,{size:16}):Qe(R)}),e.jsxs("div",{className:"sv2-call-row__body",children:[e.jsxs("div",{className:"sv2-call-row__l1",children:[e.jsx("span",{className:`sv2-call-row__nm${Pe?" sv2-call-row__nm--anon":""}`,children:Pe?u.contact_phone:R}),e.jsx("span",{className:"sv2-call-row__time",children:Wt(l.at)})]}),ba&&e.jsxs("div",{className:`sv2-call-row__gist${ie>0?" sv2-call-row__gist--unread":""}`,children:[et&&e.jsx("span",{className:"sv2-call-row__gist-you",children:"You: "}),ba]}),e.jsxs("div",{className:"sv2-call-row__foot",children:[e.jsxs("span",{className:"sv2-call-row__pill sv2-call-row__pill--sms",children:[e.jsx(V,{size:10,"aria-hidden":"true"})," Text"]}),ie>0&&e.jsxs("span",{className:"sv2-call-row__pill sv2-call-row__pill--unread",title:`${ie} unread text message${ie===1?"":"s"}`,children:[ie," new"]}),u.contact_phone&&e.jsxs("button",{type:"button",className:"sv2-call-row__open",onClick:he=>{he.stopPropagation(),ke(u.contact_phone)},title:"Open contact record","aria-label":"Open contact record",children:[e.jsx(Be,{size:11,"aria-hidden":"true"})," Open contact"]})]})]})]},`sms:${u.contact_phone_id}`)}const s=l.call,n=ee(s),p=t.selectedItemId===s.id&&!F,y=$(s.from_number),_=y?j[y]:void 0,h=(s.caller||"").trim(),O=!h||/^unknown caller$/i.test(h)||/^\+?\d/.test(h),W=_?.display_name||(O?"":h),oe=!W,K=s.callback_status!=="called_back"&&(s.status==="short"||s.status==="failed"),xa=_?.caller_type||"unknown",Z=H[xa],Xa=Z.Icon,Za=Ia.map(u=>({key:u,label:e.jsxs("span",{style:{display:"inline-flex",alignItems:"center",gap:6,fontSize:12,color:H[u].color,fontWeight:600},children:[Ie.createElement(H[u].Icon,{size:11}),H[u].label,xa===u?" â¢":""]}),onClick:()=>Ze(s.from_number||"",u)}));return e.jsxs("div",{role:"button",tabIndex:0,className:`sv2-call-row${p?" sv2-call-row--on":""}${K?" sv2-call-row--needs-action":""}`,onClick:()=>la(s.id),onKeyDown:u=>{(u.key==="Enter"||u.key===" ")&&(u.preventDefault(),la(s.id))},children:[N&&e.jsx("input",{type:"checkbox",checked:D.has(s.id),onChange:u=>{u.stopPropagation();const R=new Set(D);u.target.checked?R.add(s.id):R.delete(s.id),G(R)},onClick:u=>u.stopPropagation(),className:"sv2-call-row__cb","aria-label":`Select call from ${s.caller}`}),e.jsx("div",{className:`sv2-call-row__avatar sv2-call-row__avatar--${n}`,"aria-hidden":"true",children:Qe(W||s.caller)}),e.jsxs("div",{className:"sv2-call-row__body",children:[e.jsxs("div",{className:"sv2-call-row__l1",children:[e.jsx("span",{className:`sv2-call-row__nm${oe?" sv2-call-row__nm--anon":""}`,children:oe?"Unknown caller":W}),e.jsx("span",{className:"sv2-call-row__time",children:s.timeFormatted})]}),s.summary&&e.jsx("div",{className:"sv2-call-row__gist",children:s.summary}),e.jsxs("div",{className:"sv2-call-row__foot",children:[_?.blocked&&e.jsxs("span",{className:"sv2-call-row__pill",title:"Blocked â this agent won't answer this caller",style:{background:"rgba(239,68,68,0.12)",color:"#ef4444",fontWeight:700,display:"inline-flex",alignItems:"center",gap:3},children:[e.jsx(qe,{size:10,"aria-hidden":"true"})," Blocked"]}),(()=>{const R=pe.get(_?.id||y)?.unread_count??0;return R<=0?null:e.jsxs("span",{className:"sv2-call-row__pill",title:`${R} unread text message${R===1?"":"s"} from this contact`,style:{background:"rgba(37,99,235,0.12)",color:"#2563eb",fontWeight:700,display:"inline-flex",alignItems:"center",gap:3},children:[e.jsx(V,{size:10,"aria-hidden":"true"})," ",R," new text",R===1?"":"s"]})})(),e.jsx("span",{className:`sv2-call-row__pill sv2-call-row__pill--${n}`,children:Ta(n)}),e.jsx(Ca,{menu:{items:Za},trigger:["click"],placement:"bottomLeft",children:e.jsxs("button",{type:"button",className:"sv2-call-row__ct",style:{background:Z.bg,color:Z.color},onClick:u=>u.stopPropagation(),title:_?.caller_type_source==="user"?`${Z.label} â set by you · click to change`:`${Z.label} â click to categorize`,"aria-label":`Caller type: ${Z.label}. Click to change.`,children:[e.jsx(Xa,{size:10,"aria-hidden":"true"}),Z.label]})}),e.jsx("span",{className:"sv2-call-row__dur",children:s.durationFormatted}),s.callback_status==="called_back"&&e.jsx("span",{className:"sv2-call-row__cb-done",children:"â Called back"}),K&&e.jsx("span",{className:"sv2-call-row__cb-needed",children:"Needs callback"}),s.from_number&&e.jsxs("button",{type:"button",className:"sv2-call-row__open",onClick:u=>{u.stopPropagation(),ke(s.from_number)},title:"Open contact record","aria-label":"Open contact record",children:[e.jsx(Be,{size:11,"aria-hidden":"true"})," Open contact"]})]}),s.recording_status==="available"&&s.call_sid&&e.jsx("div",{style:{marginTop:6},onClick:u=>u.stopPropagation(),children:e.jsx(ja,{callSid:s.call_sid},s.call_sid)})]}),e.jsx("button",{type:"button",className:"sv2-call-row__del",onClick:u=>{u.stopPropagation(),pa(s.id)},title:"Delete this call from your list","aria-label":`Delete call from ${oe?"unknown caller":W}`,children:e.jsx(ze,{size:13,"aria-hidden":"true"})})]},s.id)})]},a.key)),me>S&&e.jsxs("button",{type:"button",className:"sv2-calls-load-more",onClick:()=>re(a=>a+Ue),children:["Show ",Math.min(Ue,me-S)," older",e.jsxs("span",{className:"sv2-calls-load-more__ct",children:["(",Math.min(S,me)," of ",me," shown)"]})]})]})]}),e.jsx("div",{className:`sv2-call-detail${Ae?" sv2-call-detail--active-mobile":""}`,children:Ae?e.jsxs(e.Fragment,{children:[e.jsxs("button",{className:"sv2-call-detail__back",onClick:Ba,children:[e.jsx($t,{size:14,"aria-hidden":"true"})," Back"]}),e.jsxs("div",{className:"sv2-call-detail__hd",children:[e.jsx("div",{className:`sv2-call-detail__avatar sv2-call-detail__avatar--${A||"sms"}`,"aria-hidden":"true",children:!i&&Re?e.jsx(V,{size:22}):Va}),e.jsxs("div",{className:"sv2-call-detail__who",children:[_e?e.jsxs("div",{className:"sv2-call-detail__name-edit",style:{display:"flex",alignItems:"center",gap:6},children:[e.jsx("input",{type:"text",autoFocus:!0,className:"sv2-call-detail__name-input",value:Te,placeholder:"Add a nameâ¦",onChange:a=>He(a.target.value),onKeyDown:a=>{a.key==="Enter"?(a.preventDefault(),!fe&&v&&ea(v,Te)):a.key==="Escape"&&(a.preventDefault(),J(!1))},disabled:fe,style:{font:"inherit",fontSize:22,fontWeight:600,padding:"4px 8px",border:"1.5px solid var(--sv-hairline)",borderRadius:8,background:"var(--sv-bg-primary)",color:"var(--sv-ink)",minWidth:"min(220px, calc(100vw - 120px))",flex:"1 1 auto",maxWidth:"100%"}}),e.jsx("button",{type:"button",onClick:()=>v&&ea(v,Te),disabled:fe,title:"Save name","aria-label":"Save name",className:"sv2-call-detail__btn sv2-call-detail__btn--primary",style:{padding:"6px 10px"},children:e.jsx(ka,{size:14,"aria-hidden":"true"})}),e.jsx("button",{type:"button",onClick:()=>J(!1),disabled:fe,title:"Cancel","aria-label":"Cancel name edit",className:"sv2-call-detail__btn sv2-call-detail__btn--ghost",style:{padding:"6px 10px"},children:e.jsx(wa,{size:14,"aria-hidden":"true"})})]}):e.jsxs("h2",{className:Re?"sv2-call-detail__h2 sv2-call-detail__h2--anon":"sv2-call-detail__h2",style:{display:"inline-flex",alignItems:"center",gap:8,cursor:v?"pointer":"default"},onClick:()=>{v&&(He(X||""),J(!0))}
8,title:v?"Click to edit contact name":void 0,children:[Re?"Unknown caller":X,v&&e.jsx(Sa,{size:14,"aria-hidden":"true",style:{color:"var(--sv-text-muted)",opacity:.7}})]}),e.jsxs("div",{className:"sv2-call-detail__sub",children:[v&&e.jsx("span",{className:"sv2-call-detail__num",children:v}),i?e.jsxs(e.Fragment,{children:[v&&e.jsx("span",{className:"sv2-call-detail__sep",children:"·"}),e.jsx("span",{children:i.timeFormatted}),e.jsx("span",{className:"sv2-call-detail__sep",children:"·"}),e.jsx("span",{children:i.durationFormatted})]}):e.jsxs(e.Fragment,{children:[v&&e.jsx("span",{className:"sv2-call-detail__sep",children:"·"}),e.jsx("span",{children:"Text conversation"})]})]}),e.jsx("div",{className:"sv2-call-detail__sub",style:{marginTop:4},children:Oa?e.jsxs("span",{style:{display:"inline-flex",alignItems:"center",gap:6},children:[e.jsx(Ke,{size:13,"aria-hidden":"true",style:{opacity:.7}}),e.jsx("input",{type:"email",autoFocus:!0,value:De,placeholder:"[email protected]",autoCapitalize:"none",autoCorrect:"off",onChange:a=>Ve(a.target.value),onKeyDown:a=>{a.key==="Enter"?(a.preventDefault(),!be&&v&&aa(v,De)):a.key==="Escape"&&(a.preventDefault(),xe(!1))},disabled:be,style:{font:"inherit",fontSize:13,padding:"4px 8px",border:"1.5px solid var(--sv-hairline)",borderRadius:8,background:"var(--sv-bg-primary)",color:"var(--sv-ink)",minWidth:"min(240px, calc(100vw - 160px))"}}),e.jsx("button",{type:"button",onClick:()=>v&&aa(v,De),disabled:be,title:"Save email","aria-label":"Save email",className:"sv2-call-detail__btn sv2-call-detail__btn--primary",style:{padding:"4px 8px"},children:e.jsx(ka,{size:13,"aria-hidden":"true"})}),e.jsx("button",{type:"button",onClick:()=>xe(!1),disabled:be,title:"Cancel","aria-label":"Cancel email edit",className:"sv2-call-detail__btn sv2-call-detail__btn--ghost",style:{padding:"4px 8px"},children:e.jsx(wa,{size:13,"aria-hidden":"true"})})]}):e.jsxs("span",{style:{display:"inline-flex",alignItems:"center",gap:6,cursor:v?"pointer":"default",color:Ne?"inherit":"var(--sv-text-muted)"},onClick:()=>{v&&(Ve(Ne||""),xe(!0))},title:v?"Click to edit email":void 0,children:[e.jsx(Ke,{size:13,"aria-hidden":"true",style:{opacity:.7}}),e.jsx("span",{style:{fontStyle:Ne?"normal":"italic"},children:Ne||"Add email"}),v&&e.jsx(Sa,{size:12,"aria-hidden":"true",style:{color:"var(--sv-text-muted)",opacity:.7}})]})})]}),A?e.jsx("span",{className:`sv2-call-detail__outcome sv2-call-detail__outcome--${A}`,children:Ta(A)}):e.jsxs("span",{className:"sv2-call-detail__outcome sv2-call-detail__outcome--sms",children:[e.jsx(V,{size:11,"aria-hidden":"true"})," Text"]})]}),e.jsxs("div",{className:"sv2-call-detail__actions",children:[v&&e.jsxs("a",{href:`tel:${v}`,className:`sv2-call-detail__btn${A==="short"||A==="failed"?" sv2-call-detail__btn--primary":""}`,onClick:a=>a.stopPropagation(),children:[e.jsx(dt,{size:13,"aria-hidden":"true"}),A==="short"||A==="failed"?"Call back now":"Call back"]}),i&&v&&e.jsxs("button",{type:"button",className:"sv2-call-detail__btn",onClick:qa,disabled:we,title:"We ring your callback number, then connect you to the caller â they only ever see your agent number.",children:[e.jsx(Fa,{size:13,"aria-hidden":"true"}),we?"Calling youâ¦":"Call back as agent"]}),v&&!de,i&&e.jsxs("button",{type:"button",className:`sv2-call-detail__btn${i.callback_status==="called_back"?" sv2-call-detail__btn--active":""}`,onClick:Ua,children:[e.jsx(At,{size:13,"aria-hidden":"true"}),i.callback_status==="called_back"?"Called back":"Mark called back"]}),v&&e.jsxs("button",{type:"button",className:"sv2-call-detail__btn",onClick:()=>ke(v),title:"Open this caller's contact record",children:[e.jsx(Be,{size:13,"aria-hidden":"true"})," Open contact"]}),v&&(()=>{const a=$(v),l=a?j[a]:void 0,s=l?.caller_type||"unknown",n=H[s],p=n.Icon,y=Ia.map(_=>({key:_,label:e.jsxs("span",{style:{display:"inline-flex",alignItems:"center",gap:6,fontSize:12,color:H[_].color,fontWeight:600},children:[Ie.createElement(H[_].Icon,{size:11}),H[_].label,s===_?" â¢":""]}),onClick:()=>Ze(v,_)}));return e.jsx(Ca,{menu:{items:y},trigger:["click"],placement:"bottomRight",children:e.jsxs("button",{type:"button",className:"sv2-call-detail__btn",style:{background:n.bg,color:n.color,borderColor:"transparent"},title:l?.caller_type_source==="user"?`Categorized as ${n.label} â click to change`:"Categorize this caller",children:[e.jsx(p,{size:13,"aria-hidden":"true"}),n.label]})})})(),e.jsx("div",{style:{flex:1}}),i&&v&&(Q?.blocked?e.jsxs("button",{type:"button",className:"sv2-call-detail__btn sv2-call-detail__btn--danger-on",onClick:Ka,title:"This caller is blocked for this agent â click to unblock",children:[e.jsx(qe,{size:13,"aria-hidden":"true"})," Blocked"]}):e.jsxs("button",{type:"button",className:"sv2-call-detail__btn sv2-call-detail__btn--danger",onClick:Wa,title:"Mark this caller as spam and block them for this agent",children:[e.jsx(qe,{size:13,"aria-hidden":"true"})," Spam/Block"]})),i&&e.jsxs("button",{type:"button",className:"sv2-call-detail__btn sv2-call-detail__btn--ghost",onClick:()=>{pa(i.id)},title:"Delete this call from your list",children:[e.jsx(ze,{size:13,"aria-hidden":"true"})," Delete"]})]}),(i||ne&&ve)&&e.jsxs("div",{className:"sv2-call-detail__tabs",role:"tablist","aria-label":"Call and text views",children:[i&&e.jsxs("button",{type:"button",role:"tab","aria-selected":M==="summary",className:`sv2-call-detail__tab${M==="summary"?" sv2-call-detail__tab--on":""}`,onClick:()=>B("summary"),children:[e.jsx(Ra,{size:13,"aria-hidden":"true"})," Summary"]}),i&&e.jsxs("button",{type:"button",role:"tab","aria-selected":M==="transcript",className:`sv2-call-detail__tab${M==="transcript"?" sv2-call-detail__tab--on":""}`,onClick:()=>B("transcript"),children:[e.jsx(La,{size:13,"aria-hidden":"true"})," Transcript"]}),Oe&&e.jsxs("button",{type:"button",role:"tab","aria-selected":M==="texts",className:`sv2-call-detail__tab${M==="texts"?" sv2-call-detail__tab--on":""}`,onClick:()=>B("texts"),children:[e.jsx(V,{size:13,"aria-hidden":"true"})," Texts",(_a?.unread_count??0)>0&&e.jsx("span",{className:"sv2-call-detail__tab-badge",children:_a.unread_count})]})]}),i&&A==="short"&&M!=="texts"&&e.jsxs("div",{className:"sv2-call-detail__short-warn",children:[e.jsx(pt,{size:14,"aria-hidden":"true"}),"Caller disconnected after ",i.durationFormatted]}),M==="texts"&&Oe&&ue&&e.jsx("div",{className:"sv2-call-detail__thread-full",children:e.jsx(wt,{customerId:ue,contactPhone:v,contactName:X||void 0,fallbackAgentId:i?.agent_id||ve?.agent_id||c||null,autoFocus:!0},ue)}),i&&M==="summary"&&e.jsxs("div",{className:"sv2-call-detail__body",children:[e.jsx(St,{resume:va?.resume,sboNotes:va?.sbo_notes,callerName:X,contactId:Q?.id,loading:ma.isLoading,onOpenContact:v?()=>ke(v):void 0,variant:"desktop"}),Q?.id&&e.jsx("div",{className:"sv2-call-detail__zone",children:"This call"}),fa.length>0&&e.jsxs("div",{className:"sv2-call-detail__section",children:[e.jsx("h4",{className:"sv2-call-detail__section-title",children:"Suggested next steps"}),e.jsx("ul",{style:{margin:0,padding:"0 0 0 16px",fontSize:13,color:"var(--sv-ink)",lineHeight:1.6},children:fa.map((a,l)=>e.jsx("li",{children:a},l))})]}),Array.isArray(i.agent_actions)&&i.agent_actions.length>0&&e.jsxs("div",{className:"sv2-call-detail__section",children:[e.jsx("h4",{className:"sv2-call-detail__section-title",children:"Actions taken"}),e.jsx("ul",{className:"sv2-actions",children:i.agent_actions.map((a,l)=>{const s=(za[a.type]||za.message).Icon;return e.jsxs("li",{className:`sv2-action sv2-action--${a.status}`,children:[e.jsx("span",{className:"sv2-action__icon","aria-hidden":"true",children:e.jsx(s,{size:15})}),e.jsxs("span",{className:"sv2-action__body",children:[e.jsx("span",{className:"sv2-action__label",children:a.label}),a.detail&&e.jsx("span",{className:"sv2-action__detail",children:a.detail})]}),a.status!=="success"&&e.jsx("span",{className:"sv2-action__badge",children:a.status==="blocked"?"Blocked":"Failed"})]},l)})})]}),Le&&e.jsxs("div",{className:"sv2-call-detail__section",children:[e.jsx("h4",{className:"sv2-call-detail__section-title",children:"Summary"}),e.jsx("p",{className:"sv2-call-detail__summary",style:{color:"var(--sv-text-muted)"},children:"This call ended before a real conversation, so weâre not showing an AI summary â it can be unreliable for very short or failed calls. See the transcript or recording below for exactly what happened."})]}),i.call_insights&&!Le&&e.jsxs(e.Fragment,{children:[(i.call_insights.summary_paragraph||i.summary)&&e.jsxs("div",{className:"sv2-call-detail__section",children:[e.jsx("h4",{className:"sv2-call-detail__section-title",children:"Summary"}),e.jsx("p",{className:"sv2-call-detail__summary",children:i.call_insights.summary_paragraph||i.summary}),ua&&e.jsxs("p",{className:"sv2-call-detail__summary",style:{marginTop:8},children:[e.jsx("strong",{style:{color:"var(--sv-ink-2)"},children:"Interested in: "}),ua]})]}),ga.length>0&&e.jsxs("div",{className:"sv2-call-detail__section",children:[e.jsx("h4",{className:"sv2-call-detail__section-title",children:"Questions to answer on callback"}),e.jsx("ul",{style:{margin:0,padding:"10px 14px 10px 30px",fontSize:13,color:"var(--sv-ink)",lineHeight:1.55,background:"#fdf4e3",border:"1px solid #f0e2c0",borderRadius:10,listStyle:"disc"},children:ga.map((a,l)=>e.jsx("li",{style:{marginBottom:4},children:a},l))})]}
8),Array.isArray(i.call_insights.questions_and_answers)&&i.call_insights.questions_and_answers.length>0&&e.jsxs("div",{className:"sv2-call-detail__section",children:[e.jsx("h4",{className:"sv2-call-detail__section-title",children:"Questions & Answers"}),e.jsx("ul",{style:{margin:0,padding:"0 0 0 16px",fontSize:13,color:"var(--sv-ink-2)",lineHeight:1.55},children:i.call_insights.questions_and_answers.map((a,l)=>e.jsxs("li",{style:{marginBottom:8},children:[e.jsx("strong",{children:"Q:"})," ",a.question??"â",e.jsx("br",{}),e.jsx("strong",{children:"A:"})," ",a.response??"â"]},l))})]}),i.call_insights.caller_sentiment_summary&&e.jsxs("div",{className:"sv2-call-detail__section",children:[e.jsx("h4",{className:"sv2-call-detail__section-title",children:"Caller sentiment"}),e.jsx("p",{className:"sv2-call-detail__summary",children:i.call_insights.caller_sentiment_summary})]}),Array.isArray(i.call_insights.additional_insights)&&i.call_insights.additional_insights.length>0&&e.jsxs("div",{className:"sv2-call-detail__section",children:[e.jsx("h4",{className:"sv2-call-detail__section-title",children:"Additional insights"}),e.jsx("ul",{style:{margin:0,padding:"0 0 0 16px",fontSize:13,color:"var(--sv-ink-2)",lineHeight:1.55},children:i.call_insights.additional_insights.map((a,l)=>e.jsx("li",{children:a},l))})]})]}),!i.call_insights&&!Le&&i.summary&&e.jsxs("div",{className:"sv2-call-detail__section",children:[e.jsx("h4",{className:"sv2-call-detail__section-title",children:"Summary"}),e.jsx("p",{className:"sv2-call-detail__summary",children:i.summary})]}),e.jsxs("div",{className:"sv2-call-detail__section sv2-call-detail__section--notes",children:[e.jsx("h4",{className:"sv2-call-detail__section-title",children:"Notes"}),e.jsx("textarea",{className:"sv2-call-detail__notes",value:q,onChange:a=>ge(a.target.value),placeholder:"Add notes about this callâ¦",rows:3}),e.jsx("button",{type:"button",className:"sv2-call-detail__btn sv2-call-detail__btn--sm",onClick:Qa,disabled:g||q===(i.notes||""),children:g?"Savingâ¦":"Save notes"})]})]}),i&&M==="transcript"&&e.jsxs("div",{className:"sv2-call-detail__body",children:[i.recording_status==="available"&&i.call_sid&&e.jsxs("div",{className:"sv2-call-detail__section",children:[e.jsx("h4",{className:"sv2-call-detail__section-title",children:"Recording"}),e.jsx(ja,{callSid:i.call_sid},i.call_sid)]}),e.jsxs("div",{className:"sv2-call-detail__section",children:[e.jsx("h4",{className:"sv2-call-detail__section-title",children:"Transcript"}),e.jsx("div",{className:"sv2-call-detail__transcript",children:e.jsx(Nt,{history:i.conversation?.history,direction:o?"outbound":"inbound"})})]})]})]}):e.jsxs("div",{className:"sv2-call-detail__empty",children:[e.jsx(We,{size:20,"aria-hidden":"true",style:{opacity:.4}}),e.jsx("div",{children:"Select a call or text to view details"})]})}),e.jsx("style",{children:` 9 .sv2-calls-shell { 10 display: grid; 11 grid-template-columns: minmax(380px, 0.85fr) 1.15fr; 12 gap: 16px; 13 align-items: start; 14 font-family: var(--sv-font-sans); 15 } 16 @media (max-width: 980px) { 17 .sv2-calls-shell { grid-template-columns: 1fr; } 18 } 19 20 /* The list is its own scroll container. The sticky search/chips 21 inside it pin to the top of that container â so the SBO can 22 re-filter at any scroll depth, and the page itself doesn't 23 need to scroll to reach older calls. Matches the detail panel 24 pattern on the right. */ 25 .sv2-calls-list { 26 position: sticky; 27 top: 18px; 28 max-height: calc(100vh - 36px); 29 overflow-y: auto; 30 overscroll-behavior: contain; 31 scrollbar-width: thin; 32 } 33 @media (max-width: 980px) { 34 .sv2-calls-list { position: static; max-height: none; overflow: visible; } 35 } 36 37 /* Sticky band for search + chips + CSV bar. Pins to the top of 38 the list's own scrolling container (.sv2-calls-list), so the 39 controls stay reachable at any scroll depth. */ 40 .sv2-calls-sticky { 41 position: sticky; 42 top: 0; 43 z-index: 10; 44 background: var(--sv-cream); 45 padding-top: 4px; 46 padding-bottom: 4px; 47 margin: 0 0 4px; 48 } 49 .sv2-calls-sticky::after { 50 content: ""; 51 display: block; 52 height: 1px; 53 background: var(--sv-hairline); 54 margin-top: 4px; 55 opacity: 0.6; 56 } 57 58 /* ââ Top bar (search + select) ââââââââââââââââââââââââââââââ */ 59 .sv2-calls-bar { 60 display: flex; 61 align-items: center; 62 gap: 10px; 63 margin-bottom: 10px; 64 flex-wrap: wrap; 65 } 66 .sv2-calls-search { 67 flex: 1; 68 min-width: 220px; 69 position: relative; 70 background: var(--sv-bg-primary); 71 border: 1px solid var(--sv-hairline); 72 border-radius: 10px; 73 padding: 9px 12px 9px 36px; 74 font-size: 13.5px; 75 display: flex; 76 align-items: center; 77 } 78 .sv2-calls-search > svg { 79 position: absolute; 80 left: 12px; 81 color: var(--sv-text-muted); 82 } 83 .sv2-calls-search input { 84 border: 0; 85 outline: 0; 86 background: transparent; 87 flex: 1; 88 font: inherit; 89 color: var(--sv-ink); 90 } 91 .sv2-calls-search input::placeholder { color: var(--sv-text-muted); } 92 93 .sv2-calls-btn { 94 appearance: none; 95 border: 1px solid var(--sv-hairline); 96 background: var(--sv-bg-primary); 97 color: var(--sv-ink-2); 98 font: inherit; 99 font-size: 12.5px; 100 font-weight: 500; 101 padding: 7px 12px; 102 border-radius: 9px; 103 display: inline-flex; 104 align-items: center; 105 gap: 6px; 106 cursor: pointer; 107 font-family: inherit; 108 white-space: nowrap; 109 } 110 .sv2-calls-btn:hover:not(:disabled) { 111 border-color: var(--sv-hairline-2); 112 background: var(--sv-cream-2); 113 color: var(--sv-ink); 114 } 115 .sv2-calls-btn--primary { 116 background: var(--sv-ink); 117 color: var(--sv-cream); 118 border-color: var(--sv-ink); 119 } 120 .sv2-calls-btn--primary:hover { background: oklch(0.10 0.012 80); } 121 122 /* ââ Filter chips ââââââââââââââââââââââââââââââââââââââââââ */ 123 /* Channel scope â a segmented control (All / Calls / Texts). */ 124 .sv2-calls-channel { 125 display: inline-flex; 126 gap: 2px; 127 padding: 3px; 128 margin-bottom: 10px; 129 background: var(--sv-cream-2); 130 border: 1px solid var(--sv-hairline); 131 border-radius: 10px; 132 } 133 .sv2-calls-channel__btn { 134 appearance: none; 135 border: 0; 136 background: transparent; 137 color: var(--sv-text-muted); 138 font: inherit; 139 font-family: inherit; 140 font-size: 12.5px; 141 font-weight: 500; 142 padding: 5px 12px; 143 border-radius: 8px; 144 display: inline-flex; 145 align-items: center; 146 gap: 5px; 147 cursor: pointer; 148 transition: background 100ms ease, color 100ms ease; 149 } 150 .sv2-calls-channel__btn:hover { color: var(--sv-ink); } 151 .sv2-calls-channel__btn:focus-visible { outline: 2px solid var(--sv-ink); outline-offset: 1px; } 152 .sv2-calls-channel__btn--on { 153 background: var(--sv-bg-primary); 154 color: var(--sv-ink); 155 box-shadow: var(--sv-shadow-soft-sm, 0 1px 2px rgba(0,0,0,0.06)); 156 } 157 .sv2-calls-channel__ct { 158 display: inline-flex; 159 align-items: center; 160 justify-content: center; 161 min-width: 16px; 162 height: 16px; 163 padding: 0 4px; 164 border-radius: 999px; 165 background: #2563eb; 166 color: #fff; 167 font-size: 10px; 168 font-weight: 700; 169 line-height: 1; 170 } 171 172 .sv2-calls-chips { 173 display: flex; 174 flex-wrap: wrap; 175 gap: 6px; 176 margin-bottom: 12px; 177 } 178 .sv2-calls-chip { 179 appearance: none; 180 border: 1px solid var(--sv-hairline); 181 background: var(--sv-bg-primary); 182 color: var(--sv-ink-2); 183 font: inherit; 184 font-size: 12px; 185 padding: 5px 10px 5px 11px; 186 border-radius: 99px; 187 display: inline-flex; 188 align-items: center; 189 gap: 6px; 190 cursor: pointer; 191 font-family: inherit; 192 white-space: nowrap; 193 } 194 .sv2-calls-chip:hover { border-color: var(--sv-hairline-2); } 195 .sv2-calls-chip--on { 196 background: var(--sv-ink); 197 border-color: var(--sv-ink); 198 color: #fff; 199 } 200 .sv2-calls-chip__ct { 201 font-family: var(--sv-font-mono); 202 font-size: 10.5px; 203 padding: 1px 5px; 204 border-radius: 4px; 205 background: var(--sv-cream-2); 206 color: var(--sv-text-muted); 207 } 208 .sv2-calls-chip--on .sv2-calls-chip__ct { 209 background: oklch(0.32 0.012 80); 210 color: oklch(0.85 0.008 85); 211 } 212 213 /* CSV select bar (when csvMode is on) */ 214 .sv2-calls-csv-bar { 215 display: flex; 216 align-items: center; 217 gap: 10px; 218 padding: 10px 12px; 219 background: var(--sv-cream-2); 220 border: 1px solid var(--sv-hairline); 221 border-radius: 10px; 222 margin-bottom: 12px; 223 font-size: 12.5px; 224 color: var(--sv-ink-2); 225 } 226 .sv2-calls-csv-bar input[type="checkbox"] { cursor: pointer; } 227 228 /* ââ Calls list / table ââââââââââââââââââââââââââââââââââââ */ 229 .sv2-calls-table { 230 background: var(--sv-bg-primary); 231 border: 1px solid var(--sv-hairline); 232 border-radius: 14px; 233 overflow: hidden; 234 box-shadow: var(--sv-shadow-soft-sm, 0 1px 2px rgba(0,0,0,0.04)); 235 } 236 .sv2-call-group + .sv2-call-group .sv2-call-group-hd { 237 border-top: 1px solid var(--sv-hairline); 238 } 239 .sv2-call-group-hd { 240 display: flex; 241 align-items: center; 242 justify-content: space-between; 243 padding: 10px 16px; 244 font-size: 10.5px; 245 letter-spacing: 0.08em; 246 text-transform: uppercase; 247 color: var(--sv-text-muted); 248 background: var(--sv-cream-2); 249 font-weight: 600; 250 } 251 .sv2-call-group-hd__ct { 252 font-family: var(--sv-font-mono); 253 font-size: 11px; 254 padding: 1px 7px; 255 border-radius: 99px; 256 background: var(--sv-bg-primary); 257 color: var(--sv-text-muted); 258 letter-spacing: 0.02em; 259 font-weight: 500; 260 } 261 262 /* Row */ 263 .sv2-call-row { 264 appearance: none; 265 background: transparent; 266 border: 0; 267 font: inherit; 268 font-family: inherit; 269 width: 100%; 270 text-align: left; 271 display: grid; 272 grid-template-columns: 40px 1fr; 273 column-gap: 14px; 274 padding: 14px 16px; 275 border-top: 1px solid var(--sv-hairline); 276 cursor: pointer; 277 position: relative; 278 transition: background 80ms ease; 279 color: inherit; 280 } 281 .sv2-call-group .sv2-call-row:first-of-type { 282 border-top: 1px solid var(--sv-hairline); 283 } 284 .sv2-call-row:hover { background: var(--sv-cream-2); } 285 .sv2-call-row--on { background: var(--sv-cream-2); } 286 .sv2-call-row--on::before { 287 content: ""; 288 position: absolute; 289 left: 0; top: 0; bottom: 0; 290 width: 3px; 291 background: var(--sv-ink); 292 } 293 .sv2-call-row--needs-action.sv2-call-row--on::before { 294 background: var(--sv-warn-soft); 295 } 296 .sv2-call-row__cb { 297 grid-column: 1; 298 align-self: start; 299 margin-top: 12px; 300 margin-right: 4px; 301 cursor: pointer; 302 } 303 .sv2-call-row__avatar { 304 width: 40px; 305 height: 40px; 306 border-radius: 50%; 307 background: var(--sv-cream-2); 308 color: var(--sv-ink-2); 309 display: grid; 310 place-items: center; 311 font-family: var(--sv-font-display); 312 font-weight: 500; 313 font-size: 13px; 314 border: 1px solid var(--sv-hairline); 315 align-self: start; 316 } 317 .sv2-call-row__avatar--handled { background: var(--sv-cream-2); color: var(--sv-ink-2); border-color: var(--sv-hairline); } 318 .sv2-call-row__avatar--short { background: var(--sv-warn-soft-bg); color: var(--sv-warn-soft-ink); border-color: transparent; } 319 .sv2-call-row__avatar--failed { background: transparent; color: var(--sv-text-muted); border-style: dashed; } 320 .sv2-call-row__avatar--callback { background: var(--sv-money-bg); color: var(--sv-money-ink); border-color: transparent; } 321 /* Text-conversation rows read blue so calls vs texts are distinct at a glance. */ 322 .sv2-call-row__avatar--sms { background: rgba(37,99,235,0.10); color: #2563eb; border-color: transparent; } 323 .sv2-call-row--sms.sv2-call-row--on::before { background: #2563eb; } 324 .sv2-call-row__gist--unread { color: var(--sv-ink); font-weight: 600; } 325 .sv2-call-row__gist-you { color: var(--sv-text-muted); font-weight: 500; } 326 327 .sv2-call-row__body { 328 min-width: 0; 329 display: flex; 330 flex-direction: column; 331 gap: 4px; 332 } 333 .sv2-call-row__l1 { 334 display: flex; 335 align-items: baseline; 336 justify-content: space-between; 337 gap: 10px; 338 min-width: 0; 339 } 340 .sv2-call-row__nm { 341 font-size: 14.5px; 342 color: var(--sv-ink); 343 font-weight: 500; 344 min-width: 0; 345 overflow: hidden; 346 text-overflow: ellipsis; 347 white-space: nowrap; 348 letter-spacing: -0.005em; 349 } 350 .sv2-call-row__nm--anon { 351 color: var(--sv-text-muted); 352 font-style: italic; 353 font-weight: 400; 354 } 355 .sv2-call-row__time { 356 font-family: var(--sv-font-mono); 357 font-size: 11.5px; 358 color: var(--sv-text-muted); 359 flex-shrink: 0; 360 white-space: nowrap; 361 } 362 .sv2-call-row__gist { 363 font-size: 13px; 364 color: var(--sv-ink-2); 365 line-height: 1.4; 366 overflow: hidden; 367 text-overflow: ellipsis; 368 display: -webkit-box; 369 -webkit-line-clamp: 2; 370 -webkit-box-orient: vertical; 371 } 372 .sv2-call-row__foot { 373 display: flex; 374 align-items: center; 375 gap: 10px; 376 margin-top: 2px; 377 flex-wrap: wrap; 378 } 379 .sv2-call-row__pill { 380 font-size: 11px; 381 padding: 2px 9px 2px 8px; 382 border-radius: 99px; 383 font-weight: 500; 384 display: inline-flex; 385 align-items: center; 386 gap: 6px; 387 background: var(--sv-cream-2); 388 color: var(--sv-ink-2); 389 } 390 .sv2-call-row__pill::before { 391 content: ""; 392 width: 5px; 393 height: 5px; 394 border-radius: 99px; 395 background: var(--sv-faint); 396 } 397 .sv2-call-row__pill--handled { background: var(--sv-cream-2); color: var(--sv-ink-2); } 398 .sv2-call-row__pill--handled::before { background: var(--sv-faint); } 399 .sv2-call-row__pill--short { background: var(--sv-warn-soft-bg); color: var(--sv-warn-soft-ink); } 400 .sv2-call-row__pill--short::before { background: var(--sv-warn-soft); } 401 .sv2-call-row__pill--failed { background: var(--sv-cream-2); color: var(--sv-text-muted); } 402 .sv2-call-row__pill--failed::before { background: var(--sv-faint); }
402 403 .sv2-call-row__pill--callback { background: var(--sv-money-bg); color: var(--sv-money-ink); } 404 .sv2-call-row__pill--callback::before { background: var(--sv-money); } 405 .sv2-call-row__pill--sms { background: rgba(37,99,235,0.10); color: #2563eb; font-weight: 600; } 406 .sv2-call-row__pill--sms::before { display: none; } 407 .sv2-call-row__pill--unread { background: #2563eb; color: #fff; font-weight: 700; } 408 .sv2-call-row__pill--unread::before { display: none; } 409 410 .sv2-call-row__dur { 411 font-family: var(--sv-font-mono); 412 font-size: 11px; 413 color: var(--sv-text-muted); 414 } 415 .sv2-call-row__cb-done { 416 font-size: 11px; 417 color: var(--sv-money-ink); 418 font-weight: 500; 419 } 420 .sv2-call-row__cb-needed { 421 font-size: 11px; 422 color: var(--sv-warn-soft-ink); 423 font-weight: 500; 424 } 425 /* Caller-type pill in the row foot. Clickable â opens an AntD 426 Dropdown for categorizing the caller. Stops the row click 427 so it doesn't change the selected call. */ 428 .sv2-call-row__ct { 429 appearance: none; 430 border: 1px solid transparent; 431 font: inherit; 432 font-family: inherit; 433 font-size: 10.5px; 434 font-weight: 600; 435 padding: 2px 8px 2px 7px; 436 border-radius: 99px; 437 display: inline-flex; 438 align-items: center; 439 gap: 4px; 440 cursor: pointer; 441 letter-spacing: 0.02em; 442 transition: opacity 100ms ease; 443 } 444 .sv2-call-row__ct:hover { opacity: 0.85; } 445 446 /* Inline "Open contact" link â surfaces only on hover so the 447 foot stays clean; tab-focusable for keyboard users. */ 448 .sv2-call-row__open { 449 appearance: none; 450 background: transparent; 451 border: 0; 452 font: inherit; 453 font-family: inherit; 454 font-size: 11px; 455 color: var(--sv-text-muted); 456 padding: 0; 457 margin-left: auto; 458 cursor: pointer; 459 display: inline-flex; 460 align-items: center; 461 gap: 4px; 462 opacity: 0; 463 transition: opacity 100ms ease, color 100ms ease; 464 } 465 .sv2-call-row:hover .sv2-call-row__open, 466 .sv2-call-row__open:focus-visible { 467 opacity: 1; 468 } 469 .sv2-call-row__open:hover { color: var(--sv-ink); } 470 471 /* Hover-reveal delete â a floating action pinned to the row's right edge, 472 so the list can be cleaned up without opening each call. Hidden until 473 row hover / keyboard focus to keep the resting state clean. */ 474 .sv2-call-row__del { 475 appearance: none; 476 position: absolute; 477 top: 50%; 478 right: 10px; 479 transform: translateY(-50%); 480 display: inline-flex; 481 align-items: center; 482 justify-content: center; 483 width: 30px; 484 height: 30px; 485 border-radius: 8px; 486 border: 1px solid var(--sv-hairline); 487 background: var(--sv-cream, #fff); 488 color: var(--sv-text-muted); 489 cursor: pointer; 490 opacity: 0; 491 transition: opacity 100ms ease, color 100ms ease, border-color 100ms ease, background 100ms ease; 492 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06); 493 } 494 .sv2-call-row:hover .sv2-call-row__del, 495 .sv2-call-row__del:focus-visible { 496 opacity: 1; 497 } 498 .sv2-call-row__del:hover { 499 color: #dc2626; 500 border-color: color-mix(in oklch, #ef4444 40%, transparent); 501 background: #fef2f2; 502 } 503 504 .sv2-calls-empty { 505 padding: 40px 20px; 506 text-align: center; 507 color: var(--sv-text-muted); 508 font-size: 13.5px; 509 background: var(--sv-bg-primary); 510 border: 1px solid var(--sv-hairline); 511 border-radius: 14px; 512 } 513 .sv2-calls-load-more { 514 appearance: none; 515 border: 0; 516 background: transparent; 517 width: 100%; 518 padding: 14px 18px; 519 font: inherit; 520 font-family: inherit; 521 font-size: 12.5px; 522 color: var(--sv-text-muted); 523 cursor: pointer; 524 border-top: 1px solid var(--sv-hairline); 525 display: inline-flex; 526 align-items: center; 527 gap: 6px; 528 justify-content: center; 529 } 530 .sv2-calls-load-more:hover { background: var(--sv-cream-2); color: var(--sv-ink); } 531 .sv2-calls-load-more__ct { color: var(--sv-faint); } 532 533 /* ââ Detail panel ââââââââââââââââââââââââââââââââââââââââââ */ 534 .sv2-call-detail { 535 background: var(--sv-bg-primary); 536 border: 1px solid var(--sv-hairline); 537 border-radius: 14px; 538 box-shadow: var(--sv-shadow-soft-sm, 0 1px 2px rgba(0,0,0,0.04)); 539 position: sticky; 540 top: 18px; 541 max-height: calc(100vh - 36px); 542 overflow-y: auto; 543 } 544 @media (max-width: 980px) { 545 .sv2-call-detail { position: static; max-height: none; } 546 } 547 .sv2-call-detail__back { 548 appearance: none; 549 background: transparent; 550 border: 0; 551 font: inherit; 552 font-family: inherit; 553 padding: 12px 18px 0; 554 display: inline-flex; 555 align-items: center; 556 gap: 6px; 557 color: var(--sv-text-muted); 558 font-size: 12.5px; 559 cursor: pointer; 560 } 561 @media (min-width: 981px) { 562 .sv2-call-detail__back { display: none; } 563 } 564 565 .sv2-call-detail__hd { 566 padding: 20px 22px 16px; 567 border-bottom: 1px solid var(--sv-hairline); 568 display: grid; 569 grid-template-columns: 56px 1fr auto; 570 gap: 14px; 571 align-items: center; 572 background: linear-gradient(180deg, var(--sv-bg-primary), color-mix(in oklch, var(--sv-bg-primary) 70%, var(--sv-cream))); 573 } 574 .sv2-call-detail__avatar { 575 width: 56px; 576 height: 56px; 577 border-radius: 50%; 578 background: var(--sv-cream-2); 579 color: var(--sv-ink-2); 580 display: grid; 581 place-items: center; 582 font-family: var(--sv-font-display); 583 font-weight: 500; 584 font-size: 18px; 585 border: 1px solid var(--sv-hairline); 586 } 587 .sv2-call-detail__avatar--handled { background: var(--sv-cream-2); color: var(--sv-ink-2); } 588 .sv2-call-detail__avatar--short { background: var(--sv-warn-soft-bg); color: var(--sv-warn-soft-ink); border-color: transparent; } 589 .sv2-call-detail__avatar--failed { color: var(--sv-text-muted); border-style: dashed; } 590 .sv2-call-detail__avatar--callback { background: var(--sv-money-bg); color: var(--sv-money-ink); border-color: transparent; } 591 .sv2-call-detail__avatar--sms { background: rgba(37,99,235,0.10); color: #2563eb; border-color: transparent; } 592 593 .sv2-call-detail__who { min-width: 0; } 594 .sv2-call-detail__h2 { 595 margin: 0; 596 font-family: var(--sv-font-display); 597 font-weight: 500; 598 font-size: 22px; 599 letter-spacing: -0.01em; 600 line-height: 1.15; 601 color: var(--sv-ink); 602 white-space: nowrap; 603 overflow: hidden; 604 text-overflow: ellipsis; 605 } 606 .sv2-call-detail__h2--anon { color: var(--sv-text-muted); font-style: italic; } 607 .sv2-call-detail__sub { 608 display: flex; 609 align-items: center; 610 gap: 10px; 611 font-size: 12px; 612 color: var(--sv-text-muted); 613 margin-top: 4px; 614 flex-wrap: wrap; 615 } 616 .sv2-call-detail__num { font-family: var(--sv-font-mono); color: var(--sv-ink-2); } 617 .sv2-call-detail__sep { color: var(--sv-hairline-2); } 618 .sv2-call-detail__outcome { 619 font-family: var(--sv-font-sans); 620 font-size: 11.5px; 621 padding: 3px 9px 3px 8px; 622 border-radius: 99px; 623 font-weight: 500; 624 display: inline-flex; 625 align-items: center; 626 gap: 6px; 627 white-space: nowrap; 628 background: var(--sv-cream-2); 629 color: var(--sv-ink-2); 630 } 631 .sv2-call-detail__outcome::before { 632 content: ""; 633 width: 6px; 634 height: 6px; 635 border-radius: 99px; 636 background: var(--sv-faint); 637 }
638 .sv2-call-detail__outcome--handled { background: var(--sv-cream-2); color: var(--sv-ink-2); } 639 .sv2-call-detail__outcome--short { background: var(--sv-warn-soft-bg); color: var(--sv-warn-soft-ink); } 640 .sv2-call-detail__outcome--short::before { background: var(--sv-warn-soft); } 641 .sv2-call-detail__outcome--failed { background: var(--sv-cream-2); color: var(--sv-text-muted); } 642 .sv2-call-detail__outcome--callback { background: var(--sv-money-bg); color: var(--sv-money-ink); } 643 .sv2-call-detail__outcome--callback::before { background: var(--sv-money); } 644 .sv2-call-detail__outcome--sms { background: rgba(37,99,235,0.10); color: #2563eb; } 645 .sv2-call-detail__outcome--sms::before { display: none; } 646 647 /* Action row */ 648 .sv2-call-detail__actions { 649 padding: 14px 22px; 650 border-bottom: 1px solid var(--sv-hairline); 651 display: flex; 652 align-items: center; 653 gap: 8px; 654 flex-wrap: wrap; 655 } 656 .sv2-call-detail__btn { 657 appearance: none; 658 border: 1px solid var(--sv-hairline); 659 background: var(--sv-bg-primary); 660 color: var(--sv-ink-2); 661 font: inherit; 662 font-family: inherit; 663 font-size: 12.5px; 664 font-weight: 500; 665 padding: 7px 12px; 666 border-radius: 9px; 667 display: inline-flex; 668 align-items: center; 669 gap: 6px; 670 cursor: pointer; 671 text-decoration: none; 672 white-space: nowrap; 673 transition: background 80ms ease, border-color 80ms ease, color 80ms ease; 674 } 675 .sv2-call-detail__btn:hover:not(:disabled) { 676 border-color: var(--sv-hairline-2); 677 background: var(--sv-cream-2); 678 color: var(--sv-ink); 679 } 680 .sv2-call-detail__btn:disabled { opacity: 0.5; cursor: not-allowed; } 681 .sv2-call-detail__btn--primary { 682 background: var(--sv-ink); 683 color: var(--sv-cream); 684 border-color: var(--sv-ink); 685 } 686 .sv2-call-detail__btn--primary:hover:not(:disabled) { 687 background: oklch(0.10 0.012 80); 688 color: var(--sv-cream); 689 } 690 .sv2-call-detail__btn--active { 691 background: var(--sv-money-bg); 692 color: var(--sv-money-ink); 693 border-color: color-mix(in oklch, var(--sv-money) 25%, transparent); 694 } 695 .sv2-call-detail__btn--ghost { 696 border-color: transparent; 697 color: var(--sv-text-muted); 698 } 699 /* Unread-count chip on the Text button. */ 700 .sv2-call-detail__btn-badge { 701 display: inline-flex; 702 align-items: center; 703 justify-content: center; 704 min-width: 16px; 705 height: 16px; 706 padding: 0 4px; 707 margin-left: 2px; 708 border-radius: 999px; 709 background: #2563eb; 710 color: #fff; 711 font-size: 10px; 712 font-weight: 700; 713 line-height: 1; 714 } 715 /* Tab bar â Summary / Transcript / Texts. Sticks under the action row. */ 716 .sv2-call-detail__tabs { 717 display: flex; 718 gap: 4px; 719 padding: 10px 22px 0; 720 border-bottom: 1px solid var(--sv-hairline); 721 } 722 .sv2-call-detail__tab { 723 appearance: none; 724 border: 0; 725 background: transparent; 726 color: var(--sv-text-muted); 727 font: inherit; 728 font-family: inherit; 729 font-size: 13px; 730 font-weight: 600; 731 min-height: 44px; 732 padding: 8px 12px 10px; 733 margin-bottom: -1px; 734 border-bottom: 2px solid transparent; 735 display: inline-flex; 736 align-items: center; 737 gap: 6px; 738 cursor: pointer; 739 transition: color 100ms ease, border-color 100ms ease; 740 } 741 .sv2-call-detail__tab:hover { color: var(--sv-ink); } 742 .sv2-call-detail__tab:focus-visible { 743 outline: 2px solid var(--sv-ink); 744 outline-offset: -2px; 745 border-radius: 4px; 746 } 747 .sv2-call-detail__tab--on { 748 color: var(--sv-ink); 749 border-bottom-color: var(--sv-ink); 750 } 751 .sv2-call-detail__tab-badge { 752 display: inline-flex; 753 align-items: center; 754 justify-content: center; 755 min-width: 16px; 756 height: 16px; 757 padding: 0 4px; 758 border-radius: 999px; 759 background: #2563eb; 760 color: #fff; 761 font-size: 10px; 762 font-weight: 700; 763 line-height: 1; 764 } 765 /* Full-width SMS conversation in the Texts tab â fills the detail pane. */ 766 .sv2-call-detail__thread-full { 767 padding: 8px 16px 16px; 768 } 769 .sv2-call-detail__btn--ghost:hover:not(:disabled) { 770 background: var(--sv-cream-2); 771 color: var(--sv-ink); 772 } 773 .sv2-call-detail__btn--danger { 774 color: var(--sv-danger-hover, #b91c1c); 775 border-color: color-mix(in oklch, var(--sv-danger, #ef4444) 30%, transparent); 776 } 777 .sv2-call-detail__btn--danger:hover:not(:disabled) { 778 background: color-mix(in oklch, var(--sv-danger, #ef4444) 10%, transparent); 779 border-color: color-mix(in oklch, var(--sv-danger, #ef4444) 45%, transparent); 780 color: var(--sv-danger-hover, #b91c1c); 781 } 782 /* Active "Blocked" state â filled red so it's unmistakably a block (not the 783 green --active style, which read as a positive/done action). */ 784 .sv2-call-detail__btn--danger-on { 785 background: var(--sv-danger, #ef4444); 786 color: #fff; 787 border-color: var(--sv-danger, #ef4444); 788 } 789 .sv2-call-detail__btn--danger-on:hover:not(:disabled) { 790 background: var(--sv-danger-hover, #b91c1c); 791 border-color: var(--sv-danger-hover, #b91c1c); 792 color: #fff; 793 } 794 .sv2-call-detail__btn--sm { 795 padding: 5px 10px; 796 font-size: 12px; 797 border-radius: 7px; 798 } 799 800 .sv2-call-detail__short-warn { 801 margin: 14px 22px 0; 802 padding: 10px 12px; 803 border-radius: 10px; 804 background: var(--sv-warn-soft-bg); 805 color: var(--sv-warn-soft-ink); 806 font-size: 12.5px; 807 display: inline-flex; 808 align-items: center; 809 gap: 8px; 810 } 811 812 .sv2-call-detail__body { 813 padding: 18px 22px 22px; 814 display: flex; 815 flex-direction: column; 816 gap: 16px; 817 } 818 /* "This call" zone divider â a labeled rule that separates the caller's 819 working memory (above) from this specific call's content (below), so
820 the two zones read as distinct at a glance. */ 821 .sv2-call-detail__zone { 822 display: flex; 823 align-items: center; 824 gap: 10px; 825 font-size: 10.5px; 826 letter-spacing: 0.07em; 827 text-transform: uppercase; 828 color: var(--sv-text-muted); 829 font-weight: 700; 830 margin-top: 2px; 831 } 832 .sv2-call-detail__zone::after { 833 content: ""; 834 flex: 1; 835 height: 1px; 836 background: var(--sv-hairline); 837 } 838 .sv2-call-detail__section { display: flex; flex-direction: column; gap: 8px; } 839 .sv2-call-detail__section--notes { 840 border-top: 1px solid var(--sv-hairline); 841 padding-top: 16px; 842 margin-top: 4px; 843 } 844 .sv2-call-detail__section-title { 845 margin: 0; 846 font-size: 10.5px; 847 letter-spacing: 0.07em; 848 text-transform: uppercase; 849 color: var(--sv-text-muted); 850 font-weight: 600; 851 } 852 .sv2-call-detail__summary { 853 margin: 0; 854 font-size: 13.5px; 855 color: var(--sv-ink-2); 856 line-height: 1.55; 857 } 858 /* Actions taken â one row per agent action (icon + label + optional detail). */ 859 .sv2-actions { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; } 860 .sv2-action { 861 display: flex; align-items: flex-start; gap: 10px; 862 min-height: 44px; 863 padding: 9px 11px; 864 border: 1px solid var(--sv-hairline); 865 border-radius: 10px; 866 background: var(--sv-bg-primary, #fff); 867 } 868 .sv2-action__icon { 869 flex-shrink: 0; 870 width: 26px; height: 26px; 871 display: inline-flex; align-items: center; justify-content: center; 872 border-radius: 8px; 873 background: var(--sv-money-bg, #e9f6ee); 874 color: var(--sv-money-ink, #1a7a44); 875 } 876 .sv2-action__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; } 877 .sv2-action__label { font-size: 13px; font-weight: 600; color: var(--sv-ink); line-height: 1.35; } 878 .sv2-action__detail { 879 font-size: 12px; color: var(--sv-text-muted); line-height: 1.4; 880 overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; 881 } 882 .sv2-action__badge { 883 flex-shrink: 0; align-self: center; 884 font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; 885 padding: 2px 7px; border-radius: 999px; 886 background: oklch(0.95 0.05 25); color: oklch(0.45 0.18 25); 887 } 888 /* Failed / blocked actions tint the icon chip so problems stand out. */ 889 .sv2-action--failed .sv2-action__icon, 890 .sv2-action--blocked .sv2-action__icon { 891 background: oklch(0.95 0.05 25); color: oklch(0.45 0.18 25); 892 } 893 .sv2-action--blocked .sv2-action__badge { background: oklch(0.95 0.05 85); color: oklch(0.35 0.12 85); } 894 .sv2-call-detail__transcript { 895 border: 1px solid var(--sv-hairline); 896 border-radius: 10px; 897 padding: 10px 12px; 898 max-height: 360px; 899 overflow-y: auto; 900 font-size: 13px; 901 background: var(--sv-cream-2); 902 } 903 .sv2-call-detail__notes { 904 width: 100%; 905 padding: 10px 12px; 906 border: 1px solid var(--sv-hairline); 907 border-radius: 10px; 908 font: inherit; 909 font-family: inherit; 910 font-size: 13px; 911 color: var(--sv-ink); 912 background: var(--sv-bg-primary); 913 outline: 0; 914 resize: vertical; 915 line-height: 1.5; 916 } 917 .sv2-call-detail__notes:focus { 918 border-color: var(--sv-ink-2); 919 box-shadow: 0 0 0 3px color-mix(in oklch, var(--sv-ink) 8%, transparent); 920 } 921 922 .sv2-call-detail__empty { 923 padding: 60px 24px; 924 text-align: center; 925 color: var(--sv-text-muted); 926 font-size: 13.5px; 927 display: flex; 928 flex-direction: column; 929 align-items: center; 930 gap: 10px; 931 } 932
933 /* Mobile: hide list when a call is open, hide detail when not */ 934 @media (max-width: 980px) { 935 .sv2-calls-list--hidden-mobile { display: none; } 936 .sv2-call-detail--active-mobile { display: block; } 937 } 938 @media (min-width: 981px) { 939 .sv2-call-detail--active-mobile { display: block; } 940 } 941 942 /* Actionable zero-call empty state */ 943 .sv2-calls-empty--activate { text-align: center; padding: 40px 24px; } 944 .sv2-calls-empty__h { font-family: var(--sv-font-display); font-size: 20px; font-weight: 500; margin: 0 0 6px; color: var(--sv-ink); } 945 .sv2-calls-empty__sub { margin: 0 0 10px; color: var(--sv-ink-2); font-size: 14px; } 946 .sv2-calls-empty__num { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 18px; } 947 .sv2-calls-empty__num a { font-family: var(--sv-font-display); font-size: 30px; font-weight: 600; letter-spacing: -0.01em; color: var(--sv-ink); text-decoration: none; } 948 .sv2-calls-empty__copy { border: 1px solid var(--sv-border, #e5e0d8); background: var(--sv-cream-2, #f7f3ec); color: var(--sv-ink-2); border-radius: 8px; padding: 6px; cursor: pointer; display: inline-flex; } 949 .sv2-calls-empty__copy:hover { color: var(--sv-ink); } 950 .sv2-calls-empty__actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-bottom: 12px; } 951 .sv2-calls-empty__hint { margin: 0; color: var(--sv-text-muted, #9a938a); font-size: 12.5px; } 952 `}),P&&e.jsx(Ie.Suspense,{fallback:null,children:e.jsx(qt,{open:!0,onClose:()=>L(!1),agentId:m?.id||"",agentName:m?.name})}),e.jsx(Bt,{open:le,onClose:()=>d(!1),onRestored:()=>{t.refresh()}})]})};function Da(t){const o=Math.floor(t/60),c=Math.floor(t%60);return`${o}:${c.toString().padStart(2,"0")}`}function Yt(t){const o=new Date,c=new Date(o.getFullYear(),o.getMonth(),o.getDate()),m=new Date(t.getFullYear(),t.getMonth(),t.getDate()),x=Math.floor((c.getTime()-m.getTime())/(1e3*60*60*24)),b=t.toLocaleTimeString("en-US",{hour:"numeric",minute:"2-digit",hour12:!0});return x===0?b:x>0&&x<7?`${t.toLocaleDateString("en-US",{weekday:"short"})} ${b}`:`${t.toLocaleDateString("en-US",{month:"short",day:"numeric"})}, ${b}`}function Vt(t){const o=(t.status||t.CallStatus||"").toLowerCase();return o==="failed"||o==="busy"||o==="no-answer"?"failed":Number(t.duration||t.CallDuration||0)<30?"short":"ok"}function Gt(t,o){if(t.call_insights?.summary_paragraph)return t.call_insights.summary_paragraph;if(t.call_insights?.summary)return t.call_insights.summary;if(o?.turns&&Array.isArray(o.turns)){const c=o.turns.filter(m=>m.role==="assistant"||m.role==="model");if(c.length>0){const m=c[0].content||c[0].text||"";return m.length>120?m.substring(0,120)+"...":m}}return"No summary available"}const Ma=["positive","happy","satisfied","pleased","glad"],Jt=["negative","angry","frustrated","upset","annoyed","dissatisfied","unhappy"],Xt=/\b(?:not|never|no longer|without|hardly|isn't|wasn't|aren't|weren't|don't|didn't|doesn't|won't|couldn't|wouldn't)\b/;function Zt(t){const o=t.call_insights?.caller_sentiment_summary;if(!o)return"neutral";const c=String(o).toLowerCase(),m=b=>Xt.test(c.slice(Math.max(0,b-24),b)),x=(b,P)=>b.some(L=>{const w=new RegExp(`\\b${L}\\b`).exec(c);return w?m(w.index)===P:!1});return x(Ma,!1)?"positive":x(Jt,!1)||x(Ma,!0)?"negative":"neutral"}const $a={positive:1,neutral:2,negative:3},Aa={ok:1,short:2,failed:3};function es(t,o){const[c,m]=r.useState([]),[x,b]=r.useState(!1),[P,L]=r.useState(null),[w,ae]=r.useState(null),[I,C]=r.useState(""),[z,te]=r.useState("all"),[D,G]=r.useState("date"),[F,ce]=r.useState("desc"),se=r.useCallback(async()=>{b(!0),L(null);try{const g=t?(await E.getAgentInbox(t,o)).data:await E.getCalls({limit:500,sort_order:"desc"}),{calls:k=[],conversations:N=[]}=g||{},T=new Map;for(const d of N){const S=d.call_sid||d.callSid;S&&T.set(S,d)}const le=k.map(d=>{const S=d.call_sid||d.CallSid||d.id,re=T.get(S),_e=Number(d.duration||d.CallDuration||0),J=new Date(d.created_at||d.timestamp||d.dateCreated);return{id:d.id||S,call_sid:S,status:Vt(d),caller:d.from_number||d.From||d.caller||"Unknown",from_number:d.from_number||d.From||"",summary:Gt(d,re),sentiment:Zt(d),timestamp:J,duration:_e,durationFormatted:Da(_e),timeFormatted:Yt(J),conversation:re,call_insights:d.call_insights,agent_actions:Array.isArray(d.agent_actions)?d.agent_actions:[],callback_status:d.callback_status||"none",callback_at:d.callback_at?new Date(d.callback_at):void 0,notes:d.notes||"",recording_status:d.recording_status,agent_id:d.agent_id||d.agentId,agent_name:d.agent_name||d.agentName}});le.sort((d,S)=>S.timestamp.getTime()-d.timestamp.getTime()),m(le)}catch(g){console.error("Failed to fetch agent inbox:",g),L(g?.message||"Failed to load inbox")}finally{b(!1)}},[t,o]);r.useEffect(()=>{se();const g=setInterval(()=>{x||se()},3e4);return()=>clearInterval(g)},[se]);const B=r.useMemo(()=>{let g=c;if(z!=="all"&&(g=g.filter(k=>{switch(z){case"short":return k.status==="short";case"failed":return k.status==="failed";case"positive":return k.sentiment==="positive";case"negative":return k.sentiment==="negative";default:return!0}})),I.trim()){const k=I.toLowerCase();g=g.filter(N=>N.caller.toLowerCase().includes(k)||N.summary.toLowerCase().includes(k))}return g},[c,z,I]),de=r.useMemo(()=>{const g=[...B],k=F==="asc"?1:-1;return g.sort((N,T)=>{switch(D){case"date":return(N.timestamp.getTime()-T.timestamp.getTime())*k;case"duration":return(N.duration-T.duration)*k;case"status":return((Aa[N.status]||0)-(Aa[T.status]||0))*k;case"sentiment":return(($a[N.sentiment]||0)-($a[T.sentiment]||0))*k;default:return 0}}),g},[B,D,F]),Y=r.useMemo(()=>c.find(g=>g.id===w)||null,[c,w]),pe=r.useCallback((g,k)=>{m(N=>N.map(T=>T.id===g?{...T,...k}:T))},[]),q=r.useCallback(g=>{m(k=>k.filter(N=>N.id!==g)),w===g&&ae(null)},[w]),ge=r.useMemo(()=>{const g=c.length,k=c.filter(S=>S.status==="short").length,N=c.filter(S=>S.status==="failed").length,T=g>0?Math.round(k/g*100):0,le=c.reduce((S,re)=>S+re.duration,0),d=g>0?Math.round(le/g):0;return{total:g,shortCalls:k,shortCallPercent:T,failedCalls:N,avgDuration:Da(d)}},[c]);return{items:de,allItems:c,loading:x,error:P,selectedItemId:w,setSelectedItemId:ae,selectedItem:Y,searchQuery:I,setSearchQuery:C,filter:z,setFilter:te,sortField:D,setSortField:G,sortOrder:F,setSortOrder:ce,refresh:se,updateItem:pe,removeItem:q,stats:ge}}function ys(){const{selectedAgentId:t,selectedAgent:o,hasAgents:c,loading:m}
952=vt(),x=es(t,"inbound");return e.jsxs("div",{style:{padding:"24px 28px 8px",maxWidth:1440,margin:"0 auto"},children:[e.jsxs("div",{style:{marginBottom:18},children:[e.jsx("h1",{style:{fontFamily:"var(--sv-font-display)",fontSize:26,fontWeight:500,margin:"0 0 4px",letterSpacing:"-0.01em",color:"var(--sv-ink)"},children:"Calls"}),e.jsx("p",{style:{margin:0,color:"var(--sv-ink-2)",fontSize:14},children:o?`Calls handled by ${o.name}.`:"Calls handled by your agent."})]}),!c&&!m?e.jsxs("div",{style:{padding:"48px 24px",textAlign:"center",color:"var(--sv-ink-2)"},children:[e.jsx("p",{style:{margin:"0 0 14px",fontSize:15},children:"You don't have an agent yet."}),e.jsx(ht,{to:"/agents/new",style:{display:"inline-block",padding:"10px 20px",borderRadius:10,background:"var(--sv-ink)",color:"var(--sv-cream, #fff)",textDecoration:"none",fontSize:14,fontWeight:600},children:"Create your agent"})]}):e.jsx(Ht,{inbox:x,isOutbound:!1,agentId:t,agent:o})]})}export{ys as default};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.