Components
CommonPlace is built with reusable React components. Each component documented below includes props, key behaviors, and usage examples.
Content Display
| Component | File | Description |
|---|---|---|
| Feed | Feed.jsx | Main content feed with slow-feed pacing |
| Post | Post.jsx | Individual post card with intent styling |
| PostDetail | PostDetail.jsx | Full single-post view page |
| PostHeader | post-parts/PostHeader.jsx | Author name, timestamp, intent label |
| PostContent | post-parts/PostContent.jsx | Text/HTML content with truncation |
| PostActions | post-parts/PostActions.jsx | Respond, save, share, report buttons |
| PostImages | post-parts/PostImages.jsx | Responsive image grid |
| IntentBadge | post-parts/IntentBadge.jsx | Corner avatar + intent emoji overlay |
| SavePopover | post-parts/SavePopover.jsx | Save-to-shelf popover |
Content Creation
| Component | File | Description |
|---|---|---|
| CreatePost | CreatePost.jsx | Quick composer with intent-first flow |
| AdvancedComposer | AdvancedComposer.jsx | Full-page editor with style customization |
| AudienceSelector | AudienceSelector.jsx | Audience picker (public/friends/circles) |
User Spaces
| Component | File | Description |
|---|---|---|
| HomeRoom | HomeRoom.jsx | Personal profile space with modular layout |
| ModuleManager | ModuleManager.jsx | Module management with style customization |
| SavedPage | SavedPage.jsx | Saved posts and shelves management |
| Profile | Profile.jsx | User profile display |
Navigation & Layout
| Component | File | Description |
|---|---|---|
| Header | Header.jsx | Top navigation bar |
| ErrorBoundary | ErrorBoundary.jsx | Error boundary with fallback UI |
| StyleErrorBoundary | StyleErrorBoundary.jsx | Style-specific error boundary with silent fallback |
Authentication & Privacy
| Component | File | Description |
|---|---|---|
| Auth | Auth.jsx | Login, signup, and session management |
| PrivacyCurtain | PrivacyCurtain.jsx | Auto-lock overlay for idle sessions |
Messaging
| Component | File | Description |
|---|---|---|
| ConversationView | messaging/ConversationView.jsx | Single conversation thread |
| NewConversationModal | messaging/NewConversationModal.jsx | Start a new conversation |
Media & Utility
| Component | File | Description |
|---|---|---|
| Avatar | Avatar.jsx | User avatar display |
| Lightbox | post-parts/Lightbox.jsx | Full-screen image viewer |
| VoiceRecorder | VoiceRecorder.jsx | Audio recording for voice notes |
| VoicePlayer | VoicePlayer.jsx | Audio playback for voice notes |
Settings
| Component | File | Description |
|---|---|---|
| IntentStylesSettings | settings/IntentStylesSettings.jsx | Per-intent style customization |
Last updated: 2026-02-08