https://clawhire.ai/assets/console-channels-sTOrcpuv.js

1import{j as e,G as se,r as g,g as W,I as N,O as k,P as b,m as I,U as ae,L as me,B as l,N as pe}from"./index-DSYt5xDH.js";import{C as xe}from"./console-layout-OJJRmqpT.js";import{C as ue,b as ge,c as we,d as be,a as ye}from"./card-Cput4hS8.js";import{B as y}from"./badge-DkuODtfy.js";import{I as ne}from"./input-iGHpQxUl.js";import{L as B}from"./label-ihsoCbjo.js";import{S as F}from"./skeleton-UYvzcsWq.js";import{S as K,a as V,b as z,c as X,d as O}from"./select-C-UZ1KiR.js";import{D as Q,a as Y,b as G,c as J,d as Z}from"./dialog-CPynabZQ.js";import{R as fe}from"./radio-DptGbupo.js";import{G as ve}from"./globe-lkG5kRyL.js";import{M as je}from"./mail-CY3nMTqa.js";import{S as Ne}from"./smartphone-B3AJDH4w.js";import{M as ke}from"./message-circle-B662ktNK.js";import{H as Ce}from"./hash-DXVSbdmB.js";import{S as Se}from"./send-BIooyRrj.js";import{L as re}from"./link-2-BTKJBQHe.js";import{C as L}from"./copy-Cd-U8AoR.js";import{S as Te}from"./settings-BEo5BvQQ.js";import{L as C}from"./loader-circle-Dj7XH_3Q.js";import{T as Ae}from"./test-tube-I1q_p2qR.js";import{T as D}from"./trash-2-D6JbgI1H.js";import{Z as Ee}from"./zap-sGtLRr8c.js";import{S as Pe}from"./star-DywdYTQk.js";import{C as R}from"./circle-check-big-BhGoblu8.js";import{C as Be}from"./chevron-up-Ces7oT5X.js";import{C as Me}from"./circle-x-BpQ_6_Cw.js";import{C as ee}from"./circle-alert-DC7_WoGy.js";import"./ticker-bar-D7UwXiv6.js";import"./target-C7dACN3_.js";import"./inbox-Bt4H-DHg.js";import"./book-open-DqLvTQQy.js";import"./plug-CWjUQSUd.js";import"./chart-column-DmfIKNB8.js";import"./credit-card-BRBSq9rt.js";import"./circle-help-B9dqhuwo.js";import"./separator-glvtGHpo.js";import"./sheet-DjSjGPtf.js";import"./index-BkUPwd_c.js";import"./chevron-left-CVwmMP_J.js";import"./search-rx-oJRdb.js";import"./bot-DONI_eAR.js";import"./textarea-PBrLDixU.js";import"./plus-C0ILPt-h.js";import"./bell-GwYyYWD_.js";import"./info-B51QXWWa.js";import"./triangle-alert-Bd_KDT6M.js";import"./circle-check-Dgza2GXw.js";import"./index-BdQq_4o_.js";const Ue=["app_mentions:read","chat:write","im:history"],_e=["app_mention","message.im"],$e=["Open api.slack.com/apps, choose Create New App, then From scratch, and pick your workspace.",`Under OAuth & Permissions, add these Bot Token Scopes: ${Ue.join(", ")}. Then choose Install to Workspace.`,"Copy the Bot User OAuth Token (it starts with xoxb-) into Bot Token below.","Under Basic Information, copy the Signing Secret into Signing Secret below. Choose the employee who answers, and save.",`Open this window again and copy the connection address. In Slack, under Event Subscriptions, switch events on, paste the address as the Request URL, and subscribe to these bot events: ${_e.join(", ")}.`,"Under App Home, allow messages in the Messages tab. Invite the app to a channel (type /invite and its name). Mention it in the channel, or send it a direct message."],Fe="Your employee answers when it is spoken to: when someone mentions it in a channel it has been invited to (it replies in a thread), or sends it a direct message. It does not answer other messages in the channel.";function Oe(s){return s==="slack"?"Connection address (the Request URL for Slack's Event Subscriptions)":s==="whatsapp"?"Connection address (paste it in Twilio as the address for incoming messages)":s==="teams"?"Connection address (the Callback URL for the Teams outgoing webhook)":"Connection address (advanced — only needed if you configure the provider yourself)"}function E(s,i){const d=String(i||"").trim();return d?/^https?:\/\//i.test(d)?d:`${String(s||"https://clawhire.ai").trim().replace(/\/+$/,"")}${d.startsWith("/")?"":"/"}${d}`:""}const j={email:{note:"Each employee can have its own email address. Customers write to it, and the employee answers from it, following your approval settings. Switch it on from the employee's page.",action:"Set up an email address",href:s=>s?`/console/agents/${s}?tab=overview`:"/console/agents"},sms:{note:"Texts are set up in Voice & SMS, where an employee gets its own phone number for calls and texts.",action:"Open Voice & SMS",href:()=>"/console/connect?tab=voice"}};function We(s){return s&&s.configurationValid===!1?{title:"Saved, but not switched on",description:`${String(s.configurationMessage||"Some settings are missing.").replace(/^Missing required \w+ config: /i,"Missing: ")} Fill these in and save again.`,failed:!0}:{title:"Channel saved and switched on",description:"Messages to this channel now reach the employee you chose.",failed:!1}}function Ie(s){return s?.success?{title:"Settings look right",description:String(s?.message||"This channel is switched on."),failed:!1}:{title:"Not switched on",description:String(s?.message||s?.error||"The settings are incomplete."),failed:!0}}const Le=["In the Twilio Console, register your business number under Messaging, then Senders, then WhatsApp senders. To try it first, use Messaging, then Try it out, then Send a WhatsApp message (the sandbox).","From the Twilio Console home page, copy the Account SID and the Auth Token into the fields below. Enter your WhatsApp number (or the sandbox's number) with its country code. Choose the employee who answers, and save.",'Open this window again and copy the connection address. In Twilio, paste it as the address for incoming messages ("When a message comes in", method POST) on your WhatsApp sender, or in the sandbox settings.',"Send your number a WhatsApp message. Replies follow your approval settings: while messages wait for your approval, each reply waits in Approvals until you send it."],De="Your employee answers every WhatsApp message sent to your number, and remembers the conversation with each person. Photos and voice notes cannot be read yet; the customer is asked to type instead.",Re=["Choose the employee who answers below, and save. The connection address appears here.","In Teams, open the team where people should ask. Choose ••• next to the team's name, then Manage team, then Apps, then Create an outgoing webhook. Name it after your employee (people will type @ and this name), paste the connection address as the Callback URL, and choose Create.","Teams shows a security token once. Copy it into Security token below.",'Answers usually take longer than the five seconds Teams waits, so they are posted by a workflow. In the channel, choose ••• then Workflows, pick "Send webhook alerts to a channel", finish it, and copy the address it gives you into Workflow address below. Save again.',"In the channel, type @ and the webhook's name, then your question."],He="Your employee answers when it is mentioned in a standard channel of that team. A quick answer appears under the question; a longer one is posted in the channel by the workflow a minute or two later. Outgoing webhooks do not work in private chats or private channels.";function qe(s){return s==="whatsapp"?{title:"How to connect WhatsApp through Twilio (about ten minutes)",steps:Le,behaviour:De}:s==="teams"?{title:"How to connect Microsoft Teams (about ten minutes)",steps:Re,behaviour:He}:null}const te=[{type:"web",name:"Web Chat",icon:ve,description:"Embeddable chat widget for your website",color:"blue",fields:[]},{type:"email",name:"Email",icon:je,description:"Customers email your employee directly",color:"green",fields:[{key:"provider",label:"Provider",type:"select",options:["smtp","sendgrid"]},{key:"smtpHost",label:"SMTP Host",type:"text",showWhen:"smtp",placeholder:"smtp.example.com"},{key:"smtpPort",label:"SMTP Port",type:"text",showWhen:"smtp",placeholder:"587"},{key:"smtpUser",label:"SMTP Username",type:"text",showWhen:"smtp",placeholder:"[email protected]"},{key:"smtpPass",label:"SMTP Password",type:"password",showWhen:"smtp"},{key:"fromAddress",label:"From Address",type:"text",placeholder:"[email protected]"},{key:"sendgridApiKey",label:"SendGrid API Key",type:"password",showWhen:"sendgrid"}]},{type:"sms",name:"SMS",icon:Ne,description:"Texts with your customers",color:"orange",f

1ields:[{key:"twilioSid",label:"Twilio Account SID",type:"text",placeholder:"ACxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"},{key:"twilioToken",label:"Twilio Auth Token",type:"password"},{key:"phoneNumber",label:"Phone Number",type:"text",placeholder:"+15551234567"}]},{type:"whatsapp",name:"WhatsApp",icon:ke,description:"Your employee answers WhatsApp messages to your number (through Twilio)",color:"emerald",fields:[{key:"twilioSid",label:"Twilio Account SID",type:"text",placeholder:"AC followed by 32 letters and numbers"},{key:"twilioToken",label:"Twilio Auth Token",type:"password"},{key:"whatsappNumber",label:"WhatsApp number, with country code",type:"text",placeholder:"+15551234567"}]},{type:"teams",name:"Microsoft Teams",icon:ae,description:"Your employee answers when it is @mentioned in a Teams channel",color:"blue",fields:[{key:"teamsHmacToken",label:"Security token (Teams shows it once)",type:"password"},{key:"workflowUrl",label:"Workflow address (for answers that take longer)",type:"password",placeholder:"https://…logic.azure.com/… or …api.powerplatform.com/…"}]},{type:"slack",name:"Slack",icon:Ce,description:"Your employee answers in Slack when it is mentioned or messaged",color:"purple",fields:[{key:"botToken",label:"Bot Token",type:"password",placeholder:"xoxb-..."},{key:"signingSecret",label:"Signing Secret",type:"password"},{key:"channelId",label:"Default Channel ID",type:"text",placeholder:"C0XXXXXXXXX"}]},{type:"telegram",name:"Telegram (per employee)",icon:Se,description:"Individual bot per AI employee — each gets their own Telegram identity",color:"sky",fields:[{key:"telegram_bot_token",label:"Bot Token",type:"password",placeholder:"123456:ABC-DEF..."}]}],P={blue:{icon:"text-blue-400",iconBg:"bg-gradient-to-br from-blue-500/10 to-blue-500/5",iconBorder:"border border-blue-500/15",badge:"bg-blue-500/10",badgeText:"text-blue-400"},green:{icon:"text-green-400",iconBg:"bg-gradient-to-br from-green-500/10 to-green-500/5",iconBorder:"border border-green-500/15",badge:"bg-green-500/10",badgeText:"text-green-400"},orange:{icon:"text-orange-400",iconBg:"bg-gradient-to-br from-orange-500/10 to-orange-500/5",iconBorder:"border border-orange-500/15",badge:"bg-orange-500/10",badgeText:"text-orange-400"},emerald:{icon:"text-emerald-400",iconBg:"bg-gradient-to-br from-emerald-500/10 to-emerald-500/5",iconBorder:"border border-emerald-500/15",badge:"bg-emerald-500/10",badgeText:"text-emerald-400"},purple:{icon:"text-purple-400",iconBg:"bg-gradient-to-br from-purple-500/10 to-purple-500/5",iconBorder:"border border-purple-500/15",badge:"bg-purple-500/10",badgeText:"text-purple-400"},sky:{icon:"text-sky-400",iconBg:"bg-gradient-to-br from-sky-500/10 to-sky-500/5",iconBorder:"border border-sky-500/15",badge:"bg-sky-500/10",badgeText:"text-sky-400"}};function Ke(s){switch(s){case"active":return e.jsxs(y,{variant:"outline",className:"text-[11px] border-0 bg-emerald-500/10 text-emerald-400",children:[e.jsx(R,{className:"w-3 h-3 mr-1"}),"Active"]});case"error":return e.jsxs(y,{variant:"outline",className:"text-[11px] border-0 bg-red-500/10 text-red-400",children:[e.jsx(ee,{className:"w-3 h-3 mr-1"}),"Error"]});case"inactive":return e.jsxs(y,{variant:"outline",className:"text-[11px] border-0 bg-amber-500/10 text-amber-300",children:[e.jsx(ee,{className:"w-3 h-3 mr-1"}),"Saved, not switched on"]});default:return e.jsxs(y,{variant:"outline",className:"text-[11px] border-0 bg-white/5 text-white/30",children:[e.jsx(Me,{className:"w-3 h-3 mr-1"}),"Not Configured"]})}}function Ve({tenantId:s}){const{toast:i}=se(),[d,x]=g.useState(!1),[r,S]=g.useState(""),{data:c,isLoading:T}=W({queryKey:["/api/tenants",s,"channels","shared-telegram"],queryFn:async()=>{const n=await fetch(`/api/tenants/${s}/channels/shared-telegram`,{credentials:"include"});return n.ok?n.json():{connected:!1}}}),p=N({mutationFn:async n=>{const u=await b("POST",`/api/tenants/${s}/channels/shared-telegram`,{botToken:n});if(!u.ok){const v=await u.json();throw new Error(v.error||"Failed to connect")}return u.json()},onSuccess:n=>{k.invalidateQueries({queryKey:["/api/tenants",s,"channels","shared-telegram"]}),S(""),i({title:"✅ Shared bot connected!",description:n.message||`@${n.botUsername} is now routing messages to all your AI employees.`})},onError:n=>{i({title:"Connection failed",description:n.message,variant:"destructive"})}}),w=N({mutationFn:async()=>{const n=await b("DELETE",`/api/tenants/${s}/channels/shared-telegram`);if(!n.ok){const u=await n.json();throw new Error(u.error||"Failed to disconnect")}return n.json()},onSuccess:()=>{k.invalidateQueries({queryKey:["/api/tenants",s,"channels","shared-telegram"]}),i({title:"Bot disconnected",description:"Shared Telegram bot has been removed."})},onError:n=>{i({title:"Error",description:n.message,variant:"destructive"})}});function f(n){navigator.clipboard.writeText(n).then(()=>{i({title:"Copied",description:"Copied to clipboard."})})}const h=c?.connected;return e.jsx(I.div,{initial:{opacity:0,y:12}

1,animate:{opacity:1,y:0},transition:{duration:.4,delay:.1},children:e.jsxs("div",{className:"relative rounded-2xl border overflow-hidden",style:{background:h?"linear-gradient(135deg, rgba(14,165,233,0.08) 0%, rgba(6,182,212,0.04) 100%)":"linear-gradient(135deg, rgba(99,102,241,0.07) 0%, rgba(14,165,233,0.04) 100%)",borderColor:h?"rgba(14,165,233,0.2)":"rgba(99,102,241,0.15)"},children:[e.jsx("div",{className:"absolute top-3 right-3",children:e.jsxs("span",{className:"inline-flex items-center gap-1 text-[10px] font-semibold px-2 py-0.5 rounded-full bg-gradient-to-r from-sky-500/20 to-indigo-500/20 text-sky-300 border border-sky-500/20",children:[e.jsx(Pe,{className:"w-2.5 h-2.5"}),"RECOMMENDED"]})}),e.jsxs("div",{className:"p-5 pb-0",children:[e.jsxs("div",{className:"flex items-start gap-4",children:[e.jsx("div",{className:"p-2.5 rounded-xl bg-gradient-to-br from-sky-500/15 to-indigo-500/10 border border-sky-500/20 shrink-0",children:e.jsx(ae,{className:"w-5 h-5 text-sky-400"})}),e.jsxs("div",{className:"flex-1 min-w-0",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("h2",{className:"text-base font-semibold text-white",children:"Shared Company Telegram Bot"}),h?e.jsxs(y,{variant:"outline",className:"text-[10px] border-0 bg-emerald-500/10 text-emerald-400",children:[e.jsx(R,{className:"w-2.5 h-2.5 mr-1"}),"Connected"]}):e.jsx(y,{variant:"outline",className:"text-[10px] border-0 bg-white/5 text-white/30",children:"Not set up"})]}),e.jsx("p",{className:"text-sm text-white/50 mt-0.5",children:"One bot for all your AI employees — add it to any Telegram group and @mention by name"})]}),e.jsx("button",{onClick:()=>x(!d),className:"shrink-0 p-1.5 rounded-lg text-white/30 hover:text-white/70 hover:bg-white/5 transition-colors mt-0.5",children:d?e.jsx(Be,{className:"w-4 h-4"}):e.jsx(pe,{className:"w-4 h-4"})})]}),e.jsx("div",{className:"flex flex-wrap gap-3 mt-3 pb-4",children:[{icon:"✅",label:"One bot for all employees"},{icon:"💬",label:"Works in group chats"},{icon:"🎯",label:"Route by @mention"},{icon:"🚀",label:"No per-agent setup"}].map(n=>e.jsxs("span",{className:"text-xs text-white/50 flex items-center gap-1.5",children:[e.jsx("span",{children:n.icon}),n.label]},n.label))})]}),d&&e.jsx("div",{className:"border-t border-white/[0.06] p-5 space-y-4",children:h?e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"rounded-xl bg-emerald-500/5 border border-emerald-500/15 p-4 space-y-3",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(R,{className:"w-4 h-4 text-emerald-400"}),e.jsxs("span",{className:"text-sm font-medium text-emerald-300",children:["@",c?.botUsername," is active"]})]}),c?.webhookUrl&&e.jsxs("div",{className:"flex items-center gap-2 text-xs bg-white/[0.03] border border-white/[0.06] rounded-lg px-3 py-2",children:[e.jsx(re,{className:"w-3 h-3 text-white/30 shrink-0"}),e.jsx("code",{className:"truncate flex-1 text-white/40",children:c.webhookUrl}),e.jsx(l,{size:"icon",variant:"ghost",className:"h-5 w-5 shrink-0 text-white/30 hover:text-white",onClick:()=>f(c.webhookUrl),children:e.jsx(L,{className:"w-3 h-3"})})]})]}),e.jsxs("div",{className:"rounded-xl bg-white/[0.02] border border-white/[0.06] p-4 space-y-2",children:[e.jsx("p",{className:"cc-overline text-xs font-semibold text-white/60 uppercase tracking-wide",children:"How to use in Telegram"}),e.jsxs("ol",{className:"space-y-1.5 text-sm text-white/50",children:[e.jsxs("li",{className:"flex gap-2",children:[e.jsx("span",{className:"text-sky-400 font-bold shrink-0",children:"1."})," Add @",c?.botUsername," to your Telegram group"]}),e.jsxs("li",{className:"flex gap-2",children:[e.jsx("span",{className:"text-sky-400 font-bold shrink-0",children:"2."})," @mention any AI employee by their first name"]}),e.jsxs("li",{className:"flex gap-2",children:[e.jsx("span",{className:"text-sky-400 font-bold shrink-0",children:"3."})," That employee responds automatically"]})]}),e.jsxs("div",{className:"mt-3 rounded-lg bg-black/20 border border-white/[0.04] p-3 font-mono text-xs text-white/40 space-y-1",children:[e.jsx("p",{className:"text-white/60",children:"Example messages:"}),e.jsx("p",{children:"@Alex what's the status of order #123?"}),e.jsx("p",{children:"@Morgan please draft a follow-up email for John"}),e.jsx("p",{children:"@Jordan I need the Q4 report summary"})]})]}),e.jsx(l,{variant:"outline",size:"sm",className:"border-red-500/20 text-red-400/70 hover:text-red-400 hover:bg-red-500/5 hover:border-red-500/30",onClick:()=>w.mutate(),disabled:w.isPending,children:w.isPending?e.jsxs(e.Fragment,{children:[e.jsx(C,{className:"w-3.5 h-3.5 mr-1.5 animate-spin"}),"Disconnecting…"]}):e.jsxs(e.Fragment,{children:[e.jsx(D,{className:"w-3.5 h-3.5 mr-1.5"}),"Disconnect shared bot"]})})]}):e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"rounded-xl bg-white/[0.02] border border-white/[0.06] p-4 space-y-2",children:[e.jsx("p",{className:"cc-overline text-xs font-semibold text-white/60 uppercase tracking-wide",children:"Qu

1ick Setup (2 minutes)"}),e.jsxs("ol",{className:"space-y-1.5 text-sm text-white/50",children:[e.jsxs("li",{className:"flex gap-2",children:[e.jsx("span",{className:"text-sky-400 font-bold shrink-0",children:"1."})," Open Telegram and message ",e.jsx("span",{className:"text-white/70",children:"@BotFather"})]}),e.jsxs("li",{className:"flex gap-2",children:[e.jsx("span",{className:"text-sky-400 font-bold shrink-0",children:"2."})," Send ",e.jsx("span",{className:"font-mono text-white/70",children:"/newbot"})," and follow the prompts"]}),e.jsxs("li",{className:"flex gap-2",children:[e.jsx("span",{className:"text-sky-400 font-bold shrink-0",children:"3."})," Copy the bot token BotFather gives you"]}),e.jsxs("li",{className:"flex gap-2",children:[e.jsx("span",{className:"text-sky-400 font-bold shrink-0",children:"4."})," Paste it below and click Connect"]})]})]}),e.jsxs("div",{className:"space-y-1.5",children:[e.jsx(B,{className:"text-sm font-medium text-white/50",children:"Bot Token from @BotFather"}),e.jsxs("div",{className:"flex gap-2",children:[e.jsx(ne,{type:"password",placeholder:"123456789:AAF5fIH...",value:r,onChange:n=>S(n.target.value),className:"flex-1 bg-white/[0.03] border-white/[0.08] text-white placeholder:text-white/20 focus:border-sky-500/30 font-mono text-sm"}),e.jsx(l,{className:"shrink-0 bg-gradient-to-r from-sky-600 to-indigo-600 hover:from-sky-500 hover:to-indigo-500 text-white border-0 shadow-lg shadow-sky-500/15",onClick:()=>r.trim()&&p.mutate(r.trim()),disabled:p.isPending||!r.trim(),children:p.isPending?e.jsxs(e.Fragment,{children:[e.jsx(C,{className:"w-4 h-4 mr-2 animate-spin"}),"Connecting…"]}):"Connect All Employees"})]})]}),e.jsxs("div",{className:"rounded-xl bg-sky-500/5 border border-sky-500/10 p-3 text-xs text-sky-300/70",children:[e.jsx("span",{className:"font-semibold text-sky-300",children:"💡 Naming tip:"})," ","Make sure your AI employees have short, distinct first names (Alex, Morgan, Jordan) so @mentions are easy to type in Telegram. You can edit employee names from the Employees page."]})]})})]})})}function Ht(){return e.jsx(xe,{children:s=>e.jsx(ze,{tenantId:s})})}function ze({tenantId:s}){const{toast:i}=se(),[d,x]=g.useState(!1),[r,S]=g.useState(null),[c,T]=g.useState({}),[p,w]=g.useState("__unassigned__"),[f,h]=g.useState(null),{data:n=[],isLoading:u}=W({queryKey:["/api/tenants",s,"channels"],queryFn:async()=>{const t=await fetch(`/api/tenants/${s}/channels`,{credentials:"include"});return t.ok?t.json():[]}}),{data:v=[]}=W({queryKey:["/api/tenants",s,"agents"],queryFn:async()=>{const t=await fetch(`/api/tenants/${s}/agents`,{credentials:"include"});return t.ok?t.json():[]}}),M=N({mutationFn:async t=>n.find(m=>m.channelType===t.channelType)?(await b("POST",`/api/tenants/${s}/channels`,t)).json():(await b("POST",`/api/tenants/${s}/channels`,t)).json(),onSuccess:t=>{k.invalidateQueries({queryKey:["/api/tenants",s,"channels"]});const a=We(t);i({title:a.title,description:a.description,...a.failed?{variant:"destructive"}:{}}),a.failed||x(!1)},onError:t=>{i({title:"Error",description:t.message,variant:"destructive"})}}),U=N({mutationFn:async t=>{await b("DELETE",`/api/tenants/${s}/channels/${t}`)},onSuccess:()=>{k.invalidateQueries({queryKey:["/api/tenants",s,"channels"]}),i({title:"Channel removed",description:"Configuration has been deleted."}),h(null)},onError:t=>{i({title:"Error",description:t.message,variant:"destructive"})}}),_=N({mutationFn:async t=>(await b("POST",`/api/tenants/${s}/channels/${t}/test`)).json(),onSuccess:t=>{const a=Ie(t);i({title:a.title,description:a.description,...a.failed?{variant:"destructive"}:{}}),k.invalidateQueries({queryKey:["/api/tenants",s,"channels"]})},onError:t=>{i({title:"Test failed",description:t.message,variant:"destructive"})}});function H(t){const a=n.find(m=>m.channelType===t.type),o=a?.config||{};S(t),T(o),w(a?.agentInstanceId||"__unassigned__"),x(!0)}function ie(){r&&M.mutate({channelType:r.type,config:c,agentInstanceId:p&&p!=="__unassigned__"?p:null})}function q(t){navigator.clipboard.writeText(t).then(()=>{i({title:"Copied",description:"The connection address is copied."})}).catch(()=>i({title:"Could not copy",description:"Select the address and copy it by hand.",variant:"destructive"}))}const A=typeof window<"u"?window.location.origin:"https://clawhire.ai",oe=v[0]?.id||null;function le(t){return n.find(a=>a.channelType===t)}function ce(t){return t?v.find(o=>o.id===t)?.agentName||"Unknown Agent":"Unassigned"}const de=n.filter(t=>t.status==="active"&&!j[t.channelType]).length;return u?e.jsxs("div",{className:"phase3-operations-console phase3-communication-channels p-6 max-w-[1400px] mx-auto 

1space-y-6",children:[e.jsx(F,{className:"h-32 w-full bg-white/5 rounded-2xl"}),e.jsx(F,{className:"h-40 w-full bg-white/5 rounded-2xl"}),e.jsx("div",{className:"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4",children:[1,2,3,4,5].map(t=>e.jsx(F,{className:"h-52 bg-white/5 rounded-xl"},t))})]}):e.jsxs("div",{className:"p-6 max-w-[1400px] mx-auto space-y-6",children:[e.jsx(I.div,{initial:{opacity:0,y:16},animate:{opacity:1,y:0},transition:{duration:.4},children:e.jsxs("div",{className:"relative rounded-2xl bg-gradient-to-br from-purple-500/[0.08] via-blue-500/[0.04] to-transparent border border-white/[0.06] p-6 overflow-hidden",children:[e.jsx("div",{className:"absolute -top-12 -right-12 w-48 h-48 bg-purple-500/10 rounded-full blur-3xl"}),e.jsx("div",{className:"absolute -bottom-8 -left-8 w-36 h-36 bg-blue-500/8 rounded-full blur-3xl"}),e.jsxs("div",{className:"relative flex items-start justify-between",children:[e.jsxs("div",{className:"flex items-center gap-4",children:[e.jsx("div",{className:"p-3 rounded-xl bg-gradient-to-br from-purple-500/10 to-blue-500/5 border border-purple-500/15",children:e.jsx(fe,{className:"w-6 h-6 text-purple-400"})}),e.jsxs("div",{children:[e.jsx("h1",{className:"text-2xl font-bold text-white",children:"Communication Channels"}),e.jsx("p",{className:"text-white/50 mt-1",children:"Route customer conversations through Telegram, email, SMS, voice, website chat, and team channels."})]})]}),e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsxs("div",{className:"text-right",children:[e.jsx("p",{className:"cc-num text-2xl font-bold text-white",children:de}),e.jsx("p",{className:"text-xs text-white/40",children:"Connected"})]}),e.jsx("div",{className:"h-10 w-px bg-white/[0.06]"}),e.jsxs("div",{className:"text-right",children:[e.jsx("p",{className:"cc-num text-2xl font-bold text-white",children:te.length}),e.jsx("p",{className:"text-xs text-white/40",children:"Available"})]})]})]})]})}),e.jsx(Ve,{tenantId:s}),e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"h-px flex-1 bg-white/[0.06]"}),e.jsx("span",{className:"cc-overline text-xs font-semibold text-white/25 uppercase tracking-widest",children:"Individual Channel Routes"}),e.jsx("div",{className:"h-px flex-1 bg-white/[0.06]"})]}),e.jsx("div",{className:"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4",children:te.map((t,a)=>{const o=le(t.type),m=!!o,he=t.icon,$=P[t.color]||P.blue;return e.jsx(I.div,{initial:{opacity:0,y:16},animate:{opacity:1,y:0},transition:{delay:a*.06,duration:.4},children:e.jsxs(ue,{className:"cc-lift relative overflow-hidden bg-white/[0.02] border-white/[0.06] hover:border-white/[0.12] hover:bg-white/[0.03]",children:[e.jsx(ge,{className:"pb-3",children:e.jsxs("div",{className:"flex items-start justify-between",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:`p-2 rounded-lg ${$.iconBg} ${$.iconBorder}`,children:e.jsx(he,{className:`w-5 h-5 ${$.icon}`})}),e.jsxs("div",{children:[e.jsx(we,{className:"text-base text-white",children:t.name}),e.jsx(be,{className:"text-xs mt-0.5 text-white/40",children:t.description})]})]}),e.jsx("div",{className:"flex items-center gap-1.5",children:e.jsx("div",{className:`w-2 h-2 rounded-full ${o?.status==="active"?"bg-emerald-400 shadow-lg shadow-emerald-500/30":o?.status==="error"?"bg-red-400 shadow-lg shadow-red-500/30":"bg-white/20"}`})})]})}),e.jsx(ye,{className:"pt-0 space-y-3 overflow-hidden",children:j[t.type]?e.jsxs("div",{className:"space-y-3","data-testid":`channel-elsewhere-${t.type}`,children:[e.jsx("p",{className:"text-xs text-white/55 leading-relaxed",children:j[t.type].note}),e.jsx(me,{href:j[t.type].href(oe),children:e.jsx(l,{size:"sm",variant:"outline",className:"w-full border-white/[0.12] text-white/80 hover:text-white hover:bg-white/5","data-testid":`button-elsewhere-${t.type}`,children:j[t.type].action})}),m&&e.jsxs("div",{className:"flex items-center justify-between gap-2 text-[11px] text-white/40",children:[e.jsx("span",{children:"An older setting is saved here and is not used."}),e.jsx(l,{size:"sm",variant:"ghost",className:"h-7 px-2 text-red-400/70 hover:text-red-400",onClick:()=>h(o.id),"data-testid":`button-remove-old-${t.type}`,children:"Remove it"})]})]}):e.jsxs(e.Fragment,{children:[e.jsx("div",{children:Ke(o?.status)}),m&&o.webhookUrl&&e.jsxs("div",{className:"flex items-center gap-2 text-xs bg-white/[0.03] border border-white/[0.06] rounded-lg px-3 py-2",children:[e.jsx(re,{className:"w-3 h-3 text-white/30 shrink-0"}),e.jsx("code",{className:"truncate flex-1 min-w-0 text-white/40","data-testid":`text-connection-address-${t.type}`,children:E(A,o.webhookUrl)}),e.jsx(l,{size:"icon",variant:"ghost",className:"h-6 w-6 shrink-0 text-white/30 hover:text-white hover:bg-white/5","aria-label":"Copy the connection address",onClick:()=>q(E(A,o.webhookUrl)),children:e.jsx(L,{className:"w-3 h-3"})})]}),m&&e.jsxs("p",{className:"text-xs text-white/40",children:["Assigned to: ",e.jsx("span",{className:"font-medium text-white/70",children:ce(o.agentInstanceId)})]}),e.jsx("div",{className:"flex gap-2 pt-1",children:m?e.jsxs(e.Fragment,{children:[e.jsxs(l,{size:"sm",variant:"outline",className:"flex-1 border-white/[0.08] text-white/60 hover:text-white hover:bg-white/5 hover:border-white/15",onClick:()=>H(t),children:[e.jsx(Te,{className:"w-3.5 h-3.5 mr-1.5"}),"Edit"]}),e.jsx(l,{size:"sm",variant:"outline",className:"border-white/[0.08] text-white/60 hover:text-white hover:bg-white/5 hover:border-white/15",onClick:()=>_.mutate(o.id),disabled:_.isPending,children:_.isPending?e.jsx(C,{className:"w-3.5 h-3.5 animate-spin"}):e.jsx(Ae,{className:"w-3.5 h-3.5"})}),e.jsx(l,{size:"sm",variant:"outline",className:"border-white/[0.08] text-red-400/70 hover:text-red-400 hover:bg-red-500/5 hover:border-red-500/20",onClick:()=>h(o.id),children:e.jsx(D,{className:"w-3.5 h-3.5"})})]}):e.jsxs(l,{size:"sm",className:"w-full bg-gradient-to-r from-purple-600 to-blue-600 hover:from-purple-500 hover:to-blue-500 text-white border-0 shadow-lg shadow-purple-500/15",onClick:()=>H(t),children:[e.jsx(Ee,{className:"w-3.5 h-3.5 mr-1.5"}),"Configure"]})})]})})]})},t.type)})}),e.jsx(Q,{open:d,onOpenChange:x,children:e.jsxs(Y,{className:"w-[calc(100vw-2rem)] max-w-lg max-h-[90vh] overflow-y-auto overflow-x-hidden bg-slate-900 border-white/[0.08]",children:[e.jsxs(G,{children:[e.jsx(J,{className:"flex items-center gap-2 text-white",children:r&&(()=>{const t=P[r.color]||P.blue,a=r.icon;return e.jsxs(e.Fragment,{children:[e.jsx("div",{className:`p-1.5 rounded-lg ${t.iconBg} ${t.iconBorder}`,children:e.jsx(a,{className:`w-4 h-4 ${t.icon}`})}),"Configure ",r.name]})})()}),e.jsx(Z,{className:"text-white/40",children:r?.type==="web"?"Web Chat is automatically available. Assign an AI employee to handle conversations.":"Enter your credentials to connect this channel."})]}

1),e.jsxs("div",{className:"space-y-4 mt-2 min-w-0",children:[r?.type==="slack"&&e.jsxs("div",{className:"rounded-lg bg-white/[0.03] border border-white/[0.06] p-3 space-y-2","data-testid":"slack-setup-steps",children:[e.jsx("p",{className:"text-sm font-medium text-white/80",children:"How to connect Slack (about five minutes)"}),e.jsx("ol",{className:"list-decimal pl-5 space-y-1.5 text-xs text-white/60",children:$e.map(t=>e.jsx("li",{children:t},t))}),e.jsx("p",{className:"text-xs text-white/50",children:Fe})]}),(()=>{const t=qe(r?.type);return t?e.jsxs("div",{className:"rounded-lg bg-white/[0.03] border border-white/[0.06] p-3 space-y-2","data-testid":`setup-steps-${r?.type}`,children:[e.jsx("p",{className:"text-sm font-medium text-white/80",children:t.title}),e.jsx("ol",{className:"list-decimal pl-5 space-y-1.5 text-xs text-white/60",children:t.steps.map(a=>e.jsx("li",{children:a},a))}),e.jsx("p",{className:"text-xs text-white/50",children:t.behaviour})]}):null})(),r?.fields.filter(t=>t.showWhen?c.provider===t.showWhen:!0).map(t=>e.jsxs("div",{children:[e.jsx(B,{className:"text-sm font-medium mb-1.5 block text-white/40",children:t.label}),t.type==="select"?e.jsxs(K,{value:c[t.key]||"",onValueChange:a=>T({...c,[t.key]:a}),children:[e.jsx(V,{className:"bg-white/[0.03] border-white/[0.08] text-white focus:border-purple-500/30",children:e.jsx(z,{placeholder:`Select ${t.label.toLowerCase()}`})}),e.jsx(X,{className:"bg-slate-900 border-white/[0.08]",children:t.options?.map(a=>e.jsx(O,{value:a,className:"text-white/70 focus:bg-white/5 focus:text-white",children:a.charAt(0).toUpperCase()+a.slice(1)},a))})]}):e.jsx(ne,{type:t.type,placeholder:t.placeholder,value:c[t.key]||"",onChange:a=>T({...c,[t.key]:a.target.value}),className:"bg-white/[0.03] border-white/[0.08] text-white placeholder:text-white/30 focus:border-purple-500/30"})]},t.key)),e.jsxs("div",{children:[e.jsx(B,{className:"text-sm font-medium mb-1.5 block text-white/40",children:"Assign AI Employee"}),e.jsxs(K,{value:p,onValueChange:w,children:[e.jsx(V,{className:"bg-white/[0.03] border-white/[0.08] text-white focus:border-purple-500/30",children:e.jsx(z,{placeholder:"Select an AI employee"})}),e.jsxs(X,{className:"bg-slate-900 border-white/[0.08]",children:[e.jsx(O,{value:"__unassigned__",className:"text-white/70 focus:bg-white/5 focus:text-white",children:"Unassigned"}),v.map(t=>e.jsxs(O,{value:t.id,className:"text-white/70 focus:bg-white/5 focus:text-white",children:[t.agentName,t.agentTitle?` — ${t.agentTitle}`:""]},t.id))]})]})]}),(()=>{const t=r?n.find(a=>a.channelType===r.type):null;return t?.webhookUrl?e.jsxs("div",{className:"rounded-lg bg-white/[0.03] border border-white/[0.06] p-3",children:[e.jsx(B,{className:"text-xs text-white/30 mb-1 block",children:Oe(r?.type)}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("code",{className:"text-xs flex-1 min-w-0 break-all text-white/60 select-all","data-testid":"text-dialog-connection-address",children:E(A,t.webhookUrl)}),e.jsx(l,{size:"icon",variant:"ghost",className:"h-6 w-6 shrink-0 text-white/30 hover:text-white hover:bg-white/5","aria-label":"Copy the connection address",onClick:()=>q(E(A,t.webhookUrl)),children:e.jsx(L,{className:"w-3 h-3"})})]})]}):null})(),e.jsxs("div",{className:"flex gap-2 pt-2",children:[e.jsx(l,{className:"flex-1 bg-gradient-to-r from-purple-600 to-blue-600 hover:from-purple-500 hover:to-blue-500 text-white border-0 shadow-lg shadow-purple-500/15",onClick:ie,disabled:M.isPending,children:M.isPending?e.jsxs(e.Fragment,{children:[e.jsx(C,{className:"w-4 h-4 mr-2 animate-spin"}),"Saving…"]}):"Save Configuration"}),e.jsx(l,{variant:"outline",className:"border-white/[0.08] text-white/60 hover:text-white hover:bg-white/5 hover:border-white/15",onClick:()=>x(!1),children:"Cancel"})]})]})]})}),e.jsx(Q,{open:!!f,onOpenChange:()=>h(null),children:e.jsxs(Y,{className:"max-w-sm bg-slate-900 border-white/[0.08]",children:[e.jsxs(G,{children:[e.jsxs(J,{className:"text-white flex items-center gap-2",children:[e.jsx("div",{className:"p-2 rounded-lg bg-gradient-to-br from-red-500/10 to-red-500/5 border border-red-500/15",children:e.jsx(D,{className:"w-4 h-4 text-red-400"})}),"Remove Channel"]}),e.jsx(Z,{className:"text-white/40",children:"Are you sure you want to remove this channel configuration? This action cannot be undone."})]}),e.jsxs("div",{className:"flex gap-2 pt-2",children:[e.jsx(l,{className:"flex-1 bg-gradient-to-r from-red-600 to-red-500 hover:from-red-500 hover:to-red-400 text-white border-0 shadow-lg shadow-red-500/15",onClick:()=>f&&U.mutate(f),disabled:U.isPending,children:U.isPending?e.jsxs(e.Fragment,{children:[e.jsx(C,{className:"w-4 h-4 mr-2 animate-spin"}),"Removing…"]}):"Remove"}),e.jsx(l,{variant:"outline",className:"border-white/[0.08] text-white/60 hover:text-white hover:bg-white/5 hover:border-white/15",onClick:()=>h(null),children:"Cancel"})]})]})})]})}export{ze as ChannelsContent,Ht as default};