npx @sublay/cli add comments-social

src/components/comments-social/
├── index.ts                              # Barrel export (entry point)
├── components/                           # UI components (~18 files)
│   ├── social-comment-section.tsx        # Main component
│   ├── new-comment-form.tsx              # Comment input form
│   ├── reply-banner.tsx                  # Reply indicator
│   ├── mention-suggestions.tsx           # @ mention autocomplete
│   ├── sort-by-button.tsx               # Top/New/Old sorting
│   ├── comments-feed/
│   │   ├── comments-feed.tsx             # Feed container
│   │   ├── loaded-comments.tsx           # Comment list
│   │   ├── fetching-comments-skeletons.tsx
│   │   ├── no-comments-placeholder.tsx
│   │   └── comment/
│   │       ├── comment.tsx              # Individual comment
│   │       ├── heart-button.tsx         # Like button
│   │       └── replies.tsx
│   └── modals/
│       ├── report-comment-modal/        # Report modal
│       └── delete-comment-modal/        # Delete confirmation
├── hooks/
│   ├── use-social-comments.tsx          # Main comment logic
│   └── use-ui-state.tsx                 # UI state management
├── utils/
│   └── prop-comparison.ts
└── context/
    └── ui-state-context.tsx

import { SocialCommentSection } from './components/comments-social';

function Post({ post }) {
  return (
    <div>
      <img src={post.image} alt={post.caption} />
      <p>{post.caption}</p>
      <SocialCommentSection entityId={post.id} />
    </div>
  );
}