{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "comment-thread",
  "type": "registry:block",
  "title": "Comment thread",
  "description": "Activity and comments with retained failed drafts and asynchronous posting.",
  "dependencies": [],
  "registryDependencies": [
    "button",
    "https://shine-blond.vercel.app/r/activity-feed.json"
  ],
  "files": [
    {
      "path": "blocks/comment-thread.tsx",
      "type": "registry:component",
      "target": "components/shine/comment-thread.tsx",
      "content": "\"use client\";\nimport { useId,useRef,useState } from \"react\";\nimport { Button } from \"@/components/ui/button\";\nimport { ActivityFeed, type ActivityEvent } from \"@/components/shine/activity-feed\";\nexport function CommentThread({comments,timeZone,onPost,onRetry,loading,error,readOnly=false}:{comments:ActivityEvent[];timeZone:string;onPost:(body:string)=>Promise<void>;onRetry:()=>void;loading?:boolean;error?:string;readOnly?:boolean}) {\n const id=useId(),lock=useRef(false);const [draft,setDraft]=useState(\"\"),[busy,setBusy]=useState(false),[failure,setFailure]=useState(\"\"),[status,setStatus]=useState(\"\");return <section data-product-pattern=\"comment-thread\" className=\"space-y-5\"><ActivityFeed title=\"Comments\" events={comments} timeZone={timeZone} loading={loading} error={error} onRetry={onRetry}/>{!readOnly&&<form className=\"space-y-3\" onSubmit={async event=>{event.preventDefault();if(lock.current||!draft.trim())return;lock.current=true;setBusy(true);setFailure(\"\");setStatus(\"\");try{await onPost(draft.trim());setDraft(\"\");setStatus(\"Comment posted.\");}catch(cause){setFailure(cause instanceof Error?cause.message:\"Could not post. Your draft is still here.\");}finally{lock.current=false;setBusy(false);}}}><label htmlFor={id} className=\"text-sm font-medium\">Add a comment</label><textarea id={id} required maxLength={10000} rows={4} value={draft} disabled={busy} onChange={event=>setDraft(event.target.value)} className=\"block w-full rounded-md border border-input bg-background p-3\"/><p role=\"alert\" className=\"text-sm text-destructive\">{failure}</p><p role=\"status\" className=\"text-sm\">{status}</p><Button disabled={busy||!draft.trim()}>{busy?\"Posting…\":\"Post comment\"}</Button></form>}</section>;\n}\n"
    }
  ]
}