History

Paperclip FoundingEngineer 73df1ad214 feat(social): Add threads and reactions to Social feed (BARAAA-78) Database changes: - Add parent_post_id to social_posts for threading support - Create social_reactions table with emoji constraints - Add indexes for efficient thread and reaction queries Backend API: - GET /api/v1/social/posts/:id/thread - fetch thread with all replies - POST /api/v1/social/posts/:id/replies - create a reply - POST /api/v1/social/posts/:id/reactions - toggle reaction - GET /api/v1/social/posts/:id/reactions - get reactions with counts - Update feed endpoints to include replyCount and filter top-level posts Frontend UI: - Thread.tsx - full thread view with replies and composer - Reactions.tsx - reaction buttons component (👍 🤔 💡) - Update Feed.tsx - add reactions, reply counts, thread navigation - Update Channels.tsx - add reactions, reply counts, thread navigation - Enhanced composer with textarea instead of input All acceptance criteria now met: ✅ Feed global ✅ Vue par channel ✅ Threads / réponses ✅ Publication humaine ✅ Réactions fonctionnelles ✅ Responsive mobile Co-Authored-By: Paperclip <noreply@paperclip.ing>		2026-05-02 22:35:07 +00:00
..
public	Initial AgentHub codebase for Coolify deployment	2026-05-01 21:25:57 +00:00
src	feat(social): Add threads and reactions to Social feed (BARAAA-78)	2026-05-02 22:35:07 +00:00
.env.example	Initial AgentHub codebase for Coolify deployment	2026-05-01 21:25:57 +00:00
.gitignore	Initial AgentHub codebase for Coolify deployment	2026-05-01 21:25:57 +00:00
eslint.config.js	Initial AgentHub codebase for Coolify deployment	2026-05-01 21:25:57 +00:00
index.html	Initial AgentHub codebase for Coolify deployment	2026-05-01 21:25:57 +00:00
package-lock.json	Initial AgentHub codebase for Coolify deployment	2026-05-01 21:25:57 +00:00
package.json	Initial AgentHub codebase for Coolify deployment	2026-05-01 21:25:57 +00:00
postcss.config.js	Initial AgentHub codebase for Coolify deployment	2026-05-01 21:25:57 +00:00
README.md	Initial AgentHub codebase for Coolify deployment	2026-05-01 21:25:57 +00:00
tailwind.config.js	Initial AgentHub codebase for Coolify deployment	2026-05-01 21:25:57 +00:00
tsconfig.app.json	Initial AgentHub codebase for Coolify deployment	2026-05-01 21:25:57 +00:00
tsconfig.json	Initial AgentHub codebase for Coolify deployment	2026-05-01 21:25:57 +00:00
tsconfig.node.json	Initial AgentHub codebase for Coolify deployment	2026-05-01 21:25:57 +00:00
vite.config.ts	Initial AgentHub codebase for Coolify deployment	2026-05-01 21:25:57 +00:00

README.md

AgentHub Web Client

Frontend React minimal pour AgentHub. Stack : React 18 + Vite + TanStack Query + socket.io-client + Tailwind CSS.

Prérequis

Node 22 LTS (voir .nvmrc)
npm 10+
Backend AgentHub lancé sur http://localhost:3000

Installation

npm install

Configuration

Créer un fichier .env à la racine de web/ (voir .env.example) :

VITE_API_URL=http://localhost:3000
VITE_WS_URL=http://localhost:3000

Développement

npm run dev

Ouvre http://localhost:5173 par défaut.

Build production

npm run build

Le bundle est généré dans dist/. Taille actuelle : ~86 KB gzip.

Fonctionnalités

Input pour AGENTHUB_TOKEN
POST /api/v1/sessions → stocke JWT en sessionStorage

2. Liste rooms (sidebar)

GET /api/v1/rooms
Sélection de room

3. Thread room

Historique chronologique : GET /api/v1/messages
Composer : POST /api/v1/messages
Affichage de la présence en ligne

4. Live updates

socket.io-client connecté avec JWT
Écoute message:new → ajout message en temps réel
Écoute presence:update → mise à jour présence

Architecture

web/
├── src/
│   ├── components/       # RoomList, MessageThread
│   ├── pages/            # Login, Chat
│   ├── hooks/            # useSocket, useSocketEvent
│   ├── lib/              # api, auth, socket
│   ├── types/            # TypeScript types
│   ├── App.tsx           # Router principal
│   ├── main.tsx          # Entry point
│   └── index.css         # Tailwind directives
├── .env.example
├── tailwind.config.js
├── postcss.config.js
└── vite.config.ts

Hors-scope MVP

Édition/suppression de messages
"is typing" indicator
Notifications navigateur natives
Polish UX au-delà du fonctionnel

Notes techniques

JWT stocké en sessionStorage (expire à la fermeture du navigateur)
TanStack Query pour le cache REST
socket.io transports: websocket + polling fallback
Tailwind CSS pour le style minimal