// @bun
import{gql as _}from"@apollo/client";import{useQuery as b}from"@apollo/client/react";import{useTemplateRuntime as f}from"@contractspec/lib.example-shared-ui";import{MessageCircle as h,Users as T}from"lucide-react";import{useMemo as C}from"react";import{jsx as X,jsxs as W}from"react/jsx-runtime";var w=_`
  query Conversations($projectId: ID!) {
    conversations(projectId: $projectId) {
      id
      name
      isGroup
      updatedAt
      participants {
        id
        userId
        displayName
      }
    }
  }
`;function G({selectedId:z,onSelect:F}){let{projectId:$}=f(),{data:K,loading:J}=b(w,{variables:{projectId:$},fetchPolicy:"cache-and-network"}),P=C(()=>K?.conversations??[],[K]);return W("aside",{className:"h-full overflow-y-auto rounded-2xl border border-border bg-card",children:[W("header",{className:"px -4 flex items-center justify-between border-border border-b px-4 py-3",children:[W("div",{children:[X("p",{className:"font-semibold text-sm",children:"Conversations"}),X("p",{className:"text-muted-foreground text-xs",children:J?"Loading\u2026":`${P.length} active`})]}),X(T,{className:"h-4 w-4 text-muted-foreground"})]}),W("div",{className:"divide-y divide-border/70",children:[P.map((H)=>{let k=z===H.id;return W("button",{type:"button",className:`flex w-full flex-col items-start gap-1 px-4 py-3 text-left transition ${k?"bg-violet-500/10 text-foreground":"hover:bg-muted/40"}`,onClick:()=>F?.(H.id),children:[W("div",{className:"flex items-center gap-2",children:[X(h,{className:"h-4 w-4 text-muted-foreground"}),X("span",{className:"font-medium text-sm",children:H.name||"Untitled conversation"})]}),X("p",{className:"text-muted-foreground text-xs",children:H.participants.map((V)=>V.displayName||V.userId).join(" \xB7 ")})]},H.id)}),!J&&P.length===0?X("p",{className:"p-4 text-center text-muted-foreground text-xs",children:"No conversations yet."}):null]})]})}import{gql as U}from"@apollo/client";import{useMutation as R,useQuery as E}from"@apollo/client/react";import{useTemplateRuntime as M}from"@contractspec/lib.example-shared-ui";import{useEffect as Y,useRef as S}from"react";import{jsx as Z,jsxs as q}from"react/jsx-runtime";var y=U`
  query Messages($conversationId: ID!) {
    messages(conversationId: $conversationId, limit: 50) {
      id
      content
      senderId
      senderName
      createdAt
      status
    }
  }
`,p=U`
  mutation SetMessagesRead($conversationId: ID!, $userId: String!) {
    setMessagesRead(conversationId: $conversationId, userId: $userId)
  }
`;function D({conversationId:z,viewerId:F="local-user"}){let $=S(null),K=Boolean(z),{data:J,loading:P}=E(y,{variables:{conversationId:z},skip:!K,fetchPolicy:"cache-and-network"}),[H]=R(p),{projectId:k}=M(),V=J?.messages??[];if(Y(()=>{if(!K||!z)return;H({variables:{conversationId:z,userId:F}}).catch(()=>{})},[z,K,H,F]),Y(()=>{let B=$.current;if(!B)return;B.scrollTop=B.scrollHeight},[V]),!z)return Z("div",{className:"flex flex-1 items-center justify-center rounded-2xl border border-border border-dashed",children:Z("p",{className:"text-muted-foreground text-sm",children:"Select a conversation"})});return Z("div",{className:"flex flex-1 flex-col rounded-2xl border border-border bg-card",children:Z("div",{ref:$,className:"flex-1 space-y-3 overflow-y-auto p-4",children:P?Z("p",{className:"text-center text-muted-foreground text-sm",children:"Loading\u2026"}):V.slice().reverse().map((B)=>q("div",{className:`flex flex-col ${B.senderId===F?"items-end":"items-start"}`,children:[Z("div",{className:`max-w-xs rounded-2xl px-3 py-2 text-sm ${B.senderId===F?"bg-violet-500 text-white":"bg-muted text-foreground"}`,children:Z("p",{children:B.content})}),q("span",{className:"mt-1 text-muted-foreground text-xs",children:[B.senderName||B.senderId," \xB7"," ",new Date(B.createdAt).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})]})]},B.id))})})}import{gql as u}from"@apollo/client";import{useMutation as l}from"@apollo/client/react";import{useTemplateRuntime as g}from"@contractspec/lib.example-shared-ui";import{Send as j}from"lucide-react";import{useState as m}from"react";import{jsx as A,jsxs as N}from"react/jsx-runtime";var x=u`
  mutation SendMessage($input: SendMessageInput!) {
    sendMessage(input: $input) {
      id
    }
  }
`;function L({conversationId:z,viewerId:F="local-user",viewerName:$="You"}){let{projectId:K}=g(),[J,P]=m(""),[H,{loading:k}]=l(x);return N("form",{onSubmit:async(B)=>{if(B.preventDefault(),!z||!J.trim())return;await H({variables:{input:{projectId:K,conversationId:z,senderId:F,senderName:$,content:J.trim()}},refetchQueries:[{query:y,variables:{conversationId:z}}]}),P("")},className:"mt-3 flex items-center gap-2 rounded-2xl border border-border bg-card px-4 py-3",children:[A("input",{type:"text",className:"flex-1 bg-transparent text-foreground text-sm outline-none",placeholder:z?"Type a message\u2026":"Select a conversation to start",disabled:!z||k,value:J,onChange:(B)=>P(B.target.value)}),N("button",{type:"submit",className:"btn-primary inline-flex items-center gap-1 text-sm",disabled:!z||k||!J.trim(),children:[A(j,{className:"h-4 w-4"}),"Send"]})]})}import{registerTemplateComponents as I}from"@contractspec/lib.example-shared-ui";import{useState as v}from"react";import{jsx as O,jsxs as Q}from"react/jsx-runtime";function d(){let[z,F]=v();return Q("div",{className:"grid gap-4 md:grid-cols-[280px,1fr]",children:[O(G,{selectedId:z,onSelect:F}),Q("div",{className:"flex flex-col gap-3",children:[O(D,{conversationId:z}),O(L,{conversationId:z})]})]})}I("messaging-app",{list:d,detail:D,form:L});export{d as MessagingWorkspace};
